iss-ctrl 0.0.21 → 0.0.23
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 +33 -0
- package/fesm2022/iss-ctrl-attachment.viewer-DVUL39xd.mjs +110 -0
- package/fesm2022/iss-ctrl-attachment.viewer-DVUL39xd.mjs.map +1 -0
- package/fesm2022/iss-ctrl-base.mjs +682 -0
- package/fesm2022/iss-ctrl-base.mjs.map +1 -0
- package/fesm2022/iss-ctrl-checkbox.field-CILXADas.mjs +88 -0
- package/fesm2022/iss-ctrl-checkbox.field-CILXADas.mjs.map +1 -0
- package/fesm2022/iss-ctrl-checkbox.mjs +146 -0
- package/fesm2022/iss-ctrl-checkbox.mjs.map +1 -0
- package/fesm2022/iss-ctrl-checkbox.viewer-C3SEUszR.mjs +31 -0
- package/fesm2022/iss-ctrl-checkbox.viewer-C3SEUszR.mjs.map +1 -0
- package/fesm2022/iss-ctrl-chips.field-445Ds3V7.mjs +76 -0
- package/fesm2022/iss-ctrl-chips.field-445Ds3V7.mjs.map +1 -0
- package/fesm2022/iss-ctrl-chips.mjs +168 -0
- package/fesm2022/iss-ctrl-chips.mjs.map +1 -0
- package/fesm2022/iss-ctrl-chips.viewer-BcKT2hcq.mjs +38 -0
- package/fesm2022/iss-ctrl-chips.viewer-BcKT2hcq.mjs.map +1 -0
- package/fesm2022/iss-ctrl-date-picker.field-Djhh1FsR.mjs +98 -0
- package/fesm2022/iss-ctrl-date-picker.field-Djhh1FsR.mjs.map +1 -0
- package/fesm2022/iss-ctrl-date-picker.mjs +200 -0
- package/fesm2022/iss-ctrl-date-picker.mjs.map +1 -0
- package/fesm2022/iss-ctrl-date-picker.viewer-Dsmsf91t.mjs +40 -0
- package/fesm2022/iss-ctrl-date-picker.viewer-Dsmsf91t.mjs.map +1 -0
- package/fesm2022/iss-ctrl-date-range-picker.field-Dv636SAm.mjs +97 -0
- package/fesm2022/iss-ctrl-date-range-picker.field-Dv636SAm.mjs.map +1 -0
- package/fesm2022/iss-ctrl-date-range-picker.mjs +307 -0
- package/fesm2022/iss-ctrl-date-range-picker.mjs.map +1 -0
- package/fesm2022/iss-ctrl-date-range-picker.viewer-tmTQGPFh.mjs +41 -0
- package/fesm2022/iss-ctrl-date-range-picker.viewer-tmTQGPFh.mjs.map +1 -0
- package/fesm2022/iss-ctrl-datetime-picker.field-DldY8vke.mjs +98 -0
- package/fesm2022/iss-ctrl-datetime-picker.field-DldY8vke.mjs.map +1 -0
- package/fesm2022/iss-ctrl-datetime-picker.mjs +226 -0
- package/fesm2022/iss-ctrl-datetime-picker.mjs.map +1 -0
- package/fesm2022/iss-ctrl-datetime-picker.viewer-BeUyEBKo.mjs +42 -0
- package/fesm2022/iss-ctrl-datetime-picker.viewer-BeUyEBKo.mjs.map +1 -0
- package/fesm2022/iss-ctrl-dropdownlist.field-DikBAtc_.mjs +87 -0
- package/fesm2022/iss-ctrl-dropdownlist.field-DikBAtc_.mjs.map +1 -0
- package/fesm2022/iss-ctrl-dropdownlist.mjs +398 -0
- package/fesm2022/iss-ctrl-dropdownlist.mjs.map +1 -0
- package/fesm2022/iss-ctrl-dropdownlist.viewer-OWJxDpr8.mjs +30 -0
- package/fesm2022/iss-ctrl-dropdownlist.viewer-OWJxDpr8.mjs.map +1 -0
- package/fesm2022/iss-ctrl-file-picker.field-BMZaJxvj.mjs +210 -0
- package/fesm2022/iss-ctrl-file-picker.field-BMZaJxvj.mjs.map +1 -0
- package/fesm2022/iss-ctrl-file-picker.mjs +274 -0
- package/fesm2022/iss-ctrl-file-picker.mjs.map +1 -0
- package/fesm2022/iss-ctrl-input.field-BiwBFYx3.mjs +104 -0
- package/fesm2022/iss-ctrl-input.field-BiwBFYx3.mjs.map +1 -0
- package/fesm2022/iss-ctrl-input.mjs +204 -0
- package/fesm2022/iss-ctrl-input.mjs.map +1 -0
- package/fesm2022/iss-ctrl-input.viewer-BOZnW0_e.mjs +22 -0
- package/fesm2022/iss-ctrl-input.viewer-BOZnW0_e.mjs.map +1 -0
- package/fesm2022/iss-ctrl-iss-ctrl-BG-QWWdq.mjs +1770 -0
- package/fesm2022/iss-ctrl-iss-ctrl-BG-QWWdq.mjs.map +1 -0
- package/fesm2022/{iss-ctrl-load-event-bOt6IlIo.mjs → iss-ctrl-load-event-T4L3k9XO.mjs} +4 -3
- package/fesm2022/iss-ctrl-load-event-T4L3k9XO.mjs.map +1 -0
- package/fesm2022/{iss-ctrl-load-options-event-CxyAyNMe.mjs → iss-ctrl-load-options-event-tG258cbP.mjs} +3 -3
- package/fesm2022/{iss-ctrl-load-options-event-CxyAyNMe.mjs.map → iss-ctrl-load-options-event-tG258cbP.mjs.map} +1 -1
- package/fesm2022/{iss-ctrl-load-value-event-DJKJ5S3h.mjs → iss-ctrl-load-value-event--7zt90Dl.mjs} +3 -3
- package/fesm2022/{iss-ctrl-load-value-event-DJKJ5S3h.mjs.map → iss-ctrl-load-value-event--7zt90Dl.mjs.map} +1 -1
- package/fesm2022/iss-ctrl-mobile.field-DLccnWKX.mjs +77 -0
- package/fesm2022/iss-ctrl-mobile.field-DLccnWKX.mjs.map +1 -0
- package/fesm2022/iss-ctrl-mobile.mjs +2465 -0
- package/fesm2022/iss-ctrl-mobile.mjs.map +1 -0
- package/fesm2022/iss-ctrl-mobile.viewer-DQgxAcR-.mjs +22 -0
- package/fesm2022/iss-ctrl-mobile.viewer-DQgxAcR-.mjs.map +1 -0
- package/fesm2022/{iss-ctrl-note.field-B_Lbp28X.mjs → iss-ctrl-note.field-CT1wVmfF.mjs} +2 -2
- package/fesm2022/{iss-ctrl-note.field-B_Lbp28X.mjs.map → iss-ctrl-note.field-CT1wVmfF.mjs.map} +1 -1
- package/fesm2022/iss-ctrl-plate.field-CQQY8rnE.mjs +92 -0
- package/fesm2022/iss-ctrl-plate.field-CQQY8rnE.mjs.map +1 -0
- package/fesm2022/iss-ctrl-plate.mjs +493 -0
- package/fesm2022/iss-ctrl-plate.mjs.map +1 -0
- package/fesm2022/iss-ctrl-plate.viewer-B8PUBLH8.mjs +179 -0
- package/fesm2022/iss-ctrl-plate.viewer-B8PUBLH8.mjs.map +1 -0
- package/fesm2022/iss-ctrl-radio.field-Dp5D-AXQ.mjs +88 -0
- package/fesm2022/iss-ctrl-radio.field-Dp5D-AXQ.mjs.map +1 -0
- package/fesm2022/iss-ctrl-radio.mjs +104 -0
- package/fesm2022/iss-ctrl-radio.mjs.map +1 -0
- package/fesm2022/iss-ctrl-radio.viewer-EiDliZro.mjs +30 -0
- package/fesm2022/iss-ctrl-radio.viewer-EiDliZro.mjs.map +1 -0
- package/fesm2022/{iss-ctrl-replace-api-keys-C0XYQW4i.mjs → iss-ctrl-replace-api-keys-COUv4Kin.mjs} +2 -2
- package/fesm2022/{iss-ctrl-replace-api-keys-C0XYQW4i.mjs.map → iss-ctrl-replace-api-keys-COUv4Kin.mjs.map} +1 -1
- package/fesm2022/{iss-ctrl-set-value-event-CgXhi0Bv.mjs → iss-ctrl-set-value-event-D0-_qIyS.mjs} +2 -2
- package/fesm2022/{iss-ctrl-set-value-event-CgXhi0Bv.mjs.map → iss-ctrl-set-value-event-D0-_qIyS.mjs.map} +1 -1
- package/fesm2022/iss-ctrl-slide-toggle.field-vCJHOiSG.mjs +85 -0
- package/fesm2022/iss-ctrl-slide-toggle.field-vCJHOiSG.mjs.map +1 -0
- package/fesm2022/iss-ctrl-slide-toggle.mjs +66 -0
- package/fesm2022/iss-ctrl-slide-toggle.mjs.map +1 -0
- package/fesm2022/iss-ctrl-slide-toggle.viewer-hsIHwDj3.mjs +34 -0
- package/fesm2022/iss-ctrl-slide-toggle.viewer-hsIHwDj3.mjs.map +1 -0
- package/fesm2022/{iss-ctrl-table.field-B5FxF6hn.mjs → iss-ctrl-table.field-DdFjH-D8.mjs} +142 -140
- package/fesm2022/iss-ctrl-table.field-DdFjH-D8.mjs.map +1 -0
- package/fesm2022/iss-ctrl-textarea.field-Dqhhu2m4.mjs +82 -0
- package/fesm2022/iss-ctrl-textarea.field-Dqhhu2m4.mjs.map +1 -0
- package/fesm2022/iss-ctrl-textarea.mjs +115 -0
- package/fesm2022/iss-ctrl-textarea.mjs.map +1 -0
- package/fesm2022/iss-ctrl-textarea.viewer-CpmLauik.mjs +22 -0
- package/fesm2022/iss-ctrl-textarea.viewer-CpmLauik.mjs.map +1 -0
- package/fesm2022/iss-ctrl-time-picker.field-CdmxRiH8.mjs +77 -0
- package/fesm2022/iss-ctrl-time-picker.field-CdmxRiH8.mjs.map +1 -0
- package/fesm2022/iss-ctrl-time-picker.mjs +170 -0
- package/fesm2022/iss-ctrl-time-picker.mjs.map +1 -0
- package/fesm2022/iss-ctrl-time-picker.viewer-CJeFLrdI.mjs +22 -0
- package/fesm2022/iss-ctrl-time-picker.viewer-CJeFLrdI.mjs.map +1 -0
- package/fesm2022/iss-ctrl-toggle-button.field-rAT7dVFC.mjs +101 -0
- package/fesm2022/iss-ctrl-toggle-button.field-rAT7dVFC.mjs.map +1 -0
- package/fesm2022/iss-ctrl-toggle-button.mjs +158 -0
- package/fesm2022/iss-ctrl-toggle-button.mjs.map +1 -0
- package/fesm2022/iss-ctrl-toggle-button.viewer-CC-8_Dy4.mjs +30 -0
- package/fesm2022/iss-ctrl-toggle-button.viewer-CC-8_Dy4.mjs.map +1 -0
- package/fesm2022/iss-ctrl-tokens.mjs +25 -0
- package/fesm2022/iss-ctrl-tokens.mjs.map +1 -0
- package/fesm2022/{iss-ctrl-trigger-based-on-json-value-2v1kLVHZ.mjs → iss-ctrl-trigger-based-on-json-value-I92SNsv9.mjs} +2 -2
- package/fesm2022/{iss-ctrl-trigger-based-on-json-value-2v1kLVHZ.mjs.map → iss-ctrl-trigger-based-on-json-value-I92SNsv9.mjs.map} +1 -1
- package/fesm2022/{iss-ctrl-user-picker.field-BH63sZ-X.mjs → iss-ctrl-user-picker.field-DpmYCfpD.mjs} +154 -153
- package/fesm2022/iss-ctrl-user-picker.field-DpmYCfpD.mjs.map +1 -0
- package/fesm2022/iss-ctrl.mjs +3 -1
- package/fesm2022/iss-ctrl.mjs.map +1 -1
- package/package.json +69 -1
- package/types/iss-ctrl-base.d.ts +318 -0
- package/types/iss-ctrl-checkbox.d.ts +46 -0
- package/types/iss-ctrl-chips.d.ts +41 -0
- package/types/iss-ctrl-date-picker.d.ts +75 -0
- package/types/iss-ctrl-date-range-picker.d.ts +95 -0
- package/types/iss-ctrl-datetime-picker.d.ts +77 -0
- package/types/iss-ctrl-dropdownlist.d.ts +78 -0
- package/types/iss-ctrl-file-picker.d.ts +95 -0
- package/types/iss-ctrl-input.d.ts +76 -0
- package/types/iss-ctrl-mobile.d.ts +91 -0
- package/types/iss-ctrl-plate.d.ts +54 -0
- package/types/iss-ctrl-radio.d.ts +34 -0
- package/types/iss-ctrl-slide-toggle.d.ts +26 -0
- package/types/iss-ctrl-textarea.d.ts +30 -0
- package/types/iss-ctrl-time-picker.d.ts +48 -0
- package/types/iss-ctrl-toggle-button.d.ts +41 -0
- package/types/iss-ctrl-tokens.d.ts +21 -0
- package/types/iss-ctrl.d.ts +303 -2005
- package/fesm2022/iss-ctrl-iss-ctrl-BKu6a5HF.mjs +0 -9683
- package/fesm2022/iss-ctrl-iss-ctrl-BKu6a5HF.mjs.map +0 -1
- package/fesm2022/iss-ctrl-load-event-bOt6IlIo.mjs.map +0 -1
- package/fesm2022/iss-ctrl-table.field-B5FxF6hn.mjs.map +0 -1
- package/fesm2022/iss-ctrl-user-picker.field-BH63sZ-X.mjs.map +0 -1
|
@@ -0,0 +1,226 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { input, Component } from '@angular/core';
|
|
3
|
+
import * as i1 from '@angular/forms';
|
|
4
|
+
import { FormGroup, FormControl, ReactiveFormsModule, NG_VALUE_ACCESSOR, NG_VALIDATORS } from '@angular/forms';
|
|
5
|
+
import { MatDatepickerModule } from '@angular/material/datepicker';
|
|
6
|
+
import { MatFormFieldModule } from '@angular/material/form-field';
|
|
7
|
+
import { MatInputModule } from '@angular/material/input';
|
|
8
|
+
import { MatTimepickerModule } from '@angular/material/timepicker';
|
|
9
|
+
import { format } from 'date-fns';
|
|
10
|
+
import { ControlBase } from 'iss-ctrl/base';
|
|
11
|
+
import { DatePickerControl } from 'iss-ctrl/date-picker';
|
|
12
|
+
import { TimePickerControl } from 'iss-ctrl/time-picker';
|
|
13
|
+
|
|
14
|
+
/**
|
|
15
|
+
* `<iss-ctrl-datetime-picker>` — a date and a time in a single field.
|
|
16
|
+
*
|
|
17
|
+
* Combines the calendar of the date picker with the time list of the time picker; both parts
|
|
18
|
+
* must be set before a value is emitted.
|
|
19
|
+
*
|
|
20
|
+
* @example
|
|
21
|
+
* ```html
|
|
22
|
+
* <iss-ctrl-datetime-picker formControlName="scheduledAt" [minDate]="today" minTime="08:00" maxTime="17:00">
|
|
23
|
+
* <label>Scheduled at</label>
|
|
24
|
+
* </iss-ctrl-datetime-picker>
|
|
25
|
+
* ```
|
|
26
|
+
*
|
|
27
|
+
* ### Own inputs
|
|
28
|
+
* | Property | Type | Default | Description |
|
|
29
|
+
* | --- | --- | --- | --- |
|
|
30
|
+
* | `minDate` | `Date \| null` | `null` | Earliest selectable date. |
|
|
31
|
+
* | `maxDate` | `Date \| null` | `null` | Latest selectable date. |
|
|
32
|
+
* | `minTime` | `string \| null` | `null` | Earliest selectable time, `HH:mm`. |
|
|
33
|
+
* | `maxTime` | `string \| null` | `null` | Latest selectable time, `HH:mm`. |
|
|
34
|
+
* | `disabledDays` | `number[]` | `[]` | Week days to block, `0` = Sunday … `6` = Saturday. |
|
|
35
|
+
* | `hijriCalendar` | `boolean` | `false` | Shows an Umm al-Qura Hijri calendar; the value stays Gregorian. |
|
|
36
|
+
* | `emitHijri` | `boolean` | `false` | Emits the date half as a Hijri date. Implies `hijriCalendar`. |
|
|
37
|
+
*
|
|
38
|
+
* ### Hijri dates
|
|
39
|
+
* Both flags are handed straight to the inner date picker; the time half is untouched, so a
|
|
40
|
+
* Hijri value reads `1447-03-15T09:30:00`.
|
|
41
|
+
*
|
|
42
|
+
* ### Inherited from {@link ControlBase}
|
|
43
|
+
* `formControlName` · `readonly` · `className` · `(onChange)`
|
|
44
|
+
*
|
|
45
|
+
* Projects `<label>` into the floating label; omit it to render the control without one.
|
|
46
|
+
*/
|
|
47
|
+
class DatetimePickerControl extends ControlBase {
|
|
48
|
+
datetimeForm = new FormGroup({
|
|
49
|
+
date: new FormControl(null),
|
|
50
|
+
time: new FormControl(null),
|
|
51
|
+
});
|
|
52
|
+
/**
|
|
53
|
+
* Week days that cannot be selected — `0` is Sunday through `6` for Saturday.
|
|
54
|
+
*/
|
|
55
|
+
disabledDays = input([], ...(ngDevMode ? [{ debugName: "disabledDays" }] : /* istanbul ignore next */ []));
|
|
56
|
+
/**
|
|
57
|
+
* Earliest selectable date.
|
|
58
|
+
*/
|
|
59
|
+
minDate = input(null, ...(ngDevMode ? [{ debugName: "minDate" }] : /* istanbul ignore next */ []));
|
|
60
|
+
/**
|
|
61
|
+
* Latest selectable date.
|
|
62
|
+
*/
|
|
63
|
+
maxDate = input(null, ...(ngDevMode ? [{ debugName: "maxDate" }] : /* istanbul ignore next */ []));
|
|
64
|
+
/**
|
|
65
|
+
* Earliest selectable time of day, as `HH:mm`.
|
|
66
|
+
*/
|
|
67
|
+
minTime = input(null, ...(ngDevMode ? [{ debugName: "minTime" }] : /* istanbul ignore next */ []));
|
|
68
|
+
/**
|
|
69
|
+
* Latest selectable time of day, as `HH:mm`.
|
|
70
|
+
*/
|
|
71
|
+
maxTime = input(null, ...(ngDevMode ? [{ debugName: "maxTime" }] : /* istanbul ignore next */ []));
|
|
72
|
+
/**
|
|
73
|
+
* Renders the calendar as an Umm al-Qura Hijri calendar, leaving the emitted date Gregorian.
|
|
74
|
+
*/
|
|
75
|
+
hijriCalendar = input(false, ...(ngDevMode ? [{ debugName: "hijriCalendar" }] : /* istanbul ignore next */ []));
|
|
76
|
+
/**
|
|
77
|
+
* Emits the date half of the value as a Hijri date. Implies {@link hijriCalendar}.
|
|
78
|
+
*/
|
|
79
|
+
emitHijri = input(false, ...(ngDevMode ? [{ debugName: "emitHijri" }] : /* istanbul ignore next */ []));
|
|
80
|
+
setDisabledState(isDisabled) {
|
|
81
|
+
super.setDisabledState(isDisabled);
|
|
82
|
+
// the template binds `datetimeForm`, disabling ctrl alone leaves the pickers live
|
|
83
|
+
if (isDisabled) {
|
|
84
|
+
this.datetimeForm.disable({ emitEvent: false });
|
|
85
|
+
}
|
|
86
|
+
else {
|
|
87
|
+
this.datetimeForm.enable({ emitEvent: false });
|
|
88
|
+
}
|
|
89
|
+
}
|
|
90
|
+
emit() {
|
|
91
|
+
if (this.readonly()) {
|
|
92
|
+
return;
|
|
93
|
+
}
|
|
94
|
+
const datetimeStr = this.#stringifyDateTime(this.datetimeForm.getRawValue());
|
|
95
|
+
this.propagateValue(datetimeStr);
|
|
96
|
+
this.emitOnChangeEvent(datetimeStr);
|
|
97
|
+
}
|
|
98
|
+
writeValue(value) {
|
|
99
|
+
this.datetimeForm.patchValue({
|
|
100
|
+
date: this.#stringifyDate(value),
|
|
101
|
+
time: this.#stringifyTime(value),
|
|
102
|
+
});
|
|
103
|
+
}
|
|
104
|
+
#stringifyDateTime(datetime) {
|
|
105
|
+
if (!datetime) {
|
|
106
|
+
return undefined;
|
|
107
|
+
}
|
|
108
|
+
if (this.#stringifyDate(datetime) && this.#stringifyTime(datetime)) {
|
|
109
|
+
return `${this.#stringifyDate(datetime)}T${this.#stringifyTime(datetime)}`;
|
|
110
|
+
}
|
|
111
|
+
return undefined;
|
|
112
|
+
}
|
|
113
|
+
#stringifyDate(datetime) {
|
|
114
|
+
if (!datetime) {
|
|
115
|
+
return undefined;
|
|
116
|
+
}
|
|
117
|
+
if (datetime.date && typeof datetime.date === "string") {
|
|
118
|
+
return `${datetime.date.split("T")[0]}`;
|
|
119
|
+
}
|
|
120
|
+
const date = new Date(datetime);
|
|
121
|
+
if (!Number.isNaN(date.getTime())) {
|
|
122
|
+
return format(datetime, "yyyy-MM-dd");
|
|
123
|
+
}
|
|
124
|
+
return undefined;
|
|
125
|
+
}
|
|
126
|
+
#stringifyTime(datetime) {
|
|
127
|
+
if (!datetime) {
|
|
128
|
+
return undefined;
|
|
129
|
+
}
|
|
130
|
+
if (datetime.time && typeof datetime.time === "string") {
|
|
131
|
+
return `${datetime.time}`;
|
|
132
|
+
}
|
|
133
|
+
const date = new Date(datetime);
|
|
134
|
+
if (!Number.isNaN(date.getTime())) {
|
|
135
|
+
return format(datetime, "HH:mm:ss");
|
|
136
|
+
}
|
|
137
|
+
return undefined;
|
|
138
|
+
}
|
|
139
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DatetimePickerControl, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
140
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.9", type: DatetimePickerControl, isStandalone: true, selector: "iss-ctrl-datetime-picker", inputs: { disabledDays: { classPropertyName: "disabledDays", publicName: "disabledDays", isSignal: true, isRequired: false, transformFunction: null }, minDate: { classPropertyName: "minDate", publicName: "minDate", isSignal: true, isRequired: false, transformFunction: null }, maxDate: { classPropertyName: "maxDate", publicName: "maxDate", isSignal: true, isRequired: false, transformFunction: null }, minTime: { classPropertyName: "minTime", publicName: "minTime", isSignal: true, isRequired: false, transformFunction: null }, maxTime: { classPropertyName: "maxTime", publicName: "maxTime", isSignal: true, isRequired: false, transformFunction: null }, hijriCalendar: { classPropertyName: "hijriCalendar", publicName: "hijriCalendar", isSignal: true, isRequired: false, transformFunction: null }, emitHijri: { classPropertyName: "emitHijri", publicName: "emitHijri", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
|
|
141
|
+
{ provide: NG_VALUE_ACCESSOR, useExisting: DatetimePickerControl, multi: true },
|
|
142
|
+
{ provide: NG_VALIDATORS, useExisting: DatetimePickerControl, multi: true },
|
|
143
|
+
], usesInheritance: true, ngImport: i0, template: `
|
|
144
|
+
<form [formGroup]="datetimeForm" class="d-flex flex-row gap-1">
|
|
145
|
+
<iss-ctrl-date-picker
|
|
146
|
+
(focusout)="markAsTouched()"
|
|
147
|
+
[disabledDays]="disabledDays()"
|
|
148
|
+
[maxDate]="maxDate()"
|
|
149
|
+
[minDate]="minDate()"
|
|
150
|
+
[readonly]="readonly()"
|
|
151
|
+
[hijriCalendar]="hijriCalendar()"
|
|
152
|
+
[emitHijri]="emitHijri()"
|
|
153
|
+
formControlName="date"
|
|
154
|
+
(onChange)="emit()"
|
|
155
|
+
>
|
|
156
|
+
<!-- Re-projected with ngProjectAs so it still matches the date picker's own select="label";
|
|
157
|
+
wrapping it in a second <label> instead would nest one inside the other and defeat the label rule in upgrade.scss. -->
|
|
158
|
+
<ng-content select="label" ngProjectAs="label"></ng-content>
|
|
159
|
+
</iss-ctrl-date-picker>
|
|
160
|
+
<iss-ctrl-time-picker
|
|
161
|
+
(focusout)="markAsTouched()"
|
|
162
|
+
[maxTime]="maxTime()"
|
|
163
|
+
[minTime]="minTime()"
|
|
164
|
+
[readonly]="readonly()"
|
|
165
|
+
formControlName="time"
|
|
166
|
+
(onChange)="emit()"
|
|
167
|
+
/>
|
|
168
|
+
</form>
|
|
169
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: MatTimepickerModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: DatePickerControl, selector: "iss-ctrl-date-picker", inputs: ["disabledDays", "minDate", "maxDate", "hijriCalendar", "emitHijri"] }, { kind: "component", type: TimePickerControl, selector: "iss-ctrl-time-picker", inputs: ["interval", "minTime", "maxTime"] }] });
|
|
170
|
+
}
|
|
171
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DatetimePickerControl, decorators: [{
|
|
172
|
+
type: Component,
|
|
173
|
+
args: [{
|
|
174
|
+
selector: "iss-ctrl-datetime-picker",
|
|
175
|
+
imports: [
|
|
176
|
+
MatFormFieldModule,
|
|
177
|
+
MatInputModule,
|
|
178
|
+
MatTimepickerModule,
|
|
179
|
+
MatDatepickerModule,
|
|
180
|
+
ReactiveFormsModule,
|
|
181
|
+
DatePickerControl,
|
|
182
|
+
TimePickerControl,
|
|
183
|
+
],
|
|
184
|
+
providers: [
|
|
185
|
+
{ provide: NG_VALUE_ACCESSOR, useExisting: DatetimePickerControl, multi: true },
|
|
186
|
+
{ provide: NG_VALIDATORS, useExisting: DatetimePickerControl, multi: true },
|
|
187
|
+
],
|
|
188
|
+
template: `
|
|
189
|
+
<form [formGroup]="datetimeForm" class="d-flex flex-row gap-1">
|
|
190
|
+
<iss-ctrl-date-picker
|
|
191
|
+
(focusout)="markAsTouched()"
|
|
192
|
+
[disabledDays]="disabledDays()"
|
|
193
|
+
[maxDate]="maxDate()"
|
|
194
|
+
[minDate]="minDate()"
|
|
195
|
+
[readonly]="readonly()"
|
|
196
|
+
[hijriCalendar]="hijriCalendar()"
|
|
197
|
+
[emitHijri]="emitHijri()"
|
|
198
|
+
formControlName="date"
|
|
199
|
+
(onChange)="emit()"
|
|
200
|
+
>
|
|
201
|
+
<!-- Re-projected with ngProjectAs so it still matches the date picker's own select="label";
|
|
202
|
+
wrapping it in a second <label> instead would nest one inside the other and defeat the label rule in upgrade.scss. -->
|
|
203
|
+
<ng-content select="label" ngProjectAs="label"></ng-content>
|
|
204
|
+
</iss-ctrl-date-picker>
|
|
205
|
+
<iss-ctrl-time-picker
|
|
206
|
+
(focusout)="markAsTouched()"
|
|
207
|
+
[maxTime]="maxTime()"
|
|
208
|
+
[minTime]="minTime()"
|
|
209
|
+
[readonly]="readonly()"
|
|
210
|
+
formControlName="time"
|
|
211
|
+
(onChange)="emit()"
|
|
212
|
+
/>
|
|
213
|
+
</form>
|
|
214
|
+
`
|
|
215
|
+
}]
|
|
216
|
+
}], propDecorators: { disabledDays: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabledDays", required: false }] }], minDate: [{ type: i0.Input, args: [{ isSignal: true, alias: "minDate", required: false }] }], maxDate: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxDate", required: false }] }], minTime: [{ type: i0.Input, args: [{ isSignal: true, alias: "minTime", required: false }] }], maxTime: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxTime", required: false }] }], hijriCalendar: [{ type: i0.Input, args: [{ isSignal: true, alias: "hijriCalendar", required: false }] }], emitHijri: [{ type: i0.Input, args: [{ isSignal: true, alias: "emitHijri", required: false }] }] } });
|
|
217
|
+
|
|
218
|
+
// The datetime-picker control. Its field and viewer stay in the primary entry point and reach it
|
|
219
|
+
// from there, so the control ships only to an app that renders it or imports it directly.
|
|
220
|
+
|
|
221
|
+
/**
|
|
222
|
+
* Generated bundle index. Do not edit.
|
|
223
|
+
*/
|
|
224
|
+
|
|
225
|
+
export { DatetimePickerControl };
|
|
226
|
+
//# sourceMappingURL=iss-ctrl-datetime-picker.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"iss-ctrl-datetime-picker.mjs","sources":["../../../projects/iss/datetime-picker/src/datetime-picker.control.ts","../../../projects/iss/datetime-picker/src/public-api.ts","../../../projects/iss/datetime-picker/src/iss-ctrl-datetime-picker.ts"],"sourcesContent":["import { Component, input, InputSignal } from \"@angular/core\";\nimport { FormControl, FormGroup, NG_VALIDATORS, NG_VALUE_ACCESSOR, ReactiveFormsModule } from \"@angular/forms\";\nimport { MatDatepickerModule } from \"@angular/material/datepicker\";\nimport { MatFormFieldModule } from \"@angular/material/form-field\";\nimport { MatInputModule } from \"@angular/material/input\";\nimport { MatTimepickerModule } from \"@angular/material/timepicker\";\nimport { format } from \"date-fns\";\nimport { ControlBase } from \"iss-ctrl/base\";\nimport { DatePickerControl } from \"iss-ctrl/date-picker\";\nimport { TimePickerControl } from \"iss-ctrl/time-picker\";\n\n/**\n * `<iss-ctrl-datetime-picker>` — a date and a time in a single field.\n *\n * Combines the calendar of the date picker with the time list of the time picker; both parts\n * must be set before a value is emitted.\n *\n * @example\n * ```html\n * <iss-ctrl-datetime-picker formControlName=\"scheduledAt\" [minDate]=\"today\" minTime=\"08:00\" maxTime=\"17:00\">\n * <label>Scheduled at</label>\n * </iss-ctrl-datetime-picker>\n * ```\n *\n * ### Own inputs\n * | Property | Type | Default | Description |\n * | --- | --- | --- | --- |\n * | `minDate` | `Date \\| null` | `null` | Earliest selectable date. |\n * | `maxDate` | `Date \\| null` | `null` | Latest selectable date. |\n * | `minTime` | `string \\| null` | `null` | Earliest selectable time, `HH:mm`. |\n * | `maxTime` | `string \\| null` | `null` | Latest selectable time, `HH:mm`. |\n * | `disabledDays` | `number[]` | `[]` | Week days to block, `0` = Sunday … `6` = Saturday. |\n * | `hijriCalendar` | `boolean` | `false` | Shows an Umm al-Qura Hijri calendar; the value stays Gregorian. |\n * | `emitHijri` | `boolean` | `false` | Emits the date half as a Hijri date. Implies `hijriCalendar`. |\n *\n * ### Hijri dates\n * Both flags are handed straight to the inner date picker; the time half is untouched, so a\n * Hijri value reads `1447-03-15T09:30:00`.\n *\n * ### Inherited from {@link ControlBase}\n * `formControlName` · `readonly` · `className` · `(onChange)`\n *\n * Projects `<label>` into the floating label; omit it to render the control without one.\n */\n@Component({\n selector: \"iss-ctrl-datetime-picker\",\n imports: [\n MatFormFieldModule,\n MatInputModule,\n MatTimepickerModule,\n MatDatepickerModule,\n ReactiveFormsModule,\n DatePickerControl,\n TimePickerControl,\n ],\n providers: [\n { provide: NG_VALUE_ACCESSOR, useExisting: DatetimePickerControl, multi: true },\n { provide: NG_VALIDATORS, useExisting: DatetimePickerControl, multi: true },\n ],\n template: `\n <form [formGroup]=\"datetimeForm\" class=\"d-flex flex-row gap-1\">\n <iss-ctrl-date-picker\n (focusout)=\"markAsTouched()\"\n [disabledDays]=\"disabledDays()\"\n [maxDate]=\"maxDate()\"\n [minDate]=\"minDate()\"\n [readonly]=\"readonly()\"\n [hijriCalendar]=\"hijriCalendar()\"\n [emitHijri]=\"emitHijri()\"\n formControlName=\"date\"\n (onChange)=\"emit()\"\n >\n <!-- Re-projected with ngProjectAs so it still matches the date picker's own select=\"label\";\n wrapping it in a second <label> instead would nest one inside the other and defeat the label rule in upgrade.scss. -->\n <ng-content select=\"label\" ngProjectAs=\"label\"></ng-content>\n </iss-ctrl-date-picker>\n <iss-ctrl-time-picker\n (focusout)=\"markAsTouched()\"\n [maxTime]=\"maxTime()\"\n [minTime]=\"minTime()\"\n [readonly]=\"readonly()\"\n formControlName=\"time\"\n (onChange)=\"emit()\"\n />\n </form>\n `\n})\nexport class DatetimePickerControl extends ControlBase {\n datetimeForm: FormGroup = new FormGroup({\n date: new FormControl(null),\n time: new FormControl(null),\n });\n /**\n * Week days that cannot be selected — `0` is Sunday through `6` for Saturday.\n */\n disabledDays: InputSignal<number[]> = input<number[]>([]);\n /**\n * Earliest selectable date.\n */\n minDate: InputSignal<Date | null> = input<Date | null>(null);\n /**\n * Latest selectable date.\n */\n maxDate: InputSignal<Date | null> = input<Date | null>(null);\n /**\n * Earliest selectable time of day, as `HH:mm`.\n */\n minTime: InputSignal<string | null> = input<string | null>(null);\n /**\n * Latest selectable time of day, as `HH:mm`.\n */\n maxTime: InputSignal<string | null> = input<string | null>(null);\n /**\n * Renders the calendar as an Umm al-Qura Hijri calendar, leaving the emitted date Gregorian.\n */\n hijriCalendar: InputSignal<boolean> = input(false);\n /**\n * Emits the date half of the value as a Hijri date. Implies {@link hijriCalendar}.\n */\n emitHijri: InputSignal<boolean> = input(false);\n\n override setDisabledState(isDisabled: boolean): void {\n super.setDisabledState(isDisabled);\n // the template binds `datetimeForm`, disabling ctrl alone leaves the pickers live\n if (isDisabled) {\n this.datetimeForm.disable({ emitEvent: false });\n } else {\n this.datetimeForm.enable({ emitEvent: false });\n }\n }\n\n emit() {\n if (this.readonly()) {\n return;\n }\n const datetimeStr = this.#stringifyDateTime(this.datetimeForm.getRawValue());\n this.propagateValue(datetimeStr);\n this.emitOnChangeEvent(datetimeStr);\n }\n\n override writeValue(value: string | Date | null) {\n this.datetimeForm.patchValue({\n date: this.#stringifyDate(value),\n time: this.#stringifyTime(value),\n });\n }\n\n #stringifyDateTime(datetime: any): string | undefined {\n if (!datetime) {\n return undefined;\n }\n if (this.#stringifyDate(datetime) && this.#stringifyTime(datetime)) {\n return `${this.#stringifyDate(datetime)}T${this.#stringifyTime(datetime)}`;\n }\n return undefined;\n }\n\n #stringifyDate(datetime: any) {\n if (!datetime) {\n return undefined;\n }\n\n if (datetime.date && typeof datetime.date === \"string\") {\n return `${datetime.date.split(\"T\")[0]}`;\n }\n\n const date = new Date(datetime);\n if (!Number.isNaN(date.getTime())) {\n return format(datetime, \"yyyy-MM-dd\");\n }\n return undefined;\n }\n\n #stringifyTime(datetime: any) {\n if (!datetime) {\n return undefined;\n }\n\n if (datetime.time && typeof datetime.time === \"string\") {\n return `${datetime.time}`;\n }\n\n const date = new Date(datetime);\n if (!Number.isNaN(date.getTime())) {\n return format(datetime, \"HH:mm:ss\");\n }\n return undefined;\n }\n}\n","// The datetime-picker control. Its field and viewer stay in the primary entry point and reach it\n// from there, so the control ships only to an app that renders it or imports it directly.\n\nexport * from \"./datetime-picker.control\";\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import { DatePipe } from '@angular/common';
|
|
2
|
+
import * as i0 from '@angular/core';
|
|
3
|
+
import { computed, Component } from '@angular/core';
|
|
4
|
+
import { ViewerBase, DATETIME_FORMAT, toHijriDisplay } from 'iss-ctrl/base';
|
|
5
|
+
|
|
6
|
+
class DatePickerTimeViewer extends ViewerBase {
|
|
7
|
+
DATETIME_FORMAT = DATETIME_FORMAT;
|
|
8
|
+
// a field picked on the Hijri calendar reads back as a Hijri date, whichever calendar its
|
|
9
|
+
// stored value is in
|
|
10
|
+
hijriDatetime = computed(() => toHijriDisplay(this.field().ctrlValue(), {
|
|
11
|
+
hijriCalendar: this.field().config?.hijriCalendar(),
|
|
12
|
+
emitHijri: this.field().config?.emitHijri(),
|
|
13
|
+
withTime: true,
|
|
14
|
+
}), ...(ngDevMode ? [{ debugName: "hijriDatetime" }] : /* istanbul ignore next */ []));
|
|
15
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DatePickerTimeViewer, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
16
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: DatePickerTimeViewer, isStandalone: true, selector: "iss-viewer-datetime-picker", usesInheritance: true, ngImport: i0, template: `
|
|
17
|
+
@if (hijriDatetime(); as hijri) {
|
|
18
|
+
{{ hijri }}
|
|
19
|
+
} @else {
|
|
20
|
+
{{ field().ctrlValue() | date: DATETIME_FORMAT }}
|
|
21
|
+
}
|
|
22
|
+
`, isInline: true, dependencies: [{ kind: "pipe", type: DatePipe, name: "date" }] });
|
|
23
|
+
}
|
|
24
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DatePickerTimeViewer, decorators: [{
|
|
25
|
+
type: Component,
|
|
26
|
+
args: [{
|
|
27
|
+
selector: "iss-viewer-datetime-picker",
|
|
28
|
+
imports: [
|
|
29
|
+
DatePipe
|
|
30
|
+
],
|
|
31
|
+
template: `
|
|
32
|
+
@if (hijriDatetime(); as hijri) {
|
|
33
|
+
{{ hijri }}
|
|
34
|
+
} @else {
|
|
35
|
+
{{ field().ctrlValue() | date: DATETIME_FORMAT }}
|
|
36
|
+
}
|
|
37
|
+
`
|
|
38
|
+
}]
|
|
39
|
+
}] });
|
|
40
|
+
|
|
41
|
+
export { DatePickerTimeViewer };
|
|
42
|
+
//# sourceMappingURL=iss-ctrl-datetime-picker.viewer-BeUyEBKo.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"iss-ctrl-datetime-picker.viewer-BeUyEBKo.mjs","sources":["../../../projects/iss/src/components/controls/datetime-picker/datetime-picker.viewer.ts"],"sourcesContent":["import { DatePipe } from \"@angular/common\";\nimport { Component, computed, Signal } from \"@angular/core\";\nimport { DATETIME_FORMAT } from \"iss-ctrl/base\";\nimport { toHijriDisplay } from \"iss-ctrl/base\";\nimport { ViewerBase } from \"iss-ctrl/base\";\n\n@Component({\n selector: \"iss-viewer-datetime-picker\",\n imports: [\n DatePipe\n ],\n template: `\n @if (hijriDatetime(); as hijri) {\n {{ hijri }}\n } @else {\n {{ field().ctrlValue() | date: DATETIME_FORMAT }}\n }\n `\n})\nexport class DatePickerTimeViewer extends ViewerBase {\n protected readonly DATETIME_FORMAT = DATETIME_FORMAT;\n // a field picked on the Hijri calendar reads back as a Hijri date, whichever calendar its\n // stored value is in\n protected hijriDatetime: Signal<string | null> = computed(() => toHijriDisplay(this.field().ctrlValue(), {\n hijriCalendar: this.field().config?.hijriCalendar(),\n emitHijri: this.field().config?.emitHijri(),\n withTime: true,\n }));\n}\n"],"names":[],"mappings":";;;;;AAmBM,MAAO,oBAAqB,SAAQ,UAAU,CAAA;IAC/B,eAAe,GAAG,eAAe;;;AAG1C,IAAA,aAAa,GAA0B,QAAQ,CAAC,MAAM,cAAc,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,SAAS,EAAE,EAAE;QACvG,aAAa,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC,MAAM,EAAE,aAAa,EAAE;QACnD,SAAS,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC,MAAM,EAAE,SAAS,EAAE;AAC3C,QAAA,QAAQ,EAAE,IAAI;AACf,KAAA,CAAC,oFAAC;uGARQ,oBAAoB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAApB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,oBAAoB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,4BAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EARrB;;;;;;AAMT,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,MAAA,EAAA,IAAA,EARC,QAAQ,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,EAAA,CAAA;;2FAUC,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBAbhC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,4BAA4B;AACtC,oBAAA,OAAO,EAAE;wBACP;AACD,qBAAA;AACD,oBAAA,QAAQ,EAAE;;;;;;AAMT,EAAA;AACF,iBAAA;;;;;"}
|
|
@@ -0,0 +1,87 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { Component } from '@angular/core';
|
|
3
|
+
import * as i1 from '@angular/forms';
|
|
4
|
+
import { ReactiveFormsModule } from '@angular/forms';
|
|
5
|
+
import { F as FieldBase, V as VIEW_PROVIDER, a as ValidationMessage, b as FieldViewer } from './iss-ctrl-iss-ctrl-BG-QWWdq.mjs';
|
|
6
|
+
import { DropdownlistControl } from 'iss-ctrl/dropdownlist';
|
|
7
|
+
import { DropdownlistViewer } from './iss-ctrl-dropdownlist.viewer-OWJxDpr8.mjs';
|
|
8
|
+
|
|
9
|
+
/**
|
|
10
|
+
* `<iss-field-dropdownlist>` — single or multiple selection from a dropdown.
|
|
11
|
+
*
|
|
12
|
+
* Rendered by the outlet for fields of type `dropdown_list`. In `edit` mode it renders
|
|
13
|
+
* {@link DropdownlistControl} plus the validation message; in `view` mode the matching viewer.
|
|
14
|
+
*
|
|
15
|
+
* ### Supported `config` keys
|
|
16
|
+
* | Key | Type | Description |
|
|
17
|
+
* | --- | --- | --- |
|
|
18
|
+
* | `multiple` | `boolean` | Allows selecting more than one option. |
|
|
19
|
+
* | `readonly` | `boolean` | Shows the value but blocks interaction. |
|
|
20
|
+
*
|
|
21
|
+
* ### Other field members used
|
|
22
|
+
* `label()` · `options()` · `ctrlJsonValue()`
|
|
23
|
+
*
|
|
24
|
+
* Every field also honours `visible`, `mode`, `validation`, `asyncValidation` and
|
|
25
|
+
* `events` — see {@link IssField} for the full model and {@link FieldConfig} for all keys.
|
|
26
|
+
*
|
|
27
|
+
* The raw form value holds the selected option values; the resolved options are written
|
|
28
|
+
* back to `field.ctrlJsonValue`.
|
|
29
|
+
*
|
|
30
|
+
* @example
|
|
31
|
+
* ```json
|
|
32
|
+
* { "name": "city", "type": "dropdown_list", "label": "City", "options": [{ "value": "1", "label": "Riyadh" }] }
|
|
33
|
+
* ```
|
|
34
|
+
*/
|
|
35
|
+
class DropdownlistField extends FieldBase {
|
|
36
|
+
onChange($event) {
|
|
37
|
+
this.field.ctrlJsonValue.set($event);
|
|
38
|
+
}
|
|
39
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DropdownlistField, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
40
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: DropdownlistField, isStandalone: true, selector: "iss-field-dropdownlist", usesInheritance: true, ngImport: i0, template: `
|
|
41
|
+
@if (field.visible()) {
|
|
42
|
+
@if (field.mode() === "edit") {
|
|
43
|
+
<iss-ctrl-dropdownlist [formControlName]="field.name" [options]="field.options()" [multiple]="field.config.multiple()" [readonly]="field.config.readonly() ?? false" (onChange)="onChange($event)">
|
|
44
|
+
<label>{{ field.label() }}</label>
|
|
45
|
+
</iss-ctrl-dropdownlist>
|
|
46
|
+
<iss-validation-message-viewer [errors]="ctrl.errors" [showMessage]="!ctrl.untouched"/>
|
|
47
|
+
} @else {
|
|
48
|
+
<iss-field-viewer>
|
|
49
|
+
<label>{{ field.label() }}</label>
|
|
50
|
+
<iss-viewer-dropdownlist [field]="field"/>
|
|
51
|
+
</iss-field-viewer>
|
|
52
|
+
}
|
|
53
|
+
}
|
|
54
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: DropdownlistControl, selector: "iss-ctrl-dropdownlist", inputs: ["options", "height", "loading"], outputs: ["onQueryChange"] }, { kind: "component", type: ValidationMessage, selector: "iss-validation-message-viewer", inputs: ["errors", "showMessage"] }, { kind: "component", type: DropdownlistViewer, selector: "iss-viewer-dropdownlist" }, { kind: "component", type: FieldViewer, selector: "iss-field-viewer" }], viewProviders: [VIEW_PROVIDER] });
|
|
55
|
+
}
|
|
56
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DropdownlistField, decorators: [{
|
|
57
|
+
type: Component,
|
|
58
|
+
args: [{
|
|
59
|
+
selector: "iss-field-dropdownlist",
|
|
60
|
+
viewProviders: [VIEW_PROVIDER],
|
|
61
|
+
imports: [
|
|
62
|
+
ReactiveFormsModule,
|
|
63
|
+
DropdownlistControl,
|
|
64
|
+
ValidationMessage,
|
|
65
|
+
DropdownlistViewer,
|
|
66
|
+
FieldViewer
|
|
67
|
+
],
|
|
68
|
+
template: `
|
|
69
|
+
@if (field.visible()) {
|
|
70
|
+
@if (field.mode() === "edit") {
|
|
71
|
+
<iss-ctrl-dropdownlist [formControlName]="field.name" [options]="field.options()" [multiple]="field.config.multiple()" [readonly]="field.config.readonly() ?? false" (onChange)="onChange($event)">
|
|
72
|
+
<label>{{ field.label() }}</label>
|
|
73
|
+
</iss-ctrl-dropdownlist>
|
|
74
|
+
<iss-validation-message-viewer [errors]="ctrl.errors" [showMessage]="!ctrl.untouched"/>
|
|
75
|
+
} @else {
|
|
76
|
+
<iss-field-viewer>
|
|
77
|
+
<label>{{ field.label() }}</label>
|
|
78
|
+
<iss-viewer-dropdownlist [field]="field"/>
|
|
79
|
+
</iss-field-viewer>
|
|
80
|
+
}
|
|
81
|
+
}
|
|
82
|
+
`
|
|
83
|
+
}]
|
|
84
|
+
}] });
|
|
85
|
+
|
|
86
|
+
export { DropdownlistField };
|
|
87
|
+
//# sourceMappingURL=iss-ctrl-dropdownlist.field-DikBAtc_.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"iss-ctrl-dropdownlist.field-DikBAtc_.mjs","sources":["../../../projects/iss/src/components/controls/dropdownlist/dropdownlist.field.ts"],"sourcesContent":["import { Component } from \"@angular/core\";\nimport { ReactiveFormsModule } from \"@angular/forms\";\nimport { VIEW_PROVIDER } from \"../../../shared/constants/view-provider.const\";\nimport { FieldViewer } from \"../../shared/field-viewer\";\nimport { ValidationMessage } from \"../../shared/validation-message\";\nimport { FieldBase } from \"../base/field-base\";\nimport { DropdownlistControl } from \"iss-ctrl/dropdownlist\";\nimport { DropdownlistViewer } from \"./dropdownlist.viewer\";\n\n/**\n * `<iss-field-dropdownlist>` — single or multiple selection from a dropdown.\n *\n * Rendered by the outlet for fields of type `dropdown_list`. In `edit` mode it renders\n * {@link DropdownlistControl} plus the validation message; in `view` mode the matching viewer.\n *\n * ### Supported `config` keys\n * | Key | Type | Description |\n * | --- | --- | --- |\n * | `multiple` | `boolean` | Allows selecting more than one option. |\n * | `readonly` | `boolean` | Shows the value but blocks interaction. |\n *\n * ### Other field members used\n * `label()` · `options()` · `ctrlJsonValue()`\n *\n * Every field also honours `visible`, `mode`, `validation`, `asyncValidation` and\n * `events` — see {@link IssField} for the full model and {@link FieldConfig} for all keys.\n *\n * The raw form value holds the selected option values; the resolved options are written\n * back to `field.ctrlJsonValue`.\n *\n * @example\n * ```json\n * { \"name\": \"city\", \"type\": \"dropdown_list\", \"label\": \"City\", \"options\": [{ \"value\": \"1\", \"label\": \"Riyadh\" }] }\n * ```\n */\n@Component({\n selector: \"iss-field-dropdownlist\",\n viewProviders: [VIEW_PROVIDER],\n imports: [\n ReactiveFormsModule,\n DropdownlistControl,\n ValidationMessage,\n DropdownlistViewer,\n FieldViewer\n ],\n template: `\n @if (field.visible()) {\n @if (field.mode() === \"edit\") {\n <iss-ctrl-dropdownlist [formControlName]=\"field.name\" [options]=\"field.options()\" [multiple]=\"field.config.multiple()\" [readonly]=\"field.config.readonly() ?? false\" (onChange)=\"onChange($event)\">\n <label>{{ field.label() }}</label>\n </iss-ctrl-dropdownlist>\n <iss-validation-message-viewer [errors]=\"ctrl.errors\" [showMessage]=\"!ctrl.untouched\"/>\n } @else {\n <iss-field-viewer>\n <label>{{ field.label() }}</label>\n <iss-viewer-dropdownlist [field]=\"field\"/>\n </iss-field-viewer>\n }\n }\n `\n})\nexport class DropdownlistField extends FieldBase {\n onChange($event: string | FormData) {\n this.field.ctrlJsonValue.set($event);\n }\n}\n"],"names":[],"mappings":";;;;;;;;AASA;;;;;;;;;;;;;;;;;;;;;;;;;AAyBG;AA2BG,MAAO,iBAAkB,SAAQ,SAAS,CAAA;AAC9C,IAAA,QAAQ,CAAC,MAAyB,EAAA;QAChC,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC,MAAM,CAAC;IACtC;uGAHW,iBAAiB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAjB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,iBAAiB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,wBAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAhBlB;;;;;;;;;;;;;;AAcT,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EApBC,mBAAmB,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,eAAA,EAAA,QAAA,EAAA,2CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,eAAA,EAAA,QAAA,EAAA,mBAAA,EAAA,MAAA,EAAA,CAAA,iBAAA,EAAA,UAAA,EAAA,SAAA,CAAA,EAAA,OAAA,EAAA,CAAA,eAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACnB,mBAAmB,EAAA,QAAA,EAAA,uBAAA,EAAA,MAAA,EAAA,CAAA,SAAA,EAAA,QAAA,EAAA,SAAA,CAAA,EAAA,OAAA,EAAA,CAAA,eAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACnB,iBAAiB,EAAA,QAAA,EAAA,+BAAA,EAAA,MAAA,EAAA,CAAA,QAAA,EAAA,aAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACjB,kBAAkB,EAAA,QAAA,EAAA,yBAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAClB,WAAW,EAAA,QAAA,EAAA,kBAAA,EAAA,CAAA,EAAA,aAAA,EANE,CAAC,aAAa,CAAC,EAAA,CAAA;;2FAwBnB,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBA1B7B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,wBAAwB;oBAClC,aAAa,EAAE,CAAC,aAAa,CAAC;AAC9B,oBAAA,OAAO,EAAE;wBACP,mBAAmB;wBACnB,mBAAmB;wBACnB,iBAAiB;wBACjB,kBAAkB;wBAClB;AACD,qBAAA;AACD,oBAAA,QAAQ,EAAE;;;;;;;;;;;;;;AAcT,EAAA;AACF,iBAAA;;;;;"}
|