@lmvz-ds/components 0.29.0 → 0.30.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.
- package/CHANGELOG.md +6 -0
- package/cjs/{ds.constants-JXqgKnXL.js → ds.constants-D3srqM9m.js} +2 -0
- package/cjs/index.cjs.js +2 -1
- package/cjs/lmvz-button-group.cjs.entry.js +1 -1
- package/cjs/lmvz-button_2.cjs.entry.js +1 -1
- package/cjs/lmvz-card.cjs.entry.js +1 -1
- package/cjs/lmvz-checkbox.cjs.entry.js +1 -1
- package/cjs/lmvz-chip.cjs.entry.js +2 -2
- package/cjs/lmvz-components.cjs.js +1 -1
- package/cjs/lmvz-input.cjs.entry.js +1 -1
- package/cjs/lmvz-link.cjs.entry.js +69 -0
- package/cjs/lmvz-menuitem.cjs.entry.js +2 -2
- package/cjs/lmvz-message.cjs.entry.js +2 -2
- package/cjs/lmvz-modal.cjs.entry.js +2 -2
- package/cjs/lmvz-radio.cjs.entry.js +3 -3
- package/cjs/lmvz-select.cjs.entry.js +2 -2
- package/cjs/lmvz-snackbar.cjs.entry.js +2 -2
- package/cjs/lmvz-spinner.cjs.entry.js +1 -1
- package/cjs/lmvz-tab.cjs.entry.js +2 -2
- package/cjs/lmvz-tabs.cjs.entry.js +1 -1
- package/cjs/lmvz-toggle.cjs.entry.js +3 -3
- package/cjs/loader.cjs.js +1 -1
- package/collection/api/ds.constants.js +1 -0
- package/collection/collection-manifest.json +1 -0
- package/collection/components/lmvz-button/lmvz-button.css +8 -5
- package/collection/components/lmvz-button-group/lmvz-button-group.css +2 -1
- package/collection/components/lmvz-card/lmvz-card.css +14 -8
- package/collection/components/lmvz-checkbox/lmvz-checkbox.css +8 -5
- package/collection/components/lmvz-chip/lmvz-chip.css +4 -2
- package/collection/components/lmvz-input/lmvz-input.css +2 -2
- package/collection/components/lmvz-link/lmvz-link.css +44 -0
- package/collection/components/lmvz-link/lmvz-link.js +183 -0
- package/collection/components/lmvz-menuitem/lmvz-menuitem.css +2 -1
- package/collection/components/lmvz-menuitem/lmvz-menuitem.js +1 -1
- package/collection/components/lmvz-message/lmvz-message.css +2 -1
- package/collection/components/lmvz-message/lmvz-message.js +1 -1
- package/collection/components/lmvz-modal/lmvz-modal.css +4 -2
- package/collection/components/lmvz-modal/lmvz-modal.js +1 -1
- package/collection/components/lmvz-radio/lmvz-radio.css +4 -2
- package/collection/components/lmvz-radio/lmvz-radio.js +1 -1
- package/collection/components/lmvz-select/lmvz-select.css +4 -3
- package/collection/components/lmvz-select/lmvz-select.js +1 -1
- package/collection/components/lmvz-snackbar/lmvz-snackbar.css +2 -1
- package/collection/components/lmvz-snackbar/lmvz-snackbar.js +1 -1
- package/collection/components/lmvz-spinner/lmvz-spinner.js +1 -1
- package/collection/components/lmvz-tab/lmvz-tab.css +4 -3
- package/collection/components/lmvz-tab/lmvz-tab.js +1 -1
- package/collection/components/lmvz-tabs/lmvz-tabs.js +1 -1
- package/collection/components/lmvz-toggle/lmvz-toggle.css +2 -1
- package/collection/components/lmvz-toggle/lmvz-toggle.js +1 -1
- package/collection/index.js +1 -1
- package/collection/integration/header-integration/header-integration.js +1 -1
- package/collection/styles/fragments/_focus-within.css +2 -2
- package/components/index.d.ts +2 -0
- package/components/index.d.ts.bak +2 -0
- package/components/index.js +1 -1
- package/components/lmvz-button-group.js +1 -1
- package/components/lmvz-button.js +1 -1
- package/components/lmvz-card.js +1 -1
- package/components/lmvz-checkbox.js +1 -1
- package/components/lmvz-chip.js +1 -1
- package/components/lmvz-input.js +1 -1
- package/components/lmvz-link.d.ts +11 -0
- package/components/lmvz-link.d.ts.bak +11 -0
- package/components/lmvz-link.js +1 -0
- package/components/lmvz-menuitem.js +1 -1
- package/components/lmvz-message.js +1 -1
- package/components/lmvz-modal.js +1 -1
- package/components/lmvz-radio.js +1 -1
- package/components/lmvz-select.js +1 -1
- package/components/lmvz-snackbar.js +1 -1
- package/components/lmvz-spinner.js +1 -1
- package/components/lmvz-tab.js +1 -1
- package/components/lmvz-tabs.js +1 -1
- package/components/lmvz-toggle.js +1 -1
- package/components/p-BLS5MjIu.js +1 -0
- package/components/p-C0f2nNPZ.js +1 -0
- package/components/p-DGlgVBPj.js +1 -0
- package/esm/{ds.constants-DWePb-zu.js → ds.constants-BLS5MjIu.js} +2 -1
- package/esm/index.js +1 -1
- package/esm/lmvz-button-group.entry.js +1 -1
- package/esm/lmvz-button_2.entry.js +1 -1
- package/esm/lmvz-card.entry.js +1 -1
- package/esm/lmvz-checkbox.entry.js +1 -1
- package/esm/lmvz-chip.entry.js +2 -2
- package/esm/lmvz-components.js +1 -1
- package/esm/lmvz-input.entry.js +1 -1
- package/esm/lmvz-link.entry.js +67 -0
- package/esm/lmvz-menuitem.entry.js +2 -2
- package/esm/lmvz-message.entry.js +2 -2
- package/esm/lmvz-modal.entry.js +2 -2
- package/esm/lmvz-radio.entry.js +3 -3
- package/esm/lmvz-select.entry.js +2 -2
- package/esm/lmvz-snackbar.entry.js +2 -2
- package/esm/lmvz-spinner.entry.js +1 -1
- package/esm/lmvz-tab.entry.js +2 -2
- package/esm/lmvz-tabs.entry.js +1 -1
- package/esm/lmvz-toggle.entry.js +3 -3
- package/esm/loader.js +1 -1
- package/hydrate/index.js +103 -26
- package/hydrate/index.mjs +103 -26
- package/lmvz-components/index.esm.js +1 -1
- package/lmvz-components/lmvz-components.esm.js +1 -1
- package/lmvz-components/p-0d435e7b.entry.js +1 -0
- package/lmvz-components/{p-2981a238.entry.js → p-230962c8.entry.js} +1 -1
- package/lmvz-components/{p-fe7999d4.entry.js → p-2ca85b7c.entry.js} +1 -1
- package/lmvz-components/{p-af4e26da.entry.js → p-35da6bfb.entry.js} +1 -1
- package/lmvz-components/p-3b3e532f.entry.js +1 -1
- package/lmvz-components/{p-f030f6f6.entry.js → p-44fea470.entry.js} +1 -1
- package/lmvz-components/p-4dc44520.entry.js +1 -0
- package/lmvz-components/{p-5fcc6f84.entry.js → p-58498d43.entry.js} +1 -1
- package/lmvz-components/p-5c951888.entry.js +1 -0
- package/lmvz-components/p-BLS5MjIu.js +1 -0
- package/lmvz-components/p-a4077c9f.entry.js +1 -0
- package/lmvz-components/{p-4484ab62.entry.js → p-b08db5ad.entry.js} +1 -1
- package/lmvz-components/{p-7e9938e7.entry.js → p-b5254532.entry.js} +1 -1
- package/lmvz-components/p-c0b1d0af.entry.js +1 -0
- package/lmvz-components/p-c60ab9c9.entry.js +1 -0
- package/lmvz-components/{p-7fd7e04c.entry.js → p-d7e99f03.entry.js} +1 -1
- package/lmvz-components/{p-ca497e57.entry.js → p-dce6e41d.entry.js} +1 -1
- package/lmvz-components/{p-83ab106c.entry.js → p-e3ce44a3.entry.js} +1 -1
- package/lmvz-components/p-f3c44dd4.entry.js +1 -0
- package/manifest.json +211 -1
- package/package.json +5 -1
- package/types/api/ds.constants.d.ts +4 -0
- package/types/components/lmvz-link/lmvz-link.d.ts +13 -0
- package/types/components.d.ts +70 -0
- package/types/index.d.ts +1 -1
- package/components/p-BxPuC-EQ.js +0 -1
- package/components/p-DBZE-Jyu.js +0 -1
- package/lmvz-components/p-087853c3.entry.js +0 -1
- package/lmvz-components/p-35b5efdc.entry.js +0 -1
- package/lmvz-components/p-4ba3f830.entry.js +0 -1
- package/lmvz-components/p-87d207e7.entry.js +0 -1
- package/lmvz-components/p-912776f8.entry.js +0 -1
- package/lmvz-components/p-DWePb-zu.js +0 -1
- package/lmvz-components/p-d8b55d55.entry.js +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
import{g as o,r as e,h as r,H as t}from"./p-BPeerEwm.js";import{a,c as s}from"./p-
|
|
1
|
+
import{g as o,r as e,h as r,H as t}from"./p-BPeerEwm.js";import{a,c as s}from"./p-BLS5MjIu.js";import{A as l}from"./p-CPOia2kT.js";import{R as c}from"./p-FBuCCcFC.js";import{i as n}from"./p-CdDO7mQa.js";const i=class extends c{ariaValidationController=new l(this);beforeSlot;defaultSlot;afterSlot;get el(){return o(this)}get validationEl(){return this.el}type="active";size="default";constructor(o){super(),e(this,o),this.addController(this.ariaValidationController)}normalizeType(o){const e=a.includes(o)?o:"active";e!==this.type&&(this.type=e)}normalizeSize(o){const e=s.includes(o)?o:"default";e!==this.size&&(this.size=e)}componentWillLoad(){this.normalizeType(this.type),this.normalizeSize(this.size),super.componentWillLoad()}connectedCallback(){super.connectedCallback(),this.checkContent()}checkContent=function(o){let e;return()=>{void 0!==e&&window.clearTimeout(e),e=window.setTimeout((()=>{o(),e=void 0}),500)}}((()=>{n()&&([...this.beforeSlot?.assignedElements()??[],...this.defaultSlot?.assignedElements()??[],...this.afterSlot?.assignedElements()??[]].length||console.warn("LmvzChip has no assigned content. Please add content to the default slot or the before-text/after-text slots."))}));render(){return r(t,{key:"70654d69189e77f9356853a921366083b2c4b969",type:this.type,size:this.size},r("slot",{key:"c7e667b93166286fe68a812dd8eec82885e3fc5e",name:"before-text",ref:o=>this.beforeSlot=o,onSlotchange:()=>this.checkContent()}),r("span",{key:"af38dd0429b42685a114e26175ce42d09f5fdcc1",class:"content-overflow-wrapper"},r("slot",{key:"924158498d65b9ac7c912b6b1a479016176e0b78",ref:o=>this.defaultSlot=o,onSlotchange:()=>this.checkContent()})),r("slot",{key:"9ff0394dbfb2131fafe513d0f2d8ce26c7781f20",name:"after-text",ref:o=>this.afterSlot=o,onSlotchange:()=>this.checkContent()}))}static get watchers(){return{type:[{normalizeType:0}],size:[{normalizeSize:0}]}}};i.style=":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); 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)); 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 Router); background-color: var(--lmvz-chip-background-color); color: var(--lmvz-chip-foreground-color); display: inline-flex; align-items: center; justify-content: center; gap: var(--lmvz-dimension-4-6, clamp(0.25rem, 0.22rem + 0.13vw, 0.38rem)); box-sizing: border-box; max-width: 100%; overflow: hidden; white-space: nowrap; > .content-overflow-wrapper { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } } :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)); 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)); } ::slotted(*) { display: inline; white-space: inherit; } ::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)); } :host([size='small']) ::slotted(lmvz-icon) { --lmvz-component-size: var(--lmvz-dimension-10-12, clamp(0.63rem, 0.59rem + 0.13vw, 0.75rem)); } :host([type='active']) { --lmvz-chip-border-color: var(--lmvz-semantic-color-status-on-active-subtle, #c1e6fa); --lmvz-chip-background-color: var(--lmvz-semantic-color-status-active, #f6fbfe); --lmvz-chip-foreground-color: var(--lmvz-semantic-color-status-on-active, #0e7ab4); } :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); } :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); } :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); } :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); } ";export{i as lmvz_chip}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{r as t,h as e,H as n}from"./p-BPeerEwm.js";import{a as i,i as s}from"./p-CdDO7mQa.js";import{a as
|
|
1
|
+
import{r as t,h as e,H as n}from"./p-BPeerEwm.js";import{a as i,i as s}from"./p-CdDO7mQa.js";import{a as r}from"./p-DOTK1OW3.js";const o=class{constructor(e){t(this,e)}actionsSlot;validationMessageCache=[];actionsStateObserver;get primaryEnabledAction(){return this.enabledButtons.find(l)??this.enabledButtons[0]}get hasActions(){return this.assignedButtons.some((t=>h(t)&&a(t)&&!d(t)))}componentDidLoad(){this.handleActionsSlotChange()}disconnectedCallback(){this.actionsStateObserver?.disconnect()}get assignedElements(){return this.actionsSlot?.assignedElements({flatten:!0})??[]}get assignedButtons(){return this.assignedElements.filter(a)}get visibleButtons(){return this.assignedButtons.filter(h)}get enabledButtons(){return this.visibleButtons.filter((t=d,(...e)=>{const n=t(...e);return i(n)?n.then((t=>!t)):!n}));var t}getActionValidationResult(){if(!this.visibleButtons.length)return[];const t=this.visibleButtons.filter(l),e=this.visibleButtons.filter(m),n=[],i=this.visibleButtons.toReversed();if(1!==t.length&&n.push("LmvzModal actions slot must contain exactly one primary action."),e.length>1&&n.push(`LmvzModal actions slot must contain at most one secondary action (received ${e.length})`),t.length){const s=e[0];0!==i.indexOf(t[0])&&n.push("Primary action must be the last focusable element in the actions slot (i.e. rightmost button)."),s&&1!==i.indexOf(s)&&n.push("Secondary action must be the second-to-last focusable element in the actions slot (i.e. left of primary button).")}else e.length&&0!==i.indexOf(e[0])&&n.push("Secondary action must be the last focusable element in the actions slot when no primary action is present (i.e. rightmost button).");return n}handleActionsSlotChange=()=>{this.observeActionState(),this.syncActionsState()};observeActionState(){"undefined"!=typeof MutationObserver&&(this.actionsStateObserver?.disconnect(),this.assignedButtons.length&&(this.actionsStateObserver=new MutationObserver((()=>{this.syncActionsState()})),this.assignedButtons.forEach((t=>{this.actionsStateObserver?.observe(t,{attributes:!0,attributeFilter:["disabled","hidden","variant"]})}))))}syncActionsState(){this.assignedElements.forEach((t=>{["LMVZ-BUTTON","BUTTON"].includes(t.tagName.toUpperCase())||(t.hasAttribute("hidden")||t.setAttribute("hidden",""),"true"!==t.getAttribute("aria-hidden")&&t.setAttribute("aria-hidden","true"))})),this.checkActions();const t=this.visibleButtons.length;for(let e=0;e<t;e++){const n=e===t-1?"primary":e===t-2?"secondary":"tertiary",i=this.visibleButtons.at(e);i&&(c(i)?i.getAttribute("variant")||i.setAttribute("variant",n):i.classList.add(n))}this.focusPrimaryAction()}focusPrimaryAction(){const t=this.primaryEnabledAction;t&&"undefined"!=typeof window&&window.requestAnimationFrame((()=>{r(t)&&t.focus()}))}checkActions(){if(!s())return;const t=this.getActionValidationResult();t.length&&t.forEach((t=>{this.validationMessageCache.includes(t)||(console.warn(t),this.validationMessageCache.push(t))}))}render(){return e(n,{key:"56b60821ecaa2301d13e78d621e873aa74cd170e"},e("slot",{key:"e6a1422950fa5b0026356b7788a607a690116186",ref:t=>this.actionsSlot=t,onSlotchange:this.handleActionsSlotChange}))}};function a(t){return["LMVZ-BUTTON","BUTTON"].includes(t.tagName.toUpperCase())}function c(t){return"LMVZ-BUTTON"===t?.tagName.toUpperCase()}function d(t){return t.hasAttribute("disabled")||!0===t.disabled}function h(t){return!t.hasAttribute("hidden")}function u(t){const e=t.getAttribute("variant")??t.variant;return"primary"===e||"secondary"===e||"tertiary"===e?e:"secondary"}function l(t){return"primary"===u(t)}function m(t){return"secondary"===u(t)}o.style=":host{display:flex;justify-content:flex-end;gap:var(--lmvz-component-input-gap-md, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem));font:var(--lmvz-typography-body-md, 400 clamp(0.88rem, 0.84rem + 0.13vw, 1rem) / 1.5 Router);flex-wrap:wrap}::slotted([hidden]){display:none !important}";export{o as lmvz_button_group}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{r as e,h as r,H as i}from"./p-BPeerEwm.js";import{t as a}from"./p-CcxjkCOx.js";import{l as t}from"./p-BLS5MjIu.js";import"./p-CGmJG63p.js";const o=a("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTQgMTJIMjBNMTQgMThMMjAgMTJMMTQgNiIgc3Ryb2tlPSJibGFjayIgc3Ryb2tlLXdpZHRoPSIxLjUiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8L3N2Zz4K"),n=a("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTIxIDlWM0gxNU0yMSAzTDEwIDE0TTE4IDEzVjE5QzE4IDE5LjUzMDQgMTcuNzg5MyAyMC4wMzkxIDE3LjQxNDIgMjAuNDE0MkMxNy4wMzkxIDIwLjc4OTMgMTYuNTMwNCAyMSAxNiAyMUg1QzQuNDY5NTcgMjEgMy45NjA4NiAyMC43ODkzIDMuNTg1NzkgMjAuNDE0MkMzLjIxMDcxIDIwLjAzOTEgMyAxOS41MzA0IDMgMTlWOEMzIDcuNDY5NTcgMy4yMTA3MSA2Ljk2MDg2IDMuNTg1NzkgNi41ODU3OUMzLjk2MDg2IDYuMjEwNzEgNC40Njk1NyA2IDUgNkgxMSIgc3Ryb2tlPSJibGFjayIgc3Ryb2tlLXdpZHRoPSIxLjUiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8L3N2Zz4K"),l=class{constructor(r){e(this,r)}href="";target;rel;type="internal";externalLabel="(öffnet in neuem Tab)";normalizeType(e){const r=t.includes(e)?e:"internal";r!==this.type&&(this.type=r)}componentWillLoad(){this.normalizeType(this.type)}computeHref(){if(!this.href)return;const e=this.href.trim();return/^javascript:/i.test(e)||/^data:/i.test(e)?void 0:this.href}computeRel(){if("_blank"!==this.target)return this.rel||void 0;const e=new Set((this.rel??"").split(/\s+/).map((e=>e.trim())).filter(Boolean));return e.add("noopener"),e.add("noreferrer"),[...e].join(" ")}render(){const e=this.computeRel(),a="external"===this.type?n:o,t="_blank"===this.target;return r(i,{key:"c80daca5bef1fd7a9753a075d6bf795f11b5fc1b"},r("a",{key:"06dd1183936e57c00ba4cf028bf186e964ad0ff8",href:this.computeHref(),target:this.target,rel:e},r("slot",{key:"03cd7fe4bab8a9d6d8f1e7278ee6d0d24650fbda"}),r("lmvz-icon",{key:"c8a31a8937bc59b98bf1dce9bb127f423ac0cb4d","aria-hidden":"true",icon:a}),t&&r("span",{key:"9217e2d0b1b904492598bd0e638cbcb29d4ff212",class:"sr-only"},this.externalLabel)))}static get delegatesFocus(){return!0}static get watchers(){return{type:[{normalizeType:0}]}}};l.style=":host{display:inline}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));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}a:hover{background-color:var(--lmvz-semantic-color-int-tertiary-hover, #f0f0f0);color:var(--lmvz-semantic-color-int-on-tertiary-hover, #000000)}a:active{background-color:var(--lmvz-semantic-color-int-tertiary-active, #e0e0e0);color:var(--lmvz-semantic-color-int-on-tertiary-active, #000000)}a: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))}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}";export{l as lmvz_link}
|
package/manifest.json
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
{
|
|
2
|
-
"timestamp": "2026-06-
|
|
2
|
+
"timestamp": "2026-06-15T18:20:41",
|
|
3
3
|
"compiler": {
|
|
4
4
|
"name": "@stencil/core",
|
|
5
5
|
"version": "4.43.5",
|
|
@@ -1586,12 +1586,16 @@
|
|
|
1586
1586
|
"parts": [],
|
|
1587
1587
|
"states": [],
|
|
1588
1588
|
"dependents": [
|
|
1589
|
+
"lmvz-link",
|
|
1589
1590
|
"lmvz-message",
|
|
1590
1591
|
"lmvz-modal",
|
|
1591
1592
|
"lmvz-snackbar"
|
|
1592
1593
|
],
|
|
1593
1594
|
"dependencies": [],
|
|
1594
1595
|
"dependencyGraph": {
|
|
1596
|
+
"lmvz-link": [
|
|
1597
|
+
"lmvz-icon"
|
|
1598
|
+
],
|
|
1595
1599
|
"lmvz-message": [
|
|
1596
1600
|
"lmvz-icon"
|
|
1597
1601
|
],
|
|
@@ -5683,6 +5687,207 @@
|
|
|
5683
5687
|
"dependencies": [],
|
|
5684
5688
|
"dependencyGraph": {}
|
|
5685
5689
|
},
|
|
5690
|
+
{
|
|
5691
|
+
"filePath": "src/components/lmvz-link/lmvz-link.tsx",
|
|
5692
|
+
"encapsulation": "shadow",
|
|
5693
|
+
"tag": "lmvz-link",
|
|
5694
|
+
"readme": "# lmvz-link\n\nThe link renders a semantically correct native anchor element with a trailing icon indicating the navigation type.\n\n## Visual Types\n\nThe component supports two visual types controlled by the `type` prop:\n\n- **`internal`** — renders an arrow-right icon, indicating navigation within the same site or application\n- **`external`** — renders an external icon, indicating navigation to an external destination\n\n## Label and Accessibility\n\nThe default slot accepts inline label text for the link. When the link opens in a new tab (`target=\"_blank\"`), a visually-hidden external label is automatically appended to improve accessible announcements. The text of this label is controlled by the `externalLabel` prop (default: `\"(öffnet in neuem Tab)\"`) and can be customized for localization.\n",
|
|
5695
|
+
"docs": "The link renders a native anchor element with an icon indicating navigation type.",
|
|
5696
|
+
"docsTags": [
|
|
5697
|
+
{
|
|
5698
|
+
"name": "slot",
|
|
5699
|
+
"text": "default - Inline label text for the link."
|
|
5700
|
+
}
|
|
5701
|
+
],
|
|
5702
|
+
"usage": {},
|
|
5703
|
+
"props": [
|
|
5704
|
+
{
|
|
5705
|
+
"name": "externalLabel",
|
|
5706
|
+
"type": "string",
|
|
5707
|
+
"complexType": {
|
|
5708
|
+
"original": "string",
|
|
5709
|
+
"resolved": "string",
|
|
5710
|
+
"references": {}
|
|
5711
|
+
},
|
|
5712
|
+
"mutable": false,
|
|
5713
|
+
"attr": "external-label",
|
|
5714
|
+
"reflectToAttr": false,
|
|
5715
|
+
"docs": "Visually-hidden text appended inside the anchor when `target=\"_blank\"`.\nProvides an accessible cue for screen reader users.",
|
|
5716
|
+
"docsTags": [
|
|
5717
|
+
{
|
|
5718
|
+
"name": "default",
|
|
5719
|
+
"text": "'(öffnet in neuem Tab)'"
|
|
5720
|
+
}
|
|
5721
|
+
],
|
|
5722
|
+
"default": "'(öffnet in neuem Tab)'",
|
|
5723
|
+
"values": [
|
|
5724
|
+
{
|
|
5725
|
+
"type": "string"
|
|
5726
|
+
}
|
|
5727
|
+
],
|
|
5728
|
+
"optional": false,
|
|
5729
|
+
"required": false,
|
|
5730
|
+
"getter": false,
|
|
5731
|
+
"setter": false
|
|
5732
|
+
},
|
|
5733
|
+
{
|
|
5734
|
+
"name": "href",
|
|
5735
|
+
"type": "string",
|
|
5736
|
+
"complexType": {
|
|
5737
|
+
"original": "string",
|
|
5738
|
+
"resolved": "string",
|
|
5739
|
+
"references": {}
|
|
5740
|
+
},
|
|
5741
|
+
"mutable": false,
|
|
5742
|
+
"attr": "href",
|
|
5743
|
+
"reflectToAttr": true,
|
|
5744
|
+
"docs": "The URL the link points to. Mirrors the native anchor `href` attribute.",
|
|
5745
|
+
"docsTags": [
|
|
5746
|
+
{
|
|
5747
|
+
"name": "default",
|
|
5748
|
+
"text": "''"
|
|
5749
|
+
}
|
|
5750
|
+
],
|
|
5751
|
+
"default": "''",
|
|
5752
|
+
"values": [
|
|
5753
|
+
{
|
|
5754
|
+
"type": "string"
|
|
5755
|
+
}
|
|
5756
|
+
],
|
|
5757
|
+
"optional": false,
|
|
5758
|
+
"required": false,
|
|
5759
|
+
"getter": false,
|
|
5760
|
+
"setter": false
|
|
5761
|
+
},
|
|
5762
|
+
{
|
|
5763
|
+
"name": "rel",
|
|
5764
|
+
"type": "string | undefined",
|
|
5765
|
+
"complexType": {
|
|
5766
|
+
"original": "string",
|
|
5767
|
+
"resolved": "string | undefined",
|
|
5768
|
+
"references": {}
|
|
5769
|
+
},
|
|
5770
|
+
"mutable": false,
|
|
5771
|
+
"attr": "rel",
|
|
5772
|
+
"reflectToAttr": false,
|
|
5773
|
+
"docs": "Relationship of the linked URL. When `target=\"_blank\"`, `noopener` and\n`noreferrer` are automatically added if not already present.",
|
|
5774
|
+
"docsTags": [],
|
|
5775
|
+
"values": [
|
|
5776
|
+
{
|
|
5777
|
+
"type": "string"
|
|
5778
|
+
},
|
|
5779
|
+
{
|
|
5780
|
+
"type": "undefined"
|
|
5781
|
+
}
|
|
5782
|
+
],
|
|
5783
|
+
"optional": true,
|
|
5784
|
+
"required": false,
|
|
5785
|
+
"getter": false,
|
|
5786
|
+
"setter": false
|
|
5787
|
+
},
|
|
5788
|
+
{
|
|
5789
|
+
"name": "target",
|
|
5790
|
+
"type": "\"_blank\" | \"_parent\" | \"_self\" | \"_top\" | undefined",
|
|
5791
|
+
"complexType": {
|
|
5792
|
+
"original": "'_self' | '_blank' | '_parent' | '_top'",
|
|
5793
|
+
"resolved": "\"_blank\" | \"_parent\" | \"_self\" | \"_top\" | undefined",
|
|
5794
|
+
"references": {}
|
|
5795
|
+
},
|
|
5796
|
+
"mutable": false,
|
|
5797
|
+
"attr": "target",
|
|
5798
|
+
"reflectToAttr": true,
|
|
5799
|
+
"docs": "Where to open the linked document.",
|
|
5800
|
+
"docsTags": [],
|
|
5801
|
+
"values": [
|
|
5802
|
+
{
|
|
5803
|
+
"value": "_blank",
|
|
5804
|
+
"type": "string"
|
|
5805
|
+
},
|
|
5806
|
+
{
|
|
5807
|
+
"value": "_parent",
|
|
5808
|
+
"type": "string"
|
|
5809
|
+
},
|
|
5810
|
+
{
|
|
5811
|
+
"value": "_self",
|
|
5812
|
+
"type": "string"
|
|
5813
|
+
},
|
|
5814
|
+
{
|
|
5815
|
+
"value": "_top",
|
|
5816
|
+
"type": "string"
|
|
5817
|
+
},
|
|
5818
|
+
{
|
|
5819
|
+
"type": "undefined"
|
|
5820
|
+
}
|
|
5821
|
+
],
|
|
5822
|
+
"optional": true,
|
|
5823
|
+
"required": false,
|
|
5824
|
+
"getter": false,
|
|
5825
|
+
"setter": false
|
|
5826
|
+
},
|
|
5827
|
+
{
|
|
5828
|
+
"name": "type",
|
|
5829
|
+
"type": "\"external\" | \"internal\"",
|
|
5830
|
+
"complexType": {
|
|
5831
|
+
"original": "Link.Type",
|
|
5832
|
+
"resolved": "\"external\" | \"internal\"",
|
|
5833
|
+
"references": {
|
|
5834
|
+
"Link": {
|
|
5835
|
+
"location": "import",
|
|
5836
|
+
"path": "../../api/ds.constants.js",
|
|
5837
|
+
"id": "src/api/ds.constants.ts::Link",
|
|
5838
|
+
"referenceLocation": "Link"
|
|
5839
|
+
}
|
|
5840
|
+
}
|
|
5841
|
+
},
|
|
5842
|
+
"mutable": true,
|
|
5843
|
+
"attr": "type",
|
|
5844
|
+
"reflectToAttr": true,
|
|
5845
|
+
"docs": "Navigation type. Drives the icon shown after the label text.\n- `internal` → arrow-right icon\n- `external` → external icon\nInvalid values are normalized to `internal`.",
|
|
5846
|
+
"docsTags": [
|
|
5847
|
+
{
|
|
5848
|
+
"name": "default",
|
|
5849
|
+
"text": "'internal'"
|
|
5850
|
+
}
|
|
5851
|
+
],
|
|
5852
|
+
"default": "'internal'",
|
|
5853
|
+
"values": [
|
|
5854
|
+
{
|
|
5855
|
+
"value": "external",
|
|
5856
|
+
"type": "string"
|
|
5857
|
+
},
|
|
5858
|
+
{
|
|
5859
|
+
"value": "internal",
|
|
5860
|
+
"type": "string"
|
|
5861
|
+
}
|
|
5862
|
+
],
|
|
5863
|
+
"optional": false,
|
|
5864
|
+
"required": false,
|
|
5865
|
+
"getter": false,
|
|
5866
|
+
"setter": false
|
|
5867
|
+
}
|
|
5868
|
+
],
|
|
5869
|
+
"methods": [],
|
|
5870
|
+
"events": [],
|
|
5871
|
+
"listeners": [],
|
|
5872
|
+
"styles": [],
|
|
5873
|
+
"slots": [
|
|
5874
|
+
{
|
|
5875
|
+
"name": "default",
|
|
5876
|
+
"docs": "Inline label text for the link."
|
|
5877
|
+
}
|
|
5878
|
+
],
|
|
5879
|
+
"parts": [],
|
|
5880
|
+
"states": [],
|
|
5881
|
+
"dependents": [],
|
|
5882
|
+
"dependencies": [
|
|
5883
|
+
"lmvz-icon"
|
|
5884
|
+
],
|
|
5885
|
+
"dependencyGraph": {
|
|
5886
|
+
"lmvz-link": [
|
|
5887
|
+
"lmvz-icon"
|
|
5888
|
+
]
|
|
5889
|
+
}
|
|
5890
|
+
},
|
|
5686
5891
|
{
|
|
5687
5892
|
"filePath": "src/components/lmvz-menuitem/lmvz-menuitem.tsx",
|
|
5688
5893
|
"encapsulation": "scoped",
|
|
@@ -8008,6 +8213,11 @@
|
|
|
8008
8213
|
"docstring": "",
|
|
8009
8214
|
"path": "src/api/index.d.ts"
|
|
8010
8215
|
},
|
|
8216
|
+
"src/api/ds.constants.ts::Link": {
|
|
8217
|
+
"declaration": "any",
|
|
8218
|
+
"docstring": "",
|
|
8219
|
+
"path": "src/api/ds.constants.ts"
|
|
8220
|
+
},
|
|
8011
8221
|
"src/api/index.d.ts::Message": {
|
|
8012
8222
|
"declaration": "any",
|
|
8013
8223
|
"docstring": "",
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@lmvz-ds/components",
|
|
3
3
|
"private": false,
|
|
4
|
-
"version": "0.
|
|
4
|
+
"version": "0.30.0",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"description": "The components of the design system",
|
|
7
7
|
"author": "Patrick Nemenz <patrick.nemenz@adesso.at>",
|
|
@@ -56,6 +56,10 @@
|
|
|
56
56
|
"types": "./components/lmvz-icon.d.ts",
|
|
57
57
|
"import": "./components/lmvz-icon.js"
|
|
58
58
|
},
|
|
59
|
+
"./lmvz-link": {
|
|
60
|
+
"types": "./components/lmvz-link.d.ts",
|
|
61
|
+
"import": "./components/lmvz-link.js"
|
|
62
|
+
},
|
|
59
63
|
"./lmvz-input": {
|
|
60
64
|
"types": "./components/lmvz-input.d.ts",
|
|
61
65
|
"import": "./components/lmvz-input.js"
|
|
@@ -9,6 +9,7 @@ export declare const iconSizes: readonly ["xs", "sm", "md", "lg", "inherit"];
|
|
|
9
9
|
export declare const iconWeights: readonly ["thin", "medium", "bold"];
|
|
10
10
|
export declare const chipTypes: readonly ["active", "warning", "success", "error", "neutral"];
|
|
11
11
|
export declare const chipSizes: readonly ["default", "small"];
|
|
12
|
+
export declare const linkTypes: readonly ["internal", "external"];
|
|
12
13
|
export declare namespace LmvzDS {
|
|
13
14
|
type Variant = (typeof variants)[number];
|
|
14
15
|
type Size = (typeof sizes)[number];
|
|
@@ -24,6 +25,9 @@ export declare namespace Chip {
|
|
|
24
25
|
type Type = (typeof chipTypes)[number];
|
|
25
26
|
type Size = (typeof chipSizes)[number];
|
|
26
27
|
}
|
|
28
|
+
export declare namespace Link {
|
|
29
|
+
type Type = (typeof linkTypes)[number];
|
|
30
|
+
}
|
|
27
31
|
export declare namespace Icon {
|
|
28
32
|
type Size = (typeof iconSizes)[number];
|
|
29
33
|
type IconWeight = (typeof iconWeights)[number];
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { type Link } from '../../api/ds.constants.js';
|
|
2
|
+
export declare class LmvzLink {
|
|
3
|
+
href: string;
|
|
4
|
+
target?: '_self' | '_blank' | '_parent' | '_top';
|
|
5
|
+
rel?: string;
|
|
6
|
+
type: Link.Type;
|
|
7
|
+
externalLabel: string;
|
|
8
|
+
normalizeType(value: string): void;
|
|
9
|
+
componentWillLoad(): void;
|
|
10
|
+
private computeHref;
|
|
11
|
+
private computeRel;
|
|
12
|
+
render(): any;
|
|
13
|
+
}
|
package/types/components.d.ts
CHANGED
|
@@ -374,6 +374,34 @@ export declare namespace Components {
|
|
|
374
374
|
*/
|
|
375
375
|
"value"?: string;
|
|
376
376
|
}
|
|
377
|
+
/**
|
|
378
|
+
* The link renders a native anchor element with an icon indicating navigation type.
|
|
379
|
+
*/
|
|
380
|
+
export interface LmvzLink {
|
|
381
|
+
/**
|
|
382
|
+
* Visually-hidden text appended inside the anchor when `target="_blank"`. Provides an accessible cue for screen reader users.
|
|
383
|
+
* @default '(öffnet in neuem Tab)'
|
|
384
|
+
*/
|
|
385
|
+
"externalLabel": string;
|
|
386
|
+
/**
|
|
387
|
+
* The URL the link points to. Mirrors the native anchor `href` attribute.
|
|
388
|
+
* @default ''
|
|
389
|
+
*/
|
|
390
|
+
"href": string;
|
|
391
|
+
/**
|
|
392
|
+
* Relationship of the linked URL. When `target="_blank"`, `noopener` and `noreferrer` are automatically added if not already present.
|
|
393
|
+
*/
|
|
394
|
+
"rel"?: string;
|
|
395
|
+
/**
|
|
396
|
+
* Where to open the linked document.
|
|
397
|
+
*/
|
|
398
|
+
"target"?: '_self' | '_blank' | '_parent' | '_top';
|
|
399
|
+
/**
|
|
400
|
+
* Navigation type. Drives the icon shown after the label text. - `internal` → arrow-right icon - `external` → external icon Invalid values are normalized to `internal`.
|
|
401
|
+
* @default 'internal'
|
|
402
|
+
*/
|
|
403
|
+
"type": Link.Type;
|
|
404
|
+
}
|
|
377
405
|
/**
|
|
378
406
|
* A menu item component to be used within the `lmvz-header` component's navigation slots.
|
|
379
407
|
*/
|
|
@@ -1093,6 +1121,34 @@ export declare namespace JSX {
|
|
|
1093
1121
|
*/
|
|
1094
1122
|
"value"?: string;
|
|
1095
1123
|
}
|
|
1124
|
+
/**
|
|
1125
|
+
* The link renders a native anchor element with an icon indicating navigation type.
|
|
1126
|
+
*/
|
|
1127
|
+
export interface LmvzLink {
|
|
1128
|
+
/**
|
|
1129
|
+
* Visually-hidden text appended inside the anchor when `target="_blank"`. Provides an accessible cue for screen reader users.
|
|
1130
|
+
* @default '(öffnet in neuem Tab)'
|
|
1131
|
+
*/
|
|
1132
|
+
"externalLabel"?: string;
|
|
1133
|
+
/**
|
|
1134
|
+
* The URL the link points to. Mirrors the native anchor `href` attribute.
|
|
1135
|
+
* @default ''
|
|
1136
|
+
*/
|
|
1137
|
+
"href"?: string;
|
|
1138
|
+
/**
|
|
1139
|
+
* Relationship of the linked URL. When `target="_blank"`, `noopener` and `noreferrer` are automatically added if not already present.
|
|
1140
|
+
*/
|
|
1141
|
+
"rel"?: string;
|
|
1142
|
+
/**
|
|
1143
|
+
* Where to open the linked document.
|
|
1144
|
+
*/
|
|
1145
|
+
"target"?: '_self' | '_blank' | '_parent' | '_top';
|
|
1146
|
+
/**
|
|
1147
|
+
* Navigation type. Drives the icon shown after the label text. - `internal` → arrow-right icon - `external` → external icon Invalid values are normalized to `internal`.
|
|
1148
|
+
* @default 'internal'
|
|
1149
|
+
*/
|
|
1150
|
+
"type"?: Link.Type;
|
|
1151
|
+
}
|
|
1096
1152
|
/**
|
|
1097
1153
|
* A menu item component to be used within the `lmvz-header` component's navigation slots.
|
|
1098
1154
|
*/
|
|
@@ -1513,6 +1569,13 @@ export declare namespace JSX {
|
|
|
1513
1569
|
"size": Input.Size;
|
|
1514
1570
|
"error": boolean;
|
|
1515
1571
|
}
|
|
1572
|
+
export interface LmvzLinkAttributes {
|
|
1573
|
+
"href": string;
|
|
1574
|
+
"target": '_self' | '_blank' | '_parent' | '_top';
|
|
1575
|
+
"rel": string;
|
|
1576
|
+
"type": Link.Type;
|
|
1577
|
+
"externalLabel": string;
|
|
1578
|
+
}
|
|
1516
1579
|
export interface LmvzMenuitemAttributes {
|
|
1517
1580
|
"role": string;
|
|
1518
1581
|
"ti": number;
|
|
@@ -1592,6 +1655,7 @@ export declare namespace JSX {
|
|
|
1592
1655
|
"lmvz-header": Omit<LmvzHeader, keyof LmvzHeaderAttributes> & { [K in keyof LmvzHeader & keyof LmvzHeaderAttributes]?: LmvzHeader[K] } & { [K in keyof LmvzHeader & keyof LmvzHeaderAttributes as `attr:${K}`]?: LmvzHeaderAttributes[K] } & { [K in keyof LmvzHeader & keyof LmvzHeaderAttributes as `prop:${K}`]?: LmvzHeader[K] };
|
|
1593
1656
|
"lmvz-icon": Omit<LmvzIcon, keyof LmvzIconAttributes> & { [K in keyof LmvzIcon & keyof LmvzIconAttributes]?: LmvzIcon[K] } & { [K in keyof LmvzIcon & keyof LmvzIconAttributes as `attr:${K}`]?: LmvzIconAttributes[K] } & { [K in keyof LmvzIcon & keyof LmvzIconAttributes as `prop:${K}`]?: LmvzIcon[K] } & OneOf<"icon", LmvzIcon["icon"], LmvzIconAttributes["icon"]>;
|
|
1594
1657
|
"lmvz-input": Omit<LmvzInput, keyof LmvzInputAttributes> & { [K in keyof LmvzInput & keyof LmvzInputAttributes]?: LmvzInput[K] } & { [K in keyof LmvzInput & keyof LmvzInputAttributes as `attr:${K}`]?: LmvzInputAttributes[K] } & { [K in keyof LmvzInput & keyof LmvzInputAttributes as `prop:${K}`]?: LmvzInput[K] } & OneOf<"label", LmvzInput["label"], LmvzInputAttributes["label"]>;
|
|
1658
|
+
"lmvz-link": Omit<LmvzLink, keyof LmvzLinkAttributes> & { [K in keyof LmvzLink & keyof LmvzLinkAttributes]?: LmvzLink[K] } & { [K in keyof LmvzLink & keyof LmvzLinkAttributes as `attr:${K}`]?: LmvzLinkAttributes[K] } & { [K in keyof LmvzLink & keyof LmvzLinkAttributes as `prop:${K}`]?: LmvzLink[K] };
|
|
1595
1659
|
"lmvz-menuitem": Omit<LmvzMenuitem, keyof LmvzMenuitemAttributes> & { [K in keyof LmvzMenuitem & keyof LmvzMenuitemAttributes]?: LmvzMenuitem[K] } & { [K in keyof LmvzMenuitem & keyof LmvzMenuitemAttributes as `attr:${K}`]?: LmvzMenuitemAttributes[K] } & { [K in keyof LmvzMenuitem & keyof LmvzMenuitemAttributes as `prop:${K}`]?: LmvzMenuitem[K] };
|
|
1596
1660
|
"lmvz-message": Omit<LmvzMessage, keyof LmvzMessageAttributes> & { [K in keyof LmvzMessage & keyof LmvzMessageAttributes]?: LmvzMessage[K] } & { [K in keyof LmvzMessage & keyof LmvzMessageAttributes as `attr:${K}`]?: LmvzMessageAttributes[K] } & { [K in keyof LmvzMessage & keyof LmvzMessageAttributes as `prop:${K}`]?: LmvzMessage[K] };
|
|
1597
1661
|
"lmvz-modal": Omit<LmvzModal, keyof LmvzModalAttributes> & { [K in keyof LmvzModal & keyof LmvzModalAttributes]?: LmvzModal[K] } & { [K in keyof LmvzModal & keyof LmvzModalAttributes as `attr:${K}`]?: LmvzModalAttributes[K] } & { [K in keyof LmvzModal & keyof LmvzModalAttributes as `prop:${K}`]?: LmvzModal[K] };
|
|
@@ -1605,6 +1669,12 @@ export declare namespace JSX {
|
|
|
1605
1669
|
}
|
|
1606
1670
|
}
|
|
1607
1671
|
|
|
1672
|
+
export declare namespace Link {
|
|
1673
|
+
export type Type = (typeof linkTypes)[number];
|
|
1674
|
+
}
|
|
1675
|
+
|
|
1676
|
+
declare const linkTypes: readonly ["internal", "external"];
|
|
1677
|
+
|
|
1608
1678
|
export declare interface LmvzActionCustomEvent<T> extends CustomEvent<T> {
|
|
1609
1679
|
detail: T;
|
|
1610
1680
|
target: HTMLLmvzActionElement;
|
package/types/index.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
export * from '@lmvz-ds/aria-validation';
|
|
2
2
|
export type * from './components.d.ts';
|
|
3
|
-
export { chipSizes, chipTypes, iconSizes, iconWeights, inputSizes, inputTypes, messageTypes, selectSizes, textSizes } from './api/ds.constants';
|
|
3
|
+
export { chipSizes, chipTypes, iconSizes, iconWeights, inputSizes, inputTypes, linkTypes, messageTypes, selectSizes, textSizes } from './api/ds.constants';
|
|
4
4
|
export type { LmvzDS, Typography } from './api';
|
|
5
5
|
export * from './components/lmvz-message/public';
|
|
6
6
|
export * from './components/lmvz-snackbar/public';
|
package/components/p-BxPuC-EQ.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{p as t,c as o,h as n,d as r,t as e}from"./p-DGg7OzDl.js";import{c as a}from"./p-BfTCfPZ1.js";import{A as l}from"./p-C8znmF2h.js";import{E as i}from"./p-CN0JX9-m.js";import{i as m,f as s}from"./p-DOTK1OW3.js";import{R as v}from"./p-DAMVH-31.js";const d=t(class extends v{get el(){return this}validationEl;inheritedAttributes={};formEl=null;formButtonEl=null;lmvzActivation;get ti(){return 0}scale="default";variant;disabled=!1;type="button";form;formMethod;name;value;constructor(t){super(!1),!1!==t&&this.__registerHost(),this.__attachShadow(),this.lmvzActivation=o(this,"lmvzActivation",7),this.addController(new l(this)),this.addController(new i(this,{localHandler:this.handleClick.bind(this),keys:["Enter"]}))}connectedCallback(){this.inheritedAttributes=m(this.el),super.connectedCallback()}disconnectedCallback(){this.formButtonEl?.remove(),this.formButtonEl=null,this.formEl=null,super.disconnectedCallback()}renderHiddenButton(){if("submit"!==this.type)return this.formButtonEl?.remove(),this.formButtonEl=null,void(this.formEl=null);const t=s(this.form,this.el);if(!t)return this.formButtonEl?.remove(),this.formButtonEl=null,void(this.formEl=null);this.formEl=t;const o=this.formButtonEl??document.createElement("button");o.type="submit",o.style.display="none",o.disabled=this.disabled,o.name=this.name??"",o.value=this.value??"",this.formMethod?o.setAttribute("formmethod",this.formMethod):o.removeAttribute("formmethod"),this.formButtonEl!==o&&(this.formButtonEl=o),o.parentElement!==t&&(o.remove(),t.appendChild(o))}submitForm(t){this.formEl&&this.formButtonEl&&(t.preventDefault(),this.formButtonEl.click())}handleClick=t=>{"submit"===this.type&&this.submitForm(t)};render(){return this.renderHiddenButton(),n(r,{key:"8196de85afc3878c6f38e582d7c031f5d19bcd36","aria-disabled":this.disabled?"true":null},n("button",{key:"8d73f979fa227de22a03403a2a3938684911060a",ref:t=>this.validationEl=t,part:"button",disabled:this.disabled,type:this.type,class:a(this.variant??"secondary",{[this.scale??""]:!!this.scale,disabled:this.disabled}),...this.inheritedAttributes},n("slot",{key:"18e91a2f94ba0d7e5cf13150191003e2f0b2a03a"})))}static get delegatesFocus(){return!0}static get style(){return" @layer lmvz-ds.reset, lmvz-ds.theme, lmvz-ds.components, lmvz-ds.overrides; @layer lmvz-ds.theme { @font-face { font-family: Router; src: local('RouterBook-Regular'), local('Router-Book'), url('/assets/fonts/Router-Book.woff') format('woff'); font-weight: 400; } @font-face { font-family: Router; src: local('RouterMedium-Regular'), local('Router-Medium'), url('/assets/fonts/Router-Medium.woff') format('woff'); font-weight: 500; } @font-face { font-family: Router; src: local('RouterBold-Regular'), local('Router-Bold'), url('/assets/fonts/Router-Bold.woff') format('woff'); font-weight: 700; } } @layer lmvz-ds.reset { body { margin: 0; } h1, h2, h3, h4, h5, h6 { margin: 0; } *[hidden] { display: none !important; } } :host { button { --lmvz-button-color: var(--lmvz-component-color, var(--lmvz-semantic-color-int-on-secondary, #000000)); --lmvz-button-padding-inline: var(--lmvz-button-padding, var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem))); --lmvz-button-padding-block: var(--lmvz-button-padding, var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem))); --lmvz-button-gap: var(--lmvz-component-input-gap-md, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem)); --lmvz-button-min-height: var(--lmvz-component-input-size-md, clamp(2.5rem, 2.44rem + 0.26vw, 2.75rem)); --lmvz-button-font: var(--lmvz-typography-body-md-strong); --lmvz-button-radius: var(--lmvz-component-input-radius-default, 999px); --lmvz-button-border-width: 0; --lmvz-button-border-color: transparent; --lmvz-button-background: var(--lmvz-semantic-color-int-secondary, #f0f0f0); display: inline-flex; align-items: center; justify-content: center; gap: var(--lmvz-button-gap); padding-block: var(--lmvz-button-padding-block); padding-inline: var(--lmvz-button-padding-inline); min-height: var(--lmvz-button-min-height); border-radius: var(--lmvz-button-radius); border: var(--lmvz-button-border-width) solid var(--lmvz-button-border-color); background-color: var(--lmvz-button-background); color: var(--lmvz-button-color); cursor: pointer; font: var(--lmvz-button-font); text-align: center; text-decoration: none; white-space: nowrap; transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease; } button > * { font: inherit; color: inherit; } button:focus-visible { outline: var(--lmvz-ds-outline); outline-offset: var(--lmvz-ds-outline-offset); } button:is([disabled], .disabled) { cursor: not-allowed; pointer-events: none; opacity: var(--lmvz-component-input-disabled-opacity, 40%); } button:not([disabled]):hover { --lmvz-button-background: var(--lmvz-semantic-color-int-secondary-hover, #e0e0e0); } button:not([disabled]):active { --lmvz-button-background: var(--lmvz-semantic-color-int-secondary-active, #d4d4d4); } button.primary { --lmvz-button-background: var(--lmvz-semantic-color-int-primary, #000000); --lmvz-button-color: var(--lmvz-semantic-color-int-on-primary, #ffffff); --lmvz-button-border-width: 0; --lmvz-button-border-color: transparent; } button.primary:not([disabled], .disabled):hover { --lmvz-button-background: var(--lmvz-semantic-color-int-primary-hover, #2e2e2e); } button.primary:not([disabled], .disabled):active { --lmvz-button-background: var(--lmvz-semantic-color-int-primary-active, #545454); } button.secondary { --lmvz-button-background: var(--lmvz-semantic-color-int-secondary, #f0f0f0); --lmvz-button-color: var(--lmvz-semantic-color-int-on-secondary, #000000); --lmvz-button-border-width: 0; --lmvz-button-border-color: transparent; } button.secondary:not([disabled], .disabled):hover { --lmvz-button-background: var(--lmvz-semantic-color-int-secondary-hover, #e0e0e0); --lmvz-button-color: var(--lmvz-semantic-color-int-on-secondary-hover, #000000); } button.secondary:not([disabled], .disabled):active { --lmvz-button-background: var(--lmvz-semantic-color-int-secondary-active, #d4d4d4); --lmvz-button-color: var(--lmvz-semantic-color-int-on-secondary-active, #000000); } button.tertiary { --lmvz-button-background: var(--lmvz-semantic-color-int-tertiary, #ffffff); --lmvz-button-color: var(--lmvz-semantic-color-int-on-tertiary, #000000); } button.tertiary:not([disabled], .disabled):hover { --lmvz-button-background: var(--lmvz-semantic-color-int-tertiary-hover, #f0f0f0); --lmvz-button-color: var(--lmvz-semantic-color-int-on-tertiary-hover, #000000); } button.tertiary:not([disabled], .disabled):active { --lmvz-button-background: var(--lmvz-semantic-color-int-tertiary-active, #e0e0e0); --lmvz-button-color: var(--lmvz-semantic-color-int-on-tertiary-active, #000000); } button.small { --lmvz-button-padding-inline: var(--lmvz-component-input-padding-sm, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem)); --lmvz-button-padding-block: var(--lmvz-component-input-padding-sm, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem)); --lmvz-button-gap: var(--lmvz-component-input-gap-sm, clamp(0.38rem, 0.31rem + 0.26vw, 0.63rem)); --lmvz-button-min-height: var(--lmvz-component-input-size-sm, clamp(2rem, 1.94rem + 0.26vw, 2.25rem)); --lmvz-button-font: var(--lmvz-typography-body-sm-strong); } button.large { --lmvz-button-padding-inline: var(--lmvz-component-input-padding-lg, clamp(1rem, 0.94rem + 0.26vw, 1.25rem)); --lmvz-button-padding-block: var(--lmvz-component-input-padding-lg, clamp(1rem, 0.94rem + 0.26vw, 1.25rem)); --lmvz-button-gap: var(--lmvz-component-input-gap-lg, clamp(0.75rem, 0.69rem + 0.26vw, 1rem)); --lmvz-button-min-height: var(--lmvz-component-input-size-lg, clamp(2.75rem, 2.69rem + 0.26vw, 3rem)); --lmvz-button-font: var(--lmvz-typography-body-lg-strong); } display: inline-block; } ::slotted(*) { --lmvz-component-color: var(--lmvz-button-color); } "}},[785,"lmvz-button",{ti:[2562,"tabindex"],scale:[513],variant:[513],disabled:[516],type:[1],form:[1],formMethod:[1,"form-method"],name:[1],value:[1]}]);function c(){"undefined"!=typeof customElements&&["lmvz-button"].forEach((t=>{"lmvz-button"===t&&(customElements.get(e(t))||customElements.define(e(t),d))}))}export{d as L,c as d}
|
package/components/p-DBZE-Jyu.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{p as t,H as e,h as n,d as s,t as i}from"./p-DGg7OzDl.js";import{a as o,i as a}from"./p-CdDO7mQa.js";import{a as r}from"./p-DOTK1OW3.js";const c=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow()}actionsSlot;validationMessageCache=[];actionsStateObserver;get primaryEnabledAction(){return this.enabledButtons.find(p)??this.enabledButtons[0]}get hasActions(){return this.assignedButtons.some((t=>l(t)&&u(t)&&!h(t)))}componentDidLoad(){this.handleActionsSlotChange()}disconnectedCallback(){this.actionsStateObserver?.disconnect()}get assignedElements(){return this.actionsSlot?.assignedElements({flatten:!0})??[]}get assignedButtons(){return this.assignedElements.filter(u)}get visibleButtons(){return this.assignedButtons.filter(l)}get enabledButtons(){return this.visibleButtons.filter((t=h,(...e)=>{const n=t(...e);return o(n)?n.then((t=>!t)):!n}));var t}getActionValidationResult(){if(!this.visibleButtons.length)return[];const t=this.visibleButtons.filter(p),e=this.visibleButtons.filter(f),n=[],s=this.visibleButtons.toReversed();if(1!==t.length&&n.push("LmvzModal actions slot must contain exactly one primary action."),e.length>1&&n.push(`LmvzModal actions slot must contain at most one secondary action (received ${e.length})`),t.length){const i=e[0];0!==s.indexOf(t[0])&&n.push("Primary action must be the last focusable element in the actions slot (i.e. rightmost button)."),i&&1!==s.indexOf(i)&&n.push("Secondary action must be the second-to-last focusable element in the actions slot (i.e. left of primary button).")}else e.length&&0!==s.indexOf(e[0])&&n.push("Secondary action must be the last focusable element in the actions slot when no primary action is present (i.e. rightmost button).");return n}handleActionsSlotChange=()=>{this.observeActionState(),this.syncActionsState()};observeActionState(){"undefined"!=typeof MutationObserver&&(this.actionsStateObserver?.disconnect(),this.assignedButtons.length&&(this.actionsStateObserver=new MutationObserver((()=>{this.syncActionsState()})),this.assignedButtons.forEach((t=>{this.actionsStateObserver?.observe(t,{attributes:!0,attributeFilter:["disabled","hidden","variant"]})}))))}syncActionsState(){this.assignedElements.forEach((t=>{["LMVZ-BUTTON","BUTTON"].includes(t.tagName.toUpperCase())||(t.hasAttribute("hidden")||t.setAttribute("hidden",""),"true"!==t.getAttribute("aria-hidden")&&t.setAttribute("aria-hidden","true"))})),this.checkActions();const t=this.visibleButtons.length;for(let e=0;e<t;e++){const n=e===t-1?"primary":e===t-2?"secondary":"tertiary",s=this.visibleButtons.at(e);s&&(d(s)?s.getAttribute("variant")||s.setAttribute("variant",n):s.classList.add(n))}this.focusPrimaryAction()}focusPrimaryAction(){const t=this.primaryEnabledAction;t&&"undefined"!=typeof window&&window.requestAnimationFrame((()=>{r(t)&&t.focus()}))}checkActions(){if(!a())return;const t=this.getActionValidationResult();t.length&&t.forEach((t=>{this.validationMessageCache.includes(t)||(console.warn(t),this.validationMessageCache.push(t))}))}render(){return n(s,{key:"56b60821ecaa2301d13e78d621e873aa74cd170e"},n("slot",{key:"e6a1422950fa5b0026356b7788a607a690116186",ref:t=>this.actionsSlot=t,onSlotchange:this.handleActionsSlotChange}))}static get style(){return":host{display:flex;justify-content:flex-end;gap:var(--lmvz-component-input-gap-md, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem));font:var(--lmvz-typography-body-md);flex-wrap:wrap}::slotted([hidden]){display:none !important}"}},[257,"lmvz-button-group",{primaryEnabledAction:[2064],hasActions:[2052,"has-actions"]}]);function u(t){return["LMVZ-BUTTON","BUTTON"].includes(t.tagName.toUpperCase())}function d(t){return"LMVZ-BUTTON"===t?.tagName.toUpperCase()}function h(t){return t.hasAttribute("disabled")||!0===t.disabled}function l(t){return!t.hasAttribute("hidden")}function m(t){const e=t.getAttribute("variant")??t.variant;return"primary"===e||"secondary"===e||"tertiary"===e?e:"secondary"}function p(t){return"primary"===m(t)}function f(t){return"secondary"===m(t)}function y(){"undefined"!=typeof customElements&&["lmvz-button-group"].forEach((t=>{"lmvz-button-group"===t&&(customElements.get(i(t))||customElements.define(i(t),c))}))}export{c as L,y as d}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{g as e,r as t,c as r,h as o,H as m}from"./p-BPeerEwm.js";import{A as a}from"./p-CPOia2kT.js";import{E as i}from"./p-CN0JX9-m.js";import{R as n}from"./p-FBuCCcFC.js";import"./p-CdDO7mQa.js";const l=class extends n{get el(){return e(this)}get validationEl(){return this.el}validationSlot;get role(){return"menuitem"}get ti(){return 0}lmvzActivation;constructor(e){super(),t(this,e),this.lmvzActivation=r(this,"lmvzActivation",7),this.addController(new a(this,{validationTiming:"slot"})),this.addController(new i(this))}render(){return o(m,{key:"3a722fe1fbacabd99ac5a5bd23537a1ff383fb95"},o("slot",{key:"e475dd50bbd2f9f349edb61766a0b21c1fb1ae16",ref:e=>this.validationSlot=e}))}};l.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; } } .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); 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, #000000); --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, #f6fbfe); --lmvz-menuitem-color: var(--lmvz-semantic-color-status-on-active, #0e7ab4); }";export{l as lmvz_menuitem}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{g as t,r as o,c as n,h as e,H as i}from"./p-BPeerEwm.js";import{c as r}from"./p-BfTCfPZ1.js";import{A as a}from"./p-CPOia2kT.js";import{E as l}from"./p-CN0JX9-m.js";import{i as m,f as s}from"./p-DOTK1OW3.js";import{R as c}from"./p-FBuCCcFC.js";import{p as v}from"./p-CcxjkCOx.js";import{a as d}from"./p-CFsC37ww.js";import"./p-CdDO7mQa.js";import"./p-CGmJG63p.js";const u=class extends c{get el(){return t(this)}validationEl;inheritedAttributes={};formEl=null;formButtonEl=null;lmvzActivation;get ti(){return 0}scale="default";variant;disabled=!1;type="button";form;formMethod;name;value;constructor(t){super(),o(this,t),this.lmvzActivation=n(this,"lmvzActivation",7),this.addController(new a(this)),this.addController(new l(this,{localHandler:this.handleClick.bind(this),keys:["Enter"]}))}connectedCallback(){this.inheritedAttributes=m(this.el),super.connectedCallback()}disconnectedCallback(){this.formButtonEl?.remove(),this.formButtonEl=null,this.formEl=null,super.disconnectedCallback()}renderHiddenButton(){if("submit"!==this.type)return this.formButtonEl?.remove(),this.formButtonEl=null,void(this.formEl=null);const t=s(this.form,this.el);if(!t)return this.formButtonEl?.remove(),this.formButtonEl=null,void(this.formEl=null);this.formEl=t;const o=this.formButtonEl??document.createElement("button");o.type="submit",o.style.display="none",o.disabled=this.disabled,o.name=this.name??"",o.value=this.value??"",this.formMethod?o.setAttribute("formmethod",this.formMethod):o.removeAttribute("formmethod"),this.formButtonEl!==o&&(this.formButtonEl=o),o.parentElement!==t&&(o.remove(),t.appendChild(o))}submitForm(t){this.formEl&&this.formButtonEl&&(t.preventDefault(),this.formButtonEl.click())}handleClick=t=>{"submit"===this.type&&this.submitForm(t)};render(){return this.renderHiddenButton(),e(i,{key:"8196de85afc3878c6f38e582d7c031f5d19bcd36","aria-disabled":this.disabled?"true":null},e("button",{key:"8d73f979fa227de22a03403a2a3938684911060a",ref:t=>this.validationEl=t,part:"button",disabled:this.disabled,type:this.type,class:r(this.variant??"secondary",{[this.scale??""]:!!this.scale,disabled:this.disabled}),...this.inheritedAttributes},e("slot",{key:"18e91a2f94ba0d7e5cf13150191003e2f0b2a03a"})))}static get delegatesFocus(){return!0}};u.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; } } :host { button { --lmvz-button-color: var(--lmvz-component-color, var(--lmvz-semantic-color-int-on-secondary, #000000)); --lmvz-button-padding-inline: var(--lmvz-button-padding, var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem))); --lmvz-button-padding-block: var(--lmvz-button-padding, var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem))); --lmvz-button-gap: var(--lmvz-component-input-gap-md, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem)); --lmvz-button-min-height: var(--lmvz-component-input-size-md, clamp(2.5rem, 2.44rem + 0.26vw, 2.75rem)); --lmvz-button-font: var(--lmvz-typography-body-md-strong); --lmvz-button-radius: var(--lmvz-component-input-radius-default, 999px); --lmvz-button-border-width: 0; --lmvz-button-border-color: transparent; --lmvz-button-background: var(--lmvz-semantic-color-int-secondary, #f0f0f0); display: inline-flex; align-items: center; justify-content: center; gap: var(--lmvz-button-gap); padding-block: var(--lmvz-button-padding-block); padding-inline: var(--lmvz-button-padding-inline); min-height: var(--lmvz-button-min-height); border-radius: var(--lmvz-button-radius); border: var(--lmvz-button-border-width) solid var(--lmvz-button-border-color); background-color: var(--lmvz-button-background); color: var(--lmvz-button-color); cursor: pointer; font: var(--lmvz-button-font); text-align: center; text-decoration: none; white-space: nowrap; transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease; } button > * { font: inherit; color: inherit; } button:focus-visible { outline: var(--lmvz-ds-outline); outline-offset: var(--lmvz-ds-outline-offset); } button:is([disabled], .disabled) { cursor: not-allowed; pointer-events: none; opacity: var(--lmvz-component-input-disabled-opacity, 40%); } button:not([disabled]):hover { --lmvz-button-background: var(--lmvz-semantic-color-int-secondary-hover, #e0e0e0); } button:not([disabled]):active { --lmvz-button-background: var(--lmvz-semantic-color-int-secondary-active, #d4d4d4); } button.primary { --lmvz-button-background: var(--lmvz-semantic-color-int-primary, #000000); --lmvz-button-color: var(--lmvz-semantic-color-int-on-primary, #ffffff); --lmvz-button-border-width: 0; --lmvz-button-border-color: transparent; } button.primary:not([disabled], .disabled):hover { --lmvz-button-background: var(--lmvz-semantic-color-int-primary-hover, #2e2e2e); } button.primary:not([disabled], .disabled):active { --lmvz-button-background: var(--lmvz-semantic-color-int-primary-active, #545454); } button.secondary { --lmvz-button-background: var(--lmvz-semantic-color-int-secondary, #f0f0f0); --lmvz-button-color: var(--lmvz-semantic-color-int-on-secondary, #000000); --lmvz-button-border-width: 0; --lmvz-button-border-color: transparent; } button.secondary:not([disabled], .disabled):hover { --lmvz-button-background: var(--lmvz-semantic-color-int-secondary-hover, #e0e0e0); --lmvz-button-color: var(--lmvz-semantic-color-int-on-secondary-hover, #000000); } button.secondary:not([disabled], .disabled):active { --lmvz-button-background: var(--lmvz-semantic-color-int-secondary-active, #d4d4d4); --lmvz-button-color: var(--lmvz-semantic-color-int-on-secondary-active, #000000); } button.tertiary { --lmvz-button-background: var(--lmvz-semantic-color-int-tertiary, #ffffff); --lmvz-button-color: var(--lmvz-semantic-color-int-on-tertiary, #000000); } button.tertiary:not([disabled], .disabled):hover { --lmvz-button-background: var(--lmvz-semantic-color-int-tertiary-hover, #f0f0f0); --lmvz-button-color: var(--lmvz-semantic-color-int-on-tertiary-hover, #000000); } button.tertiary:not([disabled], .disabled):active { --lmvz-button-background: var(--lmvz-semantic-color-int-tertiary-active, #e0e0e0); --lmvz-button-color: var(--lmvz-semantic-color-int-on-tertiary-active, #000000); } button.small { --lmvz-button-padding-inline: var(--lmvz-component-input-padding-sm, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem)); --lmvz-button-padding-block: var(--lmvz-component-input-padding-sm, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem)); --lmvz-button-gap: var(--lmvz-component-input-gap-sm, clamp(0.38rem, 0.31rem + 0.26vw, 0.63rem)); --lmvz-button-min-height: var(--lmvz-component-input-size-sm, clamp(2rem, 1.94rem + 0.26vw, 2.25rem)); --lmvz-button-font: var(--lmvz-typography-body-sm-strong); } button.large { --lmvz-button-padding-inline: var(--lmvz-component-input-padding-lg, clamp(1rem, 0.94rem + 0.26vw, 1.25rem)); --lmvz-button-padding-block: var(--lmvz-component-input-padding-lg, clamp(1rem, 0.94rem + 0.26vw, 1.25rem)); --lmvz-button-gap: var(--lmvz-component-input-gap-lg, clamp(0.75rem, 0.69rem + 0.26vw, 1rem)); --lmvz-button-min-height: var(--lmvz-component-input-size-lg, clamp(2.75rem, 2.69rem + 0.26vw, 3rem)); --lmvz-button-font: var(--lmvz-typography-body-lg-strong); } display: inline-block; } ::slotted(*) { --lmvz-component-color: var(--lmvz-button-color); } ";const h=class extends c{intersectionObserver;ariaValidationController=new a(this);get el(){return t(this)}validationEl;icon;weight="medium";size="md";iconset;iconData;visible=!1;ariaLabel;get ariaHidden(){return!this.ariaLabel}constructor(t){super(),o(this,t),this.addController(this.ariaValidationController)}connectedCallback(){this.waitUntilVisible((()=>{this.visible=!0,this.loadIconPathData()})),super.connectedCallback()}disconnectedCallback(){this.intersectionObserver&&"function"==typeof this.intersectionObserver.disconnect&&this.intersectionObserver.disconnect(),this.intersectionObserver=void 0,super.disconnectedCallback()}async loadIconPathData(){const{icon:t,iconset:o,visible:n}=this;if(!t||!n)return;const e=v(t);this.iconData=e||await d({icon:t,iconset:o})}componentDidRender(){this.validationEl=this.el.querySelector("svg"),this.ariaValidationController.revalidateAria(),super.componentDidRender()}render(){return e(i,{key:"03b4391d02a77409257bcda51c2b65ad9a9e0a0c",role:"img","aria-hidden":`${this.ariaHidden}`,innerHTML:this.iconData})}waitUntilVisible(t,o=50){"undefined"!=typeof window&&window.IntersectionObserver?(this.intersectionObserver=new IntersectionObserver((o=>{o.some((o=>!!o.isIntersecting&&(this.intersectionObserver&&"function"==typeof this.intersectionObserver.disconnect&&this.intersectionObserver.disconnect(),this.intersectionObserver=void 0,t(),!0)))}),{rootMargin:`${o}px`}),this.intersectionObserver.observe(this.el)):t()}static get watchers(){return{icon:[{loadIconPathData:0}],iconset:[{loadIconPathData:0}]}}};h.style=".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)}}";export{u as lmvz_button,h as lmvz_icon}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{r as e,g as a,h as t,H as o}from"./p-BPeerEwm.js";const r=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(o,{key:"1232c42d1e4b0a22710076dcd021e910e9b71c3c"},t("button",{key:"a5d85b761836038a93b102052ff9b09cab04bd7f",part:"button",role:"tab",disabled:this.disabled,"aria-selected":String(this.selected),"aria-disabled":this.disabled?"true":void 0,tabIndex:0},t("slot",{key:"ce429f5e6d05ed4ef506276231aa0a54cd9f050f",name:"media",ref:e=>this.mediaSlotEl=e,onSlotchange:this.handleMediaSlotChange}),t("span",{key:"637e0da61c21950b0b1c8d5622315c8921007fdb",class:"label"},t("slot",{key:"1c035b6763d0fa894d9dadb1407b87ca3e2f0da5"})),t("span",{key:"88c6e4d8fe990e6b722664641d23310748afd7c0","aria-hidden":"true",part:"indicator",class:"indicator"})))}static get delegatesFocus(){return!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; } } :host { display: inline-block; flex: none; } :host([disabled]) { cursor: not-allowed; pointer-events: none; } button { --lmvz-tab-color: var(--lmvz-semantic-color-int-on-secondary, #000000); --lmvz-tab-background: var(--lmvz-semantic-color-int-secondary, #f0f0f0); position: relative; display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--lmvz-component-component-spacing-0-default, 4px); padding-top: var(--lmvz-dimension-8-12, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem)); padding-bottom: var(--lmvz-dimension-8-14, clamp(0.5rem, 0.41rem + 0.39vw, 0.88rem)); padding-inline: var(--lmvz-dimension-16-24, clamp(1rem, 0.88rem + 0.52vw, 1.5rem)); border: none; border-radius: var(--lmvz-semantic-border-radius-round, 999px); background: var(--lmvz-tab-background); color: var(--lmvz-tab-color); font: var(--lmvz-typography-body-md-strong); cursor: pointer; white-space: nowrap; transition: background-color 0.15s ease, color 0.15s ease; } button:focus-visible { outline: var(--lmvz-ds-outline); outline-offset: var(--lmvz-ds-outline-offset); z-index: 1; } button:disabled { opacity: var(--lmvz-component-input-disabled-opacity, 40%); pointer-events: none; cursor: not-allowed; } button:hover { --lmvz-tab-background: var(--lmvz-semantic-color-int-tertiary-hover, #f0f0f0); --lmvz-tab-color: var(--lmvz-semantic-color-int-on-secondary-hover, #000000); } button:active { --lmvz-tab-background: var(--lmvz-semantic-color-int-tertiary-active, #e0e0e0); --lmvz-tab-color: var(--lmvz-semantic-color-int-on-secondary-active, #000000); } :host([has-media]) { --lmvz-tab-color: var(--lmvz-semantic-color-int-on-tertiary, #000000); --lmvz-tab-background: var(--lmvz-semantic-color-int-tertiary, #ffffff); } :host([has-media]) button { padding-top: var(--lmvz-dimension-16-18, clamp(1rem, 0.97rem + 0.13vw, 1.13rem)); padding-bottom: var(--lmvz-dimension-12-14, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem)); padding-inline: var(--lmvz-dimension-40-48, clamp(2.5rem, 2.38rem + 0.52vw, 3rem)); border-radius: var(--lmvz-semantic-border-radius-lg, 14px); } :host([has-media]) button:hover { --lmvz-tab-color: var(--lmvz-semantic-color-int-on-tertiary-hover, #000000); } :host([has-media]) button:active { --lmvz-tab-color: var(--lmvz-semantic-color-int-on-tertiary-active, #000000); } :host([selected]) button { --lmvz-tab-color: var(--lmvz-semantic-color-status-on-active, #0e7ab4); --lmvz-tab-background: var(--lmvz-semantic-color-status-active, #f6fbfe); } :host([selected][has-media]) button:hover, :host([selected][has-media]) button:active { --lmvz-tab-color: var(--lmvz-semantic-color-status-on-active, #0e7ab4); } .indicator { --lmvz-tab-indicator-size: 4px; position: absolute; background: linear-gradient(to right, var(--lmvz-semantic-color-gradient-main-1, #0e7ab4), var(--lmvz-semantic-color-gradient-main-2, #0e7ab4)); opacity: 0; transition: opacity 0.15s ease; inset-block-end: 0; inset-inline: 0; block-size: var(--lmvz-tab-indicator-size); border-start-start-radius: 0; border-start-end-radius: 0; border-end-start-radius: var(--lmvz-tab-indicator-size); border-end-end-radius: var(--lmvz-tab-indicator-size); } :host([selected][has-media]) .indicator { opacity: 1; } :host([vertical]) button { border-radius: var(--lmvz-semantic-border-radius-round, 999px); } :host([vertical]) .indicator { inset-block: 0; inset-inline: 0 auto; inline-size: var(--lmvz-tab-indicator-size); block-size: auto; border-radius: 0 var(--lmvz-tab-indicator-size) var(--lmvz-tab-indicator-size) 0; background: linear-gradient(to bottom, var(--lmvz-semantic-color-gradient-main-1, #0e7ab4), var(--lmvz-semantic-color-gradient-main-2, #0e7ab4)); } ::slotted(*) { --lmvz-component-color: var(--lmvz-tab-color); } ::slotted(lmvz-icon) { --lmvz-component-size: var(--lmvz-dimension-16-18, clamp(1rem, 0.97rem + 0.13vw, 1.13rem)); } :host([has-media]) ::slotted(lmvz-icon) { --lmvz-component-size: var(--lmvz-component-icon-size-lg, clamp(1.5rem, 1.44rem + 0.26vw, 1.75rem)); } .label { display: contents; } ";export{r as lmvz_tab}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{a as t,r as e,c as r,h as o,H as a}from"./p-BPeerEwm.js";const n=class{constructor(t){e(this,t),this.primaryAction=r(this,"primaryAction",7)}cardTitle;imageUrl;description;primaryActionLabel="";primaryAction;get fallbackImage(){return((e,r)=>{const o=function(...t){return t.filter(Boolean).join("/").replace("//","/").replace("/./","/")}("../../assets",r,e);try{return t(o)}catch{return console.warn(`Failed to create URL for asset "${e}" in path "${r}".\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(o,import.meta?.url??window?.location?.origin??"")}})("card-placeholder.svg")}_onPrimaryClick(){this.primaryAction.emit()}_onOverflowClick(t){console.log(t)}render(){return o(a,{key:"2d9ecdeed986f142fb7ff477b56dece59549bbc7",role:"article"},o("div",{key:"34fc9c3a1338b31ce73424e8c07c79a291ead85c",class:"top"},o("div",{key:"1756e6b26d7f42499753c36ed0fc13755fe32bfe",class:"image-wrapper",style:{backgroundImage:`url(${this.imageUrl??this.fallbackImage})`}},o("div",{key:"cd8be8acc9e949092b6363024316d12d445a9fbc",class:"chip-slot"},o("slot",{key:"26389ab3b7031b948ff1701857e6028446662cf5",name:"chip"})))),o("div",{key:"2fa61cd7bef437f15929ae39be7fa294e8778321",class:"bottom"},o("header",{key:"b237ca025e42a29f528f827dc3c83b3b0f9267c0"},o("h2",{key:"ffd0a509ba97acb75d4c15d0fd01eef08689a2a7",class:"title"},this.cardTitle)),o("p",{key:"c40bd5d5f7e41a0cebc2f7f9e572ba98cc892cc1",class:"description"},this.description),o("div",{key:"7663f93b41ef1e798b464bd6ad75ca8a53c0667b",class:"actions"},o("button",{key:"3348e6700aa1571183558ab8fe4f73393c1cc943",class:"primary",onClick:this._onPrimaryClick.bind(this),"data-testid":"primary"},this.primaryActionLabel),o("button",{key:"d3a12cdabbdd68c3b04e06984db44abd3bbd22ea",class:"tertiary","aria-label":"More actions",onClick:this._onOverflowClick},o("span",{key:"80e31e6b691e18d1b42a2b4831349c3abf8e02b0",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; } } .sc-lmvz-card-h { button { --lmvz-button-color: var(--lmvz-component-color, var(--lmvz-semantic-color-int-on-secondary, #000000)); --lmvz-button-padding-inline: var(--lmvz-button-padding, var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem))); --lmvz-button-padding-block: var(--lmvz-button-padding, var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem))); --lmvz-button-gap: var(--lmvz-component-input-gap-md, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem)); --lmvz-button-min-height: var(--lmvz-component-input-size-md, clamp(2.5rem, 2.44rem + 0.26vw, 2.75rem)); --lmvz-button-font: var(--lmvz-typography-body-md-strong); --lmvz-button-radius: var(--lmvz-component-input-radius-default, 999px); --lmvz-button-border-width: 0; --lmvz-button-border-color: transparent; --lmvz-button-background: var(--lmvz-semantic-color-int-secondary, #f0f0f0); display: inline-flex; align-items: center; justify-content: center; gap: var(--lmvz-button-gap); padding-block: var(--lmvz-button-padding-block); padding-inline: var(--lmvz-button-padding-inline); min-height: var(--lmvz-button-min-height); border-radius: var(--lmvz-button-radius); border: var(--lmvz-button-border-width) solid var(--lmvz-button-border-color); background-color: var(--lmvz-button-background); color: var(--lmvz-button-color); cursor: pointer; font: var(--lmvz-button-font); text-align: center; text-decoration: none; white-space: nowrap; transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease; } button > * { font: inherit; color: inherit; } button:focus-visible { outline: var(--lmvz-ds-outline); outline-offset: var(--lmvz-ds-outline-offset); } button:is([disabled], .disabled) { cursor: not-allowed; pointer-events: none; opacity: var(--lmvz-component-input-disabled-opacity, 40%); } button:not([disabled]):hover { --lmvz-button-background: var(--lmvz-semantic-color-int-secondary-hover, #e0e0e0); } button:not([disabled]):active { --lmvz-button-background: var(--lmvz-semantic-color-int-secondary-active, #d4d4d4); } button.primary { --lmvz-button-background: var(--lmvz-semantic-color-int-primary, #000000); --lmvz-button-color: var(--lmvz-semantic-color-int-on-primary, #ffffff); --lmvz-button-border-width: 0; --lmvz-button-border-color: transparent; } button.primary:not([disabled], .disabled):hover { --lmvz-button-background: var(--lmvz-semantic-color-int-primary-hover, #2e2e2e); } button.primary:not([disabled], .disabled):active { --lmvz-button-background: var(--lmvz-semantic-color-int-primary-active, #545454); } button.secondary { --lmvz-button-background: var(--lmvz-semantic-color-int-secondary, #f0f0f0); --lmvz-button-color: var(--lmvz-semantic-color-int-on-secondary, #000000); --lmvz-button-border-width: 0; --lmvz-button-border-color: transparent; } button.secondary:not([disabled], .disabled):hover { --lmvz-button-background: var(--lmvz-semantic-color-int-secondary-hover, #e0e0e0); --lmvz-button-color: var(--lmvz-semantic-color-int-on-secondary-hover, #000000); } button.secondary:not([disabled], .disabled):active { --lmvz-button-background: var(--lmvz-semantic-color-int-secondary-active, #d4d4d4); --lmvz-button-color: var(--lmvz-semantic-color-int-on-secondary-active, #000000); } button.tertiary { --lmvz-button-background: var(--lmvz-semantic-color-int-tertiary, #ffffff); --lmvz-button-color: var(--lmvz-semantic-color-int-on-tertiary, #000000); } button.tertiary:not([disabled], .disabled):hover { --lmvz-button-background: var(--lmvz-semantic-color-int-tertiary-hover, #f0f0f0); --lmvz-button-color: var(--lmvz-semantic-color-int-on-tertiary-hover, #000000); } button.tertiary:not([disabled], .disabled):active { --lmvz-button-background: var(--lmvz-semantic-color-int-tertiary-active, #e0e0e0); --lmvz-button-color: var(--lmvz-semantic-color-int-on-tertiary-active, #000000); } button.small { --lmvz-button-padding-inline: var(--lmvz-component-input-padding-sm, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem)); --lmvz-button-padding-block: var(--lmvz-component-input-padding-sm, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem)); --lmvz-button-gap: var(--lmvz-component-input-gap-sm, clamp(0.38rem, 0.31rem + 0.26vw, 0.63rem)); --lmvz-button-min-height: var(--lmvz-component-input-size-sm, clamp(2rem, 1.94rem + 0.26vw, 2.25rem)); --lmvz-button-font: var(--lmvz-typography-body-sm-strong); } button.large { --lmvz-button-padding-inline: var(--lmvz-component-input-padding-lg, clamp(1rem, 0.94rem + 0.26vw, 1.25rem)); --lmvz-button-padding-block: var(--lmvz-component-input-padding-lg, clamp(1rem, 0.94rem + 0.26vw, 1.25rem)); --lmvz-button-gap: var(--lmvz-component-input-gap-lg, clamp(0.75rem, 0.69rem + 0.26vw, 1rem)); --lmvz-button-min-height: var(--lmvz-component-input-size-lg, clamp(2.75rem, 2.69rem + 0.26vw, 3rem)); --lmvz-button-font: var(--lmvz-typography-body-lg-strong); } 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); } .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); } .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); } .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}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{g as e,r as o,c,h as r,H as a}from"./p-BPeerEwm.js";import{t}from"./p-CcxjkCOx.js";import{A as l}from"./p-CPOia2kT.js";import{R as s}from"./p-FBuCCcFC.js";import"./p-CGmJG63p.js";import"./p-CdDO7mQa.js";const i=t("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTMuNzUgMTIuNTYyNUw4LjgzMDc5IDE3LjYyNUwyMC40Mzc1IDYuMzc1IiBzdHJva2U9ImJsYWNrIiBzdHJva2Utd2lkdGg9IjEuNzUiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8L3N2Zz4K");let h=0;const n=class extends s{get el(){return e(this)}get validationEl(){return this.el}internals;nativeInput;checkboxId="lmvz-checkbox-"+h++;initialChecked=!1;get helperId(){return this.helperText?`${this.checkboxId}-helper`:void 0}get errorId(){return this.errorMessage?`${this.checkboxId}-error`:void 0}get ariaDescribedBy(){const e=[this.errorId,this.helperId].filter(Boolean);return e.length>0?e.join(" "):void 0}label;checked=!1;value="on";name;disabled=!1;required=!1;error=!1;errorMessage;helperText;form;autofocus=!1;checkedState=!1;handleCheckedChange(e){this.checkedState=e,this.internals.setFormValue?.(e?this.value??"on":null)}lmvzChange;async focusInput(){this.nativeInput?.focus()}async checkValidity(){return this.internals?.checkValidity()??!0}async reportValidity(){return this.internals?.reportValidity()??!0}constructor(e){super(),o(this,e),this.lmvzChange=c(this,"lmvzChange",7),e.$hostElement$["s-ei"]?this.internals=e.$hostElement$["s-ei"]:(this.internals=e.$hostElement$.attachInternals(),e.$hostElement$["s-ei"]=this.internals),this.addController(new l(this,{reValidateOnPropChanges:!0}))}componentWillLoad(){this.initialChecked=this.checked,this.checkedState=this.checked,this.internals.setFormValue?.(this.checked?this.value??"on":null),super.componentWillLoad()}componentWillRender(){this.error&&!this.errorMessage&&console.warn("lmvz-checkbox: error=true set without errorMessage — no visual-only error state is rendered. Provide errorMessage to communicate the error to users."),super.componentWillRender()}formAssociatedCallback(){this.internals.setFormValue?.(this.checked?this.value??"on":null)}formResetCallback(){this.checked=this.initialChecked}formStateRestoreCallback(e){this.checked=e===(this.value??"on")}handleChange=e=>{this.checked=e.target.checked,this.lmvzChange.emit(this.checked)};retargetInnerClicks(){this.nativeInput?.click()}render(){return r(a,{key:"cea4a962a76cab10c27adc6742fe0686b2ce6dbe"},r("div",{key:"1addfd795587de85ecbc632fbeb45026a4e46050",class:"pill"},r("input",{key:"8957359d0cc3f2c315badee7e20fcc81e85e0f00",type:"checkbox",id:this.checkboxId,checked:this.checkedState,disabled:this.disabled,required:this.required,"aria-required":this.required?"true":"false","aria-invalid":this.error?"true":"false","aria-describedby":this.ariaDescribedBy,"aria-errormessage":this.error&&this.errorId?this.errorId:void 0,ref:e=>this.nativeInput=e,onChange:this.handleChange,autoFocus:this.autofocus}),r("span",{key:"400dbe9379ceb4aceeb431fe6060c82b41009cda",class:"box","aria-hidden":"true"},this.checkedState&&r("span",{key:"9612093e65346b419ec8e4469fea7f00fe4c3ff4",class:"indicator",innerHTML:i})),r("span",{key:"fd1136ea0726941bc400b8970f7cae4bb3b59363",class:"content"},r("label",{key:"a06deb2d4bc76efb884701a17e4a28420a99965c",htmlFor:this.checkboxId},this.label),this.helperText&&r("span",{key:"2bd33f14062bedbb0609dff3ac7fbcee6fa16f21",onClick:this.retargetInnerClicks.bind(this),class:"helper-text",id:this.helperId,role:"status"},this.helperText))),this.errorMessage&&r("span",{key:"ac4fcb6f0a2de16a17f0287e42b70b6339a50acc",class:"error-text",id:this.errorId,role:"alert"},this.errorMessage))}static get formAssociated(){return!0}static get watchers(){return{checked:[{handleCheckedChange:0}]}}};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; } } .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, #f6fbfe); --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); 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); cursor: pointer; 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; cursor: pointer; } label.sc-lmvz-checkbox { font: var(--lmvz-typography-body-md); color: var(--checkbox-label-color); transition: color var(--checkbox-duration) var(--checkbox-easing); cursor: pointer; } .helper-text.sc-lmvz-checkbox { font: var(--lmvz-typography-body-sm); color: var(--checkbox-helper-color); margin-block-start: 2px; } .error-text.sc-lmvz-checkbox { font: var(--lmvz-typography-body-sm); 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; input, label, .box, .content { cursor: not-allowed; } } .sc-lmvz-checkbox-h:focus-within .pill.sc-lmvz-checkbox { outline: var(--lmvz-ds-outline); outline-offset: var(--lmvz-ds-outline-offset); } @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; } .sc-lmvz-checkbox-h:focus-within .pill.sc-lmvz-checkbox { outline-color: Highlight; box-shadow: none; } }";export{n as lmvz_checkbox}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
const a=["xs","sm","md","lg"],s=[...a,"xl"],e=["text","email","password","tel","url","search","number"],l=["sm","md","lg"],r=["small","default","large"],t=[...a,"inherit"],m=["thin","medium","bold"],n=["active","warning","success","error","neutral"],i=["default","small"],d=["neutral","warning"];export{n as a,m as b,i as c,l as d,e,t as i,d as m,r as s,s as t}
|