@sankhyalabs/sankhyablocks 10.1.0-dev.24 → 10.1.0-dev.25

package/dist/cjs/snk-grid.cjs.entry.js

@@ -6,24 +6,24 @@ const index = require('./index-1894343a.js');
 const core = require('@sankhyalabs/core');
 const DataUnit = require('@sankhyalabs/core/dist/dataunit/DataUnit');
 const utils = require('@sankhyalabs/ezui/dist/collection/utils');
-require('./DataFetcher-0c830777.js');
-require('./ISave-e1e8ec96.js');
-const SnkMultiSelectionListDataSource = require('./SnkMultiSelectionListDataSource-d30a96ef.js');
+require('./DataFetcher-3a8ea521.js');
+require('./ISave-a66bb65e.js');
+const SnkMultiSelectionListDataSource = require('./SnkMultiSelectionListDataSource-a891430e.js');
 const index$1 = require('./index-e3e39724.js');
 require('@sankhyalabs/ezui/dist/collection/utils/constants');
 require('@sankhyalabs/core/dist/dataunit/metadata/UnitMetadata');
-require('./dataunit-fetcher-86e286bb.js');
+require('./dataunit-fetcher-4320f7ec.js');
 require('./filter-item-type.enum-a7ffdaa6.js');
-require('./form-config-fetcher-227b2db2.js');
+require('./form-config-fetcher-72cf0e3d.js');
 require('./constants-6d82e405.js');
-const ConfigStorage = require('./ConfigStorage-f61eedd2.js');
+const ConfigStorage = require('./ConfigStorage-d9d24844.js');
 const index$2 = require('./index-f0fe7e6e.js');
 const GetSelectedRecordsIDsInfo = require('./GetSelectedRecordsIDsInfo-bd50caf1.js');
 const filterValidate = require('./filter-validate-cb4ed41a.js');
 const taskbarElements = require('./taskbar-elements-8a80420e.js');
 const taskbarProcessor = require('./taskbar-processor-2fba34a8.js');
 require('./PrintUtils-bcaeb82f.js');
-require('./SnkMessageBuilder-32950342.js');
+require('./SnkMessageBuilder-d9558dba.js');
 require('./IFetchDataExporterParams-e78ec415.js');
 require('@sankhyalabs/ezui/dist/collection/components/ez-grid/utils/InMemoryFilterColumnDataSource');
 require('@sankhyalabs/ezui/dist/collection/components/ez-grid/utils');
@@ -555,7 +555,7 @@ const SnkGrid = class {
     return disabledButtons;
   }
   getInvisibleButtons() {
-    var _a, _b;
+    var _a, _b, _c;
     let invisibleButtons = [];
     if (!this._dataUnit || this._dataUnit.records.length === 0)
       invisibleButtons.push(taskbarElements.TaskbarElement.DATA_EXPORTER);
@@ -563,6 +563,8 @@ const SnkGrid = class {
       invisibleButtons.push(taskbarElements.TaskbarElement.ACTIONS_BUTTON);
     if (((_b = this._dataState) === null || _b === void 0 ? void 0 : _b.selectionInfo.length) === 1)
       invisibleButtons.push(taskbarElements.TaskbarElement.UPDATE_MULTIPLE);
+    if (!((_c = this._dataState) === null || _c === void 0 ? void 0 : _c.selectionInfo.length))
+      invisibleButtons.push(taskbarElements.TaskbarElement.FORM_MODE);
     return invisibleButtons;
   }
   componentWillRender() {

package/dist/cjs/{snk-guides-viewer-92dadfa6.js → snk-guides-viewer-4bbd697f.js}

@@ -5,16 +5,16 @@ const core = require('@sankhyalabs/core');
 const DataUnit = require('@sankhyalabs/core/dist/dataunit/DataUnit');
 const utils = require('@sankhyalabs/ezui/dist/collection/utils');
 const form = require('@sankhyalabs/ezui/dist/collection/utils/form');
-require('./DataFetcher-0c830777.js');
-require('./ISave-e1e8ec96.js');
+require('./DataFetcher-3a8ea521.js');
+require('./ISave-a66bb65e.js');
 const index$1 = require('./index-e3e39724.js');
 require('@sankhyalabs/ezui/dist/collection/utils/constants');
 require('@sankhyalabs/core/dist/dataunit/metadata/UnitMetadata');
-require('./dataunit-fetcher-86e286bb.js');
+require('./dataunit-fetcher-4320f7ec.js');
 require('./filter-item-type.enum-a7ffdaa6.js');
-require('./form-config-fetcher-227b2db2.js');
+require('./form-config-fetcher-72cf0e3d.js');
 const constants = require('./constants-6d82e405.js');
-const SnkFormConfigManager = require('./SnkFormConfigManager-421f3581.js');
+const SnkFormConfigManager = require('./SnkFormConfigManager-c88cf1e9.js');
 const taskbarElements = require('./taskbar-elements-8a80420e.js');
 const taskbarProcessor = require('./taskbar-processor-2fba34a8.js');
 
@@ -621,7 +621,7 @@ const SnkGuidesViewer = class {
       propsCustomEditor: this._customEditors,
       fieldsProps: this._fieldsProps,
       entityPath: this.entityPath
-    }), this.getContent())), index.h("snk-configurator", { ref: (ref) => this._snkConfigurator = ref, viewMode: this.getConfigViewMode(), onConfigSelected: (evt) => this.changeConfigViewMode(evt.detail), messagesBuilder: this.messagesBuilder, onOpenConfig: (evt) => this.openConfig(evt.detail), resourceID: this.resourceID })));
+    }), this.getContent())), index.h("snk-configurator", { ref: (ref) => this._snkConfigurator = ref, viewMode: this.getConfigViewMode(), onConfigSelected: (evt) => this.changeConfigViewMode(evt.detail), messagesBuilder: this.messagesBuilder, onOpenConfig: (evt) => this.openConfig(evt.detail), resourceID: this.resourceID, layoutFormConfig: false, disableNumberingConfig: true })));
   }
   render() {
     if (!this.dataUnit || !this._configManager.isLoaded) {

package/dist/cjs/snk-guides-viewer.cjs.entry.js

@@ -2,28 +2,28 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const snkGuidesViewer = require('./snk-guides-viewer-92dadfa6.js');
+const snkGuidesViewer = require('./snk-guides-viewer-4bbd697f.js');
 require('./index-1894343a.js');
 require('@sankhyalabs/core');
 require('@sankhyalabs/core/dist/dataunit/DataUnit');
 require('@sankhyalabs/ezui/dist/collection/utils');
 require('@sankhyalabs/ezui/dist/collection/utils/form');
-require('./DataFetcher-0c830777.js');
+require('./DataFetcher-3a8ea521.js');
 require('./PrintUtils-bcaeb82f.js');
-require('./SnkMessageBuilder-32950342.js');
+require('./SnkMessageBuilder-d9558dba.js');
 require('@sankhyalabs/core/dist/dataunit/metadata/UnitMetadata');
-require('./ISave-e1e8ec96.js');
+require('./ISave-a66bb65e.js');
 require('./index-e3e39724.js');
 require('@sankhyalabs/ezui/dist/collection/utils/constants');
-require('./dataunit-fetcher-86e286bb.js');
+require('./dataunit-fetcher-4320f7ec.js');
 require('@sankhyalabs/ezui/dist/collection/components/ez-grid/utils');
 require('@sankhyalabs/core/dist/utils/SortingUtils');
 require('./ResourceIDUtils-5ff86aa7.js');
 require('./filter-item-type.enum-a7ffdaa6.js');
-require('./form-config-fetcher-227b2db2.js');
+require('./form-config-fetcher-72cf0e3d.js');
 require('./constants-6d82e405.js');
-require('./SnkFormConfigManager-421f3581.js');
-require('./ConfigStorage-f61eedd2.js');
+require('./SnkFormConfigManager-c88cf1e9.js');
+require('./ConfigStorage-d9d24844.js');
 require('./taskbar-elements-8a80420e.js');
 require('./index-f0fe7e6e.js');
 require('./taskbar-processor-2fba34a8.js');

package/dist/cjs/snk-image-input.cjs.entry.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-1894343a.js');
 const core = require('@sankhyalabs/core');
-const SnkMessageBuilder = require('./SnkMessageBuilder-32950342.js');
+const SnkMessageBuilder = require('./SnkMessageBuilder-d9558dba.js');
 const ImageUtils = require('./ImageUtils-5e3f406b.js');
 
 const snkImageInputCss = ":host{display:block}";

package/dist/cjs/snk-layout-form-config.cjs.entry.js

@@ -0,0 +1,72 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-1894343a.js');
+require('./DataFetcher-3a8ea521.js');
+require('./ISave-a66bb65e.js');
+const core = require('@sankhyalabs/core');
+require('./index-e3e39724.js');
+require('@sankhyalabs/ezui/dist/collection/utils/constants');
+require('@sankhyalabs/core/dist/dataunit/metadata/UnitMetadata');
+require('./dataunit-fetcher-4320f7ec.js');
+require('./filter-item-type.enum-a7ffdaa6.js');
+const formConfigFetcher = require('./form-config-fetcher-72cf0e3d.js');
+require('./constants-6d82e405.js');
+const utils = require('@sankhyalabs/ezui/dist/collection/utils');
+require('./PrintUtils-bcaeb82f.js');
+require('./SnkMessageBuilder-d9558dba.js');
+require('@sankhyalabs/ezui/dist/collection/components/ez-grid/utils');
+require('@sankhyalabs/core/dist/utils/SortingUtils');
+require('./ResourceIDUtils-5ff86aa7.js');
+
+const snkLayoutFormConfigCss = ".sc-snk-layout-form-config-h{display:block}";
+
+const FORM_COL_CONFIG_PREFIX = 'formColCfg.';
+const SnkLayoutFormConfig = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this._formConfigFetcher = new formConfigFetcher.FormConfigFetcher();
+    this.messagesBuilder = undefined;
+    this.layoutType = utils.FormLayout.SIDE_BY_SIDE;
+  }
+  /**
+   * Salva o tipo de layout escolhido. Sem retorno.
+   */
+  async save() {
+    this._LayoutFormConfigSingleton.setConfig(this.layoutType);
+    this._formConfigFetcher.saveLayoutFormConfig(FORM_COL_CONFIG_PREFIX + this._resourceID, { config: this.layoutType, newConfig: true });
+  }
+  async componentWillLoad() {
+    const _application = core.ApplicationContext.getContextValue("__SNK__APPLICATION__");
+    this._LayoutFormConfigSingleton = await (_application === null || _application === void 0 ? void 0 : _application.getLayoutFormConfig());
+    this._resourceID = await (_application === null || _application === void 0 ? void 0 : _application.getResourceID());
+    this.setLayoutInit();
+  }
+  setLayoutInit() {
+    if (!this._LayoutFormConfigSingleton)
+      return;
+    const { config } = this._LayoutFormConfigSingleton;
+    if (config == null) {
+      this.layoutType = utils.FormLayout.SIDE_BY_SIDE;
+      return;
+    }
+    const configAsNumber = Number(config);
+    this.layoutType = Object.values(utils.FormLayout).includes(configAsNumber)
+      ? configAsNumber
+      : utils.FormLayout.SIDE_BY_SIDE;
+  }
+  toggleLayout(key) {
+    this.layoutType = key;
+  }
+  getMessage(key, params) {
+    var _a;
+    return (_a = this.messagesBuilder) === null || _a === void 0 ? void 0 : _a.getMessage(key, params);
+  }
+  render() {
+    return (index.h("div", { class: "ez-flex ez-flex--column" }, index.h("div", { class: "ez-margin-bottom--small" }, index.h("ez-check", { label: this.getMessage('snkLayoutFormConfig.cascadeLayout.label'), class: "ez-margin-bottom--small", onEzChange: () => this.toggleLayout(utils.FormLayout.CASCADE), value: this.layoutType === utils.FormLayout.CASCADE }), index.h("snk-view-representation", { mode: utils.FormLayout.CASCADE }), index.h("label", { class: "ez-label ez-margin--small ez-flex ez-text--medium" }, this.getMessage('snkLayoutFormConfig.cascadeLayout.description'))), index.h("div", { class: "ez-margin-bottom--small" }, index.h("ez-check", { label: this.getMessage('snkLayoutFormConfig.classicCascadeLayout.label'), class: "ez-margin-bottom--small", onEzChange: () => this.toggleLayout(utils.FormLayout.CLASSIC_CASCADE), value: this.layoutType === utils.FormLayout.CLASSIC_CASCADE }), index.h("snk-view-representation", { mode: utils.FormLayout.CLASSIC_CASCADE }), index.h("label", { class: "ez-label ez-margin--small ez-flex ez-text--medium" }, this.getMessage('snkLayoutFormConfig.classicCascadeLayout.description'))), index.h("div", { class: "ez-margin-bottom--small" }, index.h("ez-check", { label: this.getMessage('snkLayoutFormConfig.sideBySideLayout.label'), class: "ez-margin-bottom--small", onEzChange: () => this.toggleLayout(utils.FormLayout.SIDE_BY_SIDE), value: this.layoutType === utils.FormLayout.SIDE_BY_SIDE }), index.h("snk-view-representation", { mode: utils.FormLayout.SIDE_BY_SIDE }), index.h("label", { class: "ez-label ez-margin--small ez-flex ez-text--medium" }, this.getMessage('snkLayoutFormConfig.sideBySideLayout.description'))), index.h("div", null, index.h("ez-check", { label: this.getMessage('snkLayoutFormConfig.classicSideBySideLayout.label'), class: "ez-margin-bottom--small", onEzChange: () => this.toggleLayout(utils.FormLayout.CLASSIC_SIDE_BY_SIDE), value: this.layoutType === utils.FormLayout.CLASSIC_SIDE_BY_SIDE }), index.h("snk-view-representation", { mode: utils.FormLayout.CLASSIC_SIDE_BY_SIDE }), index.h("label", { class: "ez-label ez-margin--small ez-flex ez-text--medium" }, this.getMessage('snkLayoutFormConfig.classicSideBySideLayout.description')))));
+  }
+};
+SnkLayoutFormConfig.style = snkLayoutFormConfigCss;
+
+exports.snk_layout_form_config = SnkLayoutFormConfig;

package/dist/cjs/snk-personalized-filter.cjs.entry.js

@@ -5,15 +5,15 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-1894343a.js');
 const core = require('@sankhyalabs/core');
 const PersonalizedFilterUtils = require('./PersonalizedFilterUtils-eccb267a.js');
-const ConfigStorage = require('./ConfigStorage-f61eedd2.js');
+const ConfigStorage = require('./ConfigStorage-d9d24844.js');
 const utils = require('@sankhyalabs/ezui/dist/collection/utils');
 const index$1 = require('./index-62760a9c.js');
 const index$2 = require('./index-f0fe7e6e.js');
 require('./filter-item-type.enum-a7ffdaa6.js');
-require('./form-config-fetcher-227b2db2.js');
-require('./DataFetcher-0c830777.js');
+require('./form-config-fetcher-72cf0e3d.js');
+require('./DataFetcher-3a8ea521.js');
 require('./PrintUtils-bcaeb82f.js');
-require('./SnkMessageBuilder-32950342.js');
+require('./SnkMessageBuilder-d9558dba.js');
 require('@sankhyalabs/core/dist/dataunit/metadata/UnitMetadata');
 
 const snkPersonalizedFilterCss = ".sc-snk-personalized-filter-h{display:flex;height:100%;padding:var(--space--large, 24px);--snk-personalized-filter--width:100%;--snk-personalized-filter--height:100%;--snk-personalized-filter--background-color-line:var(--color--disable-secondary);--snk-personalized-filter--margin-line:var(--border--radius-medium, 12px)}.snk-personalized-filter.sc-snk-personalized-filter{height:var(--snk-personalized-filter--width);width:var(--snk-personalized-filter--height)}.snk-personalized-filter__header-actions.sc-snk-personalized-filter{display:flex;gap:var(--space--medium)}.snk-personalized-filter__group.sc-snk-personalized-filter{flex:1}.snk-personalized-filter__expression-input--line.sc-snk-personalized-filter{width:100%;height:2px;background-color:var(--snk-personalized-filter--background-color-line);margin-top:var(--snk-personalized-filter--margin-line);margin-bottom:var(--snk-personalized-filter--margin-line)}.ez-box__main.sc-snk-personalized-filter{height:90%}.snk-personalized-filter__button-mode.sc-snk-personalized-filter{height:35px}";

package/dist/cjs/snk-pesquisa.cjs.entry.js

@@ -4,17 +4,17 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-1894343a.js');
 const core = require('@sankhyalabs/core');
-const ISave = require('./ISave-e1e8ec96.js');
-require('./DataFetcher-0c830777.js');
+const ISave = require('./ISave-a66bb65e.js');
+require('./DataFetcher-3a8ea521.js');
 require('./index-e3e39724.js');
 require('@sankhyalabs/ezui/dist/collection/utils/constants');
 require('@sankhyalabs/core/dist/dataunit/metadata/UnitMetadata');
-require('./dataunit-fetcher-86e286bb.js');
+require('./dataunit-fetcher-4320f7ec.js');
 require('./filter-item-type.enum-a7ffdaa6.js');
-require('./form-config-fetcher-227b2db2.js');
+require('./form-config-fetcher-72cf0e3d.js');
 require('./constants-6d82e405.js');
 require('./PrintUtils-bcaeb82f.js');
-require('./SnkMessageBuilder-32950342.js');
+require('./SnkMessageBuilder-d9558dba.js');
 require('@sankhyalabs/ezui/dist/collection/components/ez-grid/utils');
 require('@sankhyalabs/core/dist/utils/SortingUtils');
 require('./ResourceIDUtils-5ff86aa7.js');

package/dist/cjs/snk-simple-crud.cjs.entry.js

@@ -7,21 +7,21 @@ const core = require('@sankhyalabs/core');
 const utils = require('@sankhyalabs/ezui/dist/collection/utils');
 const constants = require('./constants-6d82e405.js');
 const taskbarElements = require('./taskbar-elements-8a80420e.js');
-require('./DataFetcher-0c830777.js');
-require('./ISave-e1e8ec96.js');
-const SnkMultiSelectionListDataSource = require('./SnkMultiSelectionListDataSource-d30a96ef.js');
+require('./DataFetcher-3a8ea521.js');
+require('./ISave-a66bb65e.js');
+const SnkMultiSelectionListDataSource = require('./SnkMultiSelectionListDataSource-a891430e.js');
 const index$1 = require('./index-e3e39724.js');
 require('@sankhyalabs/ezui/dist/collection/utils/constants');
 require('@sankhyalabs/core/dist/dataunit/metadata/UnitMetadata');
-const dataunitFetcher = require('./dataunit-fetcher-86e286bb.js');
+const dataunitFetcher = require('./dataunit-fetcher-4320f7ec.js');
 require('./filter-item-type.enum-a7ffdaa6.js');
-const formConfigFetcher = require('./form-config-fetcher-227b2db2.js');
+const formConfigFetcher = require('./form-config-fetcher-72cf0e3d.js');
 const taskbarProcessor = require('./taskbar-processor-2fba34a8.js');
-const ConfigStorage = require('./ConfigStorage-f61eedd2.js');
-const SnkFormConfigManager = require('./SnkFormConfigManager-421f3581.js');
+const ConfigStorage = require('./ConfigStorage-d9d24844.js');
+const SnkFormConfigManager = require('./SnkFormConfigManager-c88cf1e9.js');
 const index$2 = require('./index-f0fe7e6e.js');
 require('./PrintUtils-bcaeb82f.js');
-require('./SnkMessageBuilder-32950342.js');
+require('./SnkMessageBuilder-d9558dba.js');
 require('./GetSelectedRecordsIDsInfo-bd50caf1.js');
 require('./IFetchDataExporterParams-e78ec415.js');
 require('@sankhyalabs/ezui/dist/collection/components/ez-grid/utils/InMemoryFilterColumnDataSource');

package/dist/collection/collection-manifest.json

@@ -109,6 +109,11 @@
         "snk-guides-viewer"
       ]
     },
+    {
+      "components": [
+        "snk-layout-form-config"
+      ]
+    },
     {
       "components": [
         "snk-data-exporter"

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

@@ -71,7 +71,7 @@ export class SnkCrud {
     this.configName = undefined;
     this.filterBarTitle = undefined;
     this.selectionToastConfig = undefined;
-    this.showActionButtons = false;
+    this.showActionButtons = true;
     this.actionsList = undefined;
     this.taskbarManager = undefined;
     this.recordsValidator = undefined;
@@ -679,7 +679,7 @@ export class SnkCrud {
         },
         "attribute": "show-action-buttons",
         "reflect": false,
-        "defaultValue": "false"
+        "defaultValue": "true"
       },
       "actionsList": {
         "type": "unknown",

package/dist/collection/components/snk-crud/subcomponents/GuideBuilder.js

@@ -43,7 +43,7 @@ export class GuideBuilder {
       };
     });
     const newGuideItem = children.shift();
-    newGuideItem.label = isNewRecord ? this.getMessage("snkCrud.title.newRecord") : currentRecord.__record__label__;
+    newGuideItem.label = isNewRecord ? this.getMessage("snkCrud.newRecord") : currentRecord.__record__label__;
     newGuideItem.children = children;
     item.children = [newGuideItem];
     return item;

package/dist/collection/components/snk-crud/subcomponents/snk-detail-view/snk-detail-view.js

@@ -245,6 +245,9 @@ export class SnkDetailView {
     if (action.type === DUAction.FIELD_INVALIDATED) {
       this.addErrorBadgeToBranchGuide();
     }
+    else if (action.type === DUAction.DATA_LOADED) {
+      this.dataUnit.selectFirst();
+    }
   }
   addErrorBadgeToBranchGuide() {
     this.branchGuide = Object.assign(Object.assign({}, this.branchGuide), { badge: 'error' });

package/dist/collection/components/snk-crud/subcomponents/snk-form-view.js

@@ -35,6 +35,7 @@ export class SnkFormView {
       ]
     ]);
     this._singleColumn = false;
+    this._currentFormLayout = undefined;
     this.levelPath = undefined;
     this.fieldSearch = undefined;
     this.label = undefined;
@@ -167,27 +168,37 @@ export class SnkFormView {
       this.dataUnit.unsubscribe(this.dataUnitObserver);
     }
   }
+  async componentWillLoad() {
+    await this.initLayoutFormConfig();
+  }
+  async componentWillLoad() {
+    await this.initLayoutFormConfig();
+  }
   componentDidLoad() {
     this.observePropsCustomEditor(this.customEditors);
     this.observeFieldsProps(this.fieldsProps);
-    this.initLayoutFormConfig();
   }
   async initLayoutFormConfig() {
-    const _application = ApplicationContext.getContextValue("__SNK__APPLICATION__");
-    const layoutFormConfig = await (_application === null || _application === void 0 ? void 0 : _application.getLayoutFormConfig());
+    var _a;
+    if (!this._application) {
+      this._application = ApplicationContext.getContextValue("__SNK__APPLICATION__");
+    }
+    const layoutFormConfig = await ((_a = this._application) === null || _a === void 0 ? void 0 : _a.getLayoutFormConfig());
     if (layoutFormConfig) {
       this.setSingleColumn(layoutFormConfig);
       this.registerNotifyListeners(layoutFormConfig);
     }
   }
   setSingleColumn(layoutFormConfig) {
-    this._singleColumn = (layoutFormConfig === null || layoutFormConfig === void 0 ? void 0 : layoutFormConfig.config) === FormLayout.CASCADE;
+    this._singleColumn = (layoutFormConfig === null || layoutFormConfig === void 0 ? void 0 : layoutFormConfig.config) === FormLayout.CASCADE || (layoutFormConfig === null || layoutFormConfig === void 0 ? void 0 : layoutFormConfig.config) === FormLayout.CLASSIC_CASCADE;
+    this._currentFormLayout = layoutFormConfig === null || layoutFormConfig === void 0 ? void 0 : layoutFormConfig.config;
   }
   registerNotifyListeners(layoutFormConfig) {
     if (!layoutFormConfig)
       return;
     layoutFormConfig.onConfigChange((config) => {
-      this._singleColumn = (config === FormLayout.CASCADE);
+      this._singleColumn = (config === FormLayout.CASCADE || config === FormLayout.CLASSIC_CASCADE);
+      this._currentFormLayout = config;
     });
   }
   componentDidRender() {
@@ -247,7 +258,7 @@ export class SnkFormView {
       ?
         h("snk-form-summary", { summary: this.getCardSummary() })
       :
-        h("ez-form-view", { ref: ref => this._formView = ref, fields: this.fields, onEzContentReady: evt => this.bindFields(evt.detail), onFormItemsReady: (event) => this.handleFormItemsReady(event), singleColumn: this._singleColumn, customUiBuilders: this.customUiBuilders }), this.fieldSearch && h("ez-popover", { ref: elem => (this._ezPopoverFieldColumn = elem), overlayType: "none" }, this.fieldSearch)));
+        h("ez-form-view", { ref: ref => this._formView = ref, fields: this.fields, onEzContentReady: evt => this.bindFields(evt.detail), onFormItemsReady: (event) => this.handleFormItemsReady(event), singleColumn: this._singleColumn, customUiBuilders: this.customUiBuilders, formLayout: this._currentFormLayout }), this.fieldSearch && h("ez-popover", { ref: elem => (this._ezPopoverFieldColumn = elem), overlayType: "none" }, this.fieldSearch)));
   }
   static get is() { return "snk-form-view"; }
   static get encapsulation() { return "scoped"; }
@@ -585,7 +596,8 @@ export class SnkFormView {
   }
   static get states() {
     return {
-      "_singleColumn": {}
+      "_singleColumn": {},
+      "_currentFormLayout": {}
     };
   }
   static get events() {

package/dist/collection/components/snk-crud/subcomponents/snk-guides-viewer.js

@@ -602,7 +602,7 @@ export class SnkGuidesViewer {
       propsCustomEditor: this._customEditors,
       fieldsProps: this._fieldsProps,
       entityPath: this.entityPath
-    }), this.getContent())), h("snk-configurator", { ref: (ref) => this._snkConfigurator = ref, viewMode: this.getConfigViewMode(), onConfigSelected: (evt) => this.changeConfigViewMode(evt.detail), messagesBuilder: this.messagesBuilder, onOpenConfig: (evt) => this.openConfig(evt.detail), resourceID: this.resourceID })));
+    }), this.getContent())), h("snk-configurator", { ref: (ref) => this._snkConfigurator = ref, viewMode: this.getConfigViewMode(), onConfigSelected: (evt) => this.changeConfigViewMode(evt.detail), messagesBuilder: this.messagesBuilder, onOpenConfig: (evt) => this.openConfig(evt.detail), resourceID: this.resourceID, layoutFormConfig: false, disableNumberingConfig: true })));
   }
   render() {
     if (!this.dataUnit || !this._configManager.isLoaded) {

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

@@ -479,7 +479,7 @@ export class SnkGrid {
     return disabledButtons;
   }
   getInvisibleButtons() {
-    var _a, _b;
+    var _a, _b, _c;
     let invisibleButtons = [];
     if (!this._dataUnit || this._dataUnit.records.length === 0)
       invisibleButtons.push(TaskbarElement.DATA_EXPORTER);
@@ -487,6 +487,8 @@ export class SnkGrid {
       invisibleButtons.push(TaskbarElement.ACTIONS_BUTTON);
     if (((_b = this._dataState) === null || _b === void 0 ? void 0 : _b.selectionInfo.length) === 1)
       invisibleButtons.push(TaskbarElement.UPDATE_MULTIPLE);
+    if (!((_c = this._dataState) === null || _c === void 0 ? void 0 : _c.selectionInfo.length))
+      invisibleButtons.push(TaskbarElement.FORM_MODE);
     return invisibleButtons;
   }
   componentWillRender() {

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

@@ -43,7 +43,7 @@ export class SnkLayoutFormConfig {
     return (_a = this.messagesBuilder) === null || _a === void 0 ? void 0 : _a.getMessage(key, params);
   }
   render() {
-    return (h("div", { class: "ez-flex ez-flex--column" }, h("div", { class: "ez-margin-bottom--small" }, h("ez-check", { label: this.getMessage('snkLayoutFormConfig.cascadeLayout.label'), class: "ez-margin-bottom--small", onEzChange: () => this.toggleLayout(FormLayout.CASCADE), value: this.layoutType === FormLayout.CASCADE }), h("snk-view-representation", { mode: FormLayout.CASCADE }), h("label", { class: "ez-label ez-margin--small ez-flex ez-text--medium" }, this.getMessage('snkLayoutFormConfig.cascadeLayout.description'))), h("div", null, h("ez-check", { label: this.getMessage('snkLayoutFormConfig.sideBySideLayout.label'), class: "ez-margin-bottom--small", onEzChange: () => this.toggleLayout(FormLayout.SIDE_BY_SIDE), value: this.layoutType === FormLayout.SIDE_BY_SIDE }), h("snk-view-representation", { mode: FormLayout.SIDE_BY_SIDE }), h("label", { class: "ez-label ez-margin--small ez-flex ez-text--medium" }, this.getMessage('snkLayoutFormConfig.sideBySideLayout.description')))));
+    return (h("div", { class: "ez-flex ez-flex--column" }, h("div", { class: "ez-margin-bottom--small" }, h("ez-check", { label: this.getMessage('snkLayoutFormConfig.cascadeLayout.label'), class: "ez-margin-bottom--small", onEzChange: () => this.toggleLayout(FormLayout.CASCADE), value: this.layoutType === FormLayout.CASCADE }), h("snk-view-representation", { mode: FormLayout.CASCADE }), h("label", { class: "ez-label ez-margin--small ez-flex ez-text--medium" }, this.getMessage('snkLayoutFormConfig.cascadeLayout.description'))), h("div", { class: "ez-margin-bottom--small" }, h("ez-check", { label: this.getMessage('snkLayoutFormConfig.classicCascadeLayout.label'), class: "ez-margin-bottom--small", onEzChange: () => this.toggleLayout(FormLayout.CLASSIC_CASCADE), value: this.layoutType === FormLayout.CLASSIC_CASCADE }), h("snk-view-representation", { mode: FormLayout.CLASSIC_CASCADE }), h("label", { class: "ez-label ez-margin--small ez-flex ez-text--medium" }, this.getMessage('snkLayoutFormConfig.classicCascadeLayout.description'))), h("div", { class: "ez-margin-bottom--small" }, h("ez-check", { label: this.getMessage('snkLayoutFormConfig.sideBySideLayout.label'), class: "ez-margin-bottom--small", onEzChange: () => this.toggleLayout(FormLayout.SIDE_BY_SIDE), value: this.layoutType === FormLayout.SIDE_BY_SIDE }), h("snk-view-representation", { mode: FormLayout.SIDE_BY_SIDE }), h("label", { class: "ez-label ez-margin--small ez-flex ez-text--medium" }, this.getMessage('snkLayoutFormConfig.sideBySideLayout.description'))), h("div", null, h("ez-check", { label: this.getMessage('snkLayoutFormConfig.classicSideBySideLayout.label'), class: "ez-margin-bottom--small", onEzChange: () => this.toggleLayout(FormLayout.CLASSIC_SIDE_BY_SIDE), value: this.layoutType === FormLayout.CLASSIC_SIDE_BY_SIDE }), h("snk-view-representation", { mode: FormLayout.CLASSIC_SIDE_BY_SIDE }), h("label", { class: "ez-label ez-margin--small ez-flex ez-text--medium" }, this.getMessage('snkLayoutFormConfig.classicSideBySideLayout.description')))));
   }
   static get is() { return "snk-layout-form-config"; }
   static get encapsulation() { return "scoped"; }

package/dist/collection/components/snk-layout-form-config/snk-view-representation/snk-view-representation.js

@@ -11,7 +11,7 @@ export class SnkViewRepresentation {
     return (h("div", { class: "svg-container__inline" }, [...Array(2)].map(() => this.renderCascadeLayout())));
   }
   render() {
-    return (h("div", { class: "svg-container ez-margin-left--small" }, h("div", { class: "svg-container__background" }, h("div", { class: "svg-container__header" }, h("div", { class: "svg-container__circle svg-container__circle--red" }), h("div", { class: "svg-container__circle svg-container__circle--yellow" }), h("div", { class: "svg-container__circle svg-container__circle--green" })), this.mode === FormLayout.CASCADE
+    return (h("div", { class: "svg-container ez-margin-left--small" }, h("div", { class: "svg-container__background" }, h("div", { class: "svg-container__header" }, h("div", { class: "svg-container__circle svg-container__circle--red" }), h("div", { class: "svg-container__circle svg-container__circle--yellow" }), h("div", { class: "svg-container__circle svg-container__circle--green" })), (this.mode === FormLayout.CASCADE || this.mode === FormLayout.CLASSIC_CASCADE)
       ? this.renderCascadeLayout()
       : this.renderSideBySideLayout())));
   }

package/dist/collection/lib/message/resources/en-us/snk-crud.msg.js

@@ -4,8 +4,8 @@ export const snkCrudMessages = {
     insert: "Register record",
     update: "Update record",
     clean: "{{ENTITY_NAME}}",
-    newRecord: "New Record"
   },
+  newRecord: "New Record",
   findColumn: "Search fields (Ctrl+F)",
   goBackTitle: "Back",
   guide: {

package/dist/collection/lib/message/resources/en-us/snk-layout-form-config.msg.js

@@ -1,10 +1,18 @@
 export const snkLayoutFormConfigMessages = {
   cascadeLayout: {
-    label: "Cascade layout",
+    label: "Cascade compact layout",
     description: "All fields will be organized in a single column."
   },
+  classicCascadeLayout: {
+    label: "Classic cascade layout",
+    description: "All fields will be organized in a single column with classic style."
+  },
   sideBySideLayout: {
-    label: "Side by side layout",
+    label: "Side by side compact layout",
     description: "All fields will be arranged side by side, automatically adjusting to the screen width."
+  },
+  classicSideBySideLayout: {
+    label: "Classic side by side layout",
+    description: "All fields will be arranged side by side with classic style, automatically adjusting to the screen width."
   }
 };

package/dist/collection/lib/message/resources/es-es/snk-crud.msg.js

@@ -4,8 +4,8 @@ export const snkCrudMessages = {
     insert: "Registrar nuevo",
     update: "Modificar registro",
     clean: "{{ENTITY_NAME}}",
-    newRecord: "Nuevo Registro"
   },
+  newRecord: "Nuevo Registro",
   findColumn: "Buscar campos (Ctrl+F)",
   goBackTitle: "Volver",
   guide: {

package/dist/collection/lib/message/resources/es-es/snk-layout-form-config.msg.js

@@ -3,8 +3,16 @@ export const snkLayoutFormConfigMessages = {
     label: "Diseño en cascada",
     description: "Todos los campos se organizarán en una única columna."
   },
+  classicCascadeLayout: {
+    label: "Diseño clásico en cascada",
+    description: "Todos los campos se organizarán en una única columna con estilo clásico."
+  },
   sideBySideLayout: {
     label: "Diseño lado a lado",
     description: "Todos los campos se dispondrán lado a lado, ajustándose automáticamente al ancho de la pantalla."
+  },
+  classicSideBySideLayout: {
+    label: "Diseño clásico lado a lado",
+    description: "Todos los campos se dispondrán lado a lado con estilo clásico, ajustándose automáticamente al ancho de la pantalla."
   }
 };

package/dist/collection/lib/message/resources/pt-br/snk-configurator.msg.js

@@ -9,6 +9,6 @@ export const snkConfiguratorMessages = {
   labelNumberingConfig: "Configuração de numeração",
   buttons: {
     cancel: "Cancelar",
-    save: "Guardar"
+    save: "Salvar"
   }
 };

package/dist/collection/lib/message/resources/pt-br/snk-crud.msg.js

@@ -4,8 +4,8 @@ export const snkCrudMessages = {
     insert: "Cadastrar registro",
     update: "Alterar registro",
     clean: "{{ENTITY_NAME}}",
-    newRecord: "Novo Registro"
   },
+  newRecord: "Novo Registro",
   findColumn: "Buscar campos (Ctrl+F)",
   goBackTitle: "Voltar",
   guide: {

package/dist/collection/lib/message/resources/pt-br/snk-layout-form-config.msg.js

@@ -1,10 +1,18 @@
 export const snkLayoutFormConfigMessages = {
   cascadeLayout: {
-    label: "Layout em cascata",
+    label: "Layout compacto em cascata",
     description: "Todos os campos serão organizados em uma coluna única."
   },
+  classicCascadeLayout: {
+    label: "Layout clássico em cascata",
+    description: "Todos os campos serão organizados em uma coluna única com estilo clássico."
+  },
   sideBySideLayout: {
-    label: "Layout lado a lado",
+    label: "Layout compacto lado a lado",
     description: "Todos os campos serão dispostos lado a lado, ajustando-se automaticamente à largura da tela."
+  },
+  classicSideBySideLayout: {
+    label: "Layout clássico lado a lado",
+    description: "Todos os campos serão dispostos lado a lado com estilo clássico, ajustando-se automaticamente à largura da tela."
   }
 };