@arquimedes.co/eureka-forms 3.0.68-test → 3.0.68

package/dist/FormSteps/StepFunctions.js

@@ -1,3 +1,4 @@
+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';
@@ -87,6 +88,8 @@ function recursivelyCheckOpenSize(idStep, steps, values) {
             return size;
         }
         case FormStepTypes.DATEPICKER:
+        case FormStepTypes.LOCATION:
+        case FormStepTypes.NUMBER:
         case FormStepTypes.TEXTINPUT: {
             return step.size;
         }
@@ -175,6 +178,17 @@ 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,3 +1,4 @@
+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';
@@ -527,6 +528,13 @@ 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,
@@ -558,6 +566,52 @@ 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,6 +34,13 @@ 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;
@@ -67,6 +74,20 @@ 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,6 +8,7 @@ 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,
@@ -47,6 +48,20 @@ 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,
@@ -56,6 +71,8 @@ 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);
@@ -65,15 +82,45 @@ export const selectStepDependencies = createSelector([
     }
     return { invalids, emptyDep };
 });
-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);
-            }
+/**
+ * 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);
         }
-    }
+    };
+    walk(idStep);
     return deps;
 };
 export const useFormStep = (step, { rules, debounce, sizeChange, defaultValue }) => {

package/dist/FormSteps/StepHooks.test.d.ts

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

package/dist/FormSteps/StepHooks.test.js

@@ -0,0 +1,92 @@
+import { describe, expect, test } from 'vitest';
+import FormStepTypes, { EntityValueDataTypes } from '../constants/FormStepTypes';
+import { calcDeepDependencies } from './StepHooks';
+const form = (steps) => ({
+    steps: Object.entries(steps).reduce((acc, [id, step]) => ({
+        ...acc,
+        [id]: { id, idSection: 'section', type: FormStepTypes.TEXTINPUT, ...step },
+    }), {}),
+});
+const picker = (step) => ({
+    type: FormStepTypes.ENTITYVALUEPICKER,
+    idEntity: 'entity',
+    path: [],
+    filters: [],
+    options: {},
+    ...step,
+});
+const stepFilter = (idStep, required) => ({
+    idProperty: 'prop-' + idStep,
+    type: EntityValueDataTypes.STEP,
+    idStep,
+    any: false,
+    required,
+});
+describe('calcDeepDependencies', () => {
+    test('walks a linear chain deepest first, listing each id once', () => {
+        const deps = calcDeepDependencies('a', form({
+            a: { dependencies: ['b'] },
+            b: { dependencies: ['c'] },
+            c: {},
+        }));
+        expect(deps).toEqual(['c', 'b']);
+    });
+    test('lists a dependency shared by two branches once', () => {
+        const deps = calcDeepDependencies('a', form({
+            a: { dependencies: ['b', 'c'] },
+            b: { dependencies: ['d'] },
+            c: { dependencies: ['d'] },
+            d: {},
+        }));
+        expect(deps).toEqual(['d', 'b', 'c']);
+    });
+    test('terminates on an A -> B -> A cycle without listing the step itself', () => {
+        const deps = calcDeepDependencies('a', form({
+            a: { dependencies: ['b'] },
+            b: { dependencies: ['a'] },
+        }));
+        expect(deps).toEqual(['b']);
+    });
+    test('terminates on a cycle reached deeper in the walk', () => {
+        const deps = calcDeepDependencies('a', form({
+            a: { dependencies: ['b'] },
+            b: { dependencies: ['c'] },
+            c: { dependencies: ['b'] },
+        }));
+        expect(deps).toEqual(['c', 'b']);
+    });
+    test('terminates on a step that depends on itself', () => {
+        const deps = calcDeepDependencies('a', form({
+            a: { dependencies: ['b'] },
+            b: { dependencies: ['b'] },
+        }));
+        expect(deps).toEqual(['b']);
+    });
+    /**
+     * A draft an entity picker points back at itself with a required STEP filter: the filter is not
+     * in the saved `dependencies` yet, so it only reaches the walk through
+     * `entityValuePickerBlockingSteps`.
+     */
+    test('terminates on a self reference through a required STEP filter of an entity picker', () => {
+        const deps = calcDeepDependencies('a', form({
+            a: { dependencies: ['picker'] },
+            picker: picker({ filters: [stepFilter('picker', true)] }),
+        }));
+        expect(deps).toEqual(['picker']);
+    });
+    test('terminates on a cycle closed by a required STEP filter of an entity picker', () => {
+        const deps = calcDeepDependencies('a', form({
+            a: { dependencies: ['picker'] },
+            picker: picker({ filters: [stepFilter('other', true)] }),
+            other: { dependencies: ['picker'] },
+        }));
+        expect(deps).toEqual(['other', 'picker']);
+    });
+    test('keeps a dependency whose step the draft has already deleted', () => {
+        const deps = calcDeepDependencies('a', form({ a: { dependencies: ['gone'] } }));
+        expect(deps).toEqual(['gone']);
+    });
+    test('answers nothing for a step the form does not hold', () => {
+        expect(calcDeepDependencies('missing', form({}))).toEqual([]);
+    });
+});

package/dist/FormSteps/isStepHiddenByCondition.test.d.ts

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

package/dist/FormSteps/isStepHiddenByCondition.test.js

@@ -0,0 +1,42 @@
+import { describe, expect, test } from 'vitest';
+import { isStepHiddenByCondition } from './StepHooks';
+// A Selector shown only while the Proyecto picker holds a specific value — the shape the editor saves.
+const PROYECTO = 'ENTITYVALUEPICKER-proyecto';
+const condition = {
+    type: 'EXPRESSION',
+    expression: 'AND',
+    conditions: [
+        { type: 'FORM_STEP', stepType: 'ENTITYVALUEPICKER', idStep: PROYECTO, operator: 'EXISTS' },
+        { type: 'FORM_STEP', stepType: 'ENTITYVALUEPICKER', idStep: PROYECTO, operator: 'EQUAL', values: ['kai'] },
+    ],
+};
+const form = {
+    steps: {
+        [PROYECTO]: { id: PROYECTO, type: 'ENTITYVALUEPICKER' },
+        'SELECTOR-piso': { id: 'SELECTOR-piso', type: 'SELECTOR', condition },
+        'SELECTOR-libre': { id: 'SELECTOR-libre', type: 'SELECTOR' },
+    },
+};
+const dependency = (value) => ({
+    idOriginal: PROYECTO,
+    dependents: [],
+    value,
+    type: 'ENTITYVALUEPICKER',
+});
+describe('isStepHiddenByCondition', () => {
+    test('a step without condition is never hidden', () => {
+        expect(isStepHiddenByCondition('SELECTOR-libre', form, {})).toBe(false);
+    });
+    test('a step whose condition evaluates false is hidden', () => {
+        expect(isStepHiddenByCondition('SELECTOR-piso', form, { [PROYECTO]: dependency({ _id: 'otro' }) })).toBe(true);
+    });
+    test('a step whose condition evaluates true is shown', () => {
+        expect(isStepHiddenByCondition('SELECTOR-piso', form, { [PROYECTO]: dependency({ _id: 'kai' }) })).toBe(false);
+    });
+    test('an undecidable condition (its step is not in the store) counts as shown', () => {
+        expect(isStepHiddenByCondition('SELECTOR-piso', form, {})).toBe(false);
+    });
+    test('a step unknown to the form counts as shown', () => {
+        expect(isStepHiddenByCondition('MAPPER-x-espacio', form, {})).toBe(false);
+    });
+});

package/dist/Icons/AddIcon.d.ts

@@ -0,0 +1,3 @@
+import { IconProps } from './@ErkIcon';
+declare function AddIcon(props: IconProps): JSX.Element;
+export default AddIcon;

package/dist/Icons/AddIcon.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useIconProps } from './@ErkIcon';
+function AddIcon(props) {
+    const iconProps = useIconProps(props);
+    return (_jsx("svg", { ...iconProps, viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z" }) }));
+}
+export default AddIcon;

package/dist/Icons/EditIcon.d.ts

@@ -0,0 +1,3 @@
+import { IconProps } from './@ErkIcon';
+declare function EditIcon(props: IconProps): JSX.Element;
+export default EditIcon;

package/dist/Icons/EditIcon.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useIconProps } from './@ErkIcon';
+function EditIcon(props) {
+    const iconProps = useIconProps(props);
+    return (_jsx("svg", { ...iconProps, version: "1.1", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M3 17.25V21h3.75L17.81 9.94l-3.75-3.75L3 17.25zM20.71 7.04c.39-.39.39-1.02 0-1.41l-2.34-2.34c-.39-.39-1.02-.39-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83z" }) }));
+}
+export default EditIcon;

package/dist/Icons/RemoveIcon.d.ts

@@ -0,0 +1,3 @@
+import { IconProps } from './@ErkIcon';
+declare function RemoveIcon(props: IconProps): JSX.Element;
+export default RemoveIcon;

package/dist/Icons/RemoveIcon.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useIconProps } from './@ErkIcon';
+function RemoveIcon(props) {
+    const iconProps = useIconProps(props);
+    return (_jsx("svg", { ...iconProps, viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M19 13H5v-2h14v2z" }) }));
+}
+export default RemoveIcon;

package/dist/Icons/ViewDayIcon.d.ts

@@ -0,0 +1,3 @@
+import { IconProps } from './@ErkIcon';
+declare function ViewDayIcon(props: IconProps): JSX.Element;
+export default ViewDayIcon;

package/dist/Icons/ViewDayIcon.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useIconProps } from './@ErkIcon';
+function ViewDayIcon(props) {
+    const iconProps = useIconProps(props);
+    return (_jsx("svg", { ...iconProps, viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M2 21h19v-2H2v2zm0-4h19v-8H2v8zm0-10h19V5H2v2z" }) }));
+}
+export default ViewDayIcon;

package/dist/Icons/ViewWeekIcon.d.ts

@@ -0,0 +1,3 @@
+import { IconProps } from './@ErkIcon';
+declare function ViewWeekIcon(props: IconProps): JSX.Element;
+export default ViewWeekIcon;

package/dist/Icons/ViewWeekIcon.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useIconProps } from './@ErkIcon';
+function ViewWeekIcon(props) {
+    const iconProps = useIconProps(props);
+    return (_jsx("svg", { ...iconProps, viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M6 5H3c-.55 0-1 .45-1 1v12c0 .55.45 1 1 1h3c.55 0 1-.45 1-1V6c0-.55-.45-1-1-1zm14 0h-3c-.55 0-1 .45-1 1v12c0 .55.45 1 1 1h3c.55 0 1-.45 1-1V6c0-.55-.45-1-1-1zm-7 0h-3c-.55 0-1 .45-1 1v12c0 .55.45 1 1 1h3c.55 0 1-.45 1-1V6c0-.55-.45-1-1-1z" }) }));
+}
+export default ViewWeekIcon;

package/dist/Shared/ErkAddressAutocomplete/ErkAddressAutocomplete.d.ts

@@ -0,0 +1,19 @@
+import React from 'react';
+import { LocationStepValue } from '../../@Types/LocationFormStep';
+export interface ErkAddressAutocompleteProps {
+    value?: LocationStepValue | null;
+    onChange: (value: LocationStepValue) => void;
+    /** ISO-2 para acotar las sugerencias (ej. ['co']). */
+    regionCodes?: string[];
+    placeholder?: string;
+    error?: boolean;
+    required?: boolean;
+    readOnly?: boolean;
+    inputRef?: React.Ref<HTMLInputElement>;
+}
+/**
+ * Buscador de direcciones con el `Autocomplete` de Base UI + Google Places.
+ * Emite un `LocationStepValue` (source GOOGLE_PLACES) con el desglose estructurado.
+ */
+declare function ErkAddressAutocomplete({ value, onChange, regionCodes, placeholder, error, required, readOnly, inputRef, }: ErkAddressAutocompleteProps): JSX.Element;
+export default ErkAddressAutocomplete;

package/dist/Shared/ErkAddressAutocomplete/ErkAddressAutocomplete.js

@@ -0,0 +1,80 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useRef, useState } from 'react';
+import { Autocomplete } from '@base-ui/react/autocomplete';
+import { fetchAddressSuggestions, loadPlaces, newSessionToken, resolvePrediction, } from './googlePlaces';
+import styles from './ErkAddressAutocomplete.module.css';
+/**
+ * Buscador de direcciones con el `Autocomplete` de Base UI + Google Places.
+ * Emite un `LocationStepValue` (source GOOGLE_PLACES) con el desglose estructurado.
+ */
+function ErkAddressAutocomplete({ value, onChange, regionCodes = ['co'], placeholder = 'Buscar dirección…', error = false, required = false, readOnly = false, inputRef, }) {
+    const apiKey = import.meta.env.VITE_GOOGLE_MAPS_API_KEY ?? '';
+    const [ready, setReady] = useState(false);
+    const [inputValue, setInputValue] = useState(value?.address ?? value?.name ?? '');
+    const [options, setOptions] = useState([]);
+    const [loading, setLoading] = useState(false);
+    const [hasSearched, setHasSearched] = useState(false);
+    const debounceRef = useRef(undefined);
+    const sessionTokenRef = useRef(undefined);
+    useEffect(() => {
+        if (readOnly)
+            return;
+        let active = true;
+        void loadPlaces(apiKey)
+            .then(() => {
+            if (!active)
+                return;
+            sessionTokenRef.current = newSessionToken();
+            setReady(true);
+        })
+            .catch(() => {
+            if (active)
+                setReady(false);
+        });
+        return () => {
+            active = false;
+        };
+    }, [apiKey, readOnly]);
+    const handleInput = useCallback((text) => {
+        setInputValue(text);
+        if (debounceRef.current)
+            clearTimeout(debounceRef.current);
+        if (!ready || !text || text.length < 3) {
+            setOptions([]);
+            setHasSearched(false);
+            return;
+        }
+        setLoading(true);
+        debounceRef.current = setTimeout(() => {
+            void (async () => {
+                try {
+                    setOptions(await fetchAddressSuggestions(text, {
+                        sessionToken: sessionTokenRef.current,
+                        regionCodes,
+                    }));
+                }
+                catch {
+                    setOptions([]);
+                }
+                finally {
+                    setLoading(false);
+                    setHasSearched(true);
+                }
+            })();
+        }, 300);
+    }, [ready, regionCodes]);
+    const handleSelect = useCallback(async (prediction) => {
+        try {
+            const stepValue = await resolvePrediction(prediction);
+            setInputValue(stepValue.address ?? stepValue.name ?? prediction.label);
+            setOptions([]);
+            onChange(stepValue);
+        }
+        finally {
+            // Cada selección cierra la sesión de billing de Google.
+            sessionTokenRef.current = newSessionToken();
+        }
+    }, [onChange]);
+    return (_jsxs(Autocomplete.Root, { items: options, mode: "none", value: inputValue, onValueChange: handleInput, disabled: readOnly, children: [_jsx(Autocomplete.Input, { ref: inputRef, placeholder: placeholder, required: required, readOnly: readOnly, className: error ? `${styles.input} ${styles.inputError}` : styles.input }), _jsx(Autocomplete.Portal, { children: _jsx(Autocomplete.Positioner, { className: styles.positioner, sideOffset: 4, children: _jsxs(Autocomplete.Popup, { className: styles.popup, children: [loading && _jsx("div", { className: styles.status, children: "Buscando\u2026" }), _jsx(Autocomplete.Empty, { className: styles.status, children: hasSearched ? 'No se encontraron resultados' : 'Escribe para buscar…' }), _jsx(Autocomplete.List, { className: styles.list, children: (option) => (_jsxs(Autocomplete.Item, { value: option, className: styles.item, onClick: () => void handleSelect(option), children: [_jsx("span", { className: styles.optionLabel, children: option.label }), option.description && (_jsx("span", { className: styles.optionDescription, children: option.description }))] }, option.placeId)) })] }) }) })] }));
+}
+export default ErkAddressAutocomplete;

package/dist/Shared/ErkAddressAutocomplete/ErkAddressAutocomplete.module.css

@@ -0,0 +1,88 @@
+.input {
+    width: 100%;
+    box-sizing: border-box;
+    height: 31px;
+    padding: 6px 12px;
+    font-size: 1rem;
+    font-family: inherit;
+    color: var(--eureka-text, #293241);
+    background-color: var(--eureka-bg, #fff);
+    border: 1px solid var(--eureka-outline, #b8b8b8);
+    border-radius: 10px;
+    outline: none;
+}
+
+.input::placeholder {
+    color: var(--eureka-text, #293241);
+    opacity: 0.5;
+}
+
+.input:hover:not(:disabled):not(:read-only) {
+    border-color: var(--eureka-primary, #3d5a7f);
+}
+
+.input:focus:not(:read-only) {
+    border-color: var(--eureka-primary, #3d5a7f);
+    border-width: 2px;
+    padding: 5px 11px;
+}
+
+.input:disabled {
+    opacity: 0.5;
+}
+
+.inputError {
+    border-color: var(--eureka-error, #e53935);
+}
+
+.positioner {
+    z-index: 1400;
+    width: var(--anchor-width);
+}
+
+.popup {
+    box-sizing: border-box;
+    max-height: 320px;
+    overflow-y: auto;
+    padding: 4px;
+    background-color: var(--eureka-bg, #fff);
+    border: 1px solid var(--eureka-outline, #b8b8b8);
+    border-radius: 10px;
+    box-shadow: 0 4px 16px rgb(0 0 0 / 12%);
+}
+
+.list {
+    display: flex;
+    flex-direction: column;
+}
+
+.status {
+    padding: 10px 12px;
+    font-size: 0.875rem;
+    color: var(--eureka-text, #666);
+    opacity: 0.7;
+}
+
+.item {
+    display: flex;
+    flex-direction: column;
+    gap: 2px;
+    padding: 8px 12px;
+    border-radius: 8px;
+    cursor: pointer;
+}
+
+.item[data-highlighted],
+.item:hover {
+    background-color: var(--eureka-primary, #3d5a7f);
+    color: #fff;
+}
+
+.optionLabel {
+    font-size: 0.9375rem;
+}
+
+.optionDescription {
+    font-size: 0.8125rem;
+    opacity: 0.7;
+}

package/dist/Shared/ErkAddressAutocomplete/googlePlaces.d.ts

@@ -0,0 +1,29 @@
+import { LocationAddressDetail, LocationStepValue } from '../../@Types/LocationFormStep';
+/** Asegura el script cargado y las clases de Places listas. Idempotente. */
+export declare function loadPlaces(apiKey: string): Promise<void>;
+/** Token de sesión nuevo (mejora el billing/relevancia de Google). */
+export declare function newSessionToken(): any;
+/** Reverse-geocoding para el modo GPS: coordenadas → dirección estructurada. */
+export declare function reverseGeocode(apiKey: string, lat: number, lng: number): Promise<{
+    address?: string;
+    addressDetail: LocationAddressDetail;
+}>;
+export interface AddressPrediction {
+    placeId: string;
+    label: string;
+    description: string;
+    toPlace: () => any;
+}
+export interface FetchSuggestionsOptions {
+    sessionToken?: any;
+    /** ISO-2, ej. ['co'] */
+    regionCodes?: string[];
+}
+export declare function fetchAddressSuggestions(input: string, options?: FetchSuggestionsOptions): Promise<AddressPrediction[]>;
+/**
+ * Descompone los `addressComponents` de un Place en el shape estructurado del step.
+ * Acepta el formato nuevo (`longText`/`shortText`) y el legacy (`long_name`/`short_name`).
+ */
+export declare function parseAddressComponents(components: any[] | null | undefined): LocationAddressDetail;
+/** Resuelve una predicción a un `LocationStepValue` completo (fetchFields + parse). */
+export declare function resolvePrediction(prediction: AddressPrediction): Promise<LocationStepValue>;