@sankhyalabs/sankhyablocks 8.15.0-rc.9 → 8.15.1-rc.1

package/dist/collection/components/snk-custom-slot-elements/snk-custom-slot-elements.js

@@ -3,8 +3,11 @@ export class SnkCustomSlotElements {
   constructor() {
     this.slotName = 'CUSTOM_SLOT_ELEMENTS';
   }
+  componentDidLoad() {
+    this.snkCustomSlotElementsLoaded.emit(this.slotName);
+  }
   render() {
-    return (h(Host, { slot: this.slotName }, h("div", { id: this.slotName, class: "custom-slot-elements-container" }, h("slot", null))));
+    return (h(Host, { slot: this.slotName, id: this.slotName, class: "custom-slot-elements-container" }, h("slot", null)));
   }
   static get is() { return "snk-custom-slot-elements"; }
   static get encapsulation() { return "scoped"; }
@@ -40,4 +43,22 @@ export class SnkCustomSlotElements {
       }
     };
   }
+  static get events() {
+    return [{
+        "method": "snkCustomSlotElementsLoaded",
+        "name": "snkCustomSlotElementsLoaded",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Emitido quando elemento \u00E9 carregado na tela."
+        },
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        }
+      }];
+  }
 }

package/dist/collection/components/snk-data-exporter/snk-data-exporter.js

@@ -236,14 +236,14 @@ export class SnkDataExporter {
     const pkObject = [];
     const appId = (option === null || option === void 0 ? void 0 : option.replace(this._customPrefix, "")) || "";
     (_a = this.provider) === null || _a === void 0 ? void 0 : _a.getSelectedIDs().forEach(({ name, type, value }, index) => {
-      const fields = [];
+      const fields = {};
       fields['fields'] = [];
       // Se for o primeiro elemento, adiciona essa primeira PK
       if (index === 0) {
         pkObject[`PK_${name}`] = { type: this.parseDataType(type), value };
         pkObject['pks'] = [];
       }
-      const dataFields = { nome: name, tipo: this.parseDataType(type), valor: value };
+      const dataFields = { nome: `PK_${name}`, tipo: this.parseDataType(type), valor: value };
       fields['fields'].push(dataFields);
       pkObject['pks'].push(fields);
     });

package/dist/collection/components/snk-filter-bar/filter-item/snk-filter-detail.js

@@ -8,6 +8,7 @@ export class SnkFilterDetail {
   constructor() {
     this.config = undefined;
     this.getMessage = undefined;
+    this.showHardFixed = true;
   }
   /**
    * Exibe o componente snk-filter-detail.
@@ -85,7 +86,9 @@ export class SnkFilterDetail {
     return Object.assign(Object.assign({}, item), { visible: false, fixed: false, value: undefined });
   }
   getPopUpHeaderButtons() {
-    return (h(Fragment, null, !this.config.removalBlocked && this.buildIcon(this.getMessage("snkFilterBar.removeFilter"), "delete", () => this.removeItem()), !this.config.hardFixed && this.buildIcon(this.getMessage(this.config.fixed ? "snkFilterBar.unpinFilter" : "snkFilterBar.pinFilter"), this.config.fixed ? "un-pin" : "push-pin", () => this.changeConfig(Object.assign(Object.assign({}, this.config), { fixed: !this.config.fixed })))));
+    return (h(Fragment, null, !this.config.removalBlocked &&
+      this.buildIcon(this.getMessage("snkFilterBar.removeFilter"), "delete", () => this.removeItem()), this.showHardFixed && !this.config.hardFixed &&
+      this.buildIcon(this.getMessage(this.config.fixed ? "snkFilterBar.unpinFilter" : "snkFilterBar.pinFilter"), this.config.fixed ? "un-pin" : "push-pin", () => this.changeConfig(Object.assign(Object.assign({}, this.config), { fixed: !this.config.fixed })))));
   }
   buildIcon(title, iconName, action) {
     return (h("button", { onClick: () => action(), class: "sc-snk-filter-bar snk-filter-item__editor-header-button", ref: elem => elem && this.buildIdButton(elem, title) }, h("ez-icon", Object.assign({ title: title, iconName: iconName }, { [ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME]: `${ElementIDUtils.getInternalIDInfo(`_${title}`)}` }))));
@@ -196,6 +199,24 @@ export class SnkFilterDetail {
           "tags": [],
           "text": "Usado pra flexibilizar os verbetes e mensagens de acordo com o SnkMessageBuilder."
         }
+      },
+      "showHardFixed": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Controla a visibilidade do bot\u00E3o de fixar elemento"
+        },
+        "attribute": "show-hard-fixed",
+        "reflect": false,
+        "defaultValue": "true"
       }
     };
   }

package/dist/collection/components/snk-filter-bar/filter-item/snk-filter-item.js

@@ -14,6 +14,7 @@ export class SnkFilterItem {
     this.detailIsVisible = undefined;
     this.config = undefined;
     this.getMessage = undefined;
+    this.showChips = true;
   }
   observeDetailIsVisible(value) {
     this.visibleChanged.emit(value);
@@ -45,19 +46,22 @@ export class SnkFilterItem {
       autoClose: true,
       innerClickTest: this.innerClickCheck,
       backClickListener: () => this.onDetailCloseCallback(),
-      left: this.getScrollOffsetLeft(),
-      top: this.getScrollOffsetTop(),
+      left: this.getOffsetLeft(),
+      top: this.getOffsetTop(),
       useOverlay: true,
       overlayClassName: 'ez-scrim ez-scrim--light',
       isFixed: true
     };
   }
-  getScrollOffsetLeft() {
+  getOffsetLeft() {
     const padding = getComputedStyle(this._filterItemElement).getPropertyValue("padding-left");
     const rect = this._filterItemElement.getBoundingClientRect();
-    return `calc(${rect.x}px + ${padding})`;
+    // Width baseado no conteudo do snk-filter-detail. Nesse momento ele retorna 0px pois ainda não foi criado em tela.
+    const filterDetailWidth = 430;
+    const adjustRightPosition = filterDetailWidth - (document.body.clientWidth - rect.left);
+    return `calc(${rect.x}px + ${padding} - ${adjustRightPosition > 0 ? adjustRightPosition : 0}px)`;
   }
-  getScrollOffsetTop() {
+  getOffsetTop() {
     const rect = this._filterItemElement.getBoundingClientRect();
     return (rect.y + rect.height) + "px";
   }
@@ -289,7 +293,7 @@ export class SnkFilterItem {
   }
   render() {
     const leftIcon = this.getLeftIconName();
-    return (h(Host, null, h("ez-chip", { id: this.config.id, ref: ref => this._chipElement = ref, label: this.getLabel(), value: this.getEnabledChip() }, leftIcon ? h("ez-icon", { ref: ref => this._leftIconElement = ref, iconName: leftIcon, class: "ez-padding-right--small", slot: "leftIcon" }) : undefined, h("ez-icon", { ref: ref => this._rightIconElement = ref, iconName: this.getRightIconName(), class: "ez-padding-left--small", slot: "rightIcon", id: "removeFilter" })), h("section", { class: "ez-margin-top--small sc-snk-filter-bar snk-filter__popover-container", ref: elem => this._popoverContainer = elem }, h("snk-filter-detail", { config: this.config, getMessage: this.getMessage, class: "sc-snk-filter-bar snk-filter__popover ez-padding--small ez-elevation--16", ref: elem => this._popover = elem, key: this.config.id, "data-element-id": this._idSnkFilterDetail }))));
+    return (h(Host, null, this.showChips && (h("ez-chip", { id: this.config.id, ref: ref => this._chipElement = ref, label: this.getLabel(), value: this.getEnabledChip() }, leftIcon && (h("ez-icon", { ref: ref => this._leftIconElement = ref, iconName: leftIcon, class: "ez-padding-right--small", slot: "leftIcon" })), h("ez-icon", { ref: ref => this._rightIconElement = ref, iconName: this.getRightIconName(), class: "ez-padding-left--small", slot: "rightIcon", id: "removeFilter" }))), h("section", { class: "ez-margin-top--small sc-snk-filter-bar snk-filter__popover-container", ref: elem => this._popoverContainer = elem }, h("snk-filter-detail", { config: this.config, getMessage: this.getMessage, class: "sc-snk-filter-bar snk-filter__popover ez-padding--small ez-elevation--16", ref: elem => this._popover = elem, key: this.config.id, "data-element-id": this._idSnkFilterDetail, showHardFixed: this.showChips }))));
   }
   static get is() { return "snk-filter-item"; }
   static get properties() {
@@ -327,6 +331,24 @@ export class SnkFilterItem {
           "tags": [],
           "text": "Usado pra flexibilizar os verbetes e mensagens de acordo com o SnkMessageBuilder."
         }
+      },
+      "showChips": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Usado para controlar a visibilidade dos chips de filtros"
+        },
+        "attribute": "show-chips",
+        "reflect": false,
+        "defaultValue": "true"
       }
     };
   }

package/dist/collection/components/snk-filter-bar/snk-filter-bar.css

@@ -22,7 +22,8 @@
 }
 
 :host([data-mode="hidden"]) {
-  display: none;
+  width: 0px;
+  height: 0px;
 }
 
 :host([data-mode="button"]) {

package/dist/collection/components/snk-filter-bar/snk-filter-bar.js

@@ -35,12 +35,18 @@ export class SnkFilterBar {
     this.filterConfig = undefined;
     this.messagesBuilder = undefined;
     this.disablePersonalizedFilter = undefined;
+    this.filterBarLegacyConfigName = undefined;
     this.allowDefault = undefined;
     this.scrollerLocked = false;
     this.showPersonalizedFilter = false;
     this.personalizedFilterId = undefined;
   }
   observeFilterConfig(newValue, oldValue) {
+    if (ObjectUtils.equals(newValue, oldValue))
+      return;
+    this.handleFilterConfigsChanged(oldValue, newValue);
+  }
+  handleFilterConfigsChanged(oldValue, newValue) {
     if (oldValue != undefined && newValue == undefined) {
       this._loadingPending = true;
       this._configUpdated = true;
@@ -244,6 +250,17 @@ export class SnkFilterBar {
   filterActiveFilter(item) {
     return item.visible || item.removalBlocked;
   }
+  filterPersonalizedItems(item) {
+    return item.type === FilterItemType.PERSONALIZED;
+  }
+  getPersonalizedFilterVariableItems() {
+    return this.filterConfig
+      .filter(this.filterPersonalizedItems)
+      .map(item => {
+      const itemId = `filter-${item.id}`;
+      return (h("snk-filter-item", { key: item.id, id: itemId, config: Object.assign({}, item), onFocusin: () => this.itemFocused(itemId), onVisibleChanged: (evt) => this.scrollerLocked = evt.detail, onFilterChange: (event) => this.updateFilter(event.detail), getMessage: (key, props) => this.getMessage(key, props), showChips: false }));
+    });
+  }
   getFilterItems() {
     const pinnedItems = [];
     const unpinnedItems = [];
@@ -303,6 +320,11 @@ export class SnkFilterBar {
   loadPermitions() {
     this._application.isUserSup().then(value => this.allowDefault = value);
   }
+  addFilterBarLegacyConfigName() {
+    if (this.filterBarLegacyConfigName && this.configName) {
+      ConfigStorage.addFilterBarLegacyConfig(this.configName, this.filterBarLegacyConfigName);
+    }
+  }
   async loadConfigFromStorage(clearCache) {
     if (clearCache) {
       await ConfigStorage.deleteFilterBarConfigCache(this.configName, this.resourceID);
@@ -409,6 +431,7 @@ export class SnkFilterBar {
     this._application = ApplicationContext.getContextValue("__SNK__APPLICATION__");
     if (this._application) {
       this.loadPermitions();
+      this.addFilterBarLegacyConfigName();
       this.loadConfigFromStorage();
     }
     this.attachDataUnit();
@@ -423,9 +446,10 @@ export class SnkFilterBar {
     if (this.showPersonalizedFilter) {
       return h("snk-personalized-filter", { class: "filter-bar__personalized-filter", filterId: this.personalizedFilterId, ref: (el) => this._elPersonalizedFilter = el, onEzCancel: () => this.handleHidePersonalizedFilter(false), onEzAfterSave: () => this.handleHidePersonalizedFilter(true), entityUri: this.dataUnit.name, configName: this.configName, resourceID: this.resourceID });
     }
-    if (this.mode === "button")
-      return (h(Host, { "data-mode": this.mode }, h("ez-button", { class: "ez-margin-left--medium", size: "small", label: this.getMessage('snkFilterBar.filters', undefined, 'Filtros'), onClick: this.showFilterModal.bind(this) })));
-    return (h(Host, { "data-mode": this.mode }, h("div", null, h("span", { class: "snk-filter-bar__title", title: this.title, "data-tooltip": this.title, "data-flow": "bottom" }, this.title)), h("ez-scroller", { class: "snk-filter-bar__scroller", direction: EzScrollDirection.HORIZONTAL, activeShadow: true, locked: this.scrollerLocked }, h("section", { class: "snk-filter-bar__filter-item-container" }, this.getFilterItems())), h("ez-button", { class: "ez-padding-left--medium", size: "small", label: this.getMessage('snkFilterBar.filters', undefined, 'Filtros'), onClick: this.showFilterModal.bind(this) }, h("ez-icon", { slot: "leftIcon", iconName: "plus", class: "ez-padding-right--small" }))));
+    if (this.mode !== "regular") {
+      return (h(Host, { "data-mode": this.mode }, this.getPersonalizedFilterVariableItems(), this.mode === 'button' && (h("ez-button", { class: "ez-margin-left--medium", size: "small", label: this.getMessage('snkFilterBar.filters', undefined, 'Filtros'), onClick: this.showFilterModal.bind(this) }))));
+    }
+    return (h(Host, null, h("div", null, h("span", { class: "snk-filter-bar__title", title: this.title, "data-tooltip": this.title, "data-flow": "bottom" }, this.title)), h("ez-scroller", { class: "snk-filter-bar__scroller", direction: EzScrollDirection.HORIZONTAL, activeShadow: true, locked: this.scrollerLocked }, h("section", { class: "snk-filter-bar__filter-item-container" }, this.getFilterItems())), h("ez-button", { class: "ez-padding-left--medium", size: "small", label: this.getMessage('snkFilterBar.filters', undefined, 'Filtros'), onClick: this.showFilterModal.bind(this) }, h("ez-icon", { slot: "leftIcon", iconName: "plus", class: "ez-padding-right--small" }))));
   }
   static get is() { return "snk-filter-bar"; }
   static get encapsulation() { return "scoped"; }
@@ -589,6 +613,23 @@ export class SnkFilterBar {
         },
         "attribute": "disable-personalized-filter",
         "reflect": false
+      },
+      "filterBarLegacyConfigName": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Chave da configura\u00E7\u00E3o legado da barra de filtros."
+        },
+        "attribute": "filter-bar-legacy-config-name",
+        "reflect": false
       }
     };
   }

package/dist/collection/components/snk-form/snk-form.js

@@ -1,6 +1,6 @@
 import { ElementIDUtils } from '@sankhyalabs/core';
 import { h } from '@stencil/core';
-import { SnkFormConfigManager } from './SnkFormConfigManager';
+import { SnkFormConfigManager } from '../snk-form-config/SnkFormConfigManager';
 import ResourceIDUtils from '../../lib/resourceid/ResourceIDUtils';
 export class SnkForm {
   constructor() {
@@ -11,6 +11,7 @@ export class SnkForm {
     this.configName = undefined;
     this.recordsValidator = undefined;
     this.messagesBuilder = undefined;
+    this.formLegacyConfigName = undefined;
     this.resourceID = undefined;
   }
   /**
@@ -58,8 +59,14 @@ export class SnkForm {
       this.resourceID = await ResourceIDUtils.getResourceID();
     }
     this._configManager = new SnkFormConfigManager(this.configName, this.resourceID);
+    this.addFormLegacyConfig();
     this._configManager.loadConfig();
   }
+  addFormLegacyConfig() {
+    if (this.formLegacyConfigName) {
+      this._configManager.addFormLegacyConfig(this.formLegacyConfigName);
+    }
+  }
   render() {
     if (!this._dataUnit || !this._dataState) {
       return undefined;
@@ -138,6 +145,23 @@ export class SnkForm {
           "text": "Respons\u00E1vel por flexibilizar e padronizar o uso de mensagens nos blocos de constru\u00E7\u00E3o."
         }
       },
+      "formLegacyConfigName": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Chave da configura\u00E7\u00E3o legado do formul\u00E1rio."
+        },
+        "attribute": "form-legacy-config-name",
+        "reflect": false
+      },
       "resourceID": {
         "type": "string",
         "mutable": false,

package/dist/collection/components/{snk-form → snk-form-config}/SnkFormConfigManager.js

@@ -1,4 +1,4 @@
-import { ConfigStorage } from "../../lib/configs/ConfigStorage";
+import { ConfigStorage } from '../../lib/configs/ConfigStorage';
 import { ObjectUtils, StringUtils } from "@sankhyalabs/core";
 import { FormConfigFetcher } from "../../lib/http/data-fetcher/fetchers/form-config-fetcher";
 export class SnkFormConfigManager {
@@ -7,6 +7,11 @@ export class SnkFormConfigManager {
     this._configName = configName;
     this._onConfigChange = onConfigChange;
   }
+  addFormLegacyConfig(legacyConfigName) {
+    if (this._configName) {
+      ConfigStorage.addFormLegacyConfig(this._configName, legacyConfigName);
+    }
+  }
   async loadConfig() {
     return new Promise(resolve => {
       ConfigStorage.loadFormConfig(this._configName, this._resourceID)
@@ -92,16 +97,19 @@ export class SnkFormConfigManager {
     const normalizedFilter = StringUtils.replaceAccentuatedCharsLower(descriptionFilter.toLocaleLowerCase());
     return normalizedText.includes(normalizedFilter);
   }
-  getInsertionConfig(dataUnit) {
-    const fields = this.getFieldsList(dataUnit).filter(field => {
-      if (dataUnit) {
-        const def = dataUnit.getField(field.name);
-        if (def && def.readOnly) {
-          return false;
+  getInsertionConfig(dataUnit, ignoreReadOnlyFormFields) {
+    let fields = this.getFieldsList(dataUnit);
+    if (ignoreReadOnlyFormFields) {
+      fields = fields.filter(field => {
+        if (dataUnit) {
+          const def = dataUnit.getField(field.name);
+          if (def && def.readOnly) {
+            return false;
+          }
         }
-      }
-      return !field.readOnly;
-    });
+        return !field.readOnly;
+      });
+    }
     return Object.assign(Object.assign({}, this._config), { fields });
   }
   setConfig(config) {
@@ -121,8 +129,8 @@ export class SnkFormConfigManager {
       this._onConfigChange(Object.assign({}, this._config));
     }
   }
-  getConfig(insertionMode, dataUnit) {
-    return insertionMode ? this.getInsertionConfig(dataUnit) : Object.assign({}, this._config);
+  getConfig(insertionMode, dataUnit, ignoreReadOnlyFormFields) {
+    return insertionMode ? this.getInsertionConfig(dataUnit, ignoreReadOnlyFormFields !== null && ignoreReadOnlyFormFields !== void 0 ? ignoreReadOnlyFormFields : true) : Object.assign({}, this._config);
   }
   getFormConfigFetcher() {
     if (this._formConfigFetcher == undefined) {

package/dist/collection/components/{snk-form/subcomponents/snk-form-config → snk-form-config}/snk-form-config.js

@@ -1,9 +1,9 @@
 import { h, Host } from "@stencil/core";
 import { Sortable } from '@shopify/draggable';
-import { ObjectUtils, ArrayUtils, ElementIDUtils } from '@sankhyalabs/core';
+import { ObjectUtils, ArrayUtils, ElementIDUtils, ApplicationContext } from '@sankhyalabs/core';
 import { ApplicationUtils, DialogType } from "@sankhyalabs/ezui/dist/collection/utils";
-import { ACTION_CONFIG, CONFIG_EVENTS, CONFIG_SORTABLE_EVENTS, DEFAULT_TYPE, TAB_NAMES } from "../../../../lib/utils/constants";
-import { UserConfigType } from "../../../../lib/http/data-fetcher/fetchers/form-config-fetcher";
+import { ACTION_CONFIG, CONFIG_EVENTS, CONFIG_SORTABLE_EVENTS, DEFAULT_TYPE, TAB_NAMES } from "../../lib/utils/constants";
+import { UserConfigType } from "../../lib/http/data-fetcher/fetchers/form-config-fetcher";
 import { buildFormConfigFromDataUnit } from "@sankhyalabs/ezui/dist/collection/utils/form";
 const CONTAINER_ID = {
   collapsibleBox: "EZ-COLLAPSIBLE-BOX",
@@ -946,6 +946,12 @@ export class SnkFormConfig {
     this.controlSortableField();
     this.controlSortableGroup();
   }
+  async componentWillRender() {
+    if (this.messagesBuilder == undefined) {
+      const application = ApplicationContext.getContextValue("__SNK__APPLICATION__");
+      this.messagesBuilder = application.messagesBuilder;
+    }
+  }
   componentWillLoad() {
     this.loadConfig();
   }
@@ -1019,7 +1025,7 @@ export class SnkFormConfig {
           "references": {
             "SnkFormConfigManager": {
               "location": "import",
-              "path": "../../SnkFormConfigManager"
+              "path": "./SnkFormConfigManager"
             }
           }
         },
@@ -1039,7 +1045,7 @@ export class SnkFormConfig {
           "references": {
             "SnkMessageBuilder": {
               "location": "import",
-              "path": "../../../../lib/message/SnkMessageBuilder"
+              "path": "../../lib/message/SnkMessageBuilder"
             }
           }
         },

package/dist/collection/components/snk-grid/snk-grid.js

@@ -1,6 +1,6 @@
 import { h, Fragment } from '@stencil/core';
 import { ApplicationContext, DataType, ElementIDUtils, StringUtils } from '@sankhyalabs/core';
-import { SortMode, UserInterface } from '@sankhyalabs/core/dist/dataunit/metadata/UnitMetadata';
+import { UserInterface } from '@sankhyalabs/core/dist/dataunit/metadata/UnitMetadata';
 import { TaskbarElement } from '../snk-taskbar/elements/taskbar-elements';
 import { ConfigStorage } from '../../lib/configs/ConfigStorage';
 import { PresentationMode } from '../../lib/@types';
@@ -9,6 +9,7 @@ import store from "../../lib/store";
 import SnkMultiSelectionListDataSource from './filtercolumn/SnkMultiSelectionListDataSource';
 import { SelectionMode } from '@sankhyalabs/core/dist/dataunit/DataUnit';
 import { buildFieldSearch, openFieldSearch } from '../snk-taskbar/subcomponents/field-search';
+import { CrudUtils } from '../../lib';
 export class SnkGrid {
   constructor() {
     this._topTaskbarProcessor = new TaskbarProcessor({
@@ -54,6 +55,8 @@ export class SnkGrid {
     this.gridHeaderCustomSlotId = 'GRID_HEADER_CUSTOM_ELEMENTS';
     this.topTaskbarCustomSlotId = 'GRID_TASKBAR_CUSTOM_ELEMENTS';
     this.disablePersonalizedFilter = undefined;
+    this.gridLegacyConfigName = undefined;
+    this.filterBarLegacyConfigName = undefined;
   }
   /**
    * Exibe a janela de configurações da grade.
@@ -98,6 +101,22 @@ export class SnkGrid {
   async findColumn() {
     await openFieldSearch(this._moreOptions, this._columnSearch);
   }
+  /**
+   * Atribui o foco para a grade.
+   */
+  async setFocus() {
+    this._grid.setFocus();
+  }
+  async handleGridLegacyConfigName(newLegacyConfig, oldLegacyConfig) {
+    if (!newLegacyConfig) {
+      return;
+    }
+    if (newLegacyConfig === oldLegacyConfig) {
+      return;
+    }
+    this.addGridLegacyConfigName();
+    this.loadConfig();
+  }
   openGridConfig() {
     this._grid.getColumnsState()
       .then((gridColumns) => {
@@ -111,19 +130,7 @@ export class SnkGrid {
   }
   setGridConfig(config) {
     this._gridConfig = config;
-    this.assertDefaultSorting();
-  }
-  assertDefaultSorting() {
-    if (this._gridConfig && this._dataUnit) {
-      this._dataUnit.defaultSorting = this._gridConfig
-        .columns
-        .filter(col => col.ascending != undefined)
-        .sort((colA, colB) => colA.orderIndex - colB.orderIndex)
-        .map(({ name: field, ascending }) => {
-        const { dataType } = this._dataUnit.getField(field);
-        return { field, dataType, mode: ascending ? SortMode.ASC : SortMode.DESC };
-      });
-    }
+    CrudUtils.assertDefaultSorting(this._gridConfig, this._dataUnit);
   }
   loadConfig() {
     ConfigStorage.loadGridConfig(this.configName, this.resourceID)
@@ -134,6 +141,11 @@ export class SnkGrid {
       console.warn(error);
     });
   }
+  addGridLegacyConfigName() {
+    if (this.gridLegacyConfigName && this.configName) {
+      ConfigStorage.addGridLegacyConfig(this.configName, this.gridLegacyConfigName);
+    }
+  }
   gridConfigChangeHandler(evt) {
     const config = evt.detail;
     ConfigStorage.saveGridConfig(config, this.configName, this.resourceID);
@@ -249,7 +261,7 @@ export class SnkGrid {
     ElementIDUtils.addIDInfo(this._element, null, dataInfo);
   }
   finshLoading() {
-    this.assertDefaultSorting();
+    CrudUtils.assertDefaultSorting(this._gridConfig, this._dataUnit);
     this.addElementID();
     if (this.columnFilterDataSource != undefined) {
       this.columnFilterDataSource.setApplication(this._application);
@@ -258,6 +270,7 @@ export class SnkGrid {
   }
   componentWillLoad() {
     this._application = ApplicationContext.getContextValue("__SNK__APPLICATION__");
+    //TODO: substituir pelo metodo nativo closest
     let parent = this._element.parentElement;
     while (parent) {
       if (parent.tagName.toUpperCase() === "SNK-DATA-UNIT") {
@@ -287,6 +300,7 @@ export class SnkGrid {
       }
       parent = parent.parentElement;
     }
+    this.addGridLegacyConfigName();
     this.loadConfig();
   }
   getHeaderDisabledButtons() {
@@ -401,7 +415,7 @@ export class SnkGrid {
       return undefined;
     }
     return (h("div", { class: "snk-grid__container ez-flex ez-flex--column ez-flex-item--auto ez-padding--large" }, h("div", { class: "snk-grid__header ez-margin-bottom--medium" }, this._showSnkFilterBar &&
-      h(Fragment, null, h("snk-filter-bar", { ref: (ref) => this._snkFilterBar = ref, title: this.filterBarTitle, dataUnit: this._dataUnit, "data-element-id": "gridFilter", class: "snk-grid__filter-bar ez-align--top", configName: this.configName, messagesBuilder: this.messagesBuilder, resourceID: this.resourceID, onConfigUpdated: evt => this.handleFilterConfigUpdated(evt.detail), disablePersonalizedFilter: this.disablePersonalizedFilter }), h("hr", { class: "ez-divider-vertical ez-divider--dark ez-margin-left--medium snk-grid__header-divider" })), h("snk-taskbar", { class: "ez-padding-left--medium", "data-element-id": "grid_top", key: "topTaskbar", configName: this.configName, dataUnit: this._dataUnit, messagesBuilder: this.messagesBuilder, buttons: this._topTaskbarProcessor.buttons, disabledButtons: this._topTaskbarProcessor.disabledButtons, customButtons: this._topTaskbarProcessor.customButtons, primaryButton: this.getPrimaryButton(), resourceID: this.resourceID, customContainerId: this.taskbarCustomContainerId, customSlotId: this.topTaskbarCustomSlotId, overflowStrategy: 'none' }, h("slot", { name: this.topTaskbarCustomSlotId }))), h("ez-grid", { ref: ref => this._grid = ref, class: (this.presentationMode === PresentationMode.SECONDARY ? "snk-grid-container__without-shadow " : "") + "snk-grid__table", "data-element-id": "embedded", dataUnit: this._dataUnit, key: "grid-" + this._snkDataUnit.entityName, config: this._gridConfig, onConfigChange: (evt) => { this.gridConfigChangeHandler(evt); }, onEzDoubleClick: (evt) => this.gridDoubleClick.emit(evt.detail), statusResolver: this.statusResolver, multipleSelection: this.multipleSelection, columnfilterDataSource: this.columnFilterDataSource, selectionToastConfig: this.selectionToastConfig, useEnterLikeTab: this.useEnterLikeTab, recordsValidator: this.recordsValidator, canEdit: this.canEdit }, h("snk-taskbar", { id: 'teste', dataUnit: this._dataUnit, configName: this.configName, messagesBuilder: this.messagesBuilder, "data-element-id": "grid_left", buttons: this._headerTaskbarProcessor.buttons, presentationMode: this.presentationMode, disabledButtons: this._headerTaskbarProcessor.disabledButtons, customButtons: this._headerTaskbarProcessor.customButtons, slot: "leftButtons", actionsList: this.getActionsList(), primaryButton: this.getPrimaryButton(), resourceID: this.resourceID, customContainerId: this.taskbarCustomContainerId, customSlotId: this.gridHeaderCustomSlotId }, h("slot", { name: this.gridHeaderCustomSlotId }))), h("div", { class: "ez-col ez-col--sd-12" }, h("slot", { name: "SnkGridFooter" })), h("ez-modal", { modalSize: "small", closeEsc: false, closeOutsideClick: false, opened: this._popUpGridConfig, onEzCloseModal: () => this.closeGridConfig() }, h("snk-grid-config", { ref: ref => this._snkGridConfig = ref, config: this._gridConfig, "data-element-id": this._element.getAttribute(ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME), application: this._application, selectedIndex: 0, configName: this.configName, onConfigChange: (evt) => this.modalConfigChangeHandler(evt), onConfigCancel: () => this.closeGridConfig(), resourceID: this.resourceID }))));
+      h(Fragment, null, h("snk-filter-bar", { ref: (ref) => this._snkFilterBar = ref, title: this.filterBarTitle, dataUnit: this._dataUnit, "data-element-id": "gridFilter", class: "snk-grid__filter-bar ez-align--top", configName: this.configName, messagesBuilder: this.messagesBuilder, resourceID: this.resourceID, onConfigUpdated: evt => this.handleFilterConfigUpdated(evt.detail), disablePersonalizedFilter: this.disablePersonalizedFilter, filterBarLegacyConfigName: this.filterBarLegacyConfigName }), h("hr", { class: "ez-divider-vertical ez-divider--dark ez-margin-left--medium snk-grid__header-divider" })), h("snk-taskbar", { class: "ez-padding-left--medium", "data-element-id": "grid_top", key: "topTaskbar", configName: this.configName, dataUnit: this._dataUnit, messagesBuilder: this.messagesBuilder, buttons: this._topTaskbarProcessor.buttons, disabledButtons: this._topTaskbarProcessor.disabledButtons, customButtons: this._topTaskbarProcessor.customButtons, primaryButton: this.getPrimaryButton(), resourceID: this.resourceID, customContainerId: this.taskbarCustomContainerId, customSlotId: this.topTaskbarCustomSlotId, overflowStrategy: 'none' }, h("slot", { name: this.topTaskbarCustomSlotId }))), h("ez-grid", { ref: ref => this._grid = ref, class: (this.presentationMode === PresentationMode.SECONDARY ? "snk-grid-container__without-shadow " : "") + "snk-grid__table", "data-element-id": "embedded", dataUnit: this._dataUnit, key: "grid-" + this._snkDataUnit.entityName, config: this._gridConfig, onConfigChange: (evt) => { this.gridConfigChangeHandler(evt); }, onEzDoubleClick: (evt) => this.gridDoubleClick.emit(evt.detail), statusResolver: this.statusResolver, multipleSelection: this.multipleSelection, columnfilterDataSource: this.columnFilterDataSource, selectionToastConfig: this.selectionToastConfig, useEnterLikeTab: this.useEnterLikeTab, recordsValidator: this.recordsValidator, canEdit: this.canEdit }, h("snk-taskbar", { id: 'teste', dataUnit: this._dataUnit, configName: this.configName, messagesBuilder: this.messagesBuilder, "data-element-id": "grid_left", buttons: this._headerTaskbarProcessor.buttons, presentationMode: this.presentationMode, disabledButtons: this._headerTaskbarProcessor.disabledButtons, customButtons: this._headerTaskbarProcessor.customButtons, slot: "leftButtons", actionsList: this.getActionsList(), primaryButton: this.getPrimaryButton(), resourceID: this.resourceID, customContainerId: this.taskbarCustomContainerId, customSlotId: this.gridHeaderCustomSlotId }, h("slot", { name: this.gridHeaderCustomSlotId }))), h("div", { class: "ez-col ez-col--sd-12" }, h("slot", { name: "SnkGridFooter" })), h("ez-modal", { modalSize: "small", closeEsc: false, closeOutsideClick: false, opened: this._popUpGridConfig, onEzCloseModal: () => this.closeGridConfig() }, h("snk-grid-config", { ref: ref => this._snkGridConfig = ref, config: this._gridConfig, "data-element-id": this._element.getAttribute(ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME), selectedIndex: 0, configName: this.configName, onConfigChange: (evt) => this.modalConfigChangeHandler(evt), onConfigCancel: () => this.closeGridConfig(), resourceID: this.resourceID }))));
   }
   static get is() { return "snk-grid"; }
   static get encapsulation() { return "scoped"; }
@@ -778,6 +792,40 @@ export class SnkGrid {
         },
         "attribute": "disable-personalized-filter",
         "reflect": false
+      },
+      "gridLegacyConfigName": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Chave da configura\u00E7\u00E3o legado da grade."
+        },
+        "attribute": "grid-legacy-config-name",
+        "reflect": false
+      },
+      "filterBarLegacyConfigName": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Chave da configura\u00E7\u00E3o legado da barra de filtros."
+        },
+        "attribute": "filter-bar-legacy-config-name",
+        "reflect": false
       }
     };
   }
@@ -930,8 +978,30 @@ export class SnkGrid {
           "text": "Abre o localizador de colunas",
           "tags": []
         }
+      },
+      "setFocus": {
+        "complexType": {
+          "signature": "() => Promise<void>",
+          "parameters": [],
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
+          },
+          "return": "Promise<void>"
+        },
+        "docs": {
+          "text": "Atribui o foco para a grade.",
+          "tags": []
+        }
       }
     };
   }
   static get elementRef() { return "_element"; }
+  static get watchers() {
+    return [{
+        "propName": "gridLegacyConfigName",
+        "methodName": "handleGridLegacyConfigName"
+      }];
+  }
 }