@hjmds/react 1.13.1 → 1.15.0

package/dist/task-list.js

@@ -1,13 +1,18 @@
-import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { validateTasks } from '@hjmds/design-contracts/task-list';
 import { Checkbox } from './selection.js';
 import { List } from './advanced-display.js';
 /** Canonical Checkbox/List own semantics; optional collection composition keeps drag peers out of this entry. */
-export function TaskList({ label, items, onCompletedChange, disabled = false, emptyContent, renderCollection, layoutStyle }) {
+export function TaskList({ label, items, onCompletedChange, disabled = false, emptyContent, renderItemAction, renderCollection, layoutStyle }) {
     validateTasks(items);
     if (!label.trim())
         throw new TypeError('TaskList needs a localized label');
-    const renderItem = (item) => { const control = _jsx(Checkbox, { label: item.label, checked: item.completed, disabled: disabled || item.disabled === true, onCheckedChange: completed => onCompletedChange(item.id, completed), ...(item.description === undefined ? {} : { description: item.description }) }); return _jsx("div", { style: { padding: "var(--hjm-space-md)" }, children: control }); };
+    const renderItem = (item) => {
+        const control = _jsx(Checkbox, { label: item.label, checked: item.completed, disabled: disabled || item.disabled === true, onCheckedChange: completed => onCompletedChange(item.id, completed), ...(item.description === undefined ? {} : { description: item.description }) });
+        const action = renderItemAction?.({ item, disabled: disabled || item.disabled === true });
+        // Independent actions must not live inside Checkbox's label. A separate line preserves long labels at large text sizes.
+        return _jsxs("div", { style: { padding: "var(--hjm-space-md)" }, children: [control, action == null ? null : _jsx("div", { style: { marginBlockStart: "var(--hjm-space-sm)" }, children: action })] });
+    };
     if (items.length === 0)
         return _jsx(List, { label: label, ...(layoutStyle === undefined ? {} : { layoutStyle }), children: emptyContent });
     if (renderCollection)

package/dist/task-list.js.map

@@ -1 +1 @@
-{"version":3,"file":"task-list.js","sourceRoot":"","sources":["../src/task-list.tsx"],"names":[],"mappings":";AACA,OAAM,EAAC,aAAa,EAAe,MAAI,mCAAmC,CAAC;AAC3E,OAAM,EAAC,QAAQ,EAAC,MAAI,gBAAgB,CAAC;AAAA,OAAM,EAAC,IAAI,EAAC,MAAI,uBAAuB,CAAC;AAK7E,iHAAiH;AACjH,MAAM,UAAU,QAAQ,CAAC,EAAC,KAAK,EAAC,KAAK,EAAC,iBAAiB,EAAC,QAAQ,GAAC,KAAK,EAAC,YAAY,EAAC,gBAAgB,EAAC,WAAW,EAAe;IAAE,aAAa,CAAC,KAAK,CAAC,CAAC;IAAA,IAAG,CAAC,KAAK,CAAC,IAAI,EAAE;QAAC,MAAM,IAAI,SAAS,CAAC,kCAAkC,CAAC,CAAC;IAC9N,MAAM,UAAU,GAAC,CAAC,IAAa,EAAC,EAAE,GAAC,MAAM,OAAO,GAAC,KAAC,QAAQ,IAAC,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,OAAO,EAAE,IAAI,CAAC,SAAS,EAAE,QAAQ,EAAE,QAAQ,IAAE,IAAI,CAAC,QAAQ,KAAG,IAAI,EAAE,eAAe,EAAE,SAAS,CAAA,EAAE,CAAA,iBAAiB,CAAC,IAAI,CAAC,EAAE,EAAC,SAAS,CAAC,KAAM,CAAC,IAAI,CAAC,WAAW,KAAG,SAAS,CAAA,CAAC,CAAA,EAAE,CAAA,CAAC,CAAA,EAAC,WAAW,EAAC,IAAI,CAAC,WAAW,EAAC,CAAC,GAAG,CAAC,CAAA,OAAO,cAAK,KAAK,EAAE,EAAC,OAAO,EAAC,qBAAqB,EAAC,YAAG,OAAO,GAAO,CAAC,CAAA,CAAC,CAAC;IACjW,IAAG,KAAK,CAAC,MAAM,KAAG,CAAC;QAAC,OAAO,KAAC,IAAI,IAAC,KAAK,EAAE,KAAK,KAAM,CAAC,WAAW,KAAG,SAAS,CAAA,CAAC,CAAA,EAAE,CAAA,CAAC,CAAA,EAAC,WAAW,EAAC,CAAC,YAAG,YAAY,GAAQ,CAAC;IACrH,IAAG,gBAAgB;QAAC,OAAO,4BAAG,gBAAgB,CAAC,EAAC,KAAK,EAAC,UAAU,EAAC,CAAC,GAAI,CAAC;IACvE,OAAO,KAAC,IAAI,IAAC,KAAK,EAAE,KAAK,EAAE,UAAU,EAAC,SAAS,KAAK,CAAC,WAAW,KAAG,SAAS,CAAA,CAAC,CAAA,EAAE,CAAA,CAAC,CAAA,EAAC,WAAW,EAAC,CAAC,YAAG,KAAK,CAAC,GAAG,CAAC,IAAI,CAAA,EAAE,CAAA,wBAAoB,UAAU,CAAC,IAAI,CAAC,IAA1B,IAAI,CAAC,EAAE,CAA0B,CAAC,GAAQ,CAAC;AACvK,CAAC","sourcesContent":["import type{ReactNode}from'react';\nimport{validateTasks,type TaskItem}from'@hjmds/design-contracts/task-list';\nimport{Checkbox}from'./selection.js';import{List}from'./advanced-display.js';\nimport type { HjmCompositionStyleProp } from \"./composition-style.js\";\nexport type TaskListProps=Readonly<{label:string;items:readonly TaskItem[];onCompletedChange:(id:string,completed:boolean)=>void;disabled?:boolean;emptyContent?:ReactNode;renderCollection?:(context:Readonly<{items:readonly TaskItem[];renderItem:(item:TaskItem)=>ReactNode}>)=>ReactNode;\n /** Canonical layout-only placement on the List root. With `renderCollection` the product owns the root, so place that instead. */\n layoutStyle?:HjmCompositionStyleProp}>;\n/** Canonical Checkbox/List own semantics; optional collection composition keeps drag peers out of this entry. */\nexport function TaskList({label,items,onCompletedChange,disabled=false,emptyContent,renderCollection,layoutStyle}:TaskListProps){validateTasks(items);if(!label.trim())throw new TypeError('TaskList needs a localized label');\n const renderItem=(item:TaskItem)=>{const control=<Checkbox label={item.label} checked={item.completed} disabled={disabled||item.disabled===true} onCheckedChange={completed=>onCompletedChange(item.id,completed)} {...(item.description===undefined?{}:{description:item.description})}/>;return <div style={{padding:\"var(--hjm-space-md)\"}}>{control}</div>;};\n if(items.length===0)return <List label={label} {...(layoutStyle===undefined?{}:{layoutStyle})}>{emptyContent}</List>;\n if(renderCollection)return <>{renderCollection({items,renderItem})}</>;\n return <List label={label} appearance=\"grouped\" {...(layoutStyle===undefined?{}:{layoutStyle})}>{items.map(item=><div key={item.id}>{renderItem(item)}</div>)}</List>;\n}\n"]}
+{"version":3,"file":"task-list.js","sourceRoot":"","sources":["../src/task-list.tsx"],"names":[],"mappings":";AACA,OAAM,EAAC,aAAa,EAAe,MAAI,mCAAmC,CAAC;AAC3E,OAAM,EAAC,QAAQ,EAAC,MAAI,gBAAgB,CAAC;AAAA,OAAM,EAAC,IAAI,EAAC,MAAI,uBAAuB,CAAC;AAQ7E,iHAAiH;AACjH,MAAM,UAAU,QAAQ,CAAC,EAAC,KAAK,EAAC,KAAK,EAAC,iBAAiB,EAAC,QAAQ,GAAC,KAAK,EAAC,YAAY,EAAC,gBAAgB,EAAC,gBAAgB,EAAC,WAAW,EAAe;IAAE,aAAa,CAAC,KAAK,CAAC,CAAC;IAAA,IAAG,CAAC,KAAK,CAAC,IAAI,EAAE;QAAC,MAAM,IAAI,SAAS,CAAC,kCAAkC,CAAC,CAAC;IAC/O,MAAM,UAAU,GAAC,CAAC,IAAa,EAAC,EAAE;QAAC,MAAM,OAAO,GAAC,KAAC,QAAQ,IAAC,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,OAAO,EAAE,IAAI,CAAC,SAAS,EAAE,QAAQ,EAAE,QAAQ,IAAE,IAAI,CAAC,QAAQ,KAAG,IAAI,EAAE,eAAe,EAAE,SAAS,CAAA,EAAE,CAAA,iBAAiB,CAAC,IAAI,CAAC,EAAE,EAAC,SAAS,CAAC,KAAM,CAAC,IAAI,CAAC,WAAW,KAAG,SAAS,CAAA,CAAC,CAAA,EAAE,CAAA,CAAC,CAAA,EAAC,WAAW,EAAC,IAAI,CAAC,WAAW,EAAC,CAAC,GAAG,CAAC;QAAA,MAAM,MAAM,GAAC,gBAAgB,EAAE,CAAC,EAAC,IAAI,EAAC,QAAQ,EAAC,QAAQ,IAAE,IAAI,CAAC,QAAQ,KAAG,IAAI,EAAC,CAAC,CAAC;QAC3W,wHAAwH;QACxH,OAAO,eAAK,KAAK,EAAE,EAAC,OAAO,EAAC,qBAAqB,EAAC,aAAG,OAAO,EAAE,MAAM,IAAE,IAAI,CAAA,CAAC,CAAA,IAAI,CAAA,CAAC,CAAA,cAAK,KAAK,EAAE,EAAC,gBAAgB,EAAC,qBAAqB,EAAC,YAAG,MAAM,GAAO,IAAO,CAAC;IAAA,CAAC,CAAC;IAC9J,IAAG,KAAK,CAAC,MAAM,KAAG,CAAC;QAAC,OAAO,KAAC,IAAI,IAAC,KAAK,EAAE,KAAK,KAAM,CAAC,WAAW,KAAG,SAAS,CAAA,CAAC,CAAA,EAAE,CAAA,CAAC,CAAA,EAAC,WAAW,EAAC,CAAC,YAAG,YAAY,GAAQ,CAAC;IACrH,IAAG,gBAAgB;QAAC,OAAO,4BAAG,gBAAgB,CAAC,EAAC,KAAK,EAAC,UAAU,EAAC,CAAC,GAAI,CAAC;IACvE,OAAO,KAAC,IAAI,IAAC,KAAK,EAAE,KAAK,EAAE,UAAU,EAAC,SAAS,KAAK,CAAC,WAAW,KAAG,SAAS,CAAA,CAAC,CAAA,EAAE,CAAA,CAAC,CAAA,EAAC,WAAW,EAAC,CAAC,YAAG,KAAK,CAAC,GAAG,CAAC,IAAI,CAAA,EAAE,CAAA,wBAAoB,UAAU,CAAC,IAAI,CAAC,IAA1B,IAAI,CAAC,EAAE,CAA0B,CAAC,GAAQ,CAAC;AACvK,CAAC","sourcesContent":["import type{ReactNode}from'react';\nimport{validateTasks,type TaskItem}from'@hjmds/design-contracts/task-list';\nimport{Checkbox}from'./selection.js';import{List}from'./advanced-display.js';\nimport type { HjmCompositionStyleProp } from \"./composition-style.js\";\nexport type TaskListProps=Readonly<{label:string;items:readonly TaskItem[];onCompletedChange:(id:string,completed:boolean)=>void;disabled?:boolean;emptyContent?:ReactNode;\n /** Independent row action below the checkbox; apply disabled to the supplied control. */\n renderItemAction?:(context:Readonly<{item:TaskItem;disabled:boolean}>)=>ReactNode;\n renderCollection?:(context:Readonly<{items:readonly TaskItem[];renderItem:(item:TaskItem)=>ReactNode}>)=>ReactNode;\n /** Canonical layout-only placement on the List root. With `renderCollection` the product owns the root, so place that instead. */\n layoutStyle?:HjmCompositionStyleProp}>;\n/** Canonical Checkbox/List own semantics; optional collection composition keeps drag peers out of this entry. */\nexport function TaskList({label,items,onCompletedChange,disabled=false,emptyContent,renderItemAction,renderCollection,layoutStyle}:TaskListProps){validateTasks(items);if(!label.trim())throw new TypeError('TaskList needs a localized label');\n const renderItem=(item:TaskItem)=>{const control=<Checkbox label={item.label} checked={item.completed} disabled={disabled||item.disabled===true} onCheckedChange={completed=>onCompletedChange(item.id,completed)} {...(item.description===undefined?{}:{description:item.description})}/>;const action=renderItemAction?.({item,disabled:disabled||item.disabled===true});\n // Independent actions must not live inside Checkbox's label. A separate line preserves long labels at large text sizes.\n return <div style={{padding:\"var(--hjm-space-md)\"}}>{control}{action==null?null:<div style={{marginBlockStart:\"var(--hjm-space-sm)\"}}>{action}</div>}</div>;};\n if(items.length===0)return <List label={label} {...(layoutStyle===undefined?{}:{layoutStyle})}>{emptyContent}</List>;\n if(renderCollection)return <>{renderCollection({items,renderItem})}</>;\n return <List label={label} appearance=\"grouped\" {...(layoutStyle===undefined?{}:{layoutStyle})}>{items.map(item=><div key={item.id}>{renderItem(item)}</div>)}</List>;\n}\n"]}

package/dist/text-annotation.d.ts

@@ -0,0 +1,10 @@
+import { type TextAnnotationAction } from '@hjmds/design-contracts/text-annotation';
+/** Internal renderer while Native range measurement and the public API are
+ * being developed. Kept out of package exports until both paths are reviewable.
+ */
+export type TextAnnotationProps = Readonly<{
+    children: string;
+    action?: TextAnnotationAction;
+}>;
+export declare function TextAnnotation({ children, action }: TextAnnotationProps): import("react").JSX.Element;
+//# sourceMappingURL=text-annotation.d.ts.map

package/dist/text-annotation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"text-annotation.d.ts","sourceRoot":"","sources":["../src/text-annotation.tsx"],"names":[],"mappings":"AACA,OAAO,EAA+D,KAAK,oBAAoB,EAA2B,MAAM,yCAAyC,CAAC;AAI1K;;GAEG;AACH,MAAM,MAAM,mBAAmB,GAAG,QAAQ,CAAC;IACzC,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,oBAAoB,CAAC;CAC/B,CAAC,CAAC;AAEH,wBAAgB,cAAc,CAAC,EAAE,QAAQ,EAAE,MAAoB,EAAE,EAAE,mBAAmB,+BAmGrF"}

package/dist/text-annotation.js

@@ -0,0 +1,107 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { motion } from '@hjmds/design-contracts/foundations';
+import { mergeTextAnnotationFragments, resolveTextAnnotationGeometry } from '@hjmds/design-contracts/text-annotation';
+import { useLayoutEffect, useRef, useState } from 'react';
+import { useHjmTheme } from './provider.js';
+export function TextAnnotation({ children, action = 'highlight' }) {
+    const { environment } = useHjmTheme();
+    const textRef = useRef(null);
+    const anchorRef = useRef(null);
+    const svgRef = useRef(null);
+    const played = useRef(null);
+    const measured = useRef('');
+    const [measurement, setMeasurement] = useState({ content: children, lines: [] });
+    // A new string must not briefly receive paths measured for the old string.
+    const lines = measurement.content === children ? measurement.lines : [];
+    const geometry = resolveTextAnnotationGeometry(lines, action);
+    const key = `${action}:${children}`;
+    useLayoutEffect(() => {
+        const text = textRef.current, anchor = anchorRef.current;
+        if (!text || !anchor)
+            return;
+        let frame = 0, alive = true;
+        const measure = () => {
+            frame = 0;
+            if (!alive)
+                return;
+            const origin = anchor.getBoundingClientRect();
+            const range = document.createRange();
+            range.selectNodeContents(text);
+            // Range rectangles are actual shaped fragments, including mixed-direction
+            // runs. An inline-block or character-width estimate changes line wrapping.
+            const fragments = Array.from(range.getClientRects()).filter(rect => rect.width > 0 && rect.height > 0);
+            const bands = [];
+            const next = mergeTextAnnotationFragments(fragments.map(rect => {
+                // Chromium splits a mixed Arabic/English line into adjacent bidi runs.
+                // Separate outlines create interior seams (QA highlighter §11). Merge
+                // only measured matching vertical bands; guessing by character order or
+                // overlap alone could merge distinct lines with a tight line-height.
+                let lineIndex = bands.findIndex(band => Math.abs(band.top - rect.top) < 0.01 && Math.abs(band.height - rect.height) < 0.01);
+                if (lineIndex < 0) {
+                    lineIndex = bands.length;
+                    bands.push({ top: rect.top, height: rect.height });
+                }
+                return { x: rect.left - origin.left, y: rect.top - origin.top, width: rect.width, height: rect.height, lineIndex };
+            }));
+            const signature = JSON.stringify([children, next]);
+            if (measured.current !== signature) {
+                measured.current = signature;
+                setMeasurement({ content: children, lines: next });
+            }
+        };
+        const schedule = () => { if (!frame)
+            frame = requestAnimationFrame(measure); };
+        measure();
+        const observer = new ResizeObserver(schedule);
+        const mutation = new MutationObserver(records => {
+            if (records.some(record => !anchor.contains(record.target)))
+                schedule();
+        });
+        // Inline fragments themselves may not emit ResizeObserver notifications.
+        // Observe ancestors too: a preceding sibling can move the first fragment
+        // without changing its text or font.
+        for (let element = text; element; element = element.parentElement) {
+            observer.observe(element);
+            mutation.observe(element, { attributes: true, attributeFilter: ['style', 'class', 'dir'] });
+        }
+        const paragraph = text.closest('p, h1, h2, h3, h4, h5, h6, li') ?? text.parentElement?.parentElement;
+        // Ignore our SVG's mutations; measuring it would create an observer loop.
+        if (paragraph)
+            mutation.observe(paragraph, { childList: true, characterData: true, subtree: true, attributes: true, attributeFilter: ['style', 'class', 'dir'] });
+        document.fonts.addEventListener('loadingdone', schedule);
+        void document.fonts.ready.then(() => { if (alive)
+            schedule(); });
+        window.addEventListener('resize', schedule);
+        return () => { alive = false; cancelAnimationFrame(frame); observer.disconnect(); mutation.disconnect(); document.fonts.removeEventListener('loadingdone', schedule); window.removeEventListener('resize', schedule); };
+    }, [children, environment.textScale, environment.direction]);
+    useLayoutEffect(() => {
+        const svg = svgRef.current;
+        if (!svg || !geometry.paths.length || played.current === key)
+            return;
+        played.current = key;
+        // Geometry updates are not new content. Do not replay entry motion on every
+        // ResizeObserver delivery, unlike the upstream hide/show-on-body-resize path.
+        if (environment.reducedMotion || document.hidden)
+            return;
+        const animations = [];
+        for (const path of svg.querySelectorAll('path')) {
+            if (action === 'highlight') {
+                const start = environment.direction === 'rtl' ? 'inset(0 0 0 100%)' : 'inset(0 100% 0 0)';
+                animations.push(path.animate([{ clipPath: start }, { clipPath: 'inset(0 0 0 0)' }], { duration: motion.slow, easing: 'ease-out' }));
+            }
+            else {
+                const length = path.getTotalLength();
+                animations.push(path.animate([{ strokeDasharray: `${length}`, strokeDashoffset: length }, { strokeDasharray: `${length}`, strokeDashoffset: 0 }], { duration: motion.slow, easing: 'ease-out' }));
+            }
+        }
+        const stop = () => { for (const animation of animations)
+            animation.cancel(); };
+        const visibility = () => { if (document.hidden)
+            stop(); };
+        document.addEventListener('visibilitychange', visibility);
+        return () => { stop(); document.removeEventListener('visibilitychange', visibility); };
+    }, [key, lines, action, environment.reducedMotion, environment.direction, geometry.paths.length]);
+    const bounds = geometry.bounds;
+    return _jsxs("span", { "data-hjm-text-annotation": action, style: { display: 'inline', position: 'relative', isolation: 'isolate' }, children: [_jsx("span", { ref: anchorRef, "aria-hidden": "true", style: { position: 'absolute', left: 0, top: 0, width: 0, height: 0, pointerEvents: 'none' }, children: bounds ? _jsx("svg", { ref: svgRef, "aria-hidden": "true", focusable: "false", width: bounds.width, height: bounds.height, viewBox: `${bounds.x} ${bounds.y} ${bounds.width} ${bounds.height}`, style: { position: 'absolute', left: bounds.x, top: bounds.y, overflow: 'visible', pointerEvents: 'none' }, children: geometry.paths.map((path, index) => _jsx("path", { d: path.d, "data-line": path.lineIndex, fill: path.paint === 'fill' ? 'var(--hjm-color-primary)' : 'none', fillOpacity: path.paint === 'fill' ? 0.2 : 1, stroke: path.paint === 'stroke' ? 'var(--hjm-color-content-brand)' : 'none', strokeWidth: path.strokeWidth, strokeLinecap: "round", strokeLinejoin: "round" }, index)) }) : null }), _jsx("span", { ref: textRef, "data-hjm-annotation-text": "", style: { position: 'relative' }, children: children })] });
+}
+//# sourceMappingURL=text-annotation.js.map

package/dist/text-annotation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"text-annotation.js","sourceRoot":"","sources":["../src/text-annotation.tsx"],"names":[],"mappings":"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","sourcesContent":["import { motion } from '@hjmds/design-contracts/foundations';\nimport { mergeTextAnnotationFragments, resolveTextAnnotationGeometry, type TextAnnotationAction, type TextAnnotationRect } from '@hjmds/design-contracts/text-annotation';\nimport { useLayoutEffect, useRef, useState } from 'react';\nimport { useHjmTheme } from './provider.js';\n\n/** Internal renderer while Native range measurement and the public API are\n * being developed. Kept out of package exports until both paths are reviewable.\n */\nexport type TextAnnotationProps = Readonly<{\n  children: string;\n  action?: TextAnnotationAction;\n}>;\n\nexport function TextAnnotation({ children, action = 'highlight' }: TextAnnotationProps) {\n  const { environment } = useHjmTheme();\n  const textRef = useRef<HTMLSpanElement>(null);\n  const anchorRef = useRef<HTMLSpanElement>(null);\n  const svgRef = useRef<SVGSVGElement>(null);\n  const played = useRef<string | null>(null);\n  const measured = useRef('');\n  const [measurement, setMeasurement] = useState<{ content: string; lines: readonly TextAnnotationRect[] }>({ content: children, lines: [] });\n  // A new string must not briefly receive paths measured for the old string.\n  const lines = measurement.content === children ? measurement.lines : [];\n  const geometry = resolveTextAnnotationGeometry(lines, action);\n  const key = `${action}:${children}`;\n\n  useLayoutEffect(() => {\n    const text = textRef.current, anchor = anchorRef.current;\n    if (!text || !anchor) return;\n    let frame = 0, alive = true;\n    const measure = () => {\n      frame = 0;\n      if (!alive) return;\n      const origin = anchor.getBoundingClientRect();\n      const range = document.createRange();\n      range.selectNodeContents(text);\n      // Range rectangles are actual shaped fragments, including mixed-direction\n      // runs. An inline-block or character-width estimate changes line wrapping.\n      const fragments = Array.from(range.getClientRects()).filter(rect => rect.width > 0 && rect.height > 0);\n      const bands: { top: number; height: number }[] = [];\n      const next = mergeTextAnnotationFragments(fragments.map(rect => {\n        // Chromium splits a mixed Arabic/English line into adjacent bidi runs.\n        // Separate outlines create interior seams (QA highlighter §11). Merge\n        // only measured matching vertical bands; guessing by character order or\n        // overlap alone could merge distinct lines with a tight line-height.\n        let lineIndex = bands.findIndex(band => Math.abs(band.top - rect.top) < 0.01 && Math.abs(band.height - rect.height) < 0.01);\n        if (lineIndex < 0) { lineIndex = bands.length; bands.push({ top: rect.top, height: rect.height }); }\n        return { x: rect.left - origin.left, y: rect.top - origin.top, width: rect.width, height: rect.height, lineIndex };\n      }));\n      const signature = JSON.stringify([children, next]);\n      if (measured.current !== signature) {\n        measured.current = signature;\n        setMeasurement({ content: children, lines: next });\n      }\n    };\n    const schedule = () => { if (!frame) frame = requestAnimationFrame(measure); };\n    measure();\n    const observer = new ResizeObserver(schedule);\n    const mutation = new MutationObserver(records => {\n      if (records.some(record => !anchor.contains(record.target))) schedule();\n    });\n    // Inline fragments themselves may not emit ResizeObserver notifications.\n    // Observe ancestors too: a preceding sibling can move the first fragment\n    // without changing its text or font.\n    for (let element: Element | null = text; element; element = element.parentElement) {\n      observer.observe(element);\n      mutation.observe(element, { attributes: true, attributeFilter: ['style', 'class', 'dir'] });\n    }\n    const paragraph = text.closest('p, h1, h2, h3, h4, h5, h6, li') ?? text.parentElement?.parentElement;\n    // Ignore our SVG's mutations; measuring it would create an observer loop.\n    if (paragraph) mutation.observe(paragraph, { childList: true, characterData: true, subtree: true, attributes: true, attributeFilter: ['style', 'class', 'dir'] });\n    document.fonts.addEventListener('loadingdone', schedule);\n    void document.fonts.ready.then(() => { if (alive) schedule(); });\n    window.addEventListener('resize', schedule);\n    return () => { alive = false; cancelAnimationFrame(frame); observer.disconnect(); mutation.disconnect(); document.fonts.removeEventListener('loadingdone', schedule); window.removeEventListener('resize', schedule); };\n  }, [children, environment.textScale, environment.direction]);\n\n  useLayoutEffect(() => {\n    const svg = svgRef.current;\n    if (!svg || !geometry.paths.length || played.current === key) return;\n    played.current = key;\n    // Geometry updates are not new content. Do not replay entry motion on every\n    // ResizeObserver delivery, unlike the upstream hide/show-on-body-resize path.\n    if (environment.reducedMotion || document.hidden) return;\n    const animations: Animation[] = [];\n    for (const path of svg.querySelectorAll('path')) {\n      if (action === 'highlight') {\n        const start = environment.direction === 'rtl' ? 'inset(0 0 0 100%)' : 'inset(0 100% 0 0)';\n        animations.push(path.animate([{ clipPath: start }, { clipPath: 'inset(0 0 0 0)' }], { duration: motion.slow, easing: 'ease-out' }));\n      } else {\n        const length = path.getTotalLength();\n        animations.push(path.animate([{ strokeDasharray: `${length}`, strokeDashoffset: length }, { strokeDasharray: `${length}`, strokeDashoffset: 0 }], { duration: motion.slow, easing: 'ease-out' }));\n      }\n    }\n    const stop = () => { for (const animation of animations) animation.cancel(); };\n    const visibility = () => { if (document.hidden) stop(); };\n    document.addEventListener('visibilitychange', visibility);\n    return () => { stop(); document.removeEventListener('visibilitychange', visibility); };\n  }, [key, lines, action, environment.reducedMotion, environment.direction, geometry.paths.length]);\n\n  const bounds = geometry.bounds;\n  return <span data-hjm-text-annotation={action} style={{ display: 'inline', position: 'relative', isolation: 'isolate' }}>\n    <span ref={anchorRef} aria-hidden=\"true\" style={{ position: 'absolute', left: 0, top: 0, width: 0, height: 0, pointerEvents: 'none' }}>\n      {bounds ? <svg ref={svgRef} aria-hidden=\"true\" focusable=\"false\" width={bounds.width} height={bounds.height} viewBox={`${bounds.x} ${bounds.y} ${bounds.width} ${bounds.height}`} style={{ position: 'absolute', left: bounds.x, top: bounds.y, overflow: 'visible', pointerEvents: 'none' }}>\n        {/* Marker ink stays behind unchanged foreground text. The experimental\n            20% wash avoids replacing its semantic foreground with a brand color;\n            product-palette contrast still needs validation before promotion. */}\n        {geometry.paths.map((path, index) => <path key={index} d={path.d} data-line={path.lineIndex} fill={path.paint === 'fill' ? 'var(--hjm-color-primary)' : 'none'} fillOpacity={path.paint === 'fill' ? 0.2 : 1} stroke={path.paint === 'stroke' ? 'var(--hjm-color-content-brand)' : 'none'} strokeWidth={path.strokeWidth} strokeLinecap=\"round\" strokeLinejoin=\"round\" />)}\n      </svg> : null}\n    </span>\n    <span ref={textRef} data-hjm-annotation-text=\"\" style={{ position: 'relative' }}>{children}</span>\n  </span>;\n}\n"]}

package/dist/theme.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../src/theme.ts"],"names":[],"mappings":"AAgBA,OAAO,EAEL,KAAK,yBAAyB,EAC/B,MAAM,2DAA2D,CAAC;AAgBnE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAE3C,MAAM,MAAM,aAAa,GAAG,aAAa,GACvC,MAAM,CAAC,SAAS,MAAM,EAAE,EAAE,MAAM,GAAG,MAAM,CAAC,CAAC;AAmB7C,wBAAgB,mBAAmB,CACjC,KAAK,EAAE,yBAAyB,GAC/B,aAAa,CAuJf"}
+{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../src/theme.ts"],"names":[],"mappings":"AAiBA,OAAO,EAEL,KAAK,yBAAyB,EAC/B,MAAM,2DAA2D,CAAC;AAgBnE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAE3C,MAAM,MAAM,aAAa,GAAG,aAAa,GACvC,MAAM,CAAC,SAAS,MAAM,EAAE,EAAE,MAAM,GAAG,MAAM,CAAC,CAAC;AAmB7C,wBAAgB,mBAAmB,CACjC,KAAK,EAAE,yBAAyB,GAC/B,aAAa,CA2Kf"}

package/dist/theme.js

@@ -1,3 +1,4 @@
+import { resolveSurfaceFillOpacity } from "@hjmds/design-contracts/palette-contrast";
 import { backdrop, control, easing, fontFamily, fontWeight, motion, layer, radius, shadow, spacing, stroke, typography, } from "@hjmds/design-contracts/foundations";
 import { resolveColorReference } from "@hjmds/design-contracts/color-references";
 import { focusIndicatorContract } from "@hjmds/design-contracts/contracts";
@@ -8,16 +9,17 @@ function kebab(value) {
     return value.replace(/[A-Z]/g, (letter) => `-${letter.toLowerCase()}`);
 }
 // RN shadow token -> CSS; blur = radius, as react-native-web maps it.
-function shadowCss(token) {
+function shadowCss(token, offsetX = 0) {
     const hex = token.color.replace("#", "");
     const [r, g, b] = [0, 2, 4].map((start) => Number.parseInt(hex.slice(start, start + 2), 16));
-    return `0 ${token.offsetY}px ${token.radius}px rgb(${r} ${g} ${b} / ${Math.round(token.opacity * 100)}%)`;
+    return `${offsetX}px ${token.offsetY}px ${token.radius}px rgb(${r} ${g} ${b} / ${Math.round(token.opacity * 100)}%)`;
 }
 function rem(value) {
     return `${Number((value / 16).toFixed(5))}rem`;
 }
 export function createHjmThemeStyle(value) {
     const { environment, palette } = value;
+    const profileTokens = value.designProfile?.tokens;
     const style = {
         "--hjm-backdrop-modal": `color-mix(in srgb, ${backdrop.modal.color} ${backdrop.modal.opacity * 100}%, transparent)`,
         "--hjm-text-scale": environment.textScale,
@@ -38,10 +40,10 @@ export function createHjmThemeStyle(value) {
     for (const [name, value] of Object.entries(spacing)) {
         style[`--hjm-space-${kebab(name)}`] = `${value}px`;
     }
-    for (const [name, value] of Object.entries(radius)) {
+    for (const [name, value] of Object.entries(profileTokens?.radius ?? radius)) {
         style[`--hjm-radius-${kebab(name)}`] = `${value}px`;
     }
-    for (const [name, value] of Object.entries(typography)) {
+    for (const [name, value] of Object.entries(profileTokens?.typography ?? typography)) {
         style[`--hjm-type-${kebab(name)}-size`] =
             `calc(${rem(value.fontSize)} * var(--hjm-text-scale))`;
         style[`--hjm-type-${kebab(name)}-line-height`] =
@@ -56,7 +58,8 @@ export function createHjmThemeStyle(value) {
             ? "0ms"
             : `${value}ms`;
     }
-    style["--hjm-font-family-ui"] = fontFamily.ui.join(", ");
+    style["--hjm-font-family-ui"] = (profileTokens?.fontFamily.ui ?? fontFamily.ui).join(", ");
+    style["--hjm-font-family-code"] = (profileTokens?.fontFamily.code ?? fontFamily.code).join(", ");
     for (const [name, value] of Object.entries(stroke)) {
         style[`--hjm-stroke-${kebab(name)}`] = `${value}px`;
     }
@@ -96,16 +99,34 @@ export function createHjmThemeStyle(value) {
     for (const [name, value] of Object.entries(layer)) {
         style[`--hjm-layer-${kebab(name)}`] = value;
     }
-    for (const [name, token] of Object.entries(shadow)) {
+    for (const [name, token] of Object.entries(profileTokens?.shadow ?? shadow)) {
         style[`--hjm-shadow-${kebab(name)}`] = shadowCss(token);
     }
+    const surfaceMaterial = value.designProfile?.material.surface;
+    // Defaults are emitted on every Provider, so a nested neutral profile clears
+    // inherited glass/clay. Unsupported transparency remains an opaque CSS fill.
+    style["--hjm-surface-blur"] = surfaceMaterial?.blurStrength ? `blur(${surfaceMaterial.blurStrength * 32}px)` : "none";
+    style["--hjm-surface-fill-opacity"] = surfaceMaterial?.blurStrength ? resolveSurfaceFillOpacity(surfaceMaterial.fillOpacity, palette.theme) : 1;
+    const insetShadow = surfaceMaterial?.insetShadows.length
+        ? surfaceMaterial.insetShadows.map(token => `inset ${shadowCss(token, token.offsetX)}`).join(", ")
+        : "";
+    style["--hjm-surface-inset-shadow"] = insetShadow || "none";
+    style["--hjm-surface-raised-shadow"] = shadowCss(profileTokens?.shadow.floating ?? shadow.floating) + (insetShadow ? `, ${insetShadow}` : "");
+    // BottomCTA overlaps content above it (bottomCtaRecipe rationale). Profile
+    // strength is shared, but its shadow must cast upward rather than behind the
+    // footer; preserve the stylesheet-only legacy path when no profile is supplied.
+    style["--hjm-bottom-cta-shadow"] = profileTokens
+        ? shadowCss({ ...profileTokens.shadow.floating, offsetY: -Math.abs(profileTokens.shadow.floating.offsetY) })
+        : "none";
     // Overlay chrome and sizes come from the recipes Native reads (1.5.0).
     for (const [name, chrome] of [["dialog", dialogRecipe.content], ["sheet", sheetRecipe.content], ["toast", toastRecipe.surface]]) {
         style[`--hjm-${name}-background`] = resolveColorReference(chrome.background, palette);
         style[`--hjm-${name}-border`] = resolveColorReference(chrome.border, palette);
         style[`--hjm-${name}-border-width`] = `${chrome.borderWidth}px`;
         style[`--hjm-${name}-radius`] = `var(--hjm-radius-${chrome.radius})`;
-        style[`--hjm-${name}-shadow`] = shadowCss(chrome.shadow);
+        // Recipes select the floating role. Resolve its value from the profile so
+        // dialogs, sheets and toasts cannot retain neutral shadows after a theme switch.
+        style[`--hjm-${name}-shadow`] = shadowCss(profileTokens?.shadow.floating ?? chrome.shadow);
     }
     style["--hjm-sheet-max-height"] = `${sheetRecipe.content.maxHeightRatio * 100}dvh`;
     style["--hjm-sheet-max-width"] = `${sheetRecipe.web.maxWidth}px`;

package/dist/theme.js.map

@@ -1 +1 @@
-{"version":3,"file":"theme.js","sourceRoot":"","sources":["../src/theme.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n  backdrop,\n  control,\n  easing,\n  fontFamily,\n  fontWeight,\n  motion,\n  layer,\n  radius,\n  shadow,\n  spacing,\n  stroke,\n  typography,\n} from \"@hjmds/design-contracts/foundations\";\nimport { resolveColorReference } from \"@hjmds/design-contracts/color-references\";\nimport { focusIndicatorContract } from \"@hjmds/design-contracts/contracts\";\nimport {\n  visibleControlHeight,\n  type DesignSystemProviderValue,\n} from \"@hjmds/design-contracts/components/design-system-provider\";\nimport { buttonRecipe, fieldRecipe } from \"@hjmds/design-contracts/recipes/base\";\nimport {\n  bottomNavigationRecipe,\n  comboboxRecipe,\n  dialogRecipe,\n  listRowRecipe,\n  menuRecipe,\n  searchFieldRecipe,\n  selectRecipe,\n  sheetRecipe,\n  skeletonRecipe,\n  tooltipRecipe,\n  switchRecipe,\n  toastRecipe,\n} from \"@hjmds/design-contracts/recipes\";\nimport type { CSSProperties } from \"react\";\n\nexport type HjmThemeStyle = CSSProperties &\n  Record<`--hjm-${string}`, string | number>;\n\nfunction kebab(value: string): string {\n  return value.replace(/[A-Z]/g, (letter) => `-${letter.toLowerCase()}`);\n}\n\ntype ShadowToken = Readonly<{ color: string; opacity: number; radius: number; offsetY: number }>;\n\n// RN shadow token -> CSS; blur = radius, as react-native-web maps it.\nfunction shadowCss(token: ShadowToken): string {\n  const hex = token.color.replace(\"#\", \"\");\n  const [r, g, b] = [0, 2, 4].map((start) => Number.parseInt(hex.slice(start, start + 2), 16));\n  return `0 ${token.offsetY}px ${token.radius}px rgb(${r} ${g} ${b} / ${Math.round(token.opacity * 100)}%)`;\n}\n\nfunction rem(value: number): string {\n  return `${Number((value / 16).toFixed(5))}rem`;\n}\n\nexport function createHjmThemeStyle(\n  value: DesignSystemProviderValue,\n): HjmThemeStyle {\n  const { environment, palette } = value;\n  const style: HjmThemeStyle = {\n    \"--hjm-backdrop-modal\": `color-mix(in srgb, ${backdrop.modal.color} ${backdrop.modal.opacity * 100}%, transparent)`,\n    \"--hjm-text-scale\": environment.textScale,\n    \"--hjm-motion-scale\": environment.reducedMotion ? 0 : 1,\n    colorScheme: environment.theme,\n    backgroundColor: palette.theme.bg,\n    color: palette.theme.text,\n  };\n\n  for (const [name, color] of Object.entries(palette.theme)) {\n    style[`--hjm-color-${kebab(name)}`] = color;\n  }\n  for (const [name, color] of Object.entries(palette.statusAccents)) {\n    style[`--hjm-accent-${kebab(name)}`] = color;\n  }\n  for (const [name, color] of Object.entries(palette.statusAccentFills)) {\n    style[`--hjm-accent-fill-${kebab(name)}`] = color;\n  }\n  for (const [name, value] of Object.entries(spacing)) {\n    style[`--hjm-space-${kebab(name)}`] = `${value}px`;\n  }\n  for (const [name, value] of Object.entries(radius)) {\n    style[`--hjm-radius-${kebab(name)}`] = `${value}px`;\n  }\n  for (const [name, value] of Object.entries(typography)) {\n    style[`--hjm-type-${kebab(name)}-size`] =\n      `calc(${rem(value.fontSize)} * var(--hjm-text-scale))`;\n    style[`--hjm-type-${kebab(name)}-line-height`] =\n      `calc(${rem(value.lineHeight)} * var(--hjm-text-scale))`;\n    style[`--hjm-type-${kebab(name)}-weight`] = value.fontWeight;\n  }\n  for (const [name, value] of Object.entries(fontWeight)) {\n    style[`--hjm-font-weight-${kebab(name)}`] = value;\n  }\n  for (const [name, value] of Object.entries(motion)) {\n    style[`--hjm-motion-${kebab(name)}`] = environment.reducedMotion\n      ? \"0ms\"\n      : `${value}ms`;\n  }\n\n  style[\"--hjm-font-family-ui\"] = fontFamily.ui.join(\", \");\n  for (const [name, value] of Object.entries(stroke)) {\n    style[`--hjm-stroke-${kebab(name)}`] = `${value}px`;\n  }\n  // Unset before 1.4.1, so focus rules were invalid and drew no ring.\n  style[\"--hjm-color-focus\"] = resolveColorReference(focusIndicatorContract.color, palette);\n  style[\"--hjm-focus-width\"] = `${focusIndicatorContract.width}px`;\n  style[\"--hjm-focus-offset\"] = `${focusIndicatorContract.offset}px`;\n  style[\"--hjm-bottom-navigation-pressed-background\"] = resolveColorReference(\n    bottomNavigationRecipe.states.pressedBackground,\n    palette,\n  );\n  // Row rhythm and the leading frame come from the recipe so the stylesheet\n  // does not carry a second copy of the same numbers.\n  style[\"--hjm-list-row-gap\"] = rem(listRowRecipe.gap);\n  style[\"--hjm-list-row-leading-size\"] = rem(listRowRecipe.leadingSize);\n  for (const [name, value] of Object.entries(switchRecipe.sizes)) {\n    style[`--hjm-switch-${kebab(name)}-width`] = rem(value.width);\n    style[`--hjm-switch-${kebab(name)}-height`] = rem(value.height);\n    style[`--hjm-switch-${kebab(name)}-thumb`] = rem(value.thumb);\n    style[`--hjm-switch-${kebab(name)}-inset`] = rem(value.inset);\n    style[`--hjm-switch-${kebab(name)}-offset`] = rem(\n      value.width - value.thumb - value.inset * 2,\n    );\n  }\n  for (const [name, value] of Object.entries(listRowRecipe.density)) {\n    style[`--hjm-list-row-${kebab(name)}-one-line`] = rem(value.oneLineMinHeight);\n    style[`--hjm-list-row-${kebab(name)}-two-line`] = rem(value.twoLineMinHeight);\n    style[`--hjm-list-row-${kebab(name)}-padding-inline`] = rem(value.paddingHorizontal);\n    style[`--hjm-list-row-${kebab(name)}-padding-block`] = rem(value.paddingVertical);\n  }\n  // The recipe owns these; a second copy in the stylesheet drifts silently\n  // because the gates read that file as text only. Block and text heights\n  // already resolve through --hjm-space-*, so they are not re-emitted.\n  const skeletonCurve = easing[skeletonRecipe.animation.easing];\n  style[\"--hjm-skeleton-circle-size\"] =\n    `${skeletonRecipe.shapes.circle.defaultHeight}px`;\n  style[\"--hjm-skeleton-duration\"] = `${skeletonRecipe.animation.duration}ms`;\n  style[\"--hjm-skeleton-easing\"] = `cubic-bezier(${skeletonCurve.join(\", \")})`;\n  style[\"--hjm-skeleton-from-opacity\"] = skeletonRecipe.animation.fromOpacity;\n  style[\"--hjm-skeleton-to-opacity\"] = skeletonRecipe.animation.toOpacity;\n  // Export the shared order instead of keeping a second numeric scale in CSS.\n  for (const [name, value] of Object.entries(layer)) {\n    style[`--hjm-layer-${kebab(name)}`] = value;\n  }\n  for (const [name, token] of Object.entries(shadow)) {\n    style[`--hjm-shadow-${kebab(name)}`] = shadowCss(token);\n  }\n  // Overlay chrome and sizes come from the recipes Native reads (1.5.0).\n  for (const [name, chrome] of [[\"dialog\", dialogRecipe.content], [\"sheet\", sheetRecipe.content], [\"toast\", toastRecipe.surface]] as const) {\n    style[`--hjm-${name}-background`] = resolveColorReference(chrome.background, palette);\n    style[`--hjm-${name}-border`] = resolveColorReference(chrome.border, palette);\n    style[`--hjm-${name}-border-width`] = `${chrome.borderWidth}px`;\n    style[`--hjm-${name}-radius`] = `var(--hjm-radius-${chrome.radius})`;\n    style[`--hjm-${name}-shadow`] = shadowCss(chrome.shadow);\n  }\n  style[\"--hjm-sheet-max-height\"] = `${sheetRecipe.content.maxHeightRatio * 100}dvh`;\n  style[\"--hjm-sheet-max-width\"] = `${sheetRecipe.web.maxWidth}px`;\n  style[\"--hjm-sheet-handle-width\"] = `${sheetRecipe.handle.width}px`;\n  style[\"--hjm-sheet-handle-height\"] = `${sheetRecipe.handle.height}px`;\n  style[\"--hjm-sheet-handle-color\"] = resolveColorReference(sheetRecipe.handle.color, palette);\n  for (const [name, ratio] of Object.entries(sheetRecipe.sizes)) {\n    if (ratio !== null) style[`--hjm-sheet-size-${name}`] = `${ratio * 100}dvh`;\n  }\n  // Toast badge/action colours resolve from the recipe so Web and Native share one tone table (1.10.0).\n  for (const [tone, contract] of Object.entries(toastRecipe.tones)) {\n    style[`--hjm-toast-accent-${tone}`] = resolveColorReference(contract.accent, palette);\n    style[`--hjm-toast-badge-${tone}`] = resolveColorReference(contract.badge, palette);\n  }\n  style[\"--hjm-toast-badge-size\"] = `${toastRecipe.icon.badgeDiameter}px`;\n  style[\"--hjm-toast-action-background\"] = resolveColorReference(toastRecipe.action.background, palette);\n  style[\"--hjm-toast-action-color\"] = resolveColorReference(toastRecipe.action.color, palette);\n  style[\"--hjm-toast-description-color\"] = resolveColorReference(toastRecipe.description.color, palette);\n  const toastExit = toastRecipe.transition.web.exit;\n  style[\"--hjm-toast-exit-duration\"] = environment.reducedMotion ? \"0ms\" : `${toastExit.duration}ms`;\n  style[\"--hjm-toast-exit-easing\"] = `cubic-bezier(${easing[toastExit.easing].join(\", \")})`;\n  // SearchField geometry comes from searchFieldRecipe (2026-10-06 follow-up). Web had drawn TextField's\n  // 16px padding for both sizes and a 44px clear button even at `medium`, where the recipe and Native\n  // use a 36 circle with a 4px hit slop (44 target, 36 footprint).\n  for (const [name, size] of Object.entries(searchFieldRecipe.sizes)) {\n    style[`--hjm-search-field-padding-${name}`] = `${size.paddingHorizontal}px`;\n    style[`--hjm-search-field-gap-${name}`] = `${size.gap}px`;\n    style[`--hjm-search-field-clear-${name}`] = `${size.clearDiameter}px`;\n    style[`--hjm-search-field-clear-slop-${name}`] = `${size.clearHitSlop}px`;\n  }\n  style[\"--hjm-tooltip-max-width\"] = `${tooltipRecipe.content.maxWidth}px`;\n  style[\"--hjm-tooltip-padding\"] = `${tooltipRecipe.surface.padding}px`;\n  // Floating collection surfaces read their padding from the recipe (2026-10-06): the stylesheet's 4 had drifted from 8.\n  style[\"--hjm-menu-padding\"] = `${menuRecipe.surface.padding}px`;\n  style[\"--hjm-select-popover-padding\"] = `${selectRecipe.popover.padding}px`;\n  style[\"--hjm-combobox-popover-padding\"] = `${comboboxRecipe.popover.padding}px`;\n  style[\"--hjm-tooltip-collision-padding\"] = `${tooltipRecipe.positioning.collisionPadding}px`;\n  style[\"--hjm-button-pressed-opacity\"] = buttonRecipe.opacity.pressed;\n  style[\"--hjm-button-disabled-opacity\"] = buttonRecipe.opacity.disabled;\n  style[\"--hjm-field-border-width\"] = `${fieldRecipe.borderWidth}px`;\n  style[\"--hjm-field-focus-ring-width\"] = `${fieldRecipe.focusRingWidth}px`;\n  style[\"--hjm-field-disabled-opacity\"] = fieldRecipe.disabledOpacity;\n  style[\"--hjm-control-min-touch-target\"] = `${control.minTouchTarget}px`;\n  style[\"--hjm-control-field-height\"] = `${control.fieldHeight}px`;\n  style[\"--hjm-field-multiline-min-height\"] = rem(fieldRecipe.multilineMinHeight);\n  style[\"--hjm-field-padding-block\"] = rem(fieldRecipe.paddingVertical);\n  for (const [name, value] of Object.entries(control.buttonHeight)) {\n    // The axis is applied to the emitted variables rather than to each rule so\n    // that every stylesheet consumer of a control height honours it at once.\n    style[`--hjm-control-button-${kebab(name)}`] =\n      `${visibleControlHeight(value, environment.minimumVisualTarget)}px`;\n  }\n\n  return style;\n}\n"]}
+{"version":3,"file":"theme.js","sourceRoot":"","sources":["../src/theme.ts"],"names":[],"mappings":"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","sourcesContent":["import { resolveSurfaceFillOpacity } from \"@hjmds/design-contracts/palette-contrast\";\nimport {\n  backdrop,\n  control,\n  easing,\n  fontFamily,\n  fontWeight,\n  motion,\n  layer,\n  radius,\n  shadow,\n  spacing,\n  stroke,\n  typography,\n} from \"@hjmds/design-contracts/foundations\";\nimport { resolveColorReference } from \"@hjmds/design-contracts/color-references\";\nimport { focusIndicatorContract } from \"@hjmds/design-contracts/contracts\";\nimport {\n  visibleControlHeight,\n  type DesignSystemProviderValue,\n} from \"@hjmds/design-contracts/components/design-system-provider\";\nimport { buttonRecipe, fieldRecipe } from \"@hjmds/design-contracts/recipes/base\";\nimport {\n  bottomNavigationRecipe,\n  comboboxRecipe,\n  dialogRecipe,\n  listRowRecipe,\n  menuRecipe,\n  searchFieldRecipe,\n  selectRecipe,\n  sheetRecipe,\n  skeletonRecipe,\n  tooltipRecipe,\n  switchRecipe,\n  toastRecipe,\n} from \"@hjmds/design-contracts/recipes\";\nimport type { CSSProperties } from \"react\";\n\nexport type HjmThemeStyle = CSSProperties &\n  Record<`--hjm-${string}`, string | number>;\n\nfunction kebab(value: string): string {\n  return value.replace(/[A-Z]/g, (letter) => `-${letter.toLowerCase()}`);\n}\n\ntype ShadowToken = Readonly<{ color: string; opacity: number; radius: number; offsetY: number }>;\n\n// RN shadow token -> CSS; blur = radius, as react-native-web maps it.\nfunction shadowCss(token: ShadowToken, offsetX = 0): string {\n  const hex = token.color.replace(\"#\", \"\");\n  const [r, g, b] = [0, 2, 4].map((start) => Number.parseInt(hex.slice(start, start + 2), 16));\n  return `${offsetX}px ${token.offsetY}px ${token.radius}px rgb(${r} ${g} ${b} / ${Math.round(token.opacity * 100)}%)`;\n}\n\nfunction rem(value: number): string {\n  return `${Number((value / 16).toFixed(5))}rem`;\n}\n\nexport function createHjmThemeStyle(\n  value: DesignSystemProviderValue,\n): HjmThemeStyle {\n  const { environment, palette } = value;\n  const profileTokens = value.designProfile?.tokens;\n  const style: HjmThemeStyle = {\n    \"--hjm-backdrop-modal\": `color-mix(in srgb, ${backdrop.modal.color} ${backdrop.modal.opacity * 100}%, transparent)`,\n    \"--hjm-text-scale\": environment.textScale,\n    \"--hjm-motion-scale\": environment.reducedMotion ? 0 : 1,\n    colorScheme: environment.theme,\n    backgroundColor: palette.theme.bg,\n    color: palette.theme.text,\n  };\n\n  for (const [name, color] of Object.entries(palette.theme)) {\n    style[`--hjm-color-${kebab(name)}`] = color;\n  }\n  for (const [name, color] of Object.entries(palette.statusAccents)) {\n    style[`--hjm-accent-${kebab(name)}`] = color;\n  }\n  for (const [name, color] of Object.entries(palette.statusAccentFills)) {\n    style[`--hjm-accent-fill-${kebab(name)}`] = color;\n  }\n  for (const [name, value] of Object.entries(spacing)) {\n    style[`--hjm-space-${kebab(name)}`] = `${value}px`;\n  }\n  for (const [name, value] of Object.entries(profileTokens?.radius ?? radius)) {\n    style[`--hjm-radius-${kebab(name)}`] = `${value}px`;\n  }\n  for (const [name, value] of Object.entries(profileTokens?.typography ?? typography)) {\n    style[`--hjm-type-${kebab(name)}-size`] =\n      `calc(${rem(value.fontSize)} * var(--hjm-text-scale))`;\n    style[`--hjm-type-${kebab(name)}-line-height`] =\n      `calc(${rem(value.lineHeight)} * var(--hjm-text-scale))`;\n    style[`--hjm-type-${kebab(name)}-weight`] = value.fontWeight;\n  }\n  for (const [name, value] of Object.entries(fontWeight)) {\n    style[`--hjm-font-weight-${kebab(name)}`] = value;\n  }\n  for (const [name, value] of Object.entries(motion)) {\n    style[`--hjm-motion-${kebab(name)}`] = environment.reducedMotion\n      ? \"0ms\"\n      : `${value}ms`;\n  }\n\n  style[\"--hjm-font-family-ui\"] = (profileTokens?.fontFamily.ui ?? fontFamily.ui).join(\", \");\n  style[\"--hjm-font-family-code\"] = (profileTokens?.fontFamily.code ?? fontFamily.code).join(\", \");\n  for (const [name, value] of Object.entries(stroke)) {\n    style[`--hjm-stroke-${kebab(name)}`] = `${value}px`;\n  }\n  // Unset before 1.4.1, so focus rules were invalid and drew no ring.\n  style[\"--hjm-color-focus\"] = resolveColorReference(focusIndicatorContract.color, palette);\n  style[\"--hjm-focus-width\"] = `${focusIndicatorContract.width}px`;\n  style[\"--hjm-focus-offset\"] = `${focusIndicatorContract.offset}px`;\n  style[\"--hjm-bottom-navigation-pressed-background\"] = resolveColorReference(\n    bottomNavigationRecipe.states.pressedBackground,\n    palette,\n  );\n  // Row rhythm and the leading frame come from the recipe so the stylesheet\n  // does not carry a second copy of the same numbers.\n  style[\"--hjm-list-row-gap\"] = rem(listRowRecipe.gap);\n  style[\"--hjm-list-row-leading-size\"] = rem(listRowRecipe.leadingSize);\n  for (const [name, value] of Object.entries(switchRecipe.sizes)) {\n    style[`--hjm-switch-${kebab(name)}-width`] = rem(value.width);\n    style[`--hjm-switch-${kebab(name)}-height`] = rem(value.height);\n    style[`--hjm-switch-${kebab(name)}-thumb`] = rem(value.thumb);\n    style[`--hjm-switch-${kebab(name)}-inset`] = rem(value.inset);\n    style[`--hjm-switch-${kebab(name)}-offset`] = rem(\n      value.width - value.thumb - value.inset * 2,\n    );\n  }\n  for (const [name, value] of Object.entries(listRowRecipe.density)) {\n    style[`--hjm-list-row-${kebab(name)}-one-line`] = rem(value.oneLineMinHeight);\n    style[`--hjm-list-row-${kebab(name)}-two-line`] = rem(value.twoLineMinHeight);\n    style[`--hjm-list-row-${kebab(name)}-padding-inline`] = rem(value.paddingHorizontal);\n    style[`--hjm-list-row-${kebab(name)}-padding-block`] = rem(value.paddingVertical);\n  }\n  // The recipe owns these; a second copy in the stylesheet drifts silently\n  // because the gates read that file as text only. Block and text heights\n  // already resolve through --hjm-space-*, so they are not re-emitted.\n  const skeletonCurve = easing[skeletonRecipe.animation.easing];\n  style[\"--hjm-skeleton-circle-size\"] =\n    `${skeletonRecipe.shapes.circle.defaultHeight}px`;\n  style[\"--hjm-skeleton-duration\"] = `${skeletonRecipe.animation.duration}ms`;\n  style[\"--hjm-skeleton-easing\"] = `cubic-bezier(${skeletonCurve.join(\", \")})`;\n  style[\"--hjm-skeleton-from-opacity\"] = skeletonRecipe.animation.fromOpacity;\n  style[\"--hjm-skeleton-to-opacity\"] = skeletonRecipe.animation.toOpacity;\n  // Export the shared order instead of keeping a second numeric scale in CSS.\n  for (const [name, value] of Object.entries(layer)) {\n    style[`--hjm-layer-${kebab(name)}`] = value;\n  }\n  for (const [name, token] of Object.entries(profileTokens?.shadow ?? shadow)) {\n    style[`--hjm-shadow-${kebab(name)}`] = shadowCss(token);\n  }\n  const surfaceMaterial = value.designProfile?.material.surface;\n  // Defaults are emitted on every Provider, so a nested neutral profile clears\n  // inherited glass/clay. Unsupported transparency remains an opaque CSS fill.\n  style[\"--hjm-surface-blur\"] = surfaceMaterial?.blurStrength ? `blur(${surfaceMaterial.blurStrength * 32}px)` : \"none\";\n  style[\"--hjm-surface-fill-opacity\"] = surfaceMaterial?.blurStrength ? resolveSurfaceFillOpacity(surfaceMaterial.fillOpacity, palette.theme) : 1;\n  const insetShadow = surfaceMaterial?.insetShadows.length\n    ? surfaceMaterial.insetShadows.map(token => `inset ${shadowCss(token, token.offsetX)}`).join(\", \")\n    : \"\";\n  style[\"--hjm-surface-inset-shadow\"] = insetShadow || \"none\";\n  style[\"--hjm-surface-raised-shadow\"] = shadowCss(profileTokens?.shadow.floating ?? shadow.floating) + (insetShadow ? `, ${insetShadow}` : \"\");\n  // BottomCTA overlaps content above it (bottomCtaRecipe rationale). Profile\n  // strength is shared, but its shadow must cast upward rather than behind the\n  // footer; preserve the stylesheet-only legacy path when no profile is supplied.\n  style[\"--hjm-bottom-cta-shadow\"] = profileTokens\n    ? shadowCss({ ...profileTokens.shadow.floating, offsetY: -Math.abs(profileTokens.shadow.floating.offsetY) })\n    : \"none\";\n  // Overlay chrome and sizes come from the recipes Native reads (1.5.0).\n  for (const [name, chrome] of [[\"dialog\", dialogRecipe.content], [\"sheet\", sheetRecipe.content], [\"toast\", toastRecipe.surface]] as const) {\n    style[`--hjm-${name}-background`] = resolveColorReference(chrome.background, palette);\n    style[`--hjm-${name}-border`] = resolveColorReference(chrome.border, palette);\n    style[`--hjm-${name}-border-width`] = `${chrome.borderWidth}px`;\n    style[`--hjm-${name}-radius`] = `var(--hjm-radius-${chrome.radius})`;\n    // Recipes select the floating role. Resolve its value from the profile so\n    // dialogs, sheets and toasts cannot retain neutral shadows after a theme switch.\n    style[`--hjm-${name}-shadow`] = shadowCss(profileTokens?.shadow.floating ?? chrome.shadow);\n  }\n  style[\"--hjm-sheet-max-height\"] = `${sheetRecipe.content.maxHeightRatio * 100}dvh`;\n  style[\"--hjm-sheet-max-width\"] = `${sheetRecipe.web.maxWidth}px`;\n  style[\"--hjm-sheet-handle-width\"] = `${sheetRecipe.handle.width}px`;\n  style[\"--hjm-sheet-handle-height\"] = `${sheetRecipe.handle.height}px`;\n  style[\"--hjm-sheet-handle-color\"] = resolveColorReference(sheetRecipe.handle.color, palette);\n  for (const [name, ratio] of Object.entries(sheetRecipe.sizes)) {\n    if (ratio !== null) style[`--hjm-sheet-size-${name}`] = `${ratio * 100}dvh`;\n  }\n  // Toast badge/action colours resolve from the recipe so Web and Native share one tone table (1.10.0).\n  for (const [tone, contract] of Object.entries(toastRecipe.tones)) {\n    style[`--hjm-toast-accent-${tone}`] = resolveColorReference(contract.accent, palette);\n    style[`--hjm-toast-badge-${tone}`] = resolveColorReference(contract.badge, palette);\n  }\n  style[\"--hjm-toast-badge-size\"] = `${toastRecipe.icon.badgeDiameter}px`;\n  style[\"--hjm-toast-action-background\"] = resolveColorReference(toastRecipe.action.background, palette);\n  style[\"--hjm-toast-action-color\"] = resolveColorReference(toastRecipe.action.color, palette);\n  style[\"--hjm-toast-description-color\"] = resolveColorReference(toastRecipe.description.color, palette);\n  const toastExit = toastRecipe.transition.web.exit;\n  style[\"--hjm-toast-exit-duration\"] = environment.reducedMotion ? \"0ms\" : `${toastExit.duration}ms`;\n  style[\"--hjm-toast-exit-easing\"] = `cubic-bezier(${easing[toastExit.easing].join(\", \")})`;\n  // SearchField geometry comes from searchFieldRecipe (2026-10-06 follow-up). Web had drawn TextField's\n  // 16px padding for both sizes and a 44px clear button even at `medium`, where the recipe and Native\n  // use a 36 circle with a 4px hit slop (44 target, 36 footprint).\n  for (const [name, size] of Object.entries(searchFieldRecipe.sizes)) {\n    style[`--hjm-search-field-padding-${name}`] = `${size.paddingHorizontal}px`;\n    style[`--hjm-search-field-gap-${name}`] = `${size.gap}px`;\n    style[`--hjm-search-field-clear-${name}`] = `${size.clearDiameter}px`;\n    style[`--hjm-search-field-clear-slop-${name}`] = `${size.clearHitSlop}px`;\n  }\n  style[\"--hjm-tooltip-max-width\"] = `${tooltipRecipe.content.maxWidth}px`;\n  style[\"--hjm-tooltip-padding\"] = `${tooltipRecipe.surface.padding}px`;\n  // Floating collection surfaces read their padding from the recipe (2026-10-06): the stylesheet's 4 had drifted from 8.\n  style[\"--hjm-menu-padding\"] = `${menuRecipe.surface.padding}px`;\n  style[\"--hjm-select-popover-padding\"] = `${selectRecipe.popover.padding}px`;\n  style[\"--hjm-combobox-popover-padding\"] = `${comboboxRecipe.popover.padding}px`;\n  style[\"--hjm-tooltip-collision-padding\"] = `${tooltipRecipe.positioning.collisionPadding}px`;\n  style[\"--hjm-button-pressed-opacity\"] = buttonRecipe.opacity.pressed;\n  style[\"--hjm-button-disabled-opacity\"] = buttonRecipe.opacity.disabled;\n  style[\"--hjm-field-border-width\"] = `${fieldRecipe.borderWidth}px`;\n  style[\"--hjm-field-focus-ring-width\"] = `${fieldRecipe.focusRingWidth}px`;\n  style[\"--hjm-field-disabled-opacity\"] = fieldRecipe.disabledOpacity;\n  style[\"--hjm-control-min-touch-target\"] = `${control.minTouchTarget}px`;\n  style[\"--hjm-control-field-height\"] = `${control.fieldHeight}px`;\n  style[\"--hjm-field-multiline-min-height\"] = rem(fieldRecipe.multilineMinHeight);\n  style[\"--hjm-field-padding-block\"] = rem(fieldRecipe.paddingVertical);\n  for (const [name, value] of Object.entries(control.buttonHeight)) {\n    // The axis is applied to the emitted variables rather than to each rule so\n    // that every stylesheet consumer of a control height honours it at once.\n    style[`--hjm-control-button-${kebab(name)}`] =\n      `${visibleControlHeight(value, environment.minimumVisualTarget)}px`;\n  }\n\n  return style;\n}\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hjmds/react",
-  "version": "1.13.1",
+  "version": "1.15.0",
   "description": "Accessible React 19 renderers for HJM design contracts.",
   "license": "MIT",
   "publishConfig": {
@@ -356,6 +356,16 @@
       "import": "./dist/content-transition.js",
       "default": "./dist/content-transition.js"
     },
+    "./rating": {
+      "types": "./dist/rating.d.ts",
+      "import": "./dist/rating.js",
+      "default": "./dist/rating.js"
+    },
+    "./image-comparison": {
+      "types": "./dist/image-comparison.d.ts",
+      "import": "./dist/image-comparison.js",
+      "default": "./dist/image-comparison.js"
+    },
     "./carousel-motion": {
       "types": "./dist/carousel-motion.d.ts",
       "import": "./dist/carousel-motion.js",
@@ -472,6 +482,31 @@
       "types": "./dist/saved-items.d.ts",
       "import": "./dist/saved-items.js",
       "default": "./dist/saved-items.js"
+    },
+    "./progressive-blur": {
+      "types": "./dist/progressive-blur.d.ts",
+      "import": "./dist/progressive-blur.js",
+      "default": "./dist/progressive-blur.js"
+    },
+    "./date-entry": {
+      "types": "./dist/date-entry.d.ts",
+      "import": "./dist/date-entry.js",
+      "default": "./dist/date-entry.js"
+    },
+    "./field-group": {
+      "types": "./dist/field-group.d.ts",
+      "import": "./dist/field-group.js",
+      "default": "./dist/field-group.js"
+    },
+    "./document-resource": {
+      "types": "./dist/document-resource.d.ts",
+      "import": "./dist/document-resource.js",
+      "default": "./dist/document-resource.js"
+    },
+    "./design-profile": {
+      "types": "./dist/design-profile.d.ts",
+      "import": "./dist/design-profile.js",
+      "default": "./dist/design-profile.js"
     }
   },
   "files": [
@@ -481,7 +516,7 @@
     "THIRD_PARTY_NOTICES.md"
   ],
   "peerDependencies": {
-    "@hjmds/design-contracts": ">=1.13.0 <1.14.0",
+    "@hjmds/design-contracts": ">=1.15.0 <1.16.0",
     "react": ">=19.0.0",
     "react-dom": ">=19.0.0",
     "@number-flow/react": "0.6.2",
@@ -518,7 +553,7 @@
     "blobatar": "2.7.0",
     "@blobatar/react": "2.7.0",
     "lucide-react": "1.49.0",
-    "@hjmds/design-contracts": "1.13.1"
+    "@hjmds/design-contracts": "1.15.0"
   },
   "peerDependenciesMeta": {
     "@number-flow/react": {