@sankhyalabs/sankhyablocks 8.16.0-dev.10 → 8.16.0-dev.100

package/dist/esm/{snk-actions-button_4.entry.js → snk-actions-button_7.entry.js}

@@ -1,20 +1,20 @@
 import { r as registerInstance, h, H as Host, g as getElement, c as createEvent } from './index-a7d3d3f1.js';
-import { ApplicationContext, StringUtils, ErrorException, WarningException, ObjectUtils, DateUtils, ArrayUtils, ElementIDUtils } from '@sankhyalabs/core';
-import { D as DataFetcher } from './DataFetcher-c1baf61d.js';
+import { ApplicationContext, StringUtils, ErrorException, WarningException, ObjectUtils, DateUtils, ServiceUtils, StorageType, ArrayUtils, ElementIDUtils } from '@sankhyalabs/core';
+import { D as DataFetcher } from './DataFetcher-88e56266.js';
 import { P as ParamType } from './ParamType-d5152b06.js';
-import './pesquisa-fetcher-03c8f919.js';
-import './index-3aa4977a.js';
-import './ISave-d8c8bc59.js';
+import './ISave-5efafc97.js';
+import './index-b40568ff.js';
 import '@sankhyalabs/ezui/dist/collection/utils/constants';
 import '@sankhyalabs/core/dist/dataunit/metadata/UnitMetadata';
-import './dataunit-fetcher-264191b2.js';
+import './dataunit-fetcher-1d02ecfc.js';
 import './filter-item-type.enum-d45e026f.js';
-import './form-config-fetcher-30fb808f.js';
+import { F as FormConfigFetcher } from './form-config-fetcher-fa208a6c.js';
+import { O as ORDER_VALUES } from './constants-7db1128a.js';
+import { g as getSelectedRecordsIDsInfo } from './GetSelectedRecordsIDsInfo-9fa41508.js';
 import { R as ResourceIDUtils } from './ResourceIDUtils-a114189a.js';
-import { ApplicationUtils, DialogType } from '@sankhyalabs/ezui/dist/collection/utils';
+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-3806514e.js';
-import { O as ORDER_VALUES } from './constants-8457af36.js';
+import { C as ConfigStorage } from './ConfigStorage-71e6766f.js';
 import './PrintUtils-3e4ff0f5.js';
 import '@sankhyalabs/ezui/dist/collection/components/ez-grid/utils';
 import '@sankhyalabs/core/dist/utils/SortingUtils';
@@ -169,7 +169,6 @@ var RefreshType;
 
 const MASTER_ROW_PROPERTY = "__MASTER_ROW__";
 const ENTITY_NAME_PROPERTY = '__ENTITY_NAME__';
-const NUFIN_COLUMN = 'NUFIN';
 const SERVICE_GET_CONFIGURATIONS = 'SystemUtilsSP.getConf';
 class Actions {
   constructor(actionsExecuteInterface, dataUnit, appResourceId) {
@@ -181,6 +180,10 @@ class Actions {
     this._application = ApplicationContext.getContextValue("__SNK__APPLICATION__");
     this._appResourceId = appResourceId;
   }
+  getPrimaryKeys() {
+    const ids = getSelectedRecordsIDsInfo(this._dataUnit);
+    return ids.map(({ name }) => name);
+  }
   apply(action, hasParamsToSave) {
     this._application.closePopUp();
     this._actionsExecuteInterface.execute(action, this._dataUnit)
@@ -247,9 +250,9 @@ class Actions {
       return resultParams;
     });
   }
-  actionExecute(execSource, callback) {
+  async actionExecute(execSource, callback) {
     execSource.virtualPage = this.buildVirtualPage();
-    this.prepareAndExecute(execSource, callback);
+    await this.prepareAndExecute(execSource, callback);
     this.recordsReloader(execSource.refreshType);
   }
   resolvePromptParams(action, execSource, hasParamsToSave) {
@@ -444,11 +447,12 @@ class Actions {
   async buildResourceId(actionId) {
     return this._appResourceId + '.actionconfig.' + actionId;
   }
-  prepareAndExecute(execSource, executeAction) {
+  async prepareAndExecute(execSource, executeAction) {
     this.addRows(execSource);
-    executeAction(execSource);
+    await executeAction(execSource);
   }
   addRows(execSource) {
+    const primaryKeys = this.getPrimaryKeys();
     const rows = {
       row: []
     };
@@ -462,15 +466,13 @@ class Actions {
         delete sourceRow[MASTER_ROW_PROPERTY];
         delete sourceRow[ENTITY_NAME_PROPERTY];
       }
-      for (const fieldName in sourceRow) {
-        if (fieldName !== NUFIN_COLUMN)
-          continue;
-        if (!row.field) {
-          row.field = [];
-        }
+      if (!row.field) {
+        row.field = [];
+      }
+      for (const primaryKey of primaryKeys) {
         row.field.push({
-          fieldName: fieldName,
-          $: sourceRow[fieldName]
+          fieldName: primaryKey,
+          $: sourceRow[primaryKey]
         });
       }
       rows.row.push(row);
@@ -602,6 +604,7 @@ const SnkActionsButton = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
     this.CLIENT_EVENT_CONFIRM_NAME = "br.com.sankhya.actionbutton.clientconfirm";
+    this._actions = [];
     this.handleClick = (evt) => {
       const selectedAction = this._actions.find((action) => action.actionID == evt.detail.id);
       const executor = new ExecutorFactory(selectedAction.type).executor;
@@ -611,27 +614,22 @@ const SnkActionsButton = class {
     };
     this._items = [];
     this._showDropdown = false;
-    this._actions = [];
-    this._isOrderActions = false;
   }
   async getActions() {
-    let param = {
-      param: {
-        entityName: this._entityName,
-        resourceID: this._resourceID
-      }
-    };
-    return DataFetcher.get().callServiceBroker('ActionButtonsSP.getActions', param).then((result) => {
+    const actions = await ServiceUtils.useCacheWithService(`SnkActionsButton_${this._entityName}-${this._resourceID}`, async () => {
       var _a;
-      if (!((_a = result.actions) === null || _a === void 0 ? void 0 : _a.action))
-        return;
-      if (this._isOrderActions) {
-        this._actions = ArrayUtils.sortAlphabetically(result.actions.action, 'description');
-      }
-      else {
-        this._actions = result.actions.action;
-      }
-    });
+      const param = {
+        param: {
+          entityName: this._entityName,
+          resourceID: this._resourceID,
+        },
+      };
+      const result = await DataFetcher.get().callServiceBroker('ActionButtonsSP.getActions', param);
+      return ((_a = result.actions) === null || _a === void 0 ? void 0 : _a.action) || [];
+    }, StorageType.IN_MEMORY_CACHE);
+    this._actions = SnkActionsButton.parameters.isOrderActions
+      ? ArrayUtils.sortAlphabetically(actions, 'description')
+      : actions;
   }
   controlDropdown() {
     this._showDropdown = !this._showDropdown;
@@ -664,7 +662,7 @@ const SnkActionsButton = class {
   }
   async componentWillLoad() {
     this._application = ApplicationContext.getContextValue("__SNK__APPLICATION__");
-    this._isOrderActions = await this._application.getBooleanParam('global.ordenar.acoes.personalizadas');
+    await this.loadParameters();
     const snkDataUnit = this._element.parentElement;
     this._dataUnit = snkDataUnit === null || snkDataUnit === void 0 ? void 0 : snkDataUnit.dataUnit;
     this._resourceID = snkDataUnit === null || snkDataUnit === void 0 ? void 0 : snkDataUnit.resourceID;
@@ -673,9 +671,8 @@ const SnkActionsButton = class {
       this._resourceID = await ResourceIDUtils.getResourceID();
     }
     this.setEvents();
-    this.getActions().then(() => {
-      this.loadItems();
-    });
+    await this.getActions();
+    this.loadItems();
   }
   async componentDidLoad() {
     if (!this._element)
@@ -702,6 +699,11 @@ const SnkActionsButton = class {
       [ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME]: ElementIDUtils.getInternalIDInfo(sufix)
     };
   }
+  async loadParameters() {
+    if (SnkActionsButton.parameters.isOrderActions != null)
+      return;
+    SnkActionsButton.parameters.isOrderActions = await this._application.getBooleanParam('global.ordenar.acoes.personalizadas');
+  }
   render() {
     return (h(Host, null, (this._actions && this._actions.length > 0) &&
       (h("div", { class: `ez-padding-left--medium snk-actions-button
@@ -715,9 +717,12 @@ const SnkActionsButton = class {
   }
   get _element() { return getElement(this); }
 };
+SnkActionsButton.parameters = {
+  isOrderActions: null
+};
 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--medium, 12px);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: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 SnkGridConfig = class {
   constructor(hostRef) {
@@ -976,6 +981,7 @@ const SnkGridConfig = class {
           delete _newColumnConfig.ascending;
           _newColumnConfig.orderIndex = 0;
         }
+        _newColumnConfig.configVersion = SnkGridConfig.CURRENT_CONFIG_VERSION;
         _newColumnConfigList.push(_newColumnConfig);
       }
     });
@@ -1208,8 +1214,46 @@ const SnkGridConfig = class {
   static get assetsDirs() { return ["../assets"]; }
   get _element() { return getElement(this); }
 };
+SnkGridConfig.CURRENT_CONFIG_VERSION = 1;
 SnkGridConfig.style = snkGridConfigCss;
 
+const snkLayoutFormConfigCss = ".sc-snk-layout-form-config-h{display:block}";
+
+const FORM_COL_CONFIG_PREFIX = 'formColCfg.';
+const SnkLayoutFormConfig = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this._formConfigFetcher = new FormConfigFetcher();
+    this.layoutType = FormLayout.CASCADE;
+  }
+  /**
+   * 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 = 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;
+    this.layoutType = Number(config) in FormLayout ? Number(config) : FormLayout.CASCADE;
+  }
+  toggleLayout(key) {
+    this.layoutType = key;
+  }
+  render() {
+    return (h("div", { class: "ez-flex ez-flex--column" }, h("div", { class: "ez-margin-bottom--small" }, h("ez-check", { label: "Layout em cascata", 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" }, "Todos os campos ser\u00E3o organizados em uma coluna \u00FAnica.")), h("div", null, h("ez-check", { label: "Layout lado a lado", 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" }, "Todos os campos ser\u00E3o dispostos lado a lado, ajustando-se automaticamente \u00E0 largura da tela."))));
+  }
+};
+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 SelectBox = class {
@@ -1227,6 +1271,116 @@ 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 SnkSimpleFormConfig = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.snkConfigSaved = createEvent(this, "snkConfigSaved", 7);
+    this._formConfigFetcher = new FormConfigFetcher();
+    this.fieldsToSave = [];
+    this.dataUnit = undefined;
+    this.configName = undefined;
+    this.avaliableFields = [];
+    this.selectedFields = [];
+  }
+  /**
+   * Responsável por abrir o configurador.
+   */
+  async show() {
+    var _a;
+    await ((_a = this.ezDoubleListRef) === null || _a === void 0 ? void 0 : _a.resetSelectedLists());
+    await this.initializeFormConfig();
+    this.ezPopupRef.opened = true;
+  }
+  ;
+  async initializeFormConfig() {
+    if (!this.configName)
+      return;
+    const allFields = this.getAllVisibleFieldsFromDataUnit();
+    const displayedFieldNameList = await this.getConfig();
+    //Quando não retorna dados, é por quê não existe configuração do usuário salva.
+    if (displayedFieldNameList.length === 0) {
+      this.avaliableFields = [];
+      this.selectedFields = [...allFields];
+      this.fieldsToSave = [...this.selectedFields];
+      return;
+    }
+    const selectedFieldsAux = this.sortDisplayedFields(displayedFieldNameList, allFields);
+    const avaliableFieldsAux = allFields.filter(field => !displayedFieldNameList.includes(field.id));
+    this.avaliableFields = [...avaliableFieldsAux];
+    this.selectedFields = [...selectedFieldsAux];
+    this.fieldsToSave = [...this.selectedFields];
+  }
+  async getConfig() {
+    const fieldList = await this._formConfigFetcher.fetchSimpleFormConfig(this.configName);
+    return [...this.removeDuplicates(fieldList)];
+  }
+  removeDuplicates(strings) {
+    return strings.filter((item, index) => strings.indexOf(item) === index);
+  }
+  sortDisplayedFields(displayedFieldNameList, allFields) {
+    const selectedFieldsAux = [];
+    //É preciso garantir a ordem na qual os campos vieram na resposta do fetchSimpleFormConfig.
+    displayedFieldNameList.forEach(fieldName => {
+      const field = allFields.find(field => field.id === fieldName);
+      if (!field)
+        return;
+      selectedFieldsAux.push(field);
+    });
+    return selectedFieldsAux;
+  }
+  getAllVisibleFieldsFromDataUnit() {
+    var _a, _b, _c;
+    const visibleFields = ((_c = (_b = (_a = this.dataUnit) === null || _a === void 0 ? void 0 : _a.metadata) === null || _b === void 0 ? void 0 : _b.fields) !== null && _c !== void 0 ? _c : []).filter(field => field.visible);
+    return visibleFields.map(field => {
+      return { id: field.name, label: field.label };
+    });
+  }
+  close() {
+    this.ezPopupRef.opened = false;
+  }
+  async handleResetConfigs() {
+    await this._formConfigFetcher.restoreFormConfig(this.configName);
+    await this.initializeFormConfig();
+    await this.handleSave();
+  }
+  handleCancel() {
+    this.close();
+  }
+  async handleSave() {
+    const saveList = this.fieldsToSave.map(field => field.id);
+    await this._formConfigFetcher.saveSimpleFormConfig(this.configName, saveList);
+    this.close();
+    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' })))));
+  }
+};
+SnkSimpleFormConfig.style = snkSimpleFormConfigCss;
+
+const snkViewRepresentationCss = ".sc-snk-view-representation-h{display:block}.svg-container.sc-snk-view-representation{display:flex;width:185px;height:125px;border-radius:8px;background-color:#f7f7f7;padding:10px 12px;box-sizing:border-box;position:relative}.svg-container__background.sc-snk-view-representation{display:flex;flex-direction:column;width:100%}.svg-container__header.sc-snk-view-representation{display:flex;gap:2px;margin-bottom:12px}.svg-container__circle.sc-snk-view-representation{width:9px;height:9px;border-radius:50%}.svg-container__circle--red.sc-snk-view-representation{background-color:#ed7678}.svg-container__circle--yellow.sc-snk-view-representation{background-color:#eddb76}.svg-container__circle--green.sc-snk-view-representation{background-color:#7ad08e}.svg-container__section.sc-snk-view-representation{width:100%}.svg-container__collumn.sc-snk-view-representation{width:100%;display:flex;flex-direction:column}.svg-container__inline.sc-snk-view-representation{display:flex;flex-direction:row;gap:6px}.svg-container__line.sc-snk-view-representation{height:13px;border-radius:4px;background-color:#d9d9d9;margin-bottom:4px}.svg-container__line--short.sc-snk-view-representation{width:39.68px;height:7px;border-radius:3.5px}.svg-container__line--long.sc-snk-view-representation{width:100%}";
+
+const SnkViewRepresentation = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.mode = FormLayout.SIDE_BY_SIDE;
+  }
+  renderCascadeLayout() {
+    return (h("div", { class: "svg-container__collumn" }, [...Array(3)].map(() => (h("div", { class: "svg-container__section" }, h("div", { class: "svg-container__line svg-container__line--short" }), h("div", { class: "svg-container__line svg-container__line--long" }))))));
+  }
+  renderSideBySideLayout() {
+    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
+      ? this.renderCascadeLayout()
+      : this.renderSideBySideLayout())));
+  }
+};
+SnkViewRepresentation.style = snkViewRepresentationCss;
+
 const taskbarActionsButtonCss = ".sc-taskbar-actions-button-h{display:flex;width:fit-content;height:fit-content}";
 
 const TaskbarActionsButton = class {
@@ -1358,4 +1512,4 @@ const TaskbarActionsButton = class {
 };
 TaskbarActionsButton.style = taskbarActionsButtonCss;
 
-export { SnkActionsButton as snk_actions_button, SnkGridConfig as snk_grid_config, SelectBox as snk_select_box, TaskbarActionsButton as taskbar_actions_button };
+export { SnkActionsButton as snk_actions_button, SnkGridConfig as snk_grid_config, SnkLayoutFormConfig as snk_layout_form_config, SelectBox as snk_select_box, SnkSimpleFormConfig as snk_simple_form_config, SnkViewRepresentation as snk_view_representation, TaskbarActionsButton as taskbar_actions_button };