@malva-ui/core 0.1.12

package/esm2022/data-table/lib/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../../libs/core/data-table/src/lib/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { MlvTone } from '@malva-ui/cdk/utils';\nimport type { MlvDataSourceFilterOperator } from '@malva-ui/cdk/data-source';\n\nexport type { MlvSearchFieldTrigger } from '@malva-ui/core/search-field';\n\n// `MlvSortDirection`, `MlvSortState`, `MlvFilterState` and `MlvSearchState` are\n// re-exported from `@malva-ui/cdk/data-source` by the star export in\n// `data-source.ts`, so this module does not restate them.\n\n/** @deprecated Use `MlvDataSourceFilterOperator` from `@malva-ui/cdk/data-source`. */\nexport type MlvDataTableFilterOperator = MlvDataSourceFilterOperator;\n\nexport interface MlvDataTableFilterOption {\n  label: string;\n  value: unknown;\n}\n\n/** Where filter controls are presented by the data table. */\nexport type MlvFilterDisplay = 'toolbar' | 'column' | 'none';\n\nexport interface MlvColumnFilterConfig {\n  options?: MlvDataTableFilterOption[];\n  operators?: MlvDataSourceFilterOperator[];\n}\n\nexport type MlvColumnResponsive = Record<string | number, 'hidden' | 'visible'>;\nexport type MlvColumnAlign = 'left' | 'center' | 'right';\n\n/** Side a column can be pinned to. */\nexport type MlvPinSide = 'left' | 'right';\n\n/**\n * Maps raw cell values to human-readable labels for a column's default cell\n * renderer. Either an object keyed by the stringified raw value, or the same\n * `{ label, value }` option list already used by `filterConfig.options`.\n */\nexport type MlvColumnValueLabels =\n  | Record<string, string>\n  | ReadonlyArray<MlvDataTableFilterOption>;\n\n/**\n * Resolves the semantic tone of one row so a column's default cell can render a\n * toned `mlv-badge`. Returning `null`/`undefined` falls back to plain text.\n *\n * Declared through the method-syntax bivariance form so a column list authored\n * against a concrete row type (`MlvDataTableColumn<User>[]`) stays assignable to\n * the table's `MlvDataTableColumn[]` input.\n */\nexport type MlvColumnToneFn<T = unknown> = {\n  bivarianceHack(row: T): MlvTone | null | undefined;\n}['bivarianceHack'];\n\nexport interface MlvDataTableColumn<T = unknown> {\n  key: string;\n  title?: string;\n  sortable?: boolean;\n  /** Include this column in the table's global search. */\n  searchable?: boolean;\n  filterable?: boolean;\n  /**\n   * Controls whether the user can toggle the pin state via the header pin button, and which sides are allowed.\n   * - `true` — both sides allowed (clicking opens a popup with Pin Left / Pin Right / Unpin options).\n   * - `'left'` / `'right'` — only the given side is allowed; clicking the pin button toggles directly.\n   * - `['left', 'right']` — explicit list of allowed sides. A single-element list behaves like the direct-toggle string form; a multi-element list opens the popup.\n   * - `false` / `undefined` — the column cannot be user-pinned (it may still be pinned at load time via `pinned`/`pinSide`).\n   */\n  pinnable?: boolean | MlvPinSide | MlvPinSide[];\n  pinned?: boolean;\n  pinSide?: MlvPinSide;\n  hideable?: boolean;\n  align?: MlvColumnAlign;\n  resizable?: boolean;\n  width?: string;\n  minWidth?: string;\n  /** Maximum width allowed while resizing. Pixel and percentage values are resolved to rendered CSS pixels. */\n  maxWidth?: string;\n  responsive?: MlvColumnResponsive;\n  filterConfig?: MlvColumnFilterConfig;\n  /**\n   * Human-readable labels for the raw values of this column, used by the\n   * **default** cell renderer only (a `mlvDataTableCell` template still wins).\n   * Accepts a `Record<rawValue, label>` or a `{ label, value }` list.\n   *\n   * When omitted, the table falls back to `filterConfig.options`, so a column\n   * that already declares option filters renders its option labels for free.\n   */\n  valueLabels?: MlvColumnValueLabels;\n  /**\n   * Semantic tone for the default cell renderer. When set (either a fixed\n   * {@link MlvTone} or a per-row resolver), the default cell renders the value\n   * as a muted `mlv-badge` instead of plain text. A resolver returning\n   * `null`/`undefined` renders that row's cell as plain text.\n   *\n   * Ignored when a `mlvDataTableCell` template is provided for the column.\n   */\n  tone?: MlvTone | MlvColumnToneFn<T>;\n}\n\n/** Interaction that committed a user-controlled column width. */\nexport type MlvColumnResizeSource = 'pointer' | 'keyboard' | 'reset';\n\n/** Payload emitted after a column width is committed or reset. */\nexport interface MlvColumnResizeEvent {\n  /** Key of the resized column. */\n  key: string;\n  /**\n   * Committed width in CSS pixels. `null` means the user override was removed\n   * and the column returned to its declared/default width.\n   */\n  width: number | null;\n  /** Interaction that committed the change. */\n  source: MlvColumnResizeSource;\n}\n\n// ---- Column groups (multi-row headers) ----------------------------------------\n\nexport interface MlvDataTableColumnGroup {\n  /** Display title for the group header cell. */\n  title: string;\n  /** Column keys this group spans. */\n  columns: string[];\n  /** Optional alignment for the group header cell. */\n  align?: MlvColumnAlign;\n}\n\n// ---- Editable mode ------------------------------------------------------------\n\nexport type MlvEditMode = 'row' | 'cell';\n\nexport interface MlvEditEvent<T = Record<string, unknown>> {\n  row: T;\n  index: number;\n}\n\nexport interface MlvEditSaveEvent<T = Record<string, unknown>> {\n  row: T;\n  index: number;\n  originalRow: T;\n}\n\n// ---- Row click ----------------------------------------------------------------\n\nexport interface MlvRowClickEvent<T = Record<string, unknown>> {\n  row: T;\n  index: number;\n  event: MouseEvent;\n}\n\n// ---- Row selection ------------------------------------------------------------\n\nexport type MlvSelectableMode = 'single' | 'multi' | false;\n\nexport interface MlvSelectionChangeEvent<T = Record<string, unknown>> {\n  selectedRows: Set<T>;\n  row?: T;\n}\n\n// ---- Pagination ---------------------------------------------------------------\n\n/** Pagination strategy for the data table. `'paged'` renders the classic paginator footer; `'infinite'` hides it and emits `loadMore` as the user scrolls near the bottom. */\nexport type MlvPaginationMode = 'paged' | 'infinite';\n\n/** Payload emitted by the data table when infinite scroll crosses the threshold. */\nexport interface MlvLoadMoreEvent {\n  /** Next page the consumer should request (1-based). */\n  page: number;\n  /** Items-per-page configured on the table. */\n  perPage: number;\n  /** Distance in px from the bottom of the scroll container when the event fired. */\n  distance: number;\n}\n"]}

package/esm2022/data-table/malva-ui-core-data-table.js

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+export * from './index';
+//# sourceMappingURL=malva-ui-core-data-table.js.map

package/esm2022/data-table/malva-ui-core-data-table.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"malva-ui-core-data-table.js","sourceRoot":"","sources":["../../../../../libs/core/data-table/src/malva-ui-core-data-table.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,cAAc,SAAS,CAAC","sourcesContent":["/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"]}

package/esm2022/date-range-picker/index.js

@@ -0,0 +1,2 @@
+export * from './lib/date-range-picker/date-range-picker';
+//# sourceMappingURL=index.js.map

package/esm2022/date-range-picker/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../libs/core/date-range-picker/src/index.ts"],"names":[],"mappings":"AAAA,cAAc,2CAA2C,CAAC","sourcesContent":["export * from './lib/date-range-picker/date-range-picker';\n"]}

package/esm2022/date-range-picker/lib/date-range-picker/date-range-picker.js

@@ -0,0 +1,269 @@
+import { ChangeDetectionStrategy, Component, computed, DOCUMENT, forwardRef, inject, input, model, signal, viewChild, ViewEncapsulation, } from '@angular/core';
+import { MlvTabbableElementService } from '@malva-ui/cdk/accessibility';
+import { MlvCalendar, MLV_DATE_ADAPTER, MlvNativeDateAdapter, } from '@malva-ui/core/calendar';
+import { MlvPopup, MlvPopupContent, MlvPopupContainer, } from '@malva-ui/core/popup';
+import { MlvFormControlWrapper, MlvFormControlWrapperControl, MlvHint, MlvDescription, MlvLabel, MLV_FORM_CONTROL, MlvMessage, MlvSignalFormControlBase, } from '@malva-ui/core/form-utils';
+import { LucideCalendarDays } from '@lucide/angular';
+import { A11yModule } from '@angular/cdk/a11y';
+import { MlvButton } from '@malva-ui/core/button';
+import { MLV_DATE_RANGE_PICKER_I18N } from '@malva-ui/i18n';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/cdk/a11y";
+/** Accepts signal-form range constraints without changing the public date-boundary API. */
+function coerceBoundaryDate(value, edge) {
+    if (value == null)
+        return null;
+    if (typeof value === 'object' && 'start' in value && 'end' in value) {
+        return value[edge];
+    }
+    return value;
+}
+export class MlvDateRangePicker extends MlvSignalFormControlBase {
+    /** The committed date range used by all Angular forms APIs. */
+    value = model(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    /** @private The active date adapter — a provided `MLV_DATE_ADAPTER`, or the native fallback. */
+    _dateAdapter = inject(MLV_DATE_ADAPTER, {
+        optional: true,
+    }) ??
+        inject(MlvNativeDateAdapter);
+    /**
+     * The pending range being assembled during selection.
+     * Committed to the form control only when the user clicks Apply.
+     */
+    _pendingRange = signal(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_pendingRange" }] : /* istanbul ignore next */ []));
+    /**
+     * The last committed range value (reflects the form control value).
+     */
+    rangeValue = this.value;
+    /** Custom placeholder override. Falls back to the i18n-provided placeholder. */
+    placeholder = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
+    /** Minimum selectable date, passed to both calendars. */
+    min = input(null, { ...(ngDevMode ? { debugName: "min" } : /* istanbul ignore next */ {}), transform: (value) => coerceBoundaryDate(value, 'start') });
+    /** Maximum selectable date, passed to both calendars. */
+    max = input(null, { ...(ngDevMode ? { debugName: "max" } : /* istanbul ignore next */ {}), transform: (value) => coerceBoundaryDate(value, 'end') });
+    /** Optional callback for disabling arbitrary dates, passed to both calendars. */
+    disabledDates = input(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "disabledDates" }] : /* istanbul ignore next */ []));
+    /** @protected The component's i18n strings signal. */
+    _i18n = inject(MLV_DATE_RANGE_PICKER_I18N);
+    /**
+     * @private Reference to the trigger element, used to restore focus when the
+     * popup closes. It is declared in this component's own template, so a signal
+     * view query is the correct mechanism (was a host `querySelector`).
+     */
+    _triggerRef = viewChild('triggerRef', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_triggerRef" }] : /* istanbul ignore next */ []));
+    /** @private Locates the first tabbable element inside the popup panel. */
+    _tabbable = inject(MlvTabbableElementService);
+    /** @private Document ref for locating the rendered popup panel by id. */
+    _document = inject(DOCUMENT);
+    /** @protected Resolved placeholder: explicit input takes precedence over i18n default. */
+    _resolvedPlaceholder = computed(() => this.placeholder() ?? this._i18n().placeholder, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_resolvedPlaceholder" }] : /* istanbul ignore next */ []));
+    /**
+     * @internal Whether the picker popup is currently open.
+     */
+    _isOpen = signal(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_isOpen" }] : /* istanbul ignore next */ []));
+    /**
+     * @internal Whether a range selection is in progress (start chosen, awaiting end click).
+     */
+    _isSelecting = computed(() => !!this._pendingRange()?.start && !this._pendingRange()?.end, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_isSelecting" }] : /* istanbul ignore next */ []));
+    /**
+     * Override focused to also be true when the calendar popup is open.
+     */
+    focused = computed(() => this._focused() || this._isOpen(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "focused" }] : /* istanbul ignore next */ []));
+    /** Unique ID for the optional message element used by aria-describedby. */
+    /** Unique ID for the popup panel element used by aria-controls. */
+    panelId = computed(() => `${this.id()}-panel`, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "panelId" }] : /* istanbul ignore next */ []));
+    /**
+     * The initial date for the left (earlier-month) calendar panel.
+     * Defaults to today when no range is selected.
+     */
+    leftCalendarActiveDate = computed(() => {
+        const pending = this._pendingRange();
+        const val = this.rangeValue();
+        const anchor = pending?.start ?? val?.start ?? null;
+        return anchor ? this._dateAdapter.clone(anchor) : this._dateAdapter.today();
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "leftCalendarActiveDate" }] : /* istanbul ignore next */ []));
+    /**
+     * The initial date for the right (later-month) calendar panel.
+     * Always one month ahead of the left panel's month.
+     */
+    rightCalendarActiveDate = computed(() => {
+        return this._dateAdapter.addCalendarMonths(this.leftCalendarActiveDate(), 1);
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "rightCalendarActiveDate" }] : /* istanbul ignore next */ []));
+    /**
+     * The formatted start date display string.
+     * Returns an empty string when no start date is selected.
+     */
+    get startDisplayValue() {
+        const val = this.rangeValue();
+        if (!val?.start)
+            return '';
+        return this._formatDate(val.start);
+    }
+    /**
+     * The formatted end date display string.
+     * Returns an empty string when no end date is selected.
+     */
+    get endDisplayValue() {
+        const val = this.rangeValue();
+        if (!val?.end)
+            return '';
+        return this._formatDate(val.end);
+    }
+    /**
+     * Whether the Apply button should be enabled.
+     * Requires both start and end dates to be set in the pending range.
+     */
+    canApply = computed(() => !!this._pendingRange()?.start && !!this._pendingRange()?.end, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "canApply" }] : /* istanbul ignore next */ []));
+    /**
+     * Whether the clear button should be shown.
+     */
+    hasClearableValue = computed(() => this.clearable() &&
+        !this.computedDisabled() &&
+        (!!this.rangeValue()?.start || !!this.rangeValue()?.end), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "hasClearableValue" }] : /* istanbul ignore next */ []));
+    /**
+     * Toggles the popup open/closed.
+     * No-op when the picker is disabled.
+     */
+    toggleDropdown() {
+        if (this.computedDisabled())
+            return;
+        const wasOpen = this._isOpen();
+        if (wasOpen) {
+            this.closeDropdown();
+        }
+        else {
+            // Initialize pending range from committed value when opening
+            const val = this.rangeValue();
+            this._pendingRange.set(val ? { start: val.start, end: val.end } : null);
+            this._isOpen.set(true);
+        }
+    }
+    /**
+     * @protected Moves focus into the popup panel when it opens.
+     * Focuses the first tabbable element, falling back to the panel container
+     * (which carries `tabindex="-1"`) so focus always lands inside the modal.
+     */
+    _onPanelOpened() {
+        const panel = this._document.getElementById(this.panelId());
+        if (!panel)
+            return;
+        const first = this._tabbable.getTabbableElement(panel, false, true);
+        (first ?? panel).focus();
+    }
+    /**
+     * @protected Handles popup close: clears the focused state and returns focus
+     * to the trigger, matching the overlay focus-restore pattern.
+     */
+    _onPanelClosed() {
+        this.setFocused(false);
+        this._markTouched();
+        this._triggerRef()?.nativeElement.focus();
+    }
+    /** @protected Marks the control touched when its trigger loses focus. */
+    _onTriggerBlur() {
+        this.setFocused(false);
+        this._markTouched();
+    }
+    /**
+     * Closes the popup and resets the pending selection to the committed value.
+     */
+    closeDropdown() {
+        this._isOpen.set(false);
+        // Reset pending range to committed value
+        const val = this.rangeValue();
+        this._pendingRange.set(val ? { start: val.start, end: val.end } : null);
+    }
+    /**
+     * Handles range value changes from either calendar.
+     * Updates the pending (uncommitted) range.
+     *
+     * @param range - The updated range value from the calendar.
+     */
+    onRangeChanged(range) {
+        this._pendingRange.set(range);
+    }
+    /**
+     * Applies the pending range selection and closes the popup.
+     * Commits the value to the form control.
+     */
+    applySelection() {
+        const pending = this._pendingRange();
+        const newValue = pending?.start
+            ? { start: pending.start, end: pending.end }
+            : null;
+        this.rangeValue.set(newValue);
+        this._isOpen.set(false);
+    }
+    /**
+     * Clears the selected range and resets the picker.
+     */
+    clearSelection() {
+        this.rangeValue.set(null);
+        this._pendingRange.set(null);
+    }
+    /** Whether the control holds a clearable value — A committed range is set. */
+    hasValue = computed(() => this.rangeValue() != null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "hasValue" }] : /* istanbul ignore next */ []));
+    /**
+     * @private Formats a single date for display.
+     */
+    _formatDate(date) {
+        return this._dateAdapter.format(date, {
+            year: 'numeric',
+            month: 'short',
+            day: 'numeric',
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvDateRangePicker, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: MlvDateRangePicker, isStandalone: true, selector: "mlv-date-range-picker", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", 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 }, disabledDates: { classPropertyName: "disabledDates", publicName: "disabledDates", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { properties: { "class": "\"mlv-date-range-picker--state-\" + resolvedState()", "class.mlv-date-range-picker--disabled": "computedDisabled()", "class.mlv-date-range-picker--focused": "focused()", "class.mlv-date-range-picker--open": "_isOpen()", "class.mlv-date-range-picker--selecting": "_isSelecting()" }, classAttribute: "mlv-date-range-picker" }, providers: [
+            {
+                provide: MLV_FORM_CONTROL,
+                useExisting: forwardRef(() => MlvDateRangePicker),
+            },
+        ], viewQueries: [{ propertyName: "_triggerRef", first: true, predicate: ["triggerRef"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<mlv-form-control-wrapper>\n  @if (label() || hint()) {\n  <mlv-label [for]=\"id()\" [required]=\"required()\">\n    {{ label() }} @if (hint()) {\n    <mlv-hint>{{ hint() }}</mlv-hint>\n    }\n  </mlv-label>\n  }\n\n  <ng-template mlvFormControlWrapperControl>\n    <mlv-popup-container class=\"mlv-date-range-picker__popup-container\">\n      <div\n        #triggerRef\n        class=\"mlv-date-range-picker__trigger\"\n        [id]=\"id()\"\n        role=\"button\"\n        [attr.aria-expanded]=\"_isOpen()\"\n        [attr.aria-haspopup]=\"'dialog'\"\n        [attr.aria-controls]=\"panelId()\"\n        [attr.aria-disabled]=\"computedDisabled() || null\"\n        [attr.aria-label]=\"ariaLabel()\"\n        [attr.aria-required]=\"required() || null\"\n        [attr.aria-describedby]=\"_describedBy()\"\n        [attr.tabindex]=\"computedDisabled() ? -1 : 0\"\n        (click)=\"toggleDropdown()\"\n        (keydown.enter)=\"!computedDisabled() && toggleDropdown()\"\n        (keydown.space)=\"!computedDisabled() && toggleDropdown(); $event.preventDefault()\"\n        (keydown.escape)=\"closeDropdown()\"\n        (focus)=\"setFocused(true)\"\n        (blur)=\"_onTriggerBlur()\"\n      >\n        <span class=\"mlv-date-range-picker__trigger-icon\" aria-hidden=\"true\">\n          <svg lucideCalendarDays [size]=\"18\" />\n        </span>\n\n        @if (startDisplayValue || endDisplayValue) {\n        <span class=\"mlv-date-range-picker__value\">\n          <span class=\"mlv-date-range-picker__value-start\"\n            >{{ startDisplayValue || '...' }}</span\n          >\n          <span class=\"mlv-date-range-picker__separator\" aria-hidden=\"true\"\n            >\u2014</span\n          >\n          <span class=\"mlv-date-range-picker__value-end\"\n            >{{ endDisplayValue || '...' }}</span\n          >\n        </span>\n        } @else {\n        <span class=\"mlv-date-range-picker__placeholder\"\n          >{{ _resolvedPlaceholder() }}</span\n        >\n        }\n      </div>\n\n      <mlv-popup\n        #rangePopup\n        [(opened)]=\"_isOpen\"\n        [hasShadow]=\"true\"\n        [position]=\"['bottom-start', 'top-start', 'bottom-end', 'top-end']\"\n        mobileMode=\"auto\"\n        [mobileTitle]=\"label() || _i18n().selectDateRange\"\n        [ariaLabel]=\"_i18n().selectDateRange\"\n        (afterOpened)=\"_onPanelOpened()\"\n        (afterClosed)=\"_onPanelClosed()\"\n      >\n        <ng-template mlvPopupContent>\n          <div\n            class=\"mlv-date-range-picker__panel\"\n            [id]=\"panelId()\"\n            role=\"dialog\"\n            aria-modal=\"true\"\n            [cdkTrapFocus]=\"!rangePopup.isFullscreen()\"\n            tabindex=\"-1\"\n            [attr.aria-label]=\"_i18n().selectDateRange\"\n            (keydown.escape)=\"closeDropdown()\"\n          >\n            <div class=\"mlv-date-range-picker__calendars\">\n              <div\n                class=\"mlv-date-range-picker__calendar\"\n                role=\"group\"\n                [attr.aria-label]=\"_i18n().startMonth\"\n              >\n                <mlv-calendar\n                  embedded\n                  [range]=\"true\"\n                  [rangeValue]=\"_pendingRange()\"\n                  [min]=\"min()\"\n                  [max]=\"max()\"\n                  [disabledDates]=\"disabledDates()\"\n                  (rangeValueChange)=\"onRangeChanged($event)\"\n                />\n              </div>\n\n              <div\n                class=\"mlv-date-range-picker__divider\"\n                aria-hidden=\"true\"\n              ></div>\n\n              <div\n                class=\"mlv-date-range-picker__calendar\"\n                role=\"group\"\n                [attr.aria-label]=\"_i18n().endMonth\"\n              >\n                <mlv-calendar\n                  embedded\n                  [range]=\"true\"\n                  [rangeValue]=\"_pendingRange()\"\n                  [min]=\"min()\"\n                  [max]=\"max()\"\n                  [disabledDates]=\"disabledDates()\"\n                  (rangeValueChange)=\"onRangeChanged($event)\"\n                />\n              </div>\n            </div>\n\n            <div class=\"mlv-date-range-picker__footer\">\n              <button\n                mlvButton\n                variant=\"transparent\"\n                size=\"s\"\n                type=\"button\"\n                class=\"mlv-date-range-picker__clear-btn\"\n                (click)=\"clearSelection()\"\n                [attr.aria-label]=\"_i18n().clearDateRange\"\n              >\n                Clear\n              </button>\n\n              <button\n                mlvButton\n                variant=\"primary\"\n                size=\"s\"\n                type=\"button\"\n                class=\"mlv-date-range-picker__apply-btn\"\n                [attr.disabled]=\"canApply() ? null : true\"\n                (click)=\"applySelection()\"\n                [attr.aria-label]=\"_i18n().applyDateRange\"\n              >\n                Apply\n              </button>\n            </div>\n          </div>\n        </ng-template>\n      </mlv-popup>\n    </mlv-popup-container>\n  </ng-template>\n\n  @if (description()) {\n  <mlv-description [id]=\"_descriptionId()\">{{ description() }}</mlv-description>\n  } @if (message()) {\n  <mlv-message [id]=\"_messageId()\" [state]=\"resolvedState()\">\n    {{ message() }}\n  </mlv-message>\n  }\n</mlv-form-control-wrapper>\n", styles: [".mlv-date-range-picker{box-sizing:border-box;padding:0;margin:0;font-family:var(--mlv-typography-family-text);font-size:var(--mlv-font-size-m)}.mlv-date-range-picker *{box-sizing:border-box}.mlv-date-range-picker{display:block}.mlv-date-range-picker__popup-container{width:100%}.mlv-date-range-picker__trigger{display:flex;align-items:center;gap:.5rem;width:100%;cursor:pointer;outline:none;min-height:1.5rem;border-radius:var(--mlv-radius-s)}.mlv-date-range-picker__trigger:focus-visible{outline:var(--mlv-stroke-width) solid var(--mlv-border-focus);outline-offset:.125rem}.mlv-date-range-picker__trigger-icon{display:flex;align-items:center;color:var(--mlv-text-secondary);line-height:1;flex-shrink:0}.mlv-date-range-picker__value{display:flex;align-items:center;gap:.375rem;flex:1;color:var(--mlv-text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mlv-date-range-picker__value-start,.mlv-date-range-picker__value-end{white-space:nowrap}.mlv-date-range-picker__separator{color:var(--mlv-text-secondary);flex-shrink:0}.mlv-date-range-picker__placeholder{flex:1;color:var(--mlv-text-secondary)}.mlv-date-range-picker__panel{display:flex;flex-direction:column;background-color:var(--mlv-background-raised);border:var(--mlv-stroke-width) solid var(--mlv-border-subtle);border-radius:var(--mlv-radius-l);box-shadow:var(--mlv-shadow-3);overflow:hidden}.mlv-date-range-picker__calendars{display:flex;align-items:flex-start;padding:1rem;gap:0}.mlv-date-range-picker__calendar{flex:0 0 auto}.mlv-date-range-picker__divider{width:1px;align-self:stretch;background-color:var(--mlv-border-subtle);margin:0 1rem;flex-shrink:0}.mlv-date-range-picker__footer{display:flex;align-items:center;justify-content:flex-end;gap:.5rem;padding:.75rem 1rem;border-top:var(--mlv-stroke-width) solid var(--mlv-border-subtle);background-color:var(--mlv-background-base)}.mlv-date-range-picker__clear-btn{margin-right:auto}.mlv-date-range-picker--state-success .mlv-date-range-picker__trigger{color:var(--mlv-text-positive)}.mlv-date-range-picker--state-warning .mlv-date-range-picker__trigger{color:var(--mlv-text-warning)}.mlv-date-range-picker--state-error .mlv-date-range-picker__trigger{color:var(--mlv-text-negative)}.mlv-date-range-picker--state-info .mlv-date-range-picker__trigger{color:var(--mlv-text-info)}.mlv-date-range-picker--disabled{opacity:var(--mlv-disabled-opacity);pointer-events:none}.mlv-date-range-picker--disabled .mlv-date-range-picker__trigger{cursor:not-allowed}.mlv-date-range-picker--selecting .mlv-date-range-picker__trigger-icon{color:var(--mlv-text-action)}\n"], dependencies: [{ kind: "component", type: MlvPopup, selector: "mlv-popup", inputs: ["position", "positions", "width", "height", "minWidth", "minHeight", "maxWidth", "maxHeight", "hasArrow", "hasShadow", "class", "mlvDensity", "flexibleDimensions", "scrollStrategy", "hasBackdrop", "restrictPosition", "panelRole", "modal", "ariaLabel", "dismissExcludeElements", "mobileMode", "mobileBreakpoint", "mobileTitle", "mobileCloseLabel", "opened"], outputs: ["openedChange", "afterOpened", "afterClosed"] }, { kind: "directive", type: MlvPopupContent, selector: "[mlvPopupContent]" }, { kind: "component", type: MlvPopupContainer, selector: "mlv-popup-container" }, { kind: "component", type: MlvCalendar, selector: "mlv-calendar", inputs: ["value", "rangeValue", "min", "max", "disabledDates", "startView", "firstDayOfWeek", "range", "embedded", "activeDate"], outputs: ["valueChange", "rangeValueChange", "activeDateChange"] }, { kind: "component", type: LucideCalendarDays, selector: "svg[lucideCalendarDays]" }, { kind: "component", type: MlvFormControlWrapper, selector: "mlv-form-control-wrapper", outputs: ["clear"] }, { kind: "directive", type: MlvFormControlWrapperControl, selector: "[mlvFormControlWrapperControl]" }, { kind: "component", type: MlvDescription, selector: "mlv-description" }, { kind: "component", type: MlvLabel, selector: "mlv-label", inputs: ["for", "required"] }, { kind: "component", type: MlvHint, selector: "mlv-hint" }, { kind: "component", type: MlvMessage, selector: "mlv-message", inputs: ["state"] }, { kind: "component", type: MlvButton, selector: "button[mlvButton], a[mlvButton]", inputs: ["variant", "shape", "disabled", "loading"] }, { kind: "ngmodule", type: A11yModule }, { kind: "directive", type: i1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvDateRangePicker, decorators: [{
+            type: Component,
+            args: [{ selector: 'mlv-date-range-picker', imports: [
+                        MlvPopup,
+                        MlvPopupContent,
+                        MlvPopupContainer,
+                        MlvCalendar,
+                        LucideCalendarDays,
+                        MlvFormControlWrapper,
+                        MlvFormControlWrapperControl,
+                        MlvDescription,
+                        MlvLabel,
+                        MlvHint,
+                        MlvMessage,
+                        MlvButton,
+                        A11yModule,
+                    ], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
+                        {
+                            provide: MLV_FORM_CONTROL,
+                            useExisting: forwardRef(() => MlvDateRangePicker),
+                        },
+                    ], host: {
+                        class: 'mlv-date-range-picker',
+                        '[class]': '"mlv-date-range-picker--state-" + resolvedState()',
+                        '[class.mlv-date-range-picker--disabled]': 'computedDisabled()',
+                        '[class.mlv-date-range-picker--focused]': 'focused()',
+                        '[class.mlv-date-range-picker--open]': '_isOpen()',
+                        '[class.mlv-date-range-picker--selecting]': '_isSelecting()',
+                    }, template: "<mlv-form-control-wrapper>\n  @if (label() || hint()) {\n  <mlv-label [for]=\"id()\" [required]=\"required()\">\n    {{ label() }} @if (hint()) {\n    <mlv-hint>{{ hint() }}</mlv-hint>\n    }\n  </mlv-label>\n  }\n\n  <ng-template mlvFormControlWrapperControl>\n    <mlv-popup-container class=\"mlv-date-range-picker__popup-container\">\n      <div\n        #triggerRef\n        class=\"mlv-date-range-picker__trigger\"\n        [id]=\"id()\"\n        role=\"button\"\n        [attr.aria-expanded]=\"_isOpen()\"\n        [attr.aria-haspopup]=\"'dialog'\"\n        [attr.aria-controls]=\"panelId()\"\n        [attr.aria-disabled]=\"computedDisabled() || null\"\n        [attr.aria-label]=\"ariaLabel()\"\n        [attr.aria-required]=\"required() || null\"\n        [attr.aria-describedby]=\"_describedBy()\"\n        [attr.tabindex]=\"computedDisabled() ? -1 : 0\"\n        (click)=\"toggleDropdown()\"\n        (keydown.enter)=\"!computedDisabled() && toggleDropdown()\"\n        (keydown.space)=\"!computedDisabled() && toggleDropdown(); $event.preventDefault()\"\n        (keydown.escape)=\"closeDropdown()\"\n        (focus)=\"setFocused(true)\"\n        (blur)=\"_onTriggerBlur()\"\n      >\n        <span class=\"mlv-date-range-picker__trigger-icon\" aria-hidden=\"true\">\n          <svg lucideCalendarDays [size]=\"18\" />\n        </span>\n\n        @if (startDisplayValue || endDisplayValue) {\n        <span class=\"mlv-date-range-picker__value\">\n          <span class=\"mlv-date-range-picker__value-start\"\n            >{{ startDisplayValue || '...' }}</span\n          >\n          <span class=\"mlv-date-range-picker__separator\" aria-hidden=\"true\"\n            >\u2014</span\n          >\n          <span class=\"mlv-date-range-picker__value-end\"\n            >{{ endDisplayValue || '...' }}</span\n          >\n        </span>\n        } @else {\n        <span class=\"mlv-date-range-picker__placeholder\"\n          >{{ _resolvedPlaceholder() }}</span\n        >\n        }\n      </div>\n\n      <mlv-popup\n        #rangePopup\n        [(opened)]=\"_isOpen\"\n        [hasShadow]=\"true\"\n        [position]=\"['bottom-start', 'top-start', 'bottom-end', 'top-end']\"\n        mobileMode=\"auto\"\n        [mobileTitle]=\"label() || _i18n().selectDateRange\"\n        [ariaLabel]=\"_i18n().selectDateRange\"\n        (afterOpened)=\"_onPanelOpened()\"\n        (afterClosed)=\"_onPanelClosed()\"\n      >\n        <ng-template mlvPopupContent>\n          <div\n            class=\"mlv-date-range-picker__panel\"\n            [id]=\"panelId()\"\n            role=\"dialog\"\n            aria-modal=\"true\"\n            [cdkTrapFocus]=\"!rangePopup.isFullscreen()\"\n            tabindex=\"-1\"\n            [attr.aria-label]=\"_i18n().selectDateRange\"\n            (keydown.escape)=\"closeDropdown()\"\n          >\n            <div class=\"mlv-date-range-picker__calendars\">\n              <div\n                class=\"mlv-date-range-picker__calendar\"\n                role=\"group\"\n                [attr.aria-label]=\"_i18n().startMonth\"\n              >\n                <mlv-calendar\n                  embedded\n                  [range]=\"true\"\n                  [rangeValue]=\"_pendingRange()\"\n                  [min]=\"min()\"\n                  [max]=\"max()\"\n                  [disabledDates]=\"disabledDates()\"\n                  (rangeValueChange)=\"onRangeChanged($event)\"\n                />\n              </div>\n\n              <div\n                class=\"mlv-date-range-picker__divider\"\n                aria-hidden=\"true\"\n              ></div>\n\n              <div\n                class=\"mlv-date-range-picker__calendar\"\n                role=\"group\"\n                [attr.aria-label]=\"_i18n().endMonth\"\n              >\n                <mlv-calendar\n                  embedded\n                  [range]=\"true\"\n                  [rangeValue]=\"_pendingRange()\"\n                  [min]=\"min()\"\n                  [max]=\"max()\"\n                  [disabledDates]=\"disabledDates()\"\n                  (rangeValueChange)=\"onRangeChanged($event)\"\n                />\n              </div>\n            </div>\n\n            <div class=\"mlv-date-range-picker__footer\">\n              <button\n                mlvButton\n                variant=\"transparent\"\n                size=\"s\"\n                type=\"button\"\n                class=\"mlv-date-range-picker__clear-btn\"\n                (click)=\"clearSelection()\"\n                [attr.aria-label]=\"_i18n().clearDateRange\"\n              >\n                Clear\n              </button>\n\n              <button\n                mlvButton\n                variant=\"primary\"\n                size=\"s\"\n                type=\"button\"\n                class=\"mlv-date-range-picker__apply-btn\"\n                [attr.disabled]=\"canApply() ? null : true\"\n                (click)=\"applySelection()\"\n                [attr.aria-label]=\"_i18n().applyDateRange\"\n              >\n                Apply\n              </button>\n            </div>\n          </div>\n        </ng-template>\n      </mlv-popup>\n    </mlv-popup-container>\n  </ng-template>\n\n  @if (description()) {\n  <mlv-description [id]=\"_descriptionId()\">{{ description() }}</mlv-description>\n  } @if (message()) {\n  <mlv-message [id]=\"_messageId()\" [state]=\"resolvedState()\">\n    {{ message() }}\n  </mlv-message>\n  }\n</mlv-form-control-wrapper>\n", styles: [".mlv-date-range-picker{box-sizing:border-box;padding:0;margin:0;font-family:var(--mlv-typography-family-text);font-size:var(--mlv-font-size-m)}.mlv-date-range-picker *{box-sizing:border-box}.mlv-date-range-picker{display:block}.mlv-date-range-picker__popup-container{width:100%}.mlv-date-range-picker__trigger{display:flex;align-items:center;gap:.5rem;width:100%;cursor:pointer;outline:none;min-height:1.5rem;border-radius:var(--mlv-radius-s)}.mlv-date-range-picker__trigger:focus-visible{outline:var(--mlv-stroke-width) solid var(--mlv-border-focus);outline-offset:.125rem}.mlv-date-range-picker__trigger-icon{display:flex;align-items:center;color:var(--mlv-text-secondary);line-height:1;flex-shrink:0}.mlv-date-range-picker__value{display:flex;align-items:center;gap:.375rem;flex:1;color:var(--mlv-text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mlv-date-range-picker__value-start,.mlv-date-range-picker__value-end{white-space:nowrap}.mlv-date-range-picker__separator{color:var(--mlv-text-secondary);flex-shrink:0}.mlv-date-range-picker__placeholder{flex:1;color:var(--mlv-text-secondary)}.mlv-date-range-picker__panel{display:flex;flex-direction:column;background-color:var(--mlv-background-raised);border:var(--mlv-stroke-width) solid var(--mlv-border-subtle);border-radius:var(--mlv-radius-l);box-shadow:var(--mlv-shadow-3);overflow:hidden}.mlv-date-range-picker__calendars{display:flex;align-items:flex-start;padding:1rem;gap:0}.mlv-date-range-picker__calendar{flex:0 0 auto}.mlv-date-range-picker__divider{width:1px;align-self:stretch;background-color:var(--mlv-border-subtle);margin:0 1rem;flex-shrink:0}.mlv-date-range-picker__footer{display:flex;align-items:center;justify-content:flex-end;gap:.5rem;padding:.75rem 1rem;border-top:var(--mlv-stroke-width) solid var(--mlv-border-subtle);background-color:var(--mlv-background-base)}.mlv-date-range-picker__clear-btn{margin-right:auto}.mlv-date-range-picker--state-success .mlv-date-range-picker__trigger{color:var(--mlv-text-positive)}.mlv-date-range-picker--state-warning .mlv-date-range-picker__trigger{color:var(--mlv-text-warning)}.mlv-date-range-picker--state-error .mlv-date-range-picker__trigger{color:var(--mlv-text-negative)}.mlv-date-range-picker--state-info .mlv-date-range-picker__trigger{color:var(--mlv-text-info)}.mlv-date-range-picker--disabled{opacity:var(--mlv-disabled-opacity);pointer-events:none}.mlv-date-range-picker--disabled .mlv-date-range-picker__trigger{cursor:not-allowed}.mlv-date-range-picker--selecting .mlv-date-range-picker__trigger-icon{color:var(--mlv-text-action)}\n"] }]
+        }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], min: [{ type: i0.Input, args: [{ isSignal: true, alias: "min", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], disabledDates: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabledDates", required: false }] }], _triggerRef: [{ type: i0.ViewChild, args: ['triggerRef', { isSignal: true }] }] } });
+//# sourceMappingURL=date-range-picker.js.map

package/esm2022/date-range-picker/lib/date-range-picker/date-range-picker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"date-range-picker.js","sourceRoot":"","sources":["../../../../../../../libs/core/date-range-picker/src/lib/date-range-picker/date-range-picker.ts","../../../../../../../libs/core/date-range-picker/src/lib/date-range-picker/date-range-picker.html"],"names":[],"mappings":"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","sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  DOCUMENT,\n  type ElementRef,\n  forwardRef,\n  inject,\n  input,\n  model,\n  signal,\n  viewChild,\n  ViewEncapsulation,\n} from '@angular/core';\nimport { MlvTabbableElementService } from '@malva-ui/cdk/accessibility';\nimport {\n  MlvCalendar,\n  type MlvCalendarRangeValue,\n  MLV_DATE_ADAPTER,\n  MlvNativeDateAdapter,\n  type MlvDateAdapter,\n} from '@malva-ui/core/calendar';\nimport {\n  MlvPopup,\n  MlvPopupContent,\n  MlvPopupContainer,\n} from '@malva-ui/core/popup';\nimport {\n  MlvFormControlWrapper,\n  MlvFormControlWrapperControl,\n  MlvHint,\n  MlvDescription,\n  MlvLabel,\n  MLV_FORM_CONTROL,\n  MlvMessage,\n  MlvSignalFormControlBase,\n} from '@malva-ui/core/form-utils';\nimport type { MlvFormState, MlvFormControl } from '@malva-ui/core/form-utils';\nimport { LucideCalendarDays } from '@lucide/angular';\nimport { A11yModule } from '@angular/cdk/a11y';\nimport { MlvButton } from '@malva-ui/core/button';\nimport { MLV_DATE_RANGE_PICKER_I18N } from '@malva-ui/i18n';\n\n/**\n * Visual/validation state of the date range picker. Mirrors {@link MlvFormState}.\n */\nexport type MlvDateRangePickerState = MlvFormState;\n\n/**\n * Value shape for the date range picker.\n * Both `start` and `end` can be `null` when not yet selected.\n */\nexport interface MlvDateRangePickerValue<D = Date> {\n  /** The start date of the selected range. */\n  start: D | null;\n  /** The end date of the selected range. */\n  end: D | null;\n}\n\n/** Accepts signal-form range constraints without changing the public date-boundary API. */\nfunction coerceBoundaryDate<D>(\n  value: D | MlvDateRangePickerValue<D> | null | undefined,\n  edge: 'start' | 'end',\n): D | null {\n  if (value == null) return null;\n  if (typeof value === 'object' && 'start' in value && 'end' in value) {\n    return (value as MlvDateRangePickerValue<D>)[edge];\n  }\n  return value as D;\n}\n\n@Component({\n  selector: 'mlv-date-range-picker',\n  imports: [\n    MlvPopup,\n    MlvPopupContent,\n    MlvPopupContainer,\n    MlvCalendar,\n    LucideCalendarDays,\n    MlvFormControlWrapper,\n    MlvFormControlWrapperControl,\n    MlvDescription,\n    MlvLabel,\n    MlvHint,\n    MlvMessage,\n    MlvButton,\n    A11yModule,\n  ],\n  templateUrl: './date-range-picker.html',\n  styleUrl: './date-range-picker.scss',\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  providers: [\n    {\n      provide: MLV_FORM_CONTROL,\n      useExisting: forwardRef(() => MlvDateRangePicker),\n    },\n  ],\n  host: {\n    class: 'mlv-date-range-picker',\n    '[class]': '\"mlv-date-range-picker--state-\" + resolvedState()',\n    '[class.mlv-date-range-picker--disabled]': 'computedDisabled()',\n    '[class.mlv-date-range-picker--focused]': 'focused()',\n    '[class.mlv-date-range-picker--open]': '_isOpen()',\n    '[class.mlv-date-range-picker--selecting]': '_isSelecting()',\n  },\n})\nexport class MlvDateRangePicker<D = Date>\n  extends MlvSignalFormControlBase<MlvDateRangePickerValue<D> | null>\n  implements MlvFormControl\n{\n  /** The committed date range used by all Angular forms APIs. */\n  readonly value = model<MlvDateRangePickerValue<D> | null>(null);\n  /** @private The active date adapter — a provided `MLV_DATE_ADAPTER`, or the native fallback. */\n  private readonly _dateAdapter =\n    (inject(MLV_DATE_ADAPTER, {\n      optional: true,\n    }) as MlvDateAdapter<D> | null) ??\n    (inject(MlvNativeDateAdapter) as unknown as MlvDateAdapter<D>);\n\n  /**\n   * The pending range being assembled during selection.\n   * Committed to the form control only when the user clicks Apply.\n   */\n  protected readonly _pendingRange = signal<MlvCalendarRangeValue<D> | null>(\n    null,\n  );\n\n  /**\n   * The last committed range value (reflects the form control value).\n   */\n  readonly rangeValue = this.value;\n\n  /** Custom placeholder override. Falls back to the i18n-provided placeholder. */\n  readonly placeholder = input<string | undefined>(undefined);\n\n  /** Minimum selectable date, passed to both calendars. */\n  readonly min = input<\n    D | null,\n    D | MlvDateRangePickerValue<D> | null | undefined\n  >(null, {\n    transform: (value) => coerceBoundaryDate(value, 'start'),\n  });\n\n  /** Maximum selectable date, passed to both calendars. */\n  readonly max = input<\n    D | null,\n    D | MlvDateRangePickerValue<D> | null | undefined\n  >(null, {\n    transform: (value) => coerceBoundaryDate(value, 'end'),\n  });\n\n  /** Optional callback for disabling arbitrary dates, passed to both calendars. */\n  readonly disabledDates = input<((date: D) => boolean) | null>(null);\n\n  /** @protected The component's i18n strings signal. */\n  protected readonly _i18n = inject(MLV_DATE_RANGE_PICKER_I18N);\n\n  /**\n   * @private Reference to the trigger element, used to restore focus when the\n   * popup closes. It is declared in this component's own template, so a signal\n   * view query is the correct mechanism (was a host `querySelector`).\n   */\n  private readonly _triggerRef =\n    viewChild<ElementRef<HTMLElement>>('triggerRef');\n\n  /** @private Locates the first tabbable element inside the popup panel. */\n  private readonly _tabbable = inject(MlvTabbableElementService);\n\n  /** @private Document ref for locating the rendered popup panel by id. */\n  private readonly _document = inject(DOCUMENT);\n\n  /** @protected Resolved placeholder: explicit input takes precedence over i18n default. */\n  protected readonly _resolvedPlaceholder = computed(\n    () => this.placeholder() ?? this._i18n().placeholder,\n  );\n\n  /**\n   * @internal Whether the picker popup is currently open.\n   */\n  protected readonly _isOpen = signal(false);\n\n  /**\n   * @internal Whether a range selection is in progress (start chosen, awaiting end click).\n   */\n  protected readonly _isSelecting = computed(\n    () => !!this._pendingRange()?.start && !this._pendingRange()?.end,\n  );\n\n  /**\n   * Override focused to also be true when the calendar popup is open.\n   */\n  override readonly focused = computed(() => this._focused() || this._isOpen());\n\n  /** Unique ID for the optional message element used by aria-describedby. */\n\n  /** Unique ID for the popup panel element used by aria-controls. */\n  readonly panelId = computed(() => `${this.id()}-panel`);\n\n  /**\n   * The initial date for the left (earlier-month) calendar panel.\n   * Defaults to today when no range is selected.\n   */\n  readonly leftCalendarActiveDate = computed<D>(() => {\n    const pending = this._pendingRange();\n    const val = this.rangeValue();\n    const anchor = pending?.start ?? val?.start ?? null;\n    return anchor ? this._dateAdapter.clone(anchor) : this._dateAdapter.today();\n  });\n\n  /**\n   * The initial date for the right (later-month) calendar panel.\n   * Always one month ahead of the left panel's month.\n   */\n  readonly rightCalendarActiveDate = computed<D>(() => {\n    return this._dateAdapter.addCalendarMonths(\n      this.leftCalendarActiveDate(),\n      1,\n    );\n  });\n\n  /**\n   * The formatted start date display string.\n   * Returns an empty string when no start date is selected.\n   */\n  get startDisplayValue(): string {\n    const val = this.rangeValue();\n    if (!val?.start) return '';\n    return this._formatDate(val.start);\n  }\n\n  /**\n   * The formatted end date display string.\n   * Returns an empty string when no end date is selected.\n   */\n  get endDisplayValue(): string {\n    const val = this.rangeValue();\n    if (!val?.end) return '';\n    return this._formatDate(val.end);\n  }\n\n  /**\n   * Whether the Apply button should be enabled.\n   * Requires both start and end dates to be set in the pending range.\n   */\n  readonly canApply = computed(\n    () => !!this._pendingRange()?.start && !!this._pendingRange()?.end,\n  );\n\n  /**\n   * Whether the clear button should be shown.\n   */\n  readonly hasClearableValue = computed(\n    () =>\n      this.clearable() &&\n      !this.computedDisabled() &&\n      (!!this.rangeValue()?.start || !!this.rangeValue()?.end),\n  );\n\n  /**\n   * Toggles the popup open/closed.\n   * No-op when the picker is disabled.\n   */\n  toggleDropdown(): void {\n    if (this.computedDisabled()) return;\n    const wasOpen = this._isOpen();\n    if (wasOpen) {\n      this.closeDropdown();\n    } else {\n      // Initialize pending range from committed value when opening\n      const val = this.rangeValue();\n      this._pendingRange.set(val ? { start: val.start, end: val.end } : null);\n      this._isOpen.set(true);\n    }\n  }\n\n  /**\n   * @protected Moves focus into the popup panel when it opens.\n   * Focuses the first tabbable element, falling back to the panel container\n   * (which carries `tabindex=\"-1\"`) so focus always lands inside the modal.\n   */\n  protected _onPanelOpened(): void {\n    const panel = this._document.getElementById(this.panelId());\n    if (!panel) return;\n    const first = this._tabbable.getTabbableElement(panel, false, true);\n    (first ?? panel).focus();\n  }\n\n  /**\n   * @protected Handles popup close: clears the focused state and returns focus\n   * to the trigger, matching the overlay focus-restore pattern.\n   */\n  protected _onPanelClosed(): void {\n    this.setFocused(false);\n    this._markTouched();\n    this._triggerRef()?.nativeElement.focus();\n  }\n\n  /** @protected Marks the control touched when its trigger loses focus. */\n  protected _onTriggerBlur(): void {\n    this.setFocused(false);\n    this._markTouched();\n  }\n\n  /**\n   * Closes the popup and resets the pending selection to the committed value.\n   */\n  closeDropdown(): void {\n    this._isOpen.set(false);\n    // Reset pending range to committed value\n    const val = this.rangeValue();\n    this._pendingRange.set(val ? { start: val.start, end: val.end } : null);\n  }\n\n  /**\n   * Handles range value changes from either calendar.\n   * Updates the pending (uncommitted) range.\n   *\n   * @param range - The updated range value from the calendar.\n   */\n  onRangeChanged(range: MlvCalendarRangeValue<D> | null): void {\n    this._pendingRange.set(range);\n  }\n\n  /**\n   * Applies the pending range selection and closes the popup.\n   * Commits the value to the form control.\n   */\n  applySelection(): void {\n    const pending = this._pendingRange();\n    const newValue: MlvDateRangePickerValue<D> | null = pending?.start\n      ? { start: pending.start, end: pending.end }\n      : null;\n\n    this.rangeValue.set(newValue);\n    this._isOpen.set(false);\n  }\n\n  /**\n   * Clears the selected range and resets the picker.\n   */\n  clearSelection(): void {\n    this.rangeValue.set(null);\n    this._pendingRange.set(null);\n  }\n\n  /** Whether the control holds a clearable value — A committed range is set. */\n  readonly hasValue = computed(() => this.rangeValue() != null);\n\n  /**\n   * @private Formats a single date for display.\n   */\n  private _formatDate(date: D): string {\n    return this._dateAdapter.format(date, {\n      year: 'numeric',\n      month: 'short',\n      day: 'numeric',\n    });\n  }\n}\n","<mlv-form-control-wrapper>\n  @if (label() || hint()) {\n  <mlv-label [for]=\"id()\" [required]=\"required()\">\n    {{ label() }} @if (hint()) {\n    <mlv-hint>{{ hint() }}</mlv-hint>\n    }\n  </mlv-label>\n  }\n\n  <ng-template mlvFormControlWrapperControl>\n    <mlv-popup-container class=\"mlv-date-range-picker__popup-container\">\n      <div\n        #triggerRef\n        class=\"mlv-date-range-picker__trigger\"\n        [id]=\"id()\"\n        role=\"button\"\n        [attr.aria-expanded]=\"_isOpen()\"\n        [attr.aria-haspopup]=\"'dialog'\"\n        [attr.aria-controls]=\"panelId()\"\n        [attr.aria-disabled]=\"computedDisabled() || null\"\n        [attr.aria-label]=\"ariaLabel()\"\n        [attr.aria-required]=\"required() || null\"\n        [attr.aria-describedby]=\"_describedBy()\"\n        [attr.tabindex]=\"computedDisabled() ? -1 : 0\"\n        (click)=\"toggleDropdown()\"\n        (keydown.enter)=\"!computedDisabled() && toggleDropdown()\"\n        (keydown.space)=\"!computedDisabled() && toggleDropdown(); $event.preventDefault()\"\n        (keydown.escape)=\"closeDropdown()\"\n        (focus)=\"setFocused(true)\"\n        (blur)=\"_onTriggerBlur()\"\n      >\n        <span class=\"mlv-date-range-picker__trigger-icon\" aria-hidden=\"true\">\n          <svg lucideCalendarDays [size]=\"18\" />\n        </span>\n\n        @if (startDisplayValue || endDisplayValue) {\n        <span class=\"mlv-date-range-picker__value\">\n          <span class=\"mlv-date-range-picker__value-start\"\n            >{{ startDisplayValue || '...' }}</span\n          >\n          <span class=\"mlv-date-range-picker__separator\" aria-hidden=\"true\"\n            >—</span\n          >\n          <span class=\"mlv-date-range-picker__value-end\"\n            >{{ endDisplayValue || '...' }}</span\n          >\n        </span>\n        } @else {\n        <span class=\"mlv-date-range-picker__placeholder\"\n          >{{ _resolvedPlaceholder() }}</span\n        >\n        }\n      </div>\n\n      <mlv-popup\n        #rangePopup\n        [(opened)]=\"_isOpen\"\n        [hasShadow]=\"true\"\n        [position]=\"['bottom-start', 'top-start', 'bottom-end', 'top-end']\"\n        mobileMode=\"auto\"\n        [mobileTitle]=\"label() || _i18n().selectDateRange\"\n        [ariaLabel]=\"_i18n().selectDateRange\"\n        (afterOpened)=\"_onPanelOpened()\"\n        (afterClosed)=\"_onPanelClosed()\"\n      >\n        <ng-template mlvPopupContent>\n          <div\n            class=\"mlv-date-range-picker__panel\"\n            [id]=\"panelId()\"\n            role=\"dialog\"\n            aria-modal=\"true\"\n            [cdkTrapFocus]=\"!rangePopup.isFullscreen()\"\n            tabindex=\"-1\"\n            [attr.aria-label]=\"_i18n().selectDateRange\"\n            (keydown.escape)=\"closeDropdown()\"\n          >\n            <div class=\"mlv-date-range-picker__calendars\">\n              <div\n                class=\"mlv-date-range-picker__calendar\"\n                role=\"group\"\n                [attr.aria-label]=\"_i18n().startMonth\"\n              >\n                <mlv-calendar\n                  embedded\n                  [range]=\"true\"\n                  [rangeValue]=\"_pendingRange()\"\n                  [min]=\"min()\"\n                  [max]=\"max()\"\n                  [disabledDates]=\"disabledDates()\"\n                  (rangeValueChange)=\"onRangeChanged($event)\"\n                />\n              </div>\n\n              <div\n                class=\"mlv-date-range-picker__divider\"\n                aria-hidden=\"true\"\n              ></div>\n\n              <div\n                class=\"mlv-date-range-picker__calendar\"\n                role=\"group\"\n                [attr.aria-label]=\"_i18n().endMonth\"\n              >\n                <mlv-calendar\n                  embedded\n                  [range]=\"true\"\n                  [rangeValue]=\"_pendingRange()\"\n                  [min]=\"min()\"\n                  [max]=\"max()\"\n                  [disabledDates]=\"disabledDates()\"\n                  (rangeValueChange)=\"onRangeChanged($event)\"\n                />\n              </div>\n            </div>\n\n            <div class=\"mlv-date-range-picker__footer\">\n              <button\n                mlvButton\n                variant=\"transparent\"\n                size=\"s\"\n                type=\"button\"\n                class=\"mlv-date-range-picker__clear-btn\"\n                (click)=\"clearSelection()\"\n                [attr.aria-label]=\"_i18n().clearDateRange\"\n              >\n                Clear\n              </button>\n\n              <button\n                mlvButton\n                variant=\"primary\"\n                size=\"s\"\n                type=\"button\"\n                class=\"mlv-date-range-picker__apply-btn\"\n                [attr.disabled]=\"canApply() ? null : true\"\n                (click)=\"applySelection()\"\n                [attr.aria-label]=\"_i18n().applyDateRange\"\n              >\n                Apply\n              </button>\n            </div>\n          </div>\n        </ng-template>\n      </mlv-popup>\n    </mlv-popup-container>\n  </ng-template>\n\n  @if (description()) {\n  <mlv-description [id]=\"_descriptionId()\">{{ description() }}</mlv-description>\n  } @if (message()) {\n  <mlv-message [id]=\"_messageId()\" [state]=\"resolvedState()\">\n    {{ message() }}\n  </mlv-message>\n  }\n</mlv-form-control-wrapper>\n"]}

package/esm2022/date-range-picker/malva-ui-core-date-range-picker.js

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+export * from './index';
+//# sourceMappingURL=malva-ui-core-date-range-picker.js.map

package/esm2022/date-range-picker/malva-ui-core-date-range-picker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"malva-ui-core-date-range-picker.js","sourceRoot":"","sources":["../../../../../libs/core/date-range-picker/src/malva-ui-core-date-range-picker.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,cAAc,SAAS,CAAC","sourcesContent":["/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"]}

package/esm2022/day-picker/index.js

@@ -0,0 +1,2 @@
+export * from './lib/day-picker/day-picker';
+//# sourceMappingURL=index.js.map

package/esm2022/day-picker/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../libs/core/day-picker/src/index.ts"],"names":[],"mappings":"AAAA,cAAc,6BAA6B,CAAC","sourcesContent":["export * from './lib/day-picker/day-picker';\n"]}

package/esm2022/day-picker/lib/day-picker/day-picker.js

@@ -0,0 +1,124 @@
+import { ChangeDetectionStrategy, Component, computed, forwardRef, inject, input, model, signal, viewChild, ViewEncapsulation, } from '@angular/core';
+import { MlvPopup, MlvPopupContent, MlvPopupContainer, } from '@malva-ui/core/popup';
+import { MlvCalendar, MLV_DATE_ADAPTER, MlvNativeDateAdapter, } from '@malva-ui/core/calendar';
+import { LucideCalendar } from '@lucide/angular';
+import { MlvFormControlWrapper, MlvFormControlWrapperControl, MlvHint, MlvDescription, MlvLabel, MLV_FORM_CONTROL, MlvMessage, MlvSignalFormControlBase, } from '@malva-ui/core/form-utils';
+import { MLV_DAY_PICKER_I18N } from '@malva-ui/i18n';
+import * as i0 from "@angular/core";
+export class MlvDayPicker extends MlvSignalFormControlBase {
+    /** @private Active date adapter — injected token, falling back to the native adapter. */
+    _dateAdapter = inject(MLV_DATE_ADAPTER, {
+        optional: true,
+    }) ??
+        inject(MlvNativeDateAdapter);
+    value = model(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    /** Custom placeholder override. Falls back to the i18n-provided placeholder. */
+    placeholder = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
+    min = input(null, { ...(ngDevMode ? { debugName: "min" } : /* istanbul ignore next */ {}), transform: (value) => value ?? null });
+    max = input(null, { ...(ngDevMode ? { debugName: "max" } : /* istanbul ignore next */ {}), transform: (value) => value ?? null });
+    dateFormat = input('yyyy-MM-dd', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "dateFormat" }] : /* istanbul ignore next */ []));
+    /** @protected The component's i18n strings signal. */
+    _i18n = inject(MLV_DAY_PICKER_I18N);
+    /** @protected Resolved placeholder: explicit input takes precedence over i18n default. */
+    _resolvedPlaceholder = computed(() => this.placeholder() ?? this._i18n().placeholder, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_resolvedPlaceholder" }] : /* istanbul ignore next */ []));
+    // Override focused to also be true when the calendar popup is open
+    focused = computed(() => this._focused() || this.isOpen(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "focused" }] : /* istanbul ignore next */ []));
+    isOpen = signal(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "isOpen" }] : /* istanbul ignore next */ []));
+    /**
+     * The HTML `id` assigned to the visible `<mlv-label>` element. The trigger
+     * references it via `aria-labelledby` (a `<label for>` cannot name a `<div>`).
+     */
+    labelId = computed(() => `${this.id()}-label`, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "labelId" }] : /* istanbul ignore next */ []));
+    /** The HTML `id` of the calendar dialog region, for `aria-controls` linking. */
+    popupId = computed(() => `${this.id()}-popup`, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "popupId" }] : /* istanbul ignore next */ []));
+    /** @private Reference to the trigger element for focus restoration on close. */
+    _triggerRef = viewChild('triggerRef', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_triggerRef" }] : /* istanbul ignore next */ []));
+    get displayValue() {
+        const val = this.value();
+        if (!val)
+            return '';
+        return this._dateAdapter.format(val, {
+            year: 'numeric',
+            month: 'short',
+            day: 'numeric',
+        });
+    }
+    toggleDropdown() {
+        if (this.computedDisabled())
+            return;
+        this.isOpen.set(!this.isOpen());
+    }
+    onDateSelected(date) {
+        this.value.set(date);
+        this.isOpen.set(false);
+    }
+    /** @protected Marks the control touched when the trigger loses focus. */
+    _onTriggerBlur() {
+        this.setFocused(false);
+        this._markTouched();
+    }
+    /**
+     * @protected Called after the calendar popup opens. Moves focus into the
+     * calendar dialog so keyboard users land inside the modal surface.
+     */
+    _onPopupOpened() {
+        const panel = document.getElementById(this.popupId());
+        const target = panel?.querySelector('[tabindex="0"], button, [tabindex]');
+        target?.focus();
+    }
+    /**
+     * @protected Called after the calendar popup closes. Restores focus to the
+     * trigger element and clears the focused flag.
+     */
+    _onPopupClosed() {
+        this.setFocused(false);
+        this._markTouched();
+        this._triggerRef()?.nativeElement.focus();
+    }
+    /** Whether the control holds a clearable value — A date is set. */
+    hasValue = computed(() => this.value() != null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "hasValue" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvDayPicker, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: MlvDayPicker, isStandalone: true, selector: "mlv-day-picker", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", 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 }, dateFormat: { classPropertyName: "dateFormat", publicName: "dateFormat", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { properties: { "class": "\"mlv-day-picker--\" + resolvedState()", "class.mlv-day-picker--disabled": "computedDisabled()", "class.mlv-day-picker--open": "isOpen()" }, classAttribute: "mlv-day-picker" }, providers: [
+            {
+                provide: MLV_FORM_CONTROL,
+                useExisting: forwardRef(() => MlvDayPicker),
+            },
+        ], viewQueries: [{ propertyName: "_triggerRef", first: true, predicate: ["triggerRef"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<mlv-form-control-wrapper>\n  @if (label() || hint()) {\n  <mlv-label [id]=\"labelId()\" [for]=\"id()\" [required]=\"required()\">\n    {{ label() }} @if (hint()) {\n    <mlv-hint>{{ hint() }}</mlv-hint>\n    }\n  </mlv-label>\n  }\n\n  <ng-template mlvFormControlWrapperControl>\n    <mlv-popup-container class=\"mlv-day-picker__popup-container\">\n      <div\n        #triggerRef\n        class=\"mlv-day-picker__trigger\"\n        [id]=\"id()\"\n        role=\"combobox\"\n        [attr.aria-expanded]=\"isOpen()\"\n        [attr.aria-haspopup]=\"'dialog'\"\n        [attr.aria-controls]=\"isOpen() ? popupId() : null\"\n        [attr.aria-labelledby]=\"label() ? labelId() : null\"\n        [attr.aria-label]=\"label() ? null : ariaLabel()\"\n        [attr.aria-disabled]=\"computedDisabled() || null\"\n        [attr.aria-required]=\"required() || null\"\n        [attr.aria-describedby]=\"_describedBy()\"\n        [attr.tabindex]=\"computedDisabled() ? -1 : 0\"\n        (click)=\"toggleDropdown()\"\n        (keydown.enter)=\"toggleDropdown()\"\n        (keydown.space)=\"toggleDropdown(); $event.preventDefault()\"\n        (keydown.escape)=\"isOpen.set(false)\"\n        (focus)=\"setFocused(true)\"\n        (blur)=\"_onTriggerBlur()\"\n      >\n        @if (displayValue) {\n        <span class=\"mlv-day-picker__value\">{{ displayValue }}</span>\n        } @else {\n        <span class=\"mlv-day-picker__placeholder\"\n          >{{ _resolvedPlaceholder() }}</span\n        >\n        }\n        <span class=\"mlv-day-picker__icon\">\n          <svg lucideCalendar></svg>\n        </span>\n      </div>\n\n      <mlv-popup\n        [(opened)]=\"isOpen\"\n        [hasShadow]=\"true\"\n        panelRole=\"dialog\"\n        [modal]=\"true\"\n        mobileMode=\"auto\"\n        [mobileTitle]=\"label() || _resolvedPlaceholder()\"\n        [ariaLabel]=\"label() || _resolvedPlaceholder()\"\n        (afterOpened)=\"_onPopupOpened()\"\n        (afterClosed)=\"_onPopupClosed()\"\n      >\n        <ng-template mlvPopupContent>\n          <div [id]=\"popupId()\">\n            <mlv-calendar\n              embedded\n              [value]=\"value()\"\n              (valueChange)=\"onDateSelected($event)\"\n              [min]=\"min()\"\n              [max]=\"max()\"\n            />\n          </div>\n        </ng-template>\n      </mlv-popup>\n    </mlv-popup-container>\n  </ng-template>\n\n  @if (description()) {\n  <mlv-description [id]=\"_descriptionId()\">{{ description() }}</mlv-description>\n  } @if (message()) {\n  <mlv-message [id]=\"_messageId()\" [state]=\"resolvedState()\">\n    {{ message() }}\n  </mlv-message>\n  }\n</mlv-form-control-wrapper>\n", styles: [".mlv-day-picker{box-sizing:border-box;padding:0;margin:0;font-family:var(--mlv-typography-family-text);font-size:var(--mlv-font-size-m)}.mlv-day-picker *{box-sizing:border-box}.mlv-day-picker{display:block}.mlv-day-picker__popup-container{width:100%}.mlv-day-picker__trigger{display:flex;align-items:center;justify-content:space-between;width:100%;cursor:pointer;outline:none;min-height:1.5rem}.mlv-day-picker__trigger:focus-visible{outline:none}.mlv-day-picker__value{flex:1;color:var(--mlv-text-primary)}.mlv-day-picker__placeholder{flex:1;color:var(--mlv-text-secondary)}.mlv-day-picker__icon{display:flex;align-items:center;color:var(--mlv-text-secondary);margin-left:.5rem;line-height:1}.mlv-day-picker__icon svg{width:1.25rem;height:1.25rem}\n"], dependencies: [{ kind: "component", type: MlvPopup, selector: "mlv-popup", inputs: ["position", "positions", "width", "height", "minWidth", "minHeight", "maxWidth", "maxHeight", "hasArrow", "hasShadow", "class", "mlvDensity", "flexibleDimensions", "scrollStrategy", "hasBackdrop", "restrictPosition", "panelRole", "modal", "ariaLabel", "dismissExcludeElements", "mobileMode", "mobileBreakpoint", "mobileTitle", "mobileCloseLabel", "opened"], outputs: ["openedChange", "afterOpened", "afterClosed"] }, { kind: "directive", type: MlvPopupContent, selector: "[mlvPopupContent]" }, { kind: "component", type: MlvPopupContainer, selector: "mlv-popup-container" }, { kind: "component", type: MlvCalendar, selector: "mlv-calendar", inputs: ["value", "rangeValue", "min", "max", "disabledDates", "startView", "firstDayOfWeek", "range", "embedded", "activeDate"], outputs: ["valueChange", "rangeValueChange", "activeDateChange"] }, { kind: "component", type: LucideCalendar, selector: "svg[lucideCalendar]" }, { kind: "component", type: MlvFormControlWrapper, selector: "mlv-form-control-wrapper", outputs: ["clear"] }, { kind: "directive", type: MlvFormControlWrapperControl, selector: "[mlvFormControlWrapperControl]" }, { kind: "component", type: MlvDescription, selector: "mlv-description" }, { kind: "component", type: MlvLabel, selector: "mlv-label", inputs: ["for", "required"] }, { kind: "component", type: MlvHint, selector: "mlv-hint" }, { kind: "component", type: MlvMessage, selector: "mlv-message", inputs: ["state"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvDayPicker, decorators: [{
+            type: Component,
+            args: [{ selector: 'mlv-day-picker', imports: [
+                        MlvPopup,
+                        MlvPopupContent,
+                        MlvPopupContainer,
+                        MlvCalendar,
+                        LucideCalendar,
+                        MlvFormControlWrapper,
+                        MlvFormControlWrapperControl,
+                        MlvDescription,
+                        MlvLabel,
+                        MlvHint,
+                        MlvMessage,
+                    ], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
+                        {
+                            provide: MLV_FORM_CONTROL,
+                            useExisting: forwardRef(() => MlvDayPicker),
+                        },
+                    ], host: {
+                        class: 'mlv-day-picker',
+                        '[class]': '"mlv-day-picker--" + resolvedState()',
+                        '[class.mlv-day-picker--disabled]': 'computedDisabled()',
+                        '[class.mlv-day-picker--open]': 'isOpen()',
+                    }, template: "<mlv-form-control-wrapper>\n  @if (label() || hint()) {\n  <mlv-label [id]=\"labelId()\" [for]=\"id()\" [required]=\"required()\">\n    {{ label() }} @if (hint()) {\n    <mlv-hint>{{ hint() }}</mlv-hint>\n    }\n  </mlv-label>\n  }\n\n  <ng-template mlvFormControlWrapperControl>\n    <mlv-popup-container class=\"mlv-day-picker__popup-container\">\n      <div\n        #triggerRef\n        class=\"mlv-day-picker__trigger\"\n        [id]=\"id()\"\n        role=\"combobox\"\n        [attr.aria-expanded]=\"isOpen()\"\n        [attr.aria-haspopup]=\"'dialog'\"\n        [attr.aria-controls]=\"isOpen() ? popupId() : null\"\n        [attr.aria-labelledby]=\"label() ? labelId() : null\"\n        [attr.aria-label]=\"label() ? null : ariaLabel()\"\n        [attr.aria-disabled]=\"computedDisabled() || null\"\n        [attr.aria-required]=\"required() || null\"\n        [attr.aria-describedby]=\"_describedBy()\"\n        [attr.tabindex]=\"computedDisabled() ? -1 : 0\"\n        (click)=\"toggleDropdown()\"\n        (keydown.enter)=\"toggleDropdown()\"\n        (keydown.space)=\"toggleDropdown(); $event.preventDefault()\"\n        (keydown.escape)=\"isOpen.set(false)\"\n        (focus)=\"setFocused(true)\"\n        (blur)=\"_onTriggerBlur()\"\n      >\n        @if (displayValue) {\n        <span class=\"mlv-day-picker__value\">{{ displayValue }}</span>\n        } @else {\n        <span class=\"mlv-day-picker__placeholder\"\n          >{{ _resolvedPlaceholder() }}</span\n        >\n        }\n        <span class=\"mlv-day-picker__icon\">\n          <svg lucideCalendar></svg>\n        </span>\n      </div>\n\n      <mlv-popup\n        [(opened)]=\"isOpen\"\n        [hasShadow]=\"true\"\n        panelRole=\"dialog\"\n        [modal]=\"true\"\n        mobileMode=\"auto\"\n        [mobileTitle]=\"label() || _resolvedPlaceholder()\"\n        [ariaLabel]=\"label() || _resolvedPlaceholder()\"\n        (afterOpened)=\"_onPopupOpened()\"\n        (afterClosed)=\"_onPopupClosed()\"\n      >\n        <ng-template mlvPopupContent>\n          <div [id]=\"popupId()\">\n            <mlv-calendar\n              embedded\n              [value]=\"value()\"\n              (valueChange)=\"onDateSelected($event)\"\n              [min]=\"min()\"\n              [max]=\"max()\"\n            />\n          </div>\n        </ng-template>\n      </mlv-popup>\n    </mlv-popup-container>\n  </ng-template>\n\n  @if (description()) {\n  <mlv-description [id]=\"_descriptionId()\">{{ description() }}</mlv-description>\n  } @if (message()) {\n  <mlv-message [id]=\"_messageId()\" [state]=\"resolvedState()\">\n    {{ message() }}\n  </mlv-message>\n  }\n</mlv-form-control-wrapper>\n", styles: [".mlv-day-picker{box-sizing:border-box;padding:0;margin:0;font-family:var(--mlv-typography-family-text);font-size:var(--mlv-font-size-m)}.mlv-day-picker *{box-sizing:border-box}.mlv-day-picker{display:block}.mlv-day-picker__popup-container{width:100%}.mlv-day-picker__trigger{display:flex;align-items:center;justify-content:space-between;width:100%;cursor:pointer;outline:none;min-height:1.5rem}.mlv-day-picker__trigger:focus-visible{outline:none}.mlv-day-picker__value{flex:1;color:var(--mlv-text-primary)}.mlv-day-picker__placeholder{flex:1;color:var(--mlv-text-secondary)}.mlv-day-picker__icon{display:flex;align-items:center;color:var(--mlv-text-secondary);margin-left:.5rem;line-height:1}.mlv-day-picker__icon svg{width:1.25rem;height:1.25rem}\n"] }]
+        }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], min: [{ type: i0.Input, args: [{ isSignal: true, alias: "min", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], dateFormat: [{ type: i0.Input, args: [{ isSignal: true, alias: "dateFormat", required: false }] }], _triggerRef: [{ type: i0.ViewChild, args: ['triggerRef', { isSignal: true }] }] } });
+//# sourceMappingURL=day-picker.js.map

package/esm2022/day-picker/lib/day-picker/day-picker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"day-picker.js","sourceRoot":"","sources":["../../../../../../../libs/core/day-picker/src/lib/day-picker/day-picker.ts","../../../../../../../libs/core/day-picker/src/lib/day-picker/day-picker.html"],"names":[],"mappings":"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","sourcesContent":["import type { ElementRef } from '@angular/core';\nimport {\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  forwardRef,\n  inject,\n  input,\n  model,\n  signal,\n  viewChild,\n  ViewEncapsulation,\n} from '@angular/core';\nimport {\n  MlvPopup,\n  MlvPopupContent,\n  MlvPopupContainer,\n} from '@malva-ui/core/popup';\nimport {\n  MlvCalendar,\n  MLV_DATE_ADAPTER,\n  MlvNativeDateAdapter,\n  type MlvDateAdapter,\n} from '@malva-ui/core/calendar';\nimport { LucideCalendar } from '@lucide/angular';\nimport type { MlvFormState, MlvFormControl } from '@malva-ui/core/form-utils';\nimport {\n  MlvFormControlWrapper,\n  MlvFormControlWrapperControl,\n  MlvHint,\n  MlvDescription,\n  MlvLabel,\n  MLV_FORM_CONTROL,\n  MlvMessage,\n  MlvSignalFormControlBase,\n} from '@malva-ui/core/form-utils';\nimport { MLV_DAY_PICKER_I18N } from '@malva-ui/i18n';\n\n/**\n * Visual/validation state of the day picker. Mirrors {@link MlvFormState}.\n */\nexport type MlvDayPickerState = MlvFormState;\n\n@Component({\n  selector: 'mlv-day-picker',\n  imports: [\n    MlvPopup,\n    MlvPopupContent,\n    MlvPopupContainer,\n    MlvCalendar,\n    LucideCalendar,\n    MlvFormControlWrapper,\n    MlvFormControlWrapperControl,\n    MlvDescription,\n    MlvLabel,\n    MlvHint,\n    MlvMessage,\n  ],\n  templateUrl: './day-picker.html',\n  styleUrl: './day-picker.scss',\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  providers: [\n    {\n      provide: MLV_FORM_CONTROL,\n      useExisting: forwardRef(() => MlvDayPicker),\n    },\n  ],\n  host: {\n    class: 'mlv-day-picker',\n    '[class]': '\"mlv-day-picker--\" + resolvedState()',\n    '[class.mlv-day-picker--disabled]': 'computedDisabled()',\n    '[class.mlv-day-picker--open]': 'isOpen()',\n  },\n})\nexport class MlvDayPicker<D = Date>\n  extends MlvSignalFormControlBase<D | null>\n  implements MlvFormControl\n{\n  /** @private Active date adapter — injected token, falling back to the native adapter. */\n  private readonly _dateAdapter =\n    (inject(MLV_DATE_ADAPTER, {\n      optional: true,\n    }) as MlvDateAdapter<D> | null) ??\n    (inject(MlvNativeDateAdapter) as unknown as MlvDateAdapter<D>);\n\n  readonly value = model<D | null>(null);\n  /** Custom placeholder override. Falls back to the i18n-provided placeholder. */\n  readonly placeholder = input<string | undefined>(undefined);\n  readonly min = input<D | null, D | null | undefined>(null, {\n    transform: (value) => value ?? null,\n  });\n  readonly max = input<D | null, D | null | undefined>(null, {\n    transform: (value) => value ?? null,\n  });\n  readonly dateFormat = input<string>('yyyy-MM-dd');\n\n  /** @protected The component's i18n strings signal. */\n  protected readonly _i18n = inject(MLV_DAY_PICKER_I18N);\n\n  /** @protected Resolved placeholder: explicit input takes precedence over i18n default. */\n  protected readonly _resolvedPlaceholder = computed(\n    () => this.placeholder() ?? this._i18n().placeholder,\n  );\n\n  // Override focused to also be true when the calendar popup is open\n  override readonly focused = computed(() => this._focused() || this.isOpen());\n\n  readonly isOpen = signal(false);\n\n  /**\n   * The HTML `id` assigned to the visible `<mlv-label>` element. The trigger\n   * references it via `aria-labelledby` (a `<label for>` cannot name a `<div>`).\n   */\n  readonly labelId = computed(() => `${this.id()}-label`);\n\n  /** The HTML `id` of the calendar dialog region, for `aria-controls` linking. */\n  readonly popupId = computed(() => `${this.id()}-popup`);\n\n  /** @private Reference to the trigger element for focus restoration on close. */\n  private readonly _triggerRef =\n    viewChild<ElementRef<HTMLElement>>('triggerRef');\n\n  get displayValue(): string {\n    const val = this.value();\n    if (!val) return '';\n    return this._dateAdapter.format(val, {\n      year: 'numeric',\n      month: 'short',\n      day: 'numeric',\n    });\n  }\n\n  toggleDropdown(): void {\n    if (this.computedDisabled()) return;\n    this.isOpen.set(!this.isOpen());\n  }\n\n  onDateSelected(date: D | null): void {\n    this.value.set(date);\n    this.isOpen.set(false);\n  }\n\n  /** @protected Marks the control touched when the trigger loses focus. */\n  protected _onTriggerBlur(): void {\n    this.setFocused(false);\n    this._markTouched();\n  }\n\n  /**\n   * @protected Called after the calendar popup opens. Moves focus into the\n   * calendar dialog so keyboard users land inside the modal surface.\n   */\n  protected _onPopupOpened(): void {\n    const panel = document.getElementById(this.popupId());\n    const target = panel?.querySelector<HTMLElement>(\n      '[tabindex=\"0\"], button, [tabindex]',\n    );\n    target?.focus();\n  }\n\n  /**\n   * @protected Called after the calendar popup closes. Restores focus to the\n   * trigger element and clears the focused flag.\n   */\n  protected _onPopupClosed(): void {\n    this.setFocused(false);\n    this._markTouched();\n    this._triggerRef()?.nativeElement.focus();\n  }\n\n  /** Whether the control holds a clearable value — A date is set. */\n  readonly hasValue = computed(() => this.value() != null);\n}\n","<mlv-form-control-wrapper>\n  @if (label() || hint()) {\n  <mlv-label [id]=\"labelId()\" [for]=\"id()\" [required]=\"required()\">\n    {{ label() }} @if (hint()) {\n    <mlv-hint>{{ hint() }}</mlv-hint>\n    }\n  </mlv-label>\n  }\n\n  <ng-template mlvFormControlWrapperControl>\n    <mlv-popup-container class=\"mlv-day-picker__popup-container\">\n      <div\n        #triggerRef\n        class=\"mlv-day-picker__trigger\"\n        [id]=\"id()\"\n        role=\"combobox\"\n        [attr.aria-expanded]=\"isOpen()\"\n        [attr.aria-haspopup]=\"'dialog'\"\n        [attr.aria-controls]=\"isOpen() ? popupId() : null\"\n        [attr.aria-labelledby]=\"label() ? labelId() : null\"\n        [attr.aria-label]=\"label() ? null : ariaLabel()\"\n        [attr.aria-disabled]=\"computedDisabled() || null\"\n        [attr.aria-required]=\"required() || null\"\n        [attr.aria-describedby]=\"_describedBy()\"\n        [attr.tabindex]=\"computedDisabled() ? -1 : 0\"\n        (click)=\"toggleDropdown()\"\n        (keydown.enter)=\"toggleDropdown()\"\n        (keydown.space)=\"toggleDropdown(); $event.preventDefault()\"\n        (keydown.escape)=\"isOpen.set(false)\"\n        (focus)=\"setFocused(true)\"\n        (blur)=\"_onTriggerBlur()\"\n      >\n        @if (displayValue) {\n        <span class=\"mlv-day-picker__value\">{{ displayValue }}</span>\n        } @else {\n        <span class=\"mlv-day-picker__placeholder\"\n          >{{ _resolvedPlaceholder() }}</span\n        >\n        }\n        <span class=\"mlv-day-picker__icon\">\n          <svg lucideCalendar></svg>\n        </span>\n      </div>\n\n      <mlv-popup\n        [(opened)]=\"isOpen\"\n        [hasShadow]=\"true\"\n        panelRole=\"dialog\"\n        [modal]=\"true\"\n        mobileMode=\"auto\"\n        [mobileTitle]=\"label() || _resolvedPlaceholder()\"\n        [ariaLabel]=\"label() || _resolvedPlaceholder()\"\n        (afterOpened)=\"_onPopupOpened()\"\n        (afterClosed)=\"_onPopupClosed()\"\n      >\n        <ng-template mlvPopupContent>\n          <div [id]=\"popupId()\">\n            <mlv-calendar\n              embedded\n              [value]=\"value()\"\n              (valueChange)=\"onDateSelected($event)\"\n              [min]=\"min()\"\n              [max]=\"max()\"\n            />\n          </div>\n        </ng-template>\n      </mlv-popup>\n    </mlv-popup-container>\n  </ng-template>\n\n  @if (description()) {\n  <mlv-description [id]=\"_descriptionId()\">{{ description() }}</mlv-description>\n  } @if (message()) {\n  <mlv-message [id]=\"_messageId()\" [state]=\"resolvedState()\">\n    {{ message() }}\n  </mlv-message>\n  }\n</mlv-form-control-wrapper>\n"]}

package/esm2022/day-picker/malva-ui-core-day-picker.js

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+export * from './index';
+//# sourceMappingURL=malva-ui-core-day-picker.js.map