@sankhyalabs/ezui 2.5.1 → 2.6.0

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

@@ -48,128 +48,154 @@ svg {
 */
 [class^="ez-icon-"], [class*=" ez-icon-"] {
   font-family: 'ez-icons' !important;
-  font-size: 16px;
+  font-size:16px;
   font-style:normal;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
 }
+
 .ez-icon-2chevron-down:before { content: "\ea01"; }
 .ez-icon-2chevron-up:before { content: "\ea02"; }
 .ez-icon-account-outline:before { content: "\ea03"; }
 .ez-icon-account:before { content: "\ea04"; }
-.ez-icon-actions-sprite:before { content: "\ea05"; }
+.ez-icon-actions-sprite-v1: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-apps:before { content: "\ea0b"; }
-.ez-icon-arrow_back:before { content: "\ea0c"; }
-.ez-icon-arrow_downward:before { content: "\ea0d"; }
-.ez-icon-balance:before { content: "\ea0e"; }
-.ez-icon-bell-inverted:before { content: "\ea0f"; }
-.ez-icon-bell:before { content: "\ea10"; }
-.ez-icon-boleto:before { content: "\ea11"; }
-.ez-icon-business-center:before { content: "\ea12"; }
-.ez-icon-calendar-clock:before { content: "\ea13"; }
-.ez-icon-calendar:before { content: "\ea14"; }
-.ez-icon-cash-remove:before { content: "\ea15"; }
-.ez-icon-check-circle-inverted:before { content: "\ea16"; }
-.ez-icon-check-circle:before { content: "\ea17"; }
-.ez-icon-check:before { content: "\ea18"; }
-.ez-icon-chevron-down:before { content: "\ea19"; }
-.ez-icon-chevron-left:before { content: "\ea1a"; }
-.ez-icon-chevron-right:before { content: "\ea1b"; }
-.ez-icon-chevron-up:before { content: "\ea1c"; }
-.ez-icon-circle--medium:before { content: "\ea1d"; }
-.ez-icon-circle:before { content: "\ea1e"; }
-.ez-icon-cleaning:before { content: "\ea1f"; }
-.ez-icon-clipboard:before { content: "\ea20"; }
-.ez-icon-close:before { content: "\ea21"; }
-.ez-icon-cobrar:before { content: "\ea22"; }
-.ez-icon-configuration:before { content: "\ea23"; }
-.ez-icon-copy:before { content: "\ea24"; }
-.ez-icon-credit_card:before { content: "\ea25"; }
-.ez-icon-crop:before { content: "\ea26"; }
-.ez-icon-custom:before { content: "\ea27"; }
-.ez-icon-delete:before { content: "\ea28"; }
-.ez-icon-description:before { content: "\ea29"; }
-.ez-icon-dot-notification:before { content: "\ea2a"; }
-.ez-icon-dots-horizontal:before { content: "\ea2b"; }
-.ez-icon-dots-vertical:before { content: "\ea2c"; }
-.ez-icon-drag-indicator:before { content: "\ea2d"; }
-.ez-icon-dual-chevron-down:before { content: "\ea2e"; }
-.ez-icon-dual-chevron-up:before { content: "\ea2f"; }
-.ez-icon-edit-file:before { content: "\ea30"; }
-.ez-icon-edit-table:before { content: "\ea31"; }
-.ez-icon-edit-time:before { content: "\ea32"; }
-.ez-icon-edit:before { content: "\ea33"; }
-.ez-icon-email:before { content: "\ea34"; }
-.ez-icon-expand:before { content: "\ea35"; }
-.ez-icon-extrato:before { content: "\ea36"; }
-.ez-icon-eye-off:before { content: "\ea37"; }
-.ez-icon-eye:before { content: "\ea38"; }
-.ez-icon-favorite:before { content: "\ea39"; }
-.ez-icon-file-download:before { content: "\ea3a"; }
-.ez-icon-file-upload:before { content: "\ea3b"; }
-.ez-icon-filter:before { content: "\ea3c"; }
-.ez-icon-find-file:before { content: "\ea3d"; }
-.ez-icon-find-page:before { content: "\ea3e"; }
-.ez-icon-format-color-fill:before { content: "\ea3f"; }
-.ez-icon-graph_bar:before { content: "\ea40"; }
-.ez-icon-handshake:before { content: "\ea41"; }
-.ez-icon-help-inverted:before { content: "\ea42"; }
-.ez-icon-help:before { content: "\ea43"; }
-.ez-icon-home:before { content: "\ea44"; }
-.ez-icon-icons104:before { content: "\ea45"; }
-.ez-icon-language:before { content: "\ea46"; }
-.ez-icon-launch:before { content: "\ea47"; }
-.ez-icon-lightbulb:before { content: "\ea48"; }
-.ez-icon-list:before { content: "\ea49"; }
-.ez-icon-location:before { content: "\ea4a"; }
-.ez-icon-lock-outline:before { content: "\ea4b"; }
-.ez-icon-lock:before { content: "\ea4c"; }
-.ez-icon-menu:before { content: "\ea4d"; }
-.ez-icon-mid:before { content: "\ea4e"; }
-.ez-icon-minus:before { content: "\ea4f"; }
-.ez-icon-money-off:before { content: "\ea50"; }
-.ez-icon-money:before { content: "\ea51"; }
-.ez-icon-more:before { content: "\ea52"; }
-.ez-icon-north-west:before { content: "\ea53"; }
-.ez-icon-number:before { content: "\ea54"; }
-.ez-icon-ordem-ascendente:before { content: "\ea55"; }
-.ez-icon-ordem-descendente:before { content: "\ea56"; }
-.ez-icon-parcelar:before { content: "\ea57"; }
-.ez-icon-pause:before { content: "\ea58"; }
-.ez-icon-payments:before { content: "\ea59"; }
-.ez-icon-play:before { content: "\ea5a"; }
-.ez-icon-plus:before { content: "\ea5b"; }
-.ez-icon-power:before { content: "\ea5c"; }
-.ez-icon-print:before { content: "\ea5d"; }
-.ez-icon-push-pin:before { content: "\ea5e"; }
-.ez-icon-receipt:before { content: "\ea5f"; }
-.ez-icon-restore:before { content: "\ea60"; }
-.ez-icon-return:before { content: "\ea61"; }
-.ez-icon-save:before { content: "\ea62"; }
-.ez-icon-search:before { content: "\ea63"; }
-.ez-icon-settings-inverted:before { content: "\ea64"; }
-.ez-icon-settings:before { content: "\ea65"; }
-.ez-icon-share:before { content: "\ea66"; }
-.ez-icon-shield:before { content: "\ea67"; }
-.ez-icon-south-east:before { content: "\ea68"; }
-.ez-icon-sync:before { content: "\ea69"; }
-.ez-icon-table:before { content: "\ea6a"; }
-.ez-icon-text:before { content: "\ea6b"; }
-.ez-icon-timeline:before { content: "\ea6c"; }
-.ez-icon-timer-outline:before { content: "\ea6d"; }
-.ez-icon-tune:before { content: "\ea6e"; }
-.ez-icon-un-pin:before { content: "\ea6f"; }
-.ez-icon-unfold_less:before { content: "\ea70"; }
-.ez-icon-unfold_more:before { content: "\ea71"; }
-.ez-icon-user-circle:before { content: "\ea72"; }
-.ez-icon-warning-outline:before { content: "\ea73"; }
-.ez-icon-warning_triangle:before { content: "\ea74"; }
-.ez-icon-whatshot:before { content: "\ea75"; }
+.ez-icon-antecipação:before { content: "\ea0b"; }
+.ez-icon-apps:before { content: "\ea0c"; }
+.ez-icon-arrow_back:before { content: "\ea0d"; }
+.ez-icon-arrow_downward:before { content: "\ea0e"; }
+.ez-icon-baixa:before { content: "\ea0f"; }
+.ez-icon-balance:before { content: "\ea10"; }
+.ez-icon-bell-inverted:before { content: "\ea11"; }
+.ez-icon-bell:before { content: "\ea12"; }
+.ez-icon-boleto:before { content: "\ea13"; }
+.ez-icon-business-center:before { content: "\ea14"; }
+.ez-icon-calendar-clock:before { content: "\ea15"; }
+.ez-icon-calendar:before { content: "\ea16"; }
+.ez-icon-cash-remove:before { content: "\ea17"; }
+.ez-icon-check-circle-inverted:before { content: "\ea18"; }
+.ez-icon-check-circle:before { content: "\ea19"; }
+.ez-icon-check:before { content: "\ea1a"; }
+.ez-icon-chevron-down:before { content: "\ea1b"; }
+.ez-icon-chevron-left:before { content: "\ea1c"; }
+.ez-icon-chevron-right:before { content: "\ea1d"; }
+.ez-icon-chevron-up:before { content: "\ea1e"; }
+.ez-icon-circle--medium:before { content: "\ea1f"; }
+.ez-icon-circle:before { content: "\ea20"; }
+.ez-icon-cleaning:before { content: "\ea21"; }
+.ez-icon-clipboard:before { content: "\ea22"; }
+.ez-icon-close:before { content: "\ea23"; }
+.ez-icon-cobrar:before { content: "\ea24"; }
+.ez-icon-code:before { content: "\ea25"; }
+.ez-icon-configuration:before { content: "\ea26"; }
+.ez-icon-copy:before { content: "\ea27"; }
+.ez-icon-credit_card:before { content: "\ea28"; }
+.ez-icon-crop:before { content: "\ea29"; }
+.ez-icon-custom:before { content: "\ea2a"; }
+.ez-icon-delete:before { content: "\ea2b"; }
+.ez-icon-description:before { content: "\ea2c"; }
+.ez-icon-dividir:before { content: "\ea2d"; }
+.ez-icon-docx:before { content: "\ea2e"; }
+.ez-icon-dot-notification:before { content: "\ea2f"; }
+.ez-icon-dots-horizontal:before { content: "\ea30"; }
+.ez-icon-dots-vertical:before { content: "\ea31"; }
+.ez-icon-drag-indicator:before { content: "\ea32"; }
+.ez-icon-dual-chevron-down:before { content: "\ea33"; }
+.ez-icon-dual-chevron-up:before { content: "\ea34"; }
+.ez-icon-edit-file:before { content: "\ea35"; }
+.ez-icon-edit-table:before { content: "\ea36"; }
+.ez-icon-edit-time:before { content: "\ea37"; }
+.ez-icon-edit:before { content: "\ea38"; }
+.ez-icon-email:before { content: "\ea39"; }
+.ez-icon-estorno:before { content: "\ea3a"; }
+.ez-icon-exe:before { content: "\ea3b"; }
+.ez-icon-expand:before { content: "\ea3c"; }
+.ez-icon-expandir_card:before { content: "\ea3d"; }
+.ez-icon-extrato:before { content: "\ea3e"; }
+.ez-icon-eye-off:before { content: "\ea3f"; }
+.ez-icon-eye:before { content: "\ea40"; }
+.ez-icon-favorite:before { content: "\ea41"; }
+.ez-icon-figma:before { content: "\ea42"; }
+.ez-icon-file-download:before { content: "\ea43"; }
+.ez-icon-file-upload:before { content: "\ea44"; }
+.ez-icon-filter:before { content: "\ea45"; }
+.ez-icon-find-file:before { content: "\ea46"; }
+.ez-icon-find-page:before { content: "\ea47"; }
+.ez-icon-format-color-fill:before { content: "\ea48"; }
+.ez-icon-generic:before { content: "\ea49"; }
+.ez-icon-gif:before { content: "\ea4a"; }
+.ez-icon-graph_bar:before { content: "\ea4b"; }
+.ez-icon-handshake:before { content: "\ea4c"; }
+.ez-icon-help-inverted:before { content: "\ea4d"; }
+.ez-icon-help:before { content: "\ea4e"; }
+.ez-icon-hide_menu:before { content: "\ea4f"; }
+.ez-icon-home:before { content: "\ea50"; }
+.ez-icon-icons104:before { content: "\ea51"; }
+.ez-icon-language:before { content: "\ea52"; }
+.ez-icon-launch:before { content: "\ea53"; }
+.ez-icon-lightbulb:before { content: "\ea54"; }
+.ez-icon-list:before { content: "\ea55"; }
+.ez-icon-location:before { content: "\ea56"; }
+.ez-icon-lock-outline:before { content: "\ea57"; }
+.ez-icon-lock:before { content: "\ea58"; }
+.ez-icon-menu:before { content: "\ea59"; }
+.ez-icon-mid:before { content: "\ea5a"; }
+.ez-icon-minus:before { content: "\ea5b"; }
+.ez-icon-money-off:before { content: "\ea5c"; }
+.ez-icon-money:before { content: "\ea5d"; }
+.ez-icon-more:before { content: "\ea5e"; }
+.ez-icon-mp3:before { content: "\ea5f"; }
+.ez-icon-mp4:before { content: "\ea60"; }
+.ez-icon-north-west:before { content: "\ea61"; }
+.ez-icon-number:before { content: "\ea62"; }
+.ez-icon-ordem-ascendente:before { content: "\ea63"; }
+.ez-icon-ordem-descendente:before { content: "\ea64"; }
+.ez-icon-parcelar:before { content: "\ea65"; }
+.ez-icon-pause:before { content: "\ea66"; }
+.ez-icon-payments:before { content: "\ea67"; }
+.ez-icon-pdf:before { content: "\ea68"; }
+.ez-icon-play:before { content: "\ea69"; }
+.ez-icon-plus:before { content: "\ea6a"; }
+.ez-icon-png:before { content: "\ea6b"; }
+.ez-icon-power:before { content: "\ea6c"; }
+.ez-icon-pptx:before { content: "\ea6d"; }
+.ez-icon-print:before { content: "\ea6e"; }
+.ez-icon-push-pin:before { content: "\ea6f"; }
+.ez-icon-rateio:before { content: "\ea70"; }
+.ez-icon-receipt:before { content: "\ea71"; }
+.ez-icon-recolher_card:before { content: "\ea72"; }
+.ez-icon-restore:before { content: "\ea73"; }
+.ez-icon-return:before { content: "\ea74"; }
+.ez-icon-save:before { content: "\ea75"; }
+.ez-icon-search:before { content: "\ea76"; }
+.ez-icon-settings-inverted:before { content: "\ea77"; }
+.ez-icon-settings:before { content: "\ea78"; }
+.ez-icon-share:before { content: "\ea79"; }
+.ez-icon-shield:before { content: "\ea7a"; }
+.ez-icon-show_menu:before { content: "\ea7b"; }
+.ez-icon-south-east:before { content: "\ea7c"; }
+.ez-icon-sync:before { content: "\ea7d"; }
+.ez-icon-table:before { content: "\ea7e"; }
+.ez-icon-tag_code:before { content: "\ea7f"; }
+.ez-icon-text:before { content: "\ea80"; }
+.ez-icon-timeline:before { content: "\ea81"; }
+.ez-icon-timer-outline:before { content: "\ea82"; }
+.ez-icon-tune:before { content: "\ea83"; }
+.ez-icon-txt:before { content: "\ea84"; }
+.ez-icon-un-pin:before { content: "\ea85"; }
+.ez-icon-unfold_less:before { content: "\ea86"; }
+.ez-icon-unfold_more:before { content: "\ea87"; }
+.ez-icon-user-circle:before { content: "\ea88"; }
+.ez-icon-warning-outline:before { content: "\ea89"; }
+.ez-icon-warning_triangle:before { content: "\ea8a"; }
+.ez-icon-whatshot:before { content: "\ea8b"; }
+.ez-icon-xlsx:before { content: "\ea8c"; }
+.ez-icon-zip:before { content: "\ea8d"; }
+
 /*
   END CSS GENERATED BY EZ-DESIGN ICONS
 */

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

@@ -6,9 +6,15 @@
 
   /* Container */
   /*@doc Define a camada em que o container será exibido.*/
-  --ez-toast__container-z-index: var(--more-visible, 2);
+  --ez-toast__container--z-index: var(--more-visible, 2);
   /*@doc Define a cor de fundo do container.*/
   --ez-toast__container--background-color: var(--color--secondary, #383c45);
+  /*@doc Define a posição esquerda do container.*/
+  --ez-toast__container--left: var(--space--large, 24px);
+  /*@doc Define a posição inferior do container.*/
+  --ez-toast__container--bottom: var(--space--large, 24px);
+  /*@doc Define a largura do container.*/
+  --ez-toast__container--width: 400px;
 
   /* Icon */
   /*@doc Define o espaçamento à esquerda do ícone.*/
@@ -16,22 +22,25 @@
 }
 
 .toast__container {
+  /*private*/
   position: fixed;
   display: flex;
-  bottom: 100px;
-  z-index: var(--ez-toast__container-z-index);
-  left: 100px;
-  width: 280px;
   box-sizing: border-box;
-  background-color: var(--ez-toast__container--background-color);
   border-radius: 6px;
   align-items: center;
   padding: 12px;
   visibility: hidden;
+
+  /*public*/
+  width: var(--ez-toast__container--width);
+  left: var(--ez-toast__container--left);
+  bottom: var(--ez-toast__container--bottom);
+  z-index: var(--ez-toast__container--z-index);
+  background-color: var(--ez-toast__container--background-color);
 }
 
 .message__container {
-  font-family: var(--font-pattern, "Roboto");
+  /*private*/
   text-shadow: 0 0 0 #353535, 0 0 1px transparent;
   color: #FFFFFF;
   font-size: 14px;
@@ -43,14 +52,21 @@
   -webkit-line-clamp: 4;
   display: -webkit-box;
   text-overflow: ellipsis;
+
+  /*public*/
+  font-family: var(--font-pattern, "Roboto");
 }
 
 .message__conteiner--icon {
-  padding-left: var(--ez-toast__icon--padding-left);
+  /*private*/
   width: 80%;
+
+  /*public*/
+  padding-left: var(--ez-toast__icon--padding-left);
 }
 
 .btn-close {
+  /*private*/
   margin-top: 3px;
   display: flex;
   justify-content: flex-end;
@@ -64,51 +80,71 @@
 }
 
 .btn-close::after {
+  /*private*/
   content: '';
   display: flex;
   background-color: #FFFFFF;
   width: 12px;
   height: 12px;
+
+  /*public*/
   -webkit-mask-image: var(--ez-toast__btn__close__image);
   mask-image: var(--ez-toast__btn__close__image);
 }
 
 .toast__container--opened {
+  /*private*/
   animation: fadein 0.5s, fadeout 0.5s 3s;
   visibility: visible;
 }
 
 @-webkit-keyframes fadein {
   from {
-    left: -100px;
+    /*private*/
     opacity: 0;
+
+    /*public*/
+    left: calc(var(--ez-toast__container--left) * -1);
   }
 
   to {
-    left: 100px;
+    /*private*/
     opacity: 1;
+
+    /*public*/
+    left: var(--ez-toast__container--left);
   }
 }
 
 @keyframes fadein {
   from {
-    left: -100px;
+    /*private*/
     opacity: 0;
+
+    /*public*/
+    left: calc(var(--ez-toast__container--left) * -1);
   }
 
   to {
-    left: 100px;
+    /*private*/
     opacity: 1;
+
+    /*public*/
+    left: var(--ez-toast__container--left);
   }
 }
 
 @-webkit-keyframes fadeout {
   from {
-    left: 100px;
+    /*private*/
     opacity: 1;
+
+    /*public*/
+    left: var(--ez-toast__container--left);
   }
 
   to {
+    /*private*/
     bottom: 0;
     opacity: 0;
   }
@@ -116,11 +152,15 @@
 
 @keyframes fadeout {
   from {
-    left: 100px;
+    /*private*/
     opacity: 1;
+
+    /*public*/
+    left: var(--ez-toast__container--left);
   }
 
   to {
+    /*private*/
     bottom: 0;
     opacity: 0;
   }

package/dist/custom-elements/index.d.ts

@@ -74,6 +74,12 @@ export const EzDialog: {
   new (): EzDialog;
 };
 
+interface EzFileItem extends Components.EzFileItem, HTMLElement {}
+export const EzFileItem: {
+  prototype: EzFileItem;
+  new (): EzFileItem;
+};
+
 interface EzFilterInput extends Components.EzFilterInput, HTMLElement {}
 export const EzFilterInput: {
   prototype: EzFilterInput;

package/dist/custom-elements/index.js

@@ -1994,6 +1994,77 @@ let EzDialog$1 = class extends HTMLElement$1 {
   static get style() { return ezDialogCss; }
 };
 
+const ezFileItemCss = ":host{display:flex;width:100%;--ez-file-item--height:42px;--ez-file-item--padding:9px;--ez-file-item--border-radius:var(--border--radius-medium, 12px);--ez-file-item--border-color:var(--color--strokes, #DCE0E8);--ez-file-item--border-style:var(--border--small, 1px solid);--ez-file-item--font-family:var(--font-pattern, Arial);--ez-file-item--font-size:var(--text--medium, 14px);--ez-file-item--font-weight:var(--text-weight--medium, 400);--ez-file-item--color:var(--title--primary, #2B3A54);--ez-file-item__file-size--font-weight:var(--text-weight--large, 600);--ez-file-item__file-size--color:var(--color--primary, #008561);--ez-file-item__background-progress--color:var(--color--primary-300, E2F4EF);--ez-file-item--icon-color:var(--title--primary, #2B3A54)}.box{display:flex;box-sizing:border-box;position:relative;align-items:center;justify-content:space-between;width:100%;padding:var(--ez-file-item--padding);border:var(--ez-file-item--border-color) var(--ez-file-item--border-style);border-radius:var(--ez-file-item--border-radius);height:var(--ez-file-item--height)}.box::before{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;clip-path:inset(2px calc(var(--ez-file-item--upload-progress, 0%) + 2px) 2px 2px round calc(var(--ez-file-item--border-radius) - 4px));background-color:var(--ez-file-item__background-progress--color)}.content{display:flex;align-items:center;z-index:0;overflow:hidden}.file-name{text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-family:var(--ez-file-item--font-family);font-size:var(--ez-file-item--font-size);font-weight:var(--ez-file-item--font-weight);color:var(--ez-file-item--color)}.file-type-icon{flex-shrink:0;--ez-icon--color:var(--ez-file-item--icon-color);padding-right:var(--ez-file-item--padding)}.file-size{padding-left:2px;overflow:hidden;flex-shrink:0;white-space:nowrap;font-family:var(--ez-file-item--font-family);font-size:var(--ez-file-item--font-size);font-weight:var(--ez-file-item__file-size--font-weight);color:var(--ez-file-item__file-size--color)}.btn-remove{cursor:pointer;flex-shrink:0;--ez-icon--color:var(--ez-file-item--icon-color)}";
+
+let EzFileItem$1 = class extends HTMLElement$1 {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.__attachShadow();
+    this.ezClick = createEvent(this, "ezClick", 7);
+    this.ezRemove = createEvent(this, "ezRemove", 7);
+    /**
+     * Define se o usuário pode remover o arquivo que está sendo apresentado.
+     */
+    this.canRemove = true;
+    /**
+     * Percentual de carregamento do arquivo para o servidor.
+     */
+    this.progress = 100;
+  }
+  observeProgress(newProgress) {
+    if (newProgress < 0 || newProgress > 100) {
+      throw new Error("O progresso de upload deve ser um número entre 0 e 100.");
+    }
+    this._element.style.setProperty("--ez-file-item--upload-progress", `${100 - newProgress}%`);
+  }
+  getFileSize() {
+    if (!this.fileSize || this.fileSize === 0) {
+      return "";
+    }
+    return `(${StringUtils$1.formatBytes(this.fileSize)})`;
+  }
+  getIconName() {
+    let extension;
+    if (this.iconName) {
+      return this.iconName;
+    }
+    if (this.fileName.indexOf(".") > -1) {
+      const index = this.fileName.lastIndexOf(".");
+      extension = this.fileName.substring(index);
+    }
+    return FILE_TYPE_ICONS[extension] || DEFAULT_FILE_TYPE_ICON;
+  }
+  render() {
+    this._element.title = `${this.fileName} ${this.getFileSize()}`;
+    ElementIDUtils.addIDInfoIfNotExists(this._element, 'ezFileIcon');
+    return (h("div", { class: "box", onClick: () => this.ezClick.emit(this.fileName) }, h("div", { class: "content" }, h("ez-icon", { "data-element-id": ElementIDUtils.getInternalIDInfo("fileIcon"), class: "file-type-icon", size: "medium", "icon-name": this.getIconName() }), h("label", { class: "file-name" }, this.fileName), h("label", { class: "file-size" }, this.getFileSize())), this.canRemove ?
+      h("ez-icon", { "data-element-id": ElementIDUtils.getInternalIDInfo("remove"), class: "btn-remove", size: "medium", "icon-name": "close", onClick: evt => {
+          this.ezRemove.emit(this.fileName);
+          evt.stopPropagation();
+        } }) : undefined));
+  }
+  get _element() { return this; }
+  static get watchers() { return {
+    "progress": ["observeProgress"]
+  }; }
+  static get style() { return ezFileItemCss; }
+};
+const FILE_TYPE_ICONS = {
+  ".exe": "exe",
+  ".gif": "gif",
+  ".mp3": "mp3",
+  ".mp4": "mp4",
+  ".pdf": "pdf",
+  ".png": "png",
+  ".txt": "txt",
+  ".zip": "zip",
+  ".docx": "docx",
+  ".xlsx": "xlsx",
+  ".pptx": "pptx"
+};
+const DEFAULT_FILE_TYPE_ICON = "generic";
+
 const ezFilterInputCss = ":host{display:block;width:100%}";
 
 let EzFilterInput$1 = class extends HTMLElement$1 {
@@ -118577,7 +118648,7 @@ let EzGrid$1 = class extends HTMLElement$1 {
   static get style() { return ezGridCss; }
 };
 
-const ezIconCss = ":host{display:flex;overflow:hidden;position:relative;--ez-icon--color:var(--icon--color, #ffffff)}svg{display:flex;justify-content:center;align-items:center;fill:var(--ez-icon--color)}.x-small{width:12px;height:12px}.small{width:16px;height:16px}.medium{width:20px;height:20px}.large{width:24px;height:24px}.x-large{width:30px;height:30px}[class^=\"ez-icon-\"],[class*=\" ez-icon-\"]{color:var(--ez-icon--color)}[class^=\"ez-icon-\"],[class*=\" ez-icon-\"]{font-family:'ez-icons' !important;font-size:16px;font-style:normal;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.ez-icon-2chevron-down:before{content:\"\\ea01\"}.ez-icon-2chevron-up:before{content:\"\\ea02\"}.ez-icon-account-outline:before{content:\"\\ea03\"}.ez-icon-account:before{content:\"\\ea04\"}.ez-icon-actions-sprite: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-apps:before{content:\"\\ea0b\"}.ez-icon-arrow_back:before{content:\"\\ea0c\"}.ez-icon-arrow_downward:before{content:\"\\ea0d\"}.ez-icon-balance:before{content:\"\\ea0e\"}.ez-icon-bell-inverted:before{content:\"\\ea0f\"}.ez-icon-bell:before{content:\"\\ea10\"}.ez-icon-boleto:before{content:\"\\ea11\"}.ez-icon-business-center:before{content:\"\\ea12\"}.ez-icon-calendar-clock:before{content:\"\\ea13\"}.ez-icon-calendar:before{content:\"\\ea14\"}.ez-icon-cash-remove:before{content:\"\\ea15\"}.ez-icon-check-circle-inverted:before{content:\"\\ea16\"}.ez-icon-check-circle:before{content:\"\\ea17\"}.ez-icon-check:before{content:\"\\ea18\"}.ez-icon-chevron-down:before{content:\"\\ea19\"}.ez-icon-chevron-left:before{content:\"\\ea1a\"}.ez-icon-chevron-right:before{content:\"\\ea1b\"}.ez-icon-chevron-up:before{content:\"\\ea1c\"}.ez-icon-circle--medium:before{content:\"\\ea1d\"}.ez-icon-circle:before{content:\"\\ea1e\"}.ez-icon-cleaning:before{content:\"\\ea1f\"}.ez-icon-clipboard:before{content:\"\\ea20\"}.ez-icon-close:before{content:\"\\ea21\"}.ez-icon-cobrar:before{content:\"\\ea22\"}.ez-icon-configuration:before{content:\"\\ea23\"}.ez-icon-copy:before{content:\"\\ea24\"}.ez-icon-credit_card:before{content:\"\\ea25\"}.ez-icon-crop:before{content:\"\\ea26\"}.ez-icon-custom:before{content:\"\\ea27\"}.ez-icon-delete:before{content:\"\\ea28\"}.ez-icon-description:before{content:\"\\ea29\"}.ez-icon-dot-notification:before{content:\"\\ea2a\"}.ez-icon-dots-horizontal:before{content:\"\\ea2b\"}.ez-icon-dots-vertical:before{content:\"\\ea2c\"}.ez-icon-drag-indicator:before{content:\"\\ea2d\"}.ez-icon-dual-chevron-down:before{content:\"\\ea2e\"}.ez-icon-dual-chevron-up:before{content:\"\\ea2f\"}.ez-icon-edit-file:before{content:\"\\ea30\"}.ez-icon-edit-table:before{content:\"\\ea31\"}.ez-icon-edit-time:before{content:\"\\ea32\"}.ez-icon-edit:before{content:\"\\ea33\"}.ez-icon-email:before{content:\"\\ea34\"}.ez-icon-expand:before{content:\"\\ea35\"}.ez-icon-extrato:before{content:\"\\ea36\"}.ez-icon-eye-off:before{content:\"\\ea37\"}.ez-icon-eye:before{content:\"\\ea38\"}.ez-icon-favorite:before{content:\"\\ea39\"}.ez-icon-file-download:before{content:\"\\ea3a\"}.ez-icon-file-upload:before{content:\"\\ea3b\"}.ez-icon-filter:before{content:\"\\ea3c\"}.ez-icon-find-file:before{content:\"\\ea3d\"}.ez-icon-find-page:before{content:\"\\ea3e\"}.ez-icon-format-color-fill:before{content:\"\\ea3f\"}.ez-icon-graph_bar:before{content:\"\\ea40\"}.ez-icon-handshake:before{content:\"\\ea41\"}.ez-icon-help-inverted:before{content:\"\\ea42\"}.ez-icon-help:before{content:\"\\ea43\"}.ez-icon-home:before{content:\"\\ea44\"}.ez-icon-icons104:before{content:\"\\ea45\"}.ez-icon-language:before{content:\"\\ea46\"}.ez-icon-launch:before{content:\"\\ea47\"}.ez-icon-lightbulb:before{content:\"\\ea48\"}.ez-icon-list:before{content:\"\\ea49\"}.ez-icon-location:before{content:\"\\ea4a\"}.ez-icon-lock-outline:before{content:\"\\ea4b\"}.ez-icon-lock:before{content:\"\\ea4c\"}.ez-icon-menu:before{content:\"\\ea4d\"}.ez-icon-mid:before{content:\"\\ea4e\"}.ez-icon-minus:before{content:\"\\ea4f\"}.ez-icon-money-off:before{content:\"\\ea50\"}.ez-icon-money:before{content:\"\\ea51\"}.ez-icon-more:before{content:\"\\ea52\"}.ez-icon-north-west:before{content:\"\\ea53\"}.ez-icon-number:before{content:\"\\ea54\"}.ez-icon-ordem-ascendente:before{content:\"\\ea55\"}.ez-icon-ordem-descendente:before{content:\"\\ea56\"}.ez-icon-parcelar:before{content:\"\\ea57\"}.ez-icon-pause:before{content:\"\\ea58\"}.ez-icon-payments:before{content:\"\\ea59\"}.ez-icon-play:before{content:\"\\ea5a\"}.ez-icon-plus:before{content:\"\\ea5b\"}.ez-icon-power:before{content:\"\\ea5c\"}.ez-icon-print:before{content:\"\\ea5d\"}.ez-icon-push-pin:before{content:\"\\ea5e\"}.ez-icon-receipt:before{content:\"\\ea5f\"}.ez-icon-restore:before{content:\"\\ea60\"}.ez-icon-return:before{content:\"\\ea61\"}.ez-icon-save:before{content:\"\\ea62\"}.ez-icon-search:before{content:\"\\ea63\"}.ez-icon-settings-inverted:before{content:\"\\ea64\"}.ez-icon-settings:before{content:\"\\ea65\"}.ez-icon-share:before{content:\"\\ea66\"}.ez-icon-shield:before{content:\"\\ea67\"}.ez-icon-south-east:before{content:\"\\ea68\"}.ez-icon-sync:before{content:\"\\ea69\"}.ez-icon-table:before{content:\"\\ea6a\"}.ez-icon-text:before{content:\"\\ea6b\"}.ez-icon-timeline:before{content:\"\\ea6c\"}.ez-icon-timer-outline:before{content:\"\\ea6d\"}.ez-icon-tune:before{content:\"\\ea6e\"}.ez-icon-un-pin:before{content:\"\\ea6f\"}.ez-icon-unfold_less:before{content:\"\\ea70\"}.ez-icon-unfold_more:before{content:\"\\ea71\"}.ez-icon-user-circle:before{content:\"\\ea72\"}.ez-icon-warning-outline:before{content:\"\\ea73\"}.ez-icon-warning_triangle:before{content:\"\\ea74\"}.ez-icon-whatshot:before{content:\"\\ea75\"}.x-small--font{font-size:12px}.small--font{font-size:16px}.medium--font{font-size:20px}.large--font{font-size:24px}.x-large--font{font-size:30px}";
+const ezIconCss = ":host{display:flex;overflow:hidden;position:relative;--ez-icon--color:var(--icon--color, #ffffff)}svg{display:flex;justify-content:center;align-items:center;fill:var(--ez-icon--color)}.x-small{width:12px;height:12px}.small{width:16px;height:16px}.medium{width:20px;height:20px}.large{width:24px;height:24px}.x-large{width:30px;height:30px}[class^=\"ez-icon-\"],[class*=\" ez-icon-\"]{color:var(--ez-icon--color)}[class^=\"ez-icon-\"],[class*=\" ez-icon-\"]{font-family:'ez-icons' !important;font-size:16px;font-style:normal;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.ez-icon-2chevron-down:before{content:\"\\ea01\"}.ez-icon-2chevron-up:before{content:\"\\ea02\"}.ez-icon-account-outline:before{content:\"\\ea03\"}.ez-icon-account:before{content:\"\\ea04\"}.ez-icon-actions-sprite-v1: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-antecipação:before{content:\"\\ea0b\"}.ez-icon-apps:before{content:\"\\ea0c\"}.ez-icon-arrow_back:before{content:\"\\ea0d\"}.ez-icon-arrow_downward:before{content:\"\\ea0e\"}.ez-icon-baixa:before{content:\"\\ea0f\"}.ez-icon-balance:before{content:\"\\ea10\"}.ez-icon-bell-inverted:before{content:\"\\ea11\"}.ez-icon-bell:before{content:\"\\ea12\"}.ez-icon-boleto:before{content:\"\\ea13\"}.ez-icon-business-center:before{content:\"\\ea14\"}.ez-icon-calendar-clock:before{content:\"\\ea15\"}.ez-icon-calendar:before{content:\"\\ea16\"}.ez-icon-cash-remove:before{content:\"\\ea17\"}.ez-icon-check-circle-inverted:before{content:\"\\ea18\"}.ez-icon-check-circle:before{content:\"\\ea19\"}.ez-icon-check:before{content:\"\\ea1a\"}.ez-icon-chevron-down:before{content:\"\\ea1b\"}.ez-icon-chevron-left:before{content:\"\\ea1c\"}.ez-icon-chevron-right:before{content:\"\\ea1d\"}.ez-icon-chevron-up:before{content:\"\\ea1e\"}.ez-icon-circle--medium:before{content:\"\\ea1f\"}.ez-icon-circle:before{content:\"\\ea20\"}.ez-icon-cleaning:before{content:\"\\ea21\"}.ez-icon-clipboard:before{content:\"\\ea22\"}.ez-icon-close:before{content:\"\\ea23\"}.ez-icon-cobrar:before{content:\"\\ea24\"}.ez-icon-code:before{content:\"\\ea25\"}.ez-icon-configuration:before{content:\"\\ea26\"}.ez-icon-copy:before{content:\"\\ea27\"}.ez-icon-credit_card:before{content:\"\\ea28\"}.ez-icon-crop:before{content:\"\\ea29\"}.ez-icon-custom:before{content:\"\\ea2a\"}.ez-icon-delete:before{content:\"\\ea2b\"}.ez-icon-description:before{content:\"\\ea2c\"}.ez-icon-dividir:before{content:\"\\ea2d\"}.ez-icon-docx:before{content:\"\\ea2e\"}.ez-icon-dot-notification:before{content:\"\\ea2f\"}.ez-icon-dots-horizontal:before{content:\"\\ea30\"}.ez-icon-dots-vertical:before{content:\"\\ea31\"}.ez-icon-drag-indicator:before{content:\"\\ea32\"}.ez-icon-dual-chevron-down:before{content:\"\\ea33\"}.ez-icon-dual-chevron-up:before{content:\"\\ea34\"}.ez-icon-edit-file:before{content:\"\\ea35\"}.ez-icon-edit-table:before{content:\"\\ea36\"}.ez-icon-edit-time:before{content:\"\\ea37\"}.ez-icon-edit:before{content:\"\\ea38\"}.ez-icon-email:before{content:\"\\ea39\"}.ez-icon-estorno:before{content:\"\\ea3a\"}.ez-icon-exe:before{content:\"\\ea3b\"}.ez-icon-expand:before{content:\"\\ea3c\"}.ez-icon-expandir_card:before{content:\"\\ea3d\"}.ez-icon-extrato:before{content:\"\\ea3e\"}.ez-icon-eye-off:before{content:\"\\ea3f\"}.ez-icon-eye:before{content:\"\\ea40\"}.ez-icon-favorite:before{content:\"\\ea41\"}.ez-icon-figma:before{content:\"\\ea42\"}.ez-icon-file-download:before{content:\"\\ea43\"}.ez-icon-file-upload:before{content:\"\\ea44\"}.ez-icon-filter:before{content:\"\\ea45\"}.ez-icon-find-file:before{content:\"\\ea46\"}.ez-icon-find-page:before{content:\"\\ea47\"}.ez-icon-format-color-fill:before{content:\"\\ea48\"}.ez-icon-generic:before{content:\"\\ea49\"}.ez-icon-gif:before{content:\"\\ea4a\"}.ez-icon-graph_bar:before{content:\"\\ea4b\"}.ez-icon-handshake:before{content:\"\\ea4c\"}.ez-icon-help-inverted:before{content:\"\\ea4d\"}.ez-icon-help:before{content:\"\\ea4e\"}.ez-icon-hide_menu:before{content:\"\\ea4f\"}.ez-icon-home:before{content:\"\\ea50\"}.ez-icon-icons104:before{content:\"\\ea51\"}.ez-icon-language:before{content:\"\\ea52\"}.ez-icon-launch:before{content:\"\\ea53\"}.ez-icon-lightbulb:before{content:\"\\ea54\"}.ez-icon-list:before{content:\"\\ea55\"}.ez-icon-location:before{content:\"\\ea56\"}.ez-icon-lock-outline:before{content:\"\\ea57\"}.ez-icon-lock:before{content:\"\\ea58\"}.ez-icon-menu:before{content:\"\\ea59\"}.ez-icon-mid:before{content:\"\\ea5a\"}.ez-icon-minus:before{content:\"\\ea5b\"}.ez-icon-money-off:before{content:\"\\ea5c\"}.ez-icon-money:before{content:\"\\ea5d\"}.ez-icon-more:before{content:\"\\ea5e\"}.ez-icon-mp3:before{content:\"\\ea5f\"}.ez-icon-mp4:before{content:\"\\ea60\"}.ez-icon-north-west:before{content:\"\\ea61\"}.ez-icon-number:before{content:\"\\ea62\"}.ez-icon-ordem-ascendente:before{content:\"\\ea63\"}.ez-icon-ordem-descendente:before{content:\"\\ea64\"}.ez-icon-parcelar:before{content:\"\\ea65\"}.ez-icon-pause:before{content:\"\\ea66\"}.ez-icon-payments:before{content:\"\\ea67\"}.ez-icon-pdf:before{content:\"\\ea68\"}.ez-icon-play:before{content:\"\\ea69\"}.ez-icon-plus:before{content:\"\\ea6a\"}.ez-icon-png:before{content:\"\\ea6b\"}.ez-icon-power:before{content:\"\\ea6c\"}.ez-icon-pptx:before{content:\"\\ea6d\"}.ez-icon-print:before{content:\"\\ea6e\"}.ez-icon-push-pin:before{content:\"\\ea6f\"}.ez-icon-rateio:before{content:\"\\ea70\"}.ez-icon-receipt:before{content:\"\\ea71\"}.ez-icon-recolher_card:before{content:\"\\ea72\"}.ez-icon-restore:before{content:\"\\ea73\"}.ez-icon-return:before{content:\"\\ea74\"}.ez-icon-save:before{content:\"\\ea75\"}.ez-icon-search:before{content:\"\\ea76\"}.ez-icon-settings-inverted:before{content:\"\\ea77\"}.ez-icon-settings:before{content:\"\\ea78\"}.ez-icon-share:before{content:\"\\ea79\"}.ez-icon-shield:before{content:\"\\ea7a\"}.ez-icon-show_menu:before{content:\"\\ea7b\"}.ez-icon-south-east:before{content:\"\\ea7c\"}.ez-icon-sync:before{content:\"\\ea7d\"}.ez-icon-table:before{content:\"\\ea7e\"}.ez-icon-tag_code:before{content:\"\\ea7f\"}.ez-icon-text:before{content:\"\\ea80\"}.ez-icon-timeline:before{content:\"\\ea81\"}.ez-icon-timer-outline:before{content:\"\\ea82\"}.ez-icon-tune:before{content:\"\\ea83\"}.ez-icon-txt:before{content:\"\\ea84\"}.ez-icon-un-pin:before{content:\"\\ea85\"}.ez-icon-unfold_less:before{content:\"\\ea86\"}.ez-icon-unfold_more:before{content:\"\\ea87\"}.ez-icon-user-circle:before{content:\"\\ea88\"}.ez-icon-warning-outline:before{content:\"\\ea89\"}.ez-icon-warning_triangle:before{content:\"\\ea8a\"}.ez-icon-whatshot:before{content:\"\\ea8b\"}.ez-icon-xlsx:before{content:\"\\ea8c\"}.ez-icon-zip:before{content:\"\\ea8d\"}.x-small--font{font-size:12px}.small--font{font-size:16px}.medium--font{font-size:20px}.large--font{font-size:24px}.x-large--font{font-size:30px}";
 
 let EzIcon$1 = class extends HTMLElement$1 {
   constructor() {
@@ -120838,7 +120909,7 @@ let EzTimeInput$1 = class extends HTMLElement$1 {
   static get style() { return ezTimeInputCss; }
 };
 
-const ezToastCss = ":host{--ez-toast__btn__close__image:url('data:image/svg+xml;utf8,<svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" xmlns=\"http://www.w3.org/2000/svg%22%3E<path d=\"M 7.0060773,5.995511 11.461972,1.5397722 c 0.132856,-0.1328413 0.207547,-0.3130253 0.207547,-0.5009046 0,-0.18786999 -0.07469,-0.3680541 -0.207547,-0.5009048 -0.132857,-0.13284126 -0.31302,-0.20748126 -0.500927,-0.20748126 -0.187812,0 -0.36807,0.07464 -0.500926,0.20748126 L 6.0042244,4.9937015 1.5482921,0.5379628 C 1.4154357,0.40512154 1.2352533,0.33048154 1.0473657,0.33048154 c -0.18787813,0 -0.36807,0.07464 -0.50092647,0.20748126 -0.13285646,0.1328507 -0.20749026,0.31303481 -0.20749026,0.5009048 0,0.1878793 0.0746338,0.3680633 0.20749026,0.5009046 L 5.0023715,5.995511 0.54643923,10.452213 c -0.0676086,0.06534 -0.12151598,0.14352 -0.15859681,0.229916 -0.0370714,0.08639 -0.0565645,0.1794 -0.0573369,0.27335 -7.724e-4,0.09404 0.0171873,0.187331 0.0528423,0.274293 0.0356455,0.08705 0.0882688,0.166087 0.15479148,0.23256 0.0665321,0.06648 0.14562277,0.11897 0.2326735,0.154567 0.0870507,0.0356 0.18031463,0.05344 0.2743433,0.05259 0.094029,-8.5e-4 0.1869528,-0.02049 0.2733331,-0.0576 0.08639,-0.0372 0.1645078,-0.09121 0.2298029,-0.158817 L 6.0042244,6.9973204 10.460119,11.453078 c 0.132856,0.132851 0.313114,0.207444 0.500926,0.207444 0.187907,0 0.36807,-0.07459 0.500927,-0.207444 0.132856,-0.13285 0.207547,-0.313006 0.207547,-0.500904 0,-0.187898 -0.07469,-0.368054 -0.207547,-0.500905 z\"/></svg>');--ez-toast__container-z-index:var(--more-visible, 2);--ez-toast__container--background-color:var(--color--secondary, #383c45);--ez-toast__icon--padding-left:var(--space--small, 6px)}.toast__container{position:fixed;display:flex;bottom:100px;z-index:var(--ez-toast__container-z-index);left:100px;width:280px;box-sizing:border-box;background-color:var(--ez-toast__container--background-color);border-radius:6px;align-items:center;padding:12px;visibility:hidden}.message__container{font-family:var(--font-pattern, \"Roboto\");text-shadow:0 0 0 #353535, 0 0 1px transparent;color:#FFFFFF;font-size:14px;width:90%;overflow:hidden;hyphens:auto;height:auto;-webkit-box-orient:vertical;-webkit-line-clamp:4;display:-webkit-box;text-overflow:ellipsis}.message__conteiner--icon{padding-left:var(--ez-toast__icon--padding-left);width:80%}.btn-close{margin-top:3px;display:flex;justify-content:flex-end;align-self:flex-start;padding:0;outline:none;width:10%;border:none;background-color:unset;cursor:pointer}.btn-close::after{content:'';display:flex;background-color:#FFFFFF;width:12px;height:12px;-webkit-mask-image:var(--ez-toast__btn__close__image);mask-image:var(--ez-toast__btn__close__image)}.toast__container--opened{animation:fadein 0.5s, fadeout 0.5s 3s;visibility:visible}@-webkit-keyframes fadein{from{left:-100px;opacity:0}to{left:100px;opacity:1}}@keyframes fadein{from{left:-100px;opacity:0}to{left:100px;opacity:1}}@-webkit-keyframes fadeout{from{left:100px;opacity:1}to{bottom:0;opacity:0}}@keyframes fadeout{from{left:100px;opacity:1}to{bottom:0;opacity:0}}";
+const ezToastCss = ":host{--ez-toast__btn__close__image:url('data:image/svg+xml;utf8,<svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" xmlns=\"http://www.w3.org/2000/svg%22%3E<path d=\"M 7.0060773,5.995511 11.461972,1.5397722 c 0.132856,-0.1328413 0.207547,-0.3130253 0.207547,-0.5009046 0,-0.18786999 -0.07469,-0.3680541 -0.207547,-0.5009048 -0.132857,-0.13284126 -0.31302,-0.20748126 -0.500927,-0.20748126 -0.187812,0 -0.36807,0.07464 -0.500926,0.20748126 L 6.0042244,4.9937015 1.5482921,0.5379628 C 1.4154357,0.40512154 1.2352533,0.33048154 1.0473657,0.33048154 c -0.18787813,0 -0.36807,0.07464 -0.50092647,0.20748126 -0.13285646,0.1328507 -0.20749026,0.31303481 -0.20749026,0.5009048 0,0.1878793 0.0746338,0.3680633 0.20749026,0.5009046 L 5.0023715,5.995511 0.54643923,10.452213 c -0.0676086,0.06534 -0.12151598,0.14352 -0.15859681,0.229916 -0.0370714,0.08639 -0.0565645,0.1794 -0.0573369,0.27335 -7.724e-4,0.09404 0.0171873,0.187331 0.0528423,0.274293 0.0356455,0.08705 0.0882688,0.166087 0.15479148,0.23256 0.0665321,0.06648 0.14562277,0.11897 0.2326735,0.154567 0.0870507,0.0356 0.18031463,0.05344 0.2743433,0.05259 0.094029,-8.5e-4 0.1869528,-0.02049 0.2733331,-0.0576 0.08639,-0.0372 0.1645078,-0.09121 0.2298029,-0.158817 L 6.0042244,6.9973204 10.460119,11.453078 c 0.132856,0.132851 0.313114,0.207444 0.500926,0.207444 0.187907,0 0.36807,-0.07459 0.500927,-0.207444 0.132856,-0.13285 0.207547,-0.313006 0.207547,-0.500904 0,-0.187898 -0.07469,-0.368054 -0.207547,-0.500905 z\"/></svg>');--ez-toast__container--z-index:var(--more-visible, 2);--ez-toast__container--background-color:var(--color--secondary, #383c45);--ez-toast__container--left:var(--space--large, 24px);--ez-toast__container--bottom:var(--space--large, 24px);--ez-toast__container--width:400px;--ez-toast__icon--padding-left:var(--space--small, 6px)}.toast__container{position:fixed;display:flex;box-sizing:border-box;border-radius:6px;align-items:center;padding:12px;visibility:hidden;width:var(--ez-toast__container--width);left:var(--ez-toast__container--left);bottom:var(--ez-toast__container--bottom);z-index:var(--ez-toast__container--z-index);background-color:var(--ez-toast__container--background-color)}.message__container{text-shadow:0 0 0 #353535, 0 0 1px transparent;color:#FFFFFF;font-size:14px;width:90%;overflow:hidden;hyphens:auto;height:auto;-webkit-box-orient:vertical;-webkit-line-clamp:4;display:-webkit-box;text-overflow:ellipsis;font-family:var(--font-pattern, \"Roboto\")}.message__conteiner--icon{width:80%;padding-left:var(--ez-toast__icon--padding-left)}.btn-close{margin-top:3px;display:flex;justify-content:flex-end;align-self:flex-start;padding:0;outline:none;width:10%;border:none;background-color:unset;cursor:pointer}.btn-close::after{content:'';display:flex;background-color:#FFFFFF;width:12px;height:12px;-webkit-mask-image:var(--ez-toast__btn__close__image);mask-image:var(--ez-toast__btn__close__image)}.toast__container--opened{animation:fadein 0.5s, fadeout 0.5s 3s;visibility:visible}@-webkit-keyframes fadein{from{opacity:0;left:calc(var(--ez-toast__container--left) * -1)}to{opacity:1;left:var(--ez-toast__container--left)}}@keyframes fadein{from{opacity:0;left:calc(var(--ez-toast__container--left) * -1)}to{opacity:1;left:var(--ez-toast__container--left)}}@-webkit-keyframes fadeout{from{opacity:1;left:var(--ez-toast__container--left)}to{bottom:0;opacity:0}}@keyframes fadeout{from{opacity:1;left:var(--ez-toast__container--left)}to{bottom:0;opacity:0}}";
 
 let EzToast$1 = class extends HTMLElement$1 {
   constructor() {
@@ -121401,6 +121472,7 @@ const EzComboBox = /*@__PURE__*/proxyCustomElement(EzComboBox$1, [1,"ez-combo-bo
 const EzDateInput = /*@__PURE__*/proxyCustomElement(EzDateInput$1, [1,"ez-date-input",{"label":[513],"value":[1040],"enabled":[516],"errorMessage":[1537,"error-message"],"mode":[513]}]);
 const EzDateTimeInput = /*@__PURE__*/proxyCustomElement(EzDateTimeInput$1, [1,"ez-date-time-input",{"label":[513],"value":[1040],"enabled":[516],"errorMessage":[1537,"error-message"],"showSeconds":[516,"show-seconds"],"mode":[513]}]);
 const EzDialog = /*@__PURE__*/proxyCustomElement(EzDialog$1, [1,"ez-dialog",{"confirm":[1028],"dialogType":[1025,"dialog-type"],"message":[1025],"opened":[1540],"personalizedIconPath":[1025,"personalized-icon-path"],"ezTitle":[1025,"ez-title"]}]);
+const EzFileItem = /*@__PURE__*/proxyCustomElement(EzFileItem$1, [1,"ez-file-item",{"canRemove":[4,"can-remove"],"fileName":[1,"file-name"],"iconName":[1,"icon-name"],"fileSize":[2,"file-size"],"progress":[2]}]);
 const EzFilterInput = /*@__PURE__*/proxyCustomElement(EzFilterInput$1, [1,"ez-filter-input",{"label":[1],"value":[1537],"enabled":[4],"errorMessage":[1537,"error-message"],"restrict":[1],"mode":[513]}]);
 const EzForm = /*@__PURE__*/proxyCustomElement(EzForm$1, [0,"ez-form",{"dataUnit":[1040],"config":[16],"recordsValidator":[16]}]);
 const EzGrid = /*@__PURE__*/proxyCustomElement(EzGrid$1, [6,"ez-grid",{"multipleSelection":[4,"multiple-selection"],"config":[1040],"serverUrl":[1,"server-url"],"dataUnit":[16],"statusResolver":[16],"_paginationInfo":[32],"_paginationChangedByKeyboard":[32]},[[0,"ezSelectionChange","onSelectionChange"]]]);
@@ -121438,6 +121510,7 @@ const defineCustomElements = (opts) => {
   EzDateInput,
   EzDateTimeInput,
   EzDialog,
+  EzFileItem,
   EzFilterInput,
   EzForm,
   EzGrid,
@@ -121468,4 +121541,4 @@ const defineCustomElements = (opts) => {
   }
 };
 
-export { EzActionsButton, EzApplication, EzButton, EzCalendar, EzCardItem, EzCheck, EzChip, EzCollapsibleBox, EzComboBox, EzDateInput, EzDateTimeInput, EzDialog, EzFilterInput, EzForm, EzGrid, EzIcon, EzList, EzLoadingBar, EzModal, EzModalContainer, EzNumberInput, EzPopover, EzPopup, EzRadioButton, EzScroller, EzSearch, EzTabselector, EzTextArea, EzTextEdit, EzTextInput, EzTimeInput, EzToast, EzUpload, EzViewStack, defineCustomElements };
+export { EzActionsButton, EzApplication, EzButton, EzCalendar, EzCardItem, EzCheck, EzChip, EzCollapsibleBox, EzComboBox, EzDateInput, EzDateTimeInput, EzDialog, EzFileItem, EzFilterInput, EzForm, EzGrid, EzIcon, EzList, EzLoadingBar, EzModal, EzModalContainer, EzNumberInput, EzPopover, EzPopup, EzRadioButton, EzScroller, EzSearch, EzTabselector, EzTextArea, EzTextEdit, EzTextInput, EzTimeInput, EzToast, EzUpload, EzViewStack, defineCustomElements };