@openui5/sap.m 1.96.2 → 1.97.0

package/src/sap/m/table/ColumnMenuEntry.js

@@ -0,0 +1,101 @@
+/*!
+ * OpenUI5
+ * (c) Copyright 2009-2021 SAP SE or an SAP affiliate company.
+ * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
+ */
+sap.ui.define([
+	"sap/ui/core/Element"
+], function (
+	Element
+) {
+	"use strict";
+
+	/**
+	 * Constructor for a new ColumnMenuEntry.
+	 *
+	 * @param {string} [sId] ID for the new control, generated automatically if no ID is given
+	 * @param {object} [mSettings] Initial settings for the new control
+	 *
+	 * @class
+	 * This control serves as a base class for elements residing inside the sap.m.table.ColumnMenu.
+	 * This base class is faceless and should be inherited to implement ColumnMenu items and quick actions.
+	 *
+	 * @extends sap.ui.core.Element
+	 *
+	 * @author SAP SE
+	 * @version 1.97.0
+	 *
+	 * @private
+	 * @experimental
+	 *
+	 * @alias sap.m.table.ColumnMenuEntry
+	 */
+	var ColumnMenuEntry = Element.extend("sap.m.table.ColumnMenuEntry", {
+		metadata: {
+			"abstract": true,
+			library: "sap.m",
+			properties: {
+				visible: {type: "boolean", defaultValue: true}
+			}
+		}
+	});
+
+	/**
+	 * This method can be used to retrieve the ColumnMenu, in which the entry resides in.
+	 *
+	 * If an entry is internally creating entries that use #getMenu or #getParent,
+	 * and returns them in #getEffectiveItems or #getEffectiveQuickActions, they
+	 * must be its children in the control tree.
+	 *
+	 * @returns {sap.m.ColumnMenu} The menu of the entry
+	 * @public
+	 */
+	ColumnMenuEntry.prototype.getMenu = function () {
+		var oElement = this.getParent();
+		while (oElement) {
+			if (oElement.isA("sap.m.table.ColumnMenu")) {
+				return oElement;
+			}
+			oElement = oElement.getMenu();
+		}
+		return undefined;
+	};
+
+	/**
+	 * This method can be used to retrieve the label of an entry.
+	 *
+	 * @returns {string} The label property specified in the control
+	 * @abstract
+	 */
+	ColumnMenuEntry.prototype.getLabel = function () {
+		if (this.getMetadata().hasProperty("label")) {
+			return this.getProperty("label");
+		}
+		throw new Error(this + " does not implement #getLabel");
+	};
+
+	/**
+	 * This method can be used to retrieve the content of an entry.
+	 *
+	 * @returns {sap.ui.core.Control} The control specified in the content aggregation
+	 * @abstract
+	 */
+	ColumnMenuEntry.prototype.getContent = function () {
+		if (this.getMetadata().hasAggregation("content")) {
+			return this.getAggregation("content");
+		}
+		throw new Error(this + " does not implement #getContent");
+	};
+
+	ColumnMenuEntry.prototype.setVisible = function (bVisible) {
+		if (this.getVisible() == bVisible) {
+			return this;
+		}
+
+		this.setProperty("visible", bVisible);
+		this.getMenu() && this.getMenu()._setItemVisibility(this, bVisible);
+		return this;
+	};
+
+	return ColumnMenuEntry;
+});

package/src/sap/m/table/ColumnMenuRenderer.js

@@ -0,0 +1,82 @@
+/*!
+ * OpenUI5
+ * (c) Copyright 2009-2021 SAP SE or an SAP affiliate company.
+ * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
+ */
+sap.ui.define([], function () {
+    "use strict";
+
+    var ColumnMenuRenderer = {
+        apiVersion: 2
+    };
+
+    ColumnMenuRenderer.render = function (oRm, oColumnMenu) {
+        oRm.openStart("div", oColumnMenu);
+        oRm.class("sapMTCMenu");
+        oRm.class("sapMWrapper");
+        oRm.openEnd();
+        if (oColumnMenu.getQuickActions().length > 0 || oColumnMenu.getAggregation("_quickActions")) {
+            this.renderQuickActions(oRm, oColumnMenu);
+        }
+        if (oColumnMenu.getItems().length > 0 || oColumnMenu.getAggregation("_items")) {
+            this.renderItems(oRm, oColumnMenu);
+        }
+        oRm.close("div");
+    };
+
+    ColumnMenuRenderer.renderQuickActions = function (oRm, oColumnMenu) {
+        oRm.openStart("div");
+        oRm.attr("id", oColumnMenu.getId() + "-quickActions");
+        if (oColumnMenu._oItemsContainer) {
+            if (oColumnMenu._oItemsContainer.getCurrentViewKey() === "$default") {
+                oRm.class("sapMTQAList");
+            } else {
+                oRm.class("sapMTQAListHidden");
+            }
+        } else {
+            oRm.class("sapMTQAList");
+        }
+        oRm.openEnd();
+        // Control quick actions
+        (oColumnMenu.getAggregation("_quickActions") || []).forEach(function (oQuickAction) {
+            oQuickAction.getEffectiveQuickActions().forEach(function (oQuickAction) {
+                this.renderQuickAction(oRm, oQuickAction);
+            }.bind(this));
+        }.bind(this));
+        // Application quick actions
+        oColumnMenu.getQuickActions().forEach(function (oQuickAction) {
+            oQuickAction.getEffectiveQuickActions().forEach(function (oQuickAction) {
+                this.renderQuickAction(oRm, oQuickAction);
+            }.bind(this));
+        }.bind(this));
+        oRm.close("div");
+    };
+
+    ColumnMenuRenderer.renderQuickAction = function (oRm, oQuickAction) {
+        oRm.openStart("div", oQuickAction);
+        oRm.class("sapMQAction");
+        oRm.openEnd();
+        // Label
+        oRm.openStart("div");
+        oRm.class("sapMQALabel");
+        oRm.openEnd();
+        oRm.text(oQuickAction.getLabel());
+        oRm.close("div");
+        // Content
+        oRm.openStart("div");
+        oRm.openEnd();
+        oRm.renderControl(oQuickAction.getContent());
+        oRm.close("div");
+        oRm.close("div");
+    };
+
+    ColumnMenuRenderer.renderItems = function (oRm, oColumnMenu) {
+        oRm.openStart("div");
+        oRm.class("sapMContainerWrapper");
+        oRm.openEnd();
+        oRm.renderControl(oColumnMenu._oItemsContainer);
+        oRm.close("div");
+    };
+
+    return ColumnMenuRenderer;
+});

package/src/sap/m/table/Item.js

@@ -0,0 +1,130 @@
+/*!
+ * OpenUI5
+ * (c) Copyright 2009-2021 SAP SE or an SAP affiliate company.
+ * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
+ */
+sap.ui.define([
+	"sap/m/table/ItemBase"
+], function(
+	ItemBase
+) {
+	"use strict";
+
+	/**
+	 * Constructor for a new Item.
+	 *
+	 * @param {string} [sId] ID for the new control, generated automatically if no ID is given
+	 * @param {object} [mSettings] Initial settings for the new control
+	 *
+	 * @class
+	 * This control serves as a menu item for the sap.m.table.ColumnMenu.
+	 * It can be used to specify control- and application-specific items.
+	 *
+	 * @extends sap.m.table.ItemBase
+	 *
+	 * @author SAP SE
+	 * @version 1.97.0
+	 *
+	 * @private
+	 * @experimental
+	 *
+	 * @alias sap.m.table.Item
+	 */
+	var Item = ItemBase.extend("sap.m.table.Item", {
+		metadata: {
+			library: "sap.m",
+			properties: {
+				/**
+				 * Defines the label, which should be used for the buttons.
+				 */
+				label: {type: "string"},
+				/**
+				 * Defines the icon for the menu item.
+				 */
+				icon: {type: "sap.ui.core.URI"},
+				/**
+				 * Defines whether the reset button should be shown, when navigating to the item.
+				 */
+				showResetButton: {type: "boolean", defaultValue: true},
+				/**
+				 * Defines whether the reset button should be enabled, when navigating to the item.
+				 */
+				resetButtonEnabled: {type: "boolean", defaultValue: true},
+				/**
+				 * Defines whether the confirm button should be shown, when navigating to the item.
+				 */
+				showConfirmButton: {type: "boolean", defaultValue: true},
+				/**
+				 * Defines whether the cancel button should be shown, when navigating to the item.
+				 */
+				showCancelButton: {type: "boolean", defaultValue: true}
+			},
+			aggregations: {
+				/**
+				 * Defines the content, which should be shown when navigating to the item.
+				 */
+				content: {type: "sap.ui.core.Control", multiple: false}
+			},
+			events: {
+				/**
+				 * This event will be fired, when the reset button was pressed.
+				 */
+				reset: {},
+				/**
+				 * This event will be fired, when the confirm button was pressed.
+				 */
+				confirm: {},
+				/**
+				 * This event will be fired, when the cancel button was pressed.
+				 */
+				cancel: {}
+			}
+		}
+	});
+
+	/**
+	 * @override
+	 */
+	Item.prototype.setShowResetButton = function (bShowResetButton) {
+		this.setProperty("showResetButton", bShowResetButton);
+		this.changeButtonSettings({
+			reset: {visible: bShowResetButton}
+		});
+		return this;
+	};
+
+	/**
+	 * @override
+	 */
+	Item.prototype.setResetButtonEnabled = function (bResetButtonEnabled) {
+		this.setProperty("resetButtonEnabled", bResetButtonEnabled);
+		this.changeButtonSettings({
+			reset: {enabled: bResetButtonEnabled}
+		});
+		return this;
+	};
+
+	/**
+	 * @override
+	 */
+	Item.prototype.setShowConfirmButton = function (bShowConfirmButton) {
+		this.setProperty("showConfirmButton", bShowConfirmButton);
+		this.changeButtonSettings({
+			confirm: {visible: bShowConfirmButton}
+		});
+		return this;
+	};
+
+	/**
+	 * @override
+	 */
+	Item.prototype.setShowCancelButton = function (bShowCancelButton) {
+		this.setProperty("showCancelButton", bShowCancelButton);
+		this.changeButtonSettings({
+			cancel: {visible: bShowCancelButton}
+		});
+		return this;
+	};
+
+	return Item;
+});

package/src/sap/m/table/ItemBase.js

@@ -0,0 +1,153 @@
+/*!
+ * OpenUI5
+ * (c) Copyright 2009-2021 SAP SE or an SAP affiliate company.
+ * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
+ */
+sap.ui.define([
+	"sap/m/table/ColumnMenuEntry"
+], function(
+	ColumnMenuEntry
+) {
+	"use strict";
+
+	/**
+	 * Constructor for a new ItemBase.
+	 *
+	 * @param {string} [sId] ID for the new control, generated automatically if no ID is given
+	 * @param {object} [mSettings] Initial settings for the new control
+	 *
+	 * @class
+	 * The ItemBase control serves as a base class for menu items for the sap.m.table.ColumnMenu.
+	 * This base class is faceless and should be inherited by controls, which intend to be menu items
+	 * for the sap.m.table.ColumnMenu.
+	 *
+	 * @extends sap.m.table.ColumnMenuEntry
+	 *
+	 * @author SAP SE
+	 * @version 1.97.0
+	 *
+	 * @private
+	 * @experimental
+	 *
+	 * @alias sap.m.table.ItemBase
+	 */
+	var ItemBase = ColumnMenuEntry.extend("sap.m.table.ItemBase", {
+		metadata: {
+			"abstract": true,
+			library: "sap.m"
+		}
+	});
+
+	ItemBase.prototype.init = function () {
+		this._oButtonSettings = {
+			reset: {visible: true, enabled: true},
+			confirm: {visible: true, enabled: true},
+			cancel: {visible: true, enabled: true}
+		};
+	};
+
+	/**
+	 * This method can be used to retrieve the effective items of the item.
+	 *
+	 * This method allows subclasses to return composition of other items, if they contain multiple items or controls.
+	 * @returns {Array<sap.m.table.ItemBase>} A composition of effective items
+	 *
+	 * @protected
+	 */
+	ItemBase.prototype.getEffectiveItems = function() {
+		return [this];
+	};
+
+	/**
+	 * This method can be used to retrieve the set icon for a item.
+	 *
+	 * @returns {sap.ui.core.URI} The specified icon
+	 *
+	 * @protected
+	 */
+	ItemBase.prototype.getIcon = function() {
+		if (this.getMetadata().hasProperty("icon")) {
+			return this.getProperty("icon");
+		}
+		throw new Error(this + " does not implement #getIcon");
+	};
+
+	/**
+	 * This method can be used as an event handler for a press event.
+	 *
+	 * @param {jQuery.Event} oEvent The emitted event
+	 *
+	 * @protected
+	 */
+	ItemBase.prototype.onPress = function (oEvent) {
+	};
+
+	/**
+	 * This method can be used as an event handler for a back event.
+	 *
+	 * @param {jQuery.Event} oEvent The emitted event
+	 *
+	 * @protected
+	 */
+	ItemBase.prototype.onBack = function (oEvent) {
+	};
+
+	/**
+	 * This method can be used as an event handler for a confirm event.
+	 *
+	 * @param {jQuery.Event} oEvent The emitted event
+	 *
+	 * @protected
+	 */
+	ItemBase.prototype.onConfirm = function (oEvent) {
+	};
+
+	/**
+	 * This method can be used as an event handler for a cancel event.
+	 *
+	 * @param {jQuery.Event} oEvent The emitted event
+	 *
+	 * @protected
+	 */
+	ItemBase.prototype.onCancel = function (oEvent) {
+	};
+
+	/**
+	 * This method can be used as an event handler for a reset event.
+	 *
+	 * @param {jQuery.Event} oEvent The emitted event
+	 *
+	 * @protected
+	 */
+	ItemBase.prototype.onReset = function (oEvent) {
+	};
+
+	/**
+	 * This method can be used to retrieve the button settings.
+	 *
+	 * @protected
+	 */
+	ItemBase.prototype.getButtonSettings = function () {
+		return this._oButtonSettings;
+	};
+
+	/**
+	 * This method can be used to change the button settings of an item.
+	 *
+	 * @param {object} oButtonSettings Object containing button settings
+	 *
+	 * @protected
+	 */
+	ItemBase.prototype.changeButtonSettings = function (oButtonSettings) {
+		Object.keys(oButtonSettings).forEach(function (sButtonKey) {
+			if (this._oButtonSettings.hasOwnProperty(sButtonKey)) {
+				Object.keys(oButtonSettings[sButtonKey]).forEach(function (sSettingKey) {
+					this._oButtonSettings[sButtonKey][sSettingKey] = oButtonSettings[sButtonKey][sSettingKey];
+				}, this);
+			}
+		}, this);
+		this.getMenu() && this.getMenu()._updateButtonState(this);
+	};
+
+    return ItemBase;
+});

package/src/sap/m/table/QuickAction.js

@@ -0,0 +1,53 @@
+/*!
+ * OpenUI5
+ * (c) Copyright 2009-2021 SAP SE or an SAP affiliate company.
+ * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
+ */
+
+sap.ui.define([
+	"sap/m/table/QuickActionBase"
+], function (
+	QuickActionBase
+) {
+	"use strict";
+
+	/**
+	 * Constructor for a new QuickAction.
+	 *
+	 * @param {string} [sId] ID for the new control, generated automatically if no ID is given
+	 * @param {object} [mSettings] Initial settings for the new control
+	 *
+	 * @class
+	 * This control serves as a quick action for sap.m.table.ColumnMenu.
+	 * It can be used to specify control- and application specific quick actions.
+	 *
+	 * @extends sap.m.table.QuickActionBase
+	 *
+	 * @author SAP SE
+	 * @version 1.97.0
+	 *
+	 * @private
+	 * @experimental
+	 *
+	 * @alias sap.m.table.QuickAction
+	 */
+	var QuickAction = QuickActionBase.extend("sap.m.table.QuickAction", {
+		metadata: {
+			library: "sap.m",
+			properties: {
+				/**
+				 * Defines the text for the label.
+				 */
+				label: { type: "string" }
+			},
+			aggregations: {
+				/**
+				 * Defines the content, which should be shown for the quick action.
+				 */
+				content: { type: "sap.ui.core.Control", multiple: false }
+			}
+		}
+	});
+
+	return QuickAction;
+});

package/src/sap/m/table/QuickActionBase.js

@@ -0,0 +1,53 @@
+/*!
+ * OpenUI5
+ * (c) Copyright 2009-2021 SAP SE or an SAP affiliate company.
+ * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
+ */
+sap.ui.define([
+	"sap/m/table/ColumnMenuEntry"
+], function(
+	ColumnMenuEntry
+) {
+	"use strict";
+
+	/**
+	 * Constructor for a new QuickActionBase.
+	 *
+	 * @param {string} [sId] ID for the new control, generated automatically if no ID is given
+	 * @param {object} [mSettings] Initial settings for the new control
+	 *
+	 * @class
+	 * This control serves as a base class for quick actions.
+	 * This base class is faceless and should be inherited by controls, which intend to
+	 * serve as quick actions for the sap.m.table.ColumnMenu.
+	 *
+	 * @extends sap.m.table.ColumnMenuEntry
+	 *
+	 * @author SAP SE
+	 * @version 1.97.0
+	 *
+	 * @private
+	 * @experimental
+	 *
+	 * @alias sap.m.table.QuickActionBase
+	 */
+	var QuickActionBase = ColumnMenuEntry.extend("sap.m.table.QuickActionBase", {
+		metadata: {
+			"abstract": true,
+			library: "sap.m"
+		}
+	});
+
+	/**
+	 * This method can be used to retrieve the effective quick actions.
+	 *
+	 * Sublasses can implement this method, if there are compositions of other quick actions.
+	 * @returns {Array<sap.m.table.QuickActionBase>} The effective quick actions
+	 *
+	 * @public
+	 */
+	QuickActionBase.prototype.getEffectiveQuickActions = function() {
+		return [this];
+	};
+	return QuickActionBase;
+});

package/src/sap/m/table/Util.js

@@ -8,7 +8,7 @@
  * @class Provides utility functions for tables
  * @alias sap.m.table.Util
  * @author SAP SE
- * @version 1.96.2
+ * @version 1.97.0
  * @since 1.96.0
  * @private
  * @static

package/src/sap/m/themes/base/AbstractContainer.less

@@ -14,4 +14,19 @@
 
 .sapUiMAbstractContainerContent .wrapperDefaultList .sapMLIB{
     padding: 1.5rem;
+}
+
+.sapMAbstractContainer .sapMPage {
+	display: flex;
+	flex-direction: column;
+
+	&>section {
+		flex-grow: 1;
+		position: unset;
+		top: 0;
+	}
+
+	>footer:not(.sapUiHidden) {
+		position: relative;
+	}
 }

package/src/sap/m/themes/base/Breadcrumbs.less

@@ -33,12 +33,12 @@
 		}
 	}
 
-	.sapMBreadcrumbsItem.sapMBreadcrumbsSelectItem > 
+	.sapMBreadcrumbsItem.sapMBreadcrumbsSelectItem >
 	.sapMSlt.sapMSltIconOnly.sapMSltWithIcon.sapMSltHoverable.sapMSltWithArrow {
 		background: transparent;
 		border: none;
 
-		&:focus,
+		&.sapMSltFocused,
 		&:hover {
 			.sapMSltIcon:before {
 				color: @sapUiLinkHover;

package/src/sap/m/themes/base/ColumnMenu.less

@@ -0,0 +1,41 @@
+/* ======================================= */
+/* CSS for control sap.m/table/ColumnMenu  */
+/* Base theme                              */
+/* ======================================= */
+
+.sapMTCMenu {
+
+}
+
+.sapMTCMenu.sapMWrapper {
+	display: flex;
+	flex-direction: column;
+	height: 100%;
+
+	.sapMContainerWrapper {
+		height: 100%;
+		overflow: hidden;
+	}
+}
+
+.sapMTCMenu .sapMTQAList{
+	display: grid;
+	grid-template-columns: minmax(min-content, max-content) 2fr;
+	column-gap: 10px;
+	row-gap: 5px;
+	padding: .5rem 1rem .5rem 1rem;
+}
+
+.sapMTCMenu .sapMTQAListHidden {
+	display: none;
+}
+
+.sapMTCMenu .sapMTQAList .sapMQAction {
+	display: contents;
+
+	.sapMQALabel {
+		justify-self: end;
+		align-self: center;
+		text-align: end;
+	}
+}

package/src/sap/m/themes/base/ComboBox.less

@@ -5,6 +5,6 @@
 
 .sapMComboBoxBasePicker-CTX .sapMComboBoxList.sapMListFocus .sapMLIBSelected,
 .sapMComboBoxBasePicker-CTX .sapMComboBoxList.sapMListFocus .sapMComboBoxBaseNonInteractiveItem.sapMLIBFocused {
-	outline: 1px dotted @sapUiContentFocusColor;
-	outline-offset: -2px;
+	outline: @sapUiContentFocusWidth @sapUiContentFocusStyle @sapUiContentFocusColor;
+	outline-offset: -0.125rem;
 }

package/src/sap/m/themes/base/ComboBoxBase.less

@@ -3,12 +3,32 @@
 /* Base theme                          */
 /* =================================== */
 
+.sapMComboBoxBase.sapMInputBaseHasEndIcons .sapMInputBaseInner {
+	width: auto;
+	flex: 1
+}
+
+.sapMComboBoxBase .sapMInputBaseContentWrapper {
+	display: inline-flex;
+}
+
 /* ------------------------------ */
 /* arrow                          */
 /* ------------------------------ */
 
 .sapMComboBoxBase.sapMInputBaseReadonly .sapMInputBaseIcon {
 	opacity: 0;
+	cursor: default;
+}
+
+.sapMInputBase:not(.sapMInputBaseDisabled):not(.sapMInputBaseIconPressed).sapMComboBoxBase.sapMComboBoxBaseArrowPressed .sapMInputBaseIconContainer .sapMInputBaseIcon:last-child {
+	background: @sapUiToggleButtonPressedBackground;
+	&:hover {
+		background: @sapUiToggleButtonPressedBackground;
+	}
+	&::before {
+		color: @sapUiToggleButtonPressedTextColor;
+	}
 }
 
 /* ------------------------------ */