@arquimedes.co/eureka-forms 2.0.34-test → 2.0.35-test

package/dist/Form/FormTypes/StepperForm/StepperForm.js

@@ -0,0 +1,122 @@
+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 __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 __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useContext, useState } from 'react';
+import styles from './StepperForm.module.css';
+import Terms from '../../Terms/Terms';
+import { useFormContext } from 'react-hook-form';
+import { useAppDispatch, useAppSelector } from '../../../hooks';
+import Section from '../../Section/Section';
+import CustomContext from '../../../Contexts/CustomContext';
+import * as SiteReducer from '../../../States/SiteSlice';
+import { getAppState } from '../../../Utils/store';
+import { IdFormContext } from '../../../App/App';
+import CustomBtn from '../../../Shared/CustomBtn/CustomBtn';
+function StepperForm(_a) {
+    var _this = this;
+    var onSubmit = _a.onSubmit, scrollToTop = _a.scrollToTop;
+    var _b = useState(undefined), loading = _b[0], setLoading = _b[1];
+    var _c = useAppSelector(function (state) { return state.global; }), postview = _c.postview, editable = _c.editable, formStyle = _c.formStyle;
+    var _d = useFormContext(), trigger = _d.trigger, getValues = _d.getValues, handleSubmit = _d.handleSubmit;
+    var sendLabel = useContext(CustomContext).sendLabel;
+    var dispatch = useAppDispatch();
+    var previous = useAppSelector(function (state) { return state.site.previousSections; });
+    var idCurrent = useAppSelector(function (state) { return state.site.idCurrentSection; });
+    var idForm = useContext(IdFormContext);
+    var next = useAppSelector(function (state) { return state.site.nextSections; });
+    /** Esto se usa para no tener que escuchar todo el tiempo los errores del formulario */
+    var handleErrors = handleSubmit(function () { }, function (errors) {
+        console.error('Errors:', errors);
+    });
+    var handlePrevious = useCallback(function () { return __awaiter(_this, void 0, void 0, function () {
+        return __generator(this, function (_a) {
+            dispatch(SiteReducer.handlePrevious(getValues()));
+            scrollToTop === null || scrollToTop === void 0 ? void 0 : scrollToTop();
+            return [2 /*return*/];
+        });
+    }); }, []);
+    var handleNext = useCallback(function () { return __awaiter(_this, void 0, void 0, function () {
+        var valid, state, values, response;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    setLoading('NEXT');
+                    return [4 /*yield*/, trigger(undefined, { shouldFocus: true })];
+                case 1:
+                    valid = _a.sent();
+                    /** Imprimir errores si no es valido */
+                    if (!valid) {
+                        handleErrors();
+                        return [2 /*return*/, setLoading(undefined)];
+                    }
+                    if (next.length > 0) {
+                        dispatch(SiteReducer.handleNext(getValues()));
+                        scrollToTop === null || scrollToTop === void 0 ? void 0 : scrollToTop();
+                        return [2 /*return*/, setLoading(undefined)];
+                    }
+                    return [4 /*yield*/, dispatch(getAppState({ idForm: idForm })).unwrap()];
+                case 2:
+                    state = _a.sent();
+                    values = state.site.previousSections.reduce(function (v, idSection) { return (__assign(__assign({}, v), state.site.values.sections[idSection])); }, {});
+                    /** Add the current section's values */
+                    values = __assign(__assign({}, values), getValues());
+                    return [4 /*yield*/, onSubmit(values)];
+                case 3:
+                    response = _a.sent();
+                    setLoading(undefined);
+                    return [2 /*return*/, response];
+            }
+        });
+    }); }, [next]);
+    if (!idCurrent)
+        return _jsx(_Fragment, {});
+    return (_jsxs("div", __assign({ className: styles.container, style: { color: formStyle.textColor } }, { children: [loading && _jsx("div", { className: styles.curtain }), _jsx(Section, { idSection: idCurrent }, idCurrent), next.length === 0 && _jsx(Terms, {}), _jsxs("div", __assign({ className: styles.btnsContainer }, { children: [previous.length > 0 && (_jsx(CustomBtn, { label: "Volver", "data-testid": "form__back", onClick: handlePrevious, backgroundColor: formStyle.primaryColor, color: formStyle.primaryContrastColor, disabled: !!loading, loading: loading === 'BACK' })), (next.length > 0 || (!postview && editable)) && (_jsx(CustomBtn, { label: next.length > 0
+                            ? 'Siguiente'
+                            : sendLabel !== null && sendLabel !== void 0 ? sendLabel : 'Enviar', "data-testid": "form__submit", onClick: handleNext, backgroundColor: formStyle.primaryColor, color: formStyle.primaryContrastColor, disabled: !!loading, loading: loading === 'NEXT' }))] }))] })));
+}
+export default StepperForm;

package/dist/Form/Section/MaterialSection/MaterialSection.js

@@ -0,0 +1,41 @@
+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);
+};
+import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+import StepComponent from '../../../FormSteps/Step';
+import styles from './MaterialSection.module.css';
+import { selectBreakPoint, useAppSelector } from '../../../hooks';
+import { useContext } from 'react';
+import CustomContext from '../../../Contexts/CustomContext';
+import FormContext from '../../../Contexts/FormContext';
+function MaterialSection(_a) {
+    var _b;
+    var idSection = _a.idSection;
+    var currentBreakPoint = useAppSelector(selectBreakPoint);
+    var editable = useAppSelector(function (state) { return state.global; }).editable;
+    var form = useContext(FormContext);
+    var sendLabel = useContext(CustomContext).sendLabel;
+    var section = form.sections[idSection];
+    if (!section)
+        return _jsx(_Fragment, {});
+    return (_jsx("div", __assign({ className: styles.container, style: {
+            width: (form.size.blockSize + form.size.spacingSize) *
+                form.size.blockNum,
+            justifyContent: sendLabel !== undefined &&
+                currentBreakPoint < form.size.blockNum
+                ? 'center'
+                : 'normal',
+        } }, { children: (_b = section.steps) === null || _b === void 0 ? void 0 : _b.map(function (idStep) {
+            var step = form.steps[idStep];
+            return (_jsx(StepComponent, { editable: editable, step: step }, idStep));
+        }) })));
+}
+export default MaterialSection;

package/dist/Form/Section/Section.js

@@ -0,0 +1,29 @@
+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);
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { FormStyleTypes } from '../../constants/FormStepTypes';
+import MaterialSection from './MaterialSection/MaterialSection';
+import SectionContext from '../../Contexts/SectionContext';
+import { useAppSelector } from '../../hooks';
+function SectionComponent(props) {
+    var formStyle = useAppSelector(function (state) { return state.global.formStyle; });
+    var renderSectionType = function () {
+        switch (formStyle.type) {
+            case FormStyleTypes.MATERIAL:
+            default: {
+                return _jsx(MaterialSection, __assign({}, props));
+            }
+        }
+    };
+    return (_jsx(SectionContext.Provider, __assign({ value: props.idSection }, { children: renderSectionType() })));
+}
+export default SectionComponent;

package/dist/Form/Terms/Term/MaterialTerm/MaterialTerm.js

@@ -0,0 +1,101 @@
+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 { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Dialog } from '@material-ui/core';
+import React from 'react';
+import { useState } from 'react';
+import { useController } from 'react-hook-form';
+import RoundedButton from '../../../../Shared/RoundedButton/RoundedButton';
+import RoundedCheckBox from '../../../../Shared/RoundedCheckBox/RoundedCheckBox';
+import CloseRoundedIcon from '@material-ui/icons/CloseRounded';
+import styles from './MaterialTerm.module.css';
+import { useAppSelector } from '../../../../hooks';
+import { createSelector } from '@reduxjs/toolkit';
+var selectOriginalValue = createSelector([
+    function (state) { return state.site.values; },
+    function (state, idTerm) { return idTerm; },
+], function (values, idTerm) { return values.global[idTerm]; });
+function TermComponent(_a) {
+    var _b;
+    var term = _a.term, tempError = _a.tempError;
+    var _c = useAppSelector(function (state) { return state.global; }), formStyle = _c.formStyle, postview = _c.postview;
+    var originalValue = useAppSelector(function (state) {
+        return selectOriginalValue(state, term.id);
+    });
+    var _d = useController({
+        name: term.id,
+        rules: {
+            required: true,
+        },
+        defaultValue: originalValue !== null && originalValue !== void 0 ? originalValue : false,
+        shouldUnregister: true,
+    }), _e = _d.field, ref = _e.ref, field = __rest(_e, ["ref"]), error = _d.fieldState.error;
+    var _f = useState(false), showDialog = _f[0], setShowDialog = _f[1];
+    /**
+     * Function that renders the highlighted text
+     * @returns a string with span highlighted
+     */
+    var renderText = function (text) {
+        if (text) {
+            var parts = text.split(/{{(.*?)}}/gi);
+            for (var i = 1; i < parts.length; i += 2) {
+                parts[i] = (_jsx("span", __assign({ className: styles.highlight, style: {
+                        color: !!error && tempError
+                            ? formStyle.errorColor
+                            : formStyle.primaryColor,
+                    }, onClick: function () {
+                        var _a, _b, _c, _d, _e;
+                        if (((_a = term.clickEffect) === null || _a === void 0 ? void 0 : _a.type) === 'LINK') {
+                            (_d = (_c = (_b = window
+                                .open) === null || _b === void 0 ? void 0 : _b.call(window, term.clickEffect.url, '_blank')) === null || _c === void 0 ? void 0 : _c.focus) === null || _d === void 0 ? void 0 : _d.call(_c);
+                        }
+                        else if (((_e = term.clickEffect) === null || _e === void 0 ? void 0 : _e.type) === 'DIALOG') {
+                            setShowDialog(true);
+                        }
+                    } }, { children: parts[i] }), i));
+            }
+            return parts;
+        }
+    };
+    return (_jsxs(React.Fragment, { children: [_jsx(Dialog, __assign({ PaperProps: {
+                    style: {
+                        borderRadius: '20px',
+                    },
+                }, onClose: function () {
+                    setShowDialog(false);
+                }, open: showDialog }, { children: ((_b = term.clickEffect) === null || _b === void 0 ? void 0 : _b.type) === 'DIALOG' && (_jsxs("div", __assign({ className: styles.dialogContainer, style: { color: formStyle.textColor } }, { children: [_jsx("div", __assign({ className: styles.closeIcon, onClick: function () {
+                                setShowDialog(false);
+                            } }, { children: _jsx(CloseRoundedIcon, { fontSize: "inherit" }) })), _jsx("div", __assign({ className: styles.dialogTitle, style: {
+                                borderBottom: '1px solid ' + formStyle.primaryColor,
+                            } }, { children: term.clickEffect.title })), _jsx("div", __assign({ className: styles.dialogContentContainer }, { children: term.clickEffect.text })), _jsx(RoundedButton, { text: 'Aceptar', padding: "20px 15px", backgroundColor: formStyle.primaryColor, color: formStyle.primaryContrastColor, fontSize: 20, onClick: function () {
+                                setShowDialog(false);
+                                if (!postview) {
+                                    field.onChange(true);
+                                }
+                            } })] }))) })), _jsxs("div", __assign({ className: styles.container + ' noselect' }, { children: [_jsx("div", __assign({ className: styles.checkboxContainer }, { children: _jsx(RoundedCheckBox, __assign({ inputRef: ref }, field, { checked: field.value, cantEdit: postview, padding: "5px", checkedColor: formStyle.primaryColor, errorColor: formStyle.errorColor, size: "1.5rem", error: !!error })) })), _jsx("div", __assign({ className: styles.messageContainer, style: {
+                            color: !!error && tempError
+                                ? formStyle.errorColor
+                                : 'inherit',
+                        } }, { children: renderText(term.message) }))] }))] }));
+}
+export default TermComponent;

package/dist/Form/Terms/Term/Term.js

@@ -0,0 +1,25 @@
+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);
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { FormStyleTypes } from '../../../constants/FormStepTypes';
+import { useAppSelector } from '../../../hooks';
+import MaterialTerm from './MaterialTerm/MaterialTerm';
+function TermComponent(props) {
+    var formStyle = useAppSelector(function (state) { return state.global; }).formStyle;
+    switch (formStyle.type) {
+        case FormStyleTypes.MATERIAL:
+        default: {
+            return _jsx(MaterialTerm, __assign({}, props));
+        }
+    }
+}
+export default TermComponent;

package/dist/Form/Terms/Terms.js

@@ -0,0 +1,45 @@
+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);
+};
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { useContext, useEffect, useState } from 'react';
+import styles from './Terms.module.css';
+import TermComponent from './Term/Term';
+import { useFormContext } from 'react-hook-form';
+import FormContext from '../../Contexts/FormContext';
+import { useAppSelector } from '../../hooks';
+function Terms() {
+    var _a = useAppSelector(function (state) { return state.global; }), postview = _a.postview, internal = _a.internal;
+    var isInteralAgent = useAppSelector(function (state) {
+        return state.site.values.global['INTERNAL_CREATING_AGENT'] !== undefined;
+    });
+    var form = useContext(FormContext);
+    var isSubmitting = useFormContext().formState.isSubmitting;
+    var _b = useState(false), tempError = _b[0], setTempError = _b[1];
+    useEffect(function () {
+        if (!isSubmitting)
+            return;
+        setTempError(true);
+        setTimeout(function () {
+            setTempError(false);
+        }, 500);
+    }, [isSubmitting]);
+    if (form.terms &&
+        (!internal || (internal && postview)) &&
+        !isInteralAgent) {
+        return (_jsx("div", __assign({ className: styles.termsContainer, style: {
+                width: (form.size.blockSize + form.size.spacingSize) *
+                    form.size.blockNum,
+            } }, { children: form.terms.map(function (term) { return (_jsx(TermComponent, { term: term, tempError: tempError }, term.id)); }) })));
+    }
+    return _jsx(_Fragment, {});
+}
+export default Terms;

package/dist/FormSteps/@Construction/CBRElementStep/CBRElementStep.js

@@ -0,0 +1,137 @@
+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 __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 __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+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 { jsx as _jsx } from "react/jsx-runtime";
+import SmartSelectStep from '../../SmartSelectStep/SmartSelectStep';
+import CBRFormStepTypes from '../../../constants/CBRFormStepTypes';
+import axios from 'axios';
+import InputIcon from '../../../Shared/InputIcon/InputIcon';
+import FormContext from '../../../Contexts/FormContext';
+import { useContext } from 'react';
+function CBRElementStepComponent(props) {
+    return (_jsx(SmartSelectStep, __assign({}, props, { step: props.step, icon: _jsx(InputIcon, { icon: 'LEAK' }), getOptions: getElementOptions, getOptionSelected: function (option, value) {
+            return option.id === value.id;
+        }, getValueString: function (value) { return value === null || value === void 0 ? void 0 : value.id; }, calcDepError: calcDepError, valueOverwrite: function (value) {
+            if (value) {
+                return __assign(__assign({}, value), { subStep: props.step.subStep });
+            }
+            else {
+                return null;
+            }
+        }, renderNestedSteps: function (value) { return (_jsx(ElementSubStepRenderer, __assign({ value: value }, props))); } })));
+}
+export default CBRElementStepComponent;
+function ElementSubStepRenderer(_a) {
+    var _b;
+    var value = _a.value, stepProps = __rest(_a, ["value"]);
+    var form = useContext(FormContext);
+    if (!value || stepProps === undefined) {
+        return _jsx("div", {});
+    }
+    var subStep = form.steps[(_b = stepProps.step.subStep) !== null && _b !== void 0 ? _b : ''];
+    if ((subStep === null || subStep === void 0 ? void 0 : subStep.type) !== CBRFormStepTypes.CBR_LOCATIVAS) {
+        return _jsx("div", {});
+    }
+    return (_jsx(SmartSelectStep, __assign({}, stepProps, { step: subStep, icon: _jsx(InputIcon, { icon: 'LEAK' }), getOptions: getElementOptions, calcDepError: calcDepError, getOptionSelected: function (option, value) {
+            return option.id === value.id;
+        }, getValueString: function (value) { return value === null || value === void 0 ? void 0 : value.id; }, renderNestedSteps: function (value) { return (_jsx(ElementSubStepRenderer, __assign({ value: value }, stepProps, { step: subStep }))); } })));
+}
+var getElementOptions = function (idOrganization, step, dependencyStore) { return __awaiter(void 0, void 0, void 0, function () {
+    var idProyecto, response, father_1;
+    var _a, _b, _c;
+    return __generator(this, function (_d) {
+        switch (_d.label) {
+            case 0:
+                if (!(step.dependencies && idOrganization)) return [3 /*break*/, 2];
+                idProyecto = (_b = (_a = dependencyStore[step.dependencies[0]]) === null || _a === void 0 ? void 0 : _a.value) === null || _b === void 0 ? void 0 : _b.id;
+                if (!idProyecto) {
+                    return [2 /*return*/, null]; //null para indicar que falta la depedency
+                }
+                return [4 /*yield*/, axios.get("https://integrations.".concat(process.env.REACT_APP_DOMAIN, "/sinco/cbr/Locativas?idOrganization=").concat(idOrganization))];
+            case 1:
+                response = (_d.sent()).data;
+                father_1 = (_c = dependencyStore[step.dependencies[1]]) === null || _c === void 0 ? void 0 : _c.value;
+                if (father_1 !== undefined && father_1.id === undefined) {
+                    return [2 /*return*/, null];
+                }
+                return [2 /*return*/, response.filter(function (locativa) {
+                        if (father_1 === null || father_1 === void 0 ? void 0 : father_1.id) {
+                            return (locativa.id.startsWith(father_1.id) &&
+                                locativa.id !== father_1.id);
+                        }
+                        else {
+                            return locativa.id.length === 2;
+                        }
+                    })];
+            case 2: return [2 /*return*/, null];
+        }
+    });
+}); };
+var calcDepError = function (steps) {
+    for (var _i = 0, steps_1 = steps; _i < steps_1.length; _i++) {
+        var step = steps_1[_i];
+        var type = step.type;
+        if (type === CBRFormStepTypes.CBR_PROYECTO) {
+            return 'Selecciona un proyecto';
+        }
+        if (type === CBRFormStepTypes.CBR_LOCATIVAS) {
+            return 'Selecciona un padre';
+        }
+    }
+    return undefined;
+};

package/dist/FormSteps/@Construction/CBRIncidentsStep/CBRIncidentsStep.js

@@ -0,0 +1,25 @@
+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);
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { FormStyleTypes } from '../../../constants/FormStepTypes';
+import MaterialCBRIncidentsStep from './MaterialCBRIncidentsStep/MaterialCBRIncidentsStep';
+import { useAppSelector } from '../../../hooks';
+function CBRIncidentsStep(props) {
+    var formStyle = useAppSelector(function (state) { return state.global; }).formStyle;
+    switch (formStyle.type) {
+        case FormStyleTypes.MATERIAL:
+        default: {
+            return _jsx(MaterialCBRIncidentsStep, __assign({}, props));
+        }
+    }
+}
+export default CBRIncidentsStep;

package/dist/FormSteps/@Construction/CBRIncidentsStep/MaterialCBRIncidentsStep/Incident/Incident.js

@@ -0,0 +1,55 @@
+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 { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import styles from './Incident.module.css';
+import StepComponent from '../../../../Step';
+import DeleteRoundedIcon from '@material-ui/icons/DeleteRounded';
+import TextAreaStep from '../../../../TextAreaStep/TextAreaStep';
+import FormContext from '../../../../../Contexts/FormContext';
+import { useAppSelector } from '../../../../../hooks';
+import { useContext } from 'react';
+function IncidentComponent(_a) {
+    var step = _a.step, incident = _a.incident, handleDelete = _a.handleDelete, others = __rest(_a, ["step", "incident", "handleDelete"]);
+    var _b = useAppSelector(function (state) { return state.global; }), formStyle = _b.formStyle, postview = _b.postview;
+    var form = useContext(FormContext);
+    var widthStats = useAppSelector(function (state) { return state.widthStats; });
+    var spaceStep = form.steps[incident.idSpaceStep];
+    var elementStep = form.steps[incident.idElementStep];
+    var commentStep = form.steps[incident.idCommentStep];
+    if (incident.deleted) {
+        return _jsx("div", {});
+    }
+    return (_jsx("div", __assign({ className: widthStats.isMobile || form.size.blockNum < 3
+            ? styles.mobileContainer
+            : styles.container }, { children: _jsxs("div", __assign({ className: styles.contentContainer, style: {
+                width: (form.size.blockSize + form.size.spacingSize) *
+                    (form.size.blockNum - 1),
+            } }, { children: [_jsxs("div", __assign({ className: styles.titleLbl, style: { color: formStyle.textColor } }, { children: [step.unitLabel + ' ' + incident.num, ":"] })), _jsx("div", __assign({ className: !others.editable || postview
+                        ? styles.disabledDeleteBtn
+                        : styles.deleteBtn, style: { color: formStyle.textColor }, onClick: function () {
+                        if (others.editable && !postview) {
+                            handleDelete();
+                        }
+                    } }, { children: _jsx(DeleteRoundedIcon, { fontSize: "inherit" }) })), _jsx(StepComponent, __assign({}, others, { step: spaceStep })), _jsx(StepComponent, __assign({}, others, { step: elementStep })), _jsx(TextAreaStep, __assign({}, others, { step: commentStep, maxLength: 200 }))] })) })));
+}
+export default IncidentComponent;