@openui5/sap.ui.webc.main 1.98.0 → 1.99.0

package/src/sap/ui/webc/main/Select.js

@@ -38,7 +38,7 @@ sap.ui.define([
 	 * </ul> <br>
 	 *
 	 * @author SAP SE
-	 * @version 1.98.0
+	 * @version 1.99.0
 	 *
 	 * @constructor
 	 * @public
@@ -60,14 +60,6 @@ sap.ui.define([
 					type: "string"
 				},
 
-				/**
-				 * Receives id(or many ids) of the elements that label the select.
-				 */
-				accessibleNameRef: {
-					type: "string",
-					defaultValue: ""
-				},
-
 				/**
 				 * Defines whether the component is in disabled state. <br>
 				 * <br>
@@ -131,6 +123,15 @@ sap.ui.define([
 						type: "slot",
 						to: "div"
 					}
+				},
+
+				/**
+				 * Defines the width of the control
+				 */
+				width: {
+					type: "sap.ui.core.CSSSize",
+					defaultValue: null,
+					mapping: "style"
 				}
 			},
 			defaultAggregation: "options",
@@ -152,6 +153,21 @@ sap.ui.define([
 					multiple: true
 				}
 			},
+			associations: {
+
+				/**
+				 * Receives id(or many ids) of the controls that label this control.
+				 */
+				ariaLabelledBy: {
+					type: "sap.ui.core.Control",
+					multiple: true,
+					mapping: {
+						type: "property",
+						to: "accessibleNameRef",
+						formatter: "_getAriaLabelledByForRendering"
+					}
+				}
+			},
 			events: {
 
 				/**
@@ -179,5 +195,8 @@ sap.ui.define([
 	 * @function
 	 */
 
+	/* CUSTOM CODE START */
+	/* CUSTOM CODE END */
+
 	return Select;
 });

package/src/sap/ui/webc/main/Slider.js

@@ -70,7 +70,7 @@ sap.ui.define([
 	 * </ul>
 	 *
 	 * @author SAP SE
-	 * @version 1.98.0
+	 * @version 1.99.0
 	 *
 	 * @constructor
 	 * @public
@@ -153,6 +153,15 @@ sap.ui.define([
 				value: {
 					type: "float",
 					defaultValue: 0
+				},
+
+				/**
+				 * Defines the width of the control
+				 */
+				width: {
+					type: "sap.ui.core.CSSSize",
+					defaultValue: null,
+					mapping: "style"
 				}
 			},
 			events: {
@@ -170,9 +179,13 @@ sap.ui.define([
 				input: {
 					parameters: {}
 				}
-			}
+			},
+			designtime: "sap/ui/webc/main/designtime/Slider.designtime"
 		}
 	});
 
+	/* CUSTOM CODE START */
+	/* CUSTOM CODE END */
+
 	return Slider;
 });

package/src/sap/ui/webc/main/SplitButton.js

@@ -0,0 +1,156 @@
+/*!
+ * OpenUI5
+ * (c) Copyright 2009-2022 SAP SE or an SAP affiliate company.
+ * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
+ */
+
+// Provides control sap.ui.webc.main.SplitButton.
+sap.ui.define([
+	"sap/ui/webc/common/WebComponent",
+	"./library",
+	"./thirdparty/SplitButton"
+], function(WebComponent, library) {
+	"use strict";
+
+	var ButtonDesign = library.ButtonDesign;
+
+	/**
+	 * Constructor for a new <code>SplitButton</code>.
+	 *
+	 * @param {string} [sId] ID for the new control, generated automatically if no ID is given
+	 * @param {object} [mSettings] Initial settings for the new control
+	 *
+	 * @extends sap.ui.webc.common.WebComponent
+	 * @class
+	 *
+	 * <h3>Overview</h3>
+	 *
+	 * <code>sap.ui.webc.main.SplitButton</code> enables users to trigger actions. It is constructed of two separate actions - default action and arrow action that can be activated by clicking or tapping, or by pressing certain keyboard keys - <code>Space</code> or <code>Enter</code> for default action, and <code>Arrow Down</code> or <code>Arrow Up</code> for arrow action.
+	 *
+	 * <h3>Usage</h3>
+	 *
+	 * <code>sap.ui.webc.main.SplitButton</code> consists two separate buttons:
+	 * <ul>
+	 *     <li>for the first one (default action) you can define some <code>text</code> or an <code>icon</code>, or both. Also, it is possible to define different icon for active state of this button - <code>activeIcon</code>.</li>
+	 *     <li>the second one (arrow action) contains only <code>slim-arrow-down</code> icon.</li>
+	 * </ul> You can choose a <code>design</code> from a set of predefined types (the same as for ui5-button) that offer different styling to correspond to the triggered action. Both text and arrow actions have the same design. <br>
+	 * <br>
+	 * You can set the <code>sap.ui.webc.main.SplitButton</code> as enabled or disabled. Both parts of an enabled <code>sap.ui.webc.main.SplitButton</code> can be pressed by clicking or tapping it, or by certain keys, which changes the style to provide visual feedback to the user that it is pressed or hovered over with the mouse cursor. A disabled <code>sap.ui.webc.main.SplitButton</code> appears inactive and any of the two buttons cannot be pressed.
+	 *
+	 * <h3>Keyboard Handling</h3>
+	 * <ul>
+	 *     <li><code>Space</code> or <code>Enter</code> - triggers the default action</li>
+	 *     <li><code>Shift</code> or <code>Escape</code> - if <code>Space</code> is pressed, releases the default action button without triggering the click event.</li>
+	 *     <li><code>Arrow Down</code>, <code>Arrow Up</code>, <code>Alt</code>+<code>Arrow Down</code>, <code>Alt</code>+<code>Arrow Up</code>, or <code>F4</code> - triggers the arrow action There are separate events that are fired on activating of <code>sap.ui.webc.main.SplitButton</code> parts:
+	 *         <ul>
+	 *             <li><code>click</code> for the first button (default action)</li>
+	 *             <li><code>arrow-click</code> for the second button (arrow action)</li>
+	 *         </ul>
+	 * </ul>
+	 *
+	 * @author SAP SE
+	 * @version 1.99.0
+	 *
+	 * @constructor
+	 * @public
+	 * @since 1.99.0
+	 * @experimental Since 1.99.0 This control is experimental and its API might change significantly.
+	 * @alias sap.ui.webc.main.SplitButton
+	 * @ui5-metamodel This control/element also will be described in the UI5 (legacy) designtime metamodel
+	 */
+	var SplitButton = WebComponent.extend("sap.ui.webc.main.SplitButton", {
+		metadata: {
+			library: "sap.ui.webc.main",
+			tag: "ui5-split-button-ui5",
+			properties: {
+
+				/**
+				 * Sets the accessible aria name of the component.
+				 */
+				accessibleName: {
+					type: "string"
+				},
+
+				/**
+				 * Defines the icon to be displayed in active state as graphical element within the component.
+				 */
+				activeIcon: {
+					type: "string",
+					defaultValue: ""
+				},
+
+				/**
+				 * Defines the component design.
+				 *
+				 * <br>
+				 * <br>
+				 * <b>The available values are:</b>
+				 *
+				 *
+				 * <ul>
+				 *     <li><code>Default</code></li>
+				 *     <li><code>Emphasized</code></li>
+				 *     <li><code>Positive</code></li>
+				 *     <li><code>Negative</code></li>
+				 *     <li><code>Transparent</code></li>
+				 *     <li><code>Attention</code></li>
+				 * </ul>
+				 */
+				design: {
+					type: "sap.ui.webc.main.ButtonDesign",
+					defaultValue: ButtonDesign.Default
+				},
+
+				/**
+				 * Defines whether the component is disabled. A disabled component can't be pressed or focused, and it is not in the tab chain.
+				 */
+				disabled: {
+					type: "boolean",
+					defaultValue: false
+				},
+
+				/**
+				 * Defines the icon to be displayed as graphical element within the component. The SAP-icons font provides numerous options. <br>
+				 * <br>
+				 * Example:
+				 *
+				 * See all the available icons in the <ui5-link target="_blank" href="https://openui5.hana.ondemand.com/test-resources/sap/m/demokit/iconExplorer/webapp/index.html" class="api-table-content-cell-link">Icon Explorer</ui5-link>.
+				 */
+				icon: {
+					type: "string",
+					defaultValue: ""
+				},
+
+				/**
+				 * Defines the content of the control
+				 */
+				text: {
+					type: "string",
+					defaultValue: "",
+					mapping: "textContent"
+				}
+			},
+			events: {
+
+				/**
+				 * Fired when the user clicks on the arrow action.
+				 */
+				arrowClick: {
+					parameters: {}
+				},
+
+				/**
+				 * Fired when the user clicks on the default action.
+				 */
+				click: {
+					parameters: {}
+				}
+			}
+		}
+	});
+
+	/* CUSTOM CODE START */
+	/* CUSTOM CODE END */
+
+	return SplitButton;
+});

package/src/sap/ui/webc/main/StandardListItem.js

@@ -41,7 +41,7 @@ sap.ui.define([
 	 * </ul>
 	 *
 	 * @author SAP SE
-	 * @version 1.98.0
+	 * @version 1.99.0
 	 *
 	 * @constructor
 	 * @public
@@ -158,5 +158,8 @@ sap.ui.define([
 		}
 	});
 
+	/* CUSTOM CODE START */
+	/* CUSTOM CODE END */
+
 	return StandardListItem;
 });

package/src/sap/ui/webc/main/StepInput.js

@@ -50,7 +50,7 @@ sap.ui.define([
 	 * </ul>
 	 *
 	 * @author SAP SE
-	 * @version 1.98.0
+	 * @version 1.99.0
 	 *
 	 * @constructor
 	 * @public
@@ -72,14 +72,6 @@ sap.ui.define([
 					type: "string"
 				},
 
-				/**
-				 * Receives id(or many ids) of the elements that label the component.
-				 */
-				accessibleNameRef: {
-					type: "string",
-					defaultValue: ""
-				},
-
 				/**
 				 * Determines whether the component is displayed as disabled.
 				 */
@@ -199,6 +191,30 @@ sap.ui.define([
 						type: "slot",
 						to: "div"
 					}
+				},
+
+				/**
+				 * Defines the width of the control
+				 */
+				width: {
+					type: "sap.ui.core.CSSSize",
+					defaultValue: null,
+					mapping: "style"
+				}
+			},
+			associations: {
+
+				/**
+				 * Receives id(or many ids) of the controls that label this control.
+				 */
+				ariaLabelledBy: {
+					type: "sap.ui.core.Control",
+					multiple: true,
+					mapping: {
+						type: "property",
+						to: "accessibleNameRef",
+						formatter: "_getAriaLabelledByForRendering"
+					}
 				}
 			},
 			events: {
@@ -213,5 +229,8 @@ sap.ui.define([
 		}
 	});
 
+	/* CUSTOM CODE START */
+	/* CUSTOM CODE END */
+
 	return StepInput;
 });

package/src/sap/ui/webc/main/SuggestionGroupItem.js

@@ -24,7 +24,7 @@ sap.ui.define([
 	 * The <code>sap.ui.webc.main.SuggestionGroupItem</code> is type of suggestion item, that can be used to split the <code>sap.ui.webc.main.Input</code> suggestions into groups.
 	 *
 	 * @author SAP SE
-	 * @version 1.98.0
+	 * @version 1.99.0
 	 *
 	 * @constructor
 	 * @public
@@ -54,5 +54,8 @@ sap.ui.define([
 		}
 	});
 
+	/* CUSTOM CODE START */
+	/* CUSTOM CODE END */
+
 	return SuggestionGroupItem;
 });

package/src/sap/ui/webc/main/SuggestionItem.js

@@ -28,7 +28,7 @@ sap.ui.define([
 	 * The <code>sap.ui.webc.main.SuggestionItem</code> represents the suggestion item of the <code>sap.ui.webc.main.Input</code>.
 	 *
 	 * @author SAP SE
-	 * @version 1.98.0
+	 * @version 1.99.0
 	 *
 	 * @constructor
 	 * @public
@@ -120,5 +120,8 @@ sap.ui.define([
 		}
 	});
 
+	/* CUSTOM CODE START */
+	/* CUSTOM CODE END */
+
 	return SuggestionItem;
 });

package/src/sap/ui/webc/main/Switch.js

@@ -42,7 +42,7 @@ sap.ui.define([
 	 * </ul>
 	 *
 	 * @author SAP SE
-	 * @version 1.98.0
+	 * @version 1.99.0
 	 *
 	 * @constructor
 	 * @public
@@ -109,6 +109,21 @@ sap.ui.define([
 					defaultValue: ""
 				}
 			},
+			associations: {
+
+				/**
+				 * Receives id(or many ids) of the controls that label this control.
+				 */
+				ariaLabelledBy: {
+					type: "sap.ui.core.Control",
+					multiple: true,
+					mapping: {
+						type: "property",
+						to: "accessibleNameRef",
+						formatter: "_getAriaLabelledByForRendering"
+					}
+				}
+			},
 			events: {
 
 				/**
@@ -121,5 +136,8 @@ sap.ui.define([
 		}
 	});
 
+	/* CUSTOM CODE START */
+	/* CUSTOM CODE END */
+
 	return Switch;
 });

package/src/sap/ui/webc/main/Tab.js

@@ -26,7 +26,7 @@ sap.ui.define([
 	 * The <code>sap.ui.webc.main.Tab</code> represents a selectable item inside a <code>sap.ui.webc.main.TabContainer</code>. It defines both the item in the tab strip (top part of the <code>sap.ui.webc.main.TabContainer</code>) and the content that is presented to the user once the tab is selected.
 	 *
 	 * @author SAP SE
-	 * @version 1.98.0
+	 * @version 1.99.0
 	 *
 	 * @constructor
 	 * @public
@@ -46,7 +46,7 @@ sap.ui.define([
 			properties: {
 
 				/**
-				 * Represents the "additionalText" text, which is displayed in the tab filter.
+				 * Represents the "additionalText" text, which is displayed in the tab.
 				 */
 				additionalText: {
 					type: "string",
@@ -130,5 +130,8 @@ sap.ui.define([
 	 * @function
 	 */
 
+	/* CUSTOM CODE START */
+	/* CUSTOM CODE END */
+
 	return Tab;
 });

package/src/sap/ui/webc/main/TabContainer.js

@@ -13,6 +13,7 @@ sap.ui.define([
 	"use strict";
 
 	var TabLayout = library.TabLayout;
+	var TabsOverflowMode = library.TabsOverflowMode;
 
 	/**
 	 * Constructor for a new <code>TabContainer</code>.
@@ -35,8 +36,10 @@ sap.ui.define([
 	 *     <li><code>sap.ui.webc.main.TabSeparator</code> - used to separate tabs with a vertical line</li>
 	 * </ul>
 	 *
+	 * <h3>Keyboard Handling</h3>
+	 *
 	 * @author SAP SE
-	 * @version 1.98.0
+	 * @version 1.99.0
 	 *
 	 * @constructor
 	 * @public
@@ -79,7 +82,7 @@ sap.ui.define([
 				/**
 				 * Defines whether the overflow select list is displayed. <br>
 				 * <br>
-				 * The overflow select list represents a list, where all tab filters are displayed so that it's easier for the user to select a specific tab filter.
+				 * The overflow select list represents a list, where all tabs are displayed so that it's easier for the user to select a specific tab.
 				 */
 				showOverflow: {
 					type: "boolean",
@@ -106,6 +109,26 @@ sap.ui.define([
 					defaultValue: TabLayout.Standard
 				},
 
+				/**
+				 * Defines the overflow mode of the tab strip. If you have a large number of tabs, only the tabs that can fit on screen will be visible. All other tabs that can 't fit on the screen are available in an overflow tab "More".
+				 *
+				 * <br>
+				 * <br>
+				 * <b>Note:</b> Only one overflow at the end would be displayed by default, but when set to <code>StartAndEnd</code>, there will be two overflows on both ends, and tab order will not change on tab selection.
+				 *
+				 * <br>
+				 * <br>
+				 * Available options are:
+				 * <ul>
+				 *     <li><code>End</code></li>
+				 *     <li><code>StartAndEnd</code></li>
+				 * </ul>
+				 */
+				tabsOverflowMode: {
+					type: "sap.ui.webc.main.TabsOverflowMode",
+					defaultValue: TabsOverflowMode.End
+				},
+
 				/**
 				 * Defines the width of the control
 				 */
@@ -135,6 +158,15 @@ sap.ui.define([
 					type: "sap.ui.webc.main.IButton",
 					multiple: false,
 					slot: "overflowButton"
+				},
+
+				/**
+				 * Defines the button which will open the start overflow menu if available. If nothing is provided to this slot, the default button will be used.
+				 */
+				startOverflowButton: {
+					type: "sap.ui.webc.main.IButton",
+					multiple: false,
+					slot: "startOverflowButton"
 				}
 			},
 			events: {
@@ -163,5 +195,8 @@ sap.ui.define([
 		}
 	});
 
+	/* CUSTOM CODE START */
+	/* CUSTOM CODE END */
+
 	return TabContainer;
 });

package/src/sap/ui/webc/main/TabSeparator.js

@@ -24,7 +24,7 @@ sap.ui.define([
 	 * The <code>sap.ui.webc.main.TabSeparator</code> represents a vertical line to separate tabs inside a <code>sap.ui.webc.main.TabContainer</code>.
 	 *
 	 * @author SAP SE
-	 * @version 1.98.0
+	 * @version 1.99.0
 	 *
 	 * @constructor
 	 * @public
@@ -44,5 +44,8 @@ sap.ui.define([
 		}
 	});
 
+	/* CUSTOM CODE START */
+	/* CUSTOM CODE END */
+
 	return TabSeparator;
 });

package/src/sap/ui/webc/main/Table.js

@@ -40,8 +40,23 @@ sap.ui.define([
 	 * <br>
 	 * <b>Note:</b> Currently, when a column is shown as a pop-in, the visual indication for selection is not presented over it.
 	 *
+	 * <h3>Keyboard Handling</h3>
+	 *
+	 *
+	 *
+	 * <ul>
+	 *     <li>[F7] - If focus is on an interactive control inside an item, moves focus to the corresponding item.</li>
+	 *     <li>[CTRL]+[A] - Selects all items, if MultiSelect mode is enabled.</li>
+	 *     <li>[HOME]/[END] - Focuses the first/last item.</li>
+	 *     <li>[PAGEUP]/[PAGEDOWN] - Moves focus up/down by page size (20 items by default).</li>
+	 *     <li>[ALT]+[DOWN]/[UP] - Switches focus between header, last focused item, and More button (if applies) in either direction.</li>
+	 *     <li>[SHIFT]+[DOWN]/[UP] - Selects the next/previous item in a MultiSelect table, if the current item is selected (Range selection). Otherwise, deselects them (Range deselection).</li>
+	 *     <li>[SHIFT]+[HOME]/[END] - Range selection to the first/last item of the List.</li>
+	 *     <li>[CTRL]+[HOME]/[END] - Same behavior as HOME & END.</li> *
+	 * </ul>
+	 *
 	 * @author SAP SE
-	 * @version 1.98.0
+	 * @version 1.99.0
 	 *
 	 * @constructor
 	 * @public
@@ -281,5 +296,8 @@ sap.ui.define([
 		}
 	});
 
+	/* CUSTOM CODE START */
+	/* CUSTOM CODE END */
+
 	return Table;
-});
+});

package/src/sap/ui/webc/main/TableCell.js

@@ -34,7 +34,7 @@ sap.ui.define([
 	 * </ul>
 	 *
 	 * @author SAP SE
-	 * @version 1.98.0
+	 * @version 1.99.0
 	 *
 	 * @constructor
 	 * @public
@@ -65,5 +65,8 @@ sap.ui.define([
 		}
 	});
 
+	/* CUSTOM CODE START */
+	/* CUSTOM CODE END */
+
 	return TableCell;
 });

package/src/sap/ui/webc/main/TableColumn.js

@@ -34,7 +34,7 @@ sap.ui.define([
 	 * </ul>
 	 *
 	 * @author SAP SE
-	 * @version 1.98.0
+	 * @version 1.99.0
 	 *
 	 * @constructor
 	 * @public
@@ -96,5 +96,8 @@ sap.ui.define([
 		}
 	});
 
+	/* CUSTOM CODE START */
+	/* CUSTOM CODE END */
+
 	return TableColumn;
 });

package/src/sap/ui/webc/main/TableGroupRow.js

@@ -34,7 +34,7 @@ sap.ui.define([
 	 * </ul>
 	 *
 	 * @author SAP SE
-	 * @version 1.98.0
+	 * @version 1.99.0
 	 *
 	 * @constructor
 	 * @public
@@ -65,5 +65,8 @@ sap.ui.define([
 		}
 	});
 
+	/* CUSTOM CODE START */
+	/* CUSTOM CODE END */
+
 	return TableGroupRow;
 });

package/src/sap/ui/webc/main/TableRow.js

@@ -37,7 +37,7 @@ sap.ui.define([
 	 * </ul>
 	 *
 	 * @author SAP SE
-	 * @version 1.98.0
+	 * @version 1.99.0
 	 *
 	 * @constructor
 	 * @public
@@ -96,5 +96,8 @@ sap.ui.define([
 		}
 	});
 
+	/* CUSTOM CODE START */
+	/* CUSTOM CODE END */
+
 	return TableRow;
 });