@brandlab-digital/site-next 3.8.0 → 3.10.0

package/dist/navigation/use-header-metrics.js

@@ -0,0 +1,52 @@
+'use client';
+/**
+ * F2: the header's measured state. The mode follows the header's own width (so a framed specimen behaves like a real
+ * window): 1280 px and up `desktop`, 1024 to 1279 px `compact`, below 1024 px `phone`. The hook writes the frozen
+ * hooks on the header root (`data-mode`, `data-hydrated`, `data-compact`) and `--bl-header-height` on the document,
+ * which drives `scroll-padding-top` (WCAG 2.4.11).
+ */
+import { useEffect, useState } from 'react';
+import { HEADER_COMPACT_AFTER_SCROLL_PX, headerModeFor } from './constants.js';
+export function useHeaderMetrics(rootRef, options = {}) {
+    const compactAfterScroll = options.compactAfterScroll ?? false;
+    const [metrics, setMetrics] = useState({ mode: null, hydrated: false });
+    useEffect(() => {
+        const root = rootRef.current;
+        if (!root)
+            return;
+        const html = document.documentElement;
+        const measure = () => {
+            const box = root.getBoundingClientRect();
+            const mode = headerModeFor(box.width);
+            root.dataset.mode = mode;
+            html.style.setProperty('--bl-header-height', `${Math.round(box.height)}px`);
+            setMetrics((current) => (current.mode === mode && current.hydrated ? current : { mode, hydrated: true }));
+        };
+        const onScroll = () => {
+            root.dataset.compact = window.scrollY > HEADER_COMPACT_AFTER_SCROLL_PX ? 'true' : 'false';
+        };
+        root.dataset.hydrated = 'true';
+        measure();
+        let observer;
+        if (typeof ResizeObserver === 'function') {
+            observer = new ResizeObserver(measure);
+            observer.observe(root);
+        }
+        else {
+            window.addEventListener('resize', measure);
+        }
+        if (compactAfterScroll) {
+            onScroll();
+            window.addEventListener('scroll', onScroll, { passive: true });
+        }
+        return () => {
+            observer?.disconnect();
+            window.removeEventListener('resize', measure);
+            window.removeEventListener('scroll', onScroll);
+            delete root.dataset.compact;
+            html.style.removeProperty('--bl-header-height');
+        };
+    }, [rootRef, compactAfterScroll]);
+    return metrics;
+}
+//# sourceMappingURL=use-header-metrics.js.map

package/dist/navigation/use-header-metrics.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-header-metrics.js","sourceRoot":"","sources":["../../src/navigation/use-header-metrics.ts"],"names":[],"mappings":"AAAA,YAAY,CAAA;AAEZ;;;;;GAKG;AACH,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAkB,MAAM,OAAO,CAAA;AAC3D,OAAO,EAAE,8BAA8B,EAAE,aAAa,EAAmB,MAAM,gBAAgB,CAAA;AAQ/F,MAAM,UAAU,gBAAgB,CAAC,OAAsC,EAAE,UAA4C,EAAE;IACrH,MAAM,kBAAkB,GAAG,OAAO,CAAC,kBAAkB,IAAI,KAAK,CAAA;IAC9D,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAgB,EAAE,IAAI,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC,CAAA;IAEtF,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,IAAI,GAAG,OAAO,CAAC,OAAO,CAAA;QAC5B,IAAI,CAAC,IAAI;YAAE,OAAM;QACjB,MAAM,IAAI,GAAG,QAAQ,CAAC,eAAe,CAAA;QACrC,MAAM,OAAO,GAAG,GAAG,EAAE;YACnB,MAAM,GAAG,GAAG,IAAI,CAAC,qBAAqB,EAAE,CAAA;YACxC,MAAM,IAAI,GAAG,aAAa,CAAC,GAAG,CAAC,KAAK,CAAC,CAAA;YACrC,IAAI,CAAC,OAAO,CAAC,IAAI,GAAG,IAAI,CAAA;YACxB,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,oBAAoB,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,CAAA;YAC3E,UAAU,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,CAAC,OAAO,CAAC,IAAI,KAAK,IAAI,IAAI,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC,CAAA;QAC3G,CAAC,CAAA;QACD,MAAM,QAAQ,GAAG,GAAG,EAAE;YACpB,IAAI,CAAC,OAAO,CAAC,OAAO,GAAG,MAAM,CAAC,OAAO,GAAG,8BAA8B,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,CAAA;QAC3F,CAAC,CAAA;QACD,IAAI,CAAC,OAAO,CAAC,QAAQ,GAAG,MAAM,CAAA;QAC9B,OAAO,EAAE,CAAA;QACT,IAAI,QAAoC,CAAA;QACxC,IAAI,OAAO,cAAc,KAAK,UAAU,EAAE,CAAC;YACzC,QAAQ,GAAG,IAAI,cAAc,CAAC,OAAO,CAAC,CAAA;YACtC,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,CAAA;QACxB,CAAC;aAAM,CAAC;YACN,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAA;QAC5C,CAAC;QACD,IAAI,kBAAkB,EAAE,CAAC;YACvB,QAAQ,EAAE,CAAA;YACV,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,QAAQ,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAA;QAChE,CAAC;QACD,OAAO,GAAG,EAAE;YACV,QAAQ,EAAE,UAAU,EAAE,CAAA;YACtB,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAA;YAC7C,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAA;YAC9C,OAAO,IAAI,CAAC,OAAO,CAAC,OAAO,CAAA;YAC3B,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,oBAAoB,CAAC,CAAA;QACjD,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,OAAO,EAAE,kBAAkB,CAAC,CAAC,CAAA;IAEjC,OAAO,OAAO,CAAA;AAChB,CAAC","sourcesContent":["'use client'\n\n/**\n * F2: the header's measured state. The mode follows the header's own width (so a framed specimen behaves like a real\n * window): 1280 px and up `desktop`, 1024 to 1279 px `compact`, below 1024 px `phone`. The hook writes the frozen\n * hooks on the header root (`data-mode`, `data-hydrated`, `data-compact`) and `--bl-header-height` on the document,\n * which drives `scroll-padding-top` (WCAG 2.4.11).\n */\nimport { useEffect, useState, type RefObject } from 'react'\nimport { HEADER_COMPACT_AFTER_SCROLL_PX, headerModeFor, type HeaderMode } from './constants.js'\n\nexport interface HeaderMetrics {\n  /** Null until the header has been measured after hydration. */\n  readonly mode: HeaderMode | null\n  readonly hydrated: boolean\n}\n\nexport function useHeaderMetrics(rootRef: RefObject<HTMLElement | null>, options: { compactAfterScroll?: boolean } = {}): HeaderMetrics {\n  const compactAfterScroll = options.compactAfterScroll ?? false\n  const [metrics, setMetrics] = useState<HeaderMetrics>({ mode: null, hydrated: false })\n\n  useEffect(() => {\n    const root = rootRef.current\n    if (!root) return\n    const html = document.documentElement\n    const measure = () => {\n      const box = root.getBoundingClientRect()\n      const mode = headerModeFor(box.width)\n      root.dataset.mode = mode\n      html.style.setProperty('--bl-header-height', `${Math.round(box.height)}px`)\n      setMetrics((current) => (current.mode === mode && current.hydrated ? current : { mode, hydrated: true }))\n    }\n    const onScroll = () => {\n      root.dataset.compact = window.scrollY > HEADER_COMPACT_AFTER_SCROLL_PX ? 'true' : 'false'\n    }\n    root.dataset.hydrated = 'true'\n    measure()\n    let observer: ResizeObserver | undefined\n    if (typeof ResizeObserver === 'function') {\n      observer = new ResizeObserver(measure)\n      observer.observe(root)\n    } else {\n      window.addEventListener('resize', measure)\n    }\n    if (compactAfterScroll) {\n      onScroll()\n      window.addEventListener('scroll', onScroll, { passive: true })\n    }\n    return () => {\n      observer?.disconnect()\n      window.removeEventListener('resize', measure)\n      window.removeEventListener('scroll', onScroll)\n      delete root.dataset.compact\n      html.style.removeProperty('--bl-header-height')\n    }\n  }, [rootRef, compactAfterScroll])\n\n  return metrics\n}\n"]}

package/dist/navigation/use-navigation-menu.d.ts

@@ -0,0 +1,39 @@
+/**
+ * F3: the dropdown engine. The WAI-ARIA disclosure navigation pattern with top-level links and separate disclosure
+ * buttons, and the whole v1 §5.6 state table. Timings and rules are constants of the library; a site can't change
+ * them. The engine reads the DOM by hooks only (`data-slot="trigger"` and `data-slot="panel"` with `data-menu-id`),
+ * so the links and panels stay server-rendered.
+ */
+import { type FocusEvent, type KeyboardEvent, type MouseEvent, type PointerEvent, type RefObject } from 'react';
+export type NavigationOpenedBy = 'hover' | 'click' | 'touch' | 'keyboard';
+export interface NavigationMenu {
+    /** The open panel's menu id, or null. One panel is open at a time. */
+    readonly openId: string | null;
+    readonly openedBy: NavigationOpenedBy | null;
+    close(): void;
+    /** Spread on the item (`<li>`): hover intent and Tab out. */
+    itemHandlers(id: string): {
+        onPointerEnter(event: PointerEvent): void;
+        onPointerLeave(event: PointerEvent): void;
+        onPointerDown(event: PointerEvent): void;
+        onBlur(event: FocusEvent<HTMLElement>): void;
+    };
+    /** Spread on the disclosure button: click, Enter and Space toggle; Arrow Down opens and enters the panel. */
+    triggerHandlers(id: string): {
+        onClick(event: MouseEvent<HTMLButtonElement>): void;
+        onKeyDown(event: KeyboardEvent<HTMLButtonElement>): void;
+    };
+    /** Spread on the panel: Arrow Up, Arrow Down, Home and End move between its links; a link click closes. */
+    panelHandlers(id: string): {
+        onKeyDown(event: KeyboardEvent<HTMLElement>): void;
+        onClick(event: MouseEvent<HTMLElement>): void;
+    };
+}
+/**
+ * The menu state for one navigation. `navRef` is the `<nav>`; a change of `resetKey` (route or breakpoint) closes
+ * every panel, as does `popstate`, Escape (focus returns to the chevron), a pointer down outside, Tab out of an item
+ * and a link click. A mouse opens a panel 100 ms after it enters an item and closes it 200 ms after it leaves, even
+ * after a click; the first click on a hover-opened chevron confirms the panel instead of closing it.
+ */
+export declare function useNavigationMenu(navRef: RefObject<HTMLElement | null>, resetKey: unknown): NavigationMenu;
+//# sourceMappingURL=use-navigation-menu.d.ts.map

package/dist/navigation/use-navigation-menu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-navigation-menu.d.ts","sourceRoot":"","sources":["../../src/navigation/use-navigation-menu.ts"],"names":[],"mappings":"AAEA;;;;;GAKG;AACH,OAAO,EAA4C,KAAK,UAAU,EAAE,KAAK,aAAa,EAAE,KAAK,UAAU,EAAE,KAAK,YAAY,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAGzJ,MAAM,MAAM,kBAAkB,GAAG,OAAO,GAAG,OAAO,GAAG,OAAO,GAAG,UAAU,CAAA;AAezE,MAAM,WAAW,cAAc;IAC7B,sEAAsE;IACtE,QAAQ,CAAC,MAAM,EAAE,MAAM,GAAG,IAAI,CAAA;IAC9B,QAAQ,CAAC,QAAQ,EAAE,kBAAkB,GAAG,IAAI,CAAA;IAC5C,KAAK,IAAI,IAAI,CAAA;IACb,6DAA6D;IAC7D,YAAY,CAAC,EAAE,EAAE,MAAM,GAAG;QACxB,cAAc,CAAC,KAAK,EAAE,YAAY,GAAG,IAAI,CAAA;QACzC,cAAc,CAAC,KAAK,EAAE,YAAY,GAAG,IAAI,CAAA;QACzC,aAAa,CAAC,KAAK,EAAE,YAAY,GAAG,IAAI,CAAA;QACxC,MAAM,CAAC,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,GAAG,IAAI,CAAA;KAC7C,CAAA;IACD,6GAA6G;IAC7G,eAAe,CAAC,EAAE,EAAE,MAAM,GAAG;QAC3B,OAAO,CAAC,KAAK,EAAE,UAAU,CAAC,iBAAiB,CAAC,GAAG,IAAI,CAAA;QACnD,SAAS,CAAC,KAAK,EAAE,aAAa,CAAC,iBAAiB,CAAC,GAAG,IAAI,CAAA;KACzD,CAAA;IACD,2GAA2G;IAC3G,aAAa,CAAC,EAAE,EAAE,MAAM,GAAG;QACzB,SAAS,CAAC,KAAK,EAAE,aAAa,CAAC,WAAW,CAAC,GAAG,IAAI,CAAA;QAClD,OAAO,CAAC,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,GAAG,IAAI,CAAA;KAC9C,CAAA;CACF;AAED;;;;;GAKG;AACH,wBAAgB,iBAAiB,CAAC,MAAM,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,EAAE,QAAQ,EAAE,OAAO,GAAG,cAAc,CA6K1G"}

package/dist/navigation/use-navigation-menu.js

@@ -0,0 +1,206 @@
+'use client';
+/**
+ * F3: the dropdown engine. The WAI-ARIA disclosure navigation pattern with top-level links and separate disclosure
+ * buttons, and the whole v1 §5.6 state table. Timings and rules are constants of the library; a site can't change
+ * them. The engine reads the DOM by hooks only (`data-slot="trigger"` and `data-slot="panel"` with `data-menu-id`),
+ * so the links and panels stay server-rendered.
+ */
+import { useCallback, useEffect, useRef, useState } from 'react';
+import { NAV_HOVER_CLOSE_DELAY_MS, NAV_HOVER_MEDIA_QUERY, NAV_HOVER_OPEN_DELAY_MS } from './constants.js';
+const CLOSED = { id: null, by: null };
+/** "Mouse" means pointerType mouse on a (hover: hover) and (pointer: fine) device. Touch never opens on hover. */
+function isMouse(event) {
+    if (event.pointerType !== 'mouse')
+        return false;
+    return typeof window.matchMedia === 'function' && window.matchMedia(NAV_HOVER_MEDIA_QUERY).matches;
+}
+/**
+ * The menu state for one navigation. `navRef` is the `<nav>`; a change of `resetKey` (route or breakpoint) closes
+ * every panel, as does `popstate`, Escape (focus returns to the chevron), a pointer down outside, Tab out of an item
+ * and a link click. A mouse opens a panel 100 ms after it enters an item and closes it 200 ms after it leaves, even
+ * after a click; the first click on a hover-opened chevron confirms the panel instead of closing it.
+ */
+export function useNavigationMenu(navRef, resetKey) {
+    const [state, setState] = useState(CLOSED);
+    const stateRef = useRef(state);
+    const openTimer = useRef(null);
+    const closeTimer = useRef(null);
+    const lastPointerType = useRef('mouse');
+    const focusFirstOf = useRef(null);
+    const commit = useCallback((next) => {
+        stateRef.current = next;
+        setState(next);
+    }, []);
+    const clearTimers = useCallback(() => {
+        if (openTimer.current !== null)
+            window.clearTimeout(openTimer.current);
+        if (closeTimer.current !== null)
+            window.clearTimeout(closeTimer.current);
+        openTimer.current = null;
+        closeTimer.current = null;
+    }, []);
+    const close = useCallback(() => {
+        clearTimers();
+        if (stateRef.current.id !== null)
+            commit(CLOSED);
+    }, [clearTimers, commit]);
+    const trigger = useCallback((id) => navRef.current?.querySelector(`[data-slot="trigger"][data-menu-id="${id}"]`) ?? null, [navRef]);
+    const panelLinks = useCallback((id) => Array.from(navRef.current?.querySelectorAll(`[data-slot="panel"][data-menu-id="${id}"] a[href]`) ?? []), [navRef]);
+    // Arrow Down opened a panel: focus its first link once the panel is no longer inert.
+    useEffect(() => {
+        if (state.id && focusFirstOf.current === state.id) {
+            focusFirstOf.current = null;
+            panelLinks(state.id)[0]?.focus();
+        }
+    }, [state, panelLinks]);
+    // Escape closes and returns focus to the chevron; a pointer down outside closes.
+    useEffect(() => {
+        if (!state.id)
+            return;
+        const onKey = (event) => {
+            if (event.key !== 'Escape' || !stateRef.current.id)
+                return;
+            const id = stateRef.current.id;
+            const item = trigger(id)?.closest('[data-slot="item"]');
+            const focusInside = item?.contains(document.activeElement) ?? false;
+            close();
+            if (focusInside)
+                trigger(id)?.focus();
+        };
+        const onPointerDown = (event) => {
+            if (!navRef.current?.contains(event.target))
+                close();
+        };
+        document.addEventListener('keydown', onKey);
+        document.addEventListener('pointerdown', onPointerDown);
+        return () => {
+            document.removeEventListener('keydown', onKey);
+            document.removeEventListener('pointerdown', onPointerDown);
+        };
+    }, [state.id, close, navRef, trigger]);
+    // A route change, popstate or a breakpoint crossing (resetKey) closes every panel.
+    useEffect(() => {
+        close();
+    }, [resetKey, close]);
+    useEffect(() => {
+        const onPop = () => close();
+        window.addEventListener('popstate', onPop);
+        return () => {
+            window.removeEventListener('popstate', onPop);
+            clearTimers();
+        };
+    }, [close, clearTimers]);
+    const itemHandlers = (id) => ({
+        onPointerEnter: (event) => {
+            lastPointerType.current = event.pointerType;
+            if (!isMouse(event))
+                return;
+            if (closeTimer.current !== null) {
+                window.clearTimeout(closeTimer.current);
+                closeTimer.current = null;
+            }
+            const current = stateRef.current;
+            if (current.id === id)
+                return;
+            if (current.id !== null) {
+                // Another panel is open: switch immediately.
+                commit({ id, by: 'hover' });
+                return;
+            }
+            if (openTimer.current !== null)
+                window.clearTimeout(openTimer.current);
+            openTimer.current = window.setTimeout(() => {
+                openTimer.current = null;
+                commit({ id, by: 'hover' });
+            }, NAV_HOVER_OPEN_DELAY_MS);
+        },
+        onPointerLeave: (event) => {
+            if (!isMouse(event))
+                return;
+            if (openTimer.current !== null) {
+                window.clearTimeout(openTimer.current);
+                openTimer.current = null;
+            }
+            // Applies even after a click or focus inside: no pinned-open state for mouse users.
+            if (stateRef.current.id === id) {
+                if (closeTimer.current !== null)
+                    window.clearTimeout(closeTimer.current);
+                closeTimer.current = window.setTimeout(() => {
+                    closeTimer.current = null;
+                    commit(CLOSED);
+                }, NAV_HOVER_CLOSE_DELAY_MS);
+            }
+        },
+        onPointerDown: (event) => {
+            lastPointerType.current = event.pointerType;
+        },
+        onBlur: (event) => {
+            // Tab out of the item closes it.
+            const next = event.relatedTarget;
+            if (next && event.currentTarget.contains(next))
+                return;
+            if (next && stateRef.current.id === id)
+                close();
+        },
+    });
+    const triggerHandlers = (id) => ({
+        onClick: (event) => {
+            const current = stateRef.current;
+            const keyboard = event.detail === 0;
+            clearTimers();
+            if (current.id === id) {
+                // The first mouse click confirms a hover-opened panel; otherwise a click toggles it closed.
+                if (!keyboard && current.by === 'hover')
+                    commit({ id, by: 'click' });
+                else
+                    commit(CLOSED);
+                return;
+            }
+            const touch = lastPointerType.current === 'touch' || lastPointerType.current === 'pen';
+            commit({ id, by: keyboard ? 'keyboard' : touch ? 'touch' : 'click' });
+        },
+        onKeyDown: (event) => {
+            if (event.key !== 'ArrowDown')
+                return;
+            event.preventDefault();
+            clearTimers();
+            if (stateRef.current.id === id) {
+                panelLinks(id)[0]?.focus();
+                return;
+            }
+            focusFirstOf.current = id;
+            commit({ id, by: 'keyboard' });
+        },
+    });
+    const panelHandlers = (id) => ({
+        onKeyDown: (event) => {
+            const links = panelLinks(id);
+            const index = links.indexOf(document.activeElement);
+            if (index === -1)
+                return;
+            let next = -1;
+            if (event.key === 'ArrowDown')
+                next = Math.min(links.length - 1, index + 1);
+            else if (event.key === 'ArrowUp')
+                next = index - 1;
+            else if (event.key === 'Home')
+                next = 0;
+            else if (event.key === 'End')
+                next = links.length - 1;
+            else
+                return;
+            event.preventDefault();
+            if (next < 0)
+                trigger(id)?.focus();
+            else
+                links[next]?.focus();
+        },
+        // A link in the panel is clicked: close.
+        onClick: (event) => {
+            if (event.target.closest('a[href]'))
+                close();
+        },
+    });
+    return { openId: state.id, openedBy: state.by, close, itemHandlers, triggerHandlers, panelHandlers };
+}
+//# sourceMappingURL=use-navigation-menu.js.map

package/dist/navigation/use-navigation-menu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-navigation-menu.js","sourceRoot":"","sources":["../../src/navigation/use-navigation-menu.ts"],"names":[],"mappings":"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","sourcesContent":["'use client'\n\n/**\n * F3: the dropdown engine. The WAI-ARIA disclosure navigation pattern with top-level links and separate disclosure\n * buttons, and the whole v1 §5.6 state table. Timings and rules are constants of the library; a site can't change\n * them. The engine reads the DOM by hooks only (`data-slot=\"trigger\"` and `data-slot=\"panel\"` with `data-menu-id`),\n * so the links and panels stay server-rendered.\n */\nimport { useCallback, useEffect, useRef, useState, type FocusEvent, type KeyboardEvent, type MouseEvent, type PointerEvent, type RefObject } from 'react'\nimport { NAV_HOVER_CLOSE_DELAY_MS, NAV_HOVER_MEDIA_QUERY, NAV_HOVER_OPEN_DELAY_MS } from './constants.js'\n\nexport type NavigationOpenedBy = 'hover' | 'click' | 'touch' | 'keyboard'\n\ninterface MenuState {\n  readonly id: string | null\n  readonly by: NavigationOpenedBy | null\n}\n\nconst CLOSED: MenuState = { id: null, by: null }\n\n/** \"Mouse\" means pointerType mouse on a (hover: hover) and (pointer: fine) device. Touch never opens on hover. */\nfunction isMouse(event: PointerEvent): boolean {\n  if (event.pointerType !== 'mouse') return false\n  return typeof window.matchMedia === 'function' && window.matchMedia(NAV_HOVER_MEDIA_QUERY).matches\n}\n\nexport interface NavigationMenu {\n  /** The open panel's menu id, or null. One panel is open at a time. */\n  readonly openId: string | null\n  readonly openedBy: NavigationOpenedBy | null\n  close(): void\n  /** Spread on the item (`<li>`): hover intent and Tab out. */\n  itemHandlers(id: string): {\n    onPointerEnter(event: PointerEvent): void\n    onPointerLeave(event: PointerEvent): void\n    onPointerDown(event: PointerEvent): void\n    onBlur(event: FocusEvent<HTMLElement>): void\n  }\n  /** Spread on the disclosure button: click, Enter and Space toggle; Arrow Down opens and enters the panel. */\n  triggerHandlers(id: string): {\n    onClick(event: MouseEvent<HTMLButtonElement>): void\n    onKeyDown(event: KeyboardEvent<HTMLButtonElement>): void\n  }\n  /** Spread on the panel: Arrow Up, Arrow Down, Home and End move between its links; a link click closes. */\n  panelHandlers(id: string): {\n    onKeyDown(event: KeyboardEvent<HTMLElement>): void\n    onClick(event: MouseEvent<HTMLElement>): void\n  }\n}\n\n/**\n * The menu state for one navigation. `navRef` is the `<nav>`; a change of `resetKey` (route or breakpoint) closes\n * every panel, as does `popstate`, Escape (focus returns to the chevron), a pointer down outside, Tab out of an item\n * and a link click. A mouse opens a panel 100 ms after it enters an item and closes it 200 ms after it leaves, even\n * after a click; the first click on a hover-opened chevron confirms the panel instead of closing it.\n */\nexport function useNavigationMenu(navRef: RefObject<HTMLElement | null>, resetKey: unknown): NavigationMenu {\n  const [state, setState] = useState<MenuState>(CLOSED)\n  const stateRef = useRef(state)\n  const openTimer = useRef<number | null>(null)\n  const closeTimer = useRef<number | null>(null)\n  const lastPointerType = useRef<string>('mouse')\n  const focusFirstOf = useRef<string | null>(null)\n\n  const commit = useCallback((next: MenuState) => {\n    stateRef.current = next\n    setState(next)\n  }, [])\n\n  const clearTimers = useCallback(() => {\n    if (openTimer.current !== null) window.clearTimeout(openTimer.current)\n    if (closeTimer.current !== null) window.clearTimeout(closeTimer.current)\n    openTimer.current = null\n    closeTimer.current = null\n  }, [])\n\n  const close = useCallback(() => {\n    clearTimers()\n    if (stateRef.current.id !== null) commit(CLOSED)\n  }, [clearTimers, commit])\n\n  const trigger = useCallback(\n    (id: string) => navRef.current?.querySelector<HTMLButtonElement>(`[data-slot=\"trigger\"][data-menu-id=\"${id}\"]`) ?? null,\n    [navRef],\n  )\n  const panelLinks = useCallback(\n    (id: string) => Array.from(navRef.current?.querySelectorAll<HTMLAnchorElement>(`[data-slot=\"panel\"][data-menu-id=\"${id}\"] a[href]`) ?? []),\n    [navRef],\n  )\n\n  // Arrow Down opened a panel: focus its first link once the panel is no longer inert.\n  useEffect(() => {\n    if (state.id && focusFirstOf.current === state.id) {\n      focusFirstOf.current = null\n      panelLinks(state.id)[0]?.focus()\n    }\n  }, [state, panelLinks])\n\n  // Escape closes and returns focus to the chevron; a pointer down outside closes.\n  useEffect(() => {\n    if (!state.id) return\n    const onKey = (event: globalThis.KeyboardEvent) => {\n      if (event.key !== 'Escape' || !stateRef.current.id) return\n      const id = stateRef.current.id\n      const item = trigger(id)?.closest('[data-slot=\"item\"]')\n      const focusInside = item?.contains(document.activeElement) ?? false\n      close()\n      if (focusInside) trigger(id)?.focus()\n    }\n    const onPointerDown = (event: globalThis.PointerEvent) => {\n      if (!navRef.current?.contains(event.target as Node)) close()\n    }\n    document.addEventListener('keydown', onKey)\n    document.addEventListener('pointerdown', onPointerDown)\n    return () => {\n      document.removeEventListener('keydown', onKey)\n      document.removeEventListener('pointerdown', onPointerDown)\n    }\n  }, [state.id, close, navRef, trigger])\n\n  // A route change, popstate or a breakpoint crossing (resetKey) closes every panel.\n  useEffect(() => {\n    close()\n  }, [resetKey, close])\n  useEffect(() => {\n    const onPop = () => close()\n    window.addEventListener('popstate', onPop)\n    return () => {\n      window.removeEventListener('popstate', onPop)\n      clearTimers()\n    }\n  }, [close, clearTimers])\n\n  const itemHandlers = (id: string) => ({\n    onPointerEnter: (event: PointerEvent) => {\n      lastPointerType.current = event.pointerType\n      if (!isMouse(event)) return\n      if (closeTimer.current !== null) {\n        window.clearTimeout(closeTimer.current)\n        closeTimer.current = null\n      }\n      const current = stateRef.current\n      if (current.id === id) return\n      if (current.id !== null) {\n        // Another panel is open: switch immediately.\n        commit({ id, by: 'hover' })\n        return\n      }\n      if (openTimer.current !== null) window.clearTimeout(openTimer.current)\n      openTimer.current = window.setTimeout(() => {\n        openTimer.current = null\n        commit({ id, by: 'hover' })\n      }, NAV_HOVER_OPEN_DELAY_MS)\n    },\n    onPointerLeave: (event: PointerEvent) => {\n      if (!isMouse(event)) return\n      if (openTimer.current !== null) {\n        window.clearTimeout(openTimer.current)\n        openTimer.current = null\n      }\n      // Applies even after a click or focus inside: no pinned-open state for mouse users.\n      if (stateRef.current.id === id) {\n        if (closeTimer.current !== null) window.clearTimeout(closeTimer.current)\n        closeTimer.current = window.setTimeout(() => {\n          closeTimer.current = null\n          commit(CLOSED)\n        }, NAV_HOVER_CLOSE_DELAY_MS)\n      }\n    },\n    onPointerDown: (event: PointerEvent) => {\n      lastPointerType.current = event.pointerType\n    },\n    onBlur: (event: FocusEvent<HTMLElement>) => {\n      // Tab out of the item closes it.\n      const next = event.relatedTarget as Node | null\n      if (next && event.currentTarget.contains(next)) return\n      if (next && stateRef.current.id === id) close()\n    },\n  })\n\n  const triggerHandlers = (id: string) => ({\n    onClick: (event: MouseEvent<HTMLButtonElement>) => {\n      const current = stateRef.current\n      const keyboard = event.detail === 0\n      clearTimers()\n      if (current.id === id) {\n        // The first mouse click confirms a hover-opened panel; otherwise a click toggles it closed.\n        if (!keyboard && current.by === 'hover') commit({ id, by: 'click' })\n        else commit(CLOSED)\n        return\n      }\n      const touch = lastPointerType.current === 'touch' || lastPointerType.current === 'pen'\n      commit({ id, by: keyboard ? 'keyboard' : touch ? 'touch' : 'click' })\n    },\n    onKeyDown: (event: KeyboardEvent<HTMLButtonElement>) => {\n      if (event.key !== 'ArrowDown') return\n      event.preventDefault()\n      clearTimers()\n      if (stateRef.current.id === id) {\n        panelLinks(id)[0]?.focus()\n        return\n      }\n      focusFirstOf.current = id\n      commit({ id, by: 'keyboard' })\n    },\n  })\n\n  const panelHandlers = (id: string) => ({\n    onKeyDown: (event: KeyboardEvent<HTMLElement>) => {\n      const links = panelLinks(id)\n      const index = links.indexOf(document.activeElement as HTMLAnchorElement)\n      if (index === -1) return\n      let next = -1\n      if (event.key === 'ArrowDown') next = Math.min(links.length - 1, index + 1)\n      else if (event.key === 'ArrowUp') next = index - 1\n      else if (event.key === 'Home') next = 0\n      else if (event.key === 'End') next = links.length - 1\n      else return\n      event.preventDefault()\n      if (next < 0) trigger(id)?.focus()\n      else links[next]?.focus()\n    },\n    // A link in the panel is clicked: close.\n    onClick: (event: MouseEvent<HTMLElement>) => {\n      if ((event.target as HTMLElement).closest('a[href]')) close()\n    },\n  })\n\n  return { openId: state.id, openedBy: state.by, close, itemHandlers, triggerHandlers, panelHandlers }\n}\n"]}

package/dist/navigation/use-sticky-call-bar.d.ts

@@ -0,0 +1,15 @@
+/**
+ * F6: when the phone call bar shows. TotalCare's logic, ported: below 1024 px the bar shows once every call path on
+ * screen (the hero's own call and quote buttons, marked `data-bl-call-path`) has scrolled out, and hides again while
+ * a call path, the page footer or an open dialog (the drawer, the quote dialog) is on screen, while a form field has
+ * focus (v2) and while focus is inside the footer or a call path. The hook keeps `--bl-callbar-height` at the bar's height while it shows and `0px` otherwise, which
+ * drives `scroll-padding-bottom` (WCAG 2.4.11) and lifts back-to-top above the bar.
+ */
+import { type RefObject } from 'react';
+/**
+ * True while the bar should show. `resetKey` (the route) re-collects the call paths and the footer. The first state
+ * is seeded from their boxes before paint, so the bar never flashes on load or on a client navigation while the
+ * observer's first report is pending.
+ */
+export declare function useStickyCallBar(rootRef: RefObject<HTMLElement | null>, resetKey: unknown): boolean;
+//# sourceMappingURL=use-sticky-call-bar.d.ts.map

package/dist/navigation/use-sticky-call-bar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-sticky-call-bar.d.ts","sourceRoot":"","sources":["../../src/navigation/use-sticky-call-bar.ts"],"names":[],"mappings":"AAEA;;;;;;GAMG;AACH,OAAO,EAA6B,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAyCjE;;;;GAIG;AACH,wBAAgB,gBAAgB,CAAC,OAAO,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,EAAE,QAAQ,EAAE,OAAO,GAAG,OAAO,CA4DnG"}

package/dist/navigation/use-sticky-call-bar.js

@@ -0,0 +1,110 @@
+'use client';
+/**
+ * F6: when the phone call bar shows. TotalCare's logic, ported: below 1024 px the bar shows once every call path on
+ * screen (the hero's own call and quote buttons, marked `data-bl-call-path`) has scrolled out, and hides again while
+ * a call path, the page footer or an open dialog (the drawer, the quote dialog) is on screen, while a form field has
+ * focus (v2) and while focus is inside the footer or a call path. The hook keeps `--bl-callbar-height` at the bar's height while it shows and `0px` otherwise, which
+ * drives `scroll-padding-bottom` (WCAG 2.4.11) and lifts back-to-top above the bar.
+ */
+import { useLayoutEffect, useState } from 'react';
+import { CALL_BAR_MEDIA_QUERY, CALL_PATH_SELECTOR } from './constants.js';
+const FIELD_SELECTOR = [
+    'input:not([type="button"], [type="submit"], [type="reset"], [type="checkbox"], [type="radio"], [type="hidden"])',
+    'textarea',
+    'select',
+    '[contenteditable=""]',
+    '[contenteditable="true"]',
+].join(', ');
+function isField(target) {
+    return target instanceof Element && target.matches(FIELD_SELECTOR);
+}
+/** The page footer: the shared footer, or a `<footer>` that isn't inside an article, aside, main, nav or section. */
+function isPageFooter(element) {
+    return element.matches('[data-bl="footer"]') || !element.parentElement?.closest('article, aside, main, nav, section');
+}
+function pageFooters() {
+    return Array.from(document.querySelectorAll('footer, [data-bl="footer"]')).filter(isPageFooter);
+}
+/**
+ * Focus inside the footer or a call path hides the bar at once, before the observer reports (fast Tab stops would
+ * otherwise sit under the bar, K5).
+ */
+function inHideZone(target) {
+    if (!(target instanceof Element))
+        return false;
+    if (target.closest(CALL_PATH_SELECTOR))
+        return true;
+    const footer = target.closest('footer, [data-bl="footer"]');
+    return footer !== null && isPageFooter(footer);
+}
+/** True when any part of the element's box is inside the viewport. */
+function inViewport(element) {
+    const box = element.getBoundingClientRect();
+    return box.bottom > 0 && box.right > 0 && box.top < window.innerHeight && box.left < window.innerWidth;
+}
+/**
+ * True while the bar should show. `resetKey` (the route) re-collects the call paths and the footer. The first state
+ * is seeded from their boxes before paint, so the bar never flashes on load or on a client navigation while the
+ * observer's first report is pending.
+ */
+export function useStickyCallBar(rootRef, resetKey) {
+    const [shown, setShown] = useState(false);
+    useLayoutEffect(() => {
+        const root = rootRef.current;
+        if (!root)
+            return;
+        const html = document.documentElement;
+        const narrow = typeof window.matchMedia === 'function' ? window.matchMedia(CALL_BAR_MEDIA_QUERY) : null;
+        const onScreen = new Set();
+        let fieldFocused = isField(document.activeElement);
+        let focusHidden = inHideZone(document.activeElement);
+        const update = () => {
+            const next = (narrow?.matches ?? false) && onScreen.size === 0 && !fieldFocused && !focusHidden && !document.querySelector('dialog[open]');
+            setShown(next);
+            html.style.setProperty('--bl-callbar-height', next ? `${Math.round(root.getBoundingClientRect().height)}px` : '0px');
+        };
+        let intersections;
+        if (typeof IntersectionObserver === 'function') {
+            intersections = new IntersectionObserver((entries) => {
+                for (const entry of entries) {
+                    if (entry.isIntersecting)
+                        onScreen.add(entry.target);
+                    else
+                        onScreen.delete(entry.target);
+                }
+                update();
+            });
+        }
+        for (const target of [...document.querySelectorAll(CALL_PATH_SELECTOR), ...pageFooters()]) {
+            if (inViewport(target))
+                onScreen.add(target);
+            intersections?.observe(target);
+        }
+        const dialogs = new MutationObserver(update);
+        dialogs.observe(document.body, { subtree: true, attributes: true, attributeFilter: ['open'] });
+        const onFocusIn = (event) => {
+            fieldFocused = isField(event.target);
+            focusHidden = inHideZone(event.target);
+            update();
+        };
+        const onFocusOut = (event) => {
+            fieldFocused = isField(event.relatedTarget);
+            focusHidden = inHideZone(event.relatedTarget);
+            update();
+        };
+        document.addEventListener('focusin', onFocusIn);
+        document.addEventListener('focusout', onFocusOut);
+        narrow?.addEventListener('change', update);
+        update();
+        return () => {
+            intersections?.disconnect();
+            dialogs.disconnect();
+            document.removeEventListener('focusin', onFocusIn);
+            document.removeEventListener('focusout', onFocusOut);
+            narrow?.removeEventListener('change', update);
+            html.style.removeProperty('--bl-callbar-height');
+        };
+    }, [rootRef, resetKey]);
+    return shown;
+}
+//# sourceMappingURL=use-sticky-call-bar.js.map

package/dist/navigation/use-sticky-call-bar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-sticky-call-bar.js","sourceRoot":"","sources":["../../src/navigation/use-sticky-call-bar.ts"],"names":[],"mappings":"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","sourcesContent":["'use client'\n\n/**\n * F6: when the phone call bar shows. TotalCare's logic, ported: below 1024 px the bar shows once every call path on\n * screen (the hero's own call and quote buttons, marked `data-bl-call-path`) has scrolled out, and hides again while\n * a call path, the page footer or an open dialog (the drawer, the quote dialog) is on screen, while a form field has\n * focus (v2) and while focus is inside the footer or a call path. The hook keeps `--bl-callbar-height` at the bar's height while it shows and `0px` otherwise, which\n * drives `scroll-padding-bottom` (WCAG 2.4.11) and lifts back-to-top above the bar.\n */\nimport { useLayoutEffect, useState, type RefObject } from 'react'\nimport { CALL_BAR_MEDIA_QUERY, CALL_PATH_SELECTOR } from './constants.js'\n\nconst FIELD_SELECTOR = [\n  'input:not([type=\"button\"], [type=\"submit\"], [type=\"reset\"], [type=\"checkbox\"], [type=\"radio\"], [type=\"hidden\"])',\n  'textarea',\n  'select',\n  '[contenteditable=\"\"]',\n  '[contenteditable=\"true\"]',\n].join(', ')\n\nfunction isField(target: EventTarget | null): boolean {\n  return target instanceof Element && target.matches(FIELD_SELECTOR)\n}\n\n/** The page footer: the shared footer, or a `<footer>` that isn't inside an article, aside, main, nav or section. */\nfunction isPageFooter(element: Element): boolean {\n  return element.matches('[data-bl=\"footer\"]') || !element.parentElement?.closest('article, aside, main, nav, section')\n}\n\nfunction pageFooters(): Element[] {\n  return Array.from(document.querySelectorAll('footer, [data-bl=\"footer\"]')).filter(isPageFooter)\n}\n\n/**\n * Focus inside the footer or a call path hides the bar at once, before the observer reports (fast Tab stops would\n * otherwise sit under the bar, K5).\n */\nfunction inHideZone(target: EventTarget | null): boolean {\n  if (!(target instanceof Element)) return false\n  if (target.closest(CALL_PATH_SELECTOR)) return true\n  const footer = target.closest('footer, [data-bl=\"footer\"]')\n  return footer !== null && isPageFooter(footer)\n}\n\n/** True when any part of the element's box is inside the viewport. */\nfunction inViewport(element: Element): boolean {\n  const box = element.getBoundingClientRect()\n  return box.bottom > 0 && box.right > 0 && box.top < window.innerHeight && box.left < window.innerWidth\n}\n\n/**\n * True while the bar should show. `resetKey` (the route) re-collects the call paths and the footer. The first state\n * is seeded from their boxes before paint, so the bar never flashes on load or on a client navigation while the\n * observer's first report is pending.\n */\nexport function useStickyCallBar(rootRef: RefObject<HTMLElement | null>, resetKey: unknown): boolean {\n  const [shown, setShown] = useState(false)\n\n  useLayoutEffect(() => {\n    const root = rootRef.current\n    if (!root) return\n    const html = document.documentElement\n    const narrow = typeof window.matchMedia === 'function' ? window.matchMedia(CALL_BAR_MEDIA_QUERY) : null\n    const onScreen = new Set<Element>()\n    let fieldFocused = isField(document.activeElement)\n    let focusHidden = inHideZone(document.activeElement)\n\n    const update = () => {\n      const next = (narrow?.matches ?? false) && onScreen.size === 0 && !fieldFocused && !focusHidden && !document.querySelector('dialog[open]')\n      setShown(next)\n      html.style.setProperty('--bl-callbar-height', next ? `${Math.round(root.getBoundingClientRect().height)}px` : '0px')\n    }\n\n    let intersections: IntersectionObserver | undefined\n    if (typeof IntersectionObserver === 'function') {\n      intersections = new IntersectionObserver((entries) => {\n        for (const entry of entries) {\n          if (entry.isIntersecting) onScreen.add(entry.target)\n          else onScreen.delete(entry.target)\n        }\n        update()\n      })\n    }\n    for (const target of [...document.querySelectorAll(CALL_PATH_SELECTOR), ...pageFooters()]) {\n      if (inViewport(target)) onScreen.add(target)\n      intersections?.observe(target)\n    }\n    const dialogs = new MutationObserver(update)\n    dialogs.observe(document.body, { subtree: true, attributes: true, attributeFilter: ['open'] })\n    const onFocusIn = (event: FocusEvent) => {\n      fieldFocused = isField(event.target)\n      focusHidden = inHideZone(event.target)\n      update()\n    }\n    const onFocusOut = (event: FocusEvent) => {\n      fieldFocused = isField(event.relatedTarget)\n      focusHidden = inHideZone(event.relatedTarget)\n      update()\n    }\n    document.addEventListener('focusin', onFocusIn)\n    document.addEventListener('focusout', onFocusOut)\n    narrow?.addEventListener('change', update)\n    update()\n\n    return () => {\n      intersections?.disconnect()\n      dialogs.disconnect()\n      document.removeEventListener('focusin', onFocusIn)\n      document.removeEventListener('focusout', onFocusOut)\n      narrow?.removeEventListener('change', update)\n      html.style.removeProperty('--bl-callbar-height')\n    }\n  }, [rootRef, resetKey])\n\n  return shown\n}\n"]}

package/dist/ui-kit/brandlab-skin.d.ts

@@ -6,6 +6,17 @@
 import type { ButtonLinkSkin, PhoneLinkSkin, TextLinkSkin } from './primitives/links.js';
 import type { QuoteButtonSkin } from './primitives/quote-button.js';
 import type { ContainerSkin, SectionHeadingSkin } from './primitives/layout.js';
+import type { BackToTopSkin } from './shell/back-to-top.js';
+import type { MobileCallBarSkin } from './shell/mobile-call-bar.js';
+import type { MobileDrawerSkin } from './shell/mobile-drawer.js';
+import type { SiteHeaderSkin } from './shell/site-header.js';
+import type { UtilityBarSkin } from './shell/utility-bar.js';
+import type { DialogSkin } from './form/dialog.js';
+import type { FieldSkin } from './form/field.js';
+import type { PhotoUploadSkin } from './form/photo-upload.js';
+import type { QuoteDialogSkin } from './form/quote-dialog.js';
+import type { QuoteFormSkin } from './form/quote-form.js';
+import type { ThankYouSkin } from './form/thank-you.js';
 export interface BrandlabSkin {
     readonly buttonLink?: ButtonLinkSkin;
     readonly textLink?: TextLinkSkin;
@@ -13,5 +24,16 @@ export interface BrandlabSkin {
     readonly quoteButton?: QuoteButtonSkin;
     readonly container?: ContainerSkin;
     readonly sectionHeading?: SectionHeadingSkin;
+    readonly siteHeader?: SiteHeaderSkin;
+    readonly mobileDrawer?: MobileDrawerSkin;
+    readonly utilityBar?: UtilityBarSkin;
+    readonly mobileCallBar?: MobileCallBarSkin;
+    readonly backToTop?: BackToTopSkin;
+    readonly quoteForm?: QuoteFormSkin;
+    readonly quoteDialog?: QuoteDialogSkin;
+    readonly photoUpload?: PhotoUploadSkin;
+    readonly dialog?: DialogSkin;
+    readonly field?: FieldSkin;
+    readonly thankYou?: ThankYouSkin;
 }
 //# sourceMappingURL=brandlab-skin.d.ts.map

package/dist/ui-kit/brandlab-skin.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"brandlab-skin.d.ts","sourceRoot":"","sources":["../../src/ui-kit/brandlab-skin.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,OAAO,KAAK,EAAE,cAAc,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAA;AACxF,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAA;AACnE,OAAO,KAAK,EAAE,aAAa,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAA;AAE/E,MAAM,WAAW,YAAY;IAC3B,QAAQ,CAAC,UAAU,CAAC,EAAE,cAAc,CAAA;IACpC,QAAQ,CAAC,QAAQ,CAAC,EAAE,YAAY,CAAA;IAChC,QAAQ,CAAC,SAAS,CAAC,EAAE,aAAa,CAAA;IAClC,QAAQ,CAAC,WAAW,CAAC,EAAE,eAAe,CAAA;IACtC,QAAQ,CAAC,SAAS,CAAC,EAAE,aAAa,CAAA;IAClC,QAAQ,CAAC,cAAc,CAAC,EAAE,kBAAkB,CAAA;CAC7C"}
+{"version":3,"file":"brandlab-skin.d.ts","sourceRoot":"","sources":["../../src/ui-kit/brandlab-skin.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,OAAO,KAAK,EAAE,cAAc,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAA;AACxF,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAA;AACnE,OAAO,KAAK,EAAE,aAAa,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAA;AAC/E,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAA;AAC3D,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAA;AACnE,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAA;AAChE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAA;AAC5D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAA;AAC5D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAA;AAClD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAA;AAChD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAA;AAC7D,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAA;AAC7D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAA;AACzD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAA;AAEvD,MAAM,WAAW,YAAY;IAC3B,QAAQ,CAAC,UAAU,CAAC,EAAE,cAAc,CAAA;IACpC,QAAQ,CAAC,QAAQ,CAAC,EAAE,YAAY,CAAA;IAChC,QAAQ,CAAC,SAAS,CAAC,EAAE,aAAa,CAAA;IAClC,QAAQ,CAAC,WAAW,CAAC,EAAE,eAAe,CAAA;IACtC,QAAQ,CAAC,SAAS,CAAC,EAAE,aAAa,CAAA;IAClC,QAAQ,CAAC,cAAc,CAAC,EAAE,kBAAkB,CAAA;IAC5C,QAAQ,CAAC,UAAU,CAAC,EAAE,cAAc,CAAA;IACpC,QAAQ,CAAC,YAAY,CAAC,EAAE,gBAAgB,CAAA;IACxC,QAAQ,CAAC,UAAU,CAAC,EAAE,cAAc,CAAA;IACpC,QAAQ,CAAC,aAAa,CAAC,EAAE,iBAAiB,CAAA;IAC1C,QAAQ,CAAC,SAAS,CAAC,EAAE,aAAa,CAAA;IAElC,QAAQ,CAAC,SAAS,CAAC,EAAE,aAAa,CAAA;IAClC,QAAQ,CAAC,WAAW,CAAC,EAAE,eAAe,CAAA;IACtC,QAAQ,CAAC,WAAW,CAAC,EAAE,eAAe,CAAA;IACtC,QAAQ,CAAC,MAAM,CAAC,EAAE,UAAU,CAAA;IAC5B,QAAQ,CAAC,KAAK,CAAC,EAAE,SAAS,CAAA;IAC1B,QAAQ,CAAC,QAAQ,CAAC,EAAE,YAAY,CAAA;CACjC"}

package/dist/ui-kit/brandlab-skin.js.map

@@ -1 +1 @@
-{"version":3,"file":"brandlab-skin.js","sourceRoot":"","sources":["../../src/ui-kit/brandlab-skin.ts"],"names":[],"mappings":"","sourcesContent":["/**\n * A site's whole look for the ui-kit: one entry per shared component it renders (`src/site/skin.ts`, written with\n * `satisfies BrandlabSkin`). Each release adds the entries for its components. K2 checks that every rendered\n * component has an entry and that no reference-skin class ships.\n */\nimport type { ButtonLinkSkin, PhoneLinkSkin, TextLinkSkin } from './primitives/links.js'\nimport type { QuoteButtonSkin } from './primitives/quote-button.js'\nimport type { ContainerSkin, SectionHeadingSkin } from './primitives/layout.js'\n\nexport interface BrandlabSkin {\n  readonly buttonLink?: ButtonLinkSkin\n  readonly textLink?: TextLinkSkin\n  readonly phoneLink?: PhoneLinkSkin\n  readonly quoteButton?: QuoteButtonSkin\n  readonly container?: ContainerSkin\n  readonly sectionHeading?: SectionHeadingSkin\n}\n"]}
+{"version":3,"file":"brandlab-skin.js","sourceRoot":"","sources":["../../src/ui-kit/brandlab-skin.ts"],"names":[],"mappings":"","sourcesContent":["/**\n * A site's whole look for the ui-kit: one entry per shared component it renders (`src/site/skin.ts`, written with\n * `satisfies BrandlabSkin`). Each release adds the entries for its components. K2 checks that every rendered\n * component has an entry and that no reference-skin class ships.\n */\nimport type { ButtonLinkSkin, PhoneLinkSkin, TextLinkSkin } from './primitives/links.js'\nimport type { QuoteButtonSkin } from './primitives/quote-button.js'\nimport type { ContainerSkin, SectionHeadingSkin } from './primitives/layout.js'\nimport type { BackToTopSkin } from './shell/back-to-top.js'\nimport type { MobileCallBarSkin } from './shell/mobile-call-bar.js'\nimport type { MobileDrawerSkin } from './shell/mobile-drawer.js'\nimport type { SiteHeaderSkin } from './shell/site-header.js'\nimport type { UtilityBarSkin } from './shell/utility-bar.js'\nimport type { DialogSkin } from './form/dialog.js'\nimport type { FieldSkin } from './form/field.js'\nimport type { PhotoUploadSkin } from './form/photo-upload.js'\nimport type { QuoteDialogSkin } from './form/quote-dialog.js'\nimport type { QuoteFormSkin } from './form/quote-form.js'\nimport type { ThankYouSkin } from './form/thank-you.js'\n\nexport interface BrandlabSkin {\n  readonly buttonLink?: ButtonLinkSkin\n  readonly textLink?: TextLinkSkin\n  readonly phoneLink?: PhoneLinkSkin\n  readonly quoteButton?: QuoteButtonSkin\n  readonly container?: ContainerSkin\n  readonly sectionHeading?: SectionHeadingSkin\n  readonly siteHeader?: SiteHeaderSkin\n  readonly mobileDrawer?: MobileDrawerSkin\n  readonly utilityBar?: UtilityBarSkin\n  readonly mobileCallBar?: MobileCallBarSkin\n  readonly backToTop?: BackToTopSkin\n  // form (3.10.0)\n  readonly quoteForm?: QuoteFormSkin\n  readonly quoteDialog?: QuoteDialogSkin\n  readonly photoUpload?: PhotoUploadSkin\n  readonly dialog?: DialogSkin\n  readonly field?: FieldSkin\n  readonly thankYou?: ThankYouSkin\n}\n"]}

package/dist/ui-kit/form/copy.d.ts

@@ -0,0 +1,3 @@
+/** Fills `{name}` tokens in a site's copy template, for example `"{count} of {max}"`. Unknown tokens stay visible. */
+export declare function fillCopy(template: string, values: Readonly<Record<string, string | number>>): string;
+//# sourceMappingURL=copy.d.ts.map

package/dist/ui-kit/form/copy.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"copy.d.ts","sourceRoot":"","sources":["../../../src/ui-kit/form/copy.ts"],"names":[],"mappings":"AAAA,sHAAsH;AACtH,wBAAgB,QAAQ,CAAC,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,CAAC,GAAG,MAAM,CAEpG"}

package/dist/ui-kit/form/copy.js

@@ -0,0 +1,5 @@
+/** Fills `{name}` tokens in a site's copy template, for example `"{count} of {max}"`. Unknown tokens stay visible. */
+export function fillCopy(template, values) {
+    return template.replace(/\{([a-zA-Z]+)\}/g, (token, key) => (key in values ? String(values[key]) : token));
+}
+//# sourceMappingURL=copy.js.map

package/dist/ui-kit/form/copy.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"copy.js","sourceRoot":"","sources":["../../../src/ui-kit/form/copy.ts"],"names":[],"mappings":"AAAA,sHAAsH;AACtH,MAAM,UAAU,QAAQ,CAAC,QAAgB,EAAE,MAAiD;IAC1F,OAAO,QAAQ,CAAC,OAAO,CAAC,kBAAkB,EAAE,CAAC,KAAK,EAAE,GAAW,EAAE,EAAE,CAAC,CAAC,GAAG,IAAI,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAA;AACpH,CAAC","sourcesContent":["/** Fills `{name}` tokens in a site's copy template, for example `\"{count} of {max}\"`. Unknown tokens stay visible. */\nexport function fillCopy(template: string, values: Readonly<Record<string, string | number>>): string {\n  return template.replace(/\\{([a-zA-Z]+)\\}/g, (token, key: string) => (key in values ? String(values[key]) : token))\n}\n"]}

package/dist/ui-kit/form/dialog.d.ts

@@ -0,0 +1,24 @@
+/**
+ * `Dialog`: a modal dialog over `HeadlessDialog` (native `<dialog>` with `showModal()`, so the page behind is inert).
+ * Its H2 title names it and takes focus when it opens, so a phone keyboard doesn't jump up; Escape and the close
+ * button close it and focus returns to the control that opened it. The page doesn't scroll behind it (structure.css).
+ */
+import { type ReactNode, type RefObject } from 'react';
+import { type SkinEntry } from '../skin.js';
+export type DialogSlot = 'root' | 'header' | 'title' | 'close' | 'body';
+export type DialogSkin = SkinEntry<DialogSlot>;
+export interface DialogProps extends DialogSkin {
+    /** The dialog's id; its title is `${id}-title`. */
+    readonly id: string;
+    readonly open: boolean;
+    readonly onClose: () => void;
+    /** The H2 that names the dialog, for example "Get a free quote". */
+    readonly title: string;
+    /** The close button's accessible name, for example "Close". */
+    readonly closeLabel: string;
+    /** Where focus returns on close; by default the element focused when it opened. */
+    readonly returnFocusRef?: RefObject<HTMLElement | null> | undefined;
+    readonly children: ReactNode;
+}
+export declare function Dialog({ id, open, onClose, title, closeLabel, returnFocusRef, classes, children }: DialogProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=dialog.d.ts.map

package/dist/ui-kit/form/dialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog.d.ts","sourceRoot":"","sources":["../../../src/ui-kit/form/dialog.tsx"],"names":[],"mappings":"AAEA;;;;GAIG;AACH,OAAO,EAAU,KAAK,SAAS,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAG9D,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,YAAY,CAAA;AAEjD,MAAM,MAAM,UAAU,GAAG,MAAM,GAAG,QAAQ,GAAG,OAAO,GAAG,OAAO,GAAG,MAAM,CAAA;AACvE,MAAM,MAAM,UAAU,GAAG,SAAS,CAAC,UAAU,CAAC,CAAA;AAE9C,MAAM,WAAW,WAAY,SAAQ,UAAU;IAC7C,mDAAmD;IACnD,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAA;IACnB,QAAQ,CAAC,IAAI,EAAE,OAAO,CAAA;IACtB,QAAQ,CAAC,OAAO,EAAE,MAAM,IAAI,CAAA;IAC5B,oEAAoE;IACpE,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAA;IACtB,+DAA+D;IAC/D,QAAQ,CAAC,UAAU,EAAE,MAAM,CAAA;IAC3B,mFAAmF;IACnF,QAAQ,CAAC,cAAc,CAAC,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,GAAG,SAAS,CAAA;IACnE,QAAQ,CAAC,QAAQ,EAAE,SAAS,CAAA;CAC7B;AAED,wBAAgB,MAAM,CAAC,EAAE,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,cAAc,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,WAAW,2CA2B9G"}

package/dist/ui-kit/form/dialog.js

@@ -0,0 +1,17 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * `Dialog`: a modal dialog over `HeadlessDialog` (native `<dialog>` with `showModal()`, so the page behind is inert).
+ * Its H2 title names it and takes focus when it opens, so a phone keyboard doesn't jump up; Escape and the close
+ * button close it and focus returns to the control that opened it. The page doesn't scroll behind it (structure.css).
+ */
+import { useRef } from 'react';
+import { HeadlessDialog } from '../../ui-client.js';
+import { Icon } from '../icons.js';
+import { slot } from '../skin.js';
+export function Dialog({ id, open, onClose, title, closeLabel, returnFocusRef, classes, children }) {
+    const titleRef = useRef(null);
+    const titleId = `${id}-title`;
+    return (_jsxs(HeadlessDialog, { id: id, open: open, onClose: onClose, labelledBy: titleId, initialFocusRef: titleRef, ...(returnFocusRef ? { returnFocusRef } : {}), "data-bl": "dialog", "data-state": open ? 'open' : 'closed', className: classes?.root, children: [_jsxs("div", { ...slot(classes, 'header'), children: [_jsx("h2", { ...slot(classes, 'title'), id: titleId, ref: titleRef, tabIndex: -1, children: title }), _jsxs("button", { ...slot(classes, 'close'), type: "button", onClick: onClose, children: [_jsx(Icon, { name: "close" }), _jsx("span", { "data-bl-visually-hidden": "", children: closeLabel })] })] }), _jsx("div", { ...slot(classes, 'body'), children: children })] }));
+}
+//# sourceMappingURL=dialog.js.map