@loidolt/theme-svelte 0.2.0 → 0.4.0

package/dist/toaster.svelte.js

@@ -1,3 +1,4 @@
+import { onDestroy } from 'svelte';
 /**
  * Queue behind `Toast` / `ToastViewport`: auto-dismiss with the remaining time preserved
  * across `pause()`/`resume()`, so hovering a toast does not lose the countdown.
@@ -13,24 +14,36 @@
  */
 export function createToaster(options = {}) {
     const { duration: defaultDuration = 5000, max = 5 } = options;
+    if (!Number.isInteger(max) || max < 1) {
+        throw new RangeError('createToaster: `max` must be a positive integer');
+    }
+    const validDuration = (duration) => duration === Infinity || (Number.isFinite(duration) && duration >= 0);
+    if (!validDuration(defaultDuration)) {
+        throw new RangeError('createToaster: `duration` must be non-negative or Infinity');
+    }
     const toasts = $state([]);
     // Plain Map on purpose: these are timer handles, not UI state, and nothing renders from them.
+    // `startedAt` lives per entry: toasts are pushed at different moments, so a shared start
+    // time would corrupt every other toast's remaining time on pause. `timeout: null` marks a
+    // paused entry holding only its remaining time.
     // eslint-disable-next-line svelte/prefer-svelte-reactivity
     const timers = new Map();
-    let startedAt = 0;
     let paused = false;
     let counter = 0;
     function clearTimer(id) {
         const timer = timers.get(id);
-        if (timer)
+        if (timer?.timeout != null)
             clearTimeout(timer.timeout);
         timers.delete(id);
     }
     function arm(id, remaining) {
         if (!Number.isFinite(remaining) || remaining <= 0)
             return;
-        startedAt = Date.now();
-        timers.set(id, { timeout: setTimeout(() => dismiss(id), remaining), remaining });
+        timers.set(id, {
+            timeout: setTimeout(() => dismiss(id), remaining),
+            remaining,
+            startedAt: Date.now(),
+        });
     }
     function dismiss(id) {
         clearTimer(id);
@@ -39,16 +52,36 @@ export function createToaster(options = {}) {
             toasts.splice(index, 1);
     }
     function push(toast) {
+        const duration = toast.duration ?? defaultDuration;
+        if (!validDuration(duration)) {
+            throw new RangeError('createToaster: toast `duration` must be non-negative or Infinity');
+        }
         const id = `ldt-toast-${++counter}`;
         toasts.push({ ...toast, id });
         while (toasts.length > max)
             dismiss(toasts[0].id);
         if (!paused)
-            arm(id, toast.duration ?? defaultDuration);
-        else
-            timers.set(id, { timeout: 0, remaining: toast.duration ?? defaultDuration });
+            arm(id, duration);
+        else {
+            timers.set(id, { timeout: null, remaining: duration, startedAt: 0 });
+        }
         return id;
     }
+    const destroy = () => {
+        for (const timer of timers.values()) {
+            if (timer.timeout !== null)
+                clearTimeout(timer.timeout);
+        }
+        timers.clear();
+        toasts.splice(0);
+        paused = false;
+    };
+    try {
+        onDestroy(destroy);
+    }
+    catch {
+        /* module scope: the caller owns `destroy()` */
+    }
     return {
         get toasts() {
             return toasts;
@@ -63,10 +96,18 @@ export function createToaster(options = {}) {
             if (paused)
                 return;
             paused = true;
-            const elapsed = Date.now() - startedAt;
+            const now = Date.now();
             for (const [id, timer] of timers) {
+                if (timer.timeout === null)
+                    continue;
                 clearTimeout(timer.timeout);
-                timers.set(id, { timeout: 0, remaining: Math.max(0, timer.remaining - elapsed) });
+                timers.set(id, {
+                    timeout: null,
+                    // Floor of 1ms: a toast that expired while paused should dismiss right after
+                    // resume — `0` is the "keep until dismissed" sentinel and would strand it.
+                    remaining: Math.max(1, timer.remaining - (now - timer.startedAt)),
+                    startedAt: 0,
+                });
             }
         },
         resume() {
@@ -78,5 +119,6 @@ export function createToaster(options = {}) {
                 arm(id, timer.remaining);
             }
         },
+        destroy,
     };
 }

package/dist/types.d.ts

@@ -8,6 +8,16 @@ export type BadgeVariant = 'default' | 'accent' | StatusVariant;
 /** Shared control scale. Dialogs extend it with `xl`. */
 export type ControlSize = 'sm' | 'md' | 'lg';
 export type DialogSize = ControlSize | 'xl';
+/**
+ * Badges default to `inline`: a compact chip sized to the text it annotates, for table cells and
+ * running copy. The `ControlSize` steps match the button scale so a badge standing in a row of
+ * controls shares their height instead of floating at half of it.
+ */
+export type BadgeSize = 'inline' | ControlSize;
+/** Column sort state. The values are `aria-sort`'s, so they go straight onto the `<th>`. */
+export type SortDirection = 'ascending' | 'descending' | 'none';
+/** Horizontal text alignment for a table column. */
+export type ColumnAlign = 'start' | 'center' | 'end';
 export type Placement = 'top' | 'right' | 'bottom' | 'left';
 export type Alignment = 'start' | 'center' | 'end';
 export type Orientation = 'horizontal' | 'vertical';
@@ -20,6 +30,17 @@ export interface Option<T extends string = string> {
 }
 /** `Option` is the single vocabulary for choice lists; `NavItem` is kept as a readable alias. */
 export type NavItem<T extends string = string> = Option<T>;
+/** One step in a breadcrumb trail. The final crumb is the current page and takes no `href`. */
+export interface Crumb {
+    label: string;
+    href?: string;
+}
+/** One `Accordion` panel: its heading and the value that identifies it. */
+export interface Disclosure<T extends string = string> {
+    value: T;
+    title: string;
+    disabled?: boolean;
+}
 /** A `DropdownMenu` row. Renders as a link when `href` is set. */
 export interface MenuItem<T extends string = string> extends Option<T> {
     href?: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@loidolt/theme-svelte",
-  "version": "0.2.0",
+  "version": "0.4.0",
   "description": "Accessible Svelte 5 components for Loidolt applications",
   "license": "MIT",
   "type": "module",
@@ -21,31 +21,33 @@
   "sideEffects": [
     "**/*.css"
   ],
-  "engines": {
-    "node": ">=22"
-  },
   "scripts": {
     "build": "svelte-package -i src/lib -o dist && cp src/styles.css dist/styles.css",
+    "prepack": "npm run build",
     "typecheck": "svelte-check --tsconfig ./tsconfig.json",
-    "test": "vitest run",
+    "test": "vitest run && vitest run --config vitest.config.ssr.ts",
+    "test:coverage": "vitest run --coverage",
     "test:a11y": "vitest run tests/a11y.test.ts",
     "clean": "rimraf dist"
   },
   "dependencies": {
-    "@loidolt/theme-styles": "^0.2.0",
-    "@loidolt/theme-tokens": "^0.2.0",
+    "@loidolt/theme-styles": "^0.4.0",
+    "@loidolt/theme-tokens": "^0.4.0",
     "bits-ui": "^2.19.0"
   },
   "peerDependencies": {
     "svelte": "^5.33.0"
   },
   "devDependencies": {
+    "@axe-core/playwright": "^4.13.0",
+    "@playwright/test": "^1.62.1",
     "@sveltejs/package": "^2.5.8",
-    "@types/node": "^24.3.0",
     "@sveltejs/vite-plugin-svelte": "^7.0.0",
     "@testing-library/jest-dom": "^6.8.0",
     "@testing-library/svelte": "^5.2.8",
     "@testing-library/user-event": "^14.6.1",
+    "@types/node": "^24.3.0",
+    "@vitest/coverage-v8": "^4.1.11",
     "jsdom": "^27.0.0",
     "rimraf": "^6.0.1",
     "svelte": "^5.56.10",