@sankhyalabs/ezui 5.22.0-dev.6 → 5.22.0-dev.60

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

@@ -60,155 +60,159 @@ svg {
 .ez-icon-acao:before { content: "\ea03"; }
 .ez-icon-account-outline:before { content: "\ea04"; }
 .ez-icon-account:before { content: "\ea05"; }
-.ez-icon-alert-circle-inverted:before { content: "\ea06"; }
-.ez-icon-alert-circle:before { content: "\ea07"; }
-.ez-icon-alert-mail:before { content: "\ea08"; }
-.ez-icon-alert-popup:before { content: "\ea09"; }
-.ez-icon-anexo:before { content: "\ea0a"; }
-.ez-icon-antecipacao:before { content: "\ea0b"; }
-.ez-icon-apps:before { content: "\ea0c"; }
-.ez-icon-arrow-forward:before { content: "\ea0d"; }
-.ez-icon-arrow-upward:before { content: "\ea0e"; }
-.ez-icon-arrow_back:before { content: "\ea0f"; }
-.ez-icon-arrow_downward:before { content: "\ea10"; }
-.ez-icon-baixa:before { content: "\ea11"; }
-.ez-icon-balance:before { content: "\ea12"; }
-.ez-icon-bell-inverted:before { content: "\ea13"; }
-.ez-icon-bell:before { content: "\ea14"; }
-.ez-icon-boleto:before { content: "\ea15"; }
-.ez-icon-boolean:before { content: "\ea16"; }
-.ez-icon-business-center:before { content: "\ea17"; }
-.ez-icon-calendar-clock:before { content: "\ea18"; }
-.ez-icon-calendar:before { content: "\ea19"; }
-.ez-icon-cash-remove:before { content: "\ea1a"; }
-.ez-icon-check-circle-inverted:before { content: "\ea1b"; }
-.ez-icon-check-circle:before { content: "\ea1c"; }
-.ez-icon-check:before { content: "\ea1d"; }
-.ez-icon-chevron-down:before { content: "\ea1e"; }
-.ez-icon-chevron-left:before { content: "\ea1f"; }
-.ez-icon-chevron-right:before { content: "\ea20"; }
-.ez-icon-chevron-up:before { content: "\ea21"; }
-.ez-icon-circle--medium:before { content: "\ea22"; }
-.ez-icon-circle:before { content: "\ea23"; }
-.ez-icon-cleaning:before { content: "\ea24"; }
-.ez-icon-clipboard:before { content: "\ea25"; }
-.ez-icon-clock-rotate-left:before { content: "\ea26"; }
-.ez-icon-close:before { content: "\ea27"; }
-.ez-icon-cobrar:before { content: "\ea28"; }
-.ez-icon-code:before { content: "\ea29"; }
-.ez-icon-configuration:before { content: "\ea2a"; }
-.ez-icon-content-cut:before { content: "\ea2b"; }
-.ez-icon-copy:before { content: "\ea2c"; }
-.ez-icon-credit_card:before { content: "\ea2d"; }
-.ez-icon-crop:before { content: "\ea2e"; }
-.ez-icon-custom:before { content: "\ea2f"; }
-.ez-icon-delete-file:before { content: "\ea30"; }
-.ez-icon-delete:before { content: "\ea31"; }
-.ez-icon-description:before { content: "\ea32"; }
-.ez-icon-dividir:before { content: "\ea33"; }
-.ez-icon-docx:before { content: "\ea34"; }
-.ez-icon-dot-notification:before { content: "\ea35"; }
-.ez-icon-dots-horizontal:before { content: "\ea36"; }
-.ez-icon-dots-vertical:before { content: "\ea37"; }
-.ez-icon-drag-indicator:before { content: "\ea38"; }
-.ez-icon-dual-chevron-down:before { content: "\ea39"; }
-.ez-icon-dual-chevron-left:before { content: "\ea3a"; }
-.ez-icon-dual-chevron-right:before { content: "\ea3b"; }
-.ez-icon-dual-chevron-up:before { content: "\ea3c"; }
-.ez-icon-edit-file:before { content: "\ea3d"; }
-.ez-icon-edit-table:before { content: "\ea3e"; }
-.ez-icon-edit-time:before { content: "\ea3f"; }
-.ez-icon-edit-value:before { content: "\ea40"; }
-.ez-icon-edit:before { content: "\ea41"; }
-.ez-icon-email:before { content: "\ea42"; }
-.ez-icon-estorno:before { content: "\ea43"; }
-.ez-icon-exe:before { content: "\ea44"; }
-.ez-icon-expand:before { content: "\ea45"; }
-.ez-icon-expandir_card:before { content: "\ea46"; }
-.ez-icon-extrato:before { content: "\ea47"; }
-.ez-icon-eye-off:before { content: "\ea48"; }
-.ez-icon-eye:before { content: "\ea49"; }
-.ez-icon-favorite:before { content: "\ea4a"; }
-.ez-icon-figma:before { content: "\ea4b"; }
-.ez-icon-file-download:before { content: "\ea4c"; }
-.ez-icon-file-upload:before { content: "\ea4d"; }
-.ez-icon-filter:before { content: "\ea4e"; }
-.ez-icon-find-file:before { content: "\ea4f"; }
-.ez-icon-find-page:before { content: "\ea50"; }
-.ez-icon-format-color-fill:before { content: "\ea51"; }
-.ez-icon-generic:before { content: "\ea52"; }
-.ez-icon-gif:before { content: "\ea53"; }
-.ez-icon-graph_bar:before { content: "\ea54"; }
-.ez-icon-handshake:before { content: "\ea55"; }
-.ez-icon-help-inverted:before { content: "\ea56"; }
-.ez-icon-help:before { content: "\ea57"; }
-.ez-icon-hide_menu:before { content: "\ea58"; }
-.ez-icon-home:before { content: "\ea59"; }
-.ez-icon-icons104:before { content: "\ea5a"; }
-.ez-icon-language:before { content: "\ea5b"; }
-.ez-icon-launch:before { content: "\ea5c"; }
-.ez-icon-lightbulb:before { content: "\ea5d"; }
-.ez-icon-list:before { content: "\ea5e"; }
-.ez-icon-location:before { content: "\ea5f"; }
-.ez-icon-lock-outline:before { content: "\ea60"; }
-.ez-icon-lock:before { content: "\ea61"; }
-.ez-icon-menu:before { content: "\ea62"; }
-.ez-icon-mid:before { content: "\ea63"; }
-.ez-icon-minus:before { content: "\ea64"; }
-.ez-icon-money-off:before { content: "\ea65"; }
-.ez-icon-money:before { content: "\ea66"; }
-.ez-icon-more:before { content: "\ea67"; }
-.ez-icon-mp3:before { content: "\ea68"; }
-.ez-icon-mp4:before { content: "\ea69"; }
-.ez-icon-multiple-files:before { content: "\ea6a"; }
-.ez-icon-north-west:before { content: "\ea6b"; }
-.ez-icon-number:before { content: "\ea6c"; }
-.ez-icon-ordem-ascendente:before { content: "\ea6d"; }
-.ez-icon-ordem-descendente:before { content: "\ea6e"; }
-.ez-icon-parcelar:before { content: "\ea6f"; }
-.ez-icon-pause:before { content: "\ea70"; }
-.ez-icon-payments:before { content: "\ea71"; }
-.ez-icon-pdf:before { content: "\ea72"; }
-.ez-icon-play:before { content: "\ea73"; }
-.ez-icon-plus:before { content: "\ea74"; }
-.ez-icon-png:before { content: "\ea75"; }
-.ez-icon-power:before { content: "\ea76"; }
-.ez-icon-pptx:before { content: "\ea77"; }
-.ez-icon-preview:before { content: "\ea78"; }
-.ez-icon-print:before { content: "\ea79"; }
-.ez-icon-push-pin:before { content: "\ea7a"; }
-.ez-icon-rateio:before { content: "\ea7b"; }
-.ez-icon-receipt:before { content: "\ea7c"; }
-.ez-icon-recolher_card:before { content: "\ea7d"; }
-.ez-icon-restore:before { content: "\ea7e"; }
-.ez-icon-return:before { content: "\ea7f"; }
-.ez-icon-sankhya-place:before { content: "\ea80"; }
-.ez-icon-save:before { content: "\ea81"; }
-.ez-icon-search:before { content: "\ea82"; }
-.ez-icon-settings-inverted:before { content: "\ea83"; }
-.ez-icon-settings:before { content: "\ea84"; }
-.ez-icon-share:before { content: "\ea85"; }
-.ez-icon-shield:before { content: "\ea86"; }
-.ez-icon-show_menu:before { content: "\ea87"; }
-.ez-icon-south-east:before { content: "\ea88"; }
-.ez-icon-sync:before { content: "\ea89"; }
-.ez-icon-table:before { content: "\ea8a"; }
-.ez-icon-tag_code:before { content: "\ea8b"; }
-.ez-icon-text:before { content: "\ea8c"; }
-.ez-icon-timeline:before { content: "\ea8d"; }
-.ez-icon-timer-outline:before { content: "\ea8e"; }
-.ez-icon-trending-up:before { content: "\ea8f"; }
-.ez-icon-tune:before { content: "\ea90"; }
-.ez-icon-txt:before { content: "\ea91"; }
-.ez-icon-un-pin:before { content: "\ea92"; }
-.ez-icon-unfold_less:before { content: "\ea93"; }
-.ez-icon-unfold_more:before { content: "\ea94"; }
-.ez-icon-user-circle:before { content: "\ea95"; }
-.ez-icon-warning-outline:before { content: "\ea96"; }
-.ez-icon-warning_triangle:before { content: "\ea97"; }
-.ez-icon-whatshot:before { content: "\ea98"; }
-.ez-icon-xlsx:before { content: "\ea99"; }
-.ez-icon-zip:before { content: "\ea9a"; }
+.ez-icon-add-to-cart:before { content: "\ea06"; }
+.ez-icon-alert-circle-inverted:before { content: "\ea07"; }
+.ez-icon-alert-circle:before { content: "\ea08"; }
+.ez-icon-alert-mail:before { content: "\ea09"; }
+.ez-icon-alert-popup:before { content: "\ea0a"; }
+.ez-icon-anexo:before { content: "\ea0b"; }
+.ez-icon-antecipação:before { content: "\ea0c"; }
+.ez-icon-apps:before { content: "\ea0d"; }
+.ez-icon-arrow-forward:before { content: "\ea0e"; }
+.ez-icon-arrow-upward:before { content: "\ea0f"; }
+.ez-icon-arrow_back:before { content: "\ea10"; }
+.ez-icon-arrow_downward:before { content: "\ea11"; }
+.ez-icon-baixa:before { content: "\ea12"; }
+.ez-icon-balance:before { content: "\ea13"; }
+.ez-icon-bell-inverted:before { content: "\ea14"; }
+.ez-icon-bell:before { content: "\ea15"; }
+.ez-icon-boleto:before { content: "\ea16"; }
+.ez-icon-boolean:before { content: "\ea17"; }
+.ez-icon-business-center:before { content: "\ea18"; }
+.ez-icon-calendar-clock:before { content: "\ea19"; }
+.ez-icon-calendar:before { content: "\ea1a"; }
+.ez-icon-cart-history:before { content: "\ea1b"; }
+.ez-icon-cash-remove:before { content: "\ea1c"; }
+.ez-icon-check-circle-inverted:before { content: "\ea1d"; }
+.ez-icon-check-circle:before { content: "\ea1e"; }
+.ez-icon-check:before { content: "\ea1f"; }
+.ez-icon-chevron-down:before { content: "\ea20"; }
+.ez-icon-chevron-left:before { content: "\ea21"; }
+.ez-icon-chevron-right:before { content: "\ea22"; }
+.ez-icon-chevron-up:before { content: "\ea23"; }
+.ez-icon-circle--medium:before { content: "\ea24"; }
+.ez-icon-circle:before { content: "\ea25"; }
+.ez-icon-clean-cart:before { content: "\ea26"; }
+.ez-icon-cleaning:before { content: "\ea27"; }
+.ez-icon-clipboard:before { content: "\ea28"; }
+.ez-icon-clock-rotate-left:before { content: "\ea29"; }
+.ez-icon-close:before { content: "\ea2a"; }
+.ez-icon-cobrar:before { content: "\ea2b"; }
+.ez-icon-code:before { content: "\ea2c"; }
+.ez-icon-configuration:before { content: "\ea2d"; }
+.ez-icon-content-cut:before { content: "\ea2e"; }
+.ez-icon-copy:before { content: "\ea2f"; }
+.ez-icon-credit_card:before { content: "\ea30"; }
+.ez-icon-crop:before { content: "\ea31"; }
+.ez-icon-custom:before { content: "\ea32"; }
+.ez-icon-delete-file:before { content: "\ea33"; }
+.ez-icon-delete:before { content: "\ea34"; }
+.ez-icon-description:before { content: "\ea35"; }
+.ez-icon-dividir:before { content: "\ea36"; }
+.ez-icon-docx:before { content: "\ea37"; }
+.ez-icon-dot-notification:before { content: "\ea38"; }
+.ez-icon-dots-horizontal:before { content: "\ea39"; }
+.ez-icon-dots-vertical:before { content: "\ea3a"; }
+.ez-icon-drag-indicator:before { content: "\ea3b"; }
+.ez-icon-dual-chevron-down:before { content: "\ea3c"; }
+.ez-icon-dual-chevron-left:before { content: "\ea3d"; }
+.ez-icon-dual-chevron-right:before { content: "\ea3e"; }
+.ez-icon-dual-chevron-up:before { content: "\ea3f"; }
+.ez-icon-edit-file:before { content: "\ea40"; }
+.ez-icon-edit-table:before { content: "\ea41"; }
+.ez-icon-edit-time:before { content: "\ea42"; }
+.ez-icon-edit-value:before { content: "\ea43"; }
+.ez-icon-edit:before { content: "\ea44"; }
+.ez-icon-email:before { content: "\ea45"; }
+.ez-icon-estorno:before { content: "\ea46"; }
+.ez-icon-exe:before { content: "\ea47"; }
+.ez-icon-expand:before { content: "\ea48"; }
+.ez-icon-expandir_card:before { content: "\ea49"; }
+.ez-icon-extrato:before { content: "\ea4a"; }
+.ez-icon-eye-off:before { content: "\ea4b"; }
+.ez-icon-eye:before { content: "\ea4c"; }
+.ez-icon-favorite:before { content: "\ea4d"; }
+.ez-icon-figma:before { content: "\ea4e"; }
+.ez-icon-file-download:before { content: "\ea4f"; }
+.ez-icon-file-upload:before { content: "\ea50"; }
+.ez-icon-filter:before { content: "\ea51"; }
+.ez-icon-find-file:before { content: "\ea52"; }
+.ez-icon-find-page:before { content: "\ea53"; }
+.ez-icon-format-color-fill:before { content: "\ea54"; }
+.ez-icon-generic:before { content: "\ea55"; }
+.ez-icon-gif:before { content: "\ea56"; }
+.ez-icon-graph_bar:before { content: "\ea57"; }
+.ez-icon-handshake:before { content: "\ea58"; }
+.ez-icon-help-inverted:before { content: "\ea59"; }
+.ez-icon-help:before { content: "\ea5a"; }
+.ez-icon-hide_menu:before { content: "\ea5b"; }
+.ez-icon-home:before { content: "\ea5c"; }
+.ez-icon-icons104:before { content: "\ea5d"; }
+.ez-icon-language:before { content: "\ea5e"; }
+.ez-icon-launch:before { content: "\ea5f"; }
+.ez-icon-lightbulb:before { content: "\ea60"; }
+.ez-icon-list:before { content: "\ea61"; }
+.ez-icon-location:before { content: "\ea62"; }
+.ez-icon-lock-outline:before { content: "\ea63"; }
+.ez-icon-lock:before { content: "\ea64"; }
+.ez-icon-menu:before { content: "\ea65"; }
+.ez-icon-mid:before { content: "\ea66"; }
+.ez-icon-minus:before { content: "\ea67"; }
+.ez-icon-money-off:before { content: "\ea68"; }
+.ez-icon-money:before { content: "\ea69"; }
+.ez-icon-more:before { content: "\ea6a"; }
+.ez-icon-mp3:before { content: "\ea6b"; }
+.ez-icon-mp4:before { content: "\ea6c"; }
+.ez-icon-multiple-files:before { content: "\ea6d"; }
+.ez-icon-north-west:before { content: "\ea6e"; }
+.ez-icon-number:before { content: "\ea6f"; }
+.ez-icon-ordem-ascendente:before { content: "\ea70"; }
+.ez-icon-ordem-descendente:before { content: "\ea71"; }
+.ez-icon-parcelar:before { content: "\ea72"; }
+.ez-icon-pause:before { content: "\ea73"; }
+.ez-icon-payments:before { content: "\ea74"; }
+.ez-icon-pdf:before { content: "\ea75"; }
+.ez-icon-play:before { content: "\ea76"; }
+.ez-icon-plus:before { content: "\ea77"; }
+.ez-icon-png:before { content: "\ea78"; }
+.ez-icon-power:before { content: "\ea79"; }
+.ez-icon-pptx:before { content: "\ea7a"; }
+.ez-icon-preview:before { content: "\ea7b"; }
+.ez-icon-print:before { content: "\ea7c"; }
+.ez-icon-push-pin:before { content: "\ea7d"; }
+.ez-icon-rateio:before { content: "\ea7e"; }
+.ez-icon-receipt:before { content: "\ea7f"; }
+.ez-icon-recolher_card:before { content: "\ea80"; }
+.ez-icon-remove-from-cart:before { content: "\ea81"; }
+.ez-icon-restore:before { content: "\ea82"; }
+.ez-icon-return:before { content: "\ea83"; }
+.ez-icon-sankhya-place:before { content: "\ea84"; }
+.ez-icon-save:before { content: "\ea85"; }
+.ez-icon-search:before { content: "\ea86"; }
+.ez-icon-settings-inverted:before { content: "\ea87"; }
+.ez-icon-settings:before { content: "\ea88"; }
+.ez-icon-share:before { content: "\ea89"; }
+.ez-icon-shield:before { content: "\ea8a"; }
+.ez-icon-show_menu:before { content: "\ea8b"; }
+.ez-icon-south-east:before { content: "\ea8c"; }
+.ez-icon-sync:before { content: "\ea8d"; }
+.ez-icon-table:before { content: "\ea8e"; }
+.ez-icon-tag_code:before { content: "\ea8f"; }
+.ez-icon-text:before { content: "\ea90"; }
+.ez-icon-timeline:before { content: "\ea91"; }
+.ez-icon-timer-outline:before { content: "\ea92"; }
+.ez-icon-trending-up:before { content: "\ea93"; }
+.ez-icon-tune:before { content: "\ea94"; }
+.ez-icon-txt:before { content: "\ea95"; }
+.ez-icon-un-pin:before { content: "\ea96"; }
+.ez-icon-unfold_less:before { content: "\ea97"; }
+.ez-icon-unfold_more:before { content: "\ea98"; }
+.ez-icon-user-circle:before { content: "\ea99"; }
+.ez-icon-warning-outline:before { content: "\ea9a"; }
+.ez-icon-warning_triangle:before { content: "\ea9b"; }
+.ez-icon-whatshot:before { content: "\ea9c"; }
+.ez-icon-xlsx:before { content: "\ea9d"; }
+.ez-icon-zip:before { content: "\ea9e"; }
 /*
   END CSS GENERATED BY EZ-DESIGN ICONS
 */

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

@@ -147,6 +147,7 @@ p {
 
 .item-content {
   display: flex;
+  align-items: center;
   overflow: hidden;
   justify-content: flex-start;
   width: 100%;
@@ -176,7 +177,7 @@ p {
 
 .draggable-list li > div {
   /*public*/
-  padding: var(--space--2xs, 8px) var(--space--3xs, 4px);
+  padding: var(--space--3xs, 4px) var(--space--3xs, 4px);
   margin: var(--ez-list__item--margin);
 }
 

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

@@ -25,10 +25,10 @@ export class EzList {
    */
   async scrollToTop() {
     if (this.useGroups) {
-      this._element.shadowRoot.querySelector('.group-container').scrollTop = 0;
+      this._element.querySelector('.group-container').scrollTop = 0;
     }
     else {
-      this._element.shadowRoot.querySelector('.items-container').scrollTop = 0;
+      this._element.querySelector('.items-container').scrollTop = 0;
     }
   }
   /**
@@ -148,8 +148,7 @@ export class EzList {
     }
   }
   buildIdDraggableListAndSelectable() {
-    const shadow = this._element.shadowRoot;
-    const draggableList = shadow.querySelectorAll('.draggable-list');
+    const draggableList = this._element.querySelectorAll('.draggable-list');
     draggableList === null || draggableList === void 0 ? void 0 : draggableList.forEach((draggable, index) => {
       var _a, _b;
       let suffix = 'draggableList';
@@ -159,7 +158,7 @@ export class EzList {
       }
       ElementIDUtils.addIDInfoIfNotExists(draggable, suffix);
     });
-    const selectable = shadow.querySelectorAll('.selectable-container');
+    const selectable = this._element.querySelectorAll('.selectable-container');
     selectable === null || selectable === void 0 ? void 0 : selectable.forEach((item) => {
       ElementIDUtils.addIDInfoIfNotExists(item, 'selectable');
     });
@@ -288,7 +287,7 @@ export class EzList {
     }
     if (this._draggingElement) {
       try {
-        this._element.shadowRoot.removeChild(this._draggingElement);
+        this._element.removeChild(this._draggingElement);
       }
       catch (err) { }
       this._draggingElement = undefined;
@@ -551,7 +550,7 @@ export class EzList {
       }, onDragEnd: () => this.onDragEnd(), onDrop: event => this.onDropLastIndex(event) }))))));
   }
   static get is() { return "ez-list"; }
-  static get encapsulation() { return "shadow"; }
+  static get encapsulation() { return "scoped"; }
   static get originalStyleUrls() {
     return {
       "$": ["ez-list.css"]

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

@@ -1,6 +1,6 @@
 :host {
   /*@doc Define a camada em que o componente será exibido.*/
-  --ez-modal-z-index: var(--elevation--12, 12);;
+  --ez-modal-z-index: var(--elevation--22, 22);
   /*@doc Define o espaçamento vertical do conteúdo do modal.*/
   --ez-modal-vertical-padding: var(--space--large, 24px);
   /*@doc Define o padding entre o conteúdo e o modal */
@@ -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

@@ -8,6 +8,7 @@ export class EzModal {
     this.opened = true;
     this.closeEsc = false;
     this.closeOutsideClick = false;
+    this.closeOutsideLeave = false;
     this.scrim = "medium";
   }
   observeOpened() {
@@ -30,15 +31,29 @@ export class EzModal {
       .bind("Esc", () => this.closeModal());
   }
   componentDidRender() {
-    if (this.opened) {
-      this.ezOpenModal.emit();
+    this.modalFocus();
+  }
+  modalFocus() {
+    if (!this.opened) {
+      return;
     }
+    requestAnimationFrame(() => {
+      const slot = this._element.shadowRoot.querySelector("ez-modal-container");
+      if (this._modalRef && slot === null) {
+        this._modalRef.focus();
+      }
+    });
   }
   onMouseDownHandler(event) {
     if (this.closeOutsideClick && event.target === this._overlay) {
       this.closeModal();
     }
   }
+  onMouseLeaveHandler() {
+    if (this.closeOutsideLeave) {
+      this.closeModal();
+    }
+  }
   render() {
     const positionSufix = this.align === "left" ? "left" : "right";
     const regularVerticalPaddingClass = this.heightMode === "regular" ? 'modal__vertical-padding' : '';
@@ -46,7 +61,7 @@ export class EzModal {
     const scrimType = `modal__screen-${this.scrim}`;
     return (h(Host, null, this.opened
       ?
-        h("div", { ref: ref => this._modalRef = ref, class: `modal ${scrimType} ${regularVerticalPaddingClass}`, onMouseDown: evt => this.onMouseDownHandler(evt), tabIndex: -1 }, h("div", { class: `modal__container modal__container--${positionSufix}`, ref: ref => this._overlay = ref }, h("div", { class: `modal__content ${modalContentHeightMode} ${this.modalSize}` }, h("slot", null))))
+        h("div", { ref: ref => this._modalRef = ref, class: `modal ${scrimType} ${regularVerticalPaddingClass}`, onMouseDown: evt => this.onMouseDownHandler(evt), tabIndex: -1 }, h("div", { class: `modal__container modal__container--${positionSufix}`, ref: ref => this._overlay = ref }, h("div", { onMouseLeave: () => this.onMouseLeaveHandler(), class: `modal__content ${modalContentHeightMode} ${this.modalSize}` }, h("slot", null))))
       :
         undefined));
   }
@@ -174,12 +189,30 @@ export class EzModal {
         "reflect": false,
         "defaultValue": "false"
       },
+      "closeOutsideLeave": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "Define se o modal ser\u00E1 fechado se o mouse sair para fora do conte\u00FAdo."
+        },
+        "attribute": "close-outside-leave",
+        "reflect": false,
+        "defaultValue": "false"
+      },
       "scrim": {
         "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-modal-container/ez-modal-container.js

@@ -11,6 +11,7 @@ export class EzModalContainer {
     this.okButtonLabel = undefined;
     this.cancelButtonStatus = undefined;
     this.okButtonStatus = undefined;
+    this.showCloseButton = true;
   }
   async handleEzModalAction(event) {
     var _a;
@@ -47,7 +48,7 @@ export class EzModalContainer {
     this._closeButton.focus();
   }
   render() {
-    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--large" }, 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))), h("button", { ref: ref => this._closeButton = ref, class: "ez-modal-container__close-button", onClick: () => this.ezModalAction.emit(ModalAction.CLOSE) }, h("ez-icon", { class: "ez-modal-container__close-icon", size: "medium", iconName: "close" }))))), h("div", { class: "ez-modal-container__content" }, h("slot", null)), h("div", { class: "ez-modal-container__footer" }, this.cancelIsVisible() && (h("ez-button", { label: this.cancelButtonLabel, 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, enabled: this.okButtonStatus !== ModalButtonStatus.DISABLED, onClick: () => this.ezModalAction.emit(ModalAction.OK) }))), h("button", { class: "ez-modal-container__focus-ctrl", onFocusin: () => this.focusFirst() })));
+    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) }, h("ez-icon", { class: "ez-modal-container__close-icon", size: "medium", iconName: "close" })))))), h("div", { class: "ez-modal-container__content" }, h("slot", null)), h("div", { class: "ez-modal-container__footer" }, this.cancelIsVisible() && (h("ez-button", { label: this.cancelButtonLabel, 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, enabled: this.okButtonStatus !== ModalButtonStatus.DISABLED, onClick: () => this.ezModalAction.emit(ModalAction.OK) }))), h("button", { class: "ez-modal-container__focus-ctrl", onFocusin: () => this.focusFirst() })));
   }
   static get is() { return "ez-modal-container"; }
   static get encapsulation() { return "scoped"; }
@@ -182,6 +183,24 @@ export class EzModalContainer {
         },
         "attribute": "ok-button-status",
         "reflect": false
+      },
+      "showCloseButton": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "Define a visibilidade do bot\u00E3o de fechar."
+        },
+        "attribute": "show-close-button",
+        "reflect": false,
+        "defaultValue": "true"
       }
     };
   }

package/dist/collection/components/ez-multi-selection-list/ez-multi-selection-list.css

@@ -1,9 +1,10 @@
 :host {
   --ez-check--outter-gap: 0px;
+  --ez-multi-selection-default-height: 322px;
 
   display: block;
   width: 304px;
-  height: 322px;
+  height: var(--ez-multi-selection-default-height);
   max-height: calc(100vh - 350px);
 }
 
@@ -13,7 +14,6 @@
 
 .multi-selection__content-options {
   position: relative;
-  top: -12px;
   left: -4px;
 }
 
@@ -23,7 +23,6 @@
 }
 
 .multi-selection__list {
-  height: 235px;
   max-height: calc(100vh - 435px);
   overflow-y: auto;
   overflow-x: clip;

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

@@ -96,7 +96,7 @@ export class EzMuiltiSelectionList {
   }
   async searchWithDataSource(searchArgument, fieldName) {
     const { argument, mode } = searchArgument;
-    if (mode !== 'PRELOAD') {
+    if (mode !== 'PRELOAD' && fieldName) {
       return this.dataSource.fetchData(argument, fieldName);
     }
   }

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);
 }