@sankhyalabs/ezui 5.10.8 → 5.11.0-dev.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +0 -1
- package/dist/cjs/{CSSVarsUtils-af809e73.js → CSSVarsUtils-b136a156.js} +5 -0
- package/dist/cjs/RecordValidationProcessor-edd23705.js +102 -0
- package/dist/cjs/ez-actions-button.cjs.entry.js +1 -1
- package/dist/cjs/ez-calendar.cjs.entry.js +34 -5
- package/dist/cjs/ez-combo-box.cjs.entry.js +89 -14
- package/dist/cjs/ez-date-input.cjs.entry.js +53 -22
- package/dist/cjs/ez-date-time-input.cjs.entry.js +53 -19
- package/dist/cjs/ez-filter-input_2.cjs.entry.js +1 -1
- package/dist/cjs/ez-form.cjs.entry.js +9 -83
- package/dist/cjs/ez-grid.cjs.entry.js +488 -6
- package/dist/cjs/ez-number-input.cjs.entry.js +39 -15
- package/dist/cjs/ez-search.cjs.entry.js +11 -2
- package/dist/cjs/ez-text-area.cjs.entry.js +6 -2
- package/dist/cjs/ez-text-input.cjs.entry.js +7 -4
- package/dist/cjs/ez-time-input.cjs.entry.js +11 -7
- package/dist/cjs/ezui.cjs.js +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/collection-manifest.json +2 -2
- package/dist/collection/components/ez-calendar/ez-calendar.js +63 -6
- package/dist/collection/components/ez-combo-box/ez-combo-box.css +6 -0
- package/dist/collection/components/ez-combo-box/ez-combo-box.js +122 -12
- package/dist/collection/components/ez-date-input/ez-date-input.js +71 -21
- package/dist/collection/components/ez-date-time-input/ez-date-time-input.js +71 -18
- package/dist/collection/components/ez-grid/controller/ag-grid/AgGridController.js +40 -7
- package/dist/collection/components/ez-grid/controller/ag-grid/DataSource.js +1 -0
- package/dist/collection/components/ez-grid/controller/ag-grid/GridEditionManager.js +230 -0
- package/dist/collection/components/ez-grid/controller/ag-grid/editor/EzCellEditor.js +49 -0
- package/dist/collection/components/ez-grid/controller/ag-grid/editor/GridEditorUtils.js +10 -0
- package/dist/collection/components/ez-grid/controller/ag-grid/editor/IEditorMetadata.js +4 -0
- package/dist/collection/components/ez-grid/controller/ag-grid/editor/templates/ComboBox.tpl.js +38 -0
- package/dist/collection/components/ez-grid/controller/ag-grid/editor/templates/DateInput.tpl.js +40 -0
- package/dist/collection/components/ez-grid/controller/ag-grid/editor/templates/NumberInput.tpl.js +20 -0
- package/dist/collection/components/ez-grid/controller/ag-grid/editor/templates/Search.tpl.js +15 -0
- package/dist/collection/components/ez-grid/controller/ag-grid/editor/templates/TextInput.tpl.js +41 -0
- package/dist/collection/components/ez-grid/ez-grid.js +67 -0
- package/dist/collection/components/ez-number-input/ez-number-input.css +4 -0
- package/dist/collection/components/ez-number-input/ez-number-input.js +62 -15
- package/dist/collection/components/ez-search/ez-search.css +1 -1
- package/dist/collection/components/ez-search/ez-search.js +46 -1
- package/dist/collection/components/ez-text-area/ez-text-area.css +4 -0
- package/dist/collection/components/ez-text-area/ez-text-area.js +23 -1
- package/dist/collection/components/ez-text-input/ez-text-input.css +8 -1
- package/dist/collection/components/ez-text-input/ez-text-input.js +14 -5
- package/dist/collection/components/ez-time-input/ez-time-input.css +4 -0
- package/dist/collection/components/ez-time-input/ez-time-input.js +18 -7
- package/dist/collection/utils/CSSVarsUtils.js +5 -0
- package/dist/collection/utils/form/DataBinder.js +7 -62
- package/dist/collection/utils/form/FormMetadata.js +3 -22
- package/dist/collection/utils/interfaces/AbstractFieldMetadata.js +21 -0
- package/dist/collection/utils/validators/recordvalidator/IValidationResult.js +1 -0
- package/dist/collection/utils/validators/recordvalidator/IValidationSource.js +1 -0
- package/dist/collection/utils/validators/recordvalidator/RecordValidationProcessor.js +74 -0
- package/dist/custom-elements/index.js +922 -203
- package/dist/esm/{CSSVarsUtils-00f67f32.js → CSSVarsUtils-a97cfa29.js} +5 -0
- package/dist/esm/RecordValidationProcessor-abc814af.js +99 -0
- package/dist/esm/ez-actions-button.entry.js +1 -1
- package/dist/esm/ez-calendar.entry.js +35 -6
- package/dist/esm/ez-combo-box.entry.js +89 -14
- package/dist/esm/ez-date-input.entry.js +53 -22
- package/dist/esm/ez-date-time-input.entry.js +53 -19
- package/dist/esm/ez-filter-input_2.entry.js +1 -1
- package/dist/esm/ez-form.entry.js +10 -84
- package/dist/esm/ez-grid.entry.js +489 -7
- package/dist/esm/ez-number-input.entry.js +39 -15
- package/dist/esm/ez-search.entry.js +11 -2
- package/dist/esm/ez-text-area.entry.js +6 -2
- package/dist/esm/ez-text-input.entry.js +7 -4
- package/dist/esm/ez-time-input.entry.js +11 -7
- package/dist/esm/ezui.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/ezui/ezui.esm.js +1 -1
- package/dist/ezui/p-028f264f.entry.js +1 -0
- package/dist/ezui/p-391de0e4.entry.js +1 -0
- package/dist/ezui/p-4535da17.entry.js +1 -0
- package/dist/ezui/p-5cef0264.entry.js +1 -0
- package/dist/ezui/p-7eb3e1a5.js +1 -0
- package/dist/ezui/p-86a2036d.js +1 -0
- package/dist/ezui/{p-12303d2e.entry.js → p-87e85160.entry.js} +1 -1
- package/dist/ezui/p-90fa4cb3.entry.js +1 -0
- package/dist/ezui/p-9f41b414.entry.js +1 -0
- package/dist/ezui/p-ce035beb.entry.js +1 -0
- package/dist/ezui/p-d43b22f3.entry.js +1 -0
- package/dist/ezui/p-e2dfd935.entry.js +1 -0
- package/dist/ezui/p-e67d0bd5.entry.js +1 -0
- package/dist/ezui/{p-c7a23be9.entry.js → p-fd54b5b4.entry.js} +2 -2
- package/dist/ezui/{p-f1a537e3.entry.js → p-ff82b176.entry.js} +1 -1
- package/dist/types/components/ez-calendar/ez-calendar.d.ts +9 -1
- package/dist/types/components/ez-combo-box/ez-combo-box.d.ts +14 -0
- package/dist/types/components/ez-date-input/ez-date-input.d.ts +4 -0
- package/dist/types/components/ez-date-time-input/ez-date-time-input.d.ts +4 -0
- package/dist/types/components/ez-form-view/interfaces/IFormViewField.d.ts +2 -14
- package/dist/types/components/ez-grid/controller/EzGridController.d.ts +18 -0
- package/dist/types/components/ez-grid/controller/ag-grid/AgGridController.d.ts +4 -0
- package/dist/types/components/ez-grid/controller/ag-grid/GridEditionManager.d.ts +38 -0
- package/dist/types/components/ez-grid/controller/ag-grid/editor/EzCellEditor.d.ts +10 -0
- package/dist/types/components/ez-grid/controller/ag-grid/editor/GridEditorUtils.d.ts +1 -0
- package/dist/types/components/ez-grid/controller/ag-grid/editor/IEditorMetadata.d.ts +9 -0
- package/dist/types/components/ez-grid/controller/ag-grid/editor/IUICellEditor.d.ts +10 -0
- package/dist/types/components/ez-grid/controller/ag-grid/editor/templates/ComboBox.tpl.d.ts +4 -0
- package/dist/types/components/ez-grid/controller/ag-grid/editor/templates/DateInput.tpl.d.ts +5 -0
- package/dist/types/components/ez-grid/controller/ag-grid/editor/templates/NumberInput.tpl.d.ts +4 -0
- package/dist/types/components/ez-grid/controller/ag-grid/editor/templates/Search.tpl.d.ts +3 -0
- package/dist/types/components/ez-grid/controller/ag-grid/editor/templates/TextInput.tpl.d.ts +4 -0
- package/dist/types/components/ez-grid/ez-grid.d.ts +13 -0
- package/dist/types/components/ez-number-input/ez-number-input.d.ts +5 -1
- package/dist/types/components/ez-search/ez-search.d.ts +6 -1
- package/dist/types/components/ez-text-area/ez-text-area.d.ts +4 -0
- package/dist/types/components/ez-text-input/ez-text-input.d.ts +4 -1
- package/dist/types/components/ez-time-input/ez-time-input.d.ts +2 -1
- package/dist/types/components.d.ts +65 -6
- package/dist/types/utils/form/DataBinder.d.ts +1 -3
- package/dist/types/utils/form/interfaces/IFormConfig.d.ts +1 -1
- package/dist/types/utils/form/interfaces/index.d.ts +4 -4
- package/dist/types/utils/interfaces/AbstractFieldMetadata.d.ts +17 -0
- package/dist/types/utils/{form/interfaces → interfaces}/IFieldConfig.d.ts +2 -2
- package/dist/types/utils/validators/recordvalidator/IValidationSource.d.ts +6 -0
- package/dist/types/utils/validators/recordvalidator/RecordValidationProcessor.d.ts +13 -0
- package/package.json +2 -2
- package/dist/ezui/p-00c7c25d.entry.js +0 -1
- package/dist/ezui/p-0b160fec.entry.js +0 -1
- package/dist/ezui/p-0bd54a6f.entry.js +0 -1
- package/dist/ezui/p-39153935.entry.js +0 -1
- package/dist/ezui/p-4a5e37a7.js +0 -1
- package/dist/ezui/p-5782443e.entry.js +0 -1
- package/dist/ezui/p-5d45e384.entry.js +0 -1
- package/dist/ezui/p-70ea4beb.entry.js +0 -1
- package/dist/ezui/p-78a6e049.entry.js +0 -1
- package/dist/ezui/p-8bcb197f.entry.js +0 -1
- package/dist/ezui/p-a4c9f3c4.entry.js +0 -1
- /package/dist/collection/{utils/form/interfaces/IFieldConfig.js → components/ez-grid/controller/ag-grid/editor/IUICellEditor.js} +0 -0
- /package/dist/collection/utils/{form/interfaces/IInvalidField.js → interfaces/IFieldConfig.js} +0 -0
- /package/dist/collection/utils/{form/interfaces/IRecordValidator.js → validators/recordvalidator/IInvalidField.js} +0 -0
- /package/dist/collection/utils/{form/interfaces/IValidationResult.js → validators/recordvalidator/IRecordValidator.js} +0 -0
- /package/dist/types/utils/{form/interfaces → validators/recordvalidator}/IInvalidField.d.ts +0 -0
- /package/dist/types/utils/{form/interfaces → validators/recordvalidator}/IRecordValidator.d.ts +0 -0
- /package/dist/types/utils/{form/interfaces → validators/recordvalidator}/IValidationResult.d.ts +0 -0
|
@@ -4,6 +4,8 @@ import CSSVarsUtils from "../../utils/CSSVarsUtils";
|
|
|
4
4
|
export class EzNumberInput {
|
|
5
5
|
constructor() {
|
|
6
6
|
this._focused = false;
|
|
7
|
+
this._changePending = false;
|
|
8
|
+
this._valuePromiseCallbacks = [];
|
|
7
9
|
this.label = undefined;
|
|
8
10
|
this.value = undefined;
|
|
9
11
|
this.enabled = true;
|
|
@@ -16,8 +18,8 @@ export class EzNumberInput {
|
|
|
16
18
|
/**
|
|
17
19
|
* Aplica o foco no campo.
|
|
18
20
|
*/
|
|
19
|
-
async setFocus() {
|
|
20
|
-
this._textInput.setFocus();
|
|
21
|
+
async setFocus(options) {
|
|
22
|
+
this._textInput.setFocus(options);
|
|
21
23
|
}
|
|
22
24
|
/**
|
|
23
25
|
* Remove o foco do campo.
|
|
@@ -31,6 +33,18 @@ export class EzNumberInput {
|
|
|
31
33
|
async isInvalid() {
|
|
32
34
|
return typeof this.errorMessage === "string" && this.errorMessage.trim() !== "";
|
|
33
35
|
}
|
|
36
|
+
/*
|
|
37
|
+
* Retorna uma promise com o valor da opção selecionada,
|
|
38
|
+
* que será resolvida quando o backend devolver este dado.
|
|
39
|
+
*/
|
|
40
|
+
async getValueAsync() {
|
|
41
|
+
if (this._changePending) {
|
|
42
|
+
return new Promise(accept => {
|
|
43
|
+
this._valuePromiseCallbacks.push(accept);
|
|
44
|
+
});
|
|
45
|
+
}
|
|
46
|
+
return Promise.resolve(this.value);
|
|
47
|
+
}
|
|
34
48
|
observeLabel() {
|
|
35
49
|
if (this._textInput) {
|
|
36
50
|
this._textInput.label = this.label;
|
|
@@ -66,6 +80,7 @@ export class EzNumberInput {
|
|
|
66
80
|
this.ezChange.emit(valueEmitted);
|
|
67
81
|
}
|
|
68
82
|
}
|
|
83
|
+
this._changePending = false;
|
|
69
84
|
}
|
|
70
85
|
validateValue(value) {
|
|
71
86
|
return isNaN(value) || value === undefined ? null : value;
|
|
@@ -92,24 +107,33 @@ export class EzNumberInput {
|
|
|
92
107
|
this.ezCancelWaitingChange.emit();
|
|
93
108
|
}
|
|
94
109
|
handleBlur() {
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
110
|
+
try {
|
|
111
|
+
const parsedNumber = this.getParsedNumber();
|
|
112
|
+
if (parsedNumber !== undefined && isNaN(parsedNumber)) {
|
|
113
|
+
this.setError("O valor digitado não é um número válido");
|
|
114
|
+
}
|
|
115
|
+
else {
|
|
116
|
+
try {
|
|
117
|
+
this.changeValue(parsedNumber);
|
|
118
|
+
}
|
|
119
|
+
catch (e) {
|
|
120
|
+
this.setError(e.message);
|
|
121
|
+
return;
|
|
122
|
+
}
|
|
102
123
|
}
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
124
|
+
}
|
|
125
|
+
finally {
|
|
126
|
+
for (const callback of this._valuePromiseCallbacks) {
|
|
127
|
+
callback(this.value);
|
|
106
128
|
}
|
|
129
|
+
this._valuePromiseCallbacks = [];
|
|
107
130
|
}
|
|
108
131
|
}
|
|
109
132
|
handleInput() {
|
|
110
133
|
const parsedNumber = this.getParsedNumber();
|
|
111
134
|
if (parsedNumber !== this.value) {
|
|
112
135
|
this._focused = true;
|
|
136
|
+
this._changePending = true;
|
|
113
137
|
this.ezStartChange.emit({ waitmessage: "", blocking: false });
|
|
114
138
|
}
|
|
115
139
|
}
|
|
@@ -132,7 +156,7 @@ export class EzNumberInput {
|
|
|
132
156
|
}
|
|
133
157
|
render() {
|
|
134
158
|
ElementIDUtils.addIDInfoIfNotExists(this._elem, 'input');
|
|
135
|
-
return (h("ez-text-input", { "data-element-id": ElementIDUtils.getInternalIDInfo("textInput"), ref: elem => this._textInput = elem, "data-slave-mode": "true", label: this.label, onBlur: () => this.handleBlur(), onInput: () => this.handleInput(), restrict: this.precision > 0 ? "0123456789-,." : "0123456789-", enabled: this.enabled, errorMessage: this.errorMessage, mode: this.mode, canShowError: this.canShowError }));
|
|
159
|
+
return (h("ez-text-input", { class: "number__input", "data-element-id": ElementIDUtils.getInternalIDInfo("textInput"), ref: elem => this._textInput = elem, "data-slave-mode": "true", label: this.label, onBlur: () => this.handleBlur(), onInput: () => this.handleInput(), restrict: this.precision > 0 ? "0123456789-,." : "0123456789-", enabled: this.enabled, errorMessage: this.errorMessage, mode: this.mode, canShowError: this.canShowError }));
|
|
136
160
|
}
|
|
137
161
|
static get is() { return "ez-number-input"; }
|
|
138
162
|
static get encapsulation() { return "shadow"; }
|
|
@@ -346,11 +370,18 @@ export class EzNumberInput {
|
|
|
346
370
|
return {
|
|
347
371
|
"setFocus": {
|
|
348
372
|
"complexType": {
|
|
349
|
-
"signature": "() => Promise<void>",
|
|
350
|
-
"parameters": [
|
|
373
|
+
"signature": "(options?: TFocusOptions) => Promise<void>",
|
|
374
|
+
"parameters": [{
|
|
375
|
+
"tags": [],
|
|
376
|
+
"text": ""
|
|
377
|
+
}],
|
|
351
378
|
"references": {
|
|
352
379
|
"Promise": {
|
|
353
380
|
"location": "global"
|
|
381
|
+
},
|
|
382
|
+
"TFocusOptions": {
|
|
383
|
+
"location": "import",
|
|
384
|
+
"path": "../ez-text-input/ez-text-input"
|
|
354
385
|
}
|
|
355
386
|
},
|
|
356
387
|
"return": "Promise<void>"
|
|
@@ -391,6 +422,22 @@ export class EzNumberInput {
|
|
|
391
422
|
"text": "Retorna se o conte\u00FAdo \u00E9 inv\u00E1lido.",
|
|
392
423
|
"tags": []
|
|
393
424
|
}
|
|
425
|
+
},
|
|
426
|
+
"getValueAsync": {
|
|
427
|
+
"complexType": {
|
|
428
|
+
"signature": "() => Promise<number>",
|
|
429
|
+
"parameters": [],
|
|
430
|
+
"references": {
|
|
431
|
+
"Promise": {
|
|
432
|
+
"location": "global"
|
|
433
|
+
}
|
|
434
|
+
},
|
|
435
|
+
"return": "Promise<number>"
|
|
436
|
+
},
|
|
437
|
+
"docs": {
|
|
438
|
+
"text": "",
|
|
439
|
+
"tags": []
|
|
440
|
+
}
|
|
394
441
|
}
|
|
395
442
|
};
|
|
396
443
|
}
|
|
@@ -13,6 +13,7 @@ export class EzSearch {
|
|
|
13
13
|
this.suppressEmptyOption = false;
|
|
14
14
|
this.mode = "regular";
|
|
15
15
|
this.canShowError = true;
|
|
16
|
+
this.listOptionsPosition = undefined;
|
|
16
17
|
}
|
|
17
18
|
observeErrorMessage() {
|
|
18
19
|
if (this._comboElement) {
|
|
@@ -49,6 +50,14 @@ export class EzSearch {
|
|
|
49
50
|
var _a, _b;
|
|
50
51
|
(_b = (_a = this._comboElement) === null || _a === void 0 ? void 0 : _a['clearValue']) === null || _b === void 0 ? void 0 : _b.call(_a);
|
|
51
52
|
}
|
|
53
|
+
/*
|
|
54
|
+
* Retorna uma promise com o valor da opção selecionada,
|
|
55
|
+
* que será resolvida quando o backend devolver este dado.
|
|
56
|
+
*/
|
|
57
|
+
async getValueAsync() {
|
|
58
|
+
var _a;
|
|
59
|
+
return (_a = this._comboElement) === null || _a === void 0 ? void 0 : _a.getValueAsync();
|
|
60
|
+
}
|
|
52
61
|
onComboChange(event) {
|
|
53
62
|
event.stopPropagation();
|
|
54
63
|
this.value = event.detail;
|
|
@@ -62,7 +71,7 @@ export class EzSearch {
|
|
|
62
71
|
}
|
|
63
72
|
render() {
|
|
64
73
|
ElementIDUtils.addIDInfoIfNotExists(this._elem, 'input');
|
|
65
|
-
return (h("ez-combo-box", { "data-element-id": ElementIDUtils.getInternalIDInfo("combo"), ref: elem => this._comboElement = elem, value: this.value, label: this.label, enabled: this.enabled, errorMessage: this.errorMessage, optionLoader: this.optionLoader, searchMode: true, onEzChange: event => this.onComboChange(event), showSelectedValue: this.showSelectedValue, showOptionValue: this.showOptionValue, suppressEmptyOption: this.suppressEmptyOption, mode: this.mode, canShowError: this.canShowError }));
|
|
74
|
+
return (h("ez-combo-box", { "data-element-id": ElementIDUtils.getInternalIDInfo("combo"), ref: elem => this._comboElement = elem, value: this.value, label: this.label, enabled: this.enabled, errorMessage: this.errorMessage, optionLoader: this.optionLoader, searchMode: true, onEzChange: event => this.onComboChange(event), showSelectedValue: this.showSelectedValue, showOptionValue: this.showOptionValue, suppressEmptyOption: this.suppressEmptyOption, mode: this.mode, canShowError: this.canShowError, listOptionsPosition: this.listOptionsPosition }));
|
|
66
75
|
}
|
|
67
76
|
;
|
|
68
77
|
static get is() { return "ez-search"; }
|
|
@@ -272,6 +281,26 @@ export class EzSearch {
|
|
|
272
281
|
"attribute": "can-show-error",
|
|
273
282
|
"reflect": true,
|
|
274
283
|
"defaultValue": "true"
|
|
284
|
+
},
|
|
285
|
+
"listOptionsPosition": {
|
|
286
|
+
"type": "unknown",
|
|
287
|
+
"mutable": false,
|
|
288
|
+
"complexType": {
|
|
289
|
+
"original": "IEzCheckBoxListPosition",
|
|
290
|
+
"resolved": "IEzCheckBoxListPosition",
|
|
291
|
+
"references": {
|
|
292
|
+
"IEzCheckBoxListPosition": {
|
|
293
|
+
"location": "import",
|
|
294
|
+
"path": "../ez-combo-box/ez-combo-box"
|
|
295
|
+
}
|
|
296
|
+
}
|
|
297
|
+
},
|
|
298
|
+
"required": false,
|
|
299
|
+
"optional": false,
|
|
300
|
+
"docs": {
|
|
301
|
+
"tags": [],
|
|
302
|
+
"text": "Define um posicionamento fixo para a lista de op\u00E7\u00F5es do CheckBox."
|
|
303
|
+
}
|
|
275
304
|
}
|
|
276
305
|
};
|
|
277
306
|
}
|
|
@@ -363,6 +392,22 @@ export class EzSearch {
|
|
|
363
392
|
"text": "Limpa o valor do campo de pesquisa",
|
|
364
393
|
"tags": []
|
|
365
394
|
}
|
|
395
|
+
},
|
|
396
|
+
"getValueAsync": {
|
|
397
|
+
"complexType": {
|
|
398
|
+
"signature": "() => Promise<unknown>",
|
|
399
|
+
"parameters": [],
|
|
400
|
+
"references": {
|
|
401
|
+
"Promise": {
|
|
402
|
+
"location": "global"
|
|
403
|
+
}
|
|
404
|
+
},
|
|
405
|
+
"return": "Promise<unknown>"
|
|
406
|
+
},
|
|
407
|
+
"docs": {
|
|
408
|
+
"text": "",
|
|
409
|
+
"tags": []
|
|
410
|
+
}
|
|
366
411
|
}
|
|
367
412
|
};
|
|
368
413
|
}
|
|
@@ -9,6 +9,7 @@ export class EzTextArea {
|
|
|
9
9
|
this.rows = 4;
|
|
10
10
|
this.canShowError = true;
|
|
11
11
|
this.mode = "regular";
|
|
12
|
+
this.enableResize = false;
|
|
12
13
|
}
|
|
13
14
|
observeErrorMessage() {
|
|
14
15
|
var _a, _b, _c, _d;
|
|
@@ -150,7 +151,10 @@ export class EzTextArea {
|
|
|
150
151
|
ElementIDUtils.addIDInfoIfNotExists(this._hostElement, 'input');
|
|
151
152
|
return (h(Host, null, h("div", { class: "textarea", ref: (el) => this._container = el }, this.label && this.mode != "slim" ?
|
|
152
153
|
h("label", { ref: (el) => this._labelElem = el, class: this.enabled ? "textarea__label" : "textarea__label textarea__label--disabled", onClick: () => this._inputElem.focus(), title: this.label }, this.label)
|
|
153
|
-
: null, h("textarea", { onFocus: () => this.handleFocus(), "data-element-id": ElementIDUtils.getInternalIDInfo("input"), ref: (el) => this._inputElem = el, value: this.value, disabled: !this.enabled, class:
|
|
154
|
+
: null, h("textarea", { onFocus: () => this.handleFocus(), "data-element-id": ElementIDUtils.getInternalIDInfo("input"), ref: (el) => this._inputElem = el, value: this.value, disabled: !this.enabled, class: {
|
|
155
|
+
"textarea--slim": this.mode === "slim",
|
|
156
|
+
"textarea--resizable": this.enableResize
|
|
157
|
+
}, placeholder: this.mode === "slim" && this.label ? this.label : "", onInput: () => { this.handleChange(); }, onFocusout: () => { this.handleFocusout(); }, rows: this.rows })), this.canShowError && this.mode != "slim" &&
|
|
154
158
|
h("span", { class: "message-box", ref: (el) => this._messageBoxElem = el, title: this.errorMessage }, this.errorMessage)));
|
|
155
159
|
}
|
|
156
160
|
static get is() { return "ez-text-area"; }
|
|
@@ -289,6 +293,24 @@ export class EzTextArea {
|
|
|
289
293
|
"attribute": "mode",
|
|
290
294
|
"reflect": true,
|
|
291
295
|
"defaultValue": "\"regular\""
|
|
296
|
+
},
|
|
297
|
+
"enableResize": {
|
|
298
|
+
"type": "boolean",
|
|
299
|
+
"mutable": false,
|
|
300
|
+
"complexType": {
|
|
301
|
+
"original": "boolean",
|
|
302
|
+
"resolved": "boolean",
|
|
303
|
+
"references": {}
|
|
304
|
+
},
|
|
305
|
+
"required": false,
|
|
306
|
+
"optional": false,
|
|
307
|
+
"docs": {
|
|
308
|
+
"tags": [],
|
|
309
|
+
"text": "Ativa a op\u00E7\u00E3o de fazer resize do input."
|
|
310
|
+
},
|
|
311
|
+
"attribute": "enable-resize",
|
|
312
|
+
"reflect": true,
|
|
313
|
+
"defaultValue": "false"
|
|
292
314
|
}
|
|
293
315
|
};
|
|
294
316
|
}
|
|
@@ -60,9 +60,12 @@
|
|
|
60
60
|
/*@doc Define o espaçamento direito do label.*/
|
|
61
61
|
--ez-text-input__label--padding-right: 12px;
|
|
62
62
|
|
|
63
|
+
/*@doc Define a cor do ícone do slot.*/
|
|
64
|
+
--ez-text-input__input--focus--icon-color: var(--ez-text-input__input--focus--border-color);
|
|
65
|
+
|
|
63
66
|
|
|
64
67
|
/***************
|
|
65
|
-
host style
|
|
68
|
+
host style
|
|
66
69
|
***************/
|
|
67
70
|
/*private*/
|
|
68
71
|
display: flex;
|
|
@@ -72,6 +75,10 @@
|
|
|
72
75
|
width: var(--ez-text-input--width);
|
|
73
76
|
}
|
|
74
77
|
|
|
78
|
+
:host(.grid_editor){
|
|
79
|
+
--ez-text-input--height--slim: 25px;
|
|
80
|
+
}
|
|
81
|
+
|
|
75
82
|
input {
|
|
76
83
|
/*private*/
|
|
77
84
|
width: 100%;
|
|
@@ -95,7 +95,10 @@ export class EzTextInput {
|
|
|
95
95
|
/**
|
|
96
96
|
* Aplica o foco no campo.
|
|
97
97
|
*/
|
|
98
|
-
async setFocus() {
|
|
98
|
+
async setFocus(options) {
|
|
99
|
+
const { selectText } = options || {};
|
|
100
|
+
if (selectText)
|
|
101
|
+
this._inputElem.select();
|
|
99
102
|
this._inputElem.focus();
|
|
100
103
|
}
|
|
101
104
|
/**
|
|
@@ -188,7 +191,7 @@ export class EzTextInput {
|
|
|
188
191
|
if (this.label && this._labelElem && !this._labelElem.classList.contains("input__label--floated")) {
|
|
189
192
|
this._labelElem.classList.add("input__label--floated");
|
|
190
193
|
}
|
|
191
|
-
this.adjustColorContentSlot("var(--ez-text-input__input--focus--
|
|
194
|
+
this.adjustColorContentSlot("var(--ez-text-input__input--focus--icon-color)");
|
|
192
195
|
}
|
|
193
196
|
//---------------------------------------------
|
|
194
197
|
// Lifecycle web component
|
|
@@ -218,7 +221,7 @@ export class EzTextInput {
|
|
|
218
221
|
}
|
|
219
222
|
render() {
|
|
220
223
|
ElementIDUtils.addIDInfoIfNotExists(this._hostElement, 'input');
|
|
221
|
-
return (h(Host, null, h("slot", { name: "leftIcon", onSlotchange: (ev) => { this.handleSlotChange(ev); } }), this.label && this.mode != "slim" ?
|
|
224
|
+
return (h(Host, { style: this._hostElement.classList.contains("grid_editor") ? { "height": "100%" } : null }, h("slot", { name: "leftIcon", onSlotchange: (ev) => { this.handleSlotChange(ev); } }), this.label && this.mode != "slim" ?
|
|
222
225
|
h("label", { ref: (el) => this._labelElem = el, class: this.enabled ? "input__label" : "input__label input__label--disabled", onClick: () => this._inputElem.focus(), title: this.label }, this.label)
|
|
223
226
|
: null, h("input", { "data-element-id": ElementIDUtils.getInternalIDInfo("input"), onFocus: () => this.doFocus(), ref: (el) => this._inputElem = el, type: "text", class: this.mode === "slim" ? "input--slim" : "", placeholder: this.mode === "slim" && this.label ? this.label : "", value: this.value, disabled: !this.enabled, onInput: () => { this.handleChange(); }, onFocusout: () => { this.handleFocusout(); } }), h("slot", { name: "rightIcon", onSlotchange: (ev) => { this.handleSlotChange(ev); } }), this.canShowError && this.mode != "slim" &&
|
|
224
227
|
h("span", { class: "message-box", ref: (el) => this._messageBoxElem = el, title: this.errorMessage, "data-element-id": ElementIDUtils.getInternalIDInfo("message_box") }, this.errorMessage)));
|
|
@@ -418,11 +421,17 @@ export class EzTextInput {
|
|
|
418
421
|
return {
|
|
419
422
|
"setFocus": {
|
|
420
423
|
"complexType": {
|
|
421
|
-
"signature": "() => Promise<void>",
|
|
422
|
-
"parameters": [
|
|
424
|
+
"signature": "(options?: TFocusOptions) => Promise<void>",
|
|
425
|
+
"parameters": [{
|
|
426
|
+
"tags": [],
|
|
427
|
+
"text": ""
|
|
428
|
+
}],
|
|
423
429
|
"references": {
|
|
424
430
|
"Promise": {
|
|
425
431
|
"location": "global"
|
|
432
|
+
},
|
|
433
|
+
"TFocusOptions": {
|
|
434
|
+
"location": "local"
|
|
426
435
|
}
|
|
427
436
|
},
|
|
428
437
|
"return": "Promise<void>"
|
|
@@ -90,8 +90,8 @@ export class EzTimeInput {
|
|
|
90
90
|
/**
|
|
91
91
|
* Aplica o foco no campo.
|
|
92
92
|
*/
|
|
93
|
-
async setFocus() {
|
|
94
|
-
this._textInput.setFocus();
|
|
93
|
+
async setFocus({ selectText }) {
|
|
94
|
+
this._textInput.setFocus({ selectText });
|
|
95
95
|
}
|
|
96
96
|
/**
|
|
97
97
|
* Remove o foco do campo.
|
|
@@ -112,11 +112,15 @@ export class EzTimeInput {
|
|
|
112
112
|
if (this._textInput) {
|
|
113
113
|
this._viewValue = this._textInput.value;
|
|
114
114
|
this.prepareValue(this._viewValue);
|
|
115
|
-
|
|
115
|
+
const value = NumberUtils.stringToNumber(this._viewValue.replace(/\D/g, ""));
|
|
116
|
+
this.value = ['string', 'number'].includes(typeof value) ? value : null;
|
|
116
117
|
}
|
|
117
118
|
}
|
|
118
119
|
handleInput() {
|
|
119
|
-
const
|
|
120
|
+
const textInputValue = this._textInput.value;
|
|
121
|
+
if (!['string', 'number'].includes(typeof textInputValue))
|
|
122
|
+
return;
|
|
123
|
+
const parsedNumber = NumberUtils.stringToNumber(textInputValue.replace(/\D/g, ""));
|
|
120
124
|
if (parsedNumber !== this.value) {
|
|
121
125
|
this.ezStartChange.emit({ waitmessage: "", blocking: false });
|
|
122
126
|
}
|
|
@@ -138,7 +142,7 @@ export class EzTimeInput {
|
|
|
138
142
|
}
|
|
139
143
|
render() {
|
|
140
144
|
ElementIDUtils.addIDInfoIfNotExists(this._elem, 'input');
|
|
141
|
-
return (h(Host, null, h("ez-text-input", { "data-element-id": ElementIDUtils.getInternalIDInfo("textInput"), ref: (el) => this._textInput = el, "data-slave-mode": "true", value: this._viewValue, enabled: this.enabled, label: this.label, restrict: "0123456789:", onBlur: () => this.handleBlur(), onInput: () => this.handleInput(), errorMessage: this.errorMessage, mode: this.mode, canShowError: this.canShowError }, h("ez-icon", { slot: "leftIcon", iconName: "timer-outline" }))));
|
|
145
|
+
return (h(Host, null, h("ez-text-input", { class: "time__input", "data-element-id": ElementIDUtils.getInternalIDInfo("textInput"), ref: (el) => this._textInput = el, "data-slave-mode": "true", value: this._viewValue, enabled: this.enabled, label: this.label, restrict: "0123456789:", onBlur: () => this.handleBlur(), onInput: () => this.handleInput(), errorMessage: this.errorMessage, mode: this.mode, canShowError: this.canShowError }, h("ez-icon", { slot: "leftIcon", iconName: "timer-outline" }))));
|
|
142
146
|
}
|
|
143
147
|
static get is() { return "ez-time-input"; }
|
|
144
148
|
static get encapsulation() { return "shadow"; }
|
|
@@ -337,11 +341,18 @@ export class EzTimeInput {
|
|
|
337
341
|
return {
|
|
338
342
|
"setFocus": {
|
|
339
343
|
"complexType": {
|
|
340
|
-
"signature": "() => Promise<void>",
|
|
341
|
-
"parameters": [
|
|
344
|
+
"signature": "({ selectText }: TFocusOptions) => Promise<void>",
|
|
345
|
+
"parameters": [{
|
|
346
|
+
"tags": [],
|
|
347
|
+
"text": ""
|
|
348
|
+
}],
|
|
342
349
|
"references": {
|
|
343
350
|
"Promise": {
|
|
344
351
|
"location": "global"
|
|
352
|
+
},
|
|
353
|
+
"TFocusOptions": {
|
|
354
|
+
"location": "import",
|
|
355
|
+
"path": "../ez-text-input/ez-text-input"
|
|
345
356
|
}
|
|
346
357
|
},
|
|
347
358
|
"return": "Promise<void>"
|
|
@@ -23,6 +23,11 @@ export default class CSSVarsUtils {
|
|
|
23
23
|
CSSVarsUtils.applyIfExists(host, child, '--ez-text-input--height');
|
|
24
24
|
CSSVarsUtils.applyIfExists(host, child, '--ez-text-input__input--disabled--background-color');
|
|
25
25
|
CSSVarsUtils.applyIfExists(host, child, '--ez-text-input__input--disabled--color');
|
|
26
|
+
CSSVarsUtils.applyIfExists(host, child, '--ez-text-input--height--slim');
|
|
27
|
+
CSSVarsUtils.applyIfExists(host, child, '--ez-text-input--border-radius');
|
|
28
|
+
CSSVarsUtils.applyIfExists(host, child, '--ez-text-input__input--focus--border-color');
|
|
29
|
+
CSSVarsUtils.applyIfExists(host, child, '--ez-text-input__icon--width');
|
|
30
|
+
CSSVarsUtils.applyIfExists(host, child, '--ez-text-input__input--focus--icon-color');
|
|
26
31
|
}
|
|
27
32
|
}
|
|
28
33
|
static applyVarsButton(host, child) {
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ApplicationContext, Action, WaitingChangeException, DataUnitAction } from "@sankhyalabs/core";
|
|
2
|
-
import
|
|
2
|
+
import { RecordValidationProcessor } from "../validators/recordvalidator/RecordValidationProcessor";
|
|
3
3
|
export default class DataBinder {
|
|
4
4
|
constructor(dataUnit) {
|
|
5
5
|
this.onDataUnitEvent = (action) => {
|
|
@@ -55,7 +55,11 @@ export default class DataBinder {
|
|
|
55
55
|
}
|
|
56
56
|
});
|
|
57
57
|
this._formMetadata = formMetadata;
|
|
58
|
-
this.
|
|
58
|
+
this._recordValidatorProcessor = new RecordValidationProcessor(this._dataUnit, {
|
|
59
|
+
getRequiredFields: () => this._formMetadata.getRequiredFields(),
|
|
60
|
+
markAsInvalid: field => this.markInvalid(field),
|
|
61
|
+
getMessageForField: field => this.getErrorMessage(field)
|
|
62
|
+
}, recordsValidator);
|
|
59
63
|
}
|
|
60
64
|
onDisconnectedCallback() {
|
|
61
65
|
this._dataUnit.unsubscribe(this.onDataUnitEvent);
|
|
@@ -66,7 +70,6 @@ export default class DataBinder {
|
|
|
66
70
|
return record === null || record === void 0 ? void 0 : record.__record__id__;
|
|
67
71
|
}
|
|
68
72
|
markInvalid(field) {
|
|
69
|
-
this._dataUnit.setInvalidField(field.name, field.message, this.getCurrentRecordId());
|
|
70
73
|
if (this._fields.has(field.name)) {
|
|
71
74
|
const fieldElement = this._fields.get(field.name).field;
|
|
72
75
|
this.updateErrorMessage(field.name, fieldElement, field.message);
|
|
@@ -95,65 +98,7 @@ export default class DataBinder {
|
|
|
95
98
|
}
|
|
96
99
|
}
|
|
97
100
|
validate() {
|
|
98
|
-
return
|
|
99
|
-
var _a;
|
|
100
|
-
const records = this._dataUnit.getModifiedRecords();
|
|
101
|
-
for (let i = 0; i < records.length; i++) {
|
|
102
|
-
const record = records[i];
|
|
103
|
-
const invalidResults = [];
|
|
104
|
-
let validationResult = this.validateRequired(record);
|
|
105
|
-
if (validationResult && !validationResult.isValid) {
|
|
106
|
-
invalidResults.push(validationResult);
|
|
107
|
-
}
|
|
108
|
-
validationResult = (_a = this._recordsValidator) === null || _a === void 0 ? void 0 : _a.validateRecord(record);
|
|
109
|
-
if (validationResult && !validationResult.isValid) {
|
|
110
|
-
invalidResults.push(validationResult);
|
|
111
|
-
}
|
|
112
|
-
if (invalidResults.length > 0) {
|
|
113
|
-
this.processValidationResult(invalidResults);
|
|
114
|
-
reject();
|
|
115
|
-
break;
|
|
116
|
-
}
|
|
117
|
-
}
|
|
118
|
-
return accept();
|
|
119
|
-
});
|
|
120
|
-
}
|
|
121
|
-
validateRequired(record) {
|
|
122
|
-
const requiredFields = this._formMetadata.getRequiredFields();
|
|
123
|
-
const invalidFields = [];
|
|
124
|
-
new Set(requiredFields).forEach(field => {
|
|
125
|
-
const value = record[field];
|
|
126
|
-
if (value == undefined || value === "") {
|
|
127
|
-
const errorMessage = this.getErrorMessage(field);
|
|
128
|
-
if (errorMessage) {
|
|
129
|
-
invalidFields.push({ name: field, message: errorMessage });
|
|
130
|
-
}
|
|
131
|
-
else {
|
|
132
|
-
invalidFields.push({ name: field, message: "Essa informação é obrigatória" });
|
|
133
|
-
}
|
|
134
|
-
}
|
|
135
|
-
});
|
|
136
|
-
if (invalidFields.length > 0) {
|
|
137
|
-
return { isValid: false, invalidFields, infoMessage: "Há pelo menos um campo obrigatório não preenchido." };
|
|
138
|
-
}
|
|
139
|
-
return undefined;
|
|
140
|
-
}
|
|
141
|
-
processValidationResult(validationResult) {
|
|
142
|
-
validationResult.forEach(invalidResult => {
|
|
143
|
-
const invalidFields = invalidResult.invalidFields;
|
|
144
|
-
if (invalidFields) {
|
|
145
|
-
invalidFields.forEach(field => {
|
|
146
|
-
this.markInvalid(field);
|
|
147
|
-
});
|
|
148
|
-
}
|
|
149
|
-
if (invalidResult.infoMessage) {
|
|
150
|
-
ApplicationUtils.info(invalidResult.infoMessage);
|
|
151
|
-
}
|
|
152
|
-
if (invalidResult.errorMessage) {
|
|
153
|
-
const { errorTitle, errorMessage } = invalidResult;
|
|
154
|
-
ApplicationUtils.error(errorTitle, errorMessage);
|
|
155
|
-
}
|
|
156
|
-
});
|
|
101
|
+
return this._recordValidatorProcessor.validate();
|
|
157
102
|
}
|
|
158
103
|
updateErrorMessage(fieldName, field, message) {
|
|
159
104
|
if (message == undefined) {
|
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
import { DateUtils
|
|
1
|
+
import { DateUtils } from "@sankhyalabs/core";
|
|
2
|
+
import { buildFieldMetadata } from "../interfaces/AbstractFieldMetadata";
|
|
2
3
|
const DETAIL_PATTERN = /child\[([^\]]+)\]/;
|
|
3
4
|
const REGEX_DEFAULT_VAR_KEY = /\$\{.+\}/;
|
|
4
5
|
export class FormMetadata {
|
|
@@ -100,7 +101,7 @@ export const buildFormMetadata = (config, dataUnit, includeDetails = false) => {
|
|
|
100
101
|
if (!sheets.has(tabConfig)) {
|
|
101
102
|
sheets.set(tabConfig, []);
|
|
102
103
|
}
|
|
103
|
-
const formField =
|
|
104
|
+
const formField = buildFieldMetadata(descriptor, field);
|
|
104
105
|
sheets.get(tabConfig).push(formField);
|
|
105
106
|
if (formField.required) {
|
|
106
107
|
requiredFields.push(field.name);
|
|
@@ -159,26 +160,6 @@ export const buildFormMetadata = (config, dataUnit, includeDetails = false) => {
|
|
|
159
160
|
metadata.addDefaultValues(defaultValues);
|
|
160
161
|
return metadata;
|
|
161
162
|
};
|
|
162
|
-
const buildFormField = (descriptor, config) => {
|
|
163
|
-
let { name, label, group } = Object.assign({}, config);
|
|
164
|
-
let { readOnly, required } = Object.assign({}, config);
|
|
165
|
-
let props;
|
|
166
|
-
let userInterface;
|
|
167
|
-
if (descriptor) {
|
|
168
|
-
label = label || descriptor.label;
|
|
169
|
-
name = name || descriptor.name;
|
|
170
|
-
required = descriptor.required || (config === null || config === void 0 ? void 0 : config.required);
|
|
171
|
-
readOnly = descriptor.readOnly || (config === null || config === void 0 ? void 0 : config.readOnly);
|
|
172
|
-
props = descriptor.properties;
|
|
173
|
-
userInterface = descriptor.userInterface;
|
|
174
|
-
}
|
|
175
|
-
return {
|
|
176
|
-
name, label, group,
|
|
177
|
-
readOnly, required,
|
|
178
|
-
props,
|
|
179
|
-
userInterface: userInterface || UserInterface.SHORTTEXT
|
|
180
|
-
};
|
|
181
|
-
};
|
|
182
163
|
const getTabConfig = (tab, sheets) => {
|
|
183
164
|
const tabConfig = (typeof tab === "string" ? Array.from(sheets.keys()).find(t => t.label === tab) : tab);
|
|
184
165
|
return tabConfig || { label: tab, visible: true };
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import { UserInterface } from "@sankhyalabs/core";
|
|
2
|
+
export const buildFieldMetadata = (descriptor, config) => {
|
|
3
|
+
let { name, label, group } = Object.assign({}, config);
|
|
4
|
+
let { readOnly, required } = Object.assign({}, config);
|
|
5
|
+
let props;
|
|
6
|
+
let userInterface;
|
|
7
|
+
if (descriptor) {
|
|
8
|
+
label = label || descriptor.label;
|
|
9
|
+
name = name || descriptor.name;
|
|
10
|
+
required = descriptor.required || (config === null || config === void 0 ? void 0 : config.required);
|
|
11
|
+
readOnly = descriptor.readOnly || (config === null || config === void 0 ? void 0 : config.readOnly);
|
|
12
|
+
props = descriptor.properties;
|
|
13
|
+
userInterface = descriptor.userInterface;
|
|
14
|
+
}
|
|
15
|
+
return {
|
|
16
|
+
name, label, group,
|
|
17
|
+
readOnly, required,
|
|
18
|
+
props,
|
|
19
|
+
userInterface: userInterface || UserInterface.SHORTTEXT
|
|
20
|
+
};
|
|
21
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|