@alaarab/ogrid-angular-primeng 2.5.6 → 2.5.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/esm/index.js +15 -5
- package/package.json +2 -2
package/dist/esm/index.js
CHANGED
|
@@ -210,18 +210,23 @@ import {INLINE_CELL_EDITOR_STYLES,INLINE_CELL_EDITOR_TEMPLATE,POPOVER_CELL_EDITO
|
|
|
210
210
|
border-radius: 4px;
|
|
211
211
|
transition: background-color 0.15s;
|
|
212
212
|
}
|
|
213
|
+
/* Always reserve space; hide on hover-capable devices until column is hovered.
|
|
214
|
+
The th:hover rule lives in the parent (ViewEncapsulation.None) styles. */
|
|
215
|
+
@media (hover: hover) {
|
|
216
|
+
.column-header-menu-trigger { visibility: hidden; }
|
|
217
|
+
}
|
|
213
218
|
.column-header-menu-trigger:hover {
|
|
214
219
|
background: var(--ogrid-hover-bg, rgba(0, 0, 0, 0.04));
|
|
215
220
|
color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));
|
|
216
221
|
}
|
|
217
|
-
`]})],c);var
|
|
222
|
+
`]})],c);var u=class extends BaseInlineCellEditorComponent{};u=e([Component({selector:"ogrid-primeng-inline-cell-editor",standalone:true,changeDetection:ChangeDetectionStrategy.OnPush,template:INLINE_CELL_EDITOR_TEMPLATE,styles:[INLINE_CELL_EDITOR_STYLES]})],u);var g=class extends BasePopoverCellEditorComponent{};g=e([Component({selector:"ogrid-primeng-popover-cell-editor",standalone:true,changeDetection:ChangeDetectionStrategy.OnPush,template:POPOVER_CELL_EDITOR_TEMPLATE,styles:[`
|
|
218
223
|
${POPOVER_CELL_EDITOR_OVERLAY_STYLES}
|
|
219
224
|
.ogrid-popover-anchor {
|
|
220
225
|
padding: 6px 10px; min-height: 20px; cursor: default; overflow: hidden;
|
|
221
226
|
text-overflow: ellipsis; white-space: nowrap;
|
|
222
227
|
outline: 2px solid var(--ogrid-selection, #217346); outline-offset: -2px;
|
|
223
228
|
}
|
|
224
|
-
`]})],
|
|
229
|
+
`]})],g);var t=class extends BaseDataGridTableComponent{constructor(){super();this.sortBy=void 0;this.sortDirection="asc";this.columnOrder=void 0;this.onColumnOrderChange=void 0;this.onColumnResized=void 0;this.onColumnPinned=void 0;this.pinnedColumnsInput=void 0;this.initialColumnWidths=void 0;this.layoutMode="fill";this.suppressHorizontalScroll=void 0;this.stickyHeaderInput=void 0;this.columnReorder=void 0;this.isLoadingInput=false;this.loadingMessageInput="Loading\u2026";this.editable=void 0;this.cellSelection=void 0;this.onCellValueChanged=void 0;this.onUndoInput=void 0;this.onRedoInput=void 0;this.canUndoInput=void 0;this.canRedoInput=void 0;this.rowSelectionMode="none";this.selectedRows=void 0;this.onSelectionChange=void 0;this.statusBar=void 0;this.filterOptions={};this.loadingFilterOptions={};this.peopleSearch=void 0;this.getUserByEmail=void 0;this.emptyStateInput=void 0;this.onCellError=void 0;this.ariaLabelInput=void 0;this.ariaLabelledByInput=void 0;this.showRowNumbers=false;this.showColumnLettersInput=false;this.showNameBoxInput=false;this.onActiveCellChange=void 0;this.formulaReferencesInput=void 0;this.currentPageInput=1;this.pageSizeInput=25;this.defaultMinWidth=DEFAULT_MIN_COLUMN_WIDTH;this.statusBarClasses={statusBar:"ogrid-status-bar",statusBarItem:"ogrid-status-bar-item",statusBarLabel:"ogrid-status-bar-label",statusBarValue:"ogrid-status-bar-value"};this.contextMenuClasses={contextMenu:"ogrid-context-menu",contextMenuItem:"ogrid-context-menu-item",contextMenuItemLabel:"ogrid-context-menu-item-label",contextMenuItemShortcut:"ogrid-context-menu-item-shortcut",contextMenuDivider:"ogrid-context-menu-divider"};this.primengColumnSizingOverrides=signal({});this.propsSignal=signal(void 0);this.resizeStartX=0;this.resizeColumnId="";this.resizeStartWidth=0;this.cancelEditHandler=()=>this.cancelEdit();this.showColumnLetters=computed(()=>!!this.getProps()?.showColumnLetters);this.formulaReferences=computed(()=>this.getProps()?.formulaReferences);this.resolvedAriaLabel=computed(()=>this.ariaLabelInput??(this.ariaLabelledByInput?void 0:"Data grid"));this.tableWidthStyle=computed(()=>this.showEmptyInGrid()?"100%":this.allowOverflowX()||this.layoutMode==="content"?"fit-content":"100%");this.tableMinWidthStyle=computed(()=>this.showEmptyInGrid()?"100%":this.allowOverflowX()||this.layoutMode==="content"?"max-content":"100%");this.initBase(),effect(()=>{let r=this.getProps()?.onActiveCellChange;if(!r)return;let n=this.activeCell();if(n){let a=n.columnIndex-this.colOffset(),s=n.rowIndex+1;r(formatCellReference(a,s));}else r(null);});}ngOnChanges(o){if(o.initialColumnWidths){let a=this.initialColumnWidths;a&&this.primengColumnSizingOverrides.set({...a});}let r=this.buildProps(),n=this.propsSignal();(!n||!this.shallowEqual(n,r))&&this.propsSignal.set(r);}shallowEqual(o,r){let n=o,a=r,s=Object.keys(n),f=Object.keys(a);if(s.length!==f.length)return false;for(let b of s)if(n[b]!==a[b])return false;return true}getProps(){return this.propsSignal()}getWrapperRef(){return this.wrapperRef}getTableContainerRef(){return this.tableContainerRefEl}getColumnWidth(o){let r=this.primengColumnSizingOverrides()[o.columnId];return r||(o.idealWidth??o.defaultWidth??o.minWidth??DEFAULT_MIN_COLUMN_WIDTH)}trackByRowId(o,r){return this.getRowIdInput(r)}onSelectAllChangePrimeng(o){this.state().rowSelection.handleSelectAll(o);}onRowClickPrimeng(o,r){if(this.rowSelectionMode!=="single")return;let n=this.getRowIdInput(r),a=this.selectedRowIds();this.state().rowSelection.updateSelection(a.has(n)?new Set:new Set([n]));}onRowCheckboxChangePrimeng(o,r,n,a){let s=this.getRowIdInput(o);this.state().rowSelection.handleRowCheckboxChange(s,r,n,this.lastMouseShift);}onResizeStartPrimeng(o,r){o.preventDefault(),this.state().interaction.setActiveCell?.(null),this.state().interaction.setSelectionRange?.(null),this.getWrapperRef()?.nativeElement.focus({preventScroll:true}),this.resizeStartX=o.clientX,this.resizeColumnId=r.columnId,this.resizeStartWidth=r.columnId===ROW_NUMBER_COLUMN_ID?this.getRowNumberWidth():this.getColumnWidth(r);let n=s=>{let f=s.clientX-this.resizeStartX,b=r.columnId===ROW_NUMBER_COLUMN_ID?ROW_NUMBER_COLUMN_MIN_WIDTH:r.minWidth??DEFAULT_MIN_COLUMN_WIDTH,C=Math.max(b,this.resizeStartWidth+f);this.primengColumnSizingOverrides.update(w=>({...w,[this.resizeColumnId]:C})),this.columnSizingVersion.update(w=>w+1);},a=()=>{window.removeEventListener("pointermove",n,true),window.removeEventListener("pointerup",a,true);let s=this.primengColumnSizingOverrides()[this.resizeColumnId];if(s){this.onColumnResized?.(this.resizeColumnId,s);let f={};for(let[b,C]of Object.entries(this.primengColumnSizingOverrides()))f[b]={widthPx:C};this.state().layout.setColumnSizingOverrides(f);}};window.addEventListener("pointermove",n,true),window.addEventListener("pointerup",a,true);}onResizeRowNumber(o){o.stopPropagation(),this.onResizeStartPrimeng(o,{columnId:ROW_NUMBER_COLUMN_ID,name:"#"});}getRowNumberWidth(){let o=this.primengColumnSizingOverrides()[ROW_NUMBER_COLUMN_ID];return o||super.getRowNumberWidth()}buildProps(){return {items:this.itemsInput,columns:this.columns,getRowId:this.getRowIdInput,sortBy:this.sortBy,sortDirection:this.sortDirection,onColumnSort:this.onColumnSort,visibleColumns:this.visibleColumns,columnOrder:this.columnOrder,onColumnOrderChange:this.onColumnOrderChange,onColumnResized:this.onColumnResized,onColumnPinned:this.onColumnPinned,pinnedColumns:this.pinnedColumnsInput,initialColumnWidths:this.initialColumnWidths,layoutMode:this.layoutMode,suppressHorizontalScroll:this.suppressHorizontalScroll,columnReorder:this.columnReorder,isLoading:this.isLoadingInput,loadingMessage:this.loadingMessageInput,editable:this.editable,cellSelection:this.cellSelection,onCellValueChanged:this.onCellValueChanged,onUndo:this.onUndoInput,onRedo:this.onRedoInput,canUndo:this.canUndoInput,canRedo:this.canRedoInput,rowSelection:this.rowSelectionMode,selectedRows:this.selectedRows,onSelectionChange:this.onSelectionChange,showRowNumbers:this.showRowNumbers,showColumnLetters:this.showColumnLettersInput,showNameBox:this.showNameBoxInput,onActiveCellChange:this.onActiveCellChange,currentPage:this.currentPageInput,pageSize:this.pageSizeInput,statusBar:this.statusBar,filters:this.filters,onFilterChange:this.onFilterChange,filterOptions:this.filterOptions,loadingFilterOptions:this.loadingFilterOptions,peopleSearch:this.peopleSearch,getUserByEmail:this.getUserByEmail,emptyState:this.emptyStateInput,onCellError:this.onCellError,stickyHeader:this.stickyHeaderInput,"aria-label":this.ariaLabelInput,"aria-labelledby":this.ariaLabelledByInput,formulaReferences:this.formulaReferencesInput}}getColumnLetter(o){return indexToColumnLetter(o)}};e([ViewChild("wrapper")],t.prototype,"wrapperRef",2),e([ViewChild("tableContainer")],t.prototype,"tableContainerRefEl",2),e([Input({required:true,alias:"items"})],t.prototype,"itemsInput",2),e([Input({required:true})],t.prototype,"columns",2),e([Input({required:true,alias:"getRowId"})],t.prototype,"getRowIdInput",2),e([Input()],t.prototype,"sortBy",2),e([Input()],t.prototype,"sortDirection",2),e([Input({required:true})],t.prototype,"onColumnSort",2),e([Input({required:true})],t.prototype,"visibleColumns",2),e([Input()],t.prototype,"columnOrder",2),e([Input()],t.prototype,"onColumnOrderChange",2),e([Input()],t.prototype,"onColumnResized",2),e([Input()],t.prototype,"onColumnPinned",2),e([Input({alias:"pinnedColumns"})],t.prototype,"pinnedColumnsInput",2),e([Input()],t.prototype,"initialColumnWidths",2),e([Input()],t.prototype,"layoutMode",2),e([Input()],t.prototype,"suppressHorizontalScroll",2),e([Input()],t.prototype,"stickyHeaderInput",2),e([Input()],t.prototype,"columnReorder",2),e([Input({alias:"isLoading"})],t.prototype,"isLoadingInput",2),e([Input({alias:"loadingMessage"})],t.prototype,"loadingMessageInput",2),e([Input()],t.prototype,"editable",2),e([Input()],t.prototype,"cellSelection",2),e([Input()],t.prototype,"onCellValueChanged",2),e([Input({alias:"onUndo"})],t.prototype,"onUndoInput",2),e([Input({alias:"onRedo"})],t.prototype,"onRedoInput",2),e([Input({alias:"canUndo"})],t.prototype,"canUndoInput",2),e([Input({alias:"canRedo"})],t.prototype,"canRedoInput",2),e([Input({alias:"rowSelection"})],t.prototype,"rowSelectionMode",2),e([Input()],t.prototype,"selectedRows",2),e([Input()],t.prototype,"onSelectionChange",2),e([Input()],t.prototype,"statusBar",2),e([Input({required:true})],t.prototype,"filters",2),e([Input({required:true})],t.prototype,"onFilterChange",2),e([Input()],t.prototype,"filterOptions",2),e([Input()],t.prototype,"loadingFilterOptions",2),e([Input()],t.prototype,"peopleSearch",2),e([Input()],t.prototype,"getUserByEmail",2),e([Input({alias:"emptyState"})],t.prototype,"emptyStateInput",2),e([Input()],t.prototype,"onCellError",2),e([Input({alias:"aria-label"})],t.prototype,"ariaLabelInput",2),e([Input({alias:"aria-labelledby"})],t.prototype,"ariaLabelledByInput",2),e([Input()],t.prototype,"showRowNumbers",2),e([Input({alias:"showColumnLetters"})],t.prototype,"showColumnLettersInput",2),e([Input({alias:"showNameBox"})],t.prototype,"showNameBoxInput",2),e([Input()],t.prototype,"onActiveCellChange",2),e([Input({alias:"formulaReferences"})],t.prototype,"formulaReferencesInput",2),e([Input({alias:"currentPage"})],t.prototype,"currentPageInput",2),e([Input({alias:"pageSize"})],t.prototype,"pageSizeInput",2),t=e([Component({selector:"ogrid-primeng-datagrid-table",standalone:true,imports:[StatusBarComponent,GridContextMenuComponent,MarchingAntsOverlayComponent,EmptyStateComponent,FormulaRefOverlayComponent,p,c,u,g],changeDetection:ChangeDetectionStrategy.OnPush,encapsulation:ViewEncapsulation.None,providers:[DataGridStateService,ColumnReorderService,VirtualScrollService],template:`
|
|
225
230
|
<div class="ogrid-root">
|
|
226
231
|
<div
|
|
227
232
|
#wrapper
|
|
@@ -426,7 +431,7 @@ import {INLINE_CELL_EDITOR_STYLES,INLINE_CELL_EDITOR_TEMPLATE,POPOVER_CELL_EDITO
|
|
|
426
431
|
[style.max-width.px]="getColumnWidth(col)"
|
|
427
432
|
[style.left.px]="pinned === 'left' ? getPinnedLeftOffset(col.columnId) : null"
|
|
428
433
|
[style.right.px]="pinned === 'right' ? getPinnedRightOffset(col.columnId) : null"
|
|
429
|
-
[style.text-align]="col.type === 'numeric' ? 'right' :
|
|
434
|
+
[style.text-align]="col.type === 'numeric' ? 'right' : null"
|
|
430
435
|
>
|
|
431
436
|
@let descriptor = getCellDescriptor(item, col, rowIndex, getGlobalColIndex(col));
|
|
432
437
|
@if (descriptor.mode === 'editing-inline') {
|
|
@@ -470,7 +475,7 @@ import {INLINE_CELL_EDITOR_STYLES,INLINE_CELL_EDITOR_TEMPLATE,POPOVER_CELL_EDITO
|
|
|
470
475
|
[style.outline-offset]="descriptor.isActive && !descriptor.isInRange ? '-2px' : null"
|
|
471
476
|
>
|
|
472
477
|
@if (col.type === 'boolean') {
|
|
473
|
-
<input type="checkbox" [checked]="!!descriptor.displayValue" [disabled]="!descriptor.canEditAny" (change)="descriptor.canEditAny ?
|
|
478
|
+
<input type="checkbox" [checked]="!!descriptor.displayValue" [disabled]="!descriptor.canEditAny" (change)="descriptor.canEditAny ? commitBooleanEdit(item, 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'" />
|
|
474
479
|
} @else {
|
|
475
480
|
<span [style]="resolveCellStyleFn(col, item, descriptor.displayValue)">{{ resolveCellContent(col, item, descriptor.displayValue) }}</span>
|
|
476
481
|
}
|
|
@@ -903,6 +908,11 @@ import {INLINE_CELL_EDITOR_STYLES,INLINE_CELL_EDITOR_TEMPLATE,POPOVER_CELL_EDITO
|
|
|
903
908
|
user-select: none;
|
|
904
909
|
font-variant-numeric: tabular-nums;
|
|
905
910
|
}
|
|
911
|
+
/* Reveal column menu trigger on header hover without layout shift.
|
|
912
|
+
The button always takes up space (visibility: hidden); shown when column is hovered. */
|
|
913
|
+
@media (hover: hover) {
|
|
914
|
+
th:hover .column-header-menu-trigger { visibility: visible; }
|
|
915
|
+
}
|
|
906
916
|
`]})],t);var m=class extends BaseColumnChooserComponent{get open(){return this.isOpen}};m=e([Component({selector:"ogrid-primeng-column-chooser",standalone:true,changeDetection:ChangeDetectionStrategy.OnPush,template:`
|
|
907
917
|
<div style="position:relative;display:inline-block">
|
|
908
918
|
<button
|
|
@@ -1137,4 +1147,4 @@ import {INLINE_CELL_EDITOR_STYLES,INLINE_CELL_EDITOR_TEMPLATE,POPOVER_CELL_EDITO
|
|
|
1137
1147
|
></ogrid-primeng-pagination-controls>
|
|
1138
1148
|
</div>
|
|
1139
1149
|
</ogrid-layout>
|
|
1140
|
-
`})],v);export{m as ColumnChooserComponent,p as ColumnHeaderFilterComponent,c as ColumnHeaderMenuComponent,t as DataGridTableComponent,
|
|
1150
|
+
`})],v);export{m as ColumnChooserComponent,p as ColumnHeaderFilterComponent,c as ColumnHeaderMenuComponent,t as DataGridTableComponent,u as InlineCellEditorComponent,v as OGridComponent,h as PaginationControlsComponent,g as PopoverCellEditorComponent};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@alaarab/ogrid-angular-primeng",
|
|
3
|
-
"version": "2.5.
|
|
3
|
+
"version": "2.5.7",
|
|
4
4
|
"description": "OGrid PrimeNG – PrimeNG Table-based data grid with sorting, filtering, pagination, column chooser, and CSV export.",
|
|
5
5
|
"main": "dist/esm/index.js",
|
|
6
6
|
"module": "dist/esm/index.js",
|
|
@@ -37,7 +37,7 @@
|
|
|
37
37
|
"node": ">=18"
|
|
38
38
|
},
|
|
39
39
|
"dependencies": {
|
|
40
|
-
"@alaarab/ogrid-angular": "2.5.
|
|
40
|
+
"@alaarab/ogrid-angular": "2.5.7"
|
|
41
41
|
},
|
|
42
42
|
"peerDependencies": {
|
|
43
43
|
"@angular/core": "^21.0.0",
|