{"version":3,"file":"Packaging.lkWClAzI.mjs","names":["useRef","useState"],"sources":["https:/framerusercontent.com/modules/XxkXQhHieSU9dCexWKNQ/FOrqhZ2c0PtvI0MZ1xs4/Packaging.js"],"sourcesContent":["import{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{useEffect,useRef,useState}from\"react\";import{addPropertyControls,ControlType}from\"framer\";export default function Box({logoSrc,backgroundImageSrc=\"https://www.frenchpaper.com/cdn/shop/products/KRAFT-TONE_Brown_Box_Kraft_100C_01_900x.jpg?v=1624629419\",backgroundColor=\"#ff0000\",useBackgroundColor=false,aspectRatio=1.5,depth=50,tiltLimit=25,scaleFactor=.8}){const sceneRef=useRef(null);const boxRef=useRef(null);const[containerSize,setContainerSize]=useState({width:400,height:300});// Calculate box dimensions based on container and aspect ratio\nconst getBoxDimensions=()=>{const maxWidth=containerSize.width*scaleFactor;const maxHeight=containerSize.height*scaleFactor;// Calculate dimensions while maintaining aspect ratio\nlet boxWidth=maxWidth;let boxHeight=maxWidth/aspectRatio;// If height exceeds container, scale based on height instead\nif(boxHeight>maxHeight){boxHeight=maxHeight;boxWidth=maxHeight*aspectRatio;}return{width:boxWidth,height:boxHeight};};const{width,height}=getBoxDimensions();// Observe container size changes\nuseEffect(()=>{const scene=sceneRef.current;if(!scene)return;const resizeObserver=new ResizeObserver(entries=>{for(const entry of entries){const{width,height}=entry.contentRect;setContainerSize({width,height});}});resizeObserver.observe(scene);return()=>{resizeObserver.disconnect();};},[]);useEffect(()=>{const scene=sceneRef.current;const box=boxRef.current;if(!scene||!box)return;const boxZ=0;// Set initial default tilt position\nbox.style.transform=`translateZ(${boxZ}px) rotateX(-20deg) rotateY(20deg) scale3d(1.05, 1.05, 1.05)`;const handleMouseMove=e=>{const rect=scene.getBoundingClientRect();const x=e.clientX-rect.left;const y=e.clientY-rect.top;const centerX=rect.width/2;const centerY=rect.height/2;const rotateY=-((x-centerX)/centerX)*tiltLimit;const rotateX=(y-centerY)/centerY*tiltLimit;box.classList.add(\"hovered\");box.style.transform=`translateZ(${boxZ}px) rotateX(${rotateX}deg) rotateY(${rotateY}deg) scale3d(1.05, 1.05, 1.05)`;box.style.boxShadow=\"0 25px 50px rgba(14,21,47,0.4), 0 10px 30px rgba(14,21,47,0.4)\";};const handleMouseLeave=()=>{box.classList.remove(\"hovered\");// Return to default tilt position when not hovered\nbox.style.transform=`translateZ(${boxZ}px) rotateX(-20deg) rotateY(20deg) scale3d(1.05, 1.05, 1.05)`;box.style.boxShadow=\"0 8px 30px rgba(14,21,47,0.6)\";};scene.addEventListener(\"mousemove\",handleMouseMove);scene.addEventListener(\"mouseleave\",handleMouseLeave);return()=>{scene.removeEventListener(\"mousemove\",handleMouseMove);scene.removeEventListener(\"mouseleave\",handleMouseLeave);};},[tiltLimit]);const getBackgroundStyle=()=>{if(useBackgroundColor){return{backgroundColor};}return{backgroundImage:`url(${backgroundImageSrc})`,backgroundSize:\"cover\",backgroundPosition:\"center\"};};const halfDepth=depth/2;const rightLeftWidth=depth;const topBottomHeight=depth;const rightLeftLeft=(width-rightLeftWidth)/2;const topBottomTop=(height-topBottomHeight)/2;return /*#__PURE__*/_jsx(\"div\",{ref:sceneRef,style:{width:\"100%\",height:\"100%\",perspective:\"800px\",display:\"flex\",justifyContent:\"center\",alignItems:\"center\"},children:/*#__PURE__*/_jsxs(\"div\",{ref:boxRef,style:{width:width,height:height,position:\"relative\",transformStyle:\"preserve-3d\",transform:`translateZ(-${halfDepth}px)`,transition:\"transform 0.3s ease\",borderRadius:\"8px\",willChange:\"transform\",boxShadow:\"0 8px 30px rgba(14, 21, 47, 0.6)\"},children:[/*#__PURE__*/_jsx(\"div\",{style:{position:\"absolute\",display:\"flex\",justifyContent:\"center\",alignItems:\"center\",...getBackgroundStyle(),border:\"1px solid #a58d6d\",boxShadow:\"0 2px 8px rgba(0, 0, 0, 0.2)\",fontSize:\"20px\",fontWeight:\"bold\",color:\"#333\",width:width,height:height,transform:`rotateY(0deg) translateZ(${halfDepth}px)`},children:/*#__PURE__*/_jsx(\"img\",{src:logoSrc,alt:\"Logo\",style:{// width: Math.min(120, width * 0.4) + \"px\",\nwidth:Math.min(160,width*.48)+\"px\",height:\"auto\",pointerEvents:\"none\",zIndex:10}})}),/*#__PURE__*/_jsx(\"div\",{style:{position:\"absolute\",display:\"flex\",justifyContent:\"center\",alignItems:\"center\",...getBackgroundStyle(),border:\"1px solid #a58d6d\",boxShadow:\"0 2px 8px rgba(0, 0, 0, 0.2)\",fontSize:\"20px\",fontWeight:\"bold\",color:\"#333\",width:width,height:height,transform:`rotateY(180deg) translateZ(${halfDepth}px)`}}),/*#__PURE__*/_jsx(\"div\",{style:{position:\"absolute\",display:\"flex\",justifyContent:\"center\",alignItems:\"center\",...getBackgroundStyle(),border:\"1px solid #a58d6d\",boxShadow:\"0 2px 8px rgba(0, 0, 0, 0.2)\",fontSize:\"20px\",fontWeight:\"bold\",color:\"#333\",width:rightLeftWidth,height:height,left:rightLeftLeft,transform:`rotateY(90deg) translateZ(${width/2}px)`}}),/*#__PURE__*/_jsx(\"div\",{style:{position:\"absolute\",display:\"flex\",justifyContent:\"center\",alignItems:\"center\",...getBackgroundStyle(),border:\"1px solid #a58d6d\",boxShadow:\"0 2px 8px rgba(0, 0, 0, 0.2)\",fontSize:\"20px\",fontWeight:\"bold\",color:\"#333\",width:rightLeftWidth,height:height,left:rightLeftLeft,transform:`rotateY(-90deg) translateZ(${width/2}px)`}}),/*#__PURE__*/_jsx(\"div\",{style:{position:\"absolute\",display:\"flex\",justifyContent:\"center\",alignItems:\"center\",...getBackgroundStyle(),border:\"1px solid #a58d6d\",boxShadow:\"0 2px 8px rgba(0, 0, 0, 0.2)\",fontSize:\"20px\",fontWeight:\"bold\",color:\"#333\",width:width,height:topBottomHeight,top:topBottomTop,transform:`rotateX(90deg) translateZ(${height/2}px)`}}),/*#__PURE__*/_jsx(\"div\",{style:{position:\"absolute\",display:\"flex\",justifyContent:\"center\",alignItems:\"center\",...getBackgroundStyle(),border:\"1px solid #a58d6d\",boxShadow:\"0 2px 8px rgba(0, 0, 0, 0.2)\",fontSize:\"20px\",fontWeight:\"bold\",color:\"#333\",width:width,height:topBottomHeight,top:topBottomTop,transform:`rotateX(-90deg) translateZ(${height/2}px)`}})]})});}// Property Controls for Framer\naddPropertyControls(Box,{useBackgroundColor:{type:ControlType.Boolean,title:\"Use Background Color\",defaultValue:false},backgroundColor:{type:ControlType.Color,title:\"Background Color\",defaultValue:\"#ff0000\",hidden:props=>!props.useBackgroundColor},backgroundImageSrc:{type:ControlType.String,title:\"Background Image URL\",defaultValue:\"https://www.frenchpaper.com/cdn/shop/products/KRAFT-TONE_Brown_Box_Kraft_100C_01_900x.jpg?v=1624629419\",hidden:props=>props.useBackgroundColor},logoSrc:{type:ControlType.String,title:\"Logo URL\",defaultValue:\"https://framerusercontent.com/images/DJpjMMSiLSpe1AsHQn2QH2CjGKI.png?scale-down-to=2048\"},aspectRatio:{type:ControlType.Number,title:\"Aspect Ratio (W:H)\",defaultValue:1.5,min:.5,max:3,step:.1},scaleFactor:{type:ControlType.Number,title:\"Scale Factor\",defaultValue:.8,min:.3,max:1,step:.05},depth:{type:ControlType.Number,title:\"Depth\",defaultValue:50,min:20,max:100,step:5},tiltLimit:{type:ControlType.Number,title:\"Tilt Limit\",defaultValue:25,min:5,max:45,step:1}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"Box\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./Packaging.map"],"mappings":"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"}