@cratis/scene.blueprint.default 4.32.0 → 4.33.0

package/dist/esm/foundation/ColumnChooser.js

@@ -0,0 +1,154 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { useMemo, useState, useId, useRef, useEffect } from 'react';
+import { useValueOutput } from '@cratis/scene.react';
+import { readColumns, visibleColumnIds, toggleColumn, moveColumn } from './columnModel.js';
+import { readComponentState, ComponentState } from './ComponentState.js';
+import { FoundationIcon } from './FoundationIcon.js';
+import { readFoundationStrings, formatText } from './foundationStrings.js';
+import { FoundationFrame } from './StateFrame.js';
+
+/**
+ * The `columnChooser` component: which columns a table shows, and in what order.
+ *
+ * `columns` lists what could be shown (id, label, whether it starts visible, and whether it is locked - the identifying column is). The
+ * chooser is a button that discloses a list of checkboxes; each row also has move up and move down buttons, so ordering needs no
+ * drag-and-drop. Its `value` output is the ordered list of visible ids, which the table binds its columns to. Escape closes the list and
+ * returns focus to the button.
+ */ function ColumnChooser({ element, interactions, bindingOutputs }) {
+    const supplied = useMemo(()=>readColumns(element.properties.columns), [
+        element.properties.columns
+    ]);
+    const suppliedKey = JSON.stringify(supplied);
+    const [columns, setColumns] = useState(supplied);
+    const [open, setOpen] = useState(false);
+    const strings = readFoundationStrings(element);
+    const state = readComponentState(element, supplied.length > 0);
+    const panelId = useId();
+    const button = useRef(null);
+    useEffect(()=>setColumns(supplied), [
+        suppliedKey
+    ]);
+    useValueOutput(bindingOutputs, visibleColumnIds(columns));
+    const apply = (next)=>{
+        setColumns(next);
+        interactions?.onChange?.();
+    };
+    const close = (event)=>{
+        if (event.key !== 'Escape' || !open) return;
+        setOpen(false);
+        button.current?.focus();
+    };
+    return /*#__PURE__*/ jsx(FoundationFrame, {
+        element: element,
+        interactions: interactions,
+        name: "column-chooser",
+        state: state,
+        skeleton: [
+            50
+        ],
+        children: state !== ComponentState.Loading && /*#__PURE__*/ jsxs("div", {
+            className: "foundation-popover-host",
+            onKeyDown: close,
+            children: [
+                /*#__PURE__*/ jsxs("button", {
+                    ref: button,
+                    type: "button",
+                    className: "foundation-button",
+                    "data-emphasis": "secondary",
+                    "aria-expanded": open,
+                    "aria-controls": panelId,
+                    onClick: ()=>setOpen(!open),
+                    children: [
+                        /*#__PURE__*/ jsx(FoundationIcon, {
+                            name: "columns"
+                        }),
+                        /*#__PURE__*/ jsx("span", {
+                            children: strings.columnsChoose
+                        }),
+                        /*#__PURE__*/ jsx("span", {
+                            className: "foundation-count",
+                            children: formatText(strings.columnsShown, {
+                                shown: visibleColumnIds(columns).length,
+                                total: columns.length
+                            })
+                        })
+                    ]
+                }),
+                /*#__PURE__*/ jsxs("div", {
+                    id: panelId,
+                    className: "foundation-popover",
+                    hidden: !open,
+                    children: [
+                        /*#__PURE__*/ jsx("ul", {
+                            className: "foundation-list",
+                            "aria-label": strings.columnsChoose,
+                            children: columns.map((column, index)=>/*#__PURE__*/ jsxs("li", {
+                                    className: "foundation-list-row",
+                                    children: [
+                                        /*#__PURE__*/ jsxs("label", {
+                                            className: "foundation-check",
+                                            children: [
+                                                /*#__PURE__*/ jsx("input", {
+                                                    type: "checkbox",
+                                                    checked: column.visible,
+                                                    disabled: column.locked,
+                                                    onChange: ()=>apply(toggleColumn(columns, index))
+                                                }),
+                                                /*#__PURE__*/ jsx("span", {
+                                                    children: column.label
+                                                }),
+                                                column.locked && /*#__PURE__*/ jsxs("span", {
+                                                    className: "foundation-count",
+                                                    children: [
+                                                        "(",
+                                                        strings.columnsLocked,
+                                                        ")"
+                                                    ]
+                                                })
+                                            ]
+                                        }),
+                                        /*#__PURE__*/ jsx("button", {
+                                            type: "button",
+                                            className: "foundation-icon-button",
+                                            disabled: index === 0,
+                                            "aria-label": formatText(strings.columnsMoveUp, {
+                                                name: column.label
+                                            }),
+                                            onClick: ()=>apply(moveColumn(columns, index, -1)),
+                                            children: /*#__PURE__*/ jsx(FoundationIcon, {
+                                                name: "arrow-up"
+                                            })
+                                        }),
+                                        /*#__PURE__*/ jsx("button", {
+                                            type: "button",
+                                            className: "foundation-icon-button",
+                                            disabled: index === columns.length - 1,
+                                            "aria-label": formatText(strings.columnsMoveDown, {
+                                                name: column.label
+                                            }),
+                                            onClick: ()=>apply(moveColumn(columns, index, 1)),
+                                            children: /*#__PURE__*/ jsx(FoundationIcon, {
+                                                name: "arrow-down"
+                                            })
+                                        })
+                                    ]
+                                }, column.id))
+                        }),
+                        /*#__PURE__*/ jsx("button", {
+                            type: "button",
+                            className: "foundation-link",
+                            onClick: ()=>apply(columns.map((column)=>({
+                                        ...column,
+                                        visible: true
+                                    }))),
+                            children: strings.columnsReset
+                        })
+                    ]
+                })
+            ]
+        })
+    });
+}
+
+export { ColumnChooser };
+//# sourceMappingURL=ColumnChooser.js.map

package/dist/esm/foundation/ColumnChooser.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColumnChooser.js","sources":["../../../foundation/ColumnChooser.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 { KeyboardEvent, useEffect, useId, useMemo, useRef, useState } from 'react';\nimport { RegisteredComponentProps, useValueOutput } from '@cratis/scene.react';\nimport { ChooserColumn, moveColumn, readColumns, toggleColumn, visibleColumnIds } from './columnModel';\nimport { ComponentState, readComponentState } from './ComponentState';\nimport { FoundationIcon } from './FoundationIcon';\nimport { formatText, readFoundationStrings } from './foundationStrings';\nimport { FoundationFrame } from './StateFrame';\n\n/**\n * The `columnChooser` component: which columns a table shows, and in what order.\n *\n * `columns` lists what could be shown (id, label, whether it starts visible, and whether it is locked - the identifying column is). The\n * chooser is a button that discloses a list of checkboxes; each row also has move up and move down buttons, so ordering needs no\n * drag-and-drop. Its `value` output is the ordered list of visible ids, which the table binds its columns to. Escape closes the list and\n * returns focus to the button.\n */\nexport function ColumnChooser({ element, interactions, bindingOutputs }: RegisteredComponentProps) {\n    const supplied = useMemo(() => readColumns(element.properties.columns), [element.properties.columns]);\n    const suppliedKey = JSON.stringify(supplied);\n    const [columns, setColumns] = useState<ChooserColumn[]>(supplied);\n    const [open, setOpen] = useState(false);\n    const strings = readFoundationStrings(element);\n    const state = readComponentState(element, supplied.length > 0);\n    const panelId = useId();\n    const button = useRef<HTMLButtonElement>(null);\n\n    useEffect(() => setColumns(supplied), [suppliedKey]);\n    useValueOutput(bindingOutputs, visibleColumnIds(columns));\n\n    const apply = (next: ChooserColumn[]) => { setColumns(next); interactions?.onChange?.(); };\n    const close = (event: KeyboardEvent) => {\n        if (event.key !== 'Escape' || !open) return;\n        setOpen(false);\n        button.current?.focus();\n    };\n\n    return (\n        <FoundationFrame element={element} interactions={interactions} name='column-chooser' state={state} skeleton={[50]}>\n            {state !== ComponentState.Loading && (\n                <div className='foundation-popover-host' onKeyDown={close}>\n                    <button ref={button} type='button' className='foundation-button' data-emphasis='secondary' aria-expanded={open} aria-controls={panelId} onClick={() => setOpen(!open)}>\n                        <FoundationIcon name='columns' />\n                        <span>{strings.columnsChoose}</span>\n                        <span className='foundation-count'>{formatText(strings.columnsShown, { shown: visibleColumnIds(columns).length, total: columns.length })}</span>\n                    </button>\n                    <div id={panelId} className='foundation-popover' hidden={!open}>\n                        <ul className='foundation-list' aria-label={strings.columnsChoose}>\n                            {columns.map((column, index) => (\n                                <li key={column.id} className='foundation-list-row'>\n                                    <label className='foundation-check'>\n                                        <input type='checkbox' checked={column.visible} disabled={column.locked} onChange={() => apply(toggleColumn(columns, index))} />\n                                        <span>{column.label}</span>\n                                        {column.locked && <span className='foundation-count'>({strings.columnsLocked})</span>}\n                                    </label>\n                                    <button type='button' className='foundation-icon-button' disabled={index === 0} aria-label={formatText(strings.columnsMoveUp, { name: column.label })} onClick={() => apply(moveColumn(columns, index, -1))}>\n                                        <FoundationIcon name='arrow-up' />\n                                    </button>\n                                    <button type='button' className='foundation-icon-button' disabled={index === columns.length - 1} aria-label={formatText(strings.columnsMoveDown, { name: column.label })} onClick={() => apply(moveColumn(columns, index, 1))}>\n                                        <FoundationIcon name='arrow-down' />\n                                    </button>\n                                </li>\n                            ))}\n                        </ul>\n                        <button type='button' className='foundation-link' onClick={() => apply(columns.map(column => ({ ...column, visible: true })))}>{strings.columnsReset}</button>\n                    </div>\n                </div>\n            )}\n        </FoundationFrame>\n    );\n}\n"],"names":["ColumnChooser","element","interactions","bindingOutputs","supplied","useMemo","readColumns","properties","columns","suppliedKey","JSON","stringify","setColumns","useState","open","setOpen","strings","readFoundationStrings","state","readComponentState","length","panelId","useId","button","useRef","useEffect","useValueOutput","visibleColumnIds","apply","next","onChange","close","event","key","current","focus","_jsx","FoundationFrame","name","skeleton","ComponentState","Loading","_jsxs","div","className","onKeyDown","ref","type","data-emphasis","aria-expanded","aria-controls","onClick","FoundationIcon","span","columnsChoose","formatText","columnsShown","shown","total","id","hidden","ul","aria-label","map","column","index","li","label","input","checked","visible","disabled","locked","toggleColumn","columnsLocked","columnsMoveUp","moveColumn","columnsMoveDown","columnsReset"],"mappings":"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"}

package/dist/esm/foundation/FilterBuilder.d.ts

@@ -0,0 +1,3 @@
+import { RegisteredComponentProps } from '@cratis/scene.react';
+export declare function FilterBuilder({ element, interactions, bindingOutputs }: RegisteredComponentProps): import("react").JSX.Element;
+//# sourceMappingURL=FilterBuilder.d.ts.map

package/dist/esm/foundation/FilterBuilder.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FilterBuilder.d.ts","sourceRoot":"","sources":["../../../foundation/FilterBuilder.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,wBAAwB,EAAkB,MAAM,qBAAqB,CAAC;AA2G/E,wBAAgB,aAAa,CAAC,EAAE,OAAO,EAAE,YAAY,EAAE,cAAc,EAAE,EAAE,wBAAwB,+BAgChG"}

package/dist/esm/foundation/FilterBuilder.js

@@ -0,0 +1,305 @@
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { useMemo, useState, useEffect } from 'react';
+import { useValueOutput } from '@cratis/scene.react';
+import { readComponentState, ComponentState } from './ComponentState.js';
+import { ActionButton } from './ActionButton.js';
+import { readFilterFields, normalizeFilter, countActiveConditions, emptyFilter, filterOperators, FilterFieldType, newCondition, maximumFilterDepth, updateGroupAt, valuelessOperators } from './filterModel.js';
+import { readFoundationStrings, formatText } from './foundationStrings.js';
+import { FoundationFrame } from './StateFrame.js';
+import { readPermissionRule } from './PermissionRule.js';
+
+const operatorText = (strings, operator)=>{
+    const names = {
+        contains: strings.opContains,
+        equals: strings.opEquals,
+        notEquals: strings.opNotEquals,
+        startsWith: strings.opStartsWith,
+        isEmpty: strings.opIsEmpty,
+        greater: strings.opGreater,
+        greaterOrEqual: strings.opGreaterOrEqual,
+        less: strings.opLess,
+        lessOrEqual: strings.opLessOrEqual,
+        before: strings.opBefore,
+        after: strings.opAfter,
+        on: strings.opOn,
+        is: strings.opIs,
+        isNot: strings.opIsNot,
+        true: strings.opTrue,
+        false: strings.opFalse
+    };
+    return names[operator] ?? operator;
+};
+function ValueInput({ field, condition, strings, label, disabled, onChange }) {
+    if (valuelessOperators.includes(condition.operator)) return undefined;
+    if (field?.type === FilterFieldType.Select) {
+        return /*#__PURE__*/ jsxs("select", {
+            "aria-label": `${strings.filterValue}, ${label}`,
+            value: condition.value,
+            disabled: disabled,
+            onChange: (event)=>onChange(event.target.value),
+            children: [
+                /*#__PURE__*/ jsx("option", {
+                    value: "",
+                    children: "—"
+                }),
+                field.options.map((option)=>/*#__PURE__*/ jsx("option", {
+                        value: option,
+                        children: option
+                    }, option))
+            ]
+        });
+    }
+    return /*#__PURE__*/ jsx("input", {
+        "aria-label": `${strings.filterValue}, ${label}`,
+        type: field?.type === FilterFieldType.Number ? 'number' : field?.type === FilterFieldType.Date ? 'date' : 'text',
+        value: condition.value,
+        disabled: disabled,
+        onChange: (event)=>onChange(event.target.value)
+    });
+}
+function GroupEditor({ group, path, fields, strings, locked, change }) {
+    const label = path.length === 0 ? strings.filterMatchAll.replace(/ \(.*\)$/, '') : formatText(strings.filterGroup, {
+        n: path.join('.')
+    });
+    const depth = path.length + 1;
+    return /*#__PURE__*/ jsxs("div", {
+        className: "foundation-filter-group",
+        role: "group",
+        "aria-label": path.length === 0 ? formatText(countActiveConditions(group) === 1 ? strings.filterSummaryOne : strings.filterSummary, {
+            count: countActiveConditions(group)
+        }) : label,
+        "data-depth": depth,
+        children: [
+            /*#__PURE__*/ jsxs("div", {
+                className: "foundation-filter-match",
+                children: [
+                    /*#__PURE__*/ jsxs("select", {
+                        "aria-label": strings.filterMatchAll,
+                        value: group.operator,
+                        disabled: locked,
+                        onChange: (event)=>change(path, (current)=>({
+                                    ...current,
+                                    operator: event.target.value === 'or' ? 'or' : 'and'
+                                })),
+                        children: [
+                            /*#__PURE__*/ jsx("option", {
+                                value: "and",
+                                children: strings.filterMatchAll
+                            }),
+                            /*#__PURE__*/ jsx("option", {
+                                value: "or",
+                                children: strings.filterMatchAny
+                            })
+                        ]
+                    }),
+                    path.length > 0 && !locked && /*#__PURE__*/ jsx("button", {
+                        type: "button",
+                        className: "foundation-link",
+                        onClick: ()=>change(path.slice(0, -1), (parent)=>({
+                                    ...parent,
+                                    groups: parent.groups.filter((_, index)=>index !== path[path.length - 1])
+                                })),
+                        children: strings.filterRemoveGroup
+                    })
+                ]
+            }),
+            group.conditions.map((condition, index)=>{
+                const field = fields.find((candidate)=>candidate.name === condition.field);
+                const conditionLabel = formatText(strings.filterCondition, {
+                    n: index + 1
+                });
+                return /*#__PURE__*/ jsxs("div", {
+                    className: "foundation-filter-row",
+                    role: "group",
+                    "aria-label": conditionLabel,
+                    children: [
+                        /*#__PURE__*/ jsx("select", {
+                            "aria-label": `${strings.filterField}, ${conditionLabel}`,
+                            value: condition.field,
+                            disabled: locked,
+                            onChange: (event)=>{
+                                const next = fields.find((candidate)=>candidate.name === event.target.value);
+                                change(path, (current)=>({
+                                        ...current,
+                                        conditions: current.conditions.map((existing, position)=>position === index ? {
+                                                field: event.target.value,
+                                                operator: next ? filterOperators[next.type][0] : existing.operator,
+                                                value: ''
+                                            } : existing)
+                                    }));
+                            },
+                            children: fields.map((candidate)=>/*#__PURE__*/ jsx("option", {
+                                    value: candidate.name,
+                                    children: candidate.label
+                                }, candidate.name))
+                        }),
+                        /*#__PURE__*/ jsx("select", {
+                            "aria-label": `${strings.filterOperator}, ${conditionLabel}`,
+                            value: condition.operator,
+                            disabled: locked,
+                            onChange: (event)=>change(path, (current)=>({
+                                        ...current,
+                                        conditions: current.conditions.map((existing, position)=>position === index ? {
+                                                ...existing,
+                                                operator: event.target.value
+                                            } : existing)
+                                    })),
+                            children: filterOperators[field?.type ?? FilterFieldType.Text].map((operator)=>/*#__PURE__*/ jsx("option", {
+                                    value: operator,
+                                    children: operatorText(strings, operator)
+                                }, operator))
+                        }),
+                        /*#__PURE__*/ jsx(ValueInput, {
+                            field: field,
+                            condition: condition,
+                            strings: strings,
+                            label: conditionLabel,
+                            disabled: locked,
+                            onChange: (value)=>change(path, (current)=>({
+                                        ...current,
+                                        conditions: current.conditions.map((existing, position)=>position === index ? {
+                                                ...existing,
+                                                value
+                                            } : existing)
+                                    }))
+                        }),
+                        !locked && /*#__PURE__*/ jsx("button", {
+                            type: "button",
+                            className: "foundation-icon-button",
+                            "aria-label": `${strings.filterRemove}, ${conditionLabel}`,
+                            onClick: ()=>change(path, (current)=>({
+                                        ...current,
+                                        conditions: current.conditions.filter((_, position)=>position !== index)
+                                    })),
+                            children: "×"
+                        })
+                    ]
+                }, index);
+            }),
+            group.groups.map((nested, index)=>/*#__PURE__*/ jsx(GroupEditor, {
+                    group: nested,
+                    path: [
+                        ...path,
+                        index
+                    ],
+                    fields: fields,
+                    strings: strings,
+                    locked: locked,
+                    change: change
+                }, index)),
+            !locked && /*#__PURE__*/ jsxs("div", {
+                className: "foundation-filter-actions",
+                children: [
+                    /*#__PURE__*/ jsx("button", {
+                        type: "button",
+                        className: "foundation-link",
+                        onClick: ()=>change(path, (current)=>({
+                                    ...current,
+                                    conditions: [
+                                        ...current.conditions,
+                                        newCondition(fields)
+                                    ]
+                                })),
+                        children: strings.filterAdd
+                    }),
+                    depth < maximumFilterDepth && /*#__PURE__*/ jsx("button", {
+                        type: "button",
+                        className: "foundation-link",
+                        onClick: ()=>change(path, (current)=>({
+                                    ...current,
+                                    groups: [
+                                        ...current.groups,
+                                        {
+                                            operator: 'and',
+                                            conditions: [
+                                                newCondition(fields)
+                                            ],
+                                            groups: []
+                                        }
+                                    ]
+                                })),
+                        children: strings.filterAddGroup
+                    })
+                ]
+            })
+        ]
+    });
+}
+/**
+ * The `filterBuilder` component: field, operator and value conditions joined by AND or OR, in groups that nest up to three deep.
+ *
+ * The filter is the component's `value` output - `{ operator, conditions, groups }` - which a list screen binds its query to; the
+ * component itself filters nothing. `fields` describe what can be filtered (name, label, type, and options for a select), and
+ * the operators on offer follow each field's type. A filter bound in through `value` is read back as the user left it: conditions on
+ * fields that no longer exist are dropped rather than shown broken. The component is the filter panel of a list on a desktop and
+ * the body of the filter dialog on a phone.
+ */ function FilterBuilder({ element, interactions, bindingOutputs }) {
+    const fields = useMemo(()=>readFilterFields(element.properties.fields), [
+        element.properties.fields
+    ]);
+    const supplied = useMemo(()=>normalizeFilter(element.properties.filter, fields), [
+        element.properties.filter,
+        fields
+    ]);
+    const [filter, setFilter] = useState(supplied);
+    const strings = readFoundationStrings(element);
+    const suppliedKey = JSON.stringify(supplied);
+    const state = readComponentState(element, fields.length > 0);
+    const locked = readPermissionRule(element, 'editPermission') !== 'enabled';
+    useEffect(()=>setFilter(supplied), [
+        suppliedKey
+    ]);
+    useValueOutput(bindingOutputs, filter);
+    const change = (path, apply)=>{
+        const next = updateGroupAt(filter, path, apply);
+        setFilter(next);
+        interactions?.onChange?.();
+    };
+    const active = countActiveConditions(filter);
+    return /*#__PURE__*/ jsx(FoundationFrame, {
+        element: element,
+        interactions: interactions,
+        name: "filter-builder",
+        state: state,
+        skeleton: [
+            100,
+            100
+        ],
+        children: state !== ComponentState.Loading && /*#__PURE__*/ jsxs(Fragment, {
+            children: [
+                /*#__PURE__*/ jsx(GroupEditor, {
+                    group: filter,
+                    path: [],
+                    fields: fields,
+                    strings: strings,
+                    locked: locked,
+                    change: change
+                }),
+                /*#__PURE__*/ jsxs("div", {
+                    className: "foundation-filter-footer",
+                    children: [
+                        /*#__PURE__*/ jsx("span", {
+                            className: "foundation-filter-summary",
+                            "aria-live": "polite",
+                            children: active === 1 ? strings.filterSummaryOne : formatText(strings.filterSummary, {
+                                count: active
+                            })
+                        }),
+                        active > 0 && !locked && /*#__PURE__*/ jsx(ActionButton, {
+                            emphasis: "quiet",
+                            disabledReason: strings.disabledNoPermission,
+                            onClick: ()=>{
+                                setFilter(emptyFilter());
+                                interactions?.onChange?.();
+                            },
+                            children: strings.filterClear
+                        })
+                    ]
+                })
+            ]
+        })
+    });
+}
+
+export { FilterBuilder };
+//# sourceMappingURL=FilterBuilder.js.map

package/dist/esm/foundation/FilterBuilder.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FilterBuilder.js","sources":["../../../foundation/FilterBuilder.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, useMemo, useState } from 'react';\nimport { RegisteredComponentProps, useValueOutput } from '@cratis/scene.react';\nimport { ComponentState, readComponentState } from './ComponentState';\nimport { ActionButton } from './ActionButton';\nimport {\n    FilterCondition, FilterField, emptyFilter, FilterFieldType, FilterGroup, countActiveConditions, filterOperators, maximumFilterDepth, newCondition,\n    normalizeFilter, readFilterFields, updateGroupAt, valuelessOperators,\n} from './filterModel';\nimport { FoundationStrings, formatText, readFoundationStrings } from './foundationStrings';\nimport { FoundationFrame } from './StateFrame';\nimport { readPermissionRule } from './PermissionRule';\n\nconst operatorText = (strings: FoundationStrings, operator: string): string => {\n    const names: Record<string, string> = {\n        contains: strings.opContains, equals: strings.opEquals, notEquals: strings.opNotEquals, startsWith: strings.opStartsWith, isEmpty: strings.opIsEmpty,\n        greater: strings.opGreater, greaterOrEqual: strings.opGreaterOrEqual, less: strings.opLess, lessOrEqual: strings.opLessOrEqual,\n        before: strings.opBefore, after: strings.opAfter, on: strings.opOn, is: strings.opIs, isNot: strings.opIsNot, true: strings.opTrue, false: strings.opFalse,\n    };\n    return names[operator] ?? operator;\n};\n\ninterface GroupEditorProps {\n    group: FilterGroup;\n    path: number[];\n    fields: FilterField[];\n    strings: FoundationStrings;\n    locked: boolean;\n    change(path: number[], change: (group: FilterGroup) => FilterGroup): void;\n}\n\nfunction ValueInput({ field, condition, strings, label, disabled, onChange }: { field: FilterField | undefined; condition: FilterCondition; strings: FoundationStrings; label: string; disabled: boolean; onChange(value: string): void }) {\n    if (valuelessOperators.includes(condition.operator)) return undefined;\n\n    if (field?.type === FilterFieldType.Select) {\n        return (\n            <select aria-label={`${strings.filterValue}, ${label}`} value={condition.value} disabled={disabled} onChange={event => onChange(event.target.value)}>\n                <option value=''>—</option>\n                {field.options.map(option => <option key={option} value={option}>{option}</option>)}\n            </select>\n        );\n    }\n\n    return <input aria-label={`${strings.filterValue}, ${label}`} type={field?.type === FilterFieldType.Number ? 'number' : field?.type === FilterFieldType.Date ? 'date' : 'text'} value={condition.value} disabled={disabled} onChange={event => onChange(event.target.value)} />;\n}\n\nfunction GroupEditor({ group, path, fields, strings, locked, change }: GroupEditorProps) {\n    const label = path.length === 0 ? strings.filterMatchAll.replace(/ \\(.*\\)$/, '') : formatText(strings.filterGroup, { n: path.join('.') });\n    const depth = path.length + 1;\n\n    return (\n        <div className='foundation-filter-group' role='group' aria-label={path.length === 0 ? formatText(countActiveConditions(group) === 1 ? strings.filterSummaryOne : strings.filterSummary, { count: countActiveConditions(group) }) : label} data-depth={depth}>\n            <div className='foundation-filter-match'>\n                <select aria-label={strings.filterMatchAll} value={group.operator} disabled={locked} onChange={event => change(path, current => ({ ...current, operator: event.target.value === 'or' ? 'or' : 'and' }))}>\n                    <option value='and'>{strings.filterMatchAll}</option>\n                    <option value='or'>{strings.filterMatchAny}</option>\n                </select>\n                {path.length > 0 && !locked && (\n                    <button type='button' className='foundation-link' onClick={() => change(path.slice(0, -1), parent => ({ ...parent, groups: parent.groups.filter((_, index) => index !== path[path.length - 1]) }))}>{strings.filterRemoveGroup}</button>\n                )}\n            </div>\n            {group.conditions.map((condition, index) => {\n                const field = fields.find(candidate => candidate.name === condition.field);\n                const conditionLabel = formatText(strings.filterCondition, { n: index + 1 });\n                return (\n                    <div className='foundation-filter-row' role='group' aria-label={conditionLabel} key={index}>\n                        <select aria-label={`${strings.filterField}, ${conditionLabel}`} value={condition.field} disabled={locked}\n                            onChange={event => {\n                                const next = fields.find(candidate => candidate.name === event.target.value);\n                                change(path, current => ({ ...current, conditions: current.conditions.map((existing, position) => (position === index\n                                    ? { field: event.target.value, operator: next ? filterOperators[next.type][0] : existing.operator, value: '' } : existing)) }));\n                            }}>\n                            {fields.map(candidate => <option key={candidate.name} value={candidate.name}>{candidate.label}</option>)}\n                        </select>\n                        <select aria-label={`${strings.filterOperator}, ${conditionLabel}`} value={condition.operator} disabled={locked}\n                            onChange={event => change(path, current => ({ ...current, conditions: current.conditions.map((existing, position) => (position === index ? { ...existing, operator: event.target.value } : existing)) }))}>\n                            {filterOperators[field?.type ?? FilterFieldType.Text].map(operator => <option key={operator} value={operator}>{operatorText(strings, operator)}</option>)}\n                        </select>\n                        <ValueInput field={field} condition={condition} strings={strings} label={conditionLabel} disabled={locked}\n                            onChange={value => change(path, current => ({ ...current, conditions: current.conditions.map((existing, position) => (position === index ? { ...existing, value } : existing)) }))} />\n                        {!locked && (\n                            <button type='button' className='foundation-icon-button' aria-label={`${strings.filterRemove}, ${conditionLabel}`}\n                                onClick={() => change(path, current => ({ ...current, conditions: current.conditions.filter((_, position) => position !== index) }))}>×</button>\n                        )}\n                    </div>\n                );\n            })}\n            {group.groups.map((nested, index) => <GroupEditor key={index} group={nested} path={[...path, index]} fields={fields} strings={strings} locked={locked} change={change} />)}\n            {!locked && (\n                <div className='foundation-filter-actions'>\n                    <button type='button' className='foundation-link' onClick={() => change(path, current => ({ ...current, conditions: [...current.conditions, newCondition(fields)] }))}>{strings.filterAdd}</button>\n                    {depth < maximumFilterDepth && (\n                        <button type='button' className='foundation-link' onClick={() => change(path, current => ({ ...current, groups: [...current.groups, { operator: 'and', conditions: [newCondition(fields)], groups: [] }] }))}>{strings.filterAddGroup}</button>\n                    )}\n                </div>\n            )}\n        </div>\n    );\n}\n\n/**\n * The `filterBuilder` component: field, operator and value conditions joined by AND or OR, in groups that nest up to three deep.\n *\n * The filter is the component's `value` output - `{ operator, conditions, groups }` - which a list screen binds its query to; the\n * component itself filters nothing. `fields` describe what can be filtered (name, label, type, and options for a select), and\n * the operators on offer follow each field's type. A filter bound in through `value` is read back as the user left it: conditions on\n * fields that no longer exist are dropped rather than shown broken. The component is the filter panel of a list on a desktop and\n * the body of the filter dialog on a phone.\n */\nexport function FilterBuilder({ element, interactions, bindingOutputs }: RegisteredComponentProps) {\n    const fields = useMemo(() => readFilterFields(element.properties.fields), [element.properties.fields]);\n    const supplied = useMemo(() => normalizeFilter(element.properties.filter, fields), [element.properties.filter, fields]);\n    const [filter, setFilter] = useState<FilterGroup>(supplied);\n    const strings = readFoundationStrings(element);\n    const suppliedKey = JSON.stringify(supplied);\n    const state = readComponentState(element, fields.length > 0);\n    const locked = readPermissionRule(element, 'editPermission') !== 'enabled';\n\n    useEffect(() => setFilter(supplied), [suppliedKey]);\n    useValueOutput(bindingOutputs, filter);\n\n    const change = (path: number[], apply: (group: FilterGroup) => FilterGroup) => {\n        const next = updateGroupAt(filter, path, apply);\n        setFilter(next);\n        interactions?.onChange?.();\n    };\n    const active = countActiveConditions(filter);\n\n    return (\n        <FoundationFrame element={element} interactions={interactions} name='filter-builder' state={state} skeleton={[100, 100]}>\n            {state !== ComponentState.Loading && (\n                <>\n                    <GroupEditor group={filter} path={[]} fields={fields} strings={strings} locked={locked} change={change} />\n                    <div className='foundation-filter-footer'>\n                        <span className='foundation-filter-summary' aria-live='polite'>{active === 1 ? strings.filterSummaryOne : formatText(strings.filterSummary, { count: active })}</span>\n                        {active > 0 && !locked && <ActionButton emphasis='quiet' disabledReason={strings.disabledNoPermission} onClick={() => { setFilter(emptyFilter()); interactions?.onChange?.(); }}>{strings.filterClear}</ActionButton>}\n                    </div>\n                </>\n            )}\n        </FoundationFrame>\n    );\n}\n"],"names":["operatorText","strings","operator","names","contains","opContains","equals","opEquals","notEquals","opNotEquals","startsWith","opStartsWith","isEmpty","opIsEmpty","greater","opGreater","greaterOrEqual","opGreaterOrEqual","less","opLess","lessOrEqual","opLessOrEqual","before","opBefore","after","opAfter","on","opOn","is","opIs","isNot","opIsNot","true","opTrue","false","opFalse","ValueInput","field","condition","label","disabled","onChange","valuelessOperators","includes","undefined","type","FilterFieldType","Select","_jsxs","select","aria-label","filterValue","value","event","target","_jsx","option","options","map","input","Number","Date","GroupEditor","group","path","fields","locked","change","length","filterMatchAll","replace","formatText","filterGroup","n","join","depth","div","className","role","countActiveConditions","filterSummaryOne","filterSummary","count","data-depth","current","filterMatchAny","button","onClick","slice","parent","groups","filter","_","index","filterRemoveGroup","conditions","find","candidate","name","conditionLabel","filterCondition","filterField","next","existing","position","filterOperators","filterOperator","Text","filterRemove","nested","newCondition","filterAdd","maximumFilterDepth","filterAddGroup","FilterBuilder","element","interactions","bindingOutputs","useMemo","readFilterFields","properties","supplied","normalizeFilter","setFilter","useState","readFoundationStrings","suppliedKey","JSON","stringify","state","readComponentState","readPermissionRule","useEffect","useValueOutput","apply","updateGroupAt","active","FoundationFrame","skeleton","ComponentState","Loading","_Fragment","span","aria-live","ActionButton","emphasis","disabledReason","disabledNoPermission","emptyFilter","filterClear"],"mappings":"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"}

package/dist/esm/foundation/Foundation.stories.d.ts

@@ -18,4 +18,20 @@ export declare const TrendChipLight: Story;
 export declare const TrendChipDark: Story;
 export declare const StatusChipLight: Story;
 export declare const StatusChipDark: Story;
+export declare const ChartLineLight: Story;
+export declare const ChartLineDark: Story;
+export declare const ChartBarLight: Story;
+export declare const ChartBarDark: Story;
+export declare const ChartStackedLight: Story;
+export declare const ChartStackedDark: Story;
+export declare const ChartDonutLight: Story;
+export declare const ChartDonutDark: Story;
+export declare const ChartFunnelLight: Story;
+export declare const ChartFunnelDark: Story;
+export declare const FilterBuilderLight: Story;
+export declare const FilterBuilderDark: Story;
+export declare const ColumnChooserLight: Story;
+export declare const ColumnChooserDark: Story;
+export declare const SavedViewsMenuLight: Story;
+export declare const SavedViewsMenuDark: Story;
 //# sourceMappingURL=Foundation.stories.d.ts.map

package/dist/esm/foundation/Foundation.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Foundation.stories.d.ts","sourceRoot":"","sources":["../../../foundation/Foundation.stories.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEvD,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAMtD,QAAA,MAAM,IAAI;;;;QAGQ,MAAM;;CACiB,CAAC;eAE3B,IAAI;AAEnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,eAAe,EAAE,KAAyE,CAAC;AACxG,eAAO,MAAM,cAAc,EAAE,KAAwE,CAAC;AACtG,eAAO,MAAM,aAAa,EAAE,KAAuE,CAAC;AACpG,eAAO,MAAM,YAAY,EAAE,KAAsE,CAAC;AAClG,eAAO,MAAM,mBAAmB,EAAE,KAAiJ,CAAC;AACpL,eAAO,MAAM,cAAc,EAAE,KAAwE,CAAC;AACtG,eAAO,MAAM,aAAa,EAAE,KAAuE,CAAC;AACpG,eAAO,MAAM,eAAe,EAAE,KAAyE,CAAC;AACxG,eAAO,MAAM,cAAc,EAAE,KAAwE,CAAC"}
+{"version":3,"file":"Foundation.stories.d.ts","sourceRoot":"","sources":["../../../foundation/Foundation.stories.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEvD,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAMtD,QAAA,MAAM,IAAI;;;;QAGQ,MAAM;;CACiB,CAAC;eAE3B,IAAI;AAEnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,eAAe,EAAE,KAAyE,CAAC;AACxG,eAAO,MAAM,cAAc,EAAE,KAAwE,CAAC;AACtG,eAAO,MAAM,aAAa,EAAE,KAAuE,CAAC;AACpG,eAAO,MAAM,YAAY,EAAE,KAAsE,CAAC;AAClG,eAAO,MAAM,mBAAmB,EAAE,KAAiJ,CAAC;AACpL,eAAO,MAAM,cAAc,EAAE,KAAwE,CAAC;AACtG,eAAO,MAAM,aAAa,EAAE,KAAuE,CAAC;AACpG,eAAO,MAAM,eAAe,EAAE,KAAyE,CAAC;AACxG,eAAO,MAAM,cAAc,EAAE,KAAwE,CAAC;AACtG,eAAO,MAAM,cAAc,EAAE,KAA2E,CAAC;AACzG,eAAO,MAAM,aAAa,EAAE,KAA0E,CAAC;AACvG,eAAO,MAAM,aAAa,EAAE,KAAwG,CAAC;AACrI,eAAO,MAAM,YAAY,EAAE,KAAuG,CAAC;AACnI,eAAO,MAAM,iBAAiB,EAAE,KAA4G,CAAC;AAC7I,eAAO,MAAM,gBAAgB,EAAE,KAA2G,CAAC;AAC3I,eAAO,MAAM,eAAe,EAAE,KAA0G,CAAC;AACzI,eAAO,MAAM,cAAc,EAAE,KAAyG,CAAC;AACvI,eAAO,MAAM,gBAAgB,EAAE,KAA2N,CAAC;AAC3P,eAAO,MAAM,eAAe,EAAE,KAA0N,CAAC;AACzP,eAAO,MAAM,kBAAkB,EAAE,KAA4E,CAAC;AAC9G,eAAO,MAAM,iBAAiB,EAAE,KAA2E,CAAC;AAC5G,eAAO,MAAM,kBAAkB,EAAE,KAA4E,CAAC;AAC9G,eAAO,MAAM,iBAAiB,EAAE,KAA2E,CAAC;AAC5G,eAAO,MAAM,mBAAmB,EAAE,KAA6E,CAAC;AAChH,eAAO,MAAM,kBAAkB,EAAE,KAA4E,CAAC"}

package/dist/esm/foundation/Foundation.stories.js

@@ -15,4 +15,20 @@ export const TrendChipLight = { args: { component: ComponentName.TrendChip, them
 export const TrendChipDark = { args: { component: ComponentName.TrendChip, theme: 'dark' } };
 export const StatusChipLight = { args: { component: ComponentName.StatusChip, theme: 'light' } };
 export const StatusChipDark = { args: { component: ComponentName.StatusChip, theme: 'dark' } };
+export const ChartLineLight = { args: { component: ComponentName.ChartWrapper, theme: 'light' } };
+export const ChartLineDark = { args: { component: ComponentName.ChartWrapper, theme: 'dark' } };
+export const ChartBarLight = { args: { component: ComponentName.ChartWrapper, theme: 'light', properties: { kind: 'bar' } } };
+export const ChartBarDark = { args: { component: ComponentName.ChartWrapper, theme: 'dark', properties: { kind: 'bar' } } };
+export const ChartStackedLight = { args: { component: ComponentName.ChartWrapper, theme: 'light', properties: { kind: 'stacked' } } };
+export const ChartStackedDark = { args: { component: ComponentName.ChartWrapper, theme: 'dark', properties: { kind: 'stacked' } } };
+export const ChartDonutLight = { args: { component: ComponentName.ChartWrapper, theme: 'light', properties: { kind: 'donut' } } };
+export const ChartDonutDark = { args: { component: ComponentName.ChartWrapper, theme: 'dark', properties: { kind: 'donut' } } };
+export const ChartFunnelLight = { args: { component: ComponentName.ChartWrapper, theme: 'light', properties: { kind: 'funnel', categories: ['Leads', 'Qualified', 'Proposal', 'Won'], series: [{ name: 'Deals', values: [400, 220, 90, 40] }] } } };
+export const ChartFunnelDark = { args: { component: ComponentName.ChartWrapper, theme: 'dark', properties: { kind: 'funnel', categories: ['Leads', 'Qualified', 'Proposal', 'Won'], series: [{ name: 'Deals', values: [400, 220, 90, 40] }] } } };
+export const FilterBuilderLight = { args: { component: ComponentName.FilterBuilder, theme: 'light' } };
+export const FilterBuilderDark = { args: { component: ComponentName.FilterBuilder, theme: 'dark' } };
+export const ColumnChooserLight = { args: { component: ComponentName.ColumnChooser, theme: 'light' } };
+export const ColumnChooserDark = { args: { component: ComponentName.ColumnChooser, theme: 'dark' } };
+export const SavedViewsMenuLight = { args: { component: ComponentName.SavedViewsMenu, theme: 'light' } };
+export const SavedViewsMenuDark = { args: { component: ComponentName.SavedViewsMenu, theme: 'dark' } };
 //# sourceMappingURL=Foundation.stories.js.map

package/dist/esm/foundation/Foundation.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"Foundation.stories.js","sourceRoot":"","sources":["../../../foundation/Foundation.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AACjD,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAMtD,MAAM,IAAI,GAAG;IACT,KAAK,EAAE,iCAAiC;IACxC,SAAS,EAAE,gBAAgB;IAC3B,UAAU,EAAE,EAAE,MAAM,EAAE,YAAY,EAAE;CACC,CAAC;AAE1C,eAAe,IAAI,CAAC;AAIpB,MAAM,CAAC,MAAM,eAAe,GAAU,EAAE,IAAI,EAAE,EAAE,SAAS,EAAE,aAAa,CAAC,UAAU,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,CAAC;AACxG,MAAM,CAAC,MAAM,cAAc,GAAU,EAAE,IAAI,EAAE,EAAE,SAAS,EAAE,aAAa,CAAC,UAAU,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,CAAC;AACtG,MAAM,CAAC,MAAM,aAAa,GAAU,EAAE,IAAI,EAAE,EAAE,SAAS,EAAE,aAAa,CAAC,QAAQ,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,CAAC;AACpG,MAAM,CAAC,MAAM,YAAY,GAAU,EAAE,IAAI,EAAE,EAAE,SAAS,EAAE,aAAa,CAAC,QAAQ,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,CAAC;AAClG,MAAM,CAAC,MAAM,mBAAmB,GAAU,EAAE,IAAI,EAAE,EAAE,SAAS,EAAE,aAAa,CAAC,QAAQ,EAAE,KAAK,EAAE,OAAO,EAAE,WAAW,EAAE,IAAI,EAAE,UAAU,EAAE,EAAE,KAAK,EAAE,aAAa,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC;AACpL,MAAM,CAAC,MAAM,cAAc,GAAU,EAAE,IAAI,EAAE,EAAE,SAAS,EAAE,aAAa,CAAC,SAAS,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,CAAC;AACtG,MAAM,CAAC,MAAM,aAAa,GAAU,EAAE,IAAI,EAAE,EAAE,SAAS,EAAE,aAAa,CAAC,SAAS,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,CAAC;AACpG,MAAM,CAAC,MAAM,eAAe,GAAU,EAAE,IAAI,EAAE,EAAE,SAAS,EAAE,aAAa,CAAC,UAAU,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,CAAC;AACxG,MAAM,CAAC,MAAM,cAAc,GAAU,EAAE,IAAI,EAAE,EAAE,SAAS,EAAE,aAAa,CAAC,UAAU,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,CAAC"}
+{"version":3,"file":"Foundation.stories.js","sourceRoot":"","sources":["../../../foundation/Foundation.stories.tsx"],"names":[],"mappings":"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"}

package/dist/esm/foundation/SavedViewsMenu.d.ts

@@ -0,0 +1,4 @@
+import { RegisteredComponentProps } from '@cratis/scene.react';
+export declare const savedViewActionOutput = "action";
+export declare function SavedViewsMenu({ element, interactions, bindingOutputs }: RegisteredComponentProps): import("react").JSX.Element;
+//# sourceMappingURL=SavedViewsMenu.d.ts.map

package/dist/esm/foundation/SavedViewsMenu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SavedViewsMenu.d.ts","sourceRoot":"","sources":["../../../foundation/SavedViewsMenu.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,wBAAwB,EAAkB,MAAM,qBAAqB,CAAC;AAU/E,eAAO,MAAM,qBAAqB,WAAW,CAAC;AAW9C,wBAAgB,cAAc,CAAC,EAAE,OAAO,EAAE,YAAY,EAAE,cAAc,EAAE,EAAE,wBAAwB,+BAoEjG"}