@api-client/ui 0.3.3 → 0.3.5

package/build/src/md/chip/internals/Chip.js.map

@@ -1 +1 @@
-{"version":3,"file":"Chip.js","sourceRoot":"","sources":["../../../../../src/md/chip/internals/Chip.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,sCAAsC,CAAA;AAClE,OAAO,EAAE,IAAI,EAAE,OAAO,EAAkC,MAAM,KAAK,CAAA;AACnE,OAAO,EAAE,QAAQ,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AAC/D,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAA;AACtD,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAA;AAC7C,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAA;AAE9C,OAAO,EAAE,MAAM,EAAE,MAAM,kCAAkC,CAAA;AACzD,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAA;AAClE,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AAEtD,OAAO,2BAA2B,CAAA;AAElC,MAAM,CAAN,IAAY,QAKX;AALD,WAAY,QAAQ;IAClB,6BAAiB,CAAA;IACjB,6BAAiB,CAAA;IACjB,2BAAe,CAAA;IACf,qCAAyB,CAAA;AAC3B,CAAC,EALW,QAAQ,KAAR,QAAQ,QAKnB;;sBAUmC,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAAxB,MAAO,SAAQ,WAAS;;;oCAK1C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;gCAQ1C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;oCAM1B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;oCAM1C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;mCAO1C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;gCAS1C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;kCAEzC,UAAU,CAAC,WAAW,CAAC;sCAEvB,KAAK,EAAE;mCAKP,KAAK,EAAE;qCAKP,KAAK,EAAE;YAlDoC,6KAAS,QAAQ,6BAAR,QAAQ,2FAAQ;YAQzC,iKAAS,IAAI,6BAAJ,IAAI,mFAAU;YAMP,6KAAS,QAAQ,6BAAR,QAAQ,2FAAqB;YAMtC,6KAAS,QAAQ,6BAAR,QAAQ,2FAAqB;YAOtC,0KAAS,OAAO,6BAAP,OAAO,yFAAqB;YAStC,iKAAS,IAAI,6BAAJ,IAAI,mFAAoB;YAEnD,uKAAmB,MAAM,6BAAN,MAAM,uFAA2B;YAEpE,mLAAmB,UAAU,6BAAV,UAAU,+FAAQ;YAKrC,0KAAmB,OAAO,6BAAP,OAAO,yFAAS;YAKnC,gLAAmB,SAAS,6BAAT,SAAS,6FAAS;;;QAlDF,6EAAoB,KAAK;QAErE;;;;;WAKG;UAPkE;QAJrE;;;WAGG;QACyC,IAAS,QAAQ,8CAAQ;QAAzB,IAAS,QAAQ,oDAAQ;QAQzC,qIAAuB;QANnD;;;;;WAKG;QACyB,IAAS,IAAI,0CAAU;QAAvB,IAAS,IAAI,gDAAU;QAMP,yIAAsC;QAJlF;;;WAGG;QACyC,IAAS,QAAQ,8CAAqB;QAAtC,IAAS,QAAQ,oDAAqB;QAMtC,6IAAsC;QAJlF;;;WAGG;QACyC,IAAS,QAAQ,8CAAqB;QAAtC,IAAS,QAAQ,oDAAqB;QAOtC,2IAAqC;QALjF;;;;WAIG;QACyC,IAAS,OAAO,6CAAqB;QAArC,IAAS,OAAO,mDAAqB;QAStC,oIAAiC;QAP5E;;;;;;WAMG;QACwC,IAAS,IAAI,0CAAoB;QAAjC,IAAS,IAAI,gDAAoB;QAEnD,qIAAoD;QAApD,IAAmB,MAAM,4CAA2B;QAApD,IAAmB,MAAM,kDAA2B;QAEpE,sIAAgC,KAAK;QAE9C;;WAEG;WAJ2C;QAArC,IAAmB,UAAU,gDAAQ;QAArC,IAAmB,UAAU,sDAAQ;QAKrC,6IAAmC;QAH5C;;WAEG;QACM,IAAmB,OAAO,6CAAS;QAAnC,IAAmB,OAAO,mDAAS;QAKnC,8IAAqC;QAH9C;;WAEG;QACM,IAAmB,SAAS,+CAAS;QAArC,IAAmB,SAAS,qDAAS;QAE9C;YACE,KAAK,EAAE,CAAA;YAEP,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAA;YACrB,IAAI,CAAC,IAAI,GAAG,QAAQ,CAAC,MAAM,CAAA;YAC3B,IAAI,CAAC,OAAO,GAAG,KAAK,CAAA;YACpB,IAAI,CAAC,SAAS,GAAG,KAAK,CAAA;YAEtB,IAAI,CAAC,gBAAgB,CAAC,oBAAoB,GAAG,IAAI,CAAA;YAEjD,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;YAC3D,IAAI,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;YAC/D,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;YAC3D,IAAI,CAAC,gBAAgB,CAAC,aAAa,EAAE,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;YACvE,IAAI,CAAC,gBAAgB,CAAC,WAAW,EAAE,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;YACnE,IAAI,CAAC,gBAAgB,CAAC,eAAe,EAAE,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;YAC3E,IAAI,CAAC,gBAAgB,CAAC,cAAc,EAAE,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;YACzE,IAAI,CAAC,gBAAgB,CAAC,aAAa,EAAE,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;YACvE,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;YAC3D,IAAI,CAAC,gBAAgB,CAAC,MAAM,EAAE,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;QAC3D,CAAC;QAEQ,iBAAiB;YACxB,KAAK,CAAC,iBAAiB,EAAE,CAAA;YACzB,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,EAAE,CAAC;gBAC/B,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAA;YACrC,CAAC;YACD,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC;gBACrD,IAAI,CAAC,YAAY,CAAC,UAAU,EAAE,GAAG,CAAC,CAAA;YACpC,CAAC;QACH,CAAC;QAEkB,UAAU,CAAC,EAAwB;YACpD,IAAI,EAAE,CAAC,GAAG,CAAC,UAAU,CAAC,EAAE,CAAC;gBACvB,WAAW,CAAC,IAAI,EAAE,EAAE,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC,CAAA;YACvC,CAAC;QACH,CAAC;QAES,KAAK,CAAC,WAAW;YACzB,MAAM,OAAO,GAAG,MAAM,IAAI,CAAC,SAAS,EAAE,CAAA;YACtC,IAAI,OAAO,IAAI,CAAC,OAAO,CAAC,SAAS,EAAE,CAAC;gBAClC,OAAO,CAAC,UAAU,EAAE,CAAA;YACtB,CAAC;QACH,CAAC;QAES,KAAK,CAAC,SAAS;YACvB,MAAM,OAAO,GAAG,MAAM,IAAI,CAAC,SAAS,EAAE,CAAA;YACtC,OAAO,EAAE,QAAQ,EAAE,CAAA;QACrB,CAAC;QAEQ,UAAU,CAAC,OAAyB;YAC3C,KAAK,CAAC,UAAU,CAAC,OAAO,CAAC,CAAA;YACzB,IAAI,CAAC,WAAW,EAAE,CAAA;QACpB,CAAC;QAEQ,KAAK,CAAC,aAAa,CAAC,CAAgB;YAC3C,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,CAAA;YACtB,IAAI,IAAI,CAAC,IAAI,KAAK,QAAQ,CAAC,MAAM,IAAI,CAAC,CAAC,IAAI,KAAK,WAAW,EAAE,CAAC;gBAC5D,CAAC,CAAC,cAAc,EAAE,CAAA;gBAClB,IAAI,CAAC,UAAU,EAAE,CAAA;YACnB,CAAC;iBAAM,IAAI,IAAI,CAAC,QAAQ,IAAI,CAAC,CAAC,IAAI,KAAK,WAAW,EAAE,CAAC;gBACnD,CAAC,CAAC,cAAc,EAAE,CAAA;gBAClB,IAAI,CAAC,WAAW,EAAE,CAAA;YACpB,CAAC;QACH,CAAC;QAES,KAAK,CAAC,WAAW;YACzB,MAAM,OAAO,GAAG,MAAM,IAAI,CAAC,SAAS,EAAE,CAAA;YACtC,OAAO,EAAE,UAAU,EAAE,CAAA;QACvB,CAAC;QAES,KAAK,CAAC,UAAU;YACxB,MAAM,OAAO,GAAG,MAAM,IAAI,CAAC,SAAS,EAAE,CAAA;YACtC,OAAO,EAAE,QAAQ,EAAE,CAAA;QACrB,CAAC;QAEkB,SAAS,2DAAG,GAA6B,EAAE;YAC5D,IAAI,CAAC,UAAU,GAAG,IAAI,CAAA;YACtB,OAAO,IAAI,CAAC,MAAM,CAAA;QACpB,CAAC,EAAA;QAEQ,QAAQ,CAAC,IAAoB;YACpC,KAAK,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAA;YACpB,IAAI,CAAC,SAAS,EAAE,CAAA;YAChB,MAAM,EAAE,SAAS,EAAE,MAAM,EAAE,GAAG,IAAI,CAAA;YAClC,IAAI,SAAS,EAAE,CAAC;gBACd,OAAM;YACR,CAAC;YACD,IAAI,MAAM,KAAK,OAAO,IAAI,MAAM,KAAK,OAAO,EAAE,CAAC;gBAC7C,IAAI,CAAC,KAAK,EAAE,CAAA;YACd,CAAC;QACH,CAAC;QAEQ,WAAW,CAAC,CAAa;YAChC,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC,CAAA;YACpB,IAAI,IAAI,CAAC,IAAI,KAAK,QAAQ,CAAC,MAAM,EAAE,CAAC;gBAClC,IAAI,CAAC,aAAa,EAAE,CAAA;YACtB,CAAC;QACH,CAAC;QAED;;WAEG;QACH,aAAa;YACX,IAAI,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,OAAO,CAAA;YAC5B,IAAI,CAAC,aAAa,CAAC,IAAI,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;QACzC,CAAC;QAED;;WAEG;QACO,oBAAoB,CAAC,CAAQ;YACrC,MAAM,IAAI,GAAG,CAAC,CAAC,MAAyB,CAAA;YACxC,IAAI,CAAC,OAAO,GAAG,CAAC,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC,MAAM,CAAA;QAC9C,CAAC;QAED;;WAEG;QACO,sBAAsB,CAAC,CAAQ;YACvC,MAAM,IAAI,GAAG,CAAC,CAAC,MAAyB,CAAA;YACxC,IAAI,CAAC,SAAS,GAAG,CAAC,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC,MAAM,CAAA;QAChD,CAAC;QAES,eAAe,CAAC,CAAQ;YAChC,CAAC,CAAC,cAAc,EAAE,CAAA;YAClB,CAAC,CAAC,eAAe,EAAE,CAAA;YACnB,IAAI,CAAC,UAAU,EAAE,CAAA;QACnB,CAAC;QAES,WAAW,CAAC,CAAQ;YAC5B,CAAC,CAAC,cAAc,EAAE,CAAA;YAClB,CAAC,CAAC,eAAe,EAAE,CAAA;YACnB,IAAI,CAAC,WAAW,EAAE,CAAA;QACpB,CAAC;QAES,KAAK,CAAC,WAAW;YACzB,IAAI,CAAC,aAAa,CAAC,IAAI,KAAK,CAAC,OAAO,CAAC,CAAC,CAAA;QACxC,CAAC;QAES,KAAK,CAAC,UAAU;YACxB,IAAI,CAAC,aAAa,CAAC,IAAI,KAAK,CAAC,MAAM,CAAC,CAAC,CAAA;QACvC,CAAC;QAEkB,MAAM;YACvB,MAAM,EAAE,OAAO,GAAG,KAAK,EAAE,GAAG,IAAI,CAAA;YAChC,MAAM,gBAAgB,GAAG,QAAQ,CAAC;gBAChC,OAAO,EAAE,IAAI;gBACb,QAAQ,EAAE,IAAI,CAAC,OAAO;gBACtB,UAAU,EAAE,IAAI,CAAC,SAAS;gBAC1B,OAAO;aACR,CAAC,CAAA;YACF,OAAO,IAAI,CAAA;oBACK,gBAAgB,KAAK,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC;;UAErD,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE,IAAI,CAAC,YAAY,CAAC;;YAEtC,IAAI,CAAC,iBAAiB,EAAE,IAAI,IAAI,CAAC,YAAY,EAAE;;YAE/C,IAAI,CAAC,kBAAkB,EAAE;;;KAGhC,CAAA;QACH,CAAC;QAES,iBAAiB;YACzB,MAAM,EAAE,IAAI,EAAE,GAAG,IAAI,CAAA;YACrB,IAAI,IAAI,KAAK,QAAQ,CAAC,UAAU,EAAE,CAAC;gBACjC,OAAO,OAAO,CAAA;YAChB,CAAC;YACD,IAAI,IAAI,KAAK,QAAQ,CAAC,MAAM,EAAE,CAAC;gBAC7B,MAAM,WAAW,GAAG,QAAQ,CAAC;oBAC3B,cAAc,EAAE,IAAI;oBACpB,YAAY,EAAE,IAAI;oBAClB,SAAS,EAAE,CAAC,CAAC,IAAI,CAAC,OAAO;iBAC1B,CAAC,CAAA;gBACF,OAAO,IAAI,CAAA,gBAAgB,WAAW,yBAAyB,KAAK,SAAS,CAAA;YAC/E,CAAC;YACD,OAAO,IAAI,CAAA,kCAAkC,IAAI,CAAC,oBAAoB,WAAW,CAAA;QACnF,CAAC;QAES,YAAY;YACpB,MAAM,EAAE,IAAI,EAAE,GAAG,IAAI,CAAA;YACrB,IAAI,IAAI,KAAK,QAAQ,CAAC,KAAK,EAAE,CAAC;gBAC5B,OAAO,IAAI,CAAA,oCAAoC,IAAI,CAAC,sBAAsB,WAAW,CAAA;YACvF,CAAC;YACD,OAAO,OAAO,CAAA;QAChB,CAAC;QAES,kBAAkB;YAC1B,MAAM,EAAE,QAAQ,GAAG,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,IAAI,CAAA;YAC7C,IAAI,IAAI,KAAK,QAAQ,CAAC,MAAM,EAAE,CAAC;gBAC7B,IAAI,IAAI,EAAE,CAAC;oBACT,OAAO,IAAI,CAAA;;;oBAGC,IAAI,CAAC,eAAe;uBACjB,WAAW;aACrB,aAAa;UAChB,CAAA;gBACJ,CAAC;YACH,CAAC;YACD,IAAI,IAAI,KAAK,QAAQ,CAAC,KAAK,IAAI,QAAQ,EAAE,CAAC;gBACxC,OAAO,IAAI,CAAA;;kBAEC,IAAI,CAAC,WAAW;qBACb,WAAW;;;WAGrB,KAAK;QACR,CAAA;YACJ,CAAC;YACD,OAAO,OAAO,CAAA;QAChB,CAAC;QAES,YAAY,GAAG,GAAmB,EAAE;YAC5C,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAA;YACzB,OAAO,IAAI,CAAA,wCAAwC,QAAQ,gBAAgB,CAAA;QAC7E,CAAC,CAAA;;;AA3RH;;;;;;;GAOG;AACH,sBAoRC","sourcesContent":["import { cancelEvent } from '@api-client/core/lib/events/Utils.js'\nimport { html, nothing, PropertyValues, TemplateResult } from 'lit'\nimport { property, queryAsync, state } from 'lit/decorators.js'\nimport { classMap } from 'lit/directives/class-map.js'\nimport { when } from 'lit/directives/when.js'\nimport { UiElement } from '../../UiElement.js'\nimport UiRipple from '../../ripple/internals/ripple.js'\nimport { ripple } from '../../effects/rippleDirective.js'\nimport { close, arrowDropDown, check } from '../../icons/Icons.js'\nimport { setDisabled } from '../../../lib/disabled.js'\nimport { BeginPressConfig, EndPressConfig } from '../../../controllers/ActionController.js'\nimport '../../ripple/ui-ripple.js'\n\nexport enum ChipType {\n  assist = 'assist',\n  filter = 'filter',\n  input = 'input',\n  suggestion = 'suggestion',\n}\n\n/**\n * @slot The content of the chip.\n * @slot icon - The leading icon, sized 18x18 px\n * @slot avatar - The leading image, sized 24x24 px\n * @fires list - When the user requested to activate the list associated with the element.\n * @fires select - When the checked state changed through a user interaction. This only related to\n *                 `filter` chips. Note, `select` is dispatched just before the `click` event.\n */\nexport default class UiChip extends UiElement {\n  /**\n   * Whether the chip is disabled. The user can't interact with the chip when `true`.\n   * @attribute\n   */\n  @property({ type: Boolean, reflect: true }) accessor disabled = false\n\n  /**\n   * The type of the rendered chip.\n   * @attribute\n   *\n   * @see https://m3.material.io/components/chips/guidelines\n   */\n  @property({ type: String }) accessor type: ChipType\n\n  /**\n   * Whether the chip should be rendered as elevated.\n   * @attribute\n   */\n  @property({ type: Boolean, reflect: true }) accessor elevated: boolean | undefined\n\n  /**\n   * Whether the chip renders the \"close\" icon at the end.\n   * @attribute\n   */\n  @property({ type: Boolean, reflect: true }) accessor closable: boolean | undefined\n\n  /**\n   * Whether the chip is currently checked.\n   * Note, this controls the presentation layer only. It has no meaning when it comes to forms and inputs.\n   * @attribute\n   */\n  @property({ type: Boolean, reflect: true }) accessor checked: boolean | undefined\n\n  /**\n   * The ID attribute of the list element that is rendered after activating the chip.\n   * When this is set the chip renders the dropdown icon at the end and sets `aria-*`\n   * attributes informing the assistive technology that this chip controls a list.\n   *\n   * @attribute\n   */\n  @property({ type: String, reflect: true }) accessor list: string | undefined\n\n  @queryAsync('ui-ripple') protected accessor ripple!: Promise<UiRipple | null>\n\n  @state() protected accessor showRipple = false\n\n  /**\n   * Determines when the element has an icon in the \"icon\" slot.\n   */\n  @state() protected accessor hasIcon: boolean\n\n  /**\n   * Determines when the element has an image in the \"avatar\" slot.\n   */\n  @state() protected accessor hasAvatar: boolean\n\n  constructor() {\n    super()\n\n    this.disabled = false\n    this.type = ChipType.assist\n    this.hasIcon = false\n    this.hasAvatar = false\n\n    this.actionController.cancelKeyboardEvents = true\n\n    this.addEventListener('click', this.handleClick.bind(this))\n    this.addEventListener('keydown', this.handleKeyDown.bind(this))\n    this.addEventListener('keyup', this.handleKeyUp.bind(this))\n    this.addEventListener('pointerdown', this.handlePointerDown.bind(this))\n    this.addEventListener('pointerup', this.handlePointerUp.bind(this))\n    this.addEventListener('pointercancel', this.handlePointerCancel.bind(this))\n    this.addEventListener('pointerleave', this.handlePointerLeave.bind(this))\n    this.addEventListener('contextmenu', this.handleContextMenu.bind(this))\n    this.addEventListener('focus', this.handleFocus.bind(this))\n    this.addEventListener('blur', this.handleBlur.bind(this))\n  }\n\n  override connectedCallback(): void {\n    super.connectedCallback()\n    if (!this.hasAttribute('role')) {\n      this.setAttribute('role', 'button')\n    }\n    if (!this.hasAttribute('tabindex') && !this.disabled) {\n      this.setAttribute('tabindex', '0')\n    }\n  }\n\n  protected override willUpdate(cp: PropertyValues<this>): void {\n    if (cp.has('disabled')) {\n      setDisabled(this, cp.get('disabled'))\n    }\n  }\n\n  protected async pressRipple(): Promise<void> {\n    const element = await this.getRipple()\n    if (element && !element.isPressed) {\n      element.beginPress()\n    }\n  }\n\n  protected async endRipple(): Promise<void> {\n    const element = await this.getRipple()\n    element?.endPress()\n  }\n\n  override beginPress(options: BeginPressConfig): void {\n    super.beginPress(options)\n    this.pressRipple()\n  }\n\n  override async handleKeyDown(e: KeyboardEvent): Promise<void> {\n    super.handleKeyDown(e)\n    if (this.type === ChipType.filter && e.code === 'ArrowDown') {\n      e.preventDefault()\n      this.listAction()\n    } else if (this.closable && e.code === 'Backspace') {\n      e.preventDefault()\n      this.closeAction()\n    }\n  }\n\n  protected async handleFocus(): Promise<void> {\n    const element = await this.getRipple()\n    element?.beginFocus()\n  }\n\n  protected async handleBlur(): Promise<void> {\n    const element = await this.getRipple()\n    element?.endFocus()\n  }\n\n  protected readonly getRipple = (): Promise<UiRipple | null> => {\n    this.showRipple = true\n    return this.ripple\n  }\n\n  override endPress(info: EndPressConfig): void {\n    super.endPress(info)\n    this.endRipple()\n    const { cancelled, reason } = info\n    if (cancelled) {\n      return\n    }\n    if (reason === 'enter' || reason === 'space') {\n      this.click()\n    }\n  }\n\n  override handleClick(e: MouseEvent): void {\n    super.handleClick(e)\n    if (this.type === ChipType.filter) {\n      this.toggleChecked()\n    }\n  }\n\n  /**\n   * Toggles the \"filter\" type of the chip.\n   */\n  toggleChecked(): void {\n    this.checked = !this.checked\n    this.dispatchEvent(new Event('select'))\n  }\n\n  /**\n   * Sets the `hasIcon` state property when the \"icon\" slot change event is dispatched.\n   */\n  protected handleIconSlotChange(e: Event): void {\n    const slot = e.target as HTMLSlotElement\n    this.hasIcon = !!slot.assignedNodes().length\n  }\n\n  /**\n   * Sets the `_hasAvatar` state property when the \"avatar\" slot change event is dispatched.\n   */\n  protected handleAvatarSlotChange(e: Event): void {\n    const slot = e.target as HTMLSlotElement\n    this.hasAvatar = !!slot.assignedNodes().length\n  }\n\n  protected handleListClick(e: Event): void {\n    e.preventDefault()\n    e.stopPropagation()\n    this.listAction()\n  }\n\n  protected handleClose(e: Event): void {\n    e.preventDefault()\n    e.stopPropagation()\n    this.closeAction()\n  }\n\n  protected async closeAction(): Promise<void> {\n    this.dispatchEvent(new Event('close'))\n  }\n\n  protected async listAction(): Promise<void> {\n    this.dispatchEvent(new Event('list'))\n  }\n\n  protected override render(): TemplateResult {\n    const { pressed = false } = this\n    const containerClasses = classMap({\n      surface: true,\n      withIcon: this.hasIcon,\n      withAvatar: this.hasAvatar,\n      pressed,\n    })\n    return html`\n      <div class=\"${containerClasses}\" ${ripple(this.getRipple)}>\n        <div class=\"container\"></div>\n        ${when(this.showRipple, this.renderRipple)}\n        <div class=\"content\">\n          ${this.renderLeadingIcon()} ${this.renderAvatar()}\n          <slot></slot>\n          ${this.renderTrailingIcon()}\n        </div>\n      </div>\n    `\n  }\n\n  protected renderLeadingIcon(): TemplateResult | typeof nothing {\n    const { type } = this\n    if (type === ChipType.suggestion) {\n      return nothing\n    }\n    if (type === ChipType.filter) {\n      const iconClasses = classMap({\n        'leading-icon': true,\n        'check-mark': true,\n        'checked': !!this.checked,\n      })\n      return html`<span class=\"${iconClasses}\" role=\"presentation\">${check}</span>`\n    }\n    return html`<slot name=\"icon\" @slotchange=\"${this.handleIconSlotChange}\"></slot>`\n  }\n\n  protected renderAvatar(): TemplateResult | typeof nothing {\n    const { type } = this\n    if (type === ChipType.input) {\n      return html`<slot name=\"avatar\" @slotchange=\"${this.handleAvatarSlotChange}\"></slot>`\n    }\n    return nothing\n  }\n\n  protected renderTrailingIcon(): TemplateResult | typeof nothing {\n    const { closable = false, list, type } = this\n    if (type === ChipType.filter) {\n      if (list) {\n        return html`<span\n          class=\"trailing-icon\"\n          role=\"presentation\"\n          @click=\"${this.handleListClick}\"\n          @keypress=\"${cancelEvent}\"\n          >${arrowDropDown}</span\n        >`\n      }\n    }\n    if (type === ChipType.input && closable) {\n      return html`<span\n        class=\"trailing-icon\"\n        @click=\"${this.handleClose}\"\n        @keypress=\"${cancelEvent}\"\n        role=\"button\"\n        aria-label=\"Activate to close or disabled this chip.\"\n        >${close}</span\n      >`\n    }\n    return nothing\n  }\n\n  protected renderRipple = (): TemplateResult => {\n    const { disabled } = this\n    return html`<ui-ripple class=\"ripple\" ?disabled=\"${disabled}\"></ui-ripple>`\n  }\n}\n"]}
+{"version":3,"file":"Chip.js","sourceRoot":"","sources":["../../../../../src/md/chip/internals/Chip.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,sCAAsC,CAAA;AAClE,OAAO,EAAE,IAAI,EAAE,OAAO,EAAkC,MAAM,KAAK,CAAA;AACnE,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AAC1D,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAA;AACtD,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAA;AAE9C,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAA;AAClE,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AAEtD,OAAO,2BAA2B,CAAA;AAElC,MAAM,CAAN,IAAY,QAKX;AALD,WAAY,QAAQ;IAClB,6BAAiB,CAAA;IACjB,6BAAiB,CAAA;IACjB,2BAAe,CAAA;IACf,qCAAyB,CAAA;AAC3B,CAAC,EALW,QAAQ,KAAR,QAAQ,QAKnB;;sBAUmC,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAAxB,MAAO,SAAQ,WAAS;;;oCAK1C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;gCAQ1C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;oCAM1B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;qCAM1C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;mCAO1C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;gCAQ1C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;kCAE1C,KAAK,CAAC,WAAW,CAAC;mCAKlB,KAAK,EAAE;qCAKP,KAAK,EAAE;YA/CoC,6KAAS,QAAQ,6BAAR,QAAQ,2FAAQ;YAQzC,iKAAS,IAAI,6BAAJ,IAAI,mFAAU;YAMP,6KAAS,QAAQ,6BAAR,QAAQ,2FAAqB;YAMtC,gLAAS,SAAS,6BAAT,SAAS,6FAAqB;YAOvC,0KAAS,OAAO,6BAAP,OAAO,yFAAqB;YAQrC,iKAAS,IAAI,6BAAJ,IAAI,mFAAqB;YAE1D,uKAAmB,MAAM,6BAAN,MAAM,uFAAkB;YAKtD,0KAAmB,OAAO,6BAAP,OAAO,yFAAS;YAKnC,gLAAmB,SAAS,6BAAT,SAAS,6FAAS;;;QA/CF,6EAAoB,KAAK;QAErE;;;;;WAKG;UAPkE;QAJrE;;;WAGG;QACyC,IAAS,QAAQ,8CAAQ;QAAzB,IAAS,QAAQ,oDAAQ;QAQzC,qIAAuB;QANnD;;;;;WAKG;QACyB,IAAS,IAAI,0CAAU;QAAvB,IAAS,IAAI,gDAAU;QAMP,yIAAsC;QAJlF;;;WAGG;QACyC,IAAS,QAAQ,8CAAqB;QAAtC,IAAS,QAAQ,oDAAqB;QAMtC,+IAAuC;QAJnF;;;WAGG;QACyC,IAAS,SAAS,+CAAqB;QAAvC,IAAS,SAAS,qDAAqB;QAOvC,4IAAqC;QALjF;;;;WAIG;QACyC,IAAS,OAAO,6CAAqB;QAArC,IAAS,OAAO,mDAAqB;QAQrC,oIAAkC;QAN9E;;;;;WAKG;QACyC,IAAS,IAAI,0CAAqB;QAAlC,IAAS,IAAI,gDAAqB;QAE1D,qIAA2C;QAA3C,IAAmB,MAAM,4CAAkB;QAA3C,IAAmB,MAAM,kDAAkB;QAKtD,yIAAmC;QAH5C;;WAEG;QACM,IAAmB,OAAO,6CAAS;QAAnC,IAAmB,OAAO,mDAAS;QAKnC,8IAAqC;QAH9C;;WAEG;QACM,IAAmB,SAAS,+CAAS;QAArC,IAAmB,SAAS,qDAAS;QAE9C;YACE,KAAK,EAAE,CAAA;;YAEP,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAA;YACrB,IAAI,CAAC,IAAI,GAAG,QAAQ,CAAC,MAAM,CAAA;YAC3B,IAAI,CAAC,OAAO,GAAG,KAAK,CAAA;YACpB,IAAI,CAAC,SAAS,GAAG,KAAK,CAAA;YAEtB,IAAI,CAAC,gBAAgB,CAAC,oBAAoB,GAAG,IAAI,CAAA;YAEjD,IAAI,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;YAC/D,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;YAC3D,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;YAC3D,IAAI,CAAC,gBAAgB,CAAC,aAAa,EAAE,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;YACvE,IAAI,CAAC,gBAAgB,CAAC,WAAW,EAAE,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;YACnE,IAAI,CAAC,gBAAgB,CAAC,eAAe,EAAE,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;YAC3E,IAAI,CAAC,gBAAgB,CAAC,cAAc,EAAE,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;YACzE,IAAI,CAAC,gBAAgB,CAAC,cAAc,EAAE,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;YACzE,IAAI,CAAC,gBAAgB,CAAC,aAAa,EAAE,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;YACvE,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;YAC3D,IAAI,CAAC,gBAAgB,CAAC,MAAM,EAAE,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;SAC1D;QAEQ,iBAAiB;YACxB,KAAK,CAAC,iBAAiB,EAAE,CAAA;YACzB,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,EAAE,CAAC;gBAC/B,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAA;YACrC,CAAC;YACD,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC;gBACrD,IAAI,CAAC,YAAY,CAAC,UAAU,EAAE,GAAG,CAAC,CAAA;YACpC,CAAC;QACH,CAAC;QAEkB,UAAU,CAAC,EAAwB;YACpD,IAAI,EAAE,CAAC,GAAG,CAAC,UAAU,CAAC,EAAE,CAAC;gBACvB,WAAW,CAAC,IAAI,EAAE,EAAE,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC,CAAA;YACvC,CAAC;QACH,CAAC;QAEQ,UAAU,CAAC,OAAyB;YAC3C,KAAK,CAAC,UAAU,CAAC,OAAO,CAAC,CAAA;YACzB,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,SAAS,CAAC,CAAA;YAC7B,IAAI,CAAC,MAAM,EAAE,UAAU,CAAC,OAAO,CAAC,aAAa,CAAC,CAAA;QAChD,CAAC;QAEQ,KAAK,CAAC,aAAa,CAAC,CAAgB;YAC3C,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,CAAA;YACtB,IAAI,IAAI,CAAC,SAAS,IAAI,CAAC,CAAC,IAAI,KAAK,WAAW,EAAE,CAAC;gBAC7C,CAAC,CAAC,cAAc,EAAE,CAAA;gBAClB,IAAI,CAAC,YAAY,EAAE,CAAA;YACrB,CAAC;QACH,CAAC;QAES,KAAK,CAAC,WAAW;YACzB,IAAI,CAAC,MAAM,EAAE,UAAU,EAAE,CAAA;QAC3B,CAAC;QAES,KAAK,CAAC,UAAU;YACxB,IAAI,CAAC,MAAM,EAAE,QAAQ,EAAE,CAAA;QACzB,CAAC;QAEQ,QAAQ,CAAC,IAAoB;YACpC,KAAK,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAA;YACpB,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,SAAS,CAAC,CAAA;YAChC,IAAI,CAAC,MAAM,EAAE,QAAQ,EAAE,CAAA;YACvB,MAAM,EAAE,SAAS,EAAE,MAAM,EAAE,GAAG,IAAI,CAAA;YAClC,IAAI,SAAS,EAAE,CAAC;gBACd,OAAM;YACR,CAAC;YACD,IAAI,MAAM,KAAK,OAAO,IAAI,MAAM,KAAK,OAAO,EAAE,CAAC;gBAC7C,IAAI,CAAC,KAAK,EAAE,CAAA;YACd,CAAC;QACH,CAAC;QAEQ,WAAW,CAAC,CAAa;YAChC,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC,CAAA;YACpB,IAAI,IAAI,CAAC,IAAI,KAAK,QAAQ,CAAC,MAAM,EAAE,CAAC;gBAClC,IAAI,CAAC,aAAa,EAAE,CAAA;YACtB,CAAC;QACH,CAAC;QAEQ,kBAAkB,CAAC,CAAe;YACzC,KAAK,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAA;YAC3B,IAAI,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC,CAAC,CAAA;QAC5B,CAAC;QAEQ,kBAAkB,CAAC,CAAe;YACzC,KAAK,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAA;YAC3B,IAAI,CAAC,MAAM,EAAE,QAAQ,EAAE,CAAA;QACzB,CAAC;QAED;;WAEG;QACH,aAAa;YACX,IAAI,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,OAAO,CAAA;YAC5B,IAAI,CAAC,aAAa,CAAC,IAAI,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;QACzC,CAAC;QAED;;WAEG;QACO,oBAAoB,CAAC,CAAQ;YACrC,MAAM,IAAI,GAAG,CAAC,CAAC,MAAyB,CAAA;YACxC,IAAI,CAAC,OAAO,GAAG,CAAC,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC,MAAM,CAAA;QAC9C,CAAC;QAED;;WAEG;QACO,sBAAsB,CAAC,CAAQ;YACvC,MAAM,IAAI,GAAG,CAAC,CAAC,MAAyB,CAAA;YACxC,IAAI,CAAC,SAAS,GAAG,CAAC,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC,MAAM,CAAA;QAChD,CAAC;QAES,WAAW,CAAC,CAAQ;YAC5B,CAAC,CAAC,cAAc,EAAE,CAAA;YAClB,CAAC,CAAC,eAAe,EAAE,CAAA;YACnB,IAAI,CAAC,YAAY,EAAE,CAAA;QACrB,CAAC;QAES,KAAK,CAAC,YAAY;YAC1B,IAAI,CAAC,aAAa,CAAC,IAAI,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;QACzC,CAAC;QAEkB,MAAM;YACvB,MAAM,gBAAgB,GAAG,QAAQ,CAAC;gBAChC,SAAS,EAAE,IAAI;gBACf,UAAU,EAAE,IAAI,CAAC,OAAO;gBACxB,YAAY,EAAE,IAAI,CAAC,SAAS;gBAC5B,mBAAmB,EAAE,IAAI,CAAC,eAAe;aAC1C,CAAC,CAAA;YACF,OAAO,IAAI,CAAA;QACP,IAAI,CAAC,YAAY,EAAE;oBACP,gBAAgB;UAC1B,IAAI,CAAC,iBAAiB,EAAE,IAAI,IAAI,CAAC,YAAY,EAAE;;UAE/C,IAAI,CAAC,kBAAkB,EAAE;;KAE9B,CAAA;QACH,CAAC;QAES,YAAY;YACpB,OAAO,IAAI,CAAA,wCAAwC,IAAI,CAAC,QAAQ,gBAAgB,CAAA;QAClF,CAAC;QAES,iBAAiB;YACzB,MAAM,EAAE,IAAI,EAAE,GAAG,IAAI,CAAA;YACrB,IAAI,IAAI,KAAK,QAAQ,CAAC,UAAU,EAAE,CAAC;gBACjC,OAAO,OAAO,CAAA;YAChB,CAAC;YACD,IAAI,IAAI,KAAK,QAAQ,CAAC,MAAM,EAAE,CAAC;gBAC7B,MAAM,WAAW,GAAG,QAAQ,CAAC;oBAC3B,cAAc,EAAE,IAAI;oBACpB,YAAY,EAAE,IAAI;oBAClB,SAAS,EAAE,CAAC,CAAC,IAAI,CAAC,OAAO;iBAC1B,CAAC,CAAA;gBACF,OAAO,IAAI,CAAA,gBAAgB,WAAW,yBAAyB,KAAK,SAAS,CAAA;YAC/E,CAAC;YACD,OAAO,IAAI,CAAA,uDAAuD,IAAI,CAAC,oBAAoB,WAAW,CAAA;QACxG,CAAC;QAES,YAAY;YACpB,OAAO,IAAI,CAAA,oCAAoC,IAAI,CAAC,sBAAsB,WAAW,CAAA;QACvF,CAAC;QAES,kBAAkB;YAC1B,MAAM,EAAE,SAAS,GAAG,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,IAAI,CAAA;YAC9C,IAAI,IAAI,KAAK,QAAQ,CAAC,MAAM,IAAI,IAAI,EAAE,CAAC;gBACrC,OAAO,IAAI,CAAA,mDAAmD,aAAa,SAAS,CAAA;YACtF,CAAC;YACD,IAAI,IAAI,KAAK,QAAQ,CAAC,KAAK,IAAI,SAAS,EAAE,CAAC;gBACzC,OAAO,IAAI,CAAA;;kBAEC,IAAI,CAAC,WAAW;qBACb,WAAW;;;WAGrB,KAAK;QACR,CAAA;YACJ,CAAC;YACD,OAAO,OAAO,CAAA;QAChB,CAAC;QAED,IAAI,eAAe;YACjB,MAAM,EAAE,SAAS,GAAG,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,IAAI,CAAA;YAC9C,IAAI,IAAI,KAAK,QAAQ,CAAC,MAAM,IAAI,IAAI,EAAE,CAAC;gBACrC,OAAO,IAAI,CAAA;YACb,CAAC;YACD,IAAI,IAAI,KAAK,QAAQ,CAAC,KAAK,IAAI,SAAS,EAAE,CAAC;gBACzC,OAAO,IAAI,CAAA;YACb,CAAC;YACD,OAAO,KAAK,CAAA;QACd,CAAC;;;AA/PH;;;;;;;GAOG;AACH,sBAwPC","sourcesContent":["import { cancelEvent } from '@api-client/core/lib/events/Utils.js'\nimport { html, nothing, PropertyValues, TemplateResult } from 'lit'\nimport { property, query, state } from 'lit/decorators.js'\nimport { classMap } from 'lit/directives/class-map.js'\nimport { UiElement } from '../../UiElement.js'\nimport UiRipple from '../../ripple/internals/ripple.js'\nimport { close, arrowDropDown, check } from '../../icons/Icons.js'\nimport { setDisabled } from '../../../lib/disabled.js'\nimport { BeginPressConfig, EndPressConfig } from '../../../controllers/ActionController.js'\nimport '../../ripple/ui-ripple.js'\n\nexport enum ChipType {\n  assist = 'assist',\n  filter = 'filter',\n  input = 'input',\n  suggestion = 'suggestion',\n}\n\n/**\n * @slot The content of the chip.\n * @slot icon - The leading icon, sized 18x18 px\n * @slot avatar - The leading image, sized 24x24 px\n * @fires select - When the checked state changed through a user interaction. This only related to\n *                 `filter` chips. Note, `select` is dispatched just before the `click` event.\n * @fires remove - When the user clicks the \"remove\" icon on the chip.\n */\nexport default class UiChip extends UiElement {\n  /**\n   * Whether the chip is disabled. The user can't interact with the chip when `true`.\n   * @attribute\n   */\n  @property({ type: Boolean, reflect: true }) accessor disabled = false\n\n  /**\n   * The type of the rendered chip.\n   * @attribute\n   *\n   * @see https://m3.material.io/components/chips/guidelines\n   */\n  @property({ type: String }) accessor type: ChipType\n\n  /**\n   * Whether the chip should be rendered as elevated.\n   * @attribute\n   */\n  @property({ type: Boolean, reflect: true }) accessor elevated: boolean | undefined\n\n  /**\n   * Whether the chip renders the \"close\" icon at the end.\n   * @attribute\n   */\n  @property({ type: Boolean, reflect: true }) accessor removable: boolean | undefined\n\n  /**\n   * Whether the chip is currently checked.\n   * Note, this controls the presentation layer only. It has no meaning when it comes to forms and inputs.\n   * @attribute\n   */\n  @property({ type: Boolean, reflect: true }) accessor checked: boolean | undefined\n\n  /**\n   * When set, the chip will render a trailing icon that indicates that the chip is associated\n   * with a list. It does not do anything.\n   *\n   * @attribute\n   */\n  @property({ type: Boolean, reflect: true }) accessor list: boolean | undefined\n\n  @query('ui-ripple') protected accessor ripple!: UiRipple | null\n\n  /**\n   * Determines when the element has an icon in the \"icon\" slot.\n   */\n  @state() protected accessor hasIcon: boolean\n\n  /**\n   * Determines when the element has an image in the \"avatar\" slot.\n   */\n  @state() protected accessor hasAvatar: boolean\n\n  constructor() {\n    super()\n\n    this.disabled = false\n    this.type = ChipType.assist\n    this.hasIcon = false\n    this.hasAvatar = false\n\n    this.actionController.cancelKeyboardEvents = true\n\n    this.addEventListener('keydown', this.handleKeyDown.bind(this))\n    this.addEventListener('keyup', this.handleKeyUp.bind(this))\n    this.addEventListener('click', this.handleClick.bind(this))\n    this.addEventListener('pointerdown', this.handlePointerDown.bind(this))\n    this.addEventListener('pointerup', this.handlePointerUp.bind(this))\n    this.addEventListener('pointercancel', this.handlePointerCancel.bind(this))\n    this.addEventListener('pointerleave', this.handlePointerLeave.bind(this))\n    this.addEventListener('pointerenter', this.handlePointerEnter.bind(this))\n    this.addEventListener('contextmenu', this.handleContextMenu.bind(this))\n    this.addEventListener('focus', this.handleFocus.bind(this))\n    this.addEventListener('blur', this.handleBlur.bind(this))\n  }\n\n  override connectedCallback(): void {\n    super.connectedCallback()\n    if (!this.hasAttribute('role')) {\n      this.setAttribute('role', 'button')\n    }\n    if (!this.hasAttribute('tabindex') && !this.disabled) {\n      this.setAttribute('tabindex', '0')\n    }\n  }\n\n  protected override willUpdate(cp: PropertyValues<this>): void {\n    if (cp.has('disabled')) {\n      setDisabled(this, cp.get('disabled'))\n    }\n  }\n\n  override beginPress(options: BeginPressConfig): void {\n    super.beginPress(options)\n    this.classList.add('pressed')\n    this.ripple?.beginPress(options.positionEvent)\n  }\n\n  override async handleKeyDown(e: KeyboardEvent): Promise<void> {\n    super.handleKeyDown(e)\n    if (this.removable && e.code === 'Backspace') {\n      e.preventDefault()\n      this.removeAction()\n    }\n  }\n\n  protected async handleFocus(): Promise<void> {\n    this.ripple?.beginFocus()\n  }\n\n  protected async handleBlur(): Promise<void> {\n    this.ripple?.endFocus()\n  }\n\n  override endPress(info: EndPressConfig): void {\n    super.endPress(info)\n    this.classList.remove('pressed')\n    this.ripple?.endPress()\n    const { cancelled, reason } = info\n    if (cancelled) {\n      return\n    }\n    if (reason === 'enter' || reason === 'space') {\n      this.click()\n    }\n  }\n\n  override handleClick(e: MouseEvent): void {\n    super.handleClick(e)\n    if (this.type === ChipType.filter) {\n      this.toggleChecked()\n    }\n  }\n\n  override handlePointerEnter(e: PointerEvent): void {\n    super.handlePointerEnter(e)\n    this.ripple?.beginHover(e)\n  }\n\n  override handlePointerLeave(e: PointerEvent): void {\n    super.handlePointerLeave(e)\n    this.ripple?.endHover()\n  }\n\n  /**\n   * Toggles the \"filter\" type of the chip.\n   */\n  toggleChecked(): void {\n    this.checked = !this.checked\n    this.dispatchEvent(new Event('select'))\n  }\n\n  /**\n   * Sets the `hasIcon` state property when the \"icon\" slot change event is dispatched.\n   */\n  protected handleIconSlotChange(e: Event): void {\n    const slot = e.target as HTMLSlotElement\n    this.hasIcon = !!slot.assignedNodes().length\n  }\n\n  /**\n   * Sets the `_hasAvatar` state property when the \"avatar\" slot change event is dispatched.\n   */\n  protected handleAvatarSlotChange(e: Event): void {\n    const slot = e.target as HTMLSlotElement\n    this.hasAvatar = !!slot.assignedNodes().length\n  }\n\n  protected handleClose(e: Event): void {\n    e.preventDefault()\n    e.stopPropagation()\n    this.removeAction()\n  }\n\n  protected async removeAction(): Promise<void> {\n    this.dispatchEvent(new Event('remove'))\n  }\n\n  protected override render(): TemplateResult {\n    const containerClasses = classMap({\n      'surface': true,\n      'has-icon': this.hasIcon,\n      'has-avatar': this.hasAvatar,\n      'has-trailing-icon': this.hasTrailingIcon,\n    })\n    return html`\n      ${this.renderRipple()}\n      <div class=\"${containerClasses}\">\n        ${this.renderLeadingIcon()} ${this.renderAvatar()}\n        <slot></slot>\n        ${this.renderTrailingIcon()}\n      </div>\n    `\n  }\n\n  protected renderRipple(): TemplateResult {\n    return html`<ui-ripple class=\"ripple\" ?disabled=\"${this.disabled}\"></ui-ripple>`\n  }\n\n  protected renderLeadingIcon(): TemplateResult | typeof nothing {\n    const { type } = this\n    if (type === ChipType.suggestion) {\n      return nothing\n    }\n    if (type === ChipType.filter) {\n      const iconClasses = classMap({\n        'leading-icon': true,\n        'check-mark': true,\n        'checked': !!this.checked,\n      })\n      return html`<span class=\"${iconClasses}\" role=\"presentation\">${check}</span>`\n    }\n    return html`<slot class=\"leading-icon\" name=\"icon\" @slotchange=\"${this.handleIconSlotChange}\"></slot>`\n  }\n\n  protected renderAvatar(): TemplateResult | typeof nothing {\n    return html`<slot name=\"avatar\" @slotchange=\"${this.handleAvatarSlotChange}\"></slot>`\n  }\n\n  protected renderTrailingIcon(): TemplateResult | typeof nothing {\n    const { removable = false, list, type } = this\n    if (type === ChipType.filter && list) {\n      return html`<span class=\"trailing-icon\" role=\"presentation\">${arrowDropDown}</span>`\n    }\n    if (type === ChipType.input && removable) {\n      return html`<span\n        class=\"trailing-icon\"\n        @click=\"${this.handleClose}\"\n        @keypress=\"${cancelEvent}\"\n        role=\"button\"\n        aria-label=\"Activate to close or disabled this chip.\"\n        >${close}</span\n      >`\n    }\n    return nothing\n  }\n\n  get hasTrailingIcon(): boolean {\n    const { removable = false, list, type } = this\n    if (type === ChipType.filter && list) {\n      return true\n    }\n    if (type === ChipType.input && removable) {\n      return true\n    }\n    return false\n  }\n}\n"]}

package/build/src/md/chip/internals/Chip.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Chip.styles.d.ts","sourceRoot":"","sources":["../../../../../src/md/chip/internals/Chip.styles.ts"],"names":[],"mappings":";AAEA,wBAwKC"}
+{"version":3,"file":"Chip.styles.d.ts","sourceRoot":"","sources":["../../../../../src/md/chip/internals/Chip.styles.ts"],"names":[],"mappings":";AAEA,wBAqLC"}

package/build/src/md/chip/internals/Chip.styles.js

@@ -5,167 +5,180 @@ export default css `
     vertical-align: middle;
     outline: none;
     -webkit-tap-highlight-color: transparent;
-    height: 32px;
+    position: relative;
+    user-select: none;
 
     font-family: var(--md-sys-typescale-label-large-font);
     font-size: var(--md-sys-typescale-label-large-size);
     letter-spacing: var(--md-sys-typescale-label-large-tracking);
     line-height: var(--md-sys-typescale-label-large-height);
 
-    border-radius: var(--md-sys-shape-corner-small);
-    color: var(--md-sys-color-on-surface);
-    fill: var(--md-sys-color-primary);
-
-    user-select: none;
-
     --md-ripple-hover-state-layer-color: var(--md-sys-color-on-surface);
     --md-ripple-focus-state-layer-color: var(--md-sys-color-on-surface);
     --md-ripple-pressed-state-layer-color: var(--md-sys-color-primary);
-  }
 
-  :host([disabled]) {
-    pointer-events: none;
-  }
-
-  :host([disabled]) .container {
-    border-color: var(--md-sys-color-on-surface);
-    opacity: 0.12;
-  }
+    --_leading-icon-color: currentColor;
+    --_trailing-icon-color: currentColor;
+    --_background-color: transparent;
+    --_color: inherit;
+    --_shadow: var(--md-sys-elevation-0);
+    --_outline-color: transparent;
+    --_outline-size: 0;
+    --_inline-padding-start: 16px;
+    --_inline-padding-end: 16px;
+    --_avatar-size: 24px;
+    --_avatar-shape: 24px;
+    --_icon-size: 18px;
 
-  :host([disabled][elevated]) .container {
-    background-color: var(--md-sys-color-on-surface);
-    opacity: 0.12;
-    box-shadow: none;
-  }
-
-  :host([disabled]) .content {
-    color: var(--md-sys-color-on-surface);
-    opacity: 0.68;
-  }
-
-  .surface {
-    position: relative;
-    height: inherit;
-    border-radius: inherit;
+    height: 32px;
+    border-radius: var(--md-sys-shape-corner-small);
+    box-shadow: var(--_shadow);
+    border: var(--_outline-size) solid var(--_outline-color);
   }
 
   .ripple {
-    z-index: 0;
     border-radius: inherit;
+    transition: border-radius var(--md-sys-motion-duration-medium1) var(--md-sys-motion-easing-standard);
   }
 
-  .container {
-    position: absolute;
-    inset: 0;
+  .ripple.activated {
+    z-index: 1;
+  }
 
-    box-sizing: border-box;
-    border-radius: inherit;
-    border: 1px var(--md-sys-color-outline) solid;
-    z-index: 0;
+  :host([disabled]) {
+    --_background-color: color-mix(in srgb, var(--md-sys-color-on-surface) 12%, transparent);
+    --_color: color-mix(in srgb, var(--md-sys-color-on-surface) 38%, transparent);
+    --_leading-icon-color: color-mix(in srgb, var(--md-sys-color-on-surface) 38%, transparent);
+    --_trailing-icon-color: color-mix(in srgb, var(--md-sys-color-on-surface) 38%, transparent);
+    --_outline-color: color-mix(in srgb, var(--md-sys-color-on-surface) 12%, transparent);
+    box-shadow: none;
+    cursor: not-allowed;
+    pointer-events: none;
   }
 
-  .content {
+  .surface {
     height: inherit;
     display: flex;
     align-items: center;
     justify-content: start;
     box-sizing: border-box;
-    padding: 0 16px;
+    padding: 0 var(--_inline-padding-end) 0 var(--_inline-padding-start);
     border-radius: inherit;
-    border: 1px transparent solid;
-    position: relative;
-    z-index: 1;
+    background-color: var(--_background-color);
+    color: var(--_color);
+    gap: 0;
   }
 
-  :host([elevated]) .container {
-    background-color: var(--md-sys-color-surface);
-    box-shadow: var(--md-sys-elevation-1);
-    border-width: 0;
+  .leading-icon {
+    height: var(--_icon-size);
+    width: 0px;
+    overflow: hidden;
+    transition: width 230ms var(--md-sys-animation-easing-standard);
+    color: var(--_leading-icon-color);
+    fill: currentColor;
   }
 
-  .withIcon .content,
-  :host([type='filter'][checked]) .content {
-    padding-left: 8px;
+  .leading-icon::slotted(*) {
+    width: var(--_icon-size);
+    height: var(--_icon-size);
+    margin-right: 8px;
   }
 
-  .withAvatar .content {
-    padding-left: 4px;
+  slot[name='avatar']::slotted(*) {
+    width: var(--_avatar-size);
+    height: var(--_avatar-size);
+    border-radius: var(--_avatar-shape);
+    flex-shrink: 0;
+    flex-grow: 0;
+    margin-right: 8px;
   }
 
-  :host([closable]) .content,
-  :host([type='filter'][list]) .content {
-    padding-right: 8px;
+  .check-mark.checked {
+    width: 18px;
+    margin-right: 8px;
   }
 
-  .withIcon slot[name='icon']::slotted(*),
-  .withAvatar slot[name='avatar']::slotted(*) {
-    margin-right: 8px;
+  .trailing-icon {
+    margin-left: 8px;
+    width: 18px;
+    height: 18px;
+    color: var(--_trailing-icon-color);
+    fill: currentColor;
   }
 
-  slot[name='icon']::slotted(*) {
-    width: 16px;
-    height: 16px;
+  :host([elevated]) {
+    --_shadow: var(--md-sys-elevation-1);
+    border: none;
+    --_background-color: var(--md-sys-color-surface-container-low);
   }
 
-  slot[name='avatar']::slotted(*) {
-    width: 24px;
-    height: 24px;
-    border-radius: var(--md-sys-shape-corner-medium);
+  :host([elevated]:hover:not([disabled])) {
+    --_shadow: var(--md-sys-elevation-2);
   }
 
-  .leading-icon {
-    height: 18px;
-    width: 0px;
-    overflow: hidden;
-    transition: width 230ms var(--md-sys-animation-easing-standard);
+  .surface.has-trailing-icon {
+    --_inline-padding-end: 8px;
   }
 
-  .check-mark.checked {
-    width: 18px;
-    margin-right: 8px;
+  :host([type='assist']:not([disabled])) {
+    --_outline-color: var(--md-sys-color-outline-variant);
+    --_outline-size: 1px;
+    --_color: var(--md-sys-color-on-surface);
+    --_leading-icon-color: var(--md-sys-color-primary);
   }
 
-  .trailing-icon {
-    margin-left: 8px;
-    width: 18px;
-    height: 18px;
-    fill: var(--md-sys-color-on-surface-variant);
+  :host .has-icon {
+    --_inline-padding-start: 8px;
+  }
+
+  :host .has-avatar {
+    --_inline-padding-start: 4px;
+  }
+
+  :host([checked]) {
+    --_inline-padding-start: 8px;
+    --_background-color: var(--md-sys-color-secondary-container);
   }
 
-  :host([elevated]:hover) .container,
-  :host([elevated]:focus) .container {
-    box-shadow: var(--md-sys-elevation-2);
+  :host([type='filter']:not([disabled])) {
+    --_leading-icon-color: var(--md-sys-color-primary);
+    --_trailing-icon-color: var(--md-sys-on-surface-variant);
+    --_outline-color: var(--md-sys-color-outline-variant);
+    --_outline-size: 1px;
+    --_color: var(--md-sys-color-on-surface-variant);
   }
 
-  :host([elevated][dragged]) .container {
-    box-shadow: var(--md-sys-elevation-4);
+  :host([type='filter'][checked]) {
+    --_outline-size: 1px;
   }
 
-  :host([checked]) .container {
-    background-color: var(--md-sys-color-secondary-container);
-    border-width: 0;
+  :host([type='filter'][checked]:not([disabled])) {
+    --_leading-icon-color: var(--md-sys-color-on-secondary-container);
+    --_trailing-icon-color: var(--md-sys-on-secondary-container);
+    --_outline-color: var(--md-sys-color-secondary-container);
+    --_color: var(--md-sys-color-on-secondary-container);
   }
 
-  :host([type='filter']),
-  :host([type='filter']) .leading-icon {
-    color: var(--md-sys-color-on-surface-variant);
-    fill: var(--md-sys-color-on-surface-variant);
+  :host([type='input']:not([disabled])) {
+    --_outline-color: var(--md-sys-color-outline-variant);
+    --_outline-size: 1px;
+    --_leading-icon-color: var(--md-sys-color-primary);
+    --_trailing-icon-color: var(--md-sys-color-on-surface-variant);
+    --_color: var(--md-sys-color-on-surface-variant);
   }
 
-  :host([type='filter'][checked]),
-  :host([type='filter'][checked]) .leading-icon {
-    color: var(--md-sys-color-on-secondary-container);
+  :host([type='input'][checked]) {
+    --_outline-size: 0px;
   }
 
-  :host([type='input']) .container {
-    background-color: var(--md-sys-color-surface);
-    color: var(--md-sys-color-on-surface-variant);
+  :host([type='suggestion']) {
+    --_outline-size: 1px;
+    --_outline-color: var(--md-sys-color-outline-variant);
+    --_color: var(--md-sys-color-on-surface-variant);
   }
 
-  :host([type='input']) .leading-icon,
-  :host([type='input']) .trailing-icon {
-    color: var(--md-sys-color-on-surface-variant);
-    fill: var(--md-sys-color-on-surface-variant);
+  :host([type='suggestion']:not([disabled])) {
+    --_leading-icon-color: var(--md-sys-color-primary);
   }
 `;
 //# sourceMappingURL=Chip.styles.js.map

package/build/src/md/chip/internals/Chip.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Chip.styles.js","sourceRoot":"","sources":["../../../../../src/md/chip/internals/Chip.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAwKjB,CAAA","sourcesContent":["import { css } from 'lit'\n\nexport default css`\n  :host {\n    display: inline-block;\n    vertical-align: middle;\n    outline: none;\n    -webkit-tap-highlight-color: transparent;\n    height: 32px;\n\n    font-family: var(--md-sys-typescale-label-large-font);\n    font-size: var(--md-sys-typescale-label-large-size);\n    letter-spacing: var(--md-sys-typescale-label-large-tracking);\n    line-height: var(--md-sys-typescale-label-large-height);\n\n    border-radius: var(--md-sys-shape-corner-small);\n    color: var(--md-sys-color-on-surface);\n    fill: var(--md-sys-color-primary);\n\n    user-select: none;\n\n    --md-ripple-hover-state-layer-color: var(--md-sys-color-on-surface);\n    --md-ripple-focus-state-layer-color: var(--md-sys-color-on-surface);\n    --md-ripple-pressed-state-layer-color: var(--md-sys-color-primary);\n  }\n\n  :host([disabled]) {\n    pointer-events: none;\n  }\n\n  :host([disabled]) .container {\n    border-color: var(--md-sys-color-on-surface);\n    opacity: 0.12;\n  }\n\n  :host([disabled][elevated]) .container {\n    background-color: var(--md-sys-color-on-surface);\n    opacity: 0.12;\n    box-shadow: none;\n  }\n\n  :host([disabled]) .content {\n    color: var(--md-sys-color-on-surface);\n    opacity: 0.68;\n  }\n\n  .surface {\n    position: relative;\n    height: inherit;\n    border-radius: inherit;\n  }\n\n  .ripple {\n    z-index: 0;\n    border-radius: inherit;\n  }\n\n  .container {\n    position: absolute;\n    inset: 0;\n\n    box-sizing: border-box;\n    border-radius: inherit;\n    border: 1px var(--md-sys-color-outline) solid;\n    z-index: 0;\n  }\n\n  .content {\n    height: inherit;\n    display: flex;\n    align-items: center;\n    justify-content: start;\n    box-sizing: border-box;\n    padding: 0 16px;\n    border-radius: inherit;\n    border: 1px transparent solid;\n    position: relative;\n    z-index: 1;\n  }\n\n  :host([elevated]) .container {\n    background-color: var(--md-sys-color-surface);\n    box-shadow: var(--md-sys-elevation-1);\n    border-width: 0;\n  }\n\n  .withIcon .content,\n  :host([type='filter'][checked]) .content {\n    padding-left: 8px;\n  }\n\n  .withAvatar .content {\n    padding-left: 4px;\n  }\n\n  :host([closable]) .content,\n  :host([type='filter'][list]) .content {\n    padding-right: 8px;\n  }\n\n  .withIcon slot[name='icon']::slotted(*),\n  .withAvatar slot[name='avatar']::slotted(*) {\n    margin-right: 8px;\n  }\n\n  slot[name='icon']::slotted(*) {\n    width: 16px;\n    height: 16px;\n  }\n\n  slot[name='avatar']::slotted(*) {\n    width: 24px;\n    height: 24px;\n    border-radius: var(--md-sys-shape-corner-medium);\n  }\n\n  .leading-icon {\n    height: 18px;\n    width: 0px;\n    overflow: hidden;\n    transition: width 230ms var(--md-sys-animation-easing-standard);\n  }\n\n  .check-mark.checked {\n    width: 18px;\n    margin-right: 8px;\n  }\n\n  .trailing-icon {\n    margin-left: 8px;\n    width: 18px;\n    height: 18px;\n    fill: var(--md-sys-color-on-surface-variant);\n  }\n\n  :host([elevated]:hover) .container,\n  :host([elevated]:focus) .container {\n    box-shadow: var(--md-sys-elevation-2);\n  }\n\n  :host([elevated][dragged]) .container {\n    box-shadow: var(--md-sys-elevation-4);\n  }\n\n  :host([checked]) .container {\n    background-color: var(--md-sys-color-secondary-container);\n    border-width: 0;\n  }\n\n  :host([type='filter']),\n  :host([type='filter']) .leading-icon {\n    color: var(--md-sys-color-on-surface-variant);\n    fill: var(--md-sys-color-on-surface-variant);\n  }\n\n  :host([type='filter'][checked]),\n  :host([type='filter'][checked]) .leading-icon {\n    color: var(--md-sys-color-on-secondary-container);\n  }\n\n  :host([type='input']) .container {\n    background-color: var(--md-sys-color-surface);\n    color: var(--md-sys-color-on-surface-variant);\n  }\n\n  :host([type='input']) .leading-icon,\n  :host([type='input']) .trailing-icon {\n    color: var(--md-sys-color-on-surface-variant);\n    fill: var(--md-sys-color-on-surface-variant);\n  }\n`\n"]}
+{"version":3,"file":"Chip.styles.js","sourceRoot":"","sources":["../../../../../src/md/chip/internals/Chip.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAqLjB,CAAA","sourcesContent":["import { css } from 'lit'\n\nexport default css`\n  :host {\n    display: inline-block;\n    vertical-align: middle;\n    outline: none;\n    -webkit-tap-highlight-color: transparent;\n    position: relative;\n    user-select: none;\n\n    font-family: var(--md-sys-typescale-label-large-font);\n    font-size: var(--md-sys-typescale-label-large-size);\n    letter-spacing: var(--md-sys-typescale-label-large-tracking);\n    line-height: var(--md-sys-typescale-label-large-height);\n\n    --md-ripple-hover-state-layer-color: var(--md-sys-color-on-surface);\n    --md-ripple-focus-state-layer-color: var(--md-sys-color-on-surface);\n    --md-ripple-pressed-state-layer-color: var(--md-sys-color-primary);\n\n    --_leading-icon-color: currentColor;\n    --_trailing-icon-color: currentColor;\n    --_background-color: transparent;\n    --_color: inherit;\n    --_shadow: var(--md-sys-elevation-0);\n    --_outline-color: transparent;\n    --_outline-size: 0;\n    --_inline-padding-start: 16px;\n    --_inline-padding-end: 16px;\n    --_avatar-size: 24px;\n    --_avatar-shape: 24px;\n    --_icon-size: 18px;\n\n    height: 32px;\n    border-radius: var(--md-sys-shape-corner-small);\n    box-shadow: var(--_shadow);\n    border: var(--_outline-size) solid var(--_outline-color);\n  }\n\n  .ripple {\n    border-radius: inherit;\n    transition: border-radius var(--md-sys-motion-duration-medium1) var(--md-sys-motion-easing-standard);\n  }\n\n  .ripple.activated {\n    z-index: 1;\n  }\n\n  :host([disabled]) {\n    --_background-color: color-mix(in srgb, var(--md-sys-color-on-surface) 12%, transparent);\n    --_color: color-mix(in srgb, var(--md-sys-color-on-surface) 38%, transparent);\n    --_leading-icon-color: color-mix(in srgb, var(--md-sys-color-on-surface) 38%, transparent);\n    --_trailing-icon-color: color-mix(in srgb, var(--md-sys-color-on-surface) 38%, transparent);\n    --_outline-color: color-mix(in srgb, var(--md-sys-color-on-surface) 12%, transparent);\n    box-shadow: none;\n    cursor: not-allowed;\n    pointer-events: none;\n  }\n\n  .surface {\n    height: inherit;\n    display: flex;\n    align-items: center;\n    justify-content: start;\n    box-sizing: border-box;\n    padding: 0 var(--_inline-padding-end) 0 var(--_inline-padding-start);\n    border-radius: inherit;\n    background-color: var(--_background-color);\n    color: var(--_color);\n    gap: 0;\n  }\n\n  .leading-icon {\n    height: var(--_icon-size);\n    width: 0px;\n    overflow: hidden;\n    transition: width 230ms var(--md-sys-animation-easing-standard);\n    color: var(--_leading-icon-color);\n    fill: currentColor;\n  }\n\n  .leading-icon::slotted(*) {\n    width: var(--_icon-size);\n    height: var(--_icon-size);\n    margin-right: 8px;\n  }\n\n  slot[name='avatar']::slotted(*) {\n    width: var(--_avatar-size);\n    height: var(--_avatar-size);\n    border-radius: var(--_avatar-shape);\n    flex-shrink: 0;\n    flex-grow: 0;\n    margin-right: 8px;\n  }\n\n  .check-mark.checked {\n    width: 18px;\n    margin-right: 8px;\n  }\n\n  .trailing-icon {\n    margin-left: 8px;\n    width: 18px;\n    height: 18px;\n    color: var(--_trailing-icon-color);\n    fill: currentColor;\n  }\n\n  :host([elevated]) {\n    --_shadow: var(--md-sys-elevation-1);\n    border: none;\n    --_background-color: var(--md-sys-color-surface-container-low);\n  }\n\n  :host([elevated]:hover:not([disabled])) {\n    --_shadow: var(--md-sys-elevation-2);\n  }\n\n  .surface.has-trailing-icon {\n    --_inline-padding-end: 8px;\n  }\n\n  :host([type='assist']:not([disabled])) {\n    --_outline-color: var(--md-sys-color-outline-variant);\n    --_outline-size: 1px;\n    --_color: var(--md-sys-color-on-surface);\n    --_leading-icon-color: var(--md-sys-color-primary);\n  }\n\n  :host .has-icon {\n    --_inline-padding-start: 8px;\n  }\n\n  :host .has-avatar {\n    --_inline-padding-start: 4px;\n  }\n\n  :host([checked]) {\n    --_inline-padding-start: 8px;\n    --_background-color: var(--md-sys-color-secondary-container);\n  }\n\n  :host([type='filter']:not([disabled])) {\n    --_leading-icon-color: var(--md-sys-color-primary);\n    --_trailing-icon-color: var(--md-sys-on-surface-variant);\n    --_outline-color: var(--md-sys-color-outline-variant);\n    --_outline-size: 1px;\n    --_color: var(--md-sys-color-on-surface-variant);\n  }\n\n  :host([type='filter'][checked]) {\n    --_outline-size: 1px;\n  }\n\n  :host([type='filter'][checked]:not([disabled])) {\n    --_leading-icon-color: var(--md-sys-color-on-secondary-container);\n    --_trailing-icon-color: var(--md-sys-on-secondary-container);\n    --_outline-color: var(--md-sys-color-secondary-container);\n    --_color: var(--md-sys-color-on-secondary-container);\n  }\n\n  :host([type='input']:not([disabled])) {\n    --_outline-color: var(--md-sys-color-outline-variant);\n    --_outline-size: 1px;\n    --_leading-icon-color: var(--md-sys-color-primary);\n    --_trailing-icon-color: var(--md-sys-color-on-surface-variant);\n    --_color: var(--md-sys-color-on-surface-variant);\n  }\n\n  :host([type='input'][checked]) {\n    --_outline-size: 0px;\n  }\n\n  :host([type='suggestion']) {\n    --_outline-size: 1px;\n    --_outline-color: var(--md-sys-color-outline-variant);\n    --_color: var(--md-sys-color-on-surface-variant);\n  }\n\n  :host([type='suggestion']:not([disabled])) {\n    --_leading-icon-color: var(--md-sys-color-primary);\n  }\n`\n"]}

package/build/src/md/chip/internals/ChipSet.d.ts

@@ -0,0 +1,16 @@
+import { LitElement } from 'lit';
+import Chip from './Chip.js';
+/**
+ * A chip set component.
+ */
+export default class ChipSet extends LitElement {
+    get chips(): Chip[];
+    private accessor childElements;
+    private readonly internals;
+    constructor();
+    connectedCallback(): void;
+    protected render(): import("lit-html").TemplateResult<1>;
+    private handleKeyDown;
+    private updateTabIndices;
+}
+//# sourceMappingURL=ChipSet.d.ts.map

package/build/src/md/chip/internals/ChipSet.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChipSet.d.ts","sourceRoot":"","sources":["../../../../../src/md/chip/internals/ChipSet.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAA;AAGtC,OAAO,IAAI,MAAM,WAAW,CAAA;AAE5B;;GAEG;AACH,MAAM,CAAC,OAAO,OAAO,OAAQ,SAAQ,UAAU;IAC7C,IAAI,KAAK,WAER;IAEwB,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAgB;IACvE,OAAO,CAAC,QAAQ,CAAC,SAAS,CAAyB;;IAU1C,iBAAiB,IAAI,IAAI;cAOf,MAAM;IAIzB,OAAO,CAAC,aAAa;IA0ErB,OAAO,CAAC,gBAAgB;CA4BzB"}

package/build/src/md/chip/internals/ChipSet.js

@@ -0,0 +1,138 @@
+import { __esDecorate, __runInitializers } from "tslib";
+import { html, LitElement } from 'lit';
+import { queryAssignedElements } from 'lit/decorators.js';
+import Chip from './Chip.js';
+let ChipSet = (() => {
+    let _classSuper = LitElement;
+    let _childElements_decorators;
+    let _childElements_initializers = [];
+    let _childElements_extraInitializers = [];
+    return class ChipSet extends _classSuper {
+        static {
+            const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+            _childElements_decorators = [queryAssignedElements()];
+            __esDecorate(this, null, _childElements_decorators, { kind: "accessor", name: "childElements", static: false, private: false, access: { has: obj => "childElements" in obj, get: obj => obj.childElements, set: (obj, value) => { obj.childElements = value; } }, metadata: _metadata }, _childElements_initializers, _childElements_extraInitializers);
+            if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
+        }
+        get chips() {
+            return this.childElements.filter((child) => child instanceof Chip);
+        }
+        #childElements_accessor_storage = __runInitializers(this, _childElements_initializers, void 0);
+        get childElements() { return this.#childElements_accessor_storage; }
+        set childElements(value) { this.#childElements_accessor_storage = value; }
+        internals = (__runInitializers(this, _childElements_extraInitializers), this.attachInternals());
+        constructor() {
+            super();
+            this.addEventListener('focusin', this.updateTabIndices.bind(this));
+            this.addEventListener('update-focus', this.updateTabIndices.bind(this));
+            this.addEventListener('keydown', this.handleKeyDown.bind(this));
+            this.internals.role = 'toolbar';
+        }
+        connectedCallback() {
+            super.connectedCallback();
+            if (!this.hasAttribute('role')) {
+                this.setAttribute('role', 'toolbar');
+            }
+        }
+        render() {
+            return html `<slot @slotchange=${this.updateTabIndices}></slot>`;
+        }
+        handleKeyDown(event) {
+            const isLeft = event.key === 'ArrowLeft';
+            const isRight = event.key === 'ArrowRight';
+            const isHome = event.key === 'Home';
+            const isEnd = event.key === 'End';
+            // Ignore non-navigation keys
+            if (!isLeft && !isRight && !isHome && !isEnd) {
+                return;
+            }
+            const { chips } = this;
+            // Don't try to select another chip if there aren't any.
+            if (chips.length < 2) {
+                return;
+            }
+            // Prevent default interactions, such as scrolling.
+            event.preventDefault();
+            if (isHome || isEnd) {
+                const index = isHome ? 0 : chips.length - 1;
+                chips[index].focus({ trailing: isEnd });
+                this.updateTabIndices();
+                return;
+            }
+            // Check if moving forwards or backwards
+            const isRtl = getComputedStyle(this).direction === 'rtl';
+            const forwards = isRtl ? isLeft : isRight;
+            const focusedChip = chips.find((chip) => chip.matches(':focus-within'));
+            if (!focusedChip) {
+                // If there is not already a chip focused, select the first or last chip
+                // based on the direction we're traveling.
+                const nextChip = forwards ? chips[0] : chips[chips.length - 1];
+                nextChip.focus({ trailing: !forwards });
+                this.updateTabIndices();
+                return;
+            }
+            const currentIndex = chips.indexOf(focusedChip);
+            let nextIndex = forwards ? currentIndex + 1 : currentIndex - 1;
+            // Search for the next sibling that is not disabled to select.
+            // If we return to the host index, there is nothing to select.
+            while (nextIndex !== currentIndex) {
+                if (nextIndex >= chips.length) {
+                    // Return to start if moving past the last item.
+                    nextIndex = 0;
+                }
+                else if (nextIndex < 0) {
+                    // Go to end if moving before the first item.
+                    nextIndex = chips.length - 1;
+                }
+                // Check if the next sibling is disabled. If so,
+                // move the index and continue searching.
+                //
+                // Some toolbar items may be focusable when disabled for increased
+                // visibility.
+                const nextChip = chips[nextIndex];
+                if (nextChip.disabled) {
+                    if (forwards) {
+                        nextIndex++;
+                    }
+                    else {
+                        nextIndex--;
+                    }
+                    continue;
+                }
+                nextChip.focus({ trailing: !forwards });
+                this.updateTabIndices();
+                break;
+            }
+        }
+        updateTabIndices() {
+            // The chip that should be focusable is either the chip that currently has
+            // focus or the first chip that can be focused.
+            const { chips } = this;
+            let chipToFocus;
+            for (const chip of chips) {
+                const isChipFocusable = !chip.disabled;
+                const chipIsFocused = chip.matches(':focus-within');
+                if (chipIsFocused && isChipFocusable) {
+                    // Found the first chip that is actively focused. This overrides the
+                    // first focusable chip found.
+                    chipToFocus = chip;
+                    continue;
+                }
+                if (isChipFocusable && !chipToFocus) {
+                    chipToFocus = chip;
+                }
+                // Disable non-focused chips. If we disable all of them, we'll grant focus
+                // to the first focusable child that was found.
+                chip.tabIndex = -1;
+            }
+            if (chipToFocus) {
+                chipToFocus.tabIndex = 0;
+            }
+        }
+    };
+})();
+/**
+ * A chip set component.
+ */
+export default ChipSet;
+//# sourceMappingURL=ChipSet.js.map

package/build/src/md/chip/internals/ChipSet.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChipSet.js","sourceRoot":"","sources":["../../../../../src/md/chip/internals/ChipSet.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement } from 'lit'\nimport { queryAssignedElements } from 'lit/decorators.js'\n\nimport Chip from './Chip.js'\n\n/**\n * A chip set component.\n */\nexport default class ChipSet extends LitElement {\n  get chips() {\n    return this.childElements.filter((child): child is Chip => child instanceof Chip)\n  }\n\n  @queryAssignedElements() private accessor childElements!: HTMLElement[]\n  private readonly internals = this.attachInternals()\n\n  constructor() {\n    super()\n    this.addEventListener('focusin', this.updateTabIndices.bind(this))\n    this.addEventListener('update-focus', this.updateTabIndices.bind(this))\n    this.addEventListener('keydown', this.handleKeyDown.bind(this))\n    this.internals.role = 'toolbar'\n  }\n\n  override connectedCallback(): void {\n    super.connectedCallback()\n    if (!this.hasAttribute('role')) {\n      this.setAttribute('role', 'toolbar')\n    }\n  }\n\n  protected override render() {\n    return html`<slot @slotchange=${this.updateTabIndices}></slot>`\n  }\n\n  private handleKeyDown(event: KeyboardEvent) {\n    const isLeft = event.key === 'ArrowLeft'\n    const isRight = event.key === 'ArrowRight'\n    const isHome = event.key === 'Home'\n    const isEnd = event.key === 'End'\n    // Ignore non-navigation keys\n    if (!isLeft && !isRight && !isHome && !isEnd) {\n      return\n    }\n\n    const { chips } = this as { chips: MaybeMultiActionChip[] }\n    // Don't try to select another chip if there aren't any.\n    if (chips.length < 2) {\n      return\n    }\n\n    // Prevent default interactions, such as scrolling.\n    event.preventDefault()\n\n    if (isHome || isEnd) {\n      const index = isHome ? 0 : chips.length - 1\n      chips[index].focus({ trailing: isEnd })\n      this.updateTabIndices()\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 focusedChip = chips.find((chip) => chip.matches(':focus-within'))\n    if (!focusedChip) {\n      // If there is not already a chip focused, select the first or last chip\n      // based on the direction we're traveling.\n      const nextChip = forwards ? chips[0] : chips[chips.length - 1]\n      nextChip.focus({ trailing: !forwards })\n      this.updateTabIndices()\n      return\n    }\n\n    const currentIndex = chips.indexOf(focusedChip)\n    let nextIndex = forwards ? currentIndex + 1 : currentIndex - 1\n    // Search for the next sibling that is not disabled to select.\n    // If we return to the host index, there is nothing to select.\n    while (nextIndex !== currentIndex) {\n      if (nextIndex >= chips.length) {\n        // Return to start if moving past the last item.\n        nextIndex = 0\n      } else if (nextIndex < 0) {\n        // Go to end if moving before the first item.\n        nextIndex = chips.length - 1\n      }\n\n      // Check if the next sibling is disabled. If so,\n      // move the index and continue searching.\n      //\n      // Some toolbar items may be focusable when disabled for increased\n      // visibility.\n      const nextChip = chips[nextIndex]\n      if (nextChip.disabled) {\n        if (forwards) {\n          nextIndex++\n        } else {\n          nextIndex--\n        }\n\n        continue\n      }\n\n      nextChip.focus({ trailing: !forwards })\n      this.updateTabIndices()\n      break\n    }\n  }\n\n  private updateTabIndices() {\n    // The chip that should be focusable is either the chip that currently has\n    // focus or the first chip that can be focused.\n    const { chips } = this\n    let chipToFocus: Chip | undefined\n    for (const chip of chips) {\n      const isChipFocusable = !chip.disabled\n      const chipIsFocused = chip.matches(':focus-within')\n      if (chipIsFocused && isChipFocusable) {\n        // Found the first chip that is actively focused. This overrides the\n        // first focusable chip found.\n        chipToFocus = chip\n        continue\n      }\n\n      if (isChipFocusable && !chipToFocus) {\n        chipToFocus = chip\n      }\n\n      // Disable non-focused chips. If we disable all of them, we'll grant focus\n      // to the first focusable child that was found.\n      chip.tabIndex = -1\n    }\n\n    if (chipToFocus) {\n      chipToFocus.tabIndex = 0\n    }\n  }\n}\n\ninterface MaybeMultiActionChip extends Chip {\n  focus(options?: FocusOptions & { trailing?: boolean }): void\n}\n"]}

package/build/src/md/chip/internals/ChipSet.styles.d.ts

@@ -0,0 +1,3 @@
+declare const _default: import("lit").CSSResult;
+export default _default;
+//# sourceMappingURL=ChipSet.styles.d.ts.map

package/build/src/md/chip/internals/ChipSet.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChipSet.styles.d.ts","sourceRoot":"","sources":["../../../../../src/md/chip/internals/ChipSet.styles.ts"],"names":[],"mappings":";AAEA,wBAMC"}

package/build/src/md/chip/internals/ChipSet.styles.js

@@ -0,0 +1,9 @@
+import { css } from 'lit';
+export default css `
+  :host {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 8px;
+  }
+`;
+//# sourceMappingURL=ChipSet.styles.js.map

package/build/src/md/chip/internals/ChipSet.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChipSet.styles.js","sourceRoot":"","sources":["../../../../../src/md/chip/internals/ChipSet.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,eAAe,GAAG,CAAA;;;;;;CAMjB,CAAA","sourcesContent":["import { css } from 'lit'\n\nexport default css`\n  :host {\n    display: flex;\n    flex-wrap: wrap;\n    gap: 8px;\n  }\n`\n"]}

package/build/src/md/chip/ui-chip-set.d.ts

@@ -0,0 +1,11 @@
+import type { CSSResultOrNative } from 'lit';
+import Element from './internals/ChipSet.js';
+export declare class UiChipSetElement extends Element {
+    static styles: CSSResultOrNative[];
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'ui-chip-set': UiChipSetElement;
+    }
+}
+//# sourceMappingURL=ui-chip-set.d.ts.map

package/build/src/md/chip/ui-chip-set.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ui-chip-set.d.ts","sourceRoot":"","sources":["../../../../src/md/chip/ui-chip-set.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,KAAK,CAAA;AAE5C,OAAO,OAAO,MAAM,wBAAwB,CAAA;AAG5C,qBACa,gBAAiB,SAAQ,OAAO;IAC3C,OAAgB,MAAM,EAAE,iBAAiB,EAAE,CAAW;CACvD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,aAAa,EAAE,gBAAgB,CAAA;KAChC;CACF"}