@cratis/components 1.1.3 → 1.1.4

package/dist/cjs/CommandDialog/CommandDialog.js

@@ -6,18 +6,9 @@ var Dialog = require('../Dialogs/Dialog.js');
 var React = require('react');
 var commands = require('@cratis/arc.react/commands');
 
-const CommandDialogContext = React.createContext(undefined);
-const useCommandDialogContext = () => {
-    const context = React.useContext(CommandDialogContext);
-    if (!context) {
-        throw new Error('useCommandDialogContext must be used within a CommandDialog');
-    }
-    return context;
-};
 const CommandDialogWrapper = ({ header, visible, width, confirmLabel, cancelLabel, onConfirm, onCancel, onBeforeExecute, children }) => {
     const { setCommandValues, setCommandResult, isValid } = commands.useCommandFormContext();
     const commandInstance = commands.useCommandInstance();
-    const isDialogValid = isValid;
     const handleConfirm = async () => {
         if (onBeforeExecute) {
             const transformedValues = onBeforeExecute(commandInstance);
@@ -51,22 +42,11 @@ const CommandDialogWrapper = ({ header, visible, width, confirmLabel, cancelLabe
         });
     };
     const processedChildren = processChildren(children);
-    return (jsxRuntime.jsx(Dialog.Dialog, { title: header, visible: visible, width: width, onConfirm: handleConfirm, onCancel: onCancel, buttons: dialogs.DialogButtons.OkCancel, okLabel: confirmLabel, cancelLabel: cancelLabel, isValid: isDialogValid, children: jsxRuntime.jsx("div", { style: { display: 'flex', flexDirection: 'column', width: '100%' }, children: processedChildren }) }));
+    return (jsxRuntime.jsx(Dialog.Dialog, { title: header, visible: visible, width: width, onConfirm: handleConfirm, onCancel: onCancel, buttons: dialogs.DialogButtons.OkCancel, okLabel: confirmLabel, cancelLabel: cancelLabel, isValid: isValid, children: jsxRuntime.jsx("div", { style: { display: 'flex', flexDirection: 'column', width: '100%' }, children: processedChildren }) }));
 };
 const CommandDialogComponent = (props) => {
-    const { command, initialValues, currentValues, visible, header, confirmLabel = 'Confirm', cancelLabel = 'Cancel', confirmIcon = 'pi pi-check', cancelIcon = 'pi pi-times', onConfirm, onCancel, onFieldValidate, onFieldChange, onBeforeExecute, children, width = '50vw', showTitles, showErrors, validateOn, validateAllFieldsOnChange, validateOnInit, autoServerValidate, autoServerValidateThrottle, fieldContainerComponent, fieldDecoratorComponent, errorDisplayComponent, tooltipComponent, errorClassName, iconAddonClassName } = props;
-    const contextValue = {
-        onSuccess: onConfirm,
-        onCancel,
-        confirmLabel,
-        cancelLabel,
-        confirmIcon,
-        cancelIcon,
-        onFieldValidate,
-        onFieldChange,
-        onBeforeExecute
-    };
-    return (jsxRuntime.jsx(CommandDialogContext.Provider, { value: contextValue, children: jsxRuntime.jsx(commands.CommandForm, { command: command, initialValues: initialValues, currentValues: currentValues, onFieldValidate: onFieldValidate, onFieldChange: onFieldChange, onBeforeExecute: onBeforeExecute, showTitles: showTitles, showErrors: showErrors, validateOn: validateOn, validateAllFieldsOnChange: validateAllFieldsOnChange, validateOnInit: validateOnInit, autoServerValidate: autoServerValidate, autoServerValidateThrottle: autoServerValidateThrottle, fieldContainerComponent: fieldContainerComponent, fieldDecoratorComponent: fieldDecoratorComponent, errorDisplayComponent: errorDisplayComponent, tooltipComponent: tooltipComponent, errorClassName: errorClassName, iconAddonClassName: iconAddonClassName, children: jsxRuntime.jsx(CommandDialogWrapper, { header: header, visible: visible, width: width, confirmLabel: confirmLabel, cancelLabel: cancelLabel, onConfirm: onConfirm, onCancel: onCancel, onBeforeExecute: onBeforeExecute, children: children }) }) }));
+    const { visible, header, confirmLabel = 'Confirm', cancelLabel = 'Cancel', onConfirm, onCancel, children, width = '50vw', ...commandFormProps } = props;
+    return (jsxRuntime.jsx(commands.CommandForm, { ...commandFormProps, children: jsxRuntime.jsx(CommandDialogWrapper, { header: header, visible: visible, width: width, confirmLabel: confirmLabel, cancelLabel: cancelLabel, onConfirm: onConfirm, onCancel: onCancel, onBeforeExecute: commandFormProps.onBeforeExecute, children: children }) }));
 };
 const CommandDialogColumnWrapper = ({ children }) => (jsxRuntime.jsx(commands.CommandForm.Column, { children: children }));
 CommandDialogColumnWrapper.displayName = 'CommandFormColumn';
@@ -74,5 +54,4 @@ CommandDialogComponent.Column = CommandDialogColumnWrapper;
 const CommandDialog = CommandDialogComponent;
 
 exports.CommandDialog = CommandDialog;
-exports.useCommandDialogContext = useCommandDialogContext;
 //# sourceMappingURL=CommandDialog.js.map

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 { DialogButtons } from '@cratis/arc.react/dialogs';\nimport { Dialog } from '../Dialogs/Dialog';\nimport React, { createContext, useContext } from 'react';\nimport { \n    CommandForm, \n    CommandFormFieldWrapper,\n    useCommandFormContext, \n    useCommandInstance\n} from '@cratis/arc.react/commands';\n\ntype CommandFormProps = React.ComponentProps<typeof CommandForm>;\n\n// Local type definitions\nexport type BeforeExecuteCallback<TCommand> = (values: TCommand) => TCommand;\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    showTitles?: boolean;\n    showErrors?: boolean;\n    validateOn?: CommandFormProps['validateOn'];\n    validateAllFieldsOnChange?: boolean;\n    validateOnInit?: boolean;\n    autoServerValidate?: boolean;\n    autoServerValidateThrottle?: number;\n    fieldContainerComponent?: CommandFormProps['fieldContainerComponent'];\n    fieldDecoratorComponent?: CommandFormProps['fieldDecoratorComponent'];\n    errorDisplayComponent?: CommandFormProps['errorDisplayComponent'];\n    tooltipComponent?: CommandFormProps['tooltipComponent'];\n    errorClassName?: string;\n    iconAddonClassName?: 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 CommandDialogWrapper = <TCommand extends object>({\n    header,\n    visible,\n    width,\n    confirmLabel,\n    cancelLabel,\n    onConfirm,\n    onCancel,\n    onBeforeExecute,\n    children\n}: {\n    header: string;\n    visible: boolean;\n    width: string;\n    confirmLabel: string;\n    cancelLabel: string;\n    onConfirm: (result: ICommandResult<unknown>) => void | Promise<void>;\n    onCancel: () => void;\n    onBeforeExecute?: BeforeExecuteCallback<TCommand>;\n    children: React.ReactNode;\n}) => {\n    const { setCommandValues, setCommandResult, isValid } = useCommandFormContext<TCommand>();\n    const commandInstance = useCommandInstance<TCommand>();\n\n    const isDialogValid = isValid;\n\n    const handleConfirm = async () => {\n        if (onBeforeExecute) {\n            const transformedValues = onBeforeExecute(commandInstance);\n            setCommandValues(transformedValues);\n        }\n        const result = await (commandInstance as unknown as { execute: () => Promise<ICommandResult<unknown>> }).execute();\n        if (result.isSuccess) {\n            await onConfirm(result);\n            return true;\n        } else {\n            setCommandResult(result);\n            return false;\n        }\n    };\n\n    const processChildren = (nodes: React.ReactNode): React.ReactNode => {\n        return React.Children.map(nodes, (child) => {\n            if (!React.isValidElement(child)) return child;\n\n            const component = child.type as React.ComponentType<unknown>;\n            if (component.displayName === 'CommandFormField') {\n                type FieldElement = Parameters<typeof CommandFormFieldWrapper>[0]['field'];\n                return <CommandFormFieldWrapper field={child as unknown as FieldElement} />;\n            }\n\n            const childProps = child.props as Record<string, unknown>;\n            if (childProps.children != null) {\n                return React.cloneElement(child as React.ReactElement<Record<string, unknown>>, {\n                    children: processChildren(childProps.children as React.ReactNode)\n                });\n            }\n\n            return child;\n        });\n    };\n\n    const processedChildren = processChildren(children);\n\n    return (\n        <Dialog\n            title={header}\n            visible={visible}\n            width={width}\n            onConfirm={handleConfirm}\n            onCancel={onCancel}\n            buttons={DialogButtons.OkCancel}\n            okLabel={confirmLabel}\n            cancelLabel={cancelLabel}\n            isValid={isDialogValid}\n        >\n            <div style={{ display: 'flex', flexDirection: 'column', width: '100%' }}>\n                {processedChildren}\n            </div>\n        </Dialog>\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        width = '50vw',\n        showTitles,\n        showErrors,\n        validateOn,\n        validateAllFieldsOnChange,\n        validateOnInit,\n        autoServerValidate,\n        autoServerValidateThrottle,\n        fieldContainerComponent,\n        fieldDecoratorComponent,\n        errorDisplayComponent,\n        tooltipComponent,\n        errorClassName,\n        iconAddonClassName\n    } = props;\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        <CommandDialogContext.Provider value={contextValue}>\n            <CommandForm\n                command={command}\n                initialValues={initialValues}\n                currentValues={currentValues}\n                onFieldValidate={onFieldValidate}\n                onFieldChange={onFieldChange}\n                onBeforeExecute={onBeforeExecute}\n                showTitles={showTitles}\n                showErrors={showErrors}\n                validateOn={validateOn}\n                validateAllFieldsOnChange={validateAllFieldsOnChange}\n                validateOnInit={validateOnInit}\n                autoServerValidate={autoServerValidate}\n                autoServerValidateThrottle={autoServerValidateThrottle}\n                fieldContainerComponent={fieldContainerComponent}\n                fieldDecoratorComponent={fieldDecoratorComponent}\n                errorDisplayComponent={errorDisplayComponent}\n                tooltipComponent={tooltipComponent}\n                errorClassName={errorClassName}\n                iconAddonClassName={iconAddonClassName}>\n                <CommandDialogWrapper\n                    header={header}\n                    visible={visible}\n                    width={width}\n                    confirmLabel={confirmLabel}\n                    cancelLabel={cancelLabel}\n                    onConfirm={onConfirm}\n                    onCancel={onCancel}\n                    onBeforeExecute={onBeforeExecute}\n                >\n                    {children}\n                </CommandDialogWrapper>\n            </CommandForm>\n        </CommandDialogContext.Provider>\n    );\n};\n\nconst CommandDialogColumnWrapper = ({ children }: { children: React.ReactNode }) => (\n    <CommandForm.Column>{children}</CommandForm.Column>\n);\nCommandDialogColumnWrapper.displayName = 'CommandFormColumn';\n\nCommandDialogComponent.Column = CommandDialogColumnWrapper;\n\nexport const CommandDialog = CommandDialogComponent;\n"],"names":["createContext","useContext","useCommandFormContext","useCommandInstance","_jsx","CommandFormFieldWrapper","Dialog","DialogButtons","CommandForm"],"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 { DialogButtons } from '@cratis/arc.react/dialogs';\nimport { Dialog } from '../Dialogs/Dialog';\nimport React from 'react';\nimport {\n    CommandForm,\n    CommandFormFieldWrapper,\n    useCommandFormContext,\n    useCommandInstance,\n    type CommandFormProps\n} from '@cratis/arc.react/commands';\n\nexport interface CommandDialogProps<TCommand extends object, TResponse = object>\n    extends Omit<CommandFormProps<TCommand>, 'children'> {\n    visible: boolean;\n    header: string;\n    confirmLabel?: string;\n    cancelLabel?: string;\n    onConfirm: (result: ICommandResult<TResponse>) => void | Promise<void>;\n    onCancel: () => void;\n    children?: React.ReactNode;\n    style?: React.CSSProperties;\n    width?: string;\n}\n\nconst CommandDialogWrapper = <TCommand extends object>({\n    header,\n    visible,\n    width,\n    confirmLabel,\n    cancelLabel,\n    onConfirm,\n    onCancel,\n    onBeforeExecute,\n    children\n}: {\n    header: string;\n    visible: boolean;\n    width: string;\n    confirmLabel: string;\n    cancelLabel: string;\n    onConfirm: (result: ICommandResult<unknown>) => void | Promise<void>;\n    onCancel: () => void;\n    onBeforeExecute?: (values: TCommand) => TCommand;\n    children: React.ReactNode;\n}) => {\n    const { setCommandValues, setCommandResult, isValid } = useCommandFormContext<TCommand>();\n    const commandInstance = useCommandInstance<TCommand>();\n\n    const handleConfirm = async () => {\n        if (onBeforeExecute) {\n            const transformedValues = onBeforeExecute(commandInstance);\n            setCommandValues(transformedValues);\n        }\n        const result = await (commandInstance as unknown as { execute: () => Promise<ICommandResult<unknown>> }).execute();\n        if (result.isSuccess) {\n            await onConfirm(result);\n            return true;\n        } else {\n            setCommandResult(result);\n            return false;\n        }\n    };\n\n    const processChildren = (nodes: React.ReactNode): React.ReactNode => {\n        return React.Children.map(nodes, (child) => {\n            if (!React.isValidElement(child)) return child;\n\n            const component = child.type as React.ComponentType<unknown>;\n            if (component.displayName === 'CommandFormField') {\n                type FieldElement = Parameters<typeof CommandFormFieldWrapper>[0]['field'];\n                return <CommandFormFieldWrapper field={child as unknown as FieldElement} />;\n            }\n\n            const childProps = child.props as Record<string, unknown>;\n            if (childProps.children != null) {\n                return React.cloneElement(child as React.ReactElement<Record<string, unknown>>, {\n                    children: processChildren(childProps.children as React.ReactNode)\n                });\n            }\n\n            return child;\n        });\n    };\n\n    const processedChildren = processChildren(children);\n\n    return (\n        <Dialog\n            title={header}\n            visible={visible}\n            width={width}\n            onConfirm={handleConfirm}\n            onCancel={onCancel}\n            buttons={DialogButtons.OkCancel}\n            okLabel={confirmLabel}\n            cancelLabel={cancelLabel}\n            isValid={isValid}\n        >\n            <div style={{ display: 'flex', flexDirection: 'column', width: '100%' }}>\n                {processedChildren}\n            </div>\n        </Dialog>\n    );\n};\n\nconst CommandDialogComponent = <TCommand extends object = object, TResponse = object>(props: CommandDialogProps<TCommand, TResponse>) => {\n    const {\n        visible,\n        header,\n        confirmLabel = 'Confirm',\n        cancelLabel = 'Cancel',\n        onConfirm,\n        onCancel,\n        children,\n        width = '50vw',\n        ...commandFormProps\n    } = props;\n\n    return (\n        <CommandForm<TCommand> {...commandFormProps}>\n            <CommandDialogWrapper<TCommand>\n                header={header}\n                visible={visible}\n                width={width}\n                confirmLabel={confirmLabel}\n                cancelLabel={cancelLabel}\n                onConfirm={onConfirm}\n                onCancel={onCancel}\n                onBeforeExecute={commandFormProps.onBeforeExecute}\n            >\n                {children}\n            </CommandDialogWrapper>\n        </CommandForm>\n    );\n};\n\nconst CommandDialogColumnWrapper = ({ children }: { children: React.ReactNode }) => (\n    <CommandForm.Column>{children}</CommandForm.Column>\n);\nCommandDialogColumnWrapper.displayName = 'CommandFormColumn';\n\nCommandDialogComponent.Column = CommandDialogColumnWrapper;\n\nexport const CommandDialog = CommandDialogComponent;\n"],"names":["useCommandFormContext","useCommandInstance","_jsx","CommandFormFieldWrapper","Dialog","DialogButtons","CommandForm"],"mappings":"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"}

package/dist/cjs/CommandDialog/index.js

@@ -5,5 +5,4 @@ var CommandDialog = require('./CommandDialog.js');
 
 
 exports.CommandDialog = CommandDialog.CommandDialog;
-exports.useCommandDialogContext = CommandDialog.useCommandDialogContext;
 //# sourceMappingURL=index.js.map

package/dist/cjs/CommandDialog/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/CommandForm/fields/CheckboxField.js

@@ -4,7 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
 var checkbox = require('primereact/checkbox');
 var commands = require('@cratis/arc.react/commands');
 
-const CheckboxField = commands.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 })] })), {
+const CheckboxField = commands.asCommandFormField((props) => (jsxRuntime.jsxs("div", { className: "flex align-items-center", children: [jsxRuntime.jsx(checkbox.Checkbox, { checked: props.value, onChange: props.onChange, onBlur: props.onBlur, invalid: props.invalid }), props.label && jsxRuntime.jsx("label", { className: "ml-2", children: props.label })] })), {
     defaultValue: false,
     extractValue: (e) => e.checked
 });

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

@@ -1 +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 '@cratis/arc.react/commands';\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,2BAAkB,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;;;;"}
+{"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 '@cratis/arc.react/commands';\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                onBlur={props.onBlur}\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,2BAAkB,CAC3C,CAAC,KAAK,MACFC,eAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,yBAAyB,EAAA,QAAA,EAAA,CACpCC,cAAA,CAACC,iBAAQ,EAAA,EACL,OAAO,EAAE,KAAK,CAAC,KAAK,EACpB,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,MAAM,EAAE,KAAK,CAAC,MAAM,EACpB,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

@@ -4,7 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
 var dropdown = require('primereact/dropdown');
 var commands = require('@cratis/arc.react/commands');
 
-const DropdownField = commands.asCommandFormField((props) => (jsxRuntime.jsx(dropdown.Dropdown, { value: props.value, onChange: (e) => props.onChange(e.value), options: props.options, optionValue: props.optionValue, optionLabel: props.optionLabel, placeholder: props.placeholder, invalid: props.invalid, className: "w-full" })), {
+const DropdownField = commands.asCommandFormField((props) => (jsxRuntime.jsx(dropdown.Dropdown, { value: props.value, onChange: (e) => props.onChange(e.value), onBlur: props.onBlur, options: props.options, optionValue: props.optionValue, optionLabel: props.optionLabel, placeholder: props.placeholder, invalid: props.invalid, className: "w-full" })), {
     defaultValue: '',
     extractValue: (e) => e
 });

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

@@ -1 +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 { Dropdown } from 'primereact/dropdown';\nimport React from 'react';\nimport { asCommandFormField, WrappedFieldProps } from '@cratis/arc.react/commands';\n\ninterface DropdownFieldComponentProps extends WrappedFieldProps<string | number> {\n    options: Array<{ [key: string]: unknown }>;\n    optionValue: string;\n    optionLabel: string;\n    placeholder?: string;\n}\n\nexport const DropdownField = asCommandFormField<DropdownFieldComponentProps>(\n    (props) => (\n        <Dropdown\n            value={props.value}\n            onChange={(e) => props.onChange(e.value)}\n            options={props.options}\n            optionValue={props.optionValue}\n            optionLabel={props.optionLabel}\n            placeholder={props.placeholder}\n            invalid={props.invalid}\n            className=\"w-full\"\n        />\n    ),\n    {\n        defaultValue: '',\n        extractValue: (e: unknown) => e as string | number\n    }\n);\n"],"names":["asCommandFormField","_jsx","Dropdown"],"mappings":";;;;;;AAcO,MAAM,aAAa,GAAGA,2BAAkB,CAC3C,CAAC,KAAK,MACFC,cAAA,CAACC,iBAAQ,IACL,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,QAAQ,EAAE,CAAC,CAAC,KAAK,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,EACxC,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,WAAW,EAAE,KAAK,CAAC,WAAW,EAC9B,WAAW,EAAE,KAAK,CAAC,WAAW,EAC9B,WAAW,EAAE,KAAK,CAAC,WAAW,EAC9B,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,SAAS,EAAC,QAAQ,EAAA,CACpB,CACL,EACD;AACI,IAAA,YAAY,EAAE,EAAE;AAChB,IAAA,YAAY,EAAE,CAAC,CAAU,KAAK;AACjC,CAAA;;;;"}
+{"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 { Dropdown } from 'primereact/dropdown';\nimport React from 'react';\nimport { asCommandFormField, WrappedFieldProps } from '@cratis/arc.react/commands';\n\ninterface DropdownFieldComponentProps extends WrappedFieldProps<string | number> {\n    options: Array<{ [key: string]: unknown }>;\n    optionValue: string;\n    optionLabel: string;\n    placeholder?: string;\n}\n\nexport const DropdownField = asCommandFormField<DropdownFieldComponentProps>(\n    (props) => (\n        <Dropdown\n            value={props.value}\n            onChange={(e) => props.onChange(e.value)}\n            onBlur={props.onBlur}\n            options={props.options}\n            optionValue={props.optionValue}\n            optionLabel={props.optionLabel}\n            placeholder={props.placeholder}\n            invalid={props.invalid}\n            className=\"w-full\"\n        />\n    ),\n    {\n        defaultValue: '',\n        extractValue: (e: unknown) => e as string | number\n    }\n);\n"],"names":["asCommandFormField","_jsx","Dropdown"],"mappings":";;;;;;AAcO,MAAM,aAAa,GAAGA,2BAAkB,CAC3C,CAAC,KAAK,MACFC,cAAA,CAACC,iBAAQ,EAAA,EACL,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,QAAQ,EAAE,CAAC,CAAC,KAAK,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,EACxC,MAAM,EAAE,KAAK,CAAC,MAAM,EACpB,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,WAAW,EAAE,KAAK,CAAC,WAAW,EAC9B,WAAW,EAAE,KAAK,CAAC,WAAW,EAC9B,WAAW,EAAE,KAAK,CAAC,WAAW,EAC9B,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,SAAS,EAAC,QAAQ,EAAA,CACpB,CACL,EACD;AACI,IAAA,YAAY,EAAE,EAAE;AAChB,IAAA,YAAY,EAAE,CAAC,CAAU,KAAK;AACjC,CAAA;;;;"}

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

@@ -4,7 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
 var inputtext = require('primereact/inputtext');
 var commands = require('@cratis/arc.react/commands');
 
-const InputTextField = commands.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" })), {
+const InputTextField = commands.asCommandFormField((props) => (jsxRuntime.jsx(inputtext.InputText, { type: props.type || 'text', value: props.value, onChange: props.onChange, onBlur: props.onBlur, invalid: props.invalid, placeholder: props.placeholder, className: "w-full" })), {
     defaultValue: '',
     extractValue: (e) => e.target.value
 });

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

@@ -1 +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 '@cratis/arc.react/commands';\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,2BAAkB,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;;;;"}
+{"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 '@cratis/arc.react/commands';\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            onBlur={props.onBlur}\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,2BAAkB,CAC5C,CAAC,KAAK,MACFC,cAAA,CAACC,mBAAS,EAAA,EACN,IAAI,EAAE,KAAK,CAAC,IAAI,IAAI,MAAM,EAC1B,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,MAAM,EAAE,KAAK,CAAC,MAAM,EACpB,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

@@ -4,7 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
 var inputnumber = require('primereact/inputnumber');
 var commands = require('@cratis/arc.react/commands');
 
-const NumberField = commands.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" })), {
+const NumberField = commands.asCommandFormField((props) => (jsxRuntime.jsx(inputnumber.InputNumber, { value: props.value, onValueChange: (e) => props.onChange(e.value ?? 0), onBlur: props.onBlur, 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)
 });

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

@@ -1 +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 '@cratis/arc.react/commands';\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,2BAAkB,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;;;;"}
+{"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 '@cratis/arc.react/commands';\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            onBlur={props.onBlur}\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,2BAAkB,CACzC,CAAC,KAAK,MACFC,cAAA,CAACC,uBAAW,EAAA,EACR,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,aAAa,EAAE,CAAC,CAAC,KAAK,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,EAClD,MAAM,EAAE,KAAK,CAAC,MAAM,EACpB,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

@@ -4,7 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
 var slider = require('primereact/slider');
 var commands = require('@cratis/arc.react/commands');
 
-const SliderField = commands.asCommandFormField((props) => (jsxRuntime.jsxs("div", { className: "w-full", children: [jsxRuntime.jsx(slider.Slider, { value: props.value, onChange: (e) => props.onChange(e.value), min: props.min ?? 0, max: props.max ?? 100, step: props.step ?? 1, className: "w-full" }), jsxRuntime.jsx("div", { className: "text-center mt-2", children: jsxRuntime.jsx("span", { className: "font-semibold", children: props.value }) })] })), {
+const SliderField = commands.asCommandFormField((props) => (jsxRuntime.jsxs("div", { className: "w-full", onBlur: props.onBlur, children: [jsxRuntime.jsx(slider.Slider, { value: props.value, onChange: (e) => props.onChange(e.value), min: props.min ?? 0, max: props.max ?? 100, step: props.step ?? 1, className: "w-full" }), jsxRuntime.jsx("div", { className: "text-center mt-2", children: jsxRuntime.jsx("span", { className: "font-semibold", children: props.value }) })] })), {
     defaultValue: 0,
     extractValue: (e) => (typeof e === 'number' ? e : 0)
 });

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

@@ -1 +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 { Slider } from 'primereact/slider';\nimport React from 'react';\nimport { asCommandFormField, WrappedFieldProps } from '@cratis/arc.react/commands';\n\ninterface SliderFieldComponentProps extends WrappedFieldProps<number> {\n    min?: number;\n    max?: number;\n    step?: number;\n}\n\nexport const SliderField = asCommandFormField<SliderFieldComponentProps>(\n    (props) => (\n        <div className=\"w-full\">\n            <Slider\n                value={props.value}\n                onChange={(e) => props.onChange(e.value)}\n                min={props.min ?? 0}\n                max={props.max ?? 100}\n                step={props.step ?? 1}\n                className=\"w-full\"\n            />\n            <div className=\"text-center mt-2\">\n                <span className=\"font-semibold\">{props.value}</span>\n            </div>\n        </div>\n    ),\n    {\n        defaultValue: 0,\n        extractValue: (e: unknown) => (typeof e === 'number' ? e : 0)\n    }\n);\n"],"names":["asCommandFormField","_jsxs","_jsx","Slider"],"mappings":";;;;;;AAaO,MAAM,WAAW,GAAGA,2BAAkB,CACzC,CAAC,KAAK,MACFC,yBAAK,SAAS,EAAC,QAAQ,EAAA,QAAA,EAAA,CACnBC,cAAA,CAACC,aAAM,EAAA,EACH,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,QAAQ,EAAE,CAAC,CAAC,KAAK,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,EACxC,GAAG,EAAE,KAAK,CAAC,GAAG,IAAI,CAAC,EACnB,GAAG,EAAE,KAAK,CAAC,GAAG,IAAI,GAAG,EACrB,IAAI,EAAE,KAAK,CAAC,IAAI,IAAI,CAAC,EACrB,SAAS,EAAC,QAAQ,GACpB,EACFD,cAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,kBAAkB,YAC7BA,cAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,eAAe,EAAA,QAAA,EAAE,KAAK,CAAC,KAAK,GAAQ,EAAA,CAClD,CAAA,EAAA,CACJ,CACT,EACD;AACI,IAAA,YAAY,EAAE,CAAC;AACf,IAAA,YAAY,EAAE,CAAC,CAAU,MAAM,OAAO,CAAC,KAAK,QAAQ,GAAG,CAAC,GAAG,CAAC;AAC/D,CAAA;;;;"}
+{"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 { Slider } from 'primereact/slider';\nimport React from 'react';\nimport { asCommandFormField, WrappedFieldProps } from '@cratis/arc.react/commands';\n\ninterface SliderFieldComponentProps extends WrappedFieldProps<number> {\n    min?: number;\n    max?: number;\n    step?: number;\n}\n\nexport const SliderField = asCommandFormField<SliderFieldComponentProps>(\n    (props) => (\n        <div className=\"w-full\" onBlur={props.onBlur}>\n            <Slider\n                value={props.value}\n                onChange={(e) => props.onChange(e.value)}\n                min={props.min ?? 0}\n                max={props.max ?? 100}\n                step={props.step ?? 1}\n                className=\"w-full\"\n            />\n            <div className=\"text-center mt-2\">\n                <span className=\"font-semibold\">{props.value}</span>\n            </div>\n        </div>\n    ),\n    {\n        defaultValue: 0,\n        extractValue: (e: unknown) => (typeof e === 'number' ? e : 0)\n    }\n);\n"],"names":["asCommandFormField","_jsxs","_jsx","Slider"],"mappings":";;;;;;MAaa,WAAW,GAAGA,2BAAkB,CACzC,CAAC,KAAK,MACFC,eAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,QAAQ,EAAC,MAAM,EAAE,KAAK,CAAC,MAAM,aACxCC,cAAA,CAACC,aAAM,IACH,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,QAAQ,EAAE,CAAC,CAAC,KAAK,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,EACxC,GAAG,EAAE,KAAK,CAAC,GAAG,IAAI,CAAC,EACnB,GAAG,EAAE,KAAK,CAAC,GAAG,IAAI,GAAG,EACrB,IAAI,EAAE,KAAK,CAAC,IAAI,IAAI,CAAC,EACrB,SAAS,EAAC,QAAQ,EAAA,CACpB,EACFD,wBAAK,SAAS,EAAC,kBAAkB,EAAA,QAAA,EAC7BA,cAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,eAAe,YAAE,KAAK,CAAC,KAAK,EAAA,CAAQ,EAAA,CAClD,CAAA,EAAA,CACJ,CACT,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/TextAreaField.js

@@ -4,7 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
 var inputtextarea = require('primereact/inputtextarea');
 var commands = require('@cratis/arc.react/commands');
 
-const TextAreaField = commands.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" })), {
+const TextAreaField = commands.asCommandFormField((props) => (jsxRuntime.jsx(inputtextarea.InputTextarea, { value: props.value, onChange: props.onChange, onBlur: props.onBlur, invalid: props.invalid, placeholder: props.placeholder, rows: props.rows ?? 5, cols: props.cols, className: "w-full" })), {
     defaultValue: '',
     extractValue: (e) => e.target.value
 });

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

@@ -1 +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 '@cratis/arc.react/commands';\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,2BAAkB,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;;;;"}
+{"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 '@cratis/arc.react/commands';\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            onBlur={props.onBlur}\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,2BAAkB,CAC3C,CAAC,KAAK,MACFC,eAACC,2BAAa,EAAA,EACV,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,MAAM,EAAE,KAAK,CAAC,MAAM,EACpB,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/esm/CommandDialog/CommandDialog.d.ts

@@ -1,55 +1,17 @@
 import { ICommandResult } from '@cratis/arc/commands';
-import { Constructor } from '@cratis/fundamentals';
 import React from 'react';
-import { CommandForm } from '@cratis/arc.react/commands';
-type CommandFormProps = React.ComponentProps<typeof CommandForm>;
-export type BeforeExecuteCallback<TCommand> = (values: TCommand) => TCommand;
-export type FieldValidator<TCommand> = (command: TCommand, fieldName: string, oldValue: unknown, newValue: unknown) => string | undefined;
-export type FieldChangeCallback<TCommand> = (command: TCommand, fieldName: string, oldValue: unknown, newValue: unknown) => void;
-export interface CommandDialogProps<TCommand, TResponse = object> {
-    command: Constructor<TCommand>;
-    initialValues?: Partial<TCommand>;
-    currentValues?: Partial<TCommand> | undefined;
+import { type CommandFormProps } from '@cratis/arc.react/commands';
+export interface CommandDialogProps<TCommand extends object, TResponse = object> extends Omit<CommandFormProps<TCommand>, 'children'> {
     visible: boolean;
     header: string;
     confirmLabel?: string;
     cancelLabel?: string;
-    confirmIcon?: string;
-    cancelIcon?: string;
     onConfirm: (result: ICommandResult<TResponse>) => void | Promise<void>;
     onCancel: () => void;
-    onFieldValidate?: FieldValidator<TCommand>;
-    onFieldChange?: FieldChangeCallback<TCommand>;
-    onBeforeExecute?: BeforeExecuteCallback<TCommand>;
     children?: React.ReactNode;
     style?: React.CSSProperties;
     width?: string;
-    showTitles?: boolean;
-    showErrors?: boolean;
-    validateOn?: CommandFormProps['validateOn'];
-    validateAllFieldsOnChange?: boolean;
-    validateOnInit?: boolean;
-    autoServerValidate?: boolean;
-    autoServerValidateThrottle?: number;
-    fieldContainerComponent?: CommandFormProps['fieldContainerComponent'];
-    fieldDecoratorComponent?: CommandFormProps['fieldDecoratorComponent'];
-    errorDisplayComponent?: CommandFormProps['errorDisplayComponent'];
-    tooltipComponent?: CommandFormProps['tooltipComponent'];
-    errorClassName?: string;
-    iconAddonClassName?: string;
 }
-interface CommandDialogContextValue<TCommand = unknown> {
-    onSuccess: (result: ICommandResult<unknown>) => void | Promise<void>;
-    onCancel: () => void;
-    confirmLabel: string;
-    cancelLabel: string;
-    confirmIcon: string;
-    cancelIcon: string;
-    onFieldValidate?: FieldValidator<TCommand>;
-    onFieldChange?: FieldChangeCallback<TCommand>;
-    onBeforeExecute?: BeforeExecuteCallback<TCommand>;
-}
-export declare const useCommandDialogContext: <TCommand = unknown>() => CommandDialogContextValue<TCommand>;
 export declare const CommandDialog: {
     <TCommand extends object = object, TResponse = object>(props: CommandDialogProps<TCommand, TResponse>): import("react/jsx-runtime").JSX.Element;
     Column: {
@@ -59,5 +21,4 @@ export declare const CommandDialog: {
         displayName: string;
     };
 };
-export {};
 //# sourceMappingURL=CommandDialog.d.ts.map

package/dist/esm/CommandDialog/CommandDialog.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CommandDialog.d.ts","sourceRoot":"","sources":["../../../CommandDialog/CommandDialog.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"CommandDialog.d.ts","sourceRoot":"","sources":["../../../CommandDialog/CommandDialog.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAGtD,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAKH,KAAK,gBAAgB,EACxB,MAAM,4BAA4B,CAAC;AAEpC,MAAM,WAAW,kBAAkB,CAAC,QAAQ,SAAS,MAAM,EAAE,SAAS,GAAG,MAAM,CAC3E,SAAQ,IAAI,CAAC,gBAAgB,CAAC,QAAQ,CAAC,EAAE,UAAU,CAAC;IACpD,OAAO,EAAE,OAAO,CAAC;IACjB,MAAM,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,EAAE,CAAC,MAAM,EAAE,cAAc,CAAC,SAAS,CAAC,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IACvE,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,KAAK,CAAC,EAAE,MAAM,CAAC;CAClB;AAyHD,eAAO,MAAM,aAAa;KAtCM,QAAQ,SAAS,MAAM,WAAW,SAAS,kBAAkB,kBAAkB,CAAC,QAAQ,EAAE,SAAS,CAAC;;uBA+BlF;YAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;SAAE;;;CAO5B,CAAC"}

package/dist/esm/CommandDialog/CommandDialog.js

@@ -1,21 +1,12 @@
 import { jsx } from 'react/jsx-runtime';
 import { DialogButtons } from '@cratis/arc.react/dialogs';
 import { Dialog } from '../Dialogs/Dialog.js';
-import React, { createContext, useContext } from 'react';
+import React from 'react';
 import { CommandForm, useCommandFormContext, useCommandInstance, CommandFormFieldWrapper } from '@cratis/arc.react/commands';
 
-const CommandDialogContext = createContext(undefined);
-const useCommandDialogContext = () => {
-    const context = useContext(CommandDialogContext);
-    if (!context) {
-        throw new Error('useCommandDialogContext must be used within a CommandDialog');
-    }
-    return context;
-};
 const CommandDialogWrapper = ({ header, visible, width, confirmLabel, cancelLabel, onConfirm, onCancel, onBeforeExecute, children }) => {
     const { setCommandValues, setCommandResult, isValid } = useCommandFormContext();
     const commandInstance = useCommandInstance();
-    const isDialogValid = isValid;
     const handleConfirm = async () => {
         if (onBeforeExecute) {
             const transformedValues = onBeforeExecute(commandInstance);
@@ -49,27 +40,16 @@ const CommandDialogWrapper = ({ header, visible, width, confirmLabel, cancelLabe
         });
     };
     const processedChildren = processChildren(children);
-    return (jsx(Dialog, { title: header, visible: visible, width: width, onConfirm: handleConfirm, onCancel: onCancel, buttons: DialogButtons.OkCancel, okLabel: confirmLabel, cancelLabel: cancelLabel, isValid: isDialogValid, children: jsx("div", { style: { display: 'flex', flexDirection: 'column', width: '100%' }, children: processedChildren }) }));
+    return (jsx(Dialog, { title: header, visible: visible, width: width, onConfirm: handleConfirm, onCancel: onCancel, buttons: DialogButtons.OkCancel, okLabel: confirmLabel, cancelLabel: cancelLabel, isValid: isValid, children: jsx("div", { style: { display: 'flex', flexDirection: 'column', width: '100%' }, children: processedChildren }) }));
 };
 const CommandDialogComponent = (props) => {
-    const { command, initialValues, currentValues, visible, header, confirmLabel = 'Confirm', cancelLabel = 'Cancel', confirmIcon = 'pi pi-check', cancelIcon = 'pi pi-times', onConfirm, onCancel, onFieldValidate, onFieldChange, onBeforeExecute, children, width = '50vw', showTitles, showErrors, validateOn, validateAllFieldsOnChange, validateOnInit, autoServerValidate, autoServerValidateThrottle, fieldContainerComponent, fieldDecoratorComponent, errorDisplayComponent, tooltipComponent, errorClassName, iconAddonClassName } = props;
-    const contextValue = {
-        onSuccess: onConfirm,
-        onCancel,
-        confirmLabel,
-        cancelLabel,
-        confirmIcon,
-        cancelIcon,
-        onFieldValidate,
-        onFieldChange,
-        onBeforeExecute
-    };
-    return (jsx(CommandDialogContext.Provider, { value: contextValue, children: jsx(CommandForm, { command: command, initialValues: initialValues, currentValues: currentValues, onFieldValidate: onFieldValidate, onFieldChange: onFieldChange, onBeforeExecute: onBeforeExecute, showTitles: showTitles, showErrors: showErrors, validateOn: validateOn, validateAllFieldsOnChange: validateAllFieldsOnChange, validateOnInit: validateOnInit, autoServerValidate: autoServerValidate, autoServerValidateThrottle: autoServerValidateThrottle, fieldContainerComponent: fieldContainerComponent, fieldDecoratorComponent: fieldDecoratorComponent, errorDisplayComponent: errorDisplayComponent, tooltipComponent: tooltipComponent, errorClassName: errorClassName, iconAddonClassName: iconAddonClassName, children: jsx(CommandDialogWrapper, { header: header, visible: visible, width: width, confirmLabel: confirmLabel, cancelLabel: cancelLabel, onConfirm: onConfirm, onCancel: onCancel, onBeforeExecute: onBeforeExecute, children: children }) }) }));
+    const { visible, header, confirmLabel = 'Confirm', cancelLabel = 'Cancel', onConfirm, onCancel, children, width = '50vw', ...commandFormProps } = props;
+    return (jsx(CommandForm, { ...commandFormProps, children: jsx(CommandDialogWrapper, { header: header, visible: visible, width: width, confirmLabel: confirmLabel, cancelLabel: cancelLabel, onConfirm: onConfirm, onCancel: onCancel, onBeforeExecute: commandFormProps.onBeforeExecute, children: children }) }));
 };
 const CommandDialogColumnWrapper = ({ children }) => (jsx(CommandForm.Column, { children: children }));
 CommandDialogColumnWrapper.displayName = 'CommandFormColumn';
 CommandDialogComponent.Column = CommandDialogColumnWrapper;
 const CommandDialog = CommandDialogComponent;
 
-export { CommandDialog, useCommandDialogContext };
+export { CommandDialog };
 //# sourceMappingURL=CommandDialog.js.map

package/dist/esm/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 { DialogButtons } from '@cratis/arc.react/dialogs';\nimport { Dialog } from '../Dialogs/Dialog';\nimport React, { createContext, useContext } from 'react';\nimport { \n    CommandForm, \n    CommandFormFieldWrapper,\n    useCommandFormContext, \n    useCommandInstance\n} from '@cratis/arc.react/commands';\n\ntype CommandFormProps = React.ComponentProps<typeof CommandForm>;\n\n// Local type definitions\nexport type BeforeExecuteCallback<TCommand> = (values: TCommand) => TCommand;\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    showTitles?: boolean;\n    showErrors?: boolean;\n    validateOn?: CommandFormProps['validateOn'];\n    validateAllFieldsOnChange?: boolean;\n    validateOnInit?: boolean;\n    autoServerValidate?: boolean;\n    autoServerValidateThrottle?: number;\n    fieldContainerComponent?: CommandFormProps['fieldContainerComponent'];\n    fieldDecoratorComponent?: CommandFormProps['fieldDecoratorComponent'];\n    errorDisplayComponent?: CommandFormProps['errorDisplayComponent'];\n    tooltipComponent?: CommandFormProps['tooltipComponent'];\n    errorClassName?: string;\n    iconAddonClassName?: 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 CommandDialogWrapper = <TCommand extends object>({\n    header,\n    visible,\n    width,\n    confirmLabel,\n    cancelLabel,\n    onConfirm,\n    onCancel,\n    onBeforeExecute,\n    children\n}: {\n    header: string;\n    visible: boolean;\n    width: string;\n    confirmLabel: string;\n    cancelLabel: string;\n    onConfirm: (result: ICommandResult<unknown>) => void | Promise<void>;\n    onCancel: () => void;\n    onBeforeExecute?: BeforeExecuteCallback<TCommand>;\n    children: React.ReactNode;\n}) => {\n    const { setCommandValues, setCommandResult, isValid } = useCommandFormContext<TCommand>();\n    const commandInstance = useCommandInstance<TCommand>();\n\n    const isDialogValid = isValid;\n\n    const handleConfirm = async () => {\n        if (onBeforeExecute) {\n            const transformedValues = onBeforeExecute(commandInstance);\n            setCommandValues(transformedValues);\n        }\n        const result = await (commandInstance as unknown as { execute: () => Promise<ICommandResult<unknown>> }).execute();\n        if (result.isSuccess) {\n            await onConfirm(result);\n            return true;\n        } else {\n            setCommandResult(result);\n            return false;\n        }\n    };\n\n    const processChildren = (nodes: React.ReactNode): React.ReactNode => {\n        return React.Children.map(nodes, (child) => {\n            if (!React.isValidElement(child)) return child;\n\n            const component = child.type as React.ComponentType<unknown>;\n            if (component.displayName === 'CommandFormField') {\n                type FieldElement = Parameters<typeof CommandFormFieldWrapper>[0]['field'];\n                return <CommandFormFieldWrapper field={child as unknown as FieldElement} />;\n            }\n\n            const childProps = child.props as Record<string, unknown>;\n            if (childProps.children != null) {\n                return React.cloneElement(child as React.ReactElement<Record<string, unknown>>, {\n                    children: processChildren(childProps.children as React.ReactNode)\n                });\n            }\n\n            return child;\n        });\n    };\n\n    const processedChildren = processChildren(children);\n\n    return (\n        <Dialog\n            title={header}\n            visible={visible}\n            width={width}\n            onConfirm={handleConfirm}\n            onCancel={onCancel}\n            buttons={DialogButtons.OkCancel}\n            okLabel={confirmLabel}\n            cancelLabel={cancelLabel}\n            isValid={isDialogValid}\n        >\n            <div style={{ display: 'flex', flexDirection: 'column', width: '100%' }}>\n                {processedChildren}\n            </div>\n        </Dialog>\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        width = '50vw',\n        showTitles,\n        showErrors,\n        validateOn,\n        validateAllFieldsOnChange,\n        validateOnInit,\n        autoServerValidate,\n        autoServerValidateThrottle,\n        fieldContainerComponent,\n        fieldDecoratorComponent,\n        errorDisplayComponent,\n        tooltipComponent,\n        errorClassName,\n        iconAddonClassName\n    } = props;\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        <CommandDialogContext.Provider value={contextValue}>\n            <CommandForm\n                command={command}\n                initialValues={initialValues}\n                currentValues={currentValues}\n                onFieldValidate={onFieldValidate}\n                onFieldChange={onFieldChange}\n                onBeforeExecute={onBeforeExecute}\n                showTitles={showTitles}\n                showErrors={showErrors}\n                validateOn={validateOn}\n                validateAllFieldsOnChange={validateAllFieldsOnChange}\n                validateOnInit={validateOnInit}\n                autoServerValidate={autoServerValidate}\n                autoServerValidateThrottle={autoServerValidateThrottle}\n                fieldContainerComponent={fieldContainerComponent}\n                fieldDecoratorComponent={fieldDecoratorComponent}\n                errorDisplayComponent={errorDisplayComponent}\n                tooltipComponent={tooltipComponent}\n                errorClassName={errorClassName}\n                iconAddonClassName={iconAddonClassName}>\n                <CommandDialogWrapper\n                    header={header}\n                    visible={visible}\n                    width={width}\n                    confirmLabel={confirmLabel}\n                    cancelLabel={cancelLabel}\n                    onConfirm={onConfirm}\n                    onCancel={onCancel}\n                    onBeforeExecute={onBeforeExecute}\n                >\n                    {children}\n                </CommandDialogWrapper>\n            </CommandForm>\n        </CommandDialogContext.Provider>\n    );\n};\n\nconst CommandDialogColumnWrapper = ({ children }: { children: React.ReactNode }) => (\n    <CommandForm.Column>{children}</CommandForm.Column>\n);\nCommandDialogColumnWrapper.displayName = 'CommandFormColumn';\n\nCommandDialogComponent.Column = CommandDialogColumnWrapper;\n\nexport const CommandDialog = CommandDialogComponent;\n"],"names":["_jsx"],"mappings":";;;;;;AAoEA,MAAM,oBAAoB,GAAG,aAAa,CAAiD,SAAS,CAAC;AAE9F,MAAM,uBAAuB,GAAG,MAA0B;AAC7D,IAAA,MAAM,OAAO,GAAG,UAAU,CAAC,oBAAoB,CAAC;IAChD,IAAI,CAAC,OAAO,EAAE;AACV,QAAA,MAAM,IAAI,KAAK,CAAC,6DAA6D,CAAC;IAClF;AACA,IAAA,OAAO,OAA8C;AACzD;AAEA,MAAM,oBAAoB,GAAG,CAA0B,EACnD,MAAM,EACN,OAAO,EACP,KAAK,EACL,YAAY,EACZ,WAAW,EACX,SAAS,EACT,QAAQ,EACR,eAAe,EACf,QAAQ,EAWX,KAAI;IACD,MAAM,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,OAAO,EAAE,GAAG,qBAAqB,EAAY;AACzF,IAAA,MAAM,eAAe,GAAG,kBAAkB,EAAY;IAEtD,MAAM,aAAa,GAAG,OAAO;AAE7B,IAAA,MAAM,aAAa,GAAG,YAAW;QAC7B,IAAI,eAAe,EAAE;AACjB,YAAA,MAAM,iBAAiB,GAAG,eAAe,CAAC,eAAe,CAAC;YAC1D,gBAAgB,CAAC,iBAAiB,CAAC;QACvC;AACA,QAAA,MAAM,MAAM,GAAG,MAAO,eAAkF,CAAC,OAAO,EAAE;AAClH,QAAA,IAAI,MAAM,CAAC,SAAS,EAAE;AAClB,YAAA,MAAM,SAAS,CAAC,MAAM,CAAC;AACvB,YAAA,OAAO,IAAI;QACf;aAAO;YACH,gBAAgB,CAAC,MAAM,CAAC;AACxB,YAAA,OAAO,KAAK;QAChB;AACJ,IAAA,CAAC;AAED,IAAA,MAAM,eAAe,GAAG,CAAC,KAAsB,KAAqB;QAChE,OAAO,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,KAAK,EAAE,CAAC,KAAK,KAAI;AACvC,YAAA,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC;AAAE,gBAAA,OAAO,KAAK;AAE9C,YAAA,MAAM,SAAS,GAAG,KAAK,CAAC,IAAoC;AAC5D,YAAA,IAAI,SAAS,CAAC,WAAW,KAAK,kBAAkB,EAAE;AAE9C,gBAAA,OAAOA,IAAC,uBAAuB,EAAA,EAAC,KAAK,EAAE,KAAgC,GAAI;YAC/E;AAEA,YAAA,MAAM,UAAU,GAAG,KAAK,CAAC,KAAgC;AACzD,YAAA,IAAI,UAAU,CAAC,QAAQ,IAAI,IAAI,EAAE;AAC7B,gBAAA,OAAO,KAAK,CAAC,YAAY,CAAC,KAAoD,EAAE;AAC5E,oBAAA,QAAQ,EAAE,eAAe,CAAC,UAAU,CAAC,QAA2B;AACnE,iBAAA,CAAC;YACN;AAEA,YAAA,OAAO,KAAK;AAChB,QAAA,CAAC,CAAC;AACN,IAAA,CAAC;AAED,IAAA,MAAM,iBAAiB,GAAG,eAAe,CAAC,QAAQ,CAAC;AAEnD,IAAA,QACIA,GAAA,CAAC,MAAM,EAAA,EACH,KAAK,EAAE,MAAM,EACb,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,EACZ,SAAS,EAAE,aAAa,EACxB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,aAAa,CAAC,QAAQ,EAC/B,OAAO,EAAE,YAAY,EACrB,WAAW,EAAE,WAAW,EACxB,OAAO,EAAE,aAAa,EAAA,QAAA,EAEtBA,GAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,EAAE,EAAA,QAAA,EAClE,iBAAiB,EAAA,CAChB,EAAA,CACD;AAEjB,CAAC;AAED,MAAM,sBAAsB,GAAG,CAAuD,KAA8C,KAAI;AACpI,IAAA,MAAM,EACF,OAAO,EACP,aAAa,EACb,aAAa,EACb,OAAO,EACP,MAAM,EACN,YAAY,GAAG,SAAS,EACxB,WAAW,GAAG,QAAQ,EACtB,WAAW,GAAG,aAAa,EAC3B,UAAU,GAAG,aAAa,EAC1B,SAAS,EACT,QAAQ,EACR,eAAe,EACf,aAAa,EACb,eAAe,EACf,QAAQ,EACR,KAAK,GAAG,MAAM,EACd,UAAU,EACV,UAAU,EACV,UAAU,EACV,yBAAyB,EACzB,cAAc,EACd,kBAAkB,EAClB,0BAA0B,EAC1B,uBAAuB,EACvB,uBAAuB,EACvB,qBAAqB,EACrB,gBAAgB,EAChB,cAAc,EACd,kBAAkB,EACrB,GAAG,KAAK;AAET,IAAA,MAAM,YAAY,GAAwC;AACtD,QAAA,SAAS,EAAE,SAAS;QACpB,QAAQ;QACR,YAAY;QACZ,WAAW;QACX,WAAW;QACX,UAAU;QACV,eAAe;QACf,aAAa;QACb;KACH;AAED,IAAA,QACIA,GAAA,CAAC,oBAAoB,CAAC,QAAQ,EAAA,EAAC,KAAK,EAAE,YAAY,EAAA,QAAA,EAC9CA,GAAA,CAAC,WAAW,EAAA,EACR,OAAO,EAAE,OAAO,EAChB,aAAa,EAAE,aAAa,EAC5B,aAAa,EAAE,aAAa,EAC5B,eAAe,EAAE,eAAe,EAChC,aAAa,EAAE,aAAa,EAC5B,eAAe,EAAE,eAAe,EAChC,UAAU,EAAE,UAAU,EACtB,UAAU,EAAE,UAAU,EACtB,UAAU,EAAE,UAAU,EACtB,yBAAyB,EAAE,yBAAyB,EACpD,cAAc,EAAE,cAAc,EAC9B,kBAAkB,EAAE,kBAAkB,EACtC,0BAA0B,EAAE,0BAA0B,EACtD,uBAAuB,EAAE,uBAAuB,EAChD,uBAAuB,EAAE,uBAAuB,EAChD,qBAAqB,EAAE,qBAAqB,EAC5C,gBAAgB,EAAE,gBAAgB,EAClC,cAAc,EAAE,cAAc,EAC9B,kBAAkB,EAAE,kBAAkB,EAAA,QAAA,EACtCA,GAAA,CAAC,oBAAoB,EAAA,EACjB,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,EACZ,YAAY,EAAE,YAAY,EAC1B,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,QAAQ,EAClB,eAAe,EAAE,eAAe,EAAA,QAAA,EAE/B,QAAQ,EAAA,CACU,EAAA,CACb,EAAA,CACc;AAExC,CAAC;AAED,MAAM,0BAA0B,GAAG,CAAC,EAAE,QAAQ,EAAiC,MAC3EA,GAAA,CAAC,WAAW,CAAC,MAAM,cAAE,QAAQ,EAAA,CAAsB,CACtD;AACD,0BAA0B,CAAC,WAAW,GAAG,mBAAmB;AAE5D,sBAAsB,CAAC,MAAM,GAAG,0BAA0B;AAEnD,MAAM,aAAa,GAAG;;;;"}
+{"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 { DialogButtons } from '@cratis/arc.react/dialogs';\nimport { Dialog } from '../Dialogs/Dialog';\nimport React from 'react';\nimport {\n    CommandForm,\n    CommandFormFieldWrapper,\n    useCommandFormContext,\n    useCommandInstance,\n    type CommandFormProps\n} from '@cratis/arc.react/commands';\n\nexport interface CommandDialogProps<TCommand extends object, TResponse = object>\n    extends Omit<CommandFormProps<TCommand>, 'children'> {\n    visible: boolean;\n    header: string;\n    confirmLabel?: string;\n    cancelLabel?: string;\n    onConfirm: (result: ICommandResult<TResponse>) => void | Promise<void>;\n    onCancel: () => void;\n    children?: React.ReactNode;\n    style?: React.CSSProperties;\n    width?: string;\n}\n\nconst CommandDialogWrapper = <TCommand extends object>({\n    header,\n    visible,\n    width,\n    confirmLabel,\n    cancelLabel,\n    onConfirm,\n    onCancel,\n    onBeforeExecute,\n    children\n}: {\n    header: string;\n    visible: boolean;\n    width: string;\n    confirmLabel: string;\n    cancelLabel: string;\n    onConfirm: (result: ICommandResult<unknown>) => void | Promise<void>;\n    onCancel: () => void;\n    onBeforeExecute?: (values: TCommand) => TCommand;\n    children: React.ReactNode;\n}) => {\n    const { setCommandValues, setCommandResult, isValid } = useCommandFormContext<TCommand>();\n    const commandInstance = useCommandInstance<TCommand>();\n\n    const handleConfirm = async () => {\n        if (onBeforeExecute) {\n            const transformedValues = onBeforeExecute(commandInstance);\n            setCommandValues(transformedValues);\n        }\n        const result = await (commandInstance as unknown as { execute: () => Promise<ICommandResult<unknown>> }).execute();\n        if (result.isSuccess) {\n            await onConfirm(result);\n            return true;\n        } else {\n            setCommandResult(result);\n            return false;\n        }\n    };\n\n    const processChildren = (nodes: React.ReactNode): React.ReactNode => {\n        return React.Children.map(nodes, (child) => {\n            if (!React.isValidElement(child)) return child;\n\n            const component = child.type as React.ComponentType<unknown>;\n            if (component.displayName === 'CommandFormField') {\n                type FieldElement = Parameters<typeof CommandFormFieldWrapper>[0]['field'];\n                return <CommandFormFieldWrapper field={child as unknown as FieldElement} />;\n            }\n\n            const childProps = child.props as Record<string, unknown>;\n            if (childProps.children != null) {\n                return React.cloneElement(child as React.ReactElement<Record<string, unknown>>, {\n                    children: processChildren(childProps.children as React.ReactNode)\n                });\n            }\n\n            return child;\n        });\n    };\n\n    const processedChildren = processChildren(children);\n\n    return (\n        <Dialog\n            title={header}\n            visible={visible}\n            width={width}\n            onConfirm={handleConfirm}\n            onCancel={onCancel}\n            buttons={DialogButtons.OkCancel}\n            okLabel={confirmLabel}\n            cancelLabel={cancelLabel}\n            isValid={isValid}\n        >\n            <div style={{ display: 'flex', flexDirection: 'column', width: '100%' }}>\n                {processedChildren}\n            </div>\n        </Dialog>\n    );\n};\n\nconst CommandDialogComponent = <TCommand extends object = object, TResponse = object>(props: CommandDialogProps<TCommand, TResponse>) => {\n    const {\n        visible,\n        header,\n        confirmLabel = 'Confirm',\n        cancelLabel = 'Cancel',\n        onConfirm,\n        onCancel,\n        children,\n        width = '50vw',\n        ...commandFormProps\n    } = props;\n\n    return (\n        <CommandForm<TCommand> {...commandFormProps}>\n            <CommandDialogWrapper<TCommand>\n                header={header}\n                visible={visible}\n                width={width}\n                confirmLabel={confirmLabel}\n                cancelLabel={cancelLabel}\n                onConfirm={onConfirm}\n                onCancel={onCancel}\n                onBeforeExecute={commandFormProps.onBeforeExecute}\n            >\n                {children}\n            </CommandDialogWrapper>\n        </CommandForm>\n    );\n};\n\nconst CommandDialogColumnWrapper = ({ children }: { children: React.ReactNode }) => (\n    <CommandForm.Column>{children}</CommandForm.Column>\n);\nCommandDialogColumnWrapper.displayName = 'CommandFormColumn';\n\nCommandDialogComponent.Column = CommandDialogColumnWrapper;\n\nexport const CommandDialog = CommandDialogComponent;\n"],"names":["_jsx"],"mappings":"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"}

package/dist/esm/CommandDialog/CommandDialog.stories.d.ts

@@ -5,6 +5,7 @@ declare const meta: Meta<typeof CommandDialog>;
 export default meta;
 type Story = StoryObj<typeof CommandDialog>;
 export declare const Default: Story;
+export declare const WithServerValidation: Story;
 export declare const WithInitialValues: Story;
 export declare const WithCustomValidation: Story;
 export declare const ValidationOnBlur: Story;

package/dist/esm/CommandDialog/CommandDialog.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CommandDialog.stories.d.ts","sourceRoot":"","sources":["../../../CommandDialog/CommandDialog.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAIhD,OAAO,wBAAwB,CAAC;AAEhC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,aAAa,CAGpC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,aAAa,CAAC,CAAC;AAsG5C,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC;AA4DF,eAAO,MAAM,iBAAiB,EAAE,KAE/B,CAAC;AA8DF,eAAO,MAAM,oBAAoB,EAAE,KAElC,CAAC;AA4BF,eAAO,MAAM,gBAAgB,EAAE,KAE9B,CAAC;AA4BF,eAAO,MAAM,kBAAkB,EAAE,KAEhC,CAAC;AA6BF,eAAO,MAAM,cAAc,EAAE,KAE5B,CAAC;AA6BF,eAAO,MAAM,yBAAyB,EAAE,KAEvC,CAAC;AA6CF,eAAO,MAAM,aAAa,EAAE,KAE3B,CAAC;AA2CF,eAAO,MAAM,SAAS,EAAE,KAEvB,CAAC;AA6EF,eAAO,MAAM,iBAAiB,EAAE,KAE/B,CAAC;AAkCF,eAAO,MAAM,aAAa,EAAE,KAE3B,CAAC"}
+{"version":3,"file":"CommandDialog.stories.d.ts","sourceRoot":"","sources":["../../../CommandDialog/CommandDialog.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAIhD,OAAO,wBAAwB,CAAC;AAEhC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,aAAa,CAGpC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,aAAa,CAAC,CAAC;AAsM5C,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC;AAEF,eAAO,MAAM,oBAAoB,EAAE,KAElC,CAAC;AA6DF,eAAO,MAAM,iBAAiB,EAAE,KAE/B,CAAC;AA+DF,eAAO,MAAM,oBAAoB,EAAE,KAElC,CAAC;AA6BF,eAAO,MAAM,gBAAgB,EAAE,KAE9B,CAAC;AA6BF,eAAO,MAAM,kBAAkB,EAAE,KAEhC,CAAC;AA8BF,eAAO,MAAM,cAAc,EAAE,KAE5B,CAAC;AA8BF,eAAO,MAAM,yBAAyB,EAAE,KAEvC,CAAC;AA8CF,eAAO,MAAM,aAAa,EAAE,KAE3B,CAAC;AA4CF,eAAO,MAAM,SAAS,EAAE,KAEvB,CAAC;AAsFF,eAAO,MAAM,iBAAiB,EAAE,KAE/B,CAAC;AAmCF,eAAO,MAAM,aAAa,EAAE,KAE3B,CAAC"}