@anker-in/headless-ui 1.0.26-alpha.1762264700743 → 1.0.26-alpha.1762309798335
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";"use client";var
|
|
1
|
+
"use strict";"use client";var v=Object.defineProperty;var H=Object.getOwnPropertyDescriptor;var z=Object.getOwnPropertyNames;var E=Object.prototype.hasOwnProperty;var O=(s,n)=>{for(var i in n)v(s,i,{get:n[i],enumerable:!0})},P=(s,n,i,r)=>{if(n&&typeof n=="object"||typeof n=="function")for(let e of z(n))!E.call(s,e)&&e!==i&&v(s,e,{get:()=>n[e],enumerable:!(r=H(n,e))||r.enumerable});return s};var Z=s=>P(v({},"__esModule",{value:!0}),s);var _={};O(_,{CountdownByEndDate:()=>M,default:()=>B});module.exports=Z(_);var t=require("react/jsx-runtime"),d=require("../../helpers/index.js"),a=require("react");const c=(s,n=2)=>String(Math.abs(s)).padStart(n,"0"),l="h-full text-center bg-info-white text-xs text-info-primary lg-desktop:p-1 p-0.5 font-semibold border-box",m="lg-desktop:text-2xl lg-desktop:h-7 text-xl h-6 lg-desktop:w-10 w-9 font-bold",M=({endDate:s,endDate_tz:n,locale:i,onExpire:r})=>{const e=(0,a.useRef)(Date.parse(s)),[y,x]=(0,a.useState)(()=>{const o=e.current;return isNaN(o)?0:Math.max(0,o-Date.now())}),[u,N]=(0,a.useState)(()=>{const o=e.current;return!isNaN(o)&&o<=Date.now()});(0,a.useEffect)(()=>{e.current=Date.parse(s),x(isNaN(e.current)?0:Math.max(0,e.current-Date.now()));const o=e.current;N(!isNaN(o)&&o<=Date.now())},[s]),(0,a.useEffect)(()=>{if(u||isNaN(e.current))return;let o=!1;const p=()=>{const F=Date.now(),D=Math.max(0,e.current-F);x(D),D<=0&&!o&&(o=!0,N(!0),r?.())};p();const T=window.setInterval(p,1e3);return()=>clearInterval(T)},[r,u]);const g=Math.floor(y/1e3),S=g%60,h=Math.floor(g/60),k=h%60,w=Math.floor(h/60),C=w%24,I=Math.floor(w/24),R=n||Intl.DateTimeFormat().resolvedOptions().timeZone;let b="\u2014";const f=e.current;if(!isNaN(f))try{const o=new Date(f);b=new Intl.DateTimeFormat(i||navigator.language,{timeZone:R,year:"numeric",month:"2-digit",day:"2-digit",hour:"2-digit",minute:"2-digit",second:"2-digit"}).format(o)}catch{b=new Date(f).toISOString()}return u?null:(0,t.jsxs)("div",{className:"w-full flex gap-1 items-center countdown-box","aria-live":"polite",children:[(0,t.jsxs)("div",{className:(0,d.cn)(l,"time-days-box"),children:[(0,t.jsx)("p",{className:m,children:c(I,2)}),(0,t.jsx)("div",{children:"Day"})]}),(0,t.jsx)("div",{className:"text-2xl font-bold text-info-white",children:":"}),(0,t.jsxs)("div",{className:(0,d.cn)(l,"time-hours-box"),children:[(0,t.jsx)("p",{className:m,children:c(C,2)}),(0,t.jsx)("div",{children:"Hours"})]}),(0,t.jsx)("div",{className:"text-2xl font-bold text-info-white",children:":"}),(0,t.jsxs)("div",{className:(0,d.cn)(l,"time-minutes-box"),children:[(0,t.jsx)("p",{className:m,children:c(k,2)}),(0,t.jsx)("div",{children:"Mins"})]}),(0,t.jsx)("div",{className:"text-2xl font-bold text-info-white",children:":"}),(0,t.jsxs)("div",{className:(0,d.cn)(l,"time-seconds-box"),children:[(0,t.jsx)("p",{className:m,children:c(S,2)}),(0,t.jsx)("div",{children:"Secs"})]})]})};var B=M;
|
|
2
2
|
//# sourceMappingURL=Countdown.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/HeroBanner/Countdown.tsx"],
|
|
4
|
-
"sourcesContent": ["'use client'\nimport { cn } from '../../helpers/index.js'\nimport React, { useEffect, useRef, useState } from 'react'\n\ntype Props = {\n endDate: string // ISO UTC \u5B57\u7B26\u4E32\uFF0C\u4F8B\u5982 \"2025-11-02T07:42:00.000Z\"\n endDate_tz?: string // \u65F6\u533A\uFF0C\u4F8B\u5982 \"Asia/Dhaka\"\uFF08\u53EF\u9009\uFF09\n locale?: string // \u683C\u5F0F\u5316\u7528\u7684 locale\uFF0C\u9ED8\u8BA4 navigator.language\n onExpire?: () => void // \u5230\u671F\u56DE\u8C03\uFF08\u53EF\u9009\uFF09\n}\n\nconst pad = (n: number, len = 2) => String(Math.abs(n)).padStart(len, '0')\n\nconst baseClass =\n 'h-full text-center bg-info-white text-xs text-info-primary lg-desktop:p-1 p-0.5 font-semibold border-box'\n\nconst textClass = 'lg-desktop:text-2xl lg-desktop:h-7 text-xl h-6 lg-desktop:w-10 w-9 font-bold'\n\nexport const CountdownByEndDate: React.FC<Props> = ({ endDate, endDate_tz, locale, onExpire }) => {\n // \u89E3\u6790\u76EE\u6807\u65F6\u95F4\uFF08\u4F7F\u7528 provided ISO\uFF0C\u82E5\u975E\u6CD5\u5219\u4E3A NaN\uFF09\n const targetMsRef = useRef<number>(Date.parse(endDate))\n const [remainingMs, setRemainingMs] = useState<number>(() => {\n const t = targetMsRef.current\n return isNaN(t) ? 0 : Math.max(0, t - Date.now())\n })\n\n // \u82E5 props.endDate \u6539\u53D8\uFF0C\u66F4\u65B0 ref \u4E0E remaining\n useEffect(() => {\n targetMsRef.current = Date.parse(endDate)\n setRemainingMs(isNaN(targetMsRef.current) ? 0 : Math.max(0, targetMsRef.current - Date.now()))\n }, [endDate])\n\n // Tick \u6BCF\u79D2\u66F4\u65B0\u5269\u4F59\u65F6\u95F4\n useEffect(() => {\n if (isNaN(targetMsRef.current)) return // \u65E0\u6548\u65E5\u671F\u4E0D\u542F\u52A8\u8BA1\u65F6\u5668\n let expiredCalled = false\n const tick = () => {\n const now = Date.now()\n const rem = Math.max(0, targetMsRef.current - now)\n setRemainingMs(rem)\n if (rem <= 0 && !expiredCalled) {\n expiredCalled = true\n onExpire?.()\n }\n }\n tick() // \u7ACB\u5373\u540C\u6B65\u4E00\u6B21\n const id = window.setInterval(tick, 1000)\n return () => clearInterval(id)\n }, [onExpire])\n\n // \u8BA1\u7B97\u5929/\u65F6/\u5206/\u79D2\n const totalSeconds = Math.floor(remainingMs / 1000)\n const seconds = totalSeconds % 60\n const totalMinutes = Math.floor(totalSeconds / 60)\n const minutes = totalMinutes % 60\n const totalHours = Math.floor(totalMinutes / 60)\n const hours = totalHours % 24\n const days = Math.floor(totalHours / 24)\n\n // \u683C\u5F0F\u5316\u76EE\u6807\u65F6\u95F4\u5E76\u663E\u793A\u5176\u65F6\u533A\uFF08\u4F7F\u7528 endDate_tz \u6216\u8005\u6D4F\u89C8\u5668\u65F6\u533A\uFF09\n const displayTz = endDate_tz || Intl.DateTimeFormat().resolvedOptions().timeZone\n let formattedTarget = '\u2014'\n const tms = targetMsRef.current\n if (!isNaN(tms)) {\n try {\n const dt = new Date(tms)\n const fmt = new Intl.DateTimeFormat(locale || navigator.language, {\n timeZone: displayTz,\n year: 'numeric',\n month: '2-digit',\n day: '2-digit',\n hour: '2-digit',\n minute: '2-digit',\n second: '2-digit',\n })\n formattedTarget = fmt.format(dt)\n } catch (e) {\n // \u82E5\u4F20\u5165\u4E86\u975E\u6CD5\u65F6\u533A\uFF0CIntl \u53EF\u80FD\u629B\u9519\uFF1B\u56DE\u9000\u663E\u793A UTC \u65F6\u95F4\n formattedTarget = new Date(tms).toISOString()\n }\n }\n\n return (\n <div className=\"w-full flex gap-1 items-center\" aria-live=\"polite\">\n {/* \u5929 */}\n <div className={cn(baseClass, 'time-days-box')}>\n <p className={textClass}>{pad(days, 2)}</p>\n <div>Day</div>\n </div>\n <div className=\"text-2xl font-bold text-info-white\">:</div>\n {/* \u65F6 */}\n <div className={cn(baseClass, 'time-hours-box')}>\n <p className={textClass}>{pad(hours, 2)}</p>\n <div>Hours</div>\n </div>\n <div className=\"text-2xl font-bold text-info-white\">:</div>\n {/* \u5206 */}\n <div className={cn(baseClass, 'time-minutes-box')}>\n <p className={textClass}>{pad(minutes, 2)}</p>\n <div>Mins</div>\n </div>\n <div className=\"text-2xl font-bold text-info-white\">:</div>\n {/* \u79D2 */}\n <div className={cn(baseClass, 'time-seconds-box')}>\n <p className={textClass}>{pad(seconds, 2)}</p>\n <div>Secs</div>\n </div>\n </div>\n )\n}\n\nexport default CountdownByEndDate\n"],
|
|
5
|
-
"mappings": "sbAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,wBAAAE,EAAA,YAAAC,IAAA,eAAAC,EAAAJ,
|
|
6
|
-
"names": ["Countdown_exports", "__export", "CountdownByEndDate", "Countdown_default", "__toCommonJS", "import_jsx_runtime", "import_helpers", "import_react", "pad", "n", "len", "baseClass", "textClass", "endDate", "endDate_tz", "locale", "onExpire", "targetMsRef", "remainingMs", "setRemainingMs", "t", "expiredCalled", "tick", "now", "rem", "id", "totalSeconds", "seconds", "totalMinutes", "minutes", "totalHours", "hours", "days", "displayTz", "formattedTarget", "tms", "dt"]
|
|
4
|
+
"sourcesContent": ["'use client'\nimport { cn } from '../../helpers/index.js'\nimport React, { useEffect, useRef, useState } from 'react'\n\ntype Props = {\n endDate: string // ISO UTC \u5B57\u7B26\u4E32\uFF0C\u4F8B\u5982 \"2025-11-02T07:42:00.000Z\"\n endDate_tz?: string // \u65F6\u533A\uFF0C\u4F8B\u5982 \"Asia/Dhaka\"\uFF08\u53EF\u9009\uFF09\n locale?: string // \u683C\u5F0F\u5316\u7528\u7684 locale\uFF0C\u9ED8\u8BA4 navigator.language\n onExpire?: () => void // \u5230\u671F\u56DE\u8C03\uFF08\u53EF\u9009\uFF09\n}\n\nconst pad = (n: number, len = 2) => String(Math.abs(n)).padStart(len, '0')\n\nconst baseClass =\n 'h-full text-center bg-info-white text-xs text-info-primary lg-desktop:p-1 p-0.5 font-semibold border-box'\n\nconst textClass = 'lg-desktop:text-2xl lg-desktop:h-7 text-xl h-6 lg-desktop:w-10 w-9 font-bold'\n\nexport const CountdownByEndDate: React.FC<Props> = ({ endDate, endDate_tz, locale, onExpire }) => {\n // \u89E3\u6790\u76EE\u6807\u65F6\u95F4\uFF08\u4F7F\u7528 provided ISO\uFF0C\u82E5\u975E\u6CD5\u5219\u4E3A NaN\uFF09\n const targetMsRef = useRef<number>(Date.parse(endDate))\n const [remainingMs, setRemainingMs] = useState<number>(() => {\n const t = targetMsRef.current\n return isNaN(t) ? 0 : Math.max(0, t - Date.now())\n })\n // \u4EC5\u5728\u521D\u59CB\u65F6\u5224\u65AD\u662F\u5426\u5DF2\u8FC7\u671F\uFF1A\u82E5\u5DF2\u8FC7\u671F\u5219\u9690\u85CF\u7EC4\u4EF6\u5E76\u4E0D\u7EE7\u7EED\u8BA1\u65F6\n const [hidden, setHidden] = useState<boolean>(() => {\n const t = targetMsRef.current\n return !isNaN(t) && t <= Date.now()\n })\n\n // \u82E5 props.endDate \u6539\u53D8\uFF0C\u66F4\u65B0 ref \u4E0E remaining\n useEffect(() => {\n targetMsRef.current = Date.parse(endDate)\n setRemainingMs(isNaN(targetMsRef.current) ? 0 : Math.max(0, targetMsRef.current - Date.now()))\n // \u5F53 endDate \u66F4\u65B0\u65F6\uFF0C\u4EC5\u8FDB\u884C\u4E00\u6B21\u662F\u5426\u8FC7\u671F\u7684\u5224\u65AD\uFF0C\u7528\u4E8E\u51B3\u5B9A\u662F\u5426\u9690\u85CF\n const t = targetMsRef.current\n setHidden(!isNaN(t) && t <= Date.now())\n }, [endDate])\n\n // Tick \u6BCF\u79D2\u66F4\u65B0\u5269\u4F59\u65F6\u95F4\n useEffect(() => {\n if (hidden) return // \u521D\u59CB\u5DF2\u8FC7\u671F\u5219\u4E0D\u542F\u52A8\u8BA1\u65F6\u5668\n if (isNaN(targetMsRef.current)) return // \u65E0\u6548\u65E5\u671F\u4E0D\u542F\u52A8\u8BA1\u65F6\u5668\n let expiredCalled = false\n const tick = () => {\n const now = Date.now()\n const rem = Math.max(0, targetMsRef.current - now)\n setRemainingMs(rem)\n if (rem <= 0 && !expiredCalled) {\n expiredCalled = true\n setHidden(true) // \u5230\u70B9\u540E\u9690\u85CF\u7EC4\u4EF6\n onExpire?.()\n }\n }\n tick() // \u7ACB\u5373\u540C\u6B65\u4E00\u6B21\n const id = window.setInterval(tick, 1000)\n return () => clearInterval(id)\n }, [onExpire, hidden])\n\n // \u8BA1\u7B97\u5929/\u65F6/\u5206/\u79D2\n const totalSeconds = Math.floor(remainingMs / 1000)\n const seconds = totalSeconds % 60\n const totalMinutes = Math.floor(totalSeconds / 60)\n const minutes = totalMinutes % 60\n const totalHours = Math.floor(totalMinutes / 60)\n const hours = totalHours % 24\n const days = Math.floor(totalHours / 24)\n\n // \u683C\u5F0F\u5316\u76EE\u6807\u65F6\u95F4\u5E76\u663E\u793A\u5176\u65F6\u533A\uFF08\u4F7F\u7528 endDate_tz \u6216\u8005\u6D4F\u89C8\u5668\u65F6\u533A\uFF09\n const displayTz = endDate_tz || Intl.DateTimeFormat().resolvedOptions().timeZone\n let formattedTarget = '\u2014'\n const tms = targetMsRef.current\n if (!isNaN(tms)) {\n try {\n const dt = new Date(tms)\n const fmt = new Intl.DateTimeFormat(locale || navigator.language, {\n timeZone: displayTz,\n year: 'numeric',\n month: '2-digit',\n day: '2-digit',\n hour: '2-digit',\n minute: '2-digit',\n second: '2-digit',\n })\n formattedTarget = fmt.format(dt)\n } catch (e) {\n // \u82E5\u4F20\u5165\u4E86\u975E\u6CD5\u65F6\u533A\uFF0CIntl \u53EF\u80FD\u629B\u9519\uFF1B\u56DE\u9000\u663E\u793A UTC \u65F6\u95F4\n formattedTarget = new Date(tms).toISOString()\n }\n }\n\n if (hidden) return null\n\n return (\n <div className=\"w-full flex gap-1 items-center countdown-box\" aria-live=\"polite\">\n {/* \u5929 */}\n <div className={cn(baseClass, 'time-days-box')}>\n <p className={textClass}>{pad(days, 2)}</p>\n <div>Day</div>\n </div>\n <div className=\"text-2xl font-bold text-info-white\">:</div>\n {/* \u65F6 */}\n <div className={cn(baseClass, 'time-hours-box')}>\n <p className={textClass}>{pad(hours, 2)}</p>\n <div>Hours</div>\n </div>\n <div className=\"text-2xl font-bold text-info-white\">:</div>\n {/* \u5206 */}\n <div className={cn(baseClass, 'time-minutes-box')}>\n <p className={textClass}>{pad(minutes, 2)}</p>\n <div>Mins</div>\n </div>\n <div className=\"text-2xl font-bold text-info-white\">:</div>\n {/* \u79D2 */}\n <div className={cn(baseClass, 'time-seconds-box')}>\n <p className={textClass}>{pad(seconds, 2)}</p>\n <div>Secs</div>\n </div>\n </div>\n )\n}\n\nexport default CountdownByEndDate\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["Countdown_exports", "__export", "CountdownByEndDate", "Countdown_default", "__toCommonJS", "import_jsx_runtime", "import_helpers", "import_react", "pad", "n", "len", "baseClass", "textClass", "endDate", "endDate_tz", "locale", "onExpire", "targetMsRef", "remainingMs", "setRemainingMs", "t", "hidden", "setHidden", "expiredCalled", "tick", "now", "rem", "id", "totalSeconds", "seconds", "totalMinutes", "minutes", "totalHours", "hours", "days", "displayTz", "formattedTarget", "tms", "dt"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use client";import{jsx as
|
|
1
|
+
"use client";import{jsx as e,jsxs as n}from"react/jsx-runtime";import{cn as a}from"../../helpers/index.js";import{useEffect as b,useRef as H,useState as D}from"react";const i=(s,c=2)=>String(Math.abs(s)).padStart(c,"0"),r="h-full text-center bg-info-white text-xs text-info-primary lg-desktop:p-1 p-0.5 font-semibold border-box",d="lg-desktop:text-2xl lg-desktop:h-7 text-xl h-6 lg-desktop:w-10 w-9 font-bold",z=({endDate:s,endDate_tz:c,locale:M,onExpire:f})=>{const o=H(Date.parse(s)),[y,p]=D(()=>{const t=o.current;return isNaN(t)?0:Math.max(0,t-Date.now())}),[l,v]=D(()=>{const t=o.current;return!isNaN(t)&&t<=Date.now()});b(()=>{o.current=Date.parse(s),p(isNaN(o.current)?0:Math.max(0,o.current-Date.now()));const t=o.current;v(!isNaN(t)&&t<=Date.now())},[s]),b(()=>{if(l||isNaN(o.current))return;let t=!1;const u=()=>{const F=Date.now(),w=Math.max(0,o.current-F);p(w),w<=0&&!t&&(t=!0,v(!0),f?.())};u();const T=window.setInterval(u,1e3);return()=>clearInterval(T)},[f,l]);const x=Math.floor(y/1e3),S=x%60,N=Math.floor(x/60),k=N%60,g=Math.floor(N/60),C=g%24,I=Math.floor(g/24),R=c||Intl.DateTimeFormat().resolvedOptions().timeZone;let h="\u2014";const m=o.current;if(!isNaN(m))try{const t=new Date(m);h=new Intl.DateTimeFormat(M||navigator.language,{timeZone:R,year:"numeric",month:"2-digit",day:"2-digit",hour:"2-digit",minute:"2-digit",second:"2-digit"}).format(t)}catch{h=new Date(m).toISOString()}return l?null:n("div",{className:"w-full flex gap-1 items-center countdown-box","aria-live":"polite",children:[n("div",{className:a(r,"time-days-box"),children:[e("p",{className:d,children:i(I,2)}),e("div",{children:"Day"})]}),e("div",{className:"text-2xl font-bold text-info-white",children:":"}),n("div",{className:a(r,"time-hours-box"),children:[e("p",{className:d,children:i(C,2)}),e("div",{children:"Hours"})]}),e("div",{className:"text-2xl font-bold text-info-white",children:":"}),n("div",{className:a(r,"time-minutes-box"),children:[e("p",{className:d,children:i(k,2)}),e("div",{children:"Mins"})]}),e("div",{className:"text-2xl font-bold text-info-white",children:":"}),n("div",{className:a(r,"time-seconds-box"),children:[e("p",{className:d,children:i(S,2)}),e("div",{children:"Secs"})]})]})};var Z=z;export{z as CountdownByEndDate,Z as default};
|
|
2
2
|
//# sourceMappingURL=Countdown.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/HeroBanner/Countdown.tsx"],
|
|
4
|
-
"sourcesContent": ["'use client'\nimport { cn } from '../../helpers/index.js'\nimport React, { useEffect, useRef, useState } from 'react'\n\ntype Props = {\n endDate: string // ISO UTC \u5B57\u7B26\u4E32\uFF0C\u4F8B\u5982 \"2025-11-02T07:42:00.000Z\"\n endDate_tz?: string // \u65F6\u533A\uFF0C\u4F8B\u5982 \"Asia/Dhaka\"\uFF08\u53EF\u9009\uFF09\n locale?: string // \u683C\u5F0F\u5316\u7528\u7684 locale\uFF0C\u9ED8\u8BA4 navigator.language\n onExpire?: () => void // \u5230\u671F\u56DE\u8C03\uFF08\u53EF\u9009\uFF09\n}\n\nconst pad = (n: number, len = 2) => String(Math.abs(n)).padStart(len, '0')\n\nconst baseClass =\n 'h-full text-center bg-info-white text-xs text-info-primary lg-desktop:p-1 p-0.5 font-semibold border-box'\n\nconst textClass = 'lg-desktop:text-2xl lg-desktop:h-7 text-xl h-6 lg-desktop:w-10 w-9 font-bold'\n\nexport const CountdownByEndDate: React.FC<Props> = ({ endDate, endDate_tz, locale, onExpire }) => {\n // \u89E3\u6790\u76EE\u6807\u65F6\u95F4\uFF08\u4F7F\u7528 provided ISO\uFF0C\u82E5\u975E\u6CD5\u5219\u4E3A NaN\uFF09\n const targetMsRef = useRef<number>(Date.parse(endDate))\n const [remainingMs, setRemainingMs] = useState<number>(() => {\n const t = targetMsRef.current\n return isNaN(t) ? 0 : Math.max(0, t - Date.now())\n })\n\n // \u82E5 props.endDate \u6539\u53D8\uFF0C\u66F4\u65B0 ref \u4E0E remaining\n useEffect(() => {\n targetMsRef.current = Date.parse(endDate)\n setRemainingMs(isNaN(targetMsRef.current) ? 0 : Math.max(0, targetMsRef.current - Date.now()))\n }, [endDate])\n\n // Tick \u6BCF\u79D2\u66F4\u65B0\u5269\u4F59\u65F6\u95F4\n useEffect(() => {\n if (isNaN(targetMsRef.current)) return // \u65E0\u6548\u65E5\u671F\u4E0D\u542F\u52A8\u8BA1\u65F6\u5668\n let expiredCalled = false\n const tick = () => {\n const now = Date.now()\n const rem = Math.max(0, targetMsRef.current - now)\n setRemainingMs(rem)\n if (rem <= 0 && !expiredCalled) {\n expiredCalled = true\n onExpire?.()\n }\n }\n tick() // \u7ACB\u5373\u540C\u6B65\u4E00\u6B21\n const id = window.setInterval(tick, 1000)\n return () => clearInterval(id)\n }, [onExpire])\n\n // \u8BA1\u7B97\u5929/\u65F6/\u5206/\u79D2\n const totalSeconds = Math.floor(remainingMs / 1000)\n const seconds = totalSeconds % 60\n const totalMinutes = Math.floor(totalSeconds / 60)\n const minutes = totalMinutes % 60\n const totalHours = Math.floor(totalMinutes / 60)\n const hours = totalHours % 24\n const days = Math.floor(totalHours / 24)\n\n // \u683C\u5F0F\u5316\u76EE\u6807\u65F6\u95F4\u5E76\u663E\u793A\u5176\u65F6\u533A\uFF08\u4F7F\u7528 endDate_tz \u6216\u8005\u6D4F\u89C8\u5668\u65F6\u533A\uFF09\n const displayTz = endDate_tz || Intl.DateTimeFormat().resolvedOptions().timeZone\n let formattedTarget = '\u2014'\n const tms = targetMsRef.current\n if (!isNaN(tms)) {\n try {\n const dt = new Date(tms)\n const fmt = new Intl.DateTimeFormat(locale || navigator.language, {\n timeZone: displayTz,\n year: 'numeric',\n month: '2-digit',\n day: '2-digit',\n hour: '2-digit',\n minute: '2-digit',\n second: '2-digit',\n })\n formattedTarget = fmt.format(dt)\n } catch (e) {\n // \u82E5\u4F20\u5165\u4E86\u975E\u6CD5\u65F6\u533A\uFF0CIntl \u53EF\u80FD\u629B\u9519\uFF1B\u56DE\u9000\u663E\u793A UTC \u65F6\u95F4\n formattedTarget = new Date(tms).toISOString()\n }\n }\n\n return (\n <div className=\"w-full flex gap-1 items-center\" aria-live=\"polite\">\n {/* \u5929 */}\n <div className={cn(baseClass, 'time-days-box')}>\n <p className={textClass}>{pad(days, 2)}</p>\n <div>Day</div>\n </div>\n <div className=\"text-2xl font-bold text-info-white\">:</div>\n {/* \u65F6 */}\n <div className={cn(baseClass, 'time-hours-box')}>\n <p className={textClass}>{pad(hours, 2)}</p>\n <div>Hours</div>\n </div>\n <div className=\"text-2xl font-bold text-info-white\">:</div>\n {/* \u5206 */}\n <div className={cn(baseClass, 'time-minutes-box')}>\n <p className={textClass}>{pad(minutes, 2)}</p>\n <div>Mins</div>\n </div>\n <div className=\"text-2xl font-bold text-info-white\">:</div>\n {/* \u79D2 */}\n <div className={cn(baseClass, 'time-seconds-box')}>\n <p className={textClass}>{pad(seconds, 2)}</p>\n <div>Secs</div>\n </div>\n </div>\n )\n}\n\nexport default CountdownByEndDate\n"],
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": ["jsx", "jsxs", "cn", "useEffect", "useRef", "useState", "pad", "n", "len", "baseClass", "textClass", "CountdownByEndDate", "endDate", "endDate_tz", "locale", "onExpire", "targetMsRef", "remainingMs", "setRemainingMs", "
|
|
4
|
+
"sourcesContent": ["'use client'\nimport { cn } from '../../helpers/index.js'\nimport React, { useEffect, useRef, useState } from 'react'\n\ntype Props = {\n endDate: string // ISO UTC \u5B57\u7B26\u4E32\uFF0C\u4F8B\u5982 \"2025-11-02T07:42:00.000Z\"\n endDate_tz?: string // \u65F6\u533A\uFF0C\u4F8B\u5982 \"Asia/Dhaka\"\uFF08\u53EF\u9009\uFF09\n locale?: string // \u683C\u5F0F\u5316\u7528\u7684 locale\uFF0C\u9ED8\u8BA4 navigator.language\n onExpire?: () => void // \u5230\u671F\u56DE\u8C03\uFF08\u53EF\u9009\uFF09\n}\n\nconst pad = (n: number, len = 2) => String(Math.abs(n)).padStart(len, '0')\n\nconst baseClass =\n 'h-full text-center bg-info-white text-xs text-info-primary lg-desktop:p-1 p-0.5 font-semibold border-box'\n\nconst textClass = 'lg-desktop:text-2xl lg-desktop:h-7 text-xl h-6 lg-desktop:w-10 w-9 font-bold'\n\nexport const CountdownByEndDate: React.FC<Props> = ({ endDate, endDate_tz, locale, onExpire }) => {\n // \u89E3\u6790\u76EE\u6807\u65F6\u95F4\uFF08\u4F7F\u7528 provided ISO\uFF0C\u82E5\u975E\u6CD5\u5219\u4E3A NaN\uFF09\n const targetMsRef = useRef<number>(Date.parse(endDate))\n const [remainingMs, setRemainingMs] = useState<number>(() => {\n const t = targetMsRef.current\n return isNaN(t) ? 0 : Math.max(0, t - Date.now())\n })\n // \u4EC5\u5728\u521D\u59CB\u65F6\u5224\u65AD\u662F\u5426\u5DF2\u8FC7\u671F\uFF1A\u82E5\u5DF2\u8FC7\u671F\u5219\u9690\u85CF\u7EC4\u4EF6\u5E76\u4E0D\u7EE7\u7EED\u8BA1\u65F6\n const [hidden, setHidden] = useState<boolean>(() => {\n const t = targetMsRef.current\n return !isNaN(t) && t <= Date.now()\n })\n\n // \u82E5 props.endDate \u6539\u53D8\uFF0C\u66F4\u65B0 ref \u4E0E remaining\n useEffect(() => {\n targetMsRef.current = Date.parse(endDate)\n setRemainingMs(isNaN(targetMsRef.current) ? 0 : Math.max(0, targetMsRef.current - Date.now()))\n // \u5F53 endDate \u66F4\u65B0\u65F6\uFF0C\u4EC5\u8FDB\u884C\u4E00\u6B21\u662F\u5426\u8FC7\u671F\u7684\u5224\u65AD\uFF0C\u7528\u4E8E\u51B3\u5B9A\u662F\u5426\u9690\u85CF\n const t = targetMsRef.current\n setHidden(!isNaN(t) && t <= Date.now())\n }, [endDate])\n\n // Tick \u6BCF\u79D2\u66F4\u65B0\u5269\u4F59\u65F6\u95F4\n useEffect(() => {\n if (hidden) return // \u521D\u59CB\u5DF2\u8FC7\u671F\u5219\u4E0D\u542F\u52A8\u8BA1\u65F6\u5668\n if (isNaN(targetMsRef.current)) return // \u65E0\u6548\u65E5\u671F\u4E0D\u542F\u52A8\u8BA1\u65F6\u5668\n let expiredCalled = false\n const tick = () => {\n const now = Date.now()\n const rem = Math.max(0, targetMsRef.current - now)\n setRemainingMs(rem)\n if (rem <= 0 && !expiredCalled) {\n expiredCalled = true\n setHidden(true) // \u5230\u70B9\u540E\u9690\u85CF\u7EC4\u4EF6\n onExpire?.()\n }\n }\n tick() // \u7ACB\u5373\u540C\u6B65\u4E00\u6B21\n const id = window.setInterval(tick, 1000)\n return () => clearInterval(id)\n }, [onExpire, hidden])\n\n // \u8BA1\u7B97\u5929/\u65F6/\u5206/\u79D2\n const totalSeconds = Math.floor(remainingMs / 1000)\n const seconds = totalSeconds % 60\n const totalMinutes = Math.floor(totalSeconds / 60)\n const minutes = totalMinutes % 60\n const totalHours = Math.floor(totalMinutes / 60)\n const hours = totalHours % 24\n const days = Math.floor(totalHours / 24)\n\n // \u683C\u5F0F\u5316\u76EE\u6807\u65F6\u95F4\u5E76\u663E\u793A\u5176\u65F6\u533A\uFF08\u4F7F\u7528 endDate_tz \u6216\u8005\u6D4F\u89C8\u5668\u65F6\u533A\uFF09\n const displayTz = endDate_tz || Intl.DateTimeFormat().resolvedOptions().timeZone\n let formattedTarget = '\u2014'\n const tms = targetMsRef.current\n if (!isNaN(tms)) {\n try {\n const dt = new Date(tms)\n const fmt = new Intl.DateTimeFormat(locale || navigator.language, {\n timeZone: displayTz,\n year: 'numeric',\n month: '2-digit',\n day: '2-digit',\n hour: '2-digit',\n minute: '2-digit',\n second: '2-digit',\n })\n formattedTarget = fmt.format(dt)\n } catch (e) {\n // \u82E5\u4F20\u5165\u4E86\u975E\u6CD5\u65F6\u533A\uFF0CIntl \u53EF\u80FD\u629B\u9519\uFF1B\u56DE\u9000\u663E\u793A UTC \u65F6\u95F4\n formattedTarget = new Date(tms).toISOString()\n }\n }\n\n if (hidden) return null\n\n return (\n <div className=\"w-full flex gap-1 items-center countdown-box\" aria-live=\"polite\">\n {/* \u5929 */}\n <div className={cn(baseClass, 'time-days-box')}>\n <p className={textClass}>{pad(days, 2)}</p>\n <div>Day</div>\n </div>\n <div className=\"text-2xl font-bold text-info-white\">:</div>\n {/* \u65F6 */}\n <div className={cn(baseClass, 'time-hours-box')}>\n <p className={textClass}>{pad(hours, 2)}</p>\n <div>Hours</div>\n </div>\n <div className=\"text-2xl font-bold text-info-white\">:</div>\n {/* \u5206 */}\n <div className={cn(baseClass, 'time-minutes-box')}>\n <p className={textClass}>{pad(minutes, 2)}</p>\n <div>Mins</div>\n </div>\n <div className=\"text-2xl font-bold text-info-white\">:</div>\n {/* \u79D2 */}\n <div className={cn(baseClass, 'time-seconds-box')}>\n <p className={textClass}>{pad(seconds, 2)}</p>\n <div>Secs</div>\n </div>\n </div>\n )\n}\n\nexport default CountdownByEndDate\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["jsx", "jsxs", "cn", "useEffect", "useRef", "useState", "pad", "n", "len", "baseClass", "textClass", "CountdownByEndDate", "endDate", "endDate_tz", "locale", "onExpire", "targetMsRef", "remainingMs", "setRemainingMs", "hidden", "setHidden", "expiredCalled", "tick", "now", "rem", "id", "totalSeconds", "seconds", "totalMinutes", "minutes", "totalHours", "hours", "days", "displayTz", "formattedTarget", "tms", "dt", "Countdown_default"]
|
|
7
7
|
}
|