@arquimedes.co/eureka-forms 2.0.36-test → 2.0.37

package/dist/@Types/Condition.d.ts

@@ -0,0 +1,60 @@
+import ConditionTypes, { ExpressionTypes, OperatorTypes } from '../constants/ConditionTypes';
+import FormStepTypes from '../constants/FormStepTypes';
+export type Condition = ExpressionCondition | FormStepCondition;
+export interface ExpressionCondition<Type extends Condition = Condition> {
+    type: ConditionTypes.EXPRESSION;
+    conditions: (Type | ExpressionCondition<Type>)[];
+    expression: ExpressionTypes;
+}
+export type FormStepCondition = ExistanceFormStepCondition | CheckBoxFormStepCondition | ClassifierSelectorFormStepCondition | DatePickerFormStepCondition | EntityValuePickerFormStepCondition | RatingFormStepCondition | SelectorFormStepCondition | TextAreaFormStepCondition | TextInputFormStepCondition;
+interface BaseFormStepCondition {
+    type: ConditionTypes.FORM_STEP;
+    operator: OperatorTypes;
+    stepType: FormStepTypes;
+    idStep: string;
+}
+export interface ExistanceFormStepCondition extends BaseFormStepCondition {
+    operator: OperatorTypes.EXISTS | OperatorTypes.NOTEXISTS;
+}
+export interface CheckBoxFormStepCondition extends BaseFormStepCondition {
+    stepType: FormStepTypes.CHECKBOX;
+    operator: OperatorTypes.EQUAL | OperatorTypes.NOTEQUAL;
+    value: boolean;
+}
+export interface ClassifierSelectorFormStepCondition extends BaseFormStepCondition {
+    stepType: FormStepTypes.CLASSIFIER_SELECTOR;
+    operator: OperatorTypes.EQUAL | OperatorTypes.NOTEQUAL;
+    idRoot: string;
+    idValue: string;
+}
+export interface DatePickerFormStepCondition extends BaseFormStepCondition {
+    stepType: FormStepTypes.DATEPICKER;
+    operator: OperatorTypes.EQUAL | OperatorTypes.NOTEQUAL | OperatorTypes.LESS | OperatorTypes.MORE;
+    value: Date;
+}
+export interface EntityValuePickerFormStepCondition extends BaseFormStepCondition {
+    stepType: FormStepTypes.ENTITYVALUEPICKER;
+    operator: OperatorTypes.EQUAL | OperatorTypes.NOTEQUAL;
+    values: string[];
+}
+export interface RatingFormStepCondition extends BaseFormStepCondition {
+    stepType: FormStepTypes.RATING;
+    operator: OperatorTypes.EQUAL | OperatorTypes.NOTEQUAL | OperatorTypes.LESS | OperatorTypes.MORE;
+    value: number;
+}
+export interface SelectorFormStepCondition extends BaseFormStepCondition {
+    stepType: FormStepTypes.SELECTOR;
+    operator: OperatorTypes.EQUAL | OperatorTypes.NOTEQUAL;
+    value: string;
+}
+export interface TextAreaFormStepCondition extends BaseFormStepCondition {
+    stepType: FormStepTypes.TEXTAREA;
+    operator: OperatorTypes.INCLUDES | OperatorTypes.NOTINCLUDES;
+    values: string[];
+}
+export interface TextInputFormStepCondition extends BaseFormStepCondition {
+    stepType: FormStepTypes.TEXTINPUT;
+    operator: OperatorTypes.EQUAL | OperatorTypes.NOTEQUAL | OperatorTypes.INCLUDES | OperatorTypes.NOTINCLUDES;
+    value: string;
+}
+export {};

package/dist/@Types/Condition.js

@@ -0,0 +1 @@
+export {};

package/dist/@Types/FormStep.d.ts

@@ -1,4 +1,5 @@
 import Types, { ClassifierOptionTypes, OptionTypes, RatingTypes, MapperStyleTypes, EntityValueOptionTypes, EntityValueDataTypes, ApiSelectorOptionTypes, ApiSelectorParamTypes } from '../constants/FormStepTypes';
+import { Condition } from './Condition';
 import * as GSteps from './GenericFormSteps';
 export type FormStep = Title | Rating | CheckBox | TextArea | TextInput | DatePicker | FileUpload | Separator | FormSelector | ClassifierSelector | Collapsible | EntityValuePicker | ApiSelector | Mapper;
 export interface Title extends GSteps.GBaseStep {
@@ -57,23 +58,19 @@ export interface FormSelector extends GSteps.GBaseStep {
     maxSize?: number;
     defaultValue?: string;
 }
-export type FormSelectorOption = DefaultFormSelectorOption | NestedStepOption | AddSectionOption;
+export type FormSelectorOption = DefaultFormSelectorOption | NestedStepOption;
 interface DefaultFormSelectorOption {
     label: string;
     value: string;
     type: OptionTypes.DEFAULT;
+    condition?: Condition;
 }
 export interface NestedStepOption {
     label: string;
     value: string;
     type: OptionTypes.NESTED;
     steps: string[];
-}
-interface AddSectionOption {
-    label: string;
-    value: string;
-    type: OptionTypes.ADD_SECTION;
-    idSection: string;
+    condition?: Condition;
 }
 export interface ClassifierSelector extends GSteps.GBaseStep {
     type: Types.CLASSIFIER_SELECTOR;
@@ -86,11 +83,17 @@ export interface ClassifierSelector extends GSteps.GBaseStep {
     size: 1 | 2 | 3 | 4;
     maxSize?: number;
 }
-export type FormClassifierSelectorOption = NestedStepClassifierOption | HideValueOption;
+export type FormClassifierSelectorOption = DefaultClassifierOption | NestedStepClassifierOption | HideValueOption;
+interface DefaultClassifierOption {
+    type: ClassifierOptionTypes.DEFAULT;
+    idClassifier: string;
+    condition?: Condition;
+}
 interface NestedStepClassifierOption {
     type: ClassifierOptionTypes.NESTED;
     idClassifier: string;
     steps: string[];
+    condition?: Condition;
 }
 interface HideValueOption {
     type: ClassifierOptionTypes.HIDE;
@@ -105,11 +108,17 @@ export interface EntityValuePicker extends GSteps.GSmartSelect {
     options: Record<string, FormEntityValuePickerOption>;
     maxSize?: number;
 }
-export type FormEntityValuePickerOption = NestedEntityValuePickerOption | HideFormEntityValuePickerOption;
+export type FormEntityValuePickerOption = DefaultEntityValuePickerOption | NestedEntityValuePickerOption | HideFormEntityValuePickerOption;
+interface DefaultEntityValuePickerOption {
+    type: EntityValueOptionTypes.DEFAULT;
+    idEntityValue: string;
+    condition?: Condition;
+}
 interface NestedEntityValuePickerOption {
     type: EntityValueOptionTypes.NESTED;
     idEntityValue: string;
     steps: string[];
+    condition?: Condition;
 }
 interface HideFormEntityValuePickerOption {
     type: EntityValueOptionTypes.HIDE;
@@ -153,11 +162,17 @@ export interface ApiSelector extends GSteps.GSmartSelect {
     maxSize?: number;
     options: Record<string, ApiSelectorOption>;
 }
-export type ApiSelectorOption = NestedApiSelectorOption | HideApiSelectorOption;
+export type ApiSelectorOption = DefaultApiSelectorOption | NestedApiSelectorOption | HideApiSelectorOption;
+interface DefaultApiSelectorOption {
+    type: ApiSelectorOptionTypes.DEFAULT;
+    idOption: string;
+    condition?: Condition;
+}
 interface NestedApiSelectorOption {
     type: ApiSelectorOptionTypes.NESTED;
     idOption: string;
     steps: string[];
+    condition?: Condition;
 }
 interface HideApiSelectorOption {
     type: ApiSelectorOptionTypes.HIDE;

package/dist/@Types/GenericFormSteps.d.ts

@@ -1,3 +1,4 @@
+import { Condition } from './Condition';
 export interface GBaseStep {
     id: string;
     idSection: string;
@@ -5,6 +6,7 @@ export interface GBaseStep {
     editable?: boolean;
     partial?: boolean;
     dependencies?: string[];
+    condition?: Condition;
 }
 export interface GTitle extends GBaseStep {
     title: string;

package/dist/Form/FormFunctions.js

@@ -21,6 +21,7 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
 import { convertFromRaw, convertToRaw } from 'draft-js';
 import StepTypes, { EntityValueDataTypes } from '../constants/FormStepTypes';
 import { calcRecursiveData } from '../App/AppFunctions';
+import { calcStepDeps } from '../FormSteps/StepHooks';
 /**
  * Function that cals the value of a step to output on submit
  */
@@ -131,19 +132,18 @@ export function calcDependencies(steps, customSteps, allSteps, dependencies, val
     if (addDependents === void 0) { addDependents = true; }
     for (var _i = 0, _c = Object.values(steps); _i < _c.length; _i++) {
         var step = _c[_i];
-        if (step.dependencies) {
-            for (var _d = 0, _e = step.dependencies; _d < _e.length; _d++) {
-                var idDep = _e[_d];
-                if (dependencies[idDep] === undefined &&
-                    (addDependents || allSteps[idDep]))
-                    dependencies[idDep] = calcStepDependency(idDep, allSteps, values, customSteps);
-                if (addDependents)
-                    dependencies[idDep].dependents.push(step);
-            }
+        var idDeps = calcStepDeps(step);
+        for (var _d = 0, idDeps_1 = idDeps; _d < idDeps_1.length; _d++) {
+            var idDep = idDeps_1[_d];
+            if (dependencies[idDep] === undefined &&
+                (addDependents || allSteps[idDep]))
+                dependencies[idDep] = calcStepDependency(idDep, allSteps, values, customSteps);
+            if (addDependents)
+                dependencies[idDep].dependents.push(step);
         }
         if (step.type === StepTypes.ENTITYVALUEPICKER) {
-            for (var _f = 0, _g = __spreadArray(__spreadArray([], step.path, true), step.filters, true); _f < _g.length; _f++) {
-                var dep = _g[_f];
+            for (var _e = 0, _f = __spreadArray(__spreadArray([], step.path, true), step.filters, true); _e < _f.length; _e++) {
+                var dep = _f[_e];
                 if (dep.type !== EntityValueDataTypes.STEP)
                     continue;
                 if ((_a = step.dependencies) === null || _a === void 0 ? void 0 : _a.includes(dep.idStep))

package/dist/Form/FormHooks.d.ts

@@ -1,9 +1,3 @@
 /// <reference types="react" />
-import { RootState } from '../Utils/store';
 import { Form } from '../@Types';
-export declare const selectCurrentValues: ((state: RootState) => Record<string, any>) & import("reselect").OutputSelectorFields<(args_0: string | null, args_1: Record<string, Record<string, any>>) => Record<string, any>, {
-    clearCache: () => void;
-}> & {
-    clearCache: () => void;
-};
 export declare function useWidthStats(containerRef: React.RefObject<HTMLDivElement>, form: Form, postview: boolean, internal: boolean): void;

package/dist/Form/FormHooks.js

@@ -1,13 +1,6 @@
-import { createSelector } from 'reselect';
 import { useCallback, useLayoutEffect } from 'react';
 import { updateWidthStats } from '../States/WidthStatsSlice';
 import { useAppDispatch } from '../hooks';
-export var selectCurrentValues = createSelector([
-    function (state) { return state.site.idCurrentSection; },
-    function (state) {
-        return state.site.values.sections;
-    },
-], function (idCurrent, values) { var _a; return (_a = values[idCurrent !== null && idCurrent !== void 0 ? idCurrent : '']) !== null && _a !== void 0 ? _a : {}; });
 export function useWidthStats(containerRef, form, postview, internal) {
     var calcWidthStats = useCallback(function (currentWidth) {
         var currentBreakPoint = form.size.blockNum;

package/dist/FormSteps/ApiSelectorStep/ApiSelectorStep.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import { ApiSelector } from '../../@Types/FormStep';
 import { StepProps } from '../Step';
-export interface StepOptions {
+export interface StepOption {
     id: string | number;
     label: string;
 }

package/dist/FormSteps/ApiSelectorStep/MaterialApiSelectorStep/MaterialApiSelectorStep.js

@@ -56,6 +56,15 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
+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 { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
 import React, { useContext } from 'react';
 import FormStepTypes, { ApiSelectorOptionTypes, ApiSelectorParamTypes, } from '../../../constants/FormStepTypes';
@@ -66,6 +75,8 @@ import axiosInstance from '../../../Utils/AxiosAPI';
 import InputIcon from '../../../Shared/InputIcon/InputIcon';
 import FormContext from '../../../Contexts/FormContext';
 import StepFillerContainer from '../../Utils/@StepFiller/StepFiller';
+import { recursivelyCalcConditionSteps } from '../../StepHooks';
+import { evaluateCondition } from '../../StepFunctions';
 function ApiSelectorComponent(_a) {
     var step = _a.step, editable = _a.editable, others = __rest(_a, ["step", "editable"]);
     var form = useContext(FormContext);
@@ -87,6 +98,30 @@ function ApiSelectorComponent(_a) {
                     }
                 }
                 return undefined;
+            }, filterOptions: function (options, dependencies) {
+                var filteredOptions = [];
+                for (var _i = 0, options_1 = options; _i < options_1.length; _i++) {
+                    var value = options_1[_i];
+                    var option = step.options[calcOptionId(value)];
+                    if ((option === null || option === void 0 ? void 0 : option.type) === ApiSelectorOptionTypes.HIDE)
+                        continue;
+                    if (!option ||
+                        !option.condition ||
+                        evaluateCondition(option.condition, dependencies))
+                        filteredOptions.push(value);
+                }
+                return filteredOptions;
+            }, getOptionsConditionsIdSteps: function () {
+                var _a;
+                var dependencies = __spreadArray([], ((_a = step.dependencies) !== null && _a !== void 0 ? _a : []), true);
+                for (var _i = 0, _b = Object.values(step.options); _i < _b.length; _i++) {
+                    var option = _b[_i];
+                    if (option.type !== ApiSelectorOptionTypes.HIDE &&
+                        option.condition) {
+                        dependencies.push.apply(dependencies, recursivelyCalcConditionSteps(option.condition));
+                    }
+                }
+                return dependencies;
             }, getValueString: function (value) { return calcOptionLabel(value); }, renderNestedSteps: function (value) {
                 if (!value)
                     return _jsx(_Fragment, {});

package/dist/FormSteps/ClassifierSelectorStep/MaterialClassifierSelectorStep/MaterialClassifierSelectorStep.js

@@ -9,6 +9,15 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
+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 { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React, { useContext, useMemo } from 'react';
 import { ClassifierOptionTypes } from '../../../constants/FormStepTypes';
@@ -16,10 +25,10 @@ import StepComponent from '../../Step';
 import RoundedSmartSelect from '../../../Shared/RoundedSmartSelect/RoundedSmartSelect';
 import FormContext from '../../../Contexts/FormContext';
 import { useAppSelector } from '../../../hooks';
-import { useFormStep } from '../../StepHooks';
+import { recursivelyCalcConditionSteps, selectDependencies, useFormStep, } from '../../StepHooks';
 import StepFillerContainer from '../../Utils/@StepFiller/StepFiller';
 import MaterialInputContainer from '../../Utils/MaterialInputContainer/MaterialInputContainer';
-import { calcDefaultValue } from '../../StepFunctions';
+import { calcDefaultValue, evaluateCondition } from '../../StepFunctions';
 function ClassifierSelectorStep(_a) {
     var _b, _c, _d, _e;
     var step = _a.step, editable = _a.editable;
@@ -30,6 +39,21 @@ function ClassifierSelectorStep(_a) {
             required: step.required ? 'Este campo es obligatorio' : undefined,
         },
     }), ref = _f.ref, value = _f.value, onChange = _f.onChange, error = _f.error, field = _f.field;
+    var idDependencies = useMemo(function () {
+        var _a;
+        var dependencies = __spreadArray([], ((_a = step.dependencies) !== null && _a !== void 0 ? _a : []), true);
+        for (var _i = 0, _b = Object.values(step.options); _i < _b.length; _i++) {
+            var option = _b[_i];
+            if (option.type !== ClassifierOptionTypes.HIDE &&
+                option.condition) {
+                dependencies.push.apply(dependencies, recursivelyCalcConditionSteps(option.condition));
+            }
+        }
+        return dependencies;
+    }, []);
+    var dependencies = useAppSelector(function (state) {
+        return selectDependencies(state, idDependencies);
+    });
     var _g = useAppSelector(function (state) { return state.global; }), formStyle = _g.formStyle, postview = _g.postview, preview = _g.preview;
     var form = useContext(FormContext);
     if (!step.idClassifier)
@@ -40,10 +64,15 @@ function ClassifierSelectorStep(_a) {
     var options = useMemo(function () {
         var _a;
         return (_a = classifier.children) === null || _a === void 0 ? void 0 : _a.filter(function (idClassifier) {
-            var _a, _b;
-            return ((_a = step.options[idClassifier]) === null || _a === void 0 ? void 0 : _a.type) !==
-                ClassifierOptionTypes.HIDE &&
-                ((_b = form.classifiers) === null || _b === void 0 ? void 0 : _b[idClassifier]);
+            var _a;
+            var option = step.options[idClassifier];
+            if ((option === null || option === void 0 ? void 0 : option.type) === ClassifierOptionTypes.HIDE ||
+                !((_a = form.classifiers) === null || _a === void 0 ? void 0 : _a[idClassifier])) {
+                return false;
+            }
+            return (!option ||
+                !(option === null || option === void 0 ? void 0 : option.condition) ||
+                evaluateCondition(option.condition, dependencies));
         }).map(function (idClassifier) {
             var _a, _b, _c;
             var classifier = (_a = form.classifiers) === null || _a === void 0 ? void 0 : _a[idClassifier];
@@ -54,7 +83,7 @@ function ClassifierSelectorStep(_a) {
                     : classifier === null || classifier === void 0 ? void 0 : classifier.name,
             };
         });
-    }, []);
+    }, idDependencies.map(function (id) { return dependencies[id].value; }));
     var mapNestedOption = function () {
         if (value) {
             var currentOption = step.options[value.value];

package/dist/FormSteps/CollapsibleStep/MaterialTitleStep/MaterialCollapsibleStep.js

@@ -43,9 +43,7 @@ function Collapsible(_a) {
             setOpen(true);
         }
     }, (_c = (_b = step.dependencies) === null || _b === void 0 ? void 0 : _b.map(function (dep) { return errors[dep]; })) !== null && _c !== void 0 ? _c : []);
-    return (_jsxs("div", __assign({ style: {
-            breakInside: 'avoid',
-        } }, { children: [_jsxs("div", __assign({ className: styles.container, style: {
+    return (_jsxs("div", __assign({ style: { maxWidth: '100%' } }, { children: [_jsxs("div", __assign({ className: styles.container, style: {
                     color: formStyle.textColor,
                     borderColor: formStyle.primaryColor,
                 } }, { children: [_jsx("div", __assign({ className: styles.collapsibleLabel, onClick: function () {

package/dist/FormSteps/EntityValueStep/EntityValuePickerStep.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import { EntityValuePicker } from '../../@Types/FormStep';
 import { StepProps } from '../Step';
-export interface StepOptions {
+export interface StepOption {
     id: string | number;
     label: string;
 }

package/dist/FormSteps/EntityValueStep/MaterialEntityValuePickerStep/MaterialEntityValuePickerStep.js

@@ -45,6 +45,15 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
         if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
     }
 };
+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 { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
 import React, { useContext } from 'react';
 import FormStepTypes, { EntityValueDataTypes, EntityValueOptionTypes, } from '../../../constants/FormStepTypes';
@@ -54,6 +63,8 @@ import widgetInstance from '../../../Utils/AxiosWidget';
 import InputIcon from '../../../Shared/InputIcon/InputIcon';
 import FormContext from '../../../Contexts/FormContext';
 import StepFillerContainer from '../../Utils/@StepFiller/StepFiller';
+import { evaluateCondition } from '../../StepFunctions';
+import { recursivelyCalcConditionSteps } from '../../StepHooks';
 function EntityValuePickerStep(_a) {
     var step = _a.step, editable = _a.editable;
     var form = useContext(FormContext);
@@ -67,6 +78,30 @@ function EntityValuePickerStep(_a) {
                     }
                 }
                 return undefined;
+            }, filterOptions: function (options, dependencies) {
+                var filteredOptions = [];
+                for (var _i = 0, options_1 = options; _i < options_1.length; _i++) {
+                    var value = options_1[_i];
+                    var option = step.options[value._id];
+                    if ((option === null || option === void 0 ? void 0 : option.type) === EntityValueOptionTypes.HIDE)
+                        continue;
+                    if (!option ||
+                        !option.condition ||
+                        evaluateCondition(option.condition, dependencies))
+                        filteredOptions.push(value);
+                }
+                return filteredOptions;
+            }, getOptionsConditionsIdSteps: function () {
+                var _a;
+                var dependencies = __spreadArray([], ((_a = step.dependencies) !== null && _a !== void 0 ? _a : []), true);
+                for (var _i = 0, _b = Object.values(step.options); _i < _b.length; _i++) {
+                    var option = _b[_i];
+                    if (option.type !== EntityValueOptionTypes.HIDE &&
+                        option.condition) {
+                        dependencies.push.apply(dependencies, recursivelyCalcConditionSteps(option.condition));
+                    }
+                }
+                return dependencies;
             }, getValueString: function (value) { return value === null || value === void 0 ? void 0 : value._id; }, renderNestedSteps: function (value) {
                 if (!value)
                     return _jsx(_Fragment, {});

package/dist/FormSteps/FileUploadStep/MaterialFileUploadStep/MaterialFileUploadStep.js

@@ -209,7 +209,6 @@ function FileUploadStep(_a) {
         return '';
     };
     return (_jsxs("div", __assign({ className: styles.container + (error || !!fieldError ? ' EF-error' : ''), style: {
-            breakInside: 'avoid',
             minHeight: editable === false || postview ? undefined : '100px',
         }, "data-testid": step.id }, { children: [_jsx("div", __assign({ className: styles.labelLabel }, { children: step.label })), step.description && (_jsx("div", __assign({ className: styles.stepDescriptionLabel, style: { color: formStyle.descriptionTextColor } }, { children: step.description }))), _jsx("input", { type: "file", ref: inputRef, className: styles.filesInput, onChange: function (e) {
                     var files = e.target.files;

package/dist/FormSteps/RatingStep/MaterialRatingStep/MaterialRatingStep.js

@@ -50,7 +50,6 @@ function RatingStep(_a) {
     };
     return (_jsxs(React.Fragment, { children: [_jsxs("div", __assign({ className: styles.container, style: {
                     paddingBottom: step.description || step.required ? 0 : 15,
-                    breakInside: 'avoid',
                 } }, { children: [_jsx("div", __assign({ className: styles.labelLabel }, { children: step.label + (step.required ? ' *' : '') })), _jsx("div", __assign({ className: styles.ratingContainer }, { children: _jsx(Rating, { name: step.id, type: step.ratingType, isMobile: widthStats.isMobile, focusColor: (_b = formStyle.primaryColor) !== null && _b !== void 0 ? _b : '#3d5a7f', unSelectedColor: (_c = formStyle.outlineColor) !== null && _c !== void 0 ? _c : '#b8b8b8', disabled: !editable || postview, value: value, onChange: onChange, inputRef: ref }) })), (step.description || step.required) && (_jsx("div", __assign({ className: styles.stepDescriptionLabel, style: {
                             color: !!error && value === null
                                 ? (_d = formStyle.errorColor) !== null && _d !== void 0 ? _d : '#cc2936'

package/dist/FormSteps/SelectorStep/MaterialSelectorStep/MaterialSelectorStep.js

@@ -9,17 +9,26 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
+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 { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React, { useContext } from 'react';
+import React, { useContext, useEffect, useMemo } from 'react';
 import { OptionTypes } from '../../../constants/FormStepTypes';
 import StepComponent from '../../Step';
 import RoundedSmartSelect from '../../../Shared/RoundedSmartSelect/RoundedSmartSelect';
 import FormContext from '../../../Contexts/FormContext';
 import { useAppSelector } from '../../../hooks';
-import { useFormStep } from '../../StepHooks';
+import { recursivelyCalcConditionSteps, selectDependencies, useFormStep, } from '../../StepHooks';
 import StepFillerContainer from '../../Utils/@StepFiller/StepFiller';
 import MaterialInputContainer from '../../Utils/MaterialInputContainer/MaterialInputContainer';
-import { calcDefaultValue } from '../../StepFunctions';
+import { calcDefaultValue, evaluateCondition } from '../../StepFunctions';
 function SelectorStep(_a) {
     var _b, _c, _d;
     var step = _a.step, editable = _a.editable;
@@ -32,6 +41,20 @@ function SelectorStep(_a) {
     }), ref = _e.ref, value = _e.value, onChange = _e.onChange, error = _e.error, field = _e.field;
     var form = useContext(FormContext);
     var _f = useAppSelector(function (state) { return state.global; }), postview = _f.postview, formStyle = _f.formStyle;
+    var idDependencies = useMemo(function () {
+        var _a;
+        var dependencies = __spreadArray([], ((_a = step.dependencies) !== null && _a !== void 0 ? _a : []), true);
+        for (var _i = 0, _b = Object.values(step.options); _i < _b.length; _i++) {
+            var option = _b[_i];
+            if (option.condition) {
+                dependencies.push.apply(dependencies, recursivelyCalcConditionSteps(option.condition));
+            }
+        }
+        return dependencies;
+    }, []);
+    var dependencies = useAppSelector(function (state) {
+        return selectDependencies(state, idDependencies);
+    });
     var mapNestedOption = function () {
         var currentOptionIndex = null;
         var currentOption = null;
@@ -50,7 +73,21 @@ function SelectorStep(_a) {
                 }) }));
         }
     };
-    return (_jsxs(React.Fragment, { children: [_jsx(MaterialInputContainer, __assign({ step: step, editable: editable }, { children: _jsx(RoundedSmartSelect, __assign({}, field, { value: value, inputRef: ref, handleUpdate: onChange, disabled: false, loading: false, options: step.options, cantEdit: !editable || postview, fullWidth: true, backgroundColor: (_b = formStyle.stepBackgroundColor) !== null && _b !== void 0 ? _b : 'white', label: step.label, required: step.required, height: '31px', searchable: step.searchable, icon: undefined, helperTextColor: formStyle.descriptionTextColor, focusColor: formStyle.primaryColor, outlineColor: formStyle.outlineColor, errorColor: formStyle.errorColor, color: formStyle.textColor, containerMargin: "0px", getOptionSelected: function (option, value) {
+    var filteredOptions = useMemo(function () {
+        return step.options.filter(function (option) {
+            if (!option.condition ||
+                evaluateCondition(option.condition, dependencies))
+                return true;
+            return false;
+        });
+    }, idDependencies.map(function (id) { return dependencies[id].value; }));
+    useEffect(function () {
+        if (filteredOptions.find(function (option) { return option.value === (value === null || value === void 0 ? void 0 : value.value); }) ===
+            undefined) {
+            onChange('');
+        }
+    }, [filteredOptions]);
+    return (_jsxs(React.Fragment, { children: [_jsx(MaterialInputContainer, __assign({ step: step, editable: editable }, { children: _jsx(RoundedSmartSelect, __assign({}, field, { value: value, inputRef: ref, handleUpdate: onChange, disabled: false, loading: false, options: filteredOptions, cantEdit: !editable || postview, fullWidth: true, backgroundColor: (_b = formStyle.stepBackgroundColor) !== null && _b !== void 0 ? _b : 'white', label: step.label, required: step.required, height: '31px', searchable: step.searchable, icon: undefined, helperTextColor: formStyle.descriptionTextColor, focusColor: formStyle.primaryColor, outlineColor: formStyle.outlineColor, errorColor: formStyle.errorColor, color: formStyle.textColor, containerMargin: "0px", getOptionSelected: function (option, value) {
                         return (option === null || option === void 0 ? void 0 : option.value) === (value === null || value === void 0 ? void 0 : value.value);
                     }, helperText: (_d = (_c = error === null || error === void 0 ? void 0 : error.message) === null || _c === void 0 ? void 0 : _c.toString()) !== null && _d !== void 0 ? _d : step.description, error: !!error })) })), value && mapNestedOption()] }));
 }

package/dist/FormSteps/SmartSelectStep/MaterialSmartSelectStep/MaterialSmartSelectStep.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
 import { SmartSelectStepProps } from '../SmartSelectStep';
 import { GSmartSelect } from '../../../@Types/GenericFormSteps';
-declare function SmartSelectStep<StepType extends GSmartSelect>({ icon, step, editable, getOptions, calcDepError, defaultValue, valueOverwrite, getValueString, changeListener, getValueWarning, getOptionSelected, renderNestedSteps, }: SmartSelectStepProps<StepType>): JSX.Element;
+declare function SmartSelectStep<StepType extends GSmartSelect>({ icon, step, editable, getOptions, calcDepError, defaultValue, filterOptions, valueOverwrite, getValueString, changeListener, getValueWarning, getOptionSelected, getOptionsConditionsIdSteps, renderNestedSteps, }: SmartSelectStepProps<StepType>): JSX.Element;
 export default SmartSelectStep;