@api-client/ui 0.1.1 → 0.1.3

package/build/src/elements/data-table/DataTable.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataTable.js","sourceRoot":"","sources":["../../../../src/elements/data-table/DataTable.ts"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable max-len */\nimport { html, LitElement, nothing, PropertyValues, TemplateResult } from 'lit'\nimport { property, state } from 'lit/decorators.js'\nimport { classMap } from 'lit/directives/class-map.js'\nimport { ref, createRef } from 'lit/directives/ref.js'\nimport { dataAttr } from '../../directives/data-attr.js'\nimport { LiveData } from '../../reactive/LiveData.js'\n\nimport '@material/web/icon/icon.js'\nimport '@material/web/menu/menu.js'\nimport '@material/web/menu/menu-item.js'\nimport '@material/web/focus/md-focus-ring.js'\nimport { ifDefined } from 'lit/directives/if-defined.js'\n\n/**\n * Options for rendering a table cell.\n */\nexport interface CellRenderOptions {\n  /**\n   * CSS classes to apply to the cell.\n   */\n  classes?: string[]\n  /**\n   * Data attributes to add to the cell (e.g., `data-id=\"my-id\"`).\n   */\n  data?: Record<string, string | number | boolean>\n  /**\n   * The value of the aria-label to render on the cell.\n   */\n  ariaLabel?: string\n  /**\n   * Used with interactive elements within the cell.\n   * The content of the cell should have exactly one element\n   * with the `tabindex=-1`. The table will automatically\n   * focus on that element when activated.\n   */\n  delegateFocus?: boolean\n  /**\n   * Used for accessibility. Should be set on the cell that represents\n   * the name for the row, like, a person name or a file name.\n   */\n  isPrimary?: boolean\n}\n\n/**\n * Options for rendering a table header cell. Extends CellRenderOptions.\n */\nexport interface HeaderCellRenderOptions extends CellRenderOptions {\n  /**\n   * The name of the sort property.\n   */\n  sort?: string\n}\n\nexport interface CellPosition {\n  /**\n   * The index of the selected row\n   */\n  row: number\n  /**\n   * The index of the selected cell\n   */\n  col: number\n\n  /**\n   * Whether the logic should ignore setting up focus.\n   * This is used when tracking cell selection when using a pointer device.\n   */\n  ignoreFocus?: boolean\n}\n\nexport interface EventCellInfo {\n  /**\n   * The cell element.\n   */\n  cell: HTMLElement\n  /**\n   * The column index\n   */\n  col: number\n  /**\n   * The **table** row index (not items)\n   */\n  row: number\n}\n\n/**\n * A versatile and accessible data table web component.\n *\n * The `DataTable` component provides a highly customizable and accessible way to display tabular data.\n * It offers features such as:\n *\n * - **Accessibility:** Built with ARIA roles and attributes for screen reader compatibility and keyboard navigation.\n * - **Customizable Cells:** Allows complete control over the content and rendering of each cell in the table.\n * - **Header Customization:** Provides flexibility in defining and rendering table headers, including sorting.\n * - **Selection:** Supports single, multiple, or no selection of rows.\n * - **Activation:** Enables the activation of rows (e.g., via double-click or Enter/Space key).\n * - **Infinite Scrolling:** Supports \"load more\" functionality (infinite scroll) using a sentinel element.\n * - **Sorting:** Allows sorting of data by clicking on sortable header cells.\n * - **Keyboard Navigation:** Full keyboard support for navigating through the table.\n * - **Empty State:** Customizable content to display when the table has no data.\n * - **Focus Management:** Properly manages focus for both keyboard and pointer interactions.\n *\n * @slot empty - Optional. Content to display when the table is empty (i.e., `items` is an empty array).\n *                Defaults to a message saying \"No data to display.\"\n *\n * @fires select - Dispatched when the selection changes.\n *                  - `detail`: An object with a `selectedItems` property, containing an array of the currently selected items.\n *                  - Example: `{ selectedItems: [item1, item2] }`\n *\n * @fires activate - Dispatched when a row is activated (e.g., double-clicked or Enter/Space pressed).\n *                  - `detail`: The data item that was activated.\n *                  - Example: `item1`\n *\n * @fires scrollend - Dispatched when the user scrolls to the bottom of the table (when the `overflow` property is true).\n *                  - No event detail.\n *\n * @fires sort - Dispatched when the user clicks on a sortable header to change the sorting.\n *                  - `detail`: An object with `column` and `direction` properties.\n *                  - `column`: The name of the column being sorted.\n *                  - `direction`: The sort direction, either \"asc\" (ascending) or \"desc\" (descending).\n *                  - Example: `{ column: \"name\", direction: \"asc\" }`\n *\n * @csspart table - The underlying `<table>` element.\n * @csspart cell - Individual `<td>` and `<th>` elements.\n * @csspart header-cell - Individual `<th>` elements.\n *\n * @cssprop --md-focus-ring-shape-start-start - The start-start corner shape for the focus ring.\n * @cssprop --md-focus-ring-shape-start-end - The start-end corner shape for the focus ring.\n * @cssprop --md-focus-ring-shape-end-end - The end-end corner shape for the focus ring.\n * @cssprop --md-focus-ring-shape-end-start - The end-start corner shape for the focus ring.\n * @cssprop --md-sys-typescale-label-large-font - The font family for label large.\n * @cssprop --md-sys-typescale-label-large-size - The font size for label large.\n * @cssprop --md-sys-typescale-label-large-tracking - The letter spacing for label large.\n * @cssprop --md-sys-typescale-label-large-height - The line height for label large.\n * @cssprop --md-sys-typescale-label-large-weight - The font weight for label large.\n * @cssprop --md-sys-color-outline-variant - The outline variant color.\n * @cssprop --md-sys-color-secondary-container - The secondary container color.\n * @cssprop --md-icon-size - The size of the icons.\n * @cssprop --md-sys-typescale-title-small-font - The font family for title small.\n * @cssprop --md-sys-typescale-title-small-weight - The font weight for title small.\n * @cssprop --md-sys-typescale-title-small-size - The font size for title small.\n * @cssprop --md-sys-typescale-title-small-tracking - The letter spacing for title small.\n * @cssprop --md-sys-typescale-title-small-height - The line height for title small.\n * @cssprop --md-sys-typescale-body-medium-font - The font family for body medium.\n * @cssprop --md-sys-typescale-body-medium-weight - The font weight for body medium.\n * @cssprop --md-sys-typescale-body-medium-size - The font size for body medium.\n * @cssprop --md-sys-typescale-body-medium-tracking - The letter spacing for body medium.\n * @cssprop --md-sys-typescale-body-medium-height - The line height for body medium.\n *\n * @typeParam T The type of data items in the table.\n *\n * @example\n * ```html\n * <data-table\n *   .items=\"${myItems}\"\n *   selection=\"multi\"\n *   @select=\"${handleSelect}\"\n *   @activate=\"${handleActivate}\"\n *   @scrollend=\"${handleScrollEnd}\"\n *   @sort=\"${handleSort}\"\n *   overflow\n * >\n *   <p slot=\"empty\">No items to display at this time.</p>\n * </data-table>\n * ```\n *\n * @example\n * ```typescript\n * // Inside a subclass of DataTable.\n * // Rendering a name cell.\n * #nameCell(item: MyItem, row: number, col: number): TemplateResult {\n *   return this.renderCell(item.name, row, col, { isPrimary: true });\n * }\n *\n * // Rendering a header cell.\n * override renderHeader(): TemplateResult[] {\n *   return [\n *     this.renderHeaderCell('Name', 0, { sort: 'name' }),\n *     this.renderHeaderCell('Value', 1, { sort: 'value' }),\n *   ];\n * }\n * ```\n */\nexport abstract class DataTable<T extends object> extends LitElement {\n  /**\n   * The data items to display in the table.\n   */\n  @property({ type: Object }) accessor items: LiveData<T[]> | undefined\n\n  /**\n   * The selection mode. Can be \"none\", \"single\", or \"multi\".\n   * - `none`: No selection is allowed.\n   * - `single`: Only one item can be selected at a time.\n   * - `multi`: Multiple items can be selected.\n   * @attribute\n   * @default \"none\"\n   */\n  @property({ type: String, reflect: true }) accessor selection: 'none' | 'single' | 'multi' = 'none'\n\n  /**\n   * The currently selected items.\n   * @default []\n   */\n  @property({ type: Array }) accessor selectedItems: T[] = []\n\n  /**\n   * The ARIA label for the table. Used for accessibility.\n   * @attribute\n   * @default \"Data table\"\n   */\n  @property({ type: String, reflect: true }) override accessor ariaLabel = 'Data table'\n\n  /**\n   * Enables double-click and Enter/Space key activation of table items.\n   * When `true`, items can be activated by:\n   * - Double-clicking the item.\n   * - Focusing on the item and pressing Enter or Space.\n   * The `activate` event is dispatched when an item is activated.\n   * @attribute\n   * @default false\n   */\n  @property({ type: Boolean }) accessor active = false\n\n  /**\n   * Enables the \"load more\" functionality when the user scrolls to the bottom of the table.\n   * When `true`, a sentinel element is added to the bottom of the table. When the sentinel\n   * becomes visible, the `scrollend` event is dispatched.\n   * This is commonly used for infinite scrolling or lazy loading of data.\n   * @attribute\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true }) accessor overflow = false\n\n  /**\n   * The name of the property to sort the table by. If set, the table will\n   * automatically indicate the sortable header.\n   * @default undefined\n   */\n  @property({ type: String }) accessor sort: string | undefined\n\n  @property({ type: String }) accessor sortDirection: 'asc' | 'desc' | undefined\n\n  protected lastSelectedIndex = -1\n\n  protected observer?: IntersectionObserver\n\n  protected sentinel = createRef<HTMLElement>()\n\n  /**\n   * The current focus position.\n   * It is used to support keyboard navigation.\n   *\n   * Initially we always allow to focus on the first cell, which\n   * should be the first header cell. The keyboard navigation will\n   * take over.\n   */\n  @state() accessor position: CellPosition = { row: 0, col: 0 }\n\n  constructor() {\n    super()\n    this.handleLiveData = this.handleLiveData.bind(this)\n  }\n\n  override connectedCallback(): void {\n    super.connectedCallback()\n    if (this.overflow) {\n      // Only create the observer if overflow is enabled\n      this.createObserver()\n    }\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback()\n    this.observer?.disconnect()\n    this.observer = undefined\n  }\n\n  override firstUpdated(): void {\n    if (this.overflow) {\n      this.createObserver()\n    }\n  }\n\n  protected override willUpdate(cp: PropertyValues<this>): void {\n    if (cp.has('items')) {\n      this.lastSelectedIndex = -1\n      this.revalidateSelection()\n    }\n  }\n\n  protected override updated(cp: PropertyValues<this>): void {\n    if (cp.has('position')) {\n      const { row, col, ignoreFocus = false } = this.position\n      if (!ignoreFocus) {\n        const cell = this.shadowRoot?.querySelector(`[data-row=\"${row}\"][data-col=\"${col}\"]`) as HTMLElement | null\n        if (cell) {\n          cell.focus()\n        }\n      }\n    }\n    if (cp.has('items')) {\n      const old = cp.get('items')\n      if (old) {\n        old.removeEventListener('update', this.handleLiveData)\n      }\n      if (this.items) {\n        this.items.addEventListener('update', this.handleLiveData)\n      }\n    }\n  }\n\n  handleLiveData(): void {\n    this.requestUpdate()\n  }\n\n  /**\n   * @internal\n   * @description Creates and configures an `IntersectionObserver` to detect when the sentinel element is visible,\n   * indicating the user has scrolled to the bottom of the table.\n   *\n   * This method sets up the observer to watch the sentinel element. When the sentinel intersects with the component's viewport,\n   * it triggers the `scrollend` event.\n   *\n   * This function is used when `overflow` is set to true.\n   *\n   * @returns void\n   */\n  protected createObserver(): void {\n    const { sentinel } = this\n    if (!sentinel.value) {\n      return\n    }\n\n    const options: IntersectionObserverInit = {\n      root: this, // Observe within the component's viewport\n      rootMargin: '0px', // No margin\n      threshold: 0.0, // Trigger when the sentinel is 0% visible (at the very bottom)\n    }\n\n    this.observer = new IntersectionObserver(this.handleIntersection, options)\n    this.observer.observe(sentinel.value) // Observe the sentinel.\n  }\n\n  protected revalidateSelection(): void {\n    const { items, selectedItems = [] } = this\n    if (!items || selectedItems.length === 0) {\n      return\n    }\n    const filteredSelectedItems = selectedItems.filter((selectedItem) =>\n      items.value.some((item) => item === selectedItem)\n    )\n    if (filteredSelectedItems.length !== selectedItems.length) {\n      this.selectedItems = filteredSelectedItems\n      this.dispatchEvent(\n        new CustomEvent('select', {\n          detail: { selectedItems: this.selectedItems },\n        })\n      )\n    }\n  }\n\n  /**\n   * @internal\n   * @description Handles the intersection of the sentinel element with the viewport.\n   *\n   * This method is the callback function for the `IntersectionObserver`. When the sentinel becomes visible,\n   * it dispatches the `scrollend` event to signal that the user has reached the bottom of the table.\n   *\n   * @param entries - An array of IntersectionObserverEntry objects.\n   * @returns void\n   */\n  handleIntersection: IntersectionObserverCallback = (entries): void => {\n    if (entries.some((entry) => entry.isIntersecting)) {\n      this.dispatchEvent(new CustomEvent('scrollend'))\n    }\n  }\n\n  /**\n   * @internal\n   * @description Extracts information about a cell from an event.\n   *\n   * This method analyzes the event's composed path to identify the clicked or focused cell (either `<td>` or `<th>`).\n   * It returns the cell element, its column index, and its row index.\n   * It is also capable of detecting if the user focused on an interactive element within a cell.\n   *\n   * @param e - The event object (typically a MouseEvent or KeyboardEvent).\n   * @returns An object containing the cell element, column index, and row index, or `undefined` if the target is not a cell.\n   */\n  protected infoFromEvent(e: Event): EventCellInfo | undefined {\n    const path = e.composedPath()\n    let cell: HTMLElement | undefined\n    for (const current of path.values()) {\n      const element = current as Element\n      if (element.nodeType !== Node.ELEMENT_NODE) {\n        continue\n      }\n      const isTarget = ['TD', 'TH'].includes(element.nodeName)\n      if (!isTarget && element.hasAttribute('tabindex')) {\n        // It means that the user focusing on an interactive element\n        // within a cell and we should abandon whatever we do right now.\n        return\n      }\n      if (isTarget) {\n        cell = element as HTMLElement\n        break\n      }\n    }\n    if (!cell) {\n      return\n    }\n    const col = Number(cell.dataset.col)\n    const row = Number(cell.dataset.row)\n    if (isNaN(col) || isNaN(row)) {\n      return\n    }\n    return { cell, col, row }\n  }\n\n  /**\n   * @internal\n   * @description Gets the number of columns and rows of the table.\n   *\n   * @returns An object with `cols` and `rows` properties indicating the number of columns and rows.\n   */\n  protected getSize(): { cols: number; rows: number } {\n    const result = { cols: 0, rows: 0 }\n    const table = this.shadowRoot?.querySelector('table')\n    if (!table) {\n      return result\n    }\n    const row = table.querySelector('tr')\n    if (!row) {\n      return result\n    }\n    const columns = row.querySelectorAll('th, td')\n    result.cols = columns.length ? columns.length - 1 : 0\n    const rows = table.rows\n    result.rows = rows.length ? rows.length - 1 : 0\n    return result\n  }\n\n  /**\n   * @internal\n   * @description Get the element containing the cell data.\n   *\n   * @param col - The column index of the cell.\n   * @param row - The row index of the cell.\n   * @returns An object with the cell element and `delegateFocus` flag, or `undefined` if the cell does not exist.\n   */\n  protected getCellInfo(col: number, row: number): { cell: HTMLElement; delegateFocus: boolean } | undefined {\n    const cell = this.shadowRoot?.querySelector(`[data-col=\"${col}\"][data-row=\"${row}\"]`) as HTMLElement | null\n    if (!cell) {\n      return\n    }\n    const delegateFocus = cell.dataset.delegate === 'true'\n    return { cell, delegateFocus }\n  }\n\n  /**\n   * @internal\n   * @description Delegates the focus to a specific interactive element within a cell.\n   *\n   * This method is used when the cell is configured to handle its own focus management (i.e., `delegateFocus` is `true`).\n   *\n   * @param parent - The parent element (the cell) containing the interactive element.\n   * @returns void\n   */\n  protected delegateFocus(parent: HTMLElement): void {\n    const delegate = parent.querySelector('[tabindex]') as HTMLElement | null\n    if (delegate) {\n      delegate.focus()\n    }\n  }\n\n  /**\n   * @internal\n   * @description Moves the focus to the specified cell.\n   *\n   * This method updates the component's internal `position` state and then focuses on the corresponding cell.\n   * If the cell has the `delegateFocus` property, it delegates the focus to the first interactive element inside of the cell.\n   *\n   * @param col - The column index of the cell to focus on.\n   * @param row - The row index of the cell to focus on.\n   * @returns void\n   */\n  protected moveFocusTo(col: number, row: number): void {\n    const cell = this.getCellInfo(col, row)\n    if (!cell) {\n      return\n    }\n    this.position = { row, col }\n    if (cell.delegateFocus) {\n      this.position.ignoreFocus = true\n      this.delegateFocus(cell.cell)\n    }\n  }\n\n  /**\n   * @internal\n   * @description Handles keyboard navigation within the table.\n   *\n   * This method processes keyboard events to move the focus between cells. It supports arrow keys, Page Up/Down, Home/End, Enter and Space.\n   * - ArrowRight: Moves focus to the next cell to the right.\n   * - ArrowLeft: Moves focus to the next cell to the left.\n   * - ArrowDown: Moves focus to the cell below.\n   * - ArrowUp: Moves focus to the cell above.\n   * - PageUp: Moves focus to the first row.\n   * - PageDown: Moves focus to the last row.\n   * - Home: Moves focus to the first cell of the current row (Ctrl+Home moves to the first cell of the first row).\n   * - End: Moves focus to the last cell of the current row (Ctrl+End moves to the last cell of the last row).\n   * - Enter: Activates the current row.\n   * - Space: Manages selection.\n   *\n   * @param e - The KeyboardEvent object.\n   * @returns void\n   */\n  protected handleKeyDown(e: KeyboardEvent) {\n    if (e.defaultPrevented) {\n      return\n    }\n    const info = this.infoFromEvent(e)\n    if (!info) {\n      // This also makes sure that when we are focusing on an element\n      // within a `delegateFocus` cell, we won't interfere with its events.\n      return\n    }\n    const { code } = e\n    const { position } = this\n    const size = this.getSize()\n    if (code === 'ArrowRight') {\n      e.preventDefault()\n      if (position.col < size.cols) {\n        this.moveFocusTo(position.col + 1, position.row)\n      }\n    } else if (code === 'ArrowLeft') {\n      e.preventDefault()\n      if (position.col > 0) {\n        this.moveFocusTo(position.col - 1, position.row)\n      }\n    } else if (code === 'ArrowDown') {\n      e.preventDefault()\n      if (position.row < size.rows) {\n        this.moveFocusTo(position.col, position.row + 1)\n      }\n    } else if (code === 'ArrowUp') {\n      e.preventDefault()\n      if (position.row > 0) {\n        this.moveFocusTo(position.col, position.row - 1)\n      }\n    } else if (code === 'PageUp') {\n      e.preventDefault()\n      if (position.row > 1) {\n        this.moveFocusTo(position.col, 1)\n      }\n    } else if (code === 'PageDown') {\n      e.preventDefault()\n      if (position.row < size.rows) {\n        this.moveFocusTo(position.col, size.rows)\n      }\n    } else if (code === 'Home') {\n      e.preventDefault()\n      if (!e.ctrlKey && position.col > 0) {\n        this.moveFocusTo(0, position.row)\n      } else if (e.ctrlKey && (position.row > 1 || position.col > 0)) {\n        this.moveFocusTo(0, 1)\n      }\n    } else if (code === 'End') {\n      e.preventDefault()\n      if (!e.ctrlKey && position.col < size.cols) {\n        this.moveFocusTo(size.cols, position.row)\n      } else if (e.ctrlKey && position.row < size.rows) {\n        this.moveFocusTo(size.cols, size.rows)\n      }\n    } else if (code === 'Enter') {\n      e.preventDefault()\n      this.activateFromCellInfo(info)\n    } else if (code === 'Space') {\n      e.preventDefault()\n      this.manageSelectionFromEvent(info, e)\n    }\n  }\n\n  /**\n   * @internal\n   * @description Handles mouse click events on the table.\n   *\n   * @param e - The MouseEvent object.\n   * @returns void\n   */\n  protected handleClick(e: MouseEvent): void {\n    if (e.detail === 3) {\n      return\n    }\n    const info = this.infoFromEvent(e)\n    if (!info) {\n      return\n    }\n    if (e.detail === 2) {\n      this.activateFromCellInfo(info)\n    } else {\n      this.manageSelectionFromEvent(info, e)\n    }\n  }\n\n  /**\n   * @internal\n   * @description Manages the selection state based on a mouse or keyboard event.\n   *\n   * This method determines the row and column from the event target and updates the `selectedItems` array accordingly.\n   * It supports single, multiple and no selection based on the `selection` property. It also supports shift-click.\n   *\n   * @param info - The cell info.\n   * @param e - The MouseEvent or KeyboardEvent object.\n   * @returns void\n   */\n  protected manageSelectionFromEvent(info: EventCellInfo, e: MouseEvent | KeyboardEvent): void {\n    if (!this.items) {\n      return\n    }\n    const { row, col } = info\n    const index = row - 1\n    if (info.row === 0) {\n      // Handle sort.\n      this.sortFrom(info.cell)\n      this.position = { row, col }\n      return\n    }\n    const item = this.items.value[index]\n    if (!item) {\n      return\n    }\n\n    const isMultiSelect = this.selection === 'multi'\n    if (isMultiSelect && (e.metaKey || e.ctrlKey)) {\n      this.toggleSelection(item, 'add')\n    } else if (isMultiSelect && e.shiftKey) {\n      this.handleShiftClick(index, item)\n    } else {\n      this.toggleSelection(item, 'replace')\n      this.lastSelectedIndex = index\n    }\n    // This won't cause the focus ring to be rendered because the cell\n    // won't hey the `tabindex=0`, which is OK with pointer device navigation,\n    // but it will keep track of the last cell in case the keyboard navigation starts.\n    this.position = { row, col }\n  }\n\n  /**\n   * @internal\n   * @description Handles shift-click for range selection.\n   *\n   * When shift-clicking a row, it will select all the items between the last selected item and the clicked item.\n   *\n   * @param clickedIndex - The index of the clicked item.\n   * @param item - The clicked item.\n   * @returns void\n   */\n  protected handleShiftClick(clickedIndex: number, item: T) {\n    if (!this.items) {\n      return\n    }\n    if (this.lastSelectedIndex === -1) {\n      // If no previous selection, just select the clicked item.\n      this.toggleSelection(item)\n      this.lastSelectedIndex = clickedIndex\n      return\n    }\n    const startIndex = Math.min(this.lastSelectedIndex, clickedIndex)\n    const endIndex = Math.max(this.lastSelectedIndex, clickedIndex)\n    const newSelectedItems = this.items.value.slice(startIndex, endIndex + 1)\n    this.selectedItems = newSelectedItems as T[]\n    this.dispatchEvent(new CustomEvent('select', { detail: { selectedItems: this.selectedItems } }))\n  }\n\n  /**\n   * @internal\n   * @description Activates the row associated with the given event.\n   *\n   * This method is called when a row is double-clicked or when the Enter/Space key is pressed while a row is focused.\n   *\n   * @param e - The Event object.\n   * @returns void\n   */\n  protected activateFromCellInfo(info: EventCellInfo): void {\n    if (!this.items) {\n      return\n    }\n    if (info.row === 0) {\n      // Handle sort.\n      this.sortFrom(info.cell)\n      return\n    }\n    const item = this.items.value[info.row - 1]\n    if (!item) {\n      return\n    }\n    this.dispatchEvent(new CustomEvent('activate', { detail: item }))\n  }\n\n  /**\n   * @internal\n   * @description Handles sorting logic based on the clicked column header.\n   *\n   * This method updates the `sort` and `sortDirection` properties and dispatches the `sort` event.\n   *\n   * @param column - The header cell element.\n   * @returns void\n   */\n  protected sortFrom(column: HTMLElement): void {\n    const sort = column.dataset.sort\n    if (!sort) {\n      return\n    }\n    if (this.sort === sort) {\n      this.sortDirection = this.sortDirection === 'asc' ? 'desc' : 'asc'\n    } else {\n      this.sort = sort\n      this.sortDirection = 'asc'\n    }\n    this.dispatchEvent(\n      new CustomEvent('sort', {\n        detail: {\n          column: this.sort,\n          direction: this.sortDirection,\n        },\n      })\n    )\n  }\n\n  /**\n   * @public\n   * @description Checks if an item is currently selected.\n   *\n   * @param item - The item to check.\n   * @returns `true` if the item is selected, `false` otherwise.\n   */\n  isSelected(item: T): boolean {\n    return this.selectedItems.includes(item)\n  }\n\n  /**\n   * @public\n   * @description Toggles the selection state of an item.\n   *\n   * This method adds or removes an item from the `selectedItems` array.\n   *\n   * @param item - The item to toggle selection for.\n   * @param mode - The selection mode, either 'replace' or 'add' (defaults to 'replace').\n   * @returns void\n   */\n  toggleSelection(item: T, mode: 'replace' | 'add' = 'replace') {\n    if (this.selection === 'none') {\n      return\n    }\n\n    if (this.selection === 'single') {\n      this.selectedItems = [item]\n    } else {\n      // multi-select\n      const index = this.selectedItems.indexOf(item)\n      if (mode === 'replace') {\n        this.selectedItems = [item]\n      } else if (index === -1) {\n        this.selectedItems = [...this.selectedItems, item]\n      } else {\n        this.selectedItems = this.selectedItems.filter((i) => i !== item)\n      }\n    }\n\n    this.dispatchEvent(new CustomEvent('select', { detail: { selectedItems: this.selectedItems } }))\n  }\n\n  /**\n   * @internal\n   * @description Renders the table.\n   *\n   * @returns A `TemplateResult` for rendering.\n   */\n  override render(): TemplateResult {\n    if (!this.items || !this.items.value.length) {\n      return this.renderEmpty()\n    }\n    const isMulti = this.selection === 'multi'\n    return html`\n      <table\n        part=\"table\"\n        role=\"grid\"\n        aria-multiselectable=\"${ifDefined(isMulti ? 'true' : undefined)}\"\n        aria-label=\"${this.ariaLabel}\"\n        @keydown=\"${this.handleKeyDown}\"\n        @click=\"${this.handleClick}\"\n      >\n        <thead>\n          <tr role=\"row\">\n            ${this.renderHeader()}\n          </tr>\n        </thead>\n        <tbody>\n          ${this.items.value.map((item, index) => this.renderRow(item, index))}\n        </tbody>\n      </table>\n      ${this.overflow ? html`<div class=\"scroll-sentinel\" ${ref(this.sentinel)}></div>` : nothing}\n    `\n  }\n\n  /**\n   * @internal\n   * @description Renders the empty state of the table.\n   *\n   * @returns A `TemplateResult` for rendering.\n   */\n  renderEmpty(): TemplateResult {\n    return html`\n      <slot name=\"empty\">\n        <p role=\"status\" class=\"empty\">No data to display.</p>\n      </slot>\n    `\n  }\n\n  /**\n   * @internal\n   * @description Renders the table header cells. Must be implemented by subclasses.\n   *\n   * @returns An array of `TemplateResult` objects representing the header cells.\n   */\n  abstract renderHeader(): TemplateResult[]\n\n  /**\n   * @internal\n   * @description Renders the cells for a given row item. Must be implemented by subclasses.\n   *\n   * @param item The data item for the row.\n   * @param index The index that should be passed back to the rendering function. This is not the item index.\n   * @returns An array of `TemplateResult` objects representing the cells for the row.\n   */\n  abstract renderRowValues(item: T, index: number): TemplateResult[]\n\n  /**\n   * @internal\n   * @description Renders a single row in the table.\n   *\n   * @param item - The data item for the row.\n   * @param index - The index of the row.\n   * @returns A `TemplateResult` for rendering.\n   */\n  protected renderRow(item: T, index: number): TemplateResult {\n    const rowClasses = {\n      selected: this.isSelected(item as T),\n    }\n\n    return html`\n      <tr\n        role=\"row\"\n        aria-selected=\"${this.isSelected(item as T) ? 'true' : 'false'}\"\n        data-index=\"${index}\"\n        class=\"${classMap(rowClasses)}\"\n      >\n        ${this.renderRowValues(item, index + 1)}\n      </tr>\n    `\n  }\n\n  /**\n   * @internal\n   * A helper method to render a standard table cell.\n   *\n   * @param content The content of the cell.\n   * @param row The 0-based row index of the rendered cell\n   * @param col The 0-based column index of the rendered cell\n   * @param opts Options for rendering the cell (classes, icon, data attributes).\n   * @returns A `TemplateResult` representing the rendered cell.\n   */\n  protected renderCell(content: unknown, row: number, col: number, opts: CellRenderOptions = {}): TemplateResult {\n    const { position } = this\n    const { data = {}, classes = [], ariaLabel, delegateFocus = false, isPrimary = false } = opts\n    const cellClasses: Record<string, boolean> = { 'grid-cell': true }\n    classes?.forEach((c) => (cellClasses[c] = true))\n    const isFocused = position?.col === col && position?.row === row\n    let index: number | undefined\n    if (!delegateFocus) {\n      index = isFocused ? 0 : -1\n    }\n    const ring = !delegateFocus\n      ? html`<md-focus-ring .inward=\"${this.overflow ? true : false}\"></md-focus-ring>`\n      : nothing\n    if (isPrimary) {\n      // Lit does not allow dynamic element names so I decided to make a copy.\n      return html`\n        <th\n          role=\"gridcell\"\n          class=\"${classMap(cellClasses)}\"\n          ${dataAttr(data)}\n          aria-label=\"${ifDefined(ariaLabel)}\"\n          tabindex=\"${ifDefined(index)}\"\n          data-delegate=\"${ifDefined(delegateFocus ? true : undefined)}\"\n          data-row=\"${row}\"\n          data-col=\"${col}\"\n          scope=\"row\"\n          part=\"cell\"\n        >\n          ${ring}\n          <div class=\"cell-content\">${content}</div>\n        </th>\n      `\n    }\n    return html`\n      <td\n        role=\"gridcell\"\n        class=\"${classMap(cellClasses)}\"\n        ${dataAttr(data)}\n        aria-label=\"${ifDefined(ariaLabel)}\"\n        tabindex=\"${ifDefined(index)}\"\n        data-delegate=\"${ifDefined(delegateFocus ? true : undefined)}\"\n        data-row=\"${row}\"\n        data-col=\"${col}\"\n        part=\"cell\"\n      >\n        ${ring}\n        <div class=\"cell-content\">${content}</div>\n      </td>\n    `\n  }\n\n  /**\n   * @internal\n   * @description Returns the name of the icon to use for sorting indication.\n   *\n   * @returns The name of the Material Icon to use (either \"arrow_upward\" or \"arrow_downward\").\n   */\n  get sortIconName(): string {\n    return this.sortDirection === 'asc' ? 'arrow_upward' : 'arrow_downward'\n  }\n\n  /**\n   * @internal\n   * A helper method to render a table header cell.\n   *\n   * @param content The content of the header cell.\n   * @param opts Options for rendering the header cell (classes, data attributes).\n   * @returns A `TemplateResult` representing the rendered header cell.\n   */\n  protected renderHeaderCell(content: unknown, col: number, opts: HeaderCellRenderOptions = {}): TemplateResult {\n    const { position } = this\n    const { data = {}, classes = [], sort, delegateFocus = false, ariaLabel } = opts\n    const cellClasses: Record<string, boolean> = { 'grid-header': true }\n    classes?.forEach((c) => (cellClasses[c] = true))\n    const isSortable = !!sort\n    const isSorted = this.sort === sort\n    const sortIcon = isSorted ? this.sortIconName : undefined\n    const isFocused = position?.col === col && position?.row === 0\n    let index: number | undefined\n    if (!delegateFocus) {\n      index = isFocused ? 0 : -1\n    }\n    let ariaSort: 'ascending' | 'descending' | 'none' | undefined\n    if (isSorted) {\n      ariaSort = this.sortDirection === 'asc' ? 'ascending' : 'descending'\n    } else if (isSortable) {\n      ariaSort = 'none'\n    }\n    return html`<th\n      role=\"columnheader\"\n      scope=\"col\"\n      class=\"${classMap(cellClasses)}\"\n      ${dataAttr(data)}\n      aria-sort=\"${ifDefined(ariaSort)}\"\n      data-sort=\"${ifDefined(sort)}\"\n      data-row=\"0\"\n      data-col=\"${col}\"\n      tabindex=\"${ifDefined(index)}\"\n      data-delegate=\"${ifDefined(delegateFocus ? true : undefined)}\"\n      aria-label=\"${ifDefined(ariaLabel)}\"\n      part=\"header-cell\"\n    >\n      <md-focus-ring .inward=\"${this.overflow ? true : false}\"></md-focus-ring>\n      <div class=\"cell-content\">\n        ${content}\n        ${isSortable && sortIcon ? html`<md-icon class=\"sort-icon\" role=\"presentation\">${sortIcon}</md-icon>` : nothing}\n      </div>\n    </th> `\n  }\n}\n"]}
+{"version":3,"file":"DataTable.js","sourceRoot":"","sources":["../../../../src/elements/data-table/DataTable.ts"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable max-len */\nimport { html, LitElement, nothing, PropertyValues, TemplateResult } from 'lit'\nimport { property, state } from 'lit/decorators.js'\nimport { classMap } from 'lit/directives/class-map.js'\nimport { ref, createRef } from 'lit/directives/ref.js'\nimport { dataAttr } from '../../directives/data-attr.js'\nimport { LiveData } from '../../reactive/LiveData.js'\n\nimport '@material/web/icon/icon.js'\nimport '@material/web/menu/menu.js'\nimport '@material/web/menu/menu-item.js'\nimport '@material/web/focus/md-focus-ring.js'\nimport { ifDefined } from 'lit/directives/if-defined.js'\n\n/**\n * Options for rendering a table cell.\n */\nexport interface CellRenderOptions {\n  /**\n   * CSS classes to apply to the cell.\n   */\n  classes?: string[]\n  /**\n   * Data attributes to add to the cell (e.g., `data-id=\"my-id\"`).\n   */\n  data?: Record<string, string | number | boolean>\n  /**\n   * The value of the aria-label to render on the cell.\n   */\n  ariaLabel?: string\n  /**\n   * Used with interactive elements within the cell.\n   * The content of the cell should have exactly one element\n   * with the `tabindex=-1`. The table will automatically\n   * focus on that element when activated.\n   */\n  delegateFocus?: boolean\n  /**\n   * Used for accessibility. Should be set on the cell that represents\n   * the name for the row, like, a person name or a file name.\n   */\n  isPrimary?: boolean\n}\n\n/**\n * Options for rendering a table header cell. Extends CellRenderOptions.\n */\nexport interface HeaderCellRenderOptions extends CellRenderOptions {\n  /**\n   * The name of the sort property.\n   */\n  sort?: string\n}\n\nexport interface CellPosition {\n  /**\n   * The index of the selected row\n   */\n  row: number\n  /**\n   * The index of the selected cell\n   */\n  col: number\n\n  /**\n   * Whether the logic should ignore setting up focus.\n   * This is used when tracking cell selection when using a pointer device.\n   */\n  ignoreFocus?: boolean\n}\n\nexport interface EventCellInfo {\n  /**\n   * The cell element.\n   */\n  cell: HTMLElement\n  /**\n   * The column index\n   */\n  col: number\n  /**\n   * The **table** row index (not items)\n   */\n  row: number\n}\n\n/**\n * A versatile and accessible data table web component.\n *\n * The `DataTable` component provides a highly customizable and accessible way to display tabular data.\n * It offers features such as:\n *\n * - **Accessibility:** Built with ARIA roles and attributes for screen reader compatibility and keyboard navigation.\n * - **Customizable Cells:** Allows complete control over the content and rendering of each cell in the table.\n * - **Header Customization:** Provides flexibility in defining and rendering table headers, including sorting.\n * - **Selection:** Supports single, multiple, or no selection of rows.\n * - **Activation:** Enables the activation of rows (e.g., via double-click or Enter/Space key).\n * - **Infinite Scrolling:** Supports \"load more\" functionality (infinite scroll) using a sentinel element.\n * - **Sorting:** Allows sorting of data by clicking on sortable header cells.\n * - **Keyboard Navigation:** Full keyboard support for navigating through the table.\n * - **Empty State:** Customizable content to display when the table has no data.\n * - **Focus Management:** Properly manages focus for both keyboard and pointer interactions.\n *\n * @slot empty - Optional. Content to display when the table is empty (i.e., `items` is an empty array).\n *                Defaults to a message saying \"No data to display.\"\n *\n * @fires select - Dispatched when the selection changes.\n *                  - `detail`: An object with a `selectedItems` property, containing an array of the currently selected items.\n *                  - Example: `{ selectedItems: [item1, item2] }`\n *\n * @fires activate - Dispatched when a row is activated (e.g., double-clicked or Enter/Space pressed).\n *                  - `detail`: The data item that was activated.\n *                  - Example: `item1`\n *\n * @fires scrollend - Dispatched when the user scrolls to the bottom of the table (when the `overflow` property is true).\n *                  - No event detail.\n *\n * @fires sort - Dispatched when the user clicks on a sortable header to change the sorting.\n *                  - `detail`: An object with `column` and `direction` properties.\n *                  - `column`: The name of the column being sorted.\n *                  - `direction`: The sort direction, either \"asc\" (ascending) or \"desc\" (descending).\n *                  - Example: `{ column: \"name\", direction: \"asc\" }`\n *\n * @csspart table - The underlying `<table>` element.\n * @csspart cell - Individual `<td>` and `<th>` elements.\n * @csspart header-cell - Individual `<th>` elements.\n *\n * @cssprop --md-focus-ring-shape-start-start - The start-start corner shape for the focus ring.\n * @cssprop --md-focus-ring-shape-start-end - The start-end corner shape for the focus ring.\n * @cssprop --md-focus-ring-shape-end-end - The end-end corner shape for the focus ring.\n * @cssprop --md-focus-ring-shape-end-start - The end-start corner shape for the focus ring.\n * @cssprop --md-sys-typescale-label-large-font - The font family for label large.\n * @cssprop --md-sys-typescale-label-large-size - The font size for label large.\n * @cssprop --md-sys-typescale-label-large-tracking - The letter spacing for label large.\n * @cssprop --md-sys-typescale-label-large-height - The line height for label large.\n * @cssprop --md-sys-typescale-label-large-weight - The font weight for label large.\n * @cssprop --md-sys-color-outline-variant - The outline variant color.\n * @cssprop --md-sys-color-secondary-container - The secondary container color.\n * @cssprop --md-icon-size - The size of the icons.\n * @cssprop --md-sys-typescale-title-small-font - The font family for title small.\n * @cssprop --md-sys-typescale-title-small-weight - The font weight for title small.\n * @cssprop --md-sys-typescale-title-small-size - The font size for title small.\n * @cssprop --md-sys-typescale-title-small-tracking - The letter spacing for title small.\n * @cssprop --md-sys-typescale-title-small-height - The line height for title small.\n * @cssprop --md-sys-typescale-body-medium-font - The font family for body medium.\n * @cssprop --md-sys-typescale-body-medium-weight - The font weight for body medium.\n * @cssprop --md-sys-typescale-body-medium-size - The font size for body medium.\n * @cssprop --md-sys-typescale-body-medium-tracking - The letter spacing for body medium.\n * @cssprop --md-sys-typescale-body-medium-height - The line height for body medium.\n *\n * @typeParam T The type of data items in the table.\n *\n * @example\n * ```html\n * <data-table\n *   .items=\"${myItems}\"\n *   selection=\"multi\"\n *   @select=\"${handleSelect}\"\n *   @activate=\"${handleActivate}\"\n *   @scrollend=\"${handleScrollEnd}\"\n *   @sort=\"${handleSort}\"\n *   overflow\n * >\n *   <p slot=\"empty\">No items to display at this time.</p>\n * </data-table>\n * ```\n *\n * @example\n * ```typescript\n * // Inside a subclass of DataTable.\n * // Rendering a name cell.\n * #nameCell(item: MyItem, row: number, col: number): TemplateResult {\n *   return this.renderCell(item.name, row, col, { isPrimary: true });\n * }\n *\n * // Rendering a header cell.\n * override renderHeader(): TemplateResult[] {\n *   return [\n *     this.renderHeaderCell('Name', 0, { sort: 'name' }),\n *     this.renderHeaderCell('Value', 1, { sort: 'value' }),\n *   ];\n * }\n * ```\n */\nexport abstract class DataTable<T extends object> extends LitElement {\n  /**\n   * The data items to display in the table.\n   */\n  @property({ type: Object }) accessor items: LiveData<T[]> | undefined\n\n  /**\n   * The selection mode. Can be \"none\", \"single\", or \"multi\".\n   * - `none`: No selection is allowed.\n   * - `single`: Only one item can be selected at a time.\n   * - `multi`: Multiple items can be selected.\n   * @attribute\n   * @default \"none\"\n   */\n  @property({ type: String, reflect: true }) accessor selection: 'none' | 'single' | 'multi' = 'none'\n\n  /**\n   * The currently selected items.\n   * @default []\n   */\n  @property({ type: Array }) accessor selectedItems: T[] = []\n\n  /**\n   * The ARIA label for the table. Used for accessibility.\n   * @attribute\n   * @default \"Data table\"\n   */\n  @property({ type: String, reflect: true }) override accessor ariaLabel = 'Data table'\n\n  /**\n   * Enables double-click and Enter/Space key activation of table items.\n   * When `true`, items can be activated by:\n   * - Double-clicking the item.\n   * - Focusing on the item and pressing Enter or Space.\n   * The `activate` event is dispatched when an item is activated.\n   * @attribute\n   * @default false\n   */\n  @property({ type: Boolean }) accessor active = false\n\n  /**\n   * Enables the \"load more\" functionality when the user scrolls to the bottom of the table.\n   * When `true`, a sentinel element is added to the bottom of the table. When the sentinel\n   * becomes visible, the `scrollend` event is dispatched.\n   * This is commonly used for infinite scrolling or lazy loading of data.\n   * @attribute\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true }) accessor overflow = false\n\n  /**\n   * The name of the property to sort the table by. If set, the table will\n   * automatically indicate the sortable header.\n   * @attribute\n   * @default undefined\n   */\n  @property({ type: String }) accessor sort: string | undefined\n\n  /**\n   * The direction of the sort. Can be \"asc\" (ascending) or \"desc\" (descending).\n   * If `sort` is set, this property will be used to determine the sort direction.\n   * @attribute\n   * @default undefined\n   */\n  @property({ type: String }) accessor sortDirection: 'asc' | 'desc' | undefined\n\n  protected lastSelectedIndex = -1\n\n  protected observer?: IntersectionObserver\n\n  protected sentinel = createRef<HTMLElement>()\n\n  /**\n   * The current focus position.\n   * It is used to support keyboard navigation.\n   *\n   * Initially we always allow to focus on the first cell, which\n   * should be the first header cell. The keyboard navigation will\n   * take over.\n   */\n  @state() accessor position: CellPosition = { row: 0, col: 0 }\n\n  constructor() {\n    super()\n    this.handleLiveData = this.handleLiveData.bind(this)\n  }\n\n  override connectedCallback(): void {\n    super.connectedCallback()\n    if (this.overflow) {\n      // Only create the observer if overflow is enabled\n      this.createObserver()\n    }\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback()\n    this.observer?.disconnect()\n    this.observer = undefined\n  }\n\n  override firstUpdated(): void {\n    if (this.overflow) {\n      this.createObserver()\n    }\n  }\n\n  protected override willUpdate(cp: PropertyValues<this>): void {\n    if (cp.has('items')) {\n      this.lastSelectedIndex = -1\n      this.revalidateSelection()\n    }\n  }\n\n  protected override updated(cp: PropertyValues<this>): void {\n    if (cp.has('position')) {\n      const { row, col, ignoreFocus = false } = this.position\n      if (!ignoreFocus) {\n        const cell = this.shadowRoot?.querySelector(`[data-row=\"${row}\"][data-col=\"${col}\"]`) as HTMLElement | null\n        if (cell) {\n          cell.focus()\n        }\n      }\n    }\n    if (cp.has('items')) {\n      const old = cp.get('items')\n      if (old) {\n        old.removeEventListener('update', this.handleLiveData)\n      }\n      if (this.items) {\n        this.items.addEventListener('update', this.handleLiveData)\n      }\n    }\n  }\n\n  handleLiveData(): void {\n    this.requestUpdate()\n  }\n\n  /**\n   * @internal\n   * @description Creates and configures an `IntersectionObserver` to detect when the sentinel element is visible,\n   * indicating the user has scrolled to the bottom of the table.\n   *\n   * This method sets up the observer to watch the sentinel element. When the sentinel intersects with the component's viewport,\n   * it triggers the `scrollend` event.\n   *\n   * This function is used when `overflow` is set to true.\n   *\n   * @returns void\n   */\n  protected createObserver(): void {\n    const { sentinel } = this\n    if (!sentinel.value) {\n      return\n    }\n\n    const options: IntersectionObserverInit = {\n      root: this, // Observe within the component's viewport\n      rootMargin: '0px', // No margin\n      threshold: 0.0, // Trigger when the sentinel is 0% visible (at the very bottom)\n    }\n\n    this.observer = new IntersectionObserver(this.handleIntersection, options)\n    this.observer.observe(sentinel.value) // Observe the sentinel.\n  }\n\n  protected revalidateSelection(): void {\n    const { items, selectedItems = [] } = this\n    if (!items || selectedItems.length === 0) {\n      return\n    }\n    const filteredSelectedItems = selectedItems.filter((selectedItem) =>\n      items.value.some((item) => item === selectedItem)\n    )\n    if (filteredSelectedItems.length !== selectedItems.length) {\n      this.selectedItems = filteredSelectedItems\n      this.dispatchEvent(\n        new CustomEvent('select', {\n          detail: { selectedItems: this.selectedItems },\n        })\n      )\n    }\n  }\n\n  /**\n   * @internal\n   * @description Handles the intersection of the sentinel element with the viewport.\n   *\n   * This method is the callback function for the `IntersectionObserver`. When the sentinel becomes visible,\n   * it dispatches the `scrollend` event to signal that the user has reached the bottom of the table.\n   *\n   * @param entries - An array of IntersectionObserverEntry objects.\n   * @returns void\n   */\n  handleIntersection: IntersectionObserverCallback = (entries): void => {\n    if (entries.some((entry) => entry.isIntersecting)) {\n      this.dispatchEvent(new CustomEvent('scrollend'))\n    }\n  }\n\n  /**\n   * @internal\n   * @description Extracts information about a cell from an event.\n   *\n   * This method analyzes the event's composed path to identify the clicked or focused cell (either `<td>` or `<th>`).\n   * It returns the cell element, its column index, and its row index.\n   * It is also capable of detecting if the user focused on an interactive element within a cell.\n   *\n   * @param e - The event object (typically a MouseEvent or KeyboardEvent).\n   * @returns An object containing the cell element, column index, and row index, or `undefined` if the target is not a cell.\n   */\n  protected infoFromEvent(e: Event): EventCellInfo | undefined {\n    const path = e.composedPath()\n    let cell: HTMLElement | undefined\n    for (const current of path.values()) {\n      const element = current as Element\n      if (element.nodeType !== Node.ELEMENT_NODE) {\n        continue\n      }\n      const isTarget = ['TD', 'TH'].includes(element.nodeName)\n      if (!isTarget && element.hasAttribute('tabindex')) {\n        // It means that the user focusing on an interactive element\n        // within a cell and we should abandon whatever we do right now.\n        return\n      }\n      if (isTarget) {\n        cell = element as HTMLElement\n        break\n      }\n    }\n    if (!cell) {\n      return\n    }\n    const col = Number(cell.dataset.col)\n    const row = Number(cell.dataset.row)\n    if (isNaN(col) || isNaN(row)) {\n      return\n    }\n    return { cell, col, row }\n  }\n\n  /**\n   * @internal\n   * @description Gets the number of columns and rows of the table.\n   *\n   * @returns An object with `cols` and `rows` properties indicating the number of columns and rows.\n   */\n  protected getSize(): { cols: number; rows: number } {\n    const result = { cols: 0, rows: 0 }\n    const table = this.shadowRoot?.querySelector('table')\n    if (!table) {\n      return result\n    }\n    const row = table.querySelector('tr')\n    if (!row) {\n      return result\n    }\n    const columns = row.querySelectorAll('th, td')\n    result.cols = columns.length ? columns.length - 1 : 0\n    const rows = table.rows\n    result.rows = rows.length ? rows.length - 1 : 0\n    return result\n  }\n\n  /**\n   * @internal\n   * @description Get the element containing the cell data.\n   *\n   * @param col - The column index of the cell.\n   * @param row - The row index of the cell.\n   * @returns An object with the cell element and `delegateFocus` flag, or `undefined` if the cell does not exist.\n   */\n  protected getCellInfo(col: number, row: number): { cell: HTMLElement; delegateFocus: boolean } | undefined {\n    const cell = this.shadowRoot?.querySelector(`[data-col=\"${col}\"][data-row=\"${row}\"]`) as HTMLElement | null\n    if (!cell) {\n      return\n    }\n    const delegateFocus = cell.dataset.delegate === 'true'\n    return { cell, delegateFocus }\n  }\n\n  /**\n   * @internal\n   * @description Delegates the focus to a specific interactive element within a cell.\n   *\n   * This method is used when the cell is configured to handle its own focus management (i.e., `delegateFocus` is `true`).\n   *\n   * @param parent - The parent element (the cell) containing the interactive element.\n   * @returns void\n   */\n  protected delegateFocus(parent: HTMLElement): void {\n    const delegate = parent.querySelector('[tabindex]') as HTMLElement | null\n    if (delegate) {\n      delegate.focus()\n    }\n  }\n\n  /**\n   * @internal\n   * @description Moves the focus to the specified cell.\n   *\n   * This method updates the component's internal `position` state and then focuses on the corresponding cell.\n   * If the cell has the `delegateFocus` property, it delegates the focus to the first interactive element inside of the cell.\n   *\n   * @param col - The column index of the cell to focus on.\n   * @param row - The row index of the cell to focus on.\n   * @returns void\n   */\n  protected moveFocusTo(col: number, row: number): void {\n    const cell = this.getCellInfo(col, row)\n    if (!cell) {\n      return\n    }\n    this.position = { row, col }\n    if (cell.delegateFocus) {\n      this.position.ignoreFocus = true\n      this.delegateFocus(cell.cell)\n    }\n  }\n\n  /**\n   * @internal\n   * @description Handles keyboard navigation within the table.\n   *\n   * This method processes keyboard events to move the focus between cells. It supports arrow keys, Page Up/Down, Home/End, Enter and Space.\n   * - ArrowRight: Moves focus to the next cell to the right.\n   * - ArrowLeft: Moves focus to the next cell to the left.\n   * - ArrowDown: Moves focus to the cell below.\n   * - ArrowUp: Moves focus to the cell above.\n   * - PageUp: Moves focus to the first row.\n   * - PageDown: Moves focus to the last row.\n   * - Home: Moves focus to the first cell of the current row (Ctrl+Home moves to the first cell of the first row).\n   * - End: Moves focus to the last cell of the current row (Ctrl+End moves to the last cell of the last row).\n   * - Enter: Activates the current row.\n   * - Space: Manages selection.\n   *\n   * @param e - The KeyboardEvent object.\n   * @returns void\n   */\n  protected handleKeyDown(e: KeyboardEvent) {\n    if (e.defaultPrevented) {\n      return\n    }\n    const info = this.infoFromEvent(e)\n    if (!info) {\n      // This also makes sure that when we are focusing on an element\n      // within a `delegateFocus` cell, we won't interfere with its events.\n      return\n    }\n    const { code } = e\n    const { position } = this\n    const size = this.getSize()\n    if (code === 'ArrowRight') {\n      e.preventDefault()\n      if (position.col < size.cols) {\n        this.moveFocusTo(position.col + 1, position.row)\n      }\n    } else if (code === 'ArrowLeft') {\n      e.preventDefault()\n      if (position.col > 0) {\n        this.moveFocusTo(position.col - 1, position.row)\n      }\n    } else if (code === 'ArrowDown') {\n      e.preventDefault()\n      if (position.row < size.rows) {\n        this.moveFocusTo(position.col, position.row + 1)\n      }\n    } else if (code === 'ArrowUp') {\n      e.preventDefault()\n      if (position.row > 0) {\n        this.moveFocusTo(position.col, position.row - 1)\n      }\n    } else if (code === 'PageUp') {\n      e.preventDefault()\n      if (position.row > 1) {\n        this.moveFocusTo(position.col, 1)\n      }\n    } else if (code === 'PageDown') {\n      e.preventDefault()\n      if (position.row < size.rows) {\n        this.moveFocusTo(position.col, size.rows)\n      }\n    } else if (code === 'Home') {\n      e.preventDefault()\n      if (!e.ctrlKey && position.col > 0) {\n        this.moveFocusTo(0, position.row)\n      } else if (e.ctrlKey && (position.row > 1 || position.col > 0)) {\n        this.moveFocusTo(0, 1)\n      }\n    } else if (code === 'End') {\n      e.preventDefault()\n      if (!e.ctrlKey && position.col < size.cols) {\n        this.moveFocusTo(size.cols, position.row)\n      } else if (e.ctrlKey && position.row < size.rows) {\n        this.moveFocusTo(size.cols, size.rows)\n      }\n    } else if (code === 'Enter') {\n      e.preventDefault()\n      this.activateFromCellInfo(info)\n    } else if (code === 'Space') {\n      e.preventDefault()\n      this.manageSelectionFromEvent(info, e)\n    }\n  }\n\n  /**\n   * @internal\n   * @description Handles mouse click events on the table.\n   *\n   * @param e - The MouseEvent object.\n   * @returns void\n   */\n  protected handleClick(e: MouseEvent): void {\n    if (e.detail === 3) {\n      return\n    }\n    const info = this.infoFromEvent(e)\n    if (!info) {\n      return\n    }\n    if (e.detail === 2) {\n      this.activateFromCellInfo(info)\n    } else {\n      this.manageSelectionFromEvent(info, e)\n    }\n  }\n\n  /**\n   * @internal\n   * @description Manages the selection state based on a mouse or keyboard event.\n   *\n   * This method determines the row and column from the event target and updates the `selectedItems` array accordingly.\n   * It supports single, multiple and no selection based on the `selection` property. It also supports shift-click.\n   *\n   * @param info - The cell info.\n   * @param e - The MouseEvent or KeyboardEvent object.\n   * @returns void\n   */\n  protected manageSelectionFromEvent(info: EventCellInfo, e: MouseEvent | KeyboardEvent): void {\n    if (!this.items) {\n      return\n    }\n    const { row, col } = info\n    const index = row - 1\n    if (info.row === 0) {\n      // Handle sort.\n      this.sortFrom(info.cell)\n      this.position = { row, col }\n      return\n    }\n    const item = this.items.value[index]\n    if (!item) {\n      return\n    }\n\n    const isMultiSelect = this.selection === 'multi'\n    if (isMultiSelect && (e.metaKey || e.ctrlKey)) {\n      this.toggleSelection(item, 'add')\n    } else if (isMultiSelect && e.shiftKey) {\n      this.handleShiftClick(index, item)\n    } else {\n      this.toggleSelection(item, 'replace')\n      this.lastSelectedIndex = index\n    }\n    // This won't cause the focus ring to be rendered because the cell\n    // won't hey the `tabindex=0`, which is OK with pointer device navigation,\n    // but it will keep track of the last cell in case the keyboard navigation starts.\n    this.position = { row, col }\n  }\n\n  /**\n   * @internal\n   * @description Handles shift-click for range selection.\n   *\n   * When shift-clicking a row, it will select all the items between the last selected item and the clicked item.\n   *\n   * @param clickedIndex - The index of the clicked item.\n   * @param item - The clicked item.\n   * @returns void\n   */\n  protected handleShiftClick(clickedIndex: number, item: T) {\n    if (!this.items) {\n      return\n    }\n    if (this.lastSelectedIndex === -1) {\n      // If no previous selection, just select the clicked item.\n      this.toggleSelection(item)\n      this.lastSelectedIndex = clickedIndex\n      return\n    }\n    const startIndex = Math.min(this.lastSelectedIndex, clickedIndex)\n    const endIndex = Math.max(this.lastSelectedIndex, clickedIndex)\n    const newSelectedItems = this.items.value.slice(startIndex, endIndex + 1)\n    this.selectedItems = newSelectedItems as T[]\n    this.dispatchEvent(new CustomEvent('select', { detail: { selectedItems: this.selectedItems } }))\n  }\n\n  /**\n   * @internal\n   * @description Activates the row associated with the given event.\n   *\n   * This method is called when a row is double-clicked or when the Enter/Space key is pressed while a row is focused.\n   *\n   * @param e - The Event object.\n   * @returns void\n   */\n  protected activateFromCellInfo(info: EventCellInfo): void {\n    if (!this.items) {\n      return\n    }\n    if (info.row === 0) {\n      // Handle sort.\n      this.sortFrom(info.cell)\n      return\n    }\n    const item = this.items.value[info.row - 1]\n    if (!item) {\n      return\n    }\n    this.dispatchEvent(new CustomEvent('activate', { detail: item }))\n  }\n\n  /**\n   * @internal\n   * @description Handles sorting logic based on the clicked column header.\n   *\n   * This method updates the `sort` and `sortDirection` properties and dispatches the `sort` event.\n   *\n   * @param column - The header cell element.\n   * @returns void\n   */\n  protected sortFrom(column: HTMLElement): void {\n    const sort = column.dataset.sort\n    if (!sort) {\n      return\n    }\n    if (this.sort === sort) {\n      this.sortDirection = this.sortDirection === 'asc' ? 'desc' : 'asc'\n    } else {\n      this.sort = sort\n      this.sortDirection = 'asc'\n    }\n    this.dispatchEvent(\n      new CustomEvent('sort', {\n        detail: {\n          column: this.sort,\n          direction: this.sortDirection,\n        },\n      })\n    )\n  }\n\n  /**\n   * @public\n   * @description Checks if an item is currently selected.\n   *\n   * @param item - The item to check.\n   * @returns `true` if the item is selected, `false` otherwise.\n   */\n  isSelected(item: T): boolean {\n    return this.selectedItems.includes(item)\n  }\n\n  /**\n   * @public\n   * @description Toggles the selection state of an item.\n   *\n   * This method adds or removes an item from the `selectedItems` array.\n   *\n   * @param item - The item to toggle selection for.\n   * @param mode - The selection mode, either 'replace' or 'add' (defaults to 'replace').\n   * @returns void\n   */\n  toggleSelection(item: T, mode: 'replace' | 'add' = 'replace') {\n    if (this.selection === 'none') {\n      return\n    }\n\n    if (this.selection === 'single') {\n      this.selectedItems = [item]\n    } else {\n      // multi-select\n      const index = this.selectedItems.indexOf(item)\n      if (mode === 'replace') {\n        this.selectedItems = [item]\n      } else if (index === -1) {\n        this.selectedItems = [...this.selectedItems, item]\n      } else {\n        this.selectedItems = this.selectedItems.filter((i) => i !== item)\n      }\n    }\n\n    this.dispatchEvent(new CustomEvent('select', { detail: { selectedItems: this.selectedItems } }))\n  }\n\n  /**\n   * @internal\n   * @description Renders the table.\n   *\n   * @returns A `TemplateResult` for rendering.\n   */\n  override render(): TemplateResult {\n    if (!this.items || !this.items.value.length) {\n      return this.renderEmpty()\n    }\n    const isMulti = this.selection === 'multi'\n    return html`\n      <table\n        part=\"table\"\n        role=\"grid\"\n        aria-multiselectable=\"${ifDefined(isMulti ? 'true' : undefined)}\"\n        aria-label=\"${this.ariaLabel}\"\n        @keydown=\"${this.handleKeyDown}\"\n        @click=\"${this.handleClick}\"\n      >\n        <thead>\n          <tr role=\"row\">\n            ${this.renderHeader()}\n          </tr>\n        </thead>\n        <tbody>\n          ${this.items.value.map((item, index) => this.renderRow(item, index))}\n        </tbody>\n      </table>\n      ${this.overflow ? html`<div class=\"scroll-sentinel\" ${ref(this.sentinel)}></div>` : nothing}\n    `\n  }\n\n  /**\n   * @internal\n   * @description Renders the empty state of the table.\n   *\n   * @returns A `TemplateResult` for rendering.\n   */\n  renderEmpty(): TemplateResult {\n    return html`\n      <slot name=\"empty\">\n        <p role=\"status\" class=\"empty\">No data to display.</p>\n      </slot>\n    `\n  }\n\n  /**\n   * @internal\n   * @description Renders the table header cells. Must be implemented by subclasses.\n   *\n   * @returns An array of `TemplateResult` objects representing the header cells.\n   */\n  abstract renderHeader(): TemplateResult[]\n\n  /**\n   * @internal\n   * @description Renders the cells for a given row item. Must be implemented by subclasses.\n   *\n   * @param item The data item for the row.\n   * @param index The index that should be passed back to the rendering function. This is not the item index.\n   * @returns An array of `TemplateResult` objects representing the cells for the row.\n   */\n  abstract renderRowValues(item: T, index: number): TemplateResult[]\n\n  /**\n   * @internal\n   * @description Renders a single row in the table.\n   *\n   * @param item - The data item for the row.\n   * @param index - The index of the row.\n   * @returns A `TemplateResult` for rendering.\n   */\n  protected renderRow(item: T, index: number): TemplateResult {\n    const rowClasses = {\n      selected: this.isSelected(item as T),\n    }\n\n    return html`\n      <tr\n        role=\"row\"\n        aria-selected=\"${this.isSelected(item as T) ? 'true' : 'false'}\"\n        data-index=\"${index}\"\n        class=\"${classMap(rowClasses)}\"\n      >\n        ${this.renderRowValues(item, index + 1)}\n      </tr>\n    `\n  }\n\n  /**\n   * @internal\n   * A helper method to render a standard table cell.\n   *\n   * @param content The content of the cell.\n   * @param row The 0-based row index of the rendered cell\n   * @param col The 0-based column index of the rendered cell\n   * @param opts Options for rendering the cell (classes, icon, data attributes).\n   * @returns A `TemplateResult` representing the rendered cell.\n   */\n  protected renderCell(content: unknown, row: number, col: number, opts: CellRenderOptions = {}): TemplateResult {\n    const { position } = this\n    const { data = {}, classes = [], ariaLabel, delegateFocus = false, isPrimary = false } = opts\n    const cellClasses: Record<string, boolean> = { 'grid-cell': true }\n    classes?.forEach((c) => (cellClasses[c] = true))\n    const isFocused = position?.col === col && position?.row === row\n    let index: number | undefined\n    if (!delegateFocus) {\n      index = isFocused ? 0 : -1\n    }\n    const ring = !delegateFocus\n      ? html`<md-focus-ring .inward=\"${this.overflow ? true : false}\"></md-focus-ring>`\n      : nothing\n    if (isPrimary) {\n      // Lit does not allow dynamic element names so I decided to make a copy.\n      return html`\n        <th\n          role=\"gridcell\"\n          class=\"${classMap(cellClasses)}\"\n          ${dataAttr(data)}\n          aria-label=\"${ifDefined(ariaLabel)}\"\n          tabindex=\"${ifDefined(index)}\"\n          data-delegate=\"${ifDefined(delegateFocus ? true : undefined)}\"\n          data-row=\"${row}\"\n          data-col=\"${col}\"\n          scope=\"row\"\n          part=\"cell\"\n        >\n          ${ring}\n          <div class=\"cell-content\">${content}</div>\n        </th>\n      `\n    }\n    return html`\n      <td\n        role=\"gridcell\"\n        class=\"${classMap(cellClasses)}\"\n        ${dataAttr(data)}\n        aria-label=\"${ifDefined(ariaLabel)}\"\n        tabindex=\"${ifDefined(index)}\"\n        data-delegate=\"${ifDefined(delegateFocus ? true : undefined)}\"\n        data-row=\"${row}\"\n        data-col=\"${col}\"\n        part=\"cell\"\n      >\n        ${ring}\n        <div class=\"cell-content\">${content}</div>\n      </td>\n    `\n  }\n\n  /**\n   * @internal\n   * @description Returns the name of the icon to use for sorting indication.\n   *\n   * @returns The name of the Material Icon to use (either \"arrow_upward\" or \"arrow_downward\").\n   */\n  get sortIconName(): string {\n    return this.sortDirection === 'asc' ? 'arrow_upward' : 'arrow_downward'\n  }\n\n  /**\n   * @internal\n   * A helper method to render a table header cell.\n   *\n   * @param content The content of the header cell.\n   * @param opts Options for rendering the header cell (classes, data attributes).\n   * @returns A `TemplateResult` representing the rendered header cell.\n   */\n  protected renderHeaderCell(content: unknown, col: number, opts: HeaderCellRenderOptions = {}): TemplateResult {\n    const { position } = this\n    const { data = {}, classes = [], sort, delegateFocus = false, ariaLabel } = opts\n    const cellClasses: Record<string, boolean> = { 'grid-header': true }\n    classes?.forEach((c) => (cellClasses[c] = true))\n    const isSortable = !!sort\n    const isSorted = this.sort === sort\n    const sortIcon = isSorted ? this.sortIconName : undefined\n    const isFocused = position?.col === col && position?.row === 0\n    let index: number | undefined\n    if (!delegateFocus) {\n      index = isFocused ? 0 : -1\n    }\n    let ariaSort: 'ascending' | 'descending' | 'none' | undefined\n    if (isSorted) {\n      ariaSort = this.sortDirection === 'asc' ? 'ascending' : 'descending'\n    } else if (isSortable) {\n      ariaSort = 'none'\n    }\n    return html`<th\n      role=\"columnheader\"\n      scope=\"col\"\n      class=\"${classMap(cellClasses)}\"\n      ${dataAttr(data)}\n      aria-sort=\"${ifDefined(ariaSort)}\"\n      data-sort=\"${ifDefined(sort)}\"\n      data-row=\"0\"\n      data-col=\"${col}\"\n      tabindex=\"${ifDefined(index)}\"\n      data-delegate=\"${ifDefined(delegateFocus ? true : undefined)}\"\n      aria-label=\"${ifDefined(ariaLabel)}\"\n      part=\"header-cell\"\n    >\n      <md-focus-ring .inward=\"${this.overflow ? true : false}\"></md-focus-ring>\n      <div class=\"cell-content\">\n        ${content}\n        ${isSortable && sortIcon ? html`<md-icon class=\"sort-icon\" role=\"presentation\">${sortIcon}</md-icon>` : nothing}\n      </div>\n    </th> `\n  }\n}\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@api-client/ui",
-  "version": "0.1.1",
+  "version": "0.1.3",
   "description": "Internal UI component library for the API Client ecosystem.",
   "license": "UNLICENSED",
   "main": "build/src/index.js",

package/src/bindings/base/IoThread.ts

@@ -1,6 +1,6 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 /* eslint-disable no-console */
-import { ApiError } from '@api-client/core/runtime/store/Errors.js'
+import { Exception } from '@api-client/core/exceptions/exception.js'
 import { type IoEvent, type IoCommand, type IoNotification } from './PlatformBindings.js'
 
 /**
@@ -40,9 +40,9 @@ export abstract class IoThread {
     }
 
     if (typeof fn !== 'string' || !fn) {
-      const err = new ApiError(
+      const err = new Exception(
         'Invalid message received on the io-channel. The second argument must be a function name to call.',
-        400
+        { status: 400 }
       )
       this.notifyError(id, err)
       console.warn(err.message)
@@ -53,9 +53,9 @@ export abstract class IoThread {
     const isFunction = typeof callable === 'function'
 
     if (!isFunction) {
-      const err = new ApiError(
+      const err = new Exception(
         `Invalid message received on the io-channel. The function "${fn}" is either not implemented or invalid.`,
-        400
+        { status: 400 }
       )
       this.notifyError(id, err)
       console.warn(err.message)
@@ -65,7 +65,7 @@ export abstract class IoThread {
     this.call(callable, id, args)
   }
 
-  protected notifyError(id: number, error: ApiError): void {
+  protected notifyError(id: number, error: Exception): void {
     const event: IoEvent = {
       kind: 'IO#Event',
       id,
@@ -114,7 +114,7 @@ export abstract class IoThread {
     } catch (e) {
       event.type = 'error'
       event.message = (e as Error).message
-      if ((e as ApiError).code) {
+      if ((e as Exception).status) {
         event.result = e
       }
       this.postMessage(event)

package/src/bindings/base/PlatformBindings.ts

@@ -1,5 +1,5 @@
 /* eslint-disable @typescript-eslint/no-unsafe-function-type */
-import { ApiError, type IApiError } from '@api-client/core/runtime/store/Errors.js'
+import { Exception, type ExceptionSchema } from '@api-client/core/exceptions/exception.js'
 import { Events } from '../../events/Events.js'
 
 /**
@@ -185,9 +185,9 @@ export abstract class PlatformBindings {
     if (type === 'result') {
       info.resolve(result)
     } else if (type === 'error') {
-      const apiErr = result as IApiError | undefined
+      const apiErr = result as ExceptionSchema | undefined
       if (apiErr && apiErr.code) {
-        info.reject(new ApiError(apiErr))
+        info.reject(Exception.fromRawException(apiErr, 'Unknown exception'))
       } else {
         info.reject(new Error(message))
       }

package/src/core/Activity.ts

@@ -143,6 +143,7 @@ export class Activity extends EventTarget {
    */
   onDestroy(): void | Promise<void> {
     this.dispatchEvent(new CustomEvent('activity:destroy', { detail: null }))
+    this.manager.onDestroy()
   }
 
   /**
@@ -199,18 +200,18 @@ export class Activity extends EventTarget {
    * @param key The name of the fragment
    * @param fragment The fragment to register.
    */
-  addFragment(key: string, fragment: Fragment, data?: unknown): void {
-    this.manager.attachFragment(key, fragment, this, data)
+  async addFragment(key: string, fragment: Fragment, data?: unknown): Promise<void> {
+    await this.manager.attachFragment(key, fragment, this, data)
   }
 
-  showFragment(key: string, root?: HTMLElement): void {
-    this.manager.showFragment(key, root)
+  async showFragment(key: string, root?: HTMLElement): Promise<void> {
+    await this.manager.showFragment(key, root)
   }
 
-  hideFragment(key: string): void {
+  async hideFragment(key: string): Promise<void> {
     const fragment = this.manager.findFragment(key)
     if (fragment) {
-      this.manager.hideFragment(fragment)
+      await this.manager.hideFragment(fragment)
     }
   }
 
@@ -322,7 +323,7 @@ export class Activity extends EventTarget {
       const info = event.detail as ActivityWithResultDetail
       await this.startActivityForResult(info.intent)
     } else if (event.type === EventTypes.Intent.startActivity) {
-      this.startActivity(event.detail.intent)
+      await this.startActivity(event.detail.intent)
     } else {
       throw new Error(`Unrecognized intent event: ${event.type}`)
     }

package/src/core/ActivityManager.ts

@@ -239,21 +239,21 @@ export class ActivityManager {
   async startActivityForResult(intent: Intent, requestCode: number): Promise<void> {
     intent.requestCode = requestCode
     const byReference = (intent.flags ?? 0) & IntentFlags.ByReference
-    const data = intent.data
+    const shallowCopy = { ...intent }
+    const data = shallowCopy.data
     if (byReference) {
-      delete intent.data
+      delete shallowCopy.data
     }
-    const intentCopy = structuredClone(intent)
-    if (data && !byReference) {
-      intentCopy.data = data
+    const deepCopy = structuredClone(shallowCopy)
+    if (data && byReference) {
+      deepCopy.data = data
     }
-    intent.requestCode = requestCode
-    if (intent.flags) {
-      intent.flags = intent.flags & IntentFlags.ForResult
+    if (deepCopy.flags) {
+      deepCopy.flags = deepCopy.flags | IntentFlags.ForResult
     } else {
-      intent.flags = IntentFlags.ForResult
+      deepCopy.flags = IntentFlags.ForResult
     }
-    await this.startActivity(intentCopy)
+    await this.startActivity(deepCopy)
   }
 
   isDestroyed(activity: Activity): boolean {
@@ -264,6 +264,7 @@ export class ActivityManager {
    * @param activity The activity to finish.
    */
   async finishActivity(activity: Activity): Promise<void> {
+    this.setupStyles(undefined, activity)
     const isModal = this.modalActivityStack.some((entry) => entry.activity === activity)
     const stack = isModal ? this.modalActivityStack : this.activityStack
     const index = stack.findIndex((entry) => entry.activity === activity)
@@ -340,6 +341,38 @@ export class ActivityManager {
     return this.currentActivity
   }
 
+  /**
+   * Sets the styles for the current activity.
+   * This method adds or removes CSS classes based on the activity's class name
+   * and action, allowing for dynamic styling based on the active activity.
+   * @param activity The activity to set styles for.
+   * If not provided, it will not set any styles.
+   * If the activity is the same as the current one, it does nothing.
+   */
+  setupStyles(activity?: Activity, oldActivity?: Activity): void {
+    if (activity === oldActivity) {
+      return
+    }
+    const root = document?.documentElement
+    if (!root) {
+      return
+    }
+    if (oldActivity) {
+      const ctor = oldActivity.constructor as typeof Activity
+      root.classList.remove(ctor.name.toLowerCase())
+      if (ctor.action) {
+        root.classList.remove(ctor.action.replace(/\//g, '-'))
+      }
+    }
+    if (activity) {
+      const ctor = activity.constructor as typeof Activity
+      root.classList.add(ctor.name.toLowerCase())
+      if (ctor.action) {
+        root.classList.add(ctor.action.replace(/\//g, '-'))
+      }
+    }
+  }
+
   /**
    * A helper method to handle the transition between activities, ensuring
    * lifecycle methods are called in the correct order (pause the previous activity,
@@ -348,10 +381,13 @@ export class ActivityManager {
    * @param activity The activity to bring to the foreground.
    */
   private async updateCurrentActivity(activity: Activity, isModal: boolean): Promise<void> {
+    this.setupStyles(activity, this.currentActivity)
     if (
       this.currentActivity &&
       this.currentActivity !== activity &&
-      this.currentActivity.state !== ActivityState.Destroyed
+      this.currentActivity.state !== ActivityState.Destroyed &&
+      // Make sure we don't pause the current activity if it's already paused.
+      this.currentActivity.state !== ActivityState.Paused
     ) {
       await this.currentActivity.onPause()
       this.currentActivity.state = ActivityState.Paused
@@ -395,7 +431,17 @@ export class ActivityManager {
         // the activity finished and the manager already took care of this situation.
         return
       }
-      // await this.updateCurrentActivity(activity)
+      await activity.onStart()
+      if (this.isDestroyed(activity)) {
+        return
+      }
+      activity.state = ActivityState.Started
+      await activity.onResume()
+      if (this.isDestroyed(activity)) {
+        return
+      }
+      activity.state = ActivityState.Resumed
+      activity.requestUpdate()
     }
     if (!isModal) {
       // With a modal activity, it renders directly to the `<body>` and renders outside

package/src/core/Application.ts

@@ -212,4 +212,8 @@ export abstract class Application extends EventTarget {
   getApplication() {
     return this
   }
+
+  findActiveActivity(id: string): Activity | undefined {
+    return this.#activities.findActiveActivity(id)
+  }
 }

package/src/core/Fragment.ts

@@ -57,6 +57,15 @@ export class Fragment extends EventTarget {
     this.#renderer = new FragmentRenderer(this)
   }
 
+  /**
+   * When implemented, this method returns the class name to be used as a root class for the fragment.
+   * This class name can be used to apply styles or identify the fragment in the DOM.
+   * @returns The class name to be used as a root class for the fragment.
+   */
+  public rootClass(): string | undefined {
+    return undefined
+  }
+
   /**
    * @see {@link ./Renderer.js}
    */
@@ -126,6 +135,7 @@ export class Fragment extends EventTarget {
    */
   onDestroy(): void | Promise<void> {
     this.dispatchEvent(new CustomEvent('fragment:destroy', { detail: null }))
+    this.fragmentManager.onDestroy()
   }
 
   /**
@@ -182,19 +192,19 @@ export class Fragment extends EventTarget {
    * @param key The name of the fragment.
    * @param fragment The fragment to add.
    */
-  addChild(key: string, fragment: Fragment, data?: unknown): void {
+  async addChild(key: string, fragment: Fragment, data?: unknown): Promise<void> {
     this.children.set(key, fragment)
-    this.fragmentManager.attachFragment(key, fragment, this, data)
+    await this.fragmentManager.attachFragment(key, fragment, this, data)
   }
 
   /**
    * Removes a fragment from this fragment.
    * @param key The name of the fragment to remove.
    */
-  removeChild(key: string): void {
+  async removeChild(key: string): Promise<void> {
     const child = this.children.get(key)
     if (child) {
-      this.fragmentManager.detachFragment(key)
+      await this.fragmentManager.detachFragment(key)
       this.children.delete(key)
     }
   }
@@ -261,7 +271,7 @@ export class Fragment extends EventTarget {
       return
     }
     for (const fragment of children.values()) {
-      if (fragment.hasRequstCode(requestCode)) {
+      if (fragment.hasRequestCode(requestCode)) {
         fragment.onActivityResult(requestCode, resultCode, intent)
         return
       }
@@ -273,9 +283,9 @@ export class Fragment extends EventTarget {
     }
   }
 
-  hasRequstCode(requestCode: number): boolean {
+  hasRequestCode(requestCode: number): boolean {
     for (const fragment of this.children.values()) {
-      if (fragment.hasRequstCode(requestCode)) {
+      if (fragment.hasRequestCode(requestCode)) {
         return true
       }
     }
@@ -311,7 +321,7 @@ export class Fragment extends EventTarget {
         onResult: info.onResult,
       })
     } else if (event.type === EventTypes.Intent.startActivity) {
-      activity.startActivity(event.detail.intent)
+      await activity.startActivity(event.detail.intent)
     } else {
       throw new Error(`Unrecognized intent event: ${event.type}`)
     }