@sankhyalabs/ezui 4.13.0 → 4.14.1

package/dist/collection/collection-manifest.json

@@ -1,10 +1,10 @@
 {
   "entries": [
     "./components/ez-modal/ez-modal.js",
+    "./components/ez-combo-box/ez-combo-box.js",
     "./components/ez-actions-button/ez-actions-button.js",
     "./components/ez-breadcrumb/ez-breadcrumb.js",
     "./components/ez-card-item/ez-card-item.js",
-    "./components/ez-combo-box/ez-combo-box.js",
     "./components/ez-list/ez-list.js",
     "./components/ez-radio-button/ez-radio-button.js",
     "./components/ez-tabselector/ez-tabselector.js",

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

@@ -136,6 +136,9 @@ input.regular-mode {
   height: var(--ez-check--height);
 }
 
+input.compact{
+  margin-right: 0px;
+}
 
 input.regular-mode:enabled:hover {
   /*public*/
@@ -352,9 +355,12 @@ input.switch-mode:checked:disabled::after {
   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);
+}
+
+.label--padding {
+  padding-left: var(--space--small);
 }

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

@@ -8,6 +8,7 @@ export class EzCheck {
     this.enabled = true;
     this.indeterminate = undefined;
     this.mode = CheckMode.REGULAR;
+    this.compact = false;
   }
   observeValue(newValue, oldValue) {
     if (!this._inputElem)
@@ -54,15 +55,22 @@ export class EzCheck {
     this.ezChange.emit(this.value);
   }
   getLabelClasses() {
-    let classes = "label";
+    const classes = ["label"];
     if (!this.enabled) {
-      classes += " label--disabled";
+      classes.push("label--disabled");
     }
-    return classes;
+    if (!this.compact) {
+      classes.push("label--padding");
+    }
+    return classes.join(" ");
   }
   getInputClasses() {
     var _a;
-    return ((_a = this.mode) === null || _a === void 0 ? void 0 : _a.toUpperCase()) === CheckMode.SWITCH ? "switch-mode" : "regular-mode";
+    const classes = [""];
+    classes.push(((_a = this.mode) === null || _a === void 0 ? void 0 : _a.toUpperCase()) === CheckMode.SWITCH ? "switch-mode" : "regular-mode");
+    if (this.compact)
+      classes.push("compact");
+    return classes.join(" ");
   }
   render() {
     return (h(Host, null, h("input", { type: "checkbox", ref: (el) => this._inputElem = el, class: this.getInputClasses(), checked: this.value === true, onChange: () => { this.changeValue(); }, indeterminate: this.indeterminate, disabled: !this.enabled, "data-element-id": ElementIDUtils.getInternalIDInfo("input") }), this.label ? h("label", { class: this.getLabelClasses(), onClick: () => { this.changeValue(); }, title: this.label }, this.label) : undefined));
@@ -172,6 +180,24 @@ export class EzCheck {
         "attribute": "mode",
         "reflect": true,
         "defaultValue": "CheckMode.REGULAR"
+      },
+      "compact": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Define o modo compacto com espa\u00E7amento menor entre label e o input"
+        },
+        "attribute": "compact",
+        "reflect": false,
+        "defaultValue": "false"
       }
     };
   }

package/dist/collection/components/ez-combo-box/ez-combo-box.js

@@ -208,7 +208,7 @@ export class EzComboBox {
   }
   scrollToOption(opt, down) {
     window.requestAnimationFrame(() => {
-      const liElem = (opt === null || opt === void 0 ? void 0 : opt.value) ? this._optionsList.querySelector(`li#item_${opt.value}`) : undefined;
+      const liElem = (opt === null || opt === void 0 ? void 0 : opt.value) ? this._optionsList.querySelector(`li#item_${opt.value.replace(/[<>\[\]#=]/g, '\\$&')}`) : undefined;
       if (liElem) {
         const parent = liElem.parentElement;
         const parentRect = parent.getBoundingClientRect();

package/dist/collection/components/ez-date-input/ez-date-input.js

@@ -9,6 +9,7 @@ export class EzDateInput {
     this.enabled = true;
     this.errorMessage = undefined;
     this.mode = "regular";
+    this.canShowError = true;
   }
   observeLabel() {
     if (this._textInput) {
@@ -131,7 +132,7 @@ export class EzDateInput {
   }
   render() {
     ElementIDUtils.addIDInfoIfNotExists(this._elem, 'input');
-    return (h(Host, null, h("ez-text-input", { "data-element-id": ElementIDUtils.getInternalIDInfo("textInput"), ref: elem => this._textInput = elem, "data-slave-mode": "true", label: this.label, onBlur: () => this.handleBlur(), onInput: (evt) => this.handleInput(evt), restrict: "0123456789/", enabled: this.enabled, errorMessage: this.errorMessage, mode: this.mode }, h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-cal", onClick: () => this.showCalendar(), slot: "leftIcon" })), h("ez-calendar", { "data-element-id": ElementIDUtils.getInternalIDInfo("calendar"), onEzChange: (event) => { this.hideCalendar(); event.stopPropagation(); }, floating: true, ref: elem => this._calendar = elem })));
+    return (h(Host, null, h("ez-text-input", { "data-element-id": ElementIDUtils.getInternalIDInfo("textInput"), ref: elem => this._textInput = elem, "data-slave-mode": "true", label: this.label, onBlur: () => this.handleBlur(), onInput: (evt) => this.handleInput(evt), restrict: "0123456789/", enabled: this.enabled, errorMessage: this.errorMessage, mode: this.mode, canShowError: this.canShowError }, h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-cal", onClick: () => this.showCalendar(), slot: "leftIcon" })), h("ez-calendar", { "data-element-id": ElementIDUtils.getInternalIDInfo("calendar"), onEzChange: (event) => { this.hideCalendar(); event.stopPropagation(); }, floating: true, ref: elem => this._calendar = elem })));
   }
   static get is() { return "ez-date-input"; }
   static get encapsulation() { return "shadow"; }
@@ -235,6 +236,24 @@ export class EzDateInput {
         "attribute": "mode",
         "reflect": true,
         "defaultValue": "\"regular\""
+      },
+      "canShowError": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Se false deixa de exibir a mensagem de erro dentro do campo."
+        },
+        "attribute": "can-show-error",
+        "reflect": true,
+        "defaultValue": "true"
       }
     };
   }

package/dist/collection/components/ez-date-time-input/ez-date-time-input.js

@@ -10,6 +10,7 @@ export class EzDateTimeInput {
     this.errorMessage = undefined;
     this.showSeconds = false;
     this.mode = "regular";
+    this.canShowError = true;
   }
   observeLabel() {
     if (this._textInput) {
@@ -182,7 +183,7 @@ export class EzDateTimeInput {
   }
   render() {
     ElementIDUtils.addIDInfoIfNotExists(this._elem, 'input');
-    return (h(Host, null, h("ez-text-input", { "data-element-id": ElementIDUtils.getInternalIDInfo("textInput"), ref: elem => this._textInput = elem, "data-slave-mode": "true", label: this.label, restrict: "0123456789/: ", enabled: this.enabled, errorMessage: this.errorMessage, mode: this.mode, onKeyDown: event => { this.handleKeyDown(event); }, onBlur: () => this.handleBlur(), onInput: (evt) => this.handleInput(evt), onFocus: () => this.handleFocus(), onClick: () => this.handleClick() }, h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-cal", onClick: () => this.showCalendar(), slot: "leftIcon" })), h("ez-calendar", { "data-element-id": ElementIDUtils.getInternalIDInfo("calendar"), onEzChange: (event) => { this.hideCalendar(); event.stopPropagation(); }, floating: true, ref: elem => this._calendar = elem, time: true, showSeconds: this.showSeconds })));
+    return (h(Host, null, h("ez-text-input", { "data-element-id": ElementIDUtils.getInternalIDInfo("textInput"), ref: elem => this._textInput = elem, "data-slave-mode": "true", label: this.label, restrict: "0123456789/: ", enabled: this.enabled, errorMessage: this.errorMessage, mode: this.mode, onKeyDown: event => { this.handleKeyDown(event); }, onBlur: () => this.handleBlur(), onInput: (evt) => this.handleInput(evt), onFocus: () => this.handleFocus(), onClick: () => this.handleClick(), canShowError: this.canShowError }, h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-cal", onClick: () => this.showCalendar(), slot: "leftIcon" })), h("ez-calendar", { "data-element-id": ElementIDUtils.getInternalIDInfo("calendar"), onEzChange: (event) => { this.hideCalendar(); event.stopPropagation(); }, floating: true, ref: elem => this._calendar = elem, time: true, showSeconds: this.showSeconds })));
   }
   static get is() { return "ez-date-time-input"; }
   static get encapsulation() { return "shadow"; }
@@ -304,6 +305,24 @@ export class EzDateTimeInput {
         "attribute": "mode",
         "reflect": true,
         "defaultValue": "\"regular\""
+      },
+      "canShowError": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Se false deixa de exibir a mensagem de erro dentro do campo."
+        },
+        "attribute": "can-show-error",
+        "reflect": true,
+        "defaultValue": "true"
       }
     };
   }

package/dist/collection/components/ez-form-view/fieldbuilder/templates/ComboBox.tpl.js

@@ -1,5 +1,5 @@
 import { h } from "@stencil/core";
-export const buildComboBox = ({ name, label, readOnly, required, props, contextName }) => {
+export const buildComboBox = ({ name, label, readOnly, required, props, contextName, canShowError }) => {
   const prop = props === null || props === void 0 ? void 0 : props.options;
   let options;
   if (typeof prop === "string") {
@@ -9,5 +9,5 @@ export const buildComboBox = ({ name, label, readOnly, required, props, contextN
   else {
     options = prop;
   }
-  return (h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-3 ez-padding-horizontal--small" }, h("ez-combo-box", { enabled: !readOnly, suppressEmptyOption: required, label: label, "data-field-name": name, "data-context-name": contextName, key: name, options: options })));
+  return (h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-3 ez-padding-horizontal--small" }, h("ez-combo-box", { enabled: !readOnly, suppressEmptyOption: required, label: label, "data-field-name": name, "data-context-name": contextName, key: name, options: options, canShowError: canShowError })));
 };

package/dist/collection/components/ez-form-view/fieldbuilder/templates/DateInput.tpl.js

@@ -1,10 +1,10 @@
 import { h } from "@stencil/core";
-export const buildDate = ({ name, label, readOnly }) => {
-  return (h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-3 ez-padding-horizontal--small" }, h("ez-date-input", { enabled: !readOnly, label: label, "data-field-name": name, key: name })));
+export const buildDate = ({ name, label, readOnly, canShowError }) => {
+  return (h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-3 ez-padding-horizontal--small" }, h("ez-date-input", { enabled: !readOnly, label: label, "data-field-name": name, key: name, canShowError: canShowError })));
 };
-export const buildTime = ({ name, label, readOnly }) => {
-  return (h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-3 ez-padding-horizontal--small" }, h("ez-time-input", { enabled: !readOnly, label: label, "data-field-name": name, key: name })));
+export const buildTime = ({ name, label, readOnly, canShowError }) => {
+  return (h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-3 ez-padding-horizontal--small" }, h("ez-time-input", { enabled: !readOnly, label: label, "data-field-name": name, key: name, canShowError: canShowError })));
 };
-export const buildDateTime = ({ name, label, readOnly, contextName }) => {
-  return (h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-3 ez-padding-horizontal--small" }, h("ez-date-time-input", { enabled: !readOnly, label: label, "data-field-name": name, "data-context-name": contextName, key: name })));
+export const buildDateTime = ({ name, label, readOnly, contextName, canShowError }) => {
+  return (h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-3 ez-padding-horizontal--small" }, h("ez-date-time-input", { enabled: !readOnly, label: label, "data-field-name": name, "data-context-name": contextName, key: name, canShowError: canShowError })));
 };

package/dist/collection/components/ez-form-view/fieldbuilder/templates/NumberInput.tpl.js

@@ -1,12 +1,12 @@
 import { h } from "@stencil/core";
-export const buildDecimal = ({ name, label, readOnly, props, contextName }) => {
+export const buildDecimal = ({ name, label, readOnly, props, contextName, canShowError }) => {
   const precision = Number((props === null || props === void 0 ? void 0 : props.precision) || 2);
   const prettyPrecision = Number((props === null || props === void 0 ? void 0 : props.prettyPrecision) || precision);
-  return buildNumeric(name, label, readOnly, precision, prettyPrecision, contextName);
+  return buildNumeric(name, label, readOnly, precision, prettyPrecision, contextName, canShowError);
 };
-export const buildInteger = ({ name, label, readOnly, contextName }) => {
-  return buildNumeric(name, label, readOnly, 0, 0, contextName);
+export const buildInteger = ({ name, label, readOnly, contextName, canShowError }) => {
+  return buildNumeric(name, label, readOnly, 0, 0, contextName, canShowError);
 };
-function buildNumeric(fieldName, fieldLabel, readOnly, precision, prettyPrecision, contextName) {
-  return (h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-3 ez-padding-horizontal--small" }, h("ez-number-input", { enabled: !readOnly, label: fieldLabel, precision: precision, prettyPrecision: prettyPrecision, "data-field-name": fieldName, "data-context-name": contextName, key: fieldName })));
+function buildNumeric(fieldName, fieldLabel, readOnly, precision, prettyPrecision, contextName, canShowError) {
+  return (h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-3 ez-padding-horizontal--small" }, h("ez-number-input", { enabled: !readOnly, label: fieldLabel, precision: precision, prettyPrecision: prettyPrecision, "data-field-name": fieldName, "data-context-name": contextName, key: fieldName, canShowError: canShowError })));
 }

package/dist/collection/components/ez-form-view/fieldbuilder/templates/SearchInput.tpl.js

@@ -1,4 +1,4 @@
 import { h } from "@stencil/core";
-export const buildSearch = ({ name, label, readOnly, required, contextName }) => {
-  return (h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-3 ez-padding-horizontal--small" }, h("ez-search", { enabled: !readOnly, suppressEmptyOption: required, label: label, "data-field-name": name, "data-context-name": contextName, key: name })));
+export const buildSearch = ({ name, label, readOnly, required, contextName, canShowError, optionLoader }) => {
+  return (h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-3 ez-padding-horizontal--small" }, h("ez-search", { enabled: !readOnly, suppressEmptyOption: required, label: label, "data-field-name": name, "data-context-name": contextName, key: name, canShowError: canShowError, optionLoader: optionLoader })));
 };

package/dist/collection/components/ez-form-view/fieldbuilder/templates/TextArea.tpl.js

@@ -1,4 +1,4 @@
 import { h } from "@stencil/core";
-export const buildTextArea = ({ name, label, readOnly, contextName }) => {
-  return (h("div", { class: "ez-col ez-col--sd-12 ez-padding-horizontal--small", key: name }, h("ez-text-area", { enabled: !readOnly, label: label, "data-field-name": name, "data-context-name": contextName })));
+export const buildTextArea = ({ name, label, readOnly, contextName, rows, canShowError }) => {
+  return (h("div", { class: "ez-col ez-col--sd-12 ez-padding-horizontal--small", key: name }, h("ez-text-area", { enabled: !readOnly, label: label, "data-field-name": name, "data-context-name": contextName, rows: rows, canShowError: canShowError })));
 };

package/dist/collection/components/ez-form-view/fieldbuilder/templates/TextInput.tpl.js

@@ -1,4 +1,4 @@
 import { h } from "@stencil/core";
-export const buildTextInput = ({ name, label, readOnly, contextName }) => {
-  return (h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-3 ez-padding-horizontal--small" }, h("ez-text-input", { label: label, "data-field-name": name, "data-context-name": contextName, key: name, enabled: !readOnly })));
+export const buildTextInput = ({ name, label, readOnly, contextName, canShowError }) => {
+  return (h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-3 ez-padding-horizontal--small" }, h("ez-text-input", { label: label, "data-field-name": name, "data-context-name": contextName, key: name, enabled: !readOnly, canShowError: canShowError })));
 };

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

@@ -277,6 +277,9 @@ p {
   -moz-user-select: -moz-none;
   -ms-user-select: none;
   user-select: none;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
 
   /*public*/
   color: var(--title--primary);

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

@@ -519,7 +519,7 @@ export class EzList {
   render() {
     return (h(Host, { ref: (el) => this._element = el }, this.useGroups ?
       h("div", { class: "group-container", ref: (el) => this._groupContainer = el, tabIndex: 0, onKeyDown: (event) => { this.keyDownHandler(event); } }, this._listGroupItems.map(group => {
-        return h("div", { id: this.getDivGroupId(group.group), class: "group", key: group.group + group.items.length, onDrop: () => this.onDropGroup(group) }, h("label", { draggable: false, class: "group-name" }, group.group), h("section", { class: "section-container", onDragOver: (ev) => ev.preventDefault() }, h("div", { class: "group-items-container" }, h("div", { class: "draggable-list" }, group.items.map((item, index) => (h("li", Object.assign({ id: "item_" + this.getItemId(item.label), class: {
+        return h("div", { id: this.getDivGroupId(group.group), class: "group", key: group.group + group.items.length, onDrop: () => this.onDropGroup(group) }, h("label", { draggable: false, class: "group-name", title: group.group }, group.group), h("section", { class: "section-container", onDragOver: (ev) => ev.preventDefault() }, h("div", { class: "group-items-container" }, h("div", { class: "draggable-list" }, group.items.map((item, index) => (h("li", Object.assign({ id: "item_" + this.getItemId(item.label), class: {
             "selectable-container": this.ezSelectable,
             "hover-feedback": this.hoverFeedback
           }, key: "item_" + this.getItemId(item.label) }, { [ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME]: ElementIDUtils.getInternalIDInfo(`ezListItem__${StringUtils.replaceAccentuatedChars(item.label)}`) }), h("div", { class: "draggable" + (item.selected == true ? " selected-item " : "") + (this.ezSelectable == true ? " selectable " : ""), onClick: () => { this.setSelection(item); }, onDragLeave: () => { group.sort ? undefined : this.removeOverClass(); }, onDragEnd: () => this.onDragEnd(), onDragStart: () => this.onDragStart(item, group, index), onDragOver: (event) => { group.sort ? undefined : this.onDragOverItem(event); }, onDrop: (event) => this.onDrop(event, { groupName: group.group, item: item, index: index }), draggable: this.ezDraggable }, h("div", { class: "item-content" }, this.ezDraggable ? h("span", { class: "draggable-icon" }) : undefined, this.listMode === "regular" ?

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

@@ -3,6 +3,8 @@
   --ez-modal-z-index: var(--most-visible, 3);
   /*@doc Define o espaçamento vertical do conteúdo do modal.*/
   --ez-modal-vertical-padding: var(--space--large, 24px);
+  /*@doc Define o padding entre o conteúdo e o modal */
+  --ez-modal-content-padding: 24px;
   display: block;
 }
 
@@ -15,8 +17,15 @@
   width: 100%;
   box-sizing: border-box;
   height: 100vh;
+}
+
+.modal__screen-light{
+  background: rgba(0, 4, 12, 0.1);
+}
+
+.modal__screen-medium{
   backdrop-filter: blur(4px);
-  background: rgba(0, 4, 12, 0.4);
+  background: rgba(0, 4, 12, 0.4)
 }
 
 .modal__vertical-padding{
@@ -62,7 +71,7 @@
   height: 100%;
   overflow-y: auto;
   background-color: rgb(255, 255, 255);
-  padding: 24px;
+  padding: var(--ez-modal-content-padding);
   box-shadow: rgb(0 38 111 / 12%) 0px 0px 16px 0px;
 }
 

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

@@ -13,6 +13,7 @@ export class EzModal {
     this.opened = true;
     this.closeEsc = false;
     this.closeOutsideClick = false;
+    this.scrim = "medium";
   }
   observeOpened() {
     if (this.opened) {
@@ -45,9 +46,10 @@ export class EzModal {
     const positionSufix = this.align === "left" ? "left" : "right";
     const regularVerticalPaddingClass = this.heightMode === "regular" ? 'modal__vertical-padding' : '';
     const modalContentHeightMode = this.heightMode === "regular" ? `modal__content--${positionSufix}` : '';
+    const scrimType = `modal__screen-${this.scrim}`;
     return (h(Host, null, this.opened
       ?
-        h("div", { ref: ref => this._modalRef = ref, class: `modal ${regularVerticalPaddingClass}`, onMouseDown: evt => this.onMouseDownHandler(evt) }, h("div", { class: `modal__container modal__container--${positionSufix}`, ref: ref => this._overlay = ref }, h("div", { class: `modal__content ${modalContentHeightMode} ${this.modalSize}` }, h("slot", null))))
+        h("div", { ref: ref => this._modalRef = ref, class: `modal ${scrimType} ${regularVerticalPaddingClass}`, onMouseDown: evt => this.onMouseDownHandler(evt) }, h("div", { class: `modal__container modal__container--${positionSufix}`, ref: ref => this._overlay = ref }, h("div", { class: `modal__content ${modalContentHeightMode} ${this.modalSize}` }, h("slot", null))))
       :
         undefined));
   }
@@ -174,6 +176,24 @@ export class EzModal {
         "attribute": "close-outside-click",
         "reflect": false,
         "defaultValue": "false"
+      },
+      "scrim": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "\"medium\" | \"light\"",
+          "resolved": "\"light\" | \"medium\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Define o tipo de scrim a ser aplicado no overlay do modal"
+        },
+        "attribute": "scrim",
+        "reflect": false,
+        "defaultValue": "\"medium\""
       }
     };
   }

package/dist/collection/components/ez-number-input/ez-number-input.js

@@ -7,6 +7,7 @@ export class EzNumberInput {
     this.label = undefined;
     this.value = undefined;
     this.enabled = true;
+    this.canShowError = true;
     this.errorMessage = undefined;
     this.precision = undefined;
     this.prettyPrecision = undefined;
@@ -128,7 +129,7 @@ export class EzNumberInput {
   }
   render() {
     ElementIDUtils.addIDInfoIfNotExists(this._elem, 'input');
-    return (h("ez-text-input", { "data-element-id": ElementIDUtils.getInternalIDInfo("textInput"), ref: elem => this._textInput = elem, "data-slave-mode": "true", label: this.label, onBlur: () => this.handleBlur(), onInput: () => this.handleInput(), restrict: this.precision > 0 ? "0123456789-,." : "0123456789-", enabled: this.enabled, errorMessage: this.errorMessage, mode: this.mode }));
+    return (h("ez-text-input", { "data-element-id": ElementIDUtils.getInternalIDInfo("textInput"), ref: elem => this._textInput = elem, "data-slave-mode": "true", label: this.label, onBlur: () => this.handleBlur(), onInput: () => this.handleInput(), restrict: this.precision > 0 ? "0123456789-,." : "0123456789-", enabled: this.enabled, errorMessage: this.errorMessage, mode: this.mode, canShowError: this.canShowError }));
   }
   static get is() { return "ez-number-input"; }
   static get encapsulation() { return "shadow"; }
@@ -196,6 +197,24 @@ export class EzNumberInput {
         "reflect": false,
         "defaultValue": "true"
       },
+      "canShowError": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Se false deixa de exibir a mensagem de erro dentro do campo."
+        },
+        "attribute": "can-show-error",
+        "reflect": true,
+        "defaultValue": "true"
+      },
       "errorMessage": {
         "type": "string",
         "mutable": true,

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

@@ -12,6 +12,7 @@ export class EzSearch {
     this.showOptionValue = true;
     this.suppressEmptyOption = false;
     this.mode = "regular";
+    this.canShowError = true;
   }
   observeErrorMessage() {
     if (this._comboElement) {
@@ -54,7 +55,7 @@ export class EzSearch {
   }
   render() {
     ElementIDUtils.addIDInfoIfNotExists(this._elem, 'input');
-    return (h("ez-combo-box", { "data-element-id": ElementIDUtils.getInternalIDInfo("combo"), ref: elem => this._comboElement = elem, value: this.value, label: this.label, enabled: this.enabled, errorMessage: this.errorMessage, optionLoader: this.optionLoader, searchMode: true, onEzChange: event => this.onComboChange(event), showSelectedValue: this.showSelectedValue, showOptionValue: this.showOptionValue, suppressEmptyOption: this.suppressEmptyOption, mode: this.mode }));
+    return (h("ez-combo-box", { "data-element-id": ElementIDUtils.getInternalIDInfo("combo"), ref: elem => this._comboElement = elem, value: this.value, label: this.label, enabled: this.enabled, errorMessage: this.errorMessage, optionLoader: this.optionLoader, searchMode: true, onEzChange: event => this.onComboChange(event), showSelectedValue: this.showSelectedValue, showOptionValue: this.showOptionValue, suppressEmptyOption: this.suppressEmptyOption, mode: this.mode, canShowError: this.canShowError }));
   }
   ;
   static get is() { return "ez-search"; }
@@ -246,6 +247,24 @@ export class EzSearch {
         "attribute": "mode",
         "reflect": true,
         "defaultValue": "\"regular\""
+      },
+      "canShowError": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Se false deixa de exibir a mensagem de erro dentro do campo."
+        },
+        "attribute": "can-show-error",
+        "reflect": true,
+        "defaultValue": "true"
       }
     };
   }

package/dist/collection/components/ez-time-input/ez-time-input.js

@@ -9,6 +9,7 @@ export class EzTimeInput {
     this.errorMessage = undefined;
     this.showSeconds = false;
     this.mode = "regular";
+    this.canShowError = true;
   }
   observeErrorMessage() {
     var _a;
@@ -137,7 +138,7 @@ export class EzTimeInput {
   }
   render() {
     ElementIDUtils.addIDInfoIfNotExists(this._elem, 'input');
-    return (h(Host, null, h("ez-text-input", { "data-element-id": ElementIDUtils.getInternalIDInfo("textInput"), ref: (el) => this._textInput = el, "data-slave-mode": "true", value: this._viewValue, enabled: this.enabled, label: this.label, restrict: "0123456789:", onBlur: () => this.handleBlur(), onInput: () => this.handleInput(), errorMessage: this.errorMessage, mode: this.mode }, h("ez-icon", { slot: "leftIcon", iconName: "timer-outline" }))));
+    return (h(Host, null, h("ez-text-input", { "data-element-id": ElementIDUtils.getInternalIDInfo("textInput"), ref: (el) => this._textInput = el, "data-slave-mode": "true", value: this._viewValue, enabled: this.enabled, label: this.label, restrict: "0123456789:", onBlur: () => this.handleBlur(), onInput: () => this.handleInput(), errorMessage: this.errorMessage, mode: this.mode, canShowError: this.canShowError }, h("ez-icon", { slot: "leftIcon", iconName: "timer-outline" }))));
   }
   static get is() { return "ez-time-input"; }
   static get encapsulation() { return "shadow"; }
@@ -258,6 +259,24 @@ export class EzTimeInput {
         "attribute": "mode",
         "reflect": true,
         "defaultValue": "\"regular\""
+      },
+      "canShowError": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Se false deixa de exibir a mensagem de erro dentro do campo."
+        },
+        "attribute": "can-show-error",
+        "reflect": true,
+        "defaultValue": "true"
       }
     };
   }

package/dist/collection/utils/ApplicationUtils.js

@@ -66,6 +66,7 @@ export default class ApplicationUtils {
     modal.heightMode = modalProps.heightMode;
     modal.closeEsc = modalProps.closeEsc;
     modal.closeOutsideClick = modalProps.closeOutsideClick;
+    modal.scrim = modalProps.useScrimLight ? 'light' : 'medium';
     if (modalProps.content instanceof String || typeof modalProps.content === 'string') {
       modal.innerHTML = modalProps.content;
     }