@ui5/webcomponents 0.0.0-037d08c67

package/dist/TableSelectionBase.js

@@ -0,0 +1,142 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
+import { property, eventStrict } from "@ui5/webcomponents-base/dist/decorators.js";
+import { isInstanceOfTable } from "./TableUtils.js";
+import TableSelectionBehavior from "./types/TableSelectionBehavior.js";
+import { TABLE_MULTI_SELECTABLE, TABLE_SINGLE_SELECTABLE, } from "./generated/i18n/i18n-defaults.js";
+/**
+ * Fired when the selection is changed by user interaction.
+ *
+ * @public
+ */
+let TableSelectionBase = 
+/**
+ * @class
+ * The `TableSelectionBase` class serves as a foundation for table selections.
+ * @constructor
+ * @extends UI5Element
+ * @since 2.8.0
+ * @public
+ */
+class TableSelectionBase extends UI5Element {
+    constructor() {
+        super(...arguments);
+        /**
+         * Defines the selection behavior.
+         *
+         * @default "RowSelector"
+         * @public
+         * @since 2.11
+         */
+        this.behavior = "RowSelector";
+        this.identifier = "TableSelection";
+        this._rowsLength = 0;
+    }
+    onTableActivate(table) {
+        this._table = table;
+        this._invalidateTableAndRows();
+    }
+    onExitDOM() {
+        this._invalidateTableAndRows();
+        this._table = undefined;
+    }
+    onBeforeRendering() {
+        if (!this._table && this.parentElement && isInstanceOfTable(this.parentElement)) {
+            this._table = this.parentElement;
+        }
+        this._invalidateTableAndRows();
+    }
+    onTableBeforeRendering() {
+        if (this._table && this._table.headerRow[0] && this._rowsLength !== this._table.rows.length) {
+            this._rowsLength = this._table.rows.length;
+            this._table.headerRow[0]._invalidate++;
+        }
+    }
+    // this will be removed when the legacy selection component is removed
+    isSelectable() {
+        return true;
+    }
+    /**
+     * Determines if the component allows multiple selection.
+     */
+    isMultiSelectable() {
+        return false;
+    }
+    /**
+     * Determines whether a row selector (for example, `radiobutton` or `checkbox`) is rendered.
+     */
+    isRowSelectorRequired() {
+        return this.behavior === TableSelectionBehavior.RowSelector;
+    }
+    /**
+     * Returns the ARIA description of the Table as an alternative to aria-multiselectable.
+     */
+    getAriaDescriptionForTable() {
+        if (!this._table || !this._table.rows.length) {
+            return undefined;
+        }
+        const i18nBundle = this._table.constructor.i18nBundle;
+        return i18nBundle.getText(this.isMultiSelectable() ? TABLE_MULTI_SELECTABLE : TABLE_SINGLE_SELECTABLE);
+    }
+    /**
+     * Returns the ARIA description of the selection component displayed in the column header.
+     */
+    getAriaDescriptionForColumnHeader() {
+        return undefined;
+    }
+    /**
+     * Returns the unique key associated with the table row.
+     *
+     * @param row The row instance
+     */
+    getRowKey(row) {
+        return row.rowKey || "";
+    }
+    /**
+     * Returns the table row instance for the given row key.
+     *
+     * @param rowKey The row key
+     * @public
+     */
+    getRowByKey(rowKey) {
+        if (this._table && rowKey) {
+            return this._table.rows.find(row => this.getRowKey(row) === rowKey);
+        }
+    }
+    /**
+     * Invalidates the table and its rows to re-evaluate the selection.
+     */
+    _invalidateTableAndRows() {
+        if (this._table) {
+            this._table._invalidate++;
+            this._table.rows.forEach(row => row._invalidate++);
+            this._table.headerRow.forEach(row => row._invalidate++);
+        }
+    }
+};
+__decorate([
+    property()
+], TableSelectionBase.prototype, "selected", void 0);
+__decorate([
+    property()
+], TableSelectionBase.prototype, "behavior", void 0);
+TableSelectionBase = __decorate([
+    eventStrict("change", {
+        bubbles: false,
+    })
+    /**
+     * @class
+     * The `TableSelectionBase` class serves as a foundation for table selections.
+     * @constructor
+     * @extends UI5Element
+     * @since 2.8.0
+     * @public
+     */
+], TableSelectionBase);
+export default TableSelectionBase;
+//# sourceMappingURL=TableSelectionBase.js.map

package/dist/TableSelectionBase.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableSelectionBase.js","sourceRoot":"","sources":["../src/TableSelectionBase.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport { property, eventStrict } from \"@ui5/webcomponents-base/dist/decorators.js\";\nimport { isInstanceOfTable } from \"./TableUtils.js\";\nimport type Table from \"./Table.js\";\nimport type TableRowBase from \"./TableRowBase.js\";\nimport type TableRow from \"./TableRow.js\";\nimport type { ITableFeature } from \"./Table.js\";\nimport TableSelectionBehavior from \"./types/TableSelectionBehavior.js\";\nimport {\n\tTABLE_MULTI_SELECTABLE,\n\tTABLE_SINGLE_SELECTABLE,\n} from \"./generated/i18n/i18n-defaults.js\";\n\n/**\n * Fired when selection is changed by user interaction.\n *\n * @public\n */\ntype TableSelectionBaseChangeEventDetail = void;\n\n/**\n * Fired when the selection is changed by user interaction.\n *\n * @public\n */\n@eventStrict(\"change\", {\n\tbubbles: false,\n})\n\n/**\n * @class\n * The `TableSelectionBase` class serves as a foundation for table selections.\n * @constructor\n * @extends UI5Element\n * @since 2.8.0\n * @public\n */\nabstract class TableSelectionBase extends UI5Element implements ITableFeature {\n\teventDetails!: {\n\t\tchange: TableSelectionBaseChangeEventDetail,\n\t}\n\n\t/**\n\t * Defines the selected elements of the component.\n\t *\n\t * @default undefined\n\t * @public\n\t */\n\t@property()\n\tselected?: string;\n\n\t/**\n\t * Defines the selection behavior.\n\t *\n\t * @default \"RowSelector\"\n\t * @public\n\t * @since 2.11\n\t */\n\t@property()\n\tbehavior: `${TableSelectionBehavior}` = \"RowSelector\";\n\n\treadonly identifier = \"TableSelection\";\n\tprotected _table?: Table;\n\tprivate _rowsLength = 0;\n\n\tonTableActivate(table: Table) {\n\t\tthis._table = table;\n\t\tthis._invalidateTableAndRows();\n\t}\n\n\tonExitDOM() {\n\t\tthis._invalidateTableAndRows();\n\t\tthis._table = undefined;\n\t}\n\n\tonBeforeRendering() {\n\t\tif (!this._table && this.parentElement && isInstanceOfTable(this.parentElement)) {\n\t\t\tthis._table = this.parentElement;\n\t\t}\n\t\tthis._invalidateTableAndRows();\n\t}\n\n\tonTableBeforeRendering() {\n\t\tif (this._table && this._table.headerRow[0] && this._rowsLength !== this._table.rows.length) {\n\t\t\tthis._rowsLength = this._table.rows.length;\n\t\t\tthis._table.headerRow[0]._invalidate++;\n\t\t}\n\t}\n\n\t// this will be removed when the legacy selection component is removed\n\tisSelectable(): boolean {\n\t\treturn true;\n\t}\n\n\t/**\n\t * Determines if the component allows multiple selection.\n\t */\n\tisMultiSelectable(): boolean {\n\t\treturn false;\n\t}\n\n\t/**\n\t * Determines whether a row selector (for example, `radiobutton` or `checkbox`) is rendered.\n\t */\n\tisRowSelectorRequired(): boolean {\n\t\treturn this.behavior === TableSelectionBehavior.RowSelector;\n\t}\n\n\t/**\n\t * Returns the ARIA description of the Table as an alternative to aria-multiselectable.\n\t */\n\tgetAriaDescriptionForTable(): string | undefined {\n\t\tif (!this._table || !this._table.rows.length) {\n\t\t\treturn undefined;\n\t\t}\n\n\t\tconst i18nBundle = (this._table.constructor as typeof Table).i18nBundle;\n\t\treturn i18nBundle.getText(this.isMultiSelectable() ? TABLE_MULTI_SELECTABLE : TABLE_SINGLE_SELECTABLE);\n\t}\n\n\t/**\n\t * Returns the ARIA description of the selection component displayed in the column header.\n\t */\n\tgetAriaDescriptionForColumnHeader(): string | undefined {\n\t\treturn undefined;\n\t}\n\n\t/**\n\t * Returns the unique key associated with the table row.\n\t *\n\t * @param row The row instance\n\t */\n\tgetRowKey(row: TableRow): string {\n\t\treturn row.rowKey || \"\";\n\t}\n\n\t/**\n\t * Returns the table row instance for the given row key.\n\t *\n\t * @param rowKey The row key\n\t * @public\n\t */\n\tgetRowByKey(rowKey: string): TableRow | undefined {\n\t\tif (this._table && rowKey) {\n\t\t\treturn this._table.rows.find(row => this.getRowKey(row) === rowKey);\n\t\t}\n\t}\n\n\t/**\n\t * Determines whether the specified table row is currently selected.\n\t *\n\t * @param row The row instance\n\t */\n\tabstract isSelected(row: TableRowBase): boolean;\n\n\t/**\n\t * Sets the selected state of the specified table row.\n\t *\n\t * @param row The row instance\n\t * @param selected Whether the row is selected\n\t * @param fireEvent Whether the change event should be fired\n\t */\n\tabstract setSelected(row: TableRowBase, selected: boolean, fireEvent: boolean): void;\n\n\t/**\n\t * Invalidates the table and its rows to re-evaluate the selection.\n\t */\n\tprotected _invalidateTableAndRows() {\n\t\tif (this._table) {\n\t\t\tthis._table._invalidate++;\n\t\t\tthis._table.rows.forEach(row => row._invalidate++);\n\t\t\tthis._table.headerRow.forEach(row => row._invalidate++);\n\t\t}\n\t}\n}\n\nexport default TableSelectionBase;\n\nexport type {\n\tTableSelectionBaseChangeEventDetail,\n};\n"]}

package/dist/TableSelectionMulti.d.ts

@@ -0,0 +1,104 @@
+import TableSelectionBase from "./TableSelectionBase.js";
+import type TableRow from "./TableRow.js";
+import type TableRowBase from "./TableRowBase.js";
+import type TableSelectionMultiHeaderSelector from "./types/TableSelectionMultiHeaderSelector.js";
+/**
+ * @class
+ *
+ * ### Overview
+ *
+ * The `ui5-table-selection-multi` component is used inside the `ui5-table` to add multi-selection capabilities to the `ui5-table`.
+ * Since selection is key-based, each `ui5-table-row` must define a unique `row-key` property.
+ *
+ * ### Usage
+ *
+ * The `ui5-table-selection-multi` component is a feature designed exclusively for use within the `ui5-table` component.
+ * It must be placed inside the `features` slot of `ui5-table`.
+ * This component is not intended for standalone use.
+ *
+ * ```html
+ * <ui5-table>
+ * 	<ui5-table-selection-multi slot="features" selected="Row1 Row3"></ui5-table-selection-multi>
+ * </ui5-table>
+ * ```
+ *
+ * ### ES6 Module Import
+ *
+ * `import "@ui5/webcomponents/dist/TableSelectionMulti.js";`
+ *
+ * @constructor
+ * @extends TableSelectionBase
+ * @since 2.8.0
+ * @public
+ */
+declare class TableSelectionMulti extends TableSelectionBase {
+    /**
+     * Defines the `row-key` values of selected rows, with each value separated by a space.
+     *
+     * @default undefined
+     * @public
+     */
+    selected?: string;
+    /**
+     * Defines the selector of the header row.
+     *
+     * @default "SelectAll"
+     * @public
+     * @since 2.12
+     */
+    headerSelector: `${TableSelectionMultiHeaderSelector}`;
+    private _rangeSelection?;
+    _onClickCaptureBound: (e: MouseEvent) => void;
+    constructor();
+    onTableBeforeRendering(): void;
+    onTableAfterRendering(): void;
+    isMultiSelectable(): boolean;
+    isSelected(row: TableRowBase): boolean;
+    setSelected(row: TableRowBase, selected: boolean, fireEvent?: boolean): void;
+    /**
+     * Returns an array of the selected rows.
+     *
+     * @public
+     */
+    getSelectedRows(): TableRow[];
+    /**
+     * Determines whether all rows are selected.
+     */
+    areAllRowsSelected(): boolean;
+    /**
+     * Returns the `selected` property as a set of unique `row-key` values.
+     *
+     * @public
+     */
+    getSelectedAsSet(): Set<string>;
+    /**
+     * Sets the `selected` property using the provided set of unique `row-key` values.
+     *
+     * @param selectedSet A set of `row-key` values
+     * @public
+     */
+    setSelectedAsSet(selectedSet: Set<string>): void;
+    /**
+     * Returns the ARIA description of the selection component displayed in the column header.
+     */
+    getAriaDescriptionForColumnHeader(): string | undefined;
+    _onkeydown(e: KeyboardEvent): void;
+    _onkeyup(e: KeyboardEvent, eventOrigin: HTMLElement): void;
+    _onclickCapture(e: MouseEvent): void;
+    /**
+     * Start the range selection and initialises the range selection state
+     * @param row starting row
+     * @private
+     */
+    _startRangeSelection(row: TableRow, selected: boolean, isMouse?: boolean): void;
+    /**
+     * Handles the range selection
+     * @param targetRow Row that is currently focused
+     * @param change indicates direction
+     * @private
+     */
+    _handleRangeSelection(targetRow: TableRow, change: number): void;
+    _stopRangeSelection(): void;
+    _reverseRangeSelection(): void;
+}
+export default TableSelectionMulti;

package/dist/TableSelectionMulti.js

@@ -0,0 +1,292 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { customElement, property } from "@ui5/webcomponents-base/dist/decorators.js";
+import TableSelectionBase from "./TableSelectionBase.js";
+import getActiveElement from "@ui5/webcomponents-base/dist/util/getActiveElement.js";
+import { isSelectionCell, isHeaderSelectionCell, findRowInPath } from "./TableUtils.js";
+import { isUpShift } from "@ui5/webcomponents-base/dist/Keys.js";
+import { TABLE_COLUMNHEADER_SELECTALL_DESCRIPTION, TABLE_COLUMNHEADER_CLEARALL_DESCRIPTION, CHECKBOX_CHECKED, CHECKBOX_NOT_CHECKED, ACC_STATE_DISABLED, } from "./generated/i18n/i18n-defaults.js";
+/**
+ * @class
+ *
+ * ### Overview
+ *
+ * The `ui5-table-selection-multi` component is used inside the `ui5-table` to add multi-selection capabilities to the `ui5-table`.
+ * Since selection is key-based, each `ui5-table-row` must define a unique `row-key` property.
+ *
+ * ### Usage
+ *
+ * The `ui5-table-selection-multi` component is a feature designed exclusively for use within the `ui5-table` component.
+ * It must be placed inside the `features` slot of `ui5-table`.
+ * This component is not intended for standalone use.
+ *
+ * ```html
+ * <ui5-table>
+ * 	<ui5-table-selection-multi slot="features" selected="Row1 Row3"></ui5-table-selection-multi>
+ * </ui5-table>
+ * ```
+ *
+ * ### ES6 Module Import
+ *
+ * `import "@ui5/webcomponents/dist/TableSelectionMulti.js";`
+ *
+ * @constructor
+ * @extends TableSelectionBase
+ * @since 2.8.0
+ * @public
+ */
+let TableSelectionMulti = class TableSelectionMulti extends TableSelectionBase {
+    constructor() {
+        super();
+        /**
+         * Defines the selector of the header row.
+         *
+         * @default "SelectAll"
+         * @public
+         * @since 2.12
+         */
+        this.headerSelector = "SelectAll";
+        this._onClickCaptureBound = this._onclickCapture.bind(this);
+    }
+    onTableBeforeRendering() {
+        super.onTableBeforeRendering();
+        this._table?.removeEventListener("click", this._onClickCaptureBound);
+    }
+    onTableAfterRendering() {
+        this._table?.addEventListener("click", this._onClickCaptureBound, { capture: true });
+    }
+    isMultiSelectable() {
+        return true;
+    }
+    isSelected(row) {
+        if (row.isHeaderRow()) {
+            return this.headerSelector === "ClearAll" ? true : this.areAllRowsSelected();
+        }
+        const rowKey = this.getRowKey(row);
+        return this.getSelectedAsSet().has(rowKey);
+    }
+    setSelected(row, selected, fireEvent = false) {
+        if (this._rangeSelection?.isMouse && this._rangeSelection.shiftPressed) {
+            return;
+        }
+        const tableRows = row.isHeaderRow() ? this._table.rows : [row];
+        const selectedSet = this.getSelectedAsSet();
+        const selectionChanged = tableRows.reduce((selectedSetChanged, tableRow) => {
+            const rowKey = this.getRowKey(tableRow);
+            if (!rowKey) {
+                return selectedSetChanged;
+            }
+            const setSize = selectedSet.size;
+            selectedSet[selected ? "add" : "delete"](rowKey);
+            return selectedSetChanged || setSize !== selectedSet.size;
+        }, false);
+        if (selectionChanged) {
+            this.setSelectedAsSet(selectedSet);
+            fireEvent && this.fireDecoratorEvent("change");
+        }
+    }
+    /**
+     * Returns an array of the selected rows.
+     *
+     * @public
+     */
+    getSelectedRows() {
+        return this._table ? this._table.rows.filter(row => this.isSelected(row)) : [];
+    }
+    /**
+     * Determines whether all rows are selected.
+     */
+    areAllRowsSelected() {
+        if (!this._table || !this._table.rows.length) {
+            return false;
+        }
+        const selectedSet = this.getSelectedAsSet();
+        return this._table.rows.every(row => {
+            const rowKey = this.getRowKey(row);
+            return selectedSet.has(rowKey);
+        });
+    }
+    /**
+     * Returns the `selected` property as a set of unique `row-key` values.
+     *
+     * @public
+     */
+    getSelectedAsSet() {
+        const selected = this.selected || "";
+        const selectedArray = selected.split(" ").filter(String);
+        return new Set(selectedArray);
+    }
+    /**
+     * Sets the `selected` property using the provided set of unique `row-key` values.
+     *
+     * @param selectedSet A set of `row-key` values
+     * @public
+     */
+    setSelectedAsSet(selectedSet) {
+        this.selected = [...selectedSet].join(" ");
+    }
+    /**
+     * Returns the ARIA description of the selection component displayed in the column header.
+     */
+    getAriaDescriptionForColumnHeader() {
+        if (!this._table || !this._table.rows.length || this.behavior === "RowOnly") {
+            return undefined;
+        }
+        let description = "";
+        const seperator = " ";
+        const i18nBundle = this._table.constructor.i18nBundle;
+        if (this.headerSelector === "SelectAll") {
+            description = i18nBundle.getText(TABLE_COLUMNHEADER_SELECTALL_DESCRIPTION);
+            description += seperator + i18nBundle.getText(this.areAllRowsSelected() ? CHECKBOX_CHECKED : CHECKBOX_NOT_CHECKED);
+        }
+        else {
+            description = i18nBundle.getText(TABLE_COLUMNHEADER_CLEARALL_DESCRIPTION);
+            description += this.getSelectedRows().length === 0 ? seperator + i18nBundle.getText(ACC_STATE_DISABLED) : "";
+        }
+        return description;
+    }
+    _onkeydown(e) {
+        if (!this._table || !e.shiftKey) {
+            return;
+        }
+        const focusedElement = getActiveElement(); // Assumption: The focused element is always the "next" row after navigation.
+        if (!(focusedElement?.hasAttribute("ui5-table-row") || this._rangeSelection?.isMouse)) {
+            this._stopRangeSelection();
+            return;
+        }
+        if (!this._rangeSelection) {
+            // If no range selection is active, start one
+            const row = focusedElement;
+            this._startRangeSelection(row, this.isSelected(row));
+        }
+        else if (e.key === "ArrowUp" || e.key === "ArrowDown") {
+            const change = isUpShift(e) ? -1 : 1;
+            this._handleRangeSelection(focusedElement, change);
+        }
+        if (this._rangeSelection) {
+            this._rangeSelection.shiftPressed = e.shiftKey;
+        }
+    }
+    _onkeyup(e, eventOrigin) {
+        if (!this._table) {
+            return;
+        }
+        if (!eventOrigin.hasAttribute("ui5-table-row") || !this._rangeSelection || !e.shiftKey) {
+            // Stop range selection if a) Shift is relased or b) the event target is not a row
+            this._stopRangeSelection();
+        }
+        if (this._rangeSelection) {
+            this._rangeSelection.shiftPressed = e.shiftKey;
+        }
+    }
+    _onclickCapture(e) {
+        if (!this._table) {
+            return;
+        }
+        if (isHeaderSelectionCell(e)) {
+            this._stopRangeSelection();
+            return;
+        }
+        if (!isSelectionCell(e)) {
+            this._stopRangeSelection();
+            return;
+        }
+        const row = findRowInPath(e.composedPath());
+        if (e.shiftKey && this._rangeSelection?.isMouse) {
+            const startRow = this._rangeSelection.rows[0];
+            const startIndex = this._table.rows.indexOf(startRow);
+            const endIndex = this._table.rows.indexOf(row);
+            // Set checkbox to the selection state of the start row (if it is selected)
+            const selectionState = this.isSelected(startRow);
+            // When doing a range selection and clicking on an already selected row, the checked status should not change
+            // Therefore, we need to manually set the checked attribute again, as clicking it would deselect it and leads to
+            // a visual inconsistency.
+            row.shadowRoot?.querySelector("#selection-component")?.toggleAttribute("checked", selectionState);
+            e.stopPropagation();
+            if (startIndex === -1 || endIndex === -1 || row.rowKey === startRow.rowKey || row.rowKey === this._rangeSelection.rows[this._rangeSelection.rows.length - 1].rowKey) {
+                return;
+            }
+            const change = endIndex - startIndex;
+            this._handleRangeSelection(row, change);
+        }
+        else if (row) {
+            this._startRangeSelection(row, !this.isSelected(row), true);
+        }
+    }
+    /**
+     * Start the range selection and initialises the range selection state
+     * @param row starting row
+     * @private
+     */
+    _startRangeSelection(row, selected, isMouse = false) {
+        this._rangeSelection = {
+            selected,
+            isUp: null,
+            rows: [row],
+            isMouse,
+            shiftPressed: false,
+        };
+    }
+    /**
+     * Handles the range selection
+     * @param targetRow Row that is currently focused
+     * @param change indicates direction
+     * @private
+     */
+    _handleRangeSelection(targetRow, change) {
+        if (!this._rangeSelection) {
+            return;
+        }
+        const isUp = change > 0;
+        this._rangeSelection.isUp ??= isUp;
+        const shouldReverseSelection = isUp !== this._rangeSelection.isUp && !this._rangeSelection.isMouse;
+        let selectionChanged = shouldReverseSelection && this.isSelected(targetRow);
+        if (shouldReverseSelection) {
+            this._reverseRangeSelection();
+        }
+        else {
+            const rowIndex = this._table.rows.indexOf(targetRow);
+            const [startIndex, endIndex] = [rowIndex, rowIndex - change].sort((a, b) => a - b);
+            const selectedSet = this.getSelectedAsSet();
+            selectionChanged = this._table?.rows.slice(startIndex, endIndex + 1).reduce((changed, row) => {
+                const isRowNotInSelection = !this._rangeSelection?.rows.includes(row);
+                const isRowSelectionDifferent = this.isSelected(row) !== this._rangeSelection.selected;
+                if (isRowNotInSelection) {
+                    this._rangeSelection?.rows.push(row);
+                }
+                selectedSet[this._rangeSelection.selected ? "add" : "delete"](this.getRowKey(row));
+                return changed || isRowSelectionDifferent;
+            }, selectionChanged) || false;
+            this.setSelectedAsSet(selectedSet);
+        }
+        selectionChanged && this.fireDecoratorEvent("change");
+    }
+    _stopRangeSelection() {
+        this._rangeSelection = null;
+    }
+    _reverseRangeSelection() {
+        const row = this._rangeSelection?.rows.pop();
+        if (row) {
+            this.setSelected(row, false);
+        }
+        if (this._rangeSelection?.rows.length === 1) {
+            this._rangeSelection.isUp = null;
+        }
+    }
+};
+__decorate([
+    property()
+], TableSelectionMulti.prototype, "selected", void 0);
+__decorate([
+    property()
+], TableSelectionMulti.prototype, "headerSelector", void 0);
+TableSelectionMulti = __decorate([
+    customElement({ tag: "ui5-table-selection-multi" })
+], TableSelectionMulti);
+TableSelectionMulti.define();
+export default TableSelectionMulti;
+//# sourceMappingURL=TableSelectionMulti.js.map

package/dist/TableSelectionMulti.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableSelectionMulti.js","sourceRoot":"","sources":["../src/TableSelectionMulti.ts"],"names":[],"mappings":"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","sourcesContent":["import { customElement, property } from \"@ui5/webcomponents-base/dist/decorators.js\";\nimport TableSelectionBase from \"./TableSelectionBase.js\";\nimport getActiveElement from \"@ui5/webcomponents-base/dist/util/getActiveElement.js\";\nimport { isSelectionCell, isHeaderSelectionCell, findRowInPath } from \"./TableUtils.js\";\nimport { isUpShift } from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport type Table from \"./Table.js\";\nimport type TableRow from \"./TableRow.js\";\nimport type TableRowBase from \"./TableRowBase.js\";\nimport type TableSelectionMultiHeaderSelector from \"./types/TableSelectionMultiHeaderSelector.js\";\nimport {\n\tTABLE_COLUMNHEADER_SELECTALL_DESCRIPTION,\n\tTABLE_COLUMNHEADER_CLEARALL_DESCRIPTION,\n\tCHECKBOX_CHECKED,\n\tCHECKBOX_NOT_CHECKED,\n\tACC_STATE_DISABLED,\n} from \"./generated/i18n/i18n-defaults.js\";\n\n/**\n * @class\n *\n * ### Overview\n *\n * The `ui5-table-selection-multi` component is used inside the `ui5-table` to add multi-selection capabilities to the `ui5-table`.\n * Since selection is key-based, each `ui5-table-row` must define a unique `row-key` property.\n *\n * ### Usage\n *\n * The `ui5-table-selection-multi` component is a feature designed exclusively for use within the `ui5-table` component.\n * It must be placed inside the `features` slot of `ui5-table`.\n * This component is not intended for standalone use.\n *\n * ```html\n * <ui5-table>\n * \t<ui5-table-selection-multi slot=\"features\" selected=\"Row1 Row3\"></ui5-table-selection-multi>\n * </ui5-table>\n * ```\n *\n * ### ES6 Module Import\n *\n * `import \"@ui5/webcomponents/dist/TableSelectionMulti.js\";`\n *\n * @constructor\n * @extends TableSelectionBase\n * @since 2.8.0\n * @public\n */\n@customElement({ tag: \"ui5-table-selection-multi\" })\n\nclass TableSelectionMulti extends TableSelectionBase {\n\t/**\n\t * Defines the `row-key` values of selected rows, with each value separated by a space.\n\t *\n\t * @default undefined\n\t * @public\n\t */\n\t@property()\n\tselected?: string;\n\n\t/**\n\t * Defines the selector of the header row.\n\t *\n\t * @default \"SelectAll\"\n\t * @public\n\t * @since 2.12\n\t */\n\t@property()\n\theaderSelector: `${TableSelectionMultiHeaderSelector}` = \"SelectAll\";\n\n\tprivate _rangeSelection?: {\n\t\tselected: boolean,\n\t\tisUp: boolean | null,\n\t\trows: TableRow[],\n\t\tisMouse: boolean,\n\t\tshiftPressed: boolean\n\t} | null;\n\n\t_onClickCaptureBound: (e: MouseEvent) => void;\n\n\tconstructor() {\n\t\tsuper();\n\t\tthis._onClickCaptureBound = this._onclickCapture.bind(this);\n\t}\n\n\tonTableBeforeRendering() {\n\t\tsuper.onTableBeforeRendering();\n\t\tthis._table?.removeEventListener(\"click\", this._onClickCaptureBound);\n\t}\n\n\tonTableAfterRendering() {\n\t\tthis._table?.addEventListener(\"click\", this._onClickCaptureBound, { capture: true });\n\t}\n\n\tisMultiSelectable(): boolean {\n\t\treturn true;\n\t}\n\n\tisSelected(row: TableRowBase): boolean {\n\t\tif (row.isHeaderRow()) {\n\t\t\treturn this.headerSelector === \"ClearAll\" ? true : this.areAllRowsSelected();\n\t\t}\n\n\t\tconst rowKey = this.getRowKey(row as TableRow);\n\t\treturn this.getSelectedAsSet().has(rowKey);\n\t}\n\n\tsetSelected(row: TableRowBase, selected: boolean, fireEvent: boolean = false) {\n\t\tif (this._rangeSelection?.isMouse && this._rangeSelection.shiftPressed) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst tableRows = row.isHeaderRow() ? this._table!.rows : [row as TableRow];\n\t\tconst selectedSet = this.getSelectedAsSet();\n\t\tconst selectionChanged = tableRows.reduce((selectedSetChanged, tableRow) => {\n\t\t\tconst rowKey = this.getRowKey(tableRow);\n\t\t\tif (!rowKey) {\n\t\t\t\treturn selectedSetChanged;\n\t\t\t}\n\n\t\t\tconst setSize = selectedSet.size;\n\t\t\tselectedSet[selected ? \"add\" : \"delete\"](rowKey);\n\t\t\treturn selectedSetChanged || setSize !== selectedSet.size;\n\t\t}, false);\n\n\t\tif (selectionChanged) {\n\t\t\tthis.setSelectedAsSet(selectedSet);\n\t\t\tfireEvent && this.fireDecoratorEvent(\"change\");\n\t\t}\n\t}\n\n\t/**\n\t * Returns an array of the selected rows.\n\t *\n\t * @public\n\t */\n\tgetSelectedRows(): TableRow[] {\n\t\treturn this._table ? this._table.rows.filter(row => this.isSelected(row)) : [];\n\t}\n\n\t/**\n\t * Determines whether all rows are selected.\n\t */\n\tareAllRowsSelected(): boolean {\n\t\tif (!this._table || !this._table.rows.length) {\n\t\t\treturn false;\n\t\t}\n\n\t\tconst selectedSet = this.getSelectedAsSet();\n\t\treturn this._table.rows.every(row => {\n\t\t\tconst rowKey = this.getRowKey(row);\n\t\t\treturn selectedSet.has(rowKey);\n\t\t});\n\t}\n\n\t/**\n\t * Returns the `selected` property as a set of unique `row-key` values.\n\t *\n\t * @public\n\t */\n\tgetSelectedAsSet(): Set<string> {\n\t\tconst selected = this.selected || \"\";\n\t\tconst selectedArray = selected.split(\" \").filter(String);\n\t\treturn new Set(selectedArray);\n\t}\n\n\t/**\n\t * Sets the `selected` property using the provided set of unique `row-key` values.\n\t *\n\t * @param selectedSet A set of `row-key` values\n\t * @public\n\t */\n\tsetSelectedAsSet(selectedSet: Set<string>): void {\n\t\tthis.selected = [...selectedSet].join(\" \");\n\t}\n\n\t/**\n\t * Returns the ARIA description of the selection component displayed in the column header.\n\t */\n\tgetAriaDescriptionForColumnHeader(): string | undefined {\n\t\tif (!this._table || !this._table.rows.length || this.behavior === \"RowOnly\") {\n\t\t\treturn undefined;\n\t\t}\n\n\t\tlet description = \"\";\n\t\tconst seperator = \" \";\n\t\tconst i18nBundle = (this._table.constructor as typeof Table).i18nBundle;\n\t\tif (this.headerSelector === \"SelectAll\") {\n\t\t\tdescription = i18nBundle.getText(TABLE_COLUMNHEADER_SELECTALL_DESCRIPTION);\n\t\t\tdescription += seperator + i18nBundle.getText(this.areAllRowsSelected() ? CHECKBOX_CHECKED : CHECKBOX_NOT_CHECKED);\n\t\t} else {\n\t\t\tdescription = i18nBundle.getText(TABLE_COLUMNHEADER_CLEARALL_DESCRIPTION);\n\t\t\tdescription += this.getSelectedRows().length === 0 ? seperator + i18nBundle.getText(ACC_STATE_DISABLED) : \"\";\n\t\t}\n\t\treturn description;\n\t}\n\n\t_onkeydown(e: KeyboardEvent) {\n\t\tif (!this._table || !e.shiftKey) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst focusedElement = getActiveElement(); // Assumption: The focused element is always the \"next\" row after navigation.\n\n\t\tif (!(focusedElement?.hasAttribute(\"ui5-table-row\") || this._rangeSelection?.isMouse)) {\n\t\t\tthis._stopRangeSelection();\n\t\t\treturn;\n\t\t}\n\n\t\tif (!this._rangeSelection) {\n\t\t\t// If no range selection is active, start one\n\t\t\tconst row = focusedElement as TableRow;\n\t\t\tthis._startRangeSelection(row, this.isSelected(row));\n\t\t} else if (e.key === \"ArrowUp\" || e.key === \"ArrowDown\") {\n\t\t\tconst change = isUpShift(e) ? -1 : 1;\n\t\t\tthis._handleRangeSelection(focusedElement as TableRow, change);\n\t\t}\n\n\t\tif (this._rangeSelection) {\n\t\t\tthis._rangeSelection.shiftPressed = e.shiftKey;\n\t\t}\n\t}\n\n\t_onkeyup(e: KeyboardEvent, eventOrigin: HTMLElement) {\n\t\tif (!this._table) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (!eventOrigin.hasAttribute(\"ui5-table-row\") || !this._rangeSelection || !e.shiftKey) {\n\t\t\t// Stop range selection if a) Shift is relased or b) the event target is not a row\n\t\t\tthis._stopRangeSelection();\n\t\t}\n\n\t\tif (this._rangeSelection) {\n\t\t\tthis._rangeSelection.shiftPressed = e.shiftKey;\n\t\t}\n\t}\n\n\t_onclickCapture(e: MouseEvent) {\n\t\tif (!this._table) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (isHeaderSelectionCell(e)) {\n\t\t\tthis._stopRangeSelection();\n\t\t\treturn;\n\t\t}\n\n\t\tif (!isSelectionCell(e)) {\n\t\t\tthis._stopRangeSelection();\n\t\t\treturn;\n\t\t}\n\n\t\tconst row = findRowInPath(e.composedPath());\n\n\t\tif (e.shiftKey && this._rangeSelection?.isMouse) {\n\t\t\tconst startRow = this._rangeSelection.rows[0];\n\t\t\tconst startIndex = this._table.rows.indexOf(startRow);\n\t\t\tconst endIndex = this._table.rows.indexOf(row);\n\n\t\t\t// Set checkbox to the selection state of the start row (if it is selected)\n\t\t\tconst selectionState = this.isSelected(startRow);\n\n\t\t\t// When doing a range selection and clicking on an already selected row, the checked status should not change\n\t\t\t// Therefore, we need to manually set the checked attribute again, as clicking it would deselect it and leads to\n\t\t\t// a visual inconsistency.\n\t\t\trow.shadowRoot?.querySelector(\"#selection-component\")?.toggleAttribute(\"checked\", selectionState);\n\t\t\te.stopPropagation();\n\n\t\t\tif (startIndex === -1 || endIndex === -1 || row.rowKey === startRow.rowKey || row.rowKey === this._rangeSelection.rows[this._rangeSelection.rows.length - 1].rowKey) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst change = endIndex - startIndex;\n\t\t\tthis._handleRangeSelection(row, change);\n\t\t} else if (row) {\n\t\t\tthis._startRangeSelection(row, !this.isSelected(row), true);\n\t\t}\n\t}\n\n\t/**\n\t * Start the range selection and initialises the range selection state\n\t * @param row starting row\n\t * @private\n\t */\n\t_startRangeSelection(row: TableRow, selected: boolean, isMouse = false) {\n\t\tthis._rangeSelection = {\n\t\t\tselected,\n\t\t\tisUp: null,\n\t\t\trows: [row],\n\t\t\tisMouse,\n\t\t\tshiftPressed: false,\n\t\t};\n\t}\n\n\t/**\n\t * Handles the range selection\n\t * @param targetRow Row that is currently focused\n\t * @param change indicates direction\n\t * @private\n\t */\n\t_handleRangeSelection(targetRow: TableRow, change: number) {\n\t\tif (!this._rangeSelection) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst isUp = change > 0;\n\t\tthis._rangeSelection.isUp ??= isUp;\n\n\t\tconst shouldReverseSelection = isUp !== this._rangeSelection.isUp && !this._rangeSelection.isMouse;\n\t\tlet selectionChanged = shouldReverseSelection && this.isSelected(targetRow);\n\n\t\tif (shouldReverseSelection) {\n\t\t\tthis._reverseRangeSelection();\n\t\t} else {\n\t\t\tconst rowIndex = this._table!.rows.indexOf(targetRow);\n\t\t\tconst [startIndex, endIndex] = [rowIndex, rowIndex - change].sort((a, b) => a - b);\n\t\t\tconst selectedSet = this.getSelectedAsSet();\n\n\t\t\tselectionChanged = this._table?.rows.slice(startIndex, endIndex + 1).reduce((changed, row) => {\n\t\t\t\tconst isRowNotInSelection = !this._rangeSelection?.rows.includes(row);\n\t\t\t\tconst isRowSelectionDifferent = this.isSelected(row) !== this._rangeSelection!.selected;\n\n\t\t\t\tif (isRowNotInSelection) {\n\t\t\t\t\tthis._rangeSelection?.rows.push(row);\n\t\t\t\t}\n\n\t\t\t\tselectedSet[this._rangeSelection!.selected ? \"add\" : \"delete\"](this.getRowKey(row));\n\n\t\t\t\treturn changed || isRowSelectionDifferent;\n\t\t\t}, selectionChanged) || false;\n\n\t\t\tthis.setSelectedAsSet(selectedSet);\n\t\t}\n\n\t\tselectionChanged && this.fireDecoratorEvent(\"change\");\n\t}\n\n\t_stopRangeSelection() {\n\t\tthis._rangeSelection = null;\n\t}\n\n\t_reverseRangeSelection() {\n\t\tconst row = this._rangeSelection?.rows.pop();\n\t\tif (row) {\n\t\t\tthis.setSelected(row, false);\n\t\t}\n\n\t\tif (this._rangeSelection?.rows.length === 1) {\n\t\t\tthis._rangeSelection.isUp = null;\n\t\t}\n\t}\n}\n\nTableSelectionMulti.define();\n\nexport default TableSelectionMulti;\n"]}

package/dist/TableSelectionSingle.d.ts

@@ -0,0 +1,49 @@
+import TableSelectionBase from "./TableSelectionBase.js";
+import type TableRow from "./TableRow.js";
+/**
+ * @class
+ *
+ * ### Overview
+ *
+ * The `ui5-table-selection-single` component is used inside the `ui5-table` to add single selection capabilities to the `ui5-table`.
+ * Since selection is key-based, each `ui5-table-row` must define a unique `row-key` property.
+ *
+ * ### Usage
+ *
+ * The `ui5-table-selection-single` component is a feature designed exclusively for use within the `ui5-table` component.
+ * It must be placed inside the `features` slot of `ui5-table`.
+ * This component is not intended for standalone use.
+ *
+ * ```html
+ * <ui5-table>
+ * 	<ui5-table-selection-single slot="features" selected="Row1"></ui5-table-selection-single>
+ * </ui5-table>
+ * ```
+ *
+ * ### ES6 Module Import
+ *
+ * `import "@ui5/webcomponents/dist/TableSelectionSingle.js";`
+ *
+ * @constructor
+ * @extends TableSelectionBase
+ * @since 2.8.0
+ * @public
+ */
+declare class TableSelectionSingle extends TableSelectionBase {
+    /**
+     * Defines the `row-key` value of the selected row.
+     *
+     * @default undefined
+     * @public
+     */
+    selected?: string;
+    isSelected(row: TableRow): boolean;
+    setSelected(row: TableRow, selected: boolean, fireEvent?: boolean): void;
+    /**
+     * Returns the selected row.
+     *
+     * @public
+     */
+    getSelectedRow(): TableRow | undefined;
+}
+export default TableSelectionSingle;