flysoft-react-ui 0.5.3 → 1.0.1

package/AI_CONTEXT.md

@@ -0,0 +1,84 @@
+# Flysoft React UI - AI Context & Documentation
+
+This document serves as the source of truth for AI models (Gemini, Claude, GPT, etc.) when generating code that consumes the `flysoft-react-ui` library.
+
+## Library Philosophy
+`flysoft-react-ui` is a React component library built with TypeScript. It emphasizes a consistent look and feel, ease of use, and "premium" aesthetics out of the box.
+
+## 🚨 Critical Rules for AI
+1. **Top-Level Imports Only**: Always import components from the root package `flysoft-react-ui`.
+   - **CORRECT**: `import { Button, Card } from 'flysoft-react-ui';`
+   - **INCORRECT**: `import { Button } from 'flysoft-react-ui/components/Button';`
+2. **TypeScript First**: Use the exported types (e.g., `ButtonProps`, `DataTableColumn`) to ensure type safety.
+3. **No Direct Style Imports**: Do not import CSS files from the library (like `flysoft-react-ui/dist/index.css`) in components. This is handled at the app root.
+
+## Component Categorization
+
+### 1. Layouts (Priority for Page Structure)
+- **AppLayout**: The main wrapper for applications.
+  - **Props**: `navbar` (NavbarInterface), `leftDrawer` (LeftDrawerInterface), `children`.
+  - **Usage**: Use this as the root component for your page routes.
+- **DashboardLayout**: Specialized layout for dashboard views with statistics.
+- **SidebarLayout**: Layout with a persistent sidebar.
+
+### 2. Form Controls
+- **Button / LinkButton**: Standard buttons. Supports `variant` ('primary' | 'secondary' | 'danger' | 'ghost') and `icon`.
+- **Input**: Text inputs.
+- **AutocompleteInput**: Searchable dropdown. Critical for foreign key selection.
+- **DateInput / DatePicker**: Date handling.
+- **Checkbox / RadioButtonGroup**: Boolean and option selection.
+- **ThemeSwitcher**: Toggle between light/dark modes.
+
+### 3. Data Display & Containers
+- **DataTable<T>**: High-performance table.
+  - **Props**: `columns` (array of definitions), `rows` (data), `isLoading`.
+- **Card**: Generic container with shadow and rounded corners.
+- **DataField**: Displays a Label + Value pair, useful for detail views.
+- **Accordion**: Collapsible content sections.
+- **Collection**: Renders a list of items using a render prop or component.
+- **TabsGroup / TabPanel**: Tabbed interfaces.
+
+### 4. Utilities & Feedback
+- **Dialog**: Modal windows for confirmation or complex forms.
+- **Snackbar**: Toast notifications. Requires `SnackbarContainer` at the app root.
+- **Loader**: Visual loading indicator.
+- **Badge / Avatar**: status indicators and user images.
+
+## Common Patterns
+
+### Basic Page Structure
+```tsx
+import { AppLayout, Card, Button } from 'flysoft-react-ui';
+
+export default function Page() {
+  return (
+    <AppLayout
+      navbar={{ title: "My Page" }}
+    >
+      <div className="p-4 space-y-4">
+        <Card>
+          <h2>Content</h2>
+          <Button variant="primary" onClick={() => {}}>Action</Button>
+        </Card>
+      </div>
+    </AppLayout>
+  );
+}
+```
+
+### Data Table Usage
+```tsx
+import { DataTable, DataTableColumn } from 'flysoft-react-ui';
+
+interface User { id: number; name: string; }
+
+const columns: DataTableColumn<User>[] = [
+  { header: 'ID', accessorKey: 'id' },
+  { header: 'Name', accessorKey: 'name' },
+];
+
+<DataTable columns={columns} rows={users} />
+```
+
+## Icons
+The library is agnostic but pairs well with `lucide-react`. Pass icons as ReactNodes to props like `icon`, `startIcon`, or `endIcon`.

package/dist/components/form-controls/AutocompleteInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AutocompleteInput.d.ts","sourceRoot":"","sources":["../../../src/components/form-controls/AutocompleteInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAI1C,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC9B,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,sBAAsB,CAAC,CAAC,GAAG,kBAAkB,EAAE,CAAC,GAAG,MAAM,CACxE,SAAQ,IAAI,CAAC,UAAU,EAAE,UAAU,GAAG,OAAO,GAAG,KAAK,CAAC;IACtD,OAAO,EAAE,CAAC,EAAE,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,QAAQ,CAAC,EACL,KAAK,CAAC,kBAAkB,CAAC,gBAAgB,CAAC,GAC1C,CAAC,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC,CAAC;IAC9B;;OAEG;IACH,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;IAC/C,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;OAEG;IACH,cAAc,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,CAAC;IACrC;;OAEG;IACH,cAAc,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,CAAC,CAAC;IAChC;;OAEG;IACH,oBAAoB,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC;IAChE;;OAEG;IACH,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC;IAC5C;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAkqBD,eAAO,MAAM,iBAAiB,EAA6B,CACzD,CAAC,GAAG,kBAAkB,EACtB,CAAC,GAAG,MAAM,EAEV,KAAK,EAAE,sBAAsB,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG;IACpC,GAAG,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,gBAAgB,CAAC,CAAC;CAC5C,KACE,KAAK,CAAC,YAAY,CAAC"}
+{"version":3,"file":"AutocompleteInput.d.ts","sourceRoot":"","sources":["../../../src/components/form-controls/AutocompleteInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAI1C,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC9B,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,sBAAsB,CAAC,CAAC,GAAG,kBAAkB,EAAE,CAAC,GAAG,MAAM,CACxE,SAAQ,IAAI,CAAC,UAAU,EAAE,UAAU,GAAG,OAAO,GAAG,KAAK,CAAC;IACtD,OAAO,EAAE,CAAC,EAAE,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,QAAQ,CAAC,EACL,KAAK,CAAC,kBAAkB,CAAC,gBAAgB,CAAC,GAC1C,CAAC,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC,CAAC;IAC9B;;OAEG;IACH,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;IAC/C,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;OAEG;IACH,cAAc,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,CAAC;IACrC;;OAEG;IACH,cAAc,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,CAAC,CAAC;IAChC;;OAEG;IACH,oBAAoB,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC;IAChE;;OAEG;IACH,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC;IAC5C;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAguBD,eAAO,MAAM,iBAAiB,EAA6B,CACzD,CAAC,GAAG,kBAAkB,EACtB,CAAC,GAAG,MAAM,EAEV,KAAK,EAAE,sBAAsB,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG;IACpC,GAAG,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,gBAAgB,CAAC,CAAC;CAC5C,KACE,KAAK,CAAC,YAAY,CAAC"}

package/dist/components/form-controls/AutocompleteInput.js

@@ -1,6 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import React from "react";
 import { createPortal } from "react-dom";
+import { useFormContext } from "react-hook-form";
 import { Input } from "./Input";
 import { normalizeIconClass } from "../utils/iconUtils";
 const AutocompleteInputInner = React.forwardRef(({ options, value, onChange, onSelectOption, noResultsText = "Sin resultados", className = "", getOptionLabel, getOptionValue, getOptionDescription, renderOption, readOnly = false, ...inputProps }, ref) => {
@@ -12,6 +13,7 @@ const AutocompleteInputInner = React.forwardRef(({ options, value, onChange, onS
     const containerRef = React.useRef(null);
     const dropdownRef = React.useRef(null);
     const inputRef = React.useRef(null);
+    const hiddenInputRef = React.useRef(null);
     const justClearedRef = React.useRef(false);
     // Detectar si estamos en modo register: si viene 'name' de register, estamos en modo register
     // register siempre pasa 'name', 'onChange', 'onBlur', y 'ref'
@@ -19,6 +21,16 @@ const AutocompleteInputInner = React.forwardRef(({ options, value, onChange, onS
         // Si viene 'name' en inputProps, es porque viene de register
         return "name" in inputProps && inputProps.name !== undefined;
     }, [inputProps]);
+    const fieldName = isRegisterMode && "name" in inputProps
+        ? inputProps.name
+        : undefined;
+    // Obtener setValue del contexto del formulario
+    // Para usar con register, el formulario debe estar dentro de FormProvider
+    // useFormContext debe llamarse incondicionalmente (requisito de React Hooks)
+    // Si no hay FormProvider y se usa en modo register, useFormContext lanzará un error
+    // Para usar sin FormProvider, usar Controller en lugar de register
+    const formContext = useFormContext();
+    const setValue = formContext?.setValue;
     const inputValue = isRegisterMode
         ? displayValue
         : value !== undefined
@@ -54,23 +66,27 @@ const AutocompleteInputInner = React.forwardRef(({ options, value, onChange, onS
     }, [inputValue, options, labelGetter, valueGetter]);
     // Función helper para sincronizar displayValue con el valor del formulario
     const syncDisplayValue = React.useCallback(() => {
-        if (isRegisterMode && inputRef.current) {
-            const formValue = inputRef.current.value;
-            // Si el valor del formulario coincide con algún getOptionValue, mostrar su label
-            const matchingOption = options.find((option) => String(valueGetter(option)) === String(formValue));
-            if (matchingOption) {
-                const label = labelGetter(matchingOption);
-                setDisplayValue(label);
-                return true; // Indica que se encontró y sincronizó un valor
-            }
-            else if (formValue) {
-                // Si hay un valor pero no coincide, mostrarlo tal cual
-                setDisplayValue(formValue);
-                return true;
-            }
-            else {
-                setDisplayValue("");
-                return false; // No hay valor aún
+        if (isRegisterMode) {
+            // En modo register, usamos el hiddenInputRef si existe, sino el inputRef (legacy/fallback)
+            const targetInput = hiddenInputRef.current || inputRef.current;
+            if (targetInput) {
+                const formValue = targetInput.value;
+                // Si el valor del formulario coincide con algún getOptionValue, mostrar su label
+                const matchingOption = options.find((option) => String(valueGetter(option)) === String(formValue));
+                if (matchingOption) {
+                    const label = labelGetter(matchingOption);
+                    setDisplayValue(label);
+                    return true; // Indica que se encontró y sincronizó un valor
+                }
+                else if (formValue) {
+                    // Si hay un valor pero no coincide, mostrarlo tal cual (o buscar por label si fuera el caso)
+                    setDisplayValue(formValue);
+                    return true;
+                }
+                else {
+                    setDisplayValue("");
+                    return false; // No hay valor aún
+                }
             }
         }
         return false;
@@ -83,8 +99,9 @@ const AutocompleteInputInner = React.forwardRef(({ options, value, onChange, onS
             const maxAttempts = 50; // Intentar durante ~5 segundos (50 * 100ms)
             // Función que intenta sincronizar y retorna true si encontró un valor
             const trySync = () => {
-                if (inputRef.current) {
-                    const formValue = inputRef.current.value;
+                const targetInput = hiddenInputRef.current || inputRef.current;
+                if (targetInput) {
+                    const formValue = targetInput.value;
                     if (formValue) {
                         // Hay un valor, intentar sincronizar
                         const matchingOption = options.find((option) => String(valueGetter(option)) === String(formValue));
@@ -126,30 +143,36 @@ const AutocompleteInputInner = React.forwardRef(({ options, value, onChange, onS
             };
         }
     }, [isRegisterMode, options, valueGetter, labelGetter]);
-    // También escuchar cambios en el input nativo para sincronizar cuando cambie
+    // También escuchar cambios en el input (hidden o visible) para sincronizar cuando cambie
     React.useEffect(() => {
-        if (isRegisterMode && inputRef.current) {
-            const input = inputRef.current;
-            // Función para sincronizar cuando el input cambia
-            const handleInputSync = () => {
-                syncDisplayValue();
-            };
-            // Escuchar eventos de input y change
-            input.addEventListener("input", handleInputSync);
-            input.addEventListener("change", handleInputSync);
-            // También usar MutationObserver para detectar cambios en el atributo value
-            const observer = new MutationObserver(() => {
-                syncDisplayValue();
-            });
-            observer.observe(input, {
-                attributes: true,
-                attributeFilter: ["value"],
-            });
-            return () => {
-                input.removeEventListener("input", handleInputSync);
-                input.removeEventListener("change", handleInputSync);
-                observer.disconnect();
-            };
+        if (isRegisterMode) {
+            // Observamos el hiddenInput si estamos en register mode y existe, o el input normal
+            const targetElement = hiddenInputRef.current || inputRef.current;
+            if (targetElement) {
+                // Función para sincronizar cuando el input cambia
+                const handleInputSync = () => {
+                    // Solo sincronizar si es el hidden input o si no tenemos hidden input
+                    if (targetElement === hiddenInputRef.current) {
+                        syncDisplayValue();
+                    }
+                };
+                // Escuchar eventos de input y change (aunque en hidden input no suelen dispararse eventos de usuario)
+                targetElement.addEventListener("input", handleInputSync);
+                targetElement.addEventListener("change", handleInputSync);
+                // También usar MutationObserver para detectar cambios en el atributo value (más fiable para hidden inputs cambiados por JS)
+                const observer = new MutationObserver(() => {
+                    syncDisplayValue();
+                });
+                observer.observe(targetElement, {
+                    attributes: true,
+                    attributeFilter: ["value"],
+                });
+                return () => {
+                    targetElement.removeEventListener("input", handleInputSync);
+                    targetElement.removeEventListener("change", handleInputSync);
+                    observer.disconnect();
+                };
+            }
         }
     }, [isRegisterMode, syncDisplayValue]);
     const handleChange = (event) => {
@@ -179,53 +202,56 @@ const AutocompleteInputInner = React.forwardRef(({ options, value, onChange, onS
         const selectedValue = valueGetter(option);
         const valueString = String(selectedValue ?? "");
         if (isRegisterMode) {
-            // En modo register:
-            // 1. Actualizar el input nativo con el valor (para que react-hook-form lo capture)
-            // 2. Actualizar displayValue con el label (para mostrarlo visualmente)
-            if (inputRef.current) {
-                const nativeInput = inputRef.current;
-                // Actualizar el valor del input directamente usando el setter nativo
-                // Esto evita que React sobrescriba el valor inmediatamente
-                const nativeInputValueSetter = Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype, "value")?.set;
-                if (nativeInputValueSetter) {
-                    nativeInputValueSetter.call(nativeInput, valueString);
-                }
-                else {
-                    // Fallback si el setter no está disponible
-                    nativeInput.value = valueString;
+            // En modo register, setear el valor usando setValue o actualizando el input nativo (hidden)
+            if (setValue && fieldName) {
+                setValue(fieldName, selectedValue, {
+                    shouldValidate: true,
+                    shouldDirty: true,
+                });
+                // Actualizar el input hidden con el ID
+                if (hiddenInputRef.current) {
+                    hiddenInputRef.current.value = valueString;
                 }
-                // IMPORTANTE: Llamar al onChange de register DESPUÉS de actualizar el input
-                // El evento debe tener el input nativo como target con el valor ya actualizado
-                if (onChange) {
-                    // Crear un evento que tenga el input nativo como target
-                    // react-hook-form leerá el valor desde event.target.value
-                    const changeEvent = {
-                        target: nativeInput,
-                        currentTarget: nativeInput,
-                    };
-                    onChange(changeEvent);
+                // Actualizar displayValue con el label para mostrarlo visualmente en el input visible
+                setDisplayValue(label);
+            }
+            else {
+                // Fallback si no hay setValue (raro en registerMode) o para inputs manuales
+                const targetInput = hiddenInputRef.current || inputRef.current;
+                if (targetInput) {
+                    const nativeInput = targetInput;
+                    const nativeInputValueSetter = Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype, "value")?.set;
+                    if (nativeInputValueSetter) {
+                        nativeInputValueSetter.call(nativeInput, valueString);
+                    }
+                    else {
+                        nativeInput.value = valueString;
+                    }
+                    // Disparar eventos en el input que tiene el ref de register
+                    if (onChange) {
+                        const changeEvent = {
+                            target: nativeInput,
+                            currentTarget: nativeInput,
+                        }; // Cast agresivo necesario
+                        onChange(changeEvent);
+                    }
+                    const inputEvent = new Event("input", {
+                        bubbles: true,
+                        cancelable: true,
+                    });
+                    nativeInput.dispatchEvent(inputEvent);
+                    const changeEventNative = new Event("change", {
+                        bubbles: true,
+                        cancelable: true,
+                    });
+                    nativeInput.dispatchEvent(changeEventNative);
                 }
-                // También disparar eventos nativos para asegurar que todo esté sincronizado
-                // Estos eventos son importantes para la validación y el estado del formulario
-                const inputEvent = new Event("input", {
-                    bubbles: true,
-                    cancelable: true,
-                });
-                nativeInput.dispatchEvent(inputEvent);
-                const changeEventNative = new Event("change", {
-                    bubbles: true,
-                    cancelable: true,
-                });
-                nativeInput.dispatchEvent(changeEventNative);
+                // Y actualizamos visualmente
+                setDisplayValue(label);
             }
-            // Actualizar el displayValue para mostrar el label
-            setDisplayValue(label);
         }
         else {
             // Modo API personalizada - comportamiento original
-            if (value === undefined) {
-                setInternalValue(label);
-            }
             // Pasar el valor devuelto por getOptionValue, no el label
             if (onChange) {
                 onChange(valueString);
@@ -347,11 +373,15 @@ const AutocompleteInputInner = React.forwardRef(({ options, value, onChange, onS
     // Detectar si hay un valor seleccionado
     // Un valor está seleccionado si el value coincide con el getOptionValue de alguna opción
     const hasSelectedValue = React.useMemo(() => {
-        if (isRegisterMode && inputRef.current) {
-            const formValue = inputRef.current.value;
-            if (!formValue)
-                return false;
-            return options.some((option) => String(valueGetter(option)) === String(formValue));
+        if (isRegisterMode) {
+            const targetInput = hiddenInputRef.current || inputRef.current;
+            if (targetInput) {
+                const formValue = targetInput.value;
+                if (!formValue)
+                    return false;
+                return options.some((option) => String(valueGetter(option)) === String(formValue));
+            }
+            return false;
         }
         if (value === undefined || value === null || value === "")
             return false;
@@ -367,9 +397,10 @@ const AutocompleteInputInner = React.forwardRef(({ options, value, onChange, onS
         // Marcar que acabamos de limpiar para prevenir que onFocus abra el diálogo
         justClearedRef.current = true;
         if (isRegisterMode) {
-            // En modo register, limpiar el input nativo y disparar eventos
-            if (inputRef.current) {
-                const nativeInput = inputRef.current;
+            // En modo register, limpiar el input nativo (hidden) y disparar eventos
+            const targetInput = hiddenInputRef.current || inputRef.current;
+            if (targetInput) {
+                const nativeInput = targetInput;
                 const setter = Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype, "value")?.set;
                 setter?.call(nativeInput, "");
                 // Disparar eventos para que react-hook-form lo capture
@@ -377,17 +408,17 @@ const AutocompleteInputInner = React.forwardRef(({ options, value, onChange, onS
                 nativeInput.dispatchEvent(inputEvent);
                 const changeEvent = new Event("change", { bubbles: true });
                 nativeInput.dispatchEvent(changeEvent);
+                // Llamar al onChange de register
+                if (onChange) {
+                    const changeEventReact = {
+                        target: nativeInput,
+                        currentTarget: nativeInput,
+                    };
+                    onChange(changeEventReact);
+                }
             }
             // Limpiar el displayValue
             setDisplayValue("");
-            // Llamar al onChange de register
-            if (onChange && inputRef.current) {
-                const changeEvent = {
-                    target: inputRef.current,
-                    currentTarget: inputRef.current,
-                };
-                onChange(changeEvent);
-            }
         }
         else {
             // Modo API personalizada
@@ -421,39 +452,53 @@ const AutocompleteInputInner = React.forwardRef(({ options, value, onChange, onS
         : hasSelectedValue
             ? handleClear
             : inputProps.onIconClick;
-    // Combinar refs: el ref del componente y el ref interno
-    const combinedRef = React.useCallback((node) => {
-        inputRef.current = node;
-        if (typeof ref === "function") {
-            ref(node);
-        }
-        else if (ref) {
-            ref.current = node;
-        }
-        // Cuando el ref se establece en modo register, sincronizar el displayValue
-        // Esto es importante para valores por defecto que vienen del formulario
-        if (isRegisterMode && node) {
-            // Intentar múltiples veces con diferentes delays
-            // react-hook-form puede establecer el valor en diferentes momentos
-            [0, 10, 50, 100, 200, 500].forEach((delay) => {
-                setTimeout(() => {
-                    if (node && inputRef.current === node) {
-                        const formValue = node.value;
-                        if (formValue) {
-                            const matchingOption = options.find((option) => String(valueGetter(option)) === String(formValue));
-                            if (matchingOption) {
-                                setDisplayValue(labelGetter(matchingOption));
-                            }
-                            else {
-                                setDisplayValue(formValue);
+    // Refs separados: uno para el visible y otro para el hidden (registrado)
+    const setHiddenRef = React.useCallback((node) => {
+        hiddenInputRef.current = node;
+        // Solo pasar el ref externo al hidden input en modo register
+        if (isRegisterMode) {
+            if (typeof ref === "function") {
+                ref(node);
+            }
+            else if (ref) {
+                ref.current = node;
+            }
+            // Sincronización inicial cuando el ref se monta
+            if (node) {
+                [0, 10, 50, 100, 200, 500].forEach((delay) => {
+                    setTimeout(() => {
+                        if (node && hiddenInputRef.current === node) {
+                            const formValue = node.value;
+                            if (formValue) {
+                                const matchingOption = options.find((option) => String(valueGetter(option)) === String(formValue));
+                                if (matchingOption) {
+                                    setDisplayValue(labelGetter(matchingOption));
+                                }
+                                else {
+                                    setDisplayValue(formValue);
+                                }
                             }
                         }
-                    }
-                }, delay);
-            });
+                    }, delay);
+                });
+            }
         }
     }, [ref, isRegisterMode, options, valueGetter, labelGetter]);
-    return (_jsxs("div", { ref: containerRef, className: "relative w-full", children: [_jsx(Input, { ...inputProps, ref: combinedRef, value: inputValue, onChange: handleChange, onFocus: () => {
+    const setVisibleRef = React.useCallback((node) => {
+        inputRef.current = node;
+        // En modo NO register, pasamos el ref al input visible
+        if (!isRegisterMode) {
+            if (typeof ref === "function") {
+                ref(node);
+            }
+            else if (ref) {
+                ref.current = node;
+            }
+        }
+    }, [ref, isRegisterMode]);
+    // Separar propiedades para input visible y hidden
+    const { name: nameProp, ...visibleInputProps } = inputProps;
+    return (_jsxs("div", { ref: containerRef, className: "relative w-full", children: [isRegisterMode && (_jsx("input", { type: "hidden", name: nameProp, ref: setHiddenRef, defaultValue: value })), _jsx(Input, { ...visibleInputProps, name: isRegisterMode ? undefined : nameProp, ref: setVisibleRef, value: inputValue, onChange: handleChange, onFocus: () => {
                     if (!readOnly && !justClearedRef.current) {
                         setIsOpen(true);
                     }
@@ -468,7 +513,7 @@ const AutocompleteInputInner = React.forwardRef(({ options, value, onChange, onS
                     dropdownPosition &&
                     isMounted &&
                     bodyElement &&
-                    createPortal(_jsx("div", { ref: dropdownRef, className: "fixed z-[2001] min-w-full w-max rounded-md border border-[var(--color-border-default)] \r\n          bg-[var(--color-bg-default)] shadow-[var(--shadow-lg)] max-h-60 overflow-auto", style: {
+                    createPortal(_jsx("div", { ref: dropdownRef, className: "fixed z-[2001] min-w-full w-max rounded-md border border-[var(--color-border-default)] \n          bg-[var(--color-bg-default)] shadow-[var(--shadow-lg)] max-h-60 overflow-auto", style: {
                             top: `${dropdownPosition.top}px`,
                             left: `${dropdownPosition.left}px`,
                             minWidth: `${dropdownPosition.width}px`,
@@ -476,7 +521,7 @@ const AutocompleteInputInner = React.forwardRef(({ options, value, onChange, onS
                                 const label = labelGetter(option);
                                 const description = descriptionGetter(option);
                                 const anyOption = option;
-                                return (_jsx("li", { className: `px-3 py-2 cursor-pointer flex items-start gap-2 text-sm
+                                return (_jsx("li", { className: `px-3 py-2 cursor-pointer flex items-start gap-2 text-sm
                       ${index === highlightedIndex
                                         ? "bg-[var(--color-primary-soft)] text-[var(--color-primary)]"
                                         : "text-[var(--color-text-primary)] hover:bg-[var(--color-bg-secondary)]"}`, onMouseDown: (event) => {

package/dist/components/form-controls/SearchSelectInput-OLD.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SearchSelectInput-OLD.d.ts","sourceRoot":"","sources":["../../../src/components/form-controls/SearchSelectInput-OLD.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAG1C,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAIxD,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC9B,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,sBAAsB,CAAC,CAAC,GAAG,kBAAkB,EAAE,CAAC,GAAG,MAAM,CACxE,SAAQ,IAAI,CAAC,UAAU,EAAE,UAAU,GAAG,OAAO,GAAG,KAAK,CAAC;IACtD;;;OAGG;IACH,KAAK,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,MAAM,CAAC;IACvB;;;;OAIG;IACH,QAAQ,CAAC,EACL,CAAC,CAAC,KAAK,EAAE,CAAC,GAAG,CAAC,KAAK,IAAI,CAAC,GACxB,KAAK,CAAC,kBAAkB,CAAC,gBAAgB,CAAC,CAAC;IAC/C;;OAEG;IACH,iBAAiB,EAAE,CACjB,IAAI,EAAE,MAAM,KACT,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,mBAAmB,CAAC,CAAC,CAAC,CAAC,CAAC;IAChD;;;;OAIG;IACH,uBAAuB,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,OAAO,CAAC,CAAC,GAAG,SAAS,CAAC,CAAC;IAC9D;;OAEG;IACH,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;IAC/C;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,oBAAoB,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACxC;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;OAEG;IACH,cAAc,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,CAAC;IACrC;;OAEG;IACH,cAAc,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,CAAC,CAAC;IAChC;;OAEG;IACH,oBAAoB,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC;IAChE;;OAEG;IACH,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC;CAC7C;AA6sCD,eAAO,MAAM,iBAAiB,EAAiC,CAC7D,CAAC,GAAG,kBAAkB,EACtB,CAAC,GAAG,MAAM,EAEV,KAAK,EAAE,sBAAsB,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG;IACpC,GAAG,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,gBAAgB,CAAC,CAAC;CAC5C,KACE,KAAK,CAAC,YAAY,CAAC"}
+{"version":3,"file":"SearchSelectInput-OLD.d.ts","sourceRoot":"","sources":["../../../src/components/form-controls/SearchSelectInput-OLD.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAG1C,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAIxD,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC9B,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,sBAAsB,CAAC,CAAC,GAAG,kBAAkB,EAAE,CAAC,GAAG,MAAM,CACxE,SAAQ,IAAI,CAAC,UAAU,EAAE,UAAU,GAAG,OAAO,GAAG,KAAK,CAAC;IACtD;;;OAGG;IACH,KAAK,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,MAAM,CAAC;IACvB;;;;OAIG;IACH,QAAQ,CAAC,EACP,CAAC,CAAC,KAAK,EAAE,CAAC,GAAG,CAAC,KAAK,IAAI,CAAC,GACxB,KAAK,CAAC,kBAAkB,CAAC,gBAAgB,CAAC,CAAC;IAC7C;;OAEG;IACH,iBAAiB,EAAE,CACjB,IAAI,EAAE,MAAM,KACT,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,mBAAmB,CAAC,CAAC,CAAC,CAAC,CAAC;IAChD;;;;OAIG;IACH,uBAAuB,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,OAAO,CAAC,CAAC,GAAG,SAAS,CAAC,CAAC;IAC9D;;OAEG;IACH,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;IAC/C;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,oBAAoB,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACxC;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;OAEG;IACH,cAAc,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,CAAC;IACrC;;OAEG;IACH,cAAc,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,CAAC,CAAC;IAChC;;OAEG;IACH,oBAAoB,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC;IAChE;;OAEG;IACH,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC;CAC7C;AA6sCD,eAAO,MAAM,iBAAiB,EAAiC,CAC7D,CAAC,GAAG,kBAAkB,EACtB,CAAC,GAAG,MAAM,EAEV,KAAK,EAAE,sBAAsB,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG;IACpC,GAAG,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,gBAAgB,CAAC,CAAC;CAC5C,KACE,KAAK,CAAC,YAAY,CAAC"}

package/dist/components/form-controls/SearchSelectInput-OLD.js

@@ -945,7 +945,7 @@ function SearchSelectInputInner({ value, onChange, onSearchPromiseFn, onSingleSe
                             restInputProps.onFocus(e);
                         }
                         handleInputFocus(e);
-                    }, onBlur: registerOnBlur, onKeyDown: handleKeyDown, size: size, icon: displayIcon, iconPosition: displayIconPosition, onIconClick: displayOnIconClick, readOnly: true }) }), _jsx(Dialog, { isOpen: isDialogOpen, title: dialogTitle, dialogBody: _jsxs("div", { className: "space-y-2", children: [_jsx(Input, { value: dialogSearchText, onChange: (e) => setDialogSearchText(e.target.value), onKeyDown: (e) => {
+                    }, onBlur: registerOnBlur, onKeyDown: handleKeyDown, size: size, icon: displayIcon, iconPosition: displayIconPosition, onIconClick: displayOnIconClick, readOnly: true }) }), _jsx(Dialog, { isOpen: isDialogOpen, title: dialogTitle, children: _jsxs("div", { className: "space-y-2", children: [_jsx(Input, { value: dialogSearchText, onChange: (e) => setDialogSearchText(e.target.value), onKeyDown: (e) => {
                                 if (e.key === "Enter") {
                                     e.preventDefault();
                                     handleDialogSearch();
@@ -956,7 +956,7 @@ function SearchSelectInputInner({ value, onChange, onSearchPromiseFn, onSingleSe
                                 const anyOption = option;
                                 return (_jsx("li", { className: "px-3 py-2 cursor-pointer rounded-md flex items-start gap-2 text-sm\r\n                        text-[var(--color-text-primary)] hover:bg-[var(--color-bg-secondary)] transition-colors", onClick: () => handleSelect(option), children: renderOption ? (renderOption(option)) : (_jsxs(_Fragment, { children: [anyOption.icon && (_jsx("i", { className: `${normalizeIconClass(anyOption.icon)} mt-0.5 text-[var(--color-text-muted)]` })), _jsxs("div", { className: "flex flex-col flex-1", children: [_jsx("span", { className: "font-[var(--font-default)]", children: label }), description !== undefined &&
                                                         description !== null && (_jsx("span", { className: "text-xs text-[var(--color-text-secondary)]", children: description }))] })] })) }, String(valueGetter(option) ?? label ?? index)));
-                            }) })) : hasSearched ? (_jsx("div", { className: "px-3 py-8 text-center text-sm text-[var(--color-text-secondary)]", children: noResultsText })) : null] }), dialogActions: _jsx(Button, { variant: "outline", onClick: () => setIsDialogOpen(false), children: "Cerrar" }), onClose: () => setIsDialogOpen(false), closeOnOverlayClick: true })] }));
+                            }) })) : hasSearched ? (_jsx("div", { className: "px-3 py-8 text-center text-sm text-[var(--color-text-secondary)]", children: noResultsText })) : null] }), footer: _jsx(Button, { variant: "outline", onClick: () => setIsDialogOpen(false), children: "Cerrar" }), onClose: () => setIsDialogOpen(false), closeOnOverlayClick: true })] }));
 }
 const SearchSelectInputForwarded = React.forwardRef(SearchSelectInputInner);
 SearchSelectInputForwarded.displayName = "SearchSelectInput";

package/dist/components/form-controls/SearchSelectInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SearchSelectInput.d.ts","sourceRoot":"","sources":["../../../src/components/form-controls/SearchSelectInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAMN,MAAM,OAAO,CAAC;AAEf,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AACjD,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAKxD,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC9B,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AACD,MAAM,WAAW,sBAAsB,CAAC,CAAC,GAAG,kBAAkB,EAAE,CAAC,GAAG,MAAM,CACxE,SAAQ,IAAI,CAAC,UAAU,EAAE,UAAU,GAAG,OAAO,GAAG,KAAK,CAAC;IACtD,KAAK,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,MAAM,CAAC;IACvB;;;;OAIG;IACH,QAAQ,CAAC,EACL,CAAC,CAAC,KAAK,EAAE,CAAC,GAAG,CAAC,KAAK,IAAI,CAAC,GACxB,KAAK,CAAC,kBAAkB,CAAC,gBAAgB,CAAC,CAAC;IAC/C;;OAEG;IACH,iBAAiB,EAAE,CACjB,IAAI,EAAE,MAAM,KACT,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,mBAAmB,CAAC,CAAC,CAAC,CAAC,CAAC;IAChD;;;;OAIG;IACH,uBAAuB,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,OAAO,CAAC,CAAC,GAAG,SAAS,CAAC,CAAC;IAC9D;;OAEG;IACH,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;IAC/C;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAChC;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;OAEG;IACH,cAAc,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,CAAC;IACrC;;OAEG;IACH,cAAc,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,CAAC,CAAC;IAChC;;OAEG;IACH,oBAAoB,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC;IAChE;;OAEG;IACH,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC;IAC5C;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAwfD,eAAO,MAAM,iBAAiB,EAA6B,CACzD,CAAC,GAAG,kBAAkB,EACtB,CAAC,GAAG,MAAM,EAEV,KAAK,EAAE,sBAAsB,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG;IACpC,GAAG,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,gBAAgB,CAAC,CAAC;CAC5C,KACE,KAAK,CAAC,YAAY,CAAC"}
+{"version":3,"file":"SearchSelectInput.d.ts","sourceRoot":"","sources":["../../../src/components/form-controls/SearchSelectInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAMN,MAAM,OAAO,CAAC;AAEf,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AACjD,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAKxD,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC9B,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AACD,MAAM,WAAW,sBAAsB,CAAC,CAAC,GAAG,kBAAkB,EAAE,CAAC,GAAG,MAAM,CACxE,SAAQ,IAAI,CAAC,UAAU,EAAE,UAAU,GAAG,OAAO,GAAG,KAAK,CAAC;IACtD,KAAK,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,MAAM,CAAC;IACvB;;;;OAIG;IACH,QAAQ,CAAC,EACP,CAAC,CAAC,KAAK,EAAE,CAAC,GAAG,CAAC,KAAK,IAAI,CAAC,GACxB,KAAK,CAAC,kBAAkB,CAAC,gBAAgB,CAAC,CAAC;IAC7C;;OAEG;IACH,iBAAiB,EAAE,CACjB,IAAI,EAAE,MAAM,KACT,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,mBAAmB,CAAC,CAAC,CAAC,CAAC,CAAC;IAChD;;;;OAIG;IACH,uBAAuB,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,OAAO,CAAC,CAAC,GAAG,SAAS,CAAC,CAAC;IAC9D;;OAEG;IACH,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;IAC/C;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAChC;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;OAEG;IACH,cAAc,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,CAAC;IACrC;;OAEG;IACH,cAAc,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,CAAC,CAAC;IAChC;;OAEG;IACH,oBAAoB,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC;IAChE;;OAEG;IACH,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC;IAC5C;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAyfD,eAAO,MAAM,iBAAiB,EAA6B,CACzD,CAAC,GAAG,kBAAkB,EACtB,CAAC,GAAG,MAAM,EAEV,KAAK,EAAE,sBAAsB,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG;IACpC,GAAG,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,gBAAgB,CAAC,CAAC;CAC5C,KACE,KAAK,CAAC,YAAY,CAAC"}

package/dist/components/form-controls/SearchSelectInput.js

@@ -329,7 +329,7 @@ const SearchSelectInputInner = React.forwardRef(function SearchSelectInput({ val
                     if (!readOnly && !justClearedRef.current) {
                         setIsDialogOpen(true);
                     }
-                }, icon: displayIcon, iconPosition: displayIconPosition, onIconClick: displayOnIconClick, readOnly: readOnly }), !readOnly && (_jsx(Dialog, { isOpen: isDialogOpen, title: dialogTitle, dialogBody: getDialogBody(), dialogActions: _jsx(Button, { variant: "outline", onClick: () => setIsDialogOpen(false), children: "Cerrar" }), onClose: () => setIsDialogOpen(false) }))] }));
+                }, icon: displayIcon, iconPosition: displayIconPosition, onIconClick: displayOnIconClick, readOnly: readOnly }), !readOnly && (_jsx(Dialog, { isOpen: isDialogOpen, title: dialogTitle, footer: _jsx(Button, { variant: "outline", onClick: () => setIsDialogOpen(false), children: "Cerrar" }), onClose: () => setIsDialogOpen(false), children: getDialogBody() }))] }));
 });
 SearchSelectInputInner.displayName = "SearchSelectInput";
 // Exportar con el cast genérico para permitir uso como <SearchSelectInput<T, K>>

package/dist/components/layout/AppLayout.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AppLayout.d.ts","sourceRoot":"","sources":["../../../src/components/layout/AppLayout.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAIhD,OAAO,KAAK,EACV,eAAe,EACf,mBAAmB,EACpB,MAAM,iCAAiC,CAAC;AAEzC,MAAM,WAAW,cAAc;IAC7B,MAAM,CAAC,EAAE,eAAe,CAAC;IACzB,UAAU,CAAC,EAAE,mBAAmB,CAAC;IACjC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAmd9C,CAAC"}
+{"version":3,"file":"AppLayout.d.ts","sourceRoot":"","sources":["../../../src/components/layout/AppLayout.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAIhD,OAAO,KAAK,EACV,eAAe,EACf,mBAAmB,EACpB,MAAM,iCAAiC,CAAC;AAEzC,MAAM,WAAW,cAAc;IAC7B,MAAM,CAAC,EAAE,eAAe,CAAC;IACzB,UAAU,CAAC,EAAE,mBAAmB,CAAC;IACjC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAgd9C,CAAC"}