@flanksource/clicky-ui 0.3.33 → 0.3.35

package/dist/components/json-schema-form-object.js

@@ -1,17 +1,22 @@
-import { jsxs, jsx } from "react/jsx-runtime";
+import { jsxs, jsx, Fragment } from "react/jsx-runtime";
 import "react";
 import { isPlainObject } from "../lib/collections.js";
 import { cn } from "../lib/utils.js";
 import { Icon } from "../data/Icon.js";
 import { Button } from "./button.js";
 import { Combobox } from "./Combobox.js";
-import { fieldInputId, keyPickerOptions, inputClass, cssLength, DEFAULT_COLUMN_MIN_WIDTH, normalizeColumns } from "./json-schema-form-utils.js";
+import { fieldInputId, cssLength, DEFAULT_COLUMN_MIN_WIDTH, normalizeColumns, keyPickerOptions, inputClass } from "./json-schema-form-utils.js";
 import { FieldsGrid } from "./json-schema-form-layout.js";
+import { PropertyValueEditor } from "./json-schema-form-properties.js";
+import { propertyControlSize } from "./json-schema-form-properties-size.js";
 import { appendInstancePath } from "./json-schema-form-errors.js";
 import { controlHeightClass, inputSizeClass, fieldInnerGapClass } from "./json-schema-form-size.js";
 import { UiTrash } from "../icons/components/UiTrash.js";
 import { UiAdd } from "../icons/components/UiAdd.js";
-function ObjectControl({ field, ctx }) {
+function ObjectControl({
+  field,
+  ctx
+}) {
   const obj = isPlainObject(field.value) ? field.value : {};
   const subSchema = {
     type: "object",
@@ -33,24 +38,36 @@ function ObjectControl({ field, ctx }) {
       layout: ctx.layout,
       size: ctx.size,
       columns: normalizeColumns(subSchema["x-columns"]),
-      columnMinWidth: cssLength(subSchema["x-column-min-width"], DEFAULT_COLUMN_MIN_WIDTH),
+      columnMinWidth: cssLength(
+        subSchema["x-column-min-width"],
+        DEFAULT_COLUMN_MIN_WIDTH
+      ),
       ...typeof subSchema["x-columns-max-width"] === "string" ? { columnsMaxWidth: subSchema["x-columns-max-width"] } : {},
       ...typeof subSchema["x-classes"] === "string" ? { className: subSchema["x-classes"] } : {},
-      children: ctx.render.renderObjectFields(subSchema, obj, (next) => field.onChange(next), {
-        ...ctx,
-        readOnly: ctx.readOnly || field.readOnly === true,
-        depth: ctx.depth + 1
-      })
+      children: ctx.render.renderObjectFields(
+        subSchema,
+        obj,
+        (next) => field.onChange(next),
+        {
+          ...ctx,
+          readOnly: ctx.readOnly || field.readOnly === true,
+          depth: ctx.depth + 1
+        }
+      )
     }
   );
 }
-function StringMapControl({ field, ctx }) {
+function StringMapControl({
+  field,
+  ctx
+}) {
   const readOnly = ctx.readOnly || field.readOnly === true;
   const map = isPlainObject(field.value) ? field.value : {};
   const known = field.knownProperties ?? {};
   const knownKeys = Object.keys(known);
   const extraKeys = Object.keys(map).filter((k) => !(k in known));
   const childCtx = { ...ctx, readOnly, depth: ctx.depth + 1 };
+  const properties = ctx.layout.mode === "properties";
   const pn = field.schema.propertyNames;
   const keyTitle = typeof (pn == null ? void 0 : pn.title) === "string" && pn.title ? pn.title : void 0;
   function valueSchemaForKey(key) {
@@ -74,7 +91,8 @@ function StringMapControl({ field, ctx }) {
   function renameEntry(oldKey, newKey) {
     if (newKey === oldKey) return;
     const next = {};
-    for (const [k, v] of Object.entries(map)) next[k === oldKey ? newKey : k] = v;
+    for (const [k, v] of Object.entries(map))
+      next[k === oldKey ? newKey : k] = v;
     field.onChange(next);
   }
   function removeEntry(key) {
@@ -103,85 +121,221 @@ function StringMapControl({ field, ctx }) {
   function valueControlForKey(key) {
     return valueControlFor(key, valueSchemaForKey(key));
   }
-  return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col rounded-md border border-input p-2", fieldInnerGapClass[childCtx.size]), children: [
-    knownKeys.map((key) => /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-[10rem_1fr] items-center gap-2", children: [
-      /* @__PURE__ */ jsx(
-        "label",
-        {
-          htmlFor: fieldInputId(appendInstancePath(ctx.instancePath, key), childCtx.idPrefix),
-          className: "truncate text-xs text-muted-foreground",
-          title: key,
-          children: key
-        }
-      ),
-      /* @__PURE__ */ jsx("div", { className: "min-w-0", children: valueControlFor(key, known[key] ?? { type: "string" }) })
-    ] }, `known-${key}`)),
-    extraKeys.map((key) => {
-      const keyControl = field.keyOptions ? /* @__PURE__ */ jsx(
-        Combobox,
-        {
-          options: keyPickerOptions(field.keyOptions, extraKeys, key),
-          value: key,
-          disabled: readOnly,
-          size: childCtx.size,
-          allowCustomValue: false,
-          onChange: (next) => renameEntry(key, next),
-          placeholder: "Select…"
-        }
-      ) : /* @__PURE__ */ jsx(
-        "input",
-        {
-          type: "text",
-          "aria-label": "Field name",
-          className: cn(inputClass(childCtx.size), "font-mono"),
-          value: key,
-          disabled: readOnly,
-          onChange: (e) => renameEntry(key, e.target.value)
-        }
-      );
-      const removeButton = !readOnly ? /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          "aria-label": `Remove ${key}`,
-          className: cn(
-            "inline-flex aspect-square shrink-0 items-center justify-center rounded text-muted-foreground hover:bg-accent hover:text-foreground",
-            controlHeightClass[childCtx.size]
-          ),
-          onClick: () => removeEntry(key),
-          children: /* @__PURE__ */ jsx(Icon, { icon: UiTrash, className: "text-sm" })
-        }
-      ) : null;
-      if (entryIsStacked(key)) {
-        return /* @__PURE__ */ jsxs("div", { className: "space-y-1.5 rounded-md border border-input p-2", children: [
-          keyTitle && /* @__PURE__ */ jsx("span", { className: "block text-xs font-medium text-muted-foreground", children: keyTitle }),
-          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-            /* @__PURE__ */ jsx("div", { className: "min-w-0 flex-1", children: keyControl }),
-            removeButton
-          ] }),
-          /* @__PURE__ */ jsx("div", { className: "min-w-0", children: valueControlForKey(key) })
-        ] }, `extra-${key}`);
+  function keyEditor({
+    key,
+    value,
+    onChange
+  }) {
+    const size = properties ? propertyControlSize[ctx.size] : ctx.size;
+    return field.keyOptions ? /* @__PURE__ */ jsx(
+      Combobox,
+      {
+        options: keyPickerOptions(
+          field.keyOptions,
+          [...knownKeys, ...extraKeys],
+          key
+        ),
+        value,
+        disabled: readOnly,
+        size,
+        allowCustomValue: false,
+        onChange,
+        placeholder: "Select…"
       }
-      return /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-[10rem_1fr_auto] items-center gap-2", children: [
-        keyControl,
-        /* @__PURE__ */ jsx("div", { className: "min-w-0", children: valueControlForKey(key) }),
-        removeButton
-      ] }, `extra-${key}`);
-    }),
-    !readOnly && field.allowExtraKeys !== false && /* @__PURE__ */ jsxs(
-      Button,
+    ) : /* @__PURE__ */ jsx(
+      "input",
       {
-        type: "button",
-        variant: "outline",
-        onClick: addEntry,
-        className: cn("gap-1.5", inputSizeClass[childCtx.size]),
-        children: [
-          /* @__PURE__ */ jsx(Icon, { icon: UiAdd, className: "text-sm" }),
-          "Add field"
-        ]
+        type: "text",
+        "aria-label": "Field name",
+        className: cn(inputClass(size), "font-mono"),
+        value,
+        disabled: readOnly,
+        onChange: (event) => onChange(event.target.value)
       }
-    )
-  ] });
+    );
+  }
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        properties ? "col-span-full grid grid-cols-subgrid" : "flex flex-col",
+        !properties && !ctx.presentation && "rounded-md border border-input p-2",
+        !properties && fieldInnerGapClass[childCtx.size]
+      ),
+      children: [
+        knownKeys.map(
+          (key) => properties ? /* @__PURE__ */ jsx("div", { className: "contents", children: ctx.render.renderFieldRow(
+            {
+              key,
+              prop: known[key],
+              required: Array.isArray(field.schema.required) && field.schema.required.includes(key),
+              value: map[key],
+              onChange: (next) => setEntry(key, next),
+              instancePath: appendInstancePath(ctx.instancePath, key)
+            },
+            childCtx
+          ) }, `known-${key}`) : /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: "grid grid-cols-[10rem_1fr] items-center gap-2",
+              children: [
+                /* @__PURE__ */ jsx(
+                  "label",
+                  {
+                    htmlFor: fieldInputId(
+                      appendInstancePath(ctx.instancePath, key),
+                      childCtx.idPrefix
+                    ),
+                    className: "truncate text-xs text-muted-foreground",
+                    title: key,
+                    children: key
+                  }
+                ),
+                /* @__PURE__ */ jsx("div", { className: "min-w-0", children: valueControlFor(key, known[key] ?? { type: "string" }) })
+              ]
+            },
+            `known-${key}`
+          )
+        ),
+        extraKeys.map((key) => {
+          var _a, _b, _c, _d;
+          const keyControl = ctx.presentation ? /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: cn(
+                "flex min-w-0 items-center break-words text-xs",
+                controlHeightClass[childCtx.size],
+                field.keyOptions ? "text-foreground" : "font-mono text-muted-foreground"
+              ),
+              children: ((_b = (_a = field.keyOptions) == null ? void 0 : _a.find((option) => option.value === key)) == null ? void 0 : _b.label) ?? key
+            }
+          ) : keyEditor({
+            key,
+            value: key,
+            onChange: (next) => renameEntry(key, next)
+          });
+          const removeButton = !readOnly ? /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              "aria-label": `Remove ${key}`,
+              className: cn(
+                "inline-flex aspect-square shrink-0 items-center justify-center rounded text-muted-foreground hover:bg-accent hover:text-foreground",
+                controlHeightClass[childCtx.size]
+              ),
+              onClick: () => removeEntry(key),
+              children: /* @__PURE__ */ jsx(Icon, { icon: UiTrash, className: "text-sm" })
+            }
+          ) : null;
+          if (properties) {
+            const instancePath = appendInstancePath(ctx.instancePath, key);
+            const keyLabel = ((_d = (_c = field.keyOptions) == null ? void 0 : _c.find((option) => option.value === key)) == null ? void 0 : _d.label) ?? (key || "New field");
+            return /* @__PURE__ */ jsx("div", { className: "contents", children: ctx.render.renderFieldRow(
+              {
+                key,
+                prop: { ...valueSchemaForKey(key), title: keyLabel },
+                required: false,
+                value: map[key],
+                onChange: (next) => setEntry(key, next),
+                instancePath
+              },
+              {
+                ...childCtx,
+                post: [
+                  ...childCtx.post,
+                  (entry, nodes, postCtx) => (postCtx == null ? void 0 : postCtx.instancePath) !== instancePath ? nodes : {
+                    ...nodes,
+                    label: /* @__PURE__ */ jsxs(Fragment, { children: [
+                      /* @__PURE__ */ jsx("span", { className: "sr-only", children: nodes.label }),
+                      /* @__PURE__ */ jsx(
+                        PropertyValueEditor,
+                        {
+                          actionsPlacement: "row",
+                          field: {
+                            ...entry,
+                            kind: "string",
+                            label: `${keyLabel} key`,
+                            value: key,
+                            onChange: (next) => renameEntry(key, String(next))
+                          },
+                          fieldId: `${fieldInputId(instancePath, ctx.idPrefix)}-key`,
+                          ctx: {
+                            ...childCtx,
+                            size: propertyControlSize[ctx.size]
+                          },
+                          renderPreview: (previewField) => /* @__PURE__ */ jsx("span", { children: String(previewField.value) }),
+                          renderEditor: (draft) => /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 items-center gap-1", children: [
+                            keyEditor({
+                              key,
+                              value: String(draft.value),
+                              onChange: draft.onChange
+                            }),
+                            removeButton
+                          ] })
+                        }
+                      )
+                    ] })
+                  }
+                ]
+              }
+            ) }, `extra-${key}`);
+          }
+          if (entryIsStacked(key)) {
+            return /* @__PURE__ */ jsxs(
+              "div",
+              {
+                className: cn(
+                  "space-y-1.5",
+                  !ctx.presentation && "rounded-md border border-input p-2"
+                ),
+                children: [
+                  keyTitle && /* @__PURE__ */ jsx("span", { className: "block text-xs font-medium text-muted-foreground", children: keyTitle }),
+                  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+                    /* @__PURE__ */ jsx("div", { className: "min-w-0 flex-1", children: keyControl }),
+                    removeButton
+                  ] }),
+                  /* @__PURE__ */ jsx("div", { className: "min-w-0", children: valueControlForKey(key) })
+                ]
+              },
+              `extra-${key}`
+            );
+          }
+          return /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: cn(
+                "grid items-center gap-2",
+                ctx.presentation ? "grid-cols-[minmax(0,10rem)_minmax(0,1fr)]" : "grid-cols-[10rem_1fr_auto]"
+              ),
+              children: [
+                keyControl,
+                /* @__PURE__ */ jsx("div", { className: "min-w-0", children: valueControlForKey(key) }),
+                removeButton
+              ]
+            },
+            `extra-${key}`
+          );
+        }),
+        !readOnly && field.allowExtraKeys !== false && /* @__PURE__ */ jsxs(
+          Button,
+          {
+            type: "button",
+            variant: properties ? "ghost" : "outline",
+            onClick: addEntry,
+            className: cn(
+              "gap-1.5",
+              properties && "col-span-full justify-self-start m-1",
+              inputSizeClass[properties ? propertyControlSize[ctx.size] : childCtx.size]
+            ),
+            children: [
+              /* @__PURE__ */ jsx(Icon, { icon: UiAdd, className: "text-sm" }),
+              "Add field"
+            ]
+          }
+        )
+      ]
+    }
+  );
 }
 export {
   ObjectControl,

package/dist/components/json-schema-form-object.js.map

@@ -1 +1 @@
-{"version":3,"file":"json-schema-form-object.js","sources":["../../src/components/json-schema-form-object.tsx"],"sourcesContent":["import { type ReactNode } from \"react\";\nimport { isPlainObject } from \"../lib/collections\";\nimport { cn } from \"../lib/utils\";\nimport { Icon } from \"../data/Icon\";\nimport { UiAdd, UiTrash } from \"../icons\";\nimport { Button } from \"./button\";\nimport { Combobox } from \"./Combobox\";\nimport type { FieldControl, JsonSchemaObject, JsonSchemaProperty, RenderContext } from \"./json-schema-form-types\";\nimport {\n  cssLength,\n  DEFAULT_COLUMN_MIN_WIDTH,\n  fieldInputId,\n  inputClass,\n  keyPickerOptions,\n  normalizeColumns,\n} from \"./json-schema-form-utils\";\nimport { FieldsGrid } from \"./json-schema-form-layout\";\nimport { appendInstancePath } from \"./json-schema-form-errors\";\nimport { controlHeightClass, fieldInnerGapClass, inputSizeClass } from \"./json-schema-form-size\";\n\n// ObjectControl renders a nested structured object as a sub-form: its own\n// properties, required markers, if/then, soft errors — all via the shared\n// recursive renderer (ctx.render), so pre/post extensions apply at this depth too.\nexport function ObjectControl({ field, ctx }: { field: FieldControl; ctx: RenderContext }) {\n  const obj = isPlainObject(field.value) ? (field.value as Record<string, unknown>) : {};\n  const subSchema: JsonSchemaObject = {\n    type: \"object\",\n    properties: field.objectProperties ?? {},\n    ...(field.objectRequired ? { required: field.objectRequired } : {}),\n    ...(Array.isArray(field.schema.allOf) ? { allOf: field.schema.allOf } : {}),\n    ...(Array.isArray(field.schema[\"x-order\"]) ? { \"x-order\": field.schema[\"x-order\"] } : {}),\n    // Every object-level layout keyword must be copied here or it works at the\n    // top level and silently dies one level down — which is exactly where these\n    // matter (an array item's body is a nested object).\n    ...(typeof field.schema[\"x-columns\"] === \"number\" || field.schema[\"x-columns\"] === \"auto\"\n      ? { \"x-columns\": field.schema[\"x-columns\"] }\n      : {}),\n    ...(typeof field.schema[\"x-column-min-width\"] === \"string\"\n      ? { \"x-column-min-width\": field.schema[\"x-column-min-width\"] }\n      : {}),\n    ...(typeof field.schema[\"x-columns-max-width\"] === \"string\"\n      ? { \"x-columns-max-width\": field.schema[\"x-columns-max-width\"] }\n      : {}),\n    ...(typeof field.schema[\"x-classes\"] === \"string\" ? { \"x-classes\": field.schema[\"x-classes\"] } : {}),\n  };\n  // No border/box: nested objects render as flat headed sections (see\n  // ObjectSection in renderFieldRow) rather than progressively indented\n  // sub-forms, so deep schemas stay readable as a single column.\n  // A read-only object marks its whole subtree non-editable: recurse with\n  // form-level readOnly on so child inputs are disabled (and any child the\n  // schema marks readOnly still renders as a value span).\n  return (\n    <FieldsGrid\n      layout={ctx.layout}\n      size={ctx.size}\n      columns={normalizeColumns(subSchema[\"x-columns\"])}\n      columnMinWidth={cssLength(subSchema[\"x-column-min-width\"], DEFAULT_COLUMN_MIN_WIDTH)}\n      {...(typeof subSchema[\"x-columns-max-width\"] === \"string\"\n        ? { columnsMaxWidth: subSchema[\"x-columns-max-width\"] }\n        : {})}\n      {...(typeof subSchema[\"x-classes\"] === \"string\" ? { className: subSchema[\"x-classes\"] } : {})}\n    >\n      {ctx.render.renderObjectFields(subSchema, obj, (next) => field.onChange(next), {\n        ...ctx,\n        readOnly: ctx.readOnly || field.readOnly === true,\n        depth: ctx.depth + 1,\n      })}\n    </FieldsGrid>\n  );\n}\n\n// StringMapControl edits an object as key/value rows. Known properties (from the\n// schema) render first with derived value controls; unknown keys render as\n// editable key/value pairs. \"Add field\" appears when extra keys are allowed.\n// Values recurse through the shared pipeline, so a value that is itself an object\n// or array renders structurally and pre/post extensions apply to it.\nexport function StringMapControl({ field, ctx }: { field: FieldControl; ctx: RenderContext }) {\n  // A read-only map marks its whole subtree non-editable: no rename/remove/add\n  // and value inputs disabled.\n  const readOnly = ctx.readOnly || field.readOnly === true;\n  const map = isPlainObject(field.value) ? (field.value as Record<string, unknown>) : {};\n  const known = field.knownProperties ?? {};\n  const knownKeys = Object.keys(known);\n  const extraKeys = Object.keys(map).filter((k) => !(k in known));\n  const childCtx: RenderContext = { ...ctx, readOnly, depth: ctx.depth + 1 };\n  // What the map key IS (e.g. \"Address Role\"), from the key-constraint schema.\n  const pn = field.schema.propertyNames as JsonSchemaProperty | undefined;\n  const keyTitle = typeof pn?.title === \"string\" && pn.title ? pn.title : undefined;\n\n  // valueSchemaForKey picks an entry's value schema: the first patternProperties\n  // entry whose regex matches the key, else the `additionalProperties` schema,\n  // else a bare string. Lets the value form vary by key (e.g. House vs Apartment).\n  function valueSchemaForKey(key: string): JsonSchemaProperty {\n    for (const { pattern, schema } of field.valuePatternSchemas ?? []) {\n      let re: RegExp | undefined;\n      try {\n        re = new RegExp(pattern);\n      } catch {\n        re = undefined; // a malformed pattern simply never matches\n      }\n      if (re?.test(key)) return schema;\n    }\n    return field.valueSchema ?? { type: \"string\" };\n  }\n\n  // When the entry value opts into a stacked layout (`x-layout: \"stack\"`), the\n  // key+value render as one full-width stacked unit instead of a key column\n  // beside the value. Resolved per key, since pattern schemas may differ.\n  function entryIsStacked(key: string): boolean {\n    return valueSchemaForKey(key)[\"x-layout\"] === \"stack\";\n  }\n\n  function setEntry(key: string, next: unknown) {\n    field.onChange({ ...map, [key]: next });\n  }\n  function renameEntry(oldKey: string, newKey: string) {\n    if (newKey === oldKey) return;\n    const next: Record<string, unknown> = {};\n    for (const [k, v] of Object.entries(map)) next[k === oldKey ? newKey : k] = v;\n    field.onChange(next);\n  }\n  function removeEntry(key: string) {\n    const next = { ...map };\n    delete next[key];\n    field.onChange(next);\n  }\n  function addEntry() {\n    if (\"\" in map) return;\n    field.onChange({ ...map, \"\": \"\" });\n  }\n\n  function valueControlFor(key: string, valueSchema: JsonSchemaProperty): ReactNode {\n    const nodes = ctx.render.renderFieldNodes(\n      {\n        key,\n        prop: valueSchema,\n        required: false,\n        value: map[key] ?? \"\",\n        onChange: (next) => setEntry(key, next),\n        instancePath: appendInstancePath(ctx.instancePath, key),\n      },\n      childCtx,\n    );\n    return nodes?.value ?? null;\n  }\n\n  // valueControlForKey resolves the per-key value schema (patternProperties /\n  // additionalProperties) before rendering, so the form varies by key.\n  function valueControlForKey(key: string): ReactNode {\n    return valueControlFor(key, valueSchemaForKey(key));\n  }\n\n  return (\n    <div className={cn(\"flex flex-col rounded-md border border-input p-2\", fieldInnerGapClass[childCtx.size])}>\n      {knownKeys.map((key) => (\n        <div key={`known-${key}`} className=\"grid grid-cols-[10rem_1fr] items-center gap-2\">\n          <label\n            htmlFor={fieldInputId(appendInstancePath(ctx.instancePath, key), childCtx.idPrefix)}\n            className=\"truncate text-xs text-muted-foreground\"\n            title={key}\n          >\n            {key}\n          </label>\n          <div className=\"min-w-0\">{valueControlFor(key, known[key] ?? { type: \"string\" })}</div>\n        </div>\n      ))}\n      {extraKeys.map((key) => {\n        const keyControl = field.keyOptions ? (\n          <Combobox\n            options={keyPickerOptions(field.keyOptions, extraKeys, key)}\n            value={key}\n            disabled={readOnly}\n            size={childCtx.size}\n            allowCustomValue={false}\n            onChange={(next) => renameEntry(key, next)}\n            placeholder=\"Select…\"\n          />\n        ) : (\n          <input\n            type=\"text\"\n            aria-label=\"Field name\"\n            className={cn(inputClass(childCtx.size), \"font-mono\")}\n            value={key}\n            disabled={readOnly}\n            onChange={(e) => renameEntry(key, e.target.value)}\n          />\n        );\n        const removeButton = !readOnly ? (\n          <button\n            type=\"button\"\n            aria-label={`Remove ${key}`}\n            className={cn(\n              \"inline-flex aspect-square shrink-0 items-center justify-center rounded text-muted-foreground hover:bg-accent hover:text-foreground\",\n              controlHeightClass[childCtx.size],\n            )}\n            onClick={() => removeEntry(key)}\n          >\n            <Icon icon={UiTrash} className=\"text-sm\" />\n          </button>\n        ) : null;\n        // When the value is stacked (`x-layout: \"stack\"` on the entry schema),\n        // the key joins the stack: it sits full-width above its value as one\n        // unit, rather than cramped in a fixed key column beside it. The key\n        // picker is labelled from `propertyNames.title` so a constrained key\n        // (e.g. an AsCode role) says what it is.\n        if (entryIsStacked(key)) {\n          return (\n            <div key={`extra-${key}`} className=\"space-y-1.5 rounded-md border border-input p-2\">\n              {keyTitle && <span className=\"block text-xs font-medium text-muted-foreground\">{keyTitle}</span>}\n              <div className=\"flex items-center gap-2\">\n                <div className=\"min-w-0 flex-1\">{keyControl}</div>\n                {removeButton}\n              </div>\n              <div className=\"min-w-0\">{valueControlForKey(key)}</div>\n            </div>\n          );\n        }\n        return (\n          <div key={`extra-${key}`} className=\"grid grid-cols-[10rem_1fr_auto] items-center gap-2\">\n            {keyControl}\n            <div className=\"min-w-0\">{valueControlForKey(key)}</div>\n            {removeButton}\n          </div>\n        );\n      })}\n      {!readOnly && field.allowExtraKeys !== false && (\n        <Button\n          type=\"button\"\n          variant=\"outline\"\n          onClick={addEntry}\n          className={cn(\"gap-1.5\", inputSizeClass[childCtx.size])}\n        >\n          <Icon icon={UiAdd} className=\"text-sm\" />\n          Add field\n        </Button>\n      )}\n    </div>\n  );\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"json-schema-form-object.js","sources":["../../src/components/json-schema-form-object.tsx"],"sourcesContent":["import { type ReactNode } from \"react\";\nimport { isPlainObject } from \"../lib/collections\";\nimport { cn } from \"../lib/utils\";\nimport { Icon } from \"../data/Icon\";\nimport { UiAdd, UiTrash } from \"../icons\";\nimport { Button } from \"./button\";\nimport { Combobox } from \"./Combobox\";\nimport type {\n  FieldControl,\n  JsonSchemaObject,\n  JsonSchemaProperty,\n  RenderContext,\n} from \"./json-schema-form-types\";\nimport {\n  cssLength,\n  DEFAULT_COLUMN_MIN_WIDTH,\n  fieldInputId,\n  inputClass,\n  keyPickerOptions,\n  normalizeColumns,\n} from \"./json-schema-form-utils\";\nimport { FieldsGrid } from \"./json-schema-form-layout\";\nimport { PropertyValueEditor } from \"./json-schema-form-properties\";\nimport { propertyControlSize } from \"./json-schema-form-properties-size\";\nimport { appendInstancePath } from \"./json-schema-form-errors\";\nimport {\n  controlHeightClass,\n  fieldInnerGapClass,\n  inputSizeClass,\n} from \"./json-schema-form-size\";\n\n// ObjectControl renders a nested structured object as a sub-form: its own\n// properties, required markers, if/then, soft errors — all via the shared\n// recursive renderer (ctx.render), so pre/post extensions apply at this depth too.\nexport function ObjectControl({\n  field,\n  ctx,\n}: {\n  field: FieldControl;\n  ctx: RenderContext;\n}) {\n  const obj = isPlainObject(field.value)\n    ? (field.value as Record<string, unknown>)\n    : {};\n  const subSchema: JsonSchemaObject = {\n    type: \"object\",\n    properties: field.objectProperties ?? {},\n    ...(field.objectRequired ? { required: field.objectRequired } : {}),\n    ...(Array.isArray(field.schema.allOf) ? { allOf: field.schema.allOf } : {}),\n    ...(Array.isArray(field.schema[\"x-order\"])\n      ? { \"x-order\": field.schema[\"x-order\"] }\n      : {}),\n    // Every object-level layout keyword must be copied here or it works at the\n    // top level and silently dies one level down — which is exactly where these\n    // matter (an array item's body is a nested object).\n    ...(typeof field.schema[\"x-columns\"] === \"number\" ||\n    field.schema[\"x-columns\"] === \"auto\"\n      ? { \"x-columns\": field.schema[\"x-columns\"] }\n      : {}),\n    ...(typeof field.schema[\"x-column-min-width\"] === \"string\"\n      ? { \"x-column-min-width\": field.schema[\"x-column-min-width\"] }\n      : {}),\n    ...(typeof field.schema[\"x-columns-max-width\"] === \"string\"\n      ? { \"x-columns-max-width\": field.schema[\"x-columns-max-width\"] }\n      : {}),\n    ...(typeof field.schema[\"x-classes\"] === \"string\"\n      ? { \"x-classes\": field.schema[\"x-classes\"] }\n      : {}),\n  };\n  // No border/box: nested objects render as flat headed sections (see\n  // ObjectSection in renderFieldRow) rather than progressively indented\n  // sub-forms, so deep schemas stay readable as a single column.\n  // A read-only object marks its whole subtree non-editable: recurse with\n  // form-level readOnly on so child inputs are disabled (and any child the\n  // schema marks readOnly still renders as a value span).\n  return (\n    <FieldsGrid\n      layout={ctx.layout}\n      size={ctx.size}\n      columns={normalizeColumns(subSchema[\"x-columns\"])}\n      columnMinWidth={cssLength(\n        subSchema[\"x-column-min-width\"],\n        DEFAULT_COLUMN_MIN_WIDTH,\n      )}\n      {...(typeof subSchema[\"x-columns-max-width\"] === \"string\"\n        ? { columnsMaxWidth: subSchema[\"x-columns-max-width\"] }\n        : {})}\n      {...(typeof subSchema[\"x-classes\"] === \"string\"\n        ? { className: subSchema[\"x-classes\"] }\n        : {})}\n    >\n      {ctx.render.renderObjectFields(\n        subSchema,\n        obj,\n        (next) => field.onChange(next),\n        {\n          ...ctx,\n          readOnly: ctx.readOnly || field.readOnly === true,\n          depth: ctx.depth + 1,\n        },\n      )}\n    </FieldsGrid>\n  );\n}\n\n// StringMapControl edits an object as key/value rows. Known properties (from the\n// schema) render first with derived value controls; unknown keys render as\n// editable key/value pairs. \"Add field\" appears when extra keys are allowed.\n// Values recurse through the shared pipeline, so a value that is itself an object\n// or array renders structurally and pre/post extensions apply to it.\nexport function StringMapControl({\n  field,\n  ctx,\n}: {\n  field: FieldControl;\n  ctx: RenderContext;\n}) {\n  // A read-only map marks its whole subtree non-editable: no rename/remove/add\n  // and value inputs disabled.\n  const readOnly = ctx.readOnly || field.readOnly === true;\n  const map = isPlainObject(field.value)\n    ? (field.value as Record<string, unknown>)\n    : {};\n  const known = field.knownProperties ?? {};\n  const knownKeys = Object.keys(known);\n  const extraKeys = Object.keys(map).filter((k) => !(k in known));\n  const childCtx: RenderContext = { ...ctx, readOnly, depth: ctx.depth + 1 };\n  const properties = ctx.layout.mode === \"properties\";\n  // What the map key IS (e.g. \"Address Role\"), from the key-constraint schema.\n  const pn = field.schema.propertyNames as JsonSchemaProperty | undefined;\n  const keyTitle =\n    typeof pn?.title === \"string\" && pn.title ? pn.title : undefined;\n\n  // valueSchemaForKey picks an entry's value schema: the first patternProperties\n  // entry whose regex matches the key, else the `additionalProperties` schema,\n  // else a bare string. Lets the value form vary by key (e.g. House vs Apartment).\n  function valueSchemaForKey(key: string): JsonSchemaProperty {\n    for (const { pattern, schema } of field.valuePatternSchemas ?? []) {\n      let re: RegExp | undefined;\n      try {\n        re = new RegExp(pattern);\n      } catch {\n        re = undefined; // a malformed pattern simply never matches\n      }\n      if (re?.test(key)) return schema;\n    }\n    return field.valueSchema ?? { type: \"string\" };\n  }\n\n  // When the entry value opts into a stacked layout (`x-layout: \"stack\"`), the\n  // key+value render as one full-width stacked unit instead of a key column\n  // beside the value. Resolved per key, since pattern schemas may differ.\n  function entryIsStacked(key: string): boolean {\n    return valueSchemaForKey(key)[\"x-layout\"] === \"stack\";\n  }\n\n  function setEntry(key: string, next: unknown) {\n    field.onChange({ ...map, [key]: next });\n  }\n  function renameEntry(oldKey: string, newKey: string) {\n    if (newKey === oldKey) return;\n    const next: Record<string, unknown> = {};\n    for (const [k, v] of Object.entries(map))\n      next[k === oldKey ? newKey : k] = v;\n    field.onChange(next);\n  }\n  function removeEntry(key: string) {\n    const next = { ...map };\n    delete next[key];\n    field.onChange(next);\n  }\n  function addEntry() {\n    if (\"\" in map) return;\n    field.onChange({ ...map, \"\": \"\" });\n  }\n\n  function valueControlFor(\n    key: string,\n    valueSchema: JsonSchemaProperty,\n  ): ReactNode {\n    const nodes = ctx.render.renderFieldNodes(\n      {\n        key,\n        prop: valueSchema,\n        required: false,\n        value: map[key] ?? \"\",\n        onChange: (next) => setEntry(key, next),\n        instancePath: appendInstancePath(ctx.instancePath, key),\n      },\n      childCtx,\n    );\n    return nodes?.value ?? null;\n  }\n\n  // valueControlForKey resolves the per-key value schema (patternProperties /\n  // additionalProperties) before rendering, so the form varies by key.\n  function valueControlForKey(key: string): ReactNode {\n    return valueControlFor(key, valueSchemaForKey(key));\n  }\n\n  function keyEditor({\n    key,\n    value,\n    onChange,\n  }: {\n    key: string;\n    value: string;\n    onChange: (next: string) => void;\n  }) {\n    const size = properties ? propertyControlSize[ctx.size] : ctx.size;\n    return field.keyOptions ? (\n      <Combobox\n        options={keyPickerOptions(\n          field.keyOptions,\n          [...knownKeys, ...extraKeys],\n          key,\n        )}\n        value={value}\n        disabled={readOnly}\n        size={size}\n        allowCustomValue={false}\n        onChange={onChange}\n        placeholder=\"Select…\"\n      />\n    ) : (\n      <input\n        type=\"text\"\n        aria-label=\"Field name\"\n        className={cn(inputClass(size), \"font-mono\")}\n        value={value}\n        disabled={readOnly}\n        onChange={(event) => onChange(event.target.value)}\n      />\n    );\n  }\n\n  return (\n    <div\n      className={cn(\n        properties ? \"col-span-full grid grid-cols-subgrid\" : \"flex flex-col\",\n        !properties &&\n          !ctx.presentation &&\n          \"rounded-md border border-input p-2\",\n        !properties && fieldInnerGapClass[childCtx.size],\n      )}\n    >\n      {knownKeys.map((key) =>\n        properties ? (\n          <div key={`known-${key}`} className=\"contents\">\n            {ctx.render.renderFieldRow(\n              {\n                key,\n                prop: known[key]!,\n                required:\n                  Array.isArray(field.schema.required) &&\n                  field.schema.required.includes(key),\n                value: map[key],\n                onChange: (next) => setEntry(key, next),\n                instancePath: appendInstancePath(ctx.instancePath, key),\n              },\n              childCtx,\n            )}\n          </div>\n        ) : (\n          <div\n            key={`known-${key}`}\n            className=\"grid grid-cols-[10rem_1fr] items-center gap-2\"\n          >\n            <label\n              htmlFor={fieldInputId(\n                appendInstancePath(ctx.instancePath, key),\n                childCtx.idPrefix,\n              )}\n              className=\"truncate text-xs text-muted-foreground\"\n              title={key}\n            >\n              {key}\n            </label>\n            <div className=\"min-w-0\">\n              {valueControlFor(key, known[key] ?? { type: \"string\" })}\n            </div>\n          </div>\n        ),\n      )}\n      {extraKeys.map((key) => {\n        const keyControl = ctx.presentation ? (\n          <span\n            className={cn(\n              \"flex min-w-0 items-center break-words text-xs\",\n              controlHeightClass[childCtx.size],\n              field.keyOptions\n                ? \"text-foreground\"\n                : \"font-mono text-muted-foreground\",\n            )}\n          >\n            {field.keyOptions?.find((option) => option.value === key)?.label ??\n              key}\n          </span>\n        ) : (\n          keyEditor({\n            key,\n            value: key,\n            onChange: (next) => renameEntry(key, next),\n          })\n        );\n        const removeButton = !readOnly ? (\n          <button\n            type=\"button\"\n            aria-label={`Remove ${key}`}\n            className={cn(\n              \"inline-flex aspect-square shrink-0 items-center justify-center rounded text-muted-foreground hover:bg-accent hover:text-foreground\",\n              controlHeightClass[childCtx.size],\n            )}\n            onClick={() => removeEntry(key)}\n          >\n            <Icon icon={UiTrash} className=\"text-sm\" />\n          </button>\n        ) : null;\n        if (properties) {\n          const instancePath = appendInstancePath(ctx.instancePath, key);\n          const keyLabel =\n            field.keyOptions?.find((option) => option.value === key)?.label ??\n            (key || \"New field\");\n          return (\n            <div key={`extra-${key}`} className=\"contents\">\n              {ctx.render.renderFieldRow(\n                {\n                  key,\n                  prop: { ...valueSchemaForKey(key), title: keyLabel },\n                  required: false,\n                  value: map[key],\n                  onChange: (next) => setEntry(key, next),\n                  instancePath,\n                },\n                {\n                  ...childCtx,\n                  post: [\n                    ...childCtx.post,\n                    (entry, nodes, postCtx) =>\n                      postCtx?.instancePath !== instancePath\n                        ? nodes\n                        : {\n                            ...nodes,\n                            label: (\n                              <>\n                                <span className=\"sr-only\">{nodes.label}</span>\n                                <PropertyValueEditor\n                                  actionsPlacement=\"row\"\n                                  field={{\n                                    ...entry,\n                                    kind: \"string\",\n                                    label: `${keyLabel} key`,\n                                    value: key,\n                                    onChange: (next) =>\n                                      renameEntry(key, String(next)),\n                                  }}\n                                  fieldId={`${fieldInputId(instancePath, ctx.idPrefix)}-key`}\n                                  ctx={{\n                                    ...childCtx,\n                                    size: propertyControlSize[ctx.size],\n                                  }}\n                                  renderPreview={(previewField) => (\n                                    <span>{String(previewField.value)}</span>\n                                  )}\n                                  renderEditor={(draft) => (\n                                    <div className=\"flex min-w-0 items-center gap-1\">\n                                      {keyEditor({\n                                        key,\n                                        value: String(draft.value),\n                                        onChange: draft.onChange,\n                                      })}\n                                      {removeButton}\n                                    </div>\n                                  )}\n                                />\n                              </>\n                            ),\n                          },\n                  ],\n                },\n              )}\n            </div>\n          );\n        }\n        // When the value is stacked (`x-layout: \"stack\"` on the entry schema),\n        // the key joins the stack: it sits full-width above its value as one\n        // unit, rather than cramped in a fixed key column beside it. The key\n        // picker is labelled from `propertyNames.title` so a constrained key\n        // (e.g. an AsCode role) says what it is.\n        if (entryIsStacked(key)) {\n          return (\n            <div\n              key={`extra-${key}`}\n              className={cn(\n                \"space-y-1.5\",\n                !ctx.presentation && \"rounded-md border border-input p-2\",\n              )}\n            >\n              {keyTitle && (\n                <span className=\"block text-xs font-medium text-muted-foreground\">\n                  {keyTitle}\n                </span>\n              )}\n              <div className=\"flex items-center gap-2\">\n                <div className=\"min-w-0 flex-1\">{keyControl}</div>\n                {removeButton}\n              </div>\n              <div className=\"min-w-0\">{valueControlForKey(key)}</div>\n            </div>\n          );\n        }\n        return (\n          <div\n            key={`extra-${key}`}\n            className={cn(\n              \"grid items-center gap-2\",\n              ctx.presentation\n                ? \"grid-cols-[minmax(0,10rem)_minmax(0,1fr)]\"\n                : \"grid-cols-[10rem_1fr_auto]\",\n            )}\n          >\n            {keyControl}\n            <div className=\"min-w-0\">{valueControlForKey(key)}</div>\n            {removeButton}\n          </div>\n        );\n      })}\n      {!readOnly && field.allowExtraKeys !== false && (\n        <Button\n          type=\"button\"\n          variant={properties ? \"ghost\" : \"outline\"}\n          onClick={addEntry}\n          className={cn(\n            \"gap-1.5\",\n            properties && \"col-span-full justify-self-start m-1\",\n            inputSizeClass[\n              properties ? propertyControlSize[ctx.size] : childCtx.size\n            ],\n          )}\n        >\n          <Icon icon={UiAdd} className=\"text-sm\" />\n          Add field\n        </Button>\n      )}\n    </div>\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/components/json-schema-form-preferences.cjs

@@ -6,7 +6,7 @@ function isFormSize(value) {
   return typeof value === "string" && VALID_SIZES.includes(value);
 }
 function isLayoutMode(value) {
-  return value === "stacked" || value === "inline";
+  return value === "stacked" || value === "inline" || value === "properties";
 }
 function isSortMode(value) {
   return value === "schema" || value === "required-first" || value === "priority";

package/dist/components/json-schema-form-preferences.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"json-schema-form-preferences.cjs","sources":["../../src/components/json-schema-form-preferences.ts"],"sourcesContent":["import type { FormSize } from \"./json-schema-form-size\";\n\n// FormPreferences are the form-local appearance overrides the display-options\n// menu persists: the input/label scale and the layout mode. They never touch\n// field values or the global page density — only how one form looks.\nexport interface FormPreferences {\n  size?: FormSize;\n  layoutMode?: LayoutMode;\n  sortMode?: SortMode;\n}\n\nexport type LayoutMode = \"stacked\" | \"inline\";\n\n// SortMode controls the order fields render in at every object level:\n// - \"schema\": schema/x-order order (the default).\n// - \"required-first\": required keys first, then optional, each group stable.\n// - \"priority\": required AND non-empty keys bubble to the top — required-and-\n//   filled, then required-and-empty, then optional-and-filled, then the rest.\nexport type SortMode = \"schema\" | \"required-first\" | \"priority\";\n\nexport const DEFAULT_PREFERENCES_STORAGE_KEY = \"clicky-ui-json-schema-form-preferences\";\n\nconst VALID_SIZES: readonly string[] = [\"xs\", \"sm\", \"md\", \"lg\", \"xl\"];\n\nfunction isFormSize(value: unknown): value is FormSize {\n  return typeof value === \"string\" && VALID_SIZES.includes(value);\n}\n\nfunction isLayoutMode(value: unknown): value is LayoutMode {\n  return value === \"stacked\" || value === \"inline\";\n}\n\nfunction isSortMode(value: unknown): value is SortMode {\n  return value === \"schema\" || value === \"required-first\" || value === \"priority\";\n}\n\n// readPreferences loads stored preferences, tolerating anything malformed: a\n// missing key, invalid JSON, a non-object payload, out-of-range values, or a\n// localStorage that throws (private mode / storage disabled). Each field is\n// validated independently so one bad value doesn't discard the whole record.\n// Display preferences are best-effort, so a read failure yields {} rather than\n// an error — the form falls back to its props.\nexport function readPreferences(storageKey: string): FormPreferences {\n  let raw: string | null;\n  try {\n    raw = localStorage.getItem(storageKey);\n  } catch {\n    return {};\n  }\n  if (!raw) return {};\n\n  let parsed: unknown;\n  try {\n    parsed = JSON.parse(raw);\n  } catch {\n    return {};\n  }\n  if (typeof parsed !== \"object\" || parsed === null) return {};\n\n  const record = parsed as Record<string, unknown>;\n  const prefs: FormPreferences = {};\n  if (isFormSize(record.size)) prefs.size = record.size;\n  if (isLayoutMode(record.layoutMode)) prefs.layoutMode = record.layoutMode;\n  if (isSortMode(record.sortMode)) prefs.sortMode = record.sortMode;\n  return prefs;\n}\n\n// writePreferences persists the record as JSON, swallowing localStorage errors\n// (quota exceeded / storage disabled). Like reads, persistence is best-effort:\n// failing to save a display preference must never break the form.\nexport function writePreferences(storageKey: string, prefs: FormPreferences): void {\n  try {\n    localStorage.setItem(storageKey, JSON.stringify(prefs));\n  } catch {\n    // Best-effort persistence; ignore storage failures.\n  }\n}\n"],"names":[],"mappings":";;AAoBO,MAAM,kCAAkC;AAE/C,MAAM,cAAiC,CAAC,MAAM,MAAM,MAAM,MAAM,IAAI;AAEpE,SAAS,WAAW,OAAmC;AACrD,SAAO,OAAO,UAAU,YAAY,YAAY,SAAS,KAAK;AAChE;AAEA,SAAS,aAAa,OAAqC;AACzD,SAAO,UAAU,aAAa,UAAU;AAC1C;AAEA,SAAS,WAAW,OAAmC;AACrD,SAAO,UAAU,YAAY,UAAU,oBAAoB,UAAU;AACvE;AAQO,SAAS,gBAAgB,YAAqC;AACnE,MAAI;AACJ,MAAI;AACF,UAAM,aAAa,QAAQ,UAAU;AAAA,EACvC,QAAQ;AACN,WAAO,CAAA;AAAA,EACT;AACA,MAAI,CAAC,IAAK,QAAO,CAAA;AAEjB,MAAI;AACJ,MAAI;AACF,aAAS,KAAK,MAAM,GAAG;AAAA,EACzB,QAAQ;AACN,WAAO,CAAA;AAAA,EACT;AACA,MAAI,OAAO,WAAW,YAAY,WAAW,aAAa,CAAA;AAE1D,QAAM,SAAS;AACf,QAAM,QAAyB,CAAA;AAC/B,MAAI,WAAW,OAAO,IAAI,EAAG,OAAM,OAAO,OAAO;AACjD,MAAI,aAAa,OAAO,UAAU,EAAG,OAAM,aAAa,OAAO;AAC/D,MAAI,WAAW,OAAO,QAAQ,EAAG,OAAM,WAAW,OAAO;AACzD,SAAO;AACT;AAKO,SAAS,iBAAiB,YAAoB,OAA8B;AACjF,MAAI;AACF,iBAAa,QAAQ,YAAY,KAAK,UAAU,KAAK,CAAC;AAAA,EACxD,QAAQ;AAAA,EAER;AACF;;;;"}
+{"version":3,"file":"json-schema-form-preferences.cjs","sources":["../../src/components/json-schema-form-preferences.ts"],"sourcesContent":["import type { FormSize } from \"./json-schema-form-size\";\n\n// FormPreferences are the form-local appearance overrides the display-options\n// menu persists: the input/label scale and the layout mode. They never touch\n// field values or the global page density — only how one form looks.\nexport interface FormPreferences {\n  size?: FormSize;\n  layoutMode?: LayoutMode;\n  sortMode?: SortMode;\n}\n\nexport type LayoutMode = \"stacked\" | \"inline\" | \"properties\";\n\n// SortMode controls the order fields render in at every object level:\n// - \"schema\": schema/x-order order (the default).\n// - \"required-first\": required keys first, then optional, each group stable.\n// - \"priority\": required AND non-empty keys bubble to the top — required-and-\n//   filled, then required-and-empty, then optional-and-filled, then the rest.\nexport type SortMode = \"schema\" | \"required-first\" | \"priority\";\n\nexport const DEFAULT_PREFERENCES_STORAGE_KEY = \"clicky-ui-json-schema-form-preferences\";\n\nconst VALID_SIZES: readonly string[] = [\"xs\", \"sm\", \"md\", \"lg\", \"xl\"];\n\nfunction isFormSize(value: unknown): value is FormSize {\n  return typeof value === \"string\" && VALID_SIZES.includes(value);\n}\n\nfunction isLayoutMode(value: unknown): value is LayoutMode {\n  return value === \"stacked\" || value === \"inline\" || value === \"properties\";\n}\n\nfunction isSortMode(value: unknown): value is SortMode {\n  return value === \"schema\" || value === \"required-first\" || value === \"priority\";\n}\n\n// readPreferences loads stored preferences, tolerating anything malformed: a\n// missing key, invalid JSON, a non-object payload, out-of-range values, or a\n// localStorage that throws (private mode / storage disabled). Each field is\n// validated independently so one bad value doesn't discard the whole record.\n// Display preferences are best-effort, so a read failure yields {} rather than\n// an error — the form falls back to its props.\nexport function readPreferences(storageKey: string): FormPreferences {\n  let raw: string | null;\n  try {\n    raw = localStorage.getItem(storageKey);\n  } catch {\n    return {};\n  }\n  if (!raw) return {};\n\n  let parsed: unknown;\n  try {\n    parsed = JSON.parse(raw);\n  } catch {\n    return {};\n  }\n  if (typeof parsed !== \"object\" || parsed === null) return {};\n\n  const record = parsed as Record<string, unknown>;\n  const prefs: FormPreferences = {};\n  if (isFormSize(record.size)) prefs.size = record.size;\n  if (isLayoutMode(record.layoutMode)) prefs.layoutMode = record.layoutMode;\n  if (isSortMode(record.sortMode)) prefs.sortMode = record.sortMode;\n  return prefs;\n}\n\n// writePreferences persists the record as JSON, swallowing localStorage errors\n// (quota exceeded / storage disabled). Like reads, persistence is best-effort:\n// failing to save a display preference must never break the form.\nexport function writePreferences(storageKey: string, prefs: FormPreferences): void {\n  try {\n    localStorage.setItem(storageKey, JSON.stringify(prefs));\n  } catch {\n    // Best-effort persistence; ignore storage failures.\n  }\n}\n"],"names":[],"mappings":";;AAoBO,MAAM,kCAAkC;AAE/C,MAAM,cAAiC,CAAC,MAAM,MAAM,MAAM,MAAM,IAAI;AAEpE,SAAS,WAAW,OAAmC;AACrD,SAAO,OAAO,UAAU,YAAY,YAAY,SAAS,KAAK;AAChE;AAEA,SAAS,aAAa,OAAqC;AACzD,SAAO,UAAU,aAAa,UAAU,YAAY,UAAU;AAChE;AAEA,SAAS,WAAW,OAAmC;AACrD,SAAO,UAAU,YAAY,UAAU,oBAAoB,UAAU;AACvE;AAQO,SAAS,gBAAgB,YAAqC;AACnE,MAAI;AACJ,MAAI;AACF,UAAM,aAAa,QAAQ,UAAU;AAAA,EACvC,QAAQ;AACN,WAAO,CAAA;AAAA,EACT;AACA,MAAI,CAAC,IAAK,QAAO,CAAA;AAEjB,MAAI;AACJ,MAAI;AACF,aAAS,KAAK,MAAM,GAAG;AAAA,EACzB,QAAQ;AACN,WAAO,CAAA;AAAA,EACT;AACA,MAAI,OAAO,WAAW,YAAY,WAAW,aAAa,CAAA;AAE1D,QAAM,SAAS;AACf,QAAM,QAAyB,CAAA;AAC/B,MAAI,WAAW,OAAO,IAAI,EAAG,OAAM,OAAO,OAAO;AACjD,MAAI,aAAa,OAAO,UAAU,EAAG,OAAM,aAAa,OAAO;AAC/D,MAAI,WAAW,OAAO,QAAQ,EAAG,OAAM,WAAW,OAAO;AACzD,SAAO;AACT;AAKO,SAAS,iBAAiB,YAAoB,OAA8B;AACjF,MAAI;AACF,iBAAa,QAAQ,YAAY,KAAK,UAAU,KAAK,CAAC;AAAA,EACxD,QAAQ;AAAA,EAER;AACF;;;;"}

package/dist/components/json-schema-form-preferences.d.ts

@@ -4,7 +4,7 @@ export interface FormPreferences {
     layoutMode?: LayoutMode;
     sortMode?: SortMode;
 }
-export type LayoutMode = "stacked" | "inline";
+export type LayoutMode = "stacked" | "inline" | "properties";
 export type SortMode = "schema" | "required-first" | "priority";
 export declare const DEFAULT_PREFERENCES_STORAGE_KEY = "clicky-ui-json-schema-form-preferences";
 export declare function readPreferences(storageKey: string): FormPreferences;

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

@@ -1 +1 @@
-{"version":3,"file":"json-schema-form-preferences.d.ts","sourceRoot":"","sources":["../../src/components/json-schema-form-preferences.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AAKxD,MAAM,WAAW,eAAe;IAC9B,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,QAAQ,CAAC,EAAE,QAAQ,CAAC;CACrB;AAED,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,QAAQ,CAAC;AAO9C,MAAM,MAAM,QAAQ,GAAG,QAAQ,GAAG,gBAAgB,GAAG,UAAU,CAAC;AAEhE,eAAO,MAAM,+BAA+B,2CAA2C,CAAC;AAsBxF,wBAAgB,eAAe,CAAC,UAAU,EAAE,MAAM,GAAG,eAAe,CAuBnE;AAKD,wBAAgB,gBAAgB,CAAC,UAAU,EAAE,MAAM,EAAE,KAAK,EAAE,eAAe,GAAG,IAAI,CAMjF"}
+{"version":3,"file":"json-schema-form-preferences.d.ts","sourceRoot":"","sources":["../../src/components/json-schema-form-preferences.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AAKxD,MAAM,WAAW,eAAe;IAC9B,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,QAAQ,CAAC,EAAE,QAAQ,CAAC;CACrB;AAED,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,QAAQ,GAAG,YAAY,CAAC;AAO7D,MAAM,MAAM,QAAQ,GAAG,QAAQ,GAAG,gBAAgB,GAAG,UAAU,CAAC;AAEhE,eAAO,MAAM,+BAA+B,2CAA2C,CAAC;AAsBxF,wBAAgB,eAAe,CAAC,UAAU,EAAE,MAAM,GAAG,eAAe,CAuBnE;AAKD,wBAAgB,gBAAgB,CAAC,UAAU,EAAE,MAAM,EAAE,KAAK,EAAE,eAAe,GAAG,IAAI,CAMjF"}

package/dist/components/json-schema-form-preferences.js

@@ -4,7 +4,7 @@ function isFormSize(value) {
   return typeof value === "string" && VALID_SIZES.includes(value);
 }
 function isLayoutMode(value) {
-  return value === "stacked" || value === "inline";
+  return value === "stacked" || value === "inline" || value === "properties";
 }
 function isSortMode(value) {
   return value === "schema" || value === "required-first" || value === "priority";

package/dist/components/json-schema-form-preferences.js.map

@@ -1 +1 @@
-{"version":3,"file":"json-schema-form-preferences.js","sources":["../../src/components/json-schema-form-preferences.ts"],"sourcesContent":["import type { FormSize } from \"./json-schema-form-size\";\n\n// FormPreferences are the form-local appearance overrides the display-options\n// menu persists: the input/label scale and the layout mode. They never touch\n// field values or the global page density — only how one form looks.\nexport interface FormPreferences {\n  size?: FormSize;\n  layoutMode?: LayoutMode;\n  sortMode?: SortMode;\n}\n\nexport type LayoutMode = \"stacked\" | \"inline\";\n\n// SortMode controls the order fields render in at every object level:\n// - \"schema\": schema/x-order order (the default).\n// - \"required-first\": required keys first, then optional, each group stable.\n// - \"priority\": required AND non-empty keys bubble to the top — required-and-\n//   filled, then required-and-empty, then optional-and-filled, then the rest.\nexport type SortMode = \"schema\" | \"required-first\" | \"priority\";\n\nexport const DEFAULT_PREFERENCES_STORAGE_KEY = \"clicky-ui-json-schema-form-preferences\";\n\nconst VALID_SIZES: readonly string[] = [\"xs\", \"sm\", \"md\", \"lg\", \"xl\"];\n\nfunction isFormSize(value: unknown): value is FormSize {\n  return typeof value === \"string\" && VALID_SIZES.includes(value);\n}\n\nfunction isLayoutMode(value: unknown): value is LayoutMode {\n  return value === \"stacked\" || value === \"inline\";\n}\n\nfunction isSortMode(value: unknown): value is SortMode {\n  return value === \"schema\" || value === \"required-first\" || value === \"priority\";\n}\n\n// readPreferences loads stored preferences, tolerating anything malformed: a\n// missing key, invalid JSON, a non-object payload, out-of-range values, or a\n// localStorage that throws (private mode / storage disabled). Each field is\n// validated independently so one bad value doesn't discard the whole record.\n// Display preferences are best-effort, so a read failure yields {} rather than\n// an error — the form falls back to its props.\nexport function readPreferences(storageKey: string): FormPreferences {\n  let raw: string | null;\n  try {\n    raw = localStorage.getItem(storageKey);\n  } catch {\n    return {};\n  }\n  if (!raw) return {};\n\n  let parsed: unknown;\n  try {\n    parsed = JSON.parse(raw);\n  } catch {\n    return {};\n  }\n  if (typeof parsed !== \"object\" || parsed === null) return {};\n\n  const record = parsed as Record<string, unknown>;\n  const prefs: FormPreferences = {};\n  if (isFormSize(record.size)) prefs.size = record.size;\n  if (isLayoutMode(record.layoutMode)) prefs.layoutMode = record.layoutMode;\n  if (isSortMode(record.sortMode)) prefs.sortMode = record.sortMode;\n  return prefs;\n}\n\n// writePreferences persists the record as JSON, swallowing localStorage errors\n// (quota exceeded / storage disabled). Like reads, persistence is best-effort:\n// failing to save a display preference must never break the form.\nexport function writePreferences(storageKey: string, prefs: FormPreferences): void {\n  try {\n    localStorage.setItem(storageKey, JSON.stringify(prefs));\n  } catch {\n    // Best-effort persistence; ignore storage failures.\n  }\n}\n"],"names":[],"mappings":"AAoBO,MAAM,kCAAkC;AAE/C,MAAM,cAAiC,CAAC,MAAM,MAAM,MAAM,MAAM,IAAI;AAEpE,SAAS,WAAW,OAAmC;AACrD,SAAO,OAAO,UAAU,YAAY,YAAY,SAAS,KAAK;AAChE;AAEA,SAAS,aAAa,OAAqC;AACzD,SAAO,UAAU,aAAa,UAAU;AAC1C;AAEA,SAAS,WAAW,OAAmC;AACrD,SAAO,UAAU,YAAY,UAAU,oBAAoB,UAAU;AACvE;AAQO,SAAS,gBAAgB,YAAqC;AACnE,MAAI;AACJ,MAAI;AACF,UAAM,aAAa,QAAQ,UAAU;AAAA,EACvC,QAAQ;AACN,WAAO,CAAA;AAAA,EACT;AACA,MAAI,CAAC,IAAK,QAAO,CAAA;AAEjB,MAAI;AACJ,MAAI;AACF,aAAS,KAAK,MAAM,GAAG;AAAA,EACzB,QAAQ;AACN,WAAO,CAAA;AAAA,EACT;AACA,MAAI,OAAO,WAAW,YAAY,WAAW,aAAa,CAAA;AAE1D,QAAM,SAAS;AACf,QAAM,QAAyB,CAAA;AAC/B,MAAI,WAAW,OAAO,IAAI,EAAG,OAAM,OAAO,OAAO;AACjD,MAAI,aAAa,OAAO,UAAU,EAAG,OAAM,aAAa,OAAO;AAC/D,MAAI,WAAW,OAAO,QAAQ,EAAG,OAAM,WAAW,OAAO;AACzD,SAAO;AACT;AAKO,SAAS,iBAAiB,YAAoB,OAA8B;AACjF,MAAI;AACF,iBAAa,QAAQ,YAAY,KAAK,UAAU,KAAK,CAAC;AAAA,EACxD,QAAQ;AAAA,EAER;AACF;"}
+{"version":3,"file":"json-schema-form-preferences.js","sources":["../../src/components/json-schema-form-preferences.ts"],"sourcesContent":["import type { FormSize } from \"./json-schema-form-size\";\n\n// FormPreferences are the form-local appearance overrides the display-options\n// menu persists: the input/label scale and the layout mode. They never touch\n// field values or the global page density — only how one form looks.\nexport interface FormPreferences {\n  size?: FormSize;\n  layoutMode?: LayoutMode;\n  sortMode?: SortMode;\n}\n\nexport type LayoutMode = \"stacked\" | \"inline\" | \"properties\";\n\n// SortMode controls the order fields render in at every object level:\n// - \"schema\": schema/x-order order (the default).\n// - \"required-first\": required keys first, then optional, each group stable.\n// - \"priority\": required AND non-empty keys bubble to the top — required-and-\n//   filled, then required-and-empty, then optional-and-filled, then the rest.\nexport type SortMode = \"schema\" | \"required-first\" | \"priority\";\n\nexport const DEFAULT_PREFERENCES_STORAGE_KEY = \"clicky-ui-json-schema-form-preferences\";\n\nconst VALID_SIZES: readonly string[] = [\"xs\", \"sm\", \"md\", \"lg\", \"xl\"];\n\nfunction isFormSize(value: unknown): value is FormSize {\n  return typeof value === \"string\" && VALID_SIZES.includes(value);\n}\n\nfunction isLayoutMode(value: unknown): value is LayoutMode {\n  return value === \"stacked\" || value === \"inline\" || value === \"properties\";\n}\n\nfunction isSortMode(value: unknown): value is SortMode {\n  return value === \"schema\" || value === \"required-first\" || value === \"priority\";\n}\n\n// readPreferences loads stored preferences, tolerating anything malformed: a\n// missing key, invalid JSON, a non-object payload, out-of-range values, or a\n// localStorage that throws (private mode / storage disabled). Each field is\n// validated independently so one bad value doesn't discard the whole record.\n// Display preferences are best-effort, so a read failure yields {} rather than\n// an error — the form falls back to its props.\nexport function readPreferences(storageKey: string): FormPreferences {\n  let raw: string | null;\n  try {\n    raw = localStorage.getItem(storageKey);\n  } catch {\n    return {};\n  }\n  if (!raw) return {};\n\n  let parsed: unknown;\n  try {\n    parsed = JSON.parse(raw);\n  } catch {\n    return {};\n  }\n  if (typeof parsed !== \"object\" || parsed === null) return {};\n\n  const record = parsed as Record<string, unknown>;\n  const prefs: FormPreferences = {};\n  if (isFormSize(record.size)) prefs.size = record.size;\n  if (isLayoutMode(record.layoutMode)) prefs.layoutMode = record.layoutMode;\n  if (isSortMode(record.sortMode)) prefs.sortMode = record.sortMode;\n  return prefs;\n}\n\n// writePreferences persists the record as JSON, swallowing localStorage errors\n// (quota exceeded / storage disabled). Like reads, persistence is best-effort:\n// failing to save a display preference must never break the form.\nexport function writePreferences(storageKey: string, prefs: FormPreferences): void {\n  try {\n    localStorage.setItem(storageKey, JSON.stringify(prefs));\n  } catch {\n    // Best-effort persistence; ignore storage failures.\n  }\n}\n"],"names":[],"mappings":"AAoBO,MAAM,kCAAkC;AAE/C,MAAM,cAAiC,CAAC,MAAM,MAAM,MAAM,MAAM,IAAI;AAEpE,SAAS,WAAW,OAAmC;AACrD,SAAO,OAAO,UAAU,YAAY,YAAY,SAAS,KAAK;AAChE;AAEA,SAAS,aAAa,OAAqC;AACzD,SAAO,UAAU,aAAa,UAAU,YAAY,UAAU;AAChE;AAEA,SAAS,WAAW,OAAmC;AACrD,SAAO,UAAU,YAAY,UAAU,oBAAoB,UAAU;AACvE;AAQO,SAAS,gBAAgB,YAAqC;AACnE,MAAI;AACJ,MAAI;AACF,UAAM,aAAa,QAAQ,UAAU;AAAA,EACvC,QAAQ;AACN,WAAO,CAAA;AAAA,EACT;AACA,MAAI,CAAC,IAAK,QAAO,CAAA;AAEjB,MAAI;AACJ,MAAI;AACF,aAAS,KAAK,MAAM,GAAG;AAAA,EACzB,QAAQ;AACN,WAAO,CAAA;AAAA,EACT;AACA,MAAI,OAAO,WAAW,YAAY,WAAW,aAAa,CAAA;AAE1D,QAAM,SAAS;AACf,QAAM,QAAyB,CAAA;AAC/B,MAAI,WAAW,OAAO,IAAI,EAAG,OAAM,OAAO,OAAO;AACjD,MAAI,aAAa,OAAO,UAAU,EAAG,OAAM,aAAa,OAAO;AAC/D,MAAI,WAAW,OAAO,QAAQ,EAAG,OAAM,WAAW,OAAO;AACzD,SAAO;AACT;AAKO,SAAS,iBAAiB,YAAoB,OAA8B;AACjF,MAAI;AACF,iBAAa,QAAQ,YAAY,KAAK,UAAU,KAAK,CAAC;AAAA,EACxD,QAAQ;AAAA,EAER;AACF;"}

package/dist/components/json-schema-form-properties-errors.fixtures.d.ts

@@ -0,0 +1,14 @@
+import { JsonSchemaObject } from './json-schema-form-types';
+import { JsonSchemaFormError } from './json-schema-form-error-types';
+export declare const propertiesErrorSchema: JsonSchemaObject;
+export declare const propertiesErrorValue: {
+    name: string;
+    connection: {
+        host: string;
+        retries: number;
+    };
+    tags: string[];
+    notes: string;
+};
+export declare const propertiesServerErrors: JsonSchemaFormError[];
+//# sourceMappingURL=json-schema-form-properties-errors.fixtures.d.ts.map

package/dist/components/json-schema-form-properties-errors.fixtures.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"json-schema-form-properties-errors.fixtures.d.ts","sourceRoot":"","sources":["../../src/components/json-schema-form-properties-errors.fixtures.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAC;AACjE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,gCAAgC,CAAC;AAE1E,eAAO,MAAM,qBAAqB,EAAE,gBAgBnC,CAAC;AAEF,eAAO,MAAM,oBAAoB;;;;;;;;CAKhC,CAAC;AAEF,eAAO,MAAM,sBAAsB,EAAE,mBAAmB,EAevD,CAAC"}

package/dist/components/json-schema-form-properties-size.cjs

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const propertyControlSize = {
+  xs: "xs",
+  sm: "xs",
+  md: "sm",
+  lg: "sm",
+  xl: "md"
+};
+const propertyRowClass = {
+  xs: "px-1.5 py-0",
+  sm: "px-2 py-0.5",
+  md: "px-2 py-1",
+  lg: "px-2.5 py-1.5",
+  xl: "px-3 py-2"
+};
+exports.propertyControlSize = propertyControlSize;
+exports.propertyRowClass = propertyRowClass;
+//# sourceMappingURL=json-schema-form-properties-size.cjs.map

package/dist/components/json-schema-form-properties-size.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"json-schema-form-properties-size.cjs","sources":["../../src/components/json-schema-form-properties-size.ts"],"sourcesContent":["import type { FormSize } from \"./json-schema-form-size\";\n\nexport const propertyControlSize: Record<FormSize, FormSize> = {\n  xs: \"xs\",\n  sm: \"xs\",\n  md: \"sm\",\n  lg: \"sm\",\n  xl: \"md\",\n};\n\n// XL retains the former Medium cell: a 36px control with 8px padding per side.\nexport const propertyRowClass: Record<FormSize, string> = {\n  xs: \"px-1.5 py-0\",\n  sm: \"px-2 py-0.5\",\n  md: \"px-2 py-1\",\n  lg: \"px-2.5 py-1.5\",\n  xl: \"px-3 py-2\",\n};\n"],"names":[],"mappings":";;AAEO,MAAM,sBAAkD;AAAA,EAC7D,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAGO,MAAM,mBAA6C;AAAA,EACxD,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;;;"}

package/dist/components/json-schema-form-properties-size.d.ts

@@ -0,0 +1,4 @@
+import { FormSize } from './json-schema-form-size';
+export declare const propertyControlSize: Record<FormSize, FormSize>;
+export declare const propertyRowClass: Record<FormSize, string>;
+//# sourceMappingURL=json-schema-form-properties-size.d.ts.map

package/dist/components/json-schema-form-properties-size.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"json-schema-form-properties-size.d.ts","sourceRoot":"","sources":["../../src/components/json-schema-form-properties-size.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AAExD,eAAO,MAAM,mBAAmB,EAAE,MAAM,CAAC,QAAQ,EAAE,QAAQ,CAM1D,CAAC;AAGF,eAAO,MAAM,gBAAgB,EAAE,MAAM,CAAC,QAAQ,EAAE,MAAM,CAMrD,CAAC"}

package/dist/components/json-schema-form-properties-size.js

@@ -0,0 +1,19 @@
+const propertyControlSize = {
+  xs: "xs",
+  sm: "xs",
+  md: "sm",
+  lg: "sm",
+  xl: "md"
+};
+const propertyRowClass = {
+  xs: "px-1.5 py-0",
+  sm: "px-2 py-0.5",
+  md: "px-2 py-1",
+  lg: "px-2.5 py-1.5",
+  xl: "px-3 py-2"
+};
+export {
+  propertyControlSize,
+  propertyRowClass
+};
+//# sourceMappingURL=json-schema-form-properties-size.js.map