@lmvz-ds/components 0.22.1 → 0.24.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 (113) hide show
  1. package/CHANGELOG.md +13 -0
  2. package/cjs/{aria-loader-Cec1zR2g.js → aria-loader-BRo2FTGh.js} +1 -0
  3. package/cjs/index.cjs.js +1 -1
  4. package/cjs/lmvz-button_3.cjs.entry.js +375 -0
  5. package/cjs/lmvz-card.cjs.entry.js +2 -2
  6. package/cjs/lmvz-checkbox.cjs.entry.js +4 -4
  7. package/cjs/lmvz-chip.cjs.entry.js +3 -3
  8. package/cjs/lmvz-components.cjs.js +1 -1
  9. package/cjs/lmvz-header_2.cjs.entry.js +3 -3
  10. package/cjs/lmvz-input.cjs.entry.js +5 -5
  11. package/cjs/lmvz-menuitem.cjs.entry.js +4 -4
  12. package/cjs/lmvz-modal.cjs.entry.js +6 -109
  13. package/cjs/lmvz-select.cjs.entry.js +4 -4
  14. package/cjs/lmvz-toggle.cjs.entry.js +4 -4
  15. package/cjs/loader.cjs.js +1 -1
  16. package/cjs/{reactive-controller-host-DnSTWHCF.js → reactive-controller-host-BOFg4vL-.js} +1 -1
  17. package/collection/collection-manifest.json +1 -0
  18. package/collection/components/lmvz-button/lmvz-button.css +60 -41
  19. package/collection/components/lmvz-button/lmvz-button.js +6 -7
  20. package/collection/components/lmvz-button-group/lmvz-button-group.css +14 -0
  21. package/collection/components/lmvz-button-group/lmvz-button-group.js +216 -0
  22. package/collection/components/lmvz-card/lmvz-card.css +59 -40
  23. package/collection/components/lmvz-card/lmvz-card.js +1 -1
  24. package/collection/components/lmvz-checkbox/lmvz-checkbox.css +12 -8
  25. package/collection/components/lmvz-checkbox/lmvz-checkbox.js +1 -1
  26. package/collection/components/lmvz-chip/lmvz-chip.js +1 -1
  27. package/collection/components/lmvz-header/lmvz-header.js +1 -1
  28. package/collection/components/lmvz-icon/lmvz-icon.js +1 -1
  29. package/collection/components/lmvz-input/lmvz-input.css +12 -8
  30. package/collection/components/lmvz-input/lmvz-input.js +2 -2
  31. package/collection/components/lmvz-menuitem/lmvz-menuitem.css +12 -8
  32. package/collection/components/lmvz-menuitem/lmvz-menuitem.js +1 -1
  33. package/collection/components/lmvz-modal/lmvz-modal.css +36 -38
  34. package/collection/components/lmvz-modal/lmvz-modal.js +4 -108
  35. package/collection/components/lmvz-select/lmvz-select.css +12 -8
  36. package/collection/components/lmvz-select/lmvz-select.js +1 -1
  37. package/collection/components/lmvz-toggle/lmvz-toggle.css +12 -8
  38. package/collection/components/lmvz-toggle/lmvz-toggle.js +1 -1
  39. package/collection/integration/header-integration/header-integration.js +1 -1
  40. package/components/index.d.ts +2 -0
  41. package/components/index.d.ts.bak +2 -0
  42. package/components/index.js +1 -1
  43. package/components/lmvz-button-group.d.ts +11 -0
  44. package/components/lmvz-button-group.d.ts.bak +11 -0
  45. package/components/lmvz-button-group.js +1 -0
  46. package/components/lmvz-button.js +1 -1
  47. package/components/lmvz-card.js +1 -1
  48. package/components/lmvz-checkbox.js +1 -1
  49. package/components/lmvz-chip.js +1 -1
  50. package/components/lmvz-header.js +1 -1
  51. package/components/lmvz-icon.js +1 -1
  52. package/components/lmvz-input.js +1 -1
  53. package/components/lmvz-menuitem.js +1 -1
  54. package/components/lmvz-modal.js +1 -1
  55. package/components/lmvz-select.js +1 -1
  56. package/components/lmvz-toggle.js +1 -1
  57. package/components/p-CcnyKhAw.js +1 -0
  58. package/components/p-CdDO7mQa.js +1 -0
  59. package/components/p-Cg2XX_J-.js +1 -0
  60. package/components/p-DSvYtVoD.js +1 -0
  61. package/components/p-slgmfnHm.js +1 -0
  62. package/esm/{aria-loader-BVolm0lC.js → aria-loader-GfsGHZHY.js} +1 -1
  63. package/esm/index.js +1 -1
  64. package/esm/lmvz-button_3.entry.js +371 -0
  65. package/esm/lmvz-card.entry.js +2 -2
  66. package/esm/lmvz-checkbox.entry.js +4 -4
  67. package/esm/lmvz-chip.entry.js +3 -3
  68. package/esm/lmvz-components.js +1 -1
  69. package/esm/lmvz-header_2.entry.js +3 -3
  70. package/esm/lmvz-input.entry.js +5 -5
  71. package/esm/lmvz-menuitem.entry.js +4 -4
  72. package/esm/lmvz-modal.entry.js +6 -109
  73. package/esm/lmvz-select.entry.js +4 -4
  74. package/esm/lmvz-toggle.entry.js +4 -4
  75. package/esm/loader.js +1 -1
  76. package/esm/{reactive-controller-host-lF2kXM1x.js → reactive-controller-host-CroMsXdS.js} +1 -1
  77. package/hydrate/index.js +273 -189
  78. package/hydrate/index.mjs +273 -189
  79. package/lmvz-components/index.esm.js +1 -1
  80. package/lmvz-components/lmvz-components.esm.js +1 -1
  81. package/lmvz-components/p-2824a56b.entry.js +1 -0
  82. package/lmvz-components/p-4263c9b2.entry.js +1 -0
  83. package/lmvz-components/p-4f5c3c4a.entry.js +1 -0
  84. package/lmvz-components/p-6f8cbc4f.entry.js +1 -0
  85. package/lmvz-components/p-88adb9fa.entry.js +1 -0
  86. package/lmvz-components/{p-DCTzMRMQ.js → p-BRl6zKXT.js} +1 -1
  87. package/lmvz-components/p-CdDO7mQa.js +1 -0
  88. package/lmvz-components/p-a7c3074a.entry.js +1 -0
  89. package/lmvz-components/p-b3b04d46.entry.js +1 -0
  90. package/lmvz-components/p-d1dacf7e.entry.js +1 -0
  91. package/lmvz-components/{p-d984e118.entry.js → p-f6d1d9df.entry.js} +1 -1
  92. package/lmvz-components/p-fefefc54.entry.js +1 -0
  93. package/manifest.json +111 -12
  94. package/package.json +5 -1
  95. package/types/components/lmvz-button/lmvz-button.d.ts +1 -1
  96. package/types/components/lmvz-button-group/lmvz-button-group.d.ts +20 -0
  97. package/types/components/lmvz-modal/lmvz-modal.d.ts +1 -16
  98. package/types/components.d.ts +27 -3
  99. package/cjs/lmvz-button_2.cjs.entry.js +0 -198
  100. package/components/p-Boj0PCdB.js +0 -1
  101. package/components/p-Cc6dOWwS.js +0 -1
  102. package/components/p-DBc1BzQb.js +0 -1
  103. package/esm/lmvz-button_2.entry.js +0 -195
  104. package/lmvz-components/p-08a08b63.entry.js +0 -1
  105. package/lmvz-components/p-1b181e90.entry.js +0 -1
  106. package/lmvz-components/p-23fb2476.entry.js +0 -1
  107. package/lmvz-components/p-6bb145e4.entry.js +0 -1
  108. package/lmvz-components/p-7a310b1e.entry.js +0 -1
  109. package/lmvz-components/p-b7940687.entry.js +0 -1
  110. package/lmvz-components/p-db8306a5.entry.js +0 -1
  111. package/lmvz-components/p-dhVSUYqd.js +0 -1
  112. package/lmvz-components/p-ea335543.entry.js +0 -1
  113. package/lmvz-components/p-f8ea0eb2.entry.js +0 -1
@@ -0,0 +1,371 @@
1
+ import { g as getElement, r as registerInstance, c as createEvent, h, H as Host } from './index-Aa_425iY.js';
2
+ import { c as classNames } from './index-BfTCfPZ1.js';
3
+ import { R as ReactiveControllerHost, A as AriaValidationController } from './reactive-controller-host-CroMsXdS.js';
4
+ import { E as ElementActivationController } from './element-activation-controller-CN0JX9-m.js';
5
+ import { i as inheritAriaAttributes, f as findFormByRef, a as canReceiveFocus } from './component-DOTK1OW3.js';
6
+ import { a as isPromise, i as isAriaValidationEnabled } from './aria-loader-GfsGHZHY.js';
7
+ import { p as parseSvgString } from './svg-B2YoIRuh.js';
8
+ import { a as resolveIconSvg } from './icons-CmuFKDRz.js';
9
+ import './logger-CGmJG63p.js';
10
+
11
+ 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.4 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: 2px solid var(--lmvz-semantic-color-border-active, #0f8acc); outline-offset: 2px; } 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, #545454); } 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.34rem + 0.13vw, 0.5rem)); --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.75rem, 0.73rem + 0.06vw, 0.81rem) / 1.4 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.72rem + 0.13vw, 0.88rem)); --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.4 Router); } display: inline-block; } ::slotted(*) { --lmvz-component-color: var(--lmvz-button-color); } `;
12
+
13
+ const LmvzButton = class extends ReactiveControllerHost {
14
+ get el() { return getElement(this); }
15
+ validationEl;
16
+ inheritedAttributes = {};
17
+ formEl = null;
18
+ formButtonEl = null;
19
+ lmvzActivation;
20
+ get ti() {
21
+ return 0;
22
+ }
23
+ scale = 'default';
24
+ variant;
25
+ disabled = false;
26
+ type = 'button';
27
+ form;
28
+ formMethod;
29
+ name;
30
+ value;
31
+ constructor(hostRef) {
32
+ super();
33
+ registerInstance(this, hostRef);
34
+ this.lmvzActivation = createEvent(this, "lmvzActivation", 7);
35
+ this.addController(new AriaValidationController(this));
36
+ this.addController(new ElementActivationController(this, {
37
+ localHandler: this.handleClick.bind(this),
38
+ keys: ['Enter'],
39
+ }));
40
+ }
41
+ connectedCallback() {
42
+ this.inheritedAttributes = inheritAriaAttributes(this.el);
43
+ super.connectedCallback();
44
+ }
45
+ disconnectedCallback() {
46
+ this.formButtonEl?.remove();
47
+ this.formButtonEl = null;
48
+ this.formEl = null;
49
+ super.disconnectedCallback();
50
+ }
51
+ renderHiddenButton() {
52
+ if (this.type !== 'submit') {
53
+ this.formButtonEl?.remove();
54
+ this.formButtonEl = null;
55
+ this.formEl = null;
56
+ return;
57
+ }
58
+ const formEl = findFormByRef(this.form, this.el);
59
+ if (!formEl) {
60
+ this.formButtonEl?.remove();
61
+ this.formButtonEl = null;
62
+ this.formEl = null;
63
+ return;
64
+ }
65
+ this.formEl = formEl;
66
+ const formButtonEl = this.formButtonEl ?? document.createElement('button');
67
+ formButtonEl.type = 'submit';
68
+ formButtonEl.style.display = 'none';
69
+ formButtonEl.disabled = this.disabled;
70
+ formButtonEl.name = this.name ?? '';
71
+ formButtonEl.value = this.value ?? '';
72
+ if (this.formMethod) {
73
+ formButtonEl.setAttribute('formmethod', this.formMethod);
74
+ }
75
+ else {
76
+ formButtonEl.removeAttribute('formmethod');
77
+ }
78
+ if (this.formButtonEl !== formButtonEl) {
79
+ this.formButtonEl = formButtonEl;
80
+ }
81
+ if (formButtonEl.parentElement !== formEl) {
82
+ formButtonEl.remove();
83
+ formEl.appendChild(formButtonEl);
84
+ }
85
+ }
86
+ submitForm(ev) {
87
+ if (this.formEl && this.formButtonEl) {
88
+ ev.preventDefault();
89
+ this.formButtonEl.click();
90
+ }
91
+ }
92
+ handleClick = (ev) => {
93
+ if (this.type === 'submit') {
94
+ this.submitForm(ev);
95
+ }
96
+ };
97
+ render() {
98
+ this.renderHiddenButton();
99
+ return (h(Host, { key: '8196de85afc3878c6f38e582d7c031f5d19bcd36', "aria-disabled": this.disabled ? 'true' : null }, h("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 }, h("slot", { key: '18e91a2f94ba0d7e5cf13150191003e2f0b2a03a' }))));
100
+ }
101
+ static get delegatesFocus() { return true; }
102
+ };
103
+ LmvzButton.style = lmvzButtonCss();
104
+
105
+ /**
106
+ * Returns a function that delegates to the given predicate/filter and negates its result.
107
+ * The returned function preserves the input function's types, arguments and timing.
108
+ *
109
+ * @param delegate - The predicate/filter function to negate.
110
+ * @returns A function that returns the negated result.
111
+ */
112
+ function negate(delegate) {
113
+ return (...args) => {
114
+ const result = delegate(...args);
115
+ return isPromise(result) ? result.then((res) => !res) : !result;
116
+ };
117
+ }
118
+
119
+ 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.4 Router);flex-wrap:wrap}::slotted([hidden]){display:none !important}`;
120
+
121
+ const LmvzButtonGroup = class {
122
+ constructor(hostRef) {
123
+ registerInstance(this, hostRef);
124
+ }
125
+ actionsSlot;
126
+ validationMessageCache = [];
127
+ actionsStateObserver;
128
+ get primaryEnabledAction() {
129
+ return this.enabledButtons.find(isPrimaryAction) ?? this.enabledButtons[0];
130
+ }
131
+ get hasActions() {
132
+ return this.assignedButtons.some((element) => isVisible(element) && isActionButton(element) && !isDisabledButton(element));
133
+ }
134
+ componentDidLoad() {
135
+ this.handleActionsSlotChange();
136
+ }
137
+ disconnectedCallback() {
138
+ this.actionsStateObserver?.disconnect();
139
+ }
140
+ get assignedElements() {
141
+ return this.actionsSlot?.assignedElements({ flatten: true }) ?? [];
142
+ }
143
+ get assignedButtons() {
144
+ return this.assignedElements.filter(isActionButton);
145
+ }
146
+ get visibleButtons() {
147
+ return this.assignedButtons.filter(isVisible);
148
+ }
149
+ get enabledButtons() {
150
+ return this.visibleButtons.filter(negate(isDisabledButton));
151
+ }
152
+ getActionValidationResult() {
153
+ if (!this.visibleButtons.length) {
154
+ return [];
155
+ }
156
+ const primaryActions = this.visibleButtons.filter(isPrimaryAction);
157
+ const secondaryActions = this.visibleButtons.filter(isSecondaryAction);
158
+ const issues = [];
159
+ const order = this.visibleButtons.toReversed();
160
+ if (primaryActions.length !== 1)
161
+ issues.push('LmvzModal actions slot must contain exactly one primary action.');
162
+ if (secondaryActions.length > 1)
163
+ issues.push(`LmvzModal actions slot must contain at most one secondary action (received ${secondaryActions.length})`);
164
+ if (primaryActions.length) {
165
+ const primaryAction = primaryActions[0];
166
+ const secondaryAction = secondaryActions[0];
167
+ if (order.indexOf(primaryAction) !== 0)
168
+ issues.push('Primary action must be the last focusable element in the actions slot (i.e. rightmost button).');
169
+ if (secondaryAction && order.indexOf(secondaryAction) !== 1)
170
+ issues.push('Secondary action must be the second-to-last focusable element in the actions slot (i.e. left of primary button).');
171
+ }
172
+ else if (secondaryActions.length) {
173
+ const secondaryAction = secondaryActions[0];
174
+ if (order.indexOf(secondaryAction) !== 0)
175
+ issues.push('Secondary action must be the last focusable element in the actions slot when no primary action is present (i.e. rightmost button).');
176
+ }
177
+ return issues;
178
+ }
179
+ handleActionsSlotChange = () => {
180
+ this.observeActionState();
181
+ this.syncActionsState();
182
+ };
183
+ observeActionState() {
184
+ if (typeof MutationObserver === 'undefined')
185
+ return;
186
+ this.actionsStateObserver?.disconnect();
187
+ if (!this.assignedButtons.length)
188
+ return;
189
+ this.actionsStateObserver = new MutationObserver(() => {
190
+ this.syncActionsState();
191
+ });
192
+ this.assignedButtons.forEach((element) => {
193
+ this.actionsStateObserver?.observe(element, {
194
+ attributes: true,
195
+ attributeFilter: ['disabled', 'hidden', 'variant'],
196
+ });
197
+ });
198
+ }
199
+ syncActionsState() {
200
+ const assignedElements = this.assignedElements;
201
+ assignedElements.forEach((element) => {
202
+ const isAllowedAction = ['LMVZ-BUTTON', 'BUTTON'].includes(element.tagName.toUpperCase());
203
+ if (isAllowedAction)
204
+ return;
205
+ if (!element.hasAttribute('hidden')) {
206
+ element.setAttribute('hidden', '');
207
+ }
208
+ if (element.getAttribute('aria-hidden') !== 'true') {
209
+ element.setAttribute('aria-hidden', 'true');
210
+ }
211
+ });
212
+ this.checkActions();
213
+ const length = this.visibleButtons.length;
214
+ for (let i = 0; i < length; i++) {
215
+ const variant = i === length - 1 ? 'primary' : i === length - 2 ? 'secondary' : 'tertiary';
216
+ const element = this.visibleButtons.at(i);
217
+ if (!element)
218
+ continue;
219
+ if (isLmvzButton(element)) {
220
+ if (!element.getAttribute('variant'))
221
+ element.setAttribute('variant', variant);
222
+ }
223
+ else {
224
+ element.classList.add(variant);
225
+ }
226
+ }
227
+ this.focusPrimaryAction();
228
+ }
229
+ focusPrimaryAction() {
230
+ const focusTarget = this.primaryEnabledAction;
231
+ if (!focusTarget || typeof window === 'undefined')
232
+ return;
233
+ window.requestAnimationFrame(() => {
234
+ if (canReceiveFocus(focusTarget)) {
235
+ focusTarget.focus();
236
+ }
237
+ });
238
+ }
239
+ checkActions() {
240
+ if (!isAriaValidationEnabled())
241
+ return;
242
+ const issues = this.getActionValidationResult();
243
+ if (!issues.length) {
244
+ return;
245
+ }
246
+ issues.forEach((issue) => {
247
+ if (this.validationMessageCache.includes(issue))
248
+ return;
249
+ console.warn(issue);
250
+ this.validationMessageCache.push(issue);
251
+ });
252
+ }
253
+ render() {
254
+ return (h(Host, { key: '56b60821ecaa2301d13e78d621e873aa74cd170e' }, h("slot", { key: 'e6a1422950fa5b0026356b7788a607a690116186', ref: (element) => (this.actionsSlot = element), onSlotchange: this.handleActionsSlotChange })));
255
+ }
256
+ };
257
+ function isActionButton(element) {
258
+ return ['LMVZ-BUTTON', 'BUTTON'].includes(element.tagName.toUpperCase());
259
+ }
260
+ function isLmvzButton(element) {
261
+ return element?.tagName.toUpperCase() === 'LMVZ-BUTTON';
262
+ }
263
+ function isDisabledButton(element) {
264
+ return element.hasAttribute('disabled') || element.disabled === true;
265
+ }
266
+ function isVisible(element) {
267
+ return !element.hasAttribute('hidden');
268
+ }
269
+ function getActionVariant(element) {
270
+ const variant = element.getAttribute('variant') ?? element.variant;
271
+ return variant === 'primary' || variant === 'secondary' || variant === 'tertiary' ? variant : 'secondary';
272
+ }
273
+ function isPrimaryAction(element) {
274
+ return getActionVariant(element) === 'primary';
275
+ }
276
+ function isSecondaryAction(element) {
277
+ return getActionVariant(element) === 'secondary';
278
+ }
279
+ LmvzButtonGroup.style = lmvzButtonGroupCss();
280
+
281
+ const lmvzIconCss = () => `.sc-lmvz-icon-h{--lmvz-icon-color:var(--lmvz-component-color, var(--lmvz-semantic-color-on-surface-input-primary, #000000));--lmvz-icon-size:var(--lmvz-component-size, var(--lmvz-component-icon-size-md, clamp(1rem, 0.94rem + 0.26vw, 1.25rem)));display:inline-block;line-height:0;svg{display:block;height:var(--lmvz-icon-size);width:auto}svg path{stroke:var(--lmvz-icon-color);fill:none}}[size='xs'].sc-lmvz-icon-h{svg{--lmvz-icon-size:var(--lmvz-component-icon-size-xs, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem))}}[size='sm'].sc-lmvz-icon-h{svg{--lmvz-icon-size:var(--lmvz-component-icon-size-sm, clamp(0.88rem, 0.84rem + 0.13vw, 1rem))}}[size='md'].sc-lmvz-icon-h{svg{--lmvz-icon-size:var(--lmvz-component-icon-size-md, clamp(1rem, 0.94rem + 0.26vw, 1.25rem))}}[size='lg'].sc-lmvz-icon-h{svg{--lmvz-icon-size:var(--lmvz-component-icon-size-lg, clamp(1.5rem, 1.44rem + 0.26vw, 1.75rem))}}[size='inherit'].sc-lmvz-icon-h{svg{height:var(--lmvz-component-size, inherit)}}[weight='light'].sc-lmvz-icon-h{svg path{stroke-width:1}}[weight='medium'].sc-lmvz-icon-h{svg path{stroke-width:1.5}}[weight='bold'].sc-lmvz-icon-h{svg path{stroke-width:2}}[weight='filled'].sc-lmvz-icon-h{svg path{stroke-width:2;fill:var(--lmvz-icon-color)}}`;
282
+
283
+ const LmvzIcon = class extends ReactiveControllerHost {
284
+ intersectionObserver;
285
+ ariaValidationController = new AriaValidationController(this);
286
+ get el() { return getElement(this); }
287
+ validationEl;
288
+ icon;
289
+ weight = 'medium';
290
+ size = 'md';
291
+ iconset;
292
+ iconData;
293
+ visible = false;
294
+ ariaLabel;
295
+ get ariaHidden() {
296
+ return !this.ariaLabel;
297
+ }
298
+ constructor(hostRef) {
299
+ super();
300
+ registerInstance(this, hostRef);
301
+ this.addController(this.ariaValidationController);
302
+ }
303
+ connectedCallback() {
304
+ this.waitUntilVisible(() => {
305
+ this.visible = true;
306
+ this.loadIconPathData();
307
+ });
308
+ super.connectedCallback();
309
+ }
310
+ disconnectedCallback() {
311
+ if (this.intersectionObserver && typeof this.intersectionObserver.disconnect === 'function') {
312
+ this.intersectionObserver.disconnect();
313
+ }
314
+ this.intersectionObserver = undefined;
315
+ super.disconnectedCallback();
316
+ }
317
+ async loadIconPathData() {
318
+ const { icon, iconset, visible } = this;
319
+ if (!icon || !visible) {
320
+ return;
321
+ }
322
+ const maybeIcon = parseSvgString(icon);
323
+ if (maybeIcon) {
324
+ this.iconData = maybeIcon;
325
+ return;
326
+ }
327
+ this.iconData = await resolveIconSvg({
328
+ icon,
329
+ iconset,
330
+ });
331
+ }
332
+ componentDidRender() {
333
+ this.validationEl = this.el.querySelector('svg');
334
+ this.ariaValidationController.revalidateAria();
335
+ super.componentDidRender();
336
+ }
337
+ render() {
338
+ return h(Host, { key: '03b4391d02a77409257bcda51c2b65ad9a9e0a0c', role: "img", "aria-hidden": `${this.ariaHidden}`, innerHTML: this.iconData });
339
+ }
340
+ waitUntilVisible(callback, rootMargin = 50) {
341
+ if (typeof window === 'undefined' || !window.IntersectionObserver) {
342
+ callback();
343
+ return;
344
+ }
345
+ this.intersectionObserver = new IntersectionObserver((entries) => {
346
+ entries.some((entry) => {
347
+ if (entry.isIntersecting) {
348
+ if (this.intersectionObserver && typeof this.intersectionObserver.disconnect === 'function') {
349
+ this.intersectionObserver.disconnect();
350
+ }
351
+ this.intersectionObserver = undefined;
352
+ callback();
353
+ return true;
354
+ }
355
+ return false;
356
+ });
357
+ }, { rootMargin: `${rootMargin}px` });
358
+ this.intersectionObserver.observe(this.el);
359
+ }
360
+ static get watchers() { return {
361
+ "icon": [{
362
+ "loadIconPathData": 0
363
+ }],
364
+ "iconset": [{
365
+ "loadIconPathData": 0
366
+ }]
367
+ }; }
368
+ };
369
+ LmvzIcon.style = lmvzIconCss();
370
+
371
+ export { LmvzButton as lmvz_button, LmvzButtonGroup as lmvz_button_group, LmvzIcon as lmvz_icon };
@@ -20,7 +20,7 @@ function joinPath(...parts) {
20
20
  return parts.filter(Boolean).join('/').replace('//', '/').replace('/./', '/');
21
21
  }
22
22
 
23
- 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('Router-Book'), url('/assets/fonts/Router-Book.woff') format('woff'), local('Router'); font-weight: 400 normal; } @font-face { font-family: Router; src: local('Router-Medium'), url('/assets/fonts/Router-Medium.woff') format('woff'), local('Router'); font-weight: 500; } @font-face { font-family: Router; src: local('Router-Bold'), url('/assets/fonts/Router-Bold.woff') format('woff'), local('Router'); font-weight: 700 bold; } } @layer lmvz-ds.reset { body { margin: 0; } h1, h2, h3, h4, h5, h6 { margin: 0; } } .sc-lmvz-card-h { button { --lmvz-button-color: var(--lmvz-component-color, var(--lmvz-semantic-color-int-on-primary, #ffffff)); --lmvz-button-padding-inline: var(--lmvz-button-padding, var(--lmvz-component-input-md-padding-x, clamp(0.75rem, 0.69rem + 0.26vw, 1rem))); --lmvz-button-padding-block: var(--lmvz-button-padding, var(--lmvz-component-input-md-padding-y, clamp(0.75rem, 0.69rem + 0.26vw, 1rem))); --lmvz-button-gap: var(--lmvz-component-input-md-gap-x, clamp(0.25rem, 0.16rem + 0.39vw, 0.63rem)); --lmvz-button-font: var(--lmvz-typography-body-lg, 400 clamp(1rem, 0.97rem + 0.13vw, 1.13rem) / 1.4 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-primary, #000000); 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); 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-semantic-border-width-default, 1px) solid var(--lmvz-semantic-color-status-on-active, #0e7ab4); outline-offset: var(--lmvz-component-input-sm-padding-x, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem)); } 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-primary-hover, #2e2e2e); } button:not([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: var(--lmvz-semantic-border-width-default, 1px); --lmvz-button-border-color: var(--lmvz-semantic-color-border-default, #e0e0e0); } button.secondary:not([disabled], .disabled):hover { --lmvz-button-background: var(--lmvz-semantic-color-int-secondary-hover, #e0e0e0); --lmvz-button-border-color: var(--lmvz-semantic-color-border-hover, #c7c7c7); } button.secondary:not([disabled], .disabled):active { --lmvz-button-background: var(--lmvz-semantic-color-int-secondary-active, #d4d4d4); --lmvz-button-border-color: var(--lmvz-semantic-color-border-active, #0f8acc); } button.tertiary { --lmvz-button-background: var(--lmvz-semantic-color-int-tertiary, #ffffff); --lmvz-button-color: var(--lmvz-semantic-color-int-on-tertiary, #545454); } button.tertiary:not([disabled], .disabled):hover { --lmvz-button-background: var(--lmvz-semantic-color-int-tertiary-hover, #f0f0f0); } button.tertiary:not([disabled], .disabled):active { --lmvz-button-background: var(--lmvz-semantic-color-int-tertiary-active, #e0e0e0); } button.small { --lmvz-button-padding-inline: var(--lmvz-component-input-sm-padding-x, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem)); --lmvz-button-padding-block: var(--lmvz-component-input-sm-padding-y, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem)); --lmvz-button-gap: var(--lmvz-component-input-sm-gap-x, clamp(0.25rem, 0.16rem + 0.39vw, 0.63rem)); --lmvz-button-font: var(--lmvz-typography-body-md, 400 clamp(0.88rem, 0.84rem + 0.13vw, 1rem) / 1.4 Router); } button.large { --lmvz-button-padding-inline: var(--lmvz-component-input-lg-padding-x, clamp(0.88rem, 0.78rem + 0.39vw, 1.25rem)); --lmvz-button-padding-block: var(--lmvz-component-input-lg-padding-y, clamp(0.88rem, 0.78rem + 0.39vw, 1.25rem)); --lmvz-button-gap: var(--lmvz-component-input-lg-gap-x, clamp(0.25rem, 0.16rem + 0.39vw, 0.63rem)); --lmvz-button-font: var(--lmvz-typography-body-lg, 400 clamp(1rem, 0.97rem + 0.13vw, 1.13rem) / 1.4 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.4 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.2 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.4 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; }`;
23
+ 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.4 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: 2px solid var(--lmvz-semantic-color-border-active, #0f8acc); outline-offset: 2px; } 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, #545454); } 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.34rem + 0.13vw, 0.5rem)); --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.75rem, 0.73rem + 0.06vw, 0.81rem) / 1.4 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.72rem + 0.13vw, 0.88rem)); --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.4 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.4 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.2 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.4 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; }`;
24
24
 
25
25
  const LmvzCard = class {
26
26
  constructor(hostRef) {
@@ -45,7 +45,7 @@ const LmvzCard = class {
45
45
  const imgStyle = {
46
46
  backgroundImage: `url(${this.imageUrl ?? this.fallbackImage})`,
47
47
  };
48
- return (h(Host, { key: '46c2832b4f90b9eb222749632bc7ad59cd645e10', role: "article" }, h("div", { key: 'cc387fe96cff2dd04c24f75cf838a2bf6f438279', class: "top" }, h("div", { key: 'f9a54a5f81378ef4265e1d74c36c78af002e8874', class: "image-wrapper", style: imgStyle }, h("div", { key: '76daed00408f7ae9ee46977637ddcd3d4f846380', class: "chip-slot" }, h("slot", { key: '6ad522ef7428166b876d0218ef8d801c4ef337f1', name: "chip" })))), h("div", { key: '9c9799668ac199cfecbe10061e271d70d70e2d07', class: "bottom" }, h("header", { key: '1bec743235bea5c7ab163225ffbd7bc6cf11f754' }, h("h2", { key: '06f8e14153328bc5ca920e71e09d9343047c440c', class: "title" }, this.cardTitle)), h("p", { key: '86b95db4e6464ca3236b4a03798013c3580819bf', class: "description" }, this.description), h("div", { key: '553dc998d5318a4730196baa0b9baff3a0a3369f', class: "actions" }, h("button", { key: '7532d01b46769198c23a1b1015c187fdefce146a', class: "primary", onClick: this._onPrimaryClick.bind(this), "data-testid": "primary" }, this.primaryActionLabel), h("button", { key: '633d679ae59b1896aa2a06e04b4564569cf27a7d', class: "tertiary", "aria-label": "More actions", onClick: this._onOverflowClick }, h("span", { key: 'b72c45f93d259502b9d7c5ffb19e292a53c60ec6', class: "icon-placeholder" }, "..."))))));
48
+ return (h(Host, { key: '2d9ecdeed986f142fb7ff477b56dece59549bbc7', role: "article" }, h("div", { key: '34fc9c3a1338b31ce73424e8c07c79a291ead85c', class: "top" }, h("div", { key: '1756e6b26d7f42499753c36ed0fc13755fe32bfe', class: "image-wrapper", style: imgStyle }, h("div", { key: 'cd8be8acc9e949092b6363024316d12d445a9fbc', class: "chip-slot" }, h("slot", { key: '26389ab3b7031b948ff1701857e6028446662cf5', name: "chip" })))), h("div", { key: '2fa61cd7bef437f15929ae39be7fa294e8778321', class: "bottom" }, h("header", { key: 'b237ca025e42a29f528f827dc3c83b3b0f9267c0' }, h("h2", { key: 'ffd0a509ba97acb75d4c15d0fd01eef08689a2a7', class: "title" }, this.cardTitle)), h("p", { key: 'c40bd5d5f7e41a0cebc2f7f9e572ba98cc892cc1', class: "description" }, this.description), h("div", { key: '7663f93b41ef1e798b464bd6ad75ca8a53c0667b', class: "actions" }, h("button", { key: '3348e6700aa1571183558ab8fe4f73393c1cc943', class: "primary", onClick: this._onPrimaryClick.bind(this), "data-testid": "primary" }, this.primaryActionLabel), h("button", { key: 'd3a12cdabbdd68c3b04e06984db44abd3bbd22ea', class: "tertiary", "aria-label": "More actions", onClick: this._onOverflowClick }, h("span", { key: '80e31e6b691e18d1b42a2b4831349c3abf8e02b0', class: "icon-placeholder" }, "..."))))));
49
49
  }
50
50
  static get assetsDirs() { return ["../../assets"]; }
51
51
  };
@@ -1,12 +1,12 @@
1
1
  import { g as getElement, r as registerInstance, c as createEvent, h, H as Host } from './index-Aa_425iY.js';
2
2
  import { t as toValidSvgStringWithFallback } from './svg-B2YoIRuh.js';
3
- import { R as ReactiveControllerHost, A as AriaValidationController } from './reactive-controller-host-lF2kXM1x.js';
3
+ import { R as ReactiveControllerHost, A as AriaValidationController } from './reactive-controller-host-CroMsXdS.js';
4
4
  import './logger-CGmJG63p.js';
5
- import './aria-loader-BVolm0lC.js';
5
+ import './aria-loader-GfsGHZHY.js';
6
6
 
7
7
  const checkmarkSvg = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iMTIiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIKICAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgYXJpYS1oaWRkZW49InRydWUiIGZvY3VzYWJsZT0iZmFsc2UiPgogICAgPHBhdGggZD0iTTMuNzUgMTIuNTYyNUw4LjgzMDc5IDE3LjYyNUwyMC40Mzc1IDYuMzc1IiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+';
8
8
 
9
- const lmvzCheckboxCss = () => `@layer lmvz-ds.reset, lmvz-ds.theme, lmvz-ds.components, lmvz-ds.overrides; @layer lmvz-ds.theme { @font-face { font-family: Router; src: local('Router-Book'), url('/assets/fonts/Router-Book.woff') format('woff'), local('Router'); font-weight: 400 normal; } @font-face { font-family: Router; src: local('Router-Medium'), url('/assets/fonts/Router-Medium.woff') format('woff'), local('Router'); font-weight: 500; } @font-face { font-family: Router; src: local('Router-Bold'), url('/assets/fonts/Router-Bold.woff') format('woff'), local('Router'); font-weight: 700 bold; } } .sc-lmvz-checkbox-h { display: inline-block; --checkbox-box-size: var(--lmvz-global-s18, 18px); --checkbox-border-radius: var(--lmvz-global-s4, 4px); --checkbox-bg: var(--lmvz-semantic-color-surface-input-primary, #ffffff); --checkbox-border-color: var(--lmvz-semantic-color-border-default, #e0e0e0); --checkbox-border-color-hover: var(--lmvz-semantic-color-border-hover, #c7c7c7); --checkbox-border-color-checked: var(--lmvz-semantic-color-border-active, #0f8acc); --checkbox-border-color-error: var(--lmvz-semantic-color-status-on-danger, #e52a31); --checkbox-wrapper-bg-hover: var(--lmvz-semantic-color-int-tertiary-hover, #f0f0f0); --checkbox-wrapper-bg-checked: var(--lmvz-semantic-color-status-active, #f1f9fe); --checkbox-ripple-bg: var(--lmvz-semantic-color-int-secondary-hover, #e0e0e0); --checkbox-checkmark-color: var(--lmvz-semantic-color-border-active, #0f8acc); --checkbox-label-color: var(--lmvz-semantic-color-on-surface-primary, #000000); --checkbox-label-color-checked: var(--lmvz-semantic-color-status-on-active, #0e7ab4); --checkbox-helper-color: var(--lmvz-semantic-color-on-surface-secondary, #7a7a7a); --checkbox-error-color: var(--lmvz-semantic-color-status-on-danger, #e52a31); --checkbox-focus-color: var(--lmvz-semantic-color-status-on-active, #0e7ab4); --checkbox-easing: var(--lmvz-global-easing-default, ease); --checkbox-duration: 0.2s; } .pill.sc-lmvz-checkbox { display: flex; align-items: center; gap: var(--lmvz-component-input-md-gap-x, clamp(0.25rem, 0.16rem + 0.39vw, 0.63rem)); padding-block: var(--lmvz-dimension-2-8, clamp(0.13rem, 0.03rem + 0.39vw, 0.5rem)); padding-inline: var(--lmvz-dimension-4-10, clamp(0.25rem, 0.16rem + 0.39vw, 0.63rem)); border-radius: var(--lmvz-semantic-border-radius-round, 999px); cursor: pointer; text-decoration: none; background-color: transparent; transition: background-color var(--checkbox-duration) var(--checkbox-easing); } input.sc-lmvz-checkbox { position: absolute; opacity: 0; width: var(--checkbox-box-size); height: var(--checkbox-box-size); margin: 0; cursor: pointer; z-index: 1; } .box.sc-lmvz-checkbox { display: flex; align-items: center; justify-content: center; width: var(--checkbox-box-size); height: var(--checkbox-box-size); background-color: var(--checkbox-bg); border: var(--lmvz-semantic-border-width-default, 1px) solid var(--checkbox-border-color); border-radius: var(--checkbox-border-radius); color: var(--checkbox-checkmark-color); transition: border-color var(--checkbox-duration) var(--checkbox-easing), background-color var(--checkbox-duration) var(--checkbox-easing); pointer-events: none; flex-shrink: 0; } .indicator.sc-lmvz-checkbox { display: flex; align-items: center; justify-content: center; line-height: 0; } .content.sc-lmvz-checkbox { display: flex; flex-direction: column; overflow-wrap: break-word; min-width: 0; } label.sc-lmvz-checkbox { font: var(--lmvz-typography-body-md, 400 clamp(0.88rem, 0.84rem + 0.13vw, 1rem) / 1.4 Router); color: var(--checkbox-label-color); transition: color var(--checkbox-duration) var(--checkbox-easing); } .helper-text.sc-lmvz-checkbox { font: var(--lmvz-typography-body-sm, 400 clamp(0.75rem, 0.73rem + 0.06vw, 0.81rem) / 1.4 Router); color: var(--checkbox-helper-color); margin-block-start: 2px; } .error-text.sc-lmvz-checkbox { font: var(--lmvz-typography-body-sm, 400 clamp(0.75rem, 0.73rem + 0.06vw, 0.81rem) / 1.4 Router); color: var(--checkbox-error-color); display: block; margin-block-start: 4px; padding-inline: 10px; } @media (hover: hover) { .pill.sc-lmvz-checkbox:hover { background-color: var(--checkbox-wrapper-bg-hover); } .pill.sc-lmvz-checkbox:hover .box.sc-lmvz-checkbox { border-color: var(--checkbox-border-color-hover); } } [checked].sc-lmvz-checkbox-h .pill.sc-lmvz-checkbox { background-color: var(--checkbox-wrapper-bg-checked); } [checked].sc-lmvz-checkbox-h .box.sc-lmvz-checkbox { border-color: var(--checkbox-border-color-checked); } [checked].sc-lmvz-checkbox-h label.sc-lmvz-checkbox { color: var(--checkbox-label-color-checked); } [error].sc-lmvz-checkbox-h .box.sc-lmvz-checkbox { border-color: var(--checkbox-border-color-error); } [error].sc-lmvz-checkbox-h .helper-text.sc-lmvz-checkbox { color: var(--checkbox-error-color); } [disabled].sc-lmvz-checkbox-h { opacity: var(--lmvz-component-input-disabled-opacity, 40%); pointer-events: none; } [disabled].sc-lmvz-checkbox-h .pill.sc-lmvz-checkbox { cursor: not-allowed; } [disabled].sc-lmvz-checkbox-h input.sc-lmvz-checkbox { cursor: not-allowed; } input.sc-lmvz-checkbox:focus-visible ~ .box.sc-lmvz-checkbox { outline: 2px solid var(--checkbox-focus-color); outline-offset: 2px; box-shadow: 0 var(--lmvz-semantic-shadow-l1-1-position-y, 2px) 0 var(--lmvz-semantic-shadow-l1-1-blur, 4px) var(--lmvz-semantic-color-shadow-l1-colored, rgba(175, 223, 249, 0.42)); } @media (forced-colors: active) { .box.sc-lmvz-checkbox { forced-color-adjust: auto; border-color: ButtonText; background-color: Field; } [checked].sc-lmvz-checkbox-h .box.sc-lmvz-checkbox { border-color: Highlight; background-color: Field; } .indicator.sc-lmvz-checkbox { color: ButtonText; } [checked].sc-lmvz-checkbox-h .indicator.sc-lmvz-checkbox { color: HighlightText; } input.sc-lmvz-checkbox:focus-visible ~ .box.sc-lmvz-checkbox { outline-color: Highlight; box-shadow: none; } }`;
9
+ const lmvzCheckboxCss = () => `@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-checkbox-h { display: inline-block; --checkbox-box-size: var(--lmvz-global-s18, 18px); --checkbox-border-radius: var(--lmvz-global-s4, 4px); --checkbox-bg: var(--lmvz-semantic-color-surface-input-primary, #ffffff); --checkbox-border-color: var(--lmvz-semantic-color-border-default, #e0e0e0); --checkbox-border-color-hover: var(--lmvz-semantic-color-border-hover, #c7c7c7); --checkbox-border-color-checked: var(--lmvz-semantic-color-border-active, #0f8acc); --checkbox-border-color-error: var(--lmvz-semantic-color-status-on-danger, #e52a31); --checkbox-wrapper-bg-hover: var(--lmvz-semantic-color-int-tertiary-hover, #f0f0f0); --checkbox-wrapper-bg-checked: var(--lmvz-semantic-color-status-active, #f1f9fe); --checkbox-ripple-bg: var(--lmvz-semantic-color-int-secondary-hover, #e0e0e0); --checkbox-checkmark-color: var(--lmvz-semantic-color-border-active, #0f8acc); --checkbox-label-color: var(--lmvz-semantic-color-on-surface-primary, #000000); --checkbox-label-color-checked: var(--lmvz-semantic-color-status-on-active, #0e7ab4); --checkbox-helper-color: var(--lmvz-semantic-color-on-surface-secondary, #7a7a7a); --checkbox-error-color: var(--lmvz-semantic-color-status-on-danger, #e52a31); --checkbox-focus-color: var(--lmvz-semantic-color-status-on-active, #0e7ab4); --checkbox-easing: var(--lmvz-global-easing-default, ease); --checkbox-duration: 0.2s; } .pill.sc-lmvz-checkbox { display: flex; align-items: center; gap: var(--lmvz-component-input-md-gap-x, clamp(0.25rem, 0.16rem + 0.39vw, 0.63rem)); padding-block: var(--lmvz-dimension-2-8, clamp(0.13rem, 0.03rem + 0.39vw, 0.5rem)); padding-inline: var(--lmvz-dimension-4-10, clamp(0.25rem, 0.16rem + 0.39vw, 0.63rem)); border-radius: var(--lmvz-semantic-border-radius-round, 999px); cursor: pointer; text-decoration: none; background-color: transparent; transition: background-color var(--checkbox-duration) var(--checkbox-easing); } input.sc-lmvz-checkbox { position: absolute; opacity: 0; width: var(--checkbox-box-size); height: var(--checkbox-box-size); margin: 0; cursor: pointer; z-index: 1; } .box.sc-lmvz-checkbox { display: flex; align-items: center; justify-content: center; width: var(--checkbox-box-size); height: var(--checkbox-box-size); background-color: var(--checkbox-bg); border: var(--lmvz-semantic-border-width-default, 1px) solid var(--checkbox-border-color); border-radius: var(--checkbox-border-radius); color: var(--checkbox-checkmark-color); transition: border-color var(--checkbox-duration) var(--checkbox-easing), background-color var(--checkbox-duration) var(--checkbox-easing); pointer-events: none; flex-shrink: 0; } .indicator.sc-lmvz-checkbox { display: flex; align-items: center; justify-content: center; line-height: 0; } .content.sc-lmvz-checkbox { display: flex; flex-direction: column; overflow-wrap: break-word; min-width: 0; } label.sc-lmvz-checkbox { font: var(--lmvz-typography-body-md, 400 clamp(0.88rem, 0.84rem + 0.13vw, 1rem) / 1.4 Router); color: var(--checkbox-label-color); transition: color var(--checkbox-duration) var(--checkbox-easing); } .helper-text.sc-lmvz-checkbox { font: var(--lmvz-typography-body-sm, 400 clamp(0.75rem, 0.73rem + 0.06vw, 0.81rem) / 1.4 Router); color: var(--checkbox-helper-color); margin-block-start: 2px; } .error-text.sc-lmvz-checkbox { font: var(--lmvz-typography-body-sm, 400 clamp(0.75rem, 0.73rem + 0.06vw, 0.81rem) / 1.4 Router); color: var(--checkbox-error-color); display: block; margin-block-start: 4px; padding-inline: 10px; } @media (hover: hover) { .pill.sc-lmvz-checkbox:hover { background-color: var(--checkbox-wrapper-bg-hover); } .pill.sc-lmvz-checkbox:hover .box.sc-lmvz-checkbox { border-color: var(--checkbox-border-color-hover); } } [checked].sc-lmvz-checkbox-h .pill.sc-lmvz-checkbox { background-color: var(--checkbox-wrapper-bg-checked); } [checked].sc-lmvz-checkbox-h .box.sc-lmvz-checkbox { border-color: var(--checkbox-border-color-checked); } [checked].sc-lmvz-checkbox-h label.sc-lmvz-checkbox { color: var(--checkbox-label-color-checked); } [error].sc-lmvz-checkbox-h .box.sc-lmvz-checkbox { border-color: var(--checkbox-border-color-error); } [error].sc-lmvz-checkbox-h .helper-text.sc-lmvz-checkbox { color: var(--checkbox-error-color); } [disabled].sc-lmvz-checkbox-h { opacity: var(--lmvz-component-input-disabled-opacity, 40%); pointer-events: none; } [disabled].sc-lmvz-checkbox-h .pill.sc-lmvz-checkbox { cursor: not-allowed; } [disabled].sc-lmvz-checkbox-h input.sc-lmvz-checkbox { cursor: not-allowed; } input.sc-lmvz-checkbox:focus-visible ~ .box.sc-lmvz-checkbox { outline: 2px solid var(--checkbox-focus-color); outline-offset: 2px; box-shadow: 0 var(--lmvz-semantic-shadow-l1-1-position-y, 2px) 0 var(--lmvz-semantic-shadow-l1-1-blur, 4px) var(--lmvz-semantic-color-shadow-l1-colored, rgba(175, 223, 249, 0.42)); } @media (forced-colors: active) { .box.sc-lmvz-checkbox { forced-color-adjust: auto; border-color: ButtonText; background-color: Field; } [checked].sc-lmvz-checkbox-h .box.sc-lmvz-checkbox { border-color: Highlight; background-color: Field; } .indicator.sc-lmvz-checkbox { color: ButtonText; } [checked].sc-lmvz-checkbox-h .indicator.sc-lmvz-checkbox { color: HighlightText; } input.sc-lmvz-checkbox:focus-visible ~ .box.sc-lmvz-checkbox { outline-color: Highlight; box-shadow: none; } }`;
10
10
 
11
11
  const CHECKMARK_SVG = toValidSvgStringWithFallback(checkmarkSvg);
12
12
  let checkboxIdCounter = 0;
@@ -97,7 +97,7 @@ const LmvzCheckbox = class extends ReactiveControllerHost {
97
97
  this.lmvzChange.emit(this.checked);
98
98
  };
99
99
  render() {
100
- return (h(Host, { key: '6014c885305bc9824f7a6d4f0ba8c642125f3a5b' }, h("div", { key: 'cbc6de2b684acfb00b77a366e707d73de74a0b8a', class: "pill" }, h("input", { key: '5b442512b6cab2e60a1d62fd40e4c868b1bf87ac', 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 }), h("span", { key: '09c534b7c5642c620129ea05a4468bd584c56ce7', class: "box", "aria-hidden": "true" }, this.checkedState && h("span", { key: 'eaa49e1a60054f8efc62ade0446a4704f0bb46e9', class: "indicator", innerHTML: CHECKMARK_SVG })), h("span", { key: '8fb836d71cbb3d4eadaf67284f5bb52906549275', class: "content" }, h("label", { key: '8df862f11e9885158264908fdac6599f21ecba07', htmlFor: this.checkboxId }, this.label), this.helperText && (h("span", { key: '1e45e6177774e937311cddacd1a3d3379c9c6af5', class: "helper-text", id: this.helperId, role: "status" }, this.helperText)))), this.errorMessage && (h("span", { key: '83fc1f7cd6828973e52ef27604f12f94f41d7f4b', class: "error-text", id: this.errorId, role: "alert" }, this.errorMessage))));
100
+ return (h(Host, { key: '70201fa49465f1e29b98bb251ea254be0293b1df' }, h("div", { key: 'dfeb788e3e2d9a8329e7798954c744eee616692e', class: "pill" }, h("input", { key: '79fefaa297a5fbbb1b7f180c7cf4cccf8650a1f0', 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 }), h("span", { key: '8808a026274979678515b3e750065af38d62fff9', class: "box", "aria-hidden": "true" }, this.checkedState && h("span", { key: '861c08fb2a5cc6f24d3ae0a9f28cb6d2f51beda4', class: "indicator", innerHTML: CHECKMARK_SVG })), h("span", { key: '6dc36656d76bd3a6816553b4dcbdbea2c9bd2b0f', class: "content" }, h("label", { key: 'c343c4261e2eb231925d0f3ca0a83f9f3cdd0b9b', htmlFor: this.checkboxId }, this.label), this.helperText && (h("span", { key: '8473ed19adfe975b715a5e0b78c949c6b11de99e', class: "helper-text", id: this.helperId, role: "status" }, this.helperText)))), this.errorMessage && (h("span", { key: 'e934cec1cc622908188cf9090e24988e5df45799', class: "error-text", id: this.errorId, role: "alert" }, this.errorMessage))));
101
101
  }
102
102
  static get formAssociated() { return true; }
103
103
  static get watchers() { return {
@@ -1,7 +1,7 @@
1
1
  import { g as getElement, r as registerInstance, h, H as Host } from './index-Aa_425iY.js';
2
2
  import { a as chipTypes, c as chipSizes } from './ds.constants-Bmi89ll1.js';
3
- import { R as ReactiveControllerHost, A as AriaValidationController } from './reactive-controller-host-lF2kXM1x.js';
4
- import { i as isAriaValidationEnabled } from './aria-loader-BVolm0lC.js';
3
+ import { R as ReactiveControllerHost, A as AriaValidationController } from './reactive-controller-host-CroMsXdS.js';
4
+ import { i as isAriaValidationEnabled } from './aria-loader-GfsGHZHY.js';
5
5
 
6
6
  function debounce(func, wait) {
7
7
  let timeout;
@@ -64,7 +64,7 @@ const LmvzChip = class extends ReactiveControllerHost {
64
64
  }
65
65
  }, 500);
66
66
  render() {
67
- return (h(Host, { key: '14ee006aff40f125aef2e9a461e68e25c6ed27d6', type: this.type, size: this.size }, h("slot", { key: '3222c7f40b833f344aa233c13e2644d6e928bf4c', name: "before-text", ref: (el) => (this.beforeSlot = el), onSlotchange: () => this.checkContent() }), h("span", { key: '4d1c9fa87ccda9387b945444e9ac6a50703a19e5', class: "content-overflow-wrapper" }, h("slot", { key: '42866115b8a6c50e86663ed8934504240ee0e6fa', ref: (el) => (this.defaultSlot = el), onSlotchange: () => this.checkContent() })), h("slot", { key: '890afa73be440ee7e7620a024744be08fee57b83', name: "after-text", ref: (el) => (this.afterSlot = el), onSlotchange: () => this.checkContent() })));
67
+ return (h(Host, { key: '70654d69189e77f9356853a921366083b2c4b969', type: this.type, size: this.size }, h("slot", { key: 'c7e667b93166286fe68a812dd8eec82885e3fc5e', name: "before-text", ref: (el) => (this.beforeSlot = el), onSlotchange: () => this.checkContent() }), h("span", { key: 'af38dd0429b42685a114e26175ce42d09f5fdcc1', class: "content-overflow-wrapper" }, h("slot", { key: '924158498d65b9ac7c912b6b1a479016176e0b78', ref: (el) => (this.defaultSlot = el), onSlotchange: () => this.checkContent() })), h("slot", { key: '9ff0394dbfb2131fafe513d0f2d8ce26c7781f20', name: "after-text", ref: (el) => (this.afterSlot = el), onSlotchange: () => this.checkContent() })));
68
68
  }
69
69
  static get watchers() { return {
70
70
  "type": [{
@@ -17,5 +17,5 @@ var patchBrowser = () => {
17
17
 
18
18
  patchBrowser().then(async (options) => {
19
19
  await globalScripts();
20
- return bootstrapLazy([["lmvz-modal",[[769,"lmvz-modal",{"open":[1540],"closeLabel":[1,"close-label"],"hasActions":[32],"hasHeader":[32]},[[0,"submit","handleFormDialogSubmit"]],{"open":[{"handleOpenChange":0}]}]]],["lmvz-header_2",[[769,"lmvz-header",{"role":[2561],"lmvzActiveNav":[1,"lmvz-active-nav"]},null,{"lmvzActiveNav":[{"handleActiveNavChange":0}]}],[774,"lmvz-menuitem",{"role":[2561],"ti":[2562,"tabindex"]}]]],["lmvz-action",[[257,"lmvz-action"]]],["lmvz-card",[[774,"lmvz-card",{"cardTitle":[1,"card-title"],"imageUrl":[1,"image-url"],"description":[1],"primaryActionLabel":[1,"primary-action-label"]}]]],["lmvz-checkbox",[[578,"lmvz-checkbox",{"label":[1],"checked":[1540],"value":[1],"name":[1],"disabled":[516],"required":[516],"error":[516],"errorMessage":[1,"error-message"],"helperText":[1,"helper-text"],"form":[1],"autofocus":[4],"checkedState":[32],"focusInput":[64],"checkValidity":[64],"reportValidity":[64]},null,{"checked":[{"handleCheckedChange":0}]}]]],["lmvz-chip",[[769,"lmvz-chip",{"type":[1537],"size":[1537]},null,{"type":[{"normalizeType":0}],"size":[{"normalizeSize":0}]}]]],["lmvz-input",[[838,"lmvz-input",{"value":[1025],"label":[1],"helperText":[1,"helper-text"],"placeholder":[1],"disabled":[516],"readonly":[516],"required":[516],"name":[1],"type":[1],"errorMessage":[1,"error-message"],"autocomplete":[1],"inputmode":[1],"autocorrect":[1],"autocapitalize":[1],"spellcheck":[4],"autofocus":[4],"minlength":[2],"maxlength":[2],"pattern":[1],"min":[8],"max":[8],"step":[8],"form":[1],"error":[6660],"nativeError":[32],"setValue":[64],"focusInput":[64],"blurInput":[64],"select":[64],"checkValidity":[64],"reportValidity":[64],"getInputElement":[64]},null,{"value":[{"handleValueChange":0}],"disabled":[{"handleDisabledChange":0}]}]]],["lmvz-menuitem",[[774,"lmvz-menuitem",{"role":[2561],"ti":[2562,"tabindex"]}]]],["lmvz-select",[[774,"lmvz-select",{"value":[1025],"label":[1],"helperText":[1,"helper-text"],"disabled":[516],"required":[516],"name":[1],"selectedLabel":[32]},null,{"value":[{"handleValueChange":0}]}]]],["lmvz-toggle",[[578,"lmvz-toggle",{"label":[1],"checked":[1540],"disabled":[516],"required":[516],"name":[1],"value":[1],"form":[1],"focusToggle":[64],"blurToggle":[64],"checkValidity":[64],"reportValidity":[64],"getInputElement":[64]},null,{"checked":[{"handleCheckedChange":0}],"disabled":[{"handleDisabledChange":0}]}]]],["lmvz-button_2",[[785,"lmvz-button",{"ti":[2562,"tabindex"],"scale":[513],"variant":[513],"disabled":[516],"type":[1],"form":[1],"formMethod":[1,"form-method"],"name":[1],"value":[1]}],[514,"lmvz-icon",{"icon":[513],"weight":[513],"size":[513],"iconset":[513],"ariaLabel":[513,"aria-label"],"iconData":[32],"visible":[32]},null,{"icon":[{"loadIconPathData":0}],"iconset":[{"loadIconPathData":0}]}]]]], options);
20
+ return bootstrapLazy([["lmvz-modal",[[769,"lmvz-modal",{"open":[1540],"closeLabel":[1,"close-label"],"hasHeader":[32]},[[0,"submit","handleFormDialogSubmit"]],{"open":[{"handleOpenChange":0}]}]]],["lmvz-header_2",[[769,"lmvz-header",{"role":[2561],"lmvzActiveNav":[1,"lmvz-active-nav"]},null,{"lmvzActiveNav":[{"handleActiveNavChange":0}]}],[774,"lmvz-menuitem",{"role":[2561],"ti":[2562,"tabindex"]}]]],["lmvz-action",[[257,"lmvz-action"]]],["lmvz-card",[[774,"lmvz-card",{"cardTitle":[1,"card-title"],"imageUrl":[1,"image-url"],"description":[1],"primaryActionLabel":[1,"primary-action-label"]}]]],["lmvz-checkbox",[[578,"lmvz-checkbox",{"label":[1],"checked":[1540],"value":[1],"name":[1],"disabled":[516],"required":[516],"error":[516],"errorMessage":[1,"error-message"],"helperText":[1,"helper-text"],"form":[1],"autofocus":[4],"checkedState":[32],"focusInput":[64],"checkValidity":[64],"reportValidity":[64]},null,{"checked":[{"handleCheckedChange":0}]}]]],["lmvz-chip",[[769,"lmvz-chip",{"type":[1537],"size":[1537]},null,{"type":[{"normalizeType":0}],"size":[{"normalizeSize":0}]}]]],["lmvz-input",[[838,"lmvz-input",{"value":[1025],"label":[1],"helperText":[1,"helper-text"],"placeholder":[1],"disabled":[516],"readonly":[516],"required":[516],"name":[1],"type":[1],"errorMessage":[1,"error-message"],"autocomplete":[1],"inputmode":[1],"autocorrect":[1],"autocapitalize":[1],"spellcheck":[4],"autofocus":[4],"minlength":[2],"maxlength":[2],"pattern":[1],"min":[8],"max":[8],"step":[8],"form":[1],"error":[6660],"nativeError":[32],"setValue":[64],"focusInput":[64],"blurInput":[64],"select":[64],"checkValidity":[64],"reportValidity":[64],"getInputElement":[64]},null,{"value":[{"handleValueChange":0}],"disabled":[{"handleDisabledChange":0}]}]]],["lmvz-menuitem",[[774,"lmvz-menuitem",{"role":[2561],"ti":[2562,"tabindex"]}]]],["lmvz-select",[[774,"lmvz-select",{"value":[1025],"label":[1],"helperText":[1,"helper-text"],"disabled":[516],"required":[516],"name":[1],"selectedLabel":[32]},null,{"value":[{"handleValueChange":0}]}]]],["lmvz-toggle",[[578,"lmvz-toggle",{"label":[1],"checked":[1540],"disabled":[516],"required":[516],"name":[1],"value":[1],"form":[1],"focusToggle":[64],"blurToggle":[64],"checkValidity":[64],"reportValidity":[64],"getInputElement":[64]},null,{"checked":[{"handleCheckedChange":0}],"disabled":[{"handleDisabledChange":0}]}]]],["lmvz-button_3",[[785,"lmvz-button",{"ti":[2562,"tabindex"],"scale":[513],"variant":[513],"disabled":[516],"type":[1],"form":[1],"formMethod":[1,"form-method"],"name":[1],"value":[1]}],[257,"lmvz-button-group",{"primaryEnabledAction":[2064],"hasActions":[2052,"has-actions"]}],[514,"lmvz-icon",{"icon":[513],"weight":[513],"size":[513],"iconset":[513],"ariaLabel":[513,"aria-label"],"iconData":[32],"visible":[32]},null,{"icon":[{"loadIconPathData":0}],"iconset":[{"loadIconPathData":0}]}]]]], options);
21
21
  });
@@ -1,8 +1,8 @@
1
1
  import { g as getElement, r as registerInstance, h, H as Host } from './index-Aa_425iY.js';
2
- import { R as ReactiveControllerHost, A as AriaValidationController } from './reactive-controller-host-lF2kXM1x.js';
2
+ import { R as ReactiveControllerHost, A as AriaValidationController } from './reactive-controller-host-CroMsXdS.js';
3
3
  import { g as getDeepActiveElement, a as canReceiveFocus } from './component-DOTK1OW3.js';
4
4
  export { lmvz_menuitem } from './lmvz-menuitem.entry.js';
5
- import './aria-loader-BVolm0lC.js';
5
+ import './aria-loader-GfsGHZHY.js';
6
6
  import './element-activation-controller-CN0JX9-m.js';
7
7
 
8
8
  class ListKeyboardNavigationController {
@@ -137,7 +137,7 @@ const LmvzHeader = class extends ReactiveControllerHost {
137
137
  }
138
138
  }
139
139
  render() {
140
- return (h(Host, { key: '87ecb9948039ea2f4b998bf35865e5839708a65c', onFocus: this.delegateFocus.bind(this) }, h("div", { key: '4f1ae09b1a3e0a9c3eb12659b3952eef34cbd67b', class: "brand" }, h("slot", { key: '99c03f87f0b3462d9b44835ba34ee05c75373b22', name: "brand" }, h("img", { key: '1616ce8464c2e798a53bc7c879385e3882e4d32f', id: "fallback-logo-lmvz", src: logoSvg, alt: "Lehrmittelverlag Z\u00FCrich" }))), h("nav", { key: 'ff7c56dbc9e80ba9a0757683069e1cba168abcb6', "aria-label": "Hauptnavigation" }, h("div", { key: 'a3bb67d788b936422992b066431c73098ff2aa11', role: "menubar", class: "primary-menubar" }, h("slot", { key: 'e85b93f943c6d97bd5a7fa6f75e4855785d09ec5', name: "nav-primary", ref: (el) => (this.primarySlot = el) }), h("div", { key: 'e9efcfc5d3a8cb991c255b32b205924dafb5aaf6', role: "menu", id: "nav-secondary", class: "secondary-menubar", hidden: !this.lmvzActiveNav, ref: (el) => (this.secondaryNav = el) }, h("slot", { key: '7314e6a72705d48b347fa30945b1d5513b87bfd3', name: this.secondarySlotName, ref: (el) => (this.secondarySlot = el) })))), h("div", { key: 'aee503cddbf8964833934e594caf5faa6e073a02', class: "actions" }, h("slot", { key: '5c1b15c0507ef24f67e37cd1652b4cc5ce4cc104', name: "actions" }))));
140
+ return (h(Host, { key: '323b7b13ef147f48e5f06537c7f27ab6e8a649ca', onFocus: this.delegateFocus.bind(this) }, h("div", { key: '518434d55b7bfc5c1a8988f707984b8e2a41163c', class: "brand" }, h("slot", { key: '1829a1ba10ba3a4e1a0e32564c534e960dc652d1', name: "brand" }, h("img", { key: '485c217a7fc920646ec531cac9744a10f29dab4e', id: "fallback-logo-lmvz", src: logoSvg, alt: "Lehrmittelverlag Z\u00FCrich" }))), h("nav", { key: 'df2cea9f42427c0bb51a498cc2627f0113a608a0', "aria-label": "Hauptnavigation" }, h("div", { key: '93d6e0edc45c0032c5d3c93ea5f22e204fb0617e', role: "menubar", class: "primary-menubar" }, h("slot", { key: '1b0238ca89023cc9a0ec4453e79a4597aaa92f2a', name: "nav-primary", ref: (el) => (this.primarySlot = el) }), h("div", { key: 'd7576b23a5f9268a106c98052a869825493e0485', role: "menu", id: "nav-secondary", class: "secondary-menubar", hidden: !this.lmvzActiveNav, ref: (el) => (this.secondaryNav = el) }, h("slot", { key: 'ada5f271c58350c44bb55c3bd976450214795f2b', name: this.secondarySlotName, ref: (el) => (this.secondarySlot = el) })))), h("div", { key: 'db47039ebf932942210fd3f0920f9f86f9d2b09b', class: "actions" }, h("slot", { key: '2d220a2946f26e69052d20dd4524e60fafbfe137', name: "actions" }))));
141
141
  }
142
142
  static get watchers() { return {
143
143
  "lmvzActiveNav": [{