@sankhyalabs/sankhyablocks 9.1.0-dev.1 → 9.1.0-dev.11

package/dist/esm/snk-actions-button_8.entry.js

@@ -1,20 +1,19 @@
 import { r as registerInstance, h, H as Host, g as getElement, c as createEvent } from './index-479e1293.js';
 import { ApplicationContext, StringUtils, ErrorException, WarningException, ObjectUtils, DateUtils, ServiceUtils, StorageType, ArrayUtils, ElementIDUtils } from '@sankhyalabs/core';
-import { D as DataFetcher } from './DataFetcher-88e56266.js';
+import { D as DataFetcher } from './DataFetcher-db08cad0.js';
 import { P as ParamType } from './ParamType-d5152b06.js';
-import './ISave-5efafc97.js';
+import './ISave-da565824.js';
 import './index-b40568ff.js';
 import '@sankhyalabs/ezui/dist/collection/utils/constants';
 import '@sankhyalabs/core/dist/dataunit/metadata/UnitMetadata';
-import './dataunit-fetcher-0e025732.js';
+import './dataunit-fetcher-1b78797a.js';
 import './filter-item-type.enum-d45e026f.js';
-import { F as FormConfigFetcher } from './form-config-fetcher-fa208a6c.js';
+import { F as FormConfigFetcher } from './form-config-fetcher-e623539b.js';
 import { O as ORDER_VALUES } from './constants-7b422de0.js';
 import { g as getSelectedRecordsIDsInfo } from './GetSelectedRecordsIDsInfo-9fa41508.js';
 import { R as ResourceIDUtils } from './ResourceIDUtils-a114189a.js';
 import { ApplicationUtils, DialogType, FormLayout } from '@sankhyalabs/ezui/dist/collection/utils';
-import { CheckMode } from '@sankhyalabs/ezui/dist/collection/components/ez-check/CheckMode';
-import { C as ConfigStorage } from './ConfigStorage-79b9e180.js';
+import { C as ConfigStorage } from './ConfigStorage-89154c4e.js';
 import './PrintUtils-3e4ff0f5.js';
 import '@sankhyalabs/ezui/dist/collection/components/ez-grid/utils';
 import '@sankhyalabs/core/dist/utils/SortingUtils';
@@ -722,7 +721,7 @@ SnkActionsButton.parameters = {
 };
 SnkActionsButton.style = snkActionsButtonCss;
 
-const snkGridConfigCss = ".sc-snk-grid-config-h{--snk-grid-config__footer--padding-top:var(--space--medium, 12px);--snk-grid-config__main--padding-right:var(--space--medium, 12px);--snk-grid-config__tabselector-container--padding:var(--space--medium, 12px);--snk-grid-config__button-close--padding-left:var(--space--medium, 12px);--snk-grid-config__title--color:var(--title--primary, #2B3A54);--snk-grid-config__title--font-family:var(--font-pattern, \"Roboto\");--snk-grid-config__title--font-size:var(--title--large, 20px);--snk-grid-config__title--font-weight:var(--text-weight--extra-large, 700);--snk-grid-config__subtitle--font-family:var(--font-pattern, \"Roboto\");--snk-grid-config__subtitle--font-size:var(--text--medium, 14px);--snk-grid-config__group--font-family:var(--font-pattern, \"Roboto\");--snk-grid-config__group--font-size:var(--text--medium, 14px);--snk-grid-config__group--font-weight:var(--text-weight--large, 600);--snk-grid-config__group--padding-bottom:var(--space-small, 6px);--snk-grid-config__scrollbar--color-default:var(--scrollbar--default, #626e82);--snk-grid-config__scrollbar--color-background:var(--scrollbar--background, #E5EAF0);--snk-grid-config__scrollbar--color-hover:var(--scrollbar--hover, #2B3A54);--snk-grid-config__scrollbar--color-clicked:var(--scrollbar--clicked, #a2abb9);--snk-grid-config__scrollbar--border-radius:var(--border--radius-small, 6px);--snk-grid-config__scrollbar--width:var(--space--small, 6px);display:grid;grid-template-rows:auto 1fr auto;max-height:100%;width:100%}@media screen and (min-width: 480px){.sc-snk-grid-config-h{width:359px;max-width:359px}}.padding-right--medium.sc-snk-grid-config{padding-right:var(--space--medium)}ez-list.sc-snk-grid-config{height:100%}.height-calc.sc-snk-grid-config{max-height:calc(100% - 24px)}.grid-config__footer.sc-snk-grid-config{display:flex;justify-content:flex-end;width:100%;padding-top:var(--snk-grid-config__footer--padding-top)}.hidden.sc-snk-grid-config{display:none}.tabselector-container.sc-snk-grid-config{padding:var(--snk-grid-config__tabselector-container--padding) 0}.button-close.sc-snk-grid-config{padding-left:var(--snk-grid-config__button-close--padding-left)}.title-container.sc-snk-grid-config{display:flex;justify-content:space-between;align-items:center;width:100%}.title.sc-snk-grid-config{display:flex;margin:0;line-height:normal;letter-spacing:0em;text-align:left;color:var(--snk-grid-config__title--color);font-size:var(--snk-grid-config__title--font-size);font-family:var(--snk-grid-config__title--font-family);font-weight:var(--snk-grid-config__title--font-weight)}.subtitle.sc-snk-grid-config{color:var(--text--primary);font-size:var(--snk-grid-config__subtitle--font-size);font-family:var(--snk-grid-config__subtitle--font-family)}.grid-config__main.sc-snk-grid-config{overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--snk-grid-config__scrollbar--color-clicked) var(--snk-grid-config__scrollbar--color-background);padding-right:var(--snk-grid-config__main--padding-right)}.grid-config__main.sc-snk-grid-config::-webkit-scrollbar{width:var(--snk-grid-config__scrollbar--width);max-width:var(--snk-grid-config__scrollbar--width);min-width:var(--snk-grid-config__scrollbar--width);background-color:var(--snk-grid-config__scrollbar--color-background)}.grid-config__main.sc-snk-grid-config::-webkit-scrollbar-track{background-color:var(--snk-grid-config__scrollbar--color-background);border-radius:var(--snk-grid-config__scrollbar--border-radius)}.grid-config__main.sc-snk-grid-config::-webkit-scrollbar-thumb{background-color:var(--snk-grid-config__scrollbar--color-default);border-radius:var(--snk-grid-config__scrollbar--border-radius)}.grid-config__main.sc-snk-grid-config::-webkit-scrollbar-thumb:vertical:hover,.grid-config__main.sc-snk-grid-config::-webkit-scrollbar-thumb:horizontal:hover{background-color:var(--snk-grid-config__scrollbar--color-hover)}.grid-config__main.sc-snk-grid-config::-webkit-scrollbar-thumb:vertical:active,.grid-config__main.sc-snk-grid-config::-webkit-scrollbar-thumb:horizontal:active{background-color:var(--snk-grid-config__scrollbar--color-clicked)}.group-name.sc-snk-grid-config{font-family:var(--snk-grid-config__group--font-family);font-size:var(--snk-grid-config__group--font-size);font-weight:var(--snk-grid-config__group--font-weight);padding-bottom:var(--snk-grid-config__group--padding-bottom)}";
+const snkGridConfigCss = ".sc-snk-grid-config-h{--snk-grid-config__footer--padding-top:var(--space--medium, 12px);--snk-grid-config__main--padding-right:var(--space--medium, 12px);--snk-grid-config__tabselector-container--padding:var(--space--medium, 12px);--snk-grid-config__button-close--padding-left:var(--space--medium, 12px);--snk-grid-config__title--color:var(--title--primary, #2B3A54);--snk-grid-config__title--font-family:var(--font-pattern, \"Roboto\");--snk-grid-config__title--font-size:var(--title--large, 20px);--snk-grid-config__title--font-weight:var(--text-weight--extra-large, 700);--snk-grid-config__subtitle--font-family:var(--font-pattern, \"Roboto\");--snk-grid-config__subtitle--font-size:var(--text--medium, 14px);--snk-grid-config__group--font-family:var(--font-pattern, \"Roboto\");--snk-grid-config__group--font-size:var(--text--medium, 14px);--snk-grid-config__group--font-weight:var(--text-weight--large, 600);--snk-grid-config__group--padding-bottom:var(--space-small, 6px);--snk-grid-config__scrollbar--color-default:var(--scrollbar--default, #626e82);--snk-grid-config__scrollbar--color-background:var(--scrollbar--background, #E5EAF0);--snk-grid-config__scrollbar--color-hover:var(--scrollbar--hover, #2B3A54);--snk-grid-config__scrollbar--color-clicked:var(--scrollbar--clicked, #a2abb9);--snk-grid-config__scrollbar--border-radius:var(--border--radius-small, 6px);--snk-grid-config__scrollbar--width:var(--space--small, 6px);display:flex;flex-direction:column;max-height:100%;width:100%}.grid-config__body.sc-snk-grid-config{overflow:auto}.padding-right--medium.sc-snk-grid-config{padding-right:var(--space--medium)}ez-list.sc-snk-grid-config{height:100%}.height-calc.sc-snk-grid-config{max-height:calc(100% - 24px)}.grid-config__footer.sc-snk-grid-config{display:flex;justify-content:flex-end;width:100%;padding-top:var(--snk-grid-config__footer--padding-top)}.hidden.sc-snk-grid-config{display:none}.tabselector-container.sc-snk-grid-config{padding:var(--snk-grid-config__tabselector-container--padding) 0}.button-close.sc-snk-grid-config{padding-left:var(--snk-grid-config__button-close--padding-left)}.title-container.sc-snk-grid-config{display:flex;justify-content:space-between;align-items:center;width:100%}.title.sc-snk-grid-config{display:flex;margin:0;line-height:normal;letter-spacing:0em;text-align:left;color:var(--snk-grid-config__title--color);font-size:var(--snk-grid-config__title--font-size);font-family:var(--snk-grid-config__title--font-family);font-weight:var(--snk-grid-config__title--font-weight)}.subtitle.sc-snk-grid-config{color:var(--text--primary);font-size:var(--snk-grid-config__subtitle--font-size);font-family:var(--snk-grid-config__subtitle--font-family)}.grid-config__main.sc-snk-grid-config{overflow-y:auto;scrollbar-width:thin;width:100%;padding-bottom:20px;scrollbar-color:var(--snk-grid-config__scrollbar--color-clicked) var(--snk-grid-config__scrollbar--color-background)}.group-name.sc-snk-grid-config{font-family:var(--snk-grid-config__group--font-family);font-size:var(--snk-grid-config__group--font-size);font-weight:var(--snk-grid-config__group--font-weight);padding-bottom:var(--snk-grid-config__group--padding-bottom)}";
 
 const SnkGridConfig = class {
   constructor(hostRef) {
@@ -731,8 +730,9 @@ const SnkGridConfig = class {
     this.configCancel = createEvent(this, "configCancel", 7);
     this._orderListItems = [];
     this._orderPriorityList = [];
+    this._visibleList = [];
+    this._hiddenList = [];
     this._columListItems = [];
-    this._selectedIndex = -1;
     this._dataChanged = false;
     this._componenteInternalKey = Date.now();
     this.selectedIndex = 0;
@@ -740,6 +740,8 @@ const SnkGridConfig = class {
     this.config = undefined;
     this.configName = undefined;
     this.resourceID = undefined;
+    this._collapsibleBoxListOrder = true;
+    this._collapsibleBoxListSelect = false;
   }
   /* Creation Methods */
   /**
@@ -749,15 +751,15 @@ const SnkGridConfig = class {
    * Para conhecer os detalhes do módulo, vide o arquivo neste projeto "/src/lib/message/resources/snk-grid.msg.ts"
    */
   getMessage(key, params) {
-    const application = ApplicationContext.getContextValue("__SNK__APPLICATION__");
+    const application = ApplicationContext.getContextValue('__SNK__APPLICATION__');
     return application.messagesBuilder.getMessage(key, params);
   }
   getSortableColumns() {
     let newList = [];
-    this.columns.filter(col => { var _a; return StringUtils.getBooleanValue((_a = col === null || col === void 0 ? void 0 : col.props) === null || _a === void 0 ? void 0 : _a.get("sortable"), true); }).forEach((column) => {
-      var _a;
+    this.columns.filter(col => { var _a; return StringUtils.getBooleanValue((_a = col === null || col === void 0 ? void 0 : col.props) === null || _a === void 0 ? void 0 : _a.get('sortable'), true); }).forEach((column) => {
+      var _a, _b;
       let configItem = (_a = this.config) === null || _a === void 0 ? void 0 : _a.columns.find((item) => item.name === column.name);
-      let item = { name: column.name, label: column.label };
+      let item = { label: column.label, sort: (_b = column === null || column === void 0 ? void 0 : column.sort) !== null && _b !== void 0 ? _b : ORDER_VALUES.asc.value, id: column.name };
       if (configItem) {
         item['orderIndex'] = configItem.orderIndex;
         item['ascending'] = configItem.ascending;
@@ -797,16 +799,22 @@ const SnkGridConfig = class {
   }
   createColumnList() {
     let visibleGroup = {
-      group: this.getMessage("snkGridConfig.group.visible"),
+      group: this.getMessage('snkGridConfig.group.visible'),
       items: [],
     };
     let hiddenGroup = {
-      group: this.getMessage("snkGridConfig.group.hidden"),
+      group: this.getMessage('snkGridConfig.group.hidden'),
       items: [],
-      sort: ORDER_VALUES.asc.value
+      sort: ORDER_VALUES.asc.value,
     };
     this.columns.forEach((column) => {
-      let item = { label: column.label };
+      var _a;
+      let item = {
+        label: column.label,
+        selected: false,
+        sort: (_a = column === null || column === void 0 ? void 0 : column.sort) !== null && _a !== void 0 ? _a : ORDER_VALUES.asc.value,
+        id: column.name,
+      };
       if (column.hidden) {
         hiddenGroup.items.push(item);
       }
@@ -815,13 +823,9 @@ const SnkGridConfig = class {
       }
     });
     this._columListItems = [visibleGroup, hiddenGroup];
-  }
-  createColumnListSlotDataElementId(item) {
-    return `configItem_${StringUtils.replaceAccentuatedChars(StringUtils.toCamelCase(item.label))}`;
-  }
-  buildColumnListSlot(item, group) {
-    const dataElementId = this.createColumnListSlotDataElementId(item);
-    return (h("div", null, h("ez-check", { mode: CheckMode.SWITCH, id: CheckMode.SWITCH + ((item === null || item === void 0 ? void 0 : item.label) || '') + ((group === null || group === void 0 ? void 0 : group.group) || ''), value: group.group === this.getMessage("snkGridConfig.group.visible"), "data-element-id": dataElementId, onEzChange: (evt) => { this.switchColumnGroup(evt, item); } })));
+    this._visibleList = visibleGroup.items;
+    this._hiddenList = hiddenGroup.items;
+    this.createOrderList();
   }
   createOrderListSlotDataElementId(item) {
     return `${this._element.getAttribute(ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME)}_configItem_${StringUtils.toCamelCase(item.label)}`;
@@ -832,7 +836,10 @@ const SnkGridConfig = class {
     if ((item === null || item === void 0 ? void 0 : item.ascending) != undefined) {
       selectedOption = item.ascending == true ? ORDER_VALUES.asc.value : ORDER_VALUES.desc.value;
     }
-    return (h("div", null, h("snk-select-box", { selectedOption: selectedOption, key: 'snk-select-box-' + this._componenteInternalKey + '-' + item, "data-element-id": dataElementId, onEzChange: (evt) => { evt.stopPropagation(); this.updateOrder(evt.detail, item.label); } })));
+    return (h("snk-select-box", { selectedOption: selectedOption, key: 'snk-select-box-' + this._componenteInternalKey + '-' + item, "data-element-id": dataElementId, onEzChange: (evt) => {
+        evt.stopPropagation();
+        this.updateOrder(evt.detail, item.label);
+      }, preventAutoFocus: true }));
   }
   updateOrder(sortOrder, updatedItemLabel) {
     var _a;
@@ -862,34 +869,6 @@ const SnkGridConfig = class {
     }
     this.columns = newList;
   }
-  /* Actions Methods */
-  switchColumnGroup(evt, switchedItem) {
-    evt.stopPropagation();
-    let newList = [...this._columListItems];
-    this._dataChanged = true;
-    if (evt.detail === true) {
-      let hiddenGroup = newList.find((group) => group.group === this.getMessage("snkGridConfig.group.hidden"));
-      let index = hiddenGroup.items.findIndex((item) => item.label === switchedItem.label);
-      if (index >= 0) {
-        hiddenGroup.items.splice(index, 1);
-      }
-      let visibleGroup = newList.find((group) => group.group === this.getMessage("snkGridConfig.group.visible"));
-      visibleGroup.items.push(switchedItem);
-      this._columListItems = newList;
-      this.createOrderList();
-    }
-    else if (evt.detail === false) {
-      let visibleGroup = newList.find((group) => group.group === this.getMessage("snkGridConfig.group.visible"));
-      let index = visibleGroup.items.findIndex((item) => item.label === switchedItem.label);
-      if (index >= 0) {
-        visibleGroup.items.splice(index, 1);
-      }
-      let hiddenGroup = newList.find((group) => group.group === this.getMessage("snkGridConfig.group.hidden"));
-      hiddenGroup.items.push(switchedItem);
-      this._columListItems = newList;
-      this.createOrderList();
-    }
-  }
   finish() {
     if (!this._dataChanged) {
       this.closeConfig();
@@ -900,7 +879,7 @@ const SnkGridConfig = class {
       group.items.forEach((item) => {
         const baseColumn = this.columns.find((column) => column.label === item.label);
         let newColumnItem = Object.assign({}, baseColumn);
-        if (group.group === this.getMessage("snkGridConfig.group.hidden")) {
+        if (group.group === this.getMessage('snkGridConfig.group.hidden')) {
           newColumnItem.hidden = true;
         }
         else {
@@ -918,8 +897,7 @@ const SnkGridConfig = class {
     ConfigStorage.saveGridConfig(_newConfig, this.configName, this.resourceID)
       .then((savedConfig) => {
       this.configChange.emit(savedConfig);
-      this._orderList.clearHistory();
-      ApplicationUtils.info(this.getMessage("snkGridConfig.info.successfullyConfigSaved"), { iconName: "check" });
+      ApplicationUtils.info(this.getMessage('snkGridConfig.info.successfullyConfigSaved'), { iconName: 'check' });
     });
   }
   reOrderPriorityColumns(columns, orderPriorityList) {
@@ -1018,132 +996,19 @@ const SnkGridConfig = class {
     });
     return newConfig;
   }
-  async locateColumn(evt, searchingText) {
-    var _a;
-    const hitEnter = evt.key === "Enter";
-    searchingText = searchingText || ((_a = evt.currentTarget) === null || _a === void 0 ? void 0 : _a.value);
-    if (!searchingText) {
-      this.removeSelection();
-      return;
-    }
-    const matchedIndexes = await this.getMatchedIndexes(searchingText);
-    const newSelected = this.getNewSelectedIndex(matchedIndexes, hitEnter);
-    this._selectedIndex = newSelected;
-    if (this.selectedIndex === 1) {
-      this.updateOrderListSelection(newSelected);
-    }
-    else {
-      this.updateColumnListSelection(newSelected);
-    }
-  }
-  async getMatchedIndexes(searchingText) {
-    const matchedIndexes = [];
-    if (this.selectedIndex === 1) {
-      const orderListDatasource = await this._orderList.getList();
-      orderListDatasource.forEach((column, index) => {
-        if (this.compareWords(column, searchingText)) {
-          matchedIndexes.push(index);
-        }
-      });
-    }
-    else {
-      this.columns.forEach((column, index) => {
-        if (this.compareWords(column, searchingText)) {
-          matchedIndexes.push(index);
-        }
-      });
-    }
-    return matchedIndexes;
-  }
-  getNewSelectedIndex(matchedIndexes, hitEnter) {
-    if (matchedIndexes.length === 0)
-      return -1;
-    if (hitEnter) {
-      for (const index of matchedIndexes) {
-        if (index > this._selectedIndex) {
-          return index;
-        }
-      }
-    }
-    return matchedIndexes[0];
-  }
-  updateOrderListSelection(newSelected) {
-    if (newSelected === -1) {
-      this._orderList.removeSelection();
-      return;
-    }
-    this._orderList.getList().then((orderListDatasource) => {
-      const selectedColumn = orderListDatasource[newSelected];
-      if (selectedColumn) {
-        this._orderList.setSelection(selectedColumn, true);
-      }
-      else {
-        this._orderList.removeSelection();
-      }
-    });
-  }
-  updateColumnListSelection(newSelected) {
-    if (newSelected === -1) {
-      this._columnList.removeSelection();
-      return;
-    }
-    const selectedColumn = this.columns[newSelected];
-    if (selectedColumn) {
-      const listItem = this._columListItems
-        .map(group => group.items)
-        .flat()
-        .find(item => item.label === selectedColumn.label);
-      if (listItem) {
-        this._columnList.setSelection(listItem, true);
-      }
-      else {
-        this._columnList.removeSelection();
-      }
-    }
-    else {
-      this._columnList.removeSelection();
-    }
-  }
-  removeSelection() {
-    if (this.selectedIndex === 1) {
-      this._orderList.removeSelection();
-    }
-    else {
-      this._columnList.removeSelection();
-    }
-  }
-  compareWords(column, searchingText) {
-    var _a, _b;
-    const columnLabel = (_a = StringUtils.replaceAccentuatedChars(column === null || column === void 0 ? void 0 : column.label)) === null || _a === void 0 ? void 0 : _a.toUpperCase();
-    const argument = (_b = StringUtils.replaceAccentuatedChars(searchingText)) === null || _b === void 0 ? void 0 : _b.toUpperCase();
-    if (StringUtils.isEmpty(columnLabel) || StringUtils.isEmpty(argument)) {
-      return false;
-    }
-    return columnLabel.includes(argument);
-  }
-  getColumnNames() {
-    const listNames = [];
-    listNames.push(this.getMessage("snkGridConfig.tab.columns"));
-    listNames.push(this.getMessage("snkGridConfig.tab.lineOrdering"));
-    return listNames.join(',');
-  }
   closeConfig() {
-    this._orderList.scrollToTop();
-    this._columnList.scrollToTop();
-    this._searchElement.value = "";
     if (this._dataChanged) {
       let options = {
         canClose: false,
-        labelCancel: this.getMessage("snkGridConfig.confirm.cancel"),
-        labelConfirm: this.getMessage("snkGridConfig.confirm.save"),
-        btnConfirmDanger: false
+        labelCancel: this.getMessage('snkGridConfig.confirm.cancel'),
+        labelConfirm: this.getMessage('snkGridConfig.confirm.save'),
+        btnConfirmDanger: false,
       };
-      ApplicationUtils.confirm(this.getMessage("snkGridConfig.confirm.alert"), this.getMessage("snkGridConfig.confirm.msgCancel"), null, DialogType.WARN, options)
+      ApplicationUtils.confirm(this.getMessage('snkGridConfig.confirm.alert'), this.getMessage('snkGridConfig.confirm.msgCancel'), null, DialogType.WARN, options)
         .then((response) => {
         if (!response) {
           this._dataChanged = false;
           this.configCancel.emit();
-          this._orderList.clearHistory();
           this._componenteInternalKey = Date.now();
         }
         else {
@@ -1153,31 +1018,12 @@ const SnkGridConfig = class {
     }
     else {
       this.configCancel.emit();
-      this._orderList.clearHistory();
-    }
-  }
-  /* Handlers */
-  handleTabChange(tab) {
-    if ((tab === null || tab === void 0 ? void 0 : tab.index) != undefined) {
-      if (this.selectedIndex !== tab.index) {
-        if (tab.index === 0) {
-          this._orderList.scrollToTop();
-        }
-        else if (tab.index === 1) {
-          this._columnList.scrollToTop();
-        }
-        this._searchElement.value = "";
-      }
-      if (tab.index === 1) {
-        this.createOrderList();
-      }
-      this.selectedIndex = tab.index;
     }
   }
   handleColumnListChange(evt) {
     var _a;
     if (evt.detail) {
-      let visibleItems = (_a = evt.detail.find((group) => group.group === this.getMessage("snkGridConfig.group.visible"))) === null || _a === void 0 ? void 0 : _a.items;
+      let visibleItems = (_a = evt.detail.find((group) => group.group === this.getMessage('snkGridConfig.group.visible'))) === null || _a === void 0 ? void 0 : _a.items;
       if (visibleItems) {
         this._dataChanged = true;
         this._orderListItems = visibleItems;
@@ -1199,17 +1045,30 @@ const SnkGridConfig = class {
       this.createColumnList();
     }
   }
-  componentDidRender() {
-    var _a;
-    if (((_a = this.columns) === null || _a === void 0 ? void 0 : _a.length) > 0) {
-      this.locateColumn(new KeyboardEvent("arrow-right", { key: "ArrowRight" }), this._searchElement.value);
-    }
-  }
   componentDidLoad() {
     ElementIDUtils.addIDInfo(this._element);
   }
+  handleRightListChange(rightList) {
+    const visibleGroup = this._columListItems.find(group => group.group === this.getMessage('snkGridConfig.group.visible'));
+    if (visibleGroup && visibleGroup.items != rightList) {
+      visibleGroup.items = rightList;
+      this._dataChanged = true;
+    }
+  }
+  getListSlots() {
+    return {
+      RIGHT_LIST: {
+        itemRightSlotBuilder: (item) => this.buildOrderListSlot(item),
+      },
+    };
+  }
   render() {
-    return (h(Host, null, h("div", { class: "grid-config__header" }, h("div", { class: "title-container" }, h("div", { class: "" }, h("label", { class: "title" }, this.getMessage("snkGridConfig.gridConfiguration")), h("label", { class: "subtitle" }, this.getMessage("snkGridConfig.columnVisibilityOrder"))), h("div", { class: "button-close" }, h("ez-button", { mode: 'icon', iconName: "close", size: 'medium', onClick: () => this.closeConfig() }))), h("div", { class: "tabselector-container" }, h("ez-tabselector", { selectedIndex: this.selectedIndex, onEzChange: (evt) => { this.handleTabChange(evt.detail); }, tabs: this.getColumnNames() })), h("div", null, h("ez-text-input", { "data-element-id": "searchColums", ref: (el) => this._searchElement = el, label: this.getMessage("snkGridConfig.findColumn"), onKeyUp: (evt) => this.locateColumn(evt) }, h("ez-icon", { slot: "leftIcon", size: "medium", iconName: "search" })))), h("div", { class: "grid-config__main" }, h("ez-list", { ref: (el) => this._columnList = el, class: this.selectedIndex === 0 ? "" : "hidden", dataSource: this._columListItems, onEzChange: (evt) => this.handleColumnListChange(evt), ezDraggable: true, ezSelectable: true, itemSlotBuilder: (item, group) => this.buildColumnListSlot(item, group), useGroups: true, "data-element-id": "configCols" }), h("div", { class: this.selectedIndex === 1 ? "group-name" : "hidden" }, this.getMessage("snkGridConfig.info.sortingSequence")), h("ez-list", { ref: (el) => this._orderList = el, class: this.selectedIndex === 1 ? "height-calc" : "hidden", dataSource: this._orderListItems, ezSelectable: true, onEzChange: (evt) => this.handleOrderListChange(evt), ezDraggable: true, itemSlotBuilder: (item) => this.buildOrderListSlot(item), "data-element-id": "configDataOrder" })), h("div", { class: "grid-config__footer" }, h("ez-button", { class: "padding-right--medium", label: this.getMessage("snkGridConfig.cancel"), onClick: () => this.closeConfig() }), h("ez-button", { label: this.getMessage("snkGridConfig.complete"), class: "ez-button--primary", onClick: () => this.finish() }))));
+    return (h(Host, null, h("div", { class: "grid-config__header" }, h("div", { class: "title-container" }, h("div", { class: "ez-margin-bottom--medium" }, h("label", { class: "title" }, this.getMessage('snkGridConfig.gridConfiguration')), h("label", { class: "subtitle" }, this.getMessage('snkGridConfig.columnVisibilityOrder'))), h("div", { class: "button-close" }, h("ez-button", { mode: "icon", iconName: "close", size: "medium", class: "ez-button--tertiary", onClick: () => this.closeConfig() })))), h("div", { class: "grid-config__body" }, h("ez-collapsible-box", { id: 'group-select-columns', label: this.getMessage('snkGridConfig.columnsSelection'), "header-size": "medium", key: 'key_group-select-columns', value: this._collapsibleBoxListSelect, onEzChange: ({ detail }) => this._collapsibleBoxListOrder = !detail }, h("div", { class: "grid-config__main" }, h("ez-double-list", { leftList: this._hiddenList, leftTitle: this.getMessage('snkGridConfig.availableColumns'), rightList: this._visibleList, rightTitle: this.getMessage('snkGridConfig.selectedColumns'), onEzRightListChanged: ({ detail }) => this.handleRightListChange(detail), emptyMessage: {
+        LEFT_LIST: this.getMessage('snkGridConfig.emptyMensage.left'),
+        RIGHT_LIST: this.getMessage('snkGridConfig.emptyMensage.right'),
+      }, entityLabel: 'coluna', entityLabelPlural: 'colunas' }))), h("ez-collapsible-box", { id: 'ID_group-order-columns', label: this.getMessage('snkGridConfig.dataOrdering'), "header-size": "medium", key: 'KEY_group-order-columns', value: this._collapsibleBoxListOrder, onEzChange: ({ detail }) => this._collapsibleBoxListSelect = !detail }, h("div", { class: "grid-config__main" }, h("ez-double-list", { rightList: this._orderListItems, rightTitle: this.getMessage('snkGridConfig.selectedColumns'), useOnlyRightList: true, slotsListBuilder: this.getListSlots(), emptyMessage: {
+        RIGHT_LIST: this.getMessage('snkGridConfig.emptyMensage.right'),
+      }, entityLabel: 'coluna', entityLabelPlural: 'colunas' })))), h("div", { class: "grid-config__footer" }, h("ez-button", { class: "padding-right--medium", label: this.getMessage('snkGridConfig.cancel'), onClick: () => this.closeConfig() }), h("ez-button", { label: this.getMessage('snkGridConfig.complete'), class: "ez-button--primary", onClick: () => this.finish() }))));
   }
   static get assetsDirs() { return ["../assets"]; }
   get _element() { return getElement(this); }
@@ -1254,16 +1113,17 @@ const SnkLayoutFormConfig = class {
 };
 SnkLayoutFormConfig.style = snkLayoutFormConfigCss;
 
-const snkSelectBoxCss = "ez-combo-box{width:100px}.grid-config-combo{--ez-text-input--height:28px;--ez-text-input__input--background-color:#fff;--ez-text-input__input--border-color:#dce0e8}";
+const snkSelectBoxCss = "ez-combo-box{width:100px;--ez-text-input__margin-bottom:0px}.grid-config-combo{--ez-text-input--height:28px;--ez-text-input__input--background-color:#fff;--ez-text-input__input--border-color:#dce0e8}";
 
 const SelectBox = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
     this.ezChange = createEvent(this, "ezChange", 7);
     this.selectedOption = ORDER_VALUES.none;
+    this.preventAutoFocus = false;
   }
   render() {
-    return (h("ez-combo-box", { class: "grid-config-combo ez-input--inverted", label: "", suppressSearch: true, value: this.selectedOption, enabled: true, canShowError: false, suppressEmptyOption: true }, Object.keys(ORDER_VALUES).map((key) => {
+    return (h("ez-combo-box", { class: "grid-config-combo ez-input--inverted", label: "", suppressSearch: true, value: this.selectedOption, enabled: true, canShowError: false, suppressEmptyOption: true, preventAutoFocus: this.preventAutoFocus }, Object.keys(ORDER_VALUES).map((key) => {
       return h("option", { value: ORDER_VALUES[key].value }, ORDER_VALUES[key].label);
     })));
   }
@@ -1271,7 +1131,7 @@ const SelectBox = class {
 };
 SelectBox.style = snkSelectBoxCss;
 
-const snkSimpleFormConfigCss = ":host{display:block}.config-container{display:flex;flex-direction:column;align-items:center;justify-content:space-between}.config-lists{margin-bottom:12px}.config-actions{display:flex;flex-direction:row;justify-content:flex-end;width:100%;gap:12px}";
+const snkSimpleFormConfigCss = ":host{display:block}.config-container{display:flex;flex-direction:column;align-items:center;justify-content:space-between}.config-lists{width:100%;margin-bottom:12px}.config-actions{display:flex;flex-direction:row;justify-content:flex-end;width:100%;gap:12px}";
 
 const SnkSimpleFormConfig = class {
   constructor(hostRef) {
@@ -1355,7 +1215,7 @@ const SnkSimpleFormConfig = class {
     this.snkConfigSaved.emit();
   }
   render() {
-    return (h("ez-popup", { ref: (ref) => this.ezPopupRef = ref, heightMode: 'auto', size: 'auto', ezTitle: 'Configurar formul\u00E1rio' }, h("div", { class: 'config-container' }, h("div", { class: 'config-lists' }, h("ez-double-list", { ref: (ref) => this.ezDoubleListRef = ref, leftList: this.avaliableFields, leftTitle: 'Campos disponíveis', rightList: this.selectedFields, rightTitle: 'Campos selecionados', onEzRightListChanged: ({ detail }) => this.fieldsToSave = [...detail], entityLabel: 'campo', entityLabelPlural: 'campos' })), h("div", { class: 'config-actions' }, h("ez-button", { label: 'Restaurar', onClick: this.handleResetConfigs.bind(this), size: 'small' }), h("ez-button", { label: 'Cancelar', onClick: this.handleCancel.bind(this), size: 'small' }), h("ez-button", { label: 'Salvar', class: 'ez-button--primary', onClick: this.handleSave.bind(this), size: 'small' })))));
+    return (h("ez-popup", { ref: (ref) => this.ezPopupRef = ref, heightMode: 'auto', size: 'medium', ezTitle: 'Configurar formul\u00E1rio' }, h("div", { class: 'config-container' }, h("div", { class: 'config-lists' }, h("ez-double-list", { ref: (ref) => this.ezDoubleListRef = ref, leftList: this.avaliableFields, leftTitle: 'Campos disponíveis', rightList: this.selectedFields, rightTitle: 'Campos selecionados', onEzRightListChanged: ({ detail }) => this.fieldsToSave = [...detail], entityLabel: 'campo', entityLabelPlural: 'campos' })), h("div", { class: 'config-actions' }, h("ez-button", { label: 'Restaurar', onClick: this.handleResetConfigs.bind(this), size: 'small' }), h("ez-button", { label: 'Cancelar', onClick: this.handleCancel.bind(this), size: 'small' }), h("ez-button", { label: 'Salvar', class: 'ez-button--primary', onClick: this.handleSave.bind(this), size: 'small' })))));
   }
 };
 SnkSimpleFormConfig.style = snkSimpleFormConfigCss;

package/dist/esm/snk-application.entry.js

@@ -1,16 +1,16 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-479e1293.js';
 import { DateUtils, StringUtils, ObjectUtils, WaitingChangeException, SilentException, WarningException, ErrorException, ElementIDUtils, SearchUtils, ArrayUtils, KeyboardManager, OnboardingUtils, DependencyType, ApplicationContext, DataType, ErrorTracking, UserAgentUtils, LockManager, LockManagerOperation } from '@sankhyalabs/core';
 import { ApplicationUtils } from '@sankhyalabs/ezui/dist/collection/utils';
-import { C as ConfigStorage } from './ConfigStorage-79b9e180.js';
-import { d as dist, D as DataFetcher, U as UrlUtils } from './DataFetcher-88e56266.js';
-import { A as AutorizationType, a as AuthFetcher } from './auth-fetcher-3510520e.js';
-import { P as PreloadManager, D as DataUnitFetcher } from './dataunit-fetcher-0e025732.js';
-import { P as PesquisaFetcher } from './ISave-5efafc97.js';
-import { S as SnkMessageBuilder } from './SnkMessageBuilder-9c269caf.js';
+import { C as ConfigStorage } from './ConfigStorage-89154c4e.js';
+import { d as dist, D as DataFetcher, U as UrlUtils } from './DataFetcher-db08cad0.js';
+import { A as AutorizationType, a as AuthFetcher } from './auth-fetcher-43c8d76b.js';
+import { P as PreloadManager, D as DataUnitFetcher } from './dataunit-fetcher-1b78797a.js';
+import { P as PesquisaFetcher } from './ISave-da565824.js';
+import { S as SnkMessageBuilder } from './SnkMessageBuilder-da87a821.js';
 import { T as TEMPLATES_SKELETON } from './constants-7b422de0.js';
 import './index-b40568ff.js';
 import './filter-item-type.enum-d45e026f.js';
-import { F as FormConfigFetcher } from './form-config-fetcher-fa208a6c.js';
+import { F as FormConfigFetcher } from './form-config-fetcher-e623539b.js';
 import './PrintUtils-3e4ff0f5.js';
 import '@sankhyalabs/core/dist/dataunit/metadata/UnitMetadata';
 import '@sankhyalabs/ezui/dist/collection/utils/constants';

package/dist/esm/snk-attach.entry.js

@@ -1,13 +1,13 @@
 import { r as registerInstance, c as createEvent, h } from './index-479e1293.js';
 import { ApplicationContext, DataType, Action, UserInterface, StringUtils, DataUnitLoaderUtils, DataUnit } from '@sankhyalabs/core';
-import { D as DataFetcher } from './DataFetcher-88e56266.js';
-import { S as SaveErrorsEnum } from './ISave-5efafc97.js';
+import { D as DataFetcher } from './DataFetcher-db08cad0.js';
+import { S as SaveErrorsEnum } from './ISave-da565824.js';
 import './index-b40568ff.js';
-import { P as PreloadManager, D as DataUnitFetcher, I as InMemoryLoader } from './dataunit-fetcher-0e025732.js';
+import { P as PreloadManager, D as DataUnitFetcher, I as InMemoryLoader } from './dataunit-fetcher-1b78797a.js';
 import './filter-item-type.enum-d45e026f.js';
-import './form-config-fetcher-fa208a6c.js';
+import './form-config-fetcher-e623539b.js';
 import { V as VIEW_MODE } from './constants-7b422de0.js';
-import { A as AutorizationType } from './auth-fetcher-3510520e.js';
+import { A as AutorizationType } from './auth-fetcher-43c8d76b.js';
 import { T as TaskbarElement } from './taskbar-elements-171476d4.js';
 import './PrintUtils-3e4ff0f5.js';
 import '@sankhyalabs/core/dist/dataunit/metadata/UnitMetadata';
@@ -621,6 +621,8 @@ const snkAttachCss = ".snk-attach__header.sc-snk-attach,.snk-attach__crud-sectio
 
 const RESOURCE_ID = 'AnexoSistema';
 const DATA_UNIT_NAME = 'br.com.sankhya.core.v3.anexoSistema';
+const GRID_LEGACY_CONFIG_NAME = 'GrdCfgHtml5:grdcfg.dynaform.anexo';
+const LINKORFILE_COLUMN_NAME = "ARQUIVOOULINK";
 const SnkAttach = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
@@ -649,6 +651,7 @@ const SnkAttach = class {
         this.back.emit();
       });
     };
+    this.gridLegacyConfigName = undefined;
     this.fetcherType = undefined;
     this.fetcher = undefined;
     this.dataUnit = undefined;
@@ -760,9 +763,11 @@ const SnkAttach = class {
     var _a, _b;
     this._currentDataUnit = new DataUnitFetcher().getDataUnit(RESOURCE_ID, DATA_UNIT_NAME);
     this._currentFetcher = this.getAnexoSistemaFetcherInstance();
+    let gridValidateForm;
     if (!this._currentDataUnit.metadata) {
       await ((_a = this._currentDataUnit) === null || _a === void 0 ? void 0 : _a.loadMetadata());
-      this.crudConfig = Object.assign({}, anexoSistemaCrudConfig);
+      this.crudConfig = this.entityName ? { form: anexoSistemaCrudConfig === null || anexoSistemaCrudConfig === void 0 ? void 0 : anexoSistemaCrudConfig.form } : Object.assign({}, anexoSistemaCrudConfig);
+      gridValidateForm = { grid: anexoSistemaCrudConfig === null || anexoSistemaCrudConfig === void 0 ? void 0 : anexoSistemaCrudConfig.grid };
     }
     this.initDataUnitLoaders();
     this._currentDataUnit.addFilterProvider({
@@ -772,19 +777,21 @@ const SnkAttach = class {
       interceptAction: (action) => this._currentDataUnitBuilder.getInterceptions(this._currentDataUnit, action, this._crudElement)
     });
     await ((_b = this._currentDataUnit) === null || _b === void 0 ? void 0 : _b.loadData());
-    this.disableEditFieldsNotInForm();
+    this.disableEditFieldsNotInForm(gridValidateForm);
   }
   async loadAttach() {
     var _a, _b;
     this._currentFetcher = new AttachFetcher();
     this._currentDataUnit = new DataUnit(InMemoryLoader.IN_MEMORY_DATA_UNIT_NAME);
     this._currentDataUnit.pageSize = 150;
+    let gridValidateForm;
     this.initDataUnitLoaders();
     this._currentDataUnit.addInterceptor({
       interceptAction: (action) => {
         var _a;
         if (action.type === Action.METADATA_LOADED) {
-          this.crudConfig = Object.assign({}, attachCrudConfig);
+          this.crudConfig = this.entityName ? { form: attachCrudConfig === null || attachCrudConfig === void 0 ? void 0 : attachCrudConfig.form } : Object.assign({}, attachCrudConfig);
+          gridValidateForm = { grid: attachCrudConfig === null || attachCrudConfig === void 0 ? void 0 : attachCrudConfig.grid };
           (_a = this._crudElement) === null || _a === void 0 ? void 0 : _a.updateConfig();
         }
         return this._currentDataUnitBuilder.getInterceptions(this._currentDataUnit, action, this._crudElement);
@@ -792,9 +799,10 @@ const SnkAttach = class {
     });
     if (!this._currentDataUnit.metadata) {
       await ((_a = this._currentDataUnit) === null || _a === void 0 ? void 0 : _a.loadMetadata());
-      this.crudConfig = Object.assign({}, attachCrudConfig);
+      this.crudConfig = this.entityName ? { form: attachCrudConfig === null || attachCrudConfig === void 0 ? void 0 : attachCrudConfig.form } : Object.assign({}, attachCrudConfig);
+      gridValidateForm = { grid: attachCrudConfig === null || attachCrudConfig === void 0 ? void 0 : attachCrudConfig.grid };
       await ((_b = this._currentDataUnit) === null || _b === void 0 ? void 0 : _b.loadData(undefined, undefined, true, this.registerKey));
-      this.disableEditFieldsNotInForm();
+      this.disableEditFieldsNotInForm(gridValidateForm);
     }
   }
   initDataUnitLoaders() {
@@ -813,12 +821,16 @@ const SnkAttach = class {
       });
     }
   }
-  disableEditFieldsNotInForm() {
-    var _a;
-    (_a = this.crudConfig) === null || _a === void 0 ? void 0 : _a.grid.columns.forEach(column => {
-      var _a;
+  disableEditFieldsNotInForm(gridValidateForm) {
+    var _a, _b, _c, _d, _e;
+    const gridColumns = ((_b = (_a = this._crudElement) === null || _a === void 0 ? void 0 : _a.gridConfig) === null || _b === void 0 ? void 0 : _b.columns) || ((_c = gridValidateForm === null || gridValidateForm === void 0 ? void 0 : gridValidateForm.grid) === null || _c === void 0 ? void 0 : _c.columns) || ((_e = (_d = this.crudConfig) === null || _d === void 0 ? void 0 : _d.grid) === null || _e === void 0 ? void 0 : _e.columns);
+    if (!!this.getGridLegacyConfigName()) {
+      this._currentDataUnit.disableField(LINKORFILE_COLUMN_NAME);
+    }
+    gridColumns === null || gridColumns === void 0 ? void 0 : gridColumns.forEach(column => {
+      var _a, _b;
       const fieldName = column.name;
-      if (!((_a = this.crudConfig) === null || _a === void 0 ? void 0 : _a.form.fields.some(field => field.name === fieldName))) {
+      if (!((_b = (_a = this.crudConfig) === null || _a === void 0 ? void 0 : _a.form) === null || _b === void 0 ? void 0 : _b.fields.some(field => (field === null || field === void 0 ? void 0 : field.name) === fieldName))) {
         this._currentDataUnit.disableField(fieldName);
       }
     });
@@ -868,11 +880,16 @@ const SnkAttach = class {
     await this._currentDataUnit.loadMetadata();
   }
   ;
+  getGridLegacyConfigName() {
+    if (this.gridLegacyConfigName)
+      return this.gridLegacyConfigName;
+    return this.entityName ? GRID_LEGACY_CONFIG_NAME + "." + this.entityName : this.entityName;
+  }
   render() {
     var _a, _b;
     if (!this._currentDataUnit)
       return null;
-    return (h("main", { class: "snk-attach__main" }, h("header", { class: "snk-attach__header" }, h("snk-simple-bar", { onExit: this.handleBack, messagesBuilder: this.messagesBuilder }, h("div", { slot: "rightSlot" }, h("ez-button", { class: "ez-button--primary", label: this.getMessage("snkAttach.finish"), onClick: this.handleFinish })))), h("div", { class: "snk-attach__crud-section ez-size-height--full ez-size-width--full ez-flex ez-flex--column" }, h("div", { class: "ez-box__container" }, h("snk-simple-crud", { ref: (el) => this._crudElement = el, dataUnit: this._currentDataUnit, taskbarManager: buildTaskBarManager(), gridConfig: (_a = this.crudConfig) === null || _a === void 0 ? void 0 : _a.grid, formConfig: (_b = this.crudConfig) === null || _b === void 0 ? void 0 : _b.form, useCancelConfirm: false, onActionClick: this.handleTaskbarClick, messagesBuilder: this.messagesBuilder, onDataStateChange: this.handleOnDataStateChange.bind(this), multipleSelection: true }, h("div", { slot: "snkSimpleCrudHeader" }, h("div", { class: "ez-flex ez-flex--column" }, h("span", { class: "ez-title--primary ez-text ez-text--large ez-text--bold ez-padding-bottom--medium" }, this.getMessage("snkAttach.title")), h("span", { class: "ez-text ez-text--medium ez-text--secondary ez-padding-bottom--medium" }, this.getMessage("snkAttach.description")))))))));
+    return (h("main", { class: "snk-attach__main" }, h("header", { class: "snk-attach__header" }, h("snk-simple-bar", { onExit: this.handleBack, messagesBuilder: this.messagesBuilder }, h("div", { slot: "rightSlot" }, h("ez-button", { class: "ez-button--primary", label: this.getMessage("snkAttach.finish"), onClick: this.handleFinish })))), h("div", { class: "snk-attach__crud-section ez-size-height--full ez-size-width--full ez-flex ez-flex--column" }, h("div", { class: "ez-box__container" }, h("snk-simple-crud", { ref: (el) => this._crudElement = el, dataUnit: this._currentDataUnit, taskbarManager: buildTaskBarManager(), gridConfig: (_a = this.crudConfig) === null || _a === void 0 ? void 0 : _a.grid, formConfig: (_b = this.crudConfig) === null || _b === void 0 ? void 0 : _b.form, useCancelConfirm: false, onActionClick: this.handleTaskbarClick, messagesBuilder: this.messagesBuilder, onDataStateChange: this.handleOnDataStateChange.bind(this), multipleSelection: true, configName: this.entityName, ignoreReadOnlyFormFields: this.entityName ? true : false, gridLegacyConfigName: this.getGridLegacyConfigName() }, h("div", { slot: "snkSimpleCrudHeader" }, h("div", { class: "ez-flex ez-flex--column" }, h("span", { class: "ez-title--primary ez-text ez-text--large ez-text--bold ez-padding-bottom--medium" }, this.getMessage("snkAttach.title")), h("span", { class: "ez-text ez-text--medium ez-text--secondary ez-padding-bottom--medium" }, this.getMessage("snkAttach.description")))))))));
   }
   static get watchers() { return {
     "registerKey": ["registerKeyWatcher"]

package/dist/esm/snk-configurator.entry.js

@@ -109,7 +109,7 @@ const SnkConfigurator = class {
     insideCustomElementsContainer === null || insideCustomElementsContainer === void 0 ? void 0 : insideCustomElementsContainer.appendChild(configuratorCustomElement);
   }
   render() {
-    return (h("ez-modal", { ref: (element) => (this.modal = element), opened: this._opened, "close-esc": false, "close-outside-click": false, "modal-size": "small", scrim: "light" }, h("div", { class: "snk-configurator" }, h("div", { class: "snk-configurator__header" }, h("label", { class: "snk-configurator__title" }, this.getMessage('snkConfigurator.titleConfigurations')), h("div", { class: "snk-configurator__button-close" }, h("ez-button", { mode: "icon", iconName: "close", size: "medium", onClick: () => this.closeConfig() }))), h("div", { class: "snk-configurator__main" }, h("ez-collapsible-box", { boxBordered: true, label: "Modo de visualiza\u00E7\u00E3o ", headerSize: "medium", class: "snk-configurator__collapsable-box" }, h("ez-radio-button", { value: this.getViewModeValue().toString(), onEzChange: (evt) => this.onViewModeChanged(evt), enabled: this.enableModeConfig() }, h("ez-radio-button-option", { label: this.getMessage('snkConfigurator.labelGrid'), value: VIEW_MODE.GRID }), h("ez-radio-button-option", { label: this.getMessage('snkConfigurator.labelForm'), value: VIEW_MODE.FORM })), h("div", { class: "snk-configurator__collsable-box-action" }, h("ez-button", { label: this.viewMode === VIEW_MODE.GRID ? this.getMessage('snkConfigurator.labelConfigGrid') : this.getMessage('snkConfigurator.labelConfigForm'), class: "snk-configurator__button-config ez-button--secondary", onClick: () => this.onClickOpenConfig(), id: "openConfigurator" }))), this.layoutFormConfig && h("ez-collapsible-box", { boxBordered: true, value: true, label: "Layout do formul\u00E1rio", headerSize: "medium", class: "snk-configurator__collapsable-box  ez-margin-top--medium" }, h("div", { class: 'ez-flex ez-flex--column ez-size-width--full' }, h("snk-layout-form-config", { ref: (ref) => this._snkLayoutFormConfig = ref }))), h("div", { id: "slotContainer", class: "snk-configurator__outline" })), this.showActionButtons && (h("div", { class: "snk-configurator__action-buttons" }, h("ez-button", { label: "Cancelar", onClick: () => this.cancel.emit() }), h("ez-button", { label: "Salvar", onClick: () => this.handleSave(), class: "ez-button--primary" }))))));
+    return (h("ez-modal", { ref: (element) => (this.modal = element), opened: this._opened, "close-esc": false, "close-outside-click": false, "modal-size": "small", scrim: "light", onEzCloseModal: () => this.closeConfig() }, h("div", { class: "snk-configurator" }, h("div", { class: "snk-configurator__header" }, h("label", { class: "snk-configurator__title" }, this.getMessage('snkConfigurator.titleConfigurations')), h("div", { class: "snk-configurator__button-close" }, h("ez-button", { mode: "icon", iconName: "close", size: "medium", onClick: () => this.closeConfig() }))), h("div", { class: "snk-configurator__main" }, h("ez-collapsible-box", { boxBordered: true, label: "Modo de visualiza\u00E7\u00E3o ", headerSize: "medium", class: "snk-configurator__collapsable-box" }, h("ez-radio-button", { value: this.getViewModeValue().toString(), onEzChange: (evt) => this.onViewModeChanged(evt), enabled: this.enableModeConfig() }, h("ez-radio-button-option", { label: this.getMessage('snkConfigurator.labelGrid'), value: VIEW_MODE.GRID }), h("ez-radio-button-option", { label: this.getMessage('snkConfigurator.labelForm'), value: VIEW_MODE.FORM })), h("div", { class: "snk-configurator__collsable-box-action" }, h("ez-button", { label: this.viewMode === VIEW_MODE.GRID ? this.getMessage('snkConfigurator.labelConfigGrid') : this.getMessage('snkConfigurator.labelConfigForm'), class: "snk-configurator__button-config ez-button--secondary", onClick: () => this.onClickOpenConfig(), id: "openConfigurator" }))), this.layoutFormConfig && h("ez-collapsible-box", { boxBordered: true, value: true, label: "Layout do formul\u00E1rio", headerSize: "medium", class: "snk-configurator__collapsable-box  ez-margin-top--medium" }, h("div", { class: 'ez-flex ez-flex--column ez-size-width--full' }, h("snk-layout-form-config", { ref: (ref) => this._snkLayoutFormConfig = ref }))), h("div", { id: "slotContainer", class: "snk-configurator__outline" })), this.showActionButtons && (h("div", { class: "snk-configurator__action-buttons" }, h("ez-button", { label: "Cancelar", onClick: () => this.cancel.emit() }), h("ez-button", { label: "Salvar", onClick: () => this.handleSave(), class: "ez-button--primary" }))))));
   }
   get _element() { return getElement(this); }
 };