ngx-dsxlibrary 2.21.69 → 2.21.70

package/fesm2022/ngx-dsxlibrary.mjs

@@ -32,9 +32,6 @@ import { Button, ButtonModule } from 'primeng/button';
 import moment from 'moment-timezone';
 import { ToastrService } from 'ngx-toastr';
 import Swal from 'sweetalert2';
-import { AutoComplete, AutoCompleteModule } from 'primeng/autocomplete';
-import * as i6 from 'primeng/floatlabel';
-import { FloatLabel, FloatLabelModule } from 'primeng/floatlabel';
 import { FileUpload, FileUploadModule } from 'primeng/fileupload';
 import { LottieComponent } from 'ngx-lottie';
 import { createTimeline } from 'animejs';
@@ -44,9 +41,12 @@ import * as i4 from 'primeng/menubar';
 import { MenubarModule } from 'primeng/menubar';
 import { JwtHelperService } from '@auth0/angular-jwt';
 import { CookieService } from 'ngx-cookie-service';
+import * as i6 from 'primeng/floatlabel';
+import { FloatLabelModule, FloatLabel } from 'primeng/floatlabel';
 import * as i7 from 'primeng/password';
 import { PasswordModule } from 'primeng/password';
 import { AccordionModule } from 'primeng/accordion';
+import { AutoCompleteModule, AutoComplete } from 'primeng/autocomplete';
 import { AutoFocusModule } from 'primeng/autofocus';
 import { AvatarGroupModule } from 'primeng/avatargroup';
 import { BadgeModule } from 'primeng/badge';
@@ -4900,162 +4900,6 @@ const ACTION_CONFIG = {
     },
 };
 
-class DsxAutocomplete {
-    // Inputs usando Señales
-    datasource = input.required(...(ngDevMode ? [{ debugName: "datasource" }] : /* istanbul ignore next */ []));
-    optionLabel = input.required(...(ngDevMode ? [{ debugName: "optionLabel" }] : /* istanbul ignore next */ []));
-    label = input('Seleccionar', ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
-    delay = input(100, ...(ngDevMode ? [{ debugName: "delay" }] : /* istanbul ignore next */ []));
-    idKey = input.required(...(ngDevMode ? [{ debugName: "idKey" }] : /* istanbul ignore next */ []));
-    dataKey = input('', ...(ngDevMode ? [{ debugName: "dataKey" }] : /* istanbul ignore next */ []));
-    permitirCrear = input(false, ...(ngDevMode ? [{ debugName: "permitirCrear" }] : /* istanbul ignore next */ []));
-    debug = input(false, ...(ngDevMode ? [{ debugName: "debug" }] : /* istanbul ignore next */ []));
-    factoryNuevoRegistro = input(...(ngDevMode ? [undefined, { debugName: "factoryNuevoRegistro" }] : /* istanbul ignore next */ []));
-    // Estado Interno
-    dataFiltrada = signal([], ...(ngDevMode ? [{ debugName: "dataFiltrada" }] : /* istanbul ignore next */ []));
-    value = [];
-    onChange = () => { };
-    onTouched = () => { };
-    disabled = false;
-    lastLogTime = 0;
-    timeoutLimpieza = null;
-    logDebug(message, data) {
-        if (!this.debug())
-            return;
-        const now = Date.now();
-        if (now - this.lastLogTime < 50)
-            return;
-        this.lastLogTime = now;
-        console.log(`[DsxAutocomplete] ${message}`, data || '');
-    }
-    searchRequisitos(event) {
-        const inicio = performance.now();
-        const label = this.optionLabel();
-        // FLUJO A: Dropdown (sin texto)
-        if (!event.query || event.query.trim() === '') {
-            const todoElUniverso = this.datasource();
-            this.dataFiltrada.set(todoElUniverso);
-            this.logDebug('Modo dropdown activo', {
-                registros: todoElUniverso.length,
-            });
-            return;
-        }
-        // FLUJO B: Búsqueda
-        const palabrasBuscadas = event.query
-            .toLowerCase()
-            .trim()
-            .split(/\s+/)
-            .filter((palabra) => palabra.length > 0);
-        const filtrados = this.datasource()
-            .filter((item) => {
-            const textoRegistro = String(item[label] || '').toLowerCase();
-            return palabrasBuscadas.every((palabra) => textoRegistro.includes(palabra));
-        })
-            .slice(0, 10);
-        this.dataFiltrada.set(filtrados);
-        this.logDebug(`Búsqueda "${event.query}" (${(performance.now() - inicio).toFixed(2)}ms)`, { encontrados: filtrados.length });
-    }
-    evaluarYAgregar(event) {
-        const valorInput = event.target.value?.trim();
-        if (!valorInput) {
-            this.dataFiltrada.set([]);
-            return;
-        }
-        const sugerencias = this.dataFiltrada();
-        const actuales = this.value || [];
-        const campoId = this.idKey();
-        if (sugerencias.length > 0) {
-            const primeraMatch = sugerencias[0];
-            const yaExiste = actuales.some((item) => item[campoId] === primeraMatch[campoId]);
-            if (!yaExiste) {
-                this.actualizarFormulario([...actuales, primeraMatch]);
-                this.logDebug('✅ Elemento agregado');
-            }
-        }
-        else if (this.permitirCrear()) {
-            let nuevo;
-            if (this.factoryNuevoRegistro()) {
-                nuevo = this.factoryNuevoRegistro()(valorInput);
-            }
-            else {
-                nuevo = {
-                    [campoId]: 0,
-                    [this.optionLabel()]: valorInput.toUpperCase(),
-                    activo: true,
-                };
-            }
-            this.actualizarFormulario([...actuales, nuevo]);
-            this.logDebug('🆕 Nuevo elemento creado', valorInput);
-        }
-        event.target.value = '';
-        this.dataFiltrada.set([]);
-    }
-    onHide() {
-        this.logDebug('Dropdown ocultado - Limpiando estado');
-        // Limpiar timeout anterior si existe
-        if (this.timeoutLimpieza) {
-            clearTimeout(this.timeoutLimpieza);
-            this.timeoutLimpieza = null;
-        }
-        // Limpiar después de un pequeño delay
-        this.timeoutLimpieza = setTimeout(() => {
-            this.dataFiltrada.set([]);
-            this.timeoutLimpieza = null;
-        }, 100);
-    }
-    onShow() {
-        this.logDebug('Dropdown mostrado');
-        // Limpiar timeout pendiente
-        if (this.timeoutLimpieza) {
-            clearTimeout(this.timeoutLimpieza);
-            this.timeoutLimpieza = null;
-        }
-    }
-    actualizarFormulario(nuevaLista) {
-        this.value = nuevaLista;
-        this.onChange(this.value);
-        this.logDebug('Formulario actualizado', {
-            total: nuevaLista.length,
-        });
-    }
-    // --- ControlValueAccessor ---
-    writeValue(value) {
-        this.value = value || [];
-        this.dataFiltrada.set([]);
-        if (this.timeoutLimpieza) {
-            clearTimeout(this.timeoutLimpieza);
-            this.timeoutLimpieza = null;
-        }
-    }
-    registerOnChange(fn) {
-        this.onChange = fn;
-    }
-    registerOnTouched(fn) {
-        this.onTouched = fn;
-    }
-    setDisabledState(isDisabled) {
-        this.disabled = isDisabled;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: DsxAutocomplete, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.17", type: DsxAutocomplete, isStandalone: true, selector: "dsx-autocomplete", inputs: { datasource: { classPropertyName: "datasource", publicName: "datasource", isSignal: true, isRequired: true, transformFunction: null }, optionLabel: { classPropertyName: "optionLabel", publicName: "optionLabel", isSignal: true, isRequired: true, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, delay: { classPropertyName: "delay", publicName: "delay", isSignal: true, isRequired: false, transformFunction: null }, idKey: { classPropertyName: "idKey", publicName: "idKey", isSignal: true, isRequired: true, transformFunction: null }, dataKey: { classPropertyName: "dataKey", publicName: "dataKey", isSignal: true, isRequired: false, transformFunction: null }, permitirCrear: { classPropertyName: "permitirCrear", publicName: "permitirCrear", isSignal: true, isRequired: false, transformFunction: null }, debug: { classPropertyName: "debug", publicName: "debug", isSignal: true, isRequired: false, transformFunction: null }, factoryNuevoRegistro: { classPropertyName: "factoryNuevoRegistro", publicName: "factoryNuevoRegistro", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
-            {
-                provide: NG_VALUE_ACCESSOR,
-                useExisting: forwardRef(() => DsxAutocomplete),
-                multi: true,
-            },
-        ], ngImport: i0, template: "<p-floatlabel variant=\"on\">\r\n  <p-autoComplete\r\n    fluid\r\n    multiple\r\n    [dropdown]=\"true\"\r\n    [suggestions]=\"dataFiltrada()\"\r\n    (completeMethod)=\"searchRequisitos($event)\"\r\n    [(ngModel)]=\"value\"\r\n    (ngModelChange)=\"onChange(value)\"\r\n    (onBlur)=\"onTouched()\"\r\n    (onShow)=\"onShow()\"\r\n    (onHide)=\"onHide()\"\r\n    [disabled]=\"disabled\"\r\n    [optionLabel]=\"optionLabel()\"\r\n    [dataKey]=\"dataKey() || idKey()\"\r\n    (keyup.enter)=\"evaluarYAgregar($event)\"\r\n    [delay]=\"delay()\"\r\n    placeholder=\"Ingresa un texto....\"\r\n  >\r\n  </p-autoComplete>\r\n  <label>{{ label() }}</label>\r\n</p-floatlabel>\r\n", styles: [""], dependencies: [{ kind: "component", type: AutoComplete, selector: "p-autoComplete, p-autocomplete, p-auto-complete", inputs: ["minLength", "minQueryLength", "delay", "panelStyle", "styleClass", "panelStyleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "readonly", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "autoHighlight", "forceSelection", "type", "autoZIndex", "baseZIndex", "ariaLabel", "dropdownAriaLabel", "ariaLabelledBy", "dropdownIcon", "unique", "group", "completeOnFocus", "showClear", "dropdown", "showEmptyMessage", "dropdownMode", "multiple", "addOnTab", "tabindex", "dataKey", "emptyMessage", "showTransitionOptions", "hideTransitionOptions", "autofocus", "autocomplete", "optionGroupChildren", "optionGroupLabel", "overlayOptions", "suggestions", "optionLabel", "optionValue", "id", "searchMessage", "emptySelectionMessage", "selectionMessage", "autoOptionFocus", "selectOnFocus", "searchLocale", "optionDisabled", "focusOnHover", "typeahead", "addOnBlur", "separator", "appendTo", "motionOptions"], outputs: ["completeMethod", "onSelect", "onUnselect", "onAdd", "onFocus", "onBlur", "onDropdownClick", "onClear", "onInputKeydown", "onKeyUp", "onShow", "onHide", "onLazyLoad"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: FloatLabel, selector: "p-floatlabel, p-floatLabel, p-float-label", inputs: ["variant"] }] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: DsxAutocomplete, decorators: [{
-            type: Component,
-            args: [{ selector: 'dsx-autocomplete', imports: [AutoComplete, FormsModule, FloatLabel], providers: [
-                        {
-                            provide: NG_VALUE_ACCESSOR,
-                            useExisting: forwardRef(() => DsxAutocomplete),
-                            multi: true,
-                        },
-                    ], template: "<p-floatlabel variant=\"on\">\r\n  <p-autoComplete\r\n    fluid\r\n    multiple\r\n    [dropdown]=\"true\"\r\n    [suggestions]=\"dataFiltrada()\"\r\n    (completeMethod)=\"searchRequisitos($event)\"\r\n    [(ngModel)]=\"value\"\r\n    (ngModelChange)=\"onChange(value)\"\r\n    (onBlur)=\"onTouched()\"\r\n    (onShow)=\"onShow()\"\r\n    (onHide)=\"onHide()\"\r\n    [disabled]=\"disabled\"\r\n    [optionLabel]=\"optionLabel()\"\r\n    [dataKey]=\"dataKey() || idKey()\"\r\n    (keyup.enter)=\"evaluarYAgregar($event)\"\r\n    [delay]=\"delay()\"\r\n    placeholder=\"Ingresa un texto....\"\r\n  >\r\n  </p-autoComplete>\r\n  <label>{{ label() }}</label>\r\n</p-floatlabel>\r\n" }]
-        }], propDecorators: { datasource: [{ type: i0.Input, args: [{ isSignal: true, alias: "datasource", required: true }] }], optionLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "optionLabel", required: true }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], delay: [{ type: i0.Input, args: [{ isSignal: true, alias: "delay", required: false }] }], idKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "idKey", required: true }] }], dataKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataKey", required: false }] }], permitirCrear: [{ type: i0.Input, args: [{ isSignal: true, alias: "permitirCrear", required: false }] }], debug: [{ type: i0.Input, args: [{ isSignal: true, alias: "debug", required: false }] }], factoryNuevoRegistro: [{ type: i0.Input, args: [{ isSignal: true, alias: "factoryNuevoRegistro", required: false }] }] } });
-
 class FileComponent {
     // Inputs
     existingFile = input(null, ...(ngDevMode ? [{ debugName: "existingFile" }] : /* istanbul ignore next */ []));
@@ -8597,7 +8441,7 @@ class DsxdateShort {
                 useExisting: forwardRef(() => DsxdateShort),
                 multi: true,
             },
-        ], ngImport: i0, template: "<!-- dsxdate-short.html -->\r\n<p-floatLabel variant=\"on\">\r\n  <p-datepicker\r\n    [formControl]=\"fechaControl\"\r\n    [fluid]=\"true\"\r\n    [showIcon]=\"showIcon()\"\r\n    [showOnFocus]=\"showOnFocus()\"\r\n    [showButtonBar]=\"showButtonBar()\"\r\n    [dateFormat]=\"dateFormat()\"\r\n    [placeholder]=\"placeholder()\"\r\n    pInputMask=\"99/99/9999\"\r\n  />\r\n  <label>{{ label() }}</label>\r\n</p-floatLabel>\r\n\r\n<!-- \u2705 SIN CONDICI\u00D3N - IGUAL QUE EL ORIGINAL -->\r\n<dsx-message-error [control]=\"fechaControl\" />\r\n\r\n<!-- Debug info -->\r\n@if (debugEnabled() && isDevMode) {\r\n<div\r\n  class=\"debug-info\"\r\n  style=\"\r\n    font-size: 12px;\r\n    color: #666;\r\n    margin-top: 4px;\r\n    border-top: 1px dashed #ccc;\r\n    padding-top: 4px;\r\n  \"\r\n>\r\n  <small>\r\n    <strong>Debug:</strong>\r\n    Value: {{ fechaControl.value | json }} | Valid: {{ fechaControl.valid }} |\r\n    Invalid: {{ fechaControl.invalid }} | Errors: {{ fechaControl.errors | json\r\n    }} | Dirty: {{ fechaControl.dirty }} | Touched: {{ fechaControl.touched }} |\r\n    Status: {{ fechaControl.status }}\r\n  </small>\r\n</div>\r\n}\r\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: FloatLabel, selector: "p-floatlabel, p-floatLabel, p-float-label", inputs: ["variant"] }, { kind: "component", type: DatePicker, selector: "p-datePicker, p-datepicker, p-date-picker", inputs: ["iconDisplay", "styleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "readonlyInput", "shortYearCutoff", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "minDate", "maxDate", "disabledDates", "disabledDays", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "view", "defaultDate", "appendTo", "motionOptions"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: AppMessageErrorComponent, selector: "dsx-message-error", inputs: ["control", "form", "debugMode"] }, { kind: "pipe", type: i1$1.JsonPipe, name: "json" }] });
+        ], ngImport: i0, template: "<!-- dsxdate-short.html -->\r\n<p-floatLabel variant=\"on\">\r\n  <p-datepicker\r\n    appendTo=\"body\"\r\n    [formControl]=\"fechaControl\"\r\n    [fluid]=\"true\"\r\n    [showIcon]=\"showIcon()\"\r\n    [showOnFocus]=\"showOnFocus()\"\r\n    [showButtonBar]=\"showButtonBar()\"\r\n    [dateFormat]=\"dateFormat()\"\r\n    [placeholder]=\"placeholder()\"\r\n    pInputMask=\"99/99/9999\"\r\n  />\r\n  <label>{{ label() }}</label>\r\n</p-floatLabel>\r\n\r\n<!-- \u2705 SIN CONDICI\u00D3N - IGUAL QUE EL ORIGINAL -->\r\n<dsx-message-error [control]=\"fechaControl\" />\r\n\r\n<!-- Debug info -->\r\n@if (debugEnabled() && isDevMode) {\r\n<div\r\n  class=\"debug-info\"\r\n  style=\"\r\n    font-size: 12px;\r\n    color: #666;\r\n    margin-top: 4px;\r\n    border-top: 1px dashed #ccc;\r\n    padding-top: 4px;\r\n  \"\r\n>\r\n  <small>\r\n    <strong>Debug:</strong>\r\n    Value: {{ fechaControl.value | json }} | Valid: {{ fechaControl.valid }} |\r\n    Invalid: {{ fechaControl.invalid }} | Errors: {{ fechaControl.errors | json\r\n    }} | Dirty: {{ fechaControl.dirty }} | Touched: {{ fechaControl.touched }} |\r\n    Status: {{ fechaControl.status }}\r\n  </small>\r\n</div>\r\n}\r\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: FloatLabel, selector: "p-floatlabel, p-floatLabel, p-float-label", inputs: ["variant"] }, { kind: "component", type: DatePicker, selector: "p-datePicker, p-datepicker, p-date-picker", inputs: ["iconDisplay", "styleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "readonlyInput", "shortYearCutoff", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "minDate", "maxDate", "disabledDates", "disabledDays", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "view", "defaultDate", "appendTo", "motionOptions"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: AppMessageErrorComponent, selector: "dsx-message-error", inputs: ["control", "form", "debugMode"] }, { kind: "pipe", type: i1$1.JsonPipe, name: "json" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: DsxdateShort, decorators: [{
             type: Component,
@@ -8614,7 +8458,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImpo
                             useExisting: forwardRef(() => DsxdateShort),
                             multi: true,
                         },
-                    ], template: "<!-- dsxdate-short.html -->\r\n<p-floatLabel variant=\"on\">\r\n  <p-datepicker\r\n    [formControl]=\"fechaControl\"\r\n    [fluid]=\"true\"\r\n    [showIcon]=\"showIcon()\"\r\n    [showOnFocus]=\"showOnFocus()\"\r\n    [showButtonBar]=\"showButtonBar()\"\r\n    [dateFormat]=\"dateFormat()\"\r\n    [placeholder]=\"placeholder()\"\r\n    pInputMask=\"99/99/9999\"\r\n  />\r\n  <label>{{ label() }}</label>\r\n</p-floatLabel>\r\n\r\n<!-- \u2705 SIN CONDICI\u00D3N - IGUAL QUE EL ORIGINAL -->\r\n<dsx-message-error [control]=\"fechaControl\" />\r\n\r\n<!-- Debug info -->\r\n@if (debugEnabled() && isDevMode) {\r\n<div\r\n  class=\"debug-info\"\r\n  style=\"\r\n    font-size: 12px;\r\n    color: #666;\r\n    margin-top: 4px;\r\n    border-top: 1px dashed #ccc;\r\n    padding-top: 4px;\r\n  \"\r\n>\r\n  <small>\r\n    <strong>Debug:</strong>\r\n    Value: {{ fechaControl.value | json }} | Valid: {{ fechaControl.valid }} |\r\n    Invalid: {{ fechaControl.invalid }} | Errors: {{ fechaControl.errors | json\r\n    }} | Dirty: {{ fechaControl.dirty }} | Touched: {{ fechaControl.touched }} |\r\n    Status: {{ fechaControl.status }}\r\n  </small>\r\n</div>\r\n}\r\n" }]
+                    ], template: "<!-- dsxdate-short.html -->\r\n<p-floatLabel variant=\"on\">\r\n  <p-datepicker\r\n    appendTo=\"body\"\r\n    [formControl]=\"fechaControl\"\r\n    [fluid]=\"true\"\r\n    [showIcon]=\"showIcon()\"\r\n    [showOnFocus]=\"showOnFocus()\"\r\n    [showButtonBar]=\"showButtonBar()\"\r\n    [dateFormat]=\"dateFormat()\"\r\n    [placeholder]=\"placeholder()\"\r\n    pInputMask=\"99/99/9999\"\r\n  />\r\n  <label>{{ label() }}</label>\r\n</p-floatLabel>\r\n\r\n<!-- \u2705 SIN CONDICI\u00D3N - IGUAL QUE EL ORIGINAL -->\r\n<dsx-message-error [control]=\"fechaControl\" />\r\n\r\n<!-- Debug info -->\r\n@if (debugEnabled() && isDevMode) {\r\n<div\r\n  class=\"debug-info\"\r\n  style=\"\r\n    font-size: 12px;\r\n    color: #666;\r\n    margin-top: 4px;\r\n    border-top: 1px dashed #ccc;\r\n    padding-top: 4px;\r\n  \"\r\n>\r\n  <small>\r\n    <strong>Debug:</strong>\r\n    Value: {{ fechaControl.value | json }} | Valid: {{ fechaControl.valid }} |\r\n    Invalid: {{ fechaControl.invalid }} | Errors: {{ fechaControl.errors | json\r\n    }} | Dirty: {{ fechaControl.dirty }} | Touched: {{ fechaControl.touched }} |\r\n    Status: {{ fechaControl.status }}\r\n  </small>\r\n</div>\r\n}\r\n" }]
         }], ctorParameters: () => [], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: true }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], dateFormat: [{ type: i0.Input, args: [{ isSignal: true, alias: "dateFormat", required: false }] }], showIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "showIcon", required: false }] }], showOnFocus: [{ type: i0.Input, args: [{ isSignal: true, alias: "showOnFocus", required: false }] }], showButtonBar: [{ type: i0.Input, args: [{ isSignal: true, alias: "showButtonBar", required: false }] }], debug: [{ type: i0.Input, args: [{ isSignal: true, alias: "debug", required: false }] }] } });
 
 // dsx-input-currency.ts
@@ -8852,6 +8696,543 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImpo
                 args: [InputNumber]
             }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], currency: [{ type: i0.Input, args: [{ isSignal: true, alias: "currency", required: false }] }], locale: [{ type: i0.Input, args: [{ isSignal: true, alias: "locale", required: false }] }], minFractionDigits: [{ type: i0.Input, args: [{ isSignal: true, alias: "minFractionDigits", required: false }] }], maxFractionDigits: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxFractionDigits", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], selectAllOnFocus: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectAllOnFocus", required: false }] }], debug: [{ type: i0.Input, args: [{ isSignal: true, alias: "debug", required: false }] }], showError: [{ type: i0.Input, args: [{ isSignal: true, alias: "showError", required: false }] }], valueChange: [{ type: i0.Output, args: ["valueChange"] }], focus: [{ type: i0.Output, args: ["focus"] }], blur: [{ type: i0.Output, args: ["blur"] }] } });
 
+class DsxAutocomplete {
+    injector = inject(Injector);
+    cdr = inject(ChangeDetectorRef);
+    ngControl = null;
+    isDevModeInternal = isDevMode();
+    controlSignal = signal(null, ...(ngDevMode ? [{ debugName: "controlSignal" }] : /* istanbul ignore next */ []));
+    datasource = input.required(...(ngDevMode ? [{ debugName: "datasource" }] : /* istanbul ignore next */ []));
+    optionLabel = input.required(...(ngDevMode ? [{ debugName: "optionLabel" }] : /* istanbul ignore next */ []));
+    label = input('Seleccionar', ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
+    delay = input(100, ...(ngDevMode ? [{ debugName: "delay" }] : /* istanbul ignore next */ []));
+    idKey = input.required(...(ngDevMode ? [{ debugName: "idKey" }] : /* istanbul ignore next */ []));
+    dataKey = input('', ...(ngDevMode ? [{ debugName: "dataKey" }] : /* istanbul ignore next */ []));
+    permitirCrear = input(false, ...(ngDevMode ? [{ debugName: "permitirCrear" }] : /* istanbul ignore next */ []));
+    isMultiple = input(true, ...(ngDevMode ? [{ debugName: "isMultiple" }] : /* istanbul ignore next */ []));
+    debug = input(false, ...(ngDevMode ? [{ debugName: "debug" }] : /* istanbul ignore next */ []));
+    factoryNuevoRegistro = input(...(ngDevMode ? [undefined, { debugName: "factoryNuevoRegistro" }] : /* istanbul ignore next */ []));
+    returnID = input(false, ...(ngDevMode ? [{ debugName: "returnID" }] : /* istanbul ignore next */ []));
+    showError = input(true, ...(ngDevMode ? [{ debugName: "showError" }] : /* istanbul ignore next */ []));
+    errorControl = computed(() => {
+        const control = this.controlSignal();
+        if (!this.showError())
+            return null;
+        return control?.control ?? null;
+    }, ...(ngDevMode ? [{ debugName: "errorControl" }] : /* istanbul ignore next */ []));
+    get isDevMode() {
+        return this.isDevModeInternal;
+    }
+    get formValue() {
+        return this.ngControl?.control?.value;
+    }
+    get controlName() {
+        return this.ngControl?.name || null;
+    }
+    get controlValid() {
+        return this.ngControl?.control?.valid ?? true;
+    }
+    get controlTouched() {
+        return this.ngControl?.control?.touched ?? false;
+    }
+    get controlDirty() {
+        return this.ngControl?.control?.dirty ?? false;
+    }
+    get controlErrors() {
+        return this.ngControl?.control?.errors ?? null;
+    }
+    get controlValue() {
+        return this.ngControl?.control?.value;
+    }
+    get controlStatus() {
+        if (!this.ngControl?.control)
+            return 'sin control';
+        const control = this.ngControl.control;
+        return `valid: ${control.valid}, touched: ${control.touched}, dirty: ${control.dirty}, errors: ${JSON.stringify(control.errors)}`;
+    }
+    dataFiltrada = signal([], ...(ngDevMode ? [{ debugName: "dataFiltrada" }] : /* istanbul ignore next */ []));
+    value = this.isMultiple() ? [] : null;
+    onChange = () => { };
+    onTouched = () => { };
+    disabled = false;
+    lastLogTime = 0;
+    timeoutLimpieza = null;
+    initialValueSet = false;
+    constructor() {
+        effect(() => {
+            this.ngControl = this.injector.get(NgControl, null);
+            this.controlSignal.set(this.ngControl);
+            if (this.shouldDebug() && this.ngControl) {
+                this.logDebug('Inferred from formControlName:', {
+                    controlName: this.getFormControlName(),
+                    optionLabel: this.optionLabel(),
+                    label: this.label(),
+                    showError: this.showError(),
+                    returnID: this.returnID(),
+                    isMultiple: this.isMultiple(),
+                });
+            }
+        });
+        effect(() => {
+            const ds = this.datasource();
+            if (ds.length > 0 && this.initialValueSet) {
+                this.logDebug('📚 Datasource actualizado:', ds.length);
+                if (this.ngControl?.control?.value) {
+                    this.logDebug('🔄 Recargando valor con nuevo datasource');
+                    this.writeValue(this.ngControl.control.value);
+                }
+            }
+        });
+        effect(() => {
+            const control = this.ngControl?.control;
+            if (control && this.shouldDebug()) {
+                const subscription = control.statusChanges?.subscribe(() => {
+                    this.logDebug('📊 Estado del control cambiado:', {
+                        controlName: this.getFormControlName(),
+                        valid: control.valid,
+                        touched: control.touched,
+                        dirty: control.dirty,
+                        errors: control.errors,
+                        value: control.value,
+                    });
+                });
+                return () => {
+                    if (subscription) {
+                        subscription.unsubscribe();
+                    }
+                };
+            }
+            return () => { };
+        });
+    }
+    ngOnInit() {
+        this.logDebug('🚀 Componente inicializado');
+        this.value = this.isMultiple() ? [] : null;
+    }
+    ngAfterViewInit() {
+        this.cdr.detectChanges();
+    }
+    shouldDebug() {
+        return this.isDevModeInternal && this.debug();
+    }
+    logDebug(message, data) {
+        if (!this.shouldDebug())
+            return;
+        const now = Date.now();
+        if (now - this.lastLogTime < 50)
+            return;
+        this.lastLogTime = now;
+        console.log(`[DsxAutocomplete] ${message}`, data || '');
+    }
+    searchRequisitos(event) {
+        const inicio = performance.now();
+        const label = this.optionLabel();
+        if (!event.query || event.query.trim() === '') {
+            const todoElUniverso = this.datasource();
+            this.dataFiltrada.set(todoElUniverso);
+            this.logDebug('Modo dropdown activo', {
+                registros: todoElUniverso.length,
+            });
+            return;
+        }
+        const queryNormalizado = this.normalizarTexto(event.query.trim());
+        if (!queryNormalizado) {
+            this.dataFiltrada.set(this.datasource());
+            return;
+        }
+        const palabrasBuscadas = queryNormalizado
+            .toLowerCase()
+            .split(/\s+/)
+            .filter((palabra) => palabra.length > 0);
+        const filtrados = this.datasource()
+            .filter((item) => {
+            const textoRegistro = this.normalizarTexto(String(item[label] || '')).toLowerCase();
+            return palabrasBuscadas.every((palabra) => textoRegistro.includes(palabra));
+        })
+            .slice(0, 10);
+        this.dataFiltrada.set(filtrados);
+        this.logDebug(`Búsqueda "${event.query}" (${(performance.now() - inicio).toFixed(2)}ms)`, { encontrados: filtrados.length });
+    }
+    normalizarTexto(texto) {
+        if (!texto)
+            return '';
+        return texto
+            .normalize('NFD')
+            .replace(/[\u0300-\u036f]/g, '')
+            .replace(/\s+/g, ' ')
+            .trim();
+    }
+    // ✨ CORREGIDO: evaluarYAgregar para manejar valores no encontrados
+    evaluarYAgregar(event) {
+        const valorInput = event.target.value?.trim();
+        if (!valorInput) {
+            this.dataFiltrada.set([]);
+            // Si el input está vacío y hay valor seleccionado, mantenerlo
+            // Si no hay valor, asegurar que el formulario tenga null o []
+            if (this.obtenerArrayValue().length === 0) {
+                this.actualizarFormulario([]);
+            }
+            return;
+        }
+        const sugerencias = this.dataFiltrada();
+        const actuales = this.obtenerArrayValue();
+        const campoId = this.idKey();
+        if (sugerencias.length > 0) {
+            const valorNormalizado = this.normalizarTexto(valorInput).toLowerCase();
+            const primeraMatch = sugerencias.find((item) => {
+                const itemLabel = this.normalizarTexto(String(item[this.optionLabel()] || '')).toLowerCase();
+                return itemLabel === valorNormalizado;
+            }) || sugerencias[0];
+            if (!this.isMultiple()) {
+                this.actualizarFormulario([primeraMatch]);
+                this.logDebug('✅ Elemento reemplazado (modo single)', primeraMatch[this.optionLabel()]);
+                event.target.value = '';
+                this.dataFiltrada.set([]);
+                return;
+            }
+            const yaExiste = actuales.some((item) => item[campoId] === primeraMatch[campoId]);
+            if (!yaExiste) {
+                this.actualizarFormulario([...actuales, primeraMatch]);
+                this.logDebug('✅ Elemento agregado');
+            }
+            else {
+                this.logDebug('⚠️ Elemento ya existe en la selección');
+                event.target.value = '';
+                this.dataFiltrada.set([]);
+                return;
+            }
+        }
+        else if (this.permitirCrear()) {
+            const valorNormalizado = this.normalizarTexto(valorInput).toLowerCase();
+            const yaExisteEnActuales = actuales.some((item) => {
+                const itemLabel = this.normalizarTexto(String(item[this.optionLabel()] || '')).toLowerCase();
+                return itemLabel === valorNormalizado;
+            });
+            if (yaExisteEnActuales) {
+                this.logDebug('⚠️ Elemento ya existe en la selección');
+                event.target.value = '';
+                this.dataFiltrada.set([]);
+                return;
+            }
+            let nuevo;
+            if (this.factoryNuevoRegistro()) {
+                nuevo = this.factoryNuevoRegistro()(valorInput);
+            }
+            else {
+                nuevo = {
+                    [campoId]: 0,
+                    [this.optionLabel()]: valorInput.toUpperCase(),
+                    activo: true,
+                };
+            }
+            this.actualizarFormulario(this.isMultiple() ? [...actuales, nuevo] : [nuevo]);
+            this.logDebug('🆕 Nuevo elemento creado', valorInput);
+        }
+        else {
+            // ✅ NO permite crear: limpiar el valor a null o []
+            this.logDebug('⚠️ No se encontraron coincidencias y no se permite crear', valorInput);
+            // ✨ IMPORTANTE: Limpiar la selección a null o []
+            this.actualizarFormulario([]);
+            // Marcar como touched para mostrar validación
+            if (this.ngControl?.control) {
+                this.ngControl.control.markAsTouched();
+                this.onTouched();
+            }
+        }
+        event.target.value = '';
+        this.dataFiltrada.set([]);
+    }
+    clearSelection() {
+        this.actualizarFormulario([]);
+        this.logDebug('🧹 Selección limpiada');
+    }
+    onNgModelChange(selectedItems) {
+        let items = [];
+        if (selectedItems === null || selectedItems === undefined) {
+            items = [];
+        }
+        else if (Array.isArray(selectedItems)) {
+            items = selectedItems;
+        }
+        else {
+            items = [selectedItems];
+        }
+        this.logDebug('📝 onNgModelChange:', {
+            items: items.length,
+            isMultiple: this.isMultiple(),
+            isArray: Array.isArray(selectedItems),
+            isNull: selectedItems === null,
+            returnID: this.returnID(),
+        });
+        if (this.isMultiple()) {
+            this.value = items;
+        }
+        else {
+            this.value = items.length > 0 ? items[0] : null;
+        }
+        const outputValue = this.getOutputValue(items);
+        this.onChange(outputValue);
+        this.logDebug('📊 Estado del control después de onChange:', {
+            controlName: this.getFormControlName(),
+            status: this.controlStatus,
+            value: outputValue,
+        });
+        if (items.length === 0 && this.ngControl?.control) {
+            this.ngControl.control.markAsTouched();
+            this.onTouched();
+            this.logDebug('📝 Control marcado como touched (selección vacía)', {
+                newStatus: this.controlStatus,
+            });
+        }
+        this.logDebug('📝 Selección actualizada', {
+            returnID: this.returnID(),
+            items: items.length,
+            output: outputValue,
+        });
+    }
+    getOutputValue(items) {
+        if (items.length === 0) {
+            return this.isMultiple() ? [] : null;
+        }
+        if (this.returnID()) {
+            const ids = items.map((item) => Number(item[this.idKey()]));
+            return this.isMultiple() ? ids : ids[0];
+        }
+        return this.isMultiple() ? items : items[0];
+    }
+    obtenerArrayValue() {
+        if (this.isMultiple()) {
+            return Array.isArray(this.value) ? this.value : [];
+        }
+        return this.value ? [this.value] : [];
+    }
+    getValueLength() {
+        if (this.isMultiple()) {
+            return Array.isArray(this.value) ? this.value.length : 0;
+        }
+        return this.value ? 1 : 0;
+    }
+    getValueDisplay(type) {
+        if (!this.value || (Array.isArray(this.value) && this.value.length === 0)) {
+            return 'Ninguno';
+        }
+        const items = Array.isArray(this.value) ? this.value : [this.value];
+        if (type === 'id') {
+            return items.map((item) => item[this.idKey()]).join(', ') || 'Ninguno';
+        }
+        else {
+            return (items.map((item) => item[this.optionLabel()]).join(', ') || 'Ninguno');
+        }
+    }
+    onHide() {
+        this.logDebug('Dropdown ocultado - Limpiando estado');
+        if (this.timeoutLimpieza) {
+            clearTimeout(this.timeoutLimpieza);
+            this.timeoutLimpieza = null;
+        }
+        this.timeoutLimpieza = setTimeout(() => {
+            this.dataFiltrada.set([]);
+            this.timeoutLimpieza = null;
+        }, 100);
+        if (this.ngControl?.control) {
+            const estabaTouched = this.ngControl.control.touched;
+            if (!estabaTouched) {
+                this.ngControl.control.markAsTouched();
+                this.onTouched();
+                this.logDebug('Control marked as touched (onHide)', {
+                    controlName: this.getFormControlName(),
+                    newStatus: this.controlStatus,
+                });
+            }
+            else {
+                this.logDebug('Control ya estaba touched (onHide)', {
+                    controlName: this.getFormControlName(),
+                    status: this.controlStatus,
+                });
+            }
+        }
+    }
+    onShow() {
+        this.logDebug('Dropdown mostrado');
+        if (this.timeoutLimpieza) {
+            clearTimeout(this.timeoutLimpieza);
+            this.timeoutLimpieza = null;
+        }
+    }
+    // ✨ MEJORADO: actualizarFormulario para manejar correctamente valores vacíos
+    actualizarFormulario(nuevaLista) {
+        // Si la lista está vacía, siempre enviar null o [] según el modo
+        if (nuevaLista.length === 0) {
+            if (this.isMultiple()) {
+                this.value = [];
+            }
+            else {
+                this.value = null;
+            }
+            const outputValue = this.isMultiple() ? [] : null;
+            this.onChange(outputValue);
+            this.logDebug('Formulario actualizado (vacío)', {
+                isMultiple: this.isMultiple(),
+                output: outputValue,
+            });
+            return;
+        }
+        // Si hay elementos, procesar normalmente
+        if (this.isMultiple()) {
+            this.value = nuevaLista;
+        }
+        else {
+            this.value = nuevaLista.length > 0 ? nuevaLista[0] : null;
+        }
+        const outputValue = this.getOutputValue(nuevaLista);
+        this.onChange(outputValue);
+        this.logDebug('Formulario actualizado', {
+            total: nuevaLista.length,
+            isMultiple: this.isMultiple(),
+            returnID: this.returnID(),
+            output: outputValue,
+        });
+    }
+    getFormControlName() {
+        return this.ngControl?.name || null;
+    }
+    writeValue(value) {
+        const timestamp = new Date().toISOString();
+        this.logDebug(`🔄 writeValue INVOCADO ${timestamp}`, {
+            value,
+            type: value === null
+                ? 'null'
+                : value === undefined
+                    ? 'undefined'
+                    : Array.isArray(value)
+                        ? 'array'
+                        : typeof value === 'object'
+                            ? 'object'
+                            : typeof value,
+            returnID: this.returnID(),
+            isMultiple: this.isMultiple(),
+            hasDatasource: this.datasource().length > 0,
+            datasourceSize: this.datasource().length,
+        });
+        if (value === null || value === undefined) {
+            this.logDebug(`⚠️ Valor null/undefined, limpiando selección`);
+            this.value = this.isMultiple() ? [] : null;
+            this.initialValueSet = true;
+            this.cdr.markForCheck();
+            this.cdr.detectChanges();
+            return;
+        }
+        let items = [];
+        let ids = [];
+        if (Array.isArray(value)) {
+            if (value.length === 0) {
+                this.value = this.isMultiple() ? [] : null;
+                this.initialValueSet = true;
+                this.cdr.markForCheck();
+                this.cdr.detectChanges();
+                return;
+            }
+            if (typeof value[0] === 'number') {
+                ids = value;
+            }
+            else if (typeof value[0] === 'object' && value[0] !== null) {
+                items = value;
+            }
+        }
+        else if (typeof value === 'number') {
+            ids = [value];
+        }
+        else if (typeof value === 'object' && value !== null) {
+            items = [value];
+        }
+        else {
+            this.value = this.isMultiple() ? [] : null;
+            this.initialValueSet = true;
+            this.cdr.markForCheck();
+            this.cdr.detectChanges();
+            return;
+        }
+        const sourceData = this.datasource();
+        if (ids.length > 0) {
+            if (sourceData.length === 0) {
+                this.logDebug(`⚠️ Datasource vacío, guardando IDs para luego`);
+                this.value = this.isMultiple() ? [] : null;
+                this.initialValueSet = true;
+                this.cdr.markForCheck();
+                this.cdr.detectChanges();
+                return;
+            }
+            const objetos = sourceData.filter((item) => ids.includes(Number(item[this.idKey()])));
+            const objetosOrdenados = ids
+                .map((id) => objetos.find((item) => Number(item[this.idKey()]) === id))
+                .filter((item) => item !== undefined);
+            items = objetosOrdenados;
+            this.logDebug(`🔍 Encontrados ${items.length} de ${ids.length} IDs`);
+        }
+        if (items.length > 0 && sourceData.length > 0) {
+            const itemsValidos = items.filter((item) => sourceData.some((s) => s[this.idKey()] === item[this.idKey()]));
+            if (itemsValidos.length !== items.length) {
+                this.logDebug(`⚠️ Algunos objetos no existen en datasource`, {
+                    original: items.length,
+                    validos: itemsValidos.length,
+                });
+                items = itemsValidos;
+            }
+        }
+        if (this.isMultiple()) {
+            this.value = items;
+        }
+        else {
+            this.value = items.length > 0 ? items[0] : null;
+        }
+        this.initialValueSet = true;
+        this.cdr.detectChanges();
+        this.logDebug(`✅ Vista actualizada con ${items.length} elementos (${this.isMultiple() ? 'multiple' : 'single'})`);
+    }
+    forceReload() {
+        this.logDebug('🔄 Forzando recarga');
+        if (this.ngControl?.control) {
+            const currentValue = this.ngControl.control.value;
+            this.logDebug('🔄 Valor actual del formulario:', currentValue);
+            this.writeValue(currentValue);
+        }
+    }
+    registerOnChange(fn) {
+        this.onChange = fn;
+    }
+    registerOnTouched(fn) {
+        this.onTouched = fn;
+    }
+    setDisabledState(isDisabled) {
+        this.disabled = isDisabled;
+        this.cdr.markForCheck();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: DsxAutocomplete, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: DsxAutocomplete, isStandalone: true, selector: "dsx-autocomplete", inputs: { datasource: { classPropertyName: "datasource", publicName: "datasource", isSignal: true, isRequired: true, transformFunction: null }, optionLabel: { classPropertyName: "optionLabel", publicName: "optionLabel", isSignal: true, isRequired: true, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, delay: { classPropertyName: "delay", publicName: "delay", isSignal: true, isRequired: false, transformFunction: null }, idKey: { classPropertyName: "idKey", publicName: "idKey", isSignal: true, isRequired: true, transformFunction: null }, dataKey: { classPropertyName: "dataKey", publicName: "dataKey", isSignal: true, isRequired: false, transformFunction: null }, permitirCrear: { classPropertyName: "permitirCrear", publicName: "permitirCrear", isSignal: true, isRequired: false, transformFunction: null }, isMultiple: { classPropertyName: "isMultiple", publicName: "isMultiple", isSignal: true, isRequired: false, transformFunction: null }, debug: { classPropertyName: "debug", publicName: "debug", isSignal: true, isRequired: false, transformFunction: null }, factoryNuevoRegistro: { classPropertyName: "factoryNuevoRegistro", publicName: "factoryNuevoRegistro", isSignal: true, isRequired: false, transformFunction: null }, returnID: { classPropertyName: "returnID", publicName: "returnID", isSignal: true, isRequired: false, transformFunction: null }, showError: { classPropertyName: "showError", publicName: "showError", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => DsxAutocomplete),
+                multi: true,
+            },
+        ], ngImport: i0, template: "<p-floatlabel variant=\"on\">\r\n  <p-autoComplete\r\n    fluid\r\n    appendTo=\"body\"\r\n    [multiple]=\"isMultiple()\"\r\n    [dropdown]=\"true\"\r\n    [showClear]=\"true\"\r\n    [suggestions]=\"dataFiltrada()\"\r\n    (completeMethod)=\"searchRequisitos($event)\"\r\n    [(ngModel)]=\"value\"\r\n    (ngModelChange)=\"onNgModelChange($event)\"\r\n    (onBlur)=\"onTouched()\"\r\n    (onShow)=\"onShow()\"\r\n    (onHide)=\"onHide()\"\r\n    [disabled]=\"disabled\"\r\n    [optionLabel]=\"optionLabel()\"\r\n    [dataKey]=\"dataKey() || idKey()\"\r\n    (keyup.enter)=\"evaluarYAgregar($event)\"\r\n    [delay]=\"delay()\"\r\n    placeholder=\"Ingresa un texto....\"\r\n    [inputStyle]=\"{'text-transform': 'uppercase'}\"\r\n  >\r\n    <ng-template let-item pTemplate=\"selectedItem\">\r\n      {{ item[optionLabel()] }}\r\n    </ng-template>\r\n\r\n    <ng-template let-item pTemplate=\"item\">\r\n      {{ item[optionLabel()] }}\r\n    </ng-template>\r\n  </p-autoComplete>\r\n  <label>{{ label() }}</label>\r\n</p-floatlabel>\r\n\r\n<!-- Bot\u00F3n de limpiar para modo single -->\r\n@if (!isMultiple() && value) {\r\n<button\r\n  type=\"button\"\r\n  (click)=\"clearSelection()\"\r\n  style=\"\r\n    position: absolute;\r\n    right: 10px;\r\n    top: 50%;\r\n    transform: translateY(-50%);\r\n    background: transparent;\r\n    border: none;\r\n    cursor: pointer;\r\n    color: #999;\r\n    font-size: 14px;\r\n    z-index: 1;\r\n  \"\r\n  aria-label=\"Limpiar selecci\u00F3n\"\r\n>\r\n  \u2715\r\n</button>\r\n}\r\n\r\n<!-- Mensaje de error -->\r\n@if (showError() && errorControl()) {\r\n<dsx-message-error [control]=\"errorControl()\" />\r\n}\r\n\r\n<!-- Panel de Debug -->\r\n@if (debug() && isDevMode) {\r\n<div\r\n  style=\"\r\n    margin-top: 8px;\r\n    font-size: 11px;\r\n    color: #666;\r\n    background: #f5f5f5;\r\n    padding: 6px 10px;\r\n    border-radius: 4px;\r\n    font-family: monospace;\r\n    border: 1px solid #ddd;\r\n  \"\r\n>\r\n  <div\r\n    style=\"\r\n      display: flex;\r\n      justify-content: space-between;\r\n      align-items: center;\r\n      gap: 8px;\r\n      flex-wrap: wrap;\r\n    \"\r\n  >\r\n    <div>\r\n      <strong>\uD83D\uDD0D Debug:</strong>\r\n      <span style=\"margin-left: 8px\">Items: {{ getValueLength() }}</span>\r\n      <span style=\"margin-left: 8px\">IDs: {{ getValueDisplay('id') }}</span>\r\n      <span style=\"margin-left: 8px\"\r\n        >Nombres: {{ getValueDisplay('nombre') }}</span\r\n      >\r\n      <span style=\"margin-left: 8px; color: #888; font-size: 10px\">\r\n        | returnID: {{ returnID() ? '\u2705 IDs' : '\u274C Objetos' }} | Multiple: {{\r\n        isMultiple() ? '\u2705' : '\u274C' }} | Control: {{ controlName || 'sin nombre'\r\n        }}\r\n      </span>\r\n    </div>\r\n    <div\r\n      style=\"\r\n        font-size: 10px;\r\n        color: #333;\r\n        background: #e8e8e8;\r\n        padding: 2px 8px;\r\n        border-radius: 4px;\r\n      \"\r\n    >\r\n      <strong>\uD83D\uDCCA Validaci\u00F3n:</strong>\r\n      <span [style.color]=\"controlValid ? 'green' : 'red'\">\r\n        {{ controlValid ? '\u2705 V\u00E1lido' : '\u274C Inv\u00E1lido' }}\r\n      </span>\r\n      <span style=\"margin-left: 4px\">\r\n        | Touched: {{ controlTouched ? '\u2705' : '\u274C' }}\r\n      </span>\r\n      <span style=\"margin-left: 4px\">\r\n        | Dirty: {{ controlDirty ? '\u2705' : '\u274C' }}\r\n      </span>\r\n      @if (controlErrors) {\r\n      <span style=\"margin-left: 4px; color: red\">\r\n        | Errors: {{ controlErrors | json }}\r\n      </span>\r\n      }\r\n    </div>\r\n    <button\r\n      (click)=\"forceReload()\"\r\n      style=\"\r\n        font-size: 10px;\r\n        padding: 2px 8px;\r\n        border-radius: 4px;\r\n        border: 1px solid #ccc;\r\n        background: white;\r\n        cursor: pointer;\r\n      \"\r\n      type=\"button\"\r\n    >\r\n      \uD83D\uDD04 Recargar\r\n    </button>\r\n  </div>\r\n</div>\r\n}\r\n", styles: [""], dependencies: [{ kind: "component", type: AutoComplete, selector: "p-autoComplete, p-autocomplete, p-auto-complete", inputs: ["minLength", "minQueryLength", "delay", "panelStyle", "styleClass", "panelStyleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "readonly", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "autoHighlight", "forceSelection", "type", "autoZIndex", "baseZIndex", "ariaLabel", "dropdownAriaLabel", "ariaLabelledBy", "dropdownIcon", "unique", "group", "completeOnFocus", "showClear", "dropdown", "showEmptyMessage", "dropdownMode", "multiple", "addOnTab", "tabindex", "dataKey", "emptyMessage", "showTransitionOptions", "hideTransitionOptions", "autofocus", "autocomplete", "optionGroupChildren", "optionGroupLabel", "overlayOptions", "suggestions", "optionLabel", "optionValue", "id", "searchMessage", "emptySelectionMessage", "selectionMessage", "autoOptionFocus", "selectOnFocus", "searchLocale", "optionDisabled", "focusOnHover", "typeahead", "addOnBlur", "separator", "appendTo", "motionOptions"], outputs: ["completeMethod", "onSelect", "onUnselect", "onAdd", "onFocus", "onBlur", "onDropdownClick", "onClear", "onInputKeydown", "onKeyUp", "onShow", "onHide", "onLazyLoad"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: FloatLabel, selector: "p-floatlabel, p-floatLabel, p-float-label", inputs: ["variant"] }, { kind: "component", type: AppMessageErrorComponent, selector: "dsx-message-error", inputs: ["control", "form", "debugMode"] }, { kind: "pipe", type: JsonPipe, name: "json" }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: DsxAutocomplete, decorators: [{
+            type: Component,
+            args: [{ selector: 'dsx-autocomplete', imports: [
+                        AutoComplete,
+                        FormsModule,
+                        FloatLabel,
+                        JsonPipe,
+                        AppMessageErrorComponent,
+                    ], providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => DsxAutocomplete),
+                            multi: true,
+                        },
+                    ], template: "<p-floatlabel variant=\"on\">\r\n  <p-autoComplete\r\n    fluid\r\n    appendTo=\"body\"\r\n    [multiple]=\"isMultiple()\"\r\n    [dropdown]=\"true\"\r\n    [showClear]=\"true\"\r\n    [suggestions]=\"dataFiltrada()\"\r\n    (completeMethod)=\"searchRequisitos($event)\"\r\n    [(ngModel)]=\"value\"\r\n    (ngModelChange)=\"onNgModelChange($event)\"\r\n    (onBlur)=\"onTouched()\"\r\n    (onShow)=\"onShow()\"\r\n    (onHide)=\"onHide()\"\r\n    [disabled]=\"disabled\"\r\n    [optionLabel]=\"optionLabel()\"\r\n    [dataKey]=\"dataKey() || idKey()\"\r\n    (keyup.enter)=\"evaluarYAgregar($event)\"\r\n    [delay]=\"delay()\"\r\n    placeholder=\"Ingresa un texto....\"\r\n    [inputStyle]=\"{'text-transform': 'uppercase'}\"\r\n  >\r\n    <ng-template let-item pTemplate=\"selectedItem\">\r\n      {{ item[optionLabel()] }}\r\n    </ng-template>\r\n\r\n    <ng-template let-item pTemplate=\"item\">\r\n      {{ item[optionLabel()] }}\r\n    </ng-template>\r\n  </p-autoComplete>\r\n  <label>{{ label() }}</label>\r\n</p-floatlabel>\r\n\r\n<!-- Bot\u00F3n de limpiar para modo single -->\r\n@if (!isMultiple() && value) {\r\n<button\r\n  type=\"button\"\r\n  (click)=\"clearSelection()\"\r\n  style=\"\r\n    position: absolute;\r\n    right: 10px;\r\n    top: 50%;\r\n    transform: translateY(-50%);\r\n    background: transparent;\r\n    border: none;\r\n    cursor: pointer;\r\n    color: #999;\r\n    font-size: 14px;\r\n    z-index: 1;\r\n  \"\r\n  aria-label=\"Limpiar selecci\u00F3n\"\r\n>\r\n  \u2715\r\n</button>\r\n}\r\n\r\n<!-- Mensaje de error -->\r\n@if (showError() && errorControl()) {\r\n<dsx-message-error [control]=\"errorControl()\" />\r\n}\r\n\r\n<!-- Panel de Debug -->\r\n@if (debug() && isDevMode) {\r\n<div\r\n  style=\"\r\n    margin-top: 8px;\r\n    font-size: 11px;\r\n    color: #666;\r\n    background: #f5f5f5;\r\n    padding: 6px 10px;\r\n    border-radius: 4px;\r\n    font-family: monospace;\r\n    border: 1px solid #ddd;\r\n  \"\r\n>\r\n  <div\r\n    style=\"\r\n      display: flex;\r\n      justify-content: space-between;\r\n      align-items: center;\r\n      gap: 8px;\r\n      flex-wrap: wrap;\r\n    \"\r\n  >\r\n    <div>\r\n      <strong>\uD83D\uDD0D Debug:</strong>\r\n      <span style=\"margin-left: 8px\">Items: {{ getValueLength() }}</span>\r\n      <span style=\"margin-left: 8px\">IDs: {{ getValueDisplay('id') }}</span>\r\n      <span style=\"margin-left: 8px\"\r\n        >Nombres: {{ getValueDisplay('nombre') }}</span\r\n      >\r\n      <span style=\"margin-left: 8px; color: #888; font-size: 10px\">\r\n        | returnID: {{ returnID() ? '\u2705 IDs' : '\u274C Objetos' }} | Multiple: {{\r\n        isMultiple() ? '\u2705' : '\u274C' }} | Control: {{ controlName || 'sin nombre'\r\n        }}\r\n      </span>\r\n    </div>\r\n    <div\r\n      style=\"\r\n        font-size: 10px;\r\n        color: #333;\r\n        background: #e8e8e8;\r\n        padding: 2px 8px;\r\n        border-radius: 4px;\r\n      \"\r\n    >\r\n      <strong>\uD83D\uDCCA Validaci\u00F3n:</strong>\r\n      <span [style.color]=\"controlValid ? 'green' : 'red'\">\r\n        {{ controlValid ? '\u2705 V\u00E1lido' : '\u274C Inv\u00E1lido' }}\r\n      </span>\r\n      <span style=\"margin-left: 4px\">\r\n        | Touched: {{ controlTouched ? '\u2705' : '\u274C' }}\r\n      </span>\r\n      <span style=\"margin-left: 4px\">\r\n        | Dirty: {{ controlDirty ? '\u2705' : '\u274C' }}\r\n      </span>\r\n      @if (controlErrors) {\r\n      <span style=\"margin-left: 4px; color: red\">\r\n        | Errors: {{ controlErrors | json }}\r\n      </span>\r\n      }\r\n    </div>\r\n    <button\r\n      (click)=\"forceReload()\"\r\n      style=\"\r\n        font-size: 10px;\r\n        padding: 2px 8px;\r\n        border-radius: 4px;\r\n        border: 1px solid #ccc;\r\n        background: white;\r\n        cursor: pointer;\r\n      \"\r\n      type=\"button\"\r\n    >\r\n      \uD83D\uDD04 Recargar\r\n    </button>\r\n  </div>\r\n</div>\r\n}\r\n" }]
+        }], ctorParameters: () => [], propDecorators: { datasource: [{ type: i0.Input, args: [{ isSignal: true, alias: "datasource", required: true }] }], optionLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "optionLabel", required: true }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], delay: [{ type: i0.Input, args: [{ isSignal: true, alias: "delay", required: false }] }], idKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "idKey", required: true }] }], dataKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataKey", required: false }] }], permitirCrear: [{ type: i0.Input, args: [{ isSignal: true, alias: "permitirCrear", required: false }] }], isMultiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "isMultiple", required: false }] }], debug: [{ type: i0.Input, args: [{ isSignal: true, alias: "debug", required: false }] }], factoryNuevoRegistro: [{ type: i0.Input, args: [{ isSignal: true, alias: "factoryNuevoRegistro", required: false }] }], returnID: [{ type: i0.Input, args: [{ isSignal: true, alias: "returnID", required: false }] }], showError: [{ type: i0.Input, args: [{ isSignal: true, alias: "showError", required: false }] }] } });
+
 // dsx-select.component.ts
 class DsxSelect {
     injector = inject(Injector);