@luzmo/analytics-components-kit 1.0.8-beta.6 → 1.0.8-beta.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (314) hide show
  1. package/components/index.cjs +1 -1
  2. package/components/index.js +1 -1
  3. package/components/viz-item-menu/index.cjs +1 -1
  4. package/components/viz-item-menu/index.js +1 -1
  5. package/components/viz-item-menu/viz-item-menu.d.ts +3 -0
  6. package/components/{viz-item-menu-Ht6bklNL.js → viz-item-menu-B7yRaSAU.js} +1 -1
  7. package/components/{viz-item-menu-XHh4qhtn.cjs → viz-item-menu-hLdU-02Q.cjs} +1 -1
  8. package/custom-elements.json +14 -0
  9. package/package.json +1 -1
  10. package/react/package.json +2 -2
  11. package/angular/README.md +0 -40
  12. package/angular/components/ai-chat-empty-state.ts +0 -98
  13. package/angular/components/ai-chat.ts +0 -440
  14. package/angular/components/ai-interaction-textarea.ts +0 -283
  15. package/angular/components/data-field-level.ts +0 -130
  16. package/angular/components/data-field-panel.ts +0 -256
  17. package/angular/components/data-field.ts +0 -130
  18. package/angular/components/data-fields-select.ts +0 -212
  19. package/angular/components/dataset-icon.ts +0 -83
  20. package/angular/components/dataset-selector-list.ts +0 -147
  21. package/angular/components/dataset-selector-row.ts +0 -198
  22. package/angular/components/display-settings-binning.ts +0 -92
  23. package/angular/components/display-settings-datetime.ts +0 -100
  24. package/angular/components/display-settings-grand-totals.ts +0 -92
  25. package/angular/components/display-settings-numeric.ts +0 -113
  26. package/angular/components/display-settings-period-over-period.ts +0 -107
  27. package/angular/components/display-settings.ts +0 -227
  28. package/angular/components/filter-expression-picker.ts +0 -168
  29. package/angular/components/filter-item.ts +0 -175
  30. package/angular/components/filter-parameter-picker.ts +0 -155
  31. package/angular/components/filter-value-picker-datetime.ts +0 -125
  32. package/angular/components/filter-value-picker-hierarchy.ts +0 -146
  33. package/angular/components/filter-value-picker-numeric.ts +0 -146
  34. package/angular/components/filter-value-picker.ts +0 -160
  35. package/angular/components/filters.ts +0 -209
  36. package/angular/components/formula-editor.ts +0 -229
  37. package/angular/components/formula-field.ts +0 -198
  38. package/angular/components/formula.ts +0 -170
  39. package/angular/components/interactive-viz-item.ts +0 -186
  40. package/angular/components/item-grid-item-actions-menu.ts +0 -113
  41. package/angular/components/item-grid.ts +0 -242
  42. package/angular/components/item-option-action-button-group.ts +0 -105
  43. package/angular/components/item-option-color-palette-picker.ts +0 -126
  44. package/angular/components/item-option-color-picker.ts +0 -134
  45. package/angular/components/item-option-color-range.ts +0 -168
  46. package/angular/components/item-option-guidelines.ts +0 -84
  47. package/angular/components/item-option-multi-language-field.ts +0 -133
  48. package/angular/components/item-option-number-field.ts +0 -161
  49. package/angular/components/item-option-panel.ts +0 -149
  50. package/angular/components/item-option-picker.ts +0 -120
  51. package/angular/components/item-option-position-picker.ts +0 -98
  52. package/angular/components/item-option-positions-number-field.ts +0 -140
  53. package/angular/components/item-option-radio-button-group.ts +0 -119
  54. package/angular/components/item-option-slider.ts +0 -126
  55. package/angular/components/item-option-switch.ts +0 -98
  56. package/angular/components/item-option-text-field.ts +0 -112
  57. package/angular/components/item-option.ts +0 -163
  58. package/angular/components/item-slot-drop-panel.ts +0 -236
  59. package/angular/components/item-slot-drop.ts +0 -231
  60. package/angular/components/item-slot-picker-panel.ts +0 -299
  61. package/angular/components/item-slot-picker.ts +0 -241
  62. package/angular/components/slot-menu-list.ts +0 -121
  63. package/angular/components/slot-menu.ts +0 -304
  64. package/angular/components/viz-item-menu.ts +0 -118
  65. package/angular/esm/components/ai-chat-empty-state.d.ts +0 -39
  66. package/angular/esm/components/ai-chat-empty-state.js +0 -99
  67. package/angular/esm/components/ai-chat.d.ts +0 -147
  68. package/angular/esm/components/ai-chat.js +0 -455
  69. package/angular/esm/components/ai-interaction-textarea.d.ts +0 -106
  70. package/angular/esm/components/ai-interaction-textarea.js +0 -305
  71. package/angular/esm/components/data-field-level.d.ts +0 -50
  72. package/angular/esm/components/data-field-level.js +0 -129
  73. package/angular/esm/components/data-field-panel.d.ts +0 -86
  74. package/angular/esm/components/data-field-panel.js +0 -268
  75. package/angular/esm/components/data-field.d.ts +0 -50
  76. package/angular/esm/components/data-field.js +0 -129
  77. package/angular/esm/components/data-fields-select.d.ts +0 -81
  78. package/angular/esm/components/data-fields-select.js +0 -227
  79. package/angular/esm/components/dataset-icon.d.ts +0 -34
  80. package/angular/esm/components/dataset-icon.js +0 -86
  81. package/angular/esm/components/dataset-selector-list.d.ts +0 -56
  82. package/angular/esm/components/dataset-selector-list.js +0 -155
  83. package/angular/esm/components/dataset-selector-row.d.ts +0 -70
  84. package/angular/esm/components/dataset-selector-row.js +0 -197
  85. package/angular/esm/components/display-settings-binning.d.ts +0 -37
  86. package/angular/esm/components/display-settings-binning.js +0 -91
  87. package/angular/esm/components/display-settings-datetime.d.ts +0 -40
  88. package/angular/esm/components/display-settings-datetime.js +0 -99
  89. package/angular/esm/components/display-settings-grand-totals.d.ts +0 -37
  90. package/angular/esm/components/display-settings-grand-totals.js +0 -91
  91. package/angular/esm/components/display-settings-numeric.d.ts +0 -45
  92. package/angular/esm/components/display-settings-numeric.js +0 -115
  93. package/angular/esm/components/display-settings-period-over-period.d.ts +0 -44
  94. package/angular/esm/components/display-settings-period-over-period.js +0 -107
  95. package/angular/esm/components/display-settings.d.ts +0 -83
  96. package/angular/esm/components/display-settings.js +0 -231
  97. package/angular/esm/components/filter-expression-picker.d.ts +0 -64
  98. package/angular/esm/components/filter-expression-picker.js +0 -179
  99. package/angular/esm/components/filter-item.d.ts +0 -63
  100. package/angular/esm/components/filter-item.js +0 -187
  101. package/angular/esm/components/filter-parameter-picker.d.ts +0 -56
  102. package/angular/esm/components/filter-parameter-picker.js +0 -151
  103. package/angular/esm/components/filter-value-picker-datetime.d.ts +0 -47
  104. package/angular/esm/components/filter-value-picker-datetime.js +0 -131
  105. package/angular/esm/components/filter-value-picker-hierarchy.d.ts +0 -53
  106. package/angular/esm/components/filter-value-picker-hierarchy.js +0 -155
  107. package/angular/esm/components/filter-value-picker-numeric.d.ts +0 -53
  108. package/angular/esm/components/filter-value-picker-numeric.js +0 -155
  109. package/angular/esm/components/filter-value-picker.d.ts +0 -57
  110. package/angular/esm/components/filter-value-picker.js +0 -171
  111. package/angular/esm/components/filters.d.ts +0 -75
  112. package/angular/esm/components/filters.js +0 -215
  113. package/angular/esm/components/formula-editor.d.ts +0 -78
  114. package/angular/esm/components/formula-editor.js +0 -236
  115. package/angular/esm/components/formula-field.d.ts +0 -70
  116. package/angular/esm/components/formula-field.js +0 -209
  117. package/angular/esm/components/formula.d.ts +0 -60
  118. package/angular/esm/components/formula.js +0 -177
  119. package/angular/esm/components/interactive-viz-item.d.ts +0 -63
  120. package/angular/esm/components/interactive-viz-item.js +0 -188
  121. package/angular/esm/components/item-grid-item-actions-menu.d.ts +0 -45
  122. package/angular/esm/components/item-grid-item-actions-menu.js +0 -115
  123. package/angular/esm/components/item-grid.d.ts +0 -80
  124. package/angular/esm/components/item-grid.js +0 -245
  125. package/angular/esm/components/item-option-action-button-group.d.ts +0 -41
  126. package/angular/esm/components/item-option-action-button-group.js +0 -107
  127. package/angular/esm/components/item-option-color-palette-picker.d.ts +0 -48
  128. package/angular/esm/components/item-option-color-palette-picker.js +0 -131
  129. package/angular/esm/components/item-option-color-picker.d.ts +0 -51
  130. package/angular/esm/components/item-option-color-picker.js +0 -139
  131. package/angular/esm/components/item-option-color-range.d.ts +0 -66
  132. package/angular/esm/components/item-option-color-range.js +0 -179
  133. package/angular/esm/components/item-option-guidelines.d.ts +0 -34
  134. package/angular/esm/components/item-option-guidelines.js +0 -83
  135. package/angular/esm/components/item-option-multi-language-field.d.ts +0 -50
  136. package/angular/esm/components/item-option-multi-language-field.js +0 -139
  137. package/angular/esm/components/item-option-number-field.d.ts +0 -58
  138. package/angular/esm/components/item-option-number-field.js +0 -171
  139. package/angular/esm/components/item-option-panel.d.ts +0 -54
  140. package/angular/esm/components/item-option-panel.js +0 -155
  141. package/angular/esm/components/item-option-picker.d.ts +0 -46
  142. package/angular/esm/components/item-option-picker.js +0 -123
  143. package/angular/esm/components/item-option-position-picker.d.ts +0 -39
  144. package/angular/esm/components/item-option-position-picker.js +0 -99
  145. package/angular/esm/components/item-option-positions-number-field.d.ts +0 -54
  146. package/angular/esm/components/item-option-positions-number-field.js +0 -147
  147. package/angular/esm/components/item-option-radio-button-group.d.ts +0 -45
  148. package/angular/esm/components/item-option-radio-button-group.js +0 -123
  149. package/angular/esm/components/item-option-slider.d.ts +0 -46
  150. package/angular/esm/components/item-option-slider.js +0 -131
  151. package/angular/esm/components/item-option-switch.d.ts +0 -40
  152. package/angular/esm/components/item-option-switch.js +0 -99
  153. package/angular/esm/components/item-option-text-field.d.ts +0 -44
  154. package/angular/esm/components/item-option-text-field.js +0 -115
  155. package/angular/esm/components/item-option.d.ts +0 -58
  156. package/angular/esm/components/item-option.js +0 -171
  157. package/angular/esm/components/item-slot-drop-panel.d.ts +0 -82
  158. package/angular/esm/components/item-slot-drop-panel.js +0 -249
  159. package/angular/esm/components/item-slot-drop.d.ts +0 -77
  160. package/angular/esm/components/item-slot-drop.js +0 -227
  161. package/angular/esm/components/item-slot-picker-panel.d.ts +0 -97
  162. package/angular/esm/components/item-slot-picker-panel.js +0 -309
  163. package/angular/esm/components/item-slot-picker.d.ts +0 -86
  164. package/angular/esm/components/item-slot-picker.js +0 -259
  165. package/angular/esm/components/slot-menu-list.d.ts +0 -46
  166. package/angular/esm/components/slot-menu-list.js +0 -123
  167. package/angular/esm/components/slot-menu.d.ts +0 -104
  168. package/angular/esm/components/slot-menu.js +0 -300
  169. package/angular/esm/components/viz-item-menu.d.ts +0 -42
  170. package/angular/esm/components/viz-item-menu.js +0 -111
  171. package/angular/esm/index.d.ts +0 -109
  172. package/angular/esm/index.js +0 -217
  173. package/angular/index.ts +0 -223
  174. package/angular/package.json +0 -40
  175. package/angular/tsconfig.json +0 -36
  176. package/angular/type-fallbacks.d.ts +0 -0
  177. package/angular/utils/ai-prompt/attachments.d.ts +0 -10
  178. package/angular/utils/ai-prompt/dictation.d.ts +0 -50
  179. package/angular/utils/ai-prompt/image-upload.d.ts +0 -12
  180. package/angular/utils/ai-prompt/index.d.ts +0 -6
  181. package/angular/utils/ai-prompt/tests/attachments.test.d.ts +0 -1
  182. package/angular/utils/ai-prompt/tests/dictation.test.d.ts +0 -1
  183. package/angular/utils/ai-prompt/tests/image-upload.test.d.ts +0 -1
  184. package/angular/utils/base/base.d.ts +0 -16
  185. package/angular/utils/base/focus-visible.d.ts +0 -29
  186. package/angular/utils/base/focusable.d.ts +0 -58
  187. package/angular/utils/base/index.d.ts +0 -5
  188. package/angular/utils/base/localized-mixin.d.ts +0 -22
  189. package/angular/utils/base/sized-mixin.d.ts +0 -17
  190. package/angular/utils/color/color-palettes.d.ts +0 -17
  191. package/angular/utils/color/extrapolate-color.d.ts +0 -1
  192. package/angular/utils/data/load-data-fields-for-datasets.d.ts +0 -22
  193. package/angular/utils/data-broker/index.d.ts +0 -263
  194. package/angular/utils/data-field-types/calculate-data-field-icon.d.ts +0 -12
  195. package/angular/utils/data-field-types/default-acceptable-data-field-types.d.ts +0 -1
  196. package/angular/utils/data-field-types/tests/calculate-data-field-icon.test.d.ts +0 -1
  197. package/angular/utils/drag/draggable.d.ts +0 -13
  198. package/angular/utils/drag/pragmatic-element-adapter.d.ts +0 -2
  199. package/angular/utils/drag/tests/pragmatic-element-adapter.first-import.test.d.ts +0 -1
  200. package/angular/utils/drag/tests/pragmatic-element-adapter.test.d.ts +0 -1
  201. package/angular/utils/filters/expressions.d.ts +0 -15
  202. package/angular/utils/filters/index.d.ts +0 -1
  203. package/angular/utils/formatter/calculate-duration.d.ts +0 -2
  204. package/angular/utils/formatter/decompose-numeric-format.d.ts +0 -11
  205. package/angular/utils/formatter/default-local-formats.d.ts +0 -20
  206. package/angular/utils/formatter/formats/cs.d.ts +0 -20
  207. package/angular/utils/formatter/formats/da.d.ts +0 -20
  208. package/angular/utils/formatter/formats/de.d.ts +0 -21
  209. package/angular/utils/formatter/formats/en-GB.d.ts +0 -21
  210. package/angular/utils/formatter/formats/en-US.d.ts +0 -1
  211. package/angular/utils/formatter/formats/en.d.ts +0 -1
  212. package/angular/utils/formatter/formats/es.d.ts +0 -54
  213. package/angular/utils/formatter/formats/fi.d.ts +0 -20
  214. package/angular/utils/formatter/formats/fr.d.ts +0 -54
  215. package/angular/utils/formatter/formats/he.d.ts +0 -20
  216. package/angular/utils/formatter/formats/hu.d.ts +0 -20
  217. package/angular/utils/formatter/formats/it.d.ts +0 -54
  218. package/angular/utils/formatter/formats/ja.d.ts +0 -20
  219. package/angular/utils/formatter/formats/ko.d.ts +0 -20
  220. package/angular/utils/formatter/formats/mk.d.ts +0 -20
  221. package/angular/utils/formatter/formats/nl.d.ts +0 -21
  222. package/angular/utils/formatter/formats/no.d.ts +0 -21
  223. package/angular/utils/formatter/formats/pl.d.ts +0 -20
  224. package/angular/utils/formatter/formats/pt.d.ts +0 -20
  225. package/angular/utils/formatter/formats/ru.d.ts +0 -20
  226. package/angular/utils/formatter/formats/sv.d.ts +0 -20
  227. package/angular/utils/formatter/formats/tr.d.ts +0 -21
  228. package/angular/utils/formatter/formats/zh-CN.d.ts +0 -20
  229. package/angular/utils/formatter/formats/zh-TW.d.ts +0 -20
  230. package/angular/utils/formatter/formatter.d.ts +0 -9
  231. package/angular/utils/formatter/get-dataset-name.d.ts +0 -2
  232. package/angular/utils/formatter/get-localized-name.d.ts +0 -4
  233. package/angular/utils/formatter/localize.d.ts +0 -3
  234. package/angular/utils/formatter/smart-datetime-formats.const.d.ts +0 -36
  235. package/angular/utils/formatter/tests/calculate-duration.test.d.ts +0 -1
  236. package/angular/utils/formatter/tests/decompose-numeric-format.test.d.ts +0 -1
  237. package/angular/utils/formatter/tests/default-local-formats.test.d.ts +0 -1
  238. package/angular/utils/formatter/tests/formatter.test.d.ts +0 -1
  239. package/angular/utils/formatter/tests/get-localized-name.test.d.ts +0 -1
  240. package/angular/utils/formatter/tests/localize.test.d.ts +0 -1
  241. package/angular/utils/formula/base/formula-base.d.ts +0 -117
  242. package/angular/utils/formula/base/formula-input-base.d.ts +0 -62
  243. package/angular/utils/formula/codemirror/actions.d.ts +0 -47
  244. package/angular/utils/formula/codemirror/drop-cursor.d.ts +0 -15
  245. package/angular/utils/formula/codemirror/icon-element.d.ts +0 -7
  246. package/angular/utils/formula/codemirror/parser.d.ts +0 -16
  247. package/angular/utils/formula/codemirror/tests/actions.test.d.ts +0 -1
  248. package/angular/utils/formula/codemirror/theme.d.ts +0 -20
  249. package/angular/utils/formula/codemirror/widget.d.ts +0 -18
  250. package/angular/utils/formula/config/aggregations.d.ts +0 -9
  251. package/angular/utils/formula/config/build-datasets.d.ts +0 -10
  252. package/angular/utils/formula/config/expression-helpers.d.ts +0 -42
  253. package/angular/utils/formula/config/functions.d.ts +0 -3
  254. package/angular/utils/formula/config/groupings.d.ts +0 -9
  255. package/angular/utils/formula/config/regex.d.ts +0 -39
  256. package/angular/utils/formula/config/resolve-column-presentation.d.ts +0 -19
  257. package/angular/utils/formula/config/tests/build-datasets.test.d.ts +0 -1
  258. package/angular/utils/formula/config/validate-expression.d.ts +0 -19
  259. package/angular/utils/formula/load-formula-codemirror.d.ts +0 -4
  260. package/angular/utils/formula/render-explanation-tooltip.d.ts +0 -7
  261. package/angular/utils/formula/store/formula-display-store.d.ts +0 -93
  262. package/angular/utils/formula/store/formula-editor-context.d.ts +0 -8
  263. package/angular/utils/formula/store/formula-editor-store.d.ts +0 -46
  264. package/angular/utils/formula/store/tests/formula-editor-store.test.d.ts +0 -1
  265. package/angular/utils/formula/tests/validate-expression.test.d.ts +0 -1
  266. package/angular/utils/get-css-variable.d.ts +0 -1
  267. package/angular/utils/index.d.ts +0 -10
  268. package/angular/utils/localize/set-locale.d.ts +0 -7
  269. package/angular/utils/map-tile-providers/index.d.ts +0 -93
  270. package/angular/utils/set-nested-value.d.ts +0 -6
  271. package/angular/utils/slot-content/ad-hoc-slot-content.d.ts +0 -7
  272. package/angular/utils/slot-content/render-calculation-label.d.ts +0 -7
  273. package/angular/utils/slot-content/tests/ad-hoc-slot-content.test.d.ts +0 -1
  274. package/angular/utils/slot-state/slot-context.d.ts +0 -4
  275. package/angular/utils/slot-state/slot-store.d.ts +0 -39
  276. package/angular/utils/store/base-store.d.ts +0 -158
  277. package/angular/utils/store/dashboard-store.d.ts +0 -49
  278. package/angular/utils/store/index.d.ts +0 -135
  279. package/angular/utils/store/item-store.d.ts +0 -33
  280. package/angular/utils/store/store-registry.d.ts +0 -170
  281. package/angular/utils/store/tests/dashboard-store.test.d.ts +0 -1
  282. package/angular/utils/store/tests/item-store.test.d.ts +0 -1
  283. package/angular/utils/store/tests/store-registry.test.d.ts +0 -1
  284. package/angular/utils/store/types.d.ts +0 -270
  285. package/angular/utils/switch-item/index.d.ts +0 -34
  286. package/angular/utils/switch-item/slot-role-classification.d.ts +0 -31
  287. package/angular/utils/switch-item/stories/switch-item.stories.d.ts +0 -17
  288. package/angular/utils/switch-item/tests/slot-role-classification.test.d.ts +0 -1
  289. package/angular/utils/switch-item/tests/switch-item.test.d.ts +0 -1
  290. package/angular/utils/tests/set-nested-value.test.d.ts +0 -1
  291. package/angular/utils/themes/bliss.d.ts +0 -2
  292. package/angular/utils/themes/classic-dark.d.ts +0 -2
  293. package/angular/utils/themes/classic.d.ts +0 -2
  294. package/angular/utils/themes/default-dark.d.ts +0 -2
  295. package/angular/utils/themes/default.d.ts +0 -2
  296. package/angular/utils/themes/index.d.ts +0 -4
  297. package/angular/utils/themes/orion.d.ts +0 -2
  298. package/angular/utils/themes/pinky.d.ts +0 -2
  299. package/angular/utils/themes/radiant.d.ts +0 -2
  300. package/angular/utils/themes/royale.d.ts +0 -2
  301. package/angular/utils/themes/seasonal.d.ts +0 -2
  302. package/angular/utils/themes/urban.d.ts +0 -2
  303. package/angular/utils/themes/vivid.d.ts +0 -2
  304. package/angular/utils/time/formats.const.d.ts +0 -4
  305. package/angular/utils/time/period-over-period-condition.const.d.ts +0 -8
  306. package/angular/utils/time/periods.const.d.ts +0 -15
  307. package/angular/utils/timezone/datetime-timezone.d.ts +0 -25
  308. package/angular/utils/timezone/tests/datetime-timezone.test.d.ts +0 -1
  309. package/angular/utils/transformations/convert-data-field-to-slot-content.d.ts +0 -9
  310. package/angular/utils/transformations/convert-datasets-to-data-fields.d.ts +0 -30
  311. package/angular/utils/transformations/tests/convert-data-field-to-slot-content.test.d.ts +0 -1
  312. package/angular/utils/transformations/tests/convert-datasets-to-data-fields.test.d.ts +0 -1
  313. package/angular/utils/types/tests/type-check.test.d.ts +0 -1
  314. package/angular/utils/types/type-check.d.ts +0 -28
@@ -1,198 +0,0 @@
1
- import { booleanAttribute, ChangeDetectionStrategy, Component, DestroyRef, ElementRef, inject, Input, OnChanges, output, Renderer2, SimpleChanges } from '@angular/core';
2
- import '@luzmo/analytics-components-kit/formula-field';
3
- import type { LuzmoFormulaField as LuzmoFormulaFieldHostElement } from '@luzmo/analytics-components-kit/formula-field';
4
-
5
- @Component({
6
- selector: 'luzmo-formula-field',
7
- exportAs: 'luzmoFormulaField',
8
- standalone: true,
9
- changeDetection: ChangeDetectionStrategy.OnPush,
10
- template: '<ng-content />'
11
- })
12
- /**
13
- * Angular wrapper component for <luzmo-formula-field>
14
- */
15
- export class LuzmoFormulaField implements OnChanges {
16
- private readonly elementRef = inject<ElementRef<LuzmoFormulaFieldHostElement>>(ElementRef);
17
- private readonly renderer = inject<Renderer2>(Renderer2);
18
- private readonly destroyRef = inject<DestroyRef>(DestroyRef);
19
- private readonly host = this.elementRef.nativeElement;
20
- private readonly listenerCleanup: Array<() => void> = [];
21
-
22
- /** The underlying custom element instance. Use to call imperative methods. */
23
- get nativeElement(): LuzmoFormulaFieldHostElement {
24
- return this.host;
25
- }
26
-
27
- /** Renders the field display-only (no editing). */
28
- @Input({ alias: 'readonly', transform: booleanAttribute })
29
- readonly?: boolean;
30
-
31
- /** Placeholder text shown in the editable input when the expression is empty. */
32
- @Input({ alias: 'placeholder' })
33
- placeholder?: string;
34
-
35
- /** Number of text lines the input is sized to start with. Defaults to 3. */
36
- @Input({ alias: 'rows' })
37
- rows?: number;
38
-
39
- /** Maximum number of text lines before a scrollbar appears (only when `grows`). */
40
- @Input({ alias: 'maxRows' })
41
- maxRows?: number;
42
-
43
- /** Whether the input grows in height with its content (up to `maxRows` if set). */
44
- @Input({ alias: 'grows', transform: booleanAttribute })
45
- grows?: boolean;
46
-
47
- /** The language for UI labels. Supported values: 'en', 'nl', 'fr', 'de', 'es' */
48
- @Input({ alias: 'language' })
49
- language?: string;
50
-
51
- /** The formula expression (function syntax), e.g. `SUM({datasetId:columnId})`. */
52
- @Input({ alias: 'expression' })
53
- expression?: string;
54
-
55
- /** Datasets and their data fields, provided directly (takes preference over `datasetIds`). */
56
- @Input({ alias: 'datasetsDataFields' })
57
- datasetsDataFields?: unknown;
58
-
59
- /** Dataset ids to fetch from the Luzmo API (auth attributes optional for public datasets). */
60
- @Input({ alias: 'datasetIds' })
61
- datasetIds?: string[];
62
-
63
- /** Base URL of the Luzmo API used to fetch datasets by id. */
64
- @Input({ alias: 'apiUrl' })
65
- apiUrl?: string;
66
-
67
- /** Luzmo API authorization key, used with `authToken` to fetch datasets by id. */
68
- @Input({ alias: 'authKey' })
69
- authKey?: string;
70
-
71
- /** Luzmo API authorization token, used with `authKey` to fetch datasets by id. */
72
- @Input({ alias: 'authToken' })
73
- authToken?: string;
74
-
75
- /** Whether aggregation functions are offered (in the autocompletion, and - for the editor - via the aggregations list and pills). Defaults to `true`. Note: as a boolean attribute defaulting to `true` it cannot be turned off via markup (an absent attribute keeps the default); set the `.showAggregations` property to `false` to disable. */
76
- @Input({ alias: 'showAggregations', transform: booleanAttribute })
77
- showAggregations?: boolean;
78
-
79
- /** Language used for data labels (column / dataset names). */
80
- @Input({ alias: 'contentLanguage' })
81
- contentLanguage?: string;
82
-
83
- /** When true, aggregations render as multi-stage nested widgets. */
84
- @Input({ alias: 'multiStageAggregation', transform: booleanAttribute })
85
- multiStageAggregation?: boolean;
86
-
87
- /** When true, aggregations can be nested inside other aggregations. */
88
- @Input({ alias: 'nestedAggregation', transform: booleanAttribute })
89
- nestedAggregation?: boolean;
90
-
91
- /** The size of the element */
92
- @Input({ alias: 'size' })
93
- size?: 's' | 'm' | 'l' | 'xl';
94
-
95
- /** Fired (debounced) when the expression changes (only when not readonly). */
96
- readonly luzmoExpressionChanged = output<CustomEvent<unknown>>({ alias: 'luzmoExpressionChanged' });
97
-
98
- /** Fired when fetching datasets by id fails. */
99
- readonly luzmoDatasetsError = output<CustomEvent<unknown>>({ alias: 'luzmoDatasetsError' });
100
-
101
- constructor() {
102
- this.bindEvents();
103
- this.destroyRef.onDestroy(() => {
104
- for (const cleanup of this.listenerCleanup) {
105
- cleanup();
106
- }
107
- });
108
- }
109
-
110
- ngOnChanges(changes: SimpleChanges): void {
111
- for (const key of Object.keys(changes)) {
112
- switch (key) {
113
- case 'readonly':
114
- this.setHostProperty('readonly', changes['readonly'].currentValue);
115
- break;
116
- case 'placeholder':
117
- this.setHostProperty('placeholder', changes['placeholder'].currentValue);
118
- break;
119
- case 'rows':
120
- this.setHostProperty('rows', changes['rows'].currentValue);
121
- break;
122
- case 'maxRows':
123
- this.setHostProperty('maxRows', changes['maxRows'].currentValue);
124
- break;
125
- case 'grows':
126
- this.setHostProperty('grows', changes['grows'].currentValue);
127
- break;
128
- case 'language':
129
- this.setHostProperty('language', changes['language'].currentValue);
130
- break;
131
- case 'expression':
132
- this.setHostProperty('expression', changes['expression'].currentValue);
133
- break;
134
- case 'datasetsDataFields':
135
- this.setHostProperty('datasetsDataFields', changes['datasetsDataFields'].currentValue);
136
- break;
137
- case 'datasetIds':
138
- this.setHostProperty('datasetIds', changes['datasetIds'].currentValue);
139
- break;
140
- case 'apiUrl':
141
- this.setHostProperty('apiUrl', changes['apiUrl'].currentValue);
142
- break;
143
- case 'authKey':
144
- this.setHostProperty('authKey', changes['authKey'].currentValue);
145
- break;
146
- case 'authToken':
147
- this.setHostProperty('authToken', changes['authToken'].currentValue);
148
- break;
149
- case 'showAggregations':
150
- this.setHostProperty('showAggregations', changes['showAggregations'].currentValue);
151
- break;
152
- case 'contentLanguage':
153
- this.setHostProperty('contentLanguage', changes['contentLanguage'].currentValue);
154
- break;
155
- case 'multiStageAggregation':
156
- this.setHostProperty('multiStageAggregation', changes['multiStageAggregation'].currentValue);
157
- break;
158
- case 'nestedAggregation':
159
- this.setHostProperty('nestedAggregation', changes['nestedAggregation'].currentValue);
160
- break;
161
- case 'size':
162
- this.setHostProperty('size', changes['size'].currentValue);
163
- break;
164
- default:
165
- break;
166
- }
167
- }
168
- }
169
-
170
- /**
171
- * Forward a wrapper @Input to the underlying host element via Renderer2 so
172
- * the wrapper stays compatible with non-DOM Angular platforms (SSR, tests).
173
- * Unlike a "skip undefined" guard, this lets consumers reset values back to
174
- * undefined / null by clearing their bindings.
175
- */
176
- private setHostProperty(key: string, value: unknown): void {
177
- this.renderer.setProperty(this.host, key, value);
178
- }
179
-
180
- private bindEvents(): void {
181
- this.listenerCleanup.push(
182
- this.renderer.listen(this.host, 'luzmo-expression-changed', (event: Event) => {
183
- const typed = event as CustomEvent<unknown>;
184
- this.luzmoExpressionChanged.emit(typed);
185
- })
186
- );
187
-
188
- this.listenerCleanup.push(
189
- this.renderer.listen(this.host, 'luzmo-datasets-error', (event: Event) => {
190
- const typed = event as CustomEvent<unknown>;
191
- this.luzmoDatasetsError.emit(typed);
192
- })
193
- );
194
- }
195
- }
196
-
197
- /** The underlying custom element type for LuzmoFormulaField */
198
- export type LuzmoFormulaFieldElement = LuzmoFormulaFieldHostElement;
@@ -1,170 +0,0 @@
1
- import { booleanAttribute, ChangeDetectionStrategy, Component, DestroyRef, ElementRef, inject, Input, OnChanges, output, Renderer2, SimpleChanges } from '@angular/core';
2
- import '@luzmo/analytics-components-kit/formula';
3
- import type { LuzmoFormula as LuzmoFormulaHostElement } from '@luzmo/analytics-components-kit/formula';
4
-
5
- @Component({
6
- selector: 'luzmo-formula',
7
- exportAs: 'luzmoFormula',
8
- standalone: true,
9
- changeDetection: ChangeDetectionStrategy.OnPush,
10
- template: '<ng-content />'
11
- })
12
- /**
13
- * Angular wrapper component for <luzmo-formula>
14
- */
15
- export class LuzmoFormula implements OnChanges {
16
- private readonly elementRef = inject<ElementRef<LuzmoFormulaHostElement>>(ElementRef);
17
- private readonly renderer = inject<Renderer2>(Renderer2);
18
- private readonly destroyRef = inject<DestroyRef>(DestroyRef);
19
- private readonly host = this.elementRef.nativeElement;
20
- private readonly listenerCleanup: Array<() => void> = [];
21
-
22
- /** The underlying custom element instance. Use to call imperative methods. */
23
- get nativeElement(): LuzmoFormulaHostElement {
24
- return this.host;
25
- }
26
-
27
- /** Rendering mode. `rich` (default) renders read-only column / aggregation pills; `text` renders plain text with an inline type icon per column. Both are always read-only. */
28
- @Input({ alias: 'display' })
29
- display?: 'rich' | 'text';
30
-
31
- /** The language for UI labels. Supported values: 'en', 'nl', 'fr', 'de', 'es' */
32
- @Input({ alias: 'language' })
33
- language?: string;
34
-
35
- /** The formula expression (function syntax), e.g. `SUM({datasetId:columnId})`. */
36
- @Input({ alias: 'expression' })
37
- expression?: string;
38
-
39
- /** Datasets and their data fields, provided directly (takes preference over `datasetIds`). */
40
- @Input({ alias: 'datasetsDataFields' })
41
- datasetsDataFields?: unknown;
42
-
43
- /** Dataset ids to fetch from the Luzmo API (auth attributes optional for public datasets). */
44
- @Input({ alias: 'datasetIds' })
45
- datasetIds?: string[];
46
-
47
- /** Base URL of the Luzmo API used to fetch datasets by id. */
48
- @Input({ alias: 'apiUrl' })
49
- apiUrl?: string;
50
-
51
- /** Luzmo API authorization key, used with `authToken` to fetch datasets by id. */
52
- @Input({ alias: 'authKey' })
53
- authKey?: string;
54
-
55
- /** Luzmo API authorization token, used with `authKey` to fetch datasets by id. */
56
- @Input({ alias: 'authToken' })
57
- authToken?: string;
58
-
59
- /** Whether aggregation functions are offered (in the autocompletion, and - for the editor - via the aggregations list and pills). Defaults to `true`. Note: as a boolean attribute defaulting to `true` it cannot be turned off via markup (an absent attribute keeps the default); set the `.showAggregations` property to `false` to disable. */
60
- @Input({ alias: 'showAggregations', transform: booleanAttribute })
61
- showAggregations?: boolean;
62
-
63
- /** Language used for data labels (column / dataset names). */
64
- @Input({ alias: 'contentLanguage' })
65
- contentLanguage?: string;
66
-
67
- /** When true, aggregations render as multi-stage nested widgets. */
68
- @Input({ alias: 'multiStageAggregation', transform: booleanAttribute })
69
- multiStageAggregation?: boolean;
70
-
71
- /** When true, aggregations can be nested inside other aggregations. */
72
- @Input({ alias: 'nestedAggregation', transform: booleanAttribute })
73
- nestedAggregation?: boolean;
74
-
75
- /** The size of the element */
76
- @Input({ alias: 'size' })
77
- size?: 's' | 'm' | 'l' | 'xl';
78
-
79
- /** Fired (debounced) when the formula expression changes; `detail.expression` holds the new expression. */
80
- readonly luzmoExpressionChanged = output<CustomEvent<unknown>>({ alias: 'luzmoExpressionChanged' });
81
-
82
- /** Fired when fetching datasets by id fails. */
83
- readonly luzmoDatasetsError = output<CustomEvent<unknown>>({ alias: 'luzmoDatasetsError' });
84
-
85
- constructor() {
86
- this.bindEvents();
87
- this.destroyRef.onDestroy(() => {
88
- for (const cleanup of this.listenerCleanup) {
89
- cleanup();
90
- }
91
- });
92
- }
93
-
94
- ngOnChanges(changes: SimpleChanges): void {
95
- for (const key of Object.keys(changes)) {
96
- switch (key) {
97
- case 'display':
98
- this.setHostProperty('display', changes['display'].currentValue);
99
- break;
100
- case 'language':
101
- this.setHostProperty('language', changes['language'].currentValue);
102
- break;
103
- case 'expression':
104
- this.setHostProperty('expression', changes['expression'].currentValue);
105
- break;
106
- case 'datasetsDataFields':
107
- this.setHostProperty('datasetsDataFields', changes['datasetsDataFields'].currentValue);
108
- break;
109
- case 'datasetIds':
110
- this.setHostProperty('datasetIds', changes['datasetIds'].currentValue);
111
- break;
112
- case 'apiUrl':
113
- this.setHostProperty('apiUrl', changes['apiUrl'].currentValue);
114
- break;
115
- case 'authKey':
116
- this.setHostProperty('authKey', changes['authKey'].currentValue);
117
- break;
118
- case 'authToken':
119
- this.setHostProperty('authToken', changes['authToken'].currentValue);
120
- break;
121
- case 'showAggregations':
122
- this.setHostProperty('showAggregations', changes['showAggregations'].currentValue);
123
- break;
124
- case 'contentLanguage':
125
- this.setHostProperty('contentLanguage', changes['contentLanguage'].currentValue);
126
- break;
127
- case 'multiStageAggregation':
128
- this.setHostProperty('multiStageAggregation', changes['multiStageAggregation'].currentValue);
129
- break;
130
- case 'nestedAggregation':
131
- this.setHostProperty('nestedAggregation', changes['nestedAggregation'].currentValue);
132
- break;
133
- case 'size':
134
- this.setHostProperty('size', changes['size'].currentValue);
135
- break;
136
- default:
137
- break;
138
- }
139
- }
140
- }
141
-
142
- /**
143
- * Forward a wrapper @Input to the underlying host element via Renderer2 so
144
- * the wrapper stays compatible with non-DOM Angular platforms (SSR, tests).
145
- * Unlike a "skip undefined" guard, this lets consumers reset values back to
146
- * undefined / null by clearing their bindings.
147
- */
148
- private setHostProperty(key: string, value: unknown): void {
149
- this.renderer.setProperty(this.host, key, value);
150
- }
151
-
152
- private bindEvents(): void {
153
- this.listenerCleanup.push(
154
- this.renderer.listen(this.host, 'luzmo-expression-changed', (event: Event) => {
155
- const typed = event as CustomEvent<unknown>;
156
- this.luzmoExpressionChanged.emit(typed);
157
- })
158
- );
159
-
160
- this.listenerCleanup.push(
161
- this.renderer.listen(this.host, 'luzmo-datasets-error', (event: Event) => {
162
- const typed = event as CustomEvent<unknown>;
163
- this.luzmoDatasetsError.emit(typed);
164
- })
165
- );
166
- }
167
- }
168
-
169
- /** The underlying custom element type for LuzmoFormula */
170
- export type LuzmoFormulaElement = LuzmoFormulaHostElement;
@@ -1,186 +0,0 @@
1
- import { booleanAttribute, ChangeDetectionStrategy, Component, DestroyRef, ElementRef, inject, Input, OnChanges, output, Renderer2, SimpleChanges } from '@angular/core';
2
- import '@luzmo/analytics-components-kit/interactive-viz-item';
3
- import type { LuzmoInteractiveVizItem as LuzmoInteractiveVizItemHostElement, ChartFeedback, FlexChartConfig, InteractiveVizItemChartChangedEventDetail, InteractiveVizItemChartOptionsChangedEventDetail, InteractiveVizItemFeedbackChangedEventDetail } from '@luzmo/analytics-components-kit/interactive-viz-item';
4
- export type { ChartActionDescriptor, ChartActionType, ChartFeedback, ChartFeedbackRating, ChartMutationRequest, ChartOption, FlexChartConfig, InteractiveVizItemChartChangedEventDetail, InteractiveVizItemChartOptionsChangedEventDetail, InteractiveVizItemFeedbackChangedEventDetail, NormalizedChartConfig, Ranking, Sort } from '@luzmo/analytics-components-kit/interactive-viz-item';
5
-
6
- @Component({
7
- selector: 'luzmo-interactive-viz-item',
8
- exportAs: 'luzmoInteractiveVizItem',
9
- standalone: true,
10
- changeDetection: ChangeDetectionStrategy.OnPush,
11
- template: '<ng-content />'
12
- })
13
- /**
14
- * Angular wrapper component for <luzmo-interactive-viz-item>
15
- *
16
- * @slot chart-actions-extra - Host-injected actions rendered at the end of the inline actions bar (e.g. copy-to-dashboard).
17
- * @csspart container - The viz item container.
18
- * @csspart chart-container - The embedded chart wrapper.
19
- * @csspart config-panel - The expandable configuration panel.
20
- */
21
- export class LuzmoInteractiveVizItem implements OnChanges {
22
- private readonly elementRef = inject<ElementRef<LuzmoInteractiveVizItemHostElement>>(ElementRef);
23
- private readonly renderer = inject<Renderer2>(Renderer2);
24
- private readonly destroyRef = inject<DestroyRef>(DestroyRef);
25
- private readonly host = this.elementRef.nativeElement;
26
- private readonly listenerCleanup: Array<() => void> = [];
27
-
28
- /** The underlying custom element instance. Use to call imperative methods. */
29
- get nativeElement(): LuzmoInteractiveVizItemHostElement {
30
- return this.host;
31
- }
32
-
33
- /** The language for UI labels. Supported values: 'en', 'nl', 'fr', 'de', 'es' */
34
- @Input({ alias: 'language' })
35
- language?: string;
36
-
37
- /** Loose chart config (type, options, slots, filters); slots may use the keyed-object form. */
38
- @Input({ alias: 'chart' })
39
- chart?: FlexChartConfig | null;
40
-
41
- /** Current feedback (drives the thumbs up/down selection). */
42
- @Input({ alias: 'feedback' })
43
- feedback?: ChartFeedback | null;
44
-
45
- /** Message id from the backend. Feedback is only shown when set. */
46
- @Input({ alias: 'messageId' })
47
- messageId?: string;
48
-
49
- /** Auth key for the embedded chart and config panels. */
50
- @Input({ alias: 'authKey' })
51
- authKey?: string;
52
-
53
- /** Auth token for the embedded chart and config panels. */
54
- @Input({ alias: 'authToken' })
55
- authToken?: string;
56
-
57
- /** API URL for the embedded chart and config panels. */
58
- @Input({ alias: 'apiUrl' })
59
- apiUrl?: string;
60
-
61
- /** App server URL for the embedded chart (assets, thumbnails). */
62
- @Input({ alias: 'appServer' })
63
- appServer?: string;
64
-
65
- /** Content language for chart data and dataset metadata. Defaults to the UI `language`. */
66
- @Input({ alias: 'contentLanguage' })
67
- contentLanguage?: string;
68
-
69
- /** When present, hides the inline chart actions (ranking, display mode). */
70
- @Input({ alias: 'hideActions', transform: booleanAttribute })
71
- hideActions?: boolean;
72
-
73
- /** When present, hides the feedback bar. */
74
- @Input({ alias: 'hideFeedback', transform: booleanAttribute })
75
- hideFeedback?: boolean;
76
-
77
- /** When present, hides the config-panel toggle and the panel itself. */
78
- @Input({ alias: 'hideConfigPanel', transform: booleanAttribute })
79
- hideConfigPanel?: boolean;
80
-
81
- /** The size of the element */
82
- @Input({ alias: 'size' })
83
- size?: 's' | 'm' | 'l' | 'xl';
84
-
85
- /** Fired when the inline actions (ranking, sort, display mode) change the chart options. */
86
- readonly luzmoChartOptionsChanged = output<CustomEvent<InteractiveVizItemChartOptionsChangedEventDetail>>({ alias: 'luzmoChartOptionsChanged' });
87
-
88
- /** Fired when the config panel changes slots, filters, or options (full chart). */
89
- readonly luzmoChartChanged = output<CustomEvent<InteractiveVizItemChartChangedEventDetail>>({ alias: 'luzmoChartChanged' });
90
-
91
- /** Fired when the user changes the thumbs up/down rating. */
92
- readonly luzmoFeedbackChanged = output<CustomEvent<InteractiveVizItemFeedbackChangedEventDetail>>({ alias: 'luzmoFeedbackChanged' });
93
-
94
- constructor() {
95
- this.bindEvents();
96
- this.destroyRef.onDestroy(() => {
97
- for (const cleanup of this.listenerCleanup) {
98
- cleanup();
99
- }
100
- });
101
- }
102
-
103
- ngOnChanges(changes: SimpleChanges): void {
104
- for (const key of Object.keys(changes)) {
105
- switch (key) {
106
- case 'language':
107
- this.setHostProperty('language', changes['language'].currentValue);
108
- break;
109
- case 'chart':
110
- this.setHostProperty('chart', changes['chart'].currentValue);
111
- break;
112
- case 'feedback':
113
- this.setHostProperty('feedback', changes['feedback'].currentValue);
114
- break;
115
- case 'messageId':
116
- this.setHostProperty('messageId', changes['messageId'].currentValue);
117
- break;
118
- case 'authKey':
119
- this.setHostProperty('authKey', changes['authKey'].currentValue);
120
- break;
121
- case 'authToken':
122
- this.setHostProperty('authToken', changes['authToken'].currentValue);
123
- break;
124
- case 'apiUrl':
125
- this.setHostProperty('apiUrl', changes['apiUrl'].currentValue);
126
- break;
127
- case 'appServer':
128
- this.setHostProperty('appServer', changes['appServer'].currentValue);
129
- break;
130
- case 'contentLanguage':
131
- this.setHostProperty('contentLanguage', changes['contentLanguage'].currentValue);
132
- break;
133
- case 'hideActions':
134
- this.setHostProperty('hideActions', changes['hideActions'].currentValue);
135
- break;
136
- case 'hideFeedback':
137
- this.setHostProperty('hideFeedback', changes['hideFeedback'].currentValue);
138
- break;
139
- case 'hideConfigPanel':
140
- this.setHostProperty('hideConfigPanel', changes['hideConfigPanel'].currentValue);
141
- break;
142
- case 'size':
143
- this.setHostProperty('size', changes['size'].currentValue);
144
- break;
145
- default:
146
- break;
147
- }
148
- }
149
- }
150
-
151
- /**
152
- * Forward a wrapper @Input to the underlying host element via Renderer2 so
153
- * the wrapper stays compatible with non-DOM Angular platforms (SSR, tests).
154
- * Unlike a "skip undefined" guard, this lets consumers reset values back to
155
- * undefined / null by clearing their bindings.
156
- */
157
- private setHostProperty(key: string, value: unknown): void {
158
- this.renderer.setProperty(this.host, key, value);
159
- }
160
-
161
- private bindEvents(): void {
162
- this.listenerCleanup.push(
163
- this.renderer.listen(this.host, 'luzmo-chart-options-changed', (event: Event) => {
164
- const typed = event as CustomEvent<InteractiveVizItemChartOptionsChangedEventDetail>;
165
- this.luzmoChartOptionsChanged.emit(typed);
166
- })
167
- );
168
-
169
- this.listenerCleanup.push(
170
- this.renderer.listen(this.host, 'luzmo-chart-changed', (event: Event) => {
171
- const typed = event as CustomEvent<InteractiveVizItemChartChangedEventDetail>;
172
- this.luzmoChartChanged.emit(typed);
173
- })
174
- );
175
-
176
- this.listenerCleanup.push(
177
- this.renderer.listen(this.host, 'luzmo-feedback-changed', (event: Event) => {
178
- const typed = event as CustomEvent<InteractiveVizItemFeedbackChangedEventDetail>;
179
- this.luzmoFeedbackChanged.emit(typed);
180
- })
181
- );
182
- }
183
- }
184
-
185
- /** The underlying custom element type for LuzmoInteractiveVizItem */
186
- export type LuzmoInteractiveVizItemElement = LuzmoInteractiveVizItemHostElement;
@@ -1,113 +0,0 @@
1
- import { booleanAttribute, ChangeDetectionStrategy, Component, DestroyRef, ElementRef, inject, Input, OnChanges, output, Renderer2, SimpleChanges } from '@angular/core';
2
- import '@luzmo/analytics-components-kit/item-grid';
3
- import type { LuzmoItemGridItemActionsMenu as LuzmoItemGridItemActionsMenuHostElement, ActionGroup } from '@luzmo/analytics-components-kit/item-grid';
4
- export type { Action, ActionGroup, AddGridItemInput, ClonedItemPositioning, DefaultActionType, GridItemActionEventDetail, GridItemData, GridItemPatch, GridItemPosition, GridItemPositionPatch, GridItemRenderer, GridItemSizePatch, GridItemStatesChangedEventDetail, GridLifecycleEventDetail, InputActionGroup, ItemStates } from '@luzmo/analytics-components-kit/item-grid';
5
- import type { Placement } from '@luzmo/lucero';
6
-
7
- @Component({
8
- selector: 'luzmo-item-grid-item-actions-menu',
9
- exportAs: 'luzmoItemGridItemActionsMenu',
10
- standalone: true,
11
- changeDetection: ChangeDetectionStrategy.OnPush,
12
- template: '<ng-content />'
13
- })
14
- /**
15
- * Angular wrapper component for <luzmo-item-grid-item-actions-menu>
16
- */
17
- export class LuzmoItemGridItemActionsMenu implements OnChanges {
18
- private readonly elementRef = inject<ElementRef<LuzmoItemGridItemActionsMenuHostElement>>(ElementRef);
19
- private readonly renderer = inject<Renderer2>(Renderer2);
20
- private readonly destroyRef = inject<DestroyRef>(DestroyRef);
21
- private readonly host = this.elementRef.nativeElement;
22
- private readonly listenerCleanup: Array<() => void> = [];
23
-
24
- /** The underlying custom element instance. Use to call imperative methods. */
25
- get nativeElement(): LuzmoItemGridItemActionsMenuHostElement {
26
- return this.host;
27
- }
28
-
29
- /** The preferred placement of the menu */
30
- @Input({ alias: 'placement' })
31
- placement?: Placement;
32
-
33
- /** The Actions to display in the menu */
34
- @Input({ alias: 'actions' })
35
- actions?: ActionGroup[];
36
-
37
- /** The language for UI labels. Supported values: 'en', 'nl', 'fr', 'de', 'es' */
38
- @Input({ alias: 'language' })
39
- language?: string;
40
-
41
- /** Disable this control. It will not receive focus or events */
42
- @Input({ alias: 'disabled', transform: booleanAttribute })
43
- disabled?: boolean;
44
-
45
- /** When this control is rendered, focus it automatically */
46
- @Input({ alias: 'autofocus', transform: booleanAttribute })
47
- autofocus?: boolean;
48
-
49
- /** The tab index to apply to this control. See general documentation about the tabindex HTML property */
50
- @Input({ alias: 'tabIndex' })
51
- tabIndex?: number;
52
-
53
- /** Fired when the user clicks an action in the menu; `detail` holds the action key, type, and active state. */
54
- readonly luzmoItemGridItemAction = output<CustomEvent<unknown>>({ alias: 'luzmoItemGridItemAction' });
55
-
56
- constructor() {
57
- this.bindEvents();
58
- this.destroyRef.onDestroy(() => {
59
- for (const cleanup of this.listenerCleanup) {
60
- cleanup();
61
- }
62
- });
63
- }
64
-
65
- ngOnChanges(changes: SimpleChanges): void {
66
- for (const key of Object.keys(changes)) {
67
- switch (key) {
68
- case 'placement':
69
- this.setHostProperty('placement', changes['placement'].currentValue);
70
- break;
71
- case 'actions':
72
- this.setHostProperty('actions', changes['actions'].currentValue);
73
- break;
74
- case 'language':
75
- this.setHostProperty('language', changes['language'].currentValue);
76
- break;
77
- case 'disabled':
78
- this.setHostProperty('disabled', changes['disabled'].currentValue);
79
- break;
80
- case 'autofocus':
81
- this.setHostProperty('autofocus', changes['autofocus'].currentValue);
82
- break;
83
- case 'tabIndex':
84
- this.setHostProperty('tabIndex', changes['tabIndex'].currentValue);
85
- break;
86
- default:
87
- break;
88
- }
89
- }
90
- }
91
-
92
- /**
93
- * Forward a wrapper @Input to the underlying host element via Renderer2 so
94
- * the wrapper stays compatible with non-DOM Angular platforms (SSR, tests).
95
- * Unlike a "skip undefined" guard, this lets consumers reset values back to
96
- * undefined / null by clearing their bindings.
97
- */
98
- private setHostProperty(key: string, value: unknown): void {
99
- this.renderer.setProperty(this.host, key, value);
100
- }
101
-
102
- private bindEvents(): void {
103
- this.listenerCleanup.push(
104
- this.renderer.listen(this.host, 'luzmo-item-grid-item-action', (event: Event) => {
105
- const typed = event as CustomEvent<unknown>;
106
- this.luzmoItemGridItemAction.emit(typed);
107
- })
108
- );
109
- }
110
- }
111
-
112
- /** The underlying custom element type for LuzmoItemGridItemActionsMenu */
113
- export type LuzmoItemGridItemActionsMenuElement = LuzmoItemGridItemActionsMenuHostElement;