@api-client/ui 0.3.5 → 0.4.0

package/build/src/elements/data-table/DataTable.d.ts

@@ -260,6 +260,40 @@ export declare abstract class DataTable<T extends object> extends LitElement {
      */
     protected createObserver(): void;
     protected revalidateSelection(): void;
+    /**
+     * Notifies about the selection change.
+     *
+     * This method dispatches a `select` event with the currently selected items.
+     *
+     * @param selectedItems - The array of currently selected items.
+     */
+    protected notifySelect(selectedItems: T[]): void;
+    /**
+     * Notifies about the scroll end event.
+     *
+     * This method dispatches a `scrollend` event when the user scrolls to the bottom of the table.
+     * It is typically used in conjunction with the `overflow` property to implement infinite scrolling.
+     */
+    protected notifyScrollEnd(): void;
+    /**
+     * Notifies about the activation of a row.
+     *
+     * This method dispatches an `activate` event with the activated item.
+     * It is typically used when a row is double-clicked or when the Enter/Space key is pressed while focused on a row.
+     *
+     * @param item - The data item that was activated.
+     */
+    protected notifyActivate(item: T): void;
+    /**
+     * Notifies about the sorting action.
+     *
+     * This method dispatches a `sort` event with the column name and sort direction.
+     * It is typically used when a sortable header cell is clicked.
+     *
+     * @param column - The name of the column being sorted.
+     * @param direction - The sort direction, either "asc" (ascending) or "desc" (descending).
+     */
+    protected notifySort(column: string, direction: 'asc' | 'desc'): void;
     /**
      * @internal
      * @description Handles the intersection of the sentinel element with the viewport.

package/build/src/elements/data-table/DataTable.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DataTable.d.ts","sourceRoot":"","sources":["../../../../src/elements/data-table/DataTable.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"DataTable.d.ts","sourceRoot":"","sources":["../../../../src/elements/data-table/DataTable.ts"],"names":[],"mappings":"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"}

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

@@ -4,12 +4,12 @@ import { html, LitElement, nothing } from 'lit';
 import { property, state } from 'lit/decorators.js';
 import { classMap } from 'lit/directives/class-map.js';
 import { ref, createRef } from 'lit/directives/ref.js';
+import { ifDefined } from 'lit/directives/if-defined.js';
 import { dataAttr } from '../../directives/data-attr.js';
 import '@material/web/icon/icon.js';
 import '@material/web/menu/menu.js';
 import '@material/web/menu/menu-item.js';
 import '@material/web/focus/md-focus-ring.js';
-import { ifDefined } from 'lit/directives/if-defined.js';
 /**
  * A versatile and accessible data table web component.
  *
@@ -367,11 +367,56 @@ let DataTable = (() => {
             const filteredSelectedItems = selectedItems.filter((selectedItem) => items.value.some((item) => item === selectedItem));
             if (filteredSelectedItems.length !== selectedItems.length) {
                 this.selectedItems = filteredSelectedItems;
-                this.dispatchEvent(new CustomEvent('select', {
-                    detail: { selectedItems: this.selectedItems },
-                }));
+                this.notifySelect(filteredSelectedItems);
             }
         }
+        /**
+         * Notifies about the selection change.
+         *
+         * This method dispatches a `select` event with the currently selected items.
+         *
+         * @param selectedItems - The array of currently selected items.
+         */
+        notifySelect(selectedItems) {
+            this.dispatchEvent(new CustomEvent('select', { detail: { selectedItems } }));
+        }
+        /**
+         * Notifies about the scroll end event.
+         *
+         * This method dispatches a `scrollend` event when the user scrolls to the bottom of the table.
+         * It is typically used in conjunction with the `overflow` property to implement infinite scrolling.
+         */
+        notifyScrollEnd() {
+            this.dispatchEvent(new CustomEvent('scrollend'));
+        }
+        /**
+         * Notifies about the activation of a row.
+         *
+         * This method dispatches an `activate` event with the activated item.
+         * It is typically used when a row is double-clicked or when the Enter/Space key is pressed while focused on a row.
+         *
+         * @param item - The data item that was activated.
+         */
+        notifyActivate(item) {
+            this.dispatchEvent(new CustomEvent('activate', { detail: item }));
+        }
+        /**
+         * Notifies about the sorting action.
+         *
+         * This method dispatches a `sort` event with the column name and sort direction.
+         * It is typically used when a sortable header cell is clicked.
+         *
+         * @param column - The name of the column being sorted.
+         * @param direction - The sort direction, either "asc" (ascending) or "desc" (descending).
+         */
+        notifySort(column, direction) {
+            this.dispatchEvent(new CustomEvent('sort', {
+                detail: {
+                    column,
+                    direction,
+                },
+            }));
+        }
         /**
          * @internal
          * @description Handles the intersection of the sentinel element with the viewport.
@@ -384,7 +429,7 @@ let DataTable = (() => {
          */
         handleIntersection = (__runInitializers(this, _position_extraInitializers), (entries) => {
             if (entries.some((entry) => entry.isIntersecting)) {
-                this.dispatchEvent(new CustomEvent('scrollend'));
+                this.notifyScrollEnd();
             }
         });
         /**
@@ -686,7 +731,7 @@ let DataTable = (() => {
             const endIndex = Math.max(this.lastSelectedIndex, clickedIndex);
             const newSelectedItems = this.items.value.slice(startIndex, endIndex + 1);
             this.selectedItems = newSelectedItems;
-            this.dispatchEvent(new CustomEvent('select', { detail: { selectedItems: this.selectedItems } }));
+            this.notifySelect(newSelectedItems);
         }
         /**
          * @internal
@@ -710,7 +755,7 @@ let DataTable = (() => {
             if (!item) {
                 return;
             }
-            this.dispatchEvent(new CustomEvent('activate', { detail: item }));
+            this.notifyActivate(item);
         }
         /**
          * @internal
@@ -733,12 +778,7 @@ let DataTable = (() => {
                 this.sort = sort;
                 this.sortDirection = 'asc';
             }
-            this.dispatchEvent(new CustomEvent('sort', {
-                detail: {
-                    column: this.sort,
-                    direction: this.sortDirection,
-                },
-            }));
+            this.notifySort(this.sort, this.sortDirection);
         }
         /**
          * @public
@@ -780,7 +820,7 @@ let DataTable = (() => {
                     this.selectedItems = this.selectedItems.filter((i) => i !== item);
                 }
             }
-            this.dispatchEvent(new CustomEvent('select', { detail: { selectedItems: this.selectedItems } }));
+            this.notifySelect(this.selectedItems);
         }
         /**
          * @internal

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   * @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"]}
+{"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 { ifDefined } from 'lit/directives/if-defined.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'\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.notifySelect(filteredSelectedItems)\n    }\n  }\n\n  /**\n   * Notifies about the selection change.\n   *\n   * This method dispatches a `select` event with the currently selected items.\n   *\n   * @param selectedItems - The array of currently selected items.\n   */\n  protected notifySelect(selectedItems: T[]): void {\n    this.dispatchEvent(new CustomEvent('select', { detail: { selectedItems } }))\n  }\n\n  /**\n   * Notifies about the scroll end event.\n   *\n   * This method dispatches a `scrollend` event when the user scrolls to the bottom of the table.\n   * It is typically used in conjunction with the `overflow` property to implement infinite scrolling.\n   */\n  protected notifyScrollEnd(): void {\n    this.dispatchEvent(new CustomEvent('scrollend'))\n  }\n\n  /**\n   * Notifies about the activation of a row.\n   *\n   * This method dispatches an `activate` event with the activated item.\n   * It is typically used when a row is double-clicked or when the Enter/Space key is pressed while focused on a row.\n   *\n   * @param item - The data item that was activated.\n   */\n  protected notifyActivate(item: T): void {\n    this.dispatchEvent(new CustomEvent('activate', { detail: item }))\n  }\n\n  /**\n   * Notifies about the sorting action.\n   *\n   * This method dispatches a `sort` event with the column name and sort direction.\n   * It is typically used when a sortable header cell is clicked.\n   *\n   * @param column - The name of the column being sorted.\n   * @param direction - The sort direction, either \"asc\" (ascending) or \"desc\" (descending).\n   */\n  protected notifySort(column: string, direction: 'asc' | 'desc'): void {\n    this.dispatchEvent(\n      new CustomEvent('sort', {\n        detail: {\n          column,\n          direction,\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.notifyScrollEnd()\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.notifySelect(newSelectedItems)\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.notifyActivate(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.notifySort(this.sort, this.sortDirection)\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.notifySelect(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.3.5",
+  "version": "0.4.0",
   "description": "Internal UI component library for the API Client ecosystem.",
   "license": "UNLICENSED",
   "main": "build/src/index.js",
@@ -175,7 +175,7 @@
     }
   },
   "dependencies": {
-    "@api-client/core": "^0.14.0",
+    "@api-client/core": "^0.15.0",
     "@api-client/graph": "^0.3.6",
     "@api-client/json": "^0.2.0",
     "@github/relative-time-element": "^4.4.6",

package/src/elements/data-table/DataTable.ts

@@ -3,6 +3,7 @@ import { html, LitElement, nothing, PropertyValues, TemplateResult } from 'lit'
 import { property, state } from 'lit/decorators.js'
 import { classMap } from 'lit/directives/class-map.js'
 import { ref, createRef } from 'lit/directives/ref.js'
+import { ifDefined } from 'lit/directives/if-defined.js'
 import { dataAttr } from '../../directives/data-attr.js'
 import { LiveData } from '../../reactive/LiveData.js'
 
@@ -10,7 +11,6 @@ import '@material/web/icon/icon.js'
 import '@material/web/menu/menu.js'
 import '@material/web/menu/menu-item.js'
 import '@material/web/focus/md-focus-ring.js'
-import { ifDefined } from 'lit/directives/if-defined.js'
 
 /**
  * Options for rendering a table cell.
@@ -359,14 +359,63 @@ export abstract class DataTable<T extends object> extends LitElement {
     )
     if (filteredSelectedItems.length !== selectedItems.length) {
       this.selectedItems = filteredSelectedItems
-      this.dispatchEvent(
-        new CustomEvent('select', {
-          detail: { selectedItems: this.selectedItems },
-        })
-      )
+      this.notifySelect(filteredSelectedItems)
     }
   }
 
+  /**
+   * Notifies about the selection change.
+   *
+   * This method dispatches a `select` event with the currently selected items.
+   *
+   * @param selectedItems - The array of currently selected items.
+   */
+  protected notifySelect(selectedItems: T[]): void {
+    this.dispatchEvent(new CustomEvent('select', { detail: { selectedItems } }))
+  }
+
+  /**
+   * Notifies about the scroll end event.
+   *
+   * This method dispatches a `scrollend` event when the user scrolls to the bottom of the table.
+   * It is typically used in conjunction with the `overflow` property to implement infinite scrolling.
+   */
+  protected notifyScrollEnd(): void {
+    this.dispatchEvent(new CustomEvent('scrollend'))
+  }
+
+  /**
+   * Notifies about the activation of a row.
+   *
+   * This method dispatches an `activate` event with the activated item.
+   * It is typically used when a row is double-clicked or when the Enter/Space key is pressed while focused on a row.
+   *
+   * @param item - The data item that was activated.
+   */
+  protected notifyActivate(item: T): void {
+    this.dispatchEvent(new CustomEvent('activate', { detail: item }))
+  }
+
+  /**
+   * Notifies about the sorting action.
+   *
+   * This method dispatches a `sort` event with the column name and sort direction.
+   * It is typically used when a sortable header cell is clicked.
+   *
+   * @param column - The name of the column being sorted.
+   * @param direction - The sort direction, either "asc" (ascending) or "desc" (descending).
+   */
+  protected notifySort(column: string, direction: 'asc' | 'desc'): void {
+    this.dispatchEvent(
+      new CustomEvent('sort', {
+        detail: {
+          column,
+          direction,
+        },
+      })
+    )
+  }
+
   /**
    * @internal
    * @description Handles the intersection of the sentinel element with the viewport.
@@ -379,7 +428,7 @@ export abstract class DataTable<T extends object> extends LitElement {
    */
   handleIntersection: IntersectionObserverCallback = (entries): void => {
     if (entries.some((entry) => entry.isIntersecting)) {
-      this.dispatchEvent(new CustomEvent('scrollend'))
+      this.notifyScrollEnd()
     }
   }
 
@@ -677,7 +726,7 @@ export abstract class DataTable<T extends object> extends LitElement {
     const endIndex = Math.max(this.lastSelectedIndex, clickedIndex)
     const newSelectedItems = this.items.value.slice(startIndex, endIndex + 1)
     this.selectedItems = newSelectedItems as T[]
-    this.dispatchEvent(new CustomEvent('select', { detail: { selectedItems: this.selectedItems } }))
+    this.notifySelect(newSelectedItems)
   }
 
   /**
@@ -702,7 +751,7 @@ export abstract class DataTable<T extends object> extends LitElement {
     if (!item) {
       return
     }
-    this.dispatchEvent(new CustomEvent('activate', { detail: item }))
+    this.notifyActivate(item)
   }
 
   /**
@@ -725,14 +774,7 @@ export abstract class DataTable<T extends object> extends LitElement {
       this.sort = sort
       this.sortDirection = 'asc'
     }
-    this.dispatchEvent(
-      new CustomEvent('sort', {
-        detail: {
-          column: this.sort,
-          direction: this.sortDirection,
-        },
-      })
-    )
+    this.notifySort(this.sort, this.sortDirection)
   }
 
   /**
@@ -775,7 +817,7 @@ export abstract class DataTable<T extends object> extends LitElement {
       }
     }
 
-    this.dispatchEvent(new CustomEvent('select', { detail: { selectedItems: this.selectedItems } }))
+    this.notifySelect(this.selectedItems)
   }
 
   /**