@sankhyalabs/ezui 7.2.0-rc.8 → 7.2.0

package/dist/esm/ez-grid-pagination.entry.js

@@ -1,17 +1,45 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-baa5e267.js';
-import { i as initI18n } from './index-a031816b.js';
+import { i as initI18n } from './index-b5a15d4b.js';
 import { Action, ElementIDUtils } from '@sankhyalabs/core';
 
-const ezGridPaginationCss = ":host{display:block}.pagination__container{display:flex;align-items:center;flex-grow:1;flex-shrink:1;flex-wrap:nowrap;justify-content:flex-end}.pagination__buttons-container{display:flex;border-radius:50%;background-color:var(--color--ocean-green-90, #E1E2E5);cursor:pointer}.pagination__buttons-container ez-icon{--ez-icon--color:var(--color--ocean-green-600, #008561)}.pagination__buttons-container.disabled{background-color:#DEDEDE;cursor:not-allowed;pointer-events:auto}.pagination__buttons-container.disabled ez-icon{--ez-icon--color:var(--color--petroleum-300, #848D9C);pointer-events:none}.pagination__page-navigator{display:flex;align-items:center}.pagination__row-summary-panel{font-size:var(--font-size--default, 14px);font-family:var(--font--pattern, 'Roboto');color:var(--color--petroleum-300, #848D9C);font-weight:var(--font-weight--regular, 400);padding:var(--space--8, 8px) var(--space--16, 16px)}.pagination__page-summary-panel{display:flex;align-items:center;padding:var(--space--8, 8px) var(--space--16, 16px);gap:var(--space--4, 4px)}.pagination__container-label{margin:0 var(--space--8, 8px)}.pagination-contracted{width:100px}.pagination-expanded{min-width:150px}.pagination__label{font-family:var(--font--pattern, 'Roboto');color:var(--color--petroleum-300, #848D9C);font-weight:var(--font-weight--regular, 400);width:100%;white-space:nowrap}.cancel-pagination{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:var(--space--4, 4px);padding:var(--space--8, 8px)}.spin{animation-name:spin;animation-duration:5000ms;animation-iteration-count:infinite;animation-timing-function:linear}@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}.cancel-pagination-btn{color:var(--color--red-600, #BD0025);font-size:var(--font-size--medium, 16px);font-weight:var(--font-weight--semi-bold, 600);font-family:var(--font--pattern, 'Roboto');text-wrap:nowrap;cursor:pointer}.pagination-text-right{flex-direction:row-reverse}";
+const ASK_CANCEL_PAGINATION_EVENT = 'ez-grid-pagination:ask-cancel';
+
+const ezGridPaginationCss = ":host{display:block}.pagination__container{display:flex;align-items:center;flex-grow:1;flex-shrink:1;flex-wrap:nowrap;justify-content:flex-end;position:relative}ez-popover.cancel-pagination__popover{position:absolute;right:0;bottom:100%;width:0;height:0}.pagination__buttons-container{display:flex;border-radius:50%;background-color:var(--color--ocean-green-90, #E1E2E5);cursor:pointer}.pagination__buttons-container ez-icon{--ez-icon--color:var(--color--ocean-green-600, #008561)}.pagination__buttons-container.disabled{background-color:#DEDEDE;cursor:not-allowed;pointer-events:auto}.pagination__buttons-container.disabled ez-icon{--ez-icon--color:var(--color--petroleum-300, #848D9C);pointer-events:none}.pagination__page-navigator{display:flex;align-items:center}.pagination__row-summary-panel{font-size:var(--font-size--default, 14px);font-family:var(--font--pattern, 'Roboto');color:var(--color--petroleum-300, #848D9C);font-weight:var(--font-weight--regular, 400);padding:var(--space--8, 8px) var(--space--16, 16px)}.pagination__page-summary-panel{display:flex;align-items:center;padding:var(--space--8, 8px) var(--space--16, 16px);gap:var(--space--4, 4px)}.pagination__container-label{margin:0 var(--space--8, 8px)}.pagination-contracted{width:100px}.pagination-expanded{min-width:150px}.pagination__label{font-family:var(--font--pattern, 'Roboto');color:var(--color--petroleum-300, #848D9C);font-weight:var(--font-weight--regular, 400);width:100%;white-space:nowrap}.cancel-pagination{display:flex;flex-direction:column;padding:var(--space--12, 12px);gap:var(--space--16, 16px);min-width:304px;max-width:180px;transition:min-width 220ms cubic-bezier(0.4, 0, 0.2, 1),\n              max-width 220ms cubic-bezier(0.4, 0, 0.2, 1);overflow:hidden}.cancel-pagination--expanded{min-width:304px}.cancel-pagination__expanded{animation:cancel-pagination-fade-in 220ms cubic-bezier(0.4, 0, 0.2, 1) 60ms both}@keyframes cancel-pagination-fade-in{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.cancel-pagination__trigger{display:flex;flex-direction:row;align-items:center;gap:var(--space--16, 16px);padding:var(--space--4, 4px);border-radius:var(--border-radius--small, 4px);cursor:pointer;outline:none}.cancel-pagination__trigger:focus-visible{box-shadow:0 0 0 2px var(--color--ocean-green-600, #008561)}.cancel-pagination__trigger--expanded{cursor:default;padding-bottom:var(--space--4, 4px)}.cancel-pagination__divider{border:0;border-top:1px solid var(--color--petroleum-100, #C8CCD3);width:100%}.cancel-pagination__label{color:var(--color--petroleum-700, #2E3742);font-size:var(--font-size--medium, 16px);font-weight:var(--font-weight--semi-bold, 600);font-family:var(--font--pattern, 'Roboto');white-space:nowrap}.cancel-pagination__expanded{display:flex;flex-direction:column;gap:var(--space--8, 8px)}.cancel-pagination__message{color:var(--color--petroleum-500, #4A5567);font-size:var(--font-size--default, 14px);font-family:var(--font--pattern, 'Roboto');font-weight:var(--font-weight--regular, 400);margin:0;line-height:1.4}.cancel-pagination__question{color:var(--color--petroleum-700, #2E3742);font-size:var(--font-size--default, 14px);font-family:var(--font--pattern, 'Roboto');font-weight:var(--font-weight--semi-bold, 600);margin-top:16px;margin-bottom:8px}.cancel-pagination__checkbox{display:flex;flex-direction:row;align-items:center;gap:var(--space--8, 8px);color:var(--color--petroleum-700, #2E3742);font-size:var(--font-size--default, 14px);font-family:var(--font--pattern, 'Roboto');cursor:pointer}.cancel-pagination__checkbox input[type=\"checkbox\"]{cursor:pointer;accent-color:var(--color--ocean-green-600, #008561)}.cancel-pagination__actions{display:flex;flex-direction:row;justify-content:flex-end;gap:var(--space--8, 8px);padding-top:var(--space--4, 4px)}.spin{animation-name:spin;animation-duration:5000ms;animation-iteration-count:infinite;animation-timing-function:linear;--ez-icon--color:var(--color--ocean-green-600, #008561)}@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}.pagination-text-right{flex-direction:row-reverse}";
 
 const EzGridPagination = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
     this.pageChange = createEvent(this, "pageChange", 7);
     this._dataUnitInitialized = false;
+    this._pendingResolve = null;
+    this._collapseTimeout = null;
+    this._suppressedUntilNextAsk = false;
+    this._hoverEnabled = false;
+    this.handleLoadAllChange = (event) => {
+      const target = event.target;
+      this.loadAll = target.checked;
+    };
+    this.handleAskCancelPagination = (event) => {
+      const detail = event.detail;
+      if (!detail || !this.dataUnit)
+        return;
+      if (detail.dataUnitName !== this.dataUnit.name)
+        return;
+      this.resolvePending('CONTINUE');
+      this._pendingResolve = detail.resolve;
+      this._suppressedUntilNextAsk = false;
+      this._hoverEnabled = true;
+      this.loadAll = false;
+      const popover = this._cancelPaginationPopoverElement;
+      if (popover && !popover.opened && typeof popover.showAbove === 'function') {
+        popover.showAbove({ bottom: '4px', right: '4px' });
+      }
+    };
     this.paginationInfo = undefined;
     this.leftButtonDisabled = undefined;
     this.rightButtonDisabled = undefined;
+    this.expanded = false;
+    this.loadAll = false;
     this.paginationCounterMode = 'auto';
     this.dataUnit = undefined;
     this.paginationTextPosition = 'left';
@@ -99,22 +127,54 @@ const EzGridPagination = class {
     this.setStatusButtonPagination();
     this.pageChange.emit(direction);
   }
-  async handleCancelPagination() {
-    var _a;
+  resolvePending(response) {
+    if (!this._pendingResolve)
+      return;
+    const resolve = this._pendingResolve;
+    this._pendingResolve = null;
+    resolve(response);
+  }
+  async handleCancelAction() {
     if (!this.dataUnit)
       return;
     this.dataUnit.cancelPagination = true;
-    await ((_a = this._cancelPaginationPopoverElement) === null || _a === void 0 ? void 0 : _a.hide());
+    this.resolvePending('CANCEL');
+    this._suppressedUntilNextAsk = true;
+    this.collapse();
+    const popover = this._cancelPaginationPopoverElement;
+    if (popover && typeof popover.hide === 'function') {
+      await popover.hide();
+    }
+  }
+  async handleContinueAction() {
+    const response = this.loadAll ? 'LOAD_ALL' : 'CONTINUE';
+    this.resolvePending(response);
+    this._suppressedUntilNextAsk = true;
+    this.loadAll = false;
+    this.collapse();
+    const popover = this._cancelPaginationPopoverElement;
+    if (popover && typeof popover.hide === 'function') {
+      await popover.hide();
+    }
   }
   handleShowCancelPagination() {
-    var _a, _b, _c;
+    const popover = this._cancelPaginationPopoverElement;
     if (!this.hasToShowCancelPagination()) {
-      (_a = this._cancelPaginationPopoverElement) === null || _a === void 0 ? void 0 : _a.hide();
+      if (this._pendingResolve)
+        return;
+      if (popover && typeof popover.hide === 'function')
+        popover.hide();
+      this._hoverEnabled = false;
+      this.collapse();
       return;
     }
-    if ((_b = this._cancelPaginationPopoverElement) === null || _b === void 0 ? void 0 : _b.opened)
+    if (this._suppressedUntilNextAsk)
+      return;
+    if (popover === null || popover === void 0 ? void 0 : popover.opened)
       return;
-    (_c = this._cancelPaginationPopoverElement) === null || _c === void 0 ? void 0 : _c.show('15px');
+    if (popover && typeof popover.showAbove === 'function') {
+      popover.showAbove({ bottom: '4px', right: '4px' });
+    }
   }
   hasToShowCancelPagination() {
     if (!this.dataUnit || !this.paginationInfo)
@@ -122,6 +182,30 @@ const EzGridPagination = class {
     const hasMore = this.paginationInfo.total === undefined;
     return !this.dataUnit.cancelPagination && hasMore && this.paginationInfo.count > this.dataUnit.pageSize;
   }
+  expand() {
+    if (!this._hoverEnabled)
+      return;
+    if (this._collapseTimeout) {
+      clearTimeout(this._collapseTimeout);
+      this._collapseTimeout = null;
+    }
+    this.expanded = true;
+  }
+  collapse() {
+    if (this._collapseTimeout) {
+      clearTimeout(this._collapseTimeout);
+      this._collapseTimeout = null;
+    }
+    this.expanded = false;
+  }
+  scheduleCollapse() {
+    if (this._collapseTimeout)
+      clearTimeout(this._collapseTimeout);
+    this._collapseTimeout = setTimeout(() => {
+      this._collapseTimeout = null;
+      this.expanded = false;
+    }, 120);
+  }
   setPaginationInfo() {
     if (!this.dataUnit) {
       this.paginationInfo = null;
@@ -172,10 +256,21 @@ const EzGridPagination = class {
       ElementIDUtils.addIDInfo(this._element);
     }
   }
+  renderCollapsedTrigger() {
+    return (h("div", { class: "cancel-pagination__trigger" }, h("ez-icon", { iconName: "sync", size: "x-large", class: "spin" }), h("span", { class: "cancel-pagination__label" }, this.i18n('ez-grid-pagination.paginationLabel'))));
+  }
+  renderExpandedContent() {
+    return (h("div", { class: "cancel-pagination__expanded", role: "group", "aria-label": this.i18n('ez-grid-pagination.paginationLabel') }, h("div", { class: "cancel-pagination__trigger cancel-pagination__trigger--expanded" }, h("ez-icon", { iconName: "ellipsis-circle", size: "large", class: "spin" }), h("span", { class: "cancel-pagination__label" }, this.i18n('ez-grid-pagination.paginationLabel'))), h("hr", { class: "cancel-pagination__divider", "aria-hidden": "true" }), h("p", { class: "cancel-pagination__message" }, this.i18n('ez-grid-pagination.largeLoad.line1')), h("p", { class: "cancel-pagination__message" }, this.i18n('ez-grid-pagination.largeLoad.line2')), h("p", { class: "cancel-pagination__question" }, this.i18n('ez-grid-pagination.largeLoad.line3')), h("label", { class: "cancel-pagination__checkbox" }, h("input", { type: "checkbox", checked: this.loadAll, onChange: this.handleLoadAllChange }), h("span", null, this.i18n('ez-grid-pagination.largeLoad.loadAll'))), h("div", { class: "cancel-pagination__actions" }, h("ez-button", { class: "cancel-pagination__continue-btn", label: this.i18n('ez-grid-pagination.largeLoad.continue'), size: "small", onClick: () => this.handleContinueAction() }), h("ez-button", { class: "cancel-pagination__cancel-btn ez-button--primary", label: this.i18n('ez-grid-pagination.largeLoad.cancel'), size: "small", onClick: () => this.handleCancelAction() }))));
+  }
   renderCancelPagination() {
-    return (h("ez-popover", { ref: (element) => (this._cancelPaginationPopoverElement = element), "overlay-type": "none", autoClose: false }, h("div", { class: 'cancel-pagination' }, h("ez-icon", { iconName: "sync", size: "x-large", class: "spin" }), h("span", { onClick: () => this.handleCancelPagination(), class: 'cancel-pagination-btn' }, this.i18n('ez-grid-pagination.cancelPagination')))));
+    return (h("ez-popover", { class: "cancel-pagination__popover", ref: (element) => (this._cancelPaginationPopoverElement = element), "overlay-type": "none", autoClose: false }, h("div", { class: {
+        'cancel-pagination': true,
+        'cancel-pagination--expanded': this.expanded,
+      }, onMouseEnter: () => this.expand(), onMouseLeave: () => this.scheduleCollapse() }, this.expanded ? this.renderExpandedContent() : this.renderCollapsedTrigger())));
   }
   async connectedCallback() {
+    this._askCancelListenerBound = this.handleAskCancelPagination.bind(this);
+    document.addEventListener(ASK_CANCEL_PAGINATION_EVENT, this._askCancelListenerBound);
     this.i18n = await initI18n();
     this.initializeDataUnit();
   }
@@ -183,6 +278,15 @@ const EzGridPagination = class {
     this.addInfoId();
   }
   disconnectedCallback() {
+    if (this._askCancelListenerBound) {
+      document.removeEventListener(ASK_CANCEL_PAGINATION_EVENT, this._askCancelListenerBound);
+      this._askCancelListenerBound = undefined;
+    }
+    if (this._collapseTimeout) {
+      clearTimeout(this._collapseTimeout);
+      this._collapseTimeout = null;
+    }
+    this.resolvePending('CONTINUE');
     if (this.dataUnit && this._dataUnitInitialized && this._dataUnitObserverBound) {
       this.dataUnit.unsubscribe(this._dataUnitObserverBound);
     }

package/dist/esm/ez-grid.entry.js

@@ -1,13 +1,13 @@
 import { h, r as registerInstance, c as createEvent, H as Host, g as getElement } from './index-baa5e267.js';
 import { Action, DataUnit, ObjectUtils as ObjectUtils$1, UserInterface, HTMLBuilder, ApplicationContext, StringUtils as StringUtils$1, LockManager, LockManagerOperation, DataType, NumberUtils as NumberUtils$1, MaskFormatter, SortMode, ElementIDUtils, ColumnFilterManager as ColumnFilterManager$1, DateUtils as DateUtils$1, ArrayUtils as ArrayUtils$1, FieldComparator, JSUtils, KeyboardManager } from '@sankhyalabs/core';
 import { SelectionMode } from '@sankhyalabs/core/dist/dataunit/DataUnit';
-import { A as ApplicationUtils } from './ApplicationUtils-e99e53c8.js';
+import { A as ApplicationUtils } from './ApplicationUtils-29d2709c.js';
 import './DialogType-54a62731.js';
 import './CheckMode-bdb2ec19.js';
-import { g as getI18n, i as initI18n } from './index-a031816b.js';
+import { g as getI18n, i as initI18n } from './index-b5a15d4b.js';
 import { C as CustomEditorSource, a as CustomRenderSource } from './types-6f6b2650.js';
 import './FormLayout-bda67973.js';
-import { b as buildFieldMetadata, R as RecordValidationProcessor, D as DataBinder, S as SHORTCUT_SEARCH_FIELD, f as focusOnFieldSerch, c as SEARCH_FIELD_FULL_WIDTH, a as buildFieldSearch } from './search-column-33d72c20.js';
+import { b as buildFieldMetadata, R as RecordValidationProcessor, D as DataBinder, S as SHORTCUT_SEARCH_FIELD, f as focusOnFieldSerch, c as SEARCH_FIELD_FULL_WIDTH, a as buildFieldSearch } from './search-column-9414ad22.js';
 import { D as DISTINCT_FILTER_NAME_PREFIX, E as EZ_GRID_LOADING_SOURCE, P as PRESENTATION_COL_ID_PROP_NAME, a as PRESENTATION_FROM_COL_PROP_NAME } from './constants-3fabe81e.js';
 import { F as FocusResolver } from './FocusResolver-1ccbf850.js';
 import { p as purify } from './purify-ff423562.js';
@@ -64256,8 +64256,8 @@ class AgGridController {
     this.BLOCK_LOAD_DEBOUNCE = 100;
     this.DEFAULT_FONT_SIZE = 8;
     this.DEFAULT_FONT_SIZE_HTML5 = 32;
-    this.DEFAULT_ICON_SIZE = 12;
-    this.DEFAULT_MAX_SIZE = 200;
+    this.DEFAULT_ICON_SIZE = 40;
+    this.DEFAULT_MAX_SIZE = 300;
     this.MULTI_VALUES_PROP = '__multiValues';
     this._menuItems = [];
     this._idAttribName = '__record__id__';
@@ -65427,12 +65427,13 @@ class AgGridController {
     }
   }
   onCallStateChange(type, e) {
+    var _a, _b;
     const finished = !('finished' in e) || e['finished'];
     if (finished && this._columnStateChangeCallback) {
       let info = {};
       let isUserChange = this.isUIEvent(e['source'], e['type']);
       if (type === 'columnResize') {
-        info['column'] = { colId: e['column'].colId, actualWidth: e['column'].actualWidth };
+        info['column'] = { colId: (_a = e['column']) === null || _a === void 0 ? void 0 : _a.colId, actualWidth: (_b = e['column']) === null || _b === void 0 ? void 0 : _b.actualWidth };
       }
       info['isUserChange'] = isUserChange;
       info['isElementResize'] = this.isElementResize(e);
@@ -65812,7 +65813,7 @@ class InMemoryFilterColumnDataSource {
   }
 }
 
-const ezGridCss = ".sc-ez-grid-h{display:grid;grid-template-rows:auto 1fr auto;height:100%;width:100%;--ez-grid__header--background-color:var(--background--xlight, #FFF);--ez-grid__selection-counter--z-index:var(--visible, 1);--ez-grid__container--shadow:var(--shadow);--ez-grid--min-height:300px;--ez-grid__container--shadow--outline:var(--shadow--outline) var(--color--strokes);--ez-grid__header--shadow:var(--shadow--xsmall);--ez-grid__header--shadow--outline:var(--shadow--outline) var(--color--strokes);--ez-grid__header--outline:none;--ez-grid__header--border:none;min-height:var(--ez-grid--min-height)}.grid-header.sc-ez-grid{display:grid;justify-content:space-between;align-items:center;grid-row-start:1;grid-template-columns:1fr;background-color:var(--ez-grid__header--background-color, #FFF)}.grid-header.shadow-mode.sc-ez-grid{box-shadow:var(--ez-grid__header--shadow);border:var(--ez-grid__header--border);outline:var(--ez-grid__header--outline)}.grid-header.outline-mode.sc-ez-grid{box-shadow:var(--ez-grid__header--shadow--outline);border:var(--ez-grid__header--border);outline:var(--ez-grid__header--outline)}.header-overlay.sc-ez-grid{padding-top:15px;margin-top:-12px}.grid__container.sc-ez-grid{outline:none;background-color:var(--ez-grid__header--background-color);border-radius:var(--border--radius-12, 12px) var(--border--radius-12, 12px) 0 0}.grid__container.no-scroll.sc-ez-grid{width:100vw}.sc-ez-grid-h:not([no-header]) .grid__container.sc-ez-grid{border:none}.grid__container.outline-mode.sc-ez-grid{box-shadow:var(--ez-grid__container--shadow--outline);border:none;outline:none}.grid-header__popover.sc-ez-grid{position:relative;top:var(--space--sm, 16px)}.grid-header__container.sc-ez-grid{display:flex;align-items:center;flex-grow:1;flex-shrink:1}.grid-header__position.sc-ez-grid{display:flex;align-items:center;justify-content:space-between}.grid__selection-counter.sc-ez-grid{position:fixed;white-space:nowrap;transform:translate(-50%, 0px);left:50%;opacity:0;bottom:-100%;transition:opacity 0.1s, bottom 0.5s}.grid__selection-counter--opened.sc-ez-grid{opacity:1;bottom:0px}.grid__btn-close.sc-ez-grid{display:flex;align-items:center;justify-content:center;padding:0;outline:none;width:20px;height:20px;border:none;background-color:unset;cursor:pointer}.grid__btn-clear.sc-ez-grid{--ez-button--link-color:var(--color--alert-warning-900, #8C6B00);--ez-button--link--hover-color:var(--color--alert-warning-900, #8C6B00)}[no-header].sc-ez-grid-h .grid-header.sc-ez-grid{height:0;padding:0}.overflowed.sc-ez-grid{display:none}.left__header-contracted.sc-ez-grid{width:auto}.left__header-expanded.sc-ez-grid{flex-grow:1}.grid__footer.sc-ez-grid{background-color:var(--background--xlight, #FFF)}";
+const ezGridCss = ".sc-ez-grid-h{display:grid;grid-template-rows:auto 1fr auto;height:100%;width:100%;--ez-grid__header--background-color:var(--background--xlight, #FFF);--ez-grid__selection-counter--z-index:var(--visible, 1);--ez-grid__container--shadow:var(--shadow);--ez-grid--min-height:300px;--ez-grid__container--shadow--outline:var(--shadow--outline) var(--color--strokes);--ez-grid__header--shadow:var(--shadow--xsmall);--ez-grid__header--shadow--outline:var(--shadow--outline) var(--color--strokes);--ez-grid__header--outline:none;--ez-grid__header--border:none;min-height:var(--ez-grid--min-height)}.grid-header.sc-ez-grid{display:grid;justify-content:space-between;align-items:center;grid-row-start:1;grid-template-columns:1fr;background-color:var(--ez-grid__header--background-color, #FFF)}.grid-header.shadow-mode.sc-ez-grid{box-shadow:var(--ez-grid__header--shadow);border:var(--ez-grid__header--border);outline:var(--ez-grid__header--outline)}.grid-header.outline-mode.sc-ez-grid{box-shadow:var(--ez-grid__header--shadow--outline);border:var(--ez-grid__header--border);outline:var(--ez-grid__header--outline)}.header-overlay.sc-ez-grid{padding-top:15px;margin-top:-12px}.grid__container.sc-ez-grid{outline:none;background-color:var(--ez-grid__header--background-color);border-radius:var(--border--radius-12, 12px) var(--border--radius-12, 12px) 0 0}.grid__container.no-scroll.sc-ez-grid{width:100vw}.sc-ez-grid-h:not([no-header]) .grid__container.sc-ez-grid{border:none}.grid__container.outline-mode.sc-ez-grid{box-shadow:var(--ez-grid__container--shadow--outline);border:none;outline:none}.grid-header__popover.sc-ez-grid{position:relative;top:var(--space--sm, 16px)}.grid-header__container.sc-ez-grid{display:flex;align-items:center;flex-grow:1;flex-shrink:1}.grid-header__position.sc-ez-grid{display:flex;align-items:center;justify-content:space-between}.grid__selection-counter.sc-ez-grid{position:fixed;white-space:nowrap;transform:translate(-50%, 0px);left:50%;opacity:0;bottom:-100%;transition:opacity 0.1s, bottom 0.5s}.grid__selection-counter--opened.sc-ez-grid{opacity:1;bottom:0px}.grid__btn-close.sc-ez-grid{display:flex;align-items:center;justify-content:center;padding:0;outline:none;width:20px;height:20px;border:none;background-color:unset;cursor:pointer}.grid__btn-clear.sc-ez-grid{--ez-button--link-color:var(--color--alert-warning-900, #8C6B00);--ez-button--link--hover-color:var(--color--alert-warning-900, #8C6B00)}[no-header].sc-ez-grid-h .grid-header.sc-ez-grid{height:0;padding:0;border:none;box-shadow:none;outline:none}.overflowed.sc-ez-grid{display:none}.left__header-contracted.sc-ez-grid{width:auto}.left__header-expanded.sc-ez-grid{flex-grow:1}.grid__footer.sc-ez-grid{background-color:var(--background--xlight, #FFF);border-radius:0px 0px var(--border--radius-medium) var(--border--radius-medium)}";
 
 const windowInstace = window;
 const matches = (text, filter) => {

package/dist/esm/ez-guide-navigator.entry.js

@@ -1,7 +1,7 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-baa5e267.js';
 import { ElementIDUtils } from '@sankhyalabs/core';
 import { E as EzScrollDirection } from './EzScrollDirection-2df26c93.js';
-import { i as initI18n } from './index-a031816b.js';
+import { i as initI18n } from './index-b5a15d4b.js';
 
 const ezGuideNavigatorCss = ":host{--ez-guide-navigator--padding-left:var(--space--large);--ez-guide-navigator--padding-right:var(--space--small);--ez-guide-navigator--box-shadow:var(--shadow, 0px 0px 24px 0px #000);--ez-guide-navigator--background-color:var(--color--inverted);--ez-guide-navigator--border-radius:0px var(--border--radius-medium) var(--border--radius-medium) 0px;--ez-guide-navigator--actions-gap:var(--space--medium);--ez-guide-navigator--actions-margin:var(--space--large) 0 var(--space--medium);--ez-guide-navigator--actions-padding-right:calc(var(--space--medium, 12px) + var(--space--small, 6px))}.inverted{transform:rotate(180deg)}.ez-guide-navigator{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;height:100%;padding-left:var(--ez-guide-navigator--padding-left);padding-right:var(--ez-guide-navigator--padding-right);background-color:var(--ez-guide-navigator--background-color);-webkit-box-shadow:var(--ez-guide-navigator--box-shadow);box-shadow:var(--ez-guide-navigator--box-shadow);border-radius:var(--ez-guide-navigator--border-radius)}.ez-guide-navigator__actions{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:var(--ez-guide-navigator--actions-gap);margin:var(--ez-guide-navigator--actions-margin);padding-right:var(--ez-guide-navigator--actions-padding-right)}.hidden{display:none}";