@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.
@@ -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: grid;
5
- grid-template-rows: 0 auto 1fr auto 0;
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("button", { class: "ez-modal-container__focus-ctrl", onFocusin: () => this.focusLast() }), h("div", { 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("div", { tabIndex: -1, class: "ez-modal-container__content" }, h("slot", null)), h("div", { tabIndex: -1, class: "ez-modal-container__footer" }, this.cancelIsVisible() && (h("ez-button", { label: this.cancelButtonLabel || this.i18n("app.cancel"), enabled: 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"), enabled: this.okButtonStatus !== ModalButtonStatus.DISABLED, onClick: () => this.ezModalAction.emit(ModalAction.OK) }))), h("button", { class: "ez-modal-container__focus-ctrl", onFocusin: () => this.focusFirst() })));
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)), this.footerButtons.length > 0 && (h("footer", { class: "popup__footer" }, this.footerButtons.slice(0, 3).map((buttonProps, index) => (h("ez-button", Object.assign({ key: index }, this.handleDefaultPropsButtonsByIndex(index), buttonProps)))))))))));
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._onIconClick(item);
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
  }
@@ -9,6 +9,8 @@ export class Tree extends Node {
9
9
  async addChildAt(parentId, item) {
10
10
  const parent = this.getNode(parentId);
11
11
  if (parent == undefined) {
12
+ this.addChild(this, item);
13
+ this._changeCallback();
12
14
  return;
13
15
  }
14
16
  parent.addChild(this, item);
@@ -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:grid;grid-template-rows:0 auto 1fr auto 0;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)}.ez-modal-container__focus-ctrl.sc-ez-modal-container{height:0px;background-color:transparent;border:none}";
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("button", { class: "ez-modal-container__focus-ctrl", onFocusin: () => this.focusLast() }), h("div", { 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("div", { tabIndex: -1, class: "ez-modal-container__content" }, h("slot", null)), h("div", { tabIndex: -1, class: "ez-modal-container__footer" }, this.cancelIsVisible() && (h("ez-button", { label: this.cancelButtonLabel || this.i18n("app.cancel"), enabled: 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"), enabled: this.okButtonStatus !== ModalButtonStatus$1.DISABLED, onClick: () => this.ezModalAction.emit(ModalAction$1.OK) }))), h("button", { class: "ez-modal-container__focus-ctrl", onFocusin: () => this.focusFirst() })));
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)), this.footerButtons.length > 0 && (h("footer", { class: "popup__footer" }, this.footerButtons.slice(0, 3).map((buttonProps, index) => (h("ez-button", Object.assign({ key: index }, this.handleDefaultPropsButtonsByIndex(index), buttonProps)))))))))));
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._onIconClick(item);
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:grid;grid-template-rows:0 auto 1fr auto 0;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)}.ez-modal-container__focus-ctrl.sc-ez-modal-container{height:0px;background-color:transparent;border:none}";
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("button", { class: "ez-modal-container__focus-ctrl", onFocusin: () => this.focusLast() }), h("div", { 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("div", { tabIndex: -1, class: "ez-modal-container__content" }, h("slot", null)), h("div", { tabIndex: -1, class: "ez-modal-container__footer" }, this.cancelIsVisible() && (h("ez-button", { label: this.cancelButtonLabel || this.i18n("app.cancel"), enabled: 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"), enabled: this.okButtonStatus !== ModalButtonStatus$1.DISABLED, onClick: () => this.ezModalAction.emit(ModalAction$1.OK) }))), h("button", { class: "ez-modal-container__focus-ctrl", onFocusin: () => this.focusFirst() })));
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)), this.footerButtons.length > 0 && (h("footer", { class: "popup__footer" }, this.footerButtons.slice(0, 3).map((buttonProps, index) => (h("ez-button", Object.assign({ key: index }, this.handleDefaultPropsButtonsByIndex(index), buttonProps)))))))))));
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._onIconClick(item);
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
  }