zero-hour 1.3.2 → 2.0.0

package/dist/zero-hour.css

@@ -1 +1 @@
-:host{width:100%;display:block;overflow:hidden;container-type:inline-size}.zh{box-sizing:border-box;align-items:stretch;gap:0;display:flex;position:relative}.zh__group{flex:1 1 0;grid-template-rows:auto;grid-template-columns:1fr 1fr;gap:0;width:100%;min-width:0;display:grid}.zh__sep{flex:0 0 var(--zh-sep-width,4%);width:var(--zh-sep-width,4%);background-image:var(--zh-sep-url);background-position:50%;background-repeat:no-repeat;background-size:contain}.zh__digit{aspect-ratio:var(--zh-digit-aspect,9/12);width:100%;position:relative;overflow:hidden}.zh__digit-track{flex-direction:column;width:100%;height:100%;display:flex;transform:translateY(0)}.zh--mode-scroll .zh__digit-track{transition:transform var(--zh-scroll-duration,.375s)var(--zh-scroll-timing,cubic-bezier(.445,.05,.55,.95))}.zh__digit-face{background-image:var(--zh-digits-url);background-repeat:no-repeat;background-size:calc(var(--zh-digits-frames,10)*100%)100%;background-position:calc(var(--zh-sheet-index,0)*100%/(var(--zh-digits-frames,10) - 1))0;flex:0 0 100%;width:100%;height:100%}.zh__a11y{clip:rect(0 0 0 0);white-space:nowrap;clip-path:inset(50%);width:1px;height:1px;position:absolute;overflow:hidden}
+:host{width:100%;display:block;overflow:hidden;container-type:inline-size}.zh{box-sizing:border-box;align-items:stretch;gap:0;display:flex;position:relative}.zh__group{flex:1 1 0;grid-template-rows:auto;grid-template-columns:1fr 1fr;gap:0;width:100%;min-width:0;display:grid}.zh__sep{flex:0 0 var(--zh-sep-width,4%);width:var(--zh-sep-width,4%);background-image:var(--zh-sep-url);background-position:50%;background-repeat:no-repeat;background-size:contain}.zh__digit{aspect-ratio:var(--zh-digit-aspect,9 / 12);width:100%;position:relative;overflow:hidden}.zh__digit-track{flex-direction:column;width:100%;height:100%;display:flex;transform:translateY(0)}.zh--mode-scroll .zh__digit-track{transition:transform var(--zh-scroll-duration,.375s) var(--zh-scroll-timing,cubic-bezier(.445, .05, .55, .95))}.zh__digit-face{background-image:var(--zh-digits-url);background-repeat:no-repeat;background-size:calc(var(--zh-digits-frames,10) * 100%) 100%;background-position:calc(var(--zh-sheet-index,0) * 100% / (var(--zh-digits-frames,10) - 1)) 0;flex:0 0 100%;width:100%;height:100%}.zh__a11y{clip:rect(0 0 0 0);white-space:nowrap;clip-path:inset(50%);width:1px;height:1px;position:absolute;overflow:hidden}

package/package.json

@@ -1,7 +1,8 @@
 {
   "name": "zero-hour",
-  "version": "1.3.2",
+  "version": "2.0.0",
   "description": "Tiny countdown Web Component. Registers <countdown-timer> that renders a configurable DD:HH:MM:SS countdown to a target date/time (optional UTC offset) and fires a done event at zero.",
+  "type": "module",
   "author": "ux-ui.pro",
   "license": "MIT",
   "repository": {
@@ -12,41 +13,67 @@
     "url": "https://github.com/ux-ui-pro/zero-hour/issues"
   },
   "homepage": "https://github.com/ux-ui-pro/zero-hour",
-  "sideEffects": false,
+  "sideEffects": [
+    "*.css"
+  ],
+  "packageManager": "npm@10.9.3",
   "scripts": {
     "clean": "rimraf dist",
-    "build": "vite build",
-    "dev": "vite",
-    "verify": "yarn lint && yarn typecheck",
-    "lint": "biome check src",
-    "lint:fix": "biome check --write src",
-    "format": "biome format --write src",
-    "typecheck": "tsc -p tsconfig.json --noEmit"
+    "build": "tsdown",
+    "verify": "npm run lint && npm run typecheck && npm run build && npm run test:smoke && npm run pack:check",
+    "lint": "biome check src tests tsdown.config.ts",
+    "lint:fix": "biome check --write src tests tsdown.config.ts",
+    "format": "biome format --write src tests tsdown.config.ts",
+    "typecheck": "tsc -p tsconfig.json --noEmit",
+    "test:smoke": "node --test \"tests/**/*.js\"",
+    "pack:check": "npm pack --dry-run && publint && attw --pack . --profile node16 --exclude-entrypoints zero-hour.css",
+    "prepublishOnly": "npm run clean && npm run verify"
   },
   "source": "src/index.ts",
-  "main": "dist/index.cjs.js",
-  "module": "dist/index.es.js",
-  "types": "dist/index.d.ts",
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "style": "./dist/zero-hour.css",
   "exports": {
     ".": {
-      "types": "./dist/index.d.ts",
-      "import": "./dist/index.es.js",
-      "require": "./dist/index.cjs.js"
+      "import": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/index.js"
+      },
+      "require": {
+        "types": "./dist/index.d.cts",
+        "default": "./dist/index.cjs"
+      }
     },
-    "./zero-hour.css": "./dist/zero-hour.css",
-    "./dist/*": "./dist/*"
+    "./zero-hour.css": {
+      "default": "./dist/zero-hour.css"
+    }
   },
   "files": [
-    "dist/"
+    "dist",
+    "README.md",
+    "LICENSE"
   ],
+  "engines": {
+    "node": ">=20.19.0"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
   "devDependencies": {
-    "@biomejs/biome": "2.3.10",
-    "@types/node": "25.0.3",
-    "lightningcss": "1.30.2",
-    "rimraf": "6.1.2",
-    "typescript": "5.9.3",
-    "vite": "7.3.0",
-    "vite-plugin-dts": "4.5.4"
+    "@arethetypeswrong/cli": "^0.18.3",
+    "@biomejs/biome": "2.4.16",
+    "@tsdown/css": "^0.22.3",
+    "@types/node": "25.9.2",
+    "@ux-ui/biome-config": "^0.1.0",
+    "@ux-ui/tsconfig-base": "^0.1.0",
+    "@ux-ui/tsdown-config": "^0.1.0",
+    "publint": "^0.3.21",
+    "rimraf": "6.1.3",
+    "sass-embedded": "^1.100.0",
+    "jsdom": "29.1.1",
+    "tsdown": "0.22.3",
+    "typescript": "6.0.3"
   },
   "keywords": [
     "typescript",

package/dist/index.cjs.js

@@ -1,75 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const g=`:host {
-  display: block;
-  width: 100%;
-  container-type: inline-size;
-  overflow: hidden;
-}
-
-.zh {
-  display: flex;
-  align-items: stretch;
-  gap: 0;
-  position: relative;
-  box-sizing: border-box;
-}
-
-.zh__group {
-  display: grid;
-  grid-template-columns: 1fr 1fr;
-  grid-template-rows: auto;
-  gap: 0;
-  width: 100%;
-  flex: 1 1 0;
-  min-width: 0;
-}
-
-.zh__sep {
-  flex: 0 0 var(--zh-sep-width, 4%);
-  width: var(--zh-sep-width, 4%);
-  background-image: var(--zh-sep-url);
-  background-repeat: no-repeat;
-  background-position: center;
-  background-size: contain;
-}
-
-.zh__digit {
-  aspect-ratio: var(--zh-digit-aspect, 9 / 12);
-  width: 100%;
-  position: relative;
-  overflow: hidden;
-}
-
-.zh__digit-track {
-  width: 100%;
-  height: 100%;
-  display: flex;
-  flex-direction: column;
-  transform: translateY(0);
-}
-
-.zh--mode-scroll .zh__digit-track {
-  transition: transform var(--zh-scroll-duration, 375ms)
-    var(--zh-scroll-timing, cubic-bezier(0.445, 0.05, 0.55, 0.95));
-}
-
-.zh__digit-face {
-  flex: 0 0 100%;
-  width: 100%;
-  height: 100%;
-  background-image: var(--zh-digits-url);
-  background-repeat: no-repeat;
-  /* Digits sprite is horizontal (frames left-to-right). */
-  background-size: calc(var(--zh-digits-frames, 10) * 100%) 100%;
-  background-position: calc(var(--zh-sheet-index, 0) * 100% / (var(--zh-digits-frames, 10) - 1)) 0;
-}
-
-.zh__a11y {
-  position: absolute;
-  width: 1px;
-  height: 1px;
-  overflow: hidden;
-  clip: rect(0 0 0 0);
-  white-space: nowrap;
-  clip-path: inset(50%);
-}
-`,T=g;function F(o){const t=o.charCodeAt(0)-48;return t>=0&&t<=9?t:0}function d(o){return o<0?0:o}const p={showDays:!0,showHours:!0,showMinutes:!0,showSeconds:!0},y={hours:0,minutes:0,seconds:0};function f(o){return"adoptedStyleSheets"in o}function z(o){try{const t=new CSSStyleSheet;return t.replaceSync(o),t}catch{return null}}const N=z(g);function E(o){const t=Math.floor(o/1e3),e=t%60,s=Math.floor(t/60)%60,i=Math.floor(t/3600),n=Math.floor(i/24),r=i%24;return{d:n,h:r,m:s,s:e,totalSec:t}}function w(o){return String(o).padStart(2,"0")}function S(o,t){return[...String(o).padStart(t,"0")]}function x(o,t,e){if(!o.hasAttribute(t))return e;const s=o.getAttribute(t);return s==null||s===""?!0:s!=="false"}function b(o){if(o==null)return null;const t=o.trim();if(!t)return null;const e=t.match(/^(\d{4})-(\d{2})-(\d{2})$/);if(!e)return null;const s=Number(e[1]),i=Number(e[2]),n=Number(e[3]);return!Number.isFinite(s)||!Number.isFinite(i)||!Number.isFinite(n)?null:{year:s,month:i,day:n}}function C(o){if(o==null)return{...y};const t=o.trim();if(!t)return{...y};const e=t.split(":"),s=Number(e[0]??"0"),i=Number(e[1]??"0"),n=Number(e[2]??"0");return{hours:Number.isFinite(s)?s:0,minutes:Number.isFinite(i)?i:0,seconds:Number.isFinite(n)?n:0}}function v(o){if(o==null)return null;const t=o.trim();if(!t)return null;const e=t.match(/^(\d{1,2}):(\d{2})(?::(\d{2}))?$/);if(!e)return null;const s=Number(e[1]),i=Number(e[2]),n=Number(e[3]??"0");return!Number.isFinite(s)||!Number.isFinite(i)||!Number.isFinite(n)||s<0||s>23||i<0||i>59||n<0||n>59?null:{hours:s,minutes:i,seconds:n}}function D(o){if(o==null)return null;let t=o.trim();if(!t)return null;/^utc/i.test(t)&&(t=t.slice(3));let e=1;if(t[0]==="+"?t=t.slice(1):t[0]==="-"&&(e=-1,t=t.slice(1)),!t)return null;const[s,i="0"]=t.split(":"),n=Number(s),r=Number(i);if(!Number.isFinite(n)||!Number.isFinite(r))return null;const l=n*60+r;return e*l}function A(){if(typeof window>"u"||!("location"in window))return null;const o=window.location?.search??"";if(!o)return null;const t=new URLSearchParams(o),e={},s=t.get("date")?.trim();s&&(e.date=s);const i=t.get("time")?.trim();i&&(e.time=i);const n=t.get("utc")?.trim();n&&(e.utc=n);const r=t.get("units")?.trim();return r&&(e.units=r),Object.keys(e).length?e:null}function U(o){const t=(o??"").trim().toLowerCase();if(!t)return p;const e=t.split(":").map(a=>a.trim()).filter(Boolean);if(!e.length)return p;const s=new Set(e),i=s.has("d"),n=s.has("h"),r=s.has("m"),l=s.has("s");return!i&&!n&&!r&&!l?p:{showDays:i,showHours:n,showMinutes:r,showSeconds:l}}class m extends HTMLElement{static defaultStylesheet=N;static observedAttributes=["digits-url","separator-url","autostart","date","time","utc","units","mode"];shadow=this.attachShadow({mode:"open"});digitsUrl=null;separatorUrl=null;autostart=!0;durationMs=0;targetEpochMs=null;startEpochMs=null;nextTickTimeout=null;doneFired=!1;rootEl;daysEl;hoursEl;minutesEl;secondsEl;a11yEl;sep0El;sep1El;sep2El;styleEl=null;showDays=!0;showHours=!0;showMinutes=!0;showSeconds=!0;mode="static";hasDigitsRendered=!1;connectedCallback(){this.render(),this.readAttributes(),this.autostart?this.start():this.renderStaticInitial()}disconnectedCallback(){this.stop()}attributeChangedCallback(t,e,s){if(!this.isConnected)return;const i=this.isRunning();this.readAttributes(),this.doneFired=!1,i&&this.autostart?this.start():this.renderStaticInitial()}start(){this.stop(),this.digitsUrl&&(this.durationMs=this.targetEpochMs!=null?this.targetEpochMs-Date.now():0,this.startEpochMs=Date.now(),this.tick(),this.scheduleNextSecondBoundary())}stop(){this.nextTickTimeout!=null&&(window.clearTimeout(this.nextTickTimeout),this.nextTickTimeout=null),this.startEpochMs=null}reset(){this.doneFired=!1,this.autostart?this.start():this.renderStaticInitial()}isRunning(){return this.startEpochMs!=null&&this.nextTickTimeout!=null}isDone(){return!this.digitsUrl||this.targetEpochMs==null?!1:Date.now()>=this.targetEpochMs}readAttributes(){this.rootEl||this.render();const t=A();this.digitsUrl=this.getAttribute("digits-url"),this.separatorUrl=this.getAttribute("separator-url"),this.autostart=x(this,"autostart",!0);const e=(this.getAttribute("mode")??"").trim().toLowerCase();this.mode=e==="scroll"?"scroll":"static";const s=U(t?.units??this.getAttribute("units"));this.showDays=s.showDays,this.showHours=s.showHours,this.showMinutes=s.showMinutes,this.showSeconds=s.showSeconds;const i=b(this.getAttribute("date")),r=b(t?.date??null)??i,l=C(this.getAttribute("time")),h=v(t?.time??null)??l,c=D(this.getAttribute("utc")),_=D(t?.utc??null)??c??0;if(!r)this.targetEpochMs=null;else{const M=Date.UTC(r.year,r.month-1,r.day,h.hours,h.minutes,h.seconds);this.targetEpochMs=M-_*60*1e3}if(this.durationMs=0,!this.digitsUrl){this.setTextFallback("—:—:—:—");return}this.rootEl.style.setProperty("--zh-digits-url",`url("${this.digitsUrl}")`),this.separatorUrl?this.rootEl.style.setProperty("--zh-sep-url",`url("${this.separatorUrl}")`):this.rootEl.style.removeProperty("--zh-sep-url"),this.applyUnitsVisibility(),this.rootEl.classList.toggle("zh--mode-scroll",this.mode==="scroll")}renderStaticInitial(){if(this.targetEpochMs!=null){const t=Date.now(),e=d(this.targetEpochMs-t),{d:s,h:i,m:n,s:r}=E(e);this.setDigits({d:s,h:i,m:n,s:r},!1)}else this.setDigits({d:0,h:0,m:0,s:0},!1)}render(){this.applyStyles(null),this.rootEl=document.createElement("div"),this.rootEl.className="zh",this.daysEl=document.createElement("div"),this.daysEl.className="zh__group",this.hoursEl=document.createElement("div"),this.hoursEl.className="zh__group",this.minutesEl=document.createElement("div"),this.minutesEl.className="zh__group",this.secondsEl=document.createElement("div"),this.secondsEl.className="zh__group",this.sep0El=document.createElement("span"),this.sep0El.className="zh__sep",this.sep1El=document.createElement("span"),this.sep1El.className="zh__sep",this.sep2El=document.createElement("span"),this.sep2El.className="zh__sep",this.a11yEl=document.createElement("span"),this.a11yEl.className="zh__a11y",this.a11yEl.setAttribute("aria-live","polite"),this.rootEl.append(this.daysEl,this.sep0El,this.hoursEl,this.sep1El,this.minutesEl,this.sep2El,this.secondsEl,this.a11yEl),this.shadow.innerHTML="",this.styleEl&&this.shadow.append(this.styleEl),this.shadow.append(this.rootEl),this.setDigits({d:0,h:0,m:0,s:0},!1),this.hasDigitsRendered=!1}setTextFallback(t){this.a11yEl.textContent=t}applyUnitsVisibility(){if(!this.rootEl)return;if(this.daysEl.style.display=this.showDays?"":"none",this.hoursEl.style.display=this.showHours?"":"none",this.minutesEl.style.display=this.showMinutes?"":"none",this.secondsEl.style.display=this.showSeconds?"":"none",!!!this.separatorUrl){this.sep0El.style.display="none",this.sep1El.style.display="none",this.sep2El.style.display="none";return}const e=[this.showDays,this.showHours,this.showMinutes,this.showSeconds],s=[];for(let n=0;n<e.length;n++)e[n]&&s.push(n);this.rootEl.style.setProperty("--zh-groups",String(s.length));const i=[!1,!1,!1];if(s.length>=2)for(let n=0;n<s.length-1;n++){const r=s[n+1],l=Math.min(2,Math.max(0,r-1));i[l]=!0}this.sep0El.style.display=i[0]?"":"none",this.sep1El.style.display=i[1]?"":"none",this.sep2El.style.display=i[2]?"":"none"}setDigits({d:t,h:e,m:s,s:i},n=!0){let r=n;this.hasDigitsRendered||(r=!1);const l=S(Math.min(t,99),2),a=S(e,2),h=[...w(s)],c=[...w(i)];this.syncDigitGroup(this.daysEl,l,r),this.syncDigitGroup(this.hoursEl,a,r),this.syncDigitGroup(this.minutesEl,h,r),this.syncDigitGroup(this.secondsEl,c,r);const u=[];this.showDays&&u.push(l.join("")),this.showHours&&u.push(a.join("")),this.showMinutes&&u.push(h.join("")),this.showSeconds&&u.push(c.join("")),this.a11yEl.textContent=u.length?u.join(":"):"—",this.hasDigitsRendered=!0}syncDigitGroup(t,e,s){for(;t.children.length<e.length;){const i=t.children.length;t.appendChild(this.createDigitSlot(e[i]))}for(;t.children.length>e.length;){const i=t.lastElementChild;if(!i)break;t.removeChild(i)}for(let i=0;i<e.length;i++){const n=t.children[i];this.syncDigitSlot(n,e[i],s)}}createDigitSlot(t){const e=document.createElement("span");e.className="zh__digit";const s=document.createElement("span");s.className="zh__digit-track";const i=this.createDigitFace(t);return i.classList.add("zh__digit-face--current"),s.append(i),e.append(s),e}createDigitFace(t){const e=document.createElement("span");return e.className="zh__digit-face",this.setFaceDigit(e,t),e}setFaceDigit(t,e){t.dataset.zhDigit=e;const s=F(e);t.style.setProperty("--zh-sheet-index",String(s))}ensureDigitTrack(t){let e=t.querySelector(".zh__digit-track");return e||(e=document.createElement("span"),e.className="zh__digit-track",t.innerHTML="",t.append(e)),e}getOrCreateCurrentFace(t,e){let s=t.querySelector(".zh__digit-face--current");if(!s)s=t.querySelector(".zh__digit-face")??this.createDigitFace(e),s.classList.add("zh__digit-face--current"),this.setFaceDigit(s,s.dataset.zhDigit??e),t.innerHTML="",t.append(s);else{const i=Array.from(t.children);for(const n of i)n!==s&&t.removeChild(n)}return s}cleanupTrack(t,e){if(!t.contains(e))return;const s=Array.from(t.children);for(const i of s)i!==e&&t.removeChild(i);e.classList.remove("zh__digit-face--next"),e.classList.add("zh__digit-face--current"),t.style.transition=this.mode==="scroll"?"":"none",t.style.transform="translateY(0)"}parseTransitionMs(t){const e=window.getComputedStyle(t),s=e.transitionDuration.split(",").map(a=>a.trim()),i=e.transitionDelay.split(",").map(a=>a.trim()),n=a=>a?a.endsWith("ms")?Number.parseFloat(a):a.endsWith("s")?Number.parseFloat(a)*1e3:Number.parseFloat(a)||0:0,r=s[0]?n(s[0]):0,l=i[0]?n(i[0]):0;return r+l}animateDigitChange(t,e,s){const i=this.createDigitFace(s);i.classList.add("zh__digit-face--next"),t.innerHTML="",t.append(i,e),t.style.transition="none",t.style.transform="translateY(-100%)",t.offsetHeight,t.style.transition="",t.style.transform="translateY(0)";const n=()=>{t.removeEventListener("transitionend",n),t.contains(i)&&this.cleanupTrack(t,i)};t.addEventListener("transitionend",n,{once:!0});const r=this.parseTransitionMs(t)+150;window.setTimeout(n,r||800)}syncDigitSlot(t,e,s){const i=this.ensureDigitTrack(t),n=this.getOrCreateCurrentFace(i,e),r=n.dataset.zhDigit??e;if(this.setFaceDigit(n,r),r===e||!s||this.mode!=="scroll"){r!==e&&this.setFaceDigit(n,e),this.cleanupTrack(i,n);return}this.animateDigitChange(i,n,e)}tick(){if(!this.digitsUrl)return;const t=d(this.durationMs);if(t===0){this.setDigits({d:0,h:0,m:0,s:0}),this.fireDoneOnce(),this.stop();return}const e=this.startEpochMs??Date.now(),s=d(Date.now()-e),i=d(t-s),{d:n,h:r,m:l,s:a,totalSec:h}=E(i);this.setDigits({d:n,h:r,m:l,s:a}),h===0&&(this.fireDoneOnce(),this.stop())}fireDoneOnce(){this.doneFired||(this.doneFired=!0,this.dispatchEvent(new CustomEvent("done")))}scheduleNextSecondBoundary(){const e=1e3-Date.now()%1e3;this.nextTickTimeout=window.setTimeout(()=>{this.tick(),this.isRunning()&&this.scheduleNextSecondBoundary()},e)}adoptStylesheet(t){this.applyStyles(t)}adoptStyles(t){this.applyStyles(t)}applyStyles(t){if(typeof t=="string"){if(f(this.shadow)){const e=z(t);if(e){this.shadow.adoptedStyleSheets=[e],this.styleEl=null;return}}this.styleEl||(this.styleEl=document.createElement("style")),this.styleEl.textContent=t;return}if(t&&f(this.shadow)){this.shadow.adoptedStyleSheets=[t],this.styleEl=null;return}if(m.defaultStylesheet&&f(this.shadow)){this.shadow.adoptedStyleSheets=[m.defaultStylesheet],this.styleEl=null;return}this.styleEl||(this.styleEl=document.createElement("style")),this.styleEl.textContent=g}}customElements.get("countdown-timer")||customElements.define("countdown-timer",m);function L(o={}){const{selector:t="countdown-timer",onDone:e,stylesheet:s}=o,i=Array.from(document.querySelectorAll(t));if(e){const n=new WeakSet,r=l=>{n.has(l)||(n.add(l),e(l))};i.forEach(l=>{l.addEventListener("done",()=>r(l));const a=l;typeof a.isDone=="function"&&a.isDone()&&r(l)})}return s&&i.forEach(n=>{const r=n;typeof s=="string"?r.adoptStyles(s):r.adoptStylesheet(s)}),i}exports.initCountdownTimers=L;exports.zeroHourCssText=T;

package/dist/index.es.js

@@ -1,464 +0,0 @@
-const g = `:host {
-  display: block;
-  width: 100%;
-  container-type: inline-size;
-  overflow: hidden;
-}
-
-.zh {
-  display: flex;
-  align-items: stretch;
-  gap: 0;
-  position: relative;
-  box-sizing: border-box;
-}
-
-.zh__group {
-  display: grid;
-  grid-template-columns: 1fr 1fr;
-  grid-template-rows: auto;
-  gap: 0;
-  width: 100%;
-  flex: 1 1 0;
-  min-width: 0;
-}
-
-.zh__sep {
-  flex: 0 0 var(--zh-sep-width, 4%);
-  width: var(--zh-sep-width, 4%);
-  background-image: var(--zh-sep-url);
-  background-repeat: no-repeat;
-  background-position: center;
-  background-size: contain;
-}
-
-.zh__digit {
-  aspect-ratio: var(--zh-digit-aspect, 9 / 12);
-  width: 100%;
-  position: relative;
-  overflow: hidden;
-}
-
-.zh__digit-track {
-  width: 100%;
-  height: 100%;
-  display: flex;
-  flex-direction: column;
-  transform: translateY(0);
-}
-
-.zh--mode-scroll .zh__digit-track {
-  transition: transform var(--zh-scroll-duration, 375ms)
-    var(--zh-scroll-timing, cubic-bezier(0.445, 0.05, 0.55, 0.95));
-}
-
-.zh__digit-face {
-  flex: 0 0 100%;
-  width: 100%;
-  height: 100%;
-  background-image: var(--zh-digits-url);
-  background-repeat: no-repeat;
-  /* Digits sprite is horizontal (frames left-to-right). */
-  background-size: calc(var(--zh-digits-frames, 10) * 100%) 100%;
-  background-position: calc(var(--zh-sheet-index, 0) * 100% / (var(--zh-digits-frames, 10) - 1)) 0;
-}
-
-.zh__a11y {
-  position: absolute;
-  width: 1px;
-  height: 1px;
-  overflow: hidden;
-  clip: rect(0 0 0 0);
-  white-space: nowrap;
-  clip-path: inset(50%);
-}
-`, U = g;
-function F(o) {
-  const t = o.charCodeAt(0) - 48;
-  return t >= 0 && t <= 9 ? t : 0;
-}
-function d(o) {
-  return o < 0 ? 0 : o;
-}
-const p = {
-  showDays: !0,
-  showHours: !0,
-  showMinutes: !0,
-  showSeconds: !0
-}, y = { hours: 0, minutes: 0, seconds: 0 };
-function f(o) {
-  return "adoptedStyleSheets" in o;
-}
-function z(o) {
-  try {
-    const t = new CSSStyleSheet();
-    return t.replaceSync(o), t;
-  } catch {
-    return null;
-  }
-}
-const N = z(g);
-function E(o) {
-  const t = Math.floor(o / 1e3), e = t % 60, s = Math.floor(t / 60) % 60, i = Math.floor(t / 3600), n = Math.floor(i / 24), r = i % 24;
-  return { d: n, h: r, m: s, s: e, totalSec: t };
-}
-function w(o) {
-  return String(o).padStart(2, "0");
-}
-function S(o, t) {
-  return [...String(o).padStart(t, "0")];
-}
-function T(o, t, e) {
-  if (!o.hasAttribute(t)) return e;
-  const s = o.getAttribute(t);
-  return s == null || s === "" ? !0 : s !== "false";
-}
-function D(o) {
-  if (o == null) return null;
-  const t = o.trim();
-  if (!t) return null;
-  const e = t.match(/^(\d{4})-(\d{2})-(\d{2})$/);
-  if (!e) return null;
-  const s = Number(e[1]), i = Number(e[2]), n = Number(e[3]);
-  return !Number.isFinite(s) || !Number.isFinite(i) || !Number.isFinite(n) ? null : { year: s, month: i, day: n };
-}
-function x(o) {
-  if (o == null) return { ...y };
-  const t = o.trim();
-  if (!t) return { ...y };
-  const e = t.split(":"), s = Number(e[0] ?? "0"), i = Number(e[1] ?? "0"), n = Number(e[2] ?? "0");
-  return {
-    hours: Number.isFinite(s) ? s : 0,
-    minutes: Number.isFinite(i) ? i : 0,
-    seconds: Number.isFinite(n) ? n : 0
-  };
-}
-function C(o) {
-  if (o == null) return null;
-  const t = o.trim();
-  if (!t) return null;
-  const e = t.match(/^(\d{1,2}):(\d{2})(?::(\d{2}))?$/);
-  if (!e) return null;
-  const s = Number(e[1]), i = Number(e[2]), n = Number(e[3] ?? "0");
-  return !Number.isFinite(s) || !Number.isFinite(i) || !Number.isFinite(n) || s < 0 || s > 23 || i < 0 || i > 59 || n < 0 || n > 59 ? null : { hours: s, minutes: i, seconds: n };
-}
-function b(o) {
-  if (o == null) return null;
-  let t = o.trim();
-  if (!t) return null;
-  /^utc/i.test(t) && (t = t.slice(3));
-  let e = 1;
-  if (t[0] === "+" ? t = t.slice(1) : t[0] === "-" && (e = -1, t = t.slice(1)), !t) return null;
-  const [s, i = "0"] = t.split(":"), n = Number(s), r = Number(i);
-  if (!Number.isFinite(n) || !Number.isFinite(r)) return null;
-  const l = n * 60 + r;
-  return e * l;
-}
-function v() {
-  if (typeof window > "u" || !("location" in window)) return null;
-  const o = window.location?.search ?? "";
-  if (!o) return null;
-  const t = new URLSearchParams(o), e = {}, s = t.get("date")?.trim();
-  s && (e.date = s);
-  const i = t.get("time")?.trim();
-  i && (e.time = i);
-  const n = t.get("utc")?.trim();
-  n && (e.utc = n);
-  const r = t.get("units")?.trim();
-  return r && (e.units = r), Object.keys(e).length ? e : null;
-}
-function A(o) {
-  const t = (o ?? "").trim().toLowerCase();
-  if (!t)
-    return p;
-  const e = t.split(":").map((a) => a.trim()).filter(Boolean);
-  if (!e.length)
-    return p;
-  const s = new Set(e), i = s.has("d"), n = s.has("h"), r = s.has("m"), l = s.has("s");
-  return !i && !n && !r && !l ? p : { showDays: i, showHours: n, showMinutes: r, showSeconds: l };
-}
-class m extends HTMLElement {
-  static defaultStylesheet = N;
-  static observedAttributes = [
-    "digits-url",
-    "separator-url",
-    "autostart",
-    "date",
-    "time",
-    "utc",
-    "units",
-    "mode"
-  ];
-  shadow = this.attachShadow({ mode: "open" });
-  digitsUrl = null;
-  separatorUrl = null;
-  autostart = !0;
-  durationMs = 0;
-  targetEpochMs = null;
-  startEpochMs = null;
-  nextTickTimeout = null;
-  doneFired = !1;
-  rootEl;
-  daysEl;
-  hoursEl;
-  minutesEl;
-  secondsEl;
-  a11yEl;
-  sep0El;
-  sep1El;
-  sep2El;
-  styleEl = null;
-  showDays = !0;
-  showHours = !0;
-  showMinutes = !0;
-  showSeconds = !0;
-  mode = "static";
-  hasDigitsRendered = !1;
-  connectedCallback() {
-    this.render(), this.readAttributes(), this.autostart ? this.start() : this.renderStaticInitial();
-  }
-  disconnectedCallback() {
-    this.stop();
-  }
-  attributeChangedCallback(t, e, s) {
-    if (!this.isConnected) return;
-    const i = this.isRunning();
-    this.readAttributes(), this.doneFired = !1, i && this.autostart ? this.start() : this.renderStaticInitial();
-  }
-  start() {
-    this.stop(), this.digitsUrl && (this.durationMs = this.targetEpochMs != null ? this.targetEpochMs - Date.now() : 0, this.startEpochMs = Date.now(), this.tick(), this.scheduleNextSecondBoundary());
-  }
-  stop() {
-    this.nextTickTimeout != null && (window.clearTimeout(this.nextTickTimeout), this.nextTickTimeout = null), this.startEpochMs = null;
-  }
-  reset() {
-    this.doneFired = !1, this.autostart ? this.start() : this.renderStaticInitial();
-  }
-  isRunning() {
-    return this.startEpochMs != null && this.nextTickTimeout != null;
-  }
-  isDone() {
-    return !this.digitsUrl || this.targetEpochMs == null ? !1 : Date.now() >= this.targetEpochMs;
-  }
-  readAttributes() {
-    this.rootEl || this.render();
-    const t = v();
-    this.digitsUrl = this.getAttribute("digits-url"), this.separatorUrl = this.getAttribute("separator-url"), this.autostart = T(this, "autostart", !0);
-    const e = (this.getAttribute("mode") ?? "").trim().toLowerCase();
-    this.mode = e === "scroll" ? "scroll" : "static";
-    const s = A(t?.units ?? this.getAttribute("units"));
-    this.showDays = s.showDays, this.showHours = s.showHours, this.showMinutes = s.showMinutes, this.showSeconds = s.showSeconds;
-    const i = D(this.getAttribute("date")), r = D(t?.date ?? null) ?? i, l = x(this.getAttribute("time")), h = C(t?.time ?? null) ?? l, c = b(this.getAttribute("utc")), _ = b(t?.utc ?? null) ?? c ?? 0;
-    if (!r)
-      this.targetEpochMs = null;
-    else {
-      const M = Date.UTC(
-        r.year,
-        r.month - 1,
-        r.day,
-        h.hours,
-        h.minutes,
-        h.seconds
-      );
-      this.targetEpochMs = M - _ * 60 * 1e3;
-    }
-    if (this.durationMs = 0, !this.digitsUrl) {
-      this.setTextFallback("—:—:—:—");
-      return;
-    }
-    this.rootEl.style.setProperty("--zh-digits-url", `url("${this.digitsUrl}")`), this.separatorUrl ? this.rootEl.style.setProperty("--zh-sep-url", `url("${this.separatorUrl}")`) : this.rootEl.style.removeProperty("--zh-sep-url"), this.applyUnitsVisibility(), this.rootEl.classList.toggle("zh--mode-scroll", this.mode === "scroll");
-  }
-  renderStaticInitial() {
-    if (this.targetEpochMs != null) {
-      const t = Date.now(), e = d(this.targetEpochMs - t), { d: s, h: i, m: n, s: r } = E(e);
-      this.setDigits({ d: s, h: i, m: n, s: r }, !1);
-    } else
-      this.setDigits({ d: 0, h: 0, m: 0, s: 0 }, !1);
-  }
-  render() {
-    this.applyStyles(null), this.rootEl = document.createElement("div"), this.rootEl.className = "zh", this.daysEl = document.createElement("div"), this.daysEl.className = "zh__group", this.hoursEl = document.createElement("div"), this.hoursEl.className = "zh__group", this.minutesEl = document.createElement("div"), this.minutesEl.className = "zh__group", this.secondsEl = document.createElement("div"), this.secondsEl.className = "zh__group", this.sep0El = document.createElement("span"), this.sep0El.className = "zh__sep", this.sep1El = document.createElement("span"), this.sep1El.className = "zh__sep", this.sep2El = document.createElement("span"), this.sep2El.className = "zh__sep", this.a11yEl = document.createElement("span"), this.a11yEl.className = "zh__a11y", this.a11yEl.setAttribute("aria-live", "polite"), this.rootEl.append(
-      this.daysEl,
-      this.sep0El,
-      this.hoursEl,
-      this.sep1El,
-      this.minutesEl,
-      this.sep2El,
-      this.secondsEl,
-      this.a11yEl
-    ), this.shadow.innerHTML = "", this.styleEl && this.shadow.append(this.styleEl), this.shadow.append(this.rootEl), this.setDigits({ d: 0, h: 0, m: 0, s: 0 }, !1), this.hasDigitsRendered = !1;
-  }
-  setTextFallback(t) {
-    this.a11yEl.textContent = t;
-  }
-  applyUnitsVisibility() {
-    if (!this.rootEl) return;
-    if (this.daysEl.style.display = this.showDays ? "" : "none", this.hoursEl.style.display = this.showHours ? "" : "none", this.minutesEl.style.display = this.showMinutes ? "" : "none", this.secondsEl.style.display = this.showSeconds ? "" : "none", !!!this.separatorUrl) {
-      this.sep0El.style.display = "none", this.sep1El.style.display = "none", this.sep2El.style.display = "none";
-      return;
-    }
-    const e = [this.showDays, this.showHours, this.showMinutes, this.showSeconds], s = [];
-    for (let n = 0; n < e.length; n++)
-      e[n] && s.push(n);
-    this.rootEl.style.setProperty("--zh-groups", String(s.length));
-    const i = [!1, !1, !1];
-    if (s.length >= 2)
-      for (let n = 0; n < s.length - 1; n++) {
-        const r = s[n + 1], l = Math.min(2, Math.max(0, r - 1));
-        i[l] = !0;
-      }
-    this.sep0El.style.display = i[0] ? "" : "none", this.sep1El.style.display = i[1] ? "" : "none", this.sep2El.style.display = i[2] ? "" : "none";
-  }
-  setDigits({ d: t, h: e, m: s, s: i }, n = !0) {
-    let r = n;
-    this.hasDigitsRendered || (r = !1);
-    const l = S(Math.min(t, 99), 2), a = S(e, 2), h = [...w(s)], c = [...w(i)];
-    this.syncDigitGroup(this.daysEl, l, r), this.syncDigitGroup(this.hoursEl, a, r), this.syncDigitGroup(this.minutesEl, h, r), this.syncDigitGroup(this.secondsEl, c, r);
-    const u = [];
-    this.showDays && u.push(l.join("")), this.showHours && u.push(a.join("")), this.showMinutes && u.push(h.join("")), this.showSeconds && u.push(c.join("")), this.a11yEl.textContent = u.length ? u.join(":") : "—", this.hasDigitsRendered = !0;
-  }
-  syncDigitGroup(t, e, s) {
-    for (; t.children.length < e.length; ) {
-      const i = t.children.length;
-      t.appendChild(this.createDigitSlot(e[i]));
-    }
-    for (; t.children.length > e.length; ) {
-      const i = t.lastElementChild;
-      if (!i) break;
-      t.removeChild(i);
-    }
-    for (let i = 0; i < e.length; i++) {
-      const n = t.children[i];
-      this.syncDigitSlot(n, e[i], s);
-    }
-  }
-  createDigitSlot(t) {
-    const e = document.createElement("span");
-    e.className = "zh__digit";
-    const s = document.createElement("span");
-    s.className = "zh__digit-track";
-    const i = this.createDigitFace(t);
-    return i.classList.add("zh__digit-face--current"), s.append(i), e.append(s), e;
-  }
-  createDigitFace(t) {
-    const e = document.createElement("span");
-    return e.className = "zh__digit-face", this.setFaceDigit(e, t), e;
-  }
-  setFaceDigit(t, e) {
-    t.dataset.zhDigit = e;
-    const s = F(e);
-    t.style.setProperty("--zh-sheet-index", String(s));
-  }
-  ensureDigitTrack(t) {
-    let e = t.querySelector(".zh__digit-track");
-    return e || (e = document.createElement("span"), e.className = "zh__digit-track", t.innerHTML = "", t.append(e)), e;
-  }
-  getOrCreateCurrentFace(t, e) {
-    let s = t.querySelector(".zh__digit-face--current");
-    if (!s)
-      s = t.querySelector(".zh__digit-face") ?? this.createDigitFace(e), s.classList.add("zh__digit-face--current"), this.setFaceDigit(s, s.dataset.zhDigit ?? e), t.innerHTML = "", t.append(s);
-    else {
-      const i = Array.from(t.children);
-      for (const n of i)
-        n !== s && t.removeChild(n);
-    }
-    return s;
-  }
-  cleanupTrack(t, e) {
-    if (!t.contains(e)) return;
-    const s = Array.from(t.children);
-    for (const i of s)
-      i !== e && t.removeChild(i);
-    e.classList.remove("zh__digit-face--next"), e.classList.add("zh__digit-face--current"), t.style.transition = this.mode === "scroll" ? "" : "none", t.style.transform = "translateY(0)";
-  }
-  parseTransitionMs(t) {
-    const e = window.getComputedStyle(t), s = e.transitionDuration.split(",").map((a) => a.trim()), i = e.transitionDelay.split(",").map((a) => a.trim()), n = (a) => a ? a.endsWith("ms") ? Number.parseFloat(a) : a.endsWith("s") ? Number.parseFloat(a) * 1e3 : Number.parseFloat(a) || 0 : 0, r = s[0] ? n(s[0]) : 0, l = i[0] ? n(i[0]) : 0;
-    return r + l;
-  }
-  animateDigitChange(t, e, s) {
-    const i = this.createDigitFace(s);
-    i.classList.add("zh__digit-face--next"), t.innerHTML = "", t.append(i, e), t.style.transition = "none", t.style.transform = "translateY(-100%)", t.offsetHeight, t.style.transition = "", t.style.transform = "translateY(0)";
-    const n = () => {
-      t.removeEventListener("transitionend", n), t.contains(i) && this.cleanupTrack(t, i);
-    };
-    t.addEventListener("transitionend", n, { once: !0 });
-    const r = this.parseTransitionMs(t) + 150;
-    window.setTimeout(n, r || 800);
-  }
-  syncDigitSlot(t, e, s) {
-    const i = this.ensureDigitTrack(t), n = this.getOrCreateCurrentFace(i, e), r = n.dataset.zhDigit ?? e;
-    if (this.setFaceDigit(n, r), r === e || !s || this.mode !== "scroll") {
-      r !== e && this.setFaceDigit(n, e), this.cleanupTrack(i, n);
-      return;
-    }
-    this.animateDigitChange(i, n, e);
-  }
-  tick() {
-    if (!this.digitsUrl) return;
-    const t = d(this.durationMs);
-    if (t === 0) {
-      this.setDigits({ d: 0, h: 0, m: 0, s: 0 }), this.fireDoneOnce(), this.stop();
-      return;
-    }
-    const e = this.startEpochMs ?? Date.now(), s = d(Date.now() - e), i = d(t - s), { d: n, h: r, m: l, s: a, totalSec: h } = E(i);
-    this.setDigits({ d: n, h: r, m: l, s: a }), h === 0 && (this.fireDoneOnce(), this.stop());
-  }
-  fireDoneOnce() {
-    this.doneFired || (this.doneFired = !0, this.dispatchEvent(new CustomEvent("done")));
-  }
-  scheduleNextSecondBoundary() {
-    const e = 1e3 - Date.now() % 1e3;
-    this.nextTickTimeout = window.setTimeout(() => {
-      this.tick(), this.isRunning() && this.scheduleNextSecondBoundary();
-    }, e);
-  }
-  adoptStylesheet(t) {
-    this.applyStyles(t);
-  }
-  adoptStyles(t) {
-    this.applyStyles(t);
-  }
-  applyStyles(t) {
-    if (typeof t == "string") {
-      if (f(this.shadow)) {
-        const e = z(t);
-        if (e) {
-          this.shadow.adoptedStyleSheets = [e], this.styleEl = null;
-          return;
-        }
-      }
-      this.styleEl || (this.styleEl = document.createElement("style")), this.styleEl.textContent = t;
-      return;
-    }
-    if (t && f(this.shadow)) {
-      this.shadow.adoptedStyleSheets = [t], this.styleEl = null;
-      return;
-    }
-    if (m.defaultStylesheet && f(this.shadow)) {
-      this.shadow.adoptedStyleSheets = [m.defaultStylesheet], this.styleEl = null;
-      return;
-    }
-    this.styleEl || (this.styleEl = document.createElement("style")), this.styleEl.textContent = g;
-  }
-}
-customElements.get("countdown-timer") || customElements.define("countdown-timer", m);
-function L(o = {}) {
-  const { selector: t = "countdown-timer", onDone: e, stylesheet: s } = o, i = Array.from(document.querySelectorAll(t));
-  if (e) {
-    const n = /* @__PURE__ */ new WeakSet(), r = (l) => {
-      n.has(l) || (n.add(l), e(l));
-    };
-    i.forEach((l) => {
-      l.addEventListener("done", () => r(l));
-      const a = l;
-      typeof a.isDone == "function" && a.isDone() && r(l);
-    });
-  }
-  return s && i.forEach((n) => {
-    const r = n;
-    typeof s == "string" ? r.adoptStyles(s) : r.adoptStylesheet(s);
-  }), i;
-}
-export {
-  L as initCountdownTimers,
-  U as zeroHourCssText
-};