npm - @api-client/ui - Versions diffs - 0.5.46 → 0.5.48 - Mend

@api-client/ui 0.5.46 → 0.5.48

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (81) hide show

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

@@ -1,6 +1,6 @@
 import { LitElement, PropertyValues, TemplateResult } from 'lit';
 import { LiveData } from '../../reactive/LiveData.js';
-import '@material/web/focus/md-focus-ring.js';
+import '../../md/focus-ring/ui-focus-ring.js';
 import '../../md/icons/ui-icon.js';
 /**
  * Options for rendering a table cell.

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

@@ -6,7 +6,7 @@ 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/focus/md-focus-ring.js';
+import '../../md/focus-ring/ui-focus-ring.js';
 import '../../md/icons/ui-icon.js';
 /**
  * A versatile and accessible data table web component.
@@ -909,7 +909,7 @@ let DataTable = (() => {
                 index = isFocused ? 0 : -1;
             }
             const ring = !delegateFocus
-                ? html `<md-focus-ring .inward="${this.overflow ? true : false}"></md-focus-ring>`
+                ? html `<ui-focus-ring .inward="${this.overflow ? true : false}"></ui-focus-ring>`
                 : nothing;
             if (isPrimary) {
                 // Lit does not allow dynamic element names so I decided to make a copy.
@@ -999,7 +999,7 @@ let DataTable = (() => {
       aria-label="${ifDefined(ariaLabel)}"
       part="header-cell"
     >
-      <md-focus-ring .inward="${this.overflow ? true : false}"></md-focus-ring>
+      <ui-focus-ring .inward="${this.overflow ? true : false}"></ui-focus-ring>
       <div class="cell-content">
         ${content}
         ${isSortable && sortIcon ? html `<ui-icon class="sort-icon" role="presentation">${sortIcon}</ui-icon>` : nothing}

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

	@@ -1 +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 { ifDefined } from 'lit/directives/if-defined.js'\nimport { dataAttr } from '../../directives/data-attr.js'\nimport { LiveData } from '../../reactive/LiveData.js'\n\nimport '@material/web/focus/md-focus-ring.js'\nimport '../../md/icons/ui-icon.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`<ui-icon class=\"sort-icon\" role=\"presentation\">${sortIcon}</ui-icon>` : nothing}\n </div>\n </th> `\n }\n}\n"]}
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 { ifDefined } from 'lit/directives/if-defined.js'\nimport { dataAttr } from '../../directives/data-attr.js'\nimport { LiveData } from '../../reactive/LiveData.js'\n\nimport '../../md/focus-ring/ui-focus-ring.js'\nimport '../../md/icons/ui-icon.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`<ui-focus-ring .inward=\"${this.overflow ? true : false}\"></ui-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 <ui-focus-ring .inward=\"${this.overflow ? true : false}\"></ui-focus-ring>\n <div class=\"cell-content\">\n ${content}\n ${isSortable && sortIcon ? html`<ui-icon class=\"sort-icon\" role=\"presentation\">${sortIcon}</ui-icon>` : nothing}\n </div>\n </th> `\n }\n}\n"]}

package/build/src/elements/file-system/internals/Breadcrumbs.d.ts CHANGED Viewed

@@ -1,7 +1,7 @@
 import { LitElement, PropertyValues, TemplateResult } from 'lit';
 import { LiveData } from '../../../reactive/LiveData.js';
 import { type FileBreadcrumb } from '@api-client/core/models/store/File.js';
-import '@material/web/focus/md-focus-ring.js';
+import '../../../md/focus-ring/ui-focus-ring.js';
 import '../../../md/icons/ui-icon.js';
 /**
  * @fires navigate - Dispatched when a navigation item is activated.

package/build/src/elements/file-system/internals/Breadcrumbs.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Breadcrumbs.d.ts","sourceRoot":"","sources":["../../../../../src/elements/file-system/internals/Breadcrumbs.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,cAAc,EAAE,cAAc,EAAQ,MAAM,KAAK,CAAA;AAEtE,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAA;AACxD,OAAO,EAAE,KAAK,cAAc,EAAE,MAAM,uCAAuC,CAAA;AAG3E,OAAO,~~sCAAsC~~,CAAA;~~AAC7C~~,OAAO,8BAA8B,CAAA;AAErC;;;GAGG;AACH,MAAM,CAAC,OAAO,OAAO,WAAY,SAAQ,UAAU;IACjD,OAAgB,iBAAiB,EAAE,cAAc,CAGhD;IAED;;;OAGG;IACyB,QAAQ,CAAC,WAAW,EAAE,QAAQ,CAAC,cAAc,EAAE,CAAC,GAAG,SAAS,CAAA;IAExF;;;;OAIG;IACiD,QAAQ,CAAC,QAAQ,EAAE,MAAM,GAAG,SAAS,CAAA;;cAStE,OAAO,CAAC,EAAE,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAY1D,cAAc,IAAI,IAAI;IAItB,SAAS,CAAC,eAAe,CAAC,CAAC,EAAE,KAAK,GAAG,IAAI;IAazC,QAAQ,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI;IAY3B,YAAY,IAAI,IAAI;cAWD,MAAM,IAAI,cAAc;IAe3C,UAAU,CAAC,IAAI,EAAE,cAAc,EAAE,MAAM,UAAQ,GAAG,cAAc;IAQhE,UAAU,CAAC,IAAI,EAAE,cAAc,GAAG,cAAc;IAiBhD,YAAY,CAAC,IAAI,EAAE,cAAc,GAAG,cAAc;IAUlD,eAAe,IAAI,cAAc;CAGlC"}
1	+ {"version":3,"file":"Breadcrumbs.d.ts","sourceRoot":"","sources":["../../../../../src/elements/file-system/internals/Breadcrumbs.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,cAAc,EAAE,cAAc,EAAQ,MAAM,KAAK,CAAA;AAEtE,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAA;AACxD,OAAO,EAAE,KAAK,cAAc,EAAE,MAAM,uCAAuC,CAAA;AAG3E,OAAO,yCAAyC,CAAA;AAChD,OAAO,8BAA8B,CAAA;AAErC;;;GAGG;AACH,MAAM,CAAC,OAAO,OAAO,WAAY,SAAQ,UAAU;IACjD,OAAgB,iBAAiB,EAAE,cAAc,CAGhD;IAED;;;OAGG;IACyB,QAAQ,CAAC,WAAW,EAAE,QAAQ,CAAC,cAAc,EAAE,CAAC,GAAG,SAAS,CAAA;IAExF;;;;OAIG;IACiD,QAAQ,CAAC,QAAQ,EAAE,MAAM,GAAG,SAAS,CAAA;;cAStE,OAAO,CAAC,EAAE,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAY1D,cAAc,IAAI,IAAI;IAItB,SAAS,CAAC,eAAe,CAAC,CAAC,EAAE,KAAK,GAAG,IAAI;IAazC,QAAQ,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI;IAY3B,YAAY,IAAI,IAAI;cAWD,MAAM,IAAI,cAAc;IAe3C,UAAU,CAAC,IAAI,EAAE,cAAc,EAAE,MAAM,UAAQ,GAAG,cAAc;IAQhE,UAAU,CAAC,IAAI,EAAE,cAAc,GAAG,cAAc;IAiBhD,YAAY,CAAC,IAAI,EAAE,cAAc,GAAG,cAAc;IAUlD,eAAe,IAAI,cAAc;CAGlC"}

package/build/src/elements/file-system/internals/Breadcrumbs.js CHANGED Viewed

@@ -2,7 +2,7 @@ import { __esDecorate, __runInitializers } from "tslib";
 import { LitElement, html } from 'lit';
 import { property } from 'lit/decorators.js';
 import { FolderKind } from '@api-client/core/models/kinds.js';
-import '@material/web/focus/md-focus-ring.js';
+import '../../../md/focus-ring/ui-focus-ring.js';
 import '../../../md/icons/ui-icon.js';
 let Breadcrumbs = (() => {
     let _classSuper = LitElement;
@@ -124,7 +124,7 @@ let Breadcrumbs = (() => {
         class="link-button"
         @click="${this.handleLinkClick}"
       >
-        <md-focus-ring part="focus-ring"></md-focus-ring>
+        <ui-focus-ring part="focus-ring"></ui-focus-ring>
         ${name}
       </div>
     `;
@@ -133,7 +133,7 @@ let Breadcrumbs = (() => {
             const { key, kind, name } = item;
             return html `
       <div tabindex="0" role="button" data-key="${key}" data-kind="${kind}" class="action-button" aria-current="page">
-        <md-focus-ring part="focus-ring"></md-focus-ring>
+        <ui-focus-ring part="focus-ring"></ui-focus-ring>
         ${name}
       </div>
     `;

package/build/src/elements/file-system/internals/Breadcrumbs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Breadcrumbs.js","sourceRoot":"","sources":["../../../../../src/elements/file-system/internals/Breadcrumbs.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAkC,IAAI,EAAE,MAAM,KAAK,CAAA;AACtE,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAG5C,OAAO,EAAE,UAAU,EAAE,MAAM,kCAAkC,CAAA;AAE7D,OAAO,~~sCAAsC~~,CAAA;~~AAC7C~~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","sourcesContent":["import { LitElement, PropertyValues, TemplateResult, html } from 'lit'\nimport { property } from 'lit/decorators.js'\nimport { LiveData } from '../../../reactive/LiveData.js'\nimport { type FileBreadcrumb } from '@api-client/core/models/store/File.js'\nimport { FolderKind } from '@api-client/core/models/kinds.js'\n\nimport '~~@material~~/~~web/~~focus/md-focus-ring.js'\nimport '../../../md/icons/ui-icon.js'\n\n/*\n @fires navigate - Dispatched when a navigation item is activated.\n * The detail object is the `FileBreadcrumb` interface. The root object has the `id` set to empty string.\n /\nexport default class Breadcrumbs extends LitElement {\n static override shadowRootOptions: ShadowRootInit = {\n mode: 'open',\n delegatesFocus: true,\n }\n\n /\n The list of breadcrumbs to render.\n * The breadcrumbs should be ordered from the root to the current folder.\n /\n @property({ type: Object }) accessor breadcrumbs: LiveData<FileBreadcrumb[]> \| undefined\n\n /\n When set it renders the special root folder with the name set on this property.\n * When the root object is clicked then the `navigate` event is dispatched without the `key` property set.\n * @attribute root-name\n */\n @property({ type: String, attribute: 'root-name' }) accessor rootName: string \| undefined\n\n constructor() {\n super()\n this.role = 'navigation'\n this.ariaLabel = 'Breadcrumbs'\n this.handleLiveData = this.handleLiveData.bind(this)\n }\n\n protected override updated(cp: PropertyValues<this>): void {\n if (cp.has('breadcrumbs')) {\n const old = cp.get('breadcrumbs')\n if (old) {\n old.removeEventListener('update', this.handleLiveData)\n }\n if (this.breadcrumbs) {\n this.breadcrumbs.addEventListener('update', this.handleLiveData)\n }\n }\n }\n\n handleLiveData(): void {\n this.requestUpdate()\n }\n\n protected handleLinkClick(e: Event): void {\n const target = e.target as HTMLElement\n const { key, kind } = target.dataset\n if (kind === 'root') {\n this.navigateRoot()\n return\n }\n if (!key) {\n return\n }\n this.navigate(key)\n }\n\n navigate(key: string): void {\n const { breadcrumbs } = this\n if (!breadcrumbs) {\n return\n }\n const item = breadcrumbs.value.find((i) => i.key === key)\n if (!item) {\n return\n }\n this.dispatchEvent(new CustomEvent<FileBreadcrumb>('navigate', { detail: item }))\n }\n\n navigateRoot(): void {\n this.dispatchEvent(\n new CustomEvent<Partial<FileBreadcrumb>>('navigate', {\n detail: {\n kind: 'root',\n name: this.rootName as string,\n },\n })\n )\n }\n\n protected override render(): TemplateResult {\n const { breadcrumbs, rootName } = this\n const items = Array.from(breadcrumbs?.value \|\| []).filter((i) => i.kind === FolderKind)\n if (rootName) {\n items.unshift({ key: '', name: rootName, kind: 'root' })\n }\n return html`\n <div class=\"container\" role=\"list\">\n ${items.map((item, index) => {\n return this.renderItem(item, index === items.length - 1)\n })}\n </div>\n `\n }\n\n renderItem(item: FileBreadcrumb, isLast = false): TemplateResult {\n const content = isLast ? this.renderButton(item) : this.renderLink(item)\n return html`\n <div class=\"item spacing-headline-small\" role=\"listitem\">${content}</div>\n ${isLast ? '' : this.renderSeparator()}\n `\n }\n\n renderLink(item: FileBreadcrumb): TemplateResult {\n const { key, kind, name } = item\n return html`\n <div\n tabindex=\"0\"\n role=\"link\"\n data-key=\"${key}\"\n data-kind=\"${kind}\"\n class=\"link-button\"\n @click=\"${this.handleLinkClick}\"\n >\n <md-focus-ring part=\"focus-ring\"></md-focus-ring>\n ${name}\n </div>\n `\n }\n\n renderButton(item: FileBreadcrumb): TemplateResult {\n const { key, kind, name } = item\n return html`\n <div tabindex=\"0\" role=\"button\" data-key=\"${key}\" data-kind=\"${kind}\" class=\"action-button\" aria-current=\"page\">\n <md-focus-ring part=\"focus-ring\"></md-focus-ring>\n ${name}\n </div>\n `\n }\n\n renderSeparator(): TemplateResult {\n return html`<ui-icon class=\"separator\">chevron_right</ui-icon>`\n }\n}\n"]}
1	+ {"version":3,"file":"Breadcrumbs.js","sourceRoot":"","sources":["../../../../../src/elements/file-system/internals/Breadcrumbs.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAkC,IAAI,EAAE,MAAM,KAAK,CAAA;AACtE,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAG5C,OAAO,EAAE,UAAU,EAAE,MAAM,kCAAkC,CAAA;AAE7D,OAAO,yCAAyC,CAAA;AAChD,OAAO,8BAA8B,CAAA;;sBAMI,UAAU;;;;;;;iBAA9B,WAAY,SAAQ,WAAU;;;uCAUhD,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;oCAO1B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,WAAW,EAAE,CAAC;YAPvB,sLAAS,WAAW,6BAAX,WAAW,iGAAwC;YAOpC,6KAAS,QAAQ,6BAAR,QAAQ,2FAAoB;;;QAhBzF,MAAM,CAAU,iBAAiB,GAAmB;YAClD,IAAI,EAAE,MAAM;YACZ,cAAc,EAAE,IAAI;SACrB,CAAA;QAM2B,2FAA4D;QAJxF;;;WAGG;QACyB,IAAS,WAAW,iDAAwC;QAA5D,IAAS,WAAW,uDAAwC;QAOpC,gJAAqC;QALzF;;;;WAIG;QACiD,IAAS,QAAQ,8CAAoB;QAArC,IAAS,QAAQ,oDAAoB;QAEzF;YACE,KAAK,EAAE,CAAA;;YACP,IAAI,CAAC,IAAI,GAAG,YAAY,CAAA;YACxB,IAAI,CAAC,SAAS,GAAG,aAAa,CAAA;YAC9B,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;SACrD;QAEkB,OAAO,CAAC,EAAwB;YACjD,IAAI,EAAE,CAAC,GAAG,CAAC,aAAa,CAAC,EAAE,CAAC;gBAC1B,MAAM,GAAG,GAAG,EAAE,CAAC,GAAG,CAAC,aAAa,CAAC,CAAA;gBACjC,IAAI,GAAG,EAAE,CAAC;oBACR,GAAG,CAAC,mBAAmB,CAAC,QAAQ,EAAE,IAAI,CAAC,cAAc,CAAC,CAAA;gBACxD,CAAC;gBACD,IAAI,IAAI,CAAC,WAAW,EAAE,CAAC;oBACrB,IAAI,CAAC,WAAW,CAAC,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,cAAc,CAAC,CAAA;gBAClE,CAAC;YACH,CAAC;QACH,CAAC;QAED,cAAc;YACZ,IAAI,CAAC,aAAa,EAAE,CAAA;QACtB,CAAC;QAES,eAAe,CAAC,CAAQ;YAChC,MAAM,MAAM,GAAG,CAAC,CAAC,MAAqB,CAAA;YACtC,MAAM,EAAE,GAAG,EAAE,IAAI,EAAE,GAAG,MAAM,CAAC,OAAO,CAAA;YACpC,IAAI,IAAI,KAAK,MAAM,EAAE,CAAC;gBACpB,IAAI,CAAC,YAAY,EAAE,CAAA;gBACnB,OAAM;YACR,CAAC;YACD,IAAI,CAAC,GAAG,EAAE,CAAC;gBACT,OAAM;YACR,CAAC;YACD,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAA;QACpB,CAAC;QAED,QAAQ,CAAC,GAAW;YAClB,MAAM,EAAE,WAAW,EAAE,GAAG,IAAI,CAAA;YAC5B,IAAI,CAAC,WAAW,EAAE,CAAC;gBACjB,OAAM;YACR,CAAC;YACD,MAAM,IAAI,GAAG,WAAW,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,CAAA;YACzD,IAAI,CAAC,IAAI,EAAE,CAAC;gBACV,OAAM;YACR,CAAC;YACD,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAiB,UAAU,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,CAAC,CAAC,CAAA;QACnF,CAAC;QAED,YAAY;YACV,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAA0B,UAAU,EAAE;gBACnD,MAAM,EAAE;oBACN,IAAI,EAAE,MAAM;oBACZ,IAAI,EAAE,IAAI,CAAC,QAAkB;iBAC9B;aACF,CAAC,CACH,CAAA;QACH,CAAC;QAEkB,MAAM;YACvB,MAAM,EAAE,WAAW,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAA;YACtC,MAAM,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,WAAW,EAAE,KAAK,IAAI,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,KAAK,UAAU,CAAC,CAAA;YACvF,IAAI,QAAQ,EAAE,CAAC;gBACb,KAAK,CAAC,OAAO,CAAC,EAAE,GAAG,EAAE,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC,CAAA;YAC1D,CAAC;YACD,OAAO,IAAI,CAAA;;UAEL,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;gBAC1B,OAAO,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,KAAK,KAAK,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAA;YAC1D,CAAC,CAAC;;KAEL,CAAA;QACH,CAAC;QAED,UAAU,CAAC,IAAoB,EAAE,MAAM,GAAG,KAAK;YAC7C,MAAM,OAAO,GAAG,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,CAAA;YACxE,OAAO,IAAI,CAAA;iEACkD,OAAO;QAChE,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,eAAe,EAAE;KACvC,CAAA;QACH,CAAC;QAED,UAAU,CAAC,IAAoB;YAC7B,MAAM,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,IAAI,CAAA;YAChC,OAAO,IAAI,CAAA;;;;oBAIK,GAAG;qBACF,IAAI;;kBAEP,IAAI,CAAC,eAAe;;;UAG5B,IAAI;;KAET,CAAA;QACH,CAAC;QAED,YAAY,CAAC,IAAoB;YAC/B,MAAM,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,IAAI,CAAA;YAChC,OAAO,IAAI,CAAA;kDACmC,GAAG,gBAAgB,IAAI;;UAE/D,IAAI;;KAET,CAAA;QACH,CAAC;QAED,eAAe;YACb,OAAO,IAAI,CAAA,oDAAoD,CAAA;QACjE,CAAC;;;AAtIH;;;GAGG;AACH","sourcesContent":["import { LitElement, PropertyValues, TemplateResult, html } from 'lit'\nimport { property } from 'lit/decorators.js'\nimport { LiveData } from '../../../reactive/LiveData.js'\nimport { type FileBreadcrumb } from '@api-client/core/models/store/File.js'\nimport { FolderKind } from '@api-client/core/models/kinds.js'\n\nimport '../../../md/focus-ring/ui-focus-ring.js'\nimport '../../../md/icons/ui-icon.js'\n\n/*\n @fires navigate - Dispatched when a navigation item is activated.\n * The detail object is the `FileBreadcrumb` interface. The root object has the `id` set to empty string.\n /\nexport default class Breadcrumbs extends LitElement {\n static override shadowRootOptions: ShadowRootInit = {\n mode: 'open',\n delegatesFocus: true,\n }\n\n /\n The list of breadcrumbs to render.\n * The breadcrumbs should be ordered from the root to the current folder.\n /\n @property({ type: Object }) accessor breadcrumbs: LiveData<FileBreadcrumb[]> \| undefined\n\n /\n When set it renders the special root folder with the name set on this property.\n * When the root object is clicked then the `navigate` event is dispatched without the `key` property set.\n * @attribute root-name\n */\n @property({ type: String, attribute: 'root-name' }) accessor rootName: string \| undefined\n\n constructor() {\n super()\n this.role = 'navigation'\n this.ariaLabel = 'Breadcrumbs'\n this.handleLiveData = this.handleLiveData.bind(this)\n }\n\n protected override updated(cp: PropertyValues<this>): void {\n if (cp.has('breadcrumbs')) {\n const old = cp.get('breadcrumbs')\n if (old) {\n old.removeEventListener('update', this.handleLiveData)\n }\n if (this.breadcrumbs) {\n this.breadcrumbs.addEventListener('update', this.handleLiveData)\n }\n }\n }\n\n handleLiveData(): void {\n this.requestUpdate()\n }\n\n protected handleLinkClick(e: Event): void {\n const target = e.target as HTMLElement\n const { key, kind } = target.dataset\n if (kind === 'root') {\n this.navigateRoot()\n return\n }\n if (!key) {\n return\n }\n this.navigate(key)\n }\n\n navigate(key: string): void {\n const { breadcrumbs } = this\n if (!breadcrumbs) {\n return\n }\n const item = breadcrumbs.value.find((i) => i.key === key)\n if (!item) {\n return\n }\n this.dispatchEvent(new CustomEvent<FileBreadcrumb>('navigate', { detail: item }))\n }\n\n navigateRoot(): void {\n this.dispatchEvent(\n new CustomEvent<Partial<FileBreadcrumb>>('navigate', {\n detail: {\n kind: 'root',\n name: this.rootName as string,\n },\n })\n )\n }\n\n protected override render(): TemplateResult {\n const { breadcrumbs, rootName } = this\n const items = Array.from(breadcrumbs?.value \|\| []).filter((i) => i.kind === FolderKind)\n if (rootName) {\n items.unshift({ key: '', name: rootName, kind: 'root' })\n }\n return html`\n <div class=\"container\" role=\"list\">\n ${items.map((item, index) => {\n return this.renderItem(item, index === items.length - 1)\n })}\n </div>\n `\n }\n\n renderItem(item: FileBreadcrumb, isLast = false): TemplateResult {\n const content = isLast ? this.renderButton(item) : this.renderLink(item)\n return html`\n <div class=\"item spacing-headline-small\" role=\"listitem\">${content}</div>\n ${isLast ? '' : this.renderSeparator()}\n `\n }\n\n renderLink(item: FileBreadcrumb): TemplateResult {\n const { key, kind, name } = item\n return html`\n <div\n tabindex=\"0\"\n role=\"link\"\n data-key=\"${key}\"\n data-kind=\"${kind}\"\n class=\"link-button\"\n @click=\"${this.handleLinkClick}\"\n >\n <ui-focus-ring part=\"focus-ring\"></ui-focus-ring>\n ${name}\n </div>\n `\n }\n\n renderButton(item: FileBreadcrumb): TemplateResult {\n const { key, kind, name } = item\n return html`\n <div tabindex=\"0\" role=\"button\" data-key=\"${key}\" data-kind=\"${kind}\" class=\"action-button\" aria-current=\"page\">\n <ui-focus-ring part=\"focus-ring\"></ui-focus-ring>\n ${name}\n </div>\n `\n }\n\n renderSeparator(): TemplateResult {\n return html`<ui-icon class=\"separator\">chevron_right</ui-icon>`\n }\n}\n"]}

package/build/src/elements/navigation/internals/NavigationItem.d.ts CHANGED Viewed

@@ -1,5 +1,7 @@
 import { TemplateResult } from 'lit';
 import { UiElement } from '../../../md/UiElement.js';
+import '../../../md/focus-ring/ui-focus-ring.js';
+import '../../../md/ripple/ui-ripple.js';
 /**
  * NavigationItem
  *

package/build/src/elements/navigation/internals/NavigationItem.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NavigationItem.d.ts","sourceRoot":"","sources":["../../../../../src/elements/navigation/internals/NavigationItem.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,cAAc,EAAW,MAAM,KAAK,CAAA;AAInD,OAAO,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAA;~~AAGpD~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqDG;AACH,MAAM,CAAC,OAAO,OAAO,cAAe,SAAQ,SAAS;IACnD,OAAgB,iBAAiB,EAAE,cAAc,CAGhD;IAED,IAAI,QAAQ,IAAI,OAAO,CAEtB;IAED;;;OAGG;IACH,IACI,QAAQ,CAAC,KAAK,EAAE,OAAO,EAI1B;IAED;;;OAGG;IACyC,QAAQ,CAAC,QAAQ,UAAQ;IACrE;;;;OAIG;IACyC,QAAQ,CAAC,QAAQ,UAAQ;IACrE;;;OAGG;IACwC,QAAQ,CAAC,IAAI,EAAE,MAAM,GAAG,SAAS,CAAA;IAE5E;;OAEG;IACM,SAAS,CAAC,QAAQ,CAAC,OAAO,UAAQ;IAE3C;;OAEG;IACH,SAAS,CAAC,oBAAoB,CAAC,CAAC,EAAE,KAAK,GAAG,IAAI;cAK3B,MAAM,IAAI,cAAc;IAqB3C,SAAS,CAAC,UAAU,IAAI,cAAc;CAKvC"}
1	+ {"version":3,"file":"NavigationItem.d.ts","sourceRoot":"","sources":["../../../../../src/elements/navigation/internals/NavigationItem.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,cAAc,EAAW,MAAM,KAAK,CAAA;AAInD,OAAO,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAA;AAEpD,OAAO,yCAAyC,CAAA;AAChD,OAAO,iCAAiC,CAAA;AAExC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqDG;AACH,MAAM,CAAC,OAAO,OAAO,cAAe,SAAQ,SAAS;IACnD,OAAgB,iBAAiB,EAAE,cAAc,CAGhD;IAED,IAAI,QAAQ,IAAI,OAAO,CAEtB;IAED;;;OAGG;IACH,IACI,QAAQ,CAAC,KAAK,EAAE,OAAO,EAI1B;IAED;;;OAGG;IACyC,QAAQ,CAAC,QAAQ,UAAQ;IACrE;;;;OAIG;IACyC,QAAQ,CAAC,QAAQ,UAAQ;IACrE;;;OAGG;IACwC,QAAQ,CAAC,IAAI,EAAE,MAAM,GAAG,SAAS,CAAA;IAE5E;;OAEG;IACM,SAAS,CAAC,QAAQ,CAAC,OAAO,UAAQ;IAE3C;;OAEG;IACH,SAAS,CAAC,oBAAoB,CAAC,CAAC,EAAE,KAAK,GAAG,IAAI;cAK3B,MAAM,IAAI,cAAc;IAqB3C,SAAS,CAAC,UAAU,IAAI,cAAc;CAKvC"}

package/build/src/elements/navigation/internals/NavigationItem.js CHANGED Viewed

@@ -5,6 +5,8 @@ import { classMap } from 'lit/directives/class-map.js';
 import { when } from 'lit/directives/when.js';
 import { UiElement } from '../../../md/UiElement.js';
 import { isDisabled, setDisabled } from '../../../lib/disabled.js';
+import '../../../md/focus-ring/ui-focus-ring.js';
+import '../../../md/ripple/ui-ripple.js';
 let NavigationItem = (() => {
     let _classSuper = UiElement;
     let _instanceExtraInitializers = [];
@@ -112,8 +114,8 @@ let NavigationItem = (() => {
             });
             return html `
       <button class="${containerClasses}" id="button" ?disabled="${this.disabled}" aria-disabled="${this.disabled}">
-        <md-focus-ring part="focus-ring" for="button"></md-focus-ring>
-        <md-ripple></md-ripple>
+        <ui-focus-ring part="focus-ring" for="button"></ui-focus-ring>
+        <ui-ripple></ui-ripple>
         ${this.renderIcon()}${when(this.iconOnly, () => nothing, () => html `<slot></slot>`)}
       </button>
     `;

package/build/src/elements/navigation/internals/NavigationItem.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NavigationItem.js","sourceRoot":"","sources":["../../../../../src/elements/navigation/internals/NavigationItem.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAkB,OAAO,EAAE,MAAM,KAAK,CAAA;AACnD,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AACnD,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAA;AACtD,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAA;AAC7C,OAAO,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAA;AACpD,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;;~~sBAwDtB~~,SAAS;;;;;;;;;;;;;;;iBAAhC,cAAe,SAAQ,WAAS;;;wCAclD,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;oCAW1C,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;oCAM1C,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;gCAK1C,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;mCAKzC,KAAK,EAAE;YA1BR,0LAAI,QAAQ,wEAIX;YAM2C,6KAAS,QAAQ,6BAAR,QAAQ,2FAAQ;YAMzB,6KAAS,QAAQ,6BAAR,QAAQ,2FAAQ;YAK1B,iKAAS,IAAI,6BAAJ,IAAI,mFAAoB;YAKnE,0KAAmB,OAAO,6BAAP,OAAO,yFAAQ;;;QAxC3C,MAAM,CAAU,iBAAiB,GAAmB;YAClD,IAAI,EAAE,MAAM;YACZ,cAAc,EAAE,IAAI;SACrB,CAAA;QAED,IAAI,QAAQ;YACV,OAAO,UAAU,CAAC,IAAI,CAAC,CAAA;QACzB,CAAC;QAED;;;WAGG;QAEH,IAAI,QAAQ,CAAC,KAAc;YACzB,MAAM,GAAG,GAAG,UAAU,CAAC,IAAI,CAAC,CAAA;YAC5B,WAAW,CAAC,IAAI,EAAE,KAAK,CAAC,CAAA;YACxB,IAAI,CAAC,aAAa,CAAC,UAAU,EAAE,GAAG,CAAC,CAAA;QACrC,CAAC;QAM2C,8BAzBzB,mDAAc,kDAyB+B,KAAK;QACrE;;;;WAIG;WALkE;QAJrE;;;WAGG;QACyC,IAAS,QAAQ,8CAAQ;QAAzB,IAAS,QAAQ,oDAAQ;QAMzB,oIAAoB,KAAK;QACrE;;;WAGG;WAJkE;QALrE;;;;WAIG;QACyC,IAAS,QAAQ,8CAAQ;QAAzB,IAAS,QAAQ,oDAAQ;QAK1B,qIAAiC;QAJ5E;;;WAGG;QACwC,IAAS,IAAI,0CAAoB;QAAjC,IAAS,IAAI,gDAAoB;QAKnE,8HAA6B,KAAK;QAE3C;;WAEG;WAJwC;QAH3C;;WAEG;QACM,IAAmB,OAAO,6CAAQ;QAAlC,IAAmB,OAAO,mDAAQ;QAE3C;;WAEG;QACO,oBAAoB,CAAC,CAAQ;YACrC,MAAM,IAAI,GAAG,CAAC,CAAC,MAAyB,CAAA;YACxC,IAAI,CAAC,OAAO,GAAG,CAAC,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC,MAAM,CAAA;QAC9C,CAAC;QAEkB,MAAM;YACvB,MAAM,EAAE,OAAO,GAAG,KAAK,EAAE,GAAG,IAAI,CAAA;YAChC,MAAM,gBAAgB,GAAG,QAAQ,CAAC;gBAChC,QAAQ,EAAE,IAAI;gBACd,WAAW,EAAE,IAAI,CAAC,OAAO;gBACzB,SAAS,EAAE,OAAO;gBAClB,WAAW,EAAE,IAAI,CAAC,QAAQ;aAC3B,CAAC,CAAA;YACF,OAAO,IAAI,CAAA;uBACQ,gBAAgB,4BAA4B,IAAI,CAAC,QAAQ,oBAAoB,IAAI,CAAC,QAAQ;;;UAGvG,IAAI,CAAC,UAAU,EAAE,GAAG,IAAI,CACxB,IAAI,CAAC,QAAQ,EACb,GAAG,EAAE,CAAC,OAAO,EACb,GAAG,EAAE,CAAC,IAAI,CAAA,eAAe,CAC1B;;KAEJ,CAAA;QACH,CAAC;QAES,UAAU;YAClB,OAAO,IAAI,CAAA;wCACyB,IAAI,CAAC,oBAAoB;aACpD,CAAA;QACX,CAAC;;;;;;;AAlIH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqDG;AACH","sourcesContent":["import { html, TemplateResult, nothing } from 'lit'\nimport { property, state } from 'lit/decorators.js'\nimport { classMap } from 'lit/directives/class-map.js'\nimport { when } from 'lit/directives/when.js'\nimport { UiElement } from '../../../md/UiElement.js'\nimport { isDisabled, setDisabled } from '../../../lib/disabled.js'\n\n/*\n NavigationItem\n \n An element to be placed inside a navigation bar. This component is designed for use with navigation bars and supports\n * icon-only, selected, and disabled states. It is built with accessibility and composability in mind.\n \n ## Accessibility\n \n - Uses a native `<button>` element for proper semantics and keyboard accessibility.\n * - The icon is marked with `role=\"presentation\"` to indicate it is decorative.\n * - Focus ring and ripple effects are included for visual feedback.\n \n ## Usage Example\n \n ### Accessible Navigation Example\n \n ```html\n * <nav aria-label=\"Main navigation\">\n * <ul style=\"display: flex; gap: 8px; list-style: none; padding: 0; margin: 0;\">\n * <li>\n * <navigation-item selected aria-current=\"page\">\n * <span slot=\"icon\" aria-hidden=\"true\">🏠</span>\n * Home\n * </navigation-item>\n * </li>\n * <li>\n * <navigation-item>\n * <span slot=\"icon\" aria-hidden=\"true\">🔍</span>\n * Search\n * </navigation-item>\n * </li>\n * <li>\n * <navigation-item>\n * <span slot=\"icon\" aria-hidden=\"true\">📁</span>\n * Files\n * </navigation-item>\n * </li>\n * <li>\n * <navigation-item iconOnly disabled aria-disabled=\"true\" tabindex=\"-1\">\n * <span slot=\"icon\" aria-hidden=\"true\">⚙️</span>\n * </navigation-item>\n * </li>\n * </ul>\n * </nav>\n * ```\n \n This example demonstrates a horizontal navigation bar using semantic HTML. Each `navigation-item`\n * is placed inside a list item for proper structure. The `aria-current=\"page\"` attribute marks the current\n * page, and `aria-disabled=\"true\"` with `tabindex=\"-1\"` ensures the disabled item is not focusable.\n * Icons use `aria-hidden=\"true\"` for accessibility.\n \n @slot icon - A slot for the icon element\n * @slot - The default slot for the label\n /\nexport default class NavigationItem extends UiElement {\n static override shadowRootOptions: ShadowRootInit = {\n mode: 'open',\n delegatesFocus: true,\n }\n\n get disabled(): boolean {\n return isDisabled(this)\n }\n\n /\n When set, the navigation item is in a disabled state.\n * @attribute\n /\n @property({ reflect: true, type: Boolean })\n set disabled(value: boolean) {\n const old = isDisabled(this)\n setDisabled(this, value)\n this.requestUpdate('disabled', old)\n }\n\n /\n Whether the navigation item is selected.\n * @attribute\n /\n @property({ reflect: true, type: Boolean }) accessor selected = false\n /\n When set, the navigation item is rendered as an icon-only button.\n * The width of the button is set to 40px.\n * @attribute\n /\n @property({ reflect: true, type: Boolean }) accessor iconOnly = false\n /\n The reference of the navigation item to the target.\n * @attribute\n /\n @property({ reflect: true, type: String }) accessor href: string \| undefined\n\n /\n Determines when the element has an icon in the \"icon\" slot.\n /\n @state() protected accessor hasIcon = false\n\n /\n Sets the `_hasIcon` state property when the \"icon\" slot change event is dispatched.\n */\n protected handleIconSlotChange(e: Event): void {\n const slot = e.target as HTMLSlotElement\n this.hasIcon = !!slot.assignedNodes().length\n }\n\n protected override render(): TemplateResult {\n const { pressed = false } = this\n const containerClasses = classMap({\n 'button': true,\n 'with-icon': this.hasIcon,\n 'pressed': pressed,\n 'icon-only': this.iconOnly,\n })\n return html`\n <button class=\"${containerClasses}\" id=\"button\" ?disabled=\"${this.disabled}\" aria-disabled=\"${this.disabled}\">\n <md-focus-ring part=\"focus-ring\" for=\"button\"></md-focus-ring>\n <md-ripple></md-ripple>\n ${this.renderIcon()}${when(\n this.iconOnly,\n () => nothing,\n () => html`<slot></slot>`\n )}\n </button>\n `\n }\n\n protected renderIcon(): TemplateResult {\n return html`<span role=\"presentation\" class=\"icon\"\n ><slot name=\"icon\" @slotchange=\"${this.handleIconSlotChange}\"></slot\n ></span>`\n }\n}\n"]}
1	+ {"version":3,"file":"NavigationItem.js","sourceRoot":"","sources":["../../../../../src/elements/navigation/internals/NavigationItem.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, TemplateResult, nothing } from 'lit'\nimport { property, state } from 'lit/decorators.js'\nimport { classMap } from 'lit/directives/class-map.js'\nimport { when } from 'lit/directives/when.js'\nimport { UiElement } from '../../../md/UiElement.js'\nimport { isDisabled, setDisabled } from '../../../lib/disabled.js'\nimport '../../../md/focus-ring/ui-focus-ring.js'\nimport '../../../md/ripple/ui-ripple.js'\n\n/*\n NavigationItem\n \n An element to be placed inside a navigation bar. This component is designed for use with navigation bars and supports\n * icon-only, selected, and disabled states. It is built with accessibility and composability in mind.\n \n ## Accessibility\n \n - Uses a native `<button>` element for proper semantics and keyboard accessibility.\n * - The icon is marked with `role=\"presentation\"` to indicate it is decorative.\n * - Focus ring and ripple effects are included for visual feedback.\n \n ## Usage Example\n \n ### Accessible Navigation Example\n \n ```html\n * <nav aria-label=\"Main navigation\">\n * <ul style=\"display: flex; gap: 8px; list-style: none; padding: 0; margin: 0;\">\n * <li>\n * <navigation-item selected aria-current=\"page\">\n * <span slot=\"icon\" aria-hidden=\"true\">🏠</span>\n * Home\n * </navigation-item>\n * </li>\n * <li>\n * <navigation-item>\n * <span slot=\"icon\" aria-hidden=\"true\">🔍</span>\n * Search\n * </navigation-item>\n * </li>\n * <li>\n * <navigation-item>\n * <span slot=\"icon\" aria-hidden=\"true\">📁</span>\n * Files\n * </navigation-item>\n * </li>\n * <li>\n * <navigation-item iconOnly disabled aria-disabled=\"true\" tabindex=\"-1\">\n * <span slot=\"icon\" aria-hidden=\"true\">⚙️</span>\n * </navigation-item>\n * </li>\n * </ul>\n * </nav>\n * ```\n \n This example demonstrates a horizontal navigation bar using semantic HTML. Each `navigation-item`\n * is placed inside a list item for proper structure. The `aria-current=\"page\"` attribute marks the current\n * page, and `aria-disabled=\"true\"` with `tabindex=\"-1\"` ensures the disabled item is not focusable.\n * Icons use `aria-hidden=\"true\"` for accessibility.\n \n @slot icon - A slot for the icon element\n * @slot - The default slot for the label\n /\nexport default class NavigationItem extends UiElement {\n static override shadowRootOptions: ShadowRootInit = {\n mode: 'open',\n delegatesFocus: true,\n }\n\n get disabled(): boolean {\n return isDisabled(this)\n }\n\n /\n When set, the navigation item is in a disabled state.\n * @attribute\n /\n @property({ reflect: true, type: Boolean })\n set disabled(value: boolean) {\n const old = isDisabled(this)\n setDisabled(this, value)\n this.requestUpdate('disabled', old)\n }\n\n /\n Whether the navigation item is selected.\n * @attribute\n /\n @property({ reflect: true, type: Boolean }) accessor selected = false\n /\n When set, the navigation item is rendered as an icon-only button.\n * The width of the button is set to 40px.\n * @attribute\n /\n @property({ reflect: true, type: Boolean }) accessor iconOnly = false\n /\n The reference of the navigation item to the target.\n * @attribute\n /\n @property({ reflect: true, type: String }) accessor href: string \| undefined\n\n /\n Determines when the element has an icon in the \"icon\" slot.\n /\n @state() protected accessor hasIcon = false\n\n /\n Sets the `_hasIcon` state property when the \"icon\" slot change event is dispatched.\n */\n protected handleIconSlotChange(e: Event): void {\n const slot = e.target as HTMLSlotElement\n this.hasIcon = !!slot.assignedNodes().length\n }\n\n protected override render(): TemplateResult {\n const { pressed = false } = this\n const containerClasses = classMap({\n 'button': true,\n 'with-icon': this.hasIcon,\n 'pressed': pressed,\n 'icon-only': this.iconOnly,\n })\n return html`\n <button class=\"${containerClasses}\" id=\"button\" ?disabled=\"${this.disabled}\" aria-disabled=\"${this.disabled}\">\n <ui-focus-ring part=\"focus-ring\" for=\"button\"></ui-focus-ring>\n <ui-ripple></ui-ripple>\n ${this.renderIcon()}${when(\n this.iconOnly,\n () => nothing,\n () => html`<slot></slot>`\n )}\n </button>\n `\n }\n\n protected renderIcon(): TemplateResult {\n return html`<span role=\"presentation\" class=\"icon\"\n ><slot name=\"icon\" @slotchange=\"${this.handleIconSlotChange}\"></slot\n ></span>`\n }\n}\n"]}

package/build/src/elements/user/internals/UserAvatar.d.ts CHANGED Viewed

@@ -1,15 +1,26 @@
-import { TemplateResult, LitElement, PropertyValues, SVGTemplateResult } from 'lit';
+import { TemplateResult, PropertyValues, SVGTemplateResult } from 'lit';
+import { UiElement } from '../../../md/UiElement.js';
 import type { IUser } from '@api-client/core/models/store/User.js';
-import '@material/web/focus/md-focus-ring.js';
-import '@material/web/ripple/ripple.js';
+import type UiRipple from '../../../md/ripple/internals/ripple.js';
+import type { BeginPressConfig, EndPressConfig } from '../../../controllers/ActionController.js';
+import '../../../md/focus-ring/ui-focus-ring.js';
+import '../../../md/ripple/ui-ripple.js';
 export type AvatarType = 'button' | 'icon';
-export default class UserAvatar extends LitElement {
+export default class UserAvatar extends UiElement {
+    accessor ripple: UiRipple | null;
+    /**
+     * Whether the avatar is disabled.
+     * @attribute
+     */
+    accessor disabled: boolean;
     /**
      * Set with the user. The computed user initials.
+     * @attribute
      */
     protected accessor userInitials: string | undefined;
     /**
      * The URL to the user picture.
+     * @attribute
      */
     protected accessor userPicture: string | undefined;
     /**
@@ -21,7 +32,16 @@ export default class UserAvatar extends LitElement {
      * @attribute
      */
     accessor type: AvatarType;
+    constructor();
     protected willUpdate(cp: PropertyValues<this>): void;
+    beginPress(options: BeginPressConfig): void;
+    endPress(options: EndPressConfig): void;
+    handleKeyDown(e: KeyboardEvent): void;
+    handleKeyUp(e: KeyboardEvent): void;
+    handlePointerEnter(e: PointerEvent): void;
+    handlePointerLeave(e: PointerEvent): void;
+    handleClick(e: MouseEvent): void;
+    protected shouldHandleInteraction(): boolean;
     /**
      * Handles changes to the user property.
      * @param user The user object
@@ -43,5 +63,7 @@ export default class UserAvatar extends LitElement {
     protected nameTemplate(initials: string): TemplateResult;
     protected renderDefaultAvatar(): TemplateResult;
     protected defaultIcon(): SVGTemplateResult;
+    protected renderRipple(): TemplateResult;
+    protected renderFocusRing(): TemplateResult;
 }
 //# sourceMappingURL=UserAvatar.d.ts.map

package/build/src/elements/user/internals/UserAvatar.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"UserAvatar.d.ts","sourceRoot":"","sources":["../../../../../src/elements/user/internals/UserAvatar.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,cAAc,EAAE,~~UAAU,EAAE,~~cAAc,EAAE,iBAAiB,EAAO,MAAM,KAAK,CAAA;~~AAE9F~~,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,uCAAuC,CAAA;AAClE,OAAO,~~sCAAsC~~,CAAA;~~AAC7C~~,OAAO,~~gCAAgC~~,CAAA;~~AAEvC~~,MAAM,MAAM,UAAU,GAAG,QAAQ,GAAG,MAAM,CAAA;AAE1C,MAAM,CAAC,OAAO,OAAO,UAAW,SAAQ,~~UAAU~~;~~IAChD;;OAEG~~;IACM,SAAS,CAAC,QAAQ,CAAC,YAAY,EAAE,MAAM,GAAG,SAAS,CAAA;IAE5D~~;;OAEG~~;IACM,SAAS,CAAC,QAAQ,CAAC,WAAW,EAAE,MAAM,GAAG,SAAS,CAAA;IAE3D;;OAEG;IACyB,QAAQ,CAAC,IAAI,EAAE,KAAK,GAAG,SAAS,CAAA;IAC5D;;;OAGG;IACyB,QAAQ,CAAC,IAAI,EAAE,UAAU,CAAW;~~cAE7C~~,UAAU,CAAC,EAAE,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;~~IAO7D~~;;;OAGG;IACH,SAAS,CAAC,gBAAgB,CAAC,IAAI,CAAC,EAAE,KAAK,GAAG,IAAI;IAU9C,SAAS,CAAC,gBAAgB,CAAC,IAAI,EAAE,KAAK,GAAG,MAAM,GAAG,SAAS;IAc3D,SAAS,CAAC,kBAAkB,IAAI,IAAI;IAIpC;;OAEG;IACM,MAAM,IAAI,cAAc;IAgBjC,SAAS,CAAC,YAAY,CAAC,OAAO,EAAE,cAAc,GAAG,cAAc;~~IAW~~/D,SAAS,CAAC,UAAU,CAAC,OAAO,EAAE,cAAc,GAAG,cAAc;IAI7D,SAAS,CAAC,eAAe,CAAC,GAAG,EAAE,MAAM,GAAG,cAAc;IAWtD;;;OAGG;IACH,SAAS,CAAC,YAAY,CAAC,QAAQ,EAAE,MAAM,GAAG,cAAc;IAIxD,SAAS,CAAC,mBAAmB,IAAI,cAAc;IAI/C,SAAS,CAAC,WAAW,IAAI,iBAAiB;~~CAiB3C~~"}
1	+ {"version":3,"file":"UserAvatar.d.ts","sourceRoot":"","sources":["../../../../../src/elements/user/internals/UserAvatar.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,cAAc,EAAE,cAAc,EAAE,iBAAiB,EAAO,MAAM,KAAK,CAAA;AAElF,OAAO,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAA;AAEpD,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,uCAAuC,CAAA;AAClE,OAAO,KAAK,QAAQ,MAAM,wCAAwC,CAAA;AAClE,OAAO,KAAK,EAAE,gBAAgB,EAAE,cAAc,EAAE,MAAM,0CAA0C,CAAA;AAChG,OAAO,yCAAyC,CAAA;AAChD,OAAO,iCAAiC,CAAA;AAExC,MAAM,MAAM,UAAU,GAAG,QAAQ,GAAG,MAAM,CAAA;AAE1C,MAAM,CAAC,OAAO,OAAO,UAAW,SAAQ,SAAS;IAC3B,QAAQ,CAAC,MAAM,EAAE,QAAQ,GAAG,IAAI,CAAO;IAC3D;;;OAGG;IACyC,QAAQ,CAAC,QAAQ,UAAQ;IACrE;;;OAGG;IACM,SAAS,CAAC,QAAQ,CAAC,YAAY,EAAE,MAAM,GAAG,SAAS,CAAA;IAE5D;;;OAGG;IACM,SAAS,CAAC,QAAQ,CAAC,WAAW,EAAE,MAAM,GAAG,SAAS,CAAA;IAE3D;;OAEG;IACyB,QAAQ,CAAC,IAAI,EAAE,KAAK,GAAG,SAAS,CAAA;IAC5D;;;OAGG;IACyB,QAAQ,CAAC,IAAI,EAAE,UAAU,CAAW;;cAgB7C,UAAU,CAAC,EAAE,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAUpD,UAAU,CAAC,OAAO,EAAE,gBAAgB,GAAG,IAAI;IAQ3C,QAAQ,CAAC,OAAO,EAAE,cAAc,GAAG,IAAI;IAQvC,aAAa,CAAC,CAAC,EAAE,aAAa,GAAG,IAAI;IAWrC,WAAW,CAAC,CAAC,EAAE,aAAa,GAAG,IAAI;IAWnC,kBAAkB,CAAC,CAAC,EAAE,YAAY,GAAG,IAAI;IASzC,kBAAkB,CAAC,CAAC,EAAE,YAAY,GAAG,IAAI;IAWzC,WAAW,CAAC,CAAC,EAAE,UAAU,GAAG,IAAI;IAUzC,SAAS,CAAC,uBAAuB,IAAI,OAAO;IAI5C;;;OAGG;IACH,SAAS,CAAC,gBAAgB,CAAC,IAAI,CAAC,EAAE,KAAK,GAAG,IAAI;IAU9C,SAAS,CAAC,gBAAgB,CAAC,IAAI,EAAE,KAAK,GAAG,MAAM,GAAG,SAAS;IAc3D,SAAS,CAAC,kBAAkB,IAAI,IAAI;IAIpC;;OAEG;IACM,MAAM,IAAI,cAAc;IAgBjC,SAAS,CAAC,YAAY,CAAC,OAAO,EAAE,cAAc,GAAG,cAAc;IAS/D,SAAS,CAAC,UAAU,CAAC,OAAO,EAAE,cAAc,GAAG,cAAc;IAI7D,SAAS,CAAC,eAAe,CAAC,GAAG,EAAE,MAAM,GAAG,cAAc;IAWtD;;;OAGG;IACH,SAAS,CAAC,YAAY,CAAC,QAAQ,EAAE,MAAM,GAAG,cAAc;IAIxD,SAAS,CAAC,mBAAmB,IAAI,cAAc;IAI/C,SAAS,CAAC,WAAW,IAAI,iBAAiB;IAkB1C,SAAS,CAAC,YAAY,IAAI,cAAc;IAIxC,SAAS,CAAC,eAAe,IAAI,cAAc;CAG5C"}