@lostgradient/cinder 0.6.0 → 0.8.0

package/src/utilities/use-announcer.svelte.ts

@@ -25,7 +25,6 @@
  * </div>
  * ```
  */
-
 /**
  * Create a screen reader announcer for use with ARIA live regions.
  *
@@ -70,122 +69,110 @@
  * </script>
  * ```
  */
-export function useAnnouncer(
-  options?: import('./use-announcer.types.ts').AnnouncerOptions,
-): import('./use-announcer.types.ts').Announcer {
-  const { clearDelay = 1000, debounceMs = 0 } = options ?? {};
-
-  let message = $state('');
-  let debounceTimeout: ReturnType<typeof setTimeout> | null = null;
-  let setMessageTimeout: ReturnType<typeof setTimeout> | null = null;
-  let autoClearTimeout: ReturnType<typeof setTimeout> | null = null;
-
-  /**
-   * Set the message and schedule auto-clear.
-   * Uses setTimeout(0) to ensure the DOM change is detected
-   * by screen readers (clearing then setting triggers re-announcement).
-   */
-  function setMessage(text: string): void {
-    // Cancel any pending set or clear
-    if (setMessageTimeout) {
-      globalThis.clearTimeout(setMessageTimeout);
-      setMessageTimeout = null;
-    }
-    if (autoClearTimeout) {
-      globalThis.clearTimeout(autoClearTimeout);
-      autoClearTimeout = null;
-    }
-
-    // Clear first to force re-announcement (even for same text)
-    message = '';
-
-    // Set new message after a tick (allows DOM to reflect the cleared state)
-    setMessageTimeout = globalThis.setTimeout(() => {
-      setMessageTimeout = null;
-      message = text;
-
-      // Schedule auto-clear
-      autoClearTimeout = globalThis.setTimeout(() => {
+export function useAnnouncer(options) {
+    const { clearDelay = 1000, debounceMs = 0 } = options ?? {};
+    let message = $state('');
+    let debounceTimeout = null;
+    let setMessageTimeout = null;
+    let autoClearTimeout = null;
+    /**
+     * Set the message and schedule auto-clear.
+     * Uses setTimeout(0) to ensure the DOM change is detected
+     * by screen readers (clearing then setting triggers re-announcement).
+     */
+    function setMessage(text) {
+        // Cancel any pending set or clear
+        if (setMessageTimeout) {
+            globalThis.clearTimeout(setMessageTimeout);
+            setMessageTimeout = null;
+        }
+        if (autoClearTimeout) {
+            globalThis.clearTimeout(autoClearTimeout);
+            autoClearTimeout = null;
+        }
+        // Clear first to force re-announcement (even for same text)
         message = '';
-        autoClearTimeout = null;
-      }, clearDelay);
-    }, 0);
-  }
-
-  /**
-   * Announce a message to screen readers.
-   *
-   * If debounceMs > 0, waits for that duration of inactivity before
-   * announcing. This is useful when announcements may fire rapidly.
-   */
-  function announce(text: string): void {
-    if (debounceMs > 0) {
-      // Clear pending debounce
-      if (debounceTimeout) {
-        globalThis.clearTimeout(debounceTimeout);
-      }
-
-      debounceTimeout = globalThis.setTimeout(() => {
-        debounceTimeout = null;
-        setMessage(text);
-      }, debounceMs);
-    } else {
-      setMessage(text);
+        // Set new message after a tick (allows DOM to reflect the cleared state)
+        setMessageTimeout = globalThis.setTimeout(() => {
+            setMessageTimeout = null;
+            message = text;
+            // Schedule auto-clear
+            autoClearTimeout = globalThis.setTimeout(() => {
+                message = '';
+                autoClearTimeout = null;
+            }, clearDelay);
+        }, 0);
     }
-  }
-
-  /**
-   * Clear any pending announcement and reset the message.
-   */
-  function clear(): void {
-    if (debounceTimeout) {
-      globalThis.clearTimeout(debounceTimeout);
-      debounceTimeout = null;
+    /**
+     * Announce a message to screen readers.
+     *
+     * If debounceMs > 0, waits for that duration of inactivity before
+     * announcing. This is useful when announcements may fire rapidly.
+     */
+    function announce(text) {
+        if (debounceMs > 0) {
+            // Clear pending debounce
+            if (debounceTimeout) {
+                globalThis.clearTimeout(debounceTimeout);
+            }
+            debounceTimeout = globalThis.setTimeout(() => {
+                debounceTimeout = null;
+                setMessage(text);
+            }, debounceMs);
+        }
+        else {
+            setMessage(text);
+        }
     }
-    if (setMessageTimeout) {
-      globalThis.clearTimeout(setMessageTimeout);
-      setMessageTimeout = null;
+    /**
+     * Clear any pending announcement and reset the message.
+     */
+    function clear() {
+        if (debounceTimeout) {
+            globalThis.clearTimeout(debounceTimeout);
+            debounceTimeout = null;
+        }
+        if (setMessageTimeout) {
+            globalThis.clearTimeout(setMessageTimeout);
+            setMessageTimeout = null;
+        }
+        if (autoClearTimeout) {
+            globalThis.clearTimeout(autoClearTimeout);
+            autoClearTimeout = null;
+        }
+        message = '';
     }
-    if (autoClearTimeout) {
-      globalThis.clearTimeout(autoClearTimeout);
-      autoClearTimeout = null;
+    // Cleanup on component destroy
+    $effect(() => {
+        return () => {
+            if (debounceTimeout) {
+                globalThis.clearTimeout(debounceTimeout);
+                debounceTimeout = null;
+            }
+            if (setMessageTimeout) {
+                globalThis.clearTimeout(setMessageTimeout);
+                setMessageTimeout = null;
+            }
+            if (autoClearTimeout) {
+                globalThis.clearTimeout(autoClearTimeout);
+                autoClearTimeout = null;
+            }
+        };
+    });
+    /**
+     * Cleanup all pending timeouts.
+     * Note: This is also called automatically via $effect cleanup on component destroy.
+     * Expose explicitly for cases where consumers need to clean up before unmount.
+     */
+    function destroy() {
+        clear();
     }
-    message = '';
-  }
-
-  // Cleanup on component destroy
-  $effect(() => {
-    return () => {
-      if (debounceTimeout) {
-        globalThis.clearTimeout(debounceTimeout);
-        debounceTimeout = null;
-      }
-      if (setMessageTimeout) {
-        globalThis.clearTimeout(setMessageTimeout);
-        setMessageTimeout = null;
-      }
-      if (autoClearTimeout) {
-        globalThis.clearTimeout(autoClearTimeout);
-        autoClearTimeout = null;
-      }
+    return {
+        get message() {
+            return message;
+        },
+        announce,
+        clear,
+        destroy,
     };
-  });
-
-  /**
-   * Cleanup all pending timeouts.
-   * Note: This is also called automatically via $effect cleanup on component destroy.
-   * Expose explicitly for cases where consumers need to clean up before unmount.
-   */
-  function destroy(): void {
-    clear();
-  }
-
-  return {
-    get message() {
-      return message;
-    },
-    announce,
-    clear,
-    destroy,
-  };
 }

package/src/utilities/use-history.svelte.ts

@@ -13,179 +13,152 @@
  * graphs, or other non-JSON-cloneable values must supply their own `clone`
  * and `equals` strategies.
  */
-
-function defaultClone<T>(value: T): T {
-  // First unwrap any Svelte $state proxies via $state.snapshot, which yields
-  // a plain object graph. Then run structuredClone to enforce our cloneable
-  // contract — structuredClone throws on functions/symbols/etc. ($state.snapshot
-  // only warns and silently includes originals).
-  // The Snapshot<T> type is structurally compatible with T at runtime; the
-  // assertion is needed because Svelte deep-marks the snapshot as readonly.
-  // eslint-disable-next-line @typescript-eslint/no-unsafe-type-assertion
-  const snapshot = $state.snapshot(value) as T;
-  return structuredClone(snapshot);
+function defaultClone(value) {
+    // First unwrap any Svelte $state proxies via $state.snapshot, which yields
+    // a plain object graph. Then run structuredClone to enforce our cloneable
+    // contract — structuredClone throws on functions/symbols/etc. ($state.snapshot
+    // only warns and silently includes originals).
+    // The Snapshot<T> type is structurally compatible with T at runtime; the
+    // assertion is needed because Svelte deep-marks the snapshot as readonly.
+    // eslint-disable-next-line @typescript-eslint/no-unsafe-type-assertion
+    const snapshot = $state.snapshot(value);
+    return structuredClone(snapshot);
 }
-
-function isPlainObjectRecord(value: unknown): value is Record<string, unknown> {
-  return value !== null && typeof value === 'object' && !Array.isArray(value);
+function isPlainObjectRecord(value) {
+    return value !== null && typeof value === 'object' && !Array.isArray(value);
 }
-
 /** Stable JSON serialisation with sorted object keys — used for equality checks. */
-export function stableSerialise(value: unknown): string {
-  return JSON.stringify(value, (_key, val) => {
-    if (!isPlainObjectRecord(val)) return val;
-    const sorted: Record<string, unknown> = {};
-    for (const k of Object.keys(val).toSorted()) {
-      sorted[k] = val[k];
-    }
-    return sorted;
-  });
-}
-
-function defaultEquals<T>(a: T, b: T): boolean {
-  if (a === b) {
-    // Reference identity is a sufficient *positive* signal only for primitives
-    // — for objects, the caller may have mutated in place, so we still need to
-    // serialise and compare. (Two primitives that are === are definitely equal.)
-    if (a === null || typeof a !== 'object') return true;
-  }
-  return stableSerialise(a) === stableSerialise(b);
+export function stableSerialise(value) {
+    return JSON.stringify(value, (_key, val) => {
+        if (!isPlainObjectRecord(val))
+            return val;
+        const sorted = {};
+        for (const k of Object.keys(val).toSorted()) {
+            sorted[k] = val[k];
+        }
+        return sorted;
+    });
 }
-
-export function useHistory<T>(
-  options: import('./use-history.types.ts').UseHistoryOptions<T>,
-): import('./use-history.types.ts').UseHistory<T> {
-  const { initial, coalesceMs = 300, clone = defaultClone, equals = defaultEquals } = options;
-
-  // Clamp maxDepth to at least 1 so the stack always has a committed entry.
-  const maxDepth = Math.max(1, options.maxDepth ?? 100);
-
-  type Entry = {
-    value: T;
-    label?: string | undefined;
-    coalesceKey?: string | undefined;
-    committedAt: number;
-  };
-
-  // Use separate clones for the committed stack and the transient `current`
-  // so direct mutation of `current` (via Svelte's deep reactivity) cannot
-  // corrupt the committed baseline.
-  const seed: Entry = { value: clone(initial), committedAt: 0 };
-  let stack = $state<Entry[]>([seed]);
-  let pointer = $state(0);
-  let current = $state<T>(clone(initial));
-
-  // Invariant: stack always contains at least one entry and pointer is always
-  // a valid index. Calls to this helper express that intent so we don't
-  // litter the implementation with `!` non-null assertions.
-  function entryAt(index: number): Entry {
-    const entry = stack[index];
-    if (!entry) {
-      throw new Error(`useHistory: stack index ${index} out of range (size ${stack.length})`);
+function defaultEquals(a, b) {
+    if (a === b) {
+        // Reference identity is a sufficient *positive* signal only for primitives
+        // — for objects, the caller may have mutated in place, so we still need to
+        // serialise and compare. (Two primitives that are === are definitely equal.)
+        if (a === null || typeof a !== 'object')
+            return true;
     }
-    return entry;
-  }
-
-  function evictIfNeeded() {
-    while (stack.length > maxDepth) {
-      stack.shift();
-      pointer = Math.max(0, pointer - 1);
+    return stableSerialise(a) === stableSerialise(b);
+}
+export function useHistory(options) {
+    const { initial, coalesceMs = 300, clone = defaultClone, equals = defaultEquals } = options;
+    // Clamp maxDepth to at least 1 so the stack always has a committed entry.
+    const maxDepth = Math.max(1, options.maxDepth ?? 100);
+    // Use separate clones for the committed stack and the transient `current`
+    // so direct mutation of `current` (via Svelte's deep reactivity) cannot
+    // corrupt the committed baseline.
+    const seed = { value: clone(initial), committedAt: 0 };
+    let stack = $state([seed]);
+    let pointer = $state(0);
+    let current = $state(clone(initial));
+    // Invariant: stack always contains at least one entry and pointer is always
+    // a valid index. Calls to this helper express that intent so we don't
+    // litter the implementation with `!` non-null assertions.
+    function entryAt(index) {
+        const entry = stack[index];
+        if (!entry) {
+            throw new Error(`useHistory: stack index ${index} out of range (size ${stack.length})`);
+        }
+        return entry;
     }
-  }
-
-  function snapshotEntry(entry: Entry): import('./use-history.types.ts').UseHistoryEntry<T> {
-    // Clone on read so a caller mutating the returned value cannot corrupt
-    // committed history.
-    return { value: clone(entry.value), label: entry.label };
-  }
-
-  return {
-    get current() {
-      return current;
-    },
-    get committedEntry(): import('./use-history.types.ts').UseHistoryEntry<T> {
-      return snapshotEntry(entryAt(pointer));
-    },
-    get canUndo() {
-      return pointer > 0;
-    },
-    get canRedo() {
-      return pointer < stack.length - 1;
-    },
-    get size() {
-      return stack.length;
-    },
-    get index() {
-      return pointer;
-    },
-
-    set(next: T) {
-      current = next;
-    },
-
-    commit(next: T, commitOptions?: import('./use-history.types.ts').UseHistoryCommitOptions) {
-      const top = entryAt(pointer);
-
-      // Clone before any decision so cloneable contract is enforced even when
-      // the value happens to be equal to the committed top.
-      const cloned = clone(next);
-
-      if (equals(next, top.value)) {
-        // Sync `current` to the committed value (caller may have drifted via
-        // set()). Use a fresh clone so consumers can't mutate stack state.
-        current = clone(top.value);
-        return;
-      }
-
-      const now = Date.now();
-      const coalesceKey = commitOptions?.coalesceKey;
-      const label = commitOptions?.label;
-
-      const canCoalesce =
-        coalesceKey !== undefined &&
-        top.coalesceKey === coalesceKey &&
-        now - top.committedAt <= coalesceMs &&
-        pointer === stack.length - 1;
-
-      if (canCoalesce) {
-        stack[pointer] = {
-          value: cloned,
-          label: label ?? top.label,
-          coalesceKey,
-          committedAt: now,
-        };
-      } else {
-        if (pointer < stack.length - 1) {
-          stack = stack.slice(0, pointer + 1);
+    function evictIfNeeded() {
+        while (stack.length > maxDepth) {
+            stack.shift();
+            pointer = Math.max(0, pointer - 1);
         }
-        stack.push({ value: cloned, label, coalesceKey, committedAt: now });
-        pointer = stack.length - 1;
-        evictIfNeeded();
-      }
-
-      current = clone(entryAt(pointer).value);
-    },
-
-    undo() {
-      if (pointer === 0) return null;
-      const left = entryAt(pointer);
-      pointer -= 1;
-      current = clone(entryAt(pointer).value);
-      return snapshotEntry(left);
-    },
-
-    redo() {
-      if (pointer >= stack.length - 1) return null;
-      pointer += 1;
-      const moved = entryAt(pointer);
-      current = clone(moved.value);
-      return snapshotEntry(moved);
-    },
-
-    reset(value: T, label?: string) {
-      stack = [{ value: clone(value), label, committedAt: Date.now() }];
-      pointer = 0;
-      current = clone(value);
-    },
-  };
+    }
+    function snapshotEntry(entry) {
+        // Clone on read so a caller mutating the returned value cannot corrupt
+        // committed history.
+        return { value: clone(entry.value), label: entry.label };
+    }
+    return {
+        get current() {
+            return current;
+        },
+        get committedEntry() {
+            return snapshotEntry(entryAt(pointer));
+        },
+        get canUndo() {
+            return pointer > 0;
+        },
+        get canRedo() {
+            return pointer < stack.length - 1;
+        },
+        get size() {
+            return stack.length;
+        },
+        get index() {
+            return pointer;
+        },
+        set(next) {
+            current = next;
+        },
+        commit(next, commitOptions) {
+            const top = entryAt(pointer);
+            // Clone before any decision so cloneable contract is enforced even when
+            // the value happens to be equal to the committed top.
+            const cloned = clone(next);
+            if (equals(next, top.value)) {
+                // Sync `current` to the committed value (caller may have drifted via
+                // set()). Use a fresh clone so consumers can't mutate stack state.
+                current = clone(top.value);
+                return;
+            }
+            const now = Date.now();
+            const coalesceKey = commitOptions?.coalesceKey;
+            const label = commitOptions?.label;
+            const canCoalesce = coalesceKey !== undefined &&
+                top.coalesceKey === coalesceKey &&
+                now - top.committedAt <= coalesceMs &&
+                pointer === stack.length - 1;
+            if (canCoalesce) {
+                stack[pointer] = {
+                    value: cloned,
+                    label: label ?? top.label,
+                    coalesceKey,
+                    committedAt: now,
+                };
+            }
+            else {
+                if (pointer < stack.length - 1) {
+                    stack = stack.slice(0, pointer + 1);
+                }
+                stack.push({ value: cloned, label, coalesceKey, committedAt: now });
+                pointer = stack.length - 1;
+                evictIfNeeded();
+            }
+            current = clone(entryAt(pointer).value);
+        },
+        undo() {
+            if (pointer === 0)
+                return null;
+            const left = entryAt(pointer);
+            pointer -= 1;
+            current = clone(entryAt(pointer).value);
+            return snapshotEntry(left);
+        },
+        redo() {
+            if (pointer >= stack.length - 1)
+                return null;
+            pointer += 1;
+            const moved = entryAt(pointer);
+            current = clone(moved.value);
+            return snapshotEntry(moved);
+        },
+        reset(value, label) {
+            stack = [{ value: clone(value), label, committedAt: Date.now() }];
+            pointer = 0;
+            current = clone(value);
+        },
+    };
 }

package/src/utilities/use-intersection.svelte.ts

@@ -5,56 +5,41 @@
  * instance. If the caller needs different values, create a new attachment
  * instance so a new observer is created.
  */
-export function useIntersection(
-  onIntersect: import('./use-intersection.types.ts').IntersectionCallback,
-  options: import('./use-intersection.types.ts').UseIntersectionOptions = {},
-): import('./use-intersection.types.ts').IntersectionAttachment {
-  const { root = null, rootMargin = '0px', threshold = 0, enabled = () => true } = options;
-
-  return (node: HTMLElement) => {
-    if (typeof IntersectionObserver === 'undefined') {
-      return () => {};
-    }
-
-    let observer: IntersectionObserver | null = null;
-
-    const disconnectObserver = () => {
-      observer?.disconnect();
-      observer = null;
+export function useIntersection(onIntersect, options = {}) {
+    const { root = null, rootMargin = '0px', threshold = 0, enabled = () => true } = options;
+    return (node) => {
+        if (typeof IntersectionObserver === 'undefined') {
+            return () => { };
+        }
+        let observer = null;
+        const disconnectObserver = () => {
+            observer?.disconnect();
+            observer = null;
+        };
+        $effect(() => {
+            if (!enabled()) {
+                disconnectObserver();
+                return;
+            }
+            observer = new IntersectionObserver((entries) => {
+                if (!enabled()) {
+                    return;
+                }
+                for (const entry of entries) {
+                    onIntersect(entry);
+                }
+            }, {
+                root,
+                rootMargin,
+                threshold,
+            });
+            observer.observe(node);
+            return () => {
+                disconnectObserver();
+            };
+        });
+        return () => {
+            disconnectObserver();
+        };
     };
-
-    $effect(() => {
-      if (!enabled()) {
-        disconnectObserver();
-        return;
-      }
-
-      observer = new IntersectionObserver(
-        (entries) => {
-          if (!enabled()) {
-            return;
-          }
-
-          for (const entry of entries) {
-            onIntersect(entry);
-          }
-        },
-        {
-          root,
-          rootMargin,
-          threshold,
-        },
-      );
-
-      observer.observe(node);
-
-      return () => {
-        disconnectObserver();
-      };
-    });
-
-    return () => {
-      disconnectObserver();
-    };
-  };
 }