@lmvz-ds/components 0.34.0 → 0.35.1

package/cjs/loader.cjs.js

@@ -6,7 +6,7 @@ var appGlobals = require('./app-globals-V2Kpy_OQ.js');
 const defineCustomElements = async (win, options) => {
   if (typeof window === 'undefined') return undefined;
   await appGlobals.globalScripts();
-  return index.bootstrapLazy([["lmvz-modal.cjs",[[769,"lmvz-modal",{"open":[1540],"closeLabel":[1,"close-label"],"hasHeader":[32]},[[0,"submit","handleFormDialogSubmit"]],{"open":[{"handleOpenChange":0}]}]]],["lmvz-message.cjs",[[769,"lmvz-message",{"type":[513],"live":[1],"leadingIcon":[4,"leading-icon"],"dismissible":[4],"closeLabel":[1,"close-label"],"actionLabel":[1,"action-label"]}]]],["lmvz-snackbar.cjs",[[513,"lmvz-snackbar",{"status":[1537],"message":[1025],"duration":[1026],"priority":[1025],"actionLabel":[1025,"action-label"],"animationClass":[32],"show":[64],"hide":[64]},null,{"status":[{"onStatusChange":0}]}]]],["lmvz-link.cjs",[[785,"lmvz-link",{"href":[513],"target":[513],"rel":[1],"type":[1537],"externalLabel":[1,"external-label"]},null,{"type":[{"normalizeType":0}]}]]],["lmvz-header_2.cjs",[[769,"lmvz-header",{"role":[2561],"lmvzActiveNav":[1,"lmvz-active-nav"]},null,{"lmvzActiveNav":[{"handleActiveNavChange":0}]}],[774,"lmvz-menuitem",{"role":[2561],"ti":[2562,"tabindex"]}]]],["lmvz-action.cjs",[[257,"lmvz-action"]]],["lmvz-action-list.cjs",[[774,"lmvz-action-list",{"label":[1]}]]],["lmvz-card.cjs",[[774,"lmvz-card",{"cardTitle":[1,"card-title"],"imageUrl":[1,"image-url"],"description":[1],"primaryActionLabel":[1,"primary-action-label"]}]]],["lmvz-checkbox.cjs",[[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.cjs",[[769,"lmvz-chip",{"type":[1537],"size":[1537]},null,{"type":[{"normalizeType":0}],"size":[{"normalizeSize":0}]}]]],["lmvz-input.cjs",[[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],"size":[513],"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.cjs",[[774,"lmvz-menuitem",{"role":[2561],"ti":[2562,"tabindex"]}]]],["lmvz-popover.cjs",[[769,"lmvz-popover",{"open":[1540],"anchor":[1],"placement":[1],"size":[1],"autoFocus":[4,"auto-focus"],"label":[1],"show":[64],"hide":[64],"toggle":[64]},null,{"open":[{"handleOpenChange":0}],"anchor":[{"handleAnchorChange":0}]}]]],["lmvz-radio.cjs",[[578,"lmvz-radio",{"label":[1],"checked":[1540],"value":[1],"name":[1],"disabled":[516],"required":[516],"error":[516],"helperText":[1,"helper-text"],"form":[513],"autofocus":[4],"focusInput":[64],"checkValidity":[64],"reportValidity":[64]},[[0,"keydown","handleKeydown"]],{"checked":[{"handleCheckedChange":0}],"value":[{"handleValueChange":0}],"label":[{"handleLabelChange":0}]}]]],["lmvz-select.cjs",[[774,"lmvz-select",{"value":[1025],"label":[1],"helperText":[1,"helper-text"],"disabled":[516],"required":[516],"name":[1],"size":[513],"highlighted":[516],"selectedLabel":[32]},null,{"value":[{"handleValueChange":0}]}]]],["lmvz-spinner.cjs",[[513,"lmvz-spinner",{"size":[513],"ariaLabel":[513,"aria-label"]}]]],["lmvz-tab.cjs",[[785,"lmvz-tab",{"value":[513],"disabled":[516],"selected":[516],"vertical":[516]}]]],["lmvz-tabs.cjs",[[769,"lmvz-tabs",{"value":[1537],"orientation":[1537],"resolvedValue":[32],"activateTab":[64],"getTabElements":[64],"setTabPanelIds":[64]},null,{"value":[{"handleValueChange":0}],"orientation":[{"handleOrientationChange":0}]}]]],["lmvz-toggle.cjs",[[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-group.cjs",[[769,"lmvz-button-group",{"stacked":[516],"primaryEnabledAction":[2064],"hasActions":[2052,"has-actions"]}]]],["lmvz-button_2.cjs",[[785,"lmvz-button",{"ti":[514,"tabindex"],"scale":[513],"variant":[513],"disabled":[516],"type":[1],"form":[1],"formMethod":[1,"form-method"],"name":[1],"value":[1],"buttonRole":[1,"button-role"]}],[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);
+  return index.bootstrapLazy([["lmvz-modal.cjs",[[769,"lmvz-modal",{"open":[1540],"closeLabel":[1,"close-label"],"hasHeader":[32]},[[0,"submit","handleFormDialogSubmit"]],{"open":[{"handleOpenChange":0}]}]]],["lmvz-message.cjs",[[769,"lmvz-message",{"type":[513],"live":[1],"leadingIcon":[4,"leading-icon"],"dismissible":[4],"closeLabel":[1,"close-label"],"actionLabel":[1,"action-label"]}]]],["lmvz-snackbar.cjs",[[513,"lmvz-snackbar",{"status":[1537],"message":[1025],"duration":[1026],"priority":[1025],"actionLabel":[1025,"action-label"],"animationClass":[32],"show":[64],"hide":[64]},null,{"status":[{"onStatusChange":0}]}]]],["lmvz-link.cjs",[[785,"lmvz-link",{"href":[513],"target":[513],"rel":[1],"type":[1537],"externalLabel":[1,"external-label"]},null,{"type":[{"normalizeType":0}]}]]],["lmvz-header_2.cjs",[[769,"lmvz-header",{"role":[2561],"lmvzActiveNav":[1,"lmvz-active-nav"],"initFocus":[64]},null,{"lmvzActiveNav":[{"handleActiveNavChange":0}]}],[774,"lmvz-menuitem",{"role":[2561],"ti":[2562,"tabindex"]}]]],["lmvz-action.cjs",[[257,"lmvz-action"]]],["lmvz-action-list.cjs",[[774,"lmvz-action-list",{"label":[1],"initFocus":[64]}]]],["lmvz-card.cjs",[[774,"lmvz-card",{"cardTitle":[1,"card-title"],"imageUrl":[1,"image-url"],"description":[1],"primaryActionLabel":[1,"primary-action-label"]}]]],["lmvz-checkbox.cjs",[[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.cjs",[[769,"lmvz-chip",{"type":[1537],"size":[1537]},null,{"type":[{"normalizeType":0}],"size":[{"normalizeSize":0}]}]]],["lmvz-input.cjs",[[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],"size":[513],"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.cjs",[[774,"lmvz-menuitem",{"role":[2561],"ti":[2562,"tabindex"]}]]],["lmvz-popover.cjs",[[769,"lmvz-popover",{"open":[1540],"anchor":[1],"placement":[1],"size":[1],"autoFocus":[4,"auto-focus"],"label":[1],"anchorEl":[32],"show":[64],"hide":[64],"toggle":[64]},null,{"open":[{"handleOpenChange":0}],"anchor":[{"handleAnchorChange":1}]}]]],["lmvz-radio.cjs",[[578,"lmvz-radio",{"label":[1],"checked":[1540],"value":[1],"name":[1],"disabled":[516],"required":[516],"error":[516],"helperText":[1,"helper-text"],"form":[513],"autofocus":[4],"focusInput":[64],"checkValidity":[64],"reportValidity":[64]},[[0,"keydown","handleKeydown"]],{"checked":[{"handleCheckedChange":0}],"value":[{"handleValueChange":0}],"label":[{"handleLabelChange":0}]}]]],["lmvz-select.cjs",[[774,"lmvz-select",{"value":[1025],"label":[1],"helperText":[1,"helper-text"],"disabled":[516],"required":[516],"name":[1],"size":[513],"highlighted":[516],"selectedLabel":[32]},null,{"value":[{"handleValueChange":0}]}]]],["lmvz-spinner.cjs",[[513,"lmvz-spinner",{"size":[513],"ariaLabel":[513,"aria-label"]}]]],["lmvz-tab.cjs",[[785,"lmvz-tab",{"value":[513],"disabled":[516],"selected":[516],"vertical":[516]}]]],["lmvz-tabs.cjs",[[769,"lmvz-tabs",{"value":[1537],"orientation":[1537],"resolvedValue":[32],"initFocus":[64],"activateTab":[64],"getTabElements":[64],"setTabPanelIds":[64]},null,{"value":[{"handleValueChange":0}],"orientation":[{"handleOrientationChange":0}]}]]],["lmvz-toggle.cjs",[[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-group.cjs",[[769,"lmvz-button-group",{"stacked":[516],"primaryEnabledAction":[2064],"hasActions":[2052,"has-actions"]}]]],["lmvz-button_2.cjs",[[785,"lmvz-button",{"ti":[514,"tabindex"],"scale":[513],"variant":[513],"disabled":[516],"type":[1],"form":[1],"formMethod":[1,"form-method"],"name":[1],"value":[1],"buttonRole":[1,"button-role"]}],[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);
 };
 
 exports.setNonce = index.setNonce;

package/{esm/reactive-controller-host-FBuCCcFC.js → cjs/reactive-controller-host-Bc6B_T45.js}

@@ -1,3 +1,6 @@
+'use strict';
+
+const META_BASE = '__LMVZ__';
 class ReactiveControllerHost {
     controllers = new Set();
     addController(controller) {
@@ -37,5 +40,20 @@ class ReactiveControllerHost {
         this.activeControllers.forEach((controller) => controller.hostDidUpdate?.());
     }
 }
+function registerLmvzComponentMetaInfo(el, key, info) {
+    if (!el) {
+        console.warn('component is undefined');
+        return;
+    }
+    const cmp = el;
+    if (!cmp[META_BASE])
+        cmp[META_BASE] = {};
+    cmp[META_BASE][key] = info;
+}
+function getLmvzComponentMetaInfo(el, key) {
+    return el?.[META_BASE]?.[key];
+}
 
-export { ReactiveControllerHost as R };
+exports.ReactiveControllerHost = ReactiveControllerHost;
+exports.getLmvzComponentMetaInfo = getLmvzComponentMetaInfo;
+exports.registerLmvzComponentMetaInfo = registerLmvzComponentMetaInfo;

package/cjs/{stencil.util-DxdYjVoH.js → stencil.util-CBrPLd-F.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var async_util = require('./async.util-BQ60l-WC.js');
+var async_util = require('./async.util-Dnl6c82X.js');
 
 const componentOnReady = (stencilEl, callback) => {
     if (hasLazyBuild(stencilEl)) {

package/collection/components/lmvz-action/lmvz-action.js

@@ -5,7 +5,7 @@ export class LmvzAction {
         this.actionClick.emit(event);
     }
     render() {
-        return (h(Host, { key: '15c0f20e08cd5019abfd3bb71ec69d175dc5ba48', onClick: this._onClick.bind(this) }, h("slot", { key: 'f71a7853168d1b66b0a50b0f971d140385530ac3' })));
+        return (h(Host, { key: '4d83f95393704400034fef7313ac52bcc100be95', onClick: this._onClick.bind(this) }, h("slot", { key: 'ffbdeca0877eb9a76bc4ac1b8b77b37b60fdabd5' })));
     }
     static get is() { return "lmvz-action"; }
     static get encapsulation() { return "shadow"; }

package/collection/components/lmvz-action-list/lmvz-action-list.css

@@ -25,7 +25,7 @@ h6 {
 hr {
   height: 0;
   border: none;
-  margin: var(--lmvz-dimension-4-8, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem)) 0;
+  margin: var(--lmvz-dimension-8-4, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem)) 0;
   border-top: var(--lmvz-semantic-border-width-default, 1px) solid var(--lmvz-semantic-color-border-subtle, #f0f0f0);
 }
 
@@ -129,17 +129,17 @@ button.primary:not([disabled], .disabled):active {
 button.danger {
   --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-tertiary, #ffffff));
   --lmvz-button-border-color: var(--lmvz-button-border-color-override, transparent);
-  --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-status-on-danger, #e52a31));
+  --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-status-on-danger, #a31419));
 }
 
 button.danger:not([disabled], .disabled):hover {
-  --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-status-danger, #fdf1f2));
-  --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-status-on-danger, #e52a31));
+  --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-status-danger, #fbdfe0));
+  --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-status-on-danger, #a31419));
 }
 
 button.danger:not([disabled], .disabled):active {
-  --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-status-on-danger-subtle, #f7bfc2));
-  --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-status-on-danger, #e52a31));
+  --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-status-on-danger-subtle, #e8454b));
+  --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-status-on-danger, #a31419));
 }
 
 button.tertiary {
@@ -162,7 +162,7 @@ button.small {
   --lmvz-button-padding-block: var(--lmvz-button-padding-block-override, var(--lmvz-component-input-padding-sm, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem)));
   --lmvz-button-gap: var(--lmvz-button-gap-override, var(--lmvz-component-input-gap-sm, clamp(0.38rem, 0.31rem + 0.26vw, 0.63rem)));
   --lmvz-button-min-height: var(--lmvz-button-min-height-override, var(--lmvz-component-input-size-sm, clamp(2rem, 1.94rem + 0.26vw, 2.25rem)));
-  --lmvz-button-font: var(--lmvz-button-font-override, var(--lmvz-typography-label-sm-strong, normal 700 clamp(0.69rem, 0.67rem + 0.06vw, 0.75rem) / 1.5
+  --lmvz-button-font: var(--lmvz-button-font-override, var(--lmvz-typography-label-sm-strong, normal 700 clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem) / 1.5
     Router));
 }
 

package/collection/components/lmvz-action-list/lmvz-action-list.js

@@ -1,6 +1,6 @@
 import { Host, h } from "@stencil/core";
 import { AriaValidationController } from "../../utils/aria/aria-validation-controller";
-import { DirectionalFocusController } from "../../utils/aria/list-keyboard-controller";
+import { DirectionalFocusController } from "../../utils/aria/directional-focus-controller";
 import { isLmvzButton } from "../../utils/element/element.util";
 import { ReactiveControllerHost } from "../../utils/stencil/reactive-controller-host";
 export class LmvzActionList extends ReactiveControllerHost {
@@ -29,6 +29,9 @@ export class LmvzActionList extends ReactiveControllerHost {
         this.handleSlotChange();
         super.componentDidLoad();
     }
+    async initFocus() {
+        this.focusController.initFocus();
+    }
     handleSlotChange = () => {
         const slot = this.slotEl;
         if (!slot)
@@ -49,7 +52,7 @@ export class LmvzActionList extends ReactiveControllerHost {
     };
     render() {
         const ariaLabel = this.label || undefined;
-        return (h(Host, { key: '1180ac5cb2ad83db0279a5cd2ce15d9ab75d03ca', role: "menu", "aria-label": ariaLabel }, h("slot", { key: '479179e7ec42780e73936d50703ff46d48a89efb', onSlotchange: this.handleSlotChange, ref: (el) => (this.slotEl = el) })));
+        return (h(Host, { key: '9dee495856e733cb17f30d0d8588362a8dcb28ce', role: "menu", "aria-label": ariaLabel }, h("slot", { key: 'c6454dbbe63eed5be01f3247934245d1cc1ad6e2', onSlotchange: this.handleSlotChange, ref: (el) => (this.slotEl = el) })));
     }
     static get is() { return "lmvz-action-list"; }
     static get encapsulation() { return "scoped"; }
@@ -86,6 +89,27 @@ export class LmvzActionList extends ReactiveControllerHost {
             }
         };
     }
+    static get methods() {
+        return {
+            "initFocus": {
+                "complexType": {
+                    "signature": "() => Promise<void>",
+                    "parameters": [],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<void>"
+                },
+                "docs": {
+                    "text": "Programmatically set focus to the first managed element.",
+                    "tags": []
+                }
+            }
+        };
+    }
     static get elementRef() { return "el"; }
 }
 function collectInteractiveButtonsRecursively(el, collection) {

package/collection/components/lmvz-button/lmvz-button.css

@@ -58,7 +58,7 @@ h6 {
 hr {
   height: 0;
   border: none;
-  margin: var(--lmvz-dimension-4-8, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem)) 0;
+  margin: var(--lmvz-dimension-8-4, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem)) 0;
   border-top: var(--lmvz-semantic-border-width-default, 1px) solid var(--lmvz-semantic-color-border-subtle, #f0f0f0);
 }
 
@@ -157,17 +157,17 @@ button.primary:not([disabled], .disabled):active {
 button.danger {
   --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-tertiary, #ffffff));
   --lmvz-button-border-color: var(--lmvz-button-border-color-override, transparent);
-  --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-status-on-danger, #e52a31));
+  --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-status-on-danger, #a31419));
 }
 
 button.danger:not([disabled], .disabled):hover {
-  --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-status-danger, #fdf1f2));
-  --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-status-on-danger, #e52a31));
+  --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-status-danger, #fbdfe0));
+  --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-status-on-danger, #a31419));
 }
 
 button.danger:not([disabled], .disabled):active {
-  --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-status-on-danger-subtle, #f7bfc2));
-  --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-status-on-danger, #e52a31));
+  --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-status-on-danger-subtle, #e8454b));
+  --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-status-on-danger, #a31419));
 }
 
 button.tertiary {
@@ -190,7 +190,7 @@ button.small {
   --lmvz-button-padding-block: var(--lmvz-button-padding-block-override, var(--lmvz-component-input-padding-sm, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem)));
   --lmvz-button-gap: var(--lmvz-button-gap-override, var(--lmvz-component-input-gap-sm, clamp(0.38rem, 0.31rem + 0.26vw, 0.63rem)));
   --lmvz-button-min-height: var(--lmvz-button-min-height-override, var(--lmvz-component-input-size-sm, clamp(2rem, 1.94rem + 0.26vw, 2.25rem)));
-  --lmvz-button-font: var(--lmvz-button-font-override, var(--lmvz-typography-label-sm-strong, normal 700 clamp(0.69rem, 0.67rem + 0.06vw, 0.75rem) / 1.5
+  --lmvz-button-font: var(--lmvz-button-font-override, var(--lmvz-typography-label-sm-strong, normal 700 clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem) / 1.5
     Router));
 }
 

package/collection/components/lmvz-button/lmvz-button.js

@@ -29,7 +29,6 @@ export class LmvzButton extends ReactiveControllerHost {
         this.addController(new AriaValidationController(this));
         this.addController(new ElementActivationController(this, {
             localHandler: this.handleClick.bind(this),
-            keys: ['Enter'],
         }));
     }
     connectedCallback() {
@@ -90,7 +89,7 @@ export class LmvzButton extends ReactiveControllerHost {
     };
     render() {
         this.renderHiddenButton();
-        return (h(Host, { key: 'f3e619dca398c3a8a78e9d2f8c3df4178b2531b2', role: "presentation" }, h("button", { key: 'eb1aac6756a70968d3a72cb40c1d52d96340423e', ref: (e) => (this.validationEl = e), part: "button", role: this.buttonRole, disabled: this.disabled, type: this.type, class: classNames(this.variant ?? 'secondary', { [this.scale ?? '']: !!this.scale, disabled: this.disabled }), ...this.inheritedAttributes }, h("slot", { key: '786ff1c10ae05eda646c77ac8779813be6e51949' }))));
+        return (h(Host, { key: 'eb0ee982f50f1e41b2aa72a0598d739b972cbcdf', role: "presentation" }, h("button", { key: 'aed6f44f51222e31d5f1deec952c0d81b8f1200a', ref: (e) => (this.validationEl = e), part: "button", role: this.buttonRole, disabled: this.disabled, type: this.type, class: classNames(this.variant ?? 'secondary', { [this.scale ?? '']: !!this.scale, disabled: this.disabled }), ...this.inheritedAttributes }, h("slot", { key: '2aaedfde3c0d6ebf426f20a8489b22c2a356767e' }))));
     }
     static get is() { return "lmvz-button"; }
     static get encapsulation() { return "shadow"; }

package/collection/components/lmvz-card/lmvz-card.css

@@ -58,7 +58,7 @@ h6 {
 hr {
   height: 0;
   border: none;
-  margin: var(--lmvz-dimension-4-8, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem)) 0;
+  margin: var(--lmvz-dimension-8-4, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem)) 0;
   border-top: var(--lmvz-semantic-border-width-default, 1px) solid var(--lmvz-semantic-color-border-subtle, #f0f0f0);
 }
 
@@ -158,17 +158,17 @@ button.primary:not([disabled], .disabled):active {
 button.danger {
   --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-tertiary, #ffffff));
   --lmvz-button-border-color: var(--lmvz-button-border-color-override, transparent);
-  --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-status-on-danger, #e52a31));
+  --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-status-on-danger, #a31419));
 }
 
 button.danger:not([disabled], .disabled):hover {
-  --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-status-danger, #fdf1f2));
-  --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-status-on-danger, #e52a31));
+  --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-status-danger, #fbdfe0));
+  --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-status-on-danger, #a31419));
 }
 
 button.danger:not([disabled], .disabled):active {
-  --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-status-on-danger-subtle, #f7bfc2));
-  --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-status-on-danger, #e52a31));
+  --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-status-on-danger-subtle, #e8454b));
+  --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-status-on-danger, #a31419));
 }
 
 button.tertiary {
@@ -191,7 +191,7 @@ button.small {
   --lmvz-button-padding-block: var(--lmvz-button-padding-block-override, var(--lmvz-component-input-padding-sm, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem)));
   --lmvz-button-gap: var(--lmvz-button-gap-override, var(--lmvz-component-input-gap-sm, clamp(0.38rem, 0.31rem + 0.26vw, 0.63rem)));
   --lmvz-button-min-height: var(--lmvz-button-min-height-override, var(--lmvz-component-input-size-sm, clamp(2rem, 1.94rem + 0.26vw, 2.25rem)));
-  --lmvz-button-font: var(--lmvz-button-font-override, var(--lmvz-typography-label-sm-strong, normal 700 clamp(0.69rem, 0.67rem + 0.06vw, 0.75rem) / 1.5
+  --lmvz-button-font: var(--lmvz-button-font-override, var(--lmvz-typography-label-sm-strong, normal 700 clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem) / 1.5
     Router));
 }
 
@@ -221,7 +221,7 @@ button.large {
 }
 .top {
   display: flex;
-  padding: var(--lmvz-dimension-8-12, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem));
+  padding: var(--lmvz-dimension-12-8, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem));
   flex-direction: column;
   justify-content: center;
   align-items: center;
@@ -230,7 +230,7 @@ button.large {
 .bottom {
   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));
+  padding: var(--lmvz-dimension-6-4, clamp(0.25rem, 0.22rem + 0.13vw, 0.38rem)) var(--lmvz-dimension-14-10, clamp(0.63rem, 0.56rem + 0.26vw, 0.88rem)) var(--lmvz-dimension-14-10, clamp(0.63rem, 0.56rem + 0.26vw, 0.88rem)) var(--lmvz-dimension-14-10, clamp(0.63rem, 0.56rem + 0.26vw, 0.88rem));
   flex-direction: column;
   align-items: flex-start;
   align-self: stretch;
@@ -244,7 +244,7 @@ button.large {
 
   padding-bottom: var(--lmvz-global-s4, 4px);
   overflow-wrap: break-word;
-  font: var(--lmvz-typography-heading-2xl, 500 clamp(2.25rem, 2.13rem + 0.52vw, 2.75rem) / 1.4
+  font: var(--lmvz-typography-heading-2xl, 500 clamp(2rem, 1.82rem + 0.78vw, 2.75rem) / 1.4
     Router);
 }
 .description {

package/collection/components/lmvz-checkbox/lmvz-checkbox.css

@@ -45,9 +45,9 @@
 
   --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-hover: var(--lmvz-semantic-color-border-hover, #a1a1a1);
   --checkbox-border-color-checked: var(--lmvz-semantic-color-border-active, #0f8acc);
-  --checkbox-border-color-error: var(--lmvz-semantic-color-status-on-danger, #e52a31);
+  --checkbox-border-color-error: var(--lmvz-semantic-color-status-on-danger, #a31419);
 
   --checkbox-wrapper-bg-hover: var(--lmvz-semantic-color-int-tertiary-hover, #f0f0f0);
   --checkbox-wrapper-bg-checked: var(--lmvz-semantic-color-status-active, #f6fbfe);
@@ -58,8 +58,8 @@
 
   --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-helper-color: var(--lmvz-semantic-color-on-surface-secondary, #545454);
+  --checkbox-error-color: var(--lmvz-semantic-color-status-on-danger, #a31419);
   --checkbox-focus-color: var(--lmvz-semantic-color-status-on-active, #0e7ab4);
 
   --checkbox-easing: var(--lmvz-global-easing-default, ease);
@@ -69,8 +69,8 @@
   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));
+  padding-block: var(--lmvz-dimension-8-2, clamp(0.13rem, 0.03rem + 0.39vw, 0.5rem));
+  padding-inline: var(--lmvz-dimension-10-4, clamp(0.25rem, 0.16rem + 0.39vw, 0.63rem));
   border-radius: var(--lmvz-semantic-border-radius-round, 999px);
   /* WCAG 2.5.5 AAA: 44px minimum touch target */
   /* min-block-size: 44px;  */
@@ -124,13 +124,13 @@ label {
   cursor: pointer;
 }
 .helper-text {
-  font: var(--lmvz-typography-body-sm, 400 clamp(0.69rem, 0.67rem + 0.06vw, 0.75rem) / 1.5 Router);
+  font: var(--lmvz-typography-body-sm, 400 clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem) / 1.5 Router);
   /* font-weight: 400 per DS token standard (body-sm). Note: lmvz-input.css [role='status'] incorrectly uses font-weight: 500 — DS inconsistency, see lmvz-input.css line ~153 */
   color: var(--checkbox-helper-color);
   margin-block-start: 2px;
 }
 .error-text {
-  font: var(--lmvz-typography-body-sm, 400 clamp(0.69rem, 0.67rem + 0.06vw, 0.75rem) / 1.5 Router);
+  font: var(--lmvz-typography-body-sm, 400 clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem) / 1.5 Router);
   color: var(--checkbox-error-color);
   display: block;
   margin-block-start: 4px;

package/collection/components/lmvz-chip/lmvz-chip.css

@@ -1,13 +1,13 @@
 :host {
   --lmvz-chip-border-color: var(--lmvz-semantic-color-status-on-neutral-subtle, #d4d4d4);
   --lmvz-chip-background-color: var(--lmvz-semantic-color-status-neutral, #fcfcfc);
-  --lmvz-chip-foreground-color: var(--lmvz-semantic-color-status-on-neutral, #545454);
+  --lmvz-chip-foreground-color: var(--lmvz-semantic-color-status-on-neutral, #000000);
 
-  padding-block: var(--lmvz-dimension-4-6, clamp(0.25rem, 0.22rem + 0.13vw, 0.38rem));
-  padding-inline: var(--lmvz-dimension-8-10, clamp(0.5rem, 0.47rem + 0.13vw, 0.63rem));
+  padding-block: var(--lmvz-dimension-6-4, clamp(0.25rem, 0.22rem + 0.13vw, 0.38rem));
+  padding-inline: var(--lmvz-dimension-10-8, clamp(0.5rem, 0.47rem + 0.13vw, 0.63rem));
   border: 1px solid var(--lmvz-chip-border-color);
   border-radius: var(--lmvz-semantic-border-radius-round, 999px);
-  font: var(--lmvz-typography-body-xs-strong, 500 clamp(0.63rem, 0.61rem + 0.06vw, 0.69rem) / 1.5
+  font: var(--lmvz-typography-body-xs-strong, 500 clamp(0.63rem, 0.59rem + 0.13vw, 0.75rem) / 1.5
     Router);
   background-color: var(--lmvz-chip-background-color);
   color: var(--lmvz-chip-foreground-color);
@@ -15,7 +15,7 @@
   display: inline-flex;
   align-items: center;
   justify-content: center;
-  gap: var(--lmvz-dimension-4-6, clamp(0.25rem, 0.22rem + 0.13vw, 0.38rem));
+  gap: var(--lmvz-dimension-6-4, clamp(0.25rem, 0.22rem + 0.13vw, 0.38rem));
 
   /* enable truncated content */
   box-sizing: border-box;
@@ -32,11 +32,11 @@
 }
 
 :host([size='small']) {
-  padding-block: var(--lmvz-dimension-2-4, clamp(0.13rem, 0.09rem + 0.13vw, 0.25rem));
-  padding-inline: var(--lmvz-dimension-6-8, clamp(0.38rem, 0.34rem + 0.13vw, 0.5rem));
+  padding-block: var(--lmvz-dimension-4-2, clamp(0.13rem, 0.09rem + 0.13vw, 0.25rem));
+  padding-inline: var(--lmvz-dimension-8-6, clamp(0.38rem, 0.34rem + 0.13vw, 0.5rem));
   font: var(--lmvz-typography-body-2xs-strong, 500 clamp(0.5rem, 0.47rem + 0.13vw, 0.63rem) / 1.5
     Router);
-  gap: var(--lmvz-dimension-2-4, clamp(0.13rem, 0.09rem + 0.13vw, 0.25rem));
+  gap: var(--lmvz-dimension-4-2, clamp(0.13rem, 0.09rem + 0.13vw, 0.25rem));
 }
 
 ::slotted(*) {
@@ -48,11 +48,11 @@
 
 ::slotted(lmvz-icon) {
   --lmvz-component-color: var(--lmvz-chip-foreground-color);
-  --lmvz-component-size: var(--lmvz-dimension-12-14, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem));
+  --lmvz-component-size: var(--lmvz-dimension-14-12, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem));
 }
 
 :host([size='small']) ::slotted(lmvz-icon) {
-  --lmvz-component-size: var(--lmvz-dimension-10-12, clamp(0.63rem, 0.59rem + 0.13vw, 0.75rem));
+  --lmvz-component-size: var(--lmvz-dimension-12-10, clamp(0.63rem, 0.59rem + 0.13vw, 0.75rem));
 }
 
 :host([type='active']) {
@@ -62,25 +62,25 @@
 }
 
 :host([type='warning']) {
-  --lmvz-chip-border-color: var(--lmvz-semantic-color-status-on-warning-subtle, #ffdf75);
-  --lmvz-chip-background-color: var(--lmvz-semantic-color-status-warning, #fffbf0);
-  --lmvz-chip-foreground-color: var(--lmvz-semantic-color-status-on-warning, #7a5e00);
+  --lmvz-chip-border-color: var(--lmvz-semantic-color-status-on-warning-subtle, #e6b000);
+  --lmvz-chip-background-color: var(--lmvz-semantic-color-status-warning, #ffeeb8);
+  --lmvz-chip-foreground-color: var(--lmvz-semantic-color-status-on-warning, #614a00);
 }
 
 :host([type='success']) {
-  --lmvz-chip-border-color: var(--lmvz-semantic-color-status-on-success-subtle, #a5dad3);
-  --lmvz-chip-background-color: var(--lmvz-semantic-color-status-success, #f1f9f8);
-  --lmvz-chip-foreground-color: var(--lmvz-semantic-color-status-on-success, #37867c);
+  --lmvz-chip-border-color: var(--lmvz-semantic-color-status-on-success-subtle, #4eb6a9);
+  --lmvz-chip-background-color: var(--lmvz-semantic-color-status-success, #c2e6e1);
+  --lmvz-chip-foreground-color: var(--lmvz-semantic-color-status-on-success, #28625b);
 }
 
 :host([type='error']) {
-  --lmvz-chip-border-color: var(--lmvz-semantic-color-status-on-danger-subtle, #f7bfc2);
-  --lmvz-chip-background-color: var(--lmvz-semantic-color-status-danger, #fdf1f2);
-  --lmvz-chip-foreground-color: var(--lmvz-semantic-color-status-on-danger, #e52a31);
+  --lmvz-chip-border-color: var(--lmvz-semantic-color-status-on-danger-subtle, #e8454b);
+  --lmvz-chip-background-color: var(--lmvz-semantic-color-status-danger, #fbdfe0);
+  --lmvz-chip-foreground-color: var(--lmvz-semantic-color-status-on-danger, #a31419);
 }
 
 :host([type='neutral']) {
   --lmvz-chip-border-color: var(--lmvz-semantic-color-status-on-neutral-subtle, #d4d4d4);
   --lmvz-chip-background-color: var(--lmvz-semantic-color-status-neutral, #fcfcfc);
-  --lmvz-chip-foreground-color: var(--lmvz-semantic-color-status-on-neutral, #545454);
+  --lmvz-chip-foreground-color: var(--lmvz-semantic-color-status-on-neutral, #000000);
 }

package/collection/components/lmvz-header/lmvz-header.css

@@ -8,14 +8,14 @@
 
   background-color: var(--lmvz-semantic-color-surface-primary, #ffffff);
 
-  --lmvz-header-x-spacing-level-1: var(--lmvz-dimension-8-28, clamp(0.5rem, 0.2rem + 1.29vw, 1.75rem));
+  --lmvz-header-x-spacing-level-1: var(--lmvz-dimension-28-8, clamp(0.5rem, 0.2rem + 1.29vw, 1.75rem));
   --lmvz-header-x-spacing-level-2: var(--lmvz-component-buttongroup-wrapper-gap-x, clamp(0.25rem, 0.16rem + 0.39vw, 0.63rem));
 
-  padding: var(--lmvz-dimension-8-16, clamp(0.5rem, 0.38rem + 0.52vw, 1rem)) var(--lmvz-header-x-spacing-level-1);
+  padding: var(--lmvz-dimension-16-8, clamp(0.5rem, 0.38rem + 0.52vw, 1rem)) var(--lmvz-header-x-spacing-level-1);
   gap: var(--lmvz-header-x-spacing-level-1);
 
   .brand {
-    /* min-width: var(--lmvz-dimension-48-96); */
+    /* min-width: var(--lmvz-dimension-96-48); */
     display: inline-flex;
     justify-content: center;
     align-items: center;

package/collection/components/lmvz-header/lmvz-header.js

@@ -1,6 +1,6 @@
 import { h, Host } from "@stencil/core";
 import { AriaValidationController } from "../../utils/aria/aria-validation-controller";
-import { DirectionalFocusController } from "../../utils/aria/list-keyboard-controller";
+import { DirectionalFocusController } from "../../utils/aria/directional-focus-controller";
 import { ReactiveControllerHost } from "../../utils/stencil/reactive-controller-host";
 import logo from "../../assets/icons/Logo.svg";
 export class LmvzHeader extends ReactiveControllerHost {
@@ -33,6 +33,9 @@ export class LmvzHeader extends ReactiveControllerHost {
     handleActiveNavChange() {
         this.updateElementsActive();
     }
+    async initFocus() {
+        this.keyboardNavigationController.initFocus();
+    }
     componentDidLoad() {
         this.primarySlot?.addEventListener('slotchange', this.handlePrimaryNavItemsChange.bind(this));
         this.handlePrimaryNavItemsChange();
@@ -84,7 +87,7 @@ export class LmvzHeader extends ReactiveControllerHost {
         }
     }
     render() {
-        return (h(Host, { key: '5730219e990fc0f131ffacc7c88e6a5311553399', onFocus: this.delegateFocus.bind(this) }, h("div", { key: '7285f2dcac7d60c5d93328aa0e2fe8aa6b7b379c', class: "brand" }, h("slot", { key: 'd06d953ee82eab20da3f383c15032bcbe8803ff9', name: "brand" }, h("img", { key: 'd2441ce0efbf99c05f6344051703a96ffb376450', id: "fallback-logo-lmvz", src: logo, alt: "Lehrmittelverlag Z\u00FCrich" }))), h("nav", { key: '7f092938728af5cb6568383a6622df49f222dc93', "aria-label": "Hauptnavigation" }, h("div", { key: 'caa56893d6185aebb89661e62a555407675ccc2a', role: "menubar", class: "primary-menubar" }, h("slot", { key: '90684f49cd3d53e20a63d4ebc37ec24e630bc313', name: "nav-primary", ref: (el) => (this.primarySlot = el) }), h("div", { key: 'ead46c08c6833565a55cd7af27fbece4e4468a03', role: "menu", id: "nav-secondary", class: "secondary-menubar", hidden: !this.lmvzActiveNav, ref: (el) => (this.secondaryNav = el) }, h("slot", { key: '3f2ba617d9ed78abb9ab94b9515b02bb6836385a', name: this.secondarySlotName, ref: (el) => (this.secondarySlot = el) })))), h("div", { key: '6fc79122baa3fd95992cbf30a465c3b40438a18f', class: "actions" }, h("slot", { key: 'c427f5a3ad693169e267060b9076086fd0e37670', name: "actions" }))));
+        return (h(Host, { key: 'ce4b8cf9f7687e4af97d45908e2f0e484b90684f', onFocus: this.delegateFocus.bind(this) }, h("div", { key: 'a2213d8038d126e47262c4ec18071dd4302152db', class: "brand" }, h("slot", { key: '68a0a1e2b21859d78d2f9a7d3f5c86020c52c225', name: "brand" }, h("img", { key: 'd0a878bc4c9f7a3460e857fb5aa52f1d942a0423', id: "fallback-logo-lmvz", src: logo, alt: "Lehrmittelverlag Z\u00FCrich" }))), h("nav", { key: '687791624d6ced477bc0cce73ce97b26c7d03af0', "aria-label": "Hauptnavigation" }, h("div", { key: 'a9e8fa4a57e619a3d3b1056bfc0d5df74e89f630', role: "menubar", class: "primary-menubar" }, h("slot", { key: 'f75f0a3bed2267aff902490f1905c67ad1b7e6be', name: "nav-primary", ref: (el) => (this.primarySlot = el) }), h("div", { key: '3cf2d099bed99e4ba7b32a2f3171c69663785012', role: "menu", id: "nav-secondary", class: "secondary-menubar", hidden: !this.lmvzActiveNav, ref: (el) => (this.secondaryNav = el) }, h("slot", { key: '85dbe77ea8ab62aa400640495e11e2d174ca5210', name: this.secondarySlotName, ref: (el) => (this.secondarySlot = el) })))), h("div", { key: 'cf5d135a5b969af6a2bbb5432a10f8e1b9af1dca', class: "actions" }, h("slot", { key: '1a0323668942151c071a24238039c7a216358363', name: "actions" }))));
     }
     static get is() { return "lmvz-header"; }
     static get encapsulation() { return "shadow"; }
@@ -141,6 +144,27 @@ export class LmvzHeader extends ReactiveControllerHost {
             }
         };
     }
+    static get methods() {
+        return {
+            "initFocus": {
+                "complexType": {
+                    "signature": "() => Promise<void>",
+                    "parameters": [],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<void>"
+                },
+                "docs": {
+                    "text": "Programmatically set focus to the first managed element.",
+                    "tags": []
+                }
+            }
+        };
+    }
     static get elementRef() { return "el"; }
     static get watchers() {
         return [{

package/collection/components/lmvz-icon/lmvz-icon.css

@@ -45,7 +45,7 @@
 
 :host([size='lg']) {
   svg {
-    --lmvz-icon-size: var(--lmvz-component-icon-size-lg, clamp(1.5rem, 1.44rem + 0.26vw, 1.75rem));
+    --lmvz-icon-size: var(--lmvz-component-icon-size-lg, clamp(1.25rem, 1.19rem + 0.26vw, 1.5rem));
   }
 }
 

package/collection/components/lmvz-input/lmvz-input.css

@@ -44,7 +44,7 @@
   --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-hover: var(--lmvz-semantic-color-border-hover, #a1a1a1);
   --input-border-color-focus: var(--lmvz-semantic-color-border-active, #0f8acc);
   --input-border-width: var(--lmvz-semantic-border-width-default, 1px);
 
@@ -57,7 +57,7 @@
   --label-color: var(--lmvz-semantic-color-on-surface-input-secondary, #545454);
   --input-text-color: var(--lmvz-semantic-color-on-surface-input-primary, #000000);
   --helper-text-color: var(--lmvz-semantic-color-on-surface-input-secondary, #545454);
-  --error-text-color: var(--lmvz-semantic-color-status-on-danger, #e52a31);
+  --error-text-color: var(--lmvz-semantic-color-status-on-danger, #a31419);
 
   --label-minimized-bg: var(--input-bg);
   --label-minimized-padding-x: 4px;
@@ -70,7 +70,7 @@
   --input-height: var(--lmvz-component-input-size-sm, clamp(2rem, 1.94rem + 0.26vw, 2.25rem));
   --input-padding-x: var(--lmvz-component-input-padding-sm, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem));
   --input-gap: var(--lmvz-component-input-gap-sm, clamp(0.38rem, 0.31rem + 0.26vw, 0.63rem));
-  --input-font-size: var(--lmvz-component-body-sm-font-size, clamp(0.69rem, 0.67rem + 0.06vw, 0.75rem));
+  --input-font-size: var(--lmvz-component-body-sm-font-size, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem));
 }
 :host([size='md']) {
   --input-height: var(--lmvz-component-input-size-md, clamp(2.5rem, 2.44rem + 0.26vw, 2.75rem));

package/collection/components/lmvz-link/lmvz-link.css

@@ -5,15 +5,17 @@
 a {
   display: inline-flex;
   align-items: center;
-  gap: var(--lmvz-dimension-4-6, clamp(0.25rem, 0.22rem + 0.13vw, 0.38rem));
-  padding-inline: var(--lmvz-dimension-8-12, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem)) var(--lmvz-dimension-4-8, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem));
-  padding-block: var(--lmvz-dimension-6-8, clamp(0.38rem, 0.34rem + 0.13vw, 0.5rem));
+  gap: var(--lmvz-dimension-6-4, clamp(0.25rem, 0.22rem + 0.13vw, 0.38rem));
+  padding-inline: var(--lmvz-dimension-12-8, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem)) var(--lmvz-dimension-8-4, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem));
+  padding-block: var(--lmvz-dimension-8-6, clamp(0.38rem, 0.34rem + 0.13vw, 0.5rem));
   border-radius: var(--lmvz-semantic-border-radius-round, 999px);
   color: var(--lmvz-semantic-color-int-on-tertiary, #000000);
   font: var(--lmvz-typography-body-md-strong, 500 clamp(0.88rem, 0.84rem + 0.13vw, 1rem) / 1.5
     Router);
   text-decoration: underline;
-  transition: background-color 0.15s ease, color 0.15s ease;
+  transition:
+    background-color 0.15s ease,
+    color 0.15s ease;
 }
 
 a:hover {

package/collection/components/lmvz-message/lmvz-message.css

@@ -4,8 +4,8 @@
   align-items: flex-start;
   width: 100%;
 
-  padding: var(--lmvz-dimension-10-12, clamp(0.63rem, 0.59rem + 0.13vw, 0.75rem)) var(--lmvz-dimension-12-14, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem));
-  gap: var(--lmvz-dimension-8-12, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem));
+  padding: var(--lmvz-dimension-12-10, clamp(0.63rem, 0.59rem + 0.13vw, 0.75rem)) var(--lmvz-dimension-14-12, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem));
+  gap: var(--lmvz-dimension-12-8, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem));
 
   border: var(--lmvz-semantic-border-width-default, 1px) solid;
   border-radius: var(--lmvz-semantic-border-radius-md, 6px);
@@ -24,9 +24,9 @@
 }
 
 :host([type='warning']) {
-  background-color: var(--lmvz-semantic-color-status-warning, #fffbf0);
-  border-color: var(--lmvz-semantic-color-status-on-warning-subtle, #ffdf75);
-  color: var(--lmvz-semantic-color-status-on-warning, #7a5e00);
+  background-color: var(--lmvz-semantic-color-status-warning, #ffeeb8);
+  border-color: var(--lmvz-semantic-color-status-on-warning-subtle, #e6b000);
+  color: var(--lmvz-semantic-color-status-on-warning, #614a00);
 }
 
 .leading-icon {