@material/web 1.0.0-pre.15 → 1.0.0-pre.17

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

@@ -4,6 +4,6 @@
   * 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)}@media(forced-colors: active){.elevated md-elevation{border:1px solid rgba(0,0,0,0)}.elevated.link md-elevation{border-color:ActiveText}.elevated.disabled md-elevation{border-color:GrayText}}/*# sourceMappingURL=elevated-styles.css.map */
+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)}@media(forced-colors: active){.elevated md-elevation{border:1px solid CanvasText}.elevated.disabled md-elevation{border-color:GrayText}}/*# sourceMappingURL=elevated-styles.css.map */
 `;
 //# sourceMappingURL=elevated-styles.css.js.map

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

@@ -1 +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)}@media(forced-colors: active){.elevated md-elevation{border:1px solid rgba(0,0,0,0)}.elevated.link md-elevation{border-color:ActiveText}.elevated.disabled md-elevation{border-color:GrayText}}/*# sourceMappingURL=elevated-styles.css.map */\n`;\n "]}
+{"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)}@media(forced-colors: active){.elevated md-elevation{border:1px solid CanvasText}.elevated.disabled md-elevation{border-color:GrayText}}/*# sourceMappingURL=elevated-styles.css.map */\n`;\n "]}

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

@@ -4,7 +4,7 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 import '../../elevation/elevation.js';
-import { nothing, PropertyValues, TemplateResult } from 'lit';
+import { nothing, PropertyValues } from 'lit';
 import { MultiActionChip } from './multi-action-chip.js';
 /**
  * A filter chip component.
@@ -16,18 +16,17 @@ export declare class FilterChip extends MultiActionChip {
     protected get primaryId(): string;
     protected readonly primaryAction: HTMLElement | null;
     protected readonly trailingAction: HTMLElement | null;
-    constructor();
     protected updated(changed: PropertyValues<this>): void;
+    protected renderContainer(content: unknown): import("lit-html").TemplateResult<1>;
     protected getContainerClasses(): {
         elevated: boolean;
         selected: boolean;
         'has-trailing': boolean;
         disabled: boolean;
     };
-    protected renderActionCell(content: TemplateResult | typeof nothing): typeof nothing | TemplateResult<2 | 1>;
-    protected renderAction(): TemplateResult<1>;
-    protected renderLeadingIcon(): TemplateResult<2 | 1>;
-    protected renderTrailingAction(): TemplateResult<1> | typeof nothing;
-    protected renderOutline(): TemplateResult<1>;
+    protected renderPrimaryAction(content: unknown): import("lit-html").TemplateResult<1>;
+    protected renderLeadingIcon(): import("lit-html").TemplateResult<2 | 1>;
+    protected renderTrailingAction(): import("lit-html").TemplateResult<1> | typeof nothing;
+    protected renderOutline(): import("lit-html").TemplateResult<1>;
     private handleClick;
 }

package/chips/internal/filter-chip.js

@@ -7,6 +7,7 @@ import { __decorate } from "tslib";
 import '../../elevation/elevation.js';
 import { html, nothing, svg } from 'lit';
 import { property, query } from 'lit/decorators.js';
+import { classMap } from 'lit/directives/class-map.js';
 import { redispatchEvent } from '../../internal/controller/events.js';
 import { MultiActionChip } from './multi-action-chip.js';
 import { renderRemoveButton } from './trailing-icons.js';
@@ -14,17 +15,14 @@ import { renderRemoveButton } from './trailing-icons.js';
  * A filter chip component.
  */
 export class FilterChip extends MultiActionChip {
-    get primaryId() {
-        return 'option';
-    }
     constructor() {
-        super();
+        super(...arguments);
         this.elevated = false;
         this.removable = false;
         this.selected = false;
-        // Remove the `row` role from the container, since filter chips do not use a
-        // `grid` navigation model.
-        this.containerRole = undefined;
+    }
+    get primaryId() {
+        return 'option';
     }
     updated(changed) {
         if (changed.has('selected') && changed.get('selected') !== undefined) {
@@ -32,6 +30,12 @@ export class FilterChip extends MultiActionChip {
             this.dispatchEvent(new Event('selected', { bubbles: true }));
         }
     }
+    renderContainer(content) {
+        const classes = this.getContainerClasses();
+        // Note: an explicit `role="presentation"` is needed for VoiceOver. Without
+        // it, linear navigation gets stuck on the first filter chip.
+        return html `<div class="container ${classMap(classes)}" role="presentation">${content}</div>`;
+    }
     getContainerClasses() {
         return {
             ...super.getContainerClasses(),
@@ -40,12 +44,7 @@ export class FilterChip extends MultiActionChip {
             'has-trailing': this.removable,
         };
     }
-    renderActionCell(content) {
-        // Filter chips use a `listbox`/`option` model, and do not need `gridcell`
-        // wrappers around their actions.
-        return content;
-    }
-    renderAction() {
+    renderPrimaryAction(content) {
         const { ariaLabel } = this;
         return html `
       <button class="primary action"
@@ -55,7 +54,7 @@ export class FilterChip extends MultiActionChip {
         ?disabled=${this.disabled || nothing}
         role="option"
         @click=${this.handleClick}
-      >${this.renderContent()}</button>
+      >${content}</button>
     `;
     }
     renderLeadingIcon() {

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

@@ -1 +1 @@
-{"version":3,"file":"filter-chip.js","sourceRoot":"","sources":["filter-chip.ts"],"names":[],"mappings":"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","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, TemplateResult} from 'lit';\nimport {property, query} from 'lit/decorators.js';\n\nimport {ARIAMixinStrict} from '../../internal/aria/aria.js';\nimport {redispatchEvent} from '../../internal/controller/events.js';\n\nimport {MultiActionChip} from './multi-action-chip.js';\nimport {renderRemoveButton} from './trailing-icons.js';\n\n/**\n * A filter chip component.\n */\nexport class FilterChip extends MultiActionChip {\n  @property({type: Boolean}) elevated = false;\n  @property({type: Boolean}) removable = false;\n  @property({type: Boolean, reflect: true}) selected = false;\n\n  protected get primaryId() {\n    return 'option';\n  }\n\n  @query('.primary.action') protected readonly primaryAction!: HTMLElement|null;\n  @query('.trailing.action')\n  protected readonly trailingAction!: HTMLElement|null;\n\n  constructor() {\n    super();\n    // Remove the `row` role from the container, since filter chips do not use a\n    // `grid` navigation model.\n    this.containerRole = undefined;\n  }\n\n  protected override updated(changed: PropertyValues<this>) {\n    if (changed.has('selected') && changed.get('selected') !== undefined) {\n      // Dispatch when `selected` changes, except for the first update.\n      this.dispatchEvent(new Event('selected', {bubbles: true}));\n    }\n  }\n\n  protected override getContainerClasses() {\n    return {\n      ...super.getContainerClasses(),\n      elevated: this.elevated,\n      selected: this.selected,\n      'has-trailing': this.removable,\n    };\n  }\n\n  protected override renderActionCell(content: TemplateResult|typeof nothing) {\n    // Filter chips use a `listbox`/`option` model, and do not need `gridcell`\n    // wrappers around their actions.\n    return content;\n  }\n\n  protected override renderAction() {\n    const {ariaLabel} = this as ARIAMixinStrict;\n    return html`\n      <button class=\"primary action\"\n        id=\"option\"\n        aria-label=${ariaLabel || nothing}\n        aria-selected=${this.selected}\n        ?disabled=${this.disabled || nothing}\n        role=\"option\"\n        @click=${this.handleClick}\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 renderTrailingAction() {\n    if (this.removable) {\n      return renderRemoveButton(\n          {ariaLabel: this.ariaLabelRemove, disabled: this.disabled});\n    }\n\n    return nothing;\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  private handleClick(event: MouseEvent) {\n    if (this.disabled) {\n      return;\n    }\n\n    const preventDefault = !redispatchEvent(this, event);\n    if (preventDefault) {\n      return;\n    }\n\n    this.selected = !this.selected;\n  }\n}\n"]}
+{"version":3,"file":"filter-chip.js","sourceRoot":"","sources":["filter-chip.ts"],"names":[],"mappings":"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","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, query} from 'lit/decorators.js';\nimport {classMap} from 'lit/directives/class-map.js';\n\nimport {ARIAMixinStrict} from '../../internal/aria/aria.js';\nimport {redispatchEvent} from '../../internal/controller/events.js';\n\nimport {MultiActionChip} from './multi-action-chip.js';\nimport {renderRemoveButton} from './trailing-icons.js';\n\n/**\n * A filter chip component.\n */\nexport class FilterChip extends MultiActionChip {\n  @property({type: Boolean}) elevated = false;\n  @property({type: Boolean}) removable = false;\n  @property({type: Boolean, reflect: true}) selected = false;\n\n  protected get primaryId() {\n    return 'option';\n  }\n\n  @query('.primary.action') protected readonly primaryAction!: HTMLElement|null;\n  @query('.trailing.action')\n  protected readonly trailingAction!: HTMLElement|null;\n\n  protected override updated(changed: PropertyValues<this>) {\n    if (changed.has('selected') && changed.get('selected') !== undefined) {\n      // Dispatch when `selected` changes, except for the first update.\n      this.dispatchEvent(new Event('selected', {bubbles: true}));\n    }\n  }\n\n  protected override renderContainer(content: unknown) {\n    const classes = this.getContainerClasses();\n    // Note: an explicit `role=\"presentation\"` is needed for VoiceOver. Without\n    // it, linear navigation gets stuck on the first filter chip.\n    return html`<div class=\"container ${\n        classMap(classes)}\" role=\"presentation\">${content}</div>`;\n  }\n\n  protected override getContainerClasses() {\n    return {\n      ...super.getContainerClasses(),\n      elevated: this.elevated,\n      selected: this.selected,\n      'has-trailing': this.removable,\n    };\n  }\n\n  protected override renderPrimaryAction(content: unknown) {\n    const {ariaLabel} = this as ARIAMixinStrict;\n    return html`\n      <button class=\"primary action\"\n        id=\"option\"\n        aria-label=${ariaLabel || nothing}\n        aria-selected=${this.selected}\n        ?disabled=${this.disabled || nothing}\n        role=\"option\"\n        @click=${this.handleClick}\n      >${content}</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 renderTrailingAction() {\n    if (this.removable) {\n      return renderRemoveButton(\n          {ariaLabel: this.ariaLabelRemove, disabled: this.disabled});\n    }\n\n    return nothing;\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  private handleClick(event: MouseEvent) {\n    if (this.disabled) {\n      return;\n    }\n\n    const preventDefault = !redispatchEvent(this, event);\n    if (preventDefault) {\n      return;\n    }\n\n    this.selected = !this.selected;\n  }\n}\n"]}

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

@@ -4,6 +4,6 @@
   * 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-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));--_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.elevated::before{background:var(--_elevated-selected-container-color)}.checkmark{height:var(--_icon-size);width:var(--_icon-size)}.disabled .checkmark{opacity:var(--_disabled-leading-icon-opacity)}/*# sourceMappingURL=filter-styles.css.map */
+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-font: var(--md-filter-chip-label-text-font, var(--md-sys-typescale-label-large-font, var(--md-ref-typeface-plain, Roboto)));--_label-text-line-height: var(--md-filter-chip-label-text-line-height, var(--md-sys-typescale-label-large-line-height, 1.25rem));--_label-text-size: var(--md-filter-chip-label-text-size, var(--md-sys-typescale-label-large-size, 0.875rem));--_label-text-weight: var(--md-filter-chip-label-text-weight, var(--md-sys-typescale-label-large-weight, var(--md-ref-typeface-weight-medium, 500)));--_selected-focus-label-text-color: var(--md-filter-chip-selected-focus-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_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));--_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.elevated::before{background:var(--_elevated-selected-container-color)}.checkmark{height:var(--_icon-size);width:var(--_icon-size)}.disabled .checkmark{opacity:var(--_disabled-leading-icon-opacity)}@media(forced-colors: active){.disabled .checkmark{opacity:1}}/*# sourceMappingURL=filter-styles.css.map */
 `;
 //# sourceMappingURL=filter-styles.css.js.map

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

@@ -1 +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-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));--_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.elevated::before{background:var(--_elevated-selected-container-color)}.checkmark{height:var(--_icon-size);width:var(--_icon-size)}.disabled .checkmark{opacity:var(--_disabled-leading-icon-opacity)}/*# sourceMappingURL=filter-styles.css.map */\n`;\n "]}
+{"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-font: var(--md-filter-chip-label-text-font, var(--md-sys-typescale-label-large-font, var(--md-ref-typeface-plain, Roboto)));--_label-text-line-height: var(--md-filter-chip-label-text-line-height, var(--md-sys-typescale-label-large-line-height, 1.25rem));--_label-text-size: var(--md-filter-chip-label-text-size, var(--md-sys-typescale-label-large-size, 0.875rem));--_label-text-weight: var(--md-filter-chip-label-text-weight, var(--md-sys-typescale-label-large-weight, var(--md-ref-typeface-weight-medium, 500)));--_selected-focus-label-text-color: var(--md-filter-chip-selected-focus-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_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));--_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.elevated::before{background:var(--_elevated-selected-container-color)}.checkmark{height:var(--_icon-size);width:var(--_icon-size)}.disabled .checkmark{opacity:var(--_disabled-leading-icon-opacity)}@media(forced-colors: active){.disabled .checkmark{opacity:1}}/*# sourceMappingURL=filter-styles.css.map */\n`;\n "]}

package/chips/internal/input-chip.d.ts

@@ -3,6 +3,7 @@
  * Copyright 2023 Google LLC
  * SPDX-License-Identifier: Apache-2.0
  */
+import { nothing } from 'lit';
 import { MultiActionChip } from './multi-action-chip.js';
 /**
  * An input chip component.
@@ -17,6 +18,7 @@ export declare class InputChip extends MultiActionChip {
     protected get rippleDisabled(): boolean;
     protected get primaryAction(): HTMLElement;
     protected readonly trailingAction: HTMLElement | null;
+    protected renderContainer(content: unknown): import("lit-html").TemplateResult<1>;
     protected getContainerClasses(): {
         avatar: boolean;
         disabled: boolean;
@@ -24,6 +26,6 @@ export declare class InputChip extends MultiActionChip {
         selected: boolean;
         'has-trailing': boolean;
     };
-    protected renderAction(): import("lit-html").TemplateResult<1>;
-    protected renderTrailingAction(): import("lit-html").TemplateResult<1>;
+    protected renderPrimaryAction(content: unknown): import("lit-html").TemplateResult<1> | typeof nothing;
+    protected renderTrailingAction(): import("lit-html").TemplateResult<1> | typeof nothing;
 }

package/chips/internal/input-chip.js

@@ -6,6 +6,7 @@
 import { __decorate } from "tslib";
 import { html, nothing } from 'lit';
 import { property, query } from 'lit/decorators.js';
+import { renderGridAction, renderGridContainer } from './chip.js';
 import { MultiActionChip } from './multi-action-chip.js';
 import { renderRemoveButton } from './trailing-icons.js';
 /**
@@ -41,6 +42,9 @@ export class InputChip extends MultiActionChip {
         }
         return this.renderRoot.querySelector('.primary.action');
     }
+    renderContainer(content) {
+        return renderGridContainer(content, this.getContainerClasses());
+    }
     getContainerClasses() {
         return {
             ...super.getContainerClasses(),
@@ -52,40 +56,40 @@ export class InputChip extends MultiActionChip {
             'has-trailing': true,
         };
     }
-    renderAction() {
+    renderPrimaryAction(content) {
         const { ariaLabel } = this;
         if (this.href) {
-            return html `
+            return renderGridAction(html `
         <a class="primary action"
           id="link"
           aria-label=${ariaLabel || nothing}
           href=${this.href}
           target=${this.target || nothing}
-        >${this.renderContent()}</a>
-      `;
+        >${content}</a>
+      `);
         }
         if (this.removeOnly) {
-            return html `
+            return renderGridAction(html `
         <span class="primary action" aria-label=${ariaLabel || nothing}>
-          ${this.renderContent()}
+          ${content}
         </span>
-      `;
+      `);
         }
-        return html `
+        return renderGridAction(html `
       <button class="primary action"
         id="button"
         aria-label=${ariaLabel || nothing}
         ?disabled=${this.disabled}
         type="button"
-      >${this.renderContent()}</button>
-    `;
+      >${content}</button>
+    `);
     }
     renderTrailingAction() {
-        return renderRemoveButton({
+        return renderGridAction(renderRemoveButton({
             ariaLabel: this.ariaLabelRemove,
             disabled: !this.href && this.disabled,
             tabbable: this.removeOnly,
-        });
+        }));
     }
 }
 __decorate([

package/chips/internal/input-chip.js.map

@@ -1 +1 @@
-{"version":3,"file":"input-chip.js","sourceRoot":"","sources":["input-chip.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {html, nothing} from 'lit';\nimport {property, query} from 'lit/decorators.js';\n\nimport {ARIAMixinStrict} from '../../internal/aria/aria.js';\n\nimport {MultiActionChip} from './multi-action-chip.js';\nimport {renderRemoveButton} from './trailing-icons.js';\n\n/**\n * An input chip component.\n */\nexport class InputChip extends MultiActionChip {\n  @property({type: Boolean}) avatar = false;\n  @property() href = '';\n  @property() target: '_blank'|'_parent'|'_self'|'_top'|'' = '';\n  @property({type: Boolean, attribute: 'remove-only'}) removeOnly = false;\n  @property({type: Boolean, reflect: true}) selected = false;\n\n  protected get primaryId() {\n    if (this.href) {\n      return 'link';\n    }\n\n    if (this.removeOnly) {\n      return '';\n    }\n\n    return 'button';\n  }\n\n  protected override get rippleDisabled() {\n    // Link chips cannot be disabled\n    return !this.href && this.disabled;\n  }\n\n  protected get primaryAction() {\n    // Don't use @query() since a remove-only input chip still has a span that\n    // has \"primary action\" classes.\n    if (this.removeOnly) {\n      return null;\n    }\n\n    return this.renderRoot.querySelector<HTMLElement>('.primary.action');\n  }\n\n  @query('.trailing.action')\n  protected readonly trailingAction!: HTMLElement|null;\n\n  protected override getContainerClasses() {\n    return {\n      ...super.getContainerClasses(),\n      avatar: this.avatar,\n      // Link chips cannot be disabled\n      disabled: !this.href && this.disabled,\n      link: !!this.href,\n      selected: this.selected,\n      'has-trailing': true,\n    };\n  }\n\n  protected override renderAction() {\n    const {ariaLabel} = this as ARIAMixinStrict;\n    if (this.href) {\n      return html`\n        <a class=\"primary action\"\n          id=\"link\"\n          aria-label=${ariaLabel || nothing}\n          href=${this.href}\n          target=${this.target || nothing}\n        >${this.renderContent()}</a>\n      `;\n    }\n\n    if (this.removeOnly) {\n      return html`\n        <span class=\"primary action\" aria-label=${ariaLabel || nothing}>\n          ${this.renderContent()}\n        </span>\n      `;\n    }\n\n    return html`\n      <button class=\"primary action\"\n        id=\"button\"\n        aria-label=${ariaLabel || nothing}\n        ?disabled=${this.disabled}\n        type=\"button\"\n      >${this.renderContent()}</button>\n    `;\n  }\n\n  protected override renderTrailingAction() {\n    return renderRemoveButton({\n      ariaLabel: this.ariaLabelRemove,\n      disabled: !this.href && this.disabled,\n      tabbable: this.removeOnly,\n    });\n  }\n}\n"]}
+{"version":3,"file":"input-chip.js","sourceRoot":"","sources":["input-chip.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {html, nothing} from 'lit';\nimport {property, query} from 'lit/decorators.js';\n\nimport {ARIAMixinStrict} from '../../internal/aria/aria.js';\n\nimport {renderGridAction, renderGridContainer} from './chip.js';\nimport {MultiActionChip} from './multi-action-chip.js';\nimport {renderRemoveButton} from './trailing-icons.js';\n\n/**\n * An input chip component.\n */\nexport class InputChip extends MultiActionChip {\n  @property({type: Boolean}) avatar = false;\n  @property() href = '';\n  @property() target: '_blank'|'_parent'|'_self'|'_top'|'' = '';\n  @property({type: Boolean, attribute: 'remove-only'}) removeOnly = false;\n  @property({type: Boolean, reflect: true}) selected = false;\n\n  protected get primaryId() {\n    if (this.href) {\n      return 'link';\n    }\n\n    if (this.removeOnly) {\n      return '';\n    }\n\n    return 'button';\n  }\n\n  protected override get rippleDisabled() {\n    // Link chips cannot be disabled\n    return !this.href && this.disabled;\n  }\n\n  protected get primaryAction() {\n    // Don't use @query() since a remove-only input chip still has a span that\n    // has \"primary action\" classes.\n    if (this.removeOnly) {\n      return null;\n    }\n\n    return this.renderRoot.querySelector<HTMLElement>('.primary.action');\n  }\n\n  @query('.trailing.action')\n  protected readonly trailingAction!: HTMLElement|null;\n\n  protected override renderContainer(content: unknown) {\n    return renderGridContainer(content, this.getContainerClasses());\n  }\n\n  protected override getContainerClasses() {\n    return {\n      ...super.getContainerClasses(),\n      avatar: this.avatar,\n      // Link chips cannot be disabled\n      disabled: !this.href && this.disabled,\n      link: !!this.href,\n      selected: this.selected,\n      'has-trailing': true,\n    };\n  }\n\n  protected override renderPrimaryAction(content: unknown) {\n    const {ariaLabel} = this as ARIAMixinStrict;\n    if (this.href) {\n      return renderGridAction(html`\n        <a class=\"primary action\"\n          id=\"link\"\n          aria-label=${ariaLabel || nothing}\n          href=${this.href}\n          target=${this.target || nothing}\n        >${content}</a>\n      `);\n    }\n\n    if (this.removeOnly) {\n      return renderGridAction(html`\n        <span class=\"primary action\" aria-label=${ariaLabel || nothing}>\n          ${content}\n        </span>\n      `);\n    }\n\n    return renderGridAction(html`\n      <button class=\"primary action\"\n        id=\"button\"\n        aria-label=${ariaLabel || nothing}\n        ?disabled=${this.disabled}\n        type=\"button\"\n      >${content}</button>\n    `);\n  }\n\n  protected override renderTrailingAction() {\n    return renderGridAction(renderRemoveButton({\n      ariaLabel: this.ariaLabelRemove,\n      disabled: !this.href && this.disabled,\n      tabbable: this.removeOnly,\n    }));\n  }\n}\n"]}

package/chips/internal/input-styles.css.js

@@ -4,6 +4,6 @@
   * SPDX-License-Identifier: Apache-2.0
   */
 import { css } from 'lit';
-export const styles = css `:host{--_container-height: var(--md-input-chip-container-height, 32px);--_container-shape: var(--md-input-chip-container-shape, 8px);--_disabled-label-text-color: var(--md-input-chip-disabled-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-label-text-opacity: var(--md-input-chip-disabled-label-text-opacity, 0.38);--_disabled-selected-container-color: var(--md-input-chip-disabled-selected-container-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-selected-container-opacity: var(--md-input-chip-disabled-selected-container-opacity, 0.12);--_label-text-type: var(--md-input-chip-label-text-type, var(--md-sys-typescale-label-large, 500 0.875rem / 1.25rem var(--md-ref-typeface-plain, Roboto)));--_selected-container-color: var(--md-input-chip-selected-container-color, var(--md-sys-color-secondary-container, #e8def8));--_selected-focus-label-text-color: var(--md-input-chip-selected-focus-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-hover-label-text-color: var(--md-input-chip-selected-hover-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-hover-state-layer-color: var(--md-input-chip-selected-hover-state-layer-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-hover-state-layer-opacity: var(--md-input-chip-selected-hover-state-layer-opacity, 0.08);--_selected-label-text-color: var(--md-input-chip-selected-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-outline-width: var(--md-input-chip-selected-outline-width, 0px);--_selected-pressed-label-text-color: var(--md-input-chip-selected-pressed-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-pressed-state-layer-color: var(--md-input-chip-selected-pressed-state-layer-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-pressed-state-layer-opacity: var(--md-input-chip-selected-pressed-state-layer-opacity, 0.12);--_disabled-outline-color: var(--md-input-chip-disabled-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-outline-opacity: var(--md-input-chip-disabled-outline-opacity, 0.12);--_focus-label-text-color: var(--md-input-chip-focus-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_focus-outline-color: var(--md-input-chip-focus-outline-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-label-text-color: var(--md-input-chip-hover-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-state-layer-color: var(--md-input-chip-hover-state-layer-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-state-layer-opacity: var(--md-input-chip-hover-state-layer-opacity, 0.08);--_label-text-color: var(--md-input-chip-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_outline-color: var(--md-input-chip-outline-color, var(--md-sys-color-outline, #79747e));--_outline-width: var(--md-input-chip-outline-width, 1px);--_pressed-label-text-color: var(--md-input-chip-pressed-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_pressed-state-layer-color: var(--md-input-chip-pressed-state-layer-color, var(--md-sys-color-on-surface-variant, #49454f));--_pressed-state-layer-opacity: var(--md-input-chip-pressed-state-layer-opacity, 0.12);--_avatar-shape: var(--md-input-chip-avatar-shape, 9999px);--_avatar-size: var(--md-input-chip-avatar-size, 24px);--_disabled-avatar-opacity: var(--md-input-chip-disabled-avatar-opacity, 0.38);--_disabled-leading-icon-color: var(--md-input-chip-disabled-leading-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-leading-icon-opacity: var(--md-input-chip-disabled-leading-icon-opacity, 0.38);--_icon-size: var(--md-input-chip-icon-size, 18px);--_selected-focus-leading-icon-color: var(--md-input-chip-selected-focus-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_selected-hover-leading-icon-color: var(--md-input-chip-selected-hover-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_selected-leading-icon-color: var(--md-input-chip-selected-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_selected-pressed-leading-icon-color: var(--md-input-chip-selected-pressed-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_focus-leading-icon-color: var(--md-input-chip-focus-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_hover-leading-icon-color: var(--md-input-chip-hover-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_leading-icon-color: var(--md-input-chip-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_pressed-leading-icon-color: var(--md-input-chip-pressed-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_disabled-trailing-icon-color: var(--md-input-chip-disabled-trailing-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-trailing-icon-opacity: var(--md-input-chip-disabled-trailing-icon-opacity, 0.38);--_selected-focus-trailing-icon-color: var(--md-input-chip-selected-focus-trailing-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-hover-trailing-icon-color: var(--md-input-chip-selected-hover-trailing-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-pressed-trailing-icon-color: var(--md-input-chip-selected-pressed-trailing-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-trailing-icon-color: var(--md-input-chip-selected-trailing-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_focus-trailing-icon-color: var(--md-input-chip-focus-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-trailing-icon-color: var(--md-input-chip-hover-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_pressed-trailing-icon-color: var(--md-input-chip-pressed-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_trailing-icon-color: var(--md-input-chip-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_container-shape-start-start: var( --md-input-chip-container-shape-start-start, var(--_container-shape) );--_container-shape-start-end: var( --md-input-chip-container-shape-start-end, var(--_container-shape) );--_container-shape-end-end: var( --md-input-chip-container-shape-end-end, var(--_container-shape) );--_container-shape-end-start: var( --md-input-chip-container-shape-end-start, var(--_container-shape) )}.avatar .primary.action{padding-inline-start:4px}.avatar .leading.icon ::slotted(:first-child){border-radius:var(--_avatar-shape);height:var(--_avatar-size);width:var(--_avatar-size)}.disabled.avatar .leading.icon{opacity:var(--_disabled-avatar-opacity)}/*# sourceMappingURL=input-styles.css.map */
+export const styles = css `:host{--_container-height: var(--md-input-chip-container-height, 32px);--_container-shape: var(--md-input-chip-container-shape, 8px);--_disabled-label-text-color: var(--md-input-chip-disabled-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-label-text-opacity: var(--md-input-chip-disabled-label-text-opacity, 0.38);--_disabled-selected-container-color: var(--md-input-chip-disabled-selected-container-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-selected-container-opacity: var(--md-input-chip-disabled-selected-container-opacity, 0.12);--_label-text-font: var(--md-input-chip-label-text-font, var(--md-sys-typescale-label-large-font, var(--md-ref-typeface-plain, Roboto)));--_label-text-line-height: var(--md-input-chip-label-text-line-height, var(--md-sys-typescale-label-large-line-height, 1.25rem));--_label-text-size: var(--md-input-chip-label-text-size, var(--md-sys-typescale-label-large-size, 0.875rem));--_label-text-weight: var(--md-input-chip-label-text-weight, var(--md-sys-typescale-label-large-weight, var(--md-ref-typeface-weight-medium, 500)));--_selected-container-color: var(--md-input-chip-selected-container-color, var(--md-sys-color-secondary-container, #e8def8));--_selected-focus-label-text-color: var(--md-input-chip-selected-focus-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-hover-label-text-color: var(--md-input-chip-selected-hover-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-hover-state-layer-color: var(--md-input-chip-selected-hover-state-layer-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-hover-state-layer-opacity: var(--md-input-chip-selected-hover-state-layer-opacity, 0.08);--_selected-label-text-color: var(--md-input-chip-selected-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-outline-width: var(--md-input-chip-selected-outline-width, 0px);--_selected-pressed-label-text-color: var(--md-input-chip-selected-pressed-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-pressed-state-layer-color: var(--md-input-chip-selected-pressed-state-layer-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-pressed-state-layer-opacity: var(--md-input-chip-selected-pressed-state-layer-opacity, 0.12);--_disabled-outline-color: var(--md-input-chip-disabled-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-outline-opacity: var(--md-input-chip-disabled-outline-opacity, 0.12);--_focus-label-text-color: var(--md-input-chip-focus-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_focus-outline-color: var(--md-input-chip-focus-outline-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-label-text-color: var(--md-input-chip-hover-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-state-layer-color: var(--md-input-chip-hover-state-layer-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-state-layer-opacity: var(--md-input-chip-hover-state-layer-opacity, 0.08);--_label-text-color: var(--md-input-chip-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_outline-color: var(--md-input-chip-outline-color, var(--md-sys-color-outline, #79747e));--_outline-width: var(--md-input-chip-outline-width, 1px);--_pressed-label-text-color: var(--md-input-chip-pressed-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_pressed-state-layer-color: var(--md-input-chip-pressed-state-layer-color, var(--md-sys-color-on-surface-variant, #49454f));--_pressed-state-layer-opacity: var(--md-input-chip-pressed-state-layer-opacity, 0.12);--_avatar-shape: var(--md-input-chip-avatar-shape, 9999px);--_avatar-size: var(--md-input-chip-avatar-size, 24px);--_disabled-avatar-opacity: var(--md-input-chip-disabled-avatar-opacity, 0.38);--_disabled-leading-icon-color: var(--md-input-chip-disabled-leading-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-leading-icon-opacity: var(--md-input-chip-disabled-leading-icon-opacity, 0.38);--_icon-size: var(--md-input-chip-icon-size, 18px);--_selected-focus-leading-icon-color: var(--md-input-chip-selected-focus-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_selected-hover-leading-icon-color: var(--md-input-chip-selected-hover-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_selected-leading-icon-color: var(--md-input-chip-selected-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_selected-pressed-leading-icon-color: var(--md-input-chip-selected-pressed-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_focus-leading-icon-color: var(--md-input-chip-focus-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_hover-leading-icon-color: var(--md-input-chip-hover-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_leading-icon-color: var(--md-input-chip-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_pressed-leading-icon-color: var(--md-input-chip-pressed-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_disabled-trailing-icon-color: var(--md-input-chip-disabled-trailing-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-trailing-icon-opacity: var(--md-input-chip-disabled-trailing-icon-opacity, 0.38);--_selected-focus-trailing-icon-color: var(--md-input-chip-selected-focus-trailing-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-hover-trailing-icon-color: var(--md-input-chip-selected-hover-trailing-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-pressed-trailing-icon-color: var(--md-input-chip-selected-pressed-trailing-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-trailing-icon-color: var(--md-input-chip-selected-trailing-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_focus-trailing-icon-color: var(--md-input-chip-focus-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-trailing-icon-color: var(--md-input-chip-hover-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_pressed-trailing-icon-color: var(--md-input-chip-pressed-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_trailing-icon-color: var(--md-input-chip-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_container-shape-start-start: var( --md-input-chip-container-shape-start-start, var(--_container-shape) );--_container-shape-start-end: var( --md-input-chip-container-shape-start-end, var(--_container-shape) );--_container-shape-end-end: var( --md-input-chip-container-shape-end-end, var(--_container-shape) );--_container-shape-end-start: var( --md-input-chip-container-shape-end-start, var(--_container-shape) )}:host([avatar]){--_container-shape-start-start: var( --md-input-chip-container-shape-start-start, var(--md-input-chip-container-shape, calc(var(--_container-height) / 2)) );--_container-shape-start-end: var( --md-input-chip-container-shape-start-end, var(--md-input-chip-container-shape, calc(var(--_container-height) / 2)) );--_container-shape-end-end: var( --md-input-chip-container-shape-end-end, var(--md-input-chip-container-shape, calc(var(--_container-height) / 2)) );--_container-shape-end-start: var( --md-input-chip-container-shape-end-start, var(--md-input-chip-container-shape, calc(var(--_container-height) / 2)) )}.avatar .primary.action{padding-inline-start:4px}.avatar .leading.icon ::slotted(:first-child){border-radius:var(--_avatar-shape);height:var(--_avatar-size);width:var(--_avatar-size)}.disabled.avatar .leading.icon{opacity:var(--_disabled-avatar-opacity)}@media(forced-colors: active){.link .outline{border-color:ActiveText}.disabled.avatar .leading.icon{opacity:1}}/*# sourceMappingURL=input-styles.css.map */
 `;
 //# sourceMappingURL=input-styles.css.js.map

package/chips/internal/input-styles.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"input-styles.css.js","sourceRoot":"","sources":["input-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-input-chip-container-height, 32px);--_container-shape: var(--md-input-chip-container-shape, 8px);--_disabled-label-text-color: var(--md-input-chip-disabled-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-label-text-opacity: var(--md-input-chip-disabled-label-text-opacity, 0.38);--_disabled-selected-container-color: var(--md-input-chip-disabled-selected-container-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-selected-container-opacity: var(--md-input-chip-disabled-selected-container-opacity, 0.12);--_label-text-type: var(--md-input-chip-label-text-type, var(--md-sys-typescale-label-large, 500 0.875rem / 1.25rem var(--md-ref-typeface-plain, Roboto)));--_selected-container-color: var(--md-input-chip-selected-container-color, var(--md-sys-color-secondary-container, #e8def8));--_selected-focus-label-text-color: var(--md-input-chip-selected-focus-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-hover-label-text-color: var(--md-input-chip-selected-hover-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-hover-state-layer-color: var(--md-input-chip-selected-hover-state-layer-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-hover-state-layer-opacity: var(--md-input-chip-selected-hover-state-layer-opacity, 0.08);--_selected-label-text-color: var(--md-input-chip-selected-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-outline-width: var(--md-input-chip-selected-outline-width, 0px);--_selected-pressed-label-text-color: var(--md-input-chip-selected-pressed-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-pressed-state-layer-color: var(--md-input-chip-selected-pressed-state-layer-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-pressed-state-layer-opacity: var(--md-input-chip-selected-pressed-state-layer-opacity, 0.12);--_disabled-outline-color: var(--md-input-chip-disabled-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-outline-opacity: var(--md-input-chip-disabled-outline-opacity, 0.12);--_focus-label-text-color: var(--md-input-chip-focus-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_focus-outline-color: var(--md-input-chip-focus-outline-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-label-text-color: var(--md-input-chip-hover-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-state-layer-color: var(--md-input-chip-hover-state-layer-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-state-layer-opacity: var(--md-input-chip-hover-state-layer-opacity, 0.08);--_label-text-color: var(--md-input-chip-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_outline-color: var(--md-input-chip-outline-color, var(--md-sys-color-outline, #79747e));--_outline-width: var(--md-input-chip-outline-width, 1px);--_pressed-label-text-color: var(--md-input-chip-pressed-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_pressed-state-layer-color: var(--md-input-chip-pressed-state-layer-color, var(--md-sys-color-on-surface-variant, #49454f));--_pressed-state-layer-opacity: var(--md-input-chip-pressed-state-layer-opacity, 0.12);--_avatar-shape: var(--md-input-chip-avatar-shape, 9999px);--_avatar-size: var(--md-input-chip-avatar-size, 24px);--_disabled-avatar-opacity: var(--md-input-chip-disabled-avatar-opacity, 0.38);--_disabled-leading-icon-color: var(--md-input-chip-disabled-leading-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-leading-icon-opacity: var(--md-input-chip-disabled-leading-icon-opacity, 0.38);--_icon-size: var(--md-input-chip-icon-size, 18px);--_selected-focus-leading-icon-color: var(--md-input-chip-selected-focus-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_selected-hover-leading-icon-color: var(--md-input-chip-selected-hover-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_selected-leading-icon-color: var(--md-input-chip-selected-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_selected-pressed-leading-icon-color: var(--md-input-chip-selected-pressed-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_focus-leading-icon-color: var(--md-input-chip-focus-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_hover-leading-icon-color: var(--md-input-chip-hover-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_leading-icon-color: var(--md-input-chip-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_pressed-leading-icon-color: var(--md-input-chip-pressed-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_disabled-trailing-icon-color: var(--md-input-chip-disabled-trailing-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-trailing-icon-opacity: var(--md-input-chip-disabled-trailing-icon-opacity, 0.38);--_selected-focus-trailing-icon-color: var(--md-input-chip-selected-focus-trailing-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-hover-trailing-icon-color: var(--md-input-chip-selected-hover-trailing-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-pressed-trailing-icon-color: var(--md-input-chip-selected-pressed-trailing-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-trailing-icon-color: var(--md-input-chip-selected-trailing-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_focus-trailing-icon-color: var(--md-input-chip-focus-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-trailing-icon-color: var(--md-input-chip-hover-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_pressed-trailing-icon-color: var(--md-input-chip-pressed-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_trailing-icon-color: var(--md-input-chip-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_container-shape-start-start: var( --md-input-chip-container-shape-start-start, var(--_container-shape) );--_container-shape-start-end: var( --md-input-chip-container-shape-start-end, var(--_container-shape) );--_container-shape-end-end: var( --md-input-chip-container-shape-end-end, var(--_container-shape) );--_container-shape-end-start: var( --md-input-chip-container-shape-end-start, var(--_container-shape) )}.avatar .primary.action{padding-inline-start:4px}.avatar .leading.icon ::slotted(:first-child){border-radius:var(--_avatar-shape);height:var(--_avatar-size);width:var(--_avatar-size)}.disabled.avatar .leading.icon{opacity:var(--_disabled-avatar-opacity)}/*# sourceMappingURL=input-styles.css.map */\n`;\n "]}
+{"version":3,"file":"input-styles.css.js","sourceRoot":"","sources":["input-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-input-chip-container-height, 32px);--_container-shape: var(--md-input-chip-container-shape, 8px);--_disabled-label-text-color: var(--md-input-chip-disabled-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-label-text-opacity: var(--md-input-chip-disabled-label-text-opacity, 0.38);--_disabled-selected-container-color: var(--md-input-chip-disabled-selected-container-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-selected-container-opacity: var(--md-input-chip-disabled-selected-container-opacity, 0.12);--_label-text-font: var(--md-input-chip-label-text-font, var(--md-sys-typescale-label-large-font, var(--md-ref-typeface-plain, Roboto)));--_label-text-line-height: var(--md-input-chip-label-text-line-height, var(--md-sys-typescale-label-large-line-height, 1.25rem));--_label-text-size: var(--md-input-chip-label-text-size, var(--md-sys-typescale-label-large-size, 0.875rem));--_label-text-weight: var(--md-input-chip-label-text-weight, var(--md-sys-typescale-label-large-weight, var(--md-ref-typeface-weight-medium, 500)));--_selected-container-color: var(--md-input-chip-selected-container-color, var(--md-sys-color-secondary-container, #e8def8));--_selected-focus-label-text-color: var(--md-input-chip-selected-focus-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-hover-label-text-color: var(--md-input-chip-selected-hover-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-hover-state-layer-color: var(--md-input-chip-selected-hover-state-layer-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-hover-state-layer-opacity: var(--md-input-chip-selected-hover-state-layer-opacity, 0.08);--_selected-label-text-color: var(--md-input-chip-selected-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-outline-width: var(--md-input-chip-selected-outline-width, 0px);--_selected-pressed-label-text-color: var(--md-input-chip-selected-pressed-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-pressed-state-layer-color: var(--md-input-chip-selected-pressed-state-layer-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-pressed-state-layer-opacity: var(--md-input-chip-selected-pressed-state-layer-opacity, 0.12);--_disabled-outline-color: var(--md-input-chip-disabled-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-outline-opacity: var(--md-input-chip-disabled-outline-opacity, 0.12);--_focus-label-text-color: var(--md-input-chip-focus-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_focus-outline-color: var(--md-input-chip-focus-outline-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-label-text-color: var(--md-input-chip-hover-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-state-layer-color: var(--md-input-chip-hover-state-layer-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-state-layer-opacity: var(--md-input-chip-hover-state-layer-opacity, 0.08);--_label-text-color: var(--md-input-chip-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_outline-color: var(--md-input-chip-outline-color, var(--md-sys-color-outline, #79747e));--_outline-width: var(--md-input-chip-outline-width, 1px);--_pressed-label-text-color: var(--md-input-chip-pressed-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_pressed-state-layer-color: var(--md-input-chip-pressed-state-layer-color, var(--md-sys-color-on-surface-variant, #49454f));--_pressed-state-layer-opacity: var(--md-input-chip-pressed-state-layer-opacity, 0.12);--_avatar-shape: var(--md-input-chip-avatar-shape, 9999px);--_avatar-size: var(--md-input-chip-avatar-size, 24px);--_disabled-avatar-opacity: var(--md-input-chip-disabled-avatar-opacity, 0.38);--_disabled-leading-icon-color: var(--md-input-chip-disabled-leading-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-leading-icon-opacity: var(--md-input-chip-disabled-leading-icon-opacity, 0.38);--_icon-size: var(--md-input-chip-icon-size, 18px);--_selected-focus-leading-icon-color: var(--md-input-chip-selected-focus-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_selected-hover-leading-icon-color: var(--md-input-chip-selected-hover-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_selected-leading-icon-color: var(--md-input-chip-selected-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_selected-pressed-leading-icon-color: var(--md-input-chip-selected-pressed-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_focus-leading-icon-color: var(--md-input-chip-focus-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_hover-leading-icon-color: var(--md-input-chip-hover-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_leading-icon-color: var(--md-input-chip-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_pressed-leading-icon-color: var(--md-input-chip-pressed-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_disabled-trailing-icon-color: var(--md-input-chip-disabled-trailing-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-trailing-icon-opacity: var(--md-input-chip-disabled-trailing-icon-opacity, 0.38);--_selected-focus-trailing-icon-color: var(--md-input-chip-selected-focus-trailing-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-hover-trailing-icon-color: var(--md-input-chip-selected-hover-trailing-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-pressed-trailing-icon-color: var(--md-input-chip-selected-pressed-trailing-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_selected-trailing-icon-color: var(--md-input-chip-selected-trailing-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_focus-trailing-icon-color: var(--md-input-chip-focus-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-trailing-icon-color: var(--md-input-chip-hover-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_pressed-trailing-icon-color: var(--md-input-chip-pressed-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_trailing-icon-color: var(--md-input-chip-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_container-shape-start-start: var( --md-input-chip-container-shape-start-start, var(--_container-shape) );--_container-shape-start-end: var( --md-input-chip-container-shape-start-end, var(--_container-shape) );--_container-shape-end-end: var( --md-input-chip-container-shape-end-end, var(--_container-shape) );--_container-shape-end-start: var( --md-input-chip-container-shape-end-start, var(--_container-shape) )}:host([avatar]){--_container-shape-start-start: var( --md-input-chip-container-shape-start-start, var(--md-input-chip-container-shape, calc(var(--_container-height) / 2)) );--_container-shape-start-end: var( --md-input-chip-container-shape-start-end, var(--md-input-chip-container-shape, calc(var(--_container-height) / 2)) );--_container-shape-end-end: var( --md-input-chip-container-shape-end-end, var(--md-input-chip-container-shape, calc(var(--_container-height) / 2)) );--_container-shape-end-start: var( --md-input-chip-container-shape-end-start, var(--md-input-chip-container-shape, calc(var(--_container-height) / 2)) )}.avatar .primary.action{padding-inline-start:4px}.avatar .leading.icon ::slotted(:first-child){border-radius:var(--_avatar-shape);height:var(--_avatar-size);width:var(--_avatar-size)}.disabled.avatar .leading.icon{opacity:var(--_disabled-avatar-opacity)}@media(forced-colors: active){.link .outline{border-color:ActiveText}.disabled.avatar .leading.icon{opacity:1}}/*# sourceMappingURL=input-styles.css.map */\n`;\n "]}

package/chips/internal/multi-action-chip.d.ts

@@ -3,7 +3,6 @@
  * Copyright 2023 Google LLC
  * SPDX-License-Identifier: Apache-2.0
  */
-import { nothing, TemplateResult } from 'lit';
 import { Chip } from './chip.js';
 /**
  * A chip component with multiple actions.
@@ -17,7 +16,7 @@ export declare abstract class MultiActionChip extends Chip {
     focus(options?: FocusOptions & {
         trailing?: boolean;
     }): void;
-    protected renderActions(): TemplateResult<1>;
-    protected abstract renderTrailingAction(): TemplateResult | typeof nothing;
+    protected renderContainerContent(): import("lit-html").TemplateResult<1>;
+    protected abstract renderTrailingAction(): unknown;
     private handleKeyDown;
 }

package/chips/internal/multi-action-chip.js

@@ -43,10 +43,10 @@ export class MultiActionChip extends Chip {
         }
         super.focus(options);
     }
-    renderActions() {
+    renderContainerContent() {
         return html `
-      ${super.renderActions()}
-      ${this.renderActionCell(this.renderTrailingAction())}
+      ${super.renderContainerContent()}
+      ${this.renderTrailingAction()}
     `;
     }
     handleKeyDown(event) {

package/chips/internal/multi-action-chip.js.map

@@ -1 +1 @@
-{"version":3,"file":"multi-action-chip.js","sourceRoot":"","sources":["multi-action-chip.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAC,IAAI,EAAE,QAAQ,EAA0B,MAAM,KAAK,CAAC;AAI5D,OAAO,EAAC,IAAI,EAAC,MAAM,WAAW,CAAC;AAE/B,MAAM,iBAAiB,GAAG,mBAAmB,CAAC;AAE9C;;GAEG;AACH,MAAM,OAAgB,eAAgB,SAAQ,IAAI;IAChD,IAAI,eAAe;QACjB,IAAI,IAAI,CAAC,YAAY,CAAC,iBAAiB,CAAC,EAAE;YACxC,OAAO,IAAI,CAAC,YAAY,CAAC,iBAAiB,CAAE,CAAC;SAC9C;QAED,MAAM,EAAC,SAAS,EAAC,GAAG,IAAuB,CAAC;QAC5C,OAAO,UAAU,SAAS,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;IAC7C,CAAC;IACD,IAAI,eAAe,CAAC,SAAsB;QACxC,MAAM,IAAI,GAAG,IAAI,CAAC,eAAe,CAAC;QAClC,IAAI,SAAS,KAAK,IAAI,EAAE;YACtB,OAAO;SACR;QAED,IAAI,SAAS,KAAK,IAAI,EAAE;YACtB,IAAI,CAAC,eAAe,CAAC,iBAAiB,CAAC,CAAC;SACzC;aAAM;YACL,IAAI,CAAC,YAAY,CAAC,iBAAiB,EAAE,SAAS,CAAC,CAAC;SACjD;QAED,IAAI,CAAC,aAAa,EAAE,CAAC;IACvB,CAAC;IAKD;QACE,KAAK,EAAE,CAAC;QACR,IAAI,CAAC,QAAQ,EAAE;YACb,IAAI,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;SACjE;IACH,CAAC;IAEQ,KAAK,CAAC,OAA2C;QACxD,IAAI,OAAO,EAAE,QAAQ,IAAI,IAAI,CAAC,cAAc,EAAE;YAC5C,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;YACnC,OAAO;SACR;QAED,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;IACvB,CAAC;IAEkB,aAAa;QAC9B,OAAO,IAAI,CAAA;QACP,KAAK,CAAC,aAAa,EAAE;QACrB,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,oBAAoB,EAAE,CAAC;KACrD,CAAC;IACJ,CAAC;IAIO,aAAa,CAAC,KAAoB;QACxC,MAAM,MAAM,GAAG,KAAK,CAAC,GAAG,KAAK,WAAW,CAAC;QACzC,MAAM,OAAO,GAAG,KAAK,CAAC,GAAG,KAAK,YAAY,CAAC;QAC3C,8BAA8B;QAC9B,IAAI,CAAC,MAAM,IAAI,CAAC,OAAO,EAAE;YACvB,OAAO;SACR;QAED,IAAI,CAAC,IAAI,CAAC,aAAa,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE;YAC/C,kCAAkC;YAClC,OAAO;SACR;QAED,wCAAwC;QACxC,MAAM,KAAK,GAAG,gBAAgB,CAAC,IAAI,CAAC,CAAC,SAAS,KAAK,KAAK,CAAC;QACzD,MAAM,QAAQ,GAAG,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC;QAC1C,MAAM,gBAAgB,GAAG,IAAI,CAAC,aAAa,EAAE,OAAO,CAAC,eAAe,CAAC,CAAC;QACtE,MAAM,iBAAiB,GAAG,IAAI,CAAC,cAAc,EAAE,OAAO,CAAC,eAAe,CAAC,CAAC;QAExE,IAAI,CAAC,QAAQ,IAAI,iBAAiB,CAAC,IAAI,CAAC,CAAC,QAAQ,IAAI,gBAAgB,CAAC,EAAE;YACtE,kEAAkE;YAClE,OAAO;SACR;QAED,mDAAmD;QACnD,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,uDAAuD;QACvD,KAAK,CAAC,eAAe,EAAE,CAAC;QACxB,MAAM,aAAa,GAAG,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,IAAI,CAAC,aAAa,CAAC;QAC1E,aAAa,CAAC,KAAK,EAAE,CAAC;IACxB,CAAC;CACF","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {html, isServer, nothing, TemplateResult} from 'lit';\n\nimport {ARIAMixinStrict} from '../../internal/aria/aria.js';\n\nimport {Chip} from './chip.js';\n\nconst ARIA_LABEL_REMOVE = 'aria-label-remove';\n\n/**\n * A chip component with multiple actions.\n */\nexport abstract class MultiActionChip extends Chip {\n  get ariaLabelRemove(): string {\n    if (this.hasAttribute(ARIA_LABEL_REMOVE)) {\n      return this.getAttribute(ARIA_LABEL_REMOVE)!;\n    }\n\n    const {ariaLabel} = this as ARIAMixinStrict;\n    return `Remove ${ariaLabel || this.label}`;\n  }\n  set ariaLabelRemove(ariaLabel: string|null) {\n    const prev = this.ariaLabelRemove;\n    if (ariaLabel === prev) {\n      return;\n    }\n\n    if (ariaLabel === null) {\n      this.removeAttribute(ARIA_LABEL_REMOVE);\n    } else {\n      this.setAttribute(ARIA_LABEL_REMOVE, ariaLabel);\n    }\n\n    this.requestUpdate();\n  }\n\n  protected abstract readonly primaryAction: HTMLElement|null;\n  protected abstract readonly trailingAction: HTMLElement|null;\n\n  constructor() {\n    super();\n    if (!isServer) {\n      this.addEventListener('keydown', this.handleKeyDown.bind(this));\n    }\n  }\n\n  override focus(options?: FocusOptions&{trailing?: boolean}) {\n    if (options?.trailing && this.trailingAction) {\n      this.trailingAction.focus(options);\n      return;\n    }\n\n    super.focus(options);\n  }\n\n  protected override renderActions() {\n    return html`\n      ${super.renderActions()}\n      ${this.renderActionCell(this.renderTrailingAction())}\n    `;\n  }\n\n  protected abstract renderTrailingAction(): TemplateResult|typeof nothing;\n\n  private handleKeyDown(event: KeyboardEvent) {\n    const isLeft = event.key === 'ArrowLeft';\n    const isRight = event.key === 'ArrowRight';\n    // Ignore non-navigation keys.\n    if (!isLeft && !isRight) {\n      return;\n    }\n\n    if (!this.primaryAction || !this.trailingAction) {\n      // Does not have multiple actions.\n      return;\n    }\n\n    // Check if moving forwards or backwards\n    const isRtl = getComputedStyle(this).direction === 'rtl';\n    const forwards = isRtl ? isLeft : isRight;\n    const isPrimaryFocused = this.primaryAction?.matches(':focus-within');\n    const isTrailingFocused = this.trailingAction?.matches(':focus-within');\n\n    if ((forwards && isTrailingFocused) || (!forwards && isPrimaryFocused)) {\n      // Moving outside of the chip, it will be handled by the chip set.\n      return;\n    }\n\n    // Prevent default interactions, such as scrolling.\n    event.preventDefault();\n    // Don't let the chip set handle this navigation event.\n    event.stopPropagation();\n    const actionToFocus = forwards ? this.trailingAction : this.primaryAction;\n    actionToFocus.focus();\n  }\n}\n"]}
+{"version":3,"file":"multi-action-chip.js","sourceRoot":"","sources":["multi-action-chip.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAC,IAAI,EAAE,QAAQ,EAAC,MAAM,KAAK,CAAC;AAInC,OAAO,EAAC,IAAI,EAAC,MAAM,WAAW,CAAC;AAE/B,MAAM,iBAAiB,GAAG,mBAAmB,CAAC;AAE9C;;GAEG;AACH,MAAM,OAAgB,eAAgB,SAAQ,IAAI;IAChD,IAAI,eAAe;QACjB,IAAI,IAAI,CAAC,YAAY,CAAC,iBAAiB,CAAC,EAAE;YACxC,OAAO,IAAI,CAAC,YAAY,CAAC,iBAAiB,CAAE,CAAC;SAC9C;QAED,MAAM,EAAC,SAAS,EAAC,GAAG,IAAuB,CAAC;QAC5C,OAAO,UAAU,SAAS,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;IAC7C,CAAC;IACD,IAAI,eAAe,CAAC,SAAsB;QACxC,MAAM,IAAI,GAAG,IAAI,CAAC,eAAe,CAAC;QAClC,IAAI,SAAS,KAAK,IAAI,EAAE;YACtB,OAAO;SACR;QAED,IAAI,SAAS,KAAK,IAAI,EAAE;YACtB,IAAI,CAAC,eAAe,CAAC,iBAAiB,CAAC,CAAC;SACzC;aAAM;YACL,IAAI,CAAC,YAAY,CAAC,iBAAiB,EAAE,SAAS,CAAC,CAAC;SACjD;QAED,IAAI,CAAC,aAAa,EAAE,CAAC;IACvB,CAAC;IAKD;QACE,KAAK,EAAE,CAAC;QACR,IAAI,CAAC,QAAQ,EAAE;YACb,IAAI,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;SACjE;IACH,CAAC;IAEQ,KAAK,CAAC,OAA2C;QACxD,IAAI,OAAO,EAAE,QAAQ,IAAI,IAAI,CAAC,cAAc,EAAE;YAC5C,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;YACnC,OAAO;SACR;QAED,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;IACvB,CAAC;IAEkB,sBAAsB;QACvC,OAAO,IAAI,CAAA;QACP,KAAK,CAAC,sBAAsB,EAAE;QAC9B,IAAI,CAAC,oBAAoB,EAAE;KAC9B,CAAC;IACJ,CAAC;IAIO,aAAa,CAAC,KAAoB;QACxC,MAAM,MAAM,GAAG,KAAK,CAAC,GAAG,KAAK,WAAW,CAAC;QACzC,MAAM,OAAO,GAAG,KAAK,CAAC,GAAG,KAAK,YAAY,CAAC;QAC3C,8BAA8B;QAC9B,IAAI,CAAC,MAAM,IAAI,CAAC,OAAO,EAAE;YACvB,OAAO;SACR;QAED,IAAI,CAAC,IAAI,CAAC,aAAa,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE;YAC/C,kCAAkC;YAClC,OAAO;SACR;QAED,wCAAwC;QACxC,MAAM,KAAK,GAAG,gBAAgB,CAAC,IAAI,CAAC,CAAC,SAAS,KAAK,KAAK,CAAC;QACzD,MAAM,QAAQ,GAAG,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC;QAC1C,MAAM,gBAAgB,GAAG,IAAI,CAAC,aAAa,EAAE,OAAO,CAAC,eAAe,CAAC,CAAC;QACtE,MAAM,iBAAiB,GAAG,IAAI,CAAC,cAAc,EAAE,OAAO,CAAC,eAAe,CAAC,CAAC;QAExE,IAAI,CAAC,QAAQ,IAAI,iBAAiB,CAAC,IAAI,CAAC,CAAC,QAAQ,IAAI,gBAAgB,CAAC,EAAE;YACtE,kEAAkE;YAClE,OAAO;SACR;QAED,mDAAmD;QACnD,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,uDAAuD;QACvD,KAAK,CAAC,eAAe,EAAE,CAAC;QACxB,MAAM,aAAa,GAAG,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,IAAI,CAAC,aAAa,CAAC;QAC1E,aAAa,CAAC,KAAK,EAAE,CAAC;IACxB,CAAC;CACF","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {html, isServer} from 'lit';\n\nimport {ARIAMixinStrict} from '../../internal/aria/aria.js';\n\nimport {Chip} from './chip.js';\n\nconst ARIA_LABEL_REMOVE = 'aria-label-remove';\n\n/**\n * A chip component with multiple actions.\n */\nexport abstract class MultiActionChip extends Chip {\n  get ariaLabelRemove(): string {\n    if (this.hasAttribute(ARIA_LABEL_REMOVE)) {\n      return this.getAttribute(ARIA_LABEL_REMOVE)!;\n    }\n\n    const {ariaLabel} = this as ARIAMixinStrict;\n    return `Remove ${ariaLabel || this.label}`;\n  }\n  set ariaLabelRemove(ariaLabel: string|null) {\n    const prev = this.ariaLabelRemove;\n    if (ariaLabel === prev) {\n      return;\n    }\n\n    if (ariaLabel === null) {\n      this.removeAttribute(ARIA_LABEL_REMOVE);\n    } else {\n      this.setAttribute(ARIA_LABEL_REMOVE, ariaLabel);\n    }\n\n    this.requestUpdate();\n  }\n\n  protected abstract readonly primaryAction: HTMLElement|null;\n  protected abstract readonly trailingAction: HTMLElement|null;\n\n  constructor() {\n    super();\n    if (!isServer) {\n      this.addEventListener('keydown', this.handleKeyDown.bind(this));\n    }\n  }\n\n  override focus(options?: FocusOptions&{trailing?: boolean}) {\n    if (options?.trailing && this.trailingAction) {\n      this.trailingAction.focus(options);\n      return;\n    }\n\n    super.focus(options);\n  }\n\n  protected override renderContainerContent() {\n    return html`\n      ${super.renderContainerContent()}\n      ${this.renderTrailingAction()}\n    `;\n  }\n\n  protected abstract renderTrailingAction(): unknown;\n\n  private handleKeyDown(event: KeyboardEvent) {\n    const isLeft = event.key === 'ArrowLeft';\n    const isRight = event.key === 'ArrowRight';\n    // Ignore non-navigation keys.\n    if (!isLeft && !isRight) {\n      return;\n    }\n\n    if (!this.primaryAction || !this.trailingAction) {\n      // Does not have multiple actions.\n      return;\n    }\n\n    // Check if moving forwards or backwards\n    const isRtl = getComputedStyle(this).direction === 'rtl';\n    const forwards = isRtl ? isLeft : isRight;\n    const isPrimaryFocused = this.primaryAction?.matches(':focus-within');\n    const isTrailingFocused = this.trailingAction?.matches(':focus-within');\n\n    if ((forwards && isTrailingFocused) || (!forwards && isPrimaryFocused)) {\n      // Moving outside of the chip, it will be handled by the chip set.\n      return;\n    }\n\n    // Prevent default interactions, such as scrolling.\n    event.preventDefault();\n    // Don't let the chip set handle this navigation event.\n    event.stopPropagation();\n    const actionToFocus = forwards ? this.trailingAction : this.primaryAction;\n    actionToFocus.focus();\n  }\n}\n"]}

package/chips/internal/selectable-styles.css.js

@@ -4,6 +4,6 @@
   * SPDX-License-Identifier: Apache-2.0
   */
 import { css } from 'lit';
-export const styles = css `.selected{--md-ripple-hover-color: var(--_selected-hover-state-layer-color);--md-ripple-hover-opacity: var(--_selected-hover-state-layer-opacity);--md-ripple-pressed-color: var(--_selected-pressed-state-layer-color);--md-ripple-pressed-opacity: var(--_selected-pressed-state-layer-opacity)}.selected::before{background:var(--_selected-container-color)}.selected .outline{border-width:var(--_selected-outline-width)}.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 .leading.icon{color:var(--_selected-leading-icon-color)}.selected:hover .leading.icon{color:var(--_selected-hover-leading-icon-color)}.selected:focus .leading.icon{color:var(--_selected-focus-leading-icon-color)}.selected:active .leading.icon{color:var(--_selected-pressed-leading-icon-color)}@media(forced-colors: active){.selected:not(.elevated)::before{border:1px solid rgba(0,0,0,0)}}/*# sourceMappingURL=selectable-styles.css.map */
+export const styles = css `.selected{--md-ripple-hover-color: var(--_selected-hover-state-layer-color);--md-ripple-hover-opacity: var(--_selected-hover-state-layer-opacity);--md-ripple-pressed-color: var(--_selected-pressed-state-layer-color);--md-ripple-pressed-opacity: var(--_selected-pressed-state-layer-opacity)}:where(.selected)::before{background:var(--_selected-container-color)}:where(.selected) .outline{border-width:var(--_selected-outline-width)}:where(.selected.disabled)::before{background:var(--_disabled-selected-container-color);opacity:var(--_disabled-selected-container-opacity)}:where(.selected) .label{color:var(--_selected-label-text-color)}:where(.selected:hover) .label{color:var(--_selected-hover-label-text-color)}:where(.selected:focus) .label{color:var(--_selected-focus-label-text-color)}:where(.selected:active) .label{color:var(--_selected-pressed-label-text-color)}:where(.selected) .leading.icon{color:var(--_selected-leading-icon-color)}:where(.selected:hover) .leading.icon{color:var(--_selected-hover-leading-icon-color)}:where(.selected:focus) .leading.icon{color:var(--_selected-focus-leading-icon-color)}:where(.selected:active) .leading.icon{color:var(--_selected-pressed-leading-icon-color)}@media(forced-colors: active){:where(.selected:not(.elevated))::before{border:1px solid CanvasText}:where(.selected) .outline{border-width:1px}}/*# sourceMappingURL=selectable-styles.css.map */
 `;
 //# sourceMappingURL=selectable-styles.css.js.map

package/chips/internal/selectable-styles.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"selectable-styles.css.js","sourceRoot":"","sources":["selectable-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`.selected{--md-ripple-hover-color: var(--_selected-hover-state-layer-color);--md-ripple-hover-opacity: var(--_selected-hover-state-layer-opacity);--md-ripple-pressed-color: var(--_selected-pressed-state-layer-color);--md-ripple-pressed-opacity: var(--_selected-pressed-state-layer-opacity)}.selected::before{background:var(--_selected-container-color)}.selected .outline{border-width:var(--_selected-outline-width)}.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 .leading.icon{color:var(--_selected-leading-icon-color)}.selected:hover .leading.icon{color:var(--_selected-hover-leading-icon-color)}.selected:focus .leading.icon{color:var(--_selected-focus-leading-icon-color)}.selected:active .leading.icon{color:var(--_selected-pressed-leading-icon-color)}@media(forced-colors: active){.selected:not(.elevated)::before{border:1px solid rgba(0,0,0,0)}}/*# sourceMappingURL=selectable-styles.css.map */\n`;\n "]}
+{"version":3,"file":"selectable-styles.css.js","sourceRoot":"","sources":["selectable-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`.selected{--md-ripple-hover-color: var(--_selected-hover-state-layer-color);--md-ripple-hover-opacity: var(--_selected-hover-state-layer-opacity);--md-ripple-pressed-color: var(--_selected-pressed-state-layer-color);--md-ripple-pressed-opacity: var(--_selected-pressed-state-layer-opacity)}:where(.selected)::before{background:var(--_selected-container-color)}:where(.selected) .outline{border-width:var(--_selected-outline-width)}:where(.selected.disabled)::before{background:var(--_disabled-selected-container-color);opacity:var(--_disabled-selected-container-opacity)}:where(.selected) .label{color:var(--_selected-label-text-color)}:where(.selected:hover) .label{color:var(--_selected-hover-label-text-color)}:where(.selected:focus) .label{color:var(--_selected-focus-label-text-color)}:where(.selected:active) .label{color:var(--_selected-pressed-label-text-color)}:where(.selected) .leading.icon{color:var(--_selected-leading-icon-color)}:where(.selected:hover) .leading.icon{color:var(--_selected-hover-leading-icon-color)}:where(.selected:focus) .leading.icon{color:var(--_selected-focus-leading-icon-color)}:where(.selected:active) .leading.icon{color:var(--_selected-pressed-leading-icon-color)}@media(forced-colors: active){:where(.selected:not(.elevated))::before{border:1px solid CanvasText}:where(.selected) .outline{border-width:1px}}/*# sourceMappingURL=selectable-styles.css.map */\n`;\n "]}

package/chips/internal/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-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)}:host([touch-target=wrapper]){margin:max(0px,(48px - var(--_container-height))/2) 0}md-focus-ring{--md-focus-ring-shape-start-start: var(--_container-shape-start-start);--md-focus-ring-shape-start-end: var(--_container-shape-start-end);--md-focus-ring-shape-end-end: var(--_container-shape-end-end);--md-focus-ring-shape-end-start: var(--_container-shape-end-start)}.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}.cell{display:flex}.action{align-items:baseline;appearance:none;background:none;border:none;border-radius:inherit;display:flex;gap:8px;outline:none;padding:0;position:relative;text-decoration:none}.primary.action{padding-inline-start:8px;padding-inline-end:16px}.touch{height:48px;inset:50% 0 0;position:absolute;transform:translateY(-50%);width:100%}:host([touch-target=none]) .touch{display:none}.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,.touch{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;display:flex;fill:currentColor;position:relative}.icon ::slotted(:first-child){font-size:var(--_icon-size);height:var(--_icon-size);width:var(--_icon-size)}.leading.icon{color:var(--_leading-icon-color)}:hover .leading.icon{color:var(--_hover-leading-icon-color)}:focus .leading.icon{color:var(--_focus-leading-icon-color)}:active .leading.icon{color:var(--_pressed-leading-icon-color)}.disabled .leading.icon{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);cursor:pointer;--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)}:host([touch-target=wrapper]){margin:max(0px,(48px - var(--_container-height))/2) 0}md-focus-ring{--md-focus-ring-shape-start-start: var(--_container-shape-start-start);--md-focus-ring-shape-start-end: var(--_container-shape-start-end);--md-focus-ring-shape-end-end: var(--_container-shape-end-end);--md-focus-ring-shape-end-start: var(--_container-shape-end-start)}.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}.cell{display:flex}.action{align-items:baseline;appearance:none;background:none;border:none;border-radius:inherit;display:flex;gap:8px;outline:none;padding:0;position:relative;text-decoration:none}.primary.action{padding-inline-start:8px;padding-inline-end:16px}.touch{height:48px;inset:50% 0 0;position:absolute;transform:translateY(-50%);width:100%}:host([touch-target=none]) .touch{display:none}.outline{border:var(--_outline-width) solid var(--_outline-color);border-radius:inherit;inset:0;pointer-events:none;position:absolute}:where(:focus) .outline{border-color:var(--_focus-outline-color)}:where(.disabled) .outline{border-color:var(--_disabled-outline-color);opacity:var(--_disabled-outline-opacity)}md-ripple{border-radius:inherit}.label,.icon,.touch{z-index:1}.label{align-items:center;color:var(--_label-text-color);display:flex;font-family:var(--_label-text-font);font-size:var(--_label-text-size);line-height:var(--_label-text-line-height);font-weight:var(--_label-text-weight);height:100%;text-overflow:ellipsis;user-select:none;white-space:nowrap}:where(:hover) .label{color:var(--_hover-label-text-color)}:where(:focus) .label{color:var(--_focus-label-text-color)}:where(:active) .label{color:var(--_pressed-label-text-color)}:where(.disabled) .label{color:var(--_disabled-label-text-color);opacity:var(--_disabled-label-text-opacity)}.icon{align-self:center;display:flex;fill:currentColor;position:relative}.icon ::slotted(:first-child){font-size:var(--_icon-size);height:var(--_icon-size);width:var(--_icon-size)}.leading.icon{color:var(--_leading-icon-color)}:where(:hover) .leading.icon{color:var(--_hover-leading-icon-color)}:where(:focus) .leading.icon{color:var(--_focus-leading-icon-color)}:where(:active) .leading.icon{color:var(--_pressed-leading-icon-color)}:where(.disabled) .leading.icon{color:var(--_disabled-leading-icon-color);opacity:var(--_disabled-leading-icon-opacity)}@media(forced-colors: active){:where(.disabled) :is(.label,.outline,.leading.icon){color:GrayText;opacity:1}}a,button:not(:disabled){cursor:inherit}/*# sourceMappingURL=shared-styles.css.map */
 `;
 //# sourceMappingURL=shared-styles.css.js.map

package/chips/internal/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-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)}:host([touch-target=wrapper]){margin:max(0px,(48px - var(--_container-height))/2) 0}md-focus-ring{--md-focus-ring-shape-start-start: var(--_container-shape-start-start);--md-focus-ring-shape-start-end: var(--_container-shape-start-end);--md-focus-ring-shape-end-end: var(--_container-shape-end-end);--md-focus-ring-shape-end-start: var(--_container-shape-end-start)}.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}.cell{display:flex}.action{align-items:baseline;appearance:none;background:none;border:none;border-radius:inherit;display:flex;gap:8px;outline:none;padding:0;position:relative;text-decoration:none}.primary.action{padding-inline-start:8px;padding-inline-end:16px}.touch{height:48px;inset:50% 0 0;position:absolute;transform:translateY(-50%);width:100%}:host([touch-target=none]) .touch{display:none}.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,.touch{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;display:flex;fill:currentColor;position:relative}.icon ::slotted(:first-child){font-size:var(--_icon-size);height:var(--_icon-size);width:var(--_icon-size)}.leading.icon{color:var(--_leading-icon-color)}:hover .leading.icon{color:var(--_hover-leading-icon-color)}:focus .leading.icon{color:var(--_focus-leading-icon-color)}:active .leading.icon{color:var(--_pressed-leading-icon-color)}.disabled .leading.icon{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);cursor:pointer;--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)}:host([touch-target=wrapper]){margin:max(0px,(48px - var(--_container-height))/2) 0}md-focus-ring{--md-focus-ring-shape-start-start: var(--_container-shape-start-start);--md-focus-ring-shape-start-end: var(--_container-shape-start-end);--md-focus-ring-shape-end-end: var(--_container-shape-end-end);--md-focus-ring-shape-end-start: var(--_container-shape-end-start)}.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}.cell{display:flex}.action{align-items:baseline;appearance:none;background:none;border:none;border-radius:inherit;display:flex;gap:8px;outline:none;padding:0;position:relative;text-decoration:none}.primary.action{padding-inline-start:8px;padding-inline-end:16px}.touch{height:48px;inset:50% 0 0;position:absolute;transform:translateY(-50%);width:100%}:host([touch-target=none]) .touch{display:none}.outline{border:var(--_outline-width) solid var(--_outline-color);border-radius:inherit;inset:0;pointer-events:none;position:absolute}:where(:focus) .outline{border-color:var(--_focus-outline-color)}:where(.disabled) .outline{border-color:var(--_disabled-outline-color);opacity:var(--_disabled-outline-opacity)}md-ripple{border-radius:inherit}.label,.icon,.touch{z-index:1}.label{align-items:center;color:var(--_label-text-color);display:flex;font-family:var(--_label-text-font);font-size:var(--_label-text-size);line-height:var(--_label-text-line-height);font-weight:var(--_label-text-weight);height:100%;text-overflow:ellipsis;user-select:none;white-space:nowrap}:where(:hover) .label{color:var(--_hover-label-text-color)}:where(:focus) .label{color:var(--_focus-label-text-color)}:where(:active) .label{color:var(--_pressed-label-text-color)}:where(.disabled) .label{color:var(--_disabled-label-text-color);opacity:var(--_disabled-label-text-opacity)}.icon{align-self:center;display:flex;fill:currentColor;position:relative}.icon ::slotted(:first-child){font-size:var(--_icon-size);height:var(--_icon-size);width:var(--_icon-size)}.leading.icon{color:var(--_leading-icon-color)}:where(:hover) .leading.icon{color:var(--_hover-leading-icon-color)}:where(:focus) .leading.icon{color:var(--_focus-leading-icon-color)}:where(:active) .leading.icon{color:var(--_pressed-leading-icon-color)}:where(.disabled) .leading.icon{color:var(--_disabled-leading-icon-color);opacity:var(--_disabled-leading-icon-opacity)}@media(forced-colors: active){:where(.disabled) :is(.label,.outline,.leading.icon){color:GrayText;opacity:1}}a,button:not(:disabled){cursor:inherit}/*# sourceMappingURL=shared-styles.css.map */\n`;\n "]}