Merge branch 'main' into slider-rtl

SAP · Oct 18, 2024 · d01542b · d01542b
2 parents 36c6fdc + 95db5c6
commit d01542b
Show file tree

Hide file tree

Showing 109 changed files with 1,544 additions and 291 deletions.
diff --git a/.github/actions/release.js → .github/actions/release.cjs b/.github/actions/release.js → .github/actions/release.cjs
diff --git a/.github/workflows/release-experimental.yaml b/.github/workflows/release-experimental.yaml
@@ -23,4 +23,4 @@ jobs:
  env:
  NPM_AUTH_TOKEN: ${{ secrets.NPM_RELEASE_AUTH_TOKEN }}
  run: |
- node ./.github/actions/release.js
+ node ./.github/actions/release.cjs
diff --git a/.gitignore b/.gitignore
@@ -11,6 +11,7 @@ dist
 packages/compat/test/pages/scoped
 packages/main/test/pages/scoped
 packages/fiori/test/pages/scoped
+packages/ai/test/pages/scoped
 
 # Ignore npm files/folders
 node_modules

diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -3,6 +3,32 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [2.4.0-rc.1](https://github.com/SAP/ui5-webcomponents/compare/v2.4.0-rc.0...v2.4.0-rc.1) (2024-10-17)
+
+
+### Bug Fixes
+
+* **framework:** always fire languageChange regardless of boot status ([#10029](https://github.com/SAP/ui5-webcomponents/issues/10029)) ([9261ac9](https://github.com/SAP/ui5-webcomponents/commit/9261ac93211ac431b9c1d95d255a6bb8bc3ff815))
+* **localization:** legacy date customization ([#10026](https://github.com/SAP/ui5-webcomponents/issues/10026)) ([273c015](https://github.com/SAP/ui5-webcomponents/commit/273c01597ae483fdfe1996dad733d32e4c9a13a9))
+* scoping issues and document how scoping is used correctly ([#10023](https://github.com/SAP/ui5-webcomponents/issues/10023)) ([ee808c3](https://github.com/SAP/ui5-webcomponents/commit/ee808c309f316fe145b05d292c92328396c655ab))
+* **tools:** revert tsconfig moduleResolution to node ([#10014](https://github.com/SAP/ui5-webcomponents/issues/10014)) ([0724b92](https://github.com/SAP/ui5-webcomponents/commit/0724b9289ad04f88972d4978ed37e76f13abca13))
+* **ui5-notification-list-group:** group header hight is shorter when collapsed ([#9953](https://github.com/SAP/ui5-webcomponents/issues/9953)) ([4c8a76e](https://github.com/SAP/ui5-webcomponents/commit/4c8a76edb5699810addd5c77fac2eabd507568f3)), closes [#9911](https://github.com/SAP/ui5-webcomponents/issues/9911)
+* **ui5-page:** fix createElement error caused by adding new style property in the constructor ([#9998](https://github.com/SAP/ui5-webcomponents/issues/9998)) ([fd402e4](https://github.com/SAP/ui5-webcomponents/commit/fd402e41933da5e57456b736332872a0f0006cdf)), closes [#9981](https://github.com/SAP/ui5-webcomponents/issues/9981)
+* **ui5-popup:** add role attribute to focus helper element ([#10004](https://github.com/SAP/ui5-webcomponents/issues/10004)) ([82a95ce](https://github.com/SAP/ui5-webcomponents/commit/82a95cebfc93fb4be696b76110f2089be1593db8)), closes [#9982](https://github.com/SAP/ui5-webcomponents/issues/9982)
+* **ui5-range-slider:** right click on the slider handle does not throw ([#10015](https://github.com/SAP/ui5-webcomponents/issues/10015)) ([e92caf9](https://github.com/SAP/ui5-webcomponents/commit/e92caf96d9ab4548090820e6bbf7217c43d99fd4))
+* **ui5-slider, ui5-range-slider:** adjust styles according to Fiori specs ([#9973](https://github.com/SAP/ui5-webcomponents/issues/9973)) ([e1182a9](https://github.com/SAP/ui5-webcomponents/commit/e1182a9ee44c6975b93208c16ef584cf0d0104d6)), closes [#9614](https://github.com/SAP/ui5-webcomponents/issues/9614)
+
+
+### Features
+
+* **create-package:** produce packages of type="module" ([#9993](https://github.com/SAP/ui5-webcomponents/issues/9993)) ([b161f60](https://github.com/SAP/ui5-webcomponents/commit/b161f601253b966fc0bb7a01213165c0963c85ca))
+* **ui5-barcode-scanner-dialog:** added capture region overlay ([#9646](https://github.com/SAP/ui5-webcomponents/issues/9646)) ([19475eb](https://github.com/SAP/ui5-webcomponents/commit/19475eb897d08c5f09ae2583678cc79decca5adc))
+* **ui5-slider, ui5-range-slider:** add input as a tooltip ([#9547](https://github.com/SAP/ui5-webcomponents/issues/9547)) ([6a4dedf](https://github.com/SAP/ui5-webcomponents/commit/6a4dedf47431d7f7dda7c19f54170bc877c2a33d))
+
+
+
+
+
 # [2.4.0-rc.0](https://github.com/SAP/ui5-webcomponents/compare/v2.3.1-rc.0...v2.4.0-rc.0) (2024-10-10)
 
 

diff --git a/docs/2-advanced/06-scoping.md b/docs/2-advanced/06-scoping.md
@@ -11,10 +11,13 @@ The `scoping` feature lets you add an arbitrary suffix to the names of all UI5 W
 Example:
 
 ```js
+// scoping-config.js
 import { setCustomElementsScopingSuffix } from "@ui5/webcomponents-base/dist/CustomElementsScope.js";
 setCustomElementsScopingSuffix("demo");
 ```
 
+** NOTE: ** Setting the scoping suffix should be done before importing any components, as they use the suffix at the top-level of the module - meaning when a component is imported, the suffix has to be known. For this to work, calling the method should be done in a separate module (`scoping-config.js` in the example above) and this module should be imported before any components are imported.
+
 Then all names can only be used with the supplied suffix:
 
 ```html
@@ -34,7 +37,7 @@ will not have any effect.
 
 ## When do I need to use the `scoping` feature?
 
-The `scoping` feature is completely optional. It is not needed for application development, but it is strongly recommended when building **libraries** and **micro-frontends**. 
+The `scoping` feature is completely optional. It is not needed for application development, but it is strongly recommended when building **libraries** and **micro-frontends**.
 It ensures that the custom elements that your code uses have not already been reserved by another library or an older version of UI5 Web Components.
 
 If, for example, your code may be loaded on demand by unknown applications as a third-party service, there is always the risk that the app

diff --git a/lerna.json b/lerna.json
@@ -14,7 +14,7 @@
  "packages/create-package",
  "packages/compat"
  ],
- "version": "2.4.0-rc.0",
+ "version": "2.4.0-rc.1",
  "command": {
  "publish": {
  "allowBranch": "*",

diff --git a/package.json b/package.json
@@ -57,7 +57,7 @@
  "lint:scope": "wsrun --exclude-missing lint:scope",
  "link-all": "wsrun link",
  "unlink-all": "wsrun unlink",
- "release": "node ./.github/actions/release.js",
+ "release": "node ./.github/actions/release.cjs",
  "prepare": "husky install",
  "husky:commit-msg": "commitlint -e",
  "husky:pre-push": "npm-run-all --sequential husky:commit-msg",

diff --git a/packages/ai/CHANGELOG.md b/packages/ai/CHANGELOG.md
@@ -3,6 +3,18 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [2.4.0-rc.1](https://github.com/SAP/ui5-webcomponents/compare/v2.4.0-rc.0...v2.4.0-rc.1) (2024-10-17)
+
+
+### Bug Fixes
+
+* scoping issues and document how scoping is used correctly ([#10023](https://github.com/SAP/ui5-webcomponents/issues/10023)) ([ee808c3](https://github.com/SAP/ui5-webcomponents/commit/ee808c309f316fe145b05d292c92328396c655ab))
+* **tools:** revert tsconfig moduleResolution to node ([#10014](https://github.com/SAP/ui5-webcomponents/issues/10014)) ([0724b92](https://github.com/SAP/ui5-webcomponents/commit/0724b9289ad04f88972d4978ed37e76f13abca13))
+
+
+
+
+
 # [2.4.0-rc.0](https://github.com/SAP/ui5-webcomponents/compare/v2.3.1-rc.0...v2.4.0-rc.0) (2024-10-10)
 
 

diff --git a/packages/ai/package.json b/packages/ai/package.json
@@ -1,6 +1,6 @@
 {
  "name": "@ui5/webcomponents-ai",
- "version": "2.4.0-rc.0",
+ "version": "2.4.0-rc.1",
  "description": "UI5 Web Components: webcomponents.ai",
  "ui5": {
  "webComponentsPackage": true
@@ -45,13 +45,13 @@
  "directory": "packages/ai"
  },
  "dependencies": {
- "@ui5/webcomponents": "2.4.0-rc.0",
- "@ui5/webcomponents-base": "2.4.0-rc.0",
- "@ui5/webcomponents-icons": "2.4.0-rc.0",
- "@ui5/webcomponents-theming": "2.4.0-rc.0"
+ "@ui5/webcomponents": "2.4.0-rc.1",
+ "@ui5/webcomponents-base": "2.4.0-rc.1",
+ "@ui5/webcomponents-icons": "2.4.0-rc.1",
+ "@ui5/webcomponents-theming": "2.4.0-rc.1"
  },
  "devDependencies": {
- "@ui5/webcomponents-tools": "2.4.0-rc.0",
+ "@ui5/webcomponents-tools": "2.4.0-rc.1",
  "chromedriver": "^128.0.3"
  }
 }
diff --git a/packages/ai/src/bundle.scoped.config.ts b/packages/ai/src/bundle.scoped.config.ts
@@ -0,0 +1,3 @@
+import { setCustomElementsScopingSuffix } from "@ui5/webcomponents-base/dist/CustomElementsScope.js";
+
+setCustomElementsScopingSuffix("demo");
diff --git a/packages/ai/src/bundle.scoped.esm.ts b/packages/ai/src/bundle.scoped.esm.ts
@@ -1,3 +1,2 @@
-import { setCustomElementsScopingSuffix } from "@ui5/webcomponents-base/dist/CustomElementsScope.js";
-
-setCustomElementsScopingSuffix("demo");
+import "./bundle.scoped.config.js";
+import "./bundle.esm.js";
diff --git a/packages/ai/tsconfig.json b/packages/ai/tsconfig.json
@@ -8,6 +8,8 @@
  "outDir": "dist",
  "experimentalDecorators": true,
  "verbatimModuleSyntax": true,
+ "module": "NodeNext",
+ "moduleResolution": "NodeNext",
  "paths": {
  "@ui5/webcomponents-base/dist/*": [
  "../base/src/*"

diff --git a/packages/base/CHANGELOG.md b/packages/base/CHANGELOG.md
@@ -3,6 +3,18 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [2.4.0-rc.1](https://github.com/SAP/ui5-webcomponents/compare/v2.4.0-rc.0...v2.4.0-rc.1) (2024-10-17)
+
+
+### Bug Fixes
+
+* **framework:** always fire languageChange regardless of boot status ([#10029](https://github.com/SAP/ui5-webcomponents/issues/10029)) ([9261ac9](https://github.com/SAP/ui5-webcomponents/commit/9261ac93211ac431b9c1d95d255a6bb8bc3ff815))
+* **tools:** revert tsconfig moduleResolution to node ([#10014](https://github.com/SAP/ui5-webcomponents/issues/10014)) ([0724b92](https://github.com/SAP/ui5-webcomponents/commit/0724b9289ad04f88972d4978ed37e76f13abca13))
+
+
+
+
+
 # [2.4.0-rc.0](https://github.com/SAP/ui5-webcomponents/compare/v2.3.1-rc.0...v2.4.0-rc.0) (2024-10-10)
 
 

diff --git a/packages/base/package.json b/packages/base/package.json
@@ -1,6 +1,6 @@
 {
  "name": "@ui5/webcomponents-base",
- "version": "2.4.0-rc.0",
+ "version": "2.4.0-rc.1",
  "description": "UI5 Web Components: webcomponents.base",
  "author": "SAP SE (https://www.sap.com)",
  "license": "Apache-2.0",
@@ -52,7 +52,7 @@
  },
  "devDependencies": {
  "@openui5/sap.ui.core": "1.120.17",
- "@ui5/webcomponents-tools": "2.4.0-rc.0",
+ "@ui5/webcomponents-tools": "2.4.0-rc.1",
  "chromedriver": "^128.0.3",
  "clean-css": "^5.2.2",
  "copy-and-watch": "^0.1.5",

diff --git a/packages/base/src/UI5Element.ts b/packages/base/src/UI5Element.ts
@@ -1271,20 +1271,22 @@ abstract class UI5Element extends HTMLElement {
  * @public
  */
  static define(): typeof UI5Element {
- this.definePromise = Promise.all([
- this.fetchI18nBundles(),
- this.fetchCLDR(),
- boot(),
- this.onDefine(),
- ]).then(result => {
+ const defineSequence = async () => {
+ await boot(); // boot must finish first, because it initializes configuration
+ const result = await Promise.all([
+ this.fetchI18nBundles(), // uses configuration
+ this.fetchCLDR(),
+ this.onDefine(),
+ ]);
  const [i18nBundles] = result;
  Object.entries(this.getMetadata().getI18n()).forEach((pair, index) => {
  const propertyName = pair[0];
  const targetClass = pair[1].target;
  (targetClass as Record<string, any>)[propertyName] = i18nBundles[index];
  });
  this.asyncFinished = true;
- });
+ };
+ this.definePromise = defineSequence();
 
  const tag = this.getMetadata().getTag();
 

diff --git a/packages/base/src/config/Language.ts b/packages/base/src/config/Language.ts
@@ -43,8 +43,8 @@ const setLanguage = async (language: string): Promise<void> => {
 
  curLanguage = language;
 
+ await fireLanguageChange(language);
  if (isBooted()) {
- await fireLanguageChange(language);
  await reRenderAllUI5Elements({ languageAware: true });
  }
 };

diff --git a/packages/base/tsconfig.json b/packages/base/tsconfig.json
@@ -10,6 +10,8 @@
  "composite": true,
  "rootDir": "src",
  "experimentalDecorators": true,
+ "module": "NodeNext",
+ "moduleResolution": "NodeNext",
  "tsBuildInfoFile": "dist/.tsbuildinfobuild",
  "paths": {
  "@ui5/webcomponents-base/dist/ssr-dom.js": ["./src/ssr-dom.ts"],

diff --git a/packages/compat/CHANGELOG.md b/packages/compat/CHANGELOG.md
@@ -3,6 +3,18 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [2.4.0-rc.1](https://github.com/SAP/ui5-webcomponents/compare/v2.4.0-rc.0...v2.4.0-rc.1) (2024-10-17)
+
+
+### Bug Fixes
+
+* scoping issues and document how scoping is used correctly ([#10023](https://github.com/SAP/ui5-webcomponents/issues/10023)) ([ee808c3](https://github.com/SAP/ui5-webcomponents/commit/ee808c309f316fe145b05d292c92328396c655ab))
+* **tools:** revert tsconfig moduleResolution to node ([#10014](https://github.com/SAP/ui5-webcomponents/issues/10014)) ([0724b92](https://github.com/SAP/ui5-webcomponents/commit/0724b9289ad04f88972d4978ed37e76f13abca13))
+
+
+
+
+
 # [2.4.0-rc.0](https://github.com/SAP/ui5-webcomponents/compare/v2.3.1-rc.0...v2.4.0-rc.0) (2024-10-10)
 
 

diff --git a/packages/compat/package.json b/packages/compat/package.json
@@ -1,6 +1,6 @@
 {
  "name": "@ui5/webcomponents-compat",
- "version": "2.4.0-rc.0",
+ "version": "2.4.0-rc.1",
  "description": "UI5 Web Components: webcomponents.compat",
  "ui5": {
  "webComponentsPackage": true
@@ -45,13 +45,13 @@
  "directory": "packages/compat"
  },
  "dependencies": {
- "@ui5/webcomponents": "2.4.0-rc.0",
- "@ui5/webcomponents-base": "2.4.0-rc.0",
- "@ui5/webcomponents-icons": "2.4.0-rc.0",
- "@ui5/webcomponents-theming": "2.4.0-rc.0"
+ "@ui5/webcomponents": "2.4.0-rc.1",
+ "@ui5/webcomponents-base": "2.4.0-rc.1",
+ "@ui5/webcomponents-icons": "2.4.0-rc.1",
+ "@ui5/webcomponents-theming": "2.4.0-rc.1"
  },
  "devDependencies": {
- "@ui5/webcomponents-tools": "2.4.0-rc.0",
+ "@ui5/webcomponents-tools": "2.4.0-rc.1",
  "chromedriver": "^128.0.3"
  }
 }
diff --git a/packages/compat/src/bundle.scoped.config.ts b/packages/compat/src/bundle.scoped.config.ts
@@ -0,0 +1,5 @@
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+import { setCustomElementsScopingSuffix, setCustomElementsScopingRules } from "@ui5/webcomponents-base/dist/CustomElementsScope.js";
+
+setCustomElementsScopingSuffix("demo");
+// setCustomElementsScopingRules({include: [/^ui5-/], exclude: [/^ui5-button/, /ui5-icon/]});
diff --git a/packages/compat/src/bundle.scoped.esm.ts b/packages/compat/src/bundle.scoped.esm.ts
@@ -1,8 +1,4 @@
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
-import { setCustomElementsScopingSuffix, setCustomElementsScopingRules } from "@ui5/webcomponents-base/dist/CustomElementsScope.js";
-
-setCustomElementsScopingSuffix("demo");
-// setCustomElementsScopingRules({include: [/^ui5-/], exclude: [/^ui5-button/, /ui5-icon/]});
+import "./bundle.scoped.config.js";
 
 // eslint-disable-next-line import/first
 import testAssets from "./bundle.esm.js";

diff --git a/packages/compat/tsconfig.json b/packages/compat/tsconfig.json
@@ -8,6 +8,8 @@
  "outDir": "dist",
  "experimentalDecorators": true,
  "verbatimModuleSyntax": true,
+ "module": "NodeNext",
+ "moduleResolution": "NodeNext",
  "paths": {
  "@ui5/webcomponents-base/dist/*": [
  "../base/src/*"

diff --git a/packages/create-package/CHANGELOG.md b/packages/create-package/CHANGELOG.md
@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [2.4.0-rc.1](https://github.com/SAP/ui5-webcomponents/compare/v2.4.0-rc.0...v2.4.0-rc.1) (2024-10-17)
+
+
+### Features
+
+* **create-package:** produce packages of type="module" ([#9993](https://github.com/SAP/ui5-webcomponents/issues/9993)) ([b161f60](https://github.com/SAP/ui5-webcomponents/commit/b161f601253b966fc0bb7a01213165c0963c85ca))
+
+
+
+
+
 # [2.4.0-rc.0](https://github.com/SAP/ui5-webcomponents/compare/v2.3.1-rc.0...v2.4.0-rc.0) (2024-10-10)
 
 **Note:** Version bump only for package @ui5/create-webcomponents-package

diff --git a/packages/create-package/create-package.js b/packages/create-package/create-package.js
@@ -108,6 +108,7 @@ const generateFilesContent = (packageName, componentName, skipSubfolder) => {
  ui5: {
  webComponentsPackage: true,
  },
+ type: "module",
  scripts: {
  "clean": "wc-dev clean",
  "lint": "wc-dev lint",

diff --git a/packages/create-package/package.json b/packages/create-package/package.json
@@ -1,6 +1,6 @@
 {
  "name": "@ui5/create-webcomponents-package",
- "version": "2.4.0-rc.0",
+ "version": "2.4.0-rc.1",
  "description": "UI5 Web Components: create package",
  "author": "SAP SE (https://www.sap.com)",
  "license": "Apache-2.0",

diff --git a/packages/create-package/template/.eslintignore b/packages/create-package/template/.eslintignore
@@ -2,4 +2,4 @@
 dist
 test
 src/generated
-.eslintrc.js
+.eslintrc.cjs
diff --git a/...ages/create-package/template/.eslintrc.js → ...ges/create-package/template/.eslintrc.cjs b/...ages/create-package/template/.eslintrc.js → ...ges/create-package/template/.eslintrc.cjs
diff --git a/packages/create-package/template/.npsrc.json b/packages/create-package/template/.npsrc.json
@@ -0,0 +1,3 @@
+{
+ "config": "./package-scripts.cjs"
+}
diff --git a/...eate-package/template/config/wdio.conf.js → ...ate-package/template/config/wdio.conf.cjs b/...eate-package/template/config/wdio.conf.js → ...ate-package/template/config/wdio.conf.cjs
diff --git a/...reate-package/template/package-scripts.js → ...eate-package/template/package-scripts.cjs b/...reate-package/template/package-scripts.js → ...eate-package/template/package-scripts.cjs
diff --git a/packages/create-package/template/test/pages/css/index.css b/packages/create-package/template/test/pages/css/index.css
@@ -22,6 +22,11 @@ h2 {
  flex-direction: column;
 }
 
+.app-logo {
+ height: 230px;
+ width: 230px;
+}
+
 .app-first-component {
  margin-bottom: 3rem;
 }

diff --git a/packages/create-package/template/test/pages/img/logo.png b/packages/create-package/template/test/pages/img/logo.png
diff --git a/packages/create-package/template/test/pages/index.html b/packages/create-package/template/test/pages/index.html
@@ -21,7 +21,7 @@
 
 <body>
  <div class="app">
- <a href="https://sap.github.io/ui5-webcomponents/docs/getting-started/first-steps/" target="_blank"><img src="./img/logo.png" alt="logo"/></a>
+ <a href="https://sap.github.io/ui5-webcomponents/docs/getting-started/first-steps/" target="_blank"><img src="./img/logo.png" class="app-logo" alt="logo"/></a>
 
  <div class="app-first-component">
  <h1>Hooray! It's Your First Web Component!</h1>

diff --git a/packages/create-package/template/test/specs/Demo.spec.js b/packages/create-package/template/test/specs/Demo.spec.js
@@ -1,4 +1,4 @@
-const assert = require("assert");
+import { assert } from "chai";
 
 describe("INIT_PACKAGE_VAR_TAG rendering", async () => {
  before(async () => {

diff --git a/packages/create-package/template/tsconfig.json b/packages/create-package/template/tsconfig.json
@@ -7,5 +7,7 @@
  "compilerOptions": {
  "outDir": "dist",
  "experimentalDecorators": true,
+ "module": "NodeNext",
+ "moduleResolution": "NodeNext",
  },
 }