@lmvz-ds/components 0.35.0 → 0.35.2
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/README.md +10 -0
- package/cjs/{async.util-BQ60l-WC.js → async.util-Dnl6c82X.js} +1 -0
- package/cjs/{list-keyboard-controller-Dm5S_l0D.js → directional-focus-controller-DBat-oF7.js} +13 -1
- package/cjs/element-activation-controller-BHqCUgQv.js +57 -0
- package/cjs/{element.util-Dbyc8yUG.js → element.util-CRS_YJ59.js} +10 -2
- package/cjs/lmvz-action-list.cjs.entry.js +9 -6
- package/cjs/lmvz-action.cjs.entry.js +1 -1
- package/cjs/lmvz-button-group.cjs.entry.js +1 -1
- package/cjs/lmvz-button_2.cjs.entry.js +5 -6
- package/cjs/lmvz-card.cjs.entry.js +1 -1
- package/cjs/lmvz-checkbox.cjs.entry.js +1 -1
- package/cjs/lmvz-chip.cjs.entry.js +1 -1
- package/cjs/lmvz-components.cjs.js +1 -1
- package/cjs/lmvz-header_2.cjs.entry.js +9 -6
- package/cjs/lmvz-input.cjs.entry.js +4 -4
- package/cjs/lmvz-menuitem.cjs.entry.js +3 -2
- package/cjs/lmvz-message.cjs.entry.js +42 -9
- package/cjs/lmvz-modal.cjs.entry.js +3 -3
- package/cjs/lmvz-popover.cjs.entry.js +48 -28
- package/cjs/lmvz-radio.cjs.entry.js +1 -1
- package/cjs/lmvz-select.cjs.entry.js +1 -1
- package/cjs/lmvz-tabs.cjs.entry.js +9 -6
- package/cjs/lmvz-toggle.cjs.entry.js +3 -3
- package/cjs/loader.cjs.js +1 -1
- package/{esm/reactive-controller-host-FBuCCcFC.js → cjs/reactive-controller-host-Bc6B_T45.js} +19 -1
- package/cjs/{stencil.util-DxdYjVoH.js → stencil.util-CBrPLd-F.js} +1 -1
- package/collection/components/lmvz-action/lmvz-action.js +1 -1
- package/collection/components/lmvz-action-list/lmvz-action-list.css +1 -0
- package/collection/components/lmvz-action-list/lmvz-action-list.js +26 -2
- package/collection/components/lmvz-button/lmvz-button.css +1 -0
- package/collection/components/lmvz-button/lmvz-button.js +1 -2
- package/collection/components/lmvz-card/lmvz-card.css +1 -0
- package/collection/components/lmvz-header/lmvz-header.js +26 -2
- package/collection/components/lmvz-input/lmvz-input.css +2 -1
- package/collection/components/lmvz-message/lmvz-message.js +42 -9
- package/collection/components/lmvz-modal/lmvz-modal.js +1 -1
- package/collection/components/lmvz-modal/test/testing.js +36 -0
- package/collection/components/lmvz-popover/lmvz-popover.js +55 -28
- package/collection/components/lmvz-tabs/lmvz-tabs.js +22 -2
- package/collection/utils/aria/{list-keyboard-controller.js → directional-focus-controller.js} +11 -0
- package/collection/utils/aria/element-activation-controller.js +27 -11
- package/collection/utils/data/{event.utilt.js → event.util.js} +8 -0
- package/collection/utils/element/element.util.js +9 -2
- package/collection/utils/stencil/reactive-controller-host.js +14 -0
- 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-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-tabs.js +1 -1
- package/components/lmvz-toggle.js +1 -1
- package/components/p-B_rnXUwq.js +1 -0
- package/components/p-CgK6-SEe.js +1 -0
- package/components/{p-DbIm98qX.js → p-Chj7BuUZ.js} +1 -1
- package/components/p-CxLd309t.js +1 -0
- package/components/{p-D7S1WiEC.js → p-D5FL8n1q.js} +1 -1
- package/components/p-DLUsBYJH.js +1 -0
- package/components/p-DZj20TV1.js +1 -0
- package/components/p-bh9cItsP.js +1 -0
- package/components/p-zMWemcoB.js +1 -0
- package/esm/{async.util-D9nUtvTm.js → async.util-DZj20TV1.js} +1 -1
- package/esm/{list-keyboard-controller-tle6IRkv.js → directional-focus-controller-DgAdCZrG.js} +13 -2
- package/esm/element-activation-controller-7PNSl6io.js +54 -0
- package/esm/{element.util-B0eCxdyI.js → element.util-BFcYfHYq.js} +10 -3
- package/esm/lmvz-action-list.entry.js +8 -5
- package/esm/lmvz-action.entry.js +1 -1
- package/esm/lmvz-button-group.entry.js +1 -1
- package/esm/lmvz-button_2.entry.js +5 -6
- package/esm/lmvz-card.entry.js +1 -1
- package/esm/lmvz-checkbox.entry.js +1 -1
- package/esm/lmvz-chip.entry.js +1 -1
- package/esm/lmvz-components.js +1 -1
- package/esm/lmvz-header_2.entry.js +8 -5
- package/esm/lmvz-input.entry.js +4 -4
- package/esm/lmvz-menuitem.entry.js +3 -2
- package/esm/lmvz-message.entry.js +42 -9
- package/esm/lmvz-modal.entry.js +3 -3
- package/esm/lmvz-popover.entry.js +48 -28
- package/esm/lmvz-radio.entry.js +1 -1
- package/esm/lmvz-select.entry.js +1 -1
- package/esm/lmvz-tabs.entry.js +7 -4
- package/esm/lmvz-toggle.entry.js +3 -3
- package/esm/loader.js +1 -1
- package/{cjs/reactive-controller-host-B_lZtcA6.js → esm/reactive-controller-host-CICeIanv.js} +15 -3
- package/esm/{stencil.util-wGFRYLwZ.js → stencil.util-D2-5rsN3.js} +1 -1
- package/hydrate/index.js +216 -101
- package/hydrate/index.mjs +216 -101
- package/lmvz-components/lmvz-components.esm.js +1 -1
- package/lmvz-components/{p-c87e2281.entry.js → p-194a3af5.entry.js} +1 -1
- package/lmvz-components/{p-e0432f54.entry.js → p-24d13be6.entry.js} +1 -1
- package/lmvz-components/{p-c082390b.entry.js → p-46edf36f.entry.js} +1 -1
- package/lmvz-components/p-5ff55ba9.entry.js +1 -0
- package/lmvz-components/{p-c494bf8f.entry.js → p-888e04d7.entry.js} +1 -1
- package/lmvz-components/p-9dc420e2.entry.js +1 -0
- package/lmvz-components/p-BFcYfHYq.js +1 -0
- package/lmvz-components/p-BuEA0MWd.js +1 -0
- package/lmvz-components/p-CICeIanv.js +1 -0
- package/lmvz-components/p-DZj20TV1.js +1 -0
- package/lmvz-components/p-a887018d.entry.js +1 -0
- package/lmvz-components/p-aaa7691c.entry.js +1 -0
- package/lmvz-components/p-b6dd045b.entry.js +1 -0
- package/lmvz-components/p-bh9cItsP.js +1 -0
- package/lmvz-components/{p-4c68d21a.entry.js → p-c3e62aba.entry.js} +1 -1
- package/lmvz-components/{p-1d2c11ea.entry.js → p-d4154a65.entry.js} +1 -1
- package/lmvz-components/p-d45164a8.entry.js +1 -0
- package/lmvz-components/p-e4ce63b3.entry.js +1 -0
- package/lmvz-components/{p-cb75c951.entry.js → p-eb4c5a6f.entry.js} +1 -1
- package/lmvz-components/{p-8fb4c347.entry.js → p-eb62d4af.entry.js} +1 -1
- package/lmvz-components/{p-a4ef8e55.entry.js → p-f42b16e6.entry.js} +1 -1
- package/lmvz-components/p-fbf066d9.entry.js +1 -0
- package/lmvz-components/p-wlMjNjuv.js +1 -0
- package/manifest.json +79 -5
- package/package.json +1 -1
- package/types/api/ds.constants.d.ts +1 -0
- package/types/components/lmvz-action/lmvz-action.d.ts +1 -0
- package/types/components/lmvz-action-list/lmvz-action-list.d.ts +3 -1
- package/types/components/lmvz-button/lmvz-button.d.ts +2 -1
- package/types/components/lmvz-button-group/lmvz-button-group.d.ts +1 -0
- package/types/components/lmvz-card/lmvz-card.d.ts +1 -0
- package/types/components/lmvz-checkbox/lmvz-checkbox.d.ts +1 -0
- package/types/components/lmvz-chip/lmvz-chip.d.ts +1 -0
- package/types/components/lmvz-header/lmvz-header.d.ts +4 -2
- package/types/components/lmvz-icon/lmvz-icon.d.ts +1 -0
- package/types/components/lmvz-input/lmvz-input.d.ts +1 -0
- package/types/components/lmvz-link/lmvz-link.d.ts +1 -0
- package/types/components/lmvz-menuitem/lmvz-menuitem.d.ts +1 -0
- package/types/components/lmvz-message/lmvz-message.d.ts +1 -0
- package/types/components/lmvz-message/public.d.ts +1 -0
- package/types/components/lmvz-modal/lmvz-modal.d.ts +1 -0
- package/types/components/lmvz-modal/test/testing.d.ts +10 -0
- package/types/components/lmvz-popover/lmvz-popover.d.ts +6 -3
- package/types/components/lmvz-radio/lmvz-radio.d.ts +1 -0
- package/types/components/lmvz-select/lmvz-select.d.ts +1 -0
- package/types/components/lmvz-snackbar/lmvz-snackbar.d.ts +1 -0
- package/types/components/lmvz-snackbar/public.d.ts +1 -0
- package/types/components/lmvz-snackbar/snackbar-controller.d.ts +1 -0
- package/types/components/lmvz-spinner/lmvz-spinner.d.ts +1 -0
- package/types/components/lmvz-tab/lmvz-tab.d.ts +1 -0
- package/types/components/lmvz-tabs/lmvz-tabs.d.ts +3 -1
- package/types/components/lmvz-toggle/lmvz-toggle.d.ts +1 -0
- package/types/components.d.ts +18 -0
- package/types/index.d.ts +1 -0
- package/types/utils/aria/aria-validation-controller.d.ts +1 -0
- package/types/utils/aria/aria.constants.d.ts +1 -0
- package/types/utils/aria/{list-keyboard-controller.d.ts → directional-focus-controller.d.ts} +13 -2
- package/types/utils/aria/element-activation-controller.d.ts +11 -2
- package/types/utils/async/async.util.d.ts +1 -0
- package/types/utils/data/event.util.d.ts +6 -0
- package/types/utils/data/number.util.d.ts +1 -0
- package/types/utils/data/object.util.d.ts +1 -0
- package/types/utils/data/time.util.d.ts +1 -0
- package/types/utils/element/element.util.d.ts +2 -0
- package/types/utils/environment.d.ts +1 -0
- package/types/utils/icons/icons-registry.d.ts +1 -0
- package/types/utils/icons/icons.d.ts +1 -0
- package/types/utils/icons/icons.unit.d.ts +1 -0
- package/types/utils/icons/public.d.ts +1 -0
- package/types/utils/public.d.ts +1 -0
- package/types/utils/radio/radio-group-controller.d.ts +1 -0
- package/types/utils/stencil/assets.d.ts +1 -0
- package/types/utils/stencil/reactive-controller-host.d.ts +8 -1
- package/types/utils/stencil/stencil.util.d.ts +1 -0
- package/cjs/element-activation-controller-DC_6T0Rt.js +0 -31
- package/components/p-BhSTYZC6.js +0 -1
- package/components/p-CK3Ixl1K.js +0 -1
- package/components/p-CN0JX9-m.js +0 -1
- package/components/p-D-2gj6LP.js +0 -1
- package/components/p-D9nUtvTm.js +0 -1
- package/components/p-DAMVH-31.js +0 -1
- package/components/p-JtkmlmeY.js +0 -1
- package/esm/element-activation-controller-CN0JX9-m.js +0 -29
- package/lmvz-components/p-45c3ccb6.entry.js +0 -1
- package/lmvz-components/p-49e98627.entry.js +0 -1
- package/lmvz-components/p-50063516.entry.js +0 -1
- package/lmvz-components/p-76be3fc9.entry.js +0 -1
- package/lmvz-components/p-854f1c72.entry.js +0 -1
- package/lmvz-components/p-886e42c7.entry.js +0 -1
- package/lmvz-components/p-9f8fd077.entry.js +0 -1
- package/lmvz-components/p-B0eCxdyI.js +0 -1
- package/lmvz-components/p-BhSTYZC6.js +0 -1
- package/lmvz-components/p-CN0JX9-m.js +0 -1
- package/lmvz-components/p-D9nUtvTm.js +0 -1
- package/lmvz-components/p-DuLiExhX.js +0 -1
- package/lmvz-components/p-FBuCCcFC.js +0 -1
- package/lmvz-components/p-bc237ab7.entry.js +0 -1
- package/types/utils/data/event.utilt.d.ts +0 -4
|
@@ -17,14 +17,47 @@ const TYPE_SVG = {
|
|
|
17
17
|
warning: WARNING_SVG,
|
|
18
18
|
};
|
|
19
19
|
const BLOCK_TAGS = new Set([
|
|
20
|
-
'ADDRESS',
|
|
21
|
-
'
|
|
22
|
-
'
|
|
23
|
-
'
|
|
24
|
-
'
|
|
25
|
-
'
|
|
26
|
-
'
|
|
27
|
-
'
|
|
20
|
+
'ADDRESS',
|
|
21
|
+
'ARTICLE',
|
|
22
|
+
'ASIDE',
|
|
23
|
+
'BLOCKQUOTE',
|
|
24
|
+
'CAPTION',
|
|
25
|
+
'COLGROUP',
|
|
26
|
+
'DD',
|
|
27
|
+
'DETAILS',
|
|
28
|
+
'DIALOG',
|
|
29
|
+
'DIV',
|
|
30
|
+
'DL',
|
|
31
|
+
'DT',
|
|
32
|
+
'FIELDSET',
|
|
33
|
+
'FIGCAPTION',
|
|
34
|
+
'FIGURE',
|
|
35
|
+
'FOOTER',
|
|
36
|
+
'FORM',
|
|
37
|
+
'H1',
|
|
38
|
+
'H2',
|
|
39
|
+
'H3',
|
|
40
|
+
'H4',
|
|
41
|
+
'H5',
|
|
42
|
+
'H6',
|
|
43
|
+
'HEADER',
|
|
44
|
+
'HGROUP',
|
|
45
|
+
'HR',
|
|
46
|
+
'LI',
|
|
47
|
+
'MAIN',
|
|
48
|
+
'MENU',
|
|
49
|
+
'NAV',
|
|
50
|
+
'OL',
|
|
51
|
+
'P',
|
|
52
|
+
'PRE',
|
|
53
|
+
'SECTION',
|
|
54
|
+
'TABLE',
|
|
55
|
+
'TBODY',
|
|
56
|
+
'TD',
|
|
57
|
+
'TH',
|
|
58
|
+
'THEAD',
|
|
59
|
+
'TFOOT',
|
|
60
|
+
'TR',
|
|
28
61
|
'UL',
|
|
29
62
|
]);
|
|
30
63
|
const LmvzMessage = class {
|
|
@@ -70,7 +103,7 @@ const LmvzMessage = class {
|
|
|
70
103
|
}
|
|
71
104
|
render() {
|
|
72
105
|
const role = this.live === 'assertive' ? 'alert' : this.live === 'polite' ? 'status' : 'note';
|
|
73
|
-
return (index.h(index.Host, { key: '
|
|
106
|
+
return (index.h(index.Host, { key: '99dad82a6300fb8d089f1ea688186d4b4316a058', role: role }, this.leadingIcon && index.h("span", { key: '2adf33102f7075a83ebf29d9b6e0d433a17beb68', class: "leading-icon", "aria-hidden": "true", innerHTML: TYPE_SVG[this.type] }), index.h("span", { key: '286d3d0ea065534b84be18c927b2fcd7f30f34bd', class: "message" }, index.h("slot", { key: '261e865980515a816382b2c7c6b3a52b500308bf', ref: (el) => (this.messageSlot = el), onSlotchange: this.handleSlotChange })), this.actionLabel && (index.h("lmvz-button", { key: '46d964c0490bbdd47426fc228db0e3ccb108b416', variant: "tertiary", scale: "small", onLmvzActivation: this.handleActionClick }, this.actionLabel)), this.dismissible && (index.h("lmvz-button", { key: 'ce1ec8beb756c2e11c948e227f94f81bd5568c88', variant: "tertiary", scale: "small", "aria-label": this.closeLabel, onClick: this.handleDismissClick }, index.h("lmvz-icon", { key: '5361c424e77ffea7984c2fd42357666cd86ba1d6', "aria-hidden": "true", icon: CLOSE_SM_SVG })))));
|
|
74
107
|
}
|
|
75
108
|
};
|
|
76
109
|
LmvzMessage.style = lmvzMessageCss();
|
|
@@ -4,8 +4,8 @@ var index = require('./index-TGsVZNDP.js');
|
|
|
4
4
|
var closeSm = require('./close-sm-CATLoxxd.js');
|
|
5
5
|
var svg = require('./svg-CysxzZw7.js');
|
|
6
6
|
var ariaValidationController = require('./aria-validation-controller-BC0Eaiv4.js');
|
|
7
|
-
var element_util = require('./element.util-
|
|
8
|
-
var reactiveControllerHost = require('./reactive-controller-host-
|
|
7
|
+
var element_util = require('./element.util-CRS_YJ59.js');
|
|
8
|
+
var reactiveControllerHost = require('./reactive-controller-host-Bc6B_T45.js');
|
|
9
9
|
require('./logger-NBdKPSou.js');
|
|
10
10
|
require('./aria-loader-DWUVcapD.js');
|
|
11
11
|
|
|
@@ -233,7 +233,7 @@ const LmvzModal = class extends reactiveControllerHost.ReactiveControllerHost {
|
|
|
233
233
|
this.hasHeader = this.hasAssignedContent(this.headerSlot);
|
|
234
234
|
};
|
|
235
235
|
render() {
|
|
236
|
-
return (index.h(index.Host, { key: '8b5f506cdac223a440309d472639fe965b94f8c2' }, index.h("dialog", { key: '0b70ac4d9590266271052c4d7fdef03c684d9b72', ref: (element) => (this.dialogEl = element), onCancel: this.handleDialogCancel, onClose: this.handleDialogClose, ...this.dialogAccessibilityAttributes }, index.h("div", { key: '25b529bec1905408c2041b7370ab37586eade47d', class: "modal-shell" }, index.h("header", { key: 'd86ae4a6f4ac7f6efd38385f1407d1f6bfbb1abb', class: { header: true, 'has-title': this.hasHeader } }, index.h("div", { key: '7fd7059bfb0b90834895a87c2f2598e2e8c2ba80', class: "title", id: this.dialogTitleId, hidden: !this.hasHeader }, index.h("slot", { key: 'b6eb7885e220e5def4c3c8420d5b83f4a7e30907', name: "header", ref: (element) => (this.headerSlot = element), onSlotchange: this.handleHeaderSlotChange })), index.h("lmvz-button", { key: '
|
|
236
|
+
return (index.h(index.Host, { key: '8b5f506cdac223a440309d472639fe965b94f8c2' }, index.h("dialog", { key: '0b70ac4d9590266271052c4d7fdef03c684d9b72', ref: (element) => (this.dialogEl = element), onCancel: this.handleDialogCancel, onClose: this.handleDialogClose, ...this.dialogAccessibilityAttributes }, index.h("div", { key: '25b529bec1905408c2041b7370ab37586eade47d', class: "modal-shell" }, index.h("header", { key: 'd86ae4a6f4ac7f6efd38385f1407d1f6bfbb1abb', class: { header: true, 'has-title': this.hasHeader } }, index.h("div", { key: '7fd7059bfb0b90834895a87c2f2598e2e8c2ba80', class: "title", id: this.dialogTitleId, hidden: !this.hasHeader }, index.h("slot", { key: 'b6eb7885e220e5def4c3c8420d5b83f4a7e30907', name: "header", ref: (element) => (this.headerSlot = element), onSlotchange: this.handleHeaderSlotChange })), index.h("lmvz-button", { key: '72e17391097dfa756e572764f40080b6eec222b2', ref: (element) => (this.closeButtonEl = element), type: "button", class: "close-button", "aria-label": this.closeLabel, onLmvzActivation: this.handleCloseButtonClick, variant: "tertiary" }, index.h("lmvz-icon", { key: '7bbae1aefa9ccc6646d5861683e3476339a545e4', icon: closeIconSvg }))), index.h("div", { key: '9f22628448e9af527eb10ef2602c498afc55c029', class: "body" }, index.h("slot", { key: '413e72707749b3abc987ef47a81cccda4b874c84' })), index.h("footer", { key: 'a1a8f648e88d1f9045e9cf866d332aac69e033df', class: "actions", hidden: !this.buttonGroupEl?.hasActions }, index.h("lmvz-button-group", { key: '7d7eeee7a2551a09bfb4fc513bde48828be5ee8b', ref: (element) => (this.buttonGroupEl = element) }, index.h("slot", { key: '76b00523167c5fa08f11fc351a37638227401711', name: "actions" })))))));
|
|
237
237
|
}
|
|
238
238
|
static get watchers() { return {
|
|
239
239
|
"open": [{
|
|
@@ -2,8 +2,11 @@
|
|
|
2
2
|
|
|
3
3
|
var index = require('./index-TGsVZNDP.js');
|
|
4
4
|
var ariaLoader = require('./aria-loader-DWUVcapD.js');
|
|
5
|
-
var
|
|
6
|
-
var
|
|
5
|
+
var directionalFocusController = require('./directional-focus-controller-DBat-oF7.js');
|
|
6
|
+
var elementActivationController = require('./element-activation-controller-BHqCUgQv.js');
|
|
7
|
+
var async_util = require('./async.util-Dnl6c82X.js');
|
|
8
|
+
var element_util = require('./element.util-CRS_YJ59.js');
|
|
9
|
+
require('./reactive-controller-host-Bc6B_T45.js');
|
|
7
10
|
|
|
8
11
|
/**
|
|
9
12
|
* Custom positioning reference element.
|
|
@@ -1372,10 +1375,12 @@ const LmvzPopover = class {
|
|
|
1372
1375
|
this.lmvzCancel = index.createEvent(this, "lmvzCancel", 7);
|
|
1373
1376
|
}
|
|
1374
1377
|
get el() { return index.getElement(this); }
|
|
1375
|
-
|
|
1378
|
+
extEventController = new AbortController();
|
|
1379
|
+
closureController;
|
|
1376
1380
|
containerEl;
|
|
1377
1381
|
slotEl;
|
|
1378
1382
|
previouslyFocusedElement = null;
|
|
1383
|
+
anchorEl;
|
|
1379
1384
|
open = false;
|
|
1380
1385
|
anchor;
|
|
1381
1386
|
placement = 'bottom-start';
|
|
@@ -1401,7 +1406,6 @@ const LmvzPopover = class {
|
|
|
1401
1406
|
}
|
|
1402
1407
|
componentDidLoad() {
|
|
1403
1408
|
autoAssignId(this.el);
|
|
1404
|
-
validatePopoverAria(this.el, this.label, this.anchor, this.resolveAnchor());
|
|
1405
1409
|
}
|
|
1406
1410
|
handleOpenChange(isOpen) {
|
|
1407
1411
|
if (isOpen) {
|
|
@@ -1411,24 +1415,40 @@ const LmvzPopover = class {
|
|
|
1411
1415
|
this.onClose();
|
|
1412
1416
|
}
|
|
1413
1417
|
}
|
|
1414
|
-
handleAnchorChange() {
|
|
1415
|
-
if (
|
|
1416
|
-
this.
|
|
1418
|
+
async handleAnchorChange(anchor) {
|
|
1419
|
+
if (!anchor) {
|
|
1420
|
+
console.warn('anchor property missing for popover', this.el?.id);
|
|
1421
|
+
this.anchor = undefined;
|
|
1422
|
+
return;
|
|
1417
1423
|
}
|
|
1424
|
+
await async_util.wait();
|
|
1425
|
+
this.anchorEl = typeof anchor === 'string' ? document.getElementById(anchor) : anchor;
|
|
1426
|
+
this.setupAnchorEl();
|
|
1427
|
+
if (!this.open)
|
|
1428
|
+
return;
|
|
1429
|
+
this.updatePosition();
|
|
1418
1430
|
}
|
|
1419
1431
|
disconnectedCallback() {
|
|
1420
1432
|
this.removeCloseHandlers();
|
|
1433
|
+
this.extEventController.abort();
|
|
1421
1434
|
}
|
|
1422
|
-
|
|
1423
|
-
|
|
1424
|
-
|
|
1425
|
-
|
|
1426
|
-
return
|
|
1435
|
+
setupAnchorEl() {
|
|
1436
|
+
const { anchorEl } = this;
|
|
1437
|
+
if (!anchorEl) {
|
|
1438
|
+
console.warn('no anchor element set for', this);
|
|
1439
|
+
return;
|
|
1427
1440
|
}
|
|
1428
|
-
|
|
1441
|
+
if (!anchorEl.hasAttribute('aria-haspopup')) {
|
|
1442
|
+
anchorEl.setAttribute('aria-haspopup', 'dialog');
|
|
1443
|
+
}
|
|
1444
|
+
anchorEl.setAttribute('aria-controls', this.el.getAttribute('id'));
|
|
1445
|
+
if (element_util.isActionButton(anchorEl)) {
|
|
1446
|
+
elementActivationController.addElementActivationListener(anchorEl, this.toggle.bind(this), this.extEventController.signal);
|
|
1447
|
+
}
|
|
1448
|
+
validatePopoverAria(this.el, this.label, this.anchor, anchorEl);
|
|
1429
1449
|
}
|
|
1430
1450
|
async updatePosition() {
|
|
1431
|
-
const anchorEl = this
|
|
1451
|
+
const { anchorEl } = this;
|
|
1432
1452
|
const container = this.containerEl;
|
|
1433
1453
|
if (!anchorEl || !container)
|
|
1434
1454
|
return;
|
|
@@ -1443,7 +1463,6 @@ const LmvzPopover = class {
|
|
|
1443
1463
|
async onOpen() {
|
|
1444
1464
|
this.previouslyFocusedElement = element_util.getDeepActiveElement(document);
|
|
1445
1465
|
this.setupCloseHandlers();
|
|
1446
|
-
console.log('onOpen');
|
|
1447
1466
|
await async_util.waitFrame();
|
|
1448
1467
|
await this.updatePosition();
|
|
1449
1468
|
autoAssignId(this.el);
|
|
@@ -1461,20 +1480,14 @@ const LmvzPopover = class {
|
|
|
1461
1480
|
this.lmvzClose.emit();
|
|
1462
1481
|
}
|
|
1463
1482
|
applyAnchorAriaOpen() {
|
|
1464
|
-
|
|
1465
|
-
if (!anchorEl)
|
|
1483
|
+
if (!this.anchorEl)
|
|
1466
1484
|
return;
|
|
1467
|
-
|
|
1468
|
-
anchorEl.setAttribute('aria-haspopup', 'dialog');
|
|
1469
|
-
}
|
|
1470
|
-
anchorEl.setAttribute('aria-expanded', 'true');
|
|
1471
|
-
anchorEl.setAttribute('aria-controls', this.el.getAttribute('id'));
|
|
1485
|
+
this.anchorEl.setAttribute('aria-expanded', 'true');
|
|
1472
1486
|
}
|
|
1473
1487
|
applyAnchorAriaClose() {
|
|
1474
|
-
|
|
1475
|
-
if (!anchorEl)
|
|
1488
|
+
if (!this.anchorEl)
|
|
1476
1489
|
return;
|
|
1477
|
-
anchorEl.setAttribute('aria-expanded', 'false');
|
|
1490
|
+
this.anchorEl.setAttribute('aria-expanded', 'false');
|
|
1478
1491
|
}
|
|
1479
1492
|
focusFirst() {
|
|
1480
1493
|
const { slotEl } = this;
|
|
@@ -1482,6 +1495,12 @@ const LmvzPopover = class {
|
|
|
1482
1495
|
return;
|
|
1483
1496
|
const assigned = slotEl.assignedElements({ flatten: true });
|
|
1484
1497
|
for (const el of assigned) {
|
|
1498
|
+
if (!element_util.isHtmlElement(el))
|
|
1499
|
+
continue;
|
|
1500
|
+
if (directionalFocusController.isFocusControllerHost(el)) {
|
|
1501
|
+
el.initFocus();
|
|
1502
|
+
return;
|
|
1503
|
+
}
|
|
1485
1504
|
const focusable = element_util.walkShadowDOMUntil(el, element_util.canReceiveFocus);
|
|
1486
1505
|
if (focusable) {
|
|
1487
1506
|
focusable.focus();
|
|
@@ -1503,6 +1522,7 @@ const LmvzPopover = class {
|
|
|
1503
1522
|
}
|
|
1504
1523
|
}
|
|
1505
1524
|
setupCloseHandlers() {
|
|
1525
|
+
this.closureController = new AbortController();
|
|
1506
1526
|
const options = { signal: this.closureController.signal };
|
|
1507
1527
|
document.addEventListener('mousedown', (event) => {
|
|
1508
1528
|
if (!this.open)
|
|
@@ -1520,17 +1540,17 @@ const LmvzPopover = class {
|
|
|
1520
1540
|
}, options);
|
|
1521
1541
|
}
|
|
1522
1542
|
removeCloseHandlers() {
|
|
1523
|
-
this.closureController
|
|
1543
|
+
this.closureController?.abort();
|
|
1524
1544
|
}
|
|
1525
1545
|
render() {
|
|
1526
|
-
return (index.h(index.Host, { key: '
|
|
1546
|
+
return (index.h(index.Host, { key: '744dae23d80c1e81a0b8bd2e9fcb02c6669d54cd' }, index.h("div", { key: '7f40e25f1e05738b2bbf900b90613004eb188395', role: "dialog", part: "container", class: `container lmvz-wrapper-card-${this.size}`, "aria-label": this.label || undefined, ref: (el) => (this.containerEl = el) }, index.h("slot", { key: '5a400fd9e697254007973f2dce172588fe3760ee', ref: (el) => (this.slotEl = el) }))));
|
|
1527
1547
|
}
|
|
1528
1548
|
static get watchers() { return {
|
|
1529
1549
|
"open": [{
|
|
1530
1550
|
"handleOpenChange": 0
|
|
1531
1551
|
}],
|
|
1532
1552
|
"anchor": [{
|
|
1533
|
-
"handleAnchorChange":
|
|
1553
|
+
"handleAnchorChange": 1
|
|
1534
1554
|
}]
|
|
1535
1555
|
}; }
|
|
1536
1556
|
};
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
var index = require('./index-TGsVZNDP.js');
|
|
4
4
|
var ariaValidationController = require('./aria-validation-controller-BC0Eaiv4.js');
|
|
5
|
-
var reactiveControllerHost = require('./reactive-controller-host-
|
|
5
|
+
var reactiveControllerHost = require('./reactive-controller-host-Bc6B_T45.js');
|
|
6
6
|
require('./aria-loader-DWUVcapD.js');
|
|
7
7
|
|
|
8
8
|
function groupKey(name, scope) {
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
var index = require('./index-TGsVZNDP.js');
|
|
4
4
|
var ariaValidationController = require('./aria-validation-controller-BC0Eaiv4.js');
|
|
5
|
-
var reactiveControllerHost = require('./reactive-controller-host-
|
|
5
|
+
var reactiveControllerHost = require('./reactive-controller-host-Bc6B_T45.js');
|
|
6
6
|
require('./aria-loader-DWUVcapD.js');
|
|
7
7
|
|
|
8
8
|
const lmvzSelectCss = () => `@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-select-h { display: block; font-family: var(--lmvz-global-font-family-default, Router); --lmvz-internal-select-floating-label-top-offset: 0.375rem; padding-top: var(--lmvz-internal-select-floating-label-top-offset); --lmvz-select-radius: var(--lmvz-component-input-radius-default, 999px); --lmvz-select-bg: var(--lmvz-semantic-color-surface-input-primary, #ffffff); --lmvz-select-border-color: var(--lmvz-semantic-color-border-default, #e0e0e0); --lmvz-select-border-color-hover: var(--lmvz-semantic-color-border-hover, #a1a1a1); --lmvz-select-border-width: var(--lmvz-semantic-border-width-default, 1px); --lmvz-select-text-color: var(--lmvz-semantic-color-on-surface-input-primary, #000000); --lmvz-select-label-color: var(--lmvz-semantic-color-on-surface-input-primary, #000000); --lmvz-select-padding-x: var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem)); --lmvz-select-gap: var(--lmvz-component-input-gap-md, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem)); --lmvz-select-height: var(--lmvz-component-input-size-md, clamp(2.5rem, 2.44rem + 0.26vw, 2.75rem)); --lmvz-select-label-font-size: var(--lmvz-component-body-xs-font-size, clamp(0.63rem, 0.59rem + 0.13vw, 0.75rem)); --lmvz-select-label-top-offset: calc(var(--lmvz-internal-select-floating-label-top-offset) * -1); --lmvz-select-label-minimized-padding-x: 4px; --lmvz-select-disabled-opacity: var(--lmvz-component-input-disabled-opacity, 40%); --lmvz-select-helper-color: var(--lmvz-semantic-color-on-surface-input-secondary, #545454); --lmvz-select-focus-color: var(--lmvz-semantic-color-status-on-active, #0e7ab4); --lmvz-select-error-color: var(--lmvz-semantic-color-status-on-danger, #a31419); } .select-wrapper.sc-lmvz-select { position: relative; height: var(--lmvz-select-height); } label.sc-lmvz-select { position: absolute; top: 50%; left: var(--lmvz-select-padding-x); font-size: var(--lmvz-select-label-font-size); color: var(--lmvz-select-label-color); line-height: normal; white-space: nowrap; pointer-events: none; z-index: 2; transform: translateY(-50%); transform-origin: left top; transition: top 0.2s ease-out, transform 0.2s ease-out, opacity 0.2s ease-out, padding 0.2s ease-out; } label.assistive-label.sc-lmvz-select { opacity: 0; padding: 0; } label.floating-label.sc-lmvz-select { top: var(--lmvz-select-label-top-offset); transform: translateY(0) scale(0.85); left: calc(var(--lmvz-select-padding-x) - 2px); background-color: var(--lmvz-select-bg); padding: 0 var(--lmvz-select-label-minimized-padding-x); opacity: 1; font-weight: 500; } label.sc-lmvz-select > span[aria-hidden='true'].sc-lmvz-select, div[aria-hidden='true'].sc-lmvz-select > span.sc-lmvz-select:first-child > span[aria-hidden='true'].sc-lmvz-select { color: var(--lmvz-select-error-color); margin-left: 2px; display: inline-block; line-height: 0; vertical-align: middle; } div[aria-hidden].sc-lmvz-select { display: flex; align-items: center; gap: var(--lmvz-select-gap); height: 100%; padding: 0 var(--lmvz-select-padding-x); border-radius: var(--lmvz-select-radius); background-color: var(--lmvz-select-bg); border: var(--lmvz-select-border-width) solid var(--lmvz-select-border-color); box-sizing: border-box; cursor: pointer; position: relative; z-index: 1; transition: border-color 0.15s ease; } .sc-lmvz-select-h:not([disabled] .select-wrapper.sc-lmvz-select:hover div[aria-hidden].sc-lmvz-select, [highlighted]).sc-lmvz-select-h .select-wrapper.sc-lmvz-select:hover div[aria-hidden].sc-lmvz-select { border-color: var(--lmvz-select-border-color-hover); } [highlighted].sc-lmvz-select-h div[aria-hidden].sc-lmvz-select { background-color: var(--lmvz-semantic-color-status-active-alternate, #0f8acc); border-color: var(--lmvz-semantic-color-border-active, #0f8acc); color: var(--lmvz-semantic-color-status-on-active-alternate, #ffffff); } [highlighted].sc-lmvz-select-h div[aria-hidden].sc-lmvz-select > span.sc-lmvz-select:first-child { color: var(--lmvz-semantic-color-status-on-active-alternate, #ffffff); } [highlighted].sc-lmvz-select-h label.floating-label.sc-lmvz-select { background-color: var(--lmvz-semantic-color-status-active-alternate, #0f8acc); color: var(--lmvz-semantic-color-status-on-active-alternate, #ffffff); } .select-wrapper.sc-lmvz-select:focus-within div[aria-hidden].sc-lmvz-select { outline: var(--lmvz-ds-outline, 1px solid #0e7ab4); outline-offset: var(--lmvz-ds-outline-offset, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem)); } div[aria-hidden].sc-lmvz-select > span.sc-lmvz-select:first-child { flex: 1 0 0; font: var(--lmvz-typography-body-md-strong, 500 clamp(0.88rem, 0.84rem + 0.13vw, 1rem) / 1.5 Router); color: var(--lmvz-select-text-color); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .sc-lmvz-select-h:not([highlighted]) .select-wrapper.has-value.sc-lmvz-select div[aria-hidden].sc-lmvz-select > span.sc-lmvz-select:first-child { color: var(--lmvz-semantic-color-int-on-secondary-active, #000000); } div[aria-hidden].sc-lmvz-select > span.sc-lmvz-select:last-child { flex-shrink: 0; display: flex; align-items: center; justify-content: center; } div[aria-hidden].sc-lmvz-select svg.sc-lmvz-select { width: var(--lmvz-component-icon-size-2xs, clamp(0.63rem, 0.59rem + 0.13vw, 0.75rem)); height: var(--lmvz-component-icon-size-2xs, clamp(0.63rem, 0.59rem + 0.13vw, 0.75rem)); flex-shrink: 0; } select.sc-lmvz-select { appearance: none; position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; z-index: 2; border: none; background: transparent; margin: 0; padding: 0; } [disabled].sc-lmvz-select-h .select-wrapper.sc-lmvz-select { opacity: var(--lmvz-select-disabled-opacity); pointer-events: none; cursor: not-allowed; } [role='status'].sc-lmvz-select { margin-top: 4px; padding-left: var(--lmvz-select-padding-x); font-size: var(--lmvz-select-label-font-size); color: var(--lmvz-select-helper-color); line-height: normal; } [size='small'].sc-lmvz-select-h { --lmvz-select-height: var(--lmvz-component-input-size-sm, clamp(2rem, 1.94rem + 0.26vw, 2.25rem)); --lmvz-select-padding-x: var(--lmvz-component-input-padding-sm, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem)); --lmvz-select-gap: var(--lmvz-component-input-gap-sm, clamp(0.38rem, 0.31rem + 0.26vw, 0.63rem)); --lmvz-select-label-font-size: var(--lmvz-component-body-2xs-font-size, clamp(0.5rem, 0.47rem + 0.13vw, 0.63rem)); } [size='small'].sc-lmvz-select-h div[aria-hidden].sc-lmvz-select > span.sc-lmvz-select:first-child { font-size: var(--lmvz-component-body-sm-font-size, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem)); } [size='small'].sc-lmvz-select-h div[aria-hidden].sc-lmvz-select svg.sc-lmvz-select { width: var(--lmvz-component-icon-size-4xs, clamp(0.5rem, 0.47rem + 0.13vw, 0.63rem)); height: var(--lmvz-component-icon-size-4xs, clamp(0.5rem, 0.47rem + 0.13vw, 0.63rem)); } [size='large'].sc-lmvz-select-h { --lmvz-select-height: var(--lmvz-component-input-size-lg, clamp(2.75rem, 2.69rem + 0.26vw, 3rem)); --lmvz-select-padding-x: var(--lmvz-component-input-padding-lg, clamp(1rem, 0.94rem + 0.26vw, 1.25rem)); --lmvz-select-gap: var(--lmvz-component-input-gap-lg, clamp(0.75rem, 0.69rem + 0.26vw, 1rem)); --lmvz-select-label-font-size: var(--lmvz-component-body-sm-font-size, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem)); } [size='large'].sc-lmvz-select-h div[aria-hidden].sc-lmvz-select > span.sc-lmvz-select:first-child { font-size: var(--lmvz-component-body-lg-font-size, clamp(1rem, 0.97rem + 0.13vw, 1.13rem)); } [size='large'].sc-lmvz-select-h div[aria-hidden].sc-lmvz-select svg.sc-lmvz-select { width: var(--lmvz-component-icon-size-xs, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem)); height: var(--lmvz-component-icon-size-xs, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem)); }`;
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
3
|
var index = require('./index-TGsVZNDP.js');
|
|
4
|
-
var
|
|
5
|
-
var reactiveControllerHost = require('./reactive-controller-host-
|
|
6
|
-
require('./element.util-
|
|
4
|
+
var directionalFocusController = require('./directional-focus-controller-DBat-oF7.js');
|
|
5
|
+
var reactiveControllerHost = require('./reactive-controller-host-Bc6B_T45.js');
|
|
6
|
+
require('./element.util-CRS_YJ59.js');
|
|
7
7
|
|
|
8
8
|
const lmvzTabsCss = () => ` @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); } } :host { display: inline-block; } .tablist { display: inline-flex; flex-direction: row; background: var(--lmvz-semantic-color-int-secondary, #f0f0f0); border-radius: var(--lmvz-semantic-border-radius-round, 999px); overflow: auto hidden; scrollbar-width: none; } .tablist::-webkit-scrollbar { display: none; } :host([has-icon-tabs]) .tablist { gap: var(--lmvz-dimension-8-6, clamp(0.38rem, 0.34rem + 0.13vw, 0.5rem)); background: none; border-radius: 0; } :host([orientation='vertical']) .tablist { flex-direction: column; overflow: visible auto; } ::slotted([role='tabpanel']) { display: block; } ::slotted([role='tabpanel'][hidden]) { display: none; } `;
|
|
9
9
|
|
|
@@ -13,7 +13,7 @@ const LmvzTabs = class extends reactiveControllerHost.ReactiveControllerHost {
|
|
|
13
13
|
instanceId = ++tabsIdCounter;
|
|
14
14
|
tabSlotEl;
|
|
15
15
|
panelSlotEl;
|
|
16
|
-
focusController = new
|
|
16
|
+
focusController = new directionalFocusController.DirectionalFocusController(this, {
|
|
17
17
|
orientation: 'horizontal',
|
|
18
18
|
manageTabIndex: true,
|
|
19
19
|
enableHomeAndEnd: true,
|
|
@@ -51,6 +51,9 @@ const LmvzTabs = class extends reactiveControllerHost.ReactiveControllerHost {
|
|
|
51
51
|
this.syncFocusTargets();
|
|
52
52
|
this.syncTabOrientation();
|
|
53
53
|
}
|
|
54
|
+
async initFocus() {
|
|
55
|
+
this.focusController.initFocus();
|
|
56
|
+
}
|
|
54
57
|
async activateTab(value) {
|
|
55
58
|
const tab = this.findTabByValue(value);
|
|
56
59
|
if (!tab || this.isTabDisabled(tab))
|
|
@@ -114,7 +117,7 @@ const LmvzTabs = class extends reactiveControllerHost.ReactiveControllerHost {
|
|
|
114
117
|
syncOrientation() {
|
|
115
118
|
this.removeController(this.focusController);
|
|
116
119
|
this.focusController.hostDisconnected?.();
|
|
117
|
-
this.focusController = new
|
|
120
|
+
this.focusController = new directionalFocusController.DirectionalFocusController(this, {
|
|
118
121
|
orientation: this.orientation,
|
|
119
122
|
manageTabIndex: true,
|
|
120
123
|
enableHomeAndEnd: true,
|
|
@@ -240,7 +243,7 @@ const LmvzTabs = class extends reactiveControllerHost.ReactiveControllerHost {
|
|
|
240
243
|
this.selectTab(value);
|
|
241
244
|
};
|
|
242
245
|
render() {
|
|
243
|
-
return (index.h(index.Host, { key: '
|
|
246
|
+
return (index.h(index.Host, { key: '98df29f336a3ea47efa6c76a773de28c5174c718', onClick: this.handleTabClick, onKeydown: this.handleKeydown }, index.h("div", { key: '7e35ae180c4ebf2f5a82e0fad0977cd3c38ac659', role: "tablist", "aria-orientation": this.orientation, class: "tablist" }, index.h("slot", { key: '2520bc8b8988a60b37a067828ad237bf8dcfcc59', ref: (el) => (this.tabSlotEl = el) })), index.h("div", { key: 'bd4a954b6caca2d9f2eb588f58590821ec4af888', part: "panels-container", class: "panels-container" }, index.h("slot", { key: 'b4dffff530328e6e4c8d305895ef4dd2d5952757', name: "panels", ref: (el) => (this.panelSlotEl = el) }))));
|
|
244
247
|
}
|
|
245
248
|
static get watchers() { return {
|
|
246
249
|
"value": [{
|
|
@@ -2,10 +2,10 @@
|
|
|
2
2
|
|
|
3
3
|
var index = require('./index-TGsVZNDP.js');
|
|
4
4
|
var ariaValidationController = require('./aria-validation-controller-BC0Eaiv4.js');
|
|
5
|
-
var reactiveControllerHost = require('./reactive-controller-host-
|
|
6
|
-
var stencil_util = require('./stencil.util-
|
|
5
|
+
var reactiveControllerHost = require('./reactive-controller-host-Bc6B_T45.js');
|
|
6
|
+
var stencil_util = require('./stencil.util-CBrPLd-F.js');
|
|
7
7
|
require('./aria-loader-DWUVcapD.js');
|
|
8
|
-
require('./async.util-
|
|
8
|
+
require('./async.util-Dnl6c82X.js');
|
|
9
9
|
|
|
10
10
|
const lmvzToggleCss = () => `@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-toggle-h { display: inline-flex; align-items: center; gap: var(--lmvz-component-input-gap-md, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem)); 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); cursor: pointer; background-color: transparent; user-select: none; } .sc-lmvz-toggle-h:not([disabled]):hover { background-color: var(--lmvz-semantic-color-int-tertiary-hover, #f0f0f0); } [checked].sc-lmvz-toggle-h { background-color: var(--lmvz-semantic-color-status-active, #f6fbfe); } [disabled][checked].sc-lmvz-toggle-h { background-color: var(--lmvz-semantic-color-status-active, #f6fbfe); } [disabled].sc-lmvz-toggle-h { cursor: not-allowed; opacity: var(--lmvz-component-input-disabled-opacity, 40%); pointer-events: none; } .track.sc-lmvz-toggle { position: relative; flex-shrink: 0; width: var(--lmvz-global-s32, 32px); height: var(--lmvz-global-s20, 20px); border-radius: var(--lmvz-semantic-border-radius-round, 999px); background-color: var(--lmvz-semantic-color-surface-input-primary, #ffffff); border: var(--lmvz-semantic-border-width-default, 1px) solid var(--lmvz-semantic-color-border-default, #e0e0e0); } .sc-lmvz-toggle-h:not([disabled]):hover .track.sc-lmvz-toggle { border-color: var(--lmvz-semantic-color-border-hover, #a1a1a1); } [checked].sc-lmvz-toggle-h .track.sc-lmvz-toggle { border-color: var(--lmvz-semantic-color-border-active, #0f8acc); } input.sc-lmvz-toggle { position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; margin: 0; cursor: inherit; } .thumb.sc-lmvz-toggle { position: absolute; width: var(--lmvz-global-s13, 13px); height: var(--lmvz-global-s13, 13px); border-radius: 50%; background-color: var(--lmvz-semantic-color-on-surface-input-secondary, #545454); top: 50%; transform: translateY(-50%); left: var(--lmvz-global-s4, 4px); transition: left 0.2s ease, background-color 0.2s ease; pointer-events: none; } [checked].sc-lmvz-toggle-h .thumb.sc-lmvz-toggle { left: calc(var(--lmvz-global-s4, 4px) + var(--lmvz-global-s11, 11px)); background-color: var(--lmvz-semantic-color-status-on-active, #0e7ab4); } label.sc-lmvz-toggle { font: var(--lmvz-typography-body-md, 400 clamp(0.88rem, 0.84rem + 0.13vw, 1rem) / 1.5 Router); color: var(--lmvz-semantic-color-on-surface-primary, #000000); cursor: pointer; }`;
|
|
11
11
|
|
package/cjs/loader.cjs.js
CHANGED
|
@@ -6,7 +6,7 @@ var appGlobals = require('./app-globals-V2Kpy_OQ.js');
|
|
|
6
6
|
const defineCustomElements = async (win, options) => {
|
|
7
7
|
if (typeof window === 'undefined') return undefined;
|
|
8
8
|
await appGlobals.globalScripts();
|
|
9
|
-
return index.bootstrapLazy([["lmvz-modal.cjs",[[769,"lmvz-modal",{"open":[1540],"closeLabel":[1,"close-label"],"hasHeader":[32]},[[0,"submit","handleFormDialogSubmit"]],{"open":[{"handleOpenChange":0}]}]]],["lmvz-message.cjs",[[769,"lmvz-message",{"type":[513],"live":[1],"leadingIcon":[4,"leading-icon"],"dismissible":[4],"closeLabel":[1,"close-label"],"actionLabel":[1,"action-label"]}]]],["lmvz-snackbar.cjs",[[513,"lmvz-snackbar",{"status":[1537],"message":[1025],"duration":[1026],"priority":[1025],"actionLabel":[1025,"action-label"],"animationClass":[32],"show":[64],"hide":[64]},null,{"status":[{"onStatusChange":0}]}]]],["lmvz-link.cjs",[[785,"lmvz-link",{"href":[513],"target":[513],"rel":[1],"type":[1537],"externalLabel":[1,"external-label"]},null,{"type":[{"normalizeType":0}]}]]],["lmvz-header_2.cjs",[[769,"lmvz-header",{"role":[2561],"lmvzActiveNav":[1,"lmvz-active-nav"]},null,{"lmvzActiveNav":[{"handleActiveNavChange":0}]}],[774,"lmvz-menuitem",{"role":[2561],"ti":[2562,"tabindex"]}]]],["lmvz-action.cjs",[[257,"lmvz-action"]]],["lmvz-action-list.cjs",[[774,"lmvz-action-list",{"label":[1]}]]],["lmvz-card.cjs",[[774,"lmvz-card",{"cardTitle":[1,"card-title"],"imageUrl":[1,"image-url"],"description":[1],"primaryActionLabel":[1,"primary-action-label"]}]]],["lmvz-checkbox.cjs",[[578,"lmvz-checkbox",{"label":[1],"checked":[1540],"value":[1],"name":[1],"disabled":[516],"required":[516],"error":[516],"errorMessage":[1,"error-message"],"helperText":[1,"helper-text"],"form":[1],"autofocus":[4],"checkedState":[32],"focusInput":[64],"checkValidity":[64],"reportValidity":[64]},null,{"checked":[{"handleCheckedChange":0}]}]]],["lmvz-chip.cjs",[[769,"lmvz-chip",{"type":[1537],"size":[1537]},null,{"type":[{"normalizeType":0}],"size":[{"normalizeSize":0}]}]]],["lmvz-input.cjs",[[838,"lmvz-input",{"value":[1025],"label":[1],"helperText":[1,"helper-text"],"placeholder":[1],"disabled":[516],"readonly":[516],"required":[516],"name":[1],"type":[1],"errorMessage":[1,"error-message"],"autocomplete":[1],"inputmode":[1],"autocorrect":[1],"autocapitalize":[1],"spellcheck":[4],"autofocus":[4],"minlength":[2],"maxlength":[2],"pattern":[1],"min":[8],"max":[8],"step":[8],"form":[1],"size":[513],"error":[6660],"nativeError":[32],"setValue":[64],"focusInput":[64],"blurInput":[64],"select":[64],"checkValidity":[64],"reportValidity":[64],"getInputElement":[64]},null,{"value":[{"handleValueChange":0}],"disabled":[{"handleDisabledChange":0}]}]]],["lmvz-menuitem.cjs",[[774,"lmvz-menuitem",{"role":[2561],"ti":[2562,"tabindex"]}]]],["lmvz-popover.cjs",[[769,"lmvz-popover",{"open":[1540],"anchor":[1],"placement":[1],"size":[1],"autoFocus":[4,"auto-focus"],"label":[1],"show":[64],"hide":[64],"toggle":[64]},null,{"open":[{"handleOpenChange":0}],"anchor":[{"handleAnchorChange":
|
|
9
|
+
return index.bootstrapLazy([["lmvz-modal.cjs",[[769,"lmvz-modal",{"open":[1540],"closeLabel":[1,"close-label"],"hasHeader":[32]},[[0,"submit","handleFormDialogSubmit"]],{"open":[{"handleOpenChange":0}]}]]],["lmvz-message.cjs",[[769,"lmvz-message",{"type":[513],"live":[1],"leadingIcon":[4,"leading-icon"],"dismissible":[4],"closeLabel":[1,"close-label"],"actionLabel":[1,"action-label"]}]]],["lmvz-snackbar.cjs",[[513,"lmvz-snackbar",{"status":[1537],"message":[1025],"duration":[1026],"priority":[1025],"actionLabel":[1025,"action-label"],"animationClass":[32],"show":[64],"hide":[64]},null,{"status":[{"onStatusChange":0}]}]]],["lmvz-link.cjs",[[785,"lmvz-link",{"href":[513],"target":[513],"rel":[1],"type":[1537],"externalLabel":[1,"external-label"]},null,{"type":[{"normalizeType":0}]}]]],["lmvz-header_2.cjs",[[769,"lmvz-header",{"role":[2561],"lmvzActiveNav":[1,"lmvz-active-nav"],"initFocus":[64]},null,{"lmvzActiveNav":[{"handleActiveNavChange":0}]}],[774,"lmvz-menuitem",{"role":[2561],"ti":[2562,"tabindex"]}]]],["lmvz-action.cjs",[[257,"lmvz-action"]]],["lmvz-action-list.cjs",[[774,"lmvz-action-list",{"label":[1],"initFocus":[64]}]]],["lmvz-card.cjs",[[774,"lmvz-card",{"cardTitle":[1,"card-title"],"imageUrl":[1,"image-url"],"description":[1],"primaryActionLabel":[1,"primary-action-label"]}]]],["lmvz-checkbox.cjs",[[578,"lmvz-checkbox",{"label":[1],"checked":[1540],"value":[1],"name":[1],"disabled":[516],"required":[516],"error":[516],"errorMessage":[1,"error-message"],"helperText":[1,"helper-text"],"form":[1],"autofocus":[4],"checkedState":[32],"focusInput":[64],"checkValidity":[64],"reportValidity":[64]},null,{"checked":[{"handleCheckedChange":0}]}]]],["lmvz-chip.cjs",[[769,"lmvz-chip",{"type":[1537],"size":[1537]},null,{"type":[{"normalizeType":0}],"size":[{"normalizeSize":0}]}]]],["lmvz-input.cjs",[[838,"lmvz-input",{"value":[1025],"label":[1],"helperText":[1,"helper-text"],"placeholder":[1],"disabled":[516],"readonly":[516],"required":[516],"name":[1],"type":[1],"errorMessage":[1,"error-message"],"autocomplete":[1],"inputmode":[1],"autocorrect":[1],"autocapitalize":[1],"spellcheck":[4],"autofocus":[4],"minlength":[2],"maxlength":[2],"pattern":[1],"min":[8],"max":[8],"step":[8],"form":[1],"size":[513],"error":[6660],"nativeError":[32],"setValue":[64],"focusInput":[64],"blurInput":[64],"select":[64],"checkValidity":[64],"reportValidity":[64],"getInputElement":[64]},null,{"value":[{"handleValueChange":0}],"disabled":[{"handleDisabledChange":0}]}]]],["lmvz-menuitem.cjs",[[774,"lmvz-menuitem",{"role":[2561],"ti":[2562,"tabindex"]}]]],["lmvz-popover.cjs",[[769,"lmvz-popover",{"open":[1540],"anchor":[1],"placement":[1],"size":[1],"autoFocus":[4,"auto-focus"],"label":[1],"anchorEl":[32],"show":[64],"hide":[64],"toggle":[64]},null,{"open":[{"handleOpenChange":0}],"anchor":[{"handleAnchorChange":1}]}]]],["lmvz-radio.cjs",[[578,"lmvz-radio",{"label":[1],"checked":[1540],"value":[1],"name":[1],"disabled":[516],"required":[516],"error":[516],"helperText":[1,"helper-text"],"form":[513],"autofocus":[4],"focusInput":[64],"checkValidity":[64],"reportValidity":[64]},[[0,"keydown","handleKeydown"]],{"checked":[{"handleCheckedChange":0}],"value":[{"handleValueChange":0}],"label":[{"handleLabelChange":0}]}]]],["lmvz-select.cjs",[[774,"lmvz-select",{"value":[1025],"label":[1],"helperText":[1,"helper-text"],"disabled":[516],"required":[516],"name":[1],"size":[513],"highlighted":[516],"selectedLabel":[32]},null,{"value":[{"handleValueChange":0}]}]]],["lmvz-spinner.cjs",[[513,"lmvz-spinner",{"size":[513],"ariaLabel":[513,"aria-label"]}]]],["lmvz-tab.cjs",[[785,"lmvz-tab",{"value":[513],"disabled":[516],"selected":[516],"vertical":[516]}]]],["lmvz-tabs.cjs",[[769,"lmvz-tabs",{"value":[1537],"orientation":[1537],"resolvedValue":[32],"initFocus":[64],"activateTab":[64],"getTabElements":[64],"setTabPanelIds":[64]},null,{"value":[{"handleValueChange":0}],"orientation":[{"handleOrientationChange":0}]}]]],["lmvz-toggle.cjs",[[578,"lmvz-toggle",{"label":[1],"checked":[1540],"disabled":[516],"required":[516],"name":[1],"value":[1],"form":[1],"focusToggle":[64],"blurToggle":[64],"checkValidity":[64],"reportValidity":[64],"getInputElement":[64]},null,{"checked":[{"handleCheckedChange":0}],"disabled":[{"handleDisabledChange":0}]}]]],["lmvz-button-group.cjs",[[769,"lmvz-button-group",{"stacked":[516],"primaryEnabledAction":[2064],"hasActions":[2052,"has-actions"]}]]],["lmvz-button_2.cjs",[[785,"lmvz-button",{"ti":[514,"tabindex"],"scale":[513],"variant":[513],"disabled":[516],"type":[1],"form":[1],"formMethod":[1,"form-method"],"name":[1],"value":[1],"buttonRole":[1,"button-role"]}],[514,"lmvz-icon",{"icon":[513],"weight":[513],"size":[513],"iconset":[513],"ariaLabel":[513,"aria-label"],"iconData":[32],"visible":[32]},null,{"icon":[{"loadIconPathData":0}],"iconset":[{"loadIconPathData":0}]}]]]], options);
|
|
10
10
|
};
|
|
11
11
|
|
|
12
12
|
exports.setNonce = index.setNonce;
|
package/{esm/reactive-controller-host-FBuCCcFC.js → cjs/reactive-controller-host-Bc6B_T45.js}
RENAMED
|
@@ -1,3 +1,6 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
const META_BASE = '__LMVZ__';
|
|
1
4
|
class ReactiveControllerHost {
|
|
2
5
|
controllers = new Set();
|
|
3
6
|
addController(controller) {
|
|
@@ -37,5 +40,20 @@ class ReactiveControllerHost {
|
|
|
37
40
|
this.activeControllers.forEach((controller) => controller.hostDidUpdate?.());
|
|
38
41
|
}
|
|
39
42
|
}
|
|
43
|
+
function registerLmvzComponentMetaInfo(el, key, info) {
|
|
44
|
+
if (!el) {
|
|
45
|
+
console.warn('component is undefined');
|
|
46
|
+
return;
|
|
47
|
+
}
|
|
48
|
+
const cmp = el;
|
|
49
|
+
if (!cmp[META_BASE])
|
|
50
|
+
cmp[META_BASE] = {};
|
|
51
|
+
cmp[META_BASE][key] = info;
|
|
52
|
+
}
|
|
53
|
+
function getLmvzComponentMetaInfo(el, key) {
|
|
54
|
+
return el?.[META_BASE]?.[key];
|
|
55
|
+
}
|
|
40
56
|
|
|
41
|
-
|
|
57
|
+
exports.ReactiveControllerHost = ReactiveControllerHost;
|
|
58
|
+
exports.getLmvzComponentMetaInfo = getLmvzComponentMetaInfo;
|
|
59
|
+
exports.registerLmvzComponentMetaInfo = registerLmvzComponentMetaInfo;
|
|
@@ -5,7 +5,7 @@ export class LmvzAction {
|
|
|
5
5
|
this.actionClick.emit(event);
|
|
6
6
|
}
|
|
7
7
|
render() {
|
|
8
|
-
return (h(Host, { key: '
|
|
8
|
+
return (h(Host, { key: '4d83f95393704400034fef7313ac52bcc100be95', onClick: this._onClick.bind(this) }, h("slot", { key: 'ffbdeca0877eb9a76bc4ac1b8b77b37b60fdabd5' })));
|
|
9
9
|
}
|
|
10
10
|
static get is() { return "lmvz-action"; }
|
|
11
11
|
static get encapsulation() { return "shadow"; }
|
|
@@ -63,6 +63,7 @@ hr {
|
|
|
63
63
|
padding-block: var(--lmvz-button-padding-block);
|
|
64
64
|
padding-inline: var(--lmvz-button-padding-inline);
|
|
65
65
|
min-height: var(--lmvz-button-min-height);
|
|
66
|
+
min-width: var(--lmvz-button-min-height);
|
|
66
67
|
border-radius: var(--lmvz-button-radius);
|
|
67
68
|
border: var(--lmvz-button-border-width) solid var(--lmvz-button-border-color);
|
|
68
69
|
background-color: var(--lmvz-button-background);
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { Host, h } from "@stencil/core";
|
|
2
2
|
import { AriaValidationController } from "../../utils/aria/aria-validation-controller";
|
|
3
|
-
import { DirectionalFocusController } from "../../utils/aria/
|
|
3
|
+
import { DirectionalFocusController } from "../../utils/aria/directional-focus-controller";
|
|
4
4
|
import { isLmvzButton } from "../../utils/element/element.util";
|
|
5
5
|
import { ReactiveControllerHost } from "../../utils/stencil/reactive-controller-host";
|
|
6
6
|
export class LmvzActionList extends ReactiveControllerHost {
|
|
@@ -29,6 +29,9 @@ export class LmvzActionList extends ReactiveControllerHost {
|
|
|
29
29
|
this.handleSlotChange();
|
|
30
30
|
super.componentDidLoad();
|
|
31
31
|
}
|
|
32
|
+
async initFocus() {
|
|
33
|
+
this.focusController.initFocus();
|
|
34
|
+
}
|
|
32
35
|
handleSlotChange = () => {
|
|
33
36
|
const slot = this.slotEl;
|
|
34
37
|
if (!slot)
|
|
@@ -49,7 +52,7 @@ export class LmvzActionList extends ReactiveControllerHost {
|
|
|
49
52
|
};
|
|
50
53
|
render() {
|
|
51
54
|
const ariaLabel = this.label || undefined;
|
|
52
|
-
return (h(Host, { key: '
|
|
55
|
+
return (h(Host, { key: '9dee495856e733cb17f30d0d8588362a8dcb28ce', role: "menu", "aria-label": ariaLabel }, h("slot", { key: 'c6454dbbe63eed5be01f3247934245d1cc1ad6e2', onSlotchange: this.handleSlotChange, ref: (el) => (this.slotEl = el) })));
|
|
53
56
|
}
|
|
54
57
|
static get is() { return "lmvz-action-list"; }
|
|
55
58
|
static get encapsulation() { return "scoped"; }
|
|
@@ -86,6 +89,27 @@ export class LmvzActionList extends ReactiveControllerHost {
|
|
|
86
89
|
}
|
|
87
90
|
};
|
|
88
91
|
}
|
|
92
|
+
static get methods() {
|
|
93
|
+
return {
|
|
94
|
+
"initFocus": {
|
|
95
|
+
"complexType": {
|
|
96
|
+
"signature": "() => Promise<void>",
|
|
97
|
+
"parameters": [],
|
|
98
|
+
"references": {
|
|
99
|
+
"Promise": {
|
|
100
|
+
"location": "global",
|
|
101
|
+
"id": "global::Promise"
|
|
102
|
+
}
|
|
103
|
+
},
|
|
104
|
+
"return": "Promise<void>"
|
|
105
|
+
},
|
|
106
|
+
"docs": {
|
|
107
|
+
"text": "Programmatically set focus to the first managed element.",
|
|
108
|
+
"tags": []
|
|
109
|
+
}
|
|
110
|
+
}
|
|
111
|
+
};
|
|
112
|
+
}
|
|
89
113
|
static get elementRef() { return "el"; }
|
|
90
114
|
}
|
|
91
115
|
function collectInteractiveButtonsRecursively(el, collection) {
|
|
@@ -91,6 +91,7 @@ hr {
|
|
|
91
91
|
padding-block: var(--lmvz-button-padding-block);
|
|
92
92
|
padding-inline: var(--lmvz-button-padding-inline);
|
|
93
93
|
min-height: var(--lmvz-button-min-height);
|
|
94
|
+
min-width: var(--lmvz-button-min-height);
|
|
94
95
|
border-radius: var(--lmvz-button-radius);
|
|
95
96
|
border: var(--lmvz-button-border-width) solid var(--lmvz-button-border-color);
|
|
96
97
|
background-color: var(--lmvz-button-background);
|
|
@@ -29,7 +29,6 @@ export class LmvzButton extends ReactiveControllerHost {
|
|
|
29
29
|
this.addController(new AriaValidationController(this));
|
|
30
30
|
this.addController(new ElementActivationController(this, {
|
|
31
31
|
localHandler: this.handleClick.bind(this),
|
|
32
|
-
keys: ['Enter'],
|
|
33
32
|
}));
|
|
34
33
|
}
|
|
35
34
|
connectedCallback() {
|
|
@@ -90,7 +89,7 @@ export class LmvzButton extends ReactiveControllerHost {
|
|
|
90
89
|
};
|
|
91
90
|
render() {
|
|
92
91
|
this.renderHiddenButton();
|
|
93
|
-
return (h(Host, { key: '
|
|
92
|
+
return (h(Host, { key: 'eb0ee982f50f1e41b2aa72a0598d739b972cbcdf', role: "presentation" }, h("button", { key: 'aed6f44f51222e31d5f1deec952c0d81b8f1200a', ref: (e) => (this.validationEl = e), part: "button", role: this.buttonRole, disabled: this.disabled, type: this.type, class: classNames(this.variant ?? 'secondary', { [this.scale ?? '']: !!this.scale, disabled: this.disabled }), ...this.inheritedAttributes }, h("slot", { key: '2aaedfde3c0d6ebf426f20a8489b22c2a356767e' }))));
|
|
94
93
|
}
|
|
95
94
|
static get is() { return "lmvz-button"; }
|
|
96
95
|
static get encapsulation() { return "shadow"; }
|
|
@@ -92,6 +92,7 @@ hr {
|
|
|
92
92
|
padding-block: var(--lmvz-button-padding-block);
|
|
93
93
|
padding-inline: var(--lmvz-button-padding-inline);
|
|
94
94
|
min-height: var(--lmvz-button-min-height);
|
|
95
|
+
min-width: var(--lmvz-button-min-height);
|
|
95
96
|
border-radius: var(--lmvz-button-radius);
|
|
96
97
|
border: var(--lmvz-button-border-width) solid var(--lmvz-button-border-color);
|
|
97
98
|
background-color: var(--lmvz-button-background);
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { h, Host } from "@stencil/core";
|
|
2
2
|
import { AriaValidationController } from "../../utils/aria/aria-validation-controller";
|
|
3
|
-
import { DirectionalFocusController } from "../../utils/aria/
|
|
3
|
+
import { DirectionalFocusController } from "../../utils/aria/directional-focus-controller";
|
|
4
4
|
import { ReactiveControllerHost } from "../../utils/stencil/reactive-controller-host";
|
|
5
5
|
import logo from "../../assets/icons/Logo.svg";
|
|
6
6
|
export class LmvzHeader extends ReactiveControllerHost {
|
|
@@ -33,6 +33,9 @@ export class LmvzHeader extends ReactiveControllerHost {
|
|
|
33
33
|
handleActiveNavChange() {
|
|
34
34
|
this.updateElementsActive();
|
|
35
35
|
}
|
|
36
|
+
async initFocus() {
|
|
37
|
+
this.keyboardNavigationController.initFocus();
|
|
38
|
+
}
|
|
36
39
|
componentDidLoad() {
|
|
37
40
|
this.primarySlot?.addEventListener('slotchange', this.handlePrimaryNavItemsChange.bind(this));
|
|
38
41
|
this.handlePrimaryNavItemsChange();
|
|
@@ -84,7 +87,7 @@ export class LmvzHeader extends ReactiveControllerHost {
|
|
|
84
87
|
}
|
|
85
88
|
}
|
|
86
89
|
render() {
|
|
87
|
-
return (h(Host, { key: '
|
|
90
|
+
return (h(Host, { key: 'ce4b8cf9f7687e4af97d45908e2f0e484b90684f', onFocus: this.delegateFocus.bind(this) }, h("div", { key: 'a2213d8038d126e47262c4ec18071dd4302152db', class: "brand" }, h("slot", { key: '68a0a1e2b21859d78d2f9a7d3f5c86020c52c225', name: "brand" }, h("img", { key: 'd0a878bc4c9f7a3460e857fb5aa52f1d942a0423', id: "fallback-logo-lmvz", src: logo, alt: "Lehrmittelverlag Z\u00FCrich" }))), h("nav", { key: '687791624d6ced477bc0cce73ce97b26c7d03af0', "aria-label": "Hauptnavigation" }, h("div", { key: 'a9e8fa4a57e619a3d3b1056bfc0d5df74e89f630', role: "menubar", class: "primary-menubar" }, h("slot", { key: 'f75f0a3bed2267aff902490f1905c67ad1b7e6be', name: "nav-primary", ref: (el) => (this.primarySlot = el) }), h("div", { key: '3cf2d099bed99e4ba7b32a2f3171c69663785012', role: "menu", id: "nav-secondary", class: "secondary-menubar", hidden: !this.lmvzActiveNav, ref: (el) => (this.secondaryNav = el) }, h("slot", { key: '85dbe77ea8ab62aa400640495e11e2d174ca5210', name: this.secondarySlotName, ref: (el) => (this.secondarySlot = el) })))), h("div", { key: 'cf5d135a5b969af6a2bbb5432a10f8e1b9af1dca', class: "actions" }, h("slot", { key: '1a0323668942151c071a24238039c7a216358363', name: "actions" }))));
|
|
88
91
|
}
|
|
89
92
|
static get is() { return "lmvz-header"; }
|
|
90
93
|
static get encapsulation() { return "shadow"; }
|
|
@@ -141,6 +144,27 @@ export class LmvzHeader extends ReactiveControllerHost {
|
|
|
141
144
|
}
|
|
142
145
|
};
|
|
143
146
|
}
|
|
147
|
+
static get methods() {
|
|
148
|
+
return {
|
|
149
|
+
"initFocus": {
|
|
150
|
+
"complexType": {
|
|
151
|
+
"signature": "() => Promise<void>",
|
|
152
|
+
"parameters": [],
|
|
153
|
+
"references": {
|
|
154
|
+
"Promise": {
|
|
155
|
+
"location": "global",
|
|
156
|
+
"id": "global::Promise"
|
|
157
|
+
}
|
|
158
|
+
},
|
|
159
|
+
"return": "Promise<void>"
|
|
160
|
+
},
|
|
161
|
+
"docs": {
|
|
162
|
+
"text": "Programmatically set focus to the first managed element.",
|
|
163
|
+
"tags": []
|
|
164
|
+
}
|
|
165
|
+
}
|
|
166
|
+
};
|
|
167
|
+
}
|
|
144
168
|
static get elementRef() { return "el"; }
|
|
145
169
|
static get watchers() {
|
|
146
170
|
return [{
|
|
@@ -193,5 +193,6 @@ div:empty {
|
|
|
193
193
|
}
|
|
194
194
|
::slotted(lmvz-button) {
|
|
195
195
|
/* Minimize padding for (icon) buttons due to height constraints */
|
|
196
|
-
--lmvz-button-padding:
|
|
196
|
+
--lmvz-button-padding: var(--lmvz-dimension-6-4, clamp(0.25rem, 0.22rem + 0.13vw, 0.38rem));
|
|
197
|
+
--lmvz-button-min-height-override: var(--lmvz-component-input-size-sm, clamp(2rem, 1.94rem + 0.26vw, 2.25rem));
|
|
197
198
|
}
|