@hjmds/react 1.9.0 → 1.11.0

package/dist/styles.layered.css

@@ -447,6 +447,10 @@
 .hjm-otp-field__slot[data-state="focused"] { border-color: var(--hjm-color-content-brand); box-shadow: 0 0 0 2px var(--hjm-color-content-brand); }
 .hjm-otp-field__slot[data-state="invalid"] { border-color: var(--hjm-color-danger); }
 
+/* Underline slots keep the same single editable input and focus contract. */
+.hjm-otp-field__control[data-presentation="underline"] .hjm-otp-field__slot { border-width: 0 0 2px; border-radius: 0; }
+.hjm-otp-field__control[data-presentation="underline"] .hjm-otp-field__slot[data-state="focused"] { box-shadow: 0 2px 0 var(--hjm-color-content-brand); }
+
 .hjm-bottom-navigation {
   position: fixed;
   z-index: 700;
@@ -1409,7 +1413,20 @@ button.hjm-list-row, a.hjm-list-row { cursor: pointer; }
   inline-size: 100%;
   text-align: center;
 }
-.hjm-auth-screen__main { inline-size: 100%; }
+.hjm-auth-screen__main { inline-size: 100%; position: relative; }
+.hjm-auth-screen__main[data-card] {
+  background: var(--hjm-color-bg);
+  border-radius: var(--hjm-radius-lg);
+  padding: var(--hjm-space-md);
+  box-sizing: border-box;
+}
+.hjm-auth-screen__pending {
+  position: absolute;
+  inset: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
 .hjm-auth-screen__footer {
   display: flex;
   flex-direction: column;
@@ -2372,18 +2389,23 @@ button.hjm-list-row, a.hjm-list-row { cursor: pointer; }
 .hjm-toast-viewport[data-placement^="bottom"] { inset-block-end: calc(max(var(--hjm-space-md), env(safe-area-inset-bottom)) + var(--hjm-toast-bottom-offset, 0px)); flex-direction: column-reverse; }
 .hjm-toast-viewport[data-placement$="-start"] { margin-inline-start: 0; }
 .hjm-toast-viewport[data-placement$="-end"] { margin-inline-end: 0; }
-/* Cards stay narrow on desktop too; keep close/action rows explicit (docs/toast.md). */
-.hjm-toast { position: relative; min-inline-size: 0; min-block-size: 3.5rem; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--hjm-space-sm); padding: var(--hjm-space-md); overflow: hidden; border: var(--hjm-toast-border-width) solid var(--hjm-toast-border); border-radius: var(--hjm-toast-radius); color: var(--hjm-color-text); background: var(--hjm-toast-background); box-shadow: var(--hjm-toast-shadow); pointer-events: auto; }
-.hjm-toast__tone-mark { position: absolute; inset-block: 0; inset-inline-start: 0; inline-size: 2px; background: var(--hjm-color-text-muted); }
-.hjm-toast[data-tone="info"] .hjm-toast__tone-mark, .hjm-toast[data-tone="info"] .hjm-toast__icon { color: var(--hjm-accent-info); background-color: var(--hjm-accent-info); }
-.hjm-toast[data-tone="success"] .hjm-toast__tone-mark, .hjm-toast[data-tone="success"] .hjm-toast__icon { color: var(--hjm-accent-success); background-color: var(--hjm-accent-success); }
-.hjm-toast[data-tone="warning"] .hjm-toast__tone-mark, .hjm-toast[data-tone="warning"] .hjm-toast__icon { color: var(--hjm-accent-warning); background-color: var(--hjm-accent-warning); }
-.hjm-toast[data-tone="danger"] .hjm-toast__tone-mark, .hjm-toast[data-tone="danger"] .hjm-toast__icon { color: var(--hjm-color-danger); background-color: var(--hjm-color-danger); }
-.hjm-toast__icon { grid-column: 1; grid-row: 1; display: grid; place-items: center; inline-size: 1.25rem; block-size: 1.25rem; border-radius: 50%; color: var(--hjm-color-text-muted); background: transparent !important; font-weight: var(--hjm-font-weight-bold); }
-.hjm-toast__content { grid-column: 2; grid-row: 1; min-inline-size: 0; display: grid; gap: var(--hjm-space-xxs); overflow-wrap: anywhere; }
-.hjm-toast__action, .hjm-toast__close { min-block-size: var(--hjm-control-min-touch-target); border: 0; color: var(--hjm-color-content-brand); background: transparent; font: inherit; font-weight: var(--hjm-font-weight-bold); cursor: pointer; }
-.hjm-toast__close { grid-column: 3; grid-row: 1; align-self: start; inline-size: var(--hjm-control-min-touch-target); color: var(--hjm-color-text-muted); }
-.hjm-toast__action { grid-column: 2 / -1; grid-row: 2; justify-self: start; max-inline-size: 100%; overflow-wrap: anywhere; text-align: start; }
+/* Cards stay narrow on desktop too; keep close/action rows explicit (docs/toast.md).
+   1.10.0 layout: [tone badge][title + description][close] / action pill on its own row, end-aligned.
+   The 2px tone strip is retired — the tinted badge carries tone (toastRecipe.toneMark width 0). */
+.hjm-toast { position: relative; min-inline-size: 0; min-block-size: 3.5rem; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: start; column-gap: var(--hjm-space-sm); row-gap: var(--hjm-space-xs); padding: var(--hjm-space-sm) var(--hjm-space-xs) var(--hjm-space-sm) var(--hjm-space-md); overflow: hidden; border: var(--hjm-toast-border-width) solid var(--hjm-toast-border); border-radius: var(--hjm-toast-radius); color: var(--hjm-color-text); background: var(--hjm-toast-background); box-shadow: var(--hjm-toast-shadow); pointer-events: auto; }
+.hjm-toast__tone-mark { display: none; }
+.hjm-toast__icon { grid-column: 1; grid-row: 1; align-self: start; display: grid; place-items: center; inline-size: var(--hjm-toast-badge-size); block-size: var(--hjm-toast-badge-size); border-radius: 50%; color: var(--hjm-toast-accent-neutral); background: var(--hjm-toast-badge-neutral); }
+.hjm-toast[data-tone="info"] .hjm-toast__icon { color: var(--hjm-toast-accent-info); background: var(--hjm-toast-badge-info); }
+.hjm-toast[data-tone="success"] .hjm-toast__icon { color: var(--hjm-toast-accent-success); background: var(--hjm-toast-badge-success); }
+.hjm-toast[data-tone="warning"] .hjm-toast__icon { color: var(--hjm-toast-accent-warning); background: var(--hjm-toast-badge-warning); }
+.hjm-toast[data-tone="danger"] .hjm-toast__icon { color: var(--hjm-toast-accent-danger); background: var(--hjm-toast-badge-danger); }
+.hjm-toast__content { grid-column: 2; grid-row: 1; align-self: center; min-inline-size: 0; display: grid; gap: var(--hjm-space-xxs); padding-block: var(--hjm-space-xxs); overflow-wrap: anywhere; word-break: keep-all; }
+.hjm-toast__title { font-weight: var(--hjm-font-weight-bold); line-height: 1.35; }
+.hjm-toast__description { color: var(--hjm-toast-description-color); line-height: 1.45; }
+.hjm-toast__close { grid-column: 3; grid-row: 1; align-self: start; display: grid; place-items: center; inline-size: var(--hjm-control-min-touch-target); min-block-size: var(--hjm-control-min-touch-target); margin-block-start: calc(-1 * var(--hjm-space-xxs)); border: 0; border-radius: 50%; color: var(--hjm-color-text-muted); background: transparent; cursor: pointer; }
+.hjm-toast__close:hover { color: var(--hjm-color-text); }
+.hjm-toast__action { grid-column: 2 / -1; grid-row: 2; justify-self: end; margin-inline-end: var(--hjm-space-xs); min-block-size: var(--hjm-control-min-touch-target); max-inline-size: 100%; padding-inline: var(--hjm-space-md); border: 0; border-radius: 999px; color: var(--hjm-toast-action-color); background: var(--hjm-toast-action-background); font: inherit; font-weight: var(--hjm-font-weight-bold); overflow-wrap: anywhere; text-align: center; cursor: pointer; }
+.hjm-toast__action:hover { filter: brightness(0.97); }
 .hjm-toast[data-state="closing"] { opacity: 0; transform: translateY(var(--hjm-space-xs)); transition: opacity var(--hjm-toast-exit-duration) var(--hjm-toast-exit-easing), transform var(--hjm-toast-exit-duration) var(--hjm-toast-exit-easing); }
 
 .hjm-dialog__close:focus-visible,
@@ -2626,4 +2648,70 @@ button.hjm-list-row, a.hjm-list-row { cursor: pointer; }
 .hjm-affix { color: var(--hjm-color-text); background: var(--hjm-color-bg); overflow-wrap: anywhere; }
 .hjm-affix__marker { display: block; block-size: 0; pointer-events: none; }
 
+/* Sidebar presentation decorates fixed link boxes; no pointer/focus target is transformed. */
+.hjm-sidebar[data-appearance="proximity"][data-animate] .hjm-sidebar__icon {
+  transform: scale(calc(1 + var(--hjm-sidebar-proximity, 0) * .18));
+  transition: transform var(--hjm-motion-fast);
+}
+.hjm-sidebar[data-appearance="hook"] .hjm-sidebar__item[aria-current="page"] {
+  border-inline-start: 3px solid var(--hjm-color-content-brand);
+  border-start-start-radius: var(--hjm-radius-lg);
+  border-end-start-radius: var(--hjm-radius-lg);
+}
+@keyframes hjm-sidebar-bounce {
+  0%, 100% { transform: translateY(0); }
+  45% { transform: translateY(calc(var(--hjm-space-xxs) * -1)); }
+  75% { transform: translateY(calc(var(--hjm-space-xxs) * .5)); }
+}
+.hjm-sidebar[data-appearance="bounce"][data-animate] .hjm-sidebar__item[data-bounce] .hjm-sidebar__icon {
+  animation: hjm-sidebar-bounce var(--hjm-motion-normal) ease-out;
+}
+
+/* Measured elastic indicator stays beneath labels; no filter touches text or hit targets. */
+.hjm-tabs[data-appearance="gooey"] .hjm-tabs__list { position: relative; }
+.hjm-tabs[data-appearance="gooey"] .hjm-tabs__tab[data-state="selected"]::after { display: none; }
+.hjm-tabs__gooey { position: absolute; bottom: 0; height: 6px; border-radius: var(--hjm-radius-full); background: var(--hjm-color-content-brand); pointer-events: none; }
+
+/* Capsule destinations retain route/link semantics. At larger text sizes we show
+   every label vertically instead of shrinking type to mimic the reference. */
+.hjm-bottom-navigation[data-presentation="capsule"] .hjm-bottom-navigation__surface {
+  display: flex; align-items: center; gap: var(--hjm-space-xs); background: transparent;
+}
+.hjm-bottom-navigation[data-presentation="capsule"] .hjm-bottom-navigation__list {
+  display: flex; flex: 1; min-inline-size: 0; padding: var(--hjm-space-xxs);
+  background: var(--hjm-color-surface); border: 1px solid var(--hjm-color-border);
+  border-radius: var(--hjm-radius-full); box-shadow: 0 8px 24px rgb(0 0 0 / 12%);
+}
+.hjm-bottom-navigation[data-presentation="capsule"] li { flex: 1; min-inline-size: 44px; }
+.hjm-bottom-navigation[data-presentation="capsule"][data-expanded-labels="false"] li[data-selected="true"] { flex: 2; }
+.hjm-bottom-navigation[data-presentation="capsule"] .hjm-bottom-navigation__item {
+  min-inline-size: 44px; min-block-size: 52px; justify-content: center; border-radius: var(--hjm-radius-full);
+  transition: background-color 160ms ease, color 160ms ease;
+}
+.hjm-bottom-navigation[data-presentation="capsule"][data-expanded-labels="false"] .hjm-bottom-navigation__item { flex-direction: row; }
+.hjm-bottom-navigation[data-presentation="capsule"][data-expanded-labels="false"] .hjm-bottom-navigation__item:not([data-state="selected"]) .hjm-bottom-navigation__label { display: none; }
+.hjm-bottom-navigation[data-presentation="capsule"] .hjm-bottom-navigation__item[data-state="selected"] { background: var(--hjm-color-surface-accent); }
+.hjm-bottom-navigation[data-presentation="capsule"] .hjm-bottom-navigation__primary-action { position: static; translate: none; flex-shrink: 0; }
+@media (prefers-reduced-motion: reduce) { .hjm-bottom-navigation[data-presentation="capsule"] .hjm-bottom-navigation__item { transition: none; } }
+
+/* An opaque baseline remains readable when backdrop filtering is unsupported.
+   Menus render through their existing portals rather than clipping in this shell. */
+.hjm-navigation-bar {
+  display: flex; flex-wrap: wrap; align-items: center; gap: var(--hjm-space-md);
+  padding: var(--hjm-space-sm); border: 1px solid var(--hjm-color-border);
+  border-radius: var(--hjm-radius-xl); background: var(--hjm-color-surface);
+  color: var(--hjm-color-text); box-shadow: 0 8px 24px rgb(0 0 0 / 12%);
+}
+@supports (backdrop-filter: blur(20px)) {
+  .hjm-navigation-bar { background: color-mix(in srgb, var(--hjm-color-surface) 92%, transparent); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); }
+}
+.hjm-navigation-bar__brand { flex-shrink: 0; padding-inline: var(--hjm-space-xs); }
+.hjm-navigation-bar__destinations, .hjm-navigation-bar__actions { display: flex; align-items: center; flex-wrap: wrap; gap: var(--hjm-space-xs); min-inline-size: 0; }
+.hjm-navigation-bar__destinations { flex: 1; }
+.hjm-navigation-bar__actions > * { max-inline-size: 100%; }
+@media (max-width: 600px) { .hjm-navigation-bar__actions { flex-basis: 100%; } }
+@media (prefers-reduced-transparency: reduce), (forced-colors: active) { .hjm-navigation-bar { background: var(--hjm-color-surface); backdrop-filter: none; } }
+
+[data-motion="reduced"] .hjm-bottom-navigation[data-presentation="capsule"] .hjm-bottom-navigation__item { transition: none; }
+
 }

package/dist/supplemental-display.d.ts

@@ -1,9 +1,17 @@
-import { type IconDescriptor } from "@hjmds/design-contracts/components/icon";
+import { type IconDescriptor, type SemanticIconName } from "@hjmds/design-contracts/components/icon";
 import { type ImageDescriptor, type ImageLoadStatus } from "@hjmds/design-contracts/components/image";
 import { type CounterBadgeSize, type CounterBadgeTone, type CounterBadgeVariant } from "@hjmds/design-contracts/recipes";
 import { type CSSProperties, type HTMLAttributes, type ImgHTMLAttributes, type ReactElement, type ReactEventHandler, type ReactNode, type Ref, type SVGAttributes } from "react";
 import type { HjmCompositionStyleProp } from "./composition-style.js";
-export type IconProps = Omit<SVGAttributes<SVGSVGElement>, "children" | "color"> & IconDescriptor;
+export type IconProps = Omit<SVGAttributes<SVGSVGElement>, "children" | "color"> & IconDescriptor & Readonly<{
+    /** Optional glyph inside the existing 24-unit SVG frame; HJM owns semantics. */
+    renderGlyph?: (props: Readonly<{
+        name: SemanticIconName;
+        size: number;
+        color: string;
+        strokeWidth: number;
+    }>) => ReactNode;
+}>;
 export declare const Icon: import("react").ForwardRefExoticComponent<IconProps & import("react").RefAttributes<SVGSVGElement>>;
 type ImageElementProps = Omit<ImgHTMLAttributes<HTMLImageElement>, "alt" | "aria-hidden" | "aria-label" | "children" | "className" | "height" | "onError" | "onLoad" | "role" | "src" | "style" | "width">;
 /** Canonical props handed to a framework adapter such as `next/image`. */

package/dist/supplemental-display.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"supplemental-display.d.ts","sourceRoot":"","sources":["../src/supplemental-display.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"supplemental-display.d.ts","sourceRoot":"","sources":["../src/supplemental-display.tsx"],"names":[],"mappings":"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"}

package/dist/supplemental-display.js

@@ -51,7 +51,7 @@ const iconPaths = {
     visibilityOff: "m3 3 18 18M10.6 5.2A9 9 0 0 1 12 5c6 0 10 7 10 7a17 17 0 0 1-2.1 3M6.6 6.6C3.8 8.5 2 12 2 12s4 7 10 7a9 9 0 0 0 3.4-.7M9.9 9.9a3 3 0 0 0 4.2 4.2",
     warning: "M12 3 2.7 20h18.6L12 3Zm0 6v4m0 3h.01",
 };
-export const Icon = forwardRef(function Icon({ name, size, tone, weight, directionality, decorative, accessibilityLabel, className, style, ...props }, ref) {
+export const Icon = forwardRef(function Icon({ name, size, tone, weight, directionality, decorative, accessibilityLabel, renderGlyph, className, style, ...props }, ref) {
     const descriptor = resolveIconDescriptor({
         name,
         ...(size === undefined ? {} : { size }),
@@ -64,7 +64,7 @@ export const Icon = forwardRef(function Icon({ name, size, tone, weight, directi
     const theme = useOptionalHjmTheme();
     const transform = getIconTransform(descriptor.directionality, theme?.environment.direction ?? "ltr");
     const dimension = iconRecipe.sizes[descriptor.size];
-    return (_jsx("svg", { ...props, ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: classNames("hjm-icon", className), "data-name": descriptor.name, "data-size": descriptor.size, "data-tone": descriptor.tone, "data-weight": descriptor.weight, "data-transform": transform, width: dimension, height: dimension, stroke: "currentColor", strokeWidth: iconRecipe.weights[descriptor.weight], strokeLinecap: "round", strokeLinejoin: "round", role: descriptor.decorative ? undefined : "img", "aria-hidden": descriptor.decorative || undefined, "aria-label": descriptor.decorative ? undefined : descriptor.accessibilityLabel, focusable: "false", style: style, children: _jsx("path", { d: iconPaths[descriptor.name] }) }));
+    return (_jsx("svg", { ...props, ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: classNames("hjm-icon", className), "data-name": descriptor.name, "data-size": descriptor.size, "data-tone": descriptor.tone, "data-weight": descriptor.weight, "data-transform": transform, width: dimension, height: dimension, stroke: "currentColor", strokeWidth: iconRecipe.weights[descriptor.weight], strokeLinecap: "round", strokeLinejoin: "round", role: descriptor.decorative ? undefined : "img", "aria-hidden": descriptor.decorative || undefined, "aria-label": descriptor.decorative ? undefined : descriptor.accessibilityLabel, focusable: "false", style: style, children: renderGlyph?.({ name: descriptor.name, size: 24, color: "currentColor", strokeWidth: iconRecipe.weights[descriptor.weight] }) ?? _jsx("path", { d: iconPaths[descriptor.name] }) }));
 });
 /** Intrinsic-size image with canonical alt semantics and an accessible fallback. */
 export const Image = forwardRef(function Image({ src, width, height, fit, decorative, accessibilityLabel, imageProps, renderImage, fallback, imageRef, onLoad, onError, onLoadStatusChange, className, style, ...props }, ref) {

package/dist/supplemental-display.js.map

@@ -1 +1 @@
-{"version":3,"file":"supplemental-display.js","sourceRoot":"","sources":["../src/supplemental-display.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  getIconTransform,\n  resolveIconDescriptor,\n  type IconDescriptor,\n  type SemanticIconName,\n} from \"@hjmds/design-contracts/components/icon\";\nimport {\n  imageRecipe,\n  resolveImageAspectRatio,\n  resolveImageDescriptor,\n  resolveImageFallbackAccessibilityLabel,\n  type ImageDescriptor,\n  type ImageLoadStatus,\n} from \"@hjmds/design-contracts/components/image\";\nimport {\n  counterBadgeRecipe,\n  formatCounterBadgeCount,\n  iconRecipe,\n  type CounterBadgeSize,\n  type CounterBadgeTone,\n  type CounterBadgeVariant,\n} from \"@hjmds/design-contracts/recipes\";\nimport {\n  forwardRef,\n  useState,\n  type CSSProperties,\n  type HTMLAttributes,\n  type ImgHTMLAttributes,\n  type ReactElement,\n  type ReactEventHandler,\n  type ReactNode,\n  type Ref,\n  type SVGAttributes,\n} from \"react\";\nimport { classNames } from \"./internal.js\";\nimport { useOptionalHjmTheme } from \"./provider.js\";\nimport type { HjmCompositionStyleProp } from \"./composition-style.js\";\n\n/** Internal, dependency-free semantic glyph registry. All marks share one 24px stroke grid. */\nconst iconPaths = {\n  add: \"M12 5v14M5 12h14\",\n  ai: \"M12 2l1.2 4.1L17 8l-3.8 1.9L12 14l-1.2-4.1L7 8l3.8-1.9L12 2ZM19 14l.7 2.3L22 17.5l-2.3 1.2L19 21l-.7-2.3-2.3-1.2 2.3-1.2L19 14Z\",\n  alert: \"M12 3 2.7 20h18.6L12 3Zm0 6v4m0 3h.01\",\n  back: \"M15 18 9 12l6-6M9 12h10\",\n  calendar: \"M5 4h14a2 2 0 0 1 2 2v13a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2Zm2-2v4m10-4v4M3 9h18\",\n  check: \"m5 12 4 4L19 6\",\n  chevronDown: \"m6 9 6 6 6-6\",\n  chevronEnd: \"m9 6 6 6-6 6\",\n  chevronStart: \"m15 6-6 6 6 6\",\n  chevronUp: \"m6 15 6-6 6 6\",\n  close: \"M6 6l12 12M18 6 6 18\",\n  compare: \"M8 7h11m0 0-3-3m3 3-3 3M16 17H5m0 0 3-3m-3 3 3 3\",\n  copy: \"M8 8h11a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2H10a2 2 0 0 1-2-2V8Zm8 0V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v9a2 2 0 0 0 2 2h3\",\n  delete: \"M4 7h16M9 7V4h6v3m3 0-1 14H7L6 7m4 4v6m4-6v6\",\n  download: \"M12 3v12m0 0 5-5m-5 5-5-5M4 19v2h16v-2\",\n  edit: \"m4 16-1 5 5-1L19 9l-4-4L4 16Zm9-9 4 4\",\n  error: \"M12 22a10 10 0 1 0 0-20 10 10 0 0 0 0 20Zm0-14v5m0 3h.01\",\n  favorite: \"M20.8 4.6a5.5 5.5 0 0 0-7.8 0L12 5.7l-1.1-1.1a5.5 5.5 0 0 0-7.8 7.8L12 21l8.8-8.6a5.5 5.5 0 0 0 0-7.8Z\",\n  filter: \"M3 5h18l-7 8v6l-4 2v-8L3 5Z\",\n  forward: \"m9 6 6 6-6 6m6-6H5\",\n  help: \"M12 22a10 10 0 1 0 0-20 10 10 0 0 0 0 20Zm-3-13a3 3 0 1 1 4.7 2.5c-1 .7-1.7 1.2-1.7 2.5m0 3h.01\",\n  home: \"m3 11 9-8 9 8v10h-6v-6H9v6H3V11Z\",\n  info: \"M12 22a10 10 0 1 0 0-20 10 10 0 0 0 0 20Zm0-11v6m0-10h.01\",\n  lock: \"M6 10h12v11H6V10Zm3 0V7a3 3 0 0 1 6 0v3\",\n  menu: \"M4 6h16M4 12h16M4 18h16\",\n  more: \"M5 12h.01M12 12h.01M19 12h.01\",\n  notifications: \"M18 8a6 6 0 0 0-12 0c0 7-3 7-3 9h18c0-2-3-2-3-9Zm-8 12h4\",\n  pause: \"M8 5v14m8-14v14\",\n  play: \"m8 5 11 7-11 7V5Z\",\n  refresh: \"M20 7v5h-5M4 17v-5h5m10.5-3A8 8 0 0 0 6 6l-2 2m.5 7A8 8 0 0 0 18 18l2-2\",\n  search: \"m21 21-4.4-4.4M19 11a8 8 0 1 1-16 0 8 8 0 0 1 16 0Z\",\n  settings: \"M12 15.5a3.5 3.5 0 1 0 0-7 3.5 3.5 0 0 0 0 7Zm7.4-3.5 2-1.5-2-3.5-2.4 1a8 8 0 0 0-2-1.2L14.7 4h-4l-.4 2.8A8 8 0 0 0 8 8L5.6 7l-2 3.5 2 1.5a8 8 0 0 0 0 2l-2 1.5 2 3.5L8 18a8 8 0 0 0 2.3 1.2l.4 2.8h4l.3-2.8A8 8 0 0 0 17 18l2.4 1 2-3.5-2-1.5a8 8 0 0 0 0-2Z\",\n  share: \"M18 8a3 3 0 1 0 0-6 3 3 0 0 0 0 6ZM6 15a3 3 0 1 0 0-6 3 3 0 0 0 0 6Zm12 9a3 3 0 1 0 0-6 3 3 0 0 0 0 6ZM8.6 16.5l6.8 4M15.4 6.5l-6.8 4\",\n  success: \"M12 22a10 10 0 1 0 0-20 10 10 0 0 0 0 20Zm-5-10 3 3 7-7\",\n  trendDown: \"M3 7l7 7 4-4 7 7m0 0v-6m0 6h-6\",\n  trendFlat: \"M4 12h16m0 0-4-4m4 4-4 4\",\n  trendUp: \"M3 17l7-7 4 4 7-7m0 0v6m0-6h-6\",\n  upload: \"M12 21V9m0 0-5 5m5-5 5 5M4 5V3h16v2\",\n  user: \"M12 12a4 4 0 1 0 0-8 4 4 0 0 0 0 8Zm-8 9a8 8 0 0 1 16 0\",\n  users: \"M9 11a4 4 0 1 0 0-8 4 4 0 0 0 0 8Zm-7 10a7 7 0 0 1 14 0m1-16a4 4 0 0 1 0 7m0 3a6 6 0 0 1 5 6\",\n  visibility: \"M2 12s4-7 10-7 10 7 10 7-4 7-10 7S2 12 2 12Zm10 3a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z\",\n  visibilityOff: \"m3 3 18 18M10.6 5.2A9 9 0 0 1 12 5c6 0 10 7 10 7a17 17 0 0 1-2.1 3M6.6 6.6C3.8 8.5 2 12 2 12s4 7 10 7a9 9 0 0 0 3.4-.7M9.9 9.9a3 3 0 0 0 4.2 4.2\",\n  warning: \"M12 3 2.7 20h18.6L12 3Zm0 6v4m0 3h.01\",\n} as const satisfies Record<SemanticIconName, string>;\n\nexport type IconProps = Omit<\n  SVGAttributes<SVGSVGElement>,\n  \"children\" | \"color\"\n> & IconDescriptor;\n\nexport const Icon = forwardRef<SVGSVGElement, IconProps>(function Icon(\n  {\n    name,\n    size,\n    tone,\n    weight,\n    directionality,\n    decorative,\n    accessibilityLabel,\n    className,\n    style,\n    ...props\n  },\n  ref,\n) {\n  const descriptor = resolveIconDescriptor({\n    name,\n    ...(size === undefined ? {} : { size }),\n    ...(tone === undefined ? {} : { tone }),\n    ...(weight === undefined ? {} : { weight }),\n    ...(directionality === undefined ? {} : { directionality }),\n    ...(decorative === undefined ? {} : { decorative }),\n    ...(accessibilityLabel === undefined ? {} : { accessibilityLabel }),\n  } as IconDescriptor);\n  const theme = useOptionalHjmTheme();\n  const transform = getIconTransform(\n    descriptor.directionality,\n    theme?.environment.direction ?? \"ltr\",\n  );\n  const dimension = iconRecipe.sizes[descriptor.size];\n  return (\n    <svg\n      {...props}\n      ref={ref}\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      className={classNames(\"hjm-icon\", className)}\n      data-name={descriptor.name}\n      data-size={descriptor.size}\n      data-tone={descriptor.tone}\n      data-weight={descriptor.weight}\n      data-transform={transform}\n      width={dimension}\n      height={dimension}\n      stroke=\"currentColor\"\n      strokeWidth={iconRecipe.weights[descriptor.weight]}\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      role={descriptor.decorative ? undefined : \"img\"}\n      aria-hidden={descriptor.decorative || undefined}\n      aria-label={descriptor.decorative ? undefined : descriptor.accessibilityLabel}\n      focusable=\"false\"\n      style={style}\n    >\n      <path d={iconPaths[descriptor.name]} />\n    </svg>\n  );\n});\n\ntype ImageElementProps = Omit<\n  ImgHTMLAttributes<HTMLImageElement>,\n  | \"alt\"\n  | \"aria-hidden\"\n  | \"aria-label\"\n  | \"children\"\n  | \"className\"\n  | \"height\"\n  | \"onError\"\n  | \"onLoad\"\n  | \"role\"\n  | \"src\"\n  | \"style\"\n  | \"width\"\n>;\n\n/** Canonical props handed to a framework adapter such as `next/image`. */\nexport type ImageAdapterProps = ImageElementProps &\n  Readonly<{\n    src: string;\n    alt: string;\n    width: number;\n    height: number;\n    className?: string;\n    style: CSSProperties;\n    \"aria-hidden\"?: true;\n    onLoad: ReactEventHandler<HTMLImageElement>;\n    onError: ReactEventHandler<HTMLImageElement>;\n    ref?: Ref<HTMLImageElement>;\n  }>;\n\ntype ImageRootProps = Omit<\n  HTMLAttributes<HTMLSpanElement>,\n  | \"aria-hidden\"\n  | \"aria-label\"\n  | \"aria-labelledby\"\n  | \"children\"\n  | \"onError\"\n  | \"onLoad\"\n  | \"role\"\n>;\n\nexport type ImageProps = ImageRootProps &\n  ImageDescriptor &\n  Readonly<{\n    /** Additional native `<img>` props shared with the framework adapter. */\n    imageProps?: ImageElementProps &\n      Readonly<{ className?: string; style?: CSSProperties }>;\n    /**\n     * Receives the complete accessible image contract. The adapter must pass\n     * these props to its underlying image element so HJM can observe failure.\n     */\n    renderImage?: (props: ImageAdapterProps) => ReactElement;\n    /** Visual content only; HJM keeps the fallback's accessible name. */\n    fallback?: ReactNode;\n    imageRef?: Ref<HTMLImageElement>;\n    onLoad?: ReactEventHandler<HTMLImageElement>;\n    onError?: ReactEventHandler<HTMLImageElement>;\n    onLoadStatusChange?: (status: Extract<ImageLoadStatus, \"loaded\" | \"error\">) => void;\n  }>;\n\ntype ImageState = Readonly<{\n  src: string;\n  status: Extract<ImageLoadStatus, \"loading\" | \"loaded\" | \"error\">;\n}>;\n\n/** Intrinsic-size image with canonical alt semantics and an accessible fallback. */\nexport const Image = forwardRef<HTMLSpanElement, ImageProps>(function Image(\n  {\n    src,\n    width,\n    height,\n    fit,\n    decorative,\n    accessibilityLabel,\n    imageProps,\n    renderImage,\n    fallback,\n    imageRef,\n    onLoad,\n    onError,\n    onLoadStatusChange,\n    className,\n    style,\n    ...props\n  },\n  ref,\n) {\n  const descriptor = resolveImageDescriptor({\n    src,\n    width,\n    height,\n    ...(fit === undefined ? {} : { fit }),\n    ...(decorative === undefined ? {} : { decorative }),\n    ...(accessibilityLabel === undefined ? {} : { accessibilityLabel }),\n  } as ImageDescriptor);\n  const [state, setState] = useState<ImageState>({\n    src: descriptor.src,\n    status: \"loading\",\n  });\n  const status = state.src === descriptor.src ? state.status : \"loading\";\n  const {\n    className: imageClassName,\n    style: imageStyle,\n    ...restImageProps\n  } = imageProps ?? {};\n\n  const handleLoad: ReactEventHandler<HTMLImageElement> = (event) => {\n    setState({ src: descriptor.src, status: \"loaded\" });\n    onLoadStatusChange?.(\"loaded\");\n    onLoad?.(event);\n  };\n  const handleError: ReactEventHandler<HTMLImageElement> = (event) => {\n    setState({ src: descriptor.src, status: \"error\" });\n    onLoadStatusChange?.(\"error\");\n    onError?.(event);\n  };\n  const adapterProps: ImageAdapterProps = {\n    ...restImageProps,\n    src: descriptor.src,\n    alt: descriptor.decorative ? \"\" : descriptor.accessibilityLabel,\n    width: descriptor.width,\n    height: descriptor.height,\n    className: classNames(\"hjm-image__asset\", imageClassName) ??\n      \"hjm-image__asset\",\n    style: { ...imageStyle, objectFit: descriptor.fit },\n    ...(descriptor.decorative ? { \"aria-hidden\": true } : {}),\n    onLoad: handleLoad,\n    onError: handleError,\n    ...(imageRef === undefined ? {} : { ref: imageRef }),\n  };\n\n  let visual: ReactNode;\n  if (status === \"error\") {\n    const fallbackLabel = resolveImageFallbackAccessibilityLabel(descriptor);\n    visual = (\n      <span\n        className=\"hjm-image__fallback\"\n        role={descriptor.decorative ? undefined : \"img\"}\n        aria-label={fallbackLabel}\n        aria-hidden={descriptor.decorative || undefined}\n      >\n        <span className=\"hjm-image__fallback-icon\" aria-hidden=\"true\">\n          {fallback ?? (\n            <Icon\n              name={imageRecipe.fallback.icon.name}\n              tone={imageRecipe.fallback.icon.tone}\n              decorative\n            />\n          )}\n        </span>\n      </span>\n    );\n  } else if (renderImage === undefined) {\n    const { ref: assetRef, ...nativeImageProps } = adapterProps;\n    visual = <img {...nativeImageProps} ref={assetRef} />;\n  } else {\n    visual = renderImage(adapterProps);\n  }\n\n  return (\n    <span\n      {...props}\n      ref={ref}\n      className={classNames(\"hjm-image\", className)}\n      data-fit={descriptor.fit}\n      data-status={status}\n      style={{\n        inlineSize: descriptor.width,\n        ...style,\n        aspectRatio: resolveImageAspectRatio(\n          descriptor.width,\n          descriptor.height,\n        ),\n      }}\n    >\n      {visual}\n    </span>\n  );\n});\n\nexport type CounterBadgeProps = Omit<HTMLAttributes<HTMLSpanElement>, \"children\"> &\n  Readonly<{\n    count: number;\n    max?: number;\n    tone?: CounterBadgeTone;\n    size?: CounterBadgeSize;\n    variant?: CounterBadgeVariant;\n    /**\n     * Says \"there is something new\" without a number. Use it where the count is\n     * unknown or not worth reading; inventing a number would be worse than\n     * saying none. The accessible name then carries the whole meaning.\n     */\n    dot?: boolean;\n    accessibilityLabel?: string;\n      /** Canonical layout-only placement. Controlled visual keys are excluded. */\n    layoutStyle?: HjmCompositionStyleProp;\n}>;\n\nexport const CounterBadge = forwardRef<HTMLSpanElement, CounterBadgeProps>(\n  function CounterBadge(\n    {\n      count,\n      max = counterBadgeRecipe.defaults.max,\n      tone = counterBadgeRecipe.defaults.tone,\n      size = counterBadgeRecipe.defaults.size,\n      variant = counterBadgeRecipe.defaults.variant,\n      dot = false,\n      accessibilityLabel,\n      className,\n      layoutStyle,\n      style,\n      ...props\n    },\n    ref,\n  ) {\n    const label = formatCounterBadgeCount(count, max);\n    if (accessibilityLabel !== undefined && accessibilityLabel.trim().length === 0) {\n      throw new TypeError(\"CounterBadge accessibilityLabel must not be empty\");\n    }\n    if (dot && accessibilityLabel === undefined) {\n      // A dot with no name is a decoration that nobody can read.\n      throw new TypeError(\"CounterBadge dot requires an accessibilityLabel\");\n    }\n    if (label === null) return null;\n    return (\n      <span\n        {...props}\n        ref={ref}\n        className={classNames(\"hjm-counter-badge\", className)}\n        data-tone={tone}\n        data-size={size}\n        data-variant={variant}\n        data-dot={dot || undefined}\n        style={dot ? { ...style, ...layoutStyle, \"--hjm-counter-dot-size\": `${counterBadgeRecipe.dotSize}px` } as typeof style : { ...style, ...layoutStyle }}\n        aria-hidden={accessibilityLabel === undefined || undefined}\n        aria-label={accessibilityLabel}\n      >\n        {dot ? null : label}\n      </span>\n    );\n  },\n);\n"]}
+{"version":3,"file":"supplemental-display.js","sourceRoot":"","sources":["../src/supplemental-display.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  getIconTransform,\n  resolveIconDescriptor,\n  type IconDescriptor,\n  type SemanticIconName,\n} from \"@hjmds/design-contracts/components/icon\";\nimport {\n  imageRecipe,\n  resolveImageAspectRatio,\n  resolveImageDescriptor,\n  resolveImageFallbackAccessibilityLabel,\n  type ImageDescriptor,\n  type ImageLoadStatus,\n} from \"@hjmds/design-contracts/components/image\";\nimport {\n  counterBadgeRecipe,\n  formatCounterBadgeCount,\n  iconRecipe,\n  type CounterBadgeSize,\n  type CounterBadgeTone,\n  type CounterBadgeVariant,\n} from \"@hjmds/design-contracts/recipes\";\nimport {\n  forwardRef,\n  useState,\n  type CSSProperties,\n  type HTMLAttributes,\n  type ImgHTMLAttributes,\n  type ReactElement,\n  type ReactEventHandler,\n  type ReactNode,\n  type Ref,\n  type SVGAttributes,\n} from \"react\";\nimport { classNames } from \"./internal.js\";\nimport { useOptionalHjmTheme } from \"./provider.js\";\nimport type { HjmCompositionStyleProp } from \"./composition-style.js\";\n\n/** Internal, dependency-free semantic glyph registry. All marks share one 24px stroke grid. */\nconst iconPaths = {\n  add: \"M12 5v14M5 12h14\",\n  ai: \"M12 2l1.2 4.1L17 8l-3.8 1.9L12 14l-1.2-4.1L7 8l3.8-1.9L12 2ZM19 14l.7 2.3L22 17.5l-2.3 1.2L19 21l-.7-2.3-2.3-1.2 2.3-1.2L19 14Z\",\n  alert: \"M12 3 2.7 20h18.6L12 3Zm0 6v4m0 3h.01\",\n  back: \"M15 18 9 12l6-6M9 12h10\",\n  calendar: \"M5 4h14a2 2 0 0 1 2 2v13a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2Zm2-2v4m10-4v4M3 9h18\",\n  check: \"m5 12 4 4L19 6\",\n  chevronDown: \"m6 9 6 6 6-6\",\n  chevronEnd: \"m9 6 6 6-6 6\",\n  chevronStart: \"m15 6-6 6 6 6\",\n  chevronUp: \"m6 15 6-6 6 6\",\n  close: \"M6 6l12 12M18 6 6 18\",\n  compare: \"M8 7h11m0 0-3-3m3 3-3 3M16 17H5m0 0 3-3m-3 3 3 3\",\n  copy: \"M8 8h11a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2H10a2 2 0 0 1-2-2V8Zm8 0V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v9a2 2 0 0 0 2 2h3\",\n  delete: \"M4 7h16M9 7V4h6v3m3 0-1 14H7L6 7m4 4v6m4-6v6\",\n  download: \"M12 3v12m0 0 5-5m-5 5-5-5M4 19v2h16v-2\",\n  edit: \"m4 16-1 5 5-1L19 9l-4-4L4 16Zm9-9 4 4\",\n  error: \"M12 22a10 10 0 1 0 0-20 10 10 0 0 0 0 20Zm0-14v5m0 3h.01\",\n  favorite: \"M20.8 4.6a5.5 5.5 0 0 0-7.8 0L12 5.7l-1.1-1.1a5.5 5.5 0 0 0-7.8 7.8L12 21l8.8-8.6a5.5 5.5 0 0 0 0-7.8Z\",\n  filter: \"M3 5h18l-7 8v6l-4 2v-8L3 5Z\",\n  forward: \"m9 6 6 6-6 6m6-6H5\",\n  help: \"M12 22a10 10 0 1 0 0-20 10 10 0 0 0 0 20Zm-3-13a3 3 0 1 1 4.7 2.5c-1 .7-1.7 1.2-1.7 2.5m0 3h.01\",\n  home: \"m3 11 9-8 9 8v10h-6v-6H9v6H3V11Z\",\n  info: \"M12 22a10 10 0 1 0 0-20 10 10 0 0 0 0 20Zm0-11v6m0-10h.01\",\n  lock: \"M6 10h12v11H6V10Zm3 0V7a3 3 0 0 1 6 0v3\",\n  menu: \"M4 6h16M4 12h16M4 18h16\",\n  more: \"M5 12h.01M12 12h.01M19 12h.01\",\n  notifications: \"M18 8a6 6 0 0 0-12 0c0 7-3 7-3 9h18c0-2-3-2-3-9Zm-8 12h4\",\n  pause: \"M8 5v14m8-14v14\",\n  play: \"m8 5 11 7-11 7V5Z\",\n  refresh: \"M20 7v5h-5M4 17v-5h5m10.5-3A8 8 0 0 0 6 6l-2 2m.5 7A8 8 0 0 0 18 18l2-2\",\n  search: \"m21 21-4.4-4.4M19 11a8 8 0 1 1-16 0 8 8 0 0 1 16 0Z\",\n  settings: \"M12 15.5a3.5 3.5 0 1 0 0-7 3.5 3.5 0 0 0 0 7Zm7.4-3.5 2-1.5-2-3.5-2.4 1a8 8 0 0 0-2-1.2L14.7 4h-4l-.4 2.8A8 8 0 0 0 8 8L5.6 7l-2 3.5 2 1.5a8 8 0 0 0 0 2l-2 1.5 2 3.5L8 18a8 8 0 0 0 2.3 1.2l.4 2.8h4l.3-2.8A8 8 0 0 0 17 18l2.4 1 2-3.5-2-1.5a8 8 0 0 0 0-2Z\",\n  share: \"M18 8a3 3 0 1 0 0-6 3 3 0 0 0 0 6ZM6 15a3 3 0 1 0 0-6 3 3 0 0 0 0 6Zm12 9a3 3 0 1 0 0-6 3 3 0 0 0 0 6ZM8.6 16.5l6.8 4M15.4 6.5l-6.8 4\",\n  success: \"M12 22a10 10 0 1 0 0-20 10 10 0 0 0 0 20Zm-5-10 3 3 7-7\",\n  trendDown: \"M3 7l7 7 4-4 7 7m0 0v-6m0 6h-6\",\n  trendFlat: \"M4 12h16m0 0-4-4m4 4-4 4\",\n  trendUp: \"M3 17l7-7 4 4 7-7m0 0v6m0-6h-6\",\n  upload: \"M12 21V9m0 0-5 5m5-5 5 5M4 5V3h16v2\",\n  user: \"M12 12a4 4 0 1 0 0-8 4 4 0 0 0 0 8Zm-8 9a8 8 0 0 1 16 0\",\n  users: \"M9 11a4 4 0 1 0 0-8 4 4 0 0 0 0 8Zm-7 10a7 7 0 0 1 14 0m1-16a4 4 0 0 1 0 7m0 3a6 6 0 0 1 5 6\",\n  visibility: \"M2 12s4-7 10-7 10 7 10 7-4 7-10 7S2 12 2 12Zm10 3a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z\",\n  visibilityOff: \"m3 3 18 18M10.6 5.2A9 9 0 0 1 12 5c6 0 10 7 10 7a17 17 0 0 1-2.1 3M6.6 6.6C3.8 8.5 2 12 2 12s4 7 10 7a9 9 0 0 0 3.4-.7M9.9 9.9a3 3 0 0 0 4.2 4.2\",\n  warning: \"M12 3 2.7 20h18.6L12 3Zm0 6v4m0 3h.01\",\n} as const satisfies Record<SemanticIconName, string>;\n\nexport type IconProps = Omit<\n  SVGAttributes<SVGSVGElement>,\n  \"children\" | \"color\"\n> & IconDescriptor & Readonly<{\n  /** Optional glyph inside the existing 24-unit SVG frame; HJM owns semantics. */\n  renderGlyph?: (props: Readonly<{ name: SemanticIconName; size: number; color: string; strokeWidth: number }>) => ReactNode;\n}>;\n\nexport const Icon = forwardRef<SVGSVGElement, IconProps>(function Icon(\n  {\n    name,\n    size,\n    tone,\n    weight,\n    directionality,\n    decorative,\n    accessibilityLabel,\n    renderGlyph,\n    className,\n    style,\n    ...props\n  },\n  ref,\n) {\n  const descriptor = resolveIconDescriptor({\n    name,\n    ...(size === undefined ? {} : { size }),\n    ...(tone === undefined ? {} : { tone }),\n    ...(weight === undefined ? {} : { weight }),\n    ...(directionality === undefined ? {} : { directionality }),\n    ...(decorative === undefined ? {} : { decorative }),\n    ...(accessibilityLabel === undefined ? {} : { accessibilityLabel }),\n  } as IconDescriptor);\n  const theme = useOptionalHjmTheme();\n  const transform = getIconTransform(\n    descriptor.directionality,\n    theme?.environment.direction ?? \"ltr\",\n  );\n  const dimension = iconRecipe.sizes[descriptor.size];\n  return (\n    <svg\n      {...props}\n      ref={ref}\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      className={classNames(\"hjm-icon\", className)}\n      data-name={descriptor.name}\n      data-size={descriptor.size}\n      data-tone={descriptor.tone}\n      data-weight={descriptor.weight}\n      data-transform={transform}\n      width={dimension}\n      height={dimension}\n      stroke=\"currentColor\"\n      strokeWidth={iconRecipe.weights[descriptor.weight]}\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      role={descriptor.decorative ? undefined : \"img\"}\n      aria-hidden={descriptor.decorative || undefined}\n      aria-label={descriptor.decorative ? undefined : descriptor.accessibilityLabel}\n      focusable=\"false\"\n      style={style}\n    >\n      {renderGlyph?.({ name: descriptor.name, size: 24, color: \"currentColor\", strokeWidth: iconRecipe.weights[descriptor.weight] }) ?? <path d={iconPaths[descriptor.name]} />}\n    </svg>\n  );\n});\n\ntype ImageElementProps = Omit<\n  ImgHTMLAttributes<HTMLImageElement>,\n  | \"alt\"\n  | \"aria-hidden\"\n  | \"aria-label\"\n  | \"children\"\n  | \"className\"\n  | \"height\"\n  | \"onError\"\n  | \"onLoad\"\n  | \"role\"\n  | \"src\"\n  | \"style\"\n  | \"width\"\n>;\n\n/** Canonical props handed to a framework adapter such as `next/image`. */\nexport type ImageAdapterProps = ImageElementProps &\n  Readonly<{\n    src: string;\n    alt: string;\n    width: number;\n    height: number;\n    className?: string;\n    style: CSSProperties;\n    \"aria-hidden\"?: true;\n    onLoad: ReactEventHandler<HTMLImageElement>;\n    onError: ReactEventHandler<HTMLImageElement>;\n    ref?: Ref<HTMLImageElement>;\n  }>;\n\ntype ImageRootProps = Omit<\n  HTMLAttributes<HTMLSpanElement>,\n  | \"aria-hidden\"\n  | \"aria-label\"\n  | \"aria-labelledby\"\n  | \"children\"\n  | \"onError\"\n  | \"onLoad\"\n  | \"role\"\n>;\n\nexport type ImageProps = ImageRootProps &\n  ImageDescriptor &\n  Readonly<{\n    /** Additional native `<img>` props shared with the framework adapter. */\n    imageProps?: ImageElementProps &\n      Readonly<{ className?: string; style?: CSSProperties }>;\n    /**\n     * Receives the complete accessible image contract. The adapter must pass\n     * these props to its underlying image element so HJM can observe failure.\n     */\n    renderImage?: (props: ImageAdapterProps) => ReactElement;\n    /** Visual content only; HJM keeps the fallback's accessible name. */\n    fallback?: ReactNode;\n    imageRef?: Ref<HTMLImageElement>;\n    onLoad?: ReactEventHandler<HTMLImageElement>;\n    onError?: ReactEventHandler<HTMLImageElement>;\n    onLoadStatusChange?: (status: Extract<ImageLoadStatus, \"loaded\" | \"error\">) => void;\n  }>;\n\ntype ImageState = Readonly<{\n  src: string;\n  status: Extract<ImageLoadStatus, \"loading\" | \"loaded\" | \"error\">;\n}>;\n\n/** Intrinsic-size image with canonical alt semantics and an accessible fallback. */\nexport const Image = forwardRef<HTMLSpanElement, ImageProps>(function Image(\n  {\n    src,\n    width,\n    height,\n    fit,\n    decorative,\n    accessibilityLabel,\n    imageProps,\n    renderImage,\n    fallback,\n    imageRef,\n    onLoad,\n    onError,\n    onLoadStatusChange,\n    className,\n    style,\n    ...props\n  },\n  ref,\n) {\n  const descriptor = resolveImageDescriptor({\n    src,\n    width,\n    height,\n    ...(fit === undefined ? {} : { fit }),\n    ...(decorative === undefined ? {} : { decorative }),\n    ...(accessibilityLabel === undefined ? {} : { accessibilityLabel }),\n  } as ImageDescriptor);\n  const [state, setState] = useState<ImageState>({\n    src: descriptor.src,\n    status: \"loading\",\n  });\n  const status = state.src === descriptor.src ? state.status : \"loading\";\n  const {\n    className: imageClassName,\n    style: imageStyle,\n    ...restImageProps\n  } = imageProps ?? {};\n\n  const handleLoad: ReactEventHandler<HTMLImageElement> = (event) => {\n    setState({ src: descriptor.src, status: \"loaded\" });\n    onLoadStatusChange?.(\"loaded\");\n    onLoad?.(event);\n  };\n  const handleError: ReactEventHandler<HTMLImageElement> = (event) => {\n    setState({ src: descriptor.src, status: \"error\" });\n    onLoadStatusChange?.(\"error\");\n    onError?.(event);\n  };\n  const adapterProps: ImageAdapterProps = {\n    ...restImageProps,\n    src: descriptor.src,\n    alt: descriptor.decorative ? \"\" : descriptor.accessibilityLabel,\n    width: descriptor.width,\n    height: descriptor.height,\n    className: classNames(\"hjm-image__asset\", imageClassName) ??\n      \"hjm-image__asset\",\n    style: { ...imageStyle, objectFit: descriptor.fit },\n    ...(descriptor.decorative ? { \"aria-hidden\": true } : {}),\n    onLoad: handleLoad,\n    onError: handleError,\n    ...(imageRef === undefined ? {} : { ref: imageRef }),\n  };\n\n  let visual: ReactNode;\n  if (status === \"error\") {\n    const fallbackLabel = resolveImageFallbackAccessibilityLabel(descriptor);\n    visual = (\n      <span\n        className=\"hjm-image__fallback\"\n        role={descriptor.decorative ? undefined : \"img\"}\n        aria-label={fallbackLabel}\n        aria-hidden={descriptor.decorative || undefined}\n      >\n        <span className=\"hjm-image__fallback-icon\" aria-hidden=\"true\">\n          {fallback ?? (\n            <Icon\n              name={imageRecipe.fallback.icon.name}\n              tone={imageRecipe.fallback.icon.tone}\n              decorative\n            />\n          )}\n        </span>\n      </span>\n    );\n  } else if (renderImage === undefined) {\n    const { ref: assetRef, ...nativeImageProps } = adapterProps;\n    visual = <img {...nativeImageProps} ref={assetRef} />;\n  } else {\n    visual = renderImage(adapterProps);\n  }\n\n  return (\n    <span\n      {...props}\n      ref={ref}\n      className={classNames(\"hjm-image\", className)}\n      data-fit={descriptor.fit}\n      data-status={status}\n      style={{\n        inlineSize: descriptor.width,\n        ...style,\n        aspectRatio: resolveImageAspectRatio(\n          descriptor.width,\n          descriptor.height,\n        ),\n      }}\n    >\n      {visual}\n    </span>\n  );\n});\n\nexport type CounterBadgeProps = Omit<HTMLAttributes<HTMLSpanElement>, \"children\"> &\n  Readonly<{\n    count: number;\n    max?: number;\n    tone?: CounterBadgeTone;\n    size?: CounterBadgeSize;\n    variant?: CounterBadgeVariant;\n    /**\n     * Says \"there is something new\" without a number. Use it where the count is\n     * unknown or not worth reading; inventing a number would be worse than\n     * saying none. The accessible name then carries the whole meaning.\n     */\n    dot?: boolean;\n    accessibilityLabel?: string;\n      /** Canonical layout-only placement. Controlled visual keys are excluded. */\n    layoutStyle?: HjmCompositionStyleProp;\n}>;\n\nexport const CounterBadge = forwardRef<HTMLSpanElement, CounterBadgeProps>(\n  function CounterBadge(\n    {\n      count,\n      max = counterBadgeRecipe.defaults.max,\n      tone = counterBadgeRecipe.defaults.tone,\n      size = counterBadgeRecipe.defaults.size,\n      variant = counterBadgeRecipe.defaults.variant,\n      dot = false,\n      accessibilityLabel,\n      className,\n      layoutStyle,\n      style,\n      ...props\n    },\n    ref,\n  ) {\n    const label = formatCounterBadgeCount(count, max);\n    if (accessibilityLabel !== undefined && accessibilityLabel.trim().length === 0) {\n      throw new TypeError(\"CounterBadge accessibilityLabel must not be empty\");\n    }\n    if (dot && accessibilityLabel === undefined) {\n      // A dot with no name is a decoration that nobody can read.\n      throw new TypeError(\"CounterBadge dot requires an accessibilityLabel\");\n    }\n    if (label === null) return null;\n    return (\n      <span\n        {...props}\n        ref={ref}\n        className={classNames(\"hjm-counter-badge\", className)}\n        data-tone={tone}\n        data-size={size}\n        data-variant={variant}\n        data-dot={dot || undefined}\n        style={dot ? { ...style, ...layoutStyle, \"--hjm-counter-dot-size\": `${counterBadgeRecipe.dotSize}px` } as typeof style : { ...style, ...layoutStyle }}\n        aria-hidden={accessibilityLabel === undefined || undefined}\n        aria-label={accessibilityLabel}\n      >\n        {dot ? null : label}\n      </span>\n    );\n  },\n);\n"]}

package/dist/table-sort-button.d.ts

@@ -0,0 +1,15 @@
+import type { ReactNode } from "react";
+import type { DataTableSortDirection } from "@hjmds/design-contracts/components/data-table";
+export declare function TableSortButton({ header, direction, glyphs, className, accessibleName, onSort }: Readonly<{
+    header: ReactNode;
+    direction?: DataTableSortDirection | null;
+    glyphs: Readonly<{
+        ascending: string;
+        descending: string;
+        none: string;
+    }>;
+    className: string;
+    accessibleName?: string;
+    onSort: () => void;
+}>): import("react").JSX.Element;
+//# sourceMappingURL=table-sort-button.d.ts.map

package/dist/table-sort-button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"table-sort-button.d.ts","sourceRoot":"","sources":["../src/table-sort-button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,+CAA+C,CAAC;AAI5F,wBAAgB,eAAe,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,EAAE,EAAE,QAAQ,CAAC;IACzG,MAAM,EAAE,SAAS,CAAC;IAAC,SAAS,CAAC,EAAE,sBAAsB,GAAG,IAAI,CAAC;IAC7D,MAAM,EAAE,QAAQ,CAAC;QAAE,SAAS,EAAE,MAAM,CAAC;QAAC,UAAU,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAC1E,SAAS,EAAE,MAAM,CAAC;IAAC,cAAc,CAAC,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,IAAI,CAAC;CAChE,CAAC,+BAKD"}

package/dist/table-sort-button.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+// Both public tables need the same native button/hidden glyph semantics. Keep
+// their two-state/three-state policies and CSS separate rather than merging APIs.
+export function TableSortButton({ header, direction, glyphs, className, accessibleName, onSort }) {
+    return _jsxs("button", { type: "button", className: className, "aria-label": accessibleName, onClick: onSort, children: [_jsx("span", { children: header }), _jsx("span", { "aria-hidden": "true", children: direction ? glyphs[direction] : glyphs.none })] });
+}
+//# sourceMappingURL=table-sort-button.js.map

package/dist/table-sort-button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"table-sort-button.js","sourceRoot":"","sources":["../src/table-sort-button.tsx"],"names":[],"mappings":";AAGA,8EAA8E;AAC9E,kFAAkF;AAClF,MAAM,UAAU,eAAe,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,EAI5F;IACA,OAAO,kBAAQ,IAAI,EAAC,QAAQ,EAAC,SAAS,EAAE,SAAS,gBAAc,cAAc,EAAE,OAAO,EAAE,MAAM,aAC5F,yBAAO,MAAM,GAAQ,EACrB,8BAAkB,MAAM,YAAE,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,GAAQ,IACtE,CAAC;AACZ,CAAC","sourcesContent":["import type { ReactNode } from \"react\";\nimport type { DataTableSortDirection } from \"@hjmds/design-contracts/components/data-table\";\n\n// Both public tables need the same native button/hidden glyph semantics. Keep\n// their two-state/three-state policies and CSS separate rather than merging APIs.\nexport function TableSortButton({ header, direction, glyphs, className, accessibleName, onSort }: Readonly<{\n  header: ReactNode; direction?: DataTableSortDirection | null;\n  glyphs: Readonly<{ ascending: string; descending: string; none: string }>;\n  className: string; accessibleName?: string; onSort: () => void;\n}>) {\n  return <button type=\"button\" className={className} aria-label={accessibleName} onClick={onSort}>\n    <span>{header}</span>\n    <span aria-hidden=\"true\">{direction ? glyphs[direction] : glyphs.none}</span>\n  </button>;\n}\n"]}

package/dist/task-list.d.ts

@@ -0,0 +1,16 @@
+import type { ReactNode } from 'react';
+import { type TaskItem } from '@hjmds/design-contracts/task-list';
+export 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;
+}>;
+/** Canonical Checkbox/List own semantics; optional collection composition keeps drag peers out of this entry. */
+export declare function TaskList({ label, items, onCompletedChange, disabled, emptyContent, renderCollection }: TaskListProps): import("react").JSX.Element;
+//# sourceMappingURL=task-list.d.ts.map

package/dist/task-list.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"task-list.d.ts","sourceRoot":"","sources":["../src/task-list.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAI,EAAC,SAAS,EAAC,MAAI,OAAO,CAAC;AAClC,OAAM,EAAe,KAAK,QAAQ,EAAC,MAAI,mCAAmC,CAAC;AAE3E,MAAM,MAAM,aAAa,GAAC,QAAQ,CAAC;IAAC,KAAK,EAAC,MAAM,CAAC;IAAA,KAAK,EAAC,SAAS,QAAQ,EAAE,CAAC;IAAA,iBAAiB,EAAC,CAAC,EAAE,EAAC,MAAM,EAAC,SAAS,EAAC,OAAO,KAAG,IAAI,CAAC;IAAA,QAAQ,CAAC,EAAC,OAAO,CAAC;IAAA,YAAY,CAAC,EAAC,SAAS,CAAC;IAAA,gBAAgB,CAAC,EAAC,CAAC,OAAO,EAAC,QAAQ,CAAC;QAAC,KAAK,EAAC,SAAS,QAAQ,EAAE,CAAC;QAAA,UAAU,EAAC,CAAC,IAAI,EAAC,QAAQ,KAAG,SAAS,CAAA;KAAC,CAAC,KAAG,SAAS,CAAA;CAAC,CAAC,CAAC;AAChS,iHAAiH;AACjH,wBAAgB,QAAQ,CAAC,EAAC,KAAK,EAAC,KAAK,EAAC,iBAAiB,EAAC,QAAc,EAAC,YAAY,EAAC,gBAAgB,EAAC,EAAC,aAAa,+BAKlH"}

package/dist/task-list.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx, 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 }) {
+    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 }); };
+    if (items.length === 0)
+        return _jsx(List, { label: label, children: emptyContent });
+    if (renderCollection)
+        return _jsx(_Fragment, { children: renderCollection({ items, renderItem }) });
+    return _jsx(List, { label: label, appearance: "grouped", children: items.map(item => _jsx("div", { children: renderItem(item) }, item.id)) });
+}
+//# sourceMappingURL=task-list.js.map

package/dist/task-list.js.map

@@ -0,0 +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;AAE7E,iHAAiH;AACjH,MAAM,UAAU,QAAQ,CAAC,EAAC,KAAK,EAAC,KAAK,EAAC,iBAAiB,EAAC,QAAQ,GAAC,KAAK,EAAC,YAAY,EAAC,gBAAgB,EAAe;IAAE,aAAa,CAAC,KAAK,CAAC,CAAC;IAAA,IAAG,CAAC,KAAK,CAAC,IAAI,EAAE;QAAC,MAAM,IAAI,SAAS,CAAC,kCAAkC,CAAC,CAAC;IAClN,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,YAAG,YAAY,GAAQ,CAAC;IACrE,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,YAAE,KAAK,CAAC,GAAG,CAAC,IAAI,CAAA,EAAE,CAAA,wBAAoB,UAAU,CAAC,IAAI,CAAC,IAA1B,IAAI,CAAC,EAAE,CAA0B,CAAC,GAAQ,CAAC;AACvH,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';\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 Checkbox/List own semantics; optional collection composition keeps drag peers out of this entry. */\nexport function TaskList({label,items,onCompletedChange,disabled=false,emptyContent,renderCollection}: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}>{emptyContent}</List>;\n if(renderCollection)return <>{renderCollection({items,renderItem})}</>;\n return <List label={label} appearance=\"grouped\">{items.map(item=><div key={item.id}>{renderItem(item)}</div>)}</List>;\n}\n"]}

package/dist/theme.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../src/theme.ts"],"names":[],"mappings":"AAeA,OAAO,EAEL,KAAK,yBAAyB,EAC/B,MAAM,2DAA2D,CAAC;AAWnE,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,CA0Hf"}
+{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../src/theme.ts"],"names":[],"mappings":"AAeA,OAAO,EAEL,KAAK,yBAAyB,EAC/B,MAAM,2DAA2D,CAAC;AAWnE,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,CAmIf"}

package/dist/theme.js

@@ -112,6 +112,15 @@ export function createHjmThemeStyle(value) {
         if (ratio !== null)
             style[`--hjm-sheet-size-${name}`] = `${ratio * 100}dvh`;
     }
+    // Toast badge/action colours resolve from the recipe so Web and Native share one tone table (1.10.0).
+    for (const [tone, contract] of Object.entries(toastRecipe.tones)) {
+        style[`--hjm-toast-accent-${tone}`] = resolveColorReference(contract.accent, palette);
+        style[`--hjm-toast-badge-${tone}`] = resolveColorReference(contract.badge, palette);
+    }
+    style["--hjm-toast-badge-size"] = `${toastRecipe.icon.badgeDiameter}px`;
+    style["--hjm-toast-action-background"] = resolveColorReference(toastRecipe.action.background, palette);
+    style["--hjm-toast-action-color"] = resolveColorReference(toastRecipe.action.color, palette);
+    style["--hjm-toast-description-color"] = resolveColorReference(toastRecipe.description.color, palette);
     const toastExit = toastRecipe.transition.web.exit;
     style["--hjm-toast-exit-duration"] = environment.reducedMotion ? "0ms" : `${toastExit.duration}ms`;
     style["--hjm-toast-exit-easing"] = `cubic-bezier(${easing[toastExit.easing].join(", ")})`;

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  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  dialogRecipe,\n  listRowRecipe,\n  sheetRecipe,\n  skeletonRecipe,\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  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  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  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 {\n  backdrop,\n  control,\n  easing,\n  fontFamily,\n  fontWeight,\n  motion,\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  dialogRecipe,\n  listRowRecipe,\n  sheetRecipe,\n  skeletonRecipe,\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  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  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/dist/thinking-orb.d.ts

@@ -5,5 +5,5 @@ export type ThinkingOrbProps = ThinkingOrbOptions & Readonly<{
     style?: CSSProperties;
 }>;
 /** Optional AI status presentation; ordinary loading retains Spinner. */
-export declare function ThinkingOrb({ state, size, label, speed, paused, active, className, style }: ThinkingOrbProps): import("react").JSX.Element;
+export declare function ThinkingOrb({ state, appearance, size, label, speed, paused, active, className, style }: ThinkingOrbProps): import("react").JSX.Element;
 //# sourceMappingURL=thinking-orb.d.ts.map

package/dist/thinking-orb.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"thinking-orb.d.ts","sourceRoot":"","sources":["../src/thinking-orb.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAqB,KAAK,aAAa,EAAE,MAAM,OAAO,CAAC;AAC9D,OAAO,EAAyF,KAAK,kBAAkB,EAAE,MAAM,iDAAiD,CAAC;AAGjL,MAAM,MAAM,gBAAgB,GAAG,kBAAkB,GAAG,QAAQ,CAAC;IAAE,SAAS,CAAC,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,aAAa,CAAA;CAAE,CAAC,CAAC;AAC5G,yEAAyE;AACzE,wBAAgB,WAAW,CAAC,EAAE,KAAiB,EAAE,IAAS,EAAE,KAAK,EAAE,KAAS,EAAE,MAAc,EAAE,MAAa,EAAE,SAAS,EAAE,KAAK,EAAE,EAAE,gBAAgB,+BAgEhJ"}
+{"version":3,"file":"thinking-orb.d.ts","sourceRoot":"","sources":["../src/thinking-orb.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAqB,KAAK,aAAa,EAAE,MAAM,OAAO,CAAC;AAC9D,OAAO,EAAyF,KAAK,kBAAkB,EAAE,MAAM,iDAAiD,CAAC;AAGjL,MAAM,MAAM,gBAAgB,GAAG,kBAAkB,GAAG,QAAQ,CAAC;IAAE,SAAS,CAAC,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,aAAa,CAAA;CAAE,CAAC,CAAC;AAC5G,yEAAyE;AACzE,wBAAgB,WAAW,CAAC,EAAE,KAAiB,EAAE,UAAoB,EAAE,IAAS,EAAE,KAAK,EAAE,KAAS,EAAE,MAAc,EAAE,MAAa,EAAE,SAAS,EAAE,KAAK,EAAE,EAAE,gBAAgB,+BAgEtK"}

package/dist/thinking-orb.js

@@ -3,8 +3,8 @@ import { useEffect, useRef } from "react";
 import { buildThinkingOrbFrame, createThinkingOrbClock, thinkingOrbRecipe, validateThinkingOrb } from "@hjmds/design-contracts/components/thinking-orb";
 import { useHjmTheme } from "./provider.js";
 /** Optional AI status presentation; ordinary loading retains Spinner. */
-export function ThinkingOrb({ state = "working", size = 64, label, speed = 1, paused = false, active = true, className, style }) {
-    validateThinkingOrb({ state, size, speed, label });
+export function ThinkingOrb({ state = "working", appearance = "state", size = 64, label, speed = 1, paused = false, active = true, className, style }) {
+    validateThinkingOrb({ state, appearance, size, speed, label });
     const theme = useHjmTheme();
     const ink = theme.palette.theme.text;
     const reduced = theme.environment.reducedMotion;
@@ -20,7 +20,7 @@ export function ThinkingOrb({ state = "working", size = 64, label, speed = 1, pa
         let visible = typeof IntersectionObserver === "undefined";
         let disposed = false;
         const draw = () => {
-            const frame = buildThinkingOrbFrame(state, size, reduced ? thinkingOrbRecipe.motion.staticTime : clock.current.time);
+            const frame = buildThinkingOrbFrame(state, size, reduced ? thinkingOrbRecipe.motion.staticTime : clock.current.time, appearance);
             ctx.setTransform(ratio, 0, 0, ratio, 0, 0);
             ctx.clearRect(0, 0, size, size);
             ctx.fillStyle = ctx.strokeStyle = ink;
@@ -80,7 +80,7 @@ export function ThinkingOrb({ state = "working", size = 64, label, speed = 1, pa
             document.removeEventListener("visibilitychange", sync);
             window.removeEventListener("resize", resize);
         };
-    }, [state, size, speed, active, paused, reduced, ink]);
+    }, [state, appearance, size, speed, active, paused, reduced, ink]);
     return _jsxs("span", { className: className, "data-hjm-thinking-orb": state, role: "status", "aria-live": "polite", "aria-atomic": "true", style: { display: "inline-flex", ...style }, children: [_jsx("canvas", { ref: canvasRef, "aria-hidden": "true", style: { width: size, height: size, display: "block" } }), _jsx("span", { style: { position: "absolute", width: 1, height: 1, padding: 0, margin: -1, overflow: "hidden", clipPath: "inset(50%)", whiteSpace: "nowrap", border: 0 }, children: label })] });
 }
 //# sourceMappingURL=thinking-orb.js.map