@flanksource/clicky-ui 0.3.39 → 0.3.41

package/dist/components/JsonSchemaForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"JsonSchemaForm.js","sources":["../../src/components/JsonSchemaForm.tsx"],"sourcesContent":["import { useEffect, useMemo, useState } from \"react\";\nimport { cn } from \"../lib/utils\";\nimport { Icon } from \"../data/Icon\";\nimport { UiCheck, UiEllipsisBold } from \"../icons\";\nimport { FormFieldFilter } from \"./json-schema-form-filter-input\";\nimport { DropdownMenu } from \"../overlay/DropdownMenu\";\nimport { FieldsGrid } from \"./json-schema-form-layout\";\nimport { FormErrorSummary } from \"./json-schema-form-error-display\";\nimport { unmatchedFormErrors } from \"./json-schema-form-errors\";\nimport { FormLookupProvider } from \"./FormLookupProvider\";\nimport { DiscriminatedForm } from \"./json-schema-form-discriminator\";\nimport { rehydrateRefs } from \"./json-schema-form-refs\";\nimport { renderApi, renderObjectFields } from \"./json-schema-form-render\";\nimport { applySchemaDefaults } from \"./json-schema-form-resolve\";\nimport {\n  cssLength,\n  DEFAULT_COLUMN_MIN_WIDTH,\n  normalizeColumns,\n} from \"./json-schema-form-utils\";\nimport { DEFAULT_FORM_SIZE, fieldInnerGapClass, labelSizeClass, type FormSize } from \"./json-schema-form-size\";\nimport {\n  DEFAULT_PREFERENCES_STORAGE_KEY,\n  readPreferences,\n  writePreferences,\n  type FormPreferences,\n  type LayoutMode,\n  type SortMode,\n} from \"./json-schema-form-preferences\";\nimport type { FormLayout, JsonSchemaFormProps, RenderContext } from \"./json-schema-form-types\";\n\nconst DEFAULT_LABEL_MAX_WIDTH = \"40ch\";\nconst DEFAULT_VALUE_MAX_WIDTH = \"600px\";\n\n// resolveFormLayout maps the `layout`/`inline` props plus an optional menu-driven\n// `modeOverride` to a single resolved FormLayout. An explicit `layout` sets the\n// base; `inline` is the shorthand for it; `modeOverride` (from the preferences\n// menu) wins over both but only flips the mode — width caps from `layout` are\n// preserved. Both modes fill valueMaxWidth (inline value column / stacked\n// label+value stack); the label cap only applies inline.\nfunction resolveFormLayout(\n  layout: FormLayout | undefined,\n  inline: boolean,\n  modeOverride: LayoutMode | undefined,\n): FormLayout {\n  const baseMode = layout?.mode ?? (inline ? \"inline\" : \"stacked\");\n  const mode = modeOverride ?? baseMode;\n  const valueMaxWidth = layout?.valueMaxWidth ?? DEFAULT_VALUE_MAX_WIDTH;\n  // `help` is orthogonal to mode, so it survives a menu-driven mode flip.\n  const help = layout?.help ? { help: layout.help } : {};\n  if (mode === \"properties\") return { ...layout, mode, ...help };\n  if (mode !== \"inline\") return { mode: \"stacked\", valueMaxWidth, ...help };\n  return {\n    mode: \"inline\",\n    labelMaxWidth: layout?.labelMaxWidth ?? DEFAULT_LABEL_MAX_WIDTH,\n    valueMaxWidth,\n    ...help,\n  };\n}\n\n// JsonSchemaForm renders an object subschema as a form: one control per\n// (effective) property. It resolves if/then conditionals internally and recurses\n// through array items and object/map values; every other behaviour is layered on\n// by the pre/post extension functions the consumer supplies. The component holds\n// no domain knowledge.\nexport function JsonSchemaForm({\n  schema,\n  value,\n  onChange,\n  rootValue,\n  onRootChange,\n  instancePath = \"\",\n  errors = [],\n  readOnly = false,\n  inline = false,\n  layout,\n  size = DEFAULT_FORM_SIZE,\n  idPrefix,\n  hideReadOnlyFields = false,\n  hideEmpty = false,\n  autoSave = false,\n  hiddenKeys,\n  requiredFirst = false,\n  title,\n  pre,\n  post,\n  showPreferencesMenu = true,\n  showFilter,\n  persistPreferences = true,\n  preferencesStorageKey = DEFAULT_PREFERENCES_STORAGE_KEY,\n  lookupFetcher,\n  applyDefaults = true,\n}: JsonSchemaFormProps) {\n  // When the menu is hidden, never touch localStorage and start from an empty\n  // override so behaviour is identical to before this feature existed.\n  const [prefs, setPrefs] = useState<FormPreferences>(() =>\n    showPreferencesMenu && persistPreferences ? readPreferences(preferencesStorageKey) : {},\n  );\n  // The field filter is transient view state (a \"find\" over the fields), never\n  // persisted — reopening the form should never start with fields hidden.\n  const [fieldFilter, setFieldFilter] = useState(\"\");\n\n  const effectiveSize = prefs.size ?? size;\n  const resolvedLayout = resolveFormLayout(layout, inline, prefs.layoutMode);\n  const filterVisible = showFilter ?? (showPreferencesMenu && resolvedLayout.mode === \"properties\");\n  // The `requiredFirst` prop sets the base sort; a menu selection overrides it.\n  const effectiveSortMode = prefs.sortMode ?? (requiredFirst ? \"required-first\" : \"schema\");\n\n  const applyPrefs = (next: FormPreferences) => {\n    setPrefs(next);\n    if (persistPreferences) writePreferences(preferencesStorageKey, next);\n  };\n\n  // A bundled schema (components under `$defs`, referenced by local `#/$defs`\n  // pointers) is resolved once into a self-contained tree the renderer walks\n  // directly; a non-bundled schema passes through untouched.\n  const resolvedSchema = useMemo(() => rehydrateRefs(schema), [schema]);\n  // Suppressing at the value (not only at the commit effect below) is deliberate:\n  // renderObjectFields spreads `effectiveValue` when a single field changes, so a\n  // render-only application would still leak the defaults on the first edit.\n  const effectiveValue = useMemo(\n    () => (applyDefaults ? applySchemaDefaults(resolvedSchema, value) : value),\n    [applyDefaults, resolvedSchema, value],\n  );\n  const preExtensions = pre ?? [];\n  const unmatchedErrors = useMemo(\n    () =>\n      unmatchedFormErrors({\n        schema: resolvedSchema,\n        value: effectiveValue,\n        errors,\n        hideReadOnlyFields,\n        hideEmpty,\n        pre: preExtensions,\n        rootValue: rootValue ?? effectiveValue,\n        instancePath,\n        ...(hiddenKeys ? { hiddenKeys } : {}),\n        ...(fieldFilter.trim() ? { fieldFilter: fieldFilter.trim() } : {}),\n      }),\n    [effectiveValue, errors, fieldFilter, hiddenKeys, hideEmpty, hideReadOnlyFields, instancePath, preExtensions, resolvedSchema, rootValue],\n  );\n  // Defaults are part of the submitted form value, not only presentation. This\n  // is especially important for required discriminator fields whose default\n  // selects an if/then branch.\n  useEffect(() => {\n    if (!readOnly && effectiveValue !== value) onChange(effectiveValue);\n  }, [effectiveValue, onChange, readOnly, value]);\n\n  const ctx: RenderContext = {\n    readOnly,\n    hideReadOnlyFields,\n    hideEmpty,\n    autoSave,\n    layout: resolvedLayout,\n    size: effectiveSize,\n    sortMode: effectiveSortMode,\n    pre: preExtensions,\n    post: post ?? [],\n    rootValue: rootValue ?? effectiveValue,\n    onRootChange: onRootChange ?? onChange,\n    instancePath,\n    errors,\n    depth: 0,\n    render: renderApi,\n    ...(idPrefix ? { idPrefix } : {}),\n    ...(fieldFilter.trim() ? { fieldFilter: fieldFilter.trim() } : {}),\n  };\n  // A schema may name a discriminator property whose value selects a \"kind\"; the\n  // form then runs a two-phase pick-then-fill flow (see DiscriminatedForm).\n  const discKey = typeof resolvedSchema[\"x-discriminator\"] === \"string\" ? resolvedSchema[\"x-discriminator\"] : undefined;\n  const inPickerPhase = discKey != null && (effectiveValue[discKey] == null || effectiveValue[discKey] === \"\");\n\n  const objectRows = discKey\n    ? null\n    : renderObjectFields(resolvedSchema, effectiveValue, onChange, ctx, hiddenKeys ? { hiddenKeys } : undefined);\n  const noMatches = objectRows != null && objectRows.length === 0 && fieldFilter.trim() !== \"\";\n\n  return (\n    <FormLookupProvider {...(lookupFetcher ? { fetcher: lookupFetcher } : {})}>\n      <div data-json-schema-form className={cn(\"relative flex flex-col\", fieldInnerGapClass[effectiveSize])}>\n        {showPreferencesMenu && !inPickerPhase && (\n          <PreferencesMenu\n            size={effectiveSize}\n            layoutMode={resolvedLayout.mode}\n            sortMode={effectiveSortMode}\n            fieldFilter={fieldFilter}\n            filterInMenu={!filterVisible}\n            onFilterChange={setFieldFilter}\n            onSelectSize={(next) => applyPrefs({ ...prefs, size: next })}\n            onSelectLayout={(next) => applyPrefs({ ...prefs, layoutMode: next })}\n            onSelectSort={(next) => applyPrefs({ ...prefs, sortMode: next })}\n          />\n        )}\n        {title && <h3 className={cn(\"font-semibold\", labelSizeClass[effectiveSize])}>{title}</h3>}\n        {filterVisible && !inPickerPhase && (\n          <div className=\"max-w-md pr-9\">\n            <FormFieldFilter value={fieldFilter} onChange={setFieldFilter} />\n          </div>\n        )}\n        <FormErrorSummary errors={unmatchedErrors} />\n        <FieldsGrid\n          layout={resolvedLayout}\n          size={effectiveSize}\n          columns={normalizeColumns(resolvedSchema[\"x-columns\"])}\n          columnMinWidth={cssLength(resolvedSchema[\"x-column-min-width\"], DEFAULT_COLUMN_MIN_WIDTH)}\n          {...(typeof resolvedSchema[\"x-columns-max-width\"] === \"string\"\n            ? { columnsMaxWidth: resolvedSchema[\"x-columns-max-width\"] }\n            : {})}\n          {...(typeof resolvedSchema[\"x-classes\"] === \"string\" ? { className: resolvedSchema[\"x-classes\"] } : {})}\n        >\n          {discKey ? (\n            <DiscriminatedForm\n              schema={resolvedSchema}\n              value={effectiveValue}\n              onChange={onChange}\n              ctx={ctx}\n              discKey={discKey}\n            />\n          ) : (\n            objectRows\n          )}\n        </FieldsGrid>\n        {noMatches && (\n          <p className={cn(\"text-muted-foreground\", labelSizeClass[effectiveSize])}>\n            No fields match “{fieldFilter.trim()}”.\n          </p>\n        )}\n      </div>\n    </FormLookupProvider>\n  );\n}\n\nconst SIZE_OPTIONS: { value: FormSize; label: string }[] = [\n  { value: \"xs\", label: \"Extra small\" },\n  { value: \"sm\", label: \"Small\" },\n  { value: \"md\", label: \"Medium\" },\n  { value: \"lg\", label: \"Large\" },\n  { value: \"xl\", label: \"Extra large\" },\n];\n\nconst LAYOUT_OPTIONS: { value: LayoutMode; label: string }[] = [\n  { value: \"stacked\", label: \"Stacked\" },\n  { value: \"inline\", label: \"Inline\" },\n  { value: \"properties\", label: \"Properties\" },\n];\n\nconst SORT_OPTIONS: { value: SortMode; label: string }[] = [\n  { value: \"schema\", label: \"Schema order\" },\n  { value: \"required-first\", label: \"Required first\" },\n  { value: \"priority\", label: \"Required & filled first\" },\n];\n\n// PreferencesMenu is the compact top-right ellipsis menu controlling this form's\n// size, layout, sort, and a live field filter. Selecting an option fires the\n// matching callback and closes the menu; typing in the filter updates fields\n// live without closing. The parent decides whether to persist.\nfunction PreferencesMenu({\n  size,\n  layoutMode,\n  sortMode,\n  fieldFilter,\n  filterInMenu,\n  onFilterChange,\n  onSelectSize,\n  onSelectLayout,\n  onSelectSort,\n}: {\n  size: FormSize;\n  layoutMode: LayoutMode;\n  sortMode: SortMode;\n  fieldFilter: string;\n  filterInMenu: boolean;\n  onFilterChange: (value: string) => void;\n  onSelectSize: (size: FormSize) => void;\n  onSelectLayout: (mode: LayoutMode) => void;\n  onSelectSort: (mode: SortMode) => void;\n}) {\n  const filterActive = fieldFilter.trim() !== \"\";\n  return (\n    <DropdownMenu\n      align=\"right\"\n      menuLabel=\"Form display options\"\n      className=\"absolute right-0 top-0 z-10\"\n      trigger={\n        <button\n          type=\"button\"\n          aria-label=\"Form display options\"\n          aria-haspopup=\"menu\"\n          className={cn(\n            \"inline-flex h-7 w-7 items-center justify-center rounded-md transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\",\n            filterActive ? \"text-primary\" : \"text-muted-foreground hover:text-foreground\",\n          )}\n        >\n          <Icon icon={UiEllipsisBold} className=\"text-lg\" />\n        </button>\n      }\n    >\n      {(closeMenu) => (\n        <>\n          {filterInMenu && <div className=\"px-2 pb-1.5 pt-1\">\n            <FormFieldFilter value={fieldFilter} onChange={onFilterChange} />\n          </div>}\n          <PreferenceSection title=\"Size\" />\n          {SIZE_OPTIONS.map((opt) => (\n            <PreferenceItem\n              key={opt.value}\n              label={opt.label}\n              selected={opt.value === size}\n              onSelect={() => {\n                onSelectSize(opt.value);\n                closeMenu();\n              }}\n            />\n          ))}\n          <PreferenceSection title=\"Layout\" />\n          {LAYOUT_OPTIONS.map((opt) => (\n            <PreferenceItem\n              key={opt.value}\n              label={opt.label}\n              selected={opt.value === layoutMode}\n              onSelect={() => {\n                onSelectLayout(opt.value);\n                closeMenu();\n              }}\n            />\n          ))}\n          <PreferenceSection title=\"Sort\" />\n          {SORT_OPTIONS.map((opt) => (\n            <PreferenceItem\n              key={opt.value}\n              label={opt.label}\n              selected={opt.value === sortMode}\n              onSelect={() => {\n                onSelectSort(opt.value);\n                closeMenu();\n              }}\n            />\n          ))}\n        </>\n      )}\n    </DropdownMenu>\n  );\n}\n\nfunction PreferenceSection({ title }: { title: string }) {\n  return (\n    <div className=\"px-3 pb-1 pt-2 text-[10px] font-semibold uppercase tracking-wide text-muted-foreground\">\n      {title}\n    </div>\n  );\n}\n\nfunction PreferenceItem({ label, selected, onSelect }: { label: string; selected: boolean; onSelect: () => void }) {\n  return (\n    <button\n      type=\"button\"\n      role=\"menuitemradio\"\n      aria-checked={selected}\n      className=\"flex w-full items-center gap-2 px-3 py-1.5 text-left text-xs text-popover-foreground hover:bg-accent hover:text-accent-foreground\"\n      onClick={onSelect}\n    >\n      <span className=\"flex w-3.5 shrink-0 justify-center\">\n        {selected && <Icon icon={UiCheck} className=\"text-xs\" />}\n      </span>\n      {label}\n    </button>\n  );\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"JsonSchemaForm.js","sources":["../../src/components/JsonSchemaForm.tsx"],"sourcesContent":["import { useEffect, useMemo, useState } from \"react\";\nimport { cn } from \"../lib/utils\";\nimport { Icon } from \"../data/Icon\";\nimport { UiCheck, UiEllipsisBold } from \"../icons\";\nimport { FormFieldFilter } from \"./json-schema-form-filter-input\";\nimport { DropdownMenu } from \"../overlay/DropdownMenu\";\nimport { FieldsGrid } from \"./json-schema-form-layout\";\nimport { FormErrorSummary } from \"./json-schema-form-error-display\";\nimport { unmatchedFormErrors } from \"./json-schema-form-errors\";\nimport { FormLookupProvider } from \"./FormLookupProvider\";\nimport { DiscriminatedForm } from \"./json-schema-form-discriminator\";\nimport { rehydrateRefs } from \"./json-schema-form-refs\";\nimport { renderApi, renderObjectFields } from \"./json-schema-form-render\";\nimport { applySchemaDefaults } from \"./json-schema-form-defaults\";\nimport {\n  cssLength,\n  DEFAULT_COLUMN_MIN_WIDTH,\n  normalizeColumns,\n} from \"./json-schema-form-utils\";\nimport { DEFAULT_FORM_SIZE, fieldInnerGapClass, labelSizeClass, type FormSize } from \"./json-schema-form-size\";\nimport {\n  DEFAULT_PREFERENCES_STORAGE_KEY,\n  readPreferences,\n  writePreferences,\n  type FormPreferences,\n  type LayoutMode,\n  type SortMode,\n} from \"./json-schema-form-preferences\";\nimport type { FormLayout, JsonSchemaFormProps, RenderContext } from \"./json-schema-form-types\";\n\nconst DEFAULT_LABEL_MAX_WIDTH = \"40ch\";\nconst DEFAULT_VALUE_MAX_WIDTH = \"600px\";\n\n// resolveFormLayout maps the `layout`/`inline` props plus an optional menu-driven\n// `modeOverride` to a single resolved FormLayout. An explicit `layout` sets the\n// base; `inline` is the shorthand for it; `modeOverride` (from the preferences\n// menu) wins over both but only flips the mode — width caps from `layout` are\n// preserved. Both modes fill valueMaxWidth (inline value column / stacked\n// label+value stack); the label cap only applies inline.\nfunction resolveFormLayout(\n  layout: FormLayout | undefined,\n  inline: boolean,\n  modeOverride: LayoutMode | undefined,\n): FormLayout {\n  const baseMode = layout?.mode ?? (inline ? \"inline\" : \"stacked\");\n  const mode = modeOverride ?? baseMode;\n  const valueMaxWidth = layout?.valueMaxWidth ?? DEFAULT_VALUE_MAX_WIDTH;\n  // `help` is orthogonal to mode, so it survives a menu-driven mode flip.\n  const help = layout?.help ? { help: layout.help } : {};\n  if (mode === \"properties\") return { ...layout, mode, ...help };\n  if (mode !== \"inline\") return { mode: \"stacked\", valueMaxWidth, ...help };\n  return {\n    mode: \"inline\",\n    labelMaxWidth: layout?.labelMaxWidth ?? DEFAULT_LABEL_MAX_WIDTH,\n    valueMaxWidth,\n    ...help,\n  };\n}\n\n// JsonSchemaForm renders an object subschema as a form: one control per\n// (effective) property. It resolves if/then conditionals internally and recurses\n// through array items and object/map values; every other behaviour is layered on\n// by the pre/post extension functions the consumer supplies. The component holds\n// no domain knowledge.\nexport function JsonSchemaForm({\n  schema,\n  value,\n  onChange,\n  rootValue,\n  onRootChange,\n  instancePath = \"\",\n  errors = [],\n  readOnly = false,\n  inline = false,\n  layout,\n  size = DEFAULT_FORM_SIZE,\n  idPrefix,\n  hideReadOnlyFields = false,\n  hideEmpty = false,\n  autoSave = false,\n  hiddenKeys,\n  requiredFirst = false,\n  title,\n  pre,\n  post,\n  showPreferencesMenu = true,\n  showFilter,\n  persistPreferences = true,\n  preferencesStorageKey = DEFAULT_PREFERENCES_STORAGE_KEY,\n  lookupFetcher,\n  expressionEvaluator,\n  applyDefaults = true,\n}: JsonSchemaFormProps) {\n  // When the menu is hidden, never touch localStorage and start from an empty\n  // override so behaviour is identical to before this feature existed.\n  const [prefs, setPrefs] = useState<FormPreferences>(() =>\n    showPreferencesMenu && persistPreferences ? readPreferences(preferencesStorageKey) : {},\n  );\n  // The field filter is transient view state (a \"find\" over the fields), never\n  // persisted — reopening the form should never start with fields hidden.\n  const [fieldFilter, setFieldFilter] = useState(\"\");\n\n  const effectiveSize = prefs.size ?? size;\n  const resolvedLayout = resolveFormLayout(layout, inline, prefs.layoutMode);\n  const filterVisible = showFilter ?? (showPreferencesMenu && resolvedLayout.mode === \"properties\");\n  // The `requiredFirst` prop sets the base sort; a menu selection overrides it.\n  const effectiveSortMode = prefs.sortMode ?? (requiredFirst ? \"required-first\" : \"schema\");\n\n  const applyPrefs = (next: FormPreferences) => {\n    setPrefs(next);\n    if (persistPreferences) writePreferences(preferencesStorageKey, next);\n  };\n\n  // A bundled schema (components under `$defs`, referenced by local `#/$defs`\n  // pointers) is resolved once into a self-contained tree the renderer walks\n  // directly; a non-bundled schema passes through untouched.\n  const resolvedSchema = useMemo(() => rehydrateRefs(schema), [schema]);\n  // Suppressing at the value (not only at the commit effect below) is deliberate:\n  // renderObjectFields spreads `effectiveValue` when a single field changes, so a\n  // render-only application would still leak the defaults on the first edit.\n  const effectiveValue = useMemo(\n    () => (applyDefaults ? applySchemaDefaults(resolvedSchema, value) : value),\n    [applyDefaults, resolvedSchema, value],\n  );\n  const preExtensions = pre ?? [];\n  const unmatchedErrors = useMemo(\n    () =>\n      unmatchedFormErrors({\n        schema: resolvedSchema,\n        value: effectiveValue,\n        errors,\n        viewOnly: readOnly,\n        hideReadOnlyFields,\n        hideEmpty,\n        pre: preExtensions,\n        rootValue: rootValue ?? effectiveValue,\n        instancePath,\n        ...(hiddenKeys ? { hiddenKeys } : {}),\n        ...(fieldFilter.trim() ? { fieldFilter: fieldFilter.trim() } : {}),\n        ...(expressionEvaluator ? { expressionEvaluator } : {}),\n      }),\n    [effectiveValue, errors, expressionEvaluator, fieldFilter, hiddenKeys, hideEmpty, hideReadOnlyFields, instancePath, preExtensions, readOnly, resolvedSchema, rootValue],\n  );\n  // Defaults are part of the submitted form value, not only presentation. This\n  // is especially important for required discriminator fields whose default\n  // selects an if/then branch.\n  useEffect(() => {\n    if (!readOnly && effectiveValue !== value) onChange(effectiveValue);\n  }, [effectiveValue, onChange, readOnly, value]);\n\n  const ctx: RenderContext = {\n    readOnly,\n    viewOnly: readOnly,\n    hideReadOnlyFields,\n    hideEmpty,\n    autoSave,\n    layout: resolvedLayout,\n    size: effectiveSize,\n    sortMode: effectiveSortMode,\n    pre: preExtensions,\n    post: post ?? [],\n    rootValue: rootValue ?? effectiveValue,\n    onRootChange: onRootChange ?? onChange,\n    instancePath,\n    errors,\n    depth: 0,\n    render: renderApi,\n    ...(expressionEvaluator ? { expressionEvaluator } : {}),\n    ...(idPrefix ? { idPrefix } : {}),\n    ...(fieldFilter.trim() ? { fieldFilter: fieldFilter.trim() } : {}),\n  };\n  // A schema may name a discriminator property whose value selects a \"kind\"; the\n  // form then runs a two-phase pick-then-fill flow (see DiscriminatedForm).\n  const discKey = typeof resolvedSchema[\"x-discriminator\"] === \"string\" ? resolvedSchema[\"x-discriminator\"] : undefined;\n  const inPickerPhase = discKey != null && (effectiveValue[discKey] == null || effectiveValue[discKey] === \"\");\n\n  const objectRows = discKey\n    ? null\n    : renderObjectFields(resolvedSchema, effectiveValue, onChange, ctx, hiddenKeys ? { hiddenKeys } : undefined);\n  const noMatches = objectRows != null && objectRows.length === 0 && fieldFilter.trim() !== \"\";\n\n  return (\n    <FormLookupProvider {...(lookupFetcher ? { fetcher: lookupFetcher } : {})}>\n      <div data-json-schema-form className={cn(\"relative flex flex-col\", fieldInnerGapClass[effectiveSize])}>\n        {showPreferencesMenu && !inPickerPhase && (\n          <PreferencesMenu\n            size={effectiveSize}\n            layoutMode={resolvedLayout.mode}\n            sortMode={effectiveSortMode}\n            fieldFilter={fieldFilter}\n            filterInMenu={!filterVisible}\n            onFilterChange={setFieldFilter}\n            onSelectSize={(next) => applyPrefs({ ...prefs, size: next })}\n            onSelectLayout={(next) => applyPrefs({ ...prefs, layoutMode: next })}\n            onSelectSort={(next) => applyPrefs({ ...prefs, sortMode: next })}\n          />\n        )}\n        {title && <h3 className={cn(\"font-semibold\", labelSizeClass[effectiveSize])}>{title}</h3>}\n        {filterVisible && !inPickerPhase && (\n          <div className=\"max-w-md pr-9\">\n            <FormFieldFilter value={fieldFilter} onChange={setFieldFilter} />\n          </div>\n        )}\n        <FormErrorSummary errors={unmatchedErrors} />\n        <FieldsGrid\n          layout={resolvedLayout}\n          size={effectiveSize}\n          columns={normalizeColumns(resolvedSchema[\"x-columns\"])}\n          columnMinWidth={cssLength(resolvedSchema[\"x-column-min-width\"], DEFAULT_COLUMN_MIN_WIDTH)}\n          {...(typeof resolvedSchema[\"x-columns-max-width\"] === \"string\"\n            ? { columnsMaxWidth: resolvedSchema[\"x-columns-max-width\"] }\n            : {})}\n          {...(typeof resolvedSchema[\"x-classes\"] === \"string\" ? { className: resolvedSchema[\"x-classes\"] } : {})}\n        >\n          {discKey ? (\n            <DiscriminatedForm\n              schema={resolvedSchema}\n              value={effectiveValue}\n              onChange={onChange}\n              ctx={ctx}\n              discKey={discKey}\n            />\n          ) : (\n            objectRows\n          )}\n        </FieldsGrid>\n        {noMatches && (\n          <p className={cn(\"text-muted-foreground\", labelSizeClass[effectiveSize])}>\n            No fields match “{fieldFilter.trim()}”.\n          </p>\n        )}\n      </div>\n    </FormLookupProvider>\n  );\n}\n\nconst SIZE_OPTIONS: { value: FormSize; label: string }[] = [\n  { value: \"xs\", label: \"Extra small\" },\n  { value: \"sm\", label: \"Small\" },\n  { value: \"md\", label: \"Medium\" },\n  { value: \"lg\", label: \"Large\" },\n  { value: \"xl\", label: \"Extra large\" },\n];\n\nconst LAYOUT_OPTIONS: { value: LayoutMode; label: string }[] = [\n  { value: \"stacked\", label: \"Stacked\" },\n  { value: \"inline\", label: \"Inline\" },\n  { value: \"properties\", label: \"Properties\" },\n];\n\nconst SORT_OPTIONS: { value: SortMode; label: string }[] = [\n  { value: \"schema\", label: \"Schema order\" },\n  { value: \"required-first\", label: \"Required first\" },\n  { value: \"priority\", label: \"Required & filled first\" },\n];\n\n// PreferencesMenu is the compact top-right ellipsis menu controlling this form's\n// size, layout, sort, and a live field filter. Selecting an option fires the\n// matching callback and closes the menu; typing in the filter updates fields\n// live without closing. The parent decides whether to persist.\nfunction PreferencesMenu({\n  size,\n  layoutMode,\n  sortMode,\n  fieldFilter,\n  filterInMenu,\n  onFilterChange,\n  onSelectSize,\n  onSelectLayout,\n  onSelectSort,\n}: {\n  size: FormSize;\n  layoutMode: LayoutMode;\n  sortMode: SortMode;\n  fieldFilter: string;\n  filterInMenu: boolean;\n  onFilterChange: (value: string) => void;\n  onSelectSize: (size: FormSize) => void;\n  onSelectLayout: (mode: LayoutMode) => void;\n  onSelectSort: (mode: SortMode) => void;\n}) {\n  const filterActive = fieldFilter.trim() !== \"\";\n  return (\n    <DropdownMenu\n      align=\"right\"\n      menuLabel=\"Form display options\"\n      className=\"absolute right-0 top-0 z-10\"\n      trigger={\n        <button\n          type=\"button\"\n          aria-label=\"Form display options\"\n          aria-haspopup=\"menu\"\n          className={cn(\n            \"inline-flex h-7 w-7 items-center justify-center rounded-md transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\",\n            filterActive ? \"text-primary\" : \"text-muted-foreground hover:text-foreground\",\n          )}\n        >\n          <Icon icon={UiEllipsisBold} className=\"text-lg\" />\n        </button>\n      }\n    >\n      {(closeMenu) => (\n        <>\n          {filterInMenu && <div className=\"px-2 pb-1.5 pt-1\">\n            <FormFieldFilter value={fieldFilter} onChange={onFilterChange} />\n          </div>}\n          <PreferenceSection title=\"Size\" />\n          {SIZE_OPTIONS.map((opt) => (\n            <PreferenceItem\n              key={opt.value}\n              label={opt.label}\n              selected={opt.value === size}\n              onSelect={() => {\n                onSelectSize(opt.value);\n                closeMenu();\n              }}\n            />\n          ))}\n          <PreferenceSection title=\"Layout\" />\n          {LAYOUT_OPTIONS.map((opt) => (\n            <PreferenceItem\n              key={opt.value}\n              label={opt.label}\n              selected={opt.value === layoutMode}\n              onSelect={() => {\n                onSelectLayout(opt.value);\n                closeMenu();\n              }}\n            />\n          ))}\n          <PreferenceSection title=\"Sort\" />\n          {SORT_OPTIONS.map((opt) => (\n            <PreferenceItem\n              key={opt.value}\n              label={opt.label}\n              selected={opt.value === sortMode}\n              onSelect={() => {\n                onSelectSort(opt.value);\n                closeMenu();\n              }}\n            />\n          ))}\n        </>\n      )}\n    </DropdownMenu>\n  );\n}\n\nfunction PreferenceSection({ title }: { title: string }) {\n  return (\n    <div className=\"px-3 pb-1 pt-2 text-[10px] font-semibold uppercase tracking-wide text-muted-foreground\">\n      {title}\n    </div>\n  );\n}\n\nfunction PreferenceItem({ label, selected, onSelect }: { label: string; selected: boolean; onSelect: () => void }) {\n  return (\n    <button\n      type=\"button\"\n      role=\"menuitemradio\"\n      aria-checked={selected}\n      className=\"flex w-full items-center gap-2 px-3 py-1.5 text-left text-xs text-popover-foreground hover:bg-accent hover:text-accent-foreground\"\n      onClick={onSelect}\n    >\n      <span className=\"flex w-3.5 shrink-0 justify-center\">\n        {selected && <Icon icon={UiCheck} className=\"text-xs\" />}\n      </span>\n      {label}\n    </button>\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/components/ListMenu.d.ts

@@ -1,6 +1,6 @@
 import { HTMLAttributes, ReactNode } from 'react';
-import { ButtonProps } from './button';
-import { ListMenuSelection } from './use-list-menu-selection';
+import { ButtonProps } from './button.js';
+import { ListMenuSelection } from './use-list-menu-selection.js';
 export type ListMenuProps = HTMLAttributes<HTMLDivElement> & {
     /**
      * Enables multi-select. Pass the object returned by `useListMenuSelection`;

package/dist/components/MdxEditorCallout.d.ts

@@ -1,4 +1,4 @@
-import { MdxEditorJsxNode, MdxEditorRuntime } from './mdx-editor-options';
+import { MdxEditorJsxNode, MdxEditorRuntime } from './mdx-editor-options.js';
 /**
  * The callout as the author sees it while editing: the rendered box, with the
  * attributes that decide its tone on a control strip above it.

package/dist/components/MdxEditorField.d.ts

@@ -1,4 +1,4 @@
-import { MdxEditorFieldProps } from './mdx-editor-options';
-export type { MdxEditorAdmonitionOptions, MdxEditorCalloutOptions, MdxEditorCodeBlockEditorContext, MdxEditorCodeBlockEditorDescriptor, MdxEditorCodeBlockEditorProps, MdxEditorCodeBlockLanguage, MdxEditorCodeBlockOptions, MdxEditorCodeMirrorOptions, MdxEditorDiffModeOptions, MdxEditorFieldProps, MdxEditorHeadingLevel, MdxEditorImageOptions, MdxEditorImagePreviewHandler, MdxEditorImageUploadHandler, MdxEditorInsertJsx, MdxEditorJsxAttribute, MdxEditorJsxComponentDescriptor, MdxEditorJsxEditorProps, MdxEditorJsxNode, MdxEditorLinkOptions, MdxEditorPlugin, MdxEditorPluginOptions, MdxEditorRuntime, MdxEditorToolbarOptions, MdxEditorViewMode, } from './mdx-editor-options';
+import { MdxEditorFieldProps } from './mdx-editor-options.js';
+export type { MdxEditorAdmonitionOptions, MdxEditorCalloutOptions, MdxEditorCodeBlockEditorContext, MdxEditorCodeBlockEditorDescriptor, MdxEditorCodeBlockEditorProps, MdxEditorCodeBlockLanguage, MdxEditorCodeBlockOptions, MdxEditorCodeMirrorOptions, MdxEditorDiffModeOptions, MdxEditorFieldProps, MdxEditorHeadingLevel, MdxEditorImageOptions, MdxEditorImagePreviewHandler, MdxEditorImageUploadHandler, MdxEditorInsertJsx, MdxEditorJsxAttribute, MdxEditorJsxComponentDescriptor, MdxEditorJsxEditorProps, MdxEditorJsxNode, MdxEditorLinkOptions, MdxEditorPlugin, MdxEditorPluginOptions, MdxEditorRuntime, MdxEditorToolbarOptions, MdxEditorViewMode, } from './mdx-editor-options.js';
 export declare function MdxEditorField({ id, value, onChange, readOnly, disabled, size, placeholder, className, contentClassName, textareaClassName, "aria-label": ariaLabel, commitInitialMarkdownNormalize, ...pluginOptions }: MdxEditorFieldProps): import("react").JSX.Element;
 //# sourceMappingURL=MdxEditorField.d.ts.map

package/dist/components/MdxEditorToolbar.d.ts

@@ -1,4 +1,4 @@
-import { MdxEditorPluginOptions } from './mdx-editor-options';
+import { MdxEditorPluginOptions } from './mdx-editor-options.js';
 type MdxEditorModule = typeof import("@mdxeditor/editor");
 export declare function MdxEditorToolbar({ mdx, options, }: {
     mdx: MdxEditorModule;

package/dist/components/MultiSelect.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-import { LabelIconSpec } from '../data/Icon';
+import { LabelIconSpec } from '../data/Icon.js';
 export type MultiSelectOption = {
     /** Stable option value written into the selected value array. */
     value: string;

package/dist/components/OnePasswordSelector.d.ts

@@ -1,4 +1,4 @@
-import { OnePasswordLoaders } from './OnePasswordSelector.model';
+import { OnePasswordLoaders } from './OnePasswordSelector.model.js';
 export type OnePasswordSelectorProps = OnePasswordLoaders & {
     value: string;
     onChange: (reference: string) => void;

package/dist/components/ScheduleEditor.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-import { CronSuggestion } from './schedule-types';
+import { CronSuggestion } from './schedule-types.js';
 export interface ScheduleValue {
     cron: string;
     timezone: string;

package/dist/components/SearchInput.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-import { InputFieldInputProps } from './InputField';
+import { InputFieldInputProps } from './InputField.js';
 export type SearchInputProps = Omit<InputFieldInputProps, "onChange" | "prefix" | "type" | "value"> & {
     /** Controlled query value. */
     value: string;

package/dist/components/SecretFormField.d.ts

@@ -1,5 +1,5 @@
-import { FieldControl } from './json-schema-form-types';
-import { SecretFormExtensionOptions } from './secret-form-extension';
+import { FieldControl } from './json-schema-form-types.js';
+import { SecretFormExtensionOptions } from './secret-form-extension.js';
 export type SecretFormFieldProps = SecretFormExtensionOptions & {
     field: FieldControl;
     namespace: string;

package/dist/components/SecretKeySelector.d.ts

@@ -1,4 +1,4 @@
-import { OnePasswordLoaders } from './OnePasswordSelector.model';
+import { OnePasswordLoaders } from './OnePasswordSelector.model.js';
 /** Kinds that reference a named resource plus one of its keys. */
 export type SecretKind = "secret" | "configmap" | "helm";
 /** Every source the picker can emit, including the non-keyed ones. */

package/dist/components/SecretKeySelector.model.d.ts

@@ -1,4 +1,4 @@
-import { SecretKeyValue } from './SecretKeySelector';
+import { SecretKeyValue } from './SecretKeySelector.js';
 export declare function serializeSecretRef(value: SecretKeyValue | undefined): string;
 export declare function parseSecretRef(raw: unknown): SecretKeyValue | undefined;
 //# sourceMappingURL=SecretKeySelector.model.d.ts.map

package/dist/components/SegmentedControl.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-import { StaticIconComponent } from '../data/Icon';
+import { StaticIconComponent } from '../data/Icon.js';
 export type SegmentedSize = "sm" | "md" | "lg";
 export type SegmentedOption<T extends string = string> = {
     /** Stable value emitted on selection. */

package/dist/components/SplitButton.d.ts

@@ -1,7 +1,7 @@
 import { ReactNode } from 'react';
-import { ButtonProps } from './button';
-import { StaticIconComponent } from '../data/Icon';
-import { DropdownMenuItem } from '../overlay/DropdownMenu';
+import { ButtonProps } from './button.js';
+import { StaticIconComponent } from '../data/Icon.js';
+import { DropdownMenuItem } from '../overlay/DropdownMenu.js';
 export type SplitButtonProps = {
     /** Content of the primary action button. */
     label: ReactNode;

package/dist/components/TreePickerField.d.ts

@@ -1,6 +1,6 @@
 import { ReactNode, Ref } from 'react';
-import { TreeProps } from '../data/Tree';
-import { FormSize } from './json-schema-form-size';
+import { TreeProps } from '../data/Tree.js';
+import { FormSize } from './json-schema-form-size.js';
 export interface TreePickerFieldProps<T> {
     /** Root nodes of the tree to browse. */
     roots: T[];

package/dist/components/TriStateToggle.d.ts

@@ -1,4 +1,4 @@
-import { TriState } from './tri-state';
+import { TriState } from './tri-state.js';
 export type { TriState };
 export type TriStateLabels = {
     /** Label for the unset state. Defaults to "Any". */

package/dist/components/WorkloadPicker.d.ts

@@ -1,5 +1,5 @@
-import { NamespacePickerProps } from './NamespacePicker';
-import { WorkloadKind, WorkloadResource } from './workload-picker-utils';
+import { NamespacePickerProps } from './NamespacePicker.js';
+import { WorkloadKind, WorkloadResource } from './workload-picker-utils.js';
 export type WorkloadPickerProps = {
     /**
      * Controlled selected value — a `[namespace/]kind/name` key (see

package/dist/components/button.d.ts

@@ -1,6 +1,6 @@
 import { VariantProps } from 'class-variance-authority';
 import { ButtonHTMLAttributes, ReactNode } from 'react';
-import { buttonVariants } from './button-variants';
+import { buttonVariants } from './button-variants.js';
 export type ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & VariantProps<typeof buttonVariants> & {
     /** Render the button styles onto the child element via Radix Slot. */
     asChild?: boolean;

package/dist/components/combobox-types.d.ts

@@ -1,6 +1,6 @@
 import { KeyboardEvent, ReactNode } from 'react';
-import { LabelIconSpec } from '../data/Icon';
-import { FormSize } from './json-schema-form-size';
+import { LabelIconSpec } from '../data/Icon.js';
+import { FormSize } from './json-schema-form-size.js';
 export type ComboboxOption = {
     value: string;
     /** Full label used for searching and in the open option menu. */

package/dist/components/endpoint-port.d.ts

@@ -1,4 +1,4 @@
-import { WorkloadPort } from './workload-picker-utils';
+import { WorkloadPort } from './workload-picker-utils.js';
 export declare const DEFAULT_PREFERRED_ENDPOINT_PORTS: readonly [80, 443, 8080];
 export declare function preferredEndpointPort(ports: readonly WorkloadPort[] | undefined, preferredPorts?: readonly number[]): string | undefined;
 //# sourceMappingURL=endpoint-port.d.ts.map

package/dist/components/filter-bar-field-utils.d.ts

@@ -1,7 +1,7 @@
 import { ReactNode } from 'react';
-import { FilterMode } from '../data/FilterPill';
-import { LabelIconSpec } from '../data/Icon';
-import { MultiSelectOption } from './MultiSelect';
+import { FilterMode } from '../data/FilterPill.js';
+import { LabelIconSpec } from '../data/Icon.js';
+import { MultiSelectOption } from './MultiSelect.js';
 export type FilterBarMultiFilterMode = Extract<FilterMode, "include" | "exclude">;
 export declare function mergeMultiSelectOptions(head: MultiSelectOption[], extra: MultiSelectOption[]): MultiSelectOption[];
 export declare function multiSelectOptionText(option: MultiSelectOption): string;

package/dist/components/filter-bar-multi.d.ts

@@ -1,7 +1,7 @@
-import { LabelIconSpec } from '../data/Icon';
-import { FilterBarMultiFilterMode } from './filter-bar-field-utils';
-import { MultiSelectOption } from './MultiSelect';
-export type { FilterBarMultiFilterMode } from './filter-bar-field-utils';
+import { LabelIconSpec } from '../data/Icon.js';
+import { FilterBarMultiFilterMode } from './filter-bar-field-utils.js';
+import { MultiSelectOption } from './MultiSelect.js';
+export type { FilterBarMultiFilterMode } from './filter-bar-field-utils.js';
 export type FilterBarMultiFilter = {
     key: string;
     /** Renders include/exclude chips for each option. */

package/dist/components/filter-bar-utils.d.ts

@@ -1,4 +1,4 @@
-import { FilterBarDateRangeFilter, FilterBarFilter, FilterBarRangeProps } from './FilterBar';
+import { FilterBarDateRangeFilter, FilterBarFilter, FilterBarRangeProps } from './FilterBar.js';
 export type FilterExtension = (filter: FilterBarFilter) => FilterBarFilter;
 export declare function applyFilterExtensions(filter: FilterBarFilter, extensions: FilterExtension[] | undefined): FilterBarFilter;
 export declare function dateRangeFilterProps(filter: FilterBarDateRangeFilter): FilterBarRangeProps;

package/dist/components/form-lookup-context.d.ts

@@ -1,4 +1,4 @@
-import { LookupDescriptor, LookupFetcher } from './json-schema-form-types';
+import { LookupDescriptor, LookupFetcher } from './json-schema-form-types.js';
 export declare const FormLookupContext: import('react').Context<LookupFetcher | undefined>;
 export declare function useLookupFetcher(): LookupFetcher | undefined;
 export declare function resolveLookupScope(descriptor: LookupDescriptor, rootValue: Record<string, unknown> | undefined): Record<string, string>;

package/dist/components/format-options.d.ts

@@ -1,4 +1,4 @@
-import { StaticIconComponent } from '../data/Icon';
+import { StaticIconComponent } from '../data/Icon.js';
 export type FormatOption = {
     /** Stable identifier emitted by `onChange`. */
     value: string;

package/dist/components/icon-menu-picker.d.ts

@@ -1,5 +1,5 @@
 import { ReactElement, ReactNode } from 'react';
-import { StaticIconComponent } from '../data/Icon';
+import { StaticIconComponent } from '../data/Icon.js';
 export type IconMenuOption<T extends string> = {
     value: T;
     icon: StaticIconComponent;

package/dist/components/jotai-bindings-core.d.ts

@@ -1,6 +1,6 @@
 import { WritableAtom } from 'jotai';
-import { FilterBarBooleanFilter, FilterBarDurationFilter, FilterBarEnumFilter, FilterBarFilter, FilterBarLookupFilter, FilterBarLookupMultiFilter, FilterBarMultiFilter, FilterBarNestedMultiFilter, FilterBarNumberFilter, FilterBarProps, FilterBarRangeProps, FilterBarSearchProps, FilterBarSelectMultiFilter, FilterBarTextFilter, FilterBarWorkloadFilter } from './FilterBar';
-import { JsonSchemaFormProps } from './json-schema-form-types';
+import { FilterBarBooleanFilter, FilterBarDurationFilter, FilterBarEnumFilter, FilterBarFilter, FilterBarLookupFilter, FilterBarLookupMultiFilter, FilterBarMultiFilter, FilterBarNestedMultiFilter, FilterBarNumberFilter, FilterBarProps, FilterBarRangeProps, FilterBarSearchProps, FilterBarSelectMultiFilter, FilterBarTextFilter, FilterBarWorkloadFilter } from './FilterBar.js';
+import { JsonSchemaFormProps } from './json-schema-form-types.js';
 export type JotaiWritableAtom<Value> = WritableAtom<Value, [Value], unknown>;
 export type JotaiJsonSchemaFormAtom = JotaiWritableAtom<Record<string, unknown>>;
 export type JotaiJsonSchemaFormProps = Omit<JsonSchemaFormProps, "value" | "onChange"> & {

package/dist/components/jotai-bindings.d.ts

@@ -1,4 +1,4 @@
-import { JotaiFilterBarProps, JotaiJsonSchemaFormProps } from './jotai-bindings-core';
+import { JotaiFilterBarProps, JotaiJsonSchemaFormProps } from './jotai-bindings-core.js';
 export declare function JotaiJsonSchemaForm({ atom, onChange, ...props }: JotaiJsonSchemaFormProps): import("react").JSX.Element;
 export declare function JotaiFilterBar(props: JotaiFilterBarProps): import("react").JSX.Element;
 //# sourceMappingURL=jotai-bindings.d.ts.map

package/dist/components/json-schema-form-accordion-array.cjs

@@ -11,7 +11,8 @@ const jsonSchemaFormSize = require("./json-schema-form-size.cjs");
 function AccordionArray({
   field,
   ctx,
-  readOnly
+  readOnly,
+  toolbar
 }) {
   const items = Array.isArray(field.value) ? field.value : [];
   const itemSchema = field.itemSchema ?? { type: "object" };
@@ -72,6 +73,7 @@ function AccordionArray({
       items,
       onChange: (next) => field.onChange(next),
       summary: items.length === 0 ? jsonSchemaFormItemSummary.noItemsLabel(spec) : jsonSchemaFormItemSummary.itemCountLabel(spec, items.length),
+      ...toolbar !== void 0 ? { toolbar } : {},
       size: ctx.size,
       readOnly,
       itemId: (index) => jsonSchemaFormUtils.fieldInputId(jsonSchemaFormErrors.appendInstancePath(ctx.instancePath, index), ctx.idPrefix),

package/dist/components/json-schema-form-accordion-array.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"json-schema-form-accordion-array.cjs","sources":["../../src/components/json-schema-form-accordion-array.tsx"],"sourcesContent":["import { AccordionList } from \"./AccordionList\";\nimport {\n  appendInstancePath,\n  errorCountUnderInstancePath,\n} from \"./json-schema-form-errors\";\nimport {\n  ItemBadge,\n  ItemErrorMark,\n  ItemGlyph,\n  RequiredMark,\n} from \"./json-schema-form-item-row\";\nimport {\n  addItemLabel,\n  emptyItemsCopy,\n  itemActionsAllow,\n  itemCountLabel,\n  itemSummaryFor,\n  noItemsLabel,\n  resolveItemSpec,\n} from \"./json-schema-form-item-summary\";\nimport {\n  canAddItem,\n  canRemoveItem,\n  fieldInputId,\n  seedFromSchema,\n} from \"./json-schema-form-utils\";\nimport { cn } from \"../lib/utils\";\nimport { controlMinHeightClass } from \"./json-schema-form-size\";\nimport type { FieldControl, RenderContext } from \"./json-schema-form-types\";\n\n// AccordionArray is the JsonSchemaForm adapter over AccordionList: it turns\n// `x-item` into row content and the schema's item into a recursive sub-form, and\n// owns nothing structural. Everything about the interaction — one row open at a\n// time, roving focus, the add row that doubles as the empty state — lives in\n// AccordionList, which knows nothing about JSON Schema.\nexport function AccordionArray({\n  field,\n  ctx,\n  readOnly,\n}: {\n  field: FieldControl;\n  ctx: RenderContext;\n  readOnly: boolean;\n}) {\n  const items = Array.isArray(field.value) ? field.value : [];\n  const itemSchema = field.itemSchema ?? { type: \"object\" };\n  const spec = field.itemSpec ?? resolveItemSpec(field.schema, itemSchema);\n  const emptyCopy = emptyItemsCopy(spec, field.schema);\n  // The array's help mode governs its whole subtree. Without this the fields\n  // inside an expanded row keep the form-level default, so an accordion that\n  // resolved to \"hover\" would still stack a two-line paragraph under every\n  // control — the exact height the summary rows exist to reclaim.\n  const childCtx: RenderContext = {\n    ...ctx,\n    readOnly,\n    depth: ctx.depth + 1,\n    ...(field.helpDisplay\n      ? { layout: { ...ctx.layout, help: field.helpDisplay } }\n      : {}),\n  };\n\n  function summaryFor(item: unknown, index: number) {\n    return (\n      field.itemSummary?.({ item, index }) ??\n      itemSummaryFor({ item, index, spec, itemSchema })\n    );\n  }\n\n  function renderSummary({\n    item,\n    index,\n    open,\n  }: {\n    item: unknown;\n    index: number;\n    open: boolean;\n  }) {\n    const summary = summaryFor(item, index);\n    return (\n      <>\n        <ItemGlyph glyph={summary.glyph} />\n        <span className=\"shrink-0 text-sm font-medium\">{summary.title}</span>\n        <ItemBadge badge={summary.badge} />\n        {summary.flagged && <RequiredMark />}\n        {summary.summary && (\n          <code className=\"truncate font-mono text-xs text-muted-foreground\">\n            {summary.summary}\n          </code>\n        )}\n        {!open && (\n          <ItemErrorMark\n            count={errorCountUnderInstancePath(\n              ctx.errors,\n              appendInstancePath(ctx.instancePath, index),\n            )}\n          />\n        )}\n      </>\n    );\n  }\n\n  if (ctx.presentation)\n    return (\n      <div className=\"min-w-0 space-y-1\">\n        <div className=\"text-xs text-muted-foreground\">\n          {items.length === 0\n            ? noItemsLabel(spec)\n            : itemCountLabel(spec, items.length)}\n        </div>\n        {items.map((item, index) => (\n          <div\n            key={index}\n            className={cn(\n              \"flex min-w-0 flex-wrap items-center gap-2 rounded px-2 py-1 even:bg-muted/40\",\n              controlMinHeightClass[ctx.size],\n            )}\n          >\n            {renderSummary({ item, index, open: false })}\n          </div>\n        ))}\n        {items.length === 0 && emptyCopy && (\n          <p className=\"text-xs text-muted-foreground\">{emptyCopy}</p>\n        )}\n      </div>\n    );\n\n  return (\n    <AccordionList<unknown>\n      items={items}\n      onChange={(next) => field.onChange(next)}\n      summary={\n        items.length === 0\n          ? noItemsLabel(spec)\n          : itemCountLabel(spec, items.length)\n      }\n      size={ctx.size}\n      readOnly={readOnly}\n      itemId={(index) =>\n        fieldInputId(appendInstancePath(ctx.instancePath, index), ctx.idPrefix)\n      }\n      // The panel's controls are the form's own inputs; anything else focusable\n      // inside an item (a help disclosure, a remove button on a nested array)\n      // would otherwise win the caret on add.\n      focusSelector=\"[data-jsf-input]\"\n      itemLabel={({ item, index }) => summaryFor(item, index).title}\n      allowReorder={itemActionsAllow(spec, \"reorder\")}\n      allowDuplicate={itemActionsAllow(spec, \"duplicate\")}\n      allowRemove={itemActionsAllow(spec, \"remove\") && canRemoveItem(field, items.length)}\n      // AccordionList shows its add row only when it is given something to\n      // create, so withholding onCreate at maxItems is how the bound reaches it.\n      {...(canAddItem(field, items.length)\n        ? { onCreate: () => seedFromSchema(itemSchema) }\n        : {})}\n      addLabel={addItemLabel(spec)}\n      {...(emptyCopy ? { addDescription: emptyCopy } : {})}\n      renderHeader={renderSummary}\n      renderBody={({ item, index, onChange }) =>\n        // Recurse through the shared pipeline so consumer pre/post extensions\n        // still apply to the item and its properties.\n        ctx.render.renderFieldNodes(\n          {\n            key: `${field.key}[${index}]`,\n            prop: itemSchema,\n            required: false,\n            value: item,\n            onChange,\n            instancePath: appendInstancePath(ctx.instancePath, index),\n          },\n          childCtx,\n        )?.value ?? null\n      }\n    />\n  );\n}\n"],"names":["resolveItemSpec","emptyItemsCopy","itemSummaryFor","jsxs","Fragment","jsx","ItemGlyph","ItemBadge","RequiredMark","ItemErrorMark","errorCountUnderInstancePath","appendInstancePath","noItemsLabel","itemCountLabel","cn","controlMinHeightClass","AccordionList","fieldInputId","itemActionsAllow","canRemoveItem","canAddItem","seedFromSchema","addItemLabel"],"mappings":"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"}
+{"version":3,"file":"json-schema-form-accordion-array.cjs","sources":["../../src/components/json-schema-form-accordion-array.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { AccordionList } from \"./AccordionList\";\nimport {\n  appendInstancePath,\n  errorCountUnderInstancePath,\n} from \"./json-schema-form-errors\";\nimport {\n  ItemBadge,\n  ItemErrorMark,\n  ItemGlyph,\n  RequiredMark,\n} from \"./json-schema-form-item-row\";\nimport {\n  addItemLabel,\n  emptyItemsCopy,\n  itemActionsAllow,\n  itemCountLabel,\n  itemSummaryFor,\n  noItemsLabel,\n  resolveItemSpec,\n} from \"./json-schema-form-item-summary\";\nimport {\n  canAddItem,\n  canRemoveItem,\n  fieldInputId,\n  seedFromSchema,\n} from \"./json-schema-form-utils\";\nimport { cn } from \"../lib/utils\";\nimport { controlMinHeightClass } from \"./json-schema-form-size\";\nimport type { FieldControl, RenderContext } from \"./json-schema-form-types\";\n\n// AccordionArray is the JsonSchemaForm adapter over AccordionList: it turns\n// `x-item` into row content and the schema's item into a recursive sub-form, and\n// owns nothing structural. Everything about the interaction — one row open at a\n// time, roving focus, the add row that doubles as the empty state — lives in\n// AccordionList, which knows nothing about JSON Schema.\nexport function AccordionArray({\n  field,\n  ctx,\n  readOnly,\n  toolbar,\n}: {\n  field: FieldControl;\n  ctx: RenderContext;\n  readOnly: boolean;\n  /** List-level actions for the summary line; see AccordionList. */\n  toolbar?: ReactNode;\n}) {\n  const items = Array.isArray(field.value) ? field.value : [];\n  const itemSchema = field.itemSchema ?? { type: \"object\" };\n  const spec = field.itemSpec ?? resolveItemSpec(field.schema, itemSchema);\n  const emptyCopy = emptyItemsCopy(spec, field.schema);\n  // The array's help mode governs its whole subtree. Without this the fields\n  // inside an expanded row keep the form-level default, so an accordion that\n  // resolved to \"hover\" would still stack a two-line paragraph under every\n  // control — the exact height the summary rows exist to reclaim.\n  const childCtx: RenderContext = {\n    ...ctx,\n    readOnly,\n    depth: ctx.depth + 1,\n    ...(field.helpDisplay\n      ? { layout: { ...ctx.layout, help: field.helpDisplay } }\n      : {}),\n  };\n\n  function summaryFor(item: unknown, index: number) {\n    return (\n      field.itemSummary?.({ item, index }) ??\n      itemSummaryFor({ item, index, spec, itemSchema })\n    );\n  }\n\n  function renderSummary({\n    item,\n    index,\n    open,\n  }: {\n    item: unknown;\n    index: number;\n    open: boolean;\n  }) {\n    const summary = summaryFor(item, index);\n    return (\n      <>\n        <ItemGlyph glyph={summary.glyph} />\n        <span className=\"shrink-0 text-sm font-medium\">{summary.title}</span>\n        <ItemBadge badge={summary.badge} />\n        {summary.flagged && <RequiredMark />}\n        {summary.summary && (\n          <code className=\"truncate font-mono text-xs text-muted-foreground\">\n            {summary.summary}\n          </code>\n        )}\n        {!open && (\n          <ItemErrorMark\n            count={errorCountUnderInstancePath(\n              ctx.errors,\n              appendInstancePath(ctx.instancePath, index),\n            )}\n          />\n        )}\n      </>\n    );\n  }\n\n  if (ctx.presentation)\n    return (\n      <div className=\"min-w-0 space-y-1\">\n        <div className=\"text-xs text-muted-foreground\">\n          {items.length === 0\n            ? noItemsLabel(spec)\n            : itemCountLabel(spec, items.length)}\n        </div>\n        {items.map((item, index) => (\n          <div\n            key={index}\n            className={cn(\n              \"flex min-w-0 flex-wrap items-center gap-2 rounded px-2 py-1 even:bg-muted/40\",\n              controlMinHeightClass[ctx.size],\n            )}\n          >\n            {renderSummary({ item, index, open: false })}\n          </div>\n        ))}\n        {items.length === 0 && emptyCopy && (\n          <p className=\"text-xs text-muted-foreground\">{emptyCopy}</p>\n        )}\n      </div>\n    );\n\n  return (\n    <AccordionList<unknown>\n      items={items}\n      onChange={(next) => field.onChange(next)}\n      summary={\n        items.length === 0\n          ? noItemsLabel(spec)\n          : itemCountLabel(spec, items.length)\n      }\n      {...(toolbar !== undefined ? { toolbar } : {})}\n      size={ctx.size}\n      readOnly={readOnly}\n      itemId={(index) =>\n        fieldInputId(appendInstancePath(ctx.instancePath, index), ctx.idPrefix)\n      }\n      // The panel's controls are the form's own inputs; anything else focusable\n      // inside an item (a help disclosure, a remove button on a nested array)\n      // would otherwise win the caret on add.\n      focusSelector=\"[data-jsf-input]\"\n      itemLabel={({ item, index }) => summaryFor(item, index).title}\n      allowReorder={itemActionsAllow(spec, \"reorder\")}\n      allowDuplicate={itemActionsAllow(spec, \"duplicate\")}\n      allowRemove={itemActionsAllow(spec, \"remove\") && canRemoveItem(field, items.length)}\n      // AccordionList shows its add row only when it is given something to\n      // create, so withholding onCreate at maxItems is how the bound reaches it.\n      {...(canAddItem(field, items.length)\n        ? { onCreate: () => seedFromSchema(itemSchema) }\n        : {})}\n      addLabel={addItemLabel(spec)}\n      {...(emptyCopy ? { addDescription: emptyCopy } : {})}\n      renderHeader={renderSummary}\n      renderBody={({ item, index, onChange }) =>\n        // Recurse through the shared pipeline so consumer pre/post extensions\n        // still apply to the item and its properties.\n        ctx.render.renderFieldNodes(\n          {\n            key: `${field.key}[${index}]`,\n            prop: itemSchema,\n            required: false,\n            value: item,\n            onChange,\n            instancePath: appendInstancePath(ctx.instancePath, index),\n          },\n          childCtx,\n        )?.value ?? null\n      }\n    />\n  );\n}\n"],"names":["resolveItemSpec","emptyItemsCopy","itemSummaryFor","jsxs","Fragment","jsx","ItemGlyph","ItemBadge","RequiredMark","ItemErrorMark","errorCountUnderInstancePath","appendInstancePath","noItemsLabel","itemCountLabel","cn","controlMinHeightClass","AccordionList","fieldInputId","itemActionsAllow","canRemoveItem","canAddItem","seedFromSchema","addItemLabel"],"mappings":";;;;;;;;;;AAoCO,SAAS,eAAe;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAMG;AACD,QAAM,QAAQ,MAAM,QAAQ,MAAM,KAAK,IAAI,MAAM,QAAQ,CAAA;AACzD,QAAM,aAAa,MAAM,cAAc,EAAE,MAAM,SAAA;AAC/C,QAAM,OAAO,MAAM,YAAYA,0BAAAA,gBAAgB,MAAM,QAAQ,UAAU;AACvE,QAAM,YAAYC,0BAAAA,eAAe,MAAM,MAAM,MAAM;AAKnD,QAAM,WAA0B;AAAA,IAC9B,GAAG;AAAA,IACH;AAAA,IACA,OAAO,IAAI,QAAQ;AAAA,IACnB,GAAI,MAAM,cACN,EAAE,QAAQ,EAAE,GAAG,IAAI,QAAQ,MAAM,MAAM,YAAA,EAAY,IACnD,CAAA;AAAA,EAAC;AAGP,WAAS,WAAW,MAAe,OAAe;;AAChD,aACE,WAAM,gBAAN,+BAAoB,EAAE,MAAM,MAAA,OAC5BC,0BAAAA,eAAe,EAAE,MAAM,OAAO,MAAM,YAAY;AAAA,EAEpD;AAEA,WAAS,cAAc;AAAA,IACrB;AAAA,IACA;AAAA,IACA;AAAA,EAAA,GAKC;AACD,UAAM,UAAU,WAAW,MAAM,KAAK;AACtC,WACEC,2BAAAA,KAAAC,qBAAA,EACE,UAAA;AAAA,MAAAC,2BAAAA,IAACC,sBAAAA,WAAA,EAAU,OAAO,QAAQ,MAAA,CAAO;AAAA,MACjCD,2BAAAA,IAAC,QAAA,EAAK,WAAU,gCAAgC,kBAAQ,OAAM;AAAA,MAC9DA,2BAAAA,IAACE,sBAAAA,WAAA,EAAU,OAAO,QAAQ,MAAA,CAAO;AAAA,MAChC,QAAQ,WAAWF,+BAACG,sBAAAA,cAAA,CAAA,CAAa;AAAA,MACjC,QAAQ,WACPH,2BAAAA,IAAC,UAAK,WAAU,oDACb,kBAAQ,SACX;AAAA,MAED,CAAC,QACAA,2BAAAA;AAAAA,QAACI,sBAAAA;AAAAA,QAAA;AAAA,UACC,OAAOC,qBAAAA;AAAAA,YACL,IAAI;AAAA,YACJC,wCAAmB,IAAI,cAAc,KAAK;AAAA,UAAA;AAAA,QAC5C;AAAA,MAAA;AAAA,IACF,GAEJ;AAAA,EAEJ;AAEA,MAAI,IAAI;AACN,WACER,2BAAAA,KAAC,OAAA,EAAI,WAAU,qBACb,UAAA;AAAA,MAAAE,2BAAAA,IAAC,OAAA,EAAI,WAAU,iCACZ,UAAA,MAAM,WAAW,IACdO,0BAAAA,aAAa,IAAI,IACjBC,0BAAAA,eAAe,MAAM,MAAM,MAAM,GACvC;AAAA,MACC,MAAM,IAAI,CAAC,MAAM,UAChBR,2BAAAA;AAAAA,QAAC;AAAA,QAAA;AAAA,UAEC,WAAWS,MAAAA;AAAAA,YACT;AAAA,YACAC,mBAAAA,sBAAsB,IAAI,IAAI;AAAA,UAAA;AAAA,UAG/B,wBAAc,EAAE,MAAM,OAAO,MAAM,OAAO;AAAA,QAAA;AAAA,QANtC;AAAA,MAAA,CAQR;AAAA,MACA,MAAM,WAAW,KAAK,4CACpB,KAAA,EAAE,WAAU,iCAAiC,UAAA,UAAA,CAAU;AAAA,IAAA,GAE5D;AAGJ,SACEV,2BAAAA;AAAAA,IAACW,cAAAA;AAAAA,IAAA;AAAA,MACC;AAAA,MACA,UAAU,CAAC,SAAS,MAAM,SAAS,IAAI;AAAA,MACvC,SACE,MAAM,WAAW,IACbJ,0BAAAA,aAAa,IAAI,IACjBC,yCAAe,MAAM,MAAM,MAAM;AAAA,MAEtC,GAAI,YAAY,SAAY,EAAE,QAAA,IAAY,CAAA;AAAA,MAC3C,MAAM,IAAI;AAAA,MACV;AAAA,MACA,QAAQ,CAAC,UACPI,oBAAAA,aAAaN,qBAAAA,mBAAmB,IAAI,cAAc,KAAK,GAAG,IAAI,QAAQ;AAAA,MAKxE,eAAc;AAAA,MACd,WAAW,CAAC,EAAE,MAAM,YAAY,WAAW,MAAM,KAAK,EAAE;AAAA,MACxD,cAAcO,0BAAAA,iBAAiB,MAAM,SAAS;AAAA,MAC9C,gBAAgBA,0BAAAA,iBAAiB,MAAM,WAAW;AAAA,MAClD,aAAaA,0BAAAA,iBAAiB,MAAM,QAAQ,KAAKC,oBAAAA,cAAc,OAAO,MAAM,MAAM;AAAA,MAGjF,GAAIC,+BAAW,OAAO,MAAM,MAAM,IAC/B,EAAE,UAAU,MAAMC,oBAAAA,eAAe,UAAU,EAAA,IAC3C,CAAA;AAAA,MACJ,UAAUC,0BAAAA,aAAa,IAAI;AAAA,MAC1B,GAAI,YAAY,EAAE,gBAAgB,UAAA,IAAc,CAAA;AAAA,MACjD,cAAc;AAAA,MACd,YAAY,CAAC,EAAE,MAAM,OAAO,SAAA,MAAS;;AAGnC;AAAA;AAAA;AAAA,qBAAI,OAAO;AAAA,YACT;AAAA,cACE,KAAK,GAAG,MAAM,GAAG,IAAI,KAAK;AAAA,cAC1B,MAAM;AAAA,cACN,UAAU;AAAA,cACV,OAAO;AAAA,cACP;AAAA,cACA,cAAcX,qBAAAA,mBAAmB,IAAI,cAAc,KAAK;AAAA,YAAA;AAAA,YAE1D;AAAA,UAAA,MATF,mBAUG,UAAS;AAAA;AAAA;AAAA,IAAA;AAAA,EAAA;AAIpB;;"}

package/dist/components/json-schema-form-accordion-array.d.ts

@@ -1,7 +1,10 @@
-import { FieldControl, RenderContext } from './json-schema-form-types';
-export declare function AccordionArray({ field, ctx, readOnly, }: {
+import { ReactNode } from 'react';
+import { FieldControl, RenderContext } from './json-schema-form-types.js';
+export declare function AccordionArray({ field, ctx, readOnly, toolbar, }: {
     field: FieldControl;
     ctx: RenderContext;
     readOnly: boolean;
+    /** List-level actions for the summary line; see AccordionList. */
+    toolbar?: ReactNode;
 }): import("react").JSX.Element;
 //# sourceMappingURL=json-schema-form-accordion-array.d.ts.map

package/dist/components/json-schema-form-accordion-array.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"json-schema-form-accordion-array.d.ts","sourceRoot":"","sources":["../../src/components/json-schema-form-accordion-array.tsx"],"names":[],"mappings":"AA4BA,OAAO,KAAK,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAO5E,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,GAAG,EACH,QAAQ,GACT,EAAE;IACD,KAAK,EAAE,YAAY,CAAC;IACpB,GAAG,EAAE,aAAa,CAAC;IACnB,QAAQ,EAAE,OAAO,CAAC;CACnB,+BAkIA"}
+{"version":3,"file":"json-schema-form-accordion-array.d.ts","sourceRoot":"","sources":["../../src/components/json-schema-form-accordion-array.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AA6BvC,OAAO,KAAK,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAO5E,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,GAAG,EACH,QAAQ,EACR,OAAO,GACR,EAAE;IACD,KAAK,EAAE,YAAY,CAAC;IACpB,GAAG,EAAE,aAAa,CAAC;IACnB,QAAQ,EAAE,OAAO,CAAC;IAClB,kEAAkE;IAClE,OAAO,CAAC,EAAE,SAAS,CAAC;CACrB,+BAmIA"}

package/dist/components/json-schema-form-accordion-array.js

@@ -9,7 +9,8 @@ import { controlMinHeightClass } from "./json-schema-form-size.js";
 function AccordionArray({
   field,
   ctx,
-  readOnly
+  readOnly,
+  toolbar
 }) {
   const items = Array.isArray(field.value) ? field.value : [];
   const itemSchema = field.itemSchema ?? { type: "object" };
@@ -70,6 +71,7 @@ function AccordionArray({
       items,
       onChange: (next) => field.onChange(next),
       summary: items.length === 0 ? noItemsLabel(spec) : itemCountLabel(spec, items.length),
+      ...toolbar !== void 0 ? { toolbar } : {},
       size: ctx.size,
       readOnly,
       itemId: (index) => fieldInputId(appendInstancePath(ctx.instancePath, index), ctx.idPrefix),

package/dist/components/json-schema-form-accordion-array.js.map

@@ -1 +1 @@
-{"version":3,"file":"json-schema-form-accordion-array.js","sources":["../../src/components/json-schema-form-accordion-array.tsx"],"sourcesContent":["import { AccordionList } from \"./AccordionList\";\nimport {\n  appendInstancePath,\n  errorCountUnderInstancePath,\n} from \"./json-schema-form-errors\";\nimport {\n  ItemBadge,\n  ItemErrorMark,\n  ItemGlyph,\n  RequiredMark,\n} from \"./json-schema-form-item-row\";\nimport {\n  addItemLabel,\n  emptyItemsCopy,\n  itemActionsAllow,\n  itemCountLabel,\n  itemSummaryFor,\n  noItemsLabel,\n  resolveItemSpec,\n} from \"./json-schema-form-item-summary\";\nimport {\n  canAddItem,\n  canRemoveItem,\n  fieldInputId,\n  seedFromSchema,\n} from \"./json-schema-form-utils\";\nimport { cn } from \"../lib/utils\";\nimport { controlMinHeightClass } from \"./json-schema-form-size\";\nimport type { FieldControl, RenderContext } from \"./json-schema-form-types\";\n\n// AccordionArray is the JsonSchemaForm adapter over AccordionList: it turns\n// `x-item` into row content and the schema's item into a recursive sub-form, and\n// owns nothing structural. Everything about the interaction — one row open at a\n// time, roving focus, the add row that doubles as the empty state — lives in\n// AccordionList, which knows nothing about JSON Schema.\nexport function AccordionArray({\n  field,\n  ctx,\n  readOnly,\n}: {\n  field: FieldControl;\n  ctx: RenderContext;\n  readOnly: boolean;\n}) {\n  const items = Array.isArray(field.value) ? field.value : [];\n  const itemSchema = field.itemSchema ?? { type: \"object\" };\n  const spec = field.itemSpec ?? resolveItemSpec(field.schema, itemSchema);\n  const emptyCopy = emptyItemsCopy(spec, field.schema);\n  // The array's help mode governs its whole subtree. Without this the fields\n  // inside an expanded row keep the form-level default, so an accordion that\n  // resolved to \"hover\" would still stack a two-line paragraph under every\n  // control — the exact height the summary rows exist to reclaim.\n  const childCtx: RenderContext = {\n    ...ctx,\n    readOnly,\n    depth: ctx.depth + 1,\n    ...(field.helpDisplay\n      ? { layout: { ...ctx.layout, help: field.helpDisplay } }\n      : {}),\n  };\n\n  function summaryFor(item: unknown, index: number) {\n    return (\n      field.itemSummary?.({ item, index }) ??\n      itemSummaryFor({ item, index, spec, itemSchema })\n    );\n  }\n\n  function renderSummary({\n    item,\n    index,\n    open,\n  }: {\n    item: unknown;\n    index: number;\n    open: boolean;\n  }) {\n    const summary = summaryFor(item, index);\n    return (\n      <>\n        <ItemGlyph glyph={summary.glyph} />\n        <span className=\"shrink-0 text-sm font-medium\">{summary.title}</span>\n        <ItemBadge badge={summary.badge} />\n        {summary.flagged && <RequiredMark />}\n        {summary.summary && (\n          <code className=\"truncate font-mono text-xs text-muted-foreground\">\n            {summary.summary}\n          </code>\n        )}\n        {!open && (\n          <ItemErrorMark\n            count={errorCountUnderInstancePath(\n              ctx.errors,\n              appendInstancePath(ctx.instancePath, index),\n            )}\n          />\n        )}\n      </>\n    );\n  }\n\n  if (ctx.presentation)\n    return (\n      <div className=\"min-w-0 space-y-1\">\n        <div className=\"text-xs text-muted-foreground\">\n          {items.length === 0\n            ? noItemsLabel(spec)\n            : itemCountLabel(spec, items.length)}\n        </div>\n        {items.map((item, index) => (\n          <div\n            key={index}\n            className={cn(\n              \"flex min-w-0 flex-wrap items-center gap-2 rounded px-2 py-1 even:bg-muted/40\",\n              controlMinHeightClass[ctx.size],\n            )}\n          >\n            {renderSummary({ item, index, open: false })}\n          </div>\n        ))}\n        {items.length === 0 && emptyCopy && (\n          <p className=\"text-xs text-muted-foreground\">{emptyCopy}</p>\n        )}\n      </div>\n    );\n\n  return (\n    <AccordionList<unknown>\n      items={items}\n      onChange={(next) => field.onChange(next)}\n      summary={\n        items.length === 0\n          ? noItemsLabel(spec)\n          : itemCountLabel(spec, items.length)\n      }\n      size={ctx.size}\n      readOnly={readOnly}\n      itemId={(index) =>\n        fieldInputId(appendInstancePath(ctx.instancePath, index), ctx.idPrefix)\n      }\n      // The panel's controls are the form's own inputs; anything else focusable\n      // inside an item (a help disclosure, a remove button on a nested array)\n      // would otherwise win the caret on add.\n      focusSelector=\"[data-jsf-input]\"\n      itemLabel={({ item, index }) => summaryFor(item, index).title}\n      allowReorder={itemActionsAllow(spec, \"reorder\")}\n      allowDuplicate={itemActionsAllow(spec, \"duplicate\")}\n      allowRemove={itemActionsAllow(spec, \"remove\") && canRemoveItem(field, items.length)}\n      // AccordionList shows its add row only when it is given something to\n      // create, so withholding onCreate at maxItems is how the bound reaches it.\n      {...(canAddItem(field, items.length)\n        ? { onCreate: () => seedFromSchema(itemSchema) }\n        : {})}\n      addLabel={addItemLabel(spec)}\n      {...(emptyCopy ? { addDescription: emptyCopy } : {})}\n      renderHeader={renderSummary}\n      renderBody={({ item, index, onChange }) =>\n        // Recurse through the shared pipeline so consumer pre/post extensions\n        // still apply to the item and its properties.\n        ctx.render.renderFieldNodes(\n          {\n            key: `${field.key}[${index}]`,\n            prop: itemSchema,\n            required: false,\n            value: item,\n            onChange,\n            instancePath: appendInstancePath(ctx.instancePath, index),\n          },\n          childCtx,\n        )?.value ?? null\n      }\n    />\n  );\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"json-schema-form-accordion-array.js","sources":["../../src/components/json-schema-form-accordion-array.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { AccordionList } from \"./AccordionList\";\nimport {\n  appendInstancePath,\n  errorCountUnderInstancePath,\n} from \"./json-schema-form-errors\";\nimport {\n  ItemBadge,\n  ItemErrorMark,\n  ItemGlyph,\n  RequiredMark,\n} from \"./json-schema-form-item-row\";\nimport {\n  addItemLabel,\n  emptyItemsCopy,\n  itemActionsAllow,\n  itemCountLabel,\n  itemSummaryFor,\n  noItemsLabel,\n  resolveItemSpec,\n} from \"./json-schema-form-item-summary\";\nimport {\n  canAddItem,\n  canRemoveItem,\n  fieldInputId,\n  seedFromSchema,\n} from \"./json-schema-form-utils\";\nimport { cn } from \"../lib/utils\";\nimport { controlMinHeightClass } from \"./json-schema-form-size\";\nimport type { FieldControl, RenderContext } from \"./json-schema-form-types\";\n\n// AccordionArray is the JsonSchemaForm adapter over AccordionList: it turns\n// `x-item` into row content and the schema's item into a recursive sub-form, and\n// owns nothing structural. Everything about the interaction — one row open at a\n// time, roving focus, the add row that doubles as the empty state — lives in\n// AccordionList, which knows nothing about JSON Schema.\nexport function AccordionArray({\n  field,\n  ctx,\n  readOnly,\n  toolbar,\n}: {\n  field: FieldControl;\n  ctx: RenderContext;\n  readOnly: boolean;\n  /** List-level actions for the summary line; see AccordionList. */\n  toolbar?: ReactNode;\n}) {\n  const items = Array.isArray(field.value) ? field.value : [];\n  const itemSchema = field.itemSchema ?? { type: \"object\" };\n  const spec = field.itemSpec ?? resolveItemSpec(field.schema, itemSchema);\n  const emptyCopy = emptyItemsCopy(spec, field.schema);\n  // The array's help mode governs its whole subtree. Without this the fields\n  // inside an expanded row keep the form-level default, so an accordion that\n  // resolved to \"hover\" would still stack a two-line paragraph under every\n  // control — the exact height the summary rows exist to reclaim.\n  const childCtx: RenderContext = {\n    ...ctx,\n    readOnly,\n    depth: ctx.depth + 1,\n    ...(field.helpDisplay\n      ? { layout: { ...ctx.layout, help: field.helpDisplay } }\n      : {}),\n  };\n\n  function summaryFor(item: unknown, index: number) {\n    return (\n      field.itemSummary?.({ item, index }) ??\n      itemSummaryFor({ item, index, spec, itemSchema })\n    );\n  }\n\n  function renderSummary({\n    item,\n    index,\n    open,\n  }: {\n    item: unknown;\n    index: number;\n    open: boolean;\n  }) {\n    const summary = summaryFor(item, index);\n    return (\n      <>\n        <ItemGlyph glyph={summary.glyph} />\n        <span className=\"shrink-0 text-sm font-medium\">{summary.title}</span>\n        <ItemBadge badge={summary.badge} />\n        {summary.flagged && <RequiredMark />}\n        {summary.summary && (\n          <code className=\"truncate font-mono text-xs text-muted-foreground\">\n            {summary.summary}\n          </code>\n        )}\n        {!open && (\n          <ItemErrorMark\n            count={errorCountUnderInstancePath(\n              ctx.errors,\n              appendInstancePath(ctx.instancePath, index),\n            )}\n          />\n        )}\n      </>\n    );\n  }\n\n  if (ctx.presentation)\n    return (\n      <div className=\"min-w-0 space-y-1\">\n        <div className=\"text-xs text-muted-foreground\">\n          {items.length === 0\n            ? noItemsLabel(spec)\n            : itemCountLabel(spec, items.length)}\n        </div>\n        {items.map((item, index) => (\n          <div\n            key={index}\n            className={cn(\n              \"flex min-w-0 flex-wrap items-center gap-2 rounded px-2 py-1 even:bg-muted/40\",\n              controlMinHeightClass[ctx.size],\n            )}\n          >\n            {renderSummary({ item, index, open: false })}\n          </div>\n        ))}\n        {items.length === 0 && emptyCopy && (\n          <p className=\"text-xs text-muted-foreground\">{emptyCopy}</p>\n        )}\n      </div>\n    );\n\n  return (\n    <AccordionList<unknown>\n      items={items}\n      onChange={(next) => field.onChange(next)}\n      summary={\n        items.length === 0\n          ? noItemsLabel(spec)\n          : itemCountLabel(spec, items.length)\n      }\n      {...(toolbar !== undefined ? { toolbar } : {})}\n      size={ctx.size}\n      readOnly={readOnly}\n      itemId={(index) =>\n        fieldInputId(appendInstancePath(ctx.instancePath, index), ctx.idPrefix)\n      }\n      // The panel's controls are the form's own inputs; anything else focusable\n      // inside an item (a help disclosure, a remove button on a nested array)\n      // would otherwise win the caret on add.\n      focusSelector=\"[data-jsf-input]\"\n      itemLabel={({ item, index }) => summaryFor(item, index).title}\n      allowReorder={itemActionsAllow(spec, \"reorder\")}\n      allowDuplicate={itemActionsAllow(spec, \"duplicate\")}\n      allowRemove={itemActionsAllow(spec, \"remove\") && canRemoveItem(field, items.length)}\n      // AccordionList shows its add row only when it is given something to\n      // create, so withholding onCreate at maxItems is how the bound reaches it.\n      {...(canAddItem(field, items.length)\n        ? { onCreate: () => seedFromSchema(itemSchema) }\n        : {})}\n      addLabel={addItemLabel(spec)}\n      {...(emptyCopy ? { addDescription: emptyCopy } : {})}\n      renderHeader={renderSummary}\n      renderBody={({ item, index, onChange }) =>\n        // Recurse through the shared pipeline so consumer pre/post extensions\n        // still apply to the item and its properties.\n        ctx.render.renderFieldNodes(\n          {\n            key: `${field.key}[${index}]`,\n            prop: itemSchema,\n            required: false,\n            value: item,\n            onChange,\n            instancePath: appendInstancePath(ctx.instancePath, index),\n          },\n          childCtx,\n        )?.value ?? null\n      }\n    />\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/components/json-schema-form-array-view.cjs

@@ -0,0 +1,63 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const collections = require("../lib/collections.cjs");
+const jsonSchemaFormListeners = require("./json-schema-form-listeners.cjs");
+const jsonSchemaFormResolve = require("./json-schema-form-resolve.cjs");
+const jsonSchemaFormUtils = require("./json-schema-form-utils.cjs");
+const DEFAULT_TABLE_MAX_COLUMNS = 4;
+function arrayViewOptions(field, ctx) {
+  return { ...tableColumnOptions(field, ctx), layoutMode: ctx.layout.mode };
+}
+function tableColumnOptions(field, ctx) {
+  return {
+    hideReadOnlyFields: ctx.hideReadOnlyFields,
+    valueCells: ctx.viewOnly || field.readOnly === true,
+    ...ctx.rootValue ? { rootValue: ctx.rootValue } : {},
+    ...ctx.expressionEvaluator ? { evaluate: ctx.expressionEvaluator } : {}
+  };
+}
+function tableLayout(itemSchema, items, options) {
+  const schema = itemSchema;
+  const states = (items.length > 0 ? items : [{}]).map((item) => {
+    const row = collections.isPlainObject(item) ? item : {};
+    return jsonSchemaFormListeners.applyListenerState(schema, row, {
+      root: options.rootValue ?? row,
+      ...options.evaluate ? { evaluate: options.evaluate } : {}
+    }).properties;
+  });
+  const keys = new Set(states.flatMap((state) => Object.keys(state)));
+  const shown = [...keys].flatMap((key) => {
+    const prop = states.map((state) => state[key]).find((p) => p !== void 0 && cellShows(p, options));
+    return prop ? [[key, prop]] : [];
+  });
+  return {
+    columns: jsonSchemaFormUtils.orderByXOrder(jsonSchemaFormUtils.orderByClickyOrder(shown), schema["x-order"]),
+    rows: items.length > 0 ? states : []
+  };
+}
+function cellShows(prop, options) {
+  return prop["x-hidden"] !== true && !(options.hideReadOnlyFields && prop.readOnly === true) && !(prop.writeOnly === true && (options.valueCells || prop.readOnly === true));
+}
+function defaultArrayView(field, options) {
+  if (field.arrayDisplay === "accordion") return options.layoutMode === "inline" ? "inline" : "stack";
+  if (field.layout === "table") return "grid";
+  const max = field.schema["x-table-max-columns"] ?? DEFAULT_TABLE_MAX_COLUMNS;
+  if (!Number.isInteger(max) || max < 1) {
+    throw new Error(`${field.key}: x-table-max-columns must be a positive integer, got ${JSON.stringify(max)}`);
+  }
+  const items = Array.isArray(field.value) ? field.value : [];
+  const { columns } = tableLayout(field.itemSchema ?? {}, items, options);
+  if (columns.some(([key, prop]) => nestsForm(key, prop))) return "inline";
+  return columns.length <= max ? "grid" : "inline";
+}
+function nestsForm(key, prop) {
+  const control = jsonSchemaFormResolve.resolveControl({ key, prop, required: false, value: void 0, onChange: () => {
+  } });
+  return control.kind === "object" || control.kind === "string-map" || control.kind === "array" && jsonSchemaFormUtils.hasObjectItemProperties(control.itemSchema);
+}
+exports.DEFAULT_TABLE_MAX_COLUMNS = DEFAULT_TABLE_MAX_COLUMNS;
+exports.arrayViewOptions = arrayViewOptions;
+exports.defaultArrayView = defaultArrayView;
+exports.tableColumnOptions = tableColumnOptions;
+exports.tableLayout = tableLayout;
+//# sourceMappingURL=json-schema-form-array-view.cjs.map

package/dist/components/json-schema-form-array-view.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"json-schema-form-array-view.cjs","sources":["../../src/components/json-schema-form-array-view.ts"],"sourcesContent":["import { isPlainObject } from \"../lib/collections\";\nimport { applyListenerState } from \"./json-schema-form-listeners\";\nimport { resolveControl } from \"./json-schema-form-resolve\";\nimport { hasObjectItemProperties, orderByClickyOrder, orderByXOrder } from \"./json-schema-form-utils\";\nimport type {\n  ExpressionEvaluator,\n  FieldControl,\n  FormLayout,\n  JsonSchemaObject,\n  JsonSchemaProperty,\n  RenderContext,\n} from \"./json-schema-form-types\";\n\n// How an object array renders: the row grid (TableArray), or the item list\n// (AccordionArray) with each item's fields stacked or labelled inline.\nexport type ArrayView = \"grid\" | \"stack\" | \"inline\";\n\nexport const DEFAULT_TABLE_MAX_COLUMNS = 4;\n\nexport interface TableColumnOptions {\n  hideReadOnlyFields: boolean;\n  // The whole table is a view, so every cell renders as its value; see TableArray.\n  valueCells: boolean;\n  rootValue?: Record<string, unknown>;\n  evaluate?: ExpressionEvaluator;\n}\n\nexport interface TableLayout {\n  // Every column at least one row shows, in x-clicky-order / x-order order,\n  // carrying the first showing row's property for the header.\n  columns: [string, JsonSchemaProperty][];\n  // Per row, that row's effective item properties under its own listener state.\n  rows: Record<string, JsonSchemaProperty>[];\n}\n\nexport interface ArrayViewOptions extends TableColumnOptions {\n  // The layout the array inherits, which an explicit accordion keeps.\n  layoutMode: FormLayout[\"mode\"];\n}\n\nexport function arrayViewOptions(field: FieldControl, ctx: RenderContext): ArrayViewOptions {\n  return { ...tableColumnOptions(field, ctx), layoutMode: ctx.layout.mode };\n}\n\nexport function tableColumnOptions(field: FieldControl, ctx: RenderContext): TableColumnOptions {\n  return {\n    hideReadOnlyFields: ctx.hideReadOnlyFields,\n    valueCells: ctx.viewOnly || field.readOnly === true,\n    ...(ctx.rootValue ? { rootValue: ctx.rootValue } : {}),\n    ...(ctx.expressionEvaluator ? { evaluate: ctx.expressionEvaluator } : {}),\n  };\n}\n\n// tableLayout evaluates the item schema's listeners per row, as the object\n// renderer does for each item of the list views, so a cell a row's own\n// `x-on-change` reveals gets a column. With no rows the columns come from the\n// load state of an empty item.\nexport function tableLayout(\n  itemSchema: JsonSchemaProperty,\n  items: unknown[],\n  options: TableColumnOptions,\n): TableLayout {\n  const schema = itemSchema as JsonSchemaObject;\n  const states = (items.length > 0 ? items : [{}]).map((item) => {\n    const row = isPlainObject(item) ? item : {};\n    return applyListenerState(schema, row, {\n      root: options.rootValue ?? row,\n      ...(options.evaluate ? { evaluate: options.evaluate } : {}),\n    }).properties;\n  });\n  const keys = new Set(states.flatMap((state) => Object.keys(state)));\n  const shown = [...keys].flatMap((key): [string, JsonSchemaProperty][] => {\n    const prop = states.map((state) => state[key]).find((p) => p !== undefined && cellShows(p, options));\n    return prop ? [[key, prop]] : [];\n  });\n  return {\n    columns: orderByXOrder(orderByClickyOrder(shown), schema[\"x-order\"]),\n    rows: items.length > 0 ? states : [],\n  };\n}\n\n// cellShows mirrors the renderer's drop rules for one cell: `x-hidden`, a\n// readOnly cell under hideReadOnlyFields, and a writeOnly cell in a view.\nfunction cellShows(prop: JsonSchemaProperty, options: TableColumnOptions): boolean {\n  return (\n    prop[\"x-hidden\"] !== true &&\n    !(options.hideReadOnlyFields && prop.readOnly === true) &&\n    !(prop.writeOnly === true && (options.valueCells || prop.readOnly === true))\n  );\n}\n\n// defaultArrayView picks the view an object array opens in. An explicit\n// accordion names its renderer and outranks an explicit table, keeping the\n// label placement of the form around it (inline in an inline form, stacked\n// otherwise); without either hint a grid of up to `x-table-max-columns`\n// visible columns stays a grid and a wider one — or one with a nested\n// sub-form column — opens as the inline item form.\nexport function defaultArrayView(field: FieldControl, options: ArrayViewOptions): ArrayView {\n  if (field.arrayDisplay === \"accordion\") return options.layoutMode === \"inline\" ? \"inline\" : \"stack\";\n  if (field.layout === \"table\") return \"grid\";\n  const max = field.schema[\"x-table-max-columns\"] ?? DEFAULT_TABLE_MAX_COLUMNS;\n  if (!Number.isInteger(max) || max < 1) {\n    throw new Error(`${field.key}: x-table-max-columns must be a positive integer, got ${JSON.stringify(max)}`);\n  }\n  const items = Array.isArray(field.value) ? field.value : [];\n  const { columns } = tableLayout(field.itemSchema ?? { type: \"object\" }, items, options);\n  // A cell holding a whole sub-form (an object, a map, a list of objects)\n  // needs the item form's width, however few columns there are.\n  if (columns.some(([key, prop]) => nestsForm(key, prop))) return \"inline\";\n  return columns.length <= max ? \"grid\" : \"inline\";\n}\n\nfunction nestsForm(key: string, prop: JsonSchemaProperty): boolean {\n  const control = resolveControl({ key, prop, required: false, value: undefined, onChange: () => {} });\n  return (\n    control.kind === \"object\" ||\n    control.kind === \"string-map\" ||\n    (control.kind === \"array\" && hasObjectItemProperties(control.itemSchema))\n  );\n}\n"],"names":["isPlainObject","applyListenerState","orderByXOrder","orderByClickyOrder","resolveControl","hasObjectItemProperties"],"mappings":";;;;;;AAiBO,MAAM,4BAA4B;AAuBlC,SAAS,iBAAiB,OAAqB,KAAsC;AAC1F,SAAO,EAAE,GAAG,mBAAmB,OAAO,GAAG,GAAG,YAAY,IAAI,OAAO,KAAA;AACrE;AAEO,SAAS,mBAAmB,OAAqB,KAAwC;AAC9F,SAAO;AAAA,IACL,oBAAoB,IAAI;AAAA,IACxB,YAAY,IAAI,YAAY,MAAM,aAAa;AAAA,IAC/C,GAAI,IAAI,YAAY,EAAE,WAAW,IAAI,UAAA,IAAc,CAAA;AAAA,IACnD,GAAI,IAAI,sBAAsB,EAAE,UAAU,IAAI,oBAAA,IAAwB,CAAA;AAAA,EAAC;AAE3E;AAMO,SAAS,YACd,YACA,OACA,SACa;AACb,QAAM,SAAS;AACf,QAAM,UAAU,MAAM,SAAS,IAAI,QAAQ,CAAC,EAAE,GAAG,IAAI,CAAC,SAAS;AAC7D,UAAM,MAAMA,YAAAA,cAAc,IAAI,IAAI,OAAO,CAAA;AACzC,WAAOC,wBAAAA,mBAAmB,QAAQ,KAAK;AAAA,MACrC,MAAM,QAAQ,aAAa;AAAA,MAC3B,GAAI,QAAQ,WAAW,EAAE,UAAU,QAAQ,SAAA,IAAa,CAAA;AAAA,IAAC,CAC1D,EAAE;AAAA,EACL,CAAC;AACD,QAAM,OAAO,IAAI,IAAI,OAAO,QAAQ,CAAC,UAAU,OAAO,KAAK,KAAK,CAAC,CAAC;AAClE,QAAM,QAAQ,CAAC,GAAG,IAAI,EAAE,QAAQ,CAAC,QAAwC;AACvE,UAAM,OAAO,OAAO,IAAI,CAAC,UAAU,MAAM,GAAG,CAAC,EAAE,KAAK,CAAC,MAAM,MAAM,UAAa,UAAU,GAAG,OAAO,CAAC;AACnG,WAAO,OAAO,CAAC,CAAC,KAAK,IAAI,CAAC,IAAI,CAAA;AAAA,EAChC,CAAC;AACD,SAAO;AAAA,IACL,SAASC,oBAAAA,cAAcC,oBAAAA,mBAAmB,KAAK,GAAG,OAAO,SAAS,CAAC;AAAA,IACnE,MAAM,MAAM,SAAS,IAAI,SAAS,CAAA;AAAA,EAAC;AAEvC;AAIA,SAAS,UAAU,MAA0B,SAAsC;AACjF,SACE,KAAK,UAAU,MAAM,QACrB,EAAE,QAAQ,sBAAsB,KAAK,aAAa,SAClD,EAAE,KAAK,cAAc,SAAS,QAAQ,cAAc,KAAK,aAAa;AAE1E;AAQO,SAAS,iBAAiB,OAAqB,SAAsC;AAC1F,MAAI,MAAM,iBAAiB,oBAAoB,QAAQ,eAAe,WAAW,WAAW;AAC5F,MAAI,MAAM,WAAW,QAAS,QAAO;AACrC,QAAM,MAAM,MAAM,OAAO,qBAAqB,KAAK;AACnD,MAAI,CAAC,OAAO,UAAU,GAAG,KAAK,MAAM,GAAG;AACrC,UAAM,IAAI,MAAM,GAAG,MAAM,GAAG,yDAAyD,KAAK,UAAU,GAAG,CAAC,EAAE;AAAA,EAC5G;AACA,QAAM,QAAQ,MAAM,QAAQ,MAAM,KAAK,IAAI,MAAM,QAAQ,CAAA;AACzD,QAAM,EAAE,QAAA,IAAY,YAAY,MAAM,cAAc,CAAiB,GAAG,OAAO,OAAO;AAGtF,MAAI,QAAQ,KAAK,CAAC,CAAC,KAAK,IAAI,MAAM,UAAU,KAAK,IAAI,CAAC,EAAG,QAAO;AAChE,SAAO,QAAQ,UAAU,MAAM,SAAS;AAC1C;AAEA,SAAS,UAAU,KAAa,MAAmC;AACjE,QAAM,UAAUC,sBAAAA,eAAe,EAAE,KAAK,MAAM,UAAU,OAAO,OAAO,QAAW,UAAU,MAAM;AAAA,EAAC,GAAG;AACnG,SACE,QAAQ,SAAS,YACjB,QAAQ,SAAS,gBAChB,QAAQ,SAAS,WAAWC,4CAAwB,QAAQ,UAAU;AAE3E;;;;;;"}