{"version":3,"file":"Examples.BthtZ5_O.mjs","names":["useCallback","useRef","useState","useState"],"sources":["https:/framerusercontent.com/modules/HYcHVPAbe8jLEeU7c4mp/QiycTxX7vdblEOi3o00G/Time.js","https:/framerusercontent.com/modules/vj7bFUjvEQFgEzNBkdoG/vf3CKm378wlVcBk7IhSU/createStore.js","https:/framer.com/m/framer/store.js@^1.0.0","https:/framerusercontent.com/modules/28rXvpPsrum7FH6cMELS/1jCAazZw1EGHjrG5Nu5D/Utils.js","https:/framer.com/m/framer/utils.js@^0.9.0","https:/framerusercontent.com/modules/kW9VxigWWnGVysjYC6um/VjWxocRiueyQ7y0c9Ga1/Examples.js"],"sourcesContent":["import{jsx as _jsx}from\"react/jsx-runtime\";import{addPropertyControls,ControlType,RenderTarget,useLocaleCode}from\"framer\";import{startTransition,useCallback,useEffect,useRef,useState}from\"react\";const fontStack=`\"Inter\", system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"`;function formatTimeOrDate(outputType,{showYear,showMonth,showWeekday,showMinutes,showSeconds},timeFormat,monthFormat,localCode){const date=new Date;const onlyYearIsShown=!showWeekday&&!showMonth&&showYear;switch(outputType){case\"date\":return new Intl.DateTimeFormat(localCode,{weekday:showWeekday?\"long\":undefined,day:onlyYearIsShown?undefined:\"numeric\",month:showMonth?monthFormat:undefined,year:showYear?\"numeric\":undefined}).format(date);case\"time\":return new Intl.DateTimeFormat(localCode,{hour:\"numeric\",minute:showMinutes?\"numeric\":undefined,second:showSeconds&&showMinutes?\"numeric\":undefined,hour12:timeFormat===\"12h\"}).format(date);default:return new Intl.DateTimeFormat(localCode).format(date);}}const defaultProps={height:20,width:140,outputType:\"time\",color:\"#999\",timeFormat:\"24h\",showYear:true,showMonth:true,showWeekday:true,showMinutes:true,showSeconds:true,monthFormat:\"long\",alignment:\"center\"};/**\n * TIME AND DATE\n * FORKED FROM PROTOTYPING\n *\n * @framerIntrinsicWidth 140\n * @framerIntrinsicHeight 20\n *\n * @framerDisableUnlink\n *\n * @framerSupportedLayoutWidth any\n * @framerSupportedLayoutHeight any\n */export function Time(props){const mergedProps={...defaultProps,...props};const{outputType,timeFormat,showYear,showMonth,showWeekday,// showHours,\nshowMinutes,showSeconds,monthFormat,color,font,tabularFont}=mergedProps;const localCode=useLocaleCode();const getTextContent=useCallback(()=>formatTimeOrDate(outputType,{showYear,showMonth,showWeekday,// showHours,\n    showMinutes,showSeconds},timeFormat,monthFormat,localCode),[localCode,monthFormat,outputType,showMinutes,showMonth,showSeconds,showWeekday,showYear,timeFormat]);const timeoutRef=useRef()// FIXME: With React 19, we can remove this and return a cleanup from the ref callback\n;const updateCountdown=useCallback(node=>{if(node===null){// React calls w/ `null` on unmount or if the ref function changes.\nclearTimeout(timeoutRef.current);return;}let prev;const tick=()=>{const date=new Date;const next=new Date().setSeconds(date.getSeconds()+1,0)-+date;timeoutRef.current=setTimeout(tick,next);const textContent=getTextContent();if(prev!==textContent){node.textContent=textContent;prev=textContent;}};tick();},[getTextContent]);const[visible,setIsVisible]=useState(false);const isCanvas=RenderTarget.current()===RenderTarget.canvas;useEffect(()=>{startTransition(()=>setIsVisible(true));// Don’t want real time on Canvas\nif(isCanvas)return;},[isCanvas]);return /*#__PURE__*/_jsx(\"p\",{suppressHydrationWarning:true,style:{margin:0,padding:0,color,fontFamily:fontStack,fontWeight:500,fontSize:16,lineHeight:1,visibility:visible?\"visible\":\"hidden\",...font,fontVariantNumeric:tabularFont?\"tabular-nums\":\"normal\",whiteSpace:\"nowrap\"},ref:isCanvas?undefined:updateCountdown,children:getTextContent()});}Time.displayName=\"Time & Date\";addPropertyControls(Time,{outputType:{title:\"Type\",type:ControlType.Enum,displaySegmentedControl:true,options:[\"date\",\"time\"],optionTitles:[\"Date\",\"Time\"],defaultValue:defaultProps.outputType},showWeekday:{title:\"Day\",type:ControlType.Boolean,enabledTitle:\"Show\",disabledTitle:\"Hide\",defaultValue:defaultProps.showWeekday,hidden:props=>props.outputType!==\"date\"},showMonth:{title:\"Month\",type:ControlType.Boolean,enabledTitle:\"Show\",disabledTitle:\"Hide\",defaultValue:defaultProps.showMonth,hidden:props=>props.outputType!==\"date\"},monthFormat:{title:\"Format\",type:ControlType.Enum,options:[\"short\",\"long\",\"numeric\"],optionTitles:[\"Short\",\"Long\",\"Numeric\"],defaultValue:defaultProps.monthFormat,hidden:props=>props.outputType!==\"date\"||!props.showMonth},showYear:{title:\"Year\",type:ControlType.Boolean,enabledTitle:\"Show\",disabledTitle:\"Hide\",defaultValue:defaultProps.showYear,hidden:props=>props.outputType!==\"date\"},timeFormat:{title:\"Format\",type:ControlType.Enum,options:[\"12h\",\"24h\"],optionTitles:[\"12h\",\"24h\"],displaySegmentedControl:true,defaultValue:defaultProps.timeFormat,hidden:props=>props.outputType!==\"time\"},// showHours: {\n//     title: \"Hours\",\n//     type: ControlType.Boolean,\n//     enabledTitle: \"Show\",\n//     disabledTitle: \"Hide\",\n//     defaultValue: defaultProps.showHours,\n//     hidden: (props) => props.outputType !== \"time\",\n// },\nshowMinutes:{title:\"Minutes\",type:ControlType.Boolean,enabledTitle:\"Show\",disabledTitle:\"Hide\",defaultValue:defaultProps.showMinutes,hidden:props=>props.outputType!==\"time\"},showSeconds:{title:\"Seconds\",type:ControlType.Boolean,enabledTitle:\"Show\",disabledTitle:\"Hide\",defaultValue:defaultProps.showSeconds,hidden:props=>props.outputType!==\"time\"||!props.showMinutes},font:{type:ControlType.Font,controls:\"extended\"},tabularFont:{title:\"Tabular\",type:ControlType.Boolean,defaultValue:true},color:{type:ControlType.Color,defaultValue:defaultProps.color}});\nexport const __FramerMetadata__ = {\"exports\":{\"Time\":{\"type\":\"reactComponent\",\"name\":\"Time\",\"slots\":[],\"annotations\":{\"framerIntrinsicHeight\":\"20\",\"framerSupportedLayoutHeight\":\"any\",\"framerDisableUnlink\":\"*\",\"framerSupportedLayoutWidth\":\"any\",\"framerIntrinsicWidth\":\"140\",\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./Time.map","import{useState,useEffect}from\"react\";import{Data,useObserveData}from\"framer\";export function createStore(state1){// Use Data so that a Preview reload resets the state\nconst dataStore=Data({state:Object.freeze({...state1})});// Create a set function that updates the state\nconst setDataStore=newState=>{// If the state is an object, make sure we copy it\nif(typeof newState===\"function\"){newState=newState(dataStore.state);}dataStore.state=Object.freeze({...dataStore.state,...newState});};// Store the initial state, copy the object if it's an object\nlet storeState=typeof state1===\"object\"?Object.freeze({...state1}):state1;// Keep a list of all the listeners, in the form of React hook setters\nconst storeSetters=new Set();// Create a set function that updates all the listeners / setters\nconst setStoreState=newState=>{// If the state is an object, make sure we copy it\nif(typeof newState===\"function\"){newState=newState(storeState);}storeState=typeof newState===\"object\"?Object.freeze({...storeState,...newState}):newState;// Update all the listeners / setters with the new value\nstoreSetters.forEach(setter=>setter(storeState));};// Create the actual hook based on everything above\nfunction useStore(){// Create the hook we are going to use as a listener\nconst[state,setState]=useState(storeState);// If we unmount the component using this hook, we need to remove the listener\n// @ts-ignore\nuseEffect(()=>{// But right now, we need to add the listener\nstoreSetters.add(setState);return()=>storeSetters.delete(setState);},[]);// If Data context exists, use Data, otherwise use vanilla React state\nif(useObserveData()===true){useObserveData();return[dataStore.state,setDataStore];}else{// Return the state and a function to update the central store\nreturn[state,setStoreState];}}return useStore;}\nexport const __FramerMetadata__ = {\"exports\":{\"createStore\":{\"type\":\"function\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./createStore.map","/*\n * createStore (framer/store@1.0.1)\n *\n * Learn More: https://www.framer.com/asset-urls\n */\n\nexport * from \"https://framerusercontent.com/modules/vj7bFUjvEQFgEzNBkdoG/vf3CKm378wlVcBk7IhSU/createStore.js\"\n","export const centerContent = {\n    display: \"flex\",\n    justifyContent: \"center\",\n    alignItems: \"center\"\n};\nexport const autoSizingText = {\n    width: \"max-content\",\n    wordBreak: \"break-word\",\n    overflowWrap: \"break-word\",\n    overflow: \"hidden\",\n    whiteSpace: \"pre-wrap\",\n    flexShrink: 0\n};\nexport const defaultContainerStyles = {\n    ...centerContent,\n    overflow: \"hidden\"\n};\nexport const containerStyles = defaultContainerStyles;\nexport const randomColor = ()=>\"#\" + Math.floor(Math.random() * 16777215).toString(16)\n;\n\nexport const __FramerMetadata__ = {\"exports\":{\"centerContent\":{\"type\":\"variable\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"containerStyles\":{\"type\":\"variable\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"autoSizingText\":{\"type\":\"variable\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"defaultContainerStyles\":{\"type\":\"variable\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"randomColor\":{\"type\":\"variable\",\"annotations\":{\"framerContractVersion\":\"1\"}}}}\n//# sourceMappingURL=./Utils.map","/*\n * Utils (framer/utils@0.9.0)\n *\n * Learn More: https://www.framer.com/asset-urls\n */\n\nexport * from \"https://framerusercontent.com/modules/28rXvpPsrum7FH6cMELS/1jCAazZw1EGHjrG5Nu5D/Utils.js\"\n","import{jsx as _jsx}from\"react/jsx-runtime\";import{forwardRef}from\"react\";import{createStore}from\"https://framer.com/m/framer/store.js@^1.0.0\";import{randomColor}from\"https://framer.com/m/framer/utils.js@^0.9.0\";// Learn more: https://www.framer.com/docs/guides/overrides/\nconst useStore=createStore({background:\"#0099FF\"});export function withRotate(Component){return props=>{return /*#__PURE__*/_jsx(Component,{...props,animate:{rotate:90},transition:{duration:2}});};}export function withHover(Component){return props=>{return /*#__PURE__*/_jsx(Component,{...props,whileHover:{scale:1.05}});};}export function withRandomColor(Component){return props=>{const[store,setStore]=useStore();return /*#__PURE__*/_jsx(Component,{...props,animate:{background:store.background},onClick:()=>{setStore({background:randomColor()});}});};}export function withUppercaseText(Component){return /*#__PURE__*/forwardRef((props,ref)=>{return /*#__PURE__*/_jsx(\"span\",{style:{display:\"inline\",textTransform:\"uppercase\"},children:/*#__PURE__*/_jsx(Component,{ref:ref,...props,style:{...props.style,textTransform:\"uppercase\"}})});});}\nexport const __FramerMetadata__ = {\"exports\":{\"withHover\":{\"type\":\"reactHoc\",\"name\":\"withHover\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"withRotate\":{\"type\":\"reactHoc\",\"name\":\"withRotate\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"withRandomColor\":{\"type\":\"reactHoc\",\"name\":\"withRandomColor\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"withUppercaseText\":{\"type\":\"reactHoc\",\"name\":\"withUppercaseText\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./Examples.map"],"mappings":"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"}