@arquimedes.co/eureka-forms 3.0.69 → 3.0.71-test

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

@@ -5,7 +5,7 @@ import SmartSelect from '../../SmartSelectStep/MaterialSmartSelectStep/MaterialS
 import widgetInstance from '../../../Utils/AxiosWidget';
 import FormContext, { IdFormContext } from '../../../Contexts/FormContext';
 import StepFillerContainer from '../../Utils/@StepFiller/StepFiller';
-import { isStepHiddenByCondition, recursivelyCalcConditionSteps, selectDependencies } from '../../StepHooks';
+import { recursivelyCalcConditionSteps, selectDependencies } from '../../StepHooks';
 import { useApiSubscribe, useAppSelector } from '../../../hooks';
 import MaterialEntityValueDialog from './MaterialEntityValueDialog/MaterialEntityValueDialog';
 import InputIcon from '../../../Shared/InputIcon/InputIcon';
@@ -13,8 +13,6 @@ import { evaluateCondition } from '../../StepFunctions';
 import StepComponent from '../../Step';
 import ErkValueTypes from '../../../constants/ErkValueTypes';
 import { IntegrationsApi } from '../../../Services/IntegrationService';
-import { entityValueDependencyValue } from '../entityValueDependencyValue';
-import { entityValuePickerWatchedSteps } from '../entityValuePickerWatchedSteps';
 function EntityValuePickerStep({ step, editable }) {
     const form = useContext(FormContext);
     const subscribe = useApiSubscribe();
@@ -27,23 +25,8 @@ function EntityValuePickerStep({ step, editable }) {
         }))) ?? []);
     }, [subscribe, idForm]);
     const getOptions = useCallback(async (step, dependencyStore, ids) => {
-        return await getEntityValueOptions(step, dependencyStore, ids, fetchFilterIntegration, form);
-    }, [fetchFilterIntegration, form]);
-    // The visibility of a filter's step decides whether that filter applies, so the steps its condition
-    // reads must trigger a refetch too — see `isStepHiddenByCondition`.
-    const getOptionalDependencies = useCallback((picker) => {
-        const watched = entityValuePickerWatchedSteps(picker);
-        for (const idWatched of [...watched]) {
-            for (const idCondition of recursivelyCalcConditionSteps(form.steps[idWatched]?.condition)) {
-                if (idCondition === picker.id || watched.includes(idCondition))
-                    continue;
-                if (picker.dependencies?.includes(idCondition))
-                    continue;
-                watched.push(idCondition);
-            }
-        }
-        return watched;
-    }, [form]);
+        return await getEntityValueOptions(step, dependencyStore, ids, fetchFilterIntegration);
+    }, [fetchFilterIntegration]);
     const [dialogs, setDialogs] = useState();
     const dialogsIdStepDeps = useMemo(() => {
         const ids = [];
@@ -128,7 +111,7 @@ function EntityValuePickerStep({ step, editable }) {
                     } }) })] }));
 }
 export default EntityValuePickerStep;
-const getEntityValueOptions = async (step, dependencyStore, { idOrganization, idCurrentAgent, }, fetchFilterIntegration, form) => {
+const getEntityValueOptions = async (step, dependencyStore, { idOrganization, idCurrentAgent, }, fetchFilterIntegration) => {
     if (!idOrganization)
         return null;
     let urlPath = '';
@@ -190,12 +173,14 @@ const getEntityValueOptions = async (step, dependencyStore, { idOrganization, id
                 break;
             }
             case EntityValueDataTypes.STEP: {
-                const currentValue = entityValueDependencyValue(dependencyStore[filter.idStep]);
-                if (currentValue !== undefined) {
-                    params.set(filter.idProperty, currentValue);
+                const currentValue = dependencyStore[filter.idStep]?.value;
+                if (currentValue) {
+                    if (typeof currentValue === 'string')
+                        params.set(filter.idProperty, currentValue);
+                    else
+                        params.set(filter.idProperty, currentValue._id ?? currentValue.id);
                 }
-                else if (filter.required && !isStepHiddenByCondition(filter.idStep, form, dependencyStore)) {
-                    // A required filter blocks only while its step can still be answered.
+                else if (filter.required) {
                     return null;
                 }
                 break;
@@ -216,3 +201,18 @@ const getEntityValueOptions = async (step, dependencyStore, { idOrganization, id
     });
     return response.data.filter((option) => step.options[option._id]?.type !== EntityValueOptionTypes.HIDE);
 };
+const getOptionalDependencies = (step) => {
+    const optional = [];
+    for (const filter of step.filters) {
+        switch (filter.type) {
+            case EntityValueDataTypes.STEP: {
+                if (filter.idStep && !filter.required && !step.dependencies?.includes(filter.idStep))
+                    optional.push(filter.idStep);
+                break;
+            }
+            default:
+                break;
+        }
+    }
+    return optional;
+};

package/dist/FormSteps/SmartSelectStep/MaterialSmartSelectStep/MaterialSmartSelectStep.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useFormContext } from 'react-hook-form';
 import ErkSmartSelect from '../../../Shared/ErkSmartSelect/ErkSmartSelect';
-import { useCallback, useContext, useEffect, useMemo, useState } from 'react';
+import { useCallback, useContext, useEffect, useMemo, useRef, useState } from 'react';
 import React from 'react';
 import FormContext from '../../../Contexts/FormContext';
 import { useAppDispatch, useAppSelector } from '../../../hooks';
@@ -28,6 +28,11 @@ function SmartSelectStep({ step, editable, getOptions, calcDepError, defaultValu
     const [loading, setLoading] = useState(false);
     const [firstTime, setFirstTime] = useState(true);
     const [touched, setTouched] = useState(false);
+    /**
+     * Every dependency change (each keystroke of a NIT, say) starts a new request without cancelling the
+     * ones in flight, and they can resolve in any order. Only the latest request may touch the options.
+     */
+    const lastRequest = useRef(0);
     const dispatch = useAppDispatch();
     const allDeps = useMemo(() => [...(step.dependencies ?? []), ...getOptionalDependencies(step)], [getOptionalDependencies, step]);
     const idDependencies = useMemo(() => getOptionsConditionsIdSteps(step), [getOptionsConditionsIdSteps, step]);
@@ -52,6 +57,7 @@ function SmartSelectStep({ step, editable, getOptions, calcDepError, defaultValu
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [allDepsValues]);
     const calcOptions = async (firstTime) => {
+        const request = ++lastRequest.current;
         if (!firstTime)
             setOptions(undefined);
         if (value && !firstTime)
@@ -61,6 +67,8 @@ function SmartSelectStep({ step, editable, getOptions, calcDepError, defaultValu
                 idOrganization,
                 idCurrentAgent: postview ? undefined : idCurrentAgent,
             });
+            if (request !== lastRequest.current)
+                return;
             if (value) {
                 /** If the value is still valid select it */
                 if (resp && getValueString(value) !== undefined) {
@@ -82,6 +90,8 @@ function SmartSelectStep({ step, editable, getOptions, calcDepError, defaultValu
             }
         }
         catch (error) {
+            if (request !== lastRequest.current)
+                return;
             console.error(error);
             setOptions(null);
         }

package/dist/FormSteps/SmartSelectStep/SmartSelectStep.staleOptions.test.js

@@ -0,0 +1,100 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { act, render } from '@testing-library/react';
+import { describe, expect, it } from 'vitest';
+import '@testing-library/jest-dom';
+import { Provider } from 'react-redux';
+import { FormProvider, useForm } from 'react-hook-form';
+import { configureStore } from '@reduxjs/toolkit';
+import { EurekaFormsReducer, defaultRootState } from '../../Utils/store';
+import { RootApi } from '../../Utils/_api';
+import FormStepTypes from '../../constants/FormStepTypes';
+import { StoreContext } from '../../Utils/StoreContext';
+import FormContext, { IdFormContext } from '../../Contexts/FormContext';
+import SectionContext from '../../Contexts/SectionContext';
+import MaterialProviders from '../../Utils/MaterialProviders';
+import InternalFormStyle from '../../constants/InternalFormStyle';
+import { setStepDependency } from '../../States/SiteSlice';
+import SmartSelectStep from './SmartSelectStep';
+const ID_FORM = 'STALE_OPTIONS_FORM';
+const nitStep = {
+    id: 'nit-step',
+    idSection: 'SECTION_1',
+    stepPath: ['nit-step'],
+    type: FormStepTypes.TEXTINPUT,
+    label: 'NIT',
+    description: '',
+    required: true,
+    size: 1,
+    maxLength: 20,
+};
+/** A city-like selector whose options come from the NIT the user is still typing. */
+const cityStep = {
+    id: 'city-step',
+    idSection: 'SECTION_1',
+    stepPath: ['city-step'],
+    type: 'AYF_ICA_CITY',
+    label: 'Ciudad',
+    description: '',
+    showIcon: false,
+    required: false,
+    searchable: false,
+    size: 1,
+    dependencies: ['nit-step'],
+};
+const form = {
+    firstSection: 'SECTION_1',
+    sections: {
+        SECTION_1: { id: 'SECTION_1', name: 'Sección 1', steps: ['nit-step', 'city-step'], nextSection: null },
+    },
+    steps: { 'nit-step': nitStep, 'city-step': cityStep },
+    confirmationMessage: { blocks: [], entityMap: {} },
+    showLink: false,
+    size: { blockSize: 200, blockNum: 4, spacingSize: 10 },
+};
+const dependencies = {
+    'nit-step': { idOriginal: 'nit-step', dependents: [cityStep], value: '', type: FormStepTypes.TEXTINPUT },
+};
+function makeStore() {
+    return configureStore({
+        reducer: { forms: EurekaFormsReducer, [RootApi.reducerPath]: RootApi.reducer },
+        preloadedState: {
+            forms: { [ID_FORM]: { ...defaultRootState, site: { ...defaultRootState.site, dependencies } } },
+        },
+        middleware: (getDefaultMiddleware) => getDefaultMiddleware().concat(RootApi.middleware),
+    });
+}
+function Harness({ store, requests }) {
+    const methods = useForm({ mode: 'onTouched' });
+    return (_jsx(MaterialProviders, { formStyle: InternalFormStyle, children: _jsx(Provider, { store: store, context: StoreContext, children: _jsx(IdFormContext.Provider, { value: ID_FORM, children: _jsx(FormContext.Provider, { value: form, children: _jsx(SectionContext.Provider, { value: "SECTION_1", children: _jsx(FormProvider, { ...methods, children: _jsx(SmartSelectStep, { step: cityStep, editable: true, getOptions: (_step, deps) => new Promise((resolve) => {
+                                    requests.push({ nit: deps['nit-step']?.value, resolve });
+                                }), getOptionSelected: (option, value) => option === value, getValueString: (value) => value }) }) }) }) }) }) }));
+}
+const optionTexts = () => Array.from(document.querySelectorAll('[role=option]')).map((option) => option.textContent ?? '');
+describe('SmartSelectStep when a dependency changes faster than its options load', () => {
+    it('keeps the options of the latest dependency value when an older request resolves last', async () => {
+        const store = makeStore();
+        const requests = [];
+        render(_jsx(Harness, { store: store, requests: requests }));
+        const typeNit = (value) => {
+            act(() => {
+                store.dispatch({ ...setStepDependency({ step: nitStep, value }), meta: { idForm: ID_FORM } });
+            });
+        };
+        typeNit('9');
+        typeNit('901379420');
+        const byNit = (nit) => requests.find((request) => request.nit === nit);
+        expect(byNit('9')).toBeDefined();
+        expect(byNit('901379420')).toBeDefined();
+        // The full NIT answers first with cities; the partial NIT straggles in afterwards with nothing.
+        const settle = (pending, options) => act(async () => {
+            pending.resolve(options);
+            await Promise.resolve();
+        });
+        await settle(byNit('901379420'), ['BELLO', 'MEDELLIN']);
+        await settle(byNit('9'), []);
+        act(() => {
+            document.querySelector('[role=combobox]').dispatchEvent(new MouseEvent('mousedown', { bubbles: true }));
+        });
+        expect(optionTexts()).toEqual(expect.arrayContaining(['BELLO', 'MEDELLIN']));
+    });
+});

package/dist/FormSteps/Step.js

@@ -24,10 +24,6 @@ import CustomContext from '../Contexts/CustomContext';
 import { selectOriginalValue, useCondition } from './StepHooks';
 import TimePickerStep from './TimePickerStep/TimePickerStep';
 import PhoneInputStep from './PhoneInputStep/PhoneInputStep';
-import LocationStepComponent from './LocationStep/LocationStep';
-import NumberStepComponent from './NumberStep/NumberStep';
-import BookingStepComponent from './BookingStep/BookingStep';
-import AvailabilityStepComponent from './AvailabilityStep/AvailabilityStep';
 function StepComponent({ step, ...props }) {
     const { postview, partial } = useAppSelector((state) => state.global);
     const { customSteps, customClientInfoStep } = useContext(CustomContext);
@@ -79,18 +75,6 @@ function StepComponent({ step, ...props }) {
         case FormStepTypes.DATEPICKER: {
             return _jsx(DatePickerStep, { ...props, step: step, editable: editable });
         }
-        case FormStepTypes.LOCATION: {
-            return _jsx(LocationStepComponent, { ...props, step: step, editable: editable });
-        }
-        case FormStepTypes.NUMBER: {
-            return _jsx(NumberStepComponent, { ...props, step: step, editable: editable });
-        }
-        case FormStepTypes.BOOKING: {
-            return _jsx(BookingStepComponent, { ...props, step: step, editable: editable });
-        }
-        case FormStepTypes.AVAILABILITY: {
-            return _jsx(AvailabilityStepComponent, { ...props, step: step, editable: editable });
-        }
         case FormStepTypes.DATEPICKER_RANGE: {
             return _jsx(DatePickerRangeStep, { ...props, step: step, editable: editable });
         }

package/dist/FormSteps/StepFunctions.js

@@ -1,4 +1,3 @@
-import { NumberStepType, } from '../@Types/FormStep';
 import FormStepTypes, { ApiSelectorOptionTypes, ClassifierOptionTypes, EntityValueDataTypes, EntityValueOptionTypes, OptionTypes, } from '../constants/FormStepTypes';
 import CBRFormStepTypes from '../constants/CBRFormStepTypes';
 import AYFFormStepTypes from '../constants/AYFFormStepTypes';
@@ -88,8 +87,6 @@ function recursivelyCheckOpenSize(idStep, steps, values) {
             return size;
         }
         case FormStepTypes.DATEPICKER:
-        case FormStepTypes.LOCATION:
-        case FormStepTypes.NUMBER:
         case FormStepTypes.TEXTINPUT: {
             return step.size;
         }
@@ -178,17 +175,6 @@ export const calcDefaultValue = (step) => {
                 return getRawText();
             else
                 return '';
-        case FormStepTypes.LOCATION:
-            return step.defaultValue ?? null;
-        case FormStepTypes.NUMBER: {
-            const numStep = step;
-            if (numStep.numberType === NumberStepType.MONEY ||
-                numStep.numberType === NumberStepType.MEASURE ||
-                numStep.numberType === NumberStepType.UNIT_PRICE) {
-                return numStep.defaultValue ?? null;
-            }
-            return numStep.defaultValue ?? '';
-        }
         case FormStepTypes.RATING:
         case FormStepTypes.DATEPICKER:
         case FormStepTypes.DATEPICKER_RANGE:

package/dist/FormSteps/StepFunctions.test.js

@@ -1,4 +1,3 @@
-import * as Steps from '../@Types/FormStep';
 import AYFFormStepTypes from '../constants/AYFFormStepTypes';
 import CBRFormStepTypes from '../constants/CBRFormStepTypes';
 import FormStepTypes, { ApiSelectorOptionTypes, ClassifierOptionTypes, EntityValueOptionTypes, OptionTypes, } from '../constants/FormStepTypes';
@@ -528,13 +527,6 @@ describe('StepFunctions', function () {
             const defaultValue = calcDefaultValue(step);
             expect(defaultValue).toBe(null);
         });
-        test('Location step type', async () => {
-            const step = {
-                type: FormStepTypes.LOCATION,
-            };
-            const defaultValue = calcDefaultValue(step);
-            expect(defaultValue).toBe(null);
-        });
         test('Mapper, FileUpload, CBRFormStep types', async () => {
             const step1 = {
                 type: FormStepTypes.MAPPER,
@@ -566,52 +558,6 @@ describe('StepFunctions', function () {
             const defaultValue = calcDefaultValue(step);
             expect(defaultValue).toBeUndefined();
         });
-        test('Number step type without defaultValue', async () => {
-            const step1 = {
-                type: FormStepTypes.NUMBER,
-                numberType: Steps.NumberStepType.INTEGER,
-            };
-            const step2 = {
-                type: FormStepTypes.NUMBER,
-                numberType: Steps.NumberStepType.DECIMAL,
-            };
-            const step3 = {
-                type: FormStepTypes.NUMBER,
-                numberType: Steps.NumberStepType.PERCENTAGE,
-            };
-            const step4 = {
-                type: FormStepTypes.NUMBER,
-                numberType: Steps.NumberStepType.MONEY,
-            };
-            const step5 = {
-                type: FormStepTypes.NUMBER,
-                numberType: Steps.NumberStepType.MEASURE,
-            };
-            const step6 = {
-                type: FormStepTypes.NUMBER,
-                numberType: Steps.NumberStepType.UNIT_PRICE,
-            };
-            expect(calcDefaultValue(step1)).toBe('');
-            expect(calcDefaultValue(step2)).toBe('');
-            expect(calcDefaultValue(step3)).toBe('');
-            expect(calcDefaultValue(step4)).toBe(null);
-            expect(calcDefaultValue(step5)).toBe(null);
-            expect(calcDefaultValue(step6)).toBe(null);
-        });
-        test('Number step type with defaultValue', async () => {
-            const step1 = {
-                type: FormStepTypes.NUMBER,
-                numberType: Steps.NumberStepType.INTEGER,
-                defaultValue: 42,
-            };
-            const step2 = {
-                type: FormStepTypes.NUMBER,
-                numberType: Steps.NumberStepType.MONEY,
-                defaultValue: { value: 100, currency: 'USD' },
-            };
-            expect(calcDefaultValue(step1)).toBe(42);
-            expect(calcDefaultValue(step2)).toEqual({ value: 100, currency: 'USD' });
-        });
     });
     describe('iterateNestedSteps', function () {
         test('should iterate over nested steps', async () => {

package/dist/FormSteps/StepHooks.d.ts

@@ -34,13 +34,6 @@ export interface StepDependency {
     handleStepDep: (value: any) => void;
 }
 export declare const useStepDependency: (step: GBaseStep, defaultValue?: any) => StepDependency;
-/**
- * Whether `idStep` is currently kept off the form by its own visibility condition. A step that is not
- * shown cannot be answered, so nothing may wait for it: a required entity filter pointing at it does
- * not apply, and it never reads as a missing dependency. When the condition cannot be decided yet (a
- * step it reads is not in the store) the step counts as shown, keeping the conservative behaviour.
- */
-export declare const isStepHiddenByCondition: (idStep: string, form: Form, dependencies: DependencyStore) => boolean;
 export declare const selectStepDependencies: ((state: RootState, _step: GBaseStep, form: Form) => {
     invalids: string[];
     emptyDep: boolean;
@@ -74,20 +67,6 @@ export declare const selectStepDependencies: ((state: RootState, _step: GBaseSte
     memoize: typeof import("reselect").weakMapMemoize;
     argsMemoize: typeof import("reselect").weakMapMemoize;
 };
-/**
- * The steps `idStep` depends on, transitively: every dependency's own dependencies come before it,
- * and every id is answered exactly once. `idStep` itself is never listed — a step is not a
- * dependency of itself, even when a draft points it back at itself.
- *
- * A saved form is a DAG: the backend recomputes and validates `step.dependencies` on save. The
- * editor's live preview renders unsaved drafts though, where a filter or a path hop can still point
- * at the step that holds it, or close a cycle with another step. The walk must therefore terminate
- * on any graph, cyclic included: a step is marked visited before it is walked and is never walked
- * or listed twice, so every edge is followed at most once.
- *
- * Exported for the unit test; it is internal to this module and not part of the package's surface.
- */
-export declare const calcDeepDependencies: (idStep: string, form: Form) => string[];
 export interface UseFormStepOptions<ValueType> {
     defaultValue: ValueType;
     /** If true, will not trigger onChange until the user has finished typing */

package/dist/FormSteps/StepHooks.js

@@ -8,7 +8,6 @@ import { useController } from 'react-hook-form';
 import ConditionTypes from '../constants/ConditionTypes';
 import FormStepTypes, { ApiSelectorOptionTypes, ClassifierOptionTypes, EntityValueOptionTypes, } from '../constants/FormStepTypes';
 import { SizeChangeContext } from './Utils/@StepFiller/StepFillerContext';
-import { entityValuePickerBlockingSteps } from './EntityValueStep/entityValuePickerWatchedSteps';
 const selectIsDependency = createSelector([
     (state) => state.site.dependencies,
     (_state, step) => step,
@@ -48,20 +47,6 @@ export const useStepDependency = (step, defaultValue) => {
         originalValue: originalValue ?? defaultValue ?? calcDefaultValue(step),
     };
 };
-/**
- * Whether `idStep` is currently kept off the form by its own visibility condition. A step that is not
- * shown cannot be answered, so nothing may wait for it: a required entity filter pointing at it does
- * not apply, and it never reads as a missing dependency. When the condition cannot be decided yet (a
- * step it reads is not in the store) the step counts as shown, keeping the conservative behaviour.
- */
-export const isStepHiddenByCondition = (idStep, form, dependencies) => {
-    const target = form.steps[idStep];
-    if (!target?.condition)
-        return false;
-    if (recursivelyCalcConditionSteps(target.condition).some((id) => dependencies[id] === undefined))
-        return false;
-    return !evaluateCondition(target.condition, dependencies);
-};
 export const selectStepDependencies = createSelector([
     (state) => state.site.dependencies,
     (_state, step) => step,
@@ -71,8 +56,6 @@ export const selectStepDependencies = createSelector([
     let emptyDep = false;
     /** Show deep error changes even if not in dependencies */
     for (const idDep of calcDeepDependencies(step.id, form)) {
-        if (isStepHiddenByCondition(idDep, form, dependencies))
-            continue;
         const dependency = dependencies[idDep];
         if (dependency?.value === null && form.steps[idDep]) {
             invalids.push(idDep);
@@ -82,45 +65,15 @@ export const selectStepDependencies = createSelector([
     }
     return { invalids, emptyDep };
 });
-/**
- * The steps `idStep` depends on, transitively: every dependency's own dependencies come before it,
- * and every id is answered exactly once. `idStep` itself is never listed — a step is not a
- * dependency of itself, even when a draft points it back at itself.
- *
- * A saved form is a DAG: the backend recomputes and validates `step.dependencies` on save. The
- * editor's live preview renders unsaved drafts though, where a filter or a path hop can still point
- * at the step that holds it, or close a cycle with another step. The walk must therefore terminate
- * on any graph, cyclic included: a step is marked visited before it is walked and is never walked
- * or listed twice, so every edge is followed at most once.
- *
- * Exported for the unit test; it is internal to this module and not part of the package's surface.
- */
-export const calcDeepDependencies = (idStep, form) => {
-    const deps = [];
-    /** `idStep` starts out visited so a cycle back to it stops there and never lists it. */
-    const visited = new Set([idStep]);
-    const walk = (id) => {
-        const step = form.steps[id];
-        if (!step)
-            return;
-        /**
-         * An entity picker also gives up (its options resolve to null) while a path hop or a
-         * required STEP filter holds no value. Those are in `step.dependencies` once the form has
-         * been saved, but not in an unsaved draft, so they are added here to read as a missing
-         * dependency instead of as a failed load.
-         */
-        const idDeps = step.type === FormStepTypes.ENTITYVALUEPICKER
-            ? [...(step.dependencies ?? []), ...entityValuePickerBlockingSteps(step)]
-            : step.dependencies;
-        for (const dep of idDeps ?? []) {
-            if (visited.has(dep))
-                continue;
-            visited.add(dep);
-            walk(dep);
-            deps.push(dep);
+const calcDeepDependencies = (idStep, form, deps = []) => {
+    const step = form.steps[idStep];
+    if (step?.dependencies) {
+        for (const dep of step.dependencies) {
+            if (!deps.includes(dep)) {
+                deps.push(...calcDeepDependencies(dep, form, deps), dep);
+            }
         }
-    };
-    walk(idStep);
+    }
     return deps;
 };
 export const useFormStep = (step, { rules, debounce, sizeChange, defaultValue }) => {

package/dist/FormSteps/ciudadesICAQuery.d.ts

@@ -0,0 +1,8 @@
+import { GSmartSelect } from '../@Types/GenericFormSteps';
+import { DependencyStore } from '../Form/Form';
+/**
+ * Query for `CiudadesICA`. The NIT dependency is `null` until the user types it; it must be left out of the
+ * query rather than serialised as the text "null", which the integrations API would take as a real NIT (and
+ * SINCO answers that with no cities instead of the organisation's main city).
+ */
+export declare function ciudadesICAQuery(step: GSmartSelect, dependencyStore: DependencyStore, idOrganization: string): URLSearchParams;

package/dist/FormSteps/ciudadesICAQuery.js

@@ -0,0 +1,31 @@
+import AYFFormStepTypes from '../constants/AYFFormStepTypes';
+/**
+ * Query for `CiudadesICA`. The NIT dependency is `null` until the user types it; it must be left out of the
+ * query rather than serialised as the text "null", which the integrations API would take as a real NIT (and
+ * SINCO answers that with no cities instead of the organisation's main city).
+ */
+export function ciudadesICAQuery(step, dependencyStore, idOrganization) {
+    const params = new URLSearchParams({ idOrganization, nit: 'true' });
+    const nit = dependencyStore[step.idNitStep]?.value;
+    if (nit)
+        params.set('idCompany', nit);
+    for (const dep of step.dependencies ?? []) {
+        const value = dependencyStore[dep]?.value;
+        if (value && dep.startsWith('AYF')) {
+            switch (dep.split('-')?.[0]) {
+                case AYFFormStepTypes.AYF_START_MONTH:
+                    params.set('startMonth', value.id);
+                    break;
+                case AYFFormStepTypes.AYF_END_MONTH:
+                    params.set('endMonth', value.id);
+                    break;
+                case AYFFormStepTypes.AYF_YEAR:
+                    params.set('year', value);
+                    break;
+                default:
+                    break;
+            }
+        }
+    }
+    return params;
+}

package/dist/FormSteps/ciudadesICAQuery.test.js

@@ -0,0 +1,39 @@
+import { describe, expect, it } from 'vitest';
+import AYFFormStepTypes from '../constants/AYFFormStepTypes';
+import FormStepTypes from '../constants/FormStepTypes';
+import { ciudadesICAQuery } from './ciudadesICAQuery';
+const cityStep = {
+    id: 'AYF_ICA_CITY-1',
+    idSection: 'SECTION_1',
+    stepPath: ['AYF_ICA_CITY-1'],
+    type: AYFFormStepTypes.AYF_ICA_CITY,
+    label: 'Ciudad',
+    description: '',
+    showIcon: false,
+    required: false,
+    size: 1,
+    idNitStep: 'TEXTINPUT-nit',
+    dependencies: ['TEXTINPUT-nit', 'AYF_YEAR-1'],
+};
+const storeWithNit = (value) => ({
+    'TEXTINPUT-nit': { idOriginal: 'TEXTINPUT-nit', dependents: [], value, type: FormStepTypes.TEXTINPUT },
+    'AYF_YEAR-1': { idOriginal: 'AYF_YEAR-1', dependents: [], value: '2026', type: AYFFormStepTypes.AYF_YEAR },
+});
+describe('ciudadesICAQuery', () => {
+    it('sends the NIT as idCompany once the user has typed it', () => {
+        const params = ciudadesICAQuery(cityStep, storeWithNit('901379420'), 'casa');
+        expect(params.get('idCompany')).toBe('901379420');
+        expect(params.get('nit')).toBe('true');
+        expect(params.get('year')).toBe('2026');
+    });
+    /**
+     * The NIT dependency is `null` until the user types something. Serialising that as the text "null"
+     * makes the integrations API query SINCO for a provider literally called "null", which answers with no
+     * cities instead of the organisation's main city.
+     */
+    it.each([null, undefined, ''])('omits idCompany while the NIT is %s', (nit) => {
+        const params = ciudadesICAQuery(cityStep, storeWithNit(nit), 'casa');
+        expect(params.has('idCompany')).toBe(false);
+        expect(params.get('idOrganization')).toBe('casa');
+    });
+});

package/dist/Shared/ErkDatePicker/ErkDatePicker.js

@@ -2,9 +2,11 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import React, { useMemo } from 'react';
 import { isValid } from 'date-fns';
 import { InputAdornment, styled, Dialog as MuiDialog } from '@mui/material';
-import { MobileDatePicker as MuiDatePicker, MobileDateTimePicker as MuiDateTimePicker, DatePickerToolbar as MuiDatePickerToolbar, DateTimePickerToolbar as MuiDateTimePickerToolbar, usePickerContext, usePickerAdapter, PickerDay as MuiPickerDay, renderTimeViewClock, } from '@mui/x-date-pickers';
+import { MobileDatePicker as MuiDatePicker, MobileDateTimePicker as MuiDateTimePicker, DatePickerToolbar as MuiDatePickerToolbar, DateTimePickerToolbar as MuiDateTimePickerToolbar, usePickerContext, usePickerAdapter, } from '@mui/x-date-pickers';
+import { PickerDay as MuiPickerDay } from '@mui/x-date-pickers/PickerDay';
 import { StyledTextField } from '../ErkTextField/ErkTextField';
 import CalendarIcon from '../../Icons/CalendarIcon';
+import { renderTimeViewClock } from '@mui/x-date-pickers/timeViewRenderers';
 const StyledDateTimePicker = styled(MuiDateTimePicker, {
     shouldForwardProp: (propName) => propName !== 'size',
 })(({ disabled, readOnly, size }) => ({

package/dist/Shared/ErkDateRangePicker/ErkDateRangePicker.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
-import { PickersShortcutsItem } from '@mui/x-date-pickers';
-import { MobileDateRangePickerProps as MuiDateRangePickerProps, DateRange } from '@mui/x-date-pickers-pro';
+import { MobileDateRangePickerProps as MuiDateRangePickerProps } from '@mui/x-date-pickers-pro/MobileDateRangePicker';
+import { DateRange } from '@mui/x-date-pickers-pro';
+import { PickersShortcutsItem } from '@mui/x-date-pickers/PickersShortcuts';
 import { ErkTextFieldProps } from '../ErkTextField/ErkTextField';
 interface ErkDateRangePickerProps extends Omit<MuiDateRangePickerProps, 'ref' | 'onChange' | 'value' | 'slotProps'>, Pick<ErkTextFieldProps, 'error' | 'required' | 'helperText' | 'size'> {
     onChange?: (dateRange: DateRange<Date>) => void;

package/dist/Shared/ErkDateRangePicker/ErkDateRangePicker.js

@@ -2,7 +2,8 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import React, { useMemo } from 'react';
 import { InputAdornment, styled, Dialog as MuiDialog } from '@mui/material';
 import { DatePickerToolbar as MuiDatePickerToolbar, usePickerContext, usePickerAdapter, } from '@mui/x-date-pickers';
-import { MobileDateRangePicker as MuiDateRangePicker, DateRangePickerDay as MuiDateRangePickerDay, } from '@mui/x-date-pickers-pro';
+import { MobileDateRangePicker as MuiDateRangePicker, } from '@mui/x-date-pickers-pro/MobileDateRangePicker';
+import { DateRangePickerDay as MuiDateRangePickerDay } from '@mui/x-date-pickers-pro';
 import { isValid } from 'date-fns';
 import { StyledTextField } from '../ErkTextField/ErkTextField';
 import CalendarIcon from '../../Icons/CalendarIcon';