@spicainternational/ngx-sds-components 5.7.0 → 5.9.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/esm2020/src/lib/color-picker/color-picker.component.mjs +42 -5
- package/esm2020/src/lib/date-picker/date-picker.component.mjs +17 -5
- package/esm2020/src/lib/duration-box/duration-box.component.mjs +113 -22
- package/esm2020/src/lib/duration-box/duration-box.module.mjs +6 -3
- package/esm2020/src/lib/duration-box/duration-box.types.mjs +2 -0
- package/esm2020/src/lib/duration-box/duration.service.mjs +6 -3
- package/esm2020/src/lib/modal/dialog/dialog.component.mjs +16 -4
- package/esm2020/src/lib/modal/modal.component.mjs +4 -4
- package/esm2020/src/lib/modal/modal.module.mjs +5 -1
- package/esm2020/src/lib/navigation/navigation-group/navigation-group.component.mjs +1 -1
- package/fesm2015/spicainternational-ngx-sds-components-src-lib-color-picker.mjs +41 -4
- package/fesm2015/spicainternational-ngx-sds-components-src-lib-color-picker.mjs.map +1 -1
- package/fesm2015/spicainternational-ngx-sds-components-src-lib-date-picker.mjs +17 -4
- package/fesm2015/spicainternational-ngx-sds-components-src-lib-date-picker.mjs.map +1 -1
- package/fesm2015/spicainternational-ngx-sds-components-src-lib-duration-box.mjs +124 -25
- package/fesm2015/spicainternational-ngx-sds-components-src-lib-duration-box.mjs.map +1 -1
- package/fesm2015/spicainternational-ngx-sds-components-src-lib-modal.mjs +21 -5
- package/fesm2015/spicainternational-ngx-sds-components-src-lib-modal.mjs.map +1 -1
- package/fesm2015/spicainternational-ngx-sds-components-src-lib-navigation.mjs.map +1 -1
- package/fesm2020/spicainternational-ngx-sds-components-src-lib-color-picker.mjs +41 -4
- package/fesm2020/spicainternational-ngx-sds-components-src-lib-color-picker.mjs.map +1 -1
- package/fesm2020/spicainternational-ngx-sds-components-src-lib-date-picker.mjs +16 -4
- package/fesm2020/spicainternational-ngx-sds-components-src-lib-date-picker.mjs.map +1 -1
- package/fesm2020/spicainternational-ngx-sds-components-src-lib-duration-box.mjs +122 -25
- package/fesm2020/spicainternational-ngx-sds-components-src-lib-duration-box.mjs.map +1 -1
- package/fesm2020/spicainternational-ngx-sds-components-src-lib-modal.mjs +21 -5
- package/fesm2020/spicainternational-ngx-sds-components-src-lib-modal.mjs.map +1 -1
- package/fesm2020/spicainternational-ngx-sds-components-src-lib-navigation.mjs.map +1 -1
- package/package.json +9 -7
- package/src/lib/color-picker/color-picker.component.d.ts +5 -1
- package/src/lib/date-picker/date-picker.component.d.ts +2 -1
- package/src/lib/duration-box/duration-box.component.d.ts +44 -6
- package/src/lib/duration-box/duration-box.module.d.ts +1 -1
- package/src/lib/duration-box/duration-box.types.d.ts +1 -0
- package/src/lib/modal/dialog/dialog.component.d.ts +6 -2
- package/src/lib/modal/modal.module.d.ts +3 -2
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Injectable, EventEmitter, Component, Input, Output, NgModule } from '@angular/core';
|
|
2
|
+
import { Injectable, EventEmitter, Component, Input, Output, ViewChild, NgModule } from '@angular/core';
|
|
3
3
|
import * as i4 from '@angular/common';
|
|
4
4
|
import { CommonModule } from '@angular/common';
|
|
5
5
|
import * as i6 from '@spicainternational/ngx-sds-components/src/lib/duration-pipe';
|
|
6
6
|
import { SdsDurationFormatPipe, SdsDurationPipeModule } from '@spicainternational/ngx-sds-components/src/lib/duration-pipe';
|
|
7
7
|
import * as i2 from 'devextreme-angular';
|
|
8
|
-
import { DxTextBoxModule, DxPopoverModule, DxScrollViewModule } from 'devextreme-angular';
|
|
8
|
+
import { DxTextBoxModule, DxPopoverModule, DxScrollViewModule, DxValidatorModule } from 'devextreme-angular';
|
|
9
9
|
import * as i3 from 'devextreme-angular/ui/nested';
|
|
10
10
|
import * as i5 from 'devextreme-angular/core';
|
|
11
11
|
|
|
@@ -13,7 +13,7 @@ class DurationService {
|
|
|
13
13
|
constructor() { }
|
|
14
14
|
resolve(input) {
|
|
15
15
|
if (!input || input.length === 0) {
|
|
16
|
-
return
|
|
16
|
+
return null;
|
|
17
17
|
}
|
|
18
18
|
const inputSegments = input.split(':');
|
|
19
19
|
if (inputSegments.length > 2) {
|
|
@@ -47,6 +47,9 @@ class DurationService {
|
|
|
47
47
|
return 0;
|
|
48
48
|
}
|
|
49
49
|
isValidInput(input) {
|
|
50
|
+
if (input === '') {
|
|
51
|
+
return true;
|
|
52
|
+
}
|
|
50
53
|
const regexNumbersOnly = /^[+-]?\d+$/;
|
|
51
54
|
const regexColonSeparated = /^[+-]?\d+:\d+$/;
|
|
52
55
|
return regexNumbersOnly.test(input) || regexColonSeparated.test(input);
|
|
@@ -64,7 +67,7 @@ class DurationService {
|
|
|
64
67
|
return defaultValue;
|
|
65
68
|
}
|
|
66
69
|
isValueWithinLimits(value, min, max) {
|
|
67
|
-
return !((min && value < min) || (max && value > max));
|
|
70
|
+
return !((min != undefined && value < min) || (max != undefined && value > max));
|
|
68
71
|
}
|
|
69
72
|
}
|
|
70
73
|
DurationService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: DurationService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
@@ -76,6 +79,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImpor
|
|
|
76
79
|
}]
|
|
77
80
|
}], ctorParameters: function () { return []; } });
|
|
78
81
|
|
|
82
|
+
/**
|
|
83
|
+
* Component allows user to enter duration in h:mm format. User may also select no value is this is applicable to the
|
|
84
|
+
* use case. A list of pre-defined durations can be provided for easier selection.
|
|
85
|
+
*
|
|
86
|
+
* The auto resolve function tries to convert entered text into minutes. The algorithm splits entry into two parts
|
|
87
|
+
* hours and minutes based on delimiter or if there is none - it takes last two digits as minutes.
|
|
88
|
+
*
|
|
89
|
+
* @export
|
|
90
|
+
* @class SdsDurationBoxComponent
|
|
91
|
+
*/
|
|
79
92
|
class SdsDurationBoxComponent {
|
|
80
93
|
constructor(_durationInputResolver) {
|
|
81
94
|
this._durationInputResolver = _durationInputResolver;
|
|
@@ -88,21 +101,21 @@ class SdsDurationBoxComponent {
|
|
|
88
101
|
this.value = null;
|
|
89
102
|
this.valueChange = new EventEmitter();
|
|
90
103
|
/**
|
|
91
|
-
* Allow user to select empty value. You should provide emptyValueText in this case.
|
|
104
|
+
* Allow user to select empty value. You should provide emptyValueText in this case. The emitted value is 'null'.
|
|
92
105
|
*
|
|
93
106
|
* @type {boolean}
|
|
94
107
|
* @memberof SdsDurationBoxComponent
|
|
95
108
|
*/
|
|
96
109
|
this.allowEmptyValue = true;
|
|
97
110
|
/**
|
|
98
|
-
*
|
|
111
|
+
* Text to be displayed when value is cleared
|
|
99
112
|
*
|
|
100
113
|
* @type {string}
|
|
101
114
|
* @memberof SdsDurationBoxComponent
|
|
102
115
|
*/
|
|
103
116
|
this.emptyValueText = 'not set';
|
|
104
117
|
/**
|
|
105
|
-
* Width of component
|
|
118
|
+
* Width of component. By default 10rem.
|
|
106
119
|
*
|
|
107
120
|
* @type {string}
|
|
108
121
|
* @memberof SdsDurationBoxComponent
|
|
@@ -122,6 +135,27 @@ class SdsDurationBoxComponent {
|
|
|
122
135
|
* @memberof SdsDurationBoxComponent
|
|
123
136
|
*/
|
|
124
137
|
this.showClearButton = false;
|
|
138
|
+
/**
|
|
139
|
+
* Specifies how range limits are handled.
|
|
140
|
+
*
|
|
141
|
+
* @type {('fallbackToLastValue' | 'showValidationError')}
|
|
142
|
+
* @memberof SdsDurationBoxComponent
|
|
143
|
+
*/
|
|
144
|
+
this.rangeViolationHandling = 'autoResolve';
|
|
145
|
+
/**
|
|
146
|
+
* Range violation message. Applicable when rangeViolationHandling is set to 'autoResolve'
|
|
147
|
+
*
|
|
148
|
+
* @type {string}
|
|
149
|
+
* @memberof SdsDurationBoxComponent
|
|
150
|
+
*/
|
|
151
|
+
this.rangeViolationText = 'value is outside the valid range';
|
|
152
|
+
/**
|
|
153
|
+
* Indicates whether the editor's value is valid.
|
|
154
|
+
*
|
|
155
|
+
* @type {boolean}
|
|
156
|
+
* @memberof SdsDurationBoxComponent
|
|
157
|
+
*/
|
|
158
|
+
this.isValid = true;
|
|
125
159
|
// public elementUUID = 'sds-db-' + crypto.randomUUID();
|
|
126
160
|
this.elementUUID = `sds-db-${Math.ceil(Math.random() * 1000000)}`;
|
|
127
161
|
this.inputValue = '';
|
|
@@ -145,20 +179,19 @@ class SdsDurationBoxComponent {
|
|
|
145
179
|
}
|
|
146
180
|
};
|
|
147
181
|
}
|
|
182
|
+
ngAfterViewInit() {
|
|
183
|
+
if (this._validationRule) {
|
|
184
|
+
this._validationRule.validationCallback = () => {
|
|
185
|
+
return this.checkIfValid();
|
|
186
|
+
};
|
|
187
|
+
}
|
|
188
|
+
}
|
|
148
189
|
ngOnChanges(changes) {
|
|
149
|
-
if (changes['value']
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
else {
|
|
155
|
-
this.setValue(this._durationInputResolver.getDefaultValue());
|
|
156
|
-
this.inputValue = this._durationPipe.transform(this.value, this.emptyValueText);
|
|
157
|
-
}
|
|
158
|
-
}
|
|
159
|
-
else {
|
|
160
|
-
this.inputValue = this._durationPipe.transform(this.value, this.emptyValueText);
|
|
161
|
-
}
|
|
190
|
+
if (changes['value'] ||
|
|
191
|
+
changes['min'] || changes['max'] ||
|
|
192
|
+
changes['rangeViolationHandling'] ||
|
|
193
|
+
changes['allowEmptyValue']) {
|
|
194
|
+
this.validateInputs();
|
|
162
195
|
}
|
|
163
196
|
}
|
|
164
197
|
ngOnInit() { }
|
|
@@ -170,23 +203,34 @@ class SdsDurationBoxComponent {
|
|
|
170
203
|
if (!this._durationInputResolver.isValidInput(this.inputValue)) {
|
|
171
204
|
// we have invalid input. use old value
|
|
172
205
|
this.setInputValueInternally(this.value);
|
|
206
|
+
this.setValidationStatusAndValidate(true);
|
|
173
207
|
}
|
|
174
208
|
else {
|
|
175
209
|
const resolvedValue = this._durationInputResolver.resolve(this.inputValue);
|
|
176
210
|
if (resolvedValue === null && this.allowEmptyValue) {
|
|
177
211
|
this.setValue(null);
|
|
212
|
+
this.setValidationStatusAndValidate(true);
|
|
178
213
|
}
|
|
179
214
|
else if (resolvedValue === null && !this.allowEmptyValue) {
|
|
180
215
|
this.setValue(this._durationInputResolver.getDefaultValue());
|
|
216
|
+
this.setValidationStatusAndValidate(true);
|
|
181
217
|
}
|
|
182
218
|
else {
|
|
183
219
|
// make sure that the value is within the min/max period
|
|
184
220
|
if (this._durationInputResolver.isValueWithinLimits(resolvedValue, this.min, this.max)) {
|
|
185
221
|
this.setValue(resolvedValue);
|
|
222
|
+
this.setValidationStatusAndValidate(true);
|
|
186
223
|
}
|
|
187
224
|
else {
|
|
188
225
|
// use old value
|
|
189
|
-
|
|
226
|
+
if (this.rangeViolationHandling === 'autoResolve') {
|
|
227
|
+
this.setInputValueInternally(this.value);
|
|
228
|
+
this.setValidationStatusAndValidate(true);
|
|
229
|
+
}
|
|
230
|
+
else {
|
|
231
|
+
this.setInputValueInternally(resolvedValue);
|
|
232
|
+
this.setValidationStatusAndValidate(false);
|
|
233
|
+
}
|
|
190
234
|
}
|
|
191
235
|
}
|
|
192
236
|
}
|
|
@@ -197,6 +241,43 @@ class SdsDurationBoxComponent {
|
|
|
197
241
|
this.isValueSetInternally = false;
|
|
198
242
|
this.setValue(value);
|
|
199
243
|
}
|
|
244
|
+
checkIfValid() {
|
|
245
|
+
return this.isValid;
|
|
246
|
+
}
|
|
247
|
+
validateInputs() {
|
|
248
|
+
var _a;
|
|
249
|
+
if (this.value === null) {
|
|
250
|
+
// handle null input
|
|
251
|
+
if (this.allowEmptyValue) {
|
|
252
|
+
this.setValue(null);
|
|
253
|
+
}
|
|
254
|
+
else {
|
|
255
|
+
this.setValue(this._durationInputResolver.getDefaultValue());
|
|
256
|
+
this.inputValue = this._durationPipe.transform(this.value, this.emptyValueText);
|
|
257
|
+
}
|
|
258
|
+
this.setValidationStatusAndValidate(true);
|
|
259
|
+
}
|
|
260
|
+
else {
|
|
261
|
+
// handle value input
|
|
262
|
+
if (this._durationInputResolver.isValueWithinLimits(this.value, this.min, this.max)) {
|
|
263
|
+
this.inputValue = this._durationPipe.transform(this.value, this.emptyValueText);
|
|
264
|
+
this.setValidationStatusAndValidate(true);
|
|
265
|
+
}
|
|
266
|
+
else {
|
|
267
|
+
// value is out of range
|
|
268
|
+
if (this.rangeViolationHandling === 'autoResolve') {
|
|
269
|
+
this.setValue(this._durationInputResolver.getDefaultValue(this.min, this.max));
|
|
270
|
+
this.inputValue = this._durationPipe.transform(this.value, this.emptyValueText);
|
|
271
|
+
this.setValidationStatusAndValidate(true);
|
|
272
|
+
}
|
|
273
|
+
else {
|
|
274
|
+
this.inputValue = this._durationPipe.transform(this.value, this.emptyValueText);
|
|
275
|
+
this.setValidationStatusAndValidate(false);
|
|
276
|
+
}
|
|
277
|
+
}
|
|
278
|
+
(_a = this._validator) === null || _a === void 0 ? void 0 : _a.instance.validate();
|
|
279
|
+
}
|
|
280
|
+
}
|
|
200
281
|
setValue(value) {
|
|
201
282
|
this.isValueEmpty = (value === null);
|
|
202
283
|
this.value = value;
|
|
@@ -206,15 +287,20 @@ class SdsDurationBoxComponent {
|
|
|
206
287
|
setInputValueInternally(value) {
|
|
207
288
|
this.isValueSetInternally = true;
|
|
208
289
|
setTimeout(() => {
|
|
209
|
-
this.inputValue = this._durationPipe.transform(
|
|
290
|
+
this.inputValue = this._durationPipe.transform(value, this.emptyValueText);
|
|
210
291
|
}, 0);
|
|
211
292
|
}
|
|
293
|
+
setValidationStatusAndValidate(isWithinRange) {
|
|
294
|
+
var _a;
|
|
295
|
+
this.isValid = (this.rangeViolationHandling === 'autoResolve') || isWithinRange;
|
|
296
|
+
(_a = this._validator) === null || _a === void 0 ? void 0 : _a.instance.validate();
|
|
297
|
+
}
|
|
212
298
|
}
|
|
213
299
|
SdsDurationBoxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsDurationBoxComponent, deps: [{ token: DurationService }], target: i0.ɵɵFactoryTarget.Component });
|
|
214
|
-
SdsDurationBoxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: SdsDurationBoxComponent, selector: "sds-duration-box", inputs: { value: "value", allowEmptyValue: "allowEmptyValue", emptyValueText: "emptyValueText", options: "options", width: "width", disabled: "disabled", showClearButton: "showClearButton", max: "max", min: "min" }, outputs: { valueChange: "valueChange" }, usesOnChanges: true, ngImport: i0, template: "<dx-text-box\r\n #textbox\r\n [id]=\"elementUUID\"\r\n class=\"sds-durationbox\"\r\n [(value)]=\"inputValue\"\r\n (onKeyDown)=\"blockNonNumberOrSemicolon($event)\"\r\n (onChange)=\"resolveInput()\"\r\n [width]=\"width\"\r\n [disabled]=\"disabled\"\r\n >\r\n\r\n
|
|
300
|
+
SdsDurationBoxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: SdsDurationBoxComponent, selector: "sds-duration-box", inputs: { value: "value", allowEmptyValue: "allowEmptyValue", emptyValueText: "emptyValueText", options: "options", width: "width", disabled: "disabled", showClearButton: "showClearButton", max: "max", min: "min", rangeViolationHandling: "rangeViolationHandling", rangeViolationText: "rangeViolationText" }, outputs: { valueChange: "valueChange" }, viewQueries: [{ propertyName: "_validationRule", first: true, predicate: ["validationRule"], descendants: true }, { propertyName: "_validator", first: true, predicate: ["validator"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<dx-text-box\r\n #textbox\r\n [id]=\"elementUUID\"\r\n class=\"sds-durationbox\"\r\n [(value)]=\"inputValue\"\r\n (onKeyDown)=\"blockNonNumberOrSemicolon($event)\"\r\n (onChange)=\"resolveInput()\"\r\n [width]=\"width\"\r\n [disabled]=\"disabled\"\r\n >\r\n\r\n <dx-validator \r\n #validator>\r\n <dxi-validation-rule\r\n #validationRule\r\n type=\"custom\"\r\n [message]=\"rangeViolationText\"\r\n [reevaluate]=\"true\"\r\n ></dxi-validation-rule>\r\n </dx-validator>\r\n\r\n <dxi-button\r\n *ngIf=\"allowEmptyValue && showClearButton\"\r\n name=\"clearValue\"\r\n location=\"after\"\r\n [options]=\"clearValueButton\"\r\n ></dxi-button>\r\n \r\n <dxi-button\r\n *ngIf=\"options && options.length > 0\"\r\n name=\"optionsDropdown\"\r\n location=\"after\"\r\n [options]=\"optionsDropdownButton\"\r\n ></dxi-button>\r\n</dx-text-box>\r\n\r\n\r\n<dx-popover\r\n target=\"#{{elementUUID}}\"\r\n [(visible)]=\"showOptions\"\r\n [minWidth]=\"width\"\r\n [closeOnOutsideClick]=\"true\"\r\n [wrapperAttr]=\"{ class: 'sds-durationbox-options-popover' }\"\r\n >\r\n\r\n <div *dxTemplate=\"let data of 'content'\">\r\n <dx-scroll-view>\r\n <button\r\n class=\"dropdown-item border-0\"\r\n [class.selected] = \"isValueEmpty\"\r\n (click)=\"applyOption(null)\"\r\n > {{ emptyValueText}}\r\n </button>\r\n\r\n <div *ngFor=\"let option of options\">\r\n <button\r\n class=\"dropdown-item border-0\"\r\n [class.selected] = \"option === value\"\r\n (click)=\"applyOption(option)\"\r\n > {{option | sdsDurationFormat}}\r\n </button>\r\n </div>\r\n </dx-scroll-view>\r\n </div>\r\n</dx-popover>", styles: ["::ng-deep .sds-durationbox .sds-durationbox-clear-button .dx-icon{color:#999}::ng-deep .sds-durationbox-options-popover .dx-popup-content{padding:.25rem;font-size:1rem}::ng-deep .sds-durationbox-options-popover .dropdown-item{padding:.5rem}::ng-deep .sds-durationbox-options-popover .dropdown-item:hover{background-color:#f8f9fa}::ng-deep .sds-durationbox-options-popover .dropdown-item:focus{outline:none}::ng-deep .sds-durationbox-options-popover .dropdown-item.selected{background-color:#dee2e6}\n"], components: [{ type: i2.DxTextBoxComponent, selector: "dx-text-box", inputs: ["accessKey", "activeStateEnabled", "buttons", "disabled", "elementAttr", "focusStateEnabled", "height", "hint", "hoverStateEnabled", "inputAttr", "isValid", "label", "labelMode", "mask", "maskChar", "maskInvalidMessage", "maskRules", "maxLength", "mode", "name", "placeholder", "readOnly", "rtlEnabled", "showClearButton", "showMaskMode", "spellcheck", "stylingMode", "tabIndex", "text", "useMaskedValue", "validationError", "validationErrors", "validationMessageMode", "validationMessagePosition", "validationStatus", "value", "valueChangeEvent", "visible", "width"], outputs: ["onChange", "onContentReady", "onCopy", "onCut", "onDisposing", "onEnterKey", "onFocusIn", "onFocusOut", "onInitialized", "onInput", "onKeyDown", "onKeyUp", "onOptionChanged", "onPaste", "onValueChanged", "accessKeyChange", "activeStateEnabledChange", "buttonsChange", "disabledChange", "elementAttrChange", "focusStateEnabledChange", "heightChange", "hintChange", "hoverStateEnabledChange", "inputAttrChange", "isValidChange", "labelChange", "labelModeChange", "maskChange", "maskCharChange", "maskInvalidMessageChange", "maskRulesChange", "maxLengthChange", "modeChange", "nameChange", "placeholderChange", "readOnlyChange", "rtlEnabledChange", "showClearButtonChange", "showMaskModeChange", "spellcheckChange", "stylingModeChange", "tabIndexChange", "textChange", "useMaskedValueChange", "validationErrorChange", "validationErrorsChange", "validationMessageModeChange", "validationMessagePositionChange", "validationStatusChange", "valueChange", "valueChangeEventChange", "visibleChange", "widthChange", "onBlur"] }, { type: i2.DxValidatorComponent, selector: "dx-validator", inputs: ["adapter", "elementAttr", "height", "name", "validationGroup", "validationRules", "width"], outputs: ["onDisposing", "onInitialized", "onOptionChanged", "onValidated", "adapterChange", "elementAttrChange", "heightChange", "nameChange", "validationGroupChange", "validationRulesChange", "widthChange"] }, { type: i3.DxiValidationRuleComponent, selector: "dxi-validation-rule", inputs: ["message", "trim", "type", "ignoreEmptyValue", "max", "min", "reevaluate", "validationCallback", "comparisonTarget", "comparisonType", "pattern"] }, { type: i3.DxiButtonComponent, selector: "dxi-button", inputs: ["location", "name", "options", "cssClass", "disabled", "hint", "icon", "onClick", "template", "text", "visible"] }, { type: i2.DxPopoverComponent, selector: "dx-popover", inputs: ["animation", "closeOnOutsideClick", "container", "contentTemplate", "copyRootClassesToWrapper", "deferRendering", "disabled", "elementAttr", "height", "hideEvent", "hideOnOutsideClick", "hideOnParentScroll", "hint", "hoverStateEnabled", "maxHeight", "maxWidth", "minHeight", "minWidth", "position", "rtlEnabled", "shading", "shadingColor", "showCloseButton", "showEvent", "showTitle", "target", "title", "titleTemplate", "toolbarItems", "visible", "width", "wrapperAttr"], outputs: ["onContentReady", "onDisposing", "onHidden", "onHiding", "onInitialized", "onOptionChanged", "onShowing", "onShown", "onTitleRendered", "animationChange", "closeOnOutsideClickChange", "containerChange", "contentTemplateChange", "copyRootClassesToWrapperChange", "deferRenderingChange", "disabledChange", "elementAttrChange", "heightChange", "hideEventChange", "hideOnOutsideClickChange", "hideOnParentScrollChange", "hintChange", "hoverStateEnabledChange", "maxHeightChange", "maxWidthChange", "minHeightChange", "minWidthChange", "positionChange", "rtlEnabledChange", "shadingChange", "shadingColorChange", "showCloseButtonChange", "showEventChange", "showTitleChange", "targetChange", "titleChange", "titleTemplateChange", "toolbarItemsChange", "visibleChange", "widthChange", "wrapperAttrChange"] }, { type: i2.DxScrollViewComponent, selector: "dx-scroll-view", inputs: ["bounceEnabled", "direction", "disabled", "elementAttr", "height", "pulledDownText", "pullingDownText", "reachBottomText", "refreshingText", "rtlEnabled", "scrollByContent", "scrollByThumb", "showScrollbar", "useNative", "width"], outputs: ["onDisposing", "onInitialized", "onOptionChanged", "onPullDown", "onReachBottom", "onScroll", "onUpdated", "bounceEnabledChange", "directionChange", "disabledChange", "elementAttrChange", "heightChange", "pulledDownTextChange", "pullingDownTextChange", "reachBottomTextChange", "refreshingTextChange", "rtlEnabledChange", "scrollByContentChange", "scrollByThumbChange", "showScrollbarChange", "useNativeChange", "widthChange"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.DxTemplateDirective, selector: "[dxTemplate]", inputs: ["dxTemplateOf"] }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "sdsDurationFormat": i6.SdsDurationFormatPipe } });
|
|
215
301
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsDurationBoxComponent, decorators: [{
|
|
216
302
|
type: Component,
|
|
217
|
-
args: [{ selector: 'sds-duration-box', template: "<dx-text-box\r\n #textbox\r\n [id]=\"elementUUID\"\r\n class=\"sds-durationbox\"\r\n [(value)]=\"inputValue\"\r\n (onKeyDown)=\"blockNonNumberOrSemicolon($event)\"\r\n (onChange)=\"resolveInput()\"\r\n [width]=\"width\"\r\n [disabled]=\"disabled\"\r\n >\r\n\r\n
|
|
303
|
+
args: [{ selector: 'sds-duration-box', template: "<dx-text-box\r\n #textbox\r\n [id]=\"elementUUID\"\r\n class=\"sds-durationbox\"\r\n [(value)]=\"inputValue\"\r\n (onKeyDown)=\"blockNonNumberOrSemicolon($event)\"\r\n (onChange)=\"resolveInput()\"\r\n [width]=\"width\"\r\n [disabled]=\"disabled\"\r\n >\r\n\r\n <dx-validator \r\n #validator>\r\n <dxi-validation-rule\r\n #validationRule\r\n type=\"custom\"\r\n [message]=\"rangeViolationText\"\r\n [reevaluate]=\"true\"\r\n ></dxi-validation-rule>\r\n </dx-validator>\r\n\r\n <dxi-button\r\n *ngIf=\"allowEmptyValue && showClearButton\"\r\n name=\"clearValue\"\r\n location=\"after\"\r\n [options]=\"clearValueButton\"\r\n ></dxi-button>\r\n \r\n <dxi-button\r\n *ngIf=\"options && options.length > 0\"\r\n name=\"optionsDropdown\"\r\n location=\"after\"\r\n [options]=\"optionsDropdownButton\"\r\n ></dxi-button>\r\n</dx-text-box>\r\n\r\n\r\n<dx-popover\r\n target=\"#{{elementUUID}}\"\r\n [(visible)]=\"showOptions\"\r\n [minWidth]=\"width\"\r\n [closeOnOutsideClick]=\"true\"\r\n [wrapperAttr]=\"{ class: 'sds-durationbox-options-popover' }\"\r\n >\r\n\r\n <div *dxTemplate=\"let data of 'content'\">\r\n <dx-scroll-view>\r\n <button\r\n class=\"dropdown-item border-0\"\r\n [class.selected] = \"isValueEmpty\"\r\n (click)=\"applyOption(null)\"\r\n > {{ emptyValueText}}\r\n </button>\r\n\r\n <div *ngFor=\"let option of options\">\r\n <button\r\n class=\"dropdown-item border-0\"\r\n [class.selected] = \"option === value\"\r\n (click)=\"applyOption(option)\"\r\n > {{option | sdsDurationFormat}}\r\n </button>\r\n </div>\r\n </dx-scroll-view>\r\n </div>\r\n</dx-popover>", styles: ["::ng-deep .sds-durationbox .sds-durationbox-clear-button .dx-icon{color:#999}::ng-deep .sds-durationbox-options-popover .dx-popup-content{padding:.25rem;font-size:1rem}::ng-deep .sds-durationbox-options-popover .dropdown-item{padding:.5rem}::ng-deep .sds-durationbox-options-popover .dropdown-item:hover{background-color:#f8f9fa}::ng-deep .sds-durationbox-options-popover .dropdown-item:focus{outline:none}::ng-deep .sds-durationbox-options-popover .dropdown-item.selected{background-color:#dee2e6}\n"] }]
|
|
218
304
|
}], ctorParameters: function () { return [{ type: DurationService }]; }, propDecorators: { value: [{
|
|
219
305
|
type: Input
|
|
220
306
|
}], valueChange: [{
|
|
@@ -235,6 +321,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImpor
|
|
|
235
321
|
type: Input
|
|
236
322
|
}], min: [{
|
|
237
323
|
type: Input
|
|
324
|
+
}], rangeViolationHandling: [{
|
|
325
|
+
type: Input
|
|
326
|
+
}], rangeViolationText: [{
|
|
327
|
+
type: Input
|
|
328
|
+
}], _validationRule: [{
|
|
329
|
+
type: ViewChild,
|
|
330
|
+
args: ['validationRule', { static: false }]
|
|
331
|
+
}], _validator: [{
|
|
332
|
+
type: ViewChild,
|
|
333
|
+
args: ['validator', { static: false }]
|
|
238
334
|
}] } });
|
|
239
335
|
|
|
240
336
|
const components = [
|
|
@@ -247,13 +343,15 @@ SdsDurationBoxModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", ve
|
|
|
247
343
|
SdsDurationPipeModule,
|
|
248
344
|
DxTextBoxModule,
|
|
249
345
|
DxPopoverModule,
|
|
250
|
-
DxScrollViewModule
|
|
346
|
+
DxScrollViewModule,
|
|
347
|
+
DxValidatorModule], exports: [SdsDurationBoxComponent] });
|
|
251
348
|
SdsDurationBoxModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsDurationBoxModule, imports: [[
|
|
252
349
|
CommonModule,
|
|
253
350
|
SdsDurationPipeModule,
|
|
254
351
|
DxTextBoxModule,
|
|
255
352
|
DxPopoverModule,
|
|
256
353
|
DxScrollViewModule,
|
|
354
|
+
DxValidatorModule,
|
|
257
355
|
]] });
|
|
258
356
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsDurationBoxModule, decorators: [{
|
|
259
357
|
type: NgModule,
|
|
@@ -267,6 +365,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImpor
|
|
|
267
365
|
DxTextBoxModule,
|
|
268
366
|
DxPopoverModule,
|
|
269
367
|
DxScrollViewModule,
|
|
368
|
+
DxValidatorModule,
|
|
270
369
|
],
|
|
271
370
|
exports: [
|
|
272
371
|
...components
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"spicainternational-ngx-sds-components-src-lib-duration-box.mjs","sources":["../../../projects/ngx-sds-components/src/lib/duration-box/duration.service.ts","../../../projects/ngx-sds-components/src/lib/duration-box/duration-box.component.ts","../../../projects/ngx-sds-components/src/lib/duration-box/duration-box.component.html","../../../projects/ngx-sds-components/src/lib/duration-box/duration-box.module.ts","../../../projects/ngx-sds-components/src/lib/duration-box/spicainternational-ngx-sds-components-src-lib-duration-box.ts"],"sourcesContent":["import { Injectable } from '@angular/core';\r\n\r\n@Injectable({\r\n providedIn: 'root',\r\n})\r\nexport class DurationService {\r\n \r\n constructor() {}\r\n\r\n public resolve(input: string): number | null{\r\n if (!input || input.length === 0) {\r\n return 0;\r\n }\r\n\r\n const inputSegments = input.split(':');\r\n if (inputSegments.length > 2) {\r\n //invalid input\r\n return 0;\r\n } else if (inputSegments.length == 2){\r\n // we have hrs and minutes\r\n const hrs = parseInt(inputSegments[0] ? inputSegments[0] : '0');\r\n const mins = parseInt(inputSegments[1] ? inputSegments[1] : '0');\r\n const totalMins = (hrs * 60) + mins;\r\n\r\n return totalMins;\r\n } else if (inputSegments.length == 1) {\r\n // take last two digits as mins\r\n const nonSeparated = inputSegments[0];\r\n\r\n let totalMins = 0;\r\n if (nonSeparated.length <= 2) {\r\n totalMins = parseInt(nonSeparated)\r\n } else {\r\n const lastIndex = nonSeparated.length - 2;\r\n const part1 = nonSeparated.slice(0, lastIndex);\r\n const part2 = nonSeparated.slice(lastIndex);\r\n const hrs = parseInt(part1);\r\n const mins = parseInt(part2);\r\n totalMins = (hrs * 60) + mins; \r\n }\r\n return totalMins;\r\n }\r\n return 0; \r\n }\r\n\r\n public isValidInput(input: string) {\r\n const regexNumbersOnly = /^[+-]?\\d+$/;\r\n const regexColonSeparated = /^[+-]?\\d+:\\d+$/;\r\n return regexNumbersOnly.test(input) || regexColonSeparated.test(input);\r\n }\r\n\r\n public getDefaultValue(min?: number, max?: number): number {\r\n let defaultValue = 0;\r\n // try keeping the 0 as default\r\n // if it is outside the min/max then adjust\r\n if (min) {\r\n defaultValue = Math.max(defaultValue, min);\r\n }\r\n if (max) {\r\n defaultValue = Math.min(defaultValue, max);\r\n }\r\n return defaultValue;\r\n }\r\n\r\n public isValueWithinLimits(value: number, min?: number, max?: number): boolean {\r\n return !((min && value < min) || (max && value > max))\r\n } \r\n\r\n}\r\n","import { Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges } from '@angular/core';\r\nimport { SdsDurationFormatPipe } from '@spicainternational/ngx-sds-components/src/lib/duration-pipe';\r\nimport { DurationService } from './duration.service';\r\n\r\n@Component({\r\n selector: 'sds-duration-box',\r\n templateUrl: './duration-box.component.html',\r\n styleUrls: ['./duration-box.component.scss'],\r\n})\r\nexport class SdsDurationBoxComponent implements OnInit, OnChanges {\r\n /**\r\n * Duration length expressed in minutes; when we allow empty values this property can be null.\r\n *\r\n * @type {(number | null)}\r\n * @memberof SdsDurationBoxComponent\r\n */\r\n @Input() value: number | null = null;\r\n @Output() valueChange = new EventEmitter<number | null>();\r\n\r\n /**\r\n * Allow user to select empty value. You should provide emptyValueText in this case.\r\n *\r\n * @type {boolean}\r\n * @memberof SdsDurationBoxComponent\r\n */\r\n @Input() allowEmptyValue: boolean = true;\r\n\r\n /**\r\n * 'emptyValueText' - text to be displayed when value is cleared\r\n *\r\n * @type {string}\r\n * @memberof SdsDurationBoxComponent\r\n */\r\n @Input() emptyValueText: string = 'not set';\r\n\r\n /**\r\n * Array of pre-defined durations that will be displayed in dropdown for easier selection.\r\n *\r\n * @type {number[]}\r\n * @memberof SdsDurationBoxComponent\r\n */\r\n @Input() options?: number[];\r\n \r\n /**\r\n * Width of component\r\n *\r\n * @type {string}\r\n * @memberof SdsDurationBoxComponent\r\n */\r\n @Input() width: string = '10rem';\r\n\r\n /**\r\n * Specifies whether the UI component responds to user interaction.\r\n *\r\n * @type {boolean}\r\n * @memberof SdsDurationBoxComponent\r\n */\r\n @Input() disabled: boolean = false;\r\n \r\n /**\r\n * Specifies whether to display the Clear button in the UI component.\r\n *\r\n * @type {boolean}\r\n * @memberof SdsDurationBoxComponent\r\n */\r\n @Input() showClearButton: boolean = false;\r\n\r\n /**\r\n * The maximum value accepted by the duration box.\r\n *\r\n * @type {number}\r\n * @memberof SdsDurationBoxComponent\r\n */\r\n @Input() max?: number;\r\n\r\n /**\r\n * The minimum value accepted by the duration box.\r\n *\r\n * @type {number}\r\n * @memberof SdsDurationBoxComponent\r\n */ \r\n @Input() min?: number;\r\n\r\n // public elementUUID = 'sds-db-' + crypto.randomUUID();\r\n public elementUUID = `sds-db-${Math.ceil(Math.random() * 1000000)}`;\r\n\r\n public inputValue: string = '';\r\n public showOptions: boolean = false;\r\n \r\n public optionsDropdownButton;\r\n public clearValueButton;\r\n\r\n public isValueEmpty = false;\r\n\r\n private isValueSetInternally = false;\r\n private _durationPipe: SdsDurationFormatPipe;\r\n\r\n constructor(\r\n private _durationInputResolver: DurationService,\r\n ) {\r\n this._durationPipe = new SdsDurationFormatPipe();\r\n \r\n this.optionsDropdownButton = {\r\n icon: 'spindown',\r\n stylingMode: 'text',\r\n \r\n onClick: () => {\r\n this.showOptions = !this.showOptions;\r\n }\r\n }\r\n\r\n this.clearValueButton = {\r\n icon: 'clear',\r\n stylingMode: 'text',\r\n elementAttr: { class: 'sds-durationbox-clear-button' },\r\n onClick: () => {\r\n this.applyOption(null);\r\n }\r\n } \r\n }\r\n\r\n ngOnChanges(changes: SimpleChanges): void {\r\n if (changes['value']) {\r\n if (this.value === null) {\r\n if (this.allowEmptyValue) {\r\n this.setValue(null);\r\n } else {\r\n this.setValue(this._durationInputResolver.getDefaultValue());\r\n this.inputValue = this._durationPipe.transform(this.value, this.emptyValueText);\r\n }\r\n } else {\r\n this.inputValue = this._durationPipe.transform(this.value, this.emptyValueText);\r\n }\r\n }\r\n }\r\n\r\n ngOnInit(): void {}\r\n\r\n public blockNonNumberOrSemicolon(e: any) {\r\n this.isValueSetInternally = false;\r\n }\r\n\r\n\r\n public resolveInput() {\r\n if (!this.isValueSetInternally){\r\n if (!this._durationInputResolver.isValidInput(this.inputValue)) {\r\n // we have invalid input. use old value\r\n this.setInputValueInternally(this.value);\r\n } else {\r\n const resolvedValue = this._durationInputResolver.resolve(this.inputValue);\r\n \r\n if (resolvedValue === null && this.allowEmptyValue) {\r\n this.setValue(null);\r\n } else if (resolvedValue === null && !this.allowEmptyValue) {\r\n this.setValue(this._durationInputResolver.getDefaultValue());\r\n } else {\r\n\r\n // make sure that the value is within the min/max period\r\n if (this._durationInputResolver.isValueWithinLimits(resolvedValue as number, this.min, this.max)) {\r\n this.setValue(resolvedValue);\r\n } else {\r\n // use old value\r\n this.setInputValueInternally(this.value);\r\n }\r\n }\r\n }\r\n }\r\n }\r\n\r\n public applyOption(value: number | null){\r\n this.showOptions = false;\r\n this.isValueSetInternally = false;\r\n this.setValue(value);\r\n }\r\n\r\n private setValue(value: number | null){\r\n this.isValueEmpty = (value === null);\r\n this.value = value;\r\n this.valueChange.emit(this.value);\r\n this.setInputValueInternally(value);\r\n }\r\n\r\n private setInputValueInternally(value: number | null){\r\n this.isValueSetInternally = true;\r\n setTimeout(() => {\r\n this.inputValue = this._durationPipe.transform(this.value, this.emptyValueText);\r\n }, 0);\r\n }\r\n\r\n}\r\n","<dx-text-box\r\n #textbox\r\n [id]=\"elementUUID\"\r\n class=\"sds-durationbox\"\r\n [(value)]=\"inputValue\"\r\n (onKeyDown)=\"blockNonNumberOrSemicolon($event)\"\r\n (onChange)=\"resolveInput()\"\r\n [width]=\"width\"\r\n [disabled]=\"disabled\"\r\n >\r\n\r\n <!-- (onValueChanged)=\"resolveInput($event)\" -->\r\n\r\n <dxi-button\r\n *ngIf=\"allowEmptyValue && showClearButton\"\r\n name=\"clearValue\"\r\n location=\"after\"\r\n [options]=\"clearValueButton\"\r\n ></dxi-button>\r\n <dxi-button\r\n *ngIf=\"options && options.length > 0\"\r\n name=\"optionsDropdown\"\r\n location=\"after\"\r\n [options]=\"optionsDropdownButton\"\r\n ></dxi-button>\r\n</dx-text-box>\r\n\r\n\r\n<dx-popover\r\n target=\"#{{elementUUID}}\"\r\n [(visible)]=\"showOptions\"\r\n [minWidth]=\"width\"\r\n [hideOnOutsideClick]=\"true\"\r\n [wrapperAttr]=\"{ class: 'sds-durationbox-options-popover' }\"\r\n >\r\n\r\n <div *dxTemplate=\"let data of 'content'\">\r\n <dx-scroll-view>\r\n <button\r\n class=\"dropdown-item border-0\"\r\n [class.selected] = \"isValueEmpty\"\r\n (click)=\"applyOption(null)\"\r\n > {{ emptyValueText}}\r\n </button>\r\n\r\n <div *ngFor=\"let option of options\">\r\n <button\r\n class=\"dropdown-item border-0\"\r\n [class.selected] = \"option === value\"\r\n (click)=\"applyOption(option)\"\r\n > {{option | sdsDurationFormat}}\r\n </button>\r\n </div>\r\n </dx-scroll-view>\r\n </div>\r\n</dx-popover>","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { SdsDurationBoxComponent } from './duration-box.component';\r\nimport { DxPopoverModule, DxScrollViewModule, DxTextBoxModule } from 'devextreme-angular';\r\nimport { SdsDurationPipeModule } from '@spicainternational/ngx-sds-components/src/lib/duration-pipe';\r\n\r\n\r\n\r\nconst components = [\r\n SdsDurationBoxComponent\r\n]\r\n\r\n@NgModule({\r\n declarations: [\r\n SdsDurationBoxComponent\r\n ],\r\n imports: [\r\n CommonModule,\r\n\r\n SdsDurationPipeModule,\r\n \r\n DxTextBoxModule,\r\n DxPopoverModule,\r\n DxScrollViewModule,\r\n ],\r\n exports: [\r\n ...components\r\n ]\r\n})\r\nexport class SdsDurationBoxModule { }\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i1.DurationService"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"spicainternational-ngx-sds-components-src-lib-duration-box.mjs","sources":["../../../projects/ngx-sds-components/src/lib/duration-box/duration.service.ts","../../../projects/ngx-sds-components/src/lib/duration-box/duration-box.component.ts","../../../projects/ngx-sds-components/src/lib/duration-box/duration-box.component.html","../../../projects/ngx-sds-components/src/lib/duration-box/duration-box.module.ts","../../../projects/ngx-sds-components/src/lib/duration-box/spicainternational-ngx-sds-components-src-lib-duration-box.ts"],"sourcesContent":["import { Injectable } from '@angular/core';\r\n\r\n@Injectable({\r\n providedIn: 'root',\r\n})\r\nexport class DurationService {\r\n \r\n constructor() {}\r\n\r\n public resolve(input: string): number | null{\r\n if (!input || input.length === 0) {\r\n return null;\r\n }\r\n\r\n const inputSegments = input.split(':');\r\n if (inputSegments.length > 2) {\r\n //invalid input\r\n return 0;\r\n } else if (inputSegments.length == 2){\r\n // we have hrs and minutes\r\n const hrs = parseInt(inputSegments[0] ? inputSegments[0] : '0');\r\n const mins = parseInt(inputSegments[1] ? inputSegments[1] : '0');\r\n const totalMins = (hrs * 60) + mins;\r\n\r\n return totalMins;\r\n } else if (inputSegments.length == 1) {\r\n // take last two digits as mins\r\n const nonSeparated = inputSegments[0];\r\n\r\n let totalMins = 0;\r\n if (nonSeparated.length <= 2) {\r\n totalMins = parseInt(nonSeparated)\r\n } else {\r\n const lastIndex = nonSeparated.length - 2;\r\n const part1 = nonSeparated.slice(0, lastIndex);\r\n const part2 = nonSeparated.slice(lastIndex);\r\n const hrs = parseInt(part1);\r\n const mins = parseInt(part2);\r\n totalMins = (hrs * 60) + mins; \r\n }\r\n return totalMins;\r\n }\r\n return 0; \r\n }\r\n\r\n public isValidInput(input: string) {\r\n if (input === '') {\r\n return true;\r\n }\r\n\r\n const regexNumbersOnly = /^[+-]?\\d+$/;\r\n const regexColonSeparated = /^[+-]?\\d+:\\d+$/;\r\n return regexNumbersOnly.test(input) || regexColonSeparated.test(input);\r\n }\r\n\r\n public getDefaultValue(min?: number, max?: number): number {\r\n let defaultValue = 0;\r\n // try keeping the 0 as default\r\n // if it is outside the min/max then adjust\r\n if (min) {\r\n defaultValue = Math.max(defaultValue, min);\r\n }\r\n if (max) {\r\n defaultValue = Math.min(defaultValue, max);\r\n }\r\n return defaultValue;\r\n }\r\n\r\n public isValueWithinLimits(value: number, min?: number, max?: number): boolean {\r\n return !((min != undefined && value < min) || (max != undefined && value > max))\r\n } \r\n\r\n}\r\n","import { AfterViewInit, Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges, ViewChild } from '@angular/core';\r\nimport { SdsDurationFormatPipe } from '@spicainternational/ngx-sds-components/src/lib/duration-pipe';\r\nimport { DxValidatorComponent } from 'devextreme-angular';\r\nimport { DxiValidationRuleComponent } from 'devextreme-angular/ui/nested';\r\nimport { DurationBoxRangeViolationHandling } from './duration-box.types';\r\nimport { DurationService } from './duration.service';\r\n\r\n/**\r\n * Component allows user to enter duration in h:mm format. User may also select no value is this is applicable to the \r\n * use case. A list of pre-defined durations can be provided for easier selection.\r\n * \r\n * The auto resolve function tries to convert entered text into minutes. The algorithm splits entry into two parts \r\n * hours and minutes based on delimiter or if there is none - it takes last two digits as minutes.\r\n *\r\n * @export\r\n * @class SdsDurationBoxComponent\r\n */\r\n@Component({\r\n selector: 'sds-duration-box',\r\n templateUrl: './duration-box.component.html',\r\n styleUrls: ['./duration-box.component.scss'],\r\n})\r\nexport class SdsDurationBoxComponent implements OnInit, OnChanges, AfterViewInit {\r\n /**\r\n * Duration length expressed in minutes; when we allow empty values this property can be null.\r\n *\r\n * @type {(number | null)}\r\n * @memberof SdsDurationBoxComponent\r\n */\r\n @Input() value: number | null = null;\r\n @Output() valueChange = new EventEmitter<number | null>();\r\n\r\n /**\r\n * Allow user to select empty value. You should provide emptyValueText in this case. The emitted value is 'null'.\r\n *\r\n * @type {boolean}\r\n * @memberof SdsDurationBoxComponent\r\n */\r\n @Input() allowEmptyValue: boolean = true;\r\n\r\n /**\r\n * Text to be displayed when value is cleared\r\n *\r\n * @type {string}\r\n * @memberof SdsDurationBoxComponent\r\n */\r\n @Input() emptyValueText: string = 'not set';\r\n\r\n /**\r\n * Array of pre-defined durations that will be displayed in dropdown for easier selection.\r\n *\r\n * @type {number[]}\r\n * @memberof SdsDurationBoxComponent\r\n */\r\n @Input() options?: number[];\r\n \r\n /**\r\n * Width of component. By default 10rem.\r\n *\r\n * @type {string}\r\n * @memberof SdsDurationBoxComponent\r\n */\r\n @Input() width: string = '10rem';\r\n\r\n /**\r\n * Specifies whether the UI component responds to user interaction.\r\n *\r\n * @type {boolean}\r\n * @memberof SdsDurationBoxComponent\r\n */\r\n @Input() disabled: boolean = false;\r\n \r\n /**\r\n * Specifies whether to display the Clear button in the UI component.\r\n *\r\n * @type {boolean}\r\n * @memberof SdsDurationBoxComponent\r\n */\r\n @Input() showClearButton: boolean = false;\r\n\r\n /**\r\n * The maximum value accepted by the duration box.\r\n *\r\n * @type {number}\r\n * @memberof SdsDurationBoxComponent\r\n */\r\n @Input() max?: number;\r\n\r\n /**\r\n * The minimum value accepted by the duration box.\r\n *\r\n * @type {number}\r\n * @memberof SdsDurationBoxComponent\r\n */ \r\n @Input() min?: number;\r\n\r\n /**\r\n * Specifies how range limits are handled.\r\n *\r\n * @type {('fallbackToLastValue' | 'showValidationError')}\r\n * @memberof SdsDurationBoxComponent\r\n */\r\n @Input() rangeViolationHandling: DurationBoxRangeViolationHandling = 'autoResolve';\r\n\r\n /**\r\n * Range violation message. Applicable when rangeViolationHandling is set to 'autoResolve'\r\n *\r\n * @type {string}\r\n * @memberof SdsDurationBoxComponent\r\n */\r\n @Input() rangeViolationText: string = 'value is outside the valid range';\r\n\r\n /**\r\n * Indicates whether the editor's value is valid.\r\n *\r\n * @type {boolean}\r\n * @memberof SdsDurationBoxComponent\r\n */\r\n public isValid: boolean = true;\r\n\r\n\r\n\r\n // public elementUUID = 'sds-db-' + crypto.randomUUID();\r\n public elementUUID = `sds-db-${Math.ceil(Math.random() * 1000000)}`;\r\n\r\n\r\n public inputValue: string = '';\r\n public showOptions: boolean = false;\r\n \r\n public optionsDropdownButton;\r\n public clearValueButton;\r\n\r\n public isValueEmpty = false;\r\n\r\n\r\n @ViewChild('validationRule', { static: false }) private _validationRule: DxiValidationRuleComponent | undefined;\r\n @ViewChild('validator', { static: false }) private _validator: DxValidatorComponent | undefined;\r\n\r\n private isValueSetInternally = false;\r\n private _durationPipe: SdsDurationFormatPipe;\r\n\r\n constructor(\r\n private _durationInputResolver: DurationService,\r\n ) {\r\n this._durationPipe = new SdsDurationFormatPipe();\r\n \r\n this.optionsDropdownButton = {\r\n icon: 'spindown',\r\n stylingMode: 'text',\r\n \r\n onClick: () => {\r\n this.showOptions = !this.showOptions;\r\n }\r\n }\r\n\r\n this.clearValueButton = {\r\n icon: 'clear',\r\n stylingMode: 'text',\r\n elementAttr: { class: 'sds-durationbox-clear-button' },\r\n onClick: () => {\r\n this.applyOption(null);\r\n }\r\n } \r\n }\r\n ngAfterViewInit(): void {\r\n if (this._validationRule) {\r\n this._validationRule.validationCallback = () => { \r\n return this.checkIfValid() \r\n };\r\n }\r\n }\r\n\r\n ngOnChanges(changes: SimpleChanges): void {\r\n if (\r\n changes['value'] || \r\n changes['min'] || changes['max'] || \r\n changes['rangeViolationHandling'] ||\r\n changes['allowEmptyValue']\r\n ) {\r\n this.validateInputs();\r\n } \r\n }\r\n\r\n ngOnInit(): void {}\r\n\r\n public blockNonNumberOrSemicolon(e: any) {\r\n this.isValueSetInternally = false;\r\n }\r\n\r\n public resolveInput() {\r\n if (!this.isValueSetInternally){\r\n if (!this._durationInputResolver.isValidInput(this.inputValue)) {\r\n // we have invalid input. use old value\r\n this.setInputValueInternally(this.value);\r\n this.setValidationStatusAndValidate(true);\r\n } else {\r\n const resolvedValue = this._durationInputResolver.resolve(this.inputValue);\r\n if (resolvedValue === null && this.allowEmptyValue) {\r\n this.setValue(null);\r\n this.setValidationStatusAndValidate(true);\r\n } else if (resolvedValue === null && !this.allowEmptyValue) {\r\n this.setValue(this._durationInputResolver.getDefaultValue());\r\n this.setValidationStatusAndValidate(true);\r\n } else {\r\n // make sure that the value is within the min/max period\r\n if (this._durationInputResolver.isValueWithinLimits(resolvedValue as number, this.min, this.max)) {\r\n this.setValue(resolvedValue);\r\n this.setValidationStatusAndValidate(true);\r\n } else {\r\n // use old value\r\n if (this.rangeViolationHandling === 'autoResolve'){\r\n this.setInputValueInternally(this.value);\r\n this.setValidationStatusAndValidate(true);\r\n } else {\r\n this.setInputValueInternally(resolvedValue);\r\n this.setValidationStatusAndValidate(false);\r\n }\r\n }\r\n }\r\n }\r\n }\r\n }\r\n\r\n public applyOption(value: number | null){\r\n this.showOptions = false;\r\n this.isValueSetInternally = false;\r\n this.setValue(value);\r\n }\r\n\r\n public checkIfValid() {\r\n return this.isValid;\r\n }\r\n\r\n private validateInputs(){\r\n if (this.value === null) {\r\n // handle null input\r\n if (this.allowEmptyValue) {\r\n this.setValue(null);\r\n } else {\r\n this.setValue(this._durationInputResolver.getDefaultValue());\r\n this.inputValue = this._durationPipe.transform(this.value, this.emptyValueText);\r\n }\r\n this.setValidationStatusAndValidate(true);\r\n } else {\r\n // handle value input\r\n if (this._durationInputResolver.isValueWithinLimits(this.value, this.min, this.max)){\r\n this.inputValue = this._durationPipe.transform(this.value, this.emptyValueText);\r\n this.setValidationStatusAndValidate(true);\r\n } else {\r\n // value is out of range\r\n if (this.rangeViolationHandling === 'autoResolve'){\r\n this.setValue(this._durationInputResolver.getDefaultValue(this.min, this.max));\r\n this.inputValue = this._durationPipe.transform(this.value, this.emptyValueText);\r\n this.setValidationStatusAndValidate(true);\r\n } else {\r\n this.inputValue = this._durationPipe.transform(this.value, this.emptyValueText);\r\n this.setValidationStatusAndValidate(false);\r\n }\r\n }\r\n this._validator?.instance.validate();\r\n } \r\n }\r\n\r\n private setValue(value: number | null){\r\n this.isValueEmpty = (value === null);\r\n this.value = value;\r\n this.valueChange.emit(this.value);\r\n this.setInputValueInternally(value);\r\n }\r\n\r\n private setInputValueInternally(value: number | null){\r\n this.isValueSetInternally = true;\r\n setTimeout(() => {\r\n this.inputValue = this._durationPipe.transform(value, this.emptyValueText);\r\n }, 0);\r\n }\r\n\r\n private setValidationStatusAndValidate(isWithinRange: boolean){\r\n this.isValid = (this.rangeViolationHandling === 'autoResolve') || isWithinRange;\r\n this._validator?.instance.validate();\r\n }\r\n\r\n}\r\n","<dx-text-box\r\n #textbox\r\n [id]=\"elementUUID\"\r\n class=\"sds-durationbox\"\r\n [(value)]=\"inputValue\"\r\n (onKeyDown)=\"blockNonNumberOrSemicolon($event)\"\r\n (onChange)=\"resolveInput()\"\r\n [width]=\"width\"\r\n [disabled]=\"disabled\"\r\n >\r\n\r\n <dx-validator \r\n #validator>\r\n <dxi-validation-rule\r\n #validationRule\r\n type=\"custom\"\r\n [message]=\"rangeViolationText\"\r\n [reevaluate]=\"true\"\r\n ></dxi-validation-rule>\r\n </dx-validator>\r\n\r\n <dxi-button\r\n *ngIf=\"allowEmptyValue && showClearButton\"\r\n name=\"clearValue\"\r\n location=\"after\"\r\n [options]=\"clearValueButton\"\r\n ></dxi-button>\r\n \r\n <dxi-button\r\n *ngIf=\"options && options.length > 0\"\r\n name=\"optionsDropdown\"\r\n location=\"after\"\r\n [options]=\"optionsDropdownButton\"\r\n ></dxi-button>\r\n</dx-text-box>\r\n\r\n\r\n<dx-popover\r\n target=\"#{{elementUUID}}\"\r\n [(visible)]=\"showOptions\"\r\n [minWidth]=\"width\"\r\n [closeOnOutsideClick]=\"true\"\r\n [wrapperAttr]=\"{ class: 'sds-durationbox-options-popover' }\"\r\n >\r\n\r\n <div *dxTemplate=\"let data of 'content'\">\r\n <dx-scroll-view>\r\n <button\r\n class=\"dropdown-item border-0\"\r\n [class.selected] = \"isValueEmpty\"\r\n (click)=\"applyOption(null)\"\r\n > {{ emptyValueText}}\r\n </button>\r\n\r\n <div *ngFor=\"let option of options\">\r\n <button\r\n class=\"dropdown-item border-0\"\r\n [class.selected] = \"option === value\"\r\n (click)=\"applyOption(option)\"\r\n > {{option | sdsDurationFormat}}\r\n </button>\r\n </div>\r\n </dx-scroll-view>\r\n </div>\r\n</dx-popover>","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { SdsDurationBoxComponent } from './duration-box.component';\r\nimport { DxPopoverModule, DxScrollViewModule, DxTextBoxModule, DxValidatorModule } from 'devextreme-angular';\r\nimport { SdsDurationPipeModule } from '@spicainternational/ngx-sds-components/src/lib/duration-pipe';\r\n\r\n\r\n\r\nconst components = [\r\n SdsDurationBoxComponent\r\n]\r\n\r\n@NgModule({\r\n declarations: [\r\n SdsDurationBoxComponent\r\n ],\r\n imports: [\r\n CommonModule,\r\n\r\n SdsDurationPipeModule,\r\n \r\n DxTextBoxModule,\r\n DxPopoverModule,\r\n DxScrollViewModule,\r\n DxValidatorModule,\r\n ],\r\n exports: [\r\n ...components\r\n ]\r\n})\r\nexport class SdsDurationBoxModule { }\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i1.DurationService"],"mappings":"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"}
|
|
@@ -3,7 +3,8 @@ import { EventEmitter, Component, ContentChild, Input, Output, ViewChild, NgModu
|
|
|
3
3
|
import * as i2 from '@angular/common';
|
|
4
4
|
import { CommonModule } from '@angular/common';
|
|
5
5
|
import { faXmark } from '@fortawesome/pro-regular-svg-icons';
|
|
6
|
-
import * as i1 from '@
|
|
6
|
+
import * as i1 from '@angular/cdk/a11y';
|
|
7
|
+
import { A11yModule } from '@angular/cdk/a11y';
|
|
7
8
|
import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
|
|
8
9
|
|
|
9
10
|
class SdsModalComponent {
|
|
@@ -52,10 +53,10 @@ class SdsModalComponent {
|
|
|
52
53
|
}
|
|
53
54
|
}
|
|
54
55
|
SdsModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
55
|
-
SdsModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: SdsModalComponent, selector: "sds-modal", inputs: { modalTitle: "modalTitle", showHeader: "showHeader", showFooter: "showFooter", size: "size", modalDialogId: "modalDialogId", showCloseButton: "showCloseButton", translations: "translations", isScrollable: "isScrollable", closeOnEscape: "closeOnEscape" }, outputs: { modalOpen: "modalOpen", modalClose: "modalClose", closeClick: "closeClick" }, queries: [{ propertyName: "headerContent", first: true, predicate: ["header"], descendants: true }], viewQueries: [{ propertyName: "_modal", first: true, predicate: ["modal"], descendants: true }], ngImport: i0, template: "<div #modal class=\"modal\" (keydown)=\"onKeydown($event)\"
|
|
56
|
+
SdsModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: SdsModalComponent, selector: "sds-modal", inputs: { modalTitle: "modalTitle", showHeader: "showHeader", showFooter: "showFooter", size: "size", modalDialogId: "modalDialogId", showCloseButton: "showCloseButton", translations: "translations", isScrollable: "isScrollable", closeOnEscape: "closeOnEscape" }, outputs: { modalOpen: "modalOpen", modalClose: "modalClose", closeClick: "closeClick" }, queries: [{ propertyName: "headerContent", first: true, predicate: ["header"], descendants: true }], viewQueries: [{ propertyName: "_modal", first: true, predicate: ["modal"], descendants: true }], ngImport: i0, template: "<div #modal class=\"modal\" (keydown)=\"onKeydown($event)\" cdkTrapFocus [cdkTrapFocusAutoCapture]=\"true\">\r\n <div\r\n class=\"modal-dialog modal-dialog-centered\"\r\n [class.modal-dialog-scrollable] = \"isScrollable\"\r\n [id]=\"modalDialogId\"\r\n [ngClass]=\"'modal-' + size\"\r\n role=\"document\"\r\n >\r\n <div class=\"modal-content\">\r\n\r\n <div *ngIf=\"showHeader && headerContent\" class=\"modal-header\">\r\n <ng-content select='header'></ng-content>\r\n </div> \r\n\r\n <div *ngIf=\"showHeader && !headerContent\" class=\"modal-header\">\r\n <h5 class=\"modal-title\">{{modalTitle}}</h5>\r\n <button \r\n *ngIf=\"showCloseButton\"\r\n type=\"button\" \r\n class=\"btn-close\" \r\n [title]=\"translations.close ?? ''\"\r\n (click)=\"onCloseButtonClick()\">\r\n </button>\r\n </div>\r\n\r\n <div class=\"modal-body\">\r\n <ng-content></ng-content>\r\n </div>\r\n\r\n <div *ngIf=\"showFooter\" class=\"modal-footer\">\r\n <ng-content select=\"footer\"></ng-content>\r\n </div> \r\n </div>\r\n </div>\r\n</div>", styles: [".modal{background:rgba(0,0,0,.5)}.modal .modal-header button.btn-close:hover{background-color:#e9ecef}.modal.in{opacity:1}.modal.in .modal-dialog{transform:translate(0)}.modal-backdrop.fade{filter:alpha(opacity=0);opacity:0}.modal-backdrop.in{filter:alpha(opacity=50);opacity:.5}\n"], directives: [{ type: i1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
56
57
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsModalComponent, decorators: [{
|
|
57
58
|
type: Component,
|
|
58
|
-
args: [{ selector: 'sds-modal', template: "<div #modal class=\"modal\" (keydown)=\"onKeydown($event)\"
|
|
59
|
+
args: [{ selector: 'sds-modal', template: "<div #modal class=\"modal\" (keydown)=\"onKeydown($event)\" cdkTrapFocus [cdkTrapFocusAutoCapture]=\"true\">\r\n <div\r\n class=\"modal-dialog modal-dialog-centered\"\r\n [class.modal-dialog-scrollable] = \"isScrollable\"\r\n [id]=\"modalDialogId\"\r\n [ngClass]=\"'modal-' + size\"\r\n role=\"document\"\r\n >\r\n <div class=\"modal-content\">\r\n\r\n <div *ngIf=\"showHeader && headerContent\" class=\"modal-header\">\r\n <ng-content select='header'></ng-content>\r\n </div> \r\n\r\n <div *ngIf=\"showHeader && !headerContent\" class=\"modal-header\">\r\n <h5 class=\"modal-title\">{{modalTitle}}</h5>\r\n <button \r\n *ngIf=\"showCloseButton\"\r\n type=\"button\" \r\n class=\"btn-close\" \r\n [title]=\"translations.close ?? ''\"\r\n (click)=\"onCloseButtonClick()\">\r\n </button>\r\n </div>\r\n\r\n <div class=\"modal-body\">\r\n <ng-content></ng-content>\r\n </div>\r\n\r\n <div *ngIf=\"showFooter\" class=\"modal-footer\">\r\n <ng-content select=\"footer\"></ng-content>\r\n </div> \r\n </div>\r\n </div>\r\n</div>", styles: [".modal{background:rgba(0,0,0,.5)}.modal .modal-header button.btn-close:hover{background-color:#e9ecef}.modal.in{opacity:1}.modal.in .modal-dialog{transform:translate(0)}.modal-backdrop.fade{filter:alpha(opacity=0);opacity:0}.modal-backdrop.in{filter:alpha(opacity=50);opacity:.5}\n"] }]
|
|
59
60
|
}], ctorParameters: function () { return []; }, propDecorators: { headerContent: [{
|
|
60
61
|
type: ContentChild,
|
|
61
62
|
args: ['header']
|
|
@@ -101,6 +102,8 @@ class SdsDialogComponent {
|
|
|
101
102
|
this.showCloseButton = true;
|
|
102
103
|
this.showPrimaryButton = true;
|
|
103
104
|
this.showSecondaryButton = true;
|
|
105
|
+
this.dialogOpen = new EventEmitter();
|
|
106
|
+
this.dialogClose = new EventEmitter();
|
|
104
107
|
}
|
|
105
108
|
ngOnInit() { }
|
|
106
109
|
open(callback, data) {
|
|
@@ -132,12 +135,18 @@ class SdsDialogComponent {
|
|
|
132
135
|
this._callback('close', this._callbackData);
|
|
133
136
|
}
|
|
134
137
|
}
|
|
138
|
+
onModalClose() {
|
|
139
|
+
this.dialogClose.emit();
|
|
140
|
+
}
|
|
141
|
+
onModalOpen() {
|
|
142
|
+
this.dialogOpen.emit();
|
|
143
|
+
}
|
|
135
144
|
}
|
|
136
145
|
SdsDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
137
|
-
SdsDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: SdsDialogComponent, selector: "sds-dialog", inputs: { title: "title", closeText: "closeText", size: "size", primaryButtonText: "primaryButtonText", secondaryButtonText: "secondaryButtonText", primaryButtonClass: "primaryButtonClass", secondaryButtonClass: "secondaryButtonClass", showHeader: "showHeader", showCloseButton: "showCloseButton", showPrimaryButton: "showPrimaryButton", showSecondaryButton: "showSecondaryButton" }, viewQueries: [{ propertyName: "_modal", first: true, predicate: ["modal"], descendants: true, static: true }], ngImport: i0, template: "<sds-modal\r\n #modal\r\n [modalTitle]=\"title\"\r\n [size]=\"size\"\r\n [showCloseButton]=\"showCloseButton\"\r\n [showHeader]=\"showHeader\"\r\n [translations]=\"{ close: closeText}\"\r\n (closeClick)=\"onCloseClick()\"\r\n>\r\n <div>\r\n <ng-content></ng-content>\r\n </div>\r\n\r\n <ng-container #footer ngProjectAs='footer'>\r\n <button\r\n *ngIf=\"showSecondaryButton\"\r\n class=\"btn\"\r\n [class]=\"secondaryButtonClass\"\r\n (click)=\"onSecondaryClick()\"\r\n >{{secondaryButtonText}}</button>\r\n <button\r\n *ngIf=\"showPrimaryButton\"\r\n class=\"btn\"\r\n [class]=\"primaryButtonClass\"\r\n (click)=\"onPrimaryClick()\"\r\n >{{primaryButtonText}}</button>\r\n </ng-container>\r\n</sds-modal>\r\n", styles: [""], components: [{ type: SdsModalComponent, selector: "sds-modal", inputs: ["modalTitle", "showHeader", "showFooter", "size", "modalDialogId", "showCloseButton", "translations", "isScrollable", "closeOnEscape"], outputs: ["modalOpen", "modalClose", "closeClick"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
146
|
+
SdsDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: SdsDialogComponent, selector: "sds-dialog", inputs: { title: "title", closeText: "closeText", size: "size", primaryButtonText: "primaryButtonText", secondaryButtonText: "secondaryButtonText", primaryButtonClass: "primaryButtonClass", secondaryButtonClass: "secondaryButtonClass", showHeader: "showHeader", showCloseButton: "showCloseButton", showPrimaryButton: "showPrimaryButton", showSecondaryButton: "showSecondaryButton" }, outputs: { dialogOpen: "dialogOpen", dialogClose: "dialogClose" }, viewQueries: [{ propertyName: "_modal", first: true, predicate: ["modal"], descendants: true, static: true }], ngImport: i0, template: "<sds-modal\r\n #modal\r\n [modalTitle]=\"title\"\r\n [size]=\"size\"\r\n [showCloseButton]=\"showCloseButton\"\r\n [showHeader]=\"showHeader\"\r\n [translations]=\"{ close: closeText}\"\r\n (closeClick)=\"onCloseClick()\"\r\n (modalClose)=\"onModalClose()\"\r\n (modalOpen)=\"onModalOpen()\"\r\n>\r\n <div>\r\n <ng-content></ng-content>\r\n </div>\r\n\r\n <ng-container #footer ngProjectAs='footer'>\r\n <button\r\n *ngIf=\"showSecondaryButton\"\r\n class=\"btn\"\r\n [class]=\"secondaryButtonClass\"\r\n (click)=\"onSecondaryClick()\"\r\n >{{secondaryButtonText}}</button>\r\n <button\r\n *ngIf=\"showPrimaryButton\"\r\n class=\"btn\"\r\n [class]=\"primaryButtonClass\"\r\n (click)=\"onPrimaryClick()\"\r\n >{{primaryButtonText}}</button>\r\n </ng-container>\r\n</sds-modal>\r\n", styles: [""], components: [{ type: SdsModalComponent, selector: "sds-modal", inputs: ["modalTitle", "showHeader", "showFooter", "size", "modalDialogId", "showCloseButton", "translations", "isScrollable", "closeOnEscape"], outputs: ["modalOpen", "modalClose", "closeClick"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
138
147
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsDialogComponent, decorators: [{
|
|
139
148
|
type: Component,
|
|
140
|
-
args: [{ selector: 'sds-dialog', template: "<sds-modal\r\n #modal\r\n [modalTitle]=\"title\"\r\n [size]=\"size\"\r\n [showCloseButton]=\"showCloseButton\"\r\n [showHeader]=\"showHeader\"\r\n [translations]=\"{ close: closeText}\"\r\n (closeClick)=\"onCloseClick()\"\r\n>\r\n <div>\r\n <ng-content></ng-content>\r\n </div>\r\n\r\n <ng-container #footer ngProjectAs='footer'>\r\n <button\r\n *ngIf=\"showSecondaryButton\"\r\n class=\"btn\"\r\n [class]=\"secondaryButtonClass\"\r\n (click)=\"onSecondaryClick()\"\r\n >{{secondaryButtonText}}</button>\r\n <button\r\n *ngIf=\"showPrimaryButton\"\r\n class=\"btn\"\r\n [class]=\"primaryButtonClass\"\r\n (click)=\"onPrimaryClick()\"\r\n >{{primaryButtonText}}</button>\r\n </ng-container>\r\n</sds-modal>\r\n", styles: [""] }]
|
|
149
|
+
args: [{ selector: 'sds-dialog', template: "<sds-modal\r\n #modal\r\n [modalTitle]=\"title\"\r\n [size]=\"size\"\r\n [showCloseButton]=\"showCloseButton\"\r\n [showHeader]=\"showHeader\"\r\n [translations]=\"{ close: closeText}\"\r\n (closeClick)=\"onCloseClick()\"\r\n (modalClose)=\"onModalClose()\"\r\n (modalOpen)=\"onModalOpen()\"\r\n>\r\n <div>\r\n <ng-content></ng-content>\r\n </div>\r\n\r\n <ng-container #footer ngProjectAs='footer'>\r\n <button\r\n *ngIf=\"showSecondaryButton\"\r\n class=\"btn\"\r\n [class]=\"secondaryButtonClass\"\r\n (click)=\"onSecondaryClick()\"\r\n >{{secondaryButtonText}}</button>\r\n <button\r\n *ngIf=\"showPrimaryButton\"\r\n class=\"btn\"\r\n [class]=\"primaryButtonClass\"\r\n (click)=\"onPrimaryClick()\"\r\n >{{primaryButtonText}}</button>\r\n </ng-container>\r\n</sds-modal>\r\n", styles: [""] }]
|
|
141
150
|
}], ctorParameters: function () { return []; }, propDecorators: { title: [{
|
|
142
151
|
type: Input
|
|
143
152
|
}], closeText: [{
|
|
@@ -160,6 +169,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImpor
|
|
|
160
169
|
type: Input
|
|
161
170
|
}], showSecondaryButton: [{
|
|
162
171
|
type: Input
|
|
172
|
+
}], dialogOpen: [{
|
|
173
|
+
type: Output
|
|
174
|
+
}], dialogClose: [{
|
|
175
|
+
type: Output
|
|
163
176
|
}], _modal: [{
|
|
164
177
|
type: ViewChild,
|
|
165
178
|
args: ['modal', { static: true }]
|
|
@@ -174,10 +187,12 @@ class SdsModalModule {
|
|
|
174
187
|
SdsModalModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsModalModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
175
188
|
SdsModalModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsModalModule, declarations: [SdsModalComponent,
|
|
176
189
|
SdsDialogComponent], imports: [CommonModule,
|
|
190
|
+
A11yModule,
|
|
177
191
|
FontAwesomeModule], exports: [SdsModalComponent,
|
|
178
192
|
SdsDialogComponent] });
|
|
179
193
|
SdsModalModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsModalModule, imports: [[
|
|
180
194
|
CommonModule,
|
|
195
|
+
A11yModule,
|
|
181
196
|
FontAwesomeModule
|
|
182
197
|
]] });
|
|
183
198
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsModalModule, decorators: [{
|
|
@@ -188,6 +203,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImpor
|
|
|
188
203
|
],
|
|
189
204
|
imports: [
|
|
190
205
|
CommonModule,
|
|
206
|
+
A11yModule,
|
|
191
207
|
FontAwesomeModule
|
|
192
208
|
],
|
|
193
209
|
exports: [
|