@nanahoshi/mona-ui 0.1.0 → 0.1.1

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.
Files changed (72) hide show
  1. package/fesm2022/nanahoshi-mona-ui-auto-complete.mjs +11 -11
  2. package/fesm2022/nanahoshi-mona-ui-breadcrumb.mjs +17 -17
  3. package/fesm2022/nanahoshi-mona-ui-button-group.mjs +26 -26
  4. package/fesm2022/nanahoshi-mona-ui-button.mjs +109 -107
  5. package/fesm2022/nanahoshi-mona-ui-calendar.mjs +53 -53
  6. package/fesm2022/nanahoshi-mona-ui-check-box.mjs +80 -80
  7. package/fesm2022/nanahoshi-mona-ui-chip.mjs +98 -98
  8. package/fesm2022/nanahoshi-mona-ui-circular-progress-bar.mjs +2 -2
  9. package/fesm2022/nanahoshi-mona-ui-color-gradient.mjs +38 -38
  10. package/fesm2022/nanahoshi-mona-ui-color-palette.mjs +25 -25
  11. package/fesm2022/nanahoshi-mona-ui-color-picker.mjs +41 -37
  12. package/fesm2022/nanahoshi-mona-ui-combo-box.mjs +17 -19
  13. package/fesm2022/nanahoshi-mona-ui-date-input.mjs +6 -6
  14. package/fesm2022/nanahoshi-mona-ui-date-picker.mjs +11 -13
  15. package/fesm2022/nanahoshi-mona-ui-datetime-picker.mjs +18 -20
  16. package/fesm2022/nanahoshi-mona-ui-dialog.mjs +40 -40
  17. package/fesm2022/nanahoshi-mona-ui-dropdown-list.mjs +14 -16
  18. package/fesm2022/nanahoshi-mona-ui-dropdowns.mjs +52 -52
  19. package/fesm2022/nanahoshi-mona-ui-editor.mjs +462 -81
  20. package/fesm2022/nanahoshi-mona-ui-expansion-panel.mjs +26 -26
  21. package/fesm2022/nanahoshi-mona-ui-fieldset.mjs +8 -8
  22. package/fesm2022/nanahoshi-mona-ui-filter.mjs +14 -14
  23. package/fesm2022/{nanahoshi-mona-ui-grid-grid-footer-cell.component-B9SQH5N-.mjs → nanahoshi-mona-ui-grid-grid-footer-cell.component-B2ETh-uI.mjs} +14 -14
  24. package/fesm2022/{nanahoshi-mona-ui-grid-grid-footer-table-cell.directive-DlLwcCFT.mjs → nanahoshi-mona-ui-grid-grid-footer-table-cell.directive-DZk18LJC.mjs} +2 -2
  25. package/fesm2022/nanahoshi-mona-ui-grid-grid-list.component-C7WKhhig.mjs +128 -0
  26. package/fesm2022/{nanahoshi-mona-ui-grid-grid-toggle.component-DIUutx9s.mjs → nanahoshi-mona-ui-grid-grid-toggle.component-BRiY0CDX.mjs} +13 -13
  27. package/fesm2022/nanahoshi-mona-ui-grid-grid-virtual-list.component-BrYpFMyF.mjs +240 -0
  28. package/fesm2022/{nanahoshi-mona-ui-grid-nanahoshi-mona-ui-grid-C3eZIaJK.mjs → nanahoshi-mona-ui-grid-nanahoshi-mona-ui-grid-T9Bj98kl.mjs} +120 -120
  29. package/fesm2022/nanahoshi-mona-ui-grid.mjs +1 -1
  30. package/fesm2022/nanahoshi-mona-ui-internal-list.mjs +81 -81
  31. package/fesm2022/nanahoshi-mona-ui-internal-tree.mjs +35 -35
  32. package/fesm2022/nanahoshi-mona-ui-list-box.mjs +8 -8
  33. package/fesm2022/nanahoshi-mona-ui-list-view.mjs +7 -7
  34. package/fesm2022/nanahoshi-mona-ui-menubar.mjs +50 -50
  35. package/fesm2022/nanahoshi-mona-ui-multi-select.mjs +12 -14
  36. package/fesm2022/nanahoshi-mona-ui-notification.mjs +24 -24
  37. package/fesm2022/nanahoshi-mona-ui-numeric-text-box.mjs +69 -69
  38. package/fesm2022/nanahoshi-mona-ui-pager.mjs +29 -29
  39. package/fesm2022/nanahoshi-mona-ui-placeholder.mjs +9 -9
  40. package/fesm2022/nanahoshi-mona-ui-popover.mjs +12 -12
  41. package/fesm2022/nanahoshi-mona-ui-popup-menu.mjs +26 -26
  42. package/fesm2022/nanahoshi-mona-ui-popup.mjs +4 -4
  43. package/fesm2022/nanahoshi-mona-ui-progress-bar.mjs +2 -2
  44. package/fesm2022/nanahoshi-mona-ui-radio-button.mjs +55 -55
  45. package/fesm2022/nanahoshi-mona-ui-scroll-view.mjs +49 -49
  46. package/fesm2022/nanahoshi-mona-ui-slider.mjs +96 -96
  47. package/fesm2022/nanahoshi-mona-ui-split-button.mjs +30 -30
  48. package/fesm2022/nanahoshi-mona-ui-splitter.mjs +24 -24
  49. package/fesm2022/nanahoshi-mona-ui-stepper.mjs +29 -29
  50. package/fesm2022/nanahoshi-mona-ui-switch.mjs +42 -42
  51. package/fesm2022/nanahoshi-mona-ui-tabs.mjs +35 -39
  52. package/fesm2022/nanahoshi-mona-ui-text-area.mjs +22 -22
  53. package/fesm2022/nanahoshi-mona-ui-text-box.mjs +54 -54
  54. package/fesm2022/nanahoshi-mona-ui-time-picker.mjs +11 -19
  55. package/fesm2022/nanahoshi-mona-ui-time-selector.mjs +29 -29
  56. package/fesm2022/nanahoshi-mona-ui-tooltip.mjs +51 -51
  57. package/fesm2022/nanahoshi-mona-ui-tree-view.mjs +2 -2
  58. package/fesm2022/nanahoshi-mona-ui-window.mjs +27 -28
  59. package/package.json +30 -5
  60. package/types/nanahoshi-mona-ui-button.d.ts +4 -3
  61. package/types/nanahoshi-mona-ui-color-picker.d.ts +0 -3
  62. package/types/nanahoshi-mona-ui-dialog.d.ts +2 -2
  63. package/types/nanahoshi-mona-ui-editor.d.ts +17 -17
  64. package/types/nanahoshi-mona-ui-fieldset.d.ts +1 -1
  65. package/types/nanahoshi-mona-ui-filter.d.ts +2 -2
  66. package/types/nanahoshi-mona-ui-grid.d.ts +3 -3
  67. package/types/nanahoshi-mona-ui-internal-tree.d.ts +16 -16
  68. package/types/nanahoshi-mona-ui-menubar.d.ts +2 -2
  69. package/types/nanahoshi-mona-ui-stepper.d.ts +2 -2
  70. package/types/nanahoshi-mona-ui-tabs.d.ts +2 -2
  71. package/fesm2022/nanahoshi-mona-ui-grid-grid-list.component-Dgea-O0X.mjs +0 -130
  72. package/fesm2022/nanahoshi-mona-ui-grid-grid-virtual-list.component-DRHycGIh.mjs +0 -240
@@ -1,5 +1,5 @@
1
1
  import * as _angular_core from '@angular/core';
2
- import { OnDestroy, OnInit, ElementRef } from '@angular/core';
2
+ import { ElementRef } from '@angular/core';
3
3
  import { JSONContent, Editor } from '@tiptap/core';
4
4
  import { ImmutableSet } from '@mirei/ts-collections';
5
5
  import { EditorState } from '@tiptap/pm/state';
@@ -56,43 +56,43 @@ declare class EditorService {
56
56
  static ɵprov: _angular_core.ɵɵInjectableDeclaration<EditorService>;
57
57
  }
58
58
 
59
- declare class EditorComponent implements OnDestroy, OnInit {
59
+ declare class EditorComponent {
60
+ #private;
61
+ protected readonly baseClass: _angular_core.Signal<string>;
62
+ protected readonly containerClass: _angular_core.Signal<string>;
60
63
  protected readonly editorContainer: _angular_core.Signal<ElementRef<HTMLDivElement>>;
61
64
  protected readonly editorService: EditorService;
65
+ protected readonly toolbarClass: _angular_core.Signal<string>;
62
66
  /**
63
- * Emits when the editor loses focus.
67
+ * @description Emits when the editor loses focus.
64
68
  */
65
69
  readonly blur: _angular_core.OutputEmitterRef<void>;
66
70
  /**
67
- * Emits when the editor is created for the first time and is ready to be used.
71
+ * @description Emits when the editor is created for the first time and is ready to be used.
68
72
  */
69
73
  readonly create: _angular_core.OutputEmitterRef<void>;
70
74
  /**
71
- * Emits when the editor gains focus.
75
+ * @description Emits when the editor gains focus.
72
76
  */
73
77
  readonly focus: _angular_core.OutputEmitterRef<void>;
74
78
  /**
75
- * Emits when the selection of the editor changes.
79
+ * @description Emits when the selection of the editor changes.
76
80
  */
77
81
  readonly selectionUpdate: _angular_core.OutputEmitterRef<void>;
78
82
  /**
79
- * Emits when the content of the editor changes.
83
+ * @description Emits when the content of the editor changes.
80
84
  */
81
85
  readonly update: _angular_core.OutputEmitterRef<ContentChangeEvent>;
82
86
  /**
83
- * The initial content of the editor.
84
- * Accepted values are:
85
- * - A string representing the HTML content.
86
- * - A {@link JSONContent} representing the content.
87
+ * @description The initial content of the editor.
87
88
  */
88
- content: _angular_core.InputSignal<string | JSONContent | undefined>;
89
+ readonly content: _angular_core.InputSignal<string | JSONContent | undefined>;
89
90
  /**
90
- * The settings of the editor.
91
+ * @description The settings of the editor.
91
92
  */
92
- settings: _angular_core.InputSignal<Partial<EditorSettings>>;
93
+ readonly settings: _angular_core.InputSignal<Partial<EditorSettings>>;
94
+ readonly userClass: _angular_core.InputSignal<string>;
93
95
  constructor();
94
- ngOnDestroy(): void;
95
- ngOnInit(): void;
96
96
  private loadEditorContent;
97
97
  private setSubscriptions;
98
98
  /**
@@ -106,7 +106,7 @@ declare class EditorComponent implements OnDestroy, OnInit {
106
106
  */
107
107
  get json(): JSONContent;
108
108
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<EditorComponent, never>;
109
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<EditorComponent, "mona-editor", never, { "content": { "alias": "content"; "required": false; "isSignal": true; }; "settings": { "alias": "settings"; "required": false; "isSignal": true; }; }, { "blur": "blur"; "create": "create"; "focus": "focus"; "selectionUpdate": "selectionUpdate"; "update": "update"; }, never, never, true, never>;
109
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<EditorComponent, "mona-editor", never, { "content": { "alias": "content"; "required": false; "isSignal": true; }; "settings": { "alias": "settings"; "required": false; "isSignal": true; }; "userClass": { "alias": "class"; "required": false; "isSignal": true; }; }, { "blur": "blur"; "create": "create"; "focus": "focus"; "selectionUpdate": "selectionUpdate"; "update": "update"; }, never, never, true, never>;
110
110
  }
111
111
 
112
112
  export { EditorComponent };
@@ -1,8 +1,8 @@
1
1
  import * as _angular_core from '@angular/core';
2
2
  import { TemplateRef } from '@angular/core';
3
3
  import * as class_variance_authority_types from 'class-variance-authority/types';
4
- import { ThemeStyle } from '@nanahoshi/mona-ui/theme';
5
4
  import { VariantInputs } from '@nanahoshi/mona-ui/internal';
5
+ import { ThemeStyle } from '@nanahoshi/mona-ui/theme';
6
6
  import { VariantProps } from 'class-variance-authority';
7
7
 
8
8
  declare class FieldsetLegendTemplateDirective {
@@ -2,9 +2,9 @@ import { FilterOperators, FilterLogic, CompositeFilterDescriptor, BooleanFilterO
2
2
  import * as _angular_core from '@angular/core';
3
3
  import { DataType } from '@nanahoshi/mona-ui/common';
4
4
  import * as class_variance_authority_types from 'class-variance-authority/types';
5
- import { VariantProps } from 'class-variance-authority';
6
- import { ThemeStyle } from '@nanahoshi/mona-ui/theme';
7
5
  import { VariantInputs } from '@nanahoshi/mona-ui/internal';
6
+ import { ThemeStyle } from '@nanahoshi/mona-ui/theme';
7
+ import { VariantProps } from 'class-variance-authority';
8
8
 
9
9
  interface FilterMenuDataItem {
10
10
  text: string;
@@ -1,7 +1,7 @@
1
1
  import { DataType, PreventableEvent, VirtualScrollOptions } from '@nanahoshi/mona-ui/common';
2
- import { FieldTree, SchemaOrSchemaFn, ValidationError } from '@angular/forms/signals';
3
2
  import * as _angular_core from '@angular/core';
4
3
  import { TemplateRef, WritableSignal, OnInit, ElementRef } from '@angular/core';
4
+ import { FieldTree, SchemaOrSchemaFn, ValidationError } from '@angular/forms/signals';
5
5
  import { SortDirection, CompositeFilterDescriptor, SortDescriptor, FilterLogic, FilterOperators } from '@nanahoshi/mona-ui/query';
6
6
  import { Selector, ImmutableDictionary, ImmutableList, ImmutableSet } from '@mirei/ts-collections';
7
7
  import * as _nanahoshi_mona_ui_grid from '@nanahoshi/mona-ui/grid';
@@ -12,9 +12,9 @@ import * as rxjs from 'rxjs';
12
12
  import { Subject, BehaviorSubject } from 'rxjs';
13
13
  import { PopupMenuItem } from '@nanahoshi/mona-ui/popup-menu';
14
14
  import * as class_variance_authority_types from 'class-variance-authority/types';
15
- import { VariantProps } from 'class-variance-authority';
16
- import { ThemeStyle } from '@nanahoshi/mona-ui/theme';
17
15
  import { VariantInputs } from '@nanahoshi/mona-ui/internal';
16
+ import { ThemeStyle } from '@nanahoshi/mona-ui/theme';
17
+ import { VariantProps } from 'class-variance-authority';
18
18
 
19
19
  type AggregateFunction = "sum" | "avg" | "count" | "min" | "max" | "custom";
20
20
 
@@ -1,8 +1,8 @@
1
1
  import * as _angular_core from '@angular/core';
2
2
  import { TemplateRef } from '@angular/core';
3
3
  import { ImmutableSet, Selector, List, Predicate } from '@mirei/ts-collections';
4
- import { Observable, Subject, BehaviorSubject, ReplaySubject } from 'rxjs';
5
4
  import { PreventableEvent, FilterableOptions, FilterChangeEvent } from '@nanahoshi/mona-ui/common';
5
+ import { Observable, Subject, BehaviorSubject, ReplaySubject } from 'rxjs';
6
6
 
7
7
  interface CheckableOptions {
8
8
  /**
@@ -170,21 +170,6 @@ declare class NodeSelectEvent<T> extends PreventableEvent {
170
170
  get nodeItem(): NodeItem<T>;
171
171
  }
172
172
 
173
- interface TreeNodeCheckEvent<T> {
174
- checked: boolean;
175
- node: TreeNode<T>;
176
- }
177
-
178
- interface TreeNodeExpandEvent<T> {
179
- expanded: boolean;
180
- node: TreeNode<T>;
181
- }
182
-
183
- interface TreeNodeSelectEvent<T> {
184
- node: TreeNode<T>;
185
- selected: boolean;
186
- }
187
-
188
173
  type SelectableOptions = {
189
174
  /**
190
175
  * @description Determines if the selection functionality is active.
@@ -212,6 +197,21 @@ interface MultipleSelectionConfig {
212
197
  mode: "multiple";
213
198
  }
214
199
 
200
+ interface TreeNodeCheckEvent<T> {
201
+ checked: boolean;
202
+ node: TreeNode<T>;
203
+ }
204
+
205
+ interface TreeNodeExpandEvent<T> {
206
+ expanded: boolean;
207
+ node: TreeNode<T>;
208
+ }
209
+
210
+ interface TreeNodeSelectEvent<T> {
211
+ node: TreeNode<T>;
212
+ selected: boolean;
213
+ }
214
+
215
215
  type ChildrenSelector<T> = string | Selector<T, Iterable<T> | Observable<Iterable<T>>>;
216
216
  type NodeKeySelector<T, K = any> = string | Selector<T, K> | null;
217
217
 
@@ -4,9 +4,9 @@ import * as i0 from '@angular/core';
4
4
  import { TemplateRef } from '@angular/core';
5
5
  import { Subject } from 'rxjs';
6
6
  import * as class_variance_authority_types from 'class-variance-authority/types';
7
- import { VariantProps } from 'class-variance-authority';
8
- import { ThemeStyle } from '@nanahoshi/mona-ui/theme';
9
7
  import { VariantInputs } from '@nanahoshi/mona-ui/internal';
8
+ import { ThemeStyle } from '@nanahoshi/mona-ui/theme';
9
+ import { VariantProps } from 'class-variance-authority';
10
10
 
11
11
  type MenuItemClickEvent = PopupMenuItemClickEvent;
12
12
 
@@ -2,9 +2,9 @@ import * as _angular_core from '@angular/core';
2
2
  import { Signal, TemplateRef } from '@angular/core';
3
3
  import * as _mirei_ts_collections from '@mirei/ts-collections';
4
4
  import * as class_variance_authority_types from 'class-variance-authority/types';
5
- import { VariantProps } from 'class-variance-authority';
6
- import { ThemeStyle } from '@nanahoshi/mona-ui/theme';
7
5
  import { VariantInputs } from '@nanahoshi/mona-ui/internal';
6
+ import { ThemeStyle } from '@nanahoshi/mona-ui/theme';
7
+ import { VariantProps } from 'class-variance-authority';
8
8
 
9
9
  interface StepOptions<T = unknown> {
10
10
  /** @description Optional arbitrary data attached to this step. */
@@ -3,9 +3,9 @@ import * as _angular_core from '@angular/core';
3
3
  import { TemplateRef } from '@angular/core';
4
4
  import { ImmutableSet } from '@mirei/ts-collections';
5
5
  import * as class_variance_authority_types from 'class-variance-authority/types';
6
- import { VariantProps } from 'class-variance-authority';
7
- import { ThemeStyle } from '@nanahoshi/mona-ui/theme';
8
6
  import { VariantInputs } from '@nanahoshi/mona-ui/internal';
7
+ import { ThemeStyle } from '@nanahoshi/mona-ui/theme';
8
+ import { VariantProps } from 'class-variance-authority';
9
9
 
10
10
  declare class TabCloseEvent extends PreventableEvent {
11
11
  #private;
@@ -1,130 +0,0 @@
1
- import { NgTemplateOutlet } from '@angular/common';
2
- import * as i0 from '@angular/core';
3
- import { inject, DestroyRef, ElementRef, viewChild, computed, input, afterNextRender, ChangeDetectionStrategy, Component } from '@angular/core';
4
- import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
5
- import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
6
- import { SlicePipe } from '@nanahoshi/mona-ui/common';
7
- import { ContextMenuComponent } from '@nanahoshi/mona-ui/contextmenu';
8
- import { ThemeService } from '@nanahoshi/mona-ui/theme';
9
- import { ImmutableList, ImmutableSet, span } from '@mirei/ts-collections';
10
- import { fromEvent } from 'rxjs';
11
- import { G as GridAddRowComponent, a as GridCellComponent, b as GridRowDirective, c as GridCellDirective, d as GridDetailRowDirective, e as GridDetailIndentCellDirective, f as GridDetailContentCellDirective, g as GridToggleComponent } from './nanahoshi-mona-ui-grid-grid-toggle.component-DIUutx9s.mjs';
12
- import { GridFooterTableCellDirective } from './nanahoshi-mona-ui-grid-grid-footer-table-cell.directive-DlLwcCFT.mjs';
13
- import { G as GridNavigationService, a as GridRowFlattenerService, g as gridListBaseThemeVariants, b as gridFooterTableRowThemeVariants, c as GridService, d as gridGroupRowThemeVariants, e as gridListTableThemeVariants, f as GridLogicalCellDirective, h as GridLockedCellDirective } from './nanahoshi-mona-ui-grid-nanahoshi-mona-ui-grid-C3eZIaJK.mjs';
14
- import { GridFooterCellComponent } from './nanahoshi-mona-ui-grid-grid-footer-cell.component-B9SQH5N-.mjs';
15
-
16
- class GridListComponent {
17
- #destroyRef;
18
- #gridNavigationService;
19
- #hostElementRef;
20
- #rowFlattener;
21
- #themeService;
22
- constructor() {
23
- this.#destroyRef = inject(DestroyRef);
24
- this.#gridNavigationService = inject(GridNavigationService);
25
- this.#hostElementRef = inject((ElementRef));
26
- this.#rowFlattener = inject(GridRowFlattenerService);
27
- this.#themeService = inject(ThemeService);
28
- this.bodyTableElementRef = viewChild.required("bodyTable", /* @ts-ignore */
29
- ...(ngDevMode ? [{ debugName: "bodyTableElementRef" }] : /* istanbul ignore next */ []));
30
- this.baseClass = computed(() => {
31
- const theme = this.#themeService.theme();
32
- return gridListBaseThemeVariants(theme)({ virtual: false });
33
- }, /* @ts-ignore */
34
- ...(ngDevMode ? [{ debugName: "baseClass" }] : /* istanbul ignore next */ []));
35
- this.flattenedGroupedRows = computed(() => {
36
- const groupColumns = this.gridService.groupColumns();
37
- if (groupColumns.length === 0) {
38
- return [];
39
- }
40
- const collapsedKeys = new Set(this.gridService.collapsedGroupKeys());
41
- const groupAggregateDict = this.gridService.groupAggregateMap().toDictionary(e => e.key, e => e.value);
42
- const showFooter = this.gridService.groupableOptions().showFooter;
43
- return this.#rowFlattener.flatten(this.data(), groupColumns, collapsedKeys, showFooter, groupAggregateDict);
44
- }, /* @ts-ignore */
45
- ...(ngDevMode ? [{ debugName: "flattenedGroupedRows" }] : /* istanbul ignore next */ []));
46
- this.footerTableRowClass = computed(() => {
47
- const theme = this.#themeService.theme();
48
- return gridFooterTableRowThemeVariants(theme)();
49
- }, /* @ts-ignore */
50
- ...(ngDevMode ? [{ debugName: "footerTableRowClass" }] : /* istanbul ignore next */ []));
51
- this.gridService = inject(GridService);
52
- this.groupRowClass = computed(() => {
53
- const theme = this.#themeService.theme();
54
- return gridGroupRowThemeVariants(theme)();
55
- }, /* @ts-ignore */
56
- ...(ngDevMode ? [{ debugName: "groupRowClass" }] : /* istanbul ignore next */ []));
57
- this.tableClass = computed(() => {
58
- const theme = this.#themeService.theme();
59
- return gridListTableThemeVariants(theme)();
60
- }, /* @ts-ignore */
61
- ...(ngDevMode ? [{ debugName: "tableClass" }] : /* istanbul ignore next */ []));
62
- this.columns = input(ImmutableList.create(), /* @ts-ignore */
63
- ...(ngDevMode ? [{ debugName: "columns" }] : /* istanbul ignore next */ []));
64
- this.data = input(ImmutableSet.create(), /* @ts-ignore */
65
- ...(ngDevMode ? [{ debugName: "data" }] : /* istanbul ignore next */ []));
66
- this.span = span;
67
- afterNextRender({
68
- read: () => {
69
- const bodyTableElement = this.bodyTableElementRef().nativeElement;
70
- const bodyScrollElement = this.#hostElementRef.nativeElement;
71
- this.gridService.bodyTableElement.set(bodyTableElement);
72
- this.gridService.bodyScrollElement.set(bodyScrollElement);
73
- this.setSubscriptions();
74
- this.#destroyRef.onDestroy(() => {
75
- if (this.gridService.bodyTableElement() === bodyTableElement) {
76
- this.gridService.bodyTableElement.set(null);
77
- }
78
- if (this.gridService.bodyScrollElement() === bodyScrollElement) {
79
- this.gridService.bodyScrollElement.set(null);
80
- }
81
- });
82
- }
83
- });
84
- }
85
- onGridRowClick(event, row) {
86
- this.gridService.handleRowClick(event, row);
87
- }
88
- onGroupExpandChange(groupKey) {
89
- this.gridService.toggleGroupCollapse(groupKey);
90
- }
91
- onToggleDetailClick(row) {
92
- const expanded = this.gridService.isRowExpanded(row);
93
- this.gridService.setRowExpanded(row, !expanded);
94
- }
95
- setSubscriptions() {
96
- fromEvent(this.#hostElementRef.nativeElement, "focus")
97
- .pipe(takeUntilDestroyed(this.#destroyRef))
98
- .subscribe(() => {
99
- this.#gridNavigationService.focusActiveCellOrFirstHeader();
100
- });
101
- }
102
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: GridListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
103
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: GridListComponent, isStandalone: true, selector: "mona-grid-list", inputs: { columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "baseClass()" } }, viewQueries: [{ propertyName: "bodyTableElementRef", first: true, predicate: ["bodyTable"], descendants: true, isSignal: true }], ngImport: i0, template: "<table #bodyTable [class]=\"tableClass()\" [style.width.px]=\"gridService.tableWidth()\">\r\n <colgroup>\r\n @for (_ of gridService.groupColumns(); track $index) {\r\n <col [style.width.px]=\"gridService.groupColumnWidth\" />\r\n }\r\n @if (gridService.masterDetailTemplate()) {\r\n <col [style.width.px]=\"gridService.groupColumnWidth\" />\r\n }\r\n @for (col of columns(); track $index) {\r\n <col [style.width.px]=\"col.calculatedWidth\" />\r\n }\r\n </colgroup>\r\n <tbody role=\"rowgroup\">\r\n @if (gridService.addRowVisible()) {\r\n <tr monaGridAddRow [columns]=\"columns()\"></tr>\r\n }\r\n @if (gridService.groupColumns().length === 0) {\r\n @for (row of data(); track row.uid) {\r\n @let rowIndex = $index;\r\n <tr\r\n (click)=\"onGridRowClick($event, row)\"\r\n monaGridRow\r\n [index]=\"rowIndex\"\r\n [row]=\"row\"\r\n #gridRow=\"monaGridRow\"\r\n #rowElement>\r\n @if (gridService.masterDetailTemplate()) {\r\n <td\r\n monaGridCell\r\n monaGridLockedCell\r\n [lockedStructuralOffset]=\"0\"\r\n [masterDetailToggle]=\"true\"\r\n monaGridLogicalCell\r\n [cellKind]=\"'detail'\"\r\n [colIndex]=\"0\"\r\n [firstInRow]=\"true\"\r\n [lastInRow]=\"columns().length === 0\"\r\n [rowIndex]=\"rowIndex\"\r\n [rowUid]=\"row.uid\"\r\n [section]=\"'body'\"\r\n [style.width.px]=\"gridService.detailColumnWidth\"\r\n [attr.colspan]=\"1\">\r\n <span class=\"flex h-full w-full items-stretch justify-center\">\r\n <mona-grid-toggle\r\n [expanded]=\"gridRow.expanded()\"\r\n [type]=\"'detail'\"\r\n [width]=\"gridService.detailColumnWidth\"\r\n (expandedChange)=\"onToggleDetailClick(row)\"></mona-grid-toggle>\r\n </span>\r\n </td>\r\n }\r\n @for (column of columns(); track $index) {\r\n @let colIndex = gridService.masterDetailTemplate() ? $index + 1 : $index;\r\n <td\r\n monaGridCell\r\n monaGridLockedCell\r\n [column]=\"column\"\r\n [dataCell]=\"true\"\r\n monaGridLogicalCell\r\n [cellKind]=\"column.kind\"\r\n [colIndex]=\"colIndex\"\r\n [columnId]=\"column.id\"\r\n [rowIndex]=\"rowIndex\"\r\n [rowUid]=\"row.uid\"\r\n [section]=\"'body'\"\r\n [firstInRow]=\"colIndex === 0\"\r\n [lastInRow]=\"colIndex === columns().length - (gridService.masterDetailTemplate() ? 0 : 1)\"\r\n [attr.colspan]=\"1\"\r\n [style.width.px]=\"column.calculatedWidth\"\r\n [style.min-width.px]=\"column.minWidth\"\r\n (edit)=\"gridCell.handleLogicalCellEnter()\">\r\n <mona-grid-cell #gridCell [column]=\"column\" [row]=\"row\"></mona-grid-cell>\r\n </td>\r\n }\r\n @if (gridService.contextMenuItems().length !== 0) {\r\n <ng-container\r\n [ngTemplateOutlet]=\"contextMenuTemplate\"\r\n [ngTemplateOutletContext]=\"{ $implicit: row.data, element: rowElement, index: $index }\">\r\n </ng-container>\r\n }\r\n </tr>\r\n @if (gridRow.expanded()) {\r\n <tr monaGridDetailRow [style.width.px]=\"gridService.masterDetailRowWidth()\">\r\n <td\r\n monaGridCell\r\n monaGridLockedCell\r\n [lockedStructuralOffset]=\"0\"\r\n [indentCell]=\"true\"\r\n [attr.colspan]=\"1\"\r\n [style.width.px]=\"gridService.masterDetailEmptyCellWidth()\"></td>\r\n <td monaGridCell [masterDetailContent]=\"true\" [attr.colspan]=\"columns().length\">\r\n <ng-container\r\n [ngTemplateOutlet]=\"gridService.masterDetailTemplate()\"\r\n [ngTemplateOutletContext]=\"{ $implicit: row.data }\"></ng-container>\r\n </td>\r\n </tr>\r\n }\r\n }\r\n } @else {\r\n @for (viewRow of flattenedGroupedRows(); track $index) {\r\n @let rowIndex = $index;\r\n @if (viewRow.type === \"group\") {\r\n @let isCollapsed = gridService.isGroupCollapsed(viewRow.groupKey);\r\n @let prevRow = flattenedGroupedRows()[rowIndex - 1];\r\n\r\n <tr\r\n [class]=\"groupRowClass()\"\r\n role=\"row\"\r\n [attr.aria-level]=\"viewRow.depth + 1\"\r\n [attr.aria-expanded]=\"!isCollapsed\">\r\n @for (_ of gridService.groupColumns() | monaSlice: 0 : viewRow.depth; track $index) {\r\n <td\r\n monaGridCell\r\n monaGridLockedCell\r\n [lockedCellHeader]=\"true\"\r\n [lockedStructuralOffset]=\"$index * gridService.groupColumnWidth\"\r\n [grouped]=\"true\"\r\n [indentCell]=\"true\"\r\n [attr.colspan]=\"1\"\r\n [style.width.px]=\"gridService.groupColumnWidth\"></td>\r\n }\r\n @let colspan =\r\n columns().length +\r\n gridService.groupColumns().length +\r\n (gridService.masterDetailTemplate() ? 1 : 0) -\r\n viewRow.depth +\r\n 1;\r\n\r\n <td\r\n monaGridCell\r\n monaGridLogicalCell\r\n [cellKind]=\"'group'\"\r\n [rowIndex]=\"rowIndex\"\r\n [colIndex]=\"0\"\r\n [section]=\"'body'\"\r\n [grouped]=\"true\"\r\n [groupHeader]=\"true\"\r\n [prevRowType]=\"prevRow?.type\"\r\n [firstInRow]=\"true\"\r\n [lastInRow]=\"columns().length === 0\"\r\n [groupKey]=\"viewRow.groupKey\"\r\n (toggle)=\"onGroupExpandChange(viewRow.groupKey)\"\r\n [attr.colspan]=\"colspan\">\r\n <p class=\"flex h-full items-center text-sm whitespace-nowrap\">\r\n <mona-grid-toggle\r\n [expanded]=\"!isCollapsed\"\r\n [width]=\"gridService.groupColumnWidth\"\r\n [type]=\"'group'\"\r\n (expandedChange)=\"onGroupExpandChange(viewRow.groupKey)\"></mona-grid-toggle>\r\n <span class=\"font-bold\">{{ viewRow.title }}: {{ viewRow.groupValue }}</span>\r\n </p>\r\n </td>\r\n </tr>\r\n } @else if (viewRow.type === \"groupFooter\") {\r\n <tr role=\"row\" [class]=\"footerTableRowClass()\">\r\n @for (_ of gridService.groupColumns(); track $index) {\r\n <td\r\n monaGridFooterTableCell\r\n monaGridLockedCell\r\n [lockedCellHeader]=\"true\"\r\n [lockedStructuralOffset]=\"$index * gridService.groupColumnWidth\"\r\n [footerCellWidth]=\"gridService.groupColumnWidth\"></td>\r\n }\r\n @if (gridService.masterDetailTemplate()) {\r\n <td\r\n monaGridFooterTableCell\r\n monaGridLockedCell\r\n [lockedCellHeader]=\"true\"\r\n [lockedStructuralOffset]=\"\r\n gridService.groupColumns().length * gridService.groupColumnWidth\r\n \"\r\n [footerCellWidth]=\"gridService.detailColumnWidth\"></td>\r\n }\r\n @for (column of columns(); track $index) {\r\n <td\r\n monaGridFooterTableCell\r\n monaGridLockedCell\r\n [column]=\"column\"\r\n [lockedCellHeader]=\"true\"\r\n [footerColumn]=\"column\">\r\n <mona-grid-footer-cell\r\n [column]=\"column\"\r\n [columnIndex]=\"$index\"\r\n [groupKey]=\"viewRow.groupAggregate.groupKey\"></mona-grid-footer-cell>\r\n </td>\r\n }\r\n </tr>\r\n } @else {\r\n @let nextRow = flattenedGroupedRows()[rowIndex + 1];\r\n @let prevRow = flattenedGroupedRows()[rowIndex - 1];\r\n <tr\r\n (click)=\"onGridRowClick($event, viewRow.row)\"\r\n monaGridRow\r\n [index]=\"rowIndex\"\r\n [row]=\"viewRow.row\"\r\n #gridRow=\"monaGridRow\"\r\n #rowElement>\r\n @for (_ of gridService.groupColumns(); track $index) {\r\n <td\r\n monaGridCell\r\n monaGridLockedCell\r\n [lockedCellHeader]=\"true\"\r\n [lockedStructuralOffset]=\"$index * gridService.groupColumnWidth\"\r\n [grouped]=\"true\"\r\n [indentCell]=\"true\"\r\n [style.width.px]=\"gridService.groupColumnWidth\"></td>\r\n }\r\n\r\n @if (gridService.masterDetailTemplate()) {\r\n <td\r\n monaGridCell\r\n monaGridLogicalCell\r\n monaGridLockedCell\r\n [lockedStructuralOffset]=\"\r\n gridService.groupColumns().length * gridService.groupColumnWidth\r\n \"\r\n [grouped]=\"true\"\r\n [masterDetailToggle]=\"true\"\r\n [prevRowType]=\"prevRow?.type\"\r\n [nextRowType]=\"nextRow?.type\"\r\n [rowIndex]=\"rowIndex\"\r\n [rowUid]=\"viewRow.row.uid\"\r\n [section]=\"'body'\"\r\n [cellKind]=\"'detail'\"\r\n [colIndex]=\"0\"\r\n [firstInRow]=\"true\"\r\n [lastInRow]=\"columns().length === 0\"\r\n [style.width.px]=\"gridService.detailColumnWidth\">\r\n <span class=\"flex h-full w-full items-stretch justify-center\">\r\n <mona-grid-toggle\r\n [expanded]=\"gridRow.expanded()\"\r\n [type]=\"'detail'\"\r\n [width]=\"gridService.detailColumnWidth\"\r\n (expandedChange)=\"onToggleDetailClick(viewRow.row)\"></mona-grid-toggle>\r\n </span>\r\n </td>\r\n }\r\n @for (column of columns(); track $index) {\r\n @let colIndex = gridService.masterDetailTemplate() ? $index + 1 : $index;\r\n <td\r\n monaGridCell\r\n monaGridLockedCell\r\n [column]=\"column\"\r\n [grouped]=\"true\"\r\n [dataCell]=\"true\"\r\n [prevRowType]=\"prevRow?.type\"\r\n [nextRowType]=\"nextRow?.type\"\r\n monaGridLogicalCell\r\n [cellKind]=\"column.kind\"\r\n [colIndex]=\"colIndex\"\r\n [columnId]=\"column.id\"\r\n [firstInRow]=\"colIndex === 0\"\r\n [lastInRow]=\"\r\n colIndex === columns().length - (gridService.masterDetailTemplate() ? 0 : 1)\r\n \"\r\n [rowIndex]=\"rowIndex\"\r\n [rowUid]=\"viewRow.row.uid\"\r\n [section]=\"'body'\"\r\n [style.width.px]=\"column.calculatedWidth\"\r\n [style.min-width.px]=\"column.minWidth\"\r\n (edit)=\"gridCell.handleLogicalCellEnter()\">\r\n <mona-grid-cell #gridCell [column]=\"column\" [row]=\"viewRow.row\"></mona-grid-cell>\r\n </td>\r\n }\r\n @if (gridService.contextMenuItems().length !== 0) {\r\n <ng-container\r\n [ngTemplateOutlet]=\"contextMenuTemplate\"\r\n [ngTemplateOutletContext]=\"{\r\n $implicit: viewRow.row.data,\r\n element: rowElement,\r\n index: rowIndex\r\n }\">\r\n </ng-container>\r\n }\r\n </tr>\r\n @if (gridRow.expanded()) {\r\n <tr monaGridDetailRow [style.width.px]=\"gridService.masterDetailRowWidth()\">\r\n @for (_ of gridService.groupColumns() | monaSlice: 0 : viewRow.depth + 1; track $index) {\r\n <td\r\n monaGridCell\r\n monaGridLockedCell\r\n [lockedCellHeader]=\"true\"\r\n [lockedStructuralOffset]=\"$index * gridService.groupColumnWidth\"\r\n [grouped]=\"true\"\r\n [indentCell]=\"true\"\r\n [attr.colspan]=\"1\"\r\n [style.width.px]=\"gridService.groupColumnWidth\"></td>\r\n }\r\n @let colspan = columns().length + gridService.groupColumns().length - 1;\r\n <td\r\n monaGridDetailIndentCell\r\n monaGridLockedCell\r\n [lockedStructuralOffset]=\"(viewRow.depth + 1) * gridService.groupColumnWidth\"\r\n [nextRowType]=\"nextRow?.type\"\r\n [attr.colspan]=\"1\"\r\n [style.width.px]=\"gridService.masterDetailEmptyCellWidth()\"></td>\r\n <td monaGridDetailContentCell [nextRowType]=\"nextRow?.type\" [attr.colspan]=\"colspan\">\r\n <ng-container\r\n [ngTemplateOutlet]=\"gridService.masterDetailTemplate()\"\r\n [ngTemplateOutletContext]=\"{ $implicit: viewRow.row.data }\"></ng-container>\r\n </td>\r\n </tr>\r\n }\r\n }\r\n }\r\n }\r\n </tbody>\r\n</table>\r\n\r\n<ng-template let-rowData let-element=\"element\" let-rowIndex=\"index\" #contextMenuTemplate>\r\n <mona-contextmenu [target]=\"element\" [items]=\"gridService.contextMenuItems()\"></mona-contextmenu>\r\n <!-- [context]=\"{rowData, element, rowIndex}\"-->\r\n</ng-template>\r\n", dependencies: [{ kind: "component", type: GridAddRowComponent, selector: "tr[monaGridAddRow]", inputs: ["columns"] }, { kind: "component", type: GridCellComponent, selector: "mona-grid-cell", inputs: ["column", "row"] }, { kind: "ngmodule", type: FontAwesomeModule }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ContextMenuComponent, selector: "mona-contextmenu", inputs: ["ariaLabel", "items", "minWidth", "rounded", "size", "target", "width"], outputs: ["menuClick"] }, { kind: "directive", type: GridRowDirective, selector: "tr[monaGridRow]", inputs: ["index", "row"], exportAs: ["monaGridRow"] }, { kind: "directive", type: GridCellDirective, selector: "td[monaGridCell]", inputs: ["dataCell", "groupHeader", "groupToggle", "grouped", "indentCell", "lastInRow", "masterDetailContent", "masterDetailToggle", "nextRowType", "prevRowType"] }, { kind: "directive", type: GridDetailRowDirective, selector: "tr[monaGridDetailRow]" }, { kind: "directive", type: GridDetailIndentCellDirective, selector: "td[monaGridDetailIndentCell]", inputs: ["nextRowType"] }, { kind: "directive", type: GridDetailContentCellDirective, selector: "td[monaGridDetailContentCell]", inputs: ["nextRowType"] }, { kind: "component", type: GridToggleComponent, selector: "mona-grid-toggle", inputs: ["expanded", "type", "width"], outputs: ["expandedChange"] }, { kind: "directive", type: GridFooterTableCellDirective, selector: "td[monaGridFooterTableCell]", inputs: ["footerCellMinWidth", "footerCellWidth", "footerColumn"] }, { kind: "directive", type: GridLogicalCellDirective, selector: "td[monaGridLogicalCell], th[monaGridLogicalCell]", inputs: ["cellKind", "colIndex", "columnId", "firstInRow", "groupHeader", "groupKey", "lastInRow", "rowIndex", "rowUid", "section"], outputs: ["edit", "toggle"] }, { kind: "directive", type: GridLockedCellDirective, selector: "td[monaGridLockedCell], th[monaGridLockedCell]", inputs: ["column", "lockedCellHeader", "lockedStructuralOffset"] }, { kind: "component", type: GridFooterCellComponent, selector: "mona-grid-footer-cell", inputs: ["column", "columnIndex", "groupKey"] }, { kind: "pipe", type: SlicePipe, name: "monaSlice" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
104
- }
105
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: GridListComponent, decorators: [{
106
- type: Component,
107
- args: [{ selector: "mona-grid-list", changeDetection: ChangeDetectionStrategy.OnPush, imports: [
108
- GridAddRowComponent,
109
- GridCellComponent,
110
- FontAwesomeModule,
111
- NgTemplateOutlet,
112
- ContextMenuComponent,
113
- GridRowDirective,
114
- GridCellDirective,
115
- GridDetailRowDirective,
116
- GridDetailIndentCellDirective,
117
- GridDetailContentCellDirective,
118
- SlicePipe,
119
- GridToggleComponent,
120
- GridFooterTableCellDirective,
121
- GridLogicalCellDirective,
122
- GridLockedCellDirective,
123
- GridFooterCellComponent
124
- ], host: {
125
- "[class]": "baseClass()"
126
- }, template: "<table #bodyTable [class]=\"tableClass()\" [style.width.px]=\"gridService.tableWidth()\">\r\n <colgroup>\r\n @for (_ of gridService.groupColumns(); track $index) {\r\n <col [style.width.px]=\"gridService.groupColumnWidth\" />\r\n }\r\n @if (gridService.masterDetailTemplate()) {\r\n <col [style.width.px]=\"gridService.groupColumnWidth\" />\r\n }\r\n @for (col of columns(); track $index) {\r\n <col [style.width.px]=\"col.calculatedWidth\" />\r\n }\r\n </colgroup>\r\n <tbody role=\"rowgroup\">\r\n @if (gridService.addRowVisible()) {\r\n <tr monaGridAddRow [columns]=\"columns()\"></tr>\r\n }\r\n @if (gridService.groupColumns().length === 0) {\r\n @for (row of data(); track row.uid) {\r\n @let rowIndex = $index;\r\n <tr\r\n (click)=\"onGridRowClick($event, row)\"\r\n monaGridRow\r\n [index]=\"rowIndex\"\r\n [row]=\"row\"\r\n #gridRow=\"monaGridRow\"\r\n #rowElement>\r\n @if (gridService.masterDetailTemplate()) {\r\n <td\r\n monaGridCell\r\n monaGridLockedCell\r\n [lockedStructuralOffset]=\"0\"\r\n [masterDetailToggle]=\"true\"\r\n monaGridLogicalCell\r\n [cellKind]=\"'detail'\"\r\n [colIndex]=\"0\"\r\n [firstInRow]=\"true\"\r\n [lastInRow]=\"columns().length === 0\"\r\n [rowIndex]=\"rowIndex\"\r\n [rowUid]=\"row.uid\"\r\n [section]=\"'body'\"\r\n [style.width.px]=\"gridService.detailColumnWidth\"\r\n [attr.colspan]=\"1\">\r\n <span class=\"flex h-full w-full items-stretch justify-center\">\r\n <mona-grid-toggle\r\n [expanded]=\"gridRow.expanded()\"\r\n [type]=\"'detail'\"\r\n [width]=\"gridService.detailColumnWidth\"\r\n (expandedChange)=\"onToggleDetailClick(row)\"></mona-grid-toggle>\r\n </span>\r\n </td>\r\n }\r\n @for (column of columns(); track $index) {\r\n @let colIndex = gridService.masterDetailTemplate() ? $index + 1 : $index;\r\n <td\r\n monaGridCell\r\n monaGridLockedCell\r\n [column]=\"column\"\r\n [dataCell]=\"true\"\r\n monaGridLogicalCell\r\n [cellKind]=\"column.kind\"\r\n [colIndex]=\"colIndex\"\r\n [columnId]=\"column.id\"\r\n [rowIndex]=\"rowIndex\"\r\n [rowUid]=\"row.uid\"\r\n [section]=\"'body'\"\r\n [firstInRow]=\"colIndex === 0\"\r\n [lastInRow]=\"colIndex === columns().length - (gridService.masterDetailTemplate() ? 0 : 1)\"\r\n [attr.colspan]=\"1\"\r\n [style.width.px]=\"column.calculatedWidth\"\r\n [style.min-width.px]=\"column.minWidth\"\r\n (edit)=\"gridCell.handleLogicalCellEnter()\">\r\n <mona-grid-cell #gridCell [column]=\"column\" [row]=\"row\"></mona-grid-cell>\r\n </td>\r\n }\r\n @if (gridService.contextMenuItems().length !== 0) {\r\n <ng-container\r\n [ngTemplateOutlet]=\"contextMenuTemplate\"\r\n [ngTemplateOutletContext]=\"{ $implicit: row.data, element: rowElement, index: $index }\">\r\n </ng-container>\r\n }\r\n </tr>\r\n @if (gridRow.expanded()) {\r\n <tr monaGridDetailRow [style.width.px]=\"gridService.masterDetailRowWidth()\">\r\n <td\r\n monaGridCell\r\n monaGridLockedCell\r\n [lockedStructuralOffset]=\"0\"\r\n [indentCell]=\"true\"\r\n [attr.colspan]=\"1\"\r\n [style.width.px]=\"gridService.masterDetailEmptyCellWidth()\"></td>\r\n <td monaGridCell [masterDetailContent]=\"true\" [attr.colspan]=\"columns().length\">\r\n <ng-container\r\n [ngTemplateOutlet]=\"gridService.masterDetailTemplate()\"\r\n [ngTemplateOutletContext]=\"{ $implicit: row.data }\"></ng-container>\r\n </td>\r\n </tr>\r\n }\r\n }\r\n } @else {\r\n @for (viewRow of flattenedGroupedRows(); track $index) {\r\n @let rowIndex = $index;\r\n @if (viewRow.type === \"group\") {\r\n @let isCollapsed = gridService.isGroupCollapsed(viewRow.groupKey);\r\n @let prevRow = flattenedGroupedRows()[rowIndex - 1];\r\n\r\n <tr\r\n [class]=\"groupRowClass()\"\r\n role=\"row\"\r\n [attr.aria-level]=\"viewRow.depth + 1\"\r\n [attr.aria-expanded]=\"!isCollapsed\">\r\n @for (_ of gridService.groupColumns() | monaSlice: 0 : viewRow.depth; track $index) {\r\n <td\r\n monaGridCell\r\n monaGridLockedCell\r\n [lockedCellHeader]=\"true\"\r\n [lockedStructuralOffset]=\"$index * gridService.groupColumnWidth\"\r\n [grouped]=\"true\"\r\n [indentCell]=\"true\"\r\n [attr.colspan]=\"1\"\r\n [style.width.px]=\"gridService.groupColumnWidth\"></td>\r\n }\r\n @let colspan =\r\n columns().length +\r\n gridService.groupColumns().length +\r\n (gridService.masterDetailTemplate() ? 1 : 0) -\r\n viewRow.depth +\r\n 1;\r\n\r\n <td\r\n monaGridCell\r\n monaGridLogicalCell\r\n [cellKind]=\"'group'\"\r\n [rowIndex]=\"rowIndex\"\r\n [colIndex]=\"0\"\r\n [section]=\"'body'\"\r\n [grouped]=\"true\"\r\n [groupHeader]=\"true\"\r\n [prevRowType]=\"prevRow?.type\"\r\n [firstInRow]=\"true\"\r\n [lastInRow]=\"columns().length === 0\"\r\n [groupKey]=\"viewRow.groupKey\"\r\n (toggle)=\"onGroupExpandChange(viewRow.groupKey)\"\r\n [attr.colspan]=\"colspan\">\r\n <p class=\"flex h-full items-center text-sm whitespace-nowrap\">\r\n <mona-grid-toggle\r\n [expanded]=\"!isCollapsed\"\r\n [width]=\"gridService.groupColumnWidth\"\r\n [type]=\"'group'\"\r\n (expandedChange)=\"onGroupExpandChange(viewRow.groupKey)\"></mona-grid-toggle>\r\n <span class=\"font-bold\">{{ viewRow.title }}: {{ viewRow.groupValue }}</span>\r\n </p>\r\n </td>\r\n </tr>\r\n } @else if (viewRow.type === \"groupFooter\") {\r\n <tr role=\"row\" [class]=\"footerTableRowClass()\">\r\n @for (_ of gridService.groupColumns(); track $index) {\r\n <td\r\n monaGridFooterTableCell\r\n monaGridLockedCell\r\n [lockedCellHeader]=\"true\"\r\n [lockedStructuralOffset]=\"$index * gridService.groupColumnWidth\"\r\n [footerCellWidth]=\"gridService.groupColumnWidth\"></td>\r\n }\r\n @if (gridService.masterDetailTemplate()) {\r\n <td\r\n monaGridFooterTableCell\r\n monaGridLockedCell\r\n [lockedCellHeader]=\"true\"\r\n [lockedStructuralOffset]=\"\r\n gridService.groupColumns().length * gridService.groupColumnWidth\r\n \"\r\n [footerCellWidth]=\"gridService.detailColumnWidth\"></td>\r\n }\r\n @for (column of columns(); track $index) {\r\n <td\r\n monaGridFooterTableCell\r\n monaGridLockedCell\r\n [column]=\"column\"\r\n [lockedCellHeader]=\"true\"\r\n [footerColumn]=\"column\">\r\n <mona-grid-footer-cell\r\n [column]=\"column\"\r\n [columnIndex]=\"$index\"\r\n [groupKey]=\"viewRow.groupAggregate.groupKey\"></mona-grid-footer-cell>\r\n </td>\r\n }\r\n </tr>\r\n } @else {\r\n @let nextRow = flattenedGroupedRows()[rowIndex + 1];\r\n @let prevRow = flattenedGroupedRows()[rowIndex - 1];\r\n <tr\r\n (click)=\"onGridRowClick($event, viewRow.row)\"\r\n monaGridRow\r\n [index]=\"rowIndex\"\r\n [row]=\"viewRow.row\"\r\n #gridRow=\"monaGridRow\"\r\n #rowElement>\r\n @for (_ of gridService.groupColumns(); track $index) {\r\n <td\r\n monaGridCell\r\n monaGridLockedCell\r\n [lockedCellHeader]=\"true\"\r\n [lockedStructuralOffset]=\"$index * gridService.groupColumnWidth\"\r\n [grouped]=\"true\"\r\n [indentCell]=\"true\"\r\n [style.width.px]=\"gridService.groupColumnWidth\"></td>\r\n }\r\n\r\n @if (gridService.masterDetailTemplate()) {\r\n <td\r\n monaGridCell\r\n monaGridLogicalCell\r\n monaGridLockedCell\r\n [lockedStructuralOffset]=\"\r\n gridService.groupColumns().length * gridService.groupColumnWidth\r\n \"\r\n [grouped]=\"true\"\r\n [masterDetailToggle]=\"true\"\r\n [prevRowType]=\"prevRow?.type\"\r\n [nextRowType]=\"nextRow?.type\"\r\n [rowIndex]=\"rowIndex\"\r\n [rowUid]=\"viewRow.row.uid\"\r\n [section]=\"'body'\"\r\n [cellKind]=\"'detail'\"\r\n [colIndex]=\"0\"\r\n [firstInRow]=\"true\"\r\n [lastInRow]=\"columns().length === 0\"\r\n [style.width.px]=\"gridService.detailColumnWidth\">\r\n <span class=\"flex h-full w-full items-stretch justify-center\">\r\n <mona-grid-toggle\r\n [expanded]=\"gridRow.expanded()\"\r\n [type]=\"'detail'\"\r\n [width]=\"gridService.detailColumnWidth\"\r\n (expandedChange)=\"onToggleDetailClick(viewRow.row)\"></mona-grid-toggle>\r\n </span>\r\n </td>\r\n }\r\n @for (column of columns(); track $index) {\r\n @let colIndex = gridService.masterDetailTemplate() ? $index + 1 : $index;\r\n <td\r\n monaGridCell\r\n monaGridLockedCell\r\n [column]=\"column\"\r\n [grouped]=\"true\"\r\n [dataCell]=\"true\"\r\n [prevRowType]=\"prevRow?.type\"\r\n [nextRowType]=\"nextRow?.type\"\r\n monaGridLogicalCell\r\n [cellKind]=\"column.kind\"\r\n [colIndex]=\"colIndex\"\r\n [columnId]=\"column.id\"\r\n [firstInRow]=\"colIndex === 0\"\r\n [lastInRow]=\"\r\n colIndex === columns().length - (gridService.masterDetailTemplate() ? 0 : 1)\r\n \"\r\n [rowIndex]=\"rowIndex\"\r\n [rowUid]=\"viewRow.row.uid\"\r\n [section]=\"'body'\"\r\n [style.width.px]=\"column.calculatedWidth\"\r\n [style.min-width.px]=\"column.minWidth\"\r\n (edit)=\"gridCell.handleLogicalCellEnter()\">\r\n <mona-grid-cell #gridCell [column]=\"column\" [row]=\"viewRow.row\"></mona-grid-cell>\r\n </td>\r\n }\r\n @if (gridService.contextMenuItems().length !== 0) {\r\n <ng-container\r\n [ngTemplateOutlet]=\"contextMenuTemplate\"\r\n [ngTemplateOutletContext]=\"{\r\n $implicit: viewRow.row.data,\r\n element: rowElement,\r\n index: rowIndex\r\n }\">\r\n </ng-container>\r\n }\r\n </tr>\r\n @if (gridRow.expanded()) {\r\n <tr monaGridDetailRow [style.width.px]=\"gridService.masterDetailRowWidth()\">\r\n @for (_ of gridService.groupColumns() | monaSlice: 0 : viewRow.depth + 1; track $index) {\r\n <td\r\n monaGridCell\r\n monaGridLockedCell\r\n [lockedCellHeader]=\"true\"\r\n [lockedStructuralOffset]=\"$index * gridService.groupColumnWidth\"\r\n [grouped]=\"true\"\r\n [indentCell]=\"true\"\r\n [attr.colspan]=\"1\"\r\n [style.width.px]=\"gridService.groupColumnWidth\"></td>\r\n }\r\n @let colspan = columns().length + gridService.groupColumns().length - 1;\r\n <td\r\n monaGridDetailIndentCell\r\n monaGridLockedCell\r\n [lockedStructuralOffset]=\"(viewRow.depth + 1) * gridService.groupColumnWidth\"\r\n [nextRowType]=\"nextRow?.type\"\r\n [attr.colspan]=\"1\"\r\n [style.width.px]=\"gridService.masterDetailEmptyCellWidth()\"></td>\r\n <td monaGridDetailContentCell [nextRowType]=\"nextRow?.type\" [attr.colspan]=\"colspan\">\r\n <ng-container\r\n [ngTemplateOutlet]=\"gridService.masterDetailTemplate()\"\r\n [ngTemplateOutletContext]=\"{ $implicit: viewRow.row.data }\"></ng-container>\r\n </td>\r\n </tr>\r\n }\r\n }\r\n }\r\n }\r\n </tbody>\r\n</table>\r\n\r\n<ng-template let-rowData let-element=\"element\" let-rowIndex=\"index\" #contextMenuTemplate>\r\n <mona-contextmenu [target]=\"element\" [items]=\"gridService.contextMenuItems()\"></mona-contextmenu>\r\n <!-- [context]=\"{rowData, element, rowIndex}\"-->\r\n</ng-template>\r\n" }]
127
- }], ctorParameters: () => [], propDecorators: { bodyTableElementRef: [{ type: i0.ViewChild, args: ["bodyTable", { isSignal: true }] }], columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: false }] }], data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: false }] }] } });
128
-
129
- export { GridListComponent };
130
- //# sourceMappingURL=nanahoshi-mona-ui-grid-grid-list.component-Dgea-O0X.mjs.map