@openui5/sap.ui.webc.main 1.99.1 → 1.102.0

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

@@ -24,7 +24,7 @@ sap.ui.define([
 	 * The <code>sap.ui.webc.main.ComboBoxItem</code> represents the item for a <code>sap.ui.webc.main.ComboBox</code>.
 	 *
 	 * @author SAP SE
-	 * @version 1.99.1
+	 * @version 1.102.0
 	 *
 	 * @constructor
 	 * @public

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

@@ -28,7 +28,7 @@ sap.ui.define([
 	 * The component accepts arbitrary HTML content to allow full customization.
 	 *
 	 * @author SAP SE
-	 * @version 1.99.1
+	 * @version 1.102.0
 	 *
 	 * @constructor
 	 * @public

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

@@ -8,9 +8,11 @@
 sap.ui.define([
 	"sap/ui/webc/common/WebComponent",
 	"./library",
+	"sap/ui/core/EnabledPropagator",
 	"sap/ui/core/library",
-	"./thirdparty/DatePicker"
-], function(WebComponent, library, coreLibrary) {
+	"./thirdparty/DatePicker",
+	"./thirdparty/features/InputElementsFormSupport"
+], function(WebComponent, library, EnabledPropagator, coreLibrary) {
 	"use strict";
 
 	var CalendarType = coreLibrary.CalendarType;
@@ -74,19 +76,23 @@ sap.ui.define([
 	 * &lt;/script&gt;</code></pre>
 	 *
 	 * @author SAP SE
-	 * @version 1.99.1
+	 * @version 1.102.0
 	 *
 	 * @constructor
 	 * @public
 	 * @since 1.92.0
 	 * @experimental Since 1.92.0 This control is experimental and its API might change significantly.
 	 * @alias sap.ui.webc.main.DatePicker
+	 * @implements sap.ui.core.IFormContent
 	 * @ui5-metamodel This control/element also will be described in the UI5 (legacy) designtime metamodel
 	 */
 	var DatePicker = WebComponent.extend("sap.ui.webc.main.DatePicker", {
 		metadata: {
 			library: "sap.ui.webc.main",
 			tag: "ui5-date-picker-ui5",
+			interfaces: [
+				"sap.ui.core.IFormContent"
+			],
 			properties: {
 
 				/**
@@ -97,11 +103,16 @@ sap.ui.define([
 				},
 
 				/**
-				 * Determines whether the component is displayed as disabled.
+				 * Defines whether the control is enabled. A disabled control can't be interacted with, and it is not in the tab chain.
 				 */
-				disabled: {
+				enabled: {
 					type: "boolean",
-					defaultValue: false
+					defaultValue: true,
+					mapping: {
+						type: "attribute",
+						to: "disabled",
+						formatter: "_mapEnabled"
+					}
 				},
 
 				/**
@@ -243,7 +254,6 @@ sap.ui.define([
 				 */
 				width: {
 					type: "sap.ui.core.CSSSize",
-					defaultValue: null,
 					mapping: "style"
 				}
 			},
@@ -309,7 +319,8 @@ sap.ui.define([
 				}
 			},
 			methods: ["closePicker", "formatValue", "isInValidRange", "isOpen", "isValid", "openPicker"],
-			getters: ["dateValue"]
+			getters: ["dateValue"],
+			designtime: "sap/ui/webc/main/designtime/DatePicker.designtime"
 		}
 	});
 
@@ -365,6 +376,8 @@ sap.ui.define([
 	 * @function
 	 */
 
+	EnabledPropagator.call(DatePicker.prototype);
+
 	/* CUSTOM CODE START */
 	/* CUSTOM CODE END */
 

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

@@ -8,9 +8,11 @@
 sap.ui.define([
 	"sap/ui/webc/common/WebComponent",
 	"./library",
+	"sap/ui/core/EnabledPropagator",
 	"sap/ui/core/library",
-	"./thirdparty/DateRangePicker"
-], function(WebComponent, library, coreLibrary) {
+	"./thirdparty/DateRangePicker",
+	"./thirdparty/features/InputElementsFormSupport"
+], function(WebComponent, library, EnabledPropagator, coreLibrary) {
 	"use strict";
 
 	var CalendarType = coreLibrary.CalendarType;
@@ -44,19 +46,23 @@ sap.ui.define([
 	 * </ul>
 	 *
 	 * @author SAP SE
-	 * @version 1.99.1
+	 * @version 1.102.0
 	 *
 	 * @constructor
 	 * @public
 	 * @since 1.92.0
 	 * @experimental Since 1.92.0 This control is experimental and its API might change significantly.
 	 * @alias sap.ui.webc.main.DateRangePicker
+	 * @implements sap.ui.core.IFormContent
 	 * @ui5-metamodel This control/element also will be described in the UI5 (legacy) designtime metamodel
 	 */
 	var DateRangePicker = WebComponent.extend("sap.ui.webc.main.DateRangePicker", {
 		metadata: {
 			library: "sap.ui.webc.main",
 			tag: "ui5-daterange-picker-ui5",
+			interfaces: [
+				"sap.ui.core.IFormContent"
+			],
 			properties: {
 
 				/**
@@ -74,11 +80,16 @@ sap.ui.define([
 				},
 
 				/**
-				 * Determines whether the component is displayed as disabled.
+				 * Defines whether the control is enabled. A disabled control can't be interacted with, and it is not in the tab chain.
 				 */
-				disabled: {
+				enabled: {
 					type: "boolean",
-					defaultValue: false
+					defaultValue: true,
+					mapping: {
+						type: "attribute",
+						to: "disabled",
+						formatter: "_mapEnabled"
+					}
 				},
 
 				/**
@@ -220,7 +231,6 @@ sap.ui.define([
 				 */
 				width: {
 					type: "sap.ui.core.CSSSize",
-					defaultValue: null,
 					mapping: "style"
 				}
 			},
@@ -363,6 +373,8 @@ sap.ui.define([
 	 * @function
 	 */
 
+	EnabledPropagator.call(DateRangePicker.prototype);
+
 	/* CUSTOM CODE START */
 	/* CUSTOM CODE END */
 

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

@@ -8,9 +8,11 @@
 sap.ui.define([
 	"sap/ui/webc/common/WebComponent",
 	"./library",
+	"sap/ui/core/EnabledPropagator",
 	"sap/ui/core/library",
-	"./thirdparty/DateTimePicker"
-], function(WebComponent, library, coreLibrary) {
+	"./thirdparty/DateTimePicker",
+	"./thirdparty/features/InputElementsFormSupport"
+], function(WebComponent, library, EnabledPropagator, coreLibrary) {
 	"use strict";
 
 	var CalendarType = coreLibrary.CalendarType;
@@ -70,19 +72,23 @@ sap.ui.define([
 	 * The <code>DateTimePicker</code> is responsive and fully adapts to all devices. For larger screens, such as tablet or desktop, it is displayed as a popover, while on phone devices, it is displayed full screen.
 	 *
 	 * @author SAP SE
-	 * @version 1.99.1
+	 * @version 1.102.0
 	 *
 	 * @constructor
 	 * @public
 	 * @since 1.92.0
 	 * @experimental Since 1.92.0 This control is experimental and its API might change significantly.
 	 * @alias sap.ui.webc.main.DateTimePicker
+	 * @implements sap.ui.core.IFormContent
 	 * @ui5-metamodel This control/element also will be described in the UI5 (legacy) designtime metamodel
 	 */
 	var DateTimePicker = WebComponent.extend("sap.ui.webc.main.DateTimePicker", {
 		metadata: {
 			library: "sap.ui.webc.main",
 			tag: "ui5-datetime-picker-ui5",
+			interfaces: [
+				"sap.ui.core.IFormContent"
+			],
 			properties: {
 
 				/**
@@ -93,11 +99,16 @@ sap.ui.define([
 				},
 
 				/**
-				 * Determines whether the component is displayed as disabled.
+				 * Defines whether the control is enabled. A disabled control can't be interacted with, and it is not in the tab chain.
 				 */
-				disabled: {
+				enabled: {
 					type: "boolean",
-					defaultValue: false
+					defaultValue: true,
+					mapping: {
+						type: "attribute",
+						to: "disabled",
+						formatter: "_mapEnabled"
+					}
 				},
 
 				/**
@@ -239,7 +250,6 @@ sap.ui.define([
 				 */
 				width: {
 					type: "sap.ui.core.CSSSize",
-					defaultValue: null,
 					mapping: "style"
 				}
 			},
@@ -305,7 +315,8 @@ sap.ui.define([
 				}
 			},
 			methods: ["closePicker", "formatValue", "isInValidRange", "isOpen", "isValid", "openPicker"],
-			getters: ["dateValue"]
+			getters: ["dateValue"],
+			designtime: "sap/ui/webc/main/designtime/DateTimePicker.designtime"
 		}
 	});
 
@@ -361,6 +372,8 @@ sap.ui.define([
 	 * @function
 	 */
 
+	EnabledPropagator.call(DateTimePicker.prototype);
+
 	/* CUSTOM CODE START */
 	/* CUSTOM CODE END */
 

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

@@ -29,6 +29,16 @@ sap.ui.define([
 	 *
 	 * <h3>Responsive Behavior</h3> The <code>stretch</code> property can be used to stretch the <code>sap.ui.webc.main.Dialog</code> on full screen.
 	 *
+	 * <h3>CSS Shadow Parts</h3>
+	 *
+	 * <ui5-link target="_blank" href="https://developer.mozilla.org/en-US/docs/Web/CSS/::part">CSS Shadow Parts</ui5-link> allow developers to style elements inside the Shadow DOM. <br>
+	 * The <code>sap.ui.webc.main.Dialog</code> exposes the following CSS Shadow Parts:
+	 * <ul>
+	 *     <li>header - Used to style the header of the component</li>
+	 *     <li>content - Used to style the content of the component</li>
+	 *     <li>footer - Used to style the footer of the component</li>
+	 * </ul>
+	 *
 	 *
 	 *
 	 * <b>Note:</b> We don't recommend nesting popup-like components (<code>sap.ui.webc.main.Dialog</code>, <code>sap.ui.webc.main.Popover</code>) inside <code>sap.ui.webc.main.Dialog</code>. Ideally you should create all popups on the same level inside your HTML page and just open them from one another, rather than nesting them.
@@ -36,7 +46,7 @@ sap.ui.define([
 	 * <b>Note:</b> We don't recommend nesting popup-like components (<code>sap.ui.webc.main.Dialog</code>, <code>sap.ui.webc.main.Popover</code>) inside other components containing z-index. This might break z-index management.
 	 *
 	 * @author SAP SE
-	 * @version 1.99.1
+	 * @version 1.102.0
 	 *
 	 * @constructor
 	 * @public
@@ -84,16 +94,15 @@ sap.ui.define([
 				 */
 				height: {
 					type: "sap.ui.core.CSSSize",
-					defaultValue: null,
 					mapping: "style"
 				},
 
 				/**
-				 * Defines the ID of the HTML Element, which will get the initial focus.
+				 * Indicates if the element is open
 				 */
-				initialFocus: {
-					type: "string",
-					defaultValue: ""
+				open: {
+					type: "boolean",
+					defaultValue: false
 				},
 
 				/**
@@ -130,7 +139,6 @@ sap.ui.define([
 				 */
 				width: {
 					type: "sap.ui.core.CSSSize",
-					defaultValue: null,
 					mapping: "style"
 				}
 			},
@@ -178,6 +186,18 @@ sap.ui.define([
 						to: "accessibleNameRef",
 						formatter: "_getAriaLabelledByForRendering"
 					}
+				},
+
+				/**
+				 * Defines the ID of the HTML Element, which will get the initial focus.
+				 */
+				initialFocus: {
+					type: "sap.ui.core.Control",
+					multiple: false,
+					mapping: {
+						type: "property",
+						to: "initialFocus"
+					}
 				}
 			},
 			events: {
@@ -219,7 +239,8 @@ sap.ui.define([
 					parameters: {}
 				}
 			},
-			methods: ["applyFocus", "close", "isOpen", "show"]
+			methods: ["applyFocus", "close", "isOpen", "show"],
+			designtime: "sap/ui/webc/main/designtime/Dialog.designtime"
 		}
 	});
 

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

@@ -8,9 +8,11 @@
 sap.ui.define([
 	"sap/ui/webc/common/WebComponent",
 	"./library",
+	"sap/ui/core/EnabledPropagator",
 	"sap/ui/core/library",
-	"./thirdparty/FileUploader"
-], function(WebComponent, library, coreLibrary) {
+	"./thirdparty/FileUploader",
+	"./thirdparty/features/InputElementsFormSupport"
+], function(WebComponent, library, EnabledPropagator, coreLibrary) {
 	"use strict";
 
 	var ValueState = coreLibrary.ValueState;
@@ -31,19 +33,23 @@ sap.ui.define([
 	 * And, similar to all input based components, the FileUploader supports "valueState", "placeholder", "name", and "disabled" properties.
 	 *
 	 * @author SAP SE
-	 * @version 1.99.1
+	 * @version 1.102.0
 	 *
 	 * @constructor
 	 * @public
 	 * @since 1.92.0
 	 * @experimental Since 1.92.0 This control is experimental and its API might change significantly.
 	 * @alias sap.ui.webc.main.FileUploader
+	 * @implements sap.ui.core.IFormContent
 	 * @ui5-metamodel This control/element also will be described in the UI5 (legacy) designtime metamodel
 	 */
 	var FileUploader = WebComponent.extend("sap.ui.webc.main.FileUploader", {
 		metadata: {
 			library: "sap.ui.webc.main",
 			tag: "ui5-file-uploader-ui5",
+			interfaces: [
+				"sap.ui.core.IFormContent"
+			],
 			properties: {
 
 				/**
@@ -57,13 +63,16 @@ sap.ui.define([
 				},
 
 				/**
-				 * Defines whether the component is in disabled state. <br>
-				 * <br>
-				 * <b>Note:</b> A disabled component is completely noninteractive.
+				 * Defines whether the control is enabled. A disabled control can't be interacted with, and it is not in the tab chain.
 				 */
-				disabled: {
+				enabled: {
 					type: "boolean",
-					defaultValue: false
+					defaultValue: true,
+					mapping: {
+						type: "attribute",
+						to: "disabled",
+						formatter: "_mapEnabled"
+					}
 				},
 
 				/**
@@ -150,7 +159,6 @@ sap.ui.define([
 				 */
 				width: {
 					type: "sap.ui.core.CSSSize",
-					defaultValue: null,
 					mapping: "style"
 				}
 			},
@@ -192,6 +200,8 @@ sap.ui.define([
 	 * @function
 	 */
 
+	EnabledPropagator.call(FileUploader.prototype);
+
 	/* CUSTOM CODE START */
 	/* CUSTOM CODE END */
 

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

@@ -24,7 +24,7 @@ sap.ui.define([
 	 * The <code>sap.ui.webc.main.GroupHeaderListItem</code> is a special list item, used only to separate other list items into logical groups.
 	 *
 	 * @author SAP SE
-	 * @version 1.99.1
+	 * @version 1.102.0
 	 *
 	 * @constructor
 	 * @public

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

@@ -42,14 +42,14 @@ sap.ui.define([
 	 * <br>
 	 *
 	 * @author SAP SE
-	 * @version 1.99.1
+	 * @version 1.102.0
 	 *
 	 * @constructor
 	 * @public
 	 * @since 1.92.0
 	 * @experimental Since 1.92.0 This control is experimental and its API might change significantly.
 	 * @alias sap.ui.webc.main.Icon
-	 * @implements sap.ui.webc.main.IIcon, sap.ui.core.IFormContent
+	 * @implements sap.ui.webc.main.IIcon
 	 * @ui5-metamodel This control/element also will be described in the UI5 (legacy) designtime metamodel
 	 */
 	var Icon = WebComponent.extend("sap.ui.webc.main.Icon", {
@@ -57,8 +57,7 @@ sap.ui.define([
 			library: "sap.ui.webc.main",
 			tag: "ui5-icon-ui5",
 			interfaces: [
-				"sap.ui.webc.main.IIcon",
-				"sap.ui.core.IFormContent"
+				"sap.ui.webc.main.IIcon"
 			],
 			properties: {
 
@@ -84,8 +83,7 @@ sap.ui.define([
 				 * Defines the background color of the control
 				 */
 				backgroundColor: {
-					type: "sap.ui.core.CSSSize",
-					defaultValue: null,
+					type: "sap.ui.core.CSSColor",
 					mapping: "style"
 				},
 
@@ -93,8 +91,7 @@ sap.ui.define([
 				 * Defines the color of the control
 				 */
 				color: {
-					type: "sap.ui.core.CSSSize",
-					defaultValue: null,
+					type: "sap.ui.core.CSSColor",
 					mapping: "style"
 				},
 
@@ -103,7 +100,6 @@ sap.ui.define([
 				 */
 				height: {
 					type: "sap.ui.core.CSSSize",
-					defaultValue: null,
 					mapping: "style"
 				},
 
@@ -151,7 +147,6 @@ sap.ui.define([
 				 */
 				width: {
 					type: "sap.ui.core.CSSSize",
-					defaultValue: null,
 					mapping: "style"
 				}
 			},

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

@@ -8,9 +8,12 @@
 sap.ui.define([
 	"sap/ui/webc/common/WebComponent",
 	"./library",
+	"sap/ui/core/EnabledPropagator",
 	"sap/ui/core/library",
-	"./thirdparty/Input"
-], function(WebComponent, library, coreLibrary) {
+	"./thirdparty/Input",
+	"./thirdparty/features/InputElementsFormSupport",
+	"./thirdparty/features/InputSuggestions"
+], function(WebComponent, library, EnabledPropagator, coreLibrary) {
 	"use strict";
 
 	var ValueState = coreLibrary.ValueState;
@@ -39,7 +42,6 @@ sap.ui.define([
 	 *
 	 *
 	 * <ul>
-	 *     <li>[F4], [ALT]+[UP], or [ALT]+[DOWN] - Opens value help if available, same as clicking the value help icon. (Does not open suggestion list.)</li>
 	 *     <li>[ESC] - Closes the suggestion list, if open. If closed or not enabled, cancels changes and reverts to the value which the Input field had when it got the focus.</li>
 	 *     <li>[ENTER] or [RETURN] - If suggestion list is open takes over the current matching item and closes it. If value state or group header is focused, does nothing.</li>
 	 *     <li>[DOWN] - Focuses the next matching item in the suggestion list.</li>
@@ -51,14 +53,14 @@ sap.ui.define([
 	 * </ul>
 	 *
 	 * @author SAP SE
-	 * @version 1.99.1
+	 * @version 1.102.0
 	 *
 	 * @constructor
 	 * @public
 	 * @since 1.92.0
 	 * @experimental Since 1.92.0 This control is experimental and its API might change significantly.
 	 * @alias sap.ui.webc.main.Input
-	 * @implements sap.ui.webc.main.IInput
+	 * @implements sap.ui.webc.main.IInput, sap.ui.core.IFormContent
 	 * @ui5-metamodel This control/element also will be described in the UI5 (legacy) designtime metamodel
 	 */
 	var Input = WebComponent.extend("sap.ui.webc.main.Input", {
@@ -66,25 +68,29 @@ sap.ui.define([
 			library: "sap.ui.webc.main",
 			tag: "ui5-input-ui5",
 			interfaces: [
-				"sap.ui.webc.main.IInput"
+				"sap.ui.webc.main.IInput",
+				"sap.ui.core.IFormContent"
 			],
 			properties: {
 
 				/**
-				 * Sets the accessible aria name of the component.
+				 * Defines the accessible aria name of the component.
 				 */
 				accessibleName: {
 					type: "string"
 				},
 
 				/**
-				 * Defines whether the component is in disabled state. <br>
-				 * <br>
-				 * <b>Note:</b> A disabled component is completely noninteractive.
+				 * Defines whether the control is enabled. A disabled control can't be interacted with, and it is not in the tab chain.
 				 */
-				disabled: {
+				enabled: {
 					type: "boolean",
-					defaultValue: false
+					defaultValue: true,
+					mapping: {
+						type: "attribute",
+						to: "disabled",
+						formatter: "_mapEnabled"
+					}
 				},
 
 				/**
@@ -214,7 +220,6 @@ sap.ui.define([
 				 */
 				width: {
 					type: "sap.ui.core.CSSSize",
-					defaultValue: null,
 					mapping: "style"
 				}
 			},
@@ -304,11 +309,19 @@ sap.ui.define([
 					}
 				}
 			},
+			methods: ["openPicker"],
 			getters: ["previewItem"],
 			designtime: "sap/ui/webc/main/designtime/Input.designtime"
 		}
 	});
 
+	/**
+	 * Manually opens the suggestions popover, assuming suggestions are enabled. Items must be preloaded for it to open.
+	 * @public
+	 * @name sap.ui.webc.main.Input#openPicker
+	 * @function
+	 */
+
 	/**
 	 * Returns the the suggestion item on preview.
 	 * @public
@@ -316,6 +329,8 @@ sap.ui.define([
 	 * @function
 	 */
 
+	EnabledPropagator.call(Input.prototype);
+
 	/* CUSTOM CODE START */
 	/* CUSTOM CODE END */
 

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

@@ -31,7 +31,7 @@ sap.ui.define([
 	 * The <code>sap.ui.webc.main.Label</code> appearance can be influenced by properties, such as <code>required</code> and <code>wrappingType</code>. The appearance of the Label can be configured in a limited way by using the design property. For a broader choice of designs, you can use custom styles.
 	 *
 	 * @author SAP SE
-	 * @version 1.99.1
+	 * @version 1.102.0
 	 *
 	 * @constructor
 	 * @public
@@ -84,7 +84,6 @@ sap.ui.define([
 				 */
 				width: {
 					type: "sap.ui.core.CSSSize",
-					defaultValue: null,
 					mapping: "style"
 				},
 
@@ -116,7 +115,8 @@ sap.ui.define([
 						to: "for"
 					}
 				}
-			}
+			},
+			designtime: "sap/ui/webc/main/designtime/Label.designtime"
 		}
 	});