@cratis/components 4.24.0 → 4.25.0

package/dist/esm/ConfigurationEditor/OrderedItemIconFieldProps.d.ts

@@ -0,0 +1,26 @@
+import type { ConfigurationIconReference } from './ConfigurationIconReference.js';
+import type { OrderedItem } from './OrderedItem.js';
+/**
+ * What the editor hands to `renderIconField`. The host renders its icon chooser with it and
+ * reports the choice through {@link OrderedItemIconFieldProps.onChange}; the editor turns that into
+ * a validated proposal, or ignores it when the field is not editable.
+ */
+export interface OrderedItemIconFieldProps<TItem extends OrderedItem = OrderedItem> {
+    /** The item being edited. */
+    item: TItem;
+    /** The item's current icon. */
+    value: ConfigurationIconReference | undefined;
+    /** Reports the icon the person picked. */
+    onChange: (icon: ConfigurationIconReference) => void;
+    /** Whether the person can change the icon. */
+    readOnly: boolean;
+    /** The accessible name of the field, including the item it belongs to. */
+    'aria-label': string;
+    /** The id of the element that describes the field, which holds its validation message. */
+    'aria-describedby'?: string;
+    /** Whether the field has a validation message. */
+    invalid: boolean;
+    /** The validation message, if any. */
+    validationMessage?: string;
+}
+//# sourceMappingURL=OrderedItemIconFieldProps.d.ts.map

package/dist/esm/ConfigurationEditor/OrderedItemIconFieldProps.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrderedItemIconFieldProps.d.ts","sourceRoot":"","sources":["../../../ConfigurationEditor/OrderedItemIconFieldProps.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,iCAA8B,CAAC;AAC/E,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAe,CAAC;AAEjD;;;;GAIG;AACH,MAAM,WAAW,yBAAyB,CAAC,KAAK,SAAS,WAAW,GAAG,WAAW;IAC9E,6BAA6B;IAC7B,IAAI,EAAE,KAAK,CAAC;IAEZ,+BAA+B;IAC/B,KAAK,EAAE,0BAA0B,GAAG,SAAS,CAAC;IAE9C,0CAA0C;IAC1C,QAAQ,EAAE,CAAC,IAAI,EAAE,0BAA0B,KAAK,IAAI,CAAC;IAErD,8CAA8C;IAC9C,QAAQ,EAAE,OAAO,CAAC;IAElB,0EAA0E;IAC1E,YAAY,EAAE,MAAM,CAAC;IAErB,0FAA0F;IAC1F,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAE5B,kDAAkD;IAClD,OAAO,EAAE,OAAO,CAAC;IAEjB,sCAAsC;IACtC,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC9B"}

package/dist/esm/ConfigurationEditor/OrderedItemIconFieldProps.js

@@ -0,0 +1,4 @@
+// Copyright (c) Cratis. All rights reserved.
+// Licensed under the MIT license. See LICENSE file in the project root for full license information.
+export {};
+//# sourceMappingURL=OrderedItemIconFieldProps.js.map

package/dist/esm/ConfigurationEditor/OrderedItemIconFieldProps.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrderedItemIconFieldProps.js","sourceRoot":"","sources":["../../../ConfigurationEditor/OrderedItemIconFieldProps.ts"],"names":[],"mappings":"AAAA,6CAA6C;AAC7C,qGAAqG","sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport type { ConfigurationIconReference } from './ConfigurationIconReference';\nimport type { OrderedItem } from './OrderedItem';\n\n/**\n * What the editor hands to `renderIconField`. The host renders its icon chooser with it and\n * reports the choice through {@link OrderedItemIconFieldProps.onChange}; the editor turns that into\n * a validated proposal, or ignores it when the field is not editable.\n */\nexport interface OrderedItemIconFieldProps<TItem extends OrderedItem = OrderedItem> {\n    /** The item being edited. */\n    item: TItem;\n\n    /** The item's current icon. */\n    value: ConfigurationIconReference | undefined;\n\n    /** Reports the icon the person picked. */\n    onChange: (icon: ConfigurationIconReference) => void;\n\n    /** Whether the person can change the icon. */\n    readOnly: boolean;\n\n    /** The accessible name of the field, including the item it belongs to. */\n    'aria-label': string;\n\n    /** The id of the element that describes the field, which holds its validation message. */\n    'aria-describedby'?: string;\n\n    /** Whether the field has a validation message. */\n    invalid: boolean;\n\n    /** The validation message, if any. */\n    validationMessage?: string;\n}\n"]}

package/dist/esm/ConfigurationEditor/OrderedItemLabels.d.ts

@@ -0,0 +1,47 @@
+/**
+ * Every visible and accessible string the {@link OrderedItemEditor} owns. Unset fields fall back to
+ * English. Functions receive the item's label so each control names the item it acts on.
+ */
+export interface OrderedItemLabels {
+    /** Heading of the fixed (inherited) items section. */
+    fixedItems?: string;
+    /** Heading of the configurable items section. */
+    localItems?: string;
+    /** Text shown on every locked item. */
+    locked?: string;
+    /** Shown when the configurable collection is empty. */
+    empty?: string;
+    /** The add action. */
+    add?: string;
+    /** Why the add action is unavailable once `maxItems` is reached. */
+    maxItemsReached?: string;
+    /** Accessible name of the label input. */
+    labelField?: string;
+    /** Accessible name of the icon field. */
+    iconField?: string;
+    /** Accessible name of the destination select. */
+    destinationField?: string;
+    /** Placeholder option of the destination select. */
+    noDestination?: string;
+    /** Shown instead of an icon that has none. */
+    noIcon?: string;
+    /** Shown for an icon the host's catalog can no longer supply. */
+    iconUnavailable?: string;
+    /** Shown for a destination the host no longer lists. */
+    destinationUnavailable?: string;
+    /** Message for a blank label. */
+    labelRequired?: string;
+    /** Accessible name of the remove action for an item. */
+    remove?: (itemLabel: string) => string;
+    /** Accessible name of the move-up action for an item. */
+    moveUp?: (itemLabel: string) => string;
+    /** Accessible name of the move-down action for an item. */
+    moveDown?: (itemLabel: string) => string;
+    /** Accessible name of the drag and keyboard handle of an item. */
+    handle?: (itemLabel: string) => string;
+    /** Name used for an item whose label is blank. */
+    untitled?: string;
+    /** Live announcement after an item moved. */
+    moved?: (itemLabel: string, position: number, total: number) => string;
+}
+//# sourceMappingURL=OrderedItemLabels.d.ts.map

package/dist/esm/ConfigurationEditor/OrderedItemLabels.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrderedItemLabels.d.ts","sourceRoot":"","sources":["../../../ConfigurationEditor/OrderedItemLabels.ts"],"names":[],"mappings":"AAGA;;;GAGG;AACH,MAAM,WAAW,iBAAiB;IAC9B,sDAAsD;IACtD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,iDAAiD;IACjD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,uCAAuC;IACvC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,uDAAuD;IACvD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,sBAAsB;IACtB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,oEAAoE;IACpE,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,0CAA0C;IAC1C,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,yCAAyC;IACzC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,iDAAiD;IACjD,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,oDAAoD;IACpD,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,8CAA8C;IAC9C,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,iEAAiE;IACjE,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,wDAAwD;IACxD,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,iCAAiC;IACjC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,wDAAwD;IACxD,MAAM,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,MAAM,CAAC;IACvC,yDAAyD;IACzD,MAAM,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,MAAM,CAAC;IACvC,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,MAAM,CAAC;IACzC,kEAAkE;IAClE,MAAM,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,MAAM,CAAC;IACvC,kDAAkD;IAClD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,6CAA6C;IAC7C,KAAK,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;CAC1E"}

package/dist/esm/ConfigurationEditor/OrderedItemLabels.js

@@ -0,0 +1,4 @@
+// Copyright (c) Cratis. All rights reserved.
+// Licensed under the MIT license. See LICENSE file in the project root for full license information.
+export {};
+//# sourceMappingURL=OrderedItemLabels.js.map

package/dist/esm/ConfigurationEditor/OrderedItemLabels.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrderedItemLabels.js","sourceRoot":"","sources":["../../../ConfigurationEditor/OrderedItemLabels.ts"],"names":[],"mappings":"AAAA,6CAA6C;AAC7C,qGAAqG","sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\n/**\n * Every visible and accessible string the {@link OrderedItemEditor} owns. Unset fields fall back to\n * English. Functions receive the item's label so each control names the item it acts on.\n */\nexport interface OrderedItemLabels {\n    /** Heading of the fixed (inherited) items section. */\n    fixedItems?: string;\n    /** Heading of the configurable items section. */\n    localItems?: string;\n    /** Text shown on every locked item. */\n    locked?: string;\n    /** Shown when the configurable collection is empty. */\n    empty?: string;\n    /** The add action. */\n    add?: string;\n    /** Why the add action is unavailable once `maxItems` is reached. */\n    maxItemsReached?: string;\n    /** Accessible name of the label input. */\n    labelField?: string;\n    /** Accessible name of the icon field. */\n    iconField?: string;\n    /** Accessible name of the destination select. */\n    destinationField?: string;\n    /** Placeholder option of the destination select. */\n    noDestination?: string;\n    /** Shown instead of an icon that has none. */\n    noIcon?: string;\n    /** Shown for an icon the host's catalog can no longer supply. */\n    iconUnavailable?: string;\n    /** Shown for a destination the host no longer lists. */\n    destinationUnavailable?: string;\n    /** Message for a blank label. */\n    labelRequired?: string;\n    /** Accessible name of the remove action for an item. */\n    remove?: (itemLabel: string) => string;\n    /** Accessible name of the move-up action for an item. */\n    moveUp?: (itemLabel: string) => string;\n    /** Accessible name of the move-down action for an item. */\n    moveDown?: (itemLabel: string) => string;\n    /** Accessible name of the drag and keyboard handle of an item. */\n    handle?: (itemLabel: string) => string;\n    /** Name used for an item whose label is blank. */\n    untitled?: string;\n    /** Live announcement after an item moved. */\n    moved?: (itemLabel: string, position: number, total: number) => string;\n}\n"]}

package/dist/esm/ConfigurationEditor/OrderedItemOperation.d.ts

@@ -0,0 +1,3 @@
+/** The collection operations an editor can offer. */
+export type OrderedItemOperation = 'add' | 'remove' | 'reorder';
+//# sourceMappingURL=OrderedItemOperation.d.ts.map

package/dist/esm/ConfigurationEditor/OrderedItemOperation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrderedItemOperation.d.ts","sourceRoot":"","sources":["../../../ConfigurationEditor/OrderedItemOperation.ts"],"names":[],"mappings":"AAGA,qDAAqD;AACrD,MAAM,MAAM,oBAAoB,GAAG,KAAK,GAAG,QAAQ,GAAG,SAAS,CAAC"}

package/dist/esm/ConfigurationEditor/OrderedItemOperation.js

@@ -0,0 +1,4 @@
+// Copyright (c) Cratis. All rights reserved.
+// Licensed under the MIT license. See LICENSE file in the project root for full license information.
+export {};
+//# sourceMappingURL=OrderedItemOperation.js.map

package/dist/esm/ConfigurationEditor/OrderedItemOperation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrderedItemOperation.js","sourceRoot":"","sources":["../../../ConfigurationEditor/OrderedItemOperation.ts"],"names":[],"mappings":"AAAA,6CAA6C;AAC7C,qGAAqG","sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\n/** The collection operations an editor can offer. */\nexport type OrderedItemOperation = 'add' | 'remove' | 'reorder';\n"]}

package/dist/esm/ConfigurationEditor/OrderedItemProposal.d.ts

@@ -0,0 +1,45 @@
+import type { OrderedItem } from './OrderedItem.js';
+import type { OrderedItemField } from './OrderedItemField.js';
+/**
+ * A change the person asked for, validated and permitted by the capabilities. The editor is
+ * controlled: nothing changes until the host applies the proposal by passing new `items`. Every
+ * proposal carries the `items` that would result, so accepting one is a single assignment.
+ */
+export type OrderedItemProposal<TItem extends OrderedItem = OrderedItem> = {
+    kind: 'add';
+    /** The item the host created. */
+    item: TItem;
+    /** Where the item would be inserted. */
+    index: number;
+    /** The collection after the change. */
+    items: ReadonlyArray<TItem>;
+} | {
+    kind: 'remove';
+    /** The item that would be removed. */
+    item: TItem;
+    /** Where the item was. */
+    index: number;
+    /** The collection after the change. */
+    items: ReadonlyArray<TItem>;
+} | {
+    kind: 'move';
+    /** The item that would move. */
+    item: TItem;
+    /** Where the item was. */
+    fromIndex: number;
+    /** Where the item would be. */
+    toIndex: number;
+    /** The collection after the change. */
+    items: ReadonlyArray<TItem>;
+} | {
+    kind: 'update';
+    /** The item as it would be after the change. */
+    item: TItem;
+    /** The item as it is now. */
+    previous: TItem;
+    /** The field that changed. */
+    field: OrderedItemField;
+    /** The collection after the change. */
+    items: ReadonlyArray<TItem>;
+};
+//# sourceMappingURL=OrderedItemProposal.d.ts.map

package/dist/esm/ConfigurationEditor/OrderedItemProposal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrderedItemProposal.d.ts","sourceRoot":"","sources":["../../../ConfigurationEditor/OrderedItemProposal.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAe,CAAC;AACjD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,uBAAoB,CAAC;AAE3D;;;;GAIG;AACH,MAAM,MAAM,mBAAmB,CAAC,KAAK,SAAS,WAAW,GAAG,WAAW,IACjE;IACI,IAAI,EAAE,KAAK,CAAC;IACZ,iCAAiC;IACjC,IAAI,EAAE,KAAK,CAAC;IACZ,wCAAwC;IACxC,KAAK,EAAE,MAAM,CAAC;IACd,uCAAuC;IACvC,KAAK,EAAE,aAAa,CAAC,KAAK,CAAC,CAAC;CAC/B,GACD;IACI,IAAI,EAAE,QAAQ,CAAC;IACf,sCAAsC;IACtC,IAAI,EAAE,KAAK,CAAC;IACZ,0BAA0B;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,uCAAuC;IACvC,KAAK,EAAE,aAAa,CAAC,KAAK,CAAC,CAAC;CAC/B,GACD;IACI,IAAI,EAAE,MAAM,CAAC;IACb,gCAAgC;IAChC,IAAI,EAAE,KAAK,CAAC;IACZ,0BAA0B;IAC1B,SAAS,EAAE,MAAM,CAAC;IAClB,+BAA+B;IAC/B,OAAO,EAAE,MAAM,CAAC;IAChB,uCAAuC;IACvC,KAAK,EAAE,aAAa,CAAC,KAAK,CAAC,CAAC;CAC/B,GACD;IACI,IAAI,EAAE,QAAQ,CAAC;IACf,gDAAgD;IAChD,IAAI,EAAE,KAAK,CAAC;IACZ,6BAA6B;IAC7B,QAAQ,EAAE,KAAK,CAAC;IAChB,8BAA8B;IAC9B,KAAK,EAAE,gBAAgB,CAAC;IACxB,uCAAuC;IACvC,KAAK,EAAE,aAAa,CAAC,KAAK,CAAC,CAAC;CAC/B,CAAC"}

package/dist/esm/ConfigurationEditor/OrderedItemProposal.js

@@ -0,0 +1,4 @@
+// Copyright (c) Cratis. All rights reserved.
+// Licensed under the MIT license. See LICENSE file in the project root for full license information.
+export {};
+//# sourceMappingURL=OrderedItemProposal.js.map

package/dist/esm/ConfigurationEditor/OrderedItemProposal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrderedItemProposal.js","sourceRoot":"","sources":["../../../ConfigurationEditor/OrderedItemProposal.ts"],"names":[],"mappings":"AAAA,6CAA6C;AAC7C,qGAAqG","sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport type { OrderedItem } from './OrderedItem';\nimport type { OrderedItemField } from './OrderedItemField';\n\n/**\n * A change the person asked for, validated and permitted by the capabilities. The editor is\n * controlled: nothing changes until the host applies the proposal by passing new `items`. Every\n * proposal carries the `items` that would result, so accepting one is a single assignment.\n */\nexport type OrderedItemProposal<TItem extends OrderedItem = OrderedItem> =\n    | {\n          kind: 'add';\n          /** The item the host created. */\n          item: TItem;\n          /** Where the item would be inserted. */\n          index: number;\n          /** The collection after the change. */\n          items: ReadonlyArray<TItem>;\n      }\n    | {\n          kind: 'remove';\n          /** The item that would be removed. */\n          item: TItem;\n          /** Where the item was. */\n          index: number;\n          /** The collection after the change. */\n          items: ReadonlyArray<TItem>;\n      }\n    | {\n          kind: 'move';\n          /** The item that would move. */\n          item: TItem;\n          /** Where the item was. */\n          fromIndex: number;\n          /** Where the item would be. */\n          toIndex: number;\n          /** The collection after the change. */\n          items: ReadonlyArray<TItem>;\n      }\n    | {\n          kind: 'update';\n          /** The item as it would be after the change. */\n          item: TItem;\n          /** The item as it is now. */\n          previous: TItem;\n          /** The field that changed. */\n          field: OrderedItemField;\n          /** The collection after the change. */\n          items: ReadonlyArray<TItem>;\n      };\n"]}

package/dist/esm/ConfigurationEditor/OrderedItemRow.d.ts

@@ -0,0 +1,5 @@
+import type { OrderedItem } from './OrderedItem.js';
+import type { OrderedItemRowProps } from './OrderedItemRowProps.js';
+/** One item of an {@link OrderedItemEditor}, either editable or locked. */
+export declare const OrderedItemRow: <TItem extends OrderedItem>({ item, index, count, locked, capabilities, labels, destinations, validation, baseId, parts, renderIconField, isIconAvailable, iconCatalog, allowedIcons, iconPickerLabels, dragging, dropPosition, onField, onFieldBlur, onMove, onRemove, onDragStart, onDragOver, onDrop, onDragEnd, }: OrderedItemRowProps<TItem>) => import("react").JSX.Element;
+//# sourceMappingURL=OrderedItemRow.d.ts.map

package/dist/esm/ConfigurationEditor/OrderedItemRow.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrderedItemRow.d.ts","sourceRoot":"","sources":["../../../ConfigurationEditor/OrderedItemRow.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAe,CAAC;AAEjD,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,0BAAuB,CAAC;AAMjE,2EAA2E;AAC3E,eAAO,MAAM,cAAc,GAAI,KAAK,SAAS,WAAW,6RA0BrD,mBAAmB,CAAC,KAAK,CAAC,gCA8L5B,CAAC"}

package/dist/esm/ConfigurationEditor/OrderedItemRow.js

@@ -0,0 +1,59 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useState, useEffect } from 'react';
+import { resolveOrderedItemFieldAccess } from './resolveOrderedItemFieldAccess.js';
+import { OrderedItemIconField } from './OrderedItemIconField.js';
+import { OrderedItemDestinationField } from './OrderedItemDestinationField.js';
+
+const joinClassNames = (...names) => names.filter(Boolean).join(' ');
+const OrderedItemRow = ({ item, index, count, locked, capabilities, labels, destinations, validation, baseId, parts, renderIconField, isIconAvailable, iconCatalog, allowedIcons, iconPickerLabels, dragging, dropPosition, onField, onFieldBlur, onMove, onRemove, onDragStart, onDragOver, onDrop, onDragEnd, }) => {
+    const [labelDraft, setLabelDraft] = useState(null);
+    const rowId = `${baseId}-${item.id.replace(/[^A-Za-z0-9_-]/gu, '_')}`;
+    const itemName = item.label.trim().length > 0 ? item.label : labels.untitled;
+    const labelAccess = resolveOrderedItemFieldAccess(capabilities, 'label');
+    const iconAccess = resolveOrderedItemFieldAccess(capabilities, 'icon');
+    const destinationAccess = resolveOrderedItemFieldAccess(capabilities, 'destination');
+    const canReorder = !locked && capabilities.reorder;
+    const canRemove = !locked && capabilities.remove;
+    const labelMessage = validation?.label;
+    const itemMessage = validation?.item;
+    const labelMessageId = `${rowId}-label-message`;
+    const itemMessageId = `${rowId}-item-message`;
+    const labelDescribedBy = [labelMessage ? labelMessageId : undefined, itemMessage ? itemMessageId : undefined]
+        .filter(Boolean)
+        .join(' ');
+    useEffect(() => {
+        setLabelDraft(null);
+    }, [item.label]);
+    const handleKeyDown = (event) => {
+        parts?.handle?.onKeyDown?.(event);
+        if (event.defaultPrevented)
+            return;
+        if (event.key === 'ArrowUp') {
+            event.preventDefault();
+            onMove(item, -1, 'handle');
+        }
+        else if (event.key === 'ArrowDown') {
+            event.preventDefault();
+            onMove(item, 1, 'handle');
+        }
+    };
+    return (jsxs("li", { ...parts?.item, id: rowId, tabIndex: -1, className: joinClassNames('cratis-ordered-item', parts?.item?.className), onDragOver: canReorder ? (event) => onDragOver(item, event) : undefined, onDrop: canReorder ? (event) => onDrop(item, event) : undefined, "data-cratis-part": 'item', "data-item-id": item.id, "data-locked": locked || undefined, "data-dragging": dragging || undefined, "data-drop-position": dropPosition, children: [canReorder && (jsxs("div", { className: 'cratis-ordered-item__reorder', children: [jsx("button", { ...parts?.handle, type: 'button', draggable: true, "aria-label": labels.handle(itemName), "aria-keyshortcuts": 'ArrowUp ArrowDown', onKeyDown: handleKeyDown, onDragStart: (event) => onDragStart(item, event), onDragEnd: onDragEnd, className: joinClassNames('cratis-ordered-item__button cratis-ordered-item__handle', parts?.handle?.className), "data-cratis-part": 'handle', "data-control": 'handle', children: jsx("span", { "aria-hidden": 'true', children: "\u283F" }) }), jsx("button", { ...parts?.moveUp, type: 'button', "aria-label": labels.moveUp(itemName), "aria-disabled": index === 0 || undefined, onClick: () => onMove(item, -1, 'moveUp'), className: joinClassNames('cratis-ordered-item__button', parts?.moveUp?.className), "data-cratis-part": 'moveUp', "data-control": 'moveUp', children: jsx("span", { "aria-hidden": 'true', children: "\u2191" }) }), jsx("button", { ...parts?.moveDown, type: 'button', "aria-label": labels.moveDown(itemName), "aria-disabled": index === count - 1 || undefined, onClick: () => onMove(item, 1, 'moveDown'), className: joinClassNames('cratis-ordered-item__button', parts?.moveDown?.className), "data-cratis-part": 'moveDown', "data-control": 'moveDown', children: jsx("span", { "aria-hidden": 'true', children: "\u2193" }) })] })), jsxs("div", { className: 'cratis-ordered-item__fields', children: [labelAccess === 'editable' && !locked && (jsx("input", { ...parts?.label, type: 'text', value: labelDraft ?? item.label, "aria-label": labels.labelField, "aria-invalid": labelMessage ? true : undefined, "aria-describedby": labelDescribedBy.length > 0 ? labelDescribedBy : undefined, onChange: (event) => {
+                            setLabelDraft(event.target.value);
+                            onField(item, 'label', event.target.value);
+                        }, onBlur: (event) => {
+                            parts?.label?.onBlur?.(event);
+                            setLabelDraft(null);
+                            onFieldBlur(item, 'label');
+                        }, onKeyDown: (event) => {
+                            parts?.label?.onKeyDown?.(event);
+                            if (event.key === 'Escape' && labelDraft !== null) {
+                                event.preventDefault();
+                                event.stopPropagation();
+                                setLabelDraft(null);
+                                onFieldBlur(item, 'label');
+                            }
+                        }, className: joinClassNames('cratis-ordered-item__input', parts?.label?.className), "data-cratis-part": 'label', "data-control": 'label', "data-invalid": labelMessage ? true : undefined })), (labelAccess === 'readonly' || (labelAccess === 'editable' && locked)) && (jsxs("span", { className: 'cratis-ordered-item__text', "data-control": 'label', children: [jsxs("span", { className: 'cratis-ordered-item__hidden', children: [labels.labelField, ": "] }), item.label] })), labelMessage && (jsx("p", { ...parts?.message, id: labelMessageId, role: 'alert', className: joinClassNames('cratis-ordered-item__message', parts?.message?.className), "data-cratis-part": 'message', "data-invalid": true, children: labelMessage })), iconAccess !== 'hidden' && (jsx(OrderedItemIconField, { item: item, editable: iconAccess === 'editable' && !locked, itemName: itemName, labels: labels, message: validation?.icon, messageId: `${rowId}-icon-message`, parts: parts, renderIconField: renderIconField, isIconAvailable: isIconAvailable, iconCatalog: iconCatalog, allowedIcons: allowedIcons, iconPickerLabels: iconPickerLabels, onChange: (icon) => onField(item, 'icon', icon) })), destinationAccess !== 'hidden' && (jsx(OrderedItemDestinationField, { item: item, editable: destinationAccess === 'editable' && !locked, itemName: itemName, labels: labels, destinations: destinations, message: validation?.destination, messageId: `${rowId}-destination-message`, parts: parts, onChange: (destination) => onField(item, 'destination', destination) })), itemMessage && (jsx("p", { ...parts?.message, id: itemMessageId, role: 'alert', className: joinClassNames('cratis-ordered-item__message', parts?.message?.className), "data-cratis-part": 'message', "data-invalid": true, children: itemMessage }))] }), locked && (jsx("span", { ...parts?.state, className: joinClassNames('cratis-ordered-item__state', parts?.state?.className), "data-cratis-part": 'state', children: labels.locked })), canRemove && (jsx("button", { ...parts?.remove, type: 'button', "aria-label": labels.remove(itemName), onClick: () => onRemove(item), className: joinClassNames('cratis-ordered-item__button cratis-ordered-item__remove', parts?.remove?.className), "data-cratis-part": 'remove', "data-control": 'remove', children: jsx("span", { "aria-hidden": 'true', children: "\u00D7" }) }))] }));
+};
+
+export { OrderedItemRow };
+//# sourceMappingURL=OrderedItemRow.js.map

package/dist/esm/ConfigurationEditor/OrderedItemRow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrderedItemRow.js","sources":["../../../ConfigurationEditor/OrderedItemRow.tsx"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { useEffect, useState, type KeyboardEvent } from 'react';\nimport type { OrderedItem } from './OrderedItem';\nimport { resolveOrderedItemFieldAccess } from './resolveOrderedItemFieldAccess';\nimport type { OrderedItemRowProps } from './OrderedItemRowProps';\nimport { OrderedItemIconField } from './OrderedItemIconField';\nimport { OrderedItemDestinationField } from './OrderedItemDestinationField';\n\nconst joinClassNames = (...names: Array<string | undefined>) => names.filter(Boolean).join(' ');\n\n/** One item of an {@link OrderedItemEditor}, either editable or locked. */\nexport const OrderedItemRow = <TItem extends OrderedItem>({\n    item,\n    index,\n    count,\n    locked,\n    capabilities,\n    labels,\n    destinations,\n    validation,\n    baseId,\n    parts,\n    renderIconField,\n    isIconAvailable,\n    iconCatalog,\n    allowedIcons,\n    iconPickerLabels,\n    dragging,\n    dropPosition,\n    onField,\n    onFieldBlur,\n    onMove,\n    onRemove,\n    onDragStart,\n    onDragOver,\n    onDrop,\n    onDragEnd,\n}: OrderedItemRowProps<TItem>) => {\n    const [labelDraft, setLabelDraft] = useState<string | null>(null);\n    const rowId = `${baseId}-${item.id.replace(/[^A-Za-z0-9_-]/gu, '_')}`;\n    const itemName = item.label.trim().length > 0 ? item.label : labels.untitled;\n    const labelAccess = resolveOrderedItemFieldAccess(capabilities, 'label');\n    const iconAccess = resolveOrderedItemFieldAccess(capabilities, 'icon');\n    const destinationAccess = resolveOrderedItemFieldAccess(capabilities, 'destination');\n    const canReorder = !locked && capabilities.reorder;\n    const canRemove = !locked && capabilities.remove;\n    const labelMessage = validation?.label;\n    const itemMessage = validation?.item;\n    const labelMessageId = `${rowId}-label-message`;\n    const itemMessageId = `${rowId}-item-message`;\n    const labelDescribedBy = [labelMessage ? labelMessageId : undefined, itemMessage ? itemMessageId : undefined]\n        .filter(Boolean)\n        .join(' ');\n\n    useEffect(() => {\n        setLabelDraft(null);\n    }, [item.label]);\n\n    const handleKeyDown = (event: KeyboardEvent<HTMLButtonElement>) => {\n        parts?.handle?.onKeyDown?.(event);\n        if (event.defaultPrevented) return;\n        if (event.key === 'ArrowUp') {\n            event.preventDefault();\n            onMove(item, -1, 'handle');\n        } else if (event.key === 'ArrowDown') {\n            event.preventDefault();\n            onMove(item, 1, 'handle');\n        }\n    };\n\n    return (\n        <li\n            {...parts?.item}\n            id={rowId}\n            tabIndex={-1}\n            className={joinClassNames('cratis-ordered-item', parts?.item?.className)}\n            onDragOver={canReorder ? (event) => onDragOver(item, event) : undefined}\n            onDrop={canReorder ? (event) => onDrop(item, event) : undefined}\n            data-cratis-part='item'\n            data-item-id={item.id}\n            data-locked={locked || undefined}\n            data-dragging={dragging || undefined}\n            data-drop-position={dropPosition}\n        >\n            {canReorder && (\n                <div className='cratis-ordered-item__reorder'>\n                    <button\n                        {...parts?.handle}\n                        type='button'\n                        draggable\n                        aria-label={labels.handle(itemName)}\n                        aria-keyshortcuts='ArrowUp ArrowDown'\n                        onKeyDown={handleKeyDown}\n                        onDragStart={(event) => onDragStart(item, event)}\n                        onDragEnd={onDragEnd}\n                        className={joinClassNames('cratis-ordered-item__button cratis-ordered-item__handle', parts?.handle?.className)}\n                        data-cratis-part='handle'\n                        data-control='handle'\n                    >\n                        <span aria-hidden='true'>⠿</span>\n                    </button>\n                    <button\n                        {...parts?.moveUp}\n                        type='button'\n                        aria-label={labels.moveUp(itemName)}\n                        aria-disabled={index === 0 || undefined}\n                        onClick={() => onMove(item, -1, 'moveUp')}\n                        className={joinClassNames('cratis-ordered-item__button', parts?.moveUp?.className)}\n                        data-cratis-part='moveUp'\n                        data-control='moveUp'\n                    >\n                        <span aria-hidden='true'>↑</span>\n                    </button>\n                    <button\n                        {...parts?.moveDown}\n                        type='button'\n                        aria-label={labels.moveDown(itemName)}\n                        aria-disabled={index === count - 1 || undefined}\n                        onClick={() => onMove(item, 1, 'moveDown')}\n                        className={joinClassNames('cratis-ordered-item__button', parts?.moveDown?.className)}\n                        data-cratis-part='moveDown'\n                        data-control='moveDown'\n                    >\n                        <span aria-hidden='true'>↓</span>\n                    </button>\n                </div>\n            )}\n            <div className='cratis-ordered-item__fields'>\n                {labelAccess === 'editable' && !locked && (\n                    <input\n                        {...parts?.label}\n                        type='text'\n                        value={labelDraft ?? item.label}\n                        aria-label={labels.labelField}\n                        aria-invalid={labelMessage ? true : undefined}\n                        aria-describedby={labelDescribedBy.length > 0 ? labelDescribedBy : undefined}\n                        onChange={(event) => {\n                            setLabelDraft(event.target.value);\n                            onField(item, 'label', event.target.value);\n                        }}\n                        onBlur={(event) => {\n                            parts?.label?.onBlur?.(event);\n                            setLabelDraft(null);\n                            onFieldBlur(item, 'label');\n                        }}\n                        onKeyDown={(event) => {\n                            parts?.label?.onKeyDown?.(event);\n                            if (event.key === 'Escape' && labelDraft !== null) {\n                                event.preventDefault();\n                                event.stopPropagation();\n                                setLabelDraft(null);\n                                onFieldBlur(item, 'label');\n                            }\n                        }}\n                        className={joinClassNames('cratis-ordered-item__input', parts?.label?.className)}\n                        data-cratis-part='label'\n                        data-control='label'\n                        data-invalid={labelMessage ? true : undefined}\n                    />\n                )}\n                {(labelAccess === 'readonly' || (labelAccess === 'editable' && locked)) && (\n                    <span className='cratis-ordered-item__text' data-control='label'>\n                        <span className='cratis-ordered-item__hidden'>{labels.labelField}: </span>\n                        {item.label}\n                    </span>\n                )}\n                {labelMessage && (\n                    <p {...parts?.message} id={labelMessageId} role='alert' className={joinClassNames('cratis-ordered-item__message', parts?.message?.className)} data-cratis-part='message' data-invalid>\n                        {labelMessage}\n                    </p>\n                )}\n                {iconAccess !== 'hidden' && (\n                    <OrderedItemIconField\n                        item={item}\n                        editable={iconAccess === 'editable' && !locked}\n                        itemName={itemName}\n                        labels={labels}\n                        message={validation?.icon}\n                        messageId={`${rowId}-icon-message`}\n                        parts={parts}\n                        renderIconField={renderIconField}\n                        isIconAvailable={isIconAvailable}\n                        iconCatalog={iconCatalog}\n                        allowedIcons={allowedIcons}\n                        iconPickerLabels={iconPickerLabels}\n                        onChange={(icon) => onField(item, 'icon', icon)}\n                    />\n                )}\n                {destinationAccess !== 'hidden' && (\n                    <OrderedItemDestinationField\n                        item={item}\n                        editable={destinationAccess === 'editable' && !locked}\n                        itemName={itemName}\n                        labels={labels}\n                        destinations={destinations}\n                        message={validation?.destination}\n                        messageId={`${rowId}-destination-message`}\n                        parts={parts}\n                        onChange={(destination) => onField(item, 'destination', destination)}\n                    />\n                )}\n                {itemMessage && (\n                    <p {...parts?.message} id={itemMessageId} role='alert' className={joinClassNames('cratis-ordered-item__message', parts?.message?.className)} data-cratis-part='message' data-invalid>\n                        {itemMessage}\n                    </p>\n                )}\n            </div>\n            {locked && (\n                <span {...parts?.state} className={joinClassNames('cratis-ordered-item__state', parts?.state?.className)} data-cratis-part='state'>\n                    {labels.locked}\n                </span>\n            )}\n            {canRemove && (\n                <button\n                    {...parts?.remove}\n                    type='button'\n                    aria-label={labels.remove(itemName)}\n                    onClick={() => onRemove(item)}\n                    className={joinClassNames('cratis-ordered-item__button cratis-ordered-item__remove', parts?.remove?.className)}\n                    data-cratis-part='remove'\n                    data-control='remove'\n                >\n                    <span aria-hidden='true'>×</span>\n                </button>\n            )}\n        </li>\n    );\n};\n"],"names":["_jsxs","_jsx"],"mappings":"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"}

package/dist/esm/ConfigurationEditor/OrderedItemRowProps.d.ts

@@ -0,0 +1,43 @@
+import type { DragEvent, ReactNode } from 'react';
+import type { IconPickerAllowed } from '../IconPicker/IconPickerAllowed.js';
+import type { IconPickerCatalog } from '../IconPicker/IconPickerCatalog.js';
+import type { IconPickerLabels } from '../IconPicker/IconPickerLabels.js';
+import type { ConfigurationDestination } from './ConfigurationDestination.js';
+import type { ConfigurationIconReference } from './ConfigurationIconReference.js';
+import type { OrderedItem } from './OrderedItem.js';
+import type { OrderedItemCapabilities } from './OrderedItemCapabilities.js';
+import type { OrderedItemEditorParts } from './OrderedItemEditorParts.js';
+import type { OrderedItemField } from './OrderedItemField.js';
+import type { OrderedItemIconFieldProps } from './OrderedItemIconFieldProps.js';
+import type { OrderedItemLabels } from './OrderedItemLabels.js';
+import type { OrderedItemValidation } from './OrderedItemValidation.js';
+/** Props of the internal row that renders one item of an {@link OrderedItemEditor}. */
+export interface OrderedItemRowProps<TItem extends OrderedItem> {
+    item: TItem;
+    index: number;
+    count: number;
+    /** A locked item shows its values as text and offers no control. */
+    locked: boolean;
+    capabilities: OrderedItemCapabilities;
+    labels: Required<OrderedItemLabels>;
+    destinations: ReadonlyArray<ConfigurationDestination>;
+    validation: OrderedItemValidation | undefined;
+    baseId: string;
+    parts: OrderedItemEditorParts | undefined;
+    renderIconField?: (props: OrderedItemIconFieldProps<TItem>) => ReactNode;
+    isIconAvailable?: (icon: ConfigurationIconReference) => boolean;
+    iconCatalog?: IconPickerCatalog;
+    allowedIcons?: IconPickerAllowed;
+    iconPickerLabels?: IconPickerLabels;
+    dragging: boolean;
+    dropPosition: 'before' | 'after' | undefined;
+    onField: (item: TItem, field: OrderedItemField, value: string | ConfigurationIconReference | undefined) => void;
+    onFieldBlur: (item: TItem, field: OrderedItemField) => void;
+    onMove: (item: TItem, delta: -1 | 1, control: 'handle' | 'moveUp' | 'moveDown') => void;
+    onRemove: (item: TItem) => void;
+    onDragStart: (item: TItem, event: DragEvent<HTMLButtonElement>) => void;
+    onDragOver: (item: TItem, event: DragEvent<HTMLLIElement>) => void;
+    onDrop: (item: TItem, event: DragEvent<HTMLLIElement>) => void;
+    onDragEnd: () => void;
+}
+//# sourceMappingURL=OrderedItemRowProps.d.ts.map

package/dist/esm/ConfigurationEditor/OrderedItemRowProps.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrderedItemRowProps.d.ts","sourceRoot":"","sources":["../../../ConfigurationEditor/OrderedItemRowProps.ts"],"names":[],"mappings":"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"}

package/dist/esm/ConfigurationEditor/OrderedItemRowProps.js

@@ -0,0 +1,4 @@
+// Copyright (c) Cratis. All rights reserved.
+// Licensed under the MIT license. See LICENSE file in the project root for full license information.
+export {};
+//# sourceMappingURL=OrderedItemRowProps.js.map

package/dist/esm/ConfigurationEditor/OrderedItemRowProps.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrderedItemRowProps.js","sourceRoot":"","sources":["../../../ConfigurationEditor/OrderedItemRowProps.ts"],"names":[],"mappings":"AAAA,6CAA6C;AAC7C,qGAAqG","sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport type { DragEvent, ReactNode } from 'react';\nimport type { IconPickerAllowed } from '../IconPicker/IconPickerAllowed';\nimport type { IconPickerCatalog } from '../IconPicker/IconPickerCatalog';\nimport type { IconPickerLabels } from '../IconPicker/IconPickerLabels';\nimport type { ConfigurationDestination } from './ConfigurationDestination';\nimport type { ConfigurationIconReference } from './ConfigurationIconReference';\nimport type { OrderedItem } from './OrderedItem';\nimport type { OrderedItemCapabilities } from './OrderedItemCapabilities';\nimport type { OrderedItemEditorParts } from './OrderedItemEditorParts';\nimport type { OrderedItemField } from './OrderedItemField';\nimport type { OrderedItemIconFieldProps } from './OrderedItemIconFieldProps';\nimport type { OrderedItemLabels } from './OrderedItemLabels';\nimport type { OrderedItemValidation } from './OrderedItemValidation';\n\n/** Props of the internal row that renders one item of an {@link OrderedItemEditor}. */\nexport interface OrderedItemRowProps<TItem extends OrderedItem> {\n    item: TItem;\n    index: number;\n    count: number;\n    /** A locked item shows its values as text and offers no control. */\n    locked: boolean;\n    capabilities: OrderedItemCapabilities;\n    labels: Required<OrderedItemLabels>;\n    destinations: ReadonlyArray<ConfigurationDestination>;\n    validation: OrderedItemValidation | undefined;\n    baseId: string;\n    parts: OrderedItemEditorParts | undefined;\n    renderIconField?: (props: OrderedItemIconFieldProps<TItem>) => ReactNode;\n    isIconAvailable?: (icon: ConfigurationIconReference) => boolean;\n    iconCatalog?: IconPickerCatalog;\n    allowedIcons?: IconPickerAllowed;\n    iconPickerLabels?: IconPickerLabels;\n    dragging: boolean;\n    dropPosition: 'before' | 'after' | undefined;\n    onField: (item: TItem, field: OrderedItemField, value: string | ConfigurationIconReference | undefined) => void;\n    onFieldBlur: (item: TItem, field: OrderedItemField) => void;\n    onMove: (item: TItem, delta: -1 | 1, control: 'handle' | 'moveUp' | 'moveDown') => void;\n    onRemove: (item: TItem) => void;\n    onDragStart: (item: TItem, event: DragEvent<HTMLButtonElement>) => void;\n    onDragOver: (item: TItem, event: DragEvent<HTMLLIElement>) => void;\n    onDrop: (item: TItem, event: DragEvent<HTMLLIElement>) => void;\n    onDragEnd: () => void;\n}\n"]}

package/dist/esm/ConfigurationEditor/OrderedItemValidation.d.ts

@@ -0,0 +1,7 @@
+import type { OrderedItemField } from './OrderedItemField.js';
+/**
+ * Validation messages for one item, by field. The `item` key holds a message about the item as a
+ * whole. A field without a message is valid.
+ */
+export type OrderedItemValidation = Partial<Record<OrderedItemField | 'item', string>>;
+//# sourceMappingURL=OrderedItemValidation.d.ts.map

package/dist/esm/ConfigurationEditor/OrderedItemValidation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrderedItemValidation.d.ts","sourceRoot":"","sources":["../../../ConfigurationEditor/OrderedItemValidation.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,uBAAoB,CAAC;AAE3D;;;GAGG;AACH,MAAM,MAAM,qBAAqB,GAAG,OAAO,CAAC,MAAM,CAAC,gBAAgB,GAAG,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC"}

package/dist/esm/ConfigurationEditor/OrderedItemValidation.js

@@ -0,0 +1,4 @@
+// Copyright (c) Cratis. All rights reserved.
+// Licensed under the MIT license. See LICENSE file in the project root for full license information.
+export {};
+//# sourceMappingURL=OrderedItemValidation.js.map

package/dist/esm/ConfigurationEditor/OrderedItemValidation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrderedItemValidation.js","sourceRoot":"","sources":["../../../ConfigurationEditor/OrderedItemValidation.ts"],"names":[],"mappings":"AAAA,6CAA6C;AAC7C,qGAAqG","sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport type { OrderedItemField } from './OrderedItemField';\n\n/**\n * Validation messages for one item, by field. The `item` key holds a message about the item as a\n * whole. A field without a message is valid.\n */\nexport type OrderedItemValidation = Partial<Record<OrderedItemField | 'item', string>>;\n"]}

package/dist/esm/ConfigurationEditor/PropertyChangeProposal.d.ts

@@ -0,0 +1,15 @@
+/**
+ * A change to one property, validated and permitted. The controls are controlled: nothing changes
+ * until the host applies the proposal by passing new `values`.
+ */
+export interface PropertyChangeProposal {
+    /** The property that changed. */
+    name: string;
+    /** The new value. `undefined` clears the property. */
+    value: unknown;
+    /** The value now. */
+    previous: unknown;
+    /** The values object after the change. */
+    values: Readonly<Record<string, unknown>>;
+}
+//# sourceMappingURL=PropertyChangeProposal.d.ts.map

package/dist/esm/ConfigurationEditor/PropertyChangeProposal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PropertyChangeProposal.d.ts","sourceRoot":"","sources":["../../../ConfigurationEditor/PropertyChangeProposal.ts"],"names":[],"mappings":"AAGA;;;GAGG;AACH,MAAM,WAAW,sBAAsB;IACnC,iCAAiC;IACjC,IAAI,EAAE,MAAM,CAAC;IAEb,sDAAsD;IACtD,KAAK,EAAE,OAAO,CAAC;IAEf,qBAAqB;IACrB,QAAQ,EAAE,OAAO,CAAC;IAElB,0CAA0C;IAC1C,MAAM,EAAE,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;CAC7C"}

package/dist/esm/ConfigurationEditor/PropertyChangeProposal.js

@@ -0,0 +1,4 @@
+// Copyright (c) Cratis. All rights reserved.
+// Licensed under the MIT license. See LICENSE file in the project root for full license information.
+export {};
+//# sourceMappingURL=PropertyChangeProposal.js.map

package/dist/esm/ConfigurationEditor/PropertyChangeProposal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PropertyChangeProposal.js","sourceRoot":"","sources":["../../../ConfigurationEditor/PropertyChangeProposal.ts"],"names":[],"mappings":"AAAA,6CAA6C;AAC7C,qGAAqG","sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\n/**\n * A change to one property, validated and permitted. The controls are controlled: nothing changes\n * until the host applies the proposal by passing new `values`.\n */\nexport interface PropertyChangeProposal {\n    /** The property that changed. */\n    name: string;\n\n    /** The new value. `undefined` clears the property. */\n    value: unknown;\n\n    /** The value now. */\n    previous: unknown;\n\n    /** The values object after the change. */\n    values: Readonly<Record<string, unknown>>;\n}\n"]}

package/dist/esm/ConfigurationEditor/PropertyChoice.d.ts

@@ -0,0 +1,8 @@
+/** One option of a choice property. */
+export interface PropertyChoice {
+    /** Stable value stored for the choice. Never the label. */
+    value: string;
+    /** Localizable name shown to the person choosing. */
+    label: string;
+}
+//# sourceMappingURL=PropertyChoice.d.ts.map

package/dist/esm/ConfigurationEditor/PropertyChoice.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PropertyChoice.d.ts","sourceRoot":"","sources":["../../../ConfigurationEditor/PropertyChoice.ts"],"names":[],"mappings":"AAGA,uCAAuC;AACvC,MAAM,WAAW,cAAc;IAC3B,2DAA2D;IAC3D,KAAK,EAAE,MAAM,CAAC;IAEd,qDAAqD;IACrD,KAAK,EAAE,MAAM,CAAC;CACjB"}

package/dist/esm/ConfigurationEditor/PropertyChoice.js

@@ -0,0 +1,4 @@
+// Copyright (c) Cratis. All rights reserved.
+// Licensed under the MIT license. See LICENSE file in the project root for full license information.
+export {};
+//# sourceMappingURL=PropertyChoice.js.map

package/dist/esm/ConfigurationEditor/PropertyChoice.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PropertyChoice.js","sourceRoot":"","sources":["../../../ConfigurationEditor/PropertyChoice.ts"],"names":[],"mappings":"AAAA,6CAA6C;AAC7C,qGAAqG","sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\n/** One option of a choice property. */\nexport interface PropertyChoice {\n    /** Stable value stored for the choice. Never the label. */\n    value: string;\n\n    /** Localizable name shown to the person choosing. */\n    label: string;\n}\n"]}

package/dist/esm/ConfigurationEditor/PropertyControl.d.ts

@@ -0,0 +1,17 @@
+import type { PropertyControlsLabels } from './PropertyControlsLabels.js';
+import type { PropertyControlsParts } from './PropertyControlsParts.js';
+import type { PropertyDescriptor } from './PropertyDescriptor.js';
+/** Props of the internal control that renders one property. */
+export interface PropertyControlProps {
+    descriptor: PropertyDescriptor;
+    value: unknown;
+    readOnly: boolean;
+    message: string | undefined;
+    labels: Required<PropertyControlsLabels>;
+    parts: PropertyControlsParts | undefined;
+    /** Reports a value the person entered. Returns a message when the entry is not acceptable. */
+    onChange: (name: string, value: unknown) => string | undefined;
+}
+/** One labeled property control: text, number, on/off or choice, or its value as text when it cannot change. */
+export declare const PropertyControl: ({ descriptor, value, readOnly, message, labels, parts, onChange }: PropertyControlProps) => import("react").JSX.Element;
+//# sourceMappingURL=PropertyControl.d.ts.map

package/dist/esm/ConfigurationEditor/PropertyControl.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PropertyControl.d.ts","sourceRoot":"","sources":["../../../ConfigurationEditor/PropertyControl.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,6BAA0B,CAAC;AACvE,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,4BAAyB,CAAC;AACrE,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,yBAAsB,CAAC;AAE/D,+DAA+D;AAC/D,MAAM,WAAW,oBAAoB;IACjC,UAAU,EAAE,kBAAkB,CAAC;IAC/B,KAAK,EAAE,OAAO,CAAC;IACf,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,MAAM,GAAG,SAAS,CAAC;IAC5B,MAAM,EAAE,QAAQ,CAAC,sBAAsB,CAAC,CAAC;IACzC,KAAK,EAAE,qBAAqB,GAAG,SAAS,CAAC;IACzC,8FAA8F;IAC9F,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,KAAK,MAAM,GAAG,SAAS,CAAC;CAClE;AAyBD,gHAAgH;AAChH,eAAO,MAAM,eAAe,sEAAuE,oBAAoB,gCA6JtH,CAAC"}

package/dist/esm/ConfigurationEditor/PropertyControl.js

@@ -0,0 +1,88 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { useId, useState, useEffect } from 'react';
+
+const join = (...names) => names.filter(Boolean).join(' ');
+const display = (descriptor, value, labels) => {
+    if (value === undefined || value === null || value === '')
+        return labels.unset;
+    if (descriptor.kind === 'boolean')
+        return value === true ? labels.on : labels.off;
+    if (descriptor.kind === 'choice')
+        return descriptor.options.find((option) => option.value === value)?.label ?? String(value);
+    if (descriptor.kind === 'number' && descriptor.unit)
+        return `${String(value)} ${descriptor.unit}`;
+    return String(value);
+};
+const parseNumber = (text, descriptor, labels) => {
+    if (text.trim().length === 0)
+        return descriptor.required ? { message: labels.required } : { value: undefined };
+    const parsed = Number(text);
+    if (!Number.isFinite(parsed))
+        return { message: labels.notANumber };
+    if (descriptor.min !== undefined && parsed < descriptor.min)
+        return { message: labels.belowMinimum(descriptor.min) };
+    if (descriptor.max !== undefined && parsed > descriptor.max)
+        return { message: labels.aboveMaximum(descriptor.max) };
+    return { value: parsed };
+};
+const PropertyControl = ({ descriptor, value, readOnly, message, labels, parts, onChange }) => {
+    const identity = useId();
+    const controlId = `${identity}-control`;
+    const messageId = `${identity}-message`;
+    const [draft, setDraft] = useState(null);
+    const [entryMessage, setEntryMessage] = useState(undefined);
+    const locked = readOnly || descriptor.editable === false;
+    const shownMessage = entryMessage ?? message;
+    const note = locked ? descriptor.unavailableReason : descriptor.description;
+    const noteId = `${identity}-note`;
+    const describedBy = [shownMessage ? messageId : undefined, note ? noteId : undefined].filter(Boolean).join(' ') || undefined;
+    useEffect(() => {
+        setDraft(null);
+    }, [value]);
+    const commit = (next) => {
+        setEntryMessage(onChange(descriptor.name, next));
+    };
+    const leave = () => {
+        setDraft(null);
+        setEntryMessage(undefined);
+    };
+    let control;
+    if (locked) {
+        control = (jsx("span", { ...parts?.value, className: join('cratis-property__value', parts?.value?.className), "data-cratis-part": 'value', children: display(descriptor, value, labels) }));
+    }
+    else if (descriptor.kind === 'boolean') {
+        control = (jsx("input", { ...parts?.input, id: controlId, type: 'checkbox', checked: value === true, "aria-describedby": describedBy, onChange: (event) => commit(event.target.checked), className: join('cratis-property__input', parts?.input?.className), "data-cratis-part": 'input' }));
+    }
+    else if (descriptor.kind === 'choice') {
+        const known = descriptor.options.some((option) => option.value === value);
+        control = (jsxs("select", { ...parts?.select, id: controlId, value: typeof value === 'string' ? value : '', "aria-invalid": shownMessage ? true : undefined, "aria-describedby": describedBy, onChange: (event) => commit(event.target.value === '' ? undefined : event.target.value), className: join('cratis-property__input', parts?.select?.className), "data-cratis-part": 'select', "data-invalid": shownMessage ? true : undefined, children: [jsx("option", { value: '', children: labels.unset }), typeof value === 'string' && value !== '' && !known && jsx("option", { value: value, children: value }), descriptor.options.map((option) => (jsx("option", { value: option.value, children: option.label }, option.value)))] }));
+    }
+    else if (descriptor.kind === 'number') {
+        control = (jsx("input", { ...parts?.input, id: controlId, type: 'number', inputMode: 'decimal', min: descriptor.min, max: descriptor.max, step: descriptor.step, value: draft ?? (typeof value === 'number' ? String(value) : ''), "aria-invalid": shownMessage ? true : undefined, "aria-describedby": describedBy, onChange: (event) => {
+                setDraft(event.target.value);
+                const parsed = parseNumber(event.target.value, descriptor, labels);
+                if ('message' in parsed)
+                    setEntryMessage(parsed.message);
+                else if (parsed.value !== value)
+                    commit(parsed.value);
+                else
+                    setEntryMessage(undefined);
+            }, onBlur: leave, className: join('cratis-property__input', parts?.input?.className), "data-cratis-part": 'input', "data-invalid": shownMessage ? true : undefined }));
+    }
+    else {
+        control = (jsx("input", { ...parts?.input, id: controlId, type: 'text', placeholder: descriptor.placeholder, value: draft ?? (typeof value === 'string' ? value : ''), "aria-invalid": shownMessage ? true : undefined, "aria-describedby": describedBy, onChange: (event) => {
+                setDraft(event.target.value);
+                commit(event.target.value === '' ? undefined : event.target.value);
+            }, onBlur: leave, onKeyDown: (event) => {
+                if (event.key === 'Escape' && draft !== null) {
+                    event.preventDefault();
+                    event.stopPropagation();
+                    leave();
+                }
+            }, className: join('cratis-property__input', parts?.input?.className), "data-cratis-part": 'input', "data-invalid": shownMessage ? true : undefined }));
+    }
+    return (jsxs("div", { ...parts?.property, className: join('cratis-property', parts?.property?.className), "data-cratis-part": 'property', "data-property": descriptor.name, "data-kind": descriptor.kind, "data-readonly": locked || undefined, children: [locked ? (jsx("span", { ...parts?.label, className: join('cratis-property__label', parts?.label?.className), "data-cratis-part": 'label', children: descriptor.label })) : (jsx("label", { ...parts?.label, htmlFor: controlId, className: join('cratis-property__label', parts?.label?.className), "data-cratis-part": 'label', children: descriptor.label })), control, !locked && descriptor.kind === 'number' && descriptor.unit && (jsx("span", { ...parts?.unit, className: join('cratis-property__unit', parts?.unit?.className), "data-cratis-part": 'unit', children: descriptor.unit })), shownMessage && (jsx("p", { ...parts?.message, id: messageId, role: 'alert', className: join('cratis-property__message', parts?.message?.className), "data-cratis-part": 'message', "data-invalid": true, children: shownMessage })), note && (jsx("p", { ...parts?.message, id: noteId, className: join('cratis-property__message cratis-property__message--note', parts?.message?.className), "data-cratis-part": 'message', children: note }))] }));
+};
+
+export { PropertyControl };
+//# sourceMappingURL=PropertyControl.js.map