@lmvz-ds/components 0.19.0 → 0.20.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 (103) hide show
  1. package/CHANGELOG.md +10 -0
  2. package/assets/icons/checkmark.svg +4 -0
  3. package/cjs/{aria-loader-CfFuAbJn.js → aria-loader-Cec1zR2g.js} +1 -1
  4. package/cjs/icons-BQASWgk-.js +80 -0
  5. package/cjs/{index--7IqZZqn.js → index-3g9Z9sfF.js} +765 -2854
  6. package/cjs/index.cjs.js +4 -3
  7. package/cjs/lmvz-button.cjs.entry.js +3 -3
  8. package/cjs/lmvz-card.cjs.entry.js +1 -1
  9. package/cjs/lmvz-checkbox.cjs.entry.js +113 -0
  10. package/cjs/lmvz-chip.cjs.entry.js +3 -3
  11. package/cjs/lmvz-components.cjs.js +1 -1
  12. package/cjs/lmvz-header_2.cjs.entry.js +3 -3
  13. package/cjs/lmvz-icon.cjs.entry.js +9 -7
  14. package/cjs/lmvz-input.cjs.entry.js +4 -4
  15. package/cjs/lmvz-menuitem.cjs.entry.js +4 -4
  16. package/cjs/lmvz-select.cjs.entry.js +3 -3
  17. package/cjs/loader.cjs.js +1 -1
  18. package/cjs/{logger-Bn2yoZGP.js → logger-DsM6xg6V.js} +3063 -833
  19. package/cjs/{reactive-controller-host-Bi9eu2bV.js → reactive-controller-host-BA4ZhjKA.js} +1 -1
  20. package/cjs/{icons-Tg7ySOh-.js → svg-BMBduILB.js} +31 -85
  21. package/collection/assets/icons/checkmark.svg +4 -0
  22. package/collection/collection-manifest.json +1 -0
  23. package/collection/components/lmvz-button/lmvz-button.css +1 -2
  24. package/collection/components/lmvz-card/lmvz-card.css +1 -2
  25. package/collection/components/lmvz-checkbox/lmvz-checkbox.css +207 -0
  26. package/collection/components/lmvz-checkbox/lmvz-checkbox.js +424 -0
  27. package/collection/components/lmvz-chip/lmvz-chip.js +1 -1
  28. package/collection/components/lmvz-header/lmvz-header.js +1 -1
  29. package/collection/components/lmvz-icon/lmvz-icon.js +5 -5
  30. package/collection/components/lmvz-input/lmvz-input.js +2 -2
  31. package/collection/components/lmvz-menuitem/lmvz-menuitem.css +1 -1
  32. package/collection/components/lmvz-menuitem/lmvz-menuitem.js +1 -1
  33. package/collection/components/lmvz-select/lmvz-select.js +1 -1
  34. package/collection/integration/header-integration/header-integration.js +1 -1
  35. package/collection/utils/icons/icons.js +2 -13
  36. package/collection/utils/icons/icons.unit.js +3 -15
  37. package/components/index.d.ts +2 -0
  38. package/components/index.d.ts.bak +2 -0
  39. package/components/index.js +1 -1
  40. package/components/lmvz-button.js +1 -1
  41. package/components/lmvz-card.js +1 -1
  42. package/components/lmvz-checkbox.d.ts +11 -0
  43. package/components/lmvz-checkbox.d.ts.bak +11 -0
  44. package/components/lmvz-checkbox.js +1 -0
  45. package/components/lmvz-chip.js +1 -1
  46. package/components/lmvz-header.js +1 -1
  47. package/components/lmvz-icon.js +1 -1
  48. package/components/lmvz-input.js +1 -1
  49. package/components/lmvz-menuitem.js +1 -1
  50. package/components/lmvz-select.js +1 -1
  51. package/components/p-0s99QfRy.js +12 -0
  52. package/components/{p-DbeHBSOe.js → p-BuFx0tTm.js} +1 -1
  53. package/components/p-CGmJG63p.js +1 -0
  54. package/components/p-CcxjkCOx.js +1 -0
  55. package/esm/{aria-loader-CES8Ae1e.js → aria-loader-BVolm0lC.js} +1 -1
  56. package/esm/icons-CmuFKDRz.js +75 -0
  57. package/esm/{index-BvxaUA12.js → index-Dh_9sN0q.js} +389 -2478
  58. package/esm/index.js +4 -3
  59. package/esm/lmvz-button.entry.js +3 -3
  60. package/esm/lmvz-card.entry.js +1 -1
  61. package/esm/lmvz-checkbox.entry.js +111 -0
  62. package/esm/lmvz-chip.entry.js +3 -3
  63. package/esm/lmvz-components.js +1 -1
  64. package/esm/lmvz-header_2.entry.js +3 -3
  65. package/esm/lmvz-icon.entry.js +9 -7
  66. package/esm/lmvz-input.entry.js +4 -4
  67. package/esm/lmvz-menuitem.entry.js +4 -4
  68. package/esm/lmvz-select.entry.js +3 -3
  69. package/esm/loader.js +1 -1
  70. package/esm/{logger-0bL3pydp.js → logger-CGmJG63p.js} +2870 -765
  71. package/esm/{reactive-controller-host-J2thAxVH.js → reactive-controller-host-DHcPpJW7.js} +1 -1
  72. package/esm/{icons-Bj4dF1-I.js → svg-B2YoIRuh.js} +29 -80
  73. package/hydrate/index.js +2441 -165
  74. package/hydrate/index.mjs +2441 -165
  75. package/lmvz-components/index.esm.js +1 -1
  76. package/lmvz-components/lmvz-components.esm.js +1 -1
  77. package/lmvz-components/{p-ec96c6b6.entry.js → p-0f7a4236.entry.js} +1 -1
  78. package/lmvz-components/p-0s99QfRy.js +12 -0
  79. package/lmvz-components/p-2f83d7a2.entry.js +1 -0
  80. package/lmvz-components/{p-6e8acbd9.entry.js → p-32171f4f.entry.js} +1 -1
  81. package/lmvz-components/{p-9212bd23.entry.js → p-400b2318.entry.js} +1 -1
  82. package/lmvz-components/{p-9626e951.entry.js → p-851969bd.entry.js} +1 -1
  83. package/lmvz-components/p-9f9d845d.entry.js +1 -0
  84. package/lmvz-components/p-CFsC37ww.js +1 -0
  85. package/lmvz-components/p-CGmJG63p.js +1 -0
  86. package/lmvz-components/p-CcxjkCOx.js +1 -0
  87. package/lmvz-components/{p-BxHnZA0M.js → p-GdMr6Qlp.js} +1 -1
  88. package/lmvz-components/p-a12f95da.entry.js +1 -0
  89. package/lmvz-components/{p-e1b847d2.entry.js → p-ab4437dc.entry.js} +1 -1
  90. package/lmvz-components/{p-7a6bec13.entry.js → p-d0a0e206.entry.js} +1 -1
  91. package/lmvz-components/{p-DYaffOLo.js → p-dhVSUYqd.js} +1 -1
  92. package/manifest.json +410 -1
  93. package/package.json +5 -1
  94. package/types/components/lmvz-checkbox/lmvz-checkbox.d.ts +39 -0
  95. package/types/components.d.ts +151 -0
  96. package/types/utils/icons/icons.d.ts +0 -1
  97. package/components/p-DXOTa5VF.js +0 -12
  98. package/components/p-fiRXhuXK.js +0 -1
  99. package/lmvz-components/p-0bL3pydp.js +0 -1
  100. package/lmvz-components/p-40569208.entry.js +0 -1
  101. package/lmvz-components/p-49ab22bd.entry.js +0 -1
  102. package/lmvz-components/p-Bu4Z_PMf.js +0 -1
  103. package/lmvz-components/p-DHZwxmLb.js +0 -12
package/esm/index.js CHANGED
@@ -1,4 +1,5 @@
1
- export { A as ARIA_VALIDATION_RUNTIME_CHANGED_EVENT, d as disableAriaValidation, e as enableAriaValidation, i as isAriaValidationEnabled, q as queueValidation, u as useVerboseLogging } from './aria-loader-CES8Ae1e.js';
1
+ export { A as ARIA_VALIDATION_RUNTIME_CHANGED_EVENT, d as disableAriaValidation, e as enableAriaValidation, i as isAriaValidationEnabled, q as queueValidation, u as useVerboseLogging } from './aria-loader-BVolm0lC.js';
2
2
  export { c as chipSizes, a as chipTypes, i as iconSizes, b as iconWeights, d as inputTypes, t as textSizes } from './ds.constants-Bmi89ll1.js';
3
- export { g as getRegisteredIconProvider, r as registerIconProvider, t as typedIconFromSet } from './icons-Bj4dF1-I.js';
4
- import './logger-0bL3pydp.js';
3
+ export { g as getRegisteredIconProvider, r as registerIconProvider, t as typedIconFromSet } from './icons-CmuFKDRz.js';
4
+ import './svg-B2YoIRuh.js';
5
+ import './logger-CGmJG63p.js';
@@ -1,11 +1,11 @@
1
1
  import { g as getElement, r as registerInstance, c as createEvent, h, H as Host } from './index-saW7O-EW.js';
2
2
  import { c as classNames } from './index-BfTCfPZ1.js';
3
- import { R as ReactiveControllerHost, A as AriaValidationController } from './reactive-controller-host-J2thAxVH.js';
3
+ import { R as ReactiveControllerHost, A as AriaValidationController } from './reactive-controller-host-DHcPpJW7.js';
4
4
  import { E as ElementActivationController } from './element-activation-controller-CN0JX9-m.js';
5
5
  import { i as inheritAriaAttributes, f as findFormByRef } from './component-DIrAQ4IB.js';
6
- import './aria-loader-CES8Ae1e.js';
6
+ import './aria-loader-BVolm0lC.js';
7
7
 
8
- 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('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; } } :host { 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-active, #f1f9fe); 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: contents; } ::slotted(*) { --lmvz-component-color: var(--lmvz-button-color); } `;
8
+ 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('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; } } :host { 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: contents; } ::slotted(*) { --lmvz-component-color: var(--lmvz-button-color); } `;
9
9
 
10
10
  const LmvzButton = class extends ReactiveControllerHost {
11
11
  get el() { return getElement(this); }
@@ -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-active, #f1f9fe); 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('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; }`;
24
24
 
25
25
  const LmvzCard = class {
26
26
  constructor(hostRef) {
@@ -0,0 +1,111 @@
1
+ import { g as getElement, r as registerInstance, c as createEvent, h, H as Host } from './index-saW7O-EW.js';
2
+ import { t as toValidSvgStringWithFallback } from './svg-B2YoIRuh.js';
3
+ import { R as ReactiveControllerHost, A as AriaValidationController } from './reactive-controller-host-DHcPpJW7.js';
4
+ import './logger-CGmJG63p.js';
5
+ import './aria-loader-BVolm0lC.js';
6
+
7
+ const checkmarkSvg = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iMTIiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIKICAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgYXJpYS1oaWRkZW49InRydWUiIGZvY3VzYWJsZT0iZmFsc2UiPgogICAgPHBhdGggZD0iTTMuNzUgMTIuNTYyNUw4LjgzMDc5IDE3LjYyNUwyMC40Mzc1IDYuMzc1IiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+';
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; } }`;
10
+
11
+ const CHECKMARK_SVG = toValidSvgStringWithFallback(checkmarkSvg);
12
+ let checkboxIdCounter = 0;
13
+ const LmvzCheckbox = class extends ReactiveControllerHost {
14
+ get el() { return getElement(this); }
15
+ get validationEl() {
16
+ return this.el;
17
+ }
18
+ internals;
19
+ nativeInput;
20
+ checkboxId = `lmvz-checkbox-${checkboxIdCounter++}`;
21
+ initialChecked = false;
22
+ get helperId() {
23
+ return this.helperText ? `${this.checkboxId}-helper` : undefined;
24
+ }
25
+ get errorId() {
26
+ return this.errorMessage ? `${this.checkboxId}-error` : undefined;
27
+ }
28
+ get ariaDescribedBy() {
29
+ const ids = [this.errorId, this.helperId].filter(Boolean);
30
+ return ids.length > 0 ? ids.join(' ') : undefined;
31
+ }
32
+ label;
33
+ checked = false;
34
+ value = 'on';
35
+ name;
36
+ disabled = false;
37
+ required = false;
38
+ error = false;
39
+ errorMessage;
40
+ helperText;
41
+ form;
42
+ autofocus = false;
43
+ checkedState = false;
44
+ handleCheckedChange(val) {
45
+ this.checkedState = val;
46
+ this.internals.setFormValue?.(val ? (this.value ?? 'on') : null);
47
+ }
48
+ lmvzChange;
49
+ async focusInput() {
50
+ this.nativeInput?.focus();
51
+ }
52
+ async checkValidity() {
53
+ return this.internals?.checkValidity() ?? true;
54
+ }
55
+ async reportValidity() {
56
+ return this.internals?.reportValidity() ?? true;
57
+ }
58
+ constructor(hostRef) {
59
+ super();
60
+ registerInstance(this, hostRef);
61
+ this.lmvzChange = createEvent(this, "lmvzChange");
62
+ if (hostRef.$hostElement$["s-ei"]) {
63
+ this.internals = hostRef.$hostElement$["s-ei"];
64
+ }
65
+ else {
66
+ this.internals = hostRef.$hostElement$.attachInternals();
67
+ hostRef.$hostElement$["s-ei"] = this.internals;
68
+ }
69
+ this.addController(new AriaValidationController(this, {
70
+ reValidateOnPropChanges: true,
71
+ }));
72
+ }
73
+ componentWillLoad() {
74
+ this.initialChecked = this.checked;
75
+ this.checkedState = this.checked;
76
+ this.internals.setFormValue?.(this.checked ? (this.value ?? 'on') : null);
77
+ super.componentWillLoad();
78
+ }
79
+ componentWillRender() {
80
+ if (this.error && !this.errorMessage) {
81
+ console.warn('lmvz-checkbox: error=true set without errorMessage — no visual-only error state is rendered. Provide errorMessage to communicate the error to users.');
82
+ }
83
+ super.componentWillRender();
84
+ }
85
+ formAssociatedCallback() {
86
+ this.internals.setFormValue?.(this.checked ? (this.value ?? 'on') : null);
87
+ }
88
+ formResetCallback() {
89
+ this.checked = this.initialChecked;
90
+ }
91
+ formStateRestoreCallback(state) {
92
+ this.checked = state === (this.value ?? 'on');
93
+ }
94
+ handleChange = (event) => {
95
+ const input = event.target;
96
+ this.checked = input.checked;
97
+ this.lmvzChange.emit(this.checked);
98
+ };
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))));
101
+ }
102
+ static get formAssociated() { return true; }
103
+ static get watchers() { return {
104
+ "checked": [{
105
+ "handleCheckedChange": 0
106
+ }]
107
+ }; }
108
+ };
109
+ LmvzCheckbox.style = lmvzCheckboxCss();
110
+
111
+ export { LmvzCheckbox as lmvz_checkbox };
@@ -1,7 +1,7 @@
1
1
  import { g as getElement, r as registerInstance, h, H as Host } from './index-saW7O-EW.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-J2thAxVH.js';
4
- import { i as isAriaValidationEnabled } from './aria-loader-CES8Ae1e.js';
3
+ import { R as ReactiveControllerHost, A as AriaValidationController } from './reactive-controller-host-DHcPpJW7.js';
4
+ import { i as isAriaValidationEnabled } from './aria-loader-BVolm0lC.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: 'd34b677a3f6ac2cdb53453c774badb837a3b9e25', type: this.type, size: this.size }, h("slot", { key: 'c6f8beea28cd847f8d8b7c7a075c774f58e39262', name: "before-text", ref: (el) => (this.beforeSlot = el), onSlotchange: () => this.checkContent() }), h("span", { key: 'be784ef977bc1d0eae2fd2d9377642636bd325bc', class: "content-overflow-wrapper" }, h("slot", { key: '3730f2902bcae7917979dedd91264670fbff00de', ref: (el) => (this.defaultSlot = el), onSlotchange: () => this.checkContent() })), h("slot", { key: 'f827a03e407385c7bdfd483073453d97f6f73afb', name: "after-text", ref: (el) => (this.afterSlot = el), onSlotchange: () => this.checkContent() })));
67
+ return (h(Host, { key: 'c77e8ae55531eefb31dd37b41b4851746a78f077', type: this.type, size: this.size }, h("slot", { key: '3f4d0a8feb887080172d11facc01afbe730b2726', name: "before-text", ref: (el) => (this.beforeSlot = el), onSlotchange: () => this.checkContent() }), h("span", { key: '6ec135ebcb32f15fea342379ac2b1dfebbe76fa6', class: "content-overflow-wrapper" }, h("slot", { key: '053afb88e2d6702428aab195bfcec6aff6d9c55f', ref: (el) => (this.defaultSlot = el), onSlotchange: () => this.checkContent() })), h("slot", { key: 'ed51db073a512a32d12da59dee285708b83ae87b', 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-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-button",[[785,"lmvz-button",{"ti":[2562,"tabindex"],"scale":[513],"variant":[513],"disabled":[516],"type":[1],"form":[1]}]]],["lmvz-card",[[774,"lmvz-card",{"cardTitle":[1,"card-title"],"imageUrl":[1,"image-url"],"description":[1],"primaryActionLabel":[1,"primary-action-label"]}]]],["lmvz-chip",[[769,"lmvz-chip",{"type":[1537],"size":[1537]},null,{"type":[{"normalizeType":0}],"size":[{"normalizeSize":0}]}]]],["lmvz-icon",[[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}]}]]],["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}]}]]]], options);
20
+ return bootstrapLazy([["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-button",[[785,"lmvz-button",{"ti":[2562,"tabindex"],"scale":[513],"variant":[513],"disabled":[516],"type":[1],"form":[1]}]]],["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-icon",[[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}]}]]],["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}]}]]]], options);
21
21
  });
@@ -1,8 +1,8 @@
1
1
  import { g as getElement, r as registerInstance, h, H as Host } from './index-saW7O-EW.js';
2
- import { R as ReactiveControllerHost, A as AriaValidationController } from './reactive-controller-host-J2thAxVH.js';
2
+ import { R as ReactiveControllerHost, A as AriaValidationController } from './reactive-controller-host-DHcPpJW7.js';
3
3
  import { g as getDeepActiveElement, a as canReceiveFocus } from './component-DIrAQ4IB.js';
4
4
  export { lmvz_menuitem } from './lmvz-menuitem.entry.js';
5
- import './aria-loader-CES8Ae1e.js';
5
+ import './aria-loader-BVolm0lC.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: '74061d97a6d4cdec1f445a91b9e819bb12565681', onFocus: this.delegateFocus.bind(this) }, h("div", { key: 'af7f08ff48a20b7d36df5ee233da7027cd30a047', class: "brand" }, h("slot", { key: '46be4fcf2798ac374ac967bc2742260c4d7e082b', name: "brand" }, h("img", { key: '3ee79f9732758a6ca5dd6e8264c67707917b358b', id: "fallback-logo-lmvz", src: logoSvg, alt: "Lehrmittelverlag Z\u00FCrich" }))), h("nav", { key: '8f37883454544a384bb35a151c4e24bb12c35f40', "aria-label": "Hauptnavigation" }, h("div", { key: 'a3166ad7e924dd72148d05c01160c889c8f07529', role: "menubar", class: "primary-menubar" }, h("slot", { key: 'aa600791e4d8f3463fefbc3b366831e3b3a3eaac', name: "nav-primary", ref: (el) => (this.primarySlot = el) }), h("div", { key: '6471256967f4d14c454205a330b2a97ecfcad7a8', role: "menu", id: "nav-secondary", class: "secondary-menubar", hidden: !this.lmvzActiveNav, ref: (el) => (this.secondaryNav = el) }, h("slot", { key: '1b9b461b958e76184938a1c65d032b296894e2dd', name: this.secondarySlotName, ref: (el) => (this.secondarySlot = el) })))), h("div", { key: '019d87472272df09ce99eeed405771229f326f1a', class: "actions" }, h("slot", { key: '18035fb0a51a26c96dc687547d17d57118a88e87', name: "actions" }))));
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" }))));
141
141
  }
142
142
  static get watchers() { return {
143
143
  "lmvzActiveNav": [{
@@ -1,8 +1,9 @@
1
1
  import { g as getElement, r as registerInstance, h, H as Host } from './index-saW7O-EW.js';
2
- import { i as isValidSVG, c as createValidSVGString, a as resolveIconSvg } from './icons-Bj4dF1-I.js';
3
- import { r as runPromise } from './logger-0bL3pydp.js';
4
- import { R as ReactiveControllerHost, A as AriaValidationController } from './reactive-controller-host-J2thAxVH.js';
5
- import './aria-loader-CES8Ae1e.js';
2
+ import { p as parseSvgString } from './svg-B2YoIRuh.js';
3
+ import { R as ReactiveControllerHost, A as AriaValidationController } from './reactive-controller-host-DHcPpJW7.js';
4
+ import { a as resolveIconSvg } from './icons-CmuFKDRz.js';
5
+ import './logger-CGmJG63p.js';
6
+ import './aria-loader-BVolm0lC.js';
6
7
 
7
8
  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)}}`;
8
9
 
@@ -45,8 +46,9 @@ const LmvzIcon = class extends ReactiveControllerHost {
45
46
  if (!icon || !visible) {
46
47
  return;
47
48
  }
48
- if (isValidSVG(icon)) {
49
- this.iconData = await runPromise(createValidSVGString(icon));
49
+ const maybeIcon = parseSvgString(icon);
50
+ if (maybeIcon) {
51
+ this.iconData = maybeIcon;
50
52
  return;
51
53
  }
52
54
  this.iconData = await resolveIconSvg({
@@ -60,7 +62,7 @@ const LmvzIcon = class extends ReactiveControllerHost {
60
62
  super.componentDidRender();
61
63
  }
62
64
  render() {
63
- return h(Host, { key: 'c1e952e00df287c66c49eb043408514c07c3dc39', role: "img", "aria-hidden": `${this.ariaHidden}`, innerHTML: this.iconData });
65
+ return h(Host, { key: 'e76fe28500b3545b8917ecdad590da5bc04ed38f', role: "img", "aria-hidden": `${this.ariaHidden}`, innerHTML: this.iconData });
64
66
  }
65
67
  waitUntilVisible(callback, rootMargin = 50) {
66
68
  if (typeof window === 'undefined' || !window.IntersectionObserver) {
@@ -1,8 +1,8 @@
1
1
  import { g as getElement, r as registerInstance, c as createEvent, h } from './index-saW7O-EW.js';
2
2
  import { c as classNames } from './index-BfTCfPZ1.js';
3
- import { R as ReactiveControllerHost, A as AriaValidationController } from './reactive-controller-host-J2thAxVH.js';
3
+ import { R as ReactiveControllerHost, A as AriaValidationController } from './reactive-controller-host-DHcPpJW7.js';
4
4
  import { c as componentOnReady } from './component-DIrAQ4IB.js';
5
- import './aria-loader-CES8Ae1e.js';
5
+ import './aria-loader-BVolm0lC.js';
6
6
 
7
7
  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('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-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-status-on-active, #0e7ab4); --input-border-width: var(--lmvz-semantic-border-width-default, 1px); --input-height: 48px; --input-padding-x: 16px; --label-color: var(--lmvz-semantic-color-on-surface-input-secondary, #7a7a7a); --input-text-color: var(--lmvz-semantic-color-on-surface-input-primary, #000000); --helper-text-color: var(--lmvz-semantic-color-on-surface-input-secondary, #7a7a7a); --error-text-color: var(--lmvz-semantic-color-status-on-danger, #e52a31); --label-floating-scale: 0.85; --label-minimized-top: -6px; --label-minimized-bg: var(--input-bg); --label-minimized-padding-x: 4px; --input-disabled-opacity: var(--lmvz-component-input-disabled-opacity, 40%); } .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: 8px; } [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: 2px solid var(--input-border-color-focus); outline-offset: 2px; } .input-container.sc-lmvz-input:has(input:focus-visible) .input-wrapper.sc-lmvz-input { box-shadow: 0 0 0 3px rgb(0 86 214 / 20%); } [error].sc-lmvz-input-h .input-wrapper.sc-lmvz-input { border-color: var(--error-text-color); } [error].sc-lmvz-input-h:focus-within .input-wrapper.sc-lmvz-input { border-color: var(--error-text-color); outline-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: 14px; font-family: Router, sans-serif; font-weight: 400; pointer-events: none; transition: all 0.2s ease-out; background-color: transparent; padding: 0; margin: 0; line-height: normal; white-space: nowrap; } label.floating.sc-lmvz-input { top: 0; transform: translateY(-50%) scale(0.85); transform-origin: left top; background-color: var(--label-minimized-bg); padding: 0 var(--label-minimized-padding-x); left: -2px; color: var(--input-text-color); font-weight: 500; } .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: 14px; 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: 12px; font-size: 12px; color: var(--helper-text-color); font-family: Router, sans-serif; font-weight: 500; } [role='alert'].sc-lmvz-input { padding-top: 8px; padding-left: 12px; font-size: 12px; color: var(--error-text-color); font-family: Router, sans-serif; font-weight: 500; } .sc-lmvz-input-s > lmvz-button { --lmvz-button-padding: 4px; }`;
8
8
 
@@ -162,9 +162,9 @@ const LmvzInput = class extends ReactiveControllerHost {
162
162
  render() {
163
163
  const hasValue = Boolean(this.value);
164
164
  const shouldFloatLabel = hasValue || Boolean(this.placeholder);
165
- return (h("div", { key: '22be29e5fcd4976fc6c4d125781be00acef0b359', class: classNames('input-container', {
165
+ return (h("div", { key: '3cbfee5fccbb5efe1bfb9c6622653e11d4896615', class: classNames('input-container', {
166
166
  'interaction-filled': hasValue,
167
- }) }, h("div", { key: 'ffeb620419316976e800b16b4a9fd9538f1efd26', class: "input-wrapper" }, h("slot", { key: '2a1a67f7fde0232b2bb5ce3cc228b869e5ac3516', name: "before-input" }), h("div", { key: '3bbe623cae67d376c60a28306164293a712b1bb5', class: "label-input-group" }, h("label", { key: 'c260b3eb249d5c785fe3b6e223c7428a8c147f50', htmlFor: this.inputId, class: classNames({ floating: shouldFloatLabel }) }, this.label, this.required && (h("span", { key: 'f43dd77efe7e319428dd72ec8933b7587635e767', class: "required-indicator", "aria-hidden": "true" }, ' ', "*"))), h("input", { key: 'eeb821a74a5ac7aab3fab65a48a37d21a22744e6', 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 })), h("slot", { key: 'dd36a212c05c43ab2a8249750c14a7475b6d65d3', name: "after-input" })), h("div", { key: 'c2aedd67036faf4d3dc459c3c1fab8d07ee5a991', id: this.helperId, role: "status" }, this.helperText || null), h("div", { key: '01d2a6d6df9b3804a595711c7b57b6177d311c39', id: this.errorId, role: "alert" }, (this.showErrorMessage && this.errorMessage) || null)));
167
+ }) }, h("div", { key: '2712b0d5eda0ca1d4da70f362047df07acf922a5', class: "input-wrapper" }, h("slot", { key: '992bc86de6b3bdd3cdbac1c000d38a338e6e4474', name: "before-input" }), h("div", { key: '35ace7d889667f5d09eea76dcba161f8711c9b1c', class: "label-input-group" }, h("label", { key: '28520dddf331d35ba75283673aa81e0046628907', htmlFor: this.inputId, class: classNames({ floating: shouldFloatLabel }) }, this.label, this.required && (h("span", { key: 'b91766b86b1bc68ce3dbb4b734ee4aa40fe0759b', class: "required-indicator", "aria-hidden": "true" }, ' ', "*"))), h("input", { key: 'ed7cd4b64091256df1c3b939c1e22d6082fe58b9', 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 })), h("slot", { key: '1e42c305b8e554fadd7c50fbbb54ea234c734b0a', name: "after-input" })), h("div", { key: '190a1a92971a717f3ef594615fbe4dd0c9a72493', id: this.helperId, role: "status" }, this.helperText || null), h("div", { key: '4d07b45a51d3733caf09a1bbc56ae6f51411ecbc', id: this.errorId, role: "alert" }, (this.showErrorMessage && this.errorMessage) || null)));
168
168
  }
169
169
  static get formAssociated() { return true; }
170
170
  static get watchers() { return {
@@ -1,9 +1,9 @@
1
1
  import { g as getElement, r as registerInstance, c as createEvent, h, H as Host } from './index-saW7O-EW.js';
2
- import { R as ReactiveControllerHost, A as AriaValidationController } from './reactive-controller-host-J2thAxVH.js';
2
+ import { R as ReactiveControllerHost, A as AriaValidationController } from './reactive-controller-host-DHcPpJW7.js';
3
3
  import { E as ElementActivationController } from './element-activation-controller-CN0JX9-m.js';
4
- import './aria-loader-CES8Ae1e.js';
4
+ import './aria-loader-BVolm0lC.js';
5
5
 
6
- const lmvzMenuitemCss = () => `@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-menuitem-h { display: inline-flex; flex-direction: row; align-items: center; justify-content: center; gap: var(--lmvz-component-input-md-gap-x, clamp(0.25rem, 0.16rem + 0.39vw, 0.63rem)); border-radius: var(--lmvz-semantic-border-radius-lg, 14px); font: var(--lmvz-typography-body-md, 400 clamp(0.88rem, 0.84rem + 0.13vw, 1rem) / 1.4 Router); padding: var(--lmvz-component-input-md-padding-y, clamp(0.75rem, 0.69rem + 0.26vw, 1rem)) var(--lmvz-component-input-md-padding-x, clamp(0.75rem, 0.69rem + 0.26vw, 1rem)); cursor: pointer; --lmvz-menuitem-color: var(--lmvz-semantic-color-int-on-tertiary, #545454); --lmvz-menuitem-background: var(--lmvz-semantic-color-int-tertiary, #ffffff); background: var(--lmvz-menuitem-background); color: var(--lmvz-menuitem-color); } .sc-lmvz-menuitem-h:hover { --lmvz-menuitem-background: var(--lmvz-semantic-color-int-tertiary-hover, #f0f0f0); } .sc-lmvz-menuitem-h:active { --lmvz-menuitem-background: var(--lmvz-semantic-color-int-tertiary-active, #e0e0e0); } .sc-lmvz-menuitem-h:focus-visible { z-index: 1; } [aria-expanded='true'].sc-lmvz-menuitem-h { --lmvz-menuitem-background: var(--lmvz-semantic-color-status-on-active, #0e7ab4); --lmvz-menuitem-color: var(--lmvz-semantic-color-status-on-active, #0e7ab4); }`;
6
+ const lmvzMenuitemCss = () => `@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-menuitem-h { display: inline-flex; flex-direction: row; align-items: center; justify-content: center; gap: var(--lmvz-component-input-md-gap-x, clamp(0.25rem, 0.16rem + 0.39vw, 0.63rem)); border-radius: var(--lmvz-semantic-border-radius-lg, 14px); font: var(--lmvz-typography-body-md, 400 clamp(0.88rem, 0.84rem + 0.13vw, 1rem) / 1.4 Router); padding: var(--lmvz-component-input-md-padding-y, clamp(0.75rem, 0.69rem + 0.26vw, 1rem)) var(--lmvz-component-input-md-padding-x, clamp(0.75rem, 0.69rem + 0.26vw, 1rem)); cursor: pointer; --lmvz-menuitem-color: var(--lmvz-semantic-color-int-on-tertiary, #545454); --lmvz-menuitem-background: var(--lmvz-semantic-color-int-tertiary, #ffffff); background: var(--lmvz-menuitem-background); color: var(--lmvz-menuitem-color); } .sc-lmvz-menuitem-h:hover { --lmvz-menuitem-background: var(--lmvz-semantic-color-int-tertiary-hover, #f0f0f0); } .sc-lmvz-menuitem-h:active { --lmvz-menuitem-background: var(--lmvz-semantic-color-int-tertiary-active, #e0e0e0); } .sc-lmvz-menuitem-h:focus-visible { z-index: 1; } [aria-expanded='true'].sc-lmvz-menuitem-h { --lmvz-menuitem-background: var(--lmvz-semantic-color-status-active, #f1f9fe); --lmvz-menuitem-color: var(--lmvz-semantic-color-status-on-active, #0e7ab4); }`;
7
7
 
8
8
  const LmvzMenuItem = class extends ReactiveControllerHost {
9
9
  get el() { return getElement(this); }
@@ -26,7 +26,7 @@ const LmvzMenuItem = class extends ReactiveControllerHost {
26
26
  this.addController(new ElementActivationController(this));
27
27
  }
28
28
  render() {
29
- return (h(Host, { key: '0878343aec1c98c16c073c6cdd3382ee5c980799' }, h("slot", { key: 'f7a87d4c9d786bb4686d406d4313e9b5d79701d6', ref: (e) => (this.validationSlot = e) })));
29
+ return (h(Host, { key: 'a87116fba2d35c612e590c6b4e12c03b60d1ef0e' }, h("slot", { key: 'b302049db0b5818d4d7f90c043eb5c3caf48ca1b', ref: (e) => (this.validationSlot = e) })));
30
30
  }
31
31
  };
32
32
  LmvzMenuItem.style = lmvzMenuitemCss();
@@ -1,6 +1,6 @@
1
1
  import { g as getElement, r as registerInstance, c as createEvent, h, H as Host } from './index-saW7O-EW.js';
2
- import { R as ReactiveControllerHost, A as AriaValidationController } from './reactive-controller-host-J2thAxVH.js';
3
- import './aria-loader-CES8Ae1e.js';
2
+ import { R as ReactiveControllerHost, A as AriaValidationController } from './reactive-controller-host-DHcPpJW7.js';
3
+ import './aria-loader-BVolm0lC.js';
4
4
 
5
5
  const chevronDownSvg = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTIwLjMzMzQgOC42NjY2M0wxMi4wMDAxIDE3TDMuNjY2NzUgOC42NjY2MyIgc3Ryb2tlPSJibGFjayIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+Cjwvc3ZnPgo=';
6
6
 
@@ -56,7 +56,7 @@ const LmvzSelect = class extends ReactiveControllerHost {
56
56
  render() {
57
57
  const hasValue = this.hasValue;
58
58
  const shouldShowLabel = hasValue;
59
- return (h(Host, { key: 'b9f6211fec35e7c03cc9c462cb1f8eb60fc6c96c' }, h("div", { key: '43d22daa1492f87f89f9479687b82ee893f10faa', class: "select-wrapper" }, h("label", { key: 'cf399d80e31a345cea60286db4aea2d7dd7973d1', htmlFor: this.selectId, class: shouldShowLabel ? 'floating-label' : 'assistive-label' }, this.label, this.required && shouldShowLabel && h("span", { key: '6bdd8e0d652f126eb1c64c2a647ac0816cc61b05', "aria-hidden": "true" }, " *")), h("div", { key: '5d8497c64e197a71003a0c8e11149993fcefd684', "aria-hidden": "true" }, h("span", { key: '95b73705ad81d000ce415a377002e4ae4d63aae6' }, hasValue ? this.selectedLabel : this.label, this.required && !hasValue && h("span", { key: '2ff855f0fa89d3c66c59a176f855fdbf18ecb6c2', "aria-hidden": "true" }, " *")), h("span", { key: 'a66d4ec65c95b1463223c07aecb17d65a45c6b24' }, h("img", { key: '4cd21532ff13a3ecbd229cd79d0a3fa7b3eafc60', src: chevronDownSvg, alt: "" }))), h("select", { key: '2a9e46e29f8ef7d116989b58abfacee840dd2275', 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 && h("option", { key: '5c5fa4d5e3b120a0085f6fc408d20a56f6547441', value: "", disabled: true, selected: true, hidden: true }), h("slot", { key: 'e11909e901624af7d9d5275f2e9715007960eab9' }))), this.helperText && h("div", { key: 'fa0d06d3294f303081fd5ffb9aeaff6a8e297901', role: "status" }, this.helperText)));
59
+ return (h(Host, { key: '1bdd53df4a33c5292cc072b0a9abc45fa01b237f' }, h("div", { key: 'e38d81e620d8c27cd34e1a7799c42d5640d4b0db', class: "select-wrapper" }, h("label", { key: '3995206b564c7e17ac273709577eb8dd7a3b0ff1', htmlFor: this.selectId, class: shouldShowLabel ? 'floating-label' : 'assistive-label' }, this.label, this.required && shouldShowLabel && h("span", { key: '7c04028f9ff3e0f365f76d10b0139dc6805f2af4', "aria-hidden": "true" }, " *")), h("div", { key: '7b428d22a32181fc13e837b6821ab163ac286453', "aria-hidden": "true" }, h("span", { key: '385ddb473337869777e835cc5b533f9a41c1fbe3' }, hasValue ? this.selectedLabel : this.label, this.required && !hasValue && h("span", { key: 'c53036bd718b916b910225297b40df998729650c', "aria-hidden": "true" }, " *")), h("span", { key: '06db17fbe01d9fea9904aa04e72b6cbfc9d93652' }, h("img", { key: 'b4d46ada048e931aa71f2ace33c93ff9fc67e479', src: chevronDownSvg, alt: "" }))), h("select", { key: '841c86f1d340cd36475a7757e9cad5f33aeac710', 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 && h("option", { key: '4bd193f7878da2077c9185cd093d61c62406a7b9', value: "", disabled: true, selected: true, hidden: true }), h("slot", { key: 'c14a15e022f08ad72a5ad9d29befe0db7c6f24db' }))), this.helperText && h("div", { key: '833eaa383f8a9722fd990fadcdff4a93aa0a79df', role: "status" }, this.helperText)));
60
60
  }
61
61
  static get watchers() { return {
62
62
  "value": [{
package/esm/loader.js CHANGED
@@ -5,7 +5,7 @@ import { g as globalScripts } from './app-globals-DQuL1Twl.js';
5
5
  const defineCustomElements = async (win, options) => {
6
6
  if (typeof window === 'undefined') return undefined;
7
7
  await globalScripts();
8
- return bootstrapLazy([["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-button",[[785,"lmvz-button",{"ti":[2562,"tabindex"],"scale":[513],"variant":[513],"disabled":[516],"type":[1],"form":[1]}]]],["lmvz-card",[[774,"lmvz-card",{"cardTitle":[1,"card-title"],"imageUrl":[1,"image-url"],"description":[1],"primaryActionLabel":[1,"primary-action-label"]}]]],["lmvz-chip",[[769,"lmvz-chip",{"type":[1537],"size":[1537]},null,{"type":[{"normalizeType":0}],"size":[{"normalizeSize":0}]}]]],["lmvz-icon",[[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}]}]]],["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}]}]]]], options);
8
+ return bootstrapLazy([["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-button",[[785,"lmvz-button",{"ti":[2562,"tabindex"],"scale":[513],"variant":[513],"disabled":[516],"type":[1],"form":[1]}]]],["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-icon",[[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}]}]]],["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}]}]]]], options);
9
9
  };
10
10
 
11
11
  export { defineCustomElements };