{"version":3,"file":"TimeSinceTracker.3AsnkkTF.mjs","names":["useState"],"sources":["https:/framerusercontent.com/modules/IbgF4NSP8yibzuhDpoBs/rFnd05DSRms896pWXfcW/TimeSinceTracker.js"],"sourcesContent":["// Time Since Tracker Component\nimport{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{useEffect,useState,startTransition}from\"react\";import{addPropertyControls,ControlType,RenderTarget}from\"framer\";/**\n * Time Since Tracker\n *\n * @framerSupportedLayoutWidth any-prefer-fixed\n * @framerSupportedLayoutHeight any-prefer-fixed\n */function pad(n){return n<10?`0${n}`:`${n}`;}export default function TimeSinceTracker(props){const{completedDate,dateFont,valueFont,labelFont,background,textColor,borderRadius,showLabels,style,textAlign=\"center\",valuesAlign=\"center\",valuesGap,animation=\"fade\"}=props;const isStatic=RenderTarget.current()!==RenderTarget.preview;// Parse the date at render time for accuracy\nconst dateValue=new Date(completedDate);const[now,setNow]=useState(Date.now());useEffect(()=>{if(isStatic)return;const interval=setInterval(()=>{startTransition(()=>setNow(Date.now()));},1e3);return()=>clearInterval(interval);},[isStatic]);// Calculate time since\nconst delta=Math.max(0,Math.floor((now-dateValue.getTime())/1e3));const days=Math.floor(delta/86400);const hours=Math.floor(delta%86400/3600);const minutes=Math.floor(delta%3600/60);const seconds=delta%60;// Date string for the completed date\nconst dateStr=dateValue.toLocaleString();// Styles\nconst outerStyle={...style,background,color:textColor,borderRadius,display:\"flex\",flexDirection:\"column\",alignItems:textAlign===\"left\"?\"flex-start\":textAlign===\"right\"?\"flex-end\":\"center\",justifyContent:\"center\",padding:12,minWidth:120,minHeight:60,boxSizing:\"border-box\"};const dateStyle={...dateFont,marginBottom:8,color:textColor,width:\"100%\",textAlign:textAlign,display:\"block\"};const valuesRowStyle={display:\"flex\",flexDirection:\"row\",gap:props.valuesGap??14,alignItems:\"baseline\",width:\"100%\",justifyContent:valuesAlign===\"left\"?\"flex-start\":valuesAlign===\"right\"?\"flex-end\":\"center\"};const valueStyle={...valueFont,color:textColor,minWidth:0,padding:0,margin:0,textAlign:textAlign};const labelStyle={...labelFont,color:textColor,fontSize:12,marginTop:2,letterSpacing:.5};return /*#__PURE__*/_jsxs(\"div\",{style:outerStyle,children:[/*#__PURE__*/_jsx(\"div\",{style:dateStyle,children:\"Time since completion\"}),/*#__PURE__*/_jsxs(\"div\",{style:valuesRowStyle,children:[/*#__PURE__*/_jsxs(\"div\",{style:valueStyle,children:[pad(days),/*#__PURE__*/_jsx(\"span\",{style:{fontSize:16,marginLeft:3},children:\"d\"})]}),/*#__PURE__*/_jsxs(\"div\",{style:valueStyle,children:[pad(hours),/*#__PURE__*/_jsx(\"span\",{style:{fontSize:16,marginLeft:3},children:\"h\"})]}),/*#__PURE__*/_jsxs(\"div\",{style:valueStyle,children:[pad(minutes),/*#__PURE__*/_jsx(\"span\",{style:{fontSize:16,marginLeft:3},children:\"m\"})]}),/*#__PURE__*/_jsxs(\"div\",{style:valueStyle,children:[pad(seconds),/*#__PURE__*/_jsx(\"span\",{style:{fontSize:16,marginLeft:3},children:\"s\"})]})]})]});}addPropertyControls(TimeSinceTracker,{completedDate:{type:ControlType.Date,displayTime:true,title:\"Completed Date\",defaultValue:new Date().toJSON()},showLabels:{type:ControlType.Boolean,title:\"Show Labels\",enabledTitle:\"Show\",disabledTitle:\"Hide\",defaultValue:true},background:{type:ControlType.Color,title:\"Background\",defaultValue:\"#FFFFFF\"},textColor:{type:ControlType.Color,title:\"Text Color\",defaultValue:\"#222222\"},borderRadius:{type:ControlType.Number,title:\"Radius\",defaultValue:12,min:0,max:40},dateFont:{type:ControlType.Font,title:\"Date Font\",controls:\"extended\",defaultFontType:\"sans-serif\",defaultValue:{fontSize:16,variant:\"Medium\",letterSpacing:\"-0.01em\",lineHeight:\"1.2em\"}},valueFont:{type:ControlType.Font,title:\"Value Font\",controls:\"extended\",defaultFontType:\"sans-serif\",defaultValue:{fontSize:32,variant:\"Bold\",letterSpacing:\"-0.01em\",lineHeight:\"1.2em\"}},labelFont:{type:ControlType.Font,title:\"Label Font\",controls:\"extended\",defaultFontType:\"sans-serif\",defaultValue:{fontSize:12,variant:\"Regular\",letterSpacing:\"0.01em\",lineHeight:\"1em\"}},textAlign:{type:ControlType.Enum,title:\"Text Align\",options:[\"left\",\"center\",\"right\"],optionTitles:[\"Left\",\"Center\",\"Right\"],defaultValue:\"center\"},valuesAlign:{type:ControlType.Enum,title:\"Values Align\",options:[\"left\",\"center\",\"right\"],optionTitles:[\"Left\",\"Center\",\"Right\"],defaultValue:\"center\"},valuesGap:{type:ControlType.Number,title:\"Gap Between Values\",defaultValue:14,min:0,max:40,step:1,unit:\"px\"},animation:{type:ControlType.Enum,title:\"Animation\",options:[\"fade\",\"slide\",\"scale\",\"none\"],optionTitles:[\"Fade\",\"Slide Up\",\"Scale\",\"None\"],defaultValue:\"fade\"}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"TimeSinceTracker\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./TimeSinceTracker.map"],"mappings":"iMAMG,SAAS,EAAI,EAAE,CAAC,OAAO,EAAE,GAAG,IAAI,IAAI,GAAG,IAAK,SAAwB,EAAiB,EAAM,CAAC,GAAK,CAAC,gBAAc,WAAS,YAAU,YAAU,aAAW,YAAU,eAAa,aAAW,QAAM,YAAU,SAAS,cAAY,SAAS,YAAU,YAAU,QAAQ,EAAY,EAAS,EAAa,SAAS,GAAG,EAAa,QAC5T,EAAU,IAAI,KAAK,EAAc,CAAM,CAAC,EAAI,GAAQA,EAAS,KAAK,KAAK,CAAC,CAAC,MAAc,CAAC,GAAG,EAAS,OAAO,IAAM,EAAS,gBAAgB,CAAC,MAAoB,EAAO,KAAK,KAAK,CAAC,CAAC,EAAG,IAAI,CAAC,UAAU,cAAc,EAAS,EAAG,CAAC,EAAS,CAAC,CAC/O,IAAM,EAAM,KAAK,IAAI,EAAE,KAAK,OAAO,EAAI,EAAU,SAAS,EAAE,IAAI,CAAC,CAAO,EAAK,KAAK,MAAM,EAAM,MAAM,CAAO,EAAM,KAAK,MAAM,EAAM,MAAM,KAAK,CAAO,EAAQ,KAAK,MAAM,EAAM,KAAK,GAAG,CAAO,EAAQ,EAAM,GAC5L,EAAU,gBAAgB,CACxC,IAAM,EAAW,CAAC,GAAG,EAAM,aAAW,MAAM,EAAU,eAAa,QAAQ,OAAO,cAAc,SAAS,WAAW,IAAY,OAAO,aAAa,IAAY,QAAQ,WAAW,SAAS,eAAe,SAAS,QAAQ,GAAG,SAAS,IAAI,UAAU,GAAG,UAAU,aAAa,CAAO,EAAU,CAAC,GAAG,EAAS,aAAa,EAAE,MAAM,EAAU,MAAM,OAAiB,YAAU,QAAQ,QAAQ,CAAO,EAAe,CAAC,QAAQ,OAAO,cAAc,MAAM,IAAI,EAAM,WAAW,GAAG,WAAW,WAAW,MAAM,OAAO,eAAe,IAAc,OAAO,aAAa,IAAc,QAAQ,WAAW,SAAS,CAAO,EAAW,CAAC,GAAG,EAAU,MAAM,EAAU,SAAS,EAAE,QAAQ,EAAE,OAAO,EAAY,YAAU,CAA0F,MAA1D,CAAb,GAAG,EAAyB,CAA+D,EAAM,MAAM,CAAC,MAAM,EAAW,SAAS,CAAc,EAAK,MAAM,CAAC,MAAM,EAAU,SAAS,wBAAwB,CAAC,CAAc,EAAM,MAAM,CAAC,MAAM,EAAe,SAAS,CAAc,EAAM,MAAM,CAAC,MAAM,EAAW,SAAS,CAAC,EAAI,EAAK,CAAc,EAAK,OAAO,CAAC,MAAM,CAAC,SAAS,GAAG,WAAW,EAAE,CAAC,SAAS,IAAI,CAAC,CAAC,CAAC,CAAC,CAAc,EAAM,MAAM,CAAC,MAAM,EAAW,SAAS,CAAC,EAAI,EAAM,CAAc,EAAK,OAAO,CAAC,MAAM,CAAC,SAAS,GAAG,WAAW,EAAE,CAAC,SAAS,IAAI,CAAC,CAAC,CAAC,CAAC,CAAc,EAAM,MAAM,CAAC,MAAM,EAAW,SAAS,CAAC,EAAI,EAAQ,CAAc,EAAK,OAAO,CAAC,MAAM,CAAC,SAAS,GAAG,WAAW,EAAE,CAAC,SAAS,IAAI,CAAC,CAAC,CAAC,CAAC,CAAc,EAAM,MAAM,CAAC,MAAM,EAAW,SAAS,CAAC,EAAI,EAAQ,CAAc,EAAK,OAAO,CAAC,MAAM,CAAC,SAAS,GAAG,WAAW,EAAE,CAAC,SAAS,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,kBAT98C,IAAsD,IAAiE,CASy1C,EAAoB,EAAiB,CAAC,cAAc,CAAC,KAAK,EAAY,KAAK,YAAY,GAAK,MAAM,iBAAiB,aAAa,IAAI,MAAM,CAAC,QAAQ,CAAC,CAAC,WAAW,CAAC,KAAK,EAAY,QAAQ,MAAM,cAAc,aAAa,OAAO,cAAc,OAAO,aAAa,GAAK,CAAC,WAAW,CAAC,KAAK,EAAY,MAAM,MAAM,aAAa,aAAa,UAAU,CAAC,UAAU,CAAC,KAAK,EAAY,MAAM,MAAM,aAAa,aAAa,UAAU,CAAC,aAAa,CAAC,KAAK,EAAY,OAAO,MAAM,SAAS,aAAa,GAAG,IAAI,EAAE,IAAI,GAAG,CAAC,SAAS,CAAC,KAAK,EAAY,KAAK,MAAM,YAAY,SAAS,WAAW,gBAAgB,aAAa,aAAa,CAAC,SAAS,GAAG,QAAQ,SAAS,cAAc,UAAU,WAAW,QAAQ,CAAC,CAAC,UAAU,CAAC,KAAK,EAAY,KAAK,MAAM,aAAa,SAAS,WAAW,gBAAgB,aAAa,aAAa,CAAC,SAAS,GAAG,QAAQ,OAAO,cAAc,UAAU,WAAW,QAAQ,CAAC,CAAC,UAAU,CAAC,KAAK,EAAY,KAAK,MAAM,aAAa,SAAS,WAAW,gBAAgB,aAAa,aAAa,CAAC,SAAS,GAAG,QAAQ,UAAU,cAAc,SAAS,WAAW,MAAM,CAAC,CAAC,UAAU,CAAC,KAAK,EAAY,KAAK,MAAM,aAAa,QAAQ,CAAC,OAAO,SAAS,QAAQ,CAAC,aAAa,CAAC,OAAO,SAAS,QAAQ,CAAC,aAAa,SAAS,CAAC,YAAY,CAAC,KAAK,EAAY,KAAK,MAAM,eAAe,QAAQ,CAAC,OAAO,SAAS,QAAQ,CAAC,aAAa,CAAC,OAAO,SAAS,QAAQ,CAAC,aAAa,SAAS,CAAC,UAAU,CAAC,KAAK,EAAY,OAAO,MAAM,qBAAqB,aAAa,GAAG,IAAI,EAAE,IAAI,GAAG,KAAK,EAAE,KAAK,KAAK,CAAC,UAAU,CAAC,KAAK,EAAY,KAAK,MAAM,YAAY,QAAQ,CAAC,OAAO,QAAQ,QAAQ,OAAO,CAAC,aAAa,CAAC,OAAO,WAAW,QAAQ,OAAO,CAAC,aAAa,OAAO,CAAC,CAAC"}