@lmvz-ds/components 0.38.0 → 0.39.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 +11 -0
- package/README.md +12 -20
- package/cjs/{directional-focus-controller-8Xd_7MHT.js → directional-focus-controller-DDnhfX5w.js} +15 -5
- package/cjs/index.cjs.js +3 -195
- package/cjs/lmvz-action-list.cjs.entry.js +2 -2
- package/cjs/lmvz-button-group.cjs.entry.js +4 -0
- package/cjs/lmvz-button_2.cjs.entry.js +1 -1
- package/cjs/lmvz-card.cjs.entry.js +1 -1
- package/cjs/lmvz-components.cjs.js +1 -1
- package/cjs/lmvz-header_2.cjs.entry.js +3 -3
- package/cjs/lmvz-message.cjs.entry.js +2 -0
- package/cjs/lmvz-popover.cjs.entry.js +1 -1
- package/cjs/lmvz-select.cjs.entry.js +2 -3
- package/cjs/lmvz-tabs.cjs.entry.js +8 -2
- package/cjs/loader.cjs.js +1 -1
- package/cjs/public-DTgpEs1_.js +206 -0
- package/collection/components/lmvz-action-list/lmvz-action-list.css +119 -116
- package/collection/components/lmvz-button/lmvz-button.css +109 -106
- package/collection/components/lmvz-card/lmvz-card.css +106 -103
- package/collection/components/lmvz-header/lmvz-header.js +2 -2
- package/collection/components/lmvz-select/lmvz-select.css +58 -43
- package/collection/components/lmvz-select/lmvz-select.js +1 -25
- package/collection/components/lmvz-snackbar/public.js +3 -0
- package/collection/components/lmvz-tabs/lmvz-tabs.js +7 -1
- package/collection/utils/aria/directional-focus-controller.js +16 -7
- package/collection/utils/icons/public.js +3 -0
- package/components/index.js +1 -1
- package/components/lmvz-action-list.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-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-select.js +1 -1
- package/components/lmvz-snackbar.js +1 -1
- package/components/lmvz-tabs.js +1 -1
- package/components/{p-CcP_sfo8.js → p--mU29mrX.js} +1 -1
- package/components/p-BPa0FHVO.js +1 -0
- package/components/{p-SnHLBAbf.js → p-Bc5MM0zh.js} +1 -1
- package/components/p-CyDgnpOB.js +1 -0
- package/components/{p-C-pRMuMh.js → p-DIyiticz.js} +1 -1
- package/components/{p-BhALzK62.js → p-DJLdOjL4.js} +1 -1
- package/components/{p-B6bUOPCG.js → p-DSDBThqb.js} +1 -1
- package/components/p-DXhP6UeF.js +1 -0
- package/components/p-DsTgD0_a.js +1 -0
- package/components/p-DyQ1GbaN.js +1 -0
- package/components/p-niXjuPxe.js +1 -0
- package/esm/{directional-focus-controller-QukTTWBE.js → directional-focus-controller-CJ0yNC00.js} +15 -5
- package/esm/index.js +1 -197
- package/esm/lmvz-action-list.entry.js +2 -2
- package/esm/lmvz-button-group.entry.js +4 -0
- package/esm/lmvz-button_2.entry.js +1 -1
- package/esm/lmvz-card.entry.js +1 -1
- package/esm/lmvz-components.js +1 -1
- package/esm/lmvz-header_2.entry.js +3 -3
- package/esm/lmvz-message.entry.js +2 -0
- package/esm/lmvz-popover.entry.js +1 -1
- package/esm/lmvz-select.entry.js +2 -3
- package/esm/lmvz-tabs.entry.js +8 -2
- package/esm/loader.js +1 -1
- package/esm/public-m6pRVUeP.js +204 -0
- package/hydrate/index.js +238 -16
- package/hydrate/index.mjs +238 -16
- package/lmvz-components/index.esm.js +1 -1
- package/lmvz-components/lmvz-components.esm.js +1 -1
- package/lmvz-components/p-1ba1af8d.entry.js +1 -0
- package/lmvz-components/p-304c7554.entry.js +1 -0
- package/lmvz-components/p-316dd61a.entry.js +1 -0
- package/lmvz-components/{p-1e1dea53.entry.js → p-41286514.entry.js} +1 -1
- package/lmvz-components/p-93b781ca.entry.js +1 -0
- package/lmvz-components/p-BPa0FHVO.js +1 -0
- package/lmvz-components/p-BlkpdeQI.js +1 -0
- package/lmvz-components/p-c884c76e.entry.js +1 -0
- package/lmvz-components/p-ebad823c.entry.js +1 -0
- package/lmvz-components/p-edec4d09.entry.js +1 -0
- package/lmvz-components/p-f911691c.entry.js +1 -0
- package/manifest.json +2 -31
- package/package.json +2 -1
- package/types/components/lmvz-select/lmvz-select.d.ts +0 -1
- package/types/components/lmvz-snackbar/public.d.ts +6 -0
- package/types/components/lmvz-tabs/lmvz-tabs.d.ts +1 -0
- package/types/components.d.ts +0 -11
- package/types/index.d.ts +5 -0
- package/types/utils/aria/directional-focus-controller.d.ts +9 -7
- package/types/utils/icons/public.d.ts +6 -0
- package/components/p-CgGqXTxQ.js +0 -1
- package/components/p-D3wobLRi.js +0 -1
- package/components/p-DfFdoFeH.js +0 -1
- package/components/p-GJaYKpHS.js +0 -1
- package/lmvz-components/p-3fc6c3f6.entry.js +0 -1
- package/lmvz-components/p-9813a7d2.entry.js +0 -1
- package/lmvz-components/p-CHxiS3ja.js +0 -1
- package/lmvz-components/p-b5a5eb9a.entry.js +0 -1
- package/lmvz-components/p-cadd88e5.entry.js +0 -1
- package/lmvz-components/p-cebaddb0.entry.js +0 -1
- package/lmvz-components/p-d53e69de.entry.js +0 -1
- package/lmvz-components/p-db75e362.entry.js +0 -1
- package/lmvz-components/p-eb741e1f.entry.js +0 -1
package/esm/lmvz-tabs.entry.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { g as getElement, r as registerInstance, c as createEvent, h, H as Host } from './index-DVab4vzV.js';
|
|
2
|
-
import { D as DirectionalFocusController } from './directional-focus-controller-
|
|
2
|
+
import { D as DirectionalFocusController } from './directional-focus-controller-CJ0yNC00.js';
|
|
3
3
|
import { R as ReactiveControllerHost } from './reactive-controller-host-CICeIanv.js';
|
|
4
4
|
import './element.util-3ydVsxUW.js';
|
|
5
5
|
import './aria.constants-DIyiticz.js';
|
|
@@ -12,10 +12,12 @@ const LmvzTabs = class extends ReactiveControllerHost {
|
|
|
12
12
|
instanceId = ++tabsIdCounter;
|
|
13
13
|
tabSlotEl;
|
|
14
14
|
panelSlotEl;
|
|
15
|
+
tablistEl;
|
|
15
16
|
focusController = new DirectionalFocusController(this, {
|
|
16
17
|
orientation: 'horizontal',
|
|
17
18
|
manageTabIndex: true,
|
|
18
19
|
enableHomeAndEnd: true,
|
|
20
|
+
listenerTarget: this.tablistEl,
|
|
19
21
|
});
|
|
20
22
|
value;
|
|
21
23
|
orientation = 'horizontal';
|
|
@@ -36,6 +38,9 @@ const LmvzTabs = class extends ReactiveControllerHost {
|
|
|
36
38
|
this.panelSlotEl?.addEventListener('slotchange', this.handlePanelSlotChange);
|
|
37
39
|
this.el.addEventListener('lmvzTabReady', this.handleTabReady);
|
|
38
40
|
this.handleTabSlotChange();
|
|
41
|
+
if (this.tablistEl) {
|
|
42
|
+
this.focusController.updateListenerTarget(this.tablistEl);
|
|
43
|
+
}
|
|
39
44
|
super.componentDidLoad();
|
|
40
45
|
}
|
|
41
46
|
disconnectedCallback() {
|
|
@@ -120,6 +125,7 @@ const LmvzTabs = class extends ReactiveControllerHost {
|
|
|
120
125
|
orientation: this.orientation,
|
|
121
126
|
manageTabIndex: true,
|
|
122
127
|
enableHomeAndEnd: true,
|
|
128
|
+
listenerTarget: this.tablistEl,
|
|
123
129
|
});
|
|
124
130
|
this.addController(this.focusController);
|
|
125
131
|
if (this.el.isConnected) {
|
|
@@ -242,7 +248,7 @@ const LmvzTabs = class extends ReactiveControllerHost {
|
|
|
242
248
|
this.selectTab(value);
|
|
243
249
|
};
|
|
244
250
|
render() {
|
|
245
|
-
return (h(Host, { key: '
|
|
251
|
+
return (h(Host, { key: 'be4fe04b1374a2793d3b1e9a658a449474efdd03', onClick: this.handleTabClick, onKeydown: this.handleKeydown }, h("div", { key: 'd91015eddf16dfad5d49e942eb86e9f568978f34', role: "tablist", "aria-orientation": this.orientation, class: "tablist", ref: (el) => (this.tablistEl = el) }, h("slot", { key: 'be0990a7c668bc96a67c01561e3142ec028dabd0', ref: (el) => (this.tabSlotEl = el) })), h("div", { key: '338323738dfdbb436d86cdb4f6041a67c1af433d', part: "panels-container", class: "panels-container" }, h("slot", { key: 'd225be099c8cb902776ce0a7dbf7dcb2aef2d03b', name: "panels", ref: (el) => (this.panelSlotEl = el) }))));
|
|
246
252
|
}
|
|
247
253
|
static get watchers() { return {
|
|
248
254
|
"value": [{
|
package/esm/loader.js
CHANGED
|
@@ -5,7 +5,7 @@ import { g as globalScripts } from './app-globals-DQuL1Twl.js';
|
|
|
5
5
|
const defineCustomElements = async (win, options) => {
|
|
6
6
|
if (typeof window === 'undefined') return undefined;
|
|
7
7
|
await globalScripts();
|
|
8
|
-
return bootstrapLazy([["lmvz-datepicker",[[593,"lmvz-datepicker",{"value":[6145],"visibleMonth":[6145,"visible-month"],"min":[1],"max":[1],"locale":[1],"firstDayOfWeek":[2,"first-day-of-week"],"disabled":[516],"readonly":[516],"required":[516],"name":[513],"label":[1],"placeholder":[1],"helperText":[1,"helper-text"],"errorMessage":[1,"error-message"],"open":[1540],"displayFormat":[1,"display-format"],"focusedDate":[32],"valueDate":[32],"visibleMonthDate":[32],"inputText":[32],"hasUnparseableInput":[32],"isInvalid":[32],"nativeError":[32],"checkValidity":[64],"reportValidity":[64]},[[0,"keydown","handleKeydown"],[0,"focusin","handleInputFocus"],[0,"click","handleInputFocus"],[0,"invalid","handleInvalid"]],{"required":[{"handleValidityRelevantPropChange":0}],"min":[{"handleValidityRelevantPropChange":0}],"max":[{"handleValidityRelevantPropChange":0}],"locale":[{"handleDisplayFormatChange":0}],"displayFormat":[{"handleDisplayFormatChange":0}],"disabled":[{"handleDisabledChange":0}]}]]],["lmvz-modal",[[769,"lmvz-modal",{"open":[1540],"closeLabel":[1,"close-label"],"hasHeader":[32]},[[0,"submit","handleFormDialogSubmit"]],{"open":[{"handleOpenChange":0}]}]]],["lmvz-message",[[769,"lmvz-message",{"type":[513],"live":[1],"leadingIcon":[4,"leading-icon"],"dismissible":[4],"closeLabel":[1,"close-label"],"actionLabel":[1,"action-label"]}]]],["lmvz-select",[[838,"lmvz-select",{"value":[1025],"multiple":[516],"values":[1040],"label":[1],"helperText":[1,"helper-text"],"error":[6660],"errorMessage":[1,"error-message"],"disabled":[516],"required":[516],"name":[513],"size":[513],"
|
|
8
|
+
return bootstrapLazy([["lmvz-datepicker",[[593,"lmvz-datepicker",{"value":[6145],"visibleMonth":[6145,"visible-month"],"min":[1],"max":[1],"locale":[1],"firstDayOfWeek":[2,"first-day-of-week"],"disabled":[516],"readonly":[516],"required":[516],"name":[513],"label":[1],"placeholder":[1],"helperText":[1,"helper-text"],"errorMessage":[1,"error-message"],"open":[1540],"displayFormat":[1,"display-format"],"focusedDate":[32],"valueDate":[32],"visibleMonthDate":[32],"inputText":[32],"hasUnparseableInput":[32],"isInvalid":[32],"nativeError":[32],"checkValidity":[64],"reportValidity":[64]},[[0,"keydown","handleKeydown"],[0,"focusin","handleInputFocus"],[0,"click","handleInputFocus"],[0,"invalid","handleInvalid"]],{"required":[{"handleValidityRelevantPropChange":0}],"min":[{"handleValidityRelevantPropChange":0}],"max":[{"handleValidityRelevantPropChange":0}],"locale":[{"handleDisplayFormatChange":0}],"displayFormat":[{"handleDisplayFormatChange":0}],"disabled":[{"handleDisabledChange":0}]}]]],["lmvz-modal",[[769,"lmvz-modal",{"open":[1540],"closeLabel":[1,"close-label"],"hasHeader":[32]},[[0,"submit","handleFormDialogSubmit"]],{"open":[{"handleOpenChange":0}]}]]],["lmvz-message",[[769,"lmvz-message",{"type":[513],"live":[1],"leadingIcon":[4,"leading-icon"],"dismissible":[4],"closeLabel":[1,"close-label"],"actionLabel":[1,"action-label"]}]]],["lmvz-select",[[838,"lmvz-select",{"value":[1025],"multiple":[516],"values":[1040],"label":[1],"helperText":[1,"helper-text"],"error":[6660],"errorMessage":[1,"error-message"],"disabled":[516],"required":[516],"name":[513],"size":[513],"nativeError":[32],"selectedLabel":[32],"selectedId":[32],"activeId":[32],"isOpen":[32],"optionGroups":[32],"focusTrigger":[64],"blurTrigger":[64],"checkValidity":[64],"reportValidity":[64],"getValidationMessage":[64]},[[0,"invalid","handleInvalid"]],{"value":[{"handleValueChange":0}],"values":[{"handleValuesChange":0}],"required":[{"handleRequiredChange":0}],"disabled":[{"handleDisabledChange":0}]}]]],["lmvz-snackbar",[[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",[[785,"lmvz-link",{"href":[513],"target":[513],"rel":[1],"type":[1537],"externalLabel":[1,"external-label"]},null,{"type":[{"normalizeType":0}]}]]],["lmvz-header_2",[[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",[[257,"lmvz-action"]]],["lmvz-action-list",[[774,"lmvz-action-list",{"label":[1],"initFocus":[64]}]]],["lmvz-card",[[774,"lmvz-card",{"cardTitle":[1,"card-title"],"imageUrl":[1,"image-url"],"description":[1],"primaryActionLabel":[1,"primary-action-label"]}]]],["lmvz-checkbox",[[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}]}]]],["lmvz-menuitem",[[774,"lmvz-menuitem",{"role":[2561],"ti":[2562,"tabindex"]}]]],["lmvz-radio",[[578,"lmvz-radio",{"label":[1],"checked":[1540],"value":[1],"name":[513],"disabled":[516],"required":[516],"error":[6660],"helperText":[1,"helper-text"],"form":[513],"autofocus":[4],"nativeError":[32],"focusInput":[64],"checkValidity":[64],"reportValidity":[64],"getValidationMessage":[64]},[[0,"invalid","handleInvalid"],[0,"keydown","handleKeydown"]],{"checked":[{"handleCheckedChange":0}],"required":[{"handleRequiredChange":0}],"value":[{"handleValueChange":0}],"label":[{"handleLabelChange":0}]}]]],["lmvz-spinner",[[513,"lmvz-spinner",{"size":[513],"ariaLabel":[513,"aria-label"]}]]],["lmvz-tab",[[785,"lmvz-tab",{"value":[513],"disabled":[516],"selected":[516],"vertical":[516]}]]],["lmvz-tabs",[[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",[[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],"getValidationMessage":[64],"getInputElement":[64]},null,{"checked":[{"handleCheckedChange":0}],"disabled":[{"handleDisabledChange":0}]}]]],["lmvz-button-group",[[769,"lmvz-button-group",{"stacked":[516],"primaryEnabledAction":[2064],"hasActions":[2052,"has-actions"]}]]],["lmvz-chip",[[769,"lmvz-chip",{"type":[1537],"size":[1537]},null,{"type":[{"normalizeType":0}],"size":[{"normalizeSize":0}]}]]],["lmvz-input",[[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],"getValidationMessage":[64],"getInputElement":[64]},null,{"value":[{"handleValueChange":0}],"disabled":[{"handleDisabledChange":0}]}]]],["lmvz-popover",[[769,"lmvz-popover",{"open":[1540],"anchor":[1],"placement":[1],"size":[1],"autoFocus":[4,"auto-focus"],"containerRole":[1,"container-role"],"label":[1],"anchorEl":[32],"show":[64],"hide":[64],"toggle":[64]},null,{"open":[{"handleOpenChange":0}],"anchor":[{"handleAnchorChange":1}]}]]],["lmvz-button_2",[[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);
|
|
9
9
|
};
|
|
10
10
|
|
|
11
11
|
export { defineCustomElements };
|
|
@@ -0,0 +1,204 @@
|
|
|
1
|
+
import { t as typedIconFromSet } from './icons-DQOFaux5.js';
|
|
2
|
+
|
|
3
|
+
const PRIORITY_MAP = {
|
|
4
|
+
low: 0,
|
|
5
|
+
normal: 1,
|
|
6
|
+
high: 2,
|
|
7
|
+
};
|
|
8
|
+
const STATUS_DURATION = {
|
|
9
|
+
success: 5000,
|
|
10
|
+
warning: 5000,
|
|
11
|
+
error: 8000,
|
|
12
|
+
};
|
|
13
|
+
let idCounter = 0;
|
|
14
|
+
function nextId() {
|
|
15
|
+
idCounter += 1;
|
|
16
|
+
return `snackbar-${idCounter}`;
|
|
17
|
+
}
|
|
18
|
+
function resolveHostElement() {
|
|
19
|
+
if (typeof document === 'undefined') {
|
|
20
|
+
return undefined;
|
|
21
|
+
}
|
|
22
|
+
const existing = document.querySelector('[data-snackbar-host]');
|
|
23
|
+
if (existing) {
|
|
24
|
+
return existing;
|
|
25
|
+
}
|
|
26
|
+
const el = document.createElement('lmvz-snackbar');
|
|
27
|
+
el.setAttribute('data-snackbar-host', '');
|
|
28
|
+
document.body.appendChild(el);
|
|
29
|
+
return el;
|
|
30
|
+
}
|
|
31
|
+
class SnackbarController {
|
|
32
|
+
hostEl = undefined;
|
|
33
|
+
active = undefined;
|
|
34
|
+
getHost() {
|
|
35
|
+
if (this.hostEl !== undefined && !this.hostEl.isConnected) {
|
|
36
|
+
this.hostEl = undefined;
|
|
37
|
+
}
|
|
38
|
+
if (this.hostEl === undefined) {
|
|
39
|
+
this.hostEl = resolveHostElement();
|
|
40
|
+
}
|
|
41
|
+
return this.hostEl;
|
|
42
|
+
}
|
|
43
|
+
clearTimer(entry) {
|
|
44
|
+
if (entry.timerId !== undefined) {
|
|
45
|
+
clearTimeout(entry.timerId);
|
|
46
|
+
entry.timerId = undefined;
|
|
47
|
+
}
|
|
48
|
+
}
|
|
49
|
+
scheduleTimer(entry, delayMs) {
|
|
50
|
+
if (delayMs <= 0) {
|
|
51
|
+
return;
|
|
52
|
+
}
|
|
53
|
+
entry.timerStartedAt = Date.now();
|
|
54
|
+
entry.timerId = setTimeout(() => {
|
|
55
|
+
if (this.active !== undefined && this.active.id === entry.id) {
|
|
56
|
+
this.dismissActive(entry, 'timeout');
|
|
57
|
+
}
|
|
58
|
+
}, delayMs);
|
|
59
|
+
}
|
|
60
|
+
dismissActive(entry, reason) {
|
|
61
|
+
this.clearTimer(entry);
|
|
62
|
+
const host = entry.hostEl;
|
|
63
|
+
host.removeEventListener('pointerenter', entry.onPointerEnter);
|
|
64
|
+
host.removeEventListener('pointerleave', entry.onPointerLeave);
|
|
65
|
+
host.removeEventListener('focusin', entry.onFocusIn);
|
|
66
|
+
host.removeEventListener('focusout', entry.onFocusOut);
|
|
67
|
+
if (entry.onActionListener) {
|
|
68
|
+
host.removeEventListener('lmvzAction', entry.onActionListener);
|
|
69
|
+
}
|
|
70
|
+
host.hide?.();
|
|
71
|
+
if (this.active?.id === entry.id) {
|
|
72
|
+
this.active = undefined;
|
|
73
|
+
}
|
|
74
|
+
if (reason !== 'action') {
|
|
75
|
+
host.dispatchEvent(new CustomEvent('lmvzClose', { detail: { reason }, bubbles: true, composed: true }));
|
|
76
|
+
}
|
|
77
|
+
entry.resolve({ reason });
|
|
78
|
+
}
|
|
79
|
+
pauseTimer(entry) {
|
|
80
|
+
entry.pauseCount += 1;
|
|
81
|
+
if (entry.pauseCount > 1 || entry.timerId === undefined) {
|
|
82
|
+
return;
|
|
83
|
+
}
|
|
84
|
+
const elapsed = entry.timerStartedAt !== undefined ? Date.now() - entry.timerStartedAt : 0;
|
|
85
|
+
entry.remaining = Math.max(0, entry.remaining - elapsed);
|
|
86
|
+
entry.timerStartedAt = undefined;
|
|
87
|
+
this.clearTimer(entry);
|
|
88
|
+
}
|
|
89
|
+
resumeTimer(entry) {
|
|
90
|
+
if (entry.pauseCount > 0) {
|
|
91
|
+
entry.pauseCount -= 1;
|
|
92
|
+
}
|
|
93
|
+
if (entry.pauseCount > 0) {
|
|
94
|
+
return;
|
|
95
|
+
}
|
|
96
|
+
if (entry.remaining > 0) {
|
|
97
|
+
this.scheduleTimer(entry, entry.remaining);
|
|
98
|
+
}
|
|
99
|
+
}
|
|
100
|
+
applyToHost(host, options) {
|
|
101
|
+
host.setAttribute('status', options.status ?? 'success');
|
|
102
|
+
if (options.actionLabel !== undefined) {
|
|
103
|
+
host.setAttribute('action-label', options.actionLabel);
|
|
104
|
+
}
|
|
105
|
+
else {
|
|
106
|
+
host.removeAttribute('action-label');
|
|
107
|
+
}
|
|
108
|
+
}
|
|
109
|
+
open(options) {
|
|
110
|
+
const incomingPriority = PRIORITY_MAP[options.priority ?? 'normal'];
|
|
111
|
+
if (this.active !== undefined && incomingPriority < this.active.priority) {
|
|
112
|
+
let swallowResolve;
|
|
113
|
+
const closed = new Promise((resolve) => {
|
|
114
|
+
swallowResolve = resolve;
|
|
115
|
+
});
|
|
116
|
+
swallowResolve({ reason: 'swallowed' });
|
|
117
|
+
const id = nextId();
|
|
118
|
+
return {
|
|
119
|
+
id,
|
|
120
|
+
closed,
|
|
121
|
+
dismiss() {
|
|
122
|
+
},
|
|
123
|
+
};
|
|
124
|
+
}
|
|
125
|
+
if (this.active !== undefined) {
|
|
126
|
+
this.dismissActive(this.active, 'overridden');
|
|
127
|
+
}
|
|
128
|
+
const host = this.getHost();
|
|
129
|
+
if (host === undefined) {
|
|
130
|
+
const id = nextId();
|
|
131
|
+
let ssrResolve;
|
|
132
|
+
const closed = new Promise((resolve) => {
|
|
133
|
+
ssrResolve = resolve;
|
|
134
|
+
});
|
|
135
|
+
ssrResolve({ reason: 'swallowed' });
|
|
136
|
+
return { id, closed, dismiss() { } };
|
|
137
|
+
}
|
|
138
|
+
const id = nextId();
|
|
139
|
+
const status = options.status ?? 'success';
|
|
140
|
+
const durationMs = options.duration === 0 ? 0 : (options.duration ?? STATUS_DURATION[status]);
|
|
141
|
+
let entryResolve;
|
|
142
|
+
const closed = new Promise((resolve) => {
|
|
143
|
+
entryResolve = resolve;
|
|
144
|
+
});
|
|
145
|
+
const entry = {
|
|
146
|
+
id,
|
|
147
|
+
priority: incomingPriority,
|
|
148
|
+
resolve: entryResolve,
|
|
149
|
+
timerId: undefined,
|
|
150
|
+
remaining: durationMs,
|
|
151
|
+
timerStartedAt: undefined,
|
|
152
|
+
pauseCount: 0,
|
|
153
|
+
hostEl: host,
|
|
154
|
+
onPointerEnter: () => this.pauseTimer(entry),
|
|
155
|
+
onPointerLeave: () => this.resumeTimer(entry),
|
|
156
|
+
onFocusIn: () => this.pauseTimer(entry),
|
|
157
|
+
onFocusOut: () => this.resumeTimer(entry),
|
|
158
|
+
};
|
|
159
|
+
this.active = entry;
|
|
160
|
+
host.addEventListener('pointerenter', entry.onPointerEnter);
|
|
161
|
+
host.addEventListener('pointerleave', entry.onPointerLeave);
|
|
162
|
+
host.addEventListener('focusin', entry.onFocusIn);
|
|
163
|
+
host.addEventListener('focusout', entry.onFocusOut);
|
|
164
|
+
this.applyToHost(host, options);
|
|
165
|
+
const onAction = () => {
|
|
166
|
+
if (this.active !== undefined && this.active.id === id) {
|
|
167
|
+
options.onAction?.();
|
|
168
|
+
this.dismissActive(entry, 'action');
|
|
169
|
+
}
|
|
170
|
+
};
|
|
171
|
+
entry.onActionListener = onAction;
|
|
172
|
+
host.addEventListener('lmvzAction', onAction, { once: true });
|
|
173
|
+
host.show?.();
|
|
174
|
+
queueMicrotask(() => host.setAttribute('message', options.message));
|
|
175
|
+
if (durationMs > 0) {
|
|
176
|
+
this.scheduleTimer(entry, durationMs);
|
|
177
|
+
}
|
|
178
|
+
return {
|
|
179
|
+
id,
|
|
180
|
+
closed,
|
|
181
|
+
dismiss: () => {
|
|
182
|
+
if (this.active?.id === id) {
|
|
183
|
+
this.dismissActive(entry, 'manual');
|
|
184
|
+
}
|
|
185
|
+
},
|
|
186
|
+
};
|
|
187
|
+
}
|
|
188
|
+
dismiss(id) {
|
|
189
|
+
if (!this.active) {
|
|
190
|
+
return;
|
|
191
|
+
}
|
|
192
|
+
if (!id || this.active.id === id) {
|
|
193
|
+
this.dismissActive(this.active, 'manual');
|
|
194
|
+
}
|
|
195
|
+
}
|
|
196
|
+
}
|
|
197
|
+
|
|
198
|
+
window.LmvzApi ??= {};
|
|
199
|
+
window.LmvzApi.SnackbarController = SnackbarController;
|
|
200
|
+
|
|
201
|
+
window.LmvzApi ??= {};
|
|
202
|
+
window.LmvzApi.typedIconFromSet = typedIconFromSet;
|
|
203
|
+
|
|
204
|
+
export { SnackbarController as S };
|