@alaarab/ogrid-angular-primeng 2.1.3 → 2.1.5

package/dist/types/index.d.ts

@@ -1,4 +1,7 @@
-export * from '@alaarab/ogrid-angular';
+export type { ColumnFilterType, IDateFilterValue, IColumnFilterDef, IColumnMeta, IValueParserParams, ICellValueChangedEvent, ICellEditorProps, CellEditorParams, HeaderCell, HeaderRow, RowId, UserLike, UserLikeInput, FilterValue, IFilters, IFetchParams, IPageResult, IDataSource, IGridColumnState, RowSelectionMode, IRowSelectionChangeEvent, StatusBarPanel, IStatusBarProps, IActiveCell, ISelectionRange, SideBarPanelId, ISideBarDef, IVirtualScrollConfig, IColumnReorderConfig, IOGridApi, CsvColumn, StatusBarPart, StatusBarPartsInput, PaginationViewModel, GridContextMenuItem, IColumnHeaderMenuItem, GridContextMenuHandlerProps, ColumnHeaderMenuInput, ColumnHeaderMenuHandlers, ParseValueResult, AggregationResult, GridRowComparatorProps, ColumnPinState, IDropTarget, ICalculateDropTargetParams, IVisibleRange, HeaderFilterConfigInput, HeaderFilterConfig, CellRenderDescriptorInput, CellRenderDescriptor, CellRenderMode, OverlayRect, ISortState, ArrowNavigationContext, ArrowNavigationResult, ZIndexKey, } from '@alaarab/ogrid-angular';
+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';
+export type { IColumnDef, IColumnGroupDef, IColumnDefinition, IOGridProps, IOGridClientProps, IOGridServerProps, IOGridDataGridProps, ColumnChooserPlacement, OGridPagination, OGridColumnChooser, OGridFilters, OGridSideBarState, DataGridLayoutState, DataGridRowSelectionState, DataGridEditingState, DataGridCellInteractionState, DataGridContextMenuState, DataGridViewModelState, DataGridPinningState, DataGridStateResult, SideBarProps, SideBarFilterColumn, IColumnHeaderFilterProps, IColumnChooserProps, } from '@alaarab/ogrid-angular';
+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';
 export { OGridComponent } from './ogrid/ogrid.component';
 export { DataGridTableComponent } from './datagrid-table/datagrid-table.component';
 export { InlineCellEditorComponent } from './datagrid-table/inline-cell-editor.component';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alaarab/ogrid-angular-primeng",
-  "version": "2.1.3",
+  "version": "2.1.5",
   "description": "OGrid PrimeNG – PrimeNG Table-based data grid with sorting, filtering, pagination, column chooser, and CSV export.",
   "main": "dist/esm/index.js",
   "module": "dist/esm/index.js",
@@ -9,11 +9,11 @@
     ".": {
       "types": "./dist/types/index.d.ts",
       "import": "./dist/esm/index.js",
-      "require": "./dist/esm/index.js"
+      "default": "./dist/esm/index.js"
     }
   },
   "scripts": {
-    "build": "rimraf dist && tsc -p tsconfig.build.json",
+    "build": "rimraf dist && tsup && tsc -p tsconfig.build.json",
     "test": "jest --passWithNoTests",
     "storybook": "ng run angular-primeng:storybook",
     "build-storybook": "ng run angular-primeng:build-storybook"
@@ -37,7 +37,7 @@
     "node": ">=18"
   },
   "dependencies": {
-    "@alaarab/ogrid-angular": "2.1.3"
+    "@alaarab/ogrid-angular": "2.1.5"
   },
   "peerDependencies": {
     "@angular/core": "^21.0.0",

package/dist/esm/column-chooser/column-chooser.component.js

@@ -1,73 +0,0 @@
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-import { Component, ChangeDetectionStrategy } from '@angular/core';
-import { BaseColumnChooserComponent } from '@alaarab/ogrid-angular';
-let ColumnChooserComponent = class ColumnChooserComponent extends BaseColumnChooserComponent {
-    // PrimeNG uses 'open' instead of 'isOpen'
-    get open() {
-        return this.isOpen;
-    }
-};
-ColumnChooserComponent = __decorate([
-    Component({
-        selector: 'ogrid-primeng-column-chooser',
-        standalone: true,
-        changeDetection: ChangeDetectionStrategy.OnPush,
-        template: `
-    <div style="position:relative;display:inline-block">
-      <button
-        type="button"
-        class="p-button p-button-text p-button-sm"
-        (click)="open.set(!open())"
-        [attr.aria-expanded]="open()"
-        aria-haspopup="listbox"
-        style="display:flex;align-items:center;gap:6px;font-size:13px"
-      >
-        <span aria-hidden>&#9881;</span>
-        <span>Column Visibility ({{ visibleCount() }} of {{ totalCount() }})</span>
-        <span aria-hidden>{{ open() ? '\u25B2' : '\u25BC' }}</span>
-      </button>
-
-      @if (open()) {
-        <div
-          style="position:absolute;right:0;top:100%;z-index:1000;min-width:220px;max-height:320px;overflow-y:auto;background:var(--ogrid-bg, #fff);border:1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));border-radius:6px;box-shadow:0 2px 8px rgba(0,0,0,0.12);padding:8px 0"
-        >
-          <div style="padding:4px 12px;font-weight:600;font-size:12px;color:var(--ogrid-fg-secondary, rgba(0, 0, 0, 0.6))">
-            Select Columns ({{ visibleCount() }} of {{ totalCount() }})
-          </div>
-          @for (col of columns; track col.columnId) {
-            <label style="display:flex;align-items:center;gap:8px;padding:4px 12px;cursor:pointer;font-size:13px">
-              <input
-                type="checkbox"
-                [checked]="visibleColumns.has(col.columnId)"
-                (change)="onToggle(col.columnId, $any($event.target).checked)"
-                [disabled]="col.required === true"
-              />
-              {{ col.name }}
-            </label>
-          }
-          <div style="display:flex;gap:4px;padding:8px 12px;border-top:1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));margin-top:4px">
-            <button
-              type="button"
-              class="p-button p-button-text p-button-sm"
-              (click)="onClearAll()"
-              style="flex:1;font-size:12px"
-            >Clear All</button>
-            <button
-              type="button"
-              class="p-button p-button-text p-button-sm"
-              (click)="onSelectAll()"
-              style="flex:1;font-size:12px"
-            >Select All</button>
-          </div>
-        </div>
-      }
-    </div>
-  `,
-    })
-], ColumnChooserComponent);
-export { ColumnChooserComponent };

package/dist/esm/column-header-filter/column-header-filter.component.js

@@ -1,251 +0,0 @@
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-import { Component, ViewChild, DestroyRef, inject, effect, ChangeDetectionStrategy } from '@angular/core';
-import { BaseColumnHeaderFilterComponent } from '@alaarab/ogrid-angular';
-let ColumnHeaderFilterComponent = class ColumnHeaderFilterComponent extends BaseColumnHeaderFilterComponent {
-    getHeaderEl() {
-        return this.filterTrigger;
-    }
-    constructor() {
-        super();
-        this.destroyRef = inject(DestroyRef);
-        this.clickOutsideHandler = (e) => {
-            const trigger = this.filterTrigger?.nativeElement;
-            const panel = this.filterPanel?.nativeElement;
-            if (trigger && !trigger.contains(e.target) && (!panel || !panel.contains(e.target))) {
-                this.isFilterOpen.set(false);
-            }
-        };
-        // Sync temp values when filter opens
-        effect(() => {
-            if (this.isFilterOpen()) {
-                this.tempTextValue.set(this.textValue ?? '');
-                this.searchText.set('');
-                const sv = this.selectedValues;
-                this.tempSelected.set(new Set(sv ?? []));
-                const dv = this.dateValue;
-                this.tempDateFrom.set(dv?.from ?? '');
-                this.tempDateTo.set(dv?.to ?? '');
-                document.addEventListener('mousedown', this.clickOutsideHandler, true);
-            }
-            else {
-                document.removeEventListener('mousedown', this.clickOutsideHandler, true);
-            }
-        });
-        this.destroyRef.onDestroy(() => {
-            document.removeEventListener('mousedown', this.clickOutsideHandler, true);
-        });
-    }
-    handleSortClick() {
-        this.onSort?.();
-    }
-    toggleFilter() {
-        this.isFilterOpen.update((v) => !v);
-    }
-    // Adapter methods for template compatibility
-    handleSelectAllOptions() {
-        this.handleSelectAllFiltered();
-    }
-};
-__decorate([
-    ViewChild('filterTrigger')
-], ColumnHeaderFilterComponent.prototype, "filterTrigger", void 0);
-__decorate([
-    ViewChild('filterPanel')
-], ColumnHeaderFilterComponent.prototype, "filterPanel", void 0);
-ColumnHeaderFilterComponent = __decorate([
-    Component({
-        selector: 'ogrid-primeng-column-header-filter',
-        standalone: true,
-        changeDetection: ChangeDetectionStrategy.OnPush,
-        template: `
-    <div style="display:flex;align-items:center;flex:1;min-width:0;gap:4px">
-      <div style="flex:1;min-width:0;overflow:hidden">
-        <span style="overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block" [title]="columnName" data-header-label>
-          {{ columnName }}
-        </span>
-      </div>
-      <div style="display:flex;align-items:center;gap:2px;flex-shrink:0">
-        @if (filterType !== 'none') {
-          <button
-            type="button"
-            #filterTrigger
-            (click)="toggleFilter()"
-            [attr.aria-label]="'Filter ' + columnName"
-            [title]="'Filter ' + columnName"
-            style="border:none;background:transparent;cursor:pointer;padding:2px 4px;font-size:12px;position:relative;color:var(--ogrid-fg, #242424)"
-            [style.font-weight]="hasActiveFilter() ? 'bold' : 'normal'"
-          >
-            &#9662;
-            @if (hasActiveFilter()) {
-              <span style="position:absolute;top:0;right:0;width:6px;height:6px;border-radius:50%;background:var(--ogrid-selection, #217346)"></span>
-            }
-          </button>
-
-          @if (isFilterOpen()) {
-            <div
-              #filterPanel
-              style="position:absolute;top:100%;left:0;z-index:1000;min-width:200px;background:var(--ogrid-bg, #fff);border:1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));border-radius:6px;box-shadow:0 2px 8px rgba(0,0,0,0.12);font-weight:normal"
-            >
-              <div style="padding:8px 12px;font-weight:600;font-size:12px;border-bottom:1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12))">
-                Filter: {{ columnName }}
-              </div>
-
-              @if (filterType === 'text') {
-                <div style="padding:8px 12px">
-                  <input
-                    type="text"
-                    [value]="tempTextValue()"
-                    (input)="tempTextValue.set($any($event.target).value)"
-                    placeholder="Filter text..."
-                    style="width:100%;box-sizing:border-box;padding:6px 8px;border:1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));border-radius:4px;font-size:13px;background:var(--ogrid-bg, #fff);color:var(--ogrid-fg, #242424)"
-                    [attr.aria-label]="'Filter ' + columnName"
-                  />
-                </div>
-                <div style="display:flex;justify-content:flex-end;gap:6px;padding:6px 12px;border-top:1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12))">
-                  <button
-                    type="button"
-                    class="p-button p-button-text p-button-sm"
-                    (click)="handleTextClear()"
-                    [disabled]="!textValue"
-                    style="font-size:12px"
-                  >Clear</button>
-                  <button
-                    type="button"
-                    class="p-button p-button-sm"
-                    (click)="handleTextApply()"
-                    style="font-size:12px"
-                  >Apply</button>
-                </div>
-              }
-
-              @if (filterType === 'multiSelect') {
-                <div style="padding:8px 12px">
-                  <input
-                    type="text"
-                    [value]="searchText()"
-                    (input)="searchText.set($any($event.target).value)"
-                    placeholder="Search options..."
-                    style="width:100%;box-sizing:border-box;padding:6px 8px;border:1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));border-radius:4px;font-size:13px;margin-bottom:6px;background:var(--ogrid-bg, #fff);color:var(--ogrid-fg, #242424)"
-                    [attr.aria-label]="'Search ' + columnName + ' options'"
-                  />
-                  @if (isLoadingOptions) {
-                    <div style="padding:8px 0;color:var(--ogrid-fg-muted, rgba(0, 0, 0, 0.5));font-size:12px">Loading...</div>
-                  } @else {
-                    <div style="display:flex;gap:4px;margin-bottom:6px">
-                      <button type="button" class="p-button p-button-text p-button-sm" (click)="handleSelectAllOptions()" style="font-size:11px">All</button>
-                      <button type="button" class="p-button p-button-text p-button-sm" (click)="handleClearSelection()" style="font-size:11px">None</button>
-                    </div>
-                    <div style="max-height:160px;overflow-y:auto" role="group" [attr.aria-label]="columnName + ' filter options'">
-                      @for (opt of filteredOptions(); track opt) {
-                        <label style="display:flex;align-items:center;gap:6px;padding:2px 0;cursor:pointer;font-size:13px">
-                          <input
-                            type="checkbox"
-                            [checked]="tempSelected().has(opt)"
-                            (change)="handleCheckboxChange(opt, $event)"
-                          />
-                          {{ opt }}
-                        </label>
-                      }
-                    </div>
-                  }
-                </div>
-                <div style="display:flex;justify-content:flex-end;gap:6px;padding:6px 12px;border-top:1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12))">
-                  <button
-                    type="button"
-                    class="p-button p-button-sm"
-                    (click)="handleApplyMultiSelect()"
-                    style="font-size:12px"
-                  >Apply</button>
-                </div>
-              }
-
-              @if (filterType === 'people') {
-                <div style="padding:8px 12px">
-                  @if (selectedUser) {
-                    <div style="display:flex;align-items:center;justify-content:space-between;padding:4px 0;margin-bottom:4px">
-                      <span style="font-size:13px">{{ selectedUser!.displayName ?? selectedUser!.email }}</span>
-                      <button type="button" class="p-button p-button-text p-button-sm" (click)="handleClearUser()" style="font-size:11px">Clear</button>
-                    </div>
-                  }
-                  <input
-                    type="text"
-                    [value]="peopleSearchText()"
-                    (input)="onPeopleSearchInput($event)"
-                    placeholder="Search people..."
-                    style="width:100%;box-sizing:border-box;padding:6px 8px;border:1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));border-radius:4px;font-size:13px;background:var(--ogrid-bg, #fff);color:var(--ogrid-fg, #242424)"
-                    [attr.aria-label]="'Search people for ' + columnName"
-                  />
-                  @if (isPeopleLoading()) {
-                    <div style="padding:8px 0;color:var(--ogrid-fg-muted, rgba(0, 0, 0, 0.5));font-size:12px">Loading...</div>
-                  }
-                  @for (user of peopleSuggestions(); track user.email) {
-                    <button
-                      type="button"
-                      (click)="handleUserSelect(user)"
-                      style="display:block;width:100%;text-align:left;padding:6px 0;border:none;background:transparent;cursor:pointer;font-size:13px;color:var(--ogrid-fg, #242424)"
-                    >
-                      {{ user.displayName ?? user.email }}
-                    </button>
-                  }
-                </div>
-              }
-
-              @if (filterType === 'date') {
-                <div style="padding:8px 12px;display:flex;flex-direction:column;gap:6px">
-                  <label style="display:flex;align-items:center;gap:6px;font-size:12px">
-                    From:
-                    <input
-                      type="date"
-                      [value]="tempDateFrom()"
-                      (change)="tempDateFrom.set($any($event.target).value)"
-                      style="flex:1;padding:4px 6px;border:1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));border-radius:4px;background:var(--ogrid-bg, #fff);color:var(--ogrid-fg, #242424)"
-                    />
-                  </label>
-                  <label style="display:flex;align-items:center;gap:6px;font-size:12px">
-                    To:
-                    <input
-                      type="date"
-                      [value]="tempDateTo()"
-                      (change)="tempDateTo.set($any($event.target).value)"
-                      style="flex:1;padding:4px 6px;border:1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));border-radius:4px;background:var(--ogrid-bg, #fff);color:var(--ogrid-fg, #242424)"
-                    />
-                  </label>
-                </div>
-                <div style="display:flex;justify-content:flex-end;gap:6px;padding:6px 12px;border-top:1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12))">
-                  <button
-                    type="button"
-                    class="p-button p-button-text p-button-sm"
-                    (click)="handleDateClear()"
-                    [disabled]="!tempDateFrom() && !tempDateTo()"
-                    style="font-size:12px"
-                  >Clear</button>
-                  <button
-                    type="button"
-                    class="p-button p-button-sm"
-                    (click)="handleDateApply()"
-                    style="font-size:12px"
-                  >Apply</button>
-                </div>
-              }
-            </div>
-          }
-        }
-      </div>
-    </div>
-  `,
-        styles: [`
-    :host {
-      display: flex;
-      position: relative;
-      flex: 1;
-      min-width: 0;
-    }
-  `],
-    })
-], ColumnHeaderFilterComponent);
-export { ColumnHeaderFilterComponent };

package/dist/esm/column-header-menu/column-header-menu.component.js

@@ -1,134 +0,0 @@
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-import { Component, computed, ViewChild, ChangeDetectionStrategy, Input } from '@angular/core';
-import { ButtonModule } from 'primeng/button';
-import { MenuModule } from 'primeng/menu';
-import { getColumnHeaderMenuItems } from '@alaarab/ogrid-angular';
-/**
- * Column header dropdown menu for pin/unpin, sort, and autosize actions.
- * Uses PrimeNG Menu component.
- */
-let ColumnHeaderMenuComponent = class ColumnHeaderMenuComponent {
-    constructor() {
-        this.canPinLeft = true;
-        this.canPinRight = true;
-        this.canUnpin = false;
-        this.currentSort = null;
-        this.isSortable = true;
-        this.isResizable = true;
-        this.handlers = {};
-        this.menuModel = computed(() => {
-            const items = getColumnHeaderMenuItems({
-                canPinLeft: this.canPinLeft,
-                canPinRight: this.canPinRight,
-                canUnpin: this.canUnpin,
-                currentSort: this.currentSort,
-                isSortable: this.isSortable,
-                isResizable: this.isResizable,
-            });
-            const h = this.handlers;
-            const actionMap = {
-                pinLeft: h.onPinLeft,
-                pinRight: h.onPinRight,
-                unpin: h.onUnpin,
-                sortAsc: h.onSortAsc,
-                sortDesc: h.onSortDesc,
-                clearSort: h.onClearSort,
-                autosizeThis: h.onAutosizeThis,
-                autosizeAll: h.onAutosizeAll,
-            };
-            const result = [];
-            for (const item of items) {
-                result.push({
-                    label: item.label,
-                    disabled: item.disabled,
-                    command: () => {
-                        const action = actionMap[item.id];
-                        if (action) {
-                            action();
-                            h.onClose?.();
-                        }
-                    },
-                });
-                if (item.divider) {
-                    result.push({ separator: true });
-                }
-            }
-            return result;
-        });
-    }
-};
-__decorate([
-    Input({ required: true })
-], ColumnHeaderMenuComponent.prototype, "columnId", void 0);
-__decorate([
-    Input()
-], ColumnHeaderMenuComponent.prototype, "canPinLeft", void 0);
-__decorate([
-    Input()
-], ColumnHeaderMenuComponent.prototype, "canPinRight", void 0);
-__decorate([
-    Input()
-], ColumnHeaderMenuComponent.prototype, "canUnpin", void 0);
-__decorate([
-    Input()
-], ColumnHeaderMenuComponent.prototype, "currentSort", void 0);
-__decorate([
-    Input()
-], ColumnHeaderMenuComponent.prototype, "isSortable", void 0);
-__decorate([
-    Input()
-], ColumnHeaderMenuComponent.prototype, "isResizable", void 0);
-__decorate([
-    Input()
-], ColumnHeaderMenuComponent.prototype, "handlers", void 0);
-__decorate([
-    ViewChild('menu')
-], ColumnHeaderMenuComponent.prototype, "menuRef", void 0);
-ColumnHeaderMenuComponent = __decorate([
-    Component({
-        selector: 'column-header-menu',
-        standalone: true,
-        imports: [ButtonModule, MenuModule],
-        changeDetection: ChangeDetectionStrategy.OnPush,
-        template: `
-    <button
-      pButton
-      type="button"
-      icon="pi pi-ellipsis-v"
-      class="p-button-text p-button-sm column-header-menu-trigger"
-      (click)="menu.toggle($event)"
-      [attr.aria-label]="'Column options for ' + columnId"
-    ></button>
-
-    <p-menu
-      #menu
-      [model]="menuModel()"
-      [popup]="true"
-      appendTo="body"
-    ></p-menu>
-  `,
-        styles: [`
-    .column-header-menu-trigger {
-      padding: 0.25rem;
-      min-width: 24px;
-      height: 24px;
-      display: inline-flex;
-      align-items: center;
-      justify-content: center;
-      color: var(--ogrid-fg-secondary, rgba(0, 0, 0, 0.6));
-      border-radius: 4px;
-      transition: background-color 0.15s;
-    }
-    .column-header-menu-trigger:hover {
-      background: var(--ogrid-hover-bg, rgba(0, 0, 0, 0.04));
-      color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));
-    }
-  `],
-    })
-], ColumnHeaderMenuComponent);
-export { ColumnHeaderMenuComponent };