@sankhyalabs/ezui 7.2.0 → 7.3.0

package/dist/cjs/{search-column-c04897a9.js → search-column-316e2c59.js}

@@ -1,8 +1,8 @@
 'use strict';
 
 const core = require('@sankhyalabs/core');
-const ApplicationUtils = require('./ApplicationUtils-9a9185fc.js');
-const index = require('./index-d4a1cad8.js');
+const ApplicationUtils = require('./ApplicationUtils-5cc05979.js');
+const index = require('./index-1be40f19.js');
 const index$1 = require('./index-a7b0c73d.js');
 
 const isSystemRequired = (descriptor) => {
@@ -374,8 +374,8 @@ class DataBinder {
     }
   }
   bindSearchOptionsLoader(fieldName, field) {
-    if ((field.nodeName === "EZ-SEARCH" || field.nodeName === "EZ-CLASSIC-SEARCH" || field.nodeName === "EZ-SEARCH-PLUS" || field.nodeName === "EZ-CLASSIC-SEARCH-PLUS") && field["optionLoader"] == undefined) {
-      const isSearchPlus = (field.nodeName === "EZ-SEARCH-PLUS" || field.nodeName === "EZ-CLASSIC-SEARCH-PLUS");
+    if ((field.nodeName === "EZ-SEARCH" || field.nodeName === "EZ-SEARCH-PLUS") && field["optionLoader"] == undefined) {
+      const isSearchPlus = field.nodeName === "EZ-SEARCH-PLUS";
       const loader = isSearchPlus ? core.ApplicationContext.getContextValue("__EZUI__SEARCH__PLUS__OPTION__LOADER__") : core.ApplicationContext.getContextValue("__EZUI__SEARCH__OPTION__LOADER__");
       if (loader) {
         field["optionLoader"] = (arg, ctxOptions) => {
@@ -491,15 +491,13 @@ class Bind {
 
 const SHORTCUT_SEARCH_FIELD = "ctrl+f";
 const SEARCH_FIELD_FULL_WIDTH = 240;
+const SEARCH_FIELD_MARGIN_BOTTOM = "0px";
+const SEARCH_FIELD_WIDTH = String(SEARCH_FIELD_FULL_WIDTH - 30) + "px";
 const buildFieldSearch = (action, optionLoader, onSelectField) => {
-  return index$1.h("ez-search", { class: 'ez-padding--medium', style: {
-      "--ez-search--min-width": `${SEARCH_FIELD_FULL_WIDTH}px`
-    }, canShowError: false, showSelectedValue: false, showOptionValue: false, suppressEmptyOption: true, label: action.label, value: null, optionLoader: optionLoader, onEzChange: (evt) => {
-      window.dispatchEvent(new CustomEvent('ezCloseSplitButtonDropdown', { detail: { action, value: evt.detail } }));
-      requestAnimationFrame(() => {
-        onSelectField(evt.detail);
-      });
-    }, ignoreLimitCharsToSearch: true });
+  return index$1.h("ez-search", { class: 'ez-padding--small ez-margin--none', style: {
+      "--ez-text-input__margin-bottom": SEARCH_FIELD_MARGIN_BOTTOM,
+      "--ez-search--width": SEARCH_FIELD_WIDTH
+    }, canShowError: false, showSelectedValue: false, showOptionValue: false, suppressEmptyOption: true, label: action.label, value: null, optionLoader: optionLoader, onEzChange: (evt) => onSelectField(evt.detail), ignoreLimitCharsToSearch: true });
 };
 const focusOnFieldSerch = async (field) => {
   requestAnimationFrame(async () => {

package/dist/collection/collection-manifest.json

@@ -26,15 +26,7 @@
     "./components/ez-chip/ez-chip.js",
     "./components/ez-classic-combo-box/ez-classic-combo-box.js",
     "./components/ez-classic-input/ez-classic-input.js",
-    "./components/ez-classic-date-input/ez-classic-date-input.js",
-    "./components/ez-classic-date-time-input/ez-classic-date-time-input.js",
-    "./components/ez-classic-number-input/ez-classic-number-input.js",
-    "./components/ez-classic-search/ez-classic-search.js",
-    "./components/ez-classic-search/subcomponent/classic-search-list/classic-search-list.js",
-    "./components/ez-classic-search-plus/ez-classic-search-plus.js",
-    "./components/ez-classic-search-plus/subcomponent/ez-search-result-list/ez-classic-search-result-list.js",
     "./components/ez-classic-text-area/ez-classic-text-area.js",
-    "./components/ez-classic-time-input/ez-classic-time-input.js",
     "./components/ez-collapsible-box/ez-collapsible-box.js",
     "./components/ez-combo-box/ez-combo-box-list/ez-combo-box-list.js",
     "./components/ez-date-input/ez-date-input.js",
@@ -50,11 +42,9 @@
     "./components/ez-form-view/ez-form-view.js",
     "./components/ez-form-view/custom-input/ez-custom-form-input.js",
     "./components/ez-grid/ez-grid.js",
-    "./components/ez-grid-pagination/ez-grid-pagination.js",
     "./components/ez-grid-view/ez-grid-view.js",
     "./components/ez-guide-navigator/ez-guide-navigator.js",
     "./components/ez-icon/ez-icon.js",
-    "./components/ez-image-input/ez-image-input.js",
     "./components/ez-list-item/ez-list-item.js",
     "./components/ez-loading-bar/ez-loading-bar.js",
     "./components/ez-modal-container/ez-modal-container.js",
@@ -67,7 +57,6 @@
     "./components/ez-popover-plus/subcomponent/ez-popover-core.js",
     "./components/ez-popup/ez-popup.js",
     "./components/ez-progress-bar/ez-progress-bar.js",
-    "./components/ez-record-navigation/ez-record-navigation.js",
     "./components/ez-rich-text/ez-rich-text.js",
     "./components/ez-rich-text/ez-link-builder/ez-link-builder.js",
     "./components/ez-rich-text/ez-rich-toolbar/ez-rich-toolbar.js",
@@ -136,56 +125,6 @@
         "ez-check"
       ]
     },
-    {
-      "components": [
-        "ez-chip"
-      ]
-    },
-    {
-      "components": [
-        "ez-classic-combo-box"
-      ]
-    },
-    {
-      "components": [
-        "ez-classic-date-input"
-      ]
-    },
-    {
-      "components": [
-        "ez-classic-date-time-input"
-      ]
-    },
-    {
-      "components": [
-        "ez-classic-input"
-      ]
-    },
-    {
-      "components": [
-        "ez-classic-number-input"
-      ]
-    },
-    {
-      "components": [
-        "ez-classic-search"
-      ]
-    },
-    {
-      "components": [
-        "ez-classic-search-plus"
-      ]
-    },
-    {
-      "components": [
-        "ez-classic-text-area"
-      ]
-    },
-    {
-      "components": [
-        "ez-classic-time-input"
-      ]
-    },
     {
       "components": [
         "ez-collapsible-box"
@@ -223,17 +162,17 @@
     },
     {
       "components": [
-        "ez-grid-pagination"
+        "ez-grid-view"
       ]
     },
     {
       "components": [
-        "ez-grid-view"
+        "ez-icon"
       ]
     },
     {
       "components": [
-        "ez-icon"
+        "ez-chip"
       ]
     },
     {

package/dist/collection/components/ez-classic-combo-box/ez-classic-combo-box.css

@@ -50,11 +50,6 @@
 
   /*@doc Define a altura mínima dos itens da lista.*/
   --ez-classic-combo-box-item-min-height: auto;
-
-  /*@doc Define a largura do componente.*/
-  --ez-classic-combo-box-width: 100%;
-
-  width: var(--ez-classic-combo-box-width);
 }
 
 ul {

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

@@ -13,13 +13,10 @@ export class EzClassicComboBox {
     this.label = undefined;
     this.placeholder = undefined;
     this.enabled = true;
-    this.required = false;
     this.readonly = false;
     this.name = undefined;
     this.state = "default";
-    this.size = "default";
     this.helpText = undefined;
-    this.errorMessage = undefined;
     this.iconName = undefined;
     this.titleIcon = undefined;
     this.iconClickable = false;
@@ -63,23 +60,9 @@ export class EzClassicComboBox {
     this.popoverVisible = false;
     await ((_a = this._popoverElem) === null || _a === void 0 ? void 0 : _a.hide());
   }
-  getFullOption(option) {
-    if (typeof option === 'string') {
-      return this.options.find(opt => opt.value === option);
-    }
-    return option;
-  }
-  getOptionValue(option) {
-    if (!option) {
-      return null;
-    }
-    if (typeof option === 'string') {
-      return option;
-    }
-    return option.value;
-  }
   compareOptionValues(option1, option2) {
-    return this.getOptionValue(option1) === this.getOptionValue(option2);
+    var _a, _b;
+    return JSON.stringify((_a = option1 === null || option1 === void 0 ? void 0 : option1.value) !== null && _a !== void 0 ? _a : null) === JSON.stringify((_b = option2 === null || option2 === void 0 ? void 0 : option2.value) !== null && _b !== void 0 ? _b : null);
   }
   setEmptyValue() {
     this.value = null;
@@ -95,11 +78,10 @@ export class EzClassicComboBox {
       await this.hidePopover();
       return;
     }
-    if (!this.getOptionValue(option)) {
+    if (!option.value) {
       this.setEmptyValue();
     }
     else {
-      option = this.getFullOption(option);
       this.value = option;
       this.inputValue = option.label;
     }
@@ -109,14 +91,9 @@ export class EzClassicComboBox {
   async optionsChanged() {
     this.filterOptions('');
   }
-  async valueChanged(newValue, oldValue) {
-    var _a;
-    if (this.compareOptionValues(newValue, oldValue)) {
-      return;
-    }
+  async valueChanged(newValue) {
     if (newValue) {
-      this.value = this.getFullOption(newValue);
-      this.inputValue = (_a = this.value) === null || _a === void 0 ? void 0 : _a.label;
+      this.inputValue = newValue.label;
       this.setHighlightedIndexToValue();
     }
     else {
@@ -150,12 +127,12 @@ export class EzClassicComboBox {
     this.filterOptions(this.inputValue);
   }
   async handleEzBlur(event) {
+    var _a, _b;
     event.stopPropagation();
-    const optionValue = this.getFullOption(this.value);
-    if ((optionValue === null || optionValue === void 0 ? void 0 : optionValue.label) !== this.inputValue) {
-      this.inputValue = (optionValue === null || optionValue === void 0 ? void 0 : optionValue.label) || '';
+    if (((_a = this.value) === null || _a === void 0 ? void 0 : _a.label) !== this.inputValue) {
+      this.inputValue = ((_b = this.value) === null || _b === void 0 ? void 0 : _b.label) || '';
     }
-    this.ezBlur.emit(optionValue);
+    this.ezBlur.emit(this.value);
   }
   filterOptions(searchTerm) {
     if (!this.options) {
@@ -256,7 +233,7 @@ export class EzClassicComboBox {
   }
   setHighlightedIndexToValue() {
     if (this.value && this.filteredOptions) {
-      const index = this.filteredOptions.findIndex(opt => opt.value === this.getOptionValue(this.value));
+      const index = this.filteredOptions.findIndex(opt => opt.value === this.value.value);
       if (index >= 0) {
         this.highlightedIndex = index;
         return;
@@ -307,17 +284,17 @@ export class EzClassicComboBox {
     this.addInfoId();
     this.checkSlotContent();
     if (this.value) {
-      this.inputValue = this.getFullOption(this.value).label;
+      this.inputValue = this.value.label;
       this.setHighlightedIndexToValue();
     }
   }
   render() {
     var _a;
-    return (h(Host, null, h("ez-classic-input", { ref: ref => this._inputElem = ref, name: this.name, label: this.label, placeholder: this.placeholder, value: this.inputValue, state: this.state, enabled: this.enabled, required: this.required, size: this.size, readonly: this.readonly || this.suppressSearch, leftIconName: this.iconName, leftIconTooltip: this.titleIcon, leftIconClickable: this.iconClickable, rightIconClickable: true, helpText: this.helpText, errorMessage: this.errorMessage, rightIconName: this.popoverVisible ? 'chevron-up' : 'chevron-down', onIconClick: this.handleIconClick.bind(this), onEzChange: this.handleEzChange.bind(this), onEzFocus: this.showPopover.bind(this), onEzBlur: this.handleEzBlur.bind(this) }), h("ez-popover-core", { ref: ref => this._popoverElem = ref, useAnchorSize: true, onEzVisibilityChange: this.handleVisibilityChange.bind(this), overlayType: "none", options: { verticalGap: 2, horizontalGap: 0 }, autoClose: false }, h("slot", { onSlotchange: this.checkSlotContent.bind(this) }), !this.hasSlotContent && (((_a = this.filteredOptions) === null || _a === void 0 ? void 0 : _a.length) > 0 ? (h("ul", { ref: ref => this._listElem = ref, tabIndex: -1 }, this.filteredOptions.map((option, index) => {
-      var _a;
+    return (h(Host, null, h("ez-classic-input", { ref: ref => this._inputElem = ref, name: this.name, label: this.label, placeholder: this.placeholder, value: this.inputValue, state: this.state, enabled: this.enabled, readonly: this.readonly || this.suppressSearch, leftIconName: this.iconName, leftIconTooltip: this.titleIcon, leftIconClickable: this.iconClickable, rightIconClickable: true, helpText: this.helpText, rightIconName: this.popoverVisible ? 'chevron-up' : 'chevron-down', onIconClick: this.handleIconClick.bind(this), onEzChange: this.handleEzChange.bind(this), onEzFocus: this.showPopover.bind(this), onEzBlur: this.handleEzBlur.bind(this) }), h("ez-popover-core", { ref: ref => this._popoverElem = ref, useAnchorSize: true, onEzVisibilityChange: this.handleVisibilityChange.bind(this), overlayType: "none", options: { verticalGap: 2, horizontalGap: 0 }, autoClose: false }, h("slot", { onSlotchange: this.checkSlotContent.bind(this) }), !this.hasSlotContent && (((_a = this.filteredOptions) === null || _a === void 0 ? void 0 : _a.length) > 0 ? (h("ul", { ref: ref => this._listElem = ref, tabIndex: -1 }, this.filteredOptions.map((option, index) => {
+      var _a, _b;
       return (h("li", { key: (_a = option.value) !== null && _a !== void 0 ? _a : '__empty__', value: option.value, class: {
           'highlighted': this.highlightedIndex === index,
-          'selected': this.getOptionValue(this.value) === option.value
+          'selected': ((_b = this.value) === null || _b === void 0 ? void 0 : _b.value) === option.value
         }, onMouseDown: () => this.selectOption(option) }, option.label));
     }))) : (h("span", { class: "no-results" }, "Nenhum resultado encontrado"))))));
   }
@@ -336,11 +313,11 @@ export class EzClassicComboBox {
   static get properties() {
     return {
       "value": {
-        "type": "string",
+        "type": "unknown",
         "mutable": true,
         "complexType": {
-          "original": "IOption | string",
-          "resolved": "IOption | string",
+          "original": "IOption",
+          "resolved": "IOption",
           "references": {
             "IOption": {
               "location": "import",
@@ -354,8 +331,6 @@ export class EzClassicComboBox {
           "tags": [],
           "text": "Valor do combo box."
         },
-        "attribute": "value",
-        "reflect": true,
         "defaultValue": "null"
       },
       "label": {
@@ -410,24 +385,6 @@ export class EzClassicComboBox {
         "reflect": false,
         "defaultValue": "true"
       },
-      "required": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": "Define se o input \u00E9 obrigat\u00F3rio (visualmente)"
-        },
-        "attribute": "required",
-        "reflect": false,
-        "defaultValue": "false"
-      },
       "readonly": {
         "type": "boolean",
         "mutable": false,
@@ -481,24 +438,6 @@ export class EzClassicComboBox {
         "reflect": false,
         "defaultValue": "\"default\""
       },
-      "size": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "\"default\" | \"small\" | \"xsmall\"",
-          "resolved": "\"default\" | \"small\" | \"xsmall\"",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": "Tamanho do input"
-        },
-        "attribute": "size",
-        "reflect": false,
-        "defaultValue": "\"default\""
-      },
       "helpText": {
         "type": "string",
         "mutable": false,
@@ -516,23 +455,6 @@ export class EzClassicComboBox {
         "attribute": "help-text",
         "reflect": false
       },
-      "errorMessage": {
-        "type": "string",
-        "mutable": true,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Define uma mensagem de orienta\u00E7\u00E3o ao usu\u00E1rio, colocando o campo em modo inv\u00E1lido."
-        },
-        "attribute": "error-message",
-        "reflect": true
-      },
       "iconName": {
         "type": "string",
         "mutable": false,
@@ -838,7 +760,7 @@ export class EzClassicComboBox {
       },
       "setValue": {
         "complexType": {
-          "signature": "(option: IOption | string) => Promise<void>",
+          "signature": "(option: IOption) => Promise<void>",
           "parameters": [{
               "tags": [],
               "text": ""

package/dist/collection/components/ez-classic-input/ez-classic-input.css

@@ -8,8 +8,6 @@
   color: var(--color--ocean-green-1000, #00281D);
   border: none;
   padding: 0;
-  padding-inline: var(--space--2, 2px);
-  width: 100%;
 
   /* public */
   /*@doc Define a cor do texto do input. */
@@ -49,19 +47,7 @@
   --ez-classic-input--helptext-color: var(--color--ocean-green-1000, #00281D);
 
   /*@doc Define a altura do input. */
-  --ez-classic-input--height: var(--space--56, 56px);
-
-  /*@doc Define a altura do input. */
-  --ez-classic-input--height-small: var(--space--48, 48px);
-
-  /*@doc Define a altura do input. */
-  --ez-classic-input--height-xsmall: var(--space--40, 40px);
-
-  /*@doc Define o gap entre elementos internos do input. */
-  --ez-classic-input--gap: var(--space--10, 10px);
-
-  /*@doc Define o padding horizontal do input. */
-  --ez-classic-input--padding-inline: var(--space--16, 16px);
+  --ez-classic-input--height: 56px;
 }
 
 .input-container {
@@ -71,23 +57,16 @@
   width: 100%;
   border: none;
   border-radius: var(--border--radius-8, 8px);
-  padding-inline: var(--ez-classic-input--padding-inline);
+  padding: var(--space--16, 16px);
   box-sizing: border-box;
-  gap: var(--ez-classic-input--gap);
-  margin-block: var(--space--4, 4px);
+  gap: var(--space--10, 10px);
+  margin: var(--space--4, 4px) var(--space--2, 2px);
   transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1);
 
   /* public */
   height: var(--ez-classic-input--height);
   background-color: var(--ez-classic-input--background-color);
 }
-.input-container--small {
-  height: var(--ez-classic-input--height-small);
-}
-
-.input-container--xsmall {
-  height: var(--ez-classic-input--height-xsmall);
-}
 
 .input-container,
 .input-container[data-state="default"] {
@@ -180,18 +159,11 @@ label {
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
+  line-height: var(--line-height--20, 20px);
   /* public */
   color: var(--ez-classic-input--label-color);
 }
 
 .icon-clickable {
   cursor: pointer;
-}
-
-.required-indicator {
-  font-size: var(--font--size--default, 14px);
-  font-family: var(--font--pattern, 'Roboto');
-  color: var(--color--red-600, #BD0025);
-  margin-left: var(--space--4, 4px);
-  vertical-align: top;
 }