pdm-ui-kit 0.1.21 → 0.1.22

package/lib/components/calendar/calendar.component.d.ts

@@ -1,28 +1,147 @@
+import { ChangeDetectorRef, EventEmitter } from '@angular/core';
 import * as i0 from "@angular/core";
-export declare type PdmCalendarMode = 'single' | 'range';
-interface CalendarCell {
+export declare type PdmCalendarVariant = 'single' | 'range';
+export interface PdmCalendarRange {
+    start: Date | null;
+    end: Date | null;
+}
+interface PdmCalendarCell {
     date: Date;
-    day: number;
-    outside: boolean;
+    label: number;
+    muted: boolean;
+    disabled: boolean;
     selected: boolean;
     inRange: boolean;
+    rangeFill: boolean;
+    rangeLeftCap: boolean;
+    rangeRightCap: boolean;
+}
+interface PdmCalendarMonthView {
+    date: Date;
+    title: string;
+    titleStyle: 'dropdowns' | 'plain';
+    dropdownMonth?: string;
+    dropdownYear?: string;
+    showPrevButton: boolean;
+    showNextButton: boolean;
+    weeks: readonly (readonly PdmCalendarCell[])[];
 }
 export declare class PdmCalendarComponent {
-    mode: PdmCalendarMode;
-    month: number;
-    year: number;
-    selectedDay: number;
-    rangeStartDay: number;
-    rangeEndDay: number;
+    private cdr;
+    private _value;
+    private _rangeValue;
+    private _month;
+    constructor(cdr: ChangeDetectorRef);
+    variant: PdmCalendarVariant | string;
     className: string;
-    readonly weekdays: string[];
-    get leftMonthName(): string;
-    get rightMonthName(): string;
-    get leftCells(): CalendarCell[];
-    get rightCells(): CalendarCell[];
-    private monthName;
-    private buildMonthCells;
+    disabledDates: Date[];
+    minDate: Date | null;
+    maxDate: Date | null;
+    isDateDisabled: ((date: Date) => boolean) | null;
+    allowSameDayRange: boolean;
+    readonly: boolean;
+    valueChange: EventEmitter<Date>;
+    rangeValueChange: EventEmitter<PdmCalendarRange>;
+    monthChange: EventEmitter<Date>;
+    dateClick: EventEmitter<Date>;
+    disabledDateClick: EventEmitter<Date>;
+    set value(value: Date | null);
+    get value(): Date | null;
+    set rangeValue(value: PdmCalendarRange | null);
+    get rangeValue(): PdmCalendarRange | null;
+    set month(value: Date | null);
+    get month(): Date | null;
+    readonly weekdays: readonly ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
+    readonly monthOptions: readonly [{
+        readonly value: 0;
+        readonly label: "Jan";
+    }, {
+        readonly value: 1;
+        readonly label: "Feb";
+    }, {
+        readonly value: 2;
+        readonly label: "Mar";
+    }, {
+        readonly value: 3;
+        readonly label: "Apr";
+    }, {
+        readonly value: 4;
+        readonly label: "May";
+    }, {
+        readonly value: 5;
+        readonly label: "Jun";
+    }, {
+        readonly value: 6;
+        readonly label: "Jul";
+    }, {
+        readonly value: 7;
+        readonly label: "Aug";
+    }, {
+        readonly value: 8;
+        readonly label: "Sep";
+    }, {
+        readonly value: 9;
+        readonly label: "Oct";
+    }, {
+        readonly value: 10;
+        readonly label: "Nov";
+    }, {
+        readonly value: 11;
+        readonly label: "Dec";
+    }];
+    get resolvedVariant(): PdmCalendarVariant;
+    get visibleMonths(): readonly PdmCalendarMonthView[];
+    get singleHeaderMonth(): number;
+    get singleHeaderYear(): number;
+    get yearOptions(): readonly number[];
+    get rootClasses(): string[];
+    get rootStyle(): Record<string, string>;
+    monthPanelClasses(_index: number): string[];
+    headerClasses(month: PdmCalendarMonthView): string[];
+    navButtonClasses(): string[];
+    navPlaceholderClasses(): string[];
+    dropdownWrapClasses(): string[];
+    dropdownClasses(widthClass: string): string[];
+    dropdownSelectClasses(): string[];
+    get dropdownSelectStyle(): Record<string, string>;
+    calendarGridWrapClasses(): string[];
+    weekdayRowClasses(): string[];
+    weekdayCellClasses(): string[];
+    weekRowClasses(): string[];
+    dayCellClasses(cell: PdmCalendarCell): string[];
+    dayButtonClasses(cell: PdmCalendarCell): string[];
+    dayLabelClasses(_cell: PdmCalendarCell): string[];
+    trackByIndex: (index: number) => number;
+    trackByDate: (_index: number, cell: PdmCalendarCell) => string;
+    goToPreviousMonth(): void;
+    goToNextMonth(): void;
+    onSingleMonthChange(monthValue: string): void;
+    onSingleYearChange(yearValue: string): void;
+    onDatePressed(cell: PdmCalendarCell): void;
+    private handleRangeSelection;
+    private buildMonthWeeks;
+    private buildCell;
+    private getAnchorMonth;
+    private setAnchorMonth;
+    private syncVisibleMonthToDate;
+    private isBlocked;
+    private rangeContainsBlockedDate;
+    private normalizeDate;
+    private cloneDate;
+    private startOfMonth;
+    private endOfMonth;
+    private startOfWeek;
+    private endOfWeek;
+    private addMonths;
+    private addDays;
+    private compareDate;
+    private dateValue;
+    private isSameDay;
+    private isSameMonth;
+    private dateKey;
+    private formatMonthShort;
+    private formatMonthYear;
     static ɵfac: i0.ɵɵFactoryDeclaration<PdmCalendarComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<PdmCalendarComponent, "pdm-calendar", never, { "mode": "mode"; "month": "month"; "year": "year"; "selectedDay": "selectedDay"; "rangeStartDay": "rangeStartDay"; "rangeEndDay": "rangeEndDay"; "className": "className"; }, {}, never, never, false>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<PdmCalendarComponent, "pdm-calendar", never, { "variant": "variant"; "className": "className"; "disabledDates": "disabledDates"; "minDate": "minDate"; "maxDate": "maxDate"; "isDateDisabled": "isDateDisabled"; "allowSameDayRange": "allowSameDayRange"; "readonly": "readonly"; "value": "value"; "rangeValue": "rangeValue"; "month": "month"; }, { "valueChange": "valueChange"; "rangeValueChange": "rangeValueChange"; "monthChange": "monthChange"; "dateClick": "dateClick"; "disabledDateClick": "disabledDateClick"; }, never, never, false>;
 }
 export {};

package/lib/components/date-picker/date-picker.component.d.ts

@@ -1,23 +1,67 @@
-import { EventEmitter } from '@angular/core';
+import { ChangeDetectorRef, ElementRef, EventEmitter } from '@angular/core';
+import { PdmCalendarRange, PdmCalendarVariant } from '../calendar/calendar.component';
 import * as i0 from "@angular/core";
-export declare type PdmDatePickerVariant = 'default' | 'with-input' | 'date-time' | 'natural-language';
 export declare class PdmDatePickerComponent {
-    variant: PdmDatePickerVariant;
-    className: string;
-    open: boolean;
+    private readonly elementRef;
+    private readonly cdr;
+    private _value;
+    private _rangeValue;
+    private _open;
+    private readonly instanceId;
+    private triggerFocused;
+    constructor(elementRef: ElementRef<HTMLElement>, cdr: ChangeDetectorRef);
+    id: string;
+    variant: PdmCalendarVariant | string;
     label: string;
-    value: string;
-    month: number;
-    year: number;
-    selectedDay: number;
-    time: string;
-    naturalLanguageValue: string;
-    naturalLanguageHint: string;
+    labelClassName: string;
+    className: string;
+    triggerClassName: string;
+    panelClassName: string;
+    placeholder: string;
+    rangePlaceholder: string;
+    format: string;
+    disabled: boolean;
+    readonly: boolean;
+    required: boolean;
+    invalid: boolean;
+    allowSameDayRange: boolean;
+    closeOnSelect: boolean;
+    minDate: Date | null;
+    maxDate: Date | null;
+    disabledDates: Date[];
+    isDateDisabled: ((date: Date) => boolean) | null;
+    valueChange: EventEmitter<Date>;
+    rangeValueChange: EventEmitter<PdmCalendarRange>;
     openChange: EventEmitter<boolean>;
-    valueChange: EventEmitter<string>;
-    toggle(): void;
-    selectPreset(value: string): void;
-    get monthLabel(): string;
+    monthChange: EventEmitter<Date>;
+    set open(value: boolean);
+    get open(): boolean;
+    set value(value: Date | null);
+    get value(): Date | null;
+    set rangeValue(value: PdmCalendarRange | null);
+    get rangeValue(): PdmCalendarRange | null;
+    get resolvedVariant(): PdmCalendarVariant;
+    get triggerId(): string;
+    get panelId(): string;
+    get hasSingleValue(): boolean;
+    get hasRangeValue(): boolean;
+    get displayText(): string;
+    get textClasses(): string[];
+    get rootClasses(): string[];
+    get triggerClasses(): string[];
+    get panelClasses(): string[];
+    toggleOpen(): void;
+    onTriggerFocus(): void;
+    onTriggerBlur(): void;
+    onCalendarValueChange(value: Date | null): void;
+    onCalendarRangeValueChange(value: PdmCalendarRange | null): void;
+    onCalendarMonthChange(month: Date): void;
+    onEscape(): void;
+    onDocumentClick(event: MouseEvent): void;
+    private setOpen;
+    private formatDate;
+    private normalizeDate;
+    private cloneDate;
     static ɵfac: i0.ɵɵFactoryDeclaration<PdmDatePickerComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<PdmDatePickerComponent, "pdm-date-picker", never, { "variant": "variant"; "className": "className"; "open": "open"; "label": "label"; "value": "value"; "month": "month"; "year": "year"; "selectedDay": "selectedDay"; "time": "time"; "naturalLanguageValue": "naturalLanguageValue"; "naturalLanguageHint": "naturalLanguageHint"; }, { "openChange": "openChange"; "valueChange": "valueChange"; }, never, never, false>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<PdmDatePickerComponent, "pdm-date-picker", never, { "id": "id"; "variant": "variant"; "label": "label"; "labelClassName": "labelClassName"; "className": "className"; "triggerClassName": "triggerClassName"; "panelClassName": "panelClassName"; "placeholder": "placeholder"; "rangePlaceholder": "rangePlaceholder"; "format": "format"; "disabled": "disabled"; "readonly": "readonly"; "required": "required"; "invalid": "invalid"; "allowSameDayRange": "allowSameDayRange"; "closeOnSelect": "closeOnSelect"; "minDate": "minDate"; "maxDate": "maxDate"; "disabledDates": "disabledDates"; "isDateDisabled": "isDateDisabled"; "open": "open"; "value": "value"; "rangeValue": "rangeValue"; }, { "valueChange": "valueChange"; "rangeValueChange": "rangeValueChange"; "openChange": "openChange"; "monthChange": "monthChange"; }, never, never, false>;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pdm-ui-kit",
-  "version": "0.1.21",
+  "version": "0.1.22",
   "description": "PDM UI Kit Angular components",
   "author": "Corelusa",
   "license": "MIT",
@@ -22,6 +22,7 @@
     "lucide": ">=0.575.0"
   },
   "dependencies": {
+    "date-fns": "^2.30.0",
     "tslib": "^2.3.0"
   },
   "module": "fesm2015/pdm-ui-kit.mjs",