@sankhyalabs/ezui 7.2.0-rc.9 → 7.2.0

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

@@ -38,6 +38,8 @@ export class EzClassicSearchPlus {
     this.searchDescriptionIsOpen = false;
     this.visibleOptions = undefined;
     this.showLoading = true;
+    this.canShowClearButton = false;
+    this.isHoveringDescription = false;
   }
   async observeValue(newValue, oldValue) {
     var _a;
@@ -51,11 +53,11 @@ export class EzClassicSearchPlus {
       return;
     }
     if (newNormalizedValue === undefined) {
-      this.codeValue = undefined;
-      this.descriptionValue = undefined;
+      this.clearSearch();
       this.ezChange.emit(undefined);
       return;
     }
+    this.canShowClearButton = this.getClearButtonStatus();
     this.codeValue = newNormalizedValue;
     try {
       this.descriptionValue = await this.normalizeCodeToDescriptionValue(newValue);
@@ -149,12 +151,14 @@ export class EzClassicSearchPlus {
     }
   }
   clearSearch() {
-    this.value = null;
-    this.codeValue = null;
-    this.descriptionValue = null;
+    this._textInputCodeValue.value = null;
     if (!this.hideDescriptionInput) {
       this._textInputDescriptionValue.value = null;
     }
+    this.value = null;
+    this.codeValue = null;
+    this.descriptionValue = null;
+    this.canShowClearButton = false;
   }
   async normalizeCodeToDescriptionValue(valueToNormalize) {
     if (!valueToNormalize) {
@@ -198,7 +202,7 @@ export class EzClassicSearchPlus {
   }
   async loadDescriptionValueByCode(codeValue) {
     if (!this.optionLoader) {
-      console.warn(this.i18n("ez-search-plus.optionLoaderNotDefined"));
+      console.warn(this.i18n("ez-classic-search-plus.optionLoaderNotDefined"));
       return "";
     }
     try {
@@ -228,7 +232,7 @@ export class EzClassicSearchPlus {
   }
   async loadAdvancedSearch() {
     if (!this.optionLoader) {
-      console.warn(this.i18n("ez-search-plus.optionLoaderNotDefined"));
+      console.warn(this.i18n("ez-classic-search-plus.optionLoaderNotDefined"));
       return;
     }
     const searchArgument = { mode: SearchMode.ADVANCED, argument: "" };
@@ -255,6 +259,7 @@ export class EzClassicSearchPlus {
       this._popover.showUnder(this.el);
     }
     const argument = event.target.value;
+    this.canShowClearButton = this.getClearButtonStatus();
     await this.debounceLoaderOptions(argument);
   }
   async debounceLoaderOptions(argument) {
@@ -373,15 +378,23 @@ export class EzClassicSearchPlus {
     event.stopPropagation();
     this.searchDescriptionIsOpen = event.detail;
   }
-  render() {
+  getClearButtonStatus() {
     var _a, _b;
+    if (this.ensureClearButtonVisible) {
+      return true;
+    }
+    if (((_a = this._textInputCodeValue) === null || _a === void 0 ? void 0 : _a.value) || ((_b = this._textInputDescriptionValue) === null || _b === void 0 ? void 0 : _b.value)) {
+      return true;
+    }
+    return !!this.value;
+  }
+  render() {
     ElementIDUtils.addIDInfoIfNotExists(this.el, 'input');
-    const canShowClearButton = !this.ensureClearButtonVisible && (!this.value && !((_a = this._textInputCodeValue) === null || _a === void 0 ? void 0 : _a.value) && !((_b = this._textInputDescriptionValue) === null || _b === void 0 ? void 0 : _b.value));
     return (h(Host, null, h("div", { class: "ez-classic-search-plus__wrapper" }, h("div", { class: "ez-classic-search-plus__label-container" }, h("label", { title: this.label }, this.label), this.required && h("span", { class: "required-indicator" }, "*")), h("div", { class: "ez-classic-search-plus__container" }, h("ez-classic-input", { ref: (elem) => this._textInputCodeValue = elem, class: {
         "ez-classic-search-plus__code-input": !this.hideDescriptionInput,
         "ez-classic-search-plus__code-input-no-border": !this.hideDescriptionInput,
         "ez-classic-search-plus__code-input-full": this.hideDescriptionInput
-      }, "data-element-id": ElementIDUtils.getInternalIDInfo("codeInput"), "data-slave-mode": "true", enabled: !this.disableCodeInput && this.enabled, size: this.size, label: null, errorMessage: this.hideDescriptionInput ? this.errorMessage : "", value: this.codeValue, onFocusout: () => this.handleCodeInputFocusOut(), onFocus: () => this.handleCodeInputFocus(), leftIconName: "search", leftIconClickable: this.enabled, onIconClick: () => this.handleSearchClick(), onEzChange: (event) => event.stopPropagation(), state: this.errorMessage && this.canShowError ? "error" : "default" }), !this.hideDescriptionInput && (h("div", { class: "description-input-container" }, h("ez-classic-input", { ref: (elem) => this._textInputDescriptionValue = elem, tabIndex: -1, class: { "ez-classic-search-plus__text-input": true }, "data-element-id": ElementIDUtils.getInternalIDInfo("textInput"), "data-slave-mode": "true", enabled: !this.disableDescriptionInput && this.enabled, label: null, size: this.size, value: this.descriptionValue, onInput: (event) => this.handleTextInputChangeHandler(event), onFocus: () => this.handleDescriptionInputFocus(), rightIconName: canShowClearButton ? "close" : null, rightIconClickable: this.enabled, onIconClick: () => this.clearSearch(), onEzChange: (event) => event.stopPropagation(), state: this.errorMessage && this.canShowError ? "error" : "default" }), h("ez-popover-plus", { ref: elem => this._popover = elem, anchorElement: this.el, autoClose: true, boxWidth: 'fit-content', overlayType: 'none', useAnchorSize: true, onEzVisibilityChange: (event) => this.handleOnEzVisibilityChange(event), "data-element-id": this.el.getAttribute("data-element-id") }, h("ez-classic-search-result-list", { ref: (ref) => this._classicSearchList = ref, showLoading: this.showLoading, visibleOptions: this.visibleOptions, value: this.value, showOptionValue: this.showOptionValue, onChangeValue: (evt) => this.handleSelectItem(evt) }))))), h("div", { class: "ez-classic-search-plus__error-container" }, h("span", null, this.errorMessage)))));
+      }, "data-element-id": ElementIDUtils.getInternalIDInfo("codeInput"), "data-slave-mode": "true", enabled: !this.disableCodeInput && this.enabled, size: this.size, label: null, errorMessage: this.hideDescriptionInput ? this.errorMessage : "", value: this.codeValue, onFocusout: () => this.handleCodeInputFocusOut(), onFocus: () => this.handleCodeInputFocus(), leftIconName: "search", leftIconClickable: this.enabled, onIconClick: () => this.handleSearchClick(), onEzChange: (event) => event.stopPropagation(), state: this.errorMessage && this.canShowError ? "error" : "default" }), !this.hideDescriptionInput && (h("div", { class: "description-input-container", onMouseEnter: () => this.isHoveringDescription = true, onMouseLeave: () => this.isHoveringDescription = false }, h("ez-classic-input", { ref: (elem) => this._textInputDescriptionValue = elem, tabIndex: -1, class: { "ez-classic-search-plus__text-input": true }, "data-element-id": ElementIDUtils.getInternalIDInfo("textInput"), "data-slave-mode": "true", enabled: !this.disableDescriptionInput && this.enabled, label: null, size: this.size, value: this.descriptionValue, onInput: (event) => this.handleTextInputChangeHandler(event), onFocus: () => this.handleDescriptionInputFocus(), rightIconName: this.canShowClearButton && this.isHoveringDescription ? "close" : null, rightIconClickable: this.enabled, onIconClick: () => this.clearSearch(), onEzChange: (event) => event.stopPropagation(), rightIconTooltip: this.i18n("ez-classic-search-plus.clearValue"), state: this.errorMessage && this.canShowError ? "error" : "default" }), h("ez-popover-plus", { ref: elem => this._popover = elem, anchorElement: this.el, autoClose: true, boxWidth: 'fit-content', overlayType: 'none', useAnchorSize: true, onEzVisibilityChange: (event) => this.handleOnEzVisibilityChange(event), "data-element-id": this.el.getAttribute("data-element-id") }, h("ez-classic-search-result-list", { ref: (ref) => this._classicSearchList = ref, showLoading: this.showLoading, visibleOptions: this.visibleOptions, value: this.value, showOptionValue: this.showOptionValue, onChangeValue: (evt) => this.handleSelectItem(evt) }))))), h("div", { class: "ez-classic-search-plus__error-container" }, h("span", null, this.errorMessage)))));
   }
   static get is() { return "ez-classic-search-plus"; }
   static get encapsulation() { return "shadow"; }
@@ -859,7 +872,9 @@ export class EzClassicSearchPlus {
       "isLoadingDescription": {},
       "searchDescriptionIsOpen": {},
       "visibleOptions": {},
-      "showLoading": {}
+      "showLoading": {},
+      "canShowClearButton": {},
+      "isHoveringDescription": {}
     };
   }
   static get events() {

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

@@ -274,6 +274,11 @@ export class EzComboBox {
     else {
       window.setTimeout(() => {
         this.setInputValue(false);
+        if (this._criteria !== undefined) {
+          this._criteria = undefined;
+          this._preSelection = undefined;
+          this.updateVisibleOptions();
+        }
       }, this._deboucingTime);
     }
   }

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

@@ -189,7 +189,7 @@
   transition: var(--ez-dropdown__item--transition);
 }
 
-.ez-dropdown__item:hover {
+.ez-dropdown__item:not(:has(.ez-dropdown__item-builder)):hover {
   /*public*/
   background-color: var(--ez-dropdown__item--background-color);
 }

package/dist/collection/components/ez-form-view/fieldbuilder/FieldBuilder.js

@@ -12,6 +12,7 @@ import { buildSearch } from "./templates/SearchInput.tpl";
 import { buildRichText } from "./templates/RichText.tpl";
 import { getI18n } from "../../../utils/i18n";
 import { buildImage } from "./templates/ImageInput.tpl";
+import { buildMultiSelectInput } from "./templates/MultiSelectInput.tpl";
 const uiBuilders = new Map();
 uiBuilders.set(UserInterface.CHECKBOX, buildCheckBox);
 uiBuilders.set(UserInterface.SWITCH, buildSwitch);
@@ -28,6 +29,7 @@ uiBuilders.set(UserInterface.SEARCHPLUS, buildSearchPlus);
 uiBuilders.set(UserInterface.LONGTEXT, buildTextArea);
 uiBuilders.set(UserInterface.HTML, buildRichText);
 uiBuilders.set(UserInterface.IMAGE, buildImage);
+uiBuilders.set(UserInterface.MULTISELECTOR, buildMultiSelectInput);
 export const fieldBuilder = (field, customUiBuilders = new Map(), context) => {
   const i18n = getI18n();
   const shouldUseClassic = (context === null || context === void 0 ? void 0 : context.formLayout) === FormLayout.CLASSIC_CASCADE ||

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

@@ -0,0 +1,17 @@
+import { h } from "@stencil/core";
+export const buildMultiSelectInput = ({ name, label, readOnly, contextName, canShowError, props }) => {
+  var _a, _b, _c, _d;
+  const rawOptions = props === null || props === void 0 ? void 0 : props.options;
+  let options;
+  if (typeof rawOptions === "string") {
+    const parsed = JSON.parse(rawOptions);
+    options = Object.keys(parsed).map(key => ({ value: key, label: parsed[key], check: false }));
+  }
+  else {
+    options = rawOptions;
+  }
+  // Quando o metadata não informa explicitamente, usamos a lista estática (options)
+  // caso não haja um datasource configurado.
+  const useOptions = (_a = props === null || props === void 0 ? void 0 : props.useOptions) !== null && _a !== void 0 ? _a : (options != undefined && (props === null || props === void 0 ? void 0 : props.dataSource) == undefined);
+  return (h("div", { class: "ez-col ez-col--sd-12" }, h("ez-multi-select-input", { class: "ez-input__no-margin", label: label, "data-field-name": name, "data-context-name": contextName, key: name, enabled: !readOnly, canShowError: canShowError, options: options, dataSource: props === null || props === void 0 ? void 0 : props.dataSource, columnName: (_b = props === null || props === void 0 ? void 0 : props.columnName) !== null && _b !== void 0 ? _b : name, useOptions: useOptions, isTextSearch: (_c = props === null || props === void 0 ? void 0 : props.isTextSearch) !== null && _c !== void 0 ? _c : false, orderSelectedFirst: (_d = props === null || props === void 0 ? void 0 : props.orderSelectedFirst) !== null && _d !== void 0 ? _d : false })));
+};

package/dist/collection/components/ez-grid/controller/ag-grid/AgGridController.js

@@ -1217,12 +1217,13 @@ export default class AgGridController {
     }
   }
   onCallStateChange(type, e) {
+    var _a, _b;
     const finished = !('finished' in e) || e['finished'];
     if (finished && this._columnStateChangeCallback) {
       let info = {};
       let isUserChange = this.isUIEvent(e['source'], e['type']);
       if (type === 'columnResize') {
-        info['column'] = { colId: e['column'].colId, actualWidth: e['column'].actualWidth };
+        info['column'] = { colId: (_a = e['column']) === null || _a === void 0 ? void 0 : _a.colId, actualWidth: (_b = e['column']) === null || _b === void 0 ? void 0 : _b.actualWidth };
       }
       info['isUserChange'] = isUserChange;
       info['isElementResize'] = this.isElementResize(e);

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

@@ -138,6 +138,9 @@
 :host[no-header] .grid-header {
   height: 0;
   padding: 0;
+  border: none;
+  box-shadow: none;
+  outline: none;
 }
 
 .overflowed {
@@ -154,4 +157,5 @@
 
 .grid__footer{
   background-color: var(--background--xlight, #FFF);
+  border-radius: 0px 0px var(--border--radius-medium) var(--border--radius-medium);
 }

package/dist/collection/components/ez-grid/subcomponents/filter-column.css

@@ -1,6 +1,10 @@
 .filter-column {
   padding: var(--space--2xs, 8px);
   position: relative;
+  display: flex;
+  flex-direction: column;
+  min-height: 0;
+  height: 100%;
 }
 
 .filter-column__header {
@@ -10,6 +14,7 @@
   align-items: center;
   justify-content: space-between;
   height: var(--space--xl, 32px);
+  flex: 0 0 auto;
 }
 
 .filter-column__footer {
@@ -23,6 +28,7 @@
   left: 0;
   padding-top: var(--space--2xs, 8px);
   border-top: var(--border--medium) var(--color--disable-secondary);
+  flex: 0 0 auto;
 }
 
 .filter-column__popover {
@@ -35,4 +41,8 @@
 
 #filter-column-selection-list {
   --ez-multi-selection-default-height: unset;
+  --ez-multi-selection-default-max-height: 100%;
+  flex: 1 1 auto;
+  min-height: 0;
+  overflow: auto;
 }

package/dist/collection/components/ez-grid/subcomponents/filter-column.js

@@ -102,7 +102,7 @@ export class FilterColumn {
     this.options = null;
   }
   buildOptions(selectedItems) {
-    var _a, _b;
+    var _a, _b, _c, _d;
     if (selectedItems && selectedItems.length > 0) {
       return selectedItems;
     }
@@ -110,10 +110,16 @@ export class FilterColumn {
       return [
         { label: this.i18n("app.yes"), value: 'true', check: true },
         { label: this.i18n("app.no"), value: 'false', check: true },
+        { label: '', value: null, check: true },
       ];
     }
     const options = (_b = (_a = this.fieldDescriptor) === null || _a === void 0 ? void 0 : _a.properties) === null || _b === void 0 ? void 0 : _b.options;
     if (Array.isArray(options)) {
+      if ((_d = (_c = this.fieldDescriptor) === null || _c === void 0 ? void 0 : _c.properties) === null || _d === void 0 ? void 0 : _d.switchLabelsAndValues) {
+        return options.map((option) => {
+          return { label: option.label, value: option.value, check: true };
+        });
+      }
       return options.map((option) => {
         return { label: option.value, value: option.value, check: true };
       });