@byline/admin 4.1.0 → 4.3.0

package/dist/fields/code/code-field.js

@@ -0,0 +1,124 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import react, { Suspense, useCallback } from "react";
+import { ErrorText, HelpText, Label } from "@byline/ui/react";
+import classnames from "classnames";
+import { useFieldError, useFieldValue } from "../../forms/form-context.js";
+import { LocaleBadge } from "../locale-badge.js";
+import code_field_module from "./code-field.module.js";
+const CodeEditor = /*#__PURE__*/ react.lazy(()=>import("./code-editor.js"));
+const siblingFieldPath = (fieldPath, siblingName)=>{
+    const lastDot = fieldPath.lastIndexOf('.');
+    return -1 === lastDot ? siblingName : `${fieldPath.slice(0, lastDot + 1)}${siblingName}`;
+};
+const CodeField = ({ field, value, defaultValue, onChange, id, path, locale, components })=>{
+    const fieldPath = path ?? field.name;
+    const fieldError = useFieldError(fieldPath);
+    const fieldValue = useFieldValue(fieldPath);
+    const incomingValue = value ?? fieldValue ?? defaultValue ?? '';
+    const htmlId = id ?? fieldPath;
+    const siblingPath = field.languageField ? siblingFieldPath(fieldPath, field.languageField) : fieldPath;
+    const siblingLanguage = useFieldValue(siblingPath);
+    const effectiveLanguage = (field.languageField ? siblingLanguage : void 0) || field.language;
+    const handleChange = useCallback((value)=>{
+        if (onChange) onChange(value);
+    }, [
+        onChange
+    ]);
+    const slots = components;
+    const CustomLabel = slots?.Label;
+    const CustomHelpText = slots?.HelpText;
+    const CustomField = slots?.Field;
+    const BeforeField = slots?.beforeField;
+    const AfterField = slots?.afterField;
+    const slotBaseProps = {
+        field: field,
+        path: fieldPath,
+        value: incomingValue,
+        error: fieldError,
+        id: htmlId
+    };
+    const showBadge = !!locale && !!field.label;
+    const hasCustomLabel = !!CustomLabel;
+    const labelRowClass = classnames('byline-field-code-label-row', code_field_module["label-row"]);
+    const renderLabel = ()=>{
+        if (hasCustomLabel) return /*#__PURE__*/ jsxs("div", {
+            className: labelRowClass,
+            children: [
+                /*#__PURE__*/ jsx(CustomLabel, {
+                    ...slotBaseProps,
+                    label: field.label,
+                    required: !field.optional
+                }),
+                showBadge && /*#__PURE__*/ jsx(LocaleBadge, {
+                    locale: locale
+                })
+            ]
+        });
+        if (field.label) return /*#__PURE__*/ jsxs("div", {
+            className: labelRowClass,
+            children: [
+                /*#__PURE__*/ jsx(Label, {
+                    id: `${htmlId}-label`,
+                    htmlFor: htmlId,
+                    label: field.label,
+                    required: !field.optional
+                }),
+                showBadge && /*#__PURE__*/ jsx(LocaleBadge, {
+                    locale: locale
+                })
+            ]
+        });
+        return null;
+    };
+    const renderInput = ()=>{
+        if (CustomField) return /*#__PURE__*/ jsx(CustomField, {
+            ...slotBaseProps,
+            onChange: handleChange,
+            defaultValue: defaultValue,
+            placeholder: field.placeholder
+        });
+        return /*#__PURE__*/ jsx(Suspense, {
+            fallback: /*#__PURE__*/ jsx("textarea", {
+                className: classnames('byline-field-code-loading', code_field_module.loading),
+                readOnly: true,
+                value: incomingValue,
+                rows: 6,
+                "aria-label": field.label
+            }),
+            children: /*#__PURE__*/ jsx(CodeEditor, {
+                id: htmlId,
+                value: incomingValue,
+                language: effectiveLanguage,
+                onChange: handleChange,
+                readOnly: true === field.readOnly,
+                ariaInvalid: null != fieldError,
+                ariaDescribedBy: null != fieldError ? `error-for-${htmlId}` : field.helpText ? `help-for-${htmlId}` : void 0
+            })
+        });
+    };
+    return /*#__PURE__*/ jsxs("div", {
+        className: `byline-field-code ${field.name}`,
+        children: [
+            renderLabel(),
+            BeforeField && /*#__PURE__*/ jsx(BeforeField, {
+                ...slotBaseProps
+            }),
+            renderInput(),
+            AfterField && /*#__PURE__*/ jsx(AfterField, {
+                ...slotBaseProps
+            }),
+            null != fieldError && /*#__PURE__*/ jsx(ErrorText, {
+                id: `error-for-${htmlId}`,
+                text: fieldError
+            }),
+            CustomHelpText ? /*#__PURE__*/ jsx(CustomHelpText, {
+                ...slotBaseProps,
+                helpText: field.helpText
+            }) : null == fieldError && field.helpText && /*#__PURE__*/ jsx(HelpText, {
+                id: `help-for-${htmlId}`,
+                text: field.helpText
+            })
+        ]
+    });
+};
+export { CodeField };

package/dist/fields/code/code-field.module.js

@@ -0,0 +1,7 @@
+import "./code-field_module.css";
+const code_field_module = {
+    "label-row": "label-row-bNilI8",
+    labelRow: "label-row-bNilI8",
+    loading: "loading-sejBT6"
+};
+export default code_field_module;

package/dist/fields/code/code-field_module.css

@@ -0,0 +1,58 @@
+:is(.label-row-bNilI8, .byline-field-code-label-row) {
+  align-items: center;
+  margin-bottom: .25rem;
+  display: flex;
+}
+
+.byline-field-code {
+  --byline-code-bg: var(--canvas-50, #fafafa);
+  --byline-code-fg: var(--canvas-950, #1c1c1e);
+  --byline-code-border: var(--canvas-300, #d6d6d6);
+  --byline-code-gutter-bg: var(--canvas-100, #f2f2f2);
+  --byline-code-gutter-fg: var(--canvas-500, #8b8b90);
+  --byline-code-active-line: #0000000a;
+  --byline-code-selection: #3b82f62e;
+  --byline-code-caret: var(--canvas-950, #1c1c1e);
+  --byline-code-focus-ring: #3b82f699;
+  --byline-code-keyword: #7c3aed;
+  --byline-code-string: #15803d;
+  --byline-code-comment: #767680;
+  --byline-code-number: #c2410c;
+  --byline-code-function: #1d4ed8;
+  --byline-code-type: #0f766e;
+  --byline-code-property: #a16207;
+  --byline-code-operator: #52525b;
+}
+
+:is([data-theme="dark"], .dark) .byline-field-code {
+  --byline-code-bg: var(--canvas-900, #1b1b1f);
+  --byline-code-fg: var(--canvas-100, #e6e6ea);
+  --byline-code-border: var(--canvas-700, #3f3f46);
+  --byline-code-gutter-bg: var(--canvas-800, #232327);
+  --byline-code-gutter-fg: var(--canvas-500, #77777f);
+  --byline-code-active-line: #ffffff0d;
+  --byline-code-selection: #60a5fa47;
+  --byline-code-caret: var(--canvas-100, #e6e6ea);
+  --byline-code-focus-ring: #60a5fa8c;
+  --byline-code-keyword: #c4b5fd;
+  --byline-code-string: #86efac;
+  --byline-code-comment: #8e8e96;
+  --byline-code-number: #fdba74;
+  --byline-code-function: #93c5fd;
+  --byline-code-type: #5eead4;
+  --byline-code-property: #fde047;
+  --byline-code-operator: #a1a1aa;
+}
+
+:is(.loading-sejBT6, .byline-field-code-loading) {
+  resize: none;
+  width: 100%;
+  font-family: var(--byline-code-font, ui-monospace, SFMono-Regular, Menlo, Consolas, monospace);
+  font-size: var(--byline-code-font-size, 13px);
+  color: var(--byline-code-fg);
+  background-color: var(--byline-code-bg);
+  border: 1px solid var(--byline-code-border);
+  border-radius: var(--byline-code-radius, 4px);
+  padding: .5rem;
+}
+

package/dist/fields/draggable-context-menu.js

@@ -16,7 +16,8 @@ function DraggableContextMenu({ onAddBelow, onRemove }) {
             /*#__PURE__*/ jsx(Dropdown.Trigger, {
                 render: /*#__PURE__*/ jsx(IconButton, {
                     variant: "text",
-                    size: "sm"
+                    size: "sm",
+                    "aria-label": t('fields.draggableMenu.triggerAriaLabel')
                 }),
                 children: /*#__PURE__*/ jsx(EllipsisIcon, {
                     width: "16px",

package/dist/fields/field-admin.d.ts

@@ -0,0 +1,15 @@
+/**
+ * This Source Code is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ *
+ * Copyright (c) Infonomic Company Limited
+ */
+import type { FieldAdminConfig } from '@byline/core';
+/**
+ * Entries of `map` addressing descendants of `childName`, re-keyed with the
+ * `childName.` prefix stripped — the sub-map a structural child (group /
+ * array) threads to its own children. Returns `undefined` when `map` has no
+ * descendant entries for the child, so leaf widgets aren't handed empty maps.
+ */
+export declare function sliceFieldAdmin(map: Record<string, FieldAdminConfig> | undefined, childName: string): Record<string, FieldAdminConfig> | undefined;

package/dist/fields/field-admin.js

@@ -0,0 +1,11 @@
+function sliceFieldAdmin(map, childName) {
+    if (null == map) return;
+    const prefix = `${childName}.`;
+    let sliced;
+    for (const [key, value] of Object.entries(map))if (key.startsWith(prefix)) {
+        sliced ??= {};
+        sliced[key.slice(prefix.length)] = value;
+    }
+    return sliced;
+}
+export { sliceFieldAdmin };

package/dist/fields/field-admin.test.node.d.ts

@@ -0,0 +1,8 @@
+/**
+ * This Source Code is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ *
+ * Copyright (c) Infonomic Company Limited
+ */
+export {};

package/dist/fields/field-helpers.js

@@ -19,6 +19,7 @@ const placeholderForField = (f)=>{
     switch(f.type){
         case 'text':
         case 'textArea':
+        case 'code':
             return '';
         case 'checkbox':
             return false;

package/dist/fields/field-renderer.d.ts

@@ -5,7 +5,7 @@
  *
  * Copyright (c) Infonomic Company Limited
  */
-import type { Field, FieldComponentSlots, RichTextEditorComponent } from '@byline/core';
+import type { Field, FieldAdminConfig, FieldComponentSlots, RichTextEditorComponent } from '@byline/core';
 interface FieldRendererProps {
     field: Field;
     defaultValue?: any;
@@ -32,6 +32,15 @@ interface FieldRendererProps {
      * Ignored when `field.type !== 'richText'`.
      */
     editor?: RichTextEditorComponent;
+    /**
+     * Admin overrides for this field's *descendants*, keyed by dotted,
+     * index-free schema paths relative to this field ('answer',
+     * 'filesGroup.publicationFile'). Only meaningful when `field` is a
+     * structural `group` / `array` — the widget slices the map per child
+     * (see `sliceFieldAdmin`). `components` / `editor` above stay the
+     * overrides for this field itself.
+     */
+    fieldAdmin?: Record<string, FieldAdminConfig>;
 }
-export declare const FieldRenderer: ({ field, defaultValue: initialDefault, basePath, disableSorting, hideLabel, collectionPath, contentLocale, components, editor, }: FieldRendererProps) => import("react").JSX.Element | null;
+export declare const FieldRenderer: ({ field, defaultValue: initialDefault, basePath, disableSorting, hideLabel, collectionPath, contentLocale, components, editor, fieldAdmin, }: FieldRendererProps) => import("react").JSX.Element | null;
 export {};

package/dist/fields/field-renderer.js

@@ -5,6 +5,7 @@ import { useFormContext } from "../forms/form-context.js";
 import { ArrayField } from "./array/array-field.js";
 import { BlocksField } from "./blocks/blocks-field.js";
 import { CheckboxField } from "./checkbox/checkbox-field.js";
+import { CodeField } from "./code/code-field.js";
 import { DateTimeField } from "./datetime/datetime-field.js";
 import field_renderer_module from "./field-renderer.module.js";
 import { FileField } from "./file/file-field.js";
@@ -19,7 +20,7 @@ import { TextField } from "./text/text-field.js";
 import { TextAreaField } from "./text-area/text-area-field.js";
 import { useFieldChangeHandler } from "./use-field-change-handler.js";
 import { useFieldCondition } from "./use-field-condition.js";
-const FieldRenderer = ({ field, defaultValue: initialDefault, basePath, disableSorting, hideLabel, collectionPath, contentLocale, components, editor })=>{
+const FieldRenderer = ({ field, defaultValue: initialDefault, basePath, disableSorting, hideLabel, collectionPath, contentLocale, components, editor, fieldAdmin })=>{
     const path = basePath ? `${basePath}.${field.name}` : field.name;
     const htmlId = path.replace(/[[\].]/g, '-');
     const handleChange = useFieldChangeHandler(field, path);
@@ -60,6 +61,19 @@ const FieldRenderer = ({ field, defaultValue: initialDefault, basePath, disableS
                     locale: isLocalised ? contentLocale : void 0,
                     components: components
                 });
+            case 'code':
+                return /*#__PURE__*/ jsx(CodeField, {
+                    field: hideLabel ? {
+                        ...field,
+                        label: void 0
+                    } : field,
+                    defaultValue: defaultValue,
+                    onChange: handleChange,
+                    path: path,
+                    id: htmlId,
+                    locale: isLocalised ? contentLocale : void 0,
+                    components: components
+                });
             case 'checkbox':
                 return /*#__PURE__*/ jsx(CheckboxField, {
                     field: hideLabel ? {
@@ -189,8 +203,10 @@ const FieldRenderer = ({ field, defaultValue: initialDefault, basePath, disableS
                     } : field,
                     defaultValue: defaultValue,
                     path: path,
+                    disableSorting: disableSorting,
                     collectionPath: collectionPath,
-                    contentLocale: contentLocale
+                    contentLocale: contentLocale,
+                    fieldAdmin: fieldAdmin
                 });
             case 'blocks':
                 if (!field.blocks) return null;
@@ -208,13 +224,14 @@ const FieldRenderer = ({ field, defaultValue: initialDefault, basePath, disableS
                     path: path,
                     disableSorting: disableSorting,
                     collectionPath: collectionPath,
-                    contentLocale: contentLocale
+                    contentLocale: contentLocale,
+                    fieldAdmin: fieldAdmin
                 });
             default:
                 return null;
         }
     };
-    const selfBadge = 'text' === field.type || 'textArea' === field.type || 'richText' === field.type;
+    const selfBadge = 'text' === field.type || 'textArea' === field.type || 'code' === field.type || 'richText' === field.type;
     if (badge && !selfBadge) return /*#__PURE__*/ jsxs("div", {
         className: classnames('byline-field-localized-wrap', field_renderer_module["localized-wrap"]),
         children: [

package/dist/fields/group/group-field.d.ts

@@ -5,11 +5,21 @@
  *
  * Copyright (c) Infonomic Company Limited
  */
-import type { GroupField as GroupFieldType } from '@byline/core';
+import type { FieldAdminConfig, GroupField as GroupFieldType } from '@byline/core';
 interface GroupFieldProps {
     field: GroupFieldType;
     defaultValue: any;
     path: string;
+    /**
+     * Threaded to child fields — governs only the *drag* affordance of any
+     * `array` children (structural add/remove always renders; see ArrayField).
+     * Defaults to `true` (conservative): arrays inside plain schema groups
+     * stay drag-free. `BlocksField` passes `false` on its synthesized group so
+     * arrays directly inside blocks are fully sortable — safe because each
+     * `DraggableSortable` is an independent DndContext with grip-scoped
+     * listeners.
+     */
+    disableSorting?: boolean;
     /**
      * Collection path forwarded to upload-capable child fields (`file` / `image`),
      * which need it to reach the `/upload` endpoint. Without it those fields fall
@@ -22,6 +32,17 @@ interface GroupFieldProps {
      * locale badge.
      */
     contentLocale?: string;
+    /**
+     * Per-child-field admin overrides (`components` slots, richtext `editor`),
+     * keyed by dotted, index-free schema paths relative to this group
+     * ('caption', 'faq.answer'). Threaded by `BlocksField` from the site-wide
+     * `ClientConfig.blockAdmin` registry (block children render through a
+     * synthesized group) and by `FieldRenderer` for plain schema groups, whose
+     * map arrives pre-sliced from the collection admin config. Exact-name
+     * entries apply to the child itself; deeper entries are re-sliced and
+     * threaded on (see `sliceFieldAdmin`).
+     */
+    fieldAdmin?: Record<string, FieldAdminConfig>;
 }
-export declare const GroupField: ({ field, defaultValue, path, collectionPath, contentLocale, }: GroupFieldProps) => import("react").JSX.Element;
+export declare const GroupField: ({ field, defaultValue, path, disableSorting, collectionPath, contentLocale, fieldAdmin, }: GroupFieldProps) => import("react").JSX.Element;
 export {};

package/dist/fields/group/group-field.js

@@ -2,11 +2,12 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { useMemo } from "react";
 import { ErrorText } from "@byline/ui/react";
 import classnames from "classnames";
+import { sliceFieldAdmin } from "../field-admin.js";
 import { placeholderForField } from "../field-helpers.js";
 import { FieldRenderer } from "../field-renderer.js";
 import { useFieldError } from "../../forms/form-context.js";
 import group_field_module from "./group-field.module.js";
-const GroupField = ({ field, defaultValue, path, collectionPath, contentLocale })=>{
+const GroupField = ({ field, defaultValue, path, disableSorting = true, collectionPath, contentLocale, fieldAdmin })=>{
     const fieldError = useFieldError(field.name);
     const groupData = useMemo(()=>{
         if (defaultValue && 'object' == typeof defaultValue && !Array.isArray(defaultValue)) return defaultValue;
@@ -46,9 +47,12 @@ const GroupField = ({ field, defaultValue, path, collectionPath, contentLocale }
                         field: innerField,
                         defaultValue: groupData[innerField.name],
                         basePath: path,
-                        disableSorting: true,
+                        disableSorting: disableSorting,
                         collectionPath: collectionPath,
-                        contentLocale: contentLocale
+                        contentLocale: contentLocale,
+                        components: fieldAdmin?.[innerField.name]?.components,
+                        editor: fieldAdmin?.[innerField.name]?.editor,
+                        fieldAdmin: sliceFieldAdmin(fieldAdmin, innerField.name)
                     }, innerField.name))
             }),
             fieldError && /*#__PURE__*/ jsx(ErrorText, {

package/dist/fields/relation/relation-picker.js

@@ -39,13 +39,18 @@ const RelationPicker = ({ targetCollectionPath, targetDefinition, displayField,
         const selectFields = resolveSelectFields(targetDefinition, displayField, pickerColumns, extraSelectFields);
         setLoading(true);
         setError(null);
+        const itemViewSort = targetAdminConfig?.itemViewSort;
         getCollectionDocuments({
             collection: targetCollectionPath,
             params: {
                 page,
                 page_size: PAGE_SIZE,
                 query: query.length > 0 ? query : void 0,
-                fields: selectFields
+                fields: selectFields,
+                ...null != itemViewSort ? {
+                    order: String(itemViewSort.field),
+                    desc: 'desc' === itemViewSort.direction
+                } : {}
             }
         }).then((response)=>{
             if (cancelled) return;
@@ -71,7 +76,8 @@ const RelationPicker = ({ targetCollectionPath, targetDefinition, displayField,
         targetDefinition,
         pickerColumns,
         getCollectionDocuments,
-        t
+        t,
+        targetAdminConfig?.itemViewSort
     ]);
     const resolvedDisplayField = displayField ?? targetDefinition?.useAsTitle ?? resolveFallbackDisplayField(targetDefinition) ?? null;
     const handleSelect = useCallback(()=>{

package/dist/fields/select/select-field.js

@@ -17,10 +17,12 @@ const SelectField = ({ field, value, defaultValue, onChange, id, path })=>{
                 id: htmlId,
                 htmlFor: htmlId,
                 label: field.label,
-                required: !field.optional
+                required: !field.optional,
+                className: classnames('byline-field-select-label', select_field_module.label)
             }),
             /*#__PURE__*/ jsx(Select, {
-                size: "sm",
+                size: "xs",
+                variant: "outlined",
                 id: htmlId,
                 name: field.name,
                 placeholder: "Select an option",

package/dist/fields/select/select-field.module.js

@@ -1,5 +1,6 @@
 import "./select-field_module.css";
 const select_field_module = {
+    label: "label-ScZ_3S",
     dirty: "dirty-aKaGZN"
 };
 export default select_field_module;

package/dist/fields/select/select-field_module.css

@@ -1,3 +1,7 @@
+:is(.label-ScZ_3S, .byline-field-select-label) {
+  margin-bottom: .25rem;
+}
+
 :is(.dirty-aKaGZN, .byline-field-select-dirty) {
   border-color: var(--blue-300);
 }

package/dist/fields/sortable-item.d.ts

@@ -13,3 +13,9 @@ export declare const SortableItem: ({ id, label, children, onAddBelow, onRemove,
     onAddBelow?: () => void;
     onRemove?: () => void;
 }) => import("react").JSX.Element;
+export declare const StaticItem: ({ label, children, onAddBelow, onRemove, }: {
+    label: ReactNode;
+    children: ReactNode;
+    onAddBelow?: () => void;
+    onRemove?: () => void;
+}) => import("react").JSX.Element;

package/dist/fields/sortable-item.js

@@ -5,25 +5,13 @@ import { ChevronDownIcon, GripperVerticalIcon, useSortable } from "@byline/ui/re
 import classnames from "classnames";
 import { DraggableContextMenu } from "./draggable-context-menu.js";
 import sortable_item_module from "./sortable-item.module.js";
-const SortableItem = ({ id, label, children, onAddBelow, onRemove })=>{
+const ItemFrame = ({ label, children, onAddBelow, onRemove, grip, rootRef, style, dragging = false, rootClassName })=>{
     const { t } = useTranslation('byline-admin');
-    const { attributes, listeners, setNodeRef, transform, transition, isDragging } = useSortable({
-        id,
-        transition: {
-            duration: 250,
-            easing: 'cubic-bezier(0, 0.2, 0.2, 1)'
-        }
-    });
     const [collapsed, setCollapsed] = useState(false);
-    const style = {
-        transform: transform ? `translate3d(${transform.x}px, ${transform.y}px, 0)` : void 0,
-        transition,
-        zIndex: isDragging ? 10 : 'auto'
-    };
     return /*#__PURE__*/ jsxs("div", {
-        ref: setNodeRef,
+        ref: rootRef,
         style: style,
-        className: classnames('byline-sortable', sortable_item_module.root, isDragging && [
+        className: classnames('byline-sortable', sortable_item_module.root, rootClassName, dragging && [
             'byline-sortable-dragging',
             sortable_item_module.dragging
         ], collapsed && [
@@ -37,15 +25,7 @@ const SortableItem = ({ id, label, children, onAddBelow, onRemove })=>{
                     sortable_item_module["header-expanded"]
                 ]),
                 children: [
-                    /*#__PURE__*/ jsx("button", {
-                        type: "button",
-                        className: classnames('byline-sortable-grip', sortable_item_module.grip),
-                        ...attributes,
-                        ...listeners,
-                        children: /*#__PURE__*/ jsx(GripperVerticalIcon, {
-                            className: classnames('byline-sortable-grip-icon', sortable_item_module["grip-icon"])
-                        })
-                    }),
+                    grip,
                     /*#__PURE__*/ jsx("div", {
                         className: classnames('byline-sortable-label', sortable_item_module.label),
                         children: label
@@ -78,4 +58,43 @@ const SortableItem = ({ id, label, children, onAddBelow, onRemove })=>{
         ]
     });
 };
-export { SortableItem };
+const SortableItem = ({ id, label, children, onAddBelow, onRemove })=>{
+    const { attributes, listeners, setNodeRef, transform, transition, isDragging } = useSortable({
+        id,
+        transition: {
+            duration: 250,
+            easing: 'cubic-bezier(0, 0.2, 0.2, 1)'
+        }
+    });
+    const style = {
+        transform: transform ? `translate3d(${transform.x}px, ${transform.y}px, 0)` : void 0,
+        transition,
+        zIndex: isDragging ? 10 : 'auto'
+    };
+    return /*#__PURE__*/ jsx(ItemFrame, {
+        label: label,
+        onAddBelow: onAddBelow,
+        onRemove: onRemove,
+        rootRef: setNodeRef,
+        style: style,
+        dragging: isDragging,
+        grip: /*#__PURE__*/ jsx("button", {
+            type: "button",
+            className: classnames('byline-sortable-grip', sortable_item_module.grip),
+            ...attributes,
+            ...listeners,
+            children: /*#__PURE__*/ jsx(GripperVerticalIcon, {
+                className: classnames('byline-sortable-grip-icon', sortable_item_module["grip-icon"])
+            })
+        }),
+        children: children
+    });
+};
+const StaticItem = ({ label, children, onAddBelow, onRemove })=>/*#__PURE__*/ jsx(ItemFrame, {
+        label: label,
+        onAddBelow: onAddBelow,
+        onRemove: onRemove,
+        rootClassName: "byline-sortable-static",
+        children: children
+    });
+export { SortableItem, StaticItem };

package/dist/fields/text/text-field_module.css

@@ -1,5 +1,6 @@
 :is(.label-row-sjBuRb, .byline-field-text-label-row) {
   align-items: center;
+  margin-bottom: .25rem;
   display: flex;
 }
 

package/dist/fields/text-area/text-area-field_module.css

@@ -1,5 +1,6 @@
 :is(.label-row-HwX7C9, .byline-field-text-area-label-row) {
   align-items: center;
+  margin-bottom: .25rem;
   display: flex;
 }
 

package/dist/forms/form-context.js

@@ -140,7 +140,7 @@ const FormProvider = ({ children, initialData = {}, documentId = null })=>{
     const appendPatch = useCallback((patch)=>{
         patchesRef.current = [
             ...patchesRef.current,
-            patch
+            structuredClone(patch)
         ];
         dirtyFields.current.add('__patch__');
         notifyMetaListeners();

package/dist/forms/form-renderer.d.ts

@@ -104,7 +104,7 @@ export interface FormRendererProps {
      * Opts the document-tree placement widget into the sidebar (above the
      * available-locales widget). Sourced from `CollectionDefinition.tree` by the
      * caller. Renders only in edit mode (placement needs a persisted document)
-     * and only when the host wires the tree services. See docs/04-collections/03-document-trees.md.
+     * and only when the host wires the tree services. See docs/04-collections/04-document-trees.md.
      */
     tree?: boolean;
     headingLabel?: string;

package/dist/forms/form-renderer.js

@@ -5,6 +5,7 @@ import { getClientConfig } from "@byline/core";
 import { useTranslation } from "@byline/i18n/react";
 import { Alert, Button, ComboButton } from "@byline/ui/react";
 import classnames from "classnames";
+import { sliceFieldAdmin } from "../fields/field-admin.js";
 import { FieldRenderer } from "../fields/field-renderer.js";
 import { useBylineFieldServices } from "../fields/field-services-context.js";
 import { AdminGroup } from "../presentation/group.js";
@@ -185,7 +186,8 @@ const FormContent = ({ mode, fields, onSubmit, onCancel, onStatusChange, onUnpub
             collectionPath: collectionPath,
             contentLocale: contentLocale,
             components: adminConfig?.fields?.[field.name]?.components,
-            editor: adminConfig?.fields?.[field.name]?.editor
+            editor: adminConfig?.fields?.[field.name]?.editor,
+            fieldAdmin: sliceFieldAdmin(adminConfig?.fields, field.name)
         }, field.name);
     };
     const renderItem = (name)=>{

package/dist/forms/tree-placement-widget.d.ts

@@ -8,7 +8,7 @@ export interface TreePlacementWidgetProps {
 }
 /**
  * Sidebar widget for placing the current document within its collection's
- * single-parent document tree (the `tree: true` primitive — docs/04-collections/03-document-trees.md).
+ * single-parent document tree (the `tree: true` primitive — docs/04-collections/04-document-trees.md).
  *
  * The tree is document-grain and **unversioned**, so changes here write
  * immediately (independent of the form's content save). The editor picks a