@cratis/components 0.1.10 → 0.1.13

package/dist/cjs/CommandDialog/CommandDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"CommandDialog.js","sources":["../../../CommandDialog/CommandDialog.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 { ICommandResult } from '@cratis/arc/commands';\nimport { Constructor } from '@cratis/fundamentals';\nimport { Dialog } from 'primereact/dialog';\nimport { Button } from 'primereact/button';\nimport React, { createContext, useContext } from 'react';\nimport { CommandForm, useCommandFormContext, BeforeExecuteCallback } from '../CommandForm/CommandForm';\nimport { useCommandInstance } from '../CommandForm/CommandForm';\n\nexport type FieldValidator<TCommand> = (command: TCommand, fieldName: string, oldValue: unknown, newValue: unknown) => string | undefined;\nexport type FieldChangeCallback<TCommand> = (command: TCommand, fieldName: string, oldValue: unknown, newValue: unknown) => void;\n\nexport interface CommandDialogProps<TCommand, TResponse = object> {\n    command: Constructor<TCommand>;\n    initialValues?: Partial<TCommand>;\n    currentValues?: Partial<TCommand> | undefined;\n    visible: boolean;\n    header: string;\n    confirmLabel?: string;\n    cancelLabel?: string;\n    confirmIcon?: string;\n    cancelIcon?: string;\n    onConfirm: (result: ICommandResult<TResponse>) => void | Promise<void>;\n    onCancel: () => void;\n    onFieldValidate?: FieldValidator<TCommand>;\n    onFieldChange?: FieldChangeCallback<TCommand>;\n    onBeforeExecute?: BeforeExecuteCallback<TCommand>;\n    children?: React.ReactNode;\n    style?: React.CSSProperties;\n    width?: string;\n}\n\ninterface CommandDialogContextValue<TCommand = unknown> {\n    onSuccess: (result: ICommandResult<any>) => void | Promise<void>;\n    onCancel: () => void;\n    confirmLabel: string;\n    cancelLabel: string;\n    confirmIcon: string;\n    cancelIcon: string;\n    onFieldValidate?: FieldValidator<TCommand>;\n    onFieldChange?: FieldChangeCallback<TCommand>;\n    onBeforeExecute?: BeforeExecuteCallback<TCommand>;\n}\n\nconst CommandDialogContext = createContext<CommandDialogContextValue<unknown> | undefined>(undefined);\n\nexport const useCommandDialogContext = <TCommand = unknown,>() => {\n    const context = useContext(CommandDialogContext);\n    if (!context) {\n        throw new Error('useCommandDialogContext must be used within a CommandDialog');\n    }\n    return context as CommandDialogContextValue<TCommand>;\n};\n\nconst CommandDialogFormContent = () => {\n    const command = useCommandInstance();\n    const { setCommandResult, setCommandValues, isValid, onBeforeExecute } = useCommandFormContext();\n    const { onSuccess: onConfirm, onCancel, confirmLabel, cancelLabel, confirmIcon, cancelIcon } = useCommandDialogContext();\n\n    const handleConfirm = async () => {\n        if (onBeforeExecute) {\n            const transformedValues = onBeforeExecute(command);\n            setCommandValues(transformedValues);\n        }\n        const result = await command.execute();\n        if (result.isSuccess) {\n            await onConfirm(result);\n        } else {\n            setCommandResult(result);\n        }\n    };\n\n    const handleCancel = () => {\n        onCancel();\n    };\n\n    return (\n        <>\n            <div className=\"card flex flex-wrap justify-content-center gap-3 mt-8\">\n                <Button label={confirmLabel} icon={confirmIcon} onClick={handleConfirm} disabled={!isValid} />\n                <Button label={cancelLabel} icon={cancelIcon} severity='secondary' onClick={handleCancel} />\n            </div>\n        </>\n    );\n};\n\nconst CommandDialogFieldsWrapper = (props: { children: React.ReactNode }) => {\n    React.Children.forEach(props.children, child => {\n        if (React.isValidElement(child)) {\n            const component = child.type as any;\n            if (component.displayName !== 'CommandFormField') {\n                throw new Error(`Only CommandFormField components are allowed as children of CommandDialog.Fields. Got: ${component.displayName || component.name || 'Unknown'}`);\n            }\n        }\n    });\n\n    return (\n        <CommandForm.Fields>\n            {props.children}\n        </CommandForm.Fields>\n    );\n};\n\nconst CommandDialogComponent = <TCommand extends object = any, TResponse = object>(props: CommandDialogProps<TCommand, TResponse>) => {\n    const {\n        command,\n        initialValues,\n        currentValues,\n        visible,\n        header,\n        confirmLabel = 'Confirm',\n        cancelLabel = 'Cancel',\n        confirmIcon = 'pi pi-check',\n        cancelIcon = 'pi pi-times',\n        onConfirm,\n        onCancel,\n        onFieldValidate,\n        onFieldChange,\n        onBeforeExecute,\n        children,\n        style = { width: '50vw' },\n        width\n    } = props;\n\n    const dialogStyle = width ? { ...style, width } : style;\n\n    const contextValue: CommandDialogContextValue<TCommand> = {\n        onSuccess: onConfirm,\n        onCancel,\n        confirmLabel,\n        cancelLabel,\n        confirmIcon,\n        cancelIcon,\n        onFieldValidate,\n        onFieldChange,\n        onBeforeExecute\n    };\n\n    return (\n        <Dialog\n            header={header}\n            visible={visible}\n            style={dialogStyle}\n            onHide={onCancel}\n            contentStyle={{ overflow: 'visible' }}\n        >\n            <CommandDialogContext.Provider value={contextValue}>\n                <CommandForm command={command} initialValues={initialValues} currentValues={currentValues} onFieldValidate={onFieldValidate} onFieldChange={onFieldChange} onBeforeExecute={onBeforeExecute}>\n                    {children}\n                    <CommandDialogFormContent />\n                </CommandForm>\n            </CommandDialogContext.Provider>\n        </Dialog>\n    );\n};\n\nCommandDialogComponent.Fields = CommandDialogFieldsWrapper;\n\nexport const CommandDialog = CommandDialogComponent;\n"],"names":["createContext","useContext","useCommandInstance","useCommandFormContext","_jsx","_jsxs","Button","CommandForm","Dialog"],"mappings":"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"}
+{"version":3,"file":"CommandDialog.js","sources":["../../../CommandDialog/CommandDialog.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 { ICommandResult } from '@cratis/arc/commands';\nimport { Constructor } from '@cratis/fundamentals';\nimport { Dialog } from 'primereact/dialog';\nimport { Button } from 'primereact/button';\nimport React, { createContext, useContext } from 'react';\nimport { CommandForm, useCommandFormContext, BeforeExecuteCallback } from '../CommandForm/CommandForm';\nimport { useCommandInstance } from '../CommandForm/CommandForm';\n\nexport type FieldValidator<TCommand> = (command: TCommand, fieldName: string, oldValue: unknown, newValue: unknown) => string | undefined;\nexport type FieldChangeCallback<TCommand> = (command: TCommand, fieldName: string, oldValue: unknown, newValue: unknown) => void;\n\nexport interface CommandDialogProps<TCommand, TResponse = object> {\n    command: Constructor<TCommand>;\n    initialValues?: Partial<TCommand>;\n    currentValues?: Partial<TCommand> | undefined;\n    visible: boolean;\n    header: string;\n    confirmLabel?: string;\n    cancelLabel?: string;\n    confirmIcon?: string;\n    cancelIcon?: string;\n    onConfirm: (result: ICommandResult<TResponse>) => void | Promise<void>;\n    onCancel: () => void;\n    onFieldValidate?: FieldValidator<TCommand>;\n    onFieldChange?: FieldChangeCallback<TCommand>;\n    onBeforeExecute?: BeforeExecuteCallback<TCommand>;\n    children?: React.ReactNode;\n    style?: React.CSSProperties;\n    width?: string;\n}\n\ninterface CommandDialogContextValue<TCommand = unknown> {\n    onSuccess: (result: ICommandResult<unknown>) => void | Promise<void>;\n    onCancel: () => void;\n    confirmLabel: string;\n    cancelLabel: string;\n    confirmIcon: string;\n    cancelIcon: string;\n    onFieldValidate?: FieldValidator<TCommand>;\n    onFieldChange?: FieldChangeCallback<TCommand>;\n    onBeforeExecute?: BeforeExecuteCallback<TCommand>;\n}\n\nconst CommandDialogContext = createContext<CommandDialogContextValue<unknown> | undefined>(undefined);\n\nexport const useCommandDialogContext = <TCommand = unknown,>() => {\n    const context = useContext(CommandDialogContext);\n    if (!context) {\n        throw new Error('useCommandDialogContext must be used within a CommandDialog');\n    }\n    return context as CommandDialogContextValue<TCommand>;\n};\n\nconst CommandDialogFormContent = <TCommand extends { execute: () => Promise<ICommandResult<unknown>> }>() => {\n    const command = useCommandInstance<TCommand>();\n    const { setCommandResult, setCommandValues, isValid, onBeforeExecute } = useCommandFormContext<TCommand>();\n    const { onSuccess: onConfirm, onCancel, confirmLabel, cancelLabel, confirmIcon, cancelIcon } = useCommandDialogContext<TCommand>();\n\n    const handleConfirm = async () => {\n        if (onBeforeExecute) {\n            const transformedValues = onBeforeExecute(command);\n            setCommandValues(transformedValues);\n        }\n        const result = await command.execute();\n        if (result.isSuccess) {\n            await onConfirm(result);\n        } else {\n            setCommandResult(result);\n        }\n    };\n\n    const handleCancel = () => {\n        onCancel();\n    };\n\n    return (\n        <>\n            <div className=\"card flex flex-wrap justify-content-center gap-3 mt-8\">\n                <Button label={confirmLabel} icon={confirmIcon} onClick={handleConfirm} disabled={!isValid} />\n                <Button label={cancelLabel} icon={cancelIcon} severity='secondary' onClick={handleCancel} />\n            </div>\n        </>\n    );\n};\n\nconst CommandDialogFieldsWrapper = (props: { children: React.ReactNode }) => {\n    React.Children.forEach(props.children, child => {\n        if (React.isValidElement(child)) {\n            const component = child.type as React.ComponentType<unknown>;\n            if (component.displayName !== 'CommandFormField') {\n                throw new Error(`Only CommandFormField components are allowed as children of CommandDialog.Fields. Got: ${component.displayName || component.name || 'Unknown'}`);\n            }\n        }\n    });\n\n    return (\n        <CommandForm.Fields>\n            {props.children}\n        </CommandForm.Fields>\n    );\n};\n\nconst CommandDialogComponent = <TCommand extends object = object, TResponse = object>(props: CommandDialogProps<TCommand, TResponse>) => {\n    const {\n        command,\n        initialValues,\n        currentValues,\n        visible,\n        header,\n        confirmLabel = 'Confirm',\n        cancelLabel = 'Cancel',\n        confirmIcon = 'pi pi-check',\n        cancelIcon = 'pi pi-times',\n        onConfirm,\n        onCancel,\n        onFieldValidate,\n        onFieldChange,\n        onBeforeExecute,\n        children,\n        style = { width: '50vw' },\n        width\n    } = props;\n\n    const dialogStyle = width ? { ...style, width } : style;\n\n    const contextValue: CommandDialogContextValue<TCommand> = {\n        onSuccess: onConfirm,\n        onCancel,\n        confirmLabel,\n        cancelLabel,\n        confirmIcon,\n        cancelIcon,\n        onFieldValidate,\n        onFieldChange,\n        onBeforeExecute\n    };\n\n    return (\n        <Dialog\n            header={header}\n            visible={visible}\n            style={dialogStyle}\n            onHide={onCancel}\n            contentStyle={{ overflow: 'visible' }}\n        >\n            <CommandDialogContext.Provider value={contextValue}>\n                <CommandForm command={command} initialValues={initialValues} currentValues={currentValues} onFieldValidate={onFieldValidate} onFieldChange={onFieldChange} onBeforeExecute={onBeforeExecute}>\n                    {children}\n                    <CommandDialogFormContent />\n                </CommandForm>\n            </CommandDialogContext.Provider>\n        </Dialog>\n    );\n};\n\nCommandDialogComponent.Fields = CommandDialogFieldsWrapper;\n\nexport const CommandDialog = CommandDialogComponent;\n"],"names":["createContext","useContext","useCommandInstance","useCommandFormContext","_jsx","_jsxs","Button","CommandForm","Dialog"],"mappings":"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"}

package/dist/cjs/CommandForm/CommandForm.js

@@ -99,6 +99,8 @@ const getCommandFormFields = (props) => {
     return { fieldsOrColumns: hasColumns ? columns : fields, otherChildren, initialValuesFromFields };
 };
 function getPropertyNameFromAccessor(accessor) {
+    if (typeof accessor !== 'function')
+        return '';
     const fnStr = accessor.toString();
     const match = fnStr.match(/\.([a-zA-Z_$][a-zA-Z0-9_$]*)/);
     return match ? match[1] : '';
@@ -109,7 +111,7 @@ const CommandFormComponent = (props) => {
         if (!props.currentValues)
             return {};
         const tempCommand = new props.command();
-        const commandProperties = tempCommand.properties || [];
+        const commandProperties = (tempCommand.properties || []);
         const extracted = {};
         commandProperties.forEach((propertyName) => {
             if (props.currentValues[propertyName] !== undefined) {
@@ -123,7 +125,9 @@ const CommandFormComponent = (props) => {
         ...initialValuesFromFields,
         ...props.initialValues
     }), [valuesFromCurrentValues, initialValuesFromFields, props.initialValues]);
-    const [commandInstance, setCommandValues] = commands.useCommand(props.command, mergedInitialValues);
+    const useCommandResult = commands.useCommand(props.command, mergedInitialValues);
+    const commandInstance = useCommandResult[0];
+    const setCommandValues = useCommandResult[1];
     const [commandResult, setCommandResult] = React.useState(undefined);
     const [fieldValidities, setFieldValidities] = React.useState({});
     const [customFieldErrors, setCustomFieldErrors] = React.useState({});

package/dist/cjs/CommandForm/CommandForm.js.map

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

package/dist/cjs/CommandForm/CommandFormFields.js

@@ -23,11 +23,17 @@ const CommandFormFieldWrapper = ({ field, index }) => {
         onValueChange: (value) => {
             if (propertyName) {
                 const oldValue = currentValue;
+                context.setCommandValues({ [propertyName]: value });
+                if (context.commandInstance && typeof context.commandInstance.validate === 'function') {
+                    const validationResult = context.commandInstance.validate();
+                    if (validationResult) {
+                        context.setCommandResult(validationResult);
+                    }
+                }
                 if (context.onFieldValidate) {
                     const validationError = context.onFieldValidate(context.commandInstance, propertyName, oldValue, value);
                     context.setCustomFieldError(propertyName, validationError);
                 }
-                context.setCommandValues({ [propertyName]: value });
                 if (context.onFieldChange) {
                     context.onFieldChange(context.commandInstance, propertyName, oldValue, value);
                 }
@@ -38,7 +44,7 @@ const CommandFormFieldWrapper = ({ field, index }) => {
         invalid: !!errorMessage
     });
     const tooltipId = fieldProps.description ? `tooltip-${propertyName}-${index}` : undefined;
-    return (jsxRuntime.jsxs("div", { style: { width: '100%' }, children: [jsxRuntime.jsxs("div", { className: "p-inputgroup", style: { width: '100%' }, children: [fieldProps.description && (jsxRuntime.jsx(tooltip.Tooltip, { target: `.${tooltipId}`, content: fieldProps.description })), fieldProps.icon && (jsxRuntime.jsx("span", { className: `p-inputgroup-addon ${tooltipId || ''}`, children: fieldProps.icon })), clonedField] }), errorMessage && (jsxRuntime.jsx("small", { className: "p-error block mt-1", children: errorMessage }))] }));
+    return (jsxRuntime.jsxs("div", { className: "w-full", children: [jsxRuntime.jsxs("div", { className: "p-inputgroup w-full", children: [fieldProps.description && (jsxRuntime.jsx(tooltip.Tooltip, { target: `.${tooltipId}`, content: fieldProps.description })), fieldProps.icon && (jsxRuntime.jsx("span", { className: `p-inputgroup-addon ${tooltipId || ''}`, children: fieldProps.icon })), clonedField] }), errorMessage && (jsxRuntime.jsx("small", { className: "p-error block mt-1", children: errorMessage }))] }));
 };
 const CommandFormFields = (props) => {
     const { fields, columns } = props;
@@ -50,7 +56,7 @@ const CommandFormFields = (props) => {
                     return (jsxRuntime.jsx(CommandFormFieldWrapper, { field: field, index: index }, propertyName));
                 }) }, `column-${columnIndex}`))) }));
     }
-    return (jsxRuntime.jsx("div", { style: { display: 'flex', flexDirection: 'column', gap: '1rem', width: '100%' }, children: (fields || []).map((field, index) => {
+    return (jsxRuntime.jsx("div", { className: "flex flex-col gap-4 w-full", children: (fields || []).map((field, index) => {
             const fieldProps = field.props;
             const propertyAccessor = fieldProps.value;
             const propertyName = propertyAccessor ? getPropertyName(propertyAccessor) : `field-${index}`;

package/dist/cjs/CommandForm/CommandFormFields.js.map

@@ -1 +1 @@
-{"version":3,"file":"CommandFormFields.js","sources":["../../../CommandForm/CommandFormFields.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 { useCommandFormContext } from './CommandForm';\nimport React from 'react';\nimport { Tooltip } from 'primereact/tooltip';\nimport type { CommandFormFieldProps } from './CommandFormField';\n\nexport interface ColumnInfo {\n    fields: React.ReactElement<CommandFormFieldProps<any>>[];\n}\n\nexport interface CommandFormFieldsProps {\n    fields?: React.ReactElement<CommandFormFieldProps<any>>[];\n    columns?: ColumnInfo[];\n}\n\n// Separate component for each field to prevent re-rendering all fields\nconst CommandFormFieldWrapper = ({ field, index }: { field: React.ReactElement<CommandFormFieldProps<any>>; index: number }) => {\n    const context = useCommandFormContext<any>();\n    const fieldProps = field.props as CommandFormFieldProps<any>;\n    const propertyAccessor = fieldProps.value;\n\n    // Get the property name from the accessor function\n    const propertyName = propertyAccessor ? getPropertyName(propertyAccessor) : '';\n\n    // Get the current value from the command instance\n    const currentValue = propertyName ? (context.commandInstance as any)?.[propertyName] : undefined;\n\n    // Get the error message for this field, if any\n    const errorMessage = propertyName ? context.getFieldError(propertyName) : undefined;\n\n    // Get the property descriptor for this field from the command instance\n    const propertyDescriptor = propertyName && (context.commandInstance as any)?.propertyDescriptors\n        ? (context.commandInstance as any).propertyDescriptors.find((pd: any) => pd.name === propertyName)\n        : undefined;\n\n    // Clone the field element with the current value and onChange handler\n    const clonedField = React.cloneElement(field as React.ReactElement, {\n        ...fieldProps,\n        currentValue,\n        propertyDescriptor,\n        fieldName: propertyName,\n        onValueChange: (value: unknown) => {\n            if (propertyName) {\n                const oldValue = currentValue;\n\n                // Call custom field validator if provided\n                if (context.onFieldValidate) {\n                    const validationError = context.onFieldValidate(context.commandInstance as any, propertyName, oldValue, value);\n                    context.setCustomFieldError(propertyName, validationError);\n                }\n\n                context.setCommandValues({ [propertyName]: value } as any);\n\n                // Call field change callback if provided\n                if (context.onFieldChange) {\n                    context.onFieldChange(context.commandInstance as any, propertyName, oldValue, value);\n                }\n            }\n            fieldProps.onChange?.(value as any);\n        },\n        required: fieldProps.required ?? true,\n        invalid: !!errorMessage\n    } as any);\n\n    const tooltipId = fieldProps.description ? `tooltip-${propertyName}-${index}` : undefined;\n\n    return (\n        <div style={{ width: '100%' }}>\n            <div className=\"p-inputgroup\" style={{ width: '100%' }}>\n                {fieldProps.description && (\n                    <Tooltip target={`.${tooltipId}`} content={fieldProps.description} />\n                )}\n                {fieldProps.icon && (\n                    <span className={`p-inputgroup-addon ${tooltipId || ''}`}>\n                        {fieldProps.icon}\n                    </span>\n                )}\n                {clonedField}\n            </div>\n            {errorMessage && (\n                <small className=\"p-error block mt-1\">{errorMessage}</small>\n            )}\n        </div>\n    );\n};\n\nexport const CommandFormFields = (props: CommandFormFieldsProps) => {\n    const { fields, columns } = props;\n\n    // Render columns if provided\n    if (columns && columns.length > 0) {\n        return (\n            <div className=\"card flex flex-column md:flex-row gap-3\">\n                {columns.map((column, columnIndex) => (\n                    <div key={`column-${columnIndex}`} className=\"flex flex-column gap-3 flex-1\">\n                            {column.fields.map((field, index) => {\n                                const fieldProps = field.props as CommandFormFieldProps<any>;\n                                const propertyAccessor = fieldProps.value;\n                                const propertyName = propertyAccessor ? getPropertyName(propertyAccessor) : `field-${columnIndex}-${index}`;\n\n                                return (\n                                    <CommandFormFieldWrapper\n                                        key={propertyName}\n                                        field={field}\n                                        index={index}\n                                    />\n                                );\n                            })}\n                    </div>\n                ))}\n            </div>\n        );\n    }\n\n    // Render fields (single column layout)\n    return (\n        <div style={{ display: 'flex', flexDirection: 'column', gap: '1rem', width: '100%' }}>\n            {(fields || []).map((field, index) => {\n                const fieldProps = field.props as CommandFormFieldProps<any>;\n                const propertyAccessor = fieldProps.value;\n                const propertyName = propertyAccessor ? getPropertyName(propertyAccessor) : `field-${index}`;\n\n                return (\n                    <CommandFormFieldWrapper\n                        key={propertyName}\n                        field={field}\n                        index={index}\n                    />\n                );\n            })}\n        </div>\n    );\n};\n\n// Helper function to extract property name from accessor function\nfunction getPropertyName<T>(accessor: (obj: T) => unknown): string {\n    const fnStr = accessor.toString();\n    const match = fnStr.match(/\\.([a-zA-Z_$][a-zA-Z0-9_$]*)/);\n    return match ? match[1] : '';\n}\n"],"names":["useCommandFormContext","_jsxs","_jsx","Tooltip"],"mappings":"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"}
+{"version":3,"file":"CommandFormFields.js","sources":["../../../CommandForm/CommandFormFields.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 { useCommandFormContext } from './CommandForm';\nimport React from 'react';\nimport { Tooltip } from 'primereact/tooltip';\nimport type { CommandFormFieldProps } from './CommandFormField';\nimport type { ICommandResult } from '@cratis/arc/commands';\n\nexport interface ColumnInfo {\n    fields: React.ReactElement<CommandFormFieldProps<unknown>>[];\n}\n\nexport interface CommandFormFieldsProps {\n    fields?: React.ReactElement<CommandFormFieldProps<unknown>>[];\n    columns?: ColumnInfo[];\n}\n\n// Separate component for each field to prevent re-rendering all fields\nconst CommandFormFieldWrapper = ({ field, index }: { field: React.ReactElement<CommandFormFieldProps<unknown>>; index: number }) => {\n    const context = useCommandFormContext<unknown>();\n    const fieldProps = field.props as CommandFormFieldProps<unknown>;\n    const propertyAccessor = fieldProps.value;\n\n    // Get the property name from the accessor function\n    const propertyName = propertyAccessor ? getPropertyName(propertyAccessor) : '';\n\n    // Get the current value from the command instance\n    const currentValue = propertyName ? (context.commandInstance as Record<string, unknown>)?.[propertyName] : undefined;\n\n    // Get the error message for this field, if any\n    const errorMessage = propertyName ? context.getFieldError(propertyName) : undefined;\n\n    // Get the property descriptor for this field from the command instance\n    const propertyDescriptor = propertyName && (context.commandInstance as Record<string, unknown>)?.propertyDescriptors\n        ? ((context.commandInstance as Record<string, unknown>).propertyDescriptors as Array<Record<string, unknown>>).find((pd: Record<string, unknown>) => pd.name === propertyName)\n        : undefined;\n\n    // Clone the field element with the current value and onChange handler\n    const clonedField = React.cloneElement(field as React.ReactElement, {\n        ...fieldProps,\n        currentValue,\n        propertyDescriptor,\n        fieldName: propertyName,\n        onValueChange: (value: unknown) => {\n            if (propertyName) {\n                const oldValue = currentValue;\n\n                // Update the command value\n                context.setCommandValues({ [propertyName]: value } as Record<string, unknown>);\n\n                // Call validate() on the command instance and store the result\n                if (context.commandInstance && typeof (context.commandInstance as Record<string, unknown>).validate === 'function') {\n                    const validationResult = ((context.commandInstance as Record<string, unknown>).validate as () => ICommandResult<unknown>)();\n                    if (validationResult) {\n                        context.setCommandResult(validationResult);\n                    }\n                }\n\n                // Call custom field validator if provided\n                if (context.onFieldValidate) {\n                    const validationError = context.onFieldValidate(context.commandInstance as Record<string, unknown>, propertyName, oldValue, value);\n                    context.setCustomFieldError(propertyName, validationError);\n                }\n\n                // Call field change callback if provided\n                if (context.onFieldChange) {\n                    context.onFieldChange(context.commandInstance as Record<string, unknown>, propertyName, oldValue, value);\n                }\n            }\n            fieldProps.onChange?.(value as unknown);\n        },\n        required: fieldProps.required ?? true,\n        invalid: !!errorMessage\n    } as Record<string, unknown>);\n\n    const tooltipId = fieldProps.description ? `tooltip-${propertyName}-${index}` : undefined;\n\n    return (\n        <div className=\"w-full\">\n            <div className=\"p-inputgroup w-full\">\n                {fieldProps.description && (\n                    <Tooltip target={`.${tooltipId}`} content={fieldProps.description} />\n                )}\n                {fieldProps.icon && (\n                    <span className={`p-inputgroup-addon ${tooltipId || ''}`}>\n                        {fieldProps.icon}\n                    </span>\n                )}\n                {clonedField}\n            </div>\n            {errorMessage && (\n                <small className=\"p-error block mt-1\">{errorMessage}</small>\n            )}\n        </div>\n    );\n};\n\nexport const CommandFormFields = (props: CommandFormFieldsProps) => {\n    const { fields, columns } = props;\n\n    // Render columns if provided\n    if (columns && columns.length > 0) {\n        return (\n            <div className=\"card flex flex-column md:flex-row gap-3\">\n                {columns.map((column, columnIndex) => (\n                    <div key={`column-${columnIndex}`} className=\"flex flex-column gap-3 flex-1\">\n                            {column.fields.map((field, index) => {\n                                const fieldProps = field.props as CommandFormFieldProps<unknown>;\n                                const propertyAccessor = fieldProps.value;\n                                const propertyName = propertyAccessor ? getPropertyName(propertyAccessor) : `field-${columnIndex}-${index}`;\n\n                                return (\n                                    <CommandFormFieldWrapper\n                                        key={propertyName}\n                                        field={field}\n                                        index={index}\n                                    />\n                                );\n                            })}\n                    </div>\n                ))}\n            </div>\n        );\n    }\n\n    // Render fields (single column layout)\n    return (\n        <div className=\"flex flex-col gap-4 w-full\">\n            {(fields || []).map((field, index) => {\n                const fieldProps = field.props as CommandFormFieldProps<unknown>;\n                const propertyAccessor = fieldProps.value;\n                const propertyName = propertyAccessor ? getPropertyName(propertyAccessor) : `field-${index}`;\n\n                return (\n                    <CommandFormFieldWrapper\n                        key={propertyName}\n                        field={field}\n                        index={index}\n                    />\n                );\n            })}\n        </div>\n    );\n};\n\n// Helper function to extract property name from accessor function\nfunction getPropertyName<T>(accessor: (obj: T) => unknown): string {\n    const fnStr = accessor.toString();\n    const match = fnStr.match(/\\.([a-zA-Z_$][a-zA-Z0-9_$]*)/);\n    return match ? match[1] : '';\n}\n"],"names":["useCommandFormContext","_jsxs","_jsx","Tooltip"],"mappings":"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"}

package/dist/cjs/CommandForm/ValidationMessage.js

@@ -0,0 +1,24 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var CommandForm = require('./CommandForm.js');
+
+const ValidationMessage = (props) => {
+    const context = CommandForm.useCommandFormContext();
+    const propertyAccessor = props.value;
+    const getPropertyName = (accessor) => {
+        const fnStr = accessor.toString();
+        const match = fnStr.match(/\.([a-zA-Z_$][a-zA-Z0-9_$]*)/);
+        return match ? match[1] : '';
+    };
+    const propertyName = getPropertyName(propertyAccessor);
+    const errorMessage = propertyName ? context.getFieldError(propertyName) : undefined;
+    if (!errorMessage) {
+        return null;
+    }
+    return (jsxRuntime.jsx("small", { className: "p-error block mt-1", children: errorMessage }));
+};
+ValidationMessage.displayName = 'ValidationMessage';
+
+exports.ValidationMessage = ValidationMessage;
+//# sourceMappingURL=ValidationMessage.js.map

package/dist/cjs/CommandForm/ValidationMessage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ValidationMessage.js","sources":["../../../CommandForm/ValidationMessage.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 React from 'react';\nimport { useCommandFormContext } from './CommandForm';\n\nexport interface ValidationMessageProps<TCommand> {\n    value: (command: TCommand) => unknown;\n}\n\nexport const ValidationMessage = <TCommand,>(props: ValidationMessageProps<TCommand>) => {\n    const context = useCommandFormContext<TCommand>();\n    const propertyAccessor = props.value;\n    \n    // Get the property name from the accessor function\n    const getPropertyName = (accessor: (obj: TCommand) => unknown): string => {\n        const fnStr = accessor.toString();\n        const match = fnStr.match(/\\.([a-zA-Z_$][a-zA-Z0-9_$]*)/);\n        return match ? match[1] : '';\n    };\n    \n    const propertyName = getPropertyName(propertyAccessor);\n    const errorMessage = propertyName ? context.getFieldError(propertyName) : undefined;\n    \n    if (!errorMessage) {\n        return null;\n    }\n    \n    return (\n        <small className=\"p-error block mt-1\">{errorMessage}</small>\n    );\n};\n\nValidationMessage.displayName = 'ValidationMessage';\n"],"names":["useCommandFormContext","_jsx"],"mappings":";;;;;AAUO,MAAM,iBAAiB,GAAG,CAAY,KAAuC,KAAI;AACpF,IAAA,MAAM,OAAO,GAAGA,iCAAqB,EAAY;AACjD,IAAA,MAAM,gBAAgB,GAAG,KAAK,CAAC,KAAK;AAGpC,IAAA,MAAM,eAAe,GAAG,CAAC,QAAoC,KAAY;AACrE,QAAA,MAAM,KAAK,GAAG,QAAQ,CAAC,QAAQ,EAAE;QACjC,MAAM,KAAK,GAAG,KAAK,CAAC,KAAK,CAAC,8BAA8B,CAAC;AACzD,QAAA,OAAO,KAAK,GAAG,KAAK,CAAC,CAAC,CAAC,GAAG,EAAE;AAChC,IAAA,CAAC;AAED,IAAA,MAAM,YAAY,GAAG,eAAe,CAAC,gBAAgB,CAAC;AACtD,IAAA,MAAM,YAAY,GAAG,YAAY,GAAG,OAAO,CAAC,aAAa,CAAC,YAAY,CAAC,GAAG,SAAS;IAEnF,IAAI,CAAC,YAAY,EAAE;AACf,QAAA,OAAO,IAAI;IACf;IAEA,QACIC,0BAAO,SAAS,EAAC,oBAAoB,EAAA,QAAA,EAAE,YAAY,EAAA,CAAS;AAEpE;AAEA,iBAAiB,CAAC,WAAW,GAAG,mBAAmB;;;;"}

package/dist/cjs/CommandForm/asCommandFormField.js

@@ -0,0 +1,47 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var CommandForm = require('./CommandForm.js');
+
+function asCommandFormField(component, config) {
+    const { defaultValue, extractValue } = config;
+    const Component = typeof component === 'function' && !component.prototype?.render
+        ? component
+        : component;
+    const WrappedField = (props) => {
+        const { currentValue, onValueChange, fieldName, required = true, ...componentProps } = props;
+        const [localValue, setLocalValue] = React.useState(currentValue ?? defaultValue);
+        const { getFieldError, customFieldErrors } = CommandForm.useCommandFormContext();
+        const serverError = fieldName ? getFieldError(fieldName) : undefined;
+        const customError = fieldName ? customFieldErrors[fieldName] : undefined;
+        const errors = [];
+        if (serverError)
+            errors.push(serverError);
+        if (customError)
+            errors.push(customError);
+        const isInvalid = errors.length > 0;
+        React.useEffect(() => {
+            setLocalValue(currentValue ?? defaultValue);
+        }, [currentValue]);
+        const handleChange = (valueOrEvent) => {
+            const newValue = extractValue ? extractValue(valueOrEvent) : valueOrEvent;
+            setLocalValue(newValue);
+            onValueChange?.(newValue);
+        };
+        const wrappedProps = {
+            ...componentProps,
+            value: localValue,
+            onChange: handleChange,
+            invalid: isInvalid,
+            required,
+            errors
+        };
+        return jsxRuntime.jsx(Component, { ...wrappedProps });
+    };
+    WrappedField.displayName = 'CommandFormField';
+    return WrappedField;
+}
+
+exports.asCommandFormField = asCommandFormField;
+//# sourceMappingURL=asCommandFormField.js.map

package/dist/cjs/CommandForm/asCommandFormField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"asCommandFormField.js","sources":["../../../CommandForm/asCommandFormField.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 { PropertyAccessor } from '@cratis/fundamentals';\nimport { PropertyDescriptor } from '@cratis/arc/reflection';\nimport React, { useState, useEffect, ComponentType } from 'react';\nimport { useCommandFormContext } from './CommandForm';\n\n/**\n * Props that will be injected by CommandFormFields into your wrapped component\n */\nexport interface InjectedCommandFormFieldProps {\n    currentValue?: unknown;\n    onValueChange?: (value: unknown) => void;\n    propertyDescriptor?: PropertyDescriptor;\n    fieldName?: string;\n}\n\n/**\n * Props that your field component should accept (excluding the injected ones)\n */\nexport interface BaseCommandFormFieldProps<TCommand> {\n    icon?: React.ReactElement;\n    value: PropertyAccessor<TCommand>;\n    required?: boolean;\n    title?: string;\n    description?: string;\n}\n\n/**\n * Configuration for the field wrapper\n */\nexport interface CommandFormFieldConfig<TValue = unknown> {\n    /** Default value when currentValue is undefined */\n    defaultValue: TValue;\n    /** Value extractor from the change event */\n    extractValue?: (event: unknown) => TValue;\n}\n\n/**\n * Props that your wrapped component will receive\n */\nexport interface WrappedFieldProps<TValue = unknown> {\n    value: TValue;\n    onChange: (valueOrEvent: TValue | unknown) => void;\n    invalid: boolean;\n    required: boolean;\n    errors: string[];\n}\n\n/**\n * Wraps a field component to work with CommandForm, handling all integration automatically.\n * \n * @example\n * ```typescript\n * interface MyInputProps extends WrappedFieldProps<string> {\n *     placeholder?: string;\n * }\n * \n * export const MyInputField = asCommandFormField<MyInputProps>(\n *     (props) => (\n *         <div>\n *             <input\n *                 value={props.value}\n *                 onChange={props.onChange}\n *                 placeholder={props.placeholder}\n *                 className={props.invalid ? 'invalid' : ''}\n *             />\n *             {props.errors.length > 0 && (\n *                 <div className=\"error-messages\">\n *                     {props.errors.map((error, idx) => (\n *                         <small key={idx} className=\"p-error\">{error}</small>\n *                     ))}\n *                 </div>\n *             )}\n *         </div>\n *     ),\n *     {\n *         defaultValue: '',\n *         extractValue: (e) => e.target.value\n *     }\n * );\n * ```\n */\nexport function asCommandFormField<TComponentProps extends WrappedFieldProps<unknown>>(\n    component: ComponentType<TComponentProps> | ((props: TComponentProps) => React.ReactElement),\n    config: CommandFormFieldConfig<TComponentProps['value']>\n) {\n    const { defaultValue, extractValue } = config;\n    const Component = typeof component === 'function' && !component.prototype?.render \n        ? component \n        : component as ComponentType<TComponentProps>;\n\n    const WrappedField = <TCommand,>(\n        props: Omit<TComponentProps, keyof WrappedFieldProps> & \n               BaseCommandFormFieldProps<TCommand> & \n               InjectedCommandFormFieldProps\n    ) => {\n        const { \n            currentValue, \n            onValueChange, \n            fieldName, \n            required = true,\n            ...componentProps \n        } = props;\n\n        const [localValue, setLocalValue] = useState(currentValue ?? defaultValue);\n        const { getFieldError, customFieldErrors } = useCommandFormContext();\n\n        const serverError = fieldName ? getFieldError(fieldName) : undefined;\n        const customError = fieldName ? customFieldErrors[fieldName] : undefined;\n        \n        const errors: string[] = [];\n        if (serverError) errors.push(serverError);\n        if (customError) errors.push(customError);\n\n        const isInvalid = errors.length > 0;\n\n        useEffect(() => {\n            setLocalValue(currentValue ?? defaultValue);\n        }, [currentValue]);\n\n        const handleChange = (valueOrEvent: unknown) => {\n            const newValue = extractValue ? extractValue(valueOrEvent) : valueOrEvent;\n            setLocalValue(newValue);\n            onValueChange?.(newValue);\n        };\n\n        const wrappedProps = {\n            ...componentProps,\n            value: localValue,\n            onChange: handleChange,\n            invalid: isInvalid,\n            required,\n            errors\n        } as TComponentProps;\n\n        return <Component {...wrappedProps} />;\n    };\n\n    WrappedField.displayName = 'CommandFormField';\n\n    return WrappedField;\n}\n"],"names":["useState","useCommandFormContext","useEffect","_jsx"],"mappings":";;;;;;AAoFM,SAAU,kBAAkB,CAC9B,SAA4F,EAC5F,MAAwD,EAAA;AAExD,IAAA,MAAM,EAAE,YAAY,EAAE,YAAY,EAAE,GAAG,MAAM;AAC7C,IAAA,MAAM,SAAS,GAAG,OAAO,SAAS,KAAK,UAAU,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE;AACvE,UAAE;UACA,SAA2C;AAEjD,IAAA,MAAM,YAAY,GAAG,CACjB,KAEoC,KACpC;AACA,QAAA,MAAM,EACF,YAAY,EACZ,aAAa,EACb,SAAS,EACT,QAAQ,GAAG,IAAI,EACf,GAAG,cAAc,EACpB,GAAG,KAAK;AAET,QAAA,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAGA,cAAQ,CAAC,YAAY,IAAI,YAAY,CAAC;QAC1E,MAAM,EAAE,aAAa,EAAE,iBAAiB,EAAE,GAAGC,iCAAqB,EAAE;AAEpE,QAAA,MAAM,WAAW,GAAG,SAAS,GAAG,aAAa,CAAC,SAAS,CAAC,GAAG,SAAS;AACpE,QAAA,MAAM,WAAW,GAAG,SAAS,GAAG,iBAAiB,CAAC,SAAS,CAAC,GAAG,SAAS;QAExE,MAAM,MAAM,GAAa,EAAE;AAC3B,QAAA,IAAI,WAAW;AAAE,YAAA,MAAM,CAAC,IAAI,CAAC,WAAW,CAAC;AACzC,QAAA,IAAI,WAAW;AAAE,YAAA,MAAM,CAAC,IAAI,CAAC,WAAW,CAAC;AAEzC,QAAA,MAAM,SAAS,GAAG,MAAM,CAAC,MAAM,GAAG,CAAC;QAEnCC,eAAS,CAAC,MAAK;AACX,YAAA,aAAa,CAAC,YAAY,IAAI,YAAY,CAAC;AAC/C,QAAA,CAAC,EAAE,CAAC,YAAY,CAAC,CAAC;AAElB,QAAA,MAAM,YAAY,GAAG,CAAC,YAAqB,KAAI;AAC3C,YAAA,MAAM,QAAQ,GAAG,YAAY,GAAG,YAAY,CAAC,YAAY,CAAC,GAAG,YAAY;YACzE,aAAa,CAAC,QAAQ,CAAC;AACvB,YAAA,aAAa,GAAG,QAAQ,CAAC;AAC7B,QAAA,CAAC;AAED,QAAA,MAAM,YAAY,GAAG;AACjB,YAAA,GAAG,cAAc;AACjB,YAAA,KAAK,EAAE,UAAU;AACjB,YAAA,QAAQ,EAAE,YAAY;AACtB,YAAA,OAAO,EAAE,SAAS;YAClB,QAAQ;YACR;SACgB;AAEpB,QAAA,OAAOC,cAAA,CAAC,SAAS,EAAA,EAAA,GAAK,YAAY,GAAI;AAC1C,IAAA,CAAC;AAED,IAAA,YAAY,CAAC,WAAW,GAAG,kBAAkB;AAE7C,IAAA,OAAO,YAAY;AACvB;;;;"}

package/dist/cjs/CommandForm/fields/CheckboxField.js

@@ -0,0 +1,13 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var checkbox = require('primereact/checkbox');
+var asCommandFormField = require('../asCommandFormField.js');
+
+const CheckboxField = asCommandFormField.asCommandFormField((props) => (jsxRuntime.jsxs("div", { className: "flex align-items-center", children: [jsxRuntime.jsx(checkbox.Checkbox, { checked: props.value, onChange: props.onChange, invalid: props.invalid }), props.label && jsxRuntime.jsx("label", { className: "ml-2", children: props.label })] })), {
+    defaultValue: false,
+    extractValue: (e) => e.checked
+});
+
+exports.CheckboxField = CheckboxField;
+//# sourceMappingURL=CheckboxField.js.map

package/dist/cjs/CommandForm/fields/CheckboxField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckboxField.js","sources":["../../../../CommandForm/fields/CheckboxField.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 { Checkbox } from 'primereact/checkbox';\nimport React from 'react';\nimport { asCommandFormField, WrappedFieldProps } from '../asCommandFormField';\n\ninterface CheckboxFieldComponentProps extends WrappedFieldProps<boolean> {\n    label?: string;\n}\n\nexport const CheckboxField = asCommandFormField<CheckboxFieldComponentProps>(\n    (props) => (\n        <div className=\"flex align-items-center\">\n            <Checkbox\n                checked={props.value}\n                onChange={props.onChange}\n                invalid={props.invalid}\n            />\n            {props.label && <label className=\"ml-2\">{props.label}</label>}\n        </div>\n    ),\n    {\n        defaultValue: false,\n        extractValue: (e: { checked: boolean }) => e.checked\n    }\n);\n"],"names":["asCommandFormField","_jsxs","_jsx","Checkbox"],"mappings":";;;;;;AAWO,MAAM,aAAa,GAAGA,qCAAkB,CAC3C,CAAC,KAAK,MACFC,yBAAK,SAAS,EAAC,yBAAyB,EAAA,QAAA,EAAA,CACpCC,cAAA,CAACC,iBAAQ,EAAA,EACL,OAAO,EAAE,KAAK,CAAC,KAAK,EACpB,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,OAAO,EAAE,KAAK,CAAC,OAAO,EAAA,CACxB,EACD,KAAK,CAAC,KAAK,IAAID,cAAA,CAAA,OAAA,EAAA,EAAO,SAAS,EAAC,MAAM,EAAA,QAAA,EAAE,KAAK,CAAC,KAAK,EAAA,CAAS,CAAA,EAAA,CAC3D,CACT,EACD;AACI,IAAA,YAAY,EAAE,KAAK;IACnB,YAAY,EAAE,CAAC,CAAuB,KAAK,CAAC,CAAC;AAChD,CAAA;;;;"}

package/dist/cjs/CommandForm/fields/DropdownField.js

@@ -0,0 +1,13 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var asCommandFormField = require('../asCommandFormField.js');
+
+const SelectComponent = (props) => (jsxRuntime.jsxs("select", { value: props.value || '', onChange: props.onChange, required: props.required, className: `w-full p-3 rounded-md text-base ${props.invalid ? 'border border-red-500' : 'border border-gray-300'}`, children: [props.placeholder && jsxRuntime.jsx("option", { value: "", children: props.placeholder }), props.options.map((option, index) => (jsxRuntime.jsx("option", { value: String(option[props.optionIdField]), children: String(option[props.optionLabelField]) }, index)))] }));
+const SelectField = asCommandFormField.asCommandFormField(SelectComponent, {
+    defaultValue: '',
+    extractValue: (e) => e.target.value
+});
+
+exports.SelectField = SelectField;
+//# sourceMappingURL=DropdownField.js.map

package/dist/cjs/CommandForm/fields/DropdownField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DropdownField.js","sources":["../../../../CommandForm/fields/DropdownField.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 React from 'react';\nimport { asCommandFormField, WrappedFieldProps } from '../asCommandFormField';\n\ninterface SelectComponentProps extends WrappedFieldProps<string> {\n    options: Array<{ [key: string]: unknown }>;\n    optionIdField: string;\n    optionLabelField: string;\n    placeholder?: string;\n}\n\nconst SelectComponent = (props: SelectComponentProps) => (\n    <select\n        value={props.value || ''}\n        onChange={props.onChange}\n        required={props.required}\n        className={`w-full p-3 rounded-md text-base ${props.invalid ? 'border border-red-500' : 'border border-gray-300'}`}\n    >\n        {props.placeholder && <option value=\"\">{props.placeholder}</option>}\n        {props.options.map((option, index) => (\n            <option key={index} value={String(option[props.optionIdField])}>\n                {String(option[props.optionLabelField])}\n            </option>\n        ))}\n    </select>\n);\n\nexport const SelectField = asCommandFormField<SelectComponentProps>(\n    SelectComponent,\n    {\n        defaultValue: '',\n        extractValue: (e: React.ChangeEvent<HTMLSelectElement>) => e.target.value\n    }\n);\n"],"names":["_jsxs","_jsx","asCommandFormField"],"mappings":";;;;;AAaA,MAAM,eAAe,GAAG,CAAC,KAA2B,MAChDA,eAAA,CAAA,QAAA,EAAA,EACI,KAAK,EAAE,KAAK,CAAC,KAAK,IAAI,EAAE,EACxB,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,SAAS,EAAE,CAAA,gCAAA,EAAmC,KAAK,CAAC,OAAO,GAAG,uBAAuB,GAAG,wBAAwB,CAAA,CAAE,aAEjH,KAAK,CAAC,WAAW,IAAIC,cAAA,CAAA,QAAA,EAAA,EAAQ,KAAK,EAAC,EAAE,EAAA,QAAA,EAAE,KAAK,CAAC,WAAW,GAAU,EAClE,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,KAAK,MAC7BA,cAAA,CAAA,QAAA,EAAA,EAAoB,KAAK,EAAE,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,aAAa,CAAC,CAAC,EAAA,QAAA,EACzD,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,gBAAgB,CAAC,CAAC,EAAA,EAD9B,KAAK,CAET,CACZ,CAAC,CAAA,EAAA,CACG,CACZ;AAEM,MAAM,WAAW,GAAGC,qCAAkB,CACzC,eAAe,EACf;AACI,IAAA,YAAY,EAAE,EAAE;IAChB,YAAY,EAAE,CAAC,CAAuC,KAAK,CAAC,CAAC,MAAM,CAAC;AACvE,CAAA;;;;"}

package/dist/cjs/CommandForm/fields/InputTextField.js

@@ -0,0 +1,13 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var inputtext = require('primereact/inputtext');
+var asCommandFormField = require('../asCommandFormField.js');
+
+const InputTextField = asCommandFormField.asCommandFormField((props) => (jsxRuntime.jsx(inputtext.InputText, { type: props.type || 'text', value: props.value, onChange: props.onChange, invalid: props.invalid, placeholder: props.placeholder, className: "w-full" })), {
+    defaultValue: '',
+    extractValue: (e) => e.target.value
+});
+
+exports.InputTextField = InputTextField;
+//# sourceMappingURL=InputTextField.js.map

package/dist/cjs/CommandForm/fields/InputTextField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InputTextField.js","sources":["../../../../CommandForm/fields/InputTextField.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 { InputText } from 'primereact/inputtext';\nimport React from 'react';\nimport { asCommandFormField, WrappedFieldProps } from '../asCommandFormField';\n\ninterface InputTextComponentProps extends WrappedFieldProps<string> {\n    type?: 'text' | 'email' | 'password' | 'color' | 'date' | 'datetime-local' | 'time' | 'url' | 'tel' | 'search';\n    placeholder?: string;\n}\n\nexport const InputTextField = asCommandFormField<InputTextComponentProps>(\n    (props) => (\n        <InputText\n            type={props.type || 'text'}\n            value={props.value}\n            onChange={props.onChange}\n            invalid={props.invalid}\n            placeholder={props.placeholder}\n            className=\"w-full\"\n        />\n    ),\n    {\n        defaultValue: '',\n        extractValue: (e: React.ChangeEvent<HTMLInputElement>) => e.target.value\n    }\n);\n"],"names":["asCommandFormField","_jsx","InputText"],"mappings":";;;;;;AAYO,MAAM,cAAc,GAAGA,qCAAkB,CAC5C,CAAC,KAAK,MACFC,eAACC,mBAAS,EAAA,EACN,IAAI,EAAE,KAAK,CAAC,IAAI,IAAI,MAAM,EAC1B,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,WAAW,EAAE,KAAK,CAAC,WAAW,EAC9B,SAAS,EAAC,QAAQ,EAAA,CACpB,CACL,EACD;AACI,IAAA,YAAY,EAAE,EAAE;IAChB,YAAY,EAAE,CAAC,CAAsC,KAAK,CAAC,CAAC,MAAM,CAAC;AACtE,CAAA;;;;"}

package/dist/cjs/CommandForm/fields/NumberField.js

@@ -0,0 +1,13 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var inputnumber = require('primereact/inputnumber');
+var asCommandFormField = require('../asCommandFormField.js');
+
+const NumberField = asCommandFormField.asCommandFormField((props) => (jsxRuntime.jsx(inputnumber.InputNumber, { value: props.value, onValueChange: (e) => props.onChange(e.value ?? 0), invalid: props.invalid, placeholder: props.placeholder, min: props.min, max: props.max, step: props.step, className: "w-full" })), {
+    defaultValue: 0,
+    extractValue: (e) => (typeof e === 'number' ? e : 0)
+});
+
+exports.NumberField = NumberField;
+//# sourceMappingURL=NumberField.js.map

package/dist/cjs/CommandForm/fields/NumberField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NumberField.js","sources":["../../../../CommandForm/fields/NumberField.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 { InputNumber } from 'primereact/inputnumber';\nimport React from 'react';\nimport { asCommandFormField, WrappedFieldProps } from '../asCommandFormField';\n\ninterface NumberFieldComponentProps extends WrappedFieldProps<number> {\n    placeholder?: string;\n    min?: number;\n    max?: number;\n    step?: number;\n}\n\nexport const NumberField = asCommandFormField<NumberFieldComponentProps>(\n    (props) => (\n        <InputNumber\n            value={props.value}\n            onValueChange={(e) => props.onChange(e.value ?? 0)}\n            invalid={props.invalid}\n            placeholder={props.placeholder}\n            min={props.min}\n            max={props.max}\n            step={props.step}\n            className=\"w-full\"\n        />\n    ),\n    {\n        defaultValue: 0,\n        extractValue: (e: unknown) => (typeof e === 'number' ? e : 0)\n    }\n);\n"],"names":["asCommandFormField","_jsx","InputNumber"],"mappings":";;;;;;AAcO,MAAM,WAAW,GAAGA,qCAAkB,CACzC,CAAC,KAAK,MACFC,cAAA,CAACC,uBAAW,IACR,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,aAAa,EAAE,CAAC,CAAC,KAAK,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,EAClD,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,WAAW,EAAE,KAAK,CAAC,WAAW,EAC9B,GAAG,EAAE,KAAK,CAAC,GAAG,EACd,GAAG,EAAE,KAAK,CAAC,GAAG,EACd,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,SAAS,EAAC,QAAQ,EAAA,CACpB,CACL,EACD;AACI,IAAA,YAAY,EAAE,CAAC;AACf,IAAA,YAAY,EAAE,CAAC,CAAU,MAAM,OAAO,CAAC,KAAK,QAAQ,GAAG,CAAC,GAAG,CAAC;AAC/D,CAAA;;;;"}

package/dist/cjs/CommandForm/fields/SliderField.js

@@ -0,0 +1,17 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var asCommandFormField = require('../asCommandFormField.js');
+
+const RangeField = asCommandFormField.asCommandFormField((props) => {
+    const min = props.min ?? 0;
+    const max = props.max ?? 100;
+    const step = props.step ?? 1;
+    return (jsxRuntime.jsxs("div", { className: "w-full flex items-center gap-4 p-3 border border-gray-300 rounded-md", children: [jsxRuntime.jsx("input", { type: "range", value: props.value, onChange: props.onChange, min: min, max: max, step: step, required: props.required, className: "flex-1" }), jsxRuntime.jsx("span", { className: "min-w-[3rem] text-right font-semibold", children: props.value })] }));
+}, {
+    defaultValue: 0,
+    extractValue: (e) => parseFloat(e.target.value)
+});
+
+exports.RangeField = RangeField;
+//# sourceMappingURL=SliderField.js.map

package/dist/cjs/CommandForm/fields/SliderField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SliderField.js","sources":["../../../../CommandForm/fields/SliderField.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 React from 'react';\nimport { asCommandFormField, WrappedFieldProps } from '../asCommandFormField';\n\ninterface RangeComponentProps extends WrappedFieldProps<number> {\n    min?: number;\n    max?: number;\n    step?: number;\n}\n\nexport const RangeField = asCommandFormField<RangeComponentProps>(\n    (props) => {\n        const min = props.min ?? 0;\n        const max = props.max ?? 100;\n        const step = props.step ?? 1;\n\n        return (\n            <div className=\"w-full flex items-center gap-4 p-3 border border-gray-300 rounded-md\">\n                <input\n                    type=\"range\"\n                    value={props.value}\n                    onChange={props.onChange}\n                    min={min}\n                    max={max}\n                    step={step}\n                    required={props.required}\n                    className=\"flex-1\"\n                />\n                <span className=\"min-w-[3rem] text-right font-semibold\">\n                    {props.value}\n                </span>\n            </div>\n        );\n    },\n    {\n        defaultValue: 0,\n        extractValue: (e: React.ChangeEvent<HTMLInputElement>) => parseFloat(e.target.value)\n    }\n);\n"],"names":["asCommandFormField","_jsxs","_jsx"],"mappings":";;;;;MAYa,UAAU,GAAGA,qCAAkB,CACxC,CAAC,KAAK,KAAI;AACN,IAAA,MAAM,GAAG,GAAG,KAAK,CAAC,GAAG,IAAI,CAAC;AAC1B,IAAA,MAAM,GAAG,GAAG,KAAK,CAAC,GAAG,IAAI,GAAG;AAC5B,IAAA,MAAM,IAAI,GAAG,KAAK,CAAC,IAAI,IAAI,CAAC;IAE5B,QACIC,eAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,sEAAsE,EAAA,QAAA,EAAA,CACjFC,cAAA,CAAA,OAAA,EAAA,EACI,IAAI,EAAC,OAAO,EACZ,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,GAAG,EAAE,GAAG,EACR,GAAG,EAAE,GAAG,EACR,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,SAAS,EAAC,QAAQ,EAAA,CACpB,EACFA,cAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,uCAAuC,EAAA,QAAA,EAClD,KAAK,CAAC,KAAK,EAAA,CACT,CAAA,EAAA,CACL;AAEd,CAAC,EACD;AACI,IAAA,YAAY,EAAE,CAAC;AACf,IAAA,YAAY,EAAE,CAAC,CAAsC,KAAK,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK;AACtF,CAAA;;;;"}

package/dist/cjs/CommandForm/fields/TextAreaField.js

@@ -0,0 +1,13 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var inputtextarea = require('primereact/inputtextarea');
+var asCommandFormField = require('../asCommandFormField.js');
+
+const TextAreaField = asCommandFormField.asCommandFormField((props) => (jsxRuntime.jsx(inputtextarea.InputTextarea, { value: props.value, onChange: props.onChange, invalid: props.invalid, placeholder: props.placeholder, rows: props.rows ?? 5, cols: props.cols, className: "w-full" })), {
+    defaultValue: '',
+    extractValue: (e) => e.target.value
+});
+
+exports.TextAreaField = TextAreaField;
+//# sourceMappingURL=TextAreaField.js.map

package/dist/cjs/CommandForm/fields/TextAreaField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextAreaField.js","sources":["../../../../CommandForm/fields/TextAreaField.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 { InputTextarea } from 'primereact/inputtextarea';\nimport React from 'react';\nimport { asCommandFormField, WrappedFieldProps } from '../asCommandFormField';\n\ninterface TextAreaFieldComponentProps extends WrappedFieldProps<string> {\n    placeholder?: string;\n    rows?: number;\n    cols?: number;\n}\n\nexport const TextAreaField = asCommandFormField<TextAreaFieldComponentProps>(\n    (props) => (\n        <InputTextarea\n            value={props.value}\n            onChange={props.onChange}\n            invalid={props.invalid}\n            placeholder={props.placeholder}\n            rows={props.rows ?? 5}\n            cols={props.cols}\n            className=\"w-full\"\n        />\n    ),\n    {\n        defaultValue: '',\n        extractValue: (e: React.ChangeEvent<HTMLTextAreaElement>) => e.target.value\n    }\n);\n"],"names":["asCommandFormField","_jsx","InputTextarea"],"mappings":";;;;;;AAaO,MAAM,aAAa,GAAGA,qCAAkB,CAC3C,CAAC,KAAK,MACFC,cAAA,CAACC,2BAAa,EAAA,EACV,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,WAAW,EAAE,KAAK,CAAC,WAAW,EAC9B,IAAI,EAAE,KAAK,CAAC,IAAI,IAAI,CAAC,EACrB,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,SAAS,EAAC,QAAQ,EAAA,CACpB,CACL,EACD;AACI,IAAA,YAAY,EAAE,EAAE;IAChB,YAAY,EAAE,CAAC,CAAyC,KAAK,CAAC,CAAC,MAAM,CAAC;AACzE,CAAA;;;;"}

package/dist/cjs/CommandForm/index.js

@@ -2,11 +2,15 @@
 
 var CommandForm = require('./CommandForm.js');
 var CommandFormField = require('./CommandFormField.js');
+var ValidationMessage = require('./ValidationMessage.js');
 var CommandFormFields = require('./CommandFormFields.js');
-var InputTextField = require('./InputTextField.js');
-var DatePickerField = require('./DatePickerField.js');
-var DropdownField = require('./DropdownField.js');
-var SliderField = require('./SliderField.js');
+var asCommandFormField = require('./asCommandFormField.js');
+var InputTextField = require('./fields/InputTextField.js');
+var NumberField = require('./fields/NumberField.js');
+var CheckboxField = require('./fields/CheckboxField.js');
+var TextAreaField = require('./fields/TextAreaField.js');
+var DropdownField = require('./fields/DropdownField.js');
+var SliderField = require('./fields/SliderField.js');
 
 
 
@@ -15,9 +19,13 @@ exports.useCommandFormContext = CommandForm.useCommandFormContext;
 exports.useCommandInstance = CommandForm.useCommandInstance;
 exports.useSetCommandResult = CommandForm.useSetCommandResult;
 exports.CommandFormField = CommandFormField.CommandFormField;
+exports.ValidationMessage = ValidationMessage.ValidationMessage;
 exports.CommandFormFields = CommandFormFields.CommandFormFields;
+exports.asCommandFormField = asCommandFormField.asCommandFormField;
 exports.InputTextField = InputTextField.InputTextField;
-exports.DatePickerField = DatePickerField.DatePickerField;
-exports.DropdownField = DropdownField.DropdownField;
-exports.SliderField = SliderField.SliderField;
+exports.NumberField = NumberField.NumberField;
+exports.CheckboxField = CheckboxField.CheckboxField;
+exports.TextAreaField = TextAreaField.TextAreaField;
+exports.SelectField = DropdownField.SelectField;
+exports.RangeField = SliderField.RangeField;
 //# sourceMappingURL=index.js.map

package/dist/cjs/CommandForm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/cjs/DataTables/DataTableForObservableQuery.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataTableForObservableQuery.js","sources":["../../../DataTables/DataTableForObservableQuery.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 { DataTable, DataTableFilterMeta, DataTableSelectionSingleChangeEvent } from 'primereact/datatable';\nimport { Constructor } from '@cratis/fundamentals';\nimport { IObservableQueryFor, Paging } from '@cratis/arc/queries';\nimport { useObservableQueryWithPaging } from '@cratis/arc.react/queries';\nimport { ReactNode, useState } from 'react';\n\n \n\n/**\n * Props for the DataTableForQuery component\n */\nexport interface DataTableForObservableQueryProps<TQuery extends IObservableQueryFor<TDataType>, TDataType, TArguments> {\n    /**\n     * Children to render\n     */\n    children?: ReactNode;\n\n    /**\n     * The type of query to use\n     */\n    query: Constructor<TQuery>;\n\n    /**\n     * Optional arguments to pass to the query\n     */\n    queryArguments?: TArguments;\n\n    /**\n     * The message to show when there is no data\n     */\n    emptyMessage: string;\n\n    /**\n     * The key to use for the data\n     */\n    dataKey?: string | undefined;\n\n    /**\n     * The current selection.\n     */\n    selection?: any | undefined | null;\n\n    /**\n     * Callback for when the selection changes\n     */\n    onSelectionChange?(event: DataTableSelectionSingleChangeEvent<any>): void;\n\n    /**\n     * Fields to use for global filtering\n     */\n    globalFilterFields?: string[] | undefined;\n\n    /**\n     * Default filters to use\n     */\n    defaultFilters?: DataTableFilterMeta;\n}\n\nconst paging = new Paging(0, 20);\n\n/**\n * Represents a DataTable for a query.\n * @param props Props for the component\n * @returns Function to render the DataTableForQuery component\n */\nexport const DataTableForObservableQuery = <TQuery extends IObservableQueryFor<TDataType, TArguments>, TDataType, TArguments extends object>(props: DataTableForObservableQueryProps<TQuery, TDataType, TArguments>) => {\n    const [filters, setFilters] = useState<DataTableFilterMeta>(props.defaultFilters ?? {});\n    const [result, , setPage] = useObservableQueryWithPaging(props.query, paging, props.queryArguments);\n\n    return (\n        <DataTable\n            value={result.data}\n            lazy\n            rows={paging.pageSize}\n            totalRecords={result.paging.totalItems}\n            paginator\n            alwaysShowPaginator={false}\n            first={result.paging.page * paging.pageSize}\n            onPage={(e) => setPage(e.page ?? 0)}\n            scrollable\n            scrollHeight={'flex'}\n            selectionMode='single'\n            selection={props.selection}\n            onSelectionChange={props.onSelectionChange}\n            dataKey={props.dataKey}\n            filters={filters}\n            filterDisplay='menu'\n            onFilter={(e) => setFilters(e.filters)}\n            globalFilterFields={props.globalFilterFields}\n            emptyMessage={props.emptyMessage}>\n            {props.children}\n        </DataTable>\n    );\n};\n"],"names":["Paging","useState","useObservableQueryWithPaging","_jsx","DataTable"],"mappings":";;;;;;;;AA6DA,MAAM,MAAM,GAAG,IAAIA,cAAM,CAAC,CAAC,EAAE,EAAE,CAAC;AAOzB,MAAM,2BAA2B,GAAG,CAAkG,KAAsE,KAAI;AACnN,IAAA,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAGC,cAAQ,CAAsB,KAAK,CAAC,cAAc,IAAI,EAAE,CAAC;IACvF,MAAM,CAAC,MAAM,IAAI,OAAO,CAAC,GAAGC,sCAA4B,CAAC,KAAK,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,cAAc,CAAC;AAEnG,IAAA,QACIC,cAAA,CAACC,mBAAS,EAAA,EACN,KAAK,EAAE,MAAM,CAAC,IAAI,EAClB,IAAI,EAAA,IAAA,EACJ,IAAI,EAAE,MAAM,CAAC,QAAQ,EACrB,YAAY,EAAE,MAAM,CAAC,MAAM,CAAC,UAAU,EACtC,SAAS,EAAA,IAAA,EACT,mBAAmB,EAAE,KAAK,EAC1B,KAAK,EAAE,MAAM,CAAC,MAAM,CAAC,IAAI,GAAG,MAAM,CAAC,QAAQ,EAC3C,MAAM,EAAE,CAAC,CAAC,KAAK,OAAO,CAAC,CAAC,CAAC,IAAI,IAAI,CAAC,CAAC,EACnC,UAAU,EAAA,IAAA,EACV,YAAY,EAAE,MAAM,EACpB,aAAa,EAAC,QAAQ,EACtB,SAAS,EAAE,KAAK,CAAC,SAAS,EAC1B,iBAAiB,EAAE,KAAK,CAAC,iBAAiB,EAC1C,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,OAAO,EAAE,OAAO,EAChB,aAAa,EAAC,MAAM,EACpB,QAAQ,EAAE,CAAC,CAAC,KAAK,UAAU,CAAC,CAAC,CAAC,OAAO,CAAC,EACtC,kBAAkB,EAAE,KAAK,CAAC,kBAAkB,EAC5C,YAAY,EAAE,KAAK,CAAC,YAAY,EAAA,QAAA,EAC/B,KAAK,CAAC,QAAQ,EAAA,CACP;AAEpB;;;;"}
+{"version":3,"file":"DataTableForObservableQuery.js","sources":["../../../DataTables/DataTableForObservableQuery.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 { DataTable, DataTableFilterMeta, DataTableSelectionSingleChangeEvent } from 'primereact/datatable';\nimport { Constructor } from '@cratis/fundamentals';\nimport { IObservableQueryFor, Paging } from '@cratis/arc/queries';\nimport { useObservableQueryWithPaging } from '@cratis/arc.react/queries';\nimport { ReactNode, useState } from 'react';\n\n \n\n/**\n * Props for the DataTableForQuery component\n */\nexport interface DataTableForObservableQueryProps<TQuery extends IObservableQueryFor<TDataType, TArguments>, TDataType extends object, TArguments extends object> {\n    /**\n     * Children to render\n     */\n    children?: ReactNode;\n\n    /**\n     * The type of query to use\n     */\n    query: Constructor<TQuery>;\n\n    /**\n     * Optional arguments to pass to the query\n     */\n    queryArguments?: TArguments;\n\n    /**\n     * The message to show when there is no data\n     */\n    emptyMessage: string;\n\n    /**\n     * The key to use for the data\n     */\n    dataKey?: string | undefined;\n\n    /**\n     * The current selection.\n     */\n    selection?: TDataType | undefined | null;\n\n    /**\n     * Callback for when the selection changes\n     */\n    onSelectionChange?(event: DataTableSelectionSingleChangeEvent<TDataType[]>): void;\n\n    /**\n     * Fields to use for global filtering\n     */\n    globalFilterFields?: string[] | undefined;\n\n    /**\n     * Default filters to use\n     */\n    defaultFilters?: DataTableFilterMeta;\n}\n\nconst paging = new Paging(0, 20);\n\n/**\n * Represents a DataTable for a query.\n * @param props Props for the component\n * @returns Function to render the DataTableForQuery component\n */\nexport const DataTableForObservableQuery = <TQuery extends IObservableQueryFor<TDataType, TArguments>, TDataType extends object, TArguments extends object>(props: DataTableForObservableQueryProps<TQuery, TDataType, TArguments>) => {\n    const [filters, setFilters] = useState<DataTableFilterMeta>(props.defaultFilters ?? {});\n    const [result, , setPage] = useObservableQueryWithPaging(props.query, paging, props.queryArguments);\n\n    return (\n        <DataTable\n            value={result.data as unknown as object[]}\n            lazy\n            rows={paging.pageSize}\n            totalRecords={result.paging.totalItems}\n            paginator\n            alwaysShowPaginator={false}\n            first={result.paging.page * paging.pageSize}\n            onPage={(e) => setPage(e.page ?? 0)}\n            scrollable\n            scrollHeight={'flex'}\n            selectionMode='single'\n            selection={props.selection}\n            onSelectionChange={props.onSelectionChange}\n            dataKey={props.dataKey}\n            filters={filters}\n            filterDisplay='menu'\n            onFilter={(e) => setFilters(e.filters)}\n            globalFilterFields={props.globalFilterFields}\n            emptyMessage={props.emptyMessage}>\n            {props.children}\n        </DataTable>\n    );\n};\n"],"names":["Paging","useState","useObservableQueryWithPaging","_jsx","DataTable"],"mappings":";;;;;;;;AA6DA,MAAM,MAAM,GAAG,IAAIA,cAAM,CAAC,CAAC,EAAE,EAAE,CAAC;AAOzB,MAAM,2BAA2B,GAAG,CAAiH,KAAsE,KAAI;AAClO,IAAA,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAGC,cAAQ,CAAsB,KAAK,CAAC,cAAc,IAAI,EAAE,CAAC;IACvF,MAAM,CAAC,MAAM,IAAI,OAAO,CAAC,GAAGC,sCAA4B,CAAC,KAAK,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,cAAc,CAAC;AAEnG,IAAA,QACIC,cAAA,CAACC,mBAAS,EAAA,EACN,KAAK,EAAE,MAAM,CAAC,IAA2B,EACzC,IAAI,EAAA,IAAA,EACJ,IAAI,EAAE,MAAM,CAAC,QAAQ,EACrB,YAAY,EAAE,MAAM,CAAC,MAAM,CAAC,UAAU,EACtC,SAAS,EAAA,IAAA,EACT,mBAAmB,EAAE,KAAK,EAC1B,KAAK,EAAE,MAAM,CAAC,MAAM,CAAC,IAAI,GAAG,MAAM,CAAC,QAAQ,EAC3C,MAAM,EAAE,CAAC,CAAC,KAAK,OAAO,CAAC,CAAC,CAAC,IAAI,IAAI,CAAC,CAAC,EACnC,UAAU,EAAA,IAAA,EACV,YAAY,EAAE,MAAM,EACpB,aAAa,EAAC,QAAQ,EACtB,SAAS,EAAE,KAAK,CAAC,SAAS,EAC1B,iBAAiB,EAAE,KAAK,CAAC,iBAAiB,EAC1C,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,OAAO,EAAE,OAAO,EAChB,aAAa,EAAC,MAAM,EACpB,QAAQ,EAAE,CAAC,CAAC,KAAK,UAAU,CAAC,CAAC,CAAC,OAAO,CAAC,EACtC,kBAAkB,EAAE,KAAK,CAAC,kBAAkB,EAC5C,YAAY,EAAE,KAAK,CAAC,YAAY,EAAA,QAAA,EAC/B,KAAK,CAAC,QAAQ,EAAA,CACP;AAEpB;;;;"}

package/dist/cjs/DataTables/DataTableForQuery.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataTableForQuery.js","sources":["../../../DataTables/DataTableForQuery.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 { DataTable, DataTableFilterMeta, DataTableSelectionSingleChangeEvent } from 'primereact/datatable';\nimport { Constructor } from '@cratis/fundamentals';\nimport { IQueryFor, Paging } from '@cratis/arc/queries';\nimport { useQueryWithPaging } from '@cratis/arc.react/queries';\nimport { ReactNode, useState } from 'react';\n\n \n\n/**\n * Props for the DataTableForQuery component\n */\nexport interface DataTableForQueryProps<TQuery extends IQueryFor<TDataType>, TDataType, TArguments> {\n    /**\n     * Children to render\n     */\n    children?: ReactNode;\n\n    /**\n     * The type of query to use\n     */\n    query: Constructor<TQuery>;\n\n    /**\n     * Optional Arguments to pass to the query\n     */\n    queryArguments?: TArguments;\n\n    /**\n     * The message to show when there is no data\n     */\n    emptyMessage: string;\n\n    /**\n     * The key to use for the data\n     */\n    dataKey?: string | undefined;\n\n    /**\n     * The current selection.\n     */\n    selection?: any | undefined | null;\n\n    /**\n     * Callback for when the selection changes\n     */\n    onSelectionChange?(event: DataTableSelectionSingleChangeEvent<any>): void;\n\n    /**\n     * Fields to use for global filtering\n     */\n    globalFilterFields?: string[] | undefined;\n\n    /**\n     * Default filters to use\n     */\n    defaultFilters?: DataTableFilterMeta;\n}\n\nconst paging = new Paging(0, 20);\n\n/**\n * Represents a DataTable for a query.\n * @param props Props for the component\n * @returns Function to render the DataTableForQuery component\n */\nexport const DataTableForQuery = <TQuery extends IQueryFor<TDataType, TArguments>, TDataType, TArguments extends object>(props: DataTableForQueryProps<TQuery, TDataType, TArguments>) => {\n    const [filters, setFilters] = useState<DataTableFilterMeta>(props.defaultFilters ?? {});\n    const [result, , , setPage] = useQueryWithPaging(props.query, paging, props.queryArguments);\n\n    return (\n        <DataTable\n            value={result.data as unknown}\n            lazy\n            rows={paging.pageSize}\n            totalRecords={result.paging.totalItems}\n            paginator\n            alwaysShowPaginator={false}\n            first={result.paging.page * paging.pageSize}\n            onPage={(e) => setPage(e.page ?? 0)}\n            scrollable\n            scrollHeight={'flex'}\n            selectionMode='single'\n            selection={props.selection}\n            onSelectionChange={props.onSelectionChange}\n            dataKey={props.dataKey}\n            filters={filters}\n            filterDisplay='menu'\n            onFilter={(e) => setFilters(e.filters)}\n            globalFilterFields={props.globalFilterFields}\n            emptyMessage={props.emptyMessage} >\n            {props.children}\n        </DataTable >\n    );\n};\n"],"names":["Paging","useState","useQueryWithPaging","_jsx","DataTable"],"mappings":";;;;;;;;AA6DA,MAAM,MAAM,GAAG,IAAIA,cAAM,CAAC,CAAC,EAAE,EAAE,CAAC;AAOzB,MAAM,iBAAiB,GAAG,CAAwF,KAA4D,KAAI;AACrL,IAAA,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAGC,cAAQ,CAAsB,KAAK,CAAC,cAAc,IAAI,EAAE,CAAC;IACvF,MAAM,CAAC,MAAM,MAAM,OAAO,CAAC,GAAGC,4BAAkB,CAAC,KAAK,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,cAAc,CAAC;AAE3F,IAAA,QACIC,cAAA,CAACC,mBAAS,EAAA,EACN,KAAK,EAAE,MAAM,CAAC,IAAe,EAC7B,IAAI,EAAA,IAAA,EACJ,IAAI,EAAE,MAAM,CAAC,QAAQ,EACrB,YAAY,EAAE,MAAM,CAAC,MAAM,CAAC,UAAU,EACtC,SAAS,EAAA,IAAA,EACT,mBAAmB,EAAE,KAAK,EAC1B,KAAK,EAAE,MAAM,CAAC,MAAM,CAAC,IAAI,GAAG,MAAM,CAAC,QAAQ,EAC3C,MAAM,EAAE,CAAC,CAAC,KAAK,OAAO,CAAC,CAAC,CAAC,IAAI,IAAI,CAAC,CAAC,EACnC,UAAU,EAAA,IAAA,EACV,YAAY,EAAE,MAAM,EACpB,aAAa,EAAC,QAAQ,EACtB,SAAS,EAAE,KAAK,CAAC,SAAS,EAC1B,iBAAiB,EAAE,KAAK,CAAC,iBAAiB,EAC1C,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,OAAO,EAAE,OAAO,EAChB,aAAa,EAAC,MAAM,EACpB,QAAQ,EAAE,CAAC,CAAC,KAAK,UAAU,CAAC,CAAC,CAAC,OAAO,CAAC,EACtC,kBAAkB,EAAE,KAAK,CAAC,kBAAkB,EAC5C,YAAY,EAAE,KAAK,CAAC,YAAY,EAAA,QAAA,EAC/B,KAAK,CAAC,QAAQ,EAAA,CACN;AAErB;;;;"}
+{"version":3,"file":"DataTableForQuery.js","sources":["../../../DataTables/DataTableForQuery.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 { DataTable, DataTableFilterMeta, DataTableSelectionSingleChangeEvent } from 'primereact/datatable';\nimport { Constructor } from '@cratis/fundamentals';\nimport { IQueryFor, Paging } from '@cratis/arc/queries';\nimport { useQueryWithPaging } from '@cratis/arc.react/queries';\nimport { ReactNode, useState } from 'react';\n\n \n\n/**\n * Props for the DataTableForQuery component\n */\nexport interface DataTableForQueryProps<TQuery extends IQueryFor<TDataType, TArguments>, TDataType extends object, TArguments extends object> {\n    /**\n     * Children to render\n     */\n    children?: ReactNode;\n\n    /**\n     * The type of query to use\n     */\n    query: Constructor<TQuery>;\n\n    /**\n     * Optional Arguments to pass to the query\n     */\n    queryArguments?: TArguments;\n\n    /**\n     * The message to show when there is no data\n     */\n    emptyMessage: string;\n\n    /**\n     * The key to use for the data\n     */\n    dataKey?: string | undefined;\n\n    /**\n     * The current selection.\n     */\n    selection?: TDataType | undefined | null;\n\n    /**\n     * Callback for when the selection changes\n     */\n    onSelectionChange?(event: DataTableSelectionSingleChangeEvent<TDataType[]>): void;\n\n    /**\n     * Fields to use for global filtering\n     */\n    globalFilterFields?: string[] | undefined;\n\n    /**\n     * Default filters to use\n     */\n    defaultFilters?: DataTableFilterMeta;\n}\n\nconst paging = new Paging(0, 20);\n\n/**\n * Represents a DataTable for a query.\n * @param props Props for the component\n * @returns Function to render the DataTableForQuery component\n */\nexport const DataTableForQuery = <TQuery extends IQueryFor<TDataType, TArguments>, TDataType extends object, TArguments extends object>(props: DataTableForQueryProps<TQuery, TDataType, TArguments>) => {\n    const [filters, setFilters] = useState<DataTableFilterMeta>(props.defaultFilters ?? {});\n    const [result, , , setPage] = useQueryWithPaging(props.query, paging, props.queryArguments);\n\n    return (\n        <DataTable\n            value={result.data as unknown as object[]}\n            lazy\n            rows={paging.pageSize}\n            totalRecords={result.paging.totalItems}\n            paginator\n            alwaysShowPaginator={false}\n            first={result.paging.page * paging.pageSize}\n            onPage={(e) => setPage(e.page ?? 0)}\n            scrollable\n            scrollHeight={'flex'}\n            selectionMode='single'\n            selection={props.selection}\n            onSelectionChange={props.onSelectionChange}\n            dataKey={props.dataKey}\n            filters={filters}\n            filterDisplay='menu'\n            onFilter={(e) => setFilters(e.filters)}\n            globalFilterFields={props.globalFilterFields}\n            emptyMessage={props.emptyMessage} >\n            {props.children}\n        </DataTable >\n    );\n};\n"],"names":["Paging","useState","useQueryWithPaging","_jsx","DataTable"],"mappings":";;;;;;;;AA6DA,MAAM,MAAM,GAAG,IAAIA,cAAM,CAAC,CAAC,EAAE,EAAE,CAAC;AAOzB,MAAM,iBAAiB,GAAG,CAAuG,KAA4D,KAAI;AACpM,IAAA,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAGC,cAAQ,CAAsB,KAAK,CAAC,cAAc,IAAI,EAAE,CAAC;IACvF,MAAM,CAAC,MAAM,MAAM,OAAO,CAAC,GAAGC,4BAAkB,CAAC,KAAK,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,cAAc,CAAC;AAE3F,IAAA,QACIC,cAAA,CAACC,mBAAS,EAAA,EACN,KAAK,EAAE,MAAM,CAAC,IAA2B,EACzC,IAAI,EAAA,IAAA,EACJ,IAAI,EAAE,MAAM,CAAC,QAAQ,EACrB,YAAY,EAAE,MAAM,CAAC,MAAM,CAAC,UAAU,EACtC,SAAS,EAAA,IAAA,EACT,mBAAmB,EAAE,KAAK,EAC1B,KAAK,EAAE,MAAM,CAAC,MAAM,CAAC,IAAI,GAAG,MAAM,CAAC,QAAQ,EAC3C,MAAM,EAAE,CAAC,CAAC,KAAK,OAAO,CAAC,CAAC,CAAC,IAAI,IAAI,CAAC,CAAC,EACnC,UAAU,EAAA,IAAA,EACV,YAAY,EAAE,MAAM,EACpB,aAAa,EAAC,QAAQ,EACtB,SAAS,EAAE,KAAK,CAAC,SAAS,EAC1B,iBAAiB,EAAE,KAAK,CAAC,iBAAiB,EAC1C,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,OAAO,EAAE,OAAO,EAChB,aAAa,EAAC,MAAM,EACpB,QAAQ,EAAE,CAAC,CAAC,KAAK,UAAU,CAAC,CAAC,CAAC,OAAO,CAAC,EACtC,kBAAkB,EAAE,KAAK,CAAC,kBAAkB,EAC5C,YAAY,EAAE,KAAK,CAAC,YAAY,EAAA,QAAA,EAC/B,KAAK,CAAC,QAAQ,EAAA,CACN;AAErB;;;;"}