hijri-date-time-picker 1.0.2 → 1.0.31

package/src/lib/hijri-date-picker.types.ts

@@ -0,0 +1,164 @@
+/**
+ * Date picker mode types
+ */
+export type DateMode = "greg" | "hijri";
+
+/**
+ * Text direction types
+ */
+export type Direction = "ltr" | "rtl";
+
+/**
+ * Locale types
+ */
+export type Locale = "en" | "ar";
+
+/**
+ * Selected date information
+ */
+export interface SelectedDate {
+  gregorian: Date;
+  hijri: {
+    year: number;
+    month: number;
+    day: number;
+  };
+  time?: {
+    hours: number;
+    minutes: number;
+    seconds: number;
+  };
+  formatted: {
+    gregorian: string;
+    hijri: string;
+    time?: string;
+  };
+}
+
+/**
+ * Time format types
+ */
+export type TimeFormat = "12" | "24";
+
+/**
+ * Custom styling configuration
+ */
+export interface DatePickerStyles {
+  primaryColor?: string;
+  secondaryColor?: string;
+  backgroundColor?: string;
+  textColor?: string;
+  selectedDateColor?: string;
+  selectedDateBackground?: string;
+  todayColor?: string;
+  disabledColor?: string;
+  borderColor?: string;
+  hoverColor?: string;
+  fontFamily?: string;
+  fontSize?: string;
+  borderRadius?: string;
+}
+
+/**
+ * Label configuration
+ */
+export interface DatePickerLabels {
+  submitTextButton?: string;
+  todaysDateText?: string;
+  ummAlQuraDateText?: string;
+  yearSelectLabel?: string;
+  monthSelectLabel?: string;
+}
+
+/**
+ * Display configuration
+ */
+export interface DatePickerDisplay {
+  todaysDateSection?: boolean;
+  markToday?: boolean;
+  disableYearPicker?: boolean;
+  disableMonthPicker?: boolean;
+  disableDayPicker?: boolean;
+}
+
+/**
+ * Month names in different locales
+ */
+export const GREGORIAN_MONTHS_EN = [
+  "January",
+  "February",
+  "March",
+  "April",
+  "May",
+  "June",
+  "July",
+  "August",
+  "September",
+  "October",
+  "November",
+  "December",
+];
+
+export const GREGORIAN_MONTHS_AR = [
+  "يناير",
+  "فبراير",
+  "مارس",
+  "أبريل",
+  "مايو",
+  "يونيو",
+  "يوليو",
+  "أغسطس",
+  "سبتمبر",
+  "أكتوبر",
+  "نوفمبر",
+  "ديسمبر",
+];
+
+export const HIJRI_MONTHS_EN = [
+  "Muharram",
+  "Safar",
+  "Rabi' al-Awwal",
+  "Rabi' al-Thani",
+  "Jumada al-Awwal",
+  "Jumada al-Thani",
+  "Rajab",
+  "Sha'ban",
+  "Ramadan",
+  "Shawwal",
+  "Dhu al-Qi'dah",
+  "Dhu al-Hijjah",
+];
+
+export const HIJRI_MONTHS_AR = [
+  "محرم",
+  "صفر",
+  "ربيع الأول",
+  "ربيع الثاني",
+  "جمادى الأولى",
+  "جمادى الثانية",
+  "رجب",
+  "شعبان",
+  "رمضان",
+  "شوال",
+  "ذو القعدة",
+  "ذو الحجة",
+];
+
+export const WEEKDAY_NAMES_EN = [
+  "Sun",
+  "Mon",
+  "Tue",
+  "Wed",
+  "Thu",
+  "Fri",
+  "Sat",
+];
+export const WEEKDAY_NAMES_AR = [
+  "الأحد",
+  "الإثنين",
+  "الثلاثاء",
+  "الأربعاء",
+  "الخميس",
+  "الجمعة",
+  "السبت",
+];

package/src/types/hijri-date.d.ts

@@ -0,0 +1,43 @@
+declare module 'hijri-date/lib/safe' {
+  export default class HijriDate {
+    constructor();
+    constructor(year: number, month: number, day: number);
+    constructor(year: number, month: number, day: number, hours: number, minutes: number, seconds: number, milliseconds: number);
+    
+    getFullYear(): number;
+    getMonth(): number;
+    getDate(): number;
+    getDay(): number;
+    getHours(): number;
+    getMinutes(): number;
+    getSeconds(): number;
+    getMilliseconds(): number;
+    
+    setFullYear(year: number): void;
+    setMonth(month: number): void;
+    setDate(day: number): void;
+    setHours(hours: number): void;
+    setMinutes(minutes: number): void;
+    setSeconds(seconds: number): void;
+    setMilliseconds(milliseconds: number): void;
+    
+    toGregorian(): Date;
+    toString(): string;
+    format(format: string): string;
+    
+    isToday(): boolean;
+    isYesterday(): boolean;
+    isTomorrow(): boolean;
+    
+    clone(): HijriDate;
+    ignoreTime(): HijriDate;
+  }
+  
+  export function toHijri(date: Date): HijriDate;
+}
+
+declare module 'hijri-date' {
+  import HijriDate from 'hijri-date/lib/safe';
+  export default HijriDate;
+  export { toHijri } from 'hijri-date/lib/safe';
+}

package/tsconfig.json

@@ -0,0 +1,39 @@
+{
+    "compilerOptions": {
+        "target": "ES2022",
+        "module": "ES2022",
+        "lib": [
+            "ES2022",
+            "DOM"
+        ],
+        "moduleResolution": "node",
+        "declaration": true,
+        "outDir": "./dist",
+        "rootDir": "./src",
+        "strict": true,
+        "esModuleInterop": true,
+        "skipLibCheck": true,
+        "forceConsistentCasingInFileNames": true,
+        "experimentalDecorators": true,
+        "emitDecoratorMetadata": true,
+        "skipDefaultLibCheck": true,
+        "importHelpers": true,
+        "sourceMap": true,
+        "inlineSources": true,
+        "types": []
+    },
+    "angularCompilerOptions": {
+        "skipTemplateCodegen": true,
+        "strictMetadataEmit": true,
+        "enableResourceInlining": true,
+        "compilationMode": "partial"
+    },
+    "include": [
+        "src/**/*"
+    ],
+    "exclude": [
+        "node_modules",
+        "dist",
+        "src/demo.ts"
+    ]
+}

package/dist/LICENSE

@@ -1,21 +0,0 @@
-MIT License
-
-Copyright (c) 2025 Hany
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.

package/dist/README.md

@@ -1,185 +0,0 @@
-# Hijri Date Time Picker Component
-
-An Angular standalone component for dual-mode Gregorian and Hijri date selection with time support using the Umm Al-Qura calendar system.
-
-## Features
-
-✨ **Dual Calendar Support**: Switch between Gregorian and Hijri (Umm Al-Qura) calendars  
-🌍 **Localization**: Full support for English and Arabic languages  
-↔️ **RTL/LTR**: Automatic layout direction based on locale  
-📅 **Multiple Selection**: Single or multiple date selection modes  
-🕒 **DateTime Support**: Integrated time selection with modern styling  
-🎨 **Customizable Styling**: Comprehensive theming via CSS variables  
-✅ **Validation**: Future date validation with configurable limits  
-📱 **Responsive**: Mobile-friendly design  
-♿ **Accessible**: ARIA labels and keyboard navigation support
-
-## Installation
-
-```bash
-npm install hijri-date-time-picker hijri-date
-```
-
-## Dependencies
-
-- `@angular/core` >= 15.0.0
-- `@angular/common` >= 15.0.0
-- `hijri-date` ^0.2.2
-
-## Usage
-
-### Basic Example
-
-```typescript
-import { Component } from '@angular/core';
-import { HijriDatePickerComponent, SelectedDate } from 'hijri-date-time-picker';
-
-@Component({
-  selector: 'app-root',
-  standalone: true,
-  imports: [HijriDatePickerComponent],
-  template: `
-    <hijri-date-picker
-      [mode]="'greg'"
-      [locale]="'en'"
-      (dateSelected)="onDateSelected($event)">
-    </hijri-date-picker>
-  `
-})
-export class AppComponent {
-  onDateSelected(date: SelectedDate) {
-    console.log('Selected date:', date);
-  }
-}
-```
-
-### DateTime Picker Example
-
-```html
-<hijri-date-picker
-  [enableTime]="true"
-  [timeFormat]="'12'"
-  [minuteStep]="15"
-  [enableSeconds]="false"
-  (dateSelected)="onDateTimeSelected($event)">
-</hijri-date-picker>
-```
-
-### Initial Date Binding
-
-```html
-<!-- Single Date Selection -->
-<hijri-date-picker
-  [initialSelectedDate]="myDate">
-</hijri-date-picker>
-
-<!-- Multiple Dates Selection -->
-<hijri-date-picker
-  [multiple]="true"
-  [initialSelectedDates]="myDates">
-</hijri-date-picker>
-```
-
-## API Reference
-
-### Inputs
-
-#### Mode & Configuration
-
-| Input | Type | Default | Description |
-|-------|------|---------|-------------|
-| `canChangeMode` | `boolean` | `true` | Enable/disable mode toggle button |
-| `mode` | `'greg' \| 'hijri'` | `'greg'` | Initial calendar mode |
-| `dir` | `'ltr' \| 'rtl'` | `'ltr'` | Text direction |
-| `locale` | `'en' \| 'ar'` | `'en'` | Language locale |
-
-#### DateTime Configuration (NEW)
-
-| Input | Type | Default | Description |
-|-------|------|---------|-------------|
-| `enableTime` | `boolean` | `false` | Enable time selection UI |
-| `timeFormat` | `'12' \| '24'` | `'24'` | Time display format |
-| `minuteStep` | `number` | `1` | Increment step for minutes |
-| `enableSeconds` | `boolean` | `false` | Show seconds selection |
-| `defaultTime` | `{ hours, minutes, seconds? }` | `undefined` | Default time to show |
-
-#### Validation
-
-| Input | Type | Default | Description |
-|-------|------|---------|-------------|
-| `futureValidation` | `boolean` | `true` | Prevent selecting dates beyond limit |
-| `futureYearsLimit` | `number` | `10` | Maximum years in the future |
-| `isRequired` | `boolean` | `false` | Require date selection before submit |
-| `minDate` | `Date` | `undefined` | Minimum selectable date (dates before are disabled) |
-| `maxDate` | `Date` | `undefined` | Maximum selectable date (dates after are disabled) |
-
-#### Selection & Binding
-
-| Input | Type | Default | Description |
-|-------|------|---------|-------------|
-| `multiple` | `boolean` | `false` | Enable multiple date selection |
-| `showConfirmButton` | `boolean` | `false` | Show submit button |
-| `initialSelectedDate` | `Date` | `undefined` | Pre-select a single date |
-| `initialSelectedDates` | `Date[]` | `[]` | Pre-select multiple dates |
-
-#### Labels
-
-| Input | Type | Default | Description |
-|-------|------|---------|-------------|
-| `submitTextButton` | `string` | `'Submit'` | Submit button text |
-| `todaysDateText` | `string` | `'Today'` | Today button text |
-| `ummAlQuraDateText` | `string` | `'Umm Al-Qura Calendar'` | Calendar type label |
-| `yearSelectLabel` | `string` | `'Year'` | Year dropdown label |
-| `monthSelectLabel` | `string` | `'Month'` | Month dropdown label |
-
-### Outputs
-
-| Output | Type | Description |
-|--------|------|-------------|
-| `dateSelected` | `EventEmitter<SelectedDate \| SelectedDate[]>` | Emits when date(s) selected |
-| `modeChanged` | `EventEmitter<'greg' \| 'hijri'>` | Emits when calendar mode changes |
-
-### Types
-
-#### SelectedDate
-
-```typescript
-interface SelectedDate {
-  gregorian: Date;
-  hijri: {
-    year: number;
-    month: number;
-    day: number;
-  };
-  time?: {
-    hours: number;
-    minutes: number;
-    seconds: number;
-  };
-  formatted: {
-    gregorian: string;
-    hijri: string;
-    time?: string;
-  };
-}
-```
-
-## Styling
-
-The component can be customized using the `styles` input or by overriding CSS variables:
-
-```typescript
-const customStyles: DatePickerStyles = {
-  primaryColor: '#4f46e5',
-  secondaryColor: '#818cf8',
-  borderRadius: '8px'
-};
-```
-
-## License
-
-MIT
-
-## Credits
-
-Built with [Angular](https://angular.io/) and [hijri-date](https://www.npmjs.com/package/hijri-date).

package/dist/demo.d.ts

@@ -1,12 +0,0 @@
-import { SelectedDate, DatePickerStyles } from './lib/hijri-date-picker.types';
-export declare class DemoComponent {
-    selectedDates: {
-        [key: string]: any;
-    };
-    today: Date;
-    minDate: Date;
-    maxDate: Date;
-    maxFutureDate: Date;
-    customStyles: DatePickerStyles;
-    onDateSelected(date: SelectedDate | SelectedDate[], key: string): void;
-}

package/dist/esm2022/hijri-date-time-picker.mjs

@@ -1,5 +0,0 @@
-/**
- * Generated bundle index. Do not edit.
- */
-export * from './index';
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaGlqcmktZGF0ZS10aW1lLXBpY2tlci5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9oaWpyaS1kYXRlLXRpbWUtcGlja2VyLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOztHQUVHO0FBRUgsY0FBYyxTQUFTLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEdlbmVyYXRlZCBidW5kbGUgaW5kZXguIERvIG5vdCBlZGl0LlxuICovXG5cbmV4cG9ydCAqIGZyb20gJy4vaW5kZXgnO1xuIl19

package/dist/esm2022/index.mjs

@@ -1,3 +0,0 @@
-export { HijriDatePickerComponent } from './lib/hijri-date-picker.component';
-export * from './lib/hijri-date-picker.types';
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi9zcmMvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLHdCQUF3QixFQUFFLE1BQU0sbUNBQW1DLENBQUM7QUFDN0UsY0FBYywrQkFBK0IsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImV4cG9ydCB7IEhpanJpRGF0ZVBpY2tlckNvbXBvbmVudCB9IGZyb20gJy4vbGliL2hpanJpLWRhdGUtcGlja2VyLmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL2xpYi9oaWpyaS1kYXRlLXBpY2tlci50eXBlcyc7XG4iXX0=