@sankhyalabs/ezui 1.1.67 → 1.1.70

package/dist/esm/ez-button_16.entry.js

@@ -2,7 +2,7 @@ import { r as registerInstance, h, c as createEvent, f as forceUpdate, H as Host
 import { N as NumberUtils, M as MaskFormatter } from './RequestMetadata-c265c9d5.js';
 import { F as FloatingManager } from './FloatingManager-bb90ef41.js';
 
-const ezButtonCss = ":host{--bt--min-width:100px;--bt--height:42px;--bt__icon--width:18px;--bt__inline__icon--padding:12px;--bt--padding-top:var(--space--medium, 12px);--bt--padding-bottom:var(--space--medium, 12px);--bt--padding-right:var(--space--large, 24px);--bt--padding-left:var(--space--large, 24px);--bt--color:var(--text--inverted, #FFF);--bt--font-size:var(--text--medium, 14px);--bt--font-family:var(--font-pattern, Arial);--bt--font-weight:var(--text-weight--large);--bt--background-color:var(--color--primary, #c0c0c0);--bt--border-radius:var(--border--radius-large, 12px);--bt--border:none;--bt--hover--background-color:var(--color--primary-700, var(--bt--background-color));--bt--disabled-color:var(--text--disable);--bt--disabled--background-color:var(--color--disable-primary);--bt--focus--border:var(--bt--border);--bt--focus--box-shadow:none;--bt--link-color:var(--title--primary, '#C0C0C0')}button{display:flex;align-items:center;justify-content:center;margin:0;cursor:pointer;transition:background-color 0.2s linear;min-width:var(--bt--min-width);height:var(--bt--height);font-family:var(--bt--font-family);font-size:var(--bt--font-size);font-weight:var(--bt--font-weight);padding:var(--bt--padding-top) var(--bt--padding-right) var(--bt--padding-bottom) var(--bt--padding-left);border-radius:var(--bt--border-radius);background-color:var(--bt--background-color);color:var(--bt--color);fill:var(--bt--color);border:var(--bt--border)}button:hover{background-color:var(--bt--hover--background-color)}button:focus{outline:none;border:var(--bt--focus--border);box-shadow:var(--bt--focus--box-shadow)}button:disabled{background-color:var(--bt--disabled--background-color);color:var(--bt--disabled-color);fill:var(--bt--disabled-color);border:none;cursor:no-drop}button.icon{width:42px;min-width:42px;height:42px;padding:0px}a{font-family:var(--bt--font-family);font-size:var(--bt--font-size);font-weight:var(--bt--font-weight);color:var(--bt--link-color);cursor:pointer;display:flex;align-items:center;justify-content:center}";
+const ezButtonCss = ":host{--button--min-width:100px;--button--height:42px;--button__icon--width:18px;--button__inline__icon--padding:12px;--button--padding-top:var(--space--medium, 12px);--button--padding-bottom:var(--space--medium, 12px);--button--padding-right:var(--space--large, 24px);--button--padding-left:var(--space--large, 24px);--button--color:var(--text--primary, #FFF);--button--font-size:var(--text--medium, 14px);--button--font-family:var(--font-pattern, Arial);--button--font-weight:var(--text-weight--large);--button--background-color:var(--background--medium, #c0c0c0);--button--border-radius:var(--border--radius-large, 12px);--button--border:none;--button--hover--background-color:var(--background--strong, var(--button--background-color));--button--disabled-color:var(--text--disable);--button--disabled--background-color:var(--color--disable-secondary);--button--focus--border:var(--button--border);--button--focus--box-shadow:none;--button--link-color:var(--title--primary, '#C0C0C0')}button{display:flex;align-items:center;justify-content:center;margin:0;cursor:pointer;transition:background-color 0.2s linear;min-width:var(--button--min-width);height:var(--button--height);font-family:var(--button--font-family);font-size:var(--button--font-size);font-weight:var(--button--font-weight);padding:var(--button--padding-top) var(--button--padding-right) var(--button--padding-bottom) var(--button--padding-left);border-radius:var(--button--border-radius);background-color:var(--button--background-color);color:var(--button--color);fill:var(--button--color);border:var(--button--border)}button:hover{background-color:var(--button--hover--background-color)}button:focus{outline:none;border:var(--button--focus--border);box-shadow:var(--button--focus--box-shadow)}button:disabled{background-color:var(--button--disabled--background-color);color:var(--button--disabled-color);fill:var(--button--disabled-color);border:none;cursor:no-drop}button.icon{width:42px;min-width:42px;height:42px;padding:0px;--icon--color:#ffffff}a{font-family:var(--button--font-family);font-size:var(--button--font-size);font-weight:var(--button--font-weight);color:var(--button--link-color);cursor:pointer;display:flex;align-items:center;justify-content:center;}";
 
 let EzButton = class {
   constructor(hostRef) {
@@ -17,15 +17,15 @@ let EzButton = class {
     this.mode = "regular";
   }
   handleSlotChange(ev) {
-    const slot = ev.target;
-    const content = slot.assignedElements()[0];
     if (this.mode == "link") {
+      const slot = ev.target;
+      const content = slot.assignedElements()[0];
       content.style.display = "inline";
       if (slot.name == "leftIcon") {
-        content.style.paddingRight = "var(--bt__inline__icon--padding)";
+        content.style.paddingRight = "var(--button__inline__icon--padding)";
       }
       else if (slot.name == "rightIcon") {
-        content.style.paddingLeft = "var(--bt__inline__icon--padding)";
+        content.style.paddingLeft = "var(--button__inline__icon--padding)";
       }
     }
   }
@@ -201,19 +201,19 @@ let EzCalendar = class {
 };
 EzCalendar.style = ezCalendarCss;
 
-const ezCheckCss = ":host{--chk--box--width:18px;--chk--box--height:18px;--chk--width:calc(var(--chk--box--width) + 14px);--chk--height:calc(var(--chk--box--width) + 14px);--chk--border-radius:var(--border--radius-small);--chk--checked--background-color:var(--color--primary-200);--chk--focus--background-color:var(--color--strokes, #FFFFFF);--chk--hover--background-color:var(--background--medium);--chk--checked--disabled--background-color:var(--color--disable-secondary);--chk--border:var(--border--medium) var(--title--primary);--chk--disabled--border:var(--border--medium) var(--color--strokes);--chk--checked--border:var(--border--medium) var(--color--primary);--chk--checked--hover--background-color:var(--color--primary-200);--chk--checked--focus--background-color:var(--color--primary-300, #FFFFFF);--chk--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>');--chk--check--background-color:var(--color--primary);--chk--check--disabled--background-color:var(--color--strokes);--swt--slider--width:34px;--swt--slider--height:14px;--swt--pin--width:20px;--swt--pin--height:20px;--swt--focus--width:32px;--swt--focus--height:32px;--swt--background-color:var(--color--strokes);--swt--disabled--background-color:var(--color--disable-secondary);--swt--checked--background-color:var(--color--primary-300);--swt--pin--background-color:var(--background--xlight);--swt--pin--disabled--background-color:var(--color--disable-secondary);--swt--pin--checked--background-color:var(--color--primary);--swt--pin--checked--disabled--background-color:#E8F7F4;--swt--pin--focus--background-color:var(--text--disable);--swt--pin--checked--focus--background-color:var(--color--primary);--chk--label--font-size:var(--text--medium, 14px);--chk--label--font-family:var(--font-pattern, Arial);--chk--label--color:var(--title--primary, #000);--chk--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(--chk--width);height:var(--chk--height)}input.regularMode:enabled:hover{background-color:var(--chk--hover--background-color)}input.regularMode:enabled:focus{outline:none;background-color:var(--chk--focus--background-color)}input.regularMode:disabled{cursor:auto;background:none}input.regularMode::before{box-sizing:border-box;content:\"\";display:block;width:var(--chk--box--width);height:var(--chk--box--height);border-radius:var(--chk--border-radius);border:var(--chk--border)}input.regularMode:disabled::before{border:var(--chk--disabled--border)}input.regularMode:checked:enabled:hover{background-color:var(--chk--checked--hover--background-color)}input.regularMode:checked:enabled:focus{background-color:var(--chk--checked--focus--background-color)}input.regularMode:checked::before{border:var(--chk--checked--border);background-color:var(--chk--checked--background-color)}input.regularMode:checked:disabled:before{border:var(--chk--disabled--border);background-color:var(--chk--checked--disabled--background-color)}input.regularMode:checked::after{display:flex;position:absolute;content:\"\";background-color:var(--chk--check--background-color);width:8px;height:7px;-webkit-mask-image:var(--chk--check--image);mask-image:var(--chk--check--image)}input.regularMode:checked:disabled::after{background-color:var(--chk--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(--swt--slider--width);height:var(--swt--slider--height);background-color:var(--swt--background-color)}input.switchMode:disabled{background-color:var(--swt--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(--swt--pin--width);height:var(--swt--pin--height);background-color:var(--swt--pin--background-color)}input.switchMode:disabled::after{background-color:var(--swt--pin--disabled--background-color)}input.switchMode:checked{transition:background-color var(--transition);background-color:var(--swt--checked--background-color)}input.switchMode::before{display:block;content:\"\";display:block;position:absolute;border-radius:50%;opacity:0;width:var(--swt--focus--width);height:var(--swt--focus--height);top:calc((var(--swt--slider--height) - var(--swt--focus--height)) / 2);left:calc((var(--swt--pin--width) - var(--swt--focus--width))/2);background-color:var(--swt--pin--focus--background-color)}input.switchMode:focus::before{opacity:0.24;transition:opacity var(--transition)}input.switchMode:checked:focus::before{background-color:var(--swt--pin--checked--focus--background-color);transform:translateX(calc(var(--swt--slider--width) - var(--swt--pin--width)))}input.switchMode:checked::after{transition:transform var(--transition);transition:background-color var(--transition);transform:translateX(calc(var(--swt--slider--width) - var(--swt--pin--width))) translateY(-3px);box-shadow:var(--shadow);background-color:var(--swt--pin--checked--background-color)}input.switchMode:checked:disabled::after{background-color:var(--swt--pin--checked--disabled--background-color)}.label{flex-shrink:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--chk--label--color);text-shadow:var(--text-shadow);font-size:var(--chk--label--font-size);font-family:var(--chk--label--font-family);cursor:default;padding-left:var(--space--small)}.label--disabled{color:var(--chk--label--disabled--color)}";
+const ezCheckCss = ":host{--check--box--width:18px;--check--box--height:18px;--check--width:calc(var(--check--box--width) + 14px);--check--height:calc(var(--check--box--width) + 14px);--check--border-radius:var(--border--radius-small);--check--checked--background-color:var(--color--primary-200);--check--focus--background-color:var(--color--strokes, #FFFFFF);--check--hover--background-color:var(--background--medium);--check--checked--disabled--background-color:var(--color--disable-secondary);--check--border:var(--border--medium) var(--title--primary);--check--disabled--border:var(--border--medium) var(--color--strokes);--check--checked--border:var(--border--medium) var(--color--primary);--check--checked--hover--background-color:var(--color--primary-200);--check--checked--focus--background-color:var(--color--primary-300, #FFFFFF);--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>');--check--check--background-color:var(--color--primary);--check--check--disabled--background-color:var(--color--strokes);--switch--slider--width:34px;--switch--slider--height:14px;--switch--pin--width:20px;--switch--pin--height:20px;--switch--focus--width:32px;--switch--focus--height:32px;--switch--background-color:var(--color--strokes);--switch--disabled--background-color:var(--color--disable-secondary);--switch--checked--background-color:var(--color--primary-300);--switch--pin--background-color:var(--background--xlight);--switch--pin--disabled--background-color:var(--color--disable-secondary);--switch--pin--checked--background-color:var(--color--primary);--switch--pin--checked--disabled--background-color:#E8F7F4;--switch--pin--focus--background-color:var(--text--disable);--switch--pin--checked--focus--background-color:var(--color--primary);--check--label--font-size:var(--text--medium, 14px);--check--label--font-family:var(--font-pattern, Arial);--check--label--color:var(--title--primary, #000);--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(--check--width);height:var(--check--height)}input.regularMode:enabled:hover{background-color:var(--check--hover--background-color)}input.regularMode:enabled:focus{outline:none;background-color:var(--check--focus--background-color)}input.regularMode:disabled{cursor:auto;background:none}input.regularMode::before{box-sizing:border-box;content:\"\";display:block;width:var(--check--box--width);height:var(--check--box--height);border-radius:var(--check--border-radius);border:var(--check--border)}input.regularMode:disabled::before{border:var(--check--disabled--border)}input.regularMode:checked:enabled:hover{background-color:var(--check--checked--hover--background-color)}input.regularMode:checked:enabled:focus{background-color:var(--check--checked--focus--background-color)}input.regularMode:checked::before{border:var(--check--checked--border);background-color:var(--check--checked--background-color)}input.regularMode:checked:disabled:before{border:var(--check--disabled--border);background-color:var(--check--checked--disabled--background-color)}input.regularMode:checked::after{display:flex;position:absolute;content:\"\";background-color:var(--check--check--background-color);width:8px;height:7px;-webkit-mask-image:var(--check--check--image);mask-image:var(--check--check--image)}input.regularMode:checked:disabled::after{background-color:var(--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(--switch--slider--width);height:var(--switch--slider--height);background-color:var(--switch--background-color)}input.switchMode:disabled{background-color:var(--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(--switch--pin--width);height:var(--switch--pin--height);background-color:var(--switch--pin--background-color)}input.switchMode:disabled::after{background-color:var(--switch--pin--disabled--background-color)}input.switchMode:checked{transition:background-color var(--transition);background-color:var(--switch--checked--background-color)}input.switchMode::before{display:block;content:\"\";display:block;position:absolute;border-radius:50%;opacity:0;width:var(--switch--focus--width);height:var(--switch--focus--height);top:calc((var(--switch--slider--height) - var(--switch--focus--height)) / 2);left:calc((var(--switch--pin--width) - var(--switch--focus--width))/2);background-color:var(--switch--pin--focus--background-color)}input.switchMode:focus::before{opacity:0.24;transition:opacity var(--transition)}input.switchMode:checked:focus::before{background-color:var(--switch--pin--checked--focus--background-color);transform:translateX(calc(var(--switch--slider--width) - var(--switch--pin--width)))}input.switchMode:checked::after{transition:transform var(--transition);transition:background-color var(--transition);transform:translateX(calc(var(--switch--slider--width) - var(--switch--pin--width))) translateY(-3px);box-shadow:var(--shadow);background-color:var(--switch--pin--checked--background-color)}input.switchMode:checked:disabled::after{background-color:var(--switch--pin--checked--disabled--background-color)}.label{flex-shrink:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--check--label--color);text-shadow:var(--text-shadow);font-size:var(--check--label--font-size);font-family:var(--check--label--font-family);cursor:default;padding-left:var(--space--small)}.label--disabled{color:var(--check--label--disabled--color)}";
 
 let EzCheck = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
     this.ezChange = createEvent(this, "ezChange", 7);
     /**
-     * Deixa o campo disponível ou não interagir com o usuário.
+     * 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";
+     * 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.
      */
@@ -254,12 +254,12 @@ let EzCheck = class {
   getLabelClasses() {
     let classes = "label";
     if (!this.enabled) {
-      classes = classes + " label--disabled";
+      classes += " label--disabled";
     }
     return classes;
   }
   render() {
-    return (h(Host, null, h("input", { type: "checkbox", class: "regularMode", checked: this.value === true, onChange: () => { this.changeValue(); }, disabled: !this.enabled, ref: (el) => this._inputElem = el }), this.label ? h("label", { class: this.getLabelClasses(), onClick: () => { this.changeValue(); }, title: this.label }, this.label) : null));
+    return (h(Host, null, h("input", { type: "checkbox", class: "regularMode", checked: this.value === true, onChange: () => { this.changeValue(); }, disabled: !this.enabled, ref: (el) => this._inputElem = el }), this.label ? h("label", { class: this.getLabelClasses(), onClick: () => { this.changeValue(); }, title: this.label }, this.label) : undefined));
   }
   static get watchers() { return {
     "mode": ["adjustMode"]
@@ -307,7 +307,7 @@ let EzCollapsibleBox = class {
 };
 EzCollapsibleBox.style = ezCollapsibleBoxCss;
 
-const ezComboBoxCss = ":host{--cx--height:42px;--cx--width:100%;--cx__icon--width:48px;--cx--border-radius:var(--border--radius-medium, 12px);--cx--border-radius-small:var(--border--radius-small, 6px);--cx--font-size:var(--text--medium, 14px);--cx--font-family:var(--font-pattern, Arial);--cx--font-weight--large:var(--text-weight--large, 500);--cx--font-weight--medium:var(--text-weight--medium, 400);--cx--background-color--xlight:var(--background--xlight, #fff);--cx__input--background-color:var(--background--medium, #e0e0e0);--cx__input--border:var(--border--medium, 2px solid);--cx__input--border-color:var(--cx__input--background-color);--cx__input--focus--border-color:var(--color--primary, #008561);--cx__input--disabled--background-color:var(--color--disable-secondary, #F2F5F8);--cx__input--disabled--color:var(--text--disable, #AFB6C0);--cx__input--error--border-color:#CC2936;--cx__label--color:var(--title--primary, #919191);--cx__list-text--primary:var(--text--primary, #626e82);--cx__list-height:calc(var(--cx--font-size) + var(--cx--space--medium));--cx--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>');--cx--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>');--cx--space--medium:var(--space--medium, 12px);--cx--space--small:var(--space--small, 6px);display:flex;flex-wrap:wrap;position:relative;width:var(--cx--width)}ez-text-input{--it__input--background-color:var(--cx__input--background-color, #FFFFFF);--it__input--border-color:var(--cx__input--border-color, #DCE0E8)}.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(--cx--background-color--xlight);padding:var(--cx--space--small);border-radius:var(--cx--border-radius);box-shadow:var(--shadow, 0px 0px 16px 0px #000);scroll-behavior:smooth;max-height:calc(4*var(--cx__list-height) + 2*var(--cx--space--small));overflow:auto}.item{text-align:left;display:flex;justify-content:space-between;align-items:center;border-radius:var(--cx--border-radius-small);padding:0 var(--cx--space--small);list-style-type:none;min-height:var(--cx__list-height)}.item--label{text-align:left;flex-basis:85%;flex-grow:1;color:var(--cx__list-text--primary);font-weight:var(--cx--font-weight--large);font-family:var(--cx--font-family);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.item--value{text-align:right;flex-basis:15%;flex-grow:0;color:var(--cx__list-text--primary);font-weight:var(--cx--font-weight--large);font-family:var(--cx--font-family);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}li:hover{background-color:var(--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(--text--primary, #008561);width:16px;height:16px;-webkit-mask-image:var(--cx--drop-down__image);mask-image:var(--cx--drop-down__image)}.btn-open-options:disabled:after{background-color:var(--text--disable, #AFB6C0)}.btn-open-options:enabled:hover::after{background-color:var(--color--primary, #4e4e4e)}.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(--text--primary, #008561);width:22px;height:22px;-webkit-mask-image:var(--cx--search__image);mask-image:var(--cx--search__image)}.btn-open-search:disabled:after{background-color:var(--text--disable, #AFB6C0)}.btn-open-search:enabled:hover::after{background-color:var(--color--primary, #4e4e4e)}";
+const ezComboBoxCss = ":host{--combo-box--height:42px;--combo-box--width:100%;--combo-box__icon--width:48px;--combo-box--border-radius:var(--border--radius-medium, 12px);--combo-box--border-radius-small:var(--border--radius-small, 6px);--combo-box--font-size:var(--text--medium, 14px);--combo-box--font-family:var(--font-pattern, Arial);--combo-box--font-weight--large:var(--text-weight--large, 500);--combo-box--font-weight--medium:var(--text-weight--medium, 400);--combo-box--background-color--xlight:var(--background--xlight, #fff);--combo-box__input--background-color:var(--background--medium, #e0e0e0);--combo-box__input--border:var(--border--medium, 2px solid);--combo-box__input--border-color:var(--combo-box__input--background-color);--combo-box__input--focus--border-color:var(--color--primary, #008561);--combo-box__input--disabled--background-color:var(--color--disable-secondary, #F2F5F8);--combo-box__input--disabled--color:var(--text--disable, #AFB6C0);--combo-box__input--error--border-color:#CC2936;--combo-box__label--color:var(--title--primary, #919191);--combo-box__list-text--primary:var(--text--primary, #626e82);--combo-box__list-height:calc(var(--combo-box--font-size) + var(--combo-box--space--medium));--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>');--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>');--combo-box--space--medium:var(--space--medium, 12px);--combo-box--space--small:var(--space--small, 6px);display:flex;flex-wrap:wrap;position:relative;width:var(--combo-box--width)}ez-text-input{--it__input--background-color:var(--combo-box__input--background-color, #FFFFFF);--it__input--border-color:var(--combo-box__input--border-color, #DCE0E8)}.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(--combo-box--background-color--xlight);padding:var(--combo-box--space--small);border-radius:var(--combo-box--border-radius);box-shadow:var(--shadow, 0px 0px 16px 0px #000);scroll-behavior:smooth;max-height:calc(4*var(--combo-box__list-height) + 2*var(--combo-box--space--small));overflow:auto}.item{text-align:left;display:flex;justify-content:space-between;align-items:center;border-radius:var(--combo-box--border-radius-small);padding:0 var(--combo-box--space--small);list-style-type:none;min-height:var(--combo-box__list-height)}.item--label{text-align:left;flex-basis:85%;flex-grow:1;color:var(--combo-box__list-text--primary);font-weight:var(--combo-box--font-weight--large);font-family:var(--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(--combo-box__list-text--primary);font-weight:var(--combo-box--font-weight--large);font-family:var(--combo-box--font-family);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}li:hover{background-color:var(--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(--text--primary, #008561);width:16px;height:16px;-webkit-mask-image:var(--combo-box--drop-down__image);mask-image:var(--combo-box--drop-down__image)}.btn-open-options:disabled:after{background-color:var(--text--disable, #AFB6C0)}.btn-open-options:enabled:hover::after{background-color:var(--color--primary, #4e4e4e)}.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(--text--primary, #008561);width:22px;height:22px;-webkit-mask-image:var(--combo-box--search__image);mask-image:var(--combo-box--search__image)}.btn-open-search:disabled:after{background-color:var(--text--disable, #AFB6C0)}.btn-open-search:enabled:hover::after{background-color:var(--color--primary, #4e4e4e)}";
 
 let EzComboBox = class {
   constructor(hostRef) {
@@ -320,11 +320,11 @@ let EzComboBox = class {
     /**
      * Ajusta a opção de mostrar o "value" ao selecionar uma opção. Por padrão não mostra.
      */
-    this.showselectedvalue = false;
+    this.showSelectedValue = false;
     /**
      * Ajusta a opção de mostrar o "value" para cada opção. Por padrão não mostra
      */
-    this.showoptionvalue = false;
+    this.showOptionValue = false;
   }
   internalUpdate() {
     if (this._inputElement) {
@@ -336,29 +336,29 @@ let EzComboBox = class {
     this.updateVisibleOptions();
   }
   getText() {
-    let text = '';
+    let text = "";
     const selected = this.getSelectedOption();
     if (selected) {
-      text = this.showselectedvalue ? `${selected.value} - ${selected.label}` : selected.label;
+      text = this.showSelectedValue ? `${selected.value} - ${selected.label}` : selected.label;
     }
     return text;
   }
   getSelectedOption() {
-    if (typeof this.value === 'string' || this.value instanceof String) {
+    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) {
+    if (!this.searchMode && this._criteria) {
       const upperCriteria = this._criteria.toUpperCase();
       opts = opts.filter(opt => opt.label.toLocaleUpperCase().indexOf(upperCriteria) > -1);
     }
-    this._visibleOptions = [{ value: null, label: '' }].concat(opts);
+    this._visibleOptions = [{ value: undefined, label: "" }].concat(opts);
   }
   buildItem(opt, index) {
-    return h("li", { class: index === this._preSelection ? "item preselected" : "item", id: `item_${opt.value}`, onMouseDown: () => this.selectOption(opt), onMouseOver: () => this._preSelection = undefined }, h("span", { class: "item--label", title: opt.label }, opt.label), this.showoptionvalue ? h("span", { class: "item--value", title: opt.value }, opt.value) : null);
+    return h("li", { class: index === this._preSelection ? "item preselected" : "item", id: `item_${opt.value}`, onMouseDown: () => this.selectOption(opt), onMouseOver: () => this._preSelection = undefined }, h("span", { class: "item--label", title: opt.label }, opt.label), this.showOptionValue ? h("span", { class: "item--value", title: opt.value }, opt.value) : undefined);
   }
   showOptions() {
     if (!this.enabled) {
@@ -367,10 +367,10 @@ let EzComboBox = class {
     //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';
+    const top = this.errorMessage ? "0px" : "-17px";
     this._floatingID = FloatingManager.float(this._optionsList, this._listContainer, { autoClose: true, top });
     window.requestAnimationFrame(() => {
-      this._optionsList.scrollIntoView({ behavior: 'smooth', block: 'nearest', inline: 'nearest' });
+      this._optionsList.scrollIntoView({ behavior: "smooth", block: "nearest", inline: "nearest" });
     });
   }
   hideOptions() {
@@ -383,7 +383,7 @@ let EzComboBox = class {
     return this._floatingID !== undefined && FloatingManager.isFloating(this._floatingID);
   }
   nextOption() {
-    if (this.searchmode && !this.isOptionsVisible()) {
+    if (this.searchMode && !this.isOptionsVisible()) {
       return;
     }
     this.showOptions();
@@ -419,7 +419,7 @@ let EzComboBox = class {
   selectOption(opt) {
     const currentOpt = this.getSelectedOption();
     if (currentOpt !== opt) {
-      const adjustedOpt = !(opt === null || opt === void 0 ? void 0 : opt.value) ? null : opt;
+      const adjustedOpt = !(opt === null || opt === void 0 ? void 0 : opt.value) ? undefined : opt;
       this.value = adjustedOpt;
       this.ezChange.emit(adjustedOpt);
     }
@@ -437,10 +437,10 @@ let EzComboBox = class {
       this.updateVisibleOptions();
     }
   }
-  loadOptions(mode, argument = '') {
+  loadOptions(mode, argument = "") {
     this._criteria = argument;
-    if (this.optionloader) {
-      this.updateSource(this.optionloader({ mode, argument }));
+    if (this.optionLoader) {
+      this.updateSource(this.optionLoader({ mode, argument }));
     }
     else {
       this.updateSource(this.options);
@@ -448,7 +448,7 @@ let EzComboBox = class {
   }
   cancelPreselection() {
     if (!this._inputElement.value && this.value) {
-      this.selectOption(null);
+      this.selectOption(undefined);
     }
     else {
       this.internalUpdate();
@@ -460,11 +460,11 @@ let EzComboBox = class {
   componentWillLoad() {
     if (this.options === undefined) {
       this.options = [];
-      const optionsTags = this.el.querySelectorAll('option');
+      const optionsTags = this.el.querySelectorAll("option");
       if (optionsTags) {
         optionsTags.forEach(e => {
           let label = e.innerText;
-          let value = e.getAttribute('value');
+          let value = e.getAttribute("value");
           if (!value) {
             value = label;
           }
@@ -473,11 +473,11 @@ let EzComboBox = class {
         });
       }
     }
-    if (this.searchmode) {
+    if (this.searchMode) {
       this.updateSource([]);
     }
     else {
-      this.loadOptions('PRELOAD');
+      this.loadOptions("PRELOAD");
     }
   }
   componentDidRender() {
@@ -495,13 +495,12 @@ let EzComboBox = class {
     const argument = event.target.value;
     this._criteria = argument;
     if (this._criteria) {
-      if (this.searchmode) {
+      if (this.searchMode) {
         if (this._changeDeboucingTimeout) {
           window.clearTimeout(this._changeDeboucingTimeout);
         }
         this._changeDeboucingTimeout = window.setTimeout(() => {
-          /* load data */
-          this.loadOptions('PREDICTIVE', argument);
+          this.loadOptions("PREDICTIVE", argument);
         }, 200);
       }
       else {
@@ -511,7 +510,7 @@ let EzComboBox = class {
     }
   }
   onTextInputClickHandler() {
-    if (!this.searchmode) {
+    if (!this.searchMode) {
       this.showOptions();
     }
   }
@@ -536,8 +535,8 @@ let EzComboBox = class {
     this.cancelPreselection();
   }
   render() {
-    return (h(Host, null, 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 ?
-      h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-search", onClick: () => { this.loadOptions('ADVANCED'); }, slot: "leftIcon" })
+    return (h(Host, null, 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 ?
+      h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-search", onClick: () => { this.loadOptions("ADVANCED"); }, slot: "leftIcon" })
       :
         h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-options", slot: "rightIcon", onClick: () => this.showOptions() })), h("section", { class: "list-container", ref: elem => this._listContainer = elem }, h("div", { class: "options-list", ref: elem => this._optionsList = elem }, this._visibleOptions.map((opt, index) => this.buildItem(opt, index))))));
   }
@@ -563,7 +562,7 @@ let EzDateInput = class {
     this._textInput.label = this.label;
   }
   setErrorMessage() {
-    this._textInput.errormessage = this.errormessage;
+    this._textInput.errorMessage = this.errorMessage;
   }
   applyValueToInput() {
     if (this._textInput) {
@@ -572,7 +571,7 @@ let EzDateInput = class {
   }
   changeValue(newValue) {
     newValue = newValue == null ? null : DateUtils.clearTime(newValue);
-    this._textInput.errormessage = "";
+    this._textInput.errorMessage = "";
     if (this.getTextValue(newValue) !== this.getTextValue(this.value)) {
       this.value = newValue;
       this.ezChange.emit();
@@ -584,7 +583,7 @@ let EzDateInput = class {
     //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;
+    const top = this._textInput.errorMessage ? 0 : -17;
     this._calendar.fitVertical(top, this._elem.clientHeight);
   }
   hideCalendar() {
@@ -603,7 +602,7 @@ let EzDateInput = class {
       }
     }
     else {
-      this._textInput.errormessage = "O valor digitado não é uma data válida";
+      this._textInput.errorMessage = "O valor digitado não é uma data válida";
     }
   }
   getTextValue(d) {
@@ -613,12 +612,12 @@ let EzDateInput = class {
     return (h(Host, null, h("ez-text-input", { class: "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 }, h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-cal", onClick: () => this.showCalendar(), slot: "leftIcon" })), h("ez-calendar", { onEzChange: (event) => { this.hideCalendar(); event.stopPropagation(); }, floating: true, ref: elem => this._calendar = elem })));
+      }, label: this.label, onEzChange: event => event.stopPropagation(), value: this.getTextValue(this.value), restrict: "0123456789/", enabled: this.enabled, errorMessage: this.errorMessage }, h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-cal", onClick: () => this.showCalendar(), slot: "leftIcon" })), h("ez-calendar", { onEzChange: (event) => { this.hideCalendar(); event.stopPropagation(); }, floating: true, ref: elem => this._calendar = elem })));
   }
   get _elem() { return getElement(this); }
   static get watchers() { return {
     "label": ["setLabel"],
-    "errormessage": ["setErrorMessage"],
+    "errorMessage": ["setErrorMessage"],
     "value": ["applyValueToInput"]
   }; }
 };
@@ -2575,7 +2574,7 @@ const Field = ({ dataUnit, field, forceScroll, enabled }) => {
   switch (userInterface) {
     case 'LONGTEXT':
       return h("div", { class: "col col--sd-12 padding--small" }, loadingData ? h("place-holder", null) :
-        h("ez-text-area", { value: value || '', label: formattedLabel, onEzChange: evt => changeFieldHandler(evt.target['value']), errormessage: errorMessage, ref: elem => scrollToView(forceScroll, elem), key: key, enabled: isEnabled }));
+        h("ez-text-area", { value: value || '', label: formattedLabel, onEzChange: evt => changeFieldHandler(evt.target['value']), errorMessage: errorMessage, ref: elem => scrollToView(forceScroll, elem), key: key, enabled: isEnabled }));
     case 'CHECKBOX':
     case 'SWITCH':
       return h("div", { class: "col col--sd-12 col--tb-3 padding--small align--middle padding-bottom--large" }, loadingData ? h("place-holder", null) :
@@ -2584,7 +2583,7 @@ const Field = ({ dataUnit, field, forceScroll, enabled }) => {
       const optsObj = properties ? JSON.parse(getProp(properties, 'options')) : {};
       const normalized = Object.keys(optsObj).map(key => { return { value: key, label: optsObj[key] }; });
       return h("div", { class: "col col--sd-12 col--tb-3 padding--small" }, loadingData ? h("place-holder", null) :
-        h("ez-combo-box", { value: value, label: formattedLabel, enabled: isEnabled, onEzChange: (event) => changeFieldHandler(event.target['value']), errormessage: errorMessage, ref: elem => scrollToView(forceScroll, elem), key: key, options: normalized }));
+        h("ez-combo-box", { value: value, label: formattedLabel, enabled: isEnabled, onEzChange: (event) => changeFieldHandler(event.target['value']), errorMessage: errorMessage, ref: elem => scrollToView(forceScroll, elem), key: key, options: normalized }));
     case 'SEARCH':
       const context = {
         __MAIN_FORM: form,
@@ -2612,7 +2611,7 @@ const Field = ({ dataUnit, field, forceScroll, enabled }) => {
         context['CRITERIA'] = criteriaList;
       }
       return h("div", { class: "col col--sd-12 col--tb-3 padding--small" }, loadingData ? h("place-holder", null) :
-        h("ez-search", { value: value, label: formattedLabel, enabled: isEnabled, onEzChange: (event) => changeFieldHandler(event.target['value']), errormessage: errorMessage, optionloader: (argument) => {
+        h("ez-search", { value: value, label: formattedLabel, enabled: isEnabled, onEzChange: (event) => changeFieldHandler(event.target['value']), errorMessage: errorMessage, optionloader: (argument) => {
             if (form) {
               return form.loadSearch(argument, context);
             }
@@ -2626,7 +2625,7 @@ const Field = ({ dataUnit, field, forceScroll, enabled }) => {
         h("ez-upload", { value: value, label: formattedLabel, enabled: isEnabled, onEzChange: (event) => changeFieldHandler(event.detail), urlupload: target, requestheaders: headers, maxfiles: maxfiles })));
     case 'DATE':
       return h("div", { class: "col col--sd-12 col--tb-3 padding--small" }, loadingData ? h("place-holder", null) :
-        h("ez-date-input", { value: !value ? null : DateUtils.clearTime(value), label: formattedLabel, enabled: isEnabled, onEzChange: (event) => changeFieldHandler(event.target['value']), errormessage: errorMessage, ref: elem => scrollToView(forceScroll, elem), key: key }));
+        h("ez-date-input", { value: !value ? null : DateUtils.clearTime(value), label: formattedLabel, enabled: isEnabled, onEzChange: (event) => changeFieldHandler(event.target['value']), errorMessage: errorMessage, ref: elem => scrollToView(forceScroll, elem), key: key }));
     case 'DECIMALNUMBER':
     case 'INTEGERNUMBER':
       let precision = 0;
@@ -2636,11 +2635,11 @@ const Field = ({ dataUnit, field, forceScroll, enabled }) => {
         prettyPrecision = Number(getProp(properties, "prettyprecision") || precision);
       }
       return h("div", { class: "col col--sd-12 col--tb-3 padding--small" }, loadingData ? h("place-holder", null) :
-        h("ez-numeric-input", { value: !value ? null : value, label: formattedLabel, enabled: isEnabled, onEzChange: (event) => changeFieldHandler(event.target['value']), errormessage: errorMessage, precision: precision, prettyprecision: prettyPrecision, ref: elem => scrollToView(forceScroll, elem), key: key }));
+        h("ez-numeric-input", { value: !value ? null : value, label: formattedLabel, enabled: isEnabled, onEzChange: (event) => changeFieldHandler(event.target['value']), errorMessage: errorMessage, precision: precision, prettyprecision: prettyPrecision, ref: elem => scrollToView(forceScroll, elem), key: key }));
     //IMAGE, DATETIME, ELAPSEDTIME, PASSWORD, MASKEDTEXT, HTML
     default:
       return h("div", { class: "col col--sd-12 col--tb-3 padding--small" }, loadingData ? h("place-holder", null) :
-        h("ez-text-input", { value: value, label: formattedLabel, enabled: isEnabled, loading: loadingData, onInput: (event) => changeFieldHandler(event.target['value']), errormessage: errorMessage, ref: elem => scrollToView(forceScroll, elem), key: key }));
+        h("ez-text-input", { value: value, label: formattedLabel, enabled: isEnabled, loading: loadingData, onInput: (event) => changeFieldHandler(event.target['value']), errorMessage: errorMessage, ref: elem => scrollToView(forceScroll, elem), key: key }));
   }
 };
 function getProp(properties, name) {
@@ -2701,7 +2700,7 @@ const FormSheet = ({ store, parentName, source, parentDataUnit, dataUnitBuilder,
     buttons.previousVisible = false;
   }
   return h("div", { class: "form-sheet" },
-    tabs ? h("ez-tabselector", { selectedindex: selectedTab, selectedtab: name, onChange: (evt) => changeTabHandler(evt.target.selectedindex) }, tabs) : null,
+    tabs ? h("ez-tabselector", { selectedIndex: selectedTab, selectedTab: name, onChange: (evt) => changeTabHandler(evt.target.selectedindex) }, tabs) : null,
     dataUnit ? h(NavigationBar, { enabled: enabled, dataUnit: dataUnit, buttonProps: buttons }) : null,
     h("div", { class: "tab__container" },
       items ? items.map(item => buildFormItem(item, name, store, currentDU, enabled)) : null,
@@ -2960,12 +2959,14 @@ let EzForm = class {
 };
 EzForm.style = ezFormCss;
 
-const ezIconCss = ":host{display:block;overflow:hidden;position:relative}svg{display:flex;justify-content:center;align-items:center;fill:var(--color--icon)}.x-small{width:12px;height:12px}.small{width:16px;height:16px}.medium{width:20px;height:20px}.large{width:24px;height:24px}.x-large{width:30px;height:30px}";
+const ezIconCss = ":host{display:block;overflow:hidden;position:relative;--ez-icon--color:var(--icon--color, #ffffff)}svg{display:flex;justify-content:center;align-items:center;fill:var(--ez-icon--color)}.x-small{width:12px;height:12px}.small{width:16px;height:16px}.medium{width:20px;height:20px}.large{width:24px;height:24px}.x-large{width:30px;height:30px}";
 
 let EzIcon = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
-    /*Tamanho do icone*/
+    /**
+     * Tamanho do ícone
+     */
     this.size = 'medium';
   }
   isSprite() {
@@ -2996,7 +2997,7 @@ let EzNumericInput = class {
     this._textInput.label = this.label;
   }
   setErrorMessage() {
-    this._textInput.errormessage = this.errormessage;
+    this._textInput.errorMessage = this.errorMessage;
   }
   applyValueToInput() {
     if (this._textInput) {
@@ -3004,7 +3005,7 @@ let EzNumericInput = class {
     }
   }
   changeValue(newValue) {
-    this._textInput.errormessage = "";
+    this._textInput.errorMessage = "";
     if (newValue !== this.value) {
       this.value = newValue;
       this.ezChange.emit();
@@ -3013,7 +3014,7 @@ let EzNumericInput = class {
   parseNumber() {
     const parsedNumber = this._textInput.value ? NumberUtils.stringToNumber(this._textInput.value) : null;
     if (parsedNumber != null && isNaN(parsedNumber)) {
-      this._textInput.errormessage = "O valor digitado não é um número válido";
+      this._textInput.errorMessage = "O valor digitado não é um número válido";
     }
     else {
       this.changeValue(parsedNumber);
@@ -3026,11 +3027,11 @@ let EzNumericInput = class {
     return null;
   }
   render() {
-    return (h("ez-text-input", { class: "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 }));
+    return (h("ez-text-input", { class: "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 }));
   }
   static get watchers() { return {
     "label": ["setLabel"],
-    "errormessage": ["setErrorMessage"],
+    "errorMessage": ["setErrorMessage"],
     "value": ["applyValueToInput"]
   }; }
 };
@@ -3067,7 +3068,7 @@ let EzSearch = class {
     this.ezChange.emit(evt.detail);
   }
   render() {
-    return (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 }));
+    return (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 }));
   }
   ;
   static get watchers() { return {
@@ -3076,91 +3077,91 @@ let EzSearch = class {
 };
 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;margin-bottom:var(--space--large, 24px);--tab--backward-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>');--tab--forward-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>')}.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(--tab--forward-image);mask-image:var(--tab--forward-image)}.backward-button::after{-webkit-mask-image:var(--tab--backward-image);mask-image:var(--tab--backward-image)}.forward-button:hover::after,.backward-button:hover::after{background-color:var(--color--primary, #4e4e4e)}.hidden{display:none}.scroll::-webkit-scrollbar{display:none}";
+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;margin-bottom:var(--space--large, 24px);--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) {
     registerInstance(this, hostRef);
-    this.change = createEvent(this, "change", 7);
-    this.setFoucusedParam = (ev) => {
-      if (ev.key === 'Enter') {
-        this.selectedindex = this.foucusedindex;
-        this.foucusedindex = undefined;
-        this.selectedtab = this._processedTabs[this.selectedindex]['tabKey'];
-        this.handleTabClick(this.selectedtab, parseInt(this.selectedindex));
+    this.ezChange = 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);
+        this.setFocusedTab(this.selectedIndex);
       }
-      else if (ev.key === 'ArrowLeft' || ev.key === 'ArrowRight') {
+      else if (ev.key === "ArrowLeft" || ev.key === "ArrowRight") {
         let operator = undefined;
-        if (ev.key === 'ArrowLeft') {
+        if (ev.key === "ArrowLeft") {
           operator = false;
         }
-        else if (ev.key === 'ArrowRight') {
+        else if (ev.key === "ArrowRight") {
           operator = true;
         }
         else {
           return;
         }
-        if (this.foucusedindex === undefined) {
+        if (this.focusedIndex === undefined) {
           if (operator === false) {
-            this.foucusedindex = this.selectedindex !== undefined ? (parseInt(this.selectedindex) - 1).toString() : undefined;
+            this.focusedIndex = this.selectedIndex !== undefined ? (parseInt(this.selectedIndex) - 1).toString() : undefined;
           }
           else {
-            this.foucusedindex = this.selectedindex !== undefined ? (parseInt(this.selectedindex) + 1).toString() : undefined;
+            this.focusedIndex = this.selectedIndex !== undefined ? (parseInt(this.selectedIndex) + 1).toString() : undefined;
           }
         }
         else {
           if (operator === false) {
-            this.foucusedindex = (parseInt(this.foucusedindex) - 1).toString();
+            this.focusedIndex = (parseInt(this.focusedIndex) - 1).toString();
           }
           else {
-            this.foucusedindex = (parseInt(this.foucusedindex) + 1).toString();
+            this.focusedIndex = (parseInt(this.focusedIndex) + 1).toString();
           }
         }
-        if (parseInt(this.foucusedindex) < 0) {
-          this.foucusedindex = '0';
+        if (parseInt(this.focusedIndex) < 0) {
+          this.focusedIndex = "0";
         }
-        else if (parseInt(this.foucusedindex) > this._processedTabs.length - 1) {
-          this.foucusedindex = (this._processedTabs.length - 1).toString();
+        else if (parseInt(this.focusedIndex) > this._processedTabs.length - 1) {
+          this.focusedIndex = (this._processedTabs.length - 1).toString();
         }
-        this.setFoucusedBtn(true, this.foucusedindex);
-        this.setFocusedTab(this.foucusedindex);
-        this.change.emit();
-      }
-      else if (ev.key === 'Tab' || ev.key === 'Escape') {
-        this.foucusedindex = undefined;
-        this.selectedtab = this._processedTabs[this.selectedindex]['tabKey'];
-        this.handleTabClick(this.selectedtab, parseInt(this.selectedindex));
+        this.setFocusedBtn(true, this.focusedIndex);
+        this.setFocusedTab(this.focusedIndex);
+        this.ezChange.emit();
+      }
+      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(this.selectedIndex);
       }
       // this.setFocusedTab();
     };
   }
   handleTabClick(tab, index) {
-    this.selectedindex = index.toString();
-    this.foucusedindex = undefined;
-    this.selectedtab = tab;
-    this.change.emit();
-    this.setFoucusedBtn(false, this.selectedindex);
+    this.selectedIndex = index.toString();
+    this.focusedIndex = undefined;
+    this.selectedTab = tab;
+    this.ezChange.emit();
+    this.setFocusedBtn(false, this.selectedIndex);
   }
   componentWillRender() {
     if (!this._processedTabs) {
       this._processedTabs = [];
       if (this.tabs) {
-        this.tabs.split(',').forEach((label) => {
+        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');
+      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);
+          content.setAttribute("slot", "tab" + this._processedTabs.length);
           this._hostElem.appendChild(content);
         }
         this._processedTabs.push(t);
@@ -3184,7 +3185,7 @@ let EzTabselector = class {
     const container = this._scrollContainer;
     if (container) {
       let lastTab = null;
-      container.querySelectorAll('.tab').forEach((tab) => {
+      container.querySelectorAll(".tab").forEach((tab) => {
         if (tab.getBoundingClientRect().right < container.clientWidth) {
           lastTab = tab;
         }
@@ -3203,18 +3204,18 @@ let EzTabselector = class {
       this._startHidden = container.scrollLeft > 0;
       this._endHidden = remainingScroll > 0;
       if (this._startHidden) {
-        this._backwardButton.classList.remove('hidden');
+        this._backwardButton.classList.remove("hidden");
       }
       else {
-        this._backwardButton.classList.add('hidden');
+        this._backwardButton.classList.add("hidden");
       }
       if (this._endHidden) {
-        this._forwardButton.classList.remove('hidden');
+        this._forwardButton.classList.remove("hidden");
       }
       else {
-        this._forwardButton.classList.add('hidden');
+        this._forwardButton.classList.add("hidden");
       }
-      const classNames = ['', 'startHidden', 'endHidden', 'midle'];
+      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)) {
@@ -3231,11 +3232,9 @@ let EzTabselector = class {
     this._scrollCallBack = window.setTimeout(() => { this.updateScroll(); }, 200);
   }
   setFocusedTab(index) {
-    window.clearTimeout(this._scrollCallBackTeste);
-    this._scrollCallBackTeste = window.setTimeout(() => {
+    window.clearTimeout(this._scrollCallBackTest);
+    this._scrollCallBackTest = window.setTimeout(() => {
       const tabtoscroll = this._scrollContainer.querySelector(`#tab${index}`);
-      console.log('tabtoscroll => ID', `#tab${this.selectedindex}`);
-      console.log('tabtoscroll', tabtoscroll);
       tabtoscroll.scrollIntoView();
     }, 200);
   }
@@ -3244,27 +3243,27 @@ let EzTabselector = class {
       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';
+    context.font = "14px Sora, Algerian";
+    return Math.min(220, 24 + context.measureText(text).width) + "px";
   }
   ;
-  setFoucusedBtn(visible, paramater) {
-    const tabsButtons = this._scrollContainer.querySelectorAll('.tab');
+  setFocusedBtn(visible, parameter) {
+    const tabsButtons = this._scrollContainer.querySelectorAll(".tab");
     tabsButtons.forEach((el) => {
-      el.classList.remove('is-focused');
-      if (el.id === 'tab' + paramater && visible) {
-        el.classList.add('is-focused');
+      el.classList.remove("is-focused");
+      if (el.id === "tab" + parameter && visible) {
+        el.classList.add("is-focused");
       }
     });
   }
   render() {
-    return (h(Host, null, h("button", { class: "backward-button", ref: (el) => this._backwardButton = el, onClick: () => this.scrollBackward() }), h("div", { class: "scroll", ref: (el) => this._scrollContainer = el, onScroll: () => this.domScrollHandler(), onKeyDown: (ev) => this.setFoucusedParam(ev) }, this._processedTabs.map((tab, index) => {
-      const labelStyle = { 'min-width': this.getTextWidth(tab.label) };
+    return (h(Host, null, h("button", { class: "backward-button", ref: (el) => this._backwardButton = el, onClick: () => this.scrollBackward() }), h("div", { class: "scroll", ref: (el) => this._scrollContainer = el, onScroll: () => this.domScrollHandler(), onKeyDown: (ev) => this.setFocusedParam(ev) }, this._processedTabs.map((tab, index) => {
+      const labelStyle = { "min-width": this.getTextWidth(tab.label) };
       const tabId = "tab" + index;
-      const isSelected = index === parseInt(this.selectedindex) || (this.selectedtab && tab.tabKey === this.selectedtab);
+      const isSelected = index === parseInt(this.selectedIndex) || (this.selectedTab && tab.tabKey === this.selectedTab);
       if (isSelected) {
-        this.selectedtab = tab.tabKey;
-        this.selectedindex = index.toString();
+        this.selectedTab = tab.tabKey;
+        this.selectedIndex = index.toString();
       }
       return h("button", { id: tabId, class: `tab${isSelected ? " is-active" : ""}`, onClick: () => this.handleTabClick(tab.tabKey, index), style: labelStyle }, h("span", { class: "tab-label", title: tab.label }, tab.label), h("slot", { name: tabId, onSlotchange: (ev) => { this.handleSlotChange(ev); } }));
     })), h("button", { class: "forward-button", ref: (el) => this._forwardButton = el, onClick: () => this.scrollFoward() })));
@@ -3290,12 +3289,12 @@ let EzTextArea = class {
      */
     this.enabled = true;
     /**
-     * Ajusta o numero de linhas e consequentemente o height do textarea. Valor default: 4
+     * 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 !== '';
+    const hasError = typeof this.errorMessage === 'string' && this.errorMessage !== '';
     if (hasError) {
       this._container.classList.add('hasError');
       this._messageBoxElem.classList.add('hasError');
@@ -3375,21 +3374,17 @@ let EzTextArea = class {
   render() {
     return (h(Host, null, h("div", { class: "textarea", ref: (el) => this._container = el }, this.label ?
       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, 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 })), h("span", { class: "message-box", ref: (el) => this._messageBoxElem = el, title: this.errormessage }, this.errormessage)));
+      : null, 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 })), h("span", { class: "message-box", ref: (el) => this._messageBoxElem = el, title: this.errorMessage }, this.errorMessage)));
   }
   get _hostElement() { return getElement(this); }
   static get watchers() { return {
-    "errormessage": ["showError"],
+    "errorMessage": ["showError"],
     "value": ["updateInputValue"]
   }; }
 };
 EzTextArea.style = ezTextAreaCss;
 
-function isValidNumber(strValue) {
-  return strValue && /^-?\d*[.,]?\d*$/.test(strValue);
-}
-
-const ezTextInputCss = ":host{--it--height:42px;--it--width:100%;--it__icon--width:48px;--it--border-radius:var(--border--radius-medium, 12px);--it--font-size:var(--text--medium, 14px);--it--font-family:var(--font-pattern, Arial);--it--font-weight:var(--text-weight--large, 500);--it--color:var(--title--primary, #000);--it__input--background-color:var(--background--medium, #e0e0e0);--it__input--border:var(--border--medium, 2px solid);--it__input--border-color:var(--it__input--background-color);--it__input--focus--border-color:var(--color--alert-cold-800, #042EFF);--it__input--disabled--background-color:var(--color--disable-secondary, #F2F5F8);--it__input--disabled--color:var(--text--disable, #AFB6C0);--it__input--error--border-color:#CC2936;--it__message_box--font-size:var(--text--small, 12px);--it__message_box--info--color:var(--color--success, #22085d);--it__message_box--error--color:var(--color--error, #FF0000);--it__label--floating--top:6px;--it__label--padding-top:12px;--it__label--padding-left:14px;--it__label--padding-right:12px;display:flex;flex-wrap:wrap;position:relative;width:var(--it--width)}input{width:100%;box-sizing:border-box;padding:var(--space--medium, 6px);font-weight:var(--text-weight--large, 600);height:var(--it--height);border-radius:var(--it--border-radius);font-family:var(--it--font-family);font-size:var(--it--font-size);border:var(--it__input--border);border-color:var(--it__input--border-color);background-color:var(--it__input--background-color);color:var(--it--color)}input:disabled{background-color:var(--it__input--disabled--background-color);color:var(--it__input--disabled--color)}input:focus{outline:none;border-color:var(--it__input--focus--border-color)}input.icon--left{padding-left:var(--it__icon--width)}input.icon--right{padding-right:var(--it__icon--width)}input.hasError{color:var(--it--color);border-color:var(--it__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(--it--font-family);font-size:var(--it__message_box--font-size);color:var(--it__message_box--info--color)}.hasError{color:var(--it__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(--it__label--padding-right));left:var(--it--space--medium);font-family:var(--it--font-family);font-size:var(--it--font-size);font-weight:var(--it--font-weight);color:var(--it--color);top:var(--it__label--padding-top);left:var(--it__label--padding-left);padding-right:var(--it__label--padding-right)}.input__label--floated{font-family:var(--it--font-family);font-size:var(--text--extra-small);color:var(--text--primary);top:var(--it__label--floating--top)}.input__label--disabled{color:var(--it__input--disabled--color)}.input__label--left{text-align:left;left:calc(var(--it__icon--width) + 2px);width:calc(100% - var(--it__icon--width))}.input__label--right{right:var(--it__icon--width);width:calc(100% - var(--it__icon--width))}.input__label--left.input__label--right{left:calc(var(--it__icon--width) + 2px);width:calc(100% - var(--it__icon--width) * 2)}.input--with--label{padding-bottom:0}";
+const ezTextInputCss = ":host{--text-input--height:42px;--text-input--width:100%;--text-input__icon--width:48px;--text-input--border-radius:var(--border--radius-medium, 12px);--text-input--font-size:var(--text--medium, 14px);--text-input--font-family:var(--font-pattern, Arial);--text-input--font-weight:var(--text-weight--large, 500);--text-input--color:var(--title--primary, #000);--text-input__input--background-color:var(--background--medium, #e0e0e0);--text-input__input--border:var(--border--medium, 2px solid);--text-input__input--border-color:var(--text-input__input--background-color);--text-input__input--focus--border-color:var(--color--alert-cold-800, #042EFF);--text-input__input--disabled--background-color:var(--color--disable-secondary, #F2F5F8);--text-input__input--disabled--color:var(--text--disable, #AFB6C0);--text-input__input--error--border-color:#CC2936;--text-input__message_box--font-size:var(--text--small, 12px);--text-input__message_box--info--color:var(--color--success, #22085d);--text-input__message_box--error--color:var(--color--error, #FF0000);--text-input__label--floating--top:6px;--text-input__label--padding-top:12px;--text-input__label--padding-left:14px;--text-input__label--padding-right:12px;display:flex;flex-wrap:wrap;position:relative;width:var(--text-input--width)}input{width:100%;box-sizing:border-box;padding:var(--space--medium, 6px);font-weight:var(--text-weight--large, 600);height:var(--text-input--height);border-radius:var(--text-input--border-radius);font-family:var(--text-input--font-family);font-size:var(--text-input--font-size);border:var(--text-input__input--border);border-color:var(--text-input__input--border-color);background-color:var(--text-input__input--background-color);color:var(--text-input--color)}input:disabled{background-color:var(--text-input__input--disabled--background-color);color:var(--text-input__input--disabled--color)}input:focus{outline:none;border-color:var(--text-input__input--focus--border-color)}input.icon--left{padding-left:var(--text-input__icon--width)}input.icon--right{padding-right:var(--text-input__icon--width)}input.hasError{color:var(--text-input--color);border-color:var(--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(--text-input--font-family);font-size:var(--text-input__message_box--font-size);color:var(--text-input__message_box--info--color)}.hasError{color:var(--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(--text-input__label--padding-right));left:var(--text-input--space--medium);font-family:var(--text-input--font-family);font-size:var(--text-input--font-size);font-weight:var(--text-input--font-weight);color:var(--text-input--color);top:var(--text-input__label--padding-top);left:var(--text-input__label--padding-left);padding-right:var(--text-input__label--padding-right)}.input__label--floated{font-family:var(--text-input--font-family);font-size:var(--text--extra-small);color:var(--text--primary);top:var(--text-input__label--floating--top)}.input__label--disabled{color:var(--text-input__input--disabled--color)}.input__label--left{text-align:left;left:calc(var(--text-input__icon--width) + 2px);width:calc(100% - var(--text-input__icon--width))}.input__label--right{right:var(--text-input__icon--width);width:calc(100% - var(--text-input__icon--width))}.input__label--left.input__label--right{left:calc(var(--text-input__icon--width) + 2px);width:calc(100% - var(--text-input__icon--width) * 2)}.input--with--label{padding-bottom:0}";
 
 let EzTextInput = class {
   constructor(hostRef) {
@@ -3401,7 +3396,7 @@ let EzTextInput = class {
     this.enabled = true;
   }
   showError() {
-    const hasError = typeof this.errormessage === 'string' && this.errormessage !== '';
+    const hasError = typeof this.errorMessage === 'string' && this.errorMessage !== '';
     if (hasError) {
       this._inputElem.classList.add('hasError');
       this._messageBoxElem.classList.add('hasError');
@@ -3476,16 +3471,13 @@ let EzTextInput = class {
         this._inputElem.value = this._maskFormatter.format(value);
       }
       catch (e) {
-        this.errormessage = e.message;
+        this.errorMessage = e.message;
       }
     }
     this.value = this._inputElem.value;
     this.adjustFloatingLabel();
   }
   isValidValue(value) {
-    if (this.onlynumber) {
-      return value == "" || isValidNumber(value);
-    }
     if (this.restrict) {
       return Array.from(value).reduce((valid, c) => valid && this.restrict.indexOf(c) > -1, true);
     }
@@ -3514,11 +3506,11 @@ let EzTextInput = class {
       content.style.justifyContent = "center";
       content.style.overflow = "hidden";
       content.style.top = "0px";
-      content.style.width = "var(--it__icon--width)";
-      content.style.height = "var(--it--height)";
+      content.style.width = "var(--text-input__icon--width)";
+      content.style.height = "var(--text-input--height)";
       if (slot.name == "leftIcon") {
         content.style.left = "0px";
-        content.style.borderRadius = "var(--it--border-radius) 0 0 var(--it--border-radius)";
+        content.style.borderRadius = "var(--text-input--border-radius) 0 0 var(--text-input--border-radius)";
         this._inputElem.classList.add('icon--left');
         if (this._labelElem) {
           this._labelElem.classList.add('input__label--left');
@@ -3526,7 +3518,7 @@ let EzTextInput = class {
       }
       else if (slot.name == "rightIcon") {
         content.style.right = "0px";
-        content.style.borderRadius = "0 var(--it--border-radius) var(--it--border-radius) 0";
+        content.style.borderRadius = "0 var(--text-input--border-radius) var(--text-input--border-radius) 0";
         this._inputElem.classList.add('icon--right');
         if (this._labelElem) {
           this._labelElem.classList.add('input__label--right');
@@ -3544,9 +3536,6 @@ let EzTextInput = class {
   // Lifecycle web component
   //---------------------------------------------
   componentDidLoad() {
-    if (this.onlynumber) {
-      this._inputElem.classList.add('text--right');
-    }
     this.showError();
     this.prepareMask();
     this.adjustFloatingLabel();
@@ -3559,7 +3548,7 @@ let EzTextInput = class {
           this.value = this._maskFormatter.format(this.value);
         }
         catch (e) {
-          this.errormessage = e.message;
+          this.errorMessage = e.message;
         }
       }
       if (!this.isValidValue(this.value)) {
@@ -3571,11 +3560,11 @@ let EzTextInput = class {
   render() {
     return (h(Host, null, h("slot", { name: "leftIcon", onSlotchange: (ev) => { this.handleSlotChange(ev); } }), this.label ?
       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, h("input", { onFocus: () => this.doFocus(), ref: (el) => this._inputElem = el, type: "text", value: this.value, disabled: !this.enabled, onInput: () => { this.handleChange(); }, onFocusout: () => { this.handleFocusout(); } }), h("slot", { name: "rightIcon", onSlotchange: (ev) => { this.handleSlotChange(ev); } }), h("span", { class: "message-box", ref: (el) => this._messageBoxElem = el, title: this.errormessage }, this.errormessage)));
+      : null, h("input", { onFocus: () => this.doFocus(), ref: (el) => this._inputElem = el, type: "text", value: this.value, disabled: !this.enabled, onInput: () => { this.handleChange(); }, onFocusout: () => { this.handleFocusout(); } }), h("slot", { name: "rightIcon", onSlotchange: (ev) => { this.handleSlotChange(ev); } }), h("span", { class: "message-box", ref: (el) => this._messageBoxElem = el, title: this.errorMessage }, this.errorMessage)));
   }
   get _hostElement() { return getElement(this); }
   static get watchers() { return {
-    "errormessage": ["showError"],
+    "errorMessage": ["showError"],
     "mask": ["prepareMask"],
     "value": ["updateInputValue"]
   }; }