@openui5/sap.ui.webc.fiori 1.96.5 → 1.99.0

package/src/sap/ui/webc/fiori/FilterItemOption.js

@@ -0,0 +1,71 @@
+/*!
+ * 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.fiori.FilterItemOption.
+sap.ui.define([
+	"sap/ui/webc/common/WebComponent",
+	"./library",
+	"./thirdparty/FilterItemOption"
+], function(WebComponent, library) {
+	"use strict";
+
+	/**
+	 * Constructor for a new <code>FilterItemOption</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>
+	 *
+	 * <h3>Usage</h3>
+	 *
+	 * @author SAP SE
+	 * @version 1.99.0
+	 *
+	 * @constructor
+	 * @public
+	 * @since 1.97.0
+	 * @experimental Since 1.97.0 This control is experimental and its API might change significantly.
+	 * @alias sap.ui.webc.fiori.FilterItemOption
+	 * @implements sap.ui.webc.fiori.IFilterItemOption
+	 * @ui5-metamodel This control/element also will be described in the UI5 (legacy) designtime metamodel
+	 */
+	var FilterItemOption = WebComponent.extend("sap.ui.webc.fiori.FilterItemOption", {
+		metadata: {
+			library: "sap.ui.webc.fiori",
+			tag: "ui5-filter-item-option-ui5",
+			interfaces: [
+				"sap.ui.webc.fiori.IFilterItemOption"
+			],
+			properties: {
+
+				/**
+				 * Defines whether the option is selected
+				 */
+				selected: {
+					type: "boolean",
+					defaultValue: false
+				},
+
+				/**
+				 * Defines the text of the component.
+				 */
+				text: {
+					type: "string",
+					defaultValue: ""
+				}
+			}
+		}
+	});
+
+	/* CUSTOM CODE START */
+	/* CUSTOM CODE END */
+
+	return FilterItemOption;
+});

package/src/sap/ui/webc/fiori/FlexibleColumnLayout.js

@@ -39,14 +39,8 @@ sap.ui.define([
 	 * <br>
 	 * <h3>Keyboard Handling</h3>
 	 *
-	 *
-	 * <ul>
-	 *     <li>[SPACE, ENTER, RETURN] - If focus is on the layout toggle button (arrow button), once activated, it triggers the associated action (such as expand/collapse the column).</li>
-	 * </ul> <br>
-	 * <br>
-	 *
 	 * @author SAP SE
-	 * @version 1.96.5
+	 * @version 1.99.0
 	 *
 	 * @constructor
 	 * @public
@@ -62,9 +56,19 @@ sap.ui.define([
 			properties: {
 
 				/**
-				 * On object of strings that defines several additional accessibility texts for even further customization.
+				 * An object of strings that defines additional accessibility roles for further customization.
 				 *
-				 * It supports the following fields: - <code>startColumnAccessibleName</code>: the accessibility name for the <code>startColumn</code> region - <code>midColumnAccessibleName</code>: the accessibility name for the <code>midColumn</code> region - <code>endColumnAccessibleName</code>: the accessibility name for the <code>endColumn</code> region - <code>startArrowLeftText</code>: the text that the first arrow (between the <code>begin</code> and <code>mid</code> columns) will have when pointing to the left - <code>startArrowRightText</code>: the text that the first arrow (between the <code>begin</code> and <code>mid</code> columns) will have when pointing to the right - <code>endArrowLeftText</code>: the text that the second arrow (between the <code>mid</code> and <code>end</code> columns) will have when pointing to the left - <code>endArrowRightText</code>: the text that the second arrow (between the <code>mid</code> and <code>end</code> columns) will have when pointing to the right
+				 * It supports the following fields: - <code>startColumnRole</code>: the accessibility role for the <code>startColumn</code> - <code>startArrowContainerRole</code>: the accessibility role for the first arrow container (between the <code>begin</code> and <code>mid</code> columns) - <code>midColumnRole</code>: the accessibility role for the <code>midColumn</code> - <code>endArrowContainerRole</code>: the accessibility role for the second arrow container (between the <code>mid</code> and <code>end</code> columns) - <code>endColumnRole</code>: the accessibility role for the <code>endColumn</code>
+				 */
+				accessibilityRoles: {
+					type: "object",
+					defaultValue: {}
+				},
+
+				/**
+				 * An object of strings that defines several additional accessibility texts for even further customization.
+				 *
+				 * It supports the following fields: - <code>startColumnAccessibleName</code>: the accessibility name for the <code>startColumn</code> region - <code>midColumnAccessibleName</code>: the accessibility name for the <code>midColumn</code> region - <code>endColumnAccessibleName</code>: the accessibility name for the <code>endColumn</code> region - <code>startArrowLeftText</code>: the text that the first arrow (between the <code>begin</code> and <code>mid</code> columns) will have when pointing to the left - <code>startArrowRightText</code>: the text that the first arrow (between the <code>begin</code> and <code>mid</code> columns) will have when pointing to the right - <code>endArrowLeftText</code>: the text that the second arrow (between the <code>mid</code> and <code>end</code> columns) will have when pointing to the left - <code>endArrowRightText</code>: the text that the second arrow (between the <code>mid</code> and <code>end</code> columns) will have when pointing to the right - <code>startArrowContainerAccessibleName</code>: the text that the first arrow container (between the <code>begin</code> and <code>mid</code> columns) will have as <code>aria-label</code> - <code>endArrowContainerAccessibleName</code>: the text that the second arrow container (between the <code>mid</code> and <code>end</code> columns) will have as <code>aria-label</code>
 				 */
 				accessibilityTexts: {
 					type: "object",
@@ -248,5 +252,8 @@ sap.ui.define([
 	 * @function
 	 */
 
+	/* CUSTOM CODE START */
+	/* CUSTOM CODE END */
+
 	return FlexibleColumnLayout;
 });

package/src/sap/ui/webc/fiori/IllustratedMessage.js

@@ -40,12 +40,12 @@ sap.ui.define([
 	 * <h3>Usage</h3> <code>sap.ui.webc.fiori.IllustratedMessage</code> is meant to be used inside container component, for example a <code>sap.ui.webc.main.Card</code>, a <code>sap.ui.webc.main.Dialog</code> or a <code>sap.ui.webc.fiori.Page</code>
 	 *
 	 * @author SAP SE
-	 * @version 1.96.5
+	 * @version 1.99.0
 	 *
 	 * @constructor
 	 * @public
-	 * @since 1.92.0
-	 * @experimental Since 1.92.0 This control is experimental and its API might change significantly.
+	 * @since 1.95.0
+	 * @experimental Since 1.95.0 This control is experimental and its API might change significantly.
 	 * @alias sap.ui.webc.fiori.IllustratedMessage
 	 * @ui5-metamodel This control/element also will be described in the UI5 (legacy) designtime metamodel
 	 */
@@ -110,5 +110,8 @@ sap.ui.define([
 		}
 	});
 
+	/* CUSTOM CODE START */
+	/* CUSTOM CODE END */
+
 	return IllustratedMessage;
 });

package/src/sap/ui/webc/fiori/MediaGallery.js

@@ -0,0 +1,180 @@
+/*!
+ * 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.fiori.MediaGallery.
+sap.ui.define([
+	"sap/ui/webc/common/WebComponent",
+	"./library",
+	"./thirdparty/MediaGallery"
+], function(WebComponent, library) {
+	"use strict";
+
+	var MediaGalleryLayout = library.MediaGalleryLayout;
+	var MediaGalleryMenuHorizontalAlign = library.MediaGalleryMenuHorizontalAlign;
+	var MediaGalleryMenuVerticalAlign = library.MediaGalleryMenuVerticalAlign;
+
+	/**
+	 * Constructor for a new <code>MediaGallery</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>
+	 *
+	 * The <code>ui-media-gallery</code> component allows the user to browse through multimedia items. Currently, the supported items are images and videos. The items should be defined using the <code>sap.ui.webc.fiori.MediaGalleryItem</code> component.
+	 *
+	 * The items are initially displayed as thumbnails. When the user selects a thumbnail, the corresponding item is displayed in larger size. <br>
+	 * The component is responsive by default and adjusts the position of the menu with respect to viewport size, but the application is able to further customize the layout via the provided API.
+	 *
+	 * <h3>Keyboard Handling</h3> The <code>sap.ui.webc.fiori.MediaGallery</code> provides advanced keyboard handling. <br>
+	 * When the thumbnails menu is focused the following keyboard shortcuts allow the user to navigate through the thumbnail items: <br>
+	 *
+	 *
+	 *
+	 * <ul>
+	 *     <li>[UP/DOWN] - Navigates up and down the items</li>
+	 *     <li>[HOME] - Navigates to first item</li>
+	 *     <li>[END] - Navigates to the last item</li>
+	 *     <li>[SPACE/ENTER] - Select an item
+	 * </ul> <br>
+	 *
+	 * @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.fiori.MediaGallery
+	 * @ui5-metamodel This control/element also will be described in the UI5 (legacy) designtime metamodel
+	 */
+	var MediaGallery = WebComponent.extend("sap.ui.webc.fiori.MediaGallery", {
+		metadata: {
+			library: "sap.ui.webc.fiori",
+			tag: "ui5-media-gallery-ui5",
+			properties: {
+
+				/**
+				 * If enabled, a <code>display-area-click</code> event is fired when the user clicks or taps on the display area. <br>
+				 * The display area is the central area that contains the enlarged content of the currently selected item.
+				 */
+				interactiveDisplayArea: {
+					type: "boolean",
+					defaultValue: false
+				},
+
+				/**
+				 * Determines the layout of the component. <br>
+				 * <br>
+				 * Available options are:
+				 * <ul>
+				 *     <li><code>Auto</code></li>
+				 *     <li><code>Vertical</code></li>
+				 *     <li><code>Horizontal</code></li>
+				 * </ul>
+				 */
+				layout: {
+					type: "sap.ui.webc.fiori.MediaGalleryLayout",
+					defaultValue: MediaGalleryLayout.Auto
+				},
+
+				/**
+				 * Determines the horizontal alignment of the thumbnails menu vs. the central display area. <br>
+				 * <br>
+				 * Available options are:
+				 * <ul>
+				 *     <li><code>Left</code></li>
+				 *     <li><code>Right</code></li>
+				 * </ul>
+				 */
+				menuHorizontalAlign: {
+					type: "sap.ui.webc.fiori.MediaGalleryMenuHorizontalAlign",
+					defaultValue: MediaGalleryMenuHorizontalAlign.Left
+				},
+
+				/**
+				 * Determines the vertical alignment of the thumbnails menu vs. the central display area. <br>
+				 * <br>
+				 * Available options are:
+				 * <ul>
+				 *     <li><code>Top</code></li>
+				 *     <li><code>Bottom</code></li>
+				 * </ul>
+				 */
+				menuVerticalAlign: {
+					type: "sap.ui.webc.fiori.MediaGalleryMenuVerticalAlign",
+					defaultValue: MediaGalleryMenuVerticalAlign.Bottom
+				},
+
+				/**
+				 * If set to <code>true</code>, all thumbnails are rendered in a scrollable container. If <code>false</code>, only up to five thumbnails are rendered, followed by an overflow button that shows the count of the remaining thumbnails.
+				 */
+				showAllThumbnails: {
+					type: "boolean",
+					defaultValue: false
+				}
+			},
+			defaultAggregation: "items",
+			aggregations: {
+
+				/**
+				 * Defines the component items.
+				 *
+				 * <br>
+				 * <br>
+				 * <b>Note:</b> Only one selected item is allowed.
+				 *
+				 * <br>
+				 * <br>
+				 * <b>Note:</b> Use the <code>sap.ui.webc.fiori.MediaGalleryItem</code> component to define the desired items.
+				 */
+				items: {
+					type: "sap.ui.webc.fiori.IMediaGalleryItem",
+					multiple: true
+				}
+			},
+			events: {
+
+				/**
+				 * Fired when the display area is clicked.<br>
+				 * The display area is the central area that contains the enlarged content of the currently selected item.
+				 */
+				displayAreaClick: {
+					parameters: {}
+				},
+
+				/**
+				 * Fired when the thumbnails overflow button is clicked.
+				 */
+				overflowClick: {
+					parameters: {}
+				},
+
+				/**
+				 * Fired when selection is changed by user interaction.
+				 */
+				selectionChange: {
+					parameters: {
+						/**
+						 * the selected item.
+						 */
+						item: {
+							type: "HTMLElement"
+						}
+					}
+				}
+			}
+		}
+	});
+
+	/* CUSTOM CODE START */
+	/* CUSTOM CODE END */
+
+	return MediaGallery;
+});

package/src/sap/ui/webc/fiori/MediaGalleryItem.js

@@ -0,0 +1,115 @@
+/*!
+ * 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.fiori.MediaGalleryItem.
+sap.ui.define([
+	"sap/ui/webc/common/WebComponent",
+	"./library",
+	"./thirdparty/MediaGalleryItem"
+], function(WebComponent, library) {
+	"use strict";
+
+	var MediaGalleryItemLayout = library.MediaGalleryItemLayout;
+
+	/**
+	 * Constructor for a new <code>MediaGalleryItem</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> The <code>sap.ui.webc.fiori.MediaGalleryItem</code> web component represents the items displayed in the <code>sap.ui.webc.fiori.MediaGallery</code> web component. <br>
+	 * <br>
+	 * <b>Note:</b> <code>sap.ui.webc.fiori.MediaGalleryItem</code> is not supported when used outside of <code>sap.ui.webc.fiori.MediaGallery</code>. <br>
+	 * <br>
+	 *
+	 *
+	 * <h3>Keyboard Handling</h3> The <code>sap.ui.webc.fiori.MediaGallery</code> provides advanced keyboard handling. When focused, the user can use the following keyboard shortcuts in order to perform a navigation: <br>
+	 *
+	 * <ul>
+	 *     <li>[SPACE/ENTER/RETURN] - Trigger <code>ui5-click</code> event</li>
+	 * </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.fiori.MediaGalleryItem
+	 * @implements sap.ui.webc.fiori.IMediaGalleryItem
+	 * @ui5-metamodel This control/element also will be described in the UI5 (legacy) designtime metamodel
+	 */
+	var MediaGalleryItem = WebComponent.extend("sap.ui.webc.fiori.MediaGalleryItem", {
+		metadata: {
+			library: "sap.ui.webc.fiori",
+			tag: "ui5-media-gallery-item-ui5",
+			interfaces: [
+				"sap.ui.webc.fiori.IMediaGalleryItem"
+			],
+			properties: {
+
+				/**
+				 * Defines whether the component is in disabled state.
+				 */
+				disabled: {
+					type: "boolean",
+					defaultValue: false
+				},
+
+				/**
+				 * Determines the layout of the item container. <br>
+				 * <br>
+				 * Available options are:
+				 * <ul>
+				 *     <li><code>Square</code></li>
+				 *     <li><code>Wide</code></li>
+				 * </ul>
+				 */
+				layout: {
+					type: "sap.ui.webc.fiori.MediaGalleryItemLayout",
+					defaultValue: MediaGalleryItemLayout.Square
+				},
+
+				/**
+				 * Defines the selected state of the component.
+				 */
+				selected: {
+					type: "boolean",
+					defaultValue: false
+				}
+			},
+			defaultAggregation: "content",
+			aggregations: {
+
+				/**
+				 * Defines the content of the component.
+				 */
+				content: {
+					type: "sap.ui.core.Control",
+					multiple: true
+				},
+
+				/**
+				 * Defines the content of the thumbnail.
+				 */
+				thumbnail: {
+					type: "sap.ui.core.Control",
+					multiple: true,
+					slot: "thumbnail"
+				}
+			}
+		}
+	});
+
+	/* CUSTOM CODE START */
+	/* CUSTOM CODE END */
+
+	return MediaGalleryItem;
+});

package/src/sap/ui/webc/fiori/NotificationAction.js

@@ -27,7 +27,7 @@ sap.ui.define([
 	 * The <code>sap.ui.webc.fiori.NotificationAction</code> represents an abstract action, used in the <code>sap.ui.webc.fiori.NotificationListItem</code> and the <code>sap.ui.webc.fiori.NotificationListGroupItem</code> items.
 	 *
 	 * @author SAP SE
-	 * @version 1.96.5
+	 * @version 1.99.0
 	 *
 	 * @constructor
 	 * @public
@@ -96,5 +96,8 @@ sap.ui.define([
 		}
 	});
 
+	/* CUSTOM CODE START */
+	/* CUSTOM CODE END */
+
 	return NotificationAction;
 });

package/src/sap/ui/webc/fiori/NotificationListGroupItem.js

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

package/src/sap/ui/webc/fiori/NotificationListItem.js

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

package/src/sap/ui/webc/fiori/Page.js

@@ -31,7 +31,7 @@ sap.ui.define([
 	 * <b>Note:</b> <code>sap.ui.webc.fiori.Page</code> occipues the whole available space of its parent. In order to achieve the intended design you have to make sure that there is enough space for the <code>sap.ui.webc.fiori.Page</code> to be rendered.
 	 *
 	 * @author SAP SE
-	 * @version 1.96.5
+	 * @version 1.99.0
 	 *
 	 * @constructor
 	 * @public
@@ -121,8 +121,8 @@ sap.ui.define([
 				 * Defines the footer HTML Element.
 				 */
 				footer: {
-					type: "sap.ui.core.Control",
-					multiple: true,
+					type: "sap.ui.webc.fiori.IBar",
+					multiple: false,
 					slot: "footer"
 				},
 
@@ -130,13 +130,16 @@ sap.ui.define([
 				 * Defines the header HTML Element.
 				 */
 				header: {
-					type: "sap.ui.core.Control",
-					multiple: true,
+					type: "sap.ui.webc.fiori.IBar",
+					multiple: false,
 					slot: "header"
 				}
 			}
 		}
 	});
 
+	/* CUSTOM CODE START */
+	/* CUSTOM CODE END */
+
 	return Page;
 });

package/src/sap/ui/webc/fiori/ProductSwitch.js

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

package/src/sap/ui/webc/fiori/ProductSwitchItem.js

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