ngxsmk-datepicker 1.2.7 → 1.2.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +4 -8
- package/package.json +1 -1
- package/projects/ngxsmk-datepicker/README.md +20 -21
package/README.md
CHANGED
|
@@ -1,22 +1,18 @@
|
|
|
1
1
|
# **ngxsmk-datepicker**
|
|
2
2
|
|
|
3
|
-
A
|
|
4
|
-
|
|
3
|
+
ngxsmk-datepicker – A modern, powerful, and fully customizable date and date-range picker component designed for Angular 17+ and Ionic applications. Seamlessly integrates with both frameworks, offering a flexible, mobile-friendly UI and advanced features to enhance date selection experiences in your apps.
|
|
5
4
|
* NPM: [https://github.com/toozuuu/ngxsmk-datepicker](https://www.npmjs.com/package/ngxsmk-datepicker)
|
|
6
5
|
|
|
7
|
-
Built with Angular Signals for optimal performance and a clean, declarative API. The component is standalone and has zero dependencies, making it lightweight and easy to integrate into any project.
|
|
8
|
-
|
|
9
6
|
## Screenshots
|
|
10
7
|
|
|
11
8
|
<p align="left">
|
|
12
|
-
<img src="https://
|
|
9
|
+
<img src="https://github.com/toozuuu/ngxsmk-datepicker/raw/main/projects/ngxsmk-datepicker/docs/1.png" alt="Angular Advanced Date Range Picker" width="420" />
|
|
13
10
|
|
|
14
|
-
<img src="https://
|
|
11
|
+
<img src="https://github.com/toozuuu/ngxsmk-datepicker/raw/main/projects/ngxsmk-datepicker/docs/2.png" alt="Angular Localization" width="420" />
|
|
15
12
|
|
|
16
|
-
<img src="https://
|
|
13
|
+
<img src="https://github.com/toozuuu/ngxsmk-datepicker/raw/main/projects/ngxsmk-datepicker/docs/3.png" alt="Angular Single Date Selection" width="420" />
|
|
17
14
|
</p>
|
|
18
15
|
|
|
19
|
-
|
|
20
16
|
## **✨ Features**
|
|
21
17
|
|
|
22
18
|
* **Date & Time Selection**: Supports `single` date or `range` mode selection, including optional time inputs.
|
package/package.json
CHANGED
|
@@ -1,22 +1,19 @@
|
|
|
1
1
|
# **ngxsmk-datepicker**
|
|
2
2
|
|
|
3
|
-
A
|
|
3
|
+
ngxsmk-datepicker – A modern, powerful, and fully customizable date and date-range picker component designed for Angular 17+ and Ionic applications. Seamlessly integrates with both frameworks, offering a flexible, mobile-friendly UI and advanced features to enhance date selection experiences in your apps.
|
|
4
4
|
|
|
5
|
-
*
|
|
6
|
-
|
|
7
|
-
Built with Angular Signals for optimal performance and a clean, declarative API. The component is standalone and has zero dependencies, making it lightweight and easy to integrate into any project.
|
|
5
|
+
* Github: [https://github.com/toozuuu/ngxsmk-datepicker](https://github.com/toozuuu/ngxsmk-datepicker)
|
|
8
6
|
|
|
9
7
|
## Screenshots
|
|
10
8
|
|
|
11
9
|
<p align="left">
|
|
12
|
-
<img src="https://
|
|
10
|
+
<img src="https://github.com/toozuuu/ngxsmk-datepicker/raw/main/projects/ngxsmk-datepicker/docs/1.png" alt="Angular Advanced Date Range Picker" width="420" />
|
|
13
11
|
|
|
14
|
-
<img src="https://
|
|
12
|
+
<img src="https://github.com/toozuuu/ngxsmk-datepicker/raw/main/projects/ngxsmk-datepicker/docs/2.png" alt="Angular Localization" width="420" />
|
|
15
13
|
|
|
16
|
-
<img src="https://
|
|
14
|
+
<img src="https://github.com/toozuuu/ngxsmk-datepicker/raw/main/projects/ngxsmk-datepicker/docs/3.png" alt="Angular Single Date Selection" width="420" />
|
|
17
15
|
</p>
|
|
18
16
|
|
|
19
|
-
|
|
20
17
|
## **✨ Features**
|
|
21
18
|
|
|
22
19
|
* **Date & Time Selection**: Supports `single` date or `range` mode selection, including optional time inputs.
|
|
@@ -95,19 +92,19 @@ Use the \<ngxsmk-datepicker\> selector in your HTML template.
|
|
|
95
92
|
|
|
96
93
|
### **Inputs**
|
|
97
94
|
|
|
98
|
-
| Property
|
|
99
|
-
|
|
100
|
-
| mode
|
|
101
|
-
| locale
|
|
102
|
-
| theme
|
|
103
|
-
| showRanges
|
|
104
|
-
| minDate
|
|
105
|
-
| maxDate
|
|
106
|
-
| isInvalidDate
|
|
107
|
-
| ranges
|
|
108
|
-
| minuteInterval
|
|
109
|
-
| showTime
|
|
110
|
-
| value
|
|
95
|
+
| Property | Type | Default | Description |
|
|
96
|
+
|:---------------|:-------------------------------------------|:-------------------|:--------------------------------------------------------------------------------------------------------------|
|
|
97
|
+
| mode | 'single' | 'range' | 'single' |
|
|
98
|
+
| locale | string | navigator.language | Sets the locale for language and regional formatting (e.g., 'en-US', 'de-DE'). |
|
|
99
|
+
| theme | 'light' | 'dark' | 'light' |
|
|
100
|
+
| showRanges | boolean | true | If true, displays the predefined ranges panel when in 'range' mode. |
|
|
101
|
+
| minDate | DateInput | null | null | The earliest selectable date. Accepts Date, string, moment, or dayjs objects. |
|
|
102
|
+
| maxDate | DateInput | null | null | The latest selectable date. Accepts Date, string, moment, or dayjs objects. |
|
|
103
|
+
| isInvalidDate | (date: Date) \=\> boolean | () \=\> false | A function to programmatically disable specific dates. Returns true if the date should be disabled. |
|
|
104
|
+
| ranges | DateRange | null | null | An object of predefined date ranges. The key is the label, and the value is a \[start, end\] tuple. |
|
|
105
|
+
| minuteInterval | number | 1 | Interval for minute dropdown options (e.g., 5, 15, 30). Used for option generation and initial time rounding. |
|
|
106
|
+
| showTime | boolean | false | Enables the hour/minute/AM/PM selection section. |
|
|
107
|
+
| value | Date \| { start: Date; end: Date } \| null | null | The initial selected date or date range. |
|
|
111
108
|
|
|
112
109
|
### **Outputs**
|
|
113
110
|
|
|
@@ -140,9 +137,11 @@ The locale input controls all internationalization. It automatically formats mon
|
|
|
140
137
|
<ngxsmk-datepicker [locale]="'fr-FR'"></ngxsmk-datepicker>
|
|
141
138
|
|
|
142
139
|
## **🤝 Contributions**
|
|
140
|
+
|
|
143
141
|
We welcome and appreciate contributions from the community! Whether it's reporting a bug, suggesting a new feature, or submitting code, your help is valuable.
|
|
144
142
|
|
|
145
143
|
Forking and Development
|
|
144
|
+
|
|
146
145
|
* Fork the ngxsmk-datepicker repository on GitHub.
|
|
147
146
|
|
|
148
147
|
* Clone your fork to your local machine.
|