@sankhyalabs/ezui 2.3.1 → 2.3.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 +1 -0
- package/dist/cjs/ez-actions-button.cjs.entry.js +12 -8
- package/dist/cjs/ez-button.cjs.entry.js +5 -5
- package/dist/cjs/ez-calendar.cjs.entry.js +10 -13
- package/dist/cjs/ez-check.cjs.entry.js +5 -8
- package/dist/cjs/ez-chip.cjs.entry.js +4 -4
- package/dist/cjs/ez-collapsible-box.cjs.entry.js +14 -14
- package/dist/cjs/ez-combo-box.cjs.entry.js +11 -11
- package/dist/cjs/ez-date-input.cjs.entry.js +5 -5
- package/dist/cjs/ez-date-time-input.cjs.entry.js +7 -7
- package/dist/cjs/ez-dialog.cjs.entry.js +4 -7
- package/dist/cjs/ez-filter-input.cjs.entry.js +6 -6
- package/dist/cjs/ez-form.cjs.entry.js +3 -6
- package/dist/cjs/ez-grid.cjs.entry.js +16 -17
- package/dist/cjs/ez-icon.cjs.entry.js +3 -3
- package/dist/cjs/ez-list.cjs.entry.js +71 -71
- package/dist/cjs/ez-loading-bar.cjs.entry.js +8 -4
- package/dist/cjs/ez-modal-container.cjs.entry.js +2 -2
- package/dist/cjs/ez-modal.cjs.entry.js +6 -6
- package/dist/cjs/ez-number-input.cjs.entry.js +5 -5
- package/dist/cjs/ez-popover.cjs.entry.js +8 -10
- package/dist/cjs/ez-popup.cjs.entry.js +4 -5
- package/dist/cjs/ez-radio-button.cjs.entry.js +3 -3
- package/dist/cjs/ez-scroller.cjs.entry.js +2 -7
- package/dist/cjs/ez-search.cjs.entry.js +13 -14
- package/dist/cjs/ez-text-area.cjs.entry.js +7 -7
- package/dist/cjs/ez-text-edit.cjs.entry.js +1 -1
- package/dist/cjs/ez-text-input.cjs.entry.js +7 -7
- package/dist/cjs/ez-time-input.cjs.entry.js +6 -6
- package/dist/cjs/ez-toast.cjs.entry.js +5 -5
- package/dist/cjs/ez-upload.cjs.entry.js +5 -5
- package/dist/cjs/ez-view-stack.cjs.entry.js +2 -2
- package/dist/cjs/ezui.cjs.js +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/components/ez-actions-button/ez-actions-button.js +27 -22
- package/dist/collection/components/ez-button/ez-button.js +15 -15
- package/dist/collection/components/ez-calendar/ez-calendar.js +18 -21
- package/dist/collection/components/ez-card-item/ez-card-item.js +2 -2
- package/dist/collection/components/ez-check/ez-check.js +28 -22
- package/dist/collection/components/ez-chip/ez-chip.js +15 -15
- package/dist/collection/components/ez-collapsible-box/ez-collapsible-box.js +28 -28
- package/dist/collection/components/ez-combo-box/ez-combo-box.js +42 -33
- package/dist/collection/components/ez-date-input/ez-date-input.js +18 -18
- package/dist/collection/components/ez-date-time-input/ez-date-time-input.js +21 -21
- package/dist/collection/components/ez-dialog/ez-dialog.js +13 -35
- package/dist/collection/components/ez-filter-input/ez-filter-input.js +18 -35
- package/dist/collection/components/ez-form/ez-form.js +7 -42
- package/dist/collection/components/ez-grid/ez-grid.js +41 -42
- package/dist/collection/components/ez-icon/ez-icon.js +11 -11
- package/dist/collection/components/ez-list/ez-list.js +112 -93
- package/dist/collection/components/ez-loading-bar/ez-loading-bar.js +10 -6
- package/dist/collection/components/ez-modal/ez-modal.js +14 -14
- package/dist/collection/components/ez-modal-container/ez-modal-container.js +16 -16
- package/dist/collection/components/ez-number-input/ez-number-input.js +20 -20
- package/dist/collection/components/ez-popover/ez-popover.js +22 -24
- package/dist/collection/components/ez-popup/ez-popup.js +16 -17
- package/dist/collection/components/ez-radio-button/ez-radio-button.js +8 -8
- package/dist/collection/components/ez-scroller/ez-scroller.js +6 -12
- package/dist/collection/components/ez-search/ez-search.js +42 -46
- package/dist/collection/components/ez-tabselector/ez-tabselector.js +2 -2
- package/dist/collection/components/ez-text-area/ez-text-area.js +20 -37
- package/dist/collection/components/ez-text-edit/ez-text-edit.js +6 -6
- package/dist/collection/components/ez-text-input/ez-text-input.js +21 -38
- package/dist/collection/components/ez-time-input/ez-time-input.js +20 -20
- package/dist/collection/components/ez-toast/ez-toast.js +12 -12
- package/dist/collection/components/ez-upload/ez-upload.js +14 -14
- package/dist/collection/components/ez-view-stack/ez-view-stack.js +4 -4
- package/dist/custom-elements/index.js +265 -279
- package/dist/esm/ez-actions-button.entry.js +12 -8
- package/dist/esm/ez-button.entry.js +5 -5
- package/dist/esm/ez-calendar.entry.js +10 -13
- package/dist/esm/ez-check.entry.js +5 -8
- package/dist/esm/ez-chip.entry.js +4 -4
- package/dist/esm/ez-collapsible-box.entry.js +14 -14
- package/dist/esm/ez-combo-box.entry.js +11 -11
- package/dist/esm/ez-date-input.entry.js +5 -5
- package/dist/esm/ez-date-time-input.entry.js +7 -7
- package/dist/esm/ez-dialog.entry.js +4 -7
- package/dist/esm/ez-filter-input.entry.js +6 -6
- package/dist/esm/ez-form.entry.js +3 -6
- package/dist/esm/ez-grid.entry.js +16 -17
- package/dist/esm/ez-icon.entry.js +3 -3
- package/dist/esm/ez-list.entry.js +71 -71
- package/dist/esm/ez-loading-bar.entry.js +8 -4
- package/dist/esm/ez-modal-container.entry.js +2 -2
- package/dist/esm/ez-modal.entry.js +6 -6
- package/dist/esm/ez-number-input.entry.js +5 -5
- package/dist/esm/ez-popover.entry.js +8 -10
- package/dist/esm/ez-popup.entry.js +4 -5
- package/dist/esm/ez-radio-button.entry.js +3 -3
- package/dist/esm/ez-scroller.entry.js +2 -7
- package/dist/esm/ez-search.entry.js +13 -14
- package/dist/esm/ez-text-area.entry.js +7 -7
- package/dist/esm/ez-text-edit.entry.js +1 -1
- package/dist/esm/ez-text-input.entry.js +7 -7
- package/dist/esm/ez-time-input.entry.js +6 -6
- package/dist/esm/ez-toast.entry.js +5 -5
- package/dist/esm/ez-upload.entry.js +5 -5
- package/dist/esm/ez-view-stack.entry.js +2 -2
- 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-1214c5ce.entry.js +1 -0
- package/dist/ezui/p-2af9fe67.entry.js +1 -0
- package/dist/ezui/p-642c530f.entry.js +1 -0
- package/dist/ezui/p-96265e26.entry.js +1 -0
- package/dist/ezui/p-b47eb5d4.entry.js +1 -0
- package/dist/ezui/{p-855f99f8.entry.js → p-ccbe8272.entry.js} +1 -1
- package/dist/ezui/p-e60e7308.entry.js +1 -0
- package/dist/ezui/p-ede1328a.entry.js +1 -0
- package/dist/ezui/p-f6111077.entry.js +1 -0
- package/dist/types/components/ez-actions-button/ez-actions-button.d.ts +15 -14
- package/dist/types/components/ez-button/ez-button.d.ts +10 -10
- package/dist/types/components/ez-calendar/ez-calendar.d.ts +11 -14
- package/dist/types/components/ez-card-item/ez-card-item.d.ts +7 -0
- package/dist/types/components/ez-check/ez-check.d.ts +11 -13
- package/dist/types/components/ez-chip/ez-chip.d.ts +15 -14
- package/dist/types/components/ez-collapsible-box/ez-collapsible-box.d.ts +25 -25
- package/dist/types/components/ez-combo-box/ez-combo-box.d.ts +21 -20
- package/dist/types/components/ez-date-input/ez-date-input.d.ts +16 -17
- package/dist/types/components/ez-date-time-input/ez-date-time-input.d.ts +18 -19
- package/dist/types/components/ez-dialog/ez-dialog.d.ts +13 -16
- package/dist/types/components/ez-filter-input/ez-filter-input.d.ts +12 -17
- package/dist/types/components/ez-form/ez-form.d.ts +7 -5
- package/dist/types/components/ez-grid/controller/EzGridController.d.ts +2 -2
- package/dist/types/components/ez-grid/ez-grid.d.ts +37 -39
- package/dist/types/components/ez-icon/ez-icon.d.ts +4 -4
- package/dist/types/components/ez-list/ez-list.d.ts +29 -32
- package/dist/types/components/ez-loading-bar/ez-loading-bar.d.ts +6 -0
- package/dist/types/components/ez-modal/ez-modal.d.ts +15 -15
- package/dist/types/components/ez-modal-container/ez-modal-container.d.ts +10 -10
- package/dist/types/components/ez-number-input/ez-number-input.d.ts +18 -24
- package/dist/types/components/ez-popover/ez-popover.d.ts +13 -16
- package/dist/types/components/ez-popup/ez-popup.d.ts +12 -13
- package/dist/types/components/ez-radio-button/ez-radio-button.d.ts +8 -8
- package/dist/types/components/ez-scroller/ez-scroller.d.ts +3 -4
- package/dist/types/components/ez-search/ez-search.d.ts +27 -31
- package/dist/types/components/ez-tabselector/ez-tabselector.d.ts +4 -7
- package/dist/types/components/ez-text-area/ez-text-area.d.ts +12 -16
- package/dist/types/components/ez-text-edit/ez-text-edit.d.ts +5 -5
- package/dist/types/components/ez-text-input/ez-text-input.d.ts +14 -19
- package/dist/types/components/ez-time-input/ez-time-input.d.ts +16 -17
- package/dist/types/components/ez-toast/ez-toast.d.ts +7 -7
- package/dist/types/components/ez-upload/ez-upload.d.ts +11 -12
- package/dist/types/components/ez-view-stack/ez-view-stack.d.ts +2 -2
- package/dist/types/components.d.ts +514 -529
- package/package.json +2 -2
- package/dist/ezui/p-0fb5f4be.entry.js +0 -1
- package/dist/ezui/p-1ba371a3.entry.js +0 -1
- package/dist/ezui/p-42c6493e.entry.js +0 -1
- package/dist/ezui/p-6700360e.entry.js +0 -1
- package/dist/ezui/p-89b2a151.entry.js +0 -1
- package/dist/ezui/p-8c2105a5.entry.js +0 -1
- package/dist/ezui/p-ed2135a5.entry.js +0 -1
- package/dist/ezui/p-f6afdc4d.entry.js +0 -1
|
@@ -14,64 +14,42 @@ let EzList = class {
|
|
|
14
14
|
this._listGroupItems = [];
|
|
15
15
|
this._listItemsHistory = [];
|
|
16
16
|
/**
|
|
17
|
-
|
|
18
|
-
|
|
17
|
+
* Define a lista inicial do componente.
|
|
18
|
+
*/
|
|
19
19
|
this.dataSource = [];
|
|
20
20
|
/**
|
|
21
|
-
|
|
22
|
-
|
|
21
|
+
* Se true os grupos serão exibidos.
|
|
22
|
+
*/
|
|
23
23
|
this.useGroups = false;
|
|
24
24
|
/**
|
|
25
|
-
|
|
26
|
-
|
|
25
|
+
* Se true habilita `drag and drop` para os itens.
|
|
26
|
+
*/
|
|
27
27
|
this.ezDraggable = false;
|
|
28
28
|
/**
|
|
29
|
-
|
|
30
|
-
|
|
29
|
+
* Se true os itens serão selecionáveis.
|
|
30
|
+
*/
|
|
31
31
|
this.ezSelectable = false;
|
|
32
32
|
}
|
|
33
|
-
createList() {
|
|
34
|
-
if (this.useGroups) {
|
|
35
|
-
let list = [...this.dataSource];
|
|
36
|
-
list.forEach(itemGroup => {
|
|
37
|
-
this.sortGroup(itemGroup);
|
|
38
|
-
});
|
|
39
|
-
this._listGroupItems = list;
|
|
40
|
-
}
|
|
41
|
-
else {
|
|
42
|
-
this._listItems = this._listItemsHistory.length > 0 ? this._listItemsHistory : [...this.dataSource];
|
|
43
|
-
}
|
|
44
|
-
}
|
|
45
|
-
sortGroup(itemGroup) {
|
|
46
|
-
if (itemGroup.sort) {
|
|
47
|
-
itemGroup.items.sort(function (a, b) {
|
|
48
|
-
return a.label < b.label ? -1 : a.label > b.label ? 1 : 0;
|
|
49
|
-
});
|
|
50
|
-
if (itemGroup.sort === "DSC") {
|
|
51
|
-
itemGroup.items.reverse();
|
|
52
|
-
}
|
|
53
|
-
}
|
|
54
|
-
}
|
|
55
33
|
/**
|
|
56
|
-
|
|
57
|
-
|
|
34
|
+
* Limpa o histórico da lista.
|
|
35
|
+
*/
|
|
58
36
|
async clearHistory() {
|
|
59
37
|
this._listItemsHistory = [];
|
|
60
38
|
}
|
|
61
39
|
/**
|
|
62
|
-
|
|
63
|
-
|
|
40
|
+
* Traz o conteúdo da lista para a área visível.
|
|
41
|
+
*/
|
|
64
42
|
async scrollToTop() {
|
|
65
43
|
if (this.useGroups) {
|
|
66
|
-
this._element.shadowRoot.querySelector(
|
|
44
|
+
this._element.shadowRoot.querySelector(".group-container").scrollTop = 0;
|
|
67
45
|
}
|
|
68
46
|
else {
|
|
69
|
-
this._element.shadowRoot.querySelector(
|
|
47
|
+
this._element.shadowRoot.querySelector(".items-container").scrollTop = 0;
|
|
70
48
|
}
|
|
71
49
|
}
|
|
72
50
|
/**
|
|
73
|
-
|
|
74
|
-
|
|
51
|
+
* Aplica seleção nas linhas da lista.
|
|
52
|
+
*/
|
|
75
53
|
async setSelection(selectedItem, scrollToOption) {
|
|
76
54
|
if (selectedItem && this.ezSelectable) {
|
|
77
55
|
if (this.useGroups) {
|
|
@@ -102,8 +80,8 @@ let EzList = class {
|
|
|
102
80
|
}
|
|
103
81
|
if (scrollToOption) {
|
|
104
82
|
let liElem = this.useGroups ?
|
|
105
|
-
this._groupContainer.querySelector(
|
|
106
|
-
: this._itemContainer.querySelector(
|
|
83
|
+
this._groupContainer.querySelector("li#item_" + this.getItemId(selectedItem.label))
|
|
84
|
+
: this._itemContainer.querySelector("li#item_" + this.getItemId(selectedItem.label));
|
|
107
85
|
if (liElem) {
|
|
108
86
|
liElem.scrollIntoView();
|
|
109
87
|
}
|
|
@@ -113,27 +91,9 @@ let EzList = class {
|
|
|
113
91
|
this.removeSelection();
|
|
114
92
|
}
|
|
115
93
|
}
|
|
116
|
-
removeSelection() {
|
|
117
|
-
if (this.useGroups) {
|
|
118
|
-
let newList = [...this._listGroupItems];
|
|
119
|
-
newList.forEach(groupItem => {
|
|
120
|
-
groupItem.items.forEach(item => {
|
|
121
|
-
item.selected = false;
|
|
122
|
-
});
|
|
123
|
-
});
|
|
124
|
-
this._listGroupItems = newList;
|
|
125
|
-
}
|
|
126
|
-
else {
|
|
127
|
-
let newList = [...this._listItems];
|
|
128
|
-
newList.forEach(item => {
|
|
129
|
-
item.selected = false;
|
|
130
|
-
});
|
|
131
|
-
this._listItems = newList;
|
|
132
|
-
}
|
|
133
|
-
}
|
|
134
94
|
/**
|
|
135
|
-
*
|
|
136
|
-
|
|
95
|
+
* Obtém o item selecionado.
|
|
96
|
+
*/
|
|
137
97
|
async getSelection() {
|
|
138
98
|
let selectedItem;
|
|
139
99
|
if (this.useGroups) {
|
|
@@ -152,7 +112,7 @@ let EzList = class {
|
|
|
152
112
|
return selectedItem;
|
|
153
113
|
}
|
|
154
114
|
/**
|
|
155
|
-
*
|
|
115
|
+
* Obtém a lista de items ou grupos.
|
|
156
116
|
*/
|
|
157
117
|
async getList() {
|
|
158
118
|
if (this.useGroups) {
|
|
@@ -160,6 +120,46 @@ let EzList = class {
|
|
|
160
120
|
}
|
|
161
121
|
return this._listItems;
|
|
162
122
|
}
|
|
123
|
+
createList() {
|
|
124
|
+
if (this.useGroups) {
|
|
125
|
+
let list = this.dataSource.map(item => item);
|
|
126
|
+
list.forEach(itemGroup => {
|
|
127
|
+
this.sortGroup(itemGroup);
|
|
128
|
+
});
|
|
129
|
+
this._listGroupItems = list;
|
|
130
|
+
}
|
|
131
|
+
else {
|
|
132
|
+
this._listItems = this._listItemsHistory.length > 0 ? this._listItemsHistory : this.dataSource.map(item => item);
|
|
133
|
+
}
|
|
134
|
+
}
|
|
135
|
+
sortGroup(itemGroup) {
|
|
136
|
+
if (itemGroup.sort) {
|
|
137
|
+
itemGroup.items.sort(function (a, b) {
|
|
138
|
+
return a.label < b.label ? -1 : a.label > b.label ? 1 : 0;
|
|
139
|
+
});
|
|
140
|
+
if (itemGroup.sort === "DSC") {
|
|
141
|
+
itemGroup.items.reverse();
|
|
142
|
+
}
|
|
143
|
+
}
|
|
144
|
+
}
|
|
145
|
+
removeSelection() {
|
|
146
|
+
if (this.useGroups) {
|
|
147
|
+
let newList = [...this._listGroupItems];
|
|
148
|
+
newList.forEach(groupItem => {
|
|
149
|
+
groupItem.items.forEach(item => {
|
|
150
|
+
item.selected = false;
|
|
151
|
+
});
|
|
152
|
+
});
|
|
153
|
+
this._listGroupItems = newList;
|
|
154
|
+
}
|
|
155
|
+
else {
|
|
156
|
+
let newList = [...this._listItems];
|
|
157
|
+
newList.forEach(item => {
|
|
158
|
+
item.selected = false;
|
|
159
|
+
});
|
|
160
|
+
this._listItems = newList;
|
|
161
|
+
}
|
|
162
|
+
}
|
|
163
163
|
componentWillLoad() {
|
|
164
164
|
this._listItemsHistory = [];
|
|
165
165
|
}
|
|
@@ -282,7 +282,7 @@ let EzList = class {
|
|
|
282
282
|
}
|
|
283
283
|
addOverClass(element) {
|
|
284
284
|
if ((element === null || element === void 0 ? void 0 : element.__proto__) == HTMLDivElement.prototype && element.classList.contains("draggable")) {
|
|
285
|
-
element.classList.add(
|
|
285
|
+
element.classList.add("over");
|
|
286
286
|
}
|
|
287
287
|
else if ((element === null || element === void 0 ? void 0 : element.parentElement) && !element.parentElement.classList.contains("draggable-list")) {
|
|
288
288
|
this.addOverClass(element.parentElement);
|
|
@@ -307,21 +307,21 @@ let EzList = class {
|
|
|
307
307
|
let overCollection;
|
|
308
308
|
let overLastDroppableCollection;
|
|
309
309
|
if (this.useGroups) {
|
|
310
|
-
overCollection = (_a = this._groupContainer) === null || _a === void 0 ? void 0 : _a.getElementsByClassName(
|
|
311
|
-
overLastDroppableCollection = this._groupContainer.getElementsByClassName(
|
|
310
|
+
overCollection = (_a = this._groupContainer) === null || _a === void 0 ? void 0 : _a.getElementsByClassName("over");
|
|
311
|
+
overLastDroppableCollection = this._groupContainer.getElementsByClassName("last-droppable-space");
|
|
312
312
|
}
|
|
313
313
|
else {
|
|
314
|
-
overCollection = (_b = this._itemContainer) === null || _b === void 0 ? void 0 : _b.getElementsByClassName(
|
|
315
|
-
overLastDroppableCollection = this._itemContainer.getElementsByClassName(
|
|
314
|
+
overCollection = (_b = this._itemContainer) === null || _b === void 0 ? void 0 : _b.getElementsByClassName("over");
|
|
315
|
+
overLastDroppableCollection = this._itemContainer.getElementsByClassName("last-droppable-space");
|
|
316
316
|
}
|
|
317
317
|
if (overCollection) {
|
|
318
318
|
Array.from(overCollection).forEach(function (element) {
|
|
319
|
-
element.classList.remove(
|
|
319
|
+
element.classList.remove("over");
|
|
320
320
|
});
|
|
321
321
|
}
|
|
322
322
|
if (overLastDroppableCollection) {
|
|
323
323
|
Array.from(overLastDroppableCollection).forEach(function (element) {
|
|
324
|
-
element.classList.remove(
|
|
324
|
+
element.classList.remove("over");
|
|
325
325
|
});
|
|
326
326
|
}
|
|
327
327
|
}
|
|
@@ -472,7 +472,7 @@ let EzList = class {
|
|
|
472
472
|
onDragOverLastIndex(ev) {
|
|
473
473
|
ev.preventDefault();
|
|
474
474
|
if (this._dragStartItem) {
|
|
475
|
-
ev.target.classList.add(
|
|
475
|
+
ev.target.classList.add("over");
|
|
476
476
|
ev.stopPropagation();
|
|
477
477
|
}
|
|
478
478
|
}
|
|
@@ -498,7 +498,7 @@ let EzList = class {
|
|
|
498
498
|
return (index.h(index.Host, { ref: (el) => this._element = el }, this.useGroups ?
|
|
499
499
|
index.h("div", { class: "group-container", ref: (el) => this._groupContainer = el, tabIndex: 0, onKeyDown: (event) => { this.keyDownHandler(event); } }, this._listGroupItems.map(group => {
|
|
500
500
|
return index.h("div", { id: this.getDivGroupId(group.group), class: "group", key: group.group + group.items.length, onDrop: () => this.onDropGroup(group) }, index.h("label", { draggable: false, class: "group-name" }, group.group), index.h("section", { class: "section-container", onDragOver: (ev) => ev.preventDefault() }, index.h("div", { class: "group-items-container" }, index.h("div", { class: "draggable-list" }, group.items.map((item, index$1) => {
|
|
501
|
-
return index.h("li", { id:
|
|
501
|
+
return index.h("li", { id: "item_" + this.getItemId(item.label), class: this.ezSelectable ? "selectable-container" : "", key: "item_" + this.getItemId(item.label) }, index.h("div", { class: "draggable" + (item.selected == true ? " selected-item " : "") + (this.ezSelectable == true ? " selectable " : ""), onClick: () => { this.setSelection(item); }, onDragLeave: () => { group.sort ? undefined : this.removeOverClass(); }, onDragEnd: () => this.onDragEnd(), onDragStart: () => this.onDragStart(item, group, index$1), onDragOver: (event) => { group.sort ? undefined : this.onDragOverItem(event); }, onDrop: (event) => this.onDrop(event, { groupName: group.group, item: item, index: index$1 }), draggable: this.ezDraggable }, index.h("div", { class: "item-content" }, this.ezDraggable ? index.h("span", { class: "draggable-icon" }) : undefined, index.h("p", { title: item.label, class: "person-name text--ellipsis" }, item.label)), this.itemSlotBuilder ?
|
|
502
502
|
index.h("div", { class: "slot-item" }, this.itemSlotBuilder(item, group))
|
|
503
503
|
: undefined));
|
|
504
504
|
})), index.h("div", { class: "last-droppable-space", onDragLeave: () => this.removeOverClass(), onDragOver: (event) => { this.onDragOverLastIndex(event); }, onDragEnd: () => this.onDragEnd(), onDrop: (event) => this.onDropLastIndex(event, group) })), group.sort ?
|
|
@@ -507,7 +507,7 @@ let EzList = class {
|
|
|
507
507
|
}))
|
|
508
508
|
:
|
|
509
509
|
index.h("div", { class: "items-container", ref: (el) => this._itemContainer = el, tabIndex: 0, onKeyDown: (event) => { this.keyDownHandler(event); } }, index.h("div", { class: "draggable-list" }, this._listItems.map((item, index$1) => {
|
|
510
|
-
return index.h("li", { id:
|
|
510
|
+
return index.h("li", { id: "item_" + this.getItemId(item.label), class: this.ezSelectable ? "selectable-container" : "", key: "item_" + this.getItemId(item.label) }, index.h("div", { class: "draggable" + (item.selected == true ? " selected-item " : "") + (this.ezSelectable == true ? " selectable " : ""), onDragStart: () => this.onDragStart({ item: item, index: index$1 }), onClick: () => { this.setSelection(item); }, onDragLeave: () => this.removeOverClass(), onDragOver: (event) => this.onDragOverItem(event), onDragEnd: () => this.onDragEnd(), onDrop: (event) => this.onDrop(event, { item: item, index: index$1 }), draggable: this.ezDraggable }, index.h("div", { class: "item-content" }, this.ezDraggable ? index.h("span", { class: "draggable-icon" }) : undefined, index.h("p", { title: item.label, class: "person-name text--ellipsis" }, item.label)), this.itemSlotBuilder ?
|
|
511
511
|
index.h("div", null, this.itemSlotBuilder(item))
|
|
512
512
|
: undefined));
|
|
513
513
|
}), index.h("div", { class: "last-droppable-space", onDragLeave: () => this.removeOverClass(), onDragOver: (event) => { this.onDragOverLastIndex(event); }, onDragEnd: () => this.onDragEnd(), onDrop: (event) => this.onDropLastIndex(event) })))));
|
|
@@ -11,13 +11,17 @@ let EzLoadingBar = class {
|
|
|
11
11
|
index.registerInstance(this, hostRef);
|
|
12
12
|
this._showLoading = true;
|
|
13
13
|
}
|
|
14
|
-
|
|
14
|
+
/**
|
|
15
|
+
* Oculta o ez-loading-bar.
|
|
16
|
+
*/
|
|
17
|
+
async hide() {
|
|
15
18
|
this._showLoading = false;
|
|
16
|
-
return Promise.resolve();
|
|
17
19
|
}
|
|
18
|
-
|
|
20
|
+
/**
|
|
21
|
+
* Exibe o ez-loading-bar.
|
|
22
|
+
*/
|
|
23
|
+
async show() {
|
|
19
24
|
this._showLoading = true;
|
|
20
|
-
return Promise.resolve();
|
|
21
25
|
}
|
|
22
26
|
render() {
|
|
23
27
|
return (index.h(index.Host, null, this._showLoading && index.h("div", { class: "loading-bar" }, index.h("div", { class: "loading-bar__container" }))));
|
|
@@ -28,7 +28,7 @@ let EzModalContainer = class {
|
|
|
28
28
|
index.registerInstance(this, hostRef);
|
|
29
29
|
this.ezModalAction = index.createEvent(this, "ezModalAction", 7);
|
|
30
30
|
/**
|
|
31
|
-
*
|
|
31
|
+
* Define se o cabeçalho será mostrado.
|
|
32
32
|
*/
|
|
33
33
|
this.showTitleBar = true;
|
|
34
34
|
}
|
|
@@ -50,7 +50,7 @@ let EzModalContainer = class {
|
|
|
50
50
|
this._closeButton.focus();
|
|
51
51
|
}
|
|
52
52
|
render() {
|
|
53
|
-
return (index.h(index.Host, null, index.h("button", { class: "ez-modal-container__focus-ctrl", onFocusin: evt => this.focusLast(evt) }), this.showTitleBar && index.h("div", { class: "ez-modal-container__header ez-margin-bottom--large ez-align--middle" }, index.h("div", { class: "ez-col ez-align--middle ez-modal-container__title" }, index.h("h2", { class: "ez-text ez-title--large ez-title--primary ez-text--bold ez-margin-vertical--extra-small" }, this.modalTitle), this.modalSubTitle ? index.h("div", { class: "ez-text ez-text--medium ez-text--primary ez-margin-vertical--extra-small" }, this.modalSubTitle) : undefined), index.h("button", { ref: ref => this._closeButton = ref, class: "ez-modal-container__close-button", onClick: () => this.ezModalAction.emit(ModalAction$1.CLOSE) }, index.h("ez-icon", { class: "ez-modal-container__close-icon", size: "medium", iconName: "close" }))), index.h("div", null, index.h("slot", null)), index.h("div", { class:
|
|
53
|
+
return (index.h(index.Host, null, index.h("button", { class: "ez-modal-container__focus-ctrl", onFocusin: evt => this.focusLast(evt) }), this.showTitleBar && index.h("div", { class: "ez-modal-container__header ez-margin-bottom--large ez-align--middle" }, index.h("div", { class: "ez-col ez-align--middle ez-modal-container__title" }, index.h("h2", { class: "ez-text ez-title--large ez-title--primary ez-text--bold ez-margin-vertical--extra-small" }, this.modalTitle), this.modalSubTitle ? index.h("div", { class: "ez-text ez-text--medium ez-text--primary ez-margin-vertical--extra-small" }, this.modalSubTitle) : undefined), index.h("button", { ref: ref => this._closeButton = ref, class: "ez-modal-container__close-button", onClick: () => this.ezModalAction.emit(ModalAction$1.CLOSE) }, index.h("ez-icon", { class: "ez-modal-container__close-icon", size: "medium", iconName: "close" }))), index.h("div", null, index.h("slot", null)), index.h("div", { class: "ez-col ez-margin-left--auto" }, this.cancelIsVisible() ? index.h("ez-button", { label: this.cancelButtonLabel, enabled: this.cancelButtonStatus !== ModalButtonStatus$1.DISABLED, onClick: () => this.ezModalAction.emit(ModalAction$1.CANCEL) }) : undefined, this.okIsVisible() ? index.h("ez-button", { ref: ref => this._okButton = ref, label: this.okButtonLabel, enabled: this.okButtonStatus !== ModalButtonStatus$1.DISABLED, class: "ez-button--primary ez-margin-left--medium", onClick: () => this.ezModalAction.emit(ModalAction$1.OK) }) : undefined), index.h("button", { class: "ez-modal-container__focus-ctrl", onFocusin: evt => this.focusFirst(evt) })));
|
|
54
54
|
}
|
|
55
55
|
};
|
|
56
56
|
EzModalContainer.style = ezModalContainerCss;
|
|
@@ -12,16 +12,16 @@ let EzModal = class {
|
|
|
12
12
|
this.ezCloseModal = index.createEvent(this, "ezCloseModal", 7);
|
|
13
13
|
this.ezOpenModal = index.createEvent(this, "ezOpenModal", 7);
|
|
14
14
|
/**
|
|
15
|
-
|
|
16
|
-
|
|
15
|
+
* Define se o ez-modal está aberto.
|
|
16
|
+
*/
|
|
17
17
|
this.opened = true;
|
|
18
18
|
/**
|
|
19
|
-
|
|
20
|
-
|
|
19
|
+
* Define se o ez-modal será fechado ao clicar `ESC`.
|
|
20
|
+
*/
|
|
21
21
|
this.closeEsc = false;
|
|
22
22
|
/**
|
|
23
|
-
|
|
24
|
-
|
|
23
|
+
* Define se o modal será fechado ao clicar fora do conteúdo.
|
|
24
|
+
*/
|
|
25
25
|
this.closeOutsideClick = false;
|
|
26
26
|
this.handleKeyboardEvent = (ev) => {
|
|
27
27
|
if ((ev === null || ev === void 0 ? void 0 : ev.key) === "Escape" && this.closeEsc) {
|
|
@@ -16,28 +16,28 @@ let EzNumberInput = class {
|
|
|
16
16
|
this.ezCancelWaitingChange = index.createEvent(this, "ezCancelWaitingChange", 7);
|
|
17
17
|
this._focused = false;
|
|
18
18
|
/**
|
|
19
|
-
*
|
|
19
|
+
* Se false, o usuário não pode interagir com o campo.
|
|
20
20
|
*/
|
|
21
21
|
this.enabled = true;
|
|
22
22
|
/**
|
|
23
|
-
* Define o
|
|
23
|
+
* Define o tamanho do campo.
|
|
24
24
|
*/
|
|
25
25
|
this.mode = "regular";
|
|
26
26
|
}
|
|
27
27
|
/**
|
|
28
|
-
*
|
|
28
|
+
* Aplica o foco no campo.
|
|
29
29
|
*/
|
|
30
30
|
async setFocus() {
|
|
31
31
|
this._textInput.setFocus();
|
|
32
32
|
}
|
|
33
33
|
/**
|
|
34
|
-
* Remove o foco
|
|
34
|
+
* Remove o foco do campo.
|
|
35
35
|
*/
|
|
36
36
|
async setBlur() {
|
|
37
37
|
this._textInput.setBlur();
|
|
38
38
|
}
|
|
39
39
|
/**
|
|
40
|
-
* Retorna
|
|
40
|
+
* Retorna se o conteúdo é inválido.
|
|
41
41
|
*/
|
|
42
42
|
async isInvalid() {
|
|
43
43
|
return typeof this.errorMessage === "string" && this.errorMessage.trim() !== "";
|
|
@@ -13,29 +13,27 @@ let EzPopover = class {
|
|
|
13
13
|
this.ezVisibilityChange = index.createEvent(this, "ezVisibilityChange", 7);
|
|
14
14
|
this._firstRender = true;
|
|
15
15
|
/**
|
|
16
|
-
*
|
|
17
|
-
* quando o método show() for acionado.
|
|
16
|
+
* Define que será fechado automaticamente quando o usuário clicar fora do conteúdo.
|
|
18
17
|
*/
|
|
19
18
|
this.autoClose = true;
|
|
20
19
|
/**
|
|
21
|
-
*
|
|
20
|
+
* Define a distância do topo. Devem ser usados valores válidos de CSS.
|
|
22
21
|
*/
|
|
23
22
|
this.top = "0px";
|
|
24
23
|
/**
|
|
25
|
-
*
|
|
24
|
+
* Define a distância do lado esquerdo. Devem ser usados valores válidos de CSS.
|
|
26
25
|
*/
|
|
27
26
|
this.left = "0px";
|
|
28
27
|
/**
|
|
29
|
-
*
|
|
28
|
+
* Define a distância de baixo. Devem ser usados valores válidos de CSS.
|
|
30
29
|
*/
|
|
31
30
|
this.bottom = "0px";
|
|
32
31
|
/**
|
|
33
|
-
*
|
|
32
|
+
* Define a distância do lado direito. Devem ser usados valores válidos de CSS.
|
|
34
33
|
*/
|
|
35
34
|
this.right = "0px";
|
|
36
35
|
/**
|
|
37
36
|
* Ajusta o comportamento da largura do popover.
|
|
38
|
-
* Opções: "100% e "fit-content" (default)
|
|
39
37
|
*/
|
|
40
38
|
this.boxWidth = "fit-content";
|
|
41
39
|
this.innerClickTest = (_popOvercontainer, node, eventOrigin) => {
|
|
@@ -86,7 +84,7 @@ let EzPopover = class {
|
|
|
86
84
|
}
|
|
87
85
|
}
|
|
88
86
|
/**
|
|
89
|
-
* Atualiza a posição do popover
|
|
87
|
+
* Atualiza a posição do popover.
|
|
90
88
|
*/
|
|
91
89
|
async updatePosition(top = this.top, left = this.left, bottom = this.bottom, right = this.right) {
|
|
92
90
|
const floatingOptions = {
|
|
@@ -101,7 +99,7 @@ let EzPopover = class {
|
|
|
101
99
|
core.FloatingManager.updateFloatPosition(this._box, this._container, floatingOptions);
|
|
102
100
|
}
|
|
103
101
|
/**
|
|
104
|
-
*
|
|
102
|
+
* Exibe o ez-popover.
|
|
105
103
|
*/
|
|
106
104
|
async show(top = this.top, left = this.left, bottom = this.bottom, right = this.right) {
|
|
107
105
|
const floatingOptions = {
|
|
@@ -117,7 +115,7 @@ let EzPopover = class {
|
|
|
117
115
|
this.opened = true;
|
|
118
116
|
}
|
|
119
117
|
/**
|
|
120
|
-
*
|
|
118
|
+
* Oculta o ez-popover.
|
|
121
119
|
*/
|
|
122
120
|
async hide() {
|
|
123
121
|
if (this._floatingID !== undefined) {
|
|
@@ -18,20 +18,19 @@ let EzPopup = class {
|
|
|
18
18
|
"x-large": "col--sd-11"
|
|
19
19
|
};
|
|
20
20
|
/**
|
|
21
|
-
* Define
|
|
22
|
-
* compreendidos em [x-small | small | medium | large | x-large].
|
|
21
|
+
* Define a largura do ez-popup.
|
|
23
22
|
*/
|
|
24
23
|
this.size = "medium";
|
|
25
24
|
/**
|
|
26
|
-
*
|
|
25
|
+
* Define se o ez-popover está aberto.
|
|
27
26
|
*/
|
|
28
27
|
this.opened = false;
|
|
29
28
|
/**
|
|
30
|
-
* Define se o componente utilizará
|
|
29
|
+
* Define se o componente utilizará cabeçalho.
|
|
31
30
|
*/
|
|
32
31
|
this.useHeader = true;
|
|
33
32
|
/**
|
|
34
|
-
* Define
|
|
33
|
+
* Define altura do componente.
|
|
35
34
|
*/
|
|
36
35
|
this.heightMode = "full";
|
|
37
36
|
}
|
|
@@ -16,11 +16,11 @@ let EzRadioButton = class {
|
|
|
16
16
|
*/
|
|
17
17
|
this.options = [];
|
|
18
18
|
/**
|
|
19
|
-
|
|
20
|
-
|
|
19
|
+
* Se false o usuário não pode interagir com o campo.
|
|
20
|
+
*/
|
|
21
21
|
this.enabled = true;
|
|
22
22
|
/**
|
|
23
|
-
* Define a direção
|
|
23
|
+
* Define a direção dos itens.
|
|
24
24
|
*/
|
|
25
25
|
this.direction = "vertical";
|
|
26
26
|
}
|
|
@@ -20,16 +20,11 @@ let EzScroller = class {
|
|
|
20
20
|
this._classHidden = "ez-scroller__shadow--hidden";
|
|
21
21
|
this.isFirefox = false;
|
|
22
22
|
/**
|
|
23
|
-
*
|
|
24
|
-
* Por padrão, a direção é "Ambos".
|
|
25
|
-
*/
|
|
26
|
-
this.direction = EzScrollDirection.BOTH;
|
|
27
|
-
/**
|
|
28
|
-
* Determina se o scroll estará bloqueado quando necessário.
|
|
23
|
+
* Define se o `scroll` estará bloqueado.
|
|
29
24
|
*/
|
|
30
25
|
this.locked = false;
|
|
31
26
|
/**
|
|
32
|
-
*
|
|
27
|
+
* Define se haverá efeito de sombreado.
|
|
33
28
|
*/
|
|
34
29
|
this.activeShadow = false;
|
|
35
30
|
}
|
|
@@ -12,26 +12,25 @@ let EzSearch = class {
|
|
|
12
12
|
constructor(hostRef) {
|
|
13
13
|
index.registerInstance(this, hostRef);
|
|
14
14
|
this.ezChange = index.createEvent(this, "ezChange", 7);
|
|
15
|
-
this.showPopup = index.createEvent(this, "showPopup", 7);
|
|
16
15
|
/**
|
|
17
|
-
|
|
18
|
-
|
|
16
|
+
* Se false o usuário não pode interagir com o campo.
|
|
17
|
+
*/
|
|
19
18
|
this.enabled = true;
|
|
20
19
|
/**
|
|
21
|
-
|
|
22
|
-
|
|
20
|
+
* Se false a opção selecionada deve exibir somente o `label`.
|
|
21
|
+
*/
|
|
23
22
|
this.showSelectedValue = true;
|
|
24
23
|
/**
|
|
25
|
-
|
|
26
|
-
|
|
24
|
+
* Se false cada opção na lista deve exibir somente o `label`.
|
|
25
|
+
*/
|
|
27
26
|
this.showOptionValue = true;
|
|
28
27
|
/**
|
|
29
|
-
|
|
30
|
-
|
|
28
|
+
* Se true remove a opção vazia da lista.
|
|
29
|
+
*/
|
|
31
30
|
this.suppressEmptyOption = false;
|
|
32
31
|
/**
|
|
33
|
-
|
|
34
|
-
|
|
32
|
+
* Define o tamanho do campo.
|
|
33
|
+
*/
|
|
35
34
|
this.mode = "regular";
|
|
36
35
|
}
|
|
37
36
|
observeErrorMessage() {
|
|
@@ -45,19 +44,19 @@ let EzSearch = class {
|
|
|
45
44
|
}
|
|
46
45
|
}
|
|
47
46
|
/**
|
|
48
|
-
*
|
|
47
|
+
* Aplica o foco no campo.
|
|
49
48
|
*/
|
|
50
49
|
async setFocus() {
|
|
51
50
|
this._comboElement.setFocus();
|
|
52
51
|
}
|
|
53
52
|
/**
|
|
54
|
-
* Remove o foco
|
|
53
|
+
* Remove o foco do campo.
|
|
55
54
|
*/
|
|
56
55
|
async setBlur() {
|
|
57
56
|
this._comboElement.setBlur();
|
|
58
57
|
}
|
|
59
58
|
/**
|
|
60
|
-
* Retorna
|
|
59
|
+
* Retorna se o conteúdo é inválido.
|
|
61
60
|
*/
|
|
62
61
|
async isInvalid() {
|
|
63
62
|
return typeof this.errorMessage === "string" && this.errorMessage.trim() !== "";
|
|
@@ -12,19 +12,19 @@ let EzTextArea = class {
|
|
|
12
12
|
index.registerInstance(this, hostRef);
|
|
13
13
|
this.ezChange = index.createEvent(this, "ezChange", 7);
|
|
14
14
|
/**
|
|
15
|
-
*
|
|
15
|
+
* Se false o usuário não pode interagir com o campo.
|
|
16
16
|
*/
|
|
17
17
|
this.enabled = true;
|
|
18
18
|
/**
|
|
19
|
-
*
|
|
19
|
+
* Define o número de linhas.
|
|
20
20
|
*/
|
|
21
21
|
this.rows = 4;
|
|
22
22
|
/**
|
|
23
|
-
*
|
|
23
|
+
* Se false deixa de exibir a mensagem de erro dentro do campo.
|
|
24
24
|
*/
|
|
25
25
|
this.canShowError = true;
|
|
26
26
|
/**
|
|
27
|
-
* Define o
|
|
27
|
+
* Define o tamanho do campo.
|
|
28
28
|
*/
|
|
29
29
|
this.mode = "regular";
|
|
30
30
|
}
|
|
@@ -72,19 +72,19 @@ let EzTextArea = class {
|
|
|
72
72
|
// Public methods
|
|
73
73
|
//---------------------------------------------
|
|
74
74
|
/**
|
|
75
|
-
*
|
|
75
|
+
* Aplica o foco no campo.
|
|
76
76
|
*/
|
|
77
77
|
async setFocus() {
|
|
78
78
|
this._inputElem.focus();
|
|
79
79
|
}
|
|
80
80
|
/**
|
|
81
|
-
* Remove o foco
|
|
81
|
+
* Remove o foco do campo.
|
|
82
82
|
*/
|
|
83
83
|
async setBlur() {
|
|
84
84
|
this._inputElem.blur();
|
|
85
85
|
}
|
|
86
86
|
/**
|
|
87
|
-
* Retorna
|
|
87
|
+
* Retorna se o conteúdo é inválido.
|
|
88
88
|
*/
|
|
89
89
|
async isInvalid() {
|
|
90
90
|
return typeof this.errorMessage === "string" && this.errorMessage.trim() !== "";
|
|
@@ -12,19 +12,19 @@ let EzTextInput = class {
|
|
|
12
12
|
index.registerInstance(this, hostRef);
|
|
13
13
|
this.ezChange = index.createEvent(this, "ezChange", 7);
|
|
14
14
|
/**
|
|
15
|
-
*
|
|
15
|
+
* Se false o usuário não pode interagir com o campo.
|
|
16
16
|
*/
|
|
17
17
|
this.enabled = true;
|
|
18
18
|
/**
|
|
19
|
-
*
|
|
19
|
+
* Se false deixa de exibir a mensagem de erro dentro do campo.
|
|
20
20
|
*/
|
|
21
21
|
this.canShowError = true;
|
|
22
22
|
/**
|
|
23
|
-
* Define o
|
|
23
|
+
* Define o tamanho do campo.
|
|
24
24
|
*/
|
|
25
25
|
this.mode = "regular";
|
|
26
26
|
/**
|
|
27
|
-
*
|
|
27
|
+
* Se true o campo não terá bordas.
|
|
28
28
|
*/
|
|
29
29
|
this.noBorder = false;
|
|
30
30
|
}
|
|
@@ -109,19 +109,19 @@ let EzTextInput = class {
|
|
|
109
109
|
// Public methods
|
|
110
110
|
//---------------------------------------------
|
|
111
111
|
/**
|
|
112
|
-
*
|
|
112
|
+
* Aplica o foco no campo.
|
|
113
113
|
*/
|
|
114
114
|
async setFocus() {
|
|
115
115
|
this._inputElem.focus();
|
|
116
116
|
}
|
|
117
117
|
/**
|
|
118
|
-
* Remove o foco
|
|
118
|
+
* Remove o foco do campo.
|
|
119
119
|
*/
|
|
120
120
|
async setBlur() {
|
|
121
121
|
this._inputElem.blur();
|
|
122
122
|
}
|
|
123
123
|
/**
|
|
124
|
-
* Retorna
|
|
124
|
+
* Retorna se o conteúdo é inválido.
|
|
125
125
|
*/
|
|
126
126
|
async isInvalid() {
|
|
127
127
|
return typeof this.errorMessage === "string" && this.errorMessage.trim() !== "";
|