zero-hour 1.0.0-dev.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2024 ux-ui.pro
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,153 @@
+<p align="center"><strong>zero-hour</strong></p>
+
+<div align="center">
+<p align="center">ZeroHour is a tiny countdown Web Component. It registers <code>&lt;countdown-timer&gt;</code> that renders a <code>DD:HH:MM:SS</code> countdown (with configurable visible units), counts down to a target date/time with an optional UTC offset, ticks on exact second boundaries, and fires a <code>done</code> event when it reaches zero.</p>
+
+[![npm](https://img.shields.io/npm/v/zero-hour.svg?colorB=brightgreen)](https://www.npmjs.com/package/zero-hour)
+[![GitHub package version](https://img.shields.io/github/package-json/v/ux-ui-pro/zero-hour.svg)](https://github.com/ux-ui-pro/zero-hour)
+[![NPM Downloads](https://img.shields.io/npm/dm/zero-hour.svg?style=flat)](https://www.npmjs.org/package/zero-hour)
+
+<sup>Web Component • TypeScript • ESM/CJS</sup>
+</div>
+<br>
+
+➠ **Install**
+
+```console
+yarn add zero-hour
+```
+<br>
+
+➠ **Import**
+
+```javascript
+// Registers <countdown-timer> via customElements.define(...)
+import 'zero-hour';
+
+// Optional helper: subscribe to `done` and apply stylesheets
+import { initCountdownTimers } from 'zero-hour';
+```
+<br>
+
+➠ **Usage**
+
+```javascript
+// After importing 'zero-hour', the element is registered.
+// Then just place <countdown-timer> in your HTML (see below).
+```
+
+<sub>HTML: default start (autostart=true)</sub>
+```html
+<countdown-timer
+  digits-url="/sprites/digits.webp"
+  separator-url="/sprites/sep.webp"
+  date="2025-12-31"
+  time="23:59:59"
+  utc="+03:00"
+></countdown-timer>
+```
+
+<sub>JS: subscribe to completion + optional styles</sub>
+```javascript
+import { initCountdownTimers } from 'zero-hour';
+
+initCountdownTimers({
+  selector: 'countdown-timer',
+  onDone: (el) => {
+    // The component dispatches: el.dispatchEvent(new CustomEvent('done'))
+    el.classList.add('is-done');
+  },
+  // Optional styles:
+  // - CSSStyleSheet (constructable stylesheet)
+  // - string (e.g. imported via ?raw from your CSS/SCSS pipeline)
+  // stylesheet: myCssStyleSheet,
+});
+```
+
+<sub>JS: custom styles from `?raw` (CSS/SCSS)</sub>
+```javascript
+import { initCountdownTimers } from 'zero-hour';
+import ZeroHourCss from './assets/scss/components/zero-hour.scss?raw';
+
+initCountdownTimers({
+  stylesheet: ZeroHourCss,
+});
+```
+
+<sub>JS: default styles shipped with the package</sub>
+```javascript
+import { initCountdownTimers, zeroHourCssText } from 'zero-hour';
+
+// Option A: use the built-in CSS text export
+initCountdownTimers({
+  stylesheet: zeroHourCssText,
+});
+
+// Option B: import the package CSS file as raw text (your bundler must support ?raw)
+// import ZeroHourCss from 'zero-hour/zero-hour.css?raw';
+// initCountdownTimers({ stylesheet: ZeroHourCss });
+```
+
+<sub>JS: manual control (start/stop/reset)</sub>
+```javascript
+const el = document.querySelector('countdown-timer');
+// @ts-expect-error: methods exist on the custom element instance after import
+el?.stop();
+// @ts-expect-error
+el?.reset();
+// @ts-expect-error
+el?.start();
+```
+
+<sub>Units (units)</sub>
+```html
+<countdown-timer
+  digits-url="/sprites/digits.webp"
+  separator-url="/sprites/sep.webp"
+  date="2025-12-31"
+  time="23:59:59"
+  utc="UTC+0"
+  units="h:m:s"
+></countdown-timer>
+```
+<br>
+
+➠ **Options**
+
+| Option (attribute) | Type | Default | Description |
+|:--------------------:|:-----------------------:|:------------:|:---------------------------------------------------------------------------------------------------------------------------------------------------------|
+| `digits-url` | `string` | — | URL to the digits sprite sheet. **Required** for the graphical display (otherwise only a text fallback is updated in the a11y layer). |
+| `separator-url` | `string` | `null` | URL to the separator sprite (e.g. a colon). If omitted, separators are hidden. |
+| `autostart` | `boolean` | `true` | Auto-start on connect. Can be a boolean attribute (`autostart`) or a string (`autostart="false"`). |
+| `date` | `YYYY-MM-DD` | — | Target date. Without `date` the timer resolves to zero. |
+| `time` | `HH:MM[:SS]` | `00:00:00` | Target time. |
+| `utc` | `UTC±H[:MM]` or `±H[:MM]` | `UTC+0` | UTC offset used to compute the target moment. Examples: `utc="+03:00"`, `utc="UTC-5"`. |
+| `units` | `string` | `"d:h:m:s"` | Visible groups pattern using `d`, `h`, `m`, `s` separated by `:` (e.g. `"h:m:s"`). Empty/invalid value falls back to showing all. |
+
+<br>
+
+➠ **API Methods**
+
+| Method | Description |
+|-------------------|--------------------------------------------------------------------------------------------------|
+| `initCountdownTimers({ selector?, onDone?, stylesheet? }): HTMLElement[]` | Finds elements by selector (default: `countdown-timer`), subscribes to the `done` event (when `onDone` is provided), and optionally applies styles to each element (`stylesheet?: CSSStyleSheet \| string \| null`). When a string is provided, it is applied via `adoptedStyleSheets` when supported, otherwise via a `<style>` fallback inside the shadow root. |
+| `start(): void` | Starts/restarts the countdown (only runs when `digits-url` is set). |
+| `stop(): void` | Stops the timer and clears the scheduled tick. |
+| `reset(): void` | Clears the “done fired” flag and either starts again (if `autostart=true`) or renders a static initial value. |
+| `isRunning(): boolean` | Returns `true` if the timer is running and the next tick is scheduled. |
+| `adoptStylesheet(sheet: CSSStyleSheet): void` | Replaces `adoptedStyleSheets` inside the component’s shadow root. |
+
+<br>
+
+➠ **Notes**
+
+- Updates tick **exactly on second boundaries** (schedules the next tick to the next full second) to keep the display stable.
+- Days render as **two digits** and are capped at **99**.
+- `units` controls which groups (d/h/m/s) are visible. Separators are auto-hidden when `separator-url` is not set, or when a separator is not needed between visible groups.
+- The `done` event fires once per run (after `reset()` it can fire again).
+
+<br>
+
+➠ **License**
+
+zero-hour is released under MIT license

package/dist/index.cjs.js

@@ -0,0 +1,53 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const m=`:host {
+  display: block;
+  width: 100%;
+  container-type: 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, 3%);
+  width: var(--zh-sep-width, 3%);
+  background-image: var(--sep-url);
+  background-repeat: no-repeat;
+  background-position: center;
+  background-size: contain;
+}
+
+.zh__digit {
+  aspect-ratio: 9 / 12;
+  width: 100%;
+  background-image: var(--digits-url);
+  background-repeat: no-repeat;
+  background-size: 100% calc(var(--zh-frames, 10) * 100%);
+  background-position: 0 calc(var(--sheet-index, 0) * 100% / (var(--zh-frames, 10) - 1));
+}
+
+.zh__a11y {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  overflow: hidden;
+  clip: rect(0 0 0 0);
+  white-space: nowrap;
+  clip-path: inset(50%);
+}
+`,S=m;function b(n){if(n==="0")return 9;const t=n.charCodeAt(0)-48;return t>=1&&t<=9?t-1:9}function u(n){return n<0?0:n}const d={showDays:!0,showHours:!0,showMinutes:!0,showSeconds:!0},y={hours:0,minutes:0,seconds:0};function p(n){return"adoptedStyleSheets"in n}function w(n){try{const t=new CSSStyleSheet;return t.replaceSync(n),t}catch{return null}}const M=w(m);function f(n){const t=Math.floor(n/1e3),e=t%60,s=Math.floor(t/60)%60,o=Math.floor(t/3600),i=Math.floor(o/24),r=o%24;return{d:i,h:r,m:s,s:e,totalSec:t}}function E(n){return String(n).padStart(2,"0")}function g(n,t){return[...String(n).padStart(t,"0")]}function T(n,t,e){if(!n.hasAttribute(t))return e;const s=n.getAttribute(t);return s==null||s===""?!0:s!=="false"}function D(n){if(n==null)return null;const t=n.trim();if(!t)return null;const e=t.match(/^(\d{4})-(\d{2})-(\d{2})$/);if(!e)return null;const s=Number(e[1]),o=Number(e[2]),i=Number(e[3]);return!Number.isFinite(s)||!Number.isFinite(o)||!Number.isFinite(i)?null:{year:s,month:o,day:i}}function x(n){if(n==null)return{...y};const t=n.trim();if(!t)return{...y};const e=t.split(":"),s=Number(e[0]??"0"),o=Number(e[1]??"0"),i=Number(e[2]??"0");return{hours:Number.isFinite(s)?s:0,minutes:Number.isFinite(o)?o:0,seconds:Number.isFinite(i)?i:0}}function N(n){if(n==null)return null;let t=n.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,o="0"]=t.split(":"),i=Number(s),r=Number(o);if(!Number.isFinite(i)||!Number.isFinite(r))return null;const h=i*60+r;return e*h}function _(n){const t=n.getAttribute("date"),e=D(t);if(!e)return null;const s=x(n.getAttribute("time")),o=N(n.getAttribute("utc"))??0;return Date.UTC(e.year,e.month-1,e.day,s.hours,s.minutes,s.seconds)-o*60*1e3}function C(n){const t=(n??"").trim().toLowerCase();if(!t)return d;const e=t.split(":").map(a=>a.trim()).filter(Boolean);if(!e.length)return d;const s=new Set(e),o=s.has("d"),i=s.has("h"),r=s.has("m"),h=s.has("s");return!o&&!i&&!r&&!h?d:{showDays:o,showHours:i,showMinutes:r,showSeconds:h}}class c extends HTMLElement{static defaultStylesheet=M;static observedAttributes=["digits-url","separator-url","autostart","date","time","utc","units"];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;connectedCallback(){this.render(),this.readAttributes(),this.autostart?this.start():this.renderStaticInitial()}disconnectedCallback(){this.stop()}attributeChangedCallback(t,e,s){if(!this.isConnected)return;const o=this.isRunning();this.readAttributes(),this.doneFired=!1,o&&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}readAttributes(){this.digitsUrl=this.getAttribute("digits-url"),this.separatorUrl=this.getAttribute("separator-url"),this.autostart=T(this,"autostart",!0);const t=C(this.getAttribute("units"));this.showDays=t.showDays,this.showHours=t.showHours,this.showMinutes=t.showMinutes,this.showSeconds=t.showSeconds;const e=_(this);if(this.targetEpochMs=e,this.durationMs=0,!this.digitsUrl){this.setTextFallback("—:—:—:—");return}this.rootEl.style.setProperty("--digits-url",`url("${this.digitsUrl}")`),this.separatorUrl?this.rootEl.style.setProperty("--sep-url",`url("${this.separatorUrl}")`):this.rootEl.style.removeProperty("--sep-url"),this.applyUnitsVisibility()}renderStaticInitial(){if(this.targetEpochMs!=null){const t=Date.now(),e=u(this.targetEpochMs-t),{d:s,h:o,m:i,s:r}=f(e);this.setDigits({d:s,h:o,m:i,s:r})}else this.setDigits({d:0,h:0,m:0,s:0})}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})}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 i=0;i<e.length;i++)e[i]&&s.push(i);this.rootEl.style.setProperty("--zh-groups",String(s.length));const o=[!1,!1,!1];if(s.length>=2)for(let i=0;i<s.length-1;i++){const r=s[i+1],h=Math.min(2,Math.max(0,r-1));o[h]=!0}this.sep0El.style.display=o[0]?"":"none",this.sep1El.style.display=o[1]?"":"none",this.sep2El.style.display=o[2]?"":"none"}setDigits({d:t,h:e,m:s,s:o}){const i=g(Math.min(t,99),2),r=g(e,2),h=[...E(s)],a=[...E(o)];this.syncDigitGroup(this.daysEl,i),this.syncDigitGroup(this.hoursEl,r),this.syncDigitGroup(this.minutesEl,h),this.syncDigitGroup(this.secondsEl,a);const l=[];this.showDays&&l.push(i.join("")),this.showHours&&l.push(r.join("")),this.showMinutes&&l.push(h.join("")),this.showSeconds&&l.push(a.join("")),this.a11yEl.textContent=l.length?l.join(":"):"—"}syncDigitGroup(t,e){for(;t.children.length<e.length;){const s=document.createElement("span");s.className="zh__digit",t.appendChild(s)}for(;t.children.length>e.length;){const s=t.lastElementChild;if(!s)break;t.removeChild(s)}for(let s=0;s<e.length;s++){const o=t.children[s],i=b(e[s]);o.style.setProperty("--sheet-index",String(i))}}tick(){if(!this.digitsUrl)return;const t=u(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=u(Date.now()-e),o=u(t-s),{d:i,h:r,m:h,s:a,totalSec:l}=f(o);this.setDigits({d:i,h:r,m:h,s:a}),l===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(p(this.shadow)){const e=w(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&&p(this.shadow)){this.shadow.adoptedStyleSheets=[t],this.styleEl=null;return}if(c.defaultStylesheet&&p(this.shadow)){this.shadow.adoptedStyleSheets=[c.defaultStylesheet],this.styleEl=null;return}this.styleEl||(this.styleEl=document.createElement("style")),this.styleEl.textContent=m}}customElements.get("countdown-timer")||customElements.define("countdown-timer",c);function z(n={}){const{selector:t="countdown-timer",onDone:e,stylesheet:s}=n,o=Array.from(document.querySelectorAll(t));return e&&o.forEach(i=>{i.addEventListener("done",()=>e(i))}),s&&o.forEach(i=>{const r=i;typeof s=="string"?r.adoptStyles(s):r.adoptStylesheet(s)}),o}exports.initCountdownTimers=z;exports.zeroHourCssText=S;

package/dist/index.d.ts

@@ -0,0 +1,60 @@
+export declare const zeroHourCssText: string;
+type StylesInput = CSSStyleSheet | string | null | undefined;
+declare class ZeroHour extends HTMLElement {
+    static defaultStylesheet: CSSStyleSheet | null;
+    static observedAttributes: string[];
+    private readonly shadow;
+    private digitsUrl;
+    private separatorUrl;
+    private autostart;
+    private durationMs;
+    private targetEpochMs;
+    private startEpochMs;
+    private nextTickTimeout;
+    private doneFired;
+    private rootEl;
+    private daysEl;
+    private hoursEl;
+    private minutesEl;
+    private secondsEl;
+    private a11yEl;
+    private sep0El;
+    private sep1El;
+    private sep2El;
+    private styleEl;
+    private showDays;
+    private showHours;
+    private showMinutes;
+    private showSeconds;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
+    start(): void;
+    stop(): void;
+    reset(): void;
+    isRunning(): boolean;
+    private readAttributes;
+    private renderStaticInitial;
+    private render;
+    private setTextFallback;
+    private applyUnitsVisibility;
+    private setDigits;
+    private syncDigitGroup;
+    private tick;
+    private fireDoneOnce;
+    private scheduleNextSecondBoundary;
+    adoptStylesheet(sheet: CSSStyleSheet): void;
+    adoptStyles(styles: StylesInput): void;
+    private applyStyles;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'countdown-timer': ZeroHour;
+    }
+}
+export declare function initCountdownTimers(options?: {
+    selector?: string;
+    onDone?: (el: HTMLElement) => void;
+    stylesheet?: CSSStyleSheet | string | null;
+}): HTMLElement[];
+export {};

package/dist/index.es.js

@@ -0,0 +1,341 @@
+const m = `:host {
+  display: block;
+  width: 100%;
+  container-type: 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, 3%);
+  width: var(--zh-sep-width, 3%);
+  background-image: var(--sep-url);
+  background-repeat: no-repeat;
+  background-position: center;
+  background-size: contain;
+}
+
+.zh__digit {
+  aspect-ratio: 9 / 12;
+  width: 100%;
+  background-image: var(--digits-url);
+  background-repeat: no-repeat;
+  background-size: 100% calc(var(--zh-frames, 10) * 100%);
+  background-position: 0 calc(var(--sheet-index, 0) * 100% / (var(--zh-frames, 10) - 1));
+}
+
+.zh__a11y {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  overflow: hidden;
+  clip: rect(0 0 0 0);
+  white-space: nowrap;
+  clip-path: inset(50%);
+}
+`, C = m;
+function S(n) {
+  if (n === "0") return 9;
+  const t = n.charCodeAt(0) - 48;
+  return t >= 1 && t <= 9 ? t - 1 : 9;
+}
+function u(n) {
+  return n < 0 ? 0 : n;
+}
+const d = {
+  showDays: !0,
+  showHours: !0,
+  showMinutes: !0,
+  showSeconds: !0
+}, f = { hours: 0, minutes: 0, seconds: 0 };
+function p(n) {
+  return "adoptedStyleSheets" in n;
+}
+function w(n) {
+  try {
+    const t = new CSSStyleSheet();
+    return t.replaceSync(n), t;
+  } catch {
+    return null;
+  }
+}
+const b = w(m);
+function y(n) {
+  const t = Math.floor(n / 1e3), e = t % 60, s = Math.floor(t / 60) % 60, o = Math.floor(t / 3600), i = Math.floor(o / 24), r = o % 24;
+  return { d: i, h: r, m: s, s: e, totalSec: t };
+}
+function E(n) {
+  return String(n).padStart(2, "0");
+}
+function g(n, t) {
+  return [...String(n).padStart(t, "0")];
+}
+function M(n, t, e) {
+  if (!n.hasAttribute(t)) return e;
+  const s = n.getAttribute(t);
+  return s == null || s === "" ? !0 : s !== "false";
+}
+function D(n) {
+  if (n == null) return null;
+  const t = n.trim();
+  if (!t) return null;
+  const e = t.match(/^(\d{4})-(\d{2})-(\d{2})$/);
+  if (!e) return null;
+  const s = Number(e[1]), o = Number(e[2]), i = Number(e[3]);
+  return !Number.isFinite(s) || !Number.isFinite(o) || !Number.isFinite(i) ? null : { year: s, month: o, day: i };
+}
+function T(n) {
+  if (n == null) return { ...f };
+  const t = n.trim();
+  if (!t) return { ...f };
+  const e = t.split(":"), s = Number(e[0] ?? "0"), o = Number(e[1] ?? "0"), i = Number(e[2] ?? "0");
+  return {
+    hours: Number.isFinite(s) ? s : 0,
+    minutes: Number.isFinite(o) ? o : 0,
+    seconds: Number.isFinite(i) ? i : 0
+  };
+}
+function x(n) {
+  if (n == null) return null;
+  let t = n.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, o = "0"] = t.split(":"), i = Number(s), r = Number(o);
+  if (!Number.isFinite(i) || !Number.isFinite(r)) return null;
+  const h = i * 60 + r;
+  return e * h;
+}
+function N(n) {
+  const t = n.getAttribute("date"), e = D(t);
+  if (!e) return null;
+  const s = T(n.getAttribute("time")), o = x(n.getAttribute("utc")) ?? 0;
+  return Date.UTC(
+    e.year,
+    e.month - 1,
+    e.day,
+    s.hours,
+    s.minutes,
+    s.seconds
+  ) - o * 60 * 1e3;
+}
+function _(n) {
+  const t = (n ?? "").trim().toLowerCase();
+  if (!t)
+    return d;
+  const e = t.split(":").map((a) => a.trim()).filter(Boolean);
+  if (!e.length)
+    return d;
+  const s = new Set(e), o = s.has("d"), i = s.has("h"), r = s.has("m"), h = s.has("s");
+  return !o && !i && !r && !h ? d : { showDays: o, showHours: i, showMinutes: r, showSeconds: h };
+}
+class c extends HTMLElement {
+  static defaultStylesheet = b;
+  static observedAttributes = [
+    "digits-url",
+    "separator-url",
+    "autostart",
+    "date",
+    "time",
+    "utc",
+    "units"
+  ];
+  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;
+  connectedCallback() {
+    this.render(), this.readAttributes(), this.autostart ? this.start() : this.renderStaticInitial();
+  }
+  disconnectedCallback() {
+    this.stop();
+  }
+  attributeChangedCallback(t, e, s) {
+    if (!this.isConnected) return;
+    const o = this.isRunning();
+    this.readAttributes(), this.doneFired = !1, o && 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;
+  }
+  readAttributes() {
+    this.digitsUrl = this.getAttribute("digits-url"), this.separatorUrl = this.getAttribute("separator-url"), this.autostart = M(this, "autostart", !0);
+    const t = _(this.getAttribute("units"));
+    this.showDays = t.showDays, this.showHours = t.showHours, this.showMinutes = t.showMinutes, this.showSeconds = t.showSeconds;
+    const e = N(this);
+    if (this.targetEpochMs = e, this.durationMs = 0, !this.digitsUrl) {
+      this.setTextFallback("—:—:—:—");
+      return;
+    }
+    this.rootEl.style.setProperty("--digits-url", `url("${this.digitsUrl}")`), this.separatorUrl ? this.rootEl.style.setProperty("--sep-url", `url("${this.separatorUrl}")`) : this.rootEl.style.removeProperty("--sep-url"), this.applyUnitsVisibility();
+  }
+  renderStaticInitial() {
+    if (this.targetEpochMs != null) {
+      const t = Date.now(), e = u(this.targetEpochMs - t), { d: s, h: o, m: i, s: r } = y(e);
+      this.setDigits({ d: s, h: o, m: i, s: r });
+    } else
+      this.setDigits({ d: 0, h: 0, m: 0, s: 0 });
+  }
+  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 });
+  }
+  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 i = 0; i < e.length; i++)
+      e[i] && s.push(i);
+    this.rootEl.style.setProperty("--zh-groups", String(s.length));
+    const o = [!1, !1, !1];
+    if (s.length >= 2)
+      for (let i = 0; i < s.length - 1; i++) {
+        const r = s[i + 1], h = Math.min(2, Math.max(0, r - 1));
+        o[h] = !0;
+      }
+    this.sep0El.style.display = o[0] ? "" : "none", this.sep1El.style.display = o[1] ? "" : "none", this.sep2El.style.display = o[2] ? "" : "none";
+  }
+  setDigits({ d: t, h: e, m: s, s: o }) {
+    const i = g(Math.min(t, 99), 2), r = g(e, 2), h = [...E(s)], a = [...E(o)];
+    this.syncDigitGroup(this.daysEl, i), this.syncDigitGroup(this.hoursEl, r), this.syncDigitGroup(this.minutesEl, h), this.syncDigitGroup(this.secondsEl, a);
+    const l = [];
+    this.showDays && l.push(i.join("")), this.showHours && l.push(r.join("")), this.showMinutes && l.push(h.join("")), this.showSeconds && l.push(a.join("")), this.a11yEl.textContent = l.length ? l.join(":") : "—";
+  }
+  syncDigitGroup(t, e) {
+    for (; t.children.length < e.length; ) {
+      const s = document.createElement("span");
+      s.className = "zh__digit", t.appendChild(s);
+    }
+    for (; t.children.length > e.length; ) {
+      const s = t.lastElementChild;
+      if (!s) break;
+      t.removeChild(s);
+    }
+    for (let s = 0; s < e.length; s++) {
+      const o = t.children[s], i = S(e[s]);
+      o.style.setProperty("--sheet-index", String(i));
+    }
+  }
+  tick() {
+    if (!this.digitsUrl) return;
+    const t = u(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 = u(Date.now() - e), o = u(t - s), { d: i, h: r, m: h, s: a, totalSec: l } = y(o);
+    this.setDigits({ d: i, h: r, m: h, s: a }), l === 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);
+  }
+  // Accept CSSStyleSheet OR raw CSS text (e.g. imported with ?raw from SCSS/CSS pipelines)
+  adoptStyles(t) {
+    this.applyStyles(t);
+  }
+  applyStyles(t) {
+    if (typeof t == "string") {
+      if (p(this.shadow)) {
+        const e = w(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 && p(this.shadow)) {
+      this.shadow.adoptedStyleSheets = [t], this.styleEl = null;
+      return;
+    }
+    if (c.defaultStylesheet && p(this.shadow)) {
+      this.shadow.adoptedStyleSheets = [c.defaultStylesheet], this.styleEl = null;
+      return;
+    }
+    this.styleEl || (this.styleEl = document.createElement("style")), this.styleEl.textContent = m;
+  }
+}
+customElements.get("countdown-timer") || customElements.define("countdown-timer", c);
+function k(n = {}) {
+  const { selector: t = "countdown-timer", onDone: e, stylesheet: s } = n, o = Array.from(document.querySelectorAll(t));
+  return e && o.forEach((i) => {
+    i.addEventListener("done", () => e(i));
+  }), s && o.forEach((i) => {
+    const r = i;
+    typeof s == "string" ? r.adoptStyles(s) : r.adoptStylesheet(s);
+  }), o;
+}
+export {
+  k as initCountdownTimers,
+  C as zeroHourCssText
+};

package/dist/index.umd.js

@@ -0,0 +1,53 @@
+(function(a,u){typeof exports=="object"&&typeof module<"u"?u(exports):typeof define=="function"&&define.amd?define(["exports"],u):(a=typeof globalThis<"u"?globalThis:a||self,u(a.ZeroHour={}))})(this,(function(a){"use strict";const u=`:host {
+  display: block;
+  width: 100%;
+  container-type: 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, 3%);
+  width: var(--zh-sep-width, 3%);
+  background-image: var(--sep-url);
+  background-repeat: no-repeat;
+  background-position: center;
+  background-size: contain;
+}
+
+.zh__digit {
+  aspect-ratio: 9 / 12;
+  width: 100%;
+  background-image: var(--digits-url);
+  background-repeat: no-repeat;
+  background-size: 100% calc(var(--zh-frames, 10) * 100%);
+  background-position: 0 calc(var(--sheet-index, 0) * 100% / (var(--zh-frames, 10) - 1));
+}
+
+.zh__a11y {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  overflow: hidden;
+  clip: rect(0 0 0 0);
+  white-space: nowrap;
+  clip-path: inset(50%);
+}
+`,b=u;function M(n){if(n==="0")return 9;const t=n.charCodeAt(0)-48;return t>=1&&t<=9?t-1:9}function d(n){return n<0?0:n}const m={showDays:!0,showHours:!0,showMinutes:!0,showSeconds:!0},y={hours:0,minutes:0,seconds:0};function f(n){return"adoptedStyleSheets"in n}function E(n){try{const t=new CSSStyleSheet;return t.replaceSync(n),t}catch{return null}}const T=E(u);function g(n){const t=Math.floor(n/1e3),e=t%60,s=Math.floor(t/60)%60,o=Math.floor(t/3600),i=Math.floor(o/24),r=o%24;return{d:i,h:r,m:s,s:e,totalSec:t}}function w(n){return String(n).padStart(2,"0")}function S(n,t){return[...String(n).padStart(t,"0")]}function D(n,t,e){if(!n.hasAttribute(t))return e;const s=n.getAttribute(t);return s==null||s===""?!0:s!=="false"}function x(n){if(n==null)return null;const t=n.trim();if(!t)return null;const e=t.match(/^(\d{4})-(\d{2})-(\d{2})$/);if(!e)return null;const s=Number(e[1]),o=Number(e[2]),i=Number(e[3]);return!Number.isFinite(s)||!Number.isFinite(o)||!Number.isFinite(i)?null:{year:s,month:o,day:i}}function N(n){if(n==null)return{...y};const t=n.trim();if(!t)return{...y};const e=t.split(":"),s=Number(e[0]??"0"),o=Number(e[1]??"0"),i=Number(e[2]??"0");return{hours:Number.isFinite(s)?s:0,minutes:Number.isFinite(o)?o:0,seconds:Number.isFinite(i)?i:0}}function _(n){if(n==null)return null;let t=n.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,o="0"]=t.split(":"),i=Number(s),r=Number(o);if(!Number.isFinite(i)||!Number.isFinite(r))return null;const h=i*60+r;return e*h}function C(n){const t=n.getAttribute("date"),e=x(t);if(!e)return null;const s=N(n.getAttribute("time")),o=_(n.getAttribute("utc"))??0;return Date.UTC(e.year,e.month-1,e.day,s.hours,s.minutes,s.seconds)-o*60*1e3}function z(n){const t=(n??"").trim().toLowerCase();if(!t)return m;const e=t.split(":").map(c=>c.trim()).filter(Boolean);if(!e.length)return m;const s=new Set(e),o=s.has("d"),i=s.has("h"),r=s.has("m"),h=s.has("s");return!o&&!i&&!r&&!h?m:{showDays:o,showHours:i,showMinutes:r,showSeconds:h}}class p extends HTMLElement{static defaultStylesheet=T;static observedAttributes=["digits-url","separator-url","autostart","date","time","utc","units"];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;connectedCallback(){this.render(),this.readAttributes(),this.autostart?this.start():this.renderStaticInitial()}disconnectedCallback(){this.stop()}attributeChangedCallback(t,e,s){if(!this.isConnected)return;const o=this.isRunning();this.readAttributes(),this.doneFired=!1,o&&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}readAttributes(){this.digitsUrl=this.getAttribute("digits-url"),this.separatorUrl=this.getAttribute("separator-url"),this.autostart=D(this,"autostart",!0);const t=z(this.getAttribute("units"));this.showDays=t.showDays,this.showHours=t.showHours,this.showMinutes=t.showMinutes,this.showSeconds=t.showSeconds;const e=C(this);if(this.targetEpochMs=e,this.durationMs=0,!this.digitsUrl){this.setTextFallback("—:—:—:—");return}this.rootEl.style.setProperty("--digits-url",`url("${this.digitsUrl}")`),this.separatorUrl?this.rootEl.style.setProperty("--sep-url",`url("${this.separatorUrl}")`):this.rootEl.style.removeProperty("--sep-url"),this.applyUnitsVisibility()}renderStaticInitial(){if(this.targetEpochMs!=null){const t=Date.now(),e=d(this.targetEpochMs-t),{d:s,h:o,m:i,s:r}=g(e);this.setDigits({d:s,h:o,m:i,s:r})}else this.setDigits({d:0,h:0,m:0,s:0})}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})}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 i=0;i<e.length;i++)e[i]&&s.push(i);this.rootEl.style.setProperty("--zh-groups",String(s.length));const o=[!1,!1,!1];if(s.length>=2)for(let i=0;i<s.length-1;i++){const r=s[i+1],h=Math.min(2,Math.max(0,r-1));o[h]=!0}this.sep0El.style.display=o[0]?"":"none",this.sep1El.style.display=o[1]?"":"none",this.sep2El.style.display=o[2]?"":"none"}setDigits({d:t,h:e,m:s,s:o}){const i=S(Math.min(t,99),2),r=S(e,2),h=[...w(s)],c=[...w(o)];this.syncDigitGroup(this.daysEl,i),this.syncDigitGroup(this.hoursEl,r),this.syncDigitGroup(this.minutesEl,h),this.syncDigitGroup(this.secondsEl,c);const l=[];this.showDays&&l.push(i.join("")),this.showHours&&l.push(r.join("")),this.showMinutes&&l.push(h.join("")),this.showSeconds&&l.push(c.join("")),this.a11yEl.textContent=l.length?l.join(":"):"—"}syncDigitGroup(t,e){for(;t.children.length<e.length;){const s=document.createElement("span");s.className="zh__digit",t.appendChild(s)}for(;t.children.length>e.length;){const s=t.lastElementChild;if(!s)break;t.removeChild(s)}for(let s=0;s<e.length;s++){const o=t.children[s],i=M(e[s]);o.style.setProperty("--sheet-index",String(i))}}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),o=d(t-s),{d:i,h:r,m:h,s:c,totalSec:l}=g(o);this.setDigits({d:i,h:r,m:h,s:c}),l===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=E(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(p.defaultStylesheet&&f(this.shadow)){this.shadow.adoptedStyleSheets=[p.defaultStylesheet],this.styleEl=null;return}this.styleEl||(this.styleEl=document.createElement("style")),this.styleEl.textContent=u}}customElements.get("countdown-timer")||customElements.define("countdown-timer",p);function k(n={}){const{selector:t="countdown-timer",onDone:e,stylesheet:s}=n,o=Array.from(document.querySelectorAll(t));return e&&o.forEach(i=>{i.addEventListener("done",()=>e(i))}),s&&o.forEach(i=>{const r=i;typeof s=="string"?r.adoptStyles(s):r.adoptStylesheet(s)}),o}a.initCountdownTimers=k,a.zeroHourCssText=b,Object.defineProperty(a,Symbol.toStringTag,{value:"Module"})}));

package/dist/zero-hour.css

@@ -0,0 +1 @@
+:host{width:100%;display:block;overflow:hidden;container-type: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,3%);width:var(--zh-sep-width,3%);background-image:var(--sep-url);background-position:50%;background-repeat:no-repeat;background-size:contain}.zh__digit{aspect-ratio:9/12;background-image:var(--digits-url);background-repeat:no-repeat;background-size:100% calc(var(--zh-frames,10)*100%);background-position:0 calc(var(--sheet-index,0)*100%/(var(--zh-frames,10) - 1));width: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

@@ -0,0 +1,75 @@
+{
+  "name": "zero-hour",
+  "version": "1.0.0-dev.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.",
+  "author": "ux-ui.pro",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/ux-ui-pro/zero-hour.git"
+  },
+  "bugs": {
+    "url": "https://github.com/ux-ui-pro/zero-hour/issues"
+  },
+  "homepage": "https://github.com/ux-ui-pro/zero-hour",
+  "sideEffects": false,
+  "scripts": {
+    "clean": "rimraf dist",
+    "build": "vite build",
+    "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"
+  },
+  "source": "src/index.ts",
+  "main": "dist/index.cjs.js",
+  "module": "dist/index.es.js",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.es.js",
+      "require": "./dist/index.cjs.js"
+    },
+    "./zero-hour.css": "./dist/zero-hour.css",
+    "./dist/*": "./dist/*"
+  },
+  "files": [
+    "dist/"
+  ],
+  "devDependencies": {
+    "@biomejs/biome": "2.3.9",
+    "@types/node": "25.0.2",
+    "lightningcss": "1.30.2",
+    "rimraf": "6.1.2",
+    "typescript": "5.9.3",
+    "vite": "7.3.0",
+    "vite-plugin-dts": "4.5.4"
+  },
+  "keywords": [
+    "typescript",
+    "frontend",
+    "library",
+    "countdown",
+    "countdown timer",
+    "timer",
+    "web component",
+    "web-component",
+    "custom elements",
+    "custom-elements",
+    "shadow dom",
+    "shadow-dom",
+    "dom",
+    "ui",
+    "component",
+    "digital",
+    "sprite",
+    "date",
+    "time",
+    "utc",
+    "accessibility",
+    "a11y",
+    "zero-hour"
+  ]
+}