@ui5/webcomponents 1.8.0 → 1.9.1

package/dist/TableRow.js

@@ -14,7 +14,11 @@ import CheckBox from "./CheckBox.js";
 import TableMode from "./types/TableMode.js";
 import TableRowType from "./types/TableRowType.js";
 import TableRowTemplate from "./generated/templates/TableRowTemplate.lit.js";
-import { ARIA_LABEL_ROW_SELECTION } from "./generated/i18n/i18n-defaults.js";
+import {
+	ARIA_LABEL_ROW_SELECTION,
+	LIST_ITEM_NOT_SELECTED,
+	LIST_ITEM_SELECTED,
+} from "./generated/i18n/i18n-defaults.js";
 
 // Styles
 import styles from "./generated/themes/TableRow.css.js";
@@ -44,7 +48,7 @@ const metadata = {
 	properties: /** @lends sap.ui.webcomponents.main.TableRow.prototype */ {
 		/**
 		 * Defines the mode of the row (None, SingleSelect, MultiSelect).
-		 * @type {TableMode}
+		 * @type {sap.ui.webcomponents.main.types.TableMode}
 		 * @defaultvalue "None"
 		 * @since 1.0.0-rc.15
 		 * @private
@@ -65,7 +69,7 @@ const metadata = {
 		 * <b>Note:</b> When set to <code>Active</code>, the item will provide visual response upon press,
 		 * while with type <code>Inactive</code> - will not.
 		 *
-		 * @type {TableRowType}
+		 * @type {sap.ui.webcomponents.main.types.TableRowType}
 		 * @defaultvalue "Inactive"
 		 * @since 1.0.0-rc.15
 		 * @public
@@ -98,7 +102,17 @@ const metadata = {
 		active: {
 			type: Boolean,
 		},
-
+		/**
+		 * Indicates if the table row is navigated.
+		 *
+		 * @type {boolean}
+		 * @defaultvalue false
+		 * @since 1.9.0
+		 * @public
+		*/
+		navigated: {
+			type: Boolean,
+		},
 		_columnsInfo: {
 			type: Object,
 			multiple: true,
@@ -215,8 +229,11 @@ class TableRow extends UI5Element {
 		const itemSelectable = isSingleSelect || this.isMultiSelect;
 		const isRowFocused = this._activeElementHasAttribute("ui5-table-row");
 		const checkboxPressed = event.target.classList.contains("ui5-multi-select-checkbox");
+		const rowElements = Array.from(this.shadowRoot.querySelectorAll("tr") || []);
+		const elements = rowElements.map(getLastTabbableElement);
+		const lastFocusableElement = elements.pop();
 
-		if (isTabNext(event) && activeElement === (getLastTabbableElement(this) || this.root)) {
+		if (isTabNext(event) && activeElement === (lastFocusableElement || this.root)) {
 			this.fireEvent("_forward-after", { target: activeElement });
 		}
 
@@ -307,6 +324,10 @@ class TableRow extends UI5Element {
 		return this.getRootNode().activeElement.hasAttribute(attr);
 	}
 
+	get _ariaCurrent() {
+		return this.navigated ? true : undefined;
+	}
+
 	activate() {
 		if (this.type === TableRowType.Active) {
 			this.active = true;
@@ -384,11 +405,18 @@ class TableRow extends UI5Element {
 	}
 
 	get ariaLabelText() {
+		const isSelected = this.selected ? TableRow.i18nBundle.getText(LIST_ITEM_SELECTED) : TableRow.i18nBundle.getText(LIST_ITEM_NOT_SELECTED);
+		const isRowSelectable = this.isSingleSelect || this.isMultiSelect;
 		const ariaLabel = this.cells.map((cell, index) => {
 			const columText = this.getColumnTextByIdx(index);
 			const cellText = this.getCellText(cell);
 			return `${columText} ${cellText}`;
 		}).join(" ");
+
+		if (isRowSelectable) {
+			return `${ariaLabel}. ${this._ariaPosition}. ${isSelected}`;
+		}
+
 		return `${ariaLabel}. ${this._ariaPosition}`;
 	}
 

package/dist/TextArea.js

@@ -120,7 +120,7 @@ const metadata = {
 		 * <b>Note:</b> If <code>maxlength</code> property is set,
 		 * the component turns into "Warning" state once the characters exceeds the limit.
 		 * In this case, only the "Error" state is considered and can be applied.
-		 * @type {ValueState}
+		 * @type {sap.ui.webcomponents.base.types.ValueState}
 		 * @defaultvalue "None"
 		 * @since 1.0.0-rc.7
 		 * @public
@@ -140,7 +140,7 @@ const metadata = {
 		 * <li>The CSS <code>height</code> property wins over the <code>rows</code> property, if both are set.</li>
 		 * </ul>
 		 *
-		 * @type {Integer}
+		 * @type {sap.ui.webcomponents.base.types.Integer}
 		 * @defaultvalue 0
 		 * @public
 		 */
@@ -152,7 +152,7 @@ const metadata = {
 		/**
 		 * Defines the maximum number of characters that the <code>value</code> can have.
 		 *
-		 * @type {Integer}
+		 * @type {sap.ui.webcomponents.base.types.Integer}
 		 * @defaultValue null
 		 * @public
 		 */
@@ -193,7 +193,7 @@ const metadata = {
 		/**
 		 * Defines the maximum number of lines that the component can grow.
 		 *
-		 * @type {Integer}
+		 * @type {sap.ui.webcomponents.base.types.Integer}
 		 * @defaultvalue 0
 		 * @public
 		 */

package/dist/TimePicker.js

@@ -108,7 +108,7 @@ const metadata = {
  * @constructor
  * @author SAP SE
  * @alias sap.ui.webcomponents.main.TimePicker
- * @extends TimePickerBase
+ * @extends sap.ui.webcomponents.main.TimePickerBase
  * @tagname ui5-time-picker
  * @public
  * @since 1.0.0-rc.6
@@ -138,7 +138,7 @@ class TimePicker extends TimePickerBase {
 	 * Currently selected time represented as JavaScript Date instance
 	 *
 	 * @readonly
-	 * @type { Date }
+	 * @type {Date}
 	 * @public
 	 */
 	get dateValue() {

package/dist/TimePickerBase.js

@@ -50,6 +50,8 @@ const metadata = {
 		 *
 		 * @type {string}
 		 * @defaultvalue undefined
+		 * @formEvents change input
+		 * @formProperty
 		 * @public
 		 */
 		value: {
@@ -69,7 +71,7 @@ const metadata = {
 		 * <li><code>Information</code></li>
 		 * </ul>
 		 *
-		 * @type {ValueState}
+		 * @type {sap.ui.webcomponents.base.types.ValueState}
 		 * @defaultvalue "None"
 		 * @public
 		 */
@@ -151,7 +153,7 @@ const metadata = {
  * @constructor
  * @author SAP SE
  * @alias sap.ui.webcomponents.main.TimePickerBase
- * @extends UI5Element
+ * @extends sap.ui.webcomponents.base.UI5Element
  * @public
  * @since 1.0.0-rc.6
  */

package/dist/TimeSelection.js

@@ -160,7 +160,7 @@ const metadata = {
  * @constructor
  * @author SAP SE
  * @alias sap.ui.webcomponents.main.TimeSelection
- * @extends UI5Element
+ * @extends sap.ui.webcomponents.base.UI5Element
  * @tagname ui5-time-selection
  * @private
  * @since 1.0.0-rc.12

package/dist/Title.js

@@ -24,7 +24,7 @@ const metadata = {
 		 * <li><code>Normal</code> - The text will wrap. The words will not be broken based on hyphenation.</li>
 		 * </ul>
 		 *
-		 * @type {WrappingType}
+		 * @type {sap.ui.webcomponents.main.types.WrappingType}
 		 * @defaultvalue "None"
 		 * @public
 		 */
@@ -37,7 +37,7 @@ const metadata = {
 		 * Defines the component level.
 		 * Available options are: <code>"H6"</code> to <code>"H1"</code>.
 		 *
-		 * @type {TitleLevel}
+		 * @type {sap.ui.webcomponents.main.types.TitleLevel}
 		 * @defaultvalue "H2"
 		 * @public
 		*/

package/dist/Toast.js

@@ -28,7 +28,7 @@ const metadata = {
 		 * <b>Note:</b> The minimum supported value is <code>500</code> ms
 		 * and even if a lower value is set, the duration would remain <code>500</code> ms.
 		 *
-		 * @type {Integer}
+		 * @type {sap.ui.webcomponents.base.types.Integer}
 		 * @defaultvalue 3000
 		 * @public
 		 */
@@ -53,7 +53,7 @@ const metadata = {
 		 * <li><code>BottomEnd</code></li>
 		 * </ul>
 		 *
-		 * @type {ToastPlacement}
+		 * @type {sap.ui.webcomponents.main.types.ToastPlacement}
 		 * @defaultvalue "BottomCenter"
 		 * @public
 		 */
@@ -137,7 +137,7 @@ const metadata = {
  * @constructor
  * @author SAP SE
  * @alias sap.ui.webcomponents.main.Toast
- * @extends UI5Element
+ * @extends sap.ui.webcomponents.base.UI5Element
  * @tagname ui5-toast
  * @public
  * @since 1.0.0-rc.6

package/dist/ToggleButton.js

@@ -47,7 +47,7 @@ const metadata = {
  * @constructor
  * @author SAP SE
  * @alias sap.ui.webcomponents.main.ToggleButton
- * @extends Button
+ * @extends sap.ui.webcomponents.main.Button
  * @tagname ui5-toggle-button
  * @public
  */

package/dist/Tokenizer.js

@@ -96,7 +96,7 @@ const metadata = {
 		/**
 		 * Indicates the value state of the related input component.
 		 *
-		 * @type {ValueState}
+		 * @type {sap.ui.webcomponents.base.types.ValueState}
 		 * @defaultvalue "None"
 		 * @private
 		 */
@@ -132,7 +132,7 @@ const metadata = {
  * @constructor
  * @author SAP SE
  * @alias sap.ui.webcomponents.main.Tokenizer
- * @extends UI5Element
+ * @extends sap.ui.webcomponents.base.UI5Element
  * @tagname ui5-tokenizer
  * @usestextcontent
  * @private

package/dist/Tree.js

@@ -35,7 +35,7 @@ const metadata = {
 		 * </ul>
 		 *
 		 * @public
-		 * @type {ListMode}
+		 * @type {sap.ui.webcomponents.main.types.ListMode}
 		 * @defaultValue "None"
 		 */
 		mode: {
@@ -307,7 +307,7 @@ const metadata = {
  * @constructor
  * @author SAP SE
  * @alias sap.ui.webcomponents.main.Tree
- * @extends UI5Element
+ * @extends sap.ui.webcomponents.base.UI5Element
  * @tagname ui5-tree
  * @appenddocs TreeItem
  * @public

package/dist/TreeItem.js

@@ -103,7 +103,7 @@ const metadata = {
 		 * Defines the state of the <code>additionalText</code>.
 		 * <br>
 		 * Available options are: <code>"None"</code> (by default), <code>"Success"</code>, <code>"Warning"</code>, <code>"Information"</code> and <code>"Error"</code>.
-		 * @type {ValueState}
+		 * @type {sap.ui.webcomponents.base.types.ValueState}
 		 * @defaultvalue "None"
 		 * @public
 		 * @since 1.0.0-rc.15
@@ -172,7 +172,7 @@ const metadata = {
  * @constructor
  * @author SAP SE
  * @alias sap.ui.webcomponents.main.TreeItem
- * @extends UI5Element
+ * @extends sap.ui.webcomponents.base.UI5Element
  * @tagname ui5-tree-item
  * @public
  * @implements sap.ui.webcomponents.main.ITreeItem

package/dist/TreeListItem.js

@@ -29,7 +29,7 @@ const metadata = {
 		/**
 		 * Defines the indentation of the tree list item. Use level 1 for tree list items, representing top-level tree nodes.
 		 *
-		 * @type {Integer}
+		 * @type {sap.ui.webcomponents.base.types.Integer}
 		 * @public
 		 * @defaultValue 1
 		 */
@@ -93,7 +93,7 @@ const metadata = {
 		 * Defines the state of the <code>additionalText</code>.
 		 * <br>
 		 * Available options are: <code>"None"</code> (by default), <code>"Success"</code>, <code>"Warning"</code>, <code>"Information"</code> and <code>"Error"</code>.
-		 * @type {ValueState}
+		 * @type {sap.ui.webcomponents.base.types.ValueState}
 		 * @defaultvalue "None"
 		 * @public
 		 * @since 1.0.0-rc.15
@@ -233,7 +233,7 @@ const metadata = {
  * @constructor
  * @author SAP SE
  * @alias sap.ui.webcomponents.main.TreeListItem
- * @extends ListItem
+ * @extends sap.ui.webcomponents.main.ListItem
  * @tagname ui5-li-tree
  * @public
  * @since 1.0.0-rc.8

package/dist/WheelSlider.js

@@ -134,7 +134,7 @@ const CELL_SIZE_COZY = 46;
  * @constructor
  * @author SAP SE
  * @alias sap.ui.webcomponents.main.WheelSlider
- * @extends UI5Element
+ * @extends sap.ui.webcomponents.base.UI5Element
  * @tagname ui5-wheelslider
  * @public
  * @since 1.0.0-rc.6

package/dist/YearPicker.js

@@ -30,7 +30,7 @@ const metadata = {
 	properties: /** @lends sap.ui.webcomponents.main.YearPicker.prototype */ {
 		/**
 		 * An array of UTC timestamps representing the selected date or dates depending on the capabilities of the picker component.
-		 * @type {Array}
+		 * @type {array}
 		 * @public
 		 */
 		selectedDates: {
@@ -74,7 +74,7 @@ const metadata = {
  * @constructor
  * @author SAP SE
  * @alias sap.ui.webcomponents.main.YearPicker
- * @extends CalendarPart
+ * @extends sap.ui.webcomponents.main.CalendarPart
  * @tagname ui5-yearpicker
  * @public
  */