@dragonworks/ngx-dashboard 20.1.2 → 20.1.3
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/README.md +13 -45
- package/fesm2022/dragonworks-ngx-dashboard.mjs +1 -1
- package/fesm2022/dragonworks-ngx-dashboard.mjs.map +1 -1
- package/index.d.ts +34 -368
- package/package.json +1 -1
package/index.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as _dragonworks_ngx_dashboard from '@dragonworks/ngx-dashboard';
|
|
2
|
-
import * as _ngrx_signals from '@ngrx/signals';
|
|
3
2
|
import * as _angular_core from '@angular/core';
|
|
4
|
-
import { Type, ViewContainerRef, ComponentRef, OnChanges, SimpleChanges,
|
|
3
|
+
import { Type, ViewContainerRef, ComponentRef, OnChanges, SimpleChanges, InjectionToken } from '@angular/core';
|
|
4
|
+
import * as _ngrx_signals from '@ngrx/signals';
|
|
5
5
|
import { SafeHtml } from '@angular/platform-browser';
|
|
6
6
|
|
|
7
7
|
/**
|
|
@@ -11,50 +11,6 @@ import { SafeHtml } from '@angular/platform-browser';
|
|
|
11
11
|
type CellId = number & {
|
|
12
12
|
__brand: 'CellId';
|
|
13
13
|
};
|
|
14
|
-
/**
|
|
15
|
-
* Utility functions for working with CellId branded type.
|
|
16
|
-
*/
|
|
17
|
-
declare const CellIdUtils: {
|
|
18
|
-
/**
|
|
19
|
-
* Creates a CellId from row and column coordinates.
|
|
20
|
-
* @param row - The row number (1-based)
|
|
21
|
-
* @param col - The column number (1-based)
|
|
22
|
-
* @returns A branded CellId that encodes both coordinates
|
|
23
|
-
* @throws Error if row or col is less than 1, or if col exceeds MAX_COLUMNS
|
|
24
|
-
*/
|
|
25
|
-
create(row: number, col: number): CellId;
|
|
26
|
-
/**
|
|
27
|
-
* Decodes a CellId back into row and column coordinates.
|
|
28
|
-
* @param cellId - The CellId to decode
|
|
29
|
-
* @returns A tuple of [row, col] coordinates (1-based)
|
|
30
|
-
*/
|
|
31
|
-
decode(cellId: CellId): [number, number];
|
|
32
|
-
/**
|
|
33
|
-
* Gets the row coordinate from a CellId.
|
|
34
|
-
* @param cellId - The CellId to extract row from
|
|
35
|
-
* @returns The row number (1-based)
|
|
36
|
-
*/
|
|
37
|
-
getRow(cellId: CellId): number;
|
|
38
|
-
/**
|
|
39
|
-
* Gets the column coordinate from a CellId.
|
|
40
|
-
* @param cellId - The CellId to extract column from
|
|
41
|
-
* @returns The column number (1-based)
|
|
42
|
-
*/
|
|
43
|
-
getCol(cellId: CellId): number;
|
|
44
|
-
/**
|
|
45
|
-
* Creates a string representation of a CellId for debugging/display purposes.
|
|
46
|
-
* @param cellId - The CellId to convert to string
|
|
47
|
-
* @returns A string in the format "row-col"
|
|
48
|
-
*/
|
|
49
|
-
toString(cellId: CellId): string;
|
|
50
|
-
/**
|
|
51
|
-
* Checks if two CellIds are equal.
|
|
52
|
-
* @param a - First CellId
|
|
53
|
-
* @param b - Second CellId
|
|
54
|
-
* @returns True if the CellIds represent the same cell
|
|
55
|
-
*/
|
|
56
|
-
equals(a: CellId, b: CellId): boolean;
|
|
57
|
-
};
|
|
58
14
|
|
|
59
15
|
/**
|
|
60
16
|
* Branded type for widget identifiers to ensure type safety when working with widget instances.
|
|
@@ -63,45 +19,6 @@ declare const CellIdUtils: {
|
|
|
63
19
|
type WidgetId = string & {
|
|
64
20
|
__brand: 'WidgetId';
|
|
65
21
|
};
|
|
66
|
-
/**
|
|
67
|
-
* Utility functions for working with WidgetId branded type.
|
|
68
|
-
* WidgetIds are UUIDs that uniquely identify widget instances throughout their lifecycle,
|
|
69
|
-
* independent of their position on the dashboard grid.
|
|
70
|
-
*/
|
|
71
|
-
declare const WidgetIdUtils: {
|
|
72
|
-
/**
|
|
73
|
-
* Generates a new unique WidgetId.
|
|
74
|
-
* Uses crypto.randomUUID() when available, falls back to timestamp-based ID for older browsers.
|
|
75
|
-
* @returns A new unique WidgetId
|
|
76
|
-
*/
|
|
77
|
-
generate(): WidgetId;
|
|
78
|
-
/**
|
|
79
|
-
* Validates if a string is a valid WidgetId format.
|
|
80
|
-
* @param id - The string to validate
|
|
81
|
-
* @returns True if the string is a valid WidgetId format
|
|
82
|
-
*/
|
|
83
|
-
validate(id: string): id is WidgetId;
|
|
84
|
-
/**
|
|
85
|
-
* Converts a WidgetId to a string for use as map keys or serialization.
|
|
86
|
-
* @param id - The WidgetId to convert
|
|
87
|
-
* @returns The string representation of the WidgetId
|
|
88
|
-
*/
|
|
89
|
-
toString(id: WidgetId): string;
|
|
90
|
-
/**
|
|
91
|
-
* Creates a WidgetId from a string, validating the format.
|
|
92
|
-
* @param str - The string to convert to WidgetId
|
|
93
|
-
* @returns A WidgetId
|
|
94
|
-
* @throws Error if the string is not a valid WidgetId format
|
|
95
|
-
*/
|
|
96
|
-
fromString(str: string): WidgetId;
|
|
97
|
-
/**
|
|
98
|
-
* Checks if two WidgetIds are equal.
|
|
99
|
-
* @param a - First WidgetId
|
|
100
|
-
* @param b - Second WidgetId
|
|
101
|
-
* @returns True if the WidgetIds are the same
|
|
102
|
-
*/
|
|
103
|
-
equals(a: WidgetId, b: WidgetId): boolean;
|
|
104
|
-
};
|
|
105
22
|
|
|
106
23
|
interface Widget {
|
|
107
24
|
dashboardGetState?(): unknown;
|
|
@@ -125,7 +42,6 @@ interface WidgetFactory<T extends Widget = Widget> {
|
|
|
125
42
|
svgIcon: string;
|
|
126
43
|
createInstance(container: ViewContainerRef, state?: unknown): ComponentRef<T>;
|
|
127
44
|
}
|
|
128
|
-
declare function createFactoryFromComponent<T extends Widget>(component: WidgetComponentClass<T>): WidgetFactory;
|
|
129
45
|
|
|
130
46
|
interface CellPosition {
|
|
131
47
|
row: number;
|
|
@@ -243,10 +159,6 @@ interface ReservedSpace {
|
|
|
243
159
|
/** Space reserved on the left (e.g., padding) */
|
|
244
160
|
left: number;
|
|
245
161
|
}
|
|
246
|
-
/**
|
|
247
|
-
* Default reserved space when none is specified
|
|
248
|
-
*/
|
|
249
|
-
declare const DEFAULT_RESERVED_SPACE: ReservedSpace;
|
|
250
162
|
|
|
251
163
|
interface ResizeData {
|
|
252
164
|
cellId: CellId;
|
|
@@ -320,27 +232,27 @@ declare class DashboardComponent implements OnChanges {
|
|
|
320
232
|
width: number;
|
|
321
233
|
height: number;
|
|
322
234
|
}>;
|
|
323
|
-
widgetsById: _angular_core.Signal<Record<string,
|
|
235
|
+
widgetsById: _angular_core.Signal<Record<string, CellData>>;
|
|
324
236
|
resizeData: _angular_core.Signal<ResizeData | null>;
|
|
325
|
-
dragData: _angular_core.Signal<
|
|
237
|
+
dragData: _angular_core.Signal<DragData | null>;
|
|
326
238
|
hoveredDropZone: _angular_core.Signal<{
|
|
327
239
|
row: number;
|
|
328
240
|
col: number;
|
|
329
241
|
} | null>;
|
|
330
242
|
dashboardService: _dragonworks_ngx_dashboard.DashboardService;
|
|
331
|
-
cells: _angular_core.Signal<
|
|
243
|
+
cells: _angular_core.Signal<CellData[]>;
|
|
332
244
|
highlightedZones: _angular_core.Signal<{
|
|
333
245
|
row: number;
|
|
334
246
|
col: number;
|
|
335
247
|
}[]>;
|
|
336
|
-
highlightMap: _angular_core.Signal<Set<
|
|
337
|
-
invalidHighlightMap: _angular_core.Signal<Set<
|
|
248
|
+
highlightMap: _angular_core.Signal<Set<CellId>>;
|
|
249
|
+
invalidHighlightMap: _angular_core.Signal<Set<CellId>>;
|
|
338
250
|
isValidPlacement: _angular_core.Signal<boolean>;
|
|
339
251
|
resizePreviewCells: _angular_core.Signal<{
|
|
340
252
|
row: number;
|
|
341
253
|
col: number;
|
|
342
254
|
}[]>;
|
|
343
|
-
resizePreviewMap: _angular_core.Signal<Set<
|
|
255
|
+
resizePreviewMap: _angular_core.Signal<Set<CellId>>;
|
|
344
256
|
setGridConfig: (config: {
|
|
345
257
|
rows?: number;
|
|
346
258
|
columns?: number;
|
|
@@ -349,26 +261,26 @@ declare class DashboardComponent implements OnChanges {
|
|
|
349
261
|
setGridCellDimensions: (width: number, height: number) => void;
|
|
350
262
|
toggleEditMode: () => void;
|
|
351
263
|
setEditMode: (isEditMode: boolean) => void;
|
|
352
|
-
addWidget: (cell:
|
|
353
|
-
removeWidget: (widgetId:
|
|
354
|
-
updateWidgetPosition: (widgetId:
|
|
355
|
-
createWidget: (row: number, col: number, widgetFactory:
|
|
356
|
-
updateCellSettings: (widgetId:
|
|
357
|
-
updateWidgetSpan: (widgetId:
|
|
358
|
-
updateWidgetState: (widgetId:
|
|
264
|
+
addWidget: (cell: CellData) => void;
|
|
265
|
+
removeWidget: (widgetId: WidgetId) => void;
|
|
266
|
+
updateWidgetPosition: (widgetId: WidgetId, row: number, col: number) => void;
|
|
267
|
+
createWidget: (row: number, col: number, widgetFactory: WidgetFactory, widgetState?: string) => void;
|
|
268
|
+
updateCellSettings: (widgetId: WidgetId, flat: boolean) => void;
|
|
269
|
+
updateWidgetSpan: (widgetId: WidgetId, rowSpan: number, colSpan: number) => void;
|
|
270
|
+
updateWidgetState: (widgetId: WidgetId, widgetState: unknown) => void;
|
|
359
271
|
updateAllWidgetStates: (cellStates: Map<string, unknown>) => void;
|
|
360
272
|
clearDashboard: () => void;
|
|
361
|
-
startDrag: (dragData:
|
|
273
|
+
startDrag: (dragData: DragData) => void;
|
|
362
274
|
endDrag: () => void;
|
|
363
275
|
setHoveredDropZone: (zone: {
|
|
364
276
|
row: number;
|
|
365
277
|
col: number;
|
|
366
278
|
} | null) => void;
|
|
367
|
-
handleDrop: (dragData:
|
|
279
|
+
handleDrop: (dragData: DragData, targetPosition: {
|
|
368
280
|
row: number;
|
|
369
281
|
col: number;
|
|
370
282
|
}) => boolean;
|
|
371
|
-
startResize: (cellId:
|
|
283
|
+
startResize: (cellId: CellId) => void;
|
|
372
284
|
updateResizePreview: (direction: "horizontal" | "vertical", delta: number) => void;
|
|
373
285
|
endResize: (apply: boolean) => void;
|
|
374
286
|
exportDashboard: (getCurrentWidgetStates?: () => Map<string, unknown>) => DashboardDataDto;
|
|
@@ -384,9 +296,9 @@ declare class DashboardComponent implements OnChanges {
|
|
|
384
296
|
width: number;
|
|
385
297
|
height: number;
|
|
386
298
|
};
|
|
387
|
-
widgetsById: Record<string,
|
|
299
|
+
widgetsById: Record<string, CellData>;
|
|
388
300
|
resizeData: ResizeData | null;
|
|
389
|
-
dragData:
|
|
301
|
+
dragData: DragData | null;
|
|
390
302
|
hoveredDropZone: {
|
|
391
303
|
row: number;
|
|
392
304
|
col: number;
|
|
@@ -396,7 +308,7 @@ declare class DashboardComponent implements OnChanges {
|
|
|
396
308
|
dashboardData: _angular_core.InputSignal<DashboardDataDto>;
|
|
397
309
|
editMode: _angular_core.InputSignal<boolean>;
|
|
398
310
|
reservedSpace: _angular_core.InputSignal<ReservedSpace | undefined>;
|
|
399
|
-
cells: _angular_core.Signal<
|
|
311
|
+
cells: _angular_core.Signal<CellData[]>;
|
|
400
312
|
private dashboardEditor;
|
|
401
313
|
private dashboardViewer;
|
|
402
314
|
constructor();
|
|
@@ -409,252 +321,6 @@ declare class DashboardComponent implements OnChanges {
|
|
|
409
321
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<DashboardComponent, "ngx-dashboard", never, { "dashboardData": { "alias": "dashboardData"; "required": true; "isSignal": true; }; "editMode": { "alias": "editMode"; "required": false; "isSignal": true; }; "reservedSpace": { "alias": "reservedSpace"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
410
322
|
}
|
|
411
323
|
|
|
412
|
-
declare class CellComponent {
|
|
413
|
-
#private;
|
|
414
|
-
widgetId: _angular_core.InputSignal<WidgetId>;
|
|
415
|
-
cellId: _angular_core.InputSignal<CellId>;
|
|
416
|
-
widgetFactory: _angular_core.InputSignal<WidgetFactory<Widget> | undefined>;
|
|
417
|
-
widgetState: _angular_core.InputSignal<unknown>;
|
|
418
|
-
isEditMode: _angular_core.InputSignal<boolean>;
|
|
419
|
-
flat: _angular_core.InputSignal<boolean | undefined>;
|
|
420
|
-
row: _angular_core.ModelSignal<number>;
|
|
421
|
-
column: _angular_core.ModelSignal<number>;
|
|
422
|
-
rowSpan: _angular_core.InputSignal<number>;
|
|
423
|
-
colSpan: _angular_core.InputSignal<number>;
|
|
424
|
-
draggable: _angular_core.InputSignal<boolean>;
|
|
425
|
-
dragStart: _angular_core.OutputEmitterRef<DragData>;
|
|
426
|
-
dragEnd: _angular_core.OutputEmitterRef<void>;
|
|
427
|
-
edit: _angular_core.OutputEmitterRef<WidgetId>;
|
|
428
|
-
delete: _angular_core.OutputEmitterRef<WidgetId>;
|
|
429
|
-
settings: _angular_core.OutputEmitterRef<{
|
|
430
|
-
id: WidgetId;
|
|
431
|
-
flat: boolean;
|
|
432
|
-
}>;
|
|
433
|
-
resizeStart: _angular_core.OutputEmitterRef<{
|
|
434
|
-
cellId: CellId;
|
|
435
|
-
direction: "horizontal" | "vertical";
|
|
436
|
-
}>;
|
|
437
|
-
resizeMove: _angular_core.OutputEmitterRef<{
|
|
438
|
-
cellId: CellId;
|
|
439
|
-
direction: "horizontal" | "vertical";
|
|
440
|
-
delta: number;
|
|
441
|
-
}>;
|
|
442
|
-
resizeEnd: _angular_core.OutputEmitterRef<{
|
|
443
|
-
cellId: CellId;
|
|
444
|
-
apply: boolean;
|
|
445
|
-
}>;
|
|
446
|
-
private container;
|
|
447
|
-
isDragging: _angular_core.WritableSignal<boolean>;
|
|
448
|
-
readonly gridRowStyle: _angular_core.Signal<string>;
|
|
449
|
-
readonly gridColumnStyle: _angular_core.Signal<string>;
|
|
450
|
-
isResizing: _angular_core.Signal<boolean>;
|
|
451
|
-
isDragActive: _angular_core.Signal<boolean>;
|
|
452
|
-
resizeData: _angular_core.Signal<ResizeData | null>;
|
|
453
|
-
gridCellDimensions: _ngrx_signals.DeepSignal<{
|
|
454
|
-
width: number;
|
|
455
|
-
height: number;
|
|
456
|
-
}>;
|
|
457
|
-
private resizeDirection;
|
|
458
|
-
private resizeStartPos;
|
|
459
|
-
constructor();
|
|
460
|
-
/**
|
|
461
|
-
* Setup document-level event listeners for resize operations
|
|
462
|
-
* Performance: Only creates listeners when actively resizing (not for every cell)
|
|
463
|
-
* Angular-idiomatic: Uses Renderer2 for dynamic listener management
|
|
464
|
-
*/
|
|
465
|
-
private setupDocumentListeners;
|
|
466
|
-
setPosition(row: number, column: number): void;
|
|
467
|
-
onDragStart(event: DragEvent): void;
|
|
468
|
-
onDragEnd(): void;
|
|
469
|
-
/**
|
|
470
|
-
* Handle context menu events (called from template)
|
|
471
|
-
* Performance: Element-specific event binding, not document-level
|
|
472
|
-
* Angular-idiomatic: Template event binding instead of fromEvent
|
|
473
|
-
*/
|
|
474
|
-
onContextMenu(event: MouseEvent): void;
|
|
475
|
-
canEdit(): boolean;
|
|
476
|
-
onEdit(): void;
|
|
477
|
-
onDelete(): void;
|
|
478
|
-
onSettings(): Promise<void>;
|
|
479
|
-
/**
|
|
480
|
-
* Start resize operation and setup document listeners
|
|
481
|
-
* Performance: Only THIS cell creates document listeners when actively resizing
|
|
482
|
-
* RxJS-free: Uses Renderer2 for dynamic listener management
|
|
483
|
-
*/
|
|
484
|
-
onResizeStart(event: MouseEvent, direction: 'horizontal' | 'vertical'): void;
|
|
485
|
-
/**
|
|
486
|
-
* Handle resize move events (called from document listener)
|
|
487
|
-
* Performance: Only called for the actively resizing cell
|
|
488
|
-
* Bound method: Maintains component context without arrow functions
|
|
489
|
-
*/
|
|
490
|
-
private handleResizeMove;
|
|
491
|
-
/**
|
|
492
|
-
* Handle resize end events (called from document listener)
|
|
493
|
-
* Performance: Cleans up document listeners immediately after resize
|
|
494
|
-
* State cleanup: Resets resize direction to stop further event processing
|
|
495
|
-
*/
|
|
496
|
-
private handleResizeEnd;
|
|
497
|
-
/**
|
|
498
|
-
* Get the current widget state by calling dashboardGetState() on the widget instance.
|
|
499
|
-
* Used during dashboard export to get live widget state instead of stale stored state.
|
|
500
|
-
*/
|
|
501
|
-
getCurrentWidgetState(): unknown | undefined;
|
|
502
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<CellComponent, never>;
|
|
503
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<CellComponent, "lib-cell", never, { "widgetId": { "alias": "widgetId"; "required": true; "isSignal": true; }; "cellId": { "alias": "cellId"; "required": true; "isSignal": true; }; "widgetFactory": { "alias": "widgetFactory"; "required": false; "isSignal": true; }; "widgetState": { "alias": "widgetState"; "required": false; "isSignal": true; }; "isEditMode": { "alias": "isEditMode"; "required": false; "isSignal": true; }; "flat": { "alias": "flat"; "required": false; "isSignal": true; }; "row": { "alias": "row"; "required": true; "isSignal": true; }; "column": { "alias": "column"; "required": true; "isSignal": true; }; "rowSpan": { "alias": "rowSpan"; "required": false; "isSignal": true; }; "colSpan": { "alias": "colSpan"; "required": false; "isSignal": true; }; "draggable": { "alias": "draggable"; "required": false; "isSignal": true; }; }, { "row": "rowChange"; "column": "columnChange"; "dragStart": "dragStart"; "dragEnd": "dragEnd"; "edit": "edit"; "delete": "delete"; "settings": "settings"; "resizeStart": "resizeStart"; "resizeMove": "resizeMove"; "resizeEnd": "resizeEnd"; }, never, never, true, never>;
|
|
504
|
-
}
|
|
505
|
-
|
|
506
|
-
declare class DropZoneComponent {
|
|
507
|
-
#private;
|
|
508
|
-
row: _angular_core.InputSignal<number>;
|
|
509
|
-
col: _angular_core.InputSignal<number>;
|
|
510
|
-
index: _angular_core.InputSignal<number>;
|
|
511
|
-
highlight: _angular_core.InputSignal<boolean>;
|
|
512
|
-
highlightInvalid: _angular_core.InputSignal<boolean>;
|
|
513
|
-
highlightResize: _angular_core.InputSignal<boolean>;
|
|
514
|
-
editMode: _angular_core.InputSignal<boolean>;
|
|
515
|
-
dragEnter: _angular_core.OutputEmitterRef<{
|
|
516
|
-
row: number;
|
|
517
|
-
col: number;
|
|
518
|
-
}>;
|
|
519
|
-
dragExit: _angular_core.OutputEmitterRef<void>;
|
|
520
|
-
dragOver: _angular_core.OutputEmitterRef<{
|
|
521
|
-
row: number;
|
|
522
|
-
col: number;
|
|
523
|
-
}>;
|
|
524
|
-
dragDrop: _angular_core.OutputEmitterRef<{
|
|
525
|
-
data: DragData;
|
|
526
|
-
target: {
|
|
527
|
-
row: number;
|
|
528
|
-
col: number;
|
|
529
|
-
};
|
|
530
|
-
}>;
|
|
531
|
-
dropZoneId: _angular_core.Signal<string>;
|
|
532
|
-
dropData: _angular_core.Signal<{
|
|
533
|
-
row: number;
|
|
534
|
-
col: number;
|
|
535
|
-
}>;
|
|
536
|
-
dragData: _angular_core.Signal<DragData | null>;
|
|
537
|
-
dropEffect: _angular_core.Signal<"none" | "copy" | "move">;
|
|
538
|
-
get nativeElement(): HTMLElement;
|
|
539
|
-
onDragEnter(event: DragEvent): void;
|
|
540
|
-
onDragOver(event: DragEvent): void;
|
|
541
|
-
onDragLeave(event: DragEvent): void;
|
|
542
|
-
onDrop(event: DragEvent): void;
|
|
543
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<DropZoneComponent, never>;
|
|
544
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<DropZoneComponent, "lib-drop-zone", never, { "row": { "alias": "row"; "required": true; "isSignal": true; }; "col": { "alias": "col"; "required": true; "isSignal": true; }; "index": { "alias": "index"; "required": true; "isSignal": true; }; "highlight": { "alias": "highlight"; "required": false; "isSignal": true; }; "highlightInvalid": { "alias": "highlightInvalid"; "required": false; "isSignal": true; }; "highlightResize": { "alias": "highlightResize"; "required": false; "isSignal": true; }; "editMode": { "alias": "editMode"; "required": false; "isSignal": true; }; }, { "dragEnter": "dragEnter"; "dragExit": "dragExit"; "dragOver": "dragOver"; "dragDrop": "dragDrop"; }, never, never, true, never>;
|
|
545
|
-
}
|
|
546
|
-
|
|
547
|
-
declare class DashboardEditorComponent {
|
|
548
|
-
#private;
|
|
549
|
-
bottomGridRef: _angular_core.Signal<ElementRef<HTMLDivElement>>;
|
|
550
|
-
dropZones: _angular_core.Signal<readonly DropZoneComponent[]>;
|
|
551
|
-
cellComponents: _angular_core.Signal<readonly CellComponent[]>;
|
|
552
|
-
rows: _angular_core.InputSignal<number>;
|
|
553
|
-
columns: _angular_core.InputSignal<number>;
|
|
554
|
-
gutterSize: _angular_core.InputSignal<string>;
|
|
555
|
-
gutters: _angular_core.Signal<number>;
|
|
556
|
-
cells: _angular_core.Signal<CellData[]>;
|
|
557
|
-
highlightedZones: _angular_core.Signal<{
|
|
558
|
-
row: number;
|
|
559
|
-
col: number;
|
|
560
|
-
}[]>;
|
|
561
|
-
highlightMap: _angular_core.Signal<Set<CellId>>;
|
|
562
|
-
invalidHighlightMap: _angular_core.Signal<Set<CellId>>;
|
|
563
|
-
hoveredDropZone: _angular_core.Signal<{
|
|
564
|
-
row: number;
|
|
565
|
-
col: number;
|
|
566
|
-
} | null>;
|
|
567
|
-
resizePreviewMap: _angular_core.Signal<Set<CellId>>;
|
|
568
|
-
dropzonePositions: _angular_core.Signal<{
|
|
569
|
-
row: number;
|
|
570
|
-
col: number;
|
|
571
|
-
id: string;
|
|
572
|
-
index: number;
|
|
573
|
-
}[]>;
|
|
574
|
-
createCellId(row: number, col: number): CellId;
|
|
575
|
-
constructor();
|
|
576
|
-
addWidget: (cellData: CellData) => void;
|
|
577
|
-
updateCellPosition: (id: WidgetId, row: number, column: number) => void;
|
|
578
|
-
updateCellSpan: (id: WidgetId, colSpan: number, rowSpan: number) => void;
|
|
579
|
-
updateCellSettings: (id: WidgetId, flat: boolean) => void;
|
|
580
|
-
onDragOver: (event: {
|
|
581
|
-
row: number;
|
|
582
|
-
col: number;
|
|
583
|
-
}) => void;
|
|
584
|
-
onDragEnter: (event: {
|
|
585
|
-
row: number;
|
|
586
|
-
col: number;
|
|
587
|
-
}) => void;
|
|
588
|
-
onDragExit: () => void;
|
|
589
|
-
dragEnd: () => void;
|
|
590
|
-
onCellDelete: (id: WidgetId) => void;
|
|
591
|
-
onCellSettings: (event: {
|
|
592
|
-
id: WidgetId;
|
|
593
|
-
flat: boolean;
|
|
594
|
-
}) => void;
|
|
595
|
-
onCellResize: (event: {
|
|
596
|
-
id: WidgetId;
|
|
597
|
-
rowSpan: number;
|
|
598
|
-
colSpan: number;
|
|
599
|
-
}) => void;
|
|
600
|
-
onCellDragStart: (dragData: DragData) => void;
|
|
601
|
-
onCellResizeStart: (event: {
|
|
602
|
-
cellId: CellId;
|
|
603
|
-
direction: "horizontal" | "vertical";
|
|
604
|
-
}) => void;
|
|
605
|
-
onCellResizeMove: (event: {
|
|
606
|
-
cellId: CellId;
|
|
607
|
-
direction: "horizontal" | "vertical";
|
|
608
|
-
delta: number;
|
|
609
|
-
}) => void;
|
|
610
|
-
onCellResizeEnd: (event: {
|
|
611
|
-
cellId: CellId;
|
|
612
|
-
apply: boolean;
|
|
613
|
-
}) => void;
|
|
614
|
-
onDragDrop(event: {
|
|
615
|
-
data: DragData;
|
|
616
|
-
target: {
|
|
617
|
-
row: number;
|
|
618
|
-
col: number;
|
|
619
|
-
};
|
|
620
|
-
}): void;
|
|
621
|
-
/**
|
|
622
|
-
* Get current widget states from all cell components.
|
|
623
|
-
* Used during dashboard export to get live widget states.
|
|
624
|
-
*/
|
|
625
|
-
getCurrentWidgetStates(): Map<string, unknown>;
|
|
626
|
-
/**
|
|
627
|
-
* Export dashboard with live widget states from current component instances.
|
|
628
|
-
* This ensures the most up-to-date widget states are captured.
|
|
629
|
-
*/
|
|
630
|
-
exportDashboard(): _dragonworks_ngx_dashboard.DashboardDataDto;
|
|
631
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<DashboardEditorComponent, never>;
|
|
632
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<DashboardEditorComponent, "ngx-dashboard-editor", never, { "rows": { "alias": "rows"; "required": true; "isSignal": true; }; "columns": { "alias": "columns"; "required": true; "isSignal": true; }; "gutterSize": { "alias": "gutterSize"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
633
|
-
}
|
|
634
|
-
|
|
635
|
-
declare class DashboardViewerComponent {
|
|
636
|
-
#private;
|
|
637
|
-
cellComponents: _angular_core.Signal<readonly CellComponent[]>;
|
|
638
|
-
rows: _angular_core.InputSignal<number>;
|
|
639
|
-
columns: _angular_core.InputSignal<number>;
|
|
640
|
-
gutterSize: _angular_core.InputSignal<string>;
|
|
641
|
-
gutters: _angular_core.Signal<number>;
|
|
642
|
-
cells: _angular_core.Signal<_dragonworks_ngx_dashboard.CellData[]>;
|
|
643
|
-
constructor();
|
|
644
|
-
/**
|
|
645
|
-
* Get current widget states from all cell components.
|
|
646
|
-
* Used during dashboard export to get live widget states.
|
|
647
|
-
*/
|
|
648
|
-
getCurrentWidgetStates(): Map<string, unknown>;
|
|
649
|
-
/**
|
|
650
|
-
* Export dashboard with live widget states from current component instances.
|
|
651
|
-
* This ensures the most up-to-date widget states are captured.
|
|
652
|
-
*/
|
|
653
|
-
exportDashboard(): _dragonworks_ngx_dashboard.DashboardDataDto;
|
|
654
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<DashboardViewerComponent, never>;
|
|
655
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<DashboardViewerComponent, "ngx-dashboard-viewer", never, { "rows": { "alias": "rows"; "required": true; "isSignal": true; }; "columns": { "alias": "columns"; "required": true; "isSignal": true; }; "gutterSize": { "alias": "gutterSize"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
656
|
-
}
|
|
657
|
-
|
|
658
324
|
interface WidgetDisplayItem extends WidgetMetadata {
|
|
659
325
|
safeSvgIcon?: SafeHtml;
|
|
660
326
|
}
|
|
@@ -699,17 +365,6 @@ declare abstract class CellSettingsDialogProvider {
|
|
|
699
365
|
abstract openCellSettings(data: CellDisplayData): Promise<CellDisplayData | undefined>;
|
|
700
366
|
}
|
|
701
367
|
|
|
702
|
-
/**
|
|
703
|
-
* Default cell dialog provider that uses Material Design dialogs.
|
|
704
|
-
* Provides a modern, accessible dialog experience for cell settings.
|
|
705
|
-
*/
|
|
706
|
-
declare class DefaultCellSettingsDialogProvider extends CellSettingsDialogProvider {
|
|
707
|
-
private dialog;
|
|
708
|
-
openCellSettings(data: CellDisplayData): Promise<CellDisplayData | undefined>;
|
|
709
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<DefaultCellSettingsDialogProvider, never>;
|
|
710
|
-
static ɵprov: _angular_core.ɵɵInjectableDeclaration<DefaultCellSettingsDialogProvider>;
|
|
711
|
-
}
|
|
712
|
-
|
|
713
368
|
/**
|
|
714
369
|
* Injection token for the cell dialog provider.
|
|
715
370
|
* Use this to provide your custom dialog implementation.
|
|
@@ -723,5 +378,16 @@ declare class DefaultCellSettingsDialogProvider extends CellSettingsDialogProvid
|
|
|
723
378
|
*/
|
|
724
379
|
declare const CELL_SETTINGS_DIALOG_PROVIDER: InjectionToken<CellSettingsDialogProvider>;
|
|
725
380
|
|
|
726
|
-
|
|
727
|
-
|
|
381
|
+
/**
|
|
382
|
+
* Default cell dialog provider that uses Material Design dialogs.
|
|
383
|
+
* Provides a modern, accessible dialog experience for cell settings.
|
|
384
|
+
*/
|
|
385
|
+
declare class DefaultCellSettingsDialogProvider extends CellSettingsDialogProvider {
|
|
386
|
+
private dialog;
|
|
387
|
+
openCellSettings(data: CellDisplayData): Promise<CellDisplayData | undefined>;
|
|
388
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<DefaultCellSettingsDialogProvider, never>;
|
|
389
|
+
static ɵprov: _angular_core.ɵɵInjectableDeclaration<DefaultCellSettingsDialogProvider>;
|
|
390
|
+
}
|
|
391
|
+
|
|
392
|
+
export { CELL_SETTINGS_DIALOG_PROVIDER, CellSettingsDialogProvider, DashboardComponent, DashboardService, DefaultCellSettingsDialogProvider, WidgetListComponent, createDefaultDashboard, createEmptyDashboard };
|
|
393
|
+
export type { CellDataDto, DashboardDataDto, ReservedSpace, Widget, WidgetMetadata };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@dragonworks/ngx-dashboard",
|
|
3
|
-
"version": "20.1.
|
|
3
|
+
"version": "20.1.3",
|
|
4
4
|
"description": "Angular library for building drag-and-drop grid dashboards with resizable cells and customizable widgets",
|
|
5
5
|
"peerDependencies": {
|
|
6
6
|
"@angular/common": "^20.2.0",
|