@raintonic/formaui 0.2.0 → 0.3.0

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 (186) hide show
  1. package/CHANGELOG.md +104 -7
  2. package/LICENSE +21 -0
  3. package/README.md +199 -145
  4. package/fesm2022/raintonic-formaui-cdk-drag-drop.mjs.map +1 -1
  5. package/fesm2022/raintonic-formaui-cdk-form-field.mjs.map +1 -1
  6. package/fesm2022/raintonic-formaui-cdk-overlay.mjs +0 -26
  7. package/fesm2022/raintonic-formaui-cdk-overlay.mjs.map +1 -1
  8. package/fesm2022/raintonic-formaui-cdk-virtual-scroll.mjs +2 -2
  9. package/fesm2022/raintonic-formaui-cdk-virtual-scroll.mjs.map +1 -1
  10. package/fesm2022/raintonic-formaui-components-accordion.mjs +2 -2
  11. package/fesm2022/raintonic-formaui-components-accordion.mjs.map +1 -1
  12. package/fesm2022/raintonic-formaui-components-alert.mjs +24 -5
  13. package/fesm2022/raintonic-formaui-components-alert.mjs.map +1 -1
  14. package/fesm2022/raintonic-formaui-components-autocomplete.mjs +38 -9
  15. package/fesm2022/raintonic-formaui-components-autocomplete.mjs.map +1 -1
  16. package/fesm2022/raintonic-formaui-components-avatar.mjs.map +1 -1
  17. package/fesm2022/raintonic-formaui-components-badge.mjs +45 -31
  18. package/fesm2022/raintonic-formaui-components-badge.mjs.map +1 -1
  19. package/fesm2022/raintonic-formaui-components-big-menu.mjs +23 -5
  20. package/fesm2022/raintonic-formaui-components-big-menu.mjs.map +1 -1
  21. package/fesm2022/raintonic-formaui-components-breadcrumb.mjs +24 -7
  22. package/fesm2022/raintonic-formaui-components-breadcrumb.mjs.map +1 -1
  23. package/fesm2022/raintonic-formaui-components-button-group.mjs +6 -6
  24. package/fesm2022/raintonic-formaui-components-button-group.mjs.map +1 -1
  25. package/fesm2022/raintonic-formaui-components-button.mjs +63 -17
  26. package/fesm2022/raintonic-formaui-components-button.mjs.map +1 -1
  27. package/fesm2022/raintonic-formaui-components-card.mjs +8 -8
  28. package/fesm2022/raintonic-formaui-components-card.mjs.map +1 -1
  29. package/fesm2022/raintonic-formaui-components-checkbox.mjs +2 -2
  30. package/fesm2022/raintonic-formaui-components-checkbox.mjs.map +1 -1
  31. package/fesm2022/raintonic-formaui-components-data-table.mjs +67 -9
  32. package/fesm2022/raintonic-formaui-components-data-table.mjs.map +1 -1
  33. package/fesm2022/raintonic-formaui-components-date-picker.mjs +63 -16
  34. package/fesm2022/raintonic-formaui-components-date-picker.mjs.map +1 -1
  35. package/fesm2022/raintonic-formaui-components-divider.mjs +2 -2
  36. package/fesm2022/raintonic-formaui-components-divider.mjs.map +1 -1
  37. package/fesm2022/raintonic-formaui-components-drawer.mjs +19 -4
  38. package/fesm2022/raintonic-formaui-components-drawer.mjs.map +1 -1
  39. package/fesm2022/raintonic-formaui-components-empty-state.mjs +2 -2
  40. package/fesm2022/raintonic-formaui-components-empty-state.mjs.map +1 -1
  41. package/fesm2022/raintonic-formaui-components-file-upload.mjs +25 -5
  42. package/fesm2022/raintonic-formaui-components-file-upload.mjs.map +1 -1
  43. package/fesm2022/raintonic-formaui-components-form-field.mjs +21 -6
  44. package/fesm2022/raintonic-formaui-components-form-field.mjs.map +1 -1
  45. package/fesm2022/raintonic-formaui-components-icon.mjs +2 -2
  46. package/fesm2022/raintonic-formaui-components-icon.mjs.map +1 -1
  47. package/fesm2022/raintonic-formaui-components-input.mjs +1 -1
  48. package/fesm2022/raintonic-formaui-components-input.mjs.map +1 -1
  49. package/fesm2022/raintonic-formaui-components-list.mjs +4 -4
  50. package/fesm2022/raintonic-formaui-components-list.mjs.map +1 -1
  51. package/fesm2022/raintonic-formaui-components-menu.mjs +4 -4
  52. package/fesm2022/raintonic-formaui-components-menu.mjs.map +1 -1
  53. package/fesm2022/raintonic-formaui-components-number-input.mjs +20 -5
  54. package/fesm2022/raintonic-formaui-components-number-input.mjs.map +1 -1
  55. package/fesm2022/raintonic-formaui-components-paginator.mjs +27 -7
  56. package/fesm2022/raintonic-formaui-components-paginator.mjs.map +1 -1
  57. package/fesm2022/raintonic-formaui-components-password-input.mjs +23 -5
  58. package/fesm2022/raintonic-formaui-components-password-input.mjs.map +1 -1
  59. package/fesm2022/raintonic-formaui-components-popover.mjs +2 -2
  60. package/fesm2022/raintonic-formaui-components-popover.mjs.map +1 -1
  61. package/fesm2022/raintonic-formaui-components-progressbar.mjs +32 -7
  62. package/fesm2022/raintonic-formaui-components-progressbar.mjs.map +1 -1
  63. package/fesm2022/raintonic-formaui-components-radio.mjs +4 -4
  64. package/fesm2022/raintonic-formaui-components-radio.mjs.map +1 -1
  65. package/fesm2022/raintonic-formaui-components-select.mjs +41 -26
  66. package/fesm2022/raintonic-formaui-components-select.mjs.map +1 -1
  67. package/fesm2022/raintonic-formaui-components-side-panel.mjs +19 -4
  68. package/fesm2022/raintonic-formaui-components-side-panel.mjs.map +1 -1
  69. package/fesm2022/raintonic-formaui-components-sidebar.mjs +23 -5
  70. package/fesm2022/raintonic-formaui-components-sidebar.mjs.map +1 -1
  71. package/fesm2022/raintonic-formaui-components-skeleton.mjs +2 -2
  72. package/fesm2022/raintonic-formaui-components-skeleton.mjs.map +1 -1
  73. package/fesm2022/raintonic-formaui-components-slider.mjs +23 -5
  74. package/fesm2022/raintonic-formaui-components-slider.mjs.map +1 -1
  75. package/fesm2022/raintonic-formaui-components-spinner.mjs +24 -7
  76. package/fesm2022/raintonic-formaui-components-spinner.mjs.map +1 -1
  77. package/fesm2022/raintonic-formaui-components-stepper.mjs +2 -2
  78. package/fesm2022/raintonic-formaui-components-stepper.mjs.map +1 -1
  79. package/fesm2022/raintonic-formaui-components-tab.mjs +10 -10
  80. package/fesm2022/raintonic-formaui-components-tab.mjs.map +1 -1
  81. package/fesm2022/raintonic-formaui-components-tag.mjs +21 -4
  82. package/fesm2022/raintonic-formaui-components-tag.mjs.map +1 -1
  83. package/fesm2022/raintonic-formaui-components-time-picker.mjs +26 -7
  84. package/fesm2022/raintonic-formaui-components-time-picker.mjs.map +1 -1
  85. package/fesm2022/raintonic-formaui-components-toggle.mjs +2 -2
  86. package/fesm2022/raintonic-formaui-components-toggle.mjs.map +1 -1
  87. package/fesm2022/raintonic-formaui-components-toolbar.mjs +41 -7
  88. package/fesm2022/raintonic-formaui-components-toolbar.mjs.map +1 -1
  89. package/fesm2022/raintonic-formaui-components-tooltip.mjs +2 -2
  90. package/fesm2022/raintonic-formaui-components-tooltip.mjs.map +1 -1
  91. package/fesm2022/raintonic-formaui-components-tree-select.mjs +2 -2
  92. package/fesm2022/raintonic-formaui-components-tree-select.mjs.map +1 -1
  93. package/fesm2022/raintonic-formaui-components-tree-table.mjs +35 -6
  94. package/fesm2022/raintonic-formaui-components-tree-table.mjs.map +1 -1
  95. package/fesm2022/raintonic-formaui-components-tree.mjs +25 -7
  96. package/fesm2022/raintonic-formaui-components-tree.mjs.map +1 -1
  97. package/fesm2022/raintonic-formaui-core.mjs +25 -1
  98. package/fesm2022/raintonic-formaui-core.mjs.map +1 -1
  99. package/fesm2022/raintonic-formaui-services-dialog.mjs +37 -37
  100. package/fesm2022/raintonic-formaui-services-dialog.mjs.map +1 -1
  101. package/fesm2022/raintonic-formaui-services-notification.mjs +2 -2
  102. package/fesm2022/raintonic-formaui-services-notification.mjs.map +1 -1
  103. package/fesm2022/raintonic-formaui-services-theme.mjs +3 -3
  104. package/fesm2022/raintonic-formaui-services-theme.mjs.map +1 -1
  105. package/fesm2022/raintonic-formaui-test-utils.mjs +21 -16
  106. package/fesm2022/raintonic-formaui-test-utils.mjs.map +1 -1
  107. package/fesm2022/raintonic-formaui.mjs +1 -1
  108. package/fesm2022/raintonic-formaui.mjs.map +1 -1
  109. package/llms-full.txt +36 -122
  110. package/llms.txt +4 -5
  111. package/package.json +1 -5
  112. package/styles/index.scss +5 -5
  113. package/styles/partials/_motion.scss +25 -0
  114. package/styles/partials/_theme.scss +6 -5
  115. package/styles/partials/components/_button.scss +361 -0
  116. package/styles/partials/components/_dialog.scss +180 -0
  117. package/styles/partials/components/_overlay.scss +87 -0
  118. package/styles/partials/themes/_dark.scss +14 -0
  119. package/styles/partials/themes/_light.scss +14 -0
  120. package/types/raintonic-formaui-cdk-overlay.d.ts +0 -1
  121. package/types/raintonic-formaui-cdk-overlay.d.ts.map +1 -1
  122. package/types/raintonic-formaui-components-alert.d.ts +11 -1
  123. package/types/raintonic-formaui-components-alert.d.ts.map +1 -1
  124. package/types/raintonic-formaui-components-autocomplete.d.ts +25 -7
  125. package/types/raintonic-formaui-components-autocomplete.d.ts.map +1 -1
  126. package/types/raintonic-formaui-components-badge.d.ts +20 -9
  127. package/types/raintonic-formaui-components-badge.d.ts.map +1 -1
  128. package/types/raintonic-formaui-components-big-menu.d.ts +12 -1
  129. package/types/raintonic-formaui-components-big-menu.d.ts.map +1 -1
  130. package/types/raintonic-formaui-components-breadcrumb.d.ts +11 -2
  131. package/types/raintonic-formaui-components-breadcrumb.d.ts.map +1 -1
  132. package/types/raintonic-formaui-components-button-group.d.ts +6 -6
  133. package/types/raintonic-formaui-components-button.d.ts +9 -7
  134. package/types/raintonic-formaui-components-button.d.ts.map +1 -1
  135. package/types/raintonic-formaui-components-card.d.ts +4 -4
  136. package/types/raintonic-formaui-components-checkbox.d.ts +1 -1
  137. package/types/raintonic-formaui-components-data-table.d.ts +56 -16
  138. package/types/raintonic-formaui-components-data-table.d.ts.map +1 -1
  139. package/types/raintonic-formaui-components-date-picker.d.ts +32 -4
  140. package/types/raintonic-formaui-components-date-picker.d.ts.map +1 -1
  141. package/types/raintonic-formaui-components-drawer.d.ts +10 -1
  142. package/types/raintonic-formaui-components-drawer.d.ts.map +1 -1
  143. package/types/raintonic-formaui-components-file-upload.d.ts +12 -1
  144. package/types/raintonic-formaui-components-file-upload.d.ts.map +1 -1
  145. package/types/raintonic-formaui-components-form-field.d.ts +12 -2
  146. package/types/raintonic-formaui-components-form-field.d.ts.map +1 -1
  147. package/types/raintonic-formaui-components-input.d.ts +1 -1
  148. package/types/raintonic-formaui-components-number-input.d.ts +11 -2
  149. package/types/raintonic-formaui-components-number-input.d.ts.map +1 -1
  150. package/types/raintonic-formaui-components-paginator.d.ts +13 -1
  151. package/types/raintonic-formaui-components-paginator.d.ts.map +1 -1
  152. package/types/raintonic-formaui-components-password-input.d.ts +12 -2
  153. package/types/raintonic-formaui-components-password-input.d.ts.map +1 -1
  154. package/types/raintonic-formaui-components-progressbar.d.ts +14 -1
  155. package/types/raintonic-formaui-components-progressbar.d.ts.map +1 -1
  156. package/types/raintonic-formaui-components-select.d.ts.map +1 -1
  157. package/types/raintonic-formaui-components-side-panel.d.ts +10 -1
  158. package/types/raintonic-formaui-components-side-panel.d.ts.map +1 -1
  159. package/types/raintonic-formaui-components-sidebar.d.ts +12 -1
  160. package/types/raintonic-formaui-components-sidebar.d.ts.map +1 -1
  161. package/types/raintonic-formaui-components-slider.d.ts +12 -1
  162. package/types/raintonic-formaui-components-slider.d.ts.map +1 -1
  163. package/types/raintonic-formaui-components-spinner.d.ts +12 -2
  164. package/types/raintonic-formaui-components-spinner.d.ts.map +1 -1
  165. package/types/raintonic-formaui-components-tag.d.ts +10 -1
  166. package/types/raintonic-formaui-components-tag.d.ts.map +1 -1
  167. package/types/raintonic-formaui-components-time-picker.d.ts +14 -2
  168. package/types/raintonic-formaui-components-time-picker.d.ts.map +1 -1
  169. package/types/raintonic-formaui-components-toggle.d.ts +1 -1
  170. package/types/raintonic-formaui-components-toolbar.d.ts +22 -4
  171. package/types/raintonic-formaui-components-toolbar.d.ts.map +1 -1
  172. package/types/raintonic-formaui-components-tree-table.d.ts +29 -4
  173. package/types/raintonic-formaui-components-tree-table.d.ts.map +1 -1
  174. package/types/raintonic-formaui-components-tree.d.ts +12 -1
  175. package/types/raintonic-formaui-components-tree.d.ts.map +1 -1
  176. package/types/raintonic-formaui-core.d.ts +19 -2
  177. package/types/raintonic-formaui-core.d.ts.map +1 -1
  178. package/types/raintonic-formaui-services-dialog.d.ts +1 -1
  179. package/types/raintonic-formaui-services-theme.d.ts +3 -3
  180. package/types/raintonic-formaui-test-utils.d.ts +15 -2
  181. package/types/raintonic-formaui-test-utils.d.ts.map +1 -1
  182. package/types/raintonic-formaui.d.ts +1 -1
  183. package/fesm2022/raintonic-formaui-components-dynamic-form.mjs +0 -266
  184. package/fesm2022/raintonic-formaui-components-dynamic-form.mjs.map +0 -1
  185. package/types/raintonic-formaui-components-dynamic-form.d.ts +0 -412
  186. package/types/raintonic-formaui-components-dynamic-form.d.ts.map +0 -1
@@ -1,7 +1,9 @@
1
1
  import * as i0 from '@angular/core';
2
- import { input, output, signal, computed, ViewChild, ViewEncapsulation, ChangeDetectionStrategy, Component } from '@angular/core';
2
+ import { Injectable, inject, ChangeDetectorRef, signal, input, computed, output, ViewChild, ViewEncapsulation, ChangeDetectionStrategy, Component } from '@angular/core';
3
+ import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
3
4
  import * as i1 from '@angular/common';
4
5
  import { CommonModule } from '@angular/common';
6
+ import { FuiIntlBase } from '@raintonic/formaui/core';
5
7
  import * as i2 from '@angular/forms';
6
8
  import { FormsModule } from '@angular/forms';
7
9
  import { FuiButtonDirective } from '@raintonic/formaui/components/button';
@@ -13,6 +15,35 @@ import { FuiTooltipDirective } from '@raintonic/formaui/components/tooltip';
13
15
  import { FuiIconComponent } from '@raintonic/formaui/components/icon';
14
16
  import { FuiBadgeComponent } from '@raintonic/formaui/components/badge';
15
17
 
18
+ class FuiDataTableIntl extends FuiIntlBase {
19
+ tableAriaLabel = 'Data table';
20
+ emptyMessage = 'No data available';
21
+ selectAllAriaLabel = 'Select all rows';
22
+ sortAriaLabel(columnLabel) {
23
+ return `Sort by ${columnLabel}`;
24
+ }
25
+ filterAriaLabel(columnLabel) {
26
+ return `Filter ${columnLabel}`;
27
+ }
28
+ selectRowAriaLabel(rowIndex) {
29
+ return `Select row ${rowIndex}`;
30
+ }
31
+ sortTooltip = 'Sort';
32
+ filterTooltip = 'Filter';
33
+ selectOperatorPlaceholder = 'Select operator';
34
+ enterValuePlaceholder = 'Enter value';
35
+ enterFinalValuePlaceholder = 'Enter final value';
36
+ selectValuePlaceholder = 'Select value';
37
+ applyButtonLabel = 'Apply';
38
+ clearButtonLabel = 'Clear';
39
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: FuiDataTableIntl, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
40
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: FuiDataTableIntl, providedIn: 'root' });
41
+ }
42
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: FuiDataTableIntl, decorators: [{
43
+ type: Injectable,
44
+ args: [{ providedIn: 'root' }]
45
+ }] });
46
+
16
47
  /**
17
48
  * Filter operator types
18
49
  */
@@ -44,7 +75,7 @@ var FilterOperator;
44
75
  * @input data - Array of row data objects. Default [].
45
76
  * @input enableRowHighlight - Whether clicking a row toggles highlight. Default false.
46
77
  * @input tableAriaLabel - Accessible label for the table element. Default 'Data table'.
47
- * @input emptyMessage - Message shown when data is empty. Default 'Nessun dato disponibile'.
78
+ * @input emptyMessage - Message shown when data is empty. Default 'No data available'.
48
79
  * @input sort - Current sort state: { field, direction } or null.
49
80
  * @input filters - Array of active column filters.
50
81
  * @output sortChange - Emits when the user changes sort direction on a column.
@@ -62,6 +93,16 @@ var FilterOperator;
62
93
  * </fui-advanced-data-table>
63
94
  */
64
95
  class FuiAdvancedDataTableComponent {
96
+ intl = inject(FuiDataTableIntl);
97
+ _cdr = inject(ChangeDetectorRef);
98
+ /** @internal — bumped when Intl mutates so computeds that read plain intl fields reinvoke. */
99
+ _intlTick = signal(0, ...(ngDevMode ? [{ debugName: "_intlTick" }] : /* istanbul ignore next */ []));
100
+ constructor() {
101
+ this.intl.changes.pipe(takeUntilDestroyed()).subscribe(() => {
102
+ this._intlTick.update((v) => v + 1);
103
+ this._cdr.markForCheck();
104
+ });
105
+ }
65
106
  /**
66
107
  * Table configuration
67
108
  */
@@ -80,14 +121,31 @@ class FuiAdvancedDataTableComponent {
80
121
  */
81
122
  enableRowHighlight = input(false, ...(ngDevMode ? [{ debugName: "enableRowHighlight" }] : /* istanbul ignore next */ []));
82
123
  /**
83
- * Accessible label for the table
124
+ * Accessible label for the table.
125
+ * Default comes from FuiDataTableIntl.tableAriaLabel ('Data table').
84
126
  */
85
- tableAriaLabel = input('Data table', ...(ngDevMode ? [{ debugName: "tableAriaLabel" }] : /* istanbul ignore next */ []));
127
+ tableAriaLabel = input(undefined, ...(ngDevMode ? [{ debugName: "tableAriaLabel" }] : /* istanbul ignore next */ []));
86
128
  _liveAnnouncer;
87
129
  /**
88
130
  * Message shown when the data array is empty. Pass empty string to hide.
131
+ * Default comes from FuiDataTableIntl.emptyMessage ('No data available').
132
+ */
133
+ emptyMessage = input(undefined, ...(ngDevMode ? [{ debugName: "emptyMessage" }] : /* istanbul ignore next */ []));
134
+ /**
135
+ * Resolved accessible label: input override → intl default.
136
+ */
137
+ resolvedTableAriaLabel = computed(() => {
138
+ this._intlTick();
139
+ return this.tableAriaLabel() ?? this.intl.tableAriaLabel;
140
+ }, ...(ngDevMode ? [{ debugName: "resolvedTableAriaLabel" }] : /* istanbul ignore next */ []));
141
+ /**
142
+ * Resolved empty-state message: input override → intl default.
143
+ * Passing an empty string suppresses the empty state row.
89
144
  */
90
- emptyMessage = input('Nessun dato disponibile', ...(ngDevMode ? [{ debugName: "emptyMessage" }] : /* istanbul ignore next */ []));
145
+ resolvedEmptyMessage = computed(() => {
146
+ this._intlTick();
147
+ return this.emptyMessage() ?? this.intl.emptyMessage;
148
+ }, ...(ngDevMode ? [{ debugName: "resolvedEmptyMessage" }] : /* istanbul ignore next */ []));
91
149
  /**
92
150
  * Current sort configuration
93
151
  */
@@ -598,7 +656,7 @@ class FuiAdvancedDataTableComponent {
598
656
  return operatorConfig?.requiresInput ?? false;
599
657
  }
600
658
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: FuiAdvancedDataTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
601
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: FuiAdvancedDataTableComponent, isStandalone: true, selector: "fui-advanced-data-table", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, trackBy: { classPropertyName: "trackBy", publicName: "trackBy", isSignal: true, isRequired: false, transformFunction: null }, enableRowHighlight: { classPropertyName: "enableRowHighlight", publicName: "enableRowHighlight", isSignal: true, isRequired: false, transformFunction: null }, tableAriaLabel: { classPropertyName: "tableAriaLabel", publicName: "tableAriaLabel", isSignal: true, isRequired: false, transformFunction: null }, emptyMessage: { classPropertyName: "emptyMessage", publicName: "emptyMessage", isSignal: true, isRequired: false, transformFunction: null }, sort: { classPropertyName: "sort", publicName: "sort", isSignal: true, isRequired: false, transformFunction: null }, filters: { classPropertyName: "filters", publicName: "filters", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { sortChange: "sortChange", filtersChange: "filtersChange", rowDblClick: "rowDblClick" }, host: { classAttribute: "fui-advanced-data-table" }, viewQueries: [{ propertyName: "_liveAnnouncer", first: true, predicate: ["liveAnnouncer"], descendants: true }], ngImport: i0, template: "<div class=\"fui-advanced-data-table__wrapper\">\r\n <!-- Live region for sort/filter announcements -->\r\n <div class=\"fui-sr-only\" aria-live=\"polite\" aria-atomic=\"true\" #liveAnnouncer></div>\r\n <table\r\n class=\"fui-advanced-data-table__table\"\r\n role=\"grid\"\r\n [attr.aria-label]=\"tableAriaLabel()\"\r\n [attr.aria-rowcount]=\"data().length\"\r\n >\r\n <!-- Table Header -->\r\n <thead\r\n class=\"fui-advanced-data-table__header\"\r\n [class.fui-advanced-data-table__header--sticky]=\"config().headerSticky\"\r\n >\r\n <tr class=\"fui-advanced-data-table__header-row\">\r\n <!-- Selection Checkbox Column -->\r\n @if (config().areRowsSelectable) {\r\n <th\r\n scope=\"col\"\r\n class=\"fui-advanced-data-table__header-cell fui-advanced-data-table__header-cell--checkbox\"\r\n [class.fui-advanced-data-table__header-cell--sticky-start]=\"\r\n processedHeaders()[0] && processedHeaders()[0].isStartSticky\r\n \"\r\n >\r\n <input\r\n type=\"checkbox\"\r\n class=\"fui-advanced-data-table__checkbox\"\r\n [checked]=\"allRowsSelected()\"\r\n [indeterminate]=\"someRowsSelected()\"\r\n (change)=\"toggleAllRows()\"\r\n aria-label=\"Select all rows\"\r\n />\r\n </th>\r\n }\r\n\r\n <!-- Data Columns -->\r\n @for (header of processedHeaders(); track header.field) {\r\n <th\r\n scope=\"col\"\r\n [class]=\"getHeaderClasses(header)\"\r\n [ngStyle]=\"getHeaderStyles(header)\"\r\n [attr.aria-sort]=\"getAriaSortValue(header.field)\"\r\n >\r\n <div class=\"fui-advanced-data-table__header-content\">\r\n <span class=\"fui-advanced-data-table__header-label\">{{ header.label }}</span>\r\n\r\n @if (header.hasSort) {\r\n <button\r\n type=\"button\"\r\n class=\"fui-advanced-data-table__sort-button\"\r\n (click)=\"onSortClick(header.field)\"\r\n [attr.aria-label]=\"'Sort by ' + header.label\"\r\n fuiTooltip=\"Ordina\"\r\n fuiTooltipSize=\"sm\"\r\n fuiTooltipPosition=\"bottom\"\r\n >\r\n <svg\r\n [class]=\"getSortIconClasses(header.field)\"\r\n width=\"16\"\r\n height=\"16\"\r\n viewBox=\"0 0 16 16\"\r\n fill=\"currentColor\"\r\n >\r\n <path d=\"M8 3L12 7H4L8 3Z\" />\r\n <path d=\"M8 13L4 9H12L8 13Z\" />\r\n </svg>\r\n </button>\r\n }\r\n\r\n @if (header.hasFilter) {\r\n <button\r\n type=\"button\"\r\n class=\"fui-advanced-data-table__filter-button\"\r\n fuiMenuTrigger\r\n [menuTriggerFor]=\"filterMenu\"\r\n [menuTriggerData]=\"{ field: header.field, type: header.type }\"\r\n [attr.aria-label]=\"'Filter ' + header.label\"\r\n fuiTooltip=\"Filtra\"\r\n fuiTooltipSize=\"sm\"\r\n fuiTooltipPosition=\"bottom\"\r\n >\r\n <svg\r\n [class]=\"getFilterIconClasses(header.field)\"\r\n width=\"16\"\r\n height=\"16\"\r\n viewBox=\"0 0 16 16\"\r\n fill=\"currentColor\"\r\n >\r\n <path d=\"M2 2L6 8V13L10 15V8L14 2H2Z\" />\r\n </svg>\r\n </button>\r\n\r\n <fui-menu\r\n #filterMenu\r\n position=\"bottom-end\"\r\n size=\"md\"\r\n (openChange)=\"$event && initFilterForm(header.field, header.type)\"\r\n [closeOnClickOutside]=\"true\"\r\n >\r\n <div class=\"fui-advanced-data-table__filter-menu-content\" (click)=\"$event.stopPropagation()\">\r\n <div class=\"fui-text-xs\">{{ header.label }}</div>\r\n @if (header.type !== 'label') {\r\n <!-- Operator Selection -->\r\n <fui-form-field [hideSubscript]=\"true\">\r\n <fui-select [(ngModel)]=\"tempFilterOperator\" placeholder=\"Seleziona operatore\">\r\n @for (operator of getFilterOperators(header.type); track operator.value) {\r\n <fui-option [value]=\"operator.value\">\r\n {{ operator.label }}\r\n </fui-option>\r\n }\r\n </fui-select>\r\n </fui-form-field>\r\n\r\n <!-- Value Input(s) -->\r\n @if (requiresInput(header.type)) {\r\n <fui-form-field [hideSubscript]=\"true\">\r\n <input\r\n fuiInput\r\n [type]=\"header.type === 'number' ? 'number' : header.type === 'date' ? 'date' : 'text'\"\r\n [(ngModel)]=\"tempFilterValue\"\r\n placeholder=\"Inserisci valore\"\r\n />\r\n </fui-form-field>\r\n\r\n @if (requiresSecondInput(header.type)) {\r\n <fui-form-field [hideSubscript]=\"true\">\r\n <input\r\n fuiInput\r\n [type]=\"header.type === 'number' ? 'number' : header.type === 'date' ? 'date' : 'text'\"\r\n [(ngModel)]=\"tempFilterValue2\"\r\n placeholder=\"Inserisci valore finale\"\r\n />\r\n </fui-form-field>\r\n }\r\n }\r\n } @else {\r\n <!-- Label filter: select dropdown -->\r\n <fui-form-field [hideSubscript]=\"true\">\r\n <fui-select [(ngModel)]=\"tempFilterValue\" placeholder=\"Seleziona valore\">\r\n @for (labelOpt of header.labels ?? []; track labelOpt.value) {\r\n <fui-option [value]=\"labelOpt.value\">\r\n {{ labelOpt.label }}\r\n </fui-option>\r\n }\r\n </fui-select>\r\n </fui-form-field>\r\n }\r\n\r\n <!-- Actions -->\r\n <div class=\"fui-advanced-data-table__filter-actions\">\r\n <button\r\n fuiButton\r\n variant=\"primary\"\r\n size=\"sm\"\r\n (click)=\"applyFilter(header.field, header.type, filterMenu)\"\r\n >\r\n Applica\r\n </button>\r\n <button fuiButton variant=\"outline\" size=\"sm\" (click)=\"clearFilter(header.field, filterMenu)\">\r\n Pulisci\r\n </button>\r\n </div>\r\n </div>\r\n </fui-menu>\r\n }\r\n </div>\r\n </th>\r\n }\r\n </tr>\r\n </thead>\r\n\r\n <!-- Table Body -->\r\n <tbody class=\"fui-advanced-data-table__body\">\r\n @if (data().length === 0 && emptyMessage()) {\r\n <tr class=\"fui-advanced-data-table__row fui-advanced-data-table__row--empty\">\r\n <td\r\n class=\"fui-advanced-data-table__cell fui-advanced-data-table__cell--empty\"\r\n [attr.colspan]=\"processedHeaders().length + (config().areRowsSelectable ? 1 : 0)\"\r\n >\r\n <div class=\"fui-advanced-data-table__empty-state\">\r\n <fui-icon\r\n name=\"magnifying-glass\"\r\n class=\"fui-advanced-data-table__empty-state-icon\"\r\n aria-hidden=\"true\"\r\n ></fui-icon>\r\n {{ emptyMessage() }}\r\n </div>\r\n </td>\r\n </tr>\r\n } @else {\r\n @for (row of data(); track trackBy()($index, row)) {\r\n <tr\r\n (dblclick)=\"rowDblClick.emit(row)\"\r\n class=\"fui-advanced-data-table__row\"\r\n [class.fui-advanced-data-table__row--selected]=\"isRowSelected($index)\"\r\n [class.fui-advanced-data-table__row--highlighted]=\"isRowHighlighted($index)\"\r\n [class.fui-advanced-data-table__row--clickable]=\"enableRowHighlight()\"\r\n [attr.aria-selected]=\"config().areRowsSelectable ? isRowSelected($index) : null\"\r\n [attr.aria-rowindex]=\"$index + 2\"\r\n (click)=\"toggleRowHighlight($index)\"\r\n >\r\n <!-- Selection Checkbox -->\r\n @if (config().areRowsSelectable) {\r\n <td\r\n class=\"fui-advanced-data-table__cell fui-advanced-data-table__cell--checkbox\"\r\n [class.fui-advanced-data-table__cell--sticky-start]=\"\r\n processedHeaders()[0] && processedHeaders()[0].isStartSticky\r\n \"\r\n >\r\n <input\r\n type=\"checkbox\"\r\n class=\"fui-advanced-data-table__checkbox\"\r\n [checked]=\"isRowSelected($index)\"\r\n (change)=\"toggleRow($index)\"\r\n [attr.aria-label]=\"'Select row ' + ($index + 1)\"\r\n />\r\n </td>\r\n }\r\n\r\n <!-- Data Cells -->\r\n @for (header of processedHeaders(); track header.field) {\r\n <td [class]=\"getCellClasses(header)\" [ngStyle]=\"getCellStyles(header)\">\r\n @if (header.type === 'boolean') {\r\n @if (getCellValue(row, header.field)) {\r\n <fui-icon name=\"check-circle\" class=\"fui-advanced-data-table__bool-icon--true\"></fui-icon>\r\n } @else {\r\n <fui-icon name=\"x-circle\" class=\"fui-advanced-data-table__bool-icon--false\"></fui-icon>\r\n }\r\n } @else if (header.type === 'label') {\r\n @let labelConfig = getLabelConfig(getCellValue(row, header.field), header.labels ?? []);\r\n @if (labelConfig) {\r\n <fui-badge\r\n [label]=\"labelConfig.label\"\r\n [customColor]=\"labelConfig.color\"\r\n [icon]=\"labelConfig.icon ?? null\"\r\n size=\"sm\"\r\n />\r\n } @else {\r\n <fui-badge [label]=\"'' + getCellValue(row, header.field)\" variant=\"info\" size=\"sm\" />\r\n }\r\n } @else {\r\n {{ formatCellValue(getCellValue(row, header.field), header.type) }}\r\n }\r\n </td>\r\n }\r\n </tr>\r\n }\r\n }\r\n </tbody>\r\n </table>\r\n</div>\r\n", styles: ["@keyframes fui-skeleton-pulse{0%{opacity:1}50%{opacity:.4}to{opacity:1}}@keyframes fui-spin{to{transform:rotate(360deg)}}@keyframes fui-shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-2px)}20%,40%,60%,80%{transform:translate(2px)}}.fui-motion-fade-in{transition:opacity var(--fui-duration-fast-02) var(--fui-ease-entrance) 0ms}.fui-motion-fade-out{transition:opacity var(--fui-duration-fast-01) var(--fui-ease-exit) 0ms}.fui-motion-slide-in-bottom{transition:transform var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:translateY(0)}.fui-motion-slide-in-bottom.fui-motion-entering{transform:translateY(1rem)}.fui-motion-slide-in-top{transition:transform var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:translateY(0)}.fui-motion-slide-in-top.fui-motion-entering{transform:translateY(-1rem)}.fui-motion-scale-in{transition:transform,opacity var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:scale(1);opacity:1}.fui-motion-scale-in.fui-motion-entering{transform:scale(.95);opacity:0}.fui-no-motion{transition:none!important;animation:none!important}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@keyframes fui-pulse{0%{transform:scale(1);opacity:1}50%{transform:scale(1.05)}to{transform:scale(1);opacity:1}}@keyframes fui-slide-in{0%{transform:translate(120%)}to{transform:translate(0)}}.fui-slide-in{animation:fui-slide-in var(--fui-duration-moderate-01) var(--fui-ease-entrance)}.fui-advanced-data-table{--fui-table-font-size: var(--fui-font-size-sm, .875rem);--fui-table-header-bg: var(--fui-surface-01);--fui-table-row-bg: var(--fui-surface-00);--fui-table-row-hover-bg: var(--fui-surface-02);--fui-table-row-height: 3rem;--fui-table-cell-padding-y: .5rem;--fui-table-cell-padding-x: 1rem;--fui-table-border-color: var(--fui-border-color);display:block;width:100%;position:relative}.fui-advanced-data-table__wrapper{width:100%;overflow-x:auto;overflow-y:visible;position:relative}.fui-advanced-data-table__wrapper::-webkit-scrollbar{height:8px}.fui-advanced-data-table__wrapper::-webkit-scrollbar-track{background:var(--fui-surface-01);border-radius:var(--fui-border-radius-sm)}.fui-advanced-data-table__wrapper::-webkit-scrollbar-thumb{background:var(--fui-border-color);border-radius:var(--fui-border-radius-sm)}.fui-advanced-data-table__wrapper::-webkit-scrollbar-thumb:hover{background:var(--fui-text-secondary)}.fui-advanced-data-table__table{width:100%;border-collapse:separate;border-spacing:0;font-family:var(--fui-font-family-sans);font-size:var(--fui-table-font-size);color:var(--fui-text-primary);background-color:var(--fui-table-row-bg)}.fui-advanced-data-table__header{background-color:var(--fui-table-header-bg);border-bottom:1px solid var(--fui-table-border-color)}.fui-advanced-data-table__header--sticky{position:sticky;top:0;z-index:10}.fui-advanced-data-table__header-row{height:var(--fui-table-row-height)}.fui-advanced-data-table__header-row .formaui-advanced-data-table__header-cell:last-child{border-right:none}.fui-advanced-data-table__header-cell{padding:var(--fui-table-cell-padding-y) var(--fui-table-cell-padding-x);text-align:left;font-weight:var(--fui-font-weight-semibold, 600);color:var(--fui-text-secondary);background-color:var(--fui-table-header-bg);border-right:1px solid var(--fui-border-color);border-bottom:1px solid var(--fui-border-color);white-space:nowrap;-webkit-user-select:none;user-select:none;position:relative;box-shadow:0 1.19px 3.57px #1018281a}.fui-advanced-data-table__header-cell--checkbox{width:48px;min-width:48px;max-width:48px;padding:.5rem;text-align:center}.fui-advanced-data-table__header-cell--sticky-start{position:sticky;z-index:11;background-color:var(--fui-surface-01)}.fui-advanced-data-table__header-cell--sticky-start-edge:after{content:\"\";position:absolute;top:0;right:0;bottom:0;width:1px;background:linear-gradient(to right,var(--fui-border-color),transparent);pointer-events:none}.fui-advanced-data-table__header-cell--sticky-end{position:sticky;z-index:11;background-color:var(--fui-surface-01)}.fui-advanced-data-table__header-cell--sticky-end-edge:before{content:\"\";position:absolute;top:0;left:0;bottom:0;width:1px;background:linear-gradient(to left,var(--fui-border-color),transparent);pointer-events:none}.fui-advanced-data-table__header-content{display:flex;align-items:center;gap:.25rem}.fui-advanced-data-table__header-label{flex:1;overflow:hidden;text-overflow:ellipsis}.fui-advanced-data-table__sort-button,.fui-advanced-data-table__filter-button{display:inline-flex;align-items:center;justify-content:center;padding:.125rem;border:none;background:transparent;color:var(--fui-text-secondary);cursor:pointer;border-radius:var(--fui-border-radius-sm);transition:all var(--fui-duration-fast-02, .15s) var(--fui-ease-standard) 0ms}.fui-advanced-data-table__sort-button:hover,.fui-advanced-data-table__filter-button:hover{color:var(--fui-text-primary);background-color:var(--fui-surface-02)}.fui-advanced-data-table__sort-button:focus-visible,.fui-advanced-data-table__filter-button:focus-visible{outline:2px solid var(--fui-primary);outline-offset:2px}.fui-advanced-data-table__sort-icon,.fui-advanced-data-table__filter-icon{width:16px;height:16px}.fui-advanced-data-table__sort-icon{opacity:.6;transition:opacity var(--fui-duration-fast-01, .1s) var(--fui-ease-standard) 0ms}.fui-advanced-data-table__sort-icon path{transition:opacity var(--fui-duration-fast-01, .1s) var(--fui-ease-standard) 0ms}.fui-advanced-data-table__sort-icon--asc{opacity:1;color:var(--fui-primary)}.fui-advanced-data-table__sort-icon--asc path:first-child{opacity:1}.fui-advanced-data-table__sort-icon--asc path:last-child{opacity:.3}.fui-advanced-data-table__sort-icon--desc{opacity:1;color:var(--fui-primary)}.fui-advanced-data-table__sort-icon--desc path:first-child{opacity:.3}.fui-advanced-data-table__sort-icon--desc path:last-child{opacity:1}.fui-advanced-data-table__filter-icon{opacity:.6;transition:all var(--fui-duration-fast-01, .1s) var(--fui-ease-standard) 0ms}.fui-advanced-data-table__filter-icon--active{opacity:1;color:var(--fui-primary)}.fui-advanced-data-table__filter-menu-content{display:flex;flex-direction:column;gap:.75rem;padding:.75rem;min-width:280px}.fui-advanced-data-table__filter-select{width:100%}.fui-advanced-data-table__filter-actions{display:flex;gap:.25rem;justify-content:flex-end;margin-top:.25rem}.fui-advanced-data-table__body{background-color:var(--fui-surface-00)}.fui-advanced-data-table__row{height:var(--fui-table-row-height);background-color:var(--fui-table-row-bg);border-bottom:1px solid var(--fui-table-border-color);transition:background-color var(--fui-duration-fast-01, .1s) var(--fui-ease-standard) 0ms}.fui-advanced-data-table__row:hover{background-color:var(--fui-table-row-hover-bg)}.fui-advanced-data-table__row--clickable{cursor:pointer}.fui-advanced-data-table__row--selected{background-color:var(--fui-primary-10)}.fui-advanced-data-table__row--selected:hover,.fui-advanced-data-table__row--highlighted,.fui-advanced-data-table__row--highlighted:hover{background-color:var(--fui-primary-20)}.fui-advanced-data-table__row--empty{height:auto}.fui-advanced-data-table__row--empty:hover{background-color:transparent}.fui-advanced-data-table__row .formaui-advanced-data-table__cell:last-child{border-right:none}.fui-advanced-data-table__cell{padding:var(--fui-table-cell-padding-y) var(--fui-table-cell-padding-x);color:var(--fui-text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:300px;position:relative;border-bottom:1px solid var(--fui-table-border-color);border-right:1px solid var(--fui-table-border-color)}.fui-advanced-data-table__cell--checkbox{width:48px;min-width:48px;max-width:48px;padding:.5rem;text-align:center}.fui-advanced-data-table__cell--empty{padding:2.5rem 1rem;text-align:center;color:var(--fui-text-secondary);white-space:normal;border-bottom:none}.fui-advanced-data-table__cell--sticky-start{position:sticky;z-index:9;background-color:inherit}.fui-advanced-data-table__cell--sticky-start-edge:after{content:\"\";position:absolute;top:0;right:0;bottom:0;width:1px;background:linear-gradient(to right,var(--fui-border-color),transparent);pointer-events:none}.fui-advanced-data-table__cell--sticky-end{position:sticky;z-index:9;background-color:inherit}.fui-advanced-data-table__cell--sticky-end-edge:before{content:\"\";position:absolute;top:0;left:0;bottom:0;width:1px;background:linear-gradient(to left,var(--fui-border-color),transparent);pointer-events:none}.fui-advanced-data-table__checkbox{width:18px;height:18px;cursor:pointer;accent-color:var(--fui-primary)}.fui-advanced-data-table__checkbox:focus-visible{outline:2px solid var(--fui-primary);outline-offset:2px}.fui-advanced-data-table__empty-state{padding:2.5rem;text-align:center;color:var(--fui-text-secondary);font-size:var(--fui-font-size-md, 1rem);display:flex;flex-direction:column;align-items:center;gap:.75rem}.fui-advanced-data-table__empty-state-icon{font-size:var(--fui-font-size-09);color:var(--fui-text-secondary);opacity:.5}.fui-advanced-data-table__bool-icon--true{color:var(--fui-success)}.fui-advanced-data-table__bool-icon--false{color:var(--fui-danger)}@media(max-width:768px){.fui-advanced-data-table__table{font-size:var(--fui-font-size-xs, .75rem)}.fui-advanced-data-table__header-cell,.fui-advanced-data-table__cell{padding:.25rem .5rem;max-width:200px}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: FuiFormFieldComponent, selector: "fui-form-field", inputs: ["readOnly", "appearance", "hideRequiredMarker", "hideSubscript"] }, { kind: "directive", type: FuiInputDirective, selector: "input[fuiInput], textarea[fuiInput], select[fuiInput]", inputs: ["type", "placeholder", "readonly", "maxlength", "minlength", "pattern", "errorStateMatcher", "disabledInput"], outputs: ["valueChange"] }, { kind: "directive", type: FuiButtonDirective, selector: "button[fuiButton], a[fuiButton]", inputs: ["variant", "size", "disabled", "fullWidth", "loading", "iconOnly", "aria-label", "type"] }, { kind: "component", type: FuiMenuComponent, selector: "fui-menu", inputs: ["position", "size", "closeOnClickOutside", "closeOnEscape", "disabled", "attachToBody"], outputs: ["openChange", "itemSelected"] }, { kind: "directive", type: FuiMenuTriggerDirective, selector: "[fuiMenuTrigger]", inputs: ["menuTriggerFor", "menuTriggerData"] }, { kind: "component", type: FuiSelectComponent, selector: "fui-select", inputs: ["placeholder", "disabled", "readonly", "multiple", "errorStateMatcher", "compareWith"], outputs: ["valueChange", "selectionChange", "openedChange"] }, { kind: "component", type: FuiOptionComponent, selector: "fui-option", inputs: ["value", "disabled"], outputs: ["selectionChange"] }, { kind: "directive", type: FuiTooltipDirective, selector: "[fuiTooltip]", inputs: ["fuiTooltip", "fuiTooltipPosition", "fuiTooltipSize", "fuiTooltipTrigger", "fuiTooltipShowDelay", "fuiTooltipHideDelay", "fuiTooltipDisabled", "fuiTooltipMaxWidth", "fuiTooltipOffset", "fuiTooltipArrow", "fuiTooltipShow"] }, { kind: "component", type: FuiIconComponent, selector: "fui-icon", inputs: ["name", "size", "weight", "color", "ariaLabel", "spin", "pulse"] }, { kind: "component", type: FuiBadgeComponent, selector: "fui-badge", inputs: ["label", "icon", "customColor", "size", "variant", "ariaLabel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
659
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: FuiAdvancedDataTableComponent, isStandalone: true, selector: "fui-advanced-data-table", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, trackBy: { classPropertyName: "trackBy", publicName: "trackBy", isSignal: true, isRequired: false, transformFunction: null }, enableRowHighlight: { classPropertyName: "enableRowHighlight", publicName: "enableRowHighlight", isSignal: true, isRequired: false, transformFunction: null }, tableAriaLabel: { classPropertyName: "tableAriaLabel", publicName: "tableAriaLabel", isSignal: true, isRequired: false, transformFunction: null }, emptyMessage: { classPropertyName: "emptyMessage", publicName: "emptyMessage", isSignal: true, isRequired: false, transformFunction: null }, sort: { classPropertyName: "sort", publicName: "sort", isSignal: true, isRequired: false, transformFunction: null }, filters: { classPropertyName: "filters", publicName: "filters", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { sortChange: "sortChange", filtersChange: "filtersChange", rowDblClick: "rowDblClick" }, host: { classAttribute: "fui-advanced-data-table" }, viewQueries: [{ propertyName: "_liveAnnouncer", first: true, predicate: ["liveAnnouncer"], descendants: true }], ngImport: i0, template: "<div class=\"fui-advanced-data-table__wrapper\">\r\n <!-- Live region for sort/filter announcements -->\r\n <div class=\"fui-sr-only\" aria-live=\"polite\" aria-atomic=\"true\" #liveAnnouncer></div>\r\n <table\r\n class=\"fui-advanced-data-table__table\"\r\n role=\"grid\"\r\n [attr.aria-label]=\"resolvedTableAriaLabel()\"\r\n [attr.aria-rowcount]=\"data().length\"\r\n >\r\n <!-- Table Header -->\r\n <thead\r\n class=\"fui-advanced-data-table__header\"\r\n [class.fui-advanced-data-table__header--sticky]=\"config().headerSticky\"\r\n >\r\n <tr class=\"fui-advanced-data-table__header-row\">\r\n <!-- Selection Checkbox Column -->\r\n @if (config().areRowsSelectable) {\r\n <th\r\n scope=\"col\"\r\n class=\"fui-advanced-data-table__header-cell fui-advanced-data-table__header-cell--checkbox\"\r\n [class.fui-advanced-data-table__header-cell--sticky-start]=\"\r\n processedHeaders()[0] && processedHeaders()[0].isStartSticky\r\n \"\r\n >\r\n <input\r\n type=\"checkbox\"\r\n class=\"fui-advanced-data-table__checkbox\"\r\n [checked]=\"allRowsSelected()\"\r\n [indeterminate]=\"someRowsSelected()\"\r\n (change)=\"toggleAllRows()\"\r\n [attr.aria-label]=\"intl.selectAllAriaLabel\"\r\n />\r\n </th>\r\n }\r\n\r\n <!-- Data Columns -->\r\n @for (header of processedHeaders(); track header.field) {\r\n <th\r\n scope=\"col\"\r\n [class]=\"getHeaderClasses(header)\"\r\n [ngStyle]=\"getHeaderStyles(header)\"\r\n [attr.aria-sort]=\"getAriaSortValue(header.field)\"\r\n >\r\n <div class=\"fui-advanced-data-table__header-content\">\r\n <span class=\"fui-advanced-data-table__header-label\">{{ header.label }}</span>\r\n\r\n @if (header.hasSort) {\r\n <button\r\n type=\"button\"\r\n class=\"fui-advanced-data-table__sort-button\"\r\n (click)=\"onSortClick(header.field)\"\r\n [attr.aria-label]=\"intl.sortAriaLabel(header.label)\"\r\n [fuiTooltip]=\"intl.sortTooltip\"\r\n fuiTooltipSize=\"sm\"\r\n fuiTooltipPosition=\"bottom\"\r\n >\r\n <svg\r\n [class]=\"getSortIconClasses(header.field)\"\r\n width=\"16\"\r\n height=\"16\"\r\n viewBox=\"0 0 16 16\"\r\n fill=\"currentColor\"\r\n >\r\n <path d=\"M8 3L12 7H4L8 3Z\" />\r\n <path d=\"M8 13L4 9H12L8 13Z\" />\r\n </svg>\r\n </button>\r\n }\r\n\r\n @if (header.hasFilter) {\r\n <button\r\n type=\"button\"\r\n class=\"fui-advanced-data-table__filter-button\"\r\n fuiMenuTrigger\r\n [menuTriggerFor]=\"filterMenu\"\r\n [menuTriggerData]=\"{ field: header.field, type: header.type }\"\r\n [attr.aria-label]=\"intl.filterAriaLabel(header.label)\"\r\n [fuiTooltip]=\"intl.filterTooltip\"\r\n fuiTooltipSize=\"sm\"\r\n fuiTooltipPosition=\"bottom\"\r\n >\r\n <svg\r\n [class]=\"getFilterIconClasses(header.field)\"\r\n width=\"16\"\r\n height=\"16\"\r\n viewBox=\"0 0 16 16\"\r\n fill=\"currentColor\"\r\n >\r\n <path d=\"M2 2L6 8V13L10 15V8L14 2H2Z\" />\r\n </svg>\r\n </button>\r\n\r\n <fui-menu\r\n #filterMenu\r\n position=\"bottom-end\"\r\n size=\"md\"\r\n (openChange)=\"$event && initFilterForm(header.field, header.type)\"\r\n [closeOnClickOutside]=\"true\"\r\n >\r\n <div class=\"fui-advanced-data-table__filter-menu-content\" (click)=\"$event.stopPropagation()\">\r\n <div class=\"fui-text-xs\">{{ header.label }}</div>\r\n @if (header.type !== 'label') {\r\n <!-- Operator Selection -->\r\n <fui-form-field [hideSubscript]=\"true\">\r\n <fui-select [(ngModel)]=\"tempFilterOperator\" [placeholder]=\"intl.selectOperatorPlaceholder\">\r\n @for (operator of getFilterOperators(header.type); track operator.value) {\r\n <fui-option [value]=\"operator.value\">\r\n {{ operator.label }}\r\n </fui-option>\r\n }\r\n </fui-select>\r\n </fui-form-field>\r\n\r\n <!-- Value Input(s) -->\r\n @if (requiresInput(header.type)) {\r\n <fui-form-field [hideSubscript]=\"true\">\r\n <input\r\n fuiInput\r\n [type]=\"header.type === 'number' ? 'number' : header.type === 'date' ? 'date' : 'text'\"\r\n [(ngModel)]=\"tempFilterValue\"\r\n [placeholder]=\"intl.enterValuePlaceholder\"\r\n />\r\n </fui-form-field>\r\n\r\n @if (requiresSecondInput(header.type)) {\r\n <fui-form-field [hideSubscript]=\"true\">\r\n <input\r\n fuiInput\r\n [type]=\"header.type === 'number' ? 'number' : header.type === 'date' ? 'date' : 'text'\"\r\n [(ngModel)]=\"tempFilterValue2\"\r\n [placeholder]=\"intl.enterFinalValuePlaceholder\"\r\n />\r\n </fui-form-field>\r\n }\r\n }\r\n } @else {\r\n <!-- Label filter: select dropdown -->\r\n <fui-form-field [hideSubscript]=\"true\">\r\n <fui-select [(ngModel)]=\"tempFilterValue\" [placeholder]=\"intl.selectValuePlaceholder\">\r\n @for (labelOpt of header.labels ?? []; track labelOpt.value) {\r\n <fui-option [value]=\"labelOpt.value\">\r\n {{ labelOpt.label }}\r\n </fui-option>\r\n }\r\n </fui-select>\r\n </fui-form-field>\r\n }\r\n\r\n <!-- Actions -->\r\n <div class=\"fui-advanced-data-table__filter-actions\">\r\n <button\r\n fuiButton\r\n variant=\"primary\"\r\n size=\"sm\"\r\n (click)=\"applyFilter(header.field, header.type, filterMenu)\"\r\n >\r\n {{ intl.applyButtonLabel }}\r\n </button>\r\n <button fuiButton variant=\"secondary\" size=\"sm\" (click)=\"clearFilter(header.field, filterMenu)\">\r\n {{ intl.clearButtonLabel }}\r\n </button>\r\n </div>\r\n </div>\r\n </fui-menu>\r\n }\r\n </div>\r\n </th>\r\n }\r\n </tr>\r\n </thead>\r\n\r\n <!-- Table Body -->\r\n <tbody class=\"fui-advanced-data-table__body\">\r\n @if (data().length === 0 && resolvedEmptyMessage()) {\r\n <tr class=\"fui-advanced-data-table__row fui-advanced-data-table__row--empty\">\r\n <td\r\n class=\"fui-advanced-data-table__cell fui-advanced-data-table__cell--empty\"\r\n [attr.colspan]=\"processedHeaders().length + (config().areRowsSelectable ? 1 : 0)\"\r\n >\r\n <div class=\"fui-advanced-data-table__empty-state\">\r\n <fui-icon\r\n name=\"magnifying-glass\"\r\n class=\"fui-advanced-data-table__empty-state-icon\"\r\n aria-hidden=\"true\"\r\n ></fui-icon>\r\n {{ resolvedEmptyMessage() }}\r\n </div>\r\n </td>\r\n </tr>\r\n } @else {\r\n @for (row of data(); track trackBy()($index, row)) {\r\n <tr\r\n (dblclick)=\"rowDblClick.emit(row)\"\r\n class=\"fui-advanced-data-table__row\"\r\n [class.fui-advanced-data-table__row--selected]=\"isRowSelected($index)\"\r\n [class.fui-advanced-data-table__row--highlighted]=\"isRowHighlighted($index)\"\r\n [class.fui-advanced-data-table__row--clickable]=\"enableRowHighlight()\"\r\n [attr.aria-selected]=\"config().areRowsSelectable ? isRowSelected($index) : null\"\r\n [attr.aria-rowindex]=\"$index + 2\"\r\n (click)=\"toggleRowHighlight($index)\"\r\n >\r\n <!-- Selection Checkbox -->\r\n @if (config().areRowsSelectable) {\r\n <td\r\n class=\"fui-advanced-data-table__cell fui-advanced-data-table__cell--checkbox\"\r\n [class.fui-advanced-data-table__cell--sticky-start]=\"\r\n processedHeaders()[0] && processedHeaders()[0].isStartSticky\r\n \"\r\n >\r\n <input\r\n type=\"checkbox\"\r\n class=\"fui-advanced-data-table__checkbox\"\r\n [checked]=\"isRowSelected($index)\"\r\n (change)=\"toggleRow($index)\"\r\n [attr.aria-label]=\"intl.selectRowAriaLabel($index + 1)\"\r\n />\r\n </td>\r\n }\r\n\r\n <!-- Data Cells -->\r\n @for (header of processedHeaders(); track header.field) {\r\n <td [class]=\"getCellClasses(header)\" [ngStyle]=\"getCellStyles(header)\">\r\n @if (header.type === 'boolean') {\r\n @if (getCellValue(row, header.field)) {\r\n <fui-icon name=\"check-circle\" class=\"fui-advanced-data-table__bool-icon--true\"></fui-icon>\r\n } @else {\r\n <fui-icon name=\"x-circle\" class=\"fui-advanced-data-table__bool-icon--false\"></fui-icon>\r\n }\r\n } @else if (header.type === 'label') {\r\n @let labelConfig = getLabelConfig(getCellValue(row, header.field), header.labels ?? []);\r\n @if (labelConfig) {\r\n <fui-badge\r\n [label]=\"labelConfig.label\"\r\n [customColor]=\"labelConfig.color\"\r\n [icon]=\"labelConfig.icon ?? null\"\r\n size=\"sm\"\r\n />\r\n } @else {\r\n <fui-badge [label]=\"'' + getCellValue(row, header.field)\" variant=\"info\" size=\"sm\" />\r\n }\r\n } @else {\r\n {{ formatCellValue(getCellValue(row, header.field), header.type) }}\r\n }\r\n </td>\r\n }\r\n </tr>\r\n }\r\n }\r\n </tbody>\r\n </table>\r\n</div>\r\n", styles: ["@keyframes fui-skeleton-pulse{0%{opacity:1}50%{opacity:.4}to{opacity:1}}@keyframes fui-spin{to{transform:rotate(360deg)}}@keyframes fui-shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-2px)}20%,40%,60%,80%{transform:translate(2px)}}.fui-motion-fade-in{transition:opacity var(--fui-duration-fast-02) var(--fui-ease-entrance) 0ms}.fui-motion-fade-out{transition:opacity var(--fui-duration-fast-01) var(--fui-ease-exit) 0ms}.fui-motion-slide-in-bottom{transition:transform var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:translateY(0)}.fui-motion-slide-in-bottom.fui-motion-entering{transform:translateY(1rem)}.fui-motion-slide-in-top{transition:transform var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:translateY(0)}.fui-motion-slide-in-top.fui-motion-entering{transform:translateY(-1rem)}.fui-motion-scale-in{transition:transform,opacity var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:scale(1);opacity:1}.fui-motion-scale-in.fui-motion-entering{transform:scale(.95);opacity:0}.fui-no-motion{transition:none!important;animation:none!important}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@keyframes fui-pulse{0%{transform:scale(1);opacity:1}50%{transform:scale(1.05)}to{transform:scale(1);opacity:1}}@keyframes fui-slide-in{0%{transform:translate(120%)}to{transform:translate(0)}}.fui-slide-in{animation:fui-slide-in var(--fui-duration-moderate-01) var(--fui-ease-entrance)}@keyframes fui-popover-enter{0%{opacity:0;transform:translateY(-14px)}60%{opacity:1}to{opacity:1;transform:translateY(0)}}.fui-advanced-data-table{--fui-table-font-size: var(--fui-font-size-sm, .875rem);--fui-table-header-bg: var(--fui-surface-01);--fui-table-row-bg: var(--fui-surface-00);--fui-table-row-hover-bg: var(--fui-surface-02);--fui-table-row-height: 3rem;--fui-table-cell-padding-y: .5rem;--fui-table-cell-padding-x: 1rem;--fui-table-border-color: var(--fui-border-color);display:block;width:100%;position:relative}.fui-advanced-data-table__wrapper{width:100%;overflow-x:auto;overflow-y:visible;position:relative}.fui-advanced-data-table__wrapper::-webkit-scrollbar{height:8px}.fui-advanced-data-table__wrapper::-webkit-scrollbar-track{background:var(--fui-surface-01);border-radius:var(--fui-border-radius-sm)}.fui-advanced-data-table__wrapper::-webkit-scrollbar-thumb{background:var(--fui-border-color);border-radius:var(--fui-border-radius-sm)}.fui-advanced-data-table__wrapper::-webkit-scrollbar-thumb:hover{background:var(--fui-text-secondary)}.fui-advanced-data-table__table{width:100%;border-collapse:separate;border-spacing:0;font-family:var(--fui-font-family-sans);font-size:var(--fui-table-font-size);color:var(--fui-text-primary);background-color:var(--fui-table-row-bg)}.fui-advanced-data-table__header{background-color:var(--fui-table-header-bg);border-bottom:1px solid var(--fui-table-border-color)}.fui-advanced-data-table__header--sticky{position:sticky;top:0;z-index:10}.fui-advanced-data-table__header-row{height:var(--fui-table-row-height)}.fui-advanced-data-table__header-row .formaui-advanced-data-table__header-cell:last-child{border-right:none}.fui-advanced-data-table__header-cell{padding:var(--fui-table-cell-padding-y) var(--fui-table-cell-padding-x);text-align:left;font-weight:var(--fui-font-weight-semibold, 600);color:var(--fui-text-secondary);background-color:var(--fui-table-header-bg);border-right:1px solid var(--fui-border-color);border-bottom:1px solid var(--fui-border-color);white-space:nowrap;-webkit-user-select:none;user-select:none;position:relative;box-shadow:0 1.19px 3.57px #1018281a}.fui-advanced-data-table__header-cell--checkbox{width:48px;min-width:48px;max-width:48px;padding:.5rem;text-align:center}.fui-advanced-data-table__header-cell--sticky-start{position:sticky;z-index:11;background-color:var(--fui-surface-01)}.fui-advanced-data-table__header-cell--sticky-start-edge:after{content:\"\";position:absolute;top:0;right:0;bottom:0;width:1px;background:linear-gradient(to right,var(--fui-border-color),transparent);pointer-events:none}.fui-advanced-data-table__header-cell--sticky-end{position:sticky;z-index:11;background-color:var(--fui-surface-01)}.fui-advanced-data-table__header-cell--sticky-end-edge:before{content:\"\";position:absolute;top:0;left:0;bottom:0;width:1px;background:linear-gradient(to left,var(--fui-border-color),transparent);pointer-events:none}.fui-advanced-data-table__header-content{display:flex;align-items:center;gap:.25rem}.fui-advanced-data-table__header-label{flex:1;overflow:hidden;text-overflow:ellipsis}.fui-advanced-data-table__sort-button,.fui-advanced-data-table__filter-button{display:inline-flex;align-items:center;justify-content:center;padding:.125rem;border:none;background:transparent;color:var(--fui-text-secondary);cursor:pointer;border-radius:var(--fui-border-radius-sm);transition:all var(--fui-duration-fast-02, .15s) var(--fui-ease-standard) 0ms}.fui-advanced-data-table__sort-button:hover,.fui-advanced-data-table__filter-button:hover{color:var(--fui-text-primary);background-color:var(--fui-surface-02)}.fui-advanced-data-table__sort-button:focus-visible,.fui-advanced-data-table__filter-button:focus-visible{outline:2px solid var(--fui-primary);outline-offset:2px}.fui-advanced-data-table__sort-icon,.fui-advanced-data-table__filter-icon{width:16px;height:16px}.fui-advanced-data-table__sort-icon{opacity:.6;transition:opacity var(--fui-duration-fast-01, .1s) var(--fui-ease-standard) 0ms}.fui-advanced-data-table__sort-icon path{transition:opacity var(--fui-duration-fast-01, .1s) var(--fui-ease-standard) 0ms}.fui-advanced-data-table__sort-icon--asc{opacity:1;color:var(--fui-primary)}.fui-advanced-data-table__sort-icon--asc path:first-child{opacity:1}.fui-advanced-data-table__sort-icon--asc path:last-child{opacity:.3}.fui-advanced-data-table__sort-icon--desc{opacity:1;color:var(--fui-primary)}.fui-advanced-data-table__sort-icon--desc path:first-child{opacity:.3}.fui-advanced-data-table__sort-icon--desc path:last-child{opacity:1}.fui-advanced-data-table__filter-icon{opacity:.6;transition:all var(--fui-duration-fast-01, .1s) var(--fui-ease-standard) 0ms}.fui-advanced-data-table__filter-icon--active{opacity:1;color:var(--fui-primary)}.fui-advanced-data-table__filter-menu-content{display:flex;flex-direction:column;gap:.75rem;padding:.75rem;min-width:280px}.fui-advanced-data-table__filter-select{width:100%}.fui-advanced-data-table__filter-actions{display:flex;gap:.25rem;justify-content:flex-end;margin-top:.25rem}.fui-advanced-data-table__body{background-color:var(--fui-surface-00)}.fui-advanced-data-table__row{height:var(--fui-table-row-height);background-color:var(--fui-table-row-bg);border-bottom:1px solid var(--fui-table-border-color);transition:background-color var(--fui-duration-fast-01, .1s) var(--fui-ease-standard) 0ms}.fui-advanced-data-table__row:hover{background-color:var(--fui-table-row-hover-bg)}.fui-advanced-data-table__row--clickable{cursor:pointer}.fui-advanced-data-table__row--selected{background-color:var(--fui-primary-10)}.fui-advanced-data-table__row--selected:hover,.fui-advanced-data-table__row--highlighted,.fui-advanced-data-table__row--highlighted:hover{background-color:var(--fui-primary-20)}.fui-advanced-data-table__row--empty{height:auto}.fui-advanced-data-table__row--empty:hover{background-color:transparent}.fui-advanced-data-table__row .formaui-advanced-data-table__cell:last-child{border-right:none}.fui-advanced-data-table__cell{padding:var(--fui-table-cell-padding-y) var(--fui-table-cell-padding-x);color:var(--fui-text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:300px;position:relative;border-bottom:1px solid var(--fui-table-border-color);border-right:1px solid var(--fui-table-border-color)}.fui-advanced-data-table__cell--checkbox{width:48px;min-width:48px;max-width:48px;padding:.5rem;text-align:center}.fui-advanced-data-table__cell--empty{padding:2.5rem 1rem;text-align:center;color:var(--fui-text-secondary);white-space:normal;border-bottom:none}.fui-advanced-data-table__cell--sticky-start{position:sticky;z-index:9;background-color:inherit}.fui-advanced-data-table__cell--sticky-start-edge:after{content:\"\";position:absolute;top:0;right:0;bottom:0;width:1px;background:linear-gradient(to right,var(--fui-border-color),transparent);pointer-events:none}.fui-advanced-data-table__cell--sticky-end{position:sticky;z-index:9;background-color:inherit}.fui-advanced-data-table__cell--sticky-end-edge:before{content:\"\";position:absolute;top:0;left:0;bottom:0;width:1px;background:linear-gradient(to left,var(--fui-border-color),transparent);pointer-events:none}.fui-advanced-data-table__checkbox{width:18px;height:18px;cursor:pointer;accent-color:var(--fui-primary)}.fui-advanced-data-table__checkbox:focus-visible{outline:2px solid var(--fui-primary);outline-offset:2px}.fui-advanced-data-table__empty-state{padding:2.5rem;text-align:center;color:var(--fui-text-secondary);font-size:var(--fui-font-size-md, 1rem);display:flex;flex-direction:column;align-items:center;gap:.75rem}.fui-advanced-data-table__empty-state-icon{font-size:var(--fui-font-size-09);color:var(--fui-text-secondary);opacity:.5}.fui-advanced-data-table__bool-icon--true{color:var(--fui-success)}.fui-advanced-data-table__bool-icon--false{color:var(--fui-danger)}@media(max-width:768px){.fui-advanced-data-table__table{font-size:var(--fui-font-size-xs, .75rem)}.fui-advanced-data-table__header-cell,.fui-advanced-data-table__cell{padding:.25rem .5rem;max-width:200px}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: FuiFormFieldComponent, selector: "fui-form-field", inputs: ["readOnly", "appearance", "hideRequiredMarker", "hideSubscript"] }, { kind: "directive", type: FuiInputDirective, selector: "input[fuiInput], textarea[fuiInput], select[fuiInput]", inputs: ["type", "placeholder", "readonly", "maxlength", "minlength", "pattern", "errorStateMatcher", "disabledInput"], outputs: ["valueChange"] }, { kind: "directive", type: FuiButtonDirective, selector: "button[fuiButton], a[fuiButton]", inputs: ["variant", "size", "disabled", "fullWidth", "loading", "iconOnly", "aria-label", "type"] }, { kind: "component", type: FuiMenuComponent, selector: "fui-menu", inputs: ["position", "size", "closeOnClickOutside", "closeOnEscape", "disabled", "attachToBody"], outputs: ["openChange", "itemSelected"] }, { kind: "directive", type: FuiMenuTriggerDirective, selector: "[fuiMenuTrigger]", inputs: ["menuTriggerFor", "menuTriggerData"] }, { kind: "component", type: FuiSelectComponent, selector: "fui-select", inputs: ["placeholder", "disabled", "readonly", "multiple", "errorStateMatcher", "compareWith"], outputs: ["valueChange", "selectionChange", "openedChange"] }, { kind: "component", type: FuiOptionComponent, selector: "fui-option", inputs: ["value", "disabled"], outputs: ["selectionChange"] }, { kind: "directive", type: FuiTooltipDirective, selector: "[fuiTooltip]", inputs: ["fuiTooltip", "fuiTooltipPosition", "fuiTooltipSize", "fuiTooltipTrigger", "fuiTooltipShowDelay", "fuiTooltipHideDelay", "fuiTooltipDisabled", "fuiTooltipMaxWidth", "fuiTooltipOffset", "fuiTooltipArrow", "fuiTooltipShow"] }, { kind: "component", type: FuiIconComponent, selector: "fui-icon", inputs: ["name", "size", "weight", "color", "ariaLabel", "spin", "pulse"] }, { kind: "component", type: FuiBadgeComponent, selector: "fui-badge", inputs: ["label", "icon", "customColor", "size", "variant", "ariaLabel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
602
660
  }
603
661
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: FuiAdvancedDataTableComponent, decorators: [{
604
662
  type: Component,
@@ -617,8 +675,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImpor
617
675
  FuiBadgeComponent,
618
676
  ], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
619
677
  class: 'fui-advanced-data-table',
620
- }, template: "<div class=\"fui-advanced-data-table__wrapper\">\r\n <!-- Live region for sort/filter announcements -->\r\n <div class=\"fui-sr-only\" aria-live=\"polite\" aria-atomic=\"true\" #liveAnnouncer></div>\r\n <table\r\n class=\"fui-advanced-data-table__table\"\r\n role=\"grid\"\r\n [attr.aria-label]=\"tableAriaLabel()\"\r\n [attr.aria-rowcount]=\"data().length\"\r\n >\r\n <!-- Table Header -->\r\n <thead\r\n class=\"fui-advanced-data-table__header\"\r\n [class.fui-advanced-data-table__header--sticky]=\"config().headerSticky\"\r\n >\r\n <tr class=\"fui-advanced-data-table__header-row\">\r\n <!-- Selection Checkbox Column -->\r\n @if (config().areRowsSelectable) {\r\n <th\r\n scope=\"col\"\r\n class=\"fui-advanced-data-table__header-cell fui-advanced-data-table__header-cell--checkbox\"\r\n [class.fui-advanced-data-table__header-cell--sticky-start]=\"\r\n processedHeaders()[0] && processedHeaders()[0].isStartSticky\r\n \"\r\n >\r\n <input\r\n type=\"checkbox\"\r\n class=\"fui-advanced-data-table__checkbox\"\r\n [checked]=\"allRowsSelected()\"\r\n [indeterminate]=\"someRowsSelected()\"\r\n (change)=\"toggleAllRows()\"\r\n aria-label=\"Select all rows\"\r\n />\r\n </th>\r\n }\r\n\r\n <!-- Data Columns -->\r\n @for (header of processedHeaders(); track header.field) {\r\n <th\r\n scope=\"col\"\r\n [class]=\"getHeaderClasses(header)\"\r\n [ngStyle]=\"getHeaderStyles(header)\"\r\n [attr.aria-sort]=\"getAriaSortValue(header.field)\"\r\n >\r\n <div class=\"fui-advanced-data-table__header-content\">\r\n <span class=\"fui-advanced-data-table__header-label\">{{ header.label }}</span>\r\n\r\n @if (header.hasSort) {\r\n <button\r\n type=\"button\"\r\n class=\"fui-advanced-data-table__sort-button\"\r\n (click)=\"onSortClick(header.field)\"\r\n [attr.aria-label]=\"'Sort by ' + header.label\"\r\n fuiTooltip=\"Ordina\"\r\n fuiTooltipSize=\"sm\"\r\n fuiTooltipPosition=\"bottom\"\r\n >\r\n <svg\r\n [class]=\"getSortIconClasses(header.field)\"\r\n width=\"16\"\r\n height=\"16\"\r\n viewBox=\"0 0 16 16\"\r\n fill=\"currentColor\"\r\n >\r\n <path d=\"M8 3L12 7H4L8 3Z\" />\r\n <path d=\"M8 13L4 9H12L8 13Z\" />\r\n </svg>\r\n </button>\r\n }\r\n\r\n @if (header.hasFilter) {\r\n <button\r\n type=\"button\"\r\n class=\"fui-advanced-data-table__filter-button\"\r\n fuiMenuTrigger\r\n [menuTriggerFor]=\"filterMenu\"\r\n [menuTriggerData]=\"{ field: header.field, type: header.type }\"\r\n [attr.aria-label]=\"'Filter ' + header.label\"\r\n fuiTooltip=\"Filtra\"\r\n fuiTooltipSize=\"sm\"\r\n fuiTooltipPosition=\"bottom\"\r\n >\r\n <svg\r\n [class]=\"getFilterIconClasses(header.field)\"\r\n width=\"16\"\r\n height=\"16\"\r\n viewBox=\"0 0 16 16\"\r\n fill=\"currentColor\"\r\n >\r\n <path d=\"M2 2L6 8V13L10 15V8L14 2H2Z\" />\r\n </svg>\r\n </button>\r\n\r\n <fui-menu\r\n #filterMenu\r\n position=\"bottom-end\"\r\n size=\"md\"\r\n (openChange)=\"$event && initFilterForm(header.field, header.type)\"\r\n [closeOnClickOutside]=\"true\"\r\n >\r\n <div class=\"fui-advanced-data-table__filter-menu-content\" (click)=\"$event.stopPropagation()\">\r\n <div class=\"fui-text-xs\">{{ header.label }}</div>\r\n @if (header.type !== 'label') {\r\n <!-- Operator Selection -->\r\n <fui-form-field [hideSubscript]=\"true\">\r\n <fui-select [(ngModel)]=\"tempFilterOperator\" placeholder=\"Seleziona operatore\">\r\n @for (operator of getFilterOperators(header.type); track operator.value) {\r\n <fui-option [value]=\"operator.value\">\r\n {{ operator.label }}\r\n </fui-option>\r\n }\r\n </fui-select>\r\n </fui-form-field>\r\n\r\n <!-- Value Input(s) -->\r\n @if (requiresInput(header.type)) {\r\n <fui-form-field [hideSubscript]=\"true\">\r\n <input\r\n fuiInput\r\n [type]=\"header.type === 'number' ? 'number' : header.type === 'date' ? 'date' : 'text'\"\r\n [(ngModel)]=\"tempFilterValue\"\r\n placeholder=\"Inserisci valore\"\r\n />\r\n </fui-form-field>\r\n\r\n @if (requiresSecondInput(header.type)) {\r\n <fui-form-field [hideSubscript]=\"true\">\r\n <input\r\n fuiInput\r\n [type]=\"header.type === 'number' ? 'number' : header.type === 'date' ? 'date' : 'text'\"\r\n [(ngModel)]=\"tempFilterValue2\"\r\n placeholder=\"Inserisci valore finale\"\r\n />\r\n </fui-form-field>\r\n }\r\n }\r\n } @else {\r\n <!-- Label filter: select dropdown -->\r\n <fui-form-field [hideSubscript]=\"true\">\r\n <fui-select [(ngModel)]=\"tempFilterValue\" placeholder=\"Seleziona valore\">\r\n @for (labelOpt of header.labels ?? []; track labelOpt.value) {\r\n <fui-option [value]=\"labelOpt.value\">\r\n {{ labelOpt.label }}\r\n </fui-option>\r\n }\r\n </fui-select>\r\n </fui-form-field>\r\n }\r\n\r\n <!-- Actions -->\r\n <div class=\"fui-advanced-data-table__filter-actions\">\r\n <button\r\n fuiButton\r\n variant=\"primary\"\r\n size=\"sm\"\r\n (click)=\"applyFilter(header.field, header.type, filterMenu)\"\r\n >\r\n Applica\r\n </button>\r\n <button fuiButton variant=\"outline\" size=\"sm\" (click)=\"clearFilter(header.field, filterMenu)\">\r\n Pulisci\r\n </button>\r\n </div>\r\n </div>\r\n </fui-menu>\r\n }\r\n </div>\r\n </th>\r\n }\r\n </tr>\r\n </thead>\r\n\r\n <!-- Table Body -->\r\n <tbody class=\"fui-advanced-data-table__body\">\r\n @if (data().length === 0 && emptyMessage()) {\r\n <tr class=\"fui-advanced-data-table__row fui-advanced-data-table__row--empty\">\r\n <td\r\n class=\"fui-advanced-data-table__cell fui-advanced-data-table__cell--empty\"\r\n [attr.colspan]=\"processedHeaders().length + (config().areRowsSelectable ? 1 : 0)\"\r\n >\r\n <div class=\"fui-advanced-data-table__empty-state\">\r\n <fui-icon\r\n name=\"magnifying-glass\"\r\n class=\"fui-advanced-data-table__empty-state-icon\"\r\n aria-hidden=\"true\"\r\n ></fui-icon>\r\n {{ emptyMessage() }}\r\n </div>\r\n </td>\r\n </tr>\r\n } @else {\r\n @for (row of data(); track trackBy()($index, row)) {\r\n <tr\r\n (dblclick)=\"rowDblClick.emit(row)\"\r\n class=\"fui-advanced-data-table__row\"\r\n [class.fui-advanced-data-table__row--selected]=\"isRowSelected($index)\"\r\n [class.fui-advanced-data-table__row--highlighted]=\"isRowHighlighted($index)\"\r\n [class.fui-advanced-data-table__row--clickable]=\"enableRowHighlight()\"\r\n [attr.aria-selected]=\"config().areRowsSelectable ? isRowSelected($index) : null\"\r\n [attr.aria-rowindex]=\"$index + 2\"\r\n (click)=\"toggleRowHighlight($index)\"\r\n >\r\n <!-- Selection Checkbox -->\r\n @if (config().areRowsSelectable) {\r\n <td\r\n class=\"fui-advanced-data-table__cell fui-advanced-data-table__cell--checkbox\"\r\n [class.fui-advanced-data-table__cell--sticky-start]=\"\r\n processedHeaders()[0] && processedHeaders()[0].isStartSticky\r\n \"\r\n >\r\n <input\r\n type=\"checkbox\"\r\n class=\"fui-advanced-data-table__checkbox\"\r\n [checked]=\"isRowSelected($index)\"\r\n (change)=\"toggleRow($index)\"\r\n [attr.aria-label]=\"'Select row ' + ($index + 1)\"\r\n />\r\n </td>\r\n }\r\n\r\n <!-- Data Cells -->\r\n @for (header of processedHeaders(); track header.field) {\r\n <td [class]=\"getCellClasses(header)\" [ngStyle]=\"getCellStyles(header)\">\r\n @if (header.type === 'boolean') {\r\n @if (getCellValue(row, header.field)) {\r\n <fui-icon name=\"check-circle\" class=\"fui-advanced-data-table__bool-icon--true\"></fui-icon>\r\n } @else {\r\n <fui-icon name=\"x-circle\" class=\"fui-advanced-data-table__bool-icon--false\"></fui-icon>\r\n }\r\n } @else if (header.type === 'label') {\r\n @let labelConfig = getLabelConfig(getCellValue(row, header.field), header.labels ?? []);\r\n @if (labelConfig) {\r\n <fui-badge\r\n [label]=\"labelConfig.label\"\r\n [customColor]=\"labelConfig.color\"\r\n [icon]=\"labelConfig.icon ?? null\"\r\n size=\"sm\"\r\n />\r\n } @else {\r\n <fui-badge [label]=\"'' + getCellValue(row, header.field)\" variant=\"info\" size=\"sm\" />\r\n }\r\n } @else {\r\n {{ formatCellValue(getCellValue(row, header.field), header.type) }}\r\n }\r\n </td>\r\n }\r\n </tr>\r\n }\r\n }\r\n </tbody>\r\n </table>\r\n</div>\r\n", styles: ["@keyframes fui-skeleton-pulse{0%{opacity:1}50%{opacity:.4}to{opacity:1}}@keyframes fui-spin{to{transform:rotate(360deg)}}@keyframes fui-shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-2px)}20%,40%,60%,80%{transform:translate(2px)}}.fui-motion-fade-in{transition:opacity var(--fui-duration-fast-02) var(--fui-ease-entrance) 0ms}.fui-motion-fade-out{transition:opacity var(--fui-duration-fast-01) var(--fui-ease-exit) 0ms}.fui-motion-slide-in-bottom{transition:transform var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:translateY(0)}.fui-motion-slide-in-bottom.fui-motion-entering{transform:translateY(1rem)}.fui-motion-slide-in-top{transition:transform var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:translateY(0)}.fui-motion-slide-in-top.fui-motion-entering{transform:translateY(-1rem)}.fui-motion-scale-in{transition:transform,opacity var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:scale(1);opacity:1}.fui-motion-scale-in.fui-motion-entering{transform:scale(.95);opacity:0}.fui-no-motion{transition:none!important;animation:none!important}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@keyframes fui-pulse{0%{transform:scale(1);opacity:1}50%{transform:scale(1.05)}to{transform:scale(1);opacity:1}}@keyframes fui-slide-in{0%{transform:translate(120%)}to{transform:translate(0)}}.fui-slide-in{animation:fui-slide-in var(--fui-duration-moderate-01) var(--fui-ease-entrance)}.fui-advanced-data-table{--fui-table-font-size: var(--fui-font-size-sm, .875rem);--fui-table-header-bg: var(--fui-surface-01);--fui-table-row-bg: var(--fui-surface-00);--fui-table-row-hover-bg: var(--fui-surface-02);--fui-table-row-height: 3rem;--fui-table-cell-padding-y: .5rem;--fui-table-cell-padding-x: 1rem;--fui-table-border-color: var(--fui-border-color);display:block;width:100%;position:relative}.fui-advanced-data-table__wrapper{width:100%;overflow-x:auto;overflow-y:visible;position:relative}.fui-advanced-data-table__wrapper::-webkit-scrollbar{height:8px}.fui-advanced-data-table__wrapper::-webkit-scrollbar-track{background:var(--fui-surface-01);border-radius:var(--fui-border-radius-sm)}.fui-advanced-data-table__wrapper::-webkit-scrollbar-thumb{background:var(--fui-border-color);border-radius:var(--fui-border-radius-sm)}.fui-advanced-data-table__wrapper::-webkit-scrollbar-thumb:hover{background:var(--fui-text-secondary)}.fui-advanced-data-table__table{width:100%;border-collapse:separate;border-spacing:0;font-family:var(--fui-font-family-sans);font-size:var(--fui-table-font-size);color:var(--fui-text-primary);background-color:var(--fui-table-row-bg)}.fui-advanced-data-table__header{background-color:var(--fui-table-header-bg);border-bottom:1px solid var(--fui-table-border-color)}.fui-advanced-data-table__header--sticky{position:sticky;top:0;z-index:10}.fui-advanced-data-table__header-row{height:var(--fui-table-row-height)}.fui-advanced-data-table__header-row .formaui-advanced-data-table__header-cell:last-child{border-right:none}.fui-advanced-data-table__header-cell{padding:var(--fui-table-cell-padding-y) var(--fui-table-cell-padding-x);text-align:left;font-weight:var(--fui-font-weight-semibold, 600);color:var(--fui-text-secondary);background-color:var(--fui-table-header-bg);border-right:1px solid var(--fui-border-color);border-bottom:1px solid var(--fui-border-color);white-space:nowrap;-webkit-user-select:none;user-select:none;position:relative;box-shadow:0 1.19px 3.57px #1018281a}.fui-advanced-data-table__header-cell--checkbox{width:48px;min-width:48px;max-width:48px;padding:.5rem;text-align:center}.fui-advanced-data-table__header-cell--sticky-start{position:sticky;z-index:11;background-color:var(--fui-surface-01)}.fui-advanced-data-table__header-cell--sticky-start-edge:after{content:\"\";position:absolute;top:0;right:0;bottom:0;width:1px;background:linear-gradient(to right,var(--fui-border-color),transparent);pointer-events:none}.fui-advanced-data-table__header-cell--sticky-end{position:sticky;z-index:11;background-color:var(--fui-surface-01)}.fui-advanced-data-table__header-cell--sticky-end-edge:before{content:\"\";position:absolute;top:0;left:0;bottom:0;width:1px;background:linear-gradient(to left,var(--fui-border-color),transparent);pointer-events:none}.fui-advanced-data-table__header-content{display:flex;align-items:center;gap:.25rem}.fui-advanced-data-table__header-label{flex:1;overflow:hidden;text-overflow:ellipsis}.fui-advanced-data-table__sort-button,.fui-advanced-data-table__filter-button{display:inline-flex;align-items:center;justify-content:center;padding:.125rem;border:none;background:transparent;color:var(--fui-text-secondary);cursor:pointer;border-radius:var(--fui-border-radius-sm);transition:all var(--fui-duration-fast-02, .15s) var(--fui-ease-standard) 0ms}.fui-advanced-data-table__sort-button:hover,.fui-advanced-data-table__filter-button:hover{color:var(--fui-text-primary);background-color:var(--fui-surface-02)}.fui-advanced-data-table__sort-button:focus-visible,.fui-advanced-data-table__filter-button:focus-visible{outline:2px solid var(--fui-primary);outline-offset:2px}.fui-advanced-data-table__sort-icon,.fui-advanced-data-table__filter-icon{width:16px;height:16px}.fui-advanced-data-table__sort-icon{opacity:.6;transition:opacity var(--fui-duration-fast-01, .1s) var(--fui-ease-standard) 0ms}.fui-advanced-data-table__sort-icon path{transition:opacity var(--fui-duration-fast-01, .1s) var(--fui-ease-standard) 0ms}.fui-advanced-data-table__sort-icon--asc{opacity:1;color:var(--fui-primary)}.fui-advanced-data-table__sort-icon--asc path:first-child{opacity:1}.fui-advanced-data-table__sort-icon--asc path:last-child{opacity:.3}.fui-advanced-data-table__sort-icon--desc{opacity:1;color:var(--fui-primary)}.fui-advanced-data-table__sort-icon--desc path:first-child{opacity:.3}.fui-advanced-data-table__sort-icon--desc path:last-child{opacity:1}.fui-advanced-data-table__filter-icon{opacity:.6;transition:all var(--fui-duration-fast-01, .1s) var(--fui-ease-standard) 0ms}.fui-advanced-data-table__filter-icon--active{opacity:1;color:var(--fui-primary)}.fui-advanced-data-table__filter-menu-content{display:flex;flex-direction:column;gap:.75rem;padding:.75rem;min-width:280px}.fui-advanced-data-table__filter-select{width:100%}.fui-advanced-data-table__filter-actions{display:flex;gap:.25rem;justify-content:flex-end;margin-top:.25rem}.fui-advanced-data-table__body{background-color:var(--fui-surface-00)}.fui-advanced-data-table__row{height:var(--fui-table-row-height);background-color:var(--fui-table-row-bg);border-bottom:1px solid var(--fui-table-border-color);transition:background-color var(--fui-duration-fast-01, .1s) var(--fui-ease-standard) 0ms}.fui-advanced-data-table__row:hover{background-color:var(--fui-table-row-hover-bg)}.fui-advanced-data-table__row--clickable{cursor:pointer}.fui-advanced-data-table__row--selected{background-color:var(--fui-primary-10)}.fui-advanced-data-table__row--selected:hover,.fui-advanced-data-table__row--highlighted,.fui-advanced-data-table__row--highlighted:hover{background-color:var(--fui-primary-20)}.fui-advanced-data-table__row--empty{height:auto}.fui-advanced-data-table__row--empty:hover{background-color:transparent}.fui-advanced-data-table__row .formaui-advanced-data-table__cell:last-child{border-right:none}.fui-advanced-data-table__cell{padding:var(--fui-table-cell-padding-y) var(--fui-table-cell-padding-x);color:var(--fui-text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:300px;position:relative;border-bottom:1px solid var(--fui-table-border-color);border-right:1px solid var(--fui-table-border-color)}.fui-advanced-data-table__cell--checkbox{width:48px;min-width:48px;max-width:48px;padding:.5rem;text-align:center}.fui-advanced-data-table__cell--empty{padding:2.5rem 1rem;text-align:center;color:var(--fui-text-secondary);white-space:normal;border-bottom:none}.fui-advanced-data-table__cell--sticky-start{position:sticky;z-index:9;background-color:inherit}.fui-advanced-data-table__cell--sticky-start-edge:after{content:\"\";position:absolute;top:0;right:0;bottom:0;width:1px;background:linear-gradient(to right,var(--fui-border-color),transparent);pointer-events:none}.fui-advanced-data-table__cell--sticky-end{position:sticky;z-index:9;background-color:inherit}.fui-advanced-data-table__cell--sticky-end-edge:before{content:\"\";position:absolute;top:0;left:0;bottom:0;width:1px;background:linear-gradient(to left,var(--fui-border-color),transparent);pointer-events:none}.fui-advanced-data-table__checkbox{width:18px;height:18px;cursor:pointer;accent-color:var(--fui-primary)}.fui-advanced-data-table__checkbox:focus-visible{outline:2px solid var(--fui-primary);outline-offset:2px}.fui-advanced-data-table__empty-state{padding:2.5rem;text-align:center;color:var(--fui-text-secondary);font-size:var(--fui-font-size-md, 1rem);display:flex;flex-direction:column;align-items:center;gap:.75rem}.fui-advanced-data-table__empty-state-icon{font-size:var(--fui-font-size-09);color:var(--fui-text-secondary);opacity:.5}.fui-advanced-data-table__bool-icon--true{color:var(--fui-success)}.fui-advanced-data-table__bool-icon--false{color:var(--fui-danger)}@media(max-width:768px){.fui-advanced-data-table__table{font-size:var(--fui-font-size-xs, .75rem)}.fui-advanced-data-table__header-cell,.fui-advanced-data-table__cell{padding:.25rem .5rem;max-width:200px}}\n"] }]
621
- }], propDecorators: { config: [{ type: i0.Input, args: [{ isSignal: true, alias: "config", required: true }] }], data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: false }] }], trackBy: [{ type: i0.Input, args: [{ isSignal: true, alias: "trackBy", required: false }] }], enableRowHighlight: [{ type: i0.Input, args: [{ isSignal: true, alias: "enableRowHighlight", required: false }] }], tableAriaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "tableAriaLabel", required: false }] }], _liveAnnouncer: [{
678
+ }, template: "<div class=\"fui-advanced-data-table__wrapper\">\r\n <!-- Live region for sort/filter announcements -->\r\n <div class=\"fui-sr-only\" aria-live=\"polite\" aria-atomic=\"true\" #liveAnnouncer></div>\r\n <table\r\n class=\"fui-advanced-data-table__table\"\r\n role=\"grid\"\r\n [attr.aria-label]=\"resolvedTableAriaLabel()\"\r\n [attr.aria-rowcount]=\"data().length\"\r\n >\r\n <!-- Table Header -->\r\n <thead\r\n class=\"fui-advanced-data-table__header\"\r\n [class.fui-advanced-data-table__header--sticky]=\"config().headerSticky\"\r\n >\r\n <tr class=\"fui-advanced-data-table__header-row\">\r\n <!-- Selection Checkbox Column -->\r\n @if (config().areRowsSelectable) {\r\n <th\r\n scope=\"col\"\r\n class=\"fui-advanced-data-table__header-cell fui-advanced-data-table__header-cell--checkbox\"\r\n [class.fui-advanced-data-table__header-cell--sticky-start]=\"\r\n processedHeaders()[0] && processedHeaders()[0].isStartSticky\r\n \"\r\n >\r\n <input\r\n type=\"checkbox\"\r\n class=\"fui-advanced-data-table__checkbox\"\r\n [checked]=\"allRowsSelected()\"\r\n [indeterminate]=\"someRowsSelected()\"\r\n (change)=\"toggleAllRows()\"\r\n [attr.aria-label]=\"intl.selectAllAriaLabel\"\r\n />\r\n </th>\r\n }\r\n\r\n <!-- Data Columns -->\r\n @for (header of processedHeaders(); track header.field) {\r\n <th\r\n scope=\"col\"\r\n [class]=\"getHeaderClasses(header)\"\r\n [ngStyle]=\"getHeaderStyles(header)\"\r\n [attr.aria-sort]=\"getAriaSortValue(header.field)\"\r\n >\r\n <div class=\"fui-advanced-data-table__header-content\">\r\n <span class=\"fui-advanced-data-table__header-label\">{{ header.label }}</span>\r\n\r\n @if (header.hasSort) {\r\n <button\r\n type=\"button\"\r\n class=\"fui-advanced-data-table__sort-button\"\r\n (click)=\"onSortClick(header.field)\"\r\n [attr.aria-label]=\"intl.sortAriaLabel(header.label)\"\r\n [fuiTooltip]=\"intl.sortTooltip\"\r\n fuiTooltipSize=\"sm\"\r\n fuiTooltipPosition=\"bottom\"\r\n >\r\n <svg\r\n [class]=\"getSortIconClasses(header.field)\"\r\n width=\"16\"\r\n height=\"16\"\r\n viewBox=\"0 0 16 16\"\r\n fill=\"currentColor\"\r\n >\r\n <path d=\"M8 3L12 7H4L8 3Z\" />\r\n <path d=\"M8 13L4 9H12L8 13Z\" />\r\n </svg>\r\n </button>\r\n }\r\n\r\n @if (header.hasFilter) {\r\n <button\r\n type=\"button\"\r\n class=\"fui-advanced-data-table__filter-button\"\r\n fuiMenuTrigger\r\n [menuTriggerFor]=\"filterMenu\"\r\n [menuTriggerData]=\"{ field: header.field, type: header.type }\"\r\n [attr.aria-label]=\"intl.filterAriaLabel(header.label)\"\r\n [fuiTooltip]=\"intl.filterTooltip\"\r\n fuiTooltipSize=\"sm\"\r\n fuiTooltipPosition=\"bottom\"\r\n >\r\n <svg\r\n [class]=\"getFilterIconClasses(header.field)\"\r\n width=\"16\"\r\n height=\"16\"\r\n viewBox=\"0 0 16 16\"\r\n fill=\"currentColor\"\r\n >\r\n <path d=\"M2 2L6 8V13L10 15V8L14 2H2Z\" />\r\n </svg>\r\n </button>\r\n\r\n <fui-menu\r\n #filterMenu\r\n position=\"bottom-end\"\r\n size=\"md\"\r\n (openChange)=\"$event && initFilterForm(header.field, header.type)\"\r\n [closeOnClickOutside]=\"true\"\r\n >\r\n <div class=\"fui-advanced-data-table__filter-menu-content\" (click)=\"$event.stopPropagation()\">\r\n <div class=\"fui-text-xs\">{{ header.label }}</div>\r\n @if (header.type !== 'label') {\r\n <!-- Operator Selection -->\r\n <fui-form-field [hideSubscript]=\"true\">\r\n <fui-select [(ngModel)]=\"tempFilterOperator\" [placeholder]=\"intl.selectOperatorPlaceholder\">\r\n @for (operator of getFilterOperators(header.type); track operator.value) {\r\n <fui-option [value]=\"operator.value\">\r\n {{ operator.label }}\r\n </fui-option>\r\n }\r\n </fui-select>\r\n </fui-form-field>\r\n\r\n <!-- Value Input(s) -->\r\n @if (requiresInput(header.type)) {\r\n <fui-form-field [hideSubscript]=\"true\">\r\n <input\r\n fuiInput\r\n [type]=\"header.type === 'number' ? 'number' : header.type === 'date' ? 'date' : 'text'\"\r\n [(ngModel)]=\"tempFilterValue\"\r\n [placeholder]=\"intl.enterValuePlaceholder\"\r\n />\r\n </fui-form-field>\r\n\r\n @if (requiresSecondInput(header.type)) {\r\n <fui-form-field [hideSubscript]=\"true\">\r\n <input\r\n fuiInput\r\n [type]=\"header.type === 'number' ? 'number' : header.type === 'date' ? 'date' : 'text'\"\r\n [(ngModel)]=\"tempFilterValue2\"\r\n [placeholder]=\"intl.enterFinalValuePlaceholder\"\r\n />\r\n </fui-form-field>\r\n }\r\n }\r\n } @else {\r\n <!-- Label filter: select dropdown -->\r\n <fui-form-field [hideSubscript]=\"true\">\r\n <fui-select [(ngModel)]=\"tempFilterValue\" [placeholder]=\"intl.selectValuePlaceholder\">\r\n @for (labelOpt of header.labels ?? []; track labelOpt.value) {\r\n <fui-option [value]=\"labelOpt.value\">\r\n {{ labelOpt.label }}\r\n </fui-option>\r\n }\r\n </fui-select>\r\n </fui-form-field>\r\n }\r\n\r\n <!-- Actions -->\r\n <div class=\"fui-advanced-data-table__filter-actions\">\r\n <button\r\n fuiButton\r\n variant=\"primary\"\r\n size=\"sm\"\r\n (click)=\"applyFilter(header.field, header.type, filterMenu)\"\r\n >\r\n {{ intl.applyButtonLabel }}\r\n </button>\r\n <button fuiButton variant=\"secondary\" size=\"sm\" (click)=\"clearFilter(header.field, filterMenu)\">\r\n {{ intl.clearButtonLabel }}\r\n </button>\r\n </div>\r\n </div>\r\n </fui-menu>\r\n }\r\n </div>\r\n </th>\r\n }\r\n </tr>\r\n </thead>\r\n\r\n <!-- Table Body -->\r\n <tbody class=\"fui-advanced-data-table__body\">\r\n @if (data().length === 0 && resolvedEmptyMessage()) {\r\n <tr class=\"fui-advanced-data-table__row fui-advanced-data-table__row--empty\">\r\n <td\r\n class=\"fui-advanced-data-table__cell fui-advanced-data-table__cell--empty\"\r\n [attr.colspan]=\"processedHeaders().length + (config().areRowsSelectable ? 1 : 0)\"\r\n >\r\n <div class=\"fui-advanced-data-table__empty-state\">\r\n <fui-icon\r\n name=\"magnifying-glass\"\r\n class=\"fui-advanced-data-table__empty-state-icon\"\r\n aria-hidden=\"true\"\r\n ></fui-icon>\r\n {{ resolvedEmptyMessage() }}\r\n </div>\r\n </td>\r\n </tr>\r\n } @else {\r\n @for (row of data(); track trackBy()($index, row)) {\r\n <tr\r\n (dblclick)=\"rowDblClick.emit(row)\"\r\n class=\"fui-advanced-data-table__row\"\r\n [class.fui-advanced-data-table__row--selected]=\"isRowSelected($index)\"\r\n [class.fui-advanced-data-table__row--highlighted]=\"isRowHighlighted($index)\"\r\n [class.fui-advanced-data-table__row--clickable]=\"enableRowHighlight()\"\r\n [attr.aria-selected]=\"config().areRowsSelectable ? isRowSelected($index) : null\"\r\n [attr.aria-rowindex]=\"$index + 2\"\r\n (click)=\"toggleRowHighlight($index)\"\r\n >\r\n <!-- Selection Checkbox -->\r\n @if (config().areRowsSelectable) {\r\n <td\r\n class=\"fui-advanced-data-table__cell fui-advanced-data-table__cell--checkbox\"\r\n [class.fui-advanced-data-table__cell--sticky-start]=\"\r\n processedHeaders()[0] && processedHeaders()[0].isStartSticky\r\n \"\r\n >\r\n <input\r\n type=\"checkbox\"\r\n class=\"fui-advanced-data-table__checkbox\"\r\n [checked]=\"isRowSelected($index)\"\r\n (change)=\"toggleRow($index)\"\r\n [attr.aria-label]=\"intl.selectRowAriaLabel($index + 1)\"\r\n />\r\n </td>\r\n }\r\n\r\n <!-- Data Cells -->\r\n @for (header of processedHeaders(); track header.field) {\r\n <td [class]=\"getCellClasses(header)\" [ngStyle]=\"getCellStyles(header)\">\r\n @if (header.type === 'boolean') {\r\n @if (getCellValue(row, header.field)) {\r\n <fui-icon name=\"check-circle\" class=\"fui-advanced-data-table__bool-icon--true\"></fui-icon>\r\n } @else {\r\n <fui-icon name=\"x-circle\" class=\"fui-advanced-data-table__bool-icon--false\"></fui-icon>\r\n }\r\n } @else if (header.type === 'label') {\r\n @let labelConfig = getLabelConfig(getCellValue(row, header.field), header.labels ?? []);\r\n @if (labelConfig) {\r\n <fui-badge\r\n [label]=\"labelConfig.label\"\r\n [customColor]=\"labelConfig.color\"\r\n [icon]=\"labelConfig.icon ?? null\"\r\n size=\"sm\"\r\n />\r\n } @else {\r\n <fui-badge [label]=\"'' + getCellValue(row, header.field)\" variant=\"info\" size=\"sm\" />\r\n }\r\n } @else {\r\n {{ formatCellValue(getCellValue(row, header.field), header.type) }}\r\n }\r\n </td>\r\n }\r\n </tr>\r\n }\r\n }\r\n </tbody>\r\n </table>\r\n</div>\r\n", styles: ["@keyframes fui-skeleton-pulse{0%{opacity:1}50%{opacity:.4}to{opacity:1}}@keyframes fui-spin{to{transform:rotate(360deg)}}@keyframes fui-shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-2px)}20%,40%,60%,80%{transform:translate(2px)}}.fui-motion-fade-in{transition:opacity var(--fui-duration-fast-02) var(--fui-ease-entrance) 0ms}.fui-motion-fade-out{transition:opacity var(--fui-duration-fast-01) var(--fui-ease-exit) 0ms}.fui-motion-slide-in-bottom{transition:transform var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:translateY(0)}.fui-motion-slide-in-bottom.fui-motion-entering{transform:translateY(1rem)}.fui-motion-slide-in-top{transition:transform var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:translateY(0)}.fui-motion-slide-in-top.fui-motion-entering{transform:translateY(-1rem)}.fui-motion-scale-in{transition:transform,opacity var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:scale(1);opacity:1}.fui-motion-scale-in.fui-motion-entering{transform:scale(.95);opacity:0}.fui-no-motion{transition:none!important;animation:none!important}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@keyframes fui-pulse{0%{transform:scale(1);opacity:1}50%{transform:scale(1.05)}to{transform:scale(1);opacity:1}}@keyframes fui-slide-in{0%{transform:translate(120%)}to{transform:translate(0)}}.fui-slide-in{animation:fui-slide-in var(--fui-duration-moderate-01) var(--fui-ease-entrance)}@keyframes fui-popover-enter{0%{opacity:0;transform:translateY(-14px)}60%{opacity:1}to{opacity:1;transform:translateY(0)}}.fui-advanced-data-table{--fui-table-font-size: var(--fui-font-size-sm, .875rem);--fui-table-header-bg: var(--fui-surface-01);--fui-table-row-bg: var(--fui-surface-00);--fui-table-row-hover-bg: var(--fui-surface-02);--fui-table-row-height: 3rem;--fui-table-cell-padding-y: .5rem;--fui-table-cell-padding-x: 1rem;--fui-table-border-color: var(--fui-border-color);display:block;width:100%;position:relative}.fui-advanced-data-table__wrapper{width:100%;overflow-x:auto;overflow-y:visible;position:relative}.fui-advanced-data-table__wrapper::-webkit-scrollbar{height:8px}.fui-advanced-data-table__wrapper::-webkit-scrollbar-track{background:var(--fui-surface-01);border-radius:var(--fui-border-radius-sm)}.fui-advanced-data-table__wrapper::-webkit-scrollbar-thumb{background:var(--fui-border-color);border-radius:var(--fui-border-radius-sm)}.fui-advanced-data-table__wrapper::-webkit-scrollbar-thumb:hover{background:var(--fui-text-secondary)}.fui-advanced-data-table__table{width:100%;border-collapse:separate;border-spacing:0;font-family:var(--fui-font-family-sans);font-size:var(--fui-table-font-size);color:var(--fui-text-primary);background-color:var(--fui-table-row-bg)}.fui-advanced-data-table__header{background-color:var(--fui-table-header-bg);border-bottom:1px solid var(--fui-table-border-color)}.fui-advanced-data-table__header--sticky{position:sticky;top:0;z-index:10}.fui-advanced-data-table__header-row{height:var(--fui-table-row-height)}.fui-advanced-data-table__header-row .formaui-advanced-data-table__header-cell:last-child{border-right:none}.fui-advanced-data-table__header-cell{padding:var(--fui-table-cell-padding-y) var(--fui-table-cell-padding-x);text-align:left;font-weight:var(--fui-font-weight-semibold, 600);color:var(--fui-text-secondary);background-color:var(--fui-table-header-bg);border-right:1px solid var(--fui-border-color);border-bottom:1px solid var(--fui-border-color);white-space:nowrap;-webkit-user-select:none;user-select:none;position:relative;box-shadow:0 1.19px 3.57px #1018281a}.fui-advanced-data-table__header-cell--checkbox{width:48px;min-width:48px;max-width:48px;padding:.5rem;text-align:center}.fui-advanced-data-table__header-cell--sticky-start{position:sticky;z-index:11;background-color:var(--fui-surface-01)}.fui-advanced-data-table__header-cell--sticky-start-edge:after{content:\"\";position:absolute;top:0;right:0;bottom:0;width:1px;background:linear-gradient(to right,var(--fui-border-color),transparent);pointer-events:none}.fui-advanced-data-table__header-cell--sticky-end{position:sticky;z-index:11;background-color:var(--fui-surface-01)}.fui-advanced-data-table__header-cell--sticky-end-edge:before{content:\"\";position:absolute;top:0;left:0;bottom:0;width:1px;background:linear-gradient(to left,var(--fui-border-color),transparent);pointer-events:none}.fui-advanced-data-table__header-content{display:flex;align-items:center;gap:.25rem}.fui-advanced-data-table__header-label{flex:1;overflow:hidden;text-overflow:ellipsis}.fui-advanced-data-table__sort-button,.fui-advanced-data-table__filter-button{display:inline-flex;align-items:center;justify-content:center;padding:.125rem;border:none;background:transparent;color:var(--fui-text-secondary);cursor:pointer;border-radius:var(--fui-border-radius-sm);transition:all var(--fui-duration-fast-02, .15s) var(--fui-ease-standard) 0ms}.fui-advanced-data-table__sort-button:hover,.fui-advanced-data-table__filter-button:hover{color:var(--fui-text-primary);background-color:var(--fui-surface-02)}.fui-advanced-data-table__sort-button:focus-visible,.fui-advanced-data-table__filter-button:focus-visible{outline:2px solid var(--fui-primary);outline-offset:2px}.fui-advanced-data-table__sort-icon,.fui-advanced-data-table__filter-icon{width:16px;height:16px}.fui-advanced-data-table__sort-icon{opacity:.6;transition:opacity var(--fui-duration-fast-01, .1s) var(--fui-ease-standard) 0ms}.fui-advanced-data-table__sort-icon path{transition:opacity var(--fui-duration-fast-01, .1s) var(--fui-ease-standard) 0ms}.fui-advanced-data-table__sort-icon--asc{opacity:1;color:var(--fui-primary)}.fui-advanced-data-table__sort-icon--asc path:first-child{opacity:1}.fui-advanced-data-table__sort-icon--asc path:last-child{opacity:.3}.fui-advanced-data-table__sort-icon--desc{opacity:1;color:var(--fui-primary)}.fui-advanced-data-table__sort-icon--desc path:first-child{opacity:.3}.fui-advanced-data-table__sort-icon--desc path:last-child{opacity:1}.fui-advanced-data-table__filter-icon{opacity:.6;transition:all var(--fui-duration-fast-01, .1s) var(--fui-ease-standard) 0ms}.fui-advanced-data-table__filter-icon--active{opacity:1;color:var(--fui-primary)}.fui-advanced-data-table__filter-menu-content{display:flex;flex-direction:column;gap:.75rem;padding:.75rem;min-width:280px}.fui-advanced-data-table__filter-select{width:100%}.fui-advanced-data-table__filter-actions{display:flex;gap:.25rem;justify-content:flex-end;margin-top:.25rem}.fui-advanced-data-table__body{background-color:var(--fui-surface-00)}.fui-advanced-data-table__row{height:var(--fui-table-row-height);background-color:var(--fui-table-row-bg);border-bottom:1px solid var(--fui-table-border-color);transition:background-color var(--fui-duration-fast-01, .1s) var(--fui-ease-standard) 0ms}.fui-advanced-data-table__row:hover{background-color:var(--fui-table-row-hover-bg)}.fui-advanced-data-table__row--clickable{cursor:pointer}.fui-advanced-data-table__row--selected{background-color:var(--fui-primary-10)}.fui-advanced-data-table__row--selected:hover,.fui-advanced-data-table__row--highlighted,.fui-advanced-data-table__row--highlighted:hover{background-color:var(--fui-primary-20)}.fui-advanced-data-table__row--empty{height:auto}.fui-advanced-data-table__row--empty:hover{background-color:transparent}.fui-advanced-data-table__row .formaui-advanced-data-table__cell:last-child{border-right:none}.fui-advanced-data-table__cell{padding:var(--fui-table-cell-padding-y) var(--fui-table-cell-padding-x);color:var(--fui-text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:300px;position:relative;border-bottom:1px solid var(--fui-table-border-color);border-right:1px solid var(--fui-table-border-color)}.fui-advanced-data-table__cell--checkbox{width:48px;min-width:48px;max-width:48px;padding:.5rem;text-align:center}.fui-advanced-data-table__cell--empty{padding:2.5rem 1rem;text-align:center;color:var(--fui-text-secondary);white-space:normal;border-bottom:none}.fui-advanced-data-table__cell--sticky-start{position:sticky;z-index:9;background-color:inherit}.fui-advanced-data-table__cell--sticky-start-edge:after{content:\"\";position:absolute;top:0;right:0;bottom:0;width:1px;background:linear-gradient(to right,var(--fui-border-color),transparent);pointer-events:none}.fui-advanced-data-table__cell--sticky-end{position:sticky;z-index:9;background-color:inherit}.fui-advanced-data-table__cell--sticky-end-edge:before{content:\"\";position:absolute;top:0;left:0;bottom:0;width:1px;background:linear-gradient(to left,var(--fui-border-color),transparent);pointer-events:none}.fui-advanced-data-table__checkbox{width:18px;height:18px;cursor:pointer;accent-color:var(--fui-primary)}.fui-advanced-data-table__checkbox:focus-visible{outline:2px solid var(--fui-primary);outline-offset:2px}.fui-advanced-data-table__empty-state{padding:2.5rem;text-align:center;color:var(--fui-text-secondary);font-size:var(--fui-font-size-md, 1rem);display:flex;flex-direction:column;align-items:center;gap:.75rem}.fui-advanced-data-table__empty-state-icon{font-size:var(--fui-font-size-09);color:var(--fui-text-secondary);opacity:.5}.fui-advanced-data-table__bool-icon--true{color:var(--fui-success)}.fui-advanced-data-table__bool-icon--false{color:var(--fui-danger)}@media(max-width:768px){.fui-advanced-data-table__table{font-size:var(--fui-font-size-xs, .75rem)}.fui-advanced-data-table__header-cell,.fui-advanced-data-table__cell{padding:.25rem .5rem;max-width:200px}}\n"] }]
679
+ }], ctorParameters: () => [], propDecorators: { config: [{ type: i0.Input, args: [{ isSignal: true, alias: "config", required: true }] }], data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: false }] }], trackBy: [{ type: i0.Input, args: [{ isSignal: true, alias: "trackBy", required: false }] }], enableRowHighlight: [{ type: i0.Input, args: [{ isSignal: true, alias: "enableRowHighlight", required: false }] }], tableAriaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "tableAriaLabel", required: false }] }], _liveAnnouncer: [{
622
680
  type: ViewChild,
623
681
  args: ['liveAnnouncer']
624
682
  }], emptyMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyMessage", required: false }] }], sort: [{ type: i0.Input, args: [{ isSignal: true, alias: "sort", required: false }] }], sortChange: [{ type: i0.Output, args: ["sortChange"] }], filters: [{ type: i0.Input, args: [{ isSignal: true, alias: "filters", required: false }] }], filtersChange: [{ type: i0.Output, args: ["filtersChange"] }], rowDblClick: [{ type: i0.Output, args: ["rowDblClick"] }] } });
@@ -627,5 +685,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImpor
627
685
  * Generated bundle index. Do not edit.
628
686
  */
629
687
 
630
- export { FilterOperator, FuiAdvancedDataTableComponent };
688
+ export { FilterOperator, FuiAdvancedDataTableComponent, FuiDataTableIntl };
631
689
  //# sourceMappingURL=raintonic-formaui-components-data-table.mjs.map