@hjmds/react 1.41.2 → 1.43.0

package/dist/field-group.js.map

@@ -1 +1 @@
-{"version":3,"file":"field-group.js","sourceRoot":"","sources":["../src/field-group.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useId, useLayoutEffect, useRef, type ReactNode } from \"react\";\nimport { createFieldGroupEditSession, resolveFieldGroup, fieldGroupRecipe, type FieldGroupLayout, type FieldGroupDescriptor } from \"@hjmds/design-contracts/field-group\";\nimport type { HjmCompositionStyleProp } from \"./composition-style.js\";\nimport { Text } from \"./layout.js\";\n\nexport type FieldGroupBinding = Readonly<{\n  id: string;\n  controlProps: Readonly<{ id: string; label: string; disabled: boolean; \"aria-invalid\": boolean; \"aria-describedby\"?: string }>;\n  guardChange: <Args extends unknown[]>(callback: (...args: Args) => void) => (...args: Args) => void;\n}>;\nexport type FieldGroupProps = Readonly<{\n  descriptor: FieldGroupDescriptor;\n  renderField: (field: FieldGroupBinding) => ReactNode;\n  layout?: FieldGroupLayout;\n  className?: string;\n  layoutStyle?: HjmCompositionStyleProp;\n}>;\n\n/** Named related fields inside an existing form; never creates a submission boundary. */\nexport function FieldGroup({ descriptor, renderField, layout = fieldGroupRecipe.defaults.layout, className, layoutStyle }: FieldGroupProps) {\n  const groupId = useId();\n  const resolved = resolveFieldGroup(descriptor);\n  const recipe = fieldGroupRecipe;\n  const session = useRef(createFieldGroupEditSession(resolved.fields));\n  useLayoutEffect(() => { session.current.update(resolved.fields); return () => session.current.suspend(); }, [resolved.fields]);\n  // fieldGroupRecipe.inline.wrap \"all-or-none\" without measuring: below the width that fits every part, the\n  // flex-basis turns huge and each part takes a full row; above it, parts share the row up to maxWidth.\n  const scaled = (px: number) => `(${px}px * var(--hjm-text-scale, 1))`;\n  const gapCss = `var(--hjm-space-${recipe.gap})`;\n  const fitsAll = `(${resolved.fields.length} * ${scaled(recipe.inline.minWidth)} + ${Math.max(0, resolved.fields.length - 1)} * ${gapCss})`;\n  const inlinePart = { flexGrow: 1, flexBasis: `calc((${fitsAll} - 100%) * 999)`, maxInlineSize: `max(calc${scaled(recipe.inline.maxWidth)}, calc((100% - ${fitsAll}) * -999))` };\n  const groupSupport = [resolved.description ? `${groupId}-description` : undefined, resolved.error ? `${groupId}-error` : undefined].filter(Boolean).join(\" \") || undefined;\n  return <fieldset className={className} disabled={resolved.disabled} aria-describedby={groupSupport}\n    style={{ border: 0, margin: 0, padding: 0, minInlineSize: 0, ...layoutStyle }}>\n    <legend style={{ maxInlineSize: \"100%\", overflowWrap: \"anywhere\", paddingInline: 0, marginBlockEnd: `var(--hjm-space-${recipe.headingGap})` }}><Text variant={recipe.heading.textVariant} emphasis={recipe.heading.emphasis}>{resolved.label}</Text></legend>\n    {/* Same rhythm as Native's View gap: legend→description→error→fields at headingGap, support under a field at\n        supportGap. Raw <p> carried browser margins that made Web gaps about 1.5x Native's (2026-10-17 review). */}\n    <div style={{ display: \"grid\", gap: `var(--hjm-space-${recipe.headingGap})`, minInlineSize: 0 }}>\n    {resolved.description ? <Text as=\"p\" id={`${groupId}-description`}>{resolved.description}</Text> : null}\n    {resolved.error ? <Text as=\"p\" id={`${groupId}-error`} role=\"alert\" tone=\"danger\">{resolved.error}</Text> : null}\n    <div style={{ display: layout === \"inline\" ? \"flex\" : \"grid\", ...(layout === \"inline\" ? { flexWrap: \"wrap\" } : {}), gap: `var(--hjm-space-${recipe.gap})`, minInlineSize: 0 }}>\n      {resolved.fields.map(field => {\n        // Encode product ids rather than indexes: reordering must preserve control identity and focus.\n        const id = `${groupId}-field-${encodeURIComponent(field.id)}`;\n        const supportId = (message: typeof field.support[number]) => message.scope === \"group\" ? `${groupId}-${message.kind}` : `${id}-${message.kind}`;\n        const support = field.support.map(supportId).join(\" \");\n        return <div key={field.id} style={{ display: \"grid\", gap: `var(--hjm-space-${recipe.supportGap})`, alignContent: \"start\", minInlineSize: 0, ...(layout === \"inline\" ? inlinePart : {}) }}>\n          {renderField({ id: field.id, controlProps: { id, label: field.label, disabled: field.disabled, \"aria-invalid\": field.invalid,\n            ...(support ? { \"aria-describedby\": support } : {}) }, guardChange: callback => session.current.guard(field.id, callback) })}\n          {field.support.filter(message => message.scope === \"field\").map(message => <Text as=\"p\" key={message.kind} id={supportId(message)}\n            {...(message.kind === \"error\" ? { role: \"alert\", tone: \"danger\" as const } : {})}>{message.text}</Text>)}\n        </div>;\n      })}\n    </div>\n    </div>\n  </fieldset>;\n}\n"]}
+{"version":3,"file":"field-group.js","sourceRoot":"","sources":["../src/field-group.tsx"],"names":[],"mappings":"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","sourcesContent":["\"use client\";\n\nimport { useId, useLayoutEffect, useRef, type ReactNode } from \"react\";\nimport { createFieldGroupEditSession, resolveFieldGroup, fieldGroupRecipe, type FieldGroupLayout, type FieldGroupDescriptor } from \"@hjmds/design-contracts/field-group\";\nimport type { HjmCompositionStyleProp } from \"./composition-style.js\";\nimport { Text } from \"./layout.js\";\n\nexport type FieldGroupBinding = Readonly<{\n  id: string;\n  controlProps: Readonly<{ id: string; label: string; disabled: boolean; \"aria-invalid\": boolean; \"aria-describedby\"?: string }>;\n  guardChange: <Args extends unknown[]>(callback: (...args: Args) => void) => (...args: Args) => void;\n}>;\nexport type FieldGroupProps = Readonly<{\n  descriptor: FieldGroupDescriptor;\n  renderField: (field: FieldGroupBinding) => ReactNode;\n  layout?: FieldGroupLayout;\n  className?: string;\n  layoutStyle?: HjmCompositionStyleProp;\n}>;\n\n/** Named related fields inside an existing form; never creates a submission boundary. */\nexport function FieldGroup({ descriptor, renderField, layout = fieldGroupRecipe.defaults.layout, className, layoutStyle }: FieldGroupProps) {\n  const groupId = useId();\n  const resolved = resolveFieldGroup(descriptor);\n  const recipe = fieldGroupRecipe;\n  const session = useRef(createFieldGroupEditSession(resolved.fields));\n  useLayoutEffect(() => { session.current.update(resolved.fields); return () => session.current.suspend(); }, [resolved.fields]);\n  // fieldGroupRecipe.inline.wrap \"all-or-none\" without measuring: below the width that fits every part, the\n  // flex-basis turns huge and each part takes a full row; above it, parts share the row up to maxWidth.\n  const scaled = (px: number) => `(${px}px * var(--hjm-text-scale, 1))`;\n  const gapCss = `var(--hjm-space-${recipe.gap})`;\n  const fitsAll = `(${resolved.fields.length} * ${scaled(recipe.inline.minWidth)} + ${Math.max(0, resolved.fields.length - 1)} * ${gapCss})`;\n  const inlinePart = { flexGrow: 1, flexBasis: `calc((${fitsAll} - 100%) * 999)`, maxInlineSize: `max(calc${scaled(recipe.inline.maxWidth)}, calc((100% - ${fitsAll}) * -999))` };\n  const groupSupport = [resolved.description ? `${groupId}-description` : undefined, resolved.error ? `${groupId}-error` : undefined].filter(Boolean).join(\" \") || undefined;\n  return <fieldset className={className} disabled={resolved.disabled} aria-describedby={groupSupport}\n    style={{ border: 0, margin: 0, padding: 0, minInlineSize: 0, ...layoutStyle }}>\n    <legend style={{ maxInlineSize: \"100%\", overflowWrap: \"anywhere\", paddingInline: 0, marginBlockEnd: `var(--hjm-space-${recipe.headingGap})` }}><Text variant={recipe.heading.textVariant} emphasis={recipe.heading.emphasis}>{resolved.label}</Text></legend>\n    {/* Same rhythm as Native's View gap: legend→description→error→fields at headingGap, support under a field at\n        supportGap. Raw <p> carried browser margins that made Web gaps about 1.5x Native's (2026-10-17 review). */}\n    <div style={{ display: \"grid\", gap: `var(--hjm-space-${recipe.headingGap})`, minInlineSize: 0 }}>\n    {resolved.description ? <Text as=\"p\" id={`${groupId}-description`}>{resolved.description}</Text> : null}\n    {resolved.error ? <Text as=\"p\" id={`${groupId}-error`} role=\"alert\" tone=\"danger\">{resolved.error}</Text> : null}\n    <div style={{ display: layout === \"inline\" ? \"flex\" : \"grid\", ...(layout === \"inline\" ? { flexWrap: \"wrap\" } : {}), gap: `var(--hjm-space-${recipe.gap})`, minInlineSize: 0 }}>\n      {resolved.fields.map(field => {\n        // Encode product ids rather than indexes: reordering must preserve control identity and focus.\n        const id = `${groupId}-field-${encodeURIComponent(field.id)}`;\n        const supportId = (message: typeof field.support[number]) => message.scope === \"group\" ? `${groupId}-${message.kind}` : `${id}-${message.kind}`;\n        const support = field.support.map(supportId).join(\" \");\n        return <div key={field.id} style={{ display: \"grid\", gap: `var(--hjm-space-${recipe.supportGap})`, alignContent: \"start\", minInlineSize: 0, ...(layout === \"inline\" ? inlinePart : {}) }}>\n          {renderField({ id: field.id, controlProps: { id, label: field.label, disabled: field.disabled, \"aria-invalid\": field.invalid,\n            ...(support ? { \"aria-describedby\": support } : {}) }, guardChange: callback => session.current.guard(field.id, callback) })}\n          {field.support.filter(message => message.scope === \"field\").map(message => <Text as=\"p\" key={message.kind} id={supportId(message)}\n            {...(message.kind === \"error\" ? { role: \"alert\", tone: \"danger\" as const } : {})}>{message.text}</Text>)}\n        </div>;\n      })}\n    </div>\n    </div>\n  </fieldset>;\n}\n"]}

package/dist/file-picker.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"file-picker.d.ts","sourceRoot":"","sources":["../src/file-picker.tsx"],"names":[],"mappings":"AAAA,OAAO,EAML,KAAK,oBAAoB,EACzB,KAAK,yBAAyB,EAC/B,MAAM,gDAAgD,CAAC;AACxD,OAAO,EAQL,KAAK,cAAc,EACnB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,wBAAwB,CAAC;AAEtE,MAAM,MAAM,eAAe,GAAG,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,GAAG,UAAU,CAAC,GACzF,QAAQ,CAAC;IACP,UAAU,EAAE,oBAAoB,CAAC;IACjC,KAAK,EAAE,SAAS,CAAC;IACjB,WAAW,EAAE,MAAM,CAAC;IACpB,aAAa,EAAE,SAAS,CAAC;IACzB;;;;;OAKG;IACH,QAAQ,EAAE,CAAC,MAAM,EAAE,yBAAyB,EAAE,KAAK,EAAE,WAAW,CAAC,MAAM,EAAE,IAAI,CAAC,KAAK,IAAI,CAAC;IACxF,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,cAAc,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IACvD,gGAAgG;IAChG,WAAW,CAAC,EAAE,uBAAuB,CAAC;CACvC,CAAC,CAAC;AAML,sFAAsF;AACtF,eAAO,MAAM,UAAU;gBA1BP,oBAAoB;WACzB,SAAS;iBACH,MAAM;mBACJ,SAAS;IACxB;;;;;OAKG;cACO,CAAC,MAAM,EAAE,yBAAyB,EAAE,KAAK,EAAE,WAAW,CAAC,MAAM,EAAE,IAAI,CAAC,KAAK,IAAI;oBACvE,MAAM;eACX,OAAO;WACX,SAAS;YACR,SAAS;cACP,MAAM;qBACC,CAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM;IACtD,gGAAgG;kBAClF,uBAAuB;mDAgGvC,CAAC"}
+{"version":3,"file":"file-picker.d.ts","sourceRoot":"","sources":["../src/file-picker.tsx"],"names":[],"mappings":"AAEA,OAAO,EAML,KAAK,oBAAoB,EACzB,KAAK,yBAAyB,EAC/B,MAAM,gDAAgD,CAAC;AACxD,OAAO,EAQL,KAAK,cAAc,EACnB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,wBAAwB,CAAC;AAEtE,MAAM,MAAM,eAAe,GAAG,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,GAAG,UAAU,CAAC,GACzF,QAAQ,CAAC;IACP,UAAU,EAAE,oBAAoB,CAAC;IACjC,KAAK,EAAE,SAAS,CAAC;IACjB,WAAW,EAAE,MAAM,CAAC;IACpB,aAAa,EAAE,SAAS,CAAC;IACzB;;;;;OAKG;IACH,QAAQ,EAAE,CAAC,MAAM,EAAE,yBAAyB,EAAE,KAAK,EAAE,WAAW,CAAC,MAAM,EAAE,IAAI,CAAC,KAAK,IAAI,CAAC;IACxF,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,cAAc,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IACvD,gGAAgG;IAChG,WAAW,CAAC,EAAE,uBAAuB,CAAC;CACvC,CAAC,CAAC;AAML,sFAAsF;AACtF,eAAO,MAAM,UAAU;gBA1BP,oBAAoB;WACzB,SAAS;iBACH,MAAM;mBACJ,SAAS;IACxB;;;;;OAKG;cACO,CAAC,MAAM,EAAE,yBAAyB,EAAE,KAAK,EAAE,WAAW,CAAC,MAAM,EAAE,IAAI,CAAC,KAAK,IAAI;oBACvE,MAAM;eACX,OAAO;WACX,SAAS;YACR,SAAS;cACP,MAAM;qBACC,CAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM;IACtD,gGAAgG;kBAClF,uBAAuB;mDAgGvC,CAAC"}

package/dist/file-picker.js

@@ -1,3 +1,4 @@
+"use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { filePickerTriggerDefaults, resolveFilePickerDescriptor, resolveFilePickerSelection, validateFilePickerTriggers, } from "@hjmds/design-contracts/components/file-picker";
 import { forwardRef, useEffect, useId, useRef, useState, } from "react";

package/dist/file-picker.js.map

@@ -1 +1 @@
-{"version":3,"file":"file-picker.js","sourceRoot":"","sources":["../src/file-picker.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  filePickerTriggerDefaults,\n  resolveFilePickerDescriptor,\n  resolveFilePickerSelection,\n  validateFilePickerTriggers,\n  type FilePickerCandidate,\n  type FilePickerDescriptor,\n  type FilePickerSelectionResult,\n} from \"@hjmds/design-contracts/components/file-picker\";\nimport {\n  forwardRef,\n  useEffect,\n  useId,\n  useRef,\n  useState,\n  type ChangeEvent,\n  type DragEvent,\n  type HTMLAttributes,\n  type ReactNode,\n} from \"react\";\n\nimport { classNames, composeRefs } from \"./internal.js\";\nimport type { HjmCompositionStyleProp } from \"./composition-style.js\";\n\nexport type FilePickerProps = Omit<HTMLAttributes<HTMLDivElement>, \"children\" | \"onSelect\"> &\n  Readonly<{\n    descriptor: FilePickerDescriptor;\n    label: ReactNode;\n    buttonLabel: string;\n    dropzoneLabel: ReactNode;\n    /**\n     * `files` maps each accepted candidate id to the browser `File`, so the product can read or upload\n     * the bytes it accepted. Before this a Web product had no access to the File and fell back to a raw\n     * `<input type=\"file\">` (2026-10-17 mockup studio review). Native products already own the file\n     * reference through their `onPick` adapter, so Native keeps the single-argument callback.\n     */\n    onSelect: (result: FilePickerSelectionResult, files: ReadonlyMap<string, File>) => void;\n    existingCount?: number;\n    disabled?: boolean;\n    hint?: ReactNode;\n    error?: ReactNode;\n    inputId?: string;\n    getCandidateId?: (file: File, index: number) => string;\n    /** Canonical layout-only placement on the root element. Controlled visual keys are excluded. */\n    layoutStyle?: HjmCompositionStyleProp;\n  }>;\n\nfunction defaultCandidateId(file: File, index: number): string {\n  return `${file.name}:${file.size}:${file.lastModified}:${index}`;\n}\n\n/** Native file input plus an optional Web dropzone sharing one selection resolver. */\nexport const FilePicker = forwardRef<HTMLDivElement, FilePickerProps>(function FilePicker(\n  {\n    descriptor,\n    label,\n    buttonLabel,\n    dropzoneLabel,\n    onSelect,\n    existingCount = 0,\n    disabled = false,\n    hint,\n    error,\n    inputId,\n    getCandidateId = defaultCandidateId,\n    className,\n    layoutStyle,\n    ...props\n  },\n  ref,\n) {\n  validateFilePickerTriggers(\"web\", filePickerTriggerDefaults.web);\n  const resolved = resolveFilePickerDescriptor(descriptor);\n  const generatedId = useId();\n  const id = inputId ?? `hjm-file-${generatedId.replaceAll(\":\", \"\")}`;\n  const inputRef = useRef<HTMLInputElement>(null);\n  const [dragging, setDragging] = useState(false);\n  useEffect(() => { if (disabled) setDragging(false); }, [disabled]);\n\n  const commit = (files: FileList | readonly File[]) => {\n    // The OS dialog may finish after the owner locks this field. Empty input\n    // changes represent no selection and must not erase a product's file list.\n    if (disabled || files.length === 0) return;\n    const sources = Array.from(files);\n    const candidates: FilePickerCandidate[] = sources.map((file, index) => ({\n      id: getCandidateId(file, index),\n      name: file.name,\n      mimeType: file.type,\n      sizeBytes: file.size,\n    }));\n    const result = resolveFilePickerSelection(candidates, resolved, existingCount);\n    const accepted = new Set(result.accepted.map(candidate => candidate.id));\n    onSelect(result, new Map(candidates.flatMap((candidate, index) => accepted.has(candidate.id) ? [[candidate.id, sources[index]!] as const] : [])));\n  };\n  const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n    try { if (event.currentTarget.files) commit(event.currentTarget.files); }\n    finally { event.currentTarget.value = \"\"; }\n  };\n  const handleDrop = (event: DragEvent<HTMLDivElement>) => {\n    event.preventDefault();\n    setDragging(false);\n    if (!disabled && event.dataTransfer.files.length > 0) commit(event.dataTransfer.files);\n  };\n\n  return (\n    <div {...props} style={{ ...props.style, ...layoutStyle }} ref={composeRefs(ref)} className={classNames(\"hjm-file-picker\", className)} data-dragging={(!disabled && dragging) || undefined} data-invalid={error !== undefined || undefined}>\n      <span className=\"hjm-file-picker__label\" id={`${id}-label`}>{label}</span>\n      {/*\n        The visible button below is the keyboard entry point. Before 1.5.0 this\n        hidden input was a second, unnamed tab stop (the label span was not\n        associated with it), so a screen reader announced a nameless \"file\"\n        control. It stays in the accessibility tree for virtual cursors, named\n        by the label, and leaves the tab order.\n      */}\n      <input\n        accept={resolved.accept?.join(\",\")}\n        aria-labelledby={`${id}-label`}\n        className=\"hjm-visually-hidden\"\n        disabled={disabled}\n        id={id}\n        tabIndex={-1}\n        multiple={resolved.mode === \"multiple\"}\n        onChange={handleChange}\n        ref={inputRef}\n        type=\"file\"\n      />\n      <div\n        className=\"hjm-file-picker__dropzone\"\n        onDragEnter={(event) => { event.preventDefault(); if (!disabled) setDragging(true); }}\n        onDragLeave={(event) => { if (!event.currentTarget.contains(event.relatedTarget as Node | null)) setDragging(false); }}\n        onDragOver={(event) => event.preventDefault()}\n        onDrop={handleDrop}\n      >\n        <span>{dropzoneLabel}</span>\n        <button disabled={disabled} onClick={() => inputRef.current?.click()} type=\"button\">{buttonLabel}</button>\n      </div>\n      {hint === undefined ? null : <span className=\"hjm-file-picker__hint\">{hint}</span>}\n      {error === undefined ? null : <span className=\"hjm-file-picker__error\" role=\"alert\">{error}</span>}\n    </div>\n  );\n});\n"]}
+{"version":3,"file":"file-picker.js","sourceRoot":"","sources":["../src/file-picker.tsx"],"names":[],"mappings":"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","sourcesContent":["\"use client\";\n\nimport {\n  filePickerTriggerDefaults,\n  resolveFilePickerDescriptor,\n  resolveFilePickerSelection,\n  validateFilePickerTriggers,\n  type FilePickerCandidate,\n  type FilePickerDescriptor,\n  type FilePickerSelectionResult,\n} from \"@hjmds/design-contracts/components/file-picker\";\nimport {\n  forwardRef,\n  useEffect,\n  useId,\n  useRef,\n  useState,\n  type ChangeEvent,\n  type DragEvent,\n  type HTMLAttributes,\n  type ReactNode,\n} from \"react\";\n\nimport { classNames, composeRefs } from \"./internal.js\";\nimport type { HjmCompositionStyleProp } from \"./composition-style.js\";\n\nexport type FilePickerProps = Omit<HTMLAttributes<HTMLDivElement>, \"children\" | \"onSelect\"> &\n  Readonly<{\n    descriptor: FilePickerDescriptor;\n    label: ReactNode;\n    buttonLabel: string;\n    dropzoneLabel: ReactNode;\n    /**\n     * `files` maps each accepted candidate id to the browser `File`, so the product can read or upload\n     * the bytes it accepted. Before this a Web product had no access to the File and fell back to a raw\n     * `<input type=\"file\">` (2026-10-17 mockup studio review). Native products already own the file\n     * reference through their `onPick` adapter, so Native keeps the single-argument callback.\n     */\n    onSelect: (result: FilePickerSelectionResult, files: ReadonlyMap<string, File>) => void;\n    existingCount?: number;\n    disabled?: boolean;\n    hint?: ReactNode;\n    error?: ReactNode;\n    inputId?: string;\n    getCandidateId?: (file: File, index: number) => string;\n    /** Canonical layout-only placement on the root element. Controlled visual keys are excluded. */\n    layoutStyle?: HjmCompositionStyleProp;\n  }>;\n\nfunction defaultCandidateId(file: File, index: number): string {\n  return `${file.name}:${file.size}:${file.lastModified}:${index}`;\n}\n\n/** Native file input plus an optional Web dropzone sharing one selection resolver. */\nexport const FilePicker = forwardRef<HTMLDivElement, FilePickerProps>(function FilePicker(\n  {\n    descriptor,\n    label,\n    buttonLabel,\n    dropzoneLabel,\n    onSelect,\n    existingCount = 0,\n    disabled = false,\n    hint,\n    error,\n    inputId,\n    getCandidateId = defaultCandidateId,\n    className,\n    layoutStyle,\n    ...props\n  },\n  ref,\n) {\n  validateFilePickerTriggers(\"web\", filePickerTriggerDefaults.web);\n  const resolved = resolveFilePickerDescriptor(descriptor);\n  const generatedId = useId();\n  const id = inputId ?? `hjm-file-${generatedId.replaceAll(\":\", \"\")}`;\n  const inputRef = useRef<HTMLInputElement>(null);\n  const [dragging, setDragging] = useState(false);\n  useEffect(() => { if (disabled) setDragging(false); }, [disabled]);\n\n  const commit = (files: FileList | readonly File[]) => {\n    // The OS dialog may finish after the owner locks this field. Empty input\n    // changes represent no selection and must not erase a product's file list.\n    if (disabled || files.length === 0) return;\n    const sources = Array.from(files);\n    const candidates: FilePickerCandidate[] = sources.map((file, index) => ({\n      id: getCandidateId(file, index),\n      name: file.name,\n      mimeType: file.type,\n      sizeBytes: file.size,\n    }));\n    const result = resolveFilePickerSelection(candidates, resolved, existingCount);\n    const accepted = new Set(result.accepted.map(candidate => candidate.id));\n    onSelect(result, new Map(candidates.flatMap((candidate, index) => accepted.has(candidate.id) ? [[candidate.id, sources[index]!] as const] : [])));\n  };\n  const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n    try { if (event.currentTarget.files) commit(event.currentTarget.files); }\n    finally { event.currentTarget.value = \"\"; }\n  };\n  const handleDrop = (event: DragEvent<HTMLDivElement>) => {\n    event.preventDefault();\n    setDragging(false);\n    if (!disabled && event.dataTransfer.files.length > 0) commit(event.dataTransfer.files);\n  };\n\n  return (\n    <div {...props} style={{ ...props.style, ...layoutStyle }} ref={composeRefs(ref)} className={classNames(\"hjm-file-picker\", className)} data-dragging={(!disabled && dragging) || undefined} data-invalid={error !== undefined || undefined}>\n      <span className=\"hjm-file-picker__label\" id={`${id}-label`}>{label}</span>\n      {/*\n        The visible button below is the keyboard entry point. Before 1.5.0 this\n        hidden input was a second, unnamed tab stop (the label span was not\n        associated with it), so a screen reader announced a nameless \"file\"\n        control. It stays in the accessibility tree for virtual cursors, named\n        by the label, and leaves the tab order.\n      */}\n      <input\n        accept={resolved.accept?.join(\",\")}\n        aria-labelledby={`${id}-label`}\n        className=\"hjm-visually-hidden\"\n        disabled={disabled}\n        id={id}\n        tabIndex={-1}\n        multiple={resolved.mode === \"multiple\"}\n        onChange={handleChange}\n        ref={inputRef}\n        type=\"file\"\n      />\n      <div\n        className=\"hjm-file-picker__dropzone\"\n        onDragEnter={(event) => { event.preventDefault(); if (!disabled) setDragging(true); }}\n        onDragLeave={(event) => { if (!event.currentTarget.contains(event.relatedTarget as Node | null)) setDragging(false); }}\n        onDragOver={(event) => event.preventDefault()}\n        onDrop={handleDrop}\n      >\n        <span>{dropzoneLabel}</span>\n        <button disabled={disabled} onClick={() => inputRef.current?.click()} type=\"button\">{buttonLabel}</button>\n      </div>\n      {hint === undefined ? null : <span className=\"hjm-file-picker__hint\">{hint}</span>}\n      {error === undefined ? null : <span className=\"hjm-file-picker__error\" role=\"alert\">{error}</span>}\n    </div>\n  );\n});\n"]}

package/dist/floating-action-button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"floating-action-button.d.ts","sourceRoot":"","sources":["../src/floating-action-button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA+D,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACpG,OAAO,EAEkC,2CAA2C,EAClF,KAAK,8BAA8B,EAAE,KAAK,8BAA8B,EACzE,MAAM,2DAA2D,CAAC;AAEnE,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,cAAc,CAAC;AAIxD,OAAO,EAAE,2CAA2C,EAAE,CAAC;AAEvD,MAAM,MAAM,yBAAyB,GAAG,IAAI,CAAC,WAAW,EAAE,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,IAAI,GAAG,WAAW,CAAC,GAAG,QAAQ,CAAC;IAC1H,UAAU,EAAE,8BAA8B,CAAC;IAC3C,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;IAC1B,UAAU,EAAE,CAAC,IAAI,EAAE,QAAQ,CAAC;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,UAAU,EAAE,IAAI,CAAA;KAAE,CAAC,KAAK,SAAS,CAAC;IAC3G,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,qFAAqF;IACrF,wBAAwB,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;CACvD,CAAC,CAAC;AAEH,uEAAuE;AACvE,eAAO,MAAM,oBAAoB;gBATnB,8BAA8B;WACnC,QAAQ,GAAG,OAAO;gBACb,CAAC,IAAI,EAAE,QAAQ,CAAC;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,UAAU,EAAE,IAAI,CAAA;KAAE,CAAC,KAAK,SAAS;0BACpF,MAAM;IAC5B,qFAAqF;8BAC3D,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI;sDAoCrD,CAAC;AAEH,yFAAyF;AACzF,wBAAgB,6BAA6B,CAAC,MAAM,CAAC,EAAE,WAAW,GAAG,IAAI,GAAG,8BAA8B,CAmBzG"}
+{"version":3,"file":"floating-action-button.d.ts","sourceRoot":"","sources":["../src/floating-action-button.tsx"],"names":[],"mappings":"AAEA,OAAO,EAA+D,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACpG,OAAO,EAEkC,2CAA2C,EAClF,KAAK,8BAA8B,EAAE,KAAK,8BAA8B,EACzE,MAAM,2DAA2D,CAAC;AAEnE,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,cAAc,CAAC;AAIxD,OAAO,EAAE,2CAA2C,EAAE,CAAC;AAEvD,MAAM,MAAM,yBAAyB,GAAG,IAAI,CAAC,WAAW,EAAE,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,IAAI,GAAG,WAAW,CAAC,GAAG,QAAQ,CAAC;IAC1H,UAAU,EAAE,8BAA8B,CAAC;IAC3C,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;IAC1B,UAAU,EAAE,CAAC,IAAI,EAAE,QAAQ,CAAC;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,UAAU,EAAE,IAAI,CAAA;KAAE,CAAC,KAAK,SAAS,CAAC;IAC3G,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,qFAAqF;IACrF,wBAAwB,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;CACvD,CAAC,CAAC;AAEH,uEAAuE;AACvE,eAAO,MAAM,oBAAoB;gBATnB,8BAA8B;WACnC,QAAQ,GAAG,OAAO;gBACb,CAAC,IAAI,EAAE,QAAQ,CAAC;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,UAAU,EAAE,IAAI,CAAA;KAAE,CAAC,KAAK,SAAS;0BACpF,MAAM;IAC5B,qFAAqF;8BAC3D,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI;sDAoCrD,CAAC;AAEH,yFAAyF;AACzF,wBAAgB,6BAA6B,CAAC,MAAM,CAAC,EAAE,WAAW,GAAG,IAAI,GAAG,8BAA8B,CAmBzG"}

package/dist/floating-action-button.js

@@ -1,3 +1,4 @@
+"use client";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef, useEffect, useRef, useState } from "react";
 import { floatingActionButtonRecipe as recipe, resolveFloatingActionButtonDescriptor, resolveFloatingActionButtonLayoutMode, resolveFloatingActionButtonContentClearance, } from "@hjmds/design-contracts/components/floating-action-button";

package/dist/floating-action-button.js.map

@@ -1 +1 @@
-{"version":3,"file":"floating-action-button.js","sourceRoot":"","sources":["../src/floating-action-button.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useEffect, useRef, useState, type CSSProperties, type ReactNode } from \"react\";\nimport {\n  floatingActionButtonRecipe as recipe, resolveFloatingActionButtonDescriptor,\n  resolveFloatingActionButtonLayoutMode, resolveFloatingActionButtonContentClearance,\n  type FloatingActionButtonDescriptor, type FloatingActionButtonLayoutMode,\n} from \"@hjmds/design-contracts/components/floating-action-button\";\nimport { glyph, easing } from \"@hjmds/design-contracts/foundations\";\nimport { Button, type ButtonProps } from \"./actions.js\";\nimport { assignRef, classNames } from \"./internal.js\";\nimport { useOptionalHjmTheme } from \"./provider.js\";\n\nexport { resolveFloatingActionButtonContentClearance };\n// No `layoutStyle`: fixed to the viewport corner with safe-area and content-clearance math the recipe owns; margins would desync `onContentClearanceChange`.\nexport type FloatingActionButtonProps = Pick<ButtonProps, \"onClick\" | \"onFocus\" | \"onBlur\" | \"id\" | \"className\"> & Readonly<{\n  descriptor: FloatingActionButtonDescriptor;\n  size?: \"medium\" | \"large\";\n  renderIcon: (icon: Readonly<{ name: string; size: number; color: string; decorative: true }>) => ReactNode;\n  safeAreaBottomInset?: number;\n  /** Apply this to the scroll content's bottom padding, including multiline labels. */\n  onContentClearanceChange: (clearance: number) => void;\n}>;\n\n/** One persistent button preserves focus while its label collapses. */\nexport const FloatingActionButton = forwardRef<HTMLButtonElement, FloatingActionButtonProps>(function FloatingActionButton({\n  descriptor, size = \"large\", renderIcon, safeAreaBottomInset = 0, onContentClearanceChange, className, ...props\n}, forwardedRef) {\n  const resolved = resolveFloatingActionButtonDescriptor(descriptor);\n  const theme = useOptionalHjmTheme();\n  const minimumClearance = resolveFloatingActionButtonContentClearance(safeAreaBottomInset, size);\n  const buttonRef = useRef<HTMLButtonElement | null>(null);\n  useEffect(() => {\n    const button = buttonRef.current;\n    if (!button) return;\n    const measure = () => {\n      const bottom = parseFloat(getComputedStyle(button).bottom);\n      onContentClearanceChange(Math.max(minimumClearance, button.getBoundingClientRect().height\n        + (Number.isFinite(bottom) ? bottom : recipe.margin + safeAreaBottomInset) + recipe.margin));\n    };\n    measure(); const observer = new ResizeObserver(measure); observer.observe(button);\n    window.addEventListener(\"resize\", measure);\n    return () => { observer.disconnect(); window.removeEventListener(\"resize\", measure); };\n  }, [minimumClearance, safeAreaBottomInset, onContentClearanceChange]);\n  return <Button {...props} appearance=\"flat\" ref={(node) => { buttonRef.current = node; assignRef(forwardedRef, node); }}\n    className={classNames(\"hjm-fab\", className)} size={size} tone=\"primary\" shape=\"pill\"\n    data-mode={resolved.layoutMode} data-direction={theme?.environment.direction ?? \"ltr\"} data-reduced-motion={theme?.environment.reducedMotion ?? false} aria-label={resolved.resolvedAccessibilityLabel}\n    style={{ \"--hjm-fab-diameter\": `${recipe.sizes[size].diameter}px`, \"--hjm-fab-margin\": `${recipe.margin}px`,\n      \"--hjm-fab-safe-area\": `${safeAreaBottomInset}px`, \"--hjm-fab-duration\": `${recipe.transition.duration}ms`,\n      \"--hjm-fab-easing\": `cubic-bezier(${easing[recipe.transition.easing].join(\",\")})`,\n      // Match other floating chrome under a profile; keep the stylesheet-only\n      // legacy path rather than requiring a Provider for existing consumers.\n      boxShadow: theme?.designProfile ? \"var(--hjm-shadow-floating)\"\n        : `0 ${recipe.shadow.offsetY}px ${recipe.shadow.radius}px color-mix(in srgb, ${recipe.shadow.color} ${recipe.shadow.opacity * 100}%, transparent)` } as CSSProperties}\n    leading={<span aria-hidden=\"true\" className=\"hjm-fab__icon\">{renderIcon({ name: resolved.icon.name, size: glyph[recipe.sizes[size].glyph], color: \"currentColor\", decorative: true })}</span>}>\n    {resolved.label}\n  </Button>;\n});\n\n/** Omit target for window scrolling; null waits for a custom scroll element to mount. */\nexport function useFloatingActionButtonScroll(target?: HTMLElement | null): FloatingActionButtonLayoutMode {\n  const [layoutMode, setLayoutMode] = useState<FloatingActionButtonLayoutMode>(\"expanded\");\n  useEffect(() => {\n    if (target === null) return;\n    const source = target ?? window;\n    let anchor = target?.scrollTop ?? window.scrollY;\n    const onScroll = () => {\n      const offset = Math.max(0, target?.scrollTop ?? window.scrollY);\n      const delta = offset - anchor;\n      // Half the edge margin ignores tiny trackpad tremors, but accumulates small\n      // deltas until direction is clear instead of resetting on every frame.\n      if (offset > 0 && Math.abs(delta) < recipe.margin / 2) return;\n      anchor = offset;\n      setLayoutMode((mode) => resolveFloatingActionButtonLayoutMode(offset === 0 || delta < 0 ? \"toward-start\" : \"away-from-start\", mode));\n    };\n    source.addEventListener(\"scroll\", onScroll, { passive: true });\n    return () => source.removeEventListener(\"scroll\", onScroll);\n  }, [target]);\n  return layoutMode;\n}\n"]}
+{"version":3,"file":"floating-action-button.js","sourceRoot":"","sources":["../src/floating-action-button.tsx"],"names":[],"mappings":"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","sourcesContent":["\"use client\";\n\nimport { forwardRef, useEffect, useRef, useState, type CSSProperties, type ReactNode } from \"react\";\nimport {\n  floatingActionButtonRecipe as recipe, resolveFloatingActionButtonDescriptor,\n  resolveFloatingActionButtonLayoutMode, resolveFloatingActionButtonContentClearance,\n  type FloatingActionButtonDescriptor, type FloatingActionButtonLayoutMode,\n} from \"@hjmds/design-contracts/components/floating-action-button\";\nimport { glyph, easing } from \"@hjmds/design-contracts/foundations\";\nimport { Button, type ButtonProps } from \"./actions.js\";\nimport { assignRef, classNames } from \"./internal.js\";\nimport { useOptionalHjmTheme } from \"./provider.js\";\n\nexport { resolveFloatingActionButtonContentClearance };\n// No `layoutStyle`: fixed to the viewport corner with safe-area and content-clearance math the recipe owns; margins would desync `onContentClearanceChange`.\nexport type FloatingActionButtonProps = Pick<ButtonProps, \"onClick\" | \"onFocus\" | \"onBlur\" | \"id\" | \"className\"> & Readonly<{\n  descriptor: FloatingActionButtonDescriptor;\n  size?: \"medium\" | \"large\";\n  renderIcon: (icon: Readonly<{ name: string; size: number; color: string; decorative: true }>) => ReactNode;\n  safeAreaBottomInset?: number;\n  /** Apply this to the scroll content's bottom padding, including multiline labels. */\n  onContentClearanceChange: (clearance: number) => void;\n}>;\n\n/** One persistent button preserves focus while its label collapses. */\nexport const FloatingActionButton = forwardRef<HTMLButtonElement, FloatingActionButtonProps>(function FloatingActionButton({\n  descriptor, size = \"large\", renderIcon, safeAreaBottomInset = 0, onContentClearanceChange, className, ...props\n}, forwardedRef) {\n  const resolved = resolveFloatingActionButtonDescriptor(descriptor);\n  const theme = useOptionalHjmTheme();\n  const minimumClearance = resolveFloatingActionButtonContentClearance(safeAreaBottomInset, size);\n  const buttonRef = useRef<HTMLButtonElement | null>(null);\n  useEffect(() => {\n    const button = buttonRef.current;\n    if (!button) return;\n    const measure = () => {\n      const bottom = parseFloat(getComputedStyle(button).bottom);\n      onContentClearanceChange(Math.max(minimumClearance, button.getBoundingClientRect().height\n        + (Number.isFinite(bottom) ? bottom : recipe.margin + safeAreaBottomInset) + recipe.margin));\n    };\n    measure(); const observer = new ResizeObserver(measure); observer.observe(button);\n    window.addEventListener(\"resize\", measure);\n    return () => { observer.disconnect(); window.removeEventListener(\"resize\", measure); };\n  }, [minimumClearance, safeAreaBottomInset, onContentClearanceChange]);\n  return <Button {...props} appearance=\"flat\" ref={(node) => { buttonRef.current = node; assignRef(forwardedRef, node); }}\n    className={classNames(\"hjm-fab\", className)} size={size} tone=\"primary\" shape=\"pill\"\n    data-mode={resolved.layoutMode} data-direction={theme?.environment.direction ?? \"ltr\"} data-reduced-motion={theme?.environment.reducedMotion ?? false} aria-label={resolved.resolvedAccessibilityLabel}\n    style={{ \"--hjm-fab-diameter\": `${recipe.sizes[size].diameter}px`, \"--hjm-fab-margin\": `${recipe.margin}px`,\n      \"--hjm-fab-safe-area\": `${safeAreaBottomInset}px`, \"--hjm-fab-duration\": `${recipe.transition.duration}ms`,\n      \"--hjm-fab-easing\": `cubic-bezier(${easing[recipe.transition.easing].join(\",\")})`,\n      // Match other floating chrome under a profile; keep the stylesheet-only\n      // legacy path rather than requiring a Provider for existing consumers.\n      boxShadow: theme?.designProfile ? \"var(--hjm-shadow-floating)\"\n        : `0 ${recipe.shadow.offsetY}px ${recipe.shadow.radius}px color-mix(in srgb, ${recipe.shadow.color} ${recipe.shadow.opacity * 100}%, transparent)` } as CSSProperties}\n    leading={<span aria-hidden=\"true\" className=\"hjm-fab__icon\">{renderIcon({ name: resolved.icon.name, size: glyph[recipe.sizes[size].glyph], color: \"currentColor\", decorative: true })}</span>}>\n    {resolved.label}\n  </Button>;\n});\n\n/** Omit target for window scrolling; null waits for a custom scroll element to mount. */\nexport function useFloatingActionButtonScroll(target?: HTMLElement | null): FloatingActionButtonLayoutMode {\n  const [layoutMode, setLayoutMode] = useState<FloatingActionButtonLayoutMode>(\"expanded\");\n  useEffect(() => {\n    if (target === null) return;\n    const source = target ?? window;\n    let anchor = target?.scrollTop ?? window.scrollY;\n    const onScroll = () => {\n      const offset = Math.max(0, target?.scrollTop ?? window.scrollY);\n      const delta = offset - anchor;\n      // Half the edge margin ignores tiny trackpad tremors, but accumulates small\n      // deltas until direction is clear instead of resetting on every frame.\n      if (offset > 0 && Math.abs(delta) < recipe.margin / 2) return;\n      anchor = offset;\n      setLayoutMode((mode) => resolveFloatingActionButtonLayoutMode(offset === 0 || delta < 0 ? \"toward-start\" : \"away-from-start\", mode));\n    };\n    source.addEventListener(\"scroll\", onScroll, { passive: true });\n    return () => source.removeEventListener(\"scroll\", onScroll);\n  }, [target]);\n  return layoutMode;\n}\n"]}

package/dist/folder-preview.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"folder-preview.d.ts","sourceRoot":"","sources":["../src/folder-preview.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAI,EAAC,SAAS,EAAC,MAAI,OAAO,CAAC;AAClC,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,wBAAwB,CAAC;AACtE,MAAM,MAAM,kBAAkB,GAAC,QAAQ,CAAC;IAAC,KAAK,EAAC,MAAM,CAAC;IAAA,IAAI,EAAC,OAAO,CAAC;IAAA,YAAY,EAAC,CAAC,IAAI,EAAC,OAAO,KAAG,IAAI,CAAC;IAAA,QAAQ,EAAC,SAAS,SAAS,EAAE,CAAC;IAAA,QAAQ,EAAC,SAAS,CAAC;IAAA,QAAQ,CAAC,EAAC,OAAO,CAAC;IACvK,oGAAoG;IACpG,WAAW,CAAC,EAAC,uBAAuB,CAAA;CAAC,CAAC,CAAC;AACxC,yGAAyG;AACzG,wBAAgB,aAAa,CAAC,EAAC,KAAK,EAAC,IAAI,EAAC,YAAY,EAAC,QAAQ,EAAC,QAAQ,EAAC,QAAc,EAAC,WAAW,EAAC,EAAC,kBAAkB,+BAAw5C"}
+{"version":3,"file":"folder-preview.d.ts","sourceRoot":"","sources":["../src/folder-preview.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAI,EAAC,SAAS,EAAC,MAAI,OAAO,CAAC;AAClC,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,wBAAwB,CAAC;AACtE,MAAM,MAAM,kBAAkB,GAAC,QAAQ,CAAC;IAAC,KAAK,EAAC,MAAM,CAAC;IAAA,IAAI,EAAC,OAAO,CAAC;IAAA,YAAY,EAAC,CAAC,IAAI,EAAC,OAAO,KAAG,IAAI,CAAC;IAAA,QAAQ,EAAC,SAAS,SAAS,EAAE,CAAC;IAAA,QAAQ,EAAC,SAAS,CAAC;IAAA,QAAQ,CAAC,EAAC,OAAO,CAAC;IACvK,oGAAoG;IACpG,WAAW,CAAC,EAAC,uBAAuB,CAAA;CAAC,CAAC,CAAC;AACxC,yGAAyG;AACzG,wBAAgB,aAAa,CAAC,EAAC,KAAK,EAAC,IAAI,EAAC,YAAY,EAAC,QAAQ,EAAC,QAAQ,EAAC,QAAc,EAAC,WAAW,EAAC,EAAC,kBAAkB,+BAAw5C"}

package/dist/folder-preview.js

@@ -1,3 +1,4 @@
+"use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Collapsible, CollapsibleMarker } from './collapsible.js';
 import { useHjmTheme } from './provider.js';

package/dist/folder-preview.js.map

@@ -1 +1 @@
-{"version":3,"file":"folder-preview.js","sourceRoot":"","sources":["../src/folder-preview.tsx"],"names":[],"mappings":";AAGkC,OAAM,EAAC,WAAW,EAAC,iBAAiB,EAAC,MAAI,kBAAkB,CAAC;AAAA,OAAM,EAAC,WAAW,EAAC,MAAI,eAAe,CAAC;AAKrI,yGAAyG;AACzG,MAAM,UAAU,aAAa,CAAC,EAAC,KAAK,EAAC,IAAI,EAAC,YAAY,EAAC,QAAQ,EAAC,QAAQ,EAAC,QAAQ,GAAC,KAAK,EAAC,WAAW,EAAoB,IAAE,MAAK,EAAC,WAAW,EAAC,GAAC,WAAW,EAAE,CAAC,CAAA,IAAG,CAAC,KAAK,CAAC,IAAI,EAAE;IAAC,MAAM,IAAI,SAAS,CAAC,sBAAsB,CAAC,CAAC,CAAA,OAAO,KAAC,WAAW,IAAC,IAAI,EAAE,IAAI,EAAE,YAAY,EAAE,YAAY,EAAE,QAAQ,EAAE,QAAQ,KAAM,CAAC,WAAW,KAAG,SAAS,CAAA,CAAC,CAAA,EAAE,CAAA,CAAC,CAAA,EAAC,WAAW,EAAC,CAAC,EAAE,MAAM,EAAC,MAAM,EAAC,OAAO,EAAE,eAAK,KAAK,EAAE,EAAC,KAAK,EAAC,MAAM,EAAC,QAAQ,EAAC,CAAC,EAAC,OAAO,EAAC,MAAM,EAAC,aAAa,EAAC,QAAQ,EAAC,UAAU,EAAC,QAAQ,EAAC,GAAG,EAAC,qBAAqB,EAAC,aAAE,eAAK,KAAK,uBAAa,MAAM,EAAC,KAAK,EAAE,EAAC,QAAQ,EAAC,UAAU,EAAC,MAAM,EAAC,GAAG,EAAC,KAAK,EAAC,MAAM,EAAC,QAAQ,EAAC,GAAG,EAAC,aAAa,EAAC,MAAM,EAAC,aAAG,QAAQ,CAAC,KAAK,CAAC,CAAC,EAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,OAAO,EAAC,KAAK,EAAC,EAAE,CAAA,cAAiB,KAAK,EAAE,EAAC,QAAQ,EAAC,UAAU,EAAC,gBAAgB,EAAC,KAAK,EAAC,GAAG,EAAC,EAAE,GAAC,KAAK,GAAC,CAAC,EAAC,KAAK,EAAC,KAAK,EAAC,MAAM,EAAC,GAAG,EAAC,QAAQ,EAAC,QAAQ,EAAC,YAAY,EAAC,sBAAsB,EAAC,UAAU,EAAC,8BAA8B,EAAC,MAAM,EAAC,mCAAmC,EAAC,SAAS,EAAC,cAAc,CAAC,KAAK,GAAC,CAAC,CAAC,GAAC,CAAC,IAAI,CAAA,CAAC,CAAA,EAAE,CAAA,CAAC,CAAA,EAAE,CAAC,cAAc,CAAC,KAAK,GAAC,CAAC,CAAC,GAAC,CAAC,IAAI,CAAA,CAAC,CAAA,EAAE,CAAA,CAAC,CAAA,CAAC,CAAC,MAAM,EAAC,UAAU,EAAC,WAAW,CAAC,aAAa,CAAA,CAAC,CAAA,MAAM,CAAA,CAAC,CAAA,0BAA0B,EAAC,YAAG,OAAO,IAApZ,KAAK,CAAsZ,CAAC,EAAC,cAAK,KAAK,EAAE,EAAC,QAAQ,EAAC,UAAU,EAAC,MAAM,EAAC,CAAC,EAAC,WAAW,EAAC,CAAC,EAAC,MAAM,EAAC,EAAE,EAAC,YAAY,EAAC,sBAAsB,EAAC,UAAU,EAAC,iCAAiC,EAAC,MAAM,EAAC,mCAAmC,EAAC,eAAe,EAAC,QAAQ,EAAC,SAAS,EAAC,IAAI,CAAA,CAAC,CAAA,oCAAoC,CAAA,CAAC,CAAA,MAAM,EAAC,GAAG,IAAM,EAAA,gBAAM,KAAK,EAAE,EAAC,OAAO,EAAC,aAAa,EAAC,UAAU,EAAC,QAAQ,EAAC,GAAG,EAAC,qBAAqB,EAAC,SAAS,EAAC,QAAQ,EAAC,aAAE,yBAAO,KAAK,GAAQ,EAAA,KAAC,iBAAiB,IAAC,IAAI,EAAE,IAAI,GAAG,IAAO,IAAM,YAAG,QAAQ,GAAe,CAAC,CAAA,CAAC","sourcesContent":["// Artwork, label and open mark form one centred column; the label used to sit at the start under centred artwork with\n// the mark floating at the row end (2026-10-17 review E20).\n// Fixed 260×160 artwork is decorative; cap at three previews to keep the motif bounded. The trigger label and expanded content remain fluid.\nimport type{ReactNode}from'react';import{Collapsible,CollapsibleMarker}from'./collapsible.js';import{useHjmTheme}from'./provider.js';\nimport type { HjmCompositionStyleProp } from \"./composition-style.js\";\nexport type FolderPreviewProps=Readonly<{label:string;open:boolean;onOpenChange:(open:boolean)=>void;previews:readonly ReactNode[];children:ReactNode;disabled?:boolean;\n /** Canonical layout-only placement on the root Collapsible. Controlled visual keys are excluded. */\n layoutStyle?:HjmCompositionStyleProp}>;\n/** Preview slots are decorative snapshots; expanded children own real actions and accessible content. */\nexport function FolderPreview({label,open,onOpenChange,previews,children,disabled=false,layoutStyle}:FolderPreviewProps){const{environment}=useHjmTheme();if(!label.trim())throw new TypeError('Folder needs a label');return <Collapsible open={open} onOpenChange={onOpenChange} disabled={disabled} {...(layoutStyle===undefined?{}:{layoutStyle})} marker=\"none\" trigger={<div style={{width:'100%',minWidth:0,display:'flex',flexDirection:'column',alignItems:'center',gap:'var(--hjm-space-sm)'}}><div inert aria-hidden=\"true\" style={{position:'relative',height:160,width:'100%',maxWidth:260,pointerEvents:'none'}}>{previews.slice(0,3).map((preview,index)=><div key={index} style={{position:'absolute',insetInlineStart:'20%',top:24+index*8,width:'60%',height:104,overflow:'hidden',borderRadius:'var(--hjm-radius-md)',background:'var(--hjm-color-surface-alt)',border:'1px solid var(--hjm-color-border)',transform:`translateX(${(index-1)*(open?34:10)}px) rotate(${(index-1)*(open?12:4)}deg)`,transition:environment.reducedMotion?'none':'transform 200ms ease-out'}}>{preview}</div>)}<div style={{position:'absolute',bottom:0,insetInline:0,height:56,borderRadius:'var(--hjm-radius-lg)',background:'var(--hjm-color-surface-accent)',border:'1px solid var(--hjm-color-border)',transformOrigin:'bottom',transform:open?'perspective(400px) rotateX(-15deg)':'none'}}/></div><span style={{display:'inline-flex',alignItems:'center',gap:'var(--hjm-space-xs)',textAlign:'center'}}><span>{label}</span><CollapsibleMarker open={open}/></span></div>}>{children}</Collapsible>;}\n"]}
+{"version":3,"file":"folder-preview.js","sourceRoot":"","sources":["../src/folder-preview.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAKqB,OAAM,EAAC,WAAW,EAAC,iBAAiB,EAAC,MAAI,kBAAkB,CAAC;AAAA,OAAM,EAAC,WAAW,EAAC,MAAI,eAAe,CAAC;AAKrI,yGAAyG;AACzG,MAAM,UAAU,aAAa,CAAC,EAAC,KAAK,EAAC,IAAI,EAAC,YAAY,EAAC,QAAQ,EAAC,QAAQ,EAAC,QAAQ,GAAC,KAAK,EAAC,WAAW,EAAoB,IAAE,MAAK,EAAC,WAAW,EAAC,GAAC,WAAW,EAAE,CAAC,CAAA,IAAG,CAAC,KAAK,CAAC,IAAI,EAAE;IAAC,MAAM,IAAI,SAAS,CAAC,sBAAsB,CAAC,CAAC,CAAA,OAAO,KAAC,WAAW,IAAC,IAAI,EAAE,IAAI,EAAE,YAAY,EAAE,YAAY,EAAE,QAAQ,EAAE,QAAQ,KAAM,CAAC,WAAW,KAAG,SAAS,CAAA,CAAC,CAAA,EAAE,CAAA,CAAC,CAAA,EAAC,WAAW,EAAC,CAAC,EAAE,MAAM,EAAC,MAAM,EAAC,OAAO,EAAE,eAAK,KAAK,EAAE,EAAC,KAAK,EAAC,MAAM,EAAC,QAAQ,EAAC,CAAC,EAAC,OAAO,EAAC,MAAM,EAAC,aAAa,EAAC,QAAQ,EAAC,UAAU,EAAC,QAAQ,EAAC,GAAG,EAAC,qBAAqB,EAAC,aAAE,eAAK,KAAK,uBAAa,MAAM,EAAC,KAAK,EAAE,EAAC,QAAQ,EAAC,UAAU,EAAC,MAAM,EAAC,GAAG,EAAC,KAAK,EAAC,MAAM,EAAC,QAAQ,EAAC,GAAG,EAAC,aAAa,EAAC,MAAM,EAAC,aAAG,QAAQ,CAAC,KAAK,CAAC,CAAC,EAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,OAAO,EAAC,KAAK,EAAC,EAAE,CAAA,cAAiB,KAAK,EAAE,EAAC,QAAQ,EAAC,UAAU,EAAC,gBAAgB,EAAC,KAAK,EAAC,GAAG,EAAC,EAAE,GAAC,KAAK,GAAC,CAAC,EAAC,KAAK,EAAC,KAAK,EAAC,MAAM,EAAC,GAAG,EAAC,QAAQ,EAAC,QAAQ,EAAC,YAAY,EAAC,sBAAsB,EAAC,UAAU,EAAC,8BAA8B,EAAC,MAAM,EAAC,mCAAmC,EAAC,SAAS,EAAC,cAAc,CAAC,KAAK,GAAC,CAAC,CAAC,GAAC,CAAC,IAAI,CAAA,CAAC,CAAA,EAAE,CAAA,CAAC,CAAA,EAAE,CAAC,cAAc,CAAC,KAAK,GAAC,CAAC,CAAC,GAAC,CAAC,IAAI,CAAA,CAAC,CAAA,EAAE,CAAA,CAAC,CAAA,CAAC,CAAC,MAAM,EAAC,UAAU,EAAC,WAAW,CAAC,aAAa,CAAA,CAAC,CAAA,MAAM,CAAA,CAAC,CAAA,0BAA0B,EAAC,YAAG,OAAO,IAApZ,KAAK,CAAsZ,CAAC,EAAC,cAAK,KAAK,EAAE,EAAC,QAAQ,EAAC,UAAU,EAAC,MAAM,EAAC,CAAC,EAAC,WAAW,EAAC,CAAC,EAAC,MAAM,EAAC,EAAE,EAAC,YAAY,EAAC,sBAAsB,EAAC,UAAU,EAAC,iCAAiC,EAAC,MAAM,EAAC,mCAAmC,EAAC,eAAe,EAAC,QAAQ,EAAC,SAAS,EAAC,IAAI,CAAA,CAAC,CAAA,oCAAoC,CAAA,CAAC,CAAA,MAAM,EAAC,GAAG,IAAM,EAAA,gBAAM,KAAK,EAAE,EAAC,OAAO,EAAC,aAAa,EAAC,UAAU,EAAC,QAAQ,EAAC,GAAG,EAAC,qBAAqB,EAAC,SAAS,EAAC,QAAQ,EAAC,aAAE,yBAAO,KAAK,GAAQ,EAAA,KAAC,iBAAiB,IAAC,IAAI,EAAE,IAAI,GAAG,IAAO,IAAM,YAAG,QAAQ,GAAe,CAAC,CAAA,CAAC","sourcesContent":["\"use client\";\n\n// Artwork, label and open mark form one centred column; the label used to sit at the start under centred artwork with\n// the mark floating at the row end (2026-10-17 review E20).\n// Fixed 260×160 artwork is decorative; cap at three previews to keep the motif bounded. The trigger label and expanded content remain fluid.\nimport type{ReactNode}from'react';import{Collapsible,CollapsibleMarker}from'./collapsible.js';import{useHjmTheme}from'./provider.js';\nimport type { HjmCompositionStyleProp } from \"./composition-style.js\";\nexport type FolderPreviewProps=Readonly<{label:string;open:boolean;onOpenChange:(open:boolean)=>void;previews:readonly ReactNode[];children:ReactNode;disabled?:boolean;\n /** Canonical layout-only placement on the root Collapsible. Controlled visual keys are excluded. */\n layoutStyle?:HjmCompositionStyleProp}>;\n/** Preview slots are decorative snapshots; expanded children own real actions and accessible content. */\nexport function FolderPreview({label,open,onOpenChange,previews,children,disabled=false,layoutStyle}:FolderPreviewProps){const{environment}=useHjmTheme();if(!label.trim())throw new TypeError('Folder needs a label');return <Collapsible open={open} onOpenChange={onOpenChange} disabled={disabled} {...(layoutStyle===undefined?{}:{layoutStyle})} marker=\"none\" trigger={<div style={{width:'100%',minWidth:0,display:'flex',flexDirection:'column',alignItems:'center',gap:'var(--hjm-space-sm)'}}><div inert aria-hidden=\"true\" style={{position:'relative',height:160,width:'100%',maxWidth:260,pointerEvents:'none'}}>{previews.slice(0,3).map((preview,index)=><div key={index} style={{position:'absolute',insetInlineStart:'20%',top:24+index*8,width:'60%',height:104,overflow:'hidden',borderRadius:'var(--hjm-radius-md)',background:'var(--hjm-color-surface-alt)',border:'1px solid var(--hjm-color-border)',transform:`translateX(${(index-1)*(open?34:10)}px) rotate(${(index-1)*(open?12:4)}deg)`,transition:environment.reducedMotion?'none':'transform 200ms ease-out'}}>{preview}</div>)}<div style={{position:'absolute',bottom:0,insetInline:0,height:56,borderRadius:'var(--hjm-radius-lg)',background:'var(--hjm-color-surface-accent)',border:'1px solid var(--hjm-color-border)',transformOrigin:'bottom',transform:open?'perspective(400px) rotateX(-15deg)':'none'}}/></div><span style={{display:'inline-flex',alignItems:'center',gap:'var(--hjm-space-xs)',textAlign:'center'}}><span>{label}</span><CollapsibleMarker open={open}/></span></div>}>{children}</Collapsible>;}\n"]}

package/dist/forms.d.ts

@@ -2,6 +2,7 @@ import { type FieldAlign, type FieldShape, type FieldVariant } from "@hjmds/desi
 import { type SearchFieldSize } from "@hjmds/design-contracts/recipes";
 import { type PasswordFieldAutofillHint, type PasswordFieldSize } from "@hjmds/design-contracts/components/password-field";
 import { type OtpFieldSize, type OtpFieldPresentation } from "@hjmds/design-contracts/components/otp-field";
+import { type CharacterCountOptions } from "@hjmds/design-contracts/character-count";
 import { type HTMLAttributes, type InputHTMLAttributes, type ReactNode, type TextareaHTMLAttributes } from "react";
 import type { HjmCompositionStyleProp } from "./composition-style.js";
 type FieldCopyProps = Readonly<{
@@ -62,7 +63,16 @@ type SharedInputProps = FieldCopyProps & Readonly<{
      */
     initialFocusTarget?: boolean;
 }>;
-export type TextFieldProps = Omit<InputHTMLAttributes<HTMLInputElement>, "size"> & SharedInputProps & Readonly<{
+/** TextField and TextArea only; SearchField, PasswordField and OtpField have no free-text limit to count. */
+type CharacterCountProps = Readonly<{
+    /**
+     * Shows `length/max` and the product's sentence for the current status under the control
+     * (`resolveCharacterCount`). `overflow: "block"` (default) also sets the platform `maxLength`; do not pass
+     * `maxLength` together with it.
+     */
+    characterCount?: CharacterCountOptions;
+}>;
+export type TextFieldProps = Omit<InputHTMLAttributes<HTMLInputElement>, "size"> & SharedInputProps & CharacterCountProps & Readonly<{
     /**
      * Receives the next string value, the same callback name and shape as the
      * Native TextField. Web TextArea retains the DOM `onChange` callback. Before 1.5.0 Web TextField only had
@@ -98,6 +108,13 @@ export declare const TextField: import("react").ForwardRefExoticComponent<Omit<I
      * entry; revealing a field after interaction does not focus it. Bottom sheets disable automatic input focus.
      */
     initialFocusTarget?: boolean;
+}> & Readonly<{
+    /**
+     * Shows `length/max` and the product's sentence for the current status under the control
+     * (`resolveCharacterCount`). `overflow: "block"` (default) also sets the platform `maxLength`; do not pass
+     * `maxLength` together with it.
+     */
+    characterCount?: CharacterCountOptions;
 }> & Readonly<{
     /**
      * Receives the next string value, the same callback name and shape as the
@@ -107,7 +124,7 @@ export declare const TextField: import("react").ForwardRefExoticComponent<Omit<I
      */
     onValueChange?: (value: string) => void;
 }> & import("react").RefAttributes<HTMLInputElement>>;
-export type TextAreaProps = TextareaHTMLAttributes<HTMLTextAreaElement> & Omit<SharedInputProps, "leading"> & Readonly<{
+export type TextAreaProps = TextareaHTMLAttributes<HTMLTextAreaElement> & Omit<SharedInputProps, "leading"> & CharacterCountProps & Readonly<{
     /**
      * Action before the text inside the field frame (for example a composer's camera button),
      * vertically centred while the text grows. Mirrors `trailing`; `leading` stays omitted because
@@ -123,6 +140,13 @@ export type TextAreaProps = TextareaHTMLAttributes<HTMLTextAreaElement> & Omit<S
     maxVisibleLines?: number;
 }>;
 export declare const TextArea: import("react").ForwardRefExoticComponent<TextareaHTMLAttributes<HTMLTextAreaElement> & Omit<SharedInputProps, "leading"> & Readonly<{
+    /**
+     * Shows `length/max` and the product's sentence for the current status under the control
+     * (`resolveCharacterCount`). `overflow: "block"` (default) also sets the platform `maxLength`; do not pass
+     * `maxLength` together with it.
+     */
+    characterCount?: CharacterCountOptions;
+}> & Readonly<{
     /**
      * Action before the text inside the field frame (for example a composer's camera button),
      * vertically centred while the text grows. Mirrors `trailing`; `leading` stays omitted because
@@ -209,7 +233,7 @@ export type PasswordFieldToggleRenderProps = Readonly<{
     revealed: boolean;
     disabled: boolean;
 }>;
-export type PasswordFieldProps = Omit<TextFieldProps, "autoComplete" | "defaultValue" | "size" | "trailing" | "type" | "value"> & Readonly<{
+export type PasswordFieldProps = Omit<TextFieldProps, "autoComplete" | "characterCount" | "defaultValue" | "size" | "trailing" | "type" | "value"> & Readonly<{
     value?: string;
     defaultValue?: string;
     onValueChange?: (value: string) => void;
@@ -223,7 +247,7 @@ export type PasswordFieldProps = Omit<TextFieldProps, "autoComplete" | "defaultV
     renderToggleIcon?: (props: PasswordFieldToggleRenderProps) => ReactNode;
 }>;
 /** Password input with an independently controlled, selection-safe reveal action. */
-export declare const PasswordField: import("react").ForwardRefExoticComponent<Omit<TextFieldProps, "value" | "defaultValue" | "size" | "type" | "trailing" | "autoComplete"> & Readonly<{
+export declare const PasswordField: import("react").ForwardRefExoticComponent<Omit<TextFieldProps, "value" | "defaultValue" | "size" | "type" | "trailing" | "autoComplete" | "characterCount"> & Readonly<{
     value?: string;
     defaultValue?: string;
     onValueChange?: (value: string) => void;
@@ -236,7 +260,7 @@ export declare const PasswordField: import("react").ForwardRefExoticComponent<Om
     size?: PasswordFieldSize;
     renderToggleIcon?: (props: PasswordFieldToggleRenderProps) => ReactNode;
 }> & import("react").RefAttributes<HTMLInputElement>>;
-export type OtpFieldProps = Omit<TextFieldProps, "autoComplete" | "defaultValue" | "leading" | "maxLength" | "shape" | "size" | "trailing" | "type" | "value" | "variant"> & Readonly<{
+export type OtpFieldProps = Omit<TextFieldProps, "autoComplete" | "characterCount" | "defaultValue" | "leading" | "maxLength" | "shape" | "size" | "trailing" | "type" | "value" | "variant"> & Readonly<{
     length: number;
     value?: string;
     defaultValue?: string;
@@ -247,7 +271,7 @@ export type OtpFieldProps = Omit<TextFieldProps, "autoComplete" | "defaultValue"
     busy?: boolean;
 }>;
 /** One accessible numeric input rendered as decorative OTP slots. */
-export declare const OtpField: import("react").ForwardRefExoticComponent<Omit<TextFieldProps, "value" | "defaultValue" | "size" | "type" | "variant" | "leading" | "trailing" | "shape" | "autoComplete" | "maxLength"> & Readonly<{
+export declare const OtpField: import("react").ForwardRefExoticComponent<Omit<TextFieldProps, "value" | "defaultValue" | "size" | "type" | "variant" | "leading" | "trailing" | "shape" | "maxLength" | "autoComplete" | "characterCount"> & Readonly<{
     length: number;
     value?: string;
     defaultValue?: string;

package/dist/forms.d.ts.map

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

package/dist/forms.js

@@ -1,8 +1,10 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { fieldRecipe, } from "@hjmds/design-contracts/recipes/base";
 import { iconRecipe, searchFieldRecipe, } from "@hjmds/design-contracts/recipes";
 import { passwordFieldRecipe, resolvePasswordFieldDescriptor, } from "@hjmds/design-contracts/components/password-field";
 import { getOtpFieldSlotValues, otpFieldRecipe, resolveOtpFieldValue, } from "@hjmds/design-contracts/components/otp-field";
+import { resolveCharacterCount, resolveCharacterCountMaxLength, shouldAnnounceCharacterCount, } from "@hjmds/design-contracts/character-count";
 import { createContext, forwardRef, useContext, useEffect, useId, useLayoutEffect, useRef, useState, } from "react";
 import { composeRefs, classNames, isAriaInvalid, useControllableState } from "./internal.js";
 import { useInitialFocusTarget } from "./internal/initial-focus.js";
@@ -80,10 +82,43 @@ function requireFieldAccessibleName(label, ariaLabel) {
         throw new TypeError("Field controls require either label or aria-label");
     }
 }
-export const TextField = forwardRef(function TextField({ id, label, description, error, required, disabled, variant, shape, align, leading, trailing, fieldClassName, className, onFocus, onBlur, onChange, onValueChange, "aria-describedby": ariaDescribedBy, "aria-invalid": ariaInvalid, "aria-label": ariaLabel, layoutStyle, initialFocusTarget, ...props }, ref) {
+/*
+  Character count (characterCountRecipe, 2026-10-23 BurnTok ComposerCount/TextLengthHint). The row sits under the
+  control and before the description, and `aria-describedby` references it, so the counter and sentence are read on
+  focus. A separate polite live region announces only on entering near/short/over: announcing each keystroke
+  would talk over the typed text.
+*/
+function useCharacterCount(options, value, ownMaxLength) {
+    if (options && ownMaxLength !== undefined) {
+        throw new TypeError("Pass the limit through characterCount.max instead of maxLength");
+    }
+    const state = options ? resolveCharacterCount(value, options) : undefined;
+    const previous = useRef(undefined);
+    const [announcement, setAnnouncement] = useState("");
+    const status = state?.status;
+    useEffect(() => {
+        if (state && shouldAnnounceCharacterCount(previous.current, state))
+            setAnnouncement(state.message ?? "");
+        previous.current = status;
+        // Only a status change announces; the message inside one status changes with every keystroke.
+    }, [status]);
+    const maxLength = options ? resolveCharacterCountMaxLength(options) : ownMaxLength;
+    return { ...(state ? { state } : {}), announcement, ...(maxLength === undefined ? {} : { maxLength }) };
+}
+function CharacterCountRow({ id, state, announcement }) {
+    return (_jsxs(_Fragment, { children: [_jsxs("div", { id: id, className: "hjm-field__count", "data-status": state.status, "data-invalid": state.invalid || undefined, children: [state.message ? _jsx("span", { className: "hjm-field__count-message", children: state.message }) : null, _jsx("span", { className: "hjm-field__counter", children: state.counter })] }), _jsx("span", { className: "hjm-visually-hidden", "aria-live": "polite", "data-hjm-field-count-announcement": "", children: announcement })] }));
+}
+function useDraftValue(value, defaultValue) {
+    const [draft, setDraft] = useState(() => (defaultValue === undefined || defaultValue === null ? "" : String(defaultValue)));
+    return [value === undefined || value === null ? draft : String(value), setDraft];
+}
+export const TextField = forwardRef(function TextField({ id, label, description, error, required, disabled, variant, shape, align, leading, trailing, fieldClassName, className, onFocus, onBlur, onChange, onValueChange, "aria-describedby": ariaDescribedBy, "aria-invalid": ariaInvalid, "aria-label": ariaLabel, layoutStyle, initialFocusTarget, characterCount, maxLength: ownMaxLength, ...props }, ref) {
     const ids = useFieldIds(id);
     const [focused, setFocused] = useState(false);
     requireFieldAccessibleName(label, ariaLabel);
+    const [countedValue, setDraft] = useDraftValue(props.value, props.defaultValue);
+    const count = useCharacterCount(characterCount, countedValue, ownMaxLength);
+    const countId = `${ids.controlId}-count`;
     const control = useRef(null);
     useInitialFocusTarget(control, initialFocusTarget);
     const handleFocus = (event) => {
@@ -94,15 +129,19 @@ export const TextField = forwardRef(function TextField({ id, label, description,
         setFocused(false);
         onBlur?.(event);
     };
-    return (_jsx(FieldFrame, { controlId: ids.controlId, label: label, description: description, error: error, required: required ?? false, disabled: disabled ?? false, focused: focused, invalid: isAriaInvalid(ariaInvalid), variant: variant ?? fieldRecipe.defaults.variant, shape: shape ?? fieldRecipe.defaults.shape, align: align ?? fieldRecipe.defaults.align, className: fieldClassName, ...(layoutStyle === undefined ? {} : { layoutStyle }), ...(description ? { descriptionId: ids.descriptionId } : {}), ...(error ? { errorId: ids.errorId } : {}), children: _jsxs("div", { className: "hjm-field__control", children: [leading ? _jsx("span", { className: "hjm-field__affix", children: leading }) : null, _jsx("input", { ...props, ref: composeRefs(control, ref), id: ids.controlId, className: classNames("hjm-field__input", className), required: required, disabled: disabled, "aria-invalid": error ? true : ariaInvalid, "aria-label": ariaLabel, "aria-describedby": describedBy(ariaDescribedBy, description, error, ids.descriptionId, ids.errorId), onFocus: handleFocus, onBlur: handleBlur, onChange: (event) => {
-                        onChange?.(event);
-                        onValueChange?.(event.currentTarget.value);
-                    } }), trailing ? _jsx("span", { className: "hjm-field__affix", children: trailing }) : null] }) }));
+    return (_jsxs(FieldFrame, { controlId: ids.controlId, label: label, description: description, error: error, required: required ?? false, disabled: disabled ?? false, focused: focused, invalid: isAriaInvalid(ariaInvalid) || count.state?.status === "over", variant: variant ?? fieldRecipe.defaults.variant, shape: shape ?? fieldRecipe.defaults.shape, align: align ?? fieldRecipe.defaults.align, className: fieldClassName, ...(layoutStyle === undefined ? {} : { layoutStyle }), ...(description ? { descriptionId: ids.descriptionId } : {}), ...(error ? { errorId: ids.errorId } : {}), children: [_jsxs("div", { className: "hjm-field__control", children: [leading ? _jsx("span", { className: "hjm-field__affix", children: leading }) : null, _jsx("input", { ...props, ref: composeRefs(control, ref), id: ids.controlId, className: classNames("hjm-field__input", className), required: required, disabled: disabled, ...(count.maxLength === undefined ? {} : { maxLength: count.maxLength }), "aria-invalid": error || count.state?.status === "over" ? true : ariaInvalid, "aria-label": ariaLabel, "aria-describedby": describedBy([ariaDescribedBy, count.state ? countId : undefined].filter(Boolean).join(" ") || undefined, description, error, ids.descriptionId, ids.errorId), onFocus: handleFocus, onBlur: handleBlur, onChange: (event) => {
+                            setDraft(event.currentTarget.value);
+                            onChange?.(event);
+                            onValueChange?.(event.currentTarget.value);
+                        } }), trailing ? _jsx("span", { className: "hjm-field__affix", children: trailing }) : null] }), count.state ? _jsx(CharacterCountRow, { id: countId, state: count.state, announcement: count.announcement }) : null] }));
 });
-export const TextArea = forwardRef(function TextArea({ id, label, description, error, required, disabled, variant, shape, trailing, leadingAction, align, fieldClassName, className, onFocus, onBlur, "aria-describedby": ariaDescribedBy, "aria-invalid": ariaInvalid, "aria-label": ariaLabel, minVisibleLines, maxVisibleLines, style, layoutStyle, initialFocusTarget, ...props }, ref) {
+export const TextArea = forwardRef(function TextArea({ id, label, description, error, required, disabled, variant, shape, trailing, leadingAction, align, fieldClassName, className, onFocus, onBlur, "aria-describedby": ariaDescribedBy, "aria-invalid": ariaInvalid, "aria-label": ariaLabel, minVisibleLines, maxVisibleLines, style, layoutStyle, initialFocusTarget, characterCount, maxLength: ownMaxLength, onChange, ...props }, ref) {
     const ids = useFieldIds(id);
     const [focused, setFocused] = useState(false);
     requireFieldAccessibleName(label, ariaLabel);
+    const [countedValue, setDraft] = useDraftValue(props.value, props.defaultValue);
+    const count = useCharacterCount(characterCount, countedValue, ownMaxLength);
+    const countId = `${ids.controlId}-count`;
     const control = useRef(null);
     useInitialFocusTarget(control, initialFocusTarget);
     // Bounds are expressed in lines so the recipe keeps line height and padding.
@@ -114,13 +153,16 @@ export const TextArea = forwardRef(function TextArea({ id, label, description, e
             ? {}
             : { "--hjm-field-max-visible-lines": maxVisibleLines }),
     };
-    return (_jsx(FieldFrame, { controlId: ids.controlId, label: label, description: description, error: error, required: required ?? false, disabled: disabled ?? false, focused: focused, invalid: isAriaInvalid(ariaInvalid), variant: variant ?? fieldRecipe.defaults.variant, shape: shape ?? fieldRecipe.defaults.shape, align: align ?? fieldRecipe.defaults.align, className: fieldClassName, ...(layoutStyle === undefined ? {} : { layoutStyle }), ...(description ? { descriptionId: ids.descriptionId } : {}), ...(error ? { errorId: ids.errorId } : {}), children: _jsxs("div", { className: "hjm-field__control hjm-field__control--multiline", children: [leadingAction ? _jsx("span", { className: "hjm-field__leading", children: leadingAction }) : null, _jsx("textarea", { ...props, ref: composeRefs(control, ref), id: ids.controlId, className: classNames("hjm-field__input", className), style: { ...style, ...lineBounds }, required: required, disabled: disabled, "aria-invalid": error ? true : ariaInvalid, "aria-label": ariaLabel, "aria-describedby": describedBy(ariaDescribedBy, description, error, ids.descriptionId, ids.errorId), onFocus: (event) => {
-                        setFocused(true);
-                        onFocus?.(event);
-                    }, onBlur: (event) => {
-                        setFocused(false);
-                        onBlur?.(event);
-                    } }), trailing ? _jsx("span", { className: "hjm-field__trailing", children: trailing }) : null] }) }));
+    return (_jsxs(FieldFrame, { controlId: ids.controlId, label: label, description: description, error: error, required: required ?? false, disabled: disabled ?? false, focused: focused, invalid: isAriaInvalid(ariaInvalid) || count.state?.status === "over", variant: variant ?? fieldRecipe.defaults.variant, shape: shape ?? fieldRecipe.defaults.shape, align: align ?? fieldRecipe.defaults.align, className: fieldClassName, ...(layoutStyle === undefined ? {} : { layoutStyle }), ...(description ? { descriptionId: ids.descriptionId } : {}), ...(error ? { errorId: ids.errorId } : {}), children: [_jsxs("div", { className: "hjm-field__control hjm-field__control--multiline", children: [leadingAction ? _jsx("span", { className: "hjm-field__leading", children: leadingAction }) : null, _jsx("textarea", { ...props, ref: composeRefs(control, ref), id: ids.controlId, className: classNames("hjm-field__input", className), style: { ...style, ...lineBounds }, required: required, disabled: disabled, ...(count.maxLength === undefined ? {} : { maxLength: count.maxLength }), "aria-invalid": error || count.state?.status === "over" ? true : ariaInvalid, "aria-label": ariaLabel, "aria-describedby": describedBy([ariaDescribedBy, count.state ? countId : undefined].filter(Boolean).join(" ") || undefined, description, error, ids.descriptionId, ids.errorId), onChange: (event) => {
+                            setDraft(event.currentTarget.value);
+                            onChange?.(event);
+                        }, onFocus: (event) => {
+                            setFocused(true);
+                            onFocus?.(event);
+                        }, onBlur: (event) => {
+                            setFocused(false);
+                            onBlur?.(event);
+                        } }), trailing ? _jsx("span", { className: "hjm-field__trailing", children: trailing }) : null] }), count.state ? _jsx(CharacterCountRow, { id: countId, state: count.state, announcement: count.announcement }) : null] }));
 });
 export const SearchField = forwardRef(function SearchField({ value: valueProp, defaultValue = "", onValueChange, onChange, size = searchFieldRecipe.defaults.size, clearLabel, onClear, loading = false, renderSearchIcon, renderClearIcon, renderLoadingIndicator, leading, trailing, fieldClassName, disabled, "aria-busy": ariaBusy, ...props }, forwardedRef) {
     const [value, setValue] = useControllableState({