@sankhyalabs/ezui 0.0.0-bugfix-dev-KB-81596.0 → 0.0.0-bugfix-dev-KB-81596.1

package/dist/esm/ez-collapsible-box.entry.js

@@ -3,7 +3,8 @@ import { ElementIDUtils } from '@sankhyalabs/core';
 import { A as ApplicationUtils } from './ApplicationUtils-eaf91331.js';
 import './DialogType-54a62731.js';
 import './CheckMode-bdb2ec19.js';
-import './ICustomRender-875b5a40.js';
+import './types-6f6b2650.js';
+import './FormLayout-54092963.js';
 
 const ezCollapsibleBoxCss = ":host{--ez-collapsible-box--font-size:var(--title--medium, 14px);--ez-collapsible-box--font-family:var(--font-pattern, Arial);--ez-collapsible-box--font-weight:var(--text-weight--large, 600);--ez-collapsible-box--color:var(--title--primary);--ez-collapsible-box--subtitle--font-size:var(--text--medium, 14px);--ez-collapsible-box--subtitle--font-family:var(--font-pattern, 'Roboto');--ez-collapsible-box--subtitle--font-weight:var(--text-weight--medium, 400);--ez-collapsible-box--subtitle--color:var(--text--primary);--ez-collapsible-box--subtitle--margin-bottom:var(--space--medium, 12px);--ez-collapsible-box--focus--color:var(--color--primary-600);--ez-collapsible-box__icon--color:var(--ez-collapsible-box--color);--ez-collapsible-box__header--padding-top:0px;--ez-collapsible-box__header--padding-bottom:0px;--ez-collapsible-box__header--padding-right:0px;--ez-collapsible-box__header--padding-left:0px;display:flex;flex-wrap:wrap;width:100%}ez-icon{--ez-icon--color:inherit}.collapsible-box{display:flex;flex-direction:column;width:100%}.collapsable-box--bordered{border:var(--border--small);border-color:var(--color--strokes);border-radius:var(--border--radius-medium);padding:var(--space--xs)}.collapsible-box__header{display:flex;box-sizing:border-box;padding-top:var(--ez-collapsible-box__header--padding-top);padding-bottom:var(--ez-collapsible-box__header--padding-bottom);padding-right:var(--ez-collapsible-box__header--padding-right);padding-left:var(--ez-collapsible-box__header--padding-left)}.collapsible-box__title{position:relative;width:100%;display:flex;box-sizing:border-box;align-items:center;outline:none;border:none;background-color:unset;cursor:pointer;padding:0px;text-align:left;color:var(--ez-collapsible-box--color);--ez-icon--color:var(--ez-collapsible-box__icon--color);margin-bottom:var(--space--medium, 12px)}.collapsible-box__title:focus{color:var(--ez-collapsible-box--focus--color);--ez-icon--color:var(--ez-collapsible-box--focus--color)}.collapsible-box__label{display:block;white-space:nowrap;overflow:hidden;cursor:pointer;text-overflow:ellipsis;box-sizing:border-box;margin-left:6px;gap:6px;font-family:var(--ez-collapsible-box--font-family);font-size:var(--ez-collapsible-box--font-size);font-weight:var(--ez-collapsible-box--font-weight)}.subtitle-box__label{display:flex;overflow:hidden;text-overflow:ellipsis;box-sizing:border-box;font-family:var(--ez-collapsible-box--subtitle--font-family);font-size:var(--ez-collapsible-box--subtitle--font-size);font-weight:var(--ez-collapsible-box--subtitle--font-weight);color:var(--ez-collapsible-box--subtitle--color);margin-bottom:var(--ez-collapsible-box--subtitle--margin-bottom)}.subtitle-box__content{width:100%}.collapsible-box__label ez-icon{visibility:hidden;transition:2s all ease-in-out}.collapsible-box__label:hover ez-icon{visibility:visible}.collapsible-box__text-edit{margin-left:6px}.collapsible-box__icon{transform:rotate(90deg) translate(0px, 14%);transition:transform var(--transition)}.collapsible-box__icon--collapsed{transform:rotate(0deg) translate(-14%, 0px)}.collapsible-box__title--icon-right{flex-direction:row-reverse}.collapsible-box__title--icon-right .collapsible-box__icon{transform:rotate(90deg) translate(0px, -14%)}.collapsible-box__title--icon-right .collapsible-box__icon--collapsed{transform:rotate(0deg) translate(14%, 0px)}.collapsible-box__title--icon-right .collapsible-box__label{margin-left:0px;margin-right:6px}.collapsible-box__title--left{margin-right:auto}.collapsible-box__title--right{margin-left:auto}.collapsible-box__title--center{margin-left:auto;margin-right:auto}.collapsible-box__title--stretch{justify-content:space-between;width:100%}.collapsible-box__title--no-margin{margin-bottom:0}.collapsible-box__content{display:flex;flex-wrap:wrap;width:100%;height:0px;max-height:0px;opacity:0;overflow:hidden;transition:all var(--transition, 0.5s)}.collapsible-box__content--show{height:100%;max-height:none;opacity:1;overflow:visible;transition:all var(--transition, 0.5s)}.font--x-small{font-size:10px}.font--small{font-size:12px}.font--medium{font-size:14px}.font--large{font-size:16px}.font--x-large{font-size:20px}";
 

package/dist/esm/ez-combo-box-list_3.entry.js

@@ -1,9 +1,10 @@
 import { r as registerInstance, h, H as Host, c as createEvent, g as getElement } from './index-baa5e267.js';
 import { ElementIDUtils, ObjectUtils, HTMLBuilder, StringUtils } from '@sankhyalabs/core';
-import { C as CustomEditorSource } from './ICustomRender-875b5a40.js';
+import { C as CustomEditorSource } from './types-6f6b2650.js';
 import { A as ApplicationUtils } from './ApplicationUtils-eaf91331.js';
 import './DialogType-54a62731.js';
 import './CheckMode-bdb2ec19.js';
+import './FormLayout-54092963.js';
 
 const ezComboBoxListCss = ":host{--ez-combo-box--border-radius:var(--border--radius-medium, 12px);--ez-combo-box--font-size:var(--text--medium, 14px);--ez-combo-box--font-family:var(--font-pattern, Arial);--ez-combo-box--font-weight--large:var(--text-weight--large, 500);--ez-combo-box--font-weight--medium:var(--text-weight--medium, 400);--ez-combo-box--background-color--xlight:var(--background--xlight, #fff);--ez-combo-box--background-medium:var(--background--medium, #f0f3f7);--ez-combo-box--line-height:calc(var(--text--medium, 14px) + 4px);--ez-combo-box__list-title--primary:var(--title--primary, #2B3A54);--ez-combo-box__list-text--primary:var(--text--primary, #626e82);--ez-combo-box__list-height:calc(var(--ez-combo-box--font-size) + var(--ez-combo-box--space--medium) + 4px);--ez-combo-box--space--medium:var(--space--medium, 12px);--ez-combo-box--space--small:var(--space--small, 6px);--ez-combo-box__scrollbar--color-default:var(--scrollbar--default, #626e82);--ez-combo-box__scrollbar--color-background:var(--scrollbar--background, #E5EAF0);--ez-combo-box__scrollbar--color-hover:var(--scrollbar--hover, #2B3A54);--ez-combo-box__scrollbar--color-clicked:var(--scrollbar--clicked, #a2abb9);--ez-combo-box__scrollbar--border-radius:var(--border--radius-small, 6px);--ez-combo-box__scrollbar--width:var(--space--medium, 12px);--ez-combo-box__list-container--padding:var(--space--extra-small, 3px)}.list-container{padding-top:var(--ez-combo-box__list-container--padding)}.list-wrapper{display:flex;flex-direction:column;box-sizing:border-box;width:0;z-index:var(--more-visible, 2);max-height:calc(4*var(--ez-combo-box__list-height) + 2*var(--ez-combo-box--space--small) + 9px);background-color:var(--ez-combo-box--background-color--xlight);border-radius:var(--ez-combo-box--border-radius);box-shadow:var(--shadow--medium, 0 8px 24px 0 rgba(43, 58, 84, 0.10));padding:var(--ez-combo-box--space--small)}.list-options{box-sizing:border-box;width:100%;height:100%;padding:0;display:flex;flex-direction:column;scroll-behavior:smooth;overflow:auto;scrollbar-width:thin;gap:3px;scrollbar-color:var(--ez-combo-box__scrollbar--color-clicked) var(--ez-combo-box__scrollbar--color-background)}.list-options::-webkit-scrollbar{background-color:var(--ez-combo-box__scrollbar--color-background);width:var(--ez-combo-box__scrollbar--width);max-width:var(--ez-combo-box__scrollbar--width);min-width:var(--ez-combo-box__scrollbar--width)}.list-options::-webkit-scrollbar-track{background-color:var(--ez-combo-box__scrollbar--color-background);border-radius:var(--ez-combo-box__scrollbar--border-radius)}.list-options::-webkit-scrollbar-thumb{background-color:var(--ez-combo-box__scrollbar--color-default);border-radius:var(--ez-combo-box__scrollbar--border-radius)}.list-options::-webkit-scrollbar-thumb:vertical:hover,.list-options::-webkit-scrollbar-thumb:horizontal:hover{background-color:var(--ez-combo-box__scrollbar--color-hover)}.list-options::-webkit-scrollbar-thumb:vertical:active,.list-options::-webkit-scrollbar-thumb:horizontal:active{background-color:var(--ez-combo-box__scrollbar--color-clicked)}.item{display:flex;align-items:center;width:100%;box-sizing:border-box;list-style-type:none;cursor:pointer;border-radius:var(--ez-combo-box--border-radius-small);padding:var(--ez-combo-box--space--small);min-height:var(--ez-combo-box__list-height);gap:var(--space--small, 6px)}.item__value,.item__label{flex-basis:auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ez-combo-box__list-title--primary);font-family:var(--ez-combo-box--font-family);font-size:var(--ez-combo-box--font-size);line-height:var(--ez-combo-box--line-height)}.item__label{font-weight:var(--ez-combo-box--font-weight--medium)}.item__label--bold{font-weight:var(--ez-combo-box--font-weight--large)}.item__value{text-align:center;color:var(--ez-combo-box__list-text--primary);font-weight:var(--ez-combo-box--font-weight--large)}.item__value--hidden{visibility:hidden;position:absolute;white-space:nowrap;z-index:-1;top:0;left:0}.item__label{text-align:left}.message{text-align:center;display:flex;justify-content:center;align-items:center;list-style-type:none;min-height:var(--ez-combo-box__list-height)}.message__no-result{color:var(--ez-combo-box__list-title--primary);font-family:var(--ez-combo-box--font-family);font-size:var(--ez-combo-box--font-size)}.message__loading{border-radius:50%;width:14px;height:14px;-webkit-animation:spin 1s linear infinite;animation:spin 1s linear infinite;border:3px solid var(--ez-combo-box__list-title--primary);border-top:3px solid transparent}li:hover{background-color:var(--ez-combo-box--background-medium)}.preselected{background-color:var(--background--medium)}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg)}}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}";
 

package/dist/esm/ez-combo-box.entry.js

@@ -4,7 +4,8 @@ import './ApplicationUtils-eaf91331.js';
 import { C as CSSVarsUtils } from './CSSVarsUtils-acba92d7.js';
 import './DialogType-54a62731.js';
 import './CheckMode-bdb2ec19.js';
-import './ICustomRender-875b5a40.js';
+import './types-6f6b2650.js';
+import './FormLayout-54092963.js';
 
 const ezComboBoxCss = ":host{--ez-combo-box--height:42px;--ez-combo-box--width:100%;--ez-combo-box--border-radius:var(--border--radius-medium, 12px);--ez-combo-box--font-size:var(--text--medium, 14px);--ez-combo-box--font-family:var(--font-pattern, Arial);--ez-combo-box--background-color--xlight:var(--background--xlight, #fff);--ez-combo-box__input--background-color:var(--background--medium, #e0e0e0);--ez-combo-box__input--border:var(--border--medium, 2px solid);--ez-combo-box__input--border-color:var(--ez-combo-box__input--background-color);--ez-combo-box__input--focus--border-color:var(--color--primary, #008561);--ez-combo-box__input--disabled--background-color:var(--color--disable-secondary, #F2F5F8);--ez-combo-box__input--disabled--color:var(--text--disable, #AFB6C0);--ez-combo-box__btn--color:var(--title--primary, #2B3A54);--ez-combo-box__btn-disabled--color:var(--text--disable, #AFB6C0);--ez-combo-box__btn-hover--color:var(--color--primary, #4e4e4e);width:var(--ez-combo-box--width)}ez-icon{--ez-icon--color:inherit;font-weight:var(--text-weight--large, 600)}.suppressed-search-input{--ez-text-input__input--border-color:var(--color--strokes, #dce0e8);--ez-text-input__input--disabled--background-color:var(--background--xlight, #fff);--ez-text-input__input--disabled--color:var(--title--primary, #2B3A54)}.btn{outline:none;border:none;background:none;cursor:pointer;padding:0px;color:var(--ez-combo-box__btn--color)}.btn:disabled{cursor:unset;color:var(--ez-combo-box__btn-disabled--color)}.btn:disabled:hover{cursor:not-allowed;color:var(--ez-combo-box__btn-disabled--color)}.btn:hover{color:var(--ez-combo-box__btn-hover--color)}.btn__close{visibility:hidden}ez-text-input:hover .btn__close,ez-text-input:focus .btn__close{visibility:visible}.text-input-slot-container{--ez-text-input__icon--width:32px;--ez-text-input__min-width:var(--ez-combo-box__min-width);--ez-text-input__max-width:var(--ez-combo-box__max-width)}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg)}}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}";
 
@@ -24,7 +25,6 @@ const EzComboBox = class {
     this._startLoading = false;
     this._showLoading = true;
     this._criteria = undefined;
-    this._textInputReady = undefined;
     this.limitCharsToSearch = 3;
     this.value = undefined;
     this.label = undefined;
@@ -304,11 +304,6 @@ const EzComboBox = class {
   //---------------------------------------------
   // Lifecycle web component
   //---------------------------------------------
-  componentDidRender() {
-    if (this._textInput) {
-      this._textInputReady = true;
-    }
-  }
   componentWillLoad() {
     if (this.options === undefined) {
       this.options = [];

package/dist/esm/ez-date-input.entry.js

@@ -157,7 +157,7 @@ const EzDateInput = class {
     }
   }
   disconnectedCallback() {
-    this.hideCalendar();
+    this._popover.hide();
   }
   componentDidLoad() {
     CSSVarsUtils.applyVarsTextInput(this._elem, this._textInput);

package/dist/esm/ez-date-time-input.entry.js

@@ -208,7 +208,7 @@ const EzDateTimeInput = class {
     }
   }
   disconnectedCallback() {
-    this.hideCalendar();
+    this._popover.hide();
   }
   componentDidLoad() {
     CSSVarsUtils.applyVarsTextInput(this._elem, this._textInput);

package/dist/esm/ez-form-view.entry.js

@@ -1,6 +1,6 @@
 import { h, r as registerInstance, c as createEvent, g as getElement, H as Host } from './index-baa5e267.js';
-import { ObjectUtils, UserInterface, ElementIDUtils } from '@sankhyalabs/core';
-import { R as REQUIRED_INFO } from './constants-4e0d35b7.js';
+import { ObjectUtils, StringUtils, UserInterface, ElementIDUtils } from '@sankhyalabs/core';
+import { R as REQUIRED_INFO } from './constants-b036528f.js';
 import { C as CheckMode } from './CheckMode-bdb2ec19.js';
 
 const buildSwitch = (field) => {
@@ -73,12 +73,6 @@ function buildNumeric(fieldName, fieldLabel, readOnly, precision, prettyPrecisio
     h("ez-number-input", { class: "ez-input__no-margin", enabled: !readOnly, label: fieldLabel, precision: precision, prettyPrecision: prettyPrecision, "data-field-name": fieldName, "data-context-name": contextName, key: fieldName, canShowError: canShowError })));
 }
 
-const buildSearch = ({ name, label, readOnly, required, contextName, canShowError, optionLoader, props }) => {
-  var _a;
-  return (h("div", { class: "ez-col ez-col--sd-12" },
-    h("ez-search", { class: "ez-input__no-margin", enabled: !readOnly, suppressEmptyOption: required, label: label, "data-field-name": name, "data-context-name": contextName, key: name, canShowError: canShowError, optionLoader: optionLoader, ignoreLimitCharsToSearch: (_a = props === null || props === void 0 ? void 0 : props.ignoreLimitCharsToSearch) !== null && _a !== void 0 ? _a : false })));
-};
-
 const buildTextArea = ({ name, label, readOnly, contextName, rows, canShowError }) => {
   return (h("div", { class: "ez-col ez-col--sd-12", key: name },
     h("ez-text-area", { enabled: !readOnly, label: label, "data-field-name": name, "data-context-name": contextName, rows: rows, canShowError: canShowError })));
@@ -89,6 +83,18 @@ const buildTextInput = ({ name, label, readOnly, contextName, canShowError, prop
     h("ez-text-input", { class: "ez-input__no-margin", label: label, "data-field-name": name, "data-context-name": contextName, key: name, enabled: !readOnly, canShowError: canShowError, mask: props === null || props === void 0 ? void 0 : props.mask, "clean-value-mask": props === null || props === void 0 ? void 0 : props.cleanValueMask })));
 };
 
+const buildSearchPlus = ({ name, label, readOnly, contextName, canShowError, optionLoader, props }) => {
+  const hasDescriptionField = !StringUtils.isEmpty(props === null || props === void 0 ? void 0 : props.DESCRIPTIONFIELD);
+  return (h("div", { class: "ez-col ez-col--sd-12" },
+    h("ez-search-plus", { class: "ez-input__no-margin", enabled: !readOnly, label: label, "data-field-name": name, "data-context-name": contextName, key: name, canShowError: canShowError, optionLoader: optionLoader, hideDescriptionInput: !hasDescriptionField })));
+};
+
+const buildSearch = ({ name, label, readOnly, required, contextName, canShowError, optionLoader, props }) => {
+  var _a;
+  return (h("div", { class: "ez-col ez-col--sd-12" },
+    h("ez-search", { class: "ez-input__no-margin", enabled: !readOnly, suppressEmptyOption: required, label: label, "data-field-name": name, "data-context-name": contextName, key: name, canShowError: canShowError, optionLoader: optionLoader, ignoreLimitCharsToSearch: (_a = props === null || props === void 0 ? void 0 : props.ignoreLimitCharsToSearch) !== null && _a !== void 0 ? _a : false })));
+};
+
 const uiBuilders = new Map();
 uiBuilders.set(UserInterface.CHECKBOX, buildCheckBox);
 uiBuilders.set(UserInterface.SWITCH, buildSwitch);
@@ -101,6 +107,7 @@ uiBuilders.set(UserInterface.FILE, buildFile);
 uiBuilders.set(UserInterface.DECIMALNUMBER, buildDecimal);
 uiBuilders.set(UserInterface.INTEGERNUMBER, buildInteger);
 uiBuilders.set(UserInterface.SEARCH, buildSearch);
+uiBuilders.set(UserInterface.SEARCHPLUS, buildSearchPlus);
 uiBuilders.set(UserInterface.LONGTEXT, buildTextArea);
 const fieldBuilder = (field) => {
   const builder = uiBuilders.get(field.userInterface) || buildTextInput;
@@ -146,7 +153,7 @@ class FormItems {
   }
 }
 
-const ezFormViewCss = ".sc-ez-form-view-h{display:flex;flex-wrap:wrap;width:100%;--ez-form-view__item--min-width:220px;--ez-form-view__item--width:var(--space--small);--ez-form-view__item--padding:var(--space--small)}.form-view__content.sc-ez-form-view{display:grid;grid-template-columns:repeat(auto-fill, minmax(var(--ez-form-view__item--min-width), 1fr));gap:var(--ez-form-view__item--width);padding-inline:var(--ez-form-view__item--padding);width:100%}.input-full_width.sc-ez-form-view{grid-column:1 / -1;width:100%}";
+const ezFormViewCss = ".sc-ez-form-view-h{display:flex;flex-wrap:wrap;width:100%;--ez-form-view__item--min-width:220px;--ez-form-view__item--max-width:440px;--ez-form-view__item--width:var(--space--small);--ez-form-view__item--padding:var(--space--small)}.form-view__content.sc-ez-form-view{display:grid;grid-template-columns:repeat(auto-fill, minmax(var(--ez-form-view__item--min-width), 1fr));gap:var(--ez-form-view__item--width);padding-inline:var(--ez-form-view__item--padding);width:100%}.form-view__content--single-column.sc-ez-form-view{grid-template-columns:repeat(1, minmax(var(--ez-form-view__item--min-width), var(--ez-form-view__item--max-width)))}.input-full_width.sc-ez-form-view{grid-column:1 / -1;width:100%}";
 
 const EzFormView = class {
   constructor(hostRef) {
@@ -156,6 +163,7 @@ const EzFormView = class {
     this._customEditors = new Map();
     this.fields = undefined;
     this.selectedRecord = undefined;
+    this.singleColumn = true;
   }
   async showUp() {
     this._element.scrollIntoView({ behavior: "smooth", block: "start" });
@@ -231,7 +239,7 @@ const EzFormView = class {
     let nonArrayGrup = [];
     let formContent = Array.from(this.groupFields(this.fields).entries()).map(([label, value]) => {
       if (Array.isArray(value)) {
-        return (h("ez-collapsible-box", { id: `group-${label}`, label: label, "header-size": "large", key: label }, h("div", { class: "form-view__content" }, value.map(fi => (this.buildFormItemElement(fi))))));
+        return (h("ez-collapsible-box", { id: `group-${label}`, label: label, "header-size": "large", key: label }, h("div", { class: `form-view__content ${this.singleColumn && "form-view__content--single-column"}` }, value.map(fi => (this.buildFormItemElement(fi))))));
       }
       else {
         nonArrayGrup.push(value);
@@ -239,7 +247,7 @@ const EzFormView = class {
     });
     // Filtra os elementos que não são arrays e os coloca dentro de uma única div
     let nonArrayElements = nonArrayGrup.map((value) => this.buildFormItemElement(value));
-    let groupedNonArrayElements = h("div", { class: "form-view__content" }, nonArrayElements);
+    let groupedNonArrayElements = h("div", { class: `form-view__content ${this.singleColumn && "form-view__content--single-column"}` }, nonArrayElements);
     return (h(Host, null, groupedNonArrayElements, formContent));
   }
   get _element() { return getElement(this); }

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

@@ -1,6 +1,7 @@
 import { r as registerInstance, c as createEvent, h, f as forceUpdate, H as Host, g as getElement } from './index-baa5e267.js';
-import { DateUtils, Action, StringUtils, DataUnit, ElementIDUtils } from '@sankhyalabs/core';
-import { b as buildFieldMetadata, D as DataBinder } from './DataBinder-9c877244.js';
+import { DateUtils, ApplicationContext, Action, StringUtils, DataUnit, ElementIDUtils } from '@sankhyalabs/core';
+import { b as buildFieldMetadata, D as DataBinder } from './DataBinder-89946126.js';
+import { F as FormLayout } from './FormLayout-54092963.js';
 import './ApplicationUtils-eaf91331.js';
 import './DialogType-54a62731.js';
 
@@ -556,12 +557,14 @@ const EzForm = class {
     this.ezReady = createEvent(this, "ezReady", 7);
     this.formItemsReady = createEvent(this, "formItemsReady", 7);
     this._customEditors = new Map();
+    this._application = ApplicationContext.getContextValue("__SNK__APPLICATION__");
     this.onDataUnitAction = (action) => {
       if (action.type === Action.METADATA_LOADED) {
         this.processMetadata();
       }
     };
     this._fieldsProps = new Map();
+    this._singleColumn = true;
     this.dataUnit = undefined;
     this.config = undefined;
     this.recordsValidator = undefined;
@@ -624,7 +627,7 @@ const EzForm = class {
     }
     this.ezFormSetFields.emit(fields);
     const idFormSheet = `${StringUtils.replaceAccentuatedChars(StringUtils.toCamelCase(currentSheet === null || currentSheet === void 0 ? void 0 : currentSheet.label), false)}_selectorContainer`;
-    return (h("div", { class: "dynamic-content", "data-element-id": idFormSheet }, h("ez-form-view", { ref: (element) => (this._formView = element), class: "ez-row ez-padding-vertical--small", fields: fields, selectedRecord: this.dataUnit.getSelectedRecord() })));
+    return (h("div", { class: "dynamic-content", "data-element-id": idFormSheet }, h("ez-form-view", { ref: (element) => (this._formView = element), class: "ez-row ez-padding-vertical--small", fields: fields, singleColumn: this._singleColumn, selectedRecord: this.dataUnit.getSelectedRecord() })));
   }
   processMetadata() {
     if (this.bindFields() && this.dataUnit && this._store) {
@@ -639,7 +642,8 @@ const EzForm = class {
   bindFields() {
     return !this.isStatic() || this.onlyStaticFields === false;
   }
-  componentWillLoad() {
+  async componentWillLoad() {
+    var _a;
     if (this.dataUnit === undefined) {
       this.dataUnit = new DataUnit("ez-form");
     }
@@ -652,6 +656,28 @@ const EzForm = class {
     this.processMetadata();
     const dataInfo = { dataUnit: this.dataUnit };
     ElementIDUtils.addIDInfo(this._element, null, dataInfo);
+    const layoutFormConfig = await ((_a = this._application) === null || _a === void 0 ? void 0 : _a.getLayoutFormConfig());
+    this.setSingleColumn(layoutFormConfig);
+    this.registerNotifyListeners(layoutFormConfig);
+  }
+  async setSingleColumn(layoutFormConfig) {
+    if (!(layoutFormConfig === null || layoutFormConfig === void 0 ? void 0 : layoutFormConfig.config)) {
+      this._singleColumn = true;
+      return;
+    }
+    this._singleColumn = layoutFormConfig.config === FormLayout.CASCADE ? true : false;
+  }
+  async registerNotifyListeners(layoutFormConfig) {
+    if (!layoutFormConfig)
+      return;
+    layoutFormConfig.onConfigChange((config) => {
+      if (config === FormLayout.CASCADE) {
+        this._singleColumn = true;
+      }
+      else {
+        this._singleColumn = false;
+      }
+    });
   }
   componentDidRender() {
     const metadata = selectFormMetadata(this._store.getState());

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

@@ -1,12 +1,13 @@
 import { h, r as registerInstance, c as createEvent, H as Host, g as getElement } from './index-baa5e267.js';
-import { Action, DataUnit, ObjectUtils as ObjectUtils$1, HTMLBuilder, ApplicationContext, StringUtils as StringUtils$1, UserInterface, LockManager, LockManagerOperation, NumberUtils as NumberUtils$1, MaskFormatter, DataType, SortMode, ElementIDUtils, ColumnFilterManager as ColumnFilterManager$1, DateUtils as DateUtils$1, ArrayUtils as ArrayUtils$1, FieldComparator, JSUtils, OverflowWatcher, OVERFLOWED_CLASS_NAME, KeyboardManager } from '@sankhyalabs/core';
+import { Action, DataUnit, ObjectUtils as ObjectUtils$1, UserInterface, HTMLBuilder, ApplicationContext, StringUtils as StringUtils$1, LockManager, LockManagerOperation, NumberUtils as NumberUtils$1, MaskFormatter, DataType, SortMode, ElementIDUtils, ColumnFilterManager as ColumnFilterManager$1, DateUtils as DateUtils$1, ArrayUtils as ArrayUtils$1, FieldComparator, JSUtils, OverflowWatcher, OVERFLOWED_CLASS_NAME, KeyboardManager } from '@sankhyalabs/core';
 import { SelectionMode } from '@sankhyalabs/core/dist/dataunit/DataUnit';
 import { A as ApplicationUtils } from './ApplicationUtils-eaf91331.js';
 import './DialogType-54a62731.js';
 import './CheckMode-bdb2ec19.js';
-import { C as CustomEditorSource, a as CustomRenderSource } from './ICustomRender-875b5a40.js';
-import { D as DISTINCT_FILTER_NAME_PREFIX, E as EZ_GRID_LOADING_SOURCE } from './constants-4e0d35b7.js';
-import { b as buildFieldMetadata, R as RecordValidationProcessor, D as DataBinder } from './DataBinder-9c877244.js';
+import { C as CustomEditorSource, a as CustomRenderSource } from './types-6f6b2650.js';
+import './FormLayout-54092963.js';
+import { D as DISTINCT_FILTER_NAME_PREFIX, E as EZ_GRID_LOADING_SOURCE, P as PRESENTATION_COL_ID_PROP_NAME, a as PRESENTATION_FROM_COL_PROP_NAME } from './constants-b036528f.js';
+import { b as buildFieldMetadata, R as RecordValidationProcessor, D as DataBinder } from './DataBinder-89946126.js';
 import { F as FocusResolver } from './FocusResolver-1ccbf850.js';
 
 /**
@@ -50246,14 +50247,20 @@ class DataSource {
           return indexA - indexB;
         });
         this._dataUnit.metadata.fields.forEach(f => {
-          var _a;
+          var _a, _b;
           if (f.visible !== false && f.name !== this.RECORD_ARCHIVE) {
             const props = new Map();
             const properties = this._dataUnit.getField(f.name).properties;
             for (const value in properties) {
               props.set(value, properties[value]);
             }
-            columnDefs.push({ label: f.label, name: f.name, userInterface: f.userInterface, options: (_a = this._dataUnit.getField(f.name).properties) === null || _a === void 0 ? void 0 : _a.options, props });
+            const col = { label: f.label, name: f.name, userInterface: f.userInterface, options: (_a = this._dataUnit.getField(f.name).properties) === null || _a === void 0 ? void 0 : _a.options, props };
+            columnDefs.push(col);
+            if (f.userInterface === UserInterface.SEARCHPLUS && ((_b = f.properties) === null || _b === void 0 ? void 0 : _b.DESCRIPTIONFIELD)) {
+              const descriptionCol = this.buildDescriptionColumn(f);
+              columnDefs.push(descriptionCol);
+              f.properties[PRESENTATION_COL_ID_PROP_NAME] = descriptionCol.name;
+            }
           }
         });
       }
@@ -50263,6 +50270,17 @@ class DataSource {
       console.warn(error);
     }
   }
+  buildDescriptionColumn(field) {
+    var _a, _b, _c, _d;
+    const props = new Map();
+    props.set(PRESENTATION_FROM_COL_PROP_NAME, field.name);
+    return {
+      label: `${(_a = field.properties) === null || _a === void 0 ? void 0 : _a.DESCRIPTIONFIELDLABEL} (${(_b = field.properties) === null || _b === void 0 ? void 0 : _b.DESCRIPTIONENTITY})`,
+      name: `${(_c = field.properties) === null || _c === void 0 ? void 0 : _c.ENTITYNAME}.${(_d = field.properties) === null || _d === void 0 ? void 0 : _d.DESCRIPTIONFIELD}`,
+      userInterface: UserInterface.SHORTTEXT,
+      props
+    };
+  }
 }
 
 class EzGridCustomHeader {
@@ -50673,6 +50691,21 @@ const buildSwitch = (fieldMetadata) => {
   return combo;
 };
 
+const buildSearchPlus = ({ name, required, readOnly, dataUnit }) => {
+  const ezSearch = HTMLBuilder.parseElement(`<ez-search-plus
+          class="ez-grid grid_editor"
+          mode="slim"
+          suppress-empty-option=${required}
+          enabled=${!readOnly}
+          hide-description-input=${true}
+    />`);
+  const loader = ApplicationContext.getContextValue("__EZUI__SEARCH__PLUS__OPTION__LOADER__");
+  ezSearch.optionLoader = (argument) => loader(argument, name, dataUnit);
+  ezSearch.autoFocus = true;
+  ezSearch.valueGetter = () => ezSearch.getValueAsync();
+  return ezSearch;
+};
+
 const buildSearch = ({ name, required, readOnly, eGridCell, dataUnit }) => {
   var _a;
   const ezSearch = HTMLBuilder.parseElement(`<ez-search
@@ -50705,6 +50738,7 @@ uiBuilders.set(UserInterface.CHECKBOX, buildSwitch);
 uiBuilders.set(UserInterface.OPTIONSELECTOR, buildComboBox);
 uiBuilders.set(UserInterface.LONGTEXT, buildTextAreaInput);
 uiBuilders.set(UserInterface.SEARCH, buildSearch);
+uiBuilders.set(UserInterface.SEARCHPLUS, buildSearchPlus);
 class EzCellEditor {
   init(params) {
     this._rowData = params.data;
@@ -50903,6 +50937,7 @@ class EzGridCustomCellRender extends EzCellRender {
 
 class GridEditionManager {
   constructor(dataUnit, useEnterLikeTab, recordsValidator, editionIsDisabled, customEditors, customRenders, enableContinuousInsert, enableGridInsert, lockerId) {
+    this._inProgressChanges = [];
     this._dataUnit = dataUnit;
     this._recordValidationProcessor = new RecordValidationProcessor(this._dataUnit, {
       getRequiredFields: () => this.getRequiredFields(),
@@ -51002,6 +51037,12 @@ class GridEditionManager {
     return this._enableContinuousInsert && (this._dataUnit.records.length - 1) === ((_a = this._lastCellEdited) === null || _a === void 0 ? void 0 : _a.rowIndex);
   }
   async proceedAutoSave() {
+    var _a;
+    //Aguarda outras promises entrarem na fila
+    await new Promise(resolve => setTimeout(resolve, 100));
+    if (this._inProgressChanges.length) {
+      await Promise.all((_a = this._inProgressChanges) === null || _a === void 0 ? void 0 : _a.map(({ promise }) => promise));
+    }
     if (!this._dataUnit.isDirty()) {
       this.saveSuccess();
       return true;
@@ -51072,7 +51113,9 @@ class GridEditionManager {
   }
   configureColumn(col) {
     col.cellEditor = 'ezCellEditor';
-    col.editable = params => this.canEdit(params);
+    if (col.editable != false) {
+      col.editable = params => this.canEdit(params);
+    }
     col.suppressKeyboardEvent = (params) => {
       if (params.event.key === KeyCode.ESCAPE && params.editing) {
         return this._dataUnit.isDirty();
@@ -51256,6 +51299,14 @@ class GridEditionManager {
       return;
     }
     if (value instanceof Promise) {
+      const progressChange = {
+        promise: undefined,
+        resolve: () => { }
+      };
+      progressChange.promise = new Promise((resolve) => {
+        progressChange.resolve = resolve;
+      });
+      this._inProgressChanges.push(progressChange);
       this.handlePromiseValue(event, value);
       return;
     }
@@ -51269,16 +51320,22 @@ class GridEditionManager {
     const resolved = await value;
     return this.updateCellValue(event, resolved);
   }
-  updateCellValue(event, newValue) {
-    var _a;
+  async updateCellValue(event, newValue) {
+    var _a, _b, _c, _d;
     const fieldName = event.colDef.field;
-    event.node.setData(Object.assign(Object.assign({}, event.data), { [fieldName]: newValue }));
-    (_a = this._currentEditLock) === null || _a === void 0 ? void 0 : _a.call(this);
+    const newData = { [fieldName]: newValue };
+    const descriptionColName = (_b = (_a = this._dataUnit.getField(fieldName)) === null || _a === void 0 ? void 0 : _a.properties) === null || _b === void 0 ? void 0 : _b[PRESENTATION_COL_ID_PROP_NAME];
+    if (!StringUtils$1.isEmpty(descriptionColName)) {
+      newData[descriptionColName] = newValue === null || newValue === void 0 ? void 0 : newValue.label;
+    }
+    event.node.setData(Object.assign(Object.assign({}, event.data), { newData }));
+    (_c = this._currentEditLock) === null || _c === void 0 ? void 0 : _c.call(this);
     if (event.oldValue !== newValue) {
       this._isGridEdition = true;
-      this._dataUnit.setFieldValue(fieldName, newValue, [event.data.__record__id__], { suppressCreateNewRecord: true });
+      await this._dataUnit.setFieldValue(fieldName, newValue, [event.data.__record__id__], { suppressCreateNewRecord: true });
       this._lastCellEdited = { rowIndex: event.rowIndex, column: event.column, rowPinned: undefined };
     }
+    (_d = this._inProgressChanges) === null || _d === void 0 ? void 0 : _d.forEach(({ resolve }) => resolve(newValue));
   }
   setCellEditors(customEditors) {
     var _a;
@@ -64767,7 +64824,6 @@ class AgGridController {
     this.DEFAULT_FONT_SIZE_HTML5 = 32;
     this.DEFAULT_ICON_SIZE = 12;
     this.DEFAULT_MAX_SIZE = 200;
-    this.DOC_WIDTH = 800;
     this._menuItems = [];
     this._idAttribName = '__record__id__';
     this._gridConfig = [];
@@ -64776,6 +64832,7 @@ class AgGridController {
     this._customFormatters = new Map();
     this._gridShowDom = false;
     this.peddingExecutionsOnGridShow = [];
+    this._lastColsConfig = undefined;
     ModuleRegistry.registerModules([
       EnterpriseCoreModule,
       RangeSelectionModule,
@@ -65370,7 +65427,9 @@ class AgGridController {
     }
   }
   isColumnEditable(rowIndex, column) {
-    if (column.getColDef().headerName === '' || rowIndex === -1)
+    if (column.getColDef().headerName === ''
+      || column.getColDef().headerName === this.CHECK_BOX_COL_ID
+      || rowIndex === -1)
       return false;
     const rowId = this._dataUnit.records[rowIndex][this._idAttribName];
     const rowNode = this._gridOptions.api.getRowNode(rowId);
@@ -65388,7 +65447,7 @@ class AgGridController {
     this._gridOptions.api.setFocusedCell(rowIndex, firstCell);
   }
   setColumnsDef(cols) {
-    const checkBoxColumn = Object.assign({ colId: this.CHECK_BOX_COL_ID, headerName: '', checkboxSelection: true, width: 29, suppressMovable: true, suppressAutoSize: true, suppressMenu: true, lockPosition: true, pinned: true }, (this._multipleSelection && { headerComponent: 'ezGridHeaderComponent', headerClass: 'ag-column-select-header' }));
+    const checkBoxColumn = Object.assign({ colId: this.CHECK_BOX_COL_ID, headerName: this.CHECK_BOX_COL_ID, checkboxSelection: true, width: 29, suppressMovable: true, suppressAutoSize: true, suppressMenu: true, lockPosition: true, pinned: true }, (this._multipleSelection && { headerComponent: 'ezGridHeaderComponent', headerClass: 'ag-column-select-header' }));
     const newColDefs = this._options.suppressCheckBoxCol ? [] : [checkBoxColumn];
     if (this._statusResolver != undefined) {
       newColDefs.push({
@@ -65416,8 +65475,39 @@ class AgGridController {
     });
     this._colDefs = newColDefs;
     if (this._gridOptions && this._gridOptions.api) {
+      this.setColsDefsWithStateIfNeeded(this._colDefs);
+    }
+  }
+  setColsDefsWithStateIfNeeded(colDefs) {
+    if (!this._lastColsConfig) {
       this._gridOptions.api.setColumnDefs(this._colDefs);
     }
+    /*
+      Caso a definição de colunas esteja sendo atualizada,
+      e existe uma config aplicada, temos que considerar essa
+      config ao adicionar nova definição de colunas.
+      PS: Poderia apenas chamar o setColumnsState, porém,
+      isso impactaria em performance, e o usuário ia perceber
+      a mudança das colunas visualmente na grade, o que traria
+      uma experiencia ruim.
+    */
+    const colDefsWithConfigs = this.getColsDefWithConfigApplied(colDefs, this._lastColsConfig);
+    this._gridOptions.api.setColumnDefs(colDefsWithConfigs);
+  }
+  getColsDefWithConfigApplied(colDefs, colsConfig) {
+    //Cria map de colunas existentes na config e seu índice
+    const orderMap = colsConfig.reduce((map, col, index) => {
+      map[col.name] = index;
+      return map;
+    }, {});
+    //Remove colunas que não existem na config
+    const filteredColsDefs = colDefs.filter((col) => !orderMap.hasOwnProperty(col.colId));
+    //Ordena colunas baseada na config aplicada
+    const sortedColumnDefs = filteredColsDefs.sort((a, b) => {
+      var _a, _b;
+      return ((_a = orderMap[a.field]) !== null && _a !== void 0 ? _a : Number.MAX_VALUE) - ((_b = orderMap[b.field]) !== null && _b !== void 0 ? _b : Number.MAX_VALUE);
+    });
+    return sortedColumnDefs;
   }
   hideSelectionColumn() {
     var _a, _b;
@@ -65451,6 +65541,7 @@ class AgGridController {
     if (this._grid === undefined) {
       throw new Error('Erro interno: Grid ainda não inicializado.');
     }
+    this._lastColsConfig = state;
     const colDef = this._gridOptions.columnApi.getColumns();
     let columns = this.getColumnsDef();
     let visibleColumns = [];
@@ -65459,14 +65550,39 @@ class AgGridController {
     const columnsOffset = colDef.length - columns.length;
     this._gridConfig = state;
     let sort = [];
-    state.forEach((cfgColumn, index) => {
+    let currentIndex = 0;
+    state.forEach((cfgColumn) => {
+      var _a, _b;
       const colWidth = this.getColumnWidth(cfgColumn);
-      this._gridOptions.columnApi.moveColumn(cfgColumn.name, index + columnsOffset);
+      this._gridOptions.columnApi.moveColumn(cfgColumn.name, currentIndex + columnsOffset);
       this._gridOptions.columnApi.setColumnWidth(cfgColumn.name, colWidth);
       visibleColumns.push(cfgColumn.name);
       if (cfgColumn.ascending !== undefined) {
         sort.push({ colId: cfgColumn.name, sort: cfgColumn.ascending !== true ? 'desc' : 'asc', sortIndex: cfgColumn.orderIndex });
       }
+      currentIndex++;
+      const fieldMD = (_a = this._dataUnit) === null || _a === void 0 ? void 0 : _a.getField(cfgColumn.name);
+      /*
+        Migração para o SEARCHPLUS, caso de uso:
+          - Agora existe uma coluna para o campo de descrição do relaciona
+          - Essa col, não existe na config da grade que já foi salva pelo DS
+          - Nesse caso, precisamos inserir a coluna de descrição automaticamente para que
+            os usuários não percam a apresentação do campo de descrição.
+          PS: Caso esteja herdando do HTML5, devemos manter a config como está la
+      */
+      if (this.needToAddDescriptionColumn(cfgColumn, fieldMD, state)) {
+        const descriptionColID = (_b = fieldMD === null || fieldMD === void 0 ? void 0 : fieldMD.properties) === null || _b === void 0 ? void 0 : _b[PRESENTATION_COL_ID_PROP_NAME];
+        if (!descriptionColID)
+          return;
+        const descriptionCol = this._gridOptions.columnApi.getColumn(descriptionColID);
+        const descriptionColDef = descriptionCol === null || descriptionCol === void 0 ? void 0 : descriptionCol.getColDef();
+        const descriptionHeaderName = descriptionColDef === null || descriptionColDef === void 0 ? void 0 : descriptionColDef.headerName;
+        const descriptionColSize = this.getColumnWidthByLabel(descriptionHeaderName);
+        this._gridOptions.columnApi.moveColumn(descriptionColID, currentIndex + columnsOffset);
+        this._gridOptions.columnApi.setColumnWidth(descriptionColID, descriptionColSize);
+        visibleColumns.push(descriptionColID);
+        currentIndex++;
+      }
     });
     let invisibleColumns = columns.filter(column => !visibleColumns.includes(column.name)).map(column => column.name);
     this._gridOptions.columnApi.setColumnsVisible(visibleColumns, true);
@@ -65476,10 +65592,15 @@ class AgGridController {
       defaultState: { sort: null },
     });
   }
-  getAdaptiveWidth(width) {
-    const widthGrid = this._container.clientWidth;
-    const adaptiveWidth = (this.DOC_WIDTH * width) / widthGrid;
-    return Math.round(adaptiveWidth);
+  needToAddDescriptionColumn(cfgColumn, fieldMD, stateConfig) {
+    var _a, _b;
+    if (!fieldMD) {
+      return false;
+    }
+    const configVersion = ((_a = cfgColumn.configVersion) !== null && _a !== void 0 ? _a : 0);
+    const isSearchPlus = (fieldMD === null || fieldMD === void 0 ? void 0 : fieldMD.userInterface) == UserInterface.SEARCHPLUS;
+    const descriptionColID = (_b = fieldMD === null || fieldMD === void 0 ? void 0 : fieldMD.properties) === null || _b === void 0 ? void 0 : _b[PRESENTATION_COL_ID_PROP_NAME];
+    return isSearchPlus && configVersion < 1 && stateConfig.find(col => col.name === descriptionColID) != undefined;
   }
   getColumnsState() {
     if (this._grid === undefined) {
@@ -65490,7 +65611,7 @@ class AgGridController {
       .map(s => {
       const column = this._gridOptions.columnApi.getColumn(s.colId);
       const def = column.getColDef();
-      const width = this.getAdaptiveWidth(column.getActualWidth());
+      const width = column.getActualWidth();
       const label = def.headerName;
       const name = def.checkboxSelection ? '__SELECTION__' : s.colId;
       const colState = { label, name };
@@ -65540,7 +65661,7 @@ class AgGridController {
     return filterOptions.map(item => item.check).includes(true);
   }
   buildColDef(source) {
-    var _a, _b, _c;
+    var _a, _b, _c, _d;
     let tooltip = undefined;
     const propSortable = StringUtils$1.getBooleanValue((_a = source.props) === null || _a === void 0 ? void 0 : _a.get('gridSortable'), true);
     if ((_b = source.props) === null || _b === void 0 ? void 0 : _b.get('gridHeaderTooltip')) {
@@ -65562,6 +65683,11 @@ class AgGridController {
         showColumnFilter: (leftPosition) => this.showFilterColumn({ columnName: source.name, columnLabel: source.label, leftPosition, filteredOptions: this._filteredColumns.get(source.name), fromIcon: true }),
       },
       valueFormatter: params => {
+        var _a, _b, _c, _d;
+        const presentationFrom = (_a = source === null || source === void 0 ? void 0 : source.props) === null || _a === void 0 ? void 0 : _a.get(PRESENTATION_FROM_COL_PROP_NAME);
+        if (presentationFrom) {
+          return (_d = (_c = (_b = params === null || params === void 0 ? void 0 : params.data) === null || _b === void 0 ? void 0 : _b[presentationFrom]) === null || _c === void 0 ? void 0 : _c.label) !== null && _d !== void 0 ? _d : "";
+        }
         if (params.value === undefined || params.value === null) {
           return "";
         }
@@ -65581,6 +65707,7 @@ class AgGridController {
         return this.getFormatterByColumn(params, source);
       },
       cellStyle: this.getStyleByColumn(source),
+      editable: !((_d = source.props) === null || _d === void 0 ? void 0 : _d.has(PRESENTATION_FROM_COL_PROP_NAME))
     });
   }
   setCustomFormatters(customFormatters) {
@@ -65596,8 +65723,11 @@ class AgGridController {
     };
   }
   getStyleByColumn(source) {
+    var _a;
     let cellStyle = this.getInitCellStyle();
-    switch (source === null || source === void 0 ? void 0 : source.userInterface) {
+    const primitiveUIType = (_a = source === null || source === void 0 ? void 0 : source.props) === null || _a === void 0 ? void 0 : _a.get("PRIMITIVETUIYPE");
+    const uitype = source === null || source === void 0 ? void 0 : source.userInterface;
+    switch (primitiveUIType !== null && primitiveUIType !== void 0 ? primitiveUIType : uitype) {
       case UserInterface.DECIMALNUMBER:
       case UserInterface.INTEGERNUMBER:
         cellStyle['text-align'] = 'right';
@@ -65613,7 +65743,7 @@ class AgGridController {
     return cellStyle;
   }
   getFormatterByColumn(params, source) {
-    var _a;
+    var _a, _b, _c, _d;
     if ((source === null || source === void 0 ? void 0 : source.userInterface) === 'OPTIONSELECTOR' && source.options) {
       const prop = source === null || source === void 0 ? void 0 : source.options;
       let options;
@@ -65650,6 +65780,9 @@ class AgGridController {
         return params === null || params === void 0 ? void 0 : params.value;
       }
     }
+    if ((source === null || source === void 0 ? void 0 : source.userInterface) === UserInterface.SEARCHPLUS) {
+      return (_d = (_c = (_b = params === null || params === void 0 ? void 0 : params.value) === null || _b === void 0 ? void 0 : _b.value) !== null && _c !== void 0 ? _c : params === null || params === void 0 ? void 0 : params.value) !== null && _d !== void 0 ? _d : "";
+    }
     if ((source === null || source === void 0 ? void 0 : source.userInterface) === UserInterface.DECIMALNUMBER) {
       if (params.value != undefined) {
         const precision = Number(source.props.get('precision')) || 2;
@@ -65823,7 +65956,7 @@ class AgGridController {
     this._gridOptions.api.stopEditing();
   }
   getColumnWidth(cfgColumn) {
-    var _a, _b;
+    var _a, _b, _c, _d, _e, _f;
     if (cfgColumn == undefined) {
       return;
     }
@@ -65835,10 +65968,14 @@ class AgGridController {
       return parseInt(cfgColumn.width) + this.DEFAULT_FONT_SIZE_HTML5;
     }
     const field = (_a = this._dataUnit) === null || _a === void 0 ? void 0 : _a.getField(cfgColumn.name);
+    const label = (_b = field === null || field === void 0 ? void 0 : field.label) !== null && _b !== void 0 ? _b : (_f = (_e = (_d = (_c = this._gridOptions) === null || _c === void 0 ? void 0 : _c.columnApi) === null || _d === void 0 ? void 0 : _d.getColumn(cfgColumn.name)) === null || _e === void 0 ? void 0 : _e.getColDef()) === null || _f === void 0 ? void 0 : _f.headerName;
     if ((field === null || field === void 0 ? void 0 : field.userInterface) === UserInterface.SEARCH) {
       return this.DEFAULT_MAX_SIZE;
     }
-    const labelSize = (((_b = field === null || field === void 0 ? void 0 : field.label) === null || _b === void 0 ? void 0 : _b.length) || 0) * this.DEFAULT_FONT_SIZE + this.DEFAULT_ICON_SIZE;
+    return this.getColumnWidthByLabel(label);
+  }
+  getColumnWidthByLabel(label) {
+    const labelSize = ((label === null || label === void 0 ? void 0 : label.length) || 0) * this.DEFAULT_FONT_SIZE + this.DEFAULT_ICON_SIZE;
     return labelSize > this.DEFAULT_MAX_SIZE ? this.DEFAULT_MAX_SIZE : labelSize;
   }
 }