@luzmo/analytics-components-kit 1.0.1-alpha.48 → 1.0.1-alpha.49

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 (191) hide show
  1. package/components/{bar-chart-options.config-BdbbHUJZ.js → bar-chart-options.config-D1mb5TDl.js} +1 -0
  2. package/components/{bar-chart-options.config-C9XGEujs.cjs → bar-chart-options.config-DcxEkOT5.cjs} +1 -1
  3. package/components/{bar-chart-options.de-DwTn_qfu.js → bar-chart-options.de-BQ4qGaQc.js} +1 -0
  4. package/components/{bar-chart-options.de-BGzu5Zgd.cjs → bar-chart-options.de-Dr5zKz8Q.cjs} +1 -1
  5. package/components/{column-chart-options.en-D1UfGsS3.cjs → bar-chart-options.en-DdQ2PYrw.cjs} +1 -1
  6. package/components/{bar-chart-options.en-Crc8tYUJ.js → bar-chart-options.en-LjG6f4hw.js} +1 -0
  7. package/components/{bar-chart-options.es-ByT_D06p.js → bar-chart-options.es-BfIKCPf-.js} +1 -0
  8. package/components/{bar-chart-options.es-B2UWafXc.cjs → bar-chart-options.es-DgYVxn9U.cjs} +1 -1
  9. package/components/{bar-chart-options.fr-BwiGRlQf.js → bar-chart-options.fr-Cg1lQV2y.js} +1 -0
  10. package/components/{bar-chart-options.fr-CP7DTrlk.cjs → bar-chart-options.fr-rteFm93C.cjs} +1 -1
  11. package/components/{column-chart-options.nl-3wAj9uWY.cjs → bar-chart-options.nl--gwlkpc0.cjs} +1 -1
  12. package/components/{bar-chart-options.nl-DzXnHdwX.js → bar-chart-options.nl-CB2W4rzf.js} +1 -0
  13. package/components/{calculate-data-item-icon-DlfbBvFN.cjs → calculate-data-item-icon-Dn-9Kd0U.cjs} +1 -1
  14. package/components/{calculate-data-item-icon-BiIL_s4Z.js → calculate-data-item-icon-Dpvf1aLI.js} +51 -51
  15. package/components/{column-chart-options.config-BqSQ1Sl9.js → column-chart-options.config-B5SjBVdy.js} +10 -9
  16. package/components/{column-chart-options.config-Bi0RAzK-.cjs → column-chart-options.config-BjDvA7i9.cjs} +1 -1
  17. package/components/{column-chart-options.de-pgdcIHqk.cjs → column-chart-options.de-BU__cJy3.cjs} +1 -1
  18. package/components/{column-chart-options.de-VQVdi8aP.js → column-chart-options.de-BkkWD9rB.js} +1 -0
  19. package/components/{bar-chart-options.en-D1UfGsS3.cjs → column-chart-options.en-DdQ2PYrw.cjs} +1 -1
  20. package/components/{column-chart-options.en-Crc8tYUJ.js → column-chart-options.en-LjG6f4hw.js} +1 -0
  21. package/components/{column-chart-options.es-CT9ZtjV_.js → column-chart-options.es-BgOc-gTh.js} +1 -0
  22. package/components/{column-chart-options.es-CAAXJv_2.cjs → column-chart-options.es-CkaTU6qn.cjs} +1 -1
  23. package/components/{column-chart-options.fr-BwiGRlQf.js → column-chart-options.fr-Cg1lQV2y.js} +1 -0
  24. package/components/{column-chart-options.fr-CP7DTrlk.cjs → column-chart-options.fr-rteFm93C.cjs} +1 -1
  25. package/components/{bar-chart-options.nl-DZe2pKRa.cjs → column-chart-options.nl-Bhe6rcUo.cjs} +1 -1
  26. package/components/{column-chart-options.nl-DB2dcotu.js → column-chart-options.nl-CAeBYwQC.js} +1 -0
  27. package/components/{de-eIqMhTVC.cjs → de-Cxe7xkT4.cjs} +1 -1
  28. package/components/{de-BbcctJsI.js → de-ZPzjN2kc.js} +0 -1
  29. package/components/directive-BOOaQO_r.cjs +24 -0
  30. package/components/directive-CF_9GVrT.js +46 -0
  31. package/components/display-settings/display-settings.d.ts +2 -2
  32. package/components/display-settings/index.cjs +1 -1
  33. package/components/display-settings/index.js +2 -2
  34. package/components/display-settings-binning/index.cjs +1 -1
  35. package/components/display-settings-binning/index.js +11 -11
  36. package/components/display-settings-datetime/index.cjs +1 -1
  37. package/components/display-settings-datetime/index.js +13 -13
  38. package/components/display-settings-grand-totals/index.cjs +1 -1
  39. package/components/display-settings-grand-totals/index.js +11 -11
  40. package/components/display-settings-numeric/display-settings-numeric.d.ts +3 -1
  41. package/components/display-settings-numeric/index.cjs +61 -40
  42. package/components/display-settings-numeric/index.js +223 -182
  43. package/components/display-settings-period-over-period/index.cjs +6 -6
  44. package/components/display-settings-period-over-period/index.js +11 -11
  45. package/components/draggable-data-item/draggable-data-item.d.ts +1 -0
  46. package/components/draggable-data-item/index.cjs +8 -5
  47. package/components/draggable-data-item/index.js +44 -38
  48. package/components/draggable-data-item-level/draggable-data-item-level.d.ts +4 -0
  49. package/components/draggable-data-item-level/index.cjs +10 -10
  50. package/components/draggable-data-item-level/index.js +102 -77
  51. package/components/droppable-slot/droppable-slot.d.ts +29 -9
  52. package/components/droppable-slot/index.cjs +25 -71
  53. package/components/droppable-slot/index.js +274 -623
  54. package/components/edit-item/index.cjs +2 -2
  55. package/components/edit-item/index.js +18 -18
  56. package/components/edit-option/index.cjs +1 -1
  57. package/components/edit-option/index.js +2 -2
  58. package/components/edit-option-action-button-group/index.cjs +1 -1
  59. package/components/edit-option-action-button-group/index.js +6 -6
  60. package/components/{edit-option-base-D25zHZVl.js → edit-option-base-CG0JcbX9.js} +3 -3
  61. package/components/{edit-option-base-h5ndfVK4.cjs → edit-option-base-a2yoNqdf.cjs} +1 -1
  62. package/components/edit-option-color-palette-picker/index.cjs +1 -1
  63. package/components/edit-option-color-palette-picker/index.js +3 -3
  64. package/components/edit-option-color-picker/index.cjs +1 -1
  65. package/components/edit-option-color-picker/index.js +5 -5
  66. package/components/edit-option-color-range/index.cjs +1 -1
  67. package/components/edit-option-color-range/index.js +12 -12
  68. package/components/edit-option-multi-language-field/index.cjs +1 -1
  69. package/components/edit-option-multi-language-field/index.js +4 -4
  70. package/components/edit-option-number-field/index.cjs +1 -1
  71. package/components/edit-option-number-field/index.js +5 -5
  72. package/components/edit-option-picker/index.cjs +1 -1
  73. package/components/edit-option-picker/index.js +5 -5
  74. package/components/edit-option-position-picker/index.cjs +1 -1
  75. package/components/edit-option-position-picker/index.js +4 -4
  76. package/components/edit-option-positions-number-field/index.cjs +1 -1
  77. package/components/edit-option-positions-number-field/index.js +6 -6
  78. package/components/edit-option-radio-button-group/index.cjs +1 -1
  79. package/components/edit-option-radio-button-group/index.js +4 -4
  80. package/components/edit-option-slider/index.cjs +1 -1
  81. package/components/edit-option-slider/index.js +3 -3
  82. package/components/edit-option-switch/index.cjs +1 -1
  83. package/components/edit-option-switch/index.js +3 -3
  84. package/components/edit-option-text-field/index.cjs +1 -1
  85. package/components/edit-option-text-field/index.js +7 -7
  86. package/components/{es-tWaYVbsQ.cjs → es-4dEouIgb.cjs} +1 -1
  87. package/components/{es-ByWFTJ0s.js → es-C0JGlz18.js} +0 -1
  88. package/components/filter-data-item-picker/index.cjs +1 -1
  89. package/components/filter-data-item-picker/index.js +8 -8
  90. package/components/filter-expression-picker/index.cjs +1 -1
  91. package/components/filter-expression-picker/index.js +2 -2
  92. package/components/filter-item/index.cjs +1 -1
  93. package/components/filter-item/index.js +24 -24
  94. package/components/filter-value-picker/index.cjs +1 -1
  95. package/components/filter-value-picker/index.js +4 -4
  96. package/components/filter-value-picker-datetime/index.cjs +1 -1
  97. package/components/filter-value-picker-datetime/index.js +302 -302
  98. package/components/filter-value-picker-hierarchy/index.cjs +1 -1
  99. package/components/filter-value-picker-hierarchy/index.js +8 -8
  100. package/components/filter-value-picker-numeric/index.cjs +1 -1
  101. package/components/filter-value-picker-numeric/index.js +8 -8
  102. package/components/{focusable-Bhf_beoW.js → focusable-BbymtxWI.js} +1 -1
  103. package/components/{focusable-B8t8a-WJ.cjs → focusable-DAGGGYyz.cjs} +1 -1
  104. package/components/{fr-C5b2Wgoz.js → fr-B_-_f-VN.js} +0 -1
  105. package/components/{fr-2igiTsHU.cjs → fr-Dwulhlbi.cjs} +1 -1
  106. package/components/grid/index.cjs +18 -22
  107. package/components/grid/index.js +28 -49
  108. package/components/{if-defined-Dg09naf2.js → if-defined-Barg9gGQ.js} +1 -1
  109. package/components/{if-defined-DjdbEoAa.cjs → if-defined-wiCAR_aA.cjs} +1 -1
  110. package/components/{index-cbfU96gS.cjs → index-1oIrlkAr.cjs} +8 -8
  111. package/components/{index-BqSQoHjg.js → index-5Z9GD60H.js} +6 -6
  112. package/components/{index-9LxnqLJa.js → index-B2ngKWOI.js} +2 -2
  113. package/components/{index-COU9XhBt.js → index-BC1LV3vH.js} +1 -1
  114. package/components/{index-Cf_a7VrO.js → index-BEtf1WaQ.js} +2 -2
  115. package/components/{index-DMhm0FM8.cjs → index-BbpsZYZF.cjs} +25 -26
  116. package/components/{index-DRLFjkH0.cjs → index-BfzppmHn.cjs} +2 -2
  117. package/components/{index-BobhBKA2.js → index-BssHAgUU.js} +1 -1
  118. package/components/index-Bt3JTHTC.js +787 -0
  119. package/components/index-CY_cyFdI.cjs +174 -0
  120. package/components/{index-DeIay7ZE.js → index-CbuHBIDB.js} +2 -2
  121. package/components/{index-BukPAqqU.cjs → index-Ck5VRoXN.cjs} +1 -1
  122. package/components/{index-DYmi-X87.js → index-DE3d0E0P.js} +2 -2
  123. package/components/{index-fwJBhawL.cjs → index-DSQyBS9Z.cjs} +1 -1
  124. package/components/{index-BY1yDIAI.js → index-DTI4dIyd.js} +586 -634
  125. package/components/index-D_jFGBMs.js +174 -0
  126. package/components/{index-D9yzIoGv.js → index-Delpl7qa.js} +368 -306
  127. package/components/{index-B7AFYrfv.cjs → index-Df-_TbOD.cjs} +1 -1
  128. package/components/{index-C6NpWavw.js → index-DsP81c4M.js} +2 -2
  129. package/components/index-Dy_5M3M5.cjs +42 -0
  130. package/components/{index-Bpdwb9Js.cjs → index-MPM_B4re.cjs} +3 -3
  131. package/components/{index-ydBgjAru.js → index-N845QLku.js} +16 -16
  132. package/components/{index--3gSNupB.cjs → index-Tx5oQjbt.cjs} +1 -1
  133. package/components/{index-BSgp4MWQ.cjs → index-cHKqEi5-.cjs} +1 -1
  134. package/components/index-eBsINoH9.cjs +20 -0
  135. package/components/{index-BKx2WhDB.cjs → index-tXl_aMnZ.cjs} +1 -1
  136. package/components/index.cjs +1 -1
  137. package/components/index.js +4 -4
  138. package/components/{localized-decorator-DNr1P1m0.js → localized-decorator-Bl5gcI6n.js} +1 -1
  139. package/components/{localized-decorator-SOrjcPab.cjs → localized-decorator-DIXYZ3RL.cjs} +1 -1
  140. package/components/{luzmo-icons-4Tmb3sKr.js → luzmo-icons-CVeTZ59u.js} +9 -9
  141. package/components/{luzmo-icons-4nDFv1Lq-D6-m-VWM.cjs → luzmo-icons-DbwDQtuO-DSQ-uVxy.cjs} +2 -2
  142. package/components/{luzmo-icons-4nDFv1Lq-DffGNBpO.js → luzmo-icons-DbwDQtuO-QG0fLECn.js} +7 -7
  143. package/components/{luzmo-icons-Bvm-_ECi.cjs → luzmo-icons-DonyjSXg.cjs} +1 -1
  144. package/components/{nl-B50x7wMn.cjs → nl-DxdBIXDd.cjs} +1 -1
  145. package/components/{nl-76jn_zMH.js → nl-gdQCG4WV.js} +0 -1
  146. package/components/{periods.const-CfXsouLz.cjs → periods.const-7sXlqgEo.cjs} +1 -1
  147. package/components/{periods.const-C89NNRX-.js → periods.const-B7FKokcH.js} +1 -1
  148. package/components/property-Cu4Q1hS4.cjs +42 -0
  149. package/components/{property-BFMfZY1k.js → property-DCzt3DR1.js} +277 -277
  150. package/components/{set-locale-Cam8nRIW.cjs → set-locale-DCPlazsZ.cjs} +1 -1
  151. package/components/{set-locale-DbEAMqUs.js → set-locale-GI34z_M7.js} +1 -1
  152. package/components/{sized-mixin-CkdMApAU.js → sized-mixin-BGzkX2g1.js} +1 -1
  153. package/components/{sized-mixin-C48t6K7U.cjs → sized-mixin-j_7aJM4b.cjs} +1 -1
  154. package/components/slot-contents-picker/index.cjs +1 -1
  155. package/components/slot-contents-picker/index.js +16 -16
  156. package/components/slot-menu/index.cjs +27 -22
  157. package/components/slot-menu/index.js +237 -148
  158. package/components/slot-menu/slot-menu.d.ts +34 -12
  159. package/components/slot-menu-list/index.cjs +1 -1
  160. package/components/slot-menu-list/index.js +5 -5
  161. package/components/{state-CuE7TJCY.cjs → state-fyl3IYMu.cjs} +1 -1
  162. package/components/{state-BSTa7W6f.js → state-nDsQPund.js} +1 -1
  163. package/components/{task-CDsB8Kbr.js → task-Bh_X-xIU.js} +1 -1
  164. package/components/{task-0B-FC3rj.cjs → task-CwmAXlv0.cjs} +1 -1
  165. package/components/{text-field-ol9Ed5lQ-cRqtIf_0.cjs → text-field-BIADXoLC-B8w9TVmS.cjs} +1 -1
  166. package/components/{text-field-ol9Ed5lQ-DbpeM4EP.js → text-field-BIADXoLC-B9oE05VF.js} +1 -1
  167. package/custom-elements.json +226 -41
  168. package/item-definitions/bar-chart/i18n/bar-chart-options.de.d.ts +1 -0
  169. package/item-definitions/bar-chart/i18n/bar-chart-options.en.d.ts +1 -0
  170. package/item-definitions/bar-chart/i18n/bar-chart-options.es.d.ts +1 -0
  171. package/item-definitions/bar-chart/i18n/bar-chart-options.fr.d.ts +1 -0
  172. package/item-definitions/bar-chart/i18n/bar-chart-options.nl.d.ts +1 -0
  173. package/item-definitions/box-plot/box-plot-options.config.d.ts +1 -1
  174. package/item-definitions/choropleth-map/choropleth-map-options.config.d.ts +1 -1
  175. package/item-definitions/column-chart/i18n/column-chart-options.de.d.ts +1 -0
  176. package/item-definitions/column-chart/i18n/column-chart-options.en.d.ts +1 -0
  177. package/item-definitions/column-chart/i18n/column-chart-options.es.d.ts +1 -0
  178. package/item-definitions/column-chart/i18n/column-chart-options.fr.d.ts +1 -0
  179. package/item-definitions/column-chart/i18n/column-chart-options.nl.d.ts +1 -0
  180. package/item-definitions/hexbin-map/hexbin-map-options.config.d.ts +1 -1
  181. package/item-definitions/route-map/route-map-options.config.d.ts +1 -1
  182. package/item-definitions/spike-map/spike-map-options.config.d.ts +1 -1
  183. package/package.json +1 -1
  184. package/utils/data-broker/index.d.ts +9 -0
  185. package/utils/store/slot-store.d.ts +9 -3
  186. package/components/index-Be-pSgzQ.js +0 -174
  187. package/components/index-DCdx3dxQ.cjs +0 -42
  188. package/components/index-PGX2p9Ns.js +0 -304
  189. package/components/index-TQG9Xdxu.cjs +0 -20
  190. package/components/index-VHrmgynd.cjs +0 -121
  191. package/components/property-BV1QaY8E.cjs +0 -42
@@ -41,6 +41,7 @@ declare const _default: {
41
41
  tooltip: string;
42
42
  enum: {
43
43
  none: string;
44
+ absolute: string;
44
45
  percentage: string;
45
46
  percentageLegend: string;
46
47
  percentageCategory: string;
@@ -41,6 +41,7 @@ declare const _default: {
41
41
  tooltip: string;
42
42
  enum: {
43
43
  none: string;
44
+ absolute: string;
44
45
  percentage: string;
45
46
  percentageLegend: string;
46
47
  percentageCategory: string;
@@ -41,6 +41,7 @@ declare const _default: {
41
41
  tooltip: string;
42
42
  enum: {
43
43
  none: string;
44
+ absolute: string;
44
45
  percentage: string;
45
46
  percentageLegend: string;
46
47
  percentageCategory: string;
@@ -190,7 +190,7 @@ declare const _default: ({
190
190
  label: string;
191
191
  default: string;
192
192
  enum: string[];
193
- calculateValue: ({ options }: any) => "divergent" | "qualitative" | "sequential" | "heat" | "manual";
193
+ calculateValue: ({ options }: any) => "manual" | "divergent" | "qualitative" | "sequential" | "heat";
194
194
  toOptions: ({ options, value }: any) => any;
195
195
  min?: undefined;
196
196
  max?: undefined;
@@ -154,7 +154,7 @@ declare const _default: ({
154
154
  label: string;
155
155
  default: string;
156
156
  enum: string[];
157
- calculateValue: ({ options }: any) => "divergent" | "qualitative" | "sequential" | "heat" | "manual";
157
+ calculateValue: ({ options }: any) => "manual" | "divergent" | "qualitative" | "sequential" | "heat";
158
158
  toOptions: ({ options, value }: any) => any;
159
159
  min?: undefined;
160
160
  max?: undefined;
@@ -41,6 +41,7 @@ declare const _default: {
41
41
  tooltip: string;
42
42
  enum: {
43
43
  none: string;
44
+ absolute: string;
44
45
  percentage: string;
45
46
  percentageLegend: string;
46
47
  percentageCategory: string;
@@ -41,6 +41,7 @@ declare const _default: {
41
41
  tooltip: string;
42
42
  enum: {
43
43
  none: string;
44
+ absolute: string;
44
45
  percentage: string;
45
46
  percentageLegend: string;
46
47
  percentageCategory: string;
@@ -41,6 +41,7 @@ declare const _default: {
41
41
  tooltip: string;
42
42
  enum: {
43
43
  none: string;
44
+ absolute: string;
44
45
  percentage: string;
45
46
  percentageLegend: string;
46
47
  percentageCategory: string;
@@ -41,6 +41,7 @@ declare const _default: {
41
41
  tooltip: string;
42
42
  enum: {
43
43
  none: string;
44
+ absolute: string;
44
45
  percentage: string;
45
46
  percentageLegend: string;
46
47
  percentageCategory: string;
@@ -41,6 +41,7 @@ declare const _default: {
41
41
  tooltip: string;
42
42
  enum: {
43
43
  none: string;
44
+ absolute: string;
44
45
  percentage: string;
45
46
  percentageLegend: string;
46
47
  percentageCategory: string;
@@ -176,7 +176,7 @@ declare const _default: ({
176
176
  label: string;
177
177
  default: string;
178
178
  enum: string[];
179
- calculateValue: ({ options }: any) => "divergent" | "qualitative" | "sequential" | "heat" | "manual";
179
+ calculateValue: ({ options }: any) => "manual" | "divergent" | "qualitative" | "sequential" | "heat";
180
180
  toOptions: ({ options, value }: any) => any;
181
181
  min?: undefined;
182
182
  max?: undefined;
@@ -190,7 +190,7 @@ declare const _default: ({
190
190
  label: string;
191
191
  default: string;
192
192
  enum: string[];
193
- calculateValue: ({ options }: any) => "divergent" | "qualitative" | "sequential" | "heat" | "manual";
193
+ calculateValue: ({ options }: any) => "manual" | "divergent" | "qualitative" | "sequential" | "heat";
194
194
  toOptions: ({ options, value }: any) => any;
195
195
  min?: undefined;
196
196
  max?: undefined;
@@ -171,7 +171,7 @@ declare const _default: ({
171
171
  label: string;
172
172
  default: string;
173
173
  enum: string[];
174
- calculateValue: ({ options }: any) => "divergent" | "qualitative" | "sequential" | "heat" | "manual";
174
+ calculateValue: ({ options }: any) => "manual" | "divergent" | "qualitative" | "sequential" | "heat";
175
175
  toOptions: ({ options, value }: any) => any;
176
176
  hideLabel?: undefined;
177
177
  editRangeSize?: undefined;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@luzmo/analytics-components-kit",
3
- "version": "1.0.1-alpha.48",
3
+ "version": "1.0.1-alpha.49",
4
4
  "type": "module",
5
5
  "main": "./components/index.js",
6
6
  "module": "./components/index.js",
@@ -82,6 +82,7 @@ export declare class DataBroker {
82
82
  private authToken;
83
83
  private queryClient;
84
84
  private static instance;
85
+ private availableDatasets;
85
86
  constructor(config?: DataBrokerConfig);
86
87
  /**
87
88
  * Set API configuration
@@ -174,6 +175,14 @@ export declare class DataBroker {
174
175
  * @returns Singleton instance
175
176
  */
176
177
  static getInstance(config?: DataBrokerConfig): DataBroker;
178
+ fetchDatasetsRecursive(initialDatasetIds: string[]): Promise<any[]>;
179
+ private postProcessDatasetMetadata;
180
+ getAvailableDatasets(): {
181
+ id: string;
182
+ name: string;
183
+ columns: any[];
184
+ }[];
185
+ getLinkedDatasetIds(datasetId: string): string[];
177
186
  }
178
187
  export declare const dataBroker: DataBroker;
179
188
  export default DataBroker;
@@ -1,17 +1,23 @@
1
- import { GenericSlotContent } from '@luzmo/dashboard-contents-types';
1
+ import { GenericSlotContent, SlotName, VizItemSlots, VizItemType } from '@luzmo/dashboard-contents-types';
2
2
  export type SlotContent = GenericSlotContent;
3
3
  export declare class SlotStore {
4
4
  /**
5
5
  * Holds all contents for this droppable slot.
6
6
  */
7
7
  readonly slotContents: import("signal-polyfill").Signal.State<GenericSlotContent[]>;
8
+ readonly slotsContents: import("signal-polyfill").Signal.State<VizItemSlots>;
9
+ readonly periodOverPeriodEnabled: import("signal-polyfill").Signal.State<boolean>;
10
+ private readonly _popEnabledChartTypes;
11
+ readonly activeSlotContents: import("signal-polyfill").Signal.Computed<GenericSlotContent>;
8
12
  /**
9
13
  * Index of the content currently selected / active in a slot menu.
10
14
  */
11
15
  readonly activeIndex: import("signal-polyfill").Signal.State<number>;
12
- get activeContent(): SlotContent | undefined;
16
+ private isArrayColumnType;
17
+ setPeriodOverPeriodEnabled(itemType: VizItemType): boolean;
13
18
  /** Replace the full list (e.g. after dropping or re-ordering). */
14
- setContents(contents: SlotContent[]): void;
19
+ setContents(contents: SlotContent[], slotName?: SlotName): void;
20
+ setFullContents(fullSlotsContents: VizItemSlots): void;
15
21
  /** Change which item is considered active (e.g. user clicked in list). */
16
22
  updateActive(index: number): void;
17
23
  /** Update / overwrite a single content entry. */
@@ -1,174 +0,0 @@
1
- /*! * A kit of modern Luzmo Web Components for analytics in your web application.
2
- *
3
- * Copyright © 2025 Luzmo
4
- * All rights reserved.
5
- * Luzmo web components (“Luzmo Web Components”)
6
- * must be used according to the Luzmo Terms of Service.
7
- * This license allows users with a current active Luzmo account
8
- * to use the Luzmo Web Components. This license terminates
9
- * automatically if a user no longer has an active Luzmo account.
10
- * Please view the Luzmo Terms of Service at: https://www.luzmo.com/information-pages/terms-of-use.
11
- *
12
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
13
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
14
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
15
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
16
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
17
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
18
- * SOFTWARE.
19
- * */
20
- import { D as b, V as s } from "./luzmo-icons-4nDFv1Lq-DffGNBpO.js";
21
- import { m as g, a as m, R as h, z as a } from "./base-D76d76ww-BGkuhs54.js";
22
- import { a as v } from "./button-base-DbkDzb71-Dh2Out91.js";
23
- /*! * Lucero - The design system for Luzmo.
24
- *
25
- * Copyright © 2025 Luzmo
26
- * All rights reserved.
27
- * Lucero (“Luzmo Design System”) must be used according to the Luzmo Terms of Service.
28
- * This license allows users with a current active Luzmo account to use Lucero.
29
- * This license terminates automatically if a user no longer has an active Luzmo account.
30
- * Please view the Luzmo Terms of Service at: https://www.luzmo.com/information-pages/terms-of-use.
31
- *
32
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
33
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
34
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
35
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
36
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
37
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
38
- * SOFTWARE.
39
- * */
40
- const z = () => {
41
- if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
42
- const c = document.createElement("style");
43
- c.setAttribute("data-luzmo-vars", ""), c.textContent = 'html{--luzmo-animation-duration: 0.15s;--luzmo-border-color: rgba(var(--luzmo-border-color-rgb), 0.1);--luzmo-border-color-hover: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-down: rgba(var(--luzmo-border-color-rgb), 0.3);--luzmo-border-color-focus: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-rgb: 0, 0, 0;--luzmo-border-color-full: rgb(180, 180, 180);--luzmo-border-color-full-hover: rgb(140, 140, 140);--luzmo-border-color-full-down: rgb(110, 110, 110);--luzmo-border-color-full-focus: rgb(140, 140, 140);--luzmo-border-color-disabled: #dddddd;--luzmo-border-radius: 6px;--luzmo-border-radius-s: 4px;--luzmo-border-radius-l: 8px;--luzmo-border-radius-xl: 12px;--luzmo-border-radius-full: 999rem;--luzmo-background-color: #ffffff;--luzmo-background-color-rgb: 255, 255, 255;--luzmo-background-color-disabled: #eeeeee;--luzmo-background-color-hover: #f0f0fc;--luzmo-background-color-down: #f1f1ff;--luzmo-background-color-focus: #f0f0fc;--luzmo-background-color-highlight: rgb(240, 240, 240);--luzmo-background-color-highlight-disabled: rgb(245, 245, 245);--luzmo-background-color-highlight-hover: rgb(225, 225, 225);--luzmo-background-color-highlight-down: rgb(215, 215, 215);--luzmo-background-color-highlight-focus: rgb(225, 225, 225);--luzmo-border-width: 1px;--luzmo-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Helvetica, Arial, sans-serif;--luzmo-font-size-xs: 10px;--luzmo-font-size-s: 12px;--luzmo-font-size-m: 14px;--luzmo-font-size: 14px;--luzmo-font-size-l: 16px;--luzmo-font-size-xl: 18px;--luzmo-font-size-xxl: 20px;--luzmo-font-style: normal;--luzmo-line-height: normal;--luzmo-font-weight: 400;--luzmo-font-weight-semibold: 500;--luzmo-font-weight-bold: 600;--luzmo-font-color: #333;--luzmo-font-color-hard: #000;--luzmo-font-color-disabled: var(--luzmo-disabled-color);--luzmo-font-color-extra-dimmed: #888;--luzmo-font-color-hover: #333;--luzmo-font-color-down: #111;--luzmo-font-color-focus: #333;--luzmo-primary: #4434ff;--luzmo-primary-hover: #4234e4;--luzmo-primary-down: #392cc7;--luzmo-primary-focus: #4234e4;--luzmo-primary-inverse-color: #ffffff;--luzmo-primary-rgb: 68, 52, 255;--luzmo-secondary: #ff00ff;--luzmo-secondary-hover: #e309e3;--luzmo-secondary-down: #c711c7;--luzmo-secondary-focus: #e309e3;--luzmo-secondary-inverse-color: #ffffff;--luzmo-secondary-rgb: 255, 0, 255;--luzmo-negative-color: #ca221c;--luzmo-negative-color-hover: #b3241f;--luzmo-negative-color-down: #9f231f;--luzmo-negative-color-focus: #b3241f;--luzmo-negative-color-rgb: 202, 34, 28;--luzmo-positive-color: rgb(20, 150, 101);--luzmo-positive-color-hover: rgb(17, 128, 86);--luzmo-positive-color-down: rgb(16, 105, 71);--luzmo-positive-color-focus: rgb(17, 128, 86);--luzmo-positive-color-rgb: 20, 150, 101;--luzmo-selected-color: rgb(110, 110, 110);--luzmo-selected-color-hover: rgb(70, 70, 70);--luzmo-selected-color-down: rgb(40, 40, 40);--luzmo-selected-color-focus: rgb(70, 70, 70);--luzmo-selected-color-hard: #1e1e1e;--luzmo-selected-color-hard-hover: rgb(0, 0, 0);--luzmo-selected-color-hard-down: rgb(0, 0, 0);--luzmo-selected-color-hard-focus: rgb(0, 0, 0);--luzmo-informative-color: #1a77e9;--luzmo-informative-color-rgb: 26, 119, 233;--luzmo-disabled-color: #aaaaaa;--luzmo-spacing-1: 2px;--luzmo-spacing-2: 4px;--luzmo-spacing-3: 8px;--luzmo-spacing-4: 12px;--luzmo-spacing-5: 16px;--luzmo-indicator-gap: 2px;--luzmo-indicator-width: 1px;--luzmo-indicator-color: var(--luzmo-primary);--luzmo-component-height-xxs: 20px;--luzmo-component-height-xs: 24px;--luzmo-component-height-s: 28px;--luzmo-component-height: 32px;--luzmo-component-height-l: 40px;--luzmo-component-height-xl: 48px;--luzmo-component-height-xxl: 64px;--luzmo-icon-size-xxs: 12px;--luzmo-icon-size-xs: 14px;--luzmo-icon-size-s: 16px;--luzmo-icon-size-m: 18px;--luzmo-icon-size-l: 20px;--luzmo-icon-size-xl: 22px;--luzmo-icon-size-xxl: 32px}', document.head.appendChild(c);
44
- }
45
- };
46
- z();
47
- const f = ':host{cursor:pointer;-webkit-user-select:none;user-select:none;box-sizing:border-box;font-family:var(--luzmo-button-font-family, var(--luzmo-sans-font-family-stack, var(--luzmo-font-family)));-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:var(--luzmo-button-line-height, var(--luzmo-line-height-100, var(--line-height-100)));text-transform:none;vertical-align:top;-webkit-appearance:button;transition:background var(--luzmo-button-animation-duration, var(--luzmo-animation-duration-100, var(--animation-duration-100))) ease-out,border-color var(--luzmo-button-animation-duration, var(--luzmo-animation-duration-100, var(--animation-duration-100))) ease-out,color var(--luzmo-button-animation-duration, var(--luzmo-animation-duration-100, var(--animation-duration-100))) ease-out,box-shadow var(--luzmo-button-animation-duration, var(--luzmo-animation-duration-100, var(--animation-duration-100))) ease-out;border-style:solid;justify-content:center;align-items:center;margin:0;-webkit-text-decoration:none;text-decoration:none;display:inline-flex;overflow:visible}:host(:focus){outline:none}:host([disabled]){cursor:default}::slotted([slot=icon]){max-block-size:100%;flex-shrink:0;display:flex;align-items:center;justify-content:center}#label{text-align:center;place-self:center}#label:empty{display:none}@media (forced-colors: active){:host{--highcontrast-action-button-focus-indicator-color: ButtonText}:host:after{forced-color-adjust:none}:host([selected]){--highcontrast-action-button-background-color-default: Highlight;--highcontrast-action-button-background-color-hover: Highlight;--highcontrast-action-button-background-color-focus: Highlight;--highcontrast-action-button-background-color-down: Highlight;--highcontrast-action-button-background-color-disabled: ButtonFace;--highcontrast-action-button-border-color-default: HighlightText;--highcontrast-action-button-border-color-hover: HighlightText;--highcontrast-action-button-border-color-focus: HighlightText;--highcontrast-action-button-border-color-down: HighlightText;--highcontrast-action-button-border-color-disabled: GrayText;--highcontrast-action-button-content-color-default: HighlightText;--highcontrast-action-button-content-color-hover: HighlightText;--highcontrast-action-button-content-color-focus: HighlightText;--highcontrast-action-button-content-color-down: HighlightText;--highcontrast-action-button-content-color-disabled: GrayText}:host([selected]) .hold-affordance,:host([selected]) ::slotted([slot=icon]),:host([selected]) #label{forced-color-adjust:none}}:host{--action-button-focus-indicator-border-radius: calc( var(--action-button-border-radius) + var(--action-button-focus-indicator-gap) );--action-button-edge-to-visual: calc( var(--action-button-edge-to-visual-size) - var(--action-button-border-width) );--action-button-edge-to-text: calc( var(--action-button-edge-to-text-size) - var(--action-button-border-width) );--action-button-edge-to-visual-only: calc( var(--action-button-edge-to-visual-only-size) - var( --action-button-border-width ) );min-inline-size:var(--luzmo-action-button-min-width, var(--action-button-min-width));block-size:var(--luzmo-action-button-height, var(--action-button-height));border-radius:var(--luzmo-action-button-border-radius, var(--action-button-border-radius));border-width:var(--luzmo-action-button-border-width, var(--action-button-border-width));gap:calc(var(--luzmo-action-button-text-to-visual, var(--action-button-text-to-visual)) + var(--luzmo-action-button-edge-to-text, var(--action-button-edge-to-text)) - var(--luzmo-action-button-edge-to-visual-only, var(--action-button-edge-to-visual-only)));padding-inline:var(--luzmo-action-button-edge-to-text, var(--action-button-edge-to-text));background-color:var(--highcontrast-action-button-background-color-default, var(--luzmo-action-button-background-color-default, var(--action-button-background-color-default)));border-color:var(--highcontrast-action-button-border-color-default, var(--luzmo-action-button-border-color-default, var(--action-button-border-color-default)));color:var(--highcontrast-action-button-content-color-default, var(--luzmo-action-button-content-color-default, var(--action-button-content-color-default)));position:relative}:host:dir(rtl),:host([dir=rtl]){--logical-rotation: matrix(-1, 0, 0, 1, 0, 0)}@media (hover: hover){:host(:hover){background-color:var(--highcontrast-action-button-background-color-hover, var(--luzmo-action-button-background-color-hover, var(--action-button-background-color-hover)));border-color:var(--highcontrast-action-button-border-color-hover, var(--luzmo-action-button-border-color-hover, var(--action-button-border-color-hover)));color:var(--highcontrast-action-button-content-color-hover, var(--luzmo-action-button-content-color-hover, var(--action-button-content-color-hover)))}}:host(:focus-visible){background-color:var(--highcontrast-action-button-background-color-focus, var(--luzmo-action-button-background-color-focus, var(--action-button-background-color-focus)));border-color:var(--highcontrast-action-button-border-color-focus, var(--luzmo-action-button-border-color-focus, var(--action-button-border-color-focus)));color:var(--highcontrast-action-button-content-color-focus, var(--luzmo-action-button-content-color-focus, var(--action-button-content-color-focus)))}:host(:is(:active,[active])){background-color:var(--highcontrast-action-button-background-color-down, var(--luzmo-action-button-background-color-down, var(--action-button-background-color-down)));border-color:var(--highcontrast-action-button-border-color-down, var(--luzmo-action-button-border-color-down, var(--action-button-border-color-down)));color:var(--highcontrast-action-button-content-color-down, var(--luzmo-action-button-content-color-down, var(--action-button-content-color-down)))}:host([disabled]){background-color:var(--highcontrast-action-button-background-color-disabled, var(--luzmo-action-button-background-color-disabled, var(--action-button-background-color-disabled)));border-color:var(--highcontrast-action-button-border-color-disabled, var(--luzmo-action-button-border-color-disabled, var(--action-button-border-color-disabled)));color:var(--highcontrast-action-button-content-color-disabled, var(--luzmo-action-button-content-color-disabled, var(--action-button-content-color-disabled)))}:host([selected]){--luzmo-action-button-background-color-default: var( --luzmo-action-button-background-color-default-selected );--luzmo-action-button-background-color-hover: var( --luzmo-action-button-background-color-hover-selected );--luzmo-action-button-background-color-down: var( --luzmo-action-button-background-color-down-selected );--luzmo-action-button-background-color-focus: var( --luzmo-action-button-background-color-focus-selected );--luzmo-action-button-content-color-default: var( --luzmo-action-button-content-color-default-selected );--luzmo-action-button-content-color-hover: var( --luzmo-action-button-content-color-hover-selected );--luzmo-action-button-content-color-down: var( --luzmo-action-button-content-color-down-selected );--luzmo-action-button-content-color-focus: var( --luzmo-action-button-content-color-focus-selected )}:host([selected][emphasized]){--luzmo-action-button-background-color-default: var( --luzmo-action-button-background-color-default-selected-emphasized );--luzmo-action-button-background-color-hover: var( --luzmo-action-button-background-color-hover-selected-emphasized );--luzmo-action-button-background-color-down: var( --luzmo-action-button-background-color-down-selected-emphasized );--luzmo-action-button-background-color-focus: var( --luzmo-action-button-background-color-focus-selected-emphasized );--luzmo-action-button-content-color-default: var( --luzmo-action-button-content-color-default-selected-emphasized );--luzmo-action-button-content-color-hover: var( --luzmo-action-button-content-color-hover-selected-emphasized );--luzmo-action-button-content-color-down: var( --luzmo-action-button-content-color-down-selected-emphasized );--luzmo-action-button-content-color-focus: var( --luzmo-action-button-content-color-focus-selected-emphasized )}:host([selected][static-color=black]),:host([selected][static-color=white]){--luzmo-action-button-content-color-default: var( --luzmo-action-button-static-content-color );--luzmo-action-button-content-color-hover: var( --luzmo-action-button-static-content-color );--luzmo-action-button-content-color-down: var( --luzmo-action-button-static-content-color );--luzmo-action-button-content-color-focus: var( --luzmo-action-button-static-content-color )}::slotted([slot=icon]){min-inline-size:var(--luzmo-action-button-icon-size, var(--action-button-icon-size));color:inherit;margin-inline-start:calc(var(--luzmo-action-button-edge-to-visual, var(--action-button-edge-to-visual)) - var(--luzmo-action-button-edge-to-text, var(--action-button-edge-to-text)));margin-inline-end:calc(var(--luzmo-action-button-edge-to-visual, var(--action-button-edge-to-visual)) - var(--luzmo-action-button-edge-to-text, var(--action-button-edge-to-text)))}.hold-affordance+::slotted([slot=icon]){margin-inline-start:calc(var(--luzmo-action-button-edge-to-visual, var(--action-button-edge-to-visual)) - var(--luzmo-action-button-edge-to-text, var(--action-button-edge-to-text)));margin-inline-end:calc(var(--luzmo-action-button-edge-to-visual-only, var(--action-button-edge-to-visual-only)) - var(--luzmo-action-button-edge-to-text, var(--action-button-edge-to-text)))}.hold-affordance+[icon-only]::slotted([slot=icon]),[icon-only]::slotted([slot=icon]){margin-inline-start:calc(var(--luzmo-action-button-edge-to-visual-only, var(--action-button-edge-to-visual-only)) - var(--luzmo-action-button-edge-to-text, var(--action-button-edge-to-text)));margin-inline-end:calc(var(--luzmo-action-button-edge-to-visual-only, var(--action-button-edge-to-visual-only)) - var(--luzmo-action-button-edge-to-text, var(--action-button-edge-to-text)));text-align:center}#label{pointer-events:none;font-size:var(--luzmo-action-button-font-size, var(--action-button-font-size));white-space:nowrap;color:inherit;color:var(--luzmo-action-button-label-color, inherit);text-overflow:ellipsis;overflow:hidden}.hold-affordance{color:inherit;transform:var(--logical-rotation);position:absolute;font-size:var(--action-button-corner-triangle-size);inset-block-end:calc(var(--luzmo-action-button-edge-to-hold-icon, var(--action-button-edge-to-hold-icon)) - var(--luzmo-action-button-border-width, var(--action-button-border-width)));inset-inline-end:calc(var(--luzmo-action-button-edge-to-hold-icon, var(--action-button-edge-to-hold-icon)) - var(--luzmo-action-button-border-width, var(--action-button-border-width)))}:host{transition:border-color var(--luzmo-action-button-animation-duration, var(--action-button-animation-duration)) ease-in-out}:host:after{margin:calc((var(--luzmo-action-button-focus-indicator-gap, var(--action-button-focus-indicator-gap)) + var(--luzmo-action-button-border-width, var(--action-button-border-width))) * -1);border-radius:var(--luzmo-action-button-focus-indicator-border-radius, var(--action-button-focus-indicator-border-radius));transition:box-shadow var(--luzmo-action-button-animation-duration, var(--action-button-animation-duration)) ease-in-out;pointer-events:none;content:"";position:absolute;top:0;right:0;bottom:0;left:0}:host(:focus-visible){box-shadow:none;outline:none}:host(:focus-visible):after{box-shadow:0 0 0 var(--luzmo-action-button-focus-indicator-width, var(--action-button-focus-indicator-width)) var(--highcontrast-action-button-focus-indicator-color, var(--luzmo-action-button-focus-indicator-color, var(--action-button-focus-indicator-color)))}:host{--action-button-animation-duration: var(--luzmo-animation-duration);--action-button-border-radius: var(--luzmo-border-radius);--action-button-border-width: var(--luzmo-border-width);--action-button-content-color-default: var(--luzmo-font-color);--action-button-content-color-hover: var(--luzmo-font-color-hover);--action-button-content-color-down: var(--luzmo-font-color-down);--action-button-content-color-focus: var(--luzmo-font-color-focus);--action-button-focus-indicator-gap: var(--luzmo-indicator-gap);--action-button-focus-indicator-width: var(--luzmo-indicator-width);--action-button-focus-indicator-color: var(--luzmo-indicator-color);--action-button-background-color-default: var(--luzmo-background-color);--action-button-background-color-hover: var(--luzmo-background-color-hover);--action-button-background-color-down: var(--luzmo-background-color-down);--action-button-background-color-focus: var(--luzmo-background-color-focus);--action-button-border-color-default: var(--luzmo-border-color);--action-button-border-color-hover: var(--luzmo-border-color-hover);--action-button-border-color-down: var(--luzmo-border-color-down);--action-button-border-color-focus: var(--luzmo-border-color-focus);--action-button-background-color-disabled: var(--luzmo-background-color);--action-button-border-color-disabled: var(--luzmo-border-color-disabled);--action-button-content-color-disabled: var(--luzmo-font-color-disabled)}:host([quiet]){--action-button-background-color-default: transparent;--action-button-background-color-hover: var(--luzmo-background-color-hover);--action-button-background-color-down: var(--luzmo-background-color-down);--action-button-background-color-focus: var(--luzmo-background-color-focus);--action-button-background-color-disabled: transparent;--action-button-border-color-default: transparent;--action-button-border-color-hover: transparent;--action-button-border-color-down: transparent;--action-button-border-color-focus: transparent;--action-button-border-color-disabled: transparent}:host([selected]){--action-button-background-color-default: var(--luzmo-font-color);--action-button-background-color-hover: var(--luzmo-font-color-hover);--action-button-background-color-down: var(--luzmo-font-color-down);--action-button-background-color-focus: var(--luzmo-font-color-focus);--action-button-content-color-default: var(--luzmo-background-color);--action-button-content-color-hover: var(--luzmo-background-color);--action-button-content-color-down: var(--luzmo-background-color);--action-button-content-color-focus: var(--luzmo-background-color);--action-button-border-color-default: transparent;--action-button-border-color-hover: transparent;--action-button-border-color-down: transparent;--action-button-border-color-focus: transparent;--action-button-border-color-disabled: transparent;--action-button-background-color-disabled: var( --luzmo-background-color-disabled )}:host([selected][emphasized]){--action-button-background-color-default: var(--luzmo-primary);--action-button-background-color-hover: var(--luzmo-primary-hover);--action-button-background-color-down: var(--luzmo-primary-down);--action-button-background-color-focus: var(--luzmo-primary-focus);--action-button-content-color-default: var(--luzmo-primary-inverse-color);--action-button-content-color-hover: var(--luzmo-primary-inverse-color);--action-button-content-color-down: var(--luzmo-primary-inverse-color);--action-button-content-color-focus: var(--luzmo-primary-inverse-color)}:host([static-color=black][quiet]),:host([static-color=white][quiet]){--action-button-border-color-default: transparent;--action-button-border-color-hover: transparent;--action-button-border-color-down: transparent;--action-button-border-color-focus: transparent;--action-button-border-color-disabled: transparent}:host([static-color=black]){--action-button-background-color-default: transparent;--action-button-background-color-hover: rgba(0, 0, 0, .25);--action-button-background-color-down: rgba(0, 0, 0, .4);--action-button-background-color-focus: rgba(0, 0, 0, .25);--action-button-background-color-disabled: transparent;--action-button-border-color-default: rgba(0, 0, 0, .4);--action-button-border-color-hover: rgba(0, 0, 0, .55);--action-button-border-color-down: rgba(0, 0, 0, .7);--action-button-border-color-focus: rgba(0, 0, 0, .25);--action-button-border-color-disabled: transparent;--action-button-content-color-default: rgb(0, 0, 0);--action-button-content-color-hover: rgb(0, 0, 0);--action-button-content-color-down: rgb(0, 0, 0);--action-button-content-color-focus: rgb(0, 0, 0);--action-button-content-color-disabled: rgba(0, 0, 0, .55);--action-button-focus-indicator-color: rgb(0, 0, 0)}:host([static-color=black][selected]){--action-button-background-color-default: rgba(0, 0, 0, .9);--action-button-background-color-hover: rgb(0, 0, 0);--action-button-background-color-down: rgb(0, 0, 0);--action-button-background-color-focus: rgb(0, 0, 0);--action-button-background-color-disabled: rgba(0, 0, 0, .1);--action-button-border-color-disabled: transparent;--action-button-content-color-default: rgb(255, 255, 255);--action-button-content-color-hover: rgb(255, 255, 255);--action-button-content-color-down: rgb(255, 255, 255);--action-button-content-color-focus: rgb(255, 255, 255)}:host([static-color=black][selected][emphasized]){--action-button-background-color-default: rgba(0, 0, 0, .9);--action-button-background-color-hover: rgb(0, 0, 0);--action-button-background-color-down: rgb(0, 0, 0);--action-button-background-color-focus: rgb(0, 0, 0);--action-button-content-color-default: rgb(255, 255, 255);--action-button-content-color-hover: rgb(255, 255, 255);--action-button-content-color-down: rgb(255, 255, 255);--action-button-content-color-focus: rgb(255, 255, 255)}:host([static-color=white]){--action-button-background-color-default: transparent;--action-button-background-color-hover: rgba(255, 255, 255, .25);--action-button-background-color-down: rgba(255, 255, 255, .4);--action-button-background-color-focus: rgba(255, 255, 255, .25);--action-button-background-color-disabled: transparent;--action-button-border-color-default: rgba(255, 255, 255, .4);--action-button-border-color-hover: rgba(255, 255, 255, .55);--action-button-border-color-down: rgba(255, 255, 255, .7);--action-button-border-color-focus: rgba(255, 255, 255, .55);--action-button-border-color-disabled: rgba(255, 255, 255, .25);--action-button-content-color-default: rgb(255, 255, 255);--action-button-content-color-hover: rgb(255, 255, 255);--action-button-content-color-down: rgb(255, 255, 255);--action-button-content-color-focus: rgb(255, 255, 255);--action-button-content-color-disabled: rgba(255, 255, 255, .55);--action-button-focus-indicator-color: rgb(255, 255, 255)}:host([static-color=white][selected]){--action-button-background-color-default: rgba(255, 255, 255, .9);--action-button-background-color-hover: rgb(255, 255, 255);--action-button-background-color-down: rgb(255, 255, 255);--action-button-background-color-focus: rgb(255, 255, 255);--action-button-background-color-disabled: rgba(255, 255, 255, .1);--action-button-border-color-disabled: transparent;--action-button-content-color-default: rgb(0, 0, 0);--action-button-content-color-hover: rgb(0, 0, 0);--action-button-content-color-down: rgb(0, 0, 0);--action-button-content-color-focus: rgb(0, 0, 0)}:host([static-color=white][selected][emphasized]){--action-button-background-color-default: rgba(255, 255, 255, .9);--action-button-background-color-hover: rgb(255, 255, 255);--action-button-background-color-down: rgb(255, 255, 255);--action-button-background-color-focus: rgb(255, 255, 255);--action-button-content-color-default: rgb(0, 0, 0)}:host{--action-button-min-width: var(--luzmo-component-height);--action-button-height: var(--luzmo-component-height);--action-button-icon-size: var(--luzmo-font-size-l);--action-button-font-size: var(--luzmo-font-size);--action-button-text-to-visual: var(--luzmo-spacing-2);--action-button-edge-to-hold-icon: var(--luzmo-spacing-2);--action-button-edge-to-visual-size: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--action-button-edge-to-visual-only-size: var(--luzmo-spacing-3);--action-button-edge-to-text-size: 12px;--action-button-corner-triangle-size: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) )}:host([size=xs]){--action-button-min-width: var(--luzmo-component-height-xs);--action-button-height: var(--luzmo-component-height-xs);--action-button-icon-size: var(--luzmo-font-size-s);--action-button-font-size: var(--luzmo-font-size-xs);--action-button-text-to-visual: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) );--action-button-edge-to-hold-icon: var(--luzmo-spacing-2);--action-button-edge-to-visual-size: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) );--action-button-edge-to-visual-only-size: var(--luzmo-spacing-2);--action-button-edge-to-text-size: var(--luzmo-spacing-2);--action-button-corner-triangle-size: var(--luzmo-spacing-2)}:host([size=s]){--action-button-min-width: var(--luzmo-component-height-s);--action-button-height: var(--luzmo-component-height-s);--action-button-icon-size: var(--luzmo-font-size);--action-button-font-size: var(--luzmo-font-size-s);--action-button-text-to-visual: var(--luzmo-spacing-3);--action-button-edge-to-hold-icon: var(--luzmo-spacing-2);--action-button-edge-to-visual-size: var(--luzmo-spacing-3);--action-button-edge-to-visual-only-size: var(--luzmo-spacing-2);--action-button-edge-to-text-size: var(--luzmo-spacing-3);--action-button-corner-triangle-size: var(--luzmo-spacing-2)}:host([size=l]){--action-button-min-width: var(--luzmo-component-height-l);--action-button-height: var(--luzmo-component-height-l);--action-button-icon-size: var(--luzmo-font-size-xl);--action-button-font-size: var(--luzmo-font-size-l);--action-button-text-to-visual: var(--luzmo-spacing-3);--action-button-edge-to-hold-icon: var(--luzmo-spacing-2);--action-button-edge-to-visual-size: var(--luzmo-spacing-4);--action-button-edge-to-visual-only-size: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--action-button-edge-to-text-size: var(--luzmo-spacing-5);--action-button-corner-triangle-size: var(--luzmo-spacing-3)}:host([size=xl]){--action-button-min-width: var(--luzmo-component-height-xl);--action-button-height: var(--luzmo-component-height-xl);--action-button-icon-size: var(--luzmo-font-size-xxl);--action-button-font-size: var(--luzmo-font-size-xl);--action-button-text-to-visual: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--action-button-edge-to-hold-icon: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) );--action-button-edge-to-visual-size: var(--luzmo-spacing-5);--action-button-edge-to-visual-only-size: var(--luzmo-spacing-4);--action-button-edge-to-text-size: var(--luzmo-spacing-5);--action-button-corner-triangle-size: var(--luzmo-spacing-3)}::slotted([slot=icon]){flex-shrink:0}#label{flex-grow:var(--action-button-label-flex-grow);text-align:var(--action-button-label-text-align);pointer-events:none!important}:host([size=xs]){min-width:var(--action-button-height, 0);--action-button-edge-to-visual-only: calc( var(--luzmo-spacing-2) - var(--action-button-border-width) )}:host([size=s]){--action-button-edge-to-visual-only: calc( var(--luzmo-spacing-2) - var(--action-button-border-width) )}:host([size=m]){--action-button-edge-to-visual-only: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) - var(--action-button-border-width) )}:host([size=l]){--action-button-edge-to-visual-only: calc( var(--luzmo-spacing-3) - var(--action-button-border-width) )}:host([size=xl]){--action-button-edge-to-visual-only: calc( var(--luzmo-spacing-4) - var(--action-button-border-width) )}@media (forced-colors: active){:host{--highcontrast-action-button-border-color-disabled: GrayText;--highcontrast-action-button-content-color-disabled: GrayText}}';
48
- var p = Object.defineProperty, x = Object.getOwnPropertyDescriptor, e = (c, o, t, n) => {
49
- for (var i = n > 1 ? void 0 : n ? x(o, t) : o, l = c.length - 1, u; l >= 0; l--)
50
- (u = c[l]) && (i = (n ? u(o, t, i) : u(i)) || i);
51
- return n && i && p(o, t, i), i;
52
- };
53
- const w = 300;
54
- let d;
55
- class r extends g(v, {
56
- validSizes: ["xs", "s", "m", "l", "xl"],
57
- noDefaultSize: !0
58
- }) {
59
- constructor() {
60
- super(), this.emphasized = !1, this.holdAffordance = !1, this.quiet = !1, this.role = "button", this.selected = !1, this.toggles = !1, this._value = "", this.onClick = () => {
61
- this.toggles && (this.selected = !this.selected, this.dispatchEvent(
62
- new Event("change", {
63
- cancelable: !0,
64
- bubbles: !0,
65
- composed: !0
66
- })
67
- ) || (this.selected = !this.selected));
68
- }, this.addEventListener("click", this.onClick);
69
- }
70
- static get styles() {
71
- return [...super.styles, m(f)];
72
- }
73
- get value() {
74
- return this._value || this.itemText;
75
- }
76
- set value(o) {
77
- o !== this._value && (this._value = o || "", this._value ? this.setAttribute("value", this._value) : this.removeAttribute("value"));
78
- }
79
- /**
80
- * @private
81
- */
82
- get itemText() {
83
- return (this.textContent || /* c8 ignore next */
84
- "").trim();
85
- }
86
- handlePointerdownHoldAffordance(o) {
87
- o.button === 0 && (this.addEventListener("pointerup", this.handlePointerupHoldAffordance), this.addEventListener("pointercancel", this.handlePointerupHoldAffordance), d = setTimeout(() => {
88
- this.dispatchEvent(
89
- new CustomEvent("longpress", {
90
- bubbles: !0,
91
- composed: !0,
92
- detail: {
93
- source: "pointer"
94
- }
95
- })
96
- );
97
- }, w));
98
- }
99
- handlePointerupHoldAffordance() {
100
- clearTimeout(d), this.removeEventListener("pointerup", this.handlePointerupHoldAffordance), this.removeEventListener(
101
- "pointercancel",
102
- this.handlePointerupHoldAffordance
103
- );
104
- }
105
- /**
106
- * @private
107
- */
108
- handleKeydown(o) {
109
- if (!this.holdAffordance)
110
- return super.handleKeydown(o);
111
- const { code: t, altKey: n } = o;
112
- (t === "Space" || n && t === "ArrowDown") && (o.preventDefault(), t === "ArrowDown" && (o.stopPropagation(), o.stopImmediatePropagation()), this.addEventListener("keyup", this.handleKeyup), this.active = !0);
113
- }
114
- handleKeyup(o) {
115
- if (!this.holdAffordance)
116
- return super.handleKeyup(o);
117
- const { code: t, altKey: n } = o;
118
- (t === "Space" || n && t === "ArrowDown") && (o.stopPropagation(), this.dispatchEvent(
119
- new CustomEvent("longpress", {
120
- bubbles: !0,
121
- composed: !0,
122
- detail: {
123
- source: "keyboard"
124
- }
125
- })
126
- ), this.active = !1);
127
- }
128
- get buttonContent() {
129
- const o = super.buttonContent;
130
- return this.holdAffordance && o.unshift(h`
131
- <div
132
- class="hold-affordance corner-triangle-${this.size}"
133
- >
134
- ${b(s)}
135
- </div>
136
- `), o;
137
- }
138
- updated(o) {
139
- super.updated(o);
140
- const t = this.role === "button", n = t && (this.selected || this.toggles) && !(this.hasAttribute("aria-haspopup") && this.hasAttribute("aria-expanded"));
141
- (o.has("selected") || o.has("role")) && (n ? this.setAttribute("aria-pressed", this.selected ? "true" : "false") : (this.removeAttribute("aria-pressed"), t && this.toggles && this.hasAttribute("aria-expanded") && this.setAttribute("aria-expanded", this.selected ? "true" : "false"))), o.has("holdAffordance") && (this.holdAffordance ? this.addEventListener(
142
- "pointerdown",
143
- this.handlePointerdownHoldAffordance
144
- ) : (this.removeEventListener(
145
- "pointerdown",
146
- this.handlePointerdownHoldAffordance
147
- ), this.handlePointerupHoldAffordance()));
148
- }
149
- }
150
- e([
151
- a({ type: Boolean, reflect: !0 })
152
- ], r.prototype, "emphasized", 2);
153
- e([
154
- a({ type: Boolean, reflect: !0, attribute: "hold-affordance" })
155
- ], r.prototype, "holdAffordance", 2);
156
- e([
157
- a({ type: Boolean, reflect: !0 })
158
- ], r.prototype, "quiet", 2);
159
- e([
160
- a({ reflect: !0 })
161
- ], r.prototype, "role", 2);
162
- e([
163
- a({ type: Boolean, reflect: !0 })
164
- ], r.prototype, "selected", 2);
165
- e([
166
- a({ type: Boolean, reflect: !0 })
167
- ], r.prototype, "toggles", 2);
168
- e([
169
- a({ reflect: !0, attribute: "static-color" })
170
- ], r.prototype, "staticColor", 2);
171
- e([
172
- a({ type: String })
173
- ], r.prototype, "value", 1);
174
- customElements.get("luzmo-action-button") || customElements.define("luzmo-action-button", r);
@@ -1,42 +0,0 @@
1
- /*! * A kit of modern Luzmo Web Components for analytics in your web application.
2
- *
3
- * Copyright © 2025 Luzmo
4
- * All rights reserved.
5
- * Luzmo web components (“Luzmo Web Components”)
6
- * must be used according to the Luzmo Terms of Service.
7
- * This license allows users with a current active Luzmo account
8
- * to use the Luzmo Web Components. This license terminates
9
- * automatically if a user no longer has an active Luzmo account.
10
- * Please view the Luzmo Terms of Service at: https://www.luzmo.com/information-pages/terms-of-use.
11
- *
12
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
13
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
14
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
15
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
16
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
17
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
18
- * SOFTWARE.
19
- * */
20
- "use strict";const d=require("./luzmo-icons-4nDFv1Lq-D6-m-VWM.cjs"),n=require("./base-D76d76ww-tT6yr8eb.cjs"),s=require("./button-base-DbkDzb71-D0Ni0xn1.cjs");/*! * Lucero - The design system for Luzmo.
21
- *
22
- * Copyright © 2025 Luzmo
23
- * All rights reserved.
24
- * Lucero (“Luzmo Design System”) must be used according to the Luzmo Terms of Service.
25
- * This license allows users with a current active Luzmo account to use Lucero.
26
- * This license terminates automatically if a user no longer has an active Luzmo account.
27
- * Please view the Luzmo Terms of Service at: https://www.luzmo.com/information-pages/terms-of-use.
28
- *
29
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
30
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
31
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
32
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
33
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
34
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
35
- * SOFTWARE.
36
- * */const g=()=>{if(typeof document<"u"&&!document.querySelector("style[data-luzmo-vars]")){const c=document.createElement("style");c.setAttribute("data-luzmo-vars",""),c.textContent='html{--luzmo-animation-duration: 0.15s;--luzmo-border-color: rgba(var(--luzmo-border-color-rgb), 0.1);--luzmo-border-color-hover: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-down: rgba(var(--luzmo-border-color-rgb), 0.3);--luzmo-border-color-focus: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-rgb: 0, 0, 0;--luzmo-border-color-full: rgb(180, 180, 180);--luzmo-border-color-full-hover: rgb(140, 140, 140);--luzmo-border-color-full-down: rgb(110, 110, 110);--luzmo-border-color-full-focus: rgb(140, 140, 140);--luzmo-border-color-disabled: #dddddd;--luzmo-border-radius: 6px;--luzmo-border-radius-s: 4px;--luzmo-border-radius-l: 8px;--luzmo-border-radius-xl: 12px;--luzmo-border-radius-full: 999rem;--luzmo-background-color: #ffffff;--luzmo-background-color-rgb: 255, 255, 255;--luzmo-background-color-disabled: #eeeeee;--luzmo-background-color-hover: #f0f0fc;--luzmo-background-color-down: #f1f1ff;--luzmo-background-color-focus: #f0f0fc;--luzmo-background-color-highlight: rgb(240, 240, 240);--luzmo-background-color-highlight-disabled: rgb(245, 245, 245);--luzmo-background-color-highlight-hover: rgb(225, 225, 225);--luzmo-background-color-highlight-down: rgb(215, 215, 215);--luzmo-background-color-highlight-focus: rgb(225, 225, 225);--luzmo-border-width: 1px;--luzmo-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Helvetica, Arial, sans-serif;--luzmo-font-size-xs: 10px;--luzmo-font-size-s: 12px;--luzmo-font-size-m: 14px;--luzmo-font-size: 14px;--luzmo-font-size-l: 16px;--luzmo-font-size-xl: 18px;--luzmo-font-size-xxl: 20px;--luzmo-font-style: normal;--luzmo-line-height: normal;--luzmo-font-weight: 400;--luzmo-font-weight-semibold: 500;--luzmo-font-weight-bold: 600;--luzmo-font-color: #333;--luzmo-font-color-hard: #000;--luzmo-font-color-disabled: var(--luzmo-disabled-color);--luzmo-font-color-extra-dimmed: #888;--luzmo-font-color-hover: #333;--luzmo-font-color-down: #111;--luzmo-font-color-focus: #333;--luzmo-primary: #4434ff;--luzmo-primary-hover: #4234e4;--luzmo-primary-down: #392cc7;--luzmo-primary-focus: #4234e4;--luzmo-primary-inverse-color: #ffffff;--luzmo-primary-rgb: 68, 52, 255;--luzmo-secondary: #ff00ff;--luzmo-secondary-hover: #e309e3;--luzmo-secondary-down: #c711c7;--luzmo-secondary-focus: #e309e3;--luzmo-secondary-inverse-color: #ffffff;--luzmo-secondary-rgb: 255, 0, 255;--luzmo-negative-color: #ca221c;--luzmo-negative-color-hover: #b3241f;--luzmo-negative-color-down: #9f231f;--luzmo-negative-color-focus: #b3241f;--luzmo-negative-color-rgb: 202, 34, 28;--luzmo-positive-color: rgb(20, 150, 101);--luzmo-positive-color-hover: rgb(17, 128, 86);--luzmo-positive-color-down: rgb(16, 105, 71);--luzmo-positive-color-focus: rgb(17, 128, 86);--luzmo-positive-color-rgb: 20, 150, 101;--luzmo-selected-color: rgb(110, 110, 110);--luzmo-selected-color-hover: rgb(70, 70, 70);--luzmo-selected-color-down: rgb(40, 40, 40);--luzmo-selected-color-focus: rgb(70, 70, 70);--luzmo-selected-color-hard: #1e1e1e;--luzmo-selected-color-hard-hover: rgb(0, 0, 0);--luzmo-selected-color-hard-down: rgb(0, 0, 0);--luzmo-selected-color-hard-focus: rgb(0, 0, 0);--luzmo-informative-color: #1a77e9;--luzmo-informative-color-rgb: 26, 119, 233;--luzmo-disabled-color: #aaaaaa;--luzmo-spacing-1: 2px;--luzmo-spacing-2: 4px;--luzmo-spacing-3: 8px;--luzmo-spacing-4: 12px;--luzmo-spacing-5: 16px;--luzmo-indicator-gap: 2px;--luzmo-indicator-width: 1px;--luzmo-indicator-color: var(--luzmo-primary);--luzmo-component-height-xxs: 20px;--luzmo-component-height-xs: 24px;--luzmo-component-height-s: 28px;--luzmo-component-height: 32px;--luzmo-component-height-l: 40px;--luzmo-component-height-xl: 48px;--luzmo-component-height-xxl: 64px;--luzmo-icon-size-xxs: 12px;--luzmo-icon-size-xs: 14px;--luzmo-icon-size-s: 16px;--luzmo-icon-size-m: 18px;--luzmo-icon-size-l: 20px;--luzmo-icon-size-xl: 22px;--luzmo-icon-size-xxl: 32px}',document.head.appendChild(c)}};g();const h=':host{cursor:pointer;-webkit-user-select:none;user-select:none;box-sizing:border-box;font-family:var(--luzmo-button-font-family, var(--luzmo-sans-font-family-stack, var(--luzmo-font-family)));-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:var(--luzmo-button-line-height, var(--luzmo-line-height-100, var(--line-height-100)));text-transform:none;vertical-align:top;-webkit-appearance:button;transition:background var(--luzmo-button-animation-duration, var(--luzmo-animation-duration-100, var(--animation-duration-100))) ease-out,border-color var(--luzmo-button-animation-duration, var(--luzmo-animation-duration-100, var(--animation-duration-100))) ease-out,color var(--luzmo-button-animation-duration, var(--luzmo-animation-duration-100, var(--animation-duration-100))) ease-out,box-shadow var(--luzmo-button-animation-duration, var(--luzmo-animation-duration-100, var(--animation-duration-100))) ease-out;border-style:solid;justify-content:center;align-items:center;margin:0;-webkit-text-decoration:none;text-decoration:none;display:inline-flex;overflow:visible}:host(:focus){outline:none}:host([disabled]){cursor:default}::slotted([slot=icon]){max-block-size:100%;flex-shrink:0;display:flex;align-items:center;justify-content:center}#label{text-align:center;place-self:center}#label:empty{display:none}@media (forced-colors: active){:host{--highcontrast-action-button-focus-indicator-color: ButtonText}:host:after{forced-color-adjust:none}:host([selected]){--highcontrast-action-button-background-color-default: Highlight;--highcontrast-action-button-background-color-hover: Highlight;--highcontrast-action-button-background-color-focus: Highlight;--highcontrast-action-button-background-color-down: Highlight;--highcontrast-action-button-background-color-disabled: ButtonFace;--highcontrast-action-button-border-color-default: HighlightText;--highcontrast-action-button-border-color-hover: HighlightText;--highcontrast-action-button-border-color-focus: HighlightText;--highcontrast-action-button-border-color-down: HighlightText;--highcontrast-action-button-border-color-disabled: GrayText;--highcontrast-action-button-content-color-default: HighlightText;--highcontrast-action-button-content-color-hover: HighlightText;--highcontrast-action-button-content-color-focus: HighlightText;--highcontrast-action-button-content-color-down: HighlightText;--highcontrast-action-button-content-color-disabled: GrayText}:host([selected]) .hold-affordance,:host([selected]) ::slotted([slot=icon]),:host([selected]) #label{forced-color-adjust:none}}:host{--action-button-focus-indicator-border-radius: calc( var(--action-button-border-radius) + var(--action-button-focus-indicator-gap) );--action-button-edge-to-visual: calc( var(--action-button-edge-to-visual-size) - var(--action-button-border-width) );--action-button-edge-to-text: calc( var(--action-button-edge-to-text-size) - var(--action-button-border-width) );--action-button-edge-to-visual-only: calc( var(--action-button-edge-to-visual-only-size) - var( --action-button-border-width ) );min-inline-size:var(--luzmo-action-button-min-width, var(--action-button-min-width));block-size:var(--luzmo-action-button-height, var(--action-button-height));border-radius:var(--luzmo-action-button-border-radius, var(--action-button-border-radius));border-width:var(--luzmo-action-button-border-width, var(--action-button-border-width));gap:calc(var(--luzmo-action-button-text-to-visual, var(--action-button-text-to-visual)) + var(--luzmo-action-button-edge-to-text, var(--action-button-edge-to-text)) - var(--luzmo-action-button-edge-to-visual-only, var(--action-button-edge-to-visual-only)));padding-inline:var(--luzmo-action-button-edge-to-text, var(--action-button-edge-to-text));background-color:var(--highcontrast-action-button-background-color-default, var(--luzmo-action-button-background-color-default, var(--action-button-background-color-default)));border-color:var(--highcontrast-action-button-border-color-default, var(--luzmo-action-button-border-color-default, var(--action-button-border-color-default)));color:var(--highcontrast-action-button-content-color-default, var(--luzmo-action-button-content-color-default, var(--action-button-content-color-default)));position:relative}:host:dir(rtl),:host([dir=rtl]){--logical-rotation: matrix(-1, 0, 0, 1, 0, 0)}@media (hover: hover){:host(:hover){background-color:var(--highcontrast-action-button-background-color-hover, var(--luzmo-action-button-background-color-hover, var(--action-button-background-color-hover)));border-color:var(--highcontrast-action-button-border-color-hover, var(--luzmo-action-button-border-color-hover, var(--action-button-border-color-hover)));color:var(--highcontrast-action-button-content-color-hover, var(--luzmo-action-button-content-color-hover, var(--action-button-content-color-hover)))}}:host(:focus-visible){background-color:var(--highcontrast-action-button-background-color-focus, var(--luzmo-action-button-background-color-focus, var(--action-button-background-color-focus)));border-color:var(--highcontrast-action-button-border-color-focus, var(--luzmo-action-button-border-color-focus, var(--action-button-border-color-focus)));color:var(--highcontrast-action-button-content-color-focus, var(--luzmo-action-button-content-color-focus, var(--action-button-content-color-focus)))}:host(:is(:active,[active])){background-color:var(--highcontrast-action-button-background-color-down, var(--luzmo-action-button-background-color-down, var(--action-button-background-color-down)));border-color:var(--highcontrast-action-button-border-color-down, var(--luzmo-action-button-border-color-down, var(--action-button-border-color-down)));color:var(--highcontrast-action-button-content-color-down, var(--luzmo-action-button-content-color-down, var(--action-button-content-color-down)))}:host([disabled]){background-color:var(--highcontrast-action-button-background-color-disabled, var(--luzmo-action-button-background-color-disabled, var(--action-button-background-color-disabled)));border-color:var(--highcontrast-action-button-border-color-disabled, var(--luzmo-action-button-border-color-disabled, var(--action-button-border-color-disabled)));color:var(--highcontrast-action-button-content-color-disabled, var(--luzmo-action-button-content-color-disabled, var(--action-button-content-color-disabled)))}:host([selected]){--luzmo-action-button-background-color-default: var( --luzmo-action-button-background-color-default-selected );--luzmo-action-button-background-color-hover: var( --luzmo-action-button-background-color-hover-selected );--luzmo-action-button-background-color-down: var( --luzmo-action-button-background-color-down-selected );--luzmo-action-button-background-color-focus: var( --luzmo-action-button-background-color-focus-selected );--luzmo-action-button-content-color-default: var( --luzmo-action-button-content-color-default-selected );--luzmo-action-button-content-color-hover: var( --luzmo-action-button-content-color-hover-selected );--luzmo-action-button-content-color-down: var( --luzmo-action-button-content-color-down-selected );--luzmo-action-button-content-color-focus: var( --luzmo-action-button-content-color-focus-selected )}:host([selected][emphasized]){--luzmo-action-button-background-color-default: var( --luzmo-action-button-background-color-default-selected-emphasized );--luzmo-action-button-background-color-hover: var( --luzmo-action-button-background-color-hover-selected-emphasized );--luzmo-action-button-background-color-down: var( --luzmo-action-button-background-color-down-selected-emphasized );--luzmo-action-button-background-color-focus: var( --luzmo-action-button-background-color-focus-selected-emphasized );--luzmo-action-button-content-color-default: var( --luzmo-action-button-content-color-default-selected-emphasized );--luzmo-action-button-content-color-hover: var( --luzmo-action-button-content-color-hover-selected-emphasized );--luzmo-action-button-content-color-down: var( --luzmo-action-button-content-color-down-selected-emphasized );--luzmo-action-button-content-color-focus: var( --luzmo-action-button-content-color-focus-selected-emphasized )}:host([selected][static-color=black]),:host([selected][static-color=white]){--luzmo-action-button-content-color-default: var( --luzmo-action-button-static-content-color );--luzmo-action-button-content-color-hover: var( --luzmo-action-button-static-content-color );--luzmo-action-button-content-color-down: var( --luzmo-action-button-static-content-color );--luzmo-action-button-content-color-focus: var( --luzmo-action-button-static-content-color )}::slotted([slot=icon]){min-inline-size:var(--luzmo-action-button-icon-size, var(--action-button-icon-size));color:inherit;margin-inline-start:calc(var(--luzmo-action-button-edge-to-visual, var(--action-button-edge-to-visual)) - var(--luzmo-action-button-edge-to-text, var(--action-button-edge-to-text)));margin-inline-end:calc(var(--luzmo-action-button-edge-to-visual, var(--action-button-edge-to-visual)) - var(--luzmo-action-button-edge-to-text, var(--action-button-edge-to-text)))}.hold-affordance+::slotted([slot=icon]){margin-inline-start:calc(var(--luzmo-action-button-edge-to-visual, var(--action-button-edge-to-visual)) - var(--luzmo-action-button-edge-to-text, var(--action-button-edge-to-text)));margin-inline-end:calc(var(--luzmo-action-button-edge-to-visual-only, var(--action-button-edge-to-visual-only)) - var(--luzmo-action-button-edge-to-text, var(--action-button-edge-to-text)))}.hold-affordance+[icon-only]::slotted([slot=icon]),[icon-only]::slotted([slot=icon]){margin-inline-start:calc(var(--luzmo-action-button-edge-to-visual-only, var(--action-button-edge-to-visual-only)) - var(--luzmo-action-button-edge-to-text, var(--action-button-edge-to-text)));margin-inline-end:calc(var(--luzmo-action-button-edge-to-visual-only, var(--action-button-edge-to-visual-only)) - var(--luzmo-action-button-edge-to-text, var(--action-button-edge-to-text)));text-align:center}#label{pointer-events:none;font-size:var(--luzmo-action-button-font-size, var(--action-button-font-size));white-space:nowrap;color:inherit;color:var(--luzmo-action-button-label-color, inherit);text-overflow:ellipsis;overflow:hidden}.hold-affordance{color:inherit;transform:var(--logical-rotation);position:absolute;font-size:var(--action-button-corner-triangle-size);inset-block-end:calc(var(--luzmo-action-button-edge-to-hold-icon, var(--action-button-edge-to-hold-icon)) - var(--luzmo-action-button-border-width, var(--action-button-border-width)));inset-inline-end:calc(var(--luzmo-action-button-edge-to-hold-icon, var(--action-button-edge-to-hold-icon)) - var(--luzmo-action-button-border-width, var(--action-button-border-width)))}:host{transition:border-color var(--luzmo-action-button-animation-duration, var(--action-button-animation-duration)) ease-in-out}:host:after{margin:calc((var(--luzmo-action-button-focus-indicator-gap, var(--action-button-focus-indicator-gap)) + var(--luzmo-action-button-border-width, var(--action-button-border-width))) * -1);border-radius:var(--luzmo-action-button-focus-indicator-border-radius, var(--action-button-focus-indicator-border-radius));transition:box-shadow var(--luzmo-action-button-animation-duration, var(--action-button-animation-duration)) ease-in-out;pointer-events:none;content:"";position:absolute;top:0;right:0;bottom:0;left:0}:host(:focus-visible){box-shadow:none;outline:none}:host(:focus-visible):after{box-shadow:0 0 0 var(--luzmo-action-button-focus-indicator-width, var(--action-button-focus-indicator-width)) var(--highcontrast-action-button-focus-indicator-color, var(--luzmo-action-button-focus-indicator-color, var(--action-button-focus-indicator-color)))}:host{--action-button-animation-duration: var(--luzmo-animation-duration);--action-button-border-radius: var(--luzmo-border-radius);--action-button-border-width: var(--luzmo-border-width);--action-button-content-color-default: var(--luzmo-font-color);--action-button-content-color-hover: var(--luzmo-font-color-hover);--action-button-content-color-down: var(--luzmo-font-color-down);--action-button-content-color-focus: var(--luzmo-font-color-focus);--action-button-focus-indicator-gap: var(--luzmo-indicator-gap);--action-button-focus-indicator-width: var(--luzmo-indicator-width);--action-button-focus-indicator-color: var(--luzmo-indicator-color);--action-button-background-color-default: var(--luzmo-background-color);--action-button-background-color-hover: var(--luzmo-background-color-hover);--action-button-background-color-down: var(--luzmo-background-color-down);--action-button-background-color-focus: var(--luzmo-background-color-focus);--action-button-border-color-default: var(--luzmo-border-color);--action-button-border-color-hover: var(--luzmo-border-color-hover);--action-button-border-color-down: var(--luzmo-border-color-down);--action-button-border-color-focus: var(--luzmo-border-color-focus);--action-button-background-color-disabled: var(--luzmo-background-color);--action-button-border-color-disabled: var(--luzmo-border-color-disabled);--action-button-content-color-disabled: var(--luzmo-font-color-disabled)}:host([quiet]){--action-button-background-color-default: transparent;--action-button-background-color-hover: var(--luzmo-background-color-hover);--action-button-background-color-down: var(--luzmo-background-color-down);--action-button-background-color-focus: var(--luzmo-background-color-focus);--action-button-background-color-disabled: transparent;--action-button-border-color-default: transparent;--action-button-border-color-hover: transparent;--action-button-border-color-down: transparent;--action-button-border-color-focus: transparent;--action-button-border-color-disabled: transparent}:host([selected]){--action-button-background-color-default: var(--luzmo-font-color);--action-button-background-color-hover: var(--luzmo-font-color-hover);--action-button-background-color-down: var(--luzmo-font-color-down);--action-button-background-color-focus: var(--luzmo-font-color-focus);--action-button-content-color-default: var(--luzmo-background-color);--action-button-content-color-hover: var(--luzmo-background-color);--action-button-content-color-down: var(--luzmo-background-color);--action-button-content-color-focus: var(--luzmo-background-color);--action-button-border-color-default: transparent;--action-button-border-color-hover: transparent;--action-button-border-color-down: transparent;--action-button-border-color-focus: transparent;--action-button-border-color-disabled: transparent;--action-button-background-color-disabled: var( --luzmo-background-color-disabled )}:host([selected][emphasized]){--action-button-background-color-default: var(--luzmo-primary);--action-button-background-color-hover: var(--luzmo-primary-hover);--action-button-background-color-down: var(--luzmo-primary-down);--action-button-background-color-focus: var(--luzmo-primary-focus);--action-button-content-color-default: var(--luzmo-primary-inverse-color);--action-button-content-color-hover: var(--luzmo-primary-inverse-color);--action-button-content-color-down: var(--luzmo-primary-inverse-color);--action-button-content-color-focus: var(--luzmo-primary-inverse-color)}:host([static-color=black][quiet]),:host([static-color=white][quiet]){--action-button-border-color-default: transparent;--action-button-border-color-hover: transparent;--action-button-border-color-down: transparent;--action-button-border-color-focus: transparent;--action-button-border-color-disabled: transparent}:host([static-color=black]){--action-button-background-color-default: transparent;--action-button-background-color-hover: rgba(0, 0, 0, .25);--action-button-background-color-down: rgba(0, 0, 0, .4);--action-button-background-color-focus: rgba(0, 0, 0, .25);--action-button-background-color-disabled: transparent;--action-button-border-color-default: rgba(0, 0, 0, .4);--action-button-border-color-hover: rgba(0, 0, 0, .55);--action-button-border-color-down: rgba(0, 0, 0, .7);--action-button-border-color-focus: rgba(0, 0, 0, .25);--action-button-border-color-disabled: transparent;--action-button-content-color-default: rgb(0, 0, 0);--action-button-content-color-hover: rgb(0, 0, 0);--action-button-content-color-down: rgb(0, 0, 0);--action-button-content-color-focus: rgb(0, 0, 0);--action-button-content-color-disabled: rgba(0, 0, 0, .55);--action-button-focus-indicator-color: rgb(0, 0, 0)}:host([static-color=black][selected]){--action-button-background-color-default: rgba(0, 0, 0, .9);--action-button-background-color-hover: rgb(0, 0, 0);--action-button-background-color-down: rgb(0, 0, 0);--action-button-background-color-focus: rgb(0, 0, 0);--action-button-background-color-disabled: rgba(0, 0, 0, .1);--action-button-border-color-disabled: transparent;--action-button-content-color-default: rgb(255, 255, 255);--action-button-content-color-hover: rgb(255, 255, 255);--action-button-content-color-down: rgb(255, 255, 255);--action-button-content-color-focus: rgb(255, 255, 255)}:host([static-color=black][selected][emphasized]){--action-button-background-color-default: rgba(0, 0, 0, .9);--action-button-background-color-hover: rgb(0, 0, 0);--action-button-background-color-down: rgb(0, 0, 0);--action-button-background-color-focus: rgb(0, 0, 0);--action-button-content-color-default: rgb(255, 255, 255);--action-button-content-color-hover: rgb(255, 255, 255);--action-button-content-color-down: rgb(255, 255, 255);--action-button-content-color-focus: rgb(255, 255, 255)}:host([static-color=white]){--action-button-background-color-default: transparent;--action-button-background-color-hover: rgba(255, 255, 255, .25);--action-button-background-color-down: rgba(255, 255, 255, .4);--action-button-background-color-focus: rgba(255, 255, 255, .25);--action-button-background-color-disabled: transparent;--action-button-border-color-default: rgba(255, 255, 255, .4);--action-button-border-color-hover: rgba(255, 255, 255, .55);--action-button-border-color-down: rgba(255, 255, 255, .7);--action-button-border-color-focus: rgba(255, 255, 255, .55);--action-button-border-color-disabled: rgba(255, 255, 255, .25);--action-button-content-color-default: rgb(255, 255, 255);--action-button-content-color-hover: rgb(255, 255, 255);--action-button-content-color-down: rgb(255, 255, 255);--action-button-content-color-focus: rgb(255, 255, 255);--action-button-content-color-disabled: rgba(255, 255, 255, .55);--action-button-focus-indicator-color: rgb(255, 255, 255)}:host([static-color=white][selected]){--action-button-background-color-default: rgba(255, 255, 255, .9);--action-button-background-color-hover: rgb(255, 255, 255);--action-button-background-color-down: rgb(255, 255, 255);--action-button-background-color-focus: rgb(255, 255, 255);--action-button-background-color-disabled: rgba(255, 255, 255, .1);--action-button-border-color-disabled: transparent;--action-button-content-color-default: rgb(0, 0, 0);--action-button-content-color-hover: rgb(0, 0, 0);--action-button-content-color-down: rgb(0, 0, 0);--action-button-content-color-focus: rgb(0, 0, 0)}:host([static-color=white][selected][emphasized]){--action-button-background-color-default: rgba(255, 255, 255, .9);--action-button-background-color-hover: rgb(255, 255, 255);--action-button-background-color-down: rgb(255, 255, 255);--action-button-background-color-focus: rgb(255, 255, 255);--action-button-content-color-default: rgb(0, 0, 0)}:host{--action-button-min-width: var(--luzmo-component-height);--action-button-height: var(--luzmo-component-height);--action-button-icon-size: var(--luzmo-font-size-l);--action-button-font-size: var(--luzmo-font-size);--action-button-text-to-visual: var(--luzmo-spacing-2);--action-button-edge-to-hold-icon: var(--luzmo-spacing-2);--action-button-edge-to-visual-size: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--action-button-edge-to-visual-only-size: var(--luzmo-spacing-3);--action-button-edge-to-text-size: 12px;--action-button-corner-triangle-size: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) )}:host([size=xs]){--action-button-min-width: var(--luzmo-component-height-xs);--action-button-height: var(--luzmo-component-height-xs);--action-button-icon-size: var(--luzmo-font-size-s);--action-button-font-size: var(--luzmo-font-size-xs);--action-button-text-to-visual: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) );--action-button-edge-to-hold-icon: var(--luzmo-spacing-2);--action-button-edge-to-visual-size: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) );--action-button-edge-to-visual-only-size: var(--luzmo-spacing-2);--action-button-edge-to-text-size: var(--luzmo-spacing-2);--action-button-corner-triangle-size: var(--luzmo-spacing-2)}:host([size=s]){--action-button-min-width: var(--luzmo-component-height-s);--action-button-height: var(--luzmo-component-height-s);--action-button-icon-size: var(--luzmo-font-size);--action-button-font-size: var(--luzmo-font-size-s);--action-button-text-to-visual: var(--luzmo-spacing-3);--action-button-edge-to-hold-icon: var(--luzmo-spacing-2);--action-button-edge-to-visual-size: var(--luzmo-spacing-3);--action-button-edge-to-visual-only-size: var(--luzmo-spacing-2);--action-button-edge-to-text-size: var(--luzmo-spacing-3);--action-button-corner-triangle-size: var(--luzmo-spacing-2)}:host([size=l]){--action-button-min-width: var(--luzmo-component-height-l);--action-button-height: var(--luzmo-component-height-l);--action-button-icon-size: var(--luzmo-font-size-xl);--action-button-font-size: var(--luzmo-font-size-l);--action-button-text-to-visual: var(--luzmo-spacing-3);--action-button-edge-to-hold-icon: var(--luzmo-spacing-2);--action-button-edge-to-visual-size: var(--luzmo-spacing-4);--action-button-edge-to-visual-only-size: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--action-button-edge-to-text-size: var(--luzmo-spacing-5);--action-button-corner-triangle-size: var(--luzmo-spacing-3)}:host([size=xl]){--action-button-min-width: var(--luzmo-component-height-xl);--action-button-height: var(--luzmo-component-height-xl);--action-button-icon-size: var(--luzmo-font-size-xxl);--action-button-font-size: var(--luzmo-font-size-xl);--action-button-text-to-visual: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--action-button-edge-to-hold-icon: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) );--action-button-edge-to-visual-size: var(--luzmo-spacing-5);--action-button-edge-to-visual-only-size: var(--luzmo-spacing-4);--action-button-edge-to-text-size: var(--luzmo-spacing-5);--action-button-corner-triangle-size: var(--luzmo-spacing-3)}::slotted([slot=icon]){flex-shrink:0}#label{flex-grow:var(--action-button-label-flex-grow);text-align:var(--action-button-label-text-align);pointer-events:none!important}:host([size=xs]){min-width:var(--action-button-height, 0);--action-button-edge-to-visual-only: calc( var(--luzmo-spacing-2) - var(--action-button-border-width) )}:host([size=s]){--action-button-edge-to-visual-only: calc( var(--luzmo-spacing-2) - var(--action-button-border-width) )}:host([size=m]){--action-button-edge-to-visual-only: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) - var(--action-button-border-width) )}:host([size=l]){--action-button-edge-to-visual-only: calc( var(--luzmo-spacing-3) - var(--action-button-border-width) )}:host([size=xl]){--action-button-edge-to-visual-only: calc( var(--luzmo-spacing-4) - var(--action-button-border-width) )}@media (forced-colors: active){:host{--highcontrast-action-button-border-color-disabled: GrayText;--highcontrast-action-button-content-color-disabled: GrayText}}';var m=Object.defineProperty,v=Object.getOwnPropertyDescriptor,e=(c,o,t,r)=>{for(var i=r>1?void 0:r?v(o,t):o,l=c.length-1,u;l>=0;l--)(u=c[l])&&(i=(r?u(o,t,i):u(i))||i);return r&&i&&m(o,t,i),i};const z=300;let b;class a extends n.m(s.a,{validSizes:["xs","s","m","l","xl"],noDefaultSize:!0}){constructor(){super(),this.emphasized=!1,this.holdAffordance=!1,this.quiet=!1,this.role="button",this.selected=!1,this.toggles=!1,this._value="",this.onClick=()=>{this.toggles&&(this.selected=!this.selected,this.dispatchEvent(new Event("change",{cancelable:!0,bubbles:!0,composed:!0}))||(this.selected=!this.selected))},this.addEventListener("click",this.onClick)}static get styles(){return[...super.styles,n.at(h)]}get value(){return this._value||this.itemText}set value(o){o!==this._value&&(this._value=o||"",this._value?this.setAttribute("value",this._value):this.removeAttribute("value"))}get itemText(){return(this.textContent||"").trim()}handlePointerdownHoldAffordance(o){o.button===0&&(this.addEventListener("pointerup",this.handlePointerupHoldAffordance),this.addEventListener("pointercancel",this.handlePointerupHoldAffordance),b=setTimeout(()=>{this.dispatchEvent(new CustomEvent("longpress",{bubbles:!0,composed:!0,detail:{source:"pointer"}}))},z))}handlePointerupHoldAffordance(){clearTimeout(b),this.removeEventListener("pointerup",this.handlePointerupHoldAffordance),this.removeEventListener("pointercancel",this.handlePointerupHoldAffordance)}handleKeydown(o){if(!this.holdAffordance)return super.handleKeydown(o);const{code:t,altKey:r}=o;(t==="Space"||r&&t==="ArrowDown")&&(o.preventDefault(),t==="ArrowDown"&&(o.stopPropagation(),o.stopImmediatePropagation()),this.addEventListener("keyup",this.handleKeyup),this.active=!0)}handleKeyup(o){if(!this.holdAffordance)return super.handleKeyup(o);const{code:t,altKey:r}=o;(t==="Space"||r&&t==="ArrowDown")&&(o.stopPropagation(),this.dispatchEvent(new CustomEvent("longpress",{bubbles:!0,composed:!0,detail:{source:"keyboard"}})),this.active=!1)}get buttonContent(){const o=super.buttonContent;return this.holdAffordance&&o.unshift(n.Rt`
37
- <div
38
- class="hold-affordance corner-triangle-${this.size}"
39
- >
40
- ${d.D(d.V)}
41
- </div>
42
- `),o}updated(o){super.updated(o);const t=this.role==="button",r=t&&(this.selected||this.toggles)&&!(this.hasAttribute("aria-haspopup")&&this.hasAttribute("aria-expanded"));(o.has("selected")||o.has("role"))&&(r?this.setAttribute("aria-pressed",this.selected?"true":"false"):(this.removeAttribute("aria-pressed"),t&&this.toggles&&this.hasAttribute("aria-expanded")&&this.setAttribute("aria-expanded",this.selected?"true":"false"))),o.has("holdAffordance")&&(this.holdAffordance?this.addEventListener("pointerdown",this.handlePointerdownHoldAffordance):(this.removeEventListener("pointerdown",this.handlePointerdownHoldAffordance),this.handlePointerupHoldAffordance()))}}e([n.zt({type:Boolean,reflect:!0})],a.prototype,"emphasized",2);e([n.zt({type:Boolean,reflect:!0,attribute:"hold-affordance"})],a.prototype,"holdAffordance",2);e([n.zt({type:Boolean,reflect:!0})],a.prototype,"quiet",2);e([n.zt({reflect:!0})],a.prototype,"role",2);e([n.zt({type:Boolean,reflect:!0})],a.prototype,"selected",2);e([n.zt({type:Boolean,reflect:!0})],a.prototype,"toggles",2);e([n.zt({reflect:!0,attribute:"static-color"})],a.prototype,"staticColor",2);e([n.zt({type:String})],a.prototype,"value",1);customElements.get("luzmo-action-button")||customElements.define("luzmo-action-button",a);