@material/web 1.0.0 → 1.0.2-nightly.6a1fb38.0

package/chips/internal/chip.js.map

@@ -1 +1 @@
-{"version":3,"file":"chip.js","sourceRoot":"","sources":["chip.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,8BAA8B,CAAC;AACtC,OAAO,wBAAwB,CAAC;AAEhC,OAAO,EAAC,IAAI,EAAE,UAAU,EAAiC,MAAM,KAAK,CAAC;AACrE,OAAO,EAAC,QAAQ,EAAC,MAAM,mBAAmB,CAAC;AAC3C,OAAO,EAAY,QAAQ,EAAC,MAAM,6BAA6B,CAAC;AAEhE,OAAO,EAAC,yBAAyB,EAAC,MAAM,iCAAiC,CAAC;AAE1E;;GAEG;AACH,MAAM,OAAgB,IAAK,SAAQ,UAAU;IAA7C;;QAWE;;;;WAIG;QACwB,aAAQ,GAAG,KAAK,CAAC;QAE5C;;;;;;WAMG;QAEH,oBAAe,GAAG,KAAK,CAAC;QAExB;;WAEG;QACS,UAAK,GAAG,EAAE,CAAC;IAyEzB,CAAC;IAlEC;;;OAGG;IACH,IAAc,cAAc;QAC1B,OAAO,IAAI,CAAC,QAAQ,CAAC;IACvB,CAAC;IAEQ,KAAK,CAAC,OAAsB;QACnC,IAAI,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,eAAe,EAAE;YAC1C,OAAO;SACR;QAED,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;IACvB,CAAC;IAEkB,MAAM;QACvB,OAAO,IAAI,CAAA;8BACe,QAAQ,CAAC,IAAI,CAAC,mBAAmB,EAAE,CAAC;UACxD,IAAI,CAAC,sBAAsB,EAAE;;KAElC,CAAC;IACJ,CAAC;IAEkB,OAAO,CAAC,OAA6B;QACtD,IAAI,OAAO,CAAC,GAAG,CAAC,UAAU,CAAC,IAAI,OAAO,CAAC,GAAG,CAAC,UAAU,CAAC,KAAK,SAAS,EAAE;YACpE,IAAI,CAAC,aAAa,CAAC,IAAI,KAAK,CAAC,cAAc,EAAE,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC,CAAC,CAAC;SAChE;IACH,CAAC;IAES,mBAAmB;QAC3B,OAAO;YACL,UAAU,EAAE,IAAI,CAAC,QAAQ;SAC1B,CAAC;IACJ,CAAC;IAES,sBAAsB;QAC9B,OAAO,IAAI,CAAA;QACP,IAAI,CAAC,aAAa,EAAE;;gBAEZ,IAAI,CAAC,SAAS;uBACP,IAAI,CAAC,SAAS;sBACf,IAAI,CAAC,cAAc;QACjC,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,oBAAoB,EAAE,CAAC;KACxD,CAAC;IACJ,CAAC;IAES,aAAa;QACrB,OAAO,IAAI,CAAA,+BAA+B,CAAC;IAC7C,CAAC;IAES,iBAAiB;QACzB,OAAO,IAAI,CAAA,2BAA2B,CAAC;IACzC,CAAC;IAIO,oBAAoB;QAC1B,OAAO,IAAI,CAAA;;UAEL,IAAI,CAAC,iBAAiB,EAAE;;4BAEN,IAAI,CAAC,KAAK;;KAEjC,CAAC;IACJ,CAAC;;AAtGD;IACE,yBAAyB,CAAC,IAAI,CAAC,CAAC;AAClC,CAAC,GAAA,CAAA;AAED,kBAAkB;AACF,sBAAiB,GAAG;IAClC,GAAG,UAAU,CAAC,iBAAiB;IAC/B,cAAc,EAAE,IAAI;CACrB,AAHgC,CAG/B;AAOyB;IAA1B,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAC,CAAC;sCAAkB;AAU5C;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,kBAAkB,EAAC,CAAC;6CACjC;AAKZ;IAAX,QAAQ,EAAE;mCAAY","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport '../../focus/md-focus-ring.js';\nimport '../../ripple/ripple.js';\n\nimport {html, LitElement, PropertyValues, TemplateResult} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport {ClassInfo, classMap} from 'lit/directives/class-map.js';\n\nimport {requestUpdateOnAriaChange} from '../../internal/aria/delegate.js';\n\n/**\n * A chip component.\n */\nexport abstract class Chip extends LitElement {\n  static {\n    requestUpdateOnAriaChange(Chip);\n  }\n\n  /** @nocollapse */\n  static override shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true\n  };\n\n  /**\n   * Whether or not the chip is disabled.\n   *\n   * Disabled chips are not focusable, unless `always-focusable` is set.\n   */\n  @property({type: Boolean}) disabled = false;\n\n  /**\n   * When true, allow disabled chips to be focused with arrow keys.\n   *\n   * Add this when a chip needs increased visibility when disabled. See\n   * https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_disabled_controls\n   * for more guidance on when this is needed.\n   */\n  @property({type: Boolean, attribute: 'always-focusable'})\n  alwaysFocusable = false;\n\n  /**\n   * The label of the chip.\n   */\n  @property() label = '';\n\n  /**\n   * The `id` of the action the primary focus ring and ripple are for.\n   */\n  protected abstract readonly primaryId: string;\n\n  /**\n   * Whether or not the primary ripple is disabled (defaults to `disabled`).\n   * Some chip actions such as links cannot be disabled.\n   */\n  protected get rippleDisabled() {\n    return this.disabled;\n  }\n\n  override focus(options?: FocusOptions) {\n    if (this.disabled && !this.alwaysFocusable) {\n      return;\n    }\n\n    super.focus(options);\n  }\n\n  protected override render() {\n    return html`\n      <div class=\"container ${classMap(this.getContainerClasses())}\">\n        ${this.renderContainerContent()}\n      </div>\n    `;\n  }\n\n  protected override updated(changed: PropertyValues<Chip>) {\n    if (changed.has('disabled') && changed.get('disabled') !== undefined) {\n      this.dispatchEvent(new Event('update-focus', {bubbles: true}));\n    }\n  }\n\n  protected getContainerClasses(): ClassInfo {\n    return {\n      'disabled': this.disabled,\n    };\n  }\n\n  protected renderContainerContent() {\n    return html`\n      ${this.renderOutline()}\n      <md-focus-ring part=\"focus-ring\"\n          for=${this.primaryId}></md-focus-ring>\n      <md-ripple for=${this.primaryId}\n          ?disabled=${this.rippleDisabled}></md-ripple>\n      ${this.renderPrimaryAction(this.renderPrimaryContent())}\n    `;\n  }\n\n  protected renderOutline() {\n    return html`<span class=\"outline\"></span>`;\n  }\n\n  protected renderLeadingIcon(): TemplateResult {\n    return html`<slot name=\"icon\"></slot>`;\n  }\n\n  protected abstract renderPrimaryAction(content: unknown): unknown;\n\n  private renderPrimaryContent() {\n    return html`\n      <span class=\"leading icon\" aria-hidden=\"true\">\n        ${this.renderLeadingIcon()}\n      </span>\n      <span class=\"label\">${this.label}</span>\n      <span class=\"touch\"></span>\n    `;\n  }\n}\n"]}
+{"version":3,"file":"chip.js","sourceRoot":"","sources":["chip.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,8BAA8B,CAAC;AACtC,OAAO,wBAAwB,CAAC;AAEhC,OAAO,EAAC,IAAI,EAAE,UAAU,EAAiC,MAAM,KAAK,CAAC;AACrE,OAAO,EAAC,QAAQ,EAAC,MAAM,mBAAmB,CAAC;AAC3C,OAAO,EAAY,QAAQ,EAAC,MAAM,6BAA6B,CAAC;AAEhE,OAAO,EAAC,yBAAyB,EAAC,MAAM,iCAAiC,CAAC;AAE1E;;;;GAIG;AACH,MAAM,OAAgB,IAAK,SAAQ,UAAU;IAA7C;;QAWE;;;;WAIG;QACwB,aAAQ,GAAG,KAAK,CAAC;QAE5C;;;;;;WAMG;QAEH,oBAAe,GAAG,KAAK,CAAC;QAExB;;WAEG;QACS,UAAK,GAAG,EAAE,CAAC;IA0EzB,CAAC;IAlEC;;;OAGG;IACH,IAAc,cAAc;QAC1B,OAAO,IAAI,CAAC,QAAQ,CAAC;IACvB,CAAC;IAEQ,KAAK,CAAC,OAAsB;QACnC,IAAI,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,eAAe,EAAE;YAC1C,OAAO;SACR;QAED,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;IACvB,CAAC;IAEkB,MAAM;QACvB,OAAO,IAAI,CAAA;8BACe,QAAQ,CAAC,IAAI,CAAC,mBAAmB,EAAE,CAAC;UACxD,IAAI,CAAC,sBAAsB,EAAE;;KAElC,CAAC;IACJ,CAAC;IAEkB,OAAO,CAAC,OAA6B;QACtD,IAAI,OAAO,CAAC,GAAG,CAAC,UAAU,CAAC,IAAI,OAAO,CAAC,GAAG,CAAC,UAAU,CAAC,KAAK,SAAS,EAAE;YACpE,IAAI,CAAC,aAAa,CAAC,IAAI,KAAK,CAAC,cAAc,EAAE,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC,CAAC,CAAC;SAChE;IACH,CAAC;IAES,mBAAmB;QAC3B,OAAO;YACL,UAAU,EAAE,IAAI,CAAC,QAAQ;SAC1B,CAAC;IACJ,CAAC;IAES,sBAAsB;QAC9B,OAAO,IAAI,CAAA;QACP,IAAI,CAAC,aAAa,EAAE;6CACiB,IAAI,CAAC,SAAS;;cAE7C,IAAI,CAAC,SAAS;oBACR,IAAI,CAAC,cAAc;QAC/B,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,oBAAoB,EAAE,CAAC;KACxD,CAAC;IACJ,CAAC;IAES,aAAa;QACrB,OAAO,IAAI,CAAA,+BAA+B,CAAC;IAC7C,CAAC;IAES,iBAAiB;QACzB,OAAO,IAAI,CAAA,2BAA2B,CAAC;IACzC,CAAC;IAIO,oBAAoB;QAC1B,OAAO,IAAI,CAAA;;UAEL,IAAI,CAAC,iBAAiB,EAAE;;4BAEN,IAAI,CAAC,KAAK;;KAEjC,CAAC;IACJ,CAAC;;AAvGD;IACE,yBAAyB,CAAC,IAAI,CAAC,CAAC;AAClC,CAAC,GAAA,CAAA;AAED,kBAAkB;AACF,sBAAiB,GAAG;IAClC,GAAG,UAAU,CAAC,iBAAiB;IAC/B,cAAc,EAAE,IAAI;CACrB,AAHgC,CAG/B;AAOyB;IAA1B,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAC,CAAC;sCAAkB;AAU5C;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,kBAAkB,EAAC,CAAC;6CACjC;AAKZ;IAAX,QAAQ,EAAE;mCAAY","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport '../../focus/md-focus-ring.js';\nimport '../../ripple/ripple.js';\n\nimport {html, LitElement, PropertyValues, TemplateResult} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport {ClassInfo, classMap} from 'lit/directives/class-map.js';\n\nimport {requestUpdateOnAriaChange} from '../../internal/aria/delegate.js';\n\n/**\n * A chip component.\n *\n * @fires update-focus {Event} Dispatched when `disabled` is toggled. --bubbles\n */\nexport abstract class Chip extends LitElement {\n  static {\n    requestUpdateOnAriaChange(Chip);\n  }\n\n  /** @nocollapse */\n  static override shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n\n  /**\n   * Whether or not the chip is disabled.\n   *\n   * Disabled chips are not focusable, unless `always-focusable` is set.\n   */\n  @property({type: Boolean}) disabled = false;\n\n  /**\n   * When true, allow disabled chips to be focused with arrow keys.\n   *\n   * Add this when a chip needs increased visibility when disabled. See\n   * https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_disabled_controls\n   * for more guidance on when this is needed.\n   */\n  @property({type: Boolean, attribute: 'always-focusable'})\n  alwaysFocusable = false;\n\n  /**\n   * The label of the chip.\n   */\n  @property() label = '';\n\n  /**\n   * The `id` of the action the primary focus ring and ripple are for.\n   * TODO(b/310046938): use the same id for both elements\n   */\n  protected abstract readonly primaryId: string;\n\n  /**\n   * Whether or not the primary ripple is disabled (defaults to `disabled`).\n   * Some chip actions such as links cannot be disabled.\n   */\n  protected get rippleDisabled() {\n    return this.disabled;\n  }\n\n  override focus(options?: FocusOptions) {\n    if (this.disabled && !this.alwaysFocusable) {\n      return;\n    }\n\n    super.focus(options);\n  }\n\n  protected override render() {\n    return html`\n      <div class=\"container ${classMap(this.getContainerClasses())}\">\n        ${this.renderContainerContent()}\n      </div>\n    `;\n  }\n\n  protected override updated(changed: PropertyValues<Chip>) {\n    if (changed.has('disabled') && changed.get('disabled') !== undefined) {\n      this.dispatchEvent(new Event('update-focus', {bubbles: true}));\n    }\n  }\n\n  protected getContainerClasses(): ClassInfo {\n    return {\n      'disabled': this.disabled,\n    };\n  }\n\n  protected renderContainerContent() {\n    return html`\n      ${this.renderOutline()}\n      <md-focus-ring part=\"focus-ring\" for=${this.primaryId}></md-focus-ring>\n      <md-ripple\n        for=${this.primaryId}\n        ?disabled=${this.rippleDisabled}></md-ripple>\n      ${this.renderPrimaryAction(this.renderPrimaryContent())}\n    `;\n  }\n\n  protected renderOutline() {\n    return html`<span class=\"outline\"></span>`;\n  }\n\n  protected renderLeadingIcon(): TemplateResult {\n    return html`<slot name=\"icon\"></slot>`;\n  }\n\n  protected abstract renderPrimaryAction(content: unknown): unknown;\n\n  private renderPrimaryContent() {\n    return html`\n      <span class=\"leading icon\" aria-hidden=\"true\">\n        ${this.renderLeadingIcon()}\n      </span>\n      <span class=\"label\">${this.label}</span>\n      <span class=\"touch\"></span>\n    `;\n  }\n}\n"]}

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

@@ -8,6 +8,8 @@ import { nothing } from 'lit';
 import { MultiActionChip } from './multi-action-chip.js';
 /**
  * A filter chip component.
+ *
+ * @fires remove {Event} Dispatched when the remove button is clicked.
  */
 export declare class FilterChip extends MultiActionChip {
     elevated: boolean;

package/chips/internal/filter-chip.js

@@ -12,6 +12,8 @@ import { MultiActionChip } from './multi-action-chip.js';
 import { renderRemoveButton } from './trailing-icons.js';
 /**
  * A filter chip component.
+ *
+ * @fires remove {Event} Dispatched when the remove button is clicked.
  */
 export class FilterChip extends MultiActionChip {
     constructor() {
@@ -34,13 +36,15 @@ export class FilterChip extends MultiActionChip {
     renderPrimaryAction(content) {
         const { ariaLabel } = this;
         return html `
-      <button class="primary action"
+      <button
+        class="primary action"
         id="button"
         aria-label=${ariaLabel || nothing}
         aria-pressed=${this.selected}
         ?disabled=${this.disabled && !this.alwaysFocusable}
         @click=${this.handleClick}
-      >${content}</button>
+        >${content}</button
+      >
     `;
     }
     renderLeadingIcon() {
@@ -49,7 +53,8 @@ export class FilterChip extends MultiActionChip {
         }
         return html `
       <svg class="checkmark" viewBox="0 0 18 18" aria-hidden="true">
-        <path d="M6.75012 12.1274L3.62262 8.99988L2.55762 10.0574L6.75012 14.2499L15.7501 5.24988L14.6926 4.19238L6.75012 12.1274Z" />
+        <path
+          d="M6.75012 12.1274L3.62262 8.99988L2.55762 10.0574L6.75012 14.2499L15.7501 5.24988L14.6926 4.19238L6.75012 12.1274Z" />
       </svg>
     `;
     }
@@ -58,7 +63,7 @@ export class FilterChip extends MultiActionChip {
             return renderRemoveButton({
                 focusListener,
                 ariaLabel: this.ariaLabelRemove,
-                disabled: this.disabled
+                disabled: this.disabled,
             });
         }
         return nothing;
@@ -73,11 +78,12 @@ export class FilterChip extends MultiActionChip {
         if (this.disabled) {
             return;
         }
+        this.selected = !this.selected;
         const preventDefault = !redispatchEvent(this, event);
         if (preventDefault) {
+            this.selected = !this.selected;
             return;
         }
-        this.selected = !this.selected;
     }
 }
 __decorate([

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

@@ -1 +1 @@
-{"version":3,"file":"filter-chip.js","sourceRoot":"","sources":["filter-chip.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,8BAA8B,CAAC;AAEtC,OAAO,EAAC,IAAI,EAAE,OAAO,EAAC,MAAM,KAAK,CAAC;AAClC,OAAO,EAAC,QAAQ,EAAE,KAAK,EAAC,MAAM,mBAAmB,CAAC;AAGlD,OAAO,EAAC,eAAe,EAAC,MAAM,qCAAqC,CAAC;AAEpE,OAAO,EAAC,eAAe,EAAC,MAAM,wBAAwB,CAAC;AACvD,OAAO,EAAC,kBAAkB,EAAC,MAAM,qBAAqB,CAAC;AAEvD;;GAEG;AACH,MAAM,OAAO,UAAW,SAAQ,eAAe;IAA/C;;QAC6B,aAAQ,GAAG,KAAK,CAAC;QACjB,cAAS,GAAG,KAAK,CAAC;QACH,aAAQ,GAAG,KAAK,CAAC;IA4E7D,CAAC;IA1EC,IAAc,SAAS;QACrB,OAAO,QAAQ,CAAC;IAClB,CAAC;IAMkB,mBAAmB;QACpC,OAAO;YACL,GAAG,KAAK,CAAC,mBAAmB,EAAE;YAC9B,QAAQ,EAAE,IAAI,CAAC,QAAQ;YACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ;YACvB,cAAc,EAAE,IAAI,CAAC,SAAS;SAC/B,CAAC;IACJ,CAAC;IAEkB,mBAAmB,CAAC,OAAgB;QACrD,MAAM,EAAC,SAAS,EAAC,GAAG,IAAuB,CAAC;QAC5C,OAAO,IAAI,CAAA;;;qBAGM,SAAS,IAAI,OAAO;uBAClB,IAAI,CAAC,QAAQ;oBAChB,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,eAAe;iBACzC,IAAI,CAAC,WAAW;SACxB,OAAO;KACX,CAAC;IACJ,CAAC;IAEkB,iBAAiB;QAClC,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;YAClB,OAAO,KAAK,CAAC,iBAAiB,EAAE,CAAC;SAClC;QAED,OAAO,IAAI,CAAA;;;;KAIV,CAAC;IACJ,CAAC;IAEkB,oBAAoB,CAAC,aAA4B;QAClE,IAAI,IAAI,CAAC,SAAS,EAAE;YAClB,OAAO,kBAAkB,CAAC;gBACxB,aAAa;gBACb,SAAS,EAAE,IAAI,CAAC,eAAe;gBAC/B,QAAQ,EAAE,IAAI,CAAC,QAAQ;aACxB,CAAC,CAAC;SACJ;QAED,OAAO,OAAO,CAAC;IACjB,CAAC;IAEkB,aAAa;QAC9B,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,OAAO,IAAI,CAAA,+BAA+B,CAAC;SAC5C;QAED,OAAO,KAAK,CAAC,aAAa,EAAE,CAAC;IAC/B,CAAC;IAEO,WAAW,CAAC,KAAiB;QACnC,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,OAAO;SACR;QAED,MAAM,cAAc,GAAG,CAAC,eAAe,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;QACrD,IAAI,cAAc,EAAE;YAClB,OAAO;SACR;QAED,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC;IACjC,CAAC;CACF;AA9E4B;IAA1B,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAC,CAAC;4CAAkB;AACjB;IAA1B,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAC,CAAC;6CAAmB;AACH;IAAzC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;4CAAkB;AAMd;IAA5C,KAAK,CAAC,iBAAiB,CAAC;iDAAqD;AAE3D;IADlB,KAAK,CAAC,kBAAkB,CAAC;kDAC2B","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} 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 'button';\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 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=\"button\"\n        aria-label=${ariaLabel || nothing}\n        aria-pressed=${this.selected}\n        ?disabled=${this.disabled && !this.alwaysFocusable}\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 html`\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(focusListener: EventListener) {\n    if (this.removable) {\n      return renderRemoveButton({\n        focusListener,\n        ariaLabel: this.ariaLabelRemove,\n        disabled: this.disabled\n      });\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":"AAAA;;;;GAIG;;AAEH,OAAO,8BAA8B,CAAC;AAEtC,OAAO,EAAC,IAAI,EAAE,OAAO,EAAC,MAAM,KAAK,CAAC;AAClC,OAAO,EAAC,QAAQ,EAAE,KAAK,EAAC,MAAM,mBAAmB,CAAC;AAGlD,OAAO,EAAC,eAAe,EAAC,MAAM,qCAAqC,CAAC;AAEpE,OAAO,EAAC,eAAe,EAAC,MAAM,wBAAwB,CAAC;AACvD,OAAO,EAAC,kBAAkB,EAAC,MAAM,qBAAqB,CAAC;AAEvD;;;;GAIG;AACH,MAAM,OAAO,UAAW,SAAQ,eAAe;IAA/C;;QAC6B,aAAQ,GAAG,KAAK,CAAC;QACjB,cAAS,GAAG,KAAK,CAAC;QACH,aAAQ,GAAG,KAAK,CAAC;IAiF7D,CAAC;IA/EC,IAAc,SAAS;QACrB,OAAO,QAAQ,CAAC;IAClB,CAAC;IAOkB,mBAAmB;QACpC,OAAO;YACL,GAAG,KAAK,CAAC,mBAAmB,EAAE;YAC9B,QAAQ,EAAE,IAAI,CAAC,QAAQ;YACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ;YACvB,cAAc,EAAE,IAAI,CAAC,SAAS;SAC/B,CAAC;IACJ,CAAC;IAEkB,mBAAmB,CAAC,OAAgB;QACrD,MAAM,EAAC,SAAS,EAAC,GAAG,IAAuB,CAAC;QAC5C,OAAO,IAAI,CAAA;;;;qBAIM,SAAS,IAAI,OAAO;uBAClB,IAAI,CAAC,QAAQ;oBAChB,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,eAAe;iBACzC,IAAI,CAAC,WAAW;WACtB,OAAO;;KAEb,CAAC;IACJ,CAAC;IAEkB,iBAAiB;QAClC,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;YAClB,OAAO,KAAK,CAAC,iBAAiB,EAAE,CAAC;SAClC;QAED,OAAO,IAAI,CAAA;;;;;KAKV,CAAC;IACJ,CAAC;IAEkB,oBAAoB,CAAC,aAA4B;QAClE,IAAI,IAAI,CAAC,SAAS,EAAE;YAClB,OAAO,kBAAkB,CAAC;gBACxB,aAAa;gBACb,SAAS,EAAE,IAAI,CAAC,eAAe;gBAC/B,QAAQ,EAAE,IAAI,CAAC,QAAQ;aACxB,CAAC,CAAC;SACJ;QAED,OAAO,OAAO,CAAC;IACjB,CAAC;IAEkB,aAAa;QAC9B,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,OAAO,IAAI,CAAA,+BAA+B,CAAC;SAC5C;QAED,OAAO,KAAK,CAAC,aAAa,EAAE,CAAC;IAC/B,CAAC;IAEO,WAAW,CAAC,KAAiB;QACnC,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,OAAO;SACR;QAED,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC;QAE/B,MAAM,cAAc,GAAG,CAAC,eAAe,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;QACrD,IAAI,cAAc,EAAE;YAClB,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC;YAC/B,OAAO;SACR;IACH,CAAC;CACF;AAnF4B;IAA1B,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAC,CAAC;4CAAkB;AACjB;IAA1B,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAC,CAAC;6CAAmB;AACH;IAAzC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;4CAAkB;AAOxC;IADlB,KAAK,CAAC,iBAAiB,CAAC;iDAC6B;AAEnC;IADlB,KAAK,CAAC,kBAAkB,CAAC;kDAC6B","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} 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 *\n * @fires remove {Event} Dispatched when the remove button is clicked.\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 'button';\n  }\n\n  @query('.primary.action')\n  protected readonly primaryAction!: HTMLElement | null;\n  @query('.trailing.action')\n  protected readonly trailingAction!: HTMLElement | null;\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\n        class=\"primary action\"\n        id=\"button\"\n        aria-label=${ariaLabel || nothing}\n        aria-pressed=${this.selected}\n        ?disabled=${this.disabled && !this.alwaysFocusable}\n        @click=${this.handleClick}\n        >${content}</button\n      >\n    `;\n  }\n\n  protected override renderLeadingIcon() {\n    if (!this.selected) {\n      return super.renderLeadingIcon();\n    }\n\n    return html`\n      <svg class=\"checkmark\" viewBox=\"0 0 18 18\" aria-hidden=\"true\">\n        <path\n          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(focusListener: EventListener) {\n    if (this.removable) {\n      return renderRemoveButton({\n        focusListener,\n        ariaLabel: this.ariaLabelRemove,\n        disabled: this.disabled,\n      });\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    this.selected = !this.selected;\n\n    const preventDefault = !redispatchEvent(this, event);\n    if (preventDefault) {\n      this.selected = !this.selected;\n      return;\n    }\n  }\n}\n"]}

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

@@ -6,6 +6,8 @@
 import { MultiActionChip } from './multi-action-chip.js';
 /**
  * An input chip component.
+ *
+ * @fires remove {Event} Dispatched when the remove button is clicked.
  */
 export declare class InputChip extends MultiActionChip {
     avatar: boolean;

package/chips/internal/input-chip.js

@@ -10,6 +10,8 @@ import { MultiActionChip } from './multi-action-chip.js';
 import { renderRemoveButton } from './trailing-icons.js';
 /**
  * An input chip component.
+ *
+ * @fires remove {Event} Dispatched when the remove button is clicked.
  */
 export class InputChip extends MultiActionChip {
     constructor() {
@@ -56,12 +58,14 @@ export class InputChip extends MultiActionChip {
         const { ariaLabel } = this;
         if (this.href) {
             return html `
-        <a class="primary action"
+        <a
+          class="primary action"
           id="link"
           aria-label=${ariaLabel || nothing}
           href=${this.href}
           target=${this.target || nothing}
-        >${content}</a>
+          >${content}</a
+        >
       `;
         }
         if (this.removeOnly) {
@@ -72,12 +76,14 @@ export class InputChip extends MultiActionChip {
       `;
         }
         return html `
-      <button class="primary action"
+      <button
+        class="primary action"
         id="button"
         aria-label=${ariaLabel || nothing}
         ?disabled=${this.disabled && !this.alwaysFocusable}
         type="button"
-      >${content}</button>
+        >${content}</button
+      >
     `;
     }
     renderTrailingAction(focusListener) {

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 renderPrimaryAction(content: unknown) {\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        >${content}</a>\n      `;\n    }\n\n    if (this.removeOnly) {\n      return html`\n        <span class=\"primary action\" aria-label=${ariaLabel || nothing}>\n          ${content}\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 && !this.alwaysFocusable}\n        type=\"button\"\n      >${content}</button>\n    `;\n  }\n\n  protected override renderTrailingAction(focusListener: EventListener) {\n    return renderRemoveButton({\n      focusListener,\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 {MultiActionChip} from './multi-action-chip.js';\nimport {renderRemoveButton} from './trailing-icons.js';\n\n/**\n * An input chip component.\n *\n * @fires remove {Event} Dispatched when the remove button is clicked.\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 renderPrimaryAction(content: unknown) {\n    const {ariaLabel} = this as ARIAMixinStrict;\n    if (this.href) {\n      return html`\n        <a\n          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\n    if (this.removeOnly) {\n      return html`\n        <span class=\"primary action\" aria-label=${ariaLabel || nothing}>\n          ${content}\n        </span>\n      `;\n    }\n\n    return html`\n      <button\n        class=\"primary action\"\n        id=\"button\"\n        aria-label=${ariaLabel || nothing}\n        ?disabled=${this.disabled && !this.alwaysFocusable}\n        type=\"button\"\n        >${content}</button\n      >\n    `;\n  }\n\n  protected override renderTrailingAction(focusListener: EventListener) {\n    return renderRemoveButton({\n      focusListener,\n      ariaLabel: this.ariaLabelRemove,\n      disabled: !this.href && this.disabled,\n      tabbable: this.removeOnly,\n    });\n  }\n}\n"]}

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":"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","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    this.handleTrailingActionFocus = this.handleTrailingActionFocus.bind(this);\n    if (!isServer) {\n      this.addEventListener('keydown', this.handleKeyDown.bind(this));\n    }\n  }\n\n  override focus(options?: FocusOptions&{trailing?: boolean}) {\n    const isFocusable = this.alwaysFocusable || !this.disabled;\n    if (isFocusable && options?.trailing && this.trailingAction) {\n      this.trailingAction.focus(options);\n      return;\n    }\n\n    super.focus(options as FocusOptions);\n  }\n\n  protected override renderContainerContent() {\n    return html`\n      ${super.renderContainerContent()}\n      ${this.renderTrailingAction(this.handleTrailingActionFocus)}\n    `;\n  }\n\n  protected abstract renderTrailingAction(focusListener: EventListener):\n      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  private handleTrailingActionFocus() {\n    const {primaryAction, trailingAction} = this;\n    if (!primaryAction || !trailingAction) {\n      return;\n    }\n\n    // Temporarily turn off the primary action's focusability. This allows\n    // shift+tab from the trailing action to move to the previous chip rather\n    // than the primary action in the same chip.\n    primaryAction.tabIndex = -1;\n    trailingAction.addEventListener('focusout', () => {\n      primaryAction.tabIndex = 0;\n    }, {once: true});\n  }\n}\n"]}
+{"version":3,"file":"multi-action-chip.js","sourceRoot":"","sources":["multi-action-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, 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    this.handleTrailingActionFocus = this.handleTrailingActionFocus.bind(this);\n    if (!isServer) {\n      this.addEventListener('keydown', this.handleKeyDown.bind(this));\n    }\n  }\n\n  override focus(options?: FocusOptions & {trailing?: boolean}) {\n    const isFocusable = this.alwaysFocusable || !this.disabled;\n    if (isFocusable && options?.trailing && this.trailingAction) {\n      this.trailingAction.focus(options);\n      return;\n    }\n\n    super.focus(options as FocusOptions);\n  }\n\n  protected override renderContainerContent() {\n    return html`\n      ${super.renderContainerContent()}\n      ${this.renderTrailingAction(this.handleTrailingActionFocus)}\n    `;\n  }\n\n  protected abstract renderTrailingAction(\n    focusListener: EventListener,\n  ): 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  private handleTrailingActionFocus() {\n    const {primaryAction, trailingAction} = this;\n    if (!primaryAction || !trailingAction) {\n      return;\n    }\n\n    // Temporarily turn off the primary action's focusability. This allows\n    // shift+tab from the trailing action to move to the previous chip rather\n    // than the primary action in the same chip.\n    primaryAction.tabIndex = -1;\n    trailingAction.addEventListener(\n      'focusout',\n      () => {\n        primaryAction.tabIndex = 0;\n      },\n      {once: true},\n    );\n  }\n}\n"]}

package/chips/internal/trailing-icons.d.ts

@@ -12,5 +12,5 @@ interface RemoveButtonProperties {
     tabbable?: boolean;
 }
 /** @protected */
-export declare function renderRemoveButton({ ariaLabel, disabled, focusListener, tabbable }: RemoveButtonProperties): import("lit-html").TemplateResult<1>;
+export declare function renderRemoveButton({ ariaLabel, disabled, focusListener, tabbable, }: RemoveButtonProperties): import("lit-html").TemplateResult<1>;
 export {};

package/chips/internal/trailing-icons.js

@@ -7,18 +7,19 @@ import '../../focus/md-focus-ring.js';
 import '../../ripple/ripple.js';
 import { html, nothing } from 'lit';
 /** @protected */
-export function renderRemoveButton({ ariaLabel, disabled, focusListener, tabbable = false }) {
+export function renderRemoveButton({ ariaLabel, disabled, focusListener, tabbable = false, }) {
     return html `
-    <button class="trailing action"
+    <button
+      class="trailing action"
       aria-label=${ariaLabel}
       tabindex=${!tabbable ? -1 : nothing}
       @click=${handleRemoveClick}
-      @focus=${focusListener}
-    >
+      @focus=${focusListener}>
       <md-focus-ring part="trailing-focus-ring"></md-focus-ring>
       <md-ripple ?disabled=${disabled}></md-ripple>
       <svg class="trailing icon" viewBox="0 96 960 960" aria-hidden="true">
-        <path d="m249 849-42-42 231-231-231-231 42-42 231 231 231-231 42 42-231 231 231 231-42 42-231-231-231 231Z" />
+        <path
+          d="m249 849-42-42 231-231-231-231 42-42 231 231 231-231 42 42-231 231 231 231-42 42-231-231-231 231Z" />
       </svg>
       <span class="touch"></span>
     </button>

package/chips/internal/trailing-icons.js.map

@@ -1 +1 @@
-{"version":3,"file":"trailing-icons.js","sourceRoot":"","sources":["trailing-icons.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,8BAA8B,CAAC;AACtC,OAAO,wBAAwB,CAAC;AAEhC,OAAO,EAAC,IAAI,EAAE,OAAO,EAAC,MAAM,KAAK,CAAC;AAWlC,iBAAiB;AACjB,MAAM,UAAU,kBAAkB,CAC9B,EAAC,SAAS,EAAE,QAAQ,EAAE,aAAa,EAAE,QAAQ,GAAG,KAAK,EAC3B;IAC5B,OAAO,IAAI,CAAA;;mBAEM,SAAS;iBACX,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO;eAC1B,iBAAiB;eACjB,aAAa;;;6BAGC,QAAQ;;;;;;GAMlC,CAAC;AACJ,CAAC;AAED,SAAS,iBAAiB,CAAa,KAAY;IACjD,IAAI,IAAI,CAAC,QAAQ,EAAE;QACjB,OAAO;KACR;IAED,KAAK,CAAC,eAAe,EAAE,CAAC;IACxB,MAAM,cAAc,GAChB,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,KAAK,CAAC,QAAQ,EAAE,EAAC,UAAU,EAAE,IAAI,EAAC,CAAC,CAAC,CAAC;IACjE,IAAI,cAAc,EAAE;QAClB,OAAO;KACR;IAED,IAAI,CAAC,MAAM,EAAE,CAAC;AAChB,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport '../../focus/md-focus-ring.js';\nimport '../../ripple/ripple.js';\n\nimport {html, nothing} from 'lit';\n\nimport {Chip} from './chip.js';\n\ninterface RemoveButtonProperties {\n  ariaLabel: string;\n  disabled: boolean;\n  focusListener: EventListener;\n  tabbable?: boolean;\n}\n\n/** @protected */\nexport function renderRemoveButton(\n    {ariaLabel, disabled, focusListener, tabbable = false}:\n        RemoveButtonProperties) {\n  return html`\n    <button class=\"trailing action\"\n      aria-label=${ariaLabel}\n      tabindex=${!tabbable ? -1 : nothing}\n      @click=${handleRemoveClick}\n      @focus=${focusListener}\n    >\n      <md-focus-ring part=\"trailing-focus-ring\"></md-focus-ring>\n      <md-ripple ?disabled=${disabled}></md-ripple>\n      <svg class=\"trailing icon\" viewBox=\"0 96 960 960\" aria-hidden=\"true\">\n        <path d=\"m249 849-42-42 231-231-231-231 42-42 231 231 231-231 42 42-231 231 231 231-42 42-231-231-231 231Z\" />\n      </svg>\n      <span class=\"touch\"></span>\n    </button>\n  `;\n}\n\nfunction handleRemoveClick(this: Chip, event: Event) {\n  if (this.disabled) {\n    return;\n  }\n\n  event.stopPropagation();\n  const preventDefault =\n      !this.dispatchEvent(new Event('remove', {cancelable: true}));\n  if (preventDefault) {\n    return;\n  }\n\n  this.remove();\n}\n"]}
+{"version":3,"file":"trailing-icons.js","sourceRoot":"","sources":["trailing-icons.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,8BAA8B,CAAC;AACtC,OAAO,wBAAwB,CAAC;AAEhC,OAAO,EAAC,IAAI,EAAE,OAAO,EAAC,MAAM,KAAK,CAAC;AAWlC,iBAAiB;AACjB,MAAM,UAAU,kBAAkB,CAAC,EACjC,SAAS,EACT,QAAQ,EACR,aAAa,EACb,QAAQ,GAAG,KAAK,GACO;IACvB,OAAO,IAAI,CAAA;;;mBAGM,SAAS;iBACX,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO;eAC1B,iBAAiB;eACjB,aAAa;;6BAEC,QAAQ;;;;;;;GAOlC,CAAC;AACJ,CAAC;AAED,SAAS,iBAAiB,CAAa,KAAY;IACjD,IAAI,IAAI,CAAC,QAAQ,EAAE;QACjB,OAAO;KACR;IAED,KAAK,CAAC,eAAe,EAAE,CAAC;IACxB,MAAM,cAAc,GAAG,CAAC,IAAI,CAAC,aAAa,CACxC,IAAI,KAAK,CAAC,QAAQ,EAAE,EAAC,UAAU,EAAE,IAAI,EAAC,CAAC,CACxC,CAAC;IACF,IAAI,cAAc,EAAE;QAClB,OAAO;KACR;IAED,IAAI,CAAC,MAAM,EAAE,CAAC;AAChB,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport '../../focus/md-focus-ring.js';\nimport '../../ripple/ripple.js';\n\nimport {html, nothing} from 'lit';\n\nimport {Chip} from './chip.js';\n\ninterface RemoveButtonProperties {\n  ariaLabel: string;\n  disabled: boolean;\n  focusListener: EventListener;\n  tabbable?: boolean;\n}\n\n/** @protected */\nexport function renderRemoveButton({\n  ariaLabel,\n  disabled,\n  focusListener,\n  tabbable = false,\n}: RemoveButtonProperties) {\n  return html`\n    <button\n      class=\"trailing action\"\n      aria-label=${ariaLabel}\n      tabindex=${!tabbable ? -1 : nothing}\n      @click=${handleRemoveClick}\n      @focus=${focusListener}>\n      <md-focus-ring part=\"trailing-focus-ring\"></md-focus-ring>\n      <md-ripple ?disabled=${disabled}></md-ripple>\n      <svg class=\"trailing icon\" viewBox=\"0 96 960 960\" aria-hidden=\"true\">\n        <path\n          d=\"m249 849-42-42 231-231-231-231 42-42 231 231 231-231 42 42-231 231 231 231-42 42-231-231-231 231Z\" />\n      </svg>\n      <span class=\"touch\"></span>\n    </button>\n  `;\n}\n\nfunction handleRemoveClick(this: Chip, event: Event) {\n  if (this.disabled) {\n    return;\n  }\n\n  event.stopPropagation();\n  const preventDefault = !this.dispatchEvent(\n    new Event('remove', {cancelable: true}),\n  );\n  if (preventDefault) {\n    return;\n  }\n\n  this.remove();\n}\n"]}

package/common.d.ts

@@ -16,6 +16,7 @@ import './button/outlined-button.js';
 import './button/text-button.js';
 import './checkbox/checkbox.js';
 import './chips/assist-chip.js';
+import './chips/chip-set.js';
 import './chips/filter-chip.js';
 import './dialog/dialog.js';
 import './icon/icon.js';
@@ -38,6 +39,7 @@ export * from './button/outlined-button.js';
 export * from './button/text-button.js';
 export * from './checkbox/checkbox.js';
 export * from './chips/assist-chip.js';
+export * from './chips/chip-set.js';
 export * from './chips/filter-chip.js';
 export * from './dialog/dialog.js';
 export * from './icon/icon.js';

package/common.js

@@ -18,6 +18,7 @@ import './button/outlined-button.js';
 import './button/text-button.js';
 import './checkbox/checkbox.js';
 import './chips/assist-chip.js';
+import './chips/chip-set.js';
 import './chips/filter-chip.js';
 import './dialog/dialog.js';
 import './icon/icon.js';
@@ -44,6 +45,7 @@ export * from './button/outlined-button.js';
 export * from './button/text-button.js';
 export * from './checkbox/checkbox.js';
 export * from './chips/assist-chip.js';
+export * from './chips/chip-set.js';
 export * from './chips/filter-chip.js';
 export * from './dialog/dialog.js';
 export * from './icon/icon.js';

package/common.js.map

@@ -1 +1 @@
-{"version":3,"file":"common.js","sourceRoot":"","sources":["common.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH;;;;;;;GAOG;AAEH,yBAAyB;AACzB,uBAAuB;AACvB,OAAO,2BAA2B,CAAC;AACnC,OAAO,6BAA6B,CAAC;AACrC,OAAO,yBAAyB,CAAC;AACjC,OAAO,wBAAwB,CAAC;AAChC,OAAO,wBAAwB,CAAC;AAChC,OAAO,wBAAwB,CAAC;AAChC,OAAO,oBAAoB,CAAC;AAC5B,OAAO,gBAAgB,CAAC;AACxB,OAAO,6BAA6B,CAAC;AACrC,OAAO,gBAAgB,CAAC;AACxB,OAAO,qBAAqB,CAAC;AAC7B,OAAO,gBAAgB,CAAC;AACxB,OAAO,qBAAqB,CAAC;AAC7B,OAAO,oBAAoB,CAAC;AAC5B,OAAO,iCAAiC,CAAC;AACzC,OAAO,+BAA+B,CAAC;AACvC,OAAO,kBAAkB,CAAC;AAC1B,OAAO,6BAA6B,CAAC;AACrC,OAAO,2BAA2B,CAAC;AACnC,OAAO,uBAAuB,CAAC;AAC/B,OAAO,gBAAgB,CAAC;AACxB,OAAO,oCAAoC,CAAC;AAC5C,qBAAqB;AACrB,4BAA4B;AAE5B,yBAAyB;AACzB,uBAAuB;AACvB,cAAc,2BAA2B,CAAC;AAC1C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,yBAAyB,CAAC;AACxC,cAAc,wBAAwB,CAAC;AACvC,cAAc,wBAAwB,CAAC;AACvC,cAAc,wBAAwB,CAAC;AACvC,cAAc,oBAAoB,CAAC;AACnC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,6BAA6B,CAAC;AAC5C,cAAc,gBAAgB,CAAC;AAC/B,cAAc,qBAAqB,CAAC;AACpC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC;AACnC,cAAc,iCAAiC,CAAC;AAChD,cAAc,+BAA+B,CAAC;AAC9C,cAAc,kBAAkB,CAAC;AACjC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,uBAAuB,CAAC;AACtC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,oCAAoC,CAAC;AACnD,qBAAqB;AACrB,4BAA4B","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\n/**\n * @fileoverview A convenience bundle import that includes common components.\n *\n * WARNING: This import is intended for prototyping and development builds only.\n * It is smaller than `@material/web/all.js` and includes the most common\n * components for starting a project. Import only the individual components used\n * for production.\n */\n\n// LINT.IfChange(imports)\n// go/keep-sorted start\nimport './button/filled-button.js';\nimport './button/outlined-button.js';\nimport './button/text-button.js';\nimport './checkbox/checkbox.js';\nimport './chips/assist-chip.js';\nimport './chips/filter-chip.js';\nimport './dialog/dialog.js';\nimport './icon/icon.js';\nimport './iconbutton/icon-button.js';\nimport './list/list.js';\nimport './list/list-item.js';\nimport './menu/menu.js';\nimport './menu/menu-item.js';\nimport './menu/sub-menu.js';\nimport './progress/circular-progress.js';\nimport './progress/linear-progress.js';\nimport './radio/radio.js';\nimport './select/outlined-select.js';\nimport './select/select-option.js';\nimport './tabs/primary-tab.js';\nimport './tabs/tabs.js';\nimport './textfield/outlined-text-field.js';\n// go/keep-sorted end\n// LINT.ThenChange(:exports)\n\n// LINT.IfChange(exports)\n// go/keep-sorted start\nexport * from './button/filled-button.js';\nexport * from './button/outlined-button.js';\nexport * from './button/text-button.js';\nexport * from './checkbox/checkbox.js';\nexport * from './chips/assist-chip.js';\nexport * from './chips/filter-chip.js';\nexport * from './dialog/dialog.js';\nexport * from './icon/icon.js';\nexport * from './iconbutton/icon-button.js';\nexport * from './list/list.js';\nexport * from './list/list-item.js';\nexport * from './menu/menu.js';\nexport * from './menu/menu-item.js';\nexport * from './menu/sub-menu.js';\nexport * from './progress/circular-progress.js';\nexport * from './progress/linear-progress.js';\nexport * from './radio/radio.js';\nexport * from './select/outlined-select.js';\nexport * from './select/select-option.js';\nexport * from './tabs/primary-tab.js';\nexport * from './tabs/tabs.js';\nexport * from './textfield/outlined-text-field.js';\n// go/keep-sorted end\n// LINT.ThenChange(:imports)\n"]}
+{"version":3,"file":"common.js","sourceRoot":"","sources":["common.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH;;;;;;;GAOG;AAEH,yBAAyB;AACzB,uBAAuB;AACvB,OAAO,2BAA2B,CAAC;AACnC,OAAO,6BAA6B,CAAC;AACrC,OAAO,yBAAyB,CAAC;AACjC,OAAO,wBAAwB,CAAC;AAChC,OAAO,wBAAwB,CAAC;AAChC,OAAO,qBAAqB,CAAC;AAC7B,OAAO,wBAAwB,CAAC;AAChC,OAAO,oBAAoB,CAAC;AAC5B,OAAO,gBAAgB,CAAC;AACxB,OAAO,6BAA6B,CAAC;AACrC,OAAO,gBAAgB,CAAC;AACxB,OAAO,qBAAqB,CAAC;AAC7B,OAAO,gBAAgB,CAAC;AACxB,OAAO,qBAAqB,CAAC;AAC7B,OAAO,oBAAoB,CAAC;AAC5B,OAAO,iCAAiC,CAAC;AACzC,OAAO,+BAA+B,CAAC;AACvC,OAAO,kBAAkB,CAAC;AAC1B,OAAO,6BAA6B,CAAC;AACrC,OAAO,2BAA2B,CAAC;AACnC,OAAO,uBAAuB,CAAC;AAC/B,OAAO,gBAAgB,CAAC;AACxB,OAAO,oCAAoC,CAAC;AAC5C,qBAAqB;AACrB,4BAA4B;AAE5B,yBAAyB;AACzB,uBAAuB;AACvB,cAAc,2BAA2B,CAAC;AAC1C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,yBAAyB,CAAC;AACxC,cAAc,wBAAwB,CAAC;AACvC,cAAc,wBAAwB,CAAC;AACvC,cAAc,qBAAqB,CAAC;AACpC,cAAc,wBAAwB,CAAC;AACvC,cAAc,oBAAoB,CAAC;AACnC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,6BAA6B,CAAC;AAC5C,cAAc,gBAAgB,CAAC;AAC/B,cAAc,qBAAqB,CAAC;AACpC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC;AACnC,cAAc,iCAAiC,CAAC;AAChD,cAAc,+BAA+B,CAAC;AAC9C,cAAc,kBAAkB,CAAC;AACjC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,uBAAuB,CAAC;AACtC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,oCAAoC,CAAC;AACnD,qBAAqB;AACrB,4BAA4B","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\n/**\n * @fileoverview A convenience bundle import that includes common components.\n *\n * WARNING: This import is intended for prototyping and development builds only.\n * It is smaller than `@material/web/all.js` and includes the most common\n * components for starting a project. Import only the individual components used\n * for production.\n */\n\n// LINT.IfChange(imports)\n// go/keep-sorted start\nimport './button/filled-button.js';\nimport './button/outlined-button.js';\nimport './button/text-button.js';\nimport './checkbox/checkbox.js';\nimport './chips/assist-chip.js';\nimport './chips/chip-set.js';\nimport './chips/filter-chip.js';\nimport './dialog/dialog.js';\nimport './icon/icon.js';\nimport './iconbutton/icon-button.js';\nimport './list/list.js';\nimport './list/list-item.js';\nimport './menu/menu.js';\nimport './menu/menu-item.js';\nimport './menu/sub-menu.js';\nimport './progress/circular-progress.js';\nimport './progress/linear-progress.js';\nimport './radio/radio.js';\nimport './select/outlined-select.js';\nimport './select/select-option.js';\nimport './tabs/primary-tab.js';\nimport './tabs/tabs.js';\nimport './textfield/outlined-text-field.js';\n// go/keep-sorted end\n// LINT.ThenChange(:exports)\n\n// LINT.IfChange(exports)\n// go/keep-sorted start\nexport * from './button/filled-button.js';\nexport * from './button/outlined-button.js';\nexport * from './button/text-button.js';\nexport * from './checkbox/checkbox.js';\nexport * from './chips/assist-chip.js';\nexport * from './chips/chip-set.js';\nexport * from './chips/filter-chip.js';\nexport * from './dialog/dialog.js';\nexport * from './icon/icon.js';\nexport * from './iconbutton/icon-button.js';\nexport * from './list/list.js';\nexport * from './list/list-item.js';\nexport * from './menu/menu.js';\nexport * from './menu/menu-item.js';\nexport * from './menu/sub-menu.js';\nexport * from './progress/circular-progress.js';\nexport * from './progress/linear-progress.js';\nexport * from './radio/radio.js';\nexport * from './select/outlined-select.js';\nexport * from './select/select-option.js';\nexport * from './tabs/primary-tab.js';\nexport * from './tabs/tabs.js';\nexport * from './textfield/outlined-text-field.js';\n// go/keep-sorted end\n// LINT.ThenChange(:imports)\n"]}

package/dialog/harness.js

@@ -10,8 +10,7 @@ import { Harness } from '../testing/harness.js';
 export class DialogHarness extends Harness {
     async getInteractiveElement() {
         await this.element.updateComplete;
-        return this.element.querySelector('[autocomplete]') ??
-            this.element;
+        return (this.element.querySelector('[autocomplete]') ?? this.element);
     }
 }
 //# sourceMappingURL=harness.js.map

package/dialog/harness.js.map

@@ -1 +1 @@
-{"version":3,"file":"harness.js","sourceRoot":"","sources":["harness.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAC,OAAO,EAAC,MAAM,uBAAuB,CAAC;AAI9C;;GAEG;AACH,MAAM,OAAO,aAAc,SAAQ,OAAe;IACvC,KAAK,CAAC,qBAAqB;QAClC,MAAM,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC;QAClC,OAAO,IAAI,CAAC,OAAO,CAAC,aAAa,CAAc,gBAAgB,CAAC;YAC5D,IAAI,CAAC,OAAO,CAAC;IACnB,CAAC;CACF","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {Harness} from '../testing/harness.js';\n\nimport {Dialog} from './internal/dialog.js';\n\n/**\n * Test harness for dialog.\n */\nexport class DialogHarness extends Harness<Dialog> {\n  override async getInteractiveElement() {\n    await this.element.updateComplete;\n    return this.element.querySelector<HTMLElement>('[autocomplete]') ??\n        this.element;\n  }\n}\n"]}
+{"version":3,"file":"harness.js","sourceRoot":"","sources":["harness.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAC,OAAO,EAAC,MAAM,uBAAuB,CAAC;AAI9C;;GAEG;AACH,MAAM,OAAO,aAAc,SAAQ,OAAe;IACvC,KAAK,CAAC,qBAAqB;QAClC,MAAM,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC;QAClC,OAAO,CACL,IAAI,CAAC,OAAO,CAAC,aAAa,CAAc,gBAAgB,CAAC,IAAI,IAAI,CAAC,OAAO,CAC1E,CAAC;IACJ,CAAC;CACF","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {Harness} from '../testing/harness.js';\n\nimport {Dialog} from './internal/dialog.js';\n\n/**\n * Test harness for dialog.\n */\nexport class DialogHarness extends Harness<Dialog> {\n  override async getInteractiveElement() {\n    await this.element.updateComplete;\n    return (\n      this.element.querySelector<HTMLElement>('[autocomplete]') ?? this.element\n    );\n  }\n}\n"]}

package/dialog/internal/_dialog.scss

@@ -150,7 +150,7 @@
     color: var(--_icon-color);
     fill: currentColor;
     font-size: var(--_icon-size);
-    padding-top: 24px;
+    margin-top: 24px;
     height: var(--_icon-size);
     width: var(--_icon-size);
   }

package/dialog/internal/animations.js

@@ -12,20 +12,21 @@ export const DIALOG_DEFAULT_OPEN_ANIMATION = {
         [
             // Dialog slide down
             [{ 'transform': 'translateY(-50px)' }, { 'transform': 'translateY(0)' }],
-            { duration: 500, easing: EASING.EMPHASIZED }
+            { duration: 500, easing: EASING.EMPHASIZED },
         ],
     ],
     scrim: [
         [
             // Scrim fade in
-            [{ 'opacity': 0 }, { 'opacity': 0.32 }], { duration: 500, easing: 'linear' }
+            [{ 'opacity': 0 }, { 'opacity': 0.32 }],
+            { duration: 500, easing: 'linear' },
         ],
     ],
     container: [
         [
             // Container fade in
             [{ 'opacity': 0 }, { 'opacity': 1 }],
-            { duration: 50, easing: 'linear', pseudoElement: '::before' }
+            { duration: 50, easing: 'linear', pseudoElement: '::before' },
         ],
         [
             // Container grow
@@ -41,21 +42,21 @@ export const DIALOG_DEFAULT_OPEN_ANIMATION = {
         [
             // Headline fade in
             [{ 'opacity': 0 }, { 'opacity': 0, offset: 0.2 }, { 'opacity': 1 }],
-            { duration: 250, easing: 'linear', fill: 'forwards' }
+            { duration: 250, easing: 'linear', fill: 'forwards' },
         ],
     ],
     content: [
         [
             // Content fade in
             [{ 'opacity': 0 }, { 'opacity': 0, offset: 0.2 }, { 'opacity': 1 }],
-            { duration: 250, easing: 'linear', fill: 'forwards' }
+            { duration: 250, easing: 'linear', fill: 'forwards' },
         ],
     ],
     actions: [
         [
             // Actions fade in
             [{ 'opacity': 0 }, { 'opacity': 0, offset: 0.5 }, { 'opacity': 1 }],
-            { duration: 300, easing: 'linear', fill: 'forwards' }
+            { duration: 300, easing: 'linear', fill: 'forwards' },
         ],
     ],
 };
@@ -67,13 +68,14 @@ export const DIALOG_DEFAULT_CLOSE_ANIMATION = {
         [
             // Dialog slide up
             [{ 'transform': 'translateY(0)' }, { 'transform': 'translateY(-50px)' }],
-            { duration: 150, easing: EASING.EMPHASIZED_ACCELERATE }
+            { duration: 150, easing: EASING.EMPHASIZED_ACCELERATE },
         ],
     ],
     scrim: [
         [
             // Scrim fade out
-            [{ 'opacity': 0.32 }, { 'opacity': 0 }], { duration: 150, easing: 'linear' }
+            [{ 'opacity': 0.32 }, { 'opacity': 0 }],
+            { duration: 150, easing: 'linear' },
         ],
     ],
     container: [
@@ -90,27 +92,27 @@ export const DIALOG_DEFAULT_CLOSE_ANIMATION = {
             // Container fade out
             [{ 'opacity': '1' }, { 'opacity': '0' }],
             { delay: 100, duration: 50, easing: 'linear', pseudoElement: '::before' },
-        ]
+        ],
     ],
     headline: [
         [
             // Headline fade out
             [{ 'opacity': 1 }, { 'opacity': 0 }],
-            { duration: 100, easing: 'linear', fill: 'forwards' }
+            { duration: 100, easing: 'linear', fill: 'forwards' },
         ],
     ],
     content: [
         [
             // Content fade out
             [{ 'opacity': 1 }, { 'opacity': 0 }],
-            { duration: 100, easing: 'linear', fill: 'forwards' }
+            { duration: 100, easing: 'linear', fill: 'forwards' },
         ],
     ],
     actions: [
         [
             // Actions fade out
             [{ 'opacity': 1 }, { 'opacity': 0 }],
-            { duration: 100, easing: 'linear', fill: 'forwards' }
+            { duration: 100, easing: 'linear', fill: 'forwards' },
         ],
     ],
 };

package/dialog/internal/animations.js.map

@@ -1 +1 @@
-{"version":3,"file":"animations.js","sourceRoot":"","sources":["animations.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 {EASING} from '../../internal/motion/animation.js';\n\n/**\n * A dialog animation's arguments. See `Element.prototype.animate`.\n */\nexport type DialogAnimationArgs = Parameters<Element['animate']>;\n\n/**\n * A collection of dialog animations. Each element of a dialog may have multiple\n * animations.\n */\nexport interface DialogAnimation {\n  /**\n   * Animations for the dialog itself.\n   */\n  dialog?: DialogAnimationArgs[];\n\n  /**\n   * Animations for the scrim backdrop.\n   */\n  scrim?: DialogAnimationArgs[];\n\n  /**\n   * Animations for the container of the dialog.\n   */\n  container?: DialogAnimationArgs[];\n\n  /**\n   * Animations for the headline section.\n   */\n  headline?: DialogAnimationArgs[];\n\n  /**\n   * Animations for the contents section.\n   */\n  content?: DialogAnimationArgs[];\n  /**\n   * Animations for the actions section.\n   */\n  actions?: DialogAnimationArgs[];\n}\n\n/**\n * The default dialog open animation.\n */\nexport const DIALOG_DEFAULT_OPEN_ANIMATION: DialogAnimation = {\n  dialog: [\n    [\n      // Dialog slide down\n      [{'transform': 'translateY(-50px)'}, {'transform': 'translateY(0)'}],\n      {duration: 500, easing: EASING.EMPHASIZED}\n    ],\n  ],\n  scrim: [\n    [\n      // Scrim fade in\n      [{'opacity': 0}, {'opacity': 0.32}], {duration: 500, easing: 'linear'}\n    ],\n  ],\n  container: [\n    [\n      // Container fade in\n      [{'opacity': 0}, {'opacity': 1}],\n      {duration: 50, easing: 'linear', pseudoElement: '::before'}\n    ],\n    [\n      // Container grow\n      // Note: current spec says to grow from 0dp->100% and shrink from\n      // 100%->35%. We change this to 35%->100% to simplify the animation that\n      // is supposed to clip content as it grows. From 0dp it's possible to see\n      // text/actions appear before the container has fully grown.\n      [{'height': '35%'}, {'height': '100%'}],\n      {duration: 500, easing: EASING.EMPHASIZED, pseudoElement: '::before'},\n    ],\n  ],\n  headline: [\n    [\n      // Headline fade in\n      [{'opacity': 0}, {'opacity': 0, offset: 0.2}, {'opacity': 1}],\n      {duration: 250, easing: 'linear', fill: 'forwards'}\n    ],\n  ],\n  content: [\n    [\n      // Content fade in\n      [{'opacity': 0}, {'opacity': 0, offset: 0.2}, {'opacity': 1}],\n      {duration: 250, easing: 'linear', fill: 'forwards'}\n    ],\n  ],\n  actions: [\n    [\n      // Actions fade in\n      [{'opacity': 0}, {'opacity': 0, offset: 0.5}, {'opacity': 1}],\n      {duration: 300, easing: 'linear', fill: 'forwards'}\n    ],\n  ],\n};\n\n/**\n * The default dialog close animation.\n */\nexport const DIALOG_DEFAULT_CLOSE_ANIMATION: DialogAnimation = {\n  dialog: [\n    [\n      // Dialog slide up\n      [{'transform': 'translateY(0)'}, {'transform': 'translateY(-50px)'}],\n      {duration: 150, easing: EASING.EMPHASIZED_ACCELERATE}\n    ],\n  ],\n  scrim: [\n    [\n      // Scrim fade out\n      [{'opacity': 0.32}, {'opacity': 0}], {duration: 150, easing: 'linear'}\n    ],\n  ],\n  container: [\n    [\n      // Container shrink\n      [{'height': '100%'}, {'height': '35%'}],\n      {\n        duration: 150,\n        easing: EASING.EMPHASIZED_ACCELERATE,\n        pseudoElement: '::before',\n      },\n    ],\n    [\n      // Container fade out\n      [{'opacity': '1'}, {'opacity': '0'}],\n      {delay: 100, duration: 50, easing: 'linear', pseudoElement: '::before'},\n    ]\n  ],\n  headline: [\n    [\n      // Headline fade out\n      [{'opacity': 1}, {'opacity': 0}],\n      {duration: 100, easing: 'linear', fill: 'forwards'}\n    ],\n  ],\n  content: [\n    [\n      // Content fade out\n      [{'opacity': 1}, {'opacity': 0}],\n      {duration: 100, easing: 'linear', fill: 'forwards'}\n    ],\n  ],\n  actions: [\n    [\n      // Actions fade out\n      [{'opacity': 1}, {'opacity': 0}],\n      {duration: 100, easing: 'linear', fill: 'forwards'}\n    ],\n  ],\n};\n"]}
+{"version":3,"file":"animations.js","sourceRoot":"","sources":["animations.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 {EASING} from '../../internal/motion/animation.js';\n\n/**\n * A dialog animation's arguments. See `Element.prototype.animate`.\n */\nexport type DialogAnimationArgs = Parameters<Element['animate']>;\n\n/**\n * A collection of dialog animations. Each element of a dialog may have multiple\n * animations.\n */\nexport interface DialogAnimation {\n  /**\n   * Animations for the dialog itself.\n   */\n  dialog?: DialogAnimationArgs[];\n\n  /**\n   * Animations for the scrim backdrop.\n   */\n  scrim?: DialogAnimationArgs[];\n\n  /**\n   * Animations for the container of the dialog.\n   */\n  container?: DialogAnimationArgs[];\n\n  /**\n   * Animations for the headline section.\n   */\n  headline?: DialogAnimationArgs[];\n\n  /**\n   * Animations for the contents section.\n   */\n  content?: DialogAnimationArgs[];\n  /**\n   * Animations for the actions section.\n   */\n  actions?: DialogAnimationArgs[];\n}\n\n/**\n * The default dialog open animation.\n */\nexport const DIALOG_DEFAULT_OPEN_ANIMATION: DialogAnimation = {\n  dialog: [\n    [\n      // Dialog slide down\n      [{'transform': 'translateY(-50px)'}, {'transform': 'translateY(0)'}],\n      {duration: 500, easing: EASING.EMPHASIZED},\n    ],\n  ],\n  scrim: [\n    [\n      // Scrim fade in\n      [{'opacity': 0}, {'opacity': 0.32}],\n      {duration: 500, easing: 'linear'},\n    ],\n  ],\n  container: [\n    [\n      // Container fade in\n      [{'opacity': 0}, {'opacity': 1}],\n      {duration: 50, easing: 'linear', pseudoElement: '::before'},\n    ],\n    [\n      // Container grow\n      // Note: current spec says to grow from 0dp->100% and shrink from\n      // 100%->35%. We change this to 35%->100% to simplify the animation that\n      // is supposed to clip content as it grows. From 0dp it's possible to see\n      // text/actions appear before the container has fully grown.\n      [{'height': '35%'}, {'height': '100%'}],\n      {duration: 500, easing: EASING.EMPHASIZED, pseudoElement: '::before'},\n    ],\n  ],\n  headline: [\n    [\n      // Headline fade in\n      [{'opacity': 0}, {'opacity': 0, offset: 0.2}, {'opacity': 1}],\n      {duration: 250, easing: 'linear', fill: 'forwards'},\n    ],\n  ],\n  content: [\n    [\n      // Content fade in\n      [{'opacity': 0}, {'opacity': 0, offset: 0.2}, {'opacity': 1}],\n      {duration: 250, easing: 'linear', fill: 'forwards'},\n    ],\n  ],\n  actions: [\n    [\n      // Actions fade in\n      [{'opacity': 0}, {'opacity': 0, offset: 0.5}, {'opacity': 1}],\n      {duration: 300, easing: 'linear', fill: 'forwards'},\n    ],\n  ],\n};\n\n/**\n * The default dialog close animation.\n */\nexport const DIALOG_DEFAULT_CLOSE_ANIMATION: DialogAnimation = {\n  dialog: [\n    [\n      // Dialog slide up\n      [{'transform': 'translateY(0)'}, {'transform': 'translateY(-50px)'}],\n      {duration: 150, easing: EASING.EMPHASIZED_ACCELERATE},\n    ],\n  ],\n  scrim: [\n    [\n      // Scrim fade out\n      [{'opacity': 0.32}, {'opacity': 0}],\n      {duration: 150, easing: 'linear'},\n    ],\n  ],\n  container: [\n    [\n      // Container shrink\n      [{'height': '100%'}, {'height': '35%'}],\n      {\n        duration: 150,\n        easing: EASING.EMPHASIZED_ACCELERATE,\n        pseudoElement: '::before',\n      },\n    ],\n    [\n      // Container fade out\n      [{'opacity': '1'}, {'opacity': '0'}],\n      {delay: 100, duration: 50, easing: 'linear', pseudoElement: '::before'},\n    ],\n  ],\n  headline: [\n    [\n      // Headline fade out\n      [{'opacity': 1}, {'opacity': 0}],\n      {duration: 100, easing: 'linear', fill: 'forwards'},\n    ],\n  ],\n  content: [\n    [\n      // Content fade out\n      [{'opacity': 1}, {'opacity': 0}],\n      {duration: 100, easing: 'linear', fill: 'forwards'},\n    ],\n  ],\n  actions: [\n    [\n      // Actions fade out\n      [{'opacity': 1}, {'opacity': 0}],\n      {duration: 100, easing: 'linear', fill: 'forwards'},\n    ],\n  ],\n};\n"]}

package/dialog/internal/dialog-styles.css.js

@@ -4,6 +4,6 @@
   * SPDX-License-Identifier: Apache-2.0
   */
 import { css } from 'lit';
-export const styles = css `:host{--_container-color: var(--md-dialog-container-color, var(--md-sys-color-surface-container-high, #ece6f0));--_container-shape: var(--md-dialog-container-shape, 28px);--_headline-color: var(--md-dialog-headline-color, var(--md-sys-color-on-surface, #1d1b20));--_headline-font: var(--md-dialog-headline-font, var(--md-sys-typescale-headline-small-font, var(--md-ref-typeface-brand, Roboto)));--_headline-line-height: var(--md-dialog-headline-line-height, var(--md-sys-typescale-headline-small-line-height, 2rem));--_headline-size: var(--md-dialog-headline-size, var(--md-sys-typescale-headline-small-size, 1.5rem));--_headline-weight: var(--md-dialog-headline-weight, var(--md-sys-typescale-headline-small-weight, var(--md-ref-typeface-weight-regular, 400)));--_supporting-text-color: var(--md-dialog-supporting-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_supporting-text-font: var(--md-dialog-supporting-text-font, var(--md-sys-typescale-body-medium-font, var(--md-ref-typeface-plain, Roboto)));--_supporting-text-line-height: var(--md-dialog-supporting-text-line-height, var(--md-sys-typescale-body-medium-line-height, 1.25rem));--_supporting-text-size: var(--md-dialog-supporting-text-size, var(--md-sys-typescale-body-medium-size, 0.875rem));--_supporting-text-weight: var(--md-dialog-supporting-text-weight, var(--md-sys-typescale-body-medium-weight, var(--md-ref-typeface-weight-regular, 400)));--_icon-color: var(--md-dialog-icon-color, var(--md-sys-color-secondary, #625b71));--_icon-size: var(--md-dialog-icon-size, 24px);--_container-shape-start-start: var( --md-dialog-container-shape-start-start, var(--_container-shape) );--_container-shape-start-end: var( --md-dialog-container-shape-start-end, var(--_container-shape) );--_container-shape-end-end: var( --md-dialog-container-shape-end-end, var(--_container-shape) );--_container-shape-end-start: var( --md-dialog-container-shape-end-start, var(--_container-shape) );border-start-start-radius:var(--_container-shape-start-start);border-start-end-radius:var(--_container-shape-start-end);border-end-end-radius:var(--_container-shape-end-end);border-end-start-radius:var(--_container-shape-end-start);display:contents;margin:auto;max-height:min(560px,100% - 48px);max-width:min(560px,100% - 48px);min-height:140px;min-width:280px;position:fixed;height:fit-content;width:fit-content}dialog{background:rgba(0,0,0,0);border:none;border-radius:inherit;flex-direction:column;height:inherit;margin:inherit;max-height:inherit;max-width:inherit;min-height:inherit;min-width:inherit;outline:none;overflow:visible;padding:0;width:inherit}dialog[open]{display:flex}::backdrop{background:none}.scrim{background:var(--md-sys-color-scrim, #000);display:none;inset:0;opacity:32%;pointer-events:none;position:fixed;z-index:1}:host([open]) .scrim{display:flex}h2{all:unset;align-self:stretch}.headline{align-items:center;color:var(--_headline-color);display:flex;flex-direction:column;font-family:var(--_headline-font);font-size:var(--_headline-size);line-height:var(--_headline-line-height);font-weight:var(--_headline-weight);position:relative}slot[name=headline]::slotted(*){align-items:center;align-self:stretch;box-sizing:border-box;display:flex;gap:8px;padding:24px 24px 0}.icon{display:flex}slot[name=icon]::slotted(*){color:var(--_icon-color);fill:currentColor;font-size:var(--_icon-size);padding-top:24px;height:var(--_icon-size);width:var(--_icon-size)}.has-icon slot[name=headline]::slotted(*){justify-content:center;padding-top:16px}.scrollable slot[name=headline]::slotted(*){padding-bottom:16px}.scrollable.has-headline slot[name=content]::slotted(*){padding-top:8px}.container{border-radius:inherit;display:flex;flex-direction:column;flex-grow:1;overflow:hidden;position:relative;transform-origin:top}.container::before{background:var(--_container-color);border-radius:inherit;content:"";inset:0;position:absolute}.scroller{display:flex;flex:1;flex-direction:column;overflow:hidden;z-index:1}.scrollable .scroller{overflow-y:scroll}.content{color:var(--_supporting-text-color);font-family:var(--_supporting-text-font);font-size:var(--_supporting-text-size);line-height:var(--_supporting-text-line-height);font-weight:var(--_supporting-text-weight);height:min-content;position:relative}slot[name=content]::slotted(*){box-sizing:border-box;padding:24px}.anchor{position:absolute}.top.anchor{top:0}.bottom.anchor{bottom:0}.actions{position:relative}slot[name=actions]::slotted(*){box-sizing:border-box;display:flex;gap:8px;justify-content:flex-end;padding:16px 24px 24px}.has-actions slot[name=content]::slotted(*){padding-bottom:8px}md-divider{display:none;position:absolute}.has-headline.show-top-divider .headline md-divider,.has-actions.show-bottom-divider .actions md-divider{display:flex}.headline md-divider{bottom:0}.actions md-divider{top:0}@media(forced-colors: active){dialog{outline:2px solid WindowText}}/*# sourceMappingURL=dialog-styles.css.map */
+export const styles = css `:host{--_container-color: var(--md-dialog-container-color, var(--md-sys-color-surface-container-high, #ece6f0));--_container-shape: var(--md-dialog-container-shape, 28px);--_headline-color: var(--md-dialog-headline-color, var(--md-sys-color-on-surface, #1d1b20));--_headline-font: var(--md-dialog-headline-font, var(--md-sys-typescale-headline-small-font, var(--md-ref-typeface-brand, Roboto)));--_headline-line-height: var(--md-dialog-headline-line-height, var(--md-sys-typescale-headline-small-line-height, 2rem));--_headline-size: var(--md-dialog-headline-size, var(--md-sys-typescale-headline-small-size, 1.5rem));--_headline-weight: var(--md-dialog-headline-weight, var(--md-sys-typescale-headline-small-weight, var(--md-ref-typeface-weight-regular, 400)));--_supporting-text-color: var(--md-dialog-supporting-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_supporting-text-font: var(--md-dialog-supporting-text-font, var(--md-sys-typescale-body-medium-font, var(--md-ref-typeface-plain, Roboto)));--_supporting-text-line-height: var(--md-dialog-supporting-text-line-height, var(--md-sys-typescale-body-medium-line-height, 1.25rem));--_supporting-text-size: var(--md-dialog-supporting-text-size, var(--md-sys-typescale-body-medium-size, 0.875rem));--_supporting-text-weight: var(--md-dialog-supporting-text-weight, var(--md-sys-typescale-body-medium-weight, var(--md-ref-typeface-weight-regular, 400)));--_icon-color: var(--md-dialog-icon-color, var(--md-sys-color-secondary, #625b71));--_icon-size: var(--md-dialog-icon-size, 24px);--_container-shape-start-start: var( --md-dialog-container-shape-start-start, var(--_container-shape) );--_container-shape-start-end: var( --md-dialog-container-shape-start-end, var(--_container-shape) );--_container-shape-end-end: var( --md-dialog-container-shape-end-end, var(--_container-shape) );--_container-shape-end-start: var( --md-dialog-container-shape-end-start, var(--_container-shape) );border-start-start-radius:var(--_container-shape-start-start);border-start-end-radius:var(--_container-shape-start-end);border-end-end-radius:var(--_container-shape-end-end);border-end-start-radius:var(--_container-shape-end-start);display:contents;margin:auto;max-height:min(560px,100% - 48px);max-width:min(560px,100% - 48px);min-height:140px;min-width:280px;position:fixed;height:fit-content;width:fit-content}dialog{background:rgba(0,0,0,0);border:none;border-radius:inherit;flex-direction:column;height:inherit;margin:inherit;max-height:inherit;max-width:inherit;min-height:inherit;min-width:inherit;outline:none;overflow:visible;padding:0;width:inherit}dialog[open]{display:flex}::backdrop{background:none}.scrim{background:var(--md-sys-color-scrim, #000);display:none;inset:0;opacity:32%;pointer-events:none;position:fixed;z-index:1}:host([open]) .scrim{display:flex}h2{all:unset;align-self:stretch}.headline{align-items:center;color:var(--_headline-color);display:flex;flex-direction:column;font-family:var(--_headline-font);font-size:var(--_headline-size);line-height:var(--_headline-line-height);font-weight:var(--_headline-weight);position:relative}slot[name=headline]::slotted(*){align-items:center;align-self:stretch;box-sizing:border-box;display:flex;gap:8px;padding:24px 24px 0}.icon{display:flex}slot[name=icon]::slotted(*){color:var(--_icon-color);fill:currentColor;font-size:var(--_icon-size);margin-top:24px;height:var(--_icon-size);width:var(--_icon-size)}.has-icon slot[name=headline]::slotted(*){justify-content:center;padding-top:16px}.scrollable slot[name=headline]::slotted(*){padding-bottom:16px}.scrollable.has-headline slot[name=content]::slotted(*){padding-top:8px}.container{border-radius:inherit;display:flex;flex-direction:column;flex-grow:1;overflow:hidden;position:relative;transform-origin:top}.container::before{background:var(--_container-color);border-radius:inherit;content:"";inset:0;position:absolute}.scroller{display:flex;flex:1;flex-direction:column;overflow:hidden;z-index:1}.scrollable .scroller{overflow-y:scroll}.content{color:var(--_supporting-text-color);font-family:var(--_supporting-text-font);font-size:var(--_supporting-text-size);line-height:var(--_supporting-text-line-height);font-weight:var(--_supporting-text-weight);height:min-content;position:relative}slot[name=content]::slotted(*){box-sizing:border-box;padding:24px}.anchor{position:absolute}.top.anchor{top:0}.bottom.anchor{bottom:0}.actions{position:relative}slot[name=actions]::slotted(*){box-sizing:border-box;display:flex;gap:8px;justify-content:flex-end;padding:16px 24px 24px}.has-actions slot[name=content]::slotted(*){padding-bottom:8px}md-divider{display:none;position:absolute}.has-headline.show-top-divider .headline md-divider,.has-actions.show-bottom-divider .actions md-divider{display:flex}.headline md-divider{bottom:0}.actions md-divider{top:0}@media(forced-colors: active){dialog{outline:2px solid WindowText}}/*# sourceMappingURL=dialog-styles.css.map */
 `;
 //# sourceMappingURL=dialog-styles.css.js.map

package/dialog/internal/dialog-styles.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"dialog-styles.css.js","sourceRoot":"","sources":["dialog-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-color: var(--md-dialog-container-color, var(--md-sys-color-surface-container-high, #ece6f0));--_container-shape: var(--md-dialog-container-shape, 28px);--_headline-color: var(--md-dialog-headline-color, var(--md-sys-color-on-surface, #1d1b20));--_headline-font: var(--md-dialog-headline-font, var(--md-sys-typescale-headline-small-font, var(--md-ref-typeface-brand, Roboto)));--_headline-line-height: var(--md-dialog-headline-line-height, var(--md-sys-typescale-headline-small-line-height, 2rem));--_headline-size: var(--md-dialog-headline-size, var(--md-sys-typescale-headline-small-size, 1.5rem));--_headline-weight: var(--md-dialog-headline-weight, var(--md-sys-typescale-headline-small-weight, var(--md-ref-typeface-weight-regular, 400)));--_supporting-text-color: var(--md-dialog-supporting-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_supporting-text-font: var(--md-dialog-supporting-text-font, var(--md-sys-typescale-body-medium-font, var(--md-ref-typeface-plain, Roboto)));--_supporting-text-line-height: var(--md-dialog-supporting-text-line-height, var(--md-sys-typescale-body-medium-line-height, 1.25rem));--_supporting-text-size: var(--md-dialog-supporting-text-size, var(--md-sys-typescale-body-medium-size, 0.875rem));--_supporting-text-weight: var(--md-dialog-supporting-text-weight, var(--md-sys-typescale-body-medium-weight, var(--md-ref-typeface-weight-regular, 400)));--_icon-color: var(--md-dialog-icon-color, var(--md-sys-color-secondary, #625b71));--_icon-size: var(--md-dialog-icon-size, 24px);--_container-shape-start-start: var( --md-dialog-container-shape-start-start, var(--_container-shape) );--_container-shape-start-end: var( --md-dialog-container-shape-start-end, var(--_container-shape) );--_container-shape-end-end: var( --md-dialog-container-shape-end-end, var(--_container-shape) );--_container-shape-end-start: var( --md-dialog-container-shape-end-start, var(--_container-shape) );border-start-start-radius:var(--_container-shape-start-start);border-start-end-radius:var(--_container-shape-start-end);border-end-end-radius:var(--_container-shape-end-end);border-end-start-radius:var(--_container-shape-end-start);display:contents;margin:auto;max-height:min(560px,100% - 48px);max-width:min(560px,100% - 48px);min-height:140px;min-width:280px;position:fixed;height:fit-content;width:fit-content}dialog{background:rgba(0,0,0,0);border:none;border-radius:inherit;flex-direction:column;height:inherit;margin:inherit;max-height:inherit;max-width:inherit;min-height:inherit;min-width:inherit;outline:none;overflow:visible;padding:0;width:inherit}dialog[open]{display:flex}::backdrop{background:none}.scrim{background:var(--md-sys-color-scrim, #000);display:none;inset:0;opacity:32%;pointer-events:none;position:fixed;z-index:1}:host([open]) .scrim{display:flex}h2{all:unset;align-self:stretch}.headline{align-items:center;color:var(--_headline-color);display:flex;flex-direction:column;font-family:var(--_headline-font);font-size:var(--_headline-size);line-height:var(--_headline-line-height);font-weight:var(--_headline-weight);position:relative}slot[name=headline]::slotted(*){align-items:center;align-self:stretch;box-sizing:border-box;display:flex;gap:8px;padding:24px 24px 0}.icon{display:flex}slot[name=icon]::slotted(*){color:var(--_icon-color);fill:currentColor;font-size:var(--_icon-size);padding-top:24px;height:var(--_icon-size);width:var(--_icon-size)}.has-icon slot[name=headline]::slotted(*){justify-content:center;padding-top:16px}.scrollable slot[name=headline]::slotted(*){padding-bottom:16px}.scrollable.has-headline slot[name=content]::slotted(*){padding-top:8px}.container{border-radius:inherit;display:flex;flex-direction:column;flex-grow:1;overflow:hidden;position:relative;transform-origin:top}.container::before{background:var(--_container-color);border-radius:inherit;content:\"\";inset:0;position:absolute}.scroller{display:flex;flex:1;flex-direction:column;overflow:hidden;z-index:1}.scrollable .scroller{overflow-y:scroll}.content{color:var(--_supporting-text-color);font-family:var(--_supporting-text-font);font-size:var(--_supporting-text-size);line-height:var(--_supporting-text-line-height);font-weight:var(--_supporting-text-weight);height:min-content;position:relative}slot[name=content]::slotted(*){box-sizing:border-box;padding:24px}.anchor{position:absolute}.top.anchor{top:0}.bottom.anchor{bottom:0}.actions{position:relative}slot[name=actions]::slotted(*){box-sizing:border-box;display:flex;gap:8px;justify-content:flex-end;padding:16px 24px 24px}.has-actions slot[name=content]::slotted(*){padding-bottom:8px}md-divider{display:none;position:absolute}.has-headline.show-top-divider .headline md-divider,.has-actions.show-bottom-divider .actions md-divider{display:flex}.headline md-divider{bottom:0}.actions md-divider{top:0}@media(forced-colors: active){dialog{outline:2px solid WindowText}}/*# sourceMappingURL=dialog-styles.css.map */\n`;\n "]}
+{"version":3,"file":"dialog-styles.css.js","sourceRoot":"","sources":["dialog-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-color: var(--md-dialog-container-color, var(--md-sys-color-surface-container-high, #ece6f0));--_container-shape: var(--md-dialog-container-shape, 28px);--_headline-color: var(--md-dialog-headline-color, var(--md-sys-color-on-surface, #1d1b20));--_headline-font: var(--md-dialog-headline-font, var(--md-sys-typescale-headline-small-font, var(--md-ref-typeface-brand, Roboto)));--_headline-line-height: var(--md-dialog-headline-line-height, var(--md-sys-typescale-headline-small-line-height, 2rem));--_headline-size: var(--md-dialog-headline-size, var(--md-sys-typescale-headline-small-size, 1.5rem));--_headline-weight: var(--md-dialog-headline-weight, var(--md-sys-typescale-headline-small-weight, var(--md-ref-typeface-weight-regular, 400)));--_supporting-text-color: var(--md-dialog-supporting-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_supporting-text-font: var(--md-dialog-supporting-text-font, var(--md-sys-typescale-body-medium-font, var(--md-ref-typeface-plain, Roboto)));--_supporting-text-line-height: var(--md-dialog-supporting-text-line-height, var(--md-sys-typescale-body-medium-line-height, 1.25rem));--_supporting-text-size: var(--md-dialog-supporting-text-size, var(--md-sys-typescale-body-medium-size, 0.875rem));--_supporting-text-weight: var(--md-dialog-supporting-text-weight, var(--md-sys-typescale-body-medium-weight, var(--md-ref-typeface-weight-regular, 400)));--_icon-color: var(--md-dialog-icon-color, var(--md-sys-color-secondary, #625b71));--_icon-size: var(--md-dialog-icon-size, 24px);--_container-shape-start-start: var( --md-dialog-container-shape-start-start, var(--_container-shape) );--_container-shape-start-end: var( --md-dialog-container-shape-start-end, var(--_container-shape) );--_container-shape-end-end: var( --md-dialog-container-shape-end-end, var(--_container-shape) );--_container-shape-end-start: var( --md-dialog-container-shape-end-start, var(--_container-shape) );border-start-start-radius:var(--_container-shape-start-start);border-start-end-radius:var(--_container-shape-start-end);border-end-end-radius:var(--_container-shape-end-end);border-end-start-radius:var(--_container-shape-end-start);display:contents;margin:auto;max-height:min(560px,100% - 48px);max-width:min(560px,100% - 48px);min-height:140px;min-width:280px;position:fixed;height:fit-content;width:fit-content}dialog{background:rgba(0,0,0,0);border:none;border-radius:inherit;flex-direction:column;height:inherit;margin:inherit;max-height:inherit;max-width:inherit;min-height:inherit;min-width:inherit;outline:none;overflow:visible;padding:0;width:inherit}dialog[open]{display:flex}::backdrop{background:none}.scrim{background:var(--md-sys-color-scrim, #000);display:none;inset:0;opacity:32%;pointer-events:none;position:fixed;z-index:1}:host([open]) .scrim{display:flex}h2{all:unset;align-self:stretch}.headline{align-items:center;color:var(--_headline-color);display:flex;flex-direction:column;font-family:var(--_headline-font);font-size:var(--_headline-size);line-height:var(--_headline-line-height);font-weight:var(--_headline-weight);position:relative}slot[name=headline]::slotted(*){align-items:center;align-self:stretch;box-sizing:border-box;display:flex;gap:8px;padding:24px 24px 0}.icon{display:flex}slot[name=icon]::slotted(*){color:var(--_icon-color);fill:currentColor;font-size:var(--_icon-size);margin-top:24px;height:var(--_icon-size);width:var(--_icon-size)}.has-icon slot[name=headline]::slotted(*){justify-content:center;padding-top:16px}.scrollable slot[name=headline]::slotted(*){padding-bottom:16px}.scrollable.has-headline slot[name=content]::slotted(*){padding-top:8px}.container{border-radius:inherit;display:flex;flex-direction:column;flex-grow:1;overflow:hidden;position:relative;transform-origin:top}.container::before{background:var(--_container-color);border-radius:inherit;content:\"\";inset:0;position:absolute}.scroller{display:flex;flex:1;flex-direction:column;overflow:hidden;z-index:1}.scrollable .scroller{overflow-y:scroll}.content{color:var(--_supporting-text-color);font-family:var(--_supporting-text-font);font-size:var(--_supporting-text-size);line-height:var(--_supporting-text-line-height);font-weight:var(--_supporting-text-weight);height:min-content;position:relative}slot[name=content]::slotted(*){box-sizing:border-box;padding:24px}.anchor{position:absolute}.top.anchor{top:0}.bottom.anchor{bottom:0}.actions{position:relative}slot[name=actions]::slotted(*){box-sizing:border-box;display:flex;gap:8px;justify-content:flex-end;padding:16px 24px 24px}.has-actions slot[name=content]::slotted(*){padding-bottom:8px}md-divider{display:none;position:absolute}.has-headline.show-top-divider .headline md-divider,.has-actions.show-bottom-divider .actions md-divider{display:flex}.headline md-divider{bottom:0}.actions md-divider{top:0}@media(forced-colors: active){dialog{outline:2px solid WindowText}}/*# sourceMappingURL=dialog-styles.css.map */\n`;\n "]}

package/dialog/internal/dialog.d.ts

@@ -9,12 +9,12 @@ import { DialogAnimation } from './animations.js';
 /**
  * A dialog component.
  *
- * @fires open Dispatched when the dialog is opening before any animations.
- * @fires opened Dispatched when the dialog has opened after any animations.
- * @fires close Dispatched when the dialog is closing before any animations.
- * @fires closed Dispatched when the dialog has closed after any animations.
- * @fires cancel Dispatched when the dialog has been canceled by clicking on the
- *     scrim or pressing Escape.
+ * @fires open {Event} Dispatched when the dialog is opening before any animations.
+ * @fires opened {Event} Dispatched when the dialog has opened after any animations.
+ * @fires close {Event} Dispatched when the dialog is closing before any animations.
+ * @fires closed {Event} Dispatched when the dialog has closed after any animations.
+ * @fires cancel {Event} Dispatched when the dialog has been canceled by clicking
+ * on the scrim or pressing Escape.
  */
 export declare class Dialog extends LitElement {
     /** @nocollapse */