@sankhyalabs/sankhyablocks 10.1.0-dev.5 → 10.1.0-dev.51

package/dist/cjs/taskbar-elements-80eddec8.js

@@ -0,0 +1,152 @@
+'use strict';
+
+const index = require('./index-1894343a.js');
+const index$2 = require('./index-e3e39724.js');
+const index$1 = require('./index-f0fe7e6e.js');
+
+exports.TaskbarElement = void 0;
+(function (TaskbarElement) {
+  TaskbarElement["PREVIOUS"] = "PREVIOUS";
+  TaskbarElement["NEXT"] = "NEXT";
+  TaskbarElement["REFRESH"] = "REFRESH";
+  TaskbarElement["UPDATE"] = "UPDATE";
+  TaskbarElement["CLONE"] = "CLONE";
+  TaskbarElement["REMOVE"] = "REMOVE";
+  TaskbarElement["INSERT"] = "INSERT";
+  TaskbarElement["CANCEL"] = "CANCEL";
+  TaskbarElement["SAVE"] = "SAVE";
+  TaskbarElement["GRID_MODE"] = "GRID_MODE";
+  TaskbarElement["FORM_MODE"] = "FORM_MODE";
+  TaskbarElement["MORE_OPTIONS"] = "MORE_OPTIONS";
+  TaskbarElement["DIVIDER"] = "DIVIDER";
+  TaskbarElement["SPACER"] = "SPACER";
+  TaskbarElement["CONFIGURATOR"] = "CONFIGURATOR";
+  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) {
+  AuthorizationElements["UPDATE"] = "UPDATE";
+  AuthorizationElements["CLONE"] = "CLONE";
+  AuthorizationElements["REMOVE"] = "REMOVE";
+  AuthorizationElements["INSERT"] = "INSERT";
+  AuthorizationElements["CONFIGURATOR"] = "CONFIGURATOR";
+})(exports.AuthorizationElements || (exports.AuthorizationElements = {}));
+exports.VisibleWhenForbidden = void 0;
+(function (VisibleWhenForbidden) {
+  VisibleWhenForbidden["CONFIGURATOR"] = "CONFIGURATOR";
+})(exports.VisibleWhenForbidden || (exports.VisibleWhenForbidden = {}));
+const buildCustomButton = ({ def, className, dataElementId, action, isEnabled, size }) => {
+  const { hint, text, iconName } = def;
+  if (iconName) {
+    if (text) {
+      return iconTextButton({ iconName, element: def.name, className, dataElementId, title: hint, action, isEnabled, size });
+    }
+    else {
+      return iconButton({ iconName, element: def.name, className, dataElementId, title: hint, action, isEnabled, size });
+    }
+  }
+  else {
+    return textButton({ element: def.name, className, dataElementId, title: hint, action, isEnabled, size });
+  }
+};
+const buildElem = ({ element, className, dataElementId, getTitle, action, isEnabled, actions, dataExporterStoreKey, presentationMode, variant, size }) => {
+  var _a, _b;
+  const title = getTitle(element);
+  const propertiesItem = {
+    element, className, dataElementId, title, action, isEnabled, actions, variant, size
+  };
+  switch (element) {
+    case exports.TaskbarElement.PREVIOUS:
+      return iconButton(Object.assign({ iconName: "chevron-left" }, propertiesItem));
+    case exports.TaskbarElement.NEXT:
+      return iconButton(Object.assign({ iconName: "chevron-right" }, propertiesItem));
+    case exports.TaskbarElement.REFRESH:
+      return iconButton(Object.assign({ iconName: "sync" }, propertiesItem));
+    case exports.TaskbarElement.UPDATE:
+      return iconButton(Object.assign({ iconName: "edit" }, propertiesItem));
+    case exports.TaskbarElement.UPDATE_MULTIPLE:
+      return iconButton(Object.assign({ iconName: "edit-table" }, propertiesItem));
+    case exports.TaskbarElement.CLONE:
+      return iconButton(Object.assign({ iconName: "copy" }, propertiesItem));
+    case exports.TaskbarElement.REMOVE:
+      return iconButton(Object.assign({ iconName: "delete" }, propertiesItem));
+    case exports.TaskbarElement.INSERT:
+      if (presentationMode === index$2.PresentationMode.PRIMARY) {
+        return textButton(Object.assign({}, propertiesItem));
+      }
+      else {
+        return iconButton(Object.assign({ iconName: "plus" }, propertiesItem));
+      }
+    case exports.TaskbarElement.CANCEL:
+      return textButton(Object.assign({}, propertiesItem));
+    case exports.TaskbarElement.SAVE:
+      if (presentationMode === index$2.PresentationMode.PRIMARY) {
+        return iconTextButton(Object.assign(Object.assign({ iconName: "save" }, propertiesItem), { variant: "primary" }));
+      }
+      else {
+        return iconButton(Object.assign(Object.assign({ iconName: "save" }, propertiesItem), { variant: "primary" }));
+      }
+    case exports.TaskbarElement.GRID_MODE:
+      return iconButton(Object.assign({ iconName: "table" }, propertiesItem));
+    case exports.TaskbarElement.FORM_MODE:
+      return iconButton(Object.assign({ iconName: "list" }, propertiesItem));
+    case exports.TaskbarElement.CONFIGURATOR:
+      if ((actions === null || actions === void 0 ? void 0 : actions.length) > 0) {
+        return splitButton(Object.assign({ iconName: "settings-inverted" }, propertiesItem));
+      }
+      return iconButton(Object.assign({ iconName: "settings-inverted" }, propertiesItem));
+    case exports.TaskbarElement.MORE_OPTIONS:
+      const definedActions = (_a = actions === null || actions === void 0 ? void 0 : actions.filter(a => a !== undefined)) !== null && _a !== void 0 ? _a : [];
+      return actionButton(Object.assign(Object.assign({}, propertiesItem), { actions: definedActions }));
+    case exports.TaskbarElement.DIVIDER:
+      return index.h("hr", { class: "ez-divider-vertical ez-divider--dark ez-margin--none ez-margin-left--medium", "data-taskbar-divider": true });
+    case exports.TaskbarElement.DATA_EXPORTER:
+      const provider = (_b = index$1.store.get("exporterProviders")) === null || _b === void 0 ? void 0 : _b[dataExporterStoreKey];
+      return index.h("snk-data-exporter", { class: className, provider: provider, "data-element-id": dataElementId, "data-taskbar-element": element, size: size });
+    case exports.TaskbarElement.ATTACH:
+      return iconButton(Object.assign({ iconName: "anexo" }, propertiesItem));
+    case exports.TaskbarElement.ACTIONS_BUTTON:
+      return index.h("snk-actions-button", { "data-element-id": dataElementId, "data-taskbar-element": element, class: className, size: size });
+  }
+};
+function textButton({ action, className, dataElementId, title, element, isEnabled, variant, size }) {
+  return (index.h("ez-tooltip", { key: dataElementId, message: title, class: className },
+    index.h("ez-button", { label: title, "data-taskbar-label": title, "data-taskbar-element": element, "data-element-id": dataElementId, isDisabled: !isEnabled(element), onClick: () => action(element), variant: variant, size: size })));
+}
+function concatClass(className) {
+  if (typeof className === "string") {
+    return className;
+  }
+  else {
+    return Object.keys(className).filter(key => className[key]).join(" ");
+  }
+}
+function iconButton({ iconName, element, className, dataElementId, title, action, isEnabled, variant, size }) {
+  return (index.h("ez-tooltip", { key: dataElementId, message: title, class: {
+      [concatClass(className)]: true,
+      [`icon-button--${size}`]: true
+    } },
+    index.h("ez-button", { mode: "icon", "data-taskbar-label": title, "data-taskbar-element": element, "data-taskbar-icon": iconName, "data-element-id": dataElementId, iconName: iconName, isDisabled: !isEnabled(element), onClick: () => action(element), variant: variant, size: size })));
+}
+function iconTextButton({ iconName, element, className, dataElementId, title, action, isEnabled, variant, size }) {
+  return (index.h("ez-tooltip", { key: dataElementId, message: title, class: className },
+    index.h("ez-button", { label: title, "data-taskbar-label": title, "data-taskbar-icon": iconName, "data-taskbar-element": element, "data-element-id": dataElementId, isDisabled: !isEnabled(element), onClick: () => action(element), variant: variant, size: size },
+      index.h("ez-icon", { class: "ez-padding-right--small", slot: "leftIcon", iconName: iconName }))));
+}
+function splitButton({ iconName, element, className, title, dataElementId, isEnabled, actions, action, size }) {
+  return actions && actions.length > 0
+    ?
+      index.h("taskbar-split-button", { key: dataElementId, class: className, iconName: iconName, "data-taskbar-icon": iconName, "data-taskbar-label": title, title: title, "data-taskbar-element": element, "data-element-id": dataElementId, enabled: isEnabled(element), actions: actions, action: () => action(element), size: size })
+    : undefined;
+}
+function actionButton({ element, className, dataElementId, title, isEnabled, actions, action, size }) {
+  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), size: size })
+    : undefined;
+}
+
+exports.buildCustomButton = buildCustomButton;
+exports.buildElem = buildElem;

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

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

package/dist/collection/collection-manifest.json

@@ -13,10 +13,12 @@
     "./components/snk-configurator/snk-configurator.js",
     "./components/snk-crud/subcomponents/snk-guides-viewer.js",
     "./components/snk-crud/snk-crud.js",
+    "./components/snk-crud/subcomponents/snk-entity-search.js",
     "./components/snk-crud/subcomponents/snk-form-summary.js",
     "./components/snk-crud/subcomponents/snk-form-view.js",
     "./components/snk-crud/subcomponents/snk-detail-view/snk-detail-view.js",
     "./components/snk-custom-slot-elements/snk-custom-slot-elements.js",
+    "./components/snk-custom-slot-guide/snk-custom-slot-guide.js",
     "./components/snk-data-exporter/snk-data-exporter.js",
     "./components/snk-data-exporter/exporter-email-sender/snk-exporter-email-sender.js",
     "./components/snk-entity-list/snk-entity-list.js",
@@ -46,6 +48,7 @@
     "./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-image-input/snk-image-input.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-numbering-config/snk-numbering-config.js",
@@ -63,6 +66,7 @@
     "./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/snk-taskbar/subcomponents/snk-taskbar-skeleton.js",
     "./components/teste-pesquisa/teste-pesquisa.js"
   ],
   "compiler": {
@@ -107,6 +111,11 @@
         "snk-guides-viewer"
       ]
     },
+    {
+      "components": [
+        "snk-layout-form-config"
+      ]
+    },
     {
       "components": [
         "snk-data-exporter"

package/dist/collection/components/snk-actions-button/actions/executor/launch-screen.executor.js

@@ -25,11 +25,14 @@ export default class LaunchScreenExecutor {
             localFieldLabel = StringUtils.isEmpty(dataUnit.getField(localField).label) ? localField : localFieldLabel;
             throw new ErrorException(this._application.messagesBuilder.getMessage("snkActionsButton.title.error", undefined), this._application.messagesBuilder.getMessage("snkActionsButton.launchScreen.emptyField", { description: action.description, localFieldLabel: localFieldLabel }));
           }
-          value = StringUtils.isEmpty(value.toString()) ? undefined : value.toString();
-          launchObject[param.targetField] = value;
+          if (value !== null && typeof value === 'object' && 'value' in value) {
+            value = value.value;
+          }
+          const finalValue = StringUtils.isEmpty(value === null || value === void 0 ? void 0 : value.toString()) ? undefined : value.toString();
+          launchObject[param.targetField] = finalValue;
           processedParams.push({
             fieldName: param.targetField,
-            value: value
+            value: finalValue
           });
         });
         launchObject.ACTION_PARAMETERS = processedParams;

package/dist/collection/components/snk-actions-button/snk-actions-button.js

@@ -16,6 +16,7 @@ export class SnkActionsButton {
       action.execute(Object.assign({}, selectedAction));
       this._showDropdown = false;
     };
+    this.size = 'medium';
     this._items = [];
     this._showDropdown = false;
   }
@@ -65,12 +66,13 @@ export class SnkActionsButton {
     document.addEventListener("scroll", this.positionDropdown.bind(this));
   }
   async componentWillLoad() {
+    var _a, _b;
     this._application = ApplicationContext.getContextValue("__SNK__APPLICATION__");
     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;
-    this._entityName = this._dataUnit.name.split('/')[2];
+    this._entityName = (_b = (_a = this._dataUnit) === null || _a === void 0 ? void 0 : _a.name) === null || _b === void 0 ? void 0 : _b.split('/')[2];
     if (this._resourceID == undefined) {
       this._resourceID = await ResourceIDUtils.getResourceID();
     }
@@ -110,9 +112,9 @@ export class SnkActionsButton {
   }
   render() {
     return (h(Host, null, (this._actions && this._actions.length > 0) &&
-      (h("div", { class: `ez-padding-left--medium snk-actions-button
+      (h("div", { class: `snk-actions-button
                             ${this.canShowDropdown() ? " ez-elevation--16" : ""}
-                        ` }, h("ez-button", Object.assign({ ref: (ref) => this._ezButton = ref, iconName: "acao", size: "small", mode: "icon", title: this._application.messagesBuilder.getMessage("snkActionsButton.title.actions", undefined), onClick: () => this.controlDropdown() }, this.getElementID("button"))), h("div", Object.assign({ ref: (ref) => this._dropdownParent = ref, class: `${this.canShowDropdown() ?
+                        ` }, h("ez-tooltip", { message: this._application.messagesBuilder.getMessage("snkActionsButton.title.actions", undefined) }, h("ez-button", Object.assign({ ref: (ref) => this._ezButton = ref, iconName: "acao", mode: "icon", onClick: () => this.controlDropdown(), size: this.size }, this.getElementID("button")))), h("div", Object.assign({ ref: (ref) => this._dropdownParent = ref, class: `${this.canShowDropdown() ?
           "snk-actions-button__dropdown--show" :
           "snk-actions-button__dropdown"}
                             ` }, this.getElementID("dropdown")), (this.canShowDropdown()) &&
@@ -131,6 +133,28 @@ export class SnkActionsButton {
       "$": ["snk-actions-button.css"]
     };
   }
+  static get properties() {
+    return {
+      "size": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "'small' | 'medium' | 'large'",
+          "resolved": "\"large\" | \"medium\" | \"small\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Define o tamanho do bot\u00E3o, podendo ser 'small', 'medium' ou 'large'."
+        },
+        "attribute": "size",
+        "reflect": false,
+        "defaultValue": "'medium'"
+      }
+    };
+  }
   static get states() {
     return {
       "_items": {},

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

@@ -51,6 +51,7 @@ export class SnkErrorHandler {
       this._app.error(exception.title, exception.message);
     }
     else {
+      console.warn("Erro não tratado", exception);
       this._app.isDebugMode().then(isDebug => {
         if (isDebug) {
           if (exception instanceof Error) {

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

@@ -285,6 +285,7 @@ export class SnkApplication {
     this._popUp.opened = true;
     this._popUp.heightMode = size;
     this._popUp.useHeader = useHeader;
+    this._popUp.autoClose = false;
     if (content.tagName === 'EZ-MODAL-CONTAINER') {
       this._popUp.useHeader = false;
     }
@@ -887,12 +888,29 @@ export class SnkApplication {
    * @async
    */
   async executePreparedSearch(mode, argument, options) {
+    var _a;
     const mdByName = {};
     const { entity, criteria, searchOptions, useSearchPlus } = options;
     if (useSearchPlus) {
       return executePreparedSearchPlus(mode, argument, options, this, this.pesquisaFetcher);
     }
-    if (mode === "ADVANCED") {
+    if (mode === "LOAD_DESCRIPTION") {
+      let result = await this.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 if (mode === "ADVANCED") {
       return executeAdvancedModeSearch(argument, options, this, this.pesquisaFetcher);
     }
     return new Promise((resolve, reject) => {
@@ -1539,7 +1557,7 @@ export class SnkApplication {
         "mutable": false,
         "complexType": {
           "original": "LoadByPkHandler",
-          "resolved": "(objPK: { pk: any; }, redirectFrom?: string) => void",
+          "resolved": "(objPK: { pk: Record<string, any>; }, redirectFrom?: string) => void",
           "references": {
             "LoadByPkHandler": {
               "location": "global"

package/dist/collection/components/snk-attach/snk-attach.css

@@ -1,14 +1,36 @@
-.snk-attach__header, .snk-attach__crud-section {
-  padding: 0 var(--space--lg);
+.snk-attach__header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: var(--space--6, 6px);
+}
+
+.snk-attach__header > section {
+  display: flex;
+  align-items: center;
 }
 
 .snk-attach__file-info {
-  padding: var(--space--small);
-    max-width: 50%;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  gap: var(--space--8, 8px);
 }
-.snk-attach__main{
-  height: 85%;
+
+.snk-attach__main {
+  display: flex;
+  flex-direction: column;
+  height: 100%;
 }
-.ez-box__container{
+
+.ez-box__container {
   height: 100%;
 }
+
+.snk-attach__crud-section {
+  padding: 1px;
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+  width: 100%;
+}

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

@@ -21,20 +21,21 @@ export class SnkAttach {
     this.handleBack = () => {
       this._currentDataUnit.cancelEdition().then((cancelationConfirmed) => {
         if (cancelationConfirmed)
-          this.back.emit();
+          this.close();
       });
     };
     this.handleFinish = () => {
       if (!this._currentDataUnit.isDirty())
-        return this.back.emit();
+        return this.close();
       if (!this.validateAnexoSistema()) {
         return;
       }
       this._currentDataUnit.saveData().then(() => {
         this.showFinishedToast();
-        this.back.emit();
+        this.close();
       });
     };
+    this._isOpen = false;
     this.gridLegacyConfigName = undefined;
     this.fetcherType = undefined;
     this.fetcher = undefined;
@@ -46,6 +47,41 @@ export class SnkAttach {
     this._currentFetcher = undefined;
     this._currentDataUnit = undefined;
     this.crudConfig = undefined;
+    this._appResourceID = undefined;
+  }
+  // Garante que o popup só abre via método open()
+  // Não há mais caminhos alternativos de abertura
+  /**
+   * Abre o popup do SnkAttach.
+   */
+  /**
+   * Abre o popup do SnkAttach.
+   * Inicializa o componente apenas na abertura.
+   */
+  async open() {
+    this._isOpen = true;
+    // Inicialização só ocorre na abertura
+    if (!this._currentDataUnit) {
+      await this.initAttach();
+    }
+    if (this._refPopup) {
+      this._refPopup.opened = true;
+    }
+    if (!this.fetcherType) {
+      this.fetcherType = "AnexoSistema";
+    }
+    if (this._currentDataUnit == null) {
+      this.loadAttachmentDataUnit();
+    }
+  }
+  /**
+   * Fecha o popup do SnkAttach.
+   */
+  async close() {
+    this._isOpen = false;
+    if (this._refPopup) {
+      this._refPopup.opened = false;
+    }
   }
   async registerKeyWatcher(newRegisterKey, oldRegisterKey) {
     var _a;
@@ -242,16 +278,12 @@ export class SnkAttach {
   }
   async componentWillLoad() {
     this._application = ApplicationContext.getContextValue("__SNK__APPLICATION__");
-    await this.initAttach();
-  }
-  componentWillRender() {
-    if (!this.fetcherType) {
-      this.fetcherType = "AnexoSistema";
-    }
-    if (this._currentDataUnit == null) {
-      this.loadAttachmentDataUnit();
+    if (this._application) {
+      this._appResourceID = await this._application.getResourceID();
     }
+    await this.initAttach();
   }
+  // Removido: não inicializa DataUnit no ciclo de vida, apenas na abertura
   async handleOnDataStateChange({ detail }) {
     if (this.fetcherType !== 'Attach')
       return;
@@ -264,16 +296,21 @@ export class SnkAttach {
     await this._currentDataUnit.loadMetadata();
   }
   ;
+  isScreenVariation() {
+    var _a;
+    return !!((_a = this._appResourceID) === null || _a === void 0 ? void 0 : _a.includes('__'));
+  }
   getGridLegacyConfigName() {
+    if (this.isScreenVariation()) {
+      return undefined;
+    }
     if (this.gridLegacyConfigName)
       return this.gridLegacyConfigName;
     return this.entityName ? GRID_LEGACY_CONFIG_NAME + "." + this.entityName : this.entityName;
   }
   render() {
     var _a, _b;
-    if (!this._currentDataUnit)
-      return null;
-    return (h("main", { class: "snk-attach__main" }, h("header", { class: "snk-attach__header" }, h("snk-simple-bar", { onExit: this.handleBack, messagesBuilder: this.messagesBuilder }, h("div", { slot: "rightSlot" }, h("ez-button", { class: "ez-button--primary", label: this.getMessage("snkAttach.finish"), onClick: this.handleFinish })))), h("div", { class: "snk-attach__crud-section ez-size-height--full ez-size-width--full ez-flex ez-flex--column" }, h("div", { class: "ez-box__container" }, h("snk-simple-crud", { ref: (el) => this._crudElement = el, dataUnit: this._currentDataUnit, taskbarManager: buildTaskBarManager(), gridConfig: (_a = this.crudConfig) === null || _a === void 0 ? void 0 : _a.grid, formConfig: (_b = this.crudConfig) === null || _b === void 0 ? void 0 : _b.form, useCancelConfirm: false, onActionClick: this.handleTaskbarClick, messagesBuilder: this.messagesBuilder, onDataStateChange: this.handleOnDataStateChange.bind(this), multipleSelection: true, configName: this.entityName, ignoreReadOnlyFormFields: this.entityName ? true : false, gridLegacyConfigName: this.getGridLegacyConfigName() }, h("div", { slot: "snkSimpleCrudHeader" }, h("div", { class: "ez-flex ez-flex--column" }, h("span", { class: "ez-title--primary ez-text ez-text--large ez-text--bold ez-padding-bottom--medium" }, this.getMessage("snkAttach.title")), h("span", { class: "ez-text ez-text--medium ez-text--secondary ez-padding-bottom--medium" }, this.getMessage("snkAttach.description")))))))));
+    return (h("ez-popup", { ref: (el) => this._refPopup = el, size: 'x-large', ezTitle: this.getMessage("snkAttach.title"), useHeader: false, autoClose: false, onEzClosePopup: () => this.close() }, this._isOpen && this._currentDataUnit && (h("main", { class: "snk-attach__main" }, h("header", { class: "snk-attach__header" }, h("section", null, h("ez-button", { class: "ez-padding-right--medium", title: this.getMessage('snkSimpleBar.backTitle'), mode: 'icon', iconName: "arrow_back", size: 'medium', onClick: () => this.handleBack() }), h("div", { class: "snk-attach__file-info" }, h("span", { class: "ez-title--primary ez-text ez-text--large ez-text--bold" }, this.getMessage("snkAttach.title")), h("span", { class: "ez-text ez-text--medium ez-text--secondary" }, this.getMessage("snkAttach.description")))), h("ez-button", { class: "ez-button--primary", label: this.getMessage("snkAttach.finish"), onClick: this.handleFinish })), h("div", { class: "snk-attach__crud-section" }, h("snk-simple-crud", { ref: (el) => this._crudElement = el, dataUnit: this._currentDataUnit, taskbarManager: buildTaskBarManager(), gridConfig: (_a = this.crudConfig) === null || _a === void 0 ? void 0 : _a.grid, formConfig: (_b = this.crudConfig) === null || _b === void 0 ? void 0 : _b.form, useCancelConfirm: false, onActionClick: this.handleTaskbarClick, messagesBuilder: this.messagesBuilder, onDataStateChange: this.handleOnDataStateChange.bind(this), multipleSelection: true, configName: this.isScreenVariation() ? undefined : (this.entityName ? "AnexoSistema_" + this.entityName : undefined), ignoreReadOnlyFormFields: this.entityName ? true : false, gridLegacyConfigName: this.getGridLegacyConfigName(), outlineMode: true }))))));
   }
   static get is() { return "snk-attach"; }
   static get encapsulation() { return "scoped"; }
@@ -308,7 +345,7 @@ export class SnkAttach {
       },
       "fetcherType": {
         "type": "string",
-        "mutable": false,
+        "mutable": true,
         "complexType": {
           "original": "TFetcherType",
           "resolved": "\"AnexoSistema\" | \"Another\" | \"Attach\"",
@@ -446,21 +483,23 @@ export class SnkAttach {
   }
   static get states() {
     return {
+      "_isOpen": {},
       "_currentFetcher": {},
       "_currentDataUnit": {},
-      "crudConfig": {}
+      "crudConfig": {},
+      "_appResourceID": {}
     };
   }
   static get events() {
     return [{
-        "method": "back",
-        "name": "back",
+        "method": "ezClosePopup",
+        "name": "ezClosePopup",
         "bubbles": true,
         "cancelable": true,
         "composed": true,
         "docs": {
           "tags": [],
-          "text": "Evento disparado quando o usu\u00E1rio clica no bot\u00E3o voltar."
+          "text": "Evento emitido ao clicar no bot\u00E3o de fechar (onEzClosePopup)."
         },
         "complexType": {
           "original": "void",
@@ -469,6 +508,42 @@ export class SnkAttach {
         }
       }];
   }
+  static get methods() {
+    return {
+      "open": {
+        "complexType": {
+          "signature": "() => Promise<void>",
+          "parameters": [],
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
+          },
+          "return": "Promise<void>"
+        },
+        "docs": {
+          "text": "Abre o popup do SnkAttach.\nInicializa o componente apenas na abertura.",
+          "tags": []
+        }
+      },
+      "close": {
+        "complexType": {
+          "signature": "() => Promise<void>",
+          "parameters": [],
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
+          },
+          "return": "Promise<void>"
+        },
+        "docs": {
+          "text": "Fecha o popup do SnkAttach.",
+          "tags": []
+        }
+      }
+    };
+  }
   static get watchers() {
     return [{
         "propName": "registerKey",

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

@@ -79,6 +79,7 @@ export class SnkConfigurator {
     if (!this.disableNumberingConfig) {
       const result = await ((_a = this._snkNumberingConfig) === null || _a === void 0 ? void 0 : _a.save());
       if (!result) {
+        this.closeConfig();
         return;
       }
     }
@@ -86,6 +87,7 @@ export class SnkConfigurator {
       this._snkLayoutFormConfig.save();
     }
     this.save.emit();
+    this.closeConfig();
   }
   componentWillLoad() {
     this._application = ApplicationContext.getContextValue('__SNK__APPLICATION__');

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

@@ -3,4 +3,54 @@
   flex-direction: column;
   height: 100%;
   width: 100%;
+  overflow-y: auto;
+  scrollbar-gutter: stable both-edges;
+}
+
+snk-grid {
+  --snk-grid-padding: 0 var(--space--6, 6px) var(--space--6, 6px) var(--space--6, 6px);
+}
+stack-item.sc-snk-crud {
+  display: grid;
+  min-height: 100%;
+}
+
+.snk-crud__header {
+  margin-bottom: var(--space--10, 10px);
+}
+
+.snk-crud__grid-stack-item {
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+  width: 100%;
+  padding: 0 var(--space--2, 2px);
+}
+
+.snk-crud__header-top {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: var(--space--8, 8px);
+  padding-top: var(--space--12, 12px);
+}
+
+.snk-crud__header-bottom {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 0 var(--space--8, 8px) 0 var(--space--6, 6px);
+}
+
+.snk-crud__header-bottom > snk-taskbar {
+  padding-bottom: var(--space--8, 8px);
+  margin-left: var(--space--12, 12px);
+}
+
+.snk-crud--hidden {
+  display: none !important;
+}
+
+ez-record-navigation, ez-grid-pagination {
+  margin-bottom: var(--space--8, 8px);
 }