{
"version": 3,
"sources": ["ssg:https://framerusercontent.com/modules/HYcHVPAbe8jLEeU7c4mp/QiycTxX7vdblEOi3o00G/Time.js", "ssg:https://framerusercontent.com/modules/bjUTEQt5uFu8cIOVtWXD/CvR35MeeJnSdIYAAt4ht/FramerIcon.js", "ssg:https://framerusercontent.com/modules/V6ktzZqglbFKXKp7DGxl/wYNpTg3zNMZUBkwYzj49/Dq1zkbs_D.js", "ssg:https://framerusercontent.com/modules/mFp5GkYXvtGVWlprzf6O/miai1ZO900aoZHhDhkDP/JkTLBSO1L.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\u2019t 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{jsx as _jsx}from\"react/jsx-runtime\";import{addPropertyControls,ControlType}from\"framer\";const DEFAULT_COLOR=\"#1570EF\";const DEFAULT_SVG=``;const DEFAULT_STROKE_WIDTH=1.5;/*\n * @framerDisableUnlink\n *\n * @framerSupportedLayoutWidth fixed\n * @framerSupportedLayoutHeight fixed\n *\n * @framerIntrinsicHeight 24\n * @framerIntrinsicWidth 24\n */export default function FramerIcons(props){const customizedSvg=getCustomizedSVG(props.svg,props.color,props.strokeWidth);return /*#__PURE__*/_jsx(\"div\",{style:{display:\"flex\",maxWidth:\"100%\",maxHeight:\"100%\",alignItems:\"center\",justifyContent:\"center\",...props.style},dangerouslySetInnerHTML:{__html:customizedSvg}});}addPropertyControls(FramerIcons,{svg:{title:\"SVG\",type:ControlType.String,defaultValue:DEFAULT_SVG},strokeWidth:{type:ControlType.Number,step:.25,min:.5,max:2,defaultValue:DEFAULT_STROKE_WIDTH,hidden:props=>hideStrokeWidth(props.svg)},color:{type:ControlType.Color,defaultValue:DEFAULT_COLOR,description:\"By [FramerIcons](https://www.framericons.com?utm=FramerIconComponent)\"}});// hide if no stroke-width or all stroke-widths are 0\nfunction hideStrokeWidth(svg){const strokeWidthMatch=svg.match(/stroke-width=\"([^\"]+)\"/g);return!strokeWidthMatch||strokeWidthMatch.every(match=>match===\"0\");}function getCustomizedSVG(svg,color=DEFAULT_COLOR,strokeWidth=DEFAULT_STROKE_WIDTH){let svgAttributes=svg.match(/]*>/)?.[0];if(!svgAttributes){svg=DEFAULT_SVG;svgAttributes=svg.match(/]*>/)?.[0];}const width=svgAttributes.match(/width=\"([^\"]*)\"/)?.[1];const height=svgAttributes.match(/height=\"([^\"]*)\"/)?.[1];const viewBox=svgAttributes.match(/viewBox=\"([^\"]*)\"/)?.[1]?.split(\" \");const viewBoxWidth=viewBox?.[2];const viewBoxHeight=viewBox?.[3];if(width&&height){svg=svg.replace(/width=\"([^\"]*)\"/,`width=\"100%\"`);svg=svg.replace(/height=\"([^\"]*)\"/,`height=\"100%\"`);}else{svg=svg.replace(/