@arquimedes.co/eureka-forms 1.9.133 → 2.0.0-test

package/dist/FormSteps/StepFunctions.js

@@ -1,4 +1,7 @@
-import Types, { ApiSelectorOptionTypes, ClassifierOptionTypes, EntityValueOptionTypes, OptionTypes, } from '../constants/FormStepTypes';
+import { EditorState } from 'draft-js';
+import Types, { ApiSelectorOptionTypes, ClassifierOptionTypes, EntityValueDataTypes, EntityValueOptionTypes, OptionTypes, StepTypes, } from '../constants/FormStepTypes';
+import CBRFormStepTypes from '../constants/CBRFormStepTypes';
+import AYFFormStepTypes from '../constants/AYFFormStepTypes';
 export function calcFillerSize(step, steps, values, size) {
     var _a;
     var maxSize = (_a = step.maxSize) !== null && _a !== void 0 ? _a : size.blockNum;
@@ -91,3 +94,155 @@ export function recursivelyCheckOpenSize(idStep, steps, values) {
 export var calcStepWidth = function (stepSize, size) {
     return size.blockSize * stepSize + size.spacingSize * (stepSize - 1);
 };
+export var calcDefaultValue = function (step) {
+    var _a;
+    switch (step.type) {
+        case StepTypes.CHECKBOX:
+            return (_a = step.defaultValue) !== null && _a !== void 0 ? _a : false;
+        case StepTypes.TITLE:
+            return {
+                title: step.title,
+                description: step.description,
+            };
+        case StepTypes.SELECTOR:
+        case StepTypes.TEXTINPUT:
+        case StepTypes.CLASSIFIER_SELECTOR:
+            return '';
+        case StepTypes.TEXTAREA:
+            if (step.hasTextEditor)
+                return EditorState.createEmpty();
+            else
+                return '';
+        case StepTypes.RATING:
+        case StepTypes.DATEPICKER:
+        case StepTypes.API_SELECTOR:
+        case StepTypes.ENTITYVALUEPICKER:
+            return null;
+        case StepTypes.MAPPER:
+        case StepTypes.FILEUPLOAD:
+            return [];
+        case StepTypes.COLLAPSIBLE:
+            return false;
+        case StepTypes.SEPARATOR:
+        default:
+            return undefined;
+    }
+};
+export var iterateNestedSteps = function (idStep, steps, iteration) {
+    var step = steps[idStep];
+    iteration(step);
+    if (step.type == StepTypes.MAPPER) {
+        for (var _i = 0, _a = step.rootSteps; _i < _a.length; _i++) {
+            var idStep_1 = _a[_i];
+            iterateNestedSteps(idStep_1, step.steps, iteration);
+        }
+    }
+    else {
+        for (var _b = 0, _c = calcSubSteps(step); _b < _c.length; _b++) {
+            var idSubStep = _c[_b];
+            iterateNestedSteps(idSubStep, steps, iteration);
+        }
+    }
+};
+/**
+ * Utility function to handle the substeps of a step
+ * @param step step to calc the substeps
+ * @param idModifier optional modifier for the ids of the substeps and all other properties
+ * @returns list of the ids of the direct substeps of the step, if modifier returns modified steps
+ */
+export var calcSubSteps = function (step, idModifier) {
+    var _a;
+    var subSteps = [];
+    var handleSteps = function (steps) {
+        for (var i = 0; i < steps.length; i++) {
+            var idStep = steps[i];
+            if (idModifier)
+                steps[i] = idModifier(idStep);
+            subSteps.push(idStep);
+        }
+    };
+    switch (step.type) {
+        case StepTypes.SELECTOR: {
+            for (var _i = 0, _b = step.options; _i < _b.length; _i++) {
+                var option = _b[_i];
+                if (option.type === OptionTypes.NESTED) {
+                    handleSteps(option.steps);
+                }
+            }
+            break;
+        }
+        case StepTypes.CLASSIFIER_SELECTOR:
+            for (var _c = 0, _d = Object.keys(step.options); _c < _d.length; _c++) {
+                var idOption = _d[_c];
+                var option = step.options[idOption];
+                if (option.type === ClassifierOptionTypes.NESTED) {
+                    handleSteps(option.steps);
+                }
+            }
+            break;
+        case StepTypes.RATING:
+            if (step.nestedSteps) {
+                for (var _e = 0, _f = step.nestedSteps; _e < _f.length; _e++) {
+                    var steps = _f[_e];
+                    handleSteps(steps);
+                }
+            }
+            break;
+        case StepTypes.COLLAPSIBLE: {
+            handleSteps(step.steps);
+            break;
+        }
+        case StepTypes.CHECKBOX: {
+            if (step.steps)
+                handleSteps(step.steps);
+            if (step.uncheckedSteps)
+                handleSteps(step.uncheckedSteps);
+            break;
+        }
+        case StepTypes.ENTITYVALUEPICKER:
+            if (idModifier) {
+                for (var _g = 0, _h = step.path; _g < _h.length; _g++) {
+                    var path = _h[_g];
+                    if (path.type === EntityValueDataTypes.STEP) {
+                        path.idStep = idModifier(path.idStep);
+                    }
+                }
+                for (var _j = 0, _k = step.filters; _j < _k.length; _j++) {
+                    var filter = _k[_j];
+                    if (filter.type === EntityValueDataTypes.STEP) {
+                        filter.idStep = idModifier(filter.idStep);
+                    }
+                }
+            }
+            for (var _l = 0, _m = Object.keys((_a = step.options) !== null && _a !== void 0 ? _a : {}); _l < _m.length; _l++) {
+                var idOption = _m[_l];
+                var option = step.options[idOption];
+                if (option.type === EntityValueOptionTypes.NESTED) {
+                    handleSteps(option.steps);
+                }
+            }
+            break;
+        case CBRFormStepTypes.CBR_LOCATIVAS:
+            {
+                var elementStep = step;
+                if (elementStep.subStep) {
+                    if (idModifier)
+                        elementStep.subStep = idModifier(elementStep.subStep);
+                    subSteps.push(elementStep.subStep);
+                }
+            }
+            break;
+        case AYFFormStepTypes.AYF_ICA_CITY: {
+            var cityStep = step;
+            if (cityStep.idNitStep) {
+                if (idModifier)
+                    cityStep.idNitStep = idModifier(cityStep.idNitStep);
+                subSteps.push(cityStep.idNitStep);
+            }
+            break;
+        }
+        default:
+            break;
+    }
+    return subSteps;
+};

package/dist/FormSteps/StepHooks.d.ts

@@ -0,0 +1,23 @@
+import { GBaseStep } from '../@Types/GenericFormSteps';
+import { Form } from '../@Types';
+import { DependencyStore } from '../Form/Form';
+export declare const useStepDependency: (step: GBaseStep, defaultValue?: any) => {
+    originalValue: any;
+    isDependency: boolean;
+    handleStepDep: (value: any | undefined) => void;
+};
+export declare const selectDependencies: ((state: {
+    global: import("../States/GlobalStateReducer").GlobalState;
+    site: import("../States/SiteStateReducer").SiteState;
+    widthStats: import("../Form/Form").WidthStats;
+}, step: GBaseStep, form: Form) => {
+    invalids: string[];
+    emptyDep: boolean;
+}) & import("reselect").OutputSelectorFields<(args_0: DependencyStore, args_1: GBaseStep, args_2: Form) => {
+    invalids: string[];
+    emptyDep: boolean;
+}, {
+    clearCache: () => void;
+}> & {
+    clearCache: () => void;
+};

package/dist/FormSteps/StepHooks.js

@@ -0,0 +1,87 @@
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+import { useCallback, useEffect } from 'react';
+import { useAppSelector, useAppDispatch } from '../hooks';
+import { setStepDependency } from '../States/SiteStateReducer';
+import { createSelector } from '@reduxjs/toolkit';
+import { calcDefaultValue } from './StepFunctions';
+var selectIsDependency = createSelector([
+    function (state) { return state.site.dependencies; },
+    function (state, step) { return step; },
+], function (dependencies, step) {
+    return dependencies[step.id] !== undefined;
+});
+var selectOriginalValue = createSelector([
+    function (state) { return state.site.values; },
+    function (state, step) { return step; },
+], function (values, step) { var _a; return (_a = values.sections[step.idSection]) === null || _a === void 0 ? void 0 : _a[step.id]; });
+export var useStepDependency = function (step, defaultValue) {
+    var _a;
+    var isDependency = useAppSelector(function (state) {
+        return selectIsDependency(state, step);
+    });
+    var originalValue = useAppSelector(function (state) {
+        return selectOriginalValue(state, step);
+    });
+    var dispatch = useAppDispatch();
+    useEffect(function () {
+        if (isDependency && !originalValue && defaultValue) {
+            dispatch(setStepDependency({
+                step: step,
+                value: defaultValue,
+            }));
+        }
+    }, [isDependency]);
+    var handleStepDep = useCallback(function (value) {
+        if (!isDependency)
+            return;
+        dispatch(setStepDependency({
+            step: step,
+            value: value !== null && value !== void 0 ? value : null,
+        }));
+    }, [step.id, step.type, isDependency]);
+    return {
+        handleStepDep: handleStepDep,
+        isDependency: isDependency,
+        originalValue: (_a = originalValue !== null && originalValue !== void 0 ? originalValue : defaultValue) !== null && _a !== void 0 ? _a : calcDefaultValue(step),
+    };
+};
+export var selectDependencies = createSelector([
+    function (state) { return state.site.dependencies; },
+    function (state, step) { return step; },
+    function (state, step, form) { return form; },
+], function (dependencies, step, form) {
+    var invalids = [];
+    var emptyDep = false;
+    /** Show deep error changes even if not in dependencies */
+    for (var _i = 0, _a = calcDeepDependencies(step.id, form); _i < _a.length; _i++) {
+        var idDep = _a[_i];
+        var dependency = dependencies[idDep];
+        if ((dependency === null || dependency === void 0 ? void 0 : dependency.value) === null && form.steps[idDep]) {
+            invalids.push(idDep);
+        }
+        if (dependency === null || dependency === void 0 ? void 0 : dependency.empty)
+            emptyDep = true;
+    }
+    return { invalids: invalids, emptyDep: emptyDep };
+});
+var calcDeepDependencies = function (idStep, form, deps) {
+    if (deps === void 0) { deps = []; }
+    var step = form.steps[idStep];
+    if (step === null || step === void 0 ? void 0 : step.dependencies) {
+        for (var _i = 0, _a = step.dependencies; _i < _a.length; _i++) {
+            var dep = _a[_i];
+            if (!deps.includes(dep)) {
+                deps.push.apply(deps, __spreadArray(__spreadArray([], calcDeepDependencies(dep, form, deps), false), [dep], false));
+            }
+        }
+    }
+    return deps;
+};

package/dist/FormSteps/TextAreaStep/MaterialTextAreaStep/MaterialTextAreaEditorStep.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import 'react-draft-wysiwyg/dist/react-draft-wysiwyg.css';
+import './DraftEditor.css';
+import { TextAreaStepProps } from '../TextAreaStep';
+export interface Payload {
+    text: string;
+    draft: any;
+}
+declare function TextAreaStep({ step, editable }: TextAreaStepProps): JSX.Element;
+export default TextAreaStep;

package/dist/FormSteps/TextAreaStep/MaterialTextAreaStep/MaterialTextAreaEditorStep.js

@@ -0,0 +1,148 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+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;
+};
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import styles from './MaterialTextAreaStep.module.css';
+import { useController } from 'react-hook-form';
+import { Editor } from 'react-draft-wysiwyg'; //Load programatically only if step has editor
+import 'react-draft-wysiwyg/dist/react-draft-wysiwyg.css';
+import './DraftEditor.css';
+import { useCallback, useState } from 'react';
+import { ClickAwayListener } from '@material-ui/core';
+import { useAppSelector } from '../../../hooks';
+import { useStepDependency } from '../../StepHooks';
+function TextAreaStep(_a) {
+    var _b;
+    var step = _a.step, editable = _a.editable;
+    var _c = useAppSelector(function (state) { return state.global; }), formStyle = _c.formStyle, postview = _c.postview;
+    var _d = useState(false), hovering = _d[0], setHovering = _d[1];
+    var _e = useState(false), focus = _e[0], setFocus = _e[1];
+    var _f = useState(), timer = _f[0], setTimer = _f[1];
+    var _g = useStepDependency(step), handleStepDep = _g.handleStepDep, originalValue = _g.originalValue, isDependency = _g.isDependency;
+    var _h = useController({
+        name: step.id,
+        shouldUnregister: true,
+        rules: step.required
+            ? {
+                validate: function (editorState) {
+                    return editorState.getCurrentContent().hasText();
+                },
+            }
+            : {},
+        defaultValue: originalValue,
+    }), _j = _h.field, ref = _j.ref, field = __rest(_j, ["ref"]), error = _h.fieldState.error;
+    var onChange = useCallback(function (value) {
+        if (isDependency) {
+            try {
+                clearTimeout(timer);
+                // eslint-disable-next-line no-empty
+            }
+            catch (e) { }
+            setTimer(setTimeout(function () {
+                handleStepDep(value.getCurrentContent().getPlainText());
+                setTimer(undefined);
+            }, 1000));
+        }
+        onChange(value);
+    }, [handleStepDep, isDependency, field]);
+    var calcStyle = function () {
+        var backgroundColor = formStyle.stepBackgroundColor;
+        if (focus) {
+            return {
+                border: '2px solid ' + formStyle.primaryColor,
+                marginTop: -1,
+                marginLeft: -1,
+                marginBottom: 0,
+                backgroundColor: backgroundColor,
+            };
+        }
+        else if (hovering) {
+            return {
+                border: '1px solid ' + formStyle.primaryColor,
+                backgroundColor: backgroundColor,
+            };
+        }
+        else {
+            return {
+                border: '1px solid ' + formStyle.outlineColor,
+                backgroundColor: backgroundColor,
+            };
+        }
+    };
+    var canEdit = editable && !postview;
+    var value = field.value;
+    var editorClassName = styles.editor;
+    if (!value.getCurrentContent().hasText()) {
+        if (value.getCurrentContent().getBlockMap().first().getType() !==
+            'unstyled') {
+            editorClassName += ' RichEditor-hidePlaceholder';
+        }
+    }
+    if (!canEdit) {
+        editorClassName += ' postview-editor';
+    }
+    return (_jsxs("div", __assign({ className: styles.textEditorContainer, style: {
+            '--eureka-outline': formStyle.outlineColor,
+            '--eureka-primary': formStyle.primaryColor,
+        } }, { children: [step.label && (_jsxs("div", __assign({ className: styles.textEditorLabel, style: {
+                    color: error
+                        ? formStyle.errorColor
+                        : formStyle.textColor,
+                } }, { children: [step.label, " ", step.required ? ' *' : ''] }))), _jsx(ClickAwayListener, __assign({ mouseEvent: "onMouseDown", onClickAway: function () {
+                    if (canEdit) {
+                        setFocus(false);
+                    }
+                } }, { children: _jsx("div", __assign({ className: postview
+                        ? styles.postViewContainer + ' EF-DraftContainer'
+                        : styles.textContainer + ' EF-DraftContainer', "data-testid": step.id, style: calcStyle(), onMouseEnter: function () {
+                        if (canEdit) {
+                            setHovering(true);
+                        }
+                    }, onMouseLeave: function () {
+                        if (canEdit) {
+                            setHovering(false);
+                        }
+                    }, onClick: function () {
+                        if (canEdit) {
+                            setFocus(true);
+                        }
+                    } }, { children: _jsx(Editor, __assign({}, field, { editorRef: ref, onFocus: function () {
+                            setFocus(true);
+                        }, readOnly: !canEdit, stripPastedStyles: true, onEditorStateChange: onChange, toolbarClassName: !canEdit ? ' postview-editor-toolbar' : '', editorClassName: editorClassName, wrapperClassName: styles.wrapper, placeholder: (_b = step.description) !== null && _b !== void 0 ? _b : '', toolbar: {
+                            options: ['inline', 'list', 'history'],
+                            inline: {
+                                options: [
+                                    'bold',
+                                    'italic',
+                                    'underline',
+                                    'strikethrough',
+                                ],
+                            },
+                            list: {
+                                options: ['unordered'],
+                            },
+                        } })) })) })), _jsx("div", __assign({ className: styles.errorMsg, style: {
+                    color: formStyle.errorColor,
+                    height: !postview && editable ? '0.75rem' : 0,
+                } }, { children: !!error && 'Este campo es obligatorio' }))] })));
+}
+export default TextAreaStep;

package/dist/FormSteps/TextAreaStep/MaterialTextAreaStep/MaterialTextAreaStep.d.ts

@@ -1,13 +1,8 @@
 /// <reference types="react" />
-import 'react-draft-wysiwyg/dist/react-draft-wysiwyg.css';
-import './DraftEditor.css';
-import { RawDraftContentState } from 'draft-js';
 import { TextAreaStepProps } from '../TextAreaStep';
 export interface Payload {
     text: string;
     draft: any;
 }
-declare function TextAreaStep({ step, errors, partial, control, editable, postview, formStyle, maxLength, originalValues, }: TextAreaStepProps): JSX.Element;
+declare function TextAreaStep({ step, editable, maxLength, }: TextAreaStepProps): JSX.Element;
 export default TextAreaStep;
-export declare function stringToDraft(text: string): RawDraftContentState;
-export declare const getRawText: (draft?: RawDraftContentState, text?: string) => RawDraftContentState;