@m3e/web 2.5.7 → 2.5.9
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/dist/all.js +3908 -987
- package/dist/all.js.map +1 -1
- package/dist/all.min.js +119 -56
- package/dist/all.min.js.map +1 -1
- package/dist/button-group.js +31 -12
- package/dist/button-group.js.map +1 -1
- package/dist/button-group.min.js +1 -1
- package/dist/button-group.min.js.map +1 -1
- package/dist/button.js +62 -30
- package/dist/button.js.map +1 -1
- package/dist/button.min.js +1 -1
- package/dist/button.min.js.map +1 -1
- package/dist/card.js +2 -2
- package/dist/card.js.map +1 -1
- package/dist/card.min.js +1 -1
- package/dist/card.min.js.map +1 -1
- package/dist/content-pane.js +1 -1
- package/dist/content-pane.js.map +1 -1
- package/dist/content-pane.min.js +1 -1
- package/dist/content-pane.min.js.map +1 -1
- package/dist/core.js +57 -5
- package/dist/core.js.map +1 -1
- package/dist/core.min.js +1 -1
- package/dist/core.min.js.map +1 -1
- package/dist/css-custom-data.json +370 -355
- package/dist/custom-elements.json +5331 -5173
- package/dist/drawer-container.js +13 -7
- package/dist/drawer-container.js.map +1 -1
- package/dist/drawer-container.min.js +1 -1
- package/dist/drawer-container.min.js.map +1 -1
- package/dist/html-custom-data.json +276 -276
- package/dist/icon-button.js +62 -30
- package/dist/icon-button.js.map +1 -1
- package/dist/icon-button.min.js +1 -1
- package/dist/icon-button.min.js.map +1 -1
- package/dist/loading-indicator.js +8 -8
- package/dist/loading-indicator.js.map +1 -1
- package/dist/loading-indicator.min.js +1 -1
- package/dist/loading-indicator.min.js.map +1 -1
- package/dist/slide-group.js +1 -1
- package/dist/slide-group.js.map +1 -1
- package/dist/slide-group.min.js.map +1 -1
- package/dist/snackbar.js +2 -2
- package/dist/snackbar.js.map +1 -1
- package/dist/snackbar.min.js +1 -1
- package/dist/snackbar.min.js.map +1 -1
- package/dist/src/button/ButtonElement.d.ts.map +1 -1
- package/dist/src/button/styles/ButtonSizeStyle.d.ts.map +1 -1
- package/dist/src/button/styles/ButtonStyle.d.ts.map +1 -1
- package/dist/src/button-group/ButtonGroupElement.d.ts.map +1 -1
- package/dist/src/card/styles/CardStyle.d.ts.map +1 -1
- package/dist/src/content-pane/ContentPaneElement.d.ts.map +1 -1
- package/dist/src/core/shared/controllers/ScrollController.d.ts.map +1 -1
- package/dist/src/core/shared/tokens/DesignToken.d.ts +18 -0
- package/dist/src/core/shared/tokens/DesignToken.d.ts.map +1 -1
- package/dist/src/core/shared/tokens/MeasurementToken.d.ts +34 -0
- package/dist/src/core/shared/tokens/MeasurementToken.d.ts.map +1 -0
- package/dist/src/drawer-container/DrawerContainerElement.d.ts.map +1 -1
- package/dist/src/drawer-container/DrawerToggleElement.d.ts.map +1 -1
- package/dist/src/icon-button/IconButtonElement.d.ts.map +1 -1
- package/dist/src/icon-button/styles/IconButtonSizeStyle.d.ts.map +1 -1
- package/dist/src/icon-button/styles/IconButtonStyle.d.ts.map +1 -1
- package/dist/src/loading-indicator/LoadingIndicatorElement.d.ts +1 -1
- package/dist/src/loading-indicator/LoadingIndicatorElement.d.ts.map +1 -1
- package/dist/src/snackbar/SnackbarElement.d.ts.map +1 -1
- package/dist/src/theme/ThemeElement.d.ts.map +1 -1
- package/dist/src/toc/TocElement.d.ts +4 -0
- package/dist/src/toc/TocElement.d.ts.map +1 -1
- package/dist/theme.js +3580 -834
- package/dist/theme.js.map +1 -1
- package/dist/theme.min.js +94 -31
- package/dist/theme.min.js.map +1 -1
- package/dist/toc.js +42 -8
- package/dist/toc.js.map +1 -1
- package/dist/toc.min.js +1 -1
- package/dist/toc.min.js.map +1 -1
- package/package.json +2 -2
package/dist/snackbar.js
CHANGED
|
@@ -131,10 +131,10 @@ _M3eSnackbarElement_handleBeforeToggle = function _M3eSnackbarElement_handleBefo
|
|
|
131
131
|
registerStyleSheet(css`m3e-snackbar { margin-inline: auto; }`);
|
|
132
132
|
})();
|
|
133
133
|
/** The styles of the element. */
|
|
134
|
-
M3eSnackbarElement.styles = css`:host { position: fixed; top: calc(100vh - var(--_snackbar-height, 0px) - var(--m3e-snackbar-margin, 1rem)); display: inline-flex; align-items: center; min-width: var(--m3e-snackbar-min-width, 21.5rem); max-width: var(--m3e-snackbar-max-width, 42rem); visibility: hidden; border: none; margin: 0; padding: 0; opacity: 0; transform:
|
|
134
|
+
M3eSnackbarElement.styles = css`:host { position: fixed; top: calc(100vh - var(--_snackbar-height, 0px) - var(--m3e-snackbar-margin, 1rem)); display: inline-flex; align-items: center; min-width: var(--m3e-snackbar-min-width, 21.5rem); max-width: var(--m3e-snackbar-max-width, 42rem); visibility: hidden; border: none; margin: 0; padding: 0; opacity: 0; transform: scaleY(0.8); transform-origin: bottom; transition: ${unsafeCSS(`opacity ${DesignToken.motion.duration.short3} ${DesignToken.motion.easing.standard},
|
|
135
135
|
transform ${DesignToken.motion.duration.short3} ${DesignToken.motion.easing.standard},
|
|
136
136
|
overlay ${DesignToken.motion.duration.short3} ${DesignToken.motion.easing.standard} allow-discrete,
|
|
137
|
-
visibility ${DesignToken.motion.duration.short3} ${DesignToken.motion.easing.standard} allow-discrete`)}; } :host::backdrop { background-color: transparent; } :host(:popover-open) { visibility: visible; opacity: 1; transform:
|
|
137
|
+
visibility ${DesignToken.motion.duration.short3} ${DesignToken.motion.easing.standard} allow-discrete`)}; } :host::backdrop { background-color: transparent; } :host(:popover-open) { visibility: visible; opacity: 1; transform: scaleY(1); } @starting-style { :host(:popover-open) { opacity: 0; transform: scaleY(0.8); } } .base { display: inline-flex; align-items: center; flex: 1 1 auto; box-sizing: border-box; padding: var(--m3e-snackbar-padding, 0 1rem 0 1rem); border-radius: var(--m3e-snackbar-container-shape, ${DesignToken.shape.corner.extraSmall}); background-color: var(--m3e-snackbar-container-color, ${DesignToken.color.inverseSurface}); font-size: var(--m3e-snackbar-supporting-text-font-size, ${DesignToken.typescale.standard.label.large.fontSize}); font-weight: var( --m3e-snackbar-supporting-text-font-weight, ${DesignToken.typescale.standard.label.large.fontWeight} ); line-height: var( --m3e-snackbar-supporting-text-line-height, ${DesignToken.typescale.standard.label.large.lineHeight} ); letter-spacing: var( --m3e-snackbar-supporting-text-tracking, ${DesignToken.typescale.standard.label.large.tracking} ); color: var(--m3e-snackbar-supporting-text-color, ${DesignToken.color.inverseOnSurface}); --m3e-text-button-label-text-color: var(--m3e-snackbar-action-text-color, ${DesignToken.color.inversePrimary}); --m3e-text-button-hover-label-text-color: var( --m3e-snackbar-action-text-color, ${DesignToken.color.inversePrimary} ); --m3e-text-button-hover-state-layer-color: var( --m3e-snackbar-action-text-color, ${DesignToken.color.inversePrimary} ); --m3e-text-button-focus-label-text-color: var( --m3e-snackbar-action-text-color, ${DesignToken.color.inversePrimary} ); --m3e-text-button-focus-state-layer-color: var( --m3e-snackbar-action-text-color, ${DesignToken.color.inversePrimary} ); --m3e-text-button-pressed-label-text-color: var( --m3e-snackbar-action-text-color, ${DesignToken.color.inversePrimary} ); --m3e-text-button-pressed-state-layer-color: var( --m3e-snackbar-action-text-color, ${DesignToken.color.inversePrimary} ); --m3e-standard-icon-button-icon-color: var( --m3e-snackbar-close-icon-color, ${DesignToken.color.inverseOnSurface} ); --m3e-standard-icon-button-hover-icon-color: var( --m3e-snackbar-close-icon-color, ${DesignToken.color.inverseOnSurface} ); --m3e-standard-icon-button-hover-state-layer-color: var( --m3e-snackbar-close-icon-color, ${DesignToken.color.inverseOnSurface} ); --m3e-standard-icon-button-focus-icon-color: var( --m3e-snackbar-close-icon-color, ${DesignToken.color.inverseOnSurface} ); --m3e-standard-icon-button-focus-state-layer-color: var( --m3e-snackbar-close-icon-color, ${DesignToken.color.inverseOnSurface} ); --m3e-standard-icon-button-pressed-icon-color: var( --m3e-snackbar-close-icon-color, ${DesignToken.color.inverseOnSurface} ); --m3e-standard-icon-button-pressed-state-layer-color: var( --m3e-snackbar-close-icon-color, ${DesignToken.color.inverseOnSurface} ); } :host([dismissible]) .base { padding-inline-end: 0.5rem; } .supporting-text { flex: 1 1 auto; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; line-clamp: 2; margin-block: var(--m3e-snackbar-supporting-text-margin-block, 0.875rem); } ::slotted([slot="close-icon"]), .close-icon { width: 1em; font-size: var(--m3e-icon-button-icon-size, 1.5rem) !important; } @media (forced-colors: active) { :host { background-color: Canvas; color: CanvasText; border-radius: ${DesignToken.shape.corner.small}; box-sizing: border-box; outline: 1px solid CanvasText; } }`;
|
|
138
138
|
/** @private */
|
|
139
139
|
M3eSnackbarElement.__current = null;
|
|
140
140
|
__decorate([property({
|
package/dist/snackbar.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"snackbar.js","sources":["../../src/snackbar/SnackbarElement.ts","../../src/snackbar/Snackbar.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unsafe-declaration-merging */\r\n\r\nimport { css, CSSResultGroup, html, LitElement, nothing, PropertyValues, unsafeCSS } from \"lit\";\r\nimport { property } from \"lit/decorators.js\";\r\n\r\nimport { customElement, DesignToken, registerStyleSheet, Role } from \"@m3e/web/core\";\r\n\r\nimport \"@m3e/web/button\";\r\nimport \"@m3e/web/icon-button\";\r\n\r\n/**\r\n * Presents short updates about application processes at the bottom of the screen.\r\n * @tag m3e-snackbar\r\n *\r\n * @slot - Renders the content of the snackbar.\r\n * @slot close-icon - Renders the icon of the button used to close the snackbar.\r\n *\r\n * @attr action - The label of the snackbar's action.\r\n * @attr close-label - The accessible label given to the button used to dismiss the snackbar.\r\n * @attr dismissible - Whether a button is presented that can be used to close the snackbar.\r\n * @attr duration - The length of time, in milliseconds, to wait before automatically dismissing the snackbar.\r\n *\r\n * @fires beforetoggle - Dispatched before the toggle state changes.\r\n * @fires toggle - Dispatched after the toggle state has changed.\r\n *\r\n * @cssprop --m3e-snackbar-margin - Vertical offset from the bottom of the viewport.\r\n * @cssprop --m3e-snackbar-container-shape - Border radius of the snackbar container.\r\n * @cssprop --m3e-snackbar-container-color - Background color of the snackbar.\r\n * @cssprop --m3e-snackbar-padding - Internal spacing of the snackbar container.\r\n * @cssprop --m3e-snackbar-min-width - Minimum width of the snackbar.\r\n * @cssprop --m3e-snackbar-max-width - Maximum width of the snackbar.\r\n */\r\n@customElement(\"m3e-snackbar\")\r\nexport class M3eSnackbarElement extends Role(LitElement, \"status\") {\r\n static {\r\n registerStyleSheet(css`\r\n m3e-snackbar {\r\n margin-inline: auto;\r\n }\r\n `);\r\n }\r\n /** The styles of the element. */\r\n static override styles: CSSResultGroup = css`\r\n :host {\r\n position: fixed;\r\n top: calc(100vh - var(--_snackbar-height, 0px) - var(--m3e-snackbar-margin, 1rem));\r\n display: inline-flex;\r\n align-items: center;\r\n min-width: var(--m3e-snackbar-min-width, 21.5rem);\r\n max-width: var(--m3e-snackbar-max-width, 42rem);\r\n visibility: hidden;\r\n border: none;\r\n margin: 0;\r\n padding: 0;\r\n opacity: 0;\r\n transform: scale(0.8);\r\n transition: ${unsafeCSS(\r\n `opacity ${DesignToken.motion.duration.short3} ${DesignToken.motion.easing.standard}, \r\n transform ${DesignToken.motion.duration.short3} ${DesignToken.motion.easing.standard}, \r\n overlay ${DesignToken.motion.duration.short3} ${DesignToken.motion.easing.standard} allow-discrete,\r\n visibility ${DesignToken.motion.duration.short3} ${DesignToken.motion.easing.standard} allow-discrete`,\r\n )};\r\n }\r\n :host::backdrop {\r\n background-color: transparent;\r\n }\r\n :host(:popover-open) {\r\n visibility: visible;\r\n opacity: 1;\r\n transform: scale(1);\r\n }\r\n @starting-style {\r\n :host(:popover-open) {\r\n opacity: 0;\r\n transform: scale(0.8);\r\n }\r\n }\r\n .base {\r\n display: inline-flex;\r\n align-items: center;\r\n flex: 1 1 auto;\r\n box-sizing: border-box;\r\n padding: var(--m3e-snackbar-padding, 0 1rem 0 1rem);\r\n border-radius: var(--m3e-snackbar-container-shape, ${DesignToken.shape.corner.extraSmall});\r\n background-color: var(--m3e-snackbar-container-color, ${DesignToken.color.inverseSurface});\r\n font-size: var(--m3e-snackbar-supporting-text-font-size, ${DesignToken.typescale.standard.label.large.fontSize});\r\n font-weight: var(\r\n --m3e-snackbar-supporting-text-font-weight,\r\n ${DesignToken.typescale.standard.label.large.fontWeight}\r\n );\r\n line-height: var(\r\n --m3e-snackbar-supporting-text-line-height,\r\n ${DesignToken.typescale.standard.label.large.lineHeight}\r\n );\r\n letter-spacing: var(\r\n --m3e-snackbar-supporting-text-tracking,\r\n ${DesignToken.typescale.standard.label.large.tracking}\r\n );\r\n color: var(--m3e-snackbar-supporting-text-color, ${DesignToken.color.inverseOnSurface});\r\n\r\n --m3e-text-button-label-text-color: var(--m3e-snackbar-action-text-color, ${DesignToken.color.inversePrimary});\r\n --m3e-text-button-hover-label-text-color: var(\r\n --m3e-snackbar-action-text-color,\r\n ${DesignToken.color.inversePrimary}\r\n );\r\n --m3e-text-button-hover-state-layer-color: var(\r\n --m3e-snackbar-action-text-color,\r\n ${DesignToken.color.inversePrimary}\r\n );\r\n --m3e-text-button-focus-label-text-color: var(\r\n --m3e-snackbar-action-text-color,\r\n ${DesignToken.color.inversePrimary}\r\n );\r\n --m3e-text-button-focus-state-layer-color: var(\r\n --m3e-snackbar-action-text-color,\r\n ${DesignToken.color.inversePrimary}\r\n );\r\n --m3e-text-button-pressed-label-text-color: var(\r\n --m3e-snackbar-action-text-color,\r\n ${DesignToken.color.inversePrimary}\r\n );\r\n --m3e-text-button-pressed-state-layer-color: var(\r\n --m3e-snackbar-action-text-color,\r\n ${DesignToken.color.inversePrimary}\r\n );\r\n --m3e-standard-icon-button-icon-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n --m3e-standard-icon-button-hover-icon-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n --m3e-standard-icon-button-hover-state-layer-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n --m3e-standard-icon-button-focus-icon-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n --m3e-standard-icon-button-focus-state-layer-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n --m3e-standard-icon-button-pressed-icon-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n --m3e-standard-icon-button-pressed-state-layer-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n }\r\n :host([dismissible]) .base {\r\n padding-inline-end: 0.5rem;\r\n }\r\n .supporting-text {\r\n flex: 1 1 auto;\r\n display: -webkit-box;\r\n -webkit-line-clamp: 2;\r\n -webkit-box-orient: vertical;\r\n overflow: hidden;\r\n line-clamp: 2;\r\n margin-block: var(--m3e-snackbar-supporting-text-margin-block, 0.875rem);\r\n }\r\n ::slotted([slot=\"close-icon\"]),\r\n .close-icon {\r\n width: 1em;\r\n font-size: var(--m3e-icon-button-icon-size, 1.5rem) !important;\r\n }\r\n @media (forced-colors: active) {\r\n :host {\r\n background-color: Canvas;\r\n color: CanvasText;\r\n border-radius: ${DesignToken.shape.corner.small};\r\n box-sizing: border-box;\r\n outline: 1px solid CanvasText;\r\n }\r\n }\r\n `;\r\n\r\n /** @private */ static __current: M3eSnackbarElement | null = null;\r\n\r\n /** @private */ #timeoutId = -1;\r\n /** @private */ #actionTaken = false;\r\n /** @private */ readonly #beforeToggleHandler = (e: ToggleEvent) => this.#handleBeforeToggle(e);\r\n\r\n /** The currently open snackbar. */\r\n static get current(): M3eSnackbarElement | null {\r\n return M3eSnackbarElement.__current;\r\n }\r\n\r\n /**\r\n * The length of time, in milliseconds, to wait before automatically dismissing the snackbar.\r\n * @default 3000\r\n */\r\n @property({ type: Number }) duration = 3000;\r\n\r\n /**\r\n * The label of the snackbar's action.\r\n * @default \"\"\r\n */\r\n @property() action = \"\";\r\n\r\n /**\r\n * Whether a button is presented that can be used to close the snackbar.\r\n * @default false\r\n */\r\n @property({ type: Boolean, reflect: true }) dismissible = false;\r\n\r\n /**\r\n * The accessible label given to the button used to dismiss the snackbar.\r\n * @default \"Close\"\r\n */\r\n @property({ attribute: \"close-label\" }) closeLabel = \"Close\";\r\n\r\n /** Whether the user clicked the action. */\r\n get isActionTaken(): boolean {\r\n return this.#actionTaken;\r\n }\r\n\r\n /** @inheritdoc */\r\n override connectedCallback(): void {\r\n super.connectedCallback();\r\n\r\n this.addEventListener(\"beforetoggle\", this.#beforeToggleHandler);\r\n this.setAttribute(\"popover\", \"manual\");\r\n this.ariaLive = \"polite\";\r\n }\r\n\r\n /** @inheritdoc */\r\n override disconnectedCallback(): void {\r\n super.disconnectedCallback();\r\n\r\n this.removeEventListener(\"beforetoggle\", this.#beforeToggleHandler);\r\n }\r\n\r\n /** @inheritdoc */\r\n protected override render() {\r\n return html`<div class=\"base\">\r\n <span class=\"supporting-text\"><slot></slot></span>\r\n ${this.#renderActionButton()} ${this.#renderCloseButton()}\r\n </div>`;\r\n }\r\n\r\n /** @inheritdoc */\r\n protected override updated(_changedProperties: PropertyValues): void {\r\n super.updated(_changedProperties);\r\n\r\n // After render, compute the (unscaled) height of the snackbar in order\r\n // to properly position it relative to the viewport.\r\n // top: calc(100vh - var(--_snackbar-height, 0px) - var(--m3e-snackbar-margin, 1rem));\r\n\r\n this.style.setProperty(\"--_snackbar-height\", `${this.getBoundingClientRect().height / 0.8}px`);\r\n }\r\n\r\n /** @private */\r\n #renderActionButton(): unknown {\r\n return !this.action ? nothing : html`<m3e-button @click=\"${this.#handleActionClick}\">${this.action}</m3e-button>`;\r\n }\r\n\r\n /** @private */\r\n #renderCloseButton(): unknown {\r\n return !this.dismissible\r\n ? nothing\r\n : html`<m3e-icon-button aria-label=\"${this.closeLabel}\" @click=\"${this.hidePopover}\">\r\n <slot name=\"close-icon\">\r\n <svg class=\"close-icon\" viewBox=\"0 -960 960 960\" fill=\"currentColor\">\r\n <path\r\n d=\"m256-200-56-56 224-224-224-224 56-56 224 224 224-224 56 56-224 224 224 224-56 56-224-224-224 224Z\"\r\n />\r\n </svg>\r\n </slot>\r\n </m3e-icon-button>`;\r\n }\r\n\r\n /** @private */\r\n #handleActionClick(): void {\r\n this.#actionTaken = true;\r\n this.hidePopover();\r\n }\r\n\r\n /** @private */\r\n #handleBeforeToggle(e: ToggleEvent): void {\r\n if (e.newState == \"open\") {\r\n M3eSnackbarElement.__current?.hidePopover();\r\n M3eSnackbarElement.__current = this;\r\n\r\n if (this.duration > 0) {\r\n this.#timeoutId = setTimeout(() => this.hidePopover(), this.duration);\r\n }\r\n } else {\r\n if (M3eSnackbarElement.__current === this) {\r\n M3eSnackbarElement.__current = null;\r\n }\r\n\r\n clearTimeout(this.#timeoutId);\r\n }\r\n }\r\n}\r\n\r\ninterface M3eSnackbarElementEventMap extends HTMLElementEventMap {\r\n beforetoggle: ToggleEvent;\r\n toggle: ToggleEvent;\r\n}\r\n\r\nexport interface M3eSnackbarElement {\r\n addEventListener<K extends keyof M3eSnackbarElementEventMap>(\r\n type: K,\r\n listener: (this: M3eSnackbarElement, ev: M3eSnackbarElementEventMap[K]) => void,\r\n options?: boolean | AddEventListenerOptions,\r\n ): void;\r\n\r\n addEventListener(\r\n type: string,\r\n listener: EventListenerOrEventListenerObject,\r\n options?: boolean | AddEventListenerOptions,\r\n ): void;\r\n\r\n removeEventListener<K extends keyof M3eSnackbarElementEventMap>(\r\n type: K,\r\n listener: (this: M3eSnackbarElement, ev: M3eSnackbarElementEventMap[K]) => void,\r\n options?: boolean | EventListenerOptions,\r\n ): void;\r\n\r\n removeEventListener(\r\n type: string,\r\n listener: EventListenerOrEventListenerObject,\r\n options?: boolean | EventListenerOptions,\r\n ): void;\r\n}\r\n\r\ndeclare global {\r\n interface HTMLElementTagNameMap {\r\n \"m3e-snackbar\": M3eSnackbarElement;\r\n }\r\n}\r\n","import { isServer } from \"lit\";\r\n\r\nimport { prefersReducedMotion } from \"@m3e/web/core\";\r\n\r\nimport { M3eSnackbarElement } from \"./SnackbarElement\";\r\n\r\n/** Encapsulates options used to present a snackbar message. */\r\nexport interface SnackbarOptions {\r\n /** The length of time, in milliseconds, to wait before automatically dismissing the snackbar. */\r\n duration?: number;\r\n\r\n /** The accessible label given to the close button used to dismiss the snackbar. */\r\n closeLabel?: string;\r\n\r\n /** The callback function invoked when the action is clicked. */\r\n actionCallback?: () => void;\r\n}\r\n\r\n/**\r\n * Presents short updates about application processes at the bottom of the screen from anywhere in an application.\r\n * @example\r\n * The following example illustrates basic usage.\r\n * ```js\r\n * M3eSnackbar.open(\"File deleted\");\r\n * ```\r\n * @example\r\n * The next example illustrates presenting a snackbar with an action and callback.\r\n * ```js\r\n * M3eSnackbar.open(\"File deleted\", \"Undo\", {\r\n * actionCallback: () => {\r\n * // Undo logic here\r\n * },\r\n * });\r\n */\r\nexport class M3eSnackbar {\r\n /**\r\n * Opens a snackbar with a message.\r\n * @param {string} message The message to show in the snackbar.\r\n * @param {SnackbarOptions | undefined} options Options that control the behavior of the snackbar.\r\n */\r\n static open(message: string, options?: SnackbarOptions): void;\r\n\r\n /**\r\n * Opens a snackbar with a message and action.\r\n * @param {string} message The message to show in the snackbar.\r\n * @param {string} action The label for the snackbar action.\r\n * @param {SnackbarOptions | undefined} options Options that control the behavior of the snackbar.\r\n */\r\n static open(message: string, action: string, options?: SnackbarOptions): void;\r\n\r\n /**\r\n * Opens a snackbar with a message, action and optional close affordance.\r\n * @param {string} message The message to show in the snackbar.\r\n * @param {string} action The label for the snackbar action.\r\n * @param {boolean} dismissible Whether to present close affordance.\r\n * @param {SnackbarOptions | undefined} options Options that control the behavior of the snackbar.\r\n */\r\n static open(message: string, action: string, dismissible: boolean, options?: SnackbarOptions): void;\r\n\r\n /**\r\n * Opens a snackbar with a message and optional close affordance.\r\n * @param {string} message The message to show in the snackbar.\r\n * @param {boolean} dismissible Whether to present close affordance.\r\n * @param {SnackbarOptions | undefined} options Options that control the behavior of the snackbar.\r\n */\r\n static open(message: string, dismissible: boolean, options?: SnackbarOptions): void;\r\n\r\n static open(\r\n message: string,\r\n actionOrDismissibleOrOptions?: string | boolean | SnackbarOptions,\r\n dismissibleOrOptions?: boolean | SnackbarOptions,\r\n options?: SnackbarOptions,\r\n ): void {\r\n if (isServer) return;\r\n\r\n const snackbar = document.createElement(\"m3e-snackbar\");\r\n snackbar.append(document.createTextNode(message));\r\n\r\n let actualOptions: SnackbarOptions | undefined = undefined;\r\n\r\n if (typeof actionOrDismissibleOrOptions == \"string\") {\r\n snackbar.action = actionOrDismissibleOrOptions;\r\n } else if (typeof actionOrDismissibleOrOptions == \"boolean\") {\r\n snackbar.dismissible = actionOrDismissibleOrOptions;\r\n } else {\r\n actualOptions = actionOrDismissibleOrOptions;\r\n }\r\n\r\n if (typeof dismissibleOrOptions == \"boolean\") {\r\n snackbar.dismissible = dismissibleOrOptions;\r\n } else {\r\n actualOptions = dismissibleOrOptions;\r\n }\r\n\r\n if (options) {\r\n actualOptions = options;\r\n }\r\n\r\n if (actualOptions?.duration !== undefined) {\r\n snackbar.duration = actualOptions.duration;\r\n }\r\n if (actualOptions?.closeLabel) {\r\n snackbar.closeLabel = actualOptions.closeLabel;\r\n }\r\n\r\n snackbar.addEventListener(\"toggle\", (e) => {\r\n if (e.newState === \"closed\") {\r\n if (prefersReducedMotion()) {\r\n snackbar.remove();\r\n } else {\r\n snackbar.addEventListener(\"transitionend\", () => snackbar.remove(), { once: true });\r\n }\r\n\r\n if (snackbar.isActionTaken) {\r\n actualOptions?.actionCallback?.();\r\n }\r\n }\r\n });\r\n\r\n (document.querySelector(\"m3e-theme\") ?? document.body).append(snackbar);\r\n snackbar.showPopover();\r\n }\r\n\r\n /** Dismisses the currently visible snackbar. */\r\n static dismiss(): void {\r\n M3eSnackbarElement.current?.hidePopover();\r\n }\r\n}\r\n\r\n// This is the class type, as opposed to an instance of the class.\r\ntype M3eSnackbarClass = typeof M3eSnackbar;\r\n\r\ndeclare global {\r\n /** Presents short updates about application processes at the bottom of the screen from anywhere in an application. */\r\n var M3eSnackbar: M3eSnackbarClass;\r\n}\r\n\r\nglobalThis.M3eSnackbar = M3eSnackbar;\r\n"],"names":["M3eSnackbarElement","M3eSnackbarElement_1","Role","LitElement","constructor","_M3eSnackbarElement_timeoutId","set","_M3eSnackbarElement_actionTaken","_M3eSnackbarElement_beforeToggleHandler","e","__classPrivateFieldGet","call","duration","action","dismissible","closeLabel","current","__current","isActionTaken","connectedCallback","addEventListener","setAttribute","ariaLive","disconnectedCallback","removeEventListener","render","html","_M3eSnackbarElement_instances","_M3eSnackbarElement_renderActionButton","_M3eSnackbarElement_renderCloseButton","updated","_changedProperties","style","setProperty","getBoundingClientRect","height","nothing","_M3eSnackbarElement_handleActionClick","hidePopover","__classPrivateFieldSet","newState","setTimeout","clearTimeout","registerStyleSheet","css","styles","unsafeCSS","DesignToken","motion","short3","easing","standard","shape","corner","extraSmall","color","inverseSurface","typescale","label","large","fontSize","fontWeight","lineHeight","tracking","inverseOnSurface","inversePrimary","small","__decorate","property","type","Number","prototype","Boolean","reflect","attribute","customElement","M3eSnackbar","open","message","actionOrDismissibleOrOptions","dismissibleOrOptions","options","isServer","snackbar","document","createElement","append","createTextNode","actualOptions","undefined","prefersReducedMotion","remove","once","actionCallback","querySelector","body","showPopover","dismiss","globalThis"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"snackbar.js","sources":["../../src/snackbar/SnackbarElement.ts","../../src/snackbar/Snackbar.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unsafe-declaration-merging */\r\n\r\nimport { css, CSSResultGroup, html, LitElement, nothing, PropertyValues, unsafeCSS } from \"lit\";\r\nimport { property } from \"lit/decorators.js\";\r\n\r\nimport { customElement, DesignToken, registerStyleSheet, Role } from \"@m3e/web/core\";\r\n\r\nimport \"@m3e/web/button\";\r\nimport \"@m3e/web/icon-button\";\r\n\r\n/**\r\n * Presents short updates about application processes at the bottom of the screen.\r\n * @tag m3e-snackbar\r\n *\r\n * @slot - Renders the content of the snackbar.\r\n * @slot close-icon - Renders the icon of the button used to close the snackbar.\r\n *\r\n * @attr action - The label of the snackbar's action.\r\n * @attr close-label - The accessible label given to the button used to dismiss the snackbar.\r\n * @attr dismissible - Whether a button is presented that can be used to close the snackbar.\r\n * @attr duration - The length of time, in milliseconds, to wait before automatically dismissing the snackbar.\r\n *\r\n * @fires beforetoggle - Dispatched before the toggle state changes.\r\n * @fires toggle - Dispatched after the toggle state has changed.\r\n *\r\n * @cssprop --m3e-snackbar-margin - Vertical offset from the bottom of the viewport.\r\n * @cssprop --m3e-snackbar-container-shape - Border radius of the snackbar container.\r\n * @cssprop --m3e-snackbar-container-color - Background color of the snackbar.\r\n * @cssprop --m3e-snackbar-padding - Internal spacing of the snackbar container.\r\n * @cssprop --m3e-snackbar-min-width - Minimum width of the snackbar.\r\n * @cssprop --m3e-snackbar-max-width - Maximum width of the snackbar.\r\n */\r\n@customElement(\"m3e-snackbar\")\r\nexport class M3eSnackbarElement extends Role(LitElement, \"status\") {\r\n static {\r\n registerStyleSheet(css`\r\n m3e-snackbar {\r\n margin-inline: auto;\r\n }\r\n `);\r\n }\r\n /** The styles of the element. */\r\n static override styles: CSSResultGroup = css`\r\n :host {\r\n position: fixed;\r\n top: calc(100vh - var(--_snackbar-height, 0px) - var(--m3e-snackbar-margin, 1rem));\r\n display: inline-flex;\r\n align-items: center;\r\n min-width: var(--m3e-snackbar-min-width, 21.5rem);\r\n max-width: var(--m3e-snackbar-max-width, 42rem);\r\n visibility: hidden;\r\n border: none;\r\n margin: 0;\r\n padding: 0;\r\n opacity: 0;\r\n transform: scaleY(0.8);\r\n transform-origin: bottom;\r\n transition: ${unsafeCSS(\r\n `opacity ${DesignToken.motion.duration.short3} ${DesignToken.motion.easing.standard}, \r\n transform ${DesignToken.motion.duration.short3} ${DesignToken.motion.easing.standard}, \r\n overlay ${DesignToken.motion.duration.short3} ${DesignToken.motion.easing.standard} allow-discrete,\r\n visibility ${DesignToken.motion.duration.short3} ${DesignToken.motion.easing.standard} allow-discrete`,\r\n )};\r\n }\r\n :host::backdrop {\r\n background-color: transparent;\r\n }\r\n :host(:popover-open) {\r\n visibility: visible;\r\n opacity: 1;\r\n transform: scaleY(1);\r\n }\r\n @starting-style {\r\n :host(:popover-open) {\r\n opacity: 0;\r\n transform: scaleY(0.8);\r\n }\r\n }\r\n .base {\r\n display: inline-flex;\r\n align-items: center;\r\n flex: 1 1 auto;\r\n box-sizing: border-box;\r\n padding: var(--m3e-snackbar-padding, 0 1rem 0 1rem);\r\n border-radius: var(--m3e-snackbar-container-shape, ${DesignToken.shape.corner.extraSmall});\r\n background-color: var(--m3e-snackbar-container-color, ${DesignToken.color.inverseSurface});\r\n font-size: var(--m3e-snackbar-supporting-text-font-size, ${DesignToken.typescale.standard.label.large.fontSize});\r\n font-weight: var(\r\n --m3e-snackbar-supporting-text-font-weight,\r\n ${DesignToken.typescale.standard.label.large.fontWeight}\r\n );\r\n line-height: var(\r\n --m3e-snackbar-supporting-text-line-height,\r\n ${DesignToken.typescale.standard.label.large.lineHeight}\r\n );\r\n letter-spacing: var(\r\n --m3e-snackbar-supporting-text-tracking,\r\n ${DesignToken.typescale.standard.label.large.tracking}\r\n );\r\n color: var(--m3e-snackbar-supporting-text-color, ${DesignToken.color.inverseOnSurface});\r\n\r\n --m3e-text-button-label-text-color: var(--m3e-snackbar-action-text-color, ${DesignToken.color.inversePrimary});\r\n --m3e-text-button-hover-label-text-color: var(\r\n --m3e-snackbar-action-text-color,\r\n ${DesignToken.color.inversePrimary}\r\n );\r\n --m3e-text-button-hover-state-layer-color: var(\r\n --m3e-snackbar-action-text-color,\r\n ${DesignToken.color.inversePrimary}\r\n );\r\n --m3e-text-button-focus-label-text-color: var(\r\n --m3e-snackbar-action-text-color,\r\n ${DesignToken.color.inversePrimary}\r\n );\r\n --m3e-text-button-focus-state-layer-color: var(\r\n --m3e-snackbar-action-text-color,\r\n ${DesignToken.color.inversePrimary}\r\n );\r\n --m3e-text-button-pressed-label-text-color: var(\r\n --m3e-snackbar-action-text-color,\r\n ${DesignToken.color.inversePrimary}\r\n );\r\n --m3e-text-button-pressed-state-layer-color: var(\r\n --m3e-snackbar-action-text-color,\r\n ${DesignToken.color.inversePrimary}\r\n );\r\n --m3e-standard-icon-button-icon-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n --m3e-standard-icon-button-hover-icon-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n --m3e-standard-icon-button-hover-state-layer-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n --m3e-standard-icon-button-focus-icon-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n --m3e-standard-icon-button-focus-state-layer-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n --m3e-standard-icon-button-pressed-icon-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n --m3e-standard-icon-button-pressed-state-layer-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n }\r\n :host([dismissible]) .base {\r\n padding-inline-end: 0.5rem;\r\n }\r\n .supporting-text {\r\n flex: 1 1 auto;\r\n display: -webkit-box;\r\n -webkit-line-clamp: 2;\r\n -webkit-box-orient: vertical;\r\n overflow: hidden;\r\n line-clamp: 2;\r\n margin-block: var(--m3e-snackbar-supporting-text-margin-block, 0.875rem);\r\n }\r\n ::slotted([slot=\"close-icon\"]),\r\n .close-icon {\r\n width: 1em;\r\n font-size: var(--m3e-icon-button-icon-size, 1.5rem) !important;\r\n }\r\n @media (forced-colors: active) {\r\n :host {\r\n background-color: Canvas;\r\n color: CanvasText;\r\n border-radius: ${DesignToken.shape.corner.small};\r\n box-sizing: border-box;\r\n outline: 1px solid CanvasText;\r\n }\r\n }\r\n `;\r\n\r\n /** @private */ static __current: M3eSnackbarElement | null = null;\r\n\r\n /** @private */ #timeoutId = -1;\r\n /** @private */ #actionTaken = false;\r\n /** @private */ readonly #beforeToggleHandler = (e: ToggleEvent) => this.#handleBeforeToggle(e);\r\n\r\n /** The currently open snackbar. */\r\n static get current(): M3eSnackbarElement | null {\r\n return M3eSnackbarElement.__current;\r\n }\r\n\r\n /**\r\n * The length of time, in milliseconds, to wait before automatically dismissing the snackbar.\r\n * @default 3000\r\n */\r\n @property({ type: Number }) duration = 3000;\r\n\r\n /**\r\n * The label of the snackbar's action.\r\n * @default \"\"\r\n */\r\n @property() action = \"\";\r\n\r\n /**\r\n * Whether a button is presented that can be used to close the snackbar.\r\n * @default false\r\n */\r\n @property({ type: Boolean, reflect: true }) dismissible = false;\r\n\r\n /**\r\n * The accessible label given to the button used to dismiss the snackbar.\r\n * @default \"Close\"\r\n */\r\n @property({ attribute: \"close-label\" }) closeLabel = \"Close\";\r\n\r\n /** Whether the user clicked the action. */\r\n get isActionTaken(): boolean {\r\n return this.#actionTaken;\r\n }\r\n\r\n /** @inheritdoc */\r\n override connectedCallback(): void {\r\n super.connectedCallback();\r\n\r\n this.addEventListener(\"beforetoggle\", this.#beforeToggleHandler);\r\n this.setAttribute(\"popover\", \"manual\");\r\n this.ariaLive = \"polite\";\r\n }\r\n\r\n /** @inheritdoc */\r\n override disconnectedCallback(): void {\r\n super.disconnectedCallback();\r\n\r\n this.removeEventListener(\"beforetoggle\", this.#beforeToggleHandler);\r\n }\r\n\r\n /** @inheritdoc */\r\n protected override render() {\r\n return html`<div class=\"base\">\r\n <span class=\"supporting-text\"><slot></slot></span>\r\n ${this.#renderActionButton()} ${this.#renderCloseButton()}\r\n </div>`;\r\n }\r\n\r\n /** @inheritdoc */\r\n protected override updated(_changedProperties: PropertyValues): void {\r\n super.updated(_changedProperties);\r\n\r\n // After render, compute the (unscaled) height of the snackbar in order\r\n // to properly position it relative to the viewport.\r\n // top: calc(100vh - var(--_snackbar-height, 0px) - var(--m3e-snackbar-margin, 1rem));\r\n\r\n this.style.setProperty(\"--_snackbar-height\", `${this.getBoundingClientRect().height / 0.8}px`);\r\n }\r\n\r\n /** @private */\r\n #renderActionButton(): unknown {\r\n return !this.action ? nothing : html`<m3e-button @click=\"${this.#handleActionClick}\">${this.action}</m3e-button>`;\r\n }\r\n\r\n /** @private */\r\n #renderCloseButton(): unknown {\r\n return !this.dismissible\r\n ? nothing\r\n : html`<m3e-icon-button aria-label=\"${this.closeLabel}\" @click=\"${this.hidePopover}\">\r\n <slot name=\"close-icon\">\r\n <svg class=\"close-icon\" viewBox=\"0 -960 960 960\" fill=\"currentColor\">\r\n <path\r\n d=\"m256-200-56-56 224-224-224-224 56-56 224 224 224-224 56 56-224 224 224 224-56 56-224-224-224 224Z\"\r\n />\r\n </svg>\r\n </slot>\r\n </m3e-icon-button>`;\r\n }\r\n\r\n /** @private */\r\n #handleActionClick(): void {\r\n this.#actionTaken = true;\r\n this.hidePopover();\r\n }\r\n\r\n /** @private */\r\n #handleBeforeToggle(e: ToggleEvent): void {\r\n if (e.newState == \"open\") {\r\n M3eSnackbarElement.__current?.hidePopover();\r\n M3eSnackbarElement.__current = this;\r\n\r\n if (this.duration > 0) {\r\n this.#timeoutId = setTimeout(() => this.hidePopover(), this.duration);\r\n }\r\n } else {\r\n if (M3eSnackbarElement.__current === this) {\r\n M3eSnackbarElement.__current = null;\r\n }\r\n\r\n clearTimeout(this.#timeoutId);\r\n }\r\n }\r\n}\r\n\r\ninterface M3eSnackbarElementEventMap extends HTMLElementEventMap {\r\n beforetoggle: ToggleEvent;\r\n toggle: ToggleEvent;\r\n}\r\n\r\nexport interface M3eSnackbarElement {\r\n addEventListener<K extends keyof M3eSnackbarElementEventMap>(\r\n type: K,\r\n listener: (this: M3eSnackbarElement, ev: M3eSnackbarElementEventMap[K]) => void,\r\n options?: boolean | AddEventListenerOptions,\r\n ): void;\r\n\r\n addEventListener(\r\n type: string,\r\n listener: EventListenerOrEventListenerObject,\r\n options?: boolean | AddEventListenerOptions,\r\n ): void;\r\n\r\n removeEventListener<K extends keyof M3eSnackbarElementEventMap>(\r\n type: K,\r\n listener: (this: M3eSnackbarElement, ev: M3eSnackbarElementEventMap[K]) => void,\r\n options?: boolean | EventListenerOptions,\r\n ): void;\r\n\r\n removeEventListener(\r\n type: string,\r\n listener: EventListenerOrEventListenerObject,\r\n options?: boolean | EventListenerOptions,\r\n ): void;\r\n}\r\n\r\ndeclare global {\r\n interface HTMLElementTagNameMap {\r\n \"m3e-snackbar\": M3eSnackbarElement;\r\n }\r\n}\r\n","import { isServer } from \"lit\";\r\n\r\nimport { prefersReducedMotion } from \"@m3e/web/core\";\r\n\r\nimport { M3eSnackbarElement } from \"./SnackbarElement\";\r\n\r\n/** Encapsulates options used to present a snackbar message. */\r\nexport interface SnackbarOptions {\r\n /** The length of time, in milliseconds, to wait before automatically dismissing the snackbar. */\r\n duration?: number;\r\n\r\n /** The accessible label given to the close button used to dismiss the snackbar. */\r\n closeLabel?: string;\r\n\r\n /** The callback function invoked when the action is clicked. */\r\n actionCallback?: () => void;\r\n}\r\n\r\n/**\r\n * Presents short updates about application processes at the bottom of the screen from anywhere in an application.\r\n * @example\r\n * The following example illustrates basic usage.\r\n * ```js\r\n * M3eSnackbar.open(\"File deleted\");\r\n * ```\r\n * @example\r\n * The next example illustrates presenting a snackbar with an action and callback.\r\n * ```js\r\n * M3eSnackbar.open(\"File deleted\", \"Undo\", {\r\n * actionCallback: () => {\r\n * // Undo logic here\r\n * },\r\n * });\r\n */\r\nexport class M3eSnackbar {\r\n /**\r\n * Opens a snackbar with a message.\r\n * @param {string} message The message to show in the snackbar.\r\n * @param {SnackbarOptions | undefined} options Options that control the behavior of the snackbar.\r\n */\r\n static open(message: string, options?: SnackbarOptions): void;\r\n\r\n /**\r\n * Opens a snackbar with a message and action.\r\n * @param {string} message The message to show in the snackbar.\r\n * @param {string} action The label for the snackbar action.\r\n * @param {SnackbarOptions | undefined} options Options that control the behavior of the snackbar.\r\n */\r\n static open(message: string, action: string, options?: SnackbarOptions): void;\r\n\r\n /**\r\n * Opens a snackbar with a message, action and optional close affordance.\r\n * @param {string} message The message to show in the snackbar.\r\n * @param {string} action The label for the snackbar action.\r\n * @param {boolean} dismissible Whether to present close affordance.\r\n * @param {SnackbarOptions | undefined} options Options that control the behavior of the snackbar.\r\n */\r\n static open(message: string, action: string, dismissible: boolean, options?: SnackbarOptions): void;\r\n\r\n /**\r\n * Opens a snackbar with a message and optional close affordance.\r\n * @param {string} message The message to show in the snackbar.\r\n * @param {boolean} dismissible Whether to present close affordance.\r\n * @param {SnackbarOptions | undefined} options Options that control the behavior of the snackbar.\r\n */\r\n static open(message: string, dismissible: boolean, options?: SnackbarOptions): void;\r\n\r\n static open(\r\n message: string,\r\n actionOrDismissibleOrOptions?: string | boolean | SnackbarOptions,\r\n dismissibleOrOptions?: boolean | SnackbarOptions,\r\n options?: SnackbarOptions,\r\n ): void {\r\n if (isServer) return;\r\n\r\n const snackbar = document.createElement(\"m3e-snackbar\");\r\n snackbar.append(document.createTextNode(message));\r\n\r\n let actualOptions: SnackbarOptions | undefined = undefined;\r\n\r\n if (typeof actionOrDismissibleOrOptions == \"string\") {\r\n snackbar.action = actionOrDismissibleOrOptions;\r\n } else if (typeof actionOrDismissibleOrOptions == \"boolean\") {\r\n snackbar.dismissible = actionOrDismissibleOrOptions;\r\n } else {\r\n actualOptions = actionOrDismissibleOrOptions;\r\n }\r\n\r\n if (typeof dismissibleOrOptions == \"boolean\") {\r\n snackbar.dismissible = dismissibleOrOptions;\r\n } else {\r\n actualOptions = dismissibleOrOptions;\r\n }\r\n\r\n if (options) {\r\n actualOptions = options;\r\n }\r\n\r\n if (actualOptions?.duration !== undefined) {\r\n snackbar.duration = actualOptions.duration;\r\n }\r\n if (actualOptions?.closeLabel) {\r\n snackbar.closeLabel = actualOptions.closeLabel;\r\n }\r\n\r\n snackbar.addEventListener(\"toggle\", (e) => {\r\n if (e.newState === \"closed\") {\r\n if (prefersReducedMotion()) {\r\n snackbar.remove();\r\n } else {\r\n snackbar.addEventListener(\"transitionend\", () => snackbar.remove(), { once: true });\r\n }\r\n\r\n if (snackbar.isActionTaken) {\r\n actualOptions?.actionCallback?.();\r\n }\r\n }\r\n });\r\n\r\n (document.querySelector(\"m3e-theme\") ?? document.body).append(snackbar);\r\n snackbar.showPopover();\r\n }\r\n\r\n /** Dismisses the currently visible snackbar. */\r\n static dismiss(): void {\r\n M3eSnackbarElement.current?.hidePopover();\r\n }\r\n}\r\n\r\n// This is the class type, as opposed to an instance of the class.\r\ntype M3eSnackbarClass = typeof M3eSnackbar;\r\n\r\ndeclare global {\r\n /** Presents short updates about application processes at the bottom of the screen from anywhere in an application. */\r\n var M3eSnackbar: M3eSnackbarClass;\r\n}\r\n\r\nglobalThis.M3eSnackbar = M3eSnackbar;\r\n"],"names":["M3eSnackbarElement","M3eSnackbarElement_1","Role","LitElement","constructor","_M3eSnackbarElement_timeoutId","set","_M3eSnackbarElement_actionTaken","_M3eSnackbarElement_beforeToggleHandler","e","__classPrivateFieldGet","call","duration","action","dismissible","closeLabel","current","__current","isActionTaken","connectedCallback","addEventListener","setAttribute","ariaLive","disconnectedCallback","removeEventListener","render","html","_M3eSnackbarElement_instances","_M3eSnackbarElement_renderActionButton","_M3eSnackbarElement_renderCloseButton","updated","_changedProperties","style","setProperty","getBoundingClientRect","height","nothing","_M3eSnackbarElement_handleActionClick","hidePopover","__classPrivateFieldSet","newState","setTimeout","clearTimeout","registerStyleSheet","css","styles","unsafeCSS","DesignToken","motion","short3","easing","standard","shape","corner","extraSmall","color","inverseSurface","typescale","label","large","fontSize","fontWeight","lineHeight","tracking","inverseOnSurface","inversePrimary","small","__decorate","property","type","Number","prototype","Boolean","reflect","attribute","customElement","M3eSnackbar","open","message","actionOrDismissibleOrOptions","dismissibleOrOptions","options","isServer","snackbar","document","createElement","append","createTextNode","actualOptions","undefined","prefersReducedMotion","remove","once","actionCallback","querySelector","body","showPopover","dismiss","globalThis"],"mappings":"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"}
|
package/dist/snackbar.min.js
CHANGED
|
@@ -3,5 +3,5 @@
|
|
|
3
3
|
* Copyright (c) 2025–2026 matraic
|
|
4
4
|
* See LICENSE file in the project root for full license text.
|
|
5
5
|
*/
|
|
6
|
-
import{LitElement as e,html as t,nothing as o,css as r,unsafeCSS as a,isServer as n}from"lit";import{Role as i,registerStyleSheet as s,DesignToken as c,customElement as l,prefersReducedMotion as d}from"@m3e/web/core";import{__classPrivateFieldGet as m,__classPrivateFieldSet as b,__decorate as p}from"tslib";import{property as u}from"lit/decorators.js";import"@m3e/web/button";import"@m3e/web/icon-button";var v,h,g,k,f,x,y,$,w;let S=w=class extends(i(e,"status")){constructor(){super(...arguments),v.add(this),h.set(this,-1),g.set(this,!1),k.set(this,e=>m(this,v,"m",$).call(this,e)),this.duration=3e3,this.action="",this.dismissible=!1,this.closeLabel="Close"}static get current(){return w.__current}get isActionTaken(){return m(this,g,"f")}connectedCallback(){super.connectedCallback(),this.addEventListener("beforetoggle",m(this,k,"f")),this.setAttribute("popover","manual"),this.ariaLive="polite"}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("beforetoggle",m(this,k,"f"))}render(){return t`<div class="base"><span class="supporting-text"><slot></slot></span>${m(this,v,"m",f).call(this)} ${m(this,v,"m",x).call(this)}</div>`}updated(e){super.updated(e),this.style.setProperty("--_snackbar-height",this.getBoundingClientRect().height/.8+"px")}};h=new WeakMap,g=new WeakMap,k=new WeakMap,v=new WeakSet,f=function(){return this.action?t`<m3e-button @click="${m(this,v,"m",y)}">${this.action}</m3e-button>`:o},x=function(){return this.dismissible?t`<m3e-icon-button aria-label="${this.closeLabel}" @click="${this.hidePopover}"><slot name="close-icon"><svg class="close-icon" viewBox="0 -960 960 960" fill="currentColor"><path d="m256-200-56-56 224-224-224-224 56-56 224 224 224-224 56 56-224 224 224 224-56 56-224-224-224 224Z"/></svg></slot></m3e-icon-button>`:o},y=function(){b(this,g,!0,"f"),this.hidePopover()},$=function(e){"open"==e.newState?(w.__current?.hidePopover(),w.__current=this,this.duration>0&&b(this,h,setTimeout(()=>this.hidePopover(),this.duration),"f")):(w.__current===this&&(w.__current=null),clearTimeout(m(this,h,"f")))},s(r`m3e-snackbar { margin-inline: auto; }`),S.styles=r`:host { position: fixed; top: calc(100vh - var(--_snackbar-height, 0px) - var(--m3e-snackbar-margin, 1rem)); display: inline-flex; align-items: center; min-width: var(--m3e-snackbar-min-width, 21.5rem); max-width: var(--m3e-snackbar-max-width, 42rem); visibility: hidden; border: none; margin: 0; padding: 0; opacity: 0; transform:
|
|
6
|
+
import{LitElement as e,html as t,nothing as o,css as r,unsafeCSS as a,isServer as n}from"lit";import{Role as i,registerStyleSheet as s,DesignToken as c,customElement as l,prefersReducedMotion as d}from"@m3e/web/core";import{__classPrivateFieldGet as m,__classPrivateFieldSet as b,__decorate as p}from"tslib";import{property as u}from"lit/decorators.js";import"@m3e/web/button";import"@m3e/web/icon-button";var v,h,g,k,f,x,y,$,w;let S=w=class extends(i(e,"status")){constructor(){super(...arguments),v.add(this),h.set(this,-1),g.set(this,!1),k.set(this,e=>m(this,v,"m",$).call(this,e)),this.duration=3e3,this.action="",this.dismissible=!1,this.closeLabel="Close"}static get current(){return w.__current}get isActionTaken(){return m(this,g,"f")}connectedCallback(){super.connectedCallback(),this.addEventListener("beforetoggle",m(this,k,"f")),this.setAttribute("popover","manual"),this.ariaLive="polite"}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("beforetoggle",m(this,k,"f"))}render(){return t`<div class="base"><span class="supporting-text"><slot></slot></span>${m(this,v,"m",f).call(this)} ${m(this,v,"m",x).call(this)}</div>`}updated(e){super.updated(e),this.style.setProperty("--_snackbar-height",this.getBoundingClientRect().height/.8+"px")}};h=new WeakMap,g=new WeakMap,k=new WeakMap,v=new WeakSet,f=function(){return this.action?t`<m3e-button @click="${m(this,v,"m",y)}">${this.action}</m3e-button>`:o},x=function(){return this.dismissible?t`<m3e-icon-button aria-label="${this.closeLabel}" @click="${this.hidePopover}"><slot name="close-icon"><svg class="close-icon" viewBox="0 -960 960 960" fill="currentColor"><path d="m256-200-56-56 224-224-224-224 56-56 224 224 224-224 56 56-224 224 224 224-56 56-224-224-224 224Z"/></svg></slot></m3e-icon-button>`:o},y=function(){b(this,g,!0,"f"),this.hidePopover()},$=function(e){"open"==e.newState?(w.__current?.hidePopover(),w.__current=this,this.duration>0&&b(this,h,setTimeout(()=>this.hidePopover(),this.duration),"f")):(w.__current===this&&(w.__current=null),clearTimeout(m(this,h,"f")))},s(r`m3e-snackbar { margin-inline: auto; }`),S.styles=r`:host { position: fixed; top: calc(100vh - var(--_snackbar-height, 0px) - var(--m3e-snackbar-margin, 1rem)); display: inline-flex; align-items: center; min-width: var(--m3e-snackbar-min-width, 21.5rem); max-width: var(--m3e-snackbar-max-width, 42rem); visibility: hidden; border: none; margin: 0; padding: 0; opacity: 0; transform: scaleY(0.8); transform-origin: bottom; transition: ${a(`opacity ${c.motion.duration.short3} ${c.motion.easing.standard}, \n transform ${c.motion.duration.short3} ${c.motion.easing.standard}, \n overlay ${c.motion.duration.short3} ${c.motion.easing.standard} allow-discrete,\n visibility ${c.motion.duration.short3} ${c.motion.easing.standard} allow-discrete`)}; } :host::backdrop { background-color: transparent; } :host(:popover-open) { visibility: visible; opacity: 1; transform: scaleY(1); } @starting-style { :host(:popover-open) { opacity: 0; transform: scaleY(0.8); } } .base { display: inline-flex; align-items: center; flex: 1 1 auto; box-sizing: border-box; padding: var(--m3e-snackbar-padding, 0 1rem 0 1rem); border-radius: var(--m3e-snackbar-container-shape, ${c.shape.corner.extraSmall}); background-color: var(--m3e-snackbar-container-color, ${c.color.inverseSurface}); font-size: var(--m3e-snackbar-supporting-text-font-size, ${c.typescale.standard.label.large.fontSize}); font-weight: var( --m3e-snackbar-supporting-text-font-weight, ${c.typescale.standard.label.large.fontWeight} ); line-height: var( --m3e-snackbar-supporting-text-line-height, ${c.typescale.standard.label.large.lineHeight} ); letter-spacing: var( --m3e-snackbar-supporting-text-tracking, ${c.typescale.standard.label.large.tracking} ); color: var(--m3e-snackbar-supporting-text-color, ${c.color.inverseOnSurface}); --m3e-text-button-label-text-color: var(--m3e-snackbar-action-text-color, ${c.color.inversePrimary}); --m3e-text-button-hover-label-text-color: var( --m3e-snackbar-action-text-color, ${c.color.inversePrimary} ); --m3e-text-button-hover-state-layer-color: var( --m3e-snackbar-action-text-color, ${c.color.inversePrimary} ); --m3e-text-button-focus-label-text-color: var( --m3e-snackbar-action-text-color, ${c.color.inversePrimary} ); --m3e-text-button-focus-state-layer-color: var( --m3e-snackbar-action-text-color, ${c.color.inversePrimary} ); --m3e-text-button-pressed-label-text-color: var( --m3e-snackbar-action-text-color, ${c.color.inversePrimary} ); --m3e-text-button-pressed-state-layer-color: var( --m3e-snackbar-action-text-color, ${c.color.inversePrimary} ); --m3e-standard-icon-button-icon-color: var( --m3e-snackbar-close-icon-color, ${c.color.inverseOnSurface} ); --m3e-standard-icon-button-hover-icon-color: var( --m3e-snackbar-close-icon-color, ${c.color.inverseOnSurface} ); --m3e-standard-icon-button-hover-state-layer-color: var( --m3e-snackbar-close-icon-color, ${c.color.inverseOnSurface} ); --m3e-standard-icon-button-focus-icon-color: var( --m3e-snackbar-close-icon-color, ${c.color.inverseOnSurface} ); --m3e-standard-icon-button-focus-state-layer-color: var( --m3e-snackbar-close-icon-color, ${c.color.inverseOnSurface} ); --m3e-standard-icon-button-pressed-icon-color: var( --m3e-snackbar-close-icon-color, ${c.color.inverseOnSurface} ); --m3e-standard-icon-button-pressed-state-layer-color: var( --m3e-snackbar-close-icon-color, ${c.color.inverseOnSurface} ); } :host([dismissible]) .base { padding-inline-end: 0.5rem; } .supporting-text { flex: 1 1 auto; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; line-clamp: 2; margin-block: var(--m3e-snackbar-supporting-text-margin-block, 0.875rem); } ::slotted([slot="close-icon"]), .close-icon { width: 1em; font-size: var(--m3e-icon-button-icon-size, 1.5rem) !important; } @media (forced-colors: active) { :host { background-color: Canvas; color: CanvasText; border-radius: ${c.shape.corner.small}; box-sizing: border-box; outline: 1px solid CanvasText; } }`,S.__current=null,p([u({type:Number})],S.prototype,"duration",void 0),p([u()],S.prototype,"action",void 0),p([u({type:Boolean,reflect:!0})],S.prototype,"dismissible",void 0),p([u({attribute:"close-label"})],S.prototype,"closeLabel",void 0),S=w=p([l("m3e-snackbar")],S);class P{static open(e,t,o,r){if(n)return;const a=document.createElement("m3e-snackbar");let i;a.append(document.createTextNode(e)),"string"==typeof t?a.action=t:"boolean"==typeof t?a.dismissible=t:i=t,"boolean"==typeof o?a.dismissible=o:i=o,r&&(i=r),void 0!==i?.duration&&(a.duration=i.duration),i?.closeLabel&&(a.closeLabel=i.closeLabel),a.addEventListener("toggle",e=>{"closed"===e.newState&&(d()?a.remove():a.addEventListener("transitionend",()=>a.remove(),{once:!0}),a.isActionTaken&&i?.actionCallback?.())}),(document.querySelector("m3e-theme")??document.body).append(a),a.showPopover()}static dismiss(){S.current?.hidePopover()}}globalThis.M3eSnackbar=P;export{P as M3eSnackbar,S as M3eSnackbarElement};
|
|
7
7
|
//# sourceMappingURL=snackbar.min.js.map
|
package/dist/snackbar.min.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"snackbar.min.js","sources":["../../src/snackbar/SnackbarElement.ts","../../src/snackbar/Snackbar.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unsafe-declaration-merging */\r\n\r\nimport { css, CSSResultGroup, html, LitElement, nothing, PropertyValues, unsafeCSS } from \"lit\";\r\nimport { property } from \"lit/decorators.js\";\r\n\r\nimport { customElement, DesignToken, registerStyleSheet, Role } from \"@m3e/web/core\";\r\n\r\nimport \"@m3e/web/button\";\r\nimport \"@m3e/web/icon-button\";\r\n\r\n/**\r\n * Presents short updates about application processes at the bottom of the screen.\r\n * @tag m3e-snackbar\r\n *\r\n * @slot - Renders the content of the snackbar.\r\n * @slot close-icon - Renders the icon of the button used to close the snackbar.\r\n *\r\n * @attr action - The label of the snackbar's action.\r\n * @attr close-label - The accessible label given to the button used to dismiss the snackbar.\r\n * @attr dismissible - Whether a button is presented that can be used to close the snackbar.\r\n * @attr duration - The length of time, in milliseconds, to wait before automatically dismissing the snackbar.\r\n *\r\n * @fires beforetoggle - Dispatched before the toggle state changes.\r\n * @fires toggle - Dispatched after the toggle state has changed.\r\n *\r\n * @cssprop --m3e-snackbar-margin - Vertical offset from the bottom of the viewport.\r\n * @cssprop --m3e-snackbar-container-shape - Border radius of the snackbar container.\r\n * @cssprop --m3e-snackbar-container-color - Background color of the snackbar.\r\n * @cssprop --m3e-snackbar-padding - Internal spacing of the snackbar container.\r\n * @cssprop --m3e-snackbar-min-width - Minimum width of the snackbar.\r\n * @cssprop --m3e-snackbar-max-width - Maximum width of the snackbar.\r\n */\r\n@customElement(\"m3e-snackbar\")\r\nexport class M3eSnackbarElement extends Role(LitElement, \"status\") {\r\n static {\r\n registerStyleSheet(css`\r\n m3e-snackbar {\r\n margin-inline: auto;\r\n }\r\n `);\r\n }\r\n /** The styles of the element. */\r\n static override styles: CSSResultGroup = css`\r\n :host {\r\n position: fixed;\r\n top: calc(100vh - var(--_snackbar-height, 0px) - var(--m3e-snackbar-margin, 1rem));\r\n display: inline-flex;\r\n align-items: center;\r\n min-width: var(--m3e-snackbar-min-width, 21.5rem);\r\n max-width: var(--m3e-snackbar-max-width, 42rem);\r\n visibility: hidden;\r\n border: none;\r\n margin: 0;\r\n padding: 0;\r\n opacity: 0;\r\n transform: scale(0.8);\r\n transition: ${unsafeCSS(\r\n `opacity ${DesignToken.motion.duration.short3} ${DesignToken.motion.easing.standard}, \r\n transform ${DesignToken.motion.duration.short3} ${DesignToken.motion.easing.standard}, \r\n overlay ${DesignToken.motion.duration.short3} ${DesignToken.motion.easing.standard} allow-discrete,\r\n visibility ${DesignToken.motion.duration.short3} ${DesignToken.motion.easing.standard} allow-discrete`,\r\n )};\r\n }\r\n :host::backdrop {\r\n background-color: transparent;\r\n }\r\n :host(:popover-open) {\r\n visibility: visible;\r\n opacity: 1;\r\n transform: scale(1);\r\n }\r\n @starting-style {\r\n :host(:popover-open) {\r\n opacity: 0;\r\n transform: scale(0.8);\r\n }\r\n }\r\n .base {\r\n display: inline-flex;\r\n align-items: center;\r\n flex: 1 1 auto;\r\n box-sizing: border-box;\r\n padding: var(--m3e-snackbar-padding, 0 1rem 0 1rem);\r\n border-radius: var(--m3e-snackbar-container-shape, ${DesignToken.shape.corner.extraSmall});\r\n background-color: var(--m3e-snackbar-container-color, ${DesignToken.color.inverseSurface});\r\n font-size: var(--m3e-snackbar-supporting-text-font-size, ${DesignToken.typescale.standard.label.large.fontSize});\r\n font-weight: var(\r\n --m3e-snackbar-supporting-text-font-weight,\r\n ${DesignToken.typescale.standard.label.large.fontWeight}\r\n );\r\n line-height: var(\r\n --m3e-snackbar-supporting-text-line-height,\r\n ${DesignToken.typescale.standard.label.large.lineHeight}\r\n );\r\n letter-spacing: var(\r\n --m3e-snackbar-supporting-text-tracking,\r\n ${DesignToken.typescale.standard.label.large.tracking}\r\n );\r\n color: var(--m3e-snackbar-supporting-text-color, ${DesignToken.color.inverseOnSurface});\r\n\r\n --m3e-text-button-label-text-color: var(--m3e-snackbar-action-text-color, ${DesignToken.color.inversePrimary});\r\n --m3e-text-button-hover-label-text-color: var(\r\n --m3e-snackbar-action-text-color,\r\n ${DesignToken.color.inversePrimary}\r\n );\r\n --m3e-text-button-hover-state-layer-color: var(\r\n --m3e-snackbar-action-text-color,\r\n ${DesignToken.color.inversePrimary}\r\n );\r\n --m3e-text-button-focus-label-text-color: var(\r\n --m3e-snackbar-action-text-color,\r\n ${DesignToken.color.inversePrimary}\r\n );\r\n --m3e-text-button-focus-state-layer-color: var(\r\n --m3e-snackbar-action-text-color,\r\n ${DesignToken.color.inversePrimary}\r\n );\r\n --m3e-text-button-pressed-label-text-color: var(\r\n --m3e-snackbar-action-text-color,\r\n ${DesignToken.color.inversePrimary}\r\n );\r\n --m3e-text-button-pressed-state-layer-color: var(\r\n --m3e-snackbar-action-text-color,\r\n ${DesignToken.color.inversePrimary}\r\n );\r\n --m3e-standard-icon-button-icon-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n --m3e-standard-icon-button-hover-icon-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n --m3e-standard-icon-button-hover-state-layer-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n --m3e-standard-icon-button-focus-icon-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n --m3e-standard-icon-button-focus-state-layer-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n --m3e-standard-icon-button-pressed-icon-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n --m3e-standard-icon-button-pressed-state-layer-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n }\r\n :host([dismissible]) .base {\r\n padding-inline-end: 0.5rem;\r\n }\r\n .supporting-text {\r\n flex: 1 1 auto;\r\n display: -webkit-box;\r\n -webkit-line-clamp: 2;\r\n -webkit-box-orient: vertical;\r\n overflow: hidden;\r\n line-clamp: 2;\r\n margin-block: var(--m3e-snackbar-supporting-text-margin-block, 0.875rem);\r\n }\r\n ::slotted([slot=\"close-icon\"]),\r\n .close-icon {\r\n width: 1em;\r\n font-size: var(--m3e-icon-button-icon-size, 1.5rem) !important;\r\n }\r\n @media (forced-colors: active) {\r\n :host {\r\n background-color: Canvas;\r\n color: CanvasText;\r\n border-radius: ${DesignToken.shape.corner.small};\r\n box-sizing: border-box;\r\n outline: 1px solid CanvasText;\r\n }\r\n }\r\n `;\r\n\r\n /** @private */ static __current: M3eSnackbarElement | null = null;\r\n\r\n /** @private */ #timeoutId = -1;\r\n /** @private */ #actionTaken = false;\r\n /** @private */ readonly #beforeToggleHandler = (e: ToggleEvent) => this.#handleBeforeToggle(e);\r\n\r\n /** The currently open snackbar. */\r\n static get current(): M3eSnackbarElement | null {\r\n return M3eSnackbarElement.__current;\r\n }\r\n\r\n /**\r\n * The length of time, in milliseconds, to wait before automatically dismissing the snackbar.\r\n * @default 3000\r\n */\r\n @property({ type: Number }) duration = 3000;\r\n\r\n /**\r\n * The label of the snackbar's action.\r\n * @default \"\"\r\n */\r\n @property() action = \"\";\r\n\r\n /**\r\n * Whether a button is presented that can be used to close the snackbar.\r\n * @default false\r\n */\r\n @property({ type: Boolean, reflect: true }) dismissible = false;\r\n\r\n /**\r\n * The accessible label given to the button used to dismiss the snackbar.\r\n * @default \"Close\"\r\n */\r\n @property({ attribute: \"close-label\" }) closeLabel = \"Close\";\r\n\r\n /** Whether the user clicked the action. */\r\n get isActionTaken(): boolean {\r\n return this.#actionTaken;\r\n }\r\n\r\n /** @inheritdoc */\r\n override connectedCallback(): void {\r\n super.connectedCallback();\r\n\r\n this.addEventListener(\"beforetoggle\", this.#beforeToggleHandler);\r\n this.setAttribute(\"popover\", \"manual\");\r\n this.ariaLive = \"polite\";\r\n }\r\n\r\n /** @inheritdoc */\r\n override disconnectedCallback(): void {\r\n super.disconnectedCallback();\r\n\r\n this.removeEventListener(\"beforetoggle\", this.#beforeToggleHandler);\r\n }\r\n\r\n /** @inheritdoc */\r\n protected override render() {\r\n return html`<div class=\"base\">\r\n <span class=\"supporting-text\"><slot></slot></span>\r\n ${this.#renderActionButton()} ${this.#renderCloseButton()}\r\n </div>`;\r\n }\r\n\r\n /** @inheritdoc */\r\n protected override updated(_changedProperties: PropertyValues): void {\r\n super.updated(_changedProperties);\r\n\r\n // After render, compute the (unscaled) height of the snackbar in order\r\n // to properly position it relative to the viewport.\r\n // top: calc(100vh - var(--_snackbar-height, 0px) - var(--m3e-snackbar-margin, 1rem));\r\n\r\n this.style.setProperty(\"--_snackbar-height\", `${this.getBoundingClientRect().height / 0.8}px`);\r\n }\r\n\r\n /** @private */\r\n #renderActionButton(): unknown {\r\n return !this.action ? nothing : html`<m3e-button @click=\"${this.#handleActionClick}\">${this.action}</m3e-button>`;\r\n }\r\n\r\n /** @private */\r\n #renderCloseButton(): unknown {\r\n return !this.dismissible\r\n ? nothing\r\n : html`<m3e-icon-button aria-label=\"${this.closeLabel}\" @click=\"${this.hidePopover}\">\r\n <slot name=\"close-icon\">\r\n <svg class=\"close-icon\" viewBox=\"0 -960 960 960\" fill=\"currentColor\">\r\n <path\r\n d=\"m256-200-56-56 224-224-224-224 56-56 224 224 224-224 56 56-224 224 224 224-56 56-224-224-224 224Z\"\r\n />\r\n </svg>\r\n </slot>\r\n </m3e-icon-button>`;\r\n }\r\n\r\n /** @private */\r\n #handleActionClick(): void {\r\n this.#actionTaken = true;\r\n this.hidePopover();\r\n }\r\n\r\n /** @private */\r\n #handleBeforeToggle(e: ToggleEvent): void {\r\n if (e.newState == \"open\") {\r\n M3eSnackbarElement.__current?.hidePopover();\r\n M3eSnackbarElement.__current = this;\r\n\r\n if (this.duration > 0) {\r\n this.#timeoutId = setTimeout(() => this.hidePopover(), this.duration);\r\n }\r\n } else {\r\n if (M3eSnackbarElement.__current === this) {\r\n M3eSnackbarElement.__current = null;\r\n }\r\n\r\n clearTimeout(this.#timeoutId);\r\n }\r\n }\r\n}\r\n\r\ninterface M3eSnackbarElementEventMap extends HTMLElementEventMap {\r\n beforetoggle: ToggleEvent;\r\n toggle: ToggleEvent;\r\n}\r\n\r\nexport interface M3eSnackbarElement {\r\n addEventListener<K extends keyof M3eSnackbarElementEventMap>(\r\n type: K,\r\n listener: (this: M3eSnackbarElement, ev: M3eSnackbarElementEventMap[K]) => void,\r\n options?: boolean | AddEventListenerOptions,\r\n ): void;\r\n\r\n addEventListener(\r\n type: string,\r\n listener: EventListenerOrEventListenerObject,\r\n options?: boolean | AddEventListenerOptions,\r\n ): void;\r\n\r\n removeEventListener<K extends keyof M3eSnackbarElementEventMap>(\r\n type: K,\r\n listener: (this: M3eSnackbarElement, ev: M3eSnackbarElementEventMap[K]) => void,\r\n options?: boolean | EventListenerOptions,\r\n ): void;\r\n\r\n removeEventListener(\r\n type: string,\r\n listener: EventListenerOrEventListenerObject,\r\n options?: boolean | EventListenerOptions,\r\n ): void;\r\n}\r\n\r\ndeclare global {\r\n interface HTMLElementTagNameMap {\r\n \"m3e-snackbar\": M3eSnackbarElement;\r\n }\r\n}\r\n","import { isServer } from \"lit\";\r\n\r\nimport { prefersReducedMotion } from \"@m3e/web/core\";\r\n\r\nimport { M3eSnackbarElement } from \"./SnackbarElement\";\r\n\r\n/** Encapsulates options used to present a snackbar message. */\r\nexport interface SnackbarOptions {\r\n /** The length of time, in milliseconds, to wait before automatically dismissing the snackbar. */\r\n duration?: number;\r\n\r\n /** The accessible label given to the close button used to dismiss the snackbar. */\r\n closeLabel?: string;\r\n\r\n /** The callback function invoked when the action is clicked. */\r\n actionCallback?: () => void;\r\n}\r\n\r\n/**\r\n * Presents short updates about application processes at the bottom of the screen from anywhere in an application.\r\n * @example\r\n * The following example illustrates basic usage.\r\n * ```js\r\n * M3eSnackbar.open(\"File deleted\");\r\n * ```\r\n * @example\r\n * The next example illustrates presenting a snackbar with an action and callback.\r\n * ```js\r\n * M3eSnackbar.open(\"File deleted\", \"Undo\", {\r\n * actionCallback: () => {\r\n * // Undo logic here\r\n * },\r\n * });\r\n */\r\nexport class M3eSnackbar {\r\n /**\r\n * Opens a snackbar with a message.\r\n * @param {string} message The message to show in the snackbar.\r\n * @param {SnackbarOptions | undefined} options Options that control the behavior of the snackbar.\r\n */\r\n static open(message: string, options?: SnackbarOptions): void;\r\n\r\n /**\r\n * Opens a snackbar with a message and action.\r\n * @param {string} message The message to show in the snackbar.\r\n * @param {string} action The label for the snackbar action.\r\n * @param {SnackbarOptions | undefined} options Options that control the behavior of the snackbar.\r\n */\r\n static open(message: string, action: string, options?: SnackbarOptions): void;\r\n\r\n /**\r\n * Opens a snackbar with a message, action and optional close affordance.\r\n * @param {string} message The message to show in the snackbar.\r\n * @param {string} action The label for the snackbar action.\r\n * @param {boolean} dismissible Whether to present close affordance.\r\n * @param {SnackbarOptions | undefined} options Options that control the behavior of the snackbar.\r\n */\r\n static open(message: string, action: string, dismissible: boolean, options?: SnackbarOptions): void;\r\n\r\n /**\r\n * Opens a snackbar with a message and optional close affordance.\r\n * @param {string} message The message to show in the snackbar.\r\n * @param {boolean} dismissible Whether to present close affordance.\r\n * @param {SnackbarOptions | undefined} options Options that control the behavior of the snackbar.\r\n */\r\n static open(message: string, dismissible: boolean, options?: SnackbarOptions): void;\r\n\r\n static open(\r\n message: string,\r\n actionOrDismissibleOrOptions?: string | boolean | SnackbarOptions,\r\n dismissibleOrOptions?: boolean | SnackbarOptions,\r\n options?: SnackbarOptions,\r\n ): void {\r\n if (isServer) return;\r\n\r\n const snackbar = document.createElement(\"m3e-snackbar\");\r\n snackbar.append(document.createTextNode(message));\r\n\r\n let actualOptions: SnackbarOptions | undefined = undefined;\r\n\r\n if (typeof actionOrDismissibleOrOptions == \"string\") {\r\n snackbar.action = actionOrDismissibleOrOptions;\r\n } else if (typeof actionOrDismissibleOrOptions == \"boolean\") {\r\n snackbar.dismissible = actionOrDismissibleOrOptions;\r\n } else {\r\n actualOptions = actionOrDismissibleOrOptions;\r\n }\r\n\r\n if (typeof dismissibleOrOptions == \"boolean\") {\r\n snackbar.dismissible = dismissibleOrOptions;\r\n } else {\r\n actualOptions = dismissibleOrOptions;\r\n }\r\n\r\n if (options) {\r\n actualOptions = options;\r\n }\r\n\r\n if (actualOptions?.duration !== undefined) {\r\n snackbar.duration = actualOptions.duration;\r\n }\r\n if (actualOptions?.closeLabel) {\r\n snackbar.closeLabel = actualOptions.closeLabel;\r\n }\r\n\r\n snackbar.addEventListener(\"toggle\", (e) => {\r\n if (e.newState === \"closed\") {\r\n if (prefersReducedMotion()) {\r\n snackbar.remove();\r\n } else {\r\n snackbar.addEventListener(\"transitionend\", () => snackbar.remove(), { once: true });\r\n }\r\n\r\n if (snackbar.isActionTaken) {\r\n actualOptions?.actionCallback?.();\r\n }\r\n }\r\n });\r\n\r\n (document.querySelector(\"m3e-theme\") ?? document.body).append(snackbar);\r\n snackbar.showPopover();\r\n }\r\n\r\n /** Dismisses the currently visible snackbar. */\r\n static dismiss(): void {\r\n M3eSnackbarElement.current?.hidePopover();\r\n }\r\n}\r\n\r\n// This is the class type, as opposed to an instance of the class.\r\ntype M3eSnackbarClass = typeof M3eSnackbar;\r\n\r\ndeclare global {\r\n /** Presents short updates about application processes at the bottom of the screen from anywhere in an application. */\r\n var M3eSnackbar: M3eSnackbarClass;\r\n}\r\n\r\nglobalThis.M3eSnackbar = M3eSnackbar;\r\n"],"names":["M3eSnackbarElement","M3eSnackbarElement_1","Role","LitElement","constructor","_M3eSnackbarElement_timeoutId","set","this","_M3eSnackbarElement_actionTaken","_M3eSnackbarElement_beforeToggleHandler","e","__classPrivateFieldGet","call","duration","action","dismissible","closeLabel","current","__current","isActionTaken","connectedCallback","super","addEventListener","setAttribute","ariaLive","disconnectedCallback","removeEventListener","render","html","_M3eSnackbarElement_instances","_M3eSnackbarElement_renderActionButton","_M3eSnackbarElement_renderCloseButton","updated","_changedProperties","style","setProperty","getBoundingClientRect","height","_M3eSnackbarElement_handleActionClick","nothing","hidePopover","__classPrivateFieldSet","newState","setTimeout","clearTimeout","registerStyleSheet","css","styles","unsafeCSS","DesignToken","motion","short3","easing","standard","shape","corner","extraSmall","color","inverseSurface","typescale","label","large","fontSize","fontWeight","lineHeight","tracking","inverseOnSurface","inversePrimary","small","__decorate","property","type","Number","prototype","Boolean","reflect","attribute","customElement","M3eSnackbar","open","message","actionOrDismissibleOrOptions","dismissibleOrOptions","options","isServer","snackbar","document","createElement","actualOptions","append","createTextNode","undefined","prefersReducedMotion","remove","once","actionCallback","querySelector","body","showPopover","dismiss","globalThis"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"snackbar.min.js","sources":["../../src/snackbar/SnackbarElement.ts","../../src/snackbar/Snackbar.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unsafe-declaration-merging */\r\n\r\nimport { css, CSSResultGroup, html, LitElement, nothing, PropertyValues, unsafeCSS } from \"lit\";\r\nimport { property } from \"lit/decorators.js\";\r\n\r\nimport { customElement, DesignToken, registerStyleSheet, Role } from \"@m3e/web/core\";\r\n\r\nimport \"@m3e/web/button\";\r\nimport \"@m3e/web/icon-button\";\r\n\r\n/**\r\n * Presents short updates about application processes at the bottom of the screen.\r\n * @tag m3e-snackbar\r\n *\r\n * @slot - Renders the content of the snackbar.\r\n * @slot close-icon - Renders the icon of the button used to close the snackbar.\r\n *\r\n * @attr action - The label of the snackbar's action.\r\n * @attr close-label - The accessible label given to the button used to dismiss the snackbar.\r\n * @attr dismissible - Whether a button is presented that can be used to close the snackbar.\r\n * @attr duration - The length of time, in milliseconds, to wait before automatically dismissing the snackbar.\r\n *\r\n * @fires beforetoggle - Dispatched before the toggle state changes.\r\n * @fires toggle - Dispatched after the toggle state has changed.\r\n *\r\n * @cssprop --m3e-snackbar-margin - Vertical offset from the bottom of the viewport.\r\n * @cssprop --m3e-snackbar-container-shape - Border radius of the snackbar container.\r\n * @cssprop --m3e-snackbar-container-color - Background color of the snackbar.\r\n * @cssprop --m3e-snackbar-padding - Internal spacing of the snackbar container.\r\n * @cssprop --m3e-snackbar-min-width - Minimum width of the snackbar.\r\n * @cssprop --m3e-snackbar-max-width - Maximum width of the snackbar.\r\n */\r\n@customElement(\"m3e-snackbar\")\r\nexport class M3eSnackbarElement extends Role(LitElement, \"status\") {\r\n static {\r\n registerStyleSheet(css`\r\n m3e-snackbar {\r\n margin-inline: auto;\r\n }\r\n `);\r\n }\r\n /** The styles of the element. */\r\n static override styles: CSSResultGroup = css`\r\n :host {\r\n position: fixed;\r\n top: calc(100vh - var(--_snackbar-height, 0px) - var(--m3e-snackbar-margin, 1rem));\r\n display: inline-flex;\r\n align-items: center;\r\n min-width: var(--m3e-snackbar-min-width, 21.5rem);\r\n max-width: var(--m3e-snackbar-max-width, 42rem);\r\n visibility: hidden;\r\n border: none;\r\n margin: 0;\r\n padding: 0;\r\n opacity: 0;\r\n transform: scaleY(0.8);\r\n transform-origin: bottom;\r\n transition: ${unsafeCSS(\r\n `opacity ${DesignToken.motion.duration.short3} ${DesignToken.motion.easing.standard}, \r\n transform ${DesignToken.motion.duration.short3} ${DesignToken.motion.easing.standard}, \r\n overlay ${DesignToken.motion.duration.short3} ${DesignToken.motion.easing.standard} allow-discrete,\r\n visibility ${DesignToken.motion.duration.short3} ${DesignToken.motion.easing.standard} allow-discrete`,\r\n )};\r\n }\r\n :host::backdrop {\r\n background-color: transparent;\r\n }\r\n :host(:popover-open) {\r\n visibility: visible;\r\n opacity: 1;\r\n transform: scaleY(1);\r\n }\r\n @starting-style {\r\n :host(:popover-open) {\r\n opacity: 0;\r\n transform: scaleY(0.8);\r\n }\r\n }\r\n .base {\r\n display: inline-flex;\r\n align-items: center;\r\n flex: 1 1 auto;\r\n box-sizing: border-box;\r\n padding: var(--m3e-snackbar-padding, 0 1rem 0 1rem);\r\n border-radius: var(--m3e-snackbar-container-shape, ${DesignToken.shape.corner.extraSmall});\r\n background-color: var(--m3e-snackbar-container-color, ${DesignToken.color.inverseSurface});\r\n font-size: var(--m3e-snackbar-supporting-text-font-size, ${DesignToken.typescale.standard.label.large.fontSize});\r\n font-weight: var(\r\n --m3e-snackbar-supporting-text-font-weight,\r\n ${DesignToken.typescale.standard.label.large.fontWeight}\r\n );\r\n line-height: var(\r\n --m3e-snackbar-supporting-text-line-height,\r\n ${DesignToken.typescale.standard.label.large.lineHeight}\r\n );\r\n letter-spacing: var(\r\n --m3e-snackbar-supporting-text-tracking,\r\n ${DesignToken.typescale.standard.label.large.tracking}\r\n );\r\n color: var(--m3e-snackbar-supporting-text-color, ${DesignToken.color.inverseOnSurface});\r\n\r\n --m3e-text-button-label-text-color: var(--m3e-snackbar-action-text-color, ${DesignToken.color.inversePrimary});\r\n --m3e-text-button-hover-label-text-color: var(\r\n --m3e-snackbar-action-text-color,\r\n ${DesignToken.color.inversePrimary}\r\n );\r\n --m3e-text-button-hover-state-layer-color: var(\r\n --m3e-snackbar-action-text-color,\r\n ${DesignToken.color.inversePrimary}\r\n );\r\n --m3e-text-button-focus-label-text-color: var(\r\n --m3e-snackbar-action-text-color,\r\n ${DesignToken.color.inversePrimary}\r\n );\r\n --m3e-text-button-focus-state-layer-color: var(\r\n --m3e-snackbar-action-text-color,\r\n ${DesignToken.color.inversePrimary}\r\n );\r\n --m3e-text-button-pressed-label-text-color: var(\r\n --m3e-snackbar-action-text-color,\r\n ${DesignToken.color.inversePrimary}\r\n );\r\n --m3e-text-button-pressed-state-layer-color: var(\r\n --m3e-snackbar-action-text-color,\r\n ${DesignToken.color.inversePrimary}\r\n );\r\n --m3e-standard-icon-button-icon-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n --m3e-standard-icon-button-hover-icon-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n --m3e-standard-icon-button-hover-state-layer-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n --m3e-standard-icon-button-focus-icon-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n --m3e-standard-icon-button-focus-state-layer-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n --m3e-standard-icon-button-pressed-icon-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n --m3e-standard-icon-button-pressed-state-layer-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n }\r\n :host([dismissible]) .base {\r\n padding-inline-end: 0.5rem;\r\n }\r\n .supporting-text {\r\n flex: 1 1 auto;\r\n display: -webkit-box;\r\n -webkit-line-clamp: 2;\r\n -webkit-box-orient: vertical;\r\n overflow: hidden;\r\n line-clamp: 2;\r\n margin-block: var(--m3e-snackbar-supporting-text-margin-block, 0.875rem);\r\n }\r\n ::slotted([slot=\"close-icon\"]),\r\n .close-icon {\r\n width: 1em;\r\n font-size: var(--m3e-icon-button-icon-size, 1.5rem) !important;\r\n }\r\n @media (forced-colors: active) {\r\n :host {\r\n background-color: Canvas;\r\n color: CanvasText;\r\n border-radius: ${DesignToken.shape.corner.small};\r\n box-sizing: border-box;\r\n outline: 1px solid CanvasText;\r\n }\r\n }\r\n `;\r\n\r\n /** @private */ static __current: M3eSnackbarElement | null = null;\r\n\r\n /** @private */ #timeoutId = -1;\r\n /** @private */ #actionTaken = false;\r\n /** @private */ readonly #beforeToggleHandler = (e: ToggleEvent) => this.#handleBeforeToggle(e);\r\n\r\n /** The currently open snackbar. */\r\n static get current(): M3eSnackbarElement | null {\r\n return M3eSnackbarElement.__current;\r\n }\r\n\r\n /**\r\n * The length of time, in milliseconds, to wait before automatically dismissing the snackbar.\r\n * @default 3000\r\n */\r\n @property({ type: Number }) duration = 3000;\r\n\r\n /**\r\n * The label of the snackbar's action.\r\n * @default \"\"\r\n */\r\n @property() action = \"\";\r\n\r\n /**\r\n * Whether a button is presented that can be used to close the snackbar.\r\n * @default false\r\n */\r\n @property({ type: Boolean, reflect: true }) dismissible = false;\r\n\r\n /**\r\n * The accessible label given to the button used to dismiss the snackbar.\r\n * @default \"Close\"\r\n */\r\n @property({ attribute: \"close-label\" }) closeLabel = \"Close\";\r\n\r\n /** Whether the user clicked the action. */\r\n get isActionTaken(): boolean {\r\n return this.#actionTaken;\r\n }\r\n\r\n /** @inheritdoc */\r\n override connectedCallback(): void {\r\n super.connectedCallback();\r\n\r\n this.addEventListener(\"beforetoggle\", this.#beforeToggleHandler);\r\n this.setAttribute(\"popover\", \"manual\");\r\n this.ariaLive = \"polite\";\r\n }\r\n\r\n /** @inheritdoc */\r\n override disconnectedCallback(): void {\r\n super.disconnectedCallback();\r\n\r\n this.removeEventListener(\"beforetoggle\", this.#beforeToggleHandler);\r\n }\r\n\r\n /** @inheritdoc */\r\n protected override render() {\r\n return html`<div class=\"base\">\r\n <span class=\"supporting-text\"><slot></slot></span>\r\n ${this.#renderActionButton()} ${this.#renderCloseButton()}\r\n </div>`;\r\n }\r\n\r\n /** @inheritdoc */\r\n protected override updated(_changedProperties: PropertyValues): void {\r\n super.updated(_changedProperties);\r\n\r\n // After render, compute the (unscaled) height of the snackbar in order\r\n // to properly position it relative to the viewport.\r\n // top: calc(100vh - var(--_snackbar-height, 0px) - var(--m3e-snackbar-margin, 1rem));\r\n\r\n this.style.setProperty(\"--_snackbar-height\", `${this.getBoundingClientRect().height / 0.8}px`);\r\n }\r\n\r\n /** @private */\r\n #renderActionButton(): unknown {\r\n return !this.action ? nothing : html`<m3e-button @click=\"${this.#handleActionClick}\">${this.action}</m3e-button>`;\r\n }\r\n\r\n /** @private */\r\n #renderCloseButton(): unknown {\r\n return !this.dismissible\r\n ? nothing\r\n : html`<m3e-icon-button aria-label=\"${this.closeLabel}\" @click=\"${this.hidePopover}\">\r\n <slot name=\"close-icon\">\r\n <svg class=\"close-icon\" viewBox=\"0 -960 960 960\" fill=\"currentColor\">\r\n <path\r\n d=\"m256-200-56-56 224-224-224-224 56-56 224 224 224-224 56 56-224 224 224 224-56 56-224-224-224 224Z\"\r\n />\r\n </svg>\r\n </slot>\r\n </m3e-icon-button>`;\r\n }\r\n\r\n /** @private */\r\n #handleActionClick(): void {\r\n this.#actionTaken = true;\r\n this.hidePopover();\r\n }\r\n\r\n /** @private */\r\n #handleBeforeToggle(e: ToggleEvent): void {\r\n if (e.newState == \"open\") {\r\n M3eSnackbarElement.__current?.hidePopover();\r\n M3eSnackbarElement.__current = this;\r\n\r\n if (this.duration > 0) {\r\n this.#timeoutId = setTimeout(() => this.hidePopover(), this.duration);\r\n }\r\n } else {\r\n if (M3eSnackbarElement.__current === this) {\r\n M3eSnackbarElement.__current = null;\r\n }\r\n\r\n clearTimeout(this.#timeoutId);\r\n }\r\n }\r\n}\r\n\r\ninterface M3eSnackbarElementEventMap extends HTMLElementEventMap {\r\n beforetoggle: ToggleEvent;\r\n toggle: ToggleEvent;\r\n}\r\n\r\nexport interface M3eSnackbarElement {\r\n addEventListener<K extends keyof M3eSnackbarElementEventMap>(\r\n type: K,\r\n listener: (this: M3eSnackbarElement, ev: M3eSnackbarElementEventMap[K]) => void,\r\n options?: boolean | AddEventListenerOptions,\r\n ): void;\r\n\r\n addEventListener(\r\n type: string,\r\n listener: EventListenerOrEventListenerObject,\r\n options?: boolean | AddEventListenerOptions,\r\n ): void;\r\n\r\n removeEventListener<K extends keyof M3eSnackbarElementEventMap>(\r\n type: K,\r\n listener: (this: M3eSnackbarElement, ev: M3eSnackbarElementEventMap[K]) => void,\r\n options?: boolean | EventListenerOptions,\r\n ): void;\r\n\r\n removeEventListener(\r\n type: string,\r\n listener: EventListenerOrEventListenerObject,\r\n options?: boolean | EventListenerOptions,\r\n ): void;\r\n}\r\n\r\ndeclare global {\r\n interface HTMLElementTagNameMap {\r\n \"m3e-snackbar\": M3eSnackbarElement;\r\n }\r\n}\r\n","import { isServer } from \"lit\";\r\n\r\nimport { prefersReducedMotion } from \"@m3e/web/core\";\r\n\r\nimport { M3eSnackbarElement } from \"./SnackbarElement\";\r\n\r\n/** Encapsulates options used to present a snackbar message. */\r\nexport interface SnackbarOptions {\r\n /** The length of time, in milliseconds, to wait before automatically dismissing the snackbar. */\r\n duration?: number;\r\n\r\n /** The accessible label given to the close button used to dismiss the snackbar. */\r\n closeLabel?: string;\r\n\r\n /** The callback function invoked when the action is clicked. */\r\n actionCallback?: () => void;\r\n}\r\n\r\n/**\r\n * Presents short updates about application processes at the bottom of the screen from anywhere in an application.\r\n * @example\r\n * The following example illustrates basic usage.\r\n * ```js\r\n * M3eSnackbar.open(\"File deleted\");\r\n * ```\r\n * @example\r\n * The next example illustrates presenting a snackbar with an action and callback.\r\n * ```js\r\n * M3eSnackbar.open(\"File deleted\", \"Undo\", {\r\n * actionCallback: () => {\r\n * // Undo logic here\r\n * },\r\n * });\r\n */\r\nexport class M3eSnackbar {\r\n /**\r\n * Opens a snackbar with a message.\r\n * @param {string} message The message to show in the snackbar.\r\n * @param {SnackbarOptions | undefined} options Options that control the behavior of the snackbar.\r\n */\r\n static open(message: string, options?: SnackbarOptions): void;\r\n\r\n /**\r\n * Opens a snackbar with a message and action.\r\n * @param {string} message The message to show in the snackbar.\r\n * @param {string} action The label for the snackbar action.\r\n * @param {SnackbarOptions | undefined} options Options that control the behavior of the snackbar.\r\n */\r\n static open(message: string, action: string, options?: SnackbarOptions): void;\r\n\r\n /**\r\n * Opens a snackbar with a message, action and optional close affordance.\r\n * @param {string} message The message to show in the snackbar.\r\n * @param {string} action The label for the snackbar action.\r\n * @param {boolean} dismissible Whether to present close affordance.\r\n * @param {SnackbarOptions | undefined} options Options that control the behavior of the snackbar.\r\n */\r\n static open(message: string, action: string, dismissible: boolean, options?: SnackbarOptions): void;\r\n\r\n /**\r\n * Opens a snackbar with a message and optional close affordance.\r\n * @param {string} message The message to show in the snackbar.\r\n * @param {boolean} dismissible Whether to present close affordance.\r\n * @param {SnackbarOptions | undefined} options Options that control the behavior of the snackbar.\r\n */\r\n static open(message: string, dismissible: boolean, options?: SnackbarOptions): void;\r\n\r\n static open(\r\n message: string,\r\n actionOrDismissibleOrOptions?: string | boolean | SnackbarOptions,\r\n dismissibleOrOptions?: boolean | SnackbarOptions,\r\n options?: SnackbarOptions,\r\n ): void {\r\n if (isServer) return;\r\n\r\n const snackbar = document.createElement(\"m3e-snackbar\");\r\n snackbar.append(document.createTextNode(message));\r\n\r\n let actualOptions: SnackbarOptions | undefined = undefined;\r\n\r\n if (typeof actionOrDismissibleOrOptions == \"string\") {\r\n snackbar.action = actionOrDismissibleOrOptions;\r\n } else if (typeof actionOrDismissibleOrOptions == \"boolean\") {\r\n snackbar.dismissible = actionOrDismissibleOrOptions;\r\n } else {\r\n actualOptions = actionOrDismissibleOrOptions;\r\n }\r\n\r\n if (typeof dismissibleOrOptions == \"boolean\") {\r\n snackbar.dismissible = dismissibleOrOptions;\r\n } else {\r\n actualOptions = dismissibleOrOptions;\r\n }\r\n\r\n if (options) {\r\n actualOptions = options;\r\n }\r\n\r\n if (actualOptions?.duration !== undefined) {\r\n snackbar.duration = actualOptions.duration;\r\n }\r\n if (actualOptions?.closeLabel) {\r\n snackbar.closeLabel = actualOptions.closeLabel;\r\n }\r\n\r\n snackbar.addEventListener(\"toggle\", (e) => {\r\n if (e.newState === \"closed\") {\r\n if (prefersReducedMotion()) {\r\n snackbar.remove();\r\n } else {\r\n snackbar.addEventListener(\"transitionend\", () => snackbar.remove(), { once: true });\r\n }\r\n\r\n if (snackbar.isActionTaken) {\r\n actualOptions?.actionCallback?.();\r\n }\r\n }\r\n });\r\n\r\n (document.querySelector(\"m3e-theme\") ?? document.body).append(snackbar);\r\n snackbar.showPopover();\r\n }\r\n\r\n /** Dismisses the currently visible snackbar. */\r\n static dismiss(): void {\r\n M3eSnackbarElement.current?.hidePopover();\r\n }\r\n}\r\n\r\n// This is the class type, as opposed to an instance of the class.\r\ntype M3eSnackbarClass = typeof M3eSnackbar;\r\n\r\ndeclare global {\r\n /** Presents short updates about application processes at the bottom of the screen from anywhere in an application. */\r\n var M3eSnackbar: M3eSnackbarClass;\r\n}\r\n\r\nglobalThis.M3eSnackbar = M3eSnackbar;\r\n"],"names":["M3eSnackbarElement","M3eSnackbarElement_1","Role","LitElement","constructor","_M3eSnackbarElement_timeoutId","set","this","_M3eSnackbarElement_actionTaken","_M3eSnackbarElement_beforeToggleHandler","e","__classPrivateFieldGet","call","duration","action","dismissible","closeLabel","current","__current","isActionTaken","connectedCallback","super","addEventListener","setAttribute","ariaLive","disconnectedCallback","removeEventListener","render","html","_M3eSnackbarElement_instances","_M3eSnackbarElement_renderActionButton","_M3eSnackbarElement_renderCloseButton","updated","_changedProperties","style","setProperty","getBoundingClientRect","height","_M3eSnackbarElement_handleActionClick","nothing","hidePopover","__classPrivateFieldSet","newState","setTimeout","clearTimeout","registerStyleSheet","css","styles","unsafeCSS","DesignToken","motion","short3","easing","standard","shape","corner","extraSmall","color","inverseSurface","typescale","label","large","fontSize","fontWeight","lineHeight","tracking","inverseOnSurface","inversePrimary","small","__decorate","property","type","Number","prototype","Boolean","reflect","attribute","customElement","M3eSnackbar","open","message","actionOrDismissibleOrOptions","dismissibleOrOptions","options","isServer","snackbar","document","createElement","actualOptions","append","createTextNode","undefined","prefersReducedMotion","remove","once","actionCallback","querySelector","body","showPopover","dismiss","globalThis"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonElement.d.ts","sourceRoot":"","sources":["../../../src/button/ButtonElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAQ,UAAU,EAAW,cAAc,EAAE,MAAM,KAAK,CAAC;AAGhF,OAAO,EAuBL,oBAAoB,
|
|
1
|
+
{"version":3,"file":"ButtonElement.d.ts","sourceRoot":"","sources":["../../../src/button/ButtonElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAQ,UAAU,EAAW,cAAc,EAAE,MAAM,KAAK,CAAC;AAGhF,OAAO,EAuBL,oBAAoB,EAGrB,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;;AAIhD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqbG;AACH,qBACa,gBAAiB,SAAQ,qBAIrC;;IACC,iCAAiC;IACjC,OAAgB,MAAM,EAAE,cAAc,CAAsD;IAE5F,eAAe,CAAiB,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAc;IACrE,eAAe,CAAsB,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAC,CAAsB;IACvF,eAAe,CAAuB,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAC,CAAsB;IACxF,eAAe,CAAwB,OAAO,CAAC,QAAQ,CAAC,WAAW,CAAC,CAAuB;IAC3F,eAAe,CAAmB,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAmB;;IAgC9E;;;OAGG;IAC0B,OAAO,EAAE,aAAa,CAAU;IAE7D;;;OAGG;IAC0B,KAAK,EAAE,WAAW,CAAa;IAE5D;;;OAGG;IAC0B,IAAI,EAAE,UAAU,CAAW;IAExD;;;OAGG;IACyC,MAAM,UAAS;IAE3D;;;OAGG;IACyC,QAAQ,UAAS;IAE7D,yDAAyD;IACzD,IAAI,OAAO,YAEV;IAED,kBAAkB;IACT,MAAM,IAAI,OAAO;IA0B1B,kBAAkB;IACT,iBAAiB,IAAI,IAAI;IAKlC,kBAAkB;IACT,oBAAoB,IAAI,IAAI;IAYrC,kBAAkB;cACC,YAAY,CAAC,kBAAkB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAK/E,kBAAkB;cACC,OAAO,CAAC,kBAAkB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IA0C1E,eAAe;IAEf,OAAO,CAAC,aAAa;CA8FtB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,YAAY,EAAE,gBAAgB,CAAC;KAChC;CACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonSizeStyle.d.ts","sourceRoot":"","sources":["../../../../src/button/styles/ButtonSizeStyle.ts"],"names":[],"mappings":"AAAA,OAAO,EAAkB,cAAc,EAAa,MAAM,KAAK,CAAC;
|
|
1
|
+
{"version":3,"file":"ButtonSizeStyle.d.ts","sourceRoot":"","sources":["../../../../src/button/styles/ButtonSizeStyle.ts"],"names":[],"mappings":"AAAA,OAAO,EAAkB,cAAc,EAAa,MAAM,KAAK,CAAC;AA0GhE;;;GAGG;AACH,eAAO,MAAM,eAAe,EAAE,cAM7B,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonStyle.d.ts","sourceRoot":"","sources":["../../../../src/button/styles/ButtonStyle.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,cAAc,EAAa,MAAM,KAAK,CAAC;AAIrD;;;GAGG;AACH,eAAO,MAAM,WAAW,EAAE,
|
|
1
|
+
{"version":3,"file":"ButtonStyle.d.ts","sourceRoot":"","sources":["../../../../src/button/styles/ButtonStyle.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,cAAc,EAAa,MAAM,KAAK,CAAC;AAIrD;;;GAGG;AACH,eAAO,MAAM,WAAW,EAAE,cA+MzB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonGroupElement.d.ts","sourceRoot":"","sources":["../../../src/button-group/ButtonGroupElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,cAAc,EAAQ,UAAU,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;
|
|
1
|
+
{"version":3,"file":"ButtonGroupElement.d.ts","sourceRoot":"","sources":["../../../src/button-group/ButtonGroupElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,cAAc,EAAQ,UAAU,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAe5E,OAAO,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AACnD,OAAO,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAE5D,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;;AAEpD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqDG;AACH,qBACa,qBAAsB,SAAQ,0BAAyB;;IAClE,iCAAiC;IACjC,OAAgB,MAAM,EAAE,cAAc,CA6MpC;IAUc,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAc;IAErD;;;OAGG;IAC0B,OAAO,EAAE,kBAAkB,CAAc;IAEtE;;;OAGG;IAC0B,IAAI,EAAE,eAAe,CAAW;IAE7D;;;OAGG;IAC0B,KAAK,UAAS;IAE3C,0CAA0C;IAE1C,QAAQ,CAAC,OAAO,EAAG,aAAa,CAAC,gBAAgB,GAAG,oBAAoB,CAAC,CAAC;IAE1E,kBAAkB;IACT,iBAAiB,IAAI,IAAI;IAQlC,kBAAkB;IACT,oBAAoB,IAAI,IAAI;IAMrC,kBAAkB;cACC,MAAM,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAWxE,kBAAkB;cACC,MAAM,IAAI,OAAO;CA4FrC;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,kBAAkB,EAAE,qBAAqB,CAAC;KAC3C;CACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CardStyle.d.ts","sourceRoot":"","sources":["../../../../src/card/styles/CardStyle.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,SAAS,EAAa,MAAM,KAAK,CAAC;AAOhD;;;GAGG;AACH,eAAO,MAAM,SAAS,EAAE,
|
|
1
|
+
{"version":3,"file":"CardStyle.d.ts","sourceRoot":"","sources":["../../../../src/card/styles/CardStyle.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,SAAS,EAAa,MAAM,KAAK,CAAC;AAOhD;;;GAGG;AACH,eAAO,MAAM,SAAS,EAAE,SA2KvB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ContentPaneElement.d.ts","sourceRoot":"","sources":["../../../src/content-pane/ContentPaneElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,cAAc,EAAQ,UAAU,EAAE,cAAc,EAAa,MAAM,KAAK,CAAC;;AAIvF;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,qBACa,qBAAsB,SAAQ,0BAA+B;;IACxE,iCAAiC;IACjC,OAAgB,MAAM,EAAE,cAAc,
|
|
1
|
+
{"version":3,"file":"ContentPaneElement.d.ts","sourceRoot":"","sources":["../../../src/content-pane/ContentPaneElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,cAAc,EAAQ,UAAU,EAAE,cAAc,EAAa,MAAM,KAAK,CAAC;;AAIvF;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,qBACa,qBAAsB,SAAQ,0BAA+B;;IACxE,iCAAiC;IACjC,OAAgB,MAAM,EAAE,cAAc,CAsCpC;IAEF,kBAAkB;IACT,mBAAmB,IAAI,IAAI;IAKpC,kBAAkB;cACC,YAAY,CAAC,kBAAkB,EAAE,cAAc,GAAG,IAAI;IAKzE,kBAAkB;cACC,MAAM,IAAI,OAAO;CAmBrC;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,kBAAkB,EAAE,qBAAqB,CAAC;KAC3C;CACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ScrollController.d.ts","sourceRoot":"","sources":["../../../../../src/core/shared/controllers/ScrollController.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,sBAAsB,EAAE,MAAM,KAAK,CAAC;AAE7C,OAAO,EAAE,qBAAqB,EAAE,wBAAwB,EAAE,MAAM,yBAAyB,CAAC;AAG1F,4EAA4E;AAC5E,MAAM,MAAM,wBAAwB,GAAG,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;AAEjE,mEAAmE;AACnE,MAAM,WAAW,uBAAwB,SAAQ,wBAAwB;IACvE,8DAA8D;IAC9D,QAAQ,EAAE,wBAAwB,CAAC;IAEnC,yCAAyC;IACzC,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,wGAAwG;AACxG,qBAAa,gBAAiB,SAAQ,qBAAqB;;IAMzD;;;;OAIG;gBACS,IAAI,EAAE,sBAAsB,GAAG,WAAW,EAAE,OAAO,EAAE,uBAAuB;IAMxF;;;;OAIG;IACH,mBAAmB,CAAC,MAAM,EAAE,WAAW,GAAG,OAAO,EAAE,GAAG,SAAS;IAI/D,kBAAkB;cACC,QAAQ,CAAC,MAAM,EAAE,WAAW,GAAG,IAAI;IAYtD,kBAAkB;cACC,UAAU,CAAC,MAAM,EAAE,WAAW,GAAG,IAAI;
|
|
1
|
+
{"version":3,"file":"ScrollController.d.ts","sourceRoot":"","sources":["../../../../../src/core/shared/controllers/ScrollController.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,sBAAsB,EAAE,MAAM,KAAK,CAAC;AAE7C,OAAO,EAAE,qBAAqB,EAAE,wBAAwB,EAAE,MAAM,yBAAyB,CAAC;AAG1F,4EAA4E;AAC5E,MAAM,MAAM,wBAAwB,GAAG,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;AAEjE,mEAAmE;AACnE,MAAM,WAAW,uBAAwB,SAAQ,wBAAwB;IACvE,8DAA8D;IAC9D,QAAQ,EAAE,wBAAwB,CAAC;IAEnC,yCAAyC;IACzC,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,wGAAwG;AACxG,qBAAa,gBAAiB,SAAQ,qBAAqB;;IAMzD;;;;OAIG;gBACS,IAAI,EAAE,sBAAsB,GAAG,WAAW,EAAE,OAAO,EAAE,uBAAuB;IAMxF;;;;OAIG;IACH,mBAAmB,CAAC,MAAM,EAAE,WAAW,GAAG,OAAO,EAAE,GAAG,SAAS;IAI/D,kBAAkB;cACC,QAAQ,CAAC,MAAM,EAAE,WAAW,GAAG,IAAI;IAYtD,kBAAkB;cACC,UAAU,CAAC,MAAM,EAAE,WAAW,GAAG,IAAI;IA+DxD,eAAe;IAEf,OAAO,CAAC,iBAAiB;CAG1B"}
|
|
@@ -362,5 +362,23 @@ export declare const DesignToken: {
|
|
|
362
362
|
readonly scale: import("lit").CSSResult;
|
|
363
363
|
readonly size: import("lit").CSSResult;
|
|
364
364
|
};
|
|
365
|
+
/** Design tokens that control measurement. */
|
|
366
|
+
readonly measurement: {
|
|
367
|
+
readonly space0: import("lit").CSSResult;
|
|
368
|
+
readonly space25: import("lit").CSSResult;
|
|
369
|
+
readonly space50: import("lit").CSSResult;
|
|
370
|
+
readonly space75: import("lit").CSSResult;
|
|
371
|
+
readonly space100: import("lit").CSSResult;
|
|
372
|
+
readonly space150: import("lit").CSSResult;
|
|
373
|
+
readonly space200: import("lit").CSSResult;
|
|
374
|
+
readonly space250: import("lit").CSSResult;
|
|
375
|
+
readonly space300: import("lit").CSSResult;
|
|
376
|
+
readonly space400: import("lit").CSSResult;
|
|
377
|
+
readonly space500: import("lit").CSSResult;
|
|
378
|
+
readonly space600: import("lit").CSSResult;
|
|
379
|
+
readonly space700: import("lit").CSSResult;
|
|
380
|
+
readonly space800: import("lit").CSSResult;
|
|
381
|
+
readonly space900: import("lit").CSSResult;
|
|
382
|
+
};
|
|
365
383
|
};
|
|
366
384
|
//# sourceMappingURL=DesignToken.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DesignToken.d.ts","sourceRoot":"","sources":["../../../../../src/core/shared/tokens/DesignToken.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"DesignToken.d.ts","sourceRoot":"","sources":["../../../../../src/core/shared/tokens/DesignToken.ts"],"names":[],"mappings":"AAUA,8CAA8C;AAC9C,eAAO,MAAM,WAAW;IACtB,wCAAwC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAGxC,4CAA4C;;;;;;;;;IAG5C,yCAAyC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAGzC,wCAAwC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAGxC,8CAA8C;;;;;;IAG9C,4CAA4C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAG5C,6CAA6C;;;;;;IAG7C,0CAA0C;;;;;;IAG1C,8CAA8C;;;;;;;;;;;;;;;;;;CAEtC,CAAC"}
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
/** Design tokens that control measurements. */
|
|
2
|
+
export declare const MeasurementToken: {
|
|
3
|
+
/** Zero spacing. */
|
|
4
|
+
readonly space0: import("lit").CSSResult;
|
|
5
|
+
/** 2dp spacing. */
|
|
6
|
+
readonly space25: import("lit").CSSResult;
|
|
7
|
+
/** 4dp spacing. */
|
|
8
|
+
readonly space50: import("lit").CSSResult;
|
|
9
|
+
/** 6dp spacing. */
|
|
10
|
+
readonly space75: import("lit").CSSResult;
|
|
11
|
+
/** 8dp spacing. */
|
|
12
|
+
readonly space100: import("lit").CSSResult;
|
|
13
|
+
/** 12dp spacing. */
|
|
14
|
+
readonly space150: import("lit").CSSResult;
|
|
15
|
+
/** 16dp spacing. */
|
|
16
|
+
readonly space200: import("lit").CSSResult;
|
|
17
|
+
/** 20dp spacing. */
|
|
18
|
+
readonly space250: import("lit").CSSResult;
|
|
19
|
+
/** 32dp spacing. */
|
|
20
|
+
readonly space300: import("lit").CSSResult;
|
|
21
|
+
/** 40dp spacing. */
|
|
22
|
+
readonly space400: import("lit").CSSResult;
|
|
23
|
+
/** 48dp spacing. */
|
|
24
|
+
readonly space500: import("lit").CSSResult;
|
|
25
|
+
/** 56dp spacing. */
|
|
26
|
+
readonly space600: import("lit").CSSResult;
|
|
27
|
+
/** 64dp spacing. */
|
|
28
|
+
readonly space700: import("lit").CSSResult;
|
|
29
|
+
/** 72dp spacing. */
|
|
30
|
+
readonly space800: import("lit").CSSResult;
|
|
31
|
+
/** 96dp spacing. */
|
|
32
|
+
readonly space900: import("lit").CSSResult;
|
|
33
|
+
};
|
|
34
|
+
//# sourceMappingURL=MeasurementToken.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MeasurementToken.d.ts","sourceRoot":"","sources":["../../../../../src/core/shared/tokens/MeasurementToken.ts"],"names":[],"mappings":"AAEA,+CAA+C;AAC/C,eAAO,MAAM,gBAAgB;IAC3B,oBAAoB;;IAGpB,mBAAmB;;IAGnB,mBAAmB;;IAGnB,mBAAmB;;IAGnB,mBAAmB;;IAGnB,oBAAoB;;IAGpB,oBAAoB;;IAGpB,oBAAoB;;IAGpB,oBAAoB;;IAGpB,oBAAoB;;IAGpB,oBAAoB;;IAGpB,oBAAoB;;IAGpB,oBAAoB;;IAGpB,oBAAoB;;IAGpB,oBAAoB;;CAEZ,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DrawerContainerElement.d.ts","sourceRoot":"","sources":["../../../src/drawer-container/DrawerContainerElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAQ,UAAU,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAevE,OAAO,oBAAoB,CAAC;AAE5B,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;;AAI1C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkDG;AACH,qBACa,yBAA0B,SAAQ,8BAAgD;;IAC7F,iCAAiC;IACjC,OAAgB,MAAM,EAAE,cAAc,CAAwB;IAE9D,eAAe,CAAU,OAAO,CAAC,UAAU,CAAuC;IAClF,eAAe,CAAU,OAAO,CAAC,QAAQ,CAAuC;IAYhF;;;OAGG;IACyC,KAAK,UAAS;IAE1D;;;OAGG;IACmD,SAAS,EAAE,UAAU,CAAU;IAErF;;;OAGG;IACqE,YAAY,UAAS;IAE7F;;;OAGG;IACyC,GAAG,UAAS;IAExD;;;OAGG;IACiD,OAAO,EAAE,UAAU,CAAU;IAEjF;;;OAGG;IACmE,UAAU,UAAS;IAEzF,kBAAkB;IACT,iBAAiB,IAAI,IAAI;IAKlC,kBAAkB;IACT,oBAAoB,IAAI,IAAI;IAOrC,kBAAkB;cACC,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;
|
|
1
|
+
{"version":3,"file":"DrawerContainerElement.d.ts","sourceRoot":"","sources":["../../../src/drawer-container/DrawerContainerElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAQ,UAAU,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAevE,OAAO,oBAAoB,CAAC;AAE5B,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;;AAI1C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkDG;AACH,qBACa,yBAA0B,SAAQ,8BAAgD;;IAC7F,iCAAiC;IACjC,OAAgB,MAAM,EAAE,cAAc,CAAwB;IAE9D,eAAe,CAAU,OAAO,CAAC,UAAU,CAAuC;IAClF,eAAe,CAAU,OAAO,CAAC,QAAQ,CAAuC;IAYhF;;;OAGG;IACyC,KAAK,UAAS;IAE1D;;;OAGG;IACmD,SAAS,EAAE,UAAU,CAAU;IAErF;;;OAGG;IACqE,YAAY,UAAS;IAE7F;;;OAGG;IACyC,GAAG,UAAS;IAExD;;;OAGG;IACiD,OAAO,EAAE,UAAU,CAAU;IAEjF;;;OAGG;IACmE,UAAU,UAAS;IAEzF,kBAAkB;IACT,iBAAiB,IAAI,IAAI;IAKlC,kBAAkB;IACT,oBAAoB,IAAI,IAAI;IAOrC,kBAAkB;cACC,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAwB5E,kBAAkB;IACT,mBAAmB,IAAI,IAAI;IASpC,kBAAkB;cACC,YAAY,CAAC,kBAAkB,EAAE,cAAc,GAAG,IAAI;IAKzE,kBAAkB;cACC,MAAM,IAAI,OAAO;CA8IrC;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,sBAAsB,EAAE,yBAAyB,CAAC;KACnD;CACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DrawerToggleElement.d.ts","sourceRoot":"","sources":["../../../src/drawer-container/DrawerToggleElement.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,iBAAiB,EAA0B,MAAM,eAAe,CAAC;;AAK1E;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,qBACa,sBAAuB,SAAQ,2BAA0B;;IAIpE,kBAAkB;IACT,MAAM,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI;IAc3C,kBAAkB;IACT,MAAM,IAAI,IAAI;IAcvB,kBAAkB;IACT,QAAQ,IAAI,IAAI;
|
|
1
|
+
{"version":3,"file":"DrawerToggleElement.d.ts","sourceRoot":"","sources":["../../../src/drawer-container/DrawerToggleElement.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,iBAAiB,EAA0B,MAAM,eAAe,CAAC;;AAK1E;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,qBACa,sBAAuB,SAAQ,2BAA0B;;IAIpE,kBAAkB;IACT,MAAM,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI;IAc3C,kBAAkB;IACT,MAAM,IAAI,IAAI;IAcvB,kBAAkB;IACT,QAAQ,IAAI,IAAI;CAsE1B;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,mBAAmB,EAAE,sBAAsB,CAAC;KAC7C;CACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IconButtonElement.d.ts","sourceRoot":"","sources":["../../../src/icon-button/IconButtonElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAQ,UAAU,EAAW,cAAc,EAAE,MAAM,KAAK,CAAC;AAGhF,OAAO,
|
|
1
|
+
{"version":3,"file":"IconButtonElement.d.ts","sourceRoot":"","sources":["../../../src/icon-button/IconButtonElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAQ,UAAU,EAAW,cAAc,EAAE,MAAM,KAAK,CAAC;AAGhF,OAAO,EAsBL,oBAAoB,EAIrB,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAGxD,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;;AAEpD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgTG;AACH,qBACa,oBAAqB,SAAQ,yBAIzC;;IACC,iCAAiC;IACjC,OAAgB,MAAM,EAAE,cAAc,CAAkE;IAExG,eAAe,CAAiB,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAc;IACrE,eAAe,CAAsB,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAC,CAAsB;IACvF,eAAe,CAAuB,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAC,CAAsB;IACxF,eAAe,CAAwB,OAAO,CAAC,QAAQ,CAAC,WAAW,CAAC,CAAuB;IAC3F,eAAe,CAAmB,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAmB;;IAgC9E;;;OAGG;IAC0B,OAAO,EAAE,iBAAiB,CAAc;IAErE;;;OAGG;IAC0B,KAAK,EAAE,eAAe,CAAa;IAEhE;;;OAGG;IAC0B,IAAI,EAAE,cAAc,CAAW;IAE5D;;;OAGG;IAC0B,KAAK,EAAE,eAAe,CAAa;IAEhE;;;OAGG;IACyC,MAAM,UAAS;IAE3D;;;OAGG;IACyC,QAAQ,UAAS;IAE7D,yDAAyD;IACzD,IAAI,OAAO,YAEV;IAED,kBAAkB;IACT,MAAM,IAAI,OAAO;IAsB1B,kBAAkB;IACT,iBAAiB,IAAI,IAAI;IAMlC,kBAAkB;IACT,oBAAoB,IAAI,IAAI;IAYrC,kBAAkB;cACC,YAAY,CAAC,kBAAkB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAK/E,kBAAkB;cACC,OAAO,CAAC,kBAAkB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAqB1E,eAAe;IAEf,OAAO,CAAC,aAAa;CAoHtB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,iBAAiB,EAAE,oBAAoB,CAAC;KACzC;CACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IconButtonSizeStyle.d.ts","sourceRoot":"","sources":["../../../../src/icon-button/styles/IconButtonSizeStyle.ts"],"names":[],"mappings":"AAAA,OAAO,EAAkB,cAAc,EAAa,MAAM,KAAK,CAAC;
|
|
1
|
+
{"version":3,"file":"IconButtonSizeStyle.d.ts","sourceRoot":"","sources":["../../../../src/icon-button/styles/IconButtonSizeStyle.ts"],"names":[],"mappings":"AAAA,OAAO,EAAkB,cAAc,EAAa,MAAM,KAAK,CAAC;AA8HhE;;;GAGG;AACH,eAAO,MAAM,mBAAmB,EAAE,cAMjC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IconButtonStyle.d.ts","sourceRoot":"","sources":["../../../../src/icon-button/styles/IconButtonStyle.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,cAAc,EAAa,MAAM,KAAK,CAAC;AAIrD;;;GAGG;AACH,eAAO,MAAM,eAAe,EAAE,
|
|
1
|
+
{"version":3,"file":"IconButtonStyle.d.ts","sourceRoot":"","sources":["../../../../src/icon-button/styles/IconButtonStyle.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,cAAc,EAAa,MAAM,KAAK,CAAC;AAIrD;;;GAGG;AACH,eAAO,MAAM,eAAe,EAAE,cA2L7B,CAAC"}
|
|
@@ -32,7 +32,7 @@ export declare class M3eLoadingIndicatorElement extends M3eLoadingIndicatorEleme
|
|
|
32
32
|
/** The styles of the element. */
|
|
33
33
|
static styles: import("lit").CSSResult;
|
|
34
34
|
/** @private */
|
|
35
|
-
private readonly
|
|
35
|
+
private readonly _container?;
|
|
36
36
|
/**
|
|
37
37
|
* The appearance variant of the indicator.
|
|
38
38
|
* @default "uncontained"
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LoadingIndicatorElement.d.ts","sourceRoot":"","sources":["../../../src/loading-indicator/LoadingIndicatorElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,cAAc,EAAE,MAAM,KAAK,CAAC;AAK5D,OAAO,EAAE,uBAAuB,EAAE,MAAM,2BAA2B,CAAC;;AAIpE;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,qBACa,0BAA2B,SAAQ,+BAAoD;IAClG,iCAAiC;IACjC,OAAgB,MAAM,
|
|
1
|
+
{"version":3,"file":"LoadingIndicatorElement.d.ts","sourceRoot":"","sources":["../../../src/loading-indicator/LoadingIndicatorElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,cAAc,EAAE,MAAM,KAAK,CAAC;AAK5D,OAAO,EAAE,uBAAuB,EAAE,MAAM,2BAA2B,CAAC;;AAIpE;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,qBACa,0BAA2B,SAAQ,+BAAoD;IAClG,iCAAiC;IACjC,OAAgB,MAAM,0BAyGpB;IAEF,eAAe;IACM,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAC,CAAc;IAE/D;;;OAGG;IAC0B,OAAO,EAAE,uBAAuB,CAAiB;IAE9E,kBAAkB;IACT,iBAAiB,IAAI,IAAI;IAOlC,kBAAkB;IACT,oBAAoB,IAAI,IAAI;IAKrC,kBAAkB;IACT,mBAAmB,IAAI,IAAI;IAKpC,kBAAkB;cACC,YAAY,CAAC,kBAAkB,EAAE,cAAc,GAAG,IAAI;IAKzE,kBAAkB;IACT,MAAM;CAOhB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,uBAAuB,EAAE,0BAA0B,CAAC;KACrD;CACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SnackbarElement.d.ts","sourceRoot":"","sources":["../../../src/snackbar/SnackbarElement.ts"],"names":[],"mappings":"AAEA,OAAO,EAAO,cAAc,EAAQ,UAAU,EAAW,cAAc,EAAa,MAAM,KAAK,CAAC;AAKhG,OAAO,iBAAiB,CAAC;AACzB,OAAO,sBAAsB,CAAC;;AAE9B;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,qBACa,kBAAmB,SAAQ,uBAA0B;;IAQhE,iCAAiC;IACjC,OAAgB,MAAM,EAAE,cAAc,
|
|
1
|
+
{"version":3,"file":"SnackbarElement.d.ts","sourceRoot":"","sources":["../../../src/snackbar/SnackbarElement.ts"],"names":[],"mappings":"AAEA,OAAO,EAAO,cAAc,EAAQ,UAAU,EAAW,cAAc,EAAa,MAAM,KAAK,CAAC;AAKhG,OAAO,iBAAiB,CAAC;AACzB,OAAO,sBAAsB,CAAC;;AAE9B;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,qBACa,kBAAmB,SAAQ,uBAA0B;;IAQhE,iCAAiC;IACjC,OAAgB,MAAM,EAAE,cAAc,CA2IpC;IAEF,eAAe,CAAC,MAAM,CAAC,SAAS,EAAE,kBAAkB,GAAG,IAAI,CAAQ;IAMnE,mCAAmC;IACnC,MAAM,KAAK,OAAO,IAAI,kBAAkB,GAAG,IAAI,CAE9C;IAED;;;OAGG;IACyB,QAAQ,SAAQ;IAE5C;;;OAGG;IACS,MAAM,SAAM;IAExB;;;OAGG;IACyC,WAAW,UAAS;IAEhE;;;OAGG;IACqC,UAAU,SAAW;IAE7D,2CAA2C;IAC3C,IAAI,aAAa,IAAI,OAAO,CAE3B;IAED,kBAAkB;IACT,iBAAiB,IAAI,IAAI;IAQlC,kBAAkB;IACT,oBAAoB,IAAI,IAAI;IAMrC,kBAAkB;cACC,MAAM;IAOzB,kBAAkB;cACC,OAAO,CAAC,kBAAkB,EAAE,cAAc,GAAG,IAAI;CAqDrE;AAED,UAAU,0BAA2B,SAAQ,mBAAmB;IAC9D,YAAY,EAAE,WAAW,CAAC;IAC1B,MAAM,EAAE,WAAW,CAAC;CACrB;AAED,MAAM,WAAW,kBAAkB;IACjC,gBAAgB,CAAC,CAAC,SAAS,MAAM,0BAA0B,EACzD,IAAI,EAAE,CAAC,EACP,QAAQ,EAAE,CAAC,IAAI,EAAE,kBAAkB,EAAE,EAAE,EAAE,0BAA0B,CAAC,CAAC,CAAC,KAAK,IAAI,EAC/E,OAAO,CAAC,EAAE,OAAO,GAAG,uBAAuB,GAC1C,IAAI,CAAC;IAER,gBAAgB,CACd,IAAI,EAAE,MAAM,EACZ,QAAQ,EAAE,kCAAkC,EAC5C,OAAO,CAAC,EAAE,OAAO,GAAG,uBAAuB,GAC1C,IAAI,CAAC;IAER,mBAAmB,CAAC,CAAC,SAAS,MAAM,0BAA0B,EAC5D,IAAI,EAAE,CAAC,EACP,QAAQ,EAAE,CAAC,IAAI,EAAE,kBAAkB,EAAE,EAAE,EAAE,0BAA0B,CAAC,CAAC,CAAC,KAAK,IAAI,EAC/E,OAAO,CAAC,EAAE,OAAO,GAAG,oBAAoB,GACvC,IAAI,CAAC;IAER,mBAAmB,CACjB,IAAI,EAAE,MAAM,EACZ,QAAQ,EAAE,kCAAkC,EAC5C,OAAO,CAAC,EAAE,OAAO,GAAG,oBAAoB,GACvC,IAAI,CAAC;CACT;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,cAAc,EAAE,kBAAkB,CAAC;KACpC;CACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ThemeElement.d.ts","sourceRoot":"","sources":["../../../src/theme/ThemeElement.ts"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"ThemeElement.d.ts","sourceRoot":"","sources":["../../../src/theme/ThemeElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAkB,cAAc,EAAQ,UAAU,EAAE,cAAc,EAAa,MAAM,KAAK,CAAC;AAclG,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAE9C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoCG;AACH,qBACa,eAAgB,SAAQ,UAAU;;IAsD7C,iCAAiC;IACjC,OAAgB,MAAM,EAAE,cAAc,CAIpC;IAUF;;;OAGG;IACS,KAAK,SAAa;IAE9B;;;OAGG;IACS,MAAM,EAAE,WAAW,CAAU;IAEzC;;;OAGG;IACS,QAAQ,EAAE,aAAa,CAAc;IAEjD;;;OAGG;IACqD,WAAW,UAAS;IAE5E;;;OAGG;IACyB,OAAO,SAAK;IAExC;;OAEG;IACS,MAAM,EAAE,YAAY,CAAc;IAE9C,uCAAuC;IACvC,IAAI,MAAM,IAAI,OAAO,CAiBpB;IAED,kBAAkB;IACT,iBAAiB,IAAI,IAAI;IA4BlC,kBAAkB;IACT,oBAAoB,IAAI,IAAI;IAarC,kBAAkB;cACC,OAAO,CAAC,kBAAkB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAQ1E,kBAAkB;cACC,YAAY,CAAC,kBAAkB,EAAE,cAAc,GAAG,IAAI;IAKzE,kBAAkB;cACC,MAAM,IAAI,OAAO;CA0GrC;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,WAAW,EAAE,eAAe,CAAC;KAC9B;CACF"}
|
|
@@ -37,6 +37,9 @@ declare const M3eTocElement_base: import("../core/shared/mixins/Constructor").Co
|
|
|
37
37
|
* @attr max-depth - The maximum depth of the table of contents.
|
|
38
38
|
*
|
|
39
39
|
* @cssprop --m3e-toc-width - Width of the table of contents.
|
|
40
|
+
* @cssprop --m3e-toc-container-color - Background color of the table of contents container.
|
|
41
|
+
* @cssprop --m3e-toc-container-padding-inline - Inline padding of the table of contents container.
|
|
42
|
+
* @cssprop --m3e-toc-container-padding-block - Block padding of the table of contents container.
|
|
40
43
|
* @cssprop --m3e-toc-item-shape - Border radius of TOC items and active indicator.
|
|
41
44
|
* @cssprop --m3e-toc-active-indicator-color - Border color of the active indicator.
|
|
42
45
|
* @cssprop --m3e-toc-active-indicator-animation-duration - Animation duration for the active indicator.
|
|
@@ -59,6 +62,7 @@ export declare class M3eTocElement extends M3eTocElement_base {
|
|
|
59
62
|
static styles: CSSResultGroup;
|
|
60
63
|
/** @private */ private _toc;
|
|
61
64
|
/** @private */ private readonly _activeIndicator;
|
|
65
|
+
/** @private */ private readonly _scrollContainer;
|
|
62
66
|
/**
|
|
63
67
|
* The maximum depth of the table of contents.
|
|
64
68
|
* @default 2
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TocElement.d.ts","sourceRoot":"","sources":["../../../src/toc/TocElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,cAAc,EAAQ,UAAU,EAAW,cAAc,EAAa,MAAM,KAAK,CAAC;;
|
|
1
|
+
{"version":3,"file":"TocElement.d.ts","sourceRoot":"","sources":["../../../src/toc/TocElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,cAAc,EAAQ,UAAU,EAAW,cAAc,EAAa,MAAM,KAAK,CAAC;;AAyBhG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuDG;AACH,qBACa,aAAc,SAAQ,kBAAwD;;IACzF,iCAAiC;IACjC,OAAgB,MAAM,EAAE,cAAc,CAwGpC;IAEF,eAAe,CAAU,OAAO,CAAC,IAAI,CAAsB;IAC3D,eAAe,CAA6B,OAAO,CAAC,QAAQ,CAAC,gBAAgB,CAAe;IAC5F,eAAe,CAA6B,OAAO,CAAC,QAAQ,CAAC,gBAAgB,CAAe;IAuG5F;;;OAGG;IACiD,QAAQ,SAAK;IAEjE,kBAAkB;IACT,MAAM,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI;IAO3C,kBAAkB;IACT,MAAM,IAAI,IAAI;IASvB,kBAAkB;cACC,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAQ5E,kBAAkB;cACC,OAAO,CAAC,kBAAkB,EAAE,cAAc,GAAG,IAAI;IA2BpE,kBAAkB;cACC,MAAM,IAAI,OAAO;IAyDpC,eAAe;IAEf,OAAO,CAAC,UAAU;CAGnB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,SAAS,EAAE,aAAa,CAAC;KAC1B;CACF"}
|