xmlui 0.11.4 → 0.11.7

package/dist/scripts/src/components/Form/FormContext.js

@@ -1,124 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.formControlTypesMd = exports.formControlTypes = exports.FormContext = exports.validationModeMd = exports.defaultValidationMode = exports.validationModeValues = exports.validationSeverityMd = exports.validationSeverityValues = void 0;
-exports.useFormContextPart = useFormContextPart;
-exports.useIsInsideForm = useIsInsideForm;
-const use_context_selector_1 = require("use-context-selector");
-exports.validationSeverityValues = ["error", "warning", "valid", "none"];
-exports.validationSeverityMd = [
-    { value: "valid", description: "Visual indicator for an input that is accepted" },
-    { value: "warning", description: "Visual indicator for an input that produced a warning" },
-    { value: "error", description: "Visual indicator for an input that produced an error" },
-];
-exports.validationModeValues = ["errorLate", "onChanged", "onLostFocus"];
-exports.defaultValidationMode = "errorLate";
-exports.validationModeMd = [
-    {
-        value: "errorLate",
-        description: "Display the error when the field loses focus." +
-            "If an error is already displayed, continue for every keystroke until input is accepted.",
-    },
-    {
-        value: "onChanged",
-        description: "Display error (if present) for every keystroke.",
-    },
-    {
-        value: "onLostFocus",
-        description: "Show/hide error (if present) only if the field loses focus.",
-    },
-];
-exports.FormContext = (0, use_context_selector_1.createContext)(undefined);
-function useFormContextPart(selector) {
-    return (0, use_context_selector_1.useContextSelector)(exports.FormContext, selector);
-}
-function useIsInsideForm() {
-    const contextPart = useFormContextPart((value) => value === null || value === void 0 ? void 0 : value.dispatch);
-    return contextPart !== undefined;
-}
-exports.formControlTypes = [
-    "text",
-    "password",
-    "textarea",
-    "checkbox",
-    "number",
-    "integer",
-    "number2",
-    "integer2",
-    "file",
-    "select",
-    "autocomplete",
-    "datePicker",
-    "radioGroup",
-    "custom",
-    "switch",
-    "slider",
-    "colorpicker",
-    "items",
-];
-exports.formControlTypesMd = [
-    {
-        value: "text",
-        description: "Renders TextBox",
-    },
-    {
-        value: "password",
-        description: "Renders TextBox with `password` type",
-    },
-    {
-        value: "textarea",
-        description: "Renders Textarea",
-    },
-    {
-        value: "checkbox",
-        description: "Renders Checkbox",
-    },
-    {
-        value: "number",
-        description: "Renders NumberBox",
-    },
-    {
-        value: "integer",
-        description: "Renders NumberBox with `integersOnly` set to true",
-    },
-    {
-        value: "file",
-        description: "Renders FileInput",
-    },
-    {
-        value: "datePicker",
-        description: "Renders DatePicker",
-    },
-    {
-        value: "radioGroup",
-        description: "Renders RadioGroup",
-    },
-    {
-        value: "switch",
-        description: "Renders Switch",
-    },
-    {
-        value: "select",
-        description: "Renders Select",
-    },
-    {
-        value: "autocomplete",
-        description: "Renders AutoComplete",
-    },
-    {
-        value: "slider",
-        description: "Renders Slider",
-    },
-    {
-        value: "colorpicker",
-        description: "Renders ColorPicker",
-    },
-    {
-        value: "items",
-        description: "Renders Items",
-    },
-    {
-        value: "custom",
-        description: "A custom control specified in children. If `type` is not specified " +
-            "but the `FormItem` has children, it considers the control a custom one.",
-    },
-];

package/dist/scripts/src/components/Form/FormNative.js

@@ -1,463 +0,0 @@
-"use strict";
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.FormWithContextVar = exports.defaultProps = exports.getByPath = void 0;
-const react_1 = require("react");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_2 = require("react");
-const react_dom_1 = require("react-dom");
-const immer_1 = __importDefault(require("immer"));
-const Form_module_scss_1 = __importDefault(require("./Form.module.scss"));
-const constants_1 = require("../../components-core/constants");
-const misc_1 = require("../../components-core/utils/misc");
-const formActions_1 = require("../../components/Form/formActions");
-const ModalDialogNative_1 = require("../../components/ModalDialog/ModalDialogNative");
-const TextNative_1 = require("../../components/Text/TextNative");
-const StackNative_1 = require("../../components/Stack/StackNative");
-const ModalVisibilityContext_1 = require("../../components/ModalDialog/ModalVisibilityContext");
-const ButtonNative_1 = require("../Button/ButtonNative");
-const ValidationSummary_1 = require("../ValidationSummary/ValidationSummary");
-const Validations_1 = require("../FormItem/Validations");
-const formActions_2 = require("../Form/formActions");
-const FormContext_1 = require("./FormContext");
-const lodash_es_1 = require("lodash-es");
-const classnames_1 = __importDefault(require("classnames"));
-const react_slot_1 = require("@radix-ui/react-slot");
-const layout_resolver_1 = require("../../components-core/theming/layout-resolver");
-const PART_CANCEL_BUTTON = "cancelButton";
-const PART_SUBMIT_BUTTON = "submitButton";
-const getByPath = (obj, path) => {
-    return (0, lodash_es_1.get)(obj, path);
-};
-exports.getByPath = getByPath;
-const formReducer = (0, immer_1.default)((state, action) => {
-    var _a, _b, _c, _d, _e;
-    const { uid } = action.payload;
-    if (uid !== undefined && !state.interactionFlags[uid]) {
-        state.interactionFlags[uid] = {
-            isDirty: false,
-            invalidToValid: false,
-            isValidOnFocus: false,
-            isValidLostFocus: false,
-            focused: false,
-            afterFirstDirtyBlur: false,
-            forceShowValidationResult: false,
-        };
-    }
-    switch (action.type) {
-        case formActions_1.FormActionKind.FIELD_INITIALIZED: {
-            // Only set the value if initialValue is defined and field is not dirty (or force is true)
-            if (action.payload.value !== undefined && (!state.interactionFlags[uid].isDirty || action.payload.force)) {
-                (0, lodash_es_1.set)(state.subject, uid, action.payload.value);
-            }
-            // Track noSubmit flag - if multiple FormItems reference the same bindTo,
-            // and any of them has noSubmit: true, the field should NOT be submitted.
-            if (state.noSubmitFields[uid] === true || action.payload.noSubmit === true) {
-                state.noSubmitFields[uid] = true;
-            }
-            else {
-                state.noSubmitFields[uid] = false;
-            }
-            break;
-        }
-        case formActions_1.FormActionKind.FIELD_REMOVED: {
-            delete state.validationResults[uid];
-            delete state.interactionFlags[uid];
-            delete state.noSubmitFields[uid];
-            break;
-        }
-        case formActions_1.FormActionKind.FIELD_VALUE_CHANGED: {
-            (0, lodash_es_1.set)(state.subject, uid, action.payload.value);
-            state.interactionFlags[uid].isDirty = true;
-            state.interactionFlags[uid].forceShowValidationResult = false;
-            break;
-        }
-        case formActions_1.FormActionKind.FIELD_VALIDATED: {
-            // it means no validation happened, ignore it
-            if (action.payload.validationResult.validations.length === 0) {
-                delete state.validationResults[uid];
-                break;
-            }
-            const prevValid = (_a = state.validationResults[uid]) === null || _a === void 0 ? void 0 : _a.isValid;
-            //if it's a partial validation (without the async stuff), we leave the previous async validations there as a stale placeholder
-            if (action.payload.validationResult.partial) {
-                const mergedValidations = [
-                    ...action.payload.validationResult.validations,
-                    ...(((_b = state.validationResults[uid]) === null || _b === void 0 ? void 0 : _b.validations.filter((val) => val.async)) || []).map((val) => (Object.assign(Object.assign({}, val), { stale: true }))),
-                ];
-                state.validationResults[uid] = Object.assign(Object.assign({}, action.payload.validationResult), { isValid: mergedValidations.find((val) => !val.isValid) === undefined, validations: mergedValidations });
-            }
-            else {
-                state.validationResults[uid] = action.payload.validationResult;
-            }
-            const currentIsInvalidToValid = !prevValid && state.validationResults[uid].isValid;
-            if (currentIsInvalidToValid) {
-                state.interactionFlags[uid].invalidToValid = true;
-            }
-            break;
-        }
-        case formActions_1.FormActionKind.FIELD_FOCUSED: {
-            state.interactionFlags[uid].isValidOnFocus = !!((_c = state.validationResults[uid]) === null || _c === void 0 ? void 0 : _c.isValid);
-            state.interactionFlags[uid].focused = true;
-            break;
-        }
-        case formActions_1.FormActionKind.FIELD_LOST_FOCUS: {
-            state.interactionFlags[uid].isValidLostFocus = !!((_d = state.validationResults[uid]) === null || _d === void 0 ? void 0 : _d.isValid);
-            state.interactionFlags[uid].focused = false;
-            state.interactionFlags[uid].afterFirstDirtyBlur = state.interactionFlags[uid].isDirty;
-            state.interactionFlags[uid].invalidToValid = false;
-            break;
-        }
-        case formActions_1.FormActionKind.TRIED_TO_SUBMIT: {
-            Object.keys(state.interactionFlags).forEach((key) => {
-                state.interactionFlags[key].forceShowValidationResult = true;
-            });
-            break;
-        }
-        case formActions_1.FormActionKind.SUBMITTING: {
-            state.submitInProgress = true;
-            break;
-        }
-        case formActions_1.FormActionKind.SUBMITTED: {
-            state.submitInProgress = false;
-            state.generalValidationResults = [];
-            state.interactionFlags = {};
-            Object.keys(state.validationResults).forEach((key) => {
-                var _a;
-                state.validationResults[key].validations = (_a = state.validationResults[key].validations) === null || _a === void 0 ? void 0 : _a.filter((validation) => !validation.fromBackend);
-                state.validationResults[key].isValid =
-                    state.validationResults[key].validations.find((val) => !val.isValid) === undefined;
-            });
-            break;
-        }
-        case formActions_1.FormActionKind.BACKEND_VALIDATION_ARRIVED: {
-            state.submitInProgress = false;
-            state.generalValidationResults = action.payload.generalValidationResults;
-            Object.keys(state.validationResults).forEach((key) => {
-                var _a;
-                state.validationResults[key].validations = (_a = state.validationResults[key].validations) === null || _a === void 0 ? void 0 : _a.filter((validation) => !validation.fromBackend);
-            });
-            Object.entries(action.payload.fieldValidationResults).forEach(([field, singleValidationResults]) => {
-                var _a;
-                if (!state.validationResults[field]) {
-                    state.validationResults[field] = {
-                        isValid: false,
-                        validations: [],
-                        partial: false,
-                        validatedValue: state.subject[field],
-                    };
-                }
-                state.validationResults[field].validations = [
-                    ...(((_a = state.validationResults[field]) === null || _a === void 0 ? void 0 : _a.validations) || []),
-                    ...(singleValidationResults || []),
-                ];
-                state.validationResults[field].isValid =
-                    state.validationResults[field].validations.find((val) => !val.isValid) === undefined;
-            });
-            break;
-        }
-        case formActions_1.FormActionKind.RESET: {
-            return Object.assign(Object.assign({}, initialState), { resetVersion: ((_e = state.resetVersion) !== null && _e !== void 0 ? _e : 0) + 1 });
-        }
-        default:
-            break;
-    }
-});
-const initialState = {
-    subject: {},
-    validationResults: {},
-    generalValidationResults: [],
-    interactionFlags: {},
-    noSubmitFields: {},
-    submitInProgress: false,
-    resetVersion: 0,
-};
-exports.defaultProps = {
-    cancelLabel: "Cancel",
-    saveLabel: "Save",
-    saveInProgressLabel: "Saving...",
-    itemLabelPosition: "top",
-    itemLabelBreak: true,
-    keepModalOpenOnSubmit: false,
-    swapCancelAndSave: false,
-    hideButtonRowUntilDirty: false,
-    hideButtonRow: false,
-    enableSubmit: true,
-};
-// --- Remove the properties from formState.subject where the property name ends with UNBOUND_FIELD_SUFFIX
-// --- or where the field has noSubmit set to true
-function cleanUpSubject(subject, noSubmitFields) {
-    return Object.entries(subject || {}).reduce((acc, [key, value]) => {
-        if (!key.endsWith(formActions_1.UNBOUND_FIELD_SUFFIX) && !noSubmitFields[key]) {
-            acc[key] = value;
-        }
-        return acc;
-    }, {});
-}
-const Form = (0, react_2.forwardRef)(function (_a, ref) {
-    var { formState, dispatch, initialValue = constants_1.EMPTY_OBJECT, children, style, className, enabled = true, cancelLabel = exports.defaultProps.cancelLabel, saveLabel = exports.defaultProps.saveLabel, saveInProgressLabel = exports.defaultProps.saveInProgressLabel, swapCancelAndSave, onWillSubmit, onSubmit, onCancel, onReset, onSuccess, buttonRow, id, registerComponentApi, itemLabelBreak = exports.defaultProps.itemLabelBreak, itemLabelWidth, itemLabelPosition = exports.defaultProps.itemLabelPosition, keepModalOpenOnSubmit = exports.defaultProps.keepModalOpenOnSubmit, hideButtonRowUntilDirty, hideButtonRow = exports.defaultProps.hideButtonRow, enableSubmit = exports.defaultProps.enableSubmit } = _a, rest = __rest(_a, ["formState", "dispatch", "initialValue", "children", "style", "className", "enabled", "cancelLabel", "saveLabel", "saveInProgressLabel", "swapCancelAndSave", "onWillSubmit", "onSubmit", "onCancel", "onReset", "onSuccess", "buttonRow", "id", "registerComponentApi", "itemLabelBreak", "itemLabelWidth", "itemLabelPosition", "keepModalOpenOnSubmit", "hideButtonRowUntilDirty", "hideButtonRow", "enableSubmit"]);
-    const formRef = (0, react_2.useRef)(null);
-    const [confirmSubmitModalVisible, setConfirmSubmitModalVisible] = (0, react_2.useState)(false);
-    const requestModalFormClose = (0, ModalVisibilityContext_1.useModalFormClose)();
-    const isEnabled = enabled && !formState.submitInProgress;
-    const isDirty = (0, react_2.useMemo)(() => {
-        return Object.entries(formState.interactionFlags).some(([key, flags]) => {
-            if (flags.isDirty) {
-                return true;
-            }
-            return false;
-        });
-    }, [formState.interactionFlags]);
-    const formContextValue = (0, react_2.useMemo)(() => {
-        return {
-            itemLabelBreak,
-            itemLabelWidth,
-            itemLabelPosition,
-            subject: formState.subject,
-            originalSubject: initialValue,
-            validationResults: formState.validationResults,
-            interactionFlags: formState.interactionFlags,
-            dispatch,
-            enabled: isEnabled,
-        };
-    }, [
-        dispatch,
-        formState.interactionFlags,
-        formState.subject,
-        formState.validationResults,
-        initialValue,
-        isEnabled,
-        itemLabelBreak,
-        itemLabelPosition,
-        itemLabelWidth,
-    ]);
-    const doCancel = (0, misc_1.useEvent)(() => {
-        onCancel === null || onCancel === void 0 ? void 0 : onCancel();
-        void requestModalFormClose();
-    });
-    const doValidate = (0, misc_1.useEvent)(() => __awaiter(this, void 0, void 0, function* () {
-        // Trigger validation display on all fields
-        dispatch((0, formActions_1.triedToSubmit)());
-        // Get validation results grouped by severity
-        const { error, warning } = (0, Validations_1.groupInvalidValidationResultsBySeverity)(Object.values(formState.validationResults));
-        // Prepare cleaned data
-        const cleanedData = cleanUpSubject(formState.subject, formState.noSubmitFields);
-        // Return validation result
-        return {
-            isValid: error.length === 0,
-            data: cleanedData,
-            errors: error,
-            warnings: warning,
-            validationResults: formState.validationResults,
-        };
-    }));
-    const doSubmit = (0, misc_1.useEvent)((event) => __awaiter(this, void 0, void 0, function* () {
-        var _a;
-        /* console.log(`🚀 Form submit started`);
-        console.log(`🔍 Initial values:`, {
-          initialValue,
-          EMPTY_OBJECT,
-          isEqual: initialValue === EMPTY_OBJECT,
-          initialValueType: typeof initialValue,
-          emptyObjectType: typeof EMPTY_OBJECT
-        }); */
-        event === null || event === void 0 ? void 0 : event.preventDefault();
-        if (!isEnabled) {
-            return;
-        }
-        setConfirmSubmitModalVisible(false);
-        // Use the extracted validation logic
-        const validationResult = yield doValidate();
-        if (!validationResult.isValid) {
-            return;
-        }
-        if (validationResult.warnings.length > 0 && !confirmSubmitModalVisible) {
-            setConfirmSubmitModalVisible(true);
-            return;
-        }
-        const prevFocused = document.activeElement;
-        dispatch((0, formActions_1.formSubmitting)());
-        try {
-            const filteredSubject = validationResult.data;
-            const canSubmit = yield (onWillSubmit === null || onWillSubmit === void 0 ? void 0 : onWillSubmit(filteredSubject));
-            if (canSubmit === false) {
-                // --- We do not reset the form but allow the next submit.
-                dispatch((0, formActions_1.backendValidationArrived)({ generalValidationResults: [], fieldValidationResults: {} }));
-                return;
-            }
-            const result = yield (onSubmit === null || onSubmit === void 0 ? void 0 : onSubmit(filteredSubject, {
-                passAsDefaultBody: true,
-            }));
-            dispatch((0, formActions_1.formSubmitted)());
-            yield (onSuccess === null || onSuccess === void 0 ? void 0 : onSuccess(result));
-            if (!keepModalOpenOnSubmit) {
-                void requestModalFormClose();
-            }
-            // we only reset the form automatically if the initial value is empty ()
-            if (initialValue === constants_1.EMPTY_OBJECT) {
-                (0, react_dom_1.flushSync)(() => {
-                    doReset();
-                });
-            }
-            if (prevFocused && typeof prevFocused.focus === "function") {
-                prevFocused.focus();
-            }
-        }
-        catch (e) {
-            const generalValidationResults = [];
-            const fieldValidationResults = {};
-            if (e instanceof Error &&
-                "errorCategory" in e &&
-                e.errorCategory === "GenericBackendError" &&
-                ((_a = e.details) === null || _a === void 0 ? void 0 : _a.issues) &&
-                Array.isArray(e.details.issues)) {
-                e.details.issues.forEach((issue) => {
-                    const validationResult = {
-                        isValid: false,
-                        invalidMessage: issue.message,
-                        severity: issue.severity || "error",
-                        fromBackend: true,
-                    };
-                    if (issue.field !== undefined) {
-                        fieldValidationResults[issue.field] = fieldValidationResults[issue.field] || [];
-                        fieldValidationResults[issue.field].push(validationResult);
-                    }
-                    else {
-                        generalValidationResults.push(validationResult);
-                    }
-                });
-            }
-            else {
-                generalValidationResults.push({
-                    isValid: false,
-                    invalidMessage: e.message || "Couldn't save the form.",
-                    severity: "error",
-                    fromBackend: true,
-                });
-            }
-            dispatch((0, formActions_1.backendValidationArrived)({
-                generalValidationResults,
-                fieldValidationResults,
-            }));
-        }
-    }));
-    const doReset = (0, misc_1.useEvent)(() => {
-        dispatch((0, formActions_2.formReset)());
-        onReset === null || onReset === void 0 ? void 0 : onReset();
-    });
-    const updateData = (0, misc_1.useEvent)((change) => {
-        if (typeof change !== "object" || change === null || change === undefined) {
-            return;
-        }
-        Object.entries(change).forEach(([key, value]) => {
-            dispatch({
-                type: formActions_1.FormActionKind.FIELD_VALUE_CHANGED,
-                payload: {
-                    uid: key,
-                    value: value,
-                },
-            });
-        });
-    });
-    const cancelButton = cancelLabel === "" ? null : ((0, jsx_runtime_1.jsx)(ButtonNative_1.Button, { "data-part-id": PART_CANCEL_BUTTON, type: "button", themeColor: "secondary", variant: "ghost", onClick: doCancel, children: cancelLabel }, "cancel"));
-    const submitButton = (0, react_2.useMemo)(() => ((0, jsx_runtime_1.jsx)(ButtonNative_1.Button, { "data-part-id": PART_SUBMIT_BUTTON, type: "submit", disabled: !isEnabled || !enableSubmit, children: formState.submitInProgress ? saveInProgressLabel : saveLabel }, "submit")), [isEnabled, enableSubmit, formState.submitInProgress, saveInProgressLabel, saveLabel]);
-    (0, react_2.useEffect)(() => {
-        registerComponentApi === null || registerComponentApi === void 0 ? void 0 : registerComponentApi({
-            reset: doReset,
-            update: updateData,
-            validate: doValidate,
-        });
-    }, [doReset, updateData, doValidate, registerComponentApi]);
-    let safeButtonRow = ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: buttonRow || ((0, jsx_runtime_1.jsxs)("div", { className: Form_module_scss_1.default.buttonRow, children: [swapCancelAndSave && [submitButton, cancelButton], !swapCancelAndSave && [cancelButton, submitButton]] })) }));
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, react_1.createElement)("form", Object.assign({}, rest, { style: style, className: (0, classnames_1.default)(Form_module_scss_1.default.wrapper, className), onSubmit: doSubmit, onReset: doReset, id: id, key: formState.resetVersion, ref: formRef }),
-                (0, jsx_runtime_1.jsx)(ValidationSummary_1.ValidationSummary, { generalValidationResults: formState.generalValidationResults }),
-                (0, jsx_runtime_1.jsx)(FormContext_1.FormContext.Provider, { value: formContextValue, children: children }),
-                !hideButtonRow && (!hideButtonRowUntilDirty || isDirty) && safeButtonRow), confirmSubmitModalVisible && ((0, jsx_runtime_1.jsx)(ModalDialogNative_1.ModalDialog, { onClose: () => setConfirmSubmitModalVisible(false), isInitiallyOpen: true, title: "Are you sure want to move forward?", children: (0, jsx_runtime_1.jsxs)(StackNative_1.Stack, { orientation: "vertical", style: { gap: "0.5rem" }, children: [(0, jsx_runtime_1.jsx)(TextNative_1.Text, { children: "The following warnings were found during validation. Please make sure you are willing to move forward despite these issues." }), (0, jsx_runtime_1.jsx)(ValidationSummary_1.ValidationSummary, { generalValidationResults: formState.generalValidationResults, fieldValidationResults: formState.validationResults }), (0, jsx_runtime_1.jsxs)(StackNative_1.Stack, { orientation: "horizontal", horizontalAlignment: "end", style: { gap: "1em" }, children: [(0, jsx_runtime_1.jsx)(ButtonNative_1.Button, { variant: "ghost", themeColor: "secondary", onClick: () => setConfirmSubmitModalVisible(false), children: "No" }), (0, jsx_runtime_1.jsx)(ButtonNative_1.Button, { onClick: () => doSubmit(), autoFocus: true, children: "Yes, proceed" })] })] }) }))] }));
-});
-Form.displayName = "Form";
-exports.FormWithContextVar = (0, react_2.forwardRef)(function ({ node, renderChild, extractValue, style, className, lookupEventHandler, registerComponentApi, }, ref) {
-    const [formState, dispatch] = (0, react_2.useReducer)(formReducer, initialState);
-    const $data = (0, react_2.useMemo)(() => {
-        const updateData = (change) => {
-            if (typeof change !== "object" || change === null || change === undefined) {
-                return;
-            }
-            Object.entries(change).forEach(([key, value]) => {
-                dispatch({
-                    type: formActions_1.FormActionKind.FIELD_VALUE_CHANGED,
-                    payload: {
-                        uid: key,
-                        value: value,
-                    },
-                });
-            });
-        };
-        return Object.assign(Object.assign({}, cleanUpSubject(formState.subject, formState.noSubmitFields)), { update: updateData });
-    }, [formState.subject, formState.noSubmitFields]);
-    const nodeWithItem = (0, react_2.useMemo)(() => {
-        return {
-            type: "Fragment",
-            vars: {
-                $data: $data,
-            },
-            children: node.children,
-        };
-    }, [$data, node.children]);
-    const initialValue = extractValue(node.props.data);
-    const submitMethod = extractValue.asOptionalString(node.props.submitMethod) || (initialValue ? "put" : "post");
-    const inProgressNotificationMessage = extractValue.asOptionalString(node.props.inProgressNotificationMessage) || "";
-    const completedNotificationMessage = extractValue.asOptionalString(node.props.completedNotificationMessage) || "";
-    const errorNotificationMessage = extractValue.asOptionalString(node.props.errorNotificationMessage) || "";
-    const submitUrl = extractValue.asOptionalString(node.props.submitUrl) ||
-        extractValue.asOptionalString(node.props._data_url);
-    const itemLabelWidth = extractValue.asOptionalString(node.props.itemLabelWidth);
-    const { cssProps: itemLabelWidthCssProps } = (0, layout_resolver_1.resolveLayoutProps)({ width: itemLabelWidth });
-    return ((0, jsx_runtime_1.jsx)(react_slot_1.Slot, { ref: ref, style: style, children: (0, jsx_runtime_1.jsx)(Form, { keepModalOpenOnSubmit: extractValue.asOptionalBoolean(node.props.keepModalOpenOnSubmit), itemLabelPosition: extractValue.asOptionalString(node.props.itemLabelPosition), itemLabelBreak: extractValue.asOptionalBoolean(node.props.itemLabelBreak), itemLabelWidth: itemLabelWidthCssProps.width, hideButtonRowUntilDirty: extractValue.asOptionalBoolean(node.props.hideButtonRowUntilDirty), hideButtonRow: extractValue.asOptionalBoolean(node.props.hideButtonRow), enableSubmit: extractValue.asOptionalBoolean(node.props.enableSubmit), formState: formState, dispatch: dispatch, id: node.uid, className: className, cancelLabel: extractValue(node.props.cancelLabel), saveLabel: extractValue(node.props.saveLabel), saveInProgressLabel: extractValue(node.props.saveInProgressLabel), swapCancelAndSave: extractValue.asOptionalBoolean(node.props.swapCancelAndSave, false), onWillSubmit: lookupEventHandler("willSubmit", {
-                context: {
-                    $data,
-                },
-            }), onSubmit: lookupEventHandler("submit", {
-                defaultHandler: submitUrl
-                    ? `(eventArgs)=> Actions.callApi({ url: "${submitUrl}", method: "${submitMethod}", body: eventArgs, inProgressNotificationMessage: "${inProgressNotificationMessage}", completedNotificationMessage: "${completedNotificationMessage}", errorNotificationMessage: "${errorNotificationMessage}" })`
-                    : undefined,
-                context: {
-                    $data,
-                },
-            }), onCancel: lookupEventHandler("cancel", {
-                context: {
-                    $data,
-                },
-            }), onReset: lookupEventHandler("reset", {
-                context: {
-                    $data,
-                },
-            }), onSuccess: lookupEventHandler("success", {
-                context: {
-                    $data,
-                },
-            }), initialValue: initialValue, buttonRow: renderChild(node.props.buttonRowTemplate), registerComponentApi: registerComponentApi, enabled: extractValue.asOptionalBoolean(node.props.enabled, true) &&
-                !extractValue.asOptionalBoolean(node.props.loading, false), children: renderChild(nodeWithItem) }) }));
-});
-exports.FormWithContextVar.displayName = "FormWithContextVar";