@sankhyalabs/ezui 5.22.0-dev.5 → 5.22.0-dev.50

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

@@ -36,6 +36,10 @@ export class EzGrid {
     this.recordsValidator = undefined;
     this.canEdit = true;
     this.autoFocus = true;
+    this.paginationCounterMode = 'show';
+    this.enableGridInsert = false;
+    this.enableContinuousInsert = true;
+    this.enableLockManger = true;
   }
   /**
    * Aplica a definição de colunas.
@@ -160,6 +164,18 @@ export class EzGrid {
   async setFocus() {
     this._gridController.setFocus();
   }
+  /**
+   * Para a edição da grade.
+   */
+  async stopEdit() {
+    this._gridController.stopEdit();
+  }
+  async checkStopEditOutsideClick(event) {
+    var _a;
+    if ((_a = this._container) === null || _a === void 0 ? void 0 : _a.contains(event.target))
+      return;
+    this._gridController.stopEdit();
+  }
   observeConfig(config) {
     this._gridController.setColumnsState(config === null || config === void 0 ? void 0 : config.columns);
   }
@@ -171,12 +187,23 @@ export class EzGrid {
       this._refPaginationLabelTooltip.setAttribute('data-tooltip', this._getPaginationTooltip());
     }
   }
+  observePaginationCounterMode(newValue) {
+    if (newValue === 'hidden') {
+      this._hidePaginationDescription();
+    }
+    if (newValue === 'show') {
+      this._showPaginationDescription();
+    }
+  }
   onSelectionChange(evt) {
     this._currentPageSelected = evt.detail.selectionHeaderStatus === true;
     if (this.dataUnit) {
       this.setSelection(this.dataUnit.getSelectionInfo());
     }
   }
+  async handleClick(event) {
+    this.checkStopEditOutsideClick(event);
+  }
   setSelection(selectionInfo) {
     var _a;
     this._selectionCount = (_a = selectionInfo === null || selectionInfo === void 0 ? void 0 : selectionInfo.length) !== null && _a !== void 0 ? _a : 0;
@@ -332,13 +359,18 @@ export class EzGrid {
   resetPaginationState() {
     var _a;
     this._paginationChangedByKeyboard = false;
-    (_a = this._gridApi) === null || _a === void 0 ? void 0 : _a.clearRangeSelection();
+    (_a = this._gridController) === null || _a === void 0 ? void 0 : _a.resetPaginationState();
+  }
+  resolvePaginationClassMode() {
+    if (this.paginationCounterMode == 'show')
+      return "pagination-expanded";
+    return "pagination-contracted";
   }
   getPaginationControl() {
     if (!this._paginationInfo)
       return null;
     const { currentPage, hasMore } = this._paginationInfo;
-    return (h("div", { class: "grid-header__container grid-header__pagination", ref: ref => (this._refPaginationControl = ref) }, h("div", { class: "ez-text ez-text--primary ez-text--medium ez-margin-right--medium", ref: (element) => (this._refPaginationLabel = element) }, h("span", { class: "grid-header__pagination-label" }, h("strong", { class: "ez-text ez-text--primary ez-text--medium" }, this._getActualPageLabel()), this._getRemainingPageLabel())), h("div", { id: "grid-pagination-tooltip", ref: (element) => (this._refPaginationLabelTooltip = element), class: "ez-flex ez-margin-right--medium" }, h("ez-button", { size: "small", class: "ez-margin-right--medium", iconName: "chevron-left", mode: "icon", enabled: currentPage > 0, onClick: () => this.previousPage(), label: "P\u00E1gina anterior" }), h("ez-button", { size: "small", iconName: "chevron-right", mode: "icon", enabled: hasMore, onClick: () => this.nextPage(), label: "Pr\u00F3xima P\u00E1gina" }))));
+    return (h("div", { class: `grid-header__container grid-header__pagination ${this.resolvePaginationClassMode()}`, ref: ref => (this._refPaginationControl = ref) }, h("div", { class: "ez-text ez-text--primary ez-text--medium ez-margin-right--medium", ref: (element) => (this._refPaginationLabel = element) }, h("span", { class: "grid-header__pagination-label" }, this.paginationCounterMode == 'show' && h("strong", { class: "ez-text ez-text--primary ez-text--medium" }, this._getActualPageLabel()), this.paginationCounterMode == 'show' && this._getRemainingPageLabel())), h("div", { id: "grid-pagination-tooltip", ref: (element) => (this._refPaginationLabelTooltip = element), class: "ez-flex ez-margin-right--medium", title: `${this._getActualPageLabel()} ${this._getRemainingPageLabel()}` }, h("ez-button", { size: "small", class: "ez-margin-right--medium", iconName: "chevron-left", mode: "icon", enabled: currentPage > 0, onClick: () => this.previousPage(), label: "P\u00E1gina anterior" }), h("ez-button", { size: "small", iconName: "chevron-right", mode: "icon", enabled: hasMore, onClick: () => this.nextPage(), label: "Pr\u00F3xima P\u00E1gina" }))));
   }
   componentDidLoad() {
     this._gridController.initDatagrid(this._container, {
@@ -362,11 +394,14 @@ export class EzGrid {
       editionIsDisabled: () => !this.canEdit,
       customFormatters: this._customFormatters,
       autoFocus: this.autoFocus,
+      enableGridInsert: this.enableGridInsert,
+      enableContinuousInsert: this.enableContinuousInsert,
       onRefresh: () => {
         if (this.dataUnit) {
           this.setSelection(this.dataUnit.getSelectionInfo());
         }
-      }
+      },
+      enableLockManger: this.enableLockManger
     });
     if (this.config) {
       this.observeConfig(this.config);
@@ -378,7 +413,8 @@ export class EzGrid {
     this.setEvents();
     this.componentReady.emit();
     this._gridController.configFilterColumn(this._filterColumn);
-    this._initHeaderOverflowWatcher();
+    if (this.paginationCounterMode === 'auto')
+      this._initHeaderOverflowWatcher();
   }
   handlePaginationChange(selectFirstRecord, paginationInfo) {
     var _a;
@@ -405,7 +441,8 @@ export class EzGrid {
     return this._getActualPageLabel() + this._getRemainingPageLabel();
   }
   _initHeaderOverflowWatcher() {
-    this._headerOverflowWatcher = new OverflowWatcher(this.buildOverFlowWatcherParams());
+    if (this._refPaginationControl)
+      this._headerOverflowWatcher = new OverflowWatcher(this.buildOverFlowWatcherParams());
   }
   buildOverFlowWatcherParams() {
     return {
@@ -436,8 +473,13 @@ export class EzGrid {
     this._refPaginationLabelTooltip.removeAttribute('data-tooltip');
   }
   disconnectedCallback() {
-    var _a;
+    var _a, _b;
     (_a = this._headerOverflowWatcher) === null || _a === void 0 ? void 0 : _a.destroy();
+    (_b = this._gridController) === null || _b === void 0 ? void 0 : _b.destroy();
+  }
+  connectedCallback() {
+    var _a;
+    (_a = this._gridController) === null || _a === void 0 ? void 0 : _a.registryListeners();
   }
   componentWillRender() {
     this.configSelectionCounter();
@@ -454,6 +496,11 @@ export class EzGrid {
   }
   componentDidUpdate() {
     this._gridController.setAutoFocus(this.autoFocus);
+    this._gridController.setEnableGridInsert(this.enableGridInsert);
+    this._gridController.setEnableContinuousInsert(this.enableContinuousInsert);
+    if (this.dataUnit) {
+      this.setSelection(this.dataUnit.getSelectionInfo());
+    }
   }
   getDataSource() {
     var _a;
@@ -462,9 +509,14 @@ export class EzGrid {
   hideHeader() {
     return (!!this._element.getAttribute("no-header") && !this._paginationInfo);
   }
+  resolveLeftHeaderClass() {
+    if (this.paginationCounterMode == 'show')
+      return "left__header-expanded";
+    return "left__header-contracted";
+  }
   render() {
     var _a;
-    return (h(Host, { "no-header": this.hideHeader() }, h("div", { class: "grid__container ez-grid", ref: elem => (this._container = elem) }), h("div", { class: "ez-box ez-box--shadow ez-padding--medium grid-header" }, h("filter-column", { class: "grid-header__popover", noHeaderTaskBar: !this._hasLeftButtons, dataSource: this.getDataSource(), dataUnit: this.dataUnit, gridHeaderHidden: this.hideHeader(), ref: (element) => (this._filterColumn = element) }), h("div", { class: "grid-header__position" }, h("div", { class: "grid-header__container grid-header__left-container" }, h("slot", { name: "leftButtons" })), this.getPaginationControl())), h("div", { ref: (ref) => (this._gridSelectionCounter = ref), class: `grid__selection-counter  ez-elevation--4
+    return (h(Host, { "no-header": this.hideHeader() }, h("div", { class: "grid__container ez-grid", ref: elem => (this._container = elem) }), h("div", { class: "ez-box ez-box--shadow ez-padding--small grid-header" }, h("filter-column", { class: "grid-header__popover", noHeaderTaskBar: !this._hasLeftButtons, dataSource: this.getDataSource(), dataUnit: this.dataUnit, gridHeaderHidden: this.hideHeader(), ref: (element) => (this._filterColumn = element) }), h("div", { class: "grid-header__position" }, h("div", { class: `grid-header__container grid-header__left-container ${this.resolveLeftHeaderClass()}` }, h("slot", { name: "leftButtons" })), this.getPaginationControl())), h("div", { ref: (ref) => (this._gridSelectionCounter = ref), class: `grid__selection-counter  ez-elevation--4
           ${this._showSelectionCounter ? 'grid__selection-counter--opened' : ''}
         ` }, h(SelectionCounter, { selectionCount: this._selectionCount, currentPageSelected: this._currentPageSelected, paginationInfo: this._paginationInfo, canSelectAll: (_a = this.selectionToastConfig) === null || _a === void 0 ? void 0 : _a.canSelectAll, allRecordSelected: this._isAllSelection, onSelectAll: () => this.onSelectAllRecords(), onSelectPage: () => this.onSelectPageRecords(), onClearAll: () => this.onClearSelectedRecords(), onClose: () => (this._showSelectionCounter = false) })), h("div", { class: "grid__footer" }, h("slot", { name: "footer" }))));
   }
@@ -694,6 +746,78 @@ export class EzGrid {
         "attribute": "auto-focus",
         "reflect": false,
         "defaultValue": "true"
+      },
+      "paginationCounterMode": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "'show' | 'hidden' | 'auto'",
+          "resolved": "\"auto\" | \"hidden\" | \"show\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "Define se a grid ser\u00E1 focada ao ser carregada."
+        },
+        "attribute": "pagination-counter-mode",
+        "reflect": false,
+        "defaultValue": "'show'"
+      },
+      "enableGridInsert": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "Ativa inser\u00E7\u00E3o de registros no modo grade."
+        },
+        "attribute": "enable-grid-insert",
+        "reflect": false,
+        "defaultValue": "false"
+      },
+      "enableContinuousInsert": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "Ativa/desativa a inser\u00E7\u00E3o continua na grade\nS\u00F3 funciona quando a prop enableGridInsert est\u00E1 ativa"
+        },
+        "attribute": "enable-continuous-insert",
+        "reflect": false,
+        "defaultValue": "true"
+      },
+      "enableLockManger": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "Ativa inser\u00E7\u00E3o de registros no modo grade."
+        },
+        "attribute": "enable-lock-manger",
+        "reflect": false,
+        "defaultValue": "true"
       }
     };
   }
@@ -1198,6 +1322,47 @@ export class EzGrid {
           "text": "Atribui o foco para a grade.",
           "tags": []
         }
+      },
+      "stopEdit": {
+        "complexType": {
+          "signature": "() => Promise<void>",
+          "parameters": [],
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
+          },
+          "return": "Promise<void>"
+        },
+        "docs": {
+          "text": "Para a edi\u00E7\u00E3o da grade.",
+          "tags": []
+        }
+      },
+      "checkStopEditOutsideClick": {
+        "complexType": {
+          "signature": "(event: MouseEvent) => Promise<void>",
+          "parameters": [{
+              "tags": [],
+              "text": ""
+            }],
+          "references": {
+            "Promise": {
+              "location": "global"
+            },
+            "MouseEvent": {
+              "location": "global"
+            },
+            "Node": {
+              "location": "global"
+            }
+          },
+          "return": "Promise<void>"
+        },
+        "docs": {
+          "text": "",
+          "tags": []
+        }
       }
     };
   }
@@ -1209,6 +1374,9 @@ export class EzGrid {
       }, {
         "propName": "_paginationInfo",
         "methodName": "updatePaginationTooltip"
+      }, {
+        "propName": "paginationCounterMode",
+        "methodName": "observePaginationCounterMode"
       }];
   }
   static get listeners() {
@@ -1218,6 +1386,12 @@ export class EzGrid {
         "target": undefined,
         "capture": false,
         "passive": false
+      }, {
+        "name": "click",
+        "method": "handleClick",
+        "target": undefined,
+        "capture": true,
+        "passive": false
       }];
   }
 }

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