@sankhyalabs/ezui 1.1.77 → 1.1.80

package/dist/cjs/ez-calendar_13.cjs.entry.js

@@ -0,0 +1,2421 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-2003dec4.js');
+const index$1 = require('./index-a2266984.js');
+const FloatingManager = require('./FloatingManager-6cfeb947.js');
+const CSSVarsUtils = require('./CSSVarsUtils-66e86394.js');
+const DateUtils = require('./DateUtils-716769e0.js');
+
+const ezCalendarCss = ":host{--ez-calendar--font-family:var(--font-pattern, Arial);--ez-calendar--color:var(--title--primary, #626e82);--ez-calendar--text-shadow:var(--text-shadow, 0 0 0 #353535, 0 0 1px transparent);--ez-calendar__body--background-color:var(--background--xlight, #FFF);--ez-calendar__Time--background-color:var(--background--xlight, #FAFAFA);--ez-calendar__body--padding:var(--space--medium, 12px);--ez-calendar__body--border-radius:var(--border--radius-medium, 12px);--ez-calendar__body--shadow:var(--shadow, 0px 0px 16px 0px #000);--ez-calendar__header-line--stroke:2px;--ez-calendar__header-line--color:var(--color--strokes, #C0C0C0);--ez-calendar__nav-btn--fill:var(--text--primary, #008561);--ez-calendar__nav-btn--hover--fill:var(--color--primary, #350404);--ez-calendar__nav-btn--width:10px;--ez-calendar__nav-btn--height:16px;--ez-calendar__nav-btn--previous-image:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"16px\" width=\"10px\"><path d=\"M 9.7808475,13.860393 3.9204526,8.0000004 9.7808475,2.0624965 7.9301965,0.28895552 0.21915255,8.0000004 7.9301965,15.711044 Z\"/></svg>');--ez-calendar__nav-btn--next-image:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"16px\" width=\"10px\"><path d=\"M 0.21915251,13.860393 6.0795475,8.0000007 0.21915251,2.0624968 2.0698036,0.28895588 9.7808475,8.0000007 2.0698036,15.711044 Z\"/></svg>');--ez-calendar__cell--margin:0px var(--space--small, 12px);--ez-calendar__cell--width:var(--space--large, 24px);--ez-calendar__cell--padding:var(--space--extra-small, 3px) 0px;--ez-calendar__cell--border-radius:var(--border--radius-small, 6px);--ez-calendar__cell--over--background-color:var(--color--strokes, #E2F4EF);--ez-calendar__cell--outset--color:var(--color--strokes, #C0C0C0);--ez-calendar__cell--selected--background-color:var(--color--primary, #008561);--ez-calendar__cell--selected--color:var(--color--inverted, #FFF);--ez-calendar__btn-today--color:var(--color--primary);--ez-calendar__btn-today--hover--background-color:var(--color--strokes, #E2F4EF);--ez-calendar__btn-today--border-radius:var(--border--radius-small, 6px);position:relative;display:flex;user-select:none}.calendar{z-index:var(--more-visible, 2);display:flex;flex-direction:column;background-color:var(--ez-calendar__body--background-color);padding:var(--ez-calendar__body--padding);border-radius:var(--ez-calendar__body--border-radius);box-shadow:var(--ez-calendar__body--shadow)}.calendar__header{display:flex;justify-content:space-between;padding-bottom:var(--space--medium, 12px);margin:var(--space--small, 6px) var(--space--, 12px);font-family:var(--ez-calendar--font-family);color:var(--ez-calendar--color);text-shadow:var(--ez-calendar--text-shadow);border-bottom:solid var(--ez-calendar__header-line--stroke) var(--ez-calendar__header-line--color)}.calendar__btn-next,.calendar__btn-previous{outline:none;border:none;background-color:unset;cursor:pointer;padding:0px}.calendar__btn-next::after,.calendar__btn-previous::after{content:'';display:flex;background-color:var(--ez-calendar__nav-btn--fill);width:var(--ez-calendar__nav-btn--width);height:var(--ez-calendar__nav-btn--height)}.calendar__btn-previous::after{-webkit-mask-image:var(--ez-calendar__nav-btn--previous-image);mask-image:var(--ez-calendar__nav-btn--previous-image)}.calendar__btn-next::after{-webkit-mask-image:var(--ez-calendar__nav-btn--next-image);mask-image:var(--ez-calendar__nav-btn--next-image)}.calendar__btn-next:hover::after,.calendar__btn-previous:hover::after{background-color:var(--ez-calendar__nav-btn--hover--fill)}.calendar__lbl-month{font-weight:var(--text-weight--large, 600);font-size:var(--title--medium, 16px);font-family:var(--ez-calendar--font-family);color:var(--ez-calendar--color);text-shadow:var(--ez-calendar--text-shadow)}.calendar__line{display:flex;padding:0px;margin:0px}.calendar__cell{display:flex;justify-content:center;align-content:center;cursor:pointer;font-size:var(--text--small, 12px);font-family:var(--ez-calendar--font-family);color:var(--ez-calendar--color);text-shadow:var(--ez-calendar--text-shadow);padding:var(--ez-calendar__cell--padding);margin:var(--ez-calendar__cell--margin);min-width:var(--ez-calendar__cell--width);border-radius:var(--ez-calendar__cell--border-radius)}.calendar__cell:hover{background-color:var(--ez-calendar__cell--over--background-color)}.calendar__cell--secondary{color:var(--ez-calendar__cell--outset--color)}.calendar__cell--unselectable:hover{background-color:unset;border-radius:unset;cursor:unset}.calendar__cell--unselectable{font-weight:var(--text-weight--large, 600);font-family:var(--ez-calendar--font-family);color:var(--ez-calendar--color);text-shadow:var(--ez-calendar--text-shadow)}.calendar__cell--selected,.calendar__cell--selected:hover{background-color:var(--ez-calendar__cell--selected--background-color);color:var(--ez-calendar__cell--selected--color)}.calendar__body{padding:var(--space--small, 6px) 0px}.calendar__footer{display:flex;flex-direction:column}.calendar__btn-today{border:none;background-color:unset;cursor:pointer;font-weight:var(--text-weight--large, 600);font-size:var(--title--small);padding:var(--space--extra-small, 6px);font-family:var(--ez-calendar--font-family);text-shadow:var(--ez-calendar--text-shadow);color:var(--ez-calendar__btn-today--color);border-radius:var(--ez-calendar__btn-today--border-radius)}.calendar__btn-today:hover{background-color:var(--ez-calendar__btn-today--hover--background-color)}section{display:flex}.calendarTime{margin-left:-10px;display:flex;flex-direction:column;padding:12px 6px;padding-left:16px;padding-bottom:0px;background-color:var(--ez-calendar__Time--background-color);border-top-right-radius:var(--ez-calendar__body--border-radius);border-bottom-right-radius:var(--ez-calendar__body--border-radius);box-shadow:var(--ez-calendar__body--shadow)}.calendar__column{height:180px;padding:0px;margin:0px;overflow:auto}.calendar__column::-webkit-scrollbar{width:0px;max-width:0px;min-width:0px}.calendarTime__header{padding-left:6px;padding-right:6px;display:flex;justify-content:space-between;padding-bottom:var(--space--medium, 12px);margin:var(--space--small, 6px) var(--space--, 12px);font-weight:var(--text-weight--large, 600);font-size:var(--title--medium, 16px);font-family:var(--ez-calendar--font-family);color:var(--ez-calendar--color);text-shadow:var(--ez-calendar--text-shadow);border-bottom:solid var(--ez-calendar__header-line--stroke) var(--ez-calendar__header-line--color);font-family:var(--ez-calendar--font-family);color:var(--ez-calendar--color);text-shadow:var(--ez-calendar--text-shadow)}.separatorTime{color:#A2ABB9}.endHidden{-webkit-mask-image:linear-gradient(180deg, #000 calc(100% - 48px), transparent 100%)}";
+
+let EzCalendar = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.ezChange = index.createEvent(this, "ezChange", 7);
+    this._firstRender = true;
+    this._todayLabel = "Hoje";
+    this._weekDayLabels = ["D", "S", "T", "Q", "Q", "S", "S"];
+    this._monthLabels = ["Janeiro", "Fevereiro", "Março", "Abril", "Maio", "Junho", "Julho", "Agosto", "Setembro", "Outubro", "Novembro", "Dezembro"];
+    this._hoursLabel = ["00", "01", "02", "03", "04", "05", "06", "07", "08", "09", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22", "23"];
+    this._minutosLabel = ["00", "01", "02", "03", "04", "05", "06", "07", "08", "09", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22", "23", "25", "26", "27", "28", "29", "30", "31", "32", "33", "34", "35", "36", "37", "38", "39", "40", "41", "42", "43", "44", "45", "46", "47", "48", "49", "50", "51", "52", "53", "54", "55", "56", "57", "58", "59"];
+    /**
+     * A data selecionada no calendário
+     */
+    this.value = new Date();
+    /**
+     * No modo floating o calendário só se tornará visível
+     * quando o método show() for acionado.
+     */
+    this.floating = false;
+    /**
+     * Exibe ou não as horas e minutos no calendario
+     */
+    this.time = false;
+    /**
+    * Exibe ou não os segundos no calendario
+    */
+    this.showSeconds = false;
+  }
+  /**
+   * Usado no modo floating. Faz com que o componente seja exibido.
+   * É possível determinar ajustes de posicionamento através dos parâmetros
+   * top, left, bottom e right. Esses parâmetros devem ser informados como
+   * strings no formato css.
+   */
+  async show(top, left, bottom, right) {
+    if (this.floating) {
+      this._floatingID = FloatingManager.FloatingManager.float(this._box, this._container, { autoClose: true, top, left, bottom, right });
+      window.requestAnimationFrame(() => {
+        this._box.scrollIntoView({ behavior: "smooth", block: "nearest", inline: "nearest" });
+      });
+    }
+  }
+  /**
+  * Método necessário para ajustar o posicionamento do calendar acima ou abaixo do ez-date-input conforme a disponibilidade de espaço.
+  */
+  async fitVertical(topOffset, bottomOffset) {
+    const neededHeight = this._container.getBoundingClientRect().bottom + this._calendarHeight;
+    const availableBottom = (window.innerHeight || document.documentElement.clientHeight) > neededHeight;
+    if (availableBottom) {
+      this.show(topOffset + "px", undefined, "unset");
+    }
+    else {
+      this.show("unset", undefined, bottomOffset + "px");
+    }
+  }
+  /**
+   * Usado no modo floating. Faz com que o componente seja ocultado.
+   */
+  async hide() {
+    if (this._floatingID !== undefined) {
+      FloatingManager.FloatingManager.close(this._floatingID);
+      this._floatingID = undefined;
+    }
+  }
+  valueChanged() {
+    if (this.value) {
+      this._currentPosition.setTime(this.value.getTime());
+      this._currentPosition.setDate(1);
+    }
+  }
+  getMonthLabel() {
+    return this._monthLabels[this._currentPosition.getMonth()] + " " + this._currentPosition.getFullYear();
+  }
+  isSelectedDate(d) {
+    if (this.value) {
+      return this.value.getDate() == d.getDate() && this.value.getMonth() == d.getMonth() && this.value.getFullYear() == d.getFullYear();
+    }
+    return false;
+  }
+  changeMonth(offset) {
+    this._currentPosition.setMonth(this._currentPosition.getMonth() + offset);
+    index.forceUpdate(this);
+  }
+  selectDate(d) {
+    let newDate = d;
+    if (this.value && (this.time || this.showSeconds)) {
+      newDate.setHours(this.value.getHours());
+      newDate.setMinutes(this.value.getMinutes());
+      if (this.showSeconds) {
+        newDate.setSeconds(this.value.getSeconds());
+      }
+      else {
+        newDate.setSeconds(0);
+      }
+    }
+    this.value = newDate;
+    this.ezChange.emit();
+  }
+  selectHours(hour) {
+    if (!this.value) {
+      this.value = new Date();
+    }
+    this.value = new Date(this.value.getFullYear(), this.value.getMonth(), this.value.getDate(), hour, this.value.getMinutes(), this.value.getSeconds());
+    this.ezChange.emit();
+  }
+  selectMinutes(minute) {
+    if (!this.value) {
+      this.value = new Date();
+    }
+    this.value = new Date(this.value.getFullYear(), this.value.getMonth(), this.value.getDate(), this.value.getHours(), minute, this.value.getSeconds());
+    this.ezChange.emit();
+  }
+  selectSeconds(second) {
+    if (!this.value) {
+      this.value = new Date();
+    }
+    this.value = new Date(this.value.getFullYear(), this.value.getMonth(), this.value.getDate(), this.value.getHours(), this.value.getMinutes(), second);
+    this.ezChange.emit();
+  }
+  updateScroll(element) {
+    if (element) {
+      const { scrollHeight, clientHeight, scrollTop } = element;
+      const remainingScroll = scrollHeight - clientHeight - Math.ceil(scrollTop);
+      if (remainingScroll > 0) {
+        element.classList.add("endHidden");
+      }
+      else {
+        element.classList.remove("endHidden");
+      }
+    }
+  }
+  componentDidRender() {
+    if (this.floating && this._firstRender) {
+      this._calendarHeight = this._box.clientHeight;
+      this._box.remove();
+      this._firstRender = false;
+    }
+    this.updateScroll(this._hoursScroll);
+    this.updateScroll(this._minutesScroll);
+    this.updateScroll(this._secondsScroll);
+  }
+  componentDidLoad() {
+    if (this.time || this.showSeconds) {
+      this._hoursScroll.scrollTop = this._hoursSelect.offsetTop - 64;
+      this._minutesScroll.scrollTop = this._minutesSelect.offsetTop - 64;
+      if (this.showSeconds) {
+        this._secondsScroll.scrollTop = this._secondsSelect.offsetTop - 64;
+      }
+    }
+  }
+  render() {
+    if (this._currentPosition == null) {
+      this._currentPosition = new Date();
+      if (this.value) {
+        this._currentPosition.setTime(this.value.getTime());
+      }
+      this._currentPosition.setDate(1);
+    }
+    const firstDate = new Date();
+    firstDate.setTime(this._currentPosition.getTime());
+    firstDate.setDate(1 - firstDate.getDay());
+    return (index.h("section", { ref: elem => this._container = elem }, index.h("div", { ref: elem => this._box = elem, style: { display: 'flex' } }, index.h("div", { class: "calendar" }, index.h("div", { class: "calendar__header" }, index.h("button", { class: "calendar__btn-previous", onClick: () => this.changeMonth(-1) }), index.h("label", { class: "calendar__lbl-month" }, this.getMonthLabel()), index.h("button", { class: "calendar__btn-next", onClick: () => this.changeMonth(1) })), index.h("div", { class: "calendar__body" }, index.h("div", { class: "calendar__line" }, this._weekDayLabels.map(day => index.h("div", { class: "calendar__cell calendar__cell--unselectable" }, day))), [0, 7, 14, 21, 28, 35].map(offset => index.h("div", { class: "calendar__line" }, [0, 1, 2, 3, 4, 5, 6].map(index$1 => {
+      const date = new Date();
+      date.setTime(firstDate.getTime());
+      date.setDate(date.getDate() + offset + index$1);
+      let classNames = "calendar__cell";
+      if (this._currentPosition.getMonth() != date.getMonth()) {
+        classNames += " calendar__cell--secondary";
+      }
+      else if (this.isSelectedDate(date)) {
+        classNames += " calendar__cell--selected";
+      }
+      return index.h("div", { class: classNames, onClick: () => this.selectDate(date) }, date.getDate());
+    })))), index.h("div", { class: "calendar__footer" }, index.h("button", { class: "calendar__btn-today", onClick: () => this.selectDate(new Date()) }, this._todayLabel))), (this.time || this.showSeconds) &&
+      index.h("div", { class: "calendarTime" }, index.h("div", { class: "calendarTime__header" }, index.h("div", null, "H"), index.h("div", { class: "separatorTime" }, ":"), index.h("div", null, "M"), this.showSeconds &&
+        index.h("div", { class: "separatorTime" }, ":"), this.showSeconds &&
+        index.h("div", null, "S")), index.h("div", { class: "calendar__body ", style: { display: 'flex', paddingLeft: '6px', paddingRight: '6px' } }, index.h("div", { class: "calendar__column", ref: elem => this._hoursScroll = elem, onScroll: () => this.updateScroll(this._hoursScroll) }, this._hoursLabel.map((offset, index$1) => {
+        if (index$1 === this.value.getHours()) {
+          return (index.h("div", { style: { display: 'flex' }, ref: elem => this._hoursSelect = elem }, index.h("div", { class: "calendar__cell calendar__cell--selected", onClick: () => this.selectHours(index$1) }, offset), index.h("div", { class: "separatorTime" }, ":")));
+        }
+        else {
+          return (index.h("div", { style: { display: 'flex' } }, index.h("div", { class: "calendar__cell", onClick: () => this.selectHours(index$1) }, offset), index.h("div", { class: "separatorTime" }, ":")));
+        }
+      })), index.h("div", { class: "calendar__column", ref: elem => this._minutesScroll = elem, onScroll: () => this.updateScroll(this._minutesScroll) }, this._minutosLabel.map((offset, index$1) => {
+        if (index$1 === this.value.getMinutes()) {
+          return (index.h("div", { style: { display: 'flex' }, ref: elem => this._minutesSelect = elem }, index.h("div", { class: "calendar__cell calendar__cell--selected", onClick: () => this.selectMinutes(index$1) }, offset), this.showSeconds && index.h("div", { class: "separatorTime" }, ":")));
+        }
+        else {
+          return (index.h("div", { style: { display: 'flex' } }, index.h("div", { class: "calendar__cell", onClick: () => this.selectMinutes(index$1) }, offset), this.showSeconds && index.h("div", { class: "separatorTime" }, ":")));
+        }
+      })), this.showSeconds &&
+        index.h("div", { class: "calendar__column", ref: elem => this._secondsScroll = elem, onScroll: () => this.updateScroll(this._secondsScroll) }, this._minutosLabel.map((offset, index$1) => {
+          if (index$1 === this.value.getSeconds()) {
+            return (index.h("div", { class: "calendar__cell calendar__cell--selected", onClick: () => this.selectSeconds(index$1), ref: elem => this._secondsSelect = elem }, offset));
+          }
+          else {
+            return (index.h("div", { class: "calendar__cell", onClick: () => this.selectSeconds(index$1) }, offset));
+          }
+        })))))));
+  }
+  static get watchers() { return {
+    "value": ["valueChanged"]
+  }; }
+};
+EzCalendar.style = ezCalendarCss;
+
+const ezCheckCss = ":host{--ez-check--box--width:18px;--ez-check--box--height:18px;--ez-check--width:calc(var(--ez-check--box--width) + 14px);--ez-check--height:calc(var(--ez-check--box--width) + 14px);--ez-check--border-radius:var(--border--radius-small);--ez-check--checked--background-color:var(--color--primary-200);--ez-check--focus--background-color:var(--color--strokes, #FFFFFF);--ez-check--hover--background-color:var(--background--medium);--ez-check--checked--disabled--background-color:var(--color--disable-secondary);--ez-check--border:var(--border--medium) var(--title--primary);--ez-check--disabled--border:var(--border--medium) var(--color--strokes);--ez-check--checked--border:var(--border--medium) var(--color--primary);--ez-check--checked--hover--background-color:var(--color--primary-200);--ez-check--checked--focus--background-color:var(--color--primary-300, #FFFFFF);--ez-check--check--image:url('data:image/svg+xml;utf8,<svg width=\"8\" height=\"7\" viewBox=\"0 0 8 7\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M7.70002 0.398999L7.48502 0.207997C7.31524 0.0598858 7.09376 -0.0150438 6.86894 -0.000430025C6.64411 0.0141838 6.43419 0.117153 6.28502 0.285997L2.70002 4.332L1.61802 3.384C1.44837 3.23576 1.22697 3.16067 1.00214 3.17509C0.77732 3.18952 0.567332 3.2923 0.418019 3.461L0.229019 3.674C0.0752361 3.84797 -0.00437434 4.07521 0.00721192 4.30713C0.0187982 4.53904 0.120661 4.75722 0.291019 4.915L2.27402 6.762C2.35832 6.8432 2.45842 6.90618 2.56811 6.94702C2.67779 6.98787 2.79471 7.00571 2.91159 6.99942C3.02846 6.99314 3.14279 6.96287 3.24747 6.91049C3.35214 6.85812 3.44492 6.78477 3.52002 6.695L7.79102 1.638C7.94063 1.46048 8.01486 1.23149 7.99786 0.999963C7.98085 0.768436 7.87396 0.552749 7.70002 0.398999Z\"/></svg>');--ez-check--check--background-color:var(--color--primary);--ez-check--check--disabled--background-color:var(--color--strokes);--ez-switch--slider--width:34px;--ez-switch--slider--height:14px;--ez-switch--pin--width:20px;--ez-switch--pin--height:20px;--ez-switch--focus--width:32px;--ez-switch--focus--height:32px;--ez-switch--background-color:var(--color--strokes);--ez-switch--disabled--background-color:var(--color--disable-secondary);--ez-switch--checked--background-color:var(--color--primary-300);--ez-switch--pin--background-color:var(--background--xlight);--ez-switch--pin--disabled--background-color:var(--color--disable-secondary);--ez-switch--pin--checked--background-color:var(--color--primary);--ez-switch--pin--checked--disabled--background-color:#E8F7F4;--ez-switch--pin--focus--background-color:var(--text--disable);--ez-switch--pin--checked--focus--background-color:var(--color--primary);--ez-check--label--font-size:var(--text--medium, 14px);--ez-check--label--font-family:var(--font-pattern, Arial);--ez-check--label--color:var(--title--primary, #000);--ez-check--label--disabled--color:var(--text--disable, #AFB6C0);display:flex;width:100%;align-items:center;margin:0}input.regularMode{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;box-sizing:border-box;-webkit-appearance:none;appearance:none;cursor:pointer;border-radius:50%;position:relative;width:var(--ez-check--width);height:var(--ez-check--height)}input.regularMode:enabled:hover{background-color:var(--ez-check--hover--background-color)}input.regularMode:enabled:focus{outline:none;background-color:var(--ez-check--focus--background-color)}input.regularMode:disabled{cursor:auto;background:none}input.regularMode::before{box-sizing:border-box;content:\"\";display:block;width:var(--ez-check--box--width);height:var(--ez-check--box--height);border-radius:var(--ez-check--border-radius);border:var(--ez-check--border)}input.regularMode:disabled::before{border:var(--ez-check--disabled--border)}input.regularMode:checked:enabled:hover{background-color:var(--ez-check--checked--hover--background-color)}input.regularMode:checked:enabled:focus{background-color:var(--ez-check--checked--focus--background-color)}input.regularMode:checked::before{border:var(--ez-check--checked--border);background-color:var(--ez-check--checked--background-color)}input.regularMode:checked:disabled:before{border:var(--ez-check--disabled--border);background-color:var(--ez-check--checked--disabled--background-color)}input.regularMode:checked::after{display:flex;position:absolute;content:\"\";background-color:var(--ez-check--check--background-color);width:8px;height:7px;-webkit-mask-image:var(--ez-check--check--image);mask-image:var(--ez-check--check--image)}input.regularMode:checked:disabled::after{background-color:var(--ez-check--check--disabled--background-color)}input.switchMode{flex-shrink:0;-webkit-appearance:none;appearance:none;position:relative;outline:none;cursor:pointer;border-radius:20px;border:none;transition:background-color var(--transition);width:var(--ez-switch--slider--width);height:var(--ez-switch--slider--height);background-color:var(--ez-switch--background-color)}input.switchMode:disabled{background-color:var(--ez-switch--disabled--background-color)}input.switchMode::after{content:\"\";display:block;position:absolute;box-shadow:var(--shadow);transition:transform var(--transition);transition:background-color var(--transition);transform:translateY(-3px);border-radius:50%;width:var(--ez-switch--pin--width);height:var(--ez-switch--pin--height);background-color:var(--ez-switch--pin--background-color)}input.switchMode:disabled::after{background-color:var(--ez-switch--pin--disabled--background-color)}input.switchMode:checked{transition:background-color var(--transition);background-color:var(--ez-switch--checked--background-color)}input.switchMode::before{display:block;content:\"\";display:block;position:absolute;border-radius:50%;opacity:0;width:var(--ez-switch--focus--width);height:var(--ez-switch--focus--height);top:calc((var(--ez-switch--slider--height) - var(--ez-switch--focus--height)) / 2);left:calc((var(--ez-switch--pin--width) - var(--ez-switch--focus--width))/2);background-color:var(--ez-switch--pin--focus--background-color)}input.switchMode:focus::before{opacity:0.24;transition:opacity var(--transition)}input.switchMode:checked:focus::before{background-color:var(--ez-switch--pin--checked--focus--background-color);transform:translateX(calc(var(--ez-switch--slider--width) - var(--ez-switch--pin--width)))}input.switchMode:checked::after{transition:transform var(--transition);transition:background-color var(--transition);transform:translateX(calc(var(--ez-switch--slider--width) - var(--ez-switch--pin--width))) translateY(-3px);box-shadow:var(--shadow);background-color:var(--ez-switch--pin--checked--background-color)}input.switchMode:checked:disabled::after{background-color:var(--ez-switch--pin--checked--disabled--background-color)}.label{flex-shrink:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ez-check--label--color);text-shadow:var(--text-shadow);font-size:var(--ez-check--label--font-size);font-family:var(--ez-check--label--font-family);cursor:default;padding-left:var(--space--small)}.label--disabled{color:var(--ez-check--label--disabled--color)}";
+
+let EzCheck = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.ezChange = index.createEvent(this, "ezChange", 7);
+    /**
+     * Deixa o campo disponível ou não para interação com o usuário.
+     */
+    this.enabled = true;
+    /**
+     * Existem dois modos de visualização: regular e switch.
+     * Se esta propriedade for omitida, o componete assume o formato "regular".
+     * No modo "regular" a visualização é a tradicional de uma caixinha marcada/desmarcada.
+     * No modo "switch" o campo tem uma interface em formato de um pino liga/desliga.
+     */
+    this.mode = "regular";
+  }
+  adjustMode() {
+    if (this.mode === "switch") {
+      this._inputElem.classList.remove("regularMode");
+      this._inputElem.classList.add("switchMode");
+    }
+    else {
+      this._inputElem.classList.remove("switchMode");
+      this._inputElem.classList.add("regularMode");
+    }
+  }
+  //---------------------------------------------
+  // Public methods
+  //---------------------------------------------
+  /**
+   * Devolve o modo escolhido para o componente
+   */
+  async getMode() {
+    return this.mode;
+  }
+  /**
+   * Faz o foco no componente de input
+   */
+  async setFocus() {
+    this._inputElem.focus();
+  }
+  componentDidLoad() {
+    this.adjustMode();
+  }
+  changeValue() {
+    this.value = !this.value;
+    this.ezChange.emit(this.value);
+  }
+  getLabelClasses() {
+    let classes = "label";
+    if (!this.enabled) {
+      classes += " label--disabled";
+    }
+    return classes;
+  }
+  render() {
+    return (index.h(index.Host, null, index.h("input", { type: "checkbox", class: "regularMode", checked: this.value === true, onChange: () => { this.changeValue(); }, disabled: !this.enabled, ref: (el) => this._inputElem = el }), this.label ? index.h("label", { class: this.getLabelClasses(), onClick: () => { this.changeValue(); }, title: this.label }, this.label) : undefined));
+  }
+  static get watchers() { return {
+    "mode": ["adjustMode"]
+  }; }
+};
+EzCheck.style = ezCheckCss;
+
+const ezCollapsibleBoxCss = ":host{--ez-collapsible-box--height:42px;--ez-collapsible-box--font-size:var(--title--medium, 14px);--ez-collapsible-box--font-family:var(--font-pattern, Arial);--ez-collapsible-box--font-weight:var(--text-weight--large, 600);--ez-collapsible-box--color:var(--title--primary);--ez-collapsible-box__btn--image--xsmall:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"12px\" width=\"7.5px\"><path d=\"M 0,10.56 4.5967752,6.0000006 0,1.3800006 1.4516132,0 7.5,6.0000006 1.4516132,12 Z\"/></svg>');--ez-collapsible-box__btn--image--small:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"14px\" width=\"8.68px\"><path d=\"M 0,12.32 5.3200012,7.0000007 0,1.6100007 1.6800004,0 8.68,7.0000007 1.6800004,14 Z\"/></svg>');--ez-collapsible-box__btn--image--medium:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"16px\" width=\"10px\"><path d=\"M 0.21915251,13.860393 6.0795475,8.0000007 0.21915251,2.0624968 2.0698036,0.28895588 9.7808475,8.0000007 2.0698036,15.711044 Z\"/></svg>');--ez-collapsible-box__btn--image--large:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"18px\" width=\"11.25px\"><path d=\"M 0,15.84 6.8951628,9.0000009 0,2.0700009 2.1774198,0 11.25,9.0000009 2.1774198,18 Z\"/></svg>');--ez-collapsible-box__btn--image--xlarge:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"20px\" width=\"12.5px\"><path d=\"M 0,17.6 7.661292,10.000001 0,2.300001 2.4193553,0 12.5,10.000001 2.4193553,20 Z\"/></svg>');--ez-collapsible-box__btn--fill:var(--ez-collapsible-box--color);--ez-collapsible-box__btn--width:10px;--ez-collapsible-box__btn--height:16px;display:flex;flex-wrap:wrap;width:100%}.collapsible-box__title{width:100%;align-self:center;display:flex;box-sizing:border-box}.collapsible-box__label{white-space:nowrap;overflow:hidden;cursor:pointer;text-overflow:ellipsis;width:100%;font-family:var(--ez-collapsible-box--font-family);font-size:var(--ez-collapsible-box--font-size);font-weight:var(--ez-collapsible-box--font-weight);color:var(--ez-collapsible-box--color)}.collapsible-box__label--icon-right{white-space:nowrap;overflow:hidden;cursor:pointer;text-overflow:ellipsis;font-family:var(--ez-collapsible-box--font-family);font-size:var(--ez-collapsible-box--font-size);font-weight:var(--ez-collapsible-box--font-weight);color:var(--ez-collapsible-box--color)}.collapsible-box__btn{outline:none;border:none;background-color:unset;cursor:pointer;padding:1px 6px}.collapsible-box__btn::after{content:'';display:flex;background-color:var(--ez-collapsible-box__btn--fill);width:var(--ez-collapsible-box__btn--width);height:var(--ez-collapsible-box__btn--height);transition:transform var(--transition);transform:rotate(90deg)}.collapsible-box__btn--xsmall::after{width:7.5px;height:12px;-webkit-mask-image:var(--ez-collapsible-box__btn--image--xsmall);mask-image:var(--ez-collapsible-box__btn--image--xsmall)}.collapsible-box__btn--small::after{width:8.68px;height:14px;-webkit-mask-image:var(--ez-collapsible-box__btn--image--small);mask-image:var(--ez-collapsible-box__btn--image--small)}.collapsible-box__btn--medium::after{width:10px;height:16px;-webkit-mask-image:var(--ez-collapsible-box__btn--image--medium);mask-image:var(--ez-collapsible-box__btn--image--medium)}.collapsible-box__btn--large::after{width:11.25px;height:18px;-webkit-mask-image:var(--ez-collapsible-box__btn--image--large);mask-image:var(--ez-collapsible-box__btn--image--large)}.collapsible-box__btn--xlarge::after{width:12.5px;height:20px;-webkit-mask-image:var(--ez-collapsible-box__btn--image--xlarge);mask-image:var(--ez-collapsible-box__btn--image--xlarge)}.collapsible-box__btn--collapsed::after{transform:rotate(0deg)}.font--xsmall{font-size:10px}.font--small{font-size:12px}.font--medium{font-size:14px}.font--large{font-size:16px}.font--xlarge{font-size:20px}";
+
+let EzCollapsibleBox = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.ezChange = index.createEvent(this, "ezChange", 7);
+    /**
+     * Valor externalizado que garante a exibição ou não do componente
+     */
+    this.value = false;
+    /**
+    * Define o tamanho do texto e do ícone do componente.
+    */
+    this.headerSize = "small";
+    /**
+    * Define o local onde o ícone será renderizado.
+    */
+    this.iconPlacement = "left";
+  }
+  observeValue() {
+    this.ezChange.emit();
+  }
+  /**
+   * Esconde ou revela o conteúdo do componente
+   */
+  async showHide() {
+    this.value = !this.value;
+  }
+  render() {
+    return (index.h(index.Host, null, this.iconPlacement == "right" ?
+      index.h("div", { class: "collapsible-box__title" }, index.h("label", { class: (this.iconPlacement == "right" ? "collapsible-box__label--icon-right " : "collapsible-box__label ") + (this.headerSize ? "font--" + this.headerSize : ""), onClick: () => this.showHide(), title: this.label }, this.label), index.h("button", { class: this.value ? "collapsible-box__btn collapsible-box__btn--collapsed " + "collapsible-box__btn--" + this.headerSize : "collapsible-box__btn " + "collapsible-box__btn--" + this.headerSize, onClick: () => this.showHide() }))
+      :
+        index.h("div", { class: "collapsible-box__title" }, index.h("button", { class: this.value ? "collapsible-box__btn collapsible-box__btn--collapsed " + "collapsible-box__btn--" + this.headerSize : "collapsible-box__btn " + "collapsible-box__btn--" + this.headerSize, onClick: () => this.showHide() }), index.h("label", { class: (this.iconPlacement == "right" ? "collapsible-box__label--icon-right " : "collapsible-box__label ") + (this.headerSize ? "font--" + this.headerSize : ""), onClick: () => this.showHide(), title: this.label }, this.label)), !this.value ? index.h("slot", null) : null));
+  }
+  static get watchers() { return {
+    "value": ["observeValue"]
+  }; }
+};
+EzCollapsibleBox.style = ezCollapsibleBoxCss;
+
+const ezComboBoxCss = ":host{--ez-combo-box--height:42px;--ez-combo-box--width:100%;--ez-combo-box__icon--width:48px;--ez-combo-box--border-radius:var(--border--radius-medium, 12px);--ez-combo-box--border-radius-small:var(--border--radius-small, 6px);--ez-combo-box--font-size:var(--text--medium, 14px);--ez-combo-box--font-family:var(--font-pattern, Arial);--ez-combo-box--font-weight--large:var(--text-weight--large, 500);--ez-combo-box--font-weight--medium:var(--text-weight--medium, 400);--ez-combo-box--background-color--xlight:var(--background--xlight, #fff);--ez-combo-box--background-medium:var(--background--medium, #f0f3f7);--ez-combo-box__input--background-color:var(--background--medium, #e0e0e0);--ez-combo-box__input--border:var(--border--medium, 2px solid);--ez-combo-box__input--border-color:var(--ez-combo-box__input--background-color);--ez-combo-box__input--focus--border-color:var(--color--primary, #008561);--ez-combo-box__input--disabled--background-color:var(--color--disable-secondary, #F2F5F8);--ez-combo-box__input--disabled--color:var(--text--disable, #AFB6C0);--ez-combo-box__input--error--border-color:#CC2936;--ez-combo-box__btn-search--background-color:var(--text--primary, #626e82);--ez-combo-box__btn-search-disabled--background-color:var(--text--disable, #AFB6C0);--ez-combo-box__btn-search-hover--background-color:var(--color--primary, #4e4e4e);--ez-combo-box__btn-options--background-color:var(--text--primary, #626e82);--ez-combo-box__btn-options-disabled--background-color:var(--text--disable, #AFB6C0);--ez-combo-box__btn-options-hover--background-color:var(--color--primary, #4e4e4e);--ez-combo-box__label--color:var(--title--primary, #919191);--ez-combo-box__list-text--primary:var(--text--primary, #626e82);--ez-combo-box__list-height:calc(var(--ez-combo-box--font-size) + var(--ez-combo-box--space--medium));--ez-combo-box__drop-down-image:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"16px\" width=\"16px\"><path d=\"M 1.8585859,3.0707069 7.9999998,9.2121212 14.141414,3.0707069 16,5.0101006 7.9999998,12.929293 0,4.9292932 Z\"/></svg>');--ez-combo-box__search-image:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"22px\" width=\"22px\"><path d=\"m 9.4,2.3 c 4.1,0 7.4,3.2 7.4,7.2 0,1.8 -0.7,3.4 -1.8,4.7 l 0.3,0.3 h 0.9 l 5.7,5.6 -1.7,1.7 -5.7,-5.6 V 15.3 L 14.3,15 C 13,16.1 11.3,16.7 9.5,16.7 5.3,16.7 2,13.5 2,9.5 2,5.5 5.3,2.3 9.4,2.3 m 0,2.2 c -2.9,0 -5.1,2.2 -5.1,5 0,2.8 2.3,5 5.1,5 2.8,0 5.1,-2.2 5.1,-5 0,-2.8 -2.2,-5 -5.1,-5 z\"/></svg>');--ez-combo-box--space--medium:var(--space--medium, 12px);--ez-combo-box--space--small:var(--space--small, 6px);display:flex;flex-wrap:wrap;position:relative;width:var(--ez-combo-box--width)}.list-container{position:relative;width:100%}.options-list{box-sizing:border-box;width:100%;z-index:var(--more-visible, 2);display:flex;flex-direction:column;background-color:var(--ez-combo-box--background-color--xlight);padding:var(--ez-combo-box--space--small);border-radius:var(--ez-combo-box--border-radius);box-shadow:var(--shadow, 0px 0px 16px 0px #000);scroll-behavior:smooth;max-height:calc(4*var(--ez-combo-box__list-height) + 2*var(--ez-combo-box--space--small));overflow:auto}.item{text-align:left;display:flex;justify-content:space-between;align-items:center;border-radius:var(--ez-combo-box--border-radius-small);padding:0 var(--ez-combo-box--space--small);list-style-type:none;min-height:var(--ez-combo-box__list-height)}.item--label{text-align:left;flex-basis:85%;flex-grow:1;color:var(--ez-combo-box__list-text--primary);font-weight:var(--ez-combo-box--font-weight--large);font-family:var(--ez-combo-box--font-family);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.item--value{text-align:right;flex-basis:15%;flex-grow:0;color:var(--ez-combo-box__list-text--primary);font-weight:var(--ez-combo-box--font-weight--large);font-family:var(--ez-combo-box--font-family);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}li:hover{background-color:var(--ez-combo-box--background-medium)}.preselected{background-color:var(--background--medium)}.btn-open-options{outline:none;border:none;background-color:unset;cursor:pointer}.btn-open-options:disabled{cursor:unset}.btn-open-options::after{content:'';display:flex;background-color:var(--ez-combo-box__btn-options--background-color);width:16px;height:16px;-webkit-mask-image:var(--ez-combo-box__drop-down-image);mask-image:var(--ez-combo-box__drop-down-image)}.btn-open-options:disabled:after{background-color:var(--ez-combo-box__btn-options-disabled--background-color)}.btn-open-options:enabled:hover::after{background-color:var(--ez-combo-box__btn-options-hover--background-color)}.btn-open-search{outline:none;border:none;background-color:unset;cursor:pointer}.btn-open-search:disabled{cursor:unset}.btn-open-search::after{content:'';display:flex;background-color:var(--ez-combo-box__btn-search--background-color);width:22px;height:22px;-webkit-mask-image:var(--ez-combo-box__search-image);mask-image:var(--ez-combo-box__search-image)}.btn-open-search:disabled:after{background-color:var(--ez-combo-box__btn-search-disabled--background-color)}.btn-open-search:enabled:hover::after{background-color:var(--ez-combo-box__btn-search-hover--background-color)}";
+
+let EzComboBox = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.ezChange = index.createEvent(this, "ezChange", 7);
+    /**
+     * Deixa o campo disponível ou não para interação com usuário.
+     */
+    this.enabled = true;
+    /**
+     * Ajusta a opção de mostrar o "value" ao selecionar uma opção. Por padrão não mostra.
+     */
+    this.showSelectedValue = false;
+    /**
+     * Ajusta a opção de mostrar o "value" para cada opção. Por padrão não mostra
+     */
+    this.showOptionValue = false;
+  }
+  internalUpdate() {
+    if (this._inputElement) {
+      this._inputElement.value = this.getText();
+    }
+    this.hideOptions();
+    this._criteria = undefined;
+    this._preSelection = undefined;
+    this.updateVisibleOptions();
+  }
+  getText() {
+    let text = "";
+    const selected = this.getSelectedOption();
+    if (selected) {
+      text = this.showSelectedValue ? `${selected.value} - ${selected.label}` : selected.label;
+    }
+    return text;
+  }
+  getSelectedOption() {
+    if (typeof this.value === "string" || this.value instanceof String) {
+      return this._visibleOptions.find(o => o.value === this.value);
+    }
+    return this.value;
+  }
+  updateVisibleOptions() {
+    let opts = this._source || [];
+    if (!this.searchMode && this._criteria) {
+      const upperCriteria = this._criteria.toUpperCase();
+      opts = opts.filter(opt => opt.label.toLocaleUpperCase().indexOf(upperCriteria) > -1);
+    }
+    this._visibleOptions = [{ value: undefined, label: "" }].concat(opts);
+  }
+  buildItem(opt, index$1) {
+    return index.h("li", { class: index$1 === this._preSelection ? "item preselected" : "item", id: `item_${opt.value}`, onMouseDown: () => this.selectOption(opt), onMouseOver: () => this._preSelection = undefined }, index.h("span", { class: "item--label", title: opt.label }, opt.label), this.showOptionValue ? index.h("span", { class: "item--value", title: opt.value }, opt.value) : undefined);
+  }
+  showOptions() {
+    if (!this.enabled) {
+      return;
+    }
+    //FIXME: Provavelmente isso fará com que o popup abra em uma 
+    //posição errada no futuro. Preferi fazer simples no começo,
+    //porque não quis onerar o text input com essa funcionalidade...
+    const top = this.errorMessage ? "0px" : "-17px";
+    this._floatingID = FloatingManager.FloatingManager.float(this._optionsList, this._listContainer, { autoClose: true, top });
+    window.requestAnimationFrame(() => {
+      this._optionsList.scrollIntoView({ behavior: "smooth", block: "nearest", inline: "nearest" });
+    });
+  }
+  hideOptions() {
+    if (this._floatingID !== undefined) {
+      FloatingManager.FloatingManager.close(this._floatingID);
+    }
+    this._floatingID = undefined;
+  }
+  isOptionsVisible() {
+    return this._floatingID !== undefined && FloatingManager.FloatingManager.isFloating(this._floatingID);
+  }
+  nextOption() {
+    if (this.searchMode && !this.isOptionsVisible()) {
+      return;
+    }
+    this.showOptions();
+    this._preSelection = this._preSelection === undefined ? 0 : Math.min(this._preSelection + 1, this._visibleOptions.length - 1);
+    this.scrollToOption(this._visibleOptions[this._preSelection], true);
+  }
+  previousOption() {
+    this._preSelection = this._preSelection === undefined ? 0 : Math.max(this._preSelection - 1, 0);
+    this.scrollToOption(this._visibleOptions[this._preSelection], false);
+  }
+  scrollToOption(opt, down) {
+    window.requestAnimationFrame(() => {
+      const liElem = this._optionsList.querySelector(`li#item_${opt.value}`);
+      if (liElem) {
+        const parent = liElem.parentElement;
+        const parentRect = parent.getBoundingClientRect();
+        const itemRect = liElem.getBoundingClientRect();
+        if (down && itemRect.bottom > parentRect.bottom) {
+          parent.scrollTop = itemRect.top;
+        }
+        else if (!down && itemRect.top < parentRect.top) {
+          parent.scrollTop = 0;
+        }
+      }
+    });
+  }
+  selectCurrentOption() {
+    if (this._preSelection !== undefined) {
+      this.selectOption(this._visibleOptions[this._preSelection]);
+      this._preSelection = undefined;
+    }
+  }
+  selectOption(opt) {
+    const currentOpt = this.getSelectedOption();
+    if (currentOpt !== opt) {
+      const adjustedOpt = !(opt === null || opt === void 0 ? void 0 : opt.value) ? undefined : opt;
+      this.value = adjustedOpt;
+      this.errorMessage = "";
+      this.ezChange.emit(adjustedOpt);
+    }
+    else {
+      this.internalUpdate();
+    }
+  }
+  updateSource(source) {
+    if (source instanceof Promise) {
+      source.then(result => this.updateSource(result));
+      this.updateVisibleOptions();
+    }
+    else {
+      this._source = source;
+      this.updateVisibleOptions();
+    }
+  }
+  loadOptions(mode, argument = "") {
+    this._criteria = argument;
+    if (this.optionLoader) {
+      this.updateSource(this.optionLoader({ mode, argument }));
+    }
+    else {
+      this.updateSource(this.options);
+    }
+  }
+  cancelPreselection() {
+    if (!this._inputElement.value && this.value) {
+      this.selectOption(undefined);
+    }
+    else {
+      this.internalUpdate();
+    }
+  }
+  //---------------------------------------------
+  // Lifecycle web component
+  //---------------------------------------------
+  componentWillLoad() {
+    if (this.options === undefined) {
+      this.options = [];
+      const optionsTags = this.el.querySelectorAll("option");
+      if (optionsTags) {
+        optionsTags.forEach(e => {
+          let label = e.innerText;
+          let value = e.getAttribute("value");
+          if (!value) {
+            value = label;
+          }
+          this.options.push({ label, value });
+          e.hidden = true;
+        });
+      }
+    }
+    if (this.searchMode) {
+      this.updateSource([]);
+    }
+    else {
+      this.loadOptions("PRELOAD");
+    }
+  }
+  componentDidRender() {
+    if (this._floatingID === undefined) {
+      this._optionsList.remove();
+    }
+  }
+  componentDidLoad() {
+    CSSVarsUtils.CSSVarsUtils.applyVarsTextInput(this.el, this._inputElement);
+  }
+  //---------------------------------------------
+  // Event handlers
+  //---------------------------------------------
+  onTextInputChangeHandler(event) {
+    if (!this._criteria) {
+      this._inputElement.value = event.data;
+    }
+    const argument = event.target.value;
+    this._criteria = argument;
+    if (this._criteria) {
+      if (this.searchMode) {
+        if (this._changeDeboucingTimeout) {
+          window.clearTimeout(this._changeDeboucingTimeout);
+        }
+        this._changeDeboucingTimeout = window.setTimeout(() => {
+          this.loadOptions("PREDICTIVE", argument);
+        }, 200);
+      }
+      else {
+        this.updateVisibleOptions();
+      }
+      this.showOptions();
+    }
+  }
+  onTextInputClickHandler() {
+    if (!this.searchMode) {
+      this.showOptions();
+    }
+  }
+  keyDownHandler(event) {
+    switch (event.key) {
+      case "ArrowDown":
+        this.nextOption();
+        break;
+      case "ArrowUp":
+        this.previousOption();
+        break;
+      case "Enter":
+        this.selectCurrentOption();
+        break;
+      case "Escape":
+        this.cancelPreselection();
+        break;
+    }
+    event.stopPropagation();
+  }
+  onTextInputFocusOutHandler() {
+    this.cancelPreselection();
+  }
+  render() {
+    return (index.h(index.Host, null, index.h("ez-text-input", { ref: elem => this._inputElement = elem, enabled: this.enabled, onInput: evt => this.onTextInputChangeHandler(evt), onClick: () => this.onTextInputClickHandler(), onFocusout: () => this.onTextInputFocusOutHandler(), onEzChange: event => event.stopPropagation(), onKeyDown: event => this.keyDownHandler(event), label: this.label, value: this.getText(), errorMessage: this.errorMessage }, this.searchMode ?
+      index.h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-search", onClick: () => { this.loadOptions("ADVANCED"); }, slot: "leftIcon" })
+      :
+        index.h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-options", slot: "rightIcon", onClick: () => this.showOptions() })), index.h("section", { class: "list-container", ref: elem => this._listContainer = elem }, index.h("div", { class: "options-list", ref: elem => this._optionsList = elem }, this._visibleOptions.map((opt, index) => this.buildItem(opt, index))))));
+  }
+  get el() { return index.getElement(this); }
+  static get watchers() { return {
+    "value": ["internalUpdate"]
+  }; }
+};
+EzComboBox.style = ezComboBoxCss;
+
+const ezDateInputCss = ":host{display:block;width:100%;--ez-date-input__input--background-color:var(--background--medium, #e0e0e0);--ez-date-input__input--border-color:var(--ez-date-input__input--background-color);--ez-date-input__calendar-image:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"16px\" width=\"15px\"><path d=\"M 3.171875,5.25 C 2.6485088,5.25 2.21875,5.6797588 2.21875,6.203125 2.21875,6.7264912 2.6485088,7.15625 3.171875,7.15625 3.6952412,7.15625 4.125,6.7264912 4.125,6.203125 4.125,5.6797588 3.6952412,5.25 3.171875,5.25 Z m 2.875,0 C 5.5235088,5.25 5.09375,5.6797588 5.09375,6.203125 5.09375,6.7264912 5.5235088,7.15625 6.046875,7.15625 6.5702412,7.15625 7,6.7264912 7,6.203125 7,5.6797588 6.5702412,5.25 6.046875,5.25 Z m 2.875,0 c -0.5233662,0 -0.953125,0.4297588 -0.953125,0.953125 0,0.5233662 0.4297588,0.953125 0.953125,0.953125 0.5233662,0 0.9511719,-0.4297588 0.9511719,-0.953125 C 9.8730469,5.6797588 9.4452412,5.25 8.921875,5.25 Z m 2.873047,0 c -0.523366,0 -0.953125,0.4297588 -0.953125,0.953125 0,0.5233662 0.429759,0.953125 0.953125,0.953125 0.523366,0 0.953125,-0.4297588 0.953125,-0.953125 C 12.748047,5.6797588 12.318288,5.25 11.794922,5.25 Z M 3.171875,8.1230469 c -0.5233662,0 -0.953125,0.4297588 -0.953125,0.953125 0,0.5233662 0.4297588,0.9531251 0.953125,0.9531251 0.5233662,0 0.953125,-0.4297589 0.953125,-0.9531251 0,-0.5233662 -0.4297588,-0.953125 -0.953125,-0.953125 z m 2.875,0 c -0.5233662,0 -0.953125,0.4297588 -0.953125,0.953125 0,0.5233662 0.4297588,0.9531251 0.953125,0.9531251 C 6.5702412,10.029297 7,9.5995381 7,9.0761719 7,8.5528057 6.5702412,8.1230469 6.046875,8.1230469 Z m 2.8554688,0 c -0.5233663,0 -0.953125,0.4297588 -0.953125,0.953125 0,0.5233662 0.4297587,0.9531251 0.953125,0.9531251 0.5233661,0 0.9531249,-0.4297589 0.953125,-0.9531251 0,-0.5233662 -0.4297588,-0.953125 -0.953125,-0.953125 z m 2.9003902,0 c -0.523366,0 -0.953125,0.4297588 -0.953125,0.953125 0,0.5233662 0.429759,0.9531251 0.953125,0.9531251 0.523367,0 0.953125,-0.4297589 0.953125,-0.9531251 0,-0.5233662 -0.429758,-0.953125 -0.953125,-0.953125 z M 3.171875,10.998047 c -0.5233662,0 -0.953125,0.429759 -0.953125,0.953125 0,0.523366 0.4297588,0.953125 0.953125,0.953125 0.5233662,0 0.953125,-0.429759 0.953125,-0.953125 0,-0.523366 -0.4297588,-0.953125 -0.953125,-0.953125 z m 2.875,0 c -0.5233662,0 -0.953125,0.429759 -0.953125,0.953125 0,0.523366 0.4297588,0.953125 0.953125,0.953125 C 6.5702412,12.904297 7,12.474538 7,11.951172 7,11.427806 6.5702412,10.998047 6.046875,10.998047 Z m 2.8554688,0 c -0.5233663,0 -0.953125,0.429759 -0.953125,0.953125 0,0.523366 0.4297587,0.953125 0.953125,0.953125 0.5233661,0 0.9531249,-0.429759 0.953125,-0.953125 0,-0.523366 -0.4297588,-0.953125 -0.953125,-0.953125 z m 2.9003902,0 c -0.523366,0 -0.953125,0.429759 -0.953125,0.953125 0,0.523366 0.429759,0.953125 0.953125,0.953125 0.523367,0 0.953125,-0.429759 0.953125,-0.953125 0,-0.523366 -0.429758,-0.953125 -0.953125,-0.953125 z M 3.5,0 c -0.554,0 -1,0.446 -1,1 v 0.050781 C 1.0853217,1.2909766 0,2.5186658 0,4 v 9 c 0,1.652487 1.3475134,3 3,3 h 9 c 1.652487,0 3,-1.347513 3,-3 V 4 C 15,2.5186658 13.914678,1.2909766 12.5,1.0507812 V 1 c 0,-0.554 -0.446,-1 -1,-1 -0.554,0 -1,0.446 -1,1 h -2 c 0,-0.554 -0.446,-1 -1,-1 -0.554,0 -1,0.446 -1,1 h -2 C 4.5,0.446 4.054,0 3.5,0 Z m 1,2.0996094 h 2 v 0.640625 c 0,0.554 0.446,1 1,1 0.554,0 1,-0.446 1,-1 v -0.640625 h 2 v 0.640625 c 0,0.554 0.446,1 1,1 0.554,0 1,-0.446 1,-1 V 2.1738281 C 13.311725,2.3905225 13.900391,3.11278 13.900391,4 v 9 c 0,1.062113 -0.838278,1.900391 -1.900391,1.900391 H 3 C 1.9378864,14.900391 1.0996094,14.062113 1.0996094,13 V 4 C 1.0996094,3.11278 1.6882747,2.3905225 2.5,2.1738281 v 0.5664063 c 0,0.554 0.446,1 1,1 0.554,0 1,-0.446 1,-1 z\"/></svg>')}.btn-open-cal{outline:none;border:none;background-color:unset;cursor:pointer}.btn-open-cal:disabled{cursor:unset}.btn-open-cal::after{content:'';display:flex;background-color:var(--text--primary, #008561);width:15px;height:16px;-webkit-mask-image:var(--ez-date-input__calendar-image);mask-image:var(--ez-date-input__calendar-image)}.btn-open-cal:disabled:after{background-color:var(--text--disable, #AFB6C0)}.btn-open-cal:enabled:hover::after{background-color:var(--color--primary, #4e4e4e)}ez-text-input{--text-input__input--background-color:var(--ez-date-input__input--background-color, #FFFFFF);--text-input__input--border-color:var(--ez-date-input__input--border-color, #DCE0E8)}";
+
+let EzDateInput = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.ezChange = index.createEvent(this, "ezChange", 7);
+    /**
+     * Deixa o campo disponível ou não para uso.
+     */
+    this.enabled = true;
+  }
+  setLabel() {
+    this._textInput.label = this.label;
+  }
+  setErrorMessage() {
+    this._textInput.errorMessage = this.errorMessage;
+  }
+  applyValueToInput() {
+    if (this._textInput) {
+      this._textInput.value = this.getTextValue(this.value);
+    }
+  }
+  changeValue(newValue) {
+    newValue = newValue == null ? null : DateUtils.DateUtils.clearTime(newValue);
+    this._textInput.errorMessage = "";
+    if (newValue !== this.value) {
+      this.value = newValue;
+      this.ezChange.emit();
+    }
+  }
+  showCalendar() {
+    this.parseDate();
+    this._calendar.value = this.value;
+    //FIXME: Provavelmente isso fará com que o popup abra em uma 
+    //posição errada no futuro. Preferi fazer simples no começo,
+    //porque não quis onerar o text input com essa funcionalidade...
+    const top = this._textInput.errorMessage ? 0 : -17;
+    this._calendar.fitVertical(top, this._elem.clientHeight);
+  }
+  hideCalendar() {
+    this.changeValue(this._calendar.value);
+    this._calendar.hide();
+  }
+  parseDate() {
+    const strValue = this._textInput.value;
+    const parsedDate = DateUtils.DateUtils.strToDate(strValue);
+    if (parsedDate || !strValue) {
+      if (this.value === parsedDate) {
+        this.changeValue(this.value);
+      }
+      else {
+        this.changeValue(parsedDate);
+      }
+    }
+    else {
+      this._textInput.errorMessage = "O valor digitado não é uma data válida";
+    }
+  }
+  getTextValue(d) {
+    return d ? new Intl.DateTimeFormat("pt-BR").format(d) : null;
+  }
+  componentDidLoad() {
+    CSSVarsUtils.CSSVarsUtils.applyVarsTextInput(this._elem, this._textInput);
+  }
+  render() {
+    return (index.h(index.Host, null, index.h("ez-text-input", { ref: elem => this._textInput = elem, onBlur: () => this.parseDate(), onKeyDown: event => {
+        if (event.key === "H" || event.key === "h")
+          this.changeValue(new Date());
+      }, label: this.label, onEzChange: event => event.stopPropagation(), value: this.getTextValue(this.value), restrict: "0123456789/", enabled: this.enabled, errorMessage: this.errorMessage }, index.h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-cal", onClick: () => this.showCalendar(), slot: "leftIcon" })), index.h("ez-calendar", { onEzChange: (event) => { this.hideCalendar(); event.stopPropagation(); }, floating: true, ref: elem => this._calendar = elem })));
+  }
+  get _elem() { return index.getElement(this); }
+  static get watchers() { return {
+    "label": ["setLabel"],
+    "errorMessage": ["setErrorMessage"],
+    "value": ["applyValueToInput"]
+  }; }
+};
+EzDateInput.style = ezDateInputCss;
+
+const buildTextArea = ({ name, label }) => {
+  return (index.h("div", { class: "col col--sd-12 padding--small", key: name },
+    index.h("ez-text-area", { label: label, "data-field-name": name })));
+};
+
+const buildTextInput = ({ name, label }) => {
+  return (index.h("div", { class: "col col--sd-12 col--tb-3 padding--small" },
+    index.h("ez-text-input", { label: label, "data-field-name": name, key: name })));
+};
+
+const buildSwitch = (fieldConfig) => {
+  return buildField$1(fieldConfig.name, fieldConfig.label, true);
+};
+const buildCheckBox = (fieldConfig) => {
+  return buildField$1(fieldConfig.name, fieldConfig.label, false);
+};
+function buildField$1(fieldName, fieldLabel, switchMode = false) {
+  return (index.h("div", { class: "col col--sd-12 col--tb-3 padding--small align--middle padding-bottom--large" },
+    index.h("ez-check", { label: fieldLabel, mode: switchMode ? "switch" : "regular", "data-field-name": fieldName, key: fieldName })));
+}
+
+const buildComboBox = ({ name, label }, properties) => {
+  const prop = properties === null || properties === void 0 ? void 0 : properties.options;
+  let options;
+  if (typeof prop === "string") {
+    const parsed = JSON.parse(prop);
+    options = Object.keys(parsed).map(key => { return { value: key, label: parsed[key] }; });
+  }
+  else {
+    options = prop;
+  }
+  return (index.h("div", { class: "col col--sd-12 col--tb-3 padding--small" },
+    index.h("ez-combo-box", { label: label, "data-field-name": name, key: name, options: options })));
+};
+
+const buildSearch = ({ name, label }) => {
+  return (index.h("div", { class: "col col--sd-12 col--tb-3 padding--small" },
+    index.h("ez-search", { label: label, optionLoader: (_argument) => { }, "data-field-name": name, key: name })));
+};
+
+const buildFile = ({ name, label }) => {
+  return (index.h("div", { class: "col col--sd-12 padding--small" },
+    index.h("ez-upload", { label: label, urlUpload: "", requestHeaders: "", maxFiles: 10, "data-field-name": name, key: name })));
+};
+
+const buildDate = ({ name, label }) => {
+  return (index.h("div", { class: "col col--sd-12 col--tb-3 padding--small" },
+    index.h("ez-date-input", { label: label, "data-field-name": name, key: name })));
+};
+
+const buildDecimal = ({ name, label }, properties) => {
+  const precision = Number((properties === null || properties === void 0 ? void 0 : properties.precision) || 2);
+  const prettyPrecision = Number((properties === null || properties === void 0 ? void 0 : properties.prettyPrecision) || precision);
+  return buildNumeric(name, label, precision, prettyPrecision);
+};
+const buildInteger = ({ name, label }) => {
+  return buildNumeric(name, label, 0, 0);
+};
+function buildNumeric(fieldName, fieldLabel, precision, prettyPrecision) {
+  return (index.h("div", { class: "col col--sd-12 col--tb-3 padding--small" },
+    index.h("ez-number-input", { label: fieldLabel, precision: precision, prettyPrecision: prettyPrecision, "data-field-name": fieldName, key: fieldName })));
+}
+
+const uiBuilders = new Map();
+uiBuilders.set(index$1.UserInterface.LONGTEXT, buildTextArea);
+uiBuilders.set(index$1.UserInterface.CHECKBOX, buildCheckBox);
+uiBuilders.set(index$1.UserInterface.SWITCH, buildSwitch);
+uiBuilders.set(index$1.UserInterface.OPTIONSELECTOR, buildComboBox);
+uiBuilders.set(index$1.UserInterface.SEARCH, buildSearch);
+uiBuilders.set(index$1.UserInterface.FILE, buildFile);
+uiBuilders.set(index$1.UserInterface.DATE, buildDate);
+uiBuilders.set(index$1.UserInterface.DECIMALNUMBER, buildDecimal);
+uiBuilders.set(index$1.UserInterface.INTEGERNUMBER, buildInteger);
+const buildField = (field) => {
+  const descriptor = field.descriptor;
+  const config = Object.assign({}, field.config);
+  let builder;
+  let props;
+  if (descriptor) {
+    builder = uiBuilders.get(descriptor.userInterface);
+    if (!config.label) {
+      config.label = descriptor.label;
+    }
+    if (!config.name) {
+      config.name = descriptor.name;
+    }
+    if (config.required === undefined) {
+      config.required = descriptor.required;
+    }
+    props = descriptor.properties;
+  }
+  if (config.required) {
+    config.label = `* ${config.label} (obrigatório)`;
+  }
+  if (!builder) {
+    builder = buildTextInput;
+  }
+  return builder(config, props);
+};
+
+const FormItem = ({ source }) => {
+  if ("items" in source) {
+    const fieldSet = source;
+    return index.h("ez-collapsible-box", { label: source.label }, fieldSet.items.map(fi => buildField(fi)));
+  }
+  else {
+    return buildField(source);
+  }
+};
+
+const FormSheet = ({ store, source }) => {
+  return (index.h("div", { class: "box__container" }, source.items.map(item => index.h(FormItem, { store: store, source: item }))));
+};
+
+class FormMetadata {
+  constructor() {
+    this._sheets = new Map();
+    this._requiredFields = [];
+  }
+  getSheet(name) {
+    return this._sheets.get(name);
+  }
+  getAllSheets() {
+    return this._sheets;
+  }
+  addSheet(sheet) {
+    this._sheets.set(sheet.name, sheet);
+    this._requiredFields = this._requiredFields.concat(sheet.requiredFields);
+  }
+  getRequiredFields() {
+    return this._requiredFields;
+  }
+}
+const buildFromDataUnit = (dataUnit) => {
+  var _a;
+  const unitMD = dataUnit.metadata;
+  const metadata = new FormMetadata();
+  if (unitMD) {
+    const visibleFields = (_a = unitMD.fields) === null || _a === void 0 ? void 0 : _a.filter(descriptor => descriptor.visible !== false);
+    metadata.addSheet({
+      label: unitMD.label,
+      name: unitMD.name,
+      items: visibleFields.map(descriptor => { return { descriptor }; }),
+      requiredFields: visibleFields
+        .filter(descriptor => descriptor.required)
+        .map(descriptor => descriptor.name)
+    });
+  }
+  return metadata;
+};
+const buildFromConfig = (fields, dataUnit) => {
+  const sheets = new Map();
+  const requiredFields = [];
+  fields.forEach(config => {
+    if (config.visible !== false) {
+      const tab = config.tab || "Geral";
+      const descriptor = dataUnit.getField(config.name);
+      if (!sheets.has(tab)) {
+        sheets.set(tab, new Map());
+      }
+      let isRequired = false;
+      if (config.required === undefined) {
+        if (descriptor) {
+          isRequired = descriptor.required;
+        }
+      }
+      else {
+        isRequired = config.required;
+      }
+      if (isRequired) {
+        requiredFields.push(config.name);
+      }
+      const tabItens = sheets.get(tab);
+      const fieldMD = { config, descriptor };
+      const group = config.group;
+      if (group) {
+        const key = `group::${group}`;
+        if (!tabItens.has(key)) {
+          tabItens.set(key, { label: group, items: [fieldMD] });
+        }
+        else {
+          tabItens.get(key).items.push(fieldMD);
+        }
+      }
+      else {
+        tabItens.set(config.name, fieldMD);
+      }
+    }
+  });
+  const metadata = new FormMetadata();
+  sheets.forEach((value, key) => {
+    metadata.addSheet({
+      label: key,
+      name: key,
+      items: Array.from(value.values()),
+      requiredFields
+    });
+  });
+  return metadata;
+};
+
+/**
+ * Adapted from React: https://github.com/facebook/react/blob/master/packages/shared/formatProdErrorMessage.js
+ *
+ * Do not require this module directly! Use normal throw error calls. These messages will be replaced with error codes
+ * during build.
+ * @param {number} code
+ */
+function formatProdErrorMessage(code) {
+  return "Minified Redux error #" + code + "; visit https://redux.js.org/Errors?code=" + code + " for the full message or " + 'use the non-minified dev environment for full errors. ';
+}
+
+// Inlined version of the `symbol-observable` polyfill
+var $$observable = (function () {
+  return typeof Symbol === 'function' && Symbol.observable || '@@observable';
+})();
+
+/**
+ * These are private action types reserved by Redux.
+ * For any unknown actions, you must return the current state.
+ * If the current state is undefined, you must return the initial state.
+ * Do not reference these action types directly in your code.
+ */
+var randomString = function randomString() {
+  return Math.random().toString(36).substring(7).split('').join('.');
+};
+
+var ActionTypes = {
+  INIT: "@@redux/INIT" + randomString(),
+  REPLACE: "@@redux/REPLACE" + randomString(),
+  PROBE_UNKNOWN_ACTION: function PROBE_UNKNOWN_ACTION() {
+    return "@@redux/PROBE_UNKNOWN_ACTION" + randomString();
+  }
+};
+
+/**
+ * @param {any} obj The object to inspect.
+ * @returns {boolean} True if the argument appears to be a plain object.
+ */
+function isPlainObject(obj) {
+  if (typeof obj !== 'object' || obj === null) return false;
+  var proto = obj;
+
+  while (Object.getPrototypeOf(proto) !== null) {
+    proto = Object.getPrototypeOf(proto);
+  }
+
+  return Object.getPrototypeOf(obj) === proto;
+}
+
+/**
+ * Creates a Redux store that holds the state tree.
+ * The only way to change the data in the store is to call `dispatch()` on it.
+ *
+ * There should only be a single store in your app. To specify how different
+ * parts of the state tree respond to actions, you may combine several reducers
+ * into a single reducer function by using `combineReducers`.
+ *
+ * @param {Function} reducer A function that returns the next state tree, given
+ * the current state tree and the action to handle.
+ *
+ * @param {any} [preloadedState] The initial state. You may optionally specify it
+ * to hydrate the state from the server in universal apps, or to restore a
+ * previously serialized user session.
+ * If you use `combineReducers` to produce the root reducer function, this must be
+ * an object with the same shape as `combineReducers` keys.
+ *
+ * @param {Function} [enhancer] The store enhancer. You may optionally specify it
+ * to enhance the store with third-party capabilities such as middleware,
+ * time travel, persistence, etc. The only store enhancer that ships with Redux
+ * is `applyMiddleware()`.
+ *
+ * @returns {Store} A Redux store that lets you read the state, dispatch actions
+ * and subscribe to changes.
+ */
+
+function createStore(reducer, preloadedState, enhancer) {
+  var _ref2;
+
+  if (typeof preloadedState === 'function' && typeof enhancer === 'function' || typeof enhancer === 'function' && typeof arguments[3] === 'function') {
+    throw new Error(formatProdErrorMessage(0) );
+  }
+
+  if (typeof preloadedState === 'function' && typeof enhancer === 'undefined') {
+    enhancer = preloadedState;
+    preloadedState = undefined;
+  }
+
+  if (typeof enhancer !== 'undefined') {
+    if (typeof enhancer !== 'function') {
+      throw new Error(formatProdErrorMessage(1) );
+    }
+
+    return enhancer(createStore)(reducer, preloadedState);
+  }
+
+  if (typeof reducer !== 'function') {
+    throw new Error(formatProdErrorMessage(2) );
+  }
+
+  var currentReducer = reducer;
+  var currentState = preloadedState;
+  var currentListeners = [];
+  var nextListeners = currentListeners;
+  var isDispatching = false;
+  /**
+   * This makes a shallow copy of currentListeners so we can use
+   * nextListeners as a temporary list while dispatching.
+   *
+   * This prevents any bugs around consumers calling
+   * subscribe/unsubscribe in the middle of a dispatch.
+   */
+
+  function ensureCanMutateNextListeners() {
+    if (nextListeners === currentListeners) {
+      nextListeners = currentListeners.slice();
+    }
+  }
+  /**
+   * Reads the state tree managed by the store.
+   *
+   * @returns {any} The current state tree of your application.
+   */
+
+
+  function getState() {
+    if (isDispatching) {
+      throw new Error(formatProdErrorMessage(3) );
+    }
+
+    return currentState;
+  }
+  /**
+   * Adds a change listener. It will be called any time an action is dispatched,
+   * and some part of the state tree may potentially have changed. You may then
+   * call `getState()` to read the current state tree inside the callback.
+   *
+   * You may call `dispatch()` from a change listener, with the following
+   * caveats:
+   *
+   * 1. The subscriptions are snapshotted just before every `dispatch()` call.
+   * If you subscribe or unsubscribe while the listeners are being invoked, this
+   * will not have any effect on the `dispatch()` that is currently in progress.
+   * However, the next `dispatch()` call, whether nested or not, will use a more
+   * recent snapshot of the subscription list.
+   *
+   * 2. The listener should not expect to see all state changes, as the state
+   * might have been updated multiple times during a nested `dispatch()` before
+   * the listener is called. It is, however, guaranteed that all subscribers
+   * registered before the `dispatch()` started will be called with the latest
+   * state by the time it exits.
+   *
+   * @param {Function} listener A callback to be invoked on every dispatch.
+   * @returns {Function} A function to remove this change listener.
+   */
+
+
+  function subscribe(listener) {
+    if (typeof listener !== 'function') {
+      throw new Error(formatProdErrorMessage(4) );
+    }
+
+    if (isDispatching) {
+      throw new Error(formatProdErrorMessage(5) );
+    }
+
+    var isSubscribed = true;
+    ensureCanMutateNextListeners();
+    nextListeners.push(listener);
+    return function unsubscribe() {
+      if (!isSubscribed) {
+        return;
+      }
+
+      if (isDispatching) {
+        throw new Error(formatProdErrorMessage(6) );
+      }
+
+      isSubscribed = false;
+      ensureCanMutateNextListeners();
+      var index = nextListeners.indexOf(listener);
+      nextListeners.splice(index, 1);
+      currentListeners = null;
+    };
+  }
+  /**
+   * Dispatches an action. It is the only way to trigger a state change.
+   *
+   * The `reducer` function, used to create the store, will be called with the
+   * current state tree and the given `action`. Its return value will
+   * be considered the **next** state of the tree, and the change listeners
+   * will be notified.
+   *
+   * The base implementation only supports plain object actions. If you want to
+   * dispatch a Promise, an Observable, a thunk, or something else, you need to
+   * wrap your store creating function into the corresponding middleware. For
+   * example, see the documentation for the `redux-thunk` package. Even the
+   * middleware will eventually dispatch plain object actions using this method.
+   *
+   * @param {Object} action A plain object representing “what changed”. It is
+   * a good idea to keep actions serializable so you can record and replay user
+   * sessions, or use the time travelling `redux-devtools`. An action must have
+   * a `type` property which may not be `undefined`. It is a good idea to use
+   * string constants for action types.
+   *
+   * @returns {Object} For convenience, the same action object you dispatched.
+   *
+   * Note that, if you use a custom middleware, it may wrap `dispatch()` to
+   * return something else (for example, a Promise you can await).
+   */
+
+
+  function dispatch(action) {
+    if (!isPlainObject(action)) {
+      throw new Error(formatProdErrorMessage(7) );
+    }
+
+    if (typeof action.type === 'undefined') {
+      throw new Error(formatProdErrorMessage(8) );
+    }
+
+    if (isDispatching) {
+      throw new Error(formatProdErrorMessage(9) );
+    }
+
+    try {
+      isDispatching = true;
+      currentState = currentReducer(currentState, action);
+    } finally {
+      isDispatching = false;
+    }
+
+    var listeners = currentListeners = nextListeners;
+
+    for (var i = 0; i < listeners.length; i++) {
+      var listener = listeners[i];
+      listener();
+    }
+
+    return action;
+  }
+  /**
+   * Replaces the reducer currently used by the store to calculate the state.
+   *
+   * You might need this if your app implements code splitting and you want to
+   * load some of the reducers dynamically. You might also need this if you
+   * implement a hot reloading mechanism for Redux.
+   *
+   * @param {Function} nextReducer The reducer for the store to use instead.
+   * @returns {void}
+   */
+
+
+  function replaceReducer(nextReducer) {
+    if (typeof nextReducer !== 'function') {
+      throw new Error(formatProdErrorMessage(10) );
+    }
+
+    currentReducer = nextReducer; // This action has a similiar effect to ActionTypes.INIT.
+    // Any reducers that existed in both the new and old rootReducer
+    // will receive the previous state. This effectively populates
+    // the new state tree with any relevant data from the old one.
+
+    dispatch({
+      type: ActionTypes.REPLACE
+    });
+  }
+  /**
+   * Interoperability point for observable/reactive libraries.
+   * @returns {observable} A minimal observable of state changes.
+   * For more information, see the observable proposal:
+   * https://github.com/tc39/proposal-observable
+   */
+
+
+  function observable() {
+    var _ref;
+
+    var outerSubscribe = subscribe;
+    return _ref = {
+      /**
+       * The minimal observable subscription method.
+       * @param {Object} observer Any object that can be used as an observer.
+       * The observer object should have a `next` method.
+       * @returns {subscription} An object with an `unsubscribe` method that can
+       * be used to unsubscribe the observable from the store, and prevent further
+       * emission of values from the observable.
+       */
+      subscribe: function subscribe(observer) {
+        if (typeof observer !== 'object' || observer === null) {
+          throw new Error(formatProdErrorMessage(11) );
+        }
+
+        function observeState() {
+          if (observer.next) {
+            observer.next(getState());
+          }
+        }
+
+        observeState();
+        var unsubscribe = outerSubscribe(observeState);
+        return {
+          unsubscribe: unsubscribe
+        };
+      }
+    }, _ref[$$observable] = function () {
+      return this;
+    }, _ref;
+  } // When a store is created, an "INIT" action is dispatched so that every
+  // reducer returns their initial state. This effectively populates
+  // the initial state tree.
+
+
+  dispatch({
+    type: ActionTypes.INIT
+  });
+  return _ref2 = {
+    dispatch: dispatch,
+    subscribe: subscribe,
+    getState: getState,
+    replaceReducer: replaceReducer
+  }, _ref2[$$observable] = observable, _ref2;
+}
+
+const inicialState = {};
+///////////////////////////////     REDUCERS     ///////////////////////////////
+function formReducer(state = inicialState, action) {
+  switch (action.type) {
+    case FormActions.METADATA_LOADED:
+      return Object.assign(Object.assign({}, state), { formMetadata: action.payload });
+    case FormActions.CHANGE_TAB:
+      return Object.assign(Object.assign({}, state), { currentSheet: action.payload });
+    default:
+      return state;
+  }
+}
+/////////////////////////////// ACTION CREATORS ///////////////////////////////
+function loadMetadata(formMetadata) {
+  return {
+    type: FormActions.METADATA_LOADED,
+    payload: formMetadata
+  };
+}
+function changeTab(currentSheet) {
+  return {
+    type: FormActions.CHANGE_TAB,
+    payload: currentSheet
+  };
+}
+///////////////////////////////    SELECTORS    ///////////////////////////////
+function selectFormMetadata(state) {
+  return state.formMetadata;
+}
+function selectCurrentSheet(state) {
+  return state.currentSheet ? state.formMetadata.getSheet(state.currentSheet) : Array.from(state.formMetadata.getAllSheets().values())[0];
+}
+///////////////////////////////      TYPES      ///////////////////////////////
+var FormActions;
+(function (FormActions) {
+  FormActions["METADATA_LOADED"] = "FORM/METADATA_LOADED";
+  FormActions["CHANGE_TAB"] = "FORM/CHANGE_TAB";
+})(FormActions || (FormActions = {}));
+
+class DataBinder {
+  constructor(dataUnit) {
+    this._dataUnit = dataUnit;
+    this._fields = new Map();
+  }
+  bind(fields) {
+    fields.forEach(fieldElement => {
+      const fieldName = fieldElement.dataset.fieldName;
+      this.updateBind(fieldName, fieldElement);
+      this.updateValue(fieldName, fieldElement);
+    });
+  }
+  updateValue(fieldName, field) {
+    field["value"] = this._dataUnit.getFieldValue(fieldName);
+  }
+  updateBind(fieldName, field) {
+    const oldBind = this._fields.get(fieldName);
+    if (oldBind) {
+      oldBind.destroy();
+    }
+    this._fields.set(fieldName, Bind.create(fieldName, field, (fieldName, newValue) => this.setFieldValue(fieldName, newValue)));
+  }
+  setFieldValue(fieldName, newValue) {
+    if (this._dataUnit.records.length === 0) {
+      this._dataUnit.addRecord();
+    }
+    this._dataUnit.setFieldValue(fieldName, newValue);
+  }
+}
+class Bind {
+  destroy() {
+    this.field.removeEventListener(this.eventName, this.eventListener);
+  }
+  static create(fieldName, field, callback) {
+    const b = new Bind();
+    b.fieldName = fieldName;
+    b.field = field;
+    //FIXME: Verificar se o field é um EzField
+    b.eventListener = (evt) => { callback(fieldName, evt.detail); };
+    b.eventName = "ezChange";
+    b.field.addEventListener(b.eventName, b.eventListener);
+    return b;
+  }
+}
+
+class ApplicationUtils {
+  static async showDialog(title, message, icon = null, confirm, critical = false) {
+    return new Promise(resolve => {
+      let dialog = document.querySelector("ez-dialog");
+      if (!dialog) {
+        dialog = document.createElement("ez-dialog");
+        window.document.body.appendChild(dialog);
+      }
+      dialog.show(title, message, critical, confirm, icon).then(ok => resolve(ok));
+    });
+  }
+  static async alert(title, message, icon = null) {
+    return ApplicationUtils.showDialog(title, message, icon, false, false);
+  }
+  static async error(title, message, icon = null) {
+    return ApplicationUtils.showDialog(title, message, icon, false, true);
+  }
+  static async confirm(title, message, icon = null, critical = false) {
+    return ApplicationUtils.showDialog(title, message, icon, true, critical);
+  }
+  static async info(message) {
+    let toast = document.querySelector("ez-toast");
+    if (!toast) {
+      toast = document.createElement("ez-toast");
+      window.document.body.appendChild(toast);
+    }
+    toast.message = message;
+    toast.fadeTime = 4000;
+    toast.show();
+  }
+}
+
+const ezFormCss = "ez-form{display:flex;flex-direction:column;width:100%}";
+
+let EzForm = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+  }
+  submit() {
+    return Promise.resolve();
+  }
+  cancel() {
+    return Promise.resolve();
+  }
+  validate() {
+    return new Promise((accept, reject) => {
+      const metadata = selectFormMetadata(this._store.getState());
+      const requiredFields = this._staticFields
+        .filter(f => f.dataset.required)
+        .map(f => f.dataset.fieldName)
+        .concat(metadata.getRequiredFields());
+      const records = this.dataUnit.records;
+      for (let i = 0; i < records.length; i++) {
+        if (!this.validateRequired(requiredFields, records[i])) {
+          reject();
+          break;
+        }
+      }
+      accept();
+    });
+  }
+  validateRequired(requiredFields, record) {
+    const invalidFields = [];
+    requiredFields.forEach(field => {
+      const value = record[field];
+      const fieldElem = this._element.querySelector(`[data-field-name=${field}]`);
+      if (value === null || value === undefined || value === "") {
+        invalidFields.push(field);
+        fieldElem["errorMessage"] = "Essa informação é obrigatória";
+      }
+      else {
+        fieldElem["errorMessage"] = "";
+      }
+    });
+    const isValid = invalidFields.length === 0;
+    if (!isValid) {
+      ApplicationUtils.info("Há pelo menos um campo obrigatório não preenchido.");
+    }
+    return isValid;
+  }
+  getDynamicContent() {
+    var _a;
+    const formMD = selectFormMetadata(this._store.getState());
+    if (!formMD)
+      return null;
+    const currentSheet = selectCurrentSheet((_a = this._store) === null || _a === void 0 ? void 0 : _a.getState());
+    if (!currentSheet) {
+      return null;
+    }
+    const allSheets = Array.from(formMD.getAllSheets().values());
+    const result = [];
+    if (allSheets.length > 1) {
+      result.push(index.h("ez-tabselector", { onEzChange: (evt) => this._store.dispatch(changeTab(evt.detail)), selectedTab: currentSheet.name }, allSheets.map(s => index.h("ez-tab", { tabKey: s.name, label: s.label }))));
+    }
+    result.push(index.h(FormSheet, { store: this._store, source: currentSheet }));
+    return result;
+  }
+  processMetadata() {
+    if (!this.isStatic()) {
+      const metadata = this.config && this.config.length > 0 ? buildFromConfig(this.config, this.dataUnit) : buildFromDataUnit(this.dataUnit);
+      this._store.dispatch(loadMetadata(metadata));
+    }
+  }
+  isStatic() {
+    var _a;
+    return ((_a = this._staticFields) === null || _a === void 0 ? void 0 : _a.length) > 0;
+  }
+  componentWillLoad() {
+    if (this.dataUnit === undefined) {
+      this.dataUnit = new index$1.DataUnit("ez-form");
+    }
+    this.dataUnit.subscribe(action => {
+      if (action.type === index$1.Action.METADATA_LOADED) {
+        this.processMetadata();
+      }
+    });
+    this._dataBinder = new DataBinder(this.dataUnit);
+    this._store = createStore(formReducer);
+    this._store.subscribe(() => index.forceUpdate(this));
+    this._staticFields = Array.from(this._element.querySelectorAll("[data-field-name]"));
+    this.processMetadata();
+  }
+  componentDidRender() {
+    this._dataBinder.bind(Array.from(this._element.querySelectorAll("[data-field-name]")));
+  }
+  render() {
+    return (index.h(index.Host, null, this.isStatic() ? null : this.getDynamicContent()));
+  }
+  get _element() { return index.getElement(this); }
+};
+EzForm.style = ezFormCss;
+
+const ezNumberInputCss = ":host{display:block;width:100%}";
+
+let EzNumberInput = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.ezChange = index.createEvent(this, "ezChange", 7);
+    /**
+     * Deixa o campo disponível ou não para uso.
+     */
+    this.enabled = true;
+  }
+  setLabel() {
+    this._textInput.label = this.label;
+  }
+  setErrorMessage() {
+    this._textInput.errorMessage = this.errorMessage;
+  }
+  applyValueToInput() {
+    if (this._textInput) {
+      this._textInput.value = this.getTextValue(this.value);
+    }
+  }
+  changeValue(newValue) {
+    this.errorMessage = "";
+    if (newValue && newValue !== this.value) {
+      this.value = newValue;
+      this.ezChange.emit(this.value);
+    }
+  }
+  parseNumber() {
+    const parsedNumber = this._textInput.value ? index$1.NumberUtils.stringToNumber(this._textInput.value) : null;
+    if (parsedNumber != null && isNaN(parsedNumber)) {
+      this.errorMessage = "O valor digitado não é um número válido";
+    }
+    else {
+      try {
+        this.changeValue(parsedNumber);
+      }
+      catch (e) {
+        this.errorMessage = e.message;
+        return;
+      }
+    }
+  }
+  getTextValue(value) {
+    if (value) {
+      return this.precision > 0 ? index$1.NumberUtils.format(value.toString(), Number(this.precision), Number(this.prettyPrecision)) : value.toString();
+    }
+    return null;
+  }
+  componentDidLoad() {
+    CSSVarsUtils.CSSVarsUtils.applyVarsTextInput(this._elem, this._textInput);
+  }
+  render() {
+    return (index.h("ez-text-input", { ref: elem => this._textInput = elem, onBlur: () => this.parseNumber(), label: this.label, onEzChange: event => event.stopPropagation(), value: this.getTextValue(this.value), restrict: this.precision > 0 ? "0123456789-,." : "0123456789-", enabled: this.enabled, errorMessage: this.errorMessage }));
+  }
+  get _elem() { return index.getElement(this); }
+  static get watchers() { return {
+    "label": ["setLabel"],
+    "errorMessage": ["setErrorMessage"],
+    "value": ["applyValueToInput"]
+  }; }
+};
+EzNumberInput.style = ezNumberInputCss;
+
+const ezSearchCss = ":host{width:100%}";
+
+let EzSearch = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.ezChange = index.createEvent(this, "ezChange", 7);
+    this.showPopup = index.createEvent(this, "showPopup", 7);
+    /**
+     * Deixa o campo disponível ou não.
+     */
+    this.enabled = true;
+    /**
+   * Ajusta a opção de mostrar o "value" ao selecionar uma opção.
+   */
+    this.showSelectedValue = true;
+    /**
+     * Ajusta a opção de mostrar o "value" para cada opção.
+     */
+    this.showOptionValue = true;
+  }
+  updateValue() {
+    if (this._comboElement) {
+      this._comboElement.value = this.value;
+    }
+  }
+  onComboChange(evt) {
+    evt.stopPropagation();
+    this.value = evt.detail;
+    this.ezChange.emit(evt.detail);
+  }
+  componentDidLoad() {
+    CSSVarsUtils.CSSVarsUtils.applyVarsTextInput(this._elem, this._comboElement);
+  }
+  render() {
+    return (index.h("ez-combo-box", { ref: elem => this._comboElement = elem, value: this.value, label: this.label, enabled: this.enabled, errorMessage: this.errorMessage, optionLoader: this.optionLoader, searchMode: true, onEzChange: evt => this.onComboChange(evt), showSelectedValue: this.showSelectedValue, showOptionValue: this.showOptionValue }));
+  }
+  ;
+  get _elem() { return index.getElement(this); }
+  static get watchers() { return {
+    "value": ["updateValue"]
+  }; }
+};
+EzSearch.style = ezSearchCss;
+
+const ezTabselectorCss = "@keyframes activate{0%{clip-path:inset(calc(100% - 3px) 50% 0px 50%)}100%{clip-path:inset(calc(100% - 3px) 0px 0px 0px)}}:host{display:flex;position:relative;width:100%;overflow:hidden;--tabselector--backward-icon:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"16px\" width=\"10px\"><path d=\"M 9.7808475,13.860393 3.9204526,8.0000004 9.7808475,2.0624965 7.9301965,0.28895552 0.21915255,8.0000004 7.9301965,15.711044 Z\"/></svg>');--tabselector--forward-icon:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"16px\" width=\"10px\"><path d=\"M 0.21915251,13.860393 6.0795475,8.0000007 0.21915251,2.0624968 2.0698036,0.28895588 9.7808475,8.0000007 2.0698036,15.711044 Z\"/></svg>')}.scroll{display:flex;width:100%;scroll-behavior:smooth;overflow-x:auto;scrollbar-width:none}.scroll.startHidden{-webkit-mask-image:linear-gradient(90deg, transparent 20px, #000 48px)}.scroll.midle{-webkit-mask-image:linear-gradient(90deg, transparent 20px, #000 48px, #000 calc(100% - 48px), transparent calc(100% - 20px))}.scroll.endHidden{-webkit-mask-image:linear-gradient(90deg, #000 calc(100% - 48px), transparent calc(100% - 20px))}.tab{display:flex;border:none;min-width:100px;background-color:unset;cursor:pointer;padding:6px 12px;align-items:center;justify-content:center;color:var(--text--primary, #626e82);font-family:var(--font-pattern, \"Sora, Algerian\");font-size:var(--title--small, 14px)}.tab:focus,.forward-button,.backward-button{outline:none}.is-active{position:relative;color:var(--color--primary, #008561)}.is-active::after{content:\"\";position:absolute;width:100%;height:100%;background-color:var(--color--primary, #008561);clip-path:inset(calc(100% - 3px) 0px 0px 0px);animation:activate 0.25s ease-in-out}.is-focused{border:1px dashed var(--color--primary, #000000c5)}.tab-label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-shadow:var(--text-shadow);margin-bottom:var(--space--extra-small, 3px)}.forward-button,.backward-button{position:absolute;z-index:1;display:flex;box-sizing:border-box;padding:0px;top:0px;right:0px;width:16px;height:100%;border:none;background-color:unset;cursor:pointer;justify-content:center;align-items:center}.backward-button{left:0px}.forward-button::after,.backward-button::after{content:'';display:flex;background-color:var(--text--primary, #008561);width:10px;height:16px}.forward-button::after{-webkit-mask-image:var(--tabselector--forward-icon);mask-image:var(--tabselector--forward-icon)}.backward-button::after{-webkit-mask-image:var(--tabselector--backward-icon);mask-image:var(--tabselector--backward-icon)}.forward-button:hover::after,.backward-button:hover::after{background-color:var(--color--primary, #4e4e4e)}.hidden{display:none}.scroll::-webkit-scrollbar{display:none}";
+
+let EzTabselector = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.ezChange = index.createEvent(this, "ezChange", 7);
+    this.setFocusedParam = (ev) => {
+      if (ev.key === "Enter") {
+        this.selectedIndex = this.focusedIndex;
+        this.focusedIndex = undefined;
+        this.selectedTab = this._processedTabs[this.selectedIndex]["tabKey"];
+        this.handleTabClick(this.selectedTab, parseInt(this.selectedIndex));
+        ev.preventDefault();
+        this.setFocusedTab(this.selectedIndex);
+      }
+      else if (ev.key === "ArrowLeft" || ev.key === "ArrowRight") {
+        let operator = undefined;
+        if (ev.key === "ArrowLeft") {
+          operator = false;
+        }
+        else if (ev.key === "ArrowRight") {
+          operator = true;
+        }
+        else {
+          return;
+        }
+        if (this.focusedIndex === undefined) {
+          if (operator === false) {
+            this.focusedIndex = this.selectedIndex !== undefined ? (parseInt(this.selectedIndex) - 1).toString() : undefined;
+          }
+          else {
+            this.focusedIndex = this.selectedIndex !== undefined ? (parseInt(this.selectedIndex) + 1).toString() : undefined;
+          }
+        }
+        else {
+          if (operator === false) {
+            this.focusedIndex = (parseInt(this.focusedIndex) - 1).toString();
+          }
+          else {
+            this.focusedIndex = (parseInt(this.focusedIndex) + 1).toString();
+          }
+        }
+        if (parseInt(this.focusedIndex) < 0) {
+          this.focusedIndex = "0";
+        }
+        else if (parseInt(this.focusedIndex) > this._processedTabs.length - 1) {
+          this.focusedIndex = (this._processedTabs.length - 1).toString();
+        }
+        this.setFocusedBtn(true, this.focusedIndex);
+        this.setFocusedTab(this.focusedIndex);
+        this.ezChange.emit(this.selectedTab);
+      }
+      else if (ev.key === "Tab" || ev.key === "Escape") {
+        this.focusedIndex = undefined;
+        this.selectedTab = this._processedTabs[this.selectedIndex]["tabKey"];
+        this.handleTabClick(this.selectedTab, parseInt(this.selectedIndex));
+        ev.preventDefault();
+        this.setFocusedTab(this.selectedIndex);
+      }
+      // this.setFocusedTab();
+    };
+  }
+  handleTabClick(tab, index) {
+    this.selectedIndex = index.toString();
+    this.focusedIndex = undefined;
+    this.selectedTab = tab;
+    this.ezChange.emit(this.selectedTab);
+    this.setFocusedBtn(false, this.selectedIndex);
+  }
+  componentWillRender() {
+    if (!this._processedTabs) {
+      this._processedTabs = [];
+      if (this.tabs) {
+        this.tabs.split(",").forEach((label) => {
+          label = label.trim();
+          this._processedTabs.push(new Tab(label, label));
+        });
+      }
+      this._hostElem.querySelectorAll("ez-tab").forEach((elem) => {
+        const tabKey = elem.getAttribute("tabKey");
+        const label = elem.getAttribute("label");
+        const t = new Tab(label, tabKey);
+        const content = elem.firstChild;
+        if (content) {
+          content.setAttribute("slot", "tab" + this._processedTabs.length);
+          this._hostElem.appendChild(content);
+        }
+        this._processedTabs.push(t);
+      });
+    }
+  }
+  handleSlotChange(ev) {
+    const slot = ev.target;
+    const content = slot.assignedElements()[0];
+    if (content) {
+      content.style.marginLeft = "6px";
+    }
+  }
+  scrollBackward() {
+    const container = this._scrollContainer;
+    if (container) {
+      container.scrollLeft -= container.clientWidth;
+    }
+  }
+  scrollFoward() {
+    const container = this._scrollContainer;
+    if (container) {
+      let lastTab = null;
+      container.querySelectorAll(".tab").forEach((tab) => {
+        if (tab.getBoundingClientRect().right < container.clientWidth) {
+          lastTab = tab;
+        }
+      });
+      container.scrollLeft = lastTab.offsetLeft + lastTab.offsetWidth;
+    }
+  }
+  componentDidRender() {
+    this.updateScroll();
+  }
+  updateScroll() {
+    const container = this._scrollContainer;
+    if (container) {
+      const { scrollWidth, clientWidth, scrollLeft } = container;
+      const remainingScroll = scrollWidth - clientWidth - Math.ceil(scrollLeft);
+      this._startHidden = container.scrollLeft > 0;
+      this._endHidden = remainingScroll > 0;
+      if (this._startHidden) {
+        this._backwardButton.classList.remove("hidden");
+      }
+      else {
+        this._backwardButton.classList.add("hidden");
+      }
+      if (this._endHidden) {
+        this._forwardButton.classList.remove("hidden");
+      }
+      else {
+        this._forwardButton.classList.add("hidden");
+      }
+      const classNames = ["", "startHidden", "endHidden", "midle"];
+      const currentClass = classNames[Number(this._startHidden) | Number(this._endHidden) << 1];
+      classNames.forEach((name) => {
+        if (name !== currentClass && container.classList.contains(name)) {
+          container.classList.remove(name);
+        }
+      });
+      if (currentClass && !container.classList.contains(currentClass)) {
+        container.classList.add(currentClass);
+      }
+    }
+  }
+  domScrollHandler() {
+    window.clearTimeout(this._scrollCallBack);
+    this._scrollCallBack = window.setTimeout(() => { this.updateScroll(); }, 200);
+  }
+  setFocusedTab(index) {
+    window.clearTimeout(this._scrollCallBackTest);
+    this._scrollCallBackTest = window.setTimeout(() => {
+      const tabtoscroll = this._scrollContainer.querySelector(`#tab${index}`);
+      tabtoscroll.scrollIntoView();
+    }, 200);
+  }
+  getTextWidth(text) {
+    if (this._textMesurement === undefined) {
+      this._textMesurement = this._hostElem.shadowRoot.ownerDocument.createElement("canvas");
+    }
+    const context = this._textMesurement.getContext("2d");
+    context.font = "14px Sora, Algerian";
+    return Math.min(220, 24 + context.measureText(text).width) + "px";
+  }
+  ;
+  setFocusedBtn(visible, parameter) {
+    const tabsButtons = this._scrollContainer.querySelectorAll(".tab");
+    tabsButtons.forEach((el) => {
+      el.classList.remove("is-focused");
+      if (el.id === "tab" + parameter && visible) {
+        el.classList.add("is-focused");
+      }
+    });
+  }
+  render() {
+    return (index.h(index.Host, null, index.h("button", { class: "backward-button", ref: (el) => this._backwardButton = el, onClick: () => this.scrollBackward() }), index.h("div", { class: "scroll", ref: (el) => this._scrollContainer = el, onScroll: () => this.domScrollHandler(), onKeyDown: (ev) => this.setFocusedParam(ev) }, this._processedTabs.map((tab, index$1) => {
+      const labelStyle = { "min-width": this.getTextWidth(tab.label) };
+      const tabId = "tab" + index$1;
+      const isSelected = index$1 === parseInt(this.selectedIndex) || (this.selectedTab && tab.tabKey === this.selectedTab);
+      if (isSelected) {
+        this.selectedTab = tab.tabKey;
+        this.selectedIndex = index$1.toString();
+      }
+      return index.h("button", { id: tabId, class: `tab${isSelected ? " is-active" : ""}`, onClick: () => this.handleTabClick(tab.tabKey, index$1), style: labelStyle }, index.h("span", { class: "tab-label", title: tab.label }, tab.label), index.h("slot", { name: tabId, onSlotchange: (ev) => { this.handleSlotChange(ev); } }));
+    })), index.h("button", { class: "forward-button", ref: (el) => this._forwardButton = el, onClick: () => this.scrollFoward() })));
+  }
+  get _hostElem() { return index.getElement(this); }
+};
+class Tab {
+  constructor(label, tabKey) {
+    this.label = label;
+    this.tabKey = tabKey;
+  }
+}
+EzTabselector.style = ezTabselectorCss;
+
+const ezTextAreaCss = ":host{--text-area--width:100%;--text-area--border-radius:var(--border--radius-medium, 12px);--text-area--font-size:var(--text--medium, 14px);--text-area--font-family:var(--font-pattern, Arial);--text-area--font-weight:var(--text-weight--large, 500);--text-area--color:var(--title--primary, #000);--text-area__input--background-color:var(--background--medium, #e0e0e0);--text-area__input--border:var(--border--medium, 2px solid);--text-area__input--border-color:var(--text-area__input--background-color);--text-area__input--focus--border-color:var(--color--primary, #008561);--text-area__input--disabled--background-color:var(--color--disable-secondary, #F2F5F8);--text-area__input--disabled--color:var(--text--disable, #AFB6C0);--text-area__input--error--border-color:#CC2936;--text-area__message_box--font-size:var(--text--small, 12px);--text-area__message_box--info--color:var(--color--success, #22085d);--text-area__message_box--error--color:var(--color--error, #FF0000);--text-area__label--floating--top:6px;--text-area__label--padding-top:12px;--text-area__label--padding-left:14px;--text-area__label--padding-right:12px;display:flex;flex-wrap:wrap;position:relative;width:var(--text-area--width)}textarea{box-sizing:border-box;border:none;resize:none;margin-top:calc(var(--space--medium, 12px) + 4px);width:100%;font-weight:var(--text-weight--large, 600);font-family:var(--text-area--font-family);font-size:var(--text-area--font-size);color:var(--text-area--color);padding:0;background:none}textarea:focus{outline:none}textarea:disabled{background-color:transparent;color:var(--text-area__input--disabled--color)}.textarea{width:100%;box-sizing:border-box;padding-left:var(--space--medium);padding-right:var(--space--extra-small);border-radius:var(--text-area--border-radius);border:var(--text-area__input--border);border-color:var(--text-area__input--border-color);background-color:var(--text-area__input--background-color)}.textarea--focus{border-color:var(--text-area__input--focus--border-color)}.textarea.hasError{color:var(--text-area--color);border-color:var(--text-area__input--error--border-color)}.message-box{min-height:16px;min-width:100%;margin-top:2px;line-height:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--text-area--font-family);font-size:var(--text-area__message_box--font-size);color:var(--text-area__message_box--info--color)}.hasError{color:var(--text-area__message_box--error--color)}.textarea__label{box-sizing:border-box;position:absolute;z-index:var(--visible);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-transition:font-size .05s, top .05s;transition:font-size .05s, top .05s;width:calc(100% - var(--text-area__label--padding-right));left:var(--text-area--space--medium);font-family:var(--text-area--font-family);font-size:var(--text-area--font-size);font-weight:var(--text-area--font-weight);color:var(--text-area--color);top:var(--text-area__label--padding-top);left:var(--text-area__label--padding-left);padding-right:var(--text-area__label--padding-right)}.textarea__label--floated{font-family:var(--text-area--font-family);font-size:var(--text--extra-small);color:var(--text--primary);top:var(--text-area__label--floating--top)}.textarea__label--disabled{color:var(--text-area__input--disabled--color)}";
+
+let EzTextArea = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.ezChange = index.createEvent(this, "ezChange", 7);
+    /**
+     * Deixa o campo disponível ou não para digitação.
+     */
+    this.enabled = true;
+    /**
+     * Ajusta o número de linhas e consequentemente o height do textarea. Valor default: 4
+     */
+    this.rows = 4;
+  }
+  showError() {
+    const hasError = typeof this.errorMessage === 'string' && this.errorMessage !== '';
+    if (hasError) {
+      this._container.classList.add('hasError');
+      this._messageBoxElem.classList.add('hasError');
+    }
+    else {
+      this._container.classList.remove('hasError');
+      this._messageBoxElem.classList.remove('hasError');
+    }
+  }
+  updateInputValue() {
+    this._inputElem.value = this.value;
+    this.handleChange();
+    this.adjustFloatingLabel();
+    this.ezChange.emit(this.value);
+  }
+  adjustFloatingLabel() {
+    if (this.label) {
+      const hasValue = this.value && this.value.toString().length > 0;
+      const containsFloatedClass = this._labelElem.classList.contains("textarea__label--floated");
+      if (hasValue || this.isFocused()) {
+        if (!containsFloatedClass) {
+          this._labelElem.classList.add("textarea__label--floated");
+        }
+      }
+      else {
+        if (containsFloatedClass) {
+          this._labelElem.classList.remove("textarea__label--floated");
+        }
+      }
+    }
+  }
+  isFocused() {
+    return this._hostElement.shadowRoot.activeElement !== null;
+  }
+  //---------------------------------------------
+  // Public methods
+  //---------------------------------------------
+  /**
+   * Faz o foco no componente de input
+   */
+  async setFocus() {
+    this._inputElem.focus();
+  }
+  /**
+   * Remove o foco no componente de input
+   */
+  async setBlur() {
+    this._inputElem.blur();
+  }
+  //---------------------------------------------
+  // Event handlers
+  //---------------------------------------------
+  handleFocusout() {
+    this.adjustFloatingLabel();
+    if (this._container && this._container.classList.contains("textarea--focus")) {
+      this._container.classList.remove("textarea--focus");
+    }
+  }
+  handleChange() {
+    this.errorMessage = "";
+    this.value = this._inputElem.value;
+  }
+  handleFocus() {
+    if (this.label && this._labelElem && !this._labelElem.classList.contains("textarea__label--floated")) {
+      this._labelElem.classList.add("textarea__label--floated");
+    }
+    if (this._container && !this._container.classList.contains("textarea--focus")) {
+      this._container.classList.add("textarea--focus");
+    }
+  }
+  //---------------------------------------------
+  // Lifecycle web component
+  //---------------------------------------------
+  componentDidLoad() {
+    this.showError();
+    this.adjustFloatingLabel();
+  }
+  render() {
+    return (index.h(index.Host, null, index.h("div", { class: "textarea", ref: (el) => this._container = el }, this.label ?
+      index.h("label", { ref: (el) => this._labelElem = el, class: this.enabled ? "textarea__label" : "textarea__label textarea__label--disabled", onClick: () => this._inputElem.focus(), title: this.label }, this.label)
+      : null, index.h("textarea", { onFocus: () => this.handleFocus(), ref: (el) => this._inputElem = el, value: this.value, disabled: !this.enabled, onInput: () => { this.handleChange(); }, onFocusout: () => { this.handleFocusout(); }, onKeyDown: event => event.stopPropagation(), rows: this.rows })), index.h("span", { class: "message-box", ref: (el) => this._messageBoxElem = el, title: this.errorMessage }, this.errorMessage)));
+  }
+  get _hostElement() { return index.getElement(this); }
+  static get watchers() { return {
+    "errorMessage": ["showError"],
+    "value": ["updateInputValue"]
+  }; }
+};
+EzTextArea.style = ezTextAreaCss;
+
+const ezTextInputCss = ":host{--ez-text-input--height:42px;--ez-text-input--width:100%;--ez-text-input__icon--width:48px;--ez-text-input--border-radius:var(--border--radius-medium, 12px);--ez-text-input--font-size:var(--text--medium, 14px);--ez-text-input--font-family:var(--font-pattern, Arial);--ez-text-input--font-weight:var(--text-weight--large, 500);--ez-text-input--color:var(--title--primary, #000);--ez-text-input__input--background-color:var(--background--medium, #e0e0e0);--ez-text-input__input--border:var(--border--medium, 2px solid);--ez-text-input__input--border-color:var(--ez-text-input__input--background-color);--ez-text-input__input--focus--border-color:var(--color--alert-cold-800, #042EFF);--ez-text-input__input--disabled--background-color:var(--color--disable-secondary, #F2F5F8);--ez-text-input__input--disabled--color:var(--text--disable, #AFB6C0);--ez-text-input__input--error--border-color:#CC2936;--ez-text-input__message_box--font-size:var(--text--small, 12px);--ez-text-input__message_box--info--color:var(--color--success, #22085d);--ez-text-input__message_box--error--color:var(--color--error, #FF0000);--ez-text-input__label--floating--top:6px;--ez-text-input__label--padding-top:12px;--ez-text-input__label--padding-left:14px;--ez-text-input__label--padding-right:12px;display:flex;flex-wrap:wrap;position:relative;width:var(--ez-text-input--width)}input{width:100%;box-sizing:border-box;padding:var(--space--medium, 6px);font-weight:var(--text-weight--large, 600);height:var(--ez-text-input--height);border-radius:var(--ez-text-input--border-radius);font-family:var(--ez-text-input--font-family);font-size:var(--ez-text-input--font-size);border:var(--ez-text-input__input--border);border-color:var(--ez-text-input__input--border-color);background-color:var(--ez-text-input__input--background-color);color:var(--ez-text-input--color)}input:disabled{background-color:var(--ez-text-input__input--disabled--background-color);color:var(--ez-text-input__input--disabled--color)}input:focus{outline:none;border-color:var(--ez-text-input__input--focus--border-color)}input.icon--left{padding-left:var(--ez-text-input__icon--width)}input.icon--right{padding-right:var(--ez-text-input__icon--width)}input.hasError{color:var(--ez-text-input--color);border-color:var(--ez-text-input__input--error--border-color)}input.text--right{text-align:right}.message-box{display:flex;min-height:16px;min-width:100%;margin-top:2px;line-height:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--ez-text-input--font-family);font-size:var(--ez-text-input__message_box--font-size);color:var(--ez-text-input__message_box--info--color)}.hasError{color:var(--ez-text-input__message_box--error--color)}.input__label{box-sizing:border-box;position:absolute;z-index:var(--visible);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-transition:font-size .05s, top .05s;transition:font-size .05s, top .05s;width:calc(100% - var(--ez-text-input__label--padding-right));left:var(--ez-text-input--space--medium);font-family:var(--ez-text-input--font-family);font-size:var(--ez-text-input--font-size);font-weight:var(--ez-text-input--font-weight);color:var(--ez-text-input--color);top:var(--ez-text-input__label--padding-top);left:var(--ez-text-input__label--padding-left);padding-right:var(--ez-text-input__label--padding-right)}.input__label--floated{font-family:var(--ez-text-input--font-family);font-size:var(--text--extra-small);color:var(--text--primary);top:var(--ez-text-input__label--floating--top)}.input__label--disabled{color:var(--ez-text-input__input--disabled--color)}.input__label--left{text-align:left;left:calc(var(--ez-text-input__icon--width) + 2px);width:calc(100% - var(--ez-text-input__icon--width))}.input__label--right{right:var(--ez-text-input__icon--width);width:calc(100% - var(--ez-text-input__icon--width))}.input__label--left.input__label--right{left:calc(var(--ez-text-input__icon--width) + 2px);width:calc(100% - var(--ez-text-input__icon--width) * 2)}.input--with--label{padding-bottom:0}";
+
+let EzTextInput = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.ezChange = index.createEvent(this, "ezChange", 7);
+    /**
+     * Deixa o campo disponível ou não para digitação.
+     */
+    this.enabled = true;
+  }
+  showError() {
+    const hasError = typeof this.errorMessage === "string" && this.errorMessage !== "";
+    if (hasError) {
+      this._inputElem.classList.add("hasError");
+      this._messageBoxElem.classList.add("hasError");
+    }
+    else {
+      this._inputElem.classList.remove("hasError");
+      this._messageBoxElem.classList.remove("hasError");
+    }
+  }
+  prepareMask() {
+    if (this.mask) {
+      if (this._maskFormatter == undefined) {
+        this._maskFormatter = new index$1.MaskFormatter(this.mask);
+      }
+      else {
+        this._maskFormatter.mask = this.mask;
+      }
+    }
+  }
+  updateInputValue() {
+    if (this._inputElem) {
+      this._inputElem.value = this.value;
+    }
+    this.handleChange();
+    this.errorMessage = "";
+    this.ezChange.emit(this.value);
+    this.adjustFloatingLabel();
+  }
+  adjustFloatingLabel() {
+    if (this.label && this._labelElem) {
+      if (this._inputElem && !this._inputElem.classList.contains("input--with--label")) {
+        this._inputElem.classList.add("input--with--label");
+      }
+      const hasValue = this.value && this.value.toString().length > 0;
+      const containsFloatedClass = this._labelElem.classList.contains("input__label--floated");
+      if (hasValue || this.isFocused()) {
+        if (!containsFloatedClass) {
+          this._labelElem.classList.add("input__label--floated");
+        }
+      }
+      else {
+        if (containsFloatedClass) {
+          this._labelElem.classList.remove("input__label--floated");
+        }
+      }
+    }
+  }
+  isFocused() {
+    return this._hostElement.shadowRoot.activeElement !== null;
+  }
+  //---------------------------------------------
+  // Public methods
+  //---------------------------------------------
+  /**
+   * Faz o foco no componente de input
+   */
+  async setFocus() {
+    this._inputElem.focus();
+  }
+  /**
+   * Remove o foco no componente de input
+   */
+  async setBlur() {
+    this._inputElem.blur();
+  }
+  //---------------------------------------------
+  // Event handlers
+  //---------------------------------------------
+  handleFocusout() {
+    const value = this._inputElem.value;
+    if (value && this._maskFormatter) {
+      try {
+        this._inputElem.value = this._maskFormatter.format(value);
+      }
+      catch (e) {
+        this.errorMessage = e.message;
+      }
+    }
+    this.value = this._inputElem.value;
+    this.adjustFloatingLabel();
+  }
+  isValidValue(value) {
+    if (this.restrict) {
+      return Array.from(value).reduce((valid, c) => valid && this.restrict.indexOf(c) > -1, true);
+    }
+    return true;
+  }
+  handleChange() {
+    if (!this._inputElem) {
+      return;
+    }
+    const value = this._inputElem.value;
+    if (this.isValidValue(value)) {
+      this._lastValidValue = value;
+    }
+    else {
+      this._inputElem.value = this._lastValidValue === undefined ? "" : this._lastValidValue;
+    }
+    this.value = this._inputElem.value;
+  }
+  handleSlotChange(ev) {
+    const slot = ev.target;
+    const content = slot.assignedElements()[0];
+    if (content) {
+      content.style.position = "absolute";
+      content.style.display = "flex";
+      content.style.alignItems = "center";
+      content.style.justifyContent = "center";
+      content.style.overflow = "hidden";
+      content.style.top = "0px";
+      content.style.width = "var(--ez-text-input__icon--width)";
+      content.style.height = "var(--ez-text-input--height)";
+      if (slot.name == "leftIcon") {
+        content.style.left = "0px";
+        content.style.borderRadius = "var(--ez-text-input--border-radius) 0 0 var(--ez-text-input--border-radius)";
+        this._inputElem.classList.add("icon--left");
+        if (this._labelElem) {
+          this._labelElem.classList.add("input__label--left");
+        }
+      }
+      else if (slot.name == "rightIcon") {
+        content.style.right = "0px";
+        content.style.borderRadius = "0 var(--ez-text-input--border-radius) var(--ez-text-input--border-radius) 0";
+        this._inputElem.classList.add("icon--right");
+        if (this._labelElem) {
+          this._labelElem.classList.add("input__label--right");
+        }
+      }
+    }
+    this.showError();
+  }
+  doFocus() {
+    if (this.label && this._labelElem && !this._labelElem.classList.contains("input__label--floated")) {
+      this._labelElem.classList.add("input__label--floated");
+    }
+  }
+  //---------------------------------------------
+  // Lifecycle web component
+  //---------------------------------------------
+  componentDidLoad() {
+    this.showError();
+    this.prepareMask();
+    this.adjustFloatingLabel();
+  }
+  componentWillLoad() {
+    this.prepareMask();
+    if (this.value) {
+      if (this._maskFormatter) {
+        try {
+          this.value = this._maskFormatter.format(this.value);
+        }
+        catch (e) {
+          this.errorMessage = e.message;
+        }
+      }
+      if (!this.isValidValue(this.value)) {
+        this._lastValidValue = "";
+        this.value = "";
+      }
+    }
+  }
+  render() {
+    return (index.h(index.Host, null, index.h("slot", { name: "leftIcon", onSlotchange: (ev) => { this.handleSlotChange(ev); } }), this.label ?
+      index.h("label", { ref: (el) => this._labelElem = el, class: this.enabled ? "input__label" : "input__label input__label--disabled", onClick: () => this._inputElem.focus(), title: this.label }, this.label)
+      : null, index.h("input", { onFocus: () => this.doFocus(), ref: (el) => this._inputElem = el, type: "text", value: this.value, disabled: !this.enabled, onInput: () => { this.handleChange(); }, onFocusout: () => { this.handleFocusout(); } }), index.h("slot", { name: "rightIcon", onSlotchange: (ev) => { this.handleSlotChange(ev); } }), index.h("span", { class: "message-box", ref: (el) => this._messageBoxElem = el, title: this.errorMessage }, this.errorMessage)));
+  }
+  get _hostElement() { return index.getElement(this); }
+  static get watchers() { return {
+    "errorMessage": ["showError"],
+    "mask": ["prepareMask"],
+    "value": ["updateInputValue"]
+  }; }
+};
+EzTextInput.style = ezTextInputCss;
+
+class RemoteFile {
+  constructor(file) {
+    this.file = file;
+    this.size = file.size;
+    this.name = file.name;
+  }
+  abortUpload() {
+    if (this._uploadingXhr) {
+      this._aborted = true;
+      this._uploadingXhr.abort();
+      this._uploadingXhr = undefined;
+    }
+  }
+  isUploading() {
+    return this._uploadingXhr !== undefined;
+  }
+  async upload(server, headers, updateCallBack) {
+    return new Promise((resolve, reject) => {
+      const xhr = new XMLHttpRequest();
+      this._uploadingXhr = xhr;
+      this._aborted = false;
+      this.progress = 0;
+      xhr.upload.onprogress = (e) => {
+        const loaded = e.loaded;
+        const total = e.total;
+        this.progress = ~~((loaded / total) * 100);
+        updateCallBack(this, loaded, total);
+      };
+      xhr.onreadystatechange = () => {
+        if (xhr.readyState == 4) {
+          this._uploadingXhr = undefined;
+          const status = xhr.status;
+          if (!this._aborted) {
+            if (status === 0) {
+              reject("Servidor indisponível");
+            }
+            else if (status >= 500) {
+              reject("Erro inesperado no servidor");
+            }
+            else if (status >= 400) {
+              reject("Operação não permitida");
+            }
+          }
+          const response = xhr.response;
+          if (response) {
+            resolve(JSON.parse(response));
+          }
+        }
+      };
+      xhr.ontimeout = () => {
+        reject("Tempo limite de transferência atingido.");
+      };
+      const formData = new FormData();
+      formData.append("ARQUIVO", this.file, this.file.name);
+      xhr.open("POST", server, true);
+      if (headers) {
+        headers.forEach((value, key) => xhr.setRequestHeader(key, value));
+      }
+      xhr.send(formData);
+    });
+  }
+  async delete(item, server, headers) {
+    return new Promise((resolve, reject) => {
+      const xhr = new XMLHttpRequest();
+      xhr.onreadystatechange = () => {
+        if (xhr.readyState == 4) {
+          if (xhr.status === 0) {
+            reject("Servidor indisponível");
+          }
+          else if (xhr.status >= 500) {
+            reject("Erro inesperado no servidor");
+          }
+          else if (xhr.status >= 400) {
+            reject("Operação não permitida");
+          }
+          resolve(true);
+        }
+      };
+      xhr.ontimeout = () => {
+        reject("Tempo limite de remoção atingido.");
+      };
+      xhr.open("DELETE", server, true);
+      if (headers) {
+        headers.forEach((value, key) => xhr.setRequestHeader(key, value));
+      }
+      xhr.send(JSON.stringify(item));
+    });
+  }
+}
+
+const ezUploadCss = ":host{--ez-upload--height:42px;--ez-upload--width:100%;--ez-upload__icon--width:48px;--ez-upload__container--background-color:var(--background--medium, #d2dce9);--ez-upload__color--primary:var(--color--primary, #008561);--ez-upload--padding--extra-small:var(--space--extra-small, 3px);--ez-upload--padding--small:var(--space--small, 6px);--ez-upload--padding--medium:var(--space--medium, 12px);--ez-upload--padding--large:var(--space--large, 24px);--ez-upload__border--color:var(--color-strokes, #DCE0E8);--ez-upload--text-shadow:var(--text-shadow, 0 0 0 #353535, 0 0 1px transparent);--ez-upload--text--primary:var(--text-primary, #626e82);--ez-upload--font-size:var(--text--medium, 14px);--ez-upload--font-family:var(--font-pattern, Arial);--ez-upload--font-weight:var(--text-weight--large, 500);--ez-upload__btn__cancel-image:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"8x\" width=\"8px\"><path d=\"M 8,0.8 7.2,0 4,3.2 0.8,0 0,0.8 3.2,4 0,7.2 0.8,8 4,4.8 7.2,8 8,7.2 4.8,4 Z\"/></svg>');--ez-upload__file-icon-image:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"11x\" width=\"9px\"><path d=\"M 1.2272719,8.4999999 V 2.75 c 0,-1.1045695 1.4652499,-2 3.2727273,-2 1.8074777,0 3.2727281,0.8954305 3.2727281,2 V 8.9999999 C 7.7727273,9.690356 6.8569456,10.25 5.7272719,10.25 4.5975985,10.25 3.6818174,9.690356 3.6818174,8.9999999 V 3.75 c 0,-0.2761425 0.3663125,-0.5 0.8181818,-0.5 0.4518694,0 0.8181818,0.2238575 0.8181818,0.5 V 8.4999999 H 6.5454537 V 3.75 C 6.5454537,3.059644 5.6296725,2.5 4.4999992,2.5 3.3703258,2.5 2.4545446,3.059644 2.4545446,3.75 V 8.9999999 C 2.4545446,10.10457 3.9197945,11 5.7272719,11 7.5347496,11 9,10.10457 9,8.9999999 V 2.75 C 9,1.231217 6.9852809,0 4.4999992,0 2.0147181,5e-7 0,1.231217 0,2.75 v 5.7499999 z\"/></svg>');display:flex;flex-wrap:wrap;position:relative;font-family:var(--ez-upload--font-family);font-size:var(--ez-upload--font-size);width:var(--ez-upload--width);font-weight:var(--ez-upload--font-weight)}.iu{display:flex;flex-wrap:wrap;background-color:var(--ez-upload__container--background-color);padding:var(--ez-upload--padding--small);width:100%;border-radius:12px;box-sizing:border-box}.iu__container{width:100%;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;border:2px dashed var(--ez-upload__border--color);border-radius:6px;box-sizing:border-box}.iu__footer{display:flex;flex-wrap:wrap;justify-content:flex-start;width:100%;padding:0 var(--ez-upload--padding--medium) var(--ez-upload--padding--medium) var(--ez-upload--padding--medium);box-sizing:border-box}.iu__item{display:flex;width:100%;justify-content:flex-start;align-items:center;align-self:center;padding-bottom:var(--ez-upload--padding--extra-small);box-sizing:border-box;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.iu__item-label{display:flex;max-width:80%;align-self:stretch;align-items:center}.file__name{font-weight:200}.box__content{width:100%;justify-content:center;align-items:center;height:100%;border:1px dashed var(--ez-upload__border--color);border-radius:6px;box-sizing:border-box}.box__container{display:flex;flex-wrap:wrap;background-color:var(--ez-upload__container--background-color);padding:6px;width:100%;border-radius:12px}a:-webkit-any-link{color:#008561;fill:#008561;cursor:pointer;text-decoration:none}progress[value]{display:flex;width:100%;appearance:none;border:1px solid var(--ez-upload__border--color);height:12px;justify-content:flex-start;align-items:center;border-radius:3px;position:relative}progress[value]::-webkit-progress-bar{display:flex;-webkit-appearance:none;width:100%;background-color:rgb(255, 255, 255);border-radius:2px;padding:2px}progress[value]::-webkit-progress-value{display:flex;width:100%;background-color:var(--ez-upload__color--primary)}.text--center{text-align:center}.align--middle{align-self:center;align-items:center}.text{font-family:\"Sora\", \"Algerian\";text-shadow:0 0 0 #353535, 0 0 1px transparent}.text--primary{color:var(--ez-upload--text--primary);text-shadow:var(--ez-upload--text-shadow)}.text--ellipsis{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.text--medium{font-size:14px}.text--small{font-size:12px}.btn-cancel{outline:none;border:none;background-color:unset;cursor:pointer}.btn-cancel::after{content:'';display:flex;background-color:var(--text--primary, #008561);width:8px;height:8px;-webkit-mask-image:var(--ez-upload__btn__cancel-image);mask-image:var(--ez-upload__btn__cancel-image)}.iu_header{display:flex;flex-direction:column;width:100%}.iu__label{padding:var(--space--small);box-sizing:border-box;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--ez-upload--font-family);font-size:var(--text--extra-small);font-weight:var(--ez-upload--font-weight);color:var(--ez-upload--text--primary);text-shadow:var(--ez-upload--text-shadow)}.iu__file-icon{outline:none;border:none;background-color:unset;cursor:pointer}.iu__file-icon:disabled{cursor:unset}.iu__file-icon::after{content:'';display:flex;background-color:var(--text--primary, #626e82);width:9px;height:11px;-webkit-mask-image:var(--ez-upload__file-icon-image);mask-image:var(--ez-upload__file-icon-image)}.iu__file-icon:disabled::after{background-color:var(--text--disable, #AFB6C0)}.iu__icon-label{justify-content:center;display:flex;cursor:pointer;padding:var(--ez-upload--padding--large) 0px;box-sizing:border-box}.background--disabled{background-color:var(--color--disable-secondary, #F2F5F8)}.text--disabled{color:var(--text--disable, #AFB6C0)}.mouse-pointer--disabled{cursor:unset}.row{width:100%;display:flex;flex-wrap:wrap}.col{display:flex;flex-wrap:wrap;align-self:flex-start;box-sizing:border-box}.col--stretch{align-self:stretch}.col--undefined{width:unset}.col--nowrap{flex-wrap:nowrap}@media screen and (min-width: 320px){.col--sd-1{width:8.33333%}.col--sd-2{width:16.66667%}.col--sd-3{width:25%}.col--sd-4{width:33.33333%}.col--sd-5{width:41.66667%}.col--sd-6{width:50%}.col--sd-7{width:58.33333%}.col--sd-8{width:66.66667%}.col--sd-9{width:75%}.col--sd-10{width:83.33333%}.col--sd-11{width:91.66667%}.col--sd-12{width:100%}}@media screen and (min-width: 480px){.col--pn-1{width:8.33333%}.col--pn-2{width:16.66667%}.col--pn-3{width:25%}.col--pn-4{width:33.33333%}.col--pn-5{width:41.66667%}.col--pn-6{width:50%}.col--pn-7{width:58.33333%}.col--pn-8{width:66.66667%}.col--pn-9{width:75%}.col--pn-10{width:83.33333%}.col--pn-11{width:91.66667%}.col--pn-12{width:100%}}@media screen and (min-width: 768px){.col--tb-1{width:8.33333%}.col--tb-2{width:16.66667%}.col--tb-3{width:25%}.col--tb-4{width:33.33333%}.col--tb-5{width:41.66667%}.col--tb-6{width:50%}.col--tb-7{width:58.33333%}.col--tb-8{width:66.66667%}.col--tb-9{width:75%}.col--tb-10{width:83.33333%}.col--tb-11{width:91.66667%}.col--tb-12{width:100%}}@media screen and (min-width: 992px){.col--md-1{width:8.33333%}.col--md-2{width:16.66667%}.col--md-3{width:25%}.col--md-4{width:33.33333%}.col--md-5{width:41.66667%}.col--md-6{width:50%}.col--md-7{width:58.33333%}.col--md-8{width:66.66667%}.col--md-9{width:75%}.col--md-10{width:83.33333%}.col--md-11{width:91.66667%}.col--md-12{width:100%}}@media screen and (min-width: 1200px){.col--ld-1{width:8.33333%}.col--ld-2{width:16.66667%}.col--ld-3{width:25%}.col--ld-4{width:33.33333%}.col--ld-5{width:41.66667%}.col--ld-6{width:50%}.col--ld-7{width:58.33333%}.col--ld-8{width:66.66667%}.col--ld-9{width:75%}.col--ld-10{width:83.33333%}.col--ld-11{width:91.66667%}.col--ld-12{width:100%}}";
+
+let EzUpload = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.ezChange = index.createEvent(this, "ezChange", 7);
+    this._filePointers = new Map();
+    /**
+    * Deixa o campo disponível ou não para digitação.
+    */
+    this.enabled = true;
+  }
+  changeValue(newValue) {
+    if (newValue !== this._updatingValue) {
+      this._filePointers.forEach(f => {
+        if (this.isRemoteFile(f)) {
+          f.abortUpload();
+        }
+      });
+      this._filePointers = new Map();
+      this.updateFilePointers();
+    }
+    this._updatingValue = undefined;
+  }
+  updateFilePointers() {
+    if (this.value) {
+      this.value.forEach(ezFile => this._filePointers.set(ezFile.name, ezFile));
+    }
+  }
+  normalizeRequestHeaders() {
+    this._requestHeaders = new Map();
+    if (typeof this.requestHeaders == "string") {
+      try {
+        this.requestHeaders = JSON.parse(this.requestHeaders);
+      }
+      catch (e) {
+        this.requestHeaders = undefined;
+      }
+    }
+    for (var key in this.requestHeaders) {
+      this._requestHeaders.set(key, this.requestHeaders[key]);
+    }
+  }
+  /**
+  * Método responsável por adicionar um ou mais arquivos ao componente.
+  */
+  async addFiles(files) {
+    if (this.maxFiles > 0) {
+      let countDistinctFiles = this._filePointers.size;
+      files.forEach(file => {
+        if (!this._filePointers.has(file.name)) {
+          countDistinctFiles++;
+        }
+      });
+      if (countDistinctFiles > this.maxFiles) {
+        this.showError(`A quantidade máxima de arquivos é ${this.maxFiles}.`);
+        return;
+      }
+    }
+    Array.prototype.forEach.call(files, this.addFile.bind(this));
+  }
+  async addFile(file) {
+    const oldFile = this._filePointers.get(file.name);
+    if (oldFile) {
+      ApplicationUtils.confirm("Substituir arquivo", `Já existe um arquivo chamado "${file.name}". Deseja substituí-lo?`)
+        .then(ok => {
+        if (ok) {
+          if (this.isRemoteFile(oldFile)) {
+            oldFile.abortUpload();
+          }
+          this.doAddFile(file);
+        }
+      });
+    }
+    else {
+      this.doAddFile(file);
+    }
+  }
+  async doAddFile(file) {
+    if (this.validateFile(file)) {
+      const uploadingFile = new RemoteFile(file);
+      this._filePointers.set(file.name, uploadingFile);
+      uploadingFile.upload(this.urlUpload, this._requestHeaders, (file) => this.updateFeedback(file))
+        .then((files) => files.forEach(ezFile => this.finishUpload(ezFile)))
+        .catch(msg => this.showError(msg));
+      index.forceUpdate(this);
+    }
+  }
+  finishUpload(ezFile) {
+    this._filePointers.set(ezFile.name, ezFile);
+    this.updateValue();
+  }
+  updateValue() {
+    this._updatingValue = [];
+    this._filePointers.forEach(f => {
+      if (!this.isRemoteFile(f)) {
+        this._updatingValue.push(f);
+      }
+    });
+    this.value = this._updatingValue;
+    this.ezChange.emit(this.value);
+  }
+  buildProgressId(uploading) {
+    let sanitizedName = uploading.name.replace(/[^a-z0-9_]/gi, "_");
+    return `PROGRESS_${sanitizedName}_${uploading.file.lastModified}`;
+  }
+  updateFeedback(uf) {
+    window.requestAnimationFrame(() => {
+      if (this._host) {
+        const progress = this._host.shadowRoot.querySelector("#" + this.buildProgressId(uf));
+        if (progress) {
+          progress.value = uf.progress;
+        }
+      }
+    });
+  }
+  validateFile(file) {
+    if (!this._filePointers.has(file.name) && this.maxFiles > 0 && this._filePointers.size >= this.maxFiles) {
+      this.showError(`A quantidade máxima de arquivos é ${this.maxFiles}.`);
+      return false;
+    }
+    if (file.size === 0) {
+      this.showError(`Erro de permissão: O arquivo "${file.name}" não pode ser enviado.`);
+      return false;
+    }
+    if (!this.urlUpload) {
+      this.showError("Endereço de upload não informado");
+      return false;
+    }
+    if (this.maxFileSize >= 0 && file.size > this.maxFileSize) {
+      this.showError("O tamanho máximo dos arquivos é de " + this.formatBytes(this.maxFileSize));
+      return false;
+    }
+    return true;
+  }
+  showError(message) {
+    ApplicationUtils.alert("Enviando arquivo", message);
+  }
+  formatBytes(bytes, decimals = 1) {
+    if (bytes === 0)
+      return "0 Bytes";
+    const k = 1024;
+    const dm = decimals < 0 ? 0 : decimals;
+    const sizes = ["B", "KB", "MB", "GB", "TB", "PB", "EB", "ZB", "YB"];
+    const i = Math.floor(Math.log(bytes) / Math.log(k));
+    return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + " " + sizes[i];
+  }
+  onFileInputChange(event) {
+    const input = event.target;
+    this.addFiles(Array.from(input.files));
+    this._fileInput.value = "";
+  }
+  isRemoteFile(item) {
+    return "file" in item;
+  }
+  removeFromList(name) {
+    this._filePointers.delete(name);
+    this.updateValue();
+  }
+  removeFile(name) {
+    const item = this._filePointers.get(name);
+    if (this.isRemoteFile(item)) {
+      item.abortUpload();
+      this.removeFromList(name);
+    }
+    else {
+      if (this.urlDelete) {
+        const uploadingFile = new RemoteFile(null);
+        this._filePointers.set(item.name, uploadingFile);
+        uploadingFile.delete(item, this.urlDelete, null)
+          .then(_ok => this.removeFromList(name))
+          .catch(msg => this.showError(msg));
+      }
+      else {
+        this.removeFromList(name);
+      }
+    }
+  }
+  openFilesDialog() {
+    if (this.enabled) {
+      this._fileInput.click();
+    }
+  }
+  componentDidLoad() {
+    if (this.enabled && this._dropZone && window.FileList && window.File) {
+      this._dropZone.addEventListener("dragover", event => {
+        event.stopPropagation();
+        event.preventDefault();
+        event.dataTransfer.dropEffect = "copy";
+        this._dropZone.style.background = "#c2dbff";
+      });
+      this._dropZone.addEventListener("drop", event => {
+        event.stopPropagation();
+        event.preventDefault();
+        this.addFiles(Array.from(event.dataTransfer.files));
+        this._dropZone.style.background = "";
+      });
+      this._dropZone.addEventListener("dragleave", _event => {
+        this._dropZone.style.background = "";
+      });
+    }
+  }
+  componentWillRender() {
+    if (this.value) {
+      if (this._filePointers.size < this.value.length) {
+        this.updateFilePointers();
+      }
+    }
+  }
+  render() {
+    return (index.h("div", { ref: (el) => this._dropZone = el, class: this.evalDisabledClass("iu", "background--disabled") }, index.h("div", { class: "iu__container", onClick: () => this.openFilesDialog() }, index.h("div", { class: "iu_header" }, this.label ? index.h("label", { class: this.evalDisabledClass("iu__label", "text--disabled"), title: this.label }, this.label) : null, index.h("div", { class: this.evalDisabledClass("iu__icon-label", "mouse-pointer--disabled") }, index.h("button", { class: "iu__file-icon", disabled: !this.enabled }), index.h("div", { class: this.evalDisabledClass("text text--center text--medium text--primary", "text--disabled") }, this.enabled ? "Arraste e solte ou clique para adicionar arquivos" : "Somente leitura"))), this.buildFooter()), index.h("input", { ref: (el) => this._fileInput = el, onChange: (ev) => this.onFileInputChange(ev), type: "file", multiple: true, hidden: true })));
+  }
+  buildFooter() {
+    if (this._filePointers.size === 0) {
+      return null;
+    }
+    const items = [];
+    this._filePointers.forEach(item => items.push(this.buildFileItem(item)));
+    return (index.h("div", { class: "iu__footer" }, items));
+  }
+  buildFileItem(item) {
+    const fileName = item.name;
+    const progress = Number(item["progress"]);
+    const downloadURL = item["downloadURL"];
+    const label = `${fileName} (${this.formatBytes(item.size)})`;
+    return (index.h("div", { class: "iu__item", key: fileName, onClick: evt => evt.stopPropagation() }, index.h("div", { class: "iu__item-label modificador" }, index.h("div", { title: label, class: "col--stretch align--middle file__name text text--primary text--small text--ellipsis align--middle" }, downloadURL ? index.h("a", { href: downloadURL, download: true }, label) : label)), isNaN(progress)
+      ?
+        null
+      :
+        index.h("div", { class: "col col--sd-4 col--stretch align--middle" }, index.h("progress", { id: this.buildProgressId(item), value: progress, max: "100" })), this.enabled
+      ?
+        index.h("div", { class: "col col--stretch align--middle" }, index.h("button", { class: "btn-cancel ", onClick: () => this.removeFile(fileName) }))
+      :
+        null));
+  }
+  evalDisabledClass(regularClasses, disabledClass) {
+    return this.enabled ? regularClasses : `${regularClasses} ${disabledClass}`;
+  }
+  get _host() { return index.getElement(this); }
+  static get watchers() { return {
+    "value": ["changeValue"],
+    "requestHeaders": ["normalizeRequestHeaders"]
+  }; }
+};
+EzUpload.style = ezUploadCss;
+
+const testDuCss = ":host{display:block}";
+
+let TestDu = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+  }
+  componentWillLoad() {
+    this.dataUnit = new index$1.DataUnit("testes_com_formulario");
+    this.dataUnit.metadata = {
+      name: "dd://br.com.sankhya.fin.cad.movimentacaoFinanceira/Financeiro",
+      label: "Parceiro",
+      fields: [
+        {
+          name: "CODPARC",
+          label: "Parceiro",
+          dataType: index$1.DataType.NUMBER,
+          userInterface: index$1.UserInterface.SEARCH,
+          required: true,
+          properties: {}
+        },
+        {
+          name: "RECDESP",
+          label: "Receita/Despesa",
+          dataType: index$1.DataType.TEXT,
+          userInterface: index$1.UserInterface.OPTIONSELECTOR,
+          required: true,
+          properties: { options: `{"-1": "Despesa", "1": "Receita"}` }
+        },
+        {
+          name: "P",
+          label: "pera",
+          dataType: index$1.DataType.TEXT,
+          userInterface: index$1.UserInterface.OPTIONSELECTOR,
+          properties: { options: `{"M": "Madura", "V": "Verde", "P": "Passada"}` }
+        },
+        {
+          name: "ME",
+          label: "ME",
+          dataType: index$1.DataType.NUMBER,
+          userInterface: index$1.UserInterface.DECIMALNUMBER,
+          properties: { precision: 4, prettyPrecision: 1 }
+        }
+      ]
+    };
+    this.formConfig = [
+      { name: "CODPARC", label: "Parceiro" },
+      { name: "NOMEPARC", label: "Mamão" },
+      { name: "P", label: "Pêra", group: "Grupo 1" },
+      { name: "ME", label: "Melancia", tab: "aba 1", group: "Grupo 2" },
+      { name: "L", label: "Laranja", tab: "aba 1", group: "Grupo 1" },
+      { name: "LI", label: "Limão", tab: "aba 1", group: "Grupo 2" }
+    ];
+    this.dataUnit.records = [
+      {
+        __record__id__: "1321321321321321",
+        CODPARC: 10,
+        NOMEPARC: "Parceiro 10",
+        P: "M",
+        L: "Bagaço",
+        LI: "Azedo"
+      }
+    ];
+  }
+  render() {
+    //return this.conteudoEstatico();
+    //return this.somenteDataUnit();
+    return this.configurado();
+  }
+  conteudoEstatico() {
+    return (index.h("div", null, index.h("button", { onClick: () => this.form.validate() }, "Validate"), index.h("ez-form", { ref: ref => this.form = ref }, index.h("div", null, index.h("ez-text-input", { label: "Nome (Label est\u00E1tico)", "data-field-name": "NOMEPARC", "data-required": "true" }), index.h("ez-text-input", { label: "C\u00F3d parc (Label est\u00E1tico)", "data-field-name": "CODPARC", "data-required": "true" })))));
+  }
+  somenteDataUnit() {
+    return (index.h("ez-form", { dataUnit: this.dataUnit }));
+  }
+  configurado() {
+    return (index.h("ez-form", { dataUnit: this.dataUnit, config: this.formConfig, ref: ref => this.form = ref }));
+  }
+};
+TestDu.style = testDuCss;
+
+exports.ez_calendar = EzCalendar;
+exports.ez_check = EzCheck;
+exports.ez_collapsible_box = EzCollapsibleBox;
+exports.ez_combo_box = EzComboBox;
+exports.ez_date_input = EzDateInput;
+exports.ez_form = EzForm;
+exports.ez_number_input = EzNumberInput;
+exports.ez_search = EzSearch;
+exports.ez_tabselector = EzTabselector;
+exports.ez_text_area = EzTextArea;
+exports.ez_text_input = EzTextInput;
+exports.ez_upload = EzUpload;
+exports.test_du = TestDu;