@lmvz-ds/components 0.39.0 → 0.41.0

package/types/components.d.ts

@@ -5,6 +5,12 @@ export declare namespace Button {
     export type Variant = LmvzDS.Variant;
 }
 
+export declare namespace Card {
+    export type Size = (typeof cardSizes)[number];
+}
+
+declare const cardSizes: readonly ["large", "small"];
+
 export declare namespace Chip {
     export type Type = (typeof chipTypes)[number];
     export type Size = (typeof chipSizes)[number];
@@ -111,24 +117,36 @@ export declare namespace Components {
          */
         "stacked": boolean;
     }
+    /**
+     * A card composes an image, title, description, an optional chip, and an optional single action into a self-contained content unit.
+     */
     export interface LmvzCard {
         /**
-         * Card title (required)
+         * Label for the card's single action button. The action row renders only when this is a non-empty string.
          */
-        "cardTitle": string;
+        "actionLabel"?: string;
         /**
-         * Optional description
+         * Card title text, rendered as the fallback `<h3>` for the `card-title` slot. Ignored when a heading is slotted into `card-title`. One of `cardTitle` or a slotted heading should be supplied.
+         */
+        "cardTitle"?: string;
+        /**
+         * Optional description text.
          */
         "description"?: string;
         /**
-         * Optional image URL; placeholder used if omitted
+         * Accessible alt text for the image.
+         * @default ''
+         */
+        "imageAlt": string;
+        /**
+         * Optional image URL; falls back to a bundled placeholder graphic when unset.
          */
         "imageUrl"?: string;
         /**
-         * Primary action button label
-         * @default ''
+         * Size variant of the card. Invalid values are normalized to `large` at runtime.
+         * @default 'large'
          */
-        "primaryActionLabel": string;
+        "size": Card.Size;
     }
     /**
      * Checkbox component with form association, ARIA validation, and accessible label support.
@@ -866,6 +884,10 @@ export declare namespace Components {
          * @default false
          */
         "disabled": boolean;
+        /**
+         * The `id` of the target `lmvz-tab-panel` this tab controls. When omitted, pairing falls back to DOM position.
+         */
+        "panel"?: string;
         /**
          * Whether this tab is currently selected. Set by the parent `lmvz-tabs` component — do not set manually.
          * @default false
@@ -875,11 +897,6 @@ export declare namespace Components {
          * Unique value that identifies this tab within its `lmvz-tabs` parent. The parent uses this to track the selected tab.
          */
         "value": string;
-        /**
-         * Vertical orientation context. Set by the parent `lmvz-tabs` when `orientation="vertical"` — do not set manually. When true the selection indicator moves to the inline-start edge.
-         * @default false
-         */
-        "vertical": boolean;
     }
     /**
      * The semantics and state owner for the WAI-ARIA tabs pattern.
@@ -890,9 +907,10 @@ export declare namespace Components {
      * - Horizontal scroll overflow (horizontal mode only)
      * - Disabled-tab skipping and nearest-enabled fallback
      * - Child registration and panel linkage via `aria-controls` / `aria-labelledby`
-     * Panels are consumer-authored light-DOM elements. Associate each panel with
-     * its tab by adding an `id` attribute — either matching `lmvz-tab[panel]` or
-     * derived positionally when no explicit id is provided.
+     * Panels are consumer-authored light-DOM elements. Each `lmvz-tab` can declare
+     * a `panel` attribute whose value matches the target `lmvz-tab-panel`'s `id`,
+     * resolving the pairing explicitly. Tabs without a `panel` attribute fall back
+     * to positional pairing (tab N pairs with panel N).
      * @event lmvzChange - Fired when a tab is activated. Detail: `{ value: string }`.
      * @example ```html
      * <lmvz-tabs value="home">
@@ -916,11 +934,6 @@ export declare namespace Components {
          * Programmatically set focus to the first managed element.
          */
         "initFocus": () => Promise<void>;
-        /**
-         * Layout and keyboard-navigation orientation.
-         * @default 'horizontal'
-         */
-        "orientation": 'horizontal' | 'vertical';
         /**
          * Wires `aria-controls` on each tab and `aria-labelledby` on each panel using the provided ordered array of `[tabId, panelId]` pairs. Callers only need this for explicit control; `lmvz-tabs` wires positional pairs automatically on `slotchange`.
          */
@@ -1146,28 +1159,40 @@ export declare namespace JSX {
          */
         "stacked"?: boolean;
     }
+    /**
+     * A card composes an image, title, description, an optional chip, and an optional single action into a self-contained content unit.
+     */
     export interface LmvzCard {
         /**
-         * Card title (required)
+         * Label for the card's single action button. The action row renders only when this is a non-empty string.
          */
-        "cardTitle": string;
+        "actionLabel"?: string;
+        /**
+         * Card title text, rendered as the fallback `<h3>` for the `card-title` slot. Ignored when a heading is slotted into `card-title`. One of `cardTitle` or a slotted heading should be supplied.
+         */
+        "cardTitle"?: string;
         /**
-         * Optional description
+         * Optional description text.
          */
         "description"?: string;
         /**
-         * Optional image URL; placeholder used if omitted
+         * Accessible alt text for the image.
+         * @default ''
+         */
+        "imageAlt"?: string;
+        /**
+         * Optional image URL; falls back to a bundled placeholder graphic when unset.
          */
         "imageUrl"?: string;
         /**
-         * Event emitted when primary button is clicked
+         * Emitted once per activation of the action button.
          */
-        "onPrimaryAction"?: (event: LmvzCardCustomEvent<PointerEvent>) => void;
+        "onLmvzCardAction"?: (event: LmvzCardCustomEvent<void>) => void;
         /**
-         * Primary action button label
-         * @default ''
+         * Size variant of the card. Invalid values are normalized to `large` at runtime.
+         * @default 'large'
          */
-        "primaryActionLabel"?: string;
+        "size"?: Card.Size;
     }
     /**
      * Checkbox component with form association, ARIA validation, and accessible label support.
@@ -1866,6 +1891,10 @@ export declare namespace JSX {
          * @default false
          */
         "disabled"?: boolean;
+        /**
+         * The `id` of the target `lmvz-tab-panel` this tab controls. When omitted, pairing falls back to DOM position.
+         */
+        "panel"?: string;
         /**
          * Whether this tab is currently selected. Set by the parent `lmvz-tabs` component — do not set manually.
          * @default false
@@ -1875,11 +1904,6 @@ export declare namespace JSX {
          * Unique value that identifies this tab within its `lmvz-tabs` parent. The parent uses this to track the selected tab.
          */
         "value": string;
-        /**
-         * Vertical orientation context. Set by the parent `lmvz-tabs` when `orientation="vertical"` — do not set manually. When true the selection indicator moves to the inline-start edge.
-         * @default false
-         */
-        "vertical"?: boolean;
     }
     /**
      * The semantics and state owner for the WAI-ARIA tabs pattern.
@@ -1890,9 +1914,10 @@ export declare namespace JSX {
      * - Horizontal scroll overflow (horizontal mode only)
      * - Disabled-tab skipping and nearest-enabled fallback
      * - Child registration and panel linkage via `aria-controls` / `aria-labelledby`
-     * Panels are consumer-authored light-DOM elements. Associate each panel with
-     * its tab by adding an `id` attribute — either matching `lmvz-tab[panel]` or
-     * derived positionally when no explicit id is provided.
+     * Panels are consumer-authored light-DOM elements. Each `lmvz-tab` can declare
+     * a `panel` attribute whose value matches the target `lmvz-tab-panel`'s `id`,
+     * resolving the pairing explicitly. Tabs without a `panel` attribute fall back
+     * to positional pairing (tab N pairs with panel N).
      * @event lmvzChange - Fired when a tab is activated. Detail: `{ value: string }`.
      * @example ```html
      * <lmvz-tabs value="home">
@@ -1908,11 +1933,6 @@ export declare namespace JSX {
          * Emitted when a tab is activated. Detail: `{ value: string }`.
          */
         "onLmvzChange"?: (event: LmvzTabsCustomEvent<{ value: string }>) => void;
-        /**
-         * Layout and keyboard-navigation orientation.
-         * @default 'horizontal'
-         */
-        "orientation"?: 'horizontal' | 'vertical';
         /**
          * The `value` of the currently selected tab.
          */
@@ -1983,10 +2003,12 @@ export declare namespace JSX {
         "hasActions": boolean;
     }
     export interface LmvzCardAttributes {
+        "size": Card.Size;
         "cardTitle": string;
-        "imageUrl": string;
         "description": string;
-        "primaryActionLabel": string;
+        "imageUrl": string;
+        "imageAlt": string;
+        "actionLabel": string;
     }
     export interface LmvzCheckboxAttributes {
         "label": string;
@@ -2132,11 +2154,10 @@ export declare namespace JSX {
         "value": string;
         "disabled": boolean;
         "selected": boolean;
-        "vertical": boolean;
+        "panel": string;
     }
     export interface LmvzTabsAttributes {
         "value": string;
-        "orientation": 'horizontal' | 'vertical';
     }
     export interface LmvzToggleAttributes {
         "label": string;
@@ -2153,7 +2174,7 @@ export declare namespace JSX {
         "lmvz-action-list": Omit<LmvzActionList, keyof LmvzActionListAttributes> & { [K in keyof LmvzActionList & keyof LmvzActionListAttributes]?: LmvzActionList[K] } & { [K in keyof LmvzActionList & keyof LmvzActionListAttributes as `attr:${K}`]?: LmvzActionListAttributes[K] } & { [K in keyof LmvzActionList & keyof LmvzActionListAttributes as `prop:${K}`]?: LmvzActionList[K] };
         "lmvz-button": Omit<LmvzButton, keyof LmvzButtonAttributes> & { [K in keyof LmvzButton & keyof LmvzButtonAttributes]?: LmvzButton[K] } & { [K in keyof LmvzButton & keyof LmvzButtonAttributes as `attr:${K}`]?: LmvzButtonAttributes[K] } & { [K in keyof LmvzButton & keyof LmvzButtonAttributes as `prop:${K}`]?: LmvzButton[K] };
         "lmvz-button-group": Omit<LmvzButtonGroup, keyof LmvzButtonGroupAttributes> & { [K in keyof LmvzButtonGroup & keyof LmvzButtonGroupAttributes]?: LmvzButtonGroup[K] } & { [K in keyof LmvzButtonGroup & keyof LmvzButtonGroupAttributes as `attr:${K}`]?: LmvzButtonGroupAttributes[K] } & { [K in keyof LmvzButtonGroup & keyof LmvzButtonGroupAttributes as `prop:${K}`]?: LmvzButtonGroup[K] };
-        "lmvz-card": Omit<LmvzCard, keyof LmvzCardAttributes> & { [K in keyof LmvzCard & keyof LmvzCardAttributes]?: LmvzCard[K] } & { [K in keyof LmvzCard & keyof LmvzCardAttributes as `attr:${K}`]?: LmvzCardAttributes[K] } & { [K in keyof LmvzCard & keyof LmvzCardAttributes as `prop:${K}`]?: LmvzCard[K] } & OneOf<"cardTitle", LmvzCard["cardTitle"], LmvzCardAttributes["cardTitle"]>;
+        "lmvz-card": Omit<LmvzCard, keyof LmvzCardAttributes> & { [K in keyof LmvzCard & keyof LmvzCardAttributes]?: LmvzCard[K] } & { [K in keyof LmvzCard & keyof LmvzCardAttributes as `attr:${K}`]?: LmvzCardAttributes[K] } & { [K in keyof LmvzCard & keyof LmvzCardAttributes as `prop:${K}`]?: LmvzCard[K] };
         "lmvz-checkbox": Omit<LmvzCheckbox, keyof LmvzCheckboxAttributes> & { [K in keyof LmvzCheckbox & keyof LmvzCheckboxAttributes]?: LmvzCheckbox[K] } & { [K in keyof LmvzCheckbox & keyof LmvzCheckboxAttributes as `attr:${K}`]?: LmvzCheckboxAttributes[K] } & { [K in keyof LmvzCheckbox & keyof LmvzCheckboxAttributes as `prop:${K}`]?: LmvzCheckbox[K] } & OneOf<"label", LmvzCheckbox["label"], LmvzCheckboxAttributes["label"]>;
         "lmvz-chip": Omit<LmvzChip, keyof LmvzChipAttributes> & { [K in keyof LmvzChip & keyof LmvzChipAttributes]?: LmvzChip[K] } & { [K in keyof LmvzChip & keyof LmvzChipAttributes as `attr:${K}`]?: LmvzChipAttributes[K] } & { [K in keyof LmvzChip & keyof LmvzChipAttributes as `prop:${K}`]?: LmvzChip[K] };
         "lmvz-datepicker": Omit<LmvzDatepicker, keyof LmvzDatepickerAttributes> & { [K in keyof LmvzDatepicker & keyof LmvzDatepickerAttributes]?: LmvzDatepicker[K] } & { [K in keyof LmvzDatepicker & keyof LmvzDatepickerAttributes as `attr:${K}`]?: LmvzDatepickerAttributes[K] } & { [K in keyof LmvzDatepicker & keyof LmvzDatepickerAttributes as `prop:${K}`]?: LmvzDatepicker[K] };

package/components/p-0ctLESas.js

@@ -1 +0,0 @@
-const a=["primary","secondary","tertiary","danger"],s=["small","default","large"],t=["xs","sm","md","lg"],e=[...t,"xl"],r=["text","email","password","tel","url","search","number"],l=["sm","md","lg"],n=s,o=[...t,"inherit"],m=["thin","medium","bold"],d=["active","warning","success","error","neutral"],i=["default","small"],u=["internal","external"],c=["neutral","warning"],g=["success","warning","error"],p=["low","normal","high"],w=["timeout","manual","action","overridden","swallowed"],b=["top","bottom","start","end","top-start","top-end","bottom-start","bottom-end"],h=["sm","md","lg"];export{t as a,l as b,n as c,o as d,m as e,d as f,i as g,g as h,r as i,p as j,w as k,u as l,c as m,h as n,b as p,s,e as t,a as v}

package/lmvz-components/p-0ctLESas.js

@@ -1 +0,0 @@
-const a=["primary","secondary","tertiary","danger"],s=["small","default","large"],t=["xs","sm","md","lg"],e=[...t,"xl"],r=["text","email","password","tel","url","search","number"],l=["sm","md","lg"],n=s,o=[...t,"inherit"],m=["thin","medium","bold"],d=["active","warning","success","error","neutral"],i=["default","small"],u=["internal","external"],c=["neutral","warning"],g=["success","warning","error"],p=["low","normal","high"],w=["timeout","manual","action","overridden","swallowed"],b=["top","bottom","start","end","top-start","top-end","bottom-start","bottom-end"],h=["sm","md","lg"];export{t as a,l as b,n as c,o as d,m as e,d as f,i as g,g as h,r as i,p as j,w as k,u as l,c as m,h as n,b as p,s,e as t,a as v}

package/lmvz-components/p-1ba1af8d.entry.js

@@ -1 +0,0 @@
-import{g as t,r as e,c as s,h as i,H as a}from"./p-DVab4vzV.js";import{D as n}from"./p-BlkpdeQI.js";import{R as l}from"./p-CICeIanv.js";import"./p-BA3wizqg.js";import"./p-DIyiticz.js";let o=0;const r=class extends l{get el(){return t(this)}instanceId=++o;tabSlotEl;panelSlotEl;tablistEl;focusController=new n(this,{orientation:"horizontal",manageTabIndex:!0,enableHomeAndEnd:!0,listenerTarget:this.tablistEl});value;orientation="horizontal";lmvzChange;resolvedValue;constructor(t){super(),e(this,t),this.lmvzChange=s(this,"lmvzChange",7),this.addController(this.focusController)}componentWillLoad(){super.componentWillLoad(),this.syncOrientation()}componentDidLoad(){this.tabSlotEl?.addEventListener("slotchange",this.handleTabSlotChange),this.panelSlotEl?.addEventListener("slotchange",this.handlePanelSlotChange),this.el.addEventListener("lmvzTabReady",this.handleTabReady),this.handleTabSlotChange(),this.tablistEl&&this.focusController.updateListenerTarget(this.tablistEl),super.componentDidLoad()}disconnectedCallback(){this.el.removeEventListener("lmvzTabReady",this.handleTabReady),super.disconnectedCallback()}handleValueChange(t){this.applySelection(t)}handleOrientationChange(){this.syncOrientation(),this.syncFocusTargets(),this.syncTabOrientation()}async initFocus(){this.focusController.initFocus()}async activateTab(t){const e=this.findTabByValue(t);e&&!this.isTabDisabled(e)&&this.selectTab(t)}async getTabElements(){return this.slottedTabs}async setTabPanelIds(t){const e=this.slottedTabs,s=this.slottedPanels;t.forEach((([t,i],a)=>{const n=e[a],l=s[a],o=`${t}-btn`;if(n){n.id=t;const e=n.shadowRoot?.querySelector("button");e&&(e.id=o,e.setAttribute("aria-controls",i))}l&&(l.id=i,l.setAttribute("aria-labelledby",o))}))}get slottedTabs(){return(this.tabSlotEl?.assignedElements({flatten:!1})??[]).filter((t=>"lmvz-tab"===t.tagName.toLowerCase()))}get slottedPanels(){return this.panelSlotEl?.assignedElements({flatten:!1})??[]}handleTabSlotChange=()=>{this.syncFocusTargets(),this.syncTabOrientation(),this.wireAriaIds(),this.applySelection(this.value),this.updateIconTabsAttr()};handlePanelSlotChange=()=>{this.wireAriaIds(),this.applySelection(this.resolvedValue??this.value)};handleTabReady=()=>{this.syncFocusTargets(),this.wireAriaIds(),this.applySelection(this.resolvedValue??this.value),this.updateIconTabsAttr()};updateIconTabsAttr(){this.el.toggleAttribute("has-icon-tabs",this.slottedTabs.some((t=>t.hasAttribute("has-media"))))}syncFocusTargets(){const t=this.slottedTabs.map((t=>t.shadowRoot?.querySelector("button"))).filter((t=>!!t));this.focusController.updateElements(t)}syncOrientation(){this.removeController(this.focusController),this.focusController.hostDisconnected?.(),this.focusController=new n(this,{orientation:this.orientation,manageTabIndex:!0,enableHomeAndEnd:!0,listenerTarget:this.tablistEl}),this.addController(this.focusController),this.el.isConnected&&this.focusController.hostConnected?.()}syncTabOrientation(){const t="vertical"===this.orientation;this.slottedTabs.forEach((e=>{e.toggleAttribute("vertical",t)}))}wireAriaIds(){const t=this.slottedPanels,e=`lmvz-tabs-${this.instanceId}`;this.slottedTabs.forEach(((s,i)=>{const a=s.id||`${e}-tab-${i}`;s.id=a;const n=t[i];if(!n)return;const l=n.id||`${e}-panel-${i}`;n.id=l;const o=s.shadowRoot?.querySelector("button");o&&(o.setAttribute("aria-controls",l),o.setAttribute("id",`${a}-btn`)),n.setAttribute("role",n.getAttribute("role")??"tabpanel"),n.setAttribute("aria-labelledby",`${a}-btn`)}))}applySelection(t){const e=this.slottedTabs;if(!e.length)return;let s=this.findTabByValue(t);if(s&&!this.isTabDisabled(s)||(s=this.findNearestEnabled(t)??void 0),!s)return;const i=s.getAttribute("value")??"";this.resolvedValue=i,this.value!==i&&(this.value=i),e.forEach((t=>{const e=t.getAttribute("value")===i;t.toggleAttribute("selected",e);const s=t.shadowRoot?.querySelector("button");s&&s.setAttribute("aria-selected",String(e))})),this.slottedPanels.forEach(((t,s)=>{const a=e[s],n=a?.getAttribute("value")===i;t.toggleAttribute("hidden",!n)}));const a=s.shadowRoot?.querySelector("button");a&&this.focusController.setCurrentElement(a)}isTabDisabled(t){return t.hasAttribute("disabled")||!!t.disabled}findTabByValue(t){return this.slottedTabs.find((e=>e.getAttribute("value")===t))}findNearestEnabled(t){const e=this.slottedTabs,s=e.findIndex((e=>e.getAttribute("value")===t));for(let t=1;t<e.length;t++){const i=e[(s+t)%e.length];if(i&&!this.isTabDisabled(i))return i;const a=e[(s-t+e.length)%e.length];if(a&&!this.isTabDisabled(a))return a}}selectTab(t){t!==this.resolvedValue&&(this.applySelection(t),this.lmvzChange.emit({value:t}))}handleTabClick=t=>{const e=t.target.closest("lmvz-tab");if(!e)return;const s=e.getAttribute("value");s&&!this.isTabDisabled(e)&&this.selectTab(s)};handleKeydown=t=>{if("Enter"!==t.key&&" "!==t.key)return;const e=this.el.ownerDocument.activeElement;if(!e)return;let s=null;for(const t of this.slottedTabs)if(t===e){s=t;break}if(!s)return;const i=s.getAttribute("value");i&&!this.isTabDisabled(s)&&(t.preventDefault(),this.selectTab(i))};render(){return i(a,{key:"be4fe04b1374a2793d3b1e9a658a449474efdd03",onClick:this.handleTabClick,onKeydown:this.handleKeydown},i("div",{key:"d91015eddf16dfad5d49e942eb86e9f568978f34",role:"tablist","aria-orientation":this.orientation,class:"tablist",ref:t=>this.tablistEl=t},i("slot",{key:"be0990a7c668bc96a67c01561e3142ec028dabd0",ref:t=>this.tabSlotEl=t})),i("div",{key:"338323738dfdbb436d86cdb4f6041a67c1af433d",part:"panels-container",class:"panels-container"},i("slot",{key:"d225be099c8cb902776ce0a7dbf7dcb2aef2d03b",name:"panels",ref:t=>this.panelSlotEl=t})))}static get watchers(){return{value:[{handleValueChange:0}],orientation:[{handleOrientationChange:0}]}}};r.style=" @layer lmvz-ds.reset, lmvz-ds.theme, lmvz-ds.components, lmvz-ds.overrides;  @layer lmvz-ds.reset { body {   margin: 0; }  h1, h2, h3, h4, h5, h6 {   margin: 0; }  *[hidden] {   display: none !important; }  hr {   height: 0;   border: none;   margin: var(--lmvz-dimension-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); }  fieldset {   border: none;   margin: 0;   padding: 0; }  legend {   padding: 0;   display: block; }  } :host {   display: inline-block; } .tablist {   display: inline-flex;   flex-direction: row;   background: var(--lmvz-semantic-color-int-secondary, #f0f0f0);   border-radius: var(--lmvz-semantic-border-radius-round, 999px);      overflow: auto hidden;      scrollbar-width: none;  } .tablist::-webkit-scrollbar {   display: none;  } :host([has-icon-tabs]) .tablist {   gap: var(--lmvz-dimension-8-6, clamp(0.38rem, 0.34rem + 0.13vw, 0.5rem));   background: none;   border-radius: 0; }  :host([orientation='vertical']) .tablist {   flex-direction: column;   overflow: visible auto; }  ::slotted([role='tabpanel']) {   display: block; } ::slotted([role='tabpanel'][hidden]) {   display: none; } ";export{r as lmvz_tabs}

package/lmvz-components/p-3b7203a3.entry.js

@@ -1 +0,0 @@
-import{r as e,g as a,h as t,H as r}from"./p-DVab4vzV.js";const o=class{constructor(a){e(this,a)}get el(){return a(this)}mediaSlotEl;value;disabled=!1;selected=!1;vertical=!1;handleMediaSlotChange=()=>{this.el.toggleAttribute("has-media",(this.mediaSlotEl?.assignedElements()??[]).length>0)};componentDidLoad(){this.handleMediaSlotChange(),this.el.dispatchEvent(new CustomEvent("lmvzTabReady",{bubbles:!0,composed:!1}))}render(){return t(r,{key:"4380fe35cacb11bc7114664c126504e8f4fb09a0"},t("button",{key:"ac77443cbba5c94f864820088f60c0bac23d0775",part:"button",role:"tab",disabled:this.disabled,"aria-selected":String(this.selected),"aria-disabled":this.disabled?"true":void 0,tabIndex:0},t("slot",{key:"9988497505ca3effa6c41011ac408a5d25629ca1",name:"media",ref:e=>this.mediaSlotEl=e,onSlotchange:this.handleMediaSlotChange}),t("span",{key:"70566c46fba36b8717aa82917e45abd39cd7a2ea",class:"label"},t("slot",{key:"a595738c387ee2f4f77f6ccdfdfb0589751ce999"})),t("span",{key:"933758dc965d1151ca6a96367ea40290189384ad","aria-hidden":"true",part:"indicator",class:"indicator"})))}static get delegatesFocus(){return!0}};o.style=" @layer lmvz-ds.reset, lmvz-ds.theme, lmvz-ds.components, lmvz-ds.overrides;  @layer lmvz-ds.reset { body {   margin: 0; }  h1, h2, h3, h4, h5, h6 {   margin: 0; }  *[hidden] {   display: none !important; }  hr {   height: 0;   border: none;   margin: var(--lmvz-dimension-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); }  fieldset {   border: none;   margin: 0;   padding: 0; }  legend {   padding: 0;   display: block; }  } :host {   display: inline-block;   flex: none; } :host([disabled]) {   cursor: not-allowed;   pointer-events: none; } button {   --lmvz-tab-color: var(--lmvz-semantic-color-int-on-secondary, #000000);   --lmvz-tab-background: var(--lmvz-semantic-color-int-secondary, #f0f0f0);    position: relative;   display: inline-flex;   flex-direction: column;   align-items: center;   justify-content: center;   gap: var(--lmvz-component-component-spacing-0-default, 4px);    padding-top: var(--lmvz-dimension-12-8, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem));   padding-bottom: var(--lmvz-dimension-14-8, clamp(0.5rem, 0.41rem + 0.39vw, 0.88rem));   padding-inline: var(--lmvz-dimension-24-16, clamp(1rem, 0.88rem + 0.52vw, 1.5rem));    border: none;   border-radius: var(--lmvz-semantic-border-radius-round, 999px);   background: var(--lmvz-tab-background);   color: var(--lmvz-tab-color);    font: var(--lmvz-typography-body-md-strong, 500 clamp(0.88rem, 0.84rem + 0.13vw, 1rem) / 1.5     Router);   cursor: pointer;   white-space: nowrap;   transition:     background-color 0.15s ease,     color 0.15s ease; } button:focus-visible {   outline: var(--lmvz-ds-outline, 1px solid #0e7ab4);   outline-offset: var(--lmvz-ds-outline-offset, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem));   z-index: 1; } button:disabled {   opacity: var(--lmvz-component-input-disabled-opacity, 40%);   pointer-events: none;   cursor: not-allowed; } button:hover {   --lmvz-tab-background: var(--lmvz-semantic-color-int-tertiary-hover, #f0f0f0);   --lmvz-tab-color: var(--lmvz-semantic-color-int-on-secondary-hover, #000000); } button:active {   --lmvz-tab-background: var(--lmvz-semantic-color-int-tertiary-active, #e0e0e0);   --lmvz-tab-color: var(--lmvz-semantic-color-int-on-secondary-active, #000000); } :host([has-media]) {   --lmvz-tab-color: var(--lmvz-semantic-color-int-on-tertiary, #000000);   --lmvz-tab-background: var(--lmvz-semantic-color-int-tertiary, #ffffff); } :host([has-media]) button {   padding-top: var(--lmvz-dimension-18-16, clamp(1rem, 0.97rem + 0.13vw, 1.13rem));   padding-bottom: var(--lmvz-dimension-14-12, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem));   padding-inline: var(--lmvz-dimension-48-40, clamp(2.5rem, 2.38rem + 0.52vw, 3rem));   border-radius: var(--lmvz-semantic-border-radius-lg, 14px); } :host([has-media]) button:hover {   --lmvz-tab-color: var(--lmvz-semantic-color-int-on-tertiary-hover, #000000); } :host([has-media]) button:active {   --lmvz-tab-color: var(--lmvz-semantic-color-int-on-tertiary-active, #000000); } :host([selected]) button {   --lmvz-tab-color: var(--lmvz-semantic-color-status-on-active, #0e7ab4);   --lmvz-tab-background: var(--lmvz-semantic-color-status-active, #f6fbfe); } :host([selected][has-media]) button:hover, :host([selected][has-media]) button:active {   --lmvz-tab-color: var(--lmvz-semantic-color-status-on-active, #0e7ab4); } .indicator {      --lmvz-tab-indicator-size: 4px;    position: absolute;   background: linear-gradient(to right, var(--lmvz-semantic-color-gradient-main-1, #0e7ab4), var(--lmvz-semantic-color-gradient-main-2, #0e7ab4));   opacity: 0;   transition: opacity 0.15s ease;       inset-block-end: 0;   inset-inline: 0;   block-size: var(--lmvz-tab-indicator-size);   border-start-start-radius: 0;   border-start-end-radius: 0;   border-end-start-radius: var(--lmvz-tab-indicator-size);   border-end-end-radius: var(--lmvz-tab-indicator-size); } :host([selected][has-media]) .indicator {   opacity: 1; } :host([vertical]) button {   border-radius: var(--lmvz-semantic-border-radius-round, 999px); } :host([vertical]) .indicator {      inset-block: 0;   inset-inline: 0 auto;   inline-size: var(--lmvz-tab-indicator-size);   block-size: auto;   border-radius: 0 var(--lmvz-tab-indicator-size) var(--lmvz-tab-indicator-size) 0;   background: linear-gradient(to bottom, var(--lmvz-semantic-color-gradient-main-1, #0e7ab4), var(--lmvz-semantic-color-gradient-main-2, #0e7ab4)); } ::slotted(*) {   --lmvz-component-color: var(--lmvz-tab-color); } ::slotted(lmvz-icon) {   --lmvz-component-size: var(--lmvz-dimension-18-16, clamp(1rem, 0.97rem + 0.13vw, 1.13rem)); } :host([has-media]) ::slotted(lmvz-icon) {   --lmvz-component-size: var(--lmvz-component-icon-size-lg, clamp(1.25rem, 1.19rem + 0.26vw, 1.5rem)); } .label {   display: contents; } ";export{o as lmvz_tab}

package/lmvz-components/p-c884c76e.entry.js

@@ -1 +0,0 @@
-import{a as r,r as e,c as o,h as t,H as a}from"./p-DVab4vzV.js";const n=class{constructor(r){e(this,r),this.primaryAction=o(this,"primaryAction",7)}cardTitle;imageUrl;description;primaryActionLabel="";primaryAction;get fallbackImage(){return((e,o)=>{const t=function(...r){return r.filter(Boolean).join("/").replace("//","/").replace("/./","/")}("../../assets",o,e);try{return r(t)}catch{return console.warn(`Failed to create URL for asset "${e}" in path "${o}".\n           Please provide an absolute URL in your app's 'setAssetPath(...)' configuration! Falling back to a relative URL, which may work in some environments but is not guaranteed to be correct.`),new URL(t,import.meta?.url??window?.location?.origin??"")}})("card-placeholder.svg")}_onPrimaryClick(){this.primaryAction.emit()}_onOverflowClick(r){console.log(r)}render(){return t(a,{key:"1dd819fd7c752af8d15001c08f7f60c6ea7278b9",role:"article"},t("div",{key:"e0cc822e627b6bbe665e4faa705cc46a09bac7c6",class:"top"},t("div",{key:"db79cb5a67ebdd6097f985e4b4bd27665b6329ef",class:"image-wrapper",style:{backgroundImage:`url(${this.imageUrl??this.fallbackImage})`}},t("div",{key:"90facc8595ddbbf31e3768faa8254a82ab8d3e65",class:"chip-slot"},t("slot",{key:"cb2e6a1053aae2b2ca90c52c175e3c4174c89d23",name:"chip"})))),t("div",{key:"cb11069a329385178677e92d08044e0fe8e5b982",class:"bottom"},t("header",{key:"1e6076352124ca03de2fb13c17a565b4f492567e"},t("h2",{key:"73f11099fb751bd4f967dbe49b79763b6a8268f3",class:"title"},this.cardTitle)),t("p",{key:"36cf87b4c2004bff1e65feedd13e137d67115de3",class:"description"},this.description),t("div",{key:"6c1d82f4968ce8252307858e6ad0681274f06397",class:"actions"},t("button",{key:"0366e0caaf9235a3eaf7bfcab116e6a828fb248d",class:"primary",onClick:this._onPrimaryClick.bind(this),"data-testid":"primary"},this.primaryActionLabel),t("button",{key:"4f435e79d75a621d6fe065471a915b55308ad15d",class:"tertiary","aria-label":"More actions",onClick:this._onOverflowClick},t("span",{key:"7dec97e0b0ca58c40fc5308cc7863acafa8c5147",class:"icon-placeholder"},"...")))))}static get assetsDirs(){return["../../assets"]}};n.style="@layer lmvz-ds.reset, lmvz-ds.theme, lmvz-ds.components, lmvz-ds.overrides;  @layer lmvz-ds.theme {   @font-face {   font-family: Router;   src:     local('RouterBook-Regular'),     local('Router-Book'),     url('/assets/fonts/Router-Book.woff') format('woff');   font-weight: 400; }  @font-face {   font-family: Router;   src:     local('RouterMedium-Regular'),     local('Router-Medium'),     url('/assets/fonts/Router-Medium.woff') format('woff');   font-weight: 500; }  @font-face {   font-family: Router;   src:     local('RouterBold-Regular'),     local('Router-Bold'),     url('/assets/fonts/Router-Bold.woff') format('woff');   font-weight: 700; }  } @layer lmvz-ds.reset { body {   margin: 0; }  h1, h2, h3, h4, h5, h6 {   margin: 0; }  *[hidden] {   display: none !important; }  hr {   height: 0;   border: none;   margin: var(--lmvz-dimension-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); }  fieldset {   border: none;   margin: 0;   padding: 0; }  legend {   padding: 0;   display: block; }  } .sc-lmvz-card-h {               & {          & {           --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-secondary, #f0f0f0));   --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-int-on-secondary, #000000));   --lmvz-button-radius: var(--lmvz-button-radius-override, var(--lmvz-component-input-radius-default, 999px));   --lmvz-button-padding-inline: var(--lmvz-button-padding-inline-override, var(--lmvz-button-padding, var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem))));   --lmvz-button-padding-block: var(--lmvz-button-padding-block-override, var(--lmvz-button-padding, var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem))));   --lmvz-button-gap: var(--lmvz-button-gap-override, var(--lmvz-component-input-gap-md, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem)));   --lmvz-button-min-height: var(--lmvz-button-min-height-override, var(--lmvz-component-input-size-md, clamp(2.5rem, 2.44rem + 0.26vw, 2.75rem)));   --lmvz-button-font: var(--lmvz-button-font-override, var(--lmvz-typography-label-md-strong, normal 700 clamp(0.88rem, 0.84rem + 0.13vw, 1rem) / 1.5     Router));   --lmvz-button-border-width: var(--lmvz-button-border-width-override, 0);   --lmvz-button-border-color: var(--lmvz-button-border-color-override, transparent);    display: inline-flex;   align-items: center;   justify-content: var(--lmvz-button-content-justification, center);   gap: var(--lmvz-button-gap, var(--lmvz-component-input-gap-md, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem)));    box-sizing: border-box;    padding-block: var(--lmvz-button-padding-block, var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem)));   padding-inline: var(--lmvz-button-padding-inline, var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem)));   min-height: var(--lmvz-button-min-height, var(--lmvz-component-input-size-md, clamp(2.5rem, 2.44rem + 0.26vw, 2.75rem)));   border: var(--lmvz-button-border-width, 0) solid var(--lmvz-button-border-color, transparent);   border-radius: var(--lmvz-button-radius, var(--lmvz-component-input-radius-default, 999px));    background-color: var(--lmvz-button-background);   color: var(--lmvz-button-color);   cursor: pointer;   font: var(--lmvz-button-font);   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; }     & > * {     font: inherit;     color: inherit;   }   &:focus-visible {     outline: var(--lmvz-ds-outline, 1px solid #0e7ab4);     outline-offset: var(--lmvz-ds-outline-offset, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem));     position: relative;     z-index: 1;   }   &:is([disabled], .disabled) {     cursor: not-allowed;     pointer-events: none;                               opacity: var(--lmvz-component-input-disabled-opacity, 40%);   }   &:not([disabled]):hover {     --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-secondary-hover, #e0e0e0));   }   &:not([disabled]):active {     --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-secondary-active, #d4d4d4));   }        &.primary {     --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-primary, #000000));     --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-int-on-primary, #ffffff));     --lmvz-button-border-width: var(--lmvz-button-border-width-override, 0);     --lmvz-button-border-color: var(--lmvz-button-border-color-override, transparent);   }   &.primary:not([disabled], .disabled):hover {     --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-primary-hover, #2e2e2e));   }   &.primary:not([disabled], .disabled):active {     --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-primary-active, #545454));   }   &.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, #a31419));   }   &.danger:not([disabled], .disabled):hover {     --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));   }   &.danger:not([disabled], .disabled):active {     --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));   }   &.tertiary {     --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-tertiary, #ffffff));     --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-int-on-tertiary, #000000));   }   &.tertiary:not([disabled], .disabled):hover {     --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-tertiary-hover, #f0f0f0));     --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-int-on-tertiary-hover, #000000));   }   &.tertiary:not([disabled], .disabled):active {     --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-tertiary-active, #e0e0e0));     --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-int-on-tertiary-active, #000000));   }    &.small {     --lmvz-button-padding-inline: var(--lmvz-button-padding-inline-override, var(--lmvz-component-input-padding-sm, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem)));     --lmvz-button-padding-block: var(--lmvz-button-padding-block-override, var(--lmvz-component-input-padding-sm, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem)));     --lmvz-button-gap: var(--lmvz-button-gap-override, var(--lmvz-component-input-gap-sm, clamp(0.38rem, 0.31rem + 0.26vw, 0.63rem)));     --lmvz-button-min-height: var(--lmvz-button-min-height-override, var(--lmvz-component-input-size-sm, clamp(2rem, 1.94rem + 0.26vw, 2.25rem)));     --lmvz-button-font: var(--lmvz-button-font-override, var(--lmvz-typography-label-sm-strong, normal 700 clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem) / 1.5     Router));   }   &.large {     --lmvz-button-padding-inline: var(--lmvz-button-padding-inline-override, var(--lmvz-component-input-padding-lg, clamp(1rem, 0.94rem + 0.26vw, 1.25rem)));     --lmvz-button-padding-block: var(--lmvz-button-padding-block-override, var(--lmvz-component-input-padding-lg, clamp(1rem, 0.94rem + 0.26vw, 1.25rem)));     --lmvz-button-gap: var(--lmvz-button-gap-override, var(--lmvz-component-input-gap-lg, clamp(0.75rem, 0.69rem + 0.26vw, 1rem)));     --lmvz-button-min-height: var(--lmvz-button-min-height-override, var(--lmvz-component-input-size-lg, clamp(2.75rem, 2.69rem + 0.26vw, 3rem)));     --lmvz-button-font: var(--lmvz-button-font-override, var(--lmvz-typography-label-lg-strong, normal 700 clamp(1rem, 0.97rem + 0.13vw, 1.13rem) / 1.5     Router));   } }     display: flex;   min-width: var(--lmvz-card-component-card-minwidth, 20.4375rem);   max-width: var(--lmvz-card-component-card-maxwidth, 21.6875rem);   flex-direction: column;   align-items: flex-start;    border-radius: var(--lmvz-semantic-border-radius-lg, 14px);   border: var(--lmvz-semantic-border-width-default, 1px) solid var(--lmvz-semantic-color-border-default, #e0e0e0);   background: var(--lmvz-semantic-color-surface-primary, #ffffff); } *.sc-lmvz-card {   color: var(--lmvz-semantic-color-on-surface-primary, #000000);   font: var(--lmvz-typography-body-md, 400 clamp(0.88rem, 0.84rem + 0.13vw, 1rem) / 1.5 Router); } .top.sc-lmvz-card {   display: flex;   padding: var(--lmvz-dimension-12-8, 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-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; } .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(2rem, 1.82rem + 0.78vw, 2.75rem) / 1.4     Router); } .description.sc-lmvz-card {   display: flex;   margin: 0;   padding-bottom: var(--lmvz-component-body-sm-padding-bottom, clamp(0.25rem, 0.16rem + 0.39vw, 0.63rem));   align-items: flex-start;   align-self: stretch;   white-space: pre-line;   font: var(--lmvz-typography-body-md, 400 clamp(0.88rem, 0.84rem + 0.13vw, 1rem) / 1.5 Router); } .image-wrapper.sc-lmvz-card {   aspect-ratio: 4 / 3;   width: 100%;   background-size: cover;   background-position: center;   flex: 1 0 0;   align-self: stretch;   border-radius: var(--lmvz-semantic-border-radius-md, 6px); } .actions.sc-lmvz-card {   margin-top: var(--lmvz-component-form-wrapper-gap-y, clamp(1.13rem, 0.97rem + 0.65vw, 1.75rem));   display: flex;   align-items: center;   gap: var(--lmvz-component-input-md-gap-x, clamp(0.25rem, 0.16rem + 0.39vw, 0.63rem));   align-self: stretch; } button.primary.sc-lmvz-card, lmvz-button.primary.sc-lmvz-card {   display: flex;   justify-content: center;   align-items: center;   gap: var(--lmvz-component-input-md-gap-x, clamp(0.25rem, 0.16rem + 0.39vw, 0.63rem));   flex: 1 0 0; }";export{n as lmvz_card}