@sankhyalabs/sankhyablocks 10.1.0-dev.36 → 10.1.0-dev.38

package/dist/collection/components/snk-taskbar/subcomponents/snk-taskbar-skeleton.css

@@ -0,0 +1,12 @@
+:host {
+    display: flex;
+    align-items: center;
+    height: 100%;
+    padding: 0 var(--space--8, 8px);
+}
+
+ez-skeleton {
+    --skeleton-width: 42px;
+    --skeleton-height: 42px;
+    --skeleton-margin-left: var(--space--4, 4px);
+}

package/dist/collection/components/snk-taskbar/subcomponents/snk-taskbar-skeleton.js

@@ -0,0 +1,19 @@
+import { Host, h } from "@stencil/core";
+export class SnkTaskbarSkeleton {
+  render() {
+    return (h(Host, null, h("ez-skeleton", { variant: "circle", count: 12 }), h("ez-skeleton", { width: "100px" })));
+  }
+  static get is() { return "snk-taskbar-skeleton"; }
+  static get encapsulation() { return "scoped"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["snk-taskbar-skeleton.css"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["snk-taskbar-skeleton.css"]
+    };
+  }
+}
+;

package/dist/collection/lib/configs/ConfigStorage.js

@@ -78,6 +78,11 @@ export class ConfigStorage {
     await this.deleteGridConfigCache(name, resourceID);
     return this.gridConfigFetcher.saveConfig(config, name, resourceID);
   }
+  static async deleteGridConfig(name, resourceID) {
+    name = this.handleLegacyConfigAsString(name, CONFIG_SOURCE.grid);
+    await this.deleteGridConfigCache(name, resourceID);
+    return this.gridConfigFetcher.deleteConfig(name, resourceID);
+  }
   static async loadDefaultFilter(filterId, resourceID, configName) {
     const legacyConfigName = this.filterBarLegacyConfig.get(configName);
     return this.personalizedFilterFetcher.loadDefaultFilter(resourceID, filterId, configName, legacyConfigName);

package/dist/collection/lib/http/data-fetcher/fetchers/grid-config-fetcher.js

@@ -39,6 +39,18 @@ export default class GridConfigFetcher extends ResourceFetcher {
       });
     });
   }
+  deleteConfig(gridName, resourceID) {
+    const completePath = this.getPath(resourceID, gridName);
+    return new Promise((resolve, reject) => {
+      this.deleteResource(completePath)
+        .then(() => {
+        resolve();
+      })
+        .catch((error) => {
+        reject(error);
+      });
+    });
+  }
   getPath(resourceID, name) {
     if (name) {
       return `cfg://grid/${this.GRID_CONFIG_VERSION}${resourceID}/${name}`;

package/dist/collection/lib/http/data-fetcher/fetchers/resource-fetcher.js

@@ -17,6 +17,9 @@ export class ResourceFetcher {
                     resource                    
                 }
               }`);
+    this.templateByQuery.set("deleteResource", gql `mutation($name: String!) {
+                $queryAlias$: deleteResource(name: $name)
+              }`);
   }
   loadResource(name) {
     if (ResourceFetcher._loadingResource.has(name)) {
@@ -60,5 +63,20 @@ export class ResourceFetcher {
       });
     });
   }
+  deleteResource(name) {
+    return new Promise((resolve, reject) => {
+      DataFetcher.get()
+        .callGraphQL({
+        values: { name },
+        query: this.templateByQuery.get("deleteResource")
+      })
+        .then(() => {
+        resolve();
+      })
+        .catch((error) => {
+        reject(error);
+      });
+    });
+  }
 }
 ResourceFetcher._loadingResource = new Map();

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

@@ -31,5 +31,13 @@ export const snkCrudMessages = {
     removeRecord: "Remove the selected record.",
     refreshData: "Refresh data.",
     cancelAction: "Cancel an action."
+  },
+  customButtons: {
+    filter: "Opens the filters panel",
+    entitySearch: "Search in entity"
+  },
+  entitySearch: {
+    label: "Search for records",
+    placeholder: "Type what you are looking for here..."
   }
 };

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

@@ -31,5 +31,13 @@ export const snkCrudMessages = {
     removeRecord: "Eliminar el registro seleccionado.",
     refreshData: "Actualizar datos.",
     cancelAction: "Cancelar una acción."
+  },
+  customButtons: {
+    filter: "Abre el panel de filtros",
+    entitySearch: "Buscar en entidad"
+  },
+  entitySearch: {
+    label: "Búsqueda de registros",
+    placeholder: "Escribe lo que buscas aquí..."
   }
 };

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

@@ -31,5 +31,13 @@ export const snkCrudMessages = {
     removeRecord: "Remove o registro selecionado.",
     refreshData: "Atualiza os dados.",
     cancelAction: "Cancela uma ação."
+  },
+  customButtons: {
+    filter: "Abre o painel de filtros",
+    entitySearch: "Busca na entidade"
+  },
+  entitySearch: {
+    label: "Busca por registros",
+    placeholder: "Digite o que você procura aqui..."
   }
 };

package/dist/components/ConfigStorage.js

@@ -179,6 +179,18 @@ class GridConfigFetcher extends ResourceFetcher {
       });
     });
   }
+  deleteConfig(gridName, resourceID) {
+    const completePath = this.getPath(resourceID, gridName);
+    return new Promise((resolve, reject) => {
+      this.deleteResource(completePath)
+        .then(() => {
+        resolve();
+      })
+        .catch((error) => {
+        reject(error);
+      });
+    });
+  }
   getPath(resourceID, name) {
     if (name) {
       return `cfg://grid/${this.GRID_CONFIG_VERSION}${resourceID}/${name}`;
@@ -457,6 +469,11 @@ class ConfigStorage {
     await this.deleteGridConfigCache(name, resourceID);
     return this.gridConfigFetcher.saveConfig(config, name, resourceID);
   }
+  static async deleteGridConfig(name, resourceID) {
+    name = this.handleLegacyConfigAsString(name, CONFIG_SOURCE.grid);
+    await this.deleteGridConfigCache(name, resourceID);
+    return this.gridConfigFetcher.deleteConfig(name, resourceID);
+  }
   static async loadDefaultFilter(filterId, resourceID, configName) {
     const legacyConfigName = this.filterBarLegacyConfig.get(configName);
     return this.personalizedFilterFetcher.loadDefaultFilter(resourceID, filterId, configName, legacyConfigName);

package/dist/components/ContinuousInsertUtils.js

@@ -420,4 +420,4 @@ class ContinuousInsertUtils {
   }
 }
 
-export { CommonsExporter as C, RmPrecisionCustomValueFormatter as R, SnkMultiSelectionListDataSource as S, TaskbarProcessor as T, CrudUtils as a, ContinuousInsertUtils as b, ClientSideExporterProvider as c };
+export { ContinuousInsertUtils as C, RmPrecisionCustomValueFormatter as R, SnkMultiSelectionListDataSource as S, TaskbarProcessor as T, CommonsExporter as a, CrudUtils as b, ClientSideExporterProvider as c };

package/dist/components/SnkMessageBuilder.js

@@ -202,6 +202,14 @@ const snkCrudMessages$2 = {
     removeRecord: "Remove o registro selecionado.",
     refreshData: "Atualiza os dados.",
     cancelAction: "Cancela uma ação."
+  },
+  customButtons: {
+    filter: "Abre o painel de filtros",
+    entitySearch: "Busca na entidade"
+  },
+  entitySearch: {
+    label: "Busca por registros",
+    placeholder: "Digite o que você procura aqui..."
   }
 };
 
@@ -1087,6 +1095,14 @@ const snkCrudMessages$1 = {
     removeRecord: "Remove the selected record.",
     refreshData: "Refresh data.",
     cancelAction: "Cancel an action."
+  },
+  customButtons: {
+    filter: "Opens the filters panel",
+    entitySearch: "Search in entity"
+  },
+  entitySearch: {
+    label: "Search for records",
+    placeholder: "Type what you are looking for here..."
   }
 };
 
@@ -1973,6 +1989,14 @@ const snkCrudMessages = {
     removeRecord: "Eliminar el registro seleccionado.",
     refreshData: "Actualizar datos.",
     cancelAction: "Cancelar una acción."
+  },
+  customButtons: {
+    filter: "Abre el panel de filtros",
+    entitySearch: "Buscar en entidad"
+  },
+  entitySearch: {
+    label: "Búsqueda de registros",
+    placeholder: "Escribe lo que buscas aquí..."
   }
 };
 

package/dist/components/form-config-fetcher.js

@@ -18,6 +18,9 @@ class ResourceFetcher {
                     resource                    
                 }
               }`);
+    this.templateByQuery.set("deleteResource", dist.gql `mutation($name: String!) {
+                $queryAlias$: deleteResource(name: $name)
+              }`);
   }
   loadResource(name) {
     if (ResourceFetcher._loadingResource.has(name)) {
@@ -61,6 +64,21 @@ class ResourceFetcher {
       });
     });
   }
+  deleteResource(name) {
+    return new Promise((resolve, reject) => {
+      DataFetcher.get()
+        .callGraphQL({
+        values: { name },
+        query: this.templateByQuery.get("deleteResource")
+      })
+        .then(() => {
+        resolve();
+      })
+        .catch((error) => {
+        reject(error);
+      });
+    });
+  }
 }
 ResourceFetcher._loadingResource = new Map();
 

package/dist/components/index.d.ts

@@ -22,6 +22,7 @@ export { SnkDataUnit as SnkDataUnit } from '../types/components/snk-data-unit/sn
 export { SnkDefaultFilter as SnkDefaultFilter } from '../types/components/snk-filter-bar/filter-modal/subcomponents/snk-default-filter/snk-default-filter';
 export { SnkDetailView as SnkDetailView } from '../types/components/snk-crud/subcomponents/snk-detail-view/snk-detail-view';
 export { SnkEntityList as SnkEntityList } from '../types/components/snk-entity-list/snk-entity-list';
+export { SnkEntitySearch as SnkEntitySearch } from '../types/components/snk-crud/subcomponents/snk-entity-search';
 export { SnkExporterEmailSender as SnkExporterEmailSender } from '../types/components/snk-data-exporter/exporter-email-sender/snk-exporter-email-sender';
 export { SnkExpressionGroup as SnkExpressionGroup } from '../types/components/snk-personalized-filter/subcomponents/snk-expression-group/snk-expression-group';
 export { SnkExpressionItem as SnkExpressionItem } from '../types/components/snk-personalized-filter/subcomponents/snk-expression-item/snk-expression-item';
@@ -61,6 +62,7 @@ export { SnkSimpleBar as SnkSimpleBar } from '../types/components/snk-simple-bar
 export { SnkSimpleCrud as SnkSimpleCrud } from '../types/components/snk-simple-crud/snk-simple-crud';
 export { SnkSimpleFormConfig as SnkSimpleFormConfig } from '../types/components/snk-simple-form-config/snk-simple-form-config';
 export { SnkTaskbar as SnkTaskbar } from '../types/components/snk-taskbar/snk-taskbar';
+export { SnkTaskbarSkeleton as SnkTaskbarSkeleton } from '../types/components/snk-taskbar/subcomponents/snk-taskbar-skeleton';
 export { SnkViewRepresentation as SnkViewRepresentation } from '../types/components/snk-layout-form-config/snk-view-representation/snk-view-representation';
 export { TaskbarActionsButton as TaskbarActionsButton } from '../types/components/snk-taskbar/elements/taskbar-actions-button/taskbar-actions-button';
 export { TaskbarSplitButton as TaskbarSplitButton } from '../types/components/snk-taskbar/elements/taskbar-split-button/taskbar-split-button';

package/dist/components/index.js

@@ -22,6 +22,7 @@ export { SnkDataUnit, defineCustomElement as defineCustomElementSnkDataUnit } fr
 export { SnkDefaultFilter, defineCustomElement as defineCustomElementSnkDefaultFilter } from './snk-default-filter.js';
 export { SnkDetailView, defineCustomElement as defineCustomElementSnkDetailView } from './snk-detail-view.js';
 export { SnkEntityList, defineCustomElement as defineCustomElementSnkEntityList } from './snk-entity-list.js';
+export { SnkEntitySearch, defineCustomElement as defineCustomElementSnkEntitySearch } from './snk-entity-search.js';
 export { SnkExporterEmailSender, defineCustomElement as defineCustomElementSnkExporterEmailSender } from './snk-exporter-email-sender.js';
 export { SnkExpressionGroup, defineCustomElement as defineCustomElementSnkExpressionGroup } from './snk-expression-group.js';
 export { SnkExpressionItem, defineCustomElement as defineCustomElementSnkExpressionItem } from './snk-expression-item.js';
@@ -61,6 +62,7 @@ export { SnkSimpleBar, defineCustomElement as defineCustomElementSnkSimpleBar }
 export { SnkSimpleCrud, defineCustomElement as defineCustomElementSnkSimpleCrud } from './snk-simple-crud.js';
 export { SnkSimpleFormConfig, defineCustomElement as defineCustomElementSnkSimpleFormConfig } from './snk-simple-form-config.js';
 export { SnkTaskbar, defineCustomElement as defineCustomElementSnkTaskbar } from './snk-taskbar.js';
+export { SnkTaskbarSkeleton, defineCustomElement as defineCustomElementSnkTaskbarSkeleton } from './snk-taskbar-skeleton.js';
 export { SnkViewRepresentation, defineCustomElement as defineCustomElementSnkViewRepresentation } from './snk-view-representation.js';
 export { TaskbarActionsButton, defineCustomElement as defineCustomElementTaskbarActionsButton } from './taskbar-actions-button.js';
 export { TaskbarSplitButton, defineCustomElement as defineCustomElementTaskbarSplitButton } from './taskbar-split-button.js';

package/dist/components/snk-actions-button2.js

@@ -607,6 +607,7 @@ const SnkActionsButton = /*@__PURE__*/ proxyCustomElement(class extends HTMLElem
       action.execute(Object.assign({}, selectedAction));
       this._showDropdown = false;
     };
+    this.size = 'medium';
     this._items = [];
     this._showDropdown = false;
   }
@@ -656,12 +657,13 @@ const SnkActionsButton = /*@__PURE__*/ proxyCustomElement(class extends HTMLElem
     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();
     }
@@ -701,9 +703,9 @@ const SnkActionsButton = /*@__PURE__*/ proxyCustomElement(class extends HTMLElem
   }
   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()) &&
@@ -713,6 +715,7 @@ const SnkActionsButton = /*@__PURE__*/ proxyCustomElement(class extends HTMLElem
   get _element() { return this; }
   static get style() { return snkActionsButtonCss; }
 }, [2, "snk-actions-button", {
+    "size": [1],
     "_items": [32],
     "_showDropdown": [32]
   }]);

package/dist/components/snk-attach2.js

@@ -8,7 +8,7 @@ import './form-config-fetcher.js';
 import { V as VIEW_MODE } from './constants.js';
 import { A as AutorizationType } from './auth-fetcher.js';
 import { S as SnkMessageBuilder } from './SnkMessageBuilder.js';
-import { T as TaskbarElement, d as defineCustomElement$4 } from './snk-taskbar2.js';
+import { T as TaskbarElement, d as defineCustomElement$5 } from './snk-taskbar2.js';
 import { d as defineCustomElement$g } from './snk-actions-button2.js';
 import { d as defineCustomElement$f } from './snk-configurator2.js';
 import { d as defineCustomElement$e } from './snk-data-exporter2.js';
@@ -18,9 +18,9 @@ import { d as defineCustomElement$b } from './snk-grid-config2.js';
 import { d as defineCustomElement$a } from './snk-layout-form-config2.js';
 import { d as defineCustomElement$9 } from './snk-numbering-config2.js';
 import { d as defineCustomElement$8 } from './snk-select-box2.js';
-import { d as defineCustomElement$7 } from './snk-simple-bar2.js';
-import { d as defineCustomElement$6 } from './snk-simple-crud2.js';
-import { d as defineCustomElement$5 } from './snk-simple-form-config2.js';
+import { d as defineCustomElement$7 } from './snk-simple-crud2.js';
+import { d as defineCustomElement$6 } from './snk-simple-form-config2.js';
+import { d as defineCustomElement$4 } from './snk-taskbar-skeleton2.js';
 import { d as defineCustomElement$3 } from './snk-view-representation2.js';
 import { d as defineCustomElement$2 } from './taskbar-actions-button2.js';
 import { d as defineCustomElement$1 } from './taskbar-split-button2.js';
@@ -631,7 +631,7 @@ const anexoSistemaCrudConfig = {
   },
 };
 
-const snkAttachCss = ".snk-attach__header.sc-snk-attach,.snk-attach__crud-section.sc-snk-attach{padding:0 var(--space--lg)}.snk-attach__file-info.sc-snk-attach{padding:var(--space--small);max-width:50%}.snk-attach__main.sc-snk-attach{height:85%}.ez-box__container.sc-snk-attach{height:100%}";
+const snkAttachCss = ".snk-attach__header.sc-snk-attach{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space--6, 6px)}.snk-attach__header.sc-snk-attach>section.sc-snk-attach{display:flex;align-items:center}.snk-attach__file-info.sc-snk-attach{display:flex;flex-direction:column;justify-content:center;gap:var(--space--8, 8px)}.snk-attach__main.sc-snk-attach{display:flex;flex-direction:column;height:100%}.ez-box__container.sc-snk-attach{height:100%}.snk-attach__crud-section.sc-snk-attach{padding:1px;display:flex;flex-direction:column;height:100%;width:100%}";
 
 const RESOURCE_ID = 'AnexoSistema';
 const DATA_UNIT_NAME = 'br.com.sankhya.core.v3.anexoSistema';
@@ -641,7 +641,7 @@ const SnkAttach = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   constructor() {
     super();
     this.__registerHost();
-    this.back = createEvent(this, "back", 7);
+    this.ezClosePopup = createEvent(this, "ezClosePopup", 7);
     this.handleTaskbarClick = async ({ detail: taskbar }) => {
       if (["DOWNLOAD", "LINK"].includes(taskbar))
         return this.downloadAttachment(this._currentDataUnit.getSelectedRecord());
@@ -652,20 +652,21 @@ const SnkAttach = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     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;
@@ -678,6 +679,40 @@ const SnkAttach = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     this._currentDataUnit = undefined;
     this.crudConfig = 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;
     if (this._currentDataUnit == null) {
@@ -873,16 +908,9 @@ const SnkAttach = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   }
   async componentWillLoad() {
     this._application = ApplicationContext.getContextValue("__SNK__APPLICATION__");
-    await this.initAttach();
-  }
-  componentWillRender() {
-    if (!this.fetcherType) {
-      this.fetcherType = "AnexoSistema";
-    }
-    if (this._currentDataUnit == null) {
-      this.loadAttachmentDataUnit();
-    }
+    // Não inicializa DataUnit aqui, só na abertura
   }
+  // Removido: não inicializa DataUnit no ciclo de vida, apenas na abertura
   async handleOnDataStateChange({ detail }) {
     if (this.fetcherType !== 'Attach')
       return;
@@ -902,9 +930,7 @@ const SnkAttach = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   }
   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.entityName, ignoreReadOnlyFormFields: this.entityName ? true : false, gridLegacyConfigName: this.getGridLegacyConfigName(), outlineMode: true }))))));
   }
   static get watchers() { return {
     "registerKey": ["registerKeyWatcher"]
@@ -919,15 +945,18 @@ const SnkAttach = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     "registerKey": [1, "register-key"],
     "entityName": [1, "entity-name"],
     "messagesBuilder": [1040],
+    "_isOpen": [32],
     "_currentFetcher": [32],
     "_currentDataUnit": [32],
-    "crudConfig": [32]
+    "crudConfig": [32],
+    "open": [64],
+    "close": [64]
   }]);
 function defineCustomElement() {
   if (typeof customElements === "undefined") {
     return;
   }
-  const components = ["snk-attach", "snk-actions-button", "snk-configurator", "snk-data-exporter", "snk-data-unit", "snk-exporter-email-sender", "snk-grid-config", "snk-layout-form-config", "snk-numbering-config", "snk-select-box", "snk-simple-bar", "snk-simple-crud", "snk-simple-form-config", "snk-taskbar", "snk-view-representation", "taskbar-actions-button", "taskbar-split-button"];
+  const components = ["snk-attach", "snk-actions-button", "snk-configurator", "snk-data-exporter", "snk-data-unit", "snk-exporter-email-sender", "snk-grid-config", "snk-layout-form-config", "snk-numbering-config", "snk-select-box", "snk-simple-crud", "snk-simple-form-config", "snk-taskbar", "snk-taskbar-skeleton", "snk-view-representation", "taskbar-actions-button", "taskbar-split-button"];
   components.forEach(tagName => { switch (tagName) {
     case "snk-attach":
       if (!customElements.get(tagName)) {
@@ -979,22 +1008,22 @@ function defineCustomElement() {
         defineCustomElement$8();
       }
       break;
-    case "snk-simple-bar":
+    case "snk-simple-crud":
       if (!customElements.get(tagName)) {
         defineCustomElement$7();
       }
       break;
-    case "snk-simple-crud":
+    case "snk-simple-form-config":
       if (!customElements.get(tagName)) {
         defineCustomElement$6();
       }
       break;
-    case "snk-simple-form-config":
+    case "snk-taskbar":
       if (!customElements.get(tagName)) {
         defineCustomElement$5();
       }
       break;
-    case "snk-taskbar":
+    case "snk-taskbar-skeleton":
       if (!customElements.get(tagName)) {
         defineCustomElement$4();
       }