@sankhyalabs/ezui 0.0.0-bugfix-dev-KB-76362.1 → 0.0.0-bugfix-dev-KB-78242.0

package/dist/collection/components/ez-list/ez-list.js

@@ -1,11 +1,10 @@
-import { ElementIDUtils, KeyboardManager, StringUtils } from '@sankhyalabs/core';
+import { ElementIDUtils, StringUtils } from '@sankhyalabs/core';
 import { Fragment, Host, h } from '@stencil/core';
 export class EzList {
   constructor() {
     this._listItemsHistory = [];
     this._listItems = [];
     this._listGroupItems = [];
-    this._selectedItem = undefined;
     this.dataSource = [];
     this.listMode = 'regular';
     this.useGroups = false;
@@ -14,19 +13,6 @@ export class EzList {
     this.itemSlotBuilder = undefined;
     this.itemLeftSlotBuilder = undefined;
     this.hoverFeedback = false;
-    this.disableShortcuts = false;
-  }
-  /**
-   * Seleciona o próximo item.
-   */
-  async selectNextItem() {
-    this.nextOption();
-  }
-  /**
-   * Seleciona o item anterior.
-   */
-  async selectPreviousItem() {
-    this.previousOption();
   }
   /**
    * Limpa o histórico da lista.
@@ -50,8 +36,23 @@ export class EzList {
    */
   async setSelection(selectedItem, scrollToOption) {
     if (selectedItem && this.ezSelectable) {
-      this._selectedItem = Object.assign({}, selectedItem);
       this.ezSelectItem.emit(selectedItem);
+      if (this.useGroups) {
+        let newList = [...this._listGroupItems];
+        newList.forEach(groupItem => {
+          groupItem.items.forEach(item => {
+            item.selected = item.id === selectedItem.id;
+          });
+        });
+        this._listGroupItems = newList;
+      }
+      else {
+        let newList = [...this._listItems];
+        newList.forEach(item => {
+          item.selected = item.id === selectedItem.id;
+        });
+        this._listItems = newList;
+      }
       if (scrollToOption) {
         let liElem = this.useGroups
           ? this._groupContainer.querySelector('li#item_' + selectedItem.id)
@@ -69,7 +70,21 @@ export class EzList {
    * Obtém o item selecionado.
    */
   async getSelection() {
-    return this._selectedItem;
+    let selectedItem;
+    if (this.useGroups) {
+      this._listGroupItems.every(group => {
+        let item = group.items.find(item => item.selected == true);
+        if (item) {
+          selectedItem = item;
+          return false;
+        }
+        return true;
+      });
+    }
+    else {
+      selectedItem = this._listItems.find(item => item.selected == true);
+    }
+    return selectedItem;
   }
   /**
    * Obtém a lista de items ou grupos.
@@ -84,7 +99,22 @@ export class EzList {
    * Limpa a seleção atual
    */
   async removeSelection() {
-    this._selectedItem = undefined;
+    if (this.useGroups) {
+      let newList = [...this._listGroupItems];
+      newList.forEach(groupItem => {
+        groupItem.items.forEach(item => {
+          item.selected = false;
+        });
+      });
+      this._listGroupItems = newList;
+    }
+    else {
+      let newList = [...this._listItems];
+      newList.forEach(item => {
+        item.selected = false;
+      });
+      this._listItems = newList;
+    }
   }
   applyUUID(item) {
     if (!item.id) {
@@ -144,10 +174,6 @@ export class EzList {
   }
   componentDidLoad() {
     ElementIDUtils.addIDInfo(this._element);
-    this.bindKeyboardManager();
-  }
-  disconnectCallback() {
-    this.unbindKeyboardManager();
   }
   onDrop(ev, dragEndItem) {
     this.removeOverClass();
@@ -340,58 +366,92 @@ export class EzList {
     if (this.useGroups) {
       this.setSelection(this._listGroupItems[0].items[0]);
     }
-    else {
+    {
       this.setSelection(this._listItems[0]);
     }
   }
-  getFlatedItems() {
+  nextOption(selectedItem) {
+    let nextItem = undefined;
     if (this.useGroups) {
-      const itemsGroups = this._listGroupItems.map(({ items }) => items).flat();
-      return itemsGroups;
-    }
-    return this._listItems;
-  }
-  getSelectedIndex(items) {
-    const itemIndex = items.findIndex(item => { var _a; return item.id === ((_a = this._selectedItem) === null || _a === void 0 ? void 0 : _a.id); });
-    return itemIndex;
-  }
-  nextOption() {
-    if (!this._selectedItem) {
-      this.selectFirstItem();
-      return;
+      this._listGroupItems.every((group, groupIndex, listGroupItems) => {
+        let item = undefined;
+        let itemIndex = group.items.findIndex(item => item.id == selectedItem.id);
+        if (itemIndex != undefined && itemIndex != -1) {
+          if (itemIndex === group.items.length - 1) {
+            if (groupIndex + 1 <= listGroupItems.length - 1) {
+              item = { label: listGroupItems[groupIndex + 1].items[0].label };
+            }
+          }
+          else {
+            item = { label: group.items[itemIndex + 1].label };
+          }
+        }
+        if (item != undefined) {
+          nextItem = item;
+          return false;
+        }
+        return true;
+      });
     }
-    const items = this.getFlatedItems();
-    const itemIndex = this.getSelectedIndex(items);
-    if (itemIndex < (items.length - 1)) {
-      const nextItem = items[itemIndex + 1];
-      this.setSelection(nextItem, true);
+    else {
+      let itemIndex = this._listItems.findIndex(item => item.id === selectedItem.id);
+      if (itemIndex >= 0 && itemIndex < this._listItems.length) {
+        nextItem = this._listItems[itemIndex + 1];
+      }
     }
+    this.setSelection(nextItem, true);
   }
-  previousOption() {
-    const items = this.getFlatedItems();
-    const itemIndex = this.getSelectedIndex(items);
-    if (itemIndex > 0) {
-      const previousItem = items[itemIndex - 1];
-      this.setSelection(previousItem, true);
+  previousOption(selectedItem) {
+    let previousItem = undefined;
+    if (this.useGroups) {
+      this._listGroupItems.every((group, groupIndex, listGroupItems) => {
+        let item = undefined;
+        let itemIndex = group.items.findIndex(item => item.id === selectedItem.id);
+        if (itemIndex != undefined && itemIndex != -1) {
+          if (itemIndex === 0) {
+            if (groupIndex - 1 >= 0) {
+              item = { label: listGroupItems[groupIndex - 1].items[listGroupItems[groupIndex - 1].items.length - 1].label };
+            }
+          }
+          else {
+            item = { label: group.items[itemIndex - 1].label };
+          }
+        }
+        if (item != undefined) {
+          previousItem = item;
+          return false;
+        }
+        return true;
+      });
     }
-  }
-  bindKeyboardManager() {
-    this._keyboardManager = new KeyboardManager({ propagate: false, element: this._element });
-    if (this.disableShortcuts) {
-      return;
+    else {
+      let itemIndex = this._listItems.findIndex(item => item.id === selectedItem.id);
+      if (itemIndex > 0 && itemIndex < this._listItems.length) {
+        previousItem = this._listItems[itemIndex - 1];
+      }
     }
-    this._keyboardManager
-      .bind("ArrowDown", () => this.nextOption())
-      .bind("ArrowUp", () => this.previousOption())
-      .bind("shift+Tab", () => this.previousOption())
-      .bind("Tab", () => this.nextOption());
+    this.setSelection(previousItem, true);
   }
-  unbindKeyboardManager() {
-    this._keyboardManager
-      .unbind("ArrowDown")
-      .unbind("ArrowUp")
-      .unbind("shift+Tab")
-      .unbind("Tab");
+  keyDownHandler(event) {
+    if (!event.ctrlKey) {
+      event.preventDefault();
+    }
+    this.getSelection().then(selectedItem => {
+      if (selectedItem) {
+        switch (event.key) {
+          case 'ArrowDown':
+            this.nextOption(selectedItem);
+            break;
+          case 'ArrowUp':
+            this.previousOption(selectedItem);
+            break;
+        }
+      }
+      else {
+        this.selectFirstItem();
+      }
+    });
+    event.stopPropagation();
   }
   getDivGroupId(groupName) {
     if (groupName) {
@@ -456,46 +516,38 @@ export class EzList {
   doubleClickItem(item) {
     this.ezDoubleClick.emit(item);
   }
-  onClickItem(item) {
-    this.setSelection(item);
-    this.ezClickItem.emit(item);
-  }
   render() {
-    return (h(Host, { ref: el => (this._element = el) }, this.useGroups ? (h("div", { class: "group-container", ref: el => (this._groupContainer = el), tabIndex: 0 }, this._listGroupItems.map(group => {
-      return (h("div", { id: this.getDivGroupId(group.group), class: "group", key: group.group + group.items.length, onDrop: () => this.onDropGroup(group) }, h("label", { draggable: false, class: "group-name", title: group.group }, group.group), h("section", { class: "section-container", onDragOver: ev => ev.preventDefault() }, h("div", { class: "group-items-container" }, h("div", { class: "draggable-list" }, group.items.map((item, index) => {
-        var _a;
-        return (h("li", Object.assign({ id: 'item_' + item.id, class: {
-            'selectable-container': this.ezSelectable,
-            'hover-feedback': this.hoverFeedback,
-          }, key: 'item_' + item.id }, {
-          [ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME]: ElementIDUtils.getInternalIDInfo(`ezListItem__${StringUtils.replaceAccentuatedChars(item.label)}`),
-        }), h("div", { class: 'draggable' + (((_a = this._selectedItem) === null || _a === void 0 ? void 0 : _a.id) === item.id ? ' selected-item ' : '') + (this.ezSelectable == true ? ' selectable ' : ''), onDblClick: () => {
-            this.doubleClickItem(item);
-          }, onClick: () => {
-            this.onClickItem(item);
-          }, onDragLeave: () => {
-            group.sort ? undefined : this.removeOverClass();
-          }, onDragEnd: () => this.onDragEnd(), onDragStart: () => this.onDragStart(item, group, index), onDragOver: event => {
-            group.sort ? undefined : this.onDragOverItem(event);
-          }, onDrop: event => this.onDrop(event, { groupName: group.group, item: item, index: index }), draggable: this.ezDraggable }, h("div", { class: "item-content" }, this.ezDraggable ? h("span", { class: "draggable-icon" }) : undefined, this.listMode === 'regular' ? (h(Fragment, null, !!this.itemLeftSlotBuilder && this.getContainerItemBuilder('left', item, group), h("p", { title: item.label, class: "person-name text--ellipsis" }, item.label))) : (h("ez-check", { label: item.label, value: item.check, onEzChange: evt => this.ezCheckChange.emit({ id: item.id, label: item.label, check: evt.detail }) }))), !!this.itemSlotBuilder && this.getContainerItemBuilder('right', item, group, 'slot-item'))));
-      })), h("div", { class: "last-droppable-space", onDragLeave: () => this.removeOverClass(), onDragOver: event => {
-          this.onDragOverLastIndex(event);
-        }, onDragEnd: () => this.onDragEnd(), onDrop: event => this.onDropLastIndex(event, group) })), group.sort ? (h("div", { id: this.getGroupOverlayId(group.group), class: "group-overlay" }, "Mover para ", group.group)) : undefined)));
-    }))) : (h("div", { class: "items-container", ref: el => (this._itemContainer = el), tabIndex: 0 }, h("ul", { class: "draggable-list" }, this._listItems.map((item, index) => {
-      var _a, _b;
-      return (h("li", Object.assign({ id: 'item_' + item.id, class: {
+    return (h(Host, { ref: el => (this._element = el) }, this.useGroups ? (h("div", { class: "group-container", ref: el => (this._groupContainer = el), tabIndex: 0, onKeyDown: event => {
+        this.keyDownHandler(event);
+      } }, this._listGroupItems.map(group => {
+      return (h("div", { id: this.getDivGroupId(group.group), class: "group", key: group.group + group.items.length, onDrop: () => this.onDropGroup(group) }, h("label", { draggable: false, class: "group-name", title: group.group }, group.group), h("section", { class: "section-container", onDragOver: ev => ev.preventDefault() }, h("div", { class: "group-items-container" }, h("div", { class: "draggable-list" }, group.items.map((item, index) => (h("li", Object.assign({ id: 'item_' + item.id, class: {
           'selectable-container': this.ezSelectable,
-          'selected-item': ((_a = this._selectedItem) === null || _a === void 0 ? void 0 : _a.id) === item.id,
-          'hover-feedback': this.hoverFeedback && ((_b = this._selectedItem) === null || _b === void 0 ? void 0 : _b.id) !== item.id,
-        }, key: 'item_' + item.id }, { [ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME]: ElementIDUtils.getInternalIDInfo(`ezListItem__${StringUtils.replaceAccentuatedChars(item.label)}`) }), h("div", { class: 'draggable' + (this.ezSelectable == true ? ' selectable ' : ''), onDragStart: () => this.onDragStart({ item: item, index: index }), onDblClick: () => {
+          'hover-feedback': this.hoverFeedback,
+        }, key: 'item_' + item.id }, {
+        [ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME]: ElementIDUtils.getInternalIDInfo(`ezListItem__${StringUtils.replaceAccentuatedChars(item.label)}`),
+      }), h("div", { class: 'draggable' + (item.selected == true ? ' selected-item ' : '') + (this.ezSelectable == true ? ' selectable ' : ''), onDblClick: () => {
           this.doubleClickItem(item);
         }, onClick: () => {
-          this.onClickItem(item);
-        }, onDragLeave: () => this.removeOverClass(), onDragOver: event => this.onDragOverItem(event), onDragEnd: () => this.onDragEnd(), onDrop: event => this.onDrop(event, { item: item, index: index }), draggable: this.ezDraggable }, h("div", { class: "item-content" }, this.listMode === 'regular' ? (h(Fragment, null, this.ezDraggable ? h("span", { class: "draggable-icon" }) : undefined, !!this.itemLeftSlotBuilder && this.getContainerItemBuilder('left', item), h("p", { title: item.label, class: "person-name text--ellipsis" }, item.label))) : (h(Fragment, null, this.ezDraggable ? h("span", { class: "draggable-icon" }) : undefined, h("ez-check", { label: item.label, value: item.check, onEzChange: evt => this.ezCheckChange.emit({ id: item.id, label: item.label, check: evt.detail }) })))), !!this.itemSlotBuilder && this.getContainerItemBuilder('right', item))));
-    }), this.ezDraggable &&
-      h("div", { class: "last-droppable-space", onDragLeave: () => this.removeOverClass(), onDragOver: event => {
+          this.setSelection(item);
+        }, onDragLeave: () => {
+          group.sort ? undefined : this.removeOverClass();
+        }, onDragEnd: () => this.onDragEnd(), onDragStart: () => this.onDragStart(item, group, index), onDragOver: event => {
+          group.sort ? undefined : this.onDragOverItem(event);
+        }, onDrop: event => this.onDrop(event, { groupName: group.group, item: item, index: index }), draggable: this.ezDraggable }, h("div", { class: "item-content" }, this.ezDraggable ? h("span", { class: "draggable-icon" }) : undefined, this.listMode === 'regular' ? (h(Fragment, null, !!this.itemLeftSlotBuilder && this.getContainerItemBuilder('left', item, group), h("p", { title: item.label, class: "person-name text--ellipsis" }, item.label))) : (h("ez-check", { label: item.label, value: item.check, onEzChange: evt => this.ezCheckChange.emit({ id: item.id, label: item.label, check: evt.detail }) }))), !!this.itemSlotBuilder && this.getContainerItemBuilder('right', item, group, 'slot-item')))))), h("div", { class: "last-droppable-space", onDragLeave: () => this.removeOverClass(), onDragOver: event => {
           this.onDragOverLastIndex(event);
-        }, onDragEnd: () => this.onDragEnd(), onDrop: event => this.onDropLastIndex(event) }))))));
+        }, onDragEnd: () => this.onDragEnd(), onDrop: event => this.onDropLastIndex(event, group) })), group.sort ? (h("div", { id: this.getGroupOverlayId(group.group), class: "group-overlay" }, "Mover para ", group.group)) : undefined)));
+    }))) : (h("div", { class: "items-container", ref: el => (this._itemContainer = el), tabIndex: 0, onKeyDown: event => {
+        this.keyDownHandler(event);
+      } }, h("div", { class: "draggable-list" }, this._listItems.map((item, index) => (h("li", Object.assign({ id: 'item_' + item.id, class: {
+        'selectable-container': this.ezSelectable,
+        'hover-feedback': this.hoverFeedback,
+      }, key: 'item_' + item.id }, { [ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME]: ElementIDUtils.getInternalIDInfo(`ezListItem__${StringUtils.replaceAccentuatedChars(item.label)}`) }), h("div", { class: 'draggable' + (item.selected == true ? ' selected-item ' : '') + (this.ezSelectable == true ? ' selectable ' : ''), onDragStart: () => this.onDragStart({ item: item, index: index }), onDblClick: () => {
+        this.doubleClickItem(item);
+      }, onClick: () => {
+        this.setSelection(item);
+      }, onDragLeave: () => this.removeOverClass(), onDragOver: event => this.onDragOverItem(event), onDragEnd: () => this.onDragEnd(), onDrop: event => this.onDrop(event, { item: item, index: index }), draggable: this.ezDraggable }, h("div", { class: "item-content" }, this.listMode === 'regular' ? (h(Fragment, null, this.ezDraggable ? h("span", { class: "draggable-icon" }) : undefined, !!this.itemLeftSlotBuilder && this.getContainerItemBuilder('left', item), h("p", { title: item.label, class: "person-name text--ellipsis" }, item.label))) : (h(Fragment, null, this.ezDraggable ? h("span", { class: "draggable-icon" }) : undefined, h("ez-check", { label: item.label, value: item.check, onEzChange: evt => this.ezCheckChange.emit({ id: item.id, label: item.label, check: evt.detail }) })))), !!this.itemSlotBuilder && this.getContainerItemBuilder('right', item))))), h("div", { class: "last-droppable-space", onDragLeave: () => this.removeOverClass(), onDragOver: event => {
+        this.onDragOverLastIndex(event);
+      }, onDragEnd: () => this.onDragEnd(), onDrop: event => this.onDropLastIndex(event) }))))));
   }
   static get is() { return "ez-list"; }
   static get encapsulation() { return "scoped"; }
@@ -668,32 +720,13 @@ export class EzList {
         "attribute": "hover-feedback",
         "reflect": false,
         "defaultValue": "false"
-      },
-      "disableShortcuts": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Desabilita os atalhos de teclado."
-        },
-        "attribute": "disable-shortcuts",
-        "reflect": false,
-        "defaultValue": "false"
       }
     };
   }
   static get states() {
     return {
       "_listItems": {},
-      "_listGroupItems": {},
-      "_selectedItem": {}
+      "_listGroupItems": {}
     };
   }
   static get events() {
@@ -741,25 +774,6 @@ export class EzList {
             }
           }
         }
-      }, {
-        "method": "ezClickItem",
-        "name": "ezClickItem",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Emitido sempre que um item da lista for clicado."
-        },
-        "complexType": {
-          "original": "ListItem",
-          "resolved": "ListItem",
-          "references": {
-            "ListItem": {
-              "location": "local"
-            }
-          }
-        }
       }, {
         "method": "ezCheckChange",
         "name": "ezCheckChange",
@@ -802,38 +816,6 @@ export class EzList {
   }
   static get methods() {
     return {
-      "selectNextItem": {
-        "complexType": {
-          "signature": "() => Promise<void>",
-          "parameters": [],
-          "references": {
-            "Promise": {
-              "location": "global"
-            }
-          },
-          "return": "Promise<void>"
-        },
-        "docs": {
-          "text": "Seleciona o pr\u00F3ximo item.",
-          "tags": []
-        }
-      },
-      "selectPreviousItem": {
-        "complexType": {
-          "signature": "() => Promise<void>",
-          "parameters": [],
-          "references": {
-            "Promise": {
-              "location": "global"
-            }
-          },
-          "return": "Promise<void>"
-        },
-        "docs": {
-          "text": "Seleciona o item anterior.",
-          "tags": []
-        }
-      },
       "clearHistory": {
         "complexType": {
           "signature": "() => Promise<void>",

package/dist/collection/components/ez-modal/ez-modal.css

@@ -23,6 +23,10 @@
   background: rgba(0, 4, 12, 0.1);
 }
 
+.modal__screen-none{
+  background: none;
+}
+
 .modal__screen-medium{
   backdrop-filter: blur(4px);
   background: rgba(0, 4, 12, 0.4)

package/dist/collection/components/ez-modal/ez-modal.js

@@ -211,8 +211,8 @@ export class EzModal {
         "type": "string",
         "mutable": false,
         "complexType": {
-          "original": "\"medium\" | \"light\"",
-          "resolved": "\"light\" | \"medium\"",
+          "original": "\"medium\" | \"light\" | \"none\"",
+          "resolved": "\"light\" | \"medium\" | \"none\"",
           "references": {}
         },
         "required": false,

package/dist/collection/components/ez-number-input/ez-number-input.css

@@ -1,8 +1,16 @@
 :host {
+  /*@doc Define a largura maxima do componente.*/
+  --ez-number-input__min-width: 0px;
+  /*@doc Define a largura minima do componente.*/
+  --ez-number-input__max-width: 100%;
+
   display: block;
   width: 100%;
 }
 
 .number__input {
   height: 100%;
+
+  min-width: var(--ez-number-input__min-width);
+  max-width: var(--ez-number-input__max-width);
 }

package/dist/collection/components/ez-number-input/ez-number-input.js

@@ -16,6 +16,7 @@ export class EzNumberInput {
     this.precision = undefined;
     this.prettyPrecision = undefined;
     this.mode = "regular";
+    this.autoFocus = false;
   }
   /**
    * Aplica o foco no campo.
@@ -156,11 +157,17 @@ export class EzNumberInput {
     const textValue = this.getTextValue(this.value) || '';
     if ((this._value || '') !== textValue) {
       this._value = textValue;
+      this._textInput.value = this._value;
     }
   }
   componentDidLoad() {
     CSSVarsUtils.applyVarsTextInput(this._elem, this._textInput);
     this.setInputValue();
+    if (this.autoFocus) {
+      requestAnimationFrame(() => {
+        this.setFocus({ selectText: true });
+      });
+    }
   }
   render() {
     ElementIDUtils.addIDInfoIfNotExists(this._elem, 'input');
@@ -340,6 +347,24 @@ export class EzNumberInput {
         "attribute": "mode",
         "reflect": true,
         "defaultValue": "\"regular\""
+      },
+      "autoFocus": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Se true o campo de texto receber\u00E1 o foco ao ser renderizado."
+        },
+        "attribute": "auto-focus",
+        "reflect": false,
+        "defaultValue": "false"
       }
     };
   }

package/dist/collection/components/ez-popover/ez-popover.css

@@ -9,12 +9,6 @@
   --ez-popover__box--background-color: var(--background--xlight, #fff);
   /*@doc Define a camada de visibilidade do popover.*/
   --ez-popover__box--z-index: var(--most-visible, 3);
-  /*@doc Define a altura do popover.*/
-  --ez-popover__height: fit-content;
-  /*@doc Define a altura máxima do popover.*/
-  --ez-popover__max-height: fit-content;
-  /*@doc Define a margin do popover.*/
-  --ez-popover__margin: 0;
 
   /***************
      host style  
@@ -30,14 +24,13 @@
   z-index: var(--ez-popover__box--z-index);
   display: flex;
   flex-direction: column;
-  
+
+  height: fit-content;
+
   /*public*/
-  height: var(--ez-popover__height);
-  max-height: var(--ez-popover__max-height);
   background-color: var(--ez-popover__box--background-color);
   border-radius: var(--ez-popover__box--border-radius);
   box-shadow: var(--ez-popover__box--box-shadow);
-  margin: var(--ez-popover__margin);
 }
 
 .popover__box--fit-content {

package/dist/collection/components/ez-popup/ez-popup.css

@@ -8,11 +8,7 @@
   /*@doc Define a cor do texto do container do popup.*/
   --ez-popup__container--color: var(--title--primary, #2b3a54);
   /*@doc Define o espaçamento do container do popup.*/
-  --ez-popup__container--padding: var(--space--large, 24px);
-  /*@doc Define a largura do container do popup.*/
-  --ez-popup__container--width: 100%;
-  /*@doc Define a altura do container do popup.*/
-  --ez-popup__container--height: 100%;
+  --ez-popup__container--padding: var(--space--md, 20px);
 
   /* Popup Header */
   /*@doc Define o espaçamento inferior do cabeçalho do popup.*/
@@ -22,7 +18,7 @@
   /*@doc Define a família da fonte do título do popup.*/
   --ez-popup__title--font-family: var(--font-pattern, "Roboto");
   /*@doc Define o tamanho da fonte do título do popup.*/
-  --ez-popup__title--font-size: var(--title--extra-large, 24px);
+  --ez-popup__title--font-size: var(--title--large, 20px);
   /*@doc Define a cor da fonte do título do popup.*/
   --ez-popup__title--color: var(--title--primary, #2b3a54);
   /*@doc Define o peso da fonte do título do popup.*/
@@ -60,9 +56,9 @@
 }
 
 .popup__container {
-  width: var(--ez-popup__container--width);
+  width: 100%;
   max-height: 90%;
-  height: var(--ez-popup__container--height);
+  height: 100%;
   display: flex;
   flex-wrap: wrap;
   overflow: hidden;

package/dist/collection/components/ez-search/ez-search.css

@@ -85,7 +85,7 @@
   --ez-search__scrollbar--border-radius: var(--border--radius-small, 6px);
   /*@doc Define a largura da barra de rolagem do componente.*/
   --ez-search__scrollbar--width: var(--space--medium, 12px);
-  
+
   /***************
      host style  
   ***************/