From bb2fa03fb39d5ae8ab1ab09d8933a37517af9925 Mon Sep 17 00:00:00 2001 From: Abigail Alexander Date: Mon, 6 Jul 2026 15:53:29 +0100 Subject: [PATCH 1/3] Update dependencies to support davidia --- package-lock.json | 230 +++++++++++++++++++++++++++++++++++++++++++++- package.json | 4 + 2 files changed, 232 insertions(+), 2 deletions(-) diff --git a/package-lock.json b/package-lock.json index 5f22e16..6c80fc2 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "@diamondlightsource/cs-web-lib", - "version": "0.10.19", + "version": "0.10.20", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "@diamondlightsource/cs-web-lib", - "version": "0.10.19", + "version": "0.10.20", "license": "ISC", "dependencies": { "apollo-link-retry": "^2.2.16", @@ -21,6 +21,7 @@ "@mui/icons-material": "^7.3.7", "@mui/material": "^7.3.2", "@mui/x-charts": "^9.3.0", + "@react-three/fiber": "^8.18.0", "@reduxjs/toolkit": "^2.11.2", "@rollup/plugin-commonjs": "^28", "@rollup/plugin-node-resolve": "^15.3.0", @@ -3563,6 +3564,66 @@ "url": "https://opencollective.com/popperjs" } }, + "node_modules/@react-three/fiber": { + "version": "8.18.0", + "resolved": "https://registry.npmjs.org/@react-three/fiber/-/fiber-8.18.0.tgz", + "integrity": "sha512-FYZZqD0UUHUswKz3LQl2Z7H24AhD14XGTsIRw3SJaXUxyfVMi+1yiZGmqTcPt/CkPpdU7rrxqcyQ1zJE5DjvIQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "@babel/runtime": "^7.17.8", + "@types/react-reconciler": "^0.26.7", + "@types/webxr": "*", + "base64-js": "^1.5.1", + "buffer": "^6.0.3", + "its-fine": "^1.0.6", + "react-reconciler": "^0.27.0", + "react-use-measure": "^2.1.7", + "scheduler": "^0.21.0", + "suspend-react": "^0.1.3", + "zustand": "^3.7.1" + }, + "peerDependencies": { + "expo": ">=43.0", + "expo-asset": ">=8.4", + "expo-file-system": ">=11.0", + "expo-gl": ">=11.0", + "react": ">=18 <19", + "react-dom": ">=18 <19", + "react-native": ">=0.64", + "three": ">=0.133" + }, + "peerDependenciesMeta": { + "expo": { + "optional": true + }, + "expo-asset": { + "optional": true + }, + "expo-file-system": { + "optional": true + }, + "expo-gl": { + "optional": true + }, + "react-dom": { + "optional": true + }, + "react-native": { + "optional": true + } + } + }, + "node_modules/@react-three/fiber/node_modules/scheduler": { + "version": "0.21.0", + "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.21.0.tgz", + "integrity": "sha512-1r87x5fz9MXqswA2ERLo0EbOAU74DpIUO090gIasYTqlVoJeMcl+Z1Rg7WHz+qtPujhS/hGIt9kxZOYBV3faRQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "loose-envify": "^1.1.0" + } + }, "node_modules/@reduxjs/toolkit": { "version": "2.12.0", "resolved": "https://registry.npmjs.org/@reduxjs/toolkit/-/toolkit-2.12.0.tgz", @@ -4848,6 +4909,16 @@ "@types/react": "*" } }, + "node_modules/@types/react-reconciler": { + "version": "0.26.7", + "resolved": "https://registry.npmjs.org/@types/react-reconciler/-/react-reconciler-0.26.7.tgz", + "integrity": "sha512-mBDYl8x+oyPX/VBb3E638N0B7xG+SPk/EAMcVPeexqus/5aTpTphQi0curhhshOqRrc9t6OPoJfEUkbymse/lQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "@types/react": "*" + } + }, "node_modules/@types/react-redux": { "version": "7.1.34", "resolved": "https://registry.npmjs.org/@types/react-redux/-/react-redux-7.1.34.tgz", @@ -4922,6 +4993,13 @@ "dev": true, "license": "MIT" }, + "node_modules/@types/webxr": { + "version": "0.5.24", + "resolved": "https://registry.npmjs.org/@types/webxr/-/webxr-0.5.24.tgz", + "integrity": "sha512-h8fgEd/DpoS9CBrjEQXR+dIDraopAEfu4wYVNY2tEPwk60stPWhvZMf4Foo5FakuQ7HFZoa8WceaWFervK2Ovg==", + "dev": true, + "license": "MIT" + }, "node_modules/@types/zen-observable": { "version": "0.8.0", "resolved": "https://registry.npmjs.org/@types/zen-observable/-/zen-observable-0.8.0.tgz", @@ -6339,6 +6417,31 @@ "node": "^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7" } }, + "node_modules/buffer": { + "version": "6.0.3", + "resolved": "https://registry.npmjs.org/buffer/-/buffer-6.0.3.tgz", + "integrity": "sha512-FTiCpNxtwiZZHEZbcbTIcZjERVICn9yq/pDFkTl95/AxzD1naBctN7YO68riM/gLSDY7sdrMby8hofADYuuqOA==", + "dev": true, + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/feross" + }, + { + "type": "patreon", + "url": "https://www.patreon.com/feross" + }, + { + "type": "consulting", + "url": "https://feross.org/support" + } + ], + "license": "MIT", + "dependencies": { + "base64-js": "^1.3.1", + "ieee754": "^1.2.1" + } + }, "node_modules/bufferutil": { "version": "4.1.0", "resolved": "https://registry.npmjs.org/bufferutil/-/bufferutil-4.1.0.tgz", @@ -9496,6 +9599,27 @@ "postcss": "^8.1.0" } }, + "node_modules/ieee754": { + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.2.1.tgz", + "integrity": "sha512-dcyqhDvX1C46lXZcVqCpK+FtMRQVdIMN6/Df5js2zouUsqG7I6sFxitIC+7KYK29KdXOLHdu9zL4sFnoVQnqaA==", + "dev": true, + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/feross" + }, + { + "type": "patreon", + "url": "https://www.patreon.com/feross" + }, + { + "type": "consulting", + "url": "https://feross.org/support" + } + ], + "license": "BSD-3-Clause" + }, "node_modules/ignore": { "version": "5.3.2", "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.2.tgz", @@ -10120,6 +10244,29 @@ "node": ">= 0.4" } }, + "node_modules/its-fine": { + "version": "1.2.5", + "resolved": "https://registry.npmjs.org/its-fine/-/its-fine-1.2.5.tgz", + "integrity": "sha512-fXtDA0X0t0eBYAGLVM5YsgJGsJ5jEmqZEPrGbzdf5awjv0xE7nqv3TVnvtUF060Tkes15DbDAKW/I48vsb6SyA==", + "dev": true, + "license": "MIT", + "dependencies": { + "@types/react-reconciler": "^0.28.0" + }, + "peerDependencies": { + "react": ">=18.0" + } + }, + "node_modules/its-fine/node_modules/@types/react-reconciler": { + "version": "0.28.9", + "resolved": "https://registry.npmjs.org/@types/react-reconciler/-/react-reconciler-0.28.9.tgz", + "integrity": "sha512-HHM3nxyUZ3zAylX8ZEyrDNd2XZOnQ0D5XfunJF5FLQnZbHHYq4UWvW1QfelQNXv1ICNkwYhfxjwfnqivYB6bFg==", + "dev": true, + "license": "MIT", + "peerDependencies": { + "@types/react": "*" + } + }, "node_modules/jest-canvas-mock": { "version": "2.5.2", "resolved": "https://registry.npmjs.org/jest-canvas-mock/-/jest-canvas-mock-2.5.2.tgz", @@ -12378,6 +12525,33 @@ "dev": true, "license": "MIT" }, + "node_modules/react-reconciler": { + "version": "0.27.0", + "resolved": "https://registry.npmjs.org/react-reconciler/-/react-reconciler-0.27.0.tgz", + "integrity": "sha512-HmMDKciQjYmBRGuuhIaKA1ba/7a+UsM5FzOZsMO2JYHt9Jh8reCb7j1eDC95NOyUlKM9KRyvdx0flBuDvYSBoA==", + "dev": true, + "license": "MIT", + "dependencies": { + "loose-envify": "^1.1.0", + "scheduler": "^0.21.0" + }, + "engines": { + "node": ">=0.10.0" + }, + "peerDependencies": { + "react": "^18.0.0" + } + }, + "node_modules/react-reconciler/node_modules/scheduler": { + "version": "0.21.0", + "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.21.0.tgz", + "integrity": "sha512-1r87x5fz9MXqswA2ERLo0EbOAU74DpIUO090gIasYTqlVoJeMcl+Z1Rg7WHz+qtPujhS/hGIt9kxZOYBV3faRQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "loose-envify": "^1.1.0" + } + }, "node_modules/react-redux": { "version": "7.2.9", "resolved": "https://registry.npmjs.org/react-redux/-/react-redux-7.2.9.tgz", @@ -12534,6 +12708,22 @@ "react-dom": ">=16.6.0" } }, + "node_modules/react-use-measure": { + "version": "2.1.7", + "resolved": "https://registry.npmjs.org/react-use-measure/-/react-use-measure-2.1.7.tgz", + "integrity": "sha512-KrvcAo13I/60HpwGO5jpW7E9DfusKyLPLvuHlUyP5zqnmAPhNc6qTRjUQrdTADl0lpPpDVU2/Gg51UlOGHXbdg==", + "dev": true, + "license": "MIT", + "peerDependencies": { + "react": ">=16.13", + "react-dom": ">=16.13" + }, + "peerDependenciesMeta": { + "react-dom": { + "optional": true + } + } + }, "node_modules/read-pkg": { "version": "5.2.0", "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-5.2.0.tgz", @@ -13776,6 +13966,16 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/suspend-react": { + "version": "0.1.3", + "resolved": "https://registry.npmjs.org/suspend-react/-/suspend-react-0.1.3.tgz", + "integrity": "sha512-aqldKgX9aZqpoDp3e8/BZ8Dm7x1pJl+qI3ZKxDN0i/IQTWUwBx/ManmlVJ3wowqbno6c2bmiIfs+Um6LbsjJyQ==", + "dev": true, + "license": "MIT", + "peerDependencies": { + "react": ">=17.0" + } + }, "node_modules/svgo": { "version": "2.8.2", "resolved": "https://registry.npmjs.org/svgo/-/svgo-2.8.2.tgz", @@ -13839,6 +14039,14 @@ "license": "MIT", "peer": true }, + "node_modules/three": { + "version": "0.185.1", + "resolved": "https://registry.npmjs.org/three/-/three-0.185.1.tgz", + "integrity": "sha512-5aojFCXKwnjBRZvUnt3WFfEcvUJgkN5LlijRFN95hMy8WVkG4I0QNcJE+OuWvuJ0bOdStrbfXn0pkd6/QyiAlg==", + "dev": true, + "license": "MIT", + "peer": true + }, "node_modules/tinybench": { "version": "2.9.0", "resolved": "https://registry.npmjs.org/tinybench/-/tinybench-2.9.0.tgz", @@ -14880,6 +15088,24 @@ "dependencies": { "zen-observable": "0.8.15" } + }, + "node_modules/zustand": { + "version": "3.7.2", + "resolved": "https://registry.npmjs.org/zustand/-/zustand-3.7.2.tgz", + "integrity": "sha512-PIJDIZKtokhof+9+60cpockVOq05sJzHCriyvaLBmEJixseQ1a5Kdov6fWZfWOu5SK9c+FhH1jU0tntLxRJYMA==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=12.7.0" + }, + "peerDependencies": { + "react": ">=16.8" + }, + "peerDependenciesMeta": { + "react": { + "optional": true + } + } } } } diff --git a/package.json b/package.json index 807809a..c67bc81 100644 --- a/package.json +++ b/package.json @@ -36,6 +36,7 @@ "@emotion/styled": "^11.13.0", "@mui/material": "^7.3.2", "@mui/x-charts": "^9.3.0", + "@react-three/fiber": "^8.18.0", "@rollup/plugin-commonjs": "^28", "@rollup/plugin-node-resolve": "^15.3.0", "@rollup/plugin-typescript": "^12.3.0", @@ -104,6 +105,9 @@ "default": "./dist/index.js" } }, + "overrides": { + "minimist": "^1.2.8" + }, "files": [ "dist" ], From a666607925342ead6f4a770eaeac147197a03516 Mon Sep 17 00:00:00 2001 From: Abigail Alexander Date: Thu, 9 Jul 2026 09:25:58 +0100 Subject: [PATCH 2/3] Remove minimist override because davidia has updated --- package.json | 3 --- 1 file changed, 3 deletions(-) diff --git a/package.json b/package.json index c67bc81..ab0d4f1 100644 --- a/package.json +++ b/package.json @@ -105,9 +105,6 @@ "default": "./dist/index.js" } }, - "overrides": { - "minimist": "^1.2.8" - }, "files": [ "dist" ], From 37f1c2ebcf401014a21bdb5371a7f27c46060cd5 Mon Sep 17 00:00:00 2001 From: Abigail Alexander Date: Thu, 9 Jul 2026 09:43:04 +0100 Subject: [PATCH 3/3] Update README --- README.md | 37 +++++++++++++++++++++++++++---------- 1 file changed, 27 insertions(+), 10 deletions(-) diff --git a/README.md b/README.md index bd0c6d3..e12d381 100644 --- a/README.md +++ b/README.md @@ -82,8 +82,13 @@ To make use of PVs in cs-web-lib widgets, you need to connect to PVWS. The basic ``` { - storeMode: "DEV" | PROD" - PVWS_SOCKET: string + storeMode: "DEV" | PROD", + classFile: string, + defaultMjpgEndpoint: string, + csWebLibFeatureFlags: { + enableDynamicScripts: boolean + }, + PVWS_SOCKET: string, PVWS_SSL: boolean, THROTTLE_PERIOD: integer } @@ -94,6 +99,9 @@ The configuration parameters are: | Parameter | type | Description | |- | -| - | | storeMode | string | Either DEV or PROD, default is PROD. In DEV mode the redux store devTools, immutable & serializable checks are switched on; in prod mode they are switch off to improve performance. | +| classFile | string | A URL that points towards the location of a .bcf, or .bob class file. This file will be used to apply style via classes like Phoebus does to all files. | +| defaultMjpgEndpoint | string | A URL that points towards the Mjpeg endpoint for the Image widget. This endpoint combined with a PV name returns an MJPEG stream to be displayed. | +| enableDynamicScripts | boolean | Either enables or disables the dynamic scripting functionality. It is `false` by default. | | PVWS_SOCKET | string | The fully qualified hostname and port of the instance of the PVWS web service | | PVWS_SSL | boolean | If true use https, if false use http for connecting to the PVWS web service | | THROTTLE_PERIOD | integer | The period in milliseconds between updates of the PV state variables | @@ -118,7 +126,13 @@ export const loadConfig = async (): Promise => { config = { PVWS_SOCKET: undefined, PVWS_SSL: undefined, - THROTTLE_PERIOD: undefined + THROTTLE_PERIOD: undefined, + storeMode: undefined, + defaultMjpgEndpoint: undefined, + csWebLibFeatureFlags: { + enableDynamicScripts: false + }, + classFile: undefined }; } @@ -153,6 +167,8 @@ export default App; Now you can use cs-web-lib to display .bob files and see updates to PV values. +If you're making use of a widget such as the Image widget, you can provide a default disconnected symbol for this widget to use by creating a file `/public/images/disconnectedImage.svg`. If the stream fails to connect, it will instead show this image. + **Displaying a .bob file** To view a file in the client application, make use of the display components. These are: @@ -166,7 +182,7 @@ To view a file in the client application, make use of the display components. Th defaultProtocol: "ca" // Or "pva", macros: {} }} - position={new RelativePosition("0", "0", "100%", "100%")} + position={newRelativePosition("0", "0", "100%", "100%")} scroll={false} resize={"scroll-content"} /> @@ -197,17 +213,18 @@ To view a file in the client application, make use of the display components. Th name: "new", location: "main", description: undefined, + pvwsHost: "pvws-host.diamond.ac.uk" file: { path: "/my/new_file.bob macros: {}, defaultProtocol: "ca" } } - }, - fileContext, - undefined, - {}, - " + }, // our action to execute + fileContext, // the file context + undefined, //files + {}, //macros + "browser-url.diamond.ac.uk" //url address ); }; @@ -216,7 +233,7 @@ To view a file in the client application, make use of the display components. Th