UNPKG

@acrool/react-flip-countdown

Version:
780 lines (779 loc) 28 kB
import ye, { useState as ie, useRef as Se, useEffect as $e, useCallback as xe } from "react"; function Ee(o) { return o && o.__esModule && Object.prototype.hasOwnProperty.call(o, "default") ? o.default : o; } var B = { exports: {} }, q = {}; /** * @license React * react-jsx-runtime.production.js * * Copyright (c) Meta Platforms, Inc. and affiliates. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */ var de; function je() { if (de) return q; de = 1; var o = Symbol.for("react.transitional.element"), f = Symbol.for("react.fragment"); function d(a, _, p) { var $ = null; if (p !== void 0 && ($ = "" + p), _.key !== void 0 && ($ = "" + _.key), "key" in _) { p = {}; for (var T in _) T !== "key" && (p[T] = _[T]); } else p = _; return _ = p.ref, { $$typeof: o, type: a, key: $, ref: _ !== void 0 ? _ : null, props: p }; } return q.Fragment = f, q.jsx = d, q.jsxs = d, q; } var z = {}; /** * @license React * react-jsx-runtime.development.js * * Copyright (c) Meta Platforms, Inc. and affiliates. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */ var fe; function Te() { return fe || (fe = 1, process.env.NODE_ENV !== "production" && function() { function o(e) { if (e == null) return null; if (typeof e == "function") return e.$$typeof === x ? null : e.displayName || e.name || null; if (typeof e == "string") return e; switch (e) { case W: return "Fragment"; case ne: return "Profiler"; case re: return "StrictMode"; case I: return "Suspense"; case P: return "SuspenseList"; case H: return "Activity"; } if (typeof e == "object") switch (typeof e.tag == "number" && console.error( "Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue." ), e.$$typeof) { case w: return "Portal"; case U: return (e.displayName || "Context") + ".Provider"; case se: return (e._context.displayName || "Context") + ".Consumer"; case oe: var s = e.render; return e = e.displayName, e || (e = s.displayName || s.name || "", e = e !== "" ? "ForwardRef(" + e + ")" : "ForwardRef"), e; case G: return s = e.displayName || null, s !== null ? s : o(e.type) || "Memo"; case L: s = e._payload, e = e._init; try { return o(e(s)); } catch { } } return null; } function f(e) { return "" + e; } function d(e) { try { f(e); var s = !1; } catch { s = !0; } if (s) { s = console; var c = s.error, m = typeof Symbol == "function" && Symbol.toStringTag && e[Symbol.toStringTag] || e.constructor.name || "Object"; return c.call( s, "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.", m ), f(e); } } function a(e) { if (e === W) return "<>"; if (typeof e == "object" && e !== null && e.$$typeof === L) return "<...>"; try { var s = o(e); return s ? "<" + s + ">" : "<...>"; } catch { return "<...>"; } } function _() { var e = h.A; return e === null ? null : e.getOwner(); } function p() { return Error("react-stack-top-frame"); } function $(e) { if (F.call(e, "key")) { var s = Object.getOwnPropertyDescriptor(e, "key").get; if (s && s.isReactWarning) return !1; } return e.key !== void 0; } function T(e, s) { function c() { n || (n = !0, console.error( "%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)", s )); } c.isReactWarning = !0, Object.defineProperty(e, "key", { get: c, configurable: !0 }); } function O() { var e = o(this.type); return t[e] || (t[e] = !0, console.error( "Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release." )), e = this.props.ref, e !== void 0 ? e : null; } function R(e, s, c, m, b, y, N, A) { return c = y.ref, e = { $$typeof: j, type: e, key: s, props: y, _owner: b }, (c !== void 0 ? c : null) !== null ? Object.defineProperty(e, "ref", { enumerable: !1, get: O }) : Object.defineProperty(e, "ref", { enumerable: !1, value: null }), e._store = {}, Object.defineProperty(e._store, "validated", { configurable: !1, enumerable: !1, writable: !0, value: 0 }), Object.defineProperty(e, "_debugInfo", { configurable: !1, enumerable: !1, writable: !0, value: null }), Object.defineProperty(e, "_debugStack", { configurable: !1, enumerable: !1, writable: !0, value: N }), Object.defineProperty(e, "_debugTask", { configurable: !1, enumerable: !1, writable: !0, value: A }), Object.freeze && (Object.freeze(e.props), Object.freeze(e)), e; } function M(e, s, c, m, b, y, N, A) { var S = s.children; if (S !== void 0) if (m) if (Z(S)) { for (m = 0; m < S.length; m++) v(S[m]); Object.freeze && Object.freeze(S); } else console.error( "React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead." ); else v(S); if (F.call(s, "key")) { S = o(e); var k = Object.keys(s).filter(function(C) { return C !== "key"; }); m = 0 < k.length ? "{key: someKey, " + k.join(": ..., ") + ": ...}" : "{key: someKey}", l[S + m] || (k = 0 < k.length ? "{" + k.join(": ..., ") + ": ...}" : "{}", console.error( `A props object containing a "key" prop is being spread into JSX: let props = %s; <%s {...props} /> React keys must be passed directly to JSX without using spread: let props = %s; <%s key={someKey} {...props} />`, m, S, k, S ), l[S + m] = !0); } if (S = null, c !== void 0 && (d(c), S = "" + c), $(s) && (d(s.key), S = "" + s.key), "key" in s) { c = {}; for (var E in s) E !== "key" && (c[E] = s[E]); } else c = s; return S && T( c, typeof e == "function" ? e.displayName || e.name || "Unknown" : e ), R( e, S, y, b, _(), c, N, A ); } function v(e) { typeof e == "object" && e !== null && e.$$typeof === j && e._store && (e._store.validated = 1); } var D = ye, j = Symbol.for("react.transitional.element"), w = Symbol.for("react.portal"), W = Symbol.for("react.fragment"), re = Symbol.for("react.strict_mode"), ne = Symbol.for("react.profiler"), se = Symbol.for("react.consumer"), U = Symbol.for("react.context"), oe = Symbol.for("react.forward_ref"), I = Symbol.for("react.suspense"), P = Symbol.for("react.suspense_list"), G = Symbol.for("react.memo"), L = Symbol.for("react.lazy"), H = Symbol.for("react.activity"), x = Symbol.for("react.client.reference"), h = D.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, F = Object.prototype.hasOwnProperty, Z = Array.isArray, u = console.createTask ? console.createTask : function() { return null; }; D = { "react-stack-bottom-frame": function(e) { return e(); } }; var n, t = {}, i = D["react-stack-bottom-frame"].bind( D, p )(), r = u(a(p)), l = {}; z.Fragment = W, z.jsx = function(e, s, c, m, b) { var y = 1e4 > h.recentlyCreatedOwnerStacks++; return M( e, s, c, !1, m, b, y ? Error("react-stack-top-frame") : i, y ? u(a(e)) : r ); }, z.jsxs = function(e, s, c, m, b) { var y = 1e4 > h.recentlyCreatedOwnerStacks++; return M( e, s, c, !0, m, b, y ? Error("react-stack-top-frame") : i, y ? u(a(e)) : r ); }; }()), z; } var me; function Re() { return me || (me = 1, process.env.NODE_ENV === "production" ? B.exports = je() : B.exports = Te()), B.exports; } var g = Re(), te = { exports: {} }, Oe = te.exports, he; function Me() { return he || (he = 1, function(o, f) { (function(d, a) { o.exports = a(); })(Oe, function() { var d = 1e3, a = 6e4, _ = 36e5, p = "millisecond", $ = "second", T = "minute", O = "hour", R = "day", M = "week", v = "month", D = "quarter", j = "year", w = "date", W = "Invalid Date", re = /^(\d{4})[-/]?(\d{1,2})?[-/]?(\d{0,2})[Tt\s]*(\d{1,2})?:?(\d{1,2})?:?(\d{1,2})?[.:]?(\d+)?$/, ne = /\[([^\]]+)]|Y{1,4}|M{1,4}|D{1,2}|d{1,4}|H{1,2}|h{1,2}|a|A|m{1,2}|s{1,2}|Z{1,2}|SSS/g, se = { name: "en", weekdays: "Sunday_Monday_Tuesday_Wednesday_Thursday_Friday_Saturday".split("_"), months: "January_February_March_April_May_June_July_August_September_October_November_December".split("_"), ordinal: function(u) { var n = ["th", "st", "nd", "rd"], t = u % 100; return "[" + u + (n[(t - 20) % 10] || n[t] || n[0]) + "]"; } }, U = function(u, n, t) { var i = String(u); return !i || i.length >= n ? u : "" + Array(n + 1 - i.length).join(t) + u; }, oe = { s: U, z: function(u) { var n = -u.utcOffset(), t = Math.abs(n), i = Math.floor(t / 60), r = t % 60; return (n <= 0 ? "+" : "-") + U(i, 2, "0") + ":" + U(r, 2, "0"); }, m: function u(n, t) { if (n.date() < t.date()) return -u(t, n); var i = 12 * (t.year() - n.year()) + (t.month() - n.month()), r = n.clone().add(i, v), l = t - r < 0, e = n.clone().add(i + (l ? -1 : 1), v); return +(-(i + (t - r) / (l ? r - e : e - r)) || 0); }, a: function(u) { return u < 0 ? Math.ceil(u) || 0 : Math.floor(u); }, p: function(u) { return { M: v, y: j, w: M, d: R, D: w, h: O, m: T, s: $, ms: p, Q: D }[u] || String(u || "").toLowerCase().replace(/s$/, ""); }, u: function(u) { return u === void 0; } }, I = "en", P = {}; P[I] = se; var G = "$isDayjsObject", L = function(u) { return u instanceof F || !(!u || !u[G]); }, H = function u(n, t, i) { var r; if (!n) return I; if (typeof n == "string") { var l = n.toLowerCase(); P[l] && (r = l), t && (P[l] = t, r = l); var e = n.split("-"); if (!r && e.length > 1) return u(e[0]); } else { var s = n.name; P[s] = n, r = s; } return !i && r && (I = r), r || !i && I; }, x = function(u, n) { if (L(u)) return u.clone(); var t = typeof n == "object" ? n : {}; return t.date = u, t.args = arguments, new F(t); }, h = oe; h.l = H, h.i = L, h.w = function(u, n) { return x(u, { locale: n.$L, utc: n.$u, x: n.$x, $offset: n.$offset }); }; var F = function() { function u(t) { this.$L = H(t.locale, null, !0), this.parse(t), this.$x = this.$x || t.x || {}, this[G] = !0; } var n = u.prototype; return n.parse = function(t) { this.$d = function(i) { var r = i.date, l = i.utc; if (r === null) return /* @__PURE__ */ new Date(NaN); if (h.u(r)) return /* @__PURE__ */ new Date(); if (r instanceof Date) return new Date(r); if (typeof r == "string" && !/Z$/i.test(r)) { var e = r.match(re); if (e) { var s = e[2] - 1 || 0, c = (e[7] || "0").substring(0, 3); return l ? new Date(Date.UTC(e[1], s, e[3] || 1, e[4] || 0, e[5] || 0, e[6] || 0, c)) : new Date(e[1], s, e[3] || 1, e[4] || 0, e[5] || 0, e[6] || 0, c); } } return new Date(r); }(t), this.init(); }, n.init = function() { var t = this.$d; this.$y = t.getFullYear(), this.$M = t.getMonth(), this.$D = t.getDate(), this.$W = t.getDay(), this.$H = t.getHours(), this.$m = t.getMinutes(), this.$s = t.getSeconds(), this.$ms = t.getMilliseconds(); }, n.$utils = function() { return h; }, n.isValid = function() { return this.$d.toString() !== W; }, n.isSame = function(t, i) { var r = x(t); return this.startOf(i) <= r && r <= this.endOf(i); }, n.isAfter = function(t, i) { return x(t) < this.startOf(i); }, n.isBefore = function(t, i) { return this.endOf(i) < x(t); }, n.$g = function(t, i, r) { return h.u(t) ? this[i] : this.set(r, t); }, n.unix = function() { return Math.floor(this.valueOf() / 1e3); }, n.valueOf = function() { return this.$d.getTime(); }, n.startOf = function(t, i) { var r = this, l = !!h.u(i) || i, e = h.p(t), s = function(k, E) { var C = h.w(r.$u ? Date.UTC(r.$y, E, k) : new Date(r.$y, E, k), r); return l ? C : C.endOf(R); }, c = function(k, E) { return h.w(r.toDate()[k].apply(r.toDate("s"), (l ? [0, 0, 0, 0] : [23, 59, 59, 999]).slice(E)), r); }, m = this.$W, b = this.$M, y = this.$D, N = "set" + (this.$u ? "UTC" : ""); switch (e) { case j: return l ? s(1, 0) : s(31, 11); case v: return l ? s(1, b) : s(0, b + 1); case M: var A = this.$locale().weekStart || 0, S = (m < A ? m + 7 : m) - A; return s(l ? y - S : y + (6 - S), b); case R: case w: return c(N + "Hours", 0); case O: return c(N + "Minutes", 1); case T: return c(N + "Seconds", 2); case $: return c(N + "Milliseconds", 3); default: return this.clone(); } }, n.endOf = function(t) { return this.startOf(t, !1); }, n.$set = function(t, i) { var r, l = h.p(t), e = "set" + (this.$u ? "UTC" : ""), s = (r = {}, r[R] = e + "Date", r[w] = e + "Date", r[v] = e + "Month", r[j] = e + "FullYear", r[O] = e + "Hours", r[T] = e + "Minutes", r[$] = e + "Seconds", r[p] = e + "Milliseconds", r)[l], c = l === R ? this.$D + (i - this.$W) : i; if (l === v || l === j) { var m = this.clone().set(w, 1); m.$d[s](c), m.init(), this.$d = m.set(w, Math.min(this.$D, m.daysInMonth())).$d; } else s && this.$d[s](c); return this.init(), this; }, n.set = function(t, i) { return this.clone().$set(t, i); }, n.get = function(t) { return this[h.p(t)](); }, n.add = function(t, i) { var r, l = this; t = Number(t); var e = h.p(i), s = function(b) { var y = x(l); return h.w(y.date(y.date() + Math.round(b * t)), l); }; if (e === v) return this.set(v, this.$M + t); if (e === j) return this.set(j, this.$y + t); if (e === R) return s(1); if (e === M) return s(7); var c = (r = {}, r[T] = a, r[O] = _, r[$] = d, r)[e] || 1, m = this.$d.getTime() + t * c; return h.w(m, this); }, n.subtract = function(t, i) { return this.add(-1 * t, i); }, n.format = function(t) { var i = this, r = this.$locale(); if (!this.isValid()) return r.invalidDate || W; var l = t || "YYYY-MM-DDTHH:mm:ssZ", e = h.z(this), s = this.$H, c = this.$m, m = this.$M, b = r.weekdays, y = r.months, N = r.meridiem, A = function(E, C, J, X) { return E && (E[C] || E(i, l)) || J[C].slice(0, X); }, S = function(E) { return h.s(s % 12 || 12, E, "0"); }, k = N || function(E, C, J) { var X = E < 12 ? "AM" : "PM"; return J ? X.toLowerCase() : X; }; return l.replace(ne, function(E, C) { return C || function(J) { switch (J) { case "YY": return String(i.$y).slice(-2); case "YYYY": return h.s(i.$y, 4, "0"); case "M": return m + 1; case "MM": return h.s(m + 1, 2, "0"); case "MMM": return A(r.monthsShort, m, y, 3); case "MMMM": return A(y, m); case "D": return i.$D; case "DD": return h.s(i.$D, 2, "0"); case "d": return String(i.$W); case "dd": return A(r.weekdaysMin, i.$W, b, 2); case "ddd": return A(r.weekdaysShort, i.$W, b, 3); case "dddd": return b[i.$W]; case "H": return String(s); case "HH": return h.s(s, 2, "0"); case "h": return S(1); case "hh": return S(2); case "a": return k(s, c, !0); case "A": return k(s, c, !1); case "m": return String(c); case "mm": return h.s(c, 2, "0"); case "s": return String(i.$s); case "ss": return h.s(i.$s, 2, "0"); case "SSS": return h.s(i.$ms, 3, "0"); case "Z": return e; } return null; }(E) || e.replace(":", ""); }); }, n.utcOffset = function() { return 15 * -Math.round(this.$d.getTimezoneOffset() / 15); }, n.diff = function(t, i, r) { var l, e = this, s = h.p(i), c = x(t), m = (c.utcOffset() - this.utcOffset()) * a, b = this - c, y = function() { return h.m(e, c); }; switch (s) { case j: l = y() / 12; break; case v: l = y(); break; case D: l = y() / 3; break; case M: l = (b - m) / 6048e5; break; case R: l = (b - m) / 864e5; break; case O: l = b / _; break; case T: l = b / a; break; case $: l = b / d; break; default: l = b; } return r ? l : h.a(l); }, n.daysInMonth = function() { return this.endOf(v).$D; }, n.$locale = function() { return P[this.$L]; }, n.locale = function(t, i) { if (!t) return this.$L; var r = this.clone(), l = H(t, i, !0); return l && (r.$L = l), r; }, n.clone = function() { return h.w(this.$d, this); }, n.toDate = function() { return new Date(this.valueOf()); }, n.toJSON = function() { return this.isValid() ? this.toISOString() : null; }, n.toISOString = function() { return this.$d.toISOString(); }, n.toString = function() { return this.$d.toUTCString(); }, u; }(), Z = F.prototype; return x.prototype = Z, [["$ms", p], ["$s", $], ["$m", T], ["$H", O], ["$W", R], ["$M", v], ["$y", j], ["$D", w]].forEach(function(u) { Z[u[1]] = function(n) { return this.$g(n, u[0], u[1]); }; }), x.extend = function(u, n) { return u.$i || (u(n, F, x), u.$i = !0), x; }, x.locale = H, x.isDayjs = L, x.unix = function(u) { return x(1e3 * u); }, x.en = P[I], x.Ls = P, x.p = {}, x; }); }(te)), te.exports; } var ke = Me(); const ce = /* @__PURE__ */ Ee(ke); function le(o, f) { const d = String(o); return d.length < f ? le(`0${d}`, f) : d; } var V = /* @__PURE__ */ ((o) => (o.hours = "hours", o.minutes = "minutes", o.seconds = "seconds", o))(V || {}); const _e = (o) => { const f = ce().millisecond(0), d = Math.max(ce(o).diff(f, "seconds"), 0), a = Math.floor(d / 3600), _ = Math.floor(d % 3600 / 60), p = d % 60; return a > 99 ? { hours: 99, minutes: 99, seconds: 99 } : { hours: a, minutes: _, seconds: p }; }, De = (o, f, d) => { let a = 0; return d || o === 99 ? a = o : a = o + 1, f === V.hours ? a >= 99 && (a = 99) : a === 60 && (a = 0), a; }, pe = (o, f, d) => o ? f : d, ge = (o) => o ? "fold" : "unfold"; function be(o) { var f, d, a = ""; if (typeof o == "string" || typeof o == "number") a += o; else if (typeof o == "object") if (Array.isArray(o)) { var _ = o.length; for (f = 0; f < _; f++) o[f] && (d = be(o[f])) && (a && (a += " "), a += d); } else for (d in o) o[d] && (a && (a += " "), a += d); return a; } function we() { for (var o, f, d = 0, a = "", _ = arguments.length; d < _; d++) (o = arguments[d]) && (f = be(o)) && (a && (a += " "), a += f); return a; } const Ae = "acrool-react-flip-countdown__animated-card-module__root", Ne = "acrool-react-flip-countdown__animated-card-module__fold", Ce = "acrool-react-flip-countdown__animated-card-module__digit", Pe = "acrool-react-flip-countdown__animated-card-module__unfold", Ye = "acrool-react-flip-countdown__animated-card-module__paused", Q = { root: Ae, fold: Ne, digit: Ce, unfold: Pe, paused: Ye }, K = ({ animation: o, digit: f, isPause: d = !0 }) => /* @__PURE__ */ g.jsx("div", { className: we( Q.root, Q[o], d && Q.paused ), children: /* @__PURE__ */ g.jsx("span", { className: Q.digit, children: f }) }), Ie = "acrool-react-flip-countdown__static-card-module__root", Fe = "acrool-react-flip-countdown__static-card-module__upperCard", We = "acrool-react-flip-countdown__static-card-module__lowerCard", ve = { root: Ie, upperCard: Fe, lowerCard: We }, ee = ({ position: o, digit: f }) => /* @__PURE__ */ g.jsx("div", { className: we(ve.root, ve[o]), children: /* @__PURE__ */ g.jsx("span", { children: f }) }), Le = "acrool-react-flip-countdown__flip-unit-container-module__root", He = "acrool-react-flip-countdown__flip-unit-container-module__container", ae = { root: Le, container: He }, ue = ({ digit: o, flip: f, unit: d, isPause: a = !0 }) => { const _ = le(o, 2), p = le(De(o, d, a), 2), $ = pe(f, p, _), T = pe(!f, p, _), O = ge(f), R = ge(!f); return /* @__PURE__ */ g.jsxs("div", { className: ae.root, children: [ /* @__PURE__ */ g.jsxs("div", { className: ae.container, children: [ /* @__PURE__ */ g.jsx( ee, { position: "upperCard", digit: _.substring(0, 1) } ), /* @__PURE__ */ g.jsx( ee, { position: "lowerCard", digit: p.substring(0, 1) } ), /* @__PURE__ */ g.jsx( K, { digit: $.substring(0, 1), animation: O, isPause: a } ), /* @__PURE__ */ g.jsx( K, { digit: T.substring(0, 1), animation: R, isPause: a } ) ] }), /* @__PURE__ */ g.jsxs("div", { className: ae.container, children: [ /* @__PURE__ */ g.jsx( ee, { position: "upperCard", digit: _.substring(1, 2) } ), /* @__PURE__ */ g.jsx( ee, { position: "lowerCard", digit: p.substring(1, 2) } ), /* @__PURE__ */ g.jsx( K, { digit: $.substring(1, 2), animation: O, isPause: a } ), /* @__PURE__ */ g.jsx( K, { digit: T.substring(1, 2), animation: R, isPause: a } ) ] }) ] }); }, Ue = () => { const [o, f] = ie({ digit: 0, flip: !1, isPause: !0 }), [d, a] = ie({ digit: 0, flip: !1, isPause: !0 }), [_, p] = ie({ digit: 0, flip: !1, isPause: !0 }), $ = Se(null); return $e(() => () => { $.current && clearInterval($.current); }, []), { start: xe(async (O) => new Promise((R) => { $.current && clearInterval($.current); const M = _e(O); if (M.hours <= 0 && M.minutes <= 0 && M.seconds <= 0) { R(); return; } f((v) => ({ ...v, digit: M.hours, isPause: !0 })), a((v) => ({ ...v, digit: M.minutes, isPause: !0 })), p((v) => ({ ...v, digit: M.seconds, isPause: !0 })), $.current = setInterval(() => { const { hours: v, minutes: D, seconds: j } = _e(O); return f((w) => ({ digit: v, flip: v !== w.digit ? !w.flip : w.flip, isPause: v === w.digit })), a((w) => ({ digit: D, flip: D !== w.digit ? !w.flip : w.flip, isPause: D === w.digit })), p((w) => ({ digit: j, flip: j !== w.digit ? !w.flip : w.flip, isPause: j === w.digit })), v <= 0 && D <= 0 && j <= 0 && (R(), $.current && clearInterval($.current)), { newHours: v, newMinutes: D, newSeconds: j }; }, 1e3); }), []), hours: o, minutes: d, seconds: _ }; }, Je = "acrool-react-flip-countdown__index-module__root", qe = "acrool-react-flip-countdown__index-module__title", ze = "acrool-react-flip-countdown__index-module__unit", Ve = "acrool-react-flip-countdown__index-module__value", Ge = "acrool-react-flip-countdown__index-module__semicolon", Y = { root: Je, title: qe, unit: ze, value: Ve, semicolon: Ge }, Xe = ({ endTime: o, isDebug: f = !1 }) => { const { start: d, hours: a, minutes: _, seconds: p } = Ue(), $ = ce(o).valueOf(); return $e(() => { d($); }, [o]), /* @__PURE__ */ g.jsxs("div", { className: Y.root, children: [ /* @__PURE__ */ g.jsxs("div", { className: Y.title, children: [ /* @__PURE__ */ g.jsx("div", { className: Y.unit, children: "HOUR" }), /* @__PURE__ */ g.jsx("div", { className: Y.unit, children: "MIN" }), /* @__PURE__ */ g.jsx("div", { className: Y.unit, children: "SEC" }) ] }), /* @__PURE__ */ g.jsxs("div", { className: Y.value, children: [ /* @__PURE__ */ g.jsx( ue, { unit: V.hours, ...a } ), /* @__PURE__ */ g.jsx("div", { className: Y.semicolon, children: ":" }), /* @__PURE__ */ g.jsx( ue, { unit: V.minutes, ..._ } ), /* @__PURE__ */ g.jsx("div", { className: Y.semicolon, children: ":" }), /* @__PURE__ */ g.jsx( ue, { unit: V.seconds, ...p } ) ] }), f && /* @__PURE__ */ g.jsxs("div", { className: "mt-3", style: { fontSize: 25, fontWeight: "bold" }, children: [ String(a.digit).padStart(2, "0"), " : ", String(_.digit).padStart(2, "0"), " : ", String(p.digit).padStart(2, "0") ] }) ] }); }; export { V as EUnit, Xe as default };