feat: update @ui5/webcomponents to ~2.4.0 (#6585)

Author: Lukas742

.storybook/custom-element-manifests/fiori.json

@@ -3,5 +3,5 @@
   "compilerOptions": {
     "allowJs": true
   },
-  "include": ["./**/*.js", "./**/*.tsx"]
+  "include": ["./**/*.js", "./**/*.tsx", "./**/*.ts"]
 }

.storybook/custom-element-manifests/main.json

@@ -60,7 +60,8 @@ const replaceSubComps = {
   ToolbarItem: ['ToolbarSeparator', 'ToolbarSpacer', 'ToolbarButton', 'ToolbarSelect', 'ToolbarSelectOption'],
   TreeItemBase: ['TreeItem', 'TreeItemCustom'],
   AvatarGroupItem: ['Avatar'],
-  TableFeature: ['TableGrowing', 'TableSelection']
+  TableFeature: ['TableGrowing', 'TableSelection'],
+  SideNavigationItemBase: ['SideNavigationItem', 'SideNavigationGroup', 'SideNavigationSubItem']
 };
 
 function findSubComponentsRecursively(moduleName: string, cem: any): string[] {

.storybook/tsconfig.json

@@ -23,8 +23,9 @@
     "lerna:version-dryrun": "lerna version --conventional-graduate --no-git-tag-version --no-push",
     "wrappers:main": "WITH_WEB_COMPONENT_IMPORT_PATH='../../internal/withWebComponent.js' INTERFACES_IMPORT_PATH='../../types/index.js' node packages/cli/dist/bin/index.js create-wrappers --packageName @ui5/webcomponents --out ./packages/main/src/webComponents --additionalComponentNote 'This is a UI5 Web Component! [Repository](https://github.com/SAP/ui5-webcomponents) | [Documentation](https://sap.github.io/ui5-webcomponents/)'",
     "wrappers:fiori": "WITH_WEB_COMPONENT_IMPORT_PATH='../../internal/withWebComponent.js' INTERFACES_IMPORT_PATH='../../types/index.js' node packages/cli/dist/bin/index.js create-wrappers --packageName @ui5/webcomponents-fiori --out ./packages/main/src/webComponents --additionalComponentNote 'This is a UI5 Web Component! [Repository](https://github.com/SAP/ui5-webcomponents) | [Documentation](https://sap.github.io/ui5-webcomponents/)'",
-    "wrappers:compat": "WITH_WEB_COMPONENT_IMPORT_PATH='@ui5/webcomponents-react/dist/internal/withWebComponent.js' node packages/cli/dist/bin/index.js create-wrappers --packageName @ui5/webcomponents-compat --out ./packages/compat/src/components --additionalComponentNote 'This is a UI5 Web Component! [Repository](https://github.com/SAP/ui5-webcomponents) | [Documentation](https://sap.github.io/ui5-webcomponents/)' && prettier --log-level silent --write ./packages/compat/src/components && eslint --ext .ts,.tsx --fix ./packages/compat/src/components/*/index.tsx",
-    "create-webcomponents-wrapper": "(cd packages/cli && tsc) && yarn run wrappers:main && yarn run wrappers:fiori && yarn run wrappers:compat && prettier --log-level silent --write ./packages/main/src/webComponents && eslint --ext .ts,.tsx --fix ./packages/main/src/webComponents/*/index.tsx && yarn run sb:prepare-cem",
+    "wrappers:compat": "WITH_WEB_COMPONENT_IMPORT_PATH='@ui5/webcomponents-react/dist/internal/withWebComponent.js' node packages/cli/dist/bin/index.js create-wrappers --packageName @ui5/webcomponents-compat --out ./packages/compat/src/components --additionalComponentNote 'This is a UI5 Web Component! [Repository](https://github.com/SAP/ui5-webcomponents) | [Documentation](https://sap.github.io/ui5-webcomponents/)' && prettier --log-level silent --write ./packages/compat/src/components",
+    "create-webcomponents-wrapper": "(cd packages/cli && tsc) && yarn run wrappers:main && yarn run wrappers:fiori && prettier --log-level silent --write ./packages/main/src/webComponents && eslint --fix ./packages/main/src/webComponents/*/index.tsx && yarn run sb:prepare-cem",
+    "create-webcomponents-wrapper-compat": "(cd packages/cli && tsc) && yarn run wrappers:compat && yarn run sb:prepare-cem && eslint --fix ./packages/compat/src/components/*/index.tsx",
     "chromatic": "cross-env STORYBOOK_ENV=chromatic npx chromatic --build-script-name build:storybook",
     "postinstall": "husky && yarn setup",
     "create-cypress-commands-docs": "typedoc && rimraf temp/typedoc",
@@ -39,10 +40,10 @@
     "@storybook/react": "8.3.6",
     "@storybook/react-vite": "8.3.6",
     "@storybook/theming": "8.3.6",
-    "@ui5/webcomponents": "2.3.0",
-    "@ui5/webcomponents-compat": "2.3.0",
-    "@ui5/webcomponents-fiori": "2.3.0",
-    "@ui5/webcomponents-icons": "2.3.0",
+    "@ui5/webcomponents": "2.4.0",
+    "@ui5/webcomponents-compat": "2.4.0",
+    "@ui5/webcomponents-fiori": "2.4.0",
+    "@ui5/webcomponents-icons": "2.4.0",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "remark-gfm": "^4.0.0",
@@ -64,7 +65,7 @@
     "@types/react": "^18.3.4",
     "@types/react-dom": "^18.3.0",
     "@types/use-sync-external-store": "^0.0.6",
-    "@ui5/webcomponents-tools": "2.3.0",
+    "@ui5/webcomponents-tools": "2.4.0",
     "@vitejs/plugin-react": "^4.2.0",
     "chromatic": "^11.0.0",
     "cssnano": "^7.0.0",

.storybook/utils.ts

@@ -31,7 +31,7 @@
   },
   "peerDependencies": {
     "@types/react": "*",
-    "@ui5/webcomponents-base": "~2.3.0",
+    "@ui5/webcomponents-base": "~2.4.0",
     "react": "^18 || ^19"
   },
   "peerDependenciesMeta": {

package.json

@@ -39,8 +39,8 @@
     "recharts": "2.13.3"
   },
   "peerDependencies": {
-    "@ui5/webcomponents-react": "~2.3.0",
-    "@ui5/webcomponents-react-base": "~2.3.0",
+    "@ui5/webcomponents-react": "~2.4.0",
+    "@ui5/webcomponents-react-base": "~2.4.0",
     "react": "^18"
   },
   "publishConfig": {

packages/base/package.json

@@ -24,7 +24,8 @@ const EXCLUDED_MEMBERS = new Set([
   'onEnterDOM',
   'onExitDOM',
   'onInvalidation',
-  'getStaticAreaItemDomRef'
+  'getStaticAreaItemDomRef',
+  'fireDecoratorEvent'
 ]);
 
 function mergeArraysWithoutDuplicates(currentValues: any[], newValue: any) {

packages/charts/package.json

@@ -41,8 +41,8 @@
   "peerDependencies": {
     "@types/react": "*",
     "@types/react-dom": "*",
-    "@ui5/webcomponents-compat": "~2.3.0",
-    "@ui5/webcomponents-react": "~2.3.0",
+    "@ui5/webcomponents-compat": "~2.4.0",
+    "@ui5/webcomponents-react": "~2.4.0",
     "react": "^18 || ^19",
     "react-dom": "^18 || ^19"
   },

packages/cli/src/util/recursiveManifestResolver.ts

@@ -58,10 +58,10 @@
   "peerDependencies": {
     "@types/react": "*",
     "@types/react-dom": "*",
-    "@ui5/webcomponents": "~2.3.0",
-    "@ui5/webcomponents-base": "~2.3.0",
-    "@ui5/webcomponents-fiori": "~2.3.0",
-    "@ui5/webcomponents-icons": "~2.3.0",
+    "@ui5/webcomponents": "~2.4.0",
+    "@ui5/webcomponents-base": "~2.4.0",
+    "@ui5/webcomponents-fiori": "~2.4.0",
+    "@ui5/webcomponents-icons": "~2.4.0",
     "react": "^18 || ^19",
     "react-dom": "^18 || ^19"
   },