@api-client/ui 0.3.2 → 0.3.4

package/build/src/md/tabs/internals/Tabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs.js","sourceRoot":"","sources":["../../../../../src/md/tabs/internals/Tabs.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, nothing, PropertyValues, TemplateResult } from 'lit'\nimport { property, query, queryAssignedElements, state } from 'lit/decorators.js'\nimport { ClassInfo, classMap } from 'lit/directives/class-map.js'\nimport { StyleInfo, styleMap } from 'lit/directives/style-map.js'\nimport { Easing } from '../../motion/animation.js'\nimport UiTab from './Tab.js'\nimport '../../icon-button/ui-icon-button.js'\nimport '../../divider/ui-divider.js'\nimport '../../icons/ui-icon.js'\n\nexport type TabsPriority = 'primary' | 'secondary'\n\nexport interface TabSelectionDetail {\n  item: UiTab\n  index: number\n  select: string | null\n}\n\n/**\n * Calculates value in percentages\n * @param w Element width\n * @param w0 Parent width\n * @return The percentage of element's width relative to parent.\n */\nexport function calcPercent(w: number, w0: number): number {\n  return (100 * w) / w0\n}\n\n/**\n * A container for tabs.\n *\n * @fires select - A non bubbling event when selection change through user interaction.\n *                The `event.detail` object contains the `item` and `index` properties.\n *                It also has the `select` property with the value of the `selectedAttribute` on the tab.\n */\nexport default class UiTabs extends LitElement {\n  items: UiTab[] = []\n\n  activeItem: UiTab | null = null\n\n  previousItem: UiTab | null = null\n\n  @queryAssignedElements({ flatten: true })\n  protected accessor assignedElements!: HTMLElement[]\n\n  @query('.pointer') protected accessor pointer!: HTMLElement\n\n  @query('.content') protected accessor content!: HTMLElement\n\n  /**\n   * The priority of the tabs.\n   *\n   * @default primary\n   * @attribute\n   */\n  @property({ type: String, reflect: true }) accessor priority: TabsPriority = 'primary'\n\n  /**\n   * If true, tabs are scrollable and the tab width is based on the label width.\n   * @attribute\n   */\n  @property({ type: Boolean }) accessor scrollable: boolean | undefined\n\n  /**\n   * The value of the selected tab.\n   * This is matched with the `aria-controls` of the tab.\n   * @attribute\n   */\n  @property({ type: String }) accessor selected: string | undefined\n\n  /**\n   * The attribute on the `ui-tab` that indicates which value for `selected`\n   * corresponds to which tab.\n   *\n   * @default aria-controls\n   * @attribute\n   */\n  @property({ type: String }) accessor selectedAttribute = `aria-controls`\n\n  @state() protected accessor pointerStyles: StyleInfo | undefined\n\n  protected contentScroll?: number\n\n  @state() protected accessor indicated = false\n\n  protected observer: IntersectionObserver\n\n  /**\n   * This is set by the intersection observer. Once the tabs are in the view it turns to `true`.\n   * This we can properly visualize selection.\n   */\n  @state() accessor isVisible: boolean | undefined\n\n  constructor() {\n    super()\n\n    this.observer = new IntersectionObserver(this.intersectionCallback.bind(this), {\n      threshold: 1.0,\n      rootMargin: '0px',\n    })\n  }\n\n  protected override willUpdate(cp: PropertyValues<this>): void {\n    if (cp.has('isVisible')) {\n      this.handleVisibility()\n    }\n    super.willUpdate(cp)\n  }\n\n  override connectedCallback(): void {\n    super.connectedCallback()\n    if (!this.hasAttribute('role')) {\n      this.setAttribute('role', 'tablist')\n    }\n    this.observer.observe(this)\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback()\n    this.observer.unobserve(this)\n  }\n\n  protected intersectionCallback(entries: IntersectionObserverEntry[]): void {\n    const [entry] = entries\n    this.isVisible = entry.isIntersecting\n  }\n\n  protected async updateItems(): Promise<void> {\n    const elements = this.assignedElements || []\n    const items = elements.filter(this.isTabItem, this)\n    this.items = items\n    if (this.activeItem && !items.includes(this.activeItem)) {\n      this.activeItem = null\n    }\n    await this.updateComplete\n    this.ensureSelection()\n  }\n\n  /**\n   * @return Whether the given element is a list item element.\n   */\n  protected isTabItem(element: Element): element is UiTab {\n    if (element.nodeType !== Node.ELEMENT_NODE) {\n      return false\n    }\n    return element.localName === 'ui-tab'\n  }\n\n  protected isSelectable(element: UiTab): boolean {\n    if (element.disabled) {\n      return false\n    }\n    if (element.hidden && element.hasAttribute('hidden')) {\n      return false\n    }\n    return true\n  }\n\n  protected ensureSelection(): void {\n    const { selected, selectedAttribute, activeItem, items } = this\n    if (!selectedAttribute) {\n      return\n    }\n    const item = items.find((i) => i.getAttribute(selectedAttribute) === selected)\n    if (item && item === activeItem) {\n      return\n    }\n    this.makeSelection(item)\n  }\n\n  protected makeSelection(tab?: UiTab, focus = false): void {\n    const { activeItem } = this\n    if (activeItem === tab) {\n      tab.highlight()\n      return\n    }\n    this.previousItem = activeItem\n    if (activeItem) {\n      this.deselectItem(activeItem)\n    }\n    if (tab) {\n      this.selectItem(tab, focus)\n      this.positionPointer(tab, activeItem)\n      if (this.activeItem) {\n        // we set this here so we won't notify selection when initializing.\n        this.notifySelect(tab)\n      }\n    }\n  }\n\n  notifySelect(item: UiTab): void {\n    const index = this.items.indexOf(item)\n    if (index === -1) {\n      return\n    }\n    const attrValue = item.getAttribute(this.selectedAttribute)\n    this.dispatchEvent(\n      new CustomEvent<TabSelectionDetail>('select', {\n        detail: {\n          item,\n          index,\n          select: attrValue,\n        },\n      })\n    )\n  }\n\n  protected selectItem(tab: UiTab, focus = false): void {\n    this.activeItem = tab\n    if (this.hasAttribute('tabindex')) {\n      this.removeAttribute('tabindex')\n    }\n    tab.setAttribute('aria-selected', 'true')\n    tab.setAttribute('tabindex', '0')\n    tab.selected = true\n    tab.priority = this.priority\n    tab.scrollIntoView({ inline: 'nearest', behavior: 'auto', block: 'nearest' })\n    if (focus) {\n      tab.focus()\n    }\n  }\n\n  protected deselectItem(tab: UiTab): void {\n    tab.setAttribute('aria-selected', 'false')\n    tab.setAttribute('tabindex', '-1')\n    tab.selected = false\n    tab.indicated = false\n  }\n\n  protected handleVisibility(): void {\n    const { previousItem, activeItem } = this\n    if (!activeItem) {\n      return\n    }\n    this.positionPointer(activeItem, previousItem)\n  }\n\n  protected async positionPointer(tab: UiTab, old?: UiTab | null): Promise<void> {\n    const { items, pointer, isVisible } = this\n    if (!isVisible) {\n      return\n    }\n    const index = items.indexOf(tab)\n    if (index < 0 || !pointer) {\n      this.pointerStyles = undefined\n      return\n    }\n\n    if (!old) {\n      // no start animation, just show indicator.\n      tab.indicated = true\n      return\n    }\n    const isPrimary = this.priority === 'primary'\n    const final = isPrimary ? this.getPrimaryLeft(tab) : this.getSecondaryLeft(tab)\n    if (this.pointerStyles && this.pointerStyles.left === `${final}px`) {\n      return\n    }\n\n    // first position this indicator in the place of the old one.\n    // update the view and then run the animation.\n    this.indicated = true\n    const left = isPrimary ? this.getPrimaryLeft(old) : this.getSecondaryLeft(old)\n    this.pointerStyles = { left }\n    await this.updateComplete\n    const frames = isPrimary ? this.getPrimaryKeyframes(left, final) : this.getSecondaryKeyframes(left, final)\n\n    if (this.moveAnimation) {\n      this.moveAnimation.cancel()\n    }\n    const moveAnimation = pointer.animate(frames, {\n      duration: 360,\n      iterations: 1,\n      easing: Easing.DECELERATION,\n    })\n    const finalStyles: StyleInfo = {\n      left: `${final}px`,\n    }\n    moveAnimation.addEventListener('finish', () => {\n      this.pointerStyles = finalStyles\n      this.moveAnimation = undefined\n      tab.indicated = true\n      this.indicated = false\n    })\n    moveAnimation.addEventListener('cancel', () => {\n      this.pointerStyles = finalStyles\n    })\n    this.moveAnimation = moveAnimation\n  }\n\n  protected moveAnimation?: Animation\n\n  protected getPrimaryLeft(tab: UiTab): string {\n    const contentBox = this.content.getBoundingClientRect()\n    const tabRect = tab.getBoundingClientRect()\n    const leftFromParent = tabRect.x - contentBox.x\n    const offset = this.scrollable ? 48 : 0 // left button\n    const left = leftFromParent + tabRect.width / 2 - 20 + offset\n    return `${left}px`\n  }\n\n  protected getSecondaryLeft(tab: UiTab): string {\n    const contentBox = this.content.getBoundingClientRect()\n    const tabRect = tab.getBoundingClientRect()\n    const offset = this.scrollable ? 48 : 0 // left button\n    const leftFromParent = tabRect.x - contentBox.x + offset\n    return `${leftFromParent}px`\n  }\n\n  protected getPrimaryKeyframes(start: string, final: string): Keyframe[] {\n    return [\n      {\n        left: start,\n        width: `40px`,\n      },\n      {\n        width: `80px`,\n      },\n      {\n        left: final,\n        width: `40px`,\n      },\n    ]\n  }\n\n  protected getSecondaryKeyframes(start: string, final: string): Keyframe[] {\n    return [\n      {\n        left: start,\n      },\n      {\n        left: final,\n      },\n    ]\n  }\n\n  protected contentClickHandler(e: PointerEvent): void {\n    this.activateFromEvent(e)\n  }\n\n  protected contentKeyDownHandler(e: KeyboardEvent): void {\n    if (['Enter', 'Space'].includes(e.code)) {\n      this.activateFromEvent(e)\n    }\n  }\n\n  protected activateFromEvent(e: Event): void {\n    const { items } = this\n    const path = e.composedPath()\n    let item: UiTab | undefined\n    while (!item) {\n      const next = path.shift() as UiTab\n      if (!next) {\n        break\n      }\n      if (items.includes(next)) {\n        item = next\n      }\n    }\n    if (!item) {\n      return\n    }\n    this.makeSelection(item, true)\n  }\n\n  protected handleScrollLeft(): void {\n    const { contentScroll = 0, content } = this\n    if (contentScroll === 0) {\n      return\n    }\n    let left = contentScroll - 80\n    if (left < 0) {\n      left = 0\n    }\n    this.contentScroll = left\n    content.scrollTo({\n      behavior: 'smooth',\n      left,\n    })\n  }\n\n  protected handleScrollRight(): void {\n    const { contentScroll = 0, content } = this\n    let left = contentScroll + 80\n    if (left + content.clientWidth > content.scrollWidth) {\n      left = content.scrollWidth - content.clientWidth\n    }\n    this.contentScroll = left\n    content.scrollTo({\n      behavior: 'smooth',\n      left,\n    })\n  }\n\n  protected handleScroll(e: Event): void {\n    const div = e.target as HTMLElement\n    this.contentScroll = div.scrollLeft\n  }\n\n  protected handleKeyDown(e: KeyboardEvent): void {\n    if (e.code === 'ArrowRight') {\n      e.preventDefault()\n      const tab = this.activeItem ? this.getNextItem(this.activeItem) : this.items[0]\n      this.makeSelection(tab, true)\n    } else if (e.code === 'ArrowLeft') {\n      e.preventDefault()\n      const tab = this.activeItem ? this.getPreviousItem(this.activeItem) : this.items[0]\n      this.makeSelection(tab, true)\n    }\n  }\n\n  getPreviousItem(item: UiTab): UiTab {\n    const { items } = this\n    const curIndex = items.indexOf(item)\n    if (curIndex < 0) {\n      return item\n    }\n    let i = curIndex\n    let result: HTMLElement | undefined\n    do {\n      i--\n      if (i === curIndex) {\n        // looped back from the end, no active element to find.\n        return item\n      }\n      const tmp = items[i]\n      if (!tmp) {\n        i = items.length\n        continue\n      }\n      if (this.isSelectable(tmp)) {\n        result = tmp\n      }\n    } while (!result)\n    return (result as UiTab) || item\n  }\n\n  getNextItem(item: UiTab): UiTab {\n    const { items } = this\n    const curIndex = items.indexOf(item)\n    if (curIndex < 0) {\n      return item\n    }\n    let i = curIndex\n    let next: HTMLElement | undefined\n    do {\n      i++\n      if (i === curIndex) {\n        // looped back from the start, no active element to find.\n        return item\n      }\n      const tmp = items[i]\n      if (!tmp) {\n        i = -1\n        continue\n      }\n      if (this.isSelectable(tmp)) {\n        next = tmp\n      }\n    } while (!next)\n    return (next as UiTab) || item\n  }\n\n  override render(): TemplateResult {\n    const classes: ClassInfo = {\n      surface: true,\n      scrollable: !!this.scrollable,\n    }\n    return html`\n      <div class=\"${classMap(classes)}\">\n        ${this.renderLeftScrollControl()}\n        <div class=\"content\" @scroll=\"${this.handleScroll}\" @keydown=\"${this.handleKeyDown}\">${this.renderSlot()}</div>\n        ${this.rightScrollControl()} ${this.renderIndicator()}\n        <div class=\"divider\"></div>\n      </div>\n    `\n  }\n\n  protected renderSlot(): TemplateResult {\n    return html`<slot\n      @slotchange=\"${this.updateItems}\"\n      @click=\"${this.contentClickHandler}\"\n      @keydown=\"${this.contentKeyDownHandler}\"\n    ></slot>`\n  }\n\n  protected renderIndicator(): TemplateResult {\n    const classes: ClassInfo = {\n      indicator: true,\n      indicated: this.indicated,\n      primary: this.priority === 'primary',\n      secondary: this.priority === 'secondary',\n    }\n    return html`\n      <div class=\"${classMap(classes)}\">\n        <span role=\"presentation\" class=\"pointer\" style=\"${styleMap(this.pointerStyles || {})}\"></span>\n      </div>\n    `\n  }\n\n  protected renderLeftScrollControl(): TemplateResult | typeof nothing {\n    if (!this.scrollable) {\n      return nothing\n    }\n    return html` <div class=\"scroll-control left\">\n      <ui-icon-button aria-label=\"Scroll tabs left\" title=\"Scroll tabs left\" @click=\"${this.handleScrollLeft}\">\n        <ui-icon icon=\"chevronLeft\"></ui-icon>\n      </ui-icon-button>\n    </div>`\n  }\n\n  protected rightScrollControl(): TemplateResult | typeof nothing {\n    if (!this.scrollable) {\n      return nothing\n    }\n    return html`<div class=\"scroll-control right\">\n      <ui-icon-button aria-label=\"Scroll tabs right\" title=\"Scroll tabs right\" @click=\"${this.handleScrollRight}\">\n        <ui-icon icon=\"chevronRight\"></ui-icon>\n      </ui-icon-button>\n    </div>`\n  }\n}\n"]}
+{"version":3,"file":"Tabs.js","sourceRoot":"","sources":["../../../../../src/md/tabs/internals/Tabs.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, PropertyValues, TemplateResult } from 'lit'\nimport { property, query, queryAssignedElements, state } from 'lit/decorators.js'\nimport { ClassInfo, classMap } from 'lit/directives/class-map.js'\nimport { StyleInfo, styleMap } from 'lit/directives/style-map.js'\nimport { Easing } from '../../motion/animation.js'\nimport UiTab from './Tab.js'\nimport '../../icon-button/ui-icon-button.js'\nimport '../../divider/ui-divider.js'\nimport '../../icons/ui-icon.js'\n\nexport type TabsPriority = 'primary' | 'secondary'\n\nexport interface TabSelectionDetail {\n  /**\n   * The selected tab.\n   */\n  item: UiTab\n  /**\n   * The index of the selected tab.\n   */\n  index: number\n}\n\nexport interface SizingInfo {\n  left: number\n  width: number\n}\n\n/**\n * Calculates value in percentages\n * @param w Element width\n * @param w0 Parent width\n * @return The percentage of element's width relative to parent.\n */\nexport function calcPercent(w: number, w0: number): number {\n  return (100 * w) / w0\n}\n\n/**\n * A container for tabs.\n *\n * @fires change - A non bubbling event when selection change through user interaction.\n */\nexport default class UiTabs extends LitElement {\n  activeItem: UiTab | null = null\n\n  previousItem: UiTab | null = null\n\n  /**\n   * The currently selected tab, `null` only when there are no tab children.\n   */\n  get activeTab(): UiTab | null {\n    return this.tabs.find((tab) => tab.selected) ?? null\n  }\n\n  set activeTab(tab: UiTab | null) {\n    // Ignore setting activeTab to null. As long as there are children, one tab\n    // must be selected.\n    if (tab) {\n      this.activateTab(tab)\n    }\n  }\n\n  /**\n   * The index of the currently selected tab.\n   */\n  get activeTabIndex() {\n    return this.tabs.findIndex((tab) => tab.selected)\n  }\n\n  /**\n   * Sets the active tab by index.\n   */\n  set activeTabIndex(index) {\n    const activateTabAtIndex = () => {\n      const tab = this.tabs[index]\n      // Ignore out-of-bound indices.\n      if (tab) {\n        this.activateTab(tab)\n      }\n    }\n    if (!this.slotElement) {\n      // This is needed to support setting the activeTabIndex via a lit property\n      // binding.\n      //\n      // ```ts\n      // html`\n      //   <md-tabs .activeTabIndex=${1}>\n      //     <md-tab>First</md-tab>\n      //     <md-tab>Second</md-tab>\n      //   </md-tabs>\n      // `;\n      // ```\n      //\n      // It's needed since lit's rendering lifecycle is asynchronous, and the\n      // `<slot>` element hasn't rendered, so `tabs` is empty.\n      this.updateComplete.then(activateTabAtIndex)\n      return\n    }\n    activateTabAtIndex()\n  }\n\n  get focusedTab() {\n    return this.tabs.find((tab) => tab.matches(':focus-within'))\n  }\n\n  @queryAssignedElements({ flatten: true, selector: 'ui-tab' }) private accessor tabs!: UiTab[]\n\n  @query('.tabs') private accessor tabsScrollerElement!: HTMLElement\n  @query('slot') private accessor slotElement!: HTMLSlotElement\n\n  @query('.pointer') private accessor pointer!: HTMLElement\n\n  /**\n   * The priority of the tabs.\n   *\n   * @default primary\n   * @attribute\n   */\n  @property({ type: String, reflect: true }) accessor priority: TabsPriority = 'primary'\n\n  @state() private accessor pointerStyles: StyleInfo | undefined\n\n  @state() private accessor indicated = false\n\n  private observer: IntersectionObserver\n\n  /**\n   * This is set by the intersection observer. Once the tabs are in the view it turns to `true`.\n   * This we can properly visualize selection.\n   */\n  @state() accessor isVisible: boolean | undefined\n\n  /**\n   * Whether or not to automatically select a tab when it is focused.\n   */\n  @property({ type: Boolean }) accessor autoActivate = false\n\n  private readonly internals = (this as HTMLElement).attachInternals()\n\n  constructor() {\n    super()\n    this.internals.role = 'tablist'\n    this.observer = new IntersectionObserver(this.intersectionCallback.bind(this), {\n      threshold: 1.0,\n      rootMargin: '0px',\n    })\n    this.addEventListener('keydown', this.handleKeydown.bind(this))\n    this.addEventListener('keyup', this.handleKeyup.bind(this))\n    this.addEventListener('focusout', this.handleFocusout.bind(this))\n  }\n\n  protected override willUpdate(cp: PropertyValues<this>): void {\n    if (cp.has('isVisible')) {\n      this.handleVisibility()\n    }\n    super.willUpdate(cp)\n  }\n\n  override connectedCallback(): void {\n    super.connectedCallback()\n    this.observer.observe(this)\n    if (!this.hasAttribute('role')) {\n      this.setAttribute('role', 'tablist')\n    }\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback()\n    this.observer.unobserve(this)\n  }\n\n  protected intersectionCallback(entries: IntersectionObserverEntry[]): void {\n    const [entry] = entries\n    this.isVisible = entry.isIntersecting\n  }\n\n  /**\n   * Scrolls the toolbar, if overflowing, to the active tab, or the provided\n   * tab.\n   *\n   * @param tabToScrollTo The tab that should be scrolled to. Defaults to the\n   *     active tab.\n   * @return A Promise that resolves after the tab has been scrolled to.\n   */\n  async scrollToTab(tabToScrollTo?: UiTab | null) {\n    await this.updateComplete\n    const { tabs } = this\n    tabToScrollTo ??= this.activeTab\n    if (!tabToScrollTo || !tabs.includes(tabToScrollTo) || !this.tabsScrollerElement) {\n      return\n    }\n\n    // wait for tabs to render.\n    await Promise.all(tabs.map((tab) => tab.updateComplete))\n    tabToScrollTo.scrollIntoView({\n      block: 'nearest',\n      inline: 'nearest',\n      behavior: !this.focusedTab ? 'instant' : 'auto',\n    })\n  }\n\n  protected handleVisibility(): void {\n    const { previousItem, activeItem } = this\n    if (!activeItem) {\n      return\n    }\n    this.positionPointer(activeItem, previousItem)\n  }\n\n  protected async positionPointer(tab: UiTab, old?: UiTab | null): Promise<void> {\n    const { pointer, isVisible } = this\n    if (!isVisible) {\n      tab.indicated = true\n      return\n    }\n    const index = this.tabs.indexOf(tab)\n    if (index < 0 || !pointer) {\n      this.pointerStyles = undefined\n      return\n    }\n\n    if (!old) {\n      // no start animation, just show indicator.\n      tab.indicated = true\n      return\n    }\n    const isPrimary = this.priority === 'primary'\n    const final = this.getTabSizing(tab)\n    if (this.pointerStyles && this.pointerStyles.left === `${final.left}px`) {\n      tab.indicated = true\n      return\n    }\n\n    // first position this indicator in the place of the old one.\n    // update the view and then run the animation.\n    this.indicated = true\n    const starting = this.getTabSizing(old)\n    this.pointerStyles = { left: `${starting.left}px`, width: `${starting.width}px` }\n    await this.updateComplete\n    const frames = isPrimary ? this.getPrimaryKeyframes(starting, final) : this.getSecondaryKeyframes(starting, final)\n\n    if (this.moveAnimation) {\n      this.moveAnimation.cancel()\n    }\n    const moveAnimation = pointer.animate(frames, {\n      duration: 200,\n      iterations: 1,\n      easing: Easing.EMPHASIZED_DECELERATE,\n    })\n    const finalStyles: StyleInfo = {\n      left: `${final.left}px`,\n      width: `${final.width}px`,\n    }\n    moveAnimation.addEventListener('finish', () => {\n      this.pointerStyles = finalStyles\n      this.moveAnimation = undefined\n      tab.indicated = true\n      this.indicated = false\n    })\n    moveAnimation.addEventListener('cancel', () => {\n      this.pointerStyles = finalStyles\n    })\n    this.moveAnimation = moveAnimation\n  }\n\n  protected moveAnimation?: Animation\n\n  protected getTabSizing(tab: UiTab): SizingInfo {\n    const contentBox = this.tabsScrollerElement.getBoundingClientRect()\n    const sizing = tab.getIndicatorSizing()\n    sizing.left = sizing.left - contentBox.x\n    return sizing\n  }\n\n  protected getPrimaryKeyframes(start: SizingInfo, final: SizingInfo): Keyframe[] {\n    return [\n      {\n        left: `${start.left}px`,\n        width: `${start.width}px`,\n      },\n      {\n        left: `${final.left}px`,\n        width: `${final.width}px`,\n      },\n    ]\n  }\n\n  protected getSecondaryKeyframes(start: SizingInfo, final: SizingInfo): Keyframe[] {\n    return [\n      {\n        left: `${start.left}px`,\n        width: `${start.width}px`,\n      },\n      {\n        left: `${final.left}px`,\n        width: `${final.width}px`,\n      },\n    ]\n  }\n\n  protected async handleTabClick(e: PointerEvent): Promise<void> {\n    const tab = e.composedPath().find((el) => isTab(el)) as UiTab | undefined\n    // Allow event to bubble\n    await new Promise((resolve) => setTimeout(resolve, 0))\n    if (e.defaultPrevented || !tab || tab.selected) {\n      return\n    }\n    this.activateTab(tab)\n  }\n\n  private activateTab(activeTab: UiTab): void {\n    const { tabs } = this\n    const previousTab = this.activeTab\n    if (!tabs.includes(activeTab) || previousTab === activeTab) {\n      // Ignore setting activeTab to a tab element that is not a child.\n      return\n    }\n    for (const tab of tabs) {\n      tab.selected = tab === activeTab\n    }\n    if (previousTab) {\n      // Don't dispatch a change event if activating a tab when no previous tabs\n      // were selected, such as when md-tabs auto-selects the first tab.\n      const detail: TabSelectionDetail = {\n        item: activeTab,\n        index: this.tabs.indexOf(activeTab),\n      }\n      const defaultPrevented = !this.dispatchEvent(\n        new CustomEvent('change', { detail, bubbles: false, cancelable: true })\n      )\n      if (defaultPrevented) {\n        for (const tab of tabs) {\n          tab.selected = tab === previousTab\n        }\n        return\n      }\n      previousTab.indicated = false\n    }\n    activeTab.indicated = false\n    this.positionPointer(activeTab, previousTab)\n    this.updateFocusableTab(activeTab)\n    this.scrollToTab(activeTab)\n  }\n\n  private updateFocusableTab(focusableTab: UiTab) {\n    for (const tab of this.tabs) {\n      tab.tabIndex = tab === focusableTab ? 0 : -1\n    }\n  }\n\n  private async handleKeydown(event: KeyboardEvent) {\n    // Allow event to bubble.\n    await new Promise((resolve) => setTimeout(resolve, 0))\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 (event.defaultPrevented || (!isLeft && !isRight && !isHome && !isEnd)) {\n      return\n    }\n\n    const { tabs } = this\n    // Don't try to select another tab if there aren't any.\n    if (tabs.length < 2) {\n      return\n    }\n\n    // Prevent default interactions, such as scrolling.\n    event.preventDefault()\n\n    let indexToFocus: number\n    if (isHome || isEnd) {\n      indexToFocus = isHome ? 0 : tabs.length - 1\n    } else {\n      // Check if moving forwards or backwards\n      const isRtl = getComputedStyle(this).direction === 'rtl'\n      const forwards = isRtl ? isLeft : isRight\n      const { focusedTab } = this\n      if (!focusedTab) {\n        // If there is not already a tab focused, select the first or last tab\n        // based on the direction we're traveling.\n        indexToFocus = forwards ? 0 : tabs.length - 1\n      } else {\n        const focusedIndex = this.tabs.indexOf(focusedTab)\n        indexToFocus = forwards ? focusedIndex + 1 : focusedIndex - 1\n        if (indexToFocus >= tabs.length) {\n          // Return to start if moving past the last item.\n          indexToFocus = 0\n        } else if (indexToFocus < 0) {\n          // Go to end if moving before the first item.\n          indexToFocus = tabs.length - 1\n        }\n      }\n    }\n\n    const tabToFocus = tabs[indexToFocus]\n    tabToFocus.focus()\n    if (this.autoActivate) {\n      this.activateTab(tabToFocus)\n    } else {\n      this.updateFocusableTab(tabToFocus)\n    }\n  }\n\n  // scroll to item on keyup.\n  private handleKeyup() {\n    this.scrollToTab(this.focusedTab ?? this.activeTab)\n  }\n\n  private handleFocusout() {\n    // restore focus to selected item when blurring the tab bar.\n    if (this.matches(':focus-within')) {\n      return\n    }\n\n    const { activeTab } = this\n    if (activeTab) {\n      this.updateFocusableTab(activeTab)\n    }\n  }\n\n  private handleSlotChange() {\n    for (const tab of this.tabs) {\n      tab.priority = this.priority\n      if (tab.selected) {\n        tab.indicated = true\n      }\n    }\n    const firstTab = this.tabs[0]\n    if (!this.activeTab && firstTab) {\n      // If the active tab was removed, auto-select the first one. There should\n      // always be a selected tab while the bar has children.\n      this.activateTab(firstTab)\n    }\n\n    // When children shift, ensure the active tab is visible. For example, if\n    // many children are added before the active tab, it'd be pushed off screen.\n    // This ensures it stays visible.\n    this.scrollToTab(this.activeTab)\n    if (this.activeTab) {\n      this.updateFocusableTab(this.activeTab)\n    }\n  }\n\n  override render(): TemplateResult {\n    return html`\n      <div class=\"tabs\">${this.renderSlot()}</div>\n      ${this.renderIndicator()}\n      <ui-divider class=\"divider\"></ui-divider>\n    `\n  }\n\n  protected renderSlot(): TemplateResult {\n    return html`<slot @slotchange=\"${this.handleSlotChange}\" @click=\"${this.handleTabClick}\"></slot>`\n  }\n\n  protected renderIndicator(): TemplateResult {\n    const classes: ClassInfo = {\n      indicator: true,\n      indicated: this.indicated,\n      primary: this.priority === 'primary',\n      secondary: this.priority === 'secondary',\n    }\n    return html`\n      <div class=\"${classMap(classes)}\">\n        <span role=\"presentation\" class=\"pointer\" style=\"${styleMap(this.pointerStyles || {})}\"></span>\n      </div>\n    `\n  }\n}\n\nfunction isTab(element: unknown): element is UiTab {\n  return element instanceof UiTab\n}\n"]}

package/build/src/md/tabs/internals/Tabs.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs.styles.d.ts","sourceRoot":"","sources":["../../../../../src/md/tabs/internals/Tabs.styles.ts"],"names":[],"mappings":";AAEA,wBAmEC"}
+{"version":3,"file":"Tabs.styles.d.ts","sourceRoot":"","sources":["../../../../../src/md/tabs/internals/Tabs.styles.ts"],"names":[],"mappings":";AAEA,wBA+DC"}

package/build/src/md/tabs/internals/Tabs.styles.js

@@ -2,30 +2,31 @@ import { css } from 'lit';
 export default css `
   :host {
     display: block;
+    overflow: hidden;
+    box-sizing: border-box;
+    display: flex;
+    flex-direction: column;
+    position: relative;
   }
 
-  .content {
+  .tabs {
     display: flex;
     align-items: center;
-    overflow: hidden;
+    overflow: auto;
+    scroll-behavior: smooth;
+    scrollbar-width: none;
     flex: 1 1 0%;
+    align-self: stretch;
   }
 
-  .content ::slotted(*) {
+  .tabs ::slotted(*) {
     flex: 1;
     white-space: nowrap;
   }
 
-  .surface {
-    position: relative;
-    display: flex;
-    align-items: center;
-    /* background-color: var(--md-sys-color-surface); */
-  }
-
   .indicator {
     position: absolute;
-    bottom: 0px;
+    bottom: 1px;
     left: 0px;
     right: 0px;
     overflow: hidden;
@@ -58,13 +59,8 @@ export default css `
   }
 
   .divider {
-    position: absolute;
-    bottom: 0px;
-    left: 0px;
-    right: 0px;
+    align-self: stretch;
     margin: 0;
-    height: 1px;
-    background-color: var(--md-sys-color-surface-variant);
   }
 `;
 //# sourceMappingURL=Tabs.styles.js.map

package/build/src/md/tabs/internals/Tabs.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs.styles.js","sourceRoot":"","sources":["../../../../../src/md/tabs/internals/Tabs.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmEjB,CAAA","sourcesContent":["import { css } from 'lit'\n\nexport default css`\n  :host {\n    display: block;\n  }\n\n  .content {\n    display: flex;\n    align-items: center;\n    overflow: hidden;\n    flex: 1 1 0%;\n  }\n\n  .content ::slotted(*) {\n    flex: 1;\n    white-space: nowrap;\n  }\n\n  .surface {\n    position: relative;\n    display: flex;\n    align-items: center;\n    /* background-color: var(--md-sys-color-surface); */\n  }\n\n  .indicator {\n    position: absolute;\n    bottom: 0px;\n    left: 0px;\n    right: 0px;\n    overflow: hidden;\n    display: none;\n  }\n\n  .indicator.indicated {\n    display: block;\n  }\n\n  .indicator.primary {\n    height: 3px;\n  }\n\n  .indicator.secondary {\n    height: 2px;\n  }\n\n  .pointer {\n    height: inherit;\n    display: inline-block;\n    left: 0;\n    width: 40px;\n    background-color: var(--md-sys-color-primary);\n    position: absolute;\n  }\n\n  .indicator.primary .pointer {\n    border-radius: 3px 3px 0 0;\n  }\n\n  .divider {\n    position: absolute;\n    bottom: 0px;\n    left: 0px;\n    right: 0px;\n    margin: 0;\n    height: 1px;\n    background-color: var(--md-sys-color-surface-variant);\n  }\n`\n"]}
+{"version":3,"file":"Tabs.styles.js","sourceRoot":"","sources":["../../../../../src/md/tabs/internals/Tabs.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+DjB,CAAA","sourcesContent":["import { css } from 'lit'\n\nexport default css`\n  :host {\n    display: block;\n    overflow: hidden;\n    box-sizing: border-box;\n    display: flex;\n    flex-direction: column;\n    position: relative;\n  }\n\n  .tabs {\n    display: flex;\n    align-items: center;\n    overflow: auto;\n    scroll-behavior: smooth;\n    scrollbar-width: none;\n    flex: 1 1 0%;\n    align-self: stretch;\n  }\n\n  .tabs ::slotted(*) {\n    flex: 1;\n    white-space: nowrap;\n  }\n\n  .indicator {\n    position: absolute;\n    bottom: 1px;\n    left: 0px;\n    right: 0px;\n    overflow: hidden;\n    display: none;\n  }\n\n  .indicator.indicated {\n    display: block;\n  }\n\n  .indicator.primary {\n    height: 3px;\n  }\n\n  .indicator.secondary {\n    height: 2px;\n  }\n\n  .pointer {\n    height: inherit;\n    display: inline-block;\n    left: 0;\n    width: 40px;\n    background-color: var(--md-sys-color-primary);\n    position: absolute;\n  }\n\n  .indicator.primary .pointer {\n    border-radius: 3px 3px 0 0;\n  }\n\n  .divider {\n    align-self: stretch;\n    margin: 0;\n  }\n`\n"]}

package/demo/md/chip/chip.html

@@ -12,20 +12,47 @@
       margin: 20px 0;
     }
 
-    ui-chip:not(:last-of-type) {
-      margin-right: 12px;
+    .demo .demo-section {
+      max-width: 858px;
+      margin: 0 auto 80px auto;
+    }
+
+    .demo h2, .demo h3 {
+      margin-bottom: 36px;
+    }
+
+    .frame {
+      padding: 40px;
+      border-radius: 20px;
+      border: 1px var(--md-sys-color-outline) solid;
     }
 
     .grid-5 {
       display: grid;
-      grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
-      justify-items: center;
+      grid-template-columns: 160px 1fr 1fr 1fr 1fr;
+      gap: 0 0;
+      justify-items: center; 
+      align-items: center;
+      grid-template-rows: 40px repeat(auto-fit, minmax(80px, 1fr));
+      grid-auto-rows: 80px;
+
+      padding: 40px;
+      border-radius: 20px;
+      border: 1px var(--md-sys-color-outline) solid;
     }
 
     .grid-4 {
       display: grid;
-      grid-template-columns: 1fr 1fr 1fr 1fr;
-      justify-items: center;
+      grid-template-columns: 160px 1fr 1fr 1fr;
+      gap: 0 0;
+      justify-items: center; 
+      align-items: center;
+      grid-template-rows: 40px repeat(auto-fit, minmax(80px, 1fr));
+      grid-auto-rows: 60px;
+
+      padding: 40px;
+      border-radius: 20px;
+      border: 1px var(--md-sys-color-outline) solid;
     }
 
     .grid-3 {

package/demo/md/chip/chip.ts

@@ -3,6 +3,7 @@ import { iconWrapper } from '../../../src/md/icons/Icons.js'
 import type UiChip from '../../../src/md/chip/internals/Chip.js'
 import { DemoPage } from '../../../src/demo/DemoPage.js'
 import '../../../src/md/chip/ui-chip.js'
+import '../../../src/md/chip/ui-chip-set.js'
 import '../../../src/md/icons/ui-icon.js'
 
 const calendarIcon = iconWrapper(
@@ -36,72 +37,100 @@ class ComponentDemoPage extends DemoPage {
     return html`
       <a href="../">Back</a>
       <section class="demo-section">
-        <h2 class="title-large">Assist chip</h2>
-        <div class="demo-row grid-4">
-          <ui-chip type="assist" @click="${this.handleClickHandler}">Enabled</ui-chip>
-          <ui-chip type="assist" disabled @click="${this.handleClickHandler}">Disabled</ui-chip>
+        <h2 class="display-large">Assist chip</h2>
 
+        <div class="grid-5">
+          <span>&nbsp</span>
+          <span class="column-title title-medium">Regular</span>
+          <span class="column-title title-medium">Icon</span>
+          <span class="column-title title-medium">Avatar</span>
+          <span class="column-title title-medium">Elevated</span>
+
+          <span class="row-name title-small">Enabled</span>
+          <ui-chip type="assist" @click="${this.handleClickHandler}">Assist</ui-chip>
           <ui-chip type="assist" @click="${this.handleClickHandler}">
             <ui-icon slot="icon">${calendarIcon}</ui-icon>
-            With icon
+            Assist
+          </ui-chip>
+          <ui-chip type="assist" @click="${this.handleClickHandler}">
+            <img src="./pawel6c9a.jpg" slot="avatar" alt="Pawel Psztyc" />
+            Assist
+          </ui-chip>
+          <ui-chip type="assist" @click="${this.handleClickHandler}" elevated>
+            <ui-icon slot="icon">${calendarIcon}</ui-icon>Assist
           </ui-chip>
 
+          <span class="row-name title-small">Disabled</span>
+          <ui-chip type="assist" disabled @click="${this.handleClickHandler}">Assist</ui-chip>
           <ui-chip type="assist" @click="${this.handleClickHandler}" disabled>
             <ui-icon slot="icon">${calendarIcon}</ui-icon>
-            Disabled with icon
+            Assist
           </ui-chip>
-        </div>
-
-        <div class="demo-row grid-4">
-          <ui-chip type="assist" @click="${this.handleClickHandler}" elevated>Enabled</ui-chip>
-          <ui-chip type="assist" disabled @click="${this.handleClickHandler}" elevated>Disabled</ui-chip>
-
-          <ui-chip type="assist" @click="${this.handleClickHandler}" elevated>
-            <ui-icon slot="icon">${calendarIcon}</ui-icon>
-            With icon
+          <ui-chip type="assist" disabled @click="${this.handleClickHandler}">
+            <img src="./pawel6c9a.jpg" slot="avatar" alt="Pawel Psztyc" />
+            Assist
           </ui-chip>
-
           <ui-chip type="assist" @click="${this.handleClickHandler}" disabled elevated>
             <ui-icon slot="icon">${calendarIcon}</ui-icon>
-            Disabled with icon
+            Assist
           </ui-chip>
         </div>
       </section>
 
       <section class="demo-section">
-        <h2 class="title-large">Filter chip</h2>
-        <div class="demo-row grid-4">
-          <ui-chip type="filter" @click="${this.handleClickHandler}" @select="${this.handleSelect}">Docs</ui-chip>
+        <h2 class="display-large">Filter chip</h2>
+        <div class="grid-5">
+          <span>&nbsp</span>
+          <span class="column-title title-medium">Unchecked</span>
+          <span class="column-title title-medium">Checked</span>
+          <span class="column-title title-medium">List</span>
+          <span class="column-title title-medium">Elevated</span>
+
+          <span class="row-name title-small">Enabled</span>
+          <ui-chip type="filter" @click="${this.handleClickHandler}" @select="${this.handleSelect}">Filter</ui-chip>
           <ui-chip type="filter" checked @click="${this.handleClickHandler}" @select="${this.handleSelect}"
-            >Slides</ui-chip
-          >
-          <ui-chip type="filter" disabled @click="${this.handleClickHandler}" @select="${this.handleSelect}"
-            >Images</ui-chip
+            >Filter</ui-chip
           >
           <ui-chip
             type="filter"
-            list="abc"
+            list
             @click="${this.handleClickHandler}"
             @list="${this.handleList}"
             @select="${this.handleSelect}"
             >Other</ui-chip
           >
-        </div>
-        <div class="demo-row grid-4">
-          <ui-chip type="filter" @click="${this.handleClickHandler}" elevated @select="${this.handleSelect}"
-            >Docs</ui-chip
+          <ui-chip
+            type="filter"
+            list
+            elevated
+            @click="${this.handleClickHandler}"
+            @list="${this.handleList}"
+            @select="${this.handleSelect}"
+            >Other</ui-chip
           >
-          <ui-chip type="filter" checked @click="${this.handleClickHandler}" elevated @select="${this.handleSelect}"
-            >Slides</ui-chip
+
+          <span class="row-name title-small">Disabled</span>
+          <ui-chip type="filter" disabled @click="${this.handleClickHandler}" @select="${this.handleSelect}"
+            >Filter</ui-chip
           >
-          <ui-chip type="filter" disabled @click="${this.handleClickHandler}" elevated @select="${this.handleSelect}"
-            >Images</ui-chip
+          <ui-chip type="filter" disabled checked @click="${this.handleClickHandler}" @select="${this.handleSelect}"
+            >Filter</ui-chip
           >
           <ui-chip
             type="filter"
-            list="abc"
+            list
+            disabled
             @click="${this.handleClickHandler}"
+            @list="${this.handleList}"
+            @select="${this.handleSelect}"
+            >Other</ui-chip
+          >
+          <ui-chip
+            type="filter"
+            list
             elevated
+            disabled
+            @click="${this.handleClickHandler}"
             @list="${this.handleList}"
             @select="${this.handleSelect}"
             >Other</ui-chip
@@ -110,52 +139,78 @@ class ComponentDemoPage extends DemoPage {
       </section>
 
       <section class="demo-section">
-        <h2 class="title-large">Input chip</h2>
-        <div class="demo-row grid-3">
-          <ui-chip type="input" @click="${this.handleClickHandler}">Enabled</ui-chip>
-          <ui-chip type="input" closable @click="${this.handleClickHandler}" @close="${this.handleClose}"
-            >Closable</ui-chip
+        <h2 class="display-large">Input chip</h2>
+
+        <div class="grid-5">
+          <span>&nbsp</span>
+          <span class="column-title title-medium">Regular</span>
+          <span class="column-title title-medium">removable</span>
+          <span class="column-title title-medium">Disabled</span>
+          <span class="column-title title-medium">Elevated</span>
+
+          <span class="row-name title-small">Regular</span>
+          <ui-chip type="input" @click="${this.handleClickHandler}">Input</ui-chip>
+          <ui-chip type="input" removable @click="${this.handleClickHandler}" @close="${this.handleClose}"
+            >Input</ui-chip
           >
-          <ui-chip type="input" disabled @click="${this.handleClickHandler}">Disabled</ui-chip>
-        </div>
-        <div class="demo-row grid-3">
+          <ui-chip type="input" disabled @click="${this.handleClickHandler}">Input</ui-chip>
+          <ui-chip type="input" elevated @click="${this.handleClickHandler}">Input</ui-chip>
+
+          <span class="row-name title-small">With icon</span>
           <ui-chip type="input" @click="${this.handleClickHandler}">
             <ui-icon slot="icon">${calendarIcon}</ui-icon>
-            With icon
+            Input
           </ui-chip>
-          <ui-chip type="input" @click="${this.handleClickHandler}" closable @close="${this.handleClose}">
+          <ui-chip type="input" @click="${this.handleClickHandler}" removable @close="${this.handleClose}">
             <ui-icon slot="icon">${calendarIcon}</ui-icon>
-            With icon
+            Input
           </ui-chip>
-          <ui-chip type="input" @click="${this.handleClickHandler}" closable disabled @close="${this.handleClose}">
+          <ui-chip type="input" @click="${this.handleClickHandler}" removable disabled @close="${this.handleClose}">
             <ui-icon slot="icon">${calendarIcon}</ui-icon>
-            With icon
+            Input
           </ui-chip>
-        </div>
-        <div class="demo-row grid-3">
+          <ui-chip type="input" @click="${this.handleClickHandler}" removable elevated @close="${this.handleClose}">
+            <ui-icon slot="icon">${calendarIcon}</ui-icon>
+            Input
+          </ui-chip>
+
+          <span class="row-name title-small">With avatar</span>
           <ui-chip type="input" @click="${this.handleClickHandler}">
             <img src="./pawel6c9a.jpg" slot="avatar" alt="Pawel Psztyc" />
-            With avatar
+            Input
           </ui-chip>
-          <ui-chip type="input" @click="${this.handleClickHandler}" closable @close="${this.handleClose}">
+          <ui-chip type="input" @click="${this.handleClickHandler}" removable @close="${this.handleClose}">
             <img src="./pawel6c9a.jpg" slot="avatar" alt="Pawel Psztyc" />
-            With avatar
+            Input
           </ui-chip>
-          <ui-chip type="input" @click="${this.handleClickHandler}" closable disabled @close="${this.handleClose}">
+          <ui-chip type="input" @click="${this.handleClickHandler}" removable disabled @close="${this.handleClose}">
             <img src="./pawel6c9a.jpg" slot="avatar" alt="Pawel Psztyc" />
-            With avatar
+            Input
+          </ui-chip>
+          <ui-chip type="input" @click="${this.handleClickHandler}" removable elevated @close="${this.handleClose}">
+            <img src="./pawel6c9a.jpg" slot="avatar" alt="Pawel Psztyc" />
+            Input
           </ui-chip>
         </div>
       </section>
 
       <section class="demo-section">
-        <h2 class="title-large">Suggestion chip</h2>
-        <div class="demo-row grid-3">
+        <h2 class="display-large">Suggestion chip</h2>
+        <div class="demo-row grid-3 frame">
           <ui-chip type="suggestion" @click="${this.handleClickHandler}">Enabled</ui-chip>
           <ui-chip type="suggestion" @click="${this.handleClickHandler}" elevated>Elevated</ui-chip>
           <ui-chip type="suggestion" disabled @click="${this.handleClickHandler}">Disabled</ui-chip>
         </div>
       </section>
+
+      <section class="demo-section">
+        <h2 class="display-large">Chip set</h2>
+        <ui-chip-set>
+          <ui-chip type="input" @click="${this.handleClickHandler}" removable>Input</ui-chip>
+          <ui-chip type="input" @click="${this.handleClickHandler}" removable>Input</ui-chip>
+          <ui-chip type="input" @click="${this.handleClickHandler}" removable>Input</ui-chip>
+        </ui-chip-set>
+      </section>
     `
   }
 }

package/demo/md/tabs/tabs.html

@@ -11,6 +11,25 @@
     .demo-row {
       margin: 20px 0;
     }
+
+    .demo .demo-section {
+      max-width: 858px;
+      margin: 0 auto 80px auto;
+    }
+
+    .demo h2, .demo h3 {
+      margin-bottom: 36px;
+    }
+
+    .frame {
+      padding: 40px;
+      border-radius: 20px;
+      border: 1px var(--md-sys-color-outline) solid;
+    }
+
+    .scrollable {
+      max-width: 700px;
+    }
   </style>
 </head>
 <body>