@sankhyalabs/sankhyablocks 9.0.1-rc.1 → 9.1.0-dev.1

package/dist/cjs/{taskbar-elements-ebddaef4.js → taskbar-elements-3b74cd21.js}

@@ -1,8 +1,8 @@
 'use strict';
 
-const index = require('./index-f9e81701.js');
+const index = require('./index-1cf293c1.js');
 const index$2 = require('./index-e3e39724.js');
-const index$1 = require('./index-ab1cfb44.js');
+const index$1 = require('./index-0ad2baeb.js');
 
 exports.TaskbarElement = void 0;
 (function (TaskbarElement) {
@@ -23,6 +23,7 @@ exports.TaskbarElement = void 0;
   TaskbarElement["DATA_EXPORTER"] = "DATA_EXPORTER";
   TaskbarElement["ATTACH"] = "ATTACH";
   TaskbarElement["ACTIONS_BUTTON"] = "ACTIONS_BUTTON";
+  TaskbarElement["UPDATE_MULTIPLE"] = "UPDATE_MULTIPLE";
 })(exports.TaskbarElement || (exports.TaskbarElement = {}));
 exports.AuthorizationElements = void 0;
 (function (AuthorizationElements) {
@@ -62,6 +63,8 @@ const buildElem = (element, className, dataElementId, getTitle, action, isEnable
       return iconButton("sync", element, className, dataElementId, title, action, isEnabled);
     case exports.TaskbarElement.UPDATE:
       return iconButton("edit", element, className, dataElementId, title, action, isEnabled);
+    case exports.TaskbarElement.UPDATE_MULTIPLE:
+      return iconButton("edit-table", element, className, dataElementId, title, action, isEnabled);
     case exports.TaskbarElement.CLONE:
       return iconButton("copy", element, className, dataElementId, title, action, isEnabled);
     case exports.TaskbarElement.REMOVE:
@@ -87,6 +90,9 @@ const buildElem = (element, className, dataElementId, getTitle, action, isEnable
     case exports.TaskbarElement.FORM_MODE:
       return iconButton("list", element, className, dataElementId, title, action, isEnabled);
     case exports.TaskbarElement.CONFIGURATOR:
+      if ((actions === null || actions === void 0 ? void 0 : actions.length) > 0) {
+        return splitButton("settings-inverted", element, className, title, dataElementId, isEnabled, actions, action);
+      }
       return iconButton("settings-inverted", element, className, dataElementId, title, action, isEnabled);
     case exports.TaskbarElement.MORE_OPTIONS:
       return actionButton(element, className, dataElementId, title, isEnabled, actions, action);
@@ -111,6 +117,11 @@ function iconTextButton(iconName, name, className, dataElementId, text, title, a
   return index.h("ez-button", { key: dataElementId, title: title, label: text, size: "small", class: className, "data-taskbar-label": text, "data-taskbar-icon": iconName, "data-taskbar-element": name, "data-element-id": dataElementId, enabled: isEnabled(name), onClick: () => action(name) },
     index.h("ez-icon", { class: "ez-padding-right--small", slot: "leftIcon", iconName: iconName }));
 }
+function splitButton(iconName, element, className, title, dataElementId, isEnabled, actions, action) {
+  return actions && actions.length > 0
+    ? index.h("taskbar-split-button", { iconName: iconName, class: className, key: dataElementId, "data-taskbar-icon": iconName, "data-taskbar-label": title, "data-taskbar-element": element, "data-element-id": dataElementId, enabled: isEnabled(element), actions: actions, title: title, action: () => action(element) })
+    : undefined;
+}
 function actionButton(element, className, dataElementId, title, isEnabled, actions, action) {
   return actions && actions.length > 0
     ? index.h("taskbar-actions-button", { class: className, key: dataElementId, title: title, "data-taskbar-element": element, "data-element-id": dataElementId, enabled: isEnabled(element), actions: actions, onTaskbarActionSelected: (evt) => action(evt.detail.value) })

package/dist/cjs/{field-search-68e34bf4.js → taskbar-processor-2fba34a8.js}

@@ -1,7 +1,5 @@
 'use strict';
 
-const index = require('./index-f9e81701.js');
-
 class TaskbarProcessor {
   constructor(defaultButtons) {
     this._defaultButtons = defaultButtons;
@@ -52,37 +50,4 @@ class TaskbarProcessor {
   }
 }
 
-const EVENT_NAME = 'taskbarActionsOpened';
-const buildFieldSearch = (action, optionLoader, onSelectField) => {
-  return index.h("ez-search", { class: 'ez-actions-button--bottom-padding', canShowError: 'false', showSelectedValue: 'false', showOptionValue: 'false', suppressEmptyOption: 'true', label: action.label, value: '', optionLoader: optionLoader, onEzChange: (evt) => onSelectField(evt.detail), ignoreLimitCharsToSearch: true });
-};
-async function focusOnFieldSerch(field) {
-  requestAnimationFrame(async () => {
-    if (field) {
-      const realElement = field['$elm$'];
-      if (!realElement)
-        return;
-      realElement.value = null;
-      await realElement.setFocus();
-    }
-  });
-}
-const openFieldSearch = async (moreOptions, field) => {
-  if (!moreOptions) {
-    return;
-  }
-  if ((await moreOptions.isOpened())) {
-    await focusOnFieldSerch(field);
-    return;
-  }
-  const eventHandler = () => {
-    focusOnFieldSerch(field);
-    moreOptions.removeEventListener(EVENT_NAME, eventHandler);
-  };
-  moreOptions.addEventListener(EVENT_NAME, eventHandler);
-  await moreOptions.showActions();
-};
-
 exports.TaskbarProcessor = TaskbarProcessor;
-exports.buildFieldSearch = buildFieldSearch;
-exports.openFieldSearch = openFieldSearch;

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

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-f9e81701.js');
+const index = require('./index-1cf293c1.js');
 const core = require('@sankhyalabs/core');
 
 const testePesquisaCss = ":host{display:block}";

package/dist/collection/collection-manifest.json

@@ -32,15 +32,22 @@
     "./components/snk-filter-bar/filter-item/editors/snk-filter-text.js",
     "./components/snk-filter-bar/filter-modal/snk-filter-modal.js",
     "./components/snk-filter-bar/filter-modal/subcomponents/snk-filter-modal-item.js",
+    "./components/snk-filter-bar/filter-modal/subcomponents/snk-default-filter/snk-default-filter.js",
     "./components/snk-filter-field-search/snk-filter-field-search.js",
     "./components/snk-form/snk-form.js",
-    "./components/snk-form-config/subcomponents/snk-tab-config/snk-tab-config.js",
     "./components/snk-form-config/snk-form-config.js",
-    "./components/snk-form-config/subcomponents/snk-config-options/snk-config-options.js",
-    "./components/snk-form-config/subcomponents/snk-field-config/snk-field-config.js",
+    "./components/snk-form-config/config-header/config-header.js",
+    "./components/snk-form-config/config-header/configs-button/configs-button.js",
+    "./components/snk-form-config/field-item/field-item.js",
+    "./components/snk-form-config/field-item/field-config/field-config.js",
+    "./components/snk-form-config/fields-layout/fields-layout.js",
+    "./components/snk-form-config/fields-selector/fields-selector.js",
+    "./components/snk-form-config/guides-configurator/guides-configurator.js",
     "./components/snk-grid/snk-grid.js",
     "./components/snk-grid-config/snk-grid-config.js",
     "./components/snk-grid-config/snk-select-box/snk-select-box.js",
+    "./components/snk-layout-form-config/snk-layout-form-config.js",
+    "./components/snk-layout-form-config/snk-view-representation/snk-view-representation.js",
     "./components/snk-personalized-filter/snk-personalized-filter.js",
     "./components/snk-personalized-filter/subcomponents/snk-expression-group/snk-expression-group.js",
     "./components/snk-personalized-filter/subcomponents/snk-expression-item/snk-expression-item.js",
@@ -54,6 +61,7 @@
     "./components/snk-simple-crud/snk-simple-crud.js",
     "./components/snk-simple-form-config/snk-simple-form-config.js",
     "./components/snk-taskbar/elements/taskbar-actions-button/taskbar-actions-button.js",
+    "./components/snk-taskbar/elements/taskbar-split-button/taskbar-split-button.js",
     "./components/teste-pesquisa/teste-pesquisa.js"
   ],
   "compiler": {
@@ -68,11 +76,6 @@
         "snk-application"
       ]
     },
-    {
-      "components": [
-        "snk-tab-config"
-      ]
-    },
     {
       "components": [
         "snk-configurator"
@@ -118,11 +121,6 @@
         "snk-data-unit"
       ]
     },
-    {
-      "components": [
-        "snk-field-config"
-      ]
-    },
     {
       "components": [
         "snk-grid"
@@ -140,7 +138,6 @@
     },
     {
       "components": [
-        "snk-config-options",
         "snk-form",
         "snk-form-config"
       ]

package/dist/collection/components/snk-application/errorhandler/snk-error-handler.js

@@ -1,4 +1,4 @@
-import { WarningException, WaitingChangeException, ErrorException, ObjectUtils } from "@sankhyalabs/core";
+import { WarningException, WaitingChangeException, ErrorException, ObjectUtils, SilentException } from "@sankhyalabs/core";
 export class SnkErrorHandler {
   constructor(app) {
     this._app = app;
@@ -33,7 +33,10 @@ export class SnkErrorHandler {
     if (exception.errorCode) {
       exception.message += this.buildErrorCodeHTML(exception.errorCode);
     }
-    if (exception instanceof WaitingChangeException) {
+    if (exception instanceof SilentException) {
+      console.warn("SilentException ignorada", exception);
+    }
+    else if (exception instanceof WaitingChangeException) {
       this._app.alert(exception.title, exception.message);
     }
     else if (exception instanceof WarningException) {

package/dist/collection/components/snk-application/search-strategy/exec-prepared-search-plus.js

@@ -0,0 +1,107 @@
+import { ArrayUtils, ElementIDUtils, SearchUtils } from "@sankhyalabs/core";
+import { ObjectUtils } from "@sankhyalabs/core";
+import { StringUtils } from "@sankhyalabs/core";
+const QTD_DETAIL_FIELDS_PREDICTIVE_SEARCH = 6;
+const INVALID_CONTENT_PATTERNS = ['<img', '<svg'];
+const executePreparedSearchPlus = async (mode, argument, options, app, pesquisaFetcher) => {
+  var _a;
+  const mdByName = {};
+  const { entity, entityDescription, criteria, searchOptions, isHierarchyEntity, allowsNonAnalytic } = options;
+  if (mode === "ADVANCED") {
+    return new Promise((accept, reject) => {
+      const pesquisaContent = document.createElement("snk-pesquisa");
+      pesquisaContent[ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME] = `entity_${entity}`;
+      pesquisaContent.entityName = entity;
+      pesquisaContent.argument = argument;
+      pesquisaContent.searchLoader = (text) => pesquisaFetcher.loadAdvancedSearch(entity, text, criteria, searchOptions);
+      pesquisaContent.isHierarchyEntity = isHierarchyEntity;
+      if (isHierarchyEntity) {
+        pesquisaContent.treeLoader = (text) => pesquisaFetcher.loadTree(entity, text, criteria, searchOptions);
+        pesquisaContent.allowsNonAnalytic = allowsNonAnalytic;
+      }
+      pesquisaContent.selectItem = (option) => {
+        accept(option);
+        app.clearPopUpTitle();
+        app.closePopUp();
+      };
+      app.setPopUpTitle(entityDescription);
+      app.showPopUp(pesquisaContent, undefined, undefined, reject);
+    });
+  }
+  else if (mode === "LOAD_DESCRIPTION") {
+    let result = await pesquisaFetcher.loadByCode(entity, argument, criteria, searchOptions);
+    result = ObjectUtils.stringToObject(result.json.$);
+    let descriptionField = result.descriptionField;
+    const option = (_a = result.data) === null || _a === void 0 ? void 0 : _a[0];
+    if (!option) {
+      return {
+        value: argument,
+        label: ""
+      };
+    }
+    return {
+      value: argument,
+      label: option[descriptionField]
+    };
+  }
+  else {
+    let codeValue;
+    let result = await pesquisaFetcher.loadAdvancedSearch(entity, argument, criteria, searchOptions, codeValue);
+    result = ObjectUtils.stringToObject(result.json.$);
+    let descriptionField = result.descriptionField;
+    let pkField = result.pkField;
+    const list = result.data.map((item) => {
+      let fieldsMetadata = filterInvalidFields(result, item, mdByName);
+      let fields = filterMathFields(item['__matchFields'], fieldsMetadata, QTD_DETAIL_FIELDS_PREDICTIVE_SEARCH, mdByName);
+      return buildOptionItem(argument, item, fields, descriptionField, pkField);
+    });
+    return list;
+  }
+};
+const buildOptionItem = (argument, item, fields, descriptionField, pkField) => {
+  var _a;
+  const matchFields = item['__matchFields'];
+  const descriptionValue = (_a = item[descriptionField]) !== null && _a !== void 0 ? _a : "";
+  const pkValue = item[pkField];
+  let searchOption = {
+    value: pkValue,
+    label: descriptionValue,
+    presentationValue: StringUtils.highlightValue(argument, matchFields, pkValue, fields, true),
+    presentationLabel: descriptionField ? StringUtils.highlightValue(argument, matchFields, descriptionValue, fields, true) : "",
+    details: SearchUtils.buildDetails(argument, fields, item)
+  };
+  return searchOption;
+};
+const filterInvalidFields = (resp, item, mdByName) => {
+  let fieldsMetadata = resp.fieldsMetadata.filter((field) => {
+    let accept = !StringUtils.isEmpty(item[field.fieldName]) &&
+      field.visible !== false &&
+      field.type !== 'B' &&
+      resp.pkField !== field.fieldName &&
+      resp.descriptionField !== field.fieldName &&
+      (field.isPrimaryKey || !field.isLinkField) &&
+      !(field.type === 'S' && field.presentationType === 'H');
+    if (accept) {
+      mdByName[field.fieldName] = field;
+    }
+    //Condição que trata o problema de trazer imagem no entityCard na pesquisa de registros
+    if (typeof item[field.fieldName] === 'string' && INVALID_CONTENT_PATTERNS.some(pattern => item[field.fieldName].includes(pattern))) {
+      return false;
+    }
+    return accept;
+  });
+  return fieldsMetadata;
+};
+const filterMathFields = (matchFields, fields, qtyFields, mdByName) => {
+  if (matchFields && Array.isArray(matchFields)) {
+    matchFields.forEach((matchField) => {
+      let fieldMD = ArrayUtils.removeReference(fields, mdByName[matchField]);
+      if (fieldMD) {
+        fields.unshift(fieldMD);
+      }
+    });
+  }
+  fields = fields.slice(0, qtyFields);
+  return fields;
+};
+export default executePreparedSearchPlus;

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

@@ -18,6 +18,9 @@ import { SnkErrorHandler } from "./errorhandler/snk-error-handler";
 import RequestListenerFactory from "./request-listener/RequestListenerFactory";
 import PreloadManager from "../../lib/http/data-fetcher/fetchers/data-unit/cache/PreloadManager";
 import { TEMPLATES_SKELETON } from "../../lib/utils/constants";
+import executePreparedSearchPlus from "./search-strategy/exec-prepared-search-plus";
+import { LayoutFormConfig } from "../../lib/configs/LayoutFormConfig";
+import { FormConfigFetcher } from "../../lib";
 /**
  * É possível customizar as mensagens dos blocos de construção através de um pequeno modulo na estrutura da aplicação:
  * - Criar um arquivo no seguinte caminho: /messages/appmessages.msg.js.
@@ -37,6 +40,8 @@ export class SnkApplication {
     this._pendingActions = new Map;
     this._loadPkParameter = null;
     this._isLoadedByPk = false;
+    this._formConfigFetcher = new FormConfigFetcher();
+    this._LayoutFormConfigSingleton = LayoutFormConfig.getInstance();
     this._applicationReady = false;
     this._templateSkeleton = TEMPLATES_SKELETON.GRID;
     this._activeScrimWindow = false;
@@ -111,6 +116,14 @@ export class SnkApplication {
   async getKeyboardManager() {
     return Promise.resolve(this._keyboardManager);
   }
+  /**
+   * Obtém o notificador de Layout de formulario.
+   *
+   * @return {LayoutFormConfig} the Configurador de Layout do Formulario
+   */
+  async getLayoutFormConfig() {
+    return Promise.resolve(this._LayoutFormConfigSingleton);
+  }
   /**
    * Obtém `true` caso o usuário logado seja o SUP.
    */
@@ -643,7 +656,7 @@ export class SnkApplication {
         searchOptions,
         allowsNonAnalytic
       };
-      return this.executePreparedSearch(mode, argument, options);
+      return (ctxOptions === null || ctxOptions === void 0 ? void 0 : ctxOptions.useSearchPlus) ? this.executePreparedSearchPlus(mode, argument, options) : this.executePreparedSearch(mode, argument, options);
     }
   }
   filterInvalidFields(resp, item, mdByName) {
@@ -687,13 +700,23 @@ export class SnkApplication {
     };
     return exibitionItem;
   }
+  /**
+   * Realiza a pesquisa de registros
+   * Ex.: snk-config-options
+   */
+  async executePreparedSearchPlus(mode, argument, options) {
+    return await this.executePreparedSearch(mode, argument, Object.assign(Object.assign({}, options), { useSearchPlus: true }));
+  }
   /**
    * Obtém as opções em componentes de pesquisa
    * Ex.: snk-config-options
    */
   async executePreparedSearch(mode, argument, options) {
     const mdByName = {};
-    const { entity, entityDescription, criteria, searchOptions, isHierarchyEntity, allowsNonAnalytic } = options;
+    const { entity, entityDescription, criteria, searchOptions, isHierarchyEntity, allowsNonAnalytic, useSearchPlus } = options;
+    if (useSearchPlus) {
+      return executePreparedSearchPlus(mode, argument, options, this, this.pesquisaFetcher);
+    }
     if (mode === "ADVANCED") {
       return new Promise((accept, reject) => {
         const pesquisaContent = document.createElement("snk-pesquisa");
@@ -843,10 +866,10 @@ export class SnkApplication {
       });
     }
   }
-  clearPopUpTitle() {
+  async clearPopUpTitle() {
     this._popUp.ezTitle = "";
   }
-  setPopUpTitle(title) {
+  async setPopUpTitle(title) {
     this._popUp.ezTitle = title;
   }
   async pkChangeListener() {
@@ -1017,6 +1040,9 @@ export class SnkApplication {
     ApplicationContext.setContextValue("__EZUI__SEARCH__OPTION__LOADER__", (searchArgument, fieldName, dataUnit, ctxOptions) => {
       return this.executeSearch(searchArgument, fieldName, dataUnit, ctxOptions);
     });
+    ApplicationContext.setContextValue("__EZUI__SEARCH__PLUS__OPTION__LOADER__", (searchArgument, fieldName, dataUnit, ctxOptions) => {
+      return this.executeSearch(searchArgument, fieldName, dataUnit, Object.assign(Object.assign({}, ctxOptions), { useSearchPlus: true }));
+    });
     ApplicationContext.setContextValue("__EZUI__GRID_LICENSE__", agGridLicense);
     this.registerPkChangeListener();
     ErrorTracking.init();
@@ -1027,6 +1053,12 @@ export class SnkApplication {
     ConfigStorage.preload(this.applicationResourceID, this.configName, legacyConfig);
     document.addEventListener("click", () => Workspace.applicationClick());
     this._waitingAppReady.forEach(resolve => resolve());
+    this.setLayoutFormConfig();
+  }
+  async setLayoutFormConfig() {
+    const response = await this._formConfigFetcher.fetchLayoutFormConfig('formColCfg.' + this.applicationResourceID);
+    const config = isNaN(Number(response === null || response === void 0 ? void 0 : response.config)) ? null : Number(response === null || response === void 0 ? void 0 : response.config);
+    this._LayoutFormConfigSingleton.setConfig(config);
   }
   connectedCallback() {
     this._isBrowserTypeElectron = UserAgentUtils.isElectron();
@@ -1138,10 +1170,7 @@ export class SnkApplication {
       .bind("F1", Workspace.openHelp.bind(this), { description: "Abrir ajuda" });
   }
   removeShortcuts() {
-    this._keyboardManager
-      .unbind("ctrl + g")
-      .unbind("ctrl + d")
-      .unbind("F1");
+    this._keyboardManager.unbindAllShortcutKeys();
   }
   renderLoadingSkeleton() {
     if (!this.enableLockManagerLoadingApp)
@@ -1172,16 +1201,16 @@ export class SnkApplication {
     };
   }
   getSkeletonTemplateGrid() {
-    return (h("div", { class: "loading-hidden", style: this.getLoadingVisibilityStyle() }, h("div", { class: "ez-flex ez-flex--column ez-margin--large ez-margin-top--medium" }, h("div", { class: "ez-margin-bottom--medium" }, h("ez-skeleton", { count: 1, variant: "rect", width: "20%", height: "35px", animation: "progress" })), h("div", { class: "" }, h("ez-skeleton", { count: 1, variant: "rect", width: "70%", height: "25px", animation: "progress" }))), h("div", { class: "ez-flex ez-flex--justify-start skeleton-content-column ez-margin-horizontal--large", style: { height: "calc(-105px + 100vh)" } }, [1, 2, 3, 4].map((_, index) => (h("div", { class: "ez-margin-right--large", key: index, style: { width: "25%" } }, h("ez-skeleton", { count: this.getCountSkeleton(50, 10), variant: "rect", width: "100%", height: "50px", animation: "progress", marginBottom: "10px" })))))));
+    return (h("div", { class: "loading-hidden", style: this.getLoadingVisibilityStyle() }, h("div", { class: "ez-flex ez-flex--column ez-margin--large ez-margin-top--medium" }, h("div", { class: "ez-margin-bottom--medium" }, h("ez-skeleton", { count: 1, variant: "text", width: "20%", height: "35px", animation: "progress" })), h("div", { class: "" }, h("ez-skeleton", { count: 1, variant: "text", width: "70%", height: "25px", animation: "progress" }))), h("div", { class: "ez-flex ez-flex--justify-start skeleton-content-column ez-margin-horizontal--large", style: { height: "calc(-105px + 100vh)" } }, [1, 2, 3, 4].map((_, index) => (h("div", { class: "ez-margin-right--large", key: index, style: { width: "25%" } }, h("ez-skeleton", { count: this.getCountSkeleton(50, 10), variant: "text", width: "100%", height: "50px", animation: "progress", marginBottom: "10px" })))))));
   }
   getSkeletonTemplateGridWithSidebar() {
-    return (h("div", { class: "loading-hidden", style: this.getLoadingVisibilityStyle() }, h("div", { class: "ez-flex ez-flex--column ez-margin--large ez-margin-top--medium" }, h("div", { class: "ez-margin-bottom--medium" }, h("ez-skeleton", { count: 1, variant: "rect", width: "20%", height: "35px", animation: "progress" })), h("div", { class: "" }, h("ez-skeleton", { count: 1, variant: "rect", width: "70%", height: "25px", animation: "progress" }))), h("div", { class: "ez-flex ez-flex--justify-start skeleton-content-column ez-margin-horizontal--large", style: { height: "calc(100vh - 160px)" } }, h("div", { class: "ez-flex ez-flex--column ez-margin-right--large", style: { width: "25%", overflow: "hidden" } }, Array(this.getCountSkeleton(30, 6)).fill(null).map((_, index) => h("ez-skeleton", { key: index, count: 1, variant: "rect", width: this.getSkeletonRandomWidth(), height: "30px", animation: "progress", marginBottom: "10px" }))), h("div", { class: "ez-margin-right--large", style: { width: "75%" } }, h("ez-skeleton", { count: this.getCountSkeleton(50, 10), variant: "rect", width: "100%", height: "50px", animation: "progress", marginBottom: "10px" })))));
+    return (h("div", { class: "loading-hidden", style: this.getLoadingVisibilityStyle() }, h("div", { class: "ez-flex ez-flex--column ez-margin--large ez-margin-top--medium" }, h("div", { class: "ez-margin-bottom--medium" }, h("ez-skeleton", { count: 1, variant: "text", width: "20%", height: "35px", animation: "progress" })), h("div", { class: "" }, h("ez-skeleton", { count: 1, variant: "text", width: "70%", height: "25px", animation: "progress" }))), h("div", { class: "ez-flex ez-flex--justify-start skeleton-content-column ez-margin-horizontal--large", style: { height: "calc(100vh - 160px)" } }, h("div", { class: "ez-flex ez-flex--column ez-margin-right--large", style: { width: "25%", overflow: "hidden" } }, Array(this.getCountSkeleton(30, 6)).fill(null).map((_, index) => h("ez-skeleton", { key: index, count: 1, variant: "text", width: this.getSkeletonRandomWidth(), height: "30px", animation: "progress", marginBottom: "10px" }))), h("div", { class: "ez-margin-right--large", style: { width: "75%" } }, h("ez-skeleton", { count: this.getCountSkeleton(50, 10), variant: "text", width: "100%", height: "50px", animation: "progress", marginBottom: "10px" })))));
   }
   getSkeletonTemplateGridWithPanel() {
-    return (h("div", { class: "loading-hidden", style: this.getLoadingVisibilityStyle() }, h("div", { class: "ez-margin--medium ez-margin-top--medium ez-padding--medium" }, h("ez-skeleton", { count: 1, variant: "rect", width: "70%", height: "25px", animation: "progress" })), h("div", { class: "ez-flex ez-margin--medium ez-margin-top--medium", style: { maxHeight: "calc(-105px + 100vh)", overflow: "hidden" } }, h("div", { class: "", style: { width: "70%", overflow: "hidden" } }, h("div", { class: "ez-padding--medium", style: { height: "50%" } }, h("ez-skeleton", { count: 1, variant: "rect", width: "100%", height: "100%", animation: "progress" })), h("div", { class: "ez-padding--medium", style: {} }, h("ez-skeleton", { count: 1, variant: "rect", width: "250px", height: "25px", animation: "progress" })), h("div", { class: "ez-flex ez-padding--medium", style: { height: "45%" } }, [1, 2].map(() => (h("div", { style: { width: "50%" } }, h("ez-skeleton", { count: 1, variant: "rect", width: "100%", height: "100%", animation: "progress" })))))), h("div", { class: "ez-flex ez-flex--column ez-padding--medium", style: { width: "30%", overflow: "hidden" } }, Array(this.getCountSkeleton(30, 10)).fill(null).map((_, index) => h("ez-skeleton", { key: index, count: 1, variant: "rect", width: "100%", height: "50px", animation: "progress", marginBottom: "10px" }))))));
+    return (h("div", { class: "loading-hidden", style: this.getLoadingVisibilityStyle() }, h("div", { class: "ez-margin--medium ez-margin-top--medium ez-padding--medium" }, h("ez-skeleton", { count: 1, variant: "text", width: "70%", height: "25px", animation: "progress" })), h("div", { class: "ez-flex ez-margin--medium ez-margin-top--medium", style: { maxHeight: "calc(-105px + 100vh)", overflow: "hidden" } }, h("div", { class: "", style: { width: "70%", overflow: "hidden" } }, h("div", { class: "ez-padding--medium", style: { height: "50%" } }, h("ez-skeleton", { count: 1, variant: "text", width: "100%", height: "100%", animation: "progress" })), h("div", { class: "ez-padding--medium", style: {} }, h("ez-skeleton", { count: 1, variant: "text", width: "250px", height: "25px", animation: "progress" })), h("div", { class: "ez-flex ez-padding--medium", style: { height: "45%" } }, [1, 2].map(() => (h("div", { style: { width: "50%" } }, h("ez-skeleton", { count: 1, variant: "text", width: "100%", height: "100%", animation: "progress" })))))), h("div", { class: "ez-flex ez-flex--column ez-padding--medium", style: { width: "30%", overflow: "hidden" } }, Array(this.getCountSkeleton(30, 10)).fill(null).map((_, index) => h("ez-skeleton", { key: index, count: 1, variant: "text", width: "100%", height: "50px", animation: "progress", marginBottom: "10px" }))))));
   }
   getSkeletonTemplateFormWithSidebar() {
-    return (h("div", { class: "loading-hidden", style: this.getLoadingVisibilityStyle() }, h("div", { class: "ez-margin--medium ez-margin-top--medium ez-padding--medium" }, h("ez-skeleton", { count: 1, variant: "rect", width: "70%", height: "25px", animation: "progress" })), h("div", { class: "ez-flex ez-margin--medium ez-margin-top--medium", style: { maxHeight: "calc(-105px + 100vh)", overflow: "hidden" } }, h("div", { class: "ez-flex ez-flex--column ez-margin-right--large", style: { width: "25%", overflow: "hidden" } }, Array(this.getCountSkeleton(30, 6)).fill(null).map((_, index) => h("ez-skeleton", { key: index, count: 1, variant: "rect", width: this.getSkeletonRandomWidth(), height: "30px", animation: "progress", marginBottom: "10px" }))), h("div", { class: "ez-flex ez-flex--column", style: { width: "75%" } }, h("div", { class: "ez-padding--medium", style: { width: "100%" } }, h("ez-skeleton", { count: 1, variant: "rect", width: "30%", height: "25px", animation: "progress" })), h("div", { class: "ez-padding--medium", style: { height: "45%" } }, h("div", { class: "ez-flex", style: { width: "100%", height: "100%" } }, [1, 2, 3, 4].map((_, columnIndex) => (h("div", { key: columnIndex, class: "ez-padding-right--large", style: { width: "25%", overflow: "hidden" } }, Array(this.getCountSkeleton(50, 20)).fill(null).map((_, index) => h("ez-skeleton", { key: index, count: 1, variant: "rect", width: "100%", height: "50px", animation: "progress", marginBottom: "10px" }))))))), h("div", { class: "ez-padding--medium", style: { width: "100%" } }, h("ez-skeleton", { count: 1, variant: "rect", width: "30%", height: "25px", animation: "progress" })), h("div", { class: "ez-padding--medium", style: { height: "45%" } }, h("div", { class: "ez-flex", style: { width: "100%", height: "100%" } }, [1, 2, 3, 4].map((_, columnIndex) => (h("div", { key: columnIndex, class: "ez-padding-right--large", style: { width: "25%", overflow: "hidden" } }, Array(this.getCountSkeleton(50, 20)).fill(null).map((_, index) => h("ez-skeleton", { key: index, count: 1, variant: "rect", width: "100%", height: "50px", animation: "progress", marginBottom: "10px" })))))))))));
+    return (h("div", { class: "loading-hidden", style: this.getLoadingVisibilityStyle() }, h("div", { class: "ez-margin--medium ez-margin-top--medium ez-padding--medium" }, h("ez-skeleton", { count: 1, variant: "text", width: "70%", height: "25px", animation: "progress" })), h("div", { class: "ez-flex ez-margin--medium ez-margin-top--medium", style: { maxHeight: "calc(-105px + 100vh)", overflow: "hidden" } }, h("div", { class: "ez-flex ez-flex--column ez-margin-right--large", style: { width: "25%", overflow: "hidden" } }, Array(this.getCountSkeleton(30, 6)).fill(null).map((_, index) => h("ez-skeleton", { key: index, count: 1, variant: "text", width: this.getSkeletonRandomWidth(), height: "30px", animation: "progress", marginBottom: "10px" }))), h("div", { class: "ez-flex ez-flex--column", style: { width: "75%" } }, h("div", { class: "ez-padding--medium", style: { width: "100%" } }, h("ez-skeleton", { count: 1, variant: "text", width: "30%", height: "25px", animation: "progress" })), h("div", { class: "ez-padding--medium", style: { height: "45%" } }, h("div", { class: "ez-flex", style: { width: "100%", height: "100%" } }, [1, 2, 3, 4].map((_, columnIndex) => (h("div", { key: columnIndex, class: "ez-padding-right--large", style: { width: "25%", overflow: "hidden" } }, Array(this.getCountSkeleton(50, 20)).fill(null).map((_, index) => h("ez-skeleton", { key: index, count: 1, variant: "text", width: "100%", height: "50px", animation: "progress", marginBottom: "10px" }))))))), h("div", { class: "ez-padding--medium", style: { width: "100%" } }, h("ez-skeleton", { count: 1, variant: "text", width: "30%", height: "25px", animation: "progress" })), h("div", { class: "ez-padding--medium", style: { height: "45%" } }, h("div", { class: "ez-flex", style: { width: "100%", height: "100%" } }, [1, 2, 3, 4].map((_, columnIndex) => (h("div", { key: columnIndex, class: "ez-padding-right--large", style: { width: "25%", overflow: "hidden" } }, Array(this.getCountSkeleton(50, 20)).fill(null).map((_, index) => h("ez-skeleton", { key: index, count: 1, variant: "text", width: "100%", height: "50px", animation: "progress", marginBottom: "10px" })))))))))));
   }
   getSpinnerLoadingDefault() {
     return (h("div", { class: "loading-hidden", style: this.getLoadingVisibilityStyle() }, h("div", { class: "ez-flex ez-size-height--full ez-size-width--full ez-flex--justify-center ez-flex--align-items-center spinner" }, h("ez-icon", { iconName: "sync", size: "x-large", class: "spin" }), h("span", { class: "ez-title ez-title--secondary ez-title--extra-large" }, "Carregando..."))));
@@ -1380,6 +1409,29 @@ export class SnkApplication {
             }]
         }
       },
+      "getLayoutFormConfig": {
+        "complexType": {
+          "signature": "() => Promise<LayoutFormConfig>",
+          "parameters": [],
+          "references": {
+            "Promise": {
+              "location": "global"
+            },
+            "LayoutFormConfig": {
+              "location": "import",
+              "path": "../../lib/configs/LayoutFormConfig"
+            }
+          },
+          "return": "Promise<LayoutFormConfig>"
+        },
+        "docs": {
+          "text": "Obt\u00E9m o notificador de Layout de formulario.",
+          "tags": [{
+              "name": "return",
+              "text": "the Configurador de Layout do Formulario"
+            }]
+        }
+      },
       "isUserSup": {
         "complexType": {
           "signature": "() => Promise<boolean>",
@@ -2486,6 +2538,38 @@ export class SnkApplication {
           "tags": []
         }
       },
+      "executePreparedSearchPlus": {
+        "complexType": {
+          "signature": "(mode: string, argument: string, options: any) => Promise<Array<IOption> | IOption>",
+          "parameters": [{
+              "tags": [],
+              "text": ""
+            }, {
+              "tags": [],
+              "text": ""
+            }, {
+              "tags": [],
+              "text": ""
+            }],
+          "references": {
+            "Promise": {
+              "location": "global"
+            },
+            "IOption": {
+              "location": "import",
+              "path": "@sankhyalabs/ezui/dist/types/components/ez-search/ez-search"
+            },
+            "Array": {
+              "location": "global"
+            }
+          },
+          "return": "Promise<IOption | IOption[]>"
+        },
+        "docs": {
+          "text": "Realiza a pesquisa de registros\nEx.: snk-config-options",
+          "tags": []
+        }
+      },
       "executePreparedSearch": {
         "complexType": {
           "signature": "(mode: string, argument: string, options: any) => Promise<Array<IOption> | IOption>",
@@ -2745,6 +2829,41 @@ export class SnkApplication {
             }]
         }
       },
+      "clearPopUpTitle": {
+        "complexType": {
+          "signature": "() => Promise<void>",
+          "parameters": [],
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
+          },
+          "return": "Promise<void>"
+        },
+        "docs": {
+          "text": "",
+          "tags": []
+        }
+      },
+      "setPopUpTitle": {
+        "complexType": {
+          "signature": "(title: string) => Promise<void>",
+          "parameters": [{
+              "tags": [],
+              "text": ""
+            }],
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
+          },
+          "return": "Promise<void>"
+        },
+        "docs": {
+          "text": "",
+          "tags": []
+        }
+      },
       "showScrimApp": {
         "complexType": {
           "signature": "(active: boolean) => Promise<void>",

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

@@ -11,6 +11,7 @@ export class SnkConfigurator {
     this.resourceID = undefined;
     this.viewMode = VIEW_MODE.GRID;
     this.customContainerId = undefined;
+    this.layoutFormConfig = false;
     this.messagesBuilder = undefined;
   }
   /**
@@ -71,6 +72,12 @@ export class SnkConfigurator {
     var _a;
     return (_a = this.messagesBuilder) === null || _a === void 0 ? void 0 : _a.getMessage(key, {});
   }
+  handleSave() {
+    if (this.layoutFormConfig) {
+      this._snkLayoutFormConfig.save();
+    }
+    this.save.emit();
+  }
   componentWillLoad() {
     this._application = ApplicationContext.getContextValue('__SNK__APPLICATION__');
     if (this._application) {
@@ -94,7 +101,7 @@ export class SnkConfigurator {
     insideCustomElementsContainer === null || insideCustomElementsContainer === void 0 ? void 0 : insideCustomElementsContainer.appendChild(configuratorCustomElement);
   }
   render() {
-    return (h("ez-modal", { ref: (element) => (this.modal = element), opened: this._opened, "close-esc": false, "close-outside-click": false, "modal-size": "small", scrim: "light" }, h("div", { class: "snk-configurator" }, h("div", { class: "snk-configurator__header" }, h("label", { class: "snk-configurator__title" }, this.getMessage('snkConfigurator.titleConfigurations')), h("div", { class: "snk-configurator__button-close" }, h("ez-button", { mode: "icon", iconName: "close", size: "medium", onClick: () => this.closeConfig() }))), h("div", { class: "snk-configurator__main" }, h("ez-collapsible-box", { boxBordered: true, label: "Modo de visualiza\u00E7\u00E3o ", headerSize: "medium", class: "snk-configurator__collapsable-box" }, h("ez-radio-button", { value: this.getViewModeValue().toString(), onEzChange: (evt) => this.onViewModeChanged(evt), enabled: this.enableModeConfig() }, h("ez-radio-button-option", { label: this.getMessage('snkConfigurator.labelGrid'), value: VIEW_MODE.GRID }), h("ez-radio-button-option", { label: this.getMessage('snkConfigurator.labelForm'), value: VIEW_MODE.FORM })), h("div", { class: "snk-configurator__collsable-box-action" }, h("ez-button", { label: this.viewMode === VIEW_MODE.GRID ? this.getMessage('snkConfigurator.labelConfigGrid') : this.getMessage('snkConfigurator.labelConfigForm'), class: "snk-configurator__button-config ez-button--secondary", onClick: () => this.onClickOpenConfig(), id: "openConfigurator" }))), h("div", { id: "slotContainer", class: "snk-configurator__outline" })), this.showActionButtons && (h("div", { class: "snk-configurator__action-buttons" }, h("ez-button", { label: "Cancelar", onClick: () => this.cancel.emit() }), h("ez-button", { label: "Salvar", onClick: () => this.save.emit(), class: "ez-button--primary" }))))));
+    return (h("ez-modal", { ref: (element) => (this.modal = element), opened: this._opened, "close-esc": false, "close-outside-click": false, "modal-size": "small", scrim: "light" }, h("div", { class: "snk-configurator" }, h("div", { class: "snk-configurator__header" }, h("label", { class: "snk-configurator__title" }, this.getMessage('snkConfigurator.titleConfigurations')), h("div", { class: "snk-configurator__button-close" }, h("ez-button", { mode: "icon", iconName: "close", size: "medium", onClick: () => this.closeConfig() }))), h("div", { class: "snk-configurator__main" }, h("ez-collapsible-box", { boxBordered: true, label: "Modo de visualiza\u00E7\u00E3o ", headerSize: "medium", class: "snk-configurator__collapsable-box" }, h("ez-radio-button", { value: this.getViewModeValue().toString(), onEzChange: (evt) => this.onViewModeChanged(evt), enabled: this.enableModeConfig() }, h("ez-radio-button-option", { label: this.getMessage('snkConfigurator.labelGrid'), value: VIEW_MODE.GRID }), h("ez-radio-button-option", { label: this.getMessage('snkConfigurator.labelForm'), value: VIEW_MODE.FORM })), h("div", { class: "snk-configurator__collsable-box-action" }, h("ez-button", { label: this.viewMode === VIEW_MODE.GRID ? this.getMessage('snkConfigurator.labelConfigGrid') : this.getMessage('snkConfigurator.labelConfigForm'), class: "snk-configurator__button-config ez-button--secondary", onClick: () => this.onClickOpenConfig(), id: "openConfigurator" }))), this.layoutFormConfig && h("ez-collapsible-box", { boxBordered: true, value: true, label: "Layout do formul\u00E1rio", headerSize: "medium", class: "snk-configurator__collapsable-box  ez-margin-top--medium" }, h("div", { class: 'ez-flex ez-flex--column ez-size-width--full' }, h("snk-layout-form-config", { ref: (ref) => this._snkLayoutFormConfig = ref }))), h("div", { id: "slotContainer", class: "snk-configurator__outline" })), this.showActionButtons && (h("div", { class: "snk-configurator__action-buttons" }, h("ez-button", { label: "Cancelar", onClick: () => this.cancel.emit() }), h("ez-button", { label: "Salvar", onClick: () => this.handleSave(), class: "ez-button--primary" }))))));
   }
   static get is() { return "snk-configurator"; }
   static get encapsulation() { return "scoped"; }
@@ -202,6 +209,24 @@ export class SnkConfigurator {
         "attribute": "custom-container-id",
         "reflect": false
       },
+      "layoutFormConfig": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Define se o LayoutFormConfig ser\u00E1 exibido no configurador."
+        },
+        "attribute": "layout-form-config",
+        "reflect": false,
+        "defaultValue": "false"
+      },
       "messagesBuilder": {
         "type": "unknown",
         "mutable": true,