@neural-ui/core 1.2.0 → 1.3.0

package/fesm2022/neural-ui-core-date-input.mjs

@@ -0,0 +1,1332 @@
+import * as i0 from '@angular/core';
+import { inject, ElementRef, input, output, signal, computed, forwardRef, HostListener, ChangeDetectionStrategy, ViewEncapsulation, Component } from '@angular/core';
+import { DOCUMENT } from '@angular/common';
+import { NG_VALUE_ACCESSOR } from '@angular/forms';
+
+// ── Private helpers ──────────────────────────────────────────────────────────
+let _neuDateInputIdSeq = 0;
+function sameDay(a, b) {
+    return (a.getFullYear() === b.getFullYear() &&
+        a.getMonth() === b.getMonth() &&
+        a.getDate() === b.getDate());
+}
+function cloneDate(d) {
+    return new Date(d.getTime());
+}
+// ── Component ────────────────────────────────────────────────────────────────
+/**
+ * NeuralUI DateInput — campo de fecha/hora unificado con modo rango.
+ * Unified date/time field with range mode.
+ *
+ * Uso básico / Basic usage:
+ *   <neu-date-input type="date"             [formControl]="dateCtrl" />
+ *   <neu-date-input type="time"             [formControl]="timeCtrl" />
+ *   <neu-date-input type="datetime-local"   [formControl]="dateTimeCtrl" />
+ *   <neu-date-input type="range"            [formControl]="rangeCtrl" />
+ */
+class NeuDateInputComponent {
+    el = inject(ElementRef);
+    doc = inject(DOCUMENT);
+    _langObserver;
+    /** Tipo del campo / Field type */
+    type = input('date', ...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
+    /** Etiqueta / Label */
+    label = input('', ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
+    /** Texto de ayuda / Help text */
+    hint = input('', ...(ngDevMode ? [{ debugName: "hint" }] : /* istanbul ignore next */ []));
+    /** Mensaje de error / Error message */
+    errorMessage = input('', ...(ngDevMode ? [{ debugName: "errorMessage" }] : /* istanbul ignore next */ []));
+    /** Deshabilita / Disabled */
+    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+    /** Tamaño del campo: 'sm' = 36px | 'md' = 48px | 'lg' = 56px / Field size */
+    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    /** Solo lectura / Read only */
+    readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
+    /** Nombre / Field name */
+    name = input('', ...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
+    /** ID accesible / Accessible ID */
+    inputId = input('', ...(ngDevMode ? [{ debugName: "inputId" }] : /* istanbul ignore next */ []));
+    /** Requerido / Required */
+    required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : /* istanbul ignore next */ []));
+    /** Mínimo / Minimum */
+    min = input(null, ...(ngDevMode ? [{ debugName: "min" }] : /* istanbul ignore next */ []));
+    /** Máximo / Maximum */
+    max = input(null, ...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
+    /** Paso / Step */
+    step = input(null, ...(ngDevMode ? [{ debugName: "step" }] : /* istanbul ignore next */ []));
+    /** Locale explícito opcional / Optional explicit locale */
+    locale = input(null, ...(ngDevMode ? [{ debugName: "locale" }] : /* istanbul ignore next */ []));
+    // ── Range-mode inputs ────────────────────────────────────────────
+    /** Placeholder del trigger de rango / Range trigger placeholder */
+    placeholder = input('', ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
+    /** Formato de fecha en modo rango / Date display format in range mode */
+    dateFormat = input('short', ...(ngDevMode ? [{ debugName: "dateFormat" }] : /* istanbul ignore next */ []));
+    // ── Outputs ──────────────────────────────────────────────────────
+    /** Emitido al confirmar el rango / Emitted when range is confirmed */
+    rangeChange = output();
+    // ── Estado interno / Internal state ──────────────────────────────
+    _id = `neu-date-input-${++_neuDateInputIdSeq}`;
+    isOpen = signal(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : /* istanbul ignore next */ []));
+    _isRange = computed(() => this.type() === 'range', ...(ngDevMode ? [{ debugName: "_isRange" }] : /* istanbul ignore next */ []));
+    _cvaDisabled = signal(false, ...(ngDevMode ? [{ debugName: "_cvaDisabled" }] : /* istanbul ignore next */ []));
+    isDisabledFinal = computed(() => this.disabled() || this._cvaDisabled(), ...(ngDevMode ? [{ debugName: "isDisabledFinal" }] : /* istanbul ignore next */ []));
+    hasError = computed(() => !!this.errorMessage(), ...(ngDevMode ? [{ debugName: "hasError" }] : /* istanbul ignore next */ []));
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    _onChange = () => { };
+    _onTouched = () => { };
+    // ── State — single ────────────────────────────────────────────────
+    _value = signal('', ...(ngDevMode ? [{ debugName: "_value" }] : /* istanbul ignore next */ []));
+    _viewYear = signal(new Date().getFullYear(), ...(ngDevMode ? [{ debugName: "_viewYear" }] : /* istanbul ignore next */ []));
+    _viewMonth = signal(new Date().getMonth(), ...(ngDevMode ? [{ debugName: "_viewMonth" }] : /* istanbul ignore next */ []));
+    _selYear = signal(null, ...(ngDevMode ? [{ debugName: "_selYear" }] : /* istanbul ignore next */ []));
+    _selMonth = signal(null, ...(ngDevMode ? [{ debugName: "_selMonth" }] : /* istanbul ignore next */ []));
+    _selDay = signal(null, ...(ngDevMode ? [{ debugName: "_selDay" }] : /* istanbul ignore next */ []));
+    _selHour = signal(0, ...(ngDevMode ? [{ debugName: "_selHour" }] : /* istanbul ignore next */ []));
+    _selMinute = signal(0, ...(ngDevMode ? [{ debugName: "_selMinute" }] : /* istanbul ignore next */ []));
+    // ── State — range ─────────────────────────────────────────────────
+    _today = new Date();
+    _documentLang = signal(this.#normalizedLocale(this.doc.documentElement.lang) || 'es', ...(ngDevMode ? [{ debugName: "_documentLang" }] : /* istanbul ignore next */ []));
+    _pickStart = signal(null, ...(ngDevMode ? [{ debugName: "_pickStart" }] : /* istanbul ignore next */ []));
+    _pickEnd = signal(null, ...(ngDevMode ? [{ debugName: "_pickEnd" }] : /* istanbul ignore next */ []));
+    _hoverDate = signal(null, ...(ngDevMode ? [{ debugName: "_hoverDate" }] : /* istanbul ignore next */ []));
+    _leftCursor = signal(new Date(this._today.getFullYear(), this._today.getMonth(), 1), ...(ngDevMode ? [{ debugName: "_leftCursor" }] : /* istanbul ignore next */ []));
+    _rightCursor = computed(() => {
+        const l = this._leftCursor();
+        return new Date(l.getFullYear(), l.getMonth() + 1, 1);
+    }, ...(ngDevMode ? [{ debugName: "_rightCursor" }] : /* istanbul ignore next */ []));
+    _hasRange = computed(() => !!this._pickStart(), ...(ngDevMode ? [{ debugName: "_hasRange" }] : /* istanbul ignore next */ []));
+    _canApply = computed(() => this._pickStart() !== null && this._pickEnd() !== null, ...(ngDevMode ? [{ debugName: "_canApply" }] : /* istanbul ignore next */ []));
+    _resolvedLocale = computed(() => this.#normalizedLocale(this.locale()) || this._documentLang() || 'es', ...(ngDevMode ? [{ debugName: "_resolvedLocale" }] : /* istanbul ignore next */ []));
+    _texts = computed(() => {
+        const spanish = this._resolvedLocale().toLowerCase().startsWith('es');
+        return spanish
+            ? {
+                rangeAriaLabel: 'Seleccionar rango de fechas',
+                prevMonth: 'Mes anterior',
+                nextMonth: 'Mes siguiente',
+                clear: 'Limpiar',
+                apply: 'Aplicar',
+                chooseDate: 'Seleccionar fecha',
+                delete: 'Borrar',
+                today: 'Hoy',
+                prevHour: 'Hora anterior',
+                nextHour: 'Hora siguiente',
+                prevMinute: 'Minuto anterior',
+                nextMinute: 'Minuto siguiente',
+                rangePlaceholder: 'Seleccionar fechas',
+                timePlaceholder: 'hh:mm',
+                datePlaceholder: 'dd/mm/aaaa',
+                dateTimePlaceholder: 'dd/mm/aaaa, hh:mm',
+            }
+            : {
+                rangeAriaLabel: 'Select date range',
+                prevMonth: 'Previous month',
+                nextMonth: 'Next month',
+                clear: 'Clear',
+                apply: 'Apply',
+                chooseDate: 'Choose date',
+                delete: 'Clear',
+                today: 'Today',
+                prevHour: 'Previous hour',
+                nextHour: 'Next hour',
+                prevMinute: 'Previous minute',
+                nextMinute: 'Next minute',
+                rangePlaceholder: 'Select dates',
+                timePlaceholder: 'hh:mm',
+                datePlaceholder: 'mm/dd/yyyy',
+                dateTimePlaceholder: 'mm/dd/yyyy, hh:mm',
+            };
+    }, ...(ngDevMode ? [{ debugName: "_texts" }] : /* istanbul ignore next */ []));
+    _weekDayLabels = computed(() => this.#buildWeekdayLabels('short'), ...(ngDevMode ? [{ debugName: "_weekDayLabels" }] : /* istanbul ignore next */ []));
+    _leftTitle = computed(() => this._monthTitle(this._leftCursor()), ...(ngDevMode ? [{ debugName: "_leftTitle" }] : /* istanbul ignore next */ []));
+    _rightTitle = computed(() => this._monthTitle(this._rightCursor()), ...(ngDevMode ? [{ debugName: "_rightTitle" }] : /* istanbul ignore next */ []));
+    _leftDays = computed(() => this._buildRangeMonth(this._leftCursor()), ...(ngDevMode ? [{ debugName: "_leftDays" }] : /* istanbul ignore next */ []));
+    _rightDays = computed(() => this._buildRangeMonth(this._rightCursor()), ...(ngDevMode ? [{ debugName: "_rightDays" }] : /* istanbul ignore next */ []));
+    _rangePlaceholderText = computed(() => this.placeholder() || this._texts().rangePlaceholder, ...(ngDevMode ? [{ debugName: "_rangePlaceholderText" }] : /* istanbul ignore next */ []));
+    constructor() {
+        if (typeof MutationObserver !== 'undefined') {
+            this._langObserver = new MutationObserver(() => {
+                this._documentLang.set(this.#normalizedLocale(this.doc.documentElement.lang) || 'es');
+            });
+            this._langObserver.observe(this.doc.documentElement, {
+                attributes: true,
+                attributeFilter: ['lang'],
+            });
+        }
+    }
+    ngOnDestroy() {
+        this._langObserver?.disconnect();
+    }
+    _monthTitle(d) {
+        return this.#capitalize(new Intl.DateTimeFormat(this._resolvedLocale(), { month: 'long', year: 'numeric' }).format(d));
+    }
+    _rangeDisplayValue = computed(() => {
+        const s = this._pickStart();
+        const e = this._pickEnd();
+        if (!s)
+            return this.placeholder();
+        if (!e)
+            return this._fmtDate(s);
+        return `${this._fmtDate(s)} – ${this._fmtDate(e)}`;
+    }, ...(ngDevMode ? [{ debugName: "_rangeDisplayValue" }] : /* istanbul ignore next */ []));
+    _fmtDate(d) {
+        const fmt = this.dateFormat();
+        const opts = {
+            short: { day: '2-digit', month: '2-digit', year: 'numeric' },
+            medium: { day: '2-digit', month: 'short', year: 'numeric' },
+            long: { day: 'numeric', month: 'long', year: 'numeric' },
+            full: { weekday: 'long', day: 'numeric', month: 'long', year: 'numeric' },
+            numeric: { day: 'numeric', month: 'numeric', year: '2-digit' },
+        };
+        return d.toLocaleDateString(this._resolvedLocale(), opts[fmt] ?? opts['short']);
+    }
+    _buildRangeMonth(cursor) {
+        const year = cursor.getFullYear();
+        const month = cursor.getMonth();
+        const firstDay = new Date(year, month, 1);
+        const lastDay = new Date(year, month + 1, 0);
+        const startOffset = (firstDay.getDay() + 6) % 7;
+        const cells = [];
+        for (let i = startOffset - 1; i >= 0; i--) {
+            cells.push(this._rangeCell(new Date(year, month, -i), false));
+        }
+        for (let d = 1; d <= lastDay.getDate(); d++) {
+            cells.push(this._rangeCell(new Date(year, month, d), true));
+        }
+        while (cells.length % 7 !== 0 || cells.length < 42) {
+            cells.push(this._rangeCell(new Date(year, month + 1, cells.length - startOffset - lastDay.getDate() + 1), false));
+        }
+        return cells;
+    }
+    _rangeCell(date, current) {
+        const s = this._pickStart();
+        const e = this._pickEnd();
+        const h = this._hoverDate();
+        const rangeEnd = e ?? h;
+        const inRange = s && rangeEnd
+            ? (date > s && date < rangeEnd) || (rangeEnd < s && date > rangeEnd && date < s)
+            : false;
+        return {
+            date,
+            day: date.getDate(),
+            ts: date.getTime(),
+            current,
+            today: sameDay(date, this._today),
+            selected: (s && sameDay(date, s)) || (e && sameDay(date, e)) || false,
+            rangeStart: s ? sameDay(date, s) : false,
+            rangeEnd: e ? sameDay(date, e) : false,
+            inRange: !!inRange,
+            label: date.toLocaleDateString(this._resolvedLocale()),
+        };
+    }
+    // ── Range actions ─────────────────────────────────────────────────
+    _prevLeft() {
+        this._leftCursor.update((d) => new Date(d.getFullYear(), d.getMonth() - 1, 1));
+    }
+    _nextLeft() {
+        this._leftCursor.update((d) => new Date(d.getFullYear(), d.getMonth() + 1, 1));
+    }
+    _prevRight() {
+        this._leftCursor.update((d) => new Date(d.getFullYear(), d.getMonth() - 1, 1));
+    }
+    _nextRight() {
+        this._leftCursor.update((d) => new Date(d.getFullYear(), d.getMonth() + 1, 1));
+    }
+    _selectDay(date) {
+        const s = this._pickStart();
+        if (!s || this._pickEnd()) {
+            this._pickStart.set(cloneDate(date));
+            this._pickEnd.set(null);
+            this._hoverDate.set(null);
+        }
+        else {
+            if (date < s) {
+                this._pickEnd.set(cloneDate(s));
+                this._pickStart.set(cloneDate(date));
+            }
+            else {
+                this._pickEnd.set(cloneDate(date));
+            }
+            this._hoverDate.set(null);
+        }
+    }
+    _hoverDay(date) {
+        if (this._pickStart() && !this._pickEnd())
+            this._hoverDate.set(date);
+    }
+    _applyRange() {
+        const range = { start: this._pickStart(), end: this._pickEnd() };
+        this._onChange(range);
+        this.rangeChange.emit(range);
+        this._onTouched();
+        this.isOpen.set(false);
+    }
+    _clearRange() {
+        this._pickStart.set(null);
+        this._pickEnd.set(null);
+        this._hoverDate.set(null);
+        const range = { start: null, end: null };
+        this._onChange(range);
+        this.rangeChange.emit(range);
+    }
+    // ── Single computed ───────────────────────────────────────────────
+    displayValue = computed(() => {
+        const v = this._value();
+        if (!v)
+            return '';
+        const t = this.type();
+        if (t === 'date') {
+            const d = new Date(v + 'T00:00:00');
+            return isNaN(d.getTime())
+                ? v
+                : d.toLocaleDateString(this._resolvedLocale(), {
+                    day: '2-digit',
+                    month: '2-digit',
+                    year: 'numeric',
+                });
+        }
+        if (t === 'time')
+            return v;
+        const [datePart, timePart] = v.split('T');
+        const d = new Date(datePart + 'T00:00:00');
+        return ((isNaN(d.getTime())
+            ? datePart
+            : d.toLocaleDateString(this._resolvedLocale(), {
+                day: '2-digit',
+                month: '2-digit',
+                year: 'numeric',
+            })) +
+            ', ' +
+            (timePart?.slice(0, 5) ?? ''));
+    }, ...(ngDevMode ? [{ debugName: "displayValue" }] : /* istanbul ignore next */ []));
+    placeholderText = computed(() => {
+        switch (this.type()) {
+            case 'time':
+                return this._texts().timePlaceholder;
+            case 'datetime-local':
+                return this._texts().dateTimePlaceholder;
+            default:
+                return this._texts().datePlaceholder;
+        }
+    }, ...(ngDevMode ? [{ debugName: "placeholderText" }] : /* istanbul ignore next */ []));
+    monthLabel = computed(() => this.#capitalize(new Date(this._viewYear(), this._viewMonth(), 1).toLocaleDateString(this._resolvedLocale(), {
+        month: 'long',
+        year: 'numeric',
+    })), ...(ngDevMode ? [{ debugName: "monthLabel" }] : /* istanbul ignore next */ []));
+    weekdays = computed(() => this.#buildWeekdayLabels('narrow'), ...(ngDevMode ? [{ debugName: "weekdays" }] : /* istanbul ignore next */ []));
+    calendarDays = computed(() => {
+        const year = this._viewYear();
+        const month = this._viewMonth();
+        const today = new Date();
+        const firstDay = new Date(year, month, 1);
+        const startDow = (firstDay.getDay() + 6) % 7;
+        const days = [];
+        for (let i = startDow; i > 0; i--) {
+            days.push({
+                date: new Date(year, month, 1 - i),
+                inMonth: false,
+                isToday: false,
+                isSelected: false,
+            });
+        }
+        const daysInMonth = new Date(year, month + 1, 0).getDate();
+        for (let d = 1; d <= daysInMonth; d++) {
+            const date = new Date(year, month, d);
+            days.push({
+                date,
+                inMonth: true,
+                isToday: date.toDateString() === today.toDateString(),
+                isSelected: this._selYear() === year && this._selMonth() === month && this._selDay() === d,
+            });
+        }
+        let next = 1;
+        while (days.length < 42) {
+            days.push({
+                date: new Date(year, month + 1, next++),
+                inMonth: false,
+                isToday: false,
+                isSelected: false,
+            });
+        }
+        return days;
+    }, ...(ngDevMode ? [{ debugName: "calendarDays" }] : /* istanbul ignore next */ []));
+    hourSlots = computed(() => this._drumSlots(this._selHour(), 24), ...(ngDevMode ? [{ debugName: "hourSlots" }] : /* istanbul ignore next */ []));
+    minuteSlots = computed(() => this._drumSlots(this._selMinute(), 60), ...(ngDevMode ? [{ debugName: "minuteSlots" }] : /* istanbul ignore next */ []));
+    _drumSlots(value, max) {
+        return [-1, 0, 1].map((offset) => {
+            const v = (((value + offset) % max) + max) % max;
+            return { value: v, offset, label: String(v).padStart(2, '0') };
+        });
+    }
+    // ── Single actions ────────────────────────────────────────────────
+    toggle() {
+        if (this.isDisabledFinal())
+            return;
+        if (!this._isRange() && this.readonly())
+            return;
+        this.isOpen.update((v) => !v);
+    }
+    close() {
+        this.isOpen.set(false);
+    }
+    onDocumentClick(event) {
+        if (!this.el.nativeElement.contains(event.target))
+            this.close();
+    }
+    prevMonth() {
+        if (this._viewMonth() === 0) {
+            this._viewMonth.set(11);
+            this._viewYear.update((y) => y - 1);
+        }
+        else
+            this._viewMonth.update((m) => m - 1);
+    }
+    nextMonth() {
+        if (this._viewMonth() === 11) {
+            this._viewMonth.set(0);
+            this._viewYear.update((y) => y + 1);
+        }
+        else
+            this._viewMonth.update((m) => m + 1);
+    }
+    selectDay(day) {
+        if (!day.inMonth)
+            return;
+        this._selYear.set(day.date.getFullYear());
+        this._selMonth.set(day.date.getMonth());
+        this._selDay.set(day.date.getDate());
+        this._emitValue();
+        if (this.type() === 'date')
+            this.close();
+    }
+    formatDayLabel(date) {
+        return date.toLocaleDateString(this._resolvedLocale(), {
+            weekday: 'long',
+            year: 'numeric',
+            month: 'long',
+            day: 'numeric',
+        });
+    }
+    today() {
+        const d = new Date();
+        this._viewYear.set(d.getFullYear());
+        this._viewMonth.set(d.getMonth());
+        this.selectDay({ date: d, inMonth: true, isToday: true, isSelected: false });
+    }
+    clear() {
+        this._selYear.set(null);
+        this._selMonth.set(null);
+        this._selDay.set(null);
+        this._value.set('');
+        this._onChange('');
+        this.close();
+    }
+    changeHour(delta) {
+        this._selHour.update((h) => (((h + delta) % 24) + 24) % 24);
+        this._emitValue();
+    }
+    changeMinute(delta) {
+        this._selMinute.update((m) => (((m + delta) % 60) + 60) % 60);
+        this._emitValue();
+    }
+    onHourWheel(e) {
+        e.preventDefault();
+        this.changeHour(e.deltaY > 0 ? 1 : -1);
+    }
+    onMinuteWheel(e) {
+        e.preventDefault();
+        this.changeMinute(e.deltaY > 0 ? 1 : -1);
+    }
+    _emitValue() {
+        const t = this.type();
+        let v = '';
+        if (t === 'date' || t === 'datetime-local') {
+            if (this._selYear() === null)
+                return;
+            const y = this._selYear();
+            const mo = String(this._selMonth() + 1).padStart(2, '0');
+            const d = String(this._selDay()).padStart(2, '0');
+            const ds = `${y}-${mo}-${d}`;
+            v =
+                t === 'date'
+                    ? ds
+                    : `${ds}T${String(this._selHour()).padStart(2, '0')}:${String(this._selMinute()).padStart(2, '0')}`;
+        }
+        else {
+            v = `${String(this._selHour()).padStart(2, '0')}:${String(this._selMinute()).padStart(2, '0')}`;
+        }
+        this._value.set(v);
+        this._onChange(v);
+    }
+    // ── CVA ───────────────────────────────────────────────────────────
+    writeValue(value) {
+        if (this.type() === 'range') {
+            const v = value;
+            this._pickStart.set(v?.start ?? null);
+            this._pickEnd.set(v?.end ?? null);
+        }
+        else {
+            const v = value ?? '';
+            this._value.set(v);
+            if (!v)
+                return;
+            const t = this.type();
+            if (t === 'date') {
+                const d = new Date(v + 'T00:00:00');
+                if (!isNaN(d.getTime())) {
+                    this._selYear.set(d.getFullYear());
+                    this._selMonth.set(d.getMonth());
+                    this._selDay.set(d.getDate());
+                    this._viewYear.set(d.getFullYear());
+                    this._viewMonth.set(d.getMonth());
+                }
+            }
+            else if (t === 'time') {
+                const [h, m] = v.split(':').map(Number);
+                if (!isNaN(h))
+                    this._selHour.set(h);
+                if (!isNaN(m))
+                    this._selMinute.set(m);
+            }
+            else {
+                const [datePart, timePart] = v.split('T');
+                if (datePart) {
+                    const d = new Date(datePart + 'T00:00:00');
+                    if (!isNaN(d.getTime())) {
+                        this._selYear.set(d.getFullYear());
+                        this._selMonth.set(d.getMonth());
+                        this._selDay.set(d.getDate());
+                        this._viewYear.set(d.getFullYear());
+                        this._viewMonth.set(d.getMonth());
+                    }
+                }
+                if (timePart) {
+                    const [h, m] = timePart.split(':').map(Number);
+                    if (!isNaN(h))
+                        this._selHour.set(h);
+                    if (!isNaN(m))
+                        this._selMinute.set(m);
+                }
+            }
+        }
+    }
+    registerOnChange(fn) {
+        this._onChange = fn;
+    }
+    registerOnTouched(fn) {
+        this._onTouched = fn;
+    }
+    setDisabledState(isDisabled) {
+        this._cvaDisabled.set(isDisabled);
+    }
+    #normalizedLocale(locale) {
+        return locale?.trim() || '';
+    }
+    #capitalize(value) {
+        return value ? value.charAt(0).toUpperCase() + value.slice(1) : value;
+    }
+    #buildWeekdayLabels(style) {
+        const formatter = new Intl.DateTimeFormat(this._resolvedLocale(), {
+            weekday: style,
+            timeZone: 'UTC',
+        });
+        return Array.from({ length: 7 }, (_, index) => {
+            const label = formatter
+                .format(new Date(Date.UTC(2024, 0, 1 + index)))
+                .replace(/\.$/, '')
+                .trim();
+            if (style === 'narrow') {
+                return label.slice(0, 1).toUpperCase();
+            }
+            return this.#capitalize(label);
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NeuDateInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: NeuDateInputComponent, isStandalone: true, selector: "neu-date-input", inputs: { type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, errorMessage: { classPropertyName: "errorMessage", publicName: "errorMessage", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, step: { classPropertyName: "step", publicName: "step", isSignal: true, isRequired: false, transformFunction: null }, locale: { classPropertyName: "locale", publicName: "locale", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, dateFormat: { classPropertyName: "dateFormat", publicName: "dateFormat", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { rangeChange: "rangeChange" }, host: { listeners: { "keydown.escape": "close()", "document:click": "onDocumentClick($event)" }, properties: { "class.neu-date-input-host--sm": "size() === \"sm\"", "class.neu-date-input-host--lg": "size() === \"lg\"", "class.neu-drp": "_isRange()", "class.neu-drp--open": "_isRange() && isOpen()", "class.neu-drp--disabled": "_isRange() && isDisabledFinal()" }, classAttribute: "neu-date-input-host" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => NeuDateInputComponent),
+                multi: true,
+            },
+        ], ngImport: i0, template: `
+    @if (_isRange()) {
+      @if (label()) {
+        <label class="neu-drp__label" [for]="_id">{{ label() }}</label>
+      }
+      <button
+        type="button"
+        [id]="_id"
+        class="neu-drp__trigger"
+        [attr.aria-expanded]="isOpen()"
+        [attr.aria-label]="label() || _texts().rangeAriaLabel"
+        [disabled]="isDisabledFinal()"
+        (click)="toggle()"
+      >
+        <span class="neu-drp__icon" aria-hidden="true">
+          <svg
+            viewBox="0 0 24 24"
+            fill="none"
+            stroke="currentColor"
+            stroke-width="1.8"
+            stroke-linecap="round"
+            stroke-linejoin="round"
+          >
+            <rect x="3" y="4" width="18" height="18" rx="2" />
+            <line x1="16" y1="2" x2="16" y2="6" />
+            <line x1="8" y1="2" x2="8" y2="6" />
+            <line x1="3" y1="10" x2="21" y2="10" />
+          </svg>
+        </span>
+        <span class="neu-drp__value" [class.neu-drp__value--placeholder]="!_hasRange()">
+          {{ _hasRange() ? _rangeDisplayValue() : _rangePlaceholderText() }}
+        </span>
+      </button>
+      @if (isOpen()) {
+        <div
+          class="neu-drp__panel"
+          role="dialog"
+          aria-modal="true"
+          [attr.aria-label]="_texts().rangeAriaLabel"
+          (click)="$event.stopPropagation()"
+        >
+          <div class="neu-drp__calendars">
+            <div class="neu-drp__cal">
+              <div class="neu-drp__cal-nav">
+                <button type="button" [attr.aria-label]="_texts().prevMonth" (click)="_prevLeft()">
+                  ‹
+                </button>
+                <span class="neu-drp__cal-title">{{ _leftTitle() }}</span>
+                <button type="button" [attr.aria-label]="_texts().nextMonth" (click)="_nextLeft()">
+                  ›
+                </button>
+              </div>
+              <div class="neu-drp__cal-grid">
+                @for (d of _weekDayLabels(); track d) {
+                  <span class="neu-drp__day-label">{{ d }}</span>
+                }
+                @for (cell of _leftDays(); track cell.ts) {
+                  <button
+                    type="button"
+                    class="neu-drp__cell"
+                    [class.neu-drp__cell--other-month]="!cell.current"
+                    [class.neu-drp__cell--today]="cell.today"
+                    [class.neu-drp__cell--selected]="cell.selected"
+                    [class.neu-drp__cell--range-start]="cell.rangeStart"
+                    [class.neu-drp__cell--range-end]="cell.rangeEnd"
+                    [class.neu-drp__cell--in-range]="cell.inRange"
+                    [attr.aria-label]="cell.label"
+                    [attr.aria-pressed]="cell.selected"
+                    (click)="_selectDay(cell.date)"
+                    (mouseenter)="_hoverDay(cell.date)"
+                  >
+                    {{ cell.day }}
+                  </button>
+                }
+              </div>
+            </div>
+            <div class="neu-drp__cal">
+              <div class="neu-drp__cal-nav">
+                <button type="button" [attr.aria-label]="_texts().prevMonth" (click)="_prevRight()">
+                  ‹
+                </button>
+                <span class="neu-drp__cal-title">{{ _rightTitle() }}</span>
+                <button type="button" [attr.aria-label]="_texts().nextMonth" (click)="_nextRight()">
+                  ›
+                </button>
+              </div>
+              <div class="neu-drp__cal-grid">
+                @for (d of _weekDayLabels(); track d) {
+                  <span class="neu-drp__day-label">{{ d }}</span>
+                }
+                @for (cell of _rightDays(); track cell.ts) {
+                  <button
+                    type="button"
+                    class="neu-drp__cell"
+                    [class.neu-drp__cell--other-month]="!cell.current"
+                    [class.neu-drp__cell--today]="cell.today"
+                    [class.neu-drp__cell--selected]="cell.selected"
+                    [class.neu-drp__cell--range-start]="cell.rangeStart"
+                    [class.neu-drp__cell--range-end]="cell.rangeEnd"
+                    [class.neu-drp__cell--in-range]="cell.inRange"
+                    [attr.aria-label]="cell.label"
+                    [attr.aria-pressed]="cell.selected"
+                    (click)="_selectDay(cell.date)"
+                    (mouseenter)="_hoverDay(cell.date)"
+                  >
+                    {{ cell.day }}
+                  </button>
+                }
+              </div>
+            </div>
+          </div>
+          <div class="neu-drp__footer">
+            <button type="button" class="neu-drp__clear" (click)="_clearRange()">
+              {{ _texts().clear }}
+            </button>
+            <button
+              type="button"
+              class="neu-drp__apply"
+              [disabled]="!_canApply()"
+              (click)="_applyRange()"
+            >
+              {{ _texts().apply }}
+            </button>
+          </div>
+        </div>
+      }
+    } @else {
+      @if (label()) {
+        <label class="neu-date-input__label" [for]="_id">{{ label() }}</label>
+      }
+      <div
+        class="neu-date-input"
+        [class.neu-date-input--open]="isOpen()"
+        [class.neu-date-input--disabled]="isDisabledFinal()"
+        [class.neu-date-input--error]="hasError()"
+      >
+        <button
+          class="neu-date-input__trigger"
+          type="button"
+          [id]="_id"
+          [disabled]="isDisabledFinal() || readonly()"
+          [attr.aria-expanded]="isOpen()"
+          [attr.aria-haspopup]="'dialog'"
+          (click)="toggle()"
+        >
+          <span class="neu-date-input__icon" aria-hidden="true">
+            @if (type() === 'time') {
+              <svg
+                viewBox="0 0 24 24"
+                fill="none"
+                stroke="currentColor"
+                stroke-width="1.8"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+              >
+                <circle cx="12" cy="12" r="10" />
+                <polyline points="12 6 12 12 16 14" />
+              </svg>
+            } @else {
+              <svg
+                viewBox="0 0 24 24"
+                fill="none"
+                stroke="currentColor"
+                stroke-width="1.8"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+              >
+                <rect x="3" y="4" width="18" height="18" rx="2" />
+                <line x1="16" y1="2" x2="16" y2="6" />
+                <line x1="8" y1="2" x2="8" y2="6" />
+                <line x1="3" y1="10" x2="21" y2="10" />
+              </svg>
+            }
+          </span>
+          <span
+            class="neu-date-input__display"
+            [class.neu-date-input__display--placeholder]="!_value()"
+          >
+            {{ displayValue() || placeholderText() }}
+          </span>
+        </button>
+        @if (isOpen()) {
+          <div
+            class="neu-date-input__panel"
+            [class.neu-date-input__panel--time-only]="type() === 'time'"
+            role="dialog"
+            [attr.aria-label]="_texts().chooseDate + (monthLabel() ? ': ' + monthLabel() : '')"
+            (click)="$event.stopPropagation()"
+          >
+            @if (type() !== 'time') {
+              <div class="neu-date-input__calendar">
+                <div class="neu-date-input__cal-nav">
+                  <button
+                    class="neu-date-input__cal-arrow"
+                    type="button"
+                    (click)="prevMonth()"
+                    [attr.aria-label]="_texts().prevMonth"
+                  >
+                    <svg
+                      viewBox="0 0 24 24"
+                      fill="none"
+                      stroke="currentColor"
+                      stroke-width="2"
+                      stroke-linecap="round"
+                      aria-hidden="true"
+                    >
+                      <polyline points="15 18 9 12 15 6" />
+                    </svg>
+                  </button>
+                  <span class="neu-date-input__cal-title">{{ monthLabel() }}</span>
+                  <button
+                    class="neu-date-input__cal-arrow"
+                    type="button"
+                    (click)="nextMonth()"
+                    [attr.aria-label]="_texts().nextMonth"
+                  >
+                    <svg
+                      viewBox="0 0 24 24"
+                      fill="none"
+                      stroke="currentColor"
+                      stroke-width="2"
+                      stroke-linecap="round"
+                      aria-hidden="true"
+                    >
+                      <polyline points="9 18 15 12 9 6" />
+                    </svg>
+                  </button>
+                </div>
+                <div class="neu-date-input__cal-weekdays">
+                  @for (d of weekdays(); track d) {
+                    <span>{{ d }}</span>
+                  }
+                </div>
+                <div class="neu-date-input__cal-grid">
+                  @for (day of calendarDays(); track day.date.getTime()) {
+                    <button
+                      class="neu-date-input__cal-day"
+                      type="button"
+                      [class.neu-date-input__cal-day--other]="!day.inMonth"
+                      [class.neu-date-input__cal-day--today]="day.isToday"
+                      [class.neu-date-input__cal-day--selected]="day.isSelected"
+                      [attr.aria-label]="formatDayLabel(day.date)"
+                      [attr.aria-pressed]="day.isSelected"
+                      (click)="selectDay(day)"
+                    >
+                      {{ day.date.getDate() }}
+                    </button>
+                  }
+                </div>
+                <div class="neu-date-input__cal-footer">
+                  <button class="neu-date-input__cal-footer-btn" type="button" (click)="clear()">
+                    {{ _texts().delete }}
+                  </button>
+                  <button
+                    class="neu-date-input__cal-footer-btn neu-date-input__cal-footer-btn--today"
+                    type="button"
+                    (click)="today()"
+                  >
+                    {{ _texts().today }}
+                  </button>
+                </div>
+              </div>
+            }
+            @if (type() === 'datetime-local') {
+              <div class="neu-date-input__sep"></div>
+            }
+            @if (type() !== 'date') {
+              <div class="neu-date-input__time">
+                <div class="neu-date-input__drum">
+                  <button
+                    class="neu-date-input__drum-arrow"
+                    type="button"
+                    (click)="changeHour(-1)"
+                    [attr.aria-label]="_texts().prevHour"
+                  >
+                    <svg
+                      viewBox="0 0 24 24"
+                      fill="none"
+                      stroke="currentColor"
+                      stroke-width="2.5"
+                      stroke-linecap="round"
+                      aria-hidden="true"
+                    >
+                      <polyline points="18 15 12 9 6 15" />
+                    </svg>
+                  </button>
+                  <div class="neu-date-input__drum-track" (wheel)="onHourWheel($event)">
+                    @for (slot of hourSlots(); track slot.offset) {
+                      <div
+                        class="neu-date-input__drum-item"
+                        [class.neu-date-input__drum-item--selected]="slot.offset === 0"
+                        [class.neu-date-input__drum-item--adjacent]="slot.offset !== 0"
+                        (click)="slot.offset !== 0 && changeHour(slot.offset)"
+                      >
+                        {{ slot.label }}
+                      </div>
+                    }
+                  </div>
+                  <button
+                    class="neu-date-input__drum-arrow"
+                    type="button"
+                    (click)="changeHour(1)"
+                    [attr.aria-label]="_texts().nextHour"
+                  >
+                    <svg
+                      viewBox="0 0 24 24"
+                      fill="none"
+                      stroke="currentColor"
+                      stroke-width="2.5"
+                      stroke-linecap="round"
+                      aria-hidden="true"
+                    >
+                      <polyline points="6 9 12 15 18 9" />
+                    </svg>
+                  </button>
+                </div>
+                <span class="neu-date-input__time-colon">:</span>
+                <div class="neu-date-input__drum">
+                  <button
+                    class="neu-date-input__drum-arrow"
+                    type="button"
+                    (click)="changeMinute(-1)"
+                    [attr.aria-label]="_texts().prevMinute"
+                  >
+                    <svg
+                      viewBox="0 0 24 24"
+                      fill="none"
+                      stroke="currentColor"
+                      stroke-width="2.5"
+                      stroke-linecap="round"
+                      aria-hidden="true"
+                    >
+                      <polyline points="18 15 12 9 6 15" />
+                    </svg>
+                  </button>
+                  <div class="neu-date-input__drum-track" (wheel)="onMinuteWheel($event)">
+                    @for (slot of minuteSlots(); track slot.offset) {
+                      <div
+                        class="neu-date-input__drum-item"
+                        [class.neu-date-input__drum-item--selected]="slot.offset === 0"
+                        [class.neu-date-input__drum-item--adjacent]="slot.offset !== 0"
+                        (click)="slot.offset !== 0 && changeMinute(slot.offset)"
+                      >
+                        {{ slot.label }}
+                      </div>
+                    }
+                  </div>
+                  <button
+                    class="neu-date-input__drum-arrow"
+                    type="button"
+                    (click)="changeMinute(1)"
+                    [attr.aria-label]="_texts().nextMinute"
+                  >
+                    <svg
+                      viewBox="0 0 24 24"
+                      fill="none"
+                      stroke="currentColor"
+                      stroke-width="2.5"
+                      stroke-linecap="round"
+                      aria-hidden="true"
+                    >
+                      <polyline points="6 9 12 15 18 9" />
+                    </svg>
+                  </button>
+                </div>
+              </div>
+            }
+          </div>
+        }
+      </div>
+      @if (hasError()) {
+        <p class="neu-date-input__error" role="alert">{{ errorMessage() }}</p>
+      } @else if (hint()) {
+        <p class="neu-date-input__hint">{{ hint() }}</p>
+      }
+    }
+  `, isInline: true, styles: [".neu-date-input-host{display:block;font-family:var(--neu-font-sans)}.neu-date-input__label{display:block;font-size:var(--neu-text-sm);font-weight:500;color:var(--neu-text-muted);margin-bottom:var(--neu-space-2)}.neu-date-input{position:relative;font-family:var(--neu-font-sans)}.neu-date-input__trigger{display:flex;align-items:center;gap:var(--neu-space-2);width:100%;min-height:48px;padding:0 var(--neu-space-3);background:var(--neu-surface);border:1.5px solid var(--neu-border);border-radius:var(--neu-radius);cursor:pointer;text-align:left;font-family:var(--neu-font-sans);font-size:var(--neu-text-base);color:var(--neu-text);transition:border-color var(--neu-transition),box-shadow var(--neu-transition)}.neu-date-input__trigger:hover:not(:disabled){border-color:var(--neu-border-hover, var(--neu-border))}.neu-date-input__trigger:disabled{opacity:.6;cursor:not-allowed;background:var(--neu-surface-2)}.neu-date-input--open .neu-date-input__trigger{border-color:var(--neu-primary);box-shadow:var(--neu-focus-ring)}.neu-date-input--error .neu-date-input__trigger{border-color:var(--neu-error)}.neu-date-input__icon{display:flex;align-items:center;color:var(--neu-text-muted);flex-shrink:0}.neu-date-input__icon svg{width:18px;height:18px}.neu-date-input__display{flex:1;color:var(--neu-text);white-space:nowrap}.neu-date-input__display--placeholder{color:var(--neu-text-disabled)}.neu-date-input__panel{position:absolute;top:calc(100% + 6px);left:0;z-index:200;background:var(--neu-surface);border:1.5px solid var(--neu-border);border-radius:var(--neu-radius);box-shadow:var(--neu-shadow-lg);display:flex;flex-direction:column;overflow:hidden;animation:neu-datepicker-in .12s ease}.neu-date-input__panel--time-only{flex-direction:row}@media(max-width:600px){.neu-date-input__panel{left:auto;right:0;width:min(280px,100vw - 2rem);max-width:calc(100vw - 2rem)}}@keyframes neu-datepicker-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.neu-date-input__calendar{padding:var(--neu-space-3);width:280px;flex-shrink:0}.neu-date-input__cal-nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--neu-space-2)}.neu-date-input__cal-title{font-size:var(--neu-text-sm);font-weight:600;color:var(--neu-text);text-transform:capitalize}.neu-date-input__cal-arrow{display:flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;background:none;border:none;border-radius:var(--neu-radius-sm);color:var(--neu-text-muted);cursor:pointer;transition:background var(--neu-transition),color var(--neu-transition)}.neu-date-input__cal-arrow:hover{background:var(--neu-surface-2);color:var(--neu-text)}.neu-date-input__cal-arrow svg{width:15px;height:15px}.neu-date-input__cal-weekdays{display:grid;grid-template-columns:repeat(7,1fr);text-align:center;margin-bottom:4px}.neu-date-input__cal-weekdays span{font-size:11px;font-weight:600;color:var(--neu-text-muted);padding:4px 0;text-transform:uppercase}.neu-date-input__cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}.neu-date-input__cal-day{display:flex;align-items:center;justify-content:center;aspect-ratio:1;width:100%;padding:0;background:none;border:none;border-radius:var(--neu-radius-sm);font-family:var(--neu-font-sans);font-size:var(--neu-text-sm);color:var(--neu-text);cursor:pointer;transition:background var(--neu-transition),color var(--neu-transition)}.neu-date-input__cal-day:hover:not(.neu-date-input__cal-day--other):not(.neu-date-input__cal-day--selected){background:var(--neu-surface-2)}.neu-date-input__cal-day--other{color:var(--neu-text-disabled);pointer-events:none;cursor:default}.neu-date-input__cal-day--today{color:var(--neu-primary);font-weight:700}.neu-date-input__cal-day--selected{background:var(--neu-primary)!important;color:var(--neu-primary-fg)!important;font-weight:600}.neu-date-input__cal-footer{display:flex;justify-content:space-between;align-items:center;margin-top:var(--neu-space-2);padding-top:var(--neu-space-2);border-top:1px solid var(--neu-border)}.neu-date-input__cal-footer-btn{background:none;border:none;padding:4px 8px;font-family:var(--neu-font-sans);font-size:var(--neu-text-xs);color:var(--neu-text-muted);cursor:pointer;border-radius:var(--neu-radius-sm);transition:background var(--neu-transition),color var(--neu-transition)}.neu-date-input__cal-footer-btn:hover{background:var(--neu-surface-2);color:var(--neu-text)}.neu-date-input__cal-footer-btn--today{color:var(--neu-primary);font-weight:500}.neu-date-input__cal-footer-btn--today:hover{color:var(--neu-primary)}.neu-date-input__sep{height:1px;width:100%;background:var(--neu-border);flex-shrink:0}.neu-date-input__time{display:flex;align-items:center;justify-content:center;gap:var(--neu-space-1);padding:var(--neu-space-3) var(--neu-space-4);flex-shrink:0}.neu-date-input__time-colon{font-size:20px;font-weight:700;color:var(--neu-text);line-height:1;margin-bottom:4px;-webkit-user-select:none;user-select:none}.neu-date-input__drum{display:flex;flex-direction:column;align-items:center;gap:4px}.neu-date-input__drum-arrow{display:flex;align-items:center;justify-content:center;width:36px;height:24px;padding:0;background:none;border:none;border-radius:var(--neu-radius-sm);color:var(--neu-text-muted);cursor:pointer;transition:background var(--neu-transition),color var(--neu-transition)}.neu-date-input__drum-arrow:hover{background:var(--neu-surface-2);color:var(--neu-text)}.neu-date-input__drum-arrow svg{width:14px;height:14px}.neu-date-input__drum-track{position:relative;display:flex;flex-direction:column;align-items:center}.neu-date-input__drum-track:before{content:\"\";position:absolute;top:36px;left:-6px;right:-6px;height:36px;background:var(--neu-primary-soft, rgba(0, 122, 255, .1));border-radius:var(--neu-radius-sm);pointer-events:none}.neu-date-input__drum-item{position:relative;display:flex;align-items:center;justify-content:center;width:52px;height:36px;font-family:var(--neu-font-sans);font-weight:500;-webkit-user-select:none;user-select:none;border-radius:var(--neu-radius-sm);transition:opacity var(--neu-transition)}.neu-date-input__drum-item--adjacent{font-size:13px;color:var(--neu-text-muted);opacity:.45;cursor:pointer}.neu-date-input__drum-item--adjacent:hover{opacity:.75}.neu-date-input__drum-item--selected{font-size:22px;font-weight:700;color:var(--neu-primary);cursor:default}.neu-date-input__error{margin-top:var(--neu-space-1);font-size:var(--neu-text-xs);color:var(--neu-error-text, var(--neu-error));font-family:var(--neu-font-sans)}.neu-date-input__hint{margin-top:var(--neu-space-1);font-size:var(--neu-text-xs);color:var(--neu-text-muted);font-family:var(--neu-font-sans)}.neu-drp{position:relative;display:block;font-family:var(--neu-font-sans)}.neu-drp--disabled{opacity:.55;pointer-events:none}.neu-drp__label{display:block;font-size:var(--neu-text-sm);font-weight:500;color:var(--neu-text-muted);margin-bottom:var(--neu-space-2)}.neu-drp__trigger{all:unset;display:flex;align-items:center;gap:var(--neu-space-2);width:100%;min-height:48px;padding:0 var(--neu-space-3);border:1.5px solid var(--neu-border);border-radius:var(--neu-radius);background:var(--neu-surface);color:var(--neu-text);font-size:var(--neu-text-base);font-family:var(--neu-font-sans);cursor:pointer;box-sizing:border-box;transition:border-color var(--neu-transition),box-shadow var(--neu-transition)}.neu-drp__trigger:hover:not([disabled]){border-color:var(--neu-border-hover, var(--neu-border))}.neu-drp__trigger:focus-visible{outline:none;border-color:var(--neu-primary);box-shadow:var(--neu-focus-ring)}.neu-drp__trigger[disabled]{opacity:.6;cursor:not-allowed;background:var(--neu-surface-2)}.neu-drp--open .neu-drp__trigger{border-color:var(--neu-primary);box-shadow:var(--neu-focus-ring)}.neu-drp__icon{display:flex;align-items:center;color:var(--neu-text-muted);flex-shrink:0}.neu-drp__icon svg{width:18px;height:18px}.neu-drp__value{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.neu-drp__value--placeholder{color:var(--neu-text-disabled)}.neu-drp__panel{position:absolute;top:calc(100% + 6px);left:0;background:var(--neu-surface);border:1.5px solid var(--neu-border);border-radius:var(--neu-radius-lg);box-shadow:var(--neu-shadow-lg);padding:var(--neu-space-4);z-index:1000;animation:neu-drp-in .1s ease;min-width:560px}@keyframes neu-drp-in{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}.neu-drp__calendars{display:flex;gap:var(--neu-space-6)}.neu-drp__cal{flex:1}.neu-drp__cal-nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--neu-space-3)}.neu-drp__cal-nav button{all:unset;padding:4px 8px;border-radius:var(--neu-radius);cursor:pointer;font-size:1.1rem;color:var(--neu-text-muted)}.neu-drp__cal-nav button:hover{background:var(--neu-surface-2)}.neu-drp__cal-title{font-size:var(--neu-text-sm);font-weight:600;text-transform:capitalize;color:var(--neu-text)}.neu-drp__cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}.neu-drp__day-label{text-align:center;font-size:.7rem;font-weight:600;color:var(--neu-text-muted);padding:4px 0}.neu-drp__cell{all:unset;display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;font-size:var(--neu-text-sm);cursor:pointer;transition:background var(--neu-transition);box-sizing:border-box;margin:1px auto}.neu-drp__cell:hover{background:var(--neu-surface-2)}.neu-drp__cell--other-month{opacity:.35}.neu-drp__cell--today{font-weight:700;border:1.5px solid var(--neu-primary)}.neu-drp__cell--selected,.neu-drp__cell--range-start,.neu-drp__cell--range-end{background:var(--neu-primary);color:var(--neu-primary-fg);border-radius:50%}.neu-drp__cell--in-range{background:var(--neu-primary-soft, rgba(14, 165, 233, .15));border-radius:0}.neu-drp__footer{display:flex;justify-content:flex-end;gap:var(--neu-space-2);padding-top:var(--neu-space-3);border-top:1px solid var(--neu-border);margin-top:var(--neu-space-3)}.neu-drp__clear{all:unset;padding:7px 14px;border-radius:var(--neu-radius);font-size:var(--neu-text-sm);color:var(--neu-text-muted);cursor:pointer;background:var(--neu-surface-2)}.neu-drp__clear:hover{background:var(--neu-surface-3, var(--neu-surface-2));color:var(--neu-text)}.neu-drp__apply{all:unset;padding:7px 18px;border-radius:var(--neu-radius);font-size:var(--neu-text-sm);font-weight:500;background:var(--neu-primary);color:var(--neu-primary-fg);cursor:pointer}.neu-drp__apply:hover:not([disabled]){filter:brightness(1.08)}.neu-drp__apply[disabled]{opacity:.4;cursor:not-allowed}.neu-drp__apply:focus-visible{outline:2px solid var(--neu-primary);outline-offset:2px}@media(max-width:600px){.neu-drp__panel{left:0;right:auto;min-width:0;width:min(100%,360px,100vw - 2rem);max-width:calc(100vw - 2rem);padding:var(--neu-space-2)}.neu-drp__calendars{flex-direction:column;gap:var(--neu-space-4)}.neu-drp__cal{width:100%;max-width:320px;margin-inline:auto}.neu-drp__footer{flex-wrap:wrap}}.neu-date-input-host--sm .neu-date-input__trigger{min-height:36px;font-size:var(--neu-text-sm)}.neu-date-input-host--lg .neu-date-input__trigger{min-height:56px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NeuDateInputComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'neu-date-input', imports: [], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        class: 'neu-date-input-host',
+                        '[class.neu-date-input-host--sm]': 'size() === "sm"',
+                        '[class.neu-date-input-host--lg]': 'size() === "lg"',
+                        '[class.neu-drp]': '_isRange()',
+                        '[class.neu-drp--open]': '_isRange() && isOpen()',
+                        '[class.neu-drp--disabled]': '_isRange() && isDisabledFinal()',
+                        '(keydown.escape)': 'close()',
+                    }, providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => NeuDateInputComponent),
+                            multi: true,
+                        },
+                    ], template: `
+    @if (_isRange()) {
+      @if (label()) {
+        <label class="neu-drp__label" [for]="_id">{{ label() }}</label>
+      }
+      <button
+        type="button"
+        [id]="_id"
+        class="neu-drp__trigger"
+        [attr.aria-expanded]="isOpen()"
+        [attr.aria-label]="label() || _texts().rangeAriaLabel"
+        [disabled]="isDisabledFinal()"
+        (click)="toggle()"
+      >
+        <span class="neu-drp__icon" aria-hidden="true">
+          <svg
+            viewBox="0 0 24 24"
+            fill="none"
+            stroke="currentColor"
+            stroke-width="1.8"
+            stroke-linecap="round"
+            stroke-linejoin="round"
+          >
+            <rect x="3" y="4" width="18" height="18" rx="2" />
+            <line x1="16" y1="2" x2="16" y2="6" />
+            <line x1="8" y1="2" x2="8" y2="6" />
+            <line x1="3" y1="10" x2="21" y2="10" />
+          </svg>
+        </span>
+        <span class="neu-drp__value" [class.neu-drp__value--placeholder]="!_hasRange()">
+          {{ _hasRange() ? _rangeDisplayValue() : _rangePlaceholderText() }}
+        </span>
+      </button>
+      @if (isOpen()) {
+        <div
+          class="neu-drp__panel"
+          role="dialog"
+          aria-modal="true"
+          [attr.aria-label]="_texts().rangeAriaLabel"
+          (click)="$event.stopPropagation()"
+        >
+          <div class="neu-drp__calendars">
+            <div class="neu-drp__cal">
+              <div class="neu-drp__cal-nav">
+                <button type="button" [attr.aria-label]="_texts().prevMonth" (click)="_prevLeft()">
+                  ‹
+                </button>
+                <span class="neu-drp__cal-title">{{ _leftTitle() }}</span>
+                <button type="button" [attr.aria-label]="_texts().nextMonth" (click)="_nextLeft()">
+                  ›
+                </button>
+              </div>
+              <div class="neu-drp__cal-grid">
+                @for (d of _weekDayLabels(); track d) {
+                  <span class="neu-drp__day-label">{{ d }}</span>
+                }
+                @for (cell of _leftDays(); track cell.ts) {
+                  <button
+                    type="button"
+                    class="neu-drp__cell"
+                    [class.neu-drp__cell--other-month]="!cell.current"
+                    [class.neu-drp__cell--today]="cell.today"
+                    [class.neu-drp__cell--selected]="cell.selected"
+                    [class.neu-drp__cell--range-start]="cell.rangeStart"
+                    [class.neu-drp__cell--range-end]="cell.rangeEnd"
+                    [class.neu-drp__cell--in-range]="cell.inRange"
+                    [attr.aria-label]="cell.label"
+                    [attr.aria-pressed]="cell.selected"
+                    (click)="_selectDay(cell.date)"
+                    (mouseenter)="_hoverDay(cell.date)"
+                  >
+                    {{ cell.day }}
+                  </button>
+                }
+              </div>
+            </div>
+            <div class="neu-drp__cal">
+              <div class="neu-drp__cal-nav">
+                <button type="button" [attr.aria-label]="_texts().prevMonth" (click)="_prevRight()">
+                  ‹
+                </button>
+                <span class="neu-drp__cal-title">{{ _rightTitle() }}</span>
+                <button type="button" [attr.aria-label]="_texts().nextMonth" (click)="_nextRight()">
+                  ›
+                </button>
+              </div>
+              <div class="neu-drp__cal-grid">
+                @for (d of _weekDayLabels(); track d) {
+                  <span class="neu-drp__day-label">{{ d }}</span>
+                }
+                @for (cell of _rightDays(); track cell.ts) {
+                  <button
+                    type="button"
+                    class="neu-drp__cell"
+                    [class.neu-drp__cell--other-month]="!cell.current"
+                    [class.neu-drp__cell--today]="cell.today"
+                    [class.neu-drp__cell--selected]="cell.selected"
+                    [class.neu-drp__cell--range-start]="cell.rangeStart"
+                    [class.neu-drp__cell--range-end]="cell.rangeEnd"
+                    [class.neu-drp__cell--in-range]="cell.inRange"
+                    [attr.aria-label]="cell.label"
+                    [attr.aria-pressed]="cell.selected"
+                    (click)="_selectDay(cell.date)"
+                    (mouseenter)="_hoverDay(cell.date)"
+                  >
+                    {{ cell.day }}
+                  </button>
+                }
+              </div>
+            </div>
+          </div>
+          <div class="neu-drp__footer">
+            <button type="button" class="neu-drp__clear" (click)="_clearRange()">
+              {{ _texts().clear }}
+            </button>
+            <button
+              type="button"
+              class="neu-drp__apply"
+              [disabled]="!_canApply()"
+              (click)="_applyRange()"
+            >
+              {{ _texts().apply }}
+            </button>
+          </div>
+        </div>
+      }
+    } @else {
+      @if (label()) {
+        <label class="neu-date-input__label" [for]="_id">{{ label() }}</label>
+      }
+      <div
+        class="neu-date-input"
+        [class.neu-date-input--open]="isOpen()"
+        [class.neu-date-input--disabled]="isDisabledFinal()"
+        [class.neu-date-input--error]="hasError()"
+      >
+        <button
+          class="neu-date-input__trigger"
+          type="button"
+          [id]="_id"
+          [disabled]="isDisabledFinal() || readonly()"
+          [attr.aria-expanded]="isOpen()"
+          [attr.aria-haspopup]="'dialog'"
+          (click)="toggle()"
+        >
+          <span class="neu-date-input__icon" aria-hidden="true">
+            @if (type() === 'time') {
+              <svg
+                viewBox="0 0 24 24"
+                fill="none"
+                stroke="currentColor"
+                stroke-width="1.8"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+              >
+                <circle cx="12" cy="12" r="10" />
+                <polyline points="12 6 12 12 16 14" />
+              </svg>
+            } @else {
+              <svg
+                viewBox="0 0 24 24"
+                fill="none"
+                stroke="currentColor"
+                stroke-width="1.8"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+              >
+                <rect x="3" y="4" width="18" height="18" rx="2" />
+                <line x1="16" y1="2" x2="16" y2="6" />
+                <line x1="8" y1="2" x2="8" y2="6" />
+                <line x1="3" y1="10" x2="21" y2="10" />
+              </svg>
+            }
+          </span>
+          <span
+            class="neu-date-input__display"
+            [class.neu-date-input__display--placeholder]="!_value()"
+          >
+            {{ displayValue() || placeholderText() }}
+          </span>
+        </button>
+        @if (isOpen()) {
+          <div
+            class="neu-date-input__panel"
+            [class.neu-date-input__panel--time-only]="type() === 'time'"
+            role="dialog"
+            [attr.aria-label]="_texts().chooseDate + (monthLabel() ? ': ' + monthLabel() : '')"
+            (click)="$event.stopPropagation()"
+          >
+            @if (type() !== 'time') {
+              <div class="neu-date-input__calendar">
+                <div class="neu-date-input__cal-nav">
+                  <button
+                    class="neu-date-input__cal-arrow"
+                    type="button"
+                    (click)="prevMonth()"
+                    [attr.aria-label]="_texts().prevMonth"
+                  >
+                    <svg
+                      viewBox="0 0 24 24"
+                      fill="none"
+                      stroke="currentColor"
+                      stroke-width="2"
+                      stroke-linecap="round"
+                      aria-hidden="true"
+                    >
+                      <polyline points="15 18 9 12 15 6" />
+                    </svg>
+                  </button>
+                  <span class="neu-date-input__cal-title">{{ monthLabel() }}</span>
+                  <button
+                    class="neu-date-input__cal-arrow"
+                    type="button"
+                    (click)="nextMonth()"
+                    [attr.aria-label]="_texts().nextMonth"
+                  >
+                    <svg
+                      viewBox="0 0 24 24"
+                      fill="none"
+                      stroke="currentColor"
+                      stroke-width="2"
+                      stroke-linecap="round"
+                      aria-hidden="true"
+                    >
+                      <polyline points="9 18 15 12 9 6" />
+                    </svg>
+                  </button>
+                </div>
+                <div class="neu-date-input__cal-weekdays">
+                  @for (d of weekdays(); track d) {
+                    <span>{{ d }}</span>
+                  }
+                </div>
+                <div class="neu-date-input__cal-grid">
+                  @for (day of calendarDays(); track day.date.getTime()) {
+                    <button
+                      class="neu-date-input__cal-day"
+                      type="button"
+                      [class.neu-date-input__cal-day--other]="!day.inMonth"
+                      [class.neu-date-input__cal-day--today]="day.isToday"
+                      [class.neu-date-input__cal-day--selected]="day.isSelected"
+                      [attr.aria-label]="formatDayLabel(day.date)"
+                      [attr.aria-pressed]="day.isSelected"
+                      (click)="selectDay(day)"
+                    >
+                      {{ day.date.getDate() }}
+                    </button>
+                  }
+                </div>
+                <div class="neu-date-input__cal-footer">
+                  <button class="neu-date-input__cal-footer-btn" type="button" (click)="clear()">
+                    {{ _texts().delete }}
+                  </button>
+                  <button
+                    class="neu-date-input__cal-footer-btn neu-date-input__cal-footer-btn--today"
+                    type="button"
+                    (click)="today()"
+                  >
+                    {{ _texts().today }}
+                  </button>
+                </div>
+              </div>
+            }
+            @if (type() === 'datetime-local') {
+              <div class="neu-date-input__sep"></div>
+            }
+            @if (type() !== 'date') {
+              <div class="neu-date-input__time">
+                <div class="neu-date-input__drum">
+                  <button
+                    class="neu-date-input__drum-arrow"
+                    type="button"
+                    (click)="changeHour(-1)"
+                    [attr.aria-label]="_texts().prevHour"
+                  >
+                    <svg
+                      viewBox="0 0 24 24"
+                      fill="none"
+                      stroke="currentColor"
+                      stroke-width="2.5"
+                      stroke-linecap="round"
+                      aria-hidden="true"
+                    >
+                      <polyline points="18 15 12 9 6 15" />
+                    </svg>
+                  </button>
+                  <div class="neu-date-input__drum-track" (wheel)="onHourWheel($event)">
+                    @for (slot of hourSlots(); track slot.offset) {
+                      <div
+                        class="neu-date-input__drum-item"
+                        [class.neu-date-input__drum-item--selected]="slot.offset === 0"
+                        [class.neu-date-input__drum-item--adjacent]="slot.offset !== 0"
+                        (click)="slot.offset !== 0 && changeHour(slot.offset)"
+                      >
+                        {{ slot.label }}
+                      </div>
+                    }
+                  </div>
+                  <button
+                    class="neu-date-input__drum-arrow"
+                    type="button"
+                    (click)="changeHour(1)"
+                    [attr.aria-label]="_texts().nextHour"
+                  >
+                    <svg
+                      viewBox="0 0 24 24"
+                      fill="none"
+                      stroke="currentColor"
+                      stroke-width="2.5"
+                      stroke-linecap="round"
+                      aria-hidden="true"
+                    >
+                      <polyline points="6 9 12 15 18 9" />
+                    </svg>
+                  </button>
+                </div>
+                <span class="neu-date-input__time-colon">:</span>
+                <div class="neu-date-input__drum">
+                  <button
+                    class="neu-date-input__drum-arrow"
+                    type="button"
+                    (click)="changeMinute(-1)"
+                    [attr.aria-label]="_texts().prevMinute"
+                  >
+                    <svg
+                      viewBox="0 0 24 24"
+                      fill="none"
+                      stroke="currentColor"
+                      stroke-width="2.5"
+                      stroke-linecap="round"
+                      aria-hidden="true"
+                    >
+                      <polyline points="18 15 12 9 6 15" />
+                    </svg>
+                  </button>
+                  <div class="neu-date-input__drum-track" (wheel)="onMinuteWheel($event)">
+                    @for (slot of minuteSlots(); track slot.offset) {
+                      <div
+                        class="neu-date-input__drum-item"
+                        [class.neu-date-input__drum-item--selected]="slot.offset === 0"
+                        [class.neu-date-input__drum-item--adjacent]="slot.offset !== 0"
+                        (click)="slot.offset !== 0 && changeMinute(slot.offset)"
+                      >
+                        {{ slot.label }}
+                      </div>
+                    }
+                  </div>
+                  <button
+                    class="neu-date-input__drum-arrow"
+                    type="button"
+                    (click)="changeMinute(1)"
+                    [attr.aria-label]="_texts().nextMinute"
+                  >
+                    <svg
+                      viewBox="0 0 24 24"
+                      fill="none"
+                      stroke="currentColor"
+                      stroke-width="2.5"
+                      stroke-linecap="round"
+                      aria-hidden="true"
+                    >
+                      <polyline points="6 9 12 15 18 9" />
+                    </svg>
+                  </button>
+                </div>
+              </div>
+            }
+          </div>
+        }
+      </div>
+      @if (hasError()) {
+        <p class="neu-date-input__error" role="alert">{{ errorMessage() }}</p>
+      } @else if (hint()) {
+        <p class="neu-date-input__hint">{{ hint() }}</p>
+      }
+    }
+  `, styles: [".neu-date-input-host{display:block;font-family:var(--neu-font-sans)}.neu-date-input__label{display:block;font-size:var(--neu-text-sm);font-weight:500;color:var(--neu-text-muted);margin-bottom:var(--neu-space-2)}.neu-date-input{position:relative;font-family:var(--neu-font-sans)}.neu-date-input__trigger{display:flex;align-items:center;gap:var(--neu-space-2);width:100%;min-height:48px;padding:0 var(--neu-space-3);background:var(--neu-surface);border:1.5px solid var(--neu-border);border-radius:var(--neu-radius);cursor:pointer;text-align:left;font-family:var(--neu-font-sans);font-size:var(--neu-text-base);color:var(--neu-text);transition:border-color var(--neu-transition),box-shadow var(--neu-transition)}.neu-date-input__trigger:hover:not(:disabled){border-color:var(--neu-border-hover, var(--neu-border))}.neu-date-input__trigger:disabled{opacity:.6;cursor:not-allowed;background:var(--neu-surface-2)}.neu-date-input--open .neu-date-input__trigger{border-color:var(--neu-primary);box-shadow:var(--neu-focus-ring)}.neu-date-input--error .neu-date-input__trigger{border-color:var(--neu-error)}.neu-date-input__icon{display:flex;align-items:center;color:var(--neu-text-muted);flex-shrink:0}.neu-date-input__icon svg{width:18px;height:18px}.neu-date-input__display{flex:1;color:var(--neu-text);white-space:nowrap}.neu-date-input__display--placeholder{color:var(--neu-text-disabled)}.neu-date-input__panel{position:absolute;top:calc(100% + 6px);left:0;z-index:200;background:var(--neu-surface);border:1.5px solid var(--neu-border);border-radius:var(--neu-radius);box-shadow:var(--neu-shadow-lg);display:flex;flex-direction:column;overflow:hidden;animation:neu-datepicker-in .12s ease}.neu-date-input__panel--time-only{flex-direction:row}@media(max-width:600px){.neu-date-input__panel{left:auto;right:0;width:min(280px,100vw - 2rem);max-width:calc(100vw - 2rem)}}@keyframes neu-datepicker-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.neu-date-input__calendar{padding:var(--neu-space-3);width:280px;flex-shrink:0}.neu-date-input__cal-nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--neu-space-2)}.neu-date-input__cal-title{font-size:var(--neu-text-sm);font-weight:600;color:var(--neu-text);text-transform:capitalize}.neu-date-input__cal-arrow{display:flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;background:none;border:none;border-radius:var(--neu-radius-sm);color:var(--neu-text-muted);cursor:pointer;transition:background var(--neu-transition),color var(--neu-transition)}.neu-date-input__cal-arrow:hover{background:var(--neu-surface-2);color:var(--neu-text)}.neu-date-input__cal-arrow svg{width:15px;height:15px}.neu-date-input__cal-weekdays{display:grid;grid-template-columns:repeat(7,1fr);text-align:center;margin-bottom:4px}.neu-date-input__cal-weekdays span{font-size:11px;font-weight:600;color:var(--neu-text-muted);padding:4px 0;text-transform:uppercase}.neu-date-input__cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}.neu-date-input__cal-day{display:flex;align-items:center;justify-content:center;aspect-ratio:1;width:100%;padding:0;background:none;border:none;border-radius:var(--neu-radius-sm);font-family:var(--neu-font-sans);font-size:var(--neu-text-sm);color:var(--neu-text);cursor:pointer;transition:background var(--neu-transition),color var(--neu-transition)}.neu-date-input__cal-day:hover:not(.neu-date-input__cal-day--other):not(.neu-date-input__cal-day--selected){background:var(--neu-surface-2)}.neu-date-input__cal-day--other{color:var(--neu-text-disabled);pointer-events:none;cursor:default}.neu-date-input__cal-day--today{color:var(--neu-primary);font-weight:700}.neu-date-input__cal-day--selected{background:var(--neu-primary)!important;color:var(--neu-primary-fg)!important;font-weight:600}.neu-date-input__cal-footer{display:flex;justify-content:space-between;align-items:center;margin-top:var(--neu-space-2);padding-top:var(--neu-space-2);border-top:1px solid var(--neu-border)}.neu-date-input__cal-footer-btn{background:none;border:none;padding:4px 8px;font-family:var(--neu-font-sans);font-size:var(--neu-text-xs);color:var(--neu-text-muted);cursor:pointer;border-radius:var(--neu-radius-sm);transition:background var(--neu-transition),color var(--neu-transition)}.neu-date-input__cal-footer-btn:hover{background:var(--neu-surface-2);color:var(--neu-text)}.neu-date-input__cal-footer-btn--today{color:var(--neu-primary);font-weight:500}.neu-date-input__cal-footer-btn--today:hover{color:var(--neu-primary)}.neu-date-input__sep{height:1px;width:100%;background:var(--neu-border);flex-shrink:0}.neu-date-input__time{display:flex;align-items:center;justify-content:center;gap:var(--neu-space-1);padding:var(--neu-space-3) var(--neu-space-4);flex-shrink:0}.neu-date-input__time-colon{font-size:20px;font-weight:700;color:var(--neu-text);line-height:1;margin-bottom:4px;-webkit-user-select:none;user-select:none}.neu-date-input__drum{display:flex;flex-direction:column;align-items:center;gap:4px}.neu-date-input__drum-arrow{display:flex;align-items:center;justify-content:center;width:36px;height:24px;padding:0;background:none;border:none;border-radius:var(--neu-radius-sm);color:var(--neu-text-muted);cursor:pointer;transition:background var(--neu-transition),color var(--neu-transition)}.neu-date-input__drum-arrow:hover{background:var(--neu-surface-2);color:var(--neu-text)}.neu-date-input__drum-arrow svg{width:14px;height:14px}.neu-date-input__drum-track{position:relative;display:flex;flex-direction:column;align-items:center}.neu-date-input__drum-track:before{content:\"\";position:absolute;top:36px;left:-6px;right:-6px;height:36px;background:var(--neu-primary-soft, rgba(0, 122, 255, .1));border-radius:var(--neu-radius-sm);pointer-events:none}.neu-date-input__drum-item{position:relative;display:flex;align-items:center;justify-content:center;width:52px;height:36px;font-family:var(--neu-font-sans);font-weight:500;-webkit-user-select:none;user-select:none;border-radius:var(--neu-radius-sm);transition:opacity var(--neu-transition)}.neu-date-input__drum-item--adjacent{font-size:13px;color:var(--neu-text-muted);opacity:.45;cursor:pointer}.neu-date-input__drum-item--adjacent:hover{opacity:.75}.neu-date-input__drum-item--selected{font-size:22px;font-weight:700;color:var(--neu-primary);cursor:default}.neu-date-input__error{margin-top:var(--neu-space-1);font-size:var(--neu-text-xs);color:var(--neu-error-text, var(--neu-error));font-family:var(--neu-font-sans)}.neu-date-input__hint{margin-top:var(--neu-space-1);font-size:var(--neu-text-xs);color:var(--neu-text-muted);font-family:var(--neu-font-sans)}.neu-drp{position:relative;display:block;font-family:var(--neu-font-sans)}.neu-drp--disabled{opacity:.55;pointer-events:none}.neu-drp__label{display:block;font-size:var(--neu-text-sm);font-weight:500;color:var(--neu-text-muted);margin-bottom:var(--neu-space-2)}.neu-drp__trigger{all:unset;display:flex;align-items:center;gap:var(--neu-space-2);width:100%;min-height:48px;padding:0 var(--neu-space-3);border:1.5px solid var(--neu-border);border-radius:var(--neu-radius);background:var(--neu-surface);color:var(--neu-text);font-size:var(--neu-text-base);font-family:var(--neu-font-sans);cursor:pointer;box-sizing:border-box;transition:border-color var(--neu-transition),box-shadow var(--neu-transition)}.neu-drp__trigger:hover:not([disabled]){border-color:var(--neu-border-hover, var(--neu-border))}.neu-drp__trigger:focus-visible{outline:none;border-color:var(--neu-primary);box-shadow:var(--neu-focus-ring)}.neu-drp__trigger[disabled]{opacity:.6;cursor:not-allowed;background:var(--neu-surface-2)}.neu-drp--open .neu-drp__trigger{border-color:var(--neu-primary);box-shadow:var(--neu-focus-ring)}.neu-drp__icon{display:flex;align-items:center;color:var(--neu-text-muted);flex-shrink:0}.neu-drp__icon svg{width:18px;height:18px}.neu-drp__value{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.neu-drp__value--placeholder{color:var(--neu-text-disabled)}.neu-drp__panel{position:absolute;top:calc(100% + 6px);left:0;background:var(--neu-surface);border:1.5px solid var(--neu-border);border-radius:var(--neu-radius-lg);box-shadow:var(--neu-shadow-lg);padding:var(--neu-space-4);z-index:1000;animation:neu-drp-in .1s ease;min-width:560px}@keyframes neu-drp-in{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}.neu-drp__calendars{display:flex;gap:var(--neu-space-6)}.neu-drp__cal{flex:1}.neu-drp__cal-nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--neu-space-3)}.neu-drp__cal-nav button{all:unset;padding:4px 8px;border-radius:var(--neu-radius);cursor:pointer;font-size:1.1rem;color:var(--neu-text-muted)}.neu-drp__cal-nav button:hover{background:var(--neu-surface-2)}.neu-drp__cal-title{font-size:var(--neu-text-sm);font-weight:600;text-transform:capitalize;color:var(--neu-text)}.neu-drp__cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}.neu-drp__day-label{text-align:center;font-size:.7rem;font-weight:600;color:var(--neu-text-muted);padding:4px 0}.neu-drp__cell{all:unset;display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;font-size:var(--neu-text-sm);cursor:pointer;transition:background var(--neu-transition);box-sizing:border-box;margin:1px auto}.neu-drp__cell:hover{background:var(--neu-surface-2)}.neu-drp__cell--other-month{opacity:.35}.neu-drp__cell--today{font-weight:700;border:1.5px solid var(--neu-primary)}.neu-drp__cell--selected,.neu-drp__cell--range-start,.neu-drp__cell--range-end{background:var(--neu-primary);color:var(--neu-primary-fg);border-radius:50%}.neu-drp__cell--in-range{background:var(--neu-primary-soft, rgba(14, 165, 233, .15));border-radius:0}.neu-drp__footer{display:flex;justify-content:flex-end;gap:var(--neu-space-2);padding-top:var(--neu-space-3);border-top:1px solid var(--neu-border);margin-top:var(--neu-space-3)}.neu-drp__clear{all:unset;padding:7px 14px;border-radius:var(--neu-radius);font-size:var(--neu-text-sm);color:var(--neu-text-muted);cursor:pointer;background:var(--neu-surface-2)}.neu-drp__clear:hover{background:var(--neu-surface-3, var(--neu-surface-2));color:var(--neu-text)}.neu-drp__apply{all:unset;padding:7px 18px;border-radius:var(--neu-radius);font-size:var(--neu-text-sm);font-weight:500;background:var(--neu-primary);color:var(--neu-primary-fg);cursor:pointer}.neu-drp__apply:hover:not([disabled]){filter:brightness(1.08)}.neu-drp__apply[disabled]{opacity:.4;cursor:not-allowed}.neu-drp__apply:focus-visible{outline:2px solid var(--neu-primary);outline-offset:2px}@media(max-width:600px){.neu-drp__panel{left:0;right:auto;min-width:0;width:min(100%,360px,100vw - 2rem);max-width:calc(100vw - 2rem);padding:var(--neu-space-2)}.neu-drp__calendars{flex-direction:column;gap:var(--neu-space-4)}.neu-drp__cal{width:100%;max-width:320px;margin-inline:auto}.neu-drp__footer{flex-wrap:wrap}}.neu-date-input-host--sm .neu-date-input__trigger{min-height:36px;font-size:var(--neu-text-sm)}.neu-date-input-host--lg .neu-date-input__trigger{min-height:56px}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], errorMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorMessage", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], min: [{ type: i0.Input, args: [{ isSignal: true, alias: "min", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], step: [{ type: i0.Input, args: [{ isSignal: true, alias: "step", required: false }] }], locale: [{ type: i0.Input, args: [{ isSignal: true, alias: "locale", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], dateFormat: [{ type: i0.Input, args: [{ isSignal: true, alias: "dateFormat", required: false }] }], rangeChange: [{ type: i0.Output, args: ["rangeChange"] }], onDocumentClick: [{
+                type: HostListener,
+                args: ['document:click', ['$event']]
+            }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { NeuDateInputComponent };
+//# sourceMappingURL=neural-ui-core-date-input.mjs.map