@cratis/components 1.1.3 → 1.1.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/CommandDialog/CommandDialog.js +4 -25
- package/dist/cjs/CommandDialog/CommandDialog.js.map +1 -1
- package/dist/cjs/CommandDialog/index.js +0 -1
- package/dist/cjs/CommandDialog/index.js.map +1 -1
- package/dist/cjs/CommandForm/fields/CheckboxField.js +1 -1
- package/dist/cjs/CommandForm/fields/CheckboxField.js.map +1 -1
- package/dist/cjs/CommandForm/fields/DropdownField.js +1 -1
- package/dist/cjs/CommandForm/fields/DropdownField.js.map +1 -1
- package/dist/cjs/CommandForm/fields/InputTextField.js +1 -1
- package/dist/cjs/CommandForm/fields/InputTextField.js.map +1 -1
- package/dist/cjs/CommandForm/fields/NumberField.js +1 -1
- package/dist/cjs/CommandForm/fields/NumberField.js.map +1 -1
- package/dist/cjs/CommandForm/fields/SliderField.js +1 -1
- package/dist/cjs/CommandForm/fields/SliderField.js.map +1 -1
- package/dist/cjs/CommandForm/fields/TextAreaField.js +1 -1
- package/dist/cjs/CommandForm/fields/TextAreaField.js.map +1 -1
- package/dist/cjs/Common/Page.js +1 -1
- package/dist/cjs/Common/Page.js.map +1 -1
- package/dist/cjs/Dialogs/Dialog.js +10 -6
- package/dist/cjs/Dialogs/Dialog.js.map +1 -1
- package/dist/esm/CommandDialog/CommandDialog.d.ts +3 -42
- package/dist/esm/CommandDialog/CommandDialog.d.ts.map +1 -1
- package/dist/esm/CommandDialog/CommandDialog.js +6 -26
- package/dist/esm/CommandDialog/CommandDialog.js.map +1 -1
- package/dist/esm/CommandDialog/CommandDialog.stories.d.ts +1 -0
- package/dist/esm/CommandDialog/CommandDialog.stories.d.ts.map +1 -1
- package/dist/esm/CommandDialog/CommandDialog.stories.js +67 -14
- package/dist/esm/CommandDialog/CommandDialog.stories.js.map +1 -1
- package/dist/esm/CommandDialog/index.js +1 -1
- package/dist/esm/CommandForm/fields/CheckboxField.d.ts.map +1 -1
- package/dist/esm/CommandForm/fields/CheckboxField.js +1 -1
- package/dist/esm/CommandForm/fields/CheckboxField.js.map +1 -1
- package/dist/esm/CommandForm/fields/DropdownField.d.ts.map +1 -1
- package/dist/esm/CommandForm/fields/DropdownField.js +1 -1
- package/dist/esm/CommandForm/fields/DropdownField.js.map +1 -1
- package/dist/esm/CommandForm/fields/InputTextField.d.ts.map +1 -1
- package/dist/esm/CommandForm/fields/InputTextField.js +1 -1
- package/dist/esm/CommandForm/fields/InputTextField.js.map +1 -1
- package/dist/esm/CommandForm/fields/NumberField.d.ts.map +1 -1
- package/dist/esm/CommandForm/fields/NumberField.js +1 -1
- package/dist/esm/CommandForm/fields/NumberField.js.map +1 -1
- package/dist/esm/CommandForm/fields/SliderField.js +1 -1
- package/dist/esm/CommandForm/fields/SliderField.js.map +1 -1
- package/dist/esm/CommandForm/fields/TextAreaField.d.ts.map +1 -1
- package/dist/esm/CommandForm/fields/TextAreaField.js +1 -1
- package/dist/esm/CommandForm/fields/TextAreaField.js.map +1 -1
- package/dist/esm/Common/Page.js +1 -1
- package/dist/esm/Common/Page.js.map +1 -1
- package/dist/esm/Dialogs/Dialog.d.ts.map +1 -1
- package/dist/esm/Dialogs/Dialog.js +10 -6
- package/dist/esm/Dialogs/Dialog.js.map +1 -1
- package/dist/esm/Dialogs/Dialog.stories.d.ts.map +1 -1
- package/dist/esm/Dialogs/Dialog.stories.js +32 -8
- package/dist/esm/Dialogs/Dialog.stories.js.map +1 -1
- package/dist/esm/tsconfig.tsbuildinfo +1 -1
- package/package.json +4 -4
|
@@ -6,18 +6,9 @@ var Dialog = require('../Dialogs/Dialog.js');
|
|
|
6
6
|
var React = require('react');
|
|
7
7
|
var commands = require('@cratis/arc.react/commands');
|
|
8
8
|
|
|
9
|
-
const CommandDialogContext = React.createContext(undefined);
|
|
10
|
-
const useCommandDialogContext = () => {
|
|
11
|
-
const context = React.useContext(CommandDialogContext);
|
|
12
|
-
if (!context) {
|
|
13
|
-
throw new Error('useCommandDialogContext must be used within a CommandDialog');
|
|
14
|
-
}
|
|
15
|
-
return context;
|
|
16
|
-
};
|
|
17
9
|
const CommandDialogWrapper = ({ header, visible, width, confirmLabel, cancelLabel, onConfirm, onCancel, onBeforeExecute, children }) => {
|
|
18
10
|
const { setCommandValues, setCommandResult, isValid } = commands.useCommandFormContext();
|
|
19
11
|
const commandInstance = commands.useCommandInstance();
|
|
20
|
-
const isDialogValid = isValid;
|
|
21
12
|
const handleConfirm = async () => {
|
|
22
13
|
if (onBeforeExecute) {
|
|
23
14
|
const transformedValues = onBeforeExecute(commandInstance);
|
|
@@ -26,7 +17,7 @@ const CommandDialogWrapper = ({ header, visible, width, confirmLabel, cancelLabe
|
|
|
26
17
|
const result = await commandInstance.execute();
|
|
27
18
|
if (result.isSuccess) {
|
|
28
19
|
await onConfirm(result);
|
|
29
|
-
return
|
|
20
|
+
return false;
|
|
30
21
|
}
|
|
31
22
|
else {
|
|
32
23
|
setCommandResult(result);
|
|
@@ -51,22 +42,11 @@ const CommandDialogWrapper = ({ header, visible, width, confirmLabel, cancelLabe
|
|
|
51
42
|
});
|
|
52
43
|
};
|
|
53
44
|
const processedChildren = processChildren(children);
|
|
54
|
-
return (jsxRuntime.jsx(Dialog.Dialog, { title: header, visible: visible, width: width, onConfirm: handleConfirm, onCancel: onCancel, buttons: dialogs.DialogButtons.OkCancel, okLabel: confirmLabel, cancelLabel: cancelLabel, isValid:
|
|
45
|
+
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 }) }));
|
|
55
46
|
};
|
|
56
47
|
const CommandDialogComponent = (props) => {
|
|
57
|
-
const {
|
|
58
|
-
|
|
59
|
-
onSuccess: onConfirm,
|
|
60
|
-
onCancel,
|
|
61
|
-
confirmLabel,
|
|
62
|
-
cancelLabel,
|
|
63
|
-
confirmIcon,
|
|
64
|
-
cancelIcon,
|
|
65
|
-
onFieldValidate,
|
|
66
|
-
onFieldChange,
|
|
67
|
-
onBeforeExecute
|
|
68
|
-
};
|
|
69
|
-
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 }) }) }));
|
|
48
|
+
const { visible, header, confirmLabel = 'Confirm', cancelLabel = 'Cancel', onConfirm, onCancel, children, width = '50vw', ...commandFormProps } = props;
|
|
49
|
+
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 }) }));
|
|
70
50
|
};
|
|
71
51
|
const CommandDialogColumnWrapper = ({ children }) => (jsxRuntime.jsx(commands.CommandForm.Column, { children: children }));
|
|
72
52
|
CommandDialogColumnWrapper.displayName = 'CommandFormColumn';
|
|
@@ -74,5 +54,4 @@ CommandDialogComponent.Column = CommandDialogColumnWrapper;
|
|
|
74
54
|
const CommandDialog = CommandDialogComponent;
|
|
75
55
|
|
|
76
56
|
exports.CommandDialog = CommandDialog;
|
|
77
|
-
exports.useCommandDialogContext = useCommandDialogContext;
|
|
78
57
|
//# sourceMappingURL=CommandDialog.js.map
|
|
@@ -1 +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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"}
|
|
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 { 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 false;\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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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
|
|
@@ -4,7 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
|
|
|
4
4
|
var checkbox = require('primereact/checkbox');
|
|
5
5
|
var commands = require('@cratis/arc.react/commands');
|
|
6
6
|
|
|
7
|
-
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 })] })), {
|
|
7
|
+
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 })] })), {
|
|
8
8
|
defaultValue: false,
|
|
9
9
|
extractValue: (e) => e.checked
|
|
10
10
|
});
|
|
@@ -1 +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,
|
|
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 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;;;;"}
|
|
@@ -4,7 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
|
|
|
4
4
|
var dropdown = require('primereact/dropdown');
|
|
5
5
|
var commands = require('@cratis/arc.react/commands');
|
|
6
6
|
|
|
7
|
-
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" })), {
|
|
7
|
+
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" })), {
|
|
8
8
|
defaultValue: '',
|
|
9
9
|
extractValue: (e) => e
|
|
10
10
|
});
|
|
@@ -1 +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,
|
|
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 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;;;;"}
|
|
@@ -4,7 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
|
|
|
4
4
|
var inputtext = require('primereact/inputtext');
|
|
5
5
|
var commands = require('@cratis/arc.react/commands');
|
|
6
6
|
|
|
7
|
-
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" })), {
|
|
7
|
+
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" })), {
|
|
8
8
|
defaultValue: '',
|
|
9
9
|
extractValue: (e) => e.target.value
|
|
10
10
|
});
|
|
@@ -1 +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,
|
|
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 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;;;;"}
|
|
@@ -4,7 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
|
|
|
4
4
|
var inputnumber = require('primereact/inputnumber');
|
|
5
5
|
var commands = require('@cratis/arc.react/commands');
|
|
6
6
|
|
|
7
|
-
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" })), {
|
|
7
|
+
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" })), {
|
|
8
8
|
defaultValue: 0,
|
|
9
9
|
extractValue: (e) => (typeof e === 'number' ? e : 0)
|
|
10
10
|
});
|
|
@@ -1 +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,
|
|
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 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;;;;"}
|
|
@@ -4,7 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
|
|
|
4
4
|
var slider = require('primereact/slider');
|
|
5
5
|
var commands = require('@cratis/arc.react/commands');
|
|
6
6
|
|
|
7
|
-
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 }) })] })), {
|
|
7
|
+
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 }) })] })), {
|
|
8
8
|
defaultValue: 0,
|
|
9
9
|
extractValue: (e) => (typeof e === 'number' ? e : 0)
|
|
10
10
|
});
|
|
@@ -1 +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":";;;;;;
|
|
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\" 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;;;;"}
|
|
@@ -4,7 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
|
|
|
4
4
|
var inputtextarea = require('primereact/inputtextarea');
|
|
5
5
|
var commands = require('@cratis/arc.react/commands');
|
|
6
6
|
|
|
7
|
-
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" })), {
|
|
7
|
+
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" })), {
|
|
8
8
|
defaultValue: '',
|
|
9
9
|
extractValue: (e) => e.target.value
|
|
10
10
|
});
|
|
@@ -1 +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,
|
|
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 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/cjs/Common/Page.js
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
var jsxRuntime = require('react/jsx-runtime');
|
|
4
4
|
|
|
5
5
|
const Page = ({ title, children, panel, ...rest }) => {
|
|
6
|
-
return (jsxRuntime.jsxs("div", { className: 'flex flex-col h-full', ...rest, children: [jsxRuntime.jsx("h1", { className: 'text-3xl mt-3 mb-4', children: title }), jsxRuntime.jsx("main", { className: `overflow-hidden h-full flex flex-col flex-1 ${panel ? 'panel' : ''}`, children: children })] }));
|
|
6
|
+
return (jsxRuntime.jsxs("div", { className: 'flex flex-col h-full flex-1', ...rest, children: [jsxRuntime.jsx("h1", { className: 'text-3xl mt-3 mb-4', children: title }), jsxRuntime.jsx("main", { className: `overflow-hidden h-full flex flex-col flex-1 ${panel ? 'panel' : ''}`, children: children })] }));
|
|
7
7
|
};
|
|
8
8
|
|
|
9
9
|
exports.Page = Page;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Page.js","sources":["../../../Common/Page.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 { HTMLAttributes, ReactNode } from 'react';\n\nexport interface PageProps extends HTMLAttributes<HTMLDivElement> {\n title: string;\n children?: ReactNode;\n panel?: boolean\n}\n\nexport const Page = ({ title, children, panel, ...rest }: PageProps) => {\n return (\n <div className='flex flex-col h-full' {...rest}>\n <h1 className='text-3xl mt-3 mb-4'>{title}</h1>\n <main className={`overflow-hidden h-full flex flex-col flex-1 ${panel ? 'panel' : ''}`}>\n {children}\n </main>\n </div>\n );\n};\n"],"names":["_jsxs","_jsx"],"mappings":";;;;AAWO,MAAM,IAAI,GAAG,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,IAAI,EAAa,KAAI;AACnE,IAAA,QACIA,eAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,
|
|
1
|
+
{"version":3,"file":"Page.js","sources":["../../../Common/Page.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 { HTMLAttributes, ReactNode } from 'react';\n\nexport interface PageProps extends HTMLAttributes<HTMLDivElement> {\n title: string;\n children?: ReactNode;\n panel?: boolean\n}\n\nexport const Page = ({ title, children, panel, ...rest }: PageProps) => {\n return (\n <div className='flex flex-col h-full flex-1' {...rest}>\n <h1 className='text-3xl mt-3 mb-4'>{title}</h1>\n <main className={`overflow-hidden h-full flex flex-col flex-1 ${panel ? 'panel' : ''}`}>\n {children}\n </main>\n </div>\n );\n};\n"],"names":["_jsxs","_jsx"],"mappings":";;;;AAWO,MAAM,IAAI,GAAG,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,IAAI,EAAa,KAAI;AACnE,IAAA,QACIA,eAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,6BAA6B,EAAA,GAAK,IAAI,EAAA,QAAA,EAAA,CACjDC,cAAA,CAAA,IAAA,EAAA,EAAI,SAAS,EAAC,oBAAoB,EAAA,QAAA,EAAE,KAAK,GAAM,EAC/CA,cAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAE,+CAA+C,KAAK,GAAG,OAAO,GAAG,EAAE,EAAE,EAAA,QAAA,EACjF,QAAQ,EAAA,CACN,CAAA,EAAA,CACL;AAEd;;;;"}
|
|
@@ -17,24 +17,28 @@ const Dialog = ({ title, visible = true, onClose, onConfirm, onCancel, buttons =
|
|
|
17
17
|
const isDialogValid = isValid !== false;
|
|
18
18
|
const headerElement = (jsxRuntime.jsx("div", { className: "inline-flex align-items-center justify-content-center gap-2", children: jsxRuntime.jsx("span", { className: "font-bold white-space-nowrap", children: title }) }));
|
|
19
19
|
const handleClose = async (result) => {
|
|
20
|
-
let
|
|
20
|
+
let shouldCloseThroughContext = true;
|
|
21
21
|
if (result === dialogs.DialogResult.Ok || result === dialogs.DialogResult.Yes) {
|
|
22
22
|
if (onConfirm) {
|
|
23
|
-
closeResult = await onConfirm();
|
|
23
|
+
const closeResult = await onConfirm();
|
|
24
|
+
shouldCloseThroughContext = closeResult === true;
|
|
24
25
|
}
|
|
25
26
|
else if (onClose) {
|
|
26
|
-
closeResult = await onClose(result);
|
|
27
|
+
const closeResult = await onClose(result);
|
|
28
|
+
shouldCloseThroughContext = closeResult !== false;
|
|
27
29
|
}
|
|
28
30
|
}
|
|
29
31
|
else {
|
|
30
32
|
if (onCancel) {
|
|
31
|
-
closeResult = await onCancel();
|
|
33
|
+
const closeResult = await onCancel();
|
|
34
|
+
shouldCloseThroughContext = closeResult === true;
|
|
32
35
|
}
|
|
33
36
|
else if (onClose) {
|
|
34
|
-
closeResult = await onClose(result);
|
|
37
|
+
const closeResult = await onClose(result);
|
|
38
|
+
shouldCloseThroughContext = closeResult !== false;
|
|
35
39
|
}
|
|
36
40
|
}
|
|
37
|
-
if (
|
|
41
|
+
if (shouldCloseThroughContext) {
|
|
38
42
|
contextCloseDialog?.(result);
|
|
39
43
|
}
|
|
40
44
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dialog.js","sources":["../../../Dialogs/Dialog.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 { Dialog as PrimeDialog } from 'primereact/dialog';\nimport { Button } from 'primereact/button';\nimport { DialogResult, DialogButtons, useDialogContext } from '@cratis/arc.react/dialogs';\nimport { ReactNode } from 'react';\n\nexport type CloseDialog = (result: DialogResult) => boolean | void | Promise<boolean> | Promise<void>;\nexport type ConfirmCallback = () => boolean | void | Promise<boolean> | Promise<void>;\nexport type CancelCallback = () => boolean | void | Promise<boolean> | Promise<void>;\n\nexport interface DialogProps {\n title: string;\n visible?: boolean;\n onClose?: CloseDialog;\n onConfirm?: ConfirmCallback;\n onCancel?: CancelCallback;\n buttons?: DialogButtons | ReactNode;\n children: ReactNode;\n width?: string;\n resizable?: boolean;\n isValid?: boolean;\n okLabel?: string;\n cancelLabel?: string;\n yesLabel?: string;\n noLabel?: string;\n}\n\nexport const Dialog = ({ \n title, \n visible = true, \n onClose, \n onConfirm,\n onCancel,\n buttons = DialogButtons.OkCancel, \n children, \n width = '450px', \n resizable = false, \n isValid,\n okLabel = 'Ok',\n cancelLabel = 'Cancel',\n yesLabel = 'Yes',\n noLabel = 'No'\n}: DialogProps) => {\n // Try to get dialog context, but allow it to be undefined for standalone usage\n let contextCloseDialog: ((result: DialogResult) => void) | undefined;\n try {\n const context = useDialogContext();\n contextCloseDialog = context?.closeDialog;\n } catch {\n // No context available - dialog is being used standalone\n contextCloseDialog = undefined;\n }\n \n const isDialogValid = isValid !== false;\n const headerElement = (\n <div className=\"inline-flex align-items-center justify-content-center gap-2\">\n <span className=\"font-bold white-space-nowrap\">{title}</span>\n </div>\n );\n\n const handleClose = async (result: DialogResult) => {\n
|
|
1
|
+
{"version":3,"file":"Dialog.js","sources":["../../../Dialogs/Dialog.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 { Dialog as PrimeDialog } from 'primereact/dialog';\nimport { Button } from 'primereact/button';\nimport { DialogResult, DialogButtons, useDialogContext } from '@cratis/arc.react/dialogs';\nimport { ReactNode } from 'react';\n\nexport type CloseDialog = (result: DialogResult) => boolean | void | Promise<boolean> | Promise<void>;\nexport type ConfirmCallback = () => boolean | void | Promise<boolean> | Promise<void>;\nexport type CancelCallback = () => boolean | void | Promise<boolean> | Promise<void>;\n\nexport interface DialogProps {\n title: string;\n visible?: boolean;\n onClose?: CloseDialog;\n onConfirm?: ConfirmCallback;\n onCancel?: CancelCallback;\n buttons?: DialogButtons | ReactNode;\n children: ReactNode;\n width?: string;\n resizable?: boolean;\n isValid?: boolean;\n okLabel?: string;\n cancelLabel?: string;\n yesLabel?: string;\n noLabel?: string;\n}\n\nexport const Dialog = ({ \n title, \n visible = true, \n onClose, \n onConfirm,\n onCancel,\n buttons = DialogButtons.OkCancel, \n children, \n width = '450px', \n resizable = false, \n isValid,\n okLabel = 'Ok',\n cancelLabel = 'Cancel',\n yesLabel = 'Yes',\n noLabel = 'No'\n}: DialogProps) => {\n // Try to get dialog context, but allow it to be undefined for standalone usage\n let contextCloseDialog: ((result: DialogResult) => void) | undefined;\n try {\n const context = useDialogContext();\n contextCloseDialog = context?.closeDialog;\n } catch {\n // No context available - dialog is being used standalone\n contextCloseDialog = undefined;\n }\n \n const isDialogValid = isValid !== false;\n const headerElement = (\n <div className=\"inline-flex align-items-center justify-content-center gap-2\">\n <span className=\"font-bold white-space-nowrap\">{title}</span>\n </div>\n );\n\n const handleClose = async (result: DialogResult) => {\n let shouldCloseThroughContext = true;\n\n if (result === DialogResult.Ok || result === DialogResult.Yes) {\n if (onConfirm) {\n const closeResult = await onConfirm();\n shouldCloseThroughContext = closeResult === true;\n } else if (onClose) {\n const closeResult = await onClose(result);\n shouldCloseThroughContext = closeResult !== false;\n }\n } else {\n if (onCancel) {\n const closeResult = await onCancel();\n shouldCloseThroughContext = closeResult === true;\n } else if (onClose) {\n const closeResult = await onClose(result);\n shouldCloseThroughContext = closeResult !== false;\n }\n }\n\n if (shouldCloseThroughContext) {\n contextCloseDialog?.(result);\n }\n };\n\n const okFooter = (\n <>\n <Button label={okLabel} icon=\"pi pi-check\" onClick={() => handleClose(DialogResult.Ok)} disabled={!isDialogValid} autoFocus />\n </>\n );\n\n const okCancelFooter = (\n <>\n <Button label={okLabel} icon=\"pi pi-check\" onClick={() => handleClose(DialogResult.Ok)} disabled={!isDialogValid} autoFocus />\n <Button label={cancelLabel} icon=\"pi pi-times\" outlined onClick={() => handleClose(DialogResult.Cancelled)} />\n </>\n );\n\n const yesNoFooter = (\n <>\n <Button label={yesLabel} icon=\"pi pi-check\" onClick={() => handleClose(DialogResult.Yes)} disabled={!isDialogValid} autoFocus />\n <Button label={noLabel} icon=\"pi pi-times\" outlined onClick={() => handleClose(DialogResult.No)} />\n </>\n );\n\n const yesNoCancelFooter = (\n <>\n <Button label={yesLabel} icon=\"pi pi-check\" onClick={() => handleClose(DialogResult.Yes)} disabled={!isDialogValid} autoFocus />\n <Button label={noLabel} icon=\"pi pi-times\" outlined onClick={() => handleClose(DialogResult.No)} />\n <Button label={cancelLabel} icon=\"pi pi-times\" outlined onClick={() => handleClose(DialogResult.Cancelled)} />\n </>\n );\n\n const getFooterInterior = () => {\n // If buttons is a ReactNode (custom buttons), use it directly\n if (typeof buttons !== 'number') {\n return buttons;\n }\n\n // Otherwise, use predefined buttons based on DialogButtons enum\n switch (buttons) {\n case DialogButtons.Ok:\n return okFooter;\n case DialogButtons.OkCancel:\n return okCancelFooter;\n case DialogButtons.YesNo:\n return yesNoFooter;\n case DialogButtons.YesNoCancel:\n return yesNoCancelFooter;\n }\n\n return (<></>);\n };\n\n const footer = (\n <div className=\"flex flex-wrap justify-content-start gap-3\">\n {getFooterInterior()}\n </div>\n );\n\n return (\n <PrimeDialog\n header={headerElement}\n modal\n footer={footer}\n // eslint-disable-next-line @typescript-eslint/no-empty-function\n onHide={typeof buttons === 'number' ? () => handleClose(DialogResult.Cancelled) : () => {}}\n visible={visible}\n style={{ width }}\n resizable={resizable}\n closable={typeof buttons === 'number'}>\n {children}\n </PrimeDialog>\n );\n};\n"],"names":["DialogButtons","useDialogContext","_jsx","DialogResult","_Fragment","Button","_jsxs","PrimeDialog"],"mappings":"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"}
|
|
@@ -1,55 +1,17 @@
|
|
|
1
1
|
import { ICommandResult } from '@cratis/arc/commands';
|
|
2
|
-
import { Constructor } from '@cratis/fundamentals';
|
|
3
2
|
import React from 'react';
|
|
4
|
-
import {
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
export type FieldValidator<TCommand> = (command: TCommand, fieldName: string, oldValue: unknown, newValue: unknown) => string | undefined;
|
|
8
|
-
export type FieldChangeCallback<TCommand> = (command: TCommand, fieldName: string, oldValue: unknown, newValue: unknown) => void;
|
|
9
|
-
export interface CommandDialogProps<TCommand, TResponse = object> {
|
|
10
|
-
command: Constructor<TCommand>;
|
|
11
|
-
initialValues?: Partial<TCommand>;
|
|
12
|
-
currentValues?: Partial<TCommand> | undefined;
|
|
13
|
-
visible: boolean;
|
|
3
|
+
import { type CommandFormProps } from '@cratis/arc.react/commands';
|
|
4
|
+
export interface CommandDialogProps<TCommand extends object, TResponse = object> extends Omit<CommandFormProps<TCommand>, 'children'> {
|
|
5
|
+
visible?: boolean;
|
|
14
6
|
header: string;
|
|
15
7
|
confirmLabel?: string;
|
|
16
8
|
cancelLabel?: string;
|
|
17
|
-
confirmIcon?: string;
|
|
18
|
-
cancelIcon?: string;
|
|
19
9
|
onConfirm: (result: ICommandResult<TResponse>) => void | Promise<void>;
|
|
20
10
|
onCancel: () => void;
|
|
21
|
-
onFieldValidate?: FieldValidator<TCommand>;
|
|
22
|
-
onFieldChange?: FieldChangeCallback<TCommand>;
|
|
23
|
-
onBeforeExecute?: BeforeExecuteCallback<TCommand>;
|
|
24
11
|
children?: React.ReactNode;
|
|
25
12
|
style?: React.CSSProperties;
|
|
26
13
|
width?: string;
|
|
27
|
-
showTitles?: boolean;
|
|
28
|
-
showErrors?: boolean;
|
|
29
|
-
validateOn?: CommandFormProps['validateOn'];
|
|
30
|
-
validateAllFieldsOnChange?: boolean;
|
|
31
|
-
validateOnInit?: boolean;
|
|
32
|
-
autoServerValidate?: boolean;
|
|
33
|
-
autoServerValidateThrottle?: number;
|
|
34
|
-
fieldContainerComponent?: CommandFormProps['fieldContainerComponent'];
|
|
35
|
-
fieldDecoratorComponent?: CommandFormProps['fieldDecoratorComponent'];
|
|
36
|
-
errorDisplayComponent?: CommandFormProps['errorDisplayComponent'];
|
|
37
|
-
tooltipComponent?: CommandFormProps['tooltipComponent'];
|
|
38
|
-
errorClassName?: string;
|
|
39
|
-
iconAddonClassName?: string;
|
|
40
14
|
}
|
|
41
|
-
interface CommandDialogContextValue<TCommand = unknown> {
|
|
42
|
-
onSuccess: (result: ICommandResult<unknown>) => void | Promise<void>;
|
|
43
|
-
onCancel: () => void;
|
|
44
|
-
confirmLabel: string;
|
|
45
|
-
cancelLabel: string;
|
|
46
|
-
confirmIcon: string;
|
|
47
|
-
cancelIcon: string;
|
|
48
|
-
onFieldValidate?: FieldValidator<TCommand>;
|
|
49
|
-
onFieldChange?: FieldChangeCallback<TCommand>;
|
|
50
|
-
onBeforeExecute?: BeforeExecuteCallback<TCommand>;
|
|
51
|
-
}
|
|
52
|
-
export declare const useCommandDialogContext: <TCommand = unknown>() => CommandDialogContextValue<TCommand>;
|
|
53
15
|
export declare const CommandDialog: {
|
|
54
16
|
<TCommand extends object = object, TResponse = object>(props: CommandDialogProps<TCommand, TResponse>): import("react/jsx-runtime").JSX.Element;
|
|
55
17
|
Column: {
|
|
@@ -59,5 +21,4 @@ export declare const CommandDialog: {
|
|
|
59
21
|
displayName: string;
|
|
60
22
|
};
|
|
61
23
|
};
|
|
62
|
-
export {};
|
|
63
24
|
//# sourceMappingURL=CommandDialog.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CommandDialog.d.ts","sourceRoot":"","sources":["../../../CommandDialog/CommandDialog.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;
|
|
1
|
+
{"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,CAAC,EAAE,OAAO,CAAC;IAClB,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"}
|
|
@@ -1,21 +1,12 @@
|
|
|
1
1
|
import { jsx } from 'react/jsx-runtime';
|
|
2
2
|
import { DialogButtons } from '@cratis/arc.react/dialogs';
|
|
3
3
|
import { Dialog } from '../Dialogs/Dialog.js';
|
|
4
|
-
import React
|
|
4
|
+
import React from 'react';
|
|
5
5
|
import { CommandForm, useCommandFormContext, useCommandInstance, CommandFormFieldWrapper } from '@cratis/arc.react/commands';
|
|
6
6
|
|
|
7
|
-
const CommandDialogContext = createContext(undefined);
|
|
8
|
-
const useCommandDialogContext = () => {
|
|
9
|
-
const context = useContext(CommandDialogContext);
|
|
10
|
-
if (!context) {
|
|
11
|
-
throw new Error('useCommandDialogContext must be used within a CommandDialog');
|
|
12
|
-
}
|
|
13
|
-
return context;
|
|
14
|
-
};
|
|
15
7
|
const CommandDialogWrapper = ({ header, visible, width, confirmLabel, cancelLabel, onConfirm, onCancel, onBeforeExecute, children }) => {
|
|
16
8
|
const { setCommandValues, setCommandResult, isValid } = useCommandFormContext();
|
|
17
9
|
const commandInstance = useCommandInstance();
|
|
18
|
-
const isDialogValid = isValid;
|
|
19
10
|
const handleConfirm = async () => {
|
|
20
11
|
if (onBeforeExecute) {
|
|
21
12
|
const transformedValues = onBeforeExecute(commandInstance);
|
|
@@ -24,7 +15,7 @@ const CommandDialogWrapper = ({ header, visible, width, confirmLabel, cancelLabe
|
|
|
24
15
|
const result = await commandInstance.execute();
|
|
25
16
|
if (result.isSuccess) {
|
|
26
17
|
await onConfirm(result);
|
|
27
|
-
return
|
|
18
|
+
return false;
|
|
28
19
|
}
|
|
29
20
|
else {
|
|
30
21
|
setCommandResult(result);
|
|
@@ -49,27 +40,16 @@ const CommandDialogWrapper = ({ header, visible, width, confirmLabel, cancelLabe
|
|
|
49
40
|
});
|
|
50
41
|
};
|
|
51
42
|
const processedChildren = processChildren(children);
|
|
52
|
-
return (jsx(Dialog, { title: header, visible: visible, width: width, onConfirm: handleConfirm, onCancel: onCancel, buttons: DialogButtons.OkCancel, okLabel: confirmLabel, cancelLabel: cancelLabel, isValid:
|
|
43
|
+
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 }) }));
|
|
53
44
|
};
|
|
54
45
|
const CommandDialogComponent = (props) => {
|
|
55
|
-
const {
|
|
56
|
-
|
|
57
|
-
onSuccess: onConfirm,
|
|
58
|
-
onCancel,
|
|
59
|
-
confirmLabel,
|
|
60
|
-
cancelLabel,
|
|
61
|
-
confirmIcon,
|
|
62
|
-
cancelIcon,
|
|
63
|
-
onFieldValidate,
|
|
64
|
-
onFieldChange,
|
|
65
|
-
onBeforeExecute
|
|
66
|
-
};
|
|
67
|
-
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 }) }) }));
|
|
46
|
+
const { visible, header, confirmLabel = 'Confirm', cancelLabel = 'Cancel', onConfirm, onCancel, children, width = '50vw', ...commandFormProps } = props;
|
|
47
|
+
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 }) }));
|
|
68
48
|
};
|
|
69
49
|
const CommandDialogColumnWrapper = ({ children }) => (jsx(CommandForm.Column, { children: children }));
|
|
70
50
|
CommandDialogColumnWrapper.displayName = 'CommandFormColumn';
|
|
71
51
|
CommandDialogComponent.Column = CommandDialogColumnWrapper;
|
|
72
52
|
const CommandDialog = CommandDialogComponent;
|
|
73
53
|
|
|
74
|
-
export { CommandDialog
|
|
54
|
+
export { CommandDialog };
|
|
75
55
|
//# sourceMappingURL=CommandDialog.js.map
|
|
@@ -1 +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":"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"}
|
|
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 { 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 false;\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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"}
|
|
@@ -5,6 +5,7 @@ declare const meta: Meta<typeof CommandDialog>;
|
|
|
5
5
|
export default meta;
|
|
6
6
|
type Story = StoryObj<typeof CommandDialog>;
|
|
7
7
|
export declare const Default: Story;
|
|
8
|
+
export declare const WithServerValidation: Story;
|
|
8
9
|
export declare const WithInitialValues: Story;
|
|
9
10
|
export declare const WithCustomValidation: Story;
|
|
10
11
|
export declare const ValidationOnBlur: Story;
|
|
@@ -1 +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;
|
|
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;AAKhD,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;AA2L5C,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"}
|