{"version":3,"file":"ImageSwitch.Bae-GxNe.mjs","names":["useRef","useState"],"sources":["https:/framerusercontent.com/modules/tFf53gruTu4THzXluZsV/4xLrCz6cGXPgKLEJD5DF/ImageSwitch.js"],"sourcesContent":["import{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{addPropertyControls,ControlType,RenderTarget}from\"framer\";import{useState,useEffect,useRef}from\"react\";function MenuItem({title,active,index,onSwitch}){const buttonRef=useRef(null);function onClick(event){if(!buttonRef.current||index===active){return;}onSwitch(index,buttonRef.current,event);}const className=`${active===index?\"is-active\":\"\"}`;return /*#__PURE__*/_jsx(\"li\",{children:/*#__PURE__*/_jsx(\"button\",{ref:buttonRef,className:className,type:\"button\",onClick:onClick,children:title})});}function ImageItem({image,active,index}){const className=`${active===index?\"is-active\":\"\"}`;return /*#__PURE__*/_jsx(\"img\",{className:className,src:image.src,alt:image.alt,srcSet:image.srcSet});}function SwitchList({items=[]}){const[active,setActive]=useState(0);const menuRef=useRef(null);function onSwitch(index,button,event){if(!menuRef.current){return;}railTo(menuRef.current,button);setActive(index);}function railTo(menu,button){const top=button.offsetTop;const height=button.offsetHeight;menu.style.cssText=`\n            --item-top: ${top}px;\n            --item-height: ${height}px;\n        `;}useEffect(()=>{if(!menuRef.current){return;}const menu=menuRef.current;const button=menu.querySelector(\"button.is-active\");if(!button){return;}const timer=setTimeout(()=>{railTo(menu,button);},250);return()=>{clearTimeout(timer);};},[menuRef]);return /*#__PURE__*/_jsxs(\"div\",{className:\"vaiva-listing\",children:[/*#__PURE__*/_jsx(\"ul\",{className:\"listing-menu\",ref:menuRef,children:items.map(({title},index)=>/*#__PURE__*/_jsx(MenuItem,{title:title,active:active,index:index,onSwitch:onSwitch}))}),/*#__PURE__*/_jsx(\"div\",{className:\"listing-images\",children:items.map(({image},index)=>/*#__PURE__*/_jsx(ImageItem,{image:image,active:active,index:index}))})]});}export default function ImageSwitch({items=[]}){if(RenderTarget.current()!==RenderTarget.preview){return /*#__PURE__*/_jsxs(\"div\",{style:{backgroundColor:\"#eee\",color:\"#808080\",textShadow:\"0 1px 1px rgba(0,0,0,.2)\",padding:\"50px\",textAlign:\"center\",fontSize:\"20px\"},children:[/*#__PURE__*/_jsx(\"p\",{children:\"Diese Komponente ist im Editor nicht verf\\xfcgbar!\"}),/*#__PURE__*/_jsx(\"p\",{children:\"Wechsle in die Vorschau zur Ansicht der Elemente.\"})]});}return /*#__PURE__*/_jsx(SwitchList,{items:items});}addPropertyControls(ImageSwitch,{items:{type:ControlType.Array,// title: \"Items\",\ncontrol:{type:ControlType.Object,controls:{title:{type:ControlType.String},image:{type:ControlType.ResponsiveImage}}}}})/*\naddPropertyControls(MilestonesSlider, {\n    items: {\n        type: ControlType.Array,\n        control: {\n            type: ControlType.Object,\n            controls: {\n                year: { type: ControlType.String },\n                title: { type: ControlType.String },\n                content: { type: ControlType.RichText },\n                image: { type: ControlType.ResponsiveImage },\n            },\n        },\n    },\n})\n*/;\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"ImageSwitch\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./ImageSwitch.map"],"mappings":"sMAAuK,SAAS,EAAS,CAAC,QAAM,SAAO,QAAM,YAAU,CAAC,IAAM,EAAUA,EAAO,KAAK,CAAC,SAAS,EAAQ,EAAM,CAAI,CAAC,EAAU,SAAS,IAAQ,GAAgB,EAAS,EAAM,EAAU,QAAQ,EAAM,CAAqD,OAAoB,EAAK,KAAK,CAAC,SAAsB,EAAK,SAAS,CAAC,IAAI,EAAU,UAArH,GAAG,IAAS,EAAM,YAAY,KAA2G,KAAK,SAAiB,UAAQ,SAAS,EAAM,CAAC,CAAC,CAAC,CAAE,SAAS,EAAU,CAAC,QAAM,SAAO,SAAO,CAAoD,OAAoB,EAAK,MAAM,CAAC,UAAnE,GAAG,IAAS,EAAM,YAAY,KAAyD,IAAI,EAAM,IAAI,IAAI,EAAM,IAAI,OAAO,EAAM,OAAO,CAAC,CAAE,SAAS,EAAW,CAAC,QAAM,EAAE,EAAE,CAAC,GAAK,CAAC,EAAO,GAAWC,EAAS,EAAE,CAAO,EAAQD,EAAO,KAAK,CAAC,SAAS,EAAS,EAAM,EAAO,EAAM,CAAK,EAAQ,UAAiB,EAAO,EAAQ,QAAQ,EAAO,CAAC,EAAU,EAAM,EAAE,SAAS,EAAO,EAAK,EAAO,CAAC,IAAM,EAAI,EAAO,UAAgB,EAAO,EAAO,aAAa,EAAK,MAAM,QAAQ;0BACxhC,EAAI;6BACD,EAAO;UAC2N,OAApP,MAAc,CAAC,GAAG,CAAC,EAAQ,QAAS,OAAQ,IAAM,EAAK,EAAQ,QAAc,EAAO,EAAK,cAAc,mBAAmB,CAAC,GAAG,CAAC,EAAQ,OAAQ,IAAM,EAAM,eAAe,CAAC,EAAO,EAAK,EAAO,EAAG,IAAI,CAAC,UAAU,CAAC,aAAa,EAAM,GAAK,CAAC,EAAQ,CAAC,CAAqB,EAAM,MAAM,CAAC,UAAU,gBAAgB,SAAS,CAAc,EAAK,KAAK,CAAC,UAAU,eAAe,IAAI,EAAQ,SAAS,EAAM,KAAK,CAAC,SAAO,IAAqB,EAAK,EAAS,CAAO,QAAa,SAAa,QAAe,WAAS,CAAC,CAAC,CAAC,CAAC,CAAc,EAAK,MAAM,CAAC,UAAU,iBAAiB,SAAS,EAAM,KAAK,CAAC,SAAO,IAAqB,EAAK,EAAU,CAAO,QAAa,SAAa,QAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAE,SAAwB,EAAY,CAAC,QAAM,EAAE,EAAE,CAAsZ,OAAlZ,EAAa,SAAS,GAAG,EAAa,QAAgY,EAAK,EAAW,CAAO,QAAM,CAAC,CAAjY,EAAM,MAAM,CAAC,MAAM,CAAC,gBAAgB,OAAO,MAAM,UAAU,WAAW,2BAA2B,QAAQ,OAAO,UAAU,SAAS,SAAS,OAAO,CAAC,SAAS,CAAc,EAAK,IAAI,CAAC,SAAS,kDAAqD,CAAC,CAAc,EAAK,IAAI,CAAC,SAAS,oDAAoD,CAAC,CAAC,CAAC,CAAC,kBAH5iC,IAAiE,IAA6C,CAGo/B,EAAoB,EAAY,CAAC,MAAM,CAAC,KAAK,EAAY,MACptC,QAAQ,CAAC,KAAK,EAAY,OAAO,SAAS,CAAC,MAAM,CAAC,KAAK,EAAY,OAAO,CAAC,MAAM,CAAC,KAAK,EAAY,gBAAgB,CAAC,CAAC,CAAC,CAAC,CAAC"}