angular-hijri-gregorian-date-time-picker 1.5.0 → 1.5.1

package/index.d.ts

@@ -1,5 +1,347 @@
-/**
- * Generated bundle index. Do not edit.
- */
-/// <amd-module name="angular-hijri-gregorian-date-time-picker" />
-export * from './public-api';
+import * as i0 from '@angular/core';
+import { OnInit, OnChanges, AfterViewInit, EventEmitter, SimpleChanges } from '@angular/core';
+import * as i2 from '@angular/forms';
+import { UntypedFormBuilder, UntypedFormGroup } from '@angular/forms';
+import * as i3 from '@angular/common';
+
+interface MonthInfo {
+    fD: DayInfo;
+    lD: DayInfo;
+}
+interface YearData {
+    [month: string]: MonthInfo;
+}
+interface Data {
+    [year: string]: YearData;
+}
+interface TimeValue {
+    hour: number;
+    minute: number;
+}
+interface DayInfo {
+    gD: string;
+    uD: string;
+    dN: string;
+    uC: number;
+    selected?: boolean;
+    disabled?: boolean;
+    time?: TimeValue;
+}
+interface TodayDate {
+    gregorian?: string;
+    ummAlQura?: string;
+}
+type MonthDays = DayInfo[];
+
+declare class DateUtilitiesService {
+    calendarData: Data;
+    constructor();
+    parseDate(dateStr: string): Date | null;
+    formatDate(date: Date): string;
+    getDayShortHand(date: Date): string;
+    generateDates(fD: DayInfo, lD: DayInfo, uC: number): MonthDays;
+    convertDate(dateStr: string, isGregorian: boolean): DayInfo | null;
+    private isDateInMonthRange;
+    getMonthData(inputDate: string, type: string): DayInfo[] | null;
+    getGregorianMonthData(day: number, month: number, year: number): DayInfo[] | null;
+    getUmAlQurraMonthData(day: number, month: number, year: number): DayInfo[] | null;
+    calculateGregorianDate(startGDate: string, offset: number): string;
+    calculateUmAlQurraDate(startUDate: string, offset: number, uC: number): string;
+    getDayName(dayIndex: number): string;
+    checkPastOrFuture(inputDate: any, targetDate: any): "Future" | "Past" | "Today";
+    parseEnglish(englishNum: any): any;
+    parseArabic(arabicNum: any): any;
+    convertDateNumerals(date: string, targetLang: 'en' | 'ar'): string;
+    /**
+     * Normalize input date to DD/MM/YYYY string format (Gregorian)
+     * Accepts Date object or DD/MM/YYYY string
+     */
+    normalizeDateToString(date: Date | string | undefined): string | null;
+    /**
+     * Compare two dates (Gregorian format DD/MM/YYYY)
+     * Returns: -1 if date1 < date2, 0 if equal, 1 if date1 > date2
+     */
+    compareDates(date1Str: string, date2Str: string): number;
+    /**
+     * Compare two Hijri dates (UM format DD/MM/YYYY)
+     * Converts to Gregorian for comparison
+     */
+    compareHijriDates(hijri1: string, hijri2: string): number;
+    /**
+     * Check if a date is within the specified range (inclusive)
+     * All dates in Gregorian DD/MM/YYYY format
+     */
+    isDateInRange(dateStr: string, minDateStr: string | null, maxDateStr: string | null): boolean;
+    /**
+     * Check if a Hijri date is within the specified range
+     * Converts to Gregorian for comparison
+     */
+    isHijriDateInRange(hijriDateStr: string, minDateStr: string | null, maxDateStr: string | null): boolean;
+    static ɵfac: i0.ɵɵFactoryDeclaration<DateUtilitiesService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<DateUtilitiesService>;
+}
+
+interface stylesConfig {
+    backgroundColor?: string;
+    primaryColor?: string;
+    secondaryColor?: string;
+    todaysDateBgColor?: string;
+    todaysDateTextColor?: string;
+    confirmBtnTextColor?: string;
+    disabledDayColor?: string;
+    dayNameColor?: string;
+    dayColor?: string;
+    fontFamily?: string;
+    borderRadius?: string;
+    timePickerBgColor?: string;
+    timePickerTextColor?: string;
+    timePickerBorderColor?: string;
+    timePickerArrowColor?: string;
+    timePickerColonColor?: string;
+    meridianBgColor?: string;
+    meridianTextColor?: string;
+    meridianActiveBgColor?: string;
+    meridianActiveTextColor?: string;
+}
+
+declare class HijriGregorianDatepickerComponent implements OnInit, OnChanges, AfterViewInit {
+    formBuilder: UntypedFormBuilder;
+    _dateUtilsService: DateUtilitiesService;
+    markToday: boolean;
+    canChangeMode: boolean;
+    todaysDateSection: boolean;
+    futureValidation: boolean;
+    disableYearPicker: boolean;
+    disableMonthPicker: boolean;
+    disableDayPicker: boolean;
+    multiple: boolean;
+    isRequired: boolean;
+    showConfirmButton: boolean;
+    futureValidationMessage: boolean;
+    arabicLayout: boolean;
+    mode: string;
+    dir: string;
+    locale: string;
+    submitTextButton: string;
+    todaysDateText: string;
+    ummAlQuraDateText: string;
+    monthSelectLabel: string;
+    yearSelectLabel: string;
+    futureValidationMessageEn: string;
+    futureValidationMessageAr: string;
+    theme?: string;
+    pastYearsLimit: number;
+    futureYearsLimit: number;
+    styles?: stylesConfig;
+    enableTime: boolean;
+    minDate?: Date | string;
+    maxDate?: Date | string;
+    initialDate?: Date | string;
+    initialRangeStart?: Date | string;
+    initialRangeEnd?: Date | string;
+    useMeridian: boolean;
+    selectionMode: 'single' | 'range';
+    onSubmit: EventEmitter<object>;
+    onDaySelect: EventEmitter<object>;
+    onMonthChange: EventEmitter<object>;
+    onYearChange: EventEmitter<object>;
+    ummAlQuraMonths: {
+        labelAr: string;
+        labelEn: string;
+        value: number;
+    }[];
+    gregMonths: {
+        labelAr: string;
+        labelEn: string;
+        value: number;
+    }[];
+    ummAlQuraYear: number;
+    gregYear: number;
+    years: any[];
+    weeks: any[];
+    months: any[];
+    weekdaysEn: string[];
+    weekdaysAr: string[];
+    todaysDate: TodayDate;
+    selectedDay: DayInfo;
+    periodForm: UntypedFormGroup;
+    multipleSelectedDates: DayInfo[];
+    themes: any;
+    selectedTime: {
+        hour: number;
+        minute: number;
+    };
+    private timeInitialized;
+    meridian: 'AM' | 'PM';
+    rangeStart?: DayInfo;
+    rangeEnd?: DayInfo;
+    fontFamilyStyle: string;
+    constructor(formBuilder: UntypedFormBuilder, _dateUtilsService: DateUtilitiesService);
+    ngOnInit(): void;
+    ngAfterViewInit(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    initTheme(): void;
+    initializeForm(): void;
+    initializeYearsAndMonths(): void;
+    onPeriodChange(type: string): void;
+    getTodaysDateInfo(): void;
+    generatetMonthData(date: string): void;
+    private highlightInitialDate;
+    private highlightInitialRange;
+    generateWeeksArray(daysArray: any): any;
+    changeCalendarMode(): void;
+    onDayClicked(day: DayInfo): void;
+    markDaySelected(dayInfo: DayInfo): void;
+    /**
+     * Handle range selection logic
+     * BACKWARD COMPATIBILITY: Only called when selectionMode='range'
+     *
+     * Range selection lifecycle:
+     * 1. First click → Sets rangeStart
+     * 2. Second click → Sets rangeEnd, highlights range
+     * 3. Third click → Resets range, starts new selection
+     */
+    private handleRangeSelection;
+    onConfirmClicked(): void;
+    checkFutureValidation(day: DayInfo): boolean;
+    checkTodaysDate(day: DayInfo): boolean;
+    /**
+     * Check if a day is disabled based on min/max date constraints
+     * Works for both Gregorian and Hijri modes
+     */
+    isDateDisabled(day: DayInfo): boolean;
+    /**
+     * Initialize time from current system time or initialDate
+     * BACKWARD COMPATIBILITY: Only called when enableTime=true
+     *
+     * Priority:
+     * 1. If initialDate has time, use that
+     * 2. If selectedDay has time, use that
+     * 3. Otherwise, use current system time
+     */
+    initializeTime(): void;
+    /**
+     * Increment hour value with wraparound (0-23)
+     * BACKWARD COMPATIBILITY: Only available when enableTime=true
+     */
+    incrementHour(): void;
+    /**
+     * Decrement hour value with wraparound (0-23)
+     * BACKWARD COMPATIBILITY: Only available when enableTime=true
+     */
+    decrementHour(): void;
+    /**
+     * Increment minute value with wraparound (0-59)
+     * BACKWARD COMPATIBILITY: Only available when enableTime=true
+     */
+    incrementMinute(): void;
+    /**
+     * Decrement minute value with wraparound (0-59)
+     * BACKWARD COMPATIBILITY: Only available when enableTime=true
+     */
+    decrementMinute(): void;
+    /**
+     * Handle keyboard input for hours
+     * Validates and clamps to 0-23 range
+     * BACKWARD COMPATIBILITY: Only available when enableTime=true
+     */
+    onHourInputChange(event: any): void;
+    /**
+     * Handle keyboard input for minutes
+     * Validates and clamps to 0-59 range
+     * BACKWARD COMPATIBILITY: Only available when enableTime=true
+     */
+    onMinuteInputChange(event: any): void;
+    /**
+     * Handle keyboard arrow keys for hour/minute input
+     * BACKWARD COMPATIBILITY: Only available when enableTime=true
+     */
+    onTimeKeydown(event: KeyboardEvent, type: 'hour' | 'minute'): void;
+    /**
+     * Update the selected day's time property when time changes
+     * BACKWARD COMPATIBILITY: Only called when enableTime=true
+     */
+    private updateSelectedDayTime;
+    /**
+     * Get display hour for 12-hour format
+     * BACKWARD COMPATIBILITY: Only used when useMeridian=true
+     *
+     * Conversion:
+     * - 0 (midnight) → 12 AM
+     * - 1-11 (AM) → 1-11 AM
+     * - 12 (noon) → 12 PM
+     * - 13-23 (PM) → 1-11 PM
+     *
+     * IMPORTANT: Hour 0 is NEVER displayed as 0, always as 12
+     */
+    getDisplayHour(): number;
+    /**
+     * Toggle AM/PM meridian
+     * BACKWARD COMPATIBILITY: Only available when useMeridian=true
+     *
+     * When toggling:
+     * - Adds or subtracts 12 hours
+     * - Maintains internal 24-hour format
+     */
+    toggleMeridian(): void;
+    /**
+     * Increment hour in 12-hour mode
+     * BACKWARD COMPATIBILITY: Only used when useMeridian=true
+     */
+    incrementHour12(): void;
+    /**
+     * Decrement hour in 12-hour mode
+     * BACKWARD COMPATIBILITY: Only used when useMeridian=true
+     */
+    decrementHour12(): void;
+    /**
+     * Handle 12-hour input change
+     * BACKWARD COMPATIBILITY: Only used when useMeridian=true
+     *
+     * IMPORTANT: Input must be 1-12, never 0
+     * - User types 0 → converted to 12
+     * - User types > 12 → clamped to 12
+     */
+    onHour12InputChange(event: any): void;
+    /**
+     * Check if a date is within the current range
+     * BACKWARD COMPATIBILITY: Only used when selectionMode='range'
+     */
+    isInRange(day: DayInfo): boolean;
+    /**
+     * Check if a date is the range start
+     * BACKWARD COMPATIBILITY: Only used when selectionMode='range'
+     */
+    isRangeStart(day: DayInfo): boolean;
+    /**
+     * Check if a date is the range end
+     * BACKWARD COMPATIBILITY: Only used when selectionMode='range'
+     */
+    isRangeEnd(day: DayInfo): boolean;
+    /**
+     * Reset range selection
+     * BACKWARD COMPATIBILITY: Only used when selectionMode='range'
+     */
+    private resetRange;
+    /**
+     * Parse date string (DD/MM/YYYY) to Date object
+     * Helper for range comparison
+     */
+    private parseDateString;
+    /**
+     * Highlight all dates in range
+     * BACKWARD COMPATIBILITY: Only used when selectionMode='range'
+     */
+    private highlightRange;
+    static ɵfac: i0.ɵɵFactoryDeclaration<HijriGregorianDatepickerComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<HijriGregorianDatepickerComponent, "hijri-gregorian-datepicker", never, { "markToday": { "alias": "markToday"; "required": false; }; "canChangeMode": { "alias": "canChangeMode"; "required": false; }; "todaysDateSection": { "alias": "todaysDateSection"; "required": false; }; "futureValidation": { "alias": "futureValidation"; "required": false; }; "disableYearPicker": { "alias": "disableYearPicker"; "required": false; }; "disableMonthPicker": { "alias": "disableMonthPicker"; "required": false; }; "disableDayPicker": { "alias": "disableDayPicker"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "isRequired": { "alias": "isRequired"; "required": false; }; "showConfirmButton": { "alias": "showConfirmButton"; "required": false; }; "futureValidationMessage": { "alias": "futureValidationMessage"; "required": false; }; "arabicLayout": { "alias": "arabicLayout"; "required": false; }; "mode": { "alias": "mode"; "required": false; }; "dir": { "alias": "dir"; "required": false; }; "locale": { "alias": "locale"; "required": false; }; "submitTextButton": { "alias": "submitTextButton"; "required": false; }; "todaysDateText": { "alias": "todaysDateText"; "required": false; }; "ummAlQuraDateText": { "alias": "ummAlQuraDateText"; "required": false; }; "monthSelectLabel": { "alias": "monthSelectLabel"; "required": false; }; "yearSelectLabel": { "alias": "yearSelectLabel"; "required": false; }; "futureValidationMessageEn": { "alias": "futureValidationMessageEn"; "required": false; }; "futureValidationMessageAr": { "alias": "futureValidationMessageAr"; "required": false; }; "theme": { "alias": "theme"; "required": false; }; "pastYearsLimit": { "alias": "pastYearsLimit"; "required": false; }; "futureYearsLimit": { "alias": "futureYearsLimit"; "required": false; }; "styles": { "alias": "styles"; "required": false; }; "enableTime": { "alias": "enableTime"; "required": false; }; "minDate": { "alias": "minDate"; "required": false; }; "maxDate": { "alias": "maxDate"; "required": false; }; "initialDate": { "alias": "initialDate"; "required": false; }; "initialRangeStart": { "alias": "initialRangeStart"; "required": false; }; "initialRangeEnd": { "alias": "initialRangeEnd"; "required": false; }; "useMeridian": { "alias": "useMeridian"; "required": false; }; "selectionMode": { "alias": "selectionMode"; "required": false; }; }, { "onSubmit": "onSubmit"; "onDaySelect": "onDaySelect"; "onMonthChange": "onMonthChange"; "onYearChange": "onYearChange"; }, never, never, false, never>;
+}
+
+declare class HijriGregorianDatepickerModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<HijriGregorianDatepickerModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<HijriGregorianDatepickerModule, [typeof HijriGregorianDatepickerComponent], [typeof i2.FormsModule, typeof i2.ReactiveFormsModule, typeof i3.CommonModule], [typeof HijriGregorianDatepickerComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<HijriGregorianDatepickerModule>;
+}
+
+export { DateUtilitiesService, HijriGregorianDatepickerComponent, HijriGregorianDatepickerModule };
+export type { Data, DayInfo, MonthDays, MonthInfo, TimeValue, TodayDate, YearData };

package/package.json

@@ -1,15 +1,15 @@
 {
   "name": "angular-hijri-gregorian-date-time-picker",
-  "version": "1.5.0",
+  "version": "1.5.01",
   "description": "Angular Hijri Gregorian Date Time Picker with beautiful custom selects, time picker, range selection, and bilingual typography support",
   "license": "MIT",
   "peerDependencies": {
-    "@angular/common": "^15.2.9",
-    "@angular/core": "^15.2.9",
-    "@angular/forms": "^15.2.9"
+    "@angular/common": "^20.0.0",
+    "@angular/core": "^20.0.0",
+    "@angular/forms": "^20.0.0"
   },
   "dependencies": {
-    "tslib": "^2.1.0"
+    "tslib": "^2.8.0"
   },
   "author": {
     "name": "Hany Gamal",
@@ -75,11 +75,7 @@
     "modern datepicker",
     "hany gamal"
   ],
-  "module": "fesm2015/angular-hijri-gregorian-date-time-picker.mjs",
-  "es2020": "fesm2020/angular-hijri-gregorian-date-time-picker.mjs",
-  "esm2020": "esm2020/angular-hijri-gregorian-date-time-picker.mjs",
-  "fesm2020": "fesm2020/angular-hijri-gregorian-date-time-picker.mjs",
-  "fesm2015": "fesm2015/angular-hijri-gregorian-date-time-picker.mjs",
+  "module": "fesm2022/angular-hijri-gregorian-date-time-picker.mjs",
   "typings": "index.d.ts",
   "exports": {
     "./package.json": {
@@ -87,11 +83,7 @@
     },
     ".": {
       "types": "./index.d.ts",
-      "esm2020": "./esm2020/angular-hijri-gregorian-date-time-picker.mjs",
-      "es2020": "./fesm2020/angular-hijri-gregorian-date-time-picker.mjs",
-      "es2015": "./fesm2015/angular-hijri-gregorian-date-time-picker.mjs",
-      "node": "./fesm2015/angular-hijri-gregorian-date-time-picker.mjs",
-      "default": "./fesm2020/angular-hijri-gregorian-date-time-picker.mjs"
+      "default": "./fesm2022/angular-hijri-gregorian-date-time-picker.mjs"
     }
   },
   "sideEffects": false

package/_interfaces/calendar-model.d.ts

@@ -1,28 +0,0 @@
-export interface MonthInfo {
-    fD: DayInfo;
-    lD: DayInfo;
-}
-export interface YearData {
-    [month: string]: MonthInfo;
-}
-export interface Data {
-    [year: string]: YearData;
-}
-export interface TimeValue {
-    hour: number;
-    minute: number;
-}
-export interface DayInfo {
-    gD: string;
-    uD: string;
-    dN: string;
-    uC: number;
-    selected?: boolean;
-    disabled?: boolean;
-    time?: TimeValue;
-}
-export interface TodayDate {
-    gregorian?: string;
-    ummAlQura?: string;
-}
-export type MonthDays = DayInfo[];

package/_interfaces/styles-config.model.d.ts

@@ -1,13 +0,0 @@
-export interface stylesConfig {
-    backgroundColor?: string;
-    primaryColor?: string;
-    secondaryColor?: string;
-    todaysDateBgColor?: string;
-    todaysDateTextColor?: string;
-    confirmBtnTextColor?: string;
-    disabledDayColor?: string;
-    dayNameColor?: string;
-    dayColor?: string;
-    fontFamily?: string;
-    borderRadius?: string;
-}

package/_services/date-utilities.service.d.ts

@@ -1,49 +0,0 @@
-import { Data, DayInfo, MonthDays } from '../_interfaces/calendar-model';
-import * as i0 from "@angular/core";
-export declare class DateUtilitiesService {
-    calendarData: Data;
-    constructor();
-    parseDate(dateStr: string): Date | null;
-    formatDate(date: Date): string;
-    getDayShortHand(date: Date): string;
-    generateDates(fD: DayInfo, lD: DayInfo, uC: number): MonthDays;
-    convertDate(dateStr: string, isGregorian: boolean): DayInfo | null;
-    private isDateInMonthRange;
-    getMonthData(inputDate: string, type: string): DayInfo[] | null;
-    getGregorianMonthData(day: number, month: number, year: number): DayInfo[] | null;
-    getUmAlQurraMonthData(day: number, month: number, year: number): DayInfo[] | null;
-    calculateGregorianDate(startGDate: string, offset: number): string;
-    calculateUmAlQurraDate(startUDate: string, offset: number, uC: number): string;
-    getDayName(dayIndex: number): string;
-    checkPastOrFuture(inputDate: any, targetDate: any): "Future" | "Past" | "Today";
-    parseEnglish(englishNum: any): any;
-    parseArabic(arabicNum: any): any;
-    convertDateNumerals(date: string, targetLang: 'en' | 'ar'): string;
-    /**
-     * Normalize input date to DD/MM/YYYY string format (Gregorian)
-     * Accepts Date object or DD/MM/YYYY string
-     */
-    normalizeDateToString(date: Date | string | undefined): string | null;
-    /**
-     * Compare two dates (Gregorian format DD/MM/YYYY)
-     * Returns: -1 if date1 < date2, 0 if equal, 1 if date1 > date2
-     */
-    compareDates(date1Str: string, date2Str: string): number;
-    /**
-     * Compare two Hijri dates (UM format DD/MM/YYYY)
-     * Converts to Gregorian for comparison
-     */
-    compareHijriDates(hijri1: string, hijri2: string): number;
-    /**
-     * Check if a date is within the specified range (inclusive)
-     * All dates in Gregorian DD/MM/YYYY format
-     */
-    isDateInRange(dateStr: string, minDateStr: string | null, maxDateStr: string | null): boolean;
-    /**
-     * Check if a Hijri date is within the specified range
-     * Converts to Gregorian for comparison
-     */
-    isHijriDateInRange(hijriDateStr: string, minDateStr: string | null, maxDateStr: string | null): boolean;
-    static ɵfac: i0.ɵɵFactoryDeclaration<DateUtilitiesService, never>;
-    static ɵprov: i0.ɵɵInjectableDeclaration<DateUtilitiesService>;
-}