@sankhyalabs/ezui 7.3.3 → 7.3.4-rc.1

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

@@ -5,15 +5,16 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index$1 = require('./index-a7b0c73d.js');
 const core = require('@sankhyalabs/core');
 const DataUnit = require('@sankhyalabs/core/dist/dataunit/DataUnit');
-const ApplicationUtils = require('./ApplicationUtils-5cc05979.js');
+const ApplicationUtils = require('./ApplicationUtils-9a9185fc.js');
 require('./DialogType-2114c337.js');
 require('./CheckMode-ecb90b87.js');
-const index = require('./index-1be40f19.js');
-const FormLayout = require('./FormLayout-18853e70.js');
-const searchColumn = require('./search-column-316e2c59.js');
+const index = require('./index-d4a1cad8.js');
+const types = require('./types-6a5df0c7.js');
+require('./FormLayout-fe8da83c.js');
+const searchColumn = require('./search-column-c04897a9.js');
 const constants = require('./constants-72b7e05e.js');
 const FocusResolver = require('./FocusResolver-885f2173.js');
-const purify = require('./purify-06a8724d.js');
+const purify = require('./purify-ef86f048.js');
 require('./_commonjsHelpers-537d719a.js');
 
 /**
@@ -49667,13 +49668,23 @@ class DataSource {
         });
         this._dataUnit.metadata.fields.forEach(f => {
           var _a, _b, _c, _d, _e, _f;
+          if (f.userInterface === core.UserInterface.IMAGE) {
+            return;
+          }
           if (f.visible !== false && f.name !== this.RECORD_ARCHIVE) {
             const props = new Map();
             const properties = this._dataUnit.getField(f.name).properties;
             for (const value in properties) {
               props.set(value, properties[value]);
             }
-            const col = { label: f.label, name: f.name, userInterface: f.userInterface, options: (_a = this._dataUnit.getField(f.name).properties) === null || _a === void 0 ? void 0 : _a.options, props };
+            const col = {
+              label: f.label,
+              name: f.name,
+              userInterface: f.userInterface,
+              options: (_a = this._dataUnit.getField(f.name).properties) === null || _a === void 0 ? void 0 : _a.options,
+              props,
+              aggFunc: f['aggFunc']
+            };
             columnDefs.push(col);
             if (f.userInterface === core.UserInterface.SEARCHPLUS && ((_b = f.properties) === null || _b === void 0 ? void 0 : _b.DESCRIPTIONFIELD)) {
               const descriptionField = this.getDescriptionField((_c = f.properties) === null || _c === void 0 ? void 0 : _c.DESCRIPTIONFIELD, (_d = f.properties) === null || _d === void 0 ? void 0 : _d.ENTITYNAME);
@@ -50154,7 +50165,7 @@ class EzGridCustomCellEditor extends EzCellEditor {
       charPress: params.charPress,
       currentEditor: this._defaultGui,
       name: this._fieldName,
-      source: FormLayout.CustomEditorSource.GRID,
+      source: types.CustomEditorSource.GRID,
       detailContext: params.customEditorsInfo.detailContext,
       setValue: (value) => this.setValue(value),
       getValue: () => this.getValue(),
@@ -50261,7 +50272,7 @@ class EzGridCustomCellRender extends EzCellRender {
       charPress: '',
       currentRender: super.getGui(),
       name: this._fieldName,
-      source: FormLayout.CustomRenderSource.GRID,
+      source: types.CustomRenderSource.GRID,
       getValue: () => params.getValue(),
       detailContext: params.customRendersInfo.detailContext,
       renderMetadata: {
@@ -64171,6 +64182,54 @@ function _0x15c2(_0x353a9c, _0x3e4a5a) { const _0x53e110 = _0x53e1(); return _0x
 } }(_0x53e1, 0xe8676));
 const agGridLicense = _0xc7632f(0x18c);
 
+const BUILTIN_AGG_FUNCS = {
+  "sum": (params) => params.values.reduce((a, b) => Number(a !== null && a !== void 0 ? a : 0) + Number(b !== null && b !== void 0 ? b : 0), 0),
+  avg: (params) => {
+    const valid = params.values.filter(v => v != null && !Number.isNaN(v));
+    return valid.length
+      ? valid.reduce((a, b) => a + b, 0) / valid.length
+      : null;
+  },
+  min: (params) => {
+    const valid = params.values.filter(v => v != null && !Number.isNaN(v));
+    return valid.length ? Math.min(...valid) : null;
+  },
+  max: (params) => Math.max(...params.values.filter(v => v != null && !Number.isNaN(v))),
+  count: (params) => params.values.filter(v => v != null).length
+};
+function resolveAggFunc(aggFunc) {
+  if (typeof aggFunc === 'function')
+    return aggFunc;
+  const fn = BUILTIN_AGG_FUNCS[aggFunc];
+  if (!fn) {
+    throw new Error(`aggFunc "${aggFunc}" não suportada`);
+  }
+  return fn;
+}
+
+/**
+ * Larguras padrão das colunas do grid por tipo de UserInterface
+ */
+const GRID_COLUMN_DEFAULT_WIDTHS = {
+  [core.UserInterface.SEARCH]: 200,
+  [core.UserInterface.SEARCHPLUS]: 100,
+  [core.UserInterface.DATE]: 120,
+  [core.UserInterface.DATETIME]: 160,
+  [core.UserInterface.TIME]: 100,
+  [core.UserInterface.ELAPSEDTIME]: 100,
+  [core.UserInterface.DECIMALNUMBER]: 130,
+  [core.UserInterface.INTEGERNUMBER]: 120,
+  [core.UserInterface.SWITCH]: 80,
+  [core.UserInterface.FILE]: 100,
+  [core.UserInterface.HTML]: 200,
+  [core.UserInterface.LONGTEXT]: 200,
+  [core.UserInterface.CHECKBOX]: 80,
+  [core.UserInterface.OPTIONSELECTOR]: 100,
+  [core.UserInterface.SHORTTEXT]: 200,
+  [core.UserInterface.PASSWORD]: 100,
+  [core.UserInterface.MASKEDTEXT]: 100,
+};
+
 class AgGridController {
   configFilterColumn(filterColumn) {
     this._filterColumn = filterColumn;
@@ -64196,13 +64255,16 @@ class AgGridController {
     this.DEFAULT_HEADER_ROW_HEIGHT = 32;
     this.CHECK_BOX_COL_ID = 'checkBoxColumn';
     this.STATUS_COL_ID = 'statusColumn';
+    this.COLUMN_FOOTER_OPER = 'gridFooterOper';
     this.RECORD_ARCHIVE_COL_ID = '__RECORD_ARCHIVE__';
     this.BLOCK_LOAD_DEBOUNCE = 100;
-    this.DEFAULT_FONT_SIZE = 14;
+    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.WHEEL_LINE_HEIGHT = 40;
+    this.HORIZONTAL_SCROLL_VIEWPORT_SELECTOR = '.ag-body-horizontal-scroll-viewport';
     this._menuItems = [];
     this._idAttribName = '__record__id__';
     this._gridConfig = [];
@@ -64212,6 +64274,9 @@ class AgGridController {
     this._gridShowDom = false;
     this.peddingExecutionsOnGridShow = [];
     this._lastColsConfig = undefined;
+    this._pinnedBottomDebounceTimer = null;
+    this._pinnedBottomDebounceDelay = 150;
+    this._pinnedBottomPendingArgs = null;
     ModuleRegistry.registerModules([
       EnterpriseCoreModule,
       RangeSelectionModule,
@@ -64394,6 +64459,7 @@ class AgGridController {
       this.setOptionsSupress(this._gridOptions);
       this._gridOptions = this._editionManager.configureGrid(this._gridOptions);
       this._grid = new Grid(container, this._gridOptions);
+      this.enableHorizontalWheelScroll(container);
       const selection = (_a = this._dataUnit) === null || _a === void 0 ? void 0 : _a.getSelectionInfo();
       if (selection === null || selection === void 0 ? void 0 : selection.isAllRecords()) {
         this.selectAll(true);
@@ -64422,6 +64488,140 @@ class AgGridController {
       this.observer.observe(container);
     }
   }
+  onGridReady(evt) {
+    var _a;
+    this._bottomPinnedRowSubscriber = async (action) => {
+      if (action.type === core.Action.DATA_LOADED || action.type === core.Action.PAGINATION_UPDATED) {
+        this.scheduleSetPinnedBottomRow(evt.api, evt.columnApi);
+      }
+    };
+    (_a = this._dataUnit) === null || _a === void 0 ? void 0 : _a.subscribe(this._bottomPinnedRowSubscriber);
+  }
+  scheduleSetPinnedBottomRow(api, columnApi) {
+    if (!api || !columnApi)
+      return;
+    // atualiza args pendentes
+    this._pinnedBottomPendingArgs = { api, columnApi };
+    // limpa timer anterior
+    if (this._pinnedBottomDebounceTimer != null) {
+      window.clearTimeout(this._pinnedBottomDebounceTimer);
+    }
+    // agenda execução
+    this._pinnedBottomDebounceTimer = window.setTimeout(async () => {
+      this._pinnedBottomDebounceTimer = null;
+      const args = this._pinnedBottomPendingArgs;
+      this._pinnedBottomPendingArgs = null;
+      if (!args)
+        return;
+      try {
+        await this.setPinnedBottomRow(args.api, args.columnApi);
+      }
+      catch (err) {
+        console.error('Erro em setPinnedBottomRow debounced:', err);
+      }
+    }, this._pinnedBottomDebounceDelay);
+  }
+  async setPinnedBottomRow(api, columnApi) {
+    const paginationInfo = this._dataUnit.getPaginationInfo();
+    const loadingInProgress = paginationInfo === null || paginationInfo === void 0 ? void 0 : paginationInfo.loadingInProgress;
+    if (!api || !columnApi || loadingInProgress)
+      return;
+    const columns = columnApi.getAllGridColumns();
+    const columnsWithAgg = columns.filter(col => col.getColDef().aggFunc);
+    if (columnsWithAgg.length === 0)
+      return;
+    const accumulators = new Map();
+    columnsWithAgg.forEach(col => {
+      const colId = col.getColId();
+      accumulators.set(colId, { values: [], aggFunc: col.getColDef().aggFunc });
+    });
+    const recordsToAggregate = await this.getAllRecordsToAggregate();
+    recordsToAggregate.forEach(record => {
+      columnsWithAgg.forEach(col => {
+        const colId = col.getColId();
+        const value = record[colId];
+        if (value != null) {
+          accumulators.get(colId).values.push(value);
+        }
+      });
+    });
+    const totalRow = {};
+    accumulators.forEach((acc, colId) => {
+      try {
+        const aggFn = resolveAggFunc(acc.aggFunc);
+        totalRow[colId] = aggFn({ values: acc.values });
+      }
+      catch (error) {
+        console.error(`Erro ao calcular agregação para coluna ${colId}:`, error);
+        totalRow[colId] = null;
+      }
+    });
+    const hasData = Object.values(totalRow).some(value => value !== null && value !== undefined && value !== 0 && !Number.isNaN(value));
+    if (hasData) {
+      api.setPinnedBottomRowData([totalRow]);
+    }
+  }
+  async getAllRecordsToAggregate() {
+    var _a, _b;
+    if ((_a = this._dataUnit) === null || _a === void 0 ? void 0 : _a.allRecordsLoader) {
+      return this._dataUnit.allRecordsLoader(this._dataUnit);
+    }
+    const paginationInfo = this._dataUnit.getPaginationInfo();
+    if (!paginationInfo || !paginationInfo.total)
+      return [];
+    const response = await this._dataUnit.dataLoader(this._dataUnit, { limit: paginationInfo.total });
+    return (_b = response.records) !== null && _b !== void 0 ? _b : [];
+  }
+  /**
+   * Habilita o scroll horizontal com a roda do mouse enquanto o ponteiro está sobre a grade.
+   * O AG Grid usa uma barra horizontal "fake" e mantém o corpo sem overflow rolável no eixo X,
+   * por isso, por padrão, só é possível rolar horizontalmente com o ponteiro sobre a barra.
+   * Aqui traduzimos o gesto horizontal (trackpad/`deltaX`) ou `Shift + roda` em rolagem
+   * horizontal do viewport interno do AG Grid.
+   */
+  enableHorizontalWheelScroll(container) {
+    var _a;
+    if (((_a = this._options) === null || _a === void 0 ? void 0 : _a.suppressHorizontalScroll) || !container)
+      return;
+    this._horizontalWheelHandler = (event) => {
+      var _a;
+      const target = event.target;
+      // Evita rolagem dupla quando o ponteiro já está sobre a barra horizontal nativa.
+      if ((_a = target === null || target === void 0 ? void 0 : target.closest) === null || _a === void 0 ? void 0 : _a.call(target, this.HORIZONTAL_SCROLL_VIEWPORT_SELECTOR))
+        return;
+      const horizontalDelta = this.resolveHorizontalWheelDelta(event);
+      if (horizontalDelta === 0)
+        return;
+      const scrollViewport = container.querySelector(this.HORIZONTAL_SCROLL_VIEWPORT_SELECTOR);
+      if (!scrollViewport)
+        return;
+      const maxScrollLeft = scrollViewport.scrollWidth - scrollViewport.clientWidth;
+      if (maxScrollLeft <= 0)
+        return;
+      const nextScrollLeft = Math.max(0, Math.min(maxScrollLeft, scrollViewport.scrollLeft + horizontalDelta));
+      if (nextScrollLeft === scrollViewport.scrollLeft)
+        return;
+      scrollViewport.scrollLeft = nextScrollLeft;
+      event.preventDefault();
+    };
+    container.addEventListener('wheel', this._horizontalWheelHandler, { passive: false });
+  }
+  /**
+   * Resolve o deslocamento horizontal desejado a partir do evento de roda.
+   * Retorna 0 quando o gesto é predominantemente vertical (sem Shift), preservando o
+   * comportamento nativo de scroll vertical do AG Grid.
+   */
+  resolveHorizontalWheelDelta(event) {
+    const lineFactor = event.deltaMode === WheelEvent.DOM_DELTA_LINE ? this.WHEEL_LINE_HEIGHT : 1;
+    if (event.shiftKey) {
+      const delta = event.deltaX !== 0 ? event.deltaX : event.deltaY;
+      return delta * lineFactor;
+    }
+    if (Math.abs(event.deltaX) > Math.abs(event.deltaY)) {
+      return event.deltaX * lineFactor;
+    }
+    return 0;
+  }
   processFormatterCellCallback(params) {
     const column = params.column.getColDef();
     if (typeof column.valueFormatter === 'function') {
@@ -64587,6 +64787,8 @@ class AgGridController {
     opt.onRowDoubleClicked = evt => this.onRowDoubleClick(evt);
     opt.onDragStopped = evt => this.onCallStateChange('columnMovedEnd', evt);
     opt.onCellClicked = evt => this.onCellClicked(evt);
+    opt.onGridReady = evt => this.onGridReady(evt);
+    opt.onModelUpdated = async (evt) => this.scheduleSetPinnedBottomRow(evt.api, evt.columnApi);
   }
   setOptionsSupress(opt) {
     opt.suppressDragLeaveHidesColumns = true;
@@ -65109,9 +65311,12 @@ class AgGridController {
       tooltip = this._i18n('ez-grid.columnCantBeOrder');
     }
     const presentationFrom = (_d = source === null || source === void 0 ? void 0 : source.props) === null || _d === void 0 ? void 0 : _d.get(constants.PRESENTATION_FROM_COL_PROP_NAME);
+    const initialWidth = this.getInitialColumnWidth(source.userInterface, source.label);
     return this._editionManager.configureColumn({
       headerName: source.label,
       field: source.name,
+      width: initialWidth,
+      aggFunc: this.getAggFunc(source),
       sortable: propSortable,
       resizable: true,
       headerComponent: 'ezGridCustomHeader',
@@ -65153,6 +65358,10 @@ class AgGridController {
       editable: !((_e = source.props) === null || _e === void 0 ? void 0 : _e.has(constants.PRESENTATION_FROM_COL_PROP_NAME))
     });
   }
+  getAggFunc(column) {
+    var _a, _b;
+    return (_b = (_a = column.props) === null || _a === void 0 ? void 0 : _a.get(this.COLUMN_FOOTER_OPER)) !== null && _b !== void 0 ? _b : column.aggFunc;
+  }
   setHTMLRender(params, source) {
     const htmlSanitized = purify.purify.sanitize(params.value);
     params.colDef.cellRenderer = (cellParams) => {
@@ -65275,12 +65484,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);
@@ -65429,7 +65639,26 @@ class AgGridController {
   destroy() {
     var _a;
     this.observer.disconnect();
+    if (this._horizontalWheelHandler && this._container) {
+      this._container.removeEventListener('wheel', this._horizontalWheelHandler);
+    }
     (_a = this._dataSource) === null || _a === void 0 ? void 0 : _a.destroy();
+    this.handleDestroyBottomPinnedRowSubscriber();
+    this.handleDestroySetBottomPinnedRowDebounce();
+  }
+  handleDestroyBottomPinnedRowSubscriber() {
+    var _a;
+    if (this._bottomPinnedRowSubscriber) {
+      (_a = this._dataUnit) === null || _a === void 0 ? void 0 : _a.unsubscribe(this._bottomPinnedRowSubscriber);
+      this._bottomPinnedRowSubscriber = null;
+    }
+  }
+  handleDestroySetBottomPinnedRowDebounce() {
+    if (this._pinnedBottomDebounceTimer != null) {
+      clearTimeout(this._pinnedBottomDebounceTimer);
+      this._pinnedBottomDebounceTimer = null;
+      this._pinnedBottomPendingArgs = null;
+    }
   }
   registryListeners() {
     var _a;
@@ -65458,10 +65687,21 @@ class AgGridController {
     }
     const field = (_a = this._dataUnit) === null || _a === void 0 ? void 0 : _a.getField(cfgColumn.name);
     const label = (_b = field === null || field === void 0 ? void 0 : field.label) !== null && _b !== void 0 ? _b : (_f = (_e = (_d = (_c = this._gridOptions) === null || _c === void 0 ? void 0 : _c.columnApi) === null || _d === void 0 ? void 0 : _d.getColumn(cfgColumn.name)) === null || _e === void 0 ? void 0 : _e.getColDef()) === null || _f === void 0 ? void 0 : _f.headerName;
-    if ((field === null || field === void 0 ? void 0 : field.userInterface) === core.UserInterface.SEARCH) {
-      return this.DEFAULT_MAX_SIZE;
+    return this.getInitialColumnWidth(field === null || field === void 0 ? void 0 : field.userInterface, label);
+  }
+  getInitialColumnWidth(userInterface, label) {
+    const columnWidthByLabel = this.getColumnWidthByLabel(label);
+    const defaultWidth = this.getDefaultWidthByUserInterface(userInterface);
+    if (!defaultWidth) {
+      return columnWidthByLabel;
+    }
+    return Math.max(defaultWidth, columnWidthByLabel);
+  }
+  getDefaultWidthByUserInterface(userInterface) {
+    if (!userInterface) {
+      return undefined;
     }
-    return this.getColumnWidthByLabel(label);
+    return GRID_COLUMN_DEFAULT_WIDTHS[userInterface];
   }
   getColumnWidthByLabel(label) {
     const labelSize = ((label === null || label === void 0 ? void 0 : label.length) || 0) * this.DEFAULT_FONT_SIZE + this.DEFAULT_ICON_SIZE;
@@ -65655,7 +65895,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;box-shadow:var(--ez-grid__container--shadow);background-color:var(--ez-grid__header--background-color);border:var(--border--small) var(--color--strokes);border-radius:var(--border--radius-small)}.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}.grid-header__pagination.sc-ez-grid{justify-content:flex-end;flex-wrap:nowrap;flex-shrink:1;flex-grow:1}.grid-header__pagination-label.sc-ez-grid{width:100%;white-space:nowrap}.overflowed.sc-ez-grid{display:none}.pagination-contracted.sc-ez-grid{width:100px}.pagination-expanded.sc-ez-grid{min-width:150px}.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:0 0 var(--border--radius-medium) var(--border--radius-medium);box-shadow:var(--shadow--small)}.cancel-pagination.sc-ez-grid{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:4px;padding:8px;width:180px}.cancel-pagination-btn.sc-ez-grid{color:var(--color--error);font-size:var(--text--medium);font-weight:var(--text-weight--large);font-family:var(--font-pattern, Roboto);text-wrap:nowrap;cursor:pointer}.spin.sc-ez-grid{animation-name:spin;animation-duration:5000ms;animation-iteration-count:infinite;animation-timing-function:linear}@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}";
+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) => {
@@ -65708,6 +65948,7 @@ const EzGrid = class {
     this.useSearchColumn = true;
     this.suppressHorizontalScroll = false;
     this.mode = "complete";
+    this.hidePagination = false;
   }
   /**
    * Aplica a definição de colunas.
@@ -65857,26 +66098,17 @@ const EzGrid = class {
       return;
     this._gridController.stopEdit();
   }
+  /**
+   * Manipula a mudança de página da grid.
+   */
+  async handlePageChange() {
+    this.resetPaginationState();
+    this._gridController.setFocusFirstRow();
+    this.ezPageChangedChanged.emit();
+  }
   observeConfig(config) {
     this._gridController.setColumnsState(config === null || config === void 0 ? void 0 : config.columns);
   }
-  updatePaginationTooltip() {
-    this.handleShowCancelPagination();
-    if (!this._refPaginationLabelTooltip)
-      return;
-    const alreadyDefined = this._refPaginationLabelTooltip.getAttribute('data-tooltip');
-    if (alreadyDefined) {
-      this._refPaginationLabelTooltip.setAttribute('data-tooltip', this._getPaginationTooltip());
-    }
-  }
-  observePaginationCounterMode(newValue) {
-    if (newValue === 'hidden') {
-      this._hidePaginationDescription();
-    }
-    if (newValue === 'show') {
-      this._showPaginationDescription();
-    }
-  }
   async observeModeChange(newMode = this.mode) {
     if (newMode === "simple") {
       this.canEdit = false;
@@ -66039,23 +66271,6 @@ const EzGrid = class {
       core.ElementIDUtils.addIDInfo(this._refPaginationControl, 'pagination', dtInfo);
     }
   }
-  handlePageChange() {
-    this.resetPaginationState();
-    this._gridController.setFocusFirstRow();
-    this.ezPageChangedChanged.emit();
-  }
-  previousPage() {
-    if (this.dataUnit) {
-      this.dataUnit.previousPage()
-        .then(() => this.handlePageChange());
-    }
-  }
-  nextPage() {
-    if (this.dataUnit) {
-      this.dataUnit.nextPage()
-        .then(() => this.handlePageChange());
-    }
-  }
   nextRecord() {
     if (this.dataUnit) {
       if (this.dataUnit.getSelectionInfo().records.length === 0) {
@@ -66075,38 +66290,6 @@ const EzGrid = class {
     this._paginationChangedByKeyboard = false;
     (_a = this._gridController) === null || _a === void 0 ? void 0 : _a.resetPaginationState();
   }
-  resolvePaginationClassMode() {
-    if (this.shouldPresentPaginationLabel())
-      return "pagination-expanded";
-    return "pagination-contracted";
-  }
-  async handleCancelPagination() {
-    var _a;
-    this.dataUnit.cancelPagination = true;
-    await ((_a = this._cancelPaginationPopoverElement) === null || _a === void 0 ? void 0 : _a.hide());
-  }
-  renderCancelPagination() {
-    return (index$1.h("ez-popover", { ref: (element) => (this._cancelPaginationPopoverElement = element), "overlay-type": 'none', autoClose: false }, index$1.h("div", { class: 'cancel-pagination' }, index$1.h("ez-icon", { iconName: "sync", size: "x-large", class: "spin" }), index$1.h("span", { onClick: () => this.handleCancelPagination(), class: 'cancel-pagination-btn' }, this.i18n("ez-grid.cancelPagination")))));
-  }
-  handleShowCancelPagination() {
-    var _a, _b, _c;
-    if (!this._hasToShowCancelPagination()) {
-      (_a = this._cancelPaginationPopoverElement) === null || _a === void 0 ? void 0 : _a.hide();
-      return;
-    }
-    if ((_b = this._cancelPaginationPopoverElement) === null || _b === void 0 ? void 0 : _b.opened)
-      return;
-    (_c = this._cancelPaginationPopoverElement) === null || _c === void 0 ? void 0 : _c.show("15px");
-  }
-  getPaginationControl() {
-    if (!this._paginationInfo)
-      return null;
-    const { currentPage, hasMore } = this._paginationInfo;
-    return (index$1.h("div", { class: `grid-header__container grid-header__pagination ${this.resolvePaginationClassMode()}`, ref: ref => (this._refPaginationControl = ref) }, this.renderCancelPagination(), index$1.h("div", { class: "ez-text ez-text--primary ez-text--medium ez-margin-right--medium", ref: (element) => (this._refPaginationLabel = element) }, index$1.h("span", { class: "grid-header__pagination-label" }, this.shouldPresentPaginationLabel() && index$1.h("strong", { class: "ez-text ez-text--primary ez-text--medium" }, this._getActualPageLabel()), this.shouldPresentPaginationLabel() && this._getRemainingPageLabel())), index$1.h("div", { id: "grid-pagination-tooltip", ref: (element) => (this._refPaginationLabelTooltip = element), class: "ez-flex ez-margin-right--medium", title: `${this._getActualPageLabel()} ${this._getRemainingPageLabel()}` }, index$1.h("ez-button", { size: "small", class: "ez-margin-right--medium", iconName: "chevron-left", mode: "icon", enabled: currentPage > 0, onClick: () => this.previousPage(), label: this.i18n("ez-grid.previousPage") }), index$1.h("ez-button", { size: "small", iconName: "chevron-right", mode: "icon", enabled: hasMore, onClick: () => this.nextPage(), label: this.i18n("ez-grid.nextPage") }))));
-  }
-  shouldPresentPaginationLabel() {
-    return this.paginationCounterMode === 'show' || this.paginationCounterMode === 'auto';
-  }
   componentDidLoad() {
     const _application = core.ApplicationContext.getContextValue("__SNK__APPLICATION__");
     this.enableLockManagerLoadingComp = (!_application || (_application === null || _application === void 0 ? void 0 : _application.enableLockManagerLoadingApp)) ? this.enableLockManagerLoadingComp : false;
@@ -66171,76 +66354,9 @@ const EzGrid = class {
     }
     this._paginationInfo = paginationInfo;
   }
-  _getActualPageLabel() {
-    const { firstRecord, lastRecord } = this._paginationInfo;
-    return `${firstRecord}-${lastRecord}`;
-  }
-  _getRemainingPageLabel() {
-    const { total, count } = this._paginationInfo;
-    return `${total == undefined ? this.i18n("ez-grid.remainingPageLabel", { count: count + 1 }) : this.i18n("ez-grid.remainingTotalLabel", { total })}`;
-  }
-  _hasToShowCancelPagination() {
-    var _a;
-    const { total, count } = (_a = this._paginationInfo) !== null && _a !== void 0 ? _a : {};
-    const hasMore = (total === undefined);
-    return !this.dataUnit.cancelPagination && hasMore && count > this.dataUnit.pageSize;
-  }
-  _getPaginationTooltip() {
-    return this._getActualPageLabel() + this._getRemainingPageLabel();
-  }
-  _initHeaderOverflowWatcher() {
-    var _a;
-    (_a = this._headerOverflowWatcher) === null || _a === void 0 ? void 0 : _a.destroy();
-    if (this._refPaginationControl)
-      this._headerOverflowWatcher = new core.OverflowWatcher(this.buildOverFlowWatcherParams());
-  }
-  buildOverFlowWatcherParams() {
-    return {
-      element: this._refPaginationControl,
-      callback: this.handleOverFlow.bind(this),
-      notOverFlow: ["grid-pagination-tooltip"]
-    };
-  }
-  handleOverFlow() {
-    if (!this._refPaginationLabel || !this._refPaginationControl)
-      return;
-    const controlWidth = this._refPaginationControl.clientWidth;
-    const labelWidth = this._refPaginationLabel.scrollWidth;
-    const buttonsElement = this._refPaginationControl.querySelector('#grid-pagination-tooltip');
-    const buttonsWidth = (buttonsElement === null || buttonsElement === void 0 ? void 0 : buttonsElement.clientWidth) || 0;
-    const totalMargins = this._getElementMargins(this._refPaginationLabel) + (buttonsElement ? this._getElementMargins(buttonsElement) : 0);
-    const paginationWidthWithoutDescription = labelWidth + buttonsWidth + totalMargins;
-    const paginationWidthWithDescription = paginationWidthWithoutDescription + this._getPaginationDescriptionWidth();
-    if (controlWidth > paginationWidthWithDescription) {
-      this._showPaginationDescription();
-    }
-    else if (controlWidth <= paginationWidthWithoutDescription) {
-      this._hidePaginationDescription();
-    }
-  }
-  _getPaginationDescriptionWidth() {
-    var _a;
-    return ((_a = this._refPaginationLabelTooltip) === null || _a === void 0 ? void 0 : _a.scrollWidth) || 0;
-  }
-  _getElementMargins(element) {
-    const style = getComputedStyle(element);
-    return parseFloat(style.marginLeft) + parseFloat(style.marginRight);
-  }
-  _hidePaginationDescription() {
-    this._refPaginationLabel.classList.add(core.OVERFLOWED_CLASS_NAME);
-    this._refPaginationLabelTooltip.setAttribute('data-flow', 'bottom');
-    this._refPaginationLabelTooltip.setAttribute('data-tooltip', this._getPaginationTooltip());
-  }
-  ;
-  _showPaginationDescription() {
-    this._refPaginationLabel.classList.remove(core.OVERFLOWED_CLASS_NAME);
-    this._refPaginationLabelTooltip.removeAttribute('data-flow');
-    this._refPaginationLabelTooltip.removeAttribute('data-tooltip');
-  }
   disconnectedCallback() {
-    var _a, _b;
-    (_a = this._headerOverflowWatcher) === null || _a === void 0 ? void 0 : _a.destroy();
-    (_b = this._gridController) === null || _b === void 0 ? void 0 : _b.destroy();
+    var _a;
+    (_a = this._gridController) === null || _a === void 0 ? void 0 : _a.destroy();
     this.removeShortcuts();
   }
   connectedCallback() {
@@ -66269,8 +66385,6 @@ const EzGrid = class {
     if (this.dataUnit && this._showSelectionCounter) {
       this.setSelection(this.dataUnit.getSelectionInfo());
     }
-    if (this.paginationCounterMode === 'auto')
-      this._initHeaderOverflowWatcher();
   }
   getDataSource() {
     if (!this.columnfilterDataSource) {
@@ -66282,7 +66396,7 @@ const EzGrid = class {
     if (this.mode === "simple") {
       return true;
     }
-    return !this._hasLeftButtons && !this._paginationInfo;
+    return !this._hasLeftButtons;
   }
   resolveLeftHeaderClass() {
     if (this.paginationCounterMode == 'show')
@@ -66307,7 +66421,7 @@ const EzGrid = class {
         return;
       const { currentPage } = this._paginationInfo;
       if (currentPage > 0) {
-        this.previousPage();
+        this._refGridPagination.previousPage();
       }
     }, { description: this.i18n("ez-grid.previousPage"), element: this._element })
       .bind("ctrl + alt + ArrowRight", () => {
@@ -66315,7 +66429,7 @@ const EzGrid = class {
         return;
       const { hasMore } = this._paginationInfo;
       if (hasMore) {
-        this.nextPage();
+        this._refGridPagination.nextPage();
       }
     }, { description: this.i18n("ez-grid.nextPage"), element: this._element });
     if (this.useSearchColumn) {
@@ -66368,16 +66482,14 @@ const EzGrid = class {
         'ez-box ez-padding--small grid-header': true,
         'outline-mode': this.outlineMode,
         'shadow-mode': !this.outlineMode && !this.hideHeader(),
-      }, tabindex: "0" }, index$1.h("filter-column", { class: "grid-header__popover", noHeaderTaskBar: !this._hasLeftButtons, dataSource: this.getDataSource(), dataUnit: this.dataUnit, gridHeaderHidden: this.hideHeader(), ref: (element) => (this._filterColumn = element) }), index$1.h("div", { class: "grid-header__position" }, index$1.h("div", { class: `grid-header__container grid-header__left-container ${this.resolveLeftHeaderClass()}` }, index$1.h("slot", { name: "leftButtons" })), this.getPaginationControl())), index$1.h("ez-popover", { ref: elem => (this._ezPopoverSearchColumn = elem), overlayType: "none" }, this.renderFieldSearchColumn()), index$1.h("div", { ref: (ref) => (this._gridSelectionCounter = ref), class: `grid__selection-counter  ez-elevation--4
+      }, tabindex: "0" }, index$1.h("filter-column", { class: "grid-header__popover", noHeaderTaskBar: !this._hasLeftButtons, dataSource: this.getDataSource(), dataUnit: this.dataUnit, gridHeaderHidden: this.hideHeader(), ref: (element) => (this._filterColumn = element) }), index$1.h("div", { class: "grid-header__position" }, index$1.h("div", { class: `grid-header__container grid-header__left-container ${this.resolveLeftHeaderClass()}` }, index$1.h("slot", { name: "leftButtons" })))), index$1.h("ez-popover", { ref: elem => (this._ezPopoverSearchColumn = elem), overlayType: "none" }, this.renderFieldSearchColumn()), index$1.h("div", { ref: (ref) => (this._gridSelectionCounter = ref), class: `grid__selection-counter  ez-elevation--4
           ${this._showSelectionCounter ? 'grid__selection-counter--opened' : ''}
-        ` }, index$1.h(SelectionCounter, { selectionCount: this._selectionCount, currentPageSelected: this._currentPageSelected, paginationInfo: this._paginationInfo, canSelectAll: (_a = this.selectionToastConfig) === null || _a === void 0 ? void 0 : _a.canSelectAll, allRecordSelected: this._isAllSelection, i18n: this.i18n, onSelectAll: () => this.onSelectAllRecords(), onSelectPage: () => this.onSelectPageRecords(), onClearAll: () => this.onClearSelectedRecords(), onClose: () => (this._showSelectionCounter = false) })), index$1.h("div", { class: "grid__footer" }, index$1.h("slot", { name: "footer" }))));
+        ` }, index$1.h(SelectionCounter, { selectionCount: this._selectionCount, currentPageSelected: this._currentPageSelected, paginationInfo: this._paginationInfo, canSelectAll: (_a = this.selectionToastConfig) === null || _a === void 0 ? void 0 : _a.canSelectAll, allRecordSelected: this._isAllSelection, i18n: this.i18n, onSelectAll: () => this.onSelectAllRecords(), onSelectPage: () => this.onSelectPageRecords(), onClearAll: () => this.onClearSelectedRecords(), onClose: () => (this._showSelectionCounter = false) })), index$1.h("div", { class: "grid__footer" }, (this.mode !== "simple" && !this.hidePagination) && (index$1.h("ez-grid-pagination", { class: `ez-flex ez-flex--content-end`, ref: ref => (this._refGridPagination = ref), dataUnit: this.dataUnit, paginationCounterMode: this.paginationCounterMode, onPageChange: () => this.handlePageChange() })), index$1.h("slot", { name: "footer" }))));
   }
   static get assetsDirs() { return ["../assets"]; }
   get _element() { return index$1.getElement(this); }
   static get watchers() { return {
     "config": ["observeConfig"],
-    "_paginationInfo": ["updatePaginationTooltip"],
-    "paginationCounterMode": ["observePaginationCounterMode"],
     "mode": ["observeModeChange"]
   }; }
 };

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

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-a7b0c73d.js');
 const core = require('@sankhyalabs/core');
 const EzScrollDirection = require('./EzScrollDirection-b2c99895.js');
-const index$1 = require('./index-1be40f19.js');
+const index$1 = require('./index-d4a1cad8.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}";