ngxsmk-datepicker 1.9.29 → 2.0.2
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 +1 -1
- package/docs/API.md +29 -1
- package/docs/signal-forms.md +23 -0
- package/fesm2022/ngxsmk-datepicker.mjs +98 -20
- package/package.json +1 -1
- package/types/ngxsmk-datepicker.d.ts +30 -23
package/README.md
CHANGED
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
|
|
8
8
|
**npm i ngxsmk-datepicker**
|
|
9
9
|
|
|
10
|
-
> **Stable Version**: `
|
|
10
|
+
> **Stable Version**: `2.0.2` is the current stable release. For production use, install the latest version from npm.
|
|
11
11
|
>
|
|
12
12
|
> ⚠️ **Warning**: Version `1.9.26` contains broken styles. If you are using `1.9.26`, please upgrade to `1.9.28` or downgrade to `1.9.25` immediately.
|
|
13
13
|
|
package/docs/API.md
CHANGED
|
@@ -39,7 +39,7 @@ import { NgxsmkDatepickerComponent } from 'ngxsmk-datepicker';
|
|
|
39
39
|
|-------|------|---------|--------|-------------|---------|
|
|
40
40
|
| `mode` | `'single' \| 'range' \| 'multiple'` | `'single'` | Stable | Selection mode | `mode="single"` or `[mode]="'range'"` |
|
|
41
41
|
| `value` | `DatepickerValue` | `null` | Stable | Current value (one-way binding) | `[value]="selectedDate"` |
|
|
42
|
-
| `field` | `
|
|
42
|
+
| `field` | `SignalFormField \| SignalFormFieldConfig` | `null` | Stable | Signal form field (Angular 21+). Automatically tracks dirty state when using `[field]` binding. Supports direct signals, signals with properties, and resolution of nested signals. | `[field]="myForm.dateField"` |
|
|
43
43
|
| `placeholder` | `string \| null` | `'Select Date'` or `'Select Time'` | Stable | Input placeholder text | `placeholder="Choose a date"` |
|
|
44
44
|
| `inputId` | `string` | `''` | Stable | Custom ID for the input element | `inputId="my-date-input"` |
|
|
45
45
|
| `name` | `string` | `''` | Stable | Name attribute for the input element | `name="my-date-field"` |
|
|
@@ -2179,6 +2179,34 @@ type DateInput =
|
|
|
2179
2179
|
| { toDate: () => Date; _isAMomentObject?: boolean; $d?: Date };
|
|
2180
2180
|
```
|
|
2181
2181
|
|
|
2182
|
+
|
|
2183
|
+
### SignalFormField (v2.0.2+)
|
|
2184
|
+
|
|
2185
|
+
**Status**: Stable
|
|
2186
|
+
|
|
2187
|
+
Type representing a signal-based form field.
|
|
2188
|
+
|
|
2189
|
+
```typescript
|
|
2190
|
+
type SignalFormField = any; // Compatible with Angular 21 FieldTree
|
|
2191
|
+
```
|
|
2192
|
+
|
|
2193
|
+
### SignalFormFieldConfig (v2.0.2+)
|
|
2194
|
+
|
|
2195
|
+
**Status**: Stable
|
|
2196
|
+
|
|
2197
|
+
Interface for a resolved or direct signal form field configuration.
|
|
2198
|
+
|
|
2199
|
+
```typescript
|
|
2200
|
+
interface SignalFormFieldConfig {
|
|
2201
|
+
value: Signal<DatepickerValue> | WritableSignal<DatepickerValue> | (() => DatepickerValue);
|
|
2202
|
+
disabled: Signal<boolean> | (() => boolean) | boolean;
|
|
2203
|
+
required?: Signal<boolean> | (() => boolean) | boolean;
|
|
2204
|
+
setValue?: (value: DatepickerValue) => void;
|
|
2205
|
+
updateValue?: (updater: (prev: DatepickerValue) => DatepickerValue) => void;
|
|
2206
|
+
markAsDirty?: () => void;
|
|
2207
|
+
errors?: Signal<ValidationError[]> | (() => ValidationError[]);
|
|
2208
|
+
}
|
|
2209
|
+
|
|
2182
2210
|
### DatepickerHooks
|
|
2183
2211
|
|
|
2184
2212
|
**Status**: Stable (v1.9.22+)
|
package/docs/signal-forms.md
CHANGED
|
@@ -113,6 +113,29 @@ export class TwoWayComponent {
|
|
|
113
113
|
}
|
|
114
114
|
```
|
|
115
115
|
|
|
116
|
+
### Signal Field Resolution (v2.0.2+)
|
|
117
|
+
|
|
118
|
+
The datepicker includes a robust resolution mechanism for signal-based fields. It can handle:
|
|
119
|
+
- **Direct Signals**: A signal that contains the field configuration.
|
|
120
|
+
- **Signals with Properties**: A signal function that has field properties (like `value`, `disabled`, `setValue`) attached directly to it (common in some Signal Form implementations).
|
|
121
|
+
- **Nested Signals**: Signals that return a field configuration object when executed.
|
|
122
|
+
|
|
123
|
+
The datepicker intelligently detects these patterns and unwraps them automatically.
|
|
124
|
+
|
|
125
|
+
### Enhanced Type Safety
|
|
126
|
+
|
|
127
|
+
The library now exports `SignalFormFieldConfig` to allow you to strictly type your field configurations:
|
|
128
|
+
|
|
129
|
+
```typescript
|
|
130
|
+
import { SignalFormFieldConfig } from 'ngxsmk-datepicker';
|
|
131
|
+
|
|
132
|
+
const config: SignalFormFieldConfig = {
|
|
133
|
+
value: signal(new Date()),
|
|
134
|
+
disabled: () => false,
|
|
135
|
+
required: true
|
|
136
|
+
};
|
|
137
|
+
```
|
|
138
|
+
|
|
116
139
|
## Dirty State Tracking
|
|
117
140
|
|
|
118
141
|
When using the `[field]` binding, the datepicker automatically tracks the form's dirty state. The form will be marked as dirty when a user selects a date:
|