@lmvz-ds/components 0.30.0 → 0.32.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (208) hide show
  1. package/CHANGELOG.md +10 -0
  2. package/cjs/{ds.constants-D3srqM9m.js → ds.constants-CKeXfK-s.js} +10 -0
  3. package/cjs/{component-C7cavwmZ.js → element.util-Cq4y-_iX.js} +42 -31
  4. package/cjs/index.cjs.js +7 -1
  5. package/cjs/{list-keyboard-controller-CzZdPBeH.js → list-keyboard-controller-StN6Yn8W.js} +13 -8
  6. package/cjs/lmvz-action-list.cjs.entry.js +79 -0
  7. package/cjs/lmvz-button-group.cjs.entry.js +43 -47
  8. package/cjs/lmvz-button_2.cjs.entry.js +10 -8
  9. package/cjs/lmvz-card.cjs.entry.js +2 -2
  10. package/cjs/lmvz-checkbox.cjs.entry.js +1 -1
  11. package/cjs/lmvz-chip.cjs.entry.js +2 -2
  12. package/cjs/lmvz-components.cjs.js +1 -1
  13. package/cjs/lmvz-header_2.cjs.entry.js +3 -3
  14. package/cjs/lmvz-input.cjs.entry.js +5 -5
  15. package/cjs/lmvz-link.cjs.entry.js +2 -2
  16. package/cjs/lmvz-menuitem.cjs.entry.js +1 -1
  17. package/cjs/lmvz-message.cjs.entry.js +1 -1
  18. package/cjs/lmvz-modal.cjs.entry.js +5 -5
  19. package/cjs/lmvz-radio.cjs.entry.js +1 -1
  20. package/cjs/lmvz-select.cjs.entry.js +1 -1
  21. package/cjs/lmvz-snackbar.cjs.entry.js +1 -1
  22. package/cjs/lmvz-spinner.cjs.entry.js +1 -1
  23. package/cjs/lmvz-tab.cjs.entry.js +2 -2
  24. package/cjs/lmvz-tabs.cjs.entry.js +4 -4
  25. package/cjs/lmvz-toggle.cjs.entry.js +3 -3
  26. package/cjs/loader.cjs.js +1 -1
  27. package/cjs/stencil.util-DzvzXSwk.js +25 -0
  28. package/collection/collection-manifest.json +1 -0
  29. package/collection/components/lmvz-action-list/lmvz-action-list.css +93 -0
  30. package/collection/components/lmvz-action-list/lmvz-action-list.js +104 -0
  31. package/collection/components/lmvz-button/lmvz-button.css +65 -45
  32. package/collection/components/lmvz-button/lmvz-button.js +28 -7
  33. package/collection/components/lmvz-button-group/lmvz-button-group.css +33 -2
  34. package/collection/components/lmvz-button-group/lmvz-button-group.js +54 -38
  35. package/collection/components/lmvz-card/lmvz-card.css +58 -45
  36. package/collection/components/lmvz-card/lmvz-card.js +2 -2
  37. package/collection/components/lmvz-checkbox/lmvz-checkbox.js +2 -2
  38. package/collection/components/lmvz-chip/lmvz-chip.js +7 -7
  39. package/collection/components/lmvz-header/lmvz-header.js +2 -2
  40. package/collection/components/lmvz-icon/lmvz-icon.js +2 -2
  41. package/collection/components/lmvz-input/lmvz-input.js +5 -5
  42. package/collection/components/lmvz-link/lmvz-link.js +3 -3
  43. package/collection/components/lmvz-menuitem/lmvz-menuitem.js +2 -2
  44. package/collection/components/lmvz-message/lmvz-message.js +1 -1
  45. package/collection/components/lmvz-modal/lmvz-modal.css +7 -0
  46. package/collection/components/lmvz-modal/lmvz-modal.js +3 -3
  47. package/collection/components/lmvz-radio/lmvz-radio.js +2 -2
  48. package/collection/components/lmvz-select/lmvz-select.js +2 -2
  49. package/collection/components/lmvz-snackbar/lmvz-snackbar.js +1 -1
  50. package/collection/components/lmvz-spinner/lmvz-spinner.js +1 -1
  51. package/collection/components/lmvz-tab/lmvz-tab.css +7 -0
  52. package/collection/components/lmvz-tab/lmvz-tab.js +1 -1
  53. package/collection/components/lmvz-tabs/lmvz-tabs.css +7 -0
  54. package/collection/components/lmvz-tabs/lmvz-tabs.js +2 -2
  55. package/collection/components/lmvz-toggle/lmvz-toggle.js +3 -3
  56. package/collection/index.js +1 -1
  57. package/collection/integration/header-integration/header-integration.js +1 -1
  58. package/collection/utils/aria/aria.constants.js +53 -0
  59. package/collection/utils/aria/list-keyboard-controller.js +12 -7
  60. package/collection/utils/async/async.util.js +62 -0
  61. package/collection/utils/data/event.utilt.js +19 -0
  62. package/collection/utils/data/number.util.js +6 -0
  63. package/collection/utils/data/object.util.js +20 -0
  64. package/collection/utils/data/time.util.js +3 -0
  65. package/collection/utils/element/element.util.js +117 -0
  66. package/collection/utils/{assets.js → stencil/assets.js} +1 -1
  67. package/collection/utils/stencil/stencil.util.js +12 -0
  68. package/components/index.d.ts +2 -0
  69. package/components/index.d.ts.bak +2 -0
  70. package/components/index.js +1 -1
  71. package/components/lmvz-action-list.d.ts +11 -0
  72. package/components/lmvz-action-list.d.ts.bak +11 -0
  73. package/components/lmvz-action-list.js +1 -0
  74. package/components/lmvz-button-group.js +1 -1
  75. package/components/lmvz-button.js +1 -1
  76. package/components/lmvz-card.js +1 -1
  77. package/components/lmvz-checkbox.js +1 -1
  78. package/components/lmvz-chip.js +1 -1
  79. package/components/lmvz-header.js +1 -1
  80. package/components/lmvz-icon.js +1 -1
  81. package/components/lmvz-input.js +1 -1
  82. package/components/lmvz-link.js +1 -1
  83. package/components/lmvz-menuitem.js +1 -1
  84. package/components/lmvz-message.js +1 -1
  85. package/components/lmvz-modal.js +1 -1
  86. package/components/lmvz-radio.js +1 -1
  87. package/components/lmvz-select.js +1 -1
  88. package/components/lmvz-snackbar.js +1 -1
  89. package/components/lmvz-spinner.js +1 -1
  90. package/components/lmvz-tab.js +1 -1
  91. package/components/lmvz-tabs.js +1 -1
  92. package/components/lmvz-toggle.js +1 -1
  93. package/components/p-B0H9qIwE.js +1 -0
  94. package/components/p-B4m1n4et.js +1 -0
  95. package/components/p-CJRqhXjK.js +1 -0
  96. package/components/p-CxfT9IA1.js +1 -0
  97. package/components/{p-CXakymyP.js → p-DJ90327O.js} +1 -1
  98. package/components/p-DeO5Vbxh.js +1 -0
  99. package/components/p-DuEtnKRj.js +1 -0
  100. package/esm/{ds.constants-BLS5MjIu.js → ds.constants-DuEtnKRj.js} +5 -1
  101. package/esm/{component-DOTK1OW3.js → element.util-CxfT9IA1.js} +37 -31
  102. package/esm/index.js +1 -1
  103. package/esm/{list-keyboard-controller-Coi8XfUH.js → list-keyboard-controller-BKa9Kd2t.js} +12 -7
  104. package/esm/lmvz-action-list.entry.js +77 -0
  105. package/esm/lmvz-button-group.entry.js +35 -39
  106. package/esm/lmvz-button_2.entry.js +9 -7
  107. package/esm/lmvz-card.entry.js +2 -2
  108. package/esm/lmvz-checkbox.entry.js +1 -1
  109. package/esm/lmvz-chip.entry.js +2 -2
  110. package/esm/lmvz-components.js +1 -1
  111. package/esm/lmvz-header_2.entry.js +3 -3
  112. package/esm/lmvz-input.entry.js +4 -4
  113. package/esm/lmvz-link.entry.js +2 -2
  114. package/esm/lmvz-menuitem.entry.js +1 -1
  115. package/esm/lmvz-message.entry.js +1 -1
  116. package/esm/lmvz-modal.entry.js +3 -3
  117. package/esm/lmvz-radio.entry.js +1 -1
  118. package/esm/lmvz-select.entry.js +1 -1
  119. package/esm/lmvz-snackbar.entry.js +1 -1
  120. package/esm/lmvz-spinner.entry.js +1 -1
  121. package/esm/lmvz-tab.entry.js +2 -2
  122. package/esm/lmvz-tabs.entry.js +4 -4
  123. package/esm/lmvz-toggle.entry.js +2 -2
  124. package/esm/loader.js +1 -1
  125. package/esm/stencil.util-CJRqhXjK.js +23 -0
  126. package/hydrate/index.js +501 -388
  127. package/hydrate/index.mjs +501 -388
  128. package/lmvz-components/index.esm.js +1 -1
  129. package/lmvz-components/lmvz-components.esm.js +1 -1
  130. package/lmvz-components/{p-f3c44dd4.entry.js → p-1ce90ea7.entry.js} +1 -1
  131. package/lmvz-components/{p-b08db5ad.entry.js → p-24125bcf.entry.js} +1 -1
  132. package/lmvz-components/p-25a78ead.entry.js +1 -0
  133. package/lmvz-components/p-4072b2fb.entry.js +1 -0
  134. package/lmvz-components/p-48109e1d.entry.js +1 -0
  135. package/lmvz-components/{p-3b3e532f.entry.js → p-582f44ff.entry.js} +1 -1
  136. package/lmvz-components/p-592d509b.entry.js +1 -0
  137. package/lmvz-components/{p-d7e99f03.entry.js → p-6f61c24d.entry.js} +1 -1
  138. package/lmvz-components/{p-58498d43.entry.js → p-703b10b5.entry.js} +1 -1
  139. package/lmvz-components/p-74c7521c.entry.js +1 -0
  140. package/lmvz-components/{p-b5254532.entry.js → p-80a26307.entry.js} +1 -1
  141. package/lmvz-components/{p-c60ab9c9.entry.js → p-8e1f66dd.entry.js} +1 -1
  142. package/lmvz-components/p-947e1fe6.entry.js +1 -0
  143. package/lmvz-components/p-B4m1n4et.js +1 -0
  144. package/lmvz-components/p-CJRqhXjK.js +1 -0
  145. package/lmvz-components/p-CxfT9IA1.js +1 -0
  146. package/lmvz-components/p-DuEtnKRj.js +1 -0
  147. package/lmvz-components/{p-230962c8.entry.js → p-b79af711.entry.js} +1 -1
  148. package/lmvz-components/p-c00f0d96.entry.js +1 -0
  149. package/lmvz-components/{p-5c951888.entry.js → p-c0d05a97.entry.js} +1 -1
  150. package/lmvz-components/{p-c0b1d0af.entry.js → p-c3e8092e.entry.js} +1 -1
  151. package/lmvz-components/{p-2ca85b7c.entry.js → p-ed3c2b13.entry.js} +1 -1
  152. package/lmvz-components/{p-35da6bfb.entry.js → p-fa2cd315.entry.js} +1 -1
  153. package/manifest.json +130 -18
  154. package/package.json +5 -1
  155. package/types/api/ds.constants.d.ts +0 -40
  156. package/types/api/ds.types.d.ts +68 -1
  157. package/types/components/lmvz-action-list/lmvz-action-list.d.ts +15 -0
  158. package/types/components/lmvz-button/lmvz-button.d.ts +6 -3
  159. package/types/components/lmvz-button-group/lmvz-button-group.d.ts +2 -0
  160. package/types/components/lmvz-checkbox/lmvz-checkbox.d.ts +1 -1
  161. package/types/components/lmvz-chip/lmvz-chip.d.ts +2 -2
  162. package/types/components/lmvz-header/lmvz-header.d.ts +1 -1
  163. package/types/components/lmvz-icon/lmvz-icon.d.ts +1 -1
  164. package/types/components/lmvz-input/lmvz-input.d.ts +1 -1
  165. package/types/components/lmvz-link/lmvz-link.d.ts +1 -1
  166. package/types/components/lmvz-menuitem/lmvz-menuitem.d.ts +1 -1
  167. package/types/components/lmvz-modal/lmvz-modal.d.ts +1 -1
  168. package/types/components/lmvz-radio/lmvz-radio.d.ts +1 -1
  169. package/types/components/lmvz-select/lmvz-select.d.ts +1 -1
  170. package/types/components/lmvz-tabs/lmvz-tabs.d.ts +1 -1
  171. package/types/components/lmvz-toggle/lmvz-toggle.d.ts +1 -1
  172. package/types/components.d.ts +83 -2
  173. package/types/index.d.ts +1 -1
  174. package/types/utils/aria/aria-validation-controller.d.ts +3 -3
  175. package/types/utils/aria/aria.constants.d.ts +1 -0
  176. package/types/utils/aria/element-activation-controller.d.ts +1 -1
  177. package/types/utils/aria/list-keyboard-controller.d.ts +4 -1
  178. package/types/utils/async/async.util.d.ts +8 -0
  179. package/types/utils/data/event.utilt.d.ts +4 -0
  180. package/types/utils/data/number.util.d.ts +2 -0
  181. package/types/utils/data/object.util.d.ts +5 -0
  182. package/types/utils/data/time.util.d.ts +1 -0
  183. package/types/utils/element/element.util.d.ts +21 -0
  184. package/types/utils/radio/radio-group-controller.d.ts +1 -1
  185. package/types/utils/{reactive-controller-host.d.ts → stencil/reactive-controller-host.d.ts} +1 -1
  186. package/types/utils/stencil/stencil.util.d.ts +6 -0
  187. package/collection/utils/component.js +0 -270
  188. package/collection/utils/http.js +0 -21
  189. package/collection/utils/http.unit.js +0 -47
  190. package/components/p-BLS5MjIu.js +0 -1
  191. package/components/p-C0f2nNPZ.js +0 -1
  192. package/components/p-CtaMrBNE.js +0 -1
  193. package/components/p-DGlgVBPj.js +0 -1
  194. package/components/p-DOTK1OW3.js +0 -1
  195. package/lmvz-components/p-0d435e7b.entry.js +0 -1
  196. package/lmvz-components/p-44fea470.entry.js +0 -1
  197. package/lmvz-components/p-4dc44520.entry.js +0 -1
  198. package/lmvz-components/p-BLS5MjIu.js +0 -1
  199. package/lmvz-components/p-CtaMrBNE.js +0 -1
  200. package/lmvz-components/p-DOTK1OW3.js +0 -1
  201. package/lmvz-components/p-a4077c9f.entry.js +0 -1
  202. package/lmvz-components/p-dce6e41d.entry.js +0 -1
  203. package/lmvz-components/p-e3ce44a3.entry.js +0 -1
  204. package/types/utils/component.d.ts +0 -33
  205. package/types/utils/http.d.ts +0 -26
  206. package/types/utils/http.unit.d.ts +0 -1
  207. /package/collection/utils/{reactive-controller-host.js → stencil/reactive-controller-host.js} +0 -0
  208. /package/types/utils/{assets.d.ts → stencil/assets.d.ts} +0 -0
package/hydrate/index.mjs CHANGED
@@ -5429,97 +5429,6 @@ class LmvzAction {
5429
5429
  }; }
5430
5430
  }
5431
5431
 
5432
- function getDefaultExportFromCjs (x) {
5433
- return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
5434
- }
5435
-
5436
- var classnames = {exports: {}};
5437
-
5438
- /*!
5439
- Copyright (c) 2018 Jed Watson.
5440
- Licensed under the MIT License (MIT), see
5441
- http://jedwatson.github.io/classnames
5442
- */
5443
-
5444
- var hasRequiredClassnames;
5445
-
5446
- function requireClassnames () {
5447
- if (hasRequiredClassnames) return classnames.exports;
5448
- hasRequiredClassnames = 1;
5449
- (function (module) {
5450
- /* global define */
5451
-
5452
- (function () {
5453
-
5454
- var hasOwn = {}.hasOwnProperty;
5455
-
5456
- function classNames () {
5457
- var classes = '';
5458
-
5459
- for (var i = 0; i < arguments.length; i++) {
5460
- var arg = arguments[i];
5461
- if (arg) {
5462
- classes = appendClass(classes, parseValue(arg));
5463
- }
5464
- }
5465
-
5466
- return classes;
5467
- }
5468
-
5469
- function parseValue (arg) {
5470
- if (typeof arg === 'string' || typeof arg === 'number') {
5471
- return arg;
5472
- }
5473
-
5474
- if (typeof arg !== 'object') {
5475
- return '';
5476
- }
5477
-
5478
- if (Array.isArray(arg)) {
5479
- return classNames.apply(null, arg);
5480
- }
5481
-
5482
- if (arg.toString !== Object.prototype.toString && !arg.toString.toString().includes('[native code]')) {
5483
- return arg.toString();
5484
- }
5485
-
5486
- var classes = '';
5487
-
5488
- for (var key in arg) {
5489
- if (hasOwn.call(arg, key) && arg[key]) {
5490
- classes = appendClass(classes, key);
5491
- }
5492
- }
5493
-
5494
- return classes;
5495
- }
5496
-
5497
- function appendClass (value, newClass) {
5498
- if (!newClass) {
5499
- return value;
5500
- }
5501
-
5502
- if (value) {
5503
- return value + ' ' + newClass;
5504
- }
5505
-
5506
- return value + newClass;
5507
- }
5508
-
5509
- if (module.exports) {
5510
- classNames.default = classNames;
5511
- module.exports = classNames;
5512
- } else {
5513
- window.classNames = classNames;
5514
- }
5515
- }());
5516
- } (classnames));
5517
- return classnames.exports;
5518
- }
5519
-
5520
- var classnamesExports = requireClassnames();
5521
- var classNames = /*@__PURE__*/getDefaultExportFromCjs(classnamesExports);
5522
-
5523
5432
  /**
5524
5433
  * Verify whether a value is a Promise by duck-testing for a 'then' function
5525
5434
  */
@@ -5704,55 +5613,6 @@ class AriaValidationController {
5704
5613
  }
5705
5614
  }
5706
5615
 
5707
- class ElementActivationController {
5708
- host;
5709
- config;
5710
- constructor(host, config) {
5711
- this.host = host;
5712
- this.config = config;
5713
- }
5714
- hostDidLoad() {
5715
- if (!this.host.el.hasAttribute('tabindex')) {
5716
- console.warn('Interactive element does not have a tabindex attribute!', this.host.el);
5717
- }
5718
- this.host.el.addEventListener('keydown', this.handleKeyDown.bind(this));
5719
- this.host.el.addEventListener('click', this.handleActivation.bind(this));
5720
- }
5721
- handleKeyDown = (event) => {
5722
- if ((this.config?.keys ?? ['Enter', ' ']).includes(event.key)) {
5723
- event.preventDefault();
5724
- this.handleActivation(event);
5725
- }
5726
- };
5727
- handleActivation = (event) => {
5728
- this.host.lmvzActivation.emit();
5729
- if (this.config?.localHandler) {
5730
- this.config.localHandler(event);
5731
- }
5732
- };
5733
- }
5734
-
5735
- const componentOnReady = (el, callback) => {
5736
- if (el.componentOnReady) {
5737
- el.componentOnReady().then((resolvedEl) => callback(resolvedEl));
5738
- }
5739
- else {
5740
- raf(() => callback(el));
5741
- }
5742
- };
5743
- const inheritAttributes = (el, attributes = []) => {
5744
- const attributeObject = {};
5745
- attributes.forEach((attr) => {
5746
- if (el.hasAttribute(attr)) {
5747
- const value = el.getAttribute(attr);
5748
- if (value !== null) {
5749
- attributeObject[attr] = el.getAttribute(attr);
5750
- }
5751
- el.removeAttribute(attr);
5752
- }
5753
- });
5754
- return attributeObject;
5755
- };
5756
5616
  const ariaAttributes = [
5757
5617
  'role',
5758
5618
  'aria-activedescendant',
@@ -5806,6 +5666,42 @@ const ariaAttributes = [
5806
5666
  'aria-valuenow',
5807
5667
  'aria-valuetext',
5808
5668
  ];
5669
+
5670
+ function isActionButton(element) {
5671
+ return ['LMVZ-BUTTON', 'BUTTON'].includes(element.tagName.toUpperCase());
5672
+ }
5673
+ function isLmvzButton(element) {
5674
+ return element?.tagName.toUpperCase() === 'LMVZ-BUTTON';
5675
+ }
5676
+ function isDisabledButton(element) {
5677
+ return element.hasAttribute('disabled') || element.disabled === true;
5678
+ }
5679
+ function isVisible(element) {
5680
+ return !element.hasAttribute('hidden');
5681
+ }
5682
+ function getActionVariant(element) {
5683
+ const variant = element.getAttribute('variant') ?? element.variant;
5684
+ return variant === 'primary' || variant === 'secondary' || variant === 'tertiary' ? variant : 'secondary';
5685
+ }
5686
+ function isPrimaryAction(element) {
5687
+ return getActionVariant(element) === 'primary';
5688
+ }
5689
+ function isSecondaryAction(element) {
5690
+ return getActionVariant(element) === 'secondary';
5691
+ }
5692
+ const inheritAttributes = (el, attributes = []) => {
5693
+ const attributeObject = {};
5694
+ attributes.forEach((attr) => {
5695
+ if (el.hasAttribute(attr)) {
5696
+ const value = el.getAttribute(attr);
5697
+ if (value !== null) {
5698
+ attributeObject[attr] = el.getAttribute(attr);
5699
+ }
5700
+ el.removeAttribute(attr);
5701
+ }
5702
+ });
5703
+ return attributeObject;
5704
+ };
5809
5705
  const inheritAriaAttributes = (el, ignoreList) => {
5810
5706
  let attributesToInherit = ariaAttributes;
5811
5707
  if (ignoreList && ignoreList.length > 0) {
@@ -5813,15 +5709,6 @@ const inheritAriaAttributes = (el, ignoreList) => {
5813
5709
  }
5814
5710
  return inheritAttributes(el, attributesToInherit);
5815
5711
  };
5816
- const raf = (h) => {
5817
- if (typeof __zone_symbol__requestAnimationFrame === 'function') {
5818
- return __zone_symbol__requestAnimationFrame(h);
5819
- }
5820
- if (typeof requestAnimationFrame === 'function') {
5821
- return requestAnimationFrame(h);
5822
- }
5823
- return setTimeout(h);
5824
- };
5825
5712
  function getDeepActiveElement(root = document) {
5826
5713
  let activeElement = root.activeElement;
5827
5714
  if (!activeElement) {
@@ -5868,6 +5755,179 @@ function findFormByRef(form, el) {
5868
5755
  return el.closest('form');
5869
5756
  }
5870
5757
 
5758
+ const defaultConfig = {
5759
+ orientation: 'both',
5760
+ enableHomeAndEnd: false,
5761
+ manageTabIndex: false,
5762
+ };
5763
+ class DirectionalFocusController {
5764
+ host;
5765
+ elements = [];
5766
+ currentElement;
5767
+ config;
5768
+ constructor(host, config = {}) {
5769
+ this.host = host;
5770
+ this.config = {
5771
+ ...defaultConfig,
5772
+ ...config,
5773
+ };
5774
+ }
5775
+ hostConnected() {
5776
+ this.host.el.addEventListener('keydown', this.handleKeydown);
5777
+ this.syncManagedFocusTarget();
5778
+ }
5779
+ hostDisconnected() {
5780
+ this.host.el.removeEventListener('keydown', this.handleKeydown);
5781
+ }
5782
+ updateElements(elements) {
5783
+ const previousElement = this.currentElement ?? this.getManagedActiveElement() ?? undefined;
5784
+ this.elements = elements.filter((element) => 'focus' in element && element.nodeType === 1);
5785
+ this.syncManagedFocusTarget(previousElement);
5786
+ }
5787
+ setCurrentElement(element) {
5788
+ const previousElement = this.currentElement;
5789
+ this.currentElement = element !== null && element !== undefined && 'focus' in element && element.nodeType === 1 ? element : undefined;
5790
+ this.syncManagedFocusTarget(previousElement);
5791
+ }
5792
+ handleKeydown = (event) => {
5793
+ const intent = this.getFocusIntent(event.key);
5794
+ if (!intent)
5795
+ return;
5796
+ const activeElement = this.getManagedActiveElement();
5797
+ const nextElement = this.getTargetElement(activeElement, intent);
5798
+ if (!nextElement)
5799
+ return;
5800
+ event.preventDefault();
5801
+ this.applyFocusTarget(nextElement, true);
5802
+ };
5803
+ getFocusIntent(key) {
5804
+ if (this.config.enableHomeAndEnd && key === 'Home')
5805
+ return 'first';
5806
+ if (this.config.enableHomeAndEnd && key === 'End')
5807
+ return 'last';
5808
+ if (this.config.orientation === 'horizontal') {
5809
+ if (key === 'ArrowRight')
5810
+ return 'next';
5811
+ if (key === 'ArrowLeft')
5812
+ return 'previous';
5813
+ return undefined;
5814
+ }
5815
+ if (this.config.orientation === 'vertical') {
5816
+ if (key === 'ArrowDown')
5817
+ return 'next';
5818
+ if (key === 'ArrowUp')
5819
+ return 'previous';
5820
+ return undefined;
5821
+ }
5822
+ if (key === 'ArrowDown' || key === 'ArrowRight')
5823
+ return 'next';
5824
+ if (key === 'ArrowUp' || key === 'ArrowLeft')
5825
+ return 'previous';
5826
+ return undefined;
5827
+ }
5828
+ getManagedActiveElement() {
5829
+ const activeElement = getDeepActiveElement(this.host.el.ownerDocument ?? document);
5830
+ if (activeElement instanceof HTMLElement) {
5831
+ const match = this.elements.find((el) => resolveElement(el) === activeElement);
5832
+ if (match && this.canMoveFocusTo(match))
5833
+ return match;
5834
+ }
5835
+ if (this.currentElement && this.elements.includes(this.currentElement) && this.canMoveFocusTo(this.currentElement)) {
5836
+ return this.currentElement;
5837
+ }
5838
+ return undefined;
5839
+ }
5840
+ getTargetElement(current, intent) {
5841
+ if (!this.elements.length)
5842
+ return undefined;
5843
+ if (intent === 'first')
5844
+ return this.findFocusableFromIndex(-1, 'next');
5845
+ if (intent === 'last')
5846
+ return this.findFocusableFromIndex(this.elements.length, 'previous');
5847
+ const currentIndex = current ? this.elements.indexOf(current) : -1;
5848
+ if (currentIndex === -1) {
5849
+ return intent === 'next' ? this.findFocusableFromIndex(-1, 'next') : this.findFocusableFromIndex(this.elements.length, 'previous');
5850
+ }
5851
+ return this.findFocusableFromIndex(currentIndex, intent);
5852
+ }
5853
+ findFocusableFromIndex(startIndex, intent) {
5854
+ if (!this.elements.length)
5855
+ return undefined;
5856
+ const step = intent === 'next' ? 1 : -1;
5857
+ for (let offset = 1; offset <= this.elements.length; offset++) {
5858
+ const index = (startIndex + step * offset + this.elements.length) % this.elements.length;
5859
+ const candidate = this.elements[index];
5860
+ if (this.canMoveFocusTo(candidate))
5861
+ return candidate;
5862
+ }
5863
+ return undefined;
5864
+ }
5865
+ syncManagedFocusTarget(previousElement) {
5866
+ const nextElement = this.selectManagedElement(previousElement);
5867
+ const didChange = nextElement !== this.currentElement;
5868
+ this.currentElement = nextElement;
5869
+ if (this.config.manageTabIndex) {
5870
+ this.updateTabIndexes(nextElement);
5871
+ }
5872
+ if (didChange && nextElement) {
5873
+ this.config.onFocusTargetChange?.(nextElement);
5874
+ }
5875
+ }
5876
+ selectManagedElement(previousElement) {
5877
+ const activeElement = this.getManagedActiveElement();
5878
+ if (activeElement)
5879
+ return activeElement;
5880
+ if (this.currentElement && this.elements.includes(this.currentElement) && this.canMoveFocusTo(this.currentElement)) {
5881
+ return this.currentElement;
5882
+ }
5883
+ if (previousElement && this.elements.includes(previousElement)) {
5884
+ return this.findFocusableFromIndex(this.elements.indexOf(previousElement), 'next') ?? this.findFocusableFromIndex(-1, 'next');
5885
+ }
5886
+ const currentRovingTarget = this.elements.find((element) => element.tabIndex === 0 && this.canMoveFocusTo(element));
5887
+ if (currentRovingTarget)
5888
+ return currentRovingTarget;
5889
+ return this.findFocusableFromIndex(-1, 'next');
5890
+ }
5891
+ updateTabIndexes(activeElement) {
5892
+ this.elements.forEach((element) => {
5893
+ element.tabIndex = activeElement && element === activeElement ? 0 : -1;
5894
+ });
5895
+ }
5896
+ applyFocusTarget(element, shouldFocus) {
5897
+ const didChange = element !== this.currentElement;
5898
+ this.currentElement = element;
5899
+ if (this.config.manageTabIndex) {
5900
+ this.updateTabIndexes(element);
5901
+ }
5902
+ if (shouldFocus) {
5903
+ element.focus();
5904
+ }
5905
+ if (didChange) {
5906
+ this.config.onFocusTargetChange?.(element);
5907
+ }
5908
+ }
5909
+ canMoveFocusTo(element) {
5910
+ if (!element)
5911
+ return false;
5912
+ if (element.hasAttribute('disabled'))
5913
+ return false;
5914
+ if ('disabled' in element && Boolean(element.disabled))
5915
+ return false;
5916
+ if (element.getAttribute('aria-disabled') === 'true')
5917
+ return false;
5918
+ if (this.config.isFocusableElement)
5919
+ return this.config.isFocusableElement(element);
5920
+ const isTabOrderable = this.config.manageTabIndex || element.tabIndex >= 0;
5921
+ return isTabOrderable && element.getAttribute('aria-hidden') !== 'true' && (element.checkVisibility?.() ?? true) && element.offsetParent !== null;
5922
+ }
5923
+ }
5924
+ function isDirectionalFocusReceiver(el) {
5925
+ return typeof el.resolveFocusableElement === 'function';
5926
+ }
5927
+ function resolveElement(el) {
5928
+ return isDirectionalFocusReceiver(el) ? (el.resolveFocusableElement() ?? el) : el;
5929
+ }
5930
+
5871
5931
  class ReactiveControllerHost {
5872
5932
  controllers = new Set();
5873
5933
  addController(controller) {
@@ -5903,12 +5963,210 @@ class ReactiveControllerHost {
5903
5963
  componentWillUpdate() {
5904
5964
  this.activeControllers.forEach((controller) => controller.hostWillUpdate?.());
5905
5965
  }
5906
- componentDidUpdate() {
5907
- this.activeControllers.forEach((controller) => controller.hostDidUpdate?.());
5966
+ componentDidUpdate() {
5967
+ this.activeControllers.forEach((controller) => controller.hostDidUpdate?.());
5968
+ }
5969
+ }
5970
+
5971
+ const lmvzActionListCss = () => `@layer lmvz-ds.reset, lmvz-ds.theme, lmvz-ds.components, lmvz-ds.overrides; @layer lmvz-ds.reset { body { margin: 0; } h1, h2, h3, h4, h5, h6 { margin: 0; } *[hidden] { display: none !important; } hr { height: 0; border: none; margin: var(--lmvz-dimension-4-8, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem)) 0; border-top: var(--lmvz-semantic-border-width-default, 1px) solid var(--lmvz-semantic-color-border-subtle, #f0f0f0); } } @layer lmvz-ds.components { .lmvz-wrapper-card-sm, .lmvz-wrapper-card-md, .lmvz-wrapper-card-lg { background: var(--lmvz-semantic-color-surface-primary, #ffffff); box-shadow: var(--lmvz-ds-shadow-l3-default-strong, 0 2px 32px 0 rgba(120, 120, 128, 0.11)); } .lmvz-wrapper-card-sm { padding: var(--lmvz-component-wrapper-sm-padding-y, clamp(0.75rem, 0.69rem + 0.26vw, 1rem)) var(--lmvz-component-wrapper-sm-padding-x, clamp(0.75rem, 0.69rem + 0.26vw, 1rem)); border-radius: var(--lmvz-component-wrapper-sm-border-radius, 14px); } .lmvz-wrapper-card-md { padding: var(--lmvz-component-wrapper-md-padding-y, clamp(1rem, 0.88rem + 0.52vw, 1.5rem)) var(--lmvz-component-wrapper-md-padding-x, clamp(1rem, 0.88rem + 0.52vw, 1.5rem)); border-radius: var(--lmvz-component-wrapper-md-border-radius, 18px); } .lmvz-wrapper-card-lg { padding: var(--lmvz-component-wrapper-lg-padding-y, clamp(2.25rem, 2.19rem + 0.26vw, 2.5rem)) var(--lmvz-component-wrapper-lg-padding-x, clamp(1.5rem, 1.14rem + 1.55vw, 3rem)); border-radius: var(--lmvz-component-wrapper-lg-border-radius, 18px); } } .sc-lmvz-action-list-h { display: flex; flex-direction: column; gap: 0; lmvz-button, button { --lmvz-button-background-override: var(--lmvz-semantic-color-int-tertiary, #ffffff); --lmvz-button-color-override: var(--lmvz-semantic-color-int-on-tertiary, #000000); --lmvz-button-radius-override: var(--lmvz-semantic-border-radius-md, 6px); --lmvz-button-padding-inline-override: var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem)); --lmvz-button-padding-block-override: var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem)); width: 100%; display: block; &:hover { --lmvz-button-background-override: var(--lmvz-semantic-color-int-tertiary-hover, #f0f0f0); --lmvz-button-color-override: var(--lmvz-semantic-color-int-on-tertiary-hover, #000000); } &:active { --lmvz-button-background-override: var(--lmvz-semantic-color-int-tertiary-active, #e0e0e0); --lmvz-button-color-override: var(--lmvz-semantic-color-int-on-tertiary-active, #000000); } } .lmvz-action-list-item--danger { --lmvz-button-color-override: var(--lmvz-semantic-color-status-on-danger, #e52a31); &:hover { --lmvz-button-background-override: var(--lmvz-semantic-color-status-danger, #fdf1f2); --lmvz-button-color-override: var(--lmvz-semantic-color-status-on-danger, #e52a31); } &:active { --lmvz-button-background-override: var(--lmvz-semantic-color-status-on-danger-subtle, #f7bfc2); --lmvz-button-color-override: var(--lmvz-semantic-color-status-on-danger, #e52a31); } } }`;
5972
+
5973
+ class LmvzActionList extends ReactiveControllerHost {
5974
+ get el() { return getElement(this); }
5975
+ slotEl;
5976
+ get validationEl() {
5977
+ return this.el;
5978
+ }
5979
+ get validationSlot() {
5980
+ return this.slotEl;
5981
+ }
5982
+ focusController = new DirectionalFocusController(this, {
5983
+ orientation: 'vertical',
5984
+ manageTabIndex: true,
5985
+ enableHomeAndEnd: true,
5986
+ });
5987
+ label;
5988
+ constructor(hostRef) {
5989
+ super();
5990
+ registerInstance(this, hostRef);
5991
+ this.addController(this.focusController);
5992
+ this.addController(new AriaValidationController(this, {
5993
+ validationTiming: 'slot',
5994
+ }));
5995
+ }
5996
+ componentDidLoad() {
5997
+ this.handleSlotChange();
5998
+ super.componentDidLoad();
5999
+ }
6000
+ handleSlotChange = () => {
6001
+ const slot = this.slotEl;
6002
+ if (!slot)
6003
+ return;
6004
+ const assigned = slot.assignedElements();
6005
+ const interactive = [];
6006
+ for (const el of assigned) {
6007
+ collectInteractiveButtonsRecursively(el, interactive);
6008
+ }
6009
+ this.focusController.updateElements(interactive);
6010
+ };
6011
+ render() {
6012
+ const ariaLabel = this.label || undefined;
6013
+ return (hAsync(Host, { key: '79e2d77c9aca02fb3ef2e58d241664598253334b', role: "menu", "aria-label": ariaLabel, class: "lmvz-wrapper-card-sm" }, hAsync("slot", { key: '941b875a5be536c3d0e2ff9287da5af1a416d356', onSlotchange: this.handleSlotChange, ref: (el) => (this.slotEl = el) })));
6014
+ }
6015
+ static get style() { return lmvzActionListCss(); }
6016
+ static get cmpMeta() { return {
6017
+ "$flags$": 774,
6018
+ "$tagName$": "lmvz-action-list",
6019
+ "$members$": {
6020
+ "label": [1]
6021
+ },
6022
+ "$listeners$": undefined,
6023
+ "$lazyBundleId$": "-",
6024
+ "$attrsToReflect$": []
6025
+ }; }
6026
+ }
6027
+ function collectInteractiveButtonsRecursively(el, collection) {
6028
+ const tag = el.tagName.toLowerCase();
6029
+ if (tag === 'lmvz-button') {
6030
+ el.buttonRole = 'menuitem';
6031
+ collection.push(el);
6032
+ return;
6033
+ }
6034
+ if (tag === 'button') {
6035
+ el.setAttribute('role', 'menuitem');
6036
+ collection.push(el);
6037
+ return;
6038
+ }
6039
+ if (tag === 'hr') {
6040
+ return;
6041
+ }
6042
+ if (el.getAttribute('role') === 'group') {
6043
+ const children = el.querySelectorAll('lmvz-button, button');
6044
+ children.forEach((child) => collectInteractiveButtonsRecursively(child, collection));
6045
+ return;
6046
+ }
6047
+ console.warn('Unexpected element encountered in ActionList:', tag);
6048
+ }
6049
+
6050
+ function getDefaultExportFromCjs (x) {
6051
+ return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
6052
+ }
6053
+
6054
+ var classnames = {exports: {}};
6055
+
6056
+ /*!
6057
+ Copyright (c) 2018 Jed Watson.
6058
+ Licensed under the MIT License (MIT), see
6059
+ http://jedwatson.github.io/classnames
6060
+ */
6061
+
6062
+ var hasRequiredClassnames;
6063
+
6064
+ function requireClassnames () {
6065
+ if (hasRequiredClassnames) return classnames.exports;
6066
+ hasRequiredClassnames = 1;
6067
+ (function (module) {
6068
+ /* global define */
6069
+
6070
+ (function () {
6071
+
6072
+ var hasOwn = {}.hasOwnProperty;
6073
+
6074
+ function classNames () {
6075
+ var classes = '';
6076
+
6077
+ for (var i = 0; i < arguments.length; i++) {
6078
+ var arg = arguments[i];
6079
+ if (arg) {
6080
+ classes = appendClass(classes, parseValue(arg));
6081
+ }
6082
+ }
6083
+
6084
+ return classes;
6085
+ }
6086
+
6087
+ function parseValue (arg) {
6088
+ if (typeof arg === 'string' || typeof arg === 'number') {
6089
+ return arg;
6090
+ }
6091
+
6092
+ if (typeof arg !== 'object') {
6093
+ return '';
6094
+ }
6095
+
6096
+ if (Array.isArray(arg)) {
6097
+ return classNames.apply(null, arg);
6098
+ }
6099
+
6100
+ if (arg.toString !== Object.prototype.toString && !arg.toString.toString().includes('[native code]')) {
6101
+ return arg.toString();
6102
+ }
6103
+
6104
+ var classes = '';
6105
+
6106
+ for (var key in arg) {
6107
+ if (hasOwn.call(arg, key) && arg[key]) {
6108
+ classes = appendClass(classes, key);
6109
+ }
6110
+ }
6111
+
6112
+ return classes;
6113
+ }
6114
+
6115
+ function appendClass (value, newClass) {
6116
+ if (!newClass) {
6117
+ return value;
6118
+ }
6119
+
6120
+ if (value) {
6121
+ return value + ' ' + newClass;
6122
+ }
6123
+
6124
+ return value + newClass;
6125
+ }
6126
+
6127
+ if (module.exports) {
6128
+ classNames.default = classNames;
6129
+ module.exports = classNames;
6130
+ } else {
6131
+ window.classNames = classNames;
6132
+ }
6133
+ }());
6134
+ } (classnames));
6135
+ return classnames.exports;
6136
+ }
6137
+
6138
+ var classnamesExports = requireClassnames();
6139
+ var classNames = /*@__PURE__*/getDefaultExportFromCjs(classnamesExports);
6140
+
6141
+ class ElementActivationController {
6142
+ host;
6143
+ config;
6144
+ constructor(host, config) {
6145
+ this.host = host;
6146
+ this.config = config;
6147
+ }
6148
+ hostDidLoad() {
6149
+ if (!this.host.el.hasAttribute('tabindex')) {
6150
+ console.warn('Interactive element does not have a tabindex attribute!', this.host.el);
6151
+ }
6152
+ this.host.el.addEventListener('keydown', this.handleKeyDown.bind(this));
6153
+ this.host.el.addEventListener('click', this.handleActivation.bind(this));
5908
6154
  }
6155
+ handleKeyDown = (event) => {
6156
+ if ((this.config?.keys ?? ['Enter', ' ']).includes(event.key)) {
6157
+ event.preventDefault();
6158
+ this.handleActivation(event);
6159
+ }
6160
+ };
6161
+ handleActivation = (event) => {
6162
+ this.host.lmvzActivation.emit();
6163
+ if (this.config?.localHandler) {
6164
+ this.config.localHandler(event);
6165
+ }
6166
+ };
5909
6167
  }
5910
6168
 
5911
- const lmvzButtonCss = () => ` @layer lmvz-ds.reset, lmvz-ds.theme, lmvz-ds.components, lmvz-ds.overrides; @layer lmvz-ds.theme { @font-face { font-family: Router; src: local('RouterBook-Regular'), local('Router-Book'), url('/assets/fonts/Router-Book.woff') format('woff'); font-weight: 400; } @font-face { font-family: Router; src: local('RouterMedium-Regular'), local('Router-Medium'), url('/assets/fonts/Router-Medium.woff') format('woff'); font-weight: 500; } @font-face { font-family: Router; src: local('RouterBold-Regular'), local('Router-Bold'), url('/assets/fonts/Router-Bold.woff') format('woff'); font-weight: 700; } } @layer lmvz-ds.reset { body { margin: 0; } h1, h2, h3, h4, h5, h6 { margin: 0; } *[hidden] { display: none !important; } } :host { button { --lmvz-button-color: var(--lmvz-component-color, var(--lmvz-semantic-color-int-on-secondary, #000000)); --lmvz-button-padding-inline: var(--lmvz-button-padding, var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem))); --lmvz-button-padding-block: var(--lmvz-button-padding, var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem))); --lmvz-button-gap: var(--lmvz-component-input-gap-md, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem)); --lmvz-button-min-height: var(--lmvz-component-input-size-md, clamp(2.5rem, 2.44rem + 0.26vw, 2.75rem)); --lmvz-button-font: var(--lmvz-typography-body-md-strong, 500 clamp(0.88rem, 0.84rem + 0.13vw, 1rem) / 1.5 Router); --lmvz-button-radius: var(--lmvz-component-input-radius-default, 999px); --lmvz-button-border-width: 0; --lmvz-button-border-color: transparent; --lmvz-button-background: var(--lmvz-semantic-color-int-secondary, #f0f0f0); display: inline-flex; align-items: center; justify-content: center; gap: var(--lmvz-button-gap); padding-block: var(--lmvz-button-padding-block); padding-inline: var(--lmvz-button-padding-inline); min-height: var(--lmvz-button-min-height); border-radius: var(--lmvz-button-radius); border: var(--lmvz-button-border-width) solid var(--lmvz-button-border-color); background-color: var(--lmvz-button-background); color: var(--lmvz-button-color); cursor: pointer; font: var(--lmvz-button-font); text-align: center; text-decoration: none; white-space: nowrap; transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease; } button > * { font: inherit; color: inherit; } button:focus-visible { outline: var(--lmvz-ds-outline, 1px solid #0e7ab4); outline-offset: var(--lmvz-ds-outline-offset, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem)); } button:is([disabled], .disabled) { cursor: not-allowed; pointer-events: none; opacity: var(--lmvz-component-input-disabled-opacity, 40%); } button:not([disabled]):hover { --lmvz-button-background: var(--lmvz-semantic-color-int-secondary-hover, #e0e0e0); } button:not([disabled]):active { --lmvz-button-background: var(--lmvz-semantic-color-int-secondary-active, #d4d4d4); } button.primary { --lmvz-button-background: var(--lmvz-semantic-color-int-primary, #000000); --lmvz-button-color: var(--lmvz-semantic-color-int-on-primary, #ffffff); --lmvz-button-border-width: 0; --lmvz-button-border-color: transparent; } button.primary:not([disabled], .disabled):hover { --lmvz-button-background: var(--lmvz-semantic-color-int-primary-hover, #2e2e2e); } button.primary:not([disabled], .disabled):active { --lmvz-button-background: var(--lmvz-semantic-color-int-primary-active, #545454); } button.secondary { --lmvz-button-background: var(--lmvz-semantic-color-int-secondary, #f0f0f0); --lmvz-button-color: var(--lmvz-semantic-color-int-on-secondary, #000000); --lmvz-button-border-width: 0; --lmvz-button-border-color: transparent; } button.secondary:not([disabled], .disabled):hover { --lmvz-button-background: var(--lmvz-semantic-color-int-secondary-hover, #e0e0e0); --lmvz-button-color: var(--lmvz-semantic-color-int-on-secondary-hover, #000000); } button.secondary:not([disabled], .disabled):active { --lmvz-button-background: var(--lmvz-semantic-color-int-secondary-active, #d4d4d4); --lmvz-button-color: var(--lmvz-semantic-color-int-on-secondary-active, #000000); } button.tertiary { --lmvz-button-background: var(--lmvz-semantic-color-int-tertiary, #ffffff); --lmvz-button-color: var(--lmvz-semantic-color-int-on-tertiary, #000000); } button.tertiary:not([disabled], .disabled):hover { --lmvz-button-background: var(--lmvz-semantic-color-int-tertiary-hover, #f0f0f0); --lmvz-button-color: var(--lmvz-semantic-color-int-on-tertiary-hover, #000000); } button.tertiary:not([disabled], .disabled):active { --lmvz-button-background: var(--lmvz-semantic-color-int-tertiary-active, #e0e0e0); --lmvz-button-color: var(--lmvz-semantic-color-int-on-tertiary-active, #000000); } button.small { --lmvz-button-padding-inline: var(--lmvz-component-input-padding-sm, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem)); --lmvz-button-padding-block: var(--lmvz-component-input-padding-sm, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem)); --lmvz-button-gap: var(--lmvz-component-input-gap-sm, clamp(0.38rem, 0.31rem + 0.26vw, 0.63rem)); --lmvz-button-min-height: var(--lmvz-component-input-size-sm, clamp(2rem, 1.94rem + 0.26vw, 2.25rem)); --lmvz-button-font: var(--lmvz-typography-body-sm-strong, 500 clamp(0.69rem, 0.67rem + 0.06vw, 0.75rem) / 1.5 Router); } button.large { --lmvz-button-padding-inline: var(--lmvz-component-input-padding-lg, clamp(1rem, 0.94rem + 0.26vw, 1.25rem)); --lmvz-button-padding-block: var(--lmvz-component-input-padding-lg, clamp(1rem, 0.94rem + 0.26vw, 1.25rem)); --lmvz-button-gap: var(--lmvz-component-input-gap-lg, clamp(0.75rem, 0.69rem + 0.26vw, 1rem)); --lmvz-button-min-height: var(--lmvz-component-input-size-lg, clamp(2.75rem, 2.69rem + 0.26vw, 3rem)); --lmvz-button-font: var(--lmvz-typography-body-lg-strong, 500 clamp(1rem, 0.97rem + 0.13vw, 1.13rem) / 1.5 Router); } display: inline-block; } ::slotted(*) { --lmvz-component-color: var(--lmvz-button-color); } `;
6169
+ const lmvzButtonCss = () => ` @layer lmvz-ds.reset, lmvz-ds.theme, lmvz-ds.components, lmvz-ds.overrides; @layer lmvz-ds.theme { @font-face { font-family: Router; src: local('RouterBook-Regular'), local('Router-Book'), url('/assets/fonts/Router-Book.woff') format('woff'); font-weight: 400; } @font-face { font-family: Router; src: local('RouterMedium-Regular'), local('Router-Medium'), url('/assets/fonts/Router-Medium.woff') format('woff'); font-weight: 500; } @font-face { font-family: Router; src: local('RouterBold-Regular'), local('Router-Bold'), url('/assets/fonts/Router-Bold.woff') format('woff'); font-weight: 700; } } @layer lmvz-ds.reset { body { margin: 0; } h1, h2, h3, h4, h5, h6 { margin: 0; } *[hidden] { display: none !important; } hr { height: 0; border: none; margin: var(--lmvz-dimension-4-8, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem)) 0; border-top: var(--lmvz-semantic-border-width-default, 1px) solid var(--lmvz-semantic-color-border-subtle, #f0f0f0); } } :host { button { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-secondary, #f0f0f0)); --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-int-on-secondary, #000000)); --lmvz-button-radius: var(--lmvz-button-radius-override, var(--lmvz-component-input-radius-default, 999px)); --lmvz-button-padding-inline: var(--lmvz-button-padding-inline-override, var(--lmvz-button-padding, var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem)))); --lmvz-button-padding-block: var(--lmvz-button-padding-block-override, var(--lmvz-button-padding, var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem)))); --lmvz-button-gap: var(--lmvz-button-gap-override, var(--lmvz-component-input-gap-md, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem))); --lmvz-button-min-height: var(--lmvz-button-min-height-override, var(--lmvz-component-input-size-md, clamp(2.5rem, 2.44rem + 0.26vw, 2.75rem))); --lmvz-button-font: var(--lmvz-button-font-override, var(--lmvz-typography-body-md-strong, 500 clamp(0.88rem, 0.84rem + 0.13vw, 1rem) / 1.5 Router)); --lmvz-button-border-width: var(--lmvz-button-border-width-override, 0); --lmvz-button-border-color: var(--lmvz-button-border-color-override, transparent); display: inline-flex; align-items: center; justify-content: center; gap: var(--lmvz-button-gap); padding-block: var(--lmvz-button-padding-block); padding-inline: var(--lmvz-button-padding-inline); min-height: var(--lmvz-button-min-height); border-radius: var(--lmvz-button-radius); border: var(--lmvz-button-border-width) solid var(--lmvz-button-border-color); background-color: var(--lmvz-button-background); color: var(--lmvz-button-color); cursor: pointer; font: var(--lmvz-button-font); text-align: center; text-decoration: none; white-space: nowrap; transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease; } button > * { font: inherit; color: inherit; } button:focus-visible { outline: var(--lmvz-ds-outline, 1px solid #0e7ab4); outline-offset: var(--lmvz-ds-outline-offset, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem)); position: relative; z-index: 1; } button:is([disabled], .disabled) { cursor: not-allowed; pointer-events: none; opacity: var(--lmvz-component-input-disabled-opacity, 40%); } button:not([disabled]):hover { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-secondary-hover, #e0e0e0)); } button:not([disabled]):active { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-secondary-active, #d4d4d4)); } button.primary { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-primary, #000000)); --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-int-on-primary, #ffffff)); --lmvz-button-border-width: var(--lmvz-button-border-width-override, 0); --lmvz-button-border-color: var(--lmvz-button-border-color-override, transparent); } button.primary:not([disabled], .disabled):hover { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-primary-hover, #2e2e2e)); } button.primary:not([disabled], .disabled):active { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-primary-active, #545454)); } button.secondary { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-secondary, #f0f0f0)); --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-int-on-secondary, #000000)); --lmvz-button-border-width: var(--lmvz-button-border-width-override, 0); --lmvz-button-border-color: var(--lmvz-button-border-color-override, transparent); } button.secondary:not([disabled], .disabled):hover { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-secondary-hover, #e0e0e0)); --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-int-on-secondary-hover, #000000)); } button.secondary:not([disabled], .disabled):active { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-secondary-active, #d4d4d4)); --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-int-on-secondary-active, #000000)); } button.tertiary { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-tertiary, #ffffff)); --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-int-on-tertiary, #000000)); } button.tertiary:not([disabled], .disabled):hover { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-tertiary-hover, #f0f0f0)); --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-int-on-tertiary-hover, #000000)); } button.tertiary:not([disabled], .disabled):active { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-tertiary-active, #e0e0e0)); --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-int-on-tertiary-active, #000000)); } button.small { --lmvz-button-padding-inline: var(--lmvz-button-padding-inline-override, var(--lmvz-component-input-padding-sm, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem))); --lmvz-button-padding-block: var(--lmvz-button-padding-block-override, var(--lmvz-component-input-padding-sm, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem))); --lmvz-button-gap: var(--lmvz-button-gap-override, var(--lmvz-component-input-gap-sm, clamp(0.38rem, 0.31rem + 0.26vw, 0.63rem))); --lmvz-button-min-height: var(--lmvz-button-min-height-override, var(--lmvz-component-input-size-sm, clamp(2rem, 1.94rem + 0.26vw, 2.25rem))); --lmvz-button-font: var(--lmvz-button-font-override, var(--lmvz-typography-body-sm-strong, 500 clamp(0.69rem, 0.67rem + 0.06vw, 0.75rem) / 1.5 Router)); } button.large { --lmvz-button-padding-inline: var(--lmvz-button-padding-inline-override, var(--lmvz-component-input-padding-lg, clamp(1rem, 0.94rem + 0.26vw, 1.25rem))); --lmvz-button-padding-block: var(--lmvz-button-padding-block-override, var(--lmvz-component-input-padding-lg, clamp(1rem, 0.94rem + 0.26vw, 1.25rem))); --lmvz-button-gap: var(--lmvz-button-gap-override, var(--lmvz-component-input-gap-lg, clamp(0.75rem, 0.69rem + 0.26vw, 1rem))); --lmvz-button-min-height: var(--lmvz-button-min-height-override, var(--lmvz-component-input-size-lg, clamp(2.75rem, 2.69rem + 0.26vw, 3rem))); --lmvz-button-font: var(--lmvz-button-font-override, var(--lmvz-typography-body-lg-strong, 500 clamp(1rem, 0.97rem + 0.13vw, 1.13rem) / 1.5 Router)); } display: inline-block; button { width: 100%; } } button { width: 100%; } ::slotted(*) { --lmvz-component-color: var(--lmvz-button-color); } `;
5912
6170
 
5913
6171
  class LmvzButton extends ReactiveControllerHost {
5914
6172
  get el() { return getElement(this); }
@@ -5917,8 +6175,9 @@ class LmvzButton extends ReactiveControllerHost {
5917
6175
  formEl = null;
5918
6176
  formButtonEl = null;
5919
6177
  lmvzActivation;
5920
- get ti() {
5921
- return 0;
6178
+ ti = 0;
6179
+ resolveFocusableElement() {
6180
+ return this.validationEl;
5922
6181
  }
5923
6182
  scale = 'default';
5924
6183
  variant;
@@ -5928,6 +6187,7 @@ class LmvzButton extends ReactiveControllerHost {
5928
6187
  formMethod;
5929
6188
  name;
5930
6189
  value;
6190
+ buttonRole;
5931
6191
  constructor(hostRef) {
5932
6192
  super();
5933
6193
  registerInstance(this, hostRef);
@@ -5939,7 +6199,7 @@ class LmvzButton extends ReactiveControllerHost {
5939
6199
  }));
5940
6200
  }
5941
6201
  connectedCallback() {
5942
- this.inheritedAttributes = inheritAriaAttributes(this.el);
6202
+ this.inheritedAttributes = inheritAriaAttributes(this.el, ['role']);
5943
6203
  super.connectedCallback();
5944
6204
  }
5945
6205
  disconnectedCallback() {
@@ -5996,7 +6256,7 @@ class LmvzButton extends ReactiveControllerHost {
5996
6256
  };
5997
6257
  render() {
5998
6258
  this.renderHiddenButton();
5999
- return (hAsync(Host, { key: '8196de85afc3878c6f38e582d7c031f5d19bcd36', "aria-disabled": this.disabled ? 'true' : null }, hAsync("button", { key: '8d73f979fa227de22a03403a2a3938684911060a', ref: (e) => (this.validationEl = e), part: "button", disabled: this.disabled, type: this.type, class: classNames(this.variant ?? 'secondary', { [this.scale ?? '']: !!this.scale, disabled: this.disabled }), ...this.inheritedAttributes }, hAsync("slot", { key: '18e91a2f94ba0d7e5cf13150191003e2f0b2a03a' }))));
6259
+ return (hAsync(Host, { key: 'f3e619dca398c3a8a78e9d2f8c3df4178b2531b2', role: "presentation" }, hAsync("button", { key: 'eb1aac6756a70968d3a72cb40c1d52d96340423e', ref: (e) => (this.validationEl = e), part: "button", role: this.buttonRole, disabled: this.disabled, type: this.type, class: classNames(this.variant ?? 'secondary', { [this.scale ?? '']: !!this.scale, disabled: this.disabled }), ...this.inheritedAttributes }, hAsync("slot", { key: '786ff1c10ae05eda646c77ac8779813be6e51949' }))));
6000
6260
  }
6001
6261
  static get delegatesFocus() { return true; }
6002
6262
  static get style() { return lmvzButtonCss(); }
@@ -6004,7 +6264,7 @@ class LmvzButton extends ReactiveControllerHost {
6004
6264
  "$flags$": 793,
6005
6265
  "$tagName$": "lmvz-button",
6006
6266
  "$members$": {
6007
- "ti": [2562, "tabindex"],
6267
+ "ti": [514, "tabindex"],
6008
6268
  "scale": [513],
6009
6269
  "variant": [513],
6010
6270
  "disabled": [516],
@@ -6012,7 +6272,8 @@ class LmvzButton extends ReactiveControllerHost {
6012
6272
  "form": [1],
6013
6273
  "formMethod": [1, "form-method"],
6014
6274
  "name": [1],
6015
- "value": [1]
6275
+ "value": [1],
6276
+ "buttonRole": [1, "button-role"]
6016
6277
  },
6017
6278
  "$listeners$": undefined,
6018
6279
  "$lazyBundleId$": "-",
@@ -6034,6 +6295,7 @@ function negate(delegate) {
6034
6295
  };
6035
6296
  }
6036
6297
 
6298
+ const variants = ['primary', 'secondary', 'tertiary'];
6037
6299
  const chipTypes = ['active', 'warning', 'success', 'error', 'neutral'];
6038
6300
  const chipSizes = ['default', 'small'];
6039
6301
  const linkTypes = ['internal', 'external'];
@@ -8188,15 +8450,17 @@ function toValidSvgStringWithFallback(value) {
8188
8450
  }
8189
8451
  }
8190
8452
 
8191
- const lmvzButtonGroupCss = () => `:host{display:flex;justify-content:flex-end;gap:var(--lmvz-component-input-gap-md, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem));font:var(--lmvz-typography-body-md, 400 clamp(0.88rem, 0.84rem + 0.13vw, 1rem) / 1.5 Router);flex-wrap:wrap}::slotted([hidden]){display:none !important}`;
8453
+ const lmvzButtonGroupCss = () => `:host{display:flex;flex-flow:row-reverse wrap;gap:var(--lmvz-component-input-gap-md, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem));font:var(--lmvz-typography-body-md, 400 clamp(0.88rem, 0.84rem + 0.13vw, 1rem) / 1.5 Router);}:host([stacked]){flex-flow:column nowrap;align-items:stretch;padding:0}:host([stacked]) ::slotted(*){display:block;width:100%}::slotted([hidden]){display:none !important}:host(:not([data-only-tertiary],[stacked])) ::slotted([data-first-tertiary]){margin-inline-end:auto}:host([data-only-tertiary]:not([stacked])){justify-content:flex-end}`;
8192
8454
 
8193
8455
  class LmvzButtonGroup {
8194
8456
  constructor(hostRef) {
8195
8457
  registerInstance(this, hostRef);
8196
8458
  }
8459
+ get el() { return getElement(this); }
8197
8460
  actionsSlot;
8198
8461
  validationMessageCache = [];
8199
8462
  actionsStateObserver;
8463
+ stacked = false;
8200
8464
  get primaryEnabledAction() {
8201
8465
  return this.enabledButtons.find(isPrimaryAction) ?? this.enabledButtons[0];
8202
8466
  }
@@ -8228,23 +8492,23 @@ class LmvzButtonGroup {
8228
8492
  const primaryActions = this.visibleButtons.filter(isPrimaryAction);
8229
8493
  const secondaryActions = this.visibleButtons.filter(isSecondaryAction);
8230
8494
  const issues = [];
8231
- const order = this.visibleButtons.toReversed();
8495
+ const order = this.visibleButtons;
8232
8496
  if (primaryActions.length !== 1)
8233
- issues.push('LmvzModal actions slot must contain exactly one primary action.');
8497
+ issues.push('LmvzButtonGroup actions slot should contain exactly one primary action.');
8234
8498
  if (secondaryActions.length > 1)
8235
- issues.push(`LmvzModal actions slot must contain at most one secondary action (received ${secondaryActions.length})`);
8499
+ issues.push(`LmvzButtonGroup actions slot should contain at most one secondary action (received ${secondaryActions.length})`);
8236
8500
  if (primaryActions.length) {
8237
8501
  const primaryAction = primaryActions[0];
8238
8502
  const secondaryAction = secondaryActions[0];
8239
8503
  if (order.indexOf(primaryAction) !== 0)
8240
- issues.push('Primary action must be the last focusable element in the actions slot (i.e. rightmost button).');
8504
+ issues.push('Primary action should be the first focusable element in the actions slot (i.e. first child of the actions slot).');
8241
8505
  if (secondaryAction && order.indexOf(secondaryAction) !== 1)
8242
- issues.push('Secondary action must be the second-to-last focusable element in the actions slot (i.e. left of primary button).');
8506
+ issues.push('Secondary action should be the second focusable element in the actions slot (i.e. immediately after the primary button).');
8243
8507
  }
8244
8508
  else if (secondaryActions.length) {
8245
8509
  const secondaryAction = secondaryActions[0];
8246
8510
  if (order.indexOf(secondaryAction) !== 0)
8247
- issues.push('Secondary action must be the last focusable element in the actions slot when no primary action is present (i.e. rightmost button).');
8511
+ issues.push('Secondary action should be the first focusable element in the actions slot when no primary action is present (i.e. first child of the actions slot).');
8248
8512
  }
8249
8513
  return issues;
8250
8514
  }
@@ -8282,20 +8546,35 @@ class LmvzButtonGroup {
8282
8546
  }
8283
8547
  });
8284
8548
  this.checkActions();
8285
- const length = this.visibleButtons.length;
8286
- for (let i = 0; i < length; i++) {
8287
- const variant = i === length - 1 ? 'primary' : i === length - 2 ? 'secondary' : 'tertiary';
8288
- const element = this.visibleButtons.at(i);
8549
+ const visibleButtons = this.visibleButtons;
8550
+ const hasNonTertiary = visibleButtons.length > 0 && visibleButtons.some((btn) => isPrimaryAction(btn) || isSecondaryAction(btn));
8551
+ if (visibleButtons.length > 0 && !hasNonTertiary) {
8552
+ this.el.setAttribute('data-only-tertiary', '');
8553
+ }
8554
+ else {
8555
+ this.el.removeAttribute('data-only-tertiary');
8556
+ }
8557
+ this.visibleButtons.forEach((element, i) => {
8558
+ const variant = variants[i] ?? 'tertiary';
8289
8559
  if (!element)
8290
- continue;
8560
+ return;
8291
8561
  if (isLmvzButton(element)) {
8292
- if (!element.getAttribute('variant'))
8562
+ if (!element.getAttribute('variant') && !element.variant)
8293
8563
  element.setAttribute('variant', variant);
8294
8564
  }
8295
8565
  else {
8296
8566
  element.classList.add(variant);
8297
8567
  }
8298
- }
8568
+ });
8569
+ const firstTertiary = this.visibleButtons.find((btn) => btn.getAttribute('variant') === 'tertiary');
8570
+ this.visibleButtons.forEach((btn) => {
8571
+ if (btn === firstTertiary) {
8572
+ btn.setAttribute('data-first-tertiary', '');
8573
+ }
8574
+ else {
8575
+ btn.removeAttribute('data-first-tertiary');
8576
+ }
8577
+ });
8299
8578
  this.focusPrimaryAction();
8300
8579
  }
8301
8580
  focusPrimaryAction() {
@@ -8323,43 +8602,22 @@ class LmvzButtonGroup {
8323
8602
  });
8324
8603
  }
8325
8604
  render() {
8326
- return (hAsync(Host, { key: '56b60821ecaa2301d13e78d621e873aa74cd170e' }, hAsync("slot", { key: 'e6a1422950fa5b0026356b7788a607a690116186', ref: (element) => (this.actionsSlot = element), onSlotchange: this.handleActionsSlotChange })));
8605
+ return (hAsync(Host, { key: '3e8ce38f7e83e201e47d31579f22161ff36247b1' }, hAsync("slot", { key: 'bc953d19b333f51c5f5c5ba86be3a85d155a29d1', ref: (element) => (this.actionsSlot = element), onSlotchange: this.handleActionsSlotChange })));
8327
8606
  }
8328
8607
  static get style() { return lmvzButtonGroupCss(); }
8329
8608
  static get cmpMeta() { return {
8330
- "$flags$": 265,
8609
+ "$flags$": 777,
8331
8610
  "$tagName$": "lmvz-button-group",
8332
8611
  "$members$": {
8612
+ "stacked": [516],
8333
8613
  "primaryEnabledAction": [2064],
8334
8614
  "hasActions": [2052, "has-actions"]
8335
8615
  },
8336
8616
  "$listeners$": undefined,
8337
8617
  "$lazyBundleId$": "-",
8338
- "$attrsToReflect$": []
8618
+ "$attrsToReflect$": [["stacked", "stacked"]]
8339
8619
  }; }
8340
8620
  }
8341
- function isActionButton(element) {
8342
- return ['LMVZ-BUTTON', 'BUTTON'].includes(element.tagName.toUpperCase());
8343
- }
8344
- function isLmvzButton(element) {
8345
- return element?.tagName.toUpperCase() === 'LMVZ-BUTTON';
8346
- }
8347
- function isDisabledButton(element) {
8348
- return element.hasAttribute('disabled') || element.disabled === true;
8349
- }
8350
- function isVisible(element) {
8351
- return !element.hasAttribute('hidden');
8352
- }
8353
- function getActionVariant(element) {
8354
- const variant = element.getAttribute('variant') ?? element.variant;
8355
- return variant === 'primary' || variant === 'secondary' || variant === 'tertiary' ? variant : 'secondary';
8356
- }
8357
- function isPrimaryAction(element) {
8358
- return getActionVariant(element) === 'primary';
8359
- }
8360
- function isSecondaryAction(element) {
8361
- return getActionVariant(element) === 'secondary';
8362
- }
8363
8621
 
8364
8622
  function getLocationBase() {
8365
8623
  return (typeof document === 'undefined' ? require('u' + 'rl').pathToFileURL(__filename).href : (_documentCurrentScript && _documentCurrentScript.tagName.toUpperCase() === 'SCRIPT' && _documentCurrentScript.src || new URL('@app-factory-entry.js', document.baseURI).href)) ?? window?.location?.origin ?? '';
@@ -8381,7 +8639,7 @@ function joinPath(...parts) {
8381
8639
  return parts.filter(Boolean).join('/').replace('//', '/').replace('/./', '/');
8382
8640
  }
8383
8641
 
8384
- const lmvzCardCss = () => `@layer lmvz-ds.reset, lmvz-ds.theme, lmvz-ds.components, lmvz-ds.overrides; @layer lmvz-ds.theme { @font-face { font-family: Router; src: local('RouterBook-Regular'), local('Router-Book'), url('/assets/fonts/Router-Book.woff') format('woff'); font-weight: 400; } @font-face { font-family: Router; src: local('RouterMedium-Regular'), local('Router-Medium'), url('/assets/fonts/Router-Medium.woff') format('woff'); font-weight: 500; } @font-face { font-family: Router; src: local('RouterBold-Regular'), local('Router-Bold'), url('/assets/fonts/Router-Bold.woff') format('woff'); font-weight: 700; } } @layer lmvz-ds.reset { body { margin: 0; } h1, h2, h3, h4, h5, h6 { margin: 0; } *[hidden] { display: none !important; } } .sc-lmvz-card-h { button { --lmvz-button-color: var(--lmvz-component-color, var(--lmvz-semantic-color-int-on-secondary, #000000)); --lmvz-button-padding-inline: var(--lmvz-button-padding, var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem))); --lmvz-button-padding-block: var(--lmvz-button-padding, var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem))); --lmvz-button-gap: var(--lmvz-component-input-gap-md, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem)); --lmvz-button-min-height: var(--lmvz-component-input-size-md, clamp(2.5rem, 2.44rem + 0.26vw, 2.75rem)); --lmvz-button-font: var(--lmvz-typography-body-md-strong, 500 clamp(0.88rem, 0.84rem + 0.13vw, 1rem) / 1.5 Router); --lmvz-button-radius: var(--lmvz-component-input-radius-default, 999px); --lmvz-button-border-width: 0; --lmvz-button-border-color: transparent; --lmvz-button-background: var(--lmvz-semantic-color-int-secondary, #f0f0f0); display: inline-flex; align-items: center; justify-content: center; gap: var(--lmvz-button-gap); padding-block: var(--lmvz-button-padding-block); padding-inline: var(--lmvz-button-padding-inline); min-height: var(--lmvz-button-min-height); border-radius: var(--lmvz-button-radius); border: var(--lmvz-button-border-width) solid var(--lmvz-button-border-color); background-color: var(--lmvz-button-background); color: var(--lmvz-button-color); cursor: pointer; font: var(--lmvz-button-font); text-align: center; text-decoration: none; white-space: nowrap; transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease; } button > * { font: inherit; color: inherit; } button:focus-visible { outline: var(--lmvz-ds-outline, 1px solid #0e7ab4); outline-offset: var(--lmvz-ds-outline-offset, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem)); } button:is([disabled], .disabled) { cursor: not-allowed; pointer-events: none; opacity: var(--lmvz-component-input-disabled-opacity, 40%); } button:not([disabled]):hover { --lmvz-button-background: var(--lmvz-semantic-color-int-secondary-hover, #e0e0e0); } button:not([disabled]):active { --lmvz-button-background: var(--lmvz-semantic-color-int-secondary-active, #d4d4d4); } button.primary { --lmvz-button-background: var(--lmvz-semantic-color-int-primary, #000000); --lmvz-button-color: var(--lmvz-semantic-color-int-on-primary, #ffffff); --lmvz-button-border-width: 0; --lmvz-button-border-color: transparent; } button.primary:not([disabled], .disabled):hover { --lmvz-button-background: var(--lmvz-semantic-color-int-primary-hover, #2e2e2e); } button.primary:not([disabled], .disabled):active { --lmvz-button-background: var(--lmvz-semantic-color-int-primary-active, #545454); } button.secondary { --lmvz-button-background: var(--lmvz-semantic-color-int-secondary, #f0f0f0); --lmvz-button-color: var(--lmvz-semantic-color-int-on-secondary, #000000); --lmvz-button-border-width: 0; --lmvz-button-border-color: transparent; } button.secondary:not([disabled], .disabled):hover { --lmvz-button-background: var(--lmvz-semantic-color-int-secondary-hover, #e0e0e0); --lmvz-button-color: var(--lmvz-semantic-color-int-on-secondary-hover, #000000); } button.secondary:not([disabled], .disabled):active { --lmvz-button-background: var(--lmvz-semantic-color-int-secondary-active, #d4d4d4); --lmvz-button-color: var(--lmvz-semantic-color-int-on-secondary-active, #000000); } button.tertiary { --lmvz-button-background: var(--lmvz-semantic-color-int-tertiary, #ffffff); --lmvz-button-color: var(--lmvz-semantic-color-int-on-tertiary, #000000); } button.tertiary:not([disabled], .disabled):hover { --lmvz-button-background: var(--lmvz-semantic-color-int-tertiary-hover, #f0f0f0); --lmvz-button-color: var(--lmvz-semantic-color-int-on-tertiary-hover, #000000); } button.tertiary:not([disabled], .disabled):active { --lmvz-button-background: var(--lmvz-semantic-color-int-tertiary-active, #e0e0e0); --lmvz-button-color: var(--lmvz-semantic-color-int-on-tertiary-active, #000000); } button.small { --lmvz-button-padding-inline: var(--lmvz-component-input-padding-sm, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem)); --lmvz-button-padding-block: var(--lmvz-component-input-padding-sm, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem)); --lmvz-button-gap: var(--lmvz-component-input-gap-sm, clamp(0.38rem, 0.31rem + 0.26vw, 0.63rem)); --lmvz-button-min-height: var(--lmvz-component-input-size-sm, clamp(2rem, 1.94rem + 0.26vw, 2.25rem)); --lmvz-button-font: var(--lmvz-typography-body-sm-strong, 500 clamp(0.69rem, 0.67rem + 0.06vw, 0.75rem) / 1.5 Router); } button.large { --lmvz-button-padding-inline: var(--lmvz-component-input-padding-lg, clamp(1rem, 0.94rem + 0.26vw, 1.25rem)); --lmvz-button-padding-block: var(--lmvz-component-input-padding-lg, clamp(1rem, 0.94rem + 0.26vw, 1.25rem)); --lmvz-button-gap: var(--lmvz-component-input-gap-lg, clamp(0.75rem, 0.69rem + 0.26vw, 1rem)); --lmvz-button-min-height: var(--lmvz-component-input-size-lg, clamp(2.75rem, 2.69rem + 0.26vw, 3rem)); --lmvz-button-font: var(--lmvz-typography-body-lg-strong, 500 clamp(1rem, 0.97rem + 0.13vw, 1.13rem) / 1.5 Router); } display: flex; min-width: var(--lmvz-card-component-card-minwidth, 20.4375rem); max-width: var(--lmvz-card-component-card-maxwidth, 21.6875rem); flex-direction: column; align-items: flex-start; border-radius: var(--lmvz-semantic-border-radius-lg, 14px); border: var(--lmvz-semantic-border-width-default, 1px) solid var(--lmvz-semantic-color-border-default, #e0e0e0); background: var(--lmvz-semantic-color-surface-primary, #ffffff); } *.sc-lmvz-card { color: var(--lmvz-semantic-color-on-surface-primary, #000000); font: var(--lmvz-typography-body-md, 400 clamp(0.88rem, 0.84rem + 0.13vw, 1rem) / 1.5 Router); } .top.sc-lmvz-card { display: flex; padding: var(--lmvz-dimension-8-12, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem)); flex-direction: column; justify-content: center; align-items: center; align-self: stretch; } .bottom.sc-lmvz-card { display: flex; min-width: 150px; padding: var(--lmvz-dimension-4-6, clamp(0.25rem, 0.22rem + 0.13vw, 0.38rem)) var(--lmvz-dimension-10-14, clamp(0.63rem, 0.56rem + 0.26vw, 0.88rem)) var(--lmvz-dimension-10-14, clamp(0.63rem, 0.56rem + 0.26vw, 0.88rem)) var(--lmvz-dimension-10-14, clamp(0.63rem, 0.56rem + 0.26vw, 0.88rem)); flex-direction: column; align-items: flex-start; align-self: stretch; } .title.sc-lmvz-card { margin: 0; display: flex; justify-content: center; align-items: center; align-self: stretch; padding-bottom: var(--lmvz-global-s4, 4px); overflow-wrap: break-word; font: var(--lmvz-typography-heading-2xl, 500 clamp(2.25rem, 2.13rem + 0.52vw, 2.75rem) / 1.4 Router); } .description.sc-lmvz-card { display: flex; margin: 0; padding-bottom: var(--lmvz-component-body-sm-padding-bottom, clamp(0.25rem, 0.16rem + 0.39vw, 0.63rem)); align-items: flex-start; align-self: stretch; white-space: pre-line; font: var(--lmvz-typography-body-md, 400 clamp(0.88rem, 0.84rem + 0.13vw, 1rem) / 1.5 Router); } .image-wrapper.sc-lmvz-card { aspect-ratio: 4 / 3; width: 100%; background-size: cover; background-position: center; flex: 1 0 0; align-self: stretch; border-radius: var(--lmvz-semantic-border-radius-md, 6px); } .actions.sc-lmvz-card { margin-top: var(--lmvz-component-form-wrapper-gap-y, clamp(1.13rem, 0.97rem + 0.65vw, 1.75rem)); display: flex; align-items: center; gap: var(--lmvz-component-input-md-gap-x, clamp(0.25rem, 0.16rem + 0.39vw, 0.63rem)); align-self: stretch; } button.primary.sc-lmvz-card, lmvz-button.primary.sc-lmvz-card { display: flex; justify-content: center; align-items: center; gap: var(--lmvz-component-input-md-gap-x, clamp(0.25rem, 0.16rem + 0.39vw, 0.63rem)); flex: 1 0 0; }`;
8642
+ const lmvzCardCss = () => `@layer lmvz-ds.reset, lmvz-ds.theme, lmvz-ds.components, lmvz-ds.overrides; @layer lmvz-ds.theme { @font-face { font-family: Router; src: local('RouterBook-Regular'), local('Router-Book'), url('/assets/fonts/Router-Book.woff') format('woff'); font-weight: 400; } @font-face { font-family: Router; src: local('RouterMedium-Regular'), local('Router-Medium'), url('/assets/fonts/Router-Medium.woff') format('woff'); font-weight: 500; } @font-face { font-family: Router; src: local('RouterBold-Regular'), local('Router-Bold'), url('/assets/fonts/Router-Bold.woff') format('woff'); font-weight: 700; } } @layer lmvz-ds.reset { body { margin: 0; } h1, h2, h3, h4, h5, h6 { margin: 0; } *[hidden] { display: none !important; } hr { height: 0; border: none; margin: var(--lmvz-dimension-4-8, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem)) 0; border-top: var(--lmvz-semantic-border-width-default, 1px) solid var(--lmvz-semantic-color-border-subtle, #f0f0f0); } } .sc-lmvz-card-h { button { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-secondary, #f0f0f0)); --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-int-on-secondary, #000000)); --lmvz-button-radius: var(--lmvz-button-radius-override, var(--lmvz-component-input-radius-default, 999px)); --lmvz-button-padding-inline: var(--lmvz-button-padding-inline-override, var(--lmvz-button-padding, var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem)))); --lmvz-button-padding-block: var(--lmvz-button-padding-block-override, var(--lmvz-button-padding, var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem)))); --lmvz-button-gap: var(--lmvz-button-gap-override, var(--lmvz-component-input-gap-md, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem))); --lmvz-button-min-height: var(--lmvz-button-min-height-override, var(--lmvz-component-input-size-md, clamp(2.5rem, 2.44rem + 0.26vw, 2.75rem))); --lmvz-button-font: var(--lmvz-button-font-override, var(--lmvz-typography-body-md-strong, 500 clamp(0.88rem, 0.84rem + 0.13vw, 1rem) / 1.5 Router)); --lmvz-button-border-width: var(--lmvz-button-border-width-override, 0); --lmvz-button-border-color: var(--lmvz-button-border-color-override, transparent); display: inline-flex; align-items: center; justify-content: center; gap: var(--lmvz-button-gap); padding-block: var(--lmvz-button-padding-block); padding-inline: var(--lmvz-button-padding-inline); min-height: var(--lmvz-button-min-height); border-radius: var(--lmvz-button-radius); border: var(--lmvz-button-border-width) solid var(--lmvz-button-border-color); background-color: var(--lmvz-button-background); color: var(--lmvz-button-color); cursor: pointer; font: var(--lmvz-button-font); text-align: center; text-decoration: none; white-space: nowrap; transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease; } button > * { font: inherit; color: inherit; } button:focus-visible { outline: var(--lmvz-ds-outline, 1px solid #0e7ab4); outline-offset: var(--lmvz-ds-outline-offset, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem)); position: relative; z-index: 1; } button:is([disabled], .disabled) { cursor: not-allowed; pointer-events: none; opacity: var(--lmvz-component-input-disabled-opacity, 40%); } button:not([disabled]):hover { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-secondary-hover, #e0e0e0)); } button:not([disabled]):active { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-secondary-active, #d4d4d4)); } button.primary { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-primary, #000000)); --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-int-on-primary, #ffffff)); --lmvz-button-border-width: var(--lmvz-button-border-width-override, 0); --lmvz-button-border-color: var(--lmvz-button-border-color-override, transparent); } button.primary:not([disabled], .disabled):hover { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-primary-hover, #2e2e2e)); } button.primary:not([disabled], .disabled):active { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-primary-active, #545454)); } button.secondary { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-secondary, #f0f0f0)); --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-int-on-secondary, #000000)); --lmvz-button-border-width: var(--lmvz-button-border-width-override, 0); --lmvz-button-border-color: var(--lmvz-button-border-color-override, transparent); } button.secondary:not([disabled], .disabled):hover { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-secondary-hover, #e0e0e0)); --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-int-on-secondary-hover, #000000)); } button.secondary:not([disabled], .disabled):active { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-secondary-active, #d4d4d4)); --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-int-on-secondary-active, #000000)); } button.tertiary { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-tertiary, #ffffff)); --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-int-on-tertiary, #000000)); } button.tertiary:not([disabled], .disabled):hover { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-tertiary-hover, #f0f0f0)); --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-int-on-tertiary-hover, #000000)); } button.tertiary:not([disabled], .disabled):active { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-tertiary-active, #e0e0e0)); --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-int-on-tertiary-active, #000000)); } button.small { --lmvz-button-padding-inline: var(--lmvz-button-padding-inline-override, var(--lmvz-component-input-padding-sm, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem))); --lmvz-button-padding-block: var(--lmvz-button-padding-block-override, var(--lmvz-component-input-padding-sm, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem))); --lmvz-button-gap: var(--lmvz-button-gap-override, var(--lmvz-component-input-gap-sm, clamp(0.38rem, 0.31rem + 0.26vw, 0.63rem))); --lmvz-button-min-height: var(--lmvz-button-min-height-override, var(--lmvz-component-input-size-sm, clamp(2rem, 1.94rem + 0.26vw, 2.25rem))); --lmvz-button-font: var(--lmvz-button-font-override, var(--lmvz-typography-body-sm-strong, 500 clamp(0.69rem, 0.67rem + 0.06vw, 0.75rem) / 1.5 Router)); } button.large { --lmvz-button-padding-inline: var(--lmvz-button-padding-inline-override, var(--lmvz-component-input-padding-lg, clamp(1rem, 0.94rem + 0.26vw, 1.25rem))); --lmvz-button-padding-block: var(--lmvz-button-padding-block-override, var(--lmvz-component-input-padding-lg, clamp(1rem, 0.94rem + 0.26vw, 1.25rem))); --lmvz-button-gap: var(--lmvz-button-gap-override, var(--lmvz-component-input-gap-lg, clamp(0.75rem, 0.69rem + 0.26vw, 1rem))); --lmvz-button-min-height: var(--lmvz-button-min-height-override, var(--lmvz-component-input-size-lg, clamp(2.75rem, 2.69rem + 0.26vw, 3rem))); --lmvz-button-font: var(--lmvz-button-font-override, var(--lmvz-typography-body-lg-strong, 500 clamp(1rem, 0.97rem + 0.13vw, 1.13rem) / 1.5 Router)); } display: flex; min-width: var(--lmvz-card-component-card-minwidth, 20.4375rem); max-width: var(--lmvz-card-component-card-maxwidth, 21.6875rem); flex-direction: column; align-items: flex-start; border-radius: var(--lmvz-semantic-border-radius-lg, 14px); border: var(--lmvz-semantic-border-width-default, 1px) solid var(--lmvz-semantic-color-border-default, #e0e0e0); background: var(--lmvz-semantic-color-surface-primary, #ffffff); } *.sc-lmvz-card { color: var(--lmvz-semantic-color-on-surface-primary, #000000); font: var(--lmvz-typography-body-md, 400 clamp(0.88rem, 0.84rem + 0.13vw, 1rem) / 1.5 Router); } .top.sc-lmvz-card { display: flex; padding: var(--lmvz-dimension-8-12, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem)); flex-direction: column; justify-content: center; align-items: center; align-self: stretch; } .bottom.sc-lmvz-card { display: flex; min-width: 150px; padding: var(--lmvz-dimension-4-6, clamp(0.25rem, 0.22rem + 0.13vw, 0.38rem)) var(--lmvz-dimension-10-14, clamp(0.63rem, 0.56rem + 0.26vw, 0.88rem)) var(--lmvz-dimension-10-14, clamp(0.63rem, 0.56rem + 0.26vw, 0.88rem)) var(--lmvz-dimension-10-14, clamp(0.63rem, 0.56rem + 0.26vw, 0.88rem)); flex-direction: column; align-items: flex-start; align-self: stretch; } .title.sc-lmvz-card { margin: 0; display: flex; justify-content: center; align-items: center; align-self: stretch; padding-bottom: var(--lmvz-global-s4, 4px); overflow-wrap: break-word; font: var(--lmvz-typography-heading-2xl, 500 clamp(2.25rem, 2.13rem + 0.52vw, 2.75rem) / 1.4 Router); } .description.sc-lmvz-card { display: flex; margin: 0; padding-bottom: var(--lmvz-component-body-sm-padding-bottom, clamp(0.25rem, 0.16rem + 0.39vw, 0.63rem)); align-items: flex-start; align-self: stretch; white-space: pre-line; font: var(--lmvz-typography-body-md, 400 clamp(0.88rem, 0.84rem + 0.13vw, 1rem) / 1.5 Router); } .image-wrapper.sc-lmvz-card { aspect-ratio: 4 / 3; width: 100%; background-size: cover; background-position: center; flex: 1 0 0; align-self: stretch; border-radius: var(--lmvz-semantic-border-radius-md, 6px); } .actions.sc-lmvz-card { margin-top: var(--lmvz-component-form-wrapper-gap-y, clamp(1.13rem, 0.97rem + 0.65vw, 1.75rem)); display: flex; align-items: center; gap: var(--lmvz-component-input-md-gap-x, clamp(0.25rem, 0.16rem + 0.39vw, 0.63rem)); align-self: stretch; } button.primary.sc-lmvz-card, lmvz-button.primary.sc-lmvz-card { display: flex; justify-content: center; align-items: center; gap: var(--lmvz-component-input-md-gap-x, clamp(0.25rem, 0.16rem + 0.39vw, 0.63rem)); flex: 1 0 0; }`;
8385
8643
 
8386
8644
  class LmvzCard {
8387
8645
  constructor(hostRef) {
@@ -8406,7 +8664,7 @@ class LmvzCard {
8406
8664
  const imgStyle = {
8407
8665
  backgroundImage: `url(${this.imageUrl ?? this.fallbackImage})`,
8408
8666
  };
8409
- return (hAsync(Host, { key: '2d9ecdeed986f142fb7ff477b56dece59549bbc7', role: "article" }, hAsync("div", { key: '34fc9c3a1338b31ce73424e8c07c79a291ead85c', class: "top" }, hAsync("div", { key: '1756e6b26d7f42499753c36ed0fc13755fe32bfe', class: "image-wrapper", style: imgStyle }, hAsync("div", { key: 'cd8be8acc9e949092b6363024316d12d445a9fbc', class: "chip-slot" }, hAsync("slot", { key: '26389ab3b7031b948ff1701857e6028446662cf5', name: "chip" })))), hAsync("div", { key: '2fa61cd7bef437f15929ae39be7fa294e8778321', class: "bottom" }, hAsync("header", { key: 'b237ca025e42a29f528f827dc3c83b3b0f9267c0' }, hAsync("h2", { key: 'ffd0a509ba97acb75d4c15d0fd01eef08689a2a7', class: "title" }, this.cardTitle)), hAsync("p", { key: 'c40bd5d5f7e41a0cebc2f7f9e572ba98cc892cc1', class: "description" }, this.description), hAsync("div", { key: '7663f93b41ef1e798b464bd6ad75ca8a53c0667b', class: "actions" }, hAsync("button", { key: '3348e6700aa1571183558ab8fe4f73393c1cc943', class: "primary", onClick: this._onPrimaryClick.bind(this), "data-testid": "primary" }, this.primaryActionLabel), hAsync("button", { key: 'd3a12cdabbdd68c3b04e06984db44abd3bbd22ea', class: "tertiary", "aria-label": "More actions", onClick: this._onOverflowClick }, hAsync("span", { key: '80e31e6b691e18d1b42a2b4831349c3abf8e02b0', class: "icon-placeholder" }, "..."))))));
8667
+ return (hAsync(Host, { key: '1dd819fd7c752af8d15001c08f7f60c6ea7278b9', role: "article" }, hAsync("div", { key: 'e0cc822e627b6bbe665e4faa705cc46a09bac7c6', class: "top" }, hAsync("div", { key: 'db79cb5a67ebdd6097f985e4b4bd27665b6329ef', class: "image-wrapper", style: imgStyle }, hAsync("div", { key: '90facc8595ddbbf31e3768faa8254a82ab8d3e65', class: "chip-slot" }, hAsync("slot", { key: 'cb2e6a1053aae2b2ca90c52c175e3c4174c89d23', name: "chip" })))), hAsync("div", { key: 'cb11069a329385178677e92d08044e0fe8e5b982', class: "bottom" }, hAsync("header", { key: '1e6076352124ca03de2fb13c17a565b4f492567e' }, hAsync("h2", { key: '73f11099fb751bd4f967dbe49b79763b6a8268f3', class: "title" }, this.cardTitle)), hAsync("p", { key: '36cf87b4c2004bff1e65feedd13e137d67115de3', class: "description" }, this.description), hAsync("div", { key: '6c1d82f4968ce8252307858e6ad0681274f06397', class: "actions" }, hAsync("button", { key: '0366e0caaf9235a3eaf7bfcab116e6a828fb248d', class: "primary", onClick: this._onPrimaryClick.bind(this), "data-testid": "primary" }, this.primaryActionLabel), hAsync("button", { key: '4f435e79d75a621d6fe065471a915b55308ad15d', class: "tertiary", "aria-label": "More actions", onClick: this._onOverflowClick }, hAsync("span", { key: '7dec97e0b0ca58c40fc5308cc7863acafa8c5147', class: "icon-placeholder" }, "..."))))));
8410
8668
  }
8411
8669
  static get assetsDirs() { return ["../../assets"]; }
8412
8670
  static get style() { return lmvzCardCss(); }
@@ -8521,7 +8779,7 @@ class LmvzCheckbox extends ReactiveControllerHost {
8521
8779
  this.nativeInput?.click();
8522
8780
  }
8523
8781
  render() {
8524
- return (hAsync(Host, { key: 'cea4a962a76cab10c27adc6742fe0686b2ce6dbe' }, hAsync("div", { key: '1addfd795587de85ecbc632fbeb45026a4e46050', class: "pill" }, hAsync("input", { key: '8957359d0cc3f2c315badee7e20fcc81e85e0f00', type: "checkbox", id: this.checkboxId, checked: this.checkedState, disabled: this.disabled, required: this.required, "aria-required": this.required ? 'true' : 'false', "aria-invalid": this.error ? 'true' : 'false', "aria-describedby": this.ariaDescribedBy, "aria-errormessage": this.error && this.errorId ? this.errorId : undefined, ref: (el) => (this.nativeInput = el), onChange: this.handleChange, autoFocus: this.autofocus }), hAsync("span", { key: '400dbe9379ceb4aceeb431fe6060c82b41009cda', class: "box", "aria-hidden": "true" }, this.checkedState && hAsync("span", { key: '9612093e65346b419ec8e4469fea7f00fe4c3ff4', class: "indicator", innerHTML: CHECKMARK_SVG })), hAsync("span", { key: 'fd1136ea0726941bc400b8970f7cae4bb3b59363', class: "content" }, hAsync("label", { key: 'a06deb2d4bc76efb884701a17e4a28420a99965c', htmlFor: this.checkboxId }, this.label), this.helperText && (hAsync("span", { key: '2bd33f14062bedbb0609dff3ac7fbcee6fa16f21', onClick: this.retargetInnerClicks.bind(this), class: "helper-text", id: this.helperId, role: "status" }, this.helperText)))), this.errorMessage && (hAsync("span", { key: 'ac4fcb6f0a2de16a17f0287e42b70b6339a50acc', class: "error-text", id: this.errorId, role: "alert" }, this.errorMessage))));
8782
+ return (hAsync(Host, { key: 'b6b4153dbf80af15cb15799889ca23b621b4ef73' }, hAsync("div", { key: 'f11d6baaa4b04ee74b201be8c4e125ccd5c366aa', class: "pill" }, hAsync("input", { key: 'd61dccfa163ecf4fffa95a5d44be35adbb8ee8ff', type: "checkbox", id: this.checkboxId, checked: this.checkedState, disabled: this.disabled, required: this.required, "aria-required": this.required ? 'true' : 'false', "aria-invalid": this.error ? 'true' : 'false', "aria-describedby": this.ariaDescribedBy, "aria-errormessage": this.error && this.errorId ? this.errorId : undefined, ref: (el) => (this.nativeInput = el), onChange: this.handleChange, autoFocus: this.autofocus }), hAsync("span", { key: '87d62f1e0572e174e6d15f30ff59e37f6a5333cb', class: "box", "aria-hidden": "true" }, this.checkedState && hAsync("span", { key: '74d29a32599f6c1ee8bde0cb6f27e384de7fcc2d', class: "indicator", innerHTML: CHECKMARK_SVG })), hAsync("span", { key: '544990c81b3f7f90b53902d580d2eb2197edfa8b', class: "content" }, hAsync("label", { key: '1884744656a280f85bec91b27315d3a6b70e8238', htmlFor: this.checkboxId }, this.label), this.helperText && (hAsync("span", { key: '6783ff413a884c78dbd52e07cc7b433f5a9dcf29', onClick: this.retargetInnerClicks.bind(this), class: "helper-text", id: this.helperId, role: "status" }, this.helperText)))), this.errorMessage && (hAsync("span", { key: '7c19fe406223a11e25df54cdfa304bc000eb421f', class: "error-text", id: this.errorId, role: "alert" }, this.errorMessage))));
8525
8783
  }
8526
8784
  static get formAssociated() { return true; }
8527
8785
  static get watchers() { return {
@@ -8617,7 +8875,7 @@ class LmvzChip extends ReactiveControllerHost {
8617
8875
  }
8618
8876
  }, 500);
8619
8877
  render() {
8620
- return (hAsync(Host, { key: '70654d69189e77f9356853a921366083b2c4b969', type: this.type, size: this.size }, hAsync("slot", { key: 'c7e667b93166286fe68a812dd8eec82885e3fc5e', name: "before-text", ref: (el) => (this.beforeSlot = el), onSlotchange: () => this.checkContent() }), hAsync("span", { key: 'af38dd0429b42685a114e26175ce42d09f5fdcc1', class: "content-overflow-wrapper" }, hAsync("slot", { key: '924158498d65b9ac7c912b6b1a479016176e0b78', ref: (el) => (this.defaultSlot = el), onSlotchange: () => this.checkContent() })), hAsync("slot", { key: '9ff0394dbfb2131fafe513d0f2d8ce26c7781f20', name: "after-text", ref: (el) => (this.afterSlot = el), onSlotchange: () => this.checkContent() })));
8878
+ return (hAsync(Host, { key: 'f326ca8e4dba40941db6b9a711ba46989c4cf1b3', type: this.type, size: this.size }, hAsync("slot", { key: 'f9925e107c2e474ecbaca756451dc4249000b0db', name: "before-text", ref: (el) => (this.beforeSlot = el), onSlotchange: () => this.checkContent() }), hAsync("span", { key: '0b6ea980e0b0500d2955a03088d08eb2ca67f64f', class: "content-overflow-wrapper" }, hAsync("slot", { key: '2b7f5c02e9a09128e0a404c7fe35f6278ce1fa61', ref: (el) => (this.defaultSlot = el), onSlotchange: () => this.checkContent() })), hAsync("slot", { key: '929291cdaccf26d332823f9a100c6b6a84dc04f2', name: "after-text", ref: (el) => (this.afterSlot = el), onSlotchange: () => this.checkContent() })));
8621
8879
  }
8622
8880
  static get watchers() { return {
8623
8881
  "type": [{
@@ -8641,174 +8899,6 @@ class LmvzChip extends ReactiveControllerHost {
8641
8899
  }; }
8642
8900
  }
8643
8901
 
8644
- const defaultConfig = {
8645
- orientation: 'both',
8646
- enableHomeAndEnd: false,
8647
- manageTabIndex: false,
8648
- };
8649
- class DirectionalFocusController {
8650
- host;
8651
- elements = [];
8652
- currentElement;
8653
- config;
8654
- constructor(host, config = {}) {
8655
- this.host = host;
8656
- this.config = {
8657
- ...defaultConfig,
8658
- ...config,
8659
- };
8660
- }
8661
- hostConnected() {
8662
- this.host.el.addEventListener('keydown', this.handleKeydown);
8663
- this.syncManagedFocusTarget();
8664
- }
8665
- hostDisconnected() {
8666
- this.host.el.removeEventListener('keydown', this.handleKeydown);
8667
- }
8668
- updateElements(elements) {
8669
- const previousElement = this.currentElement ?? this.getManagedActiveElement() ?? undefined;
8670
- this.elements = elements.filter((element) => 'focus' in element && element.nodeType === 1);
8671
- this.syncManagedFocusTarget(previousElement);
8672
- }
8673
- setCurrentElement(element) {
8674
- const previousElement = this.currentElement;
8675
- this.currentElement = element !== null && element !== undefined && 'focus' in element && element.nodeType === 1 ? element : undefined;
8676
- this.syncManagedFocusTarget(previousElement);
8677
- }
8678
- handleKeydown = (event) => {
8679
- const intent = this.getFocusIntent(event.key);
8680
- if (!intent)
8681
- return;
8682
- const activeElement = this.getManagedActiveElement();
8683
- const nextElement = this.getTargetElement(activeElement, intent);
8684
- if (!nextElement)
8685
- return;
8686
- event.preventDefault();
8687
- this.applyFocusTarget(nextElement, true);
8688
- };
8689
- getFocusIntent(key) {
8690
- if (this.config.enableHomeAndEnd && key === 'Home')
8691
- return 'first';
8692
- if (this.config.enableHomeAndEnd && key === 'End')
8693
- return 'last';
8694
- if (this.config.orientation === 'horizontal') {
8695
- if (key === 'ArrowRight')
8696
- return 'next';
8697
- if (key === 'ArrowLeft')
8698
- return 'previous';
8699
- return undefined;
8700
- }
8701
- if (this.config.orientation === 'vertical') {
8702
- if (key === 'ArrowDown')
8703
- return 'next';
8704
- if (key === 'ArrowUp')
8705
- return 'previous';
8706
- return undefined;
8707
- }
8708
- if (key === 'ArrowDown' || key === 'ArrowRight')
8709
- return 'next';
8710
- if (key === 'ArrowUp' || key === 'ArrowLeft')
8711
- return 'previous';
8712
- return undefined;
8713
- }
8714
- getManagedActiveElement() {
8715
- const activeElement = getDeepActiveElement(this.host.el.ownerDocument ?? document);
8716
- if (activeElement instanceof HTMLElement && this.elements.includes(activeElement) && this.canMoveFocusTo(activeElement)) {
8717
- return activeElement;
8718
- }
8719
- if (this.currentElement && this.elements.includes(this.currentElement) && this.canMoveFocusTo(this.currentElement)) {
8720
- return this.currentElement;
8721
- }
8722
- return undefined;
8723
- }
8724
- getTargetElement(current, intent) {
8725
- if (!this.elements.length)
8726
- return undefined;
8727
- if (intent === 'first')
8728
- return this.findFocusableFromIndex(-1, 'next');
8729
- if (intent === 'last')
8730
- return this.findFocusableFromIndex(this.elements.length, 'previous');
8731
- const currentIndex = current ? this.elements.indexOf(current) : -1;
8732
- if (currentIndex === -1) {
8733
- return intent === 'next' ? this.findFocusableFromIndex(-1, 'next') : this.findFocusableFromIndex(this.elements.length, 'previous');
8734
- }
8735
- return this.findFocusableFromIndex(currentIndex, intent);
8736
- }
8737
- findFocusableFromIndex(startIndex, intent) {
8738
- if (!this.elements.length)
8739
- return undefined;
8740
- const step = intent === 'next' ? 1 : -1;
8741
- for (let offset = 1; offset <= this.elements.length; offset++) {
8742
- const index = (startIndex + step * offset + this.elements.length) % this.elements.length;
8743
- const candidate = this.elements[index];
8744
- if (this.canMoveFocusTo(candidate))
8745
- return candidate;
8746
- }
8747
- return undefined;
8748
- }
8749
- syncManagedFocusTarget(previousElement) {
8750
- const nextElement = this.selectManagedElement(previousElement);
8751
- const didChange = nextElement !== this.currentElement;
8752
- this.currentElement = nextElement;
8753
- if (this.config.manageTabIndex) {
8754
- this.updateTabIndexes(nextElement);
8755
- }
8756
- if (didChange && nextElement) {
8757
- this.config.onFocusTargetChange?.(nextElement);
8758
- }
8759
- }
8760
- selectManagedElement(previousElement) {
8761
- const activeElement = this.getManagedActiveElement();
8762
- if (activeElement)
8763
- return activeElement;
8764
- if (this.currentElement && this.elements.includes(this.currentElement) && this.canMoveFocusTo(this.currentElement)) {
8765
- return this.currentElement;
8766
- }
8767
- if (previousElement && this.elements.includes(previousElement)) {
8768
- return this.findFocusableFromIndex(this.elements.indexOf(previousElement), 'next') ?? this.findFocusableFromIndex(-1, 'next');
8769
- }
8770
- const currentRovingTarget = this.elements.find((element) => element.tabIndex === 0 && this.canMoveFocusTo(element));
8771
- if (currentRovingTarget)
8772
- return currentRovingTarget;
8773
- return this.findFocusableFromIndex(-1, 'next');
8774
- }
8775
- updateTabIndexes(activeElement) {
8776
- this.elements.forEach((element) => {
8777
- element.tabIndex = activeElement && element === activeElement ? 0 : -1;
8778
- });
8779
- }
8780
- applyFocusTarget(element, shouldFocus) {
8781
- const didChange = element !== this.currentElement;
8782
- this.currentElement = element;
8783
- if (this.config.manageTabIndex) {
8784
- this.updateTabIndexes(element);
8785
- }
8786
- if (shouldFocus) {
8787
- element.focus();
8788
- }
8789
- if (didChange) {
8790
- this.config.onFocusTargetChange?.(element);
8791
- }
8792
- }
8793
- canMoveFocusTo(element) {
8794
- if (!element)
8795
- return false;
8796
- if (element.hasAttribute('disabled'))
8797
- return false;
8798
- if ('disabled' in element && Boolean(element.disabled))
8799
- return false;
8800
- if (element.getAttribute('aria-disabled') === 'true')
8801
- return false;
8802
- if (this.config.isFocusableElement)
8803
- return this.config.isFocusableElement(element);
8804
- const isTabOrderable = this.config.manageTabIndex || element.tabIndex >= 0;
8805
- return (isTabOrderable &&
8806
- element.getAttribute('aria-hidden') !== 'true' &&
8807
- (element.checkVisibility?.() ?? true) &&
8808
- element.offsetParent !== null);
8809
- }
8810
- }
8811
-
8812
8902
  const logoSvg = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDYiIGhlaWdodD0iNzIiIHZpZXdCb3g9IjAgMCA0NiA3MiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzI3Ml80MDUpIj4KPHBhdGggZD0iTTEyLjUgMjAuNjVDMTMuMSAyMC42NSAxNC4yIDIwLjM1IDE0LjcgMjAuMzVDMTYuMSAyMC4zNSAxNy4yIDIxLjQ1IDE3LjIgMjIuODVDMTcuMiAyNC4yNSAxNi4xIDI1LjM1IDE0LjcgMjUuMzVIMi44QzEuMiAyNS4zNSAwIDI0LjE1IDAgMjIuNTVDMCAyMS45NSAwLjIgMjAuNjUgMC4yIDIwLjA1VjUuODQ5OTlDMC4yIDUuMTQ5OTkgMCAzLjk0OTk5IDAgMy4zNDk5OUMwIDEuNzQ5OTkgMS4yIDAuNTQ5OTg4IDIuOCAwLjU0OTk4OEM0LjMgMC41NDk5ODggNS42IDEuNzQ5OTkgNS42IDMuMzQ5OTlDNS42IDMuOTQ5OTkgNS40IDUuMTQ5OTkgNS40IDUuODQ5OTlWMjAuNTVIMTIuNVYyMC42NVpNMjIuMSAyMi43NUMyMi4xIDIyLjE1IDIyLjMgMjAuOTUgMjIuMyAyMC4yNVY1Ljg0OTk5QzIyLjMgNS4xNDk5OSAyMi4xIDMuOTQ5OTkgMjIuMSAzLjQ0OTk5QzIyLjEgMS45NDk5OSAyMy4yIDAuNzQ5OTg4IDI0LjYgMC43NDk5ODhIMjUuMkMyNi40IDAuNzQ5OTg4IDI3LjIgMS41NDk5OSAyNy42IDIuNjQ5OTlMMjggMy40NDk5OUwzMi45IDE0LjA1QzMzLjMgMTQuOTUgMzMuNyAxNi4wNSAzNCAxNi43NUMzNC4zIDE2LjA1IDM0LjcgMTQuOTUgMzUuMSAxNC4wNUw0MCAzLjU0OTk5TDQwLjMgMi41NDk5OUM0MC43IDEuNTQ5OTkgNDEuNSAwLjY0OTk4OCA0Mi42IDAuNjQ5OTg4SDQzLjJDNDQuNyAwLjY0OTk4OCA0NS43IDEuODQ5OTkgNDUuNyAzLjM0OTk5QzQ1LjcgMy45NDk5OSA0NS41IDUuMTQ5OTkgNDUuNSA1Ljc0OTk5VjIwLjE1QzQ1LjUgMjAuODUgNDUuNyAyMi4wNSA0NS43IDIyLjY1QzQ1LjcgMjQuMjUgNDQuNSAyNS40NSA0MyAyNS40NUM0MS40IDI1LjQ1IDQwLjMgMjQuMjUgNDAuMyAyMi42NUM0MC4zIDIxLjk1IDQwLjQgMjAuNzUgNDAuNCAyMC4xNUw0MC42IDE0LjA1QzQwLjYgMTMuMTUgNDAuNyAxMS43NSA0MC43IDEwLjY1TDM3IDE5LjA1QzM2LjcgMTkuNzUgMzYuNiAxOS45NSAzNi40IDIwLjM1QzM2IDIxLjI1IDM1LjMgMjEuODUgMzMuOSAyMS44NUMzMi41IDIxLjg1IDMxLjggMjEuMjUgMzEuNCAyMC40NUMzMS4yIDIwLjA1IDMxLjIgMTkuNzUgMzAuOCAxOS4wNUwyNyAxMC43NUMyNyAxMC43NSAyNy4xIDEzLjE1IDI3LjIgMTQuMDVMMjcuNCAyMC4xNUMyNy40IDIwLjg1IDI3LjUgMjEuOTUgMjcuNSAyMi42NUMyNy41IDI0LjI1IDI2LjQgMjUuNDUgMjQuOCAyNS40NUMyMy4zIDI1LjU1IDIyLjEgMjQuMjUgMjIuMSAyMi43NVpNMjguNyAzMi45NUMyOS4xIDMyLjk1IDMwLjIgMzMuMTUgMzAuNyAzMy4xNUg0MS44QzQyLjMgMzMuMTUgNDMuMiAzMi45NSA0My43IDMyLjk1QzQ0LjkgMzIuOTUgNDUuOCAzMy44NSA0NS44IDM1LjA1QzQ1LjggMzYuMTUgNDQuOSAzNy4xNSA0My43IDM3LjE1QzQzLjMgMzcuMTUgNDIuMyAzNi45NSA0MS44IDM2Ljk1SDMwLjhDMzAuMyAzNi45NSAyOS4yIDM3LjE1IDI4LjggMzcuMTVDMjcuNiAzNy4xNSAyNi43IDM2LjI1IDI2LjcgMzUuMDVDMjYuNiAzMy45NSAyNy41IDMyLjk1IDI4LjcgMzIuOTVaTTIuMSA2Ny4yNUMyLjUgNjcuMjUgMy42IDY3LjQ1IDQuMSA2Ny40NUgxOC41QzE5IDY3LjQ1IDE5LjkgNjcuMjUgMjAuNCA2Ny4yNUMyMS42IDY3LjI1IDIyLjUgNjguMTUgMjIuNSA2OS4zNUMyMi41IDcwLjQ1IDIxLjYgNzEuNDUgMjAuNCA3MS40NUMyMCA3MS40NSAxOSA3MS4yNSAxOC41IDcxLjI1SDQuMUMzLjYgNzEuMjUgMi41IDcxLjQ1IDIuMSA3MS40NUMwLjkgNzEuNDUgMCA3MC41NSAwIDY5LjM1QzAgNjguMjUgMC45IDY3LjI1IDIuMSA2Ny4yNVpNMjEuOSAzNS42NUMyMS45IDM1Ljk1IDIxLjggMzYuMzUgMjEuNiAzNi43NUMyMS4zIDM3LjQ1IDIwLjkgMzguMzUgMjAuNyAzOC44NUwxNC43IDU0LjY1QzE0LjUgNTUuMDUgMTQuNCA1NS41NSAxNC4yIDU2LjM1QzEzLjggNTcuNjUgMTIuNiA1OC4yNSAxMS4yIDU4LjI1SDEwLjhDOS40IDU4LjI1IDguMiA1Ny43NSA3LjggNTYuMzVDNy42IDU1LjU1IDcuNCA1NS4xNSA3LjIgNTQuNjVMMS4yIDM4Ljg1QzEgMzguMzUgMC42IDM3LjU1IDAuMiAzNi44NUMwLjEgMzYuNDUgMCAzNS45NSAwIDM1LjY1QzAgMzQuMTUgMS4yIDMyLjg1IDIuOCAzMi44NUMzLjkgMzIuODUgNSAzMy41NSA1LjMgMzQuNzVDNS41IDM1LjU1IDUuNSAzNi4xNSA2IDM3LjU1TDEwLjIgNDkuNDVDMTAuNSA1MC4zNSAxMC45IDUxLjQ1IDExLjEgNTIuMzVDMTEuMyA1MS40NSAxMS42IDUwLjQ1IDExLjkgNDkuNTVMMTYgMzcuNTVDMTYuNSAzNi4wNSAxNi40IDM1LjY1IDE2LjcgMzQuODVDMTcuMSAzMy42NSAxOC4xIDMyLjg1IDE5LjMgMzIuODVDMjAuOSAzMi44NSAyMS45IDM0LjE1IDIxLjkgMzUuNjVaTTI5LjcgNzEuNDVDMjguMiA3MS40NSAyNy4yIDcwLjQ1IDI3LjIgNjkuMTVDMjcuMiA2OC43NSAyNy4yIDY4LjI1IDI3LjggNjcuNDVMMzcuNCA1My40NUMzNy45IDUyLjc1IDM4LjUgNTIuMDUgMzkuMSA1MS4zNUgzMi4yQzMxLjUgNTEuMzUgMzAuNyA1MS42NSAzMC4xIDUxLjY1QzI4LjcgNTEuNjUgMjcuNiA1MC43NSAyNy42IDQ5LjM1QzI3LjYgNDcuOTUgMjguNyA0Ni45NSAzMC4xIDQ2Ljk1SDQyLjdDNDQuMiA0Ni45NSA0NS4yIDQ3Ljg1IDQ1LjIgNDkuMjVDNDUuMiA0OS42NSA0NSA1MC4zNSA0NC41IDUxLjA1TDM1LjIgNjQuODVDMzQuNyA2NS42NSAzNC4xIDY2LjQ1IDMzLjUgNjcuMDVINDEuMUM0MS45IDY3LjA1IDQyLjcgNjYuNzUgNDMuMyA2Ni43NUM0NC43IDY2Ljc1IDQ1LjcgNjcuNzUgNDUuNyA2OS4wNUM0NS43IDcwLjU1IDQ0LjUgNzEuNTUgNDMuMiA3MS41NUgyOS43VjcxLjQ1WiIgZmlsbD0iYmxhY2siLz4KPC9nPgo8ZGVmcz4KPGNsaXBQYXRoIGlkPSJjbGlwMF8yNzJfNDA1Ij4KPHJlY3Qgd2lkdGg9IjQ2IiBoZWlnaHQ9IjcyIiBmaWxsPSJ3aGl0ZSIvPgo8L2NsaXBQYXRoPgo8L2RlZnM+Cjwvc3ZnPgo=';
8813
8903
 
8814
8904
  const lmvzHeaderCss = () => `:host{display:flex;width:100vw;flex-direction:row;align-items:center;box-sizing:border-box;background-color:var(--lmvz-semantic-color-surface-primary, #ffffff);--lmvz-header-x-spacing-level-1:var(--lmvz-dimension-8-28, clamp(0.5rem, 0.2rem + 1.29vw, 1.75rem));--lmvz-header-x-spacing-level-2:var(--lmvz-component-buttongroup-wrapper-gap-x, clamp(0.25rem, 0.16rem + 0.39vw, 0.63rem));padding:var(--lmvz-dimension-8-16, clamp(0.5rem, 0.38rem + 0.52vw, 1rem)) var(--lmvz-header-x-spacing-level-1);gap:var(--lmvz-header-x-spacing-level-1);.brand{display:inline-flex;justify-content:center;align-items:center}#fallback-logo-lmvz{height:34px;width:auto}nav{flex-grow:1}.primary-menubar{display:flex;flex-direction:row;align-items:center}.secondary-menubar{display:flex;flex-direction:row;align-items:center;margin-left:var(--lmvz-header-x-spacing-level-2);padding-left:var(--lmvz-header-x-spacing-level-2);border-left:1px solid var(--lmvz-semantic-color-border-default, #e0e0e0)}}`;
@@ -8895,7 +8985,7 @@ class LmvzHeader extends ReactiveControllerHost {
8895
8985
  }
8896
8986
  }
8897
8987
  render() {
8898
- return (hAsync(Host, { key: '0152283363802ea854334e0349e145e7d6219e09', onFocus: this.delegateFocus.bind(this) }, hAsync("div", { key: 'cdc1d52dbfb658f99bffa2df2353b6a1ad232f97', class: "brand" }, hAsync("slot", { key: '25a039ea2224058f97f8ec1cb1aa310b388f2b2e', name: "brand" }, hAsync("img", { key: '9ca6f39b6e41382a438b3afd36348ee17b36d346', id: "fallback-logo-lmvz", src: logoSvg, alt: "Lehrmittelverlag Z\u00FCrich" }))), hAsync("nav", { key: 'a6b7c1e7baca1ef2075d38cfaf631a277d2bb7ac', "aria-label": "Hauptnavigation" }, hAsync("div", { key: 'eb8c2db72d86cf3c4e2b0d94271bf73882c3bd96', role: "menubar", class: "primary-menubar" }, hAsync("slot", { key: 'b8a2b3c031158ce73ada65995b0d4e6e0e4eac72', name: "nav-primary", ref: (el) => (this.primarySlot = el) }), hAsync("div", { key: '87dabdc52e40163b35e8c7681d3e4aa3a17d6d82', role: "menu", id: "nav-secondary", class: "secondary-menubar", hidden: !this.lmvzActiveNav, ref: (el) => (this.secondaryNav = el) }, hAsync("slot", { key: '6cb38c14357ef682f1c804ab77cd70514308b6d4', name: this.secondarySlotName, ref: (el) => (this.secondarySlot = el) })))), hAsync("div", { key: '9e46e6e484556c5fbe0f2c573188e845fbca801b', class: "actions" }, hAsync("slot", { key: '4c1ea348528ccc3722c2dbbe0795e9f61d67edee', name: "actions" }))));
8988
+ return (hAsync(Host, { key: '5730219e990fc0f131ffacc7c88e6a5311553399', onFocus: this.delegateFocus.bind(this) }, hAsync("div", { key: '7285f2dcac7d60c5d93328aa0e2fe8aa6b7b379c', class: "brand" }, hAsync("slot", { key: 'd06d953ee82eab20da3f383c15032bcbe8803ff9', name: "brand" }, hAsync("img", { key: 'd2441ce0efbf99c05f6344051703a96ffb376450', id: "fallback-logo-lmvz", src: logoSvg, alt: "Lehrmittelverlag Z\u00FCrich" }))), hAsync("nav", { key: '7f092938728af5cb6568383a6622df49f222dc93', "aria-label": "Hauptnavigation" }, hAsync("div", { key: 'caa56893d6185aebb89661e62a555407675ccc2a', role: "menubar", class: "primary-menubar" }, hAsync("slot", { key: '90684f49cd3d53e20a63d4ebc37ec24e630bc313', name: "nav-primary", ref: (el) => (this.primarySlot = el) }), hAsync("div", { key: 'ead46c08c6833565a55cd7af27fbece4e4468a03', role: "menu", id: "nav-secondary", class: "secondary-menubar", hidden: !this.lmvzActiveNav, ref: (el) => (this.secondaryNav = el) }, hAsync("slot", { key: '3f2ba617d9ed78abb9ab94b9515b02bb6836385a', name: this.secondarySlotName, ref: (el) => (this.secondarySlot = el) })))), hAsync("div", { key: '6fc79122baa3fd95992cbf30a465c3b40438a18f', class: "actions" }, hAsync("slot", { key: 'c427f5a3ad693169e267060b9076086fd0e37670', name: "actions" }))));
8899
8989
  }
8900
8990
  static get watchers() { return {
8901
8991
  "lmvzActiveNav": [{
@@ -8963,7 +9053,7 @@ class LmvzIcon extends ReactiveControllerHost {
8963
9053
  super.componentDidRender();
8964
9054
  }
8965
9055
  render() {
8966
- return hAsync(Host, { key: '03b4391d02a77409257bcda51c2b65ad9a9e0a0c', role: "img", "aria-hidden": `${this.ariaHidden}`, innerHTML: this.iconData });
9056
+ return hAsync(Host, { key: '4fba217d573d968951819f12af24d775c8ac62dc', role: "img", "aria-hidden": `${this.ariaHidden}`, innerHTML: this.iconData });
8967
9057
  }
8968
9058
  waitUntilVisible(callback, rootMargin = 50) {
8969
9059
  {
@@ -8998,6 +9088,28 @@ class LmvzIcon extends ReactiveControllerHost {
8998
9088
  }; }
8999
9089
  }
9000
9090
 
9091
+ const raf = (h) => {
9092
+ if (typeof __zone_symbol__requestAnimationFrame === 'function') {
9093
+ return __zone_symbol__requestAnimationFrame(h);
9094
+ }
9095
+ if (typeof requestAnimationFrame === 'function') {
9096
+ return requestAnimationFrame(h);
9097
+ }
9098
+ return setTimeout(h);
9099
+ };
9100
+
9101
+ const componentOnReady = (stencilEl, callback) => {
9102
+ if (hasLazyBuild(stencilEl)) {
9103
+ stencilEl.componentOnReady().then((resolvedEl) => callback(resolvedEl));
9104
+ }
9105
+ else {
9106
+ raf(() => callback(stencilEl));
9107
+ }
9108
+ };
9109
+ const hasLazyBuild = (stencilEl) => {
9110
+ return stencilEl.componentOnReady !== undefined;
9111
+ };
9112
+
9001
9113
  const lmvzInputCss = () => `@layer lmvz-ds.reset, lmvz-ds.theme, lmvz-ds.components, lmvz-ds.overrides; @layer lmvz-ds.theme { @font-face { font-family: Router; src: local('RouterBook-Regular'), local('Router-Book'), url('/assets/fonts/Router-Book.woff') format('woff'); font-weight: 400; } @font-face { font-family: Router; src: local('RouterMedium-Regular'), local('Router-Medium'), url('/assets/fonts/Router-Medium.woff') format('woff'); font-weight: 500; } @font-face { font-family: Router; src: local('RouterBold-Regular'), local('Router-Bold'), url('/assets/fonts/Router-Bold.woff') format('woff'); font-weight: 700; } } .sc-lmvz-input-h { display: block; font-family: var(--lmvz-global-font-family-default, Router); --input-radius: var(--lmvz-component-input-radius-default, 999px); --input-bg: var(--lmvz-semantic-color-surface-input-primary, #ffffff); --input-border-color: var(--lmvz-semantic-color-border-default, #e0e0e0); --input-border-color-hover: var(--lmvz-semantic-color-border-hover, #c7c7c7); --input-border-color-focus: var(--lmvz-semantic-color-border-active, #0f8acc); --input-border-width: var(--lmvz-semantic-border-width-default, 1px); --input-height: var(--lmvz-component-input-size-md, clamp(2.5rem, 2.44rem + 0.26vw, 2.75rem)); --input-padding-x: var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem)); --input-gap: var(--lmvz-component-input-gap-md, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem)); --input-font-size: var(--lmvz-component-body-md-font-size, clamp(0.88rem, 0.84rem + 0.13vw, 1rem)); --label-color: var(--lmvz-semantic-color-on-surface-input-secondary, #545454); --input-text-color: var(--lmvz-semantic-color-on-surface-input-primary, #000000); --helper-text-color: var(--lmvz-semantic-color-on-surface-input-secondary, #545454); --error-text-color: var(--lmvz-semantic-color-status-on-danger, #e52a31); --label-minimized-bg: var(--input-bg); --label-minimized-padding-x: 4px; --input-disabled-opacity: var(--lmvz-component-input-disabled-opacity, 40%); } [size='sm'].sc-lmvz-input-h { --input-height: var(--lmvz-component-input-size-sm, clamp(2rem, 1.94rem + 0.26vw, 2.25rem)); --input-padding-x: var(--lmvz-component-input-padding-sm, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem)); --input-gap: var(--lmvz-component-input-gap-sm, clamp(0.38rem, 0.31rem + 0.26vw, 0.63rem)); --input-font-size: var(--lmvz-component-body-sm-font-size, clamp(0.69rem, 0.67rem + 0.06vw, 0.75rem)); } [size='md'].sc-lmvz-input-h { --input-height: var(--lmvz-component-input-size-md, clamp(2.5rem, 2.44rem + 0.26vw, 2.75rem)); --input-padding-x: var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem)); --input-gap: var(--lmvz-component-input-gap-md, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem)); --input-font-size: var(--lmvz-component-body-md-font-size, clamp(0.88rem, 0.84rem + 0.13vw, 1rem)); } [size='lg'].sc-lmvz-input-h { --input-height: var(--lmvz-component-input-size-lg, clamp(2.75rem, 2.69rem + 0.26vw, 3rem)); --input-padding-x: var(--lmvz-component-input-padding-lg, clamp(1rem, 0.94rem + 0.26vw, 1.25rem)); --input-gap: var(--lmvz-component-input-gap-lg, clamp(0.75rem, 0.69rem + 0.26vw, 1rem)); --input-font-size: var(--lmvz-component-body-lg-font-size, clamp(1rem, 0.97rem + 0.13vw, 1.13rem)); } .input-container.sc-lmvz-input { display: flex; flex-direction: column; position: relative; width: 100%; } .input-wrapper.sc-lmvz-input { background-color: var(--input-bg); border: var(--input-border-width) solid var(--input-border-color); border-radius: var(--input-radius); display: flex; align-items: center; height: var(--input-height); padding: 0 var(--input-padding-x); position: relative; transition: border-color 0.2s ease; gap: var(--input-gap); } [disabled].sc-lmvz-input-h .input-wrapper.sc-lmvz-input { opacity: var(--input-disabled-opacity); cursor: not-allowed; pointer-events: none; } .input-container.sc-lmvz-input:focus-within .input-wrapper.sc-lmvz-input { border-color: var(--input-border-color-focus); outline: var(--lmvz-ds-outline, 1px solid #0e7ab4); outline-offset: var(--lmvz-ds-outline-offset, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem)); } [error].sc-lmvz-input-h .input-wrapper.sc-lmvz-input { border-color: var(--error-text-color); } .sc-lmvz-input-h:not([disabled]) .input-wrapper.sc-lmvz-input:hover { border-color: var(--input-border-color-hover); } .label-input-group.sc-lmvz-input { position: relative; flex-grow: 1; display: flex; align-items: center; height: 100%; } label.sc-lmvz-input { position: absolute; left: 0; top: 50%; transform: translateY(-50%); color: var(--label-color); font-size: var(--input-font-size); font-weight: 400; pointer-events: none; transition: all 0.2s ease-out; background-color: transparent; padding: 0; margin: 0; line-height: 1.5; white-space: nowrap; } label.floating.sc-lmvz-input { top: 0.5em; transform: translateY(-100%); transform-origin: left top; font-size: var(--lmvz-component-body-2xs-font-size, clamp(0.5rem, 0.47rem + 0.13vw, 0.63rem)); background-color: var(--label-minimized-bg); padding: 0 var(--label-minimized-padding-x); left: -2px; color: var(--input-text-color); font-weight: 400; } .required-indicator.sc-lmvz-input { color: var(--error-text-color); margin-left: 2px; } input.sc-lmvz-input { border: none; background: transparent; width: 100%; height: 100%; color: var(--input-text-color); font-family: inherit; font-size: var(--input-font-size); outline: none; padding: 0; margin: 0; font-weight: 400; } input.sc-lmvz-input::placeholder { color: var(--label-color); } div.sc-lmvz-input:empty { display: none; } [role='status'].sc-lmvz-input { padding-top: 8px; padding-left: var(--input-padding-x); font-size: 12px; color: var(--helper-text-color); font-weight: 400; } [role='alert'].sc-lmvz-input { padding-top: 8px; padding-left: var(--input-padding-x); font-size: 12px; color: var(--error-text-color); font-weight: 400; } .sc-lmvz-input-s > lmvz-button { --lmvz-button-padding: 4px; }`;
9002
9114
 
9003
9115
  let inputIdCounter = 0;
@@ -9146,7 +9258,7 @@ class LmvzInput extends ReactiveControllerHost {
9146
9258
  handleFocus = () => { };
9147
9259
  handleBlur = (event) => {
9148
9260
  const input = event.target;
9149
- input.reportValidity?.();
9261
+ input.checkValidity?.();
9150
9262
  };
9151
9263
  updateNativeError(fromEvent) {
9152
9264
  const input = fromEvent ?? this.nativeInputElement;
@@ -9157,9 +9269,9 @@ class LmvzInput extends ReactiveControllerHost {
9157
9269
  render() {
9158
9270
  const hasValue = Boolean(this.value);
9159
9271
  const shouldFloatLabel = hasValue || Boolean(this.placeholder);
9160
- return (hAsync("div", { key: '4be6846147fec950acad0c0cb8643bfa69233935', class: classNames('input-container', {
9272
+ return (hAsync("div", { key: '693614c334a94373dcef56b461455bf872249a69', class: classNames('input-container', {
9161
9273
  'interaction-filled': hasValue,
9162
- }) }, hAsync("div", { key: 'ae9bf8ffd91b73a86c2ebd21af051efe26a1d5fd', class: "input-wrapper" }, hAsync("slot", { key: '36b3f7d97a11296aeead44c4d8ab4f0f8edf62d1', name: "before-input" }), hAsync("div", { key: '4320f461ffa908730cd898863f43644aa3677081', class: "label-input-group" }, hAsync("label", { key: '1dd51cf16f064303fd9c5249cbe3a357c7515ddc', htmlFor: this.inputId, class: classNames({ floating: shouldFloatLabel }) }, this.label, this.required && (hAsync("span", { key: '74bb8124b1126501201eb7c3361c6cf7f17dda5c', class: "required-indicator", "aria-hidden": "true" }, ' ', "*"))), hAsync("input", { key: '9cff77bea65c50331a6804d7039672bbe01e710c', id: this.inputId, ref: (el) => (this.nativeInputElement = el), type: this.type, min: this.min, max: this.max, step: this.step, value: this.value, name: this.name, placeholder: this.placeholder, disabled: this.disabled, readOnly: this.readonly, required: this.required, form: this.form, autocomplete: this.autocomplete, inputmode: this.inputmode, autocorrect: this.autocorrect, autocapitalize: this.autocapitalize, spellcheck: this.spellcheck, autofocus: this.autofocus, minlength: this.minlength, maxlength: this.maxlength, pattern: this.pattern, "aria-invalid": this.error ? 'true' : 'false', "aria-required": this.required ? 'true' : 'false', "aria-describedby": this.describedBy, "aria-errormessage": this.errorId, onInput: this.handleInput, onChange: this.handleChange, onFocus: this.handleFocus, onBlur: this.handleBlur })), hAsync("slot", { key: '689a3aa53e22f89173893adbc72eaf4953a2c7f6', name: "after-input" })), hAsync("div", { key: 'd29b9ea209c138d0de09f71042f539a56ed4f9fa', id: this.helperId, role: "status" }, this.helperText || null), hAsync("div", { key: '8be227367abadb0e001d9475f0793aed31dbb64a', id: this.errorId, role: "alert" }, (this.showErrorMessage && this.errorMessage) || null)));
9274
+ }) }, hAsync("div", { key: '0eb36d76661d70bea71027ca7b30763d89bd6cb6', class: "input-wrapper" }, hAsync("slot", { key: '03adf18ebe01fe70dc821dcea2bb2963df40f8b4', name: "before-input" }), hAsync("div", { key: 'f1254561b53e321d0f2e4cf4ac93936119083f3f', class: "label-input-group" }, hAsync("label", { key: 'e17cdec368fd36a041d9d8853f4a82249f1b5d8c', htmlFor: this.inputId, class: classNames({ floating: shouldFloatLabel }) }, this.label, this.required && (hAsync("span", { key: 'b3e003bf972c3ad5b6c5b25f8ee509bd5d8df758', class: "required-indicator", "aria-hidden": "true" }, ' ', "*"))), hAsync("input", { key: '75f192118b7a4c3e507172e13d0ae7e32118aad3', id: this.inputId, ref: (el) => (this.nativeInputElement = el), type: this.type, min: this.min, max: this.max, step: this.step, value: this.value, name: this.name, placeholder: this.placeholder, disabled: this.disabled, readOnly: this.readonly, required: this.required, form: this.form, autocomplete: this.autocomplete, inputmode: this.inputmode, autocorrect: this.autocorrect, autocapitalize: this.autocapitalize, spellcheck: this.spellcheck, autofocus: this.autofocus, minlength: this.minlength, maxlength: this.maxlength, pattern: this.pattern, "aria-invalid": this.error ? 'true' : 'false', "aria-required": this.required ? 'true' : 'false', "aria-describedby": this.describedBy, "aria-errormessage": this.errorId, onInput: this.handleInput, onChange: this.handleChange, onFocus: this.handleFocus, onBlur: this.handleBlur })), hAsync("slot", { key: '58a9701259ca92fd7441c1480de741d92bc47bc9', name: "after-input" })), hAsync("div", { key: '396b719d080c781f38d736e28e9c048f629d6ffe', id: this.helperId, role: "status" }, this.helperText || null), hAsync("div", { key: '9e5c86e6098f58d95c0984348d3da07b9e34e1fb', id: this.errorId, role: "alert" }, (this.showErrorMessage && this.errorMessage) || null)));
9163
9275
  }
9164
9276
  static get formAssociated() { return true; }
9165
9277
  static get watchers() { return {
@@ -9265,7 +9377,7 @@ class LmvzLink {
9265
9377
  const rel = this.computeRel();
9266
9378
  const iconSvg = this.type === 'external' ? EXTERNAL_SVG : ARROW_RIGHT_SVG;
9267
9379
  const isBlank = this.target === '_blank';
9268
- return (hAsync(Host, { key: 'c80daca5bef1fd7a9753a075d6bf795f11b5fc1b' }, hAsync("a", { key: '06dd1183936e57c00ba4cf028bf186e964ad0ff8', href: this.computeHref(), target: this.target, rel: rel }, hAsync("slot", { key: '03cd7fe4bab8a9d6d8f1e7278ee6d0d24650fbda' }), hAsync("lmvz-icon", { key: 'c8a31a8937bc59b98bf1dce9bb127f423ac0cb4d', "aria-hidden": "true", icon: iconSvg }), isBlank && hAsync("span", { key: '9217e2d0b1b904492598bd0e638cbcb29d4ff212', class: "sr-only" }, this.externalLabel))));
9380
+ return (hAsync(Host, { key: '338116d5af3112ec2a4a09b652048b733565a7d4' }, hAsync("a", { key: 'ae70aa2320ea2eeca56a14714de4dcfb06b8c94c', href: this.computeHref(), target: this.target, rel: rel }, hAsync("slot", { key: '4852b3336a94a46f363a83fb2c4f6d267f680d3d' }), hAsync("lmvz-icon", { key: 'e7f72016611a7d741eef7c81a047e026c699bdef', "aria-hidden": "true", icon: iconSvg }), isBlank && hAsync("span", { key: 'b4138b479b7c36c3b16c8e96fc6e39736222b26f', class: "sr-only" }, this.externalLabel))));
9269
9381
  }
9270
9382
  static get delegatesFocus() { return true; }
9271
9383
  static get watchers() { return {
@@ -9313,7 +9425,7 @@ class LmvzMenuItem extends ReactiveControllerHost {
9313
9425
  this.addController(new ElementActivationController(this));
9314
9426
  }
9315
9427
  render() {
9316
- return (hAsync(Host, { key: '3bc38647d755df012ea744775fe856798e677d0f' }, hAsync("slot", { key: '67145418bc36b0ede915d170dca9ce84a27567c8', ref: (e) => (this.validationSlot = e) })));
9428
+ return (hAsync(Host, { key: '9c86e99a0427a5d11925a30bcdb9f88124006413' }, hAsync("slot", { key: '9a578cdf49bd1edd981d68d7b28c39b784980345', ref: (e) => (this.validationSlot = e) })));
9317
9429
  }
9318
9430
  static get style() { return lmvzMenuitemCss(); }
9319
9431
  static get cmpMeta() { return {
@@ -9398,7 +9510,7 @@ class LmvzMessage {
9398
9510
  }
9399
9511
  render() {
9400
9512
  const role = this.live === 'assertive' ? 'alert' : this.live === 'polite' ? 'status' : 'note';
9401
- return (hAsync(Host, { key: '4e29d3edf1043cd85245942135d689c3b65e49e7', role: role }, this.leadingIcon && hAsync("span", { key: 'd927bbefca6152bc40c3a7edf9554ea97231b3a7', class: "leading-icon", "aria-hidden": "true", innerHTML: TYPE_SVG[this.type] }), hAsync("span", { key: 'd321b275006a25be9f03be81ff085e9776e45bfd', class: "message" }, hAsync("slot", { key: 'a511d00a5c668e48844b717c69be759e046da25d', ref: (el) => (this.messageSlot = el), onSlotchange: this.handleSlotChange })), this.actionLabel && (hAsync("lmvz-button", { key: 'e09cbc8381b9b96c7fb95d6f18886df55e53c074', variant: "tertiary", scale: "small", onLmvzActivation: this.handleActionClick }, this.actionLabel)), this.dismissible && (hAsync("lmvz-button", { key: 'c34d4684cdc63e5269dd3c98d8e2466ba586c3e3', variant: "tertiary", scale: "small", "aria-label": this.closeLabel, onClick: this.handleDismissClick }, hAsync("lmvz-icon", { key: '1341db9c89a9d708b03807d7cfda949e300deef4', "aria-hidden": "true", icon: CLOSE_SM_SVG })))));
9513
+ return (hAsync(Host, { key: 'f422e8ee4bb4466757c081bc6b33761db15cb02d', role: role }, this.leadingIcon && hAsync("span", { key: 'c4077083db459a65cacce2cbb8e8dbb477572d95', class: "leading-icon", "aria-hidden": "true", innerHTML: TYPE_SVG[this.type] }), hAsync("span", { key: '77c3af94194adc2b663c6d6626951e5789e17686', class: "message" }, hAsync("slot", { key: '8db714f6bd0ac80a3c77a2768431baa37a63b3d1', ref: (el) => (this.messageSlot = el), onSlotchange: this.handleSlotChange })), this.actionLabel && (hAsync("lmvz-button", { key: 'f75e835f39e97ea217727b55dc842ceda004834b', variant: "tertiary", scale: "small", onLmvzActivation: this.handleActionClick }, this.actionLabel)), this.dismissible && (hAsync("lmvz-button", { key: '51b04ad48a68e0843445104e303eae5bb4cdd351', variant: "tertiary", scale: "small", "aria-label": this.closeLabel, onClick: this.handleDismissClick }, hAsync("lmvz-icon", { key: '5949210f479a6a19f1c4bb9d3c91a77a1c0ad8a6', "aria-hidden": "true", icon: CLOSE_SM_SVG })))));
9402
9514
  }
9403
9515
  static get style() { return lmvzMessageCss(); }
9404
9516
  static get cmpMeta() { return {
@@ -9418,7 +9530,7 @@ class LmvzMessage {
9418
9530
  }; }
9419
9531
  }
9420
9532
 
9421
- const lmvzModalCss = () => ` @layer lmvz-ds.reset, lmvz-ds.theme, lmvz-ds.components, lmvz-ds.overrides; @layer lmvz-ds.theme { @font-face { font-family: Router; src: local('RouterBook-Regular'), local('Router-Book'), url('/assets/fonts/Router-Book.woff') format('woff'); font-weight: 400; } @font-face { font-family: Router; src: local('RouterMedium-Regular'), local('Router-Medium'), url('/assets/fonts/Router-Medium.woff') format('woff'); font-weight: 500; } @font-face { font-family: Router; src: local('RouterBold-Regular'), local('Router-Bold'), url('/assets/fonts/Router-Bold.woff') format('woff'); font-weight: 700; } } @layer lmvz-ds.reset { body { margin: 0; } h1, h2, h3, h4, h5, h6 { margin: 0; } *[hidden] { display: none !important; } } :host { display: contents; --lmvz-modal-shell-gap: var(--lmvz-dimension-16-20, clamp(1rem, 0.94rem + 0.26vw, 1.25rem)); } dialog { border: none; padding: 0; background: transparent; height: 100vh; width: 100vw; contain: layout size; } dialog::backdrop { background: rgba(0, 0, 0, 0.19); background: rgb(from var(--lmvz-semantic-color-int-primary, #000000) r g b / 0.29); } .modal-shell { margin-inline: auto; top: 50%; transform: translateY(-50%); box-sizing: border-box; width: fit-content; max-height: 100%; max-width: clamp(20rem, 100%, 90vw); display: flex; flex-direction: column; gap: var(--lmvz-modal-shell-gap); padding: var(--lmvz-component-wrapper-lg-padding-y, clamp(2.25rem, 2.19rem + 0.26vw, 2.5rem)) var(--lmvz-component-wrapper-lg-padding-x, clamp(1.5rem, 1.14rem + 1.55vw, 3rem)); border-radius: var(--lmvz-component-wrapper-lg-border-radius, 18px); background: var(--lmvz-semantic-color-surface-primary, #ffffff); position: relative; .close-button { position: absolute; top: var(--lmvz-dimension-10-12, clamp(0.63rem, 0.59rem + 0.13vw, 0.75rem)); right: var(--lmvz-dimension-10-12, clamp(0.63rem, 0.59rem + 0.13vw, 0.75rem)); } } .header { display: flex; align-items: flex-start; justify-content: flex-end; gap: var(--lmvz-modal-shell-gap); } .title { min-inline-size: 0; font: var(--lmvz-typography-heading-lg, 500 clamp(1.25rem, 1.19rem + 0.26vw, 1.5rem) / 1.5 Router); } .has-title .title { flex: 1 1 auto; } .body { font: var(--lmvz-typography-body-md, 400 clamp(0.88rem, 0.84rem + 0.13vw, 1rem) / 1.5 Router); flex: 1; overflow: scroll; } `;
9533
+ const lmvzModalCss = () => ` @layer lmvz-ds.reset, lmvz-ds.theme, lmvz-ds.components, lmvz-ds.overrides; @layer lmvz-ds.theme { @font-face { font-family: Router; src: local('RouterBook-Regular'), local('Router-Book'), url('/assets/fonts/Router-Book.woff') format('woff'); font-weight: 400; } @font-face { font-family: Router; src: local('RouterMedium-Regular'), local('Router-Medium'), url('/assets/fonts/Router-Medium.woff') format('woff'); font-weight: 500; } @font-face { font-family: Router; src: local('RouterBold-Regular'), local('Router-Bold'), url('/assets/fonts/Router-Bold.woff') format('woff'); font-weight: 700; } } @layer lmvz-ds.reset { body { margin: 0; } h1, h2, h3, h4, h5, h6 { margin: 0; } *[hidden] { display: none !important; } hr { height: 0; border: none; margin: var(--lmvz-dimension-4-8, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem)) 0; border-top: var(--lmvz-semantic-border-width-default, 1px) solid var(--lmvz-semantic-color-border-subtle, #f0f0f0); } } :host { display: contents; --lmvz-modal-shell-gap: var(--lmvz-dimension-16-20, clamp(1rem, 0.94rem + 0.26vw, 1.25rem)); } dialog { border: none; padding: 0; background: transparent; height: 100vh; width: 100vw; contain: layout size; } dialog::backdrop { background: rgba(0, 0, 0, 0.19); background: rgb(from var(--lmvz-semantic-color-int-primary, #000000) r g b / 0.29); } .modal-shell { margin-inline: auto; top: 50%; transform: translateY(-50%); box-sizing: border-box; width: fit-content; max-height: 100%; max-width: clamp(20rem, 100%, 90vw); display: flex; flex-direction: column; gap: var(--lmvz-modal-shell-gap); padding: var(--lmvz-component-wrapper-lg-padding-y, clamp(2.25rem, 2.19rem + 0.26vw, 2.5rem)) var(--lmvz-component-wrapper-lg-padding-x, clamp(1.5rem, 1.14rem + 1.55vw, 3rem)); border-radius: var(--lmvz-component-wrapper-lg-border-radius, 18px); background: var(--lmvz-semantic-color-surface-primary, #ffffff); position: relative; .close-button { position: absolute; top: var(--lmvz-dimension-10-12, clamp(0.63rem, 0.59rem + 0.13vw, 0.75rem)); right: var(--lmvz-dimension-10-12, clamp(0.63rem, 0.59rem + 0.13vw, 0.75rem)); } } .header { display: flex; align-items: flex-start; justify-content: flex-end; gap: var(--lmvz-modal-shell-gap); } .title { min-inline-size: 0; font: var(--lmvz-typography-heading-lg, 500 clamp(1.25rem, 1.19rem + 0.26vw, 1.5rem) / 1.5 Router); } .has-title .title { flex: 1 1 auto; } .body { font: var(--lmvz-typography-body-md, 400 clamp(0.88rem, 0.84rem + 0.13vw, 1rem) / 1.5 Router); flex: 1; overflow: scroll; } `;
9422
9534
 
9423
9535
  const closeIconSvg = toValidSvgStringWithFallback(closeSmSvg);
9424
9536
  let modalIdCounter = 0;
@@ -9642,7 +9754,7 @@ class LmvzModal extends ReactiveControllerHost {
9642
9754
  this.hasHeader = this.hasAssignedContent(this.headerSlot);
9643
9755
  };
9644
9756
  render() {
9645
- return (hAsync(Host, { key: 'd73eaf12bf6b229785cdec9ce2156cf5510c51ca' }, hAsync("dialog", { key: '51e36002cf4a49963abe1e6e541b2e19274347b5', ref: (element) => (this.dialogEl = element), onCancel: this.handleDialogCancel, onClose: this.handleDialogClose, ...this.dialogAccessibilityAttributes }, hAsync("div", { key: '5415ca10fabe4bf828f59059b03eb06e2c965d92', class: "modal-shell" }, hAsync("header", { key: 'be3c707da5ffda470f51425cb09550b0ab749f0f', class: { header: true, 'has-title': this.hasHeader } }, hAsync("div", { key: '7221eb87a8d132436043ec74e5b0b3622faa57bc', class: "title", id: this.dialogTitleId, hidden: !this.hasHeader }, hAsync("slot", { key: 'a410b4185f0ed52f17dd92d765318d8ce3421bea', name: "header", ref: (element) => (this.headerSlot = element), onSlotchange: this.handleHeaderSlotChange })), hAsync("lmvz-button", { key: 'b87688d68b01c51274455a4e1977f2cccbf22690', ref: (element) => (this.closeButtonEl = element), type: "button", class: "close-button", "aria-label": this.closeLabel, onClick: this.handleCloseButtonClick, variant: "tertiary" }, hAsync("lmvz-icon", { key: '3ba11132a9779c971458151aca5a0ba4a09bbf28', icon: closeIconSvg }))), hAsync("div", { key: '00b59e67efc8470bff3a7270bdde4221b8a8ffb4', class: "body" }, hAsync("slot", { key: 'e51eb9f2c17e2eb76d1013d585e8dfcd54a8f0d2' })), hAsync("footer", { key: '0972331ef6843b0f401bac6bde4d8dc78a81fb5c', class: "actions", hidden: !this.buttonGroupEl?.hasActions }, hAsync("lmvz-button-group", { key: '81c19d896200e84dd91878d2902410b9838d6c8c', ref: (element) => (this.buttonGroupEl = element) }, hAsync("slot", { key: '0ed4a2ba74e5bee597e61329afe422b3bf3c3907', name: "actions" })))))));
9757
+ return (hAsync(Host, { key: '8b5f506cdac223a440309d472639fe965b94f8c2' }, hAsync("dialog", { key: '0b70ac4d9590266271052c4d7fdef03c684d9b72', ref: (element) => (this.dialogEl = element), onCancel: this.handleDialogCancel, onClose: this.handleDialogClose, ...this.dialogAccessibilityAttributes }, hAsync("div", { key: '25b529bec1905408c2041b7370ab37586eade47d', class: "modal-shell" }, hAsync("header", { key: 'd86ae4a6f4ac7f6efd38385f1407d1f6bfbb1abb', class: { header: true, 'has-title': this.hasHeader } }, hAsync("div", { key: '7fd7059bfb0b90834895a87c2f2598e2e8c2ba80', class: "title", id: this.dialogTitleId, hidden: !this.hasHeader }, hAsync("slot", { key: 'b6eb7885e220e5def4c3c8420d5b83f4a7e30907', name: "header", ref: (element) => (this.headerSlot = element), onSlotchange: this.handleHeaderSlotChange })), hAsync("lmvz-button", { key: 'dcebb06482cdef7423c6b62ef877ca9aaabf55a4', ref: (element) => (this.closeButtonEl = element), type: "button", class: "close-button", "aria-label": this.closeLabel, onClick: this.handleCloseButtonClick, variant: "tertiary" }, hAsync("lmvz-icon", { key: '0db22c68fe164ed2a33bfaeacf9eac619424f464', icon: closeIconSvg }))), hAsync("div", { key: 'ef402c343f2c68210351f7556eec08f2e9be851b', class: "body" }, hAsync("slot", { key: '3fe86dc88c88c2cf7bfe3429c62cb2047b64611a' })), hAsync("footer", { key: '92b7bdab1ffe700749fc029723f70913f436397d', class: "actions", hidden: !this.buttonGroupEl?.hasActions }, hAsync("lmvz-button-group", { key: '7e1b310fb1b20449ead14d0702af4977c74198dd', ref: (element) => (this.buttonGroupEl = element) }, hAsync("slot", { key: 'cb2187ab2758c61e80b65f9fc55c6be5f9fd0458', name: "actions" })))))));
9646
9758
  }
9647
9759
  static get watchers() { return {
9648
9760
  "open": [{
@@ -9974,7 +10086,7 @@ class LmvzRadio extends ReactiveControllerHost {
9974
10086
  this.radioGroupController.setFocused(target);
9975
10087
  }
9976
10088
  render() {
9977
- return (hAsync(Host, { key: '084706ba35f3ecc647653896cf50e1dfdb0eabe4' }, hAsync("input", { key: 'c68a13d6f424c251b93ff3bb5648d64ef4645a5a', type: "radio", id: this.radioId, name: this.name ?? undefined, value: this.value, checked: this.checked, disabled: this.disabled, required: this.required, autoFocus: this.autofocus, "aria-invalid": this.error ? 'true' : undefined, "aria-describedby": this.helperId, ref: (el) => (this.nativeInput = el), onChange: this.handleChange }), hAsync("span", { key: '07500032fe1cdebe544d3ed6890d66fe84c43e07', class: "circle", "aria-hidden": "true" }, this.checked && hAsync("span", { key: '0b6f8c99270cbadea320cae867bfef9fd4a70312', class: "dot" })), hAsync("span", { key: '60c9720a1e029e99d2304a5579a20942f03778aa', class: "content" }, hAsync("label", { key: '13eb208e8bd0f4c5a56955cd4f4e9813cc715425', htmlFor: this.radioId }, this.label), hAsync("span", { key: '771e582752972a8e58a0e85408cfefeef57e257b', "aria-live": "polite", class: "helper-text", id: this.helperId }, this.helperText))));
10089
+ return (hAsync(Host, { key: '9b8fbfe18376f9411f792630065dfd219f9ddb32' }, hAsync("input", { key: '24a0675eff854bbd751c07905db4be11e5353d11', type: "radio", id: this.radioId, name: this.name ?? undefined, value: this.value, checked: this.checked, disabled: this.disabled, required: this.required, autoFocus: this.autofocus, "aria-invalid": this.error ? 'true' : undefined, "aria-describedby": this.helperId, ref: (el) => (this.nativeInput = el), onChange: this.handleChange }), hAsync("span", { key: 'f888c1f76f6f929609584d378dbe0974fd980f68', class: "circle", "aria-hidden": "true" }, this.checked && hAsync("span", { key: '57fbb1e7abdca10861cf8709d4300459e1f62e5c', class: "dot" })), hAsync("span", { key: '1c845611162be86500e8475ac37412e2d3f2fd99', class: "content" }, hAsync("label", { key: '1399f4d34ff0e6d369cefc9f5d08208a4dee593f', htmlFor: this.radioId }, this.label), hAsync("span", { key: '1345435ff2f4773260ea3f73e943f043c2b88bdb', "aria-live": "polite", class: "helper-text", id: this.helperId }, this.helperText))));
9978
10090
  }
9979
10091
  static get formAssociated() { return true; }
9980
10092
  static get watchers() { return {
@@ -10067,7 +10179,7 @@ class LmvzSelect extends ReactiveControllerHost {
10067
10179
  render() {
10068
10180
  const hasValue = this.hasValue;
10069
10181
  const shouldShowLabel = hasValue;
10070
- return (hAsync(Host, { key: '292678c0d3c000624ca6b0cb76c05a0c27ad3494', "data-highlighted": String(this.highlighted) }, hAsync("div", { key: '83d269c626a21af74dca8d89d5b0a1a95494a70d', class: hasValue ? 'select-wrapper has-value' : 'select-wrapper' }, hAsync("label", { key: 'e5d3b30349ab8438bc02d18c93760d52b979d24e', htmlFor: this.selectId, class: shouldShowLabel ? 'floating-label' : 'assistive-label' }, this.label, this.required && shouldShowLabel && hAsync("span", { key: '2f26cf5991b76a5d740f0e61c2ecf9d9a44436b8', "aria-hidden": "true" }, " *")), hAsync("div", { key: '30087b0b2d3f4768b02470209c6d14a46c362334', "aria-hidden": "true" }, hAsync("span", { key: '67888d3a89f8cbdf332696d827e72a2cce519438' }, hasValue ? this.selectedLabel : this.label, this.required && !hasValue && hAsync("span", { key: 'e1b28fe2c2865ed1fba181e60a8682095c5123fc', "aria-hidden": "true" }, " *")), hAsync("span", { key: '7479df9bf0e995b92ba9f11f1271f71892c52ac8' }, hAsync("svg", { key: '5a76ba91f6b2d29dafd56b6c4abe1b5f93ece926', width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true" }, hAsync("path", { key: '06c62b38ef2cc0ae3119d2dba0f2015e26e84393', d: "M20.3334 8.66663L12.0001 17L3.66675 8.66663", stroke: "currentColor", "stroke-width": "1.75", "stroke-linecap": "round", "stroke-linejoin": "round" })))), hAsync("select", { key: 'f1fb834cc74ae70e21ea3fd0ec4f653689cfbfa1', id: this.selectId, ref: (el) => (this.nativeSelectEl = el), name: this.name, disabled: this.disabled, required: this.required, "aria-label": this.label, onChange: this.handleChange }, !hasValue && hAsync("option", { key: 'b6240b308c06b01a3a00104941a77090d243548b', value: "", disabled: true, selected: true, hidden: true }), hAsync("slot", { key: 'b1128685fc5365be2561bbeef627f2d409f631c9' }))), this.helperText && hAsync("div", { key: 'b856e0b6f8e6f1c62de5d0ef59ad7d623c28b5ae', role: "status" }, this.helperText)));
10182
+ return (hAsync(Host, { key: 'c753006bdabf1723fa9ff61eb35f58d5bef3157b', "data-highlighted": String(this.highlighted) }, hAsync("div", { key: '6b06056fd48ef4f837cbe17383756e3726c68f90', class: hasValue ? 'select-wrapper has-value' : 'select-wrapper' }, hAsync("label", { key: '819901582fc449566a112cd4544fa0af903a7011', htmlFor: this.selectId, class: shouldShowLabel ? 'floating-label' : 'assistive-label' }, this.label, this.required && shouldShowLabel && hAsync("span", { key: '14ad70c1cf1a96c7398698fa86baeadd5fe4257b', "aria-hidden": "true" }, " *")), hAsync("div", { key: '589c6946bee6e320a36dfa0ed765ff9e02af4c2f', "aria-hidden": "true" }, hAsync("span", { key: '04444223ed66a5ddff3eb7bd581cf5a7e615cf6b' }, hasValue ? this.selectedLabel : this.label, this.required && !hasValue && hAsync("span", { key: '9631d4a655514957a4564be939d8bd16c3a036f0', "aria-hidden": "true" }, " *")), hAsync("span", { key: '3950abf6ee9528adb5895fe6bc88be67b39d458e' }, hAsync("svg", { key: '98a0a380e9ca5044ca1fefb03b74bfc178974a60', width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true" }, hAsync("path", { key: '19fe8b40e315fabee982ba37fe2d397493429519', d: "M20.3334 8.66663L12.0001 17L3.66675 8.66663", stroke: "currentColor", "stroke-width": "1.75", "stroke-linecap": "round", "stroke-linejoin": "round" })))), hAsync("select", { key: '7480ff36ef3acfe10fb0122bfdf7feb5af406c67', id: this.selectId, ref: (el) => (this.nativeSelectEl = el), name: this.name, disabled: this.disabled, required: this.required, "aria-label": this.label, onChange: this.handleChange }, !hasValue && hAsync("option", { key: '5d00f696c2c4d7c35c180018a4c487cbb0229d37', value: "", disabled: true, selected: true, hidden: true }), hAsync("slot", { key: '218fe11d224d7ca72c8555301d41d8878b6b34b4' }))), this.helperText && hAsync("div", { key: 'edbb738590305f6724a590a3532fd9284a187866', role: "status" }, this.helperText)));
10071
10183
  }
10072
10184
  static get watchers() { return {
10073
10185
  "value": [{
@@ -10159,7 +10271,7 @@ class LmvzSnackbar {
10159
10271
  this.el.dispatchEvent(new CustomEvent('lmvzAction', { bubbles: false, composed: false }));
10160
10272
  };
10161
10273
  render() {
10162
- return (hAsync(Host, { key: '034265e91b852042148789191923cd905750353f', class: this.animationClass }, hAsync("lmvz-icon", { key: 'ee0d34690e65bd1e6df60e241b40361794c79e5b', icon: STATUS_SVG[this.status], size: "md", weight: "bold" }), hAsync("span", { key: 'd42c28c2b921058f4a8864ae13b58b6d7f76abd2', class: "message" }, this.message), this.actionLabel && (hAsync("lmvz-button", { key: 'b73c572c9156f7ee91d00e24200b9640cfc2f79c', variant: "tertiary", scale: "small", onLmvzActivation: this.handleActionClick }, this.actionLabel))));
10274
+ return (hAsync(Host, { key: 'f207854371f8423ff8dc9b732d1dabe1ab06e0b1', class: this.animationClass }, hAsync("lmvz-icon", { key: 'e0ffdd4c51d11f94aa33c5a9678a15e4162d4bdd', icon: STATUS_SVG[this.status], size: "md", weight: "bold" }), hAsync("span", { key: 'fcce1cbef0597af7e86de7b33a4f8a40c09f0cc8', class: "message" }, this.message), this.actionLabel && (hAsync("lmvz-button", { key: '3cdbd81ba0c9102d0539c913f530e2abfbed0fb6', variant: "tertiary", scale: "small", onLmvzActivation: this.handleActionClick }, this.actionLabel))));
10163
10275
  }
10164
10276
  static get watchers() { return {
10165
10277
  "status": [{
@@ -10196,7 +10308,7 @@ class LmvzSpinner {
10196
10308
  ariaLabel;
10197
10309
  render() {
10198
10310
  const hasLabel = !!this.ariaLabel?.trim();
10199
- return (hAsync(Host, { key: '4afbe68fd14346a506e3ef7748141e580882d867', role: hasLabel ? 'status' : undefined, "aria-label": hasLabel ? this.ariaLabel : undefined, "aria-hidden": hasLabel ? undefined : 'true' }, hAsync("svg", { key: 'a30c1de9096bf0364ef76b685ad82b6ec21a6841', part: "indicator", viewBox: "0 0 16 16", "aria-hidden": "true" }, hAsync("circle", { key: 'e2f9507b582dc591053f2e0543eb701aa701702c', pathLength: "100", cx: "8", cy: "8", r: "6" }))));
10311
+ return (hAsync(Host, { key: '1953e9328170f6203b0936fd051fcaae44cba1d6', role: hasLabel ? 'status' : undefined, "aria-label": hasLabel ? this.ariaLabel : undefined, "aria-hidden": hasLabel ? undefined : 'true' }, hAsync("svg", { key: '4393e17fe0b2e899cdd84f0bfba2047d3a08bac1', part: "indicator", viewBox: "0 0 16 16", "aria-hidden": "true" }, hAsync("circle", { key: 'a321ad329e7a94680b37f2e11bb0ab3ef6344708', pathLength: "100", cx: "8", cy: "8", r: "6" }))));
10200
10312
  }
10201
10313
  static get style() { return lmvzSpinnerCss(); }
10202
10314
  static get cmpMeta() { return {
@@ -10212,7 +10324,7 @@ class LmvzSpinner {
10212
10324
  }; }
10213
10325
  }
10214
10326
 
10215
- const lmvzTabCss = () => ` @layer lmvz-ds.reset, lmvz-ds.theme, lmvz-ds.components, lmvz-ds.overrides; @layer lmvz-ds.reset { body { margin: 0; } h1, h2, h3, h4, h5, h6 { margin: 0; } *[hidden] { display: none !important; } } :host { display: inline-block; flex: none; } :host([disabled]) { cursor: not-allowed; pointer-events: none; } button { --lmvz-tab-color: var(--lmvz-semantic-color-int-on-secondary, #000000); --lmvz-tab-background: var(--lmvz-semantic-color-int-secondary, #f0f0f0); position: relative; display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--lmvz-component-component-spacing-0-default, 4px); padding-top: var(--lmvz-dimension-8-12, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem)); padding-bottom: var(--lmvz-dimension-8-14, clamp(0.5rem, 0.41rem + 0.39vw, 0.88rem)); padding-inline: var(--lmvz-dimension-16-24, clamp(1rem, 0.88rem + 0.52vw, 1.5rem)); border: none; border-radius: var(--lmvz-semantic-border-radius-round, 999px); background: var(--lmvz-tab-background); color: var(--lmvz-tab-color); font: var(--lmvz-typography-body-md-strong, 500 clamp(0.88rem, 0.84rem + 0.13vw, 1rem) / 1.5 Router); cursor: pointer; white-space: nowrap; transition: background-color 0.15s ease, color 0.15s ease; } button:focus-visible { outline: var(--lmvz-ds-outline, 1px solid #0e7ab4); outline-offset: var(--lmvz-ds-outline-offset, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem)); z-index: 1; } button:disabled { opacity: var(--lmvz-component-input-disabled-opacity, 40%); pointer-events: none; cursor: not-allowed; } button:hover { --lmvz-tab-background: var(--lmvz-semantic-color-int-tertiary-hover, #f0f0f0); --lmvz-tab-color: var(--lmvz-semantic-color-int-on-secondary-hover, #000000); } button:active { --lmvz-tab-background: var(--lmvz-semantic-color-int-tertiary-active, #e0e0e0); --lmvz-tab-color: var(--lmvz-semantic-color-int-on-secondary-active, #000000); } :host([has-media]) { --lmvz-tab-color: var(--lmvz-semantic-color-int-on-tertiary, #000000); --lmvz-tab-background: var(--lmvz-semantic-color-int-tertiary, #ffffff); } :host([has-media]) button { padding-top: var(--lmvz-dimension-16-18, clamp(1rem, 0.97rem + 0.13vw, 1.13rem)); padding-bottom: var(--lmvz-dimension-12-14, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem)); padding-inline: var(--lmvz-dimension-40-48, clamp(2.5rem, 2.38rem + 0.52vw, 3rem)); border-radius: var(--lmvz-semantic-border-radius-lg, 14px); } :host([has-media]) button:hover { --lmvz-tab-color: var(--lmvz-semantic-color-int-on-tertiary-hover, #000000); } :host([has-media]) button:active { --lmvz-tab-color: var(--lmvz-semantic-color-int-on-tertiary-active, #000000); } :host([selected]) button { --lmvz-tab-color: var(--lmvz-semantic-color-status-on-active, #0e7ab4); --lmvz-tab-background: var(--lmvz-semantic-color-status-active, #f6fbfe); } :host([selected][has-media]) button:hover, :host([selected][has-media]) button:active { --lmvz-tab-color: var(--lmvz-semantic-color-status-on-active, #0e7ab4); } .indicator { --lmvz-tab-indicator-size: 4px; position: absolute; background: linear-gradient(to right, var(--lmvz-semantic-color-gradient-main-1, #0e7ab4), var(--lmvz-semantic-color-gradient-main-2, #0e7ab4)); opacity: 0; transition: opacity 0.15s ease; inset-block-end: 0; inset-inline: 0; block-size: var(--lmvz-tab-indicator-size); border-start-start-radius: 0; border-start-end-radius: 0; border-end-start-radius: var(--lmvz-tab-indicator-size); border-end-end-radius: var(--lmvz-tab-indicator-size); } :host([selected][has-media]) .indicator { opacity: 1; } :host([vertical]) button { border-radius: var(--lmvz-semantic-border-radius-round, 999px); } :host([vertical]) .indicator { inset-block: 0; inset-inline: 0 auto; inline-size: var(--lmvz-tab-indicator-size); block-size: auto; border-radius: 0 var(--lmvz-tab-indicator-size) var(--lmvz-tab-indicator-size) 0; background: linear-gradient(to bottom, var(--lmvz-semantic-color-gradient-main-1, #0e7ab4), var(--lmvz-semantic-color-gradient-main-2, #0e7ab4)); } ::slotted(*) { --lmvz-component-color: var(--lmvz-tab-color); } ::slotted(lmvz-icon) { --lmvz-component-size: var(--lmvz-dimension-16-18, clamp(1rem, 0.97rem + 0.13vw, 1.13rem)); } :host([has-media]) ::slotted(lmvz-icon) { --lmvz-component-size: var(--lmvz-component-icon-size-lg, clamp(1.5rem, 1.44rem + 0.26vw, 1.75rem)); } .label { display: contents; } `;
10327
+ const lmvzTabCss = () => ` @layer lmvz-ds.reset, lmvz-ds.theme, lmvz-ds.components, lmvz-ds.overrides; @layer lmvz-ds.reset { body { margin: 0; } h1, h2, h3, h4, h5, h6 { margin: 0; } *[hidden] { display: none !important; } hr { height: 0; border: none; margin: var(--lmvz-dimension-4-8, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem)) 0; border-top: var(--lmvz-semantic-border-width-default, 1px) solid var(--lmvz-semantic-color-border-subtle, #f0f0f0); } } :host { display: inline-block; flex: none; } :host([disabled]) { cursor: not-allowed; pointer-events: none; } button { --lmvz-tab-color: var(--lmvz-semantic-color-int-on-secondary, #000000); --lmvz-tab-background: var(--lmvz-semantic-color-int-secondary, #f0f0f0); position: relative; display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--lmvz-component-component-spacing-0-default, 4px); padding-top: var(--lmvz-dimension-8-12, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem)); padding-bottom: var(--lmvz-dimension-8-14, clamp(0.5rem, 0.41rem + 0.39vw, 0.88rem)); padding-inline: var(--lmvz-dimension-16-24, clamp(1rem, 0.88rem + 0.52vw, 1.5rem)); border: none; border-radius: var(--lmvz-semantic-border-radius-round, 999px); background: var(--lmvz-tab-background); color: var(--lmvz-tab-color); font: var(--lmvz-typography-body-md-strong, 500 clamp(0.88rem, 0.84rem + 0.13vw, 1rem) / 1.5 Router); cursor: pointer; white-space: nowrap; transition: background-color 0.15s ease, color 0.15s ease; } button:focus-visible { outline: var(--lmvz-ds-outline, 1px solid #0e7ab4); outline-offset: var(--lmvz-ds-outline-offset, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem)); z-index: 1; } button:disabled { opacity: var(--lmvz-component-input-disabled-opacity, 40%); pointer-events: none; cursor: not-allowed; } button:hover { --lmvz-tab-background: var(--lmvz-semantic-color-int-tertiary-hover, #f0f0f0); --lmvz-tab-color: var(--lmvz-semantic-color-int-on-secondary-hover, #000000); } button:active { --lmvz-tab-background: var(--lmvz-semantic-color-int-tertiary-active, #e0e0e0); --lmvz-tab-color: var(--lmvz-semantic-color-int-on-secondary-active, #000000); } :host([has-media]) { --lmvz-tab-color: var(--lmvz-semantic-color-int-on-tertiary, #000000); --lmvz-tab-background: var(--lmvz-semantic-color-int-tertiary, #ffffff); } :host([has-media]) button { padding-top: var(--lmvz-dimension-16-18, clamp(1rem, 0.97rem + 0.13vw, 1.13rem)); padding-bottom: var(--lmvz-dimension-12-14, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem)); padding-inline: var(--lmvz-dimension-40-48, clamp(2.5rem, 2.38rem + 0.52vw, 3rem)); border-radius: var(--lmvz-semantic-border-radius-lg, 14px); } :host([has-media]) button:hover { --lmvz-tab-color: var(--lmvz-semantic-color-int-on-tertiary-hover, #000000); } :host([has-media]) button:active { --lmvz-tab-color: var(--lmvz-semantic-color-int-on-tertiary-active, #000000); } :host([selected]) button { --lmvz-tab-color: var(--lmvz-semantic-color-status-on-active, #0e7ab4); --lmvz-tab-background: var(--lmvz-semantic-color-status-active, #f6fbfe); } :host([selected][has-media]) button:hover, :host([selected][has-media]) button:active { --lmvz-tab-color: var(--lmvz-semantic-color-status-on-active, #0e7ab4); } .indicator { --lmvz-tab-indicator-size: 4px; position: absolute; background: linear-gradient(to right, var(--lmvz-semantic-color-gradient-main-1, #0e7ab4), var(--lmvz-semantic-color-gradient-main-2, #0e7ab4)); opacity: 0; transition: opacity 0.15s ease; inset-block-end: 0; inset-inline: 0; block-size: var(--lmvz-tab-indicator-size); border-start-start-radius: 0; border-start-end-radius: 0; border-end-start-radius: var(--lmvz-tab-indicator-size); border-end-end-radius: var(--lmvz-tab-indicator-size); } :host([selected][has-media]) .indicator { opacity: 1; } :host([vertical]) button { border-radius: var(--lmvz-semantic-border-radius-round, 999px); } :host([vertical]) .indicator { inset-block: 0; inset-inline: 0 auto; inline-size: var(--lmvz-tab-indicator-size); block-size: auto; border-radius: 0 var(--lmvz-tab-indicator-size) var(--lmvz-tab-indicator-size) 0; background: linear-gradient(to bottom, var(--lmvz-semantic-color-gradient-main-1, #0e7ab4), var(--lmvz-semantic-color-gradient-main-2, #0e7ab4)); } ::slotted(*) { --lmvz-component-color: var(--lmvz-tab-color); } ::slotted(lmvz-icon) { --lmvz-component-size: var(--lmvz-dimension-16-18, clamp(1rem, 0.97rem + 0.13vw, 1.13rem)); } :host([has-media]) ::slotted(lmvz-icon) { --lmvz-component-size: var(--lmvz-component-icon-size-lg, clamp(1.5rem, 1.44rem + 0.26vw, 1.75rem)); } .label { display: contents; } `;
10216
10328
 
10217
10329
  class LmvzTab {
10218
10330
  constructor(hostRef) {
@@ -10232,7 +10344,7 @@ class LmvzTab {
10232
10344
  this.el.dispatchEvent(new CustomEvent('lmvzTabReady', { bubbles: true, composed: false }));
10233
10345
  }
10234
10346
  render() {
10235
- return (hAsync(Host, { key: '029e9118ac6a5c886b4385684e6a499510821963' }, hAsync("button", { key: '4c4534d098e56a3576ffcecd4b5d84245ee561ae', part: "button", role: "tab", disabled: this.disabled, "aria-selected": String(this.selected), "aria-disabled": this.disabled ? 'true' : undefined, tabIndex: 0 }, hAsync("slot", { key: '9975229f818c544a5d682773459e9c507911efd2', name: "media", ref: (el) => (this.mediaSlotEl = el), onSlotchange: this.handleMediaSlotChange }), hAsync("span", { key: 'ec1543971f4be58200aec0109cbbc2942b18291f', class: "label" }, hAsync("slot", { key: '9a83be2812e15201b2bb6b1adc0c71de4df5c3be' })), hAsync("span", { key: '575f44d75a032bc66be87999e47e2897898b6bce', "aria-hidden": "true", part: "indicator", class: "indicator" }))));
10347
+ return (hAsync(Host, { key: '642a74020dfe8e3f96ebbdf8067b1eba5c07bd15' }, hAsync("button", { key: 'b786b259aed2f2e1f61f3ef14959f564841b3761', part: "button", role: "tab", disabled: this.disabled, "aria-selected": String(this.selected), "aria-disabled": this.disabled ? 'true' : undefined, tabIndex: 0 }, hAsync("slot", { key: 'e29265a24673c39397266ef21419cebdf9a05a2c', name: "media", ref: (el) => (this.mediaSlotEl = el), onSlotchange: this.handleMediaSlotChange }), hAsync("span", { key: 'c74ae843e36f85291e404955056ba1f34d0393e7', class: "label" }, hAsync("slot", { key: '0f13548f3ec10a126016bfc92aa93a4c21b86e0f' })), hAsync("span", { key: '2f969a70550975bffd1884a55b12fec733331b01', "aria-hidden": "true", part: "indicator", class: "indicator" }))));
10236
10348
  }
10237
10349
  static get delegatesFocus() { return true; }
10238
10350
  static get style() { return lmvzTabCss(); }
@@ -10251,7 +10363,7 @@ class LmvzTab {
10251
10363
  }; }
10252
10364
  }
10253
10365
 
10254
- const lmvzTabsCss = () => ` @layer lmvz-ds.reset, lmvz-ds.theme, lmvz-ds.components, lmvz-ds.overrides; @layer lmvz-ds.reset { body { margin: 0; } h1, h2, h3, h4, h5, h6 { margin: 0; } *[hidden] { display: none !important; } } :host { display: inline-block; } .tablist { display: inline-flex; flex-direction: row; background: var(--lmvz-semantic-color-int-secondary, #f0f0f0); border-radius: var(--lmvz-semantic-border-radius-round, 999px); overflow: auto hidden; scrollbar-width: none; } .tablist::-webkit-scrollbar { display: none; } :host([has-icon-tabs]) .tablist { gap: var(--lmvz-dimension-6-8, clamp(0.38rem, 0.34rem + 0.13vw, 0.5rem)); background: none; border-radius: 0; } :host([orientation='vertical']) .tablist { flex-direction: column; overflow: visible auto; } ::slotted([role='tabpanel']) { display: block; } ::slotted([role='tabpanel'][hidden]) { display: none; } `;
10366
+ const lmvzTabsCss = () => ` @layer lmvz-ds.reset, lmvz-ds.theme, lmvz-ds.components, lmvz-ds.overrides; @layer lmvz-ds.reset { body { margin: 0; } h1, h2, h3, h4, h5, h6 { margin: 0; } *[hidden] { display: none !important; } hr { height: 0; border: none; margin: var(--lmvz-dimension-4-8, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem)) 0; border-top: var(--lmvz-semantic-border-width-default, 1px) solid var(--lmvz-semantic-color-border-subtle, #f0f0f0); } } :host { display: inline-block; } .tablist { display: inline-flex; flex-direction: row; background: var(--lmvz-semantic-color-int-secondary, #f0f0f0); border-radius: var(--lmvz-semantic-border-radius-round, 999px); overflow: auto hidden; scrollbar-width: none; } .tablist::-webkit-scrollbar { display: none; } :host([has-icon-tabs]) .tablist { gap: var(--lmvz-dimension-6-8, clamp(0.38rem, 0.34rem + 0.13vw, 0.5rem)); background: none; border-radius: 0; } :host([orientation='vertical']) .tablist { flex-direction: column; overflow: visible auto; } ::slotted([role='tabpanel']) { display: block; } ::slotted([role='tabpanel'][hidden]) { display: none; } `;
10255
10367
 
10256
10368
  let tabsIdCounter = 0;
10257
10369
  class LmvzTabs extends ReactiveControllerHost {
@@ -10486,7 +10598,7 @@ class LmvzTabs extends ReactiveControllerHost {
10486
10598
  this.selectTab(value);
10487
10599
  };
10488
10600
  render() {
10489
- return (hAsync(Host, { key: '80f6d4afd1263097082045b76cd408550b75342b', onClick: this.handleTabClick, onKeydown: this.handleKeydown }, hAsync("div", { key: '01c3a160ef58be9b3db2bece29aadd68b482cf7d', role: "tablist", "aria-orientation": this.orientation, class: "tablist" }, hAsync("slot", { key: 'e685b913198f0649b3d2d33002f143ee133bff26', ref: (el) => (this.tabSlotEl = el) })), hAsync("div", { key: '44543341ad8a536572f96d35f02f0455f8ca92dd', part: "panels-container", class: "panels-container" }, hAsync("slot", { key: '6eaf6cd054947050b8f6d8ae8adbab9bd09a0e2f', name: "panels", ref: (el) => (this.panelSlotEl = el) }))));
10601
+ return (hAsync(Host, { key: '0247aeab4ec148274ab25c78a5444d14c1b70d89', onClick: this.handleTabClick, onKeydown: this.handleKeydown }, hAsync("div", { key: 'aa8baa8e55f84ee0fa75ce02a172adebfe4fefcd', role: "tablist", "aria-orientation": this.orientation, class: "tablist" }, hAsync("slot", { key: 'b626f8dc73503c5013fa2e0a7623752eeb6f733f', ref: (el) => (this.tabSlotEl = el) })), hAsync("div", { key: '230e7cc4686d643e8562aa93db6b2a3e94fccb5f', part: "panels-container", class: "panels-container" }, hAsync("slot", { key: '713f88911b7cb14d3487d0945aac818b6727dee7', name: "panels", ref: (el) => (this.panelSlotEl = el) }))));
10490
10602
  }
10491
10603
  static get watchers() { return {
10492
10604
  "value": [{
@@ -10590,7 +10702,7 @@ class LmvzToggle extends ReactiveControllerHost {
10590
10702
  this.lmvzChange.emit(newChecked);
10591
10703
  };
10592
10704
  render() {
10593
- return (hAsync(Host, { key: '9d746374179fbaed3d3321c4c522574b7ff31eb3' }, hAsync("span", { key: 'bd5abbf7d15ab6588858a97b20daa9bad4d9fe1b', class: "track" }, hAsync("input", { key: 'c008a5f3642bdcf809c3d750e6333d0910804328', type: "checkbox", role: "switch", id: this.toggleId, checked: this.checked, disabled: this.disabled, required: this.required, name: this.name, value: this.value, form: this.form, ref: (el) => (this.nativeInputElement = el), onChange: this.handleChange }), hAsync("span", { key: '2e48780cb75db4a244c08afacdfc07cd70a4da04', class: "thumb", "aria-hidden": "true" })), hAsync("label", { key: '285570e98d7b8b3efc01e531ea015dc3563b0b28', htmlFor: this.toggleId }, this.label)));
10705
+ return (hAsync(Host, { key: '56c73859d7eeb40842744a29392598678268d7e8' }, hAsync("span", { key: '145915fb9d77976328c39c00e7ef73426220b3ca', class: "track" }, hAsync("input", { key: '4363e8e3a614ce18da19abc70257b82363b291da', type: "checkbox", role: "switch", id: this.toggleId, checked: this.checked, disabled: this.disabled, required: this.required, name: this.name, value: this.value, form: this.form, ref: (el) => (this.nativeInputElement = el), onChange: this.handleChange }), hAsync("span", { key: '794ef6a50e8442dd1c460df7c42ffcf3009aab15', class: "thumb", "aria-hidden": "true" })), hAsync("label", { key: '9432dc73d637ea8dbeb5c3b3ff8d0941c662f707', htmlFor: this.toggleId }, this.label)));
10594
10706
  }
10595
10707
  static get formAssociated() { return true; }
10596
10708
  static get watchers() { return {
@@ -10627,6 +10739,7 @@ class LmvzToggle extends ReactiveControllerHost {
10627
10739
 
10628
10740
  registerComponents([
10629
10741
  LmvzAction,
10742
+ LmvzActionList,
10630
10743
  LmvzButton,
10631
10744
  LmvzButtonGroup,
10632
10745
  LmvzCard,