Merge remote-tracking branch 'origin/main' into fix/shellbar-search-first-item-focus

Author: dobrinyonkov

CHANGELOG.md

@@ -3,6 +3,44 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [2.14.0-rc.0](https://github.com/SAP/ui5-webcomponents/compare/v2.13.0...v2.14.0-rc.0) (2025-08-07)
+
+
+### Bug Fixes
+
+* **framework:** copy "base" pkg i18n assets to `dist/prod` ([#12072](https://github.com/SAP/ui5-webcomponents/issues/12072)) ([7460a76](https://github.com/SAP/ui5-webcomponents/commit/7460a76a803dc12ce92574472084a0c202d984a3))
+* **framework:** sap-ui-themeRoot block all origins by defaultTheme root disallow default ([#12035](https://github.com/SAP/ui5-webcomponents/issues/12035)) ([8fa82da](https://github.com/SAP/ui5-webcomponents/commit/8fa82da97756e1eb146cabadd75065a1ba2695f5))
+* **ui5-search:** visual issues ([#12061](https://github.com/SAP/ui5-webcomponents/issues/12061)) ([6aab670](https://github.com/SAP/ui5-webcomponents/commit/6aab670027a9ea08b01f42b2a8467499966990d2)), closes [#11982](https://github.com/SAP/ui5-webcomponents/issues/11982) [#11964](https://github.com/SAP/ui5-webcomponents/issues/11964) [#11981](https://github.com/SAP/ui5-webcomponents/issues/11981) [#11999](https://github.com/SAP/ui5-webcomponents/issues/11999) [#12042](https://github.com/SAP/ui5-webcomponents/issues/12042) [#11955](https://github.com/SAP/ui5-webcomponents/issues/11955)
+* **ui5-shellbar:** separator height is fixed ([#12056](https://github.com/SAP/ui5-webcomponents/issues/12056)) ([0995652](https://github.com/SAP/ui5-webcomponents/commit/0995652783f2abd8afad99610213866d2881b261))
+
+
+### Features
+
+* **ui5-date-picker:** add valueFormat and displayFormat ([#11751](https://github.com/SAP/ui5-webcomponents/issues/11751)) ([2acdbcc](https://github.com/SAP/ui5-webcomponents/commit/2acdbcc4f6e59b01987c7a9456d455bccecf3a8e)), closes [#1957](https://github.com/SAP/ui5-webcomponents/issues/1957)
+
+
+
+
+
+# [2.13.0](https://github.com/SAP/ui5-webcomponents/compare/v2.13.0-rc.3...v2.13.0) (2025-08-04)
+
+
+### Bug Fixes
+
+* **ui5-color-picker:** ensure RGB and HSL values are within limits ([#11915](https://github.com/SAP/ui5-webcomponents/issues/11915)) ([0cee9f7](https://github.com/SAP/ui5-webcomponents/commit/0cee9f71d154dcc699b45d9a5755d7fc17644785))
+
+
+### Features
+
+* **ui5-icon:** display custom SVG, defined as JSX template ([#11966](https://github.com/SAP/ui5-webcomponents/issues/11966)) ([1e7e2a6](https://github.com/SAP/ui5-webcomponents/commit/1e7e2a6a155bb36e0cd50ebea6ac6e30e47f8da6))
+* **ui5-input:** align value state message to spec ([#12017](https://github.com/SAP/ui5-webcomponents/issues/12017)) ([793038b](https://github.com/SAP/ui5-webcomponents/commit/793038b16b8f9a2de06325602e41b316c6267ab0))
+* **ui5-li-group:** introduced wrappingType prop ([#12022](https://github.com/SAP/ui5-webcomponents/issues/12022)) ([4c1a506](https://github.com/SAP/ui5-webcomponents/commit/4c1a50661fdc349682ff4c8fc1bb28d9eb43f5b2))
+* **ui5-popover:** support setting "null" for opener ([#11995](https://github.com/SAP/ui5-webcomponents/issues/11995)) ([7d012aa](https://github.com/SAP/ui5-webcomponents/commit/7d012aa5667143f4bbdbb9310771dc296de12cbe))
+
+
+
+
+
 # [2.13.0-rc.3](https://github.com/SAP/ui5-webcomponents/compare/v2.13.0-rc.2...v2.13.0-rc.3) (2025-07-31)
 
 

README.md

@@ -24,12 +24,12 @@
 ## More Resources
 - [UI5 Web Components Home Page](https://sap.github.io/ui5-webcomponents)
 - [Configuring UI5 Web Components](./docs/2-advanced/01-configuration.md)
-- [Customizing with `UI Theme Designer`](./docs/3-customizing/12-theming.md)
+- [Customizing with `UI Theme Designer`](./docs/2-advanced/12-theming.md)
 - [Creating a Custom UI5 Web Components Package](docs/4-development/01-package.md)
 - [Developing Custom UI5 Web Components](docs/4-development/02-component.md)
 - [Micro-Frontends and Custom Elements Scoping](./docs/2-advanced/06-scoping.md)
-- [Release Management](./docs/Release%20Management.md)
-- [F.A.Q.](./docs/FAQ.md)
+- [Release Management](./docs/08-Releases.md)
+- [F.A.Q.](./docs/09-FAQ.md)
 
 ## Related Projects
 
@@ -85,7 +85,7 @@ Moreover, all Angular-specific features, such as two-way data binding and Angula
 	<ui5-button>Hello world!</ui5-button>
 	```
 
-	For more information, see [Importing UI5 Web Components](./docs/1-getting-started/02-importing-components.md) and [Understanding UI5 Web Components APIs](./docs/1-getting-started/03-understanding-components-APIs.md).
+	For more information, see [Importing UI5 Web Components](https://sap.github.io/ui5-webcomponents/docs/getting-started/components-packages/) and [Understanding UI5 Web Components APIs](https://sap.github.io/ui5-webcomponents/docs/getting-started/components-APIs/).
 
 ## Typescript Support
 TypeScript Support is enabled for both component development and component consumption.

docs/2-advanced/01-configuration.md

@@ -270,6 +270,8 @@ Example:
 ### themeRoot
 <a name="themeRoot"></a>
 
+**Deprecated:** Please use the `theme` setting to pass both the theme and theme root, in the `theme@themeRoot` format instead
+
 Allows you to set a URL, from which the framework will fetch the theme styles (CSS variables).
 
 *Note:* This configuration setting is only applicable to custom themes, created with SAP Theme Designer.
@@ -283,6 +285,25 @@ Example:
 </script>
 ```
 
+or, the preferred new format:
+
+```html
+<script data-ui5-config type="application/json">
+{
+	"theme": "sap_horizon@https://my-example-host.com/"
+}
+</script>
+```
+
+*Important:* You must explicitly allow specific origins for this configuration setting to work:
+
+```html
+<head>
+	<meta name="sap-allowed-theme-origins" content="https://my-example-host.com/,https://my-example-host2.com/">
+```
+
+Failing to do so will result in a warning in the console and the theme root will not be set.
+
 ## Configuration Script
 <a name="script"></a>
 

docs/2-advanced/11-styles.md

@@ -21,6 +21,7 @@ You can try this yourself using the Input [sample](https://sap.github.io/ui5-web
 
 Unfortunately, this can't be done for all components because it depends on the complexity of the DOM structure.
 
+**Note:** It’s strongly recommended to apply styles directly at the tag level for basic sizing properties (e.g., margin, padding, width, height) to avoid design inconsistencies across the page. For other style changes, consider using the **UI Theme Designer** to ensure consistency. For details, see the [UI Theme Designer](./12-theming.md) article.
 
 ## Usage of CSS Shadow Parts
 
@@ -31,7 +32,7 @@ For more complex components, the styling on the tag level is not possible, there
 ```html
 <ui5-card>
 	<ui5-card-header
-        title-text="Quick Links"
+		title-text="Quick Links"
 		status="4 of 10"
 		slot="header">
 	</ui5-card-header>
@@ -46,7 +47,6 @@ ui5-card-header::part(status) {
 
 <b>Note:</b> All available shadow parts are described in the API reference as part of the "Overview" section of each component.
 
-
 ## Changing CSS Variables
 
 The UI5 WebComponents leverage CSS variables, so if you inspect the elements inside the Shadow DOM, you will probably find which variable you need to change. Check the list of all [Global CSS Variables](https://github.com/SAP/theming-base-content/blob/master/content/Base/baseLib/sap_horizon/css_variables.css) that we use in the component. Altering them will change the component appearance.
@@ -63,6 +63,7 @@ ui5-button {
 }
 ```
 
+**Note:** Whenever possible, override CSS variables through the **UI Theme Designer**. This ensures consistent updates across all components where the variable is used, helping maintain a cohesive design. For details, see the [UI Theme Designer](./12-theming.md) article.
 
 ## Custom Theme Schema
 

docs/2-advanced/12-theming.md

@@ -102,13 +102,13 @@ index.html?sap-ui-theme=mytheme@https://my-example-host.com/
 
 In this example, "mytheme" theme will be applied and its resources (CSS variables specific to the theme) will be loaded from https://my-example-host.com/UI5/Base/baseLib/mytheme/css_variables.css.
 
-**Note:** Certain security restrictions will apply before loading the custom theme. Absolute URLs to a different origin than the current page will return the current page as an origin. To allow certain origins, you have to use `<meta name="sap-allowedThemeOrigins" content="https://my-example-host.com/">` tag inside the head of the page.
+**Note:** Certain security restrictions will apply before loading the custom theme. Absolute URLs to a different origin than the current page will return the current page as an origin. To allow certain origins, you have to use `<meta name="sap-allowed-theme-origins" content="https://my-example-host.com/">` tag inside the head of the page.
 
 ### Using JS API
 
 To load a custom theme via URL, you can also use the available `setThemeRoot` method. The specified theme root will be applied to the currently set theme.
 
-**Note:** Certain security restrictions will apply before loading the custom theme. Absolute URLs to a different origin than the current page will return the current page as an origin. To allow certain origins, you have to use `<meta name="sap-allowedThemeOrigins" content="https://my-example-host.com/">` tag inside the head of the page.
+**Note:** Certain security restrictions will apply before loading the custom theme. Absolute URLs to a different origin than the current page will return the current page as an origin. To allow certain origins, you have to use `<meta name="sap-allowed-theme-origins" content="https://my-example-host.com/">` tag inside the head of the page.
 
 ```js
 import { setThemeRoot } from "@ui5/webcomponents-base/dist/config/ThemeRoot.js";

docs/3-frameworks/01-React.md

@@ -77,6 +77,31 @@ For boolean properties like ```collapsed```  in ```ui5-panel```, instead of sett
 </ui5-panel>
 ```
 
+### Using UI5 Web Components in TSX
+
+When using UI5 Web Components like `<ui5-input>` in a `.tsx` file, you may encounter the following TypeScript error:
+
+```ts
+Property 'ui5-input' does not exist on type 'JSX.IntrinsicElements'. ts(2339)
+```
+
+This happens because **TypeScript’s `JSX.IntrinsicElements` only includes standard HTML tags by default** (`<div>`, `<span>`, etc.).
+Custom elements, such as those from UI5, are not recognized unless you explicitly declare them.
+
+To make TypeScript aware of your UI5 Web Components, you need to **extend the `JSX.IntrinsicElements` interface** with the custom tags you plan to use.
+
+```ts
+declare namespace JSX {
+  interface IntrinsicElements {
+    'ui5-input': any; // Replace `any` with a proper type
+    // Add more UI5 web components here...
+  }
+}
+```
+
+Please refer to the [UI5 Web Components React sample](https://github.com/SAP-samples/ui5-webcomponents-sample-react/) for a complete example of using web components in React.
+
+
 ### UI5 Web Components for React
 
-As mentioned above, for a better development experience (and to elegantly work around these 2 React limitations), check out UI5 Web Components for React, [UI5 Web Components for React](https://github.com/SAP/ui5-webcomponents-react) and [this tutorial](https://developers.sap.com/mission.react-spa.html).
+As mentioned above, for a better development experience (and to elegantly work around these 3 React limitations), check out UI5 Web Components for React, [UI5 Web Components for React](https://github.com/SAP/ui5-webcomponents-react) and [this tutorial](https://developers.sap.com/mission.react-spa.html).

docs/4-development/01-package.md

@@ -91,6 +91,13 @@ The initialization script will create several NPM scripts for you in `package.js
 | test               | Run the dev server and execute the specs from the `test/specs/` directory.   |
 | create-ui5-element | Create an empty Web Component with the given name.                           |
 
+
+**Note**: The `create-ui5-element` command supports two optional environment variables that customize the output when used in a specific component package:
+
+* **UI5_TAG_NAME_PREFIX** - sets the tag name prefix for the generated Web Component. The resulting tag will follow the format: `{UI5_TAG_NAME_PREFIX}-component-name`. Defaults to `my` if not specified.
+
+* **UI5_TEMPLATE_FILENAME_SUFFIX** - sets the suffix for the generated template filename. The resulting filename will follow the format: `ComponentName{UI5_TEMPLATE_FILENAME_SUFFIX}.tsx`. Defaults to `Template` if not specified.
+
 ### Files in the main directory
 
 The initialization script will create several files in your package's main directory.

lerna.json

@@ -14,7 +14,7 @@
     "packages/create-package",
     "packages/compat"
   ],
-  "version": "2.13.0-rc.3",
+  "version": "2.14.0-rc.0",
   "command": {
     "publish": {
       "allowBranch": "*",

packages/ai/CHANGELOG.md

@@ -3,6 +3,22 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [2.14.0-rc.0](https://github.com/SAP/ui5-webcomponents/compare/v2.13.0...v2.14.0-rc.0) (2025-08-07)
+
+**Note:** Version bump only for package @ui5/webcomponents-ai
+
+
+
+
+
+# [2.13.0](https://github.com/SAP/ui5-webcomponents/compare/v2.13.0-rc.3...v2.13.0) (2025-08-04)
+
+**Note:** Version bump only for package @ui5/webcomponents-ai
+
+
+
+
+
 # [2.13.0-rc.3](https://github.com/SAP/ui5-webcomponents/compare/v2.13.0-rc.2...v2.13.0-rc.3) (2025-07-31)
 
 

packages/ai/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ui5/webcomponents-ai",
-  "version": "2.13.0-rc.3",
+  "version": "2.14.0-rc.0",
   "description": "UI5 Web Components: webcomponents.ai",
   "ui5": {
     "webComponentsPackage": true
@@ -48,14 +48,14 @@
     "directory": "packages/ai"
   },
   "dependencies": {
-    "@ui5/webcomponents": "2.13.0-rc.3",
-    "@ui5/webcomponents-base": "2.13.0-rc.3",
-    "@ui5/webcomponents-icons": "2.13.0-rc.3",
-    "@ui5/webcomponents-theming": "2.13.0-rc.3"
+    "@ui5/webcomponents": "2.14.0-rc.0",
+    "@ui5/webcomponents-base": "2.14.0-rc.0",
+    "@ui5/webcomponents-icons": "2.14.0-rc.0",
+    "@ui5/webcomponents-theming": "2.14.0-rc.0"
   },
   "devDependencies": {
     "@ui5/cypress-internal": "0.0.0",
-    "@ui5/webcomponents-tools": "2.13.0-rc.3",
+    "@ui5/webcomponents-tools": "2.14.0-rc.0",
     "chromedriver": "^137.0.4"
   }
 }