npm - @material/web - Versions diffs - 2.4.2-nightly.7619df0.0 → 2.4.2-nightly.7d7cbf4.0 - Mend

@material/web 2.4.2-nightly.7619df0.0 → 2.4.2-nightly.7d7cbf4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1308) hide show

package/iconbutton/internal/icon-button.js CHANGED Viewed

@@ -11,11 +11,13 @@ import { property, state } from 'lit/decorators.js';
 import { classMap } from 'lit/directives/class-map.js';
 import { literal, html as staticHtml } from 'lit/static-html.js';
 import { mixinDelegatesAria } from '../../internal/aria/delegate.js';
-import { setupFormSubmitter, } from '../../internal/controller/form-submitter.js';
 import { isRtl } from '../../internal/controller/is-rtl.js';
-import { internals, mixinElementInternals, } from '../../labs/behaviors/element-internals.js';
+import { afterDispatch, setupDispatchHooks, } from '../../internal/events/dispatch-hooks.js';
+import { mixinElementInternals } from '../../labs/behaviors/element-internals.js';
+import { mixinFormAssociated } from '../../labs/behaviors/form-associated.js';
+import { mixinFormSubmitter } from '../../labs/behaviors/form-submitter.js';
 // Separate variable needed for closure.
-const iconButtonBaseClass = mixinDelegatesAria(mixinElementInternals(LitElement));
+const iconButtonBaseClass = mixinDelegatesAria(mixinFormSubmitter(mixinFormAssociated(mixinElementInternals(LitElement))));
 /**
  * A button for rendering icons.
  *
@@ -24,30 +26,8 @@ const iconButtonBaseClass = mixinDelegatesAria(mixinElementInternals(LitElement)
  * @fires change {Event} Dispatched when a toggle button toggles --bubbles
  */
 export class IconButton extends iconButtonBaseClass {
-    get name() {
-        return this.getAttribute('name') ?? '';
-    }
-    set name(name) {
-        this.setAttribute('name', name);
-    }
-    /**
-     * The associated form element with which this element's value will submit.
-     */
-    get form() {
-        return this[internals].form;
-    }
-    /**
-     * The labels this element is associated with.
-     */
-    get labels() {
-        return this[internals].labels;
-    }
     constructor() {
         super();
-        /**
-         * Disables the icon button and makes it non-interactive.
-         */
-        this.disabled = false;
         /**
          * "Soft-disables" the icon button (disabled but still focusable).
          *
@@ -89,20 +69,34 @@ export class IconButton extends iconButtonBaseClass {
          * icon is provided.
          */
         this.selected = false;
-        /**
-         * The default behavior of the button. May be "button", "reset", or "submit"
-         * (default).
-         */
-        this.type = 'submit';
-        /**
-         * The value added to a form with the button's name when the button submits a
-         * form.
-         */
-        this.value = '';
         this.flipIcon = isRtl(this, this.flipIconInRtl);
-        if (!isServer) {
-            this.addEventListener('click', this.handleClick.bind(this));
-        }
+        if (isServer)
+            return;
+        setupDispatchHooks(this, 'click');
+        this.addEventListener('click', (event) => {
+            // If the button is soft-disabled or a disabled link, we need to
+            // explicitly prevent the click from propagating to other event listeners
+            // as well as prevent the default action. This is because the underlying
+            // `<button>` or `<a>` element is not actually `:disabled`.
+            if (this.softDisabled || (this.disabled && this.href)) {
+                event.stopImmediatePropagation();
+                event.preventDefault();
+                return;
+            }
+            // Save current selected state to toggle, since an external event listener
+            // may also change the selected state on click.
+            const wasSelected = this.selected;
+            afterDispatch(event, () => {
+                if (!this.toggle || this.disabled || event.defaultPrevented) {
+                    return;
+                }
+                this.selected = !wasSelected;
+                this.dispatchEvent(new InputEvent('input', { bubbles: true, composed: true }));
+                // Bubbles but does not compose to mimic native browser <input> & <select>
+                // Additionally, native change event is not an InputEvent.
+                this.dispatchEvent(new Event('change', { bubbles: true }));
+            });
+        });
     }
     willUpdate() {
         // Link buttons cannot be disabled or soft-disabled.
@@ -132,8 +126,7 @@ export class IconButton extends iconButtonBaseClass {
         aria-expanded="${(!this.href && ariaExpanded) || nothing}"
         aria-pressed="${ariaPressedValue}"
         aria-disabled=${(!this.href && this.softDisabled) || nothing}
-        ?disabled="${!this.href && this.disabled}"
-        @click="${this.handleClickOnChild}">
+        ?disabled="${!this.href && this.disabled}">
         ${this.renderFocusRing()}
         ${this.renderRipple()}
         ${!this.selected ? this.renderIcon() : nothing}
@@ -191,50 +184,12 @@ export class IconButton extends iconButtonBaseClass {
         this.flipIcon = isRtl(this, this.flipIconInRtl);
         super.connectedCallback();
     }
-    /** Handles a click on this element. */
-    handleClick(event) {
-        // If the icon button is soft-disabled, we need to explicitly prevent the
-        // click from propagating to other event listeners as well as prevent the
-        // default action.
-        if (!this.href && this.softDisabled) {
-            event.stopImmediatePropagation();
-            event.preventDefault();
-            return;
-        }
-    }
-    /**
-     * Handles a click on the child <div> or <button> element within this
-     * element's shadow DOM.
-     */
-    async handleClickOnChild(event) {
-        // Allow the event to propagate
-        await 0;
-        if (!this.toggle ||
-            this.disabled ||
-            this.softDisabled ||
-            event.defaultPrevented) {
-            return;
-        }
-        this.selected = !this.selected;
-        this.dispatchEvent(new InputEvent('input', { bubbles: true, composed: true }));
-        // Bubbles but does not compose to mimic native browser <input> & <select>
-        // Additionally, native change event is not an InputEvent.
-        this.dispatchEvent(new Event('change', { bubbles: true }));
-    }
 }
-(() => {
-    setupFormSubmitter(IconButton);
-})();
-/** @nocollapse */
-IconButton.formAssociated = true;
 /** @nocollapse */
 IconButton.shadowRootOptions = {
     mode: 'open',
     delegatesFocus: true,
 };
-__decorate([
-    property({ type: Boolean, reflect: true })
-], IconButton.prototype, "disabled", void 0);
 __decorate([
     property({ type: Boolean, attribute: 'soft-disabled', reflect: true })
 ], IconButton.prototype, "softDisabled", void 0);
@@ -259,12 +214,6 @@ __decorate([
 __decorate([
     property({ type: Boolean, reflect: true })
 ], IconButton.prototype, "selected", void 0);
-__decorate([
-    property()
-], IconButton.prototype, "type", void 0);
-__decorate([
-    property({ reflect: true })
-], IconButton.prototype, "value", void 0);
 __decorate([
     state()
 ], IconButton.prototype, "flipIcon", void 0);

package/iconbutton/internal/icon-button.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"icon-button.js","sourceRoot":"","sources":["icon-button.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n @license\n * Copyright 2018 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n /\n\nimport '../../focus/md-focus-ring.js';\nimport '../../ripple/ripple.js';\n\nimport {html, isServer, LitElement, nothing} from 'lit';\nimport {property, state} from 'lit/decorators.js';\nimport {classMap} from 'lit/directives/class-map.js';\nimport {literal, html as staticHtml} from 'lit/static-html.js';\n\nimport {ARIAMixinStrict} from '../../internal/aria/aria.js';\nimport {mixinDelegatesAria} from '../../internal/aria/delegate.js';\nimport {\n FormSubmitter,\n setupFormSubmitter,\n type FormSubmitterType,\n} from '../../internal/controller/form-submitter.js';\nimport {isRtl} from '../../internal/controller/is-rtl.js';\nimport {\n internals,\n mixinElementInternals,\n} from '../../labs/behaviors/element-internals.js';\n\ntype LinkTarget = '_blank' \| '_parent' \| '_self' \| '_top';\n\n// Separate variable needed for closure.\nconst iconButtonBaseClass = mixinDelegatesAria(\n mixinElementInternals(LitElement),\n);\n\n/\n A button for rendering icons.\n \n @fires input {InputEvent} Dispatched when a toggle button toggles --bubbles\n * --composed\n * @fires change {Event} Dispatched when a toggle button toggles --bubbles\n /\nexport class IconButton extends iconButtonBaseClass implements FormSubmitter {\n static {\n setupFormSubmitter(IconButton);\n }\n\n /* @nocollapse /\n static readonly formAssociated = true;\n\n /* @nocollapse /\n static override shadowRootOptions: ShadowRootInit = {\n mode: 'open',\n delegatesFocus: true,\n };\n\n /\n Disables the icon button and makes it non-interactive.\n /\n @property({type: Boolean, reflect: true}) disabled = false;\n\n /\n \"Soft-disables\" the icon button (disabled but still focusable).\n \n Use this when an icon button needs increased visibility when disabled. See\n * https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_disabled_controls\n * for more guidance on when this is needed.\n /\n @property({type: Boolean, attribute: 'soft-disabled', reflect: true})\n softDisabled = false;\n\n /\n Flips the icon if it is in an RTL context at startup.\n /\n @property({type: Boolean, attribute: 'flip-icon-in-rtl'})\n flipIconInRtl = false;\n\n /\n Sets the underlying `HTMLAnchorElement`'s `href` resource attribute.\n /\n @property() href = '';\n\n /\n The filename to use when downloading the linked resource.\n * If not specified, the browser will determine a filename.\n * This is only applicable when the icon button is used as a link (`href` is set).\n /\n @property() download = '';\n\n /\n Sets the underlying `HTMLAnchorElement`'s `target` attribute.\n /\n @property() target: LinkTarget \| '' = '';\n\n /\n The `aria-label` of the button when the button is toggleable and selected.\n /\n @property({attribute: 'aria-label-selected'}) ariaLabelSelected = '';\n\n /\n When true, the button will toggle between selected and unselected\n * states\n /\n @property({type: Boolean}) toggle = false;\n\n /\n Sets the selected state. When false, displays the default icon. When true,\n * displays the selected icon, or the default icon If no `slot=\"selected\"`\n * icon is provided.\n /\n @property({type: Boolean, reflect: true}) selected = false;\n\n /\n The default behavior of the button. May be \"button\", \"reset\", or \"submit\"\n * (default).\n /\n @property() type: FormSubmitterType = 'submit';\n\n /\n The value added to a form with the button's name when the button submits a\n * form.\n /\n @property({reflect: true}) value = '';\n\n get name() {\n return this.getAttribute('name') ?? '';\n }\n set name(name: string) {\n this.setAttribute('name', name);\n }\n\n /\n The associated form element with which this element's value will submit.\n /\n get form() {\n return this[internals].form;\n }\n\n /\n The labels this element is associated with.\n /\n get labels() {\n return this[internals].labels;\n }\n\n @state() private flipIcon = isRtl(this, this.flipIconInRtl);\n\n constructor() {\n super();\n if (!isServer) {\n this.addEventListener('click', this.handleClick.bind(this));\n }\n }\n\n protected override willUpdate() {\n // Link buttons cannot be disabled or soft-disabled.\n if (this.href) {\n this.disabled = false;\n this.softDisabled = false;\n }\n }\n\n protected override render() {\n const tag = this.href ? literal`div` : literal`button`;\n // Needed for closure conformance\n const {ariaLabel, ariaHasPopup, ariaExpanded} = this as ARIAMixinStrict;\n const hasToggledAriaLabel = ariaLabel && this.ariaLabelSelected;\n const ariaPressedValue = !this.toggle ? nothing : this.selected;\n let ariaLabelValue: string \| null \| typeof nothing = nothing;\n if (!this.href) {\n ariaLabelValue =\n hasToggledAriaLabel && this.selected\n ? this.ariaLabelSelected\n : ariaLabel;\n }\n return staticHtml`<${tag}\n class=\"icon-button ${classMap(this.getRenderClasses())}\"\n id=\"button\"\n aria-label=\"${ariaLabelValue \|\| nothing}\"\n aria-haspopup=\"${(!this.href && ariaHasPopup) \|\| nothing}\"\n aria-expanded=\"${(!this.href && ariaExpanded) \|\| nothing}\"\n aria-pressed=\"${ariaPressedValue}\"\n aria-disabled=${(!this.href && this.softDisabled) \|\| nothing}\n ?disabled=\"${!this.href && this.disabled}\"\n @click=\"${this.handleClickOnChild}\">\n ${this.renderFocusRing()}\n ${this.renderRipple()}\n ${!this.selected ? this.renderIcon() : nothing}\n ${this.selected ? this.renderSelectedIcon() : nothing}\n ${this.href ? this.renderLink() : this.renderTouchTarget()}\n </${tag}>`;\n }\n\n private renderLink() {\n // Needed for closure conformance\n const {ariaLabel} = this as ARIAMixinStrict;\n return html`\n <a\n class=\"link\"\n id=\"link\"\n href=\"${this.href}\"\n download=\"${this.download \|\| nothing}\"\n target=\"${this.target \|\| nothing}\"\n aria-label=\"${ariaLabel \|\| nothing}\">\n ${this.renderTouchTarget()}\n </a>\n `;\n }\n\n protected getRenderClasses() {\n return {\n 'flip-icon': this.flipIcon,\n 'selected': this.toggle && this.selected,\n };\n }\n\n private renderIcon() {\n return html`<span class=\"icon\"><slot></slot></span>`;\n }\n\n private renderSelectedIcon() {\n // Use default slot as fallback to not require specifying multiple icons\n return html`<span class=\"icon icon--selected\"\n ><slot name=\"selected\"><slot></slot></slot\n ></span>`;\n }\n\n private renderTouchTarget() {\n return html`<span class=\"touch\"></span>`;\n }\n\n private renderFocusRing() {\n // TODO(b/310046938): use the same id for both elements\n return html`<md-focus-ring\n part=\"focus-ring\"\n for=${this.href ? 'link' : 'button'}></md-focus-ring>`;\n }\n\n private renderRipple() {\n const isRippleDisabled = !this.href && (this.disabled \|\| this.softDisabled);\n // TODO(b/310046938): use the same id for both elements\n return html`<md-ripple\n for=${this.href ? 'link' : nothing}\n ?disabled=\"${isRippleDisabled}\"></md-ripple>`;\n }\n\n override connectedCallback() {\n this.flipIcon = isRtl(this, this.flipIconInRtl);\n super.connectedCallback();\n }\n\n /* Handles a click on this element. /\n private handleClick(event: MouseEvent) {\n // If the icon button is soft-disabled, we need to explicitly prevent the\n // click from propagating to other event listeners as well as prevent the\n // default action.\n if (!this.href && this.softDisabled) {\n event.stopImmediatePropagation();\n event.preventDefault();\n return;\n }\n }\n\n /\n Handles a click on the child <div> or <button> element within this\n * element's shadow DOM.\n */\n private async handleClickOnChild(event: Event) {\n // Allow the event to propagate\n await 0;\n if (\n !this.toggle \|\|\n this.disabled \|\|\n this.softDisabled \|\|\n event.defaultPrevented\n ) {\n return;\n }\n\n this.selected = !this.selected;\n this.dispatchEvent(\n new InputEvent('input', {bubbles: true, composed: true}),\n );\n // Bubbles but does not compose to mimic native browser <input> & <select>\n // Additionally, native change event is not an InputEvent.\n this.dispatchEvent(new Event('change', {bubbles: true}));\n }\n}\n"]}
1	+ {"version":3,"file":"icon-button.js","sourceRoot":"","sources":["icon-button.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n @license\n * Copyright 2018 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n /\n\nimport '../../focus/md-focus-ring.js';\nimport '../../ripple/ripple.js';\n\nimport {html, isServer, LitElement, nothing} from 'lit';\nimport {property, state} from 'lit/decorators.js';\nimport {classMap} from 'lit/directives/class-map.js';\nimport {literal, html as staticHtml} from 'lit/static-html.js';\n\nimport {ARIAMixinStrict} from '../../internal/aria/aria.js';\nimport {mixinDelegatesAria} from '../../internal/aria/delegate.js';\nimport {isRtl} from '../../internal/controller/is-rtl.js';\nimport {\n afterDispatch,\n setupDispatchHooks,\n} from '../../internal/events/dispatch-hooks.js';\nimport {mixinElementInternals} from '../../labs/behaviors/element-internals.js';\nimport {mixinFormAssociated} from '../../labs/behaviors/form-associated.js';\nimport {mixinFormSubmitter} from '../../labs/behaviors/form-submitter.js';\n\ntype LinkTarget = '_blank' \| '_parent' \| '_self' \| '_top';\n\n// Separate variable needed for closure.\nconst iconButtonBaseClass = mixinDelegatesAria(\n mixinFormSubmitter(mixinFormAssociated(mixinElementInternals(LitElement))),\n);\n\n/\n A button for rendering icons.\n \n @fires input {InputEvent} Dispatched when a toggle button toggles --bubbles\n * --composed\n * @fires change {Event} Dispatched when a toggle button toggles --bubbles\n /\nexport class IconButton extends iconButtonBaseClass {\n /* @nocollapse /\n static override shadowRootOptions: ShadowRootInit = {\n mode: 'open',\n delegatesFocus: true,\n };\n\n /\n Disables the icon button and makes it non-interactive.\n /\n declare disabled: boolean; // for jsdoc until lit-analyzer is updated\n\n /\n \"Soft-disables\" the icon button (disabled but still focusable).\n \n Use this when an icon button needs increased visibility when disabled. See\n * https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_disabled_controls\n * for more guidance on when this is needed.\n /\n @property({type: Boolean, attribute: 'soft-disabled', reflect: true})\n softDisabled = false;\n\n /\n Flips the icon if it is in an RTL context at startup.\n /\n @property({type: Boolean, attribute: 'flip-icon-in-rtl'})\n flipIconInRtl = false;\n\n /\n Sets the underlying `HTMLAnchorElement`'s `href` resource attribute.\n /\n @property() href = '';\n\n /\n The filename to use when downloading the linked resource.\n * If not specified, the browser will determine a filename.\n * This is only applicable when the icon button is used as a link (`href` is set).\n /\n @property() download = '';\n\n /\n Sets the underlying `HTMLAnchorElement`'s `target` attribute.\n /\n @property() target: LinkTarget \| '' = '';\n\n /\n The `aria-label` of the button when the button is toggleable and selected.\n /\n @property({attribute: 'aria-label-selected'}) ariaLabelSelected = '';\n\n /\n When true, the button will toggle between selected and unselected\n * states\n /\n @property({type: Boolean}) toggle = false;\n\n /\n Sets the selected state. When false, displays the default icon. When true,\n * displays the selected icon, or the default icon If no `slot=\"selected\"`\n * icon is provided.\n */\n @property({type: Boolean, reflect: true}) selected = false;\n\n @state() private flipIcon = isRtl(this, this.flipIconInRtl);\n\n constructor() {\n super();\n if (isServer) return;\n setupDispatchHooks(this, 'click');\n this.addEventListener('click', (event) => {\n // If the button is soft-disabled or a disabled link, we need to\n // explicitly prevent the click from propagating to other event listeners\n // as well as prevent the default action. This is because the underlying\n // `<button>` or `<a>` element is not actually `:disabled`.\n if (this.softDisabled \|\| (this.disabled && this.href)) {\n event.stopImmediatePropagation();\n event.preventDefault();\n return;\n }\n\n // Save current selected state to toggle, since an external event listener\n // may also change the selected state on click.\n const wasSelected = this.selected;\n afterDispatch(event, () => {\n if (!this.toggle \|\| this.disabled \|\| event.defaultPrevented) {\n return;\n }\n\n this.selected = !wasSelected;\n this.dispatchEvent(\n new InputEvent('input', {bubbles: true, composed: true}),\n );\n // Bubbles but does not compose to mimic native browser <input> & <select>\n // Additionally, native change event is not an InputEvent.\n this.dispatchEvent(new Event('change', {bubbles: true}));\n });\n });\n }\n\n protected override willUpdate() {\n // Link buttons cannot be disabled or soft-disabled.\n if (this.href) {\n this.disabled = false;\n this.softDisabled = false;\n }\n }\n\n protected override render() {\n const tag = this.href ? literal`div` : literal`button`;\n // Needed for closure conformance\n const {ariaLabel, ariaHasPopup, ariaExpanded} = this as ARIAMixinStrict;\n const hasToggledAriaLabel = ariaLabel && this.ariaLabelSelected;\n const ariaPressedValue = !this.toggle ? nothing : this.selected;\n let ariaLabelValue: string \| null \| typeof nothing = nothing;\n if (!this.href) {\n ariaLabelValue =\n hasToggledAriaLabel && this.selected\n ? this.ariaLabelSelected\n : ariaLabel;\n }\n return staticHtml`<${tag}\n class=\"icon-button ${classMap(this.getRenderClasses())}\"\n id=\"button\"\n aria-label=\"${ariaLabelValue \|\| nothing}\"\n aria-haspopup=\"${(!this.href && ariaHasPopup) \|\| nothing}\"\n aria-expanded=\"${(!this.href && ariaExpanded) \|\| nothing}\"\n aria-pressed=\"${ariaPressedValue}\"\n aria-disabled=${(!this.href && this.softDisabled) \|\| nothing}\n ?disabled=\"${!this.href && this.disabled}\">\n ${this.renderFocusRing()}\n ${this.renderRipple()}\n ${!this.selected ? this.renderIcon() : nothing}\n ${this.selected ? this.renderSelectedIcon() : nothing}\n ${this.href ? this.renderLink() : this.renderTouchTarget()}\n </${tag}>`;\n }\n\n private renderLink() {\n // Needed for closure conformance\n const {ariaLabel} = this as ARIAMixinStrict;\n return html`\n <a\n class=\"link\"\n id=\"link\"\n href=\"${this.href}\"\n download=\"${this.download \|\| nothing}\"\n target=\"${this.target \|\| nothing}\"\n aria-label=\"${ariaLabel \|\| nothing}\">\n ${this.renderTouchTarget()}\n </a>\n `;\n }\n\n protected getRenderClasses() {\n return {\n 'flip-icon': this.flipIcon,\n 'selected': this.toggle && this.selected,\n };\n }\n\n private renderIcon() {\n return html`<span class=\"icon\"><slot></slot></span>`;\n }\n\n private renderSelectedIcon() {\n // Use default slot as fallback to not require specifying multiple icons\n return html`<span class=\"icon icon--selected\"\n ><slot name=\"selected\"><slot></slot></slot\n ></span>`;\n }\n\n private renderTouchTarget() {\n return html`<span class=\"touch\"></span>`;\n }\n\n private renderFocusRing() {\n // TODO(b/310046938): use the same id for both elements\n return html`<md-focus-ring\n part=\"focus-ring\"\n for=${this.href ? 'link' : 'button'}></md-focus-ring>`;\n }\n\n private renderRipple() {\n const isRippleDisabled = !this.href && (this.disabled \|\| this.softDisabled);\n // TODO(b/310046938): use the same id for both elements\n return html`<md-ripple\n for=${this.href ? 'link' : nothing}\n ?disabled=\"${isRippleDisabled}\"></md-ripple>`;\n }\n\n override connectedCallback() {\n this.flipIcon = isRtl(this, this.flipIconInRtl);\n super.connectedCallback();\n }\n}\n"]}

package/iconbutton/internal/outlined-styles.cssresult.d.ts ADDED Viewed

@@ -0,0 +1,3 @@
+export declare const styles: import("lit").CSSResult;
+declare const _default: CSSStyleSheet;
+export default _default;

package/iconbutton/internal/outlined-styles.cssresult.js ADDED Viewed

@@ -0,0 +1,11 @@
+/**
+ * @license
+ * Copyright 2026 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+// Generated stylesheet for ./iconbutton/internal/outlined-styles.css.
+import { css } from 'lit';
+export const styles = css `:host{--_container-height: var(--md-outlined-icon-button-container-height, 40px);--_container-width: var(--md-outlined-icon-button-container-width, 40px);--_disabled-icon-color: var(--md-outlined-icon-button-disabled-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-icon-opacity: var(--md-outlined-icon-button-disabled-icon-opacity, 0.38);--_disabled-selected-container-color: var(--md-outlined-icon-button-disabled-selected-container-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-selected-container-opacity: var(--md-outlined-icon-button-disabled-selected-container-opacity, 0.12);--_hover-state-layer-opacity: var(--md-outlined-icon-button-hover-state-layer-opacity, 0.08);--_icon-size: var(--md-outlined-icon-button-icon-size, 24px);--_pressed-state-layer-opacity: var(--md-outlined-icon-button-pressed-state-layer-opacity, 0.12);--_selected-container-color: var(--md-outlined-icon-button-selected-container-color, var(--md-sys-color-inverse-surface, #322f35));--_selected-focus-icon-color: var(--md-outlined-icon-button-selected-focus-icon-color, var(--md-sys-color-inverse-on-surface, #f5eff7));--_selected-hover-icon-color: var(--md-outlined-icon-button-selected-hover-icon-color, var(--md-sys-color-inverse-on-surface, #f5eff7));--_selected-hover-state-layer-color: var(--md-outlined-icon-button-selected-hover-state-layer-color, var(--md-sys-color-inverse-on-surface, #f5eff7));--_selected-icon-color: var(--md-outlined-icon-button-selected-icon-color, var(--md-sys-color-inverse-on-surface, #f5eff7));--_selected-pressed-icon-color: var(--md-outlined-icon-button-selected-pressed-icon-color, var(--md-sys-color-inverse-on-surface, #f5eff7));--_selected-pressed-state-layer-color: var(--md-outlined-icon-button-selected-pressed-state-layer-color, var(--md-sys-color-inverse-on-surface, #f5eff7));--_disabled-outline-color: var(--md-outlined-icon-button-disabled-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-outline-opacity: var(--md-outlined-icon-button-disabled-outline-opacity, 0.12);--_focus-icon-color: var(--md-outlined-icon-button-focus-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-icon-color: var(--md-outlined-icon-button-hover-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-state-layer-color: var(--md-outlined-icon-button-hover-state-layer-color, var(--md-sys-color-on-surface-variant, #49454f));--_icon-color: var(--md-outlined-icon-button-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_outline-color: var(--md-outlined-icon-button-outline-color, var(--md-sys-color-outline, #79747e));--_outline-width: var(--md-outlined-icon-button-outline-width, 1px);--_pressed-icon-color: var(--md-outlined-icon-button-pressed-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_pressed-state-layer-color: var(--md-outlined-icon-button-pressed-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--_container-shape-start-start: var(--md-outlined-icon-button-container-shape-start-start, var(--md-outlined-icon-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-start-end: var(--md-outlined-icon-button-container-shape-start-end, var(--md-outlined-icon-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-end-end: var(--md-outlined-icon-button-container-shape-end-end, var(--md-outlined-icon-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-end-start: var(--md-outlined-icon-button-container-shape-end-start, var(--md-outlined-icon-button-container-shape, var(--md-sys-shape-corner-full, 9999px)))}.outlined{background-color:rgba(0,0,0,0);color:var(--_icon-color);--md-ripple-hover-color: var(--_hover-state-layer-color);--md-ripple-hover-opacity: var(--_hover-state-layer-opacity);--md-ripple-pressed-color: var(--_pressed-state-layer-color);--md-ripple-pressed-opacity: var(--_pressed-state-layer-opacity)}.outlined::before{border-color:var(--_outline-color);border-width:var(--_outline-width)}.outlined:hover{color:var(--_hover-icon-color)}.outlined:focus{color:var(--_focus-icon-color)}.outlined:active{color:var(--_pressed-icon-color)}.outlined:is(:disabled,[aria-disabled=true]){color:var(--_disabled-icon-color)}.outlined:is(:disabled,[aria-disabled=true])::before{border-color:var(--_disabled-outline-color);opacity:var(--_disabled-outline-opacity)}.outlined:is(:disabled,[aria-disabled=true]) .icon{opacity:var(--_disabled-icon-opacity)}.outlined::before{block-size:100%;border-style:solid;border-radius:inherit;box-sizing:border-box;content:"";inline-size:100%;inset:0;pointer-events:none;position:absolute;z-index:-1}.outlined.selected::before{border-width:0}.selected:not(:disabled,[aria-disabled=true]){color:var(--_selected-icon-color)}.selected:not(:disabled,[aria-disabled=true]):hover{color:var(--_selected-hover-icon-color)}.selected:not(:disabled,[aria-disabled=true]):focus{color:var(--_selected-focus-icon-color)}.selected:not(:disabled,[aria-disabled=true]):active{color:var(--_selected-pressed-icon-color)}.selected{--md-ripple-hover-color: var(--_selected-hover-state-layer-color);--md-ripple-hover-opacity: var(--_hover-state-layer-opacity);--md-ripple-pressed-color: var(--_selected-pressed-state-layer-color);--md-ripple-pressed-opacity: var(--_pressed-state-layer-opacity)}.selected:not(:disabled,[aria-disabled=true])::before{background-color:var(--_selected-container-color)}.selected:is(:disabled,[aria-disabled=true])::before{background-color:var(--_disabled-selected-container-color);opacity:var(--_disabled-selected-container-opacity)}@media(forced-colors: active){:host(:is([disabled],[soft-disabled])){--_disabled-outline-opacity: 1}.selected::before{border-color:CanvasText;border-width:var(--_outline-width)}.selected:is(:disabled,[aria-disabled=true])::before{border-color:GrayText;opacity:1}}
+`;
+export default styles.styleSheet;
+//# sourceMappingURL=outlined-styles.cssresult.js.map

package/iconbutton/internal/outlined-styles.cssresult.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"outlined-styles.cssresult.js","sourceRoot":"","sources":["outlined-styles.cssresult.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,sEAAsE;AACtE,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;CACxB,CAAC;AACF,eAAe,MAAM,CAAC,UAAW,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2026 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n// Generated stylesheet for ./iconbutton/internal/outlined-styles.css.\nimport {css} from 'lit';\nexport const styles = css`:host{--_container-height: var(--md-outlined-icon-button-container-height, 40px);--_container-width: var(--md-outlined-icon-button-container-width, 40px);--_disabled-icon-color: var(--md-outlined-icon-button-disabled-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-icon-opacity: var(--md-outlined-icon-button-disabled-icon-opacity, 0.38);--_disabled-selected-container-color: var(--md-outlined-icon-button-disabled-selected-container-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-selected-container-opacity: var(--md-outlined-icon-button-disabled-selected-container-opacity, 0.12);--_hover-state-layer-opacity: var(--md-outlined-icon-button-hover-state-layer-opacity, 0.08);--_icon-size: var(--md-outlined-icon-button-icon-size, 24px);--_pressed-state-layer-opacity: var(--md-outlined-icon-button-pressed-state-layer-opacity, 0.12);--_selected-container-color: var(--md-outlined-icon-button-selected-container-color, var(--md-sys-color-inverse-surface, #322f35));--_selected-focus-icon-color: var(--md-outlined-icon-button-selected-focus-icon-color, var(--md-sys-color-inverse-on-surface, #f5eff7));--_selected-hover-icon-color: var(--md-outlined-icon-button-selected-hover-icon-color, var(--md-sys-color-inverse-on-surface, #f5eff7));--_selected-hover-state-layer-color: var(--md-outlined-icon-button-selected-hover-state-layer-color, var(--md-sys-color-inverse-on-surface, #f5eff7));--_selected-icon-color: var(--md-outlined-icon-button-selected-icon-color, var(--md-sys-color-inverse-on-surface, #f5eff7));--_selected-pressed-icon-color: var(--md-outlined-icon-button-selected-pressed-icon-color, var(--md-sys-color-inverse-on-surface, #f5eff7));--_selected-pressed-state-layer-color: var(--md-outlined-icon-button-selected-pressed-state-layer-color, var(--md-sys-color-inverse-on-surface, #f5eff7));--_disabled-outline-color: var(--md-outlined-icon-button-disabled-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-outline-opacity: var(--md-outlined-icon-button-disabled-outline-opacity, 0.12);--_focus-icon-color: var(--md-outlined-icon-button-focus-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-icon-color: var(--md-outlined-icon-button-hover-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-state-layer-color: var(--md-outlined-icon-button-hover-state-layer-color, var(--md-sys-color-on-surface-variant, #49454f));--_icon-color: var(--md-outlined-icon-button-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_outline-color: var(--md-outlined-icon-button-outline-color, var(--md-sys-color-outline, #79747e));--_outline-width: var(--md-outlined-icon-button-outline-width, 1px);--_pressed-icon-color: var(--md-outlined-icon-button-pressed-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_pressed-state-layer-color: var(--md-outlined-icon-button-pressed-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--_container-shape-start-start: var(--md-outlined-icon-button-container-shape-start-start, var(--md-outlined-icon-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-start-end: var(--md-outlined-icon-button-container-shape-start-end, var(--md-outlined-icon-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-end-end: var(--md-outlined-icon-button-container-shape-end-end, var(--md-outlined-icon-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-end-start: var(--md-outlined-icon-button-container-shape-end-start, var(--md-outlined-icon-button-container-shape, var(--md-sys-shape-corner-full, 9999px)))}.outlined{background-color:rgba(0,0,0,0);color:var(--_icon-color);--md-ripple-hover-color: var(--_hover-state-layer-color);--md-ripple-hover-opacity: var(--_hover-state-layer-opacity);--md-ripple-pressed-color: var(--_pressed-state-layer-color);--md-ripple-pressed-opacity: var(--_pressed-state-layer-opacity)}.outlined::before{border-color:var(--_outline-color);border-width:var(--_outline-width)}.outlined:hover{color:var(--_hover-icon-color)}.outlined:focus{color:var(--_focus-icon-color)}.outlined:active{color:var(--_pressed-icon-color)}.outlined:is(:disabled,[aria-disabled=true]){color:var(--_disabled-icon-color)}.outlined:is(:disabled,[aria-disabled=true])::before{border-color:var(--_disabled-outline-color);opacity:var(--_disabled-outline-opacity)}.outlined:is(:disabled,[aria-disabled=true]) .icon{opacity:var(--_disabled-icon-opacity)}.outlined::before{block-size:100%;border-style:solid;border-radius:inherit;box-sizing:border-box;content:\"\";inline-size:100%;inset:0;pointer-events:none;position:absolute;z-index:-1}.outlined.selected::before{border-width:0}.selected:not(:disabled,[aria-disabled=true]){color:var(--_selected-icon-color)}.selected:not(:disabled,[aria-disabled=true]):hover{color:var(--_selected-hover-icon-color)}.selected:not(:disabled,[aria-disabled=true]):focus{color:var(--_selected-focus-icon-color)}.selected:not(:disabled,[aria-disabled=true]):active{color:var(--_selected-pressed-icon-color)}.selected{--md-ripple-hover-color: var(--_selected-hover-state-layer-color);--md-ripple-hover-opacity: var(--_hover-state-layer-opacity);--md-ripple-pressed-color: var(--_selected-pressed-state-layer-color);--md-ripple-pressed-opacity: var(--_pressed-state-layer-opacity)}.selected:not(:disabled,[aria-disabled=true])::before{background-color:var(--_selected-container-color)}.selected:is(:disabled,[aria-disabled=true])::before{background-color:var(--_disabled-selected-container-color);opacity:var(--_disabled-selected-container-opacity)}@media(forced-colors: active){:host(:is([disabled],[soft-disabled])){--_disabled-outline-opacity: 1}.selected::before{border-color:CanvasText;border-width:var(--_outline-width)}.selected:is(:disabled,[aria-disabled=true])::before{border-color:GrayText;opacity:1}}\n`;\nexport default styles.styleSheet!;\n"]}

package/iconbutton/internal/shared-styles.cssresult.d.ts ADDED Viewed

@@ -0,0 +1,3 @@
+export declare const styles: import("lit").CSSResult;
+declare const _default: CSSStyleSheet;
+export default _default;

package/iconbutton/internal/shared-styles.cssresult.js ADDED Viewed

@@ -0,0 +1,11 @@
+/**
+ * @license
+ * Copyright 2026 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+// Generated stylesheet for ./iconbutton/internal/shared-styles.css.
+import { css } from 'lit';
+export const styles = css `:host{display:inline-flex;outline:none;-webkit-tap-highlight-color:rgba(0,0,0,0);height:var(--_container-height);width:var(--_container-width);justify-content:center}:host([touch-target=wrapper]){margin:max(0px,(48px - var(--_container-height))/2) max(0px,(48px - var(--_container-width))/2)}md-focus-ring{--md-focus-ring-shape-start-start: var(--_container-shape-start-start);--md-focus-ring-shape-start-end: var(--_container-shape-start-end);--md-focus-ring-shape-end-end: var(--_container-shape-end-end);--md-focus-ring-shape-end-start: var(--_container-shape-end-start)}:host(:is([disabled],[soft-disabled])){pointer-events:none}.icon-button{place-items:center;background:none;border:none;box-sizing:border-box;cursor:pointer;display:flex;place-content:center;outline:none;padding:0;position:relative;text-decoration:none;user-select:none;z-index:0;flex:1;border-start-start-radius:var(--_container-shape-start-start);border-start-end-radius:var(--_container-shape-start-end);border-end-start-radius:var(--_container-shape-end-start);border-end-end-radius:var(--_container-shape-end-end)}.icon ::slotted(*){font-size:var(--_icon-size);height:var(--_icon-size);width:var(--_icon-size);font-weight:inherit}md-ripple{z-index:-1;border-start-start-radius:var(--_container-shape-start-start);border-start-end-radius:var(--_container-shape-start-end);border-end-start-radius:var(--_container-shape-end-start);border-end-end-radius:var(--_container-shape-end-end)}.flip-icon .icon{transform:scaleX(-1)}.icon{display:inline-flex}.link{display:grid;height:100%;outline:none;place-items:center;position:absolute;width:100%}.touch{position:absolute;height:max(48px,100%);width:max(48px,100%)}:host([touch-target=none]) .touch{display:none}@media(forced-colors: active){:host(:is([disabled],[soft-disabled])){--_disabled-icon-color: GrayText;--_disabled-icon-opacity: 1}}
+`;
+export default styles.styleSheet;
+//# sourceMappingURL=shared-styles.cssresult.js.map

package/iconbutton/internal/shared-styles.cssresult.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"shared-styles.cssresult.js","sourceRoot":"","sources":["shared-styles.cssresult.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,oEAAoE;AACpE,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;CACxB,CAAC;AACF,eAAe,MAAM,CAAC,UAAW,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2026 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n// Generated stylesheet for ./iconbutton/internal/shared-styles.css.\nimport {css} from 'lit';\nexport const styles = css`:host{display:inline-flex;outline:none;-webkit-tap-highlight-color:rgba(0,0,0,0);height:var(--_container-height);width:var(--_container-width);justify-content:center}:host([touch-target=wrapper]){margin:max(0px,(48px - var(--_container-height))/2) max(0px,(48px - var(--_container-width))/2)}md-focus-ring{--md-focus-ring-shape-start-start: var(--_container-shape-start-start);--md-focus-ring-shape-start-end: var(--_container-shape-start-end);--md-focus-ring-shape-end-end: var(--_container-shape-end-end);--md-focus-ring-shape-end-start: var(--_container-shape-end-start)}:host(:is([disabled],[soft-disabled])){pointer-events:none}.icon-button{place-items:center;background:none;border:none;box-sizing:border-box;cursor:pointer;display:flex;place-content:center;outline:none;padding:0;position:relative;text-decoration:none;user-select:none;z-index:0;flex:1;border-start-start-radius:var(--_container-shape-start-start);border-start-end-radius:var(--_container-shape-start-end);border-end-start-radius:var(--_container-shape-end-start);border-end-end-radius:var(--_container-shape-end-end)}.icon ::slotted(*){font-size:var(--_icon-size);height:var(--_icon-size);width:var(--_icon-size);font-weight:inherit}md-ripple{z-index:-1;border-start-start-radius:var(--_container-shape-start-start);border-start-end-radius:var(--_container-shape-start-end);border-end-start-radius:var(--_container-shape-end-start);border-end-end-radius:var(--_container-shape-end-end)}.flip-icon .icon{transform:scaleX(-1)}.icon{display:inline-flex}.link{display:grid;height:100%;outline:none;place-items:center;position:absolute;width:100%}.touch{position:absolute;height:max(48px,100%);width:max(48px,100%)}:host([touch-target=none]) .touch{display:none}@media(forced-colors: active){:host(:is([disabled],[soft-disabled])){--_disabled-icon-color: GrayText;--_disabled-icon-opacity: 1}}\n`;\nexport default styles.styleSheet!;\n"]}

package/iconbutton/internal/standard-styles.cssresult.d.ts ADDED Viewed

@@ -0,0 +1,3 @@
+export declare const styles: import("lit").CSSResult;
+declare const _default: CSSStyleSheet;
+export default _default;

package/iconbutton/internal/standard-styles.cssresult.js ADDED Viewed

@@ -0,0 +1,11 @@
+/**
+ * @license
+ * Copyright 2026 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+// Generated stylesheet for ./iconbutton/internal/standard-styles.css.
+import { css } from 'lit';
+export const styles = css `:host{--_disabled-icon-color: var(--md-icon-button-disabled-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-icon-opacity: var(--md-icon-button-disabled-icon-opacity, 0.38);--_icon-size: var(--md-icon-button-icon-size, 24px);--_selected-focus-icon-color: var(--md-icon-button-selected-focus-icon-color, var(--md-sys-color-primary, #6750a4));--_selected-hover-icon-color: var(--md-icon-button-selected-hover-icon-color, var(--md-sys-color-primary, #6750a4));--_selected-hover-state-layer-color: var(--md-icon-button-selected-hover-state-layer-color, var(--md-sys-color-primary, #6750a4));--_selected-hover-state-layer-opacity: var(--md-icon-button-selected-hover-state-layer-opacity, 0.08);--_selected-icon-color: var(--md-icon-button-selected-icon-color, var(--md-sys-color-primary, #6750a4));--_selected-pressed-icon-color: var(--md-icon-button-selected-pressed-icon-color, var(--md-sys-color-primary, #6750a4));--_selected-pressed-state-layer-color: var(--md-icon-button-selected-pressed-state-layer-color, var(--md-sys-color-primary, #6750a4));--_selected-pressed-state-layer-opacity: var(--md-icon-button-selected-pressed-state-layer-opacity, 0.12);--_state-layer-height: var(--md-icon-button-state-layer-height, 40px);--_state-layer-shape: var(--md-icon-button-state-layer-shape, var(--md-sys-shape-corner-full, 9999px));--_state-layer-width: var(--md-icon-button-state-layer-width, 40px);--_focus-icon-color: var(--md-icon-button-focus-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-icon-color: var(--md-icon-button-hover-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-state-layer-color: var(--md-icon-button-hover-state-layer-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-state-layer-opacity: var(--md-icon-button-hover-state-layer-opacity, 0.08);--_icon-color: var(--md-icon-button-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_pressed-icon-color: var(--md-icon-button-pressed-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_pressed-state-layer-color: var(--md-icon-button-pressed-state-layer-color, var(--md-sys-color-on-surface-variant, #49454f));--_pressed-state-layer-opacity: var(--md-icon-button-pressed-state-layer-opacity, 0.12);--_container-shape-start-start: 0;--_container-shape-start-end: 0;--_container-shape-end-end: 0;--_container-shape-end-start: 0;--_container-height: 0;--_container-width: 0;height:var(--_state-layer-height);width:var(--_state-layer-width)}:host([touch-target=wrapper]){margin:max(0px,(48px - var(--_state-layer-height))/2) max(0px,(48px - var(--_state-layer-width))/2)}md-focus-ring{--md-focus-ring-shape-start-start: var(--_state-layer-shape);--md-focus-ring-shape-start-end: var(--_state-layer-shape);--md-focus-ring-shape-end-end: var(--_state-layer-shape);--md-focus-ring-shape-end-start: var(--_state-layer-shape)}.standard{background-color:rgba(0,0,0,0);color:var(--_icon-color);--md-ripple-hover-color: var(--_hover-state-layer-color);--md-ripple-hover-opacity: var(--_hover-state-layer-opacity);--md-ripple-pressed-color: var(--_pressed-state-layer-color);--md-ripple-pressed-opacity: var(--_pressed-state-layer-opacity)}.standard:hover{color:var(--_hover-icon-color)}.standard:focus{color:var(--_focus-icon-color)}.standard:active{color:var(--_pressed-icon-color)}.standard:is(:disabled,[aria-disabled=true]){color:var(--_disabled-icon-color)}md-ripple{border-radius:var(--_state-layer-shape)}.standard:is(:disabled,[aria-disabled=true]){opacity:var(--_disabled-icon-opacity)}.selected:not(:disabled,[aria-disabled=true]){color:var(--_selected-icon-color)}.selected:not(:disabled,[aria-disabled=true]):hover{color:var(--_selected-hover-icon-color)}.selected:not(:disabled,[aria-disabled=true]):focus{color:var(--_selected-focus-icon-color)}.selected:not(:disabled,[aria-disabled=true]):active{color:var(--_selected-pressed-icon-color)}.selected{--md-ripple-hover-color: var(--_selected-hover-state-layer-color);--md-ripple-hover-opacity: var(--_selected-hover-state-layer-opacity);--md-ripple-pressed-color: var(--_selected-pressed-state-layer-color);--md-ripple-pressed-opacity: var(--_selected-pressed-state-layer-opacity)}
+`;
+export default styles.styleSheet;
+//# sourceMappingURL=standard-styles.cssresult.js.map

package/iconbutton/internal/standard-styles.cssresult.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"standard-styles.cssresult.js","sourceRoot":"","sources":["standard-styles.cssresult.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,sEAAsE;AACtE,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;CACxB,CAAC;AACF,eAAe,MAAM,CAAC,UAAW,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2026 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n// Generated stylesheet for ./iconbutton/internal/standard-styles.css.\nimport {css} from 'lit';\nexport const styles = css`:host{--_disabled-icon-color: var(--md-icon-button-disabled-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-icon-opacity: var(--md-icon-button-disabled-icon-opacity, 0.38);--_icon-size: var(--md-icon-button-icon-size, 24px);--_selected-focus-icon-color: var(--md-icon-button-selected-focus-icon-color, var(--md-sys-color-primary, #6750a4));--_selected-hover-icon-color: var(--md-icon-button-selected-hover-icon-color, var(--md-sys-color-primary, #6750a4));--_selected-hover-state-layer-color: var(--md-icon-button-selected-hover-state-layer-color, var(--md-sys-color-primary, #6750a4));--_selected-hover-state-layer-opacity: var(--md-icon-button-selected-hover-state-layer-opacity, 0.08);--_selected-icon-color: var(--md-icon-button-selected-icon-color, var(--md-sys-color-primary, #6750a4));--_selected-pressed-icon-color: var(--md-icon-button-selected-pressed-icon-color, var(--md-sys-color-primary, #6750a4));--_selected-pressed-state-layer-color: var(--md-icon-button-selected-pressed-state-layer-color, var(--md-sys-color-primary, #6750a4));--_selected-pressed-state-layer-opacity: var(--md-icon-button-selected-pressed-state-layer-opacity, 0.12);--_state-layer-height: var(--md-icon-button-state-layer-height, 40px);--_state-layer-shape: var(--md-icon-button-state-layer-shape, var(--md-sys-shape-corner-full, 9999px));--_state-layer-width: var(--md-icon-button-state-layer-width, 40px);--_focus-icon-color: var(--md-icon-button-focus-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-icon-color: var(--md-icon-button-hover-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-state-layer-color: var(--md-icon-button-hover-state-layer-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-state-layer-opacity: var(--md-icon-button-hover-state-layer-opacity, 0.08);--_icon-color: var(--md-icon-button-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_pressed-icon-color: var(--md-icon-button-pressed-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_pressed-state-layer-color: var(--md-icon-button-pressed-state-layer-color, var(--md-sys-color-on-surface-variant, #49454f));--_pressed-state-layer-opacity: var(--md-icon-button-pressed-state-layer-opacity, 0.12);--_container-shape-start-start: 0;--_container-shape-start-end: 0;--_container-shape-end-end: 0;--_container-shape-end-start: 0;--_container-height: 0;--_container-width: 0;height:var(--_state-layer-height);width:var(--_state-layer-width)}:host([touch-target=wrapper]){margin:max(0px,(48px - var(--_state-layer-height))/2) max(0px,(48px - var(--_state-layer-width))/2)}md-focus-ring{--md-focus-ring-shape-start-start: var(--_state-layer-shape);--md-focus-ring-shape-start-end: var(--_state-layer-shape);--md-focus-ring-shape-end-end: var(--_state-layer-shape);--md-focus-ring-shape-end-start: var(--_state-layer-shape)}.standard{background-color:rgba(0,0,0,0);color:var(--_icon-color);--md-ripple-hover-color: var(--_hover-state-layer-color);--md-ripple-hover-opacity: var(--_hover-state-layer-opacity);--md-ripple-pressed-color: var(--_pressed-state-layer-color);--md-ripple-pressed-opacity: var(--_pressed-state-layer-opacity)}.standard:hover{color:var(--_hover-icon-color)}.standard:focus{color:var(--_focus-icon-color)}.standard:active{color:var(--_pressed-icon-color)}.standard:is(:disabled,[aria-disabled=true]){color:var(--_disabled-icon-color)}md-ripple{border-radius:var(--_state-layer-shape)}.standard:is(:disabled,[aria-disabled=true]){opacity:var(--_disabled-icon-opacity)}.selected:not(:disabled,[aria-disabled=true]){color:var(--_selected-icon-color)}.selected:not(:disabled,[aria-disabled=true]):hover{color:var(--_selected-hover-icon-color)}.selected:not(:disabled,[aria-disabled=true]):focus{color:var(--_selected-focus-icon-color)}.selected:not(:disabled,[aria-disabled=true]):active{color:var(--_selected-pressed-icon-color)}.selected{--md-ripple-hover-color: var(--_selected-hover-state-layer-color);--md-ripple-hover-opacity: var(--_selected-hover-state-layer-opacity);--md-ripple-pressed-color: var(--_selected-pressed-state-layer-color);--md-ripple-pressed-opacity: var(--_selected-pressed-state-layer-opacity)}\n`;\nexport default styles.styleSheet!;\n"]}

package/iconbutton/outlined-icon-button.js CHANGED Viewed

@@ -6,8 +6,8 @@
 import { __decorate } from "tslib";
 import { customElement } from 'lit/decorators.js';
 import { IconButton } from './internal/icon-button.js';
-import { styles } from './internal/outlined-styles.js';
-import { styles as sharedStyles } from './internal/shared-styles.js';
+import { styles } from './internal/outlined-styles.cssresult.js';
+import { styles as sharedStyles } from './internal/shared-styles.cssresult.js';
 /**
  * @summary Icon buttons help people take supplementary actions with a single
  * tap.

package/iconbutton/outlined-icon-button.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"outlined-icon-button.js","sourceRoot":"","sources":["outlined-icon-button.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAGH,OAAO,EAAC,aAAa,EAAC,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAC,UAAU,EAAC,MAAM,2BAA2B,CAAC;AACrD,OAAO,EAAC,MAAM,EAAC,MAAM~~,+BAA+B~~,CAAC;~~AACrD~~,OAAO,EAAC,MAAM,IAAI,YAAY,EAAC,MAAM,~~6BAA6B~~,CAAC;~~AAQnE~~;;;;;;;;;;;;;;;;;GAiBG;AAEI,IAAM,oBAAoB,GAA1B,MAAM,oBAAqB,SAAQ,UAAU;IAG/B,gBAAgB;QACjC,OAAO;YACL,GAAG,KAAK,CAAC,gBAAgB,EAAE;YAC3B,UAAU,EAAE,IAAI;SACjB,CAAC;IACJ,CAAC;;AAPe,2BAAM,GAAwB,CAAC,YAAY,EAAE,MAAM,CAAC,AAA9C,CAA+C;AAD1D,oBAAoB;IADhC,aAAa,CAAC,yBAAyB,CAAC;GAC5B,oBAAoB,CAShC","sourcesContent":["/*\n @license\n * Copyright 2022 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n /\n\nimport {CSSResultOrNative} from 'lit';\nimport {customElement} from 'lit/decorators.js';\n\nimport {IconButton} from './internal/icon-button.js';\nimport {styles} from './internal/outlined-styles.js';\nimport {styles as sharedStyles} from './internal/shared-styles.js';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'md-outlined-icon-button': MdOutlinedIconButton;\n }\n}\n\n/\n @summary Icon buttons help people take supplementary actions with a single\n * tap.\n \n @description\n * __Emphasis:__ Low emphasis – For optional or supplementary actions with the\n * least amount of prominence.\n \n __Rationale:__ The most compact and unobtrusive type of button, icon buttons\n * are used for optional supplementary actions such as \"Bookmark\" or \"Star.\"\n \n __Example usages:__\n * - Add to Favorites\n * - Print\n \n @final\n * @suppress {visibility}\n */\n@customElement('md-outlined-icon-button')\nexport class MdOutlinedIconButton extends IconButton {\n static override styles: CSSResultOrNative[] = [sharedStyles, styles];\n\n protected override getRenderClasses() {\n return {\n ...super.getRenderClasses(),\n 'outlined': true,\n };\n }\n}\n"]}
1	+ {"version":3,"file":"outlined-icon-button.js","sourceRoot":"","sources":["outlined-icon-button.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAGH,OAAO,EAAC,aAAa,EAAC,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAC,UAAU,EAAC,MAAM,2BAA2B,CAAC;AACrD,OAAO,EAAC,MAAM,EAAC,MAAM,yCAAyC,CAAC;AAC/D,OAAO,EAAC,MAAM,IAAI,YAAY,EAAC,MAAM,uCAAuC,CAAC;AAQ7E;;;;;;;;;;;;;;;;;GAiBG;AAEI,IAAM,oBAAoB,GAA1B,MAAM,oBAAqB,SAAQ,UAAU;IAG/B,gBAAgB;QACjC,OAAO;YACL,GAAG,KAAK,CAAC,gBAAgB,EAAE;YAC3B,UAAU,EAAE,IAAI;SACjB,CAAC;IACJ,CAAC;;AAPe,2BAAM,GAAwB,CAAC,YAAY,EAAE,MAAM,CAAC,AAA9C,CAA+C;AAD1D,oBAAoB;IADhC,aAAa,CAAC,yBAAyB,CAAC;GAC5B,oBAAoB,CAShC","sourcesContent":["/*\n @license\n * Copyright 2022 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n /\n\nimport {CSSResultOrNative} from 'lit';\nimport {customElement} from 'lit/decorators.js';\n\nimport {IconButton} from './internal/icon-button.js';\nimport {styles} from './internal/outlined-styles.cssresult.js';\nimport {styles as sharedStyles} from './internal/shared-styles.cssresult.js';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'md-outlined-icon-button': MdOutlinedIconButton;\n }\n}\n\n/\n @summary Icon buttons help people take supplementary actions with a single\n * tap.\n \n @description\n * __Emphasis:__ Low emphasis – For optional or supplementary actions with the\n * least amount of prominence.\n \n __Rationale:__ The most compact and unobtrusive type of button, icon buttons\n * are used for optional supplementary actions such as \"Bookmark\" or \"Star.\"\n \n __Example usages:__\n * - Add to Favorites\n * - Print\n \n @final\n * @suppress {visibility}\n */\n@customElement('md-outlined-icon-button')\nexport class MdOutlinedIconButton extends IconButton {\n static override styles: CSSResultOrNative[] = [sharedStyles, styles];\n\n protected override getRenderClasses() {\n return {\n ...super.getRenderClasses(),\n 'outlined': true,\n };\n }\n}\n"]}

package/internal/aria/aria.d.ts CHANGED Viewed

@@ -18,7 +18,7 @@ export type ARIAAttribute = ARIAPropertyToAttribute<ARIAProperty>;
 /**
  * Accessibility Object Model aria attributes.
  */
-export declare const ARIA_ATTRIBUTES: ("role" | "aria-hidden" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-current" | "aria-description" | "aria-disabled" | "aria-expanded" | "aria-haspopup" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext")[];
+export declare const ARIA_ATTRIBUTES: ("role" | "aria-hidden" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-haspopup" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext")[];
 /**
  * Checks if an attribute is one of the AOM aria attributes.
  *

package/internal/events/dispatch-hooks.js CHANGED Viewed

@@ -67,7 +67,7 @@ export function afterDispatch(event, callback) {
     if (!hooks) {
         throw new Error(`'${event.type}' event needs setupDispatchHooks().`);
     }
-    hooks.addEventListener('after', callback);
+    hooks.addEventListener('after', callback, { once: true });
 }
 /**
  * A lookup map of elements and event types that have a dispatch hook listener
@@ -106,39 +106,44 @@ export function setupDispatchHooks(element, ...eventTypes) {
     }
     for (const eventType of eventTypes) {
         // Don't register multiple dispatch hook listeners. A second registration
-        // would lead to the second listener re-dispatching a re-dispatched event,
-        // which can cause an infinite loop inside the other one.
+        // would lead to the second listener calling `afterDispatch()` hooks twice.
         if (typesAlreadySetUp.has(eventType)) {
             continue;
         }
-        // When we re-dispatch the event, it's going to immediately trigger this
-        // listener again. Use a flag to ignore it.
-        let isRedispatching = false;
         element.addEventListener(eventType, (event) => {
-            if (isRedispatching) {
-                return;
-            }
-            // Do not let the event propagate to any other listener (not just
-            // bubbling listeners with `stopPropagation()`).
-            event.stopImmediatePropagation();
-            // Make a copy.
-            const eventCopy = Reflect.construct(event.constructor, [
-                event.type,
-                event,
-            ]);
             // Add hooks onto the event.
             const hooks = new EventTarget();
-            eventCopy[dispatchHooks] = hooks;
-            // Re-dispatch the event. We can't reuse `redispatchEvent()` since we
-            // need to add the hooks to the copy before it's dispatched.
-            isRedispatching = true;
-            const dispatched = element.dispatchEvent(eventCopy);
-            isRedispatching = false;
-            if (!dispatched) {
-                event.preventDefault();
+            event[dispatchHooks] = hooks;
+            const cleanupLastNodeListener = new AbortController();
+            const callAfterDispatch = () => {
+                cleanupLastNodeListener.abort();
+                hooks.dispatchEvent(new Event('after'));
+            };
+            const patchStopPropagation = (superMethod) => {
+                return function () {
+                    superMethod.call(this);
+                    // Synchronously call afterDispatch() hooks when interrupted.
+                    callAfterDispatch();
+                };
+            };
+            event.stopPropagation = patchStopPropagation(event.stopPropagation);
+            event.stopImmediatePropagation = patchStopPropagation(event.stopImmediatePropagation);
+            // Add an event listener to detect the end of the event's propagation.
+            const composedPath = event.composedPath();
+            let lastNodeForEvent;
+            if (event.composed && event.bubbles) {
+                lastNodeForEvent = composedPath[composedPath.length - 1];
+            }
+            else if (!event.bubbles) {
+                lastNodeForEvent = composedPath[0];
+            }
+            else {
+                lastNodeForEvent = composedPath[0].getRootNode();
             }
-            // Synchronously call afterDispatch() hooks.
-            hooks.dispatchEvent(new Event('after'));
+            lastNodeForEvent.addEventListener(eventType, () => {
+                // Synchronously call afterDispatch() hooks.
+                callAfterDispatch();
+            }, { once: true, signal: cleanupLastNodeListener.signal });
         }, {
             // Ensure this listener runs before other listeners.
             // `setupDispatchHooks()` should be called in constructors to also

package/internal/events/dispatch-hooks.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"dispatch-hooks.js","sourceRoot":"","sources":["dispatch-hooks.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH;;GAEG;AACH,MAAM,aAAa,GAAG,MAAM,CAAC,eAAe,CAAC,CAAC;AAS9C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsDG;AACH,MAAM,UAAU,aAAa,CAAC,KAAY,EAAE,QAAoB;IAC9D,MAAM,KAAK,GAAI,KAAgC,CAAC,aAAa,CAAC,CAAC;IAC/D,IAAI,CAAC,KAAK,EAAE,CAAC;QACX,MAAM,IAAI,KAAK,CAAC,IAAI,KAAK,CAAC,IAAI,qCAAqC,CAAC,CAAC;IACvE,CAAC;IAED,KAAK,CAAC,gBAAgB,CAAC,OAAO,EAAE,QAAQ,CAAC,CAAC;~~AAC5C~~,CAAC;AAED;;;;GAIG;AACH,MAAM,2BAA2B,GAAG,IAAI,OAAO,EAAwB,CAAC;AAExE;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,MAAM,UAAU,kBAAkB,CAChC,OAAgB,EAChB,GAAG,UAAiC;IAEpC,IAAI,iBAAiB,GAAG,2BAA2B,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;IACjE,IAAI,CAAC,iBAAiB,EAAE,CAAC;QACvB,iBAAiB,GAAG,IAAI,GAAG,EAAE,CAAC;QAC9B,2BAA2B,CAAC,GAAG,CAAC,OAAO,EAAE,iBAAiB,CAAC,CAAC;IAC9D,CAAC;IAED,KAAK,MAAM,SAAS,IAAI,UAAU,EAAE,CAAC;QACnC,yEAAyE;QACzE,~~0EAA0E~~;~~QAC1E~~,~~yDAAyD;QACzD,~~IAAI,iBAAiB,CAAC,GAAG,CAAC,SAAS,CAAC,EAAE,CAAC;YACrC,SAAS;QACX,CAAC;QAED,~~wEAAwE~~;~~QACxE~~,~~2CAA2C~~;~~QAC3C~~,~~IAAI~~,~~eAAe~~,GAAG,~~KAAK~~,CAAC;~~QAC5B~~,~~OAAO~~,CAAC,~~gBAAgB~~,~~CACtB~~,~~SAAS~~,~~EACT~~,CAAC,~~KAAY~~,~~EAAE~~,~~EAAE;YACf~~,IAAI,eAAe,EAAE,CAAC;~~gBACpB~~,~~OAAO~~;~~YACT~~,CAAC~~;YAED~~,~~iEAAiE;YACjE~~,~~gDAAgD~~;~~YAChD~~,KAAK,CAAC,~~wBAAwB~~,~~EAAE~~,CAAC;~~YACjC~~,~~eAAe~~;~~YACf~~,MAAM,~~SAAS~~,GAAG,OAAO,CAAC,~~SAAS~~,CAAC,~~KAAK~~,CAAC,~~WAAW~~,EAAE;~~gBACrD~~,~~KAAK~~,CAAC,~~IAAI~~;~~gBACV~~,KAAK;~~aACN~~,CAAC,CAAC;~~YAEH~~,~~4BAA4B~~;~~YAC5B~~,MAAM,~~KAAK~~,GAAG,~~IAAI~~,~~WAAW~~,EAAE,CAAC;~~YAC/B~~,~~SAAoC~~,CAAC,~~aAAa~~,CAAC,~~GAAG~~,KAAK,CAAC~~;YAE7D~~,~~qEAAqE;YACrE~~,~~4DAA4D~~;~~YAC5D~~,~~eAAe~~,GAAG,~~IAAI~~,CAAC~~;YACvB~~,MAAM,~~UAAU,~~GAAG,~~OAAO~~,CAAC,~~aAAa~~,CAAC,~~SAAS~~,CAAC,CAAC;~~YACpD~~,~~eAAe~~,GAAG,~~KAAK~~,CAAC~~;YACxB~~,~~IAAI~~,CAAC,~~UAAU~~,~~EAAE~~,CAAC;~~gBAChB~~,~~KAAK~~,CAAC,~~cAAc~~,EAAE,CAAC;~~YACzB~~,CAAC;YAED,4CAA4C;~~YAC5C~~,~~KAAK~~,CAAC,~~aAAa,~~CAAC,IAAI,~~KAAK~~,~~CAAC~~,~~OAAO~~,~~CAAC~~,CAAC,CAAC;~~QAC1C~~,CAAC,EACD;YACE,oDAAoD;YACpD,kEAAkE;YAClE,uEAAuE;YACvE,OAAO,EAAE,IAAI;SACd,CACF,CAAC;QAEF,iBAAiB,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC;IACnC,CAAC;AACH,CAAC","sourcesContent":["/*\n @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n /\n\n/\n A symbol used to access dispatch hooks on an event.\n /\nconst dispatchHooks = Symbol('dispatchHooks');\n\n/\n An `Event` with additional symbols for dispatch hooks.\n /\ninterface EventWithDispatchHooks extends Event {\n [dispatchHooks]: EventTarget;\n}\n\n/\n Add a hook for an event that is called after the event is dispatched and\n * propagates to other event listeners.\n \n This is useful for behaviors that need to check if an event is canceled.\n \n The callback is invoked synchronously, which allows for better integration\n * with synchronous platform APIs (like `<form>` or `<label>` clicking).\n \n Note: `setupDispatchHooks()` must be called on the element before adding any\n * other event listeners. Call it in the constructor of an element or\n * controller.\n \n @example\n * ```ts\n * class MyControl extends LitElement {\n * constructor() {\n * super();\n * setupDispatchHooks(this, 'click');\n * this.addEventListener('click', event => {\n * afterDispatch(event, () => {\n * if (event.defaultPrevented) {\n * return\n * }\n \n // ... perform logic\n * });\n * });\n * }\n * }\n * ```\n \n @example\n * ```ts\n * class MyController implements ReactiveController {\n * constructor(host: ReactiveElement) {\n * // setupDispatchHooks() may be called multiple times for the same\n * // element and events, making it safe for multiple controllers to use it.\n * setupDispatchHooks(host, 'click');\n * host.addEventListener('click', event => {\n * afterDispatch(event, () => {\n * if (event.defaultPrevented) {\n * return;\n * }\n \n // ... perform logic\n * });\n * });\n * }\n * }\n * ```\n \n @param event The event to add a hook to.\n * @param callback A hook that is called after the event finishes dispatching.\n /\nexport function afterDispatch(event: Event, callback: () => void) {\n const hooks = (event as EventWithDispatchHooks)[dispatchHooks];\n if (!hooks) {\n throw new Error(`'${event.type}' event needs setupDispatchHooks().`);\n }\n\n hooks.addEventListener('after', callback);\n}\n\n/\n A lookup map of elements and event types that have a dispatch hook listener\n * set up. Used to ensure we don't set up multiple hook listeners on the same\n * element for the same event.\n /\nconst ELEMENT_DISPATCH_HOOK_TYPES = new WeakMap<Element, Set<string>>();\n\n/\n Sets up an element to add dispatch hooks to given event types. This must be\n * called before adding any event listeners that need to use dispatch hooks\n * like `afterDispatch()`.\n \n This function is safe to call multiple times with the same element or event\n * types. Call it in the constructor of elements, mixins, and controllers to\n * ensure it is set up before external listeners.\n \n @example\n * ```ts\n * class MyControl extends LitElement {\n * constructor() {\n * super();\n * setupDispatchHooks(this, 'click');\n * this.addEventListener('click', this.listenerUsingAfterDispatch);\n * }\n * }\n * ```\n \n @param element The element to set up event dispatch hooks for.\n * @param eventTypes The event types to add dispatch hooks to.\n */\nexport function setupDispatchHooks(\n element: Element,\n ...eventTypes: [string, ...string[]]\n) {\n let typesAlreadySetUp = ELEMENT_DISPATCH_HOOK_TYPES.get(element);\n if (!typesAlreadySetUp) {\n typesAlreadySetUp = new Set();\n ELEMENT_DISPATCH_HOOK_TYPES.set(element, typesAlreadySetUp);\n }\n\n for (const eventType of eventTypes) {\n // Don't register multiple dispatch hook listeners. A second registration\n // would lead to the second listener ~~re-dispatching~~ a ~~re-dispatched~~ ~~event,\n // which can cause an infinite loop inside the other one~~.\n if (typesAlreadySetUp.has(eventType)) {\n continue;\n }\n\n // ~~When~~ we ~~re-dispatch~~ the event, ~~it's~~ ~~going~~ to ~~immediately trigger this\~~n // ~~listener~~ ~~again.~~ ~~Use~~ a ~~flag~~ to ~~ignore~~ ~~it.\~~n ~~let~~ ~~isRedispatching~~ = ~~false;\n element.addEventListener~~(~~\n eventType,\n (event: Event~~) => {\n if (~~isRedispatching~~) {\n ~~return~~;\n }\n\n // Do ~~not~~ ~~let~~ ~~the~~ ~~event~~ ~~propagate~~ to ~~any~~ ~~other~~ ~~listener (not just~~\n // ~~bubbling~~ ~~listeners~~ ~~with `stopPropagation~~()`).\n ~~event.stopImmediatePropagation~~();\n ~~// Make a copy.\~~n ~~const~~ ~~eventCopy~~ = ~~Reflect.construct~~(event.~~constructor,~~ [\n event.~~type~~,\n ~~event,\n~~ ]);\n\n // Add ~~hooks~~ ~~onto~~ the event.\n const ~~hooks~~ = ~~new EventTarget~~();\n ~~(eventCopy~~ as ~~EventWithDispatchHooks)[dispatchHooks] = hooks~~;\n\n // ~~Re-dispatch~~ ~~the~~ event. ~~We can't reuse `redispatchEvent(~~)` ~~since we~~\n // ~~need~~ to ~~add~~ ~~the hooks to the copy before it's dispatched.\n isRedispatching = true~~;\n ~~const~~ ~~dispatched~~ = ~~element~~.~~dispatchEvent(eventCopy~~);\n ~~isRedispatching~~ = ~~false~~;\n if ~~(!dispatched)~~ {\n ~~event~~.~~preventDefault~~();\n }\n\n // Synchronously call afterDispatch() hooks.\n ~~hooks.dispatchEvent~~(~~new~~ ~~Event('after'~~));\n },\n {\n // Ensure this listener runs before other listeners.\n // `setupDispatchHooks()` should be called in constructors to also\n // ensure they run before any other externally-added capture listeners.\n capture: true,\n },\n );\n\n typesAlreadySetUp.add(eventType);\n }\n}\n"]}
1	+ {"version":3,"file":"dispatch-hooks.js","sourceRoot":"","sources":["dispatch-hooks.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n /\n\n/\n A symbol used to access dispatch hooks on an event.\n /\nconst dispatchHooks = Symbol('dispatchHooks');\n\n/\n An `Event` with additional symbols for dispatch hooks.\n /\ninterface EventWithDispatchHooks extends Event {\n [dispatchHooks]: EventTarget;\n}\n\n/\n Add a hook for an event that is called after the event is dispatched and\n * propagates to other event listeners.\n \n This is useful for behaviors that need to check if an event is canceled.\n \n The callback is invoked synchronously, which allows for better integration\n * with synchronous platform APIs (like `<form>` or `<label>` clicking).\n \n Note: `setupDispatchHooks()` must be called on the element before adding any\n * other event listeners. Call it in the constructor of an element or\n * controller.\n \n @example\n * ```ts\n * class MyControl extends LitElement {\n * constructor() {\n * super();\n * setupDispatchHooks(this, 'click');\n * this.addEventListener('click', event => {\n * afterDispatch(event, () => {\n * if (event.defaultPrevented) {\n * return\n * }\n \n // ... perform logic\n * });\n * });\n * }\n * }\n * ```\n \n @example\n * ```ts\n * class MyController implements ReactiveController {\n * constructor(host: ReactiveElement) {\n * // setupDispatchHooks() may be called multiple times for the same\n * // element and events, making it safe for multiple controllers to use it.\n * setupDispatchHooks(host, 'click');\n * host.addEventListener('click', event => {\n * afterDispatch(event, () => {\n * if (event.defaultPrevented) {\n * return;\n * }\n \n // ... perform logic\n * });\n * });\n * }\n * }\n * ```\n \n @param event The event to add a hook to.\n * @param callback A hook that is called after the event finishes dispatching.\n /\nexport function afterDispatch(event: Event, callback: () => void) {\n const hooks = (event as EventWithDispatchHooks)[dispatchHooks];\n if (!hooks) {\n throw new Error(`'${event.type}' event needs setupDispatchHooks().`);\n }\n\n hooks.addEventListener('after', callback, {once: true});\n}\n\n/\n A lookup map of elements and event types that have a dispatch hook listener\n * set up. Used to ensure we don't set up multiple hook listeners on the same\n * element for the same event.\n /\nconst ELEMENT_DISPATCH_HOOK_TYPES = new WeakMap<Element, Set<string>>();\n\n/\n Sets up an element to add dispatch hooks to given event types. This must be\n * called before adding any event listeners that need to use dispatch hooks\n * like `afterDispatch()`.\n \n This function is safe to call multiple times with the same element or event\n * types. Call it in the constructor of elements, mixins, and controllers to\n * ensure it is set up before external listeners.\n \n @example\n * ```ts\n * class MyControl extends LitElement {\n * constructor() {\n * super();\n * setupDispatchHooks(this, 'click');\n * this.addEventListener('click', this.listenerUsingAfterDispatch);\n * }\n * }\n * ```\n \n @param element The element to set up event dispatch hooks for.\n * @param eventTypes The event types to add dispatch hooks to.\n */\nexport function setupDispatchHooks(\n element: Element,\n ...eventTypes: [string, ...string[]]\n) {\n let typesAlreadySetUp = ELEMENT_DISPATCH_HOOK_TYPES.get(element);\n if (!typesAlreadySetUp) {\n typesAlreadySetUp = new Set();\n ELEMENT_DISPATCH_HOOK_TYPES.set(element, typesAlreadySetUp);\n }\n\n for (const eventType of eventTypes) {\n // Don't register multiple dispatch hook listeners. A second registration\n // would lead to the second listener calling `afterDispatch()` hooks twice.\n if (typesAlreadySetUp.has(eventType)) {\n continue;\n }\n\n element.addEventListener(\n eventType,\n (event: Event) => {\n // Add hooks onto the event.\n const hooks = new EventTarget();\n (event as EventWithDispatchHooks)[dispatchHooks] = hooks;\n\n const cleanupLastNodeListener = new AbortController();\n const callAfterDispatch = () => {\n cleanupLastNodeListener.abort();\n hooks.dispatchEvent(new Event('after'));\n };\n\n const patchStopPropagation = (\n superMethod: Event['stopPropagation'],\n ) => {\n return function (this: Event) {\n superMethod.call(this);\n // Synchronously call afterDispatch() hooks when interrupted.\n callAfterDispatch();\n };\n };\n\n event.stopPropagation = patchStopPropagation(event.stopPropagation);\n event.stopImmediatePropagation = patchStopPropagation(\n event.stopImmediatePropagation,\n );\n\n // Add an event listener to detect the end of the event's propagation.\n const composedPath = event.composedPath();\n let lastNodeForEvent: EventTarget;\n if (event.composed && event.bubbles) {\n lastNodeForEvent = composedPath[composedPath.length - 1];\n } else if (!event.bubbles) {\n lastNodeForEvent = composedPath[0];\n } else {\n lastNodeForEvent = (composedPath[0] as Element).getRootNode();\n }\n\n lastNodeForEvent.addEventListener(\n eventType,\n () => {\n // Synchronously call afterDispatch() hooks.\n callAfterDispatch();\n },\n {once: true, signal: cleanupLastNodeListener.signal},\n );\n },\n {\n // Ensure this listener runs before other listeners.\n // `setupDispatchHooks()` should be called in constructors to also\n // ensure they run before any other externally-added capture listeners.\n capture: true,\n },\n );\n\n typesAlreadySetUp.add(eventType);\n }\n}\n"]}

package/labs/badge/badge.js CHANGED Viewed

@@ -6,7 +6,7 @@
 import { __decorate } from "tslib";
 import { customElement } from 'lit/decorators.js';
 import { Badge } from './internal/badge.js';
-import { styles } from './internal/badge-styles.js';
+import { styles } from './internal/badge-styles.cssresult.js';
 /**
  * @final
  * @suppress {visibility}

package/labs/badge/badge.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"badge.js","sourceRoot":"","sources":["badge.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAGH,OAAO,EAAC,aAAa,EAAC,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAC,KAAK,EAAC,MAAM,qBAAqB,CAAC;AAC1C,OAAO,EAAC,MAAM,EAAC,MAAM,~~4BAA4B~~,CAAC;~~AAQlD~~;;;GAGG;AAEI,IAAM,OAAO,GAAb,MAAM,OAAQ,SAAQ,KAAK;;AAChB,cAAM,GAAwB,CAAC,MAAM,CAAC,AAAhC,CAAiC;AAD5C,OAAO;IADnB,aAAa,CAAC,UAAU,CAAC;GACb,OAAO,CAEnB","sourcesContent":["/*\n @license\n * Copyright 2022 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n /\n\nimport {CSSResultOrNative} from 'lit';\nimport {customElement} from 'lit/decorators.js';\n\nimport {Badge} from './internal/badge.js';\nimport {styles} from './internal/badge-styles.js';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'md-badge': MdBadge;\n }\n}\n\n/\n @final\n * @suppress {visibility}\n */\n@customElement('md-badge')\nexport class MdBadge extends Badge {\n static override styles: CSSResultOrNative[] = [styles];\n}\n"]}
1	+ {"version":3,"file":"badge.js","sourceRoot":"","sources":["badge.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAGH,OAAO,EAAC,aAAa,EAAC,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAC,KAAK,EAAC,MAAM,qBAAqB,CAAC;AAC1C,OAAO,EAAC,MAAM,EAAC,MAAM,sCAAsC,CAAC;AAQ5D;;;GAGG;AAEI,IAAM,OAAO,GAAb,MAAM,OAAQ,SAAQ,KAAK;;AAChB,cAAM,GAAwB,CAAC,MAAM,CAAC,AAAhC,CAAiC;AAD5C,OAAO;IADnB,aAAa,CAAC,UAAU,CAAC;GACb,OAAO,CAEnB","sourcesContent":["/*\n @license\n * Copyright 2022 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n /\n\nimport {CSSResultOrNative} from 'lit';\nimport {customElement} from 'lit/decorators.js';\n\nimport {Badge} from './internal/badge.js';\nimport {styles} from './internal/badge-styles.cssresult.js';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'md-badge': MdBadge;\n }\n}\n\n/\n @final\n * @suppress {visibility}\n */\n@customElement('md-badge')\nexport class MdBadge extends Badge {\n static override styles: CSSResultOrNative[] = [styles];\n}\n"]}

package/labs/badge/internal/badge-styles.cssresult.d.ts ADDED Viewed

@@ -0,0 +1,3 @@
+export declare const styles: import("lit").CSSResult;
+declare const _default: CSSStyleSheet;
+export default _default;

package/labs/badge/internal/badge-styles.cssresult.js ADDED Viewed

@@ -0,0 +1,11 @@
+/**
+ * @license
+ * Copyright 2026 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+// Generated stylesheet for ./labs/badge/internal/badge-styles.css.
+import { css } from 'lit';
+export const styles = css `:host{--_color: var(--md-badge-color, var(--md-sys-color-error, #b3261e));--_large-color: var(--md-badge-large-color, var(--md-sys-color-error, #b3261e));--_large-label-text-color: var(--md-badge-large-label-text-color, var(--md-sys-color-on-error, #fff));--_large-label-text-font: var(--md-badge-large-label-text-font, var(--md-sys-typescale-label-small-font, var(--md-ref-typeface-plain, Roboto)));--_large-label-text-line-height: var(--md-badge-large-label-text-line-height, var(--md-sys-typescale-label-small-line-height, 1rem));--_large-label-text-size: var(--md-badge-large-label-text-size, var(--md-sys-typescale-label-small-size, 0.6875rem));--_large-label-text-weight: var(--md-badge-large-label-text-weight, var(--md-sys-typescale-label-small-weight, var(--md-ref-typeface-weight-medium, 500)));--_large-shape: var(--md-badge-large-shape, var(--md-sys-shape-corner-full, 9999px));--_large-size: var(--md-badge-large-size, 16px);--_shape: var(--md-badge-shape, var(--md-sys-shape-corner-full, 9999px));--_size: var(--md-badge-size, 6px)}.md3-badge{inset-inline-start:50%;margin-inline-start:6px;margin-block-start:4px;position:absolute;inset-block-start:0px;background-color:var(--_color);border-radius:var(--_shape);height:var(--_size)}.md3-badge:not(.md3-badge--large){width:var(--_size)}.md3-badge.md3-badge--large{display:flex;flex-direction:column;justify-content:center;margin-inline-start:2px;margin-block-start:1px;background-color:var(--_large-color);border-radius:var(--_large-shape);height:var(--_large-size);min-width:var(--_large-size);color:var(--_large-label-text-color)}.md3-badge.md3-badge--large .md3-badge__value{padding:0px 4px;text-align:center}.md3-badge__value{font-family:var(--_large-label-text-font);font-size:var(--_large-label-text-size);line-height:var(--_large-label-text-line-height);font-weight:var(--_large-label-text-weight)}
+`;
+export default styles.styleSheet;
+//# sourceMappingURL=badge-styles.cssresult.js.map

package/labs/badge/internal/badge-styles.cssresult.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"badge-styles.cssresult.js","sourceRoot":"","sources":["badge-styles.cssresult.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,mEAAmE;AACnE,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;CACxB,CAAC;AACF,eAAe,MAAM,CAAC,UAAW,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2026 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n// Generated stylesheet for ./labs/badge/internal/badge-styles.css.\nimport {css} from 'lit';\nexport const styles = css`:host{--_color: var(--md-badge-color, var(--md-sys-color-error, #b3261e));--_large-color: var(--md-badge-large-color, var(--md-sys-color-error, #b3261e));--_large-label-text-color: var(--md-badge-large-label-text-color, var(--md-sys-color-on-error, #fff));--_large-label-text-font: var(--md-badge-large-label-text-font, var(--md-sys-typescale-label-small-font, var(--md-ref-typeface-plain, Roboto)));--_large-label-text-line-height: var(--md-badge-large-label-text-line-height, var(--md-sys-typescale-label-small-line-height, 1rem));--_large-label-text-size: var(--md-badge-large-label-text-size, var(--md-sys-typescale-label-small-size, 0.6875rem));--_large-label-text-weight: var(--md-badge-large-label-text-weight, var(--md-sys-typescale-label-small-weight, var(--md-ref-typeface-weight-medium, 500)));--_large-shape: var(--md-badge-large-shape, var(--md-sys-shape-corner-full, 9999px));--_large-size: var(--md-badge-large-size, 16px);--_shape: var(--md-badge-shape, var(--md-sys-shape-corner-full, 9999px));--_size: var(--md-badge-size, 6px)}.md3-badge{inset-inline-start:50%;margin-inline-start:6px;margin-block-start:4px;position:absolute;inset-block-start:0px;background-color:var(--_color);border-radius:var(--_shape);height:var(--_size)}.md3-badge:not(.md3-badge--large){width:var(--_size)}.md3-badge.md3-badge--large{display:flex;flex-direction:column;justify-content:center;margin-inline-start:2px;margin-block-start:1px;background-color:var(--_large-color);border-radius:var(--_large-shape);height:var(--_large-size);min-width:var(--_large-size);color:var(--_large-label-text-color)}.md3-badge.md3-badge--large .md3-badge__value{padding:0px 4px;text-align:center}.md3-badge__value{font-family:var(--_large-label-text-font);font-size:var(--_large-label-text-size);line-height:var(--_large-label-text-line-height);font-weight:var(--_large-label-text-weight)}\n`;\nexport default styles.styleSheet!;\n"]}