@material/web 1.0.0-pre.6 → 1.0.0-pre.8

package/chips/lib/chip.js.map

@@ -1 +1 @@
-{"version":3,"file":"chip.js","sourceRoot":"","sources":["chip.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,8BAA8B,CAAC;AACtC,OAAO,2BAA2B,CAAC;AACnC,OAAO,wBAAwB,CAAC;AAEhC,OAAO,EAAC,IAAI,EAAE,UAAU,EAAE,OAAO,EAAiB,MAAM,KAAK,CAAC;AAC9D,OAAO,EAAC,QAAQ,EAAE,UAAU,EAAE,KAAK,EAAC,MAAM,mBAAmB,CAAC;AAC9D,OAAO,EAAC,QAAQ,EAAC,MAAM,6BAA6B,CAAC;AACrD,OAAO,EAAC,IAAI,EAAC,MAAM,wBAAwB,CAAC;AAC5C,OAAO,EAAC,IAAI,IAAI,UAAU,EAAE,OAAO,EAAC,MAAM,oBAAoB,CAAC;AAE/D,OAAO,EAAC,YAAY,EAAE,qBAAqB,EAAC,MAAM,6BAA6B,CAAC;AAChF,OAAO,EAAC,MAAM,EAAC,MAAM,2BAA2B,CAAC;AAGjD;;GAEG;AACH,MAAM,OAAO,IAAK,SAAQ,UAAU;IAApC;;QAC6B,aAAQ,GAAG,KAAK,CAAC;QACjB,aAAQ,GAAG,KAAK,CAAC;QAClB,SAAI,GAAG,EAAE,CAAC;QACV,UAAK,GAAG,EAAE,CAAC;QACX,WAAM,GAAG,EAAE,CAAC;QAErB,kBAAa,GAAG,KAAK,CAAC;QACtB,eAAU,GAAG,KAAK,CAAC;QAuCnB,cAAS,GAAG,GAAG,EAAE;YAChC,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;YACvB,OAAO,IAAI,CAAC,MAAM,CAAC;QACrB,CAAC,CAAC;QAEe,iBAAY,GAAG,GAAG,EAAE;YACnC,OAAO,IAAI,CAAA,wBAAwB,IAAI,CAAC,QAAQ,eAAe,CAAC;QAClE,CAAC,CAAC;IAcJ,CAAC;IAzDU,MAAM;QACb,MAAM,OAAO,GAAG;YACd,QAAQ,EAAE,IAAI,CAAC,QAAQ;YACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ;YACvB,IAAI,EAAE,CAAC,IAAI,CAAC,QAAQ;SACrB,CAAC;QAEF,MAAM,MAAM,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,OAAO,CAAA,GAAG,CAAC,CAAC,CAAC,OAAO,CAAA,QAAQ,CAAC;QACxD,OAAO,UAAU,CAAA;SACZ,MAAM,qBAAqB,QAAQ,CAAC,OAAO,CAAC;sBAC/B,IAAI,CAAC,QAAQ;iBAClB,IAAI,CAAC,IAAI,IAAI,OAAO;mBAClB,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO;kBAClC,IAAI,CAAC,UAAU;mBACd,IAAI,CAAC,WAAW;yBACV,IAAI,CAAC,iBAAiB;YACnC,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC;UACxB,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAA,+BAA+B,CAAC,CAAC,CAAC,OAAO;UAC7D,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE,IAAI,CAAC,YAAY,CAAC;kCAChB,IAAI,CAAC,aAAa;;;;8BAItB,IAAI,CAAC,KAAK;;YAE5B,IAAI,CAAC,kBAAkB,EAAE,EAAE,IAAI,OAAO;;UAExC,MAAM;KACX,CAAC;IACJ,CAAC;IAgBO,UAAU;QAChB,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC;IAC7B,CAAC;IAEO,WAAW;QACjB,IAAI,CAAC,aAAa,GAAG,qBAAqB,EAAE,CAAC;IAC/C,CAAC;IAEO,iBAAiB;QACvB,YAAY,EAAE,CAAC;QACf,IAAI,CAAC,aAAa,GAAG,qBAAqB,EAAE,CAAC;IAC/C,CAAC;CACF;AAnEC;IAAC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAC,CAAC;;sCAAkB;AAC5C;IAAC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAC,CAAC;;sCAAkB;AAC5C;IAAC,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;;kCAAW;AACpC;IAAC,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;;mCAAY;AACrC;IAAC,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;;oCAAa;AAEtC;IAAC,KAAK,EAAE;;2CAA+B;AACvC;IAAC,KAAK,EAAE;;wCAA4B;AACpC;IAAC,UAAU,CAAC,WAAW,CAAC;;oCAAkD","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport '../../elevation/elevation.js';\nimport '../../focus/focus-ring.js';\nimport '../../ripple/ripple.js';\n\nimport {html, LitElement, nothing, TemplateResult} from 'lit';\nimport {property, queryAsync, state} from 'lit/decorators.js';\nimport {classMap} from 'lit/directives/class-map.js';\nimport {when} from 'lit/directives/when.js';\nimport {html as staticHtml, literal} from 'lit/static-html.js';\n\nimport {pointerPress, shouldShowStrongFocus} from '../../focus/strong-focus.js';\nimport {ripple} from '../../ripple/directive.js';\nimport {MdRipple} from '../../ripple/ripple.js';\n\n/**\n * A chip component.\n */\nexport class Chip extends LitElement {\n  @property({type: Boolean}) disabled = false;\n  @property({type: Boolean}) elevated = false;\n  @property({type: String}) href = '';\n  @property({type: String}) label = '';\n  @property({type: String}) target = '';\n\n  @state() private showFocusRing = false;\n  @state() private showRipple = false;\n  @queryAsync('md-ripple') private readonly ripple!: Promise<MdRipple|null>;\n\n  override render() {\n    const classes = {\n      disabled: this.disabled,\n      elevated: this.elevated,\n      flat: !this.elevated,\n    };\n\n    const button = this.href ? literal`a` : literal`button`;\n    return staticHtml`\n      <${button} class=\"container ${classMap(classes)}\"\n          ?disabled=${this.disabled}\n          href=${this.href || nothing}\n          target=${this.href ? this.target : nothing}\n          @blur=${this.handleBlur}\n          @focus=${this.handleFocus}\n          @pointerdown=${this.handlePointerDown}\n          ${ripple(this.getRipple)}>\n        ${this.elevated ? html`<md-elevation></md-elevation>` : nothing}\n        ${when(this.showRipple, this.renderRipple)}\n        <md-focus-ring .visible=${this.showFocusRing}></md-focus-ring>\n        <span class=\"icon leading\">\n          <slot name=\"leading-icon\"></slot>\n        </span>\n        <span class=\"label\">${this.label}</span>\n        <span class=\"icon trailing\">\n          ${this.renderTrailingIcon?.() || nothing}\n        </span>\n      </${button}>\n    `;\n  }\n\n  // Not all chip variants have a trailing icon. We still render a wrapper\n  // <span class=\"icon trailing\"> to compute the correct padding + gap of the\n  // button.\n  protected renderTrailingIcon?: () => TemplateResult;\n\n  private readonly getRipple = () => {  // bind to this\n    this.showRipple = true;\n    return this.ripple;\n  };\n\n  private readonly renderRipple = () => {  // bind to this\n    return html`<md-ripple ?disabled=${this.disabled}></md-ripple>`;\n  };\n\n  private handleBlur() {\n    this.showFocusRing = false;\n  }\n\n  private handleFocus() {\n    this.showFocusRing = shouldShowStrongFocus();\n  }\n\n  private handlePointerDown() {\n    pointerPress();\n    this.showFocusRing = shouldShowStrongFocus();\n  }\n}\n"]}
+{"version":3,"file":"chip.js","sourceRoot":"","sources":["chip.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;;AAEH,OAAO,2BAA2B,CAAC;AACnC,OAAO,wBAAwB,CAAC;AAEhC,OAAO,EAAC,IAAI,EAAE,UAAU,EAAE,OAAO,EAAiB,MAAM,KAAK,CAAC;AAC9D,OAAO,EAAC,QAAQ,EAAE,UAAU,EAAE,KAAK,EAAC,MAAM,mBAAmB,CAAC;AAC9D,OAAO,EAAC,QAAQ,EAAC,MAAM,6BAA6B,CAAC;AAErD,OAAO,EAAC,yBAAyB,EAAC,MAAM,wBAAwB,CAAC;AAGjE;;GAEG;AACH,MAAM,OAAgB,IAAK,SAAQ,UAAU;IAA7C;;QAK6B,aAAQ,GAAG,KAAK,CAAC;QAChC,UAAK,GAAG,EAAE,CAAC;QAeN,sBAAiB,GAAG,KAAK,CAAC;QAoDjC,qBAAgB,GAAG,GAAG,EAAE;YAChC,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC;YAC9B,OAAO,IAAI,CAAC,aAAa,CAAC;QAC5B,CAAC,CAAC;IACJ,CAAC;IAhEC;;;OAGG;IACH,IAAc,qBAAqB;QACjC,OAAO,IAAI,CAAC,QAAQ,CAAC;IACvB,CAAC;IAMkB,MAAM;QACvB,MAAM,aAAa,GAAG,IAAI,CAAC,iBAAiB,CAAC,CAAC;YAC1C,IAAI,CAAA,wBAAwB,IAAI,CAAC,qBAAqB,eAAe,CAAC,CAAC;YACvE,OAAO,CAAC;QAEZ,MAAM,YAAY,GACd,IAAI,CAAA,sBAAsB,IAAI,CAAC,eAAe,mBAAmB,CAAC;QAEtE,OAAO,IAAI,CAAA;8BACe,QAAQ,CAAC,IAAI,CAAC,mBAAmB,EAAE,CAAC;UACxD,IAAI,CAAC,aAAa,EAAE;UACpB,YAAY;UACZ,aAAa;UACb,IAAI,CAAC,mBAAmB,EAAE;UAC1B,IAAI,CAAC,oBAAoB,EAAE;;KAEhC,CAAC;IACJ,CAAC;IAES,mBAAmB;QAC3B,OAAO;YACL,QAAQ,EAAE,IAAI,CAAC,QAAQ;SACxB,CAAC;IACJ,CAAC;IAES,aAAa;QACrB,OAAO,IAAI,CAAA;;UAEL,IAAI,CAAC,iBAAiB,EAAE;;4BAEN,IAAI,CAAC,KAAK;KACjC,CAAC;IACJ,CAAC;IAIS,oBAAoB;QAC5B,OAAO,OAAO,CAAC;IACjB,CAAC;IAES,aAAa;QACrB,OAAO,IAAI,CAAA,+BAA+B,CAAC;IAC7C,CAAC;IAES,iBAAiB;QACzB,OAAO,IAAI,CAAA,2BAA2B,CAAC;IACzC,CAAC;CAMF;;AA5EC;IACE,yBAAyB,CAAC,EAAI,CAAC,CAAC;AAClC,CAAC,GAAA,CAAA;AAE0B;IAA1B,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAC,CAAC;sCAAkB;AAChC;IAAX,QAAQ,EAAE;mCAAY;AAed;IAAR,KAAK,EAAE;+CAAmC;AAE3C;IADC,UAAU,CAAC,WAAW,CAAC;2CACgC","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport '../../focus/focus-ring.js';\nimport '../../ripple/ripple.js';\n\nimport {html, LitElement, nothing, TemplateResult} from 'lit';\nimport {property, queryAsync, state} from 'lit/decorators.js';\nimport {classMap} from 'lit/directives/class-map.js';\n\nimport {requestUpdateOnAriaChange} from '../../aria/delegate.js';\nimport {MdRipple} from '../../ripple/ripple.js';\n\n/**\n * A chip component.\n */\nexport abstract class Chip extends LitElement {\n  static {\n    requestUpdateOnAriaChange(this);\n  }\n\n  @property({type: Boolean}) disabled = false;\n  @property() label = '';\n\n  /**\n   * The `id` of the action the primary focus ring is for.\n   */\n  protected abstract readonly primaryFocusFor: string;\n\n  /**\n   * Whether or not the primary ripple is disabled (defaults to `disabled`).\n   * Some chip actions such as links cannot be disabled.\n   */\n  protected get primaryRippleDisabled() {\n    return this.disabled;\n  }\n\n  @state() private showPrimaryRipple = false;\n  @queryAsync('md-ripple')\n  private readonly primaryRipple!: Promise<MdRipple|null>;\n\n  protected override render() {\n    const primaryRipple = this.showPrimaryRipple ?\n        html`<md-ripple ?disabled=${this.primaryRippleDisabled}></md-ripple>` :\n        nothing;\n\n    const primaryFocus =\n        html`<md-focus-ring for=${this.primaryFocusFor}></md-focus-ring>`;\n\n    return html`\n      <div class=\"container ${classMap(this.getContainerClasses())}\">\n        ${this.renderOutline()}\n        ${primaryFocus}\n        ${primaryRipple}\n        ${this.renderPrimaryAction()}\n        ${this.renderTrailingAction()}\n      </div>\n    `;\n  }\n\n  protected getContainerClasses() {\n    return {\n      disabled: this.disabled,\n    };\n  }\n\n  protected renderContent() {\n    return html`\n      <span class=\"icon\">\n        ${this.renderLeadingIcon()}\n      </span>\n      <span class=\"label\">${this.label}</span>\n    `;\n  }\n\n  protected abstract renderPrimaryAction(): TemplateResult;\n\n  protected renderTrailingAction(): TemplateResult|typeof nothing {\n    return nothing;\n  }\n\n  protected renderOutline() {\n    return html`<span class=\"outline\"></span>`;\n  }\n\n  protected renderLeadingIcon(): TemplateResult {\n    return html`<slot name=\"icon\"></slot>`;\n  }\n\n  protected getPrimaryRipple = () => {\n    this.showPrimaryRipple = true;\n    return this.primaryRipple;\n  };\n}\n"]}

package/chips/lib/elevated-styles.css.js

@@ -0,0 +1,9 @@
+/**
+  * @license
+  * Copyright 2022 Google LLC
+  * SPDX-License-Identifier: Apache-2.0
+  */
+import { css } from 'lit';
+export const styles = css `.elevated{--md-elevation-level:var(--_elevated-container-elevation);--md-elevation-shadow-color:var(--_elevated-container-shadow-color)}.elevated::before{background:var(--_elevated-container-color)}.elevated:hover{--md-elevation-level:var(--_elevated-hover-container-elevation)}.elevated:focus-within{--md-elevation-level:var(--_elevated-focus-container-elevation)}.elevated:active{--md-elevation-level:var(--_elevated-pressed-container-elevation)}.elevated.disabled{--md-elevation-level:var(--_elevated-disabled-container-elevation)}.elevated.disabled::before{background:var(--_elevated-disabled-container-color);opacity:var(--_elevated-disabled-container-opacity)}/*# sourceMappingURL=elevated-styles.css.map */
+`;
+//# sourceMappingURL=elevated-styles.css.js.map

package/chips/lib/elevated-styles.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"elevated-styles.css.js","sourceRoot":"","sources":["elevated-styles.css.ts"],"names":[],"mappings":"AAAA;;;;IAII;AACH,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;CACzB,CAAC","sourcesContent":["/**\n  * @license\n  * Copyright 2022 Google LLC\n  * SPDX-License-Identifier: Apache-2.0\n  */\n import {css} from 'lit';\n export const styles = css`.elevated{--md-elevation-level:var(--_elevated-container-elevation);--md-elevation-shadow-color:var(--_elevated-container-shadow-color)}.elevated::before{background:var(--_elevated-container-color)}.elevated:hover{--md-elevation-level:var(--_elevated-hover-container-elevation)}.elevated:focus-within{--md-elevation-level:var(--_elevated-focus-container-elevation)}.elevated:active{--md-elevation-level:var(--_elevated-pressed-container-elevation)}.elevated.disabled{--md-elevation-level:var(--_elevated-disabled-container-elevation)}.elevated.disabled::before{background:var(--_elevated-disabled-container-color);opacity:var(--_elevated-disabled-container-opacity)}/*# sourceMappingURL=elevated-styles.css.map */\n`;\n "]}

package/{fab/lib/fab-extended-styles.scss → chips/lib/elevated-styles.scss}

@@ -1,10 +1,10 @@
 //
-// Copyright 2021 Google LLC
+// Copyright 2023 Google LLC
 // SPDX-License-Identifier: Apache-2.0
 //
 
 // go/keep-sorted start
-@use './fab-extended';
+@use './elevated';
 // go/keep-sorted end
 
-@include fab-extended.styles;
+@include elevated.styles;

package/chips/lib/filter-chip.d.ts

@@ -0,0 +1,26 @@
+/**
+ * @license
+ * Copyright 2023 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+import '../../elevation/elevation.js';
+import { PropertyValues } from 'lit';
+import { Chip } from './chip.js';
+/**
+ * A filter chip component.
+ */
+export declare class FilterChip extends Chip {
+    elevated: boolean;
+    selected: boolean;
+    protected get primaryFocusFor(): string;
+    constructor();
+    protected updated(changedProperties: PropertyValues<FilterChip>): void;
+    protected getContainerClasses(): {
+        elevated: boolean;
+        selected: boolean;
+        disabled: boolean;
+    };
+    protected renderPrimaryAction(): import("lit-html").TemplateResult<1>;
+    protected renderLeadingIcon(): import("lit-html").TemplateResult<2 | 1>;
+    protected renderOutline(): import("lit-html").TemplateResult<1>;
+}

package/chips/lib/filter-chip.js

@@ -0,0 +1,80 @@
+/**
+ * @license
+ * Copyright 2023 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+import { __decorate } from "tslib";
+import '../../elevation/elevation.js';
+import { html, nothing, svg } from 'lit';
+import { property } from 'lit/decorators.js';
+import { ripple } from '../../ripple/directive.js';
+import { Chip } from './chip.js';
+/**
+ * A filter chip component.
+ */
+export class FilterChip extends Chip {
+    get primaryFocusFor() {
+        return 'option';
+    }
+    constructor() {
+        super();
+        this.elevated = false;
+        this.selected = false;
+        this.addEventListener('click', () => {
+            if (this.disabled) {
+                return;
+            }
+            this.selected = !this.selected;
+        });
+    }
+    updated(changedProperties) {
+        if (changedProperties.has('selected') &&
+            changedProperties.get('selected') !== undefined) {
+            // Dispatch when `selected` changes, except for the first update.
+            this.dispatchEvent(new Event('change', { bubbles: true }));
+        }
+    }
+    getContainerClasses() {
+        return {
+            ...super.getContainerClasses(),
+            elevated: this.elevated,
+            selected: this.selected,
+        };
+    }
+    renderPrimaryAction() {
+        const { ariaLabel } = this;
+        return html `
+      <button class="action"
+        id="option"
+        aria-label=${ariaLabel || nothing}
+        aria-selected=${this.selected}
+        ?disabled=${this.disabled || nothing}
+        role="option"
+        ${ripple(this.getPrimaryRipple)}
+      >${this.renderContent()}</button>
+    `;
+    }
+    renderLeadingIcon() {
+        if (!this.selected) {
+            return super.renderLeadingIcon();
+        }
+        return svg `
+      <svg class="checkmark" viewBox="0 0 18 18" aria-hidden="true">
+        <path d="M6.75012 12.1274L3.62262 8.99988L2.55762 10.0574L6.75012 14.2499L15.7501 5.24988L14.6926 4.19238L6.75012 12.1274Z" />
+      </svg>
+    `;
+    }
+    renderOutline() {
+        if (this.elevated) {
+            return html `<md-elevation></md-elevation>`;
+        }
+        return super.renderOutline();
+    }
+}
+__decorate([
+    property({ type: Boolean })
+], FilterChip.prototype, "elevated", void 0);
+__decorate([
+    property({ type: Boolean })
+], FilterChip.prototype, "selected", void 0);
+//# sourceMappingURL=filter-chip.js.map

package/chips/lib/filter-chip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"filter-chip.js","sourceRoot":"","sources":["filter-chip.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,8BAA8B,CAAC;AAEtC,OAAO,EAAC,IAAI,EAAE,OAAO,EAAkB,GAAG,EAAC,MAAM,KAAK,CAAC;AACvD,OAAO,EAAC,QAAQ,EAAC,MAAM,mBAAmB,CAAC;AAE3C,OAAO,EAAC,MAAM,EAAC,MAAM,2BAA2B,CAAC;AAGjD,OAAO,EAAC,IAAI,EAAC,MAAM,WAAW,CAAC;AAE/B;;GAEG;AACH,MAAM,OAAO,UAAW,SAAQ,IAAI;IAIlC,IAAc,eAAe;QAC3B,OAAO,QAAQ,CAAC;IAClB,CAAC;IAED;QACE,KAAK,EAAE,CAAC;QARiB,aAAQ,GAAG,KAAK,CAAC;QACjB,aAAQ,GAAG,KAAK,CAAC;QAQ1C,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,GAAG,EAAE;YAClC,IAAI,IAAI,CAAC,QAAQ,EAAE;gBACjB,OAAO;aACR;YAED,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC;QACjC,CAAC,CAAC,CAAC;IACL,CAAC;IAEkB,OAAO,CAAC,iBAA6C;QACtE,IAAI,iBAAiB,CAAC,GAAG,CAAC,UAAU,CAAC;YACjC,iBAAiB,CAAC,GAAG,CAAC,UAAU,CAAC,KAAK,SAAS,EAAE;YACnD,iEAAiE;YACjE,IAAI,CAAC,aAAa,CAAC,IAAI,KAAK,CAAC,QAAQ,EAAE,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC,CAAC,CAAC;SAC1D;IACH,CAAC;IAEkB,mBAAmB;QACpC,OAAO;YACL,GAAG,KAAK,CAAC,mBAAmB,EAAE;YAC9B,QAAQ,EAAE,IAAI,CAAC,QAAQ;YACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ;SACxB,CAAC;IACJ,CAAC;IAEkB,mBAAmB;QACpC,MAAM,EAAC,SAAS,EAAC,GAAG,IAAuB,CAAC;QAC5C,OAAO,IAAI,CAAA;;;qBAGM,SAAS,IAAI,OAAO;wBACjB,IAAI,CAAC,QAAQ;oBACjB,IAAI,CAAC,QAAQ,IAAI,OAAO;;UAElC,MAAM,CAAC,IAAI,CAAC,gBAAgB,CAAC;SAC9B,IAAI,CAAC,aAAa,EAAE;KACxB,CAAC;IACJ,CAAC;IAEkB,iBAAiB;QAClC,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;YAClB,OAAO,KAAK,CAAC,iBAAiB,EAAE,CAAC;SAClC;QAED,OAAO,GAAG,CAAA;;;;KAIT,CAAC;IACJ,CAAC;IAEkB,aAAa;QAC9B,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,OAAO,IAAI,CAAA,+BAA+B,CAAC;SAC5C;QAED,OAAO,KAAK,CAAC,aAAa,EAAE,CAAC;IAC/B,CAAC;CACF;AAnE4B;IAA1B,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAC,CAAC;4CAAkB;AACjB;IAA1B,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAC,CAAC;4CAAkB","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport '../../elevation/elevation.js';\n\nimport {html, nothing, PropertyValues, svg} from 'lit';\nimport {property} from 'lit/decorators.js';\n\nimport {ripple} from '../../ripple/directive.js';\nimport {ARIAMixinStrict} from '../../types/aria.js';\n\nimport {Chip} from './chip.js';\n\n/**\n * A filter chip component.\n */\nexport class FilterChip extends Chip {\n  @property({type: Boolean}) elevated = false;\n  @property({type: Boolean}) selected = false;\n\n  protected get primaryFocusFor() {\n    return 'option';\n  }\n\n  constructor() {\n    super();\n    this.addEventListener('click', () => {\n      if (this.disabled) {\n        return;\n      }\n\n      this.selected = !this.selected;\n    });\n  }\n\n  protected override updated(changedProperties: PropertyValues<FilterChip>) {\n    if (changedProperties.has('selected') &&\n        changedProperties.get('selected') !== undefined) {\n      // Dispatch when `selected` changes, except for the first update.\n      this.dispatchEvent(new Event('change', {bubbles: true}));\n    }\n  }\n\n  protected override getContainerClasses() {\n    return {\n      ...super.getContainerClasses(),\n      elevated: this.elevated,\n      selected: this.selected,\n    };\n  }\n\n  protected override renderPrimaryAction() {\n    const {ariaLabel} = this as ARIAMixinStrict;\n    return html`\n      <button class=\"action\"\n        id=\"option\"\n        aria-label=${ariaLabel || nothing}\n        aria-selected=${this.selected}\n        ?disabled=${this.disabled || nothing}\n        role=\"option\"\n        ${ripple(this.getPrimaryRipple)}\n      >${this.renderContent()}</button>\n    `;\n  }\n\n  protected override renderLeadingIcon() {\n    if (!this.selected) {\n      return super.renderLeadingIcon();\n    }\n\n    return svg`\n      <svg class=\"checkmark\" viewBox=\"0 0 18 18\" aria-hidden=\"true\">\n        <path d=\"M6.75012 12.1274L3.62262 8.99988L2.55762 10.0574L6.75012 14.2499L15.7501 5.24988L14.6926 4.19238L6.75012 12.1274Z\" />\n      </svg>\n    `;\n  }\n\n  protected override renderOutline() {\n    if (this.elevated) {\n      return html`<md-elevation></md-elevation>`;\n    }\n\n    return super.renderOutline();\n  }\n}\n"]}

package/chips/lib/filter-styles.css.js

@@ -0,0 +1,9 @@
+/**
+  * @license
+  * Copyright 2022 Google LLC
+  * SPDX-License-Identifier: Apache-2.0
+  */
+import { css } from 'lit';
+export const styles = css `:host{--_container-height: var(--md-filter-chip-container-height, 32px);--_container-shape: var(--md-filter-chip-container-shape, 8px);--_disabled-label-text-color: var(--md-filter-chip-disabled-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-label-text-opacity: var(--md-filter-chip-disabled-label-text-opacity, 0.38);--_elevated-container-elevation: var(--md-filter-chip-elevated-container-elevation, 1);--_elevated-container-shadow-color: var(--md-filter-chip-elevated-container-shadow-color, var(--md-sys-color-shadow, #000));--_elevated-disabled-container-color: var(--md-filter-chip-elevated-disabled-container-color, var(--md-sys-color-on-surface, #1d1b20));--_elevated-disabled-container-elevation: var(--md-filter-chip-elevated-disabled-container-elevation, 0);--_elevated-disabled-container-opacity: var(--md-filter-chip-elevated-disabled-container-opacity, 0.12);--_elevated-focus-container-elevation: var(--md-filter-chip-elevated-focus-container-elevation, 1);--_elevated-hover-container-elevation: var(--md-filter-chip-elevated-hover-container-elevation, 2);--_elevated-pressed-container-elevation: var(--md-filter-chip-elevated-pressed-container-elevation, 1);--_elevated-selected-container-color: var(--md-filter-chip-elevated-selected-container-color, var(--md-sys-color-secondary-container, #e8def8));--_label-text-type: var(--md-filter-chip-label-text-type, var(--md-sys-typescale-label-large, 500 0.875rem / 1.25rem var(--md-ref-typeface-plain, Roboto)));--_selected-focus-label-text-color: var(--md-filter-chip-selected-focus-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-focus-state-layer-color: var(--md-filter-chip-selected-focus-state-layer-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-focus-state-layer-opacity: var(--md-filter-chip-selected-focus-state-layer-opacity, 0.12);--_selected-hover-label-text-color: var(--md-filter-chip-selected-hover-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-hover-state-layer-color: var(--md-filter-chip-selected-hover-state-layer-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-hover-state-layer-opacity: var(--md-filter-chip-selected-hover-state-layer-opacity, 0.08);--_selected-label-text-color: var(--md-filter-chip-selected-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-pressed-label-text-color: var(--md-filter-chip-selected-pressed-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-pressed-state-layer-color: var(--md-filter-chip-selected-pressed-state-layer-color, var(--md-sys-color-on-surface-variant, #49454f));--_selected-pressed-state-layer-opacity: var(--md-filter-chip-selected-pressed-state-layer-opacity, 0.12);--_elevated-container-color: var(--md-filter-chip-elevated-container-color, var(--md-sys-color-surface-container-low, #f7f2fa));--_disabled-outline-color: var(--md-filter-chip-disabled-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-outline-opacity: var(--md-filter-chip-disabled-outline-opacity, 0.12);--_disabled-selected-container-color: var(--md-filter-chip-disabled-selected-container-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-selected-container-opacity: var(--md-filter-chip-disabled-selected-container-opacity, 0.12);--_focus-outline-color: var(--md-filter-chip-focus-outline-color, var(--md-sys-color-on-surface-variant, #49454f));--_outline-color: var(--md-filter-chip-outline-color, var(--md-sys-color-outline, #79747e));--_outline-width: var(--md-filter-chip-outline-width, 1px);--_selected-container-color: var(--md-filter-chip-selected-container-color, var(--md-sys-color-secondary-container, #e8def8));--_selected-outline-width: var(--md-filter-chip-selected-outline-width, 0px);--_focus-label-text-color: var(--md-filter-chip-focus-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_focus-state-layer-color: var(--md-filter-chip-focus-state-layer-color, var(--md-sys-color-on-surface-variant, #49454f));--_focus-state-layer-opacity: var(--md-filter-chip-focus-state-layer-opacity, 0.12);--_hover-label-text-color: var(--md-filter-chip-hover-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-state-layer-color: var(--md-filter-chip-hover-state-layer-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-state-layer-opacity: var(--md-filter-chip-hover-state-layer-opacity, 0.08);--_label-text-color: var(--md-filter-chip-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_pressed-label-text-color: var(--md-filter-chip-pressed-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_pressed-state-layer-color: var(--md-filter-chip-pressed-state-layer-color, var(--md-sys-color-on-secondary-container, #1d192b));--_pressed-state-layer-opacity: var(--md-filter-chip-pressed-state-layer-opacity, 0.12);--_icon-size: var(--md-filter-chip-icon-size, 18px);--_disabled-leading-icon-color: var(--md-filter-chip-disabled-leading-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-leading-icon-opacity: var(--md-filter-chip-disabled-leading-icon-opacity, 0.38);--_selected-focus-leading-icon-color: var(--md-filter-chip-selected-focus-leading-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-hover-leading-icon-color: var(--md-filter-chip-selected-hover-leading-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-leading-icon-color: var(--md-filter-chip-selected-leading-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-pressed-leading-icon-color: var(--md-filter-chip-selected-pressed-leading-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_focus-leading-icon-color: var(--md-filter-chip-focus-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_hover-leading-icon-color: var(--md-filter-chip-hover-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_leading-icon-color: var(--md-filter-chip-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_pressed-leading-icon-color: var(--md-filter-chip-pressed-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_disabled-trailing-icon-color: var(--md-filter-chip-disabled-trailing-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-trailing-icon-opacity: var(--md-filter-chip-disabled-trailing-icon-opacity, 0.38);--_selected-focus-trailing-icon-color: var(--md-filter-chip-selected-focus-trailing-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-hover-trailing-icon-color: var(--md-filter-chip-selected-hover-trailing-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-pressed-trailing-icon-color: var(--md-filter-chip-selected-pressed-trailing-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-trailing-icon-color: var(--md-filter-chip-selected-trailing-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_focus-trailing-icon-color: var(--md-filter-chip-focus-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-trailing-icon-color: var(--md-filter-chip-hover-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_pressed-trailing-icon-color: var(--md-filter-chip-pressed-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_trailing-icon-color: var(--md-filter-chip-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_container-shape-start-start: var( --md-filter-chip-container-shape-start-start, var(--_container-shape) );--_container-shape-start-end: var( --md-filter-chip-container-shape-start-end, var(--_container-shape) );--_container-shape-end-end: var( --md-filter-chip-container-shape-end-end, var(--_container-shape) );--_container-shape-end-start: var( --md-filter-chip-container-shape-end-start, var(--_container-shape) )}.selected{--md-ripple-focus-color:var(--_selected-focus-state-layer-color);--md-ripple-focus-opacity:var(--_selected-focus-state-layer-opacity);--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)}.selected .icon{width:var(--_icon-size)}.checkmark{inset:0;opacity:0;position:absolute}.selected .checkmark{opacity:1}.selected::before{background:var(--_selected-container-color)}.selected .outline{border-width:var(--_selected-outline-width)}.selected.elevated::before{background:var(--_elevated-selected-container-color)}.selected.disabled::before{background:var(--_disabled-selected-container-color);opacity:var(--_disabled-selected-container-opacity)}.selected .label{color:var(--_selected-label-text-color)}.selected:hover .label{color:var(--_selected-hover-label-text-color)}.selected:focus .label{color:var(--_selected-focus-label-text-color)}.selected:active .label{color:var(--_selected-pressed-label-text-color)}.selected .icon{color:var(--_selected-leading-icon-color)}.selected:hover .icon{color:var(--_selected-hover-leading-icon-color)}.selected:focus .icon{color:var(--_selected-focus-leading-icon-color)}.selected:active .icon{color:var(--_selected-pressed-leading-icon-color)}.icon.trailing{color:var(--_trailing-icon-color)}:hover .icon.trailing{color:var(--_hover-trailing-icon-color)}:focus .icon.trailing{color:var(--_focus-trailing-icon-color)}:active .icon.trailing{color:var(--_pressed-trailing-icon-color)}.disabled .icon.trailing{color:var(--_disabled-trailing-icon-color);opacity:var(--_disabled-trailing-icon-opacity)}.selected .icon.trailing{color:var(--_selected-trailing-icon-color)}.selected:hover .icon.trailing{color:var(--_selected-hover-trailing-icon-color)}.selected:focus .icon.trailing{color:var(--_selected-focus-trailing-icon-color)}.selected:active .icon.trailing{color:var(--_selected-pressed-trailing-icon-color)}/*# sourceMappingURL=filter-styles.css.map */
+`;
+//# sourceMappingURL=filter-styles.css.js.map

package/chips/lib/filter-styles.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"filter-styles.css.js","sourceRoot":"","sources":["filter-styles.css.ts"],"names":[],"mappings":"AAAA;;;;IAII;AACH,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;CACzB,CAAC","sourcesContent":["/**\n  * @license\n  * Copyright 2022 Google LLC\n  * SPDX-License-Identifier: Apache-2.0\n  */\n import {css} from 'lit';\n export const styles = css`:host{--_container-height: var(--md-filter-chip-container-height, 32px);--_container-shape: var(--md-filter-chip-container-shape, 8px);--_disabled-label-text-color: var(--md-filter-chip-disabled-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-label-text-opacity: var(--md-filter-chip-disabled-label-text-opacity, 0.38);--_elevated-container-elevation: var(--md-filter-chip-elevated-container-elevation, 1);--_elevated-container-shadow-color: var(--md-filter-chip-elevated-container-shadow-color, var(--md-sys-color-shadow, #000));--_elevated-disabled-container-color: var(--md-filter-chip-elevated-disabled-container-color, var(--md-sys-color-on-surface, #1d1b20));--_elevated-disabled-container-elevation: var(--md-filter-chip-elevated-disabled-container-elevation, 0);--_elevated-disabled-container-opacity: var(--md-filter-chip-elevated-disabled-container-opacity, 0.12);--_elevated-focus-container-elevation: var(--md-filter-chip-elevated-focus-container-elevation, 1);--_elevated-hover-container-elevation: var(--md-filter-chip-elevated-hover-container-elevation, 2);--_elevated-pressed-container-elevation: var(--md-filter-chip-elevated-pressed-container-elevation, 1);--_elevated-selected-container-color: var(--md-filter-chip-elevated-selected-container-color, var(--md-sys-color-secondary-container, #e8def8));--_label-text-type: var(--md-filter-chip-label-text-type, var(--md-sys-typescale-label-large, 500 0.875rem / 1.25rem var(--md-ref-typeface-plain, Roboto)));--_selected-focus-label-text-color: var(--md-filter-chip-selected-focus-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-focus-state-layer-color: var(--md-filter-chip-selected-focus-state-layer-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-focus-state-layer-opacity: var(--md-filter-chip-selected-focus-state-layer-opacity, 0.12);--_selected-hover-label-text-color: var(--md-filter-chip-selected-hover-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-hover-state-layer-color: var(--md-filter-chip-selected-hover-state-layer-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-hover-state-layer-opacity: var(--md-filter-chip-selected-hover-state-layer-opacity, 0.08);--_selected-label-text-color: var(--md-filter-chip-selected-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-pressed-label-text-color: var(--md-filter-chip-selected-pressed-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-pressed-state-layer-color: var(--md-filter-chip-selected-pressed-state-layer-color, var(--md-sys-color-on-surface-variant, #49454f));--_selected-pressed-state-layer-opacity: var(--md-filter-chip-selected-pressed-state-layer-opacity, 0.12);--_elevated-container-color: var(--md-filter-chip-elevated-container-color, var(--md-sys-color-surface-container-low, #f7f2fa));--_disabled-outline-color: var(--md-filter-chip-disabled-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-outline-opacity: var(--md-filter-chip-disabled-outline-opacity, 0.12);--_disabled-selected-container-color: var(--md-filter-chip-disabled-selected-container-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-selected-container-opacity: var(--md-filter-chip-disabled-selected-container-opacity, 0.12);--_focus-outline-color: var(--md-filter-chip-focus-outline-color, var(--md-sys-color-on-surface-variant, #49454f));--_outline-color: var(--md-filter-chip-outline-color, var(--md-sys-color-outline, #79747e));--_outline-width: var(--md-filter-chip-outline-width, 1px);--_selected-container-color: var(--md-filter-chip-selected-container-color, var(--md-sys-color-secondary-container, #e8def8));--_selected-outline-width: var(--md-filter-chip-selected-outline-width, 0px);--_focus-label-text-color: var(--md-filter-chip-focus-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_focus-state-layer-color: var(--md-filter-chip-focus-state-layer-color, var(--md-sys-color-on-surface-variant, #49454f));--_focus-state-layer-opacity: var(--md-filter-chip-focus-state-layer-opacity, 0.12);--_hover-label-text-color: var(--md-filter-chip-hover-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-state-layer-color: var(--md-filter-chip-hover-state-layer-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-state-layer-opacity: var(--md-filter-chip-hover-state-layer-opacity, 0.08);--_label-text-color: var(--md-filter-chip-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_pressed-label-text-color: var(--md-filter-chip-pressed-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_pressed-state-layer-color: var(--md-filter-chip-pressed-state-layer-color, var(--md-sys-color-on-secondary-container, #1d192b));--_pressed-state-layer-opacity: var(--md-filter-chip-pressed-state-layer-opacity, 0.12);--_icon-size: var(--md-filter-chip-icon-size, 18px);--_disabled-leading-icon-color: var(--md-filter-chip-disabled-leading-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-leading-icon-opacity: var(--md-filter-chip-disabled-leading-icon-opacity, 0.38);--_selected-focus-leading-icon-color: var(--md-filter-chip-selected-focus-leading-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-hover-leading-icon-color: var(--md-filter-chip-selected-hover-leading-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-leading-icon-color: var(--md-filter-chip-selected-leading-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-pressed-leading-icon-color: var(--md-filter-chip-selected-pressed-leading-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_focus-leading-icon-color: var(--md-filter-chip-focus-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_hover-leading-icon-color: var(--md-filter-chip-hover-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_leading-icon-color: var(--md-filter-chip-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_pressed-leading-icon-color: var(--md-filter-chip-pressed-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_disabled-trailing-icon-color: var(--md-filter-chip-disabled-trailing-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-trailing-icon-opacity: var(--md-filter-chip-disabled-trailing-icon-opacity, 0.38);--_selected-focus-trailing-icon-color: var(--md-filter-chip-selected-focus-trailing-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-hover-trailing-icon-color: var(--md-filter-chip-selected-hover-trailing-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-pressed-trailing-icon-color: var(--md-filter-chip-selected-pressed-trailing-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-trailing-icon-color: var(--md-filter-chip-selected-trailing-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_focus-trailing-icon-color: var(--md-filter-chip-focus-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-trailing-icon-color: var(--md-filter-chip-hover-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_pressed-trailing-icon-color: var(--md-filter-chip-pressed-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_trailing-icon-color: var(--md-filter-chip-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_container-shape-start-start: var( --md-filter-chip-container-shape-start-start, var(--_container-shape) );--_container-shape-start-end: var( --md-filter-chip-container-shape-start-end, var(--_container-shape) );--_container-shape-end-end: var( --md-filter-chip-container-shape-end-end, var(--_container-shape) );--_container-shape-end-start: var( --md-filter-chip-container-shape-end-start, var(--_container-shape) )}.selected{--md-ripple-focus-color:var(--_selected-focus-state-layer-color);--md-ripple-focus-opacity:var(--_selected-focus-state-layer-opacity);--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)}.selected .icon{width:var(--_icon-size)}.checkmark{inset:0;opacity:0;position:absolute}.selected .checkmark{opacity:1}.selected::before{background:var(--_selected-container-color)}.selected .outline{border-width:var(--_selected-outline-width)}.selected.elevated::before{background:var(--_elevated-selected-container-color)}.selected.disabled::before{background:var(--_disabled-selected-container-color);opacity:var(--_disabled-selected-container-opacity)}.selected .label{color:var(--_selected-label-text-color)}.selected:hover .label{color:var(--_selected-hover-label-text-color)}.selected:focus .label{color:var(--_selected-focus-label-text-color)}.selected:active .label{color:var(--_selected-pressed-label-text-color)}.selected .icon{color:var(--_selected-leading-icon-color)}.selected:hover .icon{color:var(--_selected-hover-leading-icon-color)}.selected:focus .icon{color:var(--_selected-focus-leading-icon-color)}.selected:active .icon{color:var(--_selected-pressed-leading-icon-color)}.icon.trailing{color:var(--_trailing-icon-color)}:hover .icon.trailing{color:var(--_hover-trailing-icon-color)}:focus .icon.trailing{color:var(--_focus-trailing-icon-color)}:active .icon.trailing{color:var(--_pressed-trailing-icon-color)}.disabled .icon.trailing{color:var(--_disabled-trailing-icon-color);opacity:var(--_disabled-trailing-icon-opacity)}.selected .icon.trailing{color:var(--_selected-trailing-icon-color)}.selected:hover .icon.trailing{color:var(--_selected-hover-trailing-icon-color)}.selected:focus .icon.trailing{color:var(--_selected-focus-trailing-icon-color)}.selected:active .icon.trailing{color:var(--_selected-pressed-trailing-icon-color)}/*# sourceMappingURL=filter-styles.css.map */\n`;\n "]}

package/chips/lib/filter-styles.scss

@@ -0,0 +1,10 @@
+//
+// Copyright 2023 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+
+// go/keep-sorted start
+@use './filter-chip';
+// go/keep-sorted end
+
+@include filter-chip.styles;

package/chips/lib/shared-styles.css.js

@@ -4,6 +4,6 @@
   * SPDX-License-Identifier: Apache-2.0
   */
 import { css } from 'lit';
-export const styles = css `:host{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);display:inline-flex;height:var(--_container-height);--md-ripple-focus-color:var(--_focus-state-layer-color);--md-ripple-focus-opacity:var(--_focus-state-layer-opacity);--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)}.container{align-items:baseline;appearance:none;background:none;border:none;border-radius:inherit;box-sizing:border-box;display:flex;gap:8px;height:100%;outline:none;padding:0 8px;position:relative;text-decoration:none;width:100%}.container::before{border-radius:inherit;content:"";inset:0;pointer-events:none;position:absolute}.container:not(.disabled){cursor:pointer}.container.disabled{pointer-events:none}.flat::before{border:var(--_flat-outline-width) solid var(--_flat-outline-color)}.flat:focus::before{border-color:var(--_flat-focus-outline-color)}.flat.disabled::before{border-color:var(--_flat-disabled-outline-color);opacity:var(--_flat-disabled-outline-opacity)}.elevated{--md-elevation-level:var(--_elevated-container-elevation);--md-elevation-shadow-color:var(--_elevated-container-shadow-color)}.elevated::before{background:var(--_elevated-container-color)}.elevated:hover{--md-elevation-level:var(--_elevated-hover-container-elevation)}.elevated:focus-within{--md-elevation-level:var(--_elevated-focus-container-elevation)}.elevated:active{--md-elevation-level:var(--_elevated-pressed-container-elevation)}.elevated.disabled{--md-elevation-level:var(--_elevated-disabled-container-elevation)}.elevated.disabled::before{background:var(--_elevated-disabled-container-color);opacity:var(--_elevated-disabled-container-opacity)}md-focus-ring{--md-focus-ring-shape-start-start:var(--md-focus-ring-shape, var(--_container-shape-start-start));--md-focus-ring-shape-start-end:var(--md-focus-ring-shape, var(--_container-shape-start-end));--md-focus-ring-shape-end-end:var(--md-focus-ring-shape, var(--_container-shape-end-end));--md-focus-ring-shape-end-start:var(--md-focus-ring-shape, var(--_container-shape-end-start))}md-ripple{border-radius:inherit}.label,.icon{z-index:1}.label{align-items:center;color:var(--_label-text-color);display:flex;font:var(--_label-text-type);height:100%;text-overflow:ellipsis;user-select:none;white-space:nowrap}:hover .label{color:var(--_hover-label-text-color)}:focus .label{color:var(--_focus-label-text-color)}:active .label{color:var(--_pressed-label-text-color)}.disabled .label{color:var(--_disabled-label-text-color);opacity:var(--_disabled-label-text-opacity)}.icon{align-self:center;font-size:var(--_icon-size);max-height:var(--_icon-size);max-width:var(--_icon-size)}.icon ::slotted(*){font-size:inherit;height:100%;width:100%}.icon.leading{color:var(--_leading-icon-color)}:hover .icon.leading{color:var(--_hover-leading-icon-color)}:focus .icon.leading{color:var(--_focus-leading-icon-color)}:active .icon.leading{color:var(--_pressed-leading-icon-color)}.disabled .icon.leading{color:var(--_disabled-leading-icon-color);opacity:var(--_disabled-leading-icon-opacity)}/*# sourceMappingURL=shared-styles.css.map */
+export const styles = css `:host{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);display:inline-flex;height:var(--_container-height);--md-ripple-focus-color:var(--_focus-state-layer-color);--md-ripple-focus-opacity:var(--_focus-state-layer-opacity);--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);--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)}.container{border-radius:inherit;box-sizing:border-box;display:flex;height:100%;position:relative;width:100%}.container::before{border-radius:inherit;content:"";inset:0;pointer-events:none;position:absolute}.container:not(.disabled){cursor:pointer}.container.disabled{pointer-events:none}.action{align-items:baseline;appearance:none;background:none;border:none;border-radius:inherit;display:flex;outline:none;padding:0;text-decoration:none}.action:first-of-type{padding-inline-start:8px}.action:last-of-type{padding-inline-end:8px}.outline{border:var(--_outline-width) solid var(--_outline-color);border-radius:inherit;inset:0;pointer-events:none;position:absolute}:focus .outline{border-color:var(--_focus-outline-color)}.disabled .outline{border-color:var(--_disabled-outline-color);opacity:var(--_disabled-outline-opacity)}md-ripple{border-radius:inherit}.label,.icon{z-index:1}.label{align-items:center;color:var(--_label-text-color);display:flex;font:var(--_label-text-type);height:100%;padding:0 8px;text-overflow:ellipsis;user-select:none;white-space:nowrap}:hover .label{color:var(--_hover-label-text-color)}:focus .label{color:var(--_focus-label-text-color)}:active .label{color:var(--_pressed-label-text-color)}.disabled .label{color:var(--_disabled-label-text-color);opacity:var(--_disabled-label-text-opacity)}.icon{align-self:center;color:var(--_leading-icon-color);height:var(--_icon-size);position:relative}.icon ::slotted(*){font-size:var(--_icon-size);height:var(--_icon-size);width:var(--_icon-size)}:hover .icon{color:var(--_hover-leading-icon-color)}:focus .icon{color:var(--_focus-leading-icon-color)}:active .icon{color:var(--_pressed-leading-icon-color)}.disabled .icon{color:var(--_disabled-leading-icon-color);opacity:var(--_disabled-leading-icon-opacity)}/*# sourceMappingURL=shared-styles.css.map */
 `;
 //# sourceMappingURL=shared-styles.css.js.map

package/chips/lib/shared-styles.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"shared-styles.css.js","sourceRoot":"","sources":["shared-styles.css.ts"],"names":[],"mappings":"AAAA;;;;IAII;AACH,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;CACzB,CAAC","sourcesContent":["/**\n  * @license\n  * Copyright 2022 Google LLC\n  * SPDX-License-Identifier: Apache-2.0\n  */\n import {css} from 'lit';\n export const styles = css`:host{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);display:inline-flex;height:var(--_container-height);--md-ripple-focus-color:var(--_focus-state-layer-color);--md-ripple-focus-opacity:var(--_focus-state-layer-opacity);--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)}.container{align-items:baseline;appearance:none;background:none;border:none;border-radius:inherit;box-sizing:border-box;display:flex;gap:8px;height:100%;outline:none;padding:0 8px;position:relative;text-decoration:none;width:100%}.container::before{border-radius:inherit;content:\"\";inset:0;pointer-events:none;position:absolute}.container:not(.disabled){cursor:pointer}.container.disabled{pointer-events:none}.flat::before{border:var(--_flat-outline-width) solid var(--_flat-outline-color)}.flat:focus::before{border-color:var(--_flat-focus-outline-color)}.flat.disabled::before{border-color:var(--_flat-disabled-outline-color);opacity:var(--_flat-disabled-outline-opacity)}.elevated{--md-elevation-level:var(--_elevated-container-elevation);--md-elevation-shadow-color:var(--_elevated-container-shadow-color)}.elevated::before{background:var(--_elevated-container-color)}.elevated:hover{--md-elevation-level:var(--_elevated-hover-container-elevation)}.elevated:focus-within{--md-elevation-level:var(--_elevated-focus-container-elevation)}.elevated:active{--md-elevation-level:var(--_elevated-pressed-container-elevation)}.elevated.disabled{--md-elevation-level:var(--_elevated-disabled-container-elevation)}.elevated.disabled::before{background:var(--_elevated-disabled-container-color);opacity:var(--_elevated-disabled-container-opacity)}md-focus-ring{--md-focus-ring-shape-start-start:var(--md-focus-ring-shape, var(--_container-shape-start-start));--md-focus-ring-shape-start-end:var(--md-focus-ring-shape, var(--_container-shape-start-end));--md-focus-ring-shape-end-end:var(--md-focus-ring-shape, var(--_container-shape-end-end));--md-focus-ring-shape-end-start:var(--md-focus-ring-shape, var(--_container-shape-end-start))}md-ripple{border-radius:inherit}.label,.icon{z-index:1}.label{align-items:center;color:var(--_label-text-color);display:flex;font:var(--_label-text-type);height:100%;text-overflow:ellipsis;user-select:none;white-space:nowrap}:hover .label{color:var(--_hover-label-text-color)}:focus .label{color:var(--_focus-label-text-color)}:active .label{color:var(--_pressed-label-text-color)}.disabled .label{color:var(--_disabled-label-text-color);opacity:var(--_disabled-label-text-opacity)}.icon{align-self:center;font-size:var(--_icon-size);max-height:var(--_icon-size);max-width:var(--_icon-size)}.icon ::slotted(*){font-size:inherit;height:100%;width:100%}.icon.leading{color:var(--_leading-icon-color)}:hover .icon.leading{color:var(--_hover-leading-icon-color)}:focus .icon.leading{color:var(--_focus-leading-icon-color)}:active .icon.leading{color:var(--_pressed-leading-icon-color)}.disabled .icon.leading{color:var(--_disabled-leading-icon-color);opacity:var(--_disabled-leading-icon-opacity)}/*# sourceMappingURL=shared-styles.css.map */\n`;\n "]}
+{"version":3,"file":"shared-styles.css.js","sourceRoot":"","sources":["shared-styles.css.ts"],"names":[],"mappings":"AAAA;;;;IAII;AACH,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;CACzB,CAAC","sourcesContent":["/**\n  * @license\n  * Copyright 2022 Google LLC\n  * SPDX-License-Identifier: Apache-2.0\n  */\n import {css} from 'lit';\n export const styles = css`:host{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);display:inline-flex;height:var(--_container-height);--md-ripple-focus-color:var(--_focus-state-layer-color);--md-ripple-focus-opacity:var(--_focus-state-layer-opacity);--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);--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)}.container{border-radius:inherit;box-sizing:border-box;display:flex;height:100%;position:relative;width:100%}.container::before{border-radius:inherit;content:\"\";inset:0;pointer-events:none;position:absolute}.container:not(.disabled){cursor:pointer}.container.disabled{pointer-events:none}.action{align-items:baseline;appearance:none;background:none;border:none;border-radius:inherit;display:flex;outline:none;padding:0;text-decoration:none}.action:first-of-type{padding-inline-start:8px}.action:last-of-type{padding-inline-end:8px}.outline{border:var(--_outline-width) solid var(--_outline-color);border-radius:inherit;inset:0;pointer-events:none;position:absolute}:focus .outline{border-color:var(--_focus-outline-color)}.disabled .outline{border-color:var(--_disabled-outline-color);opacity:var(--_disabled-outline-opacity)}md-ripple{border-radius:inherit}.label,.icon{z-index:1}.label{align-items:center;color:var(--_label-text-color);display:flex;font:var(--_label-text-type);height:100%;padding:0 8px;text-overflow:ellipsis;user-select:none;white-space:nowrap}:hover .label{color:var(--_hover-label-text-color)}:focus .label{color:var(--_focus-label-text-color)}:active .label{color:var(--_pressed-label-text-color)}.disabled .label{color:var(--_disabled-label-text-color);opacity:var(--_disabled-label-text-opacity)}.icon{align-self:center;color:var(--_leading-icon-color);height:var(--_icon-size);position:relative}.icon ::slotted(*){font-size:var(--_icon-size);height:var(--_icon-size);width:var(--_icon-size)}:hover .icon{color:var(--_hover-leading-icon-color)}:focus .icon{color:var(--_focus-leading-icon-color)}:active .icon{color:var(--_pressed-leading-icon-color)}.disabled .icon{color:var(--_disabled-leading-icon-color);opacity:var(--_disabled-leading-icon-opacity)}/*# sourceMappingURL=shared-styles.css.map */\n`;\n "]}

package/chips/lib/suggestion-chip.d.ts

@@ -3,9 +3,9 @@
  * Copyright 2023 Google LLC
  * SPDX-License-Identifier: Apache-2.0
  */
-import { Chip } from './chip.js';
+import { AssistChip } from './assist-chip.js';
 /**
  * A suggestion chip component.
  */
-export declare class SuggestionChip extends Chip {
+export declare class SuggestionChip extends AssistChip {
 }

package/chips/lib/suggestion-chip.js

@@ -3,10 +3,12 @@
  * Copyright 2023 Google LLC
  * SPDX-License-Identifier: Apache-2.0
  */
-import { Chip } from './chip.js';
+import { AssistChip } from './assist-chip.js';
 /**
  * A suggestion chip component.
  */
-export class SuggestionChip extends Chip {
+export class SuggestionChip extends AssistChip {
 }
+// Note: assist and suggestion chips are functionally identical with different
+// tokens.
 //# sourceMappingURL=suggestion-chip.js.map

package/chips/lib/suggestion-chip.js.map

@@ -1 +1 @@
-{"version":3,"file":"suggestion-chip.js","sourceRoot":"","sources":["suggestion-chip.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAC,IAAI,EAAC,MAAM,WAAW,CAAC;AAE/B;;GAEG;AACH,MAAM,OAAO,cAAe,SAAQ,IAAI;CAAG","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {Chip} from './chip.js';\n\n/**\n * A suggestion chip component.\n */\nexport class SuggestionChip extends Chip {}\n"]}
+{"version":3,"file":"suggestion-chip.js","sourceRoot":"","sources":["suggestion-chip.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAC,UAAU,EAAC,MAAM,kBAAkB,CAAC;AAE5C;;GAEG;AACH,MAAM,OAAO,cAAe,SAAQ,UAAU;CAAG;AAEjD,8EAA8E;AAC9E,UAAU","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {AssistChip} from './assist-chip.js';\n\n/**\n * A suggestion chip component.\n */\nexport class SuggestionChip extends AssistChip {}\n\n// Note: assist and suggestion chips are functionally identical with different\n// tokens.\n"]}

package/chips/lib/suggestion-styles.css.js

@@ -4,6 +4,6 @@
   * SPDX-License-Identifier: Apache-2.0
   */
 import { css } from 'lit';
-export const styles = css `:host{--_container-shape-start-start: var(--md-suggestion-chip-container-shape-start-start, var(--md-suggestion-chip-container-shape, 8px));--_container-shape-start-end: var(--md-suggestion-chip-container-shape-start-end, var(--md-suggestion-chip-container-shape, 8px));--_container-shape-end-end: var(--md-suggestion-chip-container-shape-end-end, var(--md-suggestion-chip-container-shape, 8px));--_container-shape-end-start: var(--md-suggestion-chip-container-shape-end-start, var(--md-suggestion-chip-container-shape, 8px));--_container-height: var(--md-suggestion-chip-container-height, 32px);--_disabled-label-text-color: var(--md-suggestion-chip-disabled-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-label-text-opacity: var(--md-suggestion-chip-disabled-label-text-opacity, 0.38);--_elevated-container-color: var(--md-suggestion-chip-elevated-container-color, var(--md-sys-color-surface-container-low, #f7f2fa));--_elevated-container-elevation: var(--md-suggestion-chip-elevated-container-elevation, 1);--_elevated-container-shadow-color: var(--md-suggestion-chip-elevated-container-shadow-color, var(--md-sys-color-shadow, #000));--_elevated-disabled-container-color: var(--md-suggestion-chip-elevated-disabled-container-color, var(--md-sys-color-on-surface, #1d1b20));--_elevated-disabled-container-elevation: var(--md-suggestion-chip-elevated-disabled-container-elevation, 0);--_elevated-disabled-container-opacity: var(--md-suggestion-chip-elevated-disabled-container-opacity, 0.12);--_elevated-focus-container-elevation: var(--md-suggestion-chip-elevated-focus-container-elevation, 1);--_elevated-hover-container-elevation: var(--md-suggestion-chip-elevated-hover-container-elevation, 2);--_elevated-pressed-container-elevation: var(--md-suggestion-chip-elevated-pressed-container-elevation, 1);--_flat-disabled-outline-color: var(--md-suggestion-chip-flat-disabled-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_flat-disabled-outline-opacity: var(--md-suggestion-chip-flat-disabled-outline-opacity, 0.12);--_flat-focus-outline-color: var(--md-suggestion-chip-flat-focus-outline-color, var(--md-sys-color-on-surface-variant, #49454f));--_flat-outline-color: var(--md-suggestion-chip-flat-outline-color, var(--md-sys-color-outline, #79747e));--_flat-outline-width: var(--md-suggestion-chip-flat-outline-width, 1px);--_focus-label-text-color: var(--md-suggestion-chip-focus-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_focus-state-layer-color: var(--md-suggestion-chip-focus-state-layer-color, var(--md-sys-color-on-surface-variant, #49454f));--_focus-state-layer-opacity: var(--md-suggestion-chip-focus-state-layer-opacity, 0.12);--_hover-label-text-color: var(--md-suggestion-chip-hover-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-state-layer-color: var(--md-suggestion-chip-hover-state-layer-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-state-layer-opacity: var(--md-suggestion-chip-hover-state-layer-opacity, 0.08);--_label-text-color: var(--md-suggestion-chip-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_label-text-type: var(--md-suggestion-chip-label-text-type, var(--md-sys-typescale-label-large, 500 0.875rem / 1.25rem var(--md-ref-typeface-plain, Roboto)));--_pressed-label-text-color: var(--md-suggestion-chip-pressed-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_pressed-state-layer-color: var(--md-suggestion-chip-pressed-state-layer-color, var(--md-sys-color-on-surface-variant, #49454f));--_pressed-state-layer-opacity: var(--md-suggestion-chip-pressed-state-layer-opacity, 0.12);--_disabled-leading-icon-color: var(--md-suggestion-chip-disabled-leading-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-leading-icon-opacity: var(--md-suggestion-chip-disabled-leading-icon-opacity, 0.38);--_focus-leading-icon-color: var(--md-suggestion-chip-focus-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_hover-leading-icon-color: var(--md-suggestion-chip-hover-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_leading-icon-color: var(--md-suggestion-chip-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_pressed-leading-icon-color: var(--md-suggestion-chip-pressed-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_icon-size: var(--md-suggestion-chip-icon-size, 18px)}/*# sourceMappingURL=suggestion-styles.css.map */
+export const styles = css `:host{--_container-height: 32px;--_container-shape: 8px;--_disabled-label-text-color: var(--md-sys-color-on-surface, #1d1b20);--_disabled-label-text-opacity: 0.38;--_elevated-container-color: var(--md-sys-color-surface-container-low, #f7f2fa);--_elevated-container-elevation: 1;--_elevated-container-shadow-color: var(--md-sys-color-shadow, #000);--_elevated-disabled-container-color: var(--md-sys-color-on-surface, #1d1b20);--_elevated-disabled-container-elevation: 0;--_elevated-disabled-container-opacity: 0.12;--_elevated-focus-container-elevation: 1;--_elevated-hover-container-elevation: 2;--_elevated-pressed-container-elevation: 1;--_focus-label-text-color: var(--md-sys-color-on-surface-variant, #49454f);--_focus-state-layer-color: var(--md-sys-color-on-surface-variant, #49454f);--_focus-state-layer-opacity: 0.12;--_hover-label-text-color: var(--md-sys-color-on-surface-variant, #49454f);--_hover-state-layer-color: var(--md-sys-color-on-surface-variant, #49454f);--_hover-state-layer-opacity: 0.08;--_label-text-color: var(--md-sys-color-on-surface-variant, #49454f);--_label-text-type: var(--md-sys-typescale-label-large, 500 0.875rem / 1.25rem var(--md-ref-typeface-plain, Roboto));--_pressed-label-text-color: var(--md-sys-color-on-surface-variant, #49454f);--_pressed-state-layer-color: var(--md-sys-color-on-surface-variant, #49454f);--_pressed-state-layer-opacity: 0.12;--_disabled-outline-color: var(--md-sys-color-on-surface, #1d1b20);--_disabled-outline-opacity: 0.12;--_focus-outline-color: var(--md-sys-color-on-surface-variant, #49454f);--_outline-color: var(--md-sys-color-outline, #79747e);--_outline-width: 1px;--_disabled-leading-icon-color: var(--md-sys-color-on-surface, #1d1b20);--_disabled-leading-icon-opacity: 0.38;--_focus-leading-icon-color: var(--md-sys-color-primary, #6750a4);--_hover-leading-icon-color: var(--md-sys-color-primary, #6750a4);--_leading-icon-color: var(--md-sys-color-primary, #6750a4);--_pressed-leading-icon-color: var(--md-sys-color-primary, #6750a4);--_icon-size: 18px;--_container-shape-start-start: var( --md-suggestion-chip-container-shape-start-start, var(--_container-shape) );--_container-shape-start-end: var( --md-suggestion-chip-container-shape-start-end, var(--_container-shape) );--_container-shape-end-end: var( --md-suggestion-chip-container-shape-end-end, var(--_container-shape) );--_container-shape-end-start: var( --md-suggestion-chip-container-shape-end-start, var(--_container-shape) )}/*# sourceMappingURL=suggestion-styles.css.map */
 `;
 //# sourceMappingURL=suggestion-styles.css.js.map

package/chips/lib/suggestion-styles.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"suggestion-styles.css.js","sourceRoot":"","sources":["suggestion-styles.css.ts"],"names":[],"mappings":"AAAA;;;;IAII;AACH,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;CACzB,CAAC","sourcesContent":["/**\n  * @license\n  * Copyright 2022 Google LLC\n  * SPDX-License-Identifier: Apache-2.0\n  */\n import {css} from 'lit';\n export const styles = css`:host{--_container-shape-start-start: var(--md-suggestion-chip-container-shape-start-start, var(--md-suggestion-chip-container-shape, 8px));--_container-shape-start-end: var(--md-suggestion-chip-container-shape-start-end, var(--md-suggestion-chip-container-shape, 8px));--_container-shape-end-end: var(--md-suggestion-chip-container-shape-end-end, var(--md-suggestion-chip-container-shape, 8px));--_container-shape-end-start: var(--md-suggestion-chip-container-shape-end-start, var(--md-suggestion-chip-container-shape, 8px));--_container-height: var(--md-suggestion-chip-container-height, 32px);--_disabled-label-text-color: var(--md-suggestion-chip-disabled-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-label-text-opacity: var(--md-suggestion-chip-disabled-label-text-opacity, 0.38);--_elevated-container-color: var(--md-suggestion-chip-elevated-container-color, var(--md-sys-color-surface-container-low, #f7f2fa));--_elevated-container-elevation: var(--md-suggestion-chip-elevated-container-elevation, 1);--_elevated-container-shadow-color: var(--md-suggestion-chip-elevated-container-shadow-color, var(--md-sys-color-shadow, #000));--_elevated-disabled-container-color: var(--md-suggestion-chip-elevated-disabled-container-color, var(--md-sys-color-on-surface, #1d1b20));--_elevated-disabled-container-elevation: var(--md-suggestion-chip-elevated-disabled-container-elevation, 0);--_elevated-disabled-container-opacity: var(--md-suggestion-chip-elevated-disabled-container-opacity, 0.12);--_elevated-focus-container-elevation: var(--md-suggestion-chip-elevated-focus-container-elevation, 1);--_elevated-hover-container-elevation: var(--md-suggestion-chip-elevated-hover-container-elevation, 2);--_elevated-pressed-container-elevation: var(--md-suggestion-chip-elevated-pressed-container-elevation, 1);--_flat-disabled-outline-color: var(--md-suggestion-chip-flat-disabled-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_flat-disabled-outline-opacity: var(--md-suggestion-chip-flat-disabled-outline-opacity, 0.12);--_flat-focus-outline-color: var(--md-suggestion-chip-flat-focus-outline-color, var(--md-sys-color-on-surface-variant, #49454f));--_flat-outline-color: var(--md-suggestion-chip-flat-outline-color, var(--md-sys-color-outline, #79747e));--_flat-outline-width: var(--md-suggestion-chip-flat-outline-width, 1px);--_focus-label-text-color: var(--md-suggestion-chip-focus-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_focus-state-layer-color: var(--md-suggestion-chip-focus-state-layer-color, var(--md-sys-color-on-surface-variant, #49454f));--_focus-state-layer-opacity: var(--md-suggestion-chip-focus-state-layer-opacity, 0.12);--_hover-label-text-color: var(--md-suggestion-chip-hover-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-state-layer-color: var(--md-suggestion-chip-hover-state-layer-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-state-layer-opacity: var(--md-suggestion-chip-hover-state-layer-opacity, 0.08);--_label-text-color: var(--md-suggestion-chip-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_label-text-type: var(--md-suggestion-chip-label-text-type, var(--md-sys-typescale-label-large, 500 0.875rem / 1.25rem var(--md-ref-typeface-plain, Roboto)));--_pressed-label-text-color: var(--md-suggestion-chip-pressed-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_pressed-state-layer-color: var(--md-suggestion-chip-pressed-state-layer-color, var(--md-sys-color-on-surface-variant, #49454f));--_pressed-state-layer-opacity: var(--md-suggestion-chip-pressed-state-layer-opacity, 0.12);--_disabled-leading-icon-color: var(--md-suggestion-chip-disabled-leading-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-leading-icon-opacity: var(--md-suggestion-chip-disabled-leading-icon-opacity, 0.38);--_focus-leading-icon-color: var(--md-suggestion-chip-focus-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_hover-leading-icon-color: var(--md-suggestion-chip-hover-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_leading-icon-color: var(--md-suggestion-chip-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_pressed-leading-icon-color: var(--md-suggestion-chip-pressed-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_icon-size: var(--md-suggestion-chip-icon-size, 18px)}/*# sourceMappingURL=suggestion-styles.css.map */\n`;\n "]}
+{"version":3,"file":"suggestion-styles.css.js","sourceRoot":"","sources":["suggestion-styles.css.ts"],"names":[],"mappings":"AAAA;;;;IAII;AACH,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;CACzB,CAAC","sourcesContent":["/**\n  * @license\n  * Copyright 2022 Google LLC\n  * SPDX-License-Identifier: Apache-2.0\n  */\n import {css} from 'lit';\n export const styles = css`:host{--_container-height: 32px;--_container-shape: 8px;--_disabled-label-text-color: var(--md-sys-color-on-surface, #1d1b20);--_disabled-label-text-opacity: 0.38;--_elevated-container-color: var(--md-sys-color-surface-container-low, #f7f2fa);--_elevated-container-elevation: 1;--_elevated-container-shadow-color: var(--md-sys-color-shadow, #000);--_elevated-disabled-container-color: var(--md-sys-color-on-surface, #1d1b20);--_elevated-disabled-container-elevation: 0;--_elevated-disabled-container-opacity: 0.12;--_elevated-focus-container-elevation: 1;--_elevated-hover-container-elevation: 2;--_elevated-pressed-container-elevation: 1;--_focus-label-text-color: var(--md-sys-color-on-surface-variant, #49454f);--_focus-state-layer-color: var(--md-sys-color-on-surface-variant, #49454f);--_focus-state-layer-opacity: 0.12;--_hover-label-text-color: var(--md-sys-color-on-surface-variant, #49454f);--_hover-state-layer-color: var(--md-sys-color-on-surface-variant, #49454f);--_hover-state-layer-opacity: 0.08;--_label-text-color: var(--md-sys-color-on-surface-variant, #49454f);--_label-text-type: var(--md-sys-typescale-label-large, 500 0.875rem / 1.25rem var(--md-ref-typeface-plain, Roboto));--_pressed-label-text-color: var(--md-sys-color-on-surface-variant, #49454f);--_pressed-state-layer-color: var(--md-sys-color-on-surface-variant, #49454f);--_pressed-state-layer-opacity: 0.12;--_disabled-outline-color: var(--md-sys-color-on-surface, #1d1b20);--_disabled-outline-opacity: 0.12;--_focus-outline-color: var(--md-sys-color-on-surface-variant, #49454f);--_outline-color: var(--md-sys-color-outline, #79747e);--_outline-width: 1px;--_disabled-leading-icon-color: var(--md-sys-color-on-surface, #1d1b20);--_disabled-leading-icon-opacity: 0.38;--_focus-leading-icon-color: var(--md-sys-color-primary, #6750a4);--_hover-leading-icon-color: var(--md-sys-color-primary, #6750a4);--_leading-icon-color: var(--md-sys-color-primary, #6750a4);--_pressed-leading-icon-color: var(--md-sys-color-primary, #6750a4);--_icon-size: 18px;--_container-shape-start-start: var( --md-suggestion-chip-container-shape-start-start, var(--_container-shape) );--_container-shape-start-end: var( --md-suggestion-chip-container-shape-start-end, var(--_container-shape) );--_container-shape-end-end: var( --md-suggestion-chip-container-shape-end-end, var(--_container-shape) );--_container-shape-end-start: var( --md-suggestion-chip-container-shape-end-start, var(--_container-shape) )}/*# sourceMappingURL=suggestion-styles.css.map */\n`;\n "]}

package/chips/suggestion-chip.js

@@ -5,6 +5,7 @@
  */
 import { __decorate } from "tslib";
 import { customElement } from 'lit/decorators.js';
+import { styles as elevatedStyles } from './lib/elevated-styles.css.js';
 import { styles as sharedStyles } from './lib/shared-styles.css.js';
 import { SuggestionChip } from './lib/suggestion-chip.js';
 import { styles } from './lib/suggestion-styles.css.js';
@@ -16,7 +17,7 @@ import { styles } from './lib/suggestion-styles.css.js';
  */
 let MdSuggestionChip = class MdSuggestionChip extends SuggestionChip {
 };
-MdSuggestionChip.styles = [sharedStyles, styles];
+MdSuggestionChip.styles = [sharedStyles, elevatedStyles, styles];
 MdSuggestionChip = __decorate([
     customElement('md-suggestion-chip')
 ], MdSuggestionChip);

package/chips/suggestion-chip.js.map

@@ -1 +1 @@
-{"version":3,"file":"suggestion-chip.js","sourceRoot":"","sources":["suggestion-chip.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,EAAC,aAAa,EAAC,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAC,MAAM,IAAI,YAAY,EAAC,MAAM,4BAA4B,CAAC;AAClE,OAAO,EAAC,cAAc,EAAC,MAAM,0BAA0B,CAAC;AACxD,OAAO,EAAC,MAAM,EAAC,MAAM,gCAAgC,CAAC;AAQtD;;;;;GAKG;AAEI,IAAM,gBAAgB,GAAtB,MAAM,gBAAiB,SAAQ,cAAc;;AAClC,uBAAM,GAAG,CAAC,YAAY,EAAE,MAAM,CAAC,CAAC;AADrC,gBAAgB;IAD5B,aAAa,CAAC,oBAAoB,CAAC;GACvB,gBAAgB,CAE5B;SAFY,gBAAgB","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {customElement} from 'lit/decorators.js';\n\nimport {styles as sharedStyles} from './lib/shared-styles.css.js';\nimport {SuggestionChip} from './lib/suggestion-chip.js';\nimport {styles} from './lib/suggestion-styles.css.js';\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'md-suggestion-chip': MdSuggestionChip;\n  }\n}\n\n/**\n * TODO(b/243982145): add docs\n *\n * @final\n * @suppress {visibility}\n */\n@customElement('md-suggestion-chip')\nexport class MdSuggestionChip extends SuggestionChip {\n  static override styles = [sharedStyles, styles];\n}\n"]}
+{"version":3,"file":"suggestion-chip.js","sourceRoot":"","sources":["suggestion-chip.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,EAAC,aAAa,EAAC,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAC,MAAM,IAAI,cAAc,EAAC,MAAM,8BAA8B,CAAC;AACtE,OAAO,EAAC,MAAM,IAAI,YAAY,EAAC,MAAM,4BAA4B,CAAC;AAClE,OAAO,EAAC,cAAc,EAAC,MAAM,0BAA0B,CAAC;AACxD,OAAO,EAAC,MAAM,EAAC,MAAM,gCAAgC,CAAC;AAQtD;;;;;GAKG;AAEI,IAAM,gBAAgB,GAAtB,MAAM,gBAAiB,SAAQ,cAAc;;AAClC,uBAAM,GAAG,CAAC,YAAY,EAAE,cAAc,EAAE,MAAM,CAAC,CAAC;AADrD,gBAAgB;IAD5B,aAAa,CAAC,oBAAoB,CAAC;GACvB,gBAAgB,CAE5B;SAFY,gBAAgB","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {customElement} from 'lit/decorators.js';\n\nimport {styles as elevatedStyles} from './lib/elevated-styles.css.js';\nimport {styles as sharedStyles} from './lib/shared-styles.css.js';\nimport {SuggestionChip} from './lib/suggestion-chip.js';\nimport {styles} from './lib/suggestion-styles.css.js';\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'md-suggestion-chip': MdSuggestionChip;\n  }\n}\n\n/**\n * TODO(b/243982145): add docs\n *\n * @final\n * @suppress {visibility}\n */\n@customElement('md-suggestion-chip')\nexport class MdSuggestionChip extends SuggestionChip {\n  static override styles = [sharedStyles, elevatedStyles, styles];\n}\n"]}

package/circularprogress/harness.d.ts

@@ -9,4 +9,5 @@ import { CircularProgress } from './lib/circular-progress.js';
  * Test harness for circular-progress.
  */
 export declare class CircularProgressHarness extends Harness<CircularProgress> {
+    getInteractiveElement(): Promise<HTMLElement>;
 }

package/circularprogress/harness.js

@@ -8,5 +8,9 @@ import { Harness } from '../testing/harness.js';
  * Test harness for circular-progress.
  */
 export class CircularProgressHarness extends Harness {
+    async getInteractiveElement() {
+        await this.element.updateComplete;
+        return this.element.querySelector('.circularProgresss');
+    }
 }
 //# sourceMappingURL=harness.js.map

package/circularprogress/harness.js.map

@@ -1 +1 @@
-{"version":3,"file":"harness.js","sourceRoot":"","sources":["harness.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAC,OAAO,EAAC,MAAM,uBAAuB,CAAC;AAI9C;;GAEG;AACH,MAAM,OAAO,uBAAwB,SAAQ,OAAyB;CAAG","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {Harness} from '../testing/harness.js';\n\nimport {CircularProgress} from './lib/circular-progress.js';\n\n/**\n * Test harness for circular-progress.\n */\nexport class CircularProgressHarness extends Harness<CircularProgress> {}\n"]}
+{"version":3,"file":"harness.js","sourceRoot":"","sources":["harness.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAC,OAAO,EAAC,MAAM,uBAAuB,CAAC;AAI9C;;GAEG;AACH,MAAM,OAAO,uBAAwB,SAAQ,OAAyB;IAC3D,KAAK,CAAC,qBAAqB;QAClC,MAAM,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC;QAClC,OAAO,IAAI,CAAC,OAAO,CAAC,aAAa,CAAc,oBAAoB,CAAE,CAAC;IACxE,CAAC;CACF","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {Harness} from '../testing/harness.js';\n\nimport {CircularProgress} from './lib/circular-progress.js';\n\n/**\n * Test harness for circular-progress.\n */\nexport class CircularProgressHarness extends Harness<CircularProgress> {\n  override async getInteractiveElement() {\n    await this.element.updateComplete;\n    return this.element.querySelector<HTMLElement>('.circularProgresss')!;\n  }\n}\n"]}

package/circularprogress/lib/_circular-progress.scss

@@ -4,21 +4,27 @@
 //
 
 // go/keep-sorted start
-@use '../../sass/theme';
+@use 'sass:list';
+// go/keep-sorted end
+// go/keep-sorted start
 @use '../../tokens';
 // go/keep-sorted end
 
 @mixin theme($tokens) {
-  $reference: tokens.md-comp-circular-progress-indicator-values();
-  $tokens: theme.validate-theme($reference, $tokens);
-  $tokens: theme.create-theme-vars($tokens, 'circular-progress');
+  $supported-tokens: tokens.$md-comp-circular-progress-indicator-supported-tokens;
+  @each $token, $value in $tokens {
+    @if list.index($supported-tokens, $token) == null {
+      @error 'Token `#{$token}` is not a supported token.';
+    }
 
-  @include theme.emit-theme-vars($tokens);
+    @if $value {
+      --md-circular-progress-#{$token}: #{$value};
+    }
+  }
 }
 
 @mixin styles() {
   $tokens: tokens.md-comp-circular-progress-indicator-values();
-  $tokens: theme.create-theme-vars($tokens, 'circular-progress');
 
   $container-padding: 4px;
 
@@ -42,7 +48,7 @@
 
   :host {
     @each $token, $value in $tokens {
-      --_#{$token}: #{$value};
+      --_#{$token}: var(--md-circular-progress-#{$token}, #{$value});
     }
 
     display: inline-flex;

package/circularprogress/lib/circular-progress-styles.css.js

@@ -4,6 +4,6 @@
   * SPDX-License-Identifier: Apache-2.0
   */
 import { css } from 'lit';
-export const styles = css `:host{--_active-indicator-color: var(--md-circular-progress-active-indicator-color, var(--md-sys-color-primary, #6750a4));--_active-indicator-width: var(--md-circular-progress-active-indicator-width, 8.33);--_four-color-active-indicator-four-color: var(--md-circular-progress-four-color-active-indicator-four-color, var(--md-sys-color-tertiary-container, #ffd8e4));--_four-color-active-indicator-one-color: var(--md-circular-progress-four-color-active-indicator-one-color, var(--md-sys-color-primary, #6750a4));--_four-color-active-indicator-three-color: var(--md-circular-progress-four-color-active-indicator-three-color, var(--md-sys-color-tertiary, #7d5260));--_four-color-active-indicator-two-color: var(--md-circular-progress-four-color-active-indicator-two-color, var(--md-sys-color-primary-container, #eaddff));--_size: var(--md-circular-progress-size, 48px);display:inline-flex;vertical-align:middle;min-block-size:var(--_size);min-inline-size:var(--_size);position:relative;align-items:center;justify-content:center;contain:strict;content-visibility:auto}.circular-progress{flex:1;align-self:stretch;margin:4px}.circular-progress,.spinner,.left,.right,.circle,svg,.track,.progress{position:absolute;inset:0}svg{transform:rotate(-90deg)}circle{cx:50%;cy:50%;r:calc(50%*(1 - var(--_active-indicator-width)/100));stroke-width:calc(var(--_active-indicator-width)*1%);stroke-dasharray:100;fill:rgba(0,0,0,0)}.progress{transition:stroke-dashoffset 500ms cubic-bezier(0, 0, 0.2, 1);stroke:var(--_active-indicator-color)}.track{stroke:rgba(0,0,0,0)}.circular-progress.indeterminate{will-change:transform;animation:linear infinite linear-rotate;animation-duration:1568.2352941176ms}.spinner{will-change:transform;animation:infinite both rotate-arc;animation-duration:5332ms;animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1)}.left{overflow:hidden;inset:0 50% 0 0}.right{overflow:hidden;inset:0 0 0 50%}.circle{box-sizing:border-box;border-radius:50%;border:solid calc(var(--_active-indicator-width)/100*(var(--_size) - 8px));border-color:var(--_active-indicator-color) var(--_active-indicator-color) rgba(0,0,0,0) rgba(0,0,0,0);will-change:transform;animation:expand-arc;animation-iteration-count:infinite;animation-fill-mode:both;animation-duration:1333ms,5332ms;animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1)}.four-color .circle{animation-name:expand-arc,four-color}.left .circle{rotate:135deg;inset:0 -100% 0 0}.right .circle{rotate:100deg;inset:0 0 0 -100%;animation-delay:-666.5ms,0ms}@media screen and (forced-colors: active){.progress{stroke:CanvasText}.circle{border-color:CanvasText CanvasText Canvas Canvas}}@keyframes expand-arc{0%{transform:rotate(265deg)}50%{transform:rotate(130deg)}100%{transform:rotate(265deg)}}@keyframes rotate-arc{12.5%{transform:rotate(135deg)}25%{transform:rotate(270deg)}37.5%{transform:rotate(405deg)}50%{transform:rotate(540deg)}62.5%{transform:rotate(675deg)}75%{transform:rotate(810deg)}87.5%{transform:rotate(945deg)}100%{transform:rotate(1080deg)}}@keyframes linear-rotate{to{transform:rotate(360deg)}}@keyframes four-color{0%{border-top-color:var(--_four-color-active-indicator-one-color);border-right-color:var(--_four-color-active-indicator-one-color)}15%{border-top-color:var(--_four-color-active-indicator-one-color);border-right-color:var(--_four-color-active-indicator-one-color)}25%{border-top-color:var(--_four-color-active-indicator-two-color);border-right-color:var(--_four-color-active-indicator-two-color)}40%{border-top-color:var(--_four-color-active-indicator-two-color);border-right-color:var(--_four-color-active-indicator-two-color)}50%{border-top-color:var(--_four-color-active-indicator-three-color);border-right-color:var(--_four-color-active-indicator-three-color)}65%{border-top-color:var(--_four-color-active-indicator-three-color);border-right-color:var(--_four-color-active-indicator-three-color)}75%{border-top-color:var(--_four-color-active-indicator-four-color);border-right-color:var(--_four-color-active-indicator-four-color)}90%{border-top-color:var(--_four-color-active-indicator-four-color);border-right-color:var(--_four-color-active-indicator-four-color)}100%{border-top-color:var(--_four-color-active-indicator-one-color);border-right-color:var(--_four-color-active-indicator-one-color)}}/*# sourceMappingURL=circular-progress-styles.css.map */
+export const styles = css `:host{--_active-indicator-color: var(--md-circular-progress-active-indicator-color, var(--md-sys-color-primary, #6750a4));--_active-indicator-width: var(--md-circular-progress-active-indicator-width, 8.3333333333);--_four-color-active-indicator-four-color: var(--md-circular-progress-four-color-active-indicator-four-color, var(--md-sys-color-tertiary-container, #ffd8e4));--_four-color-active-indicator-one-color: var(--md-circular-progress-four-color-active-indicator-one-color, var(--md-sys-color-primary, #6750a4));--_four-color-active-indicator-three-color: var(--md-circular-progress-four-color-active-indicator-three-color, var(--md-sys-color-tertiary, #7d5260));--_four-color-active-indicator-two-color: var(--md-circular-progress-four-color-active-indicator-two-color, var(--md-sys-color-primary-container, #eaddff));--_size: var(--md-circular-progress-size, 48px);display:inline-flex;vertical-align:middle;min-block-size:var(--_size);min-inline-size:var(--_size);position:relative;align-items:center;justify-content:center;contain:strict;content-visibility:auto}.circular-progress{flex:1;align-self:stretch;margin:4px}.circular-progress,.spinner,.left,.right,.circle,svg,.track,.progress{position:absolute;inset:0}svg{transform:rotate(-90deg)}circle{cx:50%;cy:50%;r:calc(50%*(1 - var(--_active-indicator-width)/100));stroke-width:calc(var(--_active-indicator-width)*1%);stroke-dasharray:100;fill:rgba(0,0,0,0)}.progress{transition:stroke-dashoffset 500ms cubic-bezier(0, 0, 0.2, 1);stroke:var(--_active-indicator-color)}.track{stroke:rgba(0,0,0,0)}.circular-progress.indeterminate{will-change:transform;animation:linear infinite linear-rotate;animation-duration:1568.2352941176ms}.spinner{will-change:transform;animation:infinite both rotate-arc;animation-duration:5332ms;animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1)}.left{overflow:hidden;inset:0 50% 0 0}.right{overflow:hidden;inset:0 0 0 50%}.circle{box-sizing:border-box;border-radius:50%;border:solid calc(var(--_active-indicator-width)/100*(var(--_size) - 8px));border-color:var(--_active-indicator-color) var(--_active-indicator-color) rgba(0,0,0,0) rgba(0,0,0,0);will-change:transform;animation:expand-arc;animation-iteration-count:infinite;animation-fill-mode:both;animation-duration:1333ms,5332ms;animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1)}.four-color .circle{animation-name:expand-arc,four-color}.left .circle{rotate:135deg;inset:0 -100% 0 0}.right .circle{rotate:100deg;inset:0 0 0 -100%;animation-delay:-666.5ms,0ms}@media screen and (forced-colors: active){.progress{stroke:CanvasText}.circle{border-color:CanvasText CanvasText Canvas Canvas}}@keyframes expand-arc{0%{transform:rotate(265deg)}50%{transform:rotate(130deg)}100%{transform:rotate(265deg)}}@keyframes rotate-arc{12.5%{transform:rotate(135deg)}25%{transform:rotate(270deg)}37.5%{transform:rotate(405deg)}50%{transform:rotate(540deg)}62.5%{transform:rotate(675deg)}75%{transform:rotate(810deg)}87.5%{transform:rotate(945deg)}100%{transform:rotate(1080deg)}}@keyframes linear-rotate{to{transform:rotate(360deg)}}@keyframes four-color{0%{border-top-color:var(--_four-color-active-indicator-one-color);border-right-color:var(--_four-color-active-indicator-one-color)}15%{border-top-color:var(--_four-color-active-indicator-one-color);border-right-color:var(--_four-color-active-indicator-one-color)}25%{border-top-color:var(--_four-color-active-indicator-two-color);border-right-color:var(--_four-color-active-indicator-two-color)}40%{border-top-color:var(--_four-color-active-indicator-two-color);border-right-color:var(--_four-color-active-indicator-two-color)}50%{border-top-color:var(--_four-color-active-indicator-three-color);border-right-color:var(--_four-color-active-indicator-three-color)}65%{border-top-color:var(--_four-color-active-indicator-three-color);border-right-color:var(--_four-color-active-indicator-three-color)}75%{border-top-color:var(--_four-color-active-indicator-four-color);border-right-color:var(--_four-color-active-indicator-four-color)}90%{border-top-color:var(--_four-color-active-indicator-four-color);border-right-color:var(--_four-color-active-indicator-four-color)}100%{border-top-color:var(--_four-color-active-indicator-one-color);border-right-color:var(--_four-color-active-indicator-one-color)}}/*# sourceMappingURL=circular-progress-styles.css.map */
 `;
 //# sourceMappingURL=circular-progress-styles.css.js.map

package/circularprogress/lib/circular-progress-styles.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"circular-progress-styles.css.js","sourceRoot":"","sources":["circular-progress-styles.css.ts"],"names":[],"mappings":"AAAA;;;;IAII;AACH,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;CACzB,CAAC","sourcesContent":["/**\n  * @license\n  * Copyright 2022 Google LLC\n  * SPDX-License-Identifier: Apache-2.0\n  */\n import {css} from 'lit';\n export const styles = css`:host{--_active-indicator-color: var(--md-circular-progress-active-indicator-color, var(--md-sys-color-primary, #6750a4));--_active-indicator-width: var(--md-circular-progress-active-indicator-width, 8.33);--_four-color-active-indicator-four-color: var(--md-circular-progress-four-color-active-indicator-four-color, var(--md-sys-color-tertiary-container, #ffd8e4));--_four-color-active-indicator-one-color: var(--md-circular-progress-four-color-active-indicator-one-color, var(--md-sys-color-primary, #6750a4));--_four-color-active-indicator-three-color: var(--md-circular-progress-four-color-active-indicator-three-color, var(--md-sys-color-tertiary, #7d5260));--_four-color-active-indicator-two-color: var(--md-circular-progress-four-color-active-indicator-two-color, var(--md-sys-color-primary-container, #eaddff));--_size: var(--md-circular-progress-size, 48px);display:inline-flex;vertical-align:middle;min-block-size:var(--_size);min-inline-size:var(--_size);position:relative;align-items:center;justify-content:center;contain:strict;content-visibility:auto}.circular-progress{flex:1;align-self:stretch;margin:4px}.circular-progress,.spinner,.left,.right,.circle,svg,.track,.progress{position:absolute;inset:0}svg{transform:rotate(-90deg)}circle{cx:50%;cy:50%;r:calc(50%*(1 - var(--_active-indicator-width)/100));stroke-width:calc(var(--_active-indicator-width)*1%);stroke-dasharray:100;fill:rgba(0,0,0,0)}.progress{transition:stroke-dashoffset 500ms cubic-bezier(0, 0, 0.2, 1);stroke:var(--_active-indicator-color)}.track{stroke:rgba(0,0,0,0)}.circular-progress.indeterminate{will-change:transform;animation:linear infinite linear-rotate;animation-duration:1568.2352941176ms}.spinner{will-change:transform;animation:infinite both rotate-arc;animation-duration:5332ms;animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1)}.left{overflow:hidden;inset:0 50% 0 0}.right{overflow:hidden;inset:0 0 0 50%}.circle{box-sizing:border-box;border-radius:50%;border:solid calc(var(--_active-indicator-width)/100*(var(--_size) - 8px));border-color:var(--_active-indicator-color) var(--_active-indicator-color) rgba(0,0,0,0) rgba(0,0,0,0);will-change:transform;animation:expand-arc;animation-iteration-count:infinite;animation-fill-mode:both;animation-duration:1333ms,5332ms;animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1)}.four-color .circle{animation-name:expand-arc,four-color}.left .circle{rotate:135deg;inset:0 -100% 0 0}.right .circle{rotate:100deg;inset:0 0 0 -100%;animation-delay:-666.5ms,0ms}@media screen and (forced-colors: active){.progress{stroke:CanvasText}.circle{border-color:CanvasText CanvasText Canvas Canvas}}@keyframes expand-arc{0%{transform:rotate(265deg)}50%{transform:rotate(130deg)}100%{transform:rotate(265deg)}}@keyframes rotate-arc{12.5%{transform:rotate(135deg)}25%{transform:rotate(270deg)}37.5%{transform:rotate(405deg)}50%{transform:rotate(540deg)}62.5%{transform:rotate(675deg)}75%{transform:rotate(810deg)}87.5%{transform:rotate(945deg)}100%{transform:rotate(1080deg)}}@keyframes linear-rotate{to{transform:rotate(360deg)}}@keyframes four-color{0%{border-top-color:var(--_four-color-active-indicator-one-color);border-right-color:var(--_four-color-active-indicator-one-color)}15%{border-top-color:var(--_four-color-active-indicator-one-color);border-right-color:var(--_four-color-active-indicator-one-color)}25%{border-top-color:var(--_four-color-active-indicator-two-color);border-right-color:var(--_four-color-active-indicator-two-color)}40%{border-top-color:var(--_four-color-active-indicator-two-color);border-right-color:var(--_four-color-active-indicator-two-color)}50%{border-top-color:var(--_four-color-active-indicator-three-color);border-right-color:var(--_four-color-active-indicator-three-color)}65%{border-top-color:var(--_four-color-active-indicator-three-color);border-right-color:var(--_four-color-active-indicator-three-color)}75%{border-top-color:var(--_four-color-active-indicator-four-color);border-right-color:var(--_four-color-active-indicator-four-color)}90%{border-top-color:var(--_four-color-active-indicator-four-color);border-right-color:var(--_four-color-active-indicator-four-color)}100%{border-top-color:var(--_four-color-active-indicator-one-color);border-right-color:var(--_four-color-active-indicator-one-color)}}/*# sourceMappingURL=circular-progress-styles.css.map */\n`;\n "]}
+{"version":3,"file":"circular-progress-styles.css.js","sourceRoot":"","sources":["circular-progress-styles.css.ts"],"names":[],"mappings":"AAAA;;;;IAII;AACH,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;CACzB,CAAC","sourcesContent":["/**\n  * @license\n  * Copyright 2022 Google LLC\n  * SPDX-License-Identifier: Apache-2.0\n  */\n import {css} from 'lit';\n export const styles = css`:host{--_active-indicator-color: var(--md-circular-progress-active-indicator-color, var(--md-sys-color-primary, #6750a4));--_active-indicator-width: var(--md-circular-progress-active-indicator-width, 8.3333333333);--_four-color-active-indicator-four-color: var(--md-circular-progress-four-color-active-indicator-four-color, var(--md-sys-color-tertiary-container, #ffd8e4));--_four-color-active-indicator-one-color: var(--md-circular-progress-four-color-active-indicator-one-color, var(--md-sys-color-primary, #6750a4));--_four-color-active-indicator-three-color: var(--md-circular-progress-four-color-active-indicator-three-color, var(--md-sys-color-tertiary, #7d5260));--_four-color-active-indicator-two-color: var(--md-circular-progress-four-color-active-indicator-two-color, var(--md-sys-color-primary-container, #eaddff));--_size: var(--md-circular-progress-size, 48px);display:inline-flex;vertical-align:middle;min-block-size:var(--_size);min-inline-size:var(--_size);position:relative;align-items:center;justify-content:center;contain:strict;content-visibility:auto}.circular-progress{flex:1;align-self:stretch;margin:4px}.circular-progress,.spinner,.left,.right,.circle,svg,.track,.progress{position:absolute;inset:0}svg{transform:rotate(-90deg)}circle{cx:50%;cy:50%;r:calc(50%*(1 - var(--_active-indicator-width)/100));stroke-width:calc(var(--_active-indicator-width)*1%);stroke-dasharray:100;fill:rgba(0,0,0,0)}.progress{transition:stroke-dashoffset 500ms cubic-bezier(0, 0, 0.2, 1);stroke:var(--_active-indicator-color)}.track{stroke:rgba(0,0,0,0)}.circular-progress.indeterminate{will-change:transform;animation:linear infinite linear-rotate;animation-duration:1568.2352941176ms}.spinner{will-change:transform;animation:infinite both rotate-arc;animation-duration:5332ms;animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1)}.left{overflow:hidden;inset:0 50% 0 0}.right{overflow:hidden;inset:0 0 0 50%}.circle{box-sizing:border-box;border-radius:50%;border:solid calc(var(--_active-indicator-width)/100*(var(--_size) - 8px));border-color:var(--_active-indicator-color) var(--_active-indicator-color) rgba(0,0,0,0) rgba(0,0,0,0);will-change:transform;animation:expand-arc;animation-iteration-count:infinite;animation-fill-mode:both;animation-duration:1333ms,5332ms;animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1)}.four-color .circle{animation-name:expand-arc,four-color}.left .circle{rotate:135deg;inset:0 -100% 0 0}.right .circle{rotate:100deg;inset:0 0 0 -100%;animation-delay:-666.5ms,0ms}@media screen and (forced-colors: active){.progress{stroke:CanvasText}.circle{border-color:CanvasText CanvasText Canvas Canvas}}@keyframes expand-arc{0%{transform:rotate(265deg)}50%{transform:rotate(130deg)}100%{transform:rotate(265deg)}}@keyframes rotate-arc{12.5%{transform:rotate(135deg)}25%{transform:rotate(270deg)}37.5%{transform:rotate(405deg)}50%{transform:rotate(540deg)}62.5%{transform:rotate(675deg)}75%{transform:rotate(810deg)}87.5%{transform:rotate(945deg)}100%{transform:rotate(1080deg)}}@keyframes linear-rotate{to{transform:rotate(360deg)}}@keyframes four-color{0%{border-top-color:var(--_four-color-active-indicator-one-color);border-right-color:var(--_four-color-active-indicator-one-color)}15%{border-top-color:var(--_four-color-active-indicator-one-color);border-right-color:var(--_four-color-active-indicator-one-color)}25%{border-top-color:var(--_four-color-active-indicator-two-color);border-right-color:var(--_four-color-active-indicator-two-color)}40%{border-top-color:var(--_four-color-active-indicator-two-color);border-right-color:var(--_four-color-active-indicator-two-color)}50%{border-top-color:var(--_four-color-active-indicator-three-color);border-right-color:var(--_four-color-active-indicator-three-color)}65%{border-top-color:var(--_four-color-active-indicator-three-color);border-right-color:var(--_four-color-active-indicator-three-color)}75%{border-top-color:var(--_four-color-active-indicator-four-color);border-right-color:var(--_four-color-active-indicator-four-color)}90%{border-top-color:var(--_four-color-active-indicator-four-color);border-right-color:var(--_four-color-active-indicator-four-color)}100%{border-top-color:var(--_four-color-active-indicator-one-color);border-right-color:var(--_four-color-active-indicator-one-color)}}/*# sourceMappingURL=circular-progress-styles.css.map */\n`;\n "]}

package/circularprogress/lib/circular-progress.d.ts

@@ -3,9 +3,9 @@
  * Copyright 2023 Google LLC
  * SPDX-License-Identifier: Apache-2.0
  */
-import { LitElement, TemplateResult } from 'lit';
+import { LitElement } from 'lit';
 /**
- * Circular Progress component.
+ * A circular progress component.
  */
 export declare class CircularProgress extends LitElement {
     /**
@@ -19,11 +19,9 @@ export declare class CircularProgress extends LitElement {
     indeterminate: boolean;
     /**
      * Whether or not to render indeterminate mode using 4 colors instead of one.
-     *
      */
     fourColor: boolean;
-    ariaLabel: string;
-    protected render(): TemplateResult;
-    protected renderDeterminateContainer(): TemplateResult<1>;
-    protected renderIndeterminateContainer(): TemplateResult<1>;
+    protected render(): import("lit-html").TemplateResult<1>;
+    private renderDeterminateContainer;
+    private renderIndeterminateContainer;
 }