pdm-ui-kit 0.4.2 → 1.1.0

package/fesm2015/pdm-ui-kit-src-calendar.mjs

@@ -0,0 +1,912 @@
+import * as i0 from '@angular/core';
+import { inject, ChangeDetectorRef, EventEmitter, Component, ChangeDetectionStrategy, Input, Output, ViewChild, HostListener, NgModule } from '@angular/core';
+import * as i1 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import { TemplatePortal } from '@angular/cdk/portal';
+import { format } from 'date-fns';
+import { createFlexiblePositionStrategy, mergeOverlayPanelClass, OVERLAY_BASE_Z_INDEX } from 'pdm-ui-kit/src/overlay';
+import * as i1$1 from '@angular/cdk/overlay';
+import { OverlayModule } from '@angular/cdk/overlay';
+import * as i3 from 'pdm-ui-kit/src/label';
+import { PdmLabelModule } from 'pdm-ui-kit/src/label';
+
+const DAY_MS = 24 * 60 * 60 * 1000;
+class PdmCalendarComponent {
+    constructor() {
+        this._value = null;
+        this._rangeValue = null;
+        this._month = null;
+        this.cdr = inject(ChangeDetectorRef);
+        this.variant = "single";
+        this.className = "";
+        this.disabledDates = [];
+        this.minDate = null;
+        this.maxDate = null;
+        this.minYear = null;
+        this.maxYear = null;
+        this.isDateDisabled = null;
+        this.allowSameDayRange = true;
+        this.readonly = false;
+        this.valueChange = new EventEmitter();
+        this.rangeValueChange = new EventEmitter();
+        this.monthChange = new EventEmitter();
+        this.dateClick = new EventEmitter();
+        this.disabledDateClick = new EventEmitter();
+        this.weekdays = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
+        this.monthOptions = [
+            { value: 0, label: "Jan" },
+            { value: 1, label: "Feb" },
+            { value: 2, label: "Mar" },
+            { value: 3, label: "Apr" },
+            { value: 4, label: "May" },
+            { value: 5, label: "Jun" },
+            { value: 6, label: "Jul" },
+            { value: 7, label: "Aug" },
+            { value: 8, label: "Sep" },
+            { value: 9, label: "Oct" },
+            { value: 10, label: "Nov" },
+            { value: 11, label: "Dec" },
+        ];
+        this.trackByIndex = (index) => {
+            return index;
+        };
+        this.trackByDate = (_index, cell) => {
+            return this.dateKey(cell.date);
+        };
+    }
+    set value(value) {
+        this._value = this.normalizeDate(value);
+    }
+    get value() {
+        return this._value;
+    }
+    set rangeValue(value) {
+        this._rangeValue = value
+            ? {
+                start: this.normalizeDate(value.start),
+                end: this.normalizeDate(value.end),
+            }
+            : null;
+    }
+    get rangeValue() {
+        return this._rangeValue;
+    }
+    set month(value) {
+        this._month = value ? this.startOfMonth(value) : null;
+    }
+    get month() {
+        return this._month;
+    }
+    get resolvedVariant() {
+        return this.variant === "range" ? "range" : "single";
+    }
+    get visibleMonths() {
+        const baseMonth = this.getAnchorMonth();
+        if (this.resolvedVariant === "single") {
+            return [
+                {
+                    date: baseMonth,
+                    title: this.formatMonthYear(baseMonth),
+                    titleStyle: "dropdowns",
+                    dropdownMonth: this.formatMonthShort(baseMonth),
+                    dropdownYear: String(baseMonth.getFullYear()),
+                    showPrevButton: true,
+                    showNextButton: true,
+                    weeks: this.buildMonthWeeks(baseMonth, false),
+                },
+            ];
+        }
+        const nextMonth = this.addMonths(baseMonth, 1);
+        return [
+            {
+                date: baseMonth,
+                title: this.formatMonthYear(baseMonth),
+                titleStyle: "plain",
+                showPrevButton: true,
+                showNextButton: false,
+                weeks: this.buildMonthWeeks(baseMonth, true),
+            },
+            {
+                date: nextMonth,
+                title: this.formatMonthYear(nextMonth),
+                titleStyle: "plain",
+                showPrevButton: false,
+                showNextButton: true,
+                weeks: this.buildMonthWeeks(nextMonth, true),
+            },
+        ];
+    }
+    get singleHeaderMonth() {
+        return this.getAnchorMonth().getMonth();
+    }
+    get singleHeaderYear() {
+        return this.getAnchorMonth().getFullYear();
+    }
+    get yearOptions() {
+        var _a, _b;
+        const baseYear = new Date().getFullYear();
+        const selectedYear = this.singleHeaderYear;
+        let minYear = (_a = this.minYear) !== null && _a !== void 0 ? _a : (this.minDate ? this.minDate.getFullYear() : baseYear - 100);
+        let maxYear = (_b = this.maxYear) !== null && _b !== void 0 ? _b : (this.maxDate ? this.maxDate.getFullYear() : baseYear + 10);
+        const years = [];
+        if (selectedYear < minYear) {
+            minYear = selectedYear;
+        }
+        if (selectedYear > maxYear) {
+            maxYear = selectedYear;
+        }
+        if (minYear > maxYear) {
+            const nextMin = maxYear;
+            maxYear = minYear;
+            minYear = nextMin;
+        }
+        for (let year = minYear; year <= maxYear; year += 1) {
+            years.push(year);
+        }
+        return years;
+    }
+    get rootClasses() {
+        return [
+            "border-border bg-background relative rounded-[10px] border border-solid p-3 shadow-sm",
+            this.resolvedVariant === "range"
+                ? "inline-flex items-start justify-center gap-4 shrink-0 grow-0 basis-auto"
+                : "inline-flex flex-col gap-4 shrink-0 grow-0 basis-auto",
+            this.className,
+        ];
+    }
+    get rootStyle() {
+        const width = this.resolvedVariant === "range" ? "488px" : "250px";
+        return {
+            width,
+            minWidth: width,
+            maxWidth: width,
+            minHeight: "293px",
+            flex: "0 0 auto",
+            alignSelf: "flex-start",
+        };
+    }
+    monthPanelClasses(_index) {
+        return [
+            "flex flex-col items-start",
+            this.resolvedVariant === "range" ? "w-[224px] gap-4" : "w-full gap-0",
+        ];
+    }
+    headerClasses(month) {
+        return [
+            "flex w-full items-center justify-between",
+            month.titleStyle === "dropdowns" ? "" : "mb-4",
+        ];
+    }
+    navButtonClasses() {
+        return [
+            "flex h-8 w-8 appearance-none box-border items-center justify-center rounded-md border-0 bg-transparent p-0 text-foreground",
+            "disabled:pointer-events-none disabled:opacity-40",
+        ];
+    }
+    navPlaceholderClasses() {
+        return ["h-7 w-7 shrink-0"];
+    }
+    dropdownWrapClasses() {
+        return ["flex w-40 items-center justify-center gap-2"];
+    }
+    dropdownClasses(widthClass) {
+        return ["flex h-8 items-center justify-center gap-1 px-1", widthClass];
+    }
+    dropdownSelectClasses() {
+        return [
+            "text-foreground h-full bg-transparent text-sm font-medium leading-5",
+            "appearance-none box-border border-0 outline-none ring-0 focus:outline-none focus:ring-0 text-center cursor-pointer",
+        ];
+    }
+    get dropdownSelectStyle() {
+        return {
+            appearance: "none",
+            WebkitAppearance: "none",
+            MozAppearance: "none",
+            background: "transparent",
+            border: "0",
+            boxShadow: "none",
+            outline: "0",
+            padding: "0",
+            margin: "0",
+        };
+    }
+    calendarGridWrapClasses() {
+        return ["flex w-full flex-col items-start"];
+    }
+    weekdayRowClasses() {
+        return ["flex w-full items-center"];
+    }
+    weekdayCellClasses() {
+        return [
+            "text-muted-foreground flex h-[21px] w-8 items-center justify-center rounded-md text-xs leading-4",
+        ];
+    }
+    weekRowClasses() {
+        return ["flex w-full items-start pt-2"];
+    }
+    dayCellClasses(cell) {
+        return [
+            "relative flex h-8 w-8 shrink-0 items-center justify-center",
+            cell.rangeFill ? "bg-accent" : "",
+            cell.rangeLeftCap ? "rounded-l-md" : "",
+            cell.rangeRightCap ? "rounded-r-md" : "",
+        ];
+    }
+    dayButtonClasses(cell) {
+        return [
+            "relative z-10 flex h-8 w-8 appearance-none box-border items-center justify-center rounded-md border-0 p-0 text-sm leading-5",
+            cell.selected
+                ? "bg-primary text-primary-foreground"
+                : cell.rangeFill
+                    ? "bg-transparent text-accent-foreground"
+                    : "bg-transparent text-foreground",
+            cell.muted && !cell.rangeFill ? "opacity-50" : "",
+            cell.disabled ? "cursor-not-allowed opacity-40" : "",
+            !cell.disabled && !this.readonly && !cell.selected
+                ? "hover:bg-accent/70"
+                : "",
+        ];
+    }
+    dayLabelClasses(_cell) {
+        return ["font-normal"];
+    }
+    goToPreviousMonth() {
+        this.setAnchorMonth(this.addMonths(this.getAnchorMonth(), -1));
+    }
+    goToNextMonth() {
+        this.setAnchorMonth(this.addMonths(this.getAnchorMonth(), 1));
+    }
+    onSingleMonthChange(monthValue) {
+        const month = Number(monthValue);
+        if (Number.isNaN(month) || month < 0 || month > 11) {
+            return;
+        }
+        const anchor = this.getAnchorMonth();
+        this.setAnchorMonth(new Date(anchor.getFullYear(), month, 1));
+    }
+    onSingleYearChange(yearValue) {
+        const year = Number(yearValue);
+        if (Number.isNaN(year)) {
+            return;
+        }
+        const anchor = this.getAnchorMonth();
+        this.setAnchorMonth(new Date(year, anchor.getMonth(), 1));
+    }
+    onDatePressed(cell) {
+        const date = this.cloneDate(cell.date);
+        if (cell.disabled) {
+            this.disabledDateClick.emit(date);
+            return;
+        }
+        if (this.readonly) {
+            return;
+        }
+        this.dateClick.emit(date);
+        if (this.resolvedVariant === "single") {
+            this._value = date;
+            this.valueChange.emit(this.cloneDate(date));
+            this.syncVisibleMonthToDate(date);
+            this.cdr.markForCheck();
+            return;
+        }
+        this.handleRangeSelection(date);
+        this.cdr.markForCheck();
+    }
+    handleRangeSelection(date) {
+        const current = this._rangeValue;
+        const currentStart = (current === null || current === void 0 ? void 0 : current.start) ? this.cloneDate(current.start) : null;
+        const currentEnd = (current === null || current === void 0 ? void 0 : current.end) ? this.cloneDate(current.end) : null;
+        if (!currentStart || (currentStart && currentEnd)) {
+            this._rangeValue = { start: date, end: null };
+            this.rangeValueChange.emit({ start: this.cloneDate(date), end: null });
+            this.syncVisibleMonthToDate(date);
+            return;
+        }
+        if (this.isSameDay(currentStart, date) && !this.allowSameDayRange) {
+            this._rangeValue = { start: date, end: null };
+            this.rangeValueChange.emit({ start: this.cloneDate(date), end: null });
+            return;
+        }
+        const start = this.compareDate(date, currentStart) < 0 ? date : currentStart;
+        const end = this.compareDate(date, currentStart) < 0 ? currentStart : date;
+        if (this.rangeContainsBlockedDate(start, end)) {
+            this.disabledDateClick.emit(this.cloneDate(date));
+            return;
+        }
+        this._rangeValue = { start, end };
+        this.rangeValueChange.emit({
+            start: this.cloneDate(start),
+            end: this.cloneDate(end),
+        });
+        this.syncVisibleMonthToDate(start);
+    }
+    buildMonthWeeks(month, includeRange) {
+        const firstOfMonth = this.startOfMonth(month);
+        const start = this.startOfWeek(firstOfMonth);
+        const end = this.endOfWeek(this.endOfMonth(firstOfMonth));
+        const weeks = [];
+        let cursor = this.cloneDate(start);
+        while (this.compareDate(cursor, end) <= 0) {
+            const row = [];
+            for (let col = 0; col < 7; col += 1) {
+                row.push(this.buildCell(cursor, month, includeRange));
+                cursor = this.addDays(cursor, 1);
+            }
+            weeks.push(row);
+        }
+        for (const row of weeks) {
+            for (let col = 0; col < row.length; col += 1) {
+                const cell = row[col];
+                if (!cell.inRange) {
+                    continue;
+                }
+                const leftInRow = col > 0 ? row[col - 1].inRange : false;
+                const rightInRow = col < row.length - 1 ? row[col + 1].inRange : false;
+                cell.rangeLeftCap = !leftInRow;
+                cell.rangeRightCap = !rightInRow;
+            }
+        }
+        return weeks;
+    }
+    buildCell(date, visibleMonth, includeRange) {
+        var _a, _b, _c, _d;
+        const normalized = this.cloneDate(date);
+        const inCurrentMonth = normalized.getMonth() === visibleMonth.getMonth() &&
+            normalized.getFullYear() === visibleMonth.getFullYear();
+        const disabled = this.isBlocked(normalized);
+        const selectedSingle = this.resolvedVariant === "single" &&
+            !!this._value &&
+            this.isSameDay(normalized, this._value);
+        const rangeStart = includeRange &&
+            !!((_a = this._rangeValue) === null || _a === void 0 ? void 0 : _a.start) &&
+            this.isSameDay(normalized, this._rangeValue.start);
+        const rangeEnd = includeRange &&
+            !!((_b = this._rangeValue) === null || _b === void 0 ? void 0 : _b.end) &&
+            this.isSameDay(normalized, this._rangeValue.end);
+        const inRange = includeRange &&
+            !!((_c = this._rangeValue) === null || _c === void 0 ? void 0 : _c.start) &&
+            !!((_d = this._rangeValue) === null || _d === void 0 ? void 0 : _d.end) &&
+            this.compareDate(normalized, this._rangeValue.start) >= 0 &&
+            this.compareDate(normalized, this._rangeValue.end) <= 0;
+        return {
+            date: normalized,
+            label: normalized.getDate(),
+            muted: !inCurrentMonth,
+            disabled,
+            selected: selectedSingle || rangeStart || rangeEnd,
+            inRange,
+            rangeFill: inRange,
+            rangeLeftCap: false,
+            rangeRightCap: false,
+        };
+    }
+    getAnchorMonth() {
+        var _a;
+        let candidate = null;
+        if (this._month) {
+            candidate = this.cloneDate(this._month);
+        }
+        else if (this.resolvedVariant === "single" && this._value) {
+            candidate = this.startOfMonth(this._value);
+        }
+        else if (this.resolvedVariant === "range" && ((_a = this._rangeValue) === null || _a === void 0 ? void 0 : _a.start)) {
+            candidate = this.startOfMonth(this._rangeValue.start);
+        }
+        else {
+            candidate = this.startOfMonth(new Date());
+        }
+        if (!this.isValidDate(candidate)) {
+            return this.startOfMonth(new Date());
+        }
+        return candidate;
+    }
+    setAnchorMonth(month) {
+        const normalized = this.startOfMonth(month);
+        if (!this.isValidDate(normalized)) {
+            return;
+        }
+        this._month = normalized;
+        this.monthChange.emit(this.cloneDate(this._month));
+    }
+    syncVisibleMonthToDate(date) {
+        const nextMonth = this.startOfMonth(date);
+        if (!this._month || !this.isSameMonth(this._month, nextMonth)) {
+            this._month = nextMonth;
+            this.monthChange.emit(this.cloneDate(nextMonth));
+        }
+    }
+    isBlocked(date) {
+        var _a;
+        if (this.minDate && this.compareDate(date, this.minDate) < 0) {
+            return true;
+        }
+        if (this.maxDate && this.compareDate(date, this.maxDate) > 0) {
+            return true;
+        }
+        const blockedSet = new Set((this.disabledDates || []).map((item) => this.dateKey(item)));
+        if (blockedSet.has(this.dateKey(date))) {
+            return true;
+        }
+        return !!((_a = this.isDateDisabled) === null || _a === void 0 ? void 0 : _a.call(this, this.cloneDate(date)));
+    }
+    rangeContainsBlockedDate(start, end) {
+        let cursor = this.cloneDate(start);
+        while (this.compareDate(cursor, end) <= 0) {
+            if (this.isBlocked(cursor)) {
+                return true;
+            }
+            cursor = this.addDays(cursor, 1);
+        }
+        return false;
+    }
+    normalizeDate(value) {
+        if (!(value instanceof Date) || Number.isNaN(value.getTime())) {
+            return null;
+        }
+        return new Date(value.getFullYear(), value.getMonth(), value.getDate());
+    }
+    cloneDate(date) {
+        return new Date(date.getFullYear(), date.getMonth(), date.getDate());
+    }
+    isValidDate(date) {
+        return !!date && date instanceof Date && !Number.isNaN(date.getTime());
+    }
+    startOfMonth(date) {
+        return new Date(date.getFullYear(), date.getMonth(), 1);
+    }
+    endOfMonth(date) {
+        return new Date(date.getFullYear(), date.getMonth() + 1, 0);
+    }
+    startOfWeek(date) {
+        return this.addDays(date, -date.getDay());
+    }
+    endOfWeek(date) {
+        return this.addDays(date, 6 - date.getDay());
+    }
+    addMonths(date, months) {
+        return new Date(date.getFullYear(), date.getMonth() + months, 1);
+    }
+    addDays(date, days) {
+        return new Date(date.getFullYear(), date.getMonth(), date.getDate() + days);
+    }
+    compareDate(a, b) {
+        return this.dateValue(a) - this.dateValue(b);
+    }
+    dateValue(date) {
+        return (Date.UTC(date.getFullYear(), date.getMonth(), date.getDate()) / DAY_MS);
+    }
+    isSameDay(a, b) {
+        return this.compareDate(a, b) === 0;
+    }
+    isSameMonth(a, b) {
+        return a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth();
+    }
+    dateKey(date) {
+        const y = date.getFullYear();
+        const m = String(date.getMonth() + 1).padStart(2, "0");
+        const d = String(date.getDate()).padStart(2, "0");
+        return `${y}-${m}-${d}`;
+    }
+    formatMonthShort(date) {
+        return date.toLocaleString("en-US", { month: "short" });
+    }
+    formatMonthYear(date) {
+        return date.toLocaleString("en-US", { month: "long", year: "numeric" });
+    }
+}
+PdmCalendarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmCalendarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+PdmCalendarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmCalendarComponent, selector: "pdm-calendar", inputs: { variant: "variant", className: "className", disabledDates: "disabledDates", minDate: "minDate", maxDate: "maxDate", minYear: "minYear", maxYear: "maxYear", isDateDisabled: "isDateDisabled", allowSameDayRange: "allowSameDayRange", readonly: "readonly", value: "value", rangeValue: "rangeValue", month: "month" }, outputs: { valueChange: "valueChange", rangeValueChange: "rangeValueChange", monthChange: "monthChange", dateClick: "dateClick", disabledDateClick: "disabledDateClick" }, ngImport: i0, template: "<div [ngClass]=\"rootClasses\" [ngStyle]=\"rootStyle\">\n  <div *ngFor=\"let month of visibleMonths; let monthIndex = index; trackBy: trackByIndex\" [ngClass]=\"monthPanelClasses(monthIndex)\">\n    <div [ngClass]=\"headerClasses(month)\">\n      <button\n        *ngIf=\"month.showPrevButton; else prevPlaceholder\"\n        type=\"button\"\n        [ngClass]=\"navButtonClasses()\"\n        aria-label=\"Previous month\"\n        (click)=\"goToPreviousMonth()\"\n        [disabled]=\"readonly\"\n      >\n        <svg viewBox=\"0 0 24 24\" class=\"h-4 w-4\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" aria-hidden=\"true\">\n          <path d=\"m15 18-6-6 6-6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n        </svg>\n      </button>\n      <ng-template #prevPlaceholder>\n        <div [ngClass]=\"navPlaceholderClasses()\" aria-hidden=\"true\"></div>\n      </ng-template>\n\n      <ng-container *ngIf=\"month.titleStyle === 'dropdowns'; else plainTitle\">\n        <div [ngClass]=\"dropdownWrapClasses()\">\n          <div [ngClass]=\"dropdownClasses('w-16 sm:w-[72px]')\">\n            <select\n              [ngClass]=\"dropdownSelectClasses()\"\n              [ngStyle]=\"dropdownSelectStyle\"\n              [value]=\"singleHeaderMonth\"\n              aria-label=\"Month\"\n              (change)=\"onSingleMonthChange($any($event.target).value)\"\n            >\n              <option\n                *ngFor=\"let monthOption of monthOptions\"\n                [value]=\"monthOption.value\"\n                [selected]=\"monthOption.value === singleHeaderMonth\"\n              >\n                {{ monthOption.label }}\n              </option>\n            </select>\n            <svg viewBox=\"0 0 24 24\" class=\"h-3 w-3 text-foreground\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" aria-hidden=\"true\">\n              <path d=\"m6 9 6 6 6-6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n            </svg>\n          </div>\n          <div [ngClass]=\"dropdownClasses('w-16 sm:w-[82px]')\">\n            <select\n              [ngClass]=\"dropdownSelectClasses()\"\n              [ngStyle]=\"dropdownSelectStyle\"\n              [value]=\"singleHeaderYear\"\n              aria-label=\"Year\"\n              (change)=\"onSingleYearChange($any($event.target).value)\"\n            >\n              <option\n                *ngFor=\"let year of yearOptions\"\n                [value]=\"year\"\n                [selected]=\"year === singleHeaderYear\"\n              >\n                {{ year }}\n              </option>\n            </select>\n            <svg viewBox=\"0 0 24 24\" class=\"h-3 w-3 text-foreground\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" aria-hidden=\"true\">\n              <path d=\"m6 9 6 6 6-6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n            </svg>\n          </div>\n        </div>\n      </ng-container>\n\n      <ng-template #plainTitle>\n        <div class=\"flex min-w-0 flex-1 items-center justify-center\">\n          <p class=\"m-0 text-foreground text-center text-sm font-medium leading-5\">\n            {{ month.title }}\n          </p>\n        </div>\n      </ng-template>\n\n      <button\n        *ngIf=\"month.showNextButton; else nextPlaceholder\"\n        type=\"button\"\n        [ngClass]=\"navButtonClasses()\"\n        aria-label=\"Next month\"\n        (click)=\"goToNextMonth()\"\n        [disabled]=\"readonly\"\n      >\n        <svg viewBox=\"0 0 24 24\" class=\"h-4 w-4\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" aria-hidden=\"true\">\n          <path d=\"m9 18 6-6-6-6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n        </svg>\n      </button>\n      <ng-template #nextPlaceholder>\n        <div [ngClass]=\"navPlaceholderClasses()\" aria-hidden=\"true\"></div>\n      </ng-template>\n    </div>\n\n    <div [ngClass]=\"calendarGridWrapClasses()\">\n      <div [ngClass]=\"weekdayRowClasses()\">\n        <div *ngFor=\"let day of weekdays; trackBy: trackByIndex\" [ngClass]=\"weekdayCellClasses()\">\n          <span>{{ day }}</span>\n        </div>\n      </div>\n\n      <div *ngFor=\"let week of month.weeks; trackBy: trackByIndex\" [ngClass]=\"weekRowClasses()\">\n        <div *ngFor=\"let cell of week; trackBy: trackByDate\" [ngClass]=\"dayCellClasses(cell)\">\n          <button\n            type=\"button\"\n            [ngClass]=\"dayButtonClasses(cell)\"\n            [disabled]=\"readonly\"\n            [attr.aria-selected]=\"cell.selected\"\n            [attr.aria-disabled]=\"cell.disabled || readonly\"\n            [attr.title]=\"cell.date | date : 'yyyy-MM-dd'\"\n            (click)=\"onDatePressed(cell)\"\n          >\n            <span [ngClass]=\"dayLabelClasses(cell)\">{{ cell.label }}</span>\n          </button>\n        </div>\n      </div>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "pipe", type: i1.DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmCalendarComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "pdm-calendar", changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [ngClass]=\"rootClasses\" [ngStyle]=\"rootStyle\">\n  <div *ngFor=\"let month of visibleMonths; let monthIndex = index; trackBy: trackByIndex\" [ngClass]=\"monthPanelClasses(monthIndex)\">\n    <div [ngClass]=\"headerClasses(month)\">\n      <button\n        *ngIf=\"month.showPrevButton; else prevPlaceholder\"\n        type=\"button\"\n        [ngClass]=\"navButtonClasses()\"\n        aria-label=\"Previous month\"\n        (click)=\"goToPreviousMonth()\"\n        [disabled]=\"readonly\"\n      >\n        <svg viewBox=\"0 0 24 24\" class=\"h-4 w-4\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" aria-hidden=\"true\">\n          <path d=\"m15 18-6-6 6-6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n        </svg>\n      </button>\n      <ng-template #prevPlaceholder>\n        <div [ngClass]=\"navPlaceholderClasses()\" aria-hidden=\"true\"></div>\n      </ng-template>\n\n      <ng-container *ngIf=\"month.titleStyle === 'dropdowns'; else plainTitle\">\n        <div [ngClass]=\"dropdownWrapClasses()\">\n          <div [ngClass]=\"dropdownClasses('w-16 sm:w-[72px]')\">\n            <select\n              [ngClass]=\"dropdownSelectClasses()\"\n              [ngStyle]=\"dropdownSelectStyle\"\n              [value]=\"singleHeaderMonth\"\n              aria-label=\"Month\"\n              (change)=\"onSingleMonthChange($any($event.target).value)\"\n            >\n              <option\n                *ngFor=\"let monthOption of monthOptions\"\n                [value]=\"monthOption.value\"\n                [selected]=\"monthOption.value === singleHeaderMonth\"\n              >\n                {{ monthOption.label }}\n              </option>\n            </select>\n            <svg viewBox=\"0 0 24 24\" class=\"h-3 w-3 text-foreground\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" aria-hidden=\"true\">\n              <path d=\"m6 9 6 6 6-6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n            </svg>\n          </div>\n          <div [ngClass]=\"dropdownClasses('w-16 sm:w-[82px]')\">\n            <select\n              [ngClass]=\"dropdownSelectClasses()\"\n              [ngStyle]=\"dropdownSelectStyle\"\n              [value]=\"singleHeaderYear\"\n              aria-label=\"Year\"\n              (change)=\"onSingleYearChange($any($event.target).value)\"\n            >\n              <option\n                *ngFor=\"let year of yearOptions\"\n                [value]=\"year\"\n                [selected]=\"year === singleHeaderYear\"\n              >\n                {{ year }}\n              </option>\n            </select>\n            <svg viewBox=\"0 0 24 24\" class=\"h-3 w-3 text-foreground\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" aria-hidden=\"true\">\n              <path d=\"m6 9 6 6 6-6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n            </svg>\n          </div>\n        </div>\n      </ng-container>\n\n      <ng-template #plainTitle>\n        <div class=\"flex min-w-0 flex-1 items-center justify-center\">\n          <p class=\"m-0 text-foreground text-center text-sm font-medium leading-5\">\n            {{ month.title }}\n          </p>\n        </div>\n      </ng-template>\n\n      <button\n        *ngIf=\"month.showNextButton; else nextPlaceholder\"\n        type=\"button\"\n        [ngClass]=\"navButtonClasses()\"\n        aria-label=\"Next month\"\n        (click)=\"goToNextMonth()\"\n        [disabled]=\"readonly\"\n      >\n        <svg viewBox=\"0 0 24 24\" class=\"h-4 w-4\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" aria-hidden=\"true\">\n          <path d=\"m9 18 6-6-6-6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n        </svg>\n      </button>\n      <ng-template #nextPlaceholder>\n        <div [ngClass]=\"navPlaceholderClasses()\" aria-hidden=\"true\"></div>\n      </ng-template>\n    </div>\n\n    <div [ngClass]=\"calendarGridWrapClasses()\">\n      <div [ngClass]=\"weekdayRowClasses()\">\n        <div *ngFor=\"let day of weekdays; trackBy: trackByIndex\" [ngClass]=\"weekdayCellClasses()\">\n          <span>{{ day }}</span>\n        </div>\n      </div>\n\n      <div *ngFor=\"let week of month.weeks; trackBy: trackByIndex\" [ngClass]=\"weekRowClasses()\">\n        <div *ngFor=\"let cell of week; trackBy: trackByDate\" [ngClass]=\"dayCellClasses(cell)\">\n          <button\n            type=\"button\"\n            [ngClass]=\"dayButtonClasses(cell)\"\n            [disabled]=\"readonly\"\n            [attr.aria-selected]=\"cell.selected\"\n            [attr.aria-disabled]=\"cell.disabled || readonly\"\n            [attr.title]=\"cell.date | date : 'yyyy-MM-dd'\"\n            (click)=\"onDatePressed(cell)\"\n          >\n            <span [ngClass]=\"dayLabelClasses(cell)\">{{ cell.label }}</span>\n          </button>\n        </div>\n      </div>\n    </div>\n  </div>\n</div>\n" }]
+        }], propDecorators: { variant: [{
+                type: Input
+            }], className: [{
+                type: Input
+            }], disabledDates: [{
+                type: Input
+            }], minDate: [{
+                type: Input
+            }], maxDate: [{
+                type: Input
+            }], minYear: [{
+                type: Input
+            }], maxYear: [{
+                type: Input
+            }], isDateDisabled: [{
+                type: Input
+            }], allowSameDayRange: [{
+                type: Input
+            }], readonly: [{
+                type: Input
+            }], valueChange: [{
+                type: Output
+            }], rangeValueChange: [{
+                type: Output
+            }], monthChange: [{
+                type: Output
+            }], dateClick: [{
+                type: Output
+            }], disabledDateClick: [{
+                type: Output
+            }], value: [{
+                type: Input
+            }], rangeValue: [{
+                type: Input
+            }], month: [{
+                type: Input
+            }] } });
+
+let nextDatePickerId = 0;
+class PdmDatePickerComponent {
+    constructor(cdr, overlay, viewContainerRef) {
+        this.cdr = cdr;
+        this.overlay = overlay;
+        this.viewContainerRef = viewContainerRef;
+        this._value = null;
+        this._rangeValue = null;
+        this._open = false;
+        this.instanceId = `pdm-date-picker-${++nextDatePickerId}`;
+        this.triggerFocused = false;
+        this.overlayRef = null;
+        this.backdropSub = null;
+        this.id = "";
+        this.variant = "single";
+        this.label = "";
+        this.labelClassName = "";
+        this.className = "";
+        this.triggerClassName = "";
+        /**
+         * Additional CSS classes applied to the overlay panel.
+         * Backward-compatible: mapped to `overlayOptions.panelClass` when `overlayOptions` is not set.
+         * When both are supplied, `overlayOptions.panelClass` takes precedence.
+         */
+        this.panelClassName = "";
+        this.placeholder = "Pick a date";
+        this.rangePlaceholder = "Pick a date range";
+        this.format = "MMM d, yyyy";
+        this.disabled = false;
+        this.readonly = false;
+        this.required = false;
+        this.invalid = false;
+        this.allowSameDayRange = true;
+        this.closeOnSelect = true;
+        this.minDate = null;
+        this.maxDate = null;
+        this.minYear = null;
+        this.maxYear = null;
+        this.disabledDates = [];
+        this.isDateDisabled = null;
+        this.valueChange = new EventEmitter();
+        this.rangeValueChange = new EventEmitter();
+        this.openChange = new EventEmitter();
+        this.monthChange = new EventEmitter();
+    }
+    set open(value) {
+        if (this._open === !!value)
+            return;
+        if (value) {
+            this.openPanel();
+        }
+        else {
+            this.closePanel();
+        }
+    }
+    get open() {
+        return this._open;
+    }
+    set value(value) {
+        this._value = this.normalizeDate(value);
+        this.cdr.markForCheck();
+    }
+    get value() {
+        return this._value;
+    }
+    set rangeValue(value) {
+        this._rangeValue = value
+            ? {
+                start: this.normalizeDate(value.start),
+                end: this.normalizeDate(value.end),
+            }
+            : null;
+        this.cdr.markForCheck();
+    }
+    get rangeValue() {
+        return this._rangeValue;
+    }
+    ngOnDestroy() {
+        this.destroyOverlay();
+    }
+    get resolvedVariant() {
+        return this.variant === "range" ? "range" : "single";
+    }
+    get triggerId() {
+        return this.id || `${this.instanceId}-trigger`;
+    }
+    get panelId() {
+        return `${this.id || this.instanceId}-panel`;
+    }
+    get hasSingleValue() {
+        return this.resolvedVariant === "single" && !!this._value;
+    }
+    get hasRangeValue() {
+        var _a;
+        return this.resolvedVariant === "range" && !!((_a = this._rangeValue) === null || _a === void 0 ? void 0 : _a.start);
+    }
+    get displayText() {
+        var _a, _b, _c, _d;
+        if (this.resolvedVariant === "single") {
+            return this._value ? this.formatDate(this._value) : this.placeholder;
+        }
+        const start = (_b = (_a = this._rangeValue) === null || _a === void 0 ? void 0 : _a.start) !== null && _b !== void 0 ? _b : null;
+        const end = (_d = (_c = this._rangeValue) === null || _c === void 0 ? void 0 : _c.end) !== null && _d !== void 0 ? _d : null;
+        if (!start) {
+            return this.rangePlaceholder;
+        }
+        if (!end) {
+            return `${this.formatDate(start)} -`;
+        }
+        return `${this.formatDate(start)} - ${this.formatDate(end)}`;
+    }
+    get textClasses() {
+        const hasValue = this.resolvedVariant === "single"
+            ? this.hasSingleValue
+            : this.hasRangeValue;
+        return [
+            "min-w-0 flex-1 truncate text-left text-sm leading-5",
+            hasValue ? "text-foreground" : "text-muted-foreground",
+        ];
+    }
+    get rootClasses() {
+        return [
+            "grid gap-2",
+            this.resolvedVariant === "range" ? "w-[280px]" : "w-[197px]",
+            this.className,
+        ];
+    }
+    get triggerClasses() {
+        const focusStyle = this._open || this.triggerFocused;
+        return [
+            "border-input focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/50 aria-invalid:ring-2 aria-invalid:ring-destructive aria-invalid:border-destructive relative flex w-full appearance-none box-border items-center gap-2 overflow-hidden rounded-lg border border-solid bg-background px-3 py-[7.5px] text-left text-sm shadow-sm outline-none transition-colors",
+            "min-h-[36px] disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50",
+            focusStyle ? "border-ring ring-2 ring-ring/50" : "",
+            this.invalid ? "border-destructive ring-destructive/20" : "",
+            this.triggerClassName,
+        ];
+    }
+    toggleOpen() {
+        if (this.disabled || this.readonly) {
+            return;
+        }
+        this.setOpen(!this._open);
+    }
+    onTriggerFocus() {
+        this.triggerFocused = true;
+        this.cdr.markForCheck();
+    }
+    onTriggerBlur() {
+        this.triggerFocused = false;
+        this.cdr.markForCheck();
+    }
+    onCalendarValueChange(value) {
+        this._value = this.normalizeDate(value);
+        this.valueChange.emit(this._value ? this.cloneDate(this._value) : null);
+        if (this.closeOnSelect && this._value) {
+            this.setOpen(false);
+        }
+        else {
+            this.cdr.markForCheck();
+        }
+    }
+    onCalendarRangeValueChange(value) {
+        var _a, _b;
+        this._rangeValue = value
+            ? {
+                start: this.normalizeDate(value.start),
+                end: this.normalizeDate(value.end),
+            }
+            : null;
+        this.rangeValueChange.emit(this._rangeValue
+            ? {
+                start: this._rangeValue.start
+                    ? this.cloneDate(this._rangeValue.start)
+                    : null,
+                end: this._rangeValue.end
+                    ? this.cloneDate(this._rangeValue.end)
+                    : null,
+            }
+            : null);
+        if (this.closeOnSelect &&
+            ((_a = this._rangeValue) === null || _a === void 0 ? void 0 : _a.start) &&
+            ((_b = this._rangeValue) === null || _b === void 0 ? void 0 : _b.end)) {
+            this.setOpen(false);
+            return;
+        }
+        this.cdr.markForCheck();
+    }
+    onCalendarMonthChange(month) {
+        this.monthChange.emit(this.cloneDate(month));
+    }
+    onEscape() {
+        if (this._open) {
+            this.setOpen(false);
+        }
+    }
+    setOpen(nextOpen) {
+        if (this._open === nextOpen) {
+            return;
+        }
+        if (nextOpen) {
+            this.openPanel();
+        }
+        else {
+            this.closePanel();
+        }
+    }
+    openPanel() {
+        var _a, _b;
+        if (this.overlayRef)
+            return;
+        const triggerEl = (_a = this.triggerRef) === null || _a === void 0 ? void 0 : _a.nativeElement;
+        if (!triggerEl)
+            return;
+        this._open = true;
+        this.openChange.emit(true);
+        this.cdr.markForCheck();
+        const positionStrategy = createFlexiblePositionStrategy(this.overlay, triggerEl, 8);
+        // CRITICAL: Use mergeOverlayPanelClass to ensure z-index is never lost.
+        // Consumer classes are appended AFTER base z-index.
+        const zIndexEnforced = mergeOverlayPanelClass(OVERLAY_BASE_Z_INDEX, this.panelClassName);
+        // Resolve panelClass: overlayOptions.panelClass wins; otherwise use z-index enforced.
+        const resolvedPanelClass = ((_b = this.overlayOptions) === null || _b === void 0 ? void 0 : _b.panelClass)
+            ? mergeOverlayPanelClass(OVERLAY_BASE_Z_INDEX, this.overlayOptions.panelClass)
+            : zIndexEnforced;
+        this.overlayRef = this.overlay.create(Object.assign(Object.assign({ positionStrategy, scrollStrategy: this.overlay.scrollStrategies.reposition() }, this.overlayOptions), { 
+            // panelClass always enforced last to preserve z-index.
+            panelClass: resolvedPanelClass }));
+        const portal = new TemplatePortal(this.panelTemplateRef, this.viewContainerRef);
+        this.overlayRef.attach(portal);
+        this.backdropSub = this.overlayRef
+            .outsidePointerEvents()
+            .subscribe((event) => {
+            const target = event.target;
+            if (!triggerEl.contains(target)) {
+                this.closePanel();
+            }
+        });
+        this.cdr.markForCheck();
+    }
+    closePanel() {
+        if (!this.overlayRef && !this._open)
+            return;
+        this._open = false;
+        this.openChange.emit(false);
+        this.destroyOverlay();
+        this.cdr.markForCheck();
+    }
+    destroyOverlay() {
+        if (this.backdropSub) {
+            this.backdropSub.unsubscribe();
+            this.backdropSub = null;
+        }
+        if (this.overlayRef) {
+            this.overlayRef.dispose();
+            this.overlayRef = null;
+        }
+    }
+    formatDate(date) {
+        try {
+            return format(date, this.format || "MMM d, yyyy");
+        }
+        catch (_a) {
+            return format(date, "MMM d, yyyy");
+        }
+    }
+    normalizeDate(value) {
+        if (!(value instanceof Date) || Number.isNaN(value.getTime())) {
+            return null;
+        }
+        return new Date(value.getFullYear(), value.getMonth(), value.getDate());
+    }
+    cloneDate(date) {
+        return new Date(date.getFullYear(), date.getMonth(), date.getDate());
+    }
+}
+PdmDatePickerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmDatePickerComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.Overlay }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component });
+PdmDatePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmDatePickerComponent, selector: "pdm-date-picker", inputs: { id: "id", variant: "variant", label: "label", labelClassName: "labelClassName", className: "className", triggerClassName: "triggerClassName", panelClassName: "panelClassName", overlayOptions: "overlayOptions", placeholder: "placeholder", rangePlaceholder: "rangePlaceholder", format: "format", disabled: "disabled", readonly: "readonly", required: "required", invalid: "invalid", allowSameDayRange: "allowSameDayRange", closeOnSelect: "closeOnSelect", minDate: "minDate", maxDate: "maxDate", minYear: "minYear", maxYear: "maxYear", disabledDates: "disabledDates", isDateDisabled: "isDateDisabled", open: "open", value: "value", rangeValue: "rangeValue" }, outputs: { valueChange: "valueChange", rangeValueChange: "rangeValueChange", openChange: "openChange", monthChange: "monthChange" }, host: { listeners: { "document:keydown.escape": "onEscape()" } }, viewQueries: [{ propertyName: "triggerRef", first: true, predicate: ["triggerEl"], descendants: true }, { propertyName: "panelTemplateRef", first: true, predicate: ["panelTemplate"], descendants: true }], ngImport: i0, template: "<div [ngClass]=\"rootClasses\">\n  <pdm-label *ngIf=\"label\" [forId]=\"triggerId\" [required]=\"required\" [className]=\"labelClassName\">\n    {{ label }}\n  </pdm-label>\n\n  <button\n    #triggerEl\n    type=\"button\"\n    [id]=\"triggerId\"\n    [disabled]=\"disabled\"\n    [attr.aria-expanded]=\"open\"\n    [attr.aria-controls]=\"panelId\"\n    [attr.aria-haspopup]=\"'dialog'\"\n    [attr.aria-invalid]=\"invalid\"\n    [ngClass]=\"triggerClasses\"\n    [attr.title]=\"displayText\"\n    (click)=\"toggleOpen()\"\n    (focus)=\"onTriggerFocus()\"\n    (blur)=\"onTriggerBlur()\"\n  >\n    <span class=\"flex h-5 w-5 shrink-0 items-center justify-center p-0.5 text-muted-foreground\" aria-hidden=\"true\">\n      <svg viewBox=\"0 0 24 24\" class=\"h-4 w-4\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\">\n        <path d=\"M8 2v4\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n        <path d=\"M16 2v4\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n        <rect x=\"3\" y=\"4.5\" width=\"18\" height=\"16.5\" rx=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></rect>\n        <path d=\"M3 9.5h18\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n      </svg>\n    </span>\n\n    <span [ngClass]=\"textClasses\">{{ displayText }}</span>\n  </button>\n</div>\n\n<ng-template #panelTemplate>\n  <div [id]=\"panelId\" role=\"dialog\" [attr.aria-labelledby]=\"label ? triggerId : null\">\n    <pdm-calendar\n      [variant]=\"resolvedVariant\"\n      [value]=\"value\"\n      [rangeValue]=\"rangeValue\"\n      [readonly]=\"readonly\"\n      [allowSameDayRange]=\"allowSameDayRange\"\n      [minDate]=\"minDate\"\n      [maxDate]=\"maxDate\"\n      [minYear]=\"minYear\"\n      [maxYear]=\"maxYear\"\n      [disabledDates]=\"disabledDates\"\n      [isDateDisabled]=\"isDateDisabled\"\n      (valueChange)=\"onCalendarValueChange($event)\"\n      (rangeValueChange)=\"onCalendarRangeValueChange($event)\"\n      (monthChange)=\"onCalendarMonthChange($event)\"\n    ></pdm-calendar>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.PdmLabelComponent, selector: "pdm-label", inputs: ["forId", "required", "className"] }, { kind: "component", type: PdmCalendarComponent, selector: "pdm-calendar", inputs: ["variant", "className", "disabledDates", "minDate", "maxDate", "minYear", "maxYear", "isDateDisabled", "allowSameDayRange", "readonly", "value", "rangeValue", "month"], outputs: ["valueChange", "rangeValueChange", "monthChange", "dateClick", "disabledDateClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmDatePickerComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "pdm-date-picker", changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [ngClass]=\"rootClasses\">\n  <pdm-label *ngIf=\"label\" [forId]=\"triggerId\" [required]=\"required\" [className]=\"labelClassName\">\n    {{ label }}\n  </pdm-label>\n\n  <button\n    #triggerEl\n    type=\"button\"\n    [id]=\"triggerId\"\n    [disabled]=\"disabled\"\n    [attr.aria-expanded]=\"open\"\n    [attr.aria-controls]=\"panelId\"\n    [attr.aria-haspopup]=\"'dialog'\"\n    [attr.aria-invalid]=\"invalid\"\n    [ngClass]=\"triggerClasses\"\n    [attr.title]=\"displayText\"\n    (click)=\"toggleOpen()\"\n    (focus)=\"onTriggerFocus()\"\n    (blur)=\"onTriggerBlur()\"\n  >\n    <span class=\"flex h-5 w-5 shrink-0 items-center justify-center p-0.5 text-muted-foreground\" aria-hidden=\"true\">\n      <svg viewBox=\"0 0 24 24\" class=\"h-4 w-4\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\">\n        <path d=\"M8 2v4\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n        <path d=\"M16 2v4\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n        <rect x=\"3\" y=\"4.5\" width=\"18\" height=\"16.5\" rx=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></rect>\n        <path d=\"M3 9.5h18\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n      </svg>\n    </span>\n\n    <span [ngClass]=\"textClasses\">{{ displayText }}</span>\n  </button>\n</div>\n\n<ng-template #panelTemplate>\n  <div [id]=\"panelId\" role=\"dialog\" [attr.aria-labelledby]=\"label ? triggerId : null\">\n    <pdm-calendar\n      [variant]=\"resolvedVariant\"\n      [value]=\"value\"\n      [rangeValue]=\"rangeValue\"\n      [readonly]=\"readonly\"\n      [allowSameDayRange]=\"allowSameDayRange\"\n      [minDate]=\"minDate\"\n      [maxDate]=\"maxDate\"\n      [minYear]=\"minYear\"\n      [maxYear]=\"maxYear\"\n      [disabledDates]=\"disabledDates\"\n      [isDateDisabled]=\"isDateDisabled\"\n      (valueChange)=\"onCalendarValueChange($event)\"\n      (rangeValueChange)=\"onCalendarRangeValueChange($event)\"\n      (monthChange)=\"onCalendarMonthChange($event)\"\n    ></pdm-calendar>\n  </div>\n</ng-template>\n" }]
+        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i1$1.Overlay }, { type: i0.ViewContainerRef }]; }, propDecorators: { triggerRef: [{
+                type: ViewChild,
+                args: ["triggerEl"]
+            }], panelTemplateRef: [{
+                type: ViewChild,
+                args: ["panelTemplate"]
+            }], id: [{
+                type: Input
+            }], variant: [{
+                type: Input
+            }], label: [{
+                type: Input
+            }], labelClassName: [{
+                type: Input
+            }], className: [{
+                type: Input
+            }], triggerClassName: [{
+                type: Input
+            }], panelClassName: [{
+                type: Input
+            }], overlayOptions: [{
+                type: Input
+            }], placeholder: [{
+                type: Input
+            }], rangePlaceholder: [{
+                type: Input
+            }], format: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], readonly: [{
+                type: Input
+            }], required: [{
+                type: Input
+            }], invalid: [{
+                type: Input
+            }], allowSameDayRange: [{
+                type: Input
+            }], closeOnSelect: [{
+                type: Input
+            }], minDate: [{
+                type: Input
+            }], maxDate: [{
+                type: Input
+            }], minYear: [{
+                type: Input
+            }], maxYear: [{
+                type: Input
+            }], disabledDates: [{
+                type: Input
+            }], isDateDisabled: [{
+                type: Input
+            }], valueChange: [{
+                type: Output
+            }], rangeValueChange: [{
+                type: Output
+            }], openChange: [{
+                type: Output
+            }], monthChange: [{
+                type: Output
+            }], open: [{
+                type: Input
+            }], value: [{
+                type: Input
+            }], rangeValue: [{
+                type: Input
+            }], onEscape: [{
+                type: HostListener,
+                args: ["document:keydown.escape"]
+            }] } });
+
+const COMPONENTS = [PdmCalendarComponent, PdmDatePickerComponent];
+class PdmCalendarModule {
+}
+PdmCalendarModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmCalendarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+PdmCalendarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: PdmCalendarModule, declarations: [PdmCalendarComponent, PdmDatePickerComponent], imports: [CommonModule, OverlayModule, PdmLabelModule], exports: [PdmCalendarComponent, PdmDatePickerComponent] });
+PdmCalendarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmCalendarModule, imports: [CommonModule, OverlayModule, PdmLabelModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmCalendarModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [CommonModule, OverlayModule, PdmLabelModule],
+                    declarations: COMPONENTS,
+                    exports: COMPONENTS,
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { PdmCalendarComponent, PdmCalendarModule, PdmDatePickerComponent };
+//# sourceMappingURL=pdm-ui-kit-src-calendar.mjs.map