@sankhyalabs/ezui 7.1.0-dev.4 → 7.1.0-dev.6
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/dist/cjs/ez-modal-container.cjs.entry.js +2 -11
- package/dist/cjs/ez-popup.cjs.entry.js +4 -1
- package/dist/cjs/ez-tree.cjs.entry.js +40 -3
- package/dist/cjs/ezui.cjs.js +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/components/ez-modal-container/ez-modal-container.css +2 -8
- package/dist/collection/components/ez-modal-container/ez-modal-container.js +1 -10
- package/dist/collection/components/ez-popup/ez-popup.js +4 -1
- package/dist/collection/components/ez-tree/ez-tree.css +4 -0
- package/dist/collection/components/ez-tree/ez-tree.js +56 -2
- package/dist/collection/components/ez-tree/types/Tree.js +2 -0
- package/dist/custom-elements/index.js +47 -16
- package/dist/esm/ez-modal-container.entry.js +2 -11
- package/dist/esm/ez-popup.entry.js +4 -1
- package/dist/esm/ez-tree.entry.js +40 -3
- 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-6d8f5cb0.entry.js +1 -0
- package/dist/ezui/p-870506ba.entry.js +1 -0
- package/dist/ezui/p-ce5d69da.entry.js +1 -0
- package/dist/types/components/ez-modal-container/ez-modal-container.d.ts +0 -2
- package/dist/types/components/ez-popup/ez-popup.d.ts +1 -0
- package/dist/types/components/ez-tree/ez-tree.d.ts +5 -0
- package/dist/types/components.d.ts +8 -0
- package/package.json +1 -1
- package/dist/ezui/p-02f6e3b0.entry.js +0 -1
- package/dist/ezui/p-191cfbc8.entry.js +0 -1
- package/dist/ezui/p-4c99a015.entry.js +0 -1
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
:host {
|
|
2
2
|
--ez-modal-container-overflow-y: auto;
|
|
3
3
|
--ez-modal-container-overflow-x: hidden;
|
|
4
|
-
display:
|
|
5
|
-
|
|
4
|
+
display: flex;
|
|
5
|
+
flex-direction: column;
|
|
6
6
|
width: 100%;
|
|
7
7
|
height: 100%;
|
|
8
8
|
}
|
|
@@ -55,9 +55,3 @@
|
|
|
55
55
|
.ez-modal-container__close-icon {
|
|
56
56
|
--icon--color: var(--title--primary, #2B3A54)
|
|
57
57
|
}
|
|
58
|
-
|
|
59
|
-
.ez-modal-container__focus-ctrl {
|
|
60
|
-
height: 0px;
|
|
61
|
-
background-color: transparent;
|
|
62
|
-
border: none;
|
|
63
|
-
}
|
|
@@ -46,17 +46,8 @@ export class EzModalContainer {
|
|
|
46
46
|
closeModal() {
|
|
47
47
|
this.ezModalAction.emit("CLOSE");
|
|
48
48
|
}
|
|
49
|
-
focusLast() {
|
|
50
|
-
if (this._okButton == undefined) {
|
|
51
|
-
return;
|
|
52
|
-
}
|
|
53
|
-
this._okButton.setFocus();
|
|
54
|
-
}
|
|
55
|
-
focusFirst() {
|
|
56
|
-
this._closeButton.focus();
|
|
57
|
-
}
|
|
58
49
|
render() {
|
|
59
|
-
return (h(Host, null, h("
|
|
50
|
+
return (h(Host, null, h("header", { ref: ref => this._modalRef = ref, tabIndex: -1, class: "ez-modal-container__header-container" }, this.showTitleBar && (h("div", { class: "ez-modal-container__header ez-margin-bottom--medium" }, h("div", { class: "ez-col ez-align--middle ez-modal-container__title" }, h("h2", { class: "ez-text ez-title--large ez-title--primary ez-text--bold ez-margin-vertical--extra-small" }, this.modalTitle), this.modalSubTitle && (h("div", { class: "ez-text ez-text--medium ez-text--primary ez-margin-vertical--extra-small" }, this.modalSubTitle))), (this.showCloseButton && h("button", { ref: ref => this._closeButton = ref, class: "ez-modal-container__close-button", onClick: () => this.ezModalAction.emit(ModalAction.CLOSE), "aria-label": this.i18n("app.close") }, h("ez-icon", { class: "ez-modal-container__close-icon", size: "medium", iconName: "close" })))))), h("main", { tabIndex: -1, class: "ez-modal-container__content" }, h("slot", null)), h("footer", { tabIndex: -1, class: "ez-modal-container__footer" }, this.cancelIsVisible() && (h("ez-button", { label: this.cancelButtonLabel || this.i18n("app.cancel"), isDisabled: this.cancelButtonStatus === ModalButtonStatus.DISABLED, onClick: () => this.ezModalAction.emit(ModalAction.CANCEL) })), this.okIsVisible() && (h("ez-button", { ref: ref => this._okButton = ref, class: "ez-button--primary", label: this.okButtonLabel || this.i18n("app.ok"), isDisabled: this.okButtonStatus === ModalButtonStatus.DISABLED, onClick: () => this.ezModalAction.emit(ModalAction.OK) })))));
|
|
60
51
|
}
|
|
61
52
|
static get is() { return "ez-modal-container"; }
|
|
62
53
|
static get encapsulation() { return "scoped"; }
|
|
@@ -141,9 +141,12 @@ export class EzPopup {
|
|
|
141
141
|
};
|
|
142
142
|
}
|
|
143
143
|
}
|
|
144
|
+
renderFooterButtons() {
|
|
145
|
+
return this.footerButtons.slice(0, 3).map((buttonProps, index) => (h("ez-button", Object.assign({ key: index }, this.handleDefaultPropsButtonsByIndex(index), buttonProps))));
|
|
146
|
+
}
|
|
144
147
|
render() {
|
|
145
148
|
return (h(Host, null, this.opened && (h("div", { class: "overlay", tabIndex: -1, onClick: this.handleAutoClose.bind(this) }, h("dialog", { ref: ref => this._popupRef = ref, class: this.getDialogClass() }, this.useHeader &&
|
|
146
|
-
h("header", { class: "popup__header" }, !!this.ezTitle && h("h1", { class: "popup__title" }, this.ezTitle), h("ez-button", { class: this.ezTitle ? "btn-close" : "btn-close btn-close--solo", variant: "tertiary", mode: "icon", iconName: "close", size: "small", onClick: this.closePopup.bind(this) })), h("main", { class: "popup__expandable-content" }, h("slot", null)),
|
|
149
|
+
h("header", { class: "popup__header" }, !!this.ezTitle && h("h1", { class: "popup__title" }, this.ezTitle), h("ez-button", { class: this.ezTitle ? "btn-close" : "btn-close btn-close--solo", variant: "tertiary", mode: "icon", iconName: "close", size: "small", onClick: this.closePopup.bind(this) })), h("main", { class: "popup__expandable-content" }, h("slot", null)), h("footer", { class: "popup__footer" }, this.footerButtons.length > 0 && (this.renderFooterButtons()), h("slot", { name: 'footer' })))))));
|
|
147
150
|
}
|
|
148
151
|
static get is() { return "ez-popup"; }
|
|
149
152
|
static get encapsulation() { return "shadow"; }
|
|
@@ -8,6 +8,9 @@
|
|
|
8
8
|
--ez-tree--margin: var(--space--extra-small, 3px);
|
|
9
9
|
/*@doc Define a margem da direita do componente.*/
|
|
10
10
|
--ez-tree--margin-right: 0px;
|
|
11
|
+
|
|
12
|
+
/*@doc Define se o texto dos itens pode ser selecionado pelo usuário.*/
|
|
13
|
+
--ez-tree--user-select: auto;
|
|
11
14
|
|
|
12
15
|
/* Fontes e cor de ícones*/
|
|
13
16
|
/*@doc Define a família da fonte.*/
|
|
@@ -197,6 +200,7 @@ ul.first-level {
|
|
|
197
200
|
text-overflow: ellipsis;
|
|
198
201
|
overflow: hidden;
|
|
199
202
|
white-space: nowrap;
|
|
203
|
+
user-select: var(--ez-tree--user-select);
|
|
200
204
|
|
|
201
205
|
/*public*/
|
|
202
206
|
font-family: var(--ez-tree--font-family);
|
|
@@ -7,11 +7,18 @@ import initI18n from '../../utils/i18n';
|
|
|
7
7
|
export class EzTree {
|
|
8
8
|
constructor() {
|
|
9
9
|
this._onItemClick = (item) => {
|
|
10
|
-
this.
|
|
10
|
+
if (!this.selectable) {
|
|
11
|
+
this.openClose(item);
|
|
12
|
+
return;
|
|
13
|
+
}
|
|
14
|
+
if (this.value && this.value.id === item.id) {
|
|
15
|
+
this.value = undefined;
|
|
16
|
+
return;
|
|
17
|
+
}
|
|
18
|
+
this.value = item;
|
|
11
19
|
};
|
|
12
20
|
this._onIconClick = (item) => {
|
|
13
21
|
this.openClose(item);
|
|
14
|
-
this.value = item;
|
|
15
22
|
};
|
|
16
23
|
this._tree = new Tree(() => forceUpdate(this));
|
|
17
24
|
this._waintingForLoad = undefined;
|
|
@@ -21,6 +28,7 @@ export class EzTree {
|
|
|
21
28
|
this.iconResolver = defaultIconResolver;
|
|
22
29
|
this.tooltipResolver = undefined;
|
|
23
30
|
this.enableHierarchicalFilter = true;
|
|
31
|
+
this.selectable = true;
|
|
24
32
|
}
|
|
25
33
|
/**
|
|
26
34
|
* Efetua a seleção de um item.
|
|
@@ -71,10 +79,14 @@ export class EzTree {
|
|
|
71
79
|
parentId = (_a = this.value) === null || _a === void 0 ? void 0 : _a.id;
|
|
72
80
|
}
|
|
73
81
|
this._tree.addChildAt(parentId, item);
|
|
82
|
+
this.addItemInIndexedList(parentId, item);
|
|
74
83
|
const node = this._tree.getNode(parentId);
|
|
75
84
|
if (node) {
|
|
76
85
|
node.item.expanded = true;
|
|
77
86
|
}
|
|
87
|
+
else {
|
|
88
|
+
this.collapseAll();
|
|
89
|
+
}
|
|
78
90
|
}
|
|
79
91
|
/**
|
|
80
92
|
* Efetua a seleção de um item.
|
|
@@ -190,6 +202,30 @@ export class EzTree {
|
|
|
190
202
|
event.preventDefault();
|
|
191
203
|
}
|
|
192
204
|
}
|
|
205
|
+
addItemInIndexedList(parentId, item, items) {
|
|
206
|
+
var _a, _b;
|
|
207
|
+
items = (_a = items !== null && items !== void 0 ? items : this.items) !== null && _a !== void 0 ? _a : [];
|
|
208
|
+
if (!parentId) {
|
|
209
|
+
items.push(item);
|
|
210
|
+
return true;
|
|
211
|
+
}
|
|
212
|
+
for (const treeItem of items) {
|
|
213
|
+
if (treeItem.id === parentId) {
|
|
214
|
+
treeItem.children = ((_b = treeItem.children) !== null && _b !== void 0 ? _b : []);
|
|
215
|
+
treeItem.children.push(item);
|
|
216
|
+
treeItem.childrenCount = treeItem.children.length;
|
|
217
|
+
return true;
|
|
218
|
+
}
|
|
219
|
+
else if (treeItem.children && Array.isArray(treeItem.children)) {
|
|
220
|
+
const result = this.addItemInIndexedList(parentId, item, treeItem.children);
|
|
221
|
+
if (result) {
|
|
222
|
+
return true;
|
|
223
|
+
}
|
|
224
|
+
}
|
|
225
|
+
}
|
|
226
|
+
;
|
|
227
|
+
return false;
|
|
228
|
+
}
|
|
193
229
|
getItemPathAttrs({ id, label }) {
|
|
194
230
|
return { id, label };
|
|
195
231
|
}
|
|
@@ -427,6 +463,24 @@ export class EzTree {
|
|
|
427
463
|
"attribute": "enable-hierarchical-filter",
|
|
428
464
|
"reflect": false,
|
|
429
465
|
"defaultValue": "true"
|
|
466
|
+
},
|
|
467
|
+
"selectable": {
|
|
468
|
+
"type": "boolean",
|
|
469
|
+
"mutable": false,
|
|
470
|
+
"complexType": {
|
|
471
|
+
"original": "boolean",
|
|
472
|
+
"resolved": "boolean",
|
|
473
|
+
"references": {}
|
|
474
|
+
},
|
|
475
|
+
"required": false,
|
|
476
|
+
"optional": false,
|
|
477
|
+
"docs": {
|
|
478
|
+
"tags": [],
|
|
479
|
+
"text": "Define se os itens da \u00E1rvore s\u00E3o selecion\u00E1veis."
|
|
480
|
+
},
|
|
481
|
+
"attribute": "selectable",
|
|
482
|
+
"reflect": false,
|
|
483
|
+
"defaultValue": "true"
|
|
430
484
|
}
|
|
431
485
|
};
|
|
432
486
|
}
|
|
@@ -80706,7 +80706,7 @@ var ModalButtonStatus;
|
|
|
80706
80706
|
})(ModalButtonStatus || (ModalButtonStatus = {}));
|
|
80707
80707
|
const ModalButtonStatus$1 = ModalButtonStatus;
|
|
80708
80708
|
|
|
80709
|
-
const ezModalContainerCss = ".sc-ez-modal-container-h{--ez-modal-container-overflow-y:auto;--ez-modal-container-overflow-x:hidden;display:
|
|
80709
|
+
const ezModalContainerCss = ".sc-ez-modal-container-h{--ez-modal-container-overflow-y:auto;--ez-modal-container-overflow-x:hidden;display:flex;flex-direction:column;width:100%;height:100%}.ez-modal-container__header-container.sc-ez-modal-container{outline:none}.ez-modal-container__header.sc-ez-modal-container{display:flex;flex-wrap:nowrap;flex-direction:row;justify-content:space-between;align-items:start}.ez-modal-container__content.sc-ez-modal-container{overflow-y:var(--ez-modal-container-overflow-y);overflow-x:var(--ez-modal-container-overflow-x);outline:none}.ez-modal-container__content.sc-ez-modal-container::-webkit-scrollbar{width:var(--space--small);min-width:var(--space--small);max-width:var(--space--small)}.ez-modal-container__footer.sc-ez-modal-container{display:flex;flex-direction:row;justify-content:flex-end;gap:var(--space--medium);width:100%;padding-top:var(--space--small, 6px)}.ez-modal-container__title.sc-ez-modal-container{display:grid}.ez-modal-container__close-button.sc-ez-modal-container{cursor:pointer;background-color:transparent;border:none;outline:none;padding:var(--space--6, 6px) 0px}.ez-modal-container__close-icon.sc-ez-modal-container{--icon--color:var(--title--primary, #2B3A54)}";
|
|
80710
80710
|
|
|
80711
80711
|
const EzModalContainer$1 = class extends HTMLElement$1 {
|
|
80712
80712
|
constructor() {
|
|
@@ -80754,17 +80754,8 @@ const EzModalContainer$1 = class extends HTMLElement$1 {
|
|
|
80754
80754
|
closeModal() {
|
|
80755
80755
|
this.ezModalAction.emit("CLOSE");
|
|
80756
80756
|
}
|
|
80757
|
-
focusLast() {
|
|
80758
|
-
if (this._okButton == undefined) {
|
|
80759
|
-
return;
|
|
80760
|
-
}
|
|
80761
|
-
this._okButton.setFocus();
|
|
80762
|
-
}
|
|
80763
|
-
focusFirst() {
|
|
80764
|
-
this._closeButton.focus();
|
|
80765
|
-
}
|
|
80766
80757
|
render() {
|
|
80767
|
-
return (h(Host, null, h("
|
|
80758
|
+
return (h(Host, null, h("header", { ref: ref => this._modalRef = ref, tabIndex: -1, class: "ez-modal-container__header-container" }, this.showTitleBar && (h("div", { class: "ez-modal-container__header ez-margin-bottom--medium" }, h("div", { class: "ez-col ez-align--middle ez-modal-container__title" }, h("h2", { class: "ez-text ez-title--large ez-title--primary ez-text--bold ez-margin-vertical--extra-small" }, this.modalTitle), this.modalSubTitle && (h("div", { class: "ez-text ez-text--medium ez-text--primary ez-margin-vertical--extra-small" }, this.modalSubTitle))), (this.showCloseButton && h("button", { ref: ref => this._closeButton = ref, class: "ez-modal-container__close-button", onClick: () => this.ezModalAction.emit(ModalAction$1.CLOSE), "aria-label": this.i18n("app.close") }, h("ez-icon", { class: "ez-modal-container__close-icon", size: "medium", iconName: "close" })))))), h("main", { tabIndex: -1, class: "ez-modal-container__content" }, h("slot", null)), h("footer", { tabIndex: -1, class: "ez-modal-container__footer" }, this.cancelIsVisible() && (h("ez-button", { label: this.cancelButtonLabel || this.i18n("app.cancel"), isDisabled: this.cancelButtonStatus === ModalButtonStatus$1.DISABLED, onClick: () => this.ezModalAction.emit(ModalAction$1.CANCEL) })), this.okIsVisible() && (h("ez-button", { ref: ref => this._okButton = ref, class: "ez-button--primary", label: this.okButtonLabel || this.i18n("app.ok"), isDisabled: this.okButtonStatus === ModalButtonStatus$1.DISABLED, onClick: () => this.ezModalAction.emit(ModalAction$1.OK) })))));
|
|
80768
80759
|
}
|
|
80769
80760
|
get _element() { return this; }
|
|
80770
80761
|
static get style() { return ezModalContainerCss; }
|
|
@@ -83456,9 +83447,12 @@ const EzPopup$1 = class extends HTMLElement$1 {
|
|
|
83456
83447
|
};
|
|
83457
83448
|
}
|
|
83458
83449
|
}
|
|
83450
|
+
renderFooterButtons() {
|
|
83451
|
+
return this.footerButtons.slice(0, 3).map((buttonProps, index) => (h("ez-button", Object.assign({ key: index }, this.handleDefaultPropsButtonsByIndex(index), buttonProps))));
|
|
83452
|
+
}
|
|
83459
83453
|
render() {
|
|
83460
83454
|
return (h(Host, null, this.opened && (h("div", { class: "overlay", tabIndex: -1, onClick: this.handleAutoClose.bind(this) }, h("dialog", { ref: ref => this._popupRef = ref, class: this.getDialogClass() }, this.useHeader &&
|
|
83461
|
-
h("header", { class: "popup__header" }, !!this.ezTitle && h("h1", { class: "popup__title" }, this.ezTitle), h("ez-button", { class: this.ezTitle ? "btn-close" : "btn-close btn-close--solo", variant: "tertiary", mode: "icon", iconName: "close", size: "small", onClick: this.closePopup.bind(this) })), h("main", { class: "popup__expandable-content" }, h("slot", null)),
|
|
83455
|
+
h("header", { class: "popup__header" }, !!this.ezTitle && h("h1", { class: "popup__title" }, this.ezTitle), h("ez-button", { class: this.ezTitle ? "btn-close" : "btn-close btn-close--solo", variant: "tertiary", mode: "icon", iconName: "close", size: "small", onClick: this.closePopup.bind(this) })), h("main", { class: "popup__expandable-content" }, h("slot", null)), h("footer", { class: "popup__footer" }, this.footerButtons.length > 0 && (this.renderFooterButtons()), h("slot", { name: 'footer' })))))));
|
|
83462
83456
|
}
|
|
83463
83457
|
get _element() { return this; }
|
|
83464
83458
|
static get watchers() { return {
|
|
@@ -92456,6 +92450,8 @@ class Tree extends Node$1 {
|
|
|
92456
92450
|
async addChildAt(parentId, item) {
|
|
92457
92451
|
const parent = this.getNode(parentId);
|
|
92458
92452
|
if (parent == undefined) {
|
|
92453
|
+
this.addChild(this, item);
|
|
92454
|
+
this._changeCallback();
|
|
92459
92455
|
return;
|
|
92460
92456
|
}
|
|
92461
92457
|
parent.addChild(this, item);
|
|
@@ -92642,7 +92638,7 @@ class Tree extends Node$1 {
|
|
|
92642
92638
|
}
|
|
92643
92639
|
}
|
|
92644
92640
|
|
|
92645
|
-
const ezTreeCss = ":host{--ez-tree--border-radius:var(--border--radius-small, 8px);--ez-tree--padding-inline-start:20px;--ez-tree--margin:var(--space--extra-small, 3px);--ez-tree--margin-right:0px;--ez-tree--font-family:var(--font-pattern, Arial);--ez-tree--font-size:var(--text--medium, 14px);--ez-tree--selected--font-weight:var(--text-weight--large, 600);--ez-tree--font-weight:var(--text-weight--small, 400);--ez-tree--color:var(--title--primary, #2B3A54);--ez-tree--selected--color:var(--color--primary, #008561);--ez-tree--disabled--color:var(--text--disable, #AFB6C0);--ez-tree--font-weight--bold:var(--text-weight--large, 600);--ez-tree__tree-item--height:var(--size-medium, 18px);--ez-tree__tree-item--padding:var(--space--small, 6px);--ez-tree__tree-item--background-color:var(--background--xlight, #FFFFFF);--ez-tree__tree-item--selected--background-color:var(--color--primary-300, #E2F4EF);--ez-tree__tree-item--hover--background-color:var(--background--medium, #F0F3F7);--ez-tree__tree-item--disabled--background-color:var(--ez-tree__tree-Item--background-color);--ez-tree__item-icon-box--height:var(--ez-tree__tree-item--height);--ez-tree__item-icon-box--width:var(--size-medium, 18px);--ez-tree__item-icon-box--padding:var(--ez-tree__tree-item--padding);--ez-tree__badge--icon-color--default:var(--title--primary, #2B3A54);--ez-tree__badge--icon-color--error:var(--color--error, #da4453);--ez-tree__badge--icon-color--success:var(--color-alert--success-800, #157a00);--ez-tree__badge--icon-color--warning:var(--color--warning, #f2d410);--ez-tree__badge--icon-color--disabled:var(--text--disable, #AFB6C0);display:flex;flex-direction:column;margin:0 var(--ez-tree--margin) var(--ez-tree--margin) var(--ez-tree--margin);outline:none}ul{list-style-type:none;margin:0;cursor:default;padding-inline-start:var(--ez-tree--padding-inline-start)}ul.first-level{padding-inline-start:0}.tree-item-badge{width:16px;height:16px;background:transparent;border-radius:50%;transition:all 300ms ease-in-out;display:flex;align-items:center;justify-content:center}.tree-item-badge-error-icon{--ez-icon--color:white}.tree-item-badge-text{font-family:var(--ez-tree--font-family);font-size:var(--ez-tree--font-size);font-weight:var(--ez-tree--font-weight);color:var(--ez-tree--color)}.tree-item-badge.error{background:var(--color--error)}.tree-item-badge.warning{background:var(--color--warning)}.tree-item-badge.success{background:var(--color--success)}.item-label-container{display:flex;align-items:center;overflow:hidden}.tree-item{display:flex;align-items:center;cursor:pointer;margin-top:var(--ez-tree--margin);margin-right:var(--ez-tree--margin-right);border-radius:var(--ez-tree--border-radius);height:var(--ez-tree__tree-item--height);padding:var(--ez-tree__tree-item--padding);justify-content:space-between}.tree-item[selected]{background-color:var(--ez-tree__tree-item--selected--background-color)}.tree-item:hover{background-color:var(--ez-tree__tree-item--hover--background-color)}.tree-item[disabled],.tree-item[disabled]:hover{background-color:var(--ez-tree__tree-item--disabled--background-color)}.item-icon-box{display:flex;align-items:center;justify-content:center;width:var(--ez-tree__item-icon-box--width);height:var(--ez-tree__item-icon-box--height);padding:var(--ez-tree__item-icon-box--padding) var(--ez-tree__item-icon-box--padding) var(--ez-tree__item-icon-box--padding) 0}.item-icon{--ez-icon--color:var(--ez-tree--color)}.item-icon:hover{cursor:pointer}.tree-item[selected] .item-icon{--ez-icon--color:var(--ez-tree--selected--color)}.tree-item[disabled] .item-icon{cursor:unset;--ez-icon--color:var(--ez-tree--disabled--color)}.item-label{cursor:inherit;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-family:var(--ez-tree--font-family);font-size:var(--ez-tree--font-size);font-weight:var(--ez-tree--font-weight);color:var(--ez-tree--color)}.item-label--bold{font-weight:var(--ez-tree--font-weight--bold)}.tree-item[selected] .item-label{color:var(--ez-tree--selected--color);font-weight:var(--ez-tree--selected--font-weight)}.tree-item[disabled] .item-label{color:var(--ez-tree--disabled--color)}";
|
|
92641
|
+
const ezTreeCss = ":host{--ez-tree--border-radius:var(--border--radius-small, 8px);--ez-tree--padding-inline-start:20px;--ez-tree--margin:var(--space--extra-small, 3px);--ez-tree--margin-right:0px;--ez-tree--user-select:auto;--ez-tree--font-family:var(--font-pattern, Arial);--ez-tree--font-size:var(--text--medium, 14px);--ez-tree--selected--font-weight:var(--text-weight--large, 600);--ez-tree--font-weight:var(--text-weight--small, 400);--ez-tree--color:var(--title--primary, #2B3A54);--ez-tree--selected--color:var(--color--primary, #008561);--ez-tree--disabled--color:var(--text--disable, #AFB6C0);--ez-tree--font-weight--bold:var(--text-weight--large, 600);--ez-tree__tree-item--height:var(--size-medium, 18px);--ez-tree__tree-item--padding:var(--space--small, 6px);--ez-tree__tree-item--background-color:var(--background--xlight, #FFFFFF);--ez-tree__tree-item--selected--background-color:var(--color--primary-300, #E2F4EF);--ez-tree__tree-item--hover--background-color:var(--background--medium, #F0F3F7);--ez-tree__tree-item--disabled--background-color:var(--ez-tree__tree-Item--background-color);--ez-tree__item-icon-box--height:var(--ez-tree__tree-item--height);--ez-tree__item-icon-box--width:var(--size-medium, 18px);--ez-tree__item-icon-box--padding:var(--ez-tree__tree-item--padding);--ez-tree__badge--icon-color--default:var(--title--primary, #2B3A54);--ez-tree__badge--icon-color--error:var(--color--error, #da4453);--ez-tree__badge--icon-color--success:var(--color-alert--success-800, #157a00);--ez-tree__badge--icon-color--warning:var(--color--warning, #f2d410);--ez-tree__badge--icon-color--disabled:var(--text--disable, #AFB6C0);display:flex;flex-direction:column;margin:0 var(--ez-tree--margin) var(--ez-tree--margin) var(--ez-tree--margin);outline:none}ul{list-style-type:none;margin:0;cursor:default;padding-inline-start:var(--ez-tree--padding-inline-start)}ul.first-level{padding-inline-start:0}.tree-item-badge{width:16px;height:16px;background:transparent;border-radius:50%;transition:all 300ms ease-in-out;display:flex;align-items:center;justify-content:center}.tree-item-badge-error-icon{--ez-icon--color:white}.tree-item-badge-text{font-family:var(--ez-tree--font-family);font-size:var(--ez-tree--font-size);font-weight:var(--ez-tree--font-weight);color:var(--ez-tree--color)}.tree-item-badge.error{background:var(--color--error)}.tree-item-badge.warning{background:var(--color--warning)}.tree-item-badge.success{background:var(--color--success)}.item-label-container{display:flex;align-items:center;overflow:hidden}.tree-item{display:flex;align-items:center;cursor:pointer;margin-top:var(--ez-tree--margin);margin-right:var(--ez-tree--margin-right);border-radius:var(--ez-tree--border-radius);height:var(--ez-tree__tree-item--height);padding:var(--ez-tree__tree-item--padding);justify-content:space-between}.tree-item[selected]{background-color:var(--ez-tree__tree-item--selected--background-color)}.tree-item:hover{background-color:var(--ez-tree__tree-item--hover--background-color)}.tree-item[disabled],.tree-item[disabled]:hover{background-color:var(--ez-tree__tree-item--disabled--background-color)}.item-icon-box{display:flex;align-items:center;justify-content:center;width:var(--ez-tree__item-icon-box--width);height:var(--ez-tree__item-icon-box--height);padding:var(--ez-tree__item-icon-box--padding) var(--ez-tree__item-icon-box--padding) var(--ez-tree__item-icon-box--padding) 0}.item-icon{--ez-icon--color:var(--ez-tree--color)}.item-icon:hover{cursor:pointer}.tree-item[selected] .item-icon{--ez-icon--color:var(--ez-tree--selected--color)}.tree-item[disabled] .item-icon{cursor:unset;--ez-icon--color:var(--ez-tree--disabled--color)}.item-label{cursor:inherit;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;user-select:var(--ez-tree--user-select);font-family:var(--ez-tree--font-family);font-size:var(--ez-tree--font-size);font-weight:var(--ez-tree--font-weight);color:var(--ez-tree--color)}.item-label--bold{font-weight:var(--ez-tree--font-weight--bold)}.tree-item[selected] .item-label{color:var(--ez-tree--selected--color);font-weight:var(--ez-tree--selected--font-weight)}.tree-item[disabled] .item-label{color:var(--ez-tree--disabled--color)}";
|
|
92646
92642
|
|
|
92647
92643
|
const EzTree$1 = class extends HTMLElement$1 {
|
|
92648
92644
|
constructor() {
|
|
@@ -92653,11 +92649,18 @@ const EzTree$1 = class extends HTMLElement$1 {
|
|
|
92653
92649
|
this.ezOpenItem = createEvent(this, "ezOpenItem", 7);
|
|
92654
92650
|
this.ezDbClickItem = createEvent(this, "ezDbClickItem", 7);
|
|
92655
92651
|
this._onItemClick = (item) => {
|
|
92656
|
-
this.
|
|
92652
|
+
if (!this.selectable) {
|
|
92653
|
+
this.openClose(item);
|
|
92654
|
+
return;
|
|
92655
|
+
}
|
|
92656
|
+
if (this.value && this.value.id === item.id) {
|
|
92657
|
+
this.value = undefined;
|
|
92658
|
+
return;
|
|
92659
|
+
}
|
|
92660
|
+
this.value = item;
|
|
92657
92661
|
};
|
|
92658
92662
|
this._onIconClick = (item) => {
|
|
92659
92663
|
this.openClose(item);
|
|
92660
|
-
this.value = item;
|
|
92661
92664
|
};
|
|
92662
92665
|
this._tree = new Tree(() => forceUpdate(this));
|
|
92663
92666
|
this._waintingForLoad = undefined;
|
|
@@ -92667,6 +92670,7 @@ const EzTree$1 = class extends HTMLElement$1 {
|
|
|
92667
92670
|
this.iconResolver = defaultIconResolver;
|
|
92668
92671
|
this.tooltipResolver = undefined;
|
|
92669
92672
|
this.enableHierarchicalFilter = true;
|
|
92673
|
+
this.selectable = true;
|
|
92670
92674
|
}
|
|
92671
92675
|
/**
|
|
92672
92676
|
* Efetua a seleção de um item.
|
|
@@ -92717,10 +92721,14 @@ const EzTree$1 = class extends HTMLElement$1 {
|
|
|
92717
92721
|
parentId = (_a = this.value) === null || _a === void 0 ? void 0 : _a.id;
|
|
92718
92722
|
}
|
|
92719
92723
|
this._tree.addChildAt(parentId, item);
|
|
92724
|
+
this.addItemInIndexedList(parentId, item);
|
|
92720
92725
|
const node = this._tree.getNode(parentId);
|
|
92721
92726
|
if (node) {
|
|
92722
92727
|
node.item.expanded = true;
|
|
92723
92728
|
}
|
|
92729
|
+
else {
|
|
92730
|
+
this.collapseAll();
|
|
92731
|
+
}
|
|
92724
92732
|
}
|
|
92725
92733
|
/**
|
|
92726
92734
|
* Efetua a seleção de um item.
|
|
@@ -92836,6 +92844,29 @@ const EzTree$1 = class extends HTMLElement$1 {
|
|
|
92836
92844
|
event.preventDefault();
|
|
92837
92845
|
}
|
|
92838
92846
|
}
|
|
92847
|
+
addItemInIndexedList(parentId, item, items) {
|
|
92848
|
+
var _a, _b;
|
|
92849
|
+
items = (_a = items !== null && items !== void 0 ? items : this.items) !== null && _a !== void 0 ? _a : [];
|
|
92850
|
+
if (!parentId) {
|
|
92851
|
+
items.push(item);
|
|
92852
|
+
return true;
|
|
92853
|
+
}
|
|
92854
|
+
for (const treeItem of items) {
|
|
92855
|
+
if (treeItem.id === parentId) {
|
|
92856
|
+
treeItem.children = ((_b = treeItem.children) !== null && _b !== void 0 ? _b : []);
|
|
92857
|
+
treeItem.children.push(item);
|
|
92858
|
+
treeItem.childrenCount = treeItem.children.length;
|
|
92859
|
+
return true;
|
|
92860
|
+
}
|
|
92861
|
+
else if (treeItem.children && Array.isArray(treeItem.children)) {
|
|
92862
|
+
const result = this.addItemInIndexedList(parentId, item, treeItem.children);
|
|
92863
|
+
if (result) {
|
|
92864
|
+
return true;
|
|
92865
|
+
}
|
|
92866
|
+
}
|
|
92867
|
+
}
|
|
92868
|
+
return false;
|
|
92869
|
+
}
|
|
92839
92870
|
getItemPathAttrs({ id, label }) {
|
|
92840
92871
|
return { id, label };
|
|
92841
92872
|
}
|
|
@@ -93788,7 +93819,7 @@ const EzTileMedium = /*@__PURE__*/proxyCustomElement(EzTileMedium$1, [1,"ez-tile
|
|
|
93788
93819
|
const EzTimeInput = /*@__PURE__*/proxyCustomElement(EzTimeInput$1, [1,"ez-time-input",{"label":[513],"value":[1026],"enabled":[516],"errorMessage":[1537,"error-message"],"showSeconds":[516,"show-seconds"],"mode":[513],"canShowError":[516,"can-show-error"],"autoFocus":[4,"auto-focus"],"alternativePlaceholder":[1,"alternative-placeholder"]}]);
|
|
93789
93820
|
const EzToast = /*@__PURE__*/proxyCustomElement(EzToast$1, [1,"ez-toast",{"message":[1025],"fadeTime":[1026,"fade-time"],"useIcon":[1028,"use-icon"],"canClose":[1028,"can-close"]}]);
|
|
93790
93821
|
const EzTooltip = /*@__PURE__*/proxyCustomElement(EzTooltip$1, [1,"ez-tooltip",{"message":[1],"anchoringElement":[1040],"placement":[1],"gapOptions":[16],"type":[1],"debouncingTime":[2,"debouncing-time"],"active":[4],"maxWidth":[2,"max-width"],"useAnchorSize":[4,"use-anchor-size"],"strategy":[1]}]);
|
|
93791
|
-
const EzTree = /*@__PURE__*/proxyCustomElement(EzTree$1, [1,"ez-tree",{"items":[1040],"value":[1040],"selectedId":[1537,"selected-id"],"iconResolver":[16],"tooltipResolver":[16],"enableHierarchicalFilter":[4,"enable-hierarchical-filter"],"_tree":[32],"_waintingForLoad":[32]},[[2,"keydown","onKeyDownListener"]]]);
|
|
93822
|
+
const EzTree = /*@__PURE__*/proxyCustomElement(EzTree$1, [1,"ez-tree",{"items":[1040],"value":[1040],"selectedId":[1537,"selected-id"],"iconResolver":[16],"tooltipResolver":[16],"enableHierarchicalFilter":[4,"enable-hierarchical-filter"],"selectable":[4],"_tree":[32],"_waintingForLoad":[32]},[[2,"keydown","onKeyDownListener"]]]);
|
|
93792
93823
|
const EzUnderface = /*@__PURE__*/proxyCustomElement(EzUnderface$1, [1,"ez-underface",{"color":[513],"customColor":[513,"custom-color"],"height":[514],"width":[514]}]);
|
|
93793
93824
|
const EzUpload = /*@__PURE__*/proxyCustomElement(EzUpload$1, [1,"ez-upload",{"label":[1],"subtitle":[1],"enabled":[4],"maxFileSize":[2,"max-file-size"],"maxFiles":[2,"max-files"],"requestHeaders":[8,"request-headers"],"urlUpload":[1,"url-upload"],"urlDelete":[1,"url-delete"],"value":[1040]}]);
|
|
93794
93825
|
const EzViewStack = /*@__PURE__*/proxyCustomElement(EzViewStack$1, [0,"ez-view-stack"]);
|
|
@@ -19,7 +19,7 @@ var ModalButtonStatus;
|
|
|
19
19
|
})(ModalButtonStatus || (ModalButtonStatus = {}));
|
|
20
20
|
const ModalButtonStatus$1 = ModalButtonStatus;
|
|
21
21
|
|
|
22
|
-
const ezModalContainerCss = ".sc-ez-modal-container-h{--ez-modal-container-overflow-y:auto;--ez-modal-container-overflow-x:hidden;display:
|
|
22
|
+
const ezModalContainerCss = ".sc-ez-modal-container-h{--ez-modal-container-overflow-y:auto;--ez-modal-container-overflow-x:hidden;display:flex;flex-direction:column;width:100%;height:100%}.ez-modal-container__header-container.sc-ez-modal-container{outline:none}.ez-modal-container__header.sc-ez-modal-container{display:flex;flex-wrap:nowrap;flex-direction:row;justify-content:space-between;align-items:start}.ez-modal-container__content.sc-ez-modal-container{overflow-y:var(--ez-modal-container-overflow-y);overflow-x:var(--ez-modal-container-overflow-x);outline:none}.ez-modal-container__content.sc-ez-modal-container::-webkit-scrollbar{width:var(--space--small);min-width:var(--space--small);max-width:var(--space--small)}.ez-modal-container__footer.sc-ez-modal-container{display:flex;flex-direction:row;justify-content:flex-end;gap:var(--space--medium);width:100%;padding-top:var(--space--small, 6px)}.ez-modal-container__title.sc-ez-modal-container{display:grid}.ez-modal-container__close-button.sc-ez-modal-container{cursor:pointer;background-color:transparent;border:none;outline:none;padding:var(--space--6, 6px) 0px}.ez-modal-container__close-icon.sc-ez-modal-container{--icon--color:var(--title--primary, #2B3A54)}";
|
|
23
23
|
|
|
24
24
|
const EzModalContainer = class {
|
|
25
25
|
constructor(hostRef) {
|
|
@@ -66,17 +66,8 @@ const EzModalContainer = class {
|
|
|
66
66
|
closeModal() {
|
|
67
67
|
this.ezModalAction.emit("CLOSE");
|
|
68
68
|
}
|
|
69
|
-
focusLast() {
|
|
70
|
-
if (this._okButton == undefined) {
|
|
71
|
-
return;
|
|
72
|
-
}
|
|
73
|
-
this._okButton.setFocus();
|
|
74
|
-
}
|
|
75
|
-
focusFirst() {
|
|
76
|
-
this._closeButton.focus();
|
|
77
|
-
}
|
|
78
69
|
render() {
|
|
79
|
-
return (h(Host, null, h("
|
|
70
|
+
return (h(Host, null, h("header", { ref: ref => this._modalRef = ref, tabIndex: -1, class: "ez-modal-container__header-container" }, this.showTitleBar && (h("div", { class: "ez-modal-container__header ez-margin-bottom--medium" }, h("div", { class: "ez-col ez-align--middle ez-modal-container__title" }, h("h2", { class: "ez-text ez-title--large ez-title--primary ez-text--bold ez-margin-vertical--extra-small" }, this.modalTitle), this.modalSubTitle && (h("div", { class: "ez-text ez-text--medium ez-text--primary ez-margin-vertical--extra-small" }, this.modalSubTitle))), (this.showCloseButton && h("button", { ref: ref => this._closeButton = ref, class: "ez-modal-container__close-button", onClick: () => this.ezModalAction.emit(ModalAction$1.CLOSE), "aria-label": this.i18n("app.close") }, h("ez-icon", { class: "ez-modal-container__close-icon", size: "medium", iconName: "close" })))))), h("main", { tabIndex: -1, class: "ez-modal-container__content" }, h("slot", null)), h("footer", { tabIndex: -1, class: "ez-modal-container__footer" }, this.cancelIsVisible() && (h("ez-button", { label: this.cancelButtonLabel || this.i18n("app.cancel"), isDisabled: this.cancelButtonStatus === ModalButtonStatus$1.DISABLED, onClick: () => this.ezModalAction.emit(ModalAction$1.CANCEL) })), this.okIsVisible() && (h("ez-button", { ref: ref => this._okButton = ref, class: "ez-button--primary", label: this.okButtonLabel || this.i18n("app.ok"), isDisabled: this.okButtonStatus === ModalButtonStatus$1.DISABLED, onClick: () => this.ezModalAction.emit(ModalAction$1.OK) })))));
|
|
80
71
|
}
|
|
81
72
|
get _element() { return getElement(this); }
|
|
82
73
|
};
|
|
@@ -147,9 +147,12 @@ const EzPopup = class {
|
|
|
147
147
|
};
|
|
148
148
|
}
|
|
149
149
|
}
|
|
150
|
+
renderFooterButtons() {
|
|
151
|
+
return this.footerButtons.slice(0, 3).map((buttonProps, index) => (h("ez-button", Object.assign({ key: index }, this.handleDefaultPropsButtonsByIndex(index), buttonProps))));
|
|
152
|
+
}
|
|
150
153
|
render() {
|
|
151
154
|
return (h(Host, null, this.opened && (h("div", { class: "overlay", tabIndex: -1, onClick: this.handleAutoClose.bind(this) }, h("dialog", { ref: ref => this._popupRef = ref, class: this.getDialogClass() }, this.useHeader &&
|
|
152
|
-
h("header", { class: "popup__header" }, !!this.ezTitle && h("h1", { class: "popup__title" }, this.ezTitle), h("ez-button", { class: this.ezTitle ? "btn-close" : "btn-close btn-close--solo", variant: "tertiary", mode: "icon", iconName: "close", size: "small", onClick: this.closePopup.bind(this) })), h("main", { class: "popup__expandable-content" }, h("slot", null)),
|
|
155
|
+
h("header", { class: "popup__header" }, !!this.ezTitle && h("h1", { class: "popup__title" }, this.ezTitle), h("ez-button", { class: this.ezTitle ? "btn-close" : "btn-close btn-close--solo", variant: "tertiary", mode: "icon", iconName: "close", size: "small", onClick: this.closePopup.bind(this) })), h("main", { class: "popup__expandable-content" }, h("slot", null)), h("footer", { class: "popup__footer" }, this.footerButtons.length > 0 && (this.renderFooterButtons()), h("slot", { name: 'footer' })))))));
|
|
153
156
|
}
|
|
154
157
|
get _element() { return getElement(this); }
|
|
155
158
|
static get watchers() { return {
|
|
@@ -184,6 +184,8 @@ class Tree extends Node {
|
|
|
184
184
|
async addChildAt(parentId, item) {
|
|
185
185
|
const parent = this.getNode(parentId);
|
|
186
186
|
if (parent == undefined) {
|
|
187
|
+
this.addChild(this, item);
|
|
188
|
+
this._changeCallback();
|
|
187
189
|
return;
|
|
188
190
|
}
|
|
189
191
|
parent.addChild(this, item);
|
|
@@ -370,7 +372,7 @@ class Tree extends Node {
|
|
|
370
372
|
}
|
|
371
373
|
}
|
|
372
374
|
|
|
373
|
-
const ezTreeCss = ":host{--ez-tree--border-radius:var(--border--radius-small, 8px);--ez-tree--padding-inline-start:20px;--ez-tree--margin:var(--space--extra-small, 3px);--ez-tree--margin-right:0px;--ez-tree--font-family:var(--font-pattern, Arial);--ez-tree--font-size:var(--text--medium, 14px);--ez-tree--selected--font-weight:var(--text-weight--large, 600);--ez-tree--font-weight:var(--text-weight--small, 400);--ez-tree--color:var(--title--primary, #2B3A54);--ez-tree--selected--color:var(--color--primary, #008561);--ez-tree--disabled--color:var(--text--disable, #AFB6C0);--ez-tree--font-weight--bold:var(--text-weight--large, 600);--ez-tree__tree-item--height:var(--size-medium, 18px);--ez-tree__tree-item--padding:var(--space--small, 6px);--ez-tree__tree-item--background-color:var(--background--xlight, #FFFFFF);--ez-tree__tree-item--selected--background-color:var(--color--primary-300, #E2F4EF);--ez-tree__tree-item--hover--background-color:var(--background--medium, #F0F3F7);--ez-tree__tree-item--disabled--background-color:var(--ez-tree__tree-Item--background-color);--ez-tree__item-icon-box--height:var(--ez-tree__tree-item--height);--ez-tree__item-icon-box--width:var(--size-medium, 18px);--ez-tree__item-icon-box--padding:var(--ez-tree__tree-item--padding);--ez-tree__badge--icon-color--default:var(--title--primary, #2B3A54);--ez-tree__badge--icon-color--error:var(--color--error, #da4453);--ez-tree__badge--icon-color--success:var(--color-alert--success-800, #157a00);--ez-tree__badge--icon-color--warning:var(--color--warning, #f2d410);--ez-tree__badge--icon-color--disabled:var(--text--disable, #AFB6C0);display:flex;flex-direction:column;margin:0 var(--ez-tree--margin) var(--ez-tree--margin) var(--ez-tree--margin);outline:none}ul{list-style-type:none;margin:0;cursor:default;padding-inline-start:var(--ez-tree--padding-inline-start)}ul.first-level{padding-inline-start:0}.tree-item-badge{width:16px;height:16px;background:transparent;border-radius:50%;transition:all 300ms ease-in-out;display:flex;align-items:center;justify-content:center}.tree-item-badge-error-icon{--ez-icon--color:white}.tree-item-badge-text{font-family:var(--ez-tree--font-family);font-size:var(--ez-tree--font-size);font-weight:var(--ez-tree--font-weight);color:var(--ez-tree--color)}.tree-item-badge.error{background:var(--color--error)}.tree-item-badge.warning{background:var(--color--warning)}.tree-item-badge.success{background:var(--color--success)}.item-label-container{display:flex;align-items:center;overflow:hidden}.tree-item{display:flex;align-items:center;cursor:pointer;margin-top:var(--ez-tree--margin);margin-right:var(--ez-tree--margin-right);border-radius:var(--ez-tree--border-radius);height:var(--ez-tree__tree-item--height);padding:var(--ez-tree__tree-item--padding);justify-content:space-between}.tree-item[selected]{background-color:var(--ez-tree__tree-item--selected--background-color)}.tree-item:hover{background-color:var(--ez-tree__tree-item--hover--background-color)}.tree-item[disabled],.tree-item[disabled]:hover{background-color:var(--ez-tree__tree-item--disabled--background-color)}.item-icon-box{display:flex;align-items:center;justify-content:center;width:var(--ez-tree__item-icon-box--width);height:var(--ez-tree__item-icon-box--height);padding:var(--ez-tree__item-icon-box--padding) var(--ez-tree__item-icon-box--padding) var(--ez-tree__item-icon-box--padding) 0}.item-icon{--ez-icon--color:var(--ez-tree--color)}.item-icon:hover{cursor:pointer}.tree-item[selected] .item-icon{--ez-icon--color:var(--ez-tree--selected--color)}.tree-item[disabled] .item-icon{cursor:unset;--ez-icon--color:var(--ez-tree--disabled--color)}.item-label{cursor:inherit;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-family:var(--ez-tree--font-family);font-size:var(--ez-tree--font-size);font-weight:var(--ez-tree--font-weight);color:var(--ez-tree--color)}.item-label--bold{font-weight:var(--ez-tree--font-weight--bold)}.tree-item[selected] .item-label{color:var(--ez-tree--selected--color);font-weight:var(--ez-tree--selected--font-weight)}.tree-item[disabled] .item-label{color:var(--ez-tree--disabled--color)}";
|
|
375
|
+
const ezTreeCss = ":host{--ez-tree--border-radius:var(--border--radius-small, 8px);--ez-tree--padding-inline-start:20px;--ez-tree--margin:var(--space--extra-small, 3px);--ez-tree--margin-right:0px;--ez-tree--user-select:auto;--ez-tree--font-family:var(--font-pattern, Arial);--ez-tree--font-size:var(--text--medium, 14px);--ez-tree--selected--font-weight:var(--text-weight--large, 600);--ez-tree--font-weight:var(--text-weight--small, 400);--ez-tree--color:var(--title--primary, #2B3A54);--ez-tree--selected--color:var(--color--primary, #008561);--ez-tree--disabled--color:var(--text--disable, #AFB6C0);--ez-tree--font-weight--bold:var(--text-weight--large, 600);--ez-tree__tree-item--height:var(--size-medium, 18px);--ez-tree__tree-item--padding:var(--space--small, 6px);--ez-tree__tree-item--background-color:var(--background--xlight, #FFFFFF);--ez-tree__tree-item--selected--background-color:var(--color--primary-300, #E2F4EF);--ez-tree__tree-item--hover--background-color:var(--background--medium, #F0F3F7);--ez-tree__tree-item--disabled--background-color:var(--ez-tree__tree-Item--background-color);--ez-tree__item-icon-box--height:var(--ez-tree__tree-item--height);--ez-tree__item-icon-box--width:var(--size-medium, 18px);--ez-tree__item-icon-box--padding:var(--ez-tree__tree-item--padding);--ez-tree__badge--icon-color--default:var(--title--primary, #2B3A54);--ez-tree__badge--icon-color--error:var(--color--error, #da4453);--ez-tree__badge--icon-color--success:var(--color-alert--success-800, #157a00);--ez-tree__badge--icon-color--warning:var(--color--warning, #f2d410);--ez-tree__badge--icon-color--disabled:var(--text--disable, #AFB6C0);display:flex;flex-direction:column;margin:0 var(--ez-tree--margin) var(--ez-tree--margin) var(--ez-tree--margin);outline:none}ul{list-style-type:none;margin:0;cursor:default;padding-inline-start:var(--ez-tree--padding-inline-start)}ul.first-level{padding-inline-start:0}.tree-item-badge{width:16px;height:16px;background:transparent;border-radius:50%;transition:all 300ms ease-in-out;display:flex;align-items:center;justify-content:center}.tree-item-badge-error-icon{--ez-icon--color:white}.tree-item-badge-text{font-family:var(--ez-tree--font-family);font-size:var(--ez-tree--font-size);font-weight:var(--ez-tree--font-weight);color:var(--ez-tree--color)}.tree-item-badge.error{background:var(--color--error)}.tree-item-badge.warning{background:var(--color--warning)}.tree-item-badge.success{background:var(--color--success)}.item-label-container{display:flex;align-items:center;overflow:hidden}.tree-item{display:flex;align-items:center;cursor:pointer;margin-top:var(--ez-tree--margin);margin-right:var(--ez-tree--margin-right);border-radius:var(--ez-tree--border-radius);height:var(--ez-tree__tree-item--height);padding:var(--ez-tree__tree-item--padding);justify-content:space-between}.tree-item[selected]{background-color:var(--ez-tree__tree-item--selected--background-color)}.tree-item:hover{background-color:var(--ez-tree__tree-item--hover--background-color)}.tree-item[disabled],.tree-item[disabled]:hover{background-color:var(--ez-tree__tree-item--disabled--background-color)}.item-icon-box{display:flex;align-items:center;justify-content:center;width:var(--ez-tree__item-icon-box--width);height:var(--ez-tree__item-icon-box--height);padding:var(--ez-tree__item-icon-box--padding) var(--ez-tree__item-icon-box--padding) var(--ez-tree__item-icon-box--padding) 0}.item-icon{--ez-icon--color:var(--ez-tree--color)}.item-icon:hover{cursor:pointer}.tree-item[selected] .item-icon{--ez-icon--color:var(--ez-tree--selected--color)}.tree-item[disabled] .item-icon{cursor:unset;--ez-icon--color:var(--ez-tree--disabled--color)}.item-label{cursor:inherit;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;user-select:var(--ez-tree--user-select);font-family:var(--ez-tree--font-family);font-size:var(--ez-tree--font-size);font-weight:var(--ez-tree--font-weight);color:var(--ez-tree--color)}.item-label--bold{font-weight:var(--ez-tree--font-weight--bold)}.tree-item[selected] .item-label{color:var(--ez-tree--selected--color);font-weight:var(--ez-tree--selected--font-weight)}.tree-item[disabled] .item-label{color:var(--ez-tree--disabled--color)}";
|
|
374
376
|
|
|
375
377
|
const EzTree = class {
|
|
376
378
|
constructor(hostRef) {
|
|
@@ -379,11 +381,18 @@ const EzTree = class {
|
|
|
379
381
|
this.ezOpenItem = createEvent(this, "ezOpenItem", 7);
|
|
380
382
|
this.ezDbClickItem = createEvent(this, "ezDbClickItem", 7);
|
|
381
383
|
this._onItemClick = (item) => {
|
|
382
|
-
this.
|
|
384
|
+
if (!this.selectable) {
|
|
385
|
+
this.openClose(item);
|
|
386
|
+
return;
|
|
387
|
+
}
|
|
388
|
+
if (this.value && this.value.id === item.id) {
|
|
389
|
+
this.value = undefined;
|
|
390
|
+
return;
|
|
391
|
+
}
|
|
392
|
+
this.value = item;
|
|
383
393
|
};
|
|
384
394
|
this._onIconClick = (item) => {
|
|
385
395
|
this.openClose(item);
|
|
386
|
-
this.value = item;
|
|
387
396
|
};
|
|
388
397
|
this._tree = new Tree(() => forceUpdate(this));
|
|
389
398
|
this._waintingForLoad = undefined;
|
|
@@ -393,6 +402,7 @@ const EzTree = class {
|
|
|
393
402
|
this.iconResolver = defaultIconResolver;
|
|
394
403
|
this.tooltipResolver = undefined;
|
|
395
404
|
this.enableHierarchicalFilter = true;
|
|
405
|
+
this.selectable = true;
|
|
396
406
|
}
|
|
397
407
|
/**
|
|
398
408
|
* Efetua a seleção de um item.
|
|
@@ -443,10 +453,14 @@ const EzTree = class {
|
|
|
443
453
|
parentId = (_a = this.value) === null || _a === void 0 ? void 0 : _a.id;
|
|
444
454
|
}
|
|
445
455
|
this._tree.addChildAt(parentId, item);
|
|
456
|
+
this.addItemInIndexedList(parentId, item);
|
|
446
457
|
const node = this._tree.getNode(parentId);
|
|
447
458
|
if (node) {
|
|
448
459
|
node.item.expanded = true;
|
|
449
460
|
}
|
|
461
|
+
else {
|
|
462
|
+
this.collapseAll();
|
|
463
|
+
}
|
|
450
464
|
}
|
|
451
465
|
/**
|
|
452
466
|
* Efetua a seleção de um item.
|
|
@@ -562,6 +576,29 @@ const EzTree = class {
|
|
|
562
576
|
event.preventDefault();
|
|
563
577
|
}
|
|
564
578
|
}
|
|
579
|
+
addItemInIndexedList(parentId, item, items) {
|
|
580
|
+
var _a, _b;
|
|
581
|
+
items = (_a = items !== null && items !== void 0 ? items : this.items) !== null && _a !== void 0 ? _a : [];
|
|
582
|
+
if (!parentId) {
|
|
583
|
+
items.push(item);
|
|
584
|
+
return true;
|
|
585
|
+
}
|
|
586
|
+
for (const treeItem of items) {
|
|
587
|
+
if (treeItem.id === parentId) {
|
|
588
|
+
treeItem.children = ((_b = treeItem.children) !== null && _b !== void 0 ? _b : []);
|
|
589
|
+
treeItem.children.push(item);
|
|
590
|
+
treeItem.childrenCount = treeItem.children.length;
|
|
591
|
+
return true;
|
|
592
|
+
}
|
|
593
|
+
else if (treeItem.children && Array.isArray(treeItem.children)) {
|
|
594
|
+
const result = this.addItemInIndexedList(parentId, item, treeItem.children);
|
|
595
|
+
if (result) {
|
|
596
|
+
return true;
|
|
597
|
+
}
|
|
598
|
+
}
|
|
599
|
+
}
|
|
600
|
+
return false;
|
|
601
|
+
}
|
|
565
602
|
getItemPathAttrs({ id, label }) {
|
|
566
603
|
return { id, label };
|
|
567
604
|
}
|