{"version":3,"file":"ExpandedMask.Bmps6RNg.mjs","names":["useState"],"sources":["https:/framerusercontent.com/modules/EFEWKC0Snd5yIY1rBCJW/WbhcLDJzgyq96k5T1zxS/ExpandedMask.js"],"sourcesContent":["import{jsx as _jsx}from\"react/jsx-runtime\";import{useState,useEffect,cloneElement,isValidElement}from\"react\";import{addPropertyControls,ControlType}from\"framer\";import{motion}from\"framer-motion\";/**\n * Responsive Flexbox Expandable Container\n * * @framerIntrinsicWidth 800\n * @framerIntrinsicHeight 400\n * @framerSupportedLayoutWidth any\n * @framerSupportedLayoutHeight any\n */export default function MaskExpand(props){const{children=[],orientation=\"horizontal\",collapsedWeight=1,expandedWeight=5,gap=10,animationDuration=.3,borderRadius=12,defaultExpanded=0,style}=props;const childrenArray=Array.isArray(children)?children:[children];const initialIndex=Math.min(Math.max(0,defaultExpanded),Math.max(0,childrenArray.length-1));const[expandedIndex,setExpandedIndex]=useState(initialIndex);const[hoveredIndex,setHoveredIndex]=useState(null);const isHorizontal=orientation===\"horizontal\";useEffect(()=>{setExpandedIndex(Math.min(Math.max(0,defaultExpanded),Math.max(0,childrenArray.length-1)));},[defaultExpanded,childrenArray.length]);const handleItemClick=index=>{setExpandedIndex(index);};const containerStyle={...style,display:\"flex\",flexDirection:isHorizontal?\"row\":\"column\",gap:`${gap}px`,width:\"100%\",height:\"100%\",overflow:\"hidden\",backgroundColor:\"transparent\"};const getFlexWeight=index=>{const isExpanded=index===expandedIndex;const isHovered=hoveredIndex===index;let weight=isExpanded?expandedWeight:collapsedWeight;if(isHovered&&!isExpanded){weight+=collapsedWeight*.3;}return weight;};if(childrenArray.length===0){return /*#__PURE__*/_jsx(\"div\",{style:{...containerStyle,alignItems:\"center\",justifyContent:\"center\",border:\"2px dashed #888\",borderRadius:borderRadius,color:\"#888\",backgroundColor:\"rgba(136, 136, 136, 0.1)\"},children:\"Connect items\"});}return /*#__PURE__*/_jsx(\"div\",{style:containerStyle,children:childrenArray.map((child,index)=>{const isExpanded=index===expandedIndex;return /*#__PURE__*/_jsx(motion.div,{onClick:()=>handleItemClick(index),onMouseEnter:()=>setHoveredIndex(index),onMouseLeave:()=>setHoveredIndex(null),animate:{flexGrow:getFlexWeight(index)},initial:false,transition:{duration:animationDuration,ease:\"easeInOut\"},style:{display:\"flex\",flexBasis:0,minWidth:isHorizontal?\"20px\":\"100%\",minHeight:isHorizontal?\"100%\":\"20px\",overflow:\"hidden\",borderRadius:`${borderRadius}px`,cursor:isExpanded?\"default\":\"pointer\",position:\"relative\",isolation:\"isolate\",zIndex:isExpanded?1:0},children:/*#__PURE__*/_jsx(\"div\",{style:{position:\"absolute\",top:0,left:0,width:\"100%\",height:\"100%\",display:\"flex\",alignItems:\"center\",justifyContent:\"center\"},children:/*#__PURE__*/isValidElement(child)?/*#__PURE__*/cloneElement(child,{style:{...child.props.style||{},width:\"100%\",height:\"100%\",objectFit:\"cover\"}}):child})},index);})});}addPropertyControls(MaskExpand,{children:{type:ControlType.Array,control:{type:ControlType.ComponentInstance},maxCount:10,title:\"Items\"},orientation:{type:ControlType.Enum,title:\"Orientation\",options:[\"horizontal\",\"vertical\"],optionTitles:[\"Horizontal\",\"Vertical\"],defaultValue:\"horizontal\",displaySegmentedControl:true},collapsedWeight:{type:ControlType.Number,title:\"Collapsed Ratio\",defaultValue:1,min:.1,max:10,step:.1,displayStepper:true},expandedWeight:{type:ControlType.Number,title:\"Expanded Ratio\",defaultValue:5,min:1,max:20,step:.5,displayStepper:true},gap:{type:ControlType.Number,title:\"Gap\",defaultValue:10,min:0,max:50},animationDuration:{type:ControlType.Number,title:\"Anim Duration\",defaultValue:.4,min:.1,max:2,step:.1,unit:\"s\"},borderRadius:{type:ControlType.Number,title:\"Radius\",defaultValue:12,min:0,max:100},defaultExpanded:{type:ControlType.Number,title:\"Default Open\",defaultValue:0,min:0,max:10,displayStepper:true}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"MaskExpand\",\"slots\":[\"children\"],\"annotations\":{\"framerContractVersion\":\"1\",\"framerSupportedLayoutHeight\":\"any\",\"framerIntrinsicHeight\":\"400\",\"framerIntrinsicWidth\":\"800\",\"framerSupportedLayoutWidth\":\"any\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./ExpandedMask.map"],"mappings":"iPAMG,SAAwB,EAAW,EAAM,CAAC,GAAK,CAAC,WAAS,EAAE,CAAC,cAAY,aAAa,kBAAgB,EAAE,iBAAe,EAAE,MAAI,GAAG,oBAAkB,GAAG,eAAa,GAAG,kBAAgB,EAAE,SAAO,EAAY,EAAc,MAAM,QAAQ,EAAS,CAAC,EAAS,CAAC,EAAS,CAAkG,CAAC,EAAc,GAAkBA,EAA/G,KAAK,IAAI,KAAK,IAAI,EAAE,EAAgB,CAAC,KAAK,IAAI,EAAE,EAAc,OAAO,EAAE,CAAC,CAA6D,CAAM,CAAC,EAAa,GAAiBA,EAAS,KAAK,CAAO,EAAa,IAAc,aAAa,MAAc,CAAC,EAAiB,KAAK,IAAI,KAAK,IAAI,EAAE,EAAgB,CAAC,KAAK,IAAI,EAAE,EAAc,OAAO,EAAE,CAAC,CAAC,EAAG,CAAC,EAAgB,EAAc,OAAO,CAAC,CAAC,IAAM,EAAgB,GAAO,CAAC,EAAiB,EAAM,EAAS,EAAe,CAAC,GAAG,EAAM,QAAQ,OAAO,cAAc,EAAa,MAAM,SAAS,IAAI,GAAG,EAAI,IAAI,MAAM,OAAO,OAAO,OAAO,SAAS,SAAS,gBAAgB,cAAc,CAAO,EAAc,GAAO,CAAC,IAAM,EAAW,IAAQ,EAAoB,EAAU,IAAe,EAAU,EAAO,EAAW,EAAe,EAAuE,OAApD,GAAW,CAAC,IAAY,GAAQ,EAAgB,IAAW,GAAmR,OAAvQ,EAAc,SAAS,EAAuB,EAAK,MAAM,CAAC,MAAM,CAAC,GAAG,EAAe,WAAW,SAAS,eAAe,SAAS,OAAO,kBAA+B,eAAa,MAAM,OAAO,gBAAgB,2BAA2B,CAAC,SAAS,gBAAgB,CAAC,CAAsB,EAAK,MAAM,CAAC,MAAM,EAAe,SAAS,EAAc,KAAK,EAAM,IAAQ,CAAC,IAAM,EAAW,IAAQ,EAAc,OAAoB,EAAK,EAAO,IAAI,CAAC,YAAY,EAAgB,EAAM,CAAC,iBAAiB,EAAgB,EAAM,CAAC,iBAAiB,EAAgB,KAAK,CAAC,QAAQ,CAAC,SAAS,EAAc,EAAM,CAAC,CAAC,QAAQ,GAAM,WAAW,CAAC,SAAS,EAAkB,KAAK,YAAY,CAAC,MAAM,CAAC,QAAQ,OAAO,UAAU,EAAE,SAAS,EAAa,OAAO,OAAO,UAAU,EAAa,OAAO,OAAO,SAAS,SAAS,aAAa,GAAG,EAAa,IAAI,OAAO,EAAW,UAAU,UAAU,SAAS,WAAW,UAAU,UAAU,OAAO,EAAW,EAAE,EAAE,CAAC,SAAsB,EAAK,MAAM,CAAC,MAAM,CAAC,SAAS,WAAW,IAAI,EAAE,KAAK,EAAE,MAAM,OAAO,OAAO,OAAO,QAAQ,OAAO,WAAW,SAAS,eAAe,SAAS,CAAC,SAAsB,EAAe,EAAM,CAAc,EAAa,EAAM,CAAC,MAAM,CAAC,GAAG,EAAM,MAAM,OAAO,EAAE,CAAC,MAAM,OAAO,OAAO,OAAO,UAAU,QAAQ,CAAC,CAAC,CAAC,EAAM,CAAC,CAAC,CAAC,EAAM,EAAG,CAAC,CAAC,kBANpyE,IAAkE,IAAoD,IAAkC,CAM8oE,EAAoB,EAAW,CAAC,SAAS,CAAC,KAAK,EAAY,MAAM,QAAQ,CAAC,KAAK,EAAY,kBAAkB,CAAC,SAAS,GAAG,MAAM,QAAQ,CAAC,YAAY,CAAC,KAAK,EAAY,KAAK,MAAM,cAAc,QAAQ,CAAC,aAAa,WAAW,CAAC,aAAa,CAAC,aAAa,WAAW,CAAC,aAAa,aAAa,wBAAwB,GAAK,CAAC,gBAAgB,CAAC,KAAK,EAAY,OAAO,MAAM,kBAAkB,aAAa,EAAE,IAAI,GAAG,IAAI,GAAG,KAAK,GAAG,eAAe,GAAK,CAAC,eAAe,CAAC,KAAK,EAAY,OAAO,MAAM,iBAAiB,aAAa,EAAE,IAAI,EAAE,IAAI,GAAG,KAAK,GAAG,eAAe,GAAK,CAAC,IAAI,CAAC,KAAK,EAAY,OAAO,MAAM,MAAM,aAAa,GAAG,IAAI,EAAE,IAAI,GAAG,CAAC,kBAAkB,CAAC,KAAK,EAAY,OAAO,MAAM,gBAAgB,aAAa,GAAG,IAAI,GAAG,IAAI,EAAE,KAAK,GAAG,KAAK,IAAI,CAAC,aAAa,CAAC,KAAK,EAAY,OAAO,MAAM,SAAS,aAAa,GAAG,IAAI,EAAE,IAAI,IAAI,CAAC,gBAAgB,CAAC,KAAK,EAAY,OAAO,MAAM,eAAe,aAAa,EAAE,IAAI,EAAE,IAAI,GAAG,eAAe,GAAK,CAAC,CAAC"}