@cratis/components 0.1.9 → 0.1.12

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@cratis/components",
-    "version": "0.1.9",
+    "version": "0.1.12",
     "description": "",
     "author": "Cratis",
     "license": "MIT",
@@ -12,9 +12,7 @@
         "access": "public"
     },
     "files": [
-        "dist",
-        "**/*.ts",
-        "**/*.tsx"
+        "dist"
     ],
     "type": "module",
     "main": "dist/cjs/index.js",
@@ -72,6 +70,7 @@
         "prepare": "yarn g:build",
         "clean": "yarn g:clean",
         "build": "tsc -p tsconfig.json",
+        "copy-css": "./scripts/copy-css.sh",
         "lint": "yarn g:lint",
         "lint:ci": "yarn g:lint:ci",
         "test": "yarn g:test",
@@ -81,27 +80,27 @@
         "build-storybook": "storybook build"
     },
     "devDependencies": {
-        "@eslint/eslintrc": "^3.3.1",
-        "@eslint/js": "^9.39.1",
-        "@storybook/react": "^10.1.10",
-        "@storybook/react-vite": "^10.1.10",
-        "@tailwindcss/postcss": "^4.1.17",
-        "@tailwindcss/vite": "^4.1.17",
+        "@eslint/eslintrc": "^3.3.3",
+        "@eslint/js": "^9.39.2",
+        "@storybook/react": "^10.1.11",
+        "@storybook/react-vite": "^10.1.11",
+        "@tailwindcss/postcss": "^4.1.18",
+        "@tailwindcss/vite": "^4.1.18",
         "@types/chai": "^5.2.3",
         "@types/chai-as-promised": "^8.0.2",
         "@types/leaflet": "^1.9.21",
         "@types/mocha": "^10.0.10",
-        "@types/node": "^24.10.1",
+        "@types/node": "^25.0.3",
         "@types/react": "^19.2.7",
         "@types/react-dom": "^19.2.3",
         "@types/sinon": "^21.0.0",
         "@types/sinon-chai": "^4.0.0",
-        "@typescript-eslint/eslint-plugin": "^8.47.0",
-        "@typescript-eslint/parser": "^8.47.0",
-        "@vitejs/plugin-react": "^5.1.1",
-        "@vitest/coverage-v8": "^4.0.10",
-        "autoprefixer": "^10.4.14",
-        "chai": "^6.2.1",
+        "@typescript-eslint/eslint-plugin": "^8.52.0",
+        "@typescript-eslint/parser": "^8.52.0",
+        "@vitejs/plugin-react": "^5.1.2",
+        "@vitest/coverage-v8": "^4.0.16",
+        "autoprefixer": "^10.4.23",
+        "chai": "^6.2.2",
         "chai-as-promised": "^8.0.2",
         "edit-json-file": "^1.8.1",
         "eslint": "^9.39.1",
@@ -111,7 +110,7 @@
         "eslint-plugin-no-null": "^1.0.2",
         "eslint-plugin-prettier": "^5.5.4",
         "eslint-plugin-react": "^7.37.5",
-        "glob": "^11.0.3",
+        "glob": "^13.0.0",
         "globals": "^16.5.0",
         "mocha": "^11.7.5",
         "module-alias": "^2.2.3",
@@ -122,25 +121,25 @@
         "rollup-plugin-commonjs": "^10.1.0",
         "rollup-plugin-peer-deps-external": "^2.2.4",
         "rollup-plugin-typescript2": "^0.36.0",
-        "sinon": "^21.0.0",
+        "sinon": "^21.0.1",
         "sinon-chai": "^4.0.1",
-        "storybook": "^10.1.10",
-        "tailwindcss": "^3.4.19",
+        "storybook": "^10.1.11",
+        "tailwindcss": "^4.1.18",
         "ts-node": "^10.9.2",
         "typescript": "^5.9.3",
-        "typescript-eslint": "^8.47.0",
-        "vite": "^7.2.2",
+        "typescript-eslint": "^8.52.0",
+        "vite": "^7.3.1",
         "vite-plugin-commonjs": "^0.10.4",
-        "vite-tsconfig-paths": "^5.1.4",
-        "vitest": "^4.0.10"
+        "vite-tsconfig-paths": "^6.0.3",
+        "vitest": "^4.0.16"
     },
     "dependencies": {
-        "@cratis/arc": "^18.5.0",
-        "@cratis/arc.react": "^18.5.0",
-        "@cratis/arc.vite": "^18.5.0",
-        "allotment": "1.20.4",
-        "framer-motion": "12.23.26",
-        "pixi.js": "^8.14.3",
+        "@cratis/arc": "^18.7.17",
+        "@cratis/arc.react": "^18.7.17",
+        "@cratis/arc.vite": "^18.7.17",
+        "allotment": "1.20.5",
+        "framer-motion": "12.24.11",
+        "pixi.js": "^8.15.0",
         "primeicons": "7.0.0",
         "primereact": "10.9.7",
         "quill": "^2.0.3",
@@ -148,7 +147,7 @@
         "react-dom": "19.2.3",
         "react-icons": "5.5.0",
         "react-leaflet": "^5.0.0",
-        "react-router-dom": "7.10.1",
+        "react-router-dom": "7.12.0",
         "reflect-metadata": "0.2.2",
         "ts-deepmerge": "7.0.3",
         "tsyringe": "4.10.0",

package/.storybook/main.ts

@@ -1,24 +0,0 @@
-// Copyright (c) Cratis. All rights reserved.
-// Licensed under the MIT license. See LICENSE file in the project root for full license information.
-
-import type { StorybookConfig } from '@storybook/react-vite';
-import type { UserConfig as ViteConfig } from 'vite';
-
-const config: StorybookConfig = {
-  stories: ['../**/*.stories.@(js|jsx|ts|tsx)'],
-  addons: [],
-  framework: {
-    name: '@storybook/react-vite',
-    options: {}
-  },
-  core: { builder: '@storybook/builder-vite' },
-  staticDirs: ['../public'],
-  // Ensure Vite dev server does not open the browser when Storybook starts
-  async viteFinal(existingConfig: ViteConfig) {
-    const cfg: ViteConfig = { ...existingConfig };
-    cfg.server = { ...(cfg.server || {}), open: false } as unknown;
-    return cfg;
-  }
-};
-
-export default config;

package/CommandDialog/CommandDialog.stories.tsx

@@ -1,25 +0,0 @@
-// Copyright (c) Cratis. All rights reserved.
-// Licensed under the MIT license. See LICENSE file in the project root for full license information.
-
-import React from 'react';
-import { Meta, StoryObj } from '@storybook/react';
-import { CommandDialog } from './CommandDialog';
-
-const meta: Meta<typeof CommandDialog> = {
-  title: 'CommandDialog/CommandDialog',
-  component: CommandDialog,
-};
-
-export default meta;
-type Story = StoryObj<typeof CommandDialog>;
-
-export const Default: Story = {
-    args: {
-
-    },
-    render: (args) => (
-        <div className="storybook-wrapper">
-            <CommandDialog {...args} />
-        </div>
-    )
-};

package/CommandDialog/CommandDialog.tsx

@@ -1,161 +0,0 @@
-// Copyright (c) Cratis. All rights reserved.
-// Licensed under the MIT license. See LICENSE file in the project root for full license information.
-
-import { ICommandResult } from '@cratis/arc/commands';
-import { Constructor } from '@cratis/fundamentals';
-import { Dialog } from 'primereact/dialog';
-import { Button } from 'primereact/button';
-import React, { createContext, useContext } from 'react';
-import { CommandForm, useCommandFormContext, BeforeExecuteCallback } from '../CommandForm/CommandForm';
-import { useCommandInstance } from '../CommandForm/CommandForm';
-
-export type FieldValidator<TCommand> = (command: TCommand, fieldName: string, oldValue: unknown, newValue: unknown) => string | undefined;
-export type FieldChangeCallback<TCommand> = (command: TCommand, fieldName: string, oldValue: unknown, newValue: unknown) => void;
-
-export interface CommandDialogProps<TCommand, TResponse = object> {
-    command: Constructor<TCommand>;
-    initialValues?: Partial<TCommand>;
-    currentValues?: Partial<TCommand> | undefined;
-    visible: boolean;
-    header: string;
-    confirmLabel?: string;
-    cancelLabel?: string;
-    confirmIcon?: string;
-    cancelIcon?: string;
-    onConfirm: (result: ICommandResult<TResponse>) => void | Promise<void>;
-    onCancel: () => void;
-    onFieldValidate?: FieldValidator<TCommand>;
-    onFieldChange?: FieldChangeCallback<TCommand>;
-    onBeforeExecute?: BeforeExecuteCallback<TCommand>;
-    children?: React.ReactNode;
-    style?: React.CSSProperties;
-    width?: string;
-}
-
-interface CommandDialogContextValue<TCommand = unknown> {
-    onSuccess: (result: ICommandResult<any>) => void | Promise<void>;
-    onCancel: () => void;
-    confirmLabel: string;
-    cancelLabel: string;
-    confirmIcon: string;
-    cancelIcon: string;
-    onFieldValidate?: FieldValidator<TCommand>;
-    onFieldChange?: FieldChangeCallback<TCommand>;
-    onBeforeExecute?: BeforeExecuteCallback<TCommand>;
-}
-
-const CommandDialogContext = createContext<CommandDialogContextValue<unknown> | undefined>(undefined);
-
-export const useCommandDialogContext = <TCommand = unknown,>() => {
-    const context = useContext(CommandDialogContext);
-    if (!context) {
-        throw new Error('useCommandDialogContext must be used within a CommandDialog');
-    }
-    return context as CommandDialogContextValue<TCommand>;
-};
-
-const CommandDialogFormContent = () => {
-    const command = useCommandInstance();
-    const { setCommandResult, setCommandValues, isValid, onBeforeExecute } = useCommandFormContext();
-    const { onSuccess: onConfirm, onCancel, confirmLabel, cancelLabel, confirmIcon, cancelIcon } = useCommandDialogContext();
-
-    const handleConfirm = async () => {
-        if (onBeforeExecute) {
-            const transformedValues = onBeforeExecute(command);
-            setCommandValues(transformedValues);
-        }
-        const result = await command.execute();
-        if (result.isSuccess) {
-            await onConfirm(result);
-        } else {
-            setCommandResult(result);
-        }
-    };
-
-    const handleCancel = () => {
-        onCancel();
-    };
-
-    return (
-        <>
-            <div className="card flex flex-wrap justify-content-center gap-3 mt-8">
-                <Button label={confirmLabel} icon={confirmIcon} onClick={handleConfirm} disabled={!isValid} />
-                <Button label={cancelLabel} icon={cancelIcon} severity='secondary' onClick={handleCancel} />
-            </div>
-        </>
-    );
-};
-
-const CommandDialogFieldsWrapper = (props: { children: React.ReactNode }) => {
-    React.Children.forEach(props.children, child => {
-        if (React.isValidElement(child)) {
-            const component = child.type as any;
-            if (component.displayName !== 'CommandFormField') {
-                throw new Error(`Only CommandFormField components are allowed as children of CommandDialog.Fields. Got: ${component.displayName || component.name || 'Unknown'}`);
-            }
-        }
-    });
-
-    return (
-        <CommandForm.Fields>
-            {props.children}
-        </CommandForm.Fields>
-    );
-};
-
-const CommandDialogComponent = <TCommand extends object = any, TResponse = object>(props: CommandDialogProps<TCommand, TResponse>) => {
-    const {
-        command,
-        initialValues,
-        currentValues,
-        visible,
-        header,
-        confirmLabel = 'Confirm',
-        cancelLabel = 'Cancel',
-        confirmIcon = 'pi pi-check',
-        cancelIcon = 'pi pi-times',
-        onConfirm,
-        onCancel,
-        onFieldValidate,
-        onFieldChange,
-        onBeforeExecute,
-        children,
-        style = { width: '50vw' },
-        width
-    } = props;
-
-    const dialogStyle = width ? { ...style, width } : style;
-
-    const contextValue: CommandDialogContextValue<TCommand> = {
-        onSuccess: onConfirm,
-        onCancel,
-        confirmLabel,
-        cancelLabel,
-        confirmIcon,
-        cancelIcon,
-        onFieldValidate,
-        onFieldChange,
-        onBeforeExecute
-    };
-
-    return (
-        <Dialog
-            header={header}
-            visible={visible}
-            style={dialogStyle}
-            onHide={onCancel}
-            contentStyle={{ overflow: 'visible' }}
-        >
-            <CommandDialogContext.Provider value={contextValue}>
-                <CommandForm command={command} initialValues={initialValues} currentValues={currentValues} onFieldValidate={onFieldValidate} onFieldChange={onFieldChange} onBeforeExecute={onBeforeExecute}>
-                    {children}
-                    <CommandDialogFormContent />
-                </CommandForm>
-            </CommandDialogContext.Provider>
-        </Dialog>
-    );
-};
-
-CommandDialogComponent.Fields = CommandDialogFieldsWrapper;
-
-export const CommandDialog = CommandDialogComponent;

package/CommandDialog/index.ts

@@ -1,4 +0,0 @@
-// Copyright (c) Cratis. All rights reserved.
-// Licensed under the MIT license. See LICENSE file in the project root for full license information.
-
-export * from './CommandDialog';

package/CommandForm/CommandForm.stories.tsx

@@ -1,24 +0,0 @@
-// Copyright (c) Cratis. All rights reserved.
-// Licensed under the MIT license. See LICENSE file in the project root for full license information.
-
-import React from 'react';
-import { Meta, StoryObj } from '@storybook/react';
-import { CommandForm } from './CommandForm';
-
-const meta: Meta<typeof CommandForm> = {
-  title: 'CommandForm/CommandForm',
-  component: CommandForm,
-};
-
-export default meta;
-type Story = StoryObj<typeof CommandForm>;
-export const Default: Story = {
-    args: {
-
-    },
-    render: (args) => (
-        <div className="storybook-wrapper">
-            <CommandForm {...args} />
-        </div>
-    )
-};

package/CommandForm/CommandForm.tsx

@@ -1,266 +0,0 @@
-// Copyright (c) Cratis. All rights reserved.
-// Licensed under the MIT license. See LICENSE file in the project root for full license information.
-
-import { CommandFormFields, ColumnInfo } from './CommandFormFields';
-import { Constructor } from '@cratis/fundamentals';
-import { useCommand, SetCommandValues } from '@cratis/arc.react/commands';
-import { ICommandResult } from '@cratis/arc/commands';
-import React, { createContext, useContext, useMemo, useState, useCallback } from 'react';
-import type { CommandFormFieldProps } from './CommandFormField';
-import { Panel } from 'primereact/panel';
-
-export type BeforeExecuteCallback<TCommand> = (values: TCommand) => TCommand;
-
-export interface CommandFormProps<TCommand extends object> {
-    command: Constructor<TCommand>;
-    initialValues?: Partial<TCommand>;
-    currentValues?: Partial<TCommand> | undefined;
-    onFieldValidate?: (command: TCommand, fieldName: string, oldValue: unknown, newValue: unknown) => string | undefined;
-    onFieldChange?: (command: TCommand, fieldName: string, oldValue: unknown, newValue: unknown) => void;
-    onBeforeExecute?: BeforeExecuteCallback<TCommand>;
-    children?: React.ReactNode;
-}
-
-interface CommandFormContextValue<TCommand> {
-    command: Constructor<TCommand>;
-    commandInstance: TCommand;
-    setCommandValues: SetCommandValues<TCommand>;
-    commandResult?: ICommandResult<unknown>;
-    setCommandResult: (result: ICommandResult<unknown>) => void;
-    getFieldError: (propertyName: string) => string | undefined;
-    isValid: boolean;
-    setFieldValidity: (fieldName: string, isValid: boolean) => void;
-    onFieldValidate?: (command: TCommand, fieldName: string, oldValue: unknown, newValue: unknown) => string | undefined;
-    onFieldChange?: (command: TCommand, fieldName: string, oldValue: unknown, newValue: unknown) => void;
-    onBeforeExecute?: BeforeExecuteCallback<TCommand>;
-    customFieldErrors: Record<string, string>;
-    setCustomFieldError: (fieldName: string, error: string | undefined) => void;
-}
-
-const CommandFormContext = createContext<CommandFormContextValue<any> | undefined>(undefined);
-
-export const useCommandFormContext = <TCommand,>() => {
-    const context = useContext(CommandFormContext);
-    if (!context) {
-        throw new Error('useCommandFormContext must be used within a CommandForm');
-    }
-    return context as CommandFormContextValue<TCommand>;
-};
-
-// Hook to get just the command instance for easier access
-export const useCommandInstance = <TCommand = any>() => {
-    const { commandInstance } = useCommandFormContext<any>();
-    return commandInstance as TCommand;
-};
-
-// Hook to get setCommandResult for easier access
-export const useSetCommandResult = () => {
-    const { setCommandResult } = useCommandFormContext();
-    return setCommandResult;
-};
-
-const CommandFormFieldsWrapper = (props: { children: React.ReactNode }) => {
-    React.Children.forEach(props.children, child => {
-        if (React.isValidElement(child)) {
-            const component = child.type as any;
-            if (component.displayName !== 'CommandFormField') {
-                throw new Error(`Only CommandFormField components are allowed as children of CommandForm.Fields. Got: ${component.displayName || component.name || 'Unknown'}`);
-            }
-        }
-    });
-
-    return <></>;
-};
-
-CommandFormFieldsWrapper.displayName = 'CommandFormFieldsWrapper';
-
-const getCommandFormFields = <TCommand,>(props: { children?: React.ReactNode }): { fieldsOrColumns: React.ReactElement[] | ColumnInfo[], otherChildren: React.ReactNode[], initialValuesFromFields: Partial<TCommand> } => {
-    if (!props.children) {
-        return { fieldsOrColumns: [], otherChildren: [], initialValuesFromFields: {} };
-    }
-    let fields: React.ReactElement<CommandFormFieldProps<any>>[] = [];
-    const columns: ColumnInfo[] = [];
-    let hasColumns = false;
-    const otherChildren: React.ReactNode[] = [];
-    let initialValuesFromFields: Partial<TCommand> = {};
-
-    const extractInitialValue = (field: React.ReactElement) => {
-        const fieldProps = field.props as any;
-        if (fieldProps.currentValue !== undefined && fieldProps.value) {
-            const propertyAccessor = fieldProps.value;
-            const propertyName = getPropertyNameFromAccessor(propertyAccessor);
-            if (propertyName) {
-                initialValuesFromFields = { ...initialValuesFromFields, [propertyName]: fieldProps.currentValue } as Partial<TCommand>;
-            }
-        }
-    };
-
-    React.Children.toArray(props.children).forEach(child => {
-        if (!React.isValidElement(child)) {
-            otherChildren.push(child);
-            return;
-        }
-
-        const component = child.type as any;
-
-        // Check if child is a CommandFormColumn
-        if (component.displayName === 'CommandFormColumn') {
-            hasColumns = true;
-            const childProps = child.props as { children?: React.ReactNode };
-            const columnFields = React.Children.toArray(childProps.children).filter(child => {
-                if (React.isValidElement(child)) {
-                    const comp = child.type as any;
-                    if (comp.displayName === 'CommandFormField') {
-                        extractInitialValue(child as React.ReactElement);
-                        return true;
-                    }
-                }
-                return false;
-            }) as React.ReactElement[];
-            columns.push({ fields: columnFields as React.ReactElement<CommandFormFieldProps<any>>[] });
-        }
-        // Check if child is a CommandFormField (direct child)
-        else if (component.displayName === 'CommandFormField') {
-            extractInitialValue(child as React.ReactElement);
-            fields.push(child as React.ReactElement<CommandFormFieldProps<any>>);
-        }
-        // Check if child is Fields wrapper (backwards compatibility)
-        else if (component === CommandFormFieldsWrapper || component.displayName === 'CommandFormFieldsWrapper') {
-            const childProps = child.props as { children: React.ReactNode };
-            const relevantChildren = React.Children.toArray(childProps.children).filter(child => {
-                if (React.isValidElement(child)) {
-                    const component = child.type as any;
-                    if (component.displayName === 'CommandFormField') {
-                        extractInitialValue(child as React.ReactElement);
-                        return true;
-                    }
-                }
-                return false;
-            }) as React.ReactElement[];
-            fields = [...fields, ...(relevantChildren as React.ReactElement<CommandFormFieldProps<any>>[])];
-        }
-        // Everything else is not a field, keep it as other children
-        else {
-            otherChildren.push(child);
-        }
-    });
-
-    return { fieldsOrColumns: hasColumns ? columns : fields, otherChildren, initialValuesFromFields };
-};
-
-// Helper function to extract property name from accessor function
-function getPropertyNameFromAccessor<T>(accessor: (obj: T) => unknown): string {
-    const fnStr = accessor.toString();
-    const match = fnStr.match(/\.([a-zA-Z_$][a-zA-Z0-9_$]*)/);
-    return match ? match[1] : '';
-}
-
-const CommandFormComponent = <TCommand extends object = any>(props: CommandFormProps<TCommand>) => {
-    const { fieldsOrColumns, otherChildren, initialValuesFromFields } = useMemo(() => getCommandFormFields<TCommand>(props), [props.children]);
-
-    // Extract matching properties from currentValues
-    const valuesFromCurrentValues = useMemo(() => {
-        if (!props.currentValues) return {};
-
-        const tempCommand = new props.command();
-        const commandProperties = (tempCommand as any).properties || [];
-        const extracted: Partial<TCommand> = {};
-
-        commandProperties.forEach((propertyName: string) => {
-            if ((props.currentValues as any)[propertyName] !== undefined) {
-                (extracted as any)[propertyName] = (props.currentValues as any)[propertyName];
-            }
-        });
-
-        return extracted;
-    }, [props.currentValues, props.command]);
-
-    // Merge initialValues prop with values extracted from field currentValue props and currentValues
-    const mergedInitialValues = useMemo(() => ({
-        ...valuesFromCurrentValues,
-        ...initialValuesFromFields,
-        ...props.initialValues
-    }), [valuesFromCurrentValues, initialValuesFromFields, props.initialValues]);
-
-    // useCommand returns [instance, setter] for the typed command. Provide generics so commandInstance is TCommand.
-    const [commandInstance, setCommandValues] = useCommand<any>(props.command as Constructor<any>, mergedInitialValues as Partial<any>);
-    const [commandResult, setCommandResult] = useState<ICommandResult<unknown> | undefined>(undefined);
-    const [fieldValidities, setFieldValidities] = useState<Record<string, boolean>>({});
-    const [customFieldErrors, setCustomFieldErrors] = useState<Record<string, string>>({});
-
-    // Update command values when mergedInitialValues changes (e.g., when data loads asynchronously)
-    React.useEffect(() => {
-        if (mergedInitialValues && Object.keys(mergedInitialValues).length > 0) {
-            setCommandValues(mergedInitialValues as TCommand);
-        }
-    }, [mergedInitialValues, setCommandValues]);
-
-    const isValid = Object.values(fieldValidities).every(valid => valid);
-
-    const setFieldValidity = useCallback((fieldName: string, isFieldValid: boolean) => {
-        setFieldValidities(prev => ({ ...prev, [fieldName]: isFieldValid }));
-    }, []);
-
-    const setCustomFieldError = useCallback((fieldName: string, error: string | undefined) => {
-        setCustomFieldErrors(prev => {
-            if (error === undefined) {
-                const newErrors = { ...prev };
-                delete newErrors[fieldName];
-                return newErrors;
-            }
-            return { ...prev, [fieldName]: error };
-        });
-    }, []);
-
-    const getFieldError = (propertyName: string): string | undefined => {
-        // Check custom field errors first
-        if (customFieldErrors[propertyName]) {
-            return customFieldErrors[propertyName];
-        }
-
-        if (!commandResult || !commandResult.validationResults) {
-            return undefined;
-        }
-
-        for (const validationResult of commandResult.validationResults) {
-            if (validationResult.members && validationResult.members.includes(propertyName)) {
-                return validationResult.message;
-            }
-        }
-
-        return undefined;
-    };
-
-    const exceptionMessages = commandResult?.exceptionMessages || [];
-    const hasColumns = fieldsOrColumns.length > 0 && 'fields' in fieldsOrColumns[0];
-
-    return (
-        <CommandFormContext.Provider value={{ command: props.command, commandInstance, setCommandValues, commandResult, setCommandResult, getFieldError, isValid, setFieldValidity, onFieldValidate: props.onFieldValidate, onFieldChange: props.onFieldChange, onBeforeExecute: props.onBeforeExecute, customFieldErrors, setCustomFieldError }}>
-            <CommandFormFields fields={hasColumns ? undefined : (fieldsOrColumns as React.ReactElement<CommandFormFieldProps<any>>[])} columns={hasColumns ? fieldsOrColumns as ColumnInfo[] : undefined} />
-            {exceptionMessages.length > 0 && (
-                <div className="card flex flex-row gap-3 mt-3">
-                    <Panel header="The server responded with" className="w-full">
-                        <ul>
-                            {exceptionMessages.map((msg, idx) => (
-                                <li key={idx}>{msg}</li>
-                            ))}
-                        </ul>
-                    </Panel>
-                </div>
-            )}
-            {otherChildren}
-        </CommandFormContext.Provider>
-    );
-};
-
-const CommandFormColumnComponent = (_props: { children: React.ReactNode }) => {
-    void _props;
-    return <></>;
-};
-
-CommandFormColumnComponent.displayName = 'CommandFormColumn';
-
-CommandFormComponent.Fields = CommandFormFieldsWrapper;
-CommandFormComponent.Column = CommandFormColumnComponent;
-
-export const CommandForm = CommandFormComponent;

package/CommandForm/CommandFormField.tsx

@@ -1,27 +0,0 @@
-// Copyright (c) Cratis. All rights reserved.
-// Licensed under the MIT license. See LICENSE file in the project root for full license information.
-
-import type { PropertyAccessor } from '@cratis/fundamentals';
-
-export interface CommandFormFieldProps<TCommand = unknown> {
-    icon?: React.ReactElement;
-    /** Accessor function that selects a property on the command, e.g. c => c.name */
-    value?: PropertyAccessor<TCommand>;
-    /** Current value for the property (injected by CommandFormFields) */
-    currentValue?: unknown;
-    /** Called when the field value changes (injected by CommandFormFields) */
-    onValueChange?: (value: unknown) => void;
-    onChange?: (value: unknown) => void;
-    required?: boolean;
-    title?: string;
-    description?: string;
-    propertyDescriptor?: unknown;
-    fieldName?: string;
-}
-
-export const CommandFormField = <TCommand,>(_props?: CommandFormFieldProps<TCommand>) => {
-    void _props;
-    return <></>;
-};
-
-CommandFormField.displayName = 'CommandFormField';