{"version":3,"file":"VariantSoundPlayer.CQooby-Z.mjs","names":["useRef","useState","useCallback"],"sources":["https:/framerusercontent.com/modules/EnGKRNGQHh9ELDYTMuJS/usavkMW2WWwHdUJzNyoj/VariantSoundPlayer.js"],"sourcesContent":["import{jsx as _jsx}from\"react/jsx-runtime\";import{useEffect,useRef,useState,useCallback}from\"react\";import{addPropertyControls,ControlType,useIsStaticRenderer}from\"framer\";import{motion,AnimatePresence}from\"framer-motion\";/**\n * Variant Sound Player\n *\n * A component that plays a click sound whenever the variant changes.\n * Includes smooth micro-interactions and configurable delay.\n *\n * @framerIntrinsicWidth 300\n * @framerIntrinsicHeight 200\n *\n * @framerSupportedLayoutWidth any-prefer-fixed\n * @framerSupportedLayoutHeight any-prefer-fixed\n */export default function VariantSoundPlayer(props){const{variant=\"default\",audioFile=\"https://framerusercontent.com/assets/8w3IUatLX9a5JVJ6XPCVuHi94.mp3\",delay=0,volume=1,variants=[{label:\"default\",content:\"Default Variant\"},{label:\"hover\",content:\"Hover Variant\"},{label:\"active\",content:\"Active Variant\"}],animationDuration=.3,animationEase=\"easeInOut\",backgroundColor=\"#F5F5F5\",textColor=\"#000000\",font}=props;const audioRef=useRef(null);const timeoutRef=useRef(null);const previousVariantRef=useRef(variant);const[currentVariant,setCurrentVariant]=useState(variant);const[hasInteracted,setHasInteracted]=useState(false);const isStatic=useIsStaticRenderer();// Initialize audio element\nuseEffect(()=>{if(isStatic)return;audioRef.current=new Audio(audioFile);audioRef.current.loop=false;audioRef.current.volume=volume;audioRef.current.load();return()=>{if(audioRef.current){audioRef.current.pause();audioRef.current.src=\"\";audioRef.current=null;}};},[audioFile,isStatic]);// Update volume when prop changes\nuseEffect(()=>{if(audioRef.current){audioRef.current.volume=volume;}},[volume]);// Play sound function with overlap prevention\nconst playSound=useCallback(()=>{if(!audioRef.current||isStatic)return;// Clear any pending timeout\nif(timeoutRef.current){window.clearTimeout(timeoutRef.current);}// Start new timeout with delay\ntimeoutRef.current=window.setTimeout(()=>{// Guard against null again in case audio was cleaned up\nif(!audioRef.current)return;// Restart sound from beginning\naudioRef.current.currentTime=0;const playPromise=audioRef.current.play();if(playPromise!==undefined){playPromise.catch(error=>{console.warn(\"Audio playback failed:\",error);});}},delay*1e3);},[delay,isStatic]);// Watch for variant changes from props\nuseEffect(()=>{if(previousVariantRef.current!==variant){setCurrentVariant(variant);// Only play sound if user has interacted (browser autoplay policy)\nif(hasInteracted){playSound();}previousVariantRef.current=variant;}},[variant,playSound,hasInteracted]);// Cleanup on unmount\nuseEffect(()=>{return()=>{if(timeoutRef.current){window.clearTimeout(timeoutRef.current);}};},[]);// Handle variant cycling on interaction\nconst handleInteraction=useCallback(()=>{const currentIndex=variants.findIndex(v=>v.label===currentVariant);const nextIndex=(currentIndex+1)%variants.length;const nextVariant=variants[nextIndex].label;setHasInteracted(true);setCurrentVariant(nextVariant);previousVariantRef.current=nextVariant;playSound();},[currentVariant,variants,playSound]);const handleKeyDown=useCallback(e=>{if(e.key===\"Enter\"||e.key===\" \"){e.preventDefault();handleInteraction();}},[handleInteraction]);const currentVariantData=variants.find(v=>v.label===currentVariant)||variants[0];const getEase=()=>{switch(animationEase){case\"linear\":return\"linear\";case\"easeIn\":return\"easeIn\";case\"easeOut\":return\"easeOut\";case\"easeInOut\":return\"easeInOut\";case\"circIn\":return\"circIn\";case\"circOut\":return\"circOut\";case\"circInOut\":return\"circInOut\";case\"backIn\":return\"backIn\";case\"backOut\":return\"backOut\";case\"backInOut\":return\"backInOut\";default:return\"easeInOut\";}};return /*#__PURE__*/_jsx(\"div\",{onClick:isStatic?undefined:handleInteraction,onKeyDown:isStatic?undefined:handleKeyDown,tabIndex:isStatic?-1:0,role:\"button\",\"aria-label\":`Current variant: ${currentVariant}. Click to switch variant.`,style:{width:\"100%\",height:\"100%\",display:\"flex\",alignItems:\"center\",justifyContent:\"center\",backgroundColor,borderRadius:12,overflow:\"hidden\",position:\"relative\",cursor:isStatic?\"default\":\"pointer\",outline:\"none\"},children:/*#__PURE__*/_jsx(AnimatePresence,{mode:\"wait\",children:/*#__PURE__*/_jsx(motion.div,{initial:{opacity:0,scale:.95,y:10},animate:{opacity:1,scale:1,y:0},exit:{opacity:0,scale:1.05,y:-10},transition:{duration:animationDuration,ease:getEase()},style:{display:\"flex\",alignItems:\"center\",justifyContent:\"center\",padding:24},children:/*#__PURE__*/_jsx(\"span\",{style:{color:textColor,...font},children:currentVariantData?.content||currentVariant})},currentVariant)})});}addPropertyControls(VariantSoundPlayer,{variant:{type:ControlType.Enum,title:\"Variant\",options:[\"default\",\"hover\",\"active\",\"selected\"],defaultValue:\"default\",displaySegmentedControl:true},audioFile:{type:ControlType.File,title:\"Sound File\",allowedFileTypes:[\"mp3\",\"wav\",\"ogg\",\"m4a\"]},delay:{type:ControlType.Number,title:\"Delay\",defaultValue:0,min:0,max:1,step:.05,unit:\"s\"},volume:{type:ControlType.Number,title:\"Volume\",defaultValue:1,min:0,max:1,step:.1},variants:{type:ControlType.Array,title:\"Variants\",control:{type:ControlType.Object,controls:{label:{type:ControlType.String,title:\"Label\",defaultValue:\"variant\"},content:{type:ControlType.String,title:\"Content\",defaultValue:\"Variant Content\"}}},defaultValue:[{label:\"default\",content:\"Default Variant\"},{label:\"hover\",content:\"Hover Variant\"},{label:\"active\",content:\"Active Variant\"},{label:\"selected\",content:\"Selected Variant\"}],maxCount:8},animationDuration:{type:ControlType.Number,title:\"Animation Duration\",defaultValue:.3,min:.1,max:1,step:.05,unit:\"s\"},animationEase:{type:ControlType.Enum,title:\"Animation Ease\",options:[\"linear\",\"easeIn\",\"easeOut\",\"easeInOut\",\"circIn\",\"circOut\",\"circInOut\",\"backIn\",\"backOut\",\"backInOut\"],defaultValue:\"easeInOut\"},backgroundColor:{type:ControlType.Color,title:\"Background\",defaultValue:\"#F5F5F5\"},textColor:{type:ControlType.Color,title:\"Text Color\",defaultValue:\"#000000\"},font:{type:ControlType.Font,title:\"Font\",controls:\"extended\",defaultFontType:\"sans-serif\",defaultValue:{fontSize:\"18px\",variant:\"Semibold\",letterSpacing:\"-0.01em\",lineHeight:\"1.2em\"}}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"VariantSoundPlayer\",\"slots\":[],\"annotations\":{\"framerSupportedLayoutHeight\":\"any-prefer-fixed\",\"framerIntrinsicHeight\":\"200\",\"framerIntrinsicWidth\":\"300\",\"framerContractVersion\":\"1\",\"framerSupportedLayoutWidth\":\"any-prefer-fixed\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./VariantSoundPlayer.map"],"mappings":"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"}