@sankhyalabs/ezui 5.20.0-dev.1 → 5.20.0-dev.11
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 +4 -5
- package/dist/cjs/ez-alert-list.cjs.entry.js +33 -28
- package/dist/cjs/ez-card-item_3.cjs.entry.js +182 -0
- package/dist/cjs/ez-combo-box.cjs.entry.js +12 -156
- package/dist/cjs/ez-date-input.cjs.entry.js +3 -0
- package/dist/cjs/ez-date-time-input.cjs.entry.js +3 -0
- package/dist/cjs/ez-form-view.cjs.entry.js +4 -2
- package/dist/cjs/ez-grid.cjs.entry.js +27 -21
- package/dist/cjs/ez-icon.cjs.entry.js +1 -1
- package/dist/cjs/ez-multi-selection-list.cjs.entry.js +2 -10
- package/dist/cjs/ez-number-input.cjs.entry.js +3 -0
- package/dist/cjs/ez-popup.cjs.entry.js +1 -1
- package/dist/cjs/ez-search.cjs.entry.js +611 -31
- package/dist/cjs/ez-split-button.cjs.entry.js +147 -0
- package/dist/cjs/ez-split-item.cjs.entry.js +12 -2
- package/dist/cjs/ez-split-panel.cjs.entry.js +15 -12
- package/dist/cjs/ezui.cjs.js +1 -1
- package/dist/cjs/filter-column.cjs.entry.js +16 -5
- package/dist/cjs/index-a7b0c73d.js +10 -10
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/collection-manifest.json +4 -3
- package/dist/collection/components/ez-alert-list/ez-alert-list.js +33 -28
- package/dist/collection/components/ez-card-item/ez-card-item.css +35 -0
- package/dist/collection/components/ez-combo-box/ez-combo-box.js +13 -174
- package/dist/collection/components/ez-date-input/ez-date-input.js +3 -0
- package/dist/collection/components/ez-date-time-input/ez-date-time-input.js +3 -0
- package/dist/collection/components/ez-form-view/fieldbuilder/templates/FileInput.tpl.js +4 -2
- package/dist/collection/components/ez-grid/controller/ag-grid/AgGridController.js +11 -10
- package/dist/collection/components/ez-grid/controller/ag-grid/DataSource.js +15 -1
- package/dist/collection/components/ez-grid/controller/ag-grid/components/EzGridCustomHeader.js +1 -3
- package/dist/collection/components/ez-grid/ez-grid.css +1 -0
- package/dist/collection/components/ez-grid/ez-grid.js +2 -2
- package/dist/collection/components/ez-grid/subcomponents/filter-column.js +16 -5
- package/dist/collection/components/ez-icon/ez-icon.css +1 -1
- package/dist/collection/components/ez-multi-selection-list/ez-multi-selection-list.js +2 -10
- package/dist/collection/components/ez-number-input/ez-number-input.js +3 -0
- package/dist/collection/components/ez-popup/ez-popup.css +0 -1
- package/dist/collection/components/ez-search/ez-search.css +331 -0
- package/dist/collection/components/ez-search/ez-search.js +689 -55
- package/dist/collection/components/ez-split-button/ez-split-button.css +229 -0
- package/dist/collection/components/ez-split-button/ez-split-button.js +436 -0
- package/dist/collection/components/ez-split-button/test/dropdownItems.js +42 -0
- package/dist/collection/components/ez-split-panel/ez-split-panel.css +6 -7
- package/dist/collection/components/ez-split-panel/ez-split-panel.js +35 -14
- package/dist/collection/components/ez-split-panel/structure/item/ez-split-item.css +40 -12
- package/dist/collection/components/ez-split-panel/structure/item/ez-split-item.js +78 -2
- package/dist/collection/utils/form/test/DataBinder.test.js +9 -0
- package/dist/custom-elements/index.d.ts +6 -0
- package/dist/custom-elements/index.js +895 -281
- package/dist/esm/ez-alert-list.entry.js +33 -28
- package/dist/esm/ez-card-item_3.entry.js +176 -0
- package/dist/esm/ez-combo-box.entry.js +13 -157
- package/dist/esm/ez-date-input.entry.js +3 -0
- package/dist/esm/ez-date-time-input.entry.js +3 -0
- package/dist/esm/ez-form-view.entry.js +4 -2
- package/dist/esm/ez-grid.entry.js +27 -21
- package/dist/esm/ez-icon.entry.js +1 -1
- package/dist/esm/ez-multi-selection-list.entry.js +2 -10
- package/dist/esm/ez-number-input.entry.js +3 -0
- package/dist/esm/ez-popup.entry.js +1 -1
- package/dist/esm/ez-search.entry.js +613 -33
- package/dist/esm/ez-split-button.entry.js +143 -0
- package/dist/esm/ez-split-item.entry.js +12 -2
- package/dist/esm/ez-split-panel.entry.js +15 -12
- package/dist/esm/ezui.js +1 -1
- package/dist/esm/filter-column.entry.js +16 -5
- package/dist/esm/index-baa5e267.js +10 -10
- package/dist/esm/loader.js +1 -1
- package/dist/ezui/ezui.esm.js +1 -1
- package/dist/ezui/{p-51c5e071.entry.js → p-02c8831a.entry.js} +1 -1
- package/dist/ezui/{p-f56dd1da.entry.js → p-07cbffce.entry.js} +1 -1
- package/dist/ezui/p-13dbad96.entry.js +1 -0
- package/dist/ezui/{p-c0f1715f.entry.js → p-18e7870d.entry.js} +1 -1
- package/dist/ezui/p-25ed09c6.entry.js +1 -0
- package/dist/ezui/p-428a05fe.entry.js +1 -0
- package/dist/ezui/p-50186acb.entry.js +1 -0
- package/dist/ezui/p-60848ef6.entry.js +1 -0
- package/dist/ezui/{p-6e2f8e6b.entry.js → p-661f6820.entry.js} +1 -1
- package/dist/ezui/p-672dd122.entry.js +1 -0
- package/dist/ezui/{p-40f72de4.entry.js → p-784fe207.entry.js} +1 -1
- package/dist/ezui/p-940ed30b.entry.js +1 -0
- package/dist/ezui/p-b9fbf4e7.entry.js +1 -0
- package/dist/ezui/p-baf80b13.entry.js +1 -0
- package/dist/ezui/p-e52cbcc7.entry.js +1 -0
- package/dist/ezui/p-e562d05e.entry.js +1 -0
- package/dist/types/components/ez-alert-list/ez-alert-list.d.ts +1 -1
- package/dist/types/components/ez-combo-box/ez-combo-box.d.ts +0 -15
- package/dist/types/components/ez-grid/controller/EzGridController.d.ts +1 -0
- package/dist/types/components/ez-grid/controller/ag-grid/AgGridController.d.ts +1 -0
- package/dist/types/components/ez-grid/controller/ag-grid/DataSource.d.ts +2 -1
- package/dist/types/components/ez-grid/controller/ag-grid/components/EzGridCustomHeader.d.ts +1 -1
- package/dist/types/components/ez-grid/subcomponents/filter-column.d.ts +4 -1
- package/dist/types/components/ez-multi-selection-list/ez-multi-selection-list.d.ts +0 -1
- package/dist/types/components/ez-search/ez-search.d.ts +100 -10
- package/dist/types/components/ez-split-button/ez-split-button.d.ts +89 -0
- package/dist/types/components/ez-split-button/test/dropdownItems.d.ts +2 -0
- package/dist/types/components/ez-split-panel/ez-split-panel.d.ts +23 -0
- package/dist/types/components/ez-split-panel/structure/item/ez-split-item.d.ts +22 -0
- package/dist/types/components.d.ts +170 -14
- package/dist/types/utils/form/test/DataBinder.test.d.ts +1 -0
- package/dist/types/utils/interfaces/AbstractFieldMetadata.d.ts +2 -1
- package/package.json +12 -4
- package/react/components.d.ts +1 -0
- package/react/components.js +1 -0
- package/react/components.js.map +1 -1
- package/dist/cjs/ez-card-item.cjs.entry.js +0 -52
- package/dist/cjs/ez-filter-input_2.cjs.entry.js +0 -137
- package/dist/collection/components/ez-grid/controller/ag-grid/AgGridUtils.js +0 -8
- package/dist/esm/ez-card-item.entry.js +0 -48
- package/dist/esm/ez-filter-input_2.entry.js +0 -132
- package/dist/ezui/p-05f5a778.entry.js +0 -1
- package/dist/ezui/p-24d3fede.entry.js +0 -1
- package/dist/ezui/p-4a7f113d.entry.js +0 -1
- package/dist/ezui/p-5613fe63.entry.js +0 -1
- package/dist/ezui/p-596634e9.entry.js +0 -1
- package/dist/ezui/p-76ba9d67.entry.js +0 -1
- package/dist/ezui/p-796c1a88.entry.js +0 -1
- package/dist/ezui/p-a32aaac6.entry.js +0 -1
- package/dist/ezui/p-a5ac7151.entry.js +0 -1
- package/dist/ezui/p-af15c277.entry.js +0 -1
- package/dist/ezui/p-d6ffe679.entry.js +0 -1
- package/dist/types/components/ez-grid/controller/ag-grid/AgGridUtils.d.ts +0 -1
|
@@ -54,11 +54,13 @@ export class EzAlertList {
|
|
|
54
54
|
/**
|
|
55
55
|
* Gerencia a exibição do overlay usando FloatingManager do Core.
|
|
56
56
|
*/
|
|
57
|
-
|
|
58
|
-
if (this.opened) {
|
|
57
|
+
manageOverlay() {
|
|
58
|
+
if (this.opened && this._container) {
|
|
59
59
|
this._overlayId = FloatingManager.float(this._container, this._overlayRef, this.getFloatOptions());
|
|
60
60
|
}
|
|
61
61
|
else {
|
|
62
|
+
if (this._overlayId === undefined)
|
|
63
|
+
return;
|
|
62
64
|
FloatingManager.close(this._overlayId);
|
|
63
65
|
this._overlayId = undefined;
|
|
64
66
|
}
|
|
@@ -67,8 +69,10 @@ export class EzAlertList {
|
|
|
67
69
|
* Atualiza a posição da lista.
|
|
68
70
|
*/
|
|
69
71
|
updatePosition(right, bottom) {
|
|
70
|
-
|
|
71
|
-
|
|
72
|
+
if (this.opened) {
|
|
73
|
+
FloatingManager.updateFloatPosition(this._container, this._overlayRef, Object.assign(Object.assign({}, this.getFloatOptions()), { right,
|
|
74
|
+
bottom }));
|
|
75
|
+
}
|
|
72
76
|
}
|
|
73
77
|
;
|
|
74
78
|
/**
|
|
@@ -77,7 +81,7 @@ export class EzAlertList {
|
|
|
77
81
|
getFloatOptions() {
|
|
78
82
|
return {
|
|
79
83
|
autoClose: false,
|
|
80
|
-
isFixed:
|
|
84
|
+
isFixed: true,
|
|
81
85
|
bottom: '10px',
|
|
82
86
|
right: '10px',
|
|
83
87
|
};
|
|
@@ -99,9 +103,9 @@ export class EzAlertList {
|
|
|
99
103
|
const boxHeight = this._container.getBoundingClientRect().height;
|
|
100
104
|
return ((docHeight - boxHeight) / 2) + 'px';
|
|
101
105
|
}
|
|
102
|
-
|
|
106
|
+
componentDidLoad() {
|
|
103
107
|
this.manageOverlay();
|
|
104
|
-
if (this.opened) {
|
|
108
|
+
if (this.opened && this._container) {
|
|
105
109
|
this._container.focus();
|
|
106
110
|
}
|
|
107
111
|
}
|
|
@@ -109,27 +113,28 @@ export class EzAlertList {
|
|
|
109
113
|
this.dataElementId = ElementIDUtils.addIDInfo(this._element, 'EzAlertList');
|
|
110
114
|
}
|
|
111
115
|
render() {
|
|
112
|
-
return (h(Host, Object.assign({}, { [ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME]: this.dataElementId }),
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
116
|
+
return (h(Host, Object.assign({}, { [ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME]: this.dataElementId }), this.opened ?
|
|
117
|
+
(h("div", { ref: elem => (this._overlayRef = elem) }, h("div", { class: `alert-list__container ${this.expanded ? 'expanded' : ''}`, ref: elem => (this._container = elem) }, h("div", { class: "alert-list__content" }, h("div", { class: "alert-list__header" }, h("div", { class: "alert-list__title" }, `Avisos (${this.alerts.length})`), h("div", { class: "alert-list__header__buttons" }, this.enableExpand && (h("ez-button", { mode: "icon", size: "small", iconName: "expand", onClick: () => this.toggleExpandContainer(), "data-element-id": ElementIDUtils.getInternalIDInfo('expandButton'), title: this.expanded ? 'Resumir' : 'Expandir' })), h("ez-button", { mode: "icon", size: "small", iconName: "close", "data-element-id": ElementIDUtils.getInternalIDInfo('closeButton'), onClick: () => {
|
|
118
|
+
this.opened = false;
|
|
119
|
+
}, title: 'Fechar' }))), h("div", { class: "alert-list__expandable-content" }, h("ez-list", { itemSlotBuilder: this.itemRightSlotBuilder, hoverFeedback: true, itemLeftSlotBuilder: item => {
|
|
120
|
+
return (h("a", { href: "#", style: {
|
|
121
|
+
fontFamily: "var(--font-pattern, 'Roboto')",
|
|
122
|
+
fontSize: 'var(--text--medium, 14px)',
|
|
123
|
+
fontWeight: 'var(--text-weight--medium, 400)',
|
|
124
|
+
color: 'var(--color--primary, #008561)',
|
|
125
|
+
marginRight: '4px',
|
|
126
|
+
cursor: 'pointer',
|
|
127
|
+
display: 'flex',
|
|
128
|
+
width: 'max-content',
|
|
129
|
+
textDecoration: 'none'
|
|
130
|
+
} }, this.getTitleText(item)));
|
|
131
|
+
}, dataSource: this.alerts.map((alert, index) => {
|
|
132
|
+
var _a;
|
|
133
|
+
return {
|
|
134
|
+
id: this.alertId(alert.title, index),
|
|
135
|
+
label: (_a = alert.detail) !== null && _a !== void 0 ? _a : "",
|
|
136
|
+
};
|
|
137
|
+
}) })))))) : null));
|
|
133
138
|
}
|
|
134
139
|
static get is() { return "ez-alert-list"; }
|
|
135
140
|
static get encapsulation() { return "shadow"; }
|
|
@@ -42,6 +42,9 @@
|
|
|
42
42
|
padding: 12px;
|
|
43
43
|
z-index: 0;
|
|
44
44
|
position: relative;
|
|
45
|
+
container-type: inline-size;
|
|
46
|
+
container-name: box;
|
|
47
|
+
white-space: pre-line;
|
|
45
48
|
}
|
|
46
49
|
|
|
47
50
|
.card-item:hover {
|
|
@@ -77,17 +80,20 @@
|
|
|
77
80
|
}
|
|
78
81
|
|
|
79
82
|
.card-item__details-left {
|
|
83
|
+
white-space: pre-line;
|
|
80
84
|
cursor: pointer;
|
|
81
85
|
width: 50%;
|
|
82
86
|
}
|
|
83
87
|
|
|
84
88
|
.card-item__details-right {
|
|
89
|
+
white-space: pre-line;
|
|
85
90
|
width: 50%;
|
|
86
91
|
cursor: pointer;
|
|
87
92
|
}
|
|
88
93
|
|
|
89
94
|
.card-item__detail:not(:last-child) {
|
|
90
95
|
cursor: pointer;
|
|
96
|
+
white-space: pre-line;
|
|
91
97
|
|
|
92
98
|
/*public*/
|
|
93
99
|
padding-bottom: var(--ez-card-item__detail--padding-bottom);
|
|
@@ -124,4 +130,33 @@
|
|
|
124
130
|
outline: 2px solid var(--ez-card-item__highlight--color);
|
|
125
131
|
box-shadow: -4px 0px 0px 0px var(--ez-card-item__highlight--color),
|
|
126
132
|
4px 0px 0px 0px var(--ez-card-item__highlight--color);
|
|
133
|
+
}
|
|
134
|
+
|
|
135
|
+
@container box (max-width: 550px) {
|
|
136
|
+
.card-item__details {
|
|
137
|
+
flex-direction: column;
|
|
138
|
+
}
|
|
139
|
+
|
|
140
|
+
.card-item__details-left {
|
|
141
|
+
width: 100%;
|
|
142
|
+
}
|
|
143
|
+
|
|
144
|
+
.card-item__details-right {
|
|
145
|
+
width: 100%;
|
|
146
|
+
}
|
|
147
|
+
}
|
|
148
|
+
|
|
149
|
+
@container box (max-width: 200px) {
|
|
150
|
+
.card-item__title {
|
|
151
|
+
font-size: 10px;
|
|
152
|
+
}
|
|
153
|
+
|
|
154
|
+
.card-item__detail-label {
|
|
155
|
+
font-size: 10px;
|
|
156
|
+
}
|
|
157
|
+
|
|
158
|
+
.card-item__detail-value {
|
|
159
|
+
font-size: 10px;
|
|
160
|
+
}
|
|
161
|
+
|
|
127
162
|
}
|
|
@@ -1,7 +1,6 @@
|
|
|
1
|
-
import { ElementIDUtils, FloatingManager, ObjectUtils
|
|
1
|
+
import { ElementIDUtils, FloatingManager, ObjectUtils } from "@sankhyalabs/core";
|
|
2
2
|
import { h, Host } from "@stencil/core";
|
|
3
|
-
import {
|
|
4
|
-
import { REQUIRED_INFO } from "../../utils/constants";
|
|
3
|
+
import { CSSVarsUtils } from "../../utils";
|
|
5
4
|
export class EzComboBox {
|
|
6
5
|
constructor() {
|
|
7
6
|
this._changeDeboucingTimeout = null;
|
|
@@ -9,7 +8,6 @@ export class EzComboBox {
|
|
|
9
8
|
this._maxWidthValue = 0;
|
|
10
9
|
this._tabPressed = false;
|
|
11
10
|
this._textEmptyList = "Nenhum resultado encontrado";
|
|
12
|
-
this._textEmptySearch = "Nenhum resultado de {0} encontrado";
|
|
13
11
|
this._lookupMode = false;
|
|
14
12
|
this._preSelection = undefined;
|
|
15
13
|
this._visibleOptions = undefined;
|
|
@@ -22,7 +20,6 @@ export class EzComboBox {
|
|
|
22
20
|
this.enabled = true;
|
|
23
21
|
this.options = undefined;
|
|
24
22
|
this.errorMessage = undefined;
|
|
25
|
-
this.searchMode = undefined;
|
|
26
23
|
this.showSelectedValue = false;
|
|
27
24
|
this.showOptionValue = false;
|
|
28
25
|
this.suppressSearch = false;
|
|
@@ -46,7 +43,7 @@ export class EzComboBox {
|
|
|
46
43
|
observeValue(newValue, oldValue) {
|
|
47
44
|
if (this._textInput && newValue != oldValue) {
|
|
48
45
|
try {
|
|
49
|
-
if (
|
|
46
|
+
if (typeof newValue === "string") {
|
|
50
47
|
this.setInputValue();
|
|
51
48
|
return;
|
|
52
49
|
}
|
|
@@ -209,7 +206,7 @@ export class EzComboBox {
|
|
|
209
206
|
}
|
|
210
207
|
updateVisibleOptions() {
|
|
211
208
|
let opts = this._source || [];
|
|
212
|
-
if (
|
|
209
|
+
if (this._criteria) {
|
|
213
210
|
const upperCriteria = this._criteria.toUpperCase();
|
|
214
211
|
opts = opts.filter(opt => opt.label.toLocaleUpperCase().indexOf(upperCriteria) > -1);
|
|
215
212
|
}
|
|
@@ -284,7 +281,7 @@ export class EzComboBox {
|
|
|
284
281
|
return this._floatingID !== undefined && FloatingManager.isFloating(this._floatingID);
|
|
285
282
|
}
|
|
286
283
|
nextOption() {
|
|
287
|
-
if (
|
|
284
|
+
if (!this.isOptionsVisible()) {
|
|
288
285
|
return;
|
|
289
286
|
}
|
|
290
287
|
this.showOptions();
|
|
@@ -307,9 +304,6 @@ export class EzComboBox {
|
|
|
307
304
|
this.selectOption(this._visibleOptions[this._preSelection]);
|
|
308
305
|
this._preSelection = undefined;
|
|
309
306
|
}
|
|
310
|
-
else {
|
|
311
|
-
this.controlListWithOnlyOne();
|
|
312
|
-
}
|
|
313
307
|
}
|
|
314
308
|
updateSource(source) {
|
|
315
309
|
this._startLoading = false;
|
|
@@ -328,7 +322,6 @@ export class EzComboBox {
|
|
|
328
322
|
this.updateVisibleOptions();
|
|
329
323
|
if (this._tabPressed) {
|
|
330
324
|
this._tabPressed = false;
|
|
331
|
-
this.controlEmptySearch();
|
|
332
325
|
}
|
|
333
326
|
}
|
|
334
327
|
else {
|
|
@@ -336,10 +329,6 @@ export class EzComboBox {
|
|
|
336
329
|
}
|
|
337
330
|
}
|
|
338
331
|
}
|
|
339
|
-
clearSource() {
|
|
340
|
-
this._source = [];
|
|
341
|
-
this.updateVisibleOptions();
|
|
342
|
-
}
|
|
343
332
|
selectOption(newOption) {
|
|
344
333
|
var _a, _b;
|
|
345
334
|
const currentValue = this.getSelectedOption(this.value);
|
|
@@ -351,10 +340,6 @@ export class EzComboBox {
|
|
|
351
340
|
else {
|
|
352
341
|
this.resetOptions();
|
|
353
342
|
}
|
|
354
|
-
if (this.searchMode) {
|
|
355
|
-
this._visibleOptions = [];
|
|
356
|
-
this.clearSource();
|
|
357
|
-
}
|
|
358
343
|
}
|
|
359
344
|
loadOptions(mode, argument = "") {
|
|
360
345
|
this._criteria = argument;
|
|
@@ -373,7 +358,7 @@ export class EzComboBox {
|
|
|
373
358
|
}
|
|
374
359
|
else {
|
|
375
360
|
window.setTimeout(() => {
|
|
376
|
-
this.setInputValue();
|
|
361
|
+
this.setInputValue(false);
|
|
377
362
|
}, this._deboucingTime);
|
|
378
363
|
}
|
|
379
364
|
this.resetOptions();
|
|
@@ -390,93 +375,6 @@ export class EzComboBox {
|
|
|
390
375
|
clearSearch() {
|
|
391
376
|
this.value = null;
|
|
392
377
|
}
|
|
393
|
-
controlListWithOnlyOne() {
|
|
394
|
-
var _a;
|
|
395
|
-
if (this.searchMode) {
|
|
396
|
-
const source = (_a = this._visibleOptions) === null || _a === void 0 ? void 0 : _a.filter((opt) => opt.label !== "" && opt.value != undefined);
|
|
397
|
-
if ((source === null || source === void 0 ? void 0 : source.length) === 1) {
|
|
398
|
-
this.selectOption(source[0]);
|
|
399
|
-
}
|
|
400
|
-
}
|
|
401
|
-
}
|
|
402
|
-
controlEmptySearch() {
|
|
403
|
-
var _a;
|
|
404
|
-
if (this.searchMode) {
|
|
405
|
-
if (!((_a = this._visibleOptions) === null || _a === void 0 ? void 0 : _a.length)) {
|
|
406
|
-
this.clearSearch();
|
|
407
|
-
ApplicationUtils.info(this._textEmptyList);
|
|
408
|
-
}
|
|
409
|
-
else {
|
|
410
|
-
this.controlListWithOnlyOne();
|
|
411
|
-
}
|
|
412
|
-
}
|
|
413
|
-
}
|
|
414
|
-
validateDescriptionValue() {
|
|
415
|
-
if (!this.searchMode || StringUtils.isEmpty(this.value)) {
|
|
416
|
-
return;
|
|
417
|
-
}
|
|
418
|
-
let value = this.value;
|
|
419
|
-
if (typeof value === "object") {
|
|
420
|
-
return;
|
|
421
|
-
}
|
|
422
|
-
if (StringUtils.isEmpty(value)) {
|
|
423
|
-
return;
|
|
424
|
-
}
|
|
425
|
-
this.loadDescriptionValue(value);
|
|
426
|
-
}
|
|
427
|
-
async loadDescriptionValue(argument) {
|
|
428
|
-
var _a, _b;
|
|
429
|
-
if (argument == undefined) {
|
|
430
|
-
return;
|
|
431
|
-
}
|
|
432
|
-
if (((_a = this.options) === null || _a === void 0 ? void 0 : _a.length) > 0) {
|
|
433
|
-
this.loadOptionValue(argument);
|
|
434
|
-
return;
|
|
435
|
-
}
|
|
436
|
-
const searchArgument = {
|
|
437
|
-
mode: SearchMode.PREDICTIVE,
|
|
438
|
-
argument
|
|
439
|
-
};
|
|
440
|
-
const source = await ((_b = this.optionLoader) === null || _b === void 0 ? void 0 : _b.call(this, searchArgument));
|
|
441
|
-
if (source == undefined) {
|
|
442
|
-
return;
|
|
443
|
-
}
|
|
444
|
-
if (source instanceof Promise) {
|
|
445
|
-
source.then((result) => {
|
|
446
|
-
this.setDescriptionValue(result);
|
|
447
|
-
});
|
|
448
|
-
}
|
|
449
|
-
else {
|
|
450
|
-
this.setDescriptionValue(source);
|
|
451
|
-
}
|
|
452
|
-
}
|
|
453
|
-
setDescriptionValue(source) {
|
|
454
|
-
const value = (source === null || source === void 0 ? void 0 : source[0]) || source;
|
|
455
|
-
if (value == undefined || !Object.keys(value).length) {
|
|
456
|
-
this.showNoResultMessage();
|
|
457
|
-
return;
|
|
458
|
-
}
|
|
459
|
-
this._lookupMode = true;
|
|
460
|
-
this.value = value;
|
|
461
|
-
}
|
|
462
|
-
loadOptionValue(argument) {
|
|
463
|
-
var _a;
|
|
464
|
-
const source = (_a = this.options) === null || _a === void 0 ? void 0 : _a.find((opt) => opt.value === argument);
|
|
465
|
-
if (source != undefined) {
|
|
466
|
-
this.selectOption(source);
|
|
467
|
-
}
|
|
468
|
-
else {
|
|
469
|
-
this.showNoResultMessage();
|
|
470
|
-
}
|
|
471
|
-
}
|
|
472
|
-
async showNoResultMessage() {
|
|
473
|
-
this.clearSearch();
|
|
474
|
-
ApplicationUtils.info(this._textEmptySearch.replace("{0}", this.getFieldLabel()));
|
|
475
|
-
}
|
|
476
|
-
getFieldLabel() {
|
|
477
|
-
var _a;
|
|
478
|
-
return (_a = this.label) === null || _a === void 0 ? void 0 : _a.replace(REQUIRED_INFO, "").toUpperCase();
|
|
479
|
-
}
|
|
480
378
|
resetOptions() {
|
|
481
379
|
this.hideOptions();
|
|
482
380
|
this._criteria = undefined;
|
|
@@ -502,12 +400,7 @@ export class EzComboBox {
|
|
|
502
400
|
});
|
|
503
401
|
}
|
|
504
402
|
}
|
|
505
|
-
|
|
506
|
-
this.updateSource([]);
|
|
507
|
-
}
|
|
508
|
-
else {
|
|
509
|
-
this.loadOptions(SearchMode.PRELOAD);
|
|
510
|
-
}
|
|
403
|
+
this.loadOptions(SearchMode.PRELOAD);
|
|
511
404
|
}
|
|
512
405
|
componentDidRender() {
|
|
513
406
|
var _a;
|
|
@@ -517,7 +410,6 @@ export class EzComboBox {
|
|
|
517
410
|
(_a = this._optionsList) === null || _a === void 0 ? void 0 : _a.querySelectorAll(".item").forEach((elem) => {
|
|
518
411
|
ElementIDUtils.addIDInfoIfNotExists(elem, "itemComboBox");
|
|
519
412
|
});
|
|
520
|
-
this.validateDescriptionValue();
|
|
521
413
|
}
|
|
522
414
|
componentDidLoad() {
|
|
523
415
|
CSSVarsUtils.applyVarsTextInput(this.el, this._textInput);
|
|
@@ -537,13 +429,7 @@ export class EzComboBox {
|
|
|
537
429
|
// Event handlers
|
|
538
430
|
//---------------------------------------------
|
|
539
431
|
handlerIconClick() {
|
|
540
|
-
this.
|
|
541
|
-
}
|
|
542
|
-
buildNumberArgument(argument) {
|
|
543
|
-
if (this.isTextSearch) {
|
|
544
|
-
return NaN;
|
|
545
|
-
}
|
|
546
|
-
return Number(argument || undefined);
|
|
432
|
+
this.showOptions();
|
|
547
433
|
}
|
|
548
434
|
onTextInputChangeHandler(event) {
|
|
549
435
|
var _a;
|
|
@@ -560,36 +446,12 @@ export class EzComboBox {
|
|
|
560
446
|
}
|
|
561
447
|
this._criteria = argument;
|
|
562
448
|
if (argument) {
|
|
563
|
-
|
|
564
|
-
|
|
565
|
-
this.clearSource();
|
|
566
|
-
const enoughChars = argument.length >= this.limitCharsToSearch;
|
|
567
|
-
const argumentNumber = this.buildNumberArgument(argument);
|
|
568
|
-
if (enoughChars || !isNaN(argumentNumber)) {
|
|
569
|
-
this._showLoading = true;
|
|
570
|
-
this._changeDeboucingTimeout = window.setTimeout(() => {
|
|
571
|
-
this.loadOptions(SearchMode.PREDICTIVE, isNaN(argumentNumber) ? argument : argumentNumber.toString());
|
|
572
|
-
}, this._deboucingTime);
|
|
573
|
-
this.showOptions();
|
|
574
|
-
}
|
|
575
|
-
else {
|
|
576
|
-
this.hideOptions();
|
|
577
|
-
}
|
|
578
|
-
}
|
|
579
|
-
else {
|
|
580
|
-
this.updateVisibleOptions();
|
|
581
|
-
this.showOptions();
|
|
582
|
-
}
|
|
449
|
+
this.updateVisibleOptions();
|
|
450
|
+
this.showOptions();
|
|
583
451
|
}
|
|
584
452
|
else {
|
|
585
453
|
this.hideOptions();
|
|
586
|
-
|
|
587
|
-
this._showLoading = false;
|
|
588
|
-
this.clearSource();
|
|
589
|
-
}
|
|
590
|
-
else {
|
|
591
|
-
this.updateVisibleOptions();
|
|
592
|
-
}
|
|
454
|
+
this.updateVisibleOptions();
|
|
593
455
|
}
|
|
594
456
|
}
|
|
595
457
|
clearDeboucingTimeout() {
|
|
@@ -599,9 +461,7 @@ export class EzComboBox {
|
|
|
599
461
|
}
|
|
600
462
|
}
|
|
601
463
|
onTextInputClickHandler() {
|
|
602
|
-
|
|
603
|
-
this.showOptions();
|
|
604
|
-
}
|
|
464
|
+
this.showOptions();
|
|
605
465
|
}
|
|
606
466
|
keyDownHandler(event) {
|
|
607
467
|
this._tabPressed = false;
|
|
@@ -633,7 +493,6 @@ export class EzComboBox {
|
|
|
633
493
|
break;
|
|
634
494
|
case "Tab":
|
|
635
495
|
this._tabPressed = true;
|
|
636
|
-
this.controlListWithOnlyOne();
|
|
637
496
|
break;
|
|
638
497
|
}
|
|
639
498
|
//ATENÇÃO: Existe a necessidade de propagar o evento de teclado.
|
|
@@ -650,11 +509,8 @@ export class EzComboBox {
|
|
|
650
509
|
return !this._showLoading && this._visibleOptions.length > 0;
|
|
651
510
|
}
|
|
652
511
|
render() {
|
|
653
|
-
var _a;
|
|
654
512
|
ElementIDUtils.addIDInfoIfNotExists(this.el, 'input');
|
|
655
|
-
return (h(Host, null, h("ez-text-input", { "data-element-id": ElementIDUtils.getInternalIDInfo("textInput"), class: this.suppressSearch ? "suppressed-search-input" : "", ref: elem => this._textInput = elem, "data-slave-mode": "true", enabled: this.enabled && !this.suppressSearch, onInput: event => this.onTextInputChangeHandler(event), onClick: () => this.onTextInputClickHandler(), onFocusout: () => this.onTextInputFocusOutHandler(), onKeyDown: event => this.keyDownHandler(event), label: this.label, canShowError: this.canShowError, errorMessage: this.errorMessage, mode: this.mode }, h("button", { class: "btn", slot:
|
|
656
|
-
? h("button", { class: "btn btn__close", slot: "rightIcon", disabled: !this.enabled, tabindex: -1, onClick: () => this.clearSearch() }, h("ez-icon", { iconName: "close" }))
|
|
657
|
-
: undefined), h("section", { class: "list-container", ref: elem => this._listContainer = elem }, h("div", { class: "list-wrapper", ref: elem => this._listWrapper = elem }, h("ul", { class: "list-options", ref: elem => this._optionsList = elem }, !this._showLoading
|
|
513
|
+
return (h(Host, null, h("ez-text-input", { "data-element-id": ElementIDUtils.getInternalIDInfo("textInput"), class: this.suppressSearch ? "suppressed-search-input" : "", ref: elem => this._textInput = elem, "data-slave-mode": "true", enabled: this.enabled && !this.suppressSearch, onInput: event => this.onTextInputChangeHandler(event), onClick: () => this.onTextInputClickHandler(), onFocusout: () => this.onTextInputFocusOutHandler(), onKeyDown: event => this.keyDownHandler(event), label: this.label, canShowError: this.canShowError, errorMessage: this.errorMessage, mode: this.mode }, h("button", { class: "btn", slot: "rightIcon", disabled: !this.enabled, tabindex: -1, onClick: () => this.handlerIconClick() }, h("ez-icon", { iconName: "chevron-down" }))), h("section", { class: "list-container", ref: elem => this._listContainer = elem }, h("div", { class: "list-wrapper", ref: elem => this._listWrapper = elem }, h("ul", { class: "list-options", ref: elem => this._optionsList = elem }, !this._showLoading
|
|
658
514
|
&& this._visibleOptions.length === 0
|
|
659
515
|
&& h("div", { class: "message" }, h("span", { class: "message__no-result" }, this._textEmptyList)), this._showLoading
|
|
660
516
|
&& h("div", { class: "message" }, h("div", { class: "message__loading" })), this.showOptionValue
|
|
@@ -788,23 +644,6 @@ export class EzComboBox {
|
|
|
788
644
|
"attribute": "error-message",
|
|
789
645
|
"reflect": true
|
|
790
646
|
},
|
|
791
|
-
"searchMode": {
|
|
792
|
-
"type": "boolean",
|
|
793
|
-
"mutable": false,
|
|
794
|
-
"complexType": {
|
|
795
|
-
"original": "boolean",
|
|
796
|
-
"resolved": "boolean",
|
|
797
|
-
"references": {}
|
|
798
|
-
},
|
|
799
|
-
"required": false,
|
|
800
|
-
"optional": false,
|
|
801
|
-
"docs": {
|
|
802
|
-
"tags": [],
|
|
803
|
-
"text": "Se true ativa o modo pesquisa do ez-combo-box."
|
|
804
|
-
},
|
|
805
|
-
"attribute": "search-mode",
|
|
806
|
-
"reflect": false
|
|
807
|
-
},
|
|
808
647
|
"showSelectedValue": {
|
|
809
648
|
"type": "boolean",
|
|
810
649
|
"mutable": false,
|
|
@@ -152,6 +152,9 @@ export class EzDateTimeInput {
|
|
|
152
152
|
}
|
|
153
153
|
handleBlur() {
|
|
154
154
|
var _a, _b;
|
|
155
|
+
if (!this._changePending) {
|
|
156
|
+
return;
|
|
157
|
+
}
|
|
155
158
|
try {
|
|
156
159
|
const strValue = ((_b = (_a = this._textInput) === null || _a === void 0 ? void 0 : _a.value) === null || _b === void 0 ? void 0 : _b.trim()) || "";
|
|
157
160
|
const newValue = this.getParsedDateTime();
|
|
@@ -3,9 +3,11 @@ import { ObjectUtils } from "@sankhyalabs/core";
|
|
|
3
3
|
export const buildFile = ({ name, label, readOnly, contextName, props }) => {
|
|
4
4
|
const uploadProps = ObjectUtils.removeEmptyValues({
|
|
5
5
|
subTitle: props.subTitle,
|
|
6
|
-
requestHeaders: props.STORAGESTRATEGY
|
|
6
|
+
requestHeaders: Object.assign(Object.assign({}, (props.STORAGESTRATEGY && {
|
|
7
7
|
STORAGESTRATEGY: props.STORAGESTRATEGY
|
|
8
|
-
}
|
|
8
|
+
})), (props.INTERNAL_FILENAME && {
|
|
9
|
+
INTERNAL_FILENAME: props.INTERNAL_FILENAME
|
|
10
|
+
})),
|
|
9
11
|
});
|
|
10
12
|
return (h("div", { class: "ez-col ez-col--sd-12 ez-padding-horizontal--small" }, h("ez-upload", Object.assign({ enabled: !readOnly, label: label, "data-field-name": name, "data-context-name": contextName, key: name }, uploadProps))));
|
|
11
13
|
};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { ApplicationContext, DataType, MaskFormatter, NumberUtils, SortMode, StringUtils, UserInterface } from '@sankhyalabs/core';
|
|
1
|
+
import { ApplicationContext, DataType, MaskFormatter, NumberUtils, SortMode, StringUtils, UserInterface, } from '@sankhyalabs/core';
|
|
2
2
|
import { Grid, } from 'ag-grid-community';
|
|
3
3
|
import { Grid as EnterpriseGrid, LicenseManager } from 'ag-grid-enterprise';
|
|
4
4
|
import DataSource from './DataSource';
|
|
@@ -6,8 +6,7 @@ import { EzGridCustomHeader } from './components/EzGridCustomHeader';
|
|
|
6
6
|
import { CellRendererStatus } from './components/cellRendererStatus';
|
|
7
7
|
import SelectionHeader from './components/selectionHeader';
|
|
8
8
|
import gridTerms from './i18n/pt-BR.js';
|
|
9
|
-
import {
|
|
10
|
-
import { calcFilterColumnLeftPosition } from './AgGridUtils';
|
|
9
|
+
import { DISTINCT_FILTER_NAME_PREFIX, EZ_GRID_LOADING_SOURCE } from '../../../../utils/constants';
|
|
11
10
|
import GridEditionManager from './GridEditionManager';
|
|
12
11
|
export default class AgGridController {
|
|
13
12
|
configFilterColumn(filterColumn) {
|
|
@@ -20,6 +19,10 @@ export default class AgGridController {
|
|
|
20
19
|
this._gridOptions.api.refreshHeader();
|
|
21
20
|
this._dataUnit.loadData(undefined, undefined, undefined, EZ_GRID_LOADING_SOURCE);
|
|
22
21
|
}
|
|
22
|
+
clearFilter() {
|
|
23
|
+
this._filteredColumns.clear();
|
|
24
|
+
this._gridOptions.api.refreshHeader();
|
|
25
|
+
}
|
|
23
26
|
showFilterColumn(configs) {
|
|
24
27
|
var _a;
|
|
25
28
|
(_a = this._filterColumn) === null || _a === void 0 ? void 0 : _a.show(configs);
|
|
@@ -38,7 +41,7 @@ export default class AgGridController {
|
|
|
38
41
|
this._idAttribName = '__record__id__';
|
|
39
42
|
this._gridConfig = [];
|
|
40
43
|
this._filteredColumns = new Map();
|
|
41
|
-
this._filterColumnleftPosition =
|
|
44
|
+
this._filterColumnleftPosition = 0;
|
|
42
45
|
this._enterprise = enterprise;
|
|
43
46
|
}
|
|
44
47
|
getGridConfig() {
|
|
@@ -164,11 +167,9 @@ export default class AgGridController {
|
|
|
164
167
|
this._gridOptions.api.setHeaderHeight(this.getHeaderRowHeight());
|
|
165
168
|
}
|
|
166
169
|
}
|
|
167
|
-
setFilterColumnLeftPosition(
|
|
168
|
-
if (
|
|
169
|
-
|
|
170
|
-
const leftString = ePopup.style.left.replace('px', '');
|
|
171
|
-
this._filterColumnleftPosition = `${calcFilterColumnLeftPosition(parseInt(leftString))}px`;
|
|
170
|
+
setFilterColumnLeftPosition({ type, ePopup }) {
|
|
171
|
+
if (type === 'columnMenu') {
|
|
172
|
+
this._filterColumnleftPosition = ePopup.getBoundingClientRect().left;
|
|
172
173
|
return;
|
|
173
174
|
}
|
|
174
175
|
}
|
|
@@ -608,7 +609,7 @@ export default class AgGridController {
|
|
|
608
609
|
tooltip: tooltip,
|
|
609
610
|
isSortable: propSortable,
|
|
610
611
|
hasFilter: () => this.hasFilterColumn(source.name),
|
|
611
|
-
showColumnFilter: (leftPosition
|
|
612
|
+
showColumnFilter: (leftPosition) => this.showFilterColumn({ columnName: source.name, columnLabel: source.label, leftPosition, filteredOptions: this._filteredColumns.get(source.name), fromIcon: true }),
|
|
612
613
|
},
|
|
613
614
|
valueFormatter: params => {
|
|
614
615
|
if (params.value == undefined) {
|
|
@@ -1,6 +1,14 @@
|
|
|
1
|
-
import { Action, ObjectUtils } from
|
|
1
|
+
import { Action, ObjectUtils } from '@sankhyalabs/core';
|
|
2
2
|
import { EZ_GRID_LOADING_SOURCE } from "../../../../utils/constants";
|
|
3
3
|
export default class DataSource {
|
|
4
|
+
updateLoadedRecords(action) {
|
|
5
|
+
const records = action.payload;
|
|
6
|
+
if ((records === null || records === void 0 ? void 0 : records.length) > 0) {
|
|
7
|
+
records.forEach(record => {
|
|
8
|
+
this._controller.changeValues(record, [record.__record__id__]);
|
|
9
|
+
});
|
|
10
|
+
}
|
|
11
|
+
}
|
|
4
12
|
isSilentChange(action) {
|
|
5
13
|
//TODO: Provisorio p/ não atualizar a grade quando a alteração for apenas de campos transisntes
|
|
6
14
|
var _a, _b;
|
|
@@ -23,6 +31,9 @@ export default class DataSource {
|
|
|
23
31
|
break;
|
|
24
32
|
case Action.LOADING_DATA:
|
|
25
33
|
this._waitingForLoad = true;
|
|
34
|
+
if (EZ_GRID_LOADING_SOURCE !== action.payload.source) {
|
|
35
|
+
this._controller.clearFilter();
|
|
36
|
+
}
|
|
26
37
|
this._controller.refresh();
|
|
27
38
|
break;
|
|
28
39
|
case Action.DATA_LOADED:
|
|
@@ -53,6 +64,9 @@ export default class DataSource {
|
|
|
53
64
|
case Action.PREVIOUS_SELECTED:
|
|
54
65
|
this.updateSelection();
|
|
55
66
|
break;
|
|
67
|
+
case Action.RECORD_LOADED:
|
|
68
|
+
this.updateLoadedRecords(action);
|
|
69
|
+
break;
|
|
56
70
|
}
|
|
57
71
|
};
|
|
58
72
|
this._dataUnit = dataUnit;
|
package/dist/collection/components/ez-grid/controller/ag-grid/components/EzGridCustomHeader.js
CHANGED
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import { calcFilterColumnLeftPosition } from '../AgGridUtils';
|
|
2
1
|
export class EzGridCustomHeader {
|
|
3
2
|
init(agParams) {
|
|
4
3
|
var _a;
|
|
@@ -35,8 +34,7 @@ export class EzGridCustomHeader {
|
|
|
35
34
|
}
|
|
36
35
|
onClickFilter() {
|
|
37
36
|
var _a;
|
|
38
|
-
|
|
39
|
-
this.params.showColumnFilter(`${calcFilterColumnLeftPosition(iconLeft)}px`, true);
|
|
37
|
+
this.params.showColumnFilter((_a = this.filterButton) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().left);
|
|
40
38
|
}
|
|
41
39
|
configSortIcon() {
|
|
42
40
|
this.sortDownIcon.style.display = this.params.column.isSortDescending() ? 'flex' : 'none';
|
|
@@ -7,9 +7,9 @@ import { ApplicationUtils } from '../../utils';
|
|
|
7
7
|
import InMemoryFilterColumnDataSource from './utils/InMemoryFilterColumnDataSource';
|
|
8
8
|
const windowInstace = window;
|
|
9
9
|
const matches = (text, filter) => {
|
|
10
|
-
const normalizedText = StringUtils.replaceAccentuatedCharsLower(text.toLocaleLowerCase());
|
|
10
|
+
const normalizedText = StringUtils.replaceAccentuatedCharsLower(text === null || text === void 0 ? void 0 : text.toLocaleLowerCase());
|
|
11
11
|
const normalizedFilter = StringUtils.replaceAccentuatedCharsLower(filter.toLocaleLowerCase());
|
|
12
|
-
return normalizedText.includes(normalizedFilter);
|
|
12
|
+
return normalizedText === null || normalizedText === void 0 ? void 0 : normalizedText.includes(normalizedFilter);
|
|
13
13
|
};
|
|
14
14
|
export class EzGrid {
|
|
15
15
|
constructor() {
|