@lmvz-ds/components 0.40.0 → 0.42.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 +12 -0
- package/cjs/{aria-validation-controller-DKNXjnQr.js → aria-validation-controller-BR7cnyq5.js} +1 -1
- package/cjs/{ds.constants-C6eKRAEu.js → ds.constants-pI-qkOYv.js} +2 -0
- package/cjs/{index-DWy4nuyZ.js → index-BUrb__KL.js} +52 -11
- package/cjs/index.cjs.js +2 -1
- package/cjs/lmvz-action-list.cjs.entry.js +2 -2
- package/cjs/lmvz-action.cjs.entry.js +1 -1
- package/cjs/lmvz-button-group.cjs.entry.js +2 -2
- package/cjs/lmvz-button_2.cjs.entry.js +4 -4
- package/cjs/lmvz-card.cjs.entry.js +59 -15
- package/cjs/lmvz-checkbox.cjs.entry.js +3 -3
- package/cjs/lmvz-chip.cjs.entry.js +4 -4
- package/cjs/lmvz-components.cjs.js +3 -3
- package/cjs/lmvz-datepicker.cjs.entry.js +3 -3
- package/cjs/lmvz-header_2.cjs.entry.js +3 -3
- package/cjs/lmvz-input.cjs.entry.js +6 -7
- package/cjs/lmvz-link.cjs.entry.js +3 -3
- package/cjs/lmvz-menuitem.cjs.entry.js +3 -3
- package/cjs/lmvz-message.cjs.entry.js +2 -2
- package/cjs/lmvz-modal.cjs.entry.js +3 -3
- package/cjs/lmvz-popover.cjs.entry.js +2 -2
- package/cjs/lmvz-radio.cjs.entry.js +3 -3
- package/cjs/lmvz-select.cjs.entry.js +3 -3
- package/cjs/lmvz-snackbar.cjs.entry.js +2 -2
- package/cjs/lmvz-spinner.cjs.entry.js +3 -3
- package/cjs/lmvz-tab.cjs.entry.js +2 -2
- package/cjs/lmvz-tabs.cjs.entry.js +2 -2
- package/cjs/lmvz-toggle.cjs.entry.js +3 -3
- package/cjs/loader.cjs.js +2 -2
- package/collection/api/ds.constants.js +1 -0
- package/collection/api/public-utils.js +3 -0
- package/collection/collection-manifest.json +2 -3
- package/collection/components/lmvz-card/lmvz-card.css +82 -194
- package/collection/components/lmvz-card/lmvz-card.js +131 -38
- package/collection/components/lmvz-checkbox/lmvz-checkbox.js +1 -1
- package/collection/components/lmvz-chip/lmvz-chip.js +1 -1
- package/collection/components/lmvz-datepicker/lmvz-datepicker.js +2 -2
- package/collection/components/lmvz-header/lmvz-header.js +1 -1
- package/collection/components/lmvz-icon/lmvz-icon.js +7 -6
- package/collection/components/lmvz-input/lmvz-input.js +14 -35
- package/collection/components/lmvz-link/lmvz-link.js +1 -1
- package/collection/components/lmvz-menuitem/lmvz-menuitem.js +1 -1
- package/collection/components/lmvz-message/lmvz-message.js +1 -1
- package/collection/components/lmvz-modal/lmvz-modal.js +1 -1
- package/collection/components/lmvz-popover/lmvz-popover.js +1 -1
- package/collection/components/lmvz-radio/lmvz-radio.js +1 -1
- package/collection/components/lmvz-select/lmvz-select.js +1 -1
- package/collection/components/lmvz-snackbar/lmvz-snackbar.js +1 -1
- package/collection/components/lmvz-spinner/lmvz-spinner.js +7 -6
- 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.js +1 -1
- package/collection/index.js +1 -3
- package/components/index.js +1 -1
- package/components/lmvz-action-list.js +1 -1
- package/components/lmvz-action.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-datepicker.js +1 -1
- package/components/lmvz-header.js +1 -1
- package/components/lmvz-icon.js +1 -1
- package/components/lmvz-input.js +1 -1
- package/components/lmvz-link.js +1 -1
- package/components/lmvz-menuitem.js +1 -1
- package/components/lmvz-message.js +1 -1
- package/components/lmvz-modal.js +1 -1
- package/components/lmvz-popover.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-Buw_s-9k.js +1 -0
- package/components/p-CME20cTM.js +1 -0
- package/components/{p-DsTgD0_a.js → p-CPsPpCPH.js} +1 -1
- package/components/{p--mU29mrX.js → p-CUSmZDCK.js} +1 -1
- package/components/p-CbxNLroR.js +1 -0
- package/components/{p-DXFoXTse.js → p-CeGgx3Rl.js} +1 -1
- package/components/{p-DyQ1GbaN.js → p-D0S1O-Op.js} +1 -1
- package/components/{p-sACbyedu.js → p-DCFz070C.js} +1 -1
- package/components/p-DCYK_qaZ.js +1 -0
- package/components/{p-niXjuPxe.js → p-Wp9d5O3R.js} +1 -1
- package/components/{p-D_mff3n7.js → p-ctF-ydws.js} +1 -1
- package/components/{p-Bc5MM0zh.js → p-g_Ehzzvy.js} +1 -1
- package/esm/{aria-validation-controller-Dwv7n0rk.js → aria-validation-controller-uMqDgutI.js} +1 -1
- package/esm/{ds.constants-0ctLESas.js → ds.constants-Buw_s-9k.js} +2 -1
- package/esm/{index-DVab4vzV.js → index-wQ10Syko.js} +52 -11
- package/esm/index.js +1 -1
- package/esm/lmvz-action-list.entry.js +2 -2
- package/esm/lmvz-action.entry.js +1 -1
- package/esm/lmvz-button-group.entry.js +2 -2
- package/esm/lmvz-button_2.entry.js +4 -4
- package/esm/lmvz-card.entry.js +59 -15
- package/esm/lmvz-checkbox.entry.js +3 -3
- package/esm/lmvz-chip.entry.js +4 -4
- package/esm/lmvz-components.js +4 -4
- package/esm/lmvz-datepicker.entry.js +3 -3
- package/esm/lmvz-header_2.entry.js +3 -3
- package/esm/lmvz-input.entry.js +6 -7
- package/esm/lmvz-link.entry.js +3 -3
- package/esm/lmvz-menuitem.entry.js +3 -3
- package/esm/lmvz-message.entry.js +2 -2
- package/esm/lmvz-modal.entry.js +3 -3
- package/esm/lmvz-popover.entry.js +2 -2
- package/esm/lmvz-radio.entry.js +3 -3
- package/esm/lmvz-select.entry.js +3 -3
- package/esm/lmvz-snackbar.entry.js +2 -2
- package/esm/lmvz-spinner.entry.js +3 -3
- package/esm/lmvz-tab.entry.js +2 -2
- package/esm/lmvz-tabs.entry.js +2 -2
- package/esm/lmvz-toggle.entry.js +3 -3
- package/esm/loader.js +3 -3
- package/hydrate/index.js +115 -53
- package/hydrate/index.mjs +115 -53
- package/lmvz-components/index.esm.js +1 -1
- package/lmvz-components/lmvz-components.esm.js +1 -1
- package/lmvz-components/p-01ac17f8.entry.js +1 -0
- package/lmvz-components/{p-e35f49a1.entry.js → p-11ccd914.entry.js} +1 -1
- package/lmvz-components/{p-143e9621.entry.js → p-1595cad0.entry.js} +1 -1
- package/lmvz-components/{p-7cbfbc88.entry.js → p-253e56c9.entry.js} +1 -1
- package/lmvz-components/{p-773e9d95.entry.js → p-2ae64b73.entry.js} +1 -1
- package/lmvz-components/{p-93b781ca.entry.js → p-3606c1db.entry.js} +1 -1
- package/lmvz-components/{p-f911691c.entry.js → p-3de59694.entry.js} +1 -1
- package/lmvz-components/p-457b10e1.entry.js +1 -0
- package/lmvz-components/{p-d73bb7fd.entry.js → p-5e8f0b43.entry.js} +1 -1
- package/lmvz-components/{p-8ba6ec19.entry.js → p-7a018765.entry.js} +1 -1
- package/lmvz-components/{p-335b3867.entry.js → p-7d80a49d.entry.js} +1 -1
- package/lmvz-components/{p-ebad823c.entry.js → p-84d2b2e5.entry.js} +1 -1
- package/lmvz-components/{p-Wi9d2-w9.js → p-BbeaVKMa.js} +1 -1
- package/lmvz-components/p-Buw_s-9k.js +1 -0
- package/lmvz-components/{p-41286514.entry.js → p-a2f03112.entry.js} +1 -1
- package/lmvz-components/p-adb37d60.entry.js +1 -0
- package/lmvz-components/{p-edec4d09.entry.js → p-b050450d.entry.js} +1 -1
- package/lmvz-components/{p-efd9d50e.entry.js → p-b0f3758f.entry.js} +1 -1
- package/lmvz-components/{p-f24f5207.entry.js → p-b123e33d.entry.js} +1 -1
- package/lmvz-components/{p-304c7554.entry.js → p-ddf5d866.entry.js} +1 -1
- package/lmvz-components/p-e40f174d.entry.js +1 -0
- package/lmvz-components/{p-220e455e.entry.js → p-edb35b52.entry.js} +1 -1
- package/lmvz-components/{p-87f21ac9.entry.js → p-ef6e12ee.entry.js} +1 -1
- package/lmvz-components/{p-316dd61a.entry.js → p-f6ac0f0d.entry.js} +1 -1
- package/lmvz-components/p-wQ10Syko.js +3 -0
- package/loader/index.d.ts +1 -1
- package/manifest.json +243 -158
- package/package.json +5 -1
- package/types/api/ds.constants.d.ts +1 -0
- package/types/api/ds.types.d.ts +4 -0
- package/types/api/public-utils.d.ts +8 -0
- package/types/components/lmvz-card/lmvz-card.d.ts +17 -6
- package/types/components/lmvz-icon/lmvz-icon.d.ts +1 -1
- package/types/components/lmvz-input/lmvz-input.d.ts +2 -3
- package/types/components/lmvz-spinner/lmvz-spinner.d.ts +1 -1
- package/types/components.d.ts +68 -43
- package/types/index.d.ts +1 -8
- package/types/stencil-public-runtime.d.ts +12 -0
- package/collection/integration/header-integration/header-integration.js +0 -51
- package/components/p-0ctLESas.js +0 -1
- package/components/p-DSDBThqb.js +0 -1
- package/components/p-DXhP6UeF.js +0 -1
- package/components/p-DbBJxuBm.js +0 -1
- package/lmvz-components/p-0ctLESas.js +0 -1
- package/lmvz-components/p-27e8b4fa.entry.js +0 -1
- package/lmvz-components/p-6aae1df9.entry.js +0 -1
- package/lmvz-components/p-743616c0.entry.js +0 -1
- package/lmvz-components/p-DVab4vzV.js +0 -2
- package/lmvz-components/p-c884c76e.entry.js +0 -1
|
@@ -14,7 +14,7 @@ export class LmvzIcon extends ReactiveControllerHost {
|
|
|
14
14
|
iconset;
|
|
15
15
|
iconData;
|
|
16
16
|
visible = false;
|
|
17
|
-
ariaLabel;
|
|
17
|
+
ariaLabel = null;
|
|
18
18
|
get ariaHidden() {
|
|
19
19
|
return !this.ariaLabel;
|
|
20
20
|
}
|
|
@@ -57,7 +57,7 @@ export class LmvzIcon extends ReactiveControllerHost {
|
|
|
57
57
|
super.componentDidRender();
|
|
58
58
|
}
|
|
59
59
|
render() {
|
|
60
|
-
return h(Host, { key: '
|
|
60
|
+
return h(Host, { key: '7bf1348d1e88c5debeeb592bde76e74625a2b58b', role: "img", "aria-hidden": `${this.ariaHidden}`, innerHTML: this.iconData });
|
|
61
61
|
}
|
|
62
62
|
waitUntilVisible(callback, rootMargin = 50) {
|
|
63
63
|
if (!Build.isBrowser || typeof window === 'undefined' || !window.IntersectionObserver) {
|
|
@@ -196,12 +196,12 @@ export class LmvzIcon extends ReactiveControllerHost {
|
|
|
196
196
|
"type": "string",
|
|
197
197
|
"mutable": false,
|
|
198
198
|
"complexType": {
|
|
199
|
-
"original": "string",
|
|
200
|
-
"resolved": "
|
|
199
|
+
"original": "string | null",
|
|
200
|
+
"resolved": "null | string",
|
|
201
201
|
"references": {}
|
|
202
202
|
},
|
|
203
203
|
"required": false,
|
|
204
|
-
"optional":
|
|
204
|
+
"optional": false,
|
|
205
205
|
"docs": {
|
|
206
206
|
"tags": [],
|
|
207
207
|
"text": "Accessible name for assistive technology.\nLeave unset for decorative icons so the icon stays hidden from the accessibility tree."
|
|
@@ -209,7 +209,8 @@ export class LmvzIcon extends ReactiveControllerHost {
|
|
|
209
209
|
"getter": false,
|
|
210
210
|
"setter": false,
|
|
211
211
|
"reflect": true,
|
|
212
|
-
"attribute": "aria-label"
|
|
212
|
+
"attribute": "aria-label",
|
|
213
|
+
"defaultValue": "null"
|
|
213
214
|
}
|
|
214
215
|
};
|
|
215
216
|
}
|
|
@@ -48,9 +48,8 @@ export class LmvzInput extends ReactiveControllerHost {
|
|
|
48
48
|
errorMessage;
|
|
49
49
|
autocomplete;
|
|
50
50
|
inputmode;
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
spellcheck;
|
|
51
|
+
autocapitalize = null;
|
|
52
|
+
spellcheck = null;
|
|
54
53
|
autofocus = false;
|
|
55
54
|
minlength;
|
|
56
55
|
maxlength;
|
|
@@ -204,9 +203,9 @@ export class LmvzInput extends ReactiveControllerHost {
|
|
|
204
203
|
render() {
|
|
205
204
|
const hasValue = Boolean(this.value);
|
|
206
205
|
const shouldFloatLabel = hasValue || Boolean(this.placeholder);
|
|
207
|
-
return (h("div", { key: '
|
|
206
|
+
return (h("div", { key: 'abdfa466acfad7e676fca966955fd4ae6ba231ec', class: classNames('input-container', {
|
|
208
207
|
'interaction-filled': hasValue,
|
|
209
|
-
}) }, h("div", { key: '
|
|
208
|
+
}) }, h("div", { key: 'deb354e87dae72df22bca98a17c542996fbd926b', class: "input-wrapper" }, h("slot", { key: '513529b58c611bdf06afea01803962d0cc7a4385', name: "before-input" }), h("div", { key: 'dcf1a5aa6dcb67a407225d3ace4a1369c1b72c01', class: "label-input-group" }, h("label", { key: 'c47ff2479e84e13b6361fe1ebccb8ec153dcce5e', htmlFor: this.inputId, class: classNames({ floating: shouldFloatLabel }) }, this.label, this.required && (h("span", { key: '03e4ac8dbbfb1f96a9b0f45600872f66d97755b7', class: "required-indicator", "aria-hidden": "true" }, ' ', "*"))), h("input", { key: '5607738d802be72657129aa7b45ae9ffde002f54', id: this.inputId, ref: (el) => (this.nativeInputElement = el), type: this.type, min: this.min, max: this.max, step: this.step, value: this.value, name: this.name, placeholder: this.placeholder, disabled: this.disabled, readonly: this.readonly, required: this.required, form: this.form, autocomplete: this.autocomplete, inputmode: this.inputmode, autocapitalize: this.autocapitalize ?? undefined, spellcheck: this.spellcheck, autofocus: this.autofocus, minlength: this.minlength, maxlength: this.maxlength, pattern: this.pattern, "aria-invalid": this.error ? 'true' : 'false', "aria-required": this.required ? 'true' : 'false', "aria-describedby": this.describedBy, "aria-errormessage": this.errorId, onInput: this.handleInput, onBlur: this.handleBlur, onInvalid: this.handleInvalid })), h("slot", { key: '74b93032b4c650fea28bfd9359bba01365f7599d', name: "after-input" })), h("div", { key: 'cef5ff26b3c2d3b4d9b1a069ceb784dd3a4be84a', id: this.helperId, role: "status" }, this.helperText || null), h("div", { key: '5a7d0213bc76e15fb65648eb78de02a717d0f4ca', id: this.errorId, role: "alert" }, (this.showErrorMessage && this.errorMessage) || null)));
|
|
210
209
|
}
|
|
211
210
|
static get is() { return "lmvz-input"; }
|
|
212
211
|
static get encapsulation() { return "scoped"; }
|
|
@@ -488,34 +487,12 @@ export class LmvzInput extends ReactiveControllerHost {
|
|
|
488
487
|
"reflect": false,
|
|
489
488
|
"attribute": "inputmode"
|
|
490
489
|
},
|
|
491
|
-
"autocorrect": {
|
|
492
|
-
"type": "string",
|
|
493
|
-
"mutable": false,
|
|
494
|
-
"complexType": {
|
|
495
|
-
"original": "'on' | 'off'",
|
|
496
|
-
"resolved": "\"off\" | \"on\" | undefined",
|
|
497
|
-
"references": {}
|
|
498
|
-
},
|
|
499
|
-
"required": false,
|
|
500
|
-
"optional": true,
|
|
501
|
-
"docs": {
|
|
502
|
-
"tags": [{
|
|
503
|
-
"name": "default",
|
|
504
|
-
"text": "undefined"
|
|
505
|
-
}],
|
|
506
|
-
"text": "Autocorrect attribute for mobile keyboards"
|
|
507
|
-
},
|
|
508
|
-
"getter": false,
|
|
509
|
-
"setter": false,
|
|
510
|
-
"reflect": false,
|
|
511
|
-
"attribute": "autocorrect"
|
|
512
|
-
},
|
|
513
490
|
"autocapitalize": {
|
|
514
491
|
"type": "string",
|
|
515
492
|
"mutable": false,
|
|
516
493
|
"complexType": {
|
|
517
|
-
"original": "Input.Autocapitalize",
|
|
518
|
-
"resolved": "\"characters\" | \"none\" | \"off\" | \"on\" | \"sentences\" | \"words\" |
|
|
494
|
+
"original": "Input.Autocapitalize | null",
|
|
495
|
+
"resolved": "\"characters\" | \"none\" | \"off\" | \"on\" | \"sentences\" | \"words\" | null",
|
|
519
496
|
"references": {
|
|
520
497
|
"Input": {
|
|
521
498
|
"location": "import",
|
|
@@ -526,7 +503,7 @@ export class LmvzInput extends ReactiveControllerHost {
|
|
|
526
503
|
}
|
|
527
504
|
},
|
|
528
505
|
"required": false,
|
|
529
|
-
"optional":
|
|
506
|
+
"optional": false,
|
|
530
507
|
"docs": {
|
|
531
508
|
"tags": [{
|
|
532
509
|
"name": "default",
|
|
@@ -537,18 +514,19 @@ export class LmvzInput extends ReactiveControllerHost {
|
|
|
537
514
|
"getter": false,
|
|
538
515
|
"setter": false,
|
|
539
516
|
"reflect": false,
|
|
540
|
-
"attribute": "autocapitalize"
|
|
517
|
+
"attribute": "autocapitalize",
|
|
518
|
+
"defaultValue": "null"
|
|
541
519
|
},
|
|
542
520
|
"spellcheck": {
|
|
543
521
|
"type": "boolean",
|
|
544
522
|
"mutable": false,
|
|
545
523
|
"complexType": {
|
|
546
|
-
"original": "boolean",
|
|
547
|
-
"resolved": "boolean |
|
|
524
|
+
"original": "boolean | null",
|
|
525
|
+
"resolved": "boolean | null",
|
|
548
526
|
"references": {}
|
|
549
527
|
},
|
|
550
528
|
"required": false,
|
|
551
|
-
"optional":
|
|
529
|
+
"optional": false,
|
|
552
530
|
"docs": {
|
|
553
531
|
"tags": [{
|
|
554
532
|
"name": "default",
|
|
@@ -559,7 +537,8 @@ export class LmvzInput extends ReactiveControllerHost {
|
|
|
559
537
|
"getter": false,
|
|
560
538
|
"setter": false,
|
|
561
539
|
"reflect": false,
|
|
562
|
-
"attribute": "spellcheck"
|
|
540
|
+
"attribute": "spellcheck",
|
|
541
|
+
"defaultValue": "null"
|
|
563
542
|
},
|
|
564
543
|
"autofocus": {
|
|
565
544
|
"type": "boolean",
|
|
@@ -44,7 +44,7 @@ export class LmvzLink {
|
|
|
44
44
|
const rel = this.computeRel();
|
|
45
45
|
const iconSvg = this.type === 'external' ? EXTERNAL_SVG : ARROW_RIGHT_SVG;
|
|
46
46
|
const isBlank = this.target === '_blank';
|
|
47
|
-
return (h(Host, { key: '
|
|
47
|
+
return (h(Host, { key: 'af31a58caac2d4ccb4c2a72d356e85bda7c61b86' }, h("a", { key: 'c677c43497f214259863cf8306fa2d838bcd9bef', href: this.computeHref(), target: this.target, rel: rel }, h("slot", { key: '63f18a9089a6864c513c3ef01c68268a6b0dbd60' }), h("lmvz-icon", { key: '115472b9eda8f55c27bc551a9b1988e9086b501a', "aria-hidden": "true", icon: iconSvg }), isBlank && h("span", { key: 'cf1d70fcb80fe0e61eeceeb41b43ab0f7211ea02', class: "sr-only" }, this.externalLabel))));
|
|
48
48
|
}
|
|
49
49
|
static get is() { return "lmvz-link"; }
|
|
50
50
|
static get encapsulation() { return "shadow"; }
|
|
@@ -21,7 +21,7 @@ export class LmvzMenuItem extends ReactiveControllerHost {
|
|
|
21
21
|
this.addController(new ElementActivationController(this));
|
|
22
22
|
}
|
|
23
23
|
render() {
|
|
24
|
-
return (h(Host, { key: '
|
|
24
|
+
return (h(Host, { key: '555ab8db190d0b80b47d903966e880aed51c31d4' }, h("slot", { key: '3987fb4644d8d2c47e936c0413e058a9221a2ad7', ref: (e) => (this.validationSlot = e) })));
|
|
25
25
|
}
|
|
26
26
|
static get is() { return "lmvz-menuitem"; }
|
|
27
27
|
static get encapsulation() { return "scoped"; }
|
|
@@ -93,7 +93,7 @@ export class LmvzMessage {
|
|
|
93
93
|
}
|
|
94
94
|
render() {
|
|
95
95
|
const role = this.live === 'assertive' ? 'alert' : this.live === 'polite' ? 'status' : 'note';
|
|
96
|
-
return (h(Host, { key: '
|
|
96
|
+
return (h(Host, { key: '45bba3aa5050fcc993414c5d25b436c9a78b1b67', role: role }, this.leadingIcon && h("span", { key: '936327839c37f2aac83cca9db780dda0e47c2a42', class: "leading-icon", "aria-hidden": "true", innerHTML: TYPE_SVG[this.type] }), h("span", { key: 'e05203642419ad734285495205625567e5110c5f', class: "message" }, h("slot", { key: '7ced34a5a75a83707cee108ce0e964f815feaa61', ref: (el) => (this.messageSlot = el), onSlotchange: this.handleSlotChange })), this.actionLabel && (h("lmvz-button", { key: '705cd8ff5171d05f459ce09aaa10548de8362710', variant: "tertiary", scale: "small", onLmvzActivation: this.handleActionClick }, this.actionLabel)), this.dismissible && (h("lmvz-button", { key: '90377bfb5e8fb69ad5dff323ca88d2ba9d0c444c', variant: "tertiary", scale: "small", "aria-label": this.closeLabel, onClick: this.handleDismissClick }, h("lmvz-icon", { key: '0064004bcb5ef5d9a3bf784f110b3cf0d267017d', "aria-hidden": "true", icon: CLOSE_SM_SVG })))));
|
|
97
97
|
}
|
|
98
98
|
static get is() { return "lmvz-message"; }
|
|
99
99
|
static get encapsulation() { return "shadow"; }
|
|
@@ -223,7 +223,7 @@ export class LmvzModal extends ReactiveControllerHost {
|
|
|
223
223
|
this.hasHeader = this.hasAssignedContent(this.headerSlot);
|
|
224
224
|
};
|
|
225
225
|
render() {
|
|
226
|
-
return (h(Host, { key: '
|
|
226
|
+
return (h(Host, { key: 'eaae4e7e1ecf8fb11db7582ffa3d1461a718a8d0' }, h("dialog", { key: '11d1bdd9cd94afd82a13f5328234ad8877e9d28b', ref: (element) => (this.dialogEl = element), onCancel: this.handleDialogCancel, onClose: this.handleDialogClose, ...this.dialogAccessibilityAttributes }, h("div", { key: '1c21a9266be21246ba8cbc55ac4559f7511294ff', class: "modal-shell" }, h("header", { key: '4077ec5bd9e434d954982884ab3306fc9db6d043', class: { header: true, 'has-title': this.hasHeader } }, h("div", { key: '82476490860365ba5ed3e8f47af7a85084e01693', class: "title", id: this.dialogTitleId, hidden: !this.hasHeader }, h("slot", { key: '59dd145e07c6f310e8490ac7fa0e3d7577929a5d', name: "header", ref: (element) => (this.headerSlot = element), onSlotchange: this.handleHeaderSlotChange })), h("lmvz-button", { key: '66e53dca4eab1503f53e4d069d1e115a77d3672e', ref: (element) => (this.closeButtonEl = element), type: "button", class: "close-button", "aria-label": this.closeLabel, onLmvzActivation: this.handleCloseButtonClick, variant: "tertiary" }, h("lmvz-icon", { key: '23579ef59870459b523e4adc20df3954567b31a5', icon: closeIconSvg }))), h("div", { key: '62d2d2288ac84c945b5f0c070b3c553815572e69', class: "body" }, h("slot", { key: 'e511ff34da74c38981ee54d0e8a5019adfda2a7e' })), h("footer", { key: '1a921cf63e446f434a6686de39e8e653eb1c30c1', class: "actions", hidden: !this.buttonGroupEl?.hasActions }, h("lmvz-button-group", { key: '4280d47bb1f9bcc390253ff4286f25c4117612a2', ref: (element) => (this.buttonGroupEl = element) }, h("slot", { key: 'a4a228ee4dbb1064cc4d7d005f202d69c66b8505', name: "actions" })))))));
|
|
227
227
|
}
|
|
228
228
|
static get is() { return "lmvz-modal"; }
|
|
229
229
|
static get encapsulation() { return "shadow"; }
|
|
@@ -180,7 +180,7 @@ export class LmvzPopover {
|
|
|
180
180
|
this.closureController?.abort();
|
|
181
181
|
}
|
|
182
182
|
render() {
|
|
183
|
-
return (h(Host, { key: '
|
|
183
|
+
return (h(Host, { key: '559167785de0a69c12e436740b6b17a206f6155c', role: this.containerRole, "aria-label": this.label || undefined }, h("div", { key: 'deaeb8ac94edd8eac38748cbc01e8f335a8fe7a1', part: "container", class: `container lmvz-wrapper-card-${this.size}`, ref: (el) => (this.containerEl = el) }, h("slot", { key: '87dd843041852b3d5b8b85497c0f4e4eb6791a45', ref: (el) => (this.slotEl = el) }))));
|
|
184
184
|
}
|
|
185
185
|
static get is() { return "lmvz-popover"; }
|
|
186
186
|
static get encapsulation() { return "shadow"; }
|
|
@@ -175,7 +175,7 @@ export class LmvzRadio extends ReactiveControllerHost {
|
|
|
175
175
|
this.nativeInput?.click();
|
|
176
176
|
}
|
|
177
177
|
render() {
|
|
178
|
-
return (h(Host, { key: '
|
|
178
|
+
return (h(Host, { key: '0a3f2ee5c2aa0c27e2fc6c6482f463915a8475d1' }, h("input", { key: '707ee1a470c2a8b90dff54400490ae9366ab97ac', type: "radio", id: this.radioId, value: this.value, checked: this.checked, disabled: this.disabled, autoFocus: this.autofocus, "aria-required": this.required ? 'true' : 'false', "aria-invalid": this.error ? 'true' : undefined, "aria-describedby": this.helperId, ref: (el) => (this.nativeInput = el), onChange: this.handleChange }), h("span", { key: '772a52ff4817b2332312bc597feee0de4fb3be4e', class: "circle", "aria-hidden": "true" }, this.checked && h("span", { key: '600e398709956b6cb3e95b2119268f805771f71e', class: "dot" })), h("span", { key: '446ee6d901dcbc2143f9772736746255ef2885db', class: "content" }, h("label", { key: '4ec55b6be95c847d564ec8dfff3486068f44580c', htmlFor: this.radioId }, this.label), h("span", { key: '678dcd677d22fb2c6c8983be8cb69100fc396378', onClick: this.retargetInnerClicks.bind(this), "aria-live": "polite", class: "helper-text", id: this.helperId }, this.helperText))));
|
|
179
179
|
}
|
|
180
180
|
static get is() { return "lmvz-radio"; }
|
|
181
181
|
static get encapsulation() { return "scoped"; }
|
|
@@ -345,7 +345,7 @@ export class LmvzSelect extends ReactiveControllerHost {
|
|
|
345
345
|
const hasValue = this.hasValue;
|
|
346
346
|
const shouldShowLabel = hasValue;
|
|
347
347
|
const showChips = this.multiple && hasValue;
|
|
348
|
-
return (h(Host, { key: '
|
|
348
|
+
return (h(Host, { key: 'bcb5531eeb0c12cfebb0aacf01837004d95ab651' }, h("div", { key: '0df56d60126a321bc3e5070ecbacd29ef0653cea', class: hasValue ? 'select-wrapper has-value' : 'select-wrapper' }, h("label", { key: '9e0dcdb5134b85b38ec41c2c83a70e8f4aea9429', htmlFor: this.triggerId, class: shouldShowLabel ? 'floating-label' : 'assistive-label', onMouseDown: (event) => event.preventDefault(), onClick: this.handleLabelClick }, this.label, this.required && shouldShowLabel && h("span", { key: '1c4a3499ef403cfff96ffd391255a3c1c175a80b', "aria-hidden": "true" }, " *")), h("div", { key: 'fe9f97ec6c476525e98efb9c2a0838697d7f2193', id: this.triggerId, ref: (el) => (this.triggerEl = el), class: "select-trigger", role: "combobox", tabIndex: this.disabled ? -1 : 0, "aria-haspopup": "listbox", "aria-expanded": String(this.isOpen), "aria-controls": this.popoverId, "aria-activedescendant": this.isOpen ? this.activeId : undefined, "aria-label": this.triggerAriaLabel, "aria-disabled": this.disabled ? 'true' : undefined, "aria-required": this.required ? 'true' : 'false', "aria-invalid": this.error ? 'true' : 'false', "aria-errormessage": this.showErrorMessage ? this.errorId : undefined, "aria-describedby": this.describedBy, onClick: this.handleTriggerClick, onKeyDown: this.handleTriggerKeydown, onBlur: this.handleTriggerBlur }, h("span", { key: 'e769fcba8c5e31289f333dc53dcbc3a7bdce44e7' }, showChips ? this.renderChips() : hasValue ? this.selectedLabel : this.label, this.required && !hasValue && h("span", { key: 'b5e0cd9a9ad4506f058508f6ee9957debe9e1bd2', "aria-hidden": "true" }, " *")), h("span", { key: 'e07c1ba4a99b1b72144a17bff940e08f2d93db2f', "aria-hidden": "true" }, h("svg", { key: 'eaa136b668baacb7bb6a4ad2e46a0f694a5b54b9', width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '70744054f8ec445361551899ad637b54ace6322f', d: "M20.3334 8.66663L12.0001 17L3.66675 8.66663", stroke: "currentColor", "stroke-width": "1.75", "stroke-linecap": "round", "stroke-linejoin": "round" })))), h("lmvz-popover", { key: '330d09ff1d7160c1f7471b208acb8005e7ea60c7', id: this.popoverId, anchor: this.triggerId, open: this.isOpen, containerRole: "listbox", autoFocus: false, label: this.label, "aria-multiselectable": this.multiple ? 'true' : undefined, onLmvzClose: this.handlePopoverClose, size: "sm" }, this.renderOptionGroups()), h("div", { key: '88e327fdb04ae5ca89ba2a4254f9807a8a051051', class: "lmvz-select-native-options", hidden: true, "aria-hidden": "true", ref: (el) => (this.optionsSourceEl = el) }, h("slot", { key: '3988124d6358464ba531d498f2e486117fe4c3ad', onSlotchange: this.handleSlotChange }))), this.helperText && (h("div", { key: 'ffd36af1cf02a807262ff7b7df6fe4be0cb82ed9', id: this.helperId, role: "status" }, this.helperText)), this.showErrorMessage && (h("div", { key: '52d7f19bb6c7618d1ad7cd24c3c73487484d4542', id: this.errorId, role: "alert" }, this.errorMessage))));
|
|
349
349
|
}
|
|
350
350
|
static get is() { return "lmvz-select"; }
|
|
351
351
|
static get encapsulation() { return "scoped"; }
|
|
@@ -58,7 +58,7 @@ export class LmvzSnackbar {
|
|
|
58
58
|
this.el.dispatchEvent(new CustomEvent('lmvzAction', { bubbles: false, composed: false }));
|
|
59
59
|
};
|
|
60
60
|
render() {
|
|
61
|
-
return (h(Host, { key: '
|
|
61
|
+
return (h(Host, { key: '153859f89cb76e7119db0315208b7382ebe2ad9e', class: this.animationClass }, h("lmvz-icon", { key: 'f6a59adba28f3d0d0e50717f1d1010d7c5b391fa', icon: STATUS_SVG[this.status], size: "md", weight: "bold" }), h("span", { key: 'f0b60bd0787add320b3086841ea9c5b542c05f04', class: "message" }, this.message), this.actionLabel && (h("lmvz-button", { key: 'acb89693f29db072e98401fdb2007e149aeba044', variant: "tertiary", scale: "small", onLmvzActivation: this.handleActionClick }, this.actionLabel))));
|
|
62
62
|
}
|
|
63
63
|
static get is() { return "lmvz-snackbar"; }
|
|
64
64
|
static get encapsulation() { return "shadow"; }
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { h, Host } from "@stencil/core";
|
|
2
2
|
export class LmvzSpinner {
|
|
3
3
|
size = 'small';
|
|
4
|
-
ariaLabel;
|
|
4
|
+
ariaLabel = null;
|
|
5
5
|
render() {
|
|
6
6
|
const hasLabel = !!this.ariaLabel?.trim();
|
|
7
|
-
return (h(Host, { key: '
|
|
7
|
+
return (h(Host, { key: 'a13115b2357d22d28f1e21d95904193b2e5cfc3e', role: hasLabel ? 'status' : undefined, "aria-label": hasLabel ? this.ariaLabel : undefined, "aria-hidden": hasLabel ? undefined : 'true' }, h("svg", { key: 'b25f19f9ecb31770775b8155a4ce9c5541b558c1', part: "indicator", viewBox: "0 0 16 16", "aria-hidden": "true" }, h("circle", { key: '67881efb5bbf7dbf521113ca68ace9b3d33e1b2e', pathLength: "100", cx: "8", cy: "8", r: "6" }))));
|
|
8
8
|
}
|
|
9
9
|
static get is() { return "lmvz-spinner"; }
|
|
10
10
|
static get encapsulation() { return "shadow"; }
|
|
@@ -44,12 +44,12 @@ export class LmvzSpinner {
|
|
|
44
44
|
"type": "string",
|
|
45
45
|
"mutable": false,
|
|
46
46
|
"complexType": {
|
|
47
|
-
"original": "string",
|
|
48
|
-
"resolved": "
|
|
47
|
+
"original": "string | null",
|
|
48
|
+
"resolved": "null | string",
|
|
49
49
|
"references": {}
|
|
50
50
|
},
|
|
51
51
|
"required": false,
|
|
52
|
-
"optional":
|
|
52
|
+
"optional": false,
|
|
53
53
|
"docs": {
|
|
54
54
|
"tags": [],
|
|
55
55
|
"text": "Accessible name for assistive technology.\nLeave unset for decorative spinners so the element stays hidden from the accessibility tree."
|
|
@@ -57,7 +57,8 @@ export class LmvzSpinner {
|
|
|
57
57
|
"getter": false,
|
|
58
58
|
"setter": false,
|
|
59
59
|
"reflect": true,
|
|
60
|
-
"attribute": "aria-label"
|
|
60
|
+
"attribute": "aria-label",
|
|
61
|
+
"defaultValue": "null"
|
|
61
62
|
}
|
|
62
63
|
};
|
|
63
64
|
}
|
|
@@ -14,7 +14,7 @@ export class LmvzTab {
|
|
|
14
14
|
this.el.dispatchEvent(new CustomEvent('lmvzTabReady', { bubbles: true, composed: false }));
|
|
15
15
|
}
|
|
16
16
|
render() {
|
|
17
|
-
return (h(Host, { key: '
|
|
17
|
+
return (h(Host, { key: 'ff3fc4218e3da14cb2caaa3bbe8cb73be8ac0c3d' }, h("button", { key: '999ad84e8d27e787ba0f6ba1146b461b9e7b6ca9', part: "button", role: "tab", disabled: this.disabled, "aria-selected": String(this.selected), "aria-disabled": this.disabled ? 'true' : undefined, tabIndex: 0 }, h("slot", { key: '876a7431706f385f1ed7f542182f92dd386bc6f5', name: "media", ref: (el) => (this.mediaSlotEl = el), onSlotchange: this.handleMediaSlotChange }), h("span", { key: 'a0b0a0f22344678a2a6ee82dd997f24036f22ba5', class: "label" }, h("slot", { key: 'df4d11555f351a759ef69ba907d8d1b00d95a826' })), h("span", { key: '70830219e6dfa656a5ded8332f9171ad389c4ef8', "aria-hidden": "true", part: "indicator", class: "indicator" }))));
|
|
18
18
|
}
|
|
19
19
|
static get is() { return "lmvz-tab"; }
|
|
20
20
|
static get encapsulation() { return "shadow"; }
|
|
@@ -237,7 +237,7 @@ export class LmvzTabs extends ReactiveControllerHost {
|
|
|
237
237
|
this.selectTab(value);
|
|
238
238
|
};
|
|
239
239
|
render() {
|
|
240
|
-
return (h(Host, { key: '
|
|
240
|
+
return (h(Host, { key: 'd6308c13b7e185fa4d1ff8a33c03f2e0e54f55b0', onClick: this.handleTabClick, onKeydown: this.handleKeydown }, h("div", { key: '319741b6ce2276d9092b22b67dabc2f1f28366c4', role: "tablist", "aria-orientation": "horizontal", class: "tablist", ref: (el) => (this.tablistEl = el) }, h("slot", { key: 'bf76b7b1bdce93f47ddbf45309408b1e33a086f6', ref: (el) => (this.tabSlotEl = el) })), h("div", { key: '6793f685d90ea8cb4b9862db6a93d7067fcb1d53', part: "panels-container", class: "panels-container" }, h("slot", { key: '2af78356ab2727bcd044e827238b0f5a8a30f1b0', name: "panels", ref: (el) => (this.panelSlotEl = el) }))));
|
|
241
241
|
}
|
|
242
242
|
static get is() { return "lmvz-tabs"; }
|
|
243
243
|
static get encapsulation() { return "shadow"; }
|
|
@@ -68,7 +68,7 @@ export class LmvzToggle extends ReactiveControllerHost {
|
|
|
68
68
|
this.lmvzChange.emit(newChecked);
|
|
69
69
|
};
|
|
70
70
|
render() {
|
|
71
|
-
return (h(Host, { key: '
|
|
71
|
+
return (h(Host, { key: '897eea43e268eca68b5955ba823caa49508789be' }, h("span", { key: '731c08e74242b06458fdfeba69d4e4aa4ae76cd1', class: "track" }, h("input", { key: '3e8ee9f23bc78f2c8110c5057854d199e13755cf', type: "checkbox", role: "switch", id: this.toggleId, checked: this.checked, disabled: this.disabled, required: this.required, name: this.name, value: this.value, form: this.form, ref: (el) => (this.nativeInputElement = el), onChange: this.handleChange }), h("span", { key: '8d3ec0a9bc6af91b2536865f54a1616ef8753db6', class: "thumb", "aria-hidden": "true" })), h("label", { key: '121837baf11f9d086e5750b6249264888a3ced7a', htmlFor: this.toggleId }, this.label)));
|
|
72
72
|
}
|
|
73
73
|
static get is() { return "lmvz-toggle"; }
|
|
74
74
|
static get encapsulation() { return "scoped"; }
|
package/collection/index.js
CHANGED
package/components/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export{g as getAssetPath,r as render,s as setAssetPath,a as setNonce,b as setPlatformOptions}from"./p-
|
|
1
|
+
export{g as getAssetPath,r as render,s as setAssetPath,a as setNonce,b as setPlatformOptions}from"./p-DCYK_qaZ.js";export{A as ARIA_VALIDATION_RUNTIME_CHANGED_EVENT,d as disableAriaValidation,e as enableAriaValidation,i as isAriaValidationEnabled,q as queueValidation,u as useVerboseLogging}from"./p-BDonpCG8.js";export{h as cardSizes,g as chipSizes,f as chipTypes,d as iconSizes,e as iconWeights,b as inputSizes,i as inputTypes,l as linkTypes,m as messageTypes,p as popoverPlacements,o as popoverSizes,s as scaleValues,c as selectSizes,a as sizes,n as snackbarDismissReasons,k as snackbarPriorities,j as snackbarStatuses,t as textSizes,v as variants}from"./p-Buw_s-9k.js";export{S as SnackbarController}from"./p-BPa0FHVO.js";export{LmvzAction,defineCustomElement as defineCustomElementLmvzAction}from"./lmvz-action.js";export{LmvzActionList,defineCustomElement as defineCustomElementLmvzActionList}from"./lmvz-action-list.js";export{LmvzButton,defineCustomElement as defineCustomElementLmvzButton}from"./lmvz-button.js";export{LmvzButtonGroup,defineCustomElement as defineCustomElementLmvzButtonGroup}from"./lmvz-button-group.js";export{LmvzCard,defineCustomElement as defineCustomElementLmvzCard}from"./lmvz-card.js";export{LmvzCheckbox,defineCustomElement as defineCustomElementLmvzCheckbox}from"./lmvz-checkbox.js";export{LmvzChip,defineCustomElement as defineCustomElementLmvzChip}from"./lmvz-chip.js";export{LmvzDatepicker,defineCustomElement as defineCustomElementLmvzDatepicker}from"./lmvz-datepicker.js";export{LmvzHeader,defineCustomElement as defineCustomElementLmvzHeader}from"./lmvz-header.js";export{LmvzIcon,defineCustomElement as defineCustomElementLmvzIcon}from"./lmvz-icon.js";export{LmvzInput,defineCustomElement as defineCustomElementLmvzInput}from"./lmvz-input.js";export{LmvzLink,defineCustomElement as defineCustomElementLmvzLink}from"./lmvz-link.js";export{LmvzMenuitem,defineCustomElement as defineCustomElementLmvzMenuitem}from"./lmvz-menuitem.js";export{LmvzMessage,defineCustomElement as defineCustomElementLmvzMessage}from"./lmvz-message.js";export{LmvzModal,defineCustomElement as defineCustomElementLmvzModal}from"./lmvz-modal.js";export{LmvzPopover,defineCustomElement as defineCustomElementLmvzPopover}from"./lmvz-popover.js";export{LmvzRadio,defineCustomElement as defineCustomElementLmvzRadio}from"./lmvz-radio.js";export{LmvzSelect,defineCustomElement as defineCustomElementLmvzSelect}from"./lmvz-select.js";export{LmvzSnackbar,defineCustomElement as defineCustomElementLmvzSnackbar}from"./lmvz-snackbar.js";export{LmvzSpinner,defineCustomElement as defineCustomElementLmvzSpinner}from"./lmvz-spinner.js";export{LmvzTab,defineCustomElement as defineCustomElementLmvzTab}from"./lmvz-tab.js";export{LmvzTabs,defineCustomElement as defineCustomElementLmvzTabs}from"./lmvz-tabs.js";export{LmvzToggle,defineCustomElement as defineCustomElementLmvzToggle}from"./lmvz-toggle.js";export{g as getRegisteredIconProvider,r as registerIconProvider,t as typedIconFromSet}from"./p-CyDgnpOB.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{p as r,h as o,d as t,t as e}from"./p-DbBJxuBm.js";import{A as n}from"./p-sACbyedu.js";import{D as a}from"./p-DyQ1GbaN.js";import{c as v}from"./p-DJLdOjL4.js";import{R as m}from"./p-DXFoXTse.js";const l=r(class extends m{get el(){return this}slotEl;get validationEl(){return this.el}get validationSlot(){return this.slotEl}focusController=new a(this,{orientation:"vertical",manageTabIndex:!0,enableHomeAndEnd:!0});label;constructor(r){super(!1),!1!==r&&this.__registerHost(),this.addController(this.focusController),this.addController(new n(this,{validationTiming:"slot"}))}componentDidLoad(){this.handleSlotChange(),super.componentDidLoad()}async initFocus(){this.focusController.initFocus()}handleSlotChange=()=>{const r=this.slotEl;if(!r)return;const o=r.assignedElements(),t=[];for(const r of o)i(r,t);for(const r of t)v(r)&&(r.variant||(r.variant="tertiary"));this.focusController.updateElements(t)};render(){return o(t,{key:"9dee495856e733cb17f30d0d8588362a8dcb28ce",role:"menu","aria-label":this.label||void 0},o("slot",{key:"c6454dbbe63eed5be01f3247934245d1cc1ad6e2",onSlotchange:this.handleSlotChange,ref:r=>this.slotEl=r}))}static get style(){return"@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; } } .sc-lmvz-action-list-h { display: flex; flex-direction: column; gap: 0; min-width: 15vw; button { & { & { --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)); } } --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)); &: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)); } &: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)); } } lmvz-button, button { --lmvz-button-radius-override: var(--lmvz-semantic-border-radius-md, 6px); --lmvz-button-padding-inline-override: var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem)); --lmvz-button-padding-block-override: var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem)); --lmvz-button-font-override: var(--lmvz-typography-body-md, 400 clamp(0.88rem, 0.84rem + 0.13vw, 1rem) / 1.5 Router); --lmvz-button-content-justification: normal; width: 100%; } }"}},[774,"lmvz-action-list",{label:[1],initFocus:[64]}]);function i(r,o){const t=r.tagName.toLowerCase();return"lmvz-button"===t?(r.buttonRole="menuitem",void o.push(r)):"button"===t?(r.setAttribute("role","menuitem"),void o.push(r)):void("hr"!==t&&("group"!==r.getAttribute("role")?console.warn("Unexpected element encountered in ActionList:",t):r.querySelectorAll("lmvz-button, button").forEach((r=>i(r,o)))))}const d=l,c=function(){"undefined"!=typeof customElements&&["lmvz-action-list"].forEach((r=>{"lmvz-action-list"===r&&(customElements.get(e(r))||customElements.define(e(r),l))}))};export{d as LmvzActionList,c as defineCustomElement}
|
|
1
|
+
import{p as r,h as o,d as t,t as e}from"./p-DCYK_qaZ.js";import{A as n}from"./p-DCFz070C.js";import{D as a}from"./p-D0S1O-Op.js";import{c as v}from"./p-DJLdOjL4.js";import{R as m}from"./p-CeGgx3Rl.js";const l=r(class extends m{get el(){return this}slotEl;get validationEl(){return this.el}get validationSlot(){return this.slotEl}focusController=new a(this,{orientation:"vertical",manageTabIndex:!0,enableHomeAndEnd:!0});label;constructor(r){super(!1),!1!==r&&this.__registerHost(),this.addController(this.focusController),this.addController(new n(this,{validationTiming:"slot"}))}componentDidLoad(){this.handleSlotChange(),super.componentDidLoad()}async initFocus(){this.focusController.initFocus()}handleSlotChange=()=>{const r=this.slotEl;if(!r)return;const o=r.assignedElements(),t=[];for(const r of o)i(r,t);for(const r of t)v(r)&&(r.variant||(r.variant="tertiary"));this.focusController.updateElements(t)};render(){return o(t,{key:"9dee495856e733cb17f30d0d8588362a8dcb28ce",role:"menu","aria-label":this.label||void 0},o("slot",{key:"c6454dbbe63eed5be01f3247934245d1cc1ad6e2",onSlotchange:this.handleSlotChange,ref:r=>this.slotEl=r}))}static get style(){return"@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; } } .sc-lmvz-action-list-h { display: flex; flex-direction: column; gap: 0; min-width: 15vw; button { & { & { --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)); } } --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)); &: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)); } &: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)); } } lmvz-button, button { --lmvz-button-radius-override: var(--lmvz-semantic-border-radius-md, 6px); --lmvz-button-padding-inline-override: var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem)); --lmvz-button-padding-block-override: var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem)); --lmvz-button-font-override: var(--lmvz-typography-body-md, 400 clamp(0.88rem, 0.84rem + 0.13vw, 1rem) / 1.5 Router); --lmvz-button-content-justification: normal; width: 100%; } }"}},[774,"lmvz-action-list",{label:[1],initFocus:[64]}]);function i(r,o){const t=r.tagName.toLowerCase();return"lmvz-button"===t?(r.buttonRole="menuitem",void o.push(r)):"button"===t?(r.setAttribute("role","menuitem"),void o.push(r)):void("hr"!==t&&("group"!==r.getAttribute("role")?console.warn("Unexpected element encountered in ActionList:",t):r.querySelectorAll("lmvz-button, button").forEach((r=>i(r,o)))))}const d=l,c=function(){"undefined"!=typeof customElements&&["lmvz-action-list"].forEach((r=>{"lmvz-action-list"===r&&(customElements.get(e(r))||customElements.define(e(r),l))}))};export{d as LmvzActionList,c as defineCustomElement}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{p as t,H as s,c,h as e,d as i,t as o}from"./p-
|
|
1
|
+
import{p as t,H as s,c,h as e,d as i,t as o}from"./p-DCYK_qaZ.js";const n=t(class extends s{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.actionClick=c(this,"actionClick",7)}actionClick;_onClick(t){this.actionClick.emit(t)}render(){return e(i,{key:"4d83f95393704400034fef7313ac52bcc100be95",onClick:this._onClick.bind(this)},e("slot",{key:"ffbdeca0877eb9a76bc4ac1b8b77b37b60fdabd5"}))}static get style(){return":host{display:block}"}},[257,"lmvz-action"]),a=n,l=function(){"undefined"!=typeof customElements&&["lmvz-action"].forEach((t=>{"lmvz-action"===t&&(customElements.get(o(t))||customElements.define(o(t),n))}))};export{a as LmvzAction,l as defineCustomElement}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{L as o,d as
|
|
1
|
+
import{L as o,d as p}from"./p-Wp9d5O3R.js";const s=o,r=p;export{s as LmvzButtonGroup,r as defineCustomElement}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{L as s,d as o}from"./p-
|
|
1
|
+
import{L as s,d as o}from"./p-CPsPpCPH.js";const p=s,r=o;export{p as LmvzButton,r as defineCustomElement}
|
package/components/lmvz-card.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{g as r,p as e,H as t,c as o,h as a,d as n,t as m}from"./p-DbBJxuBm.js";const l=e(class extends t{constructor(r){super(),!1!==r&&this.__registerHost(),this.primaryAction=o(this,"primaryAction",7)}cardTitle;imageUrl;description;primaryActionLabel="";primaryAction;get fallbackImage(){return((e,t)=>{const o=function(...r){return r.filter(Boolean).join("/").replace("//","/").replace("/./","/")}("../../assets",t,e);try{return r(o)}catch{return console.warn(`Failed to create URL for asset "${e}" in path "${t}".\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(r){console.log(r)}render(){return a(n,{key:"1dd819fd7c752af8d15001c08f7f60c6ea7278b9",role:"article"},a("div",{key:"e0cc822e627b6bbe665e4faa705cc46a09bac7c6",class:"top"},a("div",{key:"db79cb5a67ebdd6097f985e4b4bd27665b6329ef",class:"image-wrapper",style:{backgroundImage:`url(${this.imageUrl??this.fallbackImage})`}},a("div",{key:"90facc8595ddbbf31e3768faa8254a82ab8d3e65",class:"chip-slot"},a("slot",{key:"cb2e6a1053aae2b2ca90c52c175e3c4174c89d23",name:"chip"})))),a("div",{key:"cb11069a329385178677e92d08044e0fe8e5b982",class:"bottom"},a("header",{key:"1e6076352124ca03de2fb13c17a565b4f492567e"},a("h2",{key:"73f11099fb751bd4f967dbe49b79763b6a8268f3",class:"title"},this.cardTitle)),a("p",{key:"36cf87b4c2004bff1e65feedd13e137d67115de3",class:"description"},this.description),a("div",{key:"6c1d82f4968ce8252307858e6ad0681274f06397",class:"actions"},a("button",{key:"0366e0caaf9235a3eaf7bfcab116e6a828fb248d",class:"primary",onClick:this._onPrimaryClick.bind(this),"data-testid":"primary"},this.primaryActionLabel),a("button",{key:"4f435e79d75a621d6fe065471a915b55308ad15d",class:"tertiary","aria-label":"More actions",onClick:this._onOverflowClick},a("span",{key:"7dec97e0b0ca58c40fc5308cc7863acafa8c5147",class:"icon-placeholder"},"...")))))}static get assetsDirs(){return["../../assets"]}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; } 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; }"}},[774,"lmvz-card",{cardTitle:[1,"card-title"],imageUrl:[1,"image-url"],description:[1],primaryActionLabel:[1,"primary-action-label"]}]),i=l,v=function(){"undefined"!=typeof customElements&&["lmvz-card"].forEach((r=>{"lmvz-card"===r&&(customElements.get(m(r))||customElements.define(m(r),l))}))};export{i as LmvzCard,v as defineCustomElement}
|
|
1
|
+
import{g as e,p as t,H as a,c as r,h as o,d as l,t as s}from"./p-DCYK_qaZ.js";import{h as i}from"./p-Buw_s-9k.js";import{i as m}from"./p-BDonpCG8.js";import{d as n}from"./p-CPsPpCPH.js";const c=new Set(["HEADER","H1","H2","H3","H4","H5","H6"]),d=t(class extends a{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.lmvzCardAction=r(this,"lmvzCardAction",7)}get el(){return this}titleSlotElement;warnedCases=new Set;size="large";cardTitle;description;imageUrl;imageAlt="";actionLabel;lmvzCardAction;normalizeSize(e){const t=i.includes(e)?e:"large";t!==this.size&&(this.size=t)}componentWillLoad(){this.normalizeSize(this.size)}componentDidLoad(){const e=this.el.shadowRoot?.querySelector('slot[name="card-title"]');e?.addEventListener("slotchange",(()=>this.checkTitleContent())),this.checkTitleContent()}get fallbackImage(){return((t,a)=>{const r=function(...e){return e.filter(Boolean).join("/").replace("//","/").replace("/./","/")}("../../assets",a,t);try{return e(r)}catch{return console.warn(`Failed to create URL for asset "${t}" in path "${a}".\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(r,import.meta?.url??window?.location?.origin??"")}})("card-placeholder.svg")+""}handleActionClick=()=>{this.lmvzCardAction.emit()};get slottedTitleElement(){return this.titleSlotElement?.assignedElements()?.at(0)}checkTitleContent(){if(!m())return;const e=this.slottedTitleElement;if(e){const t=e.tagName;c.has(t)||this.warnOnce("non-heading:"+t,`[lmvz-card] Element <${t.toLowerCase()}> slotted into "card-title" is not a heading. Slot a heading element (h2-h5) instead.`)}else this.cardTitle||this.warnOnce("missing-title",'[lmvz-card] Neither a "card-title" slotted heading nor a non-empty "cardTitle" prop was supplied.')}warnOnce(e,t){this.warnedCases.has(e)||(this.warnedCases.add(e),console.warn(t))}render(){return o(l,{key:"21ac0a567bb88d05d247cc3150bf2e7ce26972c5",role:"article"},o("img",{key:"6cea11ee015059d5537ab64c7cbb1655ac984cb1",class:"image",src:this.imageUrl??this.fallbackImage,alt:this.imageAlt,loading:"lazy",decoding:"async"}),o("div",{key:"cd29132d8268fb5a025cde5c33a858982c8eaaed",class:"content"},o("div",{key:"0d353a46cae60d81417e5280b39020b2234ad304",class:"title-block"},o("slot",{key:"4f2734a257ef877d258a717e23855f521c5132a6",name:"card-title",ref:e=>this.titleSlotElement=e},this.cardTitle&&o("header",{key:"7d526caba45dde6b13bee023e60943711347258a",role:"heading",class:"card-default-title"},this.cardTitle)),this.description&&o("p",{key:"18c3eac26562a592baa29d75674737d11f57beac",class:"description"},this.description)),o("slot",{key:"d0d9c40ca8501b0fdfa9d589eeb05692892316a2",name:"chip"}),this.actionLabel&&o("div",{key:"4bd5d9233c0ba1dcda6bebdeff89adbbfe37e4b1",class:"actions"},o("lmvz-button",{key:"6cefc7ad2859d457ad11b3f4edb1300ba664ef63",class:"action",variant:"secondary",scale:"small"===this.size?"small":"default",onLmvzActivation:this.handleActionClick},this.actionLabel))))}static get assetsDirs(){return["../../assets"]}static get watchers(){return{size:[{normalizeSize: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; } 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 { --lmvz-card-local-min-width: 320px; --lmvz-card-local-max-width: 360px; --lmvz-card-local-sm-width: 232px; display: flex; flex-direction: column; align-items: flex-start; min-width: var(--lmvz-card-local-min-width); max-width: var(--lmvz-card-local-max-width); border-radius: var(--lmvz-component-wrapper-md-border-radius, 18px); border: var(--lmvz-semantic-border-width-default, 1px) solid var(--lmvz-semantic-color-border-subtle, #f0f0f0); background: var(--lmvz-semantic-color-surface-primary, #ffffff); box-shadow: 0 var(--lmvz-semantic-shadow-l1-1-position-y, 2px) var(--lmvz-semantic-shadow-l1-1-blur, 4px) 0 var(--lmvz-semantic-color-shadow-l1-default, rgba(120, 120, 128, 0.08)); margin-bottom: var(--lmvz-component-card-lg-margin-bottom, clamp(1rem, 0.88rem + 0.52vw, 1.5rem)); } :host([size='small']) { width: var(--lmvz-card-local-sm-width); min-width: 0; max-width: none; border-radius: var(--lmvz-component-wrapper-sm-border-radius, 14px); margin-bottom: var(--lmvz-component-card-sm-margin-bottom, clamp(0.75rem, 0.69rem + 0.26vw, 1rem)); } * { 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); } .image { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; align-self: stretch; border-top-left-radius: var(--lmvz-component-wrapper-md-border-radius, 18px); border-top-right-radius: var(--lmvz-component-wrapper-md-border-radius, 18px); } :host([size='small']) .image { border-top-left-radius: var(--lmvz-component-wrapper-sm-border-radius, 14px); border-top-right-radius: var(--lmvz-component-wrapper-sm-border-radius, 14px); } .content { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: var(--lmvz-component-spacing-xs, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem)); padding: var(--lmvz-component-wrapper-md-padding-y, clamp(1rem, 0.88rem + 0.52vw, 1.5rem)) var(--lmvz-component-wrapper-md-padding-x, clamp(1rem, 0.88rem + 0.52vw, 1.5rem)); } :host([size='small']) .content { gap: var(--lmvz-component-spacing-2xs, clamp(0.13rem, 0.09rem + 0.13vw, 0.25rem)); padding: var(--lmvz-component-wrapper-sm-padding-y, clamp(0.75rem, 0.69rem + 0.26vw, 1rem)) var(--lmvz-component-wrapper-sm-padding-x, clamp(0.75rem, 0.69rem + 0.26vw, 1rem)); } .title-block { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: var(--lmvz-component-spacing-2xs, clamp(0.13rem, 0.09rem + 0.13vw, 0.25rem)); } .card-default-title { margin: 0; overflow-wrap: break-word; font: var(--lmvz-typography-heading-lg, 500 clamp(1.13rem, 1.03rem + 0.39vw, 1.5rem) / 1.5 Router); } :host([size='small']) .card-default-title { font: var(--lmvz-typography-body-lg-strong, 500 clamp(1rem, 0.97rem + 0.13vw, 1.13rem) / 1.5 Router); } ::slotted([slot='card-title']) { margin: 0; overflow-wrap: break-word; } :host([size='small']) ::slotted([slot='card-title']) { font: var(--lmvz-typography-body-lg-strong, 500 clamp(1rem, 0.97rem + 0.13vw, 1.13rem) / 1.5 Router); } .description { margin: 0; align-self: stretch; white-space: pre-line; font: var(--lmvz-typography-body-lg, 400 clamp(1rem, 0.97rem + 0.13vw, 1.13rem) / 1.5 Router); } :host([size='small']) .description { font: var(--lmvz-typography-body-sm, 400 clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem) / 1.5 Router); } slot[name='chip'] { display: contents; } .actions { display: flex; align-items: center; align-self: stretch; padding-top: var(--lmvz-component-spacing-md, clamp(0.75rem, 0.69rem + 0.26vw, 1rem)); } lmvz-button.action { flex: 1 0 0; } "}},[769,"lmvz-card",{size:[1537],cardTitle:[1,"card-title"],description:[1],imageUrl:[1,"image-url"],imageAlt:[1,"image-alt"],actionLabel:[1,"action-label"]},void 0,{size:[{normalizeSize:0}]}]),p=d,v=function(){"undefined"!=typeof customElements&&["lmvz-card","lmvz-button"].forEach((e=>{switch(e){case"lmvz-card":customElements.get(s(e))||customElements.define(s(e),d);break;case"lmvz-button":customElements.get(s(e))||n()}}))};export{p as LmvzCard,v as defineCustomElement}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{p as e,c as o,h as r,d as c,t}from"./p-DbBJxuBm.js";import{c as a}from"./p-DAikapVO.js";import{t as s}from"./p-DjvtQE7c.js";import{A as l}from"./p-sACbyedu.js";import{R as i}from"./p-DXFoXTse.js";const h=s(a);let n=0;const d=e(class extends i{get el(){return this}get validationEl(){return this.el}internals;nativeInput;checkboxId="lmvz-checkbox-"+n++;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;nativeError=!1;errorFromProp=!1;get error(){return this.errorFromProp||this.nativeError}set error(e){this.errorFromProp=e}errorMessage;helperText;form;autofocus=!1;checkedState=!1;handleCheckedChange(e){this.checkedState=e,this.internals.setFormValue?.(e?this.value??"on":null),this.updateValidity()}handleRequiredChange(){this.updateValidity()}lmvzChange;async focusInput(){this.nativeInput?.focus()}async checkValidity(){return this.internals?.checkValidity()??!0}async reportValidity(){return this.internals?.reportValidity()??!0}async getValidationMessage(){return this.internals?.validationMessage??""}constructor(e){super(!1),!1!==e&&this.__registerHost(),this.lmvzChange=o(this,"lmvzChange",7),this.internals=this.attachInternals(),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),this.updateValidity(),super.componentWillLoad()}componentDidLoad(){this.updateValidity(),super.componentDidLoad()}componentWillRender(){this.errorFromProp&&!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,this.updateValidity()}formStateRestoreCallback(e){this.checked=e===(this.value??"on")}handleChange=e=>{this.checked=e.target.checked,this.lmvzChange.emit(this.checked)};retargetInnerClicks(){this.nativeInput?.click()}updateValidity(){!this.required||this.checked?(this.internals.setValidity?.({}),this.nativeError=!1):this.internals.setValidity?.({valueMissing:!0},"Please check this box.",this.nativeInput)}handleInvalid(){this.nativeError=!0}render(){return r(c,{key:"089b23f8034fa089f358cc37923182c34f528cd2"},r("div",{key:"0af011ebf062332c330b49fa3076828204433ac4",class:"pill"},r("input",{key:"a483a8c5bbe1d6da3cfab63ce32ad2e6392911ff",type:"checkbox",id:this.checkboxId,checked:this.checkedState,disabled:this.disabled,"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:"f21d34ab625c7eef23bd2761b399e8770cd62275",class:"box","aria-hidden":"true"},this.checkedState&&r("span",{key:"de2680ea17f34ab0124c529d88d4191c97d0a4c5",class:"indicator",innerHTML:h})),r("span",{key:"1b2d24e43603033a5a77340164e002de326db11a",class:"content"},r("label",{key:"b18f17abb4459b3783dc41d0031f4b26795fdcf5",htmlFor:this.checkboxId},this.label),this.helperText&&r("span",{key:"f32591c55fcc88d130815780a9999fcb235afd88",onClick:this.retargetInnerClicks.bind(this),class:"helper-text",id:this.helperId,role:"status"},this.helperText))),this.errorMessage&&r("span",{key:"076489f5baadab07d95fc787e9ac71bae0a6ab68",onClick:this.retargetInnerClicks.bind(this),class:"error-text",id:this.errorId,role:"alert"},this.errorMessage))}static get formAssociated(){return!0}static get watchers(){return{checked:[{handleCheckedChange:0}],required:[{handleRequiredChange: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; } } .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, #a1a1a1); --checkbox-border-color-checked: var(--lmvz-semantic-color-border-active, #0f8acc); --checkbox-border-color-error: var(--lmvz-semantic-color-status-on-danger, #a31419); --checkbox-wrapper-bg-hover: var(--lmvz-semantic-color-int-tertiary-hover, #f0f0f0); --checkbox-wrapper-bg-checked: var(--lmvz-semantic-color-status-active, #f6fbfe); --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, #545454); --checkbox-error-color: var(--lmvz-semantic-color-status-on-danger, #a31419); --checkbox-focus-color: var(--lmvz-semantic-color-status-on-active, #0e7ab4); --checkbox-easing: var(--lmvz-global-easing-default, ease); --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-8-2, clamp(0.13rem, 0.03rem + 0.39vw, 0.5rem)); padding-inline: var(--lmvz-dimension-10-4, clamp(0.25rem, 0.16rem + 0.39vw, 0.63rem)); border-radius: var(--lmvz-semantic-border-radius-round, 999px); 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; appearance: none; } .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, 400 clamp(0.88rem, 0.84rem + 0.13vw, 1rem) / 1.5 Router); 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, 400 clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem) / 1.5 Router); color: var(--checkbox-helper-color); margin-block-start: 2px; } .error-text.sc-lmvz-checkbox { font: var(--lmvz-typography-body-sm, 400 clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem) / 1.5 Router); color: var(--checkbox-error-color); display: block; margin-block-start: 4px; padding-inline: 10px; } @media (hover: hover) { .pill.sc-lmvz-checkbox:hover { background-color: var(--checkbox-wrapper-bg-hover); } .pill.sc-lmvz-checkbox:hover .box.sc-lmvz-checkbox { border-color: var(--checkbox-border-color-hover); } } [checked].sc-lmvz-checkbox-h .pill.sc-lmvz-checkbox { background-color: var(--checkbox-wrapper-bg-checked); } [checked].sc-lmvz-checkbox-h .box.sc-lmvz-checkbox { border-color: var(--checkbox-border-color-checked); } [checked].sc-lmvz-checkbox-h label.sc-lmvz-checkbox { color: var(--checkbox-label-color-checked); } [error].sc-lmvz-checkbox-h .box.sc-lmvz-checkbox { border-color: var(--checkbox-border-color-error); } [error].sc-lmvz-checkbox-h .helper-text.sc-lmvz-checkbox { color: var(--checkbox-error-color); } [disabled].sc-lmvz-checkbox-h { opacity: var(--lmvz-component-input-disabled-opacity, 40%); pointer-events: none; input, label, .box, .content { cursor: not-allowed; } } .sc-lmvz-checkbox-h:has(:focus-visible) .pill.sc-lmvz-checkbox { outline: var(--lmvz-ds-outline, 1px solid #0e7ab4); outline-offset: var(--lmvz-ds-outline-offset, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem)); } @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:has(:focus-visible) .pill.sc-lmvz-checkbox { outline-color: Highlight; box-shadow: none; } }"}},[578,"lmvz-checkbox",{label:[1],checked:[1540],value:[1],name:[513],disabled:[516],required:[516],error:[6660],errorMessage:[1,"error-message"],helperText:[1,"helper-text"],form:[1],autofocus:[4],nativeError:[32],checkedState:[32],focusInput:[64],checkValidity:[64],reportValidity:[64],getValidationMessage:[64]},[[0,"invalid","handleInvalid"]],{checked:[{handleCheckedChange:0}],required:[{handleRequiredChange:0}]}]),b=d,m=function(){"undefined"!=typeof customElements&&["lmvz-checkbox"].forEach((e=>{"lmvz-checkbox"===e&&(customElements.get(t(e))||customElements.define(t(e),d))}))};export{b as LmvzCheckbox,m as defineCustomElement}
|
|
1
|
+
import{p as e,c as o,h as r,d as c,t}from"./p-DCYK_qaZ.js";import{c as a}from"./p-DAikapVO.js";import{t as s}from"./p-DjvtQE7c.js";import{A as l}from"./p-DCFz070C.js";import{R as i}from"./p-CeGgx3Rl.js";const h=s(a);let n=0;const d=e(class extends i{get el(){return this}get validationEl(){return this.el}internals;nativeInput;checkboxId="lmvz-checkbox-"+n++;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;nativeError=!1;errorFromProp=!1;get error(){return this.errorFromProp||this.nativeError}set error(e){this.errorFromProp=e}errorMessage;helperText;form;autofocus=!1;checkedState=!1;handleCheckedChange(e){this.checkedState=e,this.internals.setFormValue?.(e?this.value??"on":null),this.updateValidity()}handleRequiredChange(){this.updateValidity()}lmvzChange;async focusInput(){this.nativeInput?.focus()}async checkValidity(){return this.internals?.checkValidity()??!0}async reportValidity(){return this.internals?.reportValidity()??!0}async getValidationMessage(){return this.internals?.validationMessage??""}constructor(e){super(!1),!1!==e&&this.__registerHost(),this.lmvzChange=o(this,"lmvzChange",7),this.internals=this.attachInternals(),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),this.updateValidity(),super.componentWillLoad()}componentDidLoad(){this.updateValidity(),super.componentDidLoad()}componentWillRender(){this.errorFromProp&&!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,this.updateValidity()}formStateRestoreCallback(e){this.checked=e===(this.value??"on")}handleChange=e=>{this.checked=e.target.checked,this.lmvzChange.emit(this.checked)};retargetInnerClicks(){this.nativeInput?.click()}updateValidity(){!this.required||this.checked?(this.internals.setValidity?.({}),this.nativeError=!1):this.internals.setValidity?.({valueMissing:!0},"Please check this box.",this.nativeInput)}handleInvalid(){this.nativeError=!0}render(){return r(c,{key:"df48e8af0b992d4f2c564aae67dbd42b6454f2c1"},r("div",{key:"fe1256e373ee98cc26ca9031654d4d01f10b96e7",class:"pill"},r("input",{key:"580af189cb0069dd057464efd8c876c1a2dd3826",type:"checkbox",id:this.checkboxId,checked:this.checkedState,disabled:this.disabled,"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:"4a6b3522aa1a43f3c0a7ff203fb5791876555954",class:"box","aria-hidden":"true"},this.checkedState&&r("span",{key:"3a857015118d911832cdaa1287cee4c63f84afb2",class:"indicator",innerHTML:h})),r("span",{key:"aa543c4c37cf220084b3cce423e1d0e48b5c344f",class:"content"},r("label",{key:"26c8551de719bdd99cce39b9129b59643f2aa44e",htmlFor:this.checkboxId},this.label),this.helperText&&r("span",{key:"004ead4527953b10b4ab6d89366159d7727320b2",onClick:this.retargetInnerClicks.bind(this),class:"helper-text",id:this.helperId,role:"status"},this.helperText))),this.errorMessage&&r("span",{key:"0fa0dcfdf2fe61d510bfe9f0c4f8d16a341f97d7",onClick:this.retargetInnerClicks.bind(this),class:"error-text",id:this.errorId,role:"alert"},this.errorMessage))}static get formAssociated(){return!0}static get watchers(){return{checked:[{handleCheckedChange:0}],required:[{handleRequiredChange: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; } } .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, #a1a1a1); --checkbox-border-color-checked: var(--lmvz-semantic-color-border-active, #0f8acc); --checkbox-border-color-error: var(--lmvz-semantic-color-status-on-danger, #a31419); --checkbox-wrapper-bg-hover: var(--lmvz-semantic-color-int-tertiary-hover, #f0f0f0); --checkbox-wrapper-bg-checked: var(--lmvz-semantic-color-status-active, #f6fbfe); --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, #545454); --checkbox-error-color: var(--lmvz-semantic-color-status-on-danger, #a31419); --checkbox-focus-color: var(--lmvz-semantic-color-status-on-active, #0e7ab4); --checkbox-easing: var(--lmvz-global-easing-default, ease); --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-8-2, clamp(0.13rem, 0.03rem + 0.39vw, 0.5rem)); padding-inline: var(--lmvz-dimension-10-4, clamp(0.25rem, 0.16rem + 0.39vw, 0.63rem)); border-radius: var(--lmvz-semantic-border-radius-round, 999px); 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; appearance: none; } .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, 400 clamp(0.88rem, 0.84rem + 0.13vw, 1rem) / 1.5 Router); 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, 400 clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem) / 1.5 Router); color: var(--checkbox-helper-color); margin-block-start: 2px; } .error-text.sc-lmvz-checkbox { font: var(--lmvz-typography-body-sm, 400 clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem) / 1.5 Router); color: var(--checkbox-error-color); display: block; margin-block-start: 4px; padding-inline: 10px; } @media (hover: hover) { .pill.sc-lmvz-checkbox:hover { background-color: var(--checkbox-wrapper-bg-hover); } .pill.sc-lmvz-checkbox:hover .box.sc-lmvz-checkbox { border-color: var(--checkbox-border-color-hover); } } [checked].sc-lmvz-checkbox-h .pill.sc-lmvz-checkbox { background-color: var(--checkbox-wrapper-bg-checked); } [checked].sc-lmvz-checkbox-h .box.sc-lmvz-checkbox { border-color: var(--checkbox-border-color-checked); } [checked].sc-lmvz-checkbox-h label.sc-lmvz-checkbox { color: var(--checkbox-label-color-checked); } [error].sc-lmvz-checkbox-h .box.sc-lmvz-checkbox { border-color: var(--checkbox-border-color-error); } [error].sc-lmvz-checkbox-h .helper-text.sc-lmvz-checkbox { color: var(--checkbox-error-color); } [disabled].sc-lmvz-checkbox-h { opacity: var(--lmvz-component-input-disabled-opacity, 40%); pointer-events: none; input, label, .box, .content { cursor: not-allowed; } } .sc-lmvz-checkbox-h:has(:focus-visible) .pill.sc-lmvz-checkbox { outline: var(--lmvz-ds-outline, 1px solid #0e7ab4); outline-offset: var(--lmvz-ds-outline-offset, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem)); } @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:has(:focus-visible) .pill.sc-lmvz-checkbox { outline-color: Highlight; box-shadow: none; } }"}},[578,"lmvz-checkbox",{label:[1],checked:[1540],value:[1],name:[513],disabled:[516],required:[516],error:[6660],errorMessage:[1,"error-message"],helperText:[1,"helper-text"],form:[1],autofocus:[4],nativeError:[32],checkedState:[32],focusInput:[64],checkValidity:[64],reportValidity:[64],getValidationMessage:[64]},[[0,"invalid","handleInvalid"]],{checked:[{handleCheckedChange:0}],required:[{handleRequiredChange:0}]}]),b=d,m=function(){"undefined"!=typeof customElements&&["lmvz-checkbox"].forEach((e=>{"lmvz-checkbox"===e&&(customElements.get(t(e))||customElements.define(t(e),d))}))};export{b as LmvzCheckbox,m as defineCustomElement}
|
package/components/lmvz-chip.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{L as
|
|
1
|
+
import{L as s,d as o}from"./p-ctF-ydws.js";const t=s,p=o;export{t as LmvzChip,p as defineCustomElement}
|