@sankhyalabs/sankhyablocks 8.16.0-dev.75 → 8.16.0-dev.76

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

@@ -14,7 +14,7 @@ require('@sankhyalabs/core/dist/dataunit/metadata/UnitMetadata');
 require('./dataunit-fetcher-c32fdff7.js');
 require('./filter-item-type.enum-a7ffdaa6.js');
 require('./form-config-fetcher-90126e4c.js');
-const constants = require('./constants-35ddd366.js');
+const constants = require('./constants-241934b3.js');
 const authFetcher = require('./auth-fetcher-8480751c.js');
 require('./index-102ba62d.js');
 require('./PrintUtils-bcaeb82f.js');

package/dist/cjs/snk-data-exporter.cjs.entry.js

@@ -6,7 +6,7 @@ const index$1 = require('./index-f9e81701.js');
 const core = require('@sankhyalabs/core');
 const utils = require('@sankhyalabs/ezui/dist/collection/utils');
 const index = require('./index-1dfc7a6e.js');
-const constants = require('./constants-35ddd366.js');
+const constants = require('./constants-241934b3.js');
 const DataFetcher = require('./DataFetcher-65879b2c.js');
 const snkDataUnit = require('./snk-data-unit-2c7c1964.js');
 require('./pesquisa-fetcher-36d039c4.js');

package/dist/cjs/snk-detail-view.cjs.entry.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-f9e81701.js');
 const core = require('@sankhyalabs/core');
-const SnkFormConfigManager = require('./SnkFormConfigManager-07f747be.js');
+const SnkFormConfigManager = require('./SnkFormConfigManager-c11d8468.js');
 const form = require('@sankhyalabs/ezui/dist/collection/utils/form');
 require('./DataFetcher-65879b2c.js');
 require('./pesquisa-fetcher-36d039c4.js');
@@ -15,9 +15,9 @@ require('@sankhyalabs/core/dist/dataunit/metadata/UnitMetadata');
 require('./dataunit-fetcher-c32fdff7.js');
 require('./filter-item-type.enum-a7ffdaa6.js');
 require('./form-config-fetcher-90126e4c.js');
+const constants = require('./constants-241934b3.js');
 const taskbarElements = require('./taskbar-elements-9ad1f9c0.js');
-const constants = require('./constants-35ddd366.js');
-const snkGuidesViewer = require('./snk-guides-viewer-a651b9b8.js');
+const snkGuidesViewer = require('./snk-guides-viewer-00f17b65.js');
 const SnkMessageBuilder = require('./SnkMessageBuilder-bae64d0d.js');
 require('./ConfigStorage-d024aec8.js');
 require('./PrintUtils-bcaeb82f.js');

package/dist/cjs/snk-field-config.cjs.entry.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-f9e81701.js');
 const core = require('@sankhyalabs/core');
-const constants = require('./constants-35ddd366.js');
+const constants = require('./constants-241934b3.js');
 
 const snkFieldConfigCss = ".sc-snk-field-config-h{--snk-field-config--height:42px;--snk-field-config--width:100%;--snk-field-config__icon--width:48px;--snk-field-config-slim--height:32px;--snk-field-config--border-radius:var(--border--radius-medium, 12px);--snk-field-config--font-size:var(--text--medium, 14px);--snk-field-config--font-family:var(--font-pattern, Arial);--snk-field-config--font-weight:var(--text-weight--medium, 400);--snk-field-config--color:var(--title--primary, #000);--snk-field-config--padding-left:var(--space--medium, 6px);--snk-field-config__input--background-color:var(--background--medium, #e0e0e0);--snk-field-config__input--border:var(--border--medium, 2px solid);--snk-field-config__input--border-color:var(--background--xlight, #fff);--snk-field-config__required--color:var(--color--error, #FF0000);--snk-field-config__label--gap:var(--space--extra-small, 3px);--snk-field-config__transition--visibility:var(--transition, 0.2s linear);--snk-field-config__transition--opacity:var(--transition, 0.15s linear);--snk-field-config__config-popover--z-index:var(--more-visible, 2);--snk-field-config__config-outer-arrow--background-color:var(--color--secondary-200, #D2D3DA);--snk-field-config__draggable--padding-right:var(--space--small, 6px);display:flex;flex-wrap:wrap;position:relative;width:var(--snk-field-config--width)}.field-config.sc-snk-field-config{width:100%;box-sizing:border-box;display:flex;align-items:center;padding-left:var(--snk-field-config--padding-left);font-weight:var(--snk-field-config--font-weight);height:var(--snk-field-config--height);border-radius:var(--snk-field-config--border-radius);font-family:var(--snk-field-config--font-family);font-size:var(--snk-field-config--font-size);border:var(--snk-field-config__input--border);border-color:var(--snk-field-config__input--border-color);background-color:var(--snk-field-config__input--background-color);color:var(--snk-field-config--color)}.field-config__config-popover.sc-snk-field-config{width:40px;margin-left:auto;z-index:var(--snk-field-config__config-popover--z-index)}.field-config__label.sc-snk-field-config{display:flex;flex-direction:row-reverse;line-height:calc(var(--snk-field-config--font-size) + 2px);gap:var(--snk-field-config__label--gap)}.field-config__label-text.sc-snk-field-config{overflow:hidden;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto;height:auto;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;display:-webkit-box;-o-text-overflow:ellipsis;text-overflow:ellipsis;word-break:break-word}.field-config__label-required.sc-snk-field-config{color:var(--snk-field-config__required--color)}.field-config__add.sc-snk-field-config{display:flex;margin-left:auto;visibility:hidden;opacity:0;transition:visibility var(--snk-field-config__transition--visibility), opacity var(--snk-field-config__transition--opacity)}.field-config__options.sc-snk-field-config{display:flex;margin-left:auto;visibility:hidden;opacity:0;transition:visibility var(--snk-field-config__transition--visibility), opacity var(--snk-field-config__transition--opacity)}.field-config__options--is-active.sc-snk-field-config{display:flex;visibility:visible;opacity:1}.field-config__remove-icon.sc-snk-field-config{margin-right:-15px}.field-config.sc-snk-field-config:hover .field-config__options.sc-snk-field-config{display:flex;visibility:visible;opacity:1}.field-config.sc-snk-field-config:hover .field-config__add.sc-snk-field-config{visibility:visible;opacity:1}.field-config__draggable.sc-snk-field-config{padding-right:var(--snk-field-config__draggable--padding-right)}.field-config__config-outer-arrow.sc-snk-field-config{clip-path:polygon(50% 0, 90% 100%, 10% 100%);border-radius:0.25em 0 0 0;width:30px;height:15px;padding-top:3px;border-bottom:1px solid #FFFFFF;background-color:var(--snk-field-config__config-outer-arrow--background-color)}.field-config__config-inner-arrow.sc-snk-field-config{background-color:#FFFFFF;clip-path:polygon(50% 0, 90% 100%, 10% 100%);border-radius:0.25em 0 0 0;width:30px;height:15px}.ez-box__container.sc-snk-field-config ez-collapsible-box.sc-snk-field-config{--snk-collapsible-box__header--padding-left:6px}ez-icon.sc-snk-field-config{--snk-icon--color:var(--snk-field-config--color)}ez-popover.sc-snk-field-config{--snk-popover__box--background-color:transparent;--snk-popover__box--box-shadow:none}.field-config__options.sc-snk-field-config ez-button.sc-snk-field-config{--snk-button--background-color:transparent;--snk-button--focus--border:none;--snk-button--focus--box-shadow:none}@media screen and (min-width: 1200px){.field-config__label.sc-snk-field-config{flex-direction:row}}";
 

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

@@ -9,7 +9,7 @@ const ConfigStorage = require('./ConfigStorage-d024aec8.js');
 const index$1 = require('./index-1dfc7a6e.js');
 const fieldSearch = require('./field-search-68e34bf4.js');
 const index$2 = require('./index-102ba62d.js');
-const ContinuousInsertUtils = require('./ContinuousInsertUtils-b5de47db.js');
+const ContinuousInsertUtils = require('./ContinuousInsertUtils-fff67c94.js');
 const DataUnit = require('@sankhyalabs/core/dist/dataunit/DataUnit');
 require('./DataFetcher-65879b2c.js');
 require('./pesquisa-fetcher-36d039c4.js');
@@ -19,6 +19,7 @@ require('@sankhyalabs/core/dist/dataunit/metadata/UnitMetadata');
 require('./dataunit-fetcher-c32fdff7.js');
 require('./filter-item-type.enum-a7ffdaa6.js');
 require('./form-config-fetcher-90126e4c.js');
+require('./constants-241934b3.js');
 const GetSelectedRecordsIDsInfo = require('./GetSelectedRecordsIDsInfo-bd50caf1.js');
 require('@sankhyalabs/ezui/dist/collection/components/ez-grid/utils/InMemoryFilterColumnDataSource');
 require('./PrintUtils-bcaeb82f.js');

package/dist/cjs/{snk-guides-viewer-a651b9b8.js → snk-guides-viewer-00f17b65.js}

@@ -2,11 +2,11 @@
 
 const index = require('./index-f9e81701.js');
 const core = require('@sankhyalabs/core');
-const SnkFormConfigManager = require('./SnkFormConfigManager-07f747be.js');
+const SnkFormConfigManager = require('./SnkFormConfigManager-c11d8468.js');
 const form = require('@sankhyalabs/ezui/dist/collection/utils/form');
 const fieldSearch = require('./field-search-68e34bf4.js');
 const taskbarElements = require('./taskbar-elements-9ad1f9c0.js');
-const constants = require('./constants-35ddd366.js');
+const constants = require('./constants-241934b3.js');
 require('./DataFetcher-65879b2c.js');
 require('./pesquisa-fetcher-36d039c4.js');
 const index$1 = require('./index-1dfc7a6e.js');

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

@@ -2,17 +2,17 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const snkGuidesViewer = require('./snk-guides-viewer-a651b9b8.js');
+const snkGuidesViewer = require('./snk-guides-viewer-00f17b65.js');
 require('./index-f9e81701.js');
 require('@sankhyalabs/core');
-require('./SnkFormConfigManager-07f747be.js');
+require('./SnkFormConfigManager-c11d8468.js');
 require('./ConfigStorage-d024aec8.js');
 require('./form-config-fetcher-90126e4c.js');
 require('./DataFetcher-65879b2c.js');
 require('./PrintUtils-bcaeb82f.js');
 require('@sankhyalabs/core/dist/dataunit/metadata/UnitMetadata');
 require('./filter-item-type.enum-a7ffdaa6.js');
-require('./constants-35ddd366.js');
+require('./constants-241934b3.js');
 require('@sankhyalabs/ezui/dist/collection/utils/form');
 require('./field-search-68e34bf4.js');
 require('./taskbar-elements-9ad1f9c0.js');

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

@@ -13,6 +13,7 @@ require('@sankhyalabs/core/dist/dataunit/metadata/UnitMetadata');
 require('./dataunit-fetcher-c32fdff7.js');
 require('./filter-item-type.enum-a7ffdaa6.js');
 require('./form-config-fetcher-90126e4c.js');
+require('./constants-241934b3.js');
 require('./PrintUtils-bcaeb82f.js');
 require('@sankhyalabs/ezui/dist/collection/components/ez-grid/utils');
 require('@sankhyalabs/core/dist/utils/SortingUtils');

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

@@ -5,11 +5,11 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index$1 = require('./index-f9e81701.js');
 const core = require('@sankhyalabs/core');
 const utils = require('@sankhyalabs/ezui/dist/collection/utils');
-const constants = require('./constants-35ddd366.js');
+const constants = require('./constants-241934b3.js');
 const taskbarElements = require('./taskbar-elements-9ad1f9c0.js');
 require('./DataFetcher-65879b2c.js');
 require('./pesquisa-fetcher-36d039c4.js');
-const ContinuousInsertUtils = require('./ContinuousInsertUtils-b5de47db.js');
+const ContinuousInsertUtils = require('./ContinuousInsertUtils-fff67c94.js');
 const index = require('./index-1dfc7a6e.js');
 require('./ISave-e91b70a7.js');
 require('@sankhyalabs/ezui/dist/collection/utils/constants');
@@ -19,7 +19,7 @@ require('./filter-item-type.enum-a7ffdaa6.js');
 const formConfigFetcher = require('./form-config-fetcher-90126e4c.js');
 const fieldSearch = require('./field-search-68e34bf4.js');
 const ConfigStorage = require('./ConfigStorage-d024aec8.js');
-const SnkFormConfigManager = require('./SnkFormConfigManager-07f747be.js');
+const SnkFormConfigManager = require('./SnkFormConfigManager-c11d8468.js');
 const GetSelectedRecordsIDsInfo = require('./GetSelectedRecordsIDsInfo-bd50caf1.js');
 const index$2 = require('./index-102ba62d.js');
 require('./PrintUtils-bcaeb82f.js');

package/dist/cjs/snk-tab-config.cjs.entry.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-f9e81701.js');
 const Sortable = require('./Sortable-fb1c4cbb.js');
 const core = require('@sankhyalabs/core');
-const constants = require('./constants-35ddd366.js');
+const constants = require('./constants-241934b3.js');
 
 const snkTabConfigCss = "@keyframes activate{0%{clip-path:inset(calc(100% - 3px) 50% 0px 50%)}100%{clip-path:inset(calc(100% - 3px) 0px 0px 0px)}}.sc-snk-tab-config-h{--snk-tab-config--backward-icon:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"16px\" width=\"10px\"><path d=\"M 9.7808475,13.860393 3.9204526,8.0000004 9.7808475,2.0624965 7.9301965,0.28895552 0.21915255,8.0000004 7.9301965,15.711044 Z\"/></svg>');--snk-tab-config--forward-icon:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"16px\" width=\"10px\"><path d=\"M 0.21915251,13.860393 6.0795475,8.0000007 0.21915251,2.0624968 2.0698036,0.28895588 9.7808475,8.0000007 2.0698036,15.711044 Z\"/></svg>');--snk-tab-config__lower-bar--background-color:var(--color--disable-primary, #e5eaf0);--snk-tab-config__lower-bar--border:2px solid var(--color--disable-primary, #e5eaf0);--snk-tab-config__tab--color:var(--text--primary, #626e82);--snk-tab-config__tab--font-family:var(--font-pattern, \"Roboto\");--snk-tab-config__tab--font-size:var(--title--small, 14px);--snk-tab-config__tab--padding:var(--space--small, 6px) var(--space--medium, 12px);--snk-tab-config__tab-is-active--color:var(--color--primary, #008561);--snk-tab-config__tab-hover--color:var(--color--secondary, #383c45);--snk-tab-config__tab-is-focused--border:1px dashed var(--color--primary, #008561);--snk-tab-config__tab-label--text-shadow:var(--text-shadow, 0 0 0 #353535, 0 0 1px transparent);--snk-tab-config__tab-label--margin-bottom:var(--space--extra-small, 3px);--snk-tab-config__new-button-icon--color:var(--color--secondary-700, #1C1D22);--snk-tab-config__forward-button--background-color:var(--text--primary, #626e82);--snk-tab-config__forward-button-hover--background-color:var(--color--primary, #008561);--snk-tab-config__left-icon--padding-right:var(--space--small, 6px);--snk-tab-config__left-icon--color:var(--text--disable, #AFB6C0);--snk-tab-config__tab-label-disabled--color:var(--text--disable, #AFB6C0);--snk-tab-config__slot--margin-left:var(--space--small, 6px);display:flex;position:relative;width:100%;overflow:hidden}.tab-config__scroll.sc-snk-tab-config{display:flex;width:100%;scroll-behavior:smooth;overflow-x:auto;scrollbar-width:none}.tab-config__lower-bar.sc-snk-tab-config{position:absolute;left:0%;right:0%;top:91%;bottom:0%;border-radius:2px;background-color:var(--snk-tab-config__lower-bar--background-color);border:var(--snk-tab-config__lower-bar--border)}.tab-config__tab.sc-snk-tab-config{display:flex;border:none;background-color:unset;cursor:pointer;align-items:center;justify-content:center;min-width:fit-content;color:var(--snk-tab-config__tab--color);font-family:var(--snk-tab-config__tab--font-family);font-size:var(--snk-tab-config__tab--font-size);padding:var(--snk-tab-config__tab--padding)}.tab-config__tab.sc-snk-tab-config:focus,.tab-config__forward-button.sc-snk-tab-config,.tab-config__backward-button.sc-snk-tab-config{outline:none}.tab-config__tab--is-active.sc-snk-tab-config{position:relative;color:var(--snk-tab-config__tab-is-active--color)}.tab-config__tab.sc-snk-tab-config:hover{color:var(--snk-tab-config__tab-hover--color)}.tab-config__tab--is-active.sc-snk-tab-config:hover{color:var(--snk-tab-config__tab-is-active--color)}.tab-config__tab--is-active.sc-snk-tab-config::after{content:\"\";position:absolute;width:100%;height:100%;clip-path:inset(calc(100% - 3px) 0px 0px 0px);animation:activate 0.25s ease-in-out;background-color:var(--snk-tab-config__tab-is-active--color)}.tab-config__tab--is-focused.sc-snk-tab-config{border:var(--snk-tab-config__tab-is-focused--border)}.tab-config__tab-label.sc-snk-tab-config{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-shadow:var(--snk-tab-config__tab-label--text-shadow);margin-bottom:var(--snk-tab-config__tab-label--margin-bottom)}.tab-config__forward-button.sc-snk-tab-config,.tab-config__backward-button.sc-snk-tab-config{position:absolute;z-index:1;display:flex;box-sizing:border-box;padding:0px;top:0px;right:0px;width:16px;height:100%;border:none;background-color:unset;cursor:pointer;justify-content:center;align-items:center}.tab-config__new-button.sc-snk-tab-config{position:absolute;z-index:1;display:flex;box-sizing:border-box;padding:0px;top:0px;right:0px;height:100%;border:none;background-color:unset;cursor:pointer;justify-content:center;align-items:center}.tab-config__new-button.sc-snk-tab-config ez-icon.sc-snk-tab-config{--ez-icon--color:var(--snk-tab-config__new-button-icon--color)}.tab-config__backward-button.sc-snk-tab-config{left:0px;box-shadow:10px 10px 5px 5px white;background:white}.tab-config__forward-button.sc-snk-tab-config{box-shadow:10px 10px 5px 20px white;background:white}.tab-config__forward-button.sc-snk-tab-config::after,.tab-config__backward-button.sc-snk-tab-config::after{content:'';display:flex;width:10px;height:16px;background-color:var(--snk-tab-config__forward-button--background-color)}.tab-config__forward-button.sc-snk-tab-config::after{-webkit-mask-image:var(--snk-tab-config--forward-icon);mask-image:var(--snk-tab-config--forward-icon)}.tab-config__backward-button.sc-snk-tab-config::after{-webkit-mask-image:var(--snk-tab-config--backward-icon);mask-image:var(--snk-tab-config--backward-icon)}.tab-config__forward-button.sc-snk-tab-config:hover::after,.tab-config__backward-button.sc-snk-tab-config:hover::after{background-color:var(--snk-tab-config__forward-button-hover--background-color)}.tab-config__new-button.sc-snk-tab-config:hover ez-icon.sc-snk-tab-config{--ez-icon--color:var(--snk-tab-config__forward-button-hover--background-color)}.tab-config__hidden.sc-snk-tab-config{display:none}.tab-config__scroll.sc-snk-tab-config::-webkit-scrollbar{display:none}.tab-config__left-icon.sc-snk-tab-config{padding-right:var(--snk-tab-config__left-icon--padding-right);--ez-icon--color:var(--snk-tab-config__left-icon--color)}.tab-config__left-icon--eye-off.sc-snk-tab-config{--ez-icon--color:var(--snk-tab-config__left-icon--color)}.tab-config__right-icon.sc-snk-tab-config{visibility:hidden;padding-left:var(--snk-tab-config__left-icon--padding-right)}.tab-config__tab.sc-snk-tab-config:hover .tab-config__right-icon.sc-snk-tab-config{visibility:visible}.tab-config__tab--is-active.sc-snk-tab-config .tab-config__right-icon.sc-snk-tab-config{visibility:visible;--ez-icon--color:var(--snk-tab-config__tab-is-active--color)}.tab-config__tab.sc-snk-tab-config:hover .tab-config__right-icon.sc-snk-tab-config{--ez-icon--color:var(--snk-tab-config__tab-hover--color)}.tab-config__tab--is-active.sc-snk-tab-config:hover .tab-config__right-icon.sc-snk-tab-config{--ez-icon--color:var(--snk-tab-config__tab-is-active--color)}.tab-config__actions-button.sc-snk-tab-config{--ez-actions-button__btn-action--min-width:100px;visibility:hidden;opacity:0;transition:visibility 1s linear, opacity 0.3s linear}.tab-config__tab.sc-snk-tab-config:hover .tab-config__actions-button.sc-snk-tab-config{visibility:visible;opacity:1;transition:visibility 0.2s linear, opacity 0.10s linear}[data-draggable-element].sc-snk-tab-config{cursor:grab}.tab-config__tab-label-disabled.sc-snk-tab-config{color:var(--snk-tab-config__tab-label-disabled--color)}.tab-config__slot.sc-snk-tab-config{margin-left:var(--snk-tab-config__slot--margin-left)}";
 

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

@@ -1,4 +1,6 @@
 :host {
+  --scrim-z-index: var(--elevation--100, 100);
+
   display: flex;
   flex-direction: column;
   height: 100%;

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

@@ -17,6 +17,7 @@ import Workspace from "../../lib/workspace/workspace";
 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";
 /**
  * É 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.
@@ -31,12 +32,14 @@ export class SnkApplication {
     this._duCache = new Map();
     this._duPromises = new Map();
     this._requestListener = RequestListenerFactory.create({ strategy: 'request_time' });
-    this._maxTimeLockAppLoading = 10000;
+    this._maxTimerAppLoading = 10000;
     this._isBrowserTypeElectron = false;
     this._pendingActions = new Map;
     this._loadPkParameter = null;
     this._isLoadedByPk = false;
     this._applicationReady = false;
+    this._templateSkeleton = TEMPLATES_SKELETON.GRID;
+    this._activeScrimWindow = false;
     this.enableLockManagerLoadingApp = undefined;
     this.messagesBuilder = undefined;
     this.configName = undefined;
@@ -532,12 +535,20 @@ export class SnkApplication {
     });
     PreloadManager.removeRecords(dataUnit, records);
   }
-  getCountSkeleton(className, skeletonHeight, spacingSkeleton) {
-    let containerHeight = window.innerHeight - 350;
-    spacingSkeleton = !spacingSkeleton ? 20 : spacingSkeleton;
-    let skeletonCount = Math.floor(containerHeight / (skeletonHeight + spacingSkeleton));
+  getCountSkeleton(skeletonHeight, spacingSkeleton, headerHeight) {
+    headerHeight = headerHeight || 160;
+    const containerHeight = window.innerHeight - headerHeight;
+    const skeletonSpacing = spacingSkeleton || 10;
+    const totalHeightPerSkeleton = skeletonHeight + skeletonSpacing;
+    const skeletonCount = Math.floor(containerHeight / totalHeightPerSkeleton) - 1;
     return skeletonCount || 1;
   }
+  getSkeletonRandomWidth() {
+    const min = 30;
+    const max = 100;
+    const randomWidth = Math.floor(Math.random() * (max - min + 1)) + min;
+    return `${randomWidth}%`;
+  }
   async getAuthList(auth) {
     return await (new MGEAuthorization()).parseFromJSON(auth);
   }
@@ -1019,6 +1030,8 @@ export class SnkApplication {
     this.removeShortcuts();
     if (this._lockManagerTimer)
       clearTimeout(this._lockManagerTimer);
+    if (this._scrimWindowTimer)
+      clearTimeout(this._scrimWindowTimer);
   }
   async componentDidLoad() {
     this.applicationLoading.emit(true);
@@ -1038,18 +1051,39 @@ export class SnkApplication {
       this._applicationReady = true;
     }
   }
-  async markToReload() {
+  async showScrimApp(active) {
+    if (!this.enableLockManagerLoadingApp || !this._applicationReady || !active) {
+      this._activeScrimWindow = false;
+      if (this._scrimWindowTimer)
+        clearTimeout(this._scrimWindowTimer);
+      return;
+    }
+    this._activeScrimWindow = true;
+    this._scrimWindowTimer = setTimeout(async () => {
+      if (this._activeScrimWindow) {
+        this._activeScrimWindow = false;
+        clearTimeout(this._scrimWindowTimer);
+      }
+    }, this._maxTimerAppLoading);
+  }
+  async changeTemplateSkeleton(templateSkeletonType) {
+    this._templateSkeleton = templateSkeletonType ? templateSkeletonType : this._templateSkeleton;
+  }
+  async markToReload(templateSkeletonType) {
     if (!this.enableLockManagerLoadingApp)
       return;
+    await this.changeTemplateSkeleton(templateSkeletonType);
     this._applicationReady = false;
     await LockManager.resetLocks(this._element, LockManagerOperation.APP_LOADING);
     this.resolveApplicationReady();
   }
-  async addLoadingLock(forceReady = false) {
+  async addLoadingLock(forceReady = false, templateSkeletonType) {
     if (!this.enableLockManagerLoadingApp)
       return;
+    await this.changeTemplateSkeleton(templateSkeletonType);
     if (forceReady) {
       this._applicationReady = false;
+      this._activeScrimWindow = this._applicationReady ? true : false;
       await LockManager.resetLocks(this._element, LockManagerOperation.APP_LOADING);
     }
     this.resolveApplicationReady();
@@ -1087,7 +1121,7 @@ export class SnkApplication {
         this.stopTimeoutLockManager();
         this._applicationReady = true;
       }
-    }, this._maxTimeLockAppLoading);
+    }, this._maxTimerAppLoading);
   }
   initKeyboardManager() {
     this._keyboardManager
@@ -1101,19 +1135,26 @@ export class SnkApplication {
       .unbind("ctrl + d")
       .unbind("F1");
   }
-  // TODO: Etapa 2 - implementar template de loading
-  renderLoadingSkeleton(template) {
+  renderLoadingSkeleton() {
     if (!this.enableLockManagerLoadingApp)
       return;
     if (this._isBrowserTypeElectron) {
       return this.getSpinnerLoadingDefault();
     }
-    switch (template) {
-      case TEMPLATES_LOADING_SKELETON.APPLICATION:
-      case TEMPLATES_LOADING_SKELETON.GRID:
-        return this.getSkeletonTemplateApplication();
-      default:
-        return this.getSkeletonTemplateApplication();
+    else {
+      switch (this._templateSkeleton) {
+        case TEMPLATES_SKELETON.CUSTOM_TEMPLATE:
+        case TEMPLATES_SKELETON.GRID:
+          return this.getSkeletonTemplateGrid();
+        case TEMPLATES_SKELETON.GRID_WITH_SIDEBAR:
+          return this.getSkeletonTemplateGridWithSidebar();
+        case TEMPLATES_SKELETON.GRID_WITH_PANEL:
+          return this.getSkeletonTemplateGridWithPanel();
+        case TEMPLATES_SKELETON.FORM_WITH_SIDEBAR:
+          return this.getSkeletonTemplateFormWithSidebar();
+        default:
+          return this.getSkeletonTemplateGrid();
+      }
     }
   }
   getLoadingVisibilityStyle() {
@@ -1122,8 +1163,17 @@ export class SnkApplication {
       display: this._applicationReady ? "none" : "unset"
     };
   }
-  getSkeletonTemplateApplication() {
-    return (h("div", { class: "loading-hidden", style: this.getLoadingVisibilityStyle() }, h("div", { class: "ez-margin--medium ez-margin-top--extra-small" }, h("ez-skeleton", { count: 1, variant: "rect", width: "100%", height: "150px", animation: "progress" })), h("div", { class: "ez-flex ez-flex--align-items-stretch skeleton-content" }, h("div", { class: "skeleton-content-left ez-margin--medium" }, h("ez-skeleton", { count: 1, variant: "rect", width: "100%", height: "calc(100% - 15px)", animation: "progress", marginBottom: "20px" })), h("div", { class: "ez-flex-item--auto skeleton-content-right ez-margin--medium" }, h("ez-skeleton", { count: this.getCountSkeleton("skeleton-content-right", 50, 20), variant: "rect", width: "100%", height: "49px", animation: "progress", marginBottom: "20px" }))), h("div", { class: "skeleton-content-footer ez-margin--medium ez-margin-top--extra-small" }, h("ez-skeleton", { count: 1, variant: "rect", width: "100%", height: "100px", animation: "progress" }))));
+  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" })))))));
+  }
+  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" })))));
+  }
+  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" }))))));
+  }
+  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" })))))))))));
   }
   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..."))));
@@ -1132,7 +1182,7 @@ export class SnkApplication {
     return (h(Host, { style: {
         visibility: (!this.enableLockManagerLoadingApp || this._applicationReady) ? "unset" : "hidden",
         overflow: (!this.enableLockManagerLoadingApp || this._applicationReady) ? "unset" : "hidden"
-      } }, h("div", null, h("ez-loading-bar", { ref: (ref) => this._requestListener.ezLoadingBar = ref }), h("ez-popup", { opened: false, ref: (ref) => this._popUp = ref, onEzClosePopup: () => this.closePopUp() }), h("ez-modal", { opened: false, ref: (ref) => this._rightModal = ref, "modal-size": "small", closeOutsideClick: true, closeEsc: true }), this.renderLoadingSkeleton())));
+      } }, h("div", null, h("ez-loading-bar", { ref: (ref) => this._requestListener.ezLoadingBar = ref }), h("ez-popup", { opened: false, ref: (ref) => this._popUp = ref, onEzClosePopup: () => this.closePopUp() }), h("ez-modal", { opened: false, ref: (ref) => this._rightModal = ref, "modal-size": "small", closeOutsideClick: true, closeEsc: true }), this.renderLoadingSkeleton(), this._activeScrimWindow && (h("div", { class: "ez-scrim ez-scrim--light", style: { cursor: "progress", zIndex: "var(--scrim-z-index)" } })))));
   }
   static get is() { return "snk-application"; }
   static get encapsulation() { return "scoped"; }
@@ -1259,7 +1309,9 @@ export class SnkApplication {
   }
   static get states() {
     return {
-      "_applicationReady": {}
+      "_applicationReady": {},
+      "_templateSkeleton": {},
+      "_activeScrimWindow": {}
     };
   }
   static get events() {
@@ -2685,13 +2737,39 @@ export class SnkApplication {
             }]
         }
       },
+      "showScrimApp": {
+        "complexType": {
+          "signature": "(active: boolean) => Promise<void>",
+          "parameters": [{
+              "tags": [],
+              "text": ""
+            }],
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
+          },
+          "return": "Promise<void>"
+        },
+        "docs": {
+          "text": "",
+          "tags": []
+        }
+      },
       "markToReload": {
         "complexType": {
-          "signature": "() => Promise<void>",
-          "parameters": [],
+          "signature": "(templateSkeletonType?: TEMPLATES_SKELETON) => Promise<void>",
+          "parameters": [{
+              "tags": [],
+              "text": ""
+            }],
           "references": {
             "Promise": {
               "location": "global"
+            },
+            "TEMPLATES_SKELETON": {
+              "location": "import",
+              "path": "../../lib/utils/constants"
             }
           },
           "return": "Promise<void>"
@@ -2703,14 +2781,21 @@ export class SnkApplication {
       },
       "addLoadingLock": {
         "complexType": {
-          "signature": "(forceReady?: boolean) => Promise<() => void>",
+          "signature": "(forceReady?: boolean, templateSkeletonType?: TEMPLATES_SKELETON) => Promise<() => void>",
           "parameters": [{
               "tags": [],
               "text": ""
+            }, {
+              "tags": [],
+              "text": ""
             }],
           "references": {
             "Promise": {
               "location": "global"
+            },
+            "TEMPLATES_SKELETON": {
+              "location": "import",
+              "path": "../../lib/utils/constants"
             }
           },
           "return": "Promise<() => void>"
@@ -2736,8 +2821,3 @@ class PendingPromise {
     this.reject = reject;
   }
 }
-var TEMPLATES_LOADING_SKELETON;
-(function (TEMPLATES_LOADING_SKELETON) {
-  TEMPLATES_LOADING_SKELETON[TEMPLATES_LOADING_SKELETON["APPLICATION"] = 1] = "APPLICATION";
-  TEMPLATES_LOADING_SKELETON[TEMPLATES_LOADING_SKELETON["GRID"] = 2] = "GRID";
-})(TEMPLATES_LOADING_SKELETON || (TEMPLATES_LOADING_SKELETON = {}));

package/dist/collection/lib/index.js

@@ -12,3 +12,4 @@ export { default as GridConfigFetcher } from './http/data-fetcher/fetchers/grid-
 export { default as ParametersFetcher } from './http/data-fetcher/fetchers/parameters-fecher';
 export { default as PersonalizedFilterFetcher } from './http/data-fetcher/fetchers/personalized-filter-fetcher';
 export { ResourceFetcher } from './http/data-fetcher/fetchers/resource-fetcher';
+export { TEMPLATES_SKELETON } from './utils/constants';

package/dist/collection/lib/utils/constants.js

@@ -103,3 +103,12 @@ export var SIMPLE_CRUD_MODE;
   SIMPLE_CRUD_MODE[SIMPLE_CRUD_MODE["SERVER"] = 0] = "SERVER";
   SIMPLE_CRUD_MODE[SIMPLE_CRUD_MODE["IN_MEMORY"] = 1] = "IN_MEMORY";
 })(SIMPLE_CRUD_MODE || (SIMPLE_CRUD_MODE = {}));
+// TODO: validar forma de compartilhar os templates com outros projetos
+export var TEMPLATES_SKELETON;
+(function (TEMPLATES_SKELETON) {
+  TEMPLATES_SKELETON[TEMPLATES_SKELETON["CUSTOM_TEMPLATE"] = 0] = "CUSTOM_TEMPLATE";
+  TEMPLATES_SKELETON[TEMPLATES_SKELETON["GRID"] = 1] = "GRID";
+  TEMPLATES_SKELETON[TEMPLATES_SKELETON["GRID_WITH_SIDEBAR"] = 2] = "GRID_WITH_SIDEBAR";
+  TEMPLATES_SKELETON[TEMPLATES_SKELETON["GRID_WITH_PANEL"] = 3] = "GRID_WITH_PANEL";
+  TEMPLATES_SKELETON[TEMPLATES_SKELETON["FORM_WITH_SIDEBAR"] = 4] = "FORM_WITH_SIDEBAR";
+})(TEMPLATES_SKELETON || (TEMPLATES_SKELETON = {}));

package/dist/components/ContinuousInsertUtils.js

@@ -6,6 +6,7 @@ import { UserInterface as UserInterface$1 } from '@sankhyalabs/core/dist/datauni
 import { P as PreloadManager } from './dataunit-fetcher.js';
 import './filter-item-type.enum.js';
 import './form-config-fetcher.js';
+import './constants.js';
 import InMemoryFilterColumnDataSource from '@sankhyalabs/ezui/dist/collection/components/ez-grid/utils/InMemoryFilterColumnDataSource';
 import { h } from '@stencil/core/internal/client';
 

package/dist/components/SnkFormConfigManager.js

@@ -1,7 +1,7 @@
 import { C as ConfigStorage } from './ConfigStorage.js';
 import { ObjectUtils, StringUtils } from '@sankhyalabs/core';
 import { F as FormConfigFetcher } from './form-config-fetcher.js';
-import { c as TAB_NAMES } from './constants.js';
+import { d as TAB_NAMES } from './constants.js';
 
 class SnkFormConfigManager {
   constructor(configName, resourceID, onConfigChange, dataUnit) {

package/dist/components/constants.js

@@ -89,5 +89,14 @@ var SIMPLE_CRUD_MODE;
   SIMPLE_CRUD_MODE[SIMPLE_CRUD_MODE["SERVER"] = 0] = "SERVER";
   SIMPLE_CRUD_MODE[SIMPLE_CRUD_MODE["IN_MEMORY"] = 1] = "IN_MEMORY";
 })(SIMPLE_CRUD_MODE || (SIMPLE_CRUD_MODE = {}));
+// TODO: validar forma de compartilhar os templates com outros projetos
+var TEMPLATES_SKELETON;
+(function (TEMPLATES_SKELETON) {
+  TEMPLATES_SKELETON[TEMPLATES_SKELETON["CUSTOM_TEMPLATE"] = 0] = "CUSTOM_TEMPLATE";
+  TEMPLATES_SKELETON[TEMPLATES_SKELETON["GRID"] = 1] = "GRID";
+  TEMPLATES_SKELETON[TEMPLATES_SKELETON["GRID_WITH_SIDEBAR"] = 2] = "GRID_WITH_SIDEBAR";
+  TEMPLATES_SKELETON[TEMPLATES_SKELETON["GRID_WITH_PANEL"] = 3] = "GRID_WITH_PANEL";
+  TEMPLATES_SKELETON[TEMPLATES_SKELETON["FORM_WITH_SIDEBAR"] = 4] = "FORM_WITH_SIDEBAR";
+})(TEMPLATES_SKELETON || (TEMPLATES_SKELETON = {}));
 
-export { ACTION_CONFIG as A, CONFIG_EVENTS as C, DEFAULT_TYPE as D, KEY_EVENTS as K, ORDER_VALUES as O, REPORT_LAUNCHER_RESOURCE_ID as R, SIMPLE_CRUD_MODE as S, TAGS_BY_TYPE as T, VIEW_MODE as V, VARS_BY_TYPE as a, CONFIG_SORTABLE_EVENTS as b, TAB_NAMES as c, TYPE_ACTIONS as d };
+export { ACTION_CONFIG as A, CONFIG_EVENTS as C, DEFAULT_TYPE as D, KEY_EVENTS as K, ORDER_VALUES as O, REPORT_LAUNCHER_RESOURCE_ID as R, SIMPLE_CRUD_MODE as S, TEMPLATES_SKELETON as T, VIEW_MODE as V, VARS_BY_TYPE as a, TAGS_BY_TYPE as b, CONFIG_SORTABLE_EVENTS as c, TAB_NAMES as d, TYPE_ACTIONS as e };

package/dist/components/pesquisa-grid2.js

@@ -7,6 +7,7 @@ import '@sankhyalabs/ezui/dist/collection/utils/constants';
 import '@sankhyalabs/core/dist/dataunit/metadata/UnitMetadata';
 import './filter-item-type.enum.js';
 import './form-config-fetcher.js';
+import './constants.js';
 
 const pesquisaGridCss = ".sc-pesquisa-grid-h{background:var(--background--xlight, #FFF);overflow-x:auto}ez-grid.sc-pesquisa-grid{--ez-grid__container--shadow:none;--ez-grid__header--shadow:none}";
 

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

@@ -8,6 +8,7 @@ import '@sankhyalabs/core/dist/dataunit/metadata/UnitMetadata';
 import './dataunit-fetcher.js';
 import './filter-item-type.enum.js';
 import './form-config-fetcher.js';
+import './constants.js';
 import { g as getSelectedRecordsIDsInfo } from './GetSelectedRecordsIDsInfo.js';
 import { R as ResourceIDUtils } from './ResourceIDUtils.js';