@purpur/library 9.0.6 → 9.0.8

package/dist/{countdown-DxAGVUFI.mjs → countdown-DZ4IwkNy.mjs}

@@ -1,8 +1,8 @@
-import { jsxs as v, jsx as u, Fragment as A } from "react/jsx-runtime";
+import { jsxs as v, jsx as u, Fragment as T } from "react/jsx-runtime";
 import { forwardRef as k, useId as G, useState as J, useMemo as z, useEffect as K } from "react";
-import { a as M } from "./paragraph-DNtj7OLr.mjs";
+import { P as M } from "./paragraph-Ci50OF1u.mjs";
 import { V as O } from "./visually-hidden-BYFkJEp1.mjs";
-import { c as L } from "./bind-CU-R61T-.mjs";
+import { c as A } from "./bind-CU-R61T-.mjs";
 const U = {
   "purpur-countdown--size-md": "_purpur-countdown--size-md_ytnsp_1",
   "purpur-countdown--size-lg": "_purpur-countdown--size-lg_ytnsp_5",
@@ -27,10 +27,10 @@ const U = {
   "purpur-countdown-counter__label": "_purpur-countdown-counter__label_23fbu_64",
   "purpur-countdown-counter__label--abbr": "_purpur-countdown-counter__label--abbr_23fbu_71",
   "purpur-countdown-counter__label--full": "_purpur-countdown-counter__label--full_23fbu_74"
-}, m = L.bind(X), r = "purpur-countdown-counter", $ = ({ tag: t, size: a, numbers: n, counterLabels: _ }) => {
+}, m = A.bind(X), r = "purpur-countdown-counter", $ = ({ tag: t, size: a, numbers: n, counterLabels: _ }) => {
   const w = () => {
     const s = _[t], e = _[`${t}Abbr`];
-    return /* @__PURE__ */ v(A, { children: [
+    return /* @__PURE__ */ v(T, { children: [
       e && /* @__PURE__ */ u(M, { className: m(`${r}__label`, `${r}__label--abbr`), children: /* @__PURE__ */ u("abbr", { title: s, children: e }) }),
       /* @__PURE__ */ u(
         M,
@@ -94,13 +94,13 @@ const d = {
   hour: 3600 * 1e3,
   day: 1440 * 60 * 1e3
 };
-function T(t) {
+function P(t) {
   return t instanceof Date ? t : new Date(t);
 }
 function g(t) {
   return String(t).padStart(2, "0").split("");
 }
-const D = L.bind(U), o = "purpur-countdown", B = k(
+const D = A.bind(U), o = "purpur-countdown", B = k(
   ({ renderAfterEnd: t, renderBeforeStart: a, ...n }, _) => {
     const w = /* @__PURE__ */ new Date(), s = G(), {
       size: e = "lg",
@@ -108,10 +108,10 @@ const D = L.bind(U), o = "purpur-countdown", B = k(
       negative: b = !1,
       showDays: i = !0,
       variant: j = "primary",
-      className: P,
+      className: L,
       counterLabels: f,
       useMediaQueries: C = !1
-    } = n, [p, V] = J(w), N = z(() => T(n.starttime), [n.starttime]), y = z(() => T(n.endtime), [n.endtime]), { days: q, hours: x, minutes: I, seconds: S } = z(() => Z(y.getTime()), [p]);
+    } = n, [p, V] = J(w), N = z(() => P(n.starttime), [n.starttime]), y = z(() => P(n.endtime), [n.endtime]), { days: q, hours: x, minutes: I, seconds: S } = z(() => Z(y.getTime()), [p]);
     K(() => {
       if (p < N || p > y) return;
       const c = setInterval(() => V(/* @__PURE__ */ new Date()), 1e3);
@@ -122,7 +122,7 @@ const D = L.bind(U), o = "purpur-countdown", B = k(
     if (F) return t ? t(n) : null;
     const H = () => {
       const c = { size: e, counterLabels: f };
-      return /* @__PURE__ */ v(A, { children: [
+      return /* @__PURE__ */ v(T, { children: [
         i && /* @__PURE__ */ u($, { numbers: q, tag: "days", ...c }),
         /* @__PURE__ */ u($, { numbers: x, tag: "hours", ...c }),
         /* @__PURE__ */ u($, { numbers: I, tag: "minutes", ...c }),
@@ -153,7 +153,7 @@ const D = L.bind(U), o = "purpur-countdown", B = k(
         [`${o}--use-media-queries`]: C,
         [`${o}--use-container-queries`]: !C
       },
-      P
+      L
     );
     return /* @__PURE__ */ v(
       "section",
@@ -176,4 +176,4 @@ B.displayName = "Countdown";
 export {
   B as C
 };
-//# sourceMappingURL=countdown-DxAGVUFI.mjs.map
+//# sourceMappingURL=countdown-DZ4IwkNy.mjs.map

package/dist/{countdown-DxAGVUFI.mjs.map → countdown-DZ4IwkNy.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"countdown-DxAGVUFI.mjs","sources":["../../../components/countdown/src/counter.tsx","../../../components/countdown/src/utils.ts","../../../components/countdown/src/countdown.tsx"],"sourcesContent":["import React from \"react\";\nimport { Paragraph } from \"@purpur/paragraph\";\nimport c from \"classnames/bind\";\n\nimport { type CounterLabels } from \"./countdown.types\";\nimport styles from \"./counter.module.scss\";\n\nconst cx = c.bind(styles);\n\nconst rootClassName = \"purpur-countdown-counter\";\n\ninterface CounterProps {\n  numbers: string[];\n  size: \"md\" | \"lg\";\n  tag: \"days\" | \"hours\" | \"minutes\" | \"seconds\";\n  counterLabels: CounterLabels;\n}\n\nexport const Counter = ({ tag, size, numbers, counterLabels }: CounterProps) => {\n  const renderLabel = () => {\n    const label = counterLabels[tag];\n    const abbreviatedLabel = counterLabels[`${tag}Abbr`];\n\n    return (\n      <>\n        {abbreviatedLabel && (\n          <Paragraph className={cx(`${rootClassName}__label`, `${rootClassName}__label--abbr`)}>\n            <abbr title={label}>{abbreviatedLabel}</abbr>\n          </Paragraph>\n        )}\n        <Paragraph\n          className={cx(`${rootClassName}__label`, {\n            [`${rootClassName}__label--full`]: !!abbreviatedLabel,\n          })}\n        >\n          {label}\n        </Paragraph>\n      </>\n    );\n  };\n\n  return (\n    <div\n      className={cx(rootClassName, `${rootClassName}--size-${size}`)}\n      role=\"group\"\n      aria-hidden=\"true\"\n      data-testid={`counter-${tag}`}\n    >\n      <div className={cx(`${rootClassName}__number-list-container`)}>\n        {numbers.map((number, index) => {\n          return (\n            <ul\n              key={index}\n              className={cx(`${rootClassName}__number-list`)}\n              style={\n                {\n                  \"--offset\": number,\n                } as React.CSSProperties\n              }\n            >\n              {digits.map((d, i) => {\n                const selected = d === number;\n\n                return (\n                  <li\n                    key={i}\n                    className={cx(`${rootClassName}__number`, {\n                      [`${rootClassName}__number--selected`]: selected,\n                    })}\n                  >\n                    {d}\n                  </li>\n                );\n              })}\n            </ul>\n          );\n        })}\n      </div>\n\n      {renderLabel()}\n    </div>\n  );\n};\n\nconst digits = [\"0\", \"1\", \"2\", \"3\", \"4\", \"5\", \"6\", \"7\", \"8\", \"9\"];\n","export function getDiffs(endtime: number) {\n  const now = new Date().getTime();\n\n  const totalSeconds = Math.max(0, endtime - now);\n\n  const _days = Math.floor(totalSeconds / inMs.day);\n  const _hours = Math.floor((totalSeconds % inMs.day) / inMs.hour);\n  const _minutes = Math.floor((totalSeconds % inMs.hour) / inMs.minute);\n  const _seconds = Math.floor((totalSeconds % inMs.minute) / inMs.second);\n\n  const days = splitDigits(_days);\n  const hours = splitDigits(_hours);\n  const minutes = splitDigits(_minutes);\n  const seconds = splitDigits(_seconds);\n\n  return {\n    seconds,\n    minutes,\n    hours,\n    days,\n  };\n}\n\nexport const inMs = {\n  second: 1000,\n  minute: 60 * 1000,\n  hour: 60 * 60 * 1000,\n  day: 24 * 60 * 60 * 1000,\n};\n\nexport function toDate(t: string | number | Date) {\n  return t instanceof Date ? t : new Date(t);\n}\n\nexport function splitDigits(value: number) {\n  const s = String(value).padStart(2, \"0\");\n  return s.split(\"\");\n}\n","import React, { type ForwardedRef, forwardRef, useEffect, useId, useMemo, useState } from \"react\";\nimport { Paragraph } from \"@purpur/paragraph\";\nimport { VisuallyHidden } from \"@purpur/visually-hidden\";\nimport c from \"classnames/bind\";\n\nimport styles from \"./countdown.module.scss\";\nimport { type CountdownProps } from \"./countdown.types\";\nimport { Counter } from \"./counter\";\nimport { getDiffs, toDate } from \"./utils\";\n\nconst cx = c.bind(styles);\n\nconst rootClassName = \"purpur-countdown\";\n\n/**\n * Countdown component to display a countdown timer.\n * @param props - CountdownProps\n * @returns A React component that displays a countdown timer.\n */\n\nexport const Countdown = forwardRef(\n  (\n    { renderAfterEnd, renderBeforeStart, ...props }: CountdownProps,\n    ref: ForwardedRef<HTMLButtonElement>\n  ) => {\n    const nowInit = new Date();\n    const id = useId();\n\n    const {\n      size = \"lg\",\n      fullWidth = false,\n      negative = false,\n      showDays = true,\n      variant = \"primary\",\n      className,\n      counterLabels,\n      useMediaQueries = false,\n    } = props;\n\n    const [now, setNow] = useState<Date>(nowInit);\n\n    const start = useMemo(() => toDate(props.starttime), [props.starttime]);\n    const end = useMemo(() => toDate(props.endtime), [props.endtime]);\n    const { days, hours, minutes, seconds } = useMemo(() => getDiffs(end.getTime()), [now]);\n\n    useEffect(() => {\n      if (now < start || now > end) return;\n      const t = setInterval(() => setNow(new Date()), 1000);\n      return () => clearInterval(t);\n    }, [start, end, now]);\n\n    const hasNotStarted = start > now;\n    const hasEnded = end < now;\n\n    // don't render if before start or after end\n    if (hasNotStarted) return renderBeforeStart ? renderBeforeStart(props) : null;\n    if (hasEnded) return renderAfterEnd ? renderAfterEnd(props) : null;\n\n    const getCounters = () => {\n      const counterProps = { size, counterLabels };\n\n      return (\n        <>\n          {showDays && <Counter numbers={days} tag=\"days\" {...counterProps} />}\n          <Counter numbers={hours} tag=\"hours\" {...counterProps} />\n          <Counter numbers={minutes} tag=\"minutes\" {...counterProps} />\n          <Counter numbers={seconds} tag=\"seconds\" {...counterProps} />\n        </>\n      );\n    };\n\n    // Create a single announcement of the current time (only once)\n\n    const renderAnnouncer = () => {\n      const getTimeAnnouncement = () => {\n        const parts = [];\n\n        if (showDays) parts.push(`${days.join(\"\")} ${counterLabels.days}`);\n        parts.push(`${hours.join(\"\")} ${counterLabels.hours}`);\n        parts.push(`${minutes.join(\"\")} ${counterLabels.minutes}`);\n        parts.push(`${seconds.join(\"\")} ${counterLabels.seconds}`);\n\n        return parts.join(\", \");\n      };\n\n      return (\n        <VisuallyHidden\n          data-testid=\"live-region\"\n          aria-live=\"polite\"\n          aria-label={props[\"aria-label\"]}\n        >\n          {getTimeAnnouncement()}\n        </VisuallyHidden>\n      );\n    };\n\n    const counters = getCounters();\n\n    const classes = cx(\n      rootClassName,\n      `${rootClassName}--size-${size}`,\n      `${rootClassName}--variant-${variant}`,\n      {\n        [`${rootClassName}--full-width`]: fullWidth,\n        [`${rootClassName}--negative`]: negative,\n        [`${rootClassName}--show-days`]: showDays,\n        [`${rootClassName}--use-media-queries`]: useMediaQueries,\n        [`${rootClassName}--use-container-queries`]: !useMediaQueries,\n      },\n      className\n    );\n\n    return (\n      <section\n        id={id}\n        className={classes}\n        ref={ref}\n        role=\"timer\"\n        data-testid={props[\"data-testid\"]}\n      >\n        {/* Visually hidden live region that announces time only once */}\n        {renderAnnouncer()}\n        {props.label && (\n          <Paragraph className={cx(`${rootClassName}__label`)} variant=\"paragraph-100-medium\">\n            {props.label}\n          </Paragraph>\n        )}\n        <div className={cx(`${rootClassName}__counter-container`)}>{counters}</div>\n      </section>\n    );\n  }\n);\n\nCountdown.displayName = \"Countdown\";\n"],"names":["cx","c","styles","rootClassName","Counter","tag","size","numbers","counterLabels","renderLabel","label","abbreviatedLabel","jsxs","Fragment","Paragraph","jsx","number","index","digits","d","i","selected","getDiffs","endtime","now","totalSeconds","_days","inMs","_hours","_minutes","_seconds","days","splitDigits","hours","minutes","toDate","value","Countdown","forwardRef","renderAfterEnd","renderBeforeStart","props","ref","nowInit","id","useId","fullWidth","negative","showDays","variant","className","useMediaQueries","setNow","useState","start","useMemo","end","seconds","useEffect","t","hasNotStarted","hasEnded","getCounters","counterProps","renderAnnouncer","getTimeAnnouncement","parts","VisuallyHidden","counters","classes"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAOMA,IAAKC,EAAE,KAAKC,CAAM,GAElBC,IAAgB,4BASTC,IAAU,CAAC,EAAE,KAAAC,GAAK,MAAAC,GAAM,SAAAC,GAAS,eAAAC,QAAkC;AAC9E,QAAMC,IAAc,MAAM;AACxB,UAAMC,IAAQF,EAAcH,CAAG,GACzBM,IAAmBH,EAAc,GAAGH,CAAG,MAAM;AAEnD,WACE,gBAAAO,EAAAC,GAAA,EACG,UAAA;AAAA,MAAAF,uBACEG,GAAA,EAAU,WAAWd,EAAG,GAAGG,CAAa,WAAW,GAAGA,CAAa,eAAe,GACjF,UAAA,gBAAAY,EAAC,QAAA,EAAK,OAAOL,GAAQ,aAAiB,GACxC;AAAA,MAEF,gBAAAK;AAAA,QAACD;AAAA,QAAA;AAAA,UACC,WAAWd,EAAG,GAAGG,CAAa,WAAW;AAAA,YACvC,CAAC,GAAGA,CAAa,eAAe,GAAG,CAAC,CAACQ;AAAA,UAAA,CACtC;AAAA,UAEA,UAAAD;AAAA,QAAA;AAAA,MAAA;AAAA,IACH,GACF;AAAA,EAEJ;AAEA,SACE,gBAAAE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWZ,EAAGG,GAAe,GAAGA,CAAa,UAAUG,CAAI,EAAE;AAAA,MAC7D,MAAK;AAAA,MACL,eAAY;AAAA,MACZ,eAAa,WAAWD,CAAG;AAAA,MAE3B,UAAA;AAAA,QAAA,gBAAAU,EAAC,OAAA,EAAI,WAAWf,EAAG,GAAGG,CAAa,yBAAyB,GACzD,UAAAI,EAAQ,IAAI,CAACS,GAAQC,MAElB,gBAAAF;AAAA,UAAC;AAAA,UAAA;AAAA,YAEC,WAAWf,EAAG,GAAGG,CAAa,eAAe;AAAA,YAC7C,OACE;AAAA,cACE,YAAYa;AAAA,YAAA;AAAA,YAIf,UAAAE,EAAO,IAAI,CAACC,GAAGC,MAAM;AACpB,oBAAMC,IAAWF,MAAMH;AAEvB,qBACE,gBAAAD;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBAEC,WAAWf,EAAG,GAAGG,CAAa,YAAY;AAAA,oBACxC,CAAC,GAAGA,CAAa,oBAAoB,GAAGkB;AAAA,kBAAA,CACzC;AAAA,kBAEA,UAAAF;AAAA,gBAAA;AAAA,gBALIC;AAAA,cAAA;AAAA,YAQX,CAAC;AAAA,UAAA;AAAA,UArBIH;AAAA,QAAA,CAwBV,EAAA,CACH;AAAA,QAECR,EAAA;AAAA,MAAY;AAAA,IAAA;AAAA,EAAA;AAGnB,GAEMS,IAAS,CAAC,KAAK,KAAK,KAAK,KAAK,KAAK,KAAK,KAAK,KAAK,KAAK,GAAG;ACpFzD,SAASI,EAASC,GAAiB;AACxC,QAAMC,KAAM,oBAAI,KAAA,GAAO,QAAA,GAEjBC,IAAe,KAAK,IAAI,GAAGF,IAAUC,CAAG,GAExCE,IAAQ,KAAK,MAAMD,IAAeE,EAAK,GAAG,GAC1CC,IAAS,KAAK,MAAOH,IAAeE,EAAK,MAAOA,EAAK,IAAI,GACzDE,IAAW,KAAK,MAAOJ,IAAeE,EAAK,OAAQA,EAAK,MAAM,GAC9DG,IAAW,KAAK,MAAOL,IAAeE,EAAK,SAAUA,EAAK,MAAM,GAEhEI,IAAOC,EAAYN,CAAK,GACxBO,IAAQD,EAAYJ,CAAM,GAC1BM,IAAUF,EAAYH,CAAQ;AAGpC,SAAO;AAAA,IACL,SAHcG,EAAYF,CAAQ;AAAA,IAIlC,SAAAI;AAAA,IACA,OAAAD;AAAA,IACA,MAAAF;AAAA,EAAA;AAEJ;AAEO,MAAMJ,IAAO;AAAA,EAClB,QAAQ;AAAA,EACR,QAAQ,KAAK;AAAA,EACb,MAAM,OAAU;AAAA,EAChB,KAAK,OAAU,KAAK;AACtB;AAEO,SAASQ,EAAO,GAA2B;AAChD,SAAO,aAAa,OAAO,IAAI,IAAI,KAAK,CAAC;AAC3C;AAEO,SAASH,EAAYI,GAAe;AAEzC,SADU,OAAOA,CAAK,EAAE,SAAS,GAAG,GAAG,EAC9B,MAAM,EAAE;AACnB;AC3BA,MAAMpC,IAAKC,EAAE,KAAKC,CAAM,GAElBC,IAAgB,oBAQTkC,IAAYC;AAAA,EACvB,CACE,EAAE,gBAAAC,GAAgB,mBAAAC,GAAmB,GAAGC,EAAA,GACxCC,MACG;AACH,UAAMC,wBAAc,KAAA,GACdC,IAAKC,EAAA,GAEL;AAAA,MACJ,MAAAvC,IAAO;AAAA,MACP,WAAAwC,IAAY;AAAA,MACZ,UAAAC,IAAW;AAAA,MACX,UAAAC,IAAW;AAAA,MACX,SAAAC,IAAU;AAAA,MACV,WAAAC;AAAA,MACA,eAAA1C;AAAA,MACA,iBAAA2C,IAAkB;AAAA,IAAA,IAChBV,GAEE,CAACjB,GAAK4B,CAAM,IAAIC,EAAeV,CAAO,GAEtCW,IAAQC,EAAQ,MAAMpB,EAAOM,EAAM,SAAS,GAAG,CAACA,EAAM,SAAS,CAAC,GAChEe,IAAMD,EAAQ,MAAMpB,EAAOM,EAAM,OAAO,GAAG,CAACA,EAAM,OAAO,CAAC,GAC1D,EAAE,MAAAV,GAAM,OAAAE,GAAO,SAAAC,GAAS,SAAAuB,MAAYF,EAAQ,MAAMjC,EAASkC,EAAI,QAAA,CAAS,GAAG,CAAChC,CAAG,CAAC;AAEtF,IAAAkC,EAAU,MAAM;AACd,UAAIlC,IAAM8B,KAAS9B,IAAMgC,EAAK;AAC9B,YAAMG,IAAI,YAAY,MAAMP,sBAAW,KAAA,CAAM,GAAG,GAAI;AACpD,aAAO,MAAM,cAAcO,CAAC;AAAA,IAC9B,GAAG,CAACL,GAAOE,GAAKhC,CAAG,CAAC;AAEpB,UAAMoC,IAAgBN,IAAQ9B,GACxBqC,IAAWL,IAAMhC;AAGvB,QAAIoC,EAAe,QAAOpB,IAAoBA,EAAkBC,CAAK,IAAI;AACzE,QAAIoB,EAAU,QAAOtB,IAAiBA,EAAeE,CAAK,IAAI;AAE9D,UAAMqB,IAAc,MAAM;AACxB,YAAMC,IAAe,EAAE,MAAAzD,GAAM,eAAAE,EAAA;AAE7B,aACE,gBAAAI,EAAAC,GAAA,EACG,UAAA;AAAA,QAAAmC,uBAAa5C,GAAA,EAAQ,SAAS2B,GAAM,KAAI,QAAQ,GAAGgC,GAAc;AAAA,0BACjE3D,GAAA,EAAQ,SAAS6B,GAAO,KAAI,SAAS,GAAG8B,GAAc;AAAA,0BACtD3D,GAAA,EAAQ,SAAS8B,GAAS,KAAI,WAAW,GAAG6B,GAAc;AAAA,0BAC1D3D,GAAA,EAAQ,SAASqD,GAAS,KAAI,WAAW,GAAGM,EAAA,CAAc;AAAA,MAAA,GAC7D;AAAA,IAEJ,GAIMC,IAAkB,MAAM;AAC5B,YAAMC,IAAsB,MAAM;AAChC,cAAMC,IAAQ,CAAA;AAEd,eAAIlB,KAAUkB,EAAM,KAAK,GAAGnC,EAAK,KAAK,EAAE,CAAC,IAAIvB,EAAc,IAAI,EAAE,GACjE0D,EAAM,KAAK,GAAGjC,EAAM,KAAK,EAAE,CAAC,IAAIzB,EAAc,KAAK,EAAE,GACrD0D,EAAM,KAAK,GAAGhC,EAAQ,KAAK,EAAE,CAAC,IAAI1B,EAAc,OAAO,EAAE,GACzD0D,EAAM,KAAK,GAAGT,EAAQ,KAAK,EAAE,CAAC,IAAIjD,EAAc,OAAO,EAAE,GAElD0D,EAAM,KAAK,IAAI;AAAA,MACxB;AAEA,aACE,gBAAAnD;AAAA,QAACoD;AAAA,QAAA;AAAA,UACC,eAAY;AAAA,UACZ,aAAU;AAAA,UACV,cAAY1B,EAAM,YAAY;AAAA,UAE7B,UAAAwB,EAAA;AAAA,QAAoB;AAAA,MAAA;AAAA,IAG3B,GAEMG,IAAWN,EAAA,GAEXO,IAAUrE;AAAA,MACdG;AAAA,MACA,GAAGA,CAAa,UAAUG,CAAI;AAAA,MAC9B,GAAGH,CAAa,aAAa8C,CAAO;AAAA,MACpC;AAAA,QACE,CAAC,GAAG9C,CAAa,cAAc,GAAG2C;AAAA,QAClC,CAAC,GAAG3C,CAAa,YAAY,GAAG4C;AAAA,QAChC,CAAC,GAAG5C,CAAa,aAAa,GAAG6C;AAAA,QACjC,CAAC,GAAG7C,CAAa,qBAAqB,GAAGgD;AAAA,QACzC,CAAC,GAAGhD,CAAa,yBAAyB,GAAG,CAACgD;AAAA,MAAA;AAAA,MAEhDD;AAAA,IAAA;AAGF,WACE,gBAAAtC;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,IAAAgC;AAAA,QACA,WAAWyB;AAAA,QACX,KAAA3B;AAAA,QACA,MAAK;AAAA,QACL,eAAaD,EAAM,aAAa;AAAA,QAG/B,UAAA;AAAA,UAAAuB,EAAA;AAAA,UACAvB,EAAM,SACL,gBAAA1B,EAACD,GAAA,EAAU,WAAWd,EAAG,GAAGG,CAAa,SAAS,GAAG,SAAQ,wBAC1D,YAAM,OACT;AAAA,UAEF,gBAAAY,EAAC,SAAI,WAAWf,EAAG,GAAGG,CAAa,qBAAqB,GAAI,UAAAiE,EAAA,CAAS;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAG3E;AACF;AAEA/B,EAAU,cAAc;"}
+{"version":3,"file":"countdown-DZ4IwkNy.mjs","sources":["../../../components/countdown/src/counter.tsx","../../../components/countdown/src/utils.ts","../../../components/countdown/src/countdown.tsx"],"sourcesContent":["import React from \"react\";\nimport { Paragraph } from \"@purpur/paragraph\";\nimport c from \"classnames/bind\";\n\nimport { type CounterLabels } from \"./countdown.types\";\nimport styles from \"./counter.module.scss\";\n\nconst cx = c.bind(styles);\n\nconst rootClassName = \"purpur-countdown-counter\";\n\ninterface CounterProps {\n  numbers: string[];\n  size: \"md\" | \"lg\";\n  tag: \"days\" | \"hours\" | \"minutes\" | \"seconds\";\n  counterLabels: CounterLabels;\n}\n\nexport const Counter = ({ tag, size, numbers, counterLabels }: CounterProps) => {\n  const renderLabel = () => {\n    const label = counterLabels[tag];\n    const abbreviatedLabel = counterLabels[`${tag}Abbr`];\n\n    return (\n      <>\n        {abbreviatedLabel && (\n          <Paragraph className={cx(`${rootClassName}__label`, `${rootClassName}__label--abbr`)}>\n            <abbr title={label}>{abbreviatedLabel}</abbr>\n          </Paragraph>\n        )}\n        <Paragraph\n          className={cx(`${rootClassName}__label`, {\n            [`${rootClassName}__label--full`]: !!abbreviatedLabel,\n          })}\n        >\n          {label}\n        </Paragraph>\n      </>\n    );\n  };\n\n  return (\n    <div\n      className={cx(rootClassName, `${rootClassName}--size-${size}`)}\n      role=\"group\"\n      aria-hidden=\"true\"\n      data-testid={`counter-${tag}`}\n    >\n      <div className={cx(`${rootClassName}__number-list-container`)}>\n        {numbers.map((number, index) => {\n          return (\n            <ul\n              key={index}\n              className={cx(`${rootClassName}__number-list`)}\n              style={\n                {\n                  \"--offset\": number,\n                } as React.CSSProperties\n              }\n            >\n              {digits.map((d, i) => {\n                const selected = d === number;\n\n                return (\n                  <li\n                    key={i}\n                    className={cx(`${rootClassName}__number`, {\n                      [`${rootClassName}__number--selected`]: selected,\n                    })}\n                  >\n                    {d}\n                  </li>\n                );\n              })}\n            </ul>\n          );\n        })}\n      </div>\n\n      {renderLabel()}\n    </div>\n  );\n};\n\nconst digits = [\"0\", \"1\", \"2\", \"3\", \"4\", \"5\", \"6\", \"7\", \"8\", \"9\"];\n","export function getDiffs(endtime: number) {\n  const now = new Date().getTime();\n\n  const totalSeconds = Math.max(0, endtime - now);\n\n  const _days = Math.floor(totalSeconds / inMs.day);\n  const _hours = Math.floor((totalSeconds % inMs.day) / inMs.hour);\n  const _minutes = Math.floor((totalSeconds % inMs.hour) / inMs.minute);\n  const _seconds = Math.floor((totalSeconds % inMs.minute) / inMs.second);\n\n  const days = splitDigits(_days);\n  const hours = splitDigits(_hours);\n  const minutes = splitDigits(_minutes);\n  const seconds = splitDigits(_seconds);\n\n  return {\n    seconds,\n    minutes,\n    hours,\n    days,\n  };\n}\n\nexport const inMs = {\n  second: 1000,\n  minute: 60 * 1000,\n  hour: 60 * 60 * 1000,\n  day: 24 * 60 * 60 * 1000,\n};\n\nexport function toDate(t: string | number | Date) {\n  return t instanceof Date ? t : new Date(t);\n}\n\nexport function splitDigits(value: number) {\n  const s = String(value).padStart(2, \"0\");\n  return s.split(\"\");\n}\n","import React, { type ForwardedRef, forwardRef, useEffect, useId, useMemo, useState } from \"react\";\nimport { Paragraph } from \"@purpur/paragraph\";\nimport { VisuallyHidden } from \"@purpur/visually-hidden\";\nimport c from \"classnames/bind\";\n\nimport styles from \"./countdown.module.scss\";\nimport { type CountdownProps } from \"./countdown.types\";\nimport { Counter } from \"./counter\";\nimport { getDiffs, toDate } from \"./utils\";\n\nconst cx = c.bind(styles);\n\nconst rootClassName = \"purpur-countdown\";\n\n/**\n * Countdown component to display a countdown timer.\n * @param props - CountdownProps\n * @returns A React component that displays a countdown timer.\n */\n\nexport const Countdown = forwardRef(\n  (\n    { renderAfterEnd, renderBeforeStart, ...props }: CountdownProps,\n    ref: ForwardedRef<HTMLButtonElement>\n  ) => {\n    const nowInit = new Date();\n    const id = useId();\n\n    const {\n      size = \"lg\",\n      fullWidth = false,\n      negative = false,\n      showDays = true,\n      variant = \"primary\",\n      className,\n      counterLabels,\n      useMediaQueries = false,\n    } = props;\n\n    const [now, setNow] = useState<Date>(nowInit);\n\n    const start = useMemo(() => toDate(props.starttime), [props.starttime]);\n    const end = useMemo(() => toDate(props.endtime), [props.endtime]);\n    const { days, hours, minutes, seconds } = useMemo(() => getDiffs(end.getTime()), [now]);\n\n    useEffect(() => {\n      if (now < start || now > end) return;\n      const t = setInterval(() => setNow(new Date()), 1000);\n      return () => clearInterval(t);\n    }, [start, end, now]);\n\n    const hasNotStarted = start > now;\n    const hasEnded = end < now;\n\n    // don't render if before start or after end\n    if (hasNotStarted) return renderBeforeStart ? renderBeforeStart(props) : null;\n    if (hasEnded) return renderAfterEnd ? renderAfterEnd(props) : null;\n\n    const getCounters = () => {\n      const counterProps = { size, counterLabels };\n\n      return (\n        <>\n          {showDays && <Counter numbers={days} tag=\"days\" {...counterProps} />}\n          <Counter numbers={hours} tag=\"hours\" {...counterProps} />\n          <Counter numbers={minutes} tag=\"minutes\" {...counterProps} />\n          <Counter numbers={seconds} tag=\"seconds\" {...counterProps} />\n        </>\n      );\n    };\n\n    // Create a single announcement of the current time (only once)\n\n    const renderAnnouncer = () => {\n      const getTimeAnnouncement = () => {\n        const parts = [];\n\n        if (showDays) parts.push(`${days.join(\"\")} ${counterLabels.days}`);\n        parts.push(`${hours.join(\"\")} ${counterLabels.hours}`);\n        parts.push(`${minutes.join(\"\")} ${counterLabels.minutes}`);\n        parts.push(`${seconds.join(\"\")} ${counterLabels.seconds}`);\n\n        return parts.join(\", \");\n      };\n\n      return (\n        <VisuallyHidden\n          data-testid=\"live-region\"\n          aria-live=\"polite\"\n          aria-label={props[\"aria-label\"]}\n        >\n          {getTimeAnnouncement()}\n        </VisuallyHidden>\n      );\n    };\n\n    const counters = getCounters();\n\n    const classes = cx(\n      rootClassName,\n      `${rootClassName}--size-${size}`,\n      `${rootClassName}--variant-${variant}`,\n      {\n        [`${rootClassName}--full-width`]: fullWidth,\n        [`${rootClassName}--negative`]: negative,\n        [`${rootClassName}--show-days`]: showDays,\n        [`${rootClassName}--use-media-queries`]: useMediaQueries,\n        [`${rootClassName}--use-container-queries`]: !useMediaQueries,\n      },\n      className\n    );\n\n    return (\n      <section\n        id={id}\n        className={classes}\n        ref={ref}\n        role=\"timer\"\n        data-testid={props[\"data-testid\"]}\n      >\n        {/* Visually hidden live region that announces time only once */}\n        {renderAnnouncer()}\n        {props.label && (\n          <Paragraph className={cx(`${rootClassName}__label`)} variant=\"paragraph-100-medium\">\n            {props.label}\n          </Paragraph>\n        )}\n        <div className={cx(`${rootClassName}__counter-container`)}>{counters}</div>\n      </section>\n    );\n  }\n);\n\nCountdown.displayName = \"Countdown\";\n"],"names":["cx","c","styles","rootClassName","Counter","tag","size","numbers","counterLabels","renderLabel","label","abbreviatedLabel","jsxs","Fragment","Paragraph","jsx","number","index","digits","d","i","selected","getDiffs","endtime","now","totalSeconds","_days","inMs","_hours","_minutes","_seconds","days","splitDigits","hours","minutes","toDate","value","Countdown","forwardRef","renderAfterEnd","renderBeforeStart","props","ref","nowInit","id","useId","fullWidth","negative","showDays","variant","className","useMediaQueries","setNow","useState","start","useMemo","end","seconds","useEffect","t","hasNotStarted","hasEnded","getCounters","counterProps","renderAnnouncer","getTimeAnnouncement","parts","VisuallyHidden","counters","classes"],"mappings":"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"}

package/dist/countdown.es.js

@@ -1,4 +1,4 @@
-import { C as r } from "./countdown-DxAGVUFI.mjs";
+import { C as r } from "./countdown-DZ4IwkNy.mjs";
 export {
   r as Countdown
 };