What’s New in Guideline Version 1.124

AI and Joule Design

Topic	Update	Topic Link
Recommendations	We are no longer using confidence levels for recommendations.	Recommendations

UI Elements – SAPUI5

Topic	Update	Topic Link
List Planning Calendar Single Planning Calendar Tree	Drag and Drop: To comply with the new WCAG 2.2 accessibility standard, these controls must offer an alternative to the drag and drop feature.	List Planning Calendar Single Planning Calendar Tree
	Spacing: If the display component is interactive, ensure minimum spacing of 24 x 24 px around the display component. This space should not overlap or intersect with the target areas of any other components. The minimum target size is required to comply with the WCAG 2.2 accessibility standard.	Object Display Components

UI Elements – Web Components

Topic	Update	Topic Link
Color Picker  NEW	Guideline for the web component implementation of the color picker.	Color Picker
States  NEW	We’ve added interaction design foundation guidelines for the following states: Component states Focus states Interaction states Selection states In addition, there’s a new article on how states can be combined. You can access all the guidelines on states via the States overview topic, including the existing Value States guideline.	States (overview) Component StatesFocus StatesInteraction StatesSelection States State Combinations
Text  NEW	Guideline for the web component implementation of the text component. Note: The guideline describes the target design. The web component doesn’t yet offer all the specified features.	Text

SAP Fiori Elements Framework

Topic	Update	Topic Link
Table Features	A generic context menu is activated by default and cannot be deactivated for: All table types with SAP Fiori elements for OData V2 All table types except the tree table, with SAP Fiori elements for OData V4 The generic context menu generally behaves like the standard context menu described in the articles for each table type. The context of the menu can be a single row or multiple selected rows. The following action types are available on the generic context menu: All toolbar actions that become active only if rows are selected Developers call them “bounded toolbar actions” or “context-dependent actions.” The “Open in New Tab or Window” action It allows up to 10 items to be opened in separate tabs or windows depending on the user’s browser settings. Similar to the standard context menu, if a control inside a row is the “click target”, and the control also provides a context menu, the control menu “wins”.	Table Features (SAP Fiori Elements) – Generic Context Menu

Designer Toolkit

Topic	Update	Topic Link
Download Fonts	SAP icon font: Download files were updated to version 5.8 (Horizon theme) and 4.20 (Quartz theme).	Download Fonts
SAP S/4HANNA Web UI Kit	The SAP S/4HANA Web UI Kit is now published via the Figma Community. The kit includes both cozy and compact form factors.	SAP S/4HANA Web UI Kit

About Guideline Updates

With each new guideline version,   two types of update are offered:

• Updates to reflect new or changed UI controls available with SAPUI5 or SAP Web Components.

• Ongoing updates on how to best apply the SAP Fiori design (such as patterns, floorplans, and additional decision support). These updates are introduced with a given guideline version, but are not necessarily dependent on a specific SAPUI5 version.

Note: If you are working with an earlier SAPUI5 release, also consider checking out the most recent guideline version to get the latest general guidance.