@byline/admin 5.1.4 → 5.2.0

package/package.json

@@ -2,7 +2,7 @@
   "name": "@byline/admin",
   "private": false,
   "license": "MPL-2.0",
-  "version": "5.1.4",
+  "version": "5.2.0",
   "engines": {
     "node": ">=20.9.0"
   },
@@ -182,29 +182,29 @@
     "jose": "^6.2.12",
     "react-diff-viewer-continued": "^4.4.0",
     "uuid": "^14.0.2",
-    "zod": "^4.5.4",
-    "@byline/analytics": "5.1.4",
-    "@byline/auth": "5.1.4",
-    "@byline/i18n": "5.1.4",
-    "@byline/ui": "5.1.4",
-    "@byline/analytics-agent": "5.1.4",
-    "@byline/core": "5.1.4"
+    "zod": "^4.6.2",
+    "@byline/analytics": "5.2.0",
+    "@byline/core": "5.2.0",
+    "@byline/analytics-agent": "5.2.0",
+    "@byline/ui": "5.2.0",
+    "@byline/i18n": "5.2.0",
+    "@byline/auth": "5.2.0"
   },
   "peerDependencies": {
     "react": "^19.0.0",
     "react-dom": "^19.0.0"
   },
   "devDependencies": {
-    "@biomejs/biome": "2.5.12",
+    "@biomejs/biome": "2.5.13",
     "@rsbuild/plugin-react": "^2.1.0",
     "@rslib/core": "^1.0.0",
-    "@types/node": "^26.5.0",
-    "@types/react": "19.2.18",
-    "@types/react-dom": "19.2.7",
+    "@types/node": "^26.5.1",
+    "@types/react": "19.3.0",
+    "@types/react-dom": "19.3.0",
     "@vitejs/plugin-react": "^6.1.1",
     "jsdom": "^30.0.1",
-    "react": "^19.2.8",
-    "react-dom": "^19.2.8",
+    "react": "^19.3.0",
+    "react-dom": "^19.3.0",
     "typescript": "^7.0.2",
     "typescript-plugin-css-modules": "^5.2.0",
     "vitest": "^5.0.0"

package/dist/exports-parity.test.node.js

@@ -1,37 +0,0 @@
-/**
- * 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
- */
-/**
- * Guard against `publishConfig.exports` drift.
- *
- * `@byline/admin` carries a `publishConfig.exports` block that npm uses to
- * **override** the top-level `exports` at publish time. The workspace and dev
- * builds resolve through the top-level `exports` (or source), so a subpath
- * added there but forgotten in `publishConfig.exports` typechecks and builds
- * locally yet is **missing from the published package** — surfacing only as a
- * downstream consumer's build error ("X is not exported …"). That is exactly
- * how `./admin-activity` slipped through in v3.11.0.
- *
- * This test fails the moment the two blocks drift, so the gap is caught in
- * `pnpm test` / CI rather than in a production Docker build.
- */
-import { readFileSync } from 'node:fs';
-import { dirname, resolve } from 'node:path';
-import { fileURLToPath } from 'node:url';
-import { describe, expect, it } from 'vitest';
-const pkgPath = resolve(dirname(fileURLToPath(import.meta.url)), '../package.json');
-const pkg = JSON.parse(readFileSync(pkgPath, 'utf8'));
-describe('package.json export parity', () => {
-    it('every top-level export subpath is also declared in publishConfig.exports', () => {
-        const publishExports = pkg.publishConfig?.exports;
-        // If there is no override, the top-level exports ship as-is — nothing to check.
-        if (publishExports == null)
-            return;
-        const missing = Object.keys(pkg.exports).filter((key) => !(key in publishExports));
-        expect(missing, `publishConfig.exports is missing subpath(s) present in the top-level exports: ${missing.join(', ')}. The published package would not expose them — add them to BOTH blocks.`).toEqual([]);
-    });
-});

package/dist/fields/array/array-field.jsx

@@ -1,209 +0,0 @@
-/**
- * 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 { useEffect, useState } from 'react';
-import { useTranslation } from '@byline/i18n/react';
-import { DraggableSortable, IconButton, moveItem, PlusIcon } from '@byline/ui/react';
-import cx from 'clsx';
-import { sliceFieldAdmin } from '../../fields/field-admin';
-import { defaultScalarForField } from '../../fields/field-helpers';
-import { FieldRenderer } from '../../fields/field-renderer';
-import { SortableItem, StaticItem } from '../../fields/sortable-item';
-import { useFormContext } from '../../forms/form-context';
-import { hasExistingIdTargets } from '../../forms/nested-path';
-import { moveRepeatingItems, repeatingItemId, repeatingItemPath } from '../../forms/repeating-items';
-import styles from './array-field.module.css';
-// ---------------------------------------------------------------------------
-// ArrayField — renders `type: 'array'` fields. Each item renders every child
-// field declared in the array's `fields` (value fields and/or groups, in any
-// combination). Supports D&D.
-// ---------------------------------------------------------------------------
-export const ArrayField = ({ field, defaultValue, path, disableSorting = false, contentLocale, fieldAdmin, }) => {
-    const { appendPatch, getFieldValue, getFieldValues, removePendingUploadsUnder, setFieldStore } = useFormContext();
-    const { t } = useTranslation('byline-admin');
-    const [items, setItems] = useState([]);
-    useEffect(() => {
-        // Prefer the live form-store value over `defaultValue` when seeding the
-        // rendered list. The store lives in FormProvider — above the tab layout —
-        // so it survives this field unmounting/remounting as the editor switches
-        // tabs; `defaultValue` is only the initial seed and is empty in create
-        // mode. Re-seeding from `defaultValue` on remount would drop items the
-        // editor had already added on an earlier visit to this tab.
-        const storeValue = getFieldValue(path);
-        const source = Array.isArray(storeValue) ? storeValue : defaultValue;
-        if (Array.isArray(source)) {
-            setItems(source.map((item) => ({
-                id: item && typeof item === 'object' && '_id' in item
-                    ? String(item._id)
-                    : item && typeof item === 'object' && 'id' in item
-                        ? String(item.id)
-                        : crypto.randomUUID(),
-                data: item,
-            })));
-        }
-        else {
-            setItems([]);
-        }
-    }, [defaultValue, getFieldValue, path]);
-    const handleDragEnd = ({ moveFromIndex, moveToIndex, }) => {
-        const currentArray = (getFieldValue(path) ?? defaultValue);
-        if (!Array.isArray(currentArray))
-            return;
-        const move = moveRepeatingItems(currentArray, moveFromIndex, moveToIndex);
-        if (move == null)
-            return;
-        setItems((prev) => moveItem(prev, move.fromIndex, move.toIndex));
-        setFieldStore(path, move.items);
-        appendPatch({
-            kind: 'array.move',
-            path,
-            itemId: move.itemId,
-            toIndex: move.toIndex,
-        });
-    };
-    const handleAddItem = async (atIndex) => {
-        const childFields = field.fields ?? [];
-        if (childFields.length === 0)
-            return;
-        const newId = crypto.randomUUID();
-        // Build a new item with default values for ALL child fields.
-        // Assign the stable `_id` client-side — exactly like BlocksField's
-        // handleAddItem — so the item is patch-addressable (move / remove by
-        // `_id`) within the same editing session, before any server write has
-        // assigned identity. The storage layer persists `_id` via store_meta.
-        const newItem = { _id: newId };
-        for (const childField of childFields) {
-            if (childField.type === 'group' && childField.fields && childField.fields.length > 0) {
-                // Group child — build a nested object with defaults for each inner field
-                const groupObj = {};
-                for (const innerField of childField.fields) {
-                    groupObj[innerField.name] = await defaultScalarForField(innerField, getFieldValues);
-                }
-                newItem[childField.name] = groupObj;
-            }
-            else {
-                newItem[childField.name] = await defaultScalarForField(childField, getFieldValues);
-            }
-        }
-        // Defaults may resolve asynchronously. If an enclosing stable-id item was
-        // removed in the meantime, do not append a structural patch that would
-        // recreate that missing parent on the server.
-        if (!hasExistingIdTargets(getFieldValues(), path))
-            return;
-        const currentArray = (getFieldValue(path) ?? defaultValue);
-        const insertAt = atIndex != null ? atIndex : currentArray ? currentArray.length : 0;
-        const newItemWrapper = { id: newId, data: newItem };
-        setItems((prev) => {
-            const next = [...prev];
-            next.splice(insertAt, 0, newItemWrapper);
-            return next;
-        });
-        appendPatch({
-            kind: 'array.insert',
-            path: path,
-            index: insertAt,
-            item: newItem,
-        });
-        const newArrayValue = currentArray ? [...currentArray] : [];
-        newArrayValue.splice(insertAt, 0, newItem);
-        setFieldStore(path, newArrayValue);
-    };
-    const handleRemoveItem = (index) => {
-        const currentArray = (getFieldValue(path) ?? defaultValue);
-        if (!Array.isArray(currentArray) || index < 0 || index >= currentArray.length)
-            return;
-        const item = currentArray[index];
-        const itemPath = repeatingItemPath(path, item, index);
-        setItems((prev) => prev.filter((_, i) => i !== index));
-        removePendingUploadsUnder(itemPath);
-        appendPatch({
-            kind: 'array.remove',
-            path: path,
-            itemId: repeatingItemId(item) ?? String(index),
-        });
-        const newArrayValue = [...currentArray];
-        newArrayValue.splice(index, 1);
-        setFieldStore(path, newArrayValue);
-    };
-    const handleInsertBelow = (index) => {
-        void handleAddItem(index + 1);
-    };
-    const renderItem = (itemWrapper, index) => {
-        const item = itemWrapper.data;
-        const arrayElementPath = repeatingItemPath(path, item, index);
-        if (!item || typeof item !== 'object')
-            return null;
-        const childFields = field.fields ?? [];
-        if (childFields.length === 0)
-            return null;
-        // Render ALL child fields defined in the array's field schema
-        const innerBody = childFields.map((childField) => {
-            const initial = item[childField.name];
-            if (childField.type === 'group' && childField.fields && childField.fields.length > 0) {
-                // Group child — render its inner fields with the group's sub-object.
-                // fieldAdmin slices one level per structural hop: the group's
-                // descendant map first, then each inner field's own slice.
-                const groupData = initial && typeof initial === 'object' ? initial : {};
-                const groupAdmin = sliceFieldAdmin(fieldAdmin, childField.name);
-                return (<div key={childField.name} className={cx('byline-field-array-group-fields', styles['group-fields'])}>
-            {childField.label && (<h4 className={cx('byline-field-array-group-header', styles['group-header'])}>
-                {childField.label}
-              </h4>)}
-            {childField.fields.map((innerField) => (<FieldRenderer key={innerField.name} field={innerField} defaultValue={groupData[innerField.name]} basePath={`${arrayElementPath}.${childField.name}`} disableSorting={true} contentLocale={contentLocale} components={groupAdmin?.[innerField.name]?.components} editor={groupAdmin?.[innerField.name]?.editor} fieldAdmin={sliceFieldAdmin(groupAdmin, innerField.name)}/>))}
-          </div>);
-            }
-            return (<FieldRenderer key={childField.name} field={childField} defaultValue={initial} basePath={arrayElementPath} disableSorting={true} contentLocale={contentLocale} components={fieldAdmin?.[childField.name]?.components} editor={fieldAdmin?.[childField.name]?.editor} fieldAdmin={sliceFieldAdmin(fieldAdmin, childField.name)}/>);
-        });
-        // Per-item label: the array label plus a 1-based position, so items
-        // read "Questions 1", "Questions 2" rather than all repeating the bare
-        // array label.
-        const itemLabel = `${field.label ?? field.name} ${index + 1}`;
-        // `disableSorting` removes only the drag affordance. Structural editing
-        // (add-below / remove / collapse) is always available — StaticItem is
-        // the grip-less sibling of SortableItem (see sortable-item.tsx for why
-        // it is a separate component rather than a prop).
-        if (disableSorting) {
-            return (<StaticItem key={itemWrapper.id} label={itemLabel} onAddBelow={() => handleInsertBelow(index)} onRemove={() => handleRemoveItem(index)}>
-          <div className={cx('byline-field-array-group-fields', styles['group-fields'])}>
-            {innerBody}
-          </div>
-        </StaticItem>);
-        }
-        return (<SortableItem key={itemWrapper.id} id={itemWrapper.id} label={itemLabel} onAddBelow={() => handleInsertBelow(index)} onRemove={() => handleRemoveItem(index)}>
-        <div className={cx('byline-field-array-group-fields', styles['group-fields'])}>
-          {innerBody}
-        </div>
-      </SortableItem>);
-    };
-    // The add-row renders in both branches — structural editing does not
-    // depend on sortability.
-    const addRow = (<div className={cx('byline-field-array-add-row', styles['add-row'])}>
-      <IconButton onClick={() => {
-            void handleAddItem();
-        }} aria-label={t('fields.array.addItemAriaLabel')}>
-        <PlusIcon />
-      </IconButton>
-      {/* Text-styled button so the label is clickable too. Removed from
-            the tab order (tabIndex -1) — the IconButton is the single
-            keyboard/screen-reader control for this action. */}
-      <button type="button" tabIndex={-1} onClick={() => {
-            void handleAddItem();
-        }} className={cx('byline-field-array-add-label', styles['add-label'])}>
-        {t('fields.array.addItem')}
-      </button>
-    </div>);
-    return (<div className={`byline-field-array ${field.name}`}>
-      {field.label && (<h3 className={cx('byline-field-array-title', styles.title)}>{field.label}</h3>)}
-      {disableSorting ? (<div className={cx('byline-field-array-stack', styles.stack)}>
-          {items.map((item, index) => renderItem(item, index))}
-          {addRow}
-        </div>) : (<DraggableSortable ids={items.map((i) => i.id)} onDragEnd={handleDragEnd} className={cx('byline-field-array-stack', styles.stack)}>
-          {items.map((item, index) => renderItem(item, index))}
-          {addRow}
-        </DraggableSortable>)}
-    </div>);
-};

package/dist/fields/blocks/blocks-field.jsx

@@ -1,248 +0,0 @@
-/**
- * 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 { useEffect, useMemo, useState } from 'react';
-import { getAdminConfig } from '@byline/core';
-import { useTranslation } from '@byline/i18n/react';
-import { Card, CloseIcon, DraggableSortable, IconButton, Modal, moveItem, PlusIcon, } from '@byline/ui/react';
-import cx from 'clsx';
-import { defaultScalarForField } from '../../fields/field-helpers';
-import { GroupField } from '../../fields/group/group-field';
-import { SortableItem } from '../../fields/sortable-item';
-import { useFormContext } from '../../forms/form-context';
-import { hasExistingIdTargets } from '../../forms/nested-path';
-import { moveRepeatingItems, repeatingItemId, repeatingItemPath } from '../../forms/repeating-items';
-import styles from './blocks-field.module.css';
-// ---------------------------------------------------------------------------
-// BlocksField — renders `type: 'blocks'` fields. Children are heterogeneous
-// group fields selected via a modal picker. Supports D&D.
-// ---------------------------------------------------------------------------
-export const BlocksField = ({ field, defaultValue, path, contentLocale, }) => {
-    const { appendPatch, getFieldValue, getFieldValues, removePendingUploadsUnder, setFieldStore } = useFormContext();
-    const { t } = useTranslation('byline-admin');
-    const [items, setItems] = useState([]);
-    const [showAddBlockModal, setShowAddBlockModal] = useState(false);
-    const [pendingInsertIndex, setPendingInsertIndex] = useState(null);
-    const availableBlocks = useMemo(() => field.blocks ?? [], [field.blocks]);
-    // Site-wide per-block admin config (`AdminConfig.blockAdmin`), resolved by
-    // blockType. Registry-based on purpose: blocks are cross-collection units,
-    // so their admin config applies wherever the block renders — no threading
-    // from the collection admin config is needed (mirrors how FieldRenderer
-    // resolves the global richText editor from admin config).
-    const blockAdminByType = useMemo(() => {
-        const map = new Map();
-        for (const entry of getAdminConfig().blockAdmin ?? []) {
-            map.set(entry.blockType, entry);
-        }
-        return map;
-    }, []);
-    const [selectedBlockName, setSelectedBlockName] = useState(() => availableBlocks[0]?.blockType ?? '');
-    useEffect(() => {
-        if (selectedBlockName == null ||
-            !availableBlocks.some((b) => b.blockType === selectedBlockName)) {
-            setSelectedBlockName(availableBlocks[0]?.blockType ?? '');
-        }
-    }, [availableBlocks, selectedBlockName]);
-    useEffect(() => {
-        // Prefer the live form-store value over `defaultValue` when seeding the
-        // rendered list. The store lives in FormProvider — above the tab layout —
-        // so it survives this field unmounting/remounting as the editor switches
-        // tabs; `defaultValue` is only the initial seed and is empty in create
-        // mode. Re-seeding from `defaultValue` on remount would drop blocks the
-        // editor had already added on an earlier visit to this tab.
-        const storeValue = getFieldValue(path);
-        const source = Array.isArray(storeValue) ? storeValue : defaultValue;
-        if (Array.isArray(source)) {
-            setItems(source.map((item) => ({
-                id: item && typeof item === 'object' && '_id' in item
-                    ? String(item._id)
-                    : crypto.randomUUID(),
-                data: item,
-            })));
-        }
-        else {
-            setItems([]);
-        }
-    }, [defaultValue, getFieldValue, path]);
-    const handleDragEnd = ({ moveFromIndex, moveToIndex, }) => {
-        const currentArray = (getFieldValue(path) ?? defaultValue);
-        if (!Array.isArray(currentArray))
-            return;
-        const move = moveRepeatingItems(currentArray, moveFromIndex, moveToIndex);
-        if (move == null)
-            return;
-        setItems((prev) => moveItem(prev, move.fromIndex, move.toIndex));
-        setFieldStore(path, move.items);
-        appendPatch({
-            kind: 'array.move',
-            path,
-            itemId: move.itemId,
-            toIndex: move.toIndex,
-        });
-    };
-    const handleAddItem = async (forcedVariantName, atIndex) => {
-        setShowAddBlockModal(false);
-        setPendingInsertIndex(null);
-        const variant = (forcedVariantName != null
-            ? availableBlocks.find((v) => v.blockType === forcedVariantName)
-            : undefined) ?? availableBlocks[0];
-        if (!variant)
-            return;
-        const compositeFields = (variant.fields ?? []);
-        const newId = crypto.randomUUID();
-        const newItem = {
-            _id: newId,
-            _type: variant.blockType,
-        };
-        for (const f of compositeFields) {
-            newItem[f.name] = await defaultScalarForField(f, getFieldValues);
-        }
-        if (!hasExistingIdTargets(getFieldValues(), path))
-            return;
-        const currentArray = (getFieldValue(path) ?? defaultValue);
-        const insertAt = atIndex != null ? atIndex : currentArray ? currentArray.length : 0;
-        const newItemWrapper = { id: newId, data: newItem };
-        setItems((prev) => {
-            const next = [...prev];
-            next.splice(insertAt, 0, newItemWrapper);
-            return next;
-        });
-        appendPatch({
-            kind: 'array.insert',
-            path: path,
-            index: insertAt,
-            item: newItem,
-        });
-        const newArrayValue = currentArray ? [...currentArray] : [];
-        newArrayValue.splice(insertAt, 0, newItem);
-        setFieldStore(path, newArrayValue);
-    };
-    const handleRemoveItem = (index) => {
-        const currentArray = (getFieldValue(path) ?? defaultValue);
-        if (!Array.isArray(currentArray) || index < 0 || index >= currentArray.length)
-            return;
-        const item = currentArray[index];
-        const itemPath = repeatingItemPath(path, item, index);
-        const itemId = repeatingItemId(item) ?? String(index);
-        setItems((prev) => prev.filter((_, i) => i !== index));
-        removePendingUploadsUnder(itemPath);
-        appendPatch({
-            kind: 'array.remove',
-            path: path,
-            itemId,
-        });
-        const newArrayValue = [...currentArray];
-        newArrayValue.splice(index, 1);
-        setFieldStore(path, newArrayValue);
-    };
-    const handleInsertBelow = (index, forcedVariantName) => {
-        if (availableBlocks.length > 1 && forcedVariantName == null) {
-            setPendingInsertIndex(index + 1);
-            setShowAddBlockModal(true);
-        }
-        else {
-            void handleAddItem(forcedVariantName, index + 1);
-        }
-    };
-    const renderItem = (itemWrapper, index) => {
-        const item = itemWrapper.data;
-        const arrayElementPath = repeatingItemPath(path, item, index);
-        if (!item || typeof item !== 'object' || typeof item._type !== 'string')
-            return null;
-        const subField = field.blocks?.find((b) => b.blockType === item._type);
-        if (subField == null)
-            return null;
-        // Extract field data (everything except _id and _type)
-        const { _id, _type, ...fieldData } = item;
-        const label = subField.label ?? _type;
-        // Render the block's children directly with arrayElementPath as the
-        // path (not basePath).  FieldRenderer would append the group name
-        // (e.g. "richTextBlock") producing paths like
-        // "content[id=...].richTextBlock.constrainedWidth", but the flat block
-        // shape stores fields directly on the item so the correct path is
-        // "content[id=...].constrainedWidth".
-        const body = (<GroupField key={subField.blockType} field={{
-                type: 'group',
-                name: subField.blockType,
-                fields: subField.fields,
-                label: undefined,
-            }} defaultValue={fieldData} path={arrayElementPath} 
-        // Arrays directly inside a block are fully sortable: each
-        // DraggableSortable is an independent DndContext and drag listeners
-        // are grip-scoped, so the inner array's drags can't leak into the
-        // block-level context (and vice versa).
-        disableSorting={false} contentLocale={contentLocale} fieldAdmin={blockAdminByType.get(item._type)?.fields}/>);
-        return (<SortableItem key={itemWrapper.id} id={itemWrapper.id} label={label ?? subField.blockType} onAddBelow={() => handleInsertBelow(index)} onRemove={() => handleRemoveItem(index)}>
-        {body}
-      </SortableItem>);
-    };
-    return (<div className={`byline-field-blocks ${field.name}`}>
-      {field.label && (<h3 className={cx('byline-field-blocks-title', styles.title)}>{field.label}</h3>)}
-      <DraggableSortable ids={items.map((i) => i.id)} onDragEnd={handleDragEnd} className={cx('byline-field-blocks-stack', styles.stack)}>
-        {items.map((item, index) => renderItem(item, index))}
-        <div className={cx('byline-field-blocks-add-row', styles['add-row'])}>
-          <IconButton onClick={() => {
-            setPendingInsertIndex(null);
-            setShowAddBlockModal(true);
-        }} disabled={!selectedBlockName} aria-label={t('fields.blocks.addBlockAriaLabel')} variant="outlined">
-            <PlusIcon />
-          </IconButton>
-          {/* Text-styled button so the label is clickable too. Removed from
-            the tab order (tabIndex -1) — the IconButton is the single
-            keyboard/screen-reader control for this action. */}
-          <button type="button" tabIndex={-1} disabled={!selectedBlockName} onClick={() => {
-            setPendingInsertIndex(null);
-            setShowAddBlockModal(true);
-        }} className={cx('byline-field-blocks-add-label', styles['add-label'])}>
-            {t('fields.blocks.addBlock')}
-          </button>
-        </div>
-      </DraggableSortable>
-      <Modal isOpen={showAddBlockModal} closeOnOverlayClick={true} onDismiss={() => {
-            setShowAddBlockModal(false);
-            setPendingInsertIndex(null);
-        }}>
-        <Modal.Container style={{ maxWidth: '700px' }}>
-          <Modal.Header className={cx('byline-field-blocks-modal-head', styles['modal-head'])}>
-            <h3 className={cx('byline-field-blocks-modal-title', styles['modal-title'])}>
-              {t('fields.blocks.modalTitle')}
-            </h3>
-            <IconButton arial-label={t('common.actions.close')} size="xs" onClick={() => {
-            setShowAddBlockModal(false);
-            setPendingInsertIndex(null);
-        }}>
-              <CloseIcon width="16px" height="16px" svgClassName="white-icon"/>
-            </IconButton>
-          </Modal.Header>
-          <Modal.Content className={cx('byline-field-blocks-card-cursor', styles['modal-content'])}>
-            <div className={cx('byline-field-blocks-grid', styles.grid)}>
-              {availableBlocks.map((b, index) => (<Card key={b.blockType} hover onClick={() => void handleAddItem(b.blockType, pendingInsertIndex ?? undefined)} className={cx('byline-field-blocks-card', styles.card)}>
-                  <Card.Header>
-                    <div className={cx('byline-field-blocks-card-head', styles['card-head'])}>
-                      <Card.Title className={cx('byline-field-blocks-card-title', styles['card-title'])}>
-                        {b.label ?? b.blockType}
-                      </Card.Title>
-                      <span className={cx('byline-field-blocks-card-index', styles['card-index'])}>
-                        {index + 1}
-                      </span>
-                    </div>
-                    <code className={cx('byline-field-blocks-card-code', styles['card-code'])}>
-                      {b.blockType}
-                    </code>
-                  </Card.Header>
-                  <Card.Content>
-                    <p className={cx('byline-field-blocks-card-body', styles['card-body'])}>
-                      {b.helpText ?? b.label ?? b.blockType}
-                    </p>
-                  </Card.Content>
-                </Card>))}
-            </div>
-          </Modal.Content>
-        </Modal.Container>
-      </Modal>
-    </div>);
-};

package/dist/fields/checkbox/checkbox-field.jsx

@@ -1,24 +0,0 @@
-/**
- * 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 { Checkbox } from '@byline/ui/react';
-import { useFieldError, useFieldValue } from '../../forms/form-context';
-import styles from './checkbox-field.module.css';
-export const CheckboxField = ({ field, value, defaultValue, onChange, id, path, }) => {
-    const fieldPath = path ?? field.name;
-    const fieldError = useFieldError(fieldPath);
-    const fieldValue = useFieldValue(fieldPath);
-    const checked = value ?? fieldValue ?? defaultValue ?? false;
-    return (<div className={`byline-field-checkbox ${field.name} ${styles['field-checkbox']}`}>
-      <Checkbox id={id ?? fieldPath} name={field.name} label={field.label} checked={checked} size="sm" helpText={field.helpText} 
-    // TODO: Handle indeterminate state
-    onCheckedChange={(value) => {
-            const next = value === 'indeterminate' ? false : Boolean(value);
-            onChange?.(next);
-        }} error={fieldError != null} errorText={fieldError}/>
-    </div>);
-};