@alaarab/ogrid-angular-material 2.5.9 → 2.6.1

package/dist/esm/index.js

@@ -1,1161 +1,16 @@
-import {INLINE_CELL_EDITOR_STYLES,INLINE_CELL_EDITOR_TEMPLATE,POPOVER_CELL_EDITOR_OVERLAY_STYLES,POPOVER_CELL_EDITOR_TEMPLATE,OGRID_THEME_VARS_CSS,CHECKBOX_COLUMN_WIDTH,DataGridStateService,ColumnReorderService,VirtualScrollService,StatusBarComponent,GridContextMenuComponent,MarchingAntsOverlayComponent,EmptyStateComponent,FormulaRefOverlayComponent,OGridService,OGridLayoutComponent,BaseColumnHeaderFilterComponent,BaseColumnHeaderMenuComponent,BaseInlineCellEditorComponent,BasePopoverCellEditorComponent,BaseDataGridTableComponent,formatCellReference,indexToColumnLetter,ROW_NUMBER_COLUMN_ID,BaseColumnChooserComponent,BasePaginationControlsComponent,BaseOGridComponent}from'@alaarab/ogrid-angular';export{AUTOSIZE_EXTRA_PX,AUTOSIZE_MAX_PX,BaseColumnChooserComponent,BaseColumnHeaderFilterComponent,BaseDataGridTableComponent,BaseInlineCellEditorComponent,BaseOGridComponent,BasePaginationControlsComponent,BasePopoverCellEditorComponent,CELL_PADDING,CHECKBOX_COLUMN_WIDTH,COLUMN_HEADER_MENU_ITEMS,ColumnReorderService,DEFAULT_DEBOUNCE_MS,DEFAULT_MIN_COLUMN_WIDTH,DataGridEditingHelper,DataGridInteractionHelper,DataGridLayoutHelper,DataGridStateService,EmptyStateComponent,GRID_BORDER_RADIUS,GRID_CONTEXT_MENU_ITEMS,GridContextMenuComponent,INLINE_CELL_EDITOR_STYLES,INLINE_CELL_EDITOR_TEMPLATE,MAX_PAGE_BUTTONS,MarchingAntsOverlayComponent,OGRID_THEME_VARS_CSS,OGridLayoutComponent,OGridService,PAGE_SIZE_OPTIONS,PEOPLE_SEARCH_DEBOUNCE_MS,POPOVER_CELL_EDITOR_OVERLAY_STYLES,POPOVER_CELL_EDITOR_TEMPLATE,ROW_NUMBER_COLUMN_WIDTH,SIDEBAR_TRANSITION_MS,SideBarComponent,StatusBarComponent,UndoRedoStack,VirtualScrollService,Z_INDEX,applyCellDeletion,applyCutClear,applyFillValues,applyPastedValues,applyRangeRowSelection,areGridRowPropsEqual,booleanParser,buildCsvHeader,buildCsvRows,buildHeaderRows,buildInlineEditorProps,buildPopoverEditorProps,calculateDropTarget,clampSelectionToBounds,computeAggregations,computeArrowNavigation,computeAutoScrollSpeed,computeNextSortState,computeRowSelectionState,computeTabNavigation,computeTotalHeight,computeVisibleRange,createDebouncedCallback,createDebouncedSignal,createLatestCallback,currencyParser,dateParser,debounce,deriveFilterOptionsFromData,emailParser,escapeCsvValue,exportToCsv,findCtrlArrowTarget,flattenColumns,formatCellValueForTsv,formatSelectionAsTsv,formatShortcut,getCellRenderDescriptor,getCellValue,getColumnHeaderMenuItems,getContextMenuHandlers,getDataGridStatusBarConfig,getFilterField,getHeaderFilterConfig,getMultiSelectFilterFields,getPaginationViewModel,getPinStateForColumn,getScrollTopForRow,getStatusBarParts,injectGlobalStyles,isFilterConfig,isInSelectionRange,isRowInRange,measureColumnContentWidth,measureRange,mergeFilter,normalizeSelectionRange,numberParser,parseTsvClipboard,parseValue,processClientSideData,rangesEqual,reorderColumnArray,resolveCellDisplayContent,resolveCellStyle,toUserLike,triggerCsvDownload,validateColumns,validateRowIds}from'@alaarab/ogrid-angular';import {ViewChild,Component,ChangeDetectionStrategy,Input,ViewEncapsulation,signal,computed,effect}from'@angular/core';import {MatMenuTrigger,MatMenuModule}from'@angular/material/menu';import {MatDividerModule}from'@angular/material/divider';var x=Object.defineProperty;var y=Object.getOwnPropertyDescriptor;var e=(t,a,r,d)=>{for(var o=d>1?void 0:d?y(a,r):a,u=t.length-1,h;u>=0;u--)(h=t[u])&&(o=(d?h(a,r,o):h(o))||o);return d&&o&&x(a,r,o),o};var n=class extends BaseColumnHeaderFilterComponent{getHeaderEl(){return this.headerEl}onDocumentClickWrapper(a){this.onDocumentClick(a,"ogrid-column-header-filter");}};e([ViewChild("headerEl")],n.prototype,"headerEl",2),n=e([Component({selector:"ogrid-column-header-filter",standalone:true,changeDetection:ChangeDetectionStrategy.OnPush,template:`
-    <div class="ogrid-header-filter" #headerEl>
-      <div class="ogrid-header-filter__label">
-        <span class="ogrid-header-filter__name" [title]="columnName" data-header-label>
-          {{ columnName }}
-        </span>
-      </div>
-
-      <div class="ogrid-header-filter__actions">
-        @if (filterType !== 'none') {
-          <button
-            class="ogrid-header-filter__filter-btn"
-            [class.ogrid-header-filter__filter-btn--active]="hasActiveFilter() || isFilterOpen()"
-            (click)="toggleFilter($event)"
-            [attr.aria-label]="'Filter ' + columnName"
-            [attr.aria-expanded]="isFilterOpen()"
-            aria-haspopup="dialog"
-            [title]="'Filter ' + columnName"
-          >
-            <span class="ogrid-header-filter__funnel"></span>
-            @if (hasActiveFilter()) {
-              <span class="ogrid-header-filter__dot"></span>
-            }
-          </button>
-        }
-      </div>
-    </div>
-
-    @if (isFilterOpen() && filterType !== 'none') {
-      <div
-        class="ogrid-header-filter__popover"
-        [style.top.px]="popoverTop()"
-        [style.left.px]="popoverLeft()"
-        (click)="$event.stopPropagation()"
-      >
-        <div class="ogrid-header-filter__popover-header">
-          Filter: {{ columnName }}
-        </div>
-
-        @switch (filterType) {
-          @case ('text') {
-            <div class="ogrid-header-filter__popover-body" style="width: 260px;">
-              <div style="padding: 12px;">
-                <input
-                  type="text"
-                  class="ogrid-header-filter__input"
-                  placeholder="Enter search term..."
-                  [value]="tempTextValue()"
-                  (input)="tempTextValue.set(asInputValue($event))"
-                  (keydown)="onTextKeydown($event)"
-                  autocomplete="off"
-                />
-              </div>
-              <div class="ogrid-header-filter__popover-actions">
-                <button class="ogrid-header-filter__action-btn" [disabled]="!tempTextValue()" (click)="handleTextClear()">Clear</button>
-                <button class="ogrid-header-filter__action-btn ogrid-header-filter__action-btn--primary" (click)="handleTextApply()">Apply</button>
-              </div>
-            </div>
-          }
-          @case ('multiSelect') {
-            <div class="ogrid-header-filter__popover-body" style="width: 280px;">
-              <div style="padding: 12px 12px 4px;">
-                <input
-                  type="text"
-                  class="ogrid-header-filter__input"
-                  placeholder="Search..."
-                  [value]="searchText()"
-                  (input)="searchText.set(asInputValue($event))"
-                  (keydown)="$event.stopPropagation()"
-                  autocomplete="off"
-                />
-                <div class="ogrid-header-filter__options-info">
-                  {{ filteredOptions().length }} of {{ (options ?? []).length }} options
-                </div>
-              </div>
-              <div class="ogrid-header-filter__select-actions">
-                <button class="ogrid-header-filter__action-btn" (click)="handleSelectAllFiltered()">
-                  Select All ({{ filteredOptions().length }})
-                </button>
-                <button class="ogrid-header-filter__action-btn" (click)="handleClearSelection()">Clear</button>
-              </div>
-              <div class="ogrid-header-filter__options-list">
-                @if (isLoadingOptions) {
-                  <div class="ogrid-header-filter__loading">Loading...</div>
-                } @else if (filteredOptions().length === 0) {
-                  <div class="ogrid-header-filter__empty">No options found</div>
-                } @else {
-                  @for (option of filteredOptions(); track option) {
-                    <label class="ogrid-header-filter__option">
-                      <input
-                        type="checkbox"
-                        [checked]="tempSelected().has(option)"
-                        (change)="handleCheckboxChange(option, $event)"
-                      />
-                      <span>{{ option }}</span>
-                    </label>
-                  }
-                }
-              </div>
-              <div class="ogrid-header-filter__popover-actions" style="border-top: 1px solid rgba(0,0,0,0.12);">
-                <button class="ogrid-header-filter__action-btn" (click)="handleClearSelection()">Clear</button>
-                <button class="ogrid-header-filter__action-btn ogrid-header-filter__action-btn--primary" (click)="handleApplyMultiSelect()">Apply</button>
-              </div>
-            </div>
-          }
-          @case ('people') {
-            <div class="ogrid-header-filter__popover-body" style="width: 300px;">
-              @if (selectedUser) {
-                <div class="ogrid-header-filter__people-selected">
-                  <div class="ogrid-header-filter__people-info-label">Currently filtered by:</div>
-                  <div class="ogrid-header-filter__people-card">
-                    <div class="ogrid-header-filter__people-avatar">{{ selectedUser!.displayName?.[0] ?? '?' }}</div>
-                    <div class="ogrid-header-filter__people-details">
-                      <div>{{ selectedUser!.displayName }}</div>
-                      <div class="ogrid-header-filter__people-email">{{ selectedUser!.email }}</div>
-                    </div>
-                    <button class="ogrid-header-filter__btn" (click)="handleClearUser()" aria-label="Remove filter">&times;</button>
-                  </div>
-                </div>
-              }
-              <div style="padding: 12px 12px 4px;">
-                <input
-                  type="text"
-                  class="ogrid-header-filter__input"
-                  placeholder="Search for a person..."
-                  [value]="peopleSearchText()"
-                  (input)="onPeopleSearchInput($event)"
-                  (keydown)="$event.stopPropagation()"
-                  autocomplete="off"
-                />
-              </div>
-              <div class="ogrid-header-filter__options-list">
-                @if (isPeopleLoading() && peopleSearchText().trim()) {
-                  <div class="ogrid-header-filter__loading">Loading...</div>
-                } @else if (peopleSuggestions().length === 0 && peopleSearchText().trim()) {
-                  <div class="ogrid-header-filter__empty">No results found</div>
-                } @else if (peopleSearchText().trim()) {
-                  @for (user of peopleSuggestions(); track user.id || user.email || user.displayName) {
-                    <div class="ogrid-header-filter__people-option" (click)="handleUserSelect(user)">
-                      <div class="ogrid-header-filter__people-avatar">{{ user.displayName?.[0] ?? '?' }}</div>
-                      <div class="ogrid-header-filter__people-details">
-                        <div>{{ user.displayName }}</div>
-                        <div class="ogrid-header-filter__people-email">{{ user.email }}</div>
-                      </div>
-                    </div>
-                  }
-                } @else {
-                  <div class="ogrid-header-filter__empty">Type to search...</div>
-                }
-              </div>
-              @if (selectedUser) {
-                <div style="padding: 8px 12px; border-top: 1px solid rgba(0,0,0,0.12);">
-                  <button class="ogrid-header-filter__action-btn" style="width: 100%;" (click)="handleClearUser()">Clear Filter</button>
-                </div>
-              }
-            </div>
-          }
-          @case ('date') {
-            <div class="ogrid-header-filter__popover-body" style="padding: 12px; display: flex; flex-direction: column; gap: 8px;">
-              <div style="display: flex; align-items: center; gap: 8px;">
-                <span style="min-width: 36px; font-size: 12px;">From:</span>
-                <input type="date" [value]="tempDateFrom()" (input)="tempDateFrom.set(asInputValue($event))" style="flex: 1; padding: 4px 6px;" />
-              </div>
-              <div style="display: flex; align-items: center; gap: 8px;">
-                <span style="min-width: 36px; font-size: 12px;">To:</span>
-                <input type="date" [value]="tempDateTo()" (input)="tempDateTo.set(asInputValue($event))" style="flex: 1; padding: 4px 6px;" />
-              </div>
-              <div class="ogrid-header-filter__popover-actions" style="margin-top: 4px;">
-                <button class="ogrid-header-filter__action-btn" [disabled]="!tempDateFrom() && !tempDateTo()" (click)="handleDateClear()">Clear</button>
-                <button class="ogrid-header-filter__action-btn ogrid-header-filter__action-btn--primary" (click)="handleDateApply()">Apply</button>
-              </div>
-            </div>
-          }
-        }
-      </div>
-    }
-  `,styles:[`
-    :host { display: flex; align-items: center; flex: 1; min-width: 0; position: relative; }
-    .ogrid-header-filter { display: flex; align-items: center; width: 100%; min-width: 0; }
-    .ogrid-header-filter__label { flex: 1; min-width: 0; overflow: hidden; }
-    .ogrid-header-filter__name {
-      display: block; font-weight: 600; font-size: 14px; line-height: 1.4;
-      white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
-    }
-    .ogrid-header-filter__actions { display: flex; align-items: center; margin-left: 4px; flex-shrink: 0; }
-    .ogrid-header-filter__btn {
-      width: 24px; height: 24px; padding: 2px; border: none; border-radius: 4px;
-      background: transparent; cursor: pointer; font-size: 12px; line-height: 1;
-      display: inline-flex; align-items: center; justify-content: center; position: relative;
-      color: var(--ogrid-fg-secondary, rgba(0, 0, 0, 0.54));
-    }
-    .ogrid-header-filter__btn:hover { background: var(--ogrid-hover-bg, rgba(0, 0, 0, 0.08)); }
-    .ogrid-header-filter__btn--active { color: var(--mat-sys-primary, #1976d2); }
-    .ogrid-header-filter__filter-btn {
-      width: 24px; height: 24px; padding: 2px; border: none; border-radius: 4px;
-      background: transparent; cursor: pointer; line-height: 1;
-      display: inline-flex; align-items: center; justify-content: center; position: relative;
-      opacity: 0.6; transition: opacity 0.15s;
-    }
-    .ogrid-header-filter:hover .ogrid-header-filter__filter-btn { opacity: 0.8; }
-    /* :hover and --active must override the parent-hover rule (0,2,0)  -  double-class raises to 0,3,0 */
-    .ogrid-header-filter .ogrid-header-filter__filter-btn:hover { background: var(--ogrid-hover-bg, rgba(0, 0, 0, 0.08)); opacity: 1; }
-    .ogrid-header-filter .ogrid-header-filter__filter-btn--active { opacity: 1; }
-    .ogrid-header-filter__funnel {
-      display: block; width: 0; height: 0;
-      border-left: 5px solid transparent; border-right: 5px solid transparent;
-      border-top: 6px solid var(--ogrid-fg-secondary, rgba(0, 0, 0, 0.65));
-      position: relative;
-    }
-    .ogrid-header-filter__funnel::after {
-      content: ''; display: block; width: 2px; height: 4px;
-      background: var(--ogrid-fg-secondary, rgba(0, 0, 0, 0.65)); position: absolute;
-      top: -1px; left: -1px;
-    }
-    .ogrid-header-filter__filter-btn--active .ogrid-header-filter__funnel {
-      border-top-color: var(--mat-sys-primary, #1976d2);
-    }
-    .ogrid-header-filter__filter-btn--active .ogrid-header-filter__funnel::after {
-      background: var(--mat-sys-primary, #1976d2);
-    }
-    .ogrid-header-filter__dot {
-      position: absolute; top: 2px; right: 2px;
-      width: 6px; height: 6px; border-radius: 50%;
-      background: var(--mat-sys-primary, #1976d2);
-    }
-    .ogrid-header-filter__popover {
-      position: fixed; z-index: 1000;
-      background: var(--ogrid-bg, #ffffff); border: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.2));
-      border-radius: 8px; box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2), 0 1px 4px rgba(0, 0, 0, 0.1);
-      margin-top: 4px; color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));
-    }
-    .ogrid-header-filter__popover-header {
-      padding: 8px 12px; font-size: 14px; font-weight: 600;
-      border-bottom: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));
-      color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));
-    }
-    .ogrid-header-filter__popover-body { }
-    .ogrid-header-filter__popover-actions {
-      display: flex; justify-content: flex-end; gap: 8px; padding: 8px 12px;
-    }
-    .ogrid-header-filter__input {
-      width: 100%; padding: 8px 12px; border: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.23));
-      border-radius: 4px; font-size: 14px; box-sizing: border-box;
-      background: var(--ogrid-bg, #ffffff); color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));
-    }
-    .ogrid-header-filter__input:focus { outline: 2px solid var(--mat-sys-primary, #1976d2); outline-offset: -1px; }
-    .ogrid-header-filter__options-info { margin-top: 4px; font-size: 12px; color: var(--ogrid-fg-secondary, rgba(0, 0, 0, 0.6)); }
-    .ogrid-header-filter__select-actions {
-      display: flex; justify-content: space-between; padding: 4px 12px;
-    }
-    .ogrid-header-filter__options-list { max-height: 240px; overflow-y: auto; padding: 0 4px; }
-    .ogrid-header-filter__option {
-      display: flex; align-items: center; gap: 8px;
-      padding: 4px 8px; cursor: pointer; font-size: 14px;
-      color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));
-    }
-    .ogrid-header-filter__option:hover { background: var(--ogrid-hover-bg, rgba(0, 0, 0, 0.04)); }
-    .ogrid-header-filter__loading, .ogrid-header-filter__empty {
-      padding: 16px; text-align: center; font-size: 14px; color: var(--ogrid-fg-secondary, rgba(0, 0, 0, 0.6));
-    }
-    .ogrid-header-filter__action-btn {
-      padding: 4px 12px; border: none; border-radius: 4px;
-      background: transparent; cursor: pointer; font-size: 13px;
-      color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));
-    }
-    .ogrid-header-filter__action-btn:hover { background: var(--ogrid-hover-bg, rgba(0, 0, 0, 0.04)); }
-    .ogrid-header-filter__action-btn:disabled { opacity: 0.38; cursor: default; }
-    .ogrid-header-filter__action-btn--primary {
-      background: var(--mat-sys-primary, #1976d2); color: #fff;
-    }
-    .ogrid-header-filter__action-btn--primary:hover { opacity: 0.9; }
-    .ogrid-header-filter__people-selected {
-      padding: 12px; border-bottom: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));
-    }
-    .ogrid-header-filter__people-info-label { font-size: 12px; color: var(--ogrid-fg-secondary, rgba(0, 0, 0, 0.6)); }
-    .ogrid-header-filter__people-card {
-      display: flex; align-items: center; gap: 8px; margin-top: 4px;
-    }
-    .ogrid-header-filter__people-avatar {
-      width: 32px; height: 32px; border-radius: 50%; background: var(--ogrid-hover-bg, rgba(0, 0, 0, 0.08));
-      display: flex; align-items: center; justify-content: center;
-      font-size: 14px; font-weight: 600; flex-shrink: 0;
-      color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));
-    }
-    .ogrid-header-filter__people-details { flex: 1; min-width: 0; font-size: 14px; color: var(--ogrid-fg, rgba(0, 0, 0, 0.87)); }
-    .ogrid-header-filter__people-details > div { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
-    .ogrid-header-filter__people-email { font-size: 12px; color: var(--ogrid-fg-secondary, rgba(0, 0, 0, 0.6)); }
-    .ogrid-header-filter__people-option {
-      display: flex; align-items: center; gap: 8px; padding: 8px 12px; cursor: pointer;
-      color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));
-    }
-    .ogrid-header-filter__people-option:hover { background: var(--ogrid-hover-bg, rgba(0, 0, 0, 0.04)); }
-  `],host:{"(document:click)":"onDocumentClickWrapper($event)"}})],n);var l=class extends BaseColumnHeaderMenuComponent{};e([ViewChild(MatMenuTrigger)],l.prototype,"menuTrigger",2),l=e([Component({selector:"column-header-menu",standalone:true,changeDetection:ChangeDetectionStrategy.OnPush,imports:[MatMenuModule,MatDividerModule],template:`
-    <button
-      [matMenuTriggerFor]="menu"
-      class="column-header-menu-trigger"
-      [attr.aria-label]="'Column options for ' + columnId"
-    >
-      &#8942;
-    </button>
-
-    <mat-menu #menu="matMenu">
-      @for (item of menuItems(); track item.id) {
-        <button
-          mat-menu-item
-          [disabled]="item.disabled"
-          (click)="handleMenuItemClick(item.id)"
-        >
-          {{ item.label }}
-        </button>
-        @if (item.divider) {
-          <mat-divider></mat-divider>
-        }
-      }
-    </mat-menu>
-  `,styles:[`
-    :host { flex-shrink: 0; }
-    .column-header-menu-trigger {
-      width: 24px;
-      height: 24px;
-      padding: 0;
-      border: none;
-      border-radius: 4px;
-      background: transparent;
-      cursor: pointer;
-      font-size: 16px;
-      line-height: 1;
-      display: inline-flex;
-      align-items: center;
-      justify-content: center;
-      color: var(--ogrid-fg-secondary, rgba(0, 0, 0, 0.54));
-    }
-
-    /* Always reserve space; hide on hover-capable devices until column is hovered.
-       The th:hover rule lives in the parent (ViewEncapsulation.None) styles. */
-    @media (hover: hover) {
-      .column-header-menu-trigger { visibility: hidden; }
-    }
-
-    .column-header-menu-trigger:hover {
-      background: var(--ogrid-hover-bg, rgba(0, 0, 0, 0.08));
-      color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));
-    }
-  `]})],l);var s=class extends BaseInlineCellEditorComponent{};s=e([Component({selector:"ogrid-mat-inline-cell-editor",standalone:true,changeDetection:ChangeDetectionStrategy.OnPush,template:INLINE_CELL_EDITOR_TEMPLATE,styles:[INLINE_CELL_EDITOR_STYLES]})],s);var g=class extends BasePopoverCellEditorComponent{};g=e([Component({selector:"ogrid-mat-popover-cell-editor",standalone:true,changeDetection:ChangeDetectionStrategy.OnPush,template:POPOVER_CELL_EDITOR_TEMPLATE,styles:[`
-    ${POPOVER_CELL_EDITOR_OVERLAY_STYLES}
-    .ogrid-popover-anchor {
-      width: 100%; height: 100%; display: flex; align-items: center; min-width: 0;
-      padding: 6px 10px; box-sizing: border-box; overflow: hidden;
-      text-overflow: ellipsis; white-space: nowrap; user-select: none;
-      outline: 2px solid var(--ogrid-selection, #217346); outline-offset: -1px;
-      z-index: 2; position: relative;
-    }
-  `]})],g);var i=class extends BaseDataGridTableComponent{constructor(){super();this.propsSignal=signal(void 0);this.showColumnLetters=computed(()=>!!this.getProps()?.showColumnLetters);this.formulaReferences=computed(()=>this.getProps()?.formulaReferences);this.initBase(),effect(()=>{let d=this.getProps()?.onActiveCellChange;if(!d)return;let o=this.activeCell();if(o){let u=o.columnIndex-this.colOffset(),h=o.rowIndex+1;d(formatCellReference(u,h));}else d(null);});}set propsInput(r){this.propsSignal.set(r);}getProps(){return this.propsSignal()}getWrapperRef(){return this.wrapperRef}getTableContainerRef(){return this.tableContainerRef}getColumnLetter(r){return indexToColumnLetter(r)}onResizeRowNumber(r){r.stopPropagation(),this.onResizeStart(r,{columnId:ROW_NUMBER_COLUMN_ID,name:"#"});}};e([Input({required:true,alias:"props"})],i.prototype,"propsInput",1),e([ViewChild("wrapperEl")],i.prototype,"wrapperRef",2),e([ViewChild("tableContainerElRef")],i.prototype,"tableContainerRef",2),i=e([Component({selector:"ogrid-datagrid-table",standalone:true,changeDetection:ChangeDetectionStrategy.OnPush,encapsulation:ViewEncapsulation.None,imports:[n,l,StatusBarComponent,GridContextMenuComponent,MarchingAntsOverlayComponent,EmptyStateComponent,FormulaRefOverlayComponent,s,g],providers:[DataGridStateService,ColumnReorderService,VirtualScrollService],template:`
-    <div class="ogrid-datagrid-root">
-      <div
-        #wrapperEl
-        class="ogrid-datagrid-wrapper"
-        [class.ogrid-datagrid-wrapper--fit]="layoutModeFit()"
-        [class.ogrid-datagrid-wrapper--loading-empty]="isLoading() && items().length === 0"
-        [style.--ogrid-row-height]="rowHeightCssVar()"
-        tabindex="0"
-        role="region"
-        [attr.aria-label]="ariaLabel()"
-        [attr.aria-labelledby]="ariaLabelledBy()"
-        (pointerdown)="onWrapperMouseDown($event)"
-        (keydown)="onGridKeyDown($event)"
-        (scroll)="onWrapperScroll($event)"
-        (contextmenu)="$event.preventDefault()"
-        [class.ogrid-datagrid-wrapper--overflow-x]="allowOverflowX()"
-        [attr.data-overflow-x]="allowOverflowX() ? 'true' : 'false'"
-        [attr.data-virtual-scroll]="vsEnabled() ? '' : null"
-        data-ogrid-scroll-container
-      >
-        <div class="ogrid-datagrid-scroll-wrapper">
-          <div [style.minWidth.px]="allowOverflowX() ? minTableWidth() : undefined" style="overflow-x: clip">
-            <div [class.ogrid-datagrid-table-wrapper--loading]="isLoading() && items().length > 0" #tableContainerElRef>
-              <table class="ogrid-datagrid-table" role="grid" [style.minWidth.px]="minTableWidth()"
-                [attr.data-virtual-scroll]="vsEnabled() ? '' : null"
-              >
-                <thead [class]="stickyHeader() ? 'ogrid-datagrid-thead ogrid-sticky-header' : 'ogrid-datagrid-thead'">
-                  @if (showColumnLetters()) {
-                    <tr class="ogrid-column-letter-row">
-                      @if (hasCheckboxCol()) {
-                        <th class="ogrid-column-letter-cell"></th>
-                      }
-                      @if (hasRowNumbersCol()) {
-                        <th class="ogrid-column-letter-cell"></th>
-                      }
-                      @for (col of visibleCols(); track col.columnId; let colIdx = $index) {
-                        <th class="ogrid-column-letter-cell">
-                          {{ getColumnLetter(colIdx) }}
-                        </th>
-                      }
-                    </tr>
-                  }
-                  @for (row of headerRows(); track $index; let rowIdx = $index) {
-                    <tr class="ogrid-datagrid-header-row">
-                      @if (rowIdx === headerRows().length - 1 && hasCheckboxCol()) {
-                        <th class="ogrid-datagrid-th ogrid-datagrid-checkbox-col" [attr.rowSpan]="headerRows().length > 1 ? 1 : null">
-                          <div class="ogrid-datagrid-checkbox-wrapper">
-                            <input
-                              type="checkbox"
-                              [checked]="allSelected()"
-                              [indeterminate]="someSelected()"
-                              (change)="onSelectAllChange($event)"
-                              aria-label="Select all rows"
-                            />
-                          </div>
-                        </th>
-                      }
-                      @if (rowIdx === 0 && rowIdx < headerRows().length - 1 && hasCheckboxCol()) {
-                        <th [attr.rowSpan]="headerRows().length - 1" class="ogrid-datagrid-th" style="width: 48px; min-width: 48px; padding: 0;"></th>
-                      }
-                      @if (rowIdx === headerRows().length - 1 && hasRowNumbersCol()) {
-                        <th class="ogrid-datagrid-th ogrid-row-number-header" [attr.rowSpan]="headerRows().length > 1 ? 1 : null"
-                          [style.width.px]="getRowNumberWidth()"
-                          [style.min-width.px]="getRowNumberWidth()"
-                          [style.max-width.px]="getRowNumberWidth()"
-                        >
-                          <div class="ogrid-row-number-header-content">#</div>
-                          <div class="ogrid-datagrid-resize-handle" (pointerdown)="onResizeRowNumber($event)" (dblclick)="$event.stopPropagation()"></div>
-                        </th>
-                      }
-                      @if (rowIdx === 0 && rowIdx < headerRows().length - 1 && hasRowNumbersCol()) {
-                        <th [attr.rowSpan]="headerRows().length - 1" class="ogrid-datagrid-th" [style.width.px]="getRowNumberWidth()" [style.min-width.px]="getRowNumberWidth()" style="padding: 0;"></th>
-                      }
-                      @for (cell of row; track cell.columnDef?.columnId ?? $index; let cellIdx = $index) {
-                        @if (cell.isGroup) {
-                          <th [attr.colSpan]="cell.colSpan" scope="colgroup" class="ogrid-datagrid-th ogrid-datagrid-group-header">
-                            {{ cell.label }}
-                          </th>
-                        } @else {
-                          @let col = asColumnDef(cell.columnDef);
-                          @let colW = getColumnWidth(col);
-                          @let pinned = isPinned(col.columnId);
-                          @let pinnedLeft = pinned === 'left';
-                          @let pinnedRight = pinned === 'right';
-                          @let sortState = getSortState(col.columnId);
-                          @let ariaSort = sortState === 'asc' ? 'ascending' : sortState === 'desc' ? 'descending' : null;
-                          @let config = getFilterConfig(col);
-                          <th scope="col"
-                            class="ogrid-datagrid-th"
-                            [class.ogrid-datagrid-th--pinned-left]="pinnedLeft"
-                            [class.ogrid-datagrid-th--pinned-right]="pinnedRight"
-                            [attr.rowSpan]="headerRows().length > 1 ? headerRows().length - rowIdx : null"
-                            [attr.data-column-id]="col.columnId"
-                            [attr.aria-sort]="ariaSort"
-                            [style.minWidth.px]="getEffectiveMinWidth(col)"
-                            [style.width.px]="colW"
-                            [style.maxWidth.px]="colW"
-                            [style.cursor]="columnReorderService.isDragging() ? 'grabbing' : 'grab'"
-                            [style.left.px]="pinnedLeft ? getPinnedLeftOffset(col.columnId) : null"
-                            [style.right.px]="pinnedRight ? getPinnedRightOffset(col.columnId) : null"
-                            (pointerdown)="onHeaderMouseDown(col.columnId, $event)"
-                          >
-                            <div style="display:flex;align-items:center;gap:4px;">
-                              <ogrid-column-header-filter
-                                [columnKey]="col.columnId"
-                                [columnName]="col.name"
-                                [filterType]="config.filterType"
-                                [isSorted]="config.isSorted"
-                                [isSortedDescending]="config.isSortedDescending"
-                                [onSort]="config.onSort"
-                                [selectedValues]="config.selectedValues"
-                                [onFilterChange]="config.onFilterChange"
-                                [options]="config.options"
-                                [isLoadingOptions]="config.isLoadingOptions ?? false"
-                                [textValue]="config.textValue ?? ''"
-                                [onTextChange]="config.onTextChange"
-                                [selectedUser]="config.selectedUser"
-                                [onUserChange]="config.onUserChange"
-                                [peopleSearch]="config.peopleSearch"
-                                [dateValue]="config.dateValue"
-                                [onDateChange]="config.onDateChange"
-                              />
-                              @let pinState = getPinState(col.columnId);
-                              <column-header-menu
-                                [columnId]="col.columnId"
-                                [canPinLeft]="pinState.canPinLeft"
-                                [canPinRight]="pinState.canPinRight"
-                                [canUnpin]="pinState.canUnpin"
-                                [currentSort]="sortState"
-                                [isSortable]="col.sortable !== false"
-                                [isResizable]="col.resizable !== false"
-                                [handlers]="getColumnMenuHandlersMemoized(col.columnId)"
-                              />
-                            </div>
-                            <div class="ogrid-datagrid-resize-handle" (pointerdown)="onResizeStart($event, col)" (dblclick)="onResizeDoubleClick($event, col)"></div>
-                          </th>
-                        }
-                      }
-                    </tr>
-                  }
-                </thead>
-                @if (!showEmptyInGrid()) {
-                  <tbody>
-                    @if (vsEnabled() && vsTopSpacerHeight() > 0) {
-                      <tr class="ogrid-datagrid-vs-spacer" [style.height.px]="vsTopSpacerHeight()"></tr>
-                    }
-                    @for (item of vsVisibleItems(); track getRowId()(item); let localIdx = $index) {
-                      @let rowIndex = vsStartIndex() + localIdx;
-                      @let rowId = getRowId()(item);
-                      @let isSelected = selectedRowIds().has(rowId);
-                      <tr
-                        class="ogrid-datagrid-row"
-                        [class.ogrid-datagrid-row--selected]="isSelected"
-                        [attr.data-row-id]="rowId"
-                        [attr.aria-selected]="isSelected || null"
-                        (click)="onRowClick($event, rowId)"
-                      >
-                        @if (hasCheckboxCol()) {
-                          <td class="ogrid-datagrid-td ogrid-datagrid-checkbox-col">
-                            <div
-                              class="ogrid-datagrid-checkbox-wrapper"
-                              [attr.data-row-index]="rowIndex"
-                              [attr.data-col-index]="0"
-                              (click)="$event.stopPropagation()"
-                            >
-                              <input
-                                type="checkbox"
-                                [checked]="isSelected"
-                                (change)="onRowCheckboxChange(rowId, $event, rowIndex)"
-                                [attr.aria-label]="'Select row ' + (rowIndex + 1)"
-                              />
-                            </div>
-                          </td>
-                        }
-                        @if (hasRowNumbersCol()) {
-                          <td class="ogrid-datagrid-td ogrid-row-number-cell"
-                            [style.width.px]="getRowNumberWidth()"
-                            [style.min-width.px]="getRowNumberWidth()"
-                            [style.max-width.px]="getRowNumberWidth()"
-                          >
-                            <div class="ogrid-row-number-cell-content">
-                              {{ rowNumberOffset() + rowIndex + 1 }}
-                            </div>
-                          </td>
-                        }
-                        @if (vsColumnsEnabled() && vsLeftSpacerWidth() > 0) {
-                          <td [style.width.px]="vsLeftSpacerWidth()" [style.minWidth.px]="vsLeftSpacerWidth()" [style.maxWidth.px]="vsLeftSpacerWidth()" [style.padding]="'0'"></td>
-                        }
-                        @for (colLayout of vsColumnLayouts(); track colLayout.col.columnId) {
-                          <td
-                            class="ogrid-datagrid-td"
-                            [attr.data-column-id]="colLayout.col.columnId"
-                            [class.ogrid-datagrid-td--pinned-left]="colLayout.pinnedLeft"
-                            [class.ogrid-datagrid-td--pinned-right]="colLayout.pinnedRight"
-                            [style.minWidth.px]="colLayout.minWidth"
-                            [style.width.px]="colLayout.width"
-                            [style.maxWidth.px]="colLayout.width"
-                            [style.left.px]="colLayout.pinnedLeft ? getPinnedLeftOffset(colLayout.col.columnId) : null"
-                            [style.right.px]="colLayout.pinnedRight ? getPinnedRightOffset(colLayout.col.columnId) : null"
-                          >
-                            @let descriptor = getCellDescriptor(item, colLayout.col, rowIndex, getGlobalColIndex(colLayout.col));
-                            @if (descriptor.mode === 'editing-inline') {
-                              <div class="ogrid-editing-cell">
-                              <ogrid-mat-inline-cell-editor
-                                [value]="descriptor.value"
-                                [item]="item"
-                                [column]="colLayout.col"
-                                [rowIndex]="rowIndex"
-                                [editorType]="descriptor.editorType ?? 'text'"
-                                (commit)="commitEdit(item, colLayout.col.columnId, descriptor.value, $event, rowIndex, descriptor.globalColIndex)"
-                                (cancel)="cancelEdit()"
-                              ></ogrid-mat-inline-cell-editor>
-                              </div>
-                            } @else if (descriptor.mode === 'editing-popover') {
-                              @let editorProps = buildPopoverEditorProps(item, colLayout.col, descriptor);
-                              <ogrid-mat-popover-cell-editor
-                                [item]="item"
-                                [column]="colLayout.col"
-                                [rowIndex]="rowIndex"
-                                [globalColIndex]="descriptor.globalColIndex"
-                                [displayValue]="descriptor.displayValue"
-                                [editorProps]="editorProps"
-                                [onCancel]="cancelEdit.bind(this)"
-                              ></ogrid-mat-popover-cell-editor>
-                            } @else {
-                              @let content = resolveCellContent(colLayout.col, item, descriptor.displayValue);
-                              @let cellStyle = resolveCellStyleFn(colLayout.col, item, descriptor.displayValue);
-                              <div
-                                class="ogrid-datagrid-cell"
-                                [class.ogrid-datagrid-cell--active]="descriptor.isActive"
-                                [class.ogrid-datagrid-cell--active-in-range]="descriptor.isActive && descriptor.isInRange"
-                                [class.ogrid-datagrid-cell--in-range]="descriptor.isInRange && !descriptor.isActive"
-                                [class.ogrid-datagrid-cell--in-cut-range]="descriptor.isInCutRange"
-                                [class.ogrid-datagrid-cell--editable]="descriptor.canEditAny"
-                                [class.ogrid-datagrid-cell--numeric]="colLayout.col.type === 'numeric'"
-                                [class.ogrid-datagrid-cell--boolean]="colLayout.col.type === 'boolean'"
-                                [attr.data-row-index]="rowIndex"
-                                [attr.data-col-index]="descriptor.globalColIndex"
-                                [attr.data-in-range]="descriptor.isInRange ? 'true' : null"
-                                [attr.tabindex]="descriptor.isActive ? 0 : -1"
-                                (pointerdown)="onCellMouseDown($event, rowIndex, descriptor.globalColIndex)"
-                                (click)="onCellClick(rowIndex, descriptor.globalColIndex)"
-                                (contextmenu)="onCellContextMenu($event)"
-                                (dblclick)="descriptor.canEditAny ? onCellDblClick(descriptor.rowId, colLayout.col.columnId) : null"
-                                [attr.role]="descriptor.canEditAny ? 'button' : null"
-                                [style]="cellStyle ?? undefined"
-                              >
-                                @if (colLayout.col.type === 'boolean') {
-                                  <input type="checkbox" [checked]="!!descriptor.displayValue" [disabled]="!descriptor.canEditAny" (change)="descriptor.canEditAny ? commitBooleanEdit(item, colLayout.col.columnId, !!descriptor.displayValue, rowIndex, descriptor.globalColIndex) : null" (pointerdown)="onBooleanCheckboxPointerDown($event, rowIndex, descriptor.globalColIndex)" (click)="$event.stopPropagation()" style="margin:0;outline:none" [style.cursor]="descriptor.canEditAny ? 'pointer' : 'default'" [attr.aria-label]="descriptor.displayValue ? 'Checked' : 'Unchecked'" />
-                                } @else {
-                                  {{ content }}
-                                }
-                                @if (descriptor.canEditAny && descriptor.isSelectionEndCell) {
-                                  <div
-                                    class="ogrid-datagrid-fill-handle"
-                                    (pointerdown)="onFillHandleMouseDown($event)"
-                                    aria-label="Fill handle"
-                                  ></div>
-                                }
-                              </div>
-                            }
-                          </td>
-                        }
-                        @if (vsColumnsEnabled() && vsRightSpacerWidth() > 0) {
-                          <td [style.width.px]="vsRightSpacerWidth()" [style.minWidth.px]="vsRightSpacerWidth()" [style.maxWidth.px]="vsRightSpacerWidth()" [style.padding]="'0'"></td>
-                        }
-                      </tr>
-                    }
-                    @if (vsEnabled() && vsBottomSpacerHeight() > 0) {
-                      <tr class="ogrid-datagrid-vs-spacer" [style.height.px]="vsBottomSpacerHeight()"></tr>
-                    }
-                  </tbody>
-                }
-              </table>
-
-              <ogrid-marching-ants-overlay
-                [containerEl]="tableContainerEl()"
-                [selectionRange]="state().interaction.selectionRange"
-                [copyRange]="state().interaction.copyRange"
-                [cutRange]="state().interaction.cutRange"
-                [colOffset]="state().layout.colOffset"
-                [columnSizingVersion]="columnSizingVersion()"
-                [items]="items()"
-                [visibleColumns]="propsVisibleColumns()"
-                [columnOrder]="propsColumnOrder()"
-              ></ogrid-marching-ants-overlay>
-
-              @if (formulaReferences() && formulaReferences()!.length > 0) {
-                <ogrid-formula-ref-overlay
-                  [containerEl]="tableContainerEl()"
-                  [references]="formulaReferences()!"
-                  [colOffset]="colOffset()"
-                />
-              }
-
-              @if (showEmptyInGrid() && emptyState()) {
-                <div class="ogrid-datagrid-empty">
-                  <div class="ogrid-datagrid-empty__title">No results found</div>
-                  <div class="ogrid-datagrid-empty__message">
-                    <ogrid-empty-state
-                      [message]="emptyState()?.message"
-                      [hasActiveFilters]="emptyState()?.hasActiveFilters ?? false"
-                      [render]="emptyState()?.render"
-                      (clearAll)="emptyState()?.onClearAll()"
-                    ></ogrid-empty-state>
-                  </div>
-                </div>
-              }
-            </div>
-          </div>
-        </div>
-
-        @if (columnReorderService.isDragging() && columnReorderService.dropIndicatorX() !== null) {
-          <div class="ogrid-datagrid-drop-indicator" [style.left.px]="columnReorderService.dropIndicatorX()"></div>
-        }
-
-        @if (menuPosition()) {
-          <div
-            class="ogrid-datagrid-context-menu-overlay"
-            (click)="closeContextMenu()"
-            (contextmenu)="$event.preventDefault(); closeContextMenu()"
-          >
-            <ogrid-context-menu
-              [x]="menuPosition()!.x"
-              [y]="menuPosition()!.y"
-              [hasSelection]="hasCellSelection()"
-              [canUndoProp]="canUndo()"
-              [canRedoProp]="canRedo()"
-              (undoAction)="onUndo()"
-              (redoAction)="onRedo()"
-              (copyAction)="handleCopy()"
-              (cutAction)="handleCut()"
-              (pasteAction)="handlePaste()"
-              (selectAllAction)="handleSelectAllCells()"
-              (closeAction)="closeContextMenu()"
-            />
-          </div>
-        }
-      </div>
-
-      @let sbConfig = statusBarConfig();
-      @if (sbConfig) {
-        <ogrid-status-bar
-          [totalCount]="sbConfig.totalCount"
-          [filteredCount]="sbConfig.filteredCount"
-          [selectedCount]="sbConfig.selectedCount ?? selectedRowIds().size"
-          [selectedCellCount]="selectionCellCount()"
-          [aggregation]="sbConfig.aggregation"
-          [suppressRowCount]="sbConfig.suppressRowCount"
-        />
-      }
-
-      @if (isLoading()) {
-        <div class="ogrid-datagrid-loading-overlay">
-          <div class="ogrid-datagrid-loading-inner">
-            <div class="ogrid-datagrid-spinner"></div>
-            <span>{{ loadingMessage() }}</span>
-          </div>
-        </div>
-      }
-    </div>
-  `,styles:[OGRID_THEME_VARS_CSS,`
-    :host { display: block; }
-    .ogrid-datagrid-root { position: relative; flex: 1; min-height: 0; display: flex; flex-direction: column; }
-    .ogrid-datagrid-wrapper {
-      position: relative; width: 100%; max-width: 100%;
-      overflow-x: hidden; overflow-y: auto; background: var(--ogrid-bg, #ffffff);
-      color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));
-      will-change: scroll-position; outline: none;
-    }
-    .ogrid-datagrid-wrapper[data-virtual-scroll] { flex: 1; min-height: 0; }
-    .ogrid-datagrid-wrapper [data-drag-range] { background: var(--ogrid-range-bg, rgba(33, 115, 70, 0.12)); }
-    .ogrid-datagrid-cell--active[data-drag-range] { outline: none; }
-    .ogrid-datagrid-wrapper--fit { width: fit-content; }
-    .ogrid-datagrid-wrapper--overflow-x { overflow-x: auto; }
-    .ogrid-datagrid-wrapper--loading-empty { min-height: 200px; }
-    .ogrid-datagrid-scroll-wrapper { display: flex; flex-direction: column; min-height: 100%; }
-    .ogrid-datagrid-table-wrapper--loading { position: relative; opacity: 0.6; }
-    .ogrid-datagrid-table {
-      width: 100%; min-width: max-content; border-collapse: collapse; table-layout: fixed;
-    }
-    .ogrid-datagrid-table tr th:first-child,
-    .ogrid-datagrid-table tr td:first-child { border-left: none; }
-    .ogrid-datagrid-table tbody tr { height: var(--ogrid-row-height, auto); }
-    .ogrid-datagrid-thead {
-      z-index: 8; background: var(--ogrid-header-bg, rgba(0, 0, 0, 0.04));
-    }
-    .ogrid-datagrid-thead th { background: var(--ogrid-header-bg, rgba(0, 0, 0, 0.04)); }
-    .ogrid-datagrid-header-row { background: var(--ogrid-header-bg, rgba(0, 0, 0, 0.04)); }
-    .ogrid-datagrid-th {
-      font-weight: 600; padding: 6px 10px; text-align: left;
-      font-size: 14px; border-bottom: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));
-      background: var(--ogrid-header-bg, rgba(0, 0, 0, 0.04)); z-index: 8;
-      color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));
-    }
-    .ogrid-sticky-header .ogrid-datagrid-th { position: sticky; top: 0; }
-    .ogrid-datagrid-th:focus-visible {
-      outline: 2px solid var(--mat-sys-primary, #1976d2); outline-offset: -2px; z-index: 11;
-    }
-    .ogrid-datagrid-th--pinned-left {
-      position: sticky; top: 0; left: 0; z-index: 10; background: var(--ogrid-header-bg, rgba(0, 0, 0, 0.04)); will-change: transform;
-      border-right: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));
-      box-shadow: 2px 0 4px -1px rgba(0, 0, 0, 0.1);
-    }
-    .ogrid-datagrid-th--pinned-right {
-      position: sticky; top: 0; right: 0; z-index: 10; background: var(--ogrid-header-bg, rgba(0, 0, 0, 0.04)); will-change: transform;
-      border-left: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));
-      box-shadow: -2px 0 4px -1px rgba(0, 0, 0, 0.1);
-    }
-    .ogrid-datagrid-group-header {
-      text-align: center; font-weight: 600; border-bottom: 2px solid var(--ogrid-border, rgba(0, 0, 0, 0.12)); padding: 6px;
-    }
-    .ogrid-datagrid-checkbox-col {
-      width: ${CHECKBOX_COLUMN_WIDTH}px; min-width: ${CHECKBOX_COLUMN_WIDTH}px;
-      max-width: ${CHECKBOX_COLUMN_WIDTH}px; text-align: center;
-    }
-    .ogrid-datagrid-checkbox-wrapper { display: flex; align-items: center; justify-content: center; }
-    .ogrid-row-number-header, .ogrid-row-number-cell {
-      text-align: center;
-      background: var(--ogrid-header-bg, rgba(0, 0, 0, 0.04)); font-weight: 600;
-      font-variant-numeric: tabular-nums; color: var(--ogrid-fg-secondary, rgba(0, 0, 0, 0.6));
-      position: sticky; left: 0; z-index: 3;
-    }
-    .ogrid-row-number-header { z-index: 4; }
-    .ogrid-row-number-header-content, .ogrid-row-number-cell-content {
-      display: flex; align-items: center; justify-content: center;
-    }
-    .ogrid-datagrid-row { }
-    .ogrid-datagrid-row:hover { background: var(--ogrid-hover-bg, rgba(0, 0, 0, 0.04)); }
-    .ogrid-datagrid-row--selected { background: var(--ogrid-selected-row-bg, #e6f0fb); }
-    .ogrid-datagrid-td { position: relative; padding: 0; height: 1px; border-bottom: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.06)); }
-    .ogrid-datagrid-td--pinned-left {
-      position: sticky; left: 0; z-index: 6; background: var(--ogrid-bg, #ffffff); will-change: transform;
-      border-right: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));
-      box-shadow: 2px 0 4px -1px rgba(0, 0, 0, 0.1);
-    }
-    .ogrid-datagrid-td--pinned-right {
-      position: sticky; right: 0; z-index: 6; background: var(--ogrid-bg, #ffffff); will-change: transform;
-      border-left: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));
-      box-shadow: -2px 0 4px -1px rgba(0, 0, 0, 0.1);
-    }
-    .ogrid-datagrid-cell {
-      width: 100%; height: 100%; display: flex; align-items: center; min-width: 0;
-      padding: var(--ogrid-cell-padding, 6px 10px); box-sizing: border-box; overflow: hidden;
-      text-overflow: ellipsis; white-space: nowrap; user-select: none; outline: none;
-      font-size: 14px; color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));
-    }
-    .ogrid-datagrid-cell:focus-visible {
-      outline: 2px solid var(--mat-sys-primary, #1976d2); outline-offset: -2px; z-index: 3;
-    }
-    .ogrid-datagrid-cell--numeric { justify-content: flex-end; text-align: right; }
-    .ogrid-datagrid-cell--boolean { justify-content: flex-start; }
-    .ogrid-datagrid-cell--editable { cursor: cell; }
-    .ogrid-datagrid-cell--active {
-      outline: 2px solid var(--ogrid-selection-color, #217346); outline-offset: -1px;
-      z-index: 2; position: relative; overflow: visible;
-    }
-    .ogrid-datagrid-td:has(> .ogrid-datagrid-cell--active),
-    .ogrid-datagrid-td:has(> .ogrid-editing-cell) { z-index: 2; }
-    .ogrid-datagrid-cell--active-in-range { outline: none; background: var(--ogrid-bg, #fff); }
-    .ogrid-datagrid-cell--in-range { background: var(--ogrid-range-bg, rgba(33, 115, 70, 0.12)); }
-    .ogrid-datagrid-cell--in-cut-range { background: var(--ogrid-hover-bg, rgba(0, 0, 0, 0.04)); opacity: 0.7; }
-    .ogrid-datagrid-cell--editing { padding: 0; }
-    .ogrid-editing-cell {
-      width: 100%; height: 100%; display: flex; align-items: center; box-sizing: border-box;
-      outline: 2px solid var(--ogrid-selection-color, #217346); outline-offset: -1px;
-      z-index: 2; position: relative; background: var(--ogrid-bg, #fff); overflow: hidden; padding: 0;
-    }
-    .ogrid-datagrid-editor-input {
-      width: 100%; height: 100%; padding: 6px 10px; border: 2px solid var(--ogrid-selection-color, #217346);
-      box-sizing: border-box; font-size: 14px; outline: none; font-family: inherit; line-height: inherit;
-      background: var(--ogrid-bg, #ffffff); color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));
-    }
-    .ogrid-datagrid-cell--numeric .ogrid-datagrid-editor-input {
-      text-align: right;
-    }
-    .ogrid-datagrid-editor-select {
-      width: 100%; height: 100%; padding: 4px 8px; border: 2px solid var(--ogrid-selection-color, #217346);
-      box-sizing: border-box; font-size: 14px;
-      background: var(--ogrid-bg, #ffffff); color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));
-    }
-    .ogrid-datagrid-fill-handle {
-      position: absolute; right: -3px; bottom: -3px; width: 7px; height: 7px;
-      background: var(--ogrid-selection-color, #217346);
-      border: 1px solid var(--ogrid-bg, #ffffff); border-radius: 1px;
-      cursor: crosshair; pointer-events: auto; touch-action: none; z-index: 3;
-    }
-    @media (pointer: coarse) {
-      .ogrid-datagrid-fill-handle { width: 14px; height: 14px; right: -7px; bottom: -7px; border-radius: 2px; }
-    }
-    .ogrid-datagrid-resize-handle {
-      position: absolute; top: 0; right: -3px; bottom: 0; width: 8px;
-      cursor: col-resize; user-select: none; touch-action: none;
-    }
-    @media (pointer: coarse) {
-      .ogrid-datagrid-resize-handle { width: 16px; right: -8px; }
-    }
-    .ogrid-datagrid-resize-handle::after {
-      content: ''; position: absolute; top: 4px; right: 3px; bottom: 4px; width: 2px;
-      background: var(--ogrid-border, rgba(0, 0, 0, 0.12)); border-radius: 1px; transition: background 0.15s;
-    }
-    .ogrid-datagrid-resize-handle:hover::after { background: var(--ogrid-fg-muted, rgba(0, 0, 0, 0.4)); }
-    .ogrid-datagrid-resize-handle:active::after { background: var(--mat-sys-primary, #1976d2); }
-    .ogrid-datagrid-empty {
-      padding: 32px 16px; text-align: center; border-top: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));
-      background: var(--ogrid-header-bg, rgba(0, 0, 0, 0.04));
-    }
-    .ogrid-datagrid-empty__title { font-size: 18px; font-weight: 600; margin-bottom: 8px; color: var(--ogrid-fg, rgba(0, 0, 0, 0.87)); }
-    .ogrid-datagrid-empty__message { font-size: 14px; color: var(--ogrid-fg-secondary, rgba(0, 0, 0, 0.6)); }
-    .ogrid-datagrid-empty__clear {
-      background: none; border: none; color: var(--mat-sys-primary, #1976d2);
-      cursor: pointer; font-size: inherit; text-decoration: underline; padding: 0;
-    }
-    .ogrid-datagrid-loading-overlay {
-      position: absolute; inset: 0; z-index: 2;
-      display: flex; align-items: center; justify-content: center;
-      background: var(--ogrid-loading-overlay, rgba(255, 255, 255, 0.7));
-    }
-    .ogrid-datagrid-loading-inner {
-      display: flex; flex-direction: column; align-items: center; gap: 8px;
-      padding: 16px; background: var(--ogrid-bg, #ffffff); border: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12)); border-radius: 4px;
-      color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));
-    }
-    .ogrid-datagrid-spinner {
-      width: 24px; height: 24px; border: 3px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));
-      border-top-color: var(--mat-sys-primary, #1976d2);
-      border-radius: 50%; animation: ogrid-spin 0.8s linear infinite;
-    }
-    @keyframes ogrid-spin { to { transform: rotate(360deg); } }
-    .ogrid-datagrid-drop-indicator {
-      position: absolute; top: 0; bottom: 0; width: 3px;
-      background: var(--ogrid-selection-color, #217346);
-      pointer-events: none; z-index: 100; transition: left 0.05s;
-    }
-    .ogrid-datagrid-context-menu-overlay {
-      position: fixed; inset: 0; z-index: 1000;
-    }
-    .ogrid-column-letter-cell {
-      text-align: center;
-      font-size: 11px;
-      font-weight: 500;
-      color: var(--ogrid-fg-muted, rgba(0, 0, 0, 0.4));
-      padding: 2px 4px;
-      background: var(--ogrid-column-letter-bg, var(--ogrid-header-bg, rgba(0, 0, 0, 0.04)));
-      border-bottom: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));
-      user-select: none;
-      font-variant-numeric: tabular-nums;
-    }
-
-    /* Reveal column menu trigger on header hover without layout shift.
-       The button always takes up space (visibility: hidden); shown when column is hovered. */
-    @media (hover: hover) {
-      th:hover .column-header-menu-trigger { visibility: visible; }
-    }
-
-    /* Angular Material Menu popup dark mode overrides.
-       Double-class selector (0,2,0) beats MUI's single-class (0,1,0) defaults. */
-    .mat-mdc-menu-panel.mat-mdc-menu-panel {
-      background: var(--ogrid-bg, #ffffff);
-      color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));
-    }
-    .mat-mdc-menu-item.mat-mdc-menu-item {
-      color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));
-    }
-    .mat-mdc-menu-item.mat-mdc-menu-item:hover:not([disabled]) {
-      background: var(--ogrid-hover-bg, rgba(0, 0, 0, 0.04));
-    }
-    .mat-mdc-menu-item.mat-mdc-menu-item .mat-mdc-menu-item-text {
-      color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));
-    }
-  `]})],i);var c=class extends BaseColumnChooserComponent{onDocumentClick(a){a.target.closest("ogrid-column-chooser")||this.isOpen.set(false);}};c=e([Component({selector:"ogrid-column-chooser",standalone:true,changeDetection:ChangeDetectionStrategy.OnPush,template:`
-    <div class="ogrid-column-chooser">
-      <button
-        class="ogrid-column-chooser__trigger"
-        (click)="toggle()"
-        [attr.aria-expanded]="isOpen()"
-        aria-haspopup="listbox"
-      >
-        &#9638; Column Visibility ({{ visibleCount() }} of {{ totalCount() }})
-        <span class="ogrid-column-chooser__caret">{{ isOpen() ? '&#9650;' : '&#9660;' }}</span>
-      </button>
-
-      @if (isOpen()) {
-        <div class="ogrid-column-chooser__dropdown" (click)="$event.stopPropagation()">
-          <div class="ogrid-column-chooser__header">
-            Select Columns ({{ visibleCount() }} of {{ totalCount() }})
-          </div>
-
-          <div class="ogrid-column-chooser__list">
-            @for (col of columns; track col.columnId) {
-              <label class="ogrid-column-chooser__item">
-                <input
-                  type="checkbox"
-                  [checked]="visibleColumns.has(col.columnId)"
-                  (change)="onCheckboxChange(col.columnId, $event)"
-                />
-                <span>{{ col.name }}</span>
-              </label>
-            }
-          </div>
-
-          <div class="ogrid-column-chooser__footer">
-            <button class="ogrid-column-chooser__btn" (click)="onClearAll()">Clear All</button>
-            <button class="ogrid-column-chooser__btn ogrid-column-chooser__btn--primary" (click)="selectAll()">Select All</button>
-          </div>
-        </div>
-      }
-    </div>
-  `,styles:[`
-    :host { display: inline-flex; position: relative; }
-    .ogrid-column-chooser { position: relative; }
-    .ogrid-column-chooser__trigger {
-      display: inline-flex; align-items: center; gap: 6px;
-      padding: 6px 12px; border: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.23)); border-radius: 4px;
-      background: transparent; cursor: pointer; font-size: 14px; font-weight: 600;
-      text-transform: none; white-space: nowrap;
-      color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));
-    }
-    .ogrid-column-chooser__trigger:hover { background: var(--ogrid-hover-bg, rgba(0, 0, 0, 0.04)); }
-    .ogrid-column-chooser__caret { font-size: 10px; }
-    .ogrid-column-chooser__dropdown {
-      position: absolute; top: 100%; right: 0; z-index: 1000;
-      min-width: 220px; margin-top: 4px;
-      background: var(--ogrid-bg, #ffffff); border: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12)); border-radius: 4px;
-      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
-    }
-    .ogrid-column-chooser__header {
-      padding: 8px 12px; font-size: 14px; font-weight: 600;
-      border-bottom: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));
-      background: var(--ogrid-header-bg, rgba(0, 0, 0, 0.04));
-      color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));
-    }
-    .ogrid-column-chooser__list {
-      max-height: 320px; overflow-y: auto; padding: 4px 0;
-    }
-    .ogrid-column-chooser__item {
-      display: flex; align-items: center; gap: 8px;
-      padding: 4px 12px; min-height: 32px; cursor: pointer; font-size: 14px;
-      color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));
-    }
-    .ogrid-column-chooser__item:hover { background: var(--ogrid-hover-bg, rgba(0, 0, 0, 0.04)); }
-    .ogrid-column-chooser__footer {
-      display: flex; justify-content: flex-end; gap: 8px;
-      padding: 8px 12px; border-top: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));
-      background: var(--ogrid-header-bg, rgba(0, 0, 0, 0.04));
-    }
-    .ogrid-column-chooser__btn {
-      padding: 4px 12px; border: none; border-radius: 4px;
-      background: transparent; cursor: pointer; font-size: 13px; text-transform: none;
-      color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));
-    }
-    .ogrid-column-chooser__btn:hover { background: var(--ogrid-hover-bg, rgba(0, 0, 0, 0.04)); }
-    .ogrid-column-chooser__btn--primary {
-      background: var(--mat-sys-primary, #1976d2); color: #fff;
-    }
-    .ogrid-column-chooser__btn--primary:hover {
-      opacity: 0.9;
-    }
-  `],host:{"(document:click)":"onDocumentClick($event)"}})],c);var p=class extends BasePaginationControlsComponent{};p=e([Component({selector:"ogrid-pagination-controls",standalone:true,changeDetection:ChangeDetectionStrategy.OnPush,template:`
-    @if (vm(); as vm) {
-      <nav class="ogrid-pagination" role="navigation" aria-label="Pagination">
-        <span class="ogrid-pagination__info">
-          Showing {{ vm.startItem }} to {{ vm.endItem }} of {{ totalCount.toLocaleString() }} {{ entityLabelPlural }}
-        </span>
-
-        <span class="ogrid-pagination__pages">
-          <button
-            class="ogrid-pagination__btn"
-            [disabled]="currentPage === 1"
-            (click)="pageChange.emit(1)"
-            aria-label="First page"
-          >&laquo;</button>
-          <button
-            class="ogrid-pagination__btn"
-            [disabled]="currentPage === 1"
-            (click)="pageChange.emit(currentPage - 1)"
-            aria-label="Previous page"
-          >&lsaquo;</button>
-
-          @if (vm.showStartEllipsis) {
-            <button class="ogrid-pagination__btn" (click)="pageChange.emit(1)" aria-label="Page 1">1</button>
-            <span class="ogrid-pagination__ellipsis" aria-hidden="true">&hellip;</span>
-          }
-
-          @for (pageNum of vm.pageNumbers; track pageNum) {
-            <button
-              class="ogrid-pagination__btn"
-              [class.ogrid-pagination__btn--active]="currentPage === pageNum"
-              (click)="pageChange.emit(pageNum)"
-              [attr.aria-label]="'Page ' + pageNum"
-              [attr.aria-current]="currentPage === pageNum ? 'page' : null"
-            >{{ pageNum }}</button>
-          }
-
-          @if (vm.showEndEllipsis) {
-            <span class="ogrid-pagination__ellipsis" aria-hidden="true">&hellip;</span>
-            <button
-              class="ogrid-pagination__btn"
-              (click)="pageChange.emit(vm.totalPages)"
-              [attr.aria-label]="'Page ' + vm.totalPages"
-            >{{ vm.totalPages }}</button>
-          }
-
-          <button
-            class="ogrid-pagination__btn"
-            [disabled]="currentPage >= vm.totalPages"
-            (click)="pageChange.emit(currentPage + 1)"
-            aria-label="Next page"
-          >&rsaquo;</button>
-          <button
-            class="ogrid-pagination__btn"
-            [disabled]="currentPage >= vm.totalPages"
-            (click)="pageChange.emit(vm.totalPages)"
-            aria-label="Last page"
-          >&raquo;</button>
-        </span>
-
-        <span class="ogrid-pagination__size">
-          <label>Rows
-            <select
-              [value]="pageSize"
-              (change)="onPageSizeSelect($event)"
-              aria-label="Rows per page"
-            >
-              @for (n of vm.pageSizeOptions; track n) {
-                <option [value]="n" [selected]="pageSize === n">{{ n }}</option>
-              }
-            </select>
-          </label>
-        </span>
-      </nav>
-    }
-  `,styles:[`
-    :host { display: block; }
-    .ogrid-pagination {
-      display: flex; align-items: center; justify-content: space-between;
-      flex-wrap: wrap; gap: 8px; padding: 6px 12px; font-size: 14px;
-      color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));
-    }
-    .ogrid-pagination__info { color: var(--ogrid-fg-secondary, rgba(0, 0, 0, 0.6)); }
-    .ogrid-pagination__pages { display: flex; align-items: center; gap: 2px; }
-    .ogrid-pagination__btn {
-      min-width: 32px; height: 32px; padding: 0 6px;
-      border: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.23)); border-radius: 4px;
-      background: transparent; cursor: pointer; font-size: 14px;
-      color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));
-    }
-    .ogrid-pagination__btn:hover:not(:disabled) { background: var(--ogrid-hover-bg, rgba(0, 0, 0, 0.04)); }
-    .ogrid-pagination__btn:disabled { opacity: 0.38; cursor: default; }
-    .ogrid-pagination__btn--active {
-      background: var(--mat-sys-primary, #1976d2); color: #fff;
-      border-color: var(--mat-sys-primary, #1976d2);
-    }
-    .ogrid-pagination__ellipsis { margin: 0 4px; color: var(--ogrid-fg-secondary, rgba(0, 0, 0, 0.6)); }
-    .ogrid-pagination__size { display: flex; align-items: center; gap: 8px; color: var(--ogrid-fg, rgba(0, 0, 0, 0.87)); }
-    .ogrid-pagination__size select {
-      min-width: 60px; height: 32px; padding: 4px 8px;
-      border: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.23)); border-radius: 4px;
-      font-size: 14px; margin-left: 8px;
-      background: var(--ogrid-bg, #ffffff); color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));
-    }
-    @media (max-width: 576px) {
-      .ogrid-pagination { flex-direction: column; align-items: stretch; gap: 6px; padding: 6px 8px; font-size: 12px; }
-      .ogrid-pagination__pages { order: -1; justify-content: center; }
-      .ogrid-pagination__info { text-align: center; font-size: 11px; }
-      .ogrid-pagination__size { font-size: 11px; justify-content: center; }
-    }
-  `]})],p);var f=class extends BaseOGridComponent{};f=e([Component({selector:"ogrid",standalone:true,changeDetection:ChangeDetectionStrategy.OnPush,imports:[OGridLayoutComponent,i,c,p],providers:[OGridService],styles:[":host { display: block; height: 100%; }"],template:`
-    <ogrid-layout
-      [className]="ogridService.className()"
-      [sideBar]="ogridService.sideBarProps()"
-      [hasToolbar]="showToolbar"
-      [hasToolbarBelow]="false"
-      [hasPagination]="true"
-      [fullScreen]="ogridService.fullScreen()"
-      [showNameBox]="!!(ogridService.cellReferences() && !ogridService.formulasEnabled())"
-      [activeCellRef]="ogridService.activeCellRef()"
-      [formulaBar]="ogridService.formulasEnabled() ? ogridService.formulaBarState() : null"
-      [sheetDefs]="ogridService.sheetDefs()"
-      [activeSheet]="ogridService.activeSheet()"
-      [onSheetChange]="ogridService.onSheetChange()"
-      [onSheetAdd]="ogridService.onSheetAdd()"
-    >
-      <ng-container toolbarEnd>
-        @if (ogridService.columnChooserPlacement() === 'toolbar') {
-          <ogrid-column-chooser
-            [columns]="ogridService.columnChooser().columns"
-            [visibleColumns]="ogridService.columnChooser().visibleColumns"
-            (visibilityChange)="ogridService.columnChooser().onVisibilityChange($event.columnKey, $event.visible)"
-          />
-        }
-      </ng-container>
-
-      <ogrid-datagrid-table [props]="ogridService.dataGridProps()" />
-
-      <ng-container pagination>
-        <ogrid-pagination-controls
-          [currentPage]="ogridService.pagination().page"
-          [pageSize]="ogridService.pagination().pageSize"
-          [totalCount]="ogridService.pagination().displayTotalCount"
-          [pageSizeOptions]="ogridService.pagination().pageSizeOptions"
-          [entityLabelPlural]="ogridService.pagination().entityLabelPlural"
-          (pageChange)="ogridService.pagination().setPage($event)"
-          (pageSizeChange)="onPageSizeChange($event)"
-        />
-      </ng-container>
-    </ogrid-layout>
-  `})],f);export{c as ColumnChooserComponent,n as ColumnHeaderFilterComponent,l as ColumnHeaderMenuComponent,i as DataGridTableComponent,s as InlineCellEditorComponent,f as OGridComponent,p as PaginationControlsComponent,g as PopoverCellEditorComponent};
+// Explicit named re-exports from base package (replaces export * for better tree-shaking).
+// Core value exports
+export { toUserLike, isInSelectionRange, normalizeSelectionRange, escapeCsvValue, buildCsvHeader, buildCsvRows, exportToCsv, triggerCsvDownload, getCellValue, flattenColumns, buildHeaderRows, isFilterConfig, getFilterField, mergeFilter, deriveFilterOptionsFromData, getMultiSelectFilterFields, getStatusBarParts, getDataGridStatusBarConfig, getPaginationViewModel, PAGE_SIZE_OPTIONS, MAX_PAGE_BUTTONS, GRID_CONTEXT_MENU_ITEMS, COLUMN_HEADER_MENU_ITEMS, getContextMenuHandlers, getColumnHeaderMenuItems, formatShortcut, parseValue, numberParser, currencyParser, dateParser, emailParser, booleanParser, computeAggregations, processClientSideData, areGridRowPropsEqual, isRowInRange, getPinStateForColumn, reorderColumnArray, calculateDropTarget, computeVisibleRange, computeTotalHeight, getScrollTopForRow, getHeaderFilterConfig, getCellRenderDescriptor, resolveCellDisplayContent, resolveCellStyle, buildInlineEditorProps, buildPopoverEditorProps, debounce, measureRange, injectGlobalStyles, computeNextSortState, measureColumnContentWidth, AUTOSIZE_EXTRA_PX, AUTOSIZE_MAX_PX, findCtrlArrowTarget, computeTabNavigation, computeArrowNavigation, applyCellDeletion, rangesEqual, clampSelectionToBounds, computeAutoScrollSpeed, applyRangeRowSelection, computeRowSelectionState, formatCellValueForTsv, formatSelectionAsTsv, parseTsvClipboard, applyPastedValues, applyCutClear, applyFillValues, UndoRedoStack, validateColumns, validateRowIds, CHECKBOX_COLUMN_WIDTH, ROW_NUMBER_COLUMN_WIDTH, DEFAULT_MIN_COLUMN_WIDTH, CELL_PADDING, GRID_BORDER_RADIUS, DEFAULT_DEBOUNCE_MS, PEOPLE_SEARCH_DEBOUNCE_MS, SIDEBAR_TRANSITION_MS, Z_INDEX, } from '@alaarab/ogrid-angular';
+// Angular services and components
+export { OGridService, DataGridStateService, DataGridLayoutHelper, DataGridEditingHelper, DataGridInteractionHelper, ColumnReorderService, VirtualScrollService, OGridLayoutComponent, StatusBarComponent, GridContextMenuComponent, SideBarComponent, MarchingAntsOverlayComponent, EmptyStateComponent, BaseOGridComponent, BaseDataGridTableComponent, BaseColumnHeaderFilterComponent, BaseColumnChooserComponent, BasePaginationControlsComponent, BaseInlineCellEditorComponent, INLINE_CELL_EDITOR_TEMPLATE, INLINE_CELL_EDITOR_STYLES, BasePopoverCellEditorComponent, POPOVER_CELL_EDITOR_TEMPLATE, POPOVER_CELL_EDITOR_OVERLAY_STYLES, OGRID_THEME_VARS_CSS, createDebouncedSignal, createDebouncedCallback, createLatestCallback, } from '@alaarab/ogrid-angular';
+// Components
+export { OGridComponent } from './ogrid/ogrid.component';
+export { DataGridTableComponent } from './datagrid-table/datagrid-table.component';
+export { ColumnHeaderFilterComponent } from './column-header-filter/column-header-filter.component';
+// IColumnHeaderFilterProps is now exported from @alaarab/ogrid-angular (base class)
+export { ColumnChooserComponent } from './column-chooser/column-chooser.component';
+// IColumnChooserProps is now exported from @alaarab/ogrid-angular (base class)
+export { PaginationControlsComponent } from './pagination-controls/pagination-controls.component';
+export { ColumnHeaderMenuComponent } from './column-header-menu/column-header-menu.component';
+export { InlineCellEditorComponent } from './datagrid-table/inline-cell-editor.component';
+export { PopoverCellEditorComponent } from './datagrid-table/popover-cell-editor.component';