@progress/kendo-angular-grid 17.3.0-develop.2 → 18.0.0-develop.10
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/column-resizing/column-handle.directive.d.ts +4 -1
- package/column-resizing/column-resize.interface.d.ts +16 -0
- package/column-resizing/column-resizing.service.d.ts +4 -0
- package/column-resizing/table.directive.d.ts +3 -2
- package/columns/reorder-column.component.d.ts +20 -1
- package/directives.d.ts +5 -3
- package/dragdrop/draggable-column.directive.d.ts +0 -1
- package/esm2022/column-menu/column-menu.component.mjs +1 -1
- package/esm2022/column-resizing/column-handle.directive.mjs +60 -9
- package/esm2022/column-resizing/column-resizing.service.mjs +5 -0
- package/esm2022/column-resizing/table.directive.mjs +23 -11
- package/esm2022/columns/reorder-column.component.mjs +32 -2
- package/esm2022/common/filter-descriptor-differ.mjs +1 -1
- package/esm2022/directives.mjs +4 -0
- package/esm2022/dragdrop/draggable-column.directive.mjs +2 -8
- package/esm2022/grid.component.mjs +30 -3
- package/esm2022/grid.module.mjs +104 -102
- package/esm2022/index.mjs +2 -0
- package/esm2022/navigation/navigation.service.mjs +29 -4
- package/esm2022/package-metadata.mjs +2 -2
- package/esm2022/rendering/cell.component.mjs +17 -2
- package/esm2022/rendering/header/header.component.mjs +6 -8
- package/esm2022/rendering/list.component.mjs +4 -4
- package/esm2022/rendering/table-body.component.mjs +2 -2
- package/esm2022/row-reordering/drag-handle-template.directive.mjs +45 -0
- package/esm2022/row-reordering/drag-hint-template.directive.mjs +44 -0
- package/esm2022/row-reordering/row-reorder.service.mjs +3 -0
- package/fesm2022/progress-kendo-angular-grid.mjs +2408 -2173
- package/grid.component.d.ts +10 -2
- package/grid.module.d.ts +104 -102
- package/index.d.ts +3 -0
- package/navigation/navigation.service.d.ts +6 -2
- package/package.json +18 -18
- package/rendering/cell.component.d.ts +2 -0
- package/rendering/header/header.component.d.ts +2 -2
- package/row-reordering/drag-handle-template.directive.d.ts +34 -0
- package/row-reordering/drag-hint-template.directive.d.ts +33 -0
- package/row-reordering/row-reorder.service.d.ts +1 -0
- package/schematics/ngAdd/index.js +4 -4
|
@@ -20,11 +20,13 @@ export declare class ColumnHandleDirective implements OnInit, OnDestroy {
|
|
|
20
20
|
private cdr;
|
|
21
21
|
private ctx;
|
|
22
22
|
private columnInfoService;
|
|
23
|
+
isLast: boolean;
|
|
23
24
|
columns: Array<ColumnBase>;
|
|
24
25
|
column: ColumnBase;
|
|
25
26
|
get visible(): string;
|
|
26
27
|
get leftStyle(): number | null;
|
|
27
28
|
get rightStyle(): number | null;
|
|
29
|
+
private get isConstrainedMode();
|
|
28
30
|
private subscriptions;
|
|
29
31
|
private rtl;
|
|
30
32
|
autoFit(): void;
|
|
@@ -39,6 +41,7 @@ export declare class ColumnHandleDirective implements OnInit, OnDestroy {
|
|
|
39
41
|
private updateWidth;
|
|
40
42
|
private columnsForLevel;
|
|
41
43
|
private getTableDelta;
|
|
44
|
+
private stopPropagation;
|
|
42
45
|
static ɵfac: i0.ɵɵFactoryDeclaration<ColumnHandleDirective, [{ host: true; }, null, null, null, null, null, null]>;
|
|
43
|
-
static ɵdir: i0.ɵɵDirectiveDeclaration<ColumnHandleDirective, "[kendoGridColumnHandle]", never, { "columns": { "alias": "columns"; "required": false; }; "column": { "alias": "column"; "required": false; }; }, {}, never, never, true, never>;
|
|
46
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<ColumnHandleDirective, "[kendoGridColumnHandle]", never, { "isLast": { "alias": "isLast"; "required": false; }; "columns": { "alias": "columns"; "required": false; }; "column": { "alias": "column"; "required": false; }; }, {}, never, never, true, never>;
|
|
44
47
|
}
|
|
@@ -4,6 +4,22 @@
|
|
|
4
4
|
*-------------------------------------------------------------------------------------------*/
|
|
5
5
|
import { Observable } from 'rxjs';
|
|
6
6
|
import { ColumnBase } from '../columns/column-base';
|
|
7
|
+
/**
|
|
8
|
+
* The type of the [`resizable`](slug:api_grid_gridcomponent#toc-resizable) property. [See example](slug:resizing_columns_grid#constrained-mode)
|
|
9
|
+
*
|
|
10
|
+
* The possible values are:
|
|
11
|
+
*
|
|
12
|
+
* * `constrained` - Adjacent columns resize only up to their outer borders.
|
|
13
|
+
* * `unconstrained` - Columns are resized relative to the entire component.
|
|
14
|
+
*
|
|
15
|
+
* ```html
|
|
16
|
+
* <kendo-grid [kendoGridBinding]="gridData" [height]="370" resizable="constrained">
|
|
17
|
+
* <kendo-grid-column field="ProductID" title="ID"> </kendo-grid-column>
|
|
18
|
+
* ...
|
|
19
|
+
* </kendo-grid>
|
|
20
|
+
* ```
|
|
21
|
+
*/
|
|
22
|
+
export type ResizeMode = 'unconstrained' | 'constrained';
|
|
7
23
|
/**
|
|
8
24
|
* The returned type of the [`columnResize`](slug:api_grid_gridcomponent#toc-columnresize) event.
|
|
9
25
|
*/
|
|
@@ -11,6 +11,10 @@ import * as i0 from "@angular/core";
|
|
|
11
11
|
*/
|
|
12
12
|
export declare class ColumnResizingService {
|
|
13
13
|
changes: EventEmitter<ColumnResizeAction>;
|
|
14
|
+
adjacentColumn: ColumnBase;
|
|
15
|
+
areColumnsReordered: boolean;
|
|
16
|
+
isShiftPressed: boolean;
|
|
17
|
+
originalWidth: number;
|
|
14
18
|
private column;
|
|
15
19
|
private resizedColumns;
|
|
16
20
|
private tables;
|
|
@@ -4,6 +4,7 @@
|
|
|
4
4
|
*-------------------------------------------------------------------------------------------*/
|
|
5
5
|
import { ChangeDetectorRef, ElementRef, NgZone, OnDestroy, OnInit, Renderer2 } from '@angular/core';
|
|
6
6
|
import { ColumnResizingService } from './column-resizing.service';
|
|
7
|
+
import { ContextService } from '../common/provider.service';
|
|
7
8
|
import * as i0 from "@angular/core";
|
|
8
9
|
/**
|
|
9
10
|
* @hidden
|
|
@@ -14,14 +15,14 @@ export declare class TableDirective implements OnInit, OnDestroy {
|
|
|
14
15
|
private service;
|
|
15
16
|
private zone;
|
|
16
17
|
private cdr;
|
|
18
|
+
private ctx;
|
|
17
19
|
locked: boolean;
|
|
18
20
|
virtualColumns: boolean;
|
|
19
21
|
get minWidth(): number | null;
|
|
20
|
-
private originalWidth;
|
|
21
22
|
private firstResize;
|
|
22
23
|
private subscription;
|
|
23
24
|
private autoFitSubscription;
|
|
24
|
-
constructor(element: ElementRef, renderer: Renderer2, service: ColumnResizingService, zone: NgZone, cdr: ChangeDetectorRef);
|
|
25
|
+
constructor(element: ElementRef, renderer: Renderer2, service: ColumnResizingService, zone: NgZone, cdr: ChangeDetectorRef, ctx: ContextService);
|
|
25
26
|
ngOnInit(): void;
|
|
26
27
|
ngOnDestroy(): void;
|
|
27
28
|
private initState;
|
|
@@ -2,9 +2,12 @@
|
|
|
2
2
|
* Copyright © 2025 Progress Software Corporation. All rights reserved.
|
|
3
3
|
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
4
|
*-------------------------------------------------------------------------------------------*/
|
|
5
|
+
import { QueryList, TemplateRef } from '@angular/core';
|
|
5
6
|
import { ColumnBase } from './column-base';
|
|
6
7
|
import { IdService } from '../common/id.service';
|
|
7
8
|
import { SVGIcon } from '@progress/kendo-svg-icons';
|
|
9
|
+
import { RowDragHandleTemplateDirective } from '../row-reordering/drag-handle-template.directive';
|
|
10
|
+
import { RowDragHintTemplateDirective } from '../row-reordering/drag-hint-template.directive';
|
|
8
11
|
import * as i0 from "@angular/core";
|
|
9
12
|
/**
|
|
10
13
|
* Represents the drag handle for reordering rows in the Grid ([see example](slug:reordering_rows_grid))
|
|
@@ -21,11 +24,27 @@ export declare class RowReorderColumnComponent extends ColumnBase {
|
|
|
21
24
|
* @hidden
|
|
22
25
|
*/
|
|
23
26
|
dragHandleSVGIcon: SVGIcon;
|
|
27
|
+
/**
|
|
28
|
+
* @hidden
|
|
29
|
+
*/
|
|
30
|
+
dragHandleTemplate: QueryList<RowDragHandleTemplateDirective>;
|
|
31
|
+
/**
|
|
32
|
+
* @hidden
|
|
33
|
+
*/
|
|
34
|
+
dragHintTemplate: QueryList<RowDragHintTemplateDirective>;
|
|
24
35
|
/**
|
|
25
36
|
* @hidden
|
|
26
37
|
*/
|
|
27
38
|
readonly isRowReorderColumn: boolean;
|
|
39
|
+
/**
|
|
40
|
+
* @hidden
|
|
41
|
+
*/
|
|
42
|
+
get rowDragHandleTemplateRef(): TemplateRef<any>;
|
|
43
|
+
/**
|
|
44
|
+
* @hidden
|
|
45
|
+
*/
|
|
46
|
+
get rowDragHintTemplateRef(): TemplateRef<any>;
|
|
28
47
|
constructor(parent?: ColumnBase, idService?: IdService);
|
|
29
48
|
static ɵfac: i0.ɵɵFactoryDeclaration<RowReorderColumnComponent, [{ optional: true; host: true; skipSelf: true; }, { optional: true; }]>;
|
|
30
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<RowReorderColumnComponent, "kendo-grid-rowreorder-column", never, { "dragHandleIcon": { "alias": "dragHandleIcon"; "required": false; }; "dragHandleSVGIcon": { "alias": "dragHandleSVGIcon"; "required": false; }; }, {},
|
|
49
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<RowReorderColumnComponent, "kendo-grid-rowreorder-column", never, { "dragHandleIcon": { "alias": "dragHandleIcon"; "required": false; }; "dragHandleSVGIcon": { "alias": "dragHandleSVGIcon"; "required": false; }; }, {}, ["dragHandleTemplate", "dragHintTemplate"], never, true, never>;
|
|
31
50
|
}
|
package/directives.d.ts
CHANGED
|
@@ -135,6 +135,8 @@ import { TemplateContextDirective } from "@progress/kendo-angular-common";
|
|
|
135
135
|
import { PDFCommandToolbarDirective } from "./pdf/pdf-command-tool.directive";
|
|
136
136
|
import { ExcelCommandToolbarDirective } from "./excel/excel-command-tool.directive";
|
|
137
137
|
import { AddCommandToolbarDirective } from "./editing/add-command-tool.directive";
|
|
138
|
+
import { RowDragHandleTemplateDirective } from "./row-reordering/drag-handle-template.directive";
|
|
139
|
+
import { RowDragHintTemplateDirective } from "./row-reordering/drag-hint-template.directive";
|
|
138
140
|
/**
|
|
139
141
|
* @hidden
|
|
140
142
|
*
|
|
@@ -216,7 +218,7 @@ export declare const KENDO_GRID_FOOTER_EXPORTS: readonly [typeof FooterComponent
|
|
|
216
218
|
*
|
|
217
219
|
* Utility array that contains the Body module exports
|
|
218
220
|
*/
|
|
219
|
-
export declare const KENDO_GRID_BODY_EXPORTS: readonly [typeof CommandColumnComponent, typeof CheckboxColumnComponent, typeof SelectionCheckboxDirective, typeof CellTemplateDirective, typeof EditTemplateDirective, typeof TableBodyComponent, typeof NoRecordsTemplateDirective, typeof CellComponent, typeof EditCommandDirective, typeof CancelCommandDirective, typeof SaveCommandDirective, typeof RemoveCommandDirective, typeof AddCommandDirective, typeof AddCommandToolbarDirective, typeof CellLoadingTemplateDirective, typeof LoadingTemplateDirective, typeof RowReorderColumnComponent];
|
|
221
|
+
export declare const KENDO_GRID_BODY_EXPORTS: readonly [typeof CommandColumnComponent, typeof CheckboxColumnComponent, typeof SelectionCheckboxDirective, typeof CellTemplateDirective, typeof EditTemplateDirective, typeof RowDragHandleTemplateDirective, typeof RowDragHintTemplateDirective, typeof TableBodyComponent, typeof NoRecordsTemplateDirective, typeof CellComponent, typeof EditCommandDirective, typeof CancelCommandDirective, typeof SaveCommandDirective, typeof RemoveCommandDirective, typeof AddCommandDirective, typeof AddCommandToolbarDirective, typeof CellLoadingTemplateDirective, typeof LoadingTemplateDirective, typeof RowReorderColumnComponent];
|
|
220
222
|
/**
|
|
221
223
|
* @hidden
|
|
222
224
|
*
|
|
@@ -228,7 +230,7 @@ export declare const KENDO_GRID_DECLARATIONS: readonly [typeof GridComponent, ty
|
|
|
228
230
|
*
|
|
229
231
|
* Utility array that contains the Grid module exports
|
|
230
232
|
*/
|
|
231
|
-
export declare const KENDO_GRID_EXPORTS: readonly [typeof GridComponent, typeof ToolbarTemplateDirective, typeof ToolbarComponent, typeof GridSpacerComponent, typeof StatusBarTemplateDirective, typeof DataBindingDirective, typeof SelectionDirective, typeof CustomMessagesComponent, typeof GroupBindingDirective, typeof TemplateEditingDirective, typeof ReactiveEditingDirective, typeof InCellEditingDirective, typeof ExpandDetailsDirective, typeof ExpandGroupDirective, typeof GridToolbarFocusableDirective, typeof GroupHeaderTemplateDirective, typeof GroupHeaderColumnTemplateDirective, typeof GroupFooterTemplateDirective, typeof GroupHeaderComponent, typeof GroupPanelComponent, typeof ColumnComponent, typeof ColumnGroupComponent, typeof LogicalCellDirective, typeof LogicalRowDirective, typeof FocusableDirective, typeof FooterTemplateDirective, typeof ColGroupComponent, typeof ResizableContainerDirective, typeof TemplateContextDirective, typeof FieldAccessorPipe, typeof DetailTemplateDirective, typeof SpanColumnComponent, typeof LoadingComponent, typeof GridTableDirective, typeof CommandColumnComponent, typeof CheckboxColumnComponent, typeof SelectionCheckboxDirective, typeof CellTemplateDirective, typeof EditTemplateDirective, typeof TableBodyComponent, typeof NoRecordsTemplateDirective, typeof CellComponent, typeof EditCommandDirective, typeof CancelCommandDirective, typeof SaveCommandDirective, typeof RemoveCommandDirective, typeof AddCommandDirective, typeof AddCommandToolbarDirective, typeof CellLoadingTemplateDirective, typeof LoadingTemplateDirective, typeof RowReorderColumnComponent, typeof HeaderComponent, typeof HeaderTemplateDirective, typeof ColumnHandleDirective, typeof SelectAllCheckboxDirective, typeof FilterRowComponent, typeof FilterCellComponent, typeof FilterCellTemplateDirective, typeof StringFilterCellComponent, typeof NumericFilterCellComponent, typeof AutoCompleteFilterCellComponent, typeof BooleanFilterCellComponent, typeof FilterCellHostDirective, typeof FilterCellWrapperComponent, typeof DateFilterCellComponent, typeof FilterCellOperatorsComponent, typeof ContainsFilterOperatorComponent, typeof DoesNotContainFilterOperatorComponent, typeof EndsWithFilterOperatorComponent, typeof EqualFilterOperatorComponent, typeof IsEmptyFilterOperatorComponent, typeof IsNotEmptyFilterOperatorComponent, typeof IsNotNullFilterOperatorComponent, typeof IsNullFilterOperatorComponent, typeof NotEqualFilterOperatorComponent, typeof StartsWithFilterOperatorComponent, typeof GreaterFilterOperatorComponent, typeof GreaterOrEqualToFilterOperatorComponent, typeof LessFilterOperatorComponent, typeof LessOrEqualToFilterOperatorComponent, typeof AfterFilterOperatorComponent, typeof AfterEqFilterOperatorComponent, typeof BeforeEqFilterOperatorComponent, typeof BeforeFilterOperatorComponent, typeof FilterMenuComponent, typeof FilterMenuContainerComponent, typeof FilterMenuInputWrapperComponent, typeof StringFilterMenuInputComponent, typeof StringFilterMenuComponent, typeof FilterMenuTemplateDirective, typeof NumericFilterMenuComponent, typeof NumericFilterMenuInputComponent, typeof DateFilterMenuInputComponent, typeof DateFilterMenuComponent, typeof FilterMenuHostDirective, typeof BooleanFilterMenuComponent, typeof FilterMenuDropDownListDirective, typeof BooleanFilterRadioButtonDirective, typeof ColumnChooserComponent, typeof ColumnMenuFilterComponent, typeof ColumnMenuItemComponent, typeof ColumnMenuItemContentTemplateDirective, typeof ColumnMenuSortComponent, typeof ColumnMenuLockComponent, typeof ColumnMenuStickComponent, typeof ColumnMenuPositionComponent, typeof ColumnMenuChooserComponent, typeof ColumnMenuTemplateDirective, typeof ColumnMenuContainerComponent, typeof ColumnMenuItemDirective, typeof ColumnMenuComponent, typeof ColumnMenuAutoSizeColumnComponent, typeof ColumnMenuAutoSizeAllColumnsComponent, typeof GridClipboardDirective];
|
|
233
|
+
export declare const KENDO_GRID_EXPORTS: readonly [typeof GridComponent, typeof ToolbarTemplateDirective, typeof ToolbarComponent, typeof GridSpacerComponent, typeof StatusBarTemplateDirective, typeof DataBindingDirective, typeof SelectionDirective, typeof CustomMessagesComponent, typeof GroupBindingDirective, typeof TemplateEditingDirective, typeof ReactiveEditingDirective, typeof InCellEditingDirective, typeof ExpandDetailsDirective, typeof ExpandGroupDirective, typeof GridToolbarFocusableDirective, typeof GroupHeaderTemplateDirective, typeof GroupHeaderColumnTemplateDirective, typeof GroupFooterTemplateDirective, typeof GroupHeaderComponent, typeof GroupPanelComponent, typeof ColumnComponent, typeof ColumnGroupComponent, typeof LogicalCellDirective, typeof LogicalRowDirective, typeof FocusableDirective, typeof FooterTemplateDirective, typeof ColGroupComponent, typeof ResizableContainerDirective, typeof TemplateContextDirective, typeof FieldAccessorPipe, typeof DetailTemplateDirective, typeof SpanColumnComponent, typeof LoadingComponent, typeof GridTableDirective, typeof CommandColumnComponent, typeof CheckboxColumnComponent, typeof SelectionCheckboxDirective, typeof CellTemplateDirective, typeof EditTemplateDirective, typeof RowDragHandleTemplateDirective, typeof RowDragHintTemplateDirective, typeof TableBodyComponent, typeof NoRecordsTemplateDirective, typeof CellComponent, typeof EditCommandDirective, typeof CancelCommandDirective, typeof SaveCommandDirective, typeof RemoveCommandDirective, typeof AddCommandDirective, typeof AddCommandToolbarDirective, typeof CellLoadingTemplateDirective, typeof LoadingTemplateDirective, typeof RowReorderColumnComponent, typeof HeaderComponent, typeof HeaderTemplateDirective, typeof ColumnHandleDirective, typeof SelectAllCheckboxDirective, typeof FilterRowComponent, typeof FilterCellComponent, typeof FilterCellTemplateDirective, typeof StringFilterCellComponent, typeof NumericFilterCellComponent, typeof AutoCompleteFilterCellComponent, typeof BooleanFilterCellComponent, typeof FilterCellHostDirective, typeof FilterCellWrapperComponent, typeof DateFilterCellComponent, typeof FilterCellOperatorsComponent, typeof ContainsFilterOperatorComponent, typeof DoesNotContainFilterOperatorComponent, typeof EndsWithFilterOperatorComponent, typeof EqualFilterOperatorComponent, typeof IsEmptyFilterOperatorComponent, typeof IsNotEmptyFilterOperatorComponent, typeof IsNotNullFilterOperatorComponent, typeof IsNullFilterOperatorComponent, typeof NotEqualFilterOperatorComponent, typeof StartsWithFilterOperatorComponent, typeof GreaterFilterOperatorComponent, typeof GreaterOrEqualToFilterOperatorComponent, typeof LessFilterOperatorComponent, typeof LessOrEqualToFilterOperatorComponent, typeof AfterFilterOperatorComponent, typeof AfterEqFilterOperatorComponent, typeof BeforeEqFilterOperatorComponent, typeof BeforeFilterOperatorComponent, typeof FilterMenuComponent, typeof FilterMenuContainerComponent, typeof FilterMenuInputWrapperComponent, typeof StringFilterMenuInputComponent, typeof StringFilterMenuComponent, typeof FilterMenuTemplateDirective, typeof NumericFilterMenuComponent, typeof NumericFilterMenuInputComponent, typeof DateFilterMenuInputComponent, typeof DateFilterMenuComponent, typeof FilterMenuHostDirective, typeof BooleanFilterMenuComponent, typeof FilterMenuDropDownListDirective, typeof BooleanFilterRadioButtonDirective, typeof ColumnChooserComponent, typeof ColumnMenuFilterComponent, typeof ColumnMenuItemComponent, typeof ColumnMenuItemContentTemplateDirective, typeof ColumnMenuSortComponent, typeof ColumnMenuLockComponent, typeof ColumnMenuStickComponent, typeof ColumnMenuPositionComponent, typeof ColumnMenuChooserComponent, typeof ColumnMenuTemplateDirective, typeof ColumnMenuContainerComponent, typeof ColumnMenuItemDirective, typeof ColumnMenuComponent, typeof ColumnMenuAutoSizeColumnComponent, typeof ColumnMenuAutoSizeAllColumnsComponent, typeof GridClipboardDirective];
|
|
232
234
|
/**
|
|
233
235
|
* @hidden
|
|
234
236
|
*
|
|
@@ -244,4 +246,4 @@ export declare const KENDO_GRID_PDF_EXPORT: readonly [typeof PDFComponent, typeo
|
|
|
244
246
|
/**
|
|
245
247
|
* Utility array that contains all `Grid` related components and directives
|
|
246
248
|
*/
|
|
247
|
-
export declare const KENDO_GRID: readonly [typeof GridComponent, typeof ToolbarTemplateDirective, typeof ToolbarComponent, typeof GridSpacerComponent, typeof StatusBarTemplateDirective, typeof DataBindingDirective, typeof SelectionDirective, typeof CustomMessagesComponent, typeof GroupBindingDirective, typeof TemplateEditingDirective, typeof ReactiveEditingDirective, typeof InCellEditingDirective, typeof ExpandDetailsDirective, typeof ExpandGroupDirective, typeof GridToolbarFocusableDirective, typeof GroupHeaderTemplateDirective, typeof GroupHeaderColumnTemplateDirective, typeof GroupFooterTemplateDirective, typeof GroupHeaderComponent, typeof GroupPanelComponent, typeof ColumnComponent, typeof ColumnGroupComponent, typeof LogicalCellDirective, typeof LogicalRowDirective, typeof FocusableDirective, typeof FooterTemplateDirective, typeof ColGroupComponent, typeof ResizableContainerDirective, typeof TemplateContextDirective, typeof FieldAccessorPipe, typeof DetailTemplateDirective, typeof SpanColumnComponent, typeof LoadingComponent, typeof GridTableDirective, typeof CommandColumnComponent, typeof CheckboxColumnComponent, typeof SelectionCheckboxDirective, typeof CellTemplateDirective, typeof EditTemplateDirective, typeof TableBodyComponent, typeof NoRecordsTemplateDirective, typeof CellComponent, typeof EditCommandDirective, typeof CancelCommandDirective, typeof SaveCommandDirective, typeof RemoveCommandDirective, typeof AddCommandDirective, typeof AddCommandToolbarDirective, typeof CellLoadingTemplateDirective, typeof LoadingTemplateDirective, typeof RowReorderColumnComponent, typeof HeaderComponent, typeof HeaderTemplateDirective, typeof ColumnHandleDirective, typeof SelectAllCheckboxDirective, typeof FilterRowComponent, typeof FilterCellComponent, typeof FilterCellTemplateDirective, typeof StringFilterCellComponent, typeof NumericFilterCellComponent, typeof AutoCompleteFilterCellComponent, typeof BooleanFilterCellComponent, typeof FilterCellHostDirective, typeof FilterCellWrapperComponent, typeof DateFilterCellComponent, typeof FilterCellOperatorsComponent, typeof ContainsFilterOperatorComponent, typeof DoesNotContainFilterOperatorComponent, typeof EndsWithFilterOperatorComponent, typeof EqualFilterOperatorComponent, typeof IsEmptyFilterOperatorComponent, typeof IsNotEmptyFilterOperatorComponent, typeof IsNotNullFilterOperatorComponent, typeof IsNullFilterOperatorComponent, typeof NotEqualFilterOperatorComponent, typeof StartsWithFilterOperatorComponent, typeof GreaterFilterOperatorComponent, typeof GreaterOrEqualToFilterOperatorComponent, typeof LessFilterOperatorComponent, typeof LessOrEqualToFilterOperatorComponent, typeof AfterFilterOperatorComponent, typeof AfterEqFilterOperatorComponent, typeof BeforeEqFilterOperatorComponent, typeof BeforeFilterOperatorComponent, typeof FilterMenuComponent, typeof FilterMenuContainerComponent, typeof FilterMenuInputWrapperComponent, typeof StringFilterMenuInputComponent, typeof StringFilterMenuComponent, typeof FilterMenuTemplateDirective, typeof NumericFilterMenuComponent, typeof NumericFilterMenuInputComponent, typeof DateFilterMenuInputComponent, typeof DateFilterMenuComponent, typeof FilterMenuHostDirective, typeof BooleanFilterMenuComponent, typeof FilterMenuDropDownListDirective, typeof BooleanFilterRadioButtonDirective, typeof ColumnChooserComponent, typeof ColumnMenuFilterComponent, typeof ColumnMenuItemComponent, typeof ColumnMenuItemContentTemplateDirective, typeof ColumnMenuSortComponent, typeof ColumnMenuLockComponent, typeof ColumnMenuStickComponent, typeof ColumnMenuPositionComponent, typeof ColumnMenuChooserComponent, typeof ColumnMenuTemplateDirective, typeof ColumnMenuContainerComponent, typeof ColumnMenuItemDirective, typeof ColumnMenuComponent, typeof ColumnMenuAutoSizeColumnComponent, typeof ColumnMenuAutoSizeAllColumnsComponent, typeof GridClipboardDirective, typeof ExcelComponent, typeof ExcelCommandDirective, typeof ExcelCommandToolbarDirective, typeof ExcelColumnComponent, typeof ExcelColumnGroupComponent, typeof ExcelFooterTemplateDirective, typeof ExcelGroupFooterTemplateDirective, typeof ExcelGroupHeaderColumnTemplateDirective, typeof ExcelGroupHeaderTemplateDirective, typeof PDFComponent, typeof PDFMarginComponent, typeof PDFCommandDirective, typeof PDFTemplateDirective, typeof PDFCommandToolbarDirective];
|
|
249
|
+
export declare const KENDO_GRID: readonly [typeof GridComponent, typeof ToolbarTemplateDirective, typeof ToolbarComponent, typeof GridSpacerComponent, typeof StatusBarTemplateDirective, typeof DataBindingDirective, typeof SelectionDirective, typeof CustomMessagesComponent, typeof GroupBindingDirective, typeof TemplateEditingDirective, typeof ReactiveEditingDirective, typeof InCellEditingDirective, typeof ExpandDetailsDirective, typeof ExpandGroupDirective, typeof GridToolbarFocusableDirective, typeof GroupHeaderTemplateDirective, typeof GroupHeaderColumnTemplateDirective, typeof GroupFooterTemplateDirective, typeof GroupHeaderComponent, typeof GroupPanelComponent, typeof ColumnComponent, typeof ColumnGroupComponent, typeof LogicalCellDirective, typeof LogicalRowDirective, typeof FocusableDirective, typeof FooterTemplateDirective, typeof ColGroupComponent, typeof ResizableContainerDirective, typeof TemplateContextDirective, typeof FieldAccessorPipe, typeof DetailTemplateDirective, typeof SpanColumnComponent, typeof LoadingComponent, typeof GridTableDirective, typeof CommandColumnComponent, typeof CheckboxColumnComponent, typeof SelectionCheckboxDirective, typeof CellTemplateDirective, typeof EditTemplateDirective, typeof RowDragHandleTemplateDirective, typeof RowDragHintTemplateDirective, typeof TableBodyComponent, typeof NoRecordsTemplateDirective, typeof CellComponent, typeof EditCommandDirective, typeof CancelCommandDirective, typeof SaveCommandDirective, typeof RemoveCommandDirective, typeof AddCommandDirective, typeof AddCommandToolbarDirective, typeof CellLoadingTemplateDirective, typeof LoadingTemplateDirective, typeof RowReorderColumnComponent, typeof HeaderComponent, typeof HeaderTemplateDirective, typeof ColumnHandleDirective, typeof SelectAllCheckboxDirective, typeof FilterRowComponent, typeof FilterCellComponent, typeof FilterCellTemplateDirective, typeof StringFilterCellComponent, typeof NumericFilterCellComponent, typeof AutoCompleteFilterCellComponent, typeof BooleanFilterCellComponent, typeof FilterCellHostDirective, typeof FilterCellWrapperComponent, typeof DateFilterCellComponent, typeof FilterCellOperatorsComponent, typeof ContainsFilterOperatorComponent, typeof DoesNotContainFilterOperatorComponent, typeof EndsWithFilterOperatorComponent, typeof EqualFilterOperatorComponent, typeof IsEmptyFilterOperatorComponent, typeof IsNotEmptyFilterOperatorComponent, typeof IsNotNullFilterOperatorComponent, typeof IsNullFilterOperatorComponent, typeof NotEqualFilterOperatorComponent, typeof StartsWithFilterOperatorComponent, typeof GreaterFilterOperatorComponent, typeof GreaterOrEqualToFilterOperatorComponent, typeof LessFilterOperatorComponent, typeof LessOrEqualToFilterOperatorComponent, typeof AfterFilterOperatorComponent, typeof AfterEqFilterOperatorComponent, typeof BeforeEqFilterOperatorComponent, typeof BeforeFilterOperatorComponent, typeof FilterMenuComponent, typeof FilterMenuContainerComponent, typeof FilterMenuInputWrapperComponent, typeof StringFilterMenuInputComponent, typeof StringFilterMenuComponent, typeof FilterMenuTemplateDirective, typeof NumericFilterMenuComponent, typeof NumericFilterMenuInputComponent, typeof DateFilterMenuInputComponent, typeof DateFilterMenuComponent, typeof FilterMenuHostDirective, typeof BooleanFilterMenuComponent, typeof FilterMenuDropDownListDirective, typeof BooleanFilterRadioButtonDirective, typeof ColumnChooserComponent, typeof ColumnMenuFilterComponent, typeof ColumnMenuItemComponent, typeof ColumnMenuItemContentTemplateDirective, typeof ColumnMenuSortComponent, typeof ColumnMenuLockComponent, typeof ColumnMenuStickComponent, typeof ColumnMenuPositionComponent, typeof ColumnMenuChooserComponent, typeof ColumnMenuTemplateDirective, typeof ColumnMenuContainerComponent, typeof ColumnMenuItemDirective, typeof ColumnMenuComponent, typeof ColumnMenuAutoSizeColumnComponent, typeof ColumnMenuAutoSizeAllColumnsComponent, typeof GridClipboardDirective, typeof ExcelComponent, typeof ExcelCommandDirective, typeof ExcelCommandToolbarDirective, typeof ExcelColumnComponent, typeof ExcelColumnGroupComponent, typeof ExcelFooterTemplateDirective, typeof ExcelGroupFooterTemplateDirective, typeof ExcelGroupHeaderColumnTemplateDirective, typeof ExcelGroupHeaderTemplateDirective, typeof PDFComponent, typeof PDFMarginComponent, typeof PDFCommandDirective, typeof PDFTemplateDirective, typeof PDFCommandToolbarDirective];
|
|
@@ -25,7 +25,6 @@ export declare class DraggableColumnDirective implements OnInit, OnDestroy {
|
|
|
25
25
|
context: DragAndDropContext;
|
|
26
26
|
set enableDrag(enabled: boolean);
|
|
27
27
|
drag: EventEmitter<any>;
|
|
28
|
-
get hostClass(): boolean;
|
|
29
28
|
private subscriptions;
|
|
30
29
|
private enabled;
|
|
31
30
|
constructor(draggable: DraggableDirective, element: ElementRef, zone: NgZone, service: DragAndDropService, hint: DragHintService, cue: DropCueService, nav: NavigationService, renderer: Renderer2);
|
|
@@ -512,7 +512,7 @@ export class ColumnMenuComponent {
|
|
|
512
512
|
</kendo-tabstrip-tab>
|
|
513
513
|
</kendo-tabstrip>
|
|
514
514
|
</ng-template>
|
|
515
|
-
`, isInline: true, dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "component", type: ColumnMenuContainerComponent, selector: "kendo-grid-columnmenu-container" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ColumnMenuSortComponent, selector: "kendo-grid-columnmenu-sort" }, { kind: "directive", type: ColumnMenuItemDirective, selector: "[kendoGridColumnMenuItem]", inputs: ["kendoGridColumnMenuItem"] }, { kind: "component", type: ColumnMenuLockComponent, selector: "kendo-grid-columnmenu-lock" }, { kind: "component", type: ColumnMenuStickComponent, selector: "kendo-grid-columnmenu-stick" }, { kind: "component", type: ColumnMenuPositionComponent, selector: "kendo-grid-columnmenu-position", inputs: ["expanded", "showLock", "showStick", "isLast"], outputs: ["expand", "collapse"] }, { kind: "component", type: ColumnMenuChooserComponent, selector: "kendo-grid-columnmenu-chooser", inputs: ["expanded", "isLast"], outputs: ["expand", "collapse"] }, { kind: "component", type: ColumnMenuAutoSizeColumnComponent, selector: "kendo-grid-columnmenu-autosize-column", inputs: ["column"] }, { kind: "component", type: ColumnMenuAutoSizeAllColumnsComponent, selector: "kendo-grid-columnmenu-autosize-all-columns" }, { kind: "component", type: ColumnMenuFilterComponent, selector: "kendo-grid-columnmenu-filter", inputs: ["expanded", "isLast"], outputs: ["expand", "collapse"] }, { kind: "component", type: TabStripComponent, selector: "kendo-tabstrip", inputs: ["height", "animate", "tabAlignment", "tabPosition", "keepTabContent", "closable", "scrollable", "closeIcon", "closeIconClass", "closeSVGIcon", "showContentArea"], outputs: ["tabSelect", "tabClose", "tabScroll"], exportAs: ["kendoTabStrip"] }, { kind: "component", type: TabStripTabComponent, selector: "kendo-tabstrip-tab", inputs: ["title", "disabled", "cssClass", "cssStyle", "selected", "closable", "closeIcon", "closeIconClass", "closeSVGIcon"], exportAs: ["kendoTabStripTab"] }, { kind: "directive", type: TabTitleDirective, selector: "[kendoTabTitle]" }, { kind: "directive", type: TabContentDirective, selector: "[kendoTabContent]" }, { kind: "component", type: FilterMenuContainerComponent, selector: "kendo-grid-filter-menu-container", inputs: ["column", "isLast", "isExpanded", "menuTabbingService", "filter", "actionsClass"], outputs: ["close"] }, { kind: "component", type: ColumnListComponent, selector: "kendo-grid-columnlist", inputs: ["columns", "autoSync", "ariaLabel", "allowHideAll", "applyText", "resetText", "actionsClass", "isLast", "isExpanded", "service"], outputs: ["reset", "apply", "columnChange"] }] });
|
|
515
|
+
`, isInline: true, dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "component", type: ColumnMenuContainerComponent, selector: "kendo-grid-columnmenu-container" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ColumnMenuSortComponent, selector: "kendo-grid-columnmenu-sort" }, { kind: "directive", type: ColumnMenuItemDirective, selector: "[kendoGridColumnMenuItem]", inputs: ["kendoGridColumnMenuItem"] }, { kind: "component", type: ColumnMenuLockComponent, selector: "kendo-grid-columnmenu-lock" }, { kind: "component", type: ColumnMenuStickComponent, selector: "kendo-grid-columnmenu-stick" }, { kind: "component", type: ColumnMenuPositionComponent, selector: "kendo-grid-columnmenu-position", inputs: ["expanded", "showLock", "showStick", "isLast"], outputs: ["expand", "collapse"] }, { kind: "component", type: ColumnMenuChooserComponent, selector: "kendo-grid-columnmenu-chooser", inputs: ["expanded", "isLast"], outputs: ["expand", "collapse"] }, { kind: "component", type: ColumnMenuAutoSizeColumnComponent, selector: "kendo-grid-columnmenu-autosize-column", inputs: ["column"] }, { kind: "component", type: ColumnMenuAutoSizeAllColumnsComponent, selector: "kendo-grid-columnmenu-autosize-all-columns" }, { kind: "component", type: ColumnMenuFilterComponent, selector: "kendo-grid-columnmenu-filter", inputs: ["expanded", "isLast"], outputs: ["expand", "collapse"] }, { kind: "component", type: TabStripComponent, selector: "kendo-tabstrip", inputs: ["height", "animate", "tabAlignment", "tabPosition", "keepTabContent", "closable", "scrollable", "size", "closeIcon", "closeIconClass", "closeSVGIcon", "showContentArea"], outputs: ["tabSelect", "tabClose", "tabScroll"], exportAs: ["kendoTabStrip"] }, { kind: "component", type: TabStripTabComponent, selector: "kendo-tabstrip-tab", inputs: ["title", "disabled", "cssClass", "cssStyle", "selected", "closable", "closeIcon", "closeIconClass", "closeSVGIcon"], exportAs: ["kendoTabStripTab"] }, { kind: "directive", type: TabTitleDirective, selector: "[kendoTabTitle]" }, { kind: "directive", type: TabContentDirective, selector: "[kendoTabContent]" }, { kind: "component", type: FilterMenuContainerComponent, selector: "kendo-grid-filter-menu-container", inputs: ["column", "isLast", "isExpanded", "menuTabbingService", "filter", "actionsClass"], outputs: ["close"] }, { kind: "component", type: ColumnListComponent, selector: "kendo-grid-columnlist", inputs: ["columns", "autoSync", "ariaLabel", "allowHideAll", "applyText", "resetText", "actionsClass", "isLast", "isExpanded", "service"], outputs: ["reset", "apply", "columnChange"] }] });
|
|
516
516
|
}
|
|
517
517
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColumnMenuComponent, decorators: [{
|
|
518
518
|
type: Component,
|
|
@@ -35,15 +35,12 @@ const headerWidth = (handle) => handle.nativeElement.parentElement.offsetWidth;
|
|
|
35
35
|
/**
|
|
36
36
|
* @hidden
|
|
37
37
|
*/
|
|
38
|
-
const
|
|
39
|
-
.filter(c => !c.isColumnGroup);
|
|
38
|
+
const adjacentColumnWidth = (handle) => handle.nativeElement.parentElement.nextElementSibling?.offsetWidth;
|
|
40
39
|
/**
|
|
41
40
|
* @hidden
|
|
42
41
|
*/
|
|
43
|
-
const
|
|
44
|
-
|
|
45
|
-
event.preventDefault();
|
|
46
|
-
};
|
|
42
|
+
const allLeafColumns = columns => expandColumns(columns)
|
|
43
|
+
.filter(c => !c.isColumnGroup);
|
|
47
44
|
/**
|
|
48
45
|
* @hidden
|
|
49
46
|
*/
|
|
@@ -94,9 +91,13 @@ export class ColumnHandleDirective {
|
|
|
94
91
|
cdr;
|
|
95
92
|
ctx;
|
|
96
93
|
columnInfoService;
|
|
94
|
+
isLast;
|
|
97
95
|
columns = [];
|
|
98
96
|
column;
|
|
99
97
|
get visible() {
|
|
98
|
+
if (this.isConstrainedMode && this.isLast) {
|
|
99
|
+
return 'none';
|
|
100
|
+
}
|
|
100
101
|
return this.column.resizable ? 'block' : 'none';
|
|
101
102
|
}
|
|
102
103
|
get leftStyle() {
|
|
@@ -105,6 +106,13 @@ export class ColumnHandleDirective {
|
|
|
105
106
|
get rightStyle() {
|
|
106
107
|
return isTruthy(this.rtl) ? null : 0;
|
|
107
108
|
}
|
|
109
|
+
get isConstrainedMode() {
|
|
110
|
+
const isConstrainedMode = this.ctx.grid?.resizable === 'constrained';
|
|
111
|
+
const isUnconstrainedMode = this.ctx.grid?.resizable === true || this.ctx.grid?.resizable === 'unconstrained';
|
|
112
|
+
const constrainedNoShift = isConstrainedMode && !this.service.isShiftPressed;
|
|
113
|
+
const unconstrainedWithShift = isUnconstrainedMode && this.service.isShiftPressed;
|
|
114
|
+
return constrainedNoShift || unconstrainedWithShift;
|
|
115
|
+
}
|
|
108
116
|
subscriptions = new Subscription();
|
|
109
117
|
rtl = false;
|
|
110
118
|
autoFit() {
|
|
@@ -146,7 +154,7 @@ export class ColumnHandleDirective {
|
|
|
146
154
|
.subscribe(this.resize.bind(this)));
|
|
147
155
|
this.subscriptions.add(this.service.changes.pipe(filter(e => e.type === 'start'), filter(this.shouldUpdate.bind(this)), take(1) //on first resize only
|
|
148
156
|
).subscribe(this.initColumnWidth.bind(this)));
|
|
149
|
-
this.subscriptions.add(this.zone.runOutsideAngular(() => this.draggable.kendoPress.pipe(tap(stopPropagation), tap(() => this.service.start(this.column)), switchMap(preventOnDblClick(this.draggable.kendoRelease)), switchMap(createMoveStream(this.service, this.draggable)))
|
|
157
|
+
this.subscriptions.add(this.zone.runOutsideAngular(() => this.draggable.kendoPress.pipe(tap(this.stopPropagation), tap(() => this.service.start(this.column)), switchMap(preventOnDblClick(this.draggable.kendoRelease)), switchMap(createMoveStream(this.service, this.draggable)))
|
|
150
158
|
.subscribe(({ pageX, originalX }) => {
|
|
151
159
|
const delta = pageX - originalX;
|
|
152
160
|
const percent = toPercentage(delta, this.column.resizeStartWidth || this.column.width);
|
|
@@ -173,6 +181,28 @@ export class ColumnHandleDirective {
|
|
|
173
181
|
}
|
|
174
182
|
initState() {
|
|
175
183
|
this.column.resizeStartWidth = headerWidth(this.element);
|
|
184
|
+
let columns = [];
|
|
185
|
+
if (this.ctx.grid?.columns) {
|
|
186
|
+
columns = Array.from(this.ctx.grid?.columns) || [];
|
|
187
|
+
}
|
|
188
|
+
if (this.isConstrainedMode) {
|
|
189
|
+
if (this.service.areColumnsReordered) {
|
|
190
|
+
this.service.adjacentColumn = columns.find(c => c.orderIndex === this.column.orderIndex + 1);
|
|
191
|
+
this.service.adjacentColumn.resizeStartWidth = adjacentColumnWidth(this.element);
|
|
192
|
+
this.service.resizedColumn({
|
|
193
|
+
column: this.service.adjacentColumn,
|
|
194
|
+
oldWidth: this.service.adjacentColumn.resizeStartWidth
|
|
195
|
+
});
|
|
196
|
+
}
|
|
197
|
+
else {
|
|
198
|
+
this.service.adjacentColumn = columns[this.column.leafIndex + 1];
|
|
199
|
+
this.service.adjacentColumn.resizeStartWidth = adjacentColumnWidth(this.element);
|
|
200
|
+
this.service.resizedColumn({
|
|
201
|
+
column: this.service.adjacentColumn,
|
|
202
|
+
oldWidth: this.service.adjacentColumn.resizeStartWidth
|
|
203
|
+
});
|
|
204
|
+
}
|
|
205
|
+
}
|
|
176
206
|
this.service.resizedColumn({
|
|
177
207
|
column: this.column,
|
|
178
208
|
oldWidth: this.column.resizeStartWidth
|
|
@@ -187,6 +217,14 @@ export class ColumnHandleDirective {
|
|
|
187
217
|
if (isPresent(this.column.maxResizableWidth)) {
|
|
188
218
|
newWidth = Math.min(newWidth, this.column.maxResizableWidth);
|
|
189
219
|
}
|
|
220
|
+
if (this.isConstrainedMode) {
|
|
221
|
+
const maxAllowedResizableWidth = this.column.resizeStartWidth + this.service.adjacentColumn.resizeStartWidth - this.service.adjacentColumn.minResizableWidth;
|
|
222
|
+
newWidth = Math.min(newWidth, maxAllowedResizableWidth);
|
|
223
|
+
}
|
|
224
|
+
if (this.isConstrainedMode && isPresent(this.service.adjacentColumn.maxResizableWidth)) {
|
|
225
|
+
const maxAllowedResizableWidth = this.column.resizeStartWidth + this.service.adjacentColumn.resizeStartWidth - this.service.adjacentColumn.maxResizableWidth;
|
|
226
|
+
newWidth = Math.max(newWidth, maxAllowedResizableWidth);
|
|
227
|
+
}
|
|
190
228
|
const tableDelta = this.getTableDelta(newWidth, delta);
|
|
191
229
|
this.updateWidth(this.column, newWidth);
|
|
192
230
|
this.service.resizeTable(this.column, tableDelta);
|
|
@@ -199,6 +237,12 @@ export class ColumnHandleDirective {
|
|
|
199
237
|
this.service.resizeTable(this.column, tableDelta);
|
|
200
238
|
}
|
|
201
239
|
updateWidth(column, width) {
|
|
240
|
+
if (this.isConstrainedMode && this.service.adjacentColumn) {
|
|
241
|
+
const adjacentColumnNewWidth = column.resizeStartWidth + this.service.adjacentColumn.resizeStartWidth - width;
|
|
242
|
+
if (adjacentColumnNewWidth < (column.resizeStartWidth + this.service.adjacentColumn.resizeStartWidth)) {
|
|
243
|
+
this.service.adjacentColumn.width = adjacentColumnNewWidth;
|
|
244
|
+
}
|
|
245
|
+
}
|
|
202
246
|
column.width = width;
|
|
203
247
|
this.columnInfoService.hiddenColumns.forEach((col) => {
|
|
204
248
|
if (isBlank(col.width) && isPresent(col.implicitWidth)) {
|
|
@@ -231,8 +275,13 @@ export class ColumnHandleDirective {
|
|
|
231
275
|
return startWidth - maxWidth;
|
|
232
276
|
}
|
|
233
277
|
}
|
|
278
|
+
stopPropagation = ({ originalEvent: event }) => {
|
|
279
|
+
this.service.isShiftPressed = event.shiftKey;
|
|
280
|
+
event.stopPropagation();
|
|
281
|
+
event.preventDefault();
|
|
282
|
+
};
|
|
234
283
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColumnHandleDirective, deps: [{ token: i1.DraggableDirective, host: true }, { token: i0.ElementRef }, { token: i2.ColumnResizingService }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i3.ContextService }, { token: i4.ColumnInfoService }], target: i0.ɵɵFactoryTarget.Directive });
|
|
235
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: ColumnHandleDirective, isStandalone: true, selector: "[kendoGridColumnHandle]", inputs: { columns: "columns", column: "column" }, host: { listeners: { "dblclick": "autoFit()" }, properties: { "style.display": "this.visible", "style.left": "this.leftStyle", "style.right": "this.rightStyle" } }, ngImport: i0 });
|
|
284
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: ColumnHandleDirective, isStandalone: true, selector: "[kendoGridColumnHandle]", inputs: { isLast: "isLast", columns: "columns", column: "column" }, host: { listeners: { "dblclick": "autoFit()" }, properties: { "style.display": "this.visible", "style.left": "this.leftStyle", "style.right": "this.rightStyle" } }, ngImport: i0 });
|
|
236
285
|
}
|
|
237
286
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColumnHandleDirective, decorators: [{
|
|
238
287
|
type: Directive,
|
|
@@ -242,7 +291,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
242
291
|
}]
|
|
243
292
|
}], ctorParameters: function () { return [{ type: i1.DraggableDirective, decorators: [{
|
|
244
293
|
type: Host
|
|
245
|
-
}] }, { type: i0.ElementRef }, { type: i2.ColumnResizingService }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }, { type: i3.ContextService }, { type: i4.ColumnInfoService }]; }, propDecorators: {
|
|
294
|
+
}] }, { type: i0.ElementRef }, { type: i2.ColumnResizingService }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }, { type: i3.ContextService }, { type: i4.ColumnInfoService }]; }, propDecorators: { isLast: [{
|
|
295
|
+
type: Input
|
|
296
|
+
}], columns: [{
|
|
246
297
|
type: Input
|
|
247
298
|
}], column: [{
|
|
248
299
|
type: Input
|
|
@@ -23,6 +23,10 @@ const resizeArgs = (column, extra) => Object.assign({
|
|
|
23
23
|
*/
|
|
24
24
|
export class ColumnResizingService {
|
|
25
25
|
changes = new EventEmitter();
|
|
26
|
+
adjacentColumn;
|
|
27
|
+
areColumnsReordered = false;
|
|
28
|
+
isShiftPressed = false;
|
|
29
|
+
originalWidth;
|
|
26
30
|
column;
|
|
27
31
|
resizedColumns;
|
|
28
32
|
tables = [];
|
|
@@ -60,6 +64,7 @@ export class ColumnResizingService {
|
|
|
60
64
|
resizedColumns: this.resizedColumns,
|
|
61
65
|
type: 'end'
|
|
62
66
|
});
|
|
67
|
+
this.adjacentColumn = null;
|
|
63
68
|
}
|
|
64
69
|
registerTable(tableMetadata) {
|
|
65
70
|
this.tables.push(tableMetadata);
|
|
@@ -7,12 +7,14 @@ import { Observable } from 'rxjs';
|
|
|
7
7
|
import { resizableColumns } from '../columns/column-common';
|
|
8
8
|
import { ColumnResizingService } from './column-resizing.service';
|
|
9
9
|
import { filter, tap, map, switchMap, bufferCount } from 'rxjs/operators';
|
|
10
|
+
import { ContextService } from '../common/provider.service';
|
|
10
11
|
import * as i0 from "@angular/core";
|
|
11
12
|
import * as i1 from "./column-resizing.service";
|
|
13
|
+
import * as i2 from "../common/provider.service";
|
|
12
14
|
/**
|
|
13
15
|
* @hidden
|
|
14
16
|
*/
|
|
15
|
-
const columnsToResize = ({ columns }) => Math.max(1, resizableColumns(columns).length);
|
|
17
|
+
const columnsToResize = ({ columns }) => Math.max(1, resizableColumns(columns).filter(c => !c.isColumnGroup).length);
|
|
16
18
|
/**
|
|
17
19
|
* @hidden
|
|
18
20
|
*/
|
|
@@ -42,21 +44,22 @@ export class TableDirective {
|
|
|
42
44
|
service;
|
|
43
45
|
zone;
|
|
44
46
|
cdr;
|
|
47
|
+
ctx;
|
|
45
48
|
locked = false;
|
|
46
49
|
virtualColumns;
|
|
47
50
|
get minWidth() {
|
|
48
51
|
return this.firstResize ? 0 : null;
|
|
49
52
|
}
|
|
50
|
-
originalWidth;
|
|
51
53
|
firstResize = false;
|
|
52
54
|
subscription;
|
|
53
55
|
autoFitSubscription;
|
|
54
|
-
constructor(element, renderer, service, zone, cdr) {
|
|
56
|
+
constructor(element, renderer, service, zone, cdr, ctx) {
|
|
55
57
|
this.element = element;
|
|
56
58
|
this.renderer = renderer;
|
|
57
59
|
this.service = service;
|
|
58
60
|
this.zone = zone;
|
|
59
61
|
this.cdr = cdr;
|
|
62
|
+
this.ctx = ctx;
|
|
60
63
|
}
|
|
61
64
|
ngOnInit() {
|
|
62
65
|
const obs = this.service
|
|
@@ -79,15 +82,24 @@ export class TableDirective {
|
|
|
79
82
|
}
|
|
80
83
|
initState() {
|
|
81
84
|
this.firstResize = true;
|
|
82
|
-
|
|
83
|
-
|
|
85
|
+
const constrainedWithVirtualColumns = this.ctx.grid?.resizable === 'constrained' && this.virtualColumns;
|
|
86
|
+
if ((!this.virtualColumns || this.locked) || constrainedWithVirtualColumns) {
|
|
87
|
+
this.service.originalWidth = offsetWidth(this.element.nativeElement);
|
|
84
88
|
}
|
|
85
89
|
}
|
|
86
90
|
resize(deltas) {
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
+
const constrainedModeNoShift = this.ctx.grid?.resizable === 'constrained' && !this.service.isShiftPressed;
|
|
92
|
+
const unconstrainedModeShift = (this.ctx.grid?.resizable === true || this.ctx.grid?.resizable === 'unconstrained') && this.service.isShiftPressed;
|
|
93
|
+
const isConstrainedMode = constrainedModeNoShift || unconstrainedModeShift;
|
|
94
|
+
if (isConstrainedMode) {
|
|
95
|
+
this.renderer.setStyle(this.element.nativeElement, 'width', this.service.originalWidth + 'px');
|
|
96
|
+
}
|
|
97
|
+
else {
|
|
98
|
+
if (!this.virtualColumns || this.locked) {
|
|
99
|
+
const delta = deltas.reduce((sum, item) => sum + item, 0);
|
|
100
|
+
const width = this.service.originalWidth + delta;
|
|
101
|
+
this.renderer.setStyle(this.element.nativeElement, 'width', width + 'px');
|
|
102
|
+
}
|
|
91
103
|
}
|
|
92
104
|
this.cdr.detectChanges();
|
|
93
105
|
}
|
|
@@ -112,7 +124,7 @@ export class TableDirective {
|
|
|
112
124
|
const footer = pipe(row('tfoot>tr'), cell(info.index), offsetWidth)(dom);
|
|
113
125
|
return Math.max(header, data, footer);
|
|
114
126
|
}
|
|
115
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TableDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i1.ColumnResizingService }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
127
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TableDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i1.ColumnResizingService }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i2.ContextService }], target: i0.ɵɵFactoryTarget.Directive });
|
|
116
128
|
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: TableDirective, isStandalone: true, selector: "[kendoGridResizableTable]", inputs: { locked: "locked", virtualColumns: "virtualColumns" }, host: { properties: { "style.min-width": "this.minWidth" } }, ngImport: i0 });
|
|
117
129
|
}
|
|
118
130
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TableDirective, decorators: [{
|
|
@@ -121,7 +133,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
121
133
|
selector: '[kendoGridResizableTable]',
|
|
122
134
|
standalone: true
|
|
123
135
|
}]
|
|
124
|
-
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i1.ColumnResizingService }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { locked: [{
|
|
136
|
+
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i1.ColumnResizingService }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }, { type: i2.ContextService }]; }, propDecorators: { locked: [{
|
|
125
137
|
type: Input
|
|
126
138
|
}], virtualColumns: [{
|
|
127
139
|
type: Input
|
|
@@ -2,9 +2,11 @@
|
|
|
2
2
|
* Copyright © 2025 Progress Software Corporation. All rights reserved.
|
|
3
3
|
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
4
|
*-------------------------------------------------------------------------------------------*/
|
|
5
|
-
import { Component, forwardRef, SkipSelf, Host, Optional, Input } from '@angular/core';
|
|
5
|
+
import { Component, forwardRef, SkipSelf, Host, Optional, Input, ContentChildren, QueryList } from '@angular/core';
|
|
6
6
|
import { ColumnBase } from './column-base';
|
|
7
7
|
import { IdService } from '../common/id.service';
|
|
8
|
+
import { RowDragHandleTemplateDirective } from '../row-reordering/drag-handle-template.directive';
|
|
9
|
+
import { RowDragHintTemplateDirective } from '../row-reordering/drag-hint-template.directive';
|
|
8
10
|
import * as i0 from "@angular/core";
|
|
9
11
|
import * as i1 from "./column-base";
|
|
10
12
|
import * as i2 from "../common/id.service";
|
|
@@ -23,10 +25,32 @@ export class RowReorderColumnComponent extends ColumnBase {
|
|
|
23
25
|
* @hidden
|
|
24
26
|
*/
|
|
25
27
|
dragHandleSVGIcon;
|
|
28
|
+
/**
|
|
29
|
+
* @hidden
|
|
30
|
+
*/
|
|
31
|
+
dragHandleTemplate = new QueryList();
|
|
32
|
+
/**
|
|
33
|
+
* @hidden
|
|
34
|
+
*/
|
|
35
|
+
dragHintTemplate = new QueryList();
|
|
26
36
|
/**
|
|
27
37
|
* @hidden
|
|
28
38
|
*/
|
|
29
39
|
isRowReorderColumn = true;
|
|
40
|
+
/**
|
|
41
|
+
* @hidden
|
|
42
|
+
*/
|
|
43
|
+
get rowDragHandleTemplateRef() {
|
|
44
|
+
const rowTemplate = this.dragHandleTemplate.first;
|
|
45
|
+
return rowTemplate ? rowTemplate.templateRef : undefined;
|
|
46
|
+
}
|
|
47
|
+
/**
|
|
48
|
+
* @hidden
|
|
49
|
+
*/
|
|
50
|
+
get rowDragHintTemplateRef() {
|
|
51
|
+
const rowTemplate = this.dragHintTemplate.first;
|
|
52
|
+
return rowTemplate ? rowTemplate.templateRef : undefined;
|
|
53
|
+
}
|
|
30
54
|
constructor(parent, idService) {
|
|
31
55
|
super(parent, idService);
|
|
32
56
|
this.parent = parent;
|
|
@@ -37,7 +61,7 @@ export class RowReorderColumnComponent extends ColumnBase {
|
|
|
37
61
|
provide: ColumnBase,
|
|
38
62
|
useExisting: forwardRef(() => RowReorderColumnComponent)
|
|
39
63
|
}
|
|
40
|
-
], usesInheritance: true, ngImport: i0, template: ``, isInline: true });
|
|
64
|
+
], queries: [{ propertyName: "dragHandleTemplate", predicate: RowDragHandleTemplateDirective }, { propertyName: "dragHintTemplate", predicate: RowDragHintTemplateDirective }], usesInheritance: true, ngImport: i0, template: ``, isInline: true });
|
|
41
65
|
}
|
|
42
66
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RowReorderColumnComponent, decorators: [{
|
|
43
67
|
type: Component,
|
|
@@ -64,4 +88,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
64
88
|
type: Input
|
|
65
89
|
}], dragHandleSVGIcon: [{
|
|
66
90
|
type: Input
|
|
91
|
+
}], dragHandleTemplate: [{
|
|
92
|
+
type: ContentChildren,
|
|
93
|
+
args: [RowDragHandleTemplateDirective, { descendants: false }]
|
|
94
|
+
}], dragHintTemplate: [{
|
|
95
|
+
type: ContentChildren,
|
|
96
|
+
args: [RowDragHintTemplateDirective, { descendants: false }]
|
|
67
97
|
}] } });
|
|
@@ -29,7 +29,7 @@ const copyObject = (obj) => {
|
|
|
29
29
|
if (obj.constructor !== Object) {
|
|
30
30
|
const proto = obj.constructor.prototype;
|
|
31
31
|
Object.getOwnPropertyNames(proto).forEach((property) => {
|
|
32
|
-
if (property !== 'constructor' && proto.hasOwnProperty(property)) {
|
|
32
|
+
if (property !== 'constructor' && property !== '__proto__' && property !== 'prototype' && proto.hasOwnProperty(property)) {
|
|
33
33
|
result[property] = obj[property];
|
|
34
34
|
}
|
|
35
35
|
});
|
package/esm2022/directives.mjs
CHANGED
|
@@ -143,6 +143,8 @@ import { TemplateContextDirective } from "@progress/kendo-angular-common";
|
|
|
143
143
|
import { PDFCommandToolbarDirective } from "./pdf/pdf-command-tool.directive";
|
|
144
144
|
import { ExcelCommandToolbarDirective } from "./excel/excel-command-tool.directive";
|
|
145
145
|
import { AddCommandToolbarDirective } from "./editing/add-command-tool.directive";
|
|
146
|
+
import { RowDragHandleTemplateDirective } from "./row-reordering/drag-handle-template.directive";
|
|
147
|
+
import { RowDragHintTemplateDirective } from "./row-reordering/drag-hint-template.directive";
|
|
146
148
|
/**
|
|
147
149
|
* @hidden
|
|
148
150
|
*
|
|
@@ -349,6 +351,8 @@ export const KENDO_GRID_BODY_EXPORTS = [
|
|
|
349
351
|
SelectionCheckboxDirective,
|
|
350
352
|
CellTemplateDirective,
|
|
351
353
|
EditTemplateDirective,
|
|
354
|
+
RowDragHandleTemplateDirective,
|
|
355
|
+
RowDragHintTemplateDirective,
|
|
352
356
|
TableBodyComponent,
|
|
353
357
|
NoRecordsTemplateDirective,
|
|
354
358
|
CellComponent,
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
* Copyright © 2025 Progress Software Corporation. All rights reserved.
|
|
3
3
|
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
4
|
*-------------------------------------------------------------------------------------------*/
|
|
5
|
-
import { Directive, ElementRef, EventEmitter, Host, Input, NgZone, Output, Renderer2
|
|
5
|
+
import { Directive, ElementRef, EventEmitter, Host, Input, NgZone, Output, Renderer2 } from '@angular/core';
|
|
6
6
|
import { Subscription, of } from 'rxjs';
|
|
7
7
|
import { DraggableDirective, isDocumentAvailable } from '@progress/kendo-angular-common';
|
|
8
8
|
import { DragAndDropService } from './drag-and-drop.service';
|
|
@@ -51,9 +51,6 @@ export class DraggableColumnDirective {
|
|
|
51
51
|
this.updateTouchAction();
|
|
52
52
|
}
|
|
53
53
|
drag = new EventEmitter();
|
|
54
|
-
get hostClass() {
|
|
55
|
-
return this.enabled;
|
|
56
|
-
}
|
|
57
54
|
subscriptions = new Subscription();
|
|
58
55
|
enabled;
|
|
59
56
|
constructor(draggable, element, zone, service, hint, cue, nav, renderer) {
|
|
@@ -121,7 +118,7 @@ export class DraggableColumnDirective {
|
|
|
121
118
|
this.renderer.removeClass(this.element.nativeElement, 'k-touch-action-none');
|
|
122
119
|
}
|
|
123
120
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DraggableColumnDirective, deps: [{ token: i1.DraggableDirective, host: true }, { token: i0.ElementRef }, { token: i0.NgZone }, { token: i2.DragAndDropService }, { token: i3.DragHintService }, { token: i4.DropCueService }, { token: i5.NavigationService }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive });
|
|
124
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: DraggableColumnDirective, isStandalone: true, selector: "[kendoDraggableColumn]", inputs: { context: "context", enableDrag: "enableDrag" }, outputs: { drag: "drag" },
|
|
121
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: DraggableColumnDirective, isStandalone: true, selector: "[kendoDraggableColumn]", inputs: { context: "context", enableDrag: "enableDrag" }, outputs: { drag: "drag" }, ngImport: i0 });
|
|
125
122
|
}
|
|
126
123
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DraggableColumnDirective, decorators: [{
|
|
127
124
|
type: Directive,
|
|
@@ -137,7 +134,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
137
134
|
type: Input
|
|
138
135
|
}], drag: [{
|
|
139
136
|
type: Output
|
|
140
|
-
}], hostClass: [{
|
|
141
|
-
type: HostBinding,
|
|
142
|
-
args: ['class.k-grid-draggable-header']
|
|
143
137
|
}] } });
|