@netwin/angular-datetime-picker 18.1.0-rc.2 → 18.2.0
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 +86 -198
- package/esm2022/lib/date-time/adapter/native-date-time-adapter.class.mjs +3 -3
- package/esm2022/lib/date-time/adapter/native-date-time.module.mjs +8 -8
- package/esm2022/lib/date-time/adapter/unix-timestamp-adapter/unix-timestamp-date-time-adapter.class.mjs +3 -3
- package/esm2022/lib/date-time/calendar-body.component.mjs +3 -3
- package/esm2022/lib/date-time/calendar-month-view.component.mjs +3 -3
- package/esm2022/lib/date-time/calendar-multi-year-view.component.mjs +4 -4
- package/esm2022/lib/date-time/calendar-year-view.component.mjs +4 -4
- package/esm2022/lib/date-time/calendar.component.mjs +3 -3
- package/esm2022/lib/date-time/date-time-inline.component.mjs +3 -3
- package/esm2022/lib/date-time/date-time-picker-container.component.mjs +3 -3
- package/esm2022/lib/date-time/date-time-picker-input.directive.mjs +3 -3
- package/esm2022/lib/date-time/date-time-picker-intl.service.mjs +3 -3
- package/esm2022/lib/date-time/date-time-picker-trigger.directive.mjs +3 -3
- package/esm2022/lib/date-time/date-time-picker.component.mjs +3 -3
- package/esm2022/lib/date-time/date-time.class.mjs +3 -3
- package/esm2022/lib/date-time/date-time.module.mjs +4 -4
- package/esm2022/lib/date-time/numberedFixLen.pipe.mjs +4 -4
- package/esm2022/lib/date-time/timer-box.component.mjs +4 -4
- package/esm2022/lib/date-time/timer.component.mjs +3 -3
- package/esm2022/lib/dialog/dialog-container.component.mjs +3 -3
- package/esm2022/lib/dialog/dialog.module.mjs +4 -4
- package/esm2022/lib/dialog/dialog.service.mjs +3 -3
- package/esm2022/lib/utils/array.utils.mjs +2 -9
- package/esm2022/lib/utils/constants.mjs +1 -4
- package/esm2022/lib/utils/date.utils.mjs +1 -4
- package/esm2022/lib/utils/index.mjs +4 -4
- package/esm2022/lib/utils/object.utils.mjs +1 -4
- package/fesm2022/netwin-angular-datetime-picker.mjs +152 -172
- package/fesm2022/netwin-angular-datetime-picker.mjs.map +1 -1
- package/lib/date-time/numberedFixLen.pipe.d.ts +1 -1
- package/lib/utils/array.utils.d.ts +0 -3
- package/lib/utils/constants.d.ts +0 -3
- package/lib/utils/date.utils.d.ts +0 -3
- package/lib/utils/index.d.ts +3 -3
- package/lib/utils/object.utils.d.ts +0 -3
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,209 +1,97 @@
|
|
|
1
|
-
:date: :clock1: Angular Date/Time Picker
|
|
2
|
-
========================
|
|
1
|
+
# :date: :clock1: Angular Date/Time Picker
|
|
3
2
|
|
|
4
|
-
[](https://www.npmjs.com/package/@
|
|
3
|
+
[](https://www.npmjs.com/package/@netwin/angular-datetime-picker)
|
|
5
4
|
[](https://www.npmjs.com/package/@netwin/angular-datetime-picker)
|
|
6
5
|
|
|
6
|
+
## How to Use
|
|
7
7
|
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
How to Use
|
|
14
|
-
-------
|
|
15
|
-
|
|
16
|
-
1. Install with [npm](https://www.npmjs.com): `npm install @danielmoncada/angular-datetime-picker --save`
|
|
17
|
-
2. Add styles.
|
|
18
|
-
If you are using Angular CLI, you can add this to your styles.css:
|
|
19
|
-
```css
|
|
20
|
-
@import "@danielmoncada/angular-datetime-picker/assets/style/picker.min.css";
|
|
21
|
-
```
|
|
22
|
-
If you are not using the Angular CLI, you can include the picker.min.css via a ```<link>``` element in your index.html.
|
|
23
|
-
3. Add __OwlDateTimeModule__ and __OwlNativeDateTimeModule__ to your __@NgModule__ like example below
|
|
24
|
-
```typescript
|
|
25
|
-
import { NgModule } from '@angular/core';
|
|
26
|
-
import { BrowserModule } from '@angular/platform-browser';
|
|
27
|
-
import { MyTestApp } from './my-test-app';
|
|
28
|
-
import { OwlDateTimeModule, OwlNativeDateTimeModule } from '@danielmoncada/angular-datetime-picker';
|
|
29
|
-
|
|
30
|
-
@NgModule({
|
|
31
|
-
imports: [
|
|
32
|
-
BrowserModule,
|
|
33
|
-
OwlDateTimeModule,
|
|
34
|
-
OwlNativeDateTimeModule,
|
|
35
|
-
],
|
|
36
|
-
declarations: [ MyTestApp ],
|
|
37
|
-
bootstrap: [ MyTestApp ]
|
|
38
|
-
})
|
|
39
|
-
export class MyTestAppModule {}
|
|
40
|
-
```
|
|
41
|
-
4. Connecting a picker to an input and a trigger.
|
|
42
|
-
```html
|
|
43
|
-
<input [owlDateTime]="dt1" [owlDateTimeTrigger]="dt1" placeholder="Date Time">
|
|
44
|
-
<owl-date-time #dt1></owl-date-time>
|
|
45
|
-
```
|
|
46
|
-
```html
|
|
47
|
-
<input [owlDateTime]="dt2" placeholder="Date Time">
|
|
48
|
-
<span [owlDateTimeTrigger]="dt2"><i class="fa fa-calendar"></i></span>
|
|
49
|
-
<owl-date-time #dt2></owl-date-time>
|
|
50
|
-
```
|
|
51
|
-
The examples above are quite basic. The picker has much more features,
|
|
52
|
-
and you could learn more about those from [demo page](https://danielykpan.github.io/date-time-picker/).
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
Animation
|
|
56
|
-
-------
|
|
57
|
-
This picker uses angular animations to improve the user experience,
|
|
58
|
-
therefore you need to install `@angular/animations` and import `BrowserAnimationsModule` to your application.
|
|
8
|
+
Install this library by running
|
|
9
|
+
|
|
10
|
+
```sh
|
|
11
|
+
npm install @netwin/angular-datetime-picker
|
|
59
12
|
```
|
|
60
|
-
|
|
13
|
+
|
|
14
|
+
Afterwards, add the global stylesheet to your styles section within your angular.json file:
|
|
15
|
+
|
|
16
|
+
```json
|
|
17
|
+
"styles": [
|
|
18
|
+
"node_modules/@netwin/angular-datetime-picker/assets/style/picker.min.css",
|
|
19
|
+
"... other styles"
|
|
20
|
+
]
|
|
61
21
|
```
|
|
22
|
+
|
|
23
|
+
To then use it, import both the `OwlDateTimeModule` and `OwlNativeDateTimeModule` in your `app.module.ts` or
|
|
24
|
+
in your component that wants to use it:
|
|
25
|
+
|
|
62
26
|
```typescript
|
|
63
|
-
import {
|
|
64
|
-
import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
|
|
27
|
+
import { OwlDateTimeModule, OwlNativeDateTimeModule } from '@netwin/angular-datetime-picker';
|
|
65
28
|
|
|
66
29
|
@NgModule({
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
30
|
+
imports: [OwlDateTimeModule, OwlNativeDateTimeModule],
|
|
31
|
+
...
|
|
32
|
+
})
|
|
33
|
+
export class AppModule {}
|
|
34
|
+
```
|
|
35
|
+
|
|
36
|
+
or
|
|
37
|
+
|
|
38
|
+
```typescript
|
|
39
|
+
import { OwlDateTimeModule, OwlNativeDateTimeModule } from '@netwin/angular-datetime-picker';
|
|
40
|
+
|
|
41
|
+
@Component({
|
|
42
|
+
standalone: true,
|
|
43
|
+
selector: 'app-my-feature-with-datetime-picker',
|
|
44
|
+
templateUrl: './app.component.html',
|
|
45
|
+
styleUrl: './app.component.css',
|
|
46
|
+
providers: [OwlDateTimeModule, OwlNativeDateTimeModule]
|
|
73
47
|
})
|
|
74
|
-
export class
|
|
48
|
+
export class MyFeatureWithDatetimePickerComponent {}
|
|
75
49
|
```
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
| `beforePickerOpen` |null| Callback to invoke before the picker is opened |
|
|
125
|
-
| `afterPickerOpen` |null| Callback to invoke when the picker is opened |
|
|
126
|
-
| `afterPickerClosed` |null| Callback to invoke when the picker is closed. |
|
|
127
|
-
| `yearSelected` |T| Callback to invoke when the year is selected.This doesn't imply a change on the selected date. |
|
|
128
|
-
| `monthSelected` |T| Callback to invoke when the month is selected.This doesn't imply a change on the selected date. |
|
|
129
|
-
| `dateClicked` |T| Callback when the selected data changes. |
|
|
130
|
-
| `selectedChanged` |T| Callback when the currently selected data changes. |
|
|
131
|
-
| `userSelection` |null| Callback when any date is selected. |
|
|
132
|
-
|
|
133
|
-
Properties for `input[owlDateTime]`
|
|
134
|
-
-------
|
|
135
|
-
|Name|Type|Required|Default|Description|
|
|
136
|
-
|:--- |:--- |:--- |:--- |:--- |
|
|
137
|
-
|`owlDateTime`|`OwlDateTimeComponent<T>`|Require|`null`| The date time picker that this input is associated with.|
|
|
138
|
-
|`owlDateTimeFilter`|`( date: T)=>boolean `|Optional|`null`|A function to filter date time.|
|
|
139
|
-
|`disabled`|boolean|Optional|`false`|When specify to true, it would disable the picker's input.|
|
|
140
|
-
|`min`|`<T>`|Optional|`null`| The minimum valid date time.|
|
|
141
|
-
|`max`|`<T>`|Optional|`null`| The maximum valid date time.|
|
|
142
|
-
|`selectMode`|`single`, `range`, `rangeFrom`, `rangeTo`|Optional|`single`| Specify the picker's select mode. `single`: a single value allowed, `range`: allow users to select a range of date-time, `rangeFrom`: the input would only show the 'from' value and the picker could only selects 'from' value, `rangeTo`: the input would only show the 'to' value and the picker could only selects 'to' value.|
|
|
143
|
-
|`rangeSeparator`|string|Optional|`-`| The character to separate the 'from' and 'to' in input value in range selectMode.|
|
|
144
|
-
|
|
145
|
-
Events for `input[owlDateTime]`
|
|
146
|
-
-------
|
|
147
|
-
|Events|Parameter|Description|
|
|
148
|
-
|:--- |:--- |:--- |
|
|
149
|
-
|`dateTimeChange`|source: OwlDateTimeInput, value: input value, input: the input element|Callback to invoke when `change` event is fired on this `<input [owlDateTime]>`|
|
|
150
|
-
|`dateTimeInput`|source: OwlDateTimeInput, value: input value, input: the input element|Callback to invoke when an `input` event is fired on this `<input [owlDateTime]>`.|
|
|
151
|
-
|
|
152
|
-
Properties for `[owlDateTimeTrigger]`
|
|
153
|
-
-------
|
|
154
|
-
|Name|Type|Required|Default|Description|
|
|
155
|
-
|:--- |:--- |:--- |:--- |:--- |
|
|
156
|
-
|`owlDateTimeTrigger`|`OwlDateTimeComponent<T>`|Require|`null`| The date time picker that this trigger is associated with.|
|
|
157
|
-
|`disabled`|boolean|Optional|`false`|When specify to true, it would disable the trigger.|
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
Properties for `[owlDateTimeTrigger]`
|
|
161
|
-
-------
|
|
162
|
-
|Name|Type|Required|Default|Description|
|
|
163
|
-
|:--- |:--- |:--- |:--- |:--- |
|
|
164
|
-
|`owlDateTimeTrigger`|`OwlDateTimeComponent<T>`|Require|`null`| The date time picker that this trigger is associated with.|
|
|
165
|
-
|`disabled`|boolean|Optional|`false`|When specify to true, it would disable the trigger.|
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
Properties for `owl-date-time-inline`
|
|
169
|
-
-------
|
|
170
|
-
|Name|Type|Required|Default|Description|
|
|
171
|
-
|:--- |:--- |:--- |:--- |:--- |
|
|
172
|
-
|`pickerType`|`both`, `calendar`, `timer`|Optional|`both`| Set the type of the dateTime picker. `both`: show both calendar and timer, `calendar`: only show calendar, `timer`: only show timer. |
|
|
173
|
-
|`startView`|`month`, `year`, `multi-year`|Optional|`month`| The view that the calendar should start in. |
|
|
174
|
-
|`startAt`| T/null |Optional|`null`| The moment to open the picker to initially. |
|
|
175
|
-
|`endAt`| T/null |Optional|`null`| The the default selected time for range calendar end time |
|
|
176
|
-
|`firstDayOfWeek`|number|Optional|`0`| Set the first day of week. Valid value is from 0 to 6. 0: Sunday - 6: Saturday|
|
|
177
|
-
|`showSecondsTimer`|boolean|Optional|`false`| When specify it to true, it would show a timer to configure the second's value |
|
|
178
|
-
|`hideOtherMonths`|boolean|Optional|`false`| Whether to hide dates in other months at the start or end of the current month |
|
|
179
|
-
|`hour12Timer`|boolean|Optional|`false`| When specify it to true, the timer would be in hour12 format mode|
|
|
180
|
-
|`stepHour`|number|Optional|`1`| Hours to change per step.|
|
|
181
|
-
|`stepMinute`|number|Optional|`1`| Minutes to change per step.|
|
|
182
|
-
|`stepSecond`|number|Optional|`1`| Seconds to change per step.|
|
|
183
|
-
|`disabled`|boolean|Optional|`false`|When specify to true, it would disable the picker.|
|
|
184
|
-
|`owlDateTimeFilter`|`( date: T)=>boolean `|Optional|`null`|A function to filter date time.|
|
|
185
|
-
|`min`|`<T>`|Optional|`null`| The minimum valid date time.|
|
|
186
|
-
|`max`|`<T>`|Optional|`null`| The maximum valid date time.|
|
|
187
|
-
|`selectMode`|`single`, `range`, `rangeFrom`, `rangeTo`|Optional|`single`| Specify the picker's select mode. `single`: a single value allowed, `range`: allow users to select a range of date-time, `rangeFrom`: the input would only show the 'from' value and the picker could only selects 'from' value, `rangeTo`: the input would only show the 'to' value and the picker could only selects 'to' value.|
|
|
188
|
-
|
|
189
|
-
Localization and DateTime Format
|
|
190
|
-
-------
|
|
191
|
-
Localization for different languages and formats is defined by `OWL_DATE_TIME_LOCALE` and `OWL_DATE_TIME_FORMATS`. You could learn more about this from [here](https://danielykpan.github.io/date-time-picker#locale-formats).
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
Dependencies
|
|
195
|
-
-------
|
|
196
|
-
none
|
|
197
|
-
|
|
198
|
-
Demo
|
|
199
|
-
-------
|
|
200
|
-
- Online doc is [here](https://daniel-projects.firebaseapp.com/owlng/date-time-picker)
|
|
201
|
-
- Online demos (StackBlitz) are [here](https://stackblitz.com/edit/angular-vvp849) and [here](https://stackblitz.com/edit/angular-i7ykf5)
|
|
202
|
-
|
|
203
|
-
License
|
|
204
|
-
-------
|
|
205
|
-
* License: MIT
|
|
206
|
-
|
|
207
|
-
Author
|
|
208
|
-
-------
|
|
209
|
-
**Maintained and updated by Daniel Moncada, original implementatiom by Daniel Pan**
|
|
50
|
+
|
|
51
|
+
Last but not least, simply use the picker in your HTML file like so:
|
|
52
|
+
|
|
53
|
+
```html
|
|
54
|
+
<owl-date-time-inline [...]="..." />
|
|
55
|
+
```
|
|
56
|
+
|
|
57
|
+
See below for more information on the properties you can use.
|
|
58
|
+
|
|
59
|
+
## Properties for `owl-date-time-inline`
|
|
60
|
+
|
|
61
|
+
| Name | Type | Required | Default | Description |
|
|
62
|
+
| ------------------- | ----------------------------------------- | -------- | -------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
63
|
+
| `pickerType` | `both`, `calendar`, `timer` | Optional | `both` | Set the type of the dateTime picker. `both`: show both calendar and timer, `calendar`: only show calendar, `timer`: only show timer. |
|
|
64
|
+
| `startView` | `month`, `year`, `multi-year` | Optional | `month` | The view that the calendar should start in. |
|
|
65
|
+
| `startAt` | `T / null` | Optional | `null` | The moment to open the picker to initially. |
|
|
66
|
+
| `endAt` | `T / null` | Optional | `null` | The the default selected time for range calendar end time |
|
|
67
|
+
| `firstDayOfWeek` | `number` | Optional | `0` | Set the first day of week. Valid value is from 0 to 6. 0: Sunday - 6: Saturday |
|
|
68
|
+
| `showSecondsTimer` | `boolean` | Optional | `false` | When specify it to true, it would show a timer to configure the second's value |
|
|
69
|
+
| `hideOtherMonths` | `boolean` | Optional | `false` | Whether to hide dates in other months at the start or end of the current month |
|
|
70
|
+
| `hour12Timer` | `boolean` | Optional | `false` | When specify it to true, the timer would be in hour12 format mode |
|
|
71
|
+
| `stepHour` | `number` | Optional | `1` | Hours to change per step. |
|
|
72
|
+
| `stepMinute` | `number` | Optional | `1` | Minutes to change per step. |
|
|
73
|
+
| `stepSecond` | `number` | Optional | `1` | Seconds to change per step. |
|
|
74
|
+
| `disabled` | `boolean` | Optional | `false` | When specify to true, it would disable the picker. |
|
|
75
|
+
| `owlDateTimeFilter` | `( date: T)=>boolean ` | Optional | `null` | A function to filter date time. |
|
|
76
|
+
| `min` | `<T>` | Optional | `null` | The minimum valid date time. |
|
|
77
|
+
| `max` | `<T>` | Optional | `null` | The maximum valid date time. |
|
|
78
|
+
| `selectMode` | `single`, `range`, `rangeFrom`, `rangeTo` | Optional | `single` | Specify the picker's select mode. `single`: a single value allowed, `range`: allow users to select a range of date-time, `rangeFrom`: the input would only show the 'from' value and the picker could only selects 'from' value, `rangeTo`: the input would only show the 'to' value and the picker could only selects 'to' value. |
|
|
79
|
+
|
|
80
|
+
> [!NOTE]
|
|
81
|
+
> There are more expored / usable components in the [previous implementation](https://github.com/danielmoncada/date-time-picker).
|
|
82
|
+
> In order to improve simplicity and reusability, these components (while still in the bundle as of version 18.x)
|
|
83
|
+
> are not recommended to be used anymore.
|
|
84
|
+
|
|
85
|
+
## Localization and DateTime Format
|
|
86
|
+
|
|
87
|
+
Localization for different languages and formats is defined by `OWL_DATE_TIME_LOCALE` and `OWL_DATE_TIME_FORMATS`.
|
|
88
|
+
You could learn more about this from [here](https://danielykpan.github.io/date-time-picker#locale-formats).
|
|
89
|
+
|
|
90
|
+
## License
|
|
91
|
+
|
|
92
|
+
- License: MIT
|
|
93
|
+
|
|
94
|
+
## Author
|
|
95
|
+
|
|
96
|
+
Maintained by NetWin, based on the awesome work from Daniel Moncada and Daniel Pan.
|
|
97
|
+
The original repo is still active, go check it out [here](https://github.com/danielmoncada/date-time-picker).
|
|
@@ -239,10 +239,10 @@ export class NativeDateTimeAdapter extends DateTimeAdapter {
|
|
|
239
239
|
const d = new Date(Date.UTC(date.getFullYear(), date.getMonth(), date.getDate(), date.getHours(), date.getMinutes(), date.getSeconds(), date.getMilliseconds()));
|
|
240
240
|
return dtf.format(d);
|
|
241
241
|
}
|
|
242
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.
|
|
243
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.
|
|
242
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: NativeDateTimeAdapter, deps: [{ token: OWL_DATE_TIME_LOCALE, optional: true }, { token: i1.Platform }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
243
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: NativeDateTimeAdapter }); }
|
|
244
244
|
}
|
|
245
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.
|
|
245
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: NativeDateTimeAdapter, decorators: [{
|
|
246
246
|
type: Injectable
|
|
247
247
|
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
248
248
|
type: Optional
|
|
@@ -9,11 +9,11 @@ import { NativeDateTimeAdapter } from './native-date-time-adapter.class';
|
|
|
9
9
|
import { OWL_NATIVE_DATE_TIME_FORMATS } from './native-date-time-format.class';
|
|
10
10
|
import * as i0 from "@angular/core";
|
|
11
11
|
export class NativeDateTimeModule {
|
|
12
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.
|
|
13
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.
|
|
14
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.
|
|
12
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: NativeDateTimeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
13
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.8", ngImport: i0, type: NativeDateTimeModule, imports: [PlatformModule] }); }
|
|
14
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: NativeDateTimeModule, providers: [{ provide: DateTimeAdapter, useClass: NativeDateTimeAdapter }], imports: [PlatformModule] }); }
|
|
15
15
|
}
|
|
16
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.
|
|
16
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: NativeDateTimeModule, decorators: [{
|
|
17
17
|
type: NgModule,
|
|
18
18
|
args: [{
|
|
19
19
|
imports: [PlatformModule],
|
|
@@ -21,16 +21,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.7", ngImpor
|
|
|
21
21
|
}]
|
|
22
22
|
}] });
|
|
23
23
|
export class OwlNativeDateTimeModule {
|
|
24
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.
|
|
25
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.
|
|
26
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.
|
|
24
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: OwlNativeDateTimeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
25
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.8", ngImport: i0, type: OwlNativeDateTimeModule, imports: [NativeDateTimeModule] }); }
|
|
26
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: OwlNativeDateTimeModule, providers: [
|
|
27
27
|
{
|
|
28
28
|
provide: OWL_DATE_TIME_FORMATS,
|
|
29
29
|
useValue: OWL_NATIVE_DATE_TIME_FORMATS
|
|
30
30
|
}
|
|
31
31
|
], imports: [NativeDateTimeModule] }); }
|
|
32
32
|
}
|
|
33
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.
|
|
33
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: OwlNativeDateTimeModule, decorators: [{
|
|
34
34
|
type: NgModule,
|
|
35
35
|
args: [{
|
|
36
36
|
imports: [NativeDateTimeModule],
|
|
@@ -214,10 +214,10 @@ export class UnixTimestampDateTimeAdapter extends DateTimeAdapter {
|
|
|
214
214
|
toIso8601(date) {
|
|
215
215
|
return new Date(date).toISOString();
|
|
216
216
|
}
|
|
217
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.
|
|
218
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.
|
|
217
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: UnixTimestampDateTimeAdapter, deps: [{ token: OWL_DATE_TIME_LOCALE, optional: true }, { token: i1.Platform }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
218
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: UnixTimestampDateTimeAdapter }); }
|
|
219
219
|
}
|
|
220
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.
|
|
220
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: UnixTimestampDateTimeAdapter, decorators: [{
|
|
221
221
|
type: Injectable
|
|
222
222
|
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
223
223
|
type: Optional
|
|
@@ -118,10 +118,10 @@ export class OwlCalendarBodyComponent {
|
|
|
118
118
|
});
|
|
119
119
|
});
|
|
120
120
|
}
|
|
121
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.
|
|
122
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.
|
|
121
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: OwlCalendarBodyComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
122
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: OwlCalendarBodyComponent, selector: "[owl-date-time-calendar-body]", inputs: { activeCell: "activeCell", rows: "rows", numCols: "numCols", cellRatio: "cellRatio", todayValue: "todayValue", selectedValues: "selectedValues", selectMode: "selectMode" }, outputs: { select: "select" }, host: { properties: { "class.owl-dt-calendar-body": "owlDTCalendarBodyClass" } }, exportAs: ["owlDateTimeCalendarBody"], ngImport: i0, template: "<tr\n *ngFor=\"let row of rows; let rowIndex = index\"\n role=\"row\">\n <td\n *ngFor=\"let item of row; let colIndex = index\"\n [attr.aria-current]=\"item.value === todayValue ? 'date' : null\"\n [attr.aria-disabled]=\"!item.enabled || null\"\n [attr.aria-label]=\"item.ariaLabel\"\n [attr.aria-selected]=\"isSelected(item.value)\"\n class=\"owl-dt-calendar-cell {{ item.cellClass }}\"\n [class.owl-dt-calendar-cell-active]=\"isActiveCell(rowIndex, colIndex)\"\n [class.owl-dt-calendar-cell-disabled]=\"!item.enabled\"\n [class.owl-dt-calendar-cell-in-range]=\"isInRange(item.value)\"\n [class.owl-dt-calendar-cell-range-from]=\"isRangeFrom(item.value)\"\n [class.owl-dt-calendar-cell-range-to]=\"isRangeTo(item.value)\"\n [style.paddingBottom.%]=\"(50 * cellRatio) / numCols\"\n [style.paddingTop.%]=\"(50 * cellRatio) / numCols\"\n [style.width.%]=\"100 / numCols\"\n [tabindex]=\"isActiveCell(rowIndex, colIndex) ? 0 : -1\"\n (click)=\"selectCell(item)\">\n <span\n [ngClass]=\"{\n 'owl-dt-calendar-cell-out': item.out,\n 'owl-dt-calendar-cell-today': item.value === todayValue,\n 'owl-dt-calendar-cell-selected': isSelected(item.value)\n }\"\n class=\"owl-dt-calendar-cell-content\">\n {{ item.displayValue }}\n </span>\n </td>\n</tr>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
123
123
|
}
|
|
124
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.
|
|
124
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: OwlCalendarBodyComponent, decorators: [{
|
|
125
125
|
type: Component,
|
|
126
126
|
args: [{ selector: '[owl-date-time-calendar-body]', exportAs: 'owlDateTimeCalendarBody', host: {
|
|
127
127
|
'[class.owl-dt-calendar-body]': 'owlDTCalendarBodyClass'
|
|
@@ -390,10 +390,10 @@ export class OwlMonthViewComponent {
|
|
|
390
390
|
focusActiveCell() {
|
|
391
391
|
this.calendarBodyElm.focusActiveCell();
|
|
392
392
|
}
|
|
393
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.
|
|
394
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.
|
|
393
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: OwlMonthViewComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.DateTimeAdapter, optional: true }, { token: OWL_DATE_TIME_FORMATS, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
394
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: OwlMonthViewComponent, selector: "owl-date-time-month-view", inputs: { hideOtherMonths: "hideOtherMonths", firstDayOfWeek: "firstDayOfWeek", selectMode: "selectMode", selected: "selected", selecteds: "selecteds", pickerMoment: "pickerMoment", dateFilter: "dateFilter", minDate: "minDate", maxDate: "maxDate" }, outputs: { selectedChange: "selectedChange", userSelection: "userSelection", pickerMomentChange: "pickerMomentChange" }, host: { properties: { "class.owl-dt-calendar-view": "owlDTCalendarView" } }, viewQueries: [{ propertyName: "calendarBodyElm", first: true, predicate: OwlCalendarBodyComponent, descendants: true, static: true }], exportAs: ["owlYearView"], ngImport: i0, template: "<table\n [class.owl-dt-calendar-only-current-month]=\"hideOtherMonths\"\n class=\"owl-dt-calendar-table owl-dt-calendar-month-table\">\n <thead class=\"owl-dt-calendar-header\">\n <tr class=\"owl-dt-weekdays\">\n <th\n *ngFor=\"let weekday of weekdays\"\n [attr.aria-label]=\"weekday.long\"\n class=\"owl-dt-weekday\"\n scope=\"col\">\n <span>{{ weekday.short }}</span>\n </th>\n </tr>\n <tr>\n <th\n aria-hidden=\"true\"\n class=\"owl-dt-calendar-table-divider\"\n colspan=\"7\"></th>\n </tr>\n </thead>\n <tbody\n [activeCell]=\"activeCell\"\n [rows]=\"days\"\n [selectMode]=\"selectMode\"\n [selectedValues]=\"selectedDates\"\n [todayValue]=\"todayDate\"\n (keydown)=\"handleCalendarKeydown($event)\"\n (select)=\"selectCalendarCell($event)\"\n owl-date-time-calendar-body\n role=\"grid\"></tbody>\n</table>\n", styles: [""], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i3.OwlCalendarBodyComponent, selector: "[owl-date-time-calendar-body]", inputs: ["activeCell", "rows", "numCols", "cellRatio", "todayValue", "selectedValues", "selectMode"], outputs: ["select"], exportAs: ["owlDateTimeCalendarBody"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
395
395
|
}
|
|
396
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.
|
|
396
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: OwlMonthViewComponent, decorators: [{
|
|
397
397
|
type: Component,
|
|
398
398
|
args: [{ selector: 'owl-date-time-month-view', exportAs: 'owlYearView', host: {
|
|
399
399
|
'[class.owl-dt-calendar-view]': 'owlDTCalendarView'
|