@jini-ai/admin 0.4.12 → 0.6.10

package/dist/forms/conformance/forms-api.conformance.js

@@ -7,6 +7,23 @@ export async function runFormsApiConformance({ api }, { slug = 'forms-conformanc
         passed++;
     else
         failures.push(name); };
+    const created = await checkCreateAndRead({ api, slug, check });
+    await checkUpdates({ api, created, check });
+    if (submission)
+        await checkSubmissions({ api, created, submission, check });
+    return { passed, failures };
+}
+/** Resolves true when the operation is refused; only that probe's rejection is absorbed. */
+async function rejects({ operation }) {
+    try {
+        await operation();
+        return false;
+    }
+    catch {
+        return true;
+    }
+}
+async function checkCreateAndRead({ api, slug, check }) {
     const field = { id: 'email', label: 'Email', type: 'email', required: true, className: 'wide', attributes: { 'aria-label': 'Email' } };
     const created = await api.createFormDefinition({ name: 'Contact', slug, fields: [field] }, { notify: { enabled: true, recipients: ['owner@example.com'] } });
     check('create returns requested definition', created.name === 'Contact' && created.slug === slug && created.status === 'active');
@@ -16,56 +33,35 @@ export async function runFormsApiConformance({ api }, { slug = 'forms-conformanc
     const snapshot = await api.getFormDefinition({ id: created.id });
     Object.assign(snapshot.fields[0], { label: 'Changed only in the read snapshot' });
     check('read snapshots cannot mutate stored fields', (await api.getFormDefinition({ id: created.id })).fields[0]?.label === 'Email');
-    const updated = await api.updateFormDefinition({ id: created.id }, { name: 'Renamed', fields: [...created.fields, { id: 'message', label: 'Message', type: 'textarea', required: false }] });
+    return created;
+}
+async function checkUpdates({ api, created, check }) {
+    const { id } = created;
+    const updated = await api.updateFormDefinition({ id }, { name: 'Renamed', fields: [...created.fields, { id: 'message', label: 'Message', type: 'textarea', required: false }] });
     check('name patch and added field persist', updated.name === 'Renamed' && updated.fields.length === 2);
     check('untouched notify survives update', updated.notify.enabled && updated.notify.recipients[0] === 'owner@example.com');
-    let refused = false;
-    try {
-        await api.updateFormDefinition({ id: created.id }, { fields: [] });
-    }
-    catch {
-        refused = true;
-    }
-    check('existing fields cannot be removed', refused);
-    check('rejected removal leaves fields intact', (await api.getFormDefinition({ id: created.id })).fields.length === 2);
-    const disabled = await api.updateFormDefinition({ id: created.id }, { status: 'disabled' });
-    check('definition disable is reversible', disabled.status === 'disabled' && (await api.updateFormDefinition({ id: created.id }, { status: 'active' })).status === 'active');
-    const html = await api.updateFormDefinition({ id: created.id }, { mode: 'html', html: '<input name="email">' });
+    check('existing fields cannot be removed', await rejects({ operation: () => api.updateFormDefinition({ id }, { fields: [] }) }));
+    check('rejected removal leaves fields intact', (await api.getFormDefinition({ id })).fields.length === 2);
+    const disabled = await api.updateFormDefinition({ id }, { status: 'disabled' });
+    check('definition disable is reversible', disabled.status === 'disabled' && (await api.updateFormDefinition({ id }, { status: 'active' })).status === 'active');
+    const html = await api.updateFormDefinition({ id }, { mode: 'html', html: '<input name="email">' });
     check('HTML authoring survives update', html.mode === 'html' && html.html === '<input name="email">');
-    check('builder switch is explicit', (await api.updateFormDefinition({ id: created.id }, { mode: 'builder' })).mode === 'builder');
-    check('empty submission page has null cursor', (await api.listFormSubmissions({ formId: created.id })).nextCursor === null);
+    check('builder switch is explicit', (await api.updateFormDefinition({ id }, { mode: 'builder' })).mode === 'builder');
+    check('empty submission page has null cursor', (await api.listFormSubmissions({ formId: id })).nextCursor === null);
     check('definition has no delete operation', !('deleteFormDefinition' in api));
-    if (submission) {
-        const page = await api.listFormSubmissions({ formId: submission.formId }, { limit: 1 });
-        check('submission page is form scoped', page.items.every(item => item.formDefinitionId === submission.formId));
-        check('submission detail is scoped', (await api.getFormSubmission(submission)).formDefinitionId === submission.formId);
-        let wrongFormRejected = false;
-        try {
-            await api.getFormSubmission({ formId: created.id, submissionId: submission.submissionId });
-        }
-        catch {
-            wrongFormRejected = true;
-        }
-        check('a submission of another form is unavailable', wrongFormRejected);
-        let wrongFormDeleteRejected = false;
-        try {
-            await api.deleteFormSubmission({ formId: created.id, submissionId: submission.submissionId });
-        }
-        catch {
-            wrongFormDeleteRejected = true;
-        }
-        check('cross-form trash is rejected without removing the submission', wrongFormDeleteRejected && (await api.getFormSubmission(submission)).id === submission.submissionId);
+}
+async function checkSubmissions({ api, created, submission, check }) {
+    const crossForm = { formId: created.id, submissionId: submission.submissionId };
+    const page = await api.listFormSubmissions({ formId: submission.formId }, { limit: 1 });
+    check('submission page is form scoped', page.items.every(item => item.formDefinitionId === submission.formId));
+    check('submission detail is scoped', (await api.getFormSubmission(submission)).formDefinitionId === submission.formId);
+    check('a submission of another form is unavailable', await rejects({ operation: () => api.getFormSubmission(crossForm) }));
+    const wrongFormDeleteRejected = await rejects({ operation: () => api.deleteFormSubmission(crossForm) });
+    const submissionRetained = await api.getFormSubmission(submission).then(item => item.id === submission.submissionId, () => false);
+    check('cross-form trash is rejected without removing the submission', wrongFormDeleteRejected && submissionRetained);
+    if (submissionRetained)
         await api.deleteFormSubmission(submission);
-        let missing = false;
-        try {
-            await api.getFormSubmission(submission);
-        }
-        catch {
-            missing = true;
-        }
-        check('trashed submission detail is unavailable', missing);
-        check('trashed submission is absent from active pages', !(await api.listFormSubmissions({ formId: submission.formId })).items.some(item => item.id === submission.submissionId));
-    }
-    return { passed, failures };
+    check('trashed submission detail is unavailable', await rejects({ operation: () => api.getFormSubmission(submission) }));
+    check('trashed submission is absent from active pages', !(await api.listFormSubmissions({ formId: submission.formId })).items.some(item => item.id === submission.submissionId));
 }
 //# sourceMappingURL=forms-api.conformance.js.map

package/dist/forms/field-settings.js

@@ -23,6 +23,20 @@ function defaultKindOf(kind) {
         return "temporal";
     return kind.control === "textarea" ? "textarea" : "text";
 }
+const isNumeric = ({ kind }) => kind.htmlType === "number" || kind.htmlType === "range";
+/** Native input type for a kind's min/max; number and range share numeric bounds. */
+function boundsOf({ kind }) {
+    if (!BOUNDS.has(kind.htmlType))
+        return null;
+    return isNumeric({ kind }) ? "number" : kind.htmlType;
+}
+/** Whether a (non-hidden) kind shows a placeholder. */
+function takesPlaceholder({ kind }) {
+    // A single-choice select shows its placeholder as the empty first option.
+    if (kind.control === "select")
+        return !kind.multiple;
+    return kind.textual === true || kind.htmlType === "number";
+}
 /**
  * Settings for one type, from its registry kind. Unknown (legacy or host-added) types get help
  * text only, so the editor never offers a setting the server would refuse.
@@ -33,15 +47,13 @@ export function fieldSettingsFor({ type }, _optional = {}) {
     if (!kind)
         return NO_SETTINGS;
     const hidden = kind.htmlType === "hidden";
-    const numeric = kind.htmlType === "number" || kind.htmlType === "range";
-    const bounds = BOUNDS.has(kind.htmlType) ? (numeric ? "number" : kind.htmlType) : null;
+    const numeric = isNumeric({ kind });
     return {
-        // A single-choice select shows its placeholder as the empty first option.
-        placeholder: !hidden && ((kind.textual === true && kind.control !== "select") || kind.htmlType === "number" || (kind.control === "select" && !kind.multiple)),
+        placeholder: !hidden && takesPlaceholder({ kind }),
         helpText: !hidden,
         length: kind.textual === true,
         pattern: kind.textual === true && !hidden,
-        bounds,
+        bounds: boundsOf({ kind }),
         step: numeric,
         options: kind.choices === true,
         multiple: kind.multiple === true,
@@ -96,53 +108,45 @@ const SEED_OPTIONS = [{ value: "Option 1", label: "Option 1" }, { value: "Option
 export function retypeField({ field, type }, _optional = {}) {
     const before = fieldSettingsFor({ type: field.type });
     const after = fieldSettingsFor({ type });
-    const next = { id: field.id, label: field.label, type, required: after.helpText ? field.required : false };
-    if (after.helpText && field.helpText !== undefined)
-        next.helpText = field.helpText;
-    if (field.className !== undefined)
-        next.className = field.className;
-    if (field.attributes !== undefined)
-        next.attributes = { ...field.attributes };
-    if (after.placeholder && field.placeholder !== undefined)
-        next.placeholder = field.placeholder;
-    if (after.length) {
-        if (field.maxLength != null)
-            next.maxLength = field.maxLength;
-        if (field.minLength !== undefined)
-            next.minLength = field.minLength;
-    }
-    if (after.pattern && field.pattern !== undefined)
-        next.pattern = field.pattern;
-    if (after.bounds && after.bounds === before.bounds) {
-        if (field.min !== undefined)
-            next.min = field.min;
-        if (field.max !== undefined)
-            next.max = field.max;
-    }
-    if (after.step && field.step !== undefined)
-        next.step = field.step;
-    if (after.options)
-        next.options = field.options?.length ? field.options.map((option) => ({ ...option })) : SEED_OPTIONS.map((option) => ({ ...option }));
-    if (after.upload) {
-        if (field.accept !== undefined)
-            next.accept = [...field.accept];
-        if (field.maxFileSize !== undefined)
-            next.maxFileSize = field.maxFileSize;
+    return {
+        id: field.id, label: field.label, type, required: after.helpText ? field.required : false,
+        ...setKeys({ field, keys: retainedKeys({ field, before, after }) }),
+        ...(after.options ? { options: (field.options?.length ? field.options : SEED_OPTIONS).map((option) => ({ ...option })) } : {}),
+        ...setKeys({ field, keys: after.upload ? ["accept", "maxFileSize"] : [] }),
+        // A default only survives when its shape is unchanged (text to text, one choice to one choice).
+        ...(keepsDefault({ before, after }) && field.default !== undefined ? { default: field.default } : {}),
+    };
+}
+const when = (applies, keys) => (applies ? keys : []);
+/** The settings before the options that a retype keeps, in the field's key order. */
+function retainedKeys({ field, before, after }) {
+    return [
+        ...when(after.helpText, ["helpText"]), "className", "attributes", ...when(after.placeholder, ["placeholder"]),
+        // A null max length (the wire's "cleared") is dropped rather than carried.
+        ...when(after.length && field.maxLength != null, ["maxLength"]), ...when(after.length, ["minLength"]),
+        ...when(after.pattern, ["pattern"]),
+        ...when(after.bounds !== null && after.bounds === before.bounds, ["min", "max"]),
+        ...when(after.step, ["step"]),
+    ];
+}
+const keepsDefault = ({ before, after }) => after.defaultKind !== null && after.defaultKind === before.defaultKind && after.bounds === before.bounds;
+/** The listed keys the field has set, in order; attribute maps and accept lists are copied, not shared. */
+function setKeys({ field, keys }) {
+    const kept = {};
+    for (const key of keys) {
+        const value = field[key];
+        if (value === undefined)
+            continue;
+        Object.assign(kept, { [key]: Array.isArray(value) ? [...value] : typeof value === "object" && value !== null ? { ...value } : value });
     }
-    // A default only survives when its shape is unchanged (text to text, one choice to one choice).
-    if (field.default !== undefined && after.defaultKind !== null && after.defaultKind === before.defaultKind && after.bounds === before.bounds)
-        next.default = field.default;
-    return next;
+    return kept;
 }
 const text = (value) => (value === undefined || value === null ? "" : String(value));
 /** Seed the draft from a stored field. @complexity O(o) in options. */
 export function settingsFormFromField({ field }, _optional = {}) {
-    const defaults = field.default;
     return {
         placeholder: text(field.placeholder), helpText: text(field.helpText),
-        defaultText: typeof defaults === "boolean" || Array.isArray(defaults) ? "" : text(defaults),
-        defaultChecked: defaults === true || (field.checkboxValue !== undefined && defaults === field.checkboxValue),
-        defaultChoices: Array.isArray(defaults) ? [...defaults] : typeof defaults === "string" && fieldSettingsFor({ type: field.type }).options ? [defaults] : [],
+        ...defaultDraft({ field }),
         minLength: text(field.minLength), maxLength: text(field.maxLength), pattern: text(field.pattern),
         min: text(field.min), max: text(field.max), step: text(field.step),
         options: (field.options ?? []).map((option, index) => ({ _rowId: index, value: option.value, label: option.label })),
@@ -150,6 +154,21 @@ export function settingsFormFromField({ field }, _optional = {}) {
         maxFileSizeMb: field.maxFileSize === undefined ? "" : String(Math.round((field.maxFileSize / 1024 / 1024) * 100) / 100),
     };
 }
+/** The stored default as the dialog's three default controls. */
+function defaultDraft({ field }) {
+    const defaults = field.default;
+    return {
+        defaultText: typeof defaults === "boolean" || Array.isArray(defaults) ? "" : text(defaults),
+        defaultChecked: defaults === true || (field.checkboxValue !== undefined && defaults === field.checkboxValue),
+        defaultChoices: defaultChoicesOf({ field }),
+    };
+}
+function defaultChoicesOf({ field }) {
+    const defaults = field.default;
+    if (Array.isArray(defaults))
+        return [...defaults];
+    return typeof defaults === "string" && fieldSettingsFor({ type: field.type }).options ? [defaults] : [];
+}
 /**
  * Edit one option row. A value that still mirrors its label follows label edits, so typing labels
  * is enough for most forms; an edited value stays put.
@@ -199,59 +218,74 @@ function optionalNumber(value, error, { integer = false } = {}) {
     return Number.isFinite(number) && (!integer || (Number.isInteger(number) && number >= 0)) ? { ok: true, value: number } : { ok: false, error };
 }
 /** Text length, pattern and placeholder settings. */
-function textPatch(form, settings) {
-    const patch = { placeholder: settings.placeholder && !isBlank(form.placeholder) ? form.placeholder : undefined, pattern: undefined, minLength: undefined };
-    if (settings.length) {
-        const min = optionalNumber(form.minLength, "Length must be a whole number.", { integer: true });
-        const max = optionalNumber(form.maxLength, "Length must be a whole number.", { integer: true });
-        if (!min.ok)
-            return min;
-        if (!max.ok)
-            return max;
-        if (min.value !== undefined && max.value !== undefined && min.value > max.value)
-            return { ok: false, error: "Minimum must not be above maximum." };
-        patch.minLength = min.value;
-        // The wire contract clears a text length with null; unsupported types omit the key entirely.
-        patch.maxLength = max.value ?? null;
-    }
-    if (settings.pattern && !isBlank(form.pattern)) {
-        // Browser-safe too: a `v`-flag-invalid pattern is silently ignored by browsers (2026-10-11).
-        if (!isBrowserSafeFieldPattern({ pattern: form.pattern }))
-            return { ok: false, error: "That pattern isn't supported." };
-        patch.pattern = form.pattern;
-    }
-    return { ok: true, value: patch };
+function textPatch({ form, settings }) {
+    const length = settings.length ? lengthPatch({ form }) : { ok: true, value: {} };
+    if (!length.ok)
+        return length;
+    const pattern = settings.pattern ? patternOf({ form }) : { ok: true, value: undefined };
+    if (!pattern.ok)
+        return pattern;
+    return { ok: true, value: {
+            placeholder: settings.placeholder && !isBlank(form.placeholder) ? form.placeholder : undefined,
+            pattern: pattern.value, minLength: undefined, ...length.value,
+        } };
+}
+const MIN_ABOVE_MAX = { ok: false, error: "Minimum must not be above maximum." };
+const isAbove = (min, max) => min !== undefined && max !== undefined && min > max;
+function lengthPatch({ form }) {
+    const min = optionalNumber(form.minLength, "Length must be a whole number.", { integer: true });
+    const max = optionalNumber(form.maxLength, "Length must be a whole number.", { integer: true });
+    if (!min.ok)
+        return min;
+    if (!max.ok)
+        return max;
+    if (isAbove(min.value, max.value))
+        return MIN_ABOVE_MAX;
+    // The wire contract clears a text length with null; unsupported types omit the key entirely.
+    return { ok: true, value: { minLength: min.value, maxLength: max.value ?? null } };
+}
+function patternOf({ form }) {
+    if (isBlank(form.pattern))
+        return { ok: true, value: undefined };
+    // Browser-safe too: a `v`-flag-invalid pattern is silently ignored by browsers (2026-10-11).
+    if (!isBrowserSafeFieldPattern({ pattern: form.pattern }))
+        return { ok: false, error: "That pattern isn't supported." };
+    return { ok: true, value: form.pattern };
 }
 /** Numeric or date/time bounds, plus a numeric step. Native date/time strings compare as text. */
-function boundsPatch(form, settings) {
-    const patch = { min: undefined, max: undefined, step: undefined };
-    if (settings.bounds === "number") {
-        const min = optionalNumber(form.min, "Enter numbers for min, max and step.");
-        const max = optionalNumber(form.max, "Enter numbers for min, max and step.");
-        const step = optionalNumber(form.step, "Enter numbers for min, max and step.");
-        if (!min.ok)
-            return min;
-        if (!max.ok)
-            return max;
-        if (!step.ok)
-            return step;
-        if (step.value !== undefined && step.value <= 0)
-            return { ok: false, error: "Step must be above 0." };
-        if (min.value !== undefined && max.value !== undefined && min.value > max.value)
-            return { ok: false, error: "Minimum must not be above maximum." };
-        return { ok: true, value: { min: min.value, max: max.value, step: step.value } };
-    }
-    if (settings.bounds) {
-        const min = isBlank(form.min) ? undefined : form.min;
-        const max = isBlank(form.max) ? undefined : form.max;
-        if (min !== undefined && max !== undefined && min > max)
-            return { ok: false, error: "Minimum must not be above maximum." };
-        return { ok: true, value: { min, max } };
-    }
-    return { ok: true, value: patch };
+function boundsPatch({ form, settings }) {
+    if (settings.bounds === "number")
+        return numberBoundsPatch({ form });
+    if (settings.bounds)
+        return textBoundsPatch({ form });
+    return { ok: true, value: { min: undefined, max: undefined, step: undefined } };
+}
+function numberBoundsPatch({ form }) {
+    const error = "Enter numbers for min, max and step.";
+    const min = optionalNumber(form.min, error);
+    const max = optionalNumber(form.max, error);
+    const step = optionalNumber(form.step, error);
+    if (!min.ok)
+        return min;
+    if (!max.ok)
+        return max;
+    if (!step.ok)
+        return step;
+    if (step.value !== undefined && step.value <= 0)
+        return { ok: false, error: "Step must be above 0." };
+    if (isAbove(min.value, max.value))
+        return MIN_ABOVE_MAX;
+    return { ok: true, value: { min: min.value, max: max.value, step: step.value } };
+}
+function textBoundsPatch({ form }) {
+    const min = isBlank(form.min) ? undefined : form.min;
+    const max = isBlank(form.max) ? undefined : form.max;
+    if (isAbove(min, max))
+        return MIN_ABOVE_MAX;
+    return { ok: true, value: { min, max } };
 }
 /** Choice options: blank rows are skipped; the rest need a label and a unique value. */
-function optionsPatch(form, settings) {
+function optionsPatch({ form, settings }) {
     if (!settings.options)
         return { ok: true, value: undefined };
     const options = form.options.filter((row) => !(isBlank(row.value) && isBlank(row.label))).map((row) => ({ value: row.value.trim(), label: row.label.trim() }));
@@ -262,26 +296,27 @@ function optionsPatch(form, settings) {
     }
     return { ok: true, value: options };
 }
+const typedDefault = ({ form }) => ({ ok: true, value: isBlank(form.defaultText) ? undefined : form.defaultText });
+const DEFAULT_READERS = {
+    // A box with an authored value submits that value, so its "checked" default is that value too.
+    boolean: ({ form, checkboxValue }) => ({ ok: true, value: form.defaultChecked ? checkboxValue ?? true : undefined }),
+    choice: ({ form, offered }) => ({ ok: true, value: form.defaultChoices.find((value) => offered.has(value)) }),
+    choices: ({ form, offered }) => {
+        const chosen = form.defaultChoices.filter((value) => offered.has(value));
+        return { ok: true, value: chosen.length ? chosen : undefined };
+    },
+    number: ({ form }) => optionalNumber(form.defaultText, "Default must be a number."),
+    text: typedDefault, textarea: typedDefault, temporal: typedDefault,
+};
 /** The default in the stored shape for its kind; choices drop values no longer offered. */
-function defaultValue(form, settings, { options, checkboxValue }) {
+function defaultValue({ form, settings }, { options, checkboxValue }) {
+    if (settings.defaultKind === null)
+        return { ok: true, value: undefined };
     const offered = new Set((options ?? []).map((option) => option.value));
-    switch (settings.defaultKind) {
-        // A box with an authored value submits that value, so its "checked" default is that value too.
-        case "boolean": return { ok: true, value: form.defaultChecked ? checkboxValue ?? true : undefined };
-        case "choice": return { ok: true, value: form.defaultChoices.find((value) => offered.has(value)) };
-        case "choices": {
-            const chosen = form.defaultChoices.filter((value) => offered.has(value));
-            return { ok: true, value: chosen.length ? chosen : undefined };
-        }
-        case "number": return optionalNumber(form.defaultText, "Default must be a number.");
-        case "text":
-        case "textarea":
-        case "temporal": return { ok: true, value: isBlank(form.defaultText) ? undefined : form.defaultText };
-        default: return { ok: true, value: undefined };
-    }
+    return DEFAULT_READERS[settings.defaultKind]({ form, offered, checkboxValue });
 }
 /** Upload limits: no boxes ticked means every safe type; size is whole megabytes up to the cap. */
-function uploadPatch(form, settings) {
+function uploadPatch({ form, settings }) {
     if (!settings.upload)
         return { ok: true, value: {} };
     const size = optionalNumber(form.maxFileSizeMb, "Max size must be up to 10 MB.");
@@ -302,19 +337,19 @@ function uploadPatch(form, settings) {
  */
 export function buildFieldSettingsPatch({ form, field }, _optional = {}) {
     const settings = fieldSettingsFor({ type: field.type });
-    const textual = textPatch(form, settings);
+    const textual = textPatch({ form, settings });
     if (!textual.ok)
         return textual;
-    const bounds = boundsPatch(form, settings);
+    const bounds = boundsPatch({ form, settings });
     if (!bounds.ok)
         return bounds;
-    const options = optionsPatch(form, settings);
+    const options = optionsPatch({ form, settings });
     if (!options.ok)
         return options;
-    const fallback = defaultValue(form, settings, { options: options.value, checkboxValue: field.checkboxValue });
+    const fallback = defaultValue({ form, settings }, { options: options.value, checkboxValue: field.checkboxValue });
     if (!fallback.ok)
         return fallback;
-    const upload = uploadPatch(form, settings);
+    const upload = uploadPatch({ form, settings });
     if (!upload.ok)
         return upload;
     return { ok: true, patch: {

package/dist/forms/html-rules.js

@@ -28,11 +28,22 @@ export function formatFormAnswer({ value, options, type }, display = {}) {
     if (Array.isArray(value))
         return value.map(item => formatFormAnswer({ value: item, options, type }, display)).join(", ");
     if (typeof value === "boolean")
-        return value ? display.yes ?? "Yes" : display.no ?? "No";
-    if (typeof value === "string" && type !== undefined && type in TEMPORAL_STYLES)
-        return formatTemporal({ value, type }, display);
+        return formatBoolean({ value }, display);
     if (typeof value === "string")
-        return options?.find(option => option.value === value)?.label ?? value;
+        return formatText({ value, options, type }, display);
+    return formatOther({ value });
+}
+function formatBoolean({ value }, { yes = "Yes", no = "No" }) {
+    return value ? yes : no;
+}
+/** A temporal field's answer as a date; any other string as its choice label, or raw. */
+function formatText({ value, options, type }, display) {
+    if (type !== undefined && type in TEMPORAL_STYLES)
+        return formatTemporal({ value, type }, display);
+    return options?.find(option => option.value === value)?.label ?? value;
+}
+/** A file reference as its name and size; any other value as JSON or its string form. */
+function formatOther({ value }) {
     const file = formAnswerFile({ value });
     if (file)
         return file.byteSize === undefined ? file.filename : `${file.filename} (${formatByteSize({ bytes: file.byteSize })})`;
@@ -92,32 +103,38 @@ function starterAttributes(field, kind) {
 /** One field's starter markup; every control comes from the registry kind, as the public render does. */
 function starterField(field) {
     const kind = kindOf(field.type);
-    const label = escapeHtml(field.label);
-    const attrs = starterAttributes(field, kind);
-    const options = field.options ?? [];
-    if (kind.control === "group") {
-        // One box per option under a shared name; the CMS collects them back into this choice field.
-        // Native `required` on every checkbox would demand ALL of them, so a checkbox group leaves it
-        // off (the server still enforces one-or-more); a radio group's `required` means "pick one".
-        const boxAttrs = kind.multiple ? starterAttributes({ ...field, required: false }, kind) : attrs;
-        const boxes = options.map((option) => `  <label><input type="${kind.htmlType}" ${boxAttrs} value="${escapeHtml(option.value)}"${isDefault(field, option.value) ? " checked" : ""}> ${escapeHtml(option.label)}</label>`);
-        return `<fieldset>\n  <legend>${label}</legend>\n${boxes.join("\n")}\n</fieldset>`;
-    }
-    if (kind.control === "select") {
-        const empty = kind.multiple ? [] : [`    <option value="">${escapeHtml(field.placeholder ?? "Choose an option")}</option>`];
-        const choices = options.map((option) => `    <option value="${escapeHtml(option.value)}"${isDefault(field, option.value) ? " selected" : ""}>${escapeHtml(option.label)}</option>`);
-        return `<label>${label}\n  <select ${attrs}${kind.multiple ? " multiple" : ""}>\n${[...empty, ...choices].join("\n")}\n  </select>\n</label>`;
-    }
+    return starterRendererFor({ kind })({ field, kind, label: escapeHtml(field.label), attrs: starterAttributes(field, kind) });
+}
+function starterRendererFor({ kind }) {
+    if (kind.control === "group")
+        return starterGroup;
+    if (kind.control === "select")
+        return starterSelect;
     if (kind.control === "textarea")
-        return `<label>${label}\n  <textarea ${attrs}></textarea>\n</label>`;
+        return ({ label, attrs }) => `<label>${label}\n  <textarea ${attrs}></textarea>\n</label>`;
     if (kind.htmlType === "hidden")
-        return `<input type="hidden" ${attrs} value="${escapeHtml(String(field.default ?? ""))}" aria-label="${label}">`;
-    if (kind.htmlType === "checkbox") {
-        const value = field.checkboxValue !== undefined ? ` value="${escapeHtml(field.checkboxValue)}"` : "";
-        const checked = field.default === true || (field.checkboxValue !== undefined && field.default === field.checkboxValue) ? " checked" : "";
-        return `<label><input type="checkbox"${field.type === "toggle" ? ' role="switch"' : ""} ${attrs}${value}${checked}> ${label}</label>`;
-    }
-    return `<label>${label}\n  <input type="${kind.htmlType}" ${attrs}>\n</label>`;
+        return ({ field, label, attrs }) => `<input type="hidden" ${attrs} value="${escapeHtml(String(field.default ?? ""))}" aria-label="${label}">`;
+    if (kind.htmlType === "checkbox")
+        return starterCheckbox;
+    return ({ label, attrs }) => `<label>${label}\n  <input type="${kind.htmlType}" ${attrs}>\n</label>`;
+}
+function starterGroup({ field, kind, label, attrs }) {
+    // One box per option under a shared name; the CMS collects them back into this choice field.
+    // Native `required` on every checkbox would demand ALL of them, so a checkbox group leaves it
+    // off (the server still enforces one-or-more); a radio group's `required` means "pick one".
+    const boxAttrs = kind.multiple ? starterAttributes({ ...field, required: false }, kind) : attrs;
+    const boxes = (field.options ?? []).map((option) => `  <label><input type="${kind.htmlType}" ${boxAttrs} value="${escapeHtml(option.value)}"${isDefault(field, option.value) ? " checked" : ""}> ${escapeHtml(option.label)}</label>`);
+    return `<fieldset>\n  <legend>${label}</legend>\n${boxes.join("\n")}\n</fieldset>`;
+}
+function starterSelect({ field, kind, label, attrs }) {
+    const empty = kind.multiple ? [] : [`    <option value="">${escapeHtml(field.placeholder ?? "Choose an option")}</option>`];
+    const choices = (field.options ?? []).map((option) => `    <option value="${escapeHtml(option.value)}"${isDefault(field, option.value) ? " selected" : ""}>${escapeHtml(option.label)}</option>`);
+    return `<label>${label}\n  <select ${attrs}${kind.multiple ? " multiple" : ""}>\n${[...empty, ...choices].join("\n")}\n  </select>\n</label>`;
+}
+function starterCheckbox({ field, label, attrs }) {
+    const value = field.checkboxValue !== undefined ? ` value="${escapeHtml(field.checkboxValue)}"` : "";
+    const checked = field.default === true || (field.checkboxValue !== undefined && field.default === field.checkboxValue) ? " checked" : "";
+    return `<label><input type="checkbox"${field.type === "toggle" ? ' role="switch"' : ""} ${attrs}${value}${checked}> ${label}</label>`;
 }
 /**
  * Editable form BODY only: the server supplies the transport and spam-protection wrapper. Each

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

@@ -0,0 +1,22 @@
+import type { useFieldSettingsView } from '../hooks/forms-view.hooks.js';
+/**
+ * @file The row groups `FieldSettingsSection` stacks, split out so each group's show/hide branches
+ * are counted on their own. Markup only: every value and handler comes from `useFieldSettingsView`.
+ */
+type FieldSettingsView = ReturnType<typeof useFieldSettingsView>;
+export interface FieldSettingsRowsProps {
+    view: FieldSettingsView;
+    t: (key: string) => string;
+}
+/** Placeholder and help-text rows. */
+export declare function FieldSettingsTextRows({ view, t }: FieldSettingsRowsProps): import("react").JSX.Element;
+/** The option list editor of a choice field. */
+export declare function FieldSettingsOptionsRow({ view, t }: FieldSettingsRowsProps): import("react").JSX.Element;
+/** The default-value row: a box, a single-choice select, or a typed input, whichever the type takes. */
+export declare function FieldSettingsDefaultRows({ view, t }: FieldSettingsRowsProps): import("react").JSX.Element;
+/** Length, pattern and range rows. */
+export declare function FieldSettingsLimitRows({ view, t }: FieldSettingsRowsProps): import("react").JSX.Element;
+/** Accepted file types and max size of an upload field. */
+export declare function FieldSettingsUploadRows({ view, t }: FieldSettingsRowsProps): import("react").JSX.Element;
+export {};
+//# sourceMappingURL=FieldSettingsRows.d.ts.map

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

@@ -0,0 +1,29 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } 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';
+/** Placeholder and help-text rows. */
+export function FieldSettingsTextRows({ view, t }) {
+    const { settings, form } = view;
+    return (_jsxs(_Fragment, { 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] }));
+}
+/** The option list editor of a choice field. */
+export function FieldSettingsOptionsRow({ view, t }) {
+    return (_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') })] })] }));
+}
+/** The default-value row: a box, a single-choice select, or a typed input, whichever the type takes. */
+export function FieldSettingsDefaultRows({ view, t }) {
+    const { settings, form } = view;
+    return (_jsxs(_Fragment, { children: [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] }));
+}
+/** Length, pattern and range rows. */
+export function FieldSettingsLimitRows({ view, t }) {
+    const { settings, form } = view;
+    return (_jsxs(_Fragment, { children: [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] }));
+}
+/** Accepted file types and max size of an upload field. */
+export function FieldSettingsUploadRows({ view, t }) {
+    const { form } = view;
+    return (_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' }) })] })] }));
+}
+//# sourceMappingURL=FieldSettingsRows.js.map