@jini-ai/admin 0.4.12 → 0.6.10

package/dist/forms/react/components/FieldSettingsSection.d.ts

@@ -15,5 +15,5 @@ export interface FieldSettingsSectionProps {
  * placeholder (slider, file…) focused the Help text ⓘ, whose tip opened half behind the dialog
  * (Chrome check, 2026-10-11). Focus must land on an input, never on an ⓘ.
  */
-export declare function FieldSettingsSection({ field, controller, t }: FieldSettingsSectionProps, _optional?: Record<string, never>): import("react").JSX.Element;
+export declare function FieldSettingsSection({ field, controller, t }: FieldSettingsSectionProps): import("react").JSX.Element;
 //# sourceMappingURL=FieldSettingsSection.d.ts.map

package/dist/forms/react/components/FieldSettingsSection.js

@@ -1,8 +1,7 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { agentHandle } from '@jini-ai/agentic';
-import { InfoTip } from '@jini-ai/ui/admin-widgets';
-import { MAX_UPLOAD_MB } from '../../field-settings.js';
 import { useFieldSettingsView } from '../hooks/forms-view.hooks.js';
+import { FieldSettingsDefaultRows, FieldSettingsLimitRows, FieldSettingsOptionsRow, FieldSettingsTextRows, FieldSettingsUploadRows } from './FieldSettingsRows.js';
 /**
  * The settings half of the field dialog: one label-beside-control row per setting the field's
  * registry kind supports (`field-settings.ts` decides which). Markup only; every handler comes from
@@ -13,9 +12,9 @@ import { useFieldSettingsView } from '../hooks/forms-view.hooks.js';
  * placeholder (slider, file…) focused the Help text ⓘ, whose tip opened half behind the dialog
  * (Chrome check, 2026-10-11). Focus must land on an input, never on an ⓘ.
  */
-export function FieldSettingsSection({ field, controller, t }, _optional = {}) {
+export function FieldSettingsSection({ field, controller, t }) {
     const view = useFieldSettingsView({ field, controller, t });
-    const { settings, form } = view;
-    return (_jsxs("div", { className: "field-settings", ...agentHandle({ handle: 'form-field-settings' }, { role: 'region', label: "This field's type-specific settings" }), children: [settings.placeholder ? (_jsxs("div", { className: "field-settings-row", children: [_jsx("label", { className: "field-label", htmlFor: "field-settings-placeholder", children: t('Placeholder') }), _jsx("input", { id: "field-settings-placeholder", "data-jini-autofocus": "", value: form.placeholder, onChange: view.onPlaceholder, ...agentHandle({ handle: 'form-field-settings-placeholder' }, { role: 'field', label: 'Hint text shown inside the empty control' }) })] })) : null, settings.helpText ? (_jsxs("div", { className: "field-settings-row", children: [_jsxs("span", { className: "field-settings-label", children: [_jsx("label", { className: "field-label", htmlFor: "field-settings-help", children: t('Help text') }), _jsx(InfoTip, { label: t('Shown under the field and read out by screen readers.') })] }), _jsx("input", { id: "field-settings-help", "data-jini-autofocus": "", value: form.helpText, onChange: view.onHelpText, ...agentHandle({ handle: 'form-field-settings-help' }, { role: 'field', label: 'Help text shown under this field' }) })] })) : null, settings.options ? (_jsxs("div", { className: "field-settings-row field-settings-row--top", children: [_jsxs("span", { className: "field-settings-label", children: [_jsx("span", { className: "field-label", id: "field-settings-options-label", children: t('Options') }), _jsx(InfoTip, { label: t('The label is what visitors see. The value is what the submission stores; it follows the label until you edit it.') })] }), _jsxs("div", { className: "field-options", role: "group", "aria-labelledby": "field-settings-options-label", children: [_jsx("ol", { className: "field-options-list", children: view.options.map((row) => (_jsxs("li", { className: "field-option-row", children: [_jsx("input", { className: "field-option-label", "aria-label": row.labelAria, placeholder: t('Label'), value: row.label, onChange: row.onLabel, ...agentHandle({ handle: `${row.handle}-label` }, { role: 'field', label: 'Option text visitors see' }) }), _jsx("input", { className: "field-option-value", "aria-label": row.valueAria, placeholder: t('Value'), value: row.value, onChange: row.onValue, ...agentHandle({ handle: `${row.handle}-value` }, { role: 'field', label: 'Option value stored with each submission' }) }), view.settings.multiple ? (_jsx("label", { className: "field-option-default", children: _jsx("input", { type: "checkbox", checked: row.isDefault, disabled: !row.value, onChange: row.onDefault, "aria-label": row.defaultAria }) })) : null, _jsxs("span", { className: "field-option-actions", children: [_jsx("button", { type: "button", className: "btn-ghost field-option-btn", disabled: row.isFirst, onClick: row.onUp, "aria-label": row.upAria, children: "\u2191" }), _jsx("button", { type: "button", className: "btn-ghost field-option-btn", disabled: row.isLast, onClick: row.onDown, "aria-label": row.downAria, children: "\u2193" }), _jsx("button", { type: "button", className: "btn-ghost field-option-btn", onClick: row.onRemove, "aria-label": row.removeAria, ...agentHandle({ handle: `${row.handle}-remove` }, { role: 'button', label: 'Remove this option' }), children: "\u00D7" })] })] }, row._rowId))) }), _jsx("button", { type: "button", className: "btn-secondary field-settings-add", onClick: view.addOption, ...agentHandle({ handle: 'form-field-options-add' }, { role: 'button', label: 'Add another option to this choice field' }), children: t('Add option') })] })] })) : null, settings.defaultKind === 'boolean' ? (_jsxs("div", { className: "field-settings-row", children: [_jsx("span", { className: "field-label", children: t('Default') }), _jsxs("label", { className: "form-checkbox-field", children: [_jsx("input", { type: "checkbox", checked: form.defaultChecked, onChange: view.onDefaultChecked, ...agentHandle({ handle: 'form-field-settings-default-checked' }, { role: 'checkbox', label: 'Whether this box starts checked' }) }), t('Checked by default')] })] })) : null, settings.defaultKind === 'choice' ? (_jsxs("div", { className: "field-settings-row", children: [_jsx("label", { className: "field-label", htmlFor: "field-settings-default", children: t('Default') }), _jsxs("select", { id: "field-settings-default", className: "field-settings-compact", value: form.defaultChoices[0] ?? '', onChange: view.onDefaultChoice, ...agentHandle({ handle: 'form-field-settings-default' }, { role: 'field', label: 'Which option starts selected — set with page.select_option' }), children: [_jsx("option", { value: "", children: t('None') }), view.defaultChoices.map((choice) => _jsx("option", { value: choice.value, children: choice.label }, choice.key))] })] })) : null, view.defaultInputType ? (_jsxs("div", { className: "field-settings-row", children: [_jsx("label", { className: "field-label", htmlFor: "field-settings-default", children: t('Default') }), _jsx("input", { id: "field-settings-default", "data-jini-autofocus": "", className: view.defaultClass, type: view.defaultInputType, value: form.defaultText, onChange: view.onDefaultText, ...agentHandle({ handle: 'form-field-settings-default' }, { role: 'field', label: 'The value this field starts with' }) })] })) : null, settings.length ? (_jsxs("div", { className: "field-settings-row", children: [_jsx("span", { className: "field-label", id: "field-settings-length-label", children: t('Length') }), _jsxs("span", { className: "field-settings-pair", role: "group", "aria-labelledby": "field-settings-length-label", children: [_jsx("input", { type: "number", min: 0, className: "field-settings-num", "aria-label": t('Min length'), placeholder: t('Min'), value: form.minLength, onChange: view.onMinLength, ...agentHandle({ handle: 'form-field-settings-min-length' }, { role: 'field', label: 'Fewest characters accepted' }) }), _jsx("span", { "aria-hidden": "true", children: "\u2013" }), _jsx("input", { type: "number", min: 1, className: "field-settings-num", "aria-label": t('Max length'), placeholder: t('Max'), value: form.maxLength, onChange: view.onMaxLength, ...agentHandle({ handle: 'form-field-settings-max-length' }, { role: 'field', label: 'Most characters accepted; blank means the default limit' }) })] })] })) : null, settings.pattern ? (_jsxs("div", { className: "field-settings-row", children: [_jsxs("span", { className: "field-settings-label", children: [_jsx("label", { className: "field-label", htmlFor: "field-settings-pattern", children: t('Pattern') }), _jsx(InfoTip, { label: t('Optional. The whole answer must match it, e.g. [0-9]+ for digits only. Groups, | and repeating more than once are not supported.') })] }), _jsx("input", { id: "field-settings-pattern", className: "field-settings-code", value: form.pattern, onChange: view.onPattern, spellCheck: false, ...agentHandle({ handle: 'form-field-settings-pattern' }, { role: 'field', label: 'Regular expression the whole answer must match' }) })] })) : null, settings.bounds ? (_jsxs("div", { className: "field-settings-row", children: [_jsx("span", { className: "field-label", id: "field-settings-bounds-label", children: t('Range') }), _jsxs("span", { className: "field-settings-pair", role: "group", "aria-labelledby": "field-settings-bounds-label", children: [_jsx("input", { type: view.boundsType, className: view.boundsClass, "aria-label": t('Min'), placeholder: t('Min'), value: form.min, onChange: view.onMin, ...agentHandle({ handle: 'form-field-settings-min' }, { role: 'field', label: 'Lowest value or earliest date/time accepted' }) }), _jsx("span", { "aria-hidden": "true", children: "\u2013" }), _jsx("input", { type: view.boundsType, className: view.boundsClass, "aria-label": t('Max'), placeholder: t('Max'), value: form.max, onChange: view.onMax, ...agentHandle({ handle: 'form-field-settings-max' }, { role: 'field', label: 'Highest value or latest date/time accepted' }) }), settings.step ? (_jsx("input", { type: "number", min: 0, step: "any", className: "field-settings-num", "aria-label": t('Step'), placeholder: t('Step'), value: form.step, onChange: view.onStep, ...agentHandle({ handle: 'form-field-settings-step' }, { role: 'field', label: 'Increment between accepted values' }) })) : null] })] })) : null, settings.upload ? (_jsxs(_Fragment, { children: [_jsxs("div", { className: "field-settings-row", children: [_jsxs("span", { className: "field-settings-label", children: [_jsx("span", { className: "field-label", id: "field-settings-files-label", children: t('Files') }), _jsx(InfoTip, { label: t('Leave all unticked to accept every safe type: images, video and PDF.') })] }), _jsx("span", { className: "field-settings-checks", role: "group", "aria-labelledby": "field-settings-files-label", children: view.uploads.map((choice) => (_jsxs("label", { className: "form-checkbox-field", children: [_jsx("input", { type: "checkbox", checked: choice.checked, onChange: choice.onToggle, ...agentHandle({ handle: choice.handle }, { role: 'checkbox', label: `Accept ${choice.label} uploads` }) }), t(choice.label)] }, choice.value))) })] }), _jsxs("div", { className: "field-settings-row", children: [_jsx("label", { className: "field-label", htmlFor: "field-settings-max-size", children: t('Max size (MB)') }), _jsx("input", { id: "field-settings-max-size", type: "number", min: 0, max: MAX_UPLOAD_MB, step: "any", className: "field-settings-num", placeholder: String(MAX_UPLOAD_MB), value: form.maxFileSizeMb, onChange: view.onMaxFileSize, ...agentHandle({ handle: 'form-field-settings-max-size' }, { role: 'field', label: 'Largest upload accepted, in megabytes' }) })] })] })) : null] }));
+    const { settings } = view;
+    return (_jsxs("div", { className: "field-settings", ...agentHandle({ handle: 'form-field-settings' }, { role: 'region', label: "This field's type-specific settings" }), children: [_jsx(FieldSettingsTextRows, { view: view, t: t }), settings.options ? _jsx(FieldSettingsOptionsRow, { view: view, t: t }) : null, _jsx(FieldSettingsDefaultRows, { view: view, t: t }), _jsx(FieldSettingsLimitRows, { view: view, t: t }), settings.upload ? _jsx(FieldSettingsUploadRows, { view: view, t: t }) : null] }));
 }
 //# sourceMappingURL=FieldSettingsSection.js.map

package/dist/forms/react/components/FormEditorFieldsBody.d.ts

@@ -21,7 +21,7 @@ export interface FormEditorFieldsBodyProps {
     onCopyEmbed: () => void;
     copyFeedback: string | null;
 }
-export declare function FormEditorFieldsBody(props: FormEditorFieldsBodyProps, _optional?: {}): import("react").JSX.Element;
+export declare function FormEditorFieldsBody(props: FormEditorFieldsBodyProps): import("react").JSX.Element;
 /** The page-header title/description text — split out because `FormEditor`'s isNew-dependent copy
  * (two ternaries, one with a `||` fallback) is otherwise indistinguishable, in the complexity
  * count, from the branches that actually decide what's on screen. */

package/dist/forms/react/components/FormEditorFieldsBody.js

@@ -1,24 +1,13 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useFormFieldsBodyView } from "../hooks/forms-view.hooks.js";
 import { agentHandle } from '@jini-ai/agentic';
-import { FormFieldsEditor } from "./FormFieldsEditor.js";
-export function FormEditorFieldsBody(props, _optional = {}) {
+import { FormEditorActions, FormEditorModeSwitch } from "./FormEditorFieldsBodyParts.js";
+export function FormEditorFieldsBody(props) {
     const handlers = useFormFieldsBodyView(props);
-    const { name, onNameChange, slug, onSlugChange, isNew, fields, existingFieldIds, onFieldsChange, form, saving, onStatusToggle, onSave, t, mode, onModeChange, html, onHtmlChange, onCopyEmbed, copyFeedback, } = props;
+    const { name, slug, isNew, t } = props;
     return (_jsxs(_Fragment, { children: [_jsx("div", { className: "field-group", children: _jsxs("div", { className: "field-row", children: [_jsxs("div", { className: "field", children: [_jsx("label", { className: "field-label", htmlFor: "form-name", children: t("Name") }), _jsx("input", { id: "form-name", value: name, onChange: handlers.onName, ...agentHandle({ handle: "form-editor-name" }, { role: "field", label: "This form's display name" }) })] }), _jsxs("div", { className: "field", children: [_jsx("label", { className: "field-label", htmlFor: "form-slug", children: t("Slug") }), _jsx("input", { id: "form-slug", value: slug, disabled: !isNew, onChange: handlers.onSlug, ...agentHandle({ handle: "form-editor-slug" }, {
                                         role: "field",
                                         label: "This form's URL slug — only editable while creating a new form",
-                                    }) })] })] }) }), _jsxs("div", { className: "field-group", children: [_jsxs("div", { className: "segmented", role: "group", "aria-label": t("Form authoring mode"), children: [_jsx("button", { type: "button", className: mode === "builder" ? "is-active" : "", "aria-pressed": mode === "builder", onClick: handlers.onBuilder, children: t("Builder") }), _jsx("button", { type: "button", className: mode === "html" ? "is-active" : "", "aria-pressed": mode === "html", onClick: handlers.onHtmlMode, children: t("HTML") })] }), mode === "html" ? (_jsx("textarea", { className: "page-html-source", value: html, onChange: handlers.onHtml, spellCheck: false, "aria-label": t("Form HTML") })) : (_jsx("div", { className: "table-scroll", children: _jsx(FormFieldsEditor, { fields: fields, existingFieldIds: existingFieldIds, onChange: onFieldsChange, t: t }) }))] }), _jsxs("div", { className: "editor-actions form-actions", children: [form ? _jsx("button", { type: "button", className: "btn-secondary", onClick: onCopyEmbed, children: t("Copy HTML embed") }) : null, copyFeedback ? _jsx("span", { role: "status", children: copyFeedback }) : null, !isNew && form ? (
-                    // Reversible-but-access-affecting (turns off the live site's ability to accept
-                    // submissions through this form) — `.btn-warning`, not `.btn-danger`: nothing is
-                    // deleted, and the same control flips right back to "Enable". Re-enabling is the safe
-                    // direction, so it stays `.btn-secondary` rather than inheriting the warning look.
-                    _jsx("button", { type: "button", className: form.status === "active" ? "btn-warning" : "btn-secondary", disabled: saving, onClick: onStatusToggle, ...agentHandle({ handle: "form-editor-status-toggle" }, {
-                            role: "button",
-                            label: "Disable or re-enable this form — disabling stops it accepting new submissions without deleting it",
-                        }), children: form.status === "active" ? t("Disable") : t("Enable") })) : null, _jsx("button", { type: "button", disabled: saving, onClick: onSave, ...agentHandle({ handle: "form-editor-save" }, {
-                            role: "button",
-                            label: "Save this form's name, slug, fields and notification settings",
-                        }), children: isNew ? t("Create form") : t("Save") })] })] }));
+                                    }) })] })] }) }), _jsx("div", { className: "field-group", children: _jsx(FormEditorModeSwitch, { props: props, handlers: handlers }) }), _jsx(FormEditorActions, { props: props })] }));
 }
 //# sourceMappingURL=FormEditorFieldsBody.js.map

package/dist/forms/react/components/FormEditorFieldsBodyParts.d.ts

@@ -0,0 +1,18 @@
+import type { useFormFieldsBodyView } from "../hooks/forms-view.hooks.js";
+import type { FormEditorFieldsBodyProps } from "./FormEditorFieldsBody.js";
+/**
+ * @file The two halves of `FormEditorFieldsBody` that branch on its props — the Builder/HTML switch
+ * and the action row — split out so each one's branches are counted on their own. Markup only.
+ */
+type FieldsBodyHandlers = ReturnType<typeof useFormFieldsBodyView>;
+/** Builder/HTML switch plus whichever editor the current mode shows. */
+export declare function FormEditorModeSwitch({ props, handlers }: {
+    props: FormEditorFieldsBodyProps;
+    handlers: FieldsBodyHandlers;
+}): import("react").JSX.Element;
+/** Copy embed, copy feedback, Disable/Enable (saved forms only) and Save/Create. */
+export declare function FormEditorActions({ props }: {
+    props: FormEditorFieldsBodyProps;
+}): import("react").JSX.Element;
+export {};
+//# sourceMappingURL=FormEditorFieldsBodyParts.d.ts.map

package/dist/forms/react/components/FormEditorFieldsBodyParts.js

@@ -0,0 +1,32 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { agentHandle } from '@jini-ai/agentic';
+import { FormFieldsEditor } from "./FormFieldsEditor.js";
+/** Builder/HTML switch plus whichever editor the current mode shows. */
+export function FormEditorModeSwitch({ props, handlers }) {
+    const { fields, existingFieldIds, onFieldsChange, t, mode, html } = props;
+    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: "segmented", role: "group", "aria-label": t("Form authoring mode"), children: [_jsx("button", { type: "button", className: mode === "builder" ? "is-active" : "", "aria-pressed": mode === "builder", onClick: handlers.onBuilder, children: t("Builder") }), _jsx("button", { type: "button", className: mode === "html" ? "is-active" : "", "aria-pressed": mode === "html", onClick: handlers.onHtmlMode, children: t("HTML") })] }), mode === "html" ? (_jsx("textarea", { className: "page-html-source", value: html, onChange: handlers.onHtml, spellCheck: false, "aria-label": t("Form HTML") })) : (_jsx("div", { className: "table-scroll", children: _jsx(FormFieldsEditor, { fields: fields, existingFieldIds: existingFieldIds, onChange: onFieldsChange, t: t }) }))] }));
+}
+/** Copy embed, copy feedback, Disable/Enable (saved forms only) and Save/Create. */
+export function FormEditorActions({ props }) {
+    const { isNew, form, saving, onStatusToggle, onSave, t, onCopyEmbed, copyFeedback } = props;
+    /* `form-actions` is a spacing-only hook layered on top of the shared `.editor-actions`
+       flex row. `.editor-actions` sets direction/gap/alignment but no top margin, and this row
+       is not a `.field-group`, so the `.field-group + .field-group` rhythm that separates every
+       other block on this screen skips it — leaving Disable/Save flush against the Recipients
+       input. Fixed here rather than by adding a margin to `.editor-actions` itself, because that
+       class is shared with the other editor screens and a global change would shift spacing on
+       screens nobody has looked at yet. */
+    return (_jsxs("div", { className: "editor-actions form-actions", children: [form ? _jsx("button", { type: "button", className: "btn-secondary", onClick: onCopyEmbed, children: t("Copy HTML embed") }) : null, copyFeedback ? _jsx("span", { role: "status", children: copyFeedback }) : null, !isNew && form ? (
+            // Reversible-but-access-affecting (turns off the live site's ability to accept
+            // submissions through this form) — `.btn-warning`, not `.btn-danger`: nothing is
+            // deleted, and the same control flips right back to "Enable". Re-enabling is the safe
+            // direction, so it stays `.btn-secondary` rather than inheriting the warning look.
+            _jsx("button", { type: "button", className: form.status === "active" ? "btn-warning" : "btn-secondary", disabled: saving, onClick: onStatusToggle, ...agentHandle({ handle: "form-editor-status-toggle" }, {
+                    role: "button",
+                    label: "Disable or re-enable this form — disabling stops it accepting new submissions without deleting it",
+                }), children: form.status === "active" ? t("Disable") : t("Enable") })) : null, _jsx("button", { type: "button", disabled: saving, onClick: onSave, ...agentHandle({ handle: "form-editor-save" }, {
+                    role: "button",
+                    label: "Save this form's name, slug, fields and notification settings",
+                }), children: isNew ? t("Create form") : t("Save") })] }));
+}
+//# sourceMappingURL=FormEditorFieldsBodyParts.js.map

package/dist/forms/react/components/FormSubmissions.d.ts

@@ -8,5 +8,5 @@ export interface FormSubmissionsProps {
     t: (key: string) => string;
     answerColumns?: FormAnswerColumn[];
 }
-export declare function FormSubmissions({ formId, useFormSubmissionsHook, t, answerColumns }: FormSubmissionsProps, _optional?: Record<string, never>): import("react").JSX.Element;
+export declare function FormSubmissions({ formId, useFormSubmissionsHook, t, answerColumns }: FormSubmissionsProps): import("react").JSX.Element;
 //# sourceMappingURL=FormSubmissions.d.ts.map

package/dist/forms/react/components/FormSubmissions.js

@@ -1,12 +1,10 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx } from "react/jsx-runtime";
 import { useSubmissionsView } from "../hooks/forms-view.hooks.js";
-import { DataTable } from '../../../react/components/DataTable.js';
-import { agentHandle } from '@jini-ai/agentic';
 import { useWiredFormSubmissions } from '../hooks/use-form-submissions.hooks.js';
 import { useFormSubmissionDate } from '../hooks/use-form-submission-date.hooks.js';
 import { FormSubmissionDetail } from "./FormSubmissionDetail.js";
-import { FormSubmissionDate } from "./FormSubmissionDate.js";
-export function FormSubmissions({ formId, useFormSubmissionsHook = useWiredFormSubmissions, t, answerColumns = [] }, _optional = {}) {
+import { FormSubmissionsTable } from "./FormSubmissionsTable.js";
+export function FormSubmissions({ formId, useFormSubmissionsHook = useWiredFormSubmissions, t, answerColumns = [] }) {
     const formatDate = useFormSubmissionDate({});
     const controller = useFormSubmissionsHook({ formId });
     const { submissions, nextCursor, error, selectedId, loadingMore } = controller;
@@ -27,20 +25,6 @@ export function FormSubmissions({ formId, useFormSubmissionsHook = useWiredFormS
     // own post-early-return computation. `submissions` grows only on an explicit "Load more" click
     // (`use-form-submissions.hooks.ts`'s cursor-append), so this O(n) pass tracks real data changes,
     // not incidental re-renders.
-    return (_jsxs("div", { children: [error ? _jsx("div", { className: "notice error", children: error }) : null, _jsx(DataTable, { rows: rows, rowKey: (s) => s.id, columns: [
-                    { key: "submitted-at", header: t("Submitted at"), cell: (s) => _jsx(FormSubmissionDate, { date: formatDate({ iso: s.submittedAt }) }) },
-                    { key: "source-ip", header: t("Source IP"), cell: (s) => s.sourceIp },
-                    ...answerColumns,
-                    {
-                        key: "view",
-                        cell: (s, index) => (_jsx("button", { type: "button", onClick: s.view, ...agentHandle({ handle: s.handle }, {
-                                role: "button",
-                                label: "Open this submission's full details",
-                            }), children: t("View") })),
-                    },
-                ] }), nextCursor ? (_jsx("button", { type: "button", className: "btn-secondary", disabled: loadingMore, onClick: loadMore, ...agentHandle({ handle: "form-submissions-load-more" }, {
-                    role: "button",
-                    label: "Load the next page of submissions",
-                }), children: loadingMore ? t("Loading…") : t("Load more") })) : null] }));
+    return (_jsx(FormSubmissionsTable, { rows: rows, loadMore: loadMore, error: error, nextCursor: nextCursor, loadingMore: loadingMore, formatDate: formatDate, answerColumns: answerColumns, t: t }));
 }
 //# sourceMappingURL=FormSubmissions.js.map

package/dist/forms/react/components/FormSubmissionsTable.d.ts

@@ -0,0 +1,19 @@
+import type { FormAnswerColumn } from '../../html-rules.js';
+import type { useSubmissionsView } from "../hooks/forms-view.hooks.js";
+import type { useFormSubmissionDate } from '../hooks/use-form-submission-date.hooks.js';
+/**
+ * @file The loaded-list half of `FormSubmissions`: an optional error above the table, the table
+ * itself, and "Load more" while a next page exists. Markup only.
+ */
+export interface FormSubmissionsTableProps {
+    rows: ReturnType<typeof useSubmissionsView>["rows"];
+    loadMore: () => void;
+    error: string | null;
+    nextCursor: string | null;
+    loadingMore: boolean;
+    formatDate: ReturnType<typeof useFormSubmissionDate>;
+    answerColumns: FormAnswerColumn[];
+    t: (key: string) => string;
+}
+export declare function FormSubmissionsTable({ rows, loadMore, error, nextCursor, loadingMore, formatDate, answerColumns, t }: FormSubmissionsTableProps): import("react").JSX.Element;
+//# sourceMappingURL=FormSubmissionsTable.d.ts.map

package/dist/forms/react/components/FormSubmissionsTable.js

@@ -0,0 +1,22 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { DataTable } from '../../../react/components/DataTable.js';
+import { agentHandle } from '@jini-ai/agentic';
+import { FormSubmissionDate } from "./FormSubmissionDate.js";
+export function FormSubmissionsTable({ rows, loadMore, error, nextCursor, loadingMore, formatDate, answerColumns, t }) {
+    return (_jsxs("div", { children: [error ? _jsx("div", { className: "notice error", children: error }) : null, _jsx(DataTable, { rows: rows, rowKey: (s) => s.id, columns: [
+                    { key: "submitted-at", header: t("Submitted at"), cell: (s) => _jsx(FormSubmissionDate, { date: formatDate({ iso: s.submittedAt }) }) },
+                    { key: "source-ip", header: t("Source IP"), cell: (s) => s.sourceIp },
+                    ...answerColumns,
+                    {
+                        key: "view",
+                        cell: (s) => (_jsx("button", { type: "button", onClick: s.view, ...agentHandle({ handle: s.handle }, {
+                                role: "button",
+                                label: "Open this submission's full details",
+                            }), children: t("View") })),
+                    },
+                ] }), nextCursor ? (_jsx("button", { type: "button", className: "btn-secondary", disabled: loadingMore, onClick: loadMore, ...agentHandle({ handle: "form-submissions-load-more" }, {
+                    role: "button",
+                    label: "Load the next page of submissions",
+                }), children: loadingMore ? t("Loading…") : t("Load more") })) : null] }));
+}
+//# sourceMappingURL=FormSubmissionsTable.js.map

package/dist/media/adapters/memory.js

@@ -1,4 +1,14 @@
 import { queryMedia } from '../rules.js';
+const METADATA_KEYS = ['title', 'slug', 'alt', 'caption', 'credit', 'width', 'height', 'cssClass', 'htmlAttributes'];
+/** Only metadata keys with a defined value; null stays, so a patch can clear a nullable field. */
+function pickMetadata({ patch }) {
+    return Object.fromEntries(Object.entries(patch).filter(([key, value]) => METADATA_KEYS.includes(key) && value !== undefined));
+}
+/** Decoded length of a base64 string: 3 bytes per 4 chars, minus trailing padding. */
+function base64ByteSize({ dataBase64 }) {
+    const padding = dataBase64.match(/=+$/)?.[0].length ?? 0;
+    return Math.max(0, Math.floor(dataBase64.length * 3 / 4) - padding);
+}
 export function createMemoryMediaApi({ assets = [] }, { now = () => new Date().toISOString() } = {}) {
     const items = new Map(assets.map((item) => [item.id, Object.freeze({ ...item })]));
     let sequence = 0;
@@ -20,7 +30,7 @@ export function createMemoryMediaApi({ assets = [] }, { now = () => new Date().t
         // The REAL server ignores the declared string and stores sniffContentType(bytes) instead.
         // This fake has no bytes to sniff — its input is an opaque base64 string a test made up —
         // so it echoes what the caller declared. Tests needing disagreement must seed assets directly.
-        return { byteSize: Math.max(0, Math.floor(input.dataBase64.length * 3 / 4) - (input.dataBase64.match(/=+$/)?.[0].length ?? 0)), contentType: input.contentType, sha256: `memory-content-${++sequence}` };
+        return { byteSize: base64ByteSize(input), contentType: input.contentType, sha256: `memory-content-${++sequence}` };
     }
     return {
         replaceSupported: true,
@@ -38,15 +48,16 @@ export function createMemoryMediaApi({ assets = [] }, { now = () => new Date().t
             const timestamp = now();
             return put({
                 id,
-                title: options.title ?? input.filename,
-                alt: options.alt ?? '',
-                caption: options.caption ?? '',
-                credit: options.credit ?? '',
-                slug: options.slug ?? id,
-                width: options.width ?? null,
-                height: options.height ?? null,
-                cssClass: options.cssClass ?? null,
-                htmlAttributes: options.htmlAttributes ?? null,
+                title: input.filename,
+                alt: '',
+                caption: '',
+                credit: '',
+                slug: id,
+                width: null,
+                height: null,
+                cssClass: null,
+                htmlAttributes: null,
+                ...pickMetadata({ patch: options }),
                 status: 'active',
                 publicUrl: null,
                 createdAt: timestamp,
@@ -58,14 +69,13 @@ export function createMemoryMediaApi({ assets = [] }, { now = () => new Date().t
         async update({ id, patch }, options = {}) {
             check(options);
             const previous = get(id);
-            const metadata = Object.fromEntries(Object.entries(patch).filter(([key, value]) => ['title', 'slug', 'alt', 'caption', 'credit', 'width', 'height', 'cssClass', 'htmlAttributes'].includes(key) && value !== undefined));
-            return put({ ...previous, ...metadata, version: previous.version + 1, updatedAt: now() });
+            return put({ ...previous, ...pickMetadata({ patch }), version: previous.version + 1, updatedAt: now() });
         },
         async replace({ id, upload }, options = {}) {
             check(options);
             const previous = get(id);
             if (previous.status !== 'active')
-                throw new Error('Cannot replace trashed media');
+                throw new Error(`Cannot replace trashed media: ${id} (restore it first)`);
             return put({
                 ...previous,
                 ...content(upload),
@@ -92,7 +102,7 @@ export function createMemoryMediaApi({ assets = [] }, { now = () => new Date().t
         async delete({ id }, options = {}) {
             check(options);
             if (get(id).status !== 'trashed')
-                throw new Error('Trash media before permanent deletion');
+                throw new Error(`Trash media before permanent deletion: ${id}`);
             items.delete(id);
             return { purged: true };
         },
@@ -102,11 +112,11 @@ export function createMemoryMediaApi({ assets = [] }, { now = () => new Date().t
 }
 export function createMemoryMediaProviders({ providers = [] }, _optional = {}) {
     const items = new Map(providers.map((item) => [item.id, Object.freeze({ ...item })]));
-    function write(id, configured) {
+    function write(id, patch) {
         const previous = items.get(id);
         if (!previous)
-            throw new Error('Unknown provider');
-        const next = Object.freeze({ ...previous, configured });
+            throw new Error(`Unknown media provider: ${id}`);
+        const next = Object.freeze({ ...previous, ...patch });
         items.set(id, next);
         return next;
     }
@@ -117,22 +127,17 @@ export function createMemoryMediaProviders({ providers = [] }, _optional = {}) {
         },
         async saveSettings({ id, baseUrl, model }, options = {}) {
             options.signal?.throwIfAborted();
-            const previous = items.get(id);
-            if (!previous)
-                throw new Error('Unknown provider');
-            const next = Object.freeze({ ...previous, baseUrl, model });
-            items.set(id, next);
-            return next;
+            return write(id, { baseUrl, model });
         },
         async saveCredential({ id, credential }, options = {}) {
             options.signal?.throwIfAborted();
             if (!credential.trim())
-                throw new Error('Credential is required');
-            return write(id, true);
+                throw new Error(`Credential is required for media provider: ${id}`);
+            return write(id, { configured: true });
         },
         async removeCredential({ id }, options = {}) {
             options.signal?.throwIfAborted();
-            return write(id, false);
+            return write(id, { configured: false });
         },
     };
 }

package/dist/media/controllers/edit-media.controller.js

@@ -31,11 +31,12 @@ export function createEditMediaController({ api, item }, _optional = {}) {
             store.set({
                 patch: { error: error instanceof Error ? error.message : 'Failed to save media metadata' },
             });
-            return false;
         }
         finally {
             store.set({ patch: { saving: false } });
         }
+        // Reached only through the catch above: the failure is already recorded in `error`.
+        return false;
     }
     return {
         getSnapshot: store.getSnapshot,

package/dist/media/controllers/library.controller.js

@@ -23,6 +23,39 @@ export function createLibraryController({ api }, { query = {} } = {}) {
         retryTimer = null;
     }
     let readAbort = null, generation = 0;
+    /** Store patch for an accepted full library: filtered rows plus whole-library tab counts.
+     * @complexity O(n) in the library size. */
+    function libraryView({ media }, _optional = {}) {
+        return { items: queryMedia({ media, query: store.getSnapshot().query }), counts: countMediaTabs({ media }) };
+    }
+    /** Commits a read that is still the latest one; items are frozen so consumers cannot mutate rows. */
+    function acceptRead({ all }, _optional = {}) {
+        readFailed = false;
+        retryAttempt = 0;
+        library = all;
+        const { items, counts } = libraryView({ media: all });
+        store.set({
+            patch: {
+                items: Object.freeze(items.map((item) => Object.freeze({ ...item }))),
+                counts,
+                hasUntyped: all.some((item) => item.contentType === null),
+                error: null,
+            },
+        });
+    }
+    /** Publishes the latest read's failure and, when the failure is transient, schedules a retry. */
+    function failRead({ error }, _optional = {}) {
+        readFailed = true;
+        store.set({
+            patch: { loading: false, error: error instanceof Error ? error.message : 'Failed to load media' },
+        });
+        // Retry reads only, never destructive writes. Keep trying at a capped delay so
+        // recovery needs no manual repair, while an offline service isn't hammered.
+        if (isRetryableMediaError({ error })) {
+            const delay = Math.min(1000 * 2 ** Math.min(retryAttempt++, 5), 30000);
+            retryTimer = setTimeout(() => { retryTimer = null; void load(); }, delay);
+        }
+    }
     async function load(_required = {}, _optional = {}) {
         if (store.signal.aborted)
             return;
@@ -34,35 +67,13 @@ export function createLibraryController({ api }, { query = {} } = {}) {
         store.set({ patch: { loading: true, error: null } });
         try {
             const all = await api.list({}, { signal: abort.signal });
-            const items = queryMedia({ media: all, query: store.getSnapshot().query });
-            if (ticket === generation) {
-                readFailed = false;
-                retryAttempt = 0;
-                library = all;
-                store.set({
-                    patch: {
-                        items: Object.freeze(items.map((item) => Object.freeze({ ...item }))),
-                        counts: countMediaTabs({ media: all }),
-                        hasUntyped: all.some((item) => item.contentType === null),
-                        error: null,
-                    },
-                });
-            }
+            if (ticket === generation)
+                acceptRead({ all });
         }
         catch (error) {
             // A later background failure must not blank an already-rendered screen.
-            if (!abort.signal.aborted && ticket === generation) {
-                readFailed = true;
-                store.set({
-                    patch: { loading: false, error: error instanceof Error ? error.message : 'Failed to load media' },
-                });
-                // Retry reads only, never destructive writes. Keep trying at a capped delay so
-                // recovery needs no manual repair, while an offline service isn't hammered.
-                if (isRetryableMediaError({ error })) {
-                    const delay = Math.min(1000 * 2 ** Math.min(retryAttempt++, 5), 30000);
-                    retryTimer = setTimeout(() => { retryTimer = null; void load(); }, delay);
-                }
-            }
+            if (!abort.signal.aborted && ticket === generation)
+                failRead({ error });
         }
         finally {
             if (ticket === generation)
@@ -76,7 +87,7 @@ export function createLibraryController({ api }, { query = {} } = {}) {
             return;
         if (all) {
             library = all;
-            store.set({ patch: { items: queryMedia({ media: all, query: store.getSnapshot().query }), counts: countMediaTabs({ media: all }), hasUntyped: all.some(item => item.contentType === null), error: null } });
+            store.set({ patch: { ...libraryView({ media: all }), hasUntyped: all.some(item => item.contentType === null), error: null } });
         }
         if (error)
             store.set({ patch: { error: error.message } });
@@ -100,17 +111,18 @@ export function createLibraryController({ api }, { query = {} } = {}) {
             readAbort?.abort();
             cancelRetry();
             store.set({ patch: { loading: false, error: null } });
+            // A single exit: a write disposed mid-flight or a failed write reports false.
+            let saved = false;
             try {
                 await run();
-                if (store.signal.aborted)
-                    return false;
-                await load();
-                return true;
+                if (!store.signal.aborted) {
+                    await load();
+                    saved = true;
+                }
             }
             catch (error) {
-                if (!store.signal.aborted)
-                    store.set({ patch: { loading: false, error: error instanceof Error ? error.message : 'Media write failed' } });
-                return false;
+                // The store ignores patches once disposed, so a write failing after dispose publishes nothing.
+                store.set({ patch: { loading: false, error: error instanceof Error ? error.message : 'Media write failed' } });
             }
             finally {
                 if (id === undefined)
@@ -118,6 +130,7 @@ export function createLibraryController({ api }, { query = {} } = {}) {
                 const pendingIds = store.getSnapshot().pendingIds.filter(value => value !== id);
                 store.set({ patch: { busy: pendingIds.length > 0, pendingIds } });
             }
+            return saved;
         });
         writes = operation.catch(() => undefined);
         return operation;
@@ -168,7 +181,7 @@ export function createLibraryController({ api }, { query = {} } = {}) {
                 // A failed follow-up read must not leave a permanently deleted card focusable.
                 if (library) {
                     library = library.filter(row => row.id !== item.id);
-                    store.set({ patch: { items: queryMedia({ media: library, query: store.getSnapshot().query }), counts: countMediaTabs({ media: library }) } });
+                    store.set({ patch: libraryView({ media: library }) });
                 }
             });
             if (saved)

package/dist/media/controllers/providers.controller.js

@@ -46,11 +46,12 @@ export function createProvidersController({ api }, _optional = {}) {
         }
         catch {
             store.set({ patch: { error: 'Failed to save provider credentials' } });
-            return false;
         }
         finally {
             store.set({ patch: { saving: false } });
         }
+        // Reached only through the catch above: the failure is already recorded in `error`.
+        return false;
     }
     return {
         getSnapshot: store.getSnapshot,

package/dist/media/html-attributes.js

@@ -80,7 +80,9 @@ const ASCII_WHITESPACE_OR_CONTROL_MAX_CODE_POINT = 0x20;
 function isUnsafeMediaUrlValue(value) {
     let stripped = "";
     for (const char of value) {
-        if ((char.codePointAt(0) ?? 0) > ASCII_WHITESPACE_OR_CONTROL_MAX_CODE_POINT)
+        // `char` is never empty, so `charCodeAt(0)` is always a number; for an astral character it is
+        // the high surrogate (>= 0xD800), which is kept exactly as the full code point would be.
+        if (char.charCodeAt(0) > ASCII_WHITESPACE_OR_CONTROL_MAX_CODE_POINT)
             stripped += char;
     }
     stripped = stripped.toLowerCase();
@@ -165,15 +167,11 @@ export function parseMediaHtmlAttributes({ text }, _optional = {}) {
         // Non-whitespace text between the previous match and this one is a fragment the token pattern
         // could not parse as a name (e.g. a stray quote) — the tokenizer has lost sync, so everything
         // parsed so far is discarded rather than trusted.
-        const skipped = trimmed.slice(consumed, match.index);
-        if (skipped.trim() !== "") {
-            const malformed = { reason: "malformed", attribute: skipped.trim() };
-            errors.push(malformed);
-            return { attributes: {}, errors, error: malformed };
-        }
+        const skipped = trimmed.slice(consumed, match.index).trim();
+        if (skipped !== "")
+            return malformedMediaHtmlAttributes({ errors, fragment: skipped });
         consumed = match.index + match[0].length;
-        const name = match[1].toLowerCase();
-        const value = match[2] ?? match[3] ?? match[4] ?? "";
+        const { name, value } = readMediaHtmlAttributeToken({ match });
         const rejection = classifyMediaHtmlAttributeToken(name, value);
         if (rejection) {
             errors.push(rejection);
@@ -181,14 +179,30 @@ export function parseMediaHtmlAttributes({ text }, _optional = {}) {
         }
         attributes[name] = value;
     }
-    const trailing = trimmed.slice(consumed);
-    if (trailing.trim() !== "") {
-        const malformed = { reason: "malformed", attribute: trailing.trim() };
-        errors.push(malformed);
-        return { attributes: {}, errors, error: malformed };
-    }
+    const trailing = trimmed.slice(consumed).trim();
+    if (trailing !== "")
+        return malformedMediaHtmlAttributes({ errors, fragment: trailing });
     return { attributes, errors, error: errors[0] ?? null };
 }
+/** The lowercased name and the value of one {@link HTML_ATTRIBUTE_TOKEN} match: whichever of the
+ *  double-quoted, single-quoted or unquoted value groups matched, or `""` for a bare boolean name.
+ *
+ * @complexity O(n) in the name's length (one lowercase pass).
+ */
+function readMediaHtmlAttributeToken({ match }, _optional = {}) {
+    return { name: match[1].toLowerCase(), value: match[2] ?? match[3] ?? match[4] ?? "" };
+}
+/** The fail-closed result once the tokenizer loses sync: `fragment` (already trimmed) is appended
+ *  to `errors` as the final `malformed` entry, and every accepted attribute is discarded — see
+ *  {@link parseMediaHtmlAttributes}'s header for why. Mutates `errors` (the caller's own list).
+ *
+ * @complexity O(1).
+ */
+function malformedMediaHtmlAttributes({ errors, fragment }, _optional = {}) {
+    const malformed = { reason: "malformed", attribute: fragment };
+    errors.push(malformed);
+    return { attributes: {}, errors, error: malformed };
+}
 /** The hint names the rejected token so operators can distinguish a typo from a hard no.
  * This is client feedback only; the server must independently enforce write/render policy. */
 export function describeMediaHtmlAttributeError({ error }, _optional = {}) {

package/dist/media/index.d.ts

@@ -3,7 +3,7 @@ export { mediaApiToken, mediaProvidersToken } from './ports.js';
 export type { MediaApiPort, MediaProvidersPort, MediaEventsPort } from './ports.js';
 export type { MediaAsset, MediaQuery, UploadInput, MediaMetadataPatch, MediaRequestOptions, MediaProvider, MediaProviderOption, MediaProviderConfiguration, MediaProviderConfigurationMap, MediaTabId, MediaContentTabId, MediaOrderBy, } from './models.js';
 export { mediaMessagesEn } from './messages.en.js';
-export { filterMediaByTab, resolveActiveTab, queryMedia, diffMediaMetadata, acceptsMedia, safeMediaUrl, canReplaceMedia, canRestoreMedia, isRetryableMediaError, parseOptionalPixelSize, formatByteSize, formatUploadDate, countMediaTabs, mediaEmbedSnippet, mediaRowHandles, } from './rules.js';
+export { filterMediaByTab, resolveActiveTab, queryMedia, diffMediaMetadata, acceptsMedia, safeMediaUrl, canReplaceMedia, canRestoreMedia, isRetryableMediaError, parseOptionalPixelSize, formatByteSize, formatUploadDate, mediaFileName, countMediaTabs, mediaEmbedSnippet, mediaRowHandles, } from './rules.js';
 export { createLibraryController } from './controllers/library.controller.js';
 export type { LibraryState } from './controllers/library.controller.js';
 export { createEditMediaController } from './controllers/edit-media.controller.js';

package/dist/media/index.js

@@ -1,7 +1,7 @@
 export { mediaModule } from './media.module.js';
 export { mediaApiToken, mediaProvidersToken } from './ports.js';
 export { mediaMessagesEn } from './messages.en.js';
-export { filterMediaByTab, resolveActiveTab, queryMedia, diffMediaMetadata, acceptsMedia, safeMediaUrl, canReplaceMedia, canRestoreMedia, isRetryableMediaError, parseOptionalPixelSize, formatByteSize, formatUploadDate, countMediaTabs, mediaEmbedSnippet, mediaRowHandles, } from './rules.js';
+export { filterMediaByTab, resolveActiveTab, queryMedia, diffMediaMetadata, acceptsMedia, safeMediaUrl, canReplaceMedia, canRestoreMedia, isRetryableMediaError, parseOptionalPixelSize, formatByteSize, formatUploadDate, mediaFileName, countMediaTabs, mediaEmbedSnippet, mediaRowHandles, } from './rules.js';
 export { createLibraryController } from './controllers/library.controller.js';
 export { createEditMediaController } from './controllers/edit-media.controller.js';
 export { createProvidersController } from './controllers/providers.controller.js';