@phis/ui 0.2.0 → 0.3.0

package/components/controls/phi-tour-control.js

@@ -0,0 +1,29 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useMemo } from "react";
+import { Tour } from "antd";
+function prefersReducedMotion() {
+    return typeof window !== "undefined" && window.matchMedia?.("(prefers-reduced-motion: reduce)").matches === true;
+}
+/**
+ * A guided Tour's presentation, and the only place Ant Design `Tour` is used.
+ *
+ * It holds no workflow. Which step is current, whether the Tour is open, what was completed or dismissed
+ * and whether a target is ready are the owning Controller's; this draws what it is given and reports what
+ * the viewer did. Nothing here resolves an address, navigates or writes progress.
+ *
+ * Every button label is passed in, because Ant Design's own "Next", "Previous" and "Finish" come from its
+ * locale bundle -- a second translation source the Site's label sets cannot reach.
+ */
+export function PhiTourControl({ open, current, steps, labels, mask = true, disabledInteraction = false, onStepChange, onClose, onFinish, }) {
+    const tourSteps = useMemo(() => steps.map((step, index) => ({
+        title: step.title,
+        description: step.description,
+        // Ant Design types the getter as one that always finds its element; a target can leave mid-step.
+        target: (step.target ?? null),
+        placement: step.target ? step.placement : undefined,
+        prevButtonProps: { children: labels.previous },
+        nextButtonProps: { children: index === steps.length - 1 ? labels.finish : labels.next },
+    })), [labels.finish, labels.next, labels.previous, steps]);
+    return (_jsx(Tour, { open: open && steps.length > 0, current: current, steps: tourSteps, mask: mask, disabledInteraction: disabledInteraction, keyboard: true, scrollIntoViewOptions: { block: "center", behavior: prefersReducedMotion() ? "auto" : "smooth" }, onChange: onStepChange, onClose: onClose, onFinish: onFinish }));
+}

package/components/controls/phi-tree-control.js

@@ -1,6 +1,5 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { HolderOutlined } from "@ant-design/icons";
 import { Button, Flex, Tree, Typography, theme as antdTheme } from "antd";
 import { useMemo, useState } from "react";
 import { readPhiTreeNodePath } from "../../types/tree-widget";
@@ -130,12 +129,14 @@ export function PhiTreeControl({ nodes, nodeIdentityPath, parentNodeIdentityPath
             borderRadius: presentation.bordered ? 0 : undefined,
             "--phi-tree-striped-row-background": token.colorFillAlter,
             "--phi-tree-drag-handle-color": token.colorText,
-        }, blockNode: presentation.blockNode !== false, checkable: checking, checkStrictly: checkStrictly, checkedKeys: [...checkedNodeIdentities], disabled: disabled, draggable: draggable ? { icon: _jsx(HolderOutlined, {}), nodeDraggable: () => true } : false, expandedKeys: [...expandedNodeIdentities], multiple: selectionMode === "multiple", selectable: selectionMode !== "none", selectedKeys: [...selectedNodeIdentities], showIcon: false, showLine: presentation.showLine, switcherIcon: (node) => node.isLeaf ? null : _jsx(PhiExpandIndicator, { expanded: Boolean(node.expanded) }), virtual: presentation.virtual, allowDrop: () => Boolean(onDrop), treeData: renderedTreeData, titleRender: (node) => (_jsx(PhiTreeNodeTitle, { node: node, presentation: presentation, editing: editing, actions: nodeActions, controlSize: controlSize, onCommitField: onCommitField, onAction: onAction, onExternalDragOver: onExternalDragOver, onExternalDrop: onExternalDrop }, `${String(node.identity)}:${String(readPath(node.record, presentation.node.titleFieldKey) ?? "")}`)), onSelect: (keys) => onSelectionChange?.(keys), onCheck: (keys) => onCheckingChange?.((Array.isArray(keys) ? keys : keys.checked)), onExpand: (keys) => onExpansionChange?.(keys), onDragStart: (info) => onDragStart?.(readEventNode(info.node).identity, info.event), onDragEnd: (info) => onDragEnd?.(readEventNode(info.node).identity, info.event), onDrop: (info) => {
+        }, blockNode: presentation.blockNode !== false, checkable: checking, checkStrictly: checkStrictly, checkedKeys: [...checkedNodeIdentities], disabled: disabled, draggable: draggable ? { icon: _jsx(PhiIcon, { name: "holder", size: "inherit" }), nodeDraggable: () => true } : false, expandedKeys: [...expandedNodeIdentities], multiple: selectionMode === "multiple", selectable: selectionMode !== "none", selectedKeys: [...selectedNodeIdentities], showIcon: false, showLine: presentation.showLine, switcherIcon: (node) => node.isLeaf ? null : _jsx(PhiExpandIndicator, { expanded: Boolean(node.expanded) }), virtual: presentation.virtual, allowDrop: () => Boolean(onDrop), treeData: renderedTreeData, titleRender: (node) => (_jsx(PhiTreeNodeTitle, { node: node, presentation: presentation, editing: editing, actions: nodeActions, controlSize: controlSize, onCommitField: onCommitField, onAction: onAction, onExternalDragOver: onExternalDragOver, onExternalDrop: onExternalDrop }, `${String(node.identity)}:${String(readPath(node.record, presentation.node.titleFieldKey) ?? "")}`)), onSelect: (keys) => onSelectionChange?.(keys), onCheck: (keys) => onCheckingChange?.((Array.isArray(keys) ? keys : keys.checked)), onExpand: (keys) => onExpansionChange?.(keys), onDragStart: (info) => onDragStart?.(readEventNode(info.node).identity, info.event), onDragEnd: (info) => onDragEnd?.(readEventNode(info.node).identity, info.event), onDrop: (info) => {
             if (!onDrop)
                 return;
             const moved = readEventNode(info.dragNode);
             const target = readEventNode(info.node);
-            const siblings = nodes.filter((node) => String(readIdentity(readPath(node, parentNodeIdentityPath))) === String(target.parentIdentity));
+            // The moved node leaves its place first, so it is neither its own neighbour nor counted between them.
+            const siblings = nodes.filter((node) => String(readIdentity(readPath(node, parentNodeIdentityPath))) === String(target.parentIdentity)
+                && String(readIdentity(readPath(node, nodeIdentityPath))) !== String(moved.identity));
             const targetIndex = siblings.findIndex((node) => String(readIdentity(readPath(node, nodeIdentityPath))) === String(target.identity));
             const dropAsChild = !info.dropToGap;
             const insertAfter = info.dropPosition > Number(String(info.node.pos).split("-").at(-1));

package/components/controls/phi-tree-select-control.js

@@ -3,7 +3,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { useMemo } from "react";
 import { TreeSelect } from "antd";
 import { PhiControlOptionContent } from "./phi-control-option-content";
-import { PhiLabeledControl } from "./phi-labeled-control";
+import { PhiLabeledControl, usePhiControlLabel } from "./phi-labeled-control";
 function buildPhiTreeSelectNodes(options) {
     return options.map((option) => ({
         value: option.value,
@@ -11,7 +11,8 @@ function buildPhiTreeSelectNodes(options) {
                 value: option.value,
                 label: option.label,
                 ...(option.description ? { description: option.description } : {}),
-            }, presentation: "dropdown" })),
+            }, presentation: "tree" })),
+        label: _jsx(PhiControlOptionContent, { option: { value: option.value, label: option.label }, presentation: "selection" }),
         searchLabel: `${option.label} ${option.description ?? ""}`.trim(),
         ...(option.disabled ? { disabled: true } : {}),
         ...(option.children?.length ? { children: buildPhiTreeSelectNodes(option.children) } : {}),
@@ -54,10 +55,16 @@ function collectPhiTreeSelectExpandedValues(options, depth, collected = []) {
  * node stands for travels in `meta` and comes back untouched.
  */
 export function PhiTreeSelectControl({ value, options, label, description, ariaLabel, placeholder, disabled, readOnly, allowClear, size, variant, defaultExpandedDepth = "all", popupMatchSelectWidth = false, getPopupContainer, popupRootClassName, popupZIndex, style, onOpenChange, onChange, }) {
+    const { labelId, labelledBy } = usePhiControlLabel(label, ariaLabel);
     const treeData = useMemo(() => buildPhiTreeSelectNodes(options), [options]);
     const optionsByValue = useMemo(() => indexPhiTreeOptions(options, new Map()), [options]);
     const defaultExpandedKeys = useMemo(() => collectPhiTreeSelectExpandedValues(options, defaultExpandedDepth), [defaultExpandedDepth, options]);
-    const control = (_jsx(TreeSelect, { "aria-label": ariaLabel, value: value ?? undefined, treeData: treeData, placeholder: placeholder, disabled: disabled || readOnly, allowClear: allowClear, size: size, variant: variant, treeDefaultExpandedKeys: defaultExpandedKeys, popupMatchSelectWidth: popupMatchSelectWidth, getPopupContainer: getPopupContainer, classNames: popupRootClassName ? { popup: { root: popupRootClassName } } : undefined, styles: popupZIndex == null ? undefined : { popup: { root: { zIndex: popupZIndex } } }, showSearch: true, 
+    const control = (_jsx(TreeSelect, { "aria-label": ariaLabel, "aria-labelledby": labelledBy, value: value ?? undefined, treeData: treeData, placeholder: placeholder, disabled: disabled || readOnly, allowClear: allowClear, size: size, variant: variant, treeDefaultExpandedKeys: defaultExpandedKeys, popupMatchSelectWidth: popupMatchSelectWidth, getPopupContainer: getPopupContainer, classNames: popupRootClassName ? { popup: { root: popupRootClassName } } : undefined, styles: popupZIndex == null ? undefined : { popup: { root: { zIndex: popupZIndex } } }, showSearch: true, 
+        /*
+         * The closed Control shows `label`, not the row's `title`: a row is built for the open tree, and
+         * standing in the selector it shrank the Control to the row's height the moment a node was chosen.
+         */
+        treeNodeLabelProp: "label", 
         /*
          * Stated rather than left to `treeNodeFilterProp`, because the title is a rendered option and not a
          * string: the primitive would search the React element and match nothing.
@@ -65,5 +72,5 @@ export function PhiTreeSelectControl({ value, options, label, description, ariaL
         filterTreeNode: (input, node) => String(node.searchLabel ?? "")
             .toLowerCase()
             .includes(input.toLowerCase()), onOpenChange: onOpenChange, onChange: (nextValue) => onChange(nextValue ?? null, optionsByValue.get(nextValue) ?? null), style: style }));
-    return (_jsx(PhiLabeledControl, { label: label, description: description, fill: style?.width === "100%", children: control }));
+    return (_jsx(PhiLabeledControl, { label: label, labelId: labelId, description: description, fill: style?.width === "100%", children: control }));
 }

package/components/controls/phi-video-embed-control.js

@@ -1,6 +1,5 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { PlayCircleFilled } from "@ant-design/icons";
 import NextImage from "next/image";
 import { useEffect, useState } from "react";
 import { usePhiConfig } from "../root/phi-config-provider";
@@ -8,6 +7,7 @@ import { grantPhiVideoVisitConsent, revokePhiVideoVisitConsent, seedPhiVideoVisi
 import { PhiButtonControl } from "./phi-button-control";
 import { PhiFlexControl } from "./phi-flex-control";
 import { PhiTypographyControl } from "./phi-typography-control";
+import { PhiIcon } from "../shell/phi-icon";
 /**
  * A video from somewhere else, and the request that fetches it.
  *
@@ -80,7 +80,7 @@ export function PhiVideoEmbedControl({ embedUrl, providerKey, title, recipient,
                     background: poster ? token.colorBgMask : "transparent",
                 }, children: [_jsx(PhiTypographyControl, { strong: true, style: { color: poster ? token.colorTextLightSolid : token.colorText }, children: title }), _jsxs(PhiFlexControl, { align: "center", justify: "center", gap: token.paddingXS, wrap: true, children: [_jsx(PhiButtonControl, { type: "primary", 
                                 // Over a poster a filled button states a second background nobody asked for.
-                                ghost: Boolean(poster), icon: _jsx(PlayCircleFilled, {}), label: labels.loadLabel, onClick: () => setPressed(true) }), _jsx(PhiButtonControl, { type: "link", label: labels.loadVisitLabel, onClick: () => grantPhiVideoVisitConsent(providerKey) })] }), _jsxs(PhiTypographyControl, { style: {
+                                ghost: Boolean(poster), icon: _jsx(PhiIcon, { name: "play-circle-filled", size: "inherit" }), label: labels.loadLabel, onClick: () => setPressed(true) }), _jsx(PhiButtonControl, { type: "link", label: labels.loadVisitLabel, onClick: () => grantPhiVideoVisitConsent(providerKey) })] }), _jsxs(PhiTypographyControl, { style: {
                             color: poster ? token.colorTextLightSolid : token.colorTextSecondary,
                             fontSize: token.fontSizeSM,
                         }, children: [labels.noticeText.replace("%1", recipient), " ", _jsx(PhiTypographyControl, { presentation: "link", href: privacyUrl, target: "_blank", rel: "noreferrer noopener", style: { fontSize: token.fontSizeSM }, children: labels.privacyLabel })] })] })] }));

package/components/forms/auth-admin-settings-labels.d.ts

@@ -62,6 +62,7 @@ export declare function getPhiAuthAdminSettingsLabels(options: PhiGlobalTranslat
         installationKey: string;
         installationKeyHint: string;
         installationKeyInvalid: string;
+        installationKeyRequired: string;
         provider: string;
         tenantHint: string;
         callbackOrigin: string;
@@ -83,6 +84,7 @@ export declare function getPhiAuthAdminSettingsLabels(options: PhiGlobalTranslat
     };
     providers: {
         clientId: string;
+        clientIdRequired: string;
         tenant: string;
         tenantPlaceholder: string;
         clientSecret: string;

package/components/forms/auth-admin-settings-labels.js

@@ -70,6 +70,8 @@ const PHI_AUTH_ADMIN_SETTINGS_LABEL_SET = definePhiLabelSet({
         installation_key_label: "Installation key",
         installation_key_hint: definePhiMessageLabel("Stable lowercase slug, unique per site (for example google-workspace)."),
         installation_key_invalid: definePhiMessageLabel("Use a lowercase slug of letters, digits, and dashes."),
+        installation_key_required: definePhiMessageLabel("Installation key is required."),
+        provider_client_id_required: definePhiMessageLabel("Client ID is required."),
         installation_provider_label: "Provider",
         installation_tenant_hint: definePhiMessageLabel("Microsoft only: common, organizations, consumers, or a tenant UUID."),
         installation_callback_origin_label: "Callback origin",
@@ -143,6 +145,7 @@ export async function getPhiAuthAdminSettingsLabels(options) {
             installationKey: labels.installation_key_label,
             installationKeyHint: labels.installation_key_hint,
             installationKeyInvalid: labels.installation_key_invalid,
+            installationKeyRequired: labels.installation_key_required,
             provider: labels.installation_provider_label,
             tenantHint: labels.installation_tenant_hint,
             callbackOrigin: labels.installation_callback_origin_label,
@@ -164,6 +167,7 @@ export async function getPhiAuthAdminSettingsLabels(options) {
         },
         providers: {
             clientId: labels.provider_client_id_label,
+            clientIdRequired: labels.provider_client_id_required,
             tenant: labels.provider_tenant_label,
             tenantPlaceholder: labels.provider_tenant_placeholder,
             clientSecret: labels.provider_client_secret_label,

package/components/forms/choice-form-field-controls.js

@@ -10,6 +10,6 @@ import { PhiSelectControl } from "../controls/phi-select-control";
  * first is the sign-in, which has none: the Select alone brought the select and virtual-list code to
  * every Landing that offers a login. A form with a choice field pays one chunk when it renders.
  */
-export const PhiSelectFormControl = ({ id, value, onChange, options, placeholder, disabled, readOnly, onSearch, filterOptionsLocally, }) => (_jsx(PhiSelectControl, { id: id, value: typeof value === "string" ? value : undefined, placeholder: placeholder, disabled: disabled, readOnly: readOnly, options: options ?? [], onSearch: onSearch, filterOptionsLocally: filterOptionsLocally, onChange: (nextValue) => onChange?.(nextValue), style: { width: "100%" } }));
-export const PhiMultiSelectFormControl = ({ id, value, onChange, options, placeholder, disabled, readOnly, }) => (_jsx(PhiMultiSelectControl, { id: id, value: Array.isArray(value) ? value.map(String) : [], placeholder: placeholder, disabled: disabled, readOnly: readOnly, options: options ?? [], style: { width: "100%" }, onChange: (nextValue) => onChange?.(nextValue) }));
+export const PhiSelectFormControl = ({ id, field, value, onChange, options, placeholder, disabled, readOnly, onSearch, filterOptionsLocally, }) => (_jsx(PhiSelectControl, { id: id, value: typeof value === "string" ? value : undefined, placeholder: placeholder, allowClear: field.config?.allowClear === true, disabled: disabled, readOnly: readOnly, options: options ?? [], onSearch: onSearch, filterOptionsLocally: filterOptionsLocally, onChange: (nextValue) => onChange?.(nextValue), style: { width: "100%" } }));
+export const PhiMultiSelectFormControl = ({ id, field, value, onChange, options, placeholder, disabled, readOnly, }) => (_jsx(PhiMultiSelectControl, { id: id, value: Array.isArray(value) ? value.map(String) : [], placeholder: placeholder, allowCustom: field.config?.allowCustom === true, disabled: disabled, readOnly: readOnly, options: options ?? [], style: { width: "100%" }, onChange: (nextValue) => onChange?.(nextValue) }));
 export const PhiSegmentedFormControl = ({ value, onChange, options, disabled, readOnly, }) => (_jsx(PhiSegmentedControl, { value: typeof value === "string" ? value : undefined, disabled: disabled, readOnly: readOnly, options: options ?? [], block: true, onChange: (nextValue) => onChange?.(nextValue) }));

package/components/forms/compound-form-controls.js

@@ -1,16 +1,18 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { isPhiRecord } from "../../helpers/is-record";
 import { useMemo, useRef, useState } from "react";
-import { DeleteOutlined, PlusOutlined } from "@ant-design/icons";
 import { PhiTableControl, } from "../controls/phi-table-control";
 import { PhiTreeControl } from "../controls/phi-tree-control";
 import { PhiButtonControl } from "../controls/phi-button-control";
 import { PhiCollectionHeaderControl } from "../controls/phi-collection-header-control";
 import { PhiToolbarControl } from "../controls/phi-toolbar-control";
 import { readPhiDotPath as readPath } from "../../helpers/dot-path";
+import { movePhiTableBindingRows } from "../../helpers/table-binding";
+import { PhiIcon } from "../shell/phi-icon";
 function readRecords(value) {
     return Array.isArray(value)
-        ? value.filter((entry) => Boolean(entry) && typeof entry === "object" && !Array.isArray(entry)).map((entry) => ({ ...entry }))
+        ? value.filter((entry) => isPhiRecord(entry)).map((entry) => ({ ...entry }))
         : [];
 }
 function setPath(record, path, value) {
@@ -21,7 +23,7 @@ function setPath(record, path, value) {
     let cursor = next;
     for (const segment of segments.slice(0, -1)) {
         const child = cursor[segment];
-        const cloned = child && typeof child === "object" && !Array.isArray(child) ? { ...child } : {};
+        const cloned = isPhiRecord(child) ? { ...child } : {};
         cursor[segment] = cloned;
         cursor = cloned;
     }
@@ -32,7 +34,7 @@ function readControlOptions(value) {
     if (!Array.isArray(value))
         return undefined;
     const options = value.flatMap((entry) => {
-        if (!entry || typeof entry !== "object" || Array.isArray(entry))
+        if (!isPhiRecord(entry))
             return [];
         const option = entry;
         if (typeof option.value !== "string" && typeof option.value !== "number")
@@ -47,7 +49,7 @@ function readControlOptions(value) {
     return options.length === 0 ? undefined : options;
 }
 function readTableCellEditor(value) {
-    if (!value || typeof value !== "object" || Array.isArray(value))
+    if (!isPhiRecord(value))
         return undefined;
     const editor = value;
     const type = editor.type;
@@ -61,7 +63,7 @@ function readTableCellEditor(value) {
         type !== "date" &&
         type !== "datetime")
         return undefined;
-    const constraints = editor.constraints && typeof editor.constraints === "object" && !Array.isArray(editor.constraints)
+    const constraints = isPhiRecord(editor.constraints)
         ? editor.constraints
         : null;
     return {
@@ -94,19 +96,18 @@ function readTableCellEditor(value) {
 }
 function applyMove(rows, identityPath, parentPath, move) {
     const movedIdentity = "movedRowIdentity" in move ? move.movedRowIdentity : move.movedNodeIdentity;
-    const movedIndex = rows.findIndex((row) => String(readPath(row, identityPath)) === String(movedIdentity));
-    if (movedIndex < 0)
-        return rows;
-    const [moved] = rows.splice(movedIndex, 1);
     const parentIdentity = "targetParentRowIdentity" in move ? move.targetParentRowIdentity : move.targetParentNodeIdentity;
-    const beforeIdentity = "beforeRowIdentity" in move ? move.beforeRowIdentity : move.beforeNodeIdentity;
-    const afterIdentity = "afterRowIdentity" in move ? move.afterRowIdentity : move.afterNodeIdentity;
-    const nextMoved = parentPath ? setPath(moved, parentPath, parentIdentity) : moved;
-    const anchorIdentity = beforeIdentity ?? afterIdentity;
-    const anchorIndex = anchorIdentity == null ? -1 : rows.findIndex((row) => String(readPath(row, identityPath)) === String(anchorIdentity));
-    const insertionIndex = anchorIndex < 0 ? rows.length : anchorIndex + (afterIdentity == null ? 0 : 1);
-    rows.splice(insertionIndex, 0, nextMoved);
-    return rows;
+    // One placement rule for Tables and Trees: the row before which it lands wins, else just after the other.
+    const moved = movePhiTableBindingRows(rows, identityPath, {
+        movedRowIdentity: movedIdentity,
+        beforeRowIdentity: "beforeRowIdentity" in move ? move.beforeRowIdentity : move.beforeNodeIdentity,
+        afterRowIdentity: "afterRowIdentity" in move ? move.afterRowIdentity : move.afterNodeIdentity,
+    });
+    if (!parentPath)
+        return moved;
+    return moved.map((row) => String(readPath(row, identityPath)) === String(movedIdentity)
+        ? setPath(row, parentPath, parentIdentity)
+        : row);
 }
 export function PhiCompoundTableFormControl({ field, label, description, value, onChange, disabled, readOnly, formContext, }) {
     const rows = useMemo(() => readRecords(value), [value]);
@@ -114,25 +115,25 @@ export function PhiCompoundTableFormControl({ field, label, description, value,
     const config = field.config ?? {};
     const identityPath = typeof config.rowIdentityPath === "string" ? config.rowIdentityPath : "id";
     const locked = disabled === true || readOnly === true;
-    const addConfig = config.add && typeof config.add === "object" && !Array.isArray(config.add)
+    const addConfig = isPhiRecord(config.add)
         ? config.add
         : null;
-    const removeConfig = config.remove && typeof config.remove === "object" && !Array.isArray(config.remove)
+    const removeConfig = isPhiRecord(config.remove)
         ? config.remove
         : null;
     const addEnabled = addConfig?.enabled === true;
     const removeEnabled = removeConfig?.enabled === true;
     const addLabel = typeof addConfig?.label === "string" ? addConfig.label : "Add";
     const removeLabel = typeof removeConfig?.label === "string" ? removeConfig.label : "Remove";
-    const addSourceFields = addConfig?.sourceFields && typeof addConfig.sourceFields === "object" && !Array.isArray(addConfig.sourceFields)
+    const addSourceFields = isPhiRecord(addConfig?.sourceFields)
         ? addConfig.sourceFields
         : null;
-    const addResetFields = addConfig?.resetFields && typeof addConfig.resetFields === "object" && !Array.isArray(addConfig.resetFields)
+    const addResetFields = isPhiRecord(addConfig?.resetFields)
         ? addConfig.resetFields
         : null;
     const rawColumns = useMemo(() => Array.isArray(config.columns) ? config.columns : [], [config.columns]);
     const columns = useMemo(() => rawColumns.flatMap((entry) => {
-        if (!entry || typeof entry !== "object" || Array.isArray(entry))
+        if (!isPhiRecord(entry))
             return [];
         const column = entry;
         const key = typeof column.key === "string" ? column.key : "";
@@ -162,13 +163,13 @@ export function PhiCompoundTableFormControl({ field, label, description, value,
         fieldPath: identityPath,
         fixed: "right",
         sizing: { mode: "content" },
-        render: (identity) => (_jsx(PhiButtonControl, { ariaLabel: removeLabel, tooltip: removeLabel, icon: _jsx(DeleteOutlined, {}), type: "text", danger: true, size: "small", disabled: locked, onClick: () => onChange?.(rows.filter((row) => String(readPath(row, identityPath)) !== String(identity))) })),
+        render: (identity) => (_jsx(PhiButtonControl, { ariaLabel: removeLabel, tooltip: removeLabel, icon: _jsx(PhiIcon, { name: "delete", size: "inherit" }), type: "text", danger: true, size: "small", disabled: locked, onClick: () => onChange?.(rows.filter((row) => String(readPath(row, identityPath)) !== String(identity))) })),
     } : null, [identityPath, locked, onChange, removeEnabled, removeLabel, rows]);
     const renderedColumns = actionColumn == null ? columns : [...columns, actionColumn];
     const columnOrder = renderedColumns.map((column) => column.key);
     const layout = (config.layout && typeof config.layout === "object" ? config.layout : { mode: "auto", overflowX: "auto" });
     const appendRow = () => {
-        let defaultRow = addConfig?.defaultRow && typeof addConfig.defaultRow === "object" && !Array.isArray(addConfig.defaultRow)
+        let defaultRow = isPhiRecord(addConfig?.defaultRow)
             ? { ...addConfig.defaultRow }
             : {};
         const formValues = formContext?.getValues() ?? {};
@@ -190,12 +191,12 @@ export function PhiCompoundTableFormControl({ field, label, description, value,
                             label: addLabel,
                             ariaLabel: addLabel,
                             tooltip: addLabel,
-                            icon: _jsx(PlusOutlined, {}),
+                            icon: _jsx(PhiIcon, { name: "plus", size: "inherit" }),
                             type: "primary",
                         }], compact: true, showLabels: true, size: "small", disabled: locked, onActivate: (key) => { if (key === "add")
                         appendRow(); } })) : null }), _jsx(PhiTableControl, { rows: rows, rowIdentityPath: identityPath, columns: renderedColumns, columnOrder: columnOrder, sortingMode: "none", sorts: [], bordered: config.bordered === true, striped: config.striped === true, size: "small", emptyText: typeof config.emptyText === "string" ? config.emptyText : undefined, layout: layout, rowReordering: config.reorder === true && !locked ? {
                     enabled: true,
-                    onMove: (move) => onChange?.(applyMove([...rows], identityPath, typeof config.parentRowIdentityPath === "string" ? config.parentRowIdentityPath : null, move)),
+                    onMove: (move) => onChange?.(applyMove(rows, identityPath, typeof config.parentRowIdentityPath === "string" ? config.parentRowIdentityPath : null, move)),
                 } : undefined })] }));
 }
 export function PhiCompoundTreeFormControl({ field, label, description, value, onChange, disabled, readOnly }) {
@@ -210,5 +211,5 @@ export function PhiCompoundTreeFormControl({ field, label, description, value, o
         blockNode: true,
         node: { titleFieldKey: typeof config.titleFieldKey === "string" ? config.titleFieldKey : "title" },
     });
-    return (_jsxs("div", { "data-phi-form-keyboard-scope": true, style: { display: "grid", gap: "var(--ant-padding-sm)", minWidth: 0, width: "100%" }, children: [_jsx(PhiCollectionHeaderControl, { title: label, description: description }), _jsx(PhiTreeControl, { nodes: nodes, nodeIdentityPath: identityPath, parentNodeIdentityPath: parentPath, presentation: presentation, disabled: disabled || readOnly, selectedNodeIdentities: selected, checkedNodeIdentities: checked, expandedNodeIdentities: expanded, selectionMode: config.selectionMode === "multiple" ? "multiple" : config.selectionMode === "none" ? "none" : "single", checking: config.checking === true, editing: config.editing === true && !disabled && !readOnly, draggable: config.reorder === true && !disabled && !readOnly, onSelectionChange: setSelected, onCheckingChange: setChecked, onExpansionChange: setExpanded, onCommitField: (identity, fieldKey, proposed) => onChange?.(nodes.map((node) => String(readPath(node, identityPath)) === String(identity) ? setPath(node, fieldKey, proposed) : node)), onDrop: (move) => onChange?.(applyMove([...nodes], identityPath, parentPath, move)) })] }));
+    return (_jsxs("div", { "data-phi-form-keyboard-scope": true, style: { display: "grid", gap: "var(--ant-padding-sm)", minWidth: 0, width: "100%" }, children: [_jsx(PhiCollectionHeaderControl, { title: label, description: description }), _jsx(PhiTreeControl, { nodes: nodes, nodeIdentityPath: identityPath, parentNodeIdentityPath: parentPath, presentation: presentation, disabled: disabled || readOnly, selectedNodeIdentities: selected, checkedNodeIdentities: checked, expandedNodeIdentities: expanded, selectionMode: config.selectionMode === "multiple" ? "multiple" : config.selectionMode === "none" ? "none" : "single", checking: config.checking === true, editing: config.editing === true && !disabled && !readOnly, draggable: config.reorder === true && !disabled && !readOnly, onSelectionChange: setSelected, onCheckingChange: setChecked, onExpansionChange: setExpanded, onCommitField: (identity, fieldKey, proposed) => onChange?.(nodes.map((node) => String(readPath(node, identityPath)) === String(identity) ? setPath(node, fieldKey, proposed) : node)), onDrop: (move) => onChange?.(applyMove(nodes, identityPath, parentPath, move)) })] }));
 }

package/components/forms/content-entry-curation-config.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Where the page that places the curation Form names the two empty choices -- "Nobody", "None" -- in its
+ * language.
+ *
+ * The options come from a Client Provider, which has no Label Set; the placement does, and the Provider
+ * reads its config (`site-locales-config.ts` hands the languages over the same way). One constant for both
+ * sides, because a key spelled twice is a choice that is silently unlabelled on one of them.
+ */
+export declare const PHI_CONTENT_ENTRY_CURATION_NONE_CONFIG_KEYS: {
+    readonly author: "authorNoneLabel";
+    readonly category: "categoryNoneLabel";
+};

package/components/forms/content-entry-curation-config.js

@@ -0,0 +1,12 @@
+/**
+ * Where the page that places the curation Form names the two empty choices -- "Nobody", "None" -- in its
+ * language.
+ *
+ * The options come from a Client Provider, which has no Label Set; the placement does, and the Provider
+ * reads its config (`site-locales-config.ts` hands the languages over the same way). One constant for both
+ * sides, because a key spelled twice is a choice that is silently unlabelled on one of them.
+ */
+export const PHI_CONTENT_ENTRY_CURATION_NONE_CONFIG_KEYS = {
+    author: "authorNoneLabel",
+    category: "categoryNoneLabel",
+};

package/components/forms/content-entry-forms.d.ts

@@ -0,0 +1,52 @@
+import type { PhiFormId } from "../../types/form-id";
+import type { PhiRuntimeModuleId } from "../../types";
+import { type PhiContentEntryKind } from "../../constants/content-entry-kinds";
+/** Where the page that places the entry Form names the Site's source language, for the empty "Written in". */
+export declare const PHI_CONTENT_ENTRY_SOURCE_LOCALE_PLACEHOLDER_CONFIG_KEY = "sourceLocalePlaceholder";
+/**
+ * A kind's Forms and their handlers, owned by the kind's Module (`CONTENT_ENTRIES.md`).
+ *
+ * One Form per act, because the acts have different authorities. The entry states words: what it says,
+ * where it lives, which language it is written in. The publication states when it is seen. Curation states
+ * who it is by and what it is filed under, and a category is one entry of the Site's order. Core keeps
+ * them apart -- content editing for the first, publishing for the rest -- so one Form covering two would be
+ * reachable by whoever may do the lesser of them.
+ *
+ * Both relay through the Form gateway with the viewer's Site session, because both endpoints are guarded by
+ * a role. Neither takes a CSRF token of its own -- the gateway adds the internal one -- and neither has a
+ * second phase. The ids and handler keys are the Module's, so two kinds never share a Form.
+ */
+export declare function definePhiContentEntryForms({ kind, ownerModuleId, formIds, titles, }: {
+    kind: PhiContentEntryKind;
+    ownerModuleId: PhiRuntimeModuleId;
+    formIds: {
+        entry: PhiFormId;
+        publication: PhiFormId;
+        curation: PhiFormId;
+        category: PhiFormId;
+    };
+    /** How the Form catalogue names them: "News entry", "News publication", "News curation", "News category". */
+    titles: {
+        entry: string;
+        publication: string;
+        curation: string;
+        category: string;
+    };
+}): {
+    forms: import("./form-registry").PhiRuntimeModuleFormDefinition[];
+    handlers: {
+        key: `${string}/${string}`;
+        ownerModuleId: `${string}/${string}`;
+        title: string;
+        phase: "submit";
+        handlerKey: "news.entry" | "blog.entry" | "news.publication" | "blog.publication" | "news.curation" | "blog.curation" | "news.category" | "blog.category";
+        category: "forms";
+        transport: "relay";
+        method: "POST" | "PUT" | "PATCH";
+        endpointKey: null;
+        upstreamPath: string;
+        csrfPath: null;
+        requiresCsrf: false;
+        credentialPolicy: "site-session";
+    }[];
+};