fix(StyleStore): replace useSyncExternalStore shim with react import (#6650)

Author: Lukas742

package.json

@@ -64,7 +64,6 @@
     "@types/node": "^22.0.0",
     "@types/react": "^18.3.4",
     "@types/react-dom": "^18.3.0",
-    "@types/use-sync-external-store": "^0.0.6",
     "@ui5/webcomponents-tools": "2.4.0",
     "@vitejs/plugin-react": "^4.2.0",
     "chromatic": "^11.0.0",

packages/base/package.json

@@ -51,8 +51,5 @@
     "LICENSE",
     "NOTICE.txt",
     "README.md"
-  ],
-  "dependencies": {
-    "use-sync-external-store": "1.2.2"
-  }
+  ]
 }

packages/base/src/hooks/useI18nBundle.ts

@@ -1,8 +1,7 @@
 'use client';
 
 import I18nBundle from '@ui5/webcomponents-base/dist/i18nBundle.js';
-import { useEffect } from 'react';
-import { useSyncExternalStore } from 'use-sync-external-store/shim/index.js';
+import { useEffect, useSyncExternalStore } from 'react';
 import { I18nStore } from '../stores/I18nStore.js';
 
 const defaultBundle = new I18nBundle('defaultBundle');

packages/base/src/hooks/useStylesheet.ts

@@ -3,7 +3,7 @@
 import type { StyleDataCSP } from '@ui5/webcomponents-base/dist/ManagedStyles.js';
 import { createOrUpdateStyle, removeStyle } from '@ui5/webcomponents-base/dist/ManagedStyles.js';
 import { getCurrentRuntimeIndex } from '@ui5/webcomponents-base/dist/Runtimes.js';
-import { useSyncExternalStore } from 'use-sync-external-store/shim/index.js';
+import { useSyncExternalStore } from 'react';
 import { StyleStore } from '../stores/StyleStore.js';
 import { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect.js';
 

packages/main/package.json

@@ -52,8 +52,7 @@
     "@tanstack/react-virtual": "~3.10.0",
     "@ui5/webcomponents-react-base": "workspace:~",
     "clsx": "2.1.1",
-    "react-table": "7.8.0",
-    "use-sync-external-store": "1.2.2"
+    "react-table": "7.8.0"
   },
   "peerDependencies": {
     "@types/react": "*",

packages/main/src/components/Modals/index.tsx

@@ -1,9 +1,8 @@
 'use client';
 
 import type { RefObject } from 'react';
-import { createRef } from 'react';
+import { createRef, useSyncExternalStore } from 'react';
 import { createPortal } from 'react-dom';
-import { useSyncExternalStore } from 'use-sync-external-store/shim/index.js';
 import { getRandomId } from '../../internal/getRandomId.js';
 import { ModalStore } from '../../internal/ModalStore.js';
 import type {

yarn.lock

@@ -5499,13 +5499,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@types/use-sync-external-store@npm:^0.0.6":
-  version: 0.0.6
-  resolution: "@types/use-sync-external-store@npm:0.0.6"
-  checksum: 10c0/77c045a98f57488201f678b181cccd042279aff3da34540ad242f893acc52b358bd0a8207a321b8ac09adbcef36e3236944390e2df4fcedb556ce7bb2a88f2a8
-  languageName: node
-  linkType: hard
-
 "@types/uuid@npm:^9.0.1":
   version: 9.0.7
   resolution: "@types/uuid@npm:9.0.7"
@@ -5932,8 +5925,6 @@ __metadata:
 "@ui5/webcomponents-react-base@workspace:packages/base, @ui5/webcomponents-react-base@workspace:~":
   version: 0.0.0-use.local
   resolution: "@ui5/webcomponents-react-base@workspace:packages/base"
-  dependencies:
-    use-sync-external-store: "npm:1.2.2"
   peerDependencies:
     "@types/react": "*"
     "@ui5/webcomponents-base": ~2.4.0
@@ -6002,7 +5993,6 @@ __metadata:
     "@ui5/webcomponents-react-base": "workspace:~"
     clsx: "npm:2.1.1"
     react-table: "npm:7.8.0"
-    use-sync-external-store: "npm:1.2.2"
   peerDependencies:
     "@types/react": "*"
     "@types/react-dom": "*"
@@ -21223,7 +21213,6 @@ __metadata:
     "@types/node": "npm:^22.0.0"
     "@types/react": "npm:^18.3.4"
     "@types/react-dom": "npm:^18.3.0"
-    "@types/use-sync-external-store": "npm:^0.0.6"
     "@ui5/webcomponents": "npm:2.4.0"
     "@ui5/webcomponents-compat": "npm:2.4.0"
     "@ui5/webcomponents-fiori": "npm:2.4.0"
@@ -21578,15 +21567,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"use-sync-external-store@npm:1.2.2":
-  version: 1.2.2
-  resolution: "use-sync-external-store@npm:1.2.2"
-  peerDependencies:
-    react: ^16.8.0 || ^17.0.0 || ^18.0.0
-  checksum: 10c0/23b1597c10adf15b26ade9e8c318d8cc0abc9ec0ab5fc7ca7338da92e89c2536abd150a5891bf076836c352fdfa104fc7231fb48f806fd9960e0cbe03601abaf
-  languageName: node
-  linkType: hard
-
 "util-deprecate@npm:^1.0.1, util-deprecate@npm:^1.0.2, util-deprecate@npm:~1.0.1":
   version: 1.0.2
   resolution: "util-deprecate@npm:1.0.2"