From 7f5aef1d445ad38426cb59af773840db97f7f64a Mon Sep 17 00:00:00 2001 From: Jim Risen Date: Wed, 2 Sep 2026 03:32:45 +0300 Subject: [PATCH 1/5] chore(examples): use scichart-react 2.0.0-alpha.2 from npm instead of the vendored stub --- Examples/package-lock.json | 11 +++++++++++ Examples/package.json | 1 + Examples/tsconfig.json | 3 --- Examples/webpack.client.config.js | 2 +- Examples/webpack.client.no_server.config.ts | 2 +- Examples/webpack.server.config.js | 2 +- 6 files changed, 15 insertions(+), 6 deletions(-) diff --git a/Examples/package-lock.json b/Examples/package-lock.json index b4e4917d1..d4e32dd4b 100644 --- a/Examples/package-lock.json +++ b/Examples/package-lock.json @@ -50,6 +50,7 @@ "rxjs": "^7.5.6", "scichart": "6.0.0-alpha.164", "scichart-financial-tools": "6.0.0-alpha.164", + "scichart-react": "2.0.0-alpha.2", "socket.io": "^4.5.2", "socket.io-client": "^4.7.5", "websocket-ts": "^1.1.1", @@ -11340,6 +11341,16 @@ "scichart": "^6.0.0-alpha.164" } }, + "node_modules/scichart-react": { + "version": "2.0.0-alpha.2", + "resolved": "https://registry.npmjs.org/scichart-react/-/scichart-react-2.0.0-alpha.2.tgz", + "integrity": "sha512-Q1n72TF00Pp2Za0AmOzShd0dtJEtR66gr/RjKqtZCGKXI83wBIH1ZrRcIYqITgzRrn6IHo5fmskul7xLD7rUhg==", + "license": "MIT", + "peerDependencies": { + "react": ">=16.14.0", + "scichart": ">=6.0.0-0" + } + }, "node_modules/select-hose": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/select-hose/-/select-hose-2.0.0.tgz", diff --git a/Examples/package.json b/Examples/package.json index 687ff9706..9029d755f 100644 --- a/Examples/package.json +++ b/Examples/package.json @@ -79,6 +79,7 @@ "rxjs": "^7.5.6", "scichart": "6.0.0-alpha.164", "scichart-financial-tools": "6.0.0-alpha.164", + "scichart-react": "2.0.0-alpha.2", "socket.io": "^4.5.2", "socket.io-client": "^4.7.5", "websocket-ts": "^1.1.1", diff --git a/Examples/tsconfig.json b/Examples/tsconfig.json index c78829335..2ae41322a 100644 --- a/Examples/tsconfig.json +++ b/Examples/tsconfig.json @@ -25,9 +25,6 @@ "module": "ESNext", "moduleResolution": "bundler", "baseUrl": ".", - "paths": { - "scichart-react": ["./src/scichart-react/index.ts"] - }, "target": "es2018", "downlevelIteration": true, "jsx": "react-jsx", diff --git a/Examples/webpack.client.config.js b/Examples/webpack.client.config.js index 28fe6410b..bd69a03c0 100644 --- a/Examples/webpack.client.config.js +++ b/Examples/webpack.client.config.js @@ -68,7 +68,7 @@ module.exports = { resolve: { extensions: [".tsx", ".ts", ".js", ".css"], alias: { - "scichart-react": path.resolve(__dirname, "./src/scichart-react"), + // "scichart-react": path.resolve(__dirname, "./src/scichart-react"), "scichart-addons": path.resolve(__dirname, "../Addons"), }, }, diff --git a/Examples/webpack.client.no_server.config.ts b/Examples/webpack.client.no_server.config.ts index 444254585..d147bc81e 100644 --- a/Examples/webpack.client.no_server.config.ts +++ b/Examples/webpack.client.no_server.config.ts @@ -19,7 +19,7 @@ module.exports = { resolve: { extensions: [".tsx", ".ts", ".js", ".css"], alias: { - "scichart-react": path.resolve(__dirname, "./src/scichart-react"), + // "scichart-react": path.resolve(__dirname, "./src/scichart-react"), "scichart-addons": path.resolve(__dirname, "../Addons"), }, fallback: { diff --git a/Examples/webpack.server.config.js b/Examples/webpack.server.config.js index 259da5239..e48a87c2f 100644 --- a/Examples/webpack.server.config.js +++ b/Examples/webpack.server.config.js @@ -81,7 +81,7 @@ module.exports = { resolve: { extensions: [".tsx", ".ts", ".js"], alias: { - "scichart-react": path.resolve(__dirname, "./src/scichart-react"), + // "scichart-react": path.resolve(__dirname, "./src/scichart-react"), "scichart-addons": path.resolve(__dirname, "../Addons"), }, }, From bf4e1dfec3de0b5a5e924c2c6aba0b26269bd382 Mon Sep 17 00:00:00 2001 From: Jim Risen Date: Wed, 2 Sep 2026 03:32:45 +0300 Subject: [PATCH 2/5] fix(examples): fix custom theme instance, custom type registration and raw JSX tag in example docs --- .../BuilderApi/CustomTypes/drawExample.ts | 2 +- .../BuilderApi/FullChart/exampleInfo.tsx | 2 +- .../UsingThemeManager/drawExample.ts | 34 +++++++++---------- 3 files changed, 19 insertions(+), 19 deletions(-) diff --git a/Examples/src/components/Examples/BuilderApi/CustomTypes/drawExample.ts b/Examples/src/components/Examples/BuilderApi/CustomTypes/drawExample.ts index 791ee7dcc..f49991469 100644 --- a/Examples/src/components/Examples/BuilderApi/CustomTypes/drawExample.ts +++ b/Examples/src/components/Examples/BuilderApi/CustomTypes/drawExample.ts @@ -32,7 +32,7 @@ registerAllTypes(); // Define a custom PaletteProvider export class ExampleMountainPaletteProvider implements IStrokePaletteProvider, IFillPaletteProvider { - public static Name: "ExampleMountain"; + public static Name = "ExampleMountain"; public readonly strokePaletteMode = EStrokePaletteMode.SOLID; public readonly fillPaletteMode = EFillPaletteMode.SOLID; private readonly palettedStroke: number; diff --git a/Examples/src/components/Examples/BuilderApi/FullChart/exampleInfo.tsx b/Examples/src/components/Examples/BuilderApi/FullChart/exampleInfo.tsx index 273098a84..249d7b86b 100644 --- a/Examples/src/components/Examples/BuilderApi/FullChart/exampleInfo.tsx +++ b/Examples/src/components/Examples/BuilderApi/FullChart/exampleInfo.tsx @@ -29,7 +29,7 @@ const metaData: IExampleMetadata = metaDescription: "Demonstrates how to use the Builder Api to configure axes, series, annotations and modifiers using a definition object. The builder api is designed to make it easier to discover the types and options available in SciChart JS.", markdownContent: - "## Full Chart Using Builder API with React\n\n### Overview\nThis example demonstrates how to integrate SciChart.js with React using the Builder API. The chart is fully configured via a JSON object that specifies axes, series, annotations, and interaction modifiers, making it simple to construct complex, high-performance charts. Developers can refer to the [Builder API documentation](https://www.scichart.com/documentation/js/v5/2d-charts/builder-api/builder-api-overview/) for more details on this approach.\n\n### Technical Implementation\nThe implementation leverages the Builder API to define all chart components as JSON data. The React integration is achieved using the component, which calls the asynchronous draw function to initialize the chart. This function sets up a categorical X-Axis, two numeric Y-Axes, and multiple series, including a spline mountain series with a gradient fill and a bubble series featuring custom point markers. For additional information on multi-axis configuration, see the [Adding Multiple Axis tutorial](https://www.scichart.com/documentation/js/v5/get-started/tutorials-js-npm-webpack/tutorial-08-adding-multiple-axis/), and for custom series implementation, explore the [JavaScript Bubble Chart example](https://www.scichart.com/example/javascript-chart/javascript-bubble-chart/).\n\n### Features and Capabilities\nThis example not only demonstrates the creation of a fully configured chart but also highlights advanced features such as gradient fills, custom point markers, and flexible annotation placement using both data and relative coordinate modes. Interaction modifiers like rollover, mouse wheel zoom, and zoom extents add an extra layer of interactivity. Annotations are precisely configured, as detailed in the [Adding Annotations tutorial](https://www.scichart.com/documentation/js/v5/get-started/tutorials-js-npm-webpack/tutorial-06-adding-annotations/), providing clear insight into how text and coordinate modes can enhance data visualization.\n\n### Integration and Best Practices\nSeamless React integration is a key aspect of this example. By wrapping the chart initialization within a React component, developers can manage the chart’s lifecycle alongside other React components. This design follows best practices for performance and maintainability. For further insights on integrating SciChart.js into React projects, check out the [React Charts with SciChart.js: Introducing “SciChart React”](https://www.scichart.com/blog/react-charts-with-scichart-js/) article. Additionally, performance optimization techniques discussed in [Performance Optimisation of JavaScript Applications & Charts](https://www.scichart.com/blog/performance-optimisation-of-javascript-applications-charts/) can help ensure efficient rendering even with complex configurations.", + "## Full Chart Using Builder API with React\n\n### Overview\nThis example demonstrates how to integrate SciChart.js with React using the Builder API. The chart is fully configured via a JSON object that specifies axes, series, annotations, and interaction modifiers, making it simple to construct complex, high-performance charts. Developers can refer to the [Builder API documentation](https://www.scichart.com/documentation/js/v5/2d-charts/builder-api/builder-api-overview/) for more details on this approach.\n\n### Technical Implementation\nThe implementation leverages the Builder API to define all chart components as JSON data. The React integration is achieved using the `` component, which calls the asynchronous draw function to initialize the chart. This function sets up a categorical X-Axis, two numeric Y-Axes, and multiple series, including a spline mountain series with a gradient fill and a bubble series featuring custom point markers. For additional information on multi-axis configuration, see the [Adding Multiple Axis tutorial](https://www.scichart.com/documentation/js/v5/get-started/tutorials-js-npm-webpack/tutorial-08-adding-multiple-axis/), and for custom series implementation, explore the [JavaScript Bubble Chart example](https://www.scichart.com/example/javascript-chart/javascript-bubble-chart/).\n\n### Features and Capabilities\nThis example not only demonstrates the creation of a fully configured chart but also highlights advanced features such as gradient fills, custom point markers, and flexible annotation placement using both data and relative coordinate modes. Interaction modifiers like rollover, mouse wheel zoom, and zoom extents add an extra layer of interactivity. Annotations are precisely configured, as detailed in the [Adding Annotations tutorial](https://www.scichart.com/documentation/js/v5/get-started/tutorials-js-npm-webpack/tutorial-06-adding-annotations/), providing clear insight into how text and coordinate modes can enhance data visualization.\n\n### Integration and Best Practices\nSeamless React integration is a key aspect of this example. By wrapping the chart initialization within a React component, developers can manage the chart’s lifecycle alongside other React components. This design follows best practices for performance and maintainability. For further insights on integrating SciChart.js into React projects, check out the [React Charts with SciChart.js: Introducing “SciChart React”](https://www.scichart.com/blog/react-charts-with-scichart-js/) article. Additionally, performance optimization techniques discussed in [Performance Optimisation of JavaScript Applications & Charts](https://www.scichart.com/blog/performance-optimisation-of-javascript-applications-charts/) can help ensure efficient rendering even with complex configurations.", }, angular: { subtitle: diff --git a/Examples/src/components/Examples/Charts2D/StylingAndTheming/UsingThemeManager/drawExample.ts b/Examples/src/components/Examples/Charts2D/StylingAndTheming/UsingThemeManager/drawExample.ts index bfde4fbe2..871ca69ad 100644 --- a/Examples/src/components/Examples/Charts2D/StylingAndTheming/UsingThemeManager/drawExample.ts +++ b/Examples/src/components/Examples/Charts2D/StylingAndTheming/UsingThemeManager/drawExample.ts @@ -113,20 +113,20 @@ export const getChartsInitializationAPI = () => { }; // Create a custom theme based on light theme + some modifications -const customTheme: IThemeProvider = { - ...new SciChartJSLightTheme(), - axisBandsFill: "#83D2F511", - axisBorder: "#1F3D68", - gridBackgroundBrush: "white", - gridBorderBrush: "white", - loadingAnimationForeground: "#6495ED77", - loadingAnimationBackground: "#E4F5FC", - majorGridLineBrush: "#264B9322", - minorGridLineBrush: "#264B9306", - sciChartBackground: "#E4F5FC", - tickTextBrush: "#1F3D68", - axisTitleColor: "#1F3D68", - // auto / default colour palette for lines and fills - strokePalette: ["#264B93", "#A16DAE", "#C52E60"], - fillPalette: ["#264B9333", "#A16DAE33", "#C52E6033"], -}; +// (modifying a constructed theme instance, as SciChartSurface.create expects an IThemeProvider instance) +const customTheme: IThemeProvider = new SciChartJSLightTheme(); + +customTheme.axisBandsFill = "#83D2F511"; +customTheme.axisBorder = "#1F3D68"; +customTheme.gridBackgroundBrush = "white"; +customTheme.gridBorderBrush = "white"; +customTheme.loadingAnimationForeground = "#6495ED77"; +customTheme.loadingAnimationBackground = "#E4F5FC"; +customTheme.majorGridLineBrush = "#264B9322"; +customTheme.minorGridLineBrush = "#264B9306"; +customTheme.sciChartBackground = "#E4F5FC"; +customTheme.tickTextBrush = "#1F3D68"; +customTheme.axisTitleColor = "#1F3D68"; +// auto / default colour palette for lines and fills +customTheme.strokePalette = ["#264B93", "#A16DAE", "#C52E60"]; +customTheme.fillPalette = ["#264B9333", "#A16DAE33", "#C52E6033"]; From 1aeecd886e6f3baa9c1d8aedd6e6491d365e3c41 Mon Sep 17 00:00:00 2001 From: Jim Risen Date: Wed, 2 Sep 2026 03:32:45 +0300 Subject: [PATCH 3/5] chore(boilerplates): update react-vite to scichart-react 2.0.0-alpha.2 and single wasm --- BoilerPlates/react-vite/package-lock.json | 25 +++++++++++++---------- BoilerPlates/react-vite/package.json | 4 ++-- BoilerPlates/react-vite/src/App.tsx | 5 +++-- BoilerPlates/react-vite/vite.config.ts | 17 +++------------ 4 files changed, 22 insertions(+), 29 deletions(-) diff --git a/BoilerPlates/react-vite/package-lock.json b/BoilerPlates/react-vite/package-lock.json index 841871c6a..9a4e8ad60 100644 --- a/BoilerPlates/react-vite/package-lock.json +++ b/BoilerPlates/react-vite/package-lock.json @@ -10,8 +10,8 @@ "dependencies": { "react": "^18.2.0", "react-dom": "^18.2.0", - "scichart": "6.0.0-alpha.145", - "scichart-react": "^0.1.13", + "scichart": "6.0.0-alpha.164", + "scichart-react": "2.0.0-alpha.2", "vite-plugin-static-copy": "^4.1.1" }, "devDependencies": { @@ -2471,19 +2471,22 @@ } }, "node_modules/scichart": { - "version": "6.0.0-alpha.145", - "resolved": "https://registry.npmjs.org/scichart/-/scichart-6.0.0-alpha.145.tgz", - "integrity": "sha512-dCenV+RQQzn6QcDUfoOM/789E8eKJNnt9kw5YmHbkQzn8FBv7MblAZtZRpXXouMe7uRbfTD8fQot/xFcWVYnBw==", - "license": "https://www.scichart.com/scichart-eula" + "version": "6.0.0-alpha.164", + "resolved": "https://registry.npmjs.org/scichart/-/scichart-6.0.0-alpha.164.tgz", + "integrity": "sha512-Tw8g9WORJRCywoHwKZR0nh14tZpgmBCzQY3cEg6CUAOAJh7SMfskGOh0DMHmsZZr9xIrgIt0U2YJZWbZQ++KSA==", + "license": "https://www.scichart.com/scichart-eula", + "engines": { + "node": ">=22" + } }, "node_modules/scichart-react": { - "version": "0.1.13", - "resolved": "https://registry.npmjs.org/scichart-react/-/scichart-react-0.1.13.tgz", - "integrity": "sha512-J7gc9I8W1v+iMyXPrDfFr8msHTftNCvdP26IBlGfzjyNZvThn+EpWCm/KZJzLJXNbjamg3kLyZjiz+o1MIU+Mw==", + "version": "2.0.0-alpha.2", + "resolved": "https://registry.npmjs.org/scichart-react/-/scichart-react-2.0.0-alpha.2.tgz", + "integrity": "sha512-Q1n72TF00Pp2Za0AmOzShd0dtJEtR66gr/RjKqtZCGKXI83wBIH1ZrRcIYqITgzRrn6IHo5fmskul7xLD7rUhg==", "license": "MIT", "peerDependencies": { - "react": ">=16.8.0", - "scichart": ">=3.2.516-0" + "react": ">=16.14.0", + "scichart": ">=6.0.0-0" } }, "node_modules/semver": { diff --git a/BoilerPlates/react-vite/package.json b/BoilerPlates/react-vite/package.json index 3dd52e228..1d577475c 100644 --- a/BoilerPlates/react-vite/package.json +++ b/BoilerPlates/react-vite/package.json @@ -13,8 +13,8 @@ "dependencies": { "react": "^18.2.0", "react-dom": "^18.2.0", - "scichart": "6.0.0-alpha.145", - "scichart-react": "^0.1.13", + "scichart": "6.0.0-alpha.164", + "scichart-react": "2.0.0-alpha.2", "vite-plugin-static-copy": "^4.1.1" }, "devDependencies": { diff --git a/BoilerPlates/react-vite/src/App.tsx b/BoilerPlates/react-vite/src/App.tsx index 021da3a97..4c5e75ccd 100644 --- a/BoilerPlates/react-vite/src/App.tsx +++ b/BoilerPlates/react-vite/src/App.tsx @@ -67,8 +67,9 @@ function App() {

SciChart with React + Vite

+ // (imported from "scichart-react") with a `config` prop like this: // config={{ // type: ESciChartSurfaceType.Default2D, // xAxes: [{ type: EAxisType.NumericAxis }], diff --git a/BoilerPlates/react-vite/vite.config.ts b/BoilerPlates/react-vite/vite.config.ts index b4dd481a1..1f3eb69bd 100644 --- a/BoilerPlates/react-vite/vite.config.ts +++ b/BoilerPlates/react-vite/vite.config.ts @@ -8,22 +8,11 @@ export default defineConfig({ react(), viteStaticCopy({ targets: [ + // WebAssembly modules copied to the output root, e.g. served at /scichart.wasm { - src: "node_modules/scichart/_wasm/scichart2d.wasm", - dest: "", - }, - { - src: "node_modules/scichart/_wasm/scichart2d-nosimd.wasm", - dest: "", - }, - // same for 3d if needed: - { - src: "node_modules/scichart/_wasm/scichart3d.wasm", - dest: "", - }, - { - src: "node_modules/scichart/_wasm/scichart3d-nosimd.wasm", + src: "node_modules/scichart/_wasm/*", dest: "", + rename: { stripBase: true }, }, ], }), From 93f3aea8cf43af41f0fddbb9a8c37a35ec97e67b Mon Sep 17 00:00:00 2001 From: Jim Risen Date: Wed, 2 Sep 2026 03:32:45 +0300 Subject: [PATCH 4/5] chore(boilerplates): update scichart-react boilerplate to 2.0.0-alpha.2 with SciChartDeclarative --- BoilerPlates/scichart-react/Readme.md | 68 ++++++++++++++++--- BoilerPlates/scichart-react/package-lock.json | 25 ++++--- BoilerPlates/scichart-react/package.json | 6 +- BoilerPlates/scichart-react/src/App.jsx | 4 +- BoilerPlates/scichart-react/webpack.config.js | 9 +-- 5 files changed, 80 insertions(+), 32 deletions(-) diff --git a/BoilerPlates/scichart-react/Readme.md b/BoilerPlates/scichart-react/Readme.md index 056f77070..e17ef8ca1 100644 --- a/BoilerPlates/scichart-react/Readme.md +++ b/BoilerPlates/scichart-react/Readme.md @@ -18,7 +18,7 @@ npm install scichart scichart-react ## Step 2: Wasm file deployment -SciChart.js uses WebAssembly files which must be served. The easiest way to do this is to copy the wasm files from the node_modules/scichart/\_wasm folder to your output folder. +SciChart.js uses WebAssembly modules which must be served. The easiest way to do this is to copy everything from the node_modules/scichart/\_wasm folder to your output folder. e.g. with webpack.config.js: @@ -27,8 +27,7 @@ e.g. with webpack.config.js: new CopyPlugin({ patterns: [ { from: "src/index.html", to: "" }, - { from: "node_modules/scichart/_wasm/scichart2d.wasm", to: "" }, - { from: "node_modules/scichart/_wasm/scichart3d.wasm", to: "" }, + { from: "node_modules/scichart/_wasm/", to: "" }, ], }) ], @@ -36,13 +35,66 @@ e.g. with webpack.config.js: > Note: you can load wasm from CDN to simplify getting started `SciChartSurface.useWasmFromCDN();` -## Step 3: Creating the chart +## Step 3: Creating the chart with an init function -After that, you can define a config object to create a SciChartSurface like this. +The recommended way to create a chart is the `SciChartReact` component with an `initChart` function, which creates a SciChartSurface on the provided root element: ```javascript import React from "react"; import { SciChartReact } from "scichart-react"; +import { + SciChartSurface, + NumericAxis, + NumberRange, + XyDataSeries, + FastLineRenderableSeries, + MouseWheelZoomModifier, + ZoomPanModifier, + ZoomExtentsModifier, +} from "scichart"; + +async function initChart(rootElement) { + const { sciChartSurface, wasmContext } = await SciChartSurface.create(rootElement); + + sciChartSurface.xAxes.add( + new NumericAxis(wasmContext, { axisTitle: "X Axis", growBy: new NumberRange(0.1, 0.1) }) + ); + sciChartSurface.yAxes.add( + new NumericAxis(wasmContext, { axisTitle: "Y Axis", growBy: new NumberRange(0.1, 0.1) }) + ); + + sciChartSurface.renderableSeries.add( + new FastLineRenderableSeries(wasmContext, { + dataSeries: new XyDataSeries(wasmContext, { + xValues: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9], + yValues: [0, 0.0998, 0.1986, 0.2955, 0.3894, 0.4794, 0.5646, 0.6442, 0.7173, 0.7833], + }), + stroke: "steelblue", + strokeThickness: 3, + }) + ); + + sciChartSurface.chartModifiers.add( + new MouseWheelZoomModifier(), + new ZoomPanModifier({ enableZoom: true }), + new ZoomExtentsModifier() + ); + + return { sciChartSurface }; +} + +function App() { + return ; +} +``` + +## Step 4: Alternative - declarative chart from a Builder API config + +Alternatively, you can define a Builder API config object and render it with the `SciChartDeclarative` component. This is the approach used in this boilerplate's `src/App.jsx`. + +```javascript +import React from "react"; +import { SciChartDeclarative } from "scichart-react"; import { SweepAnimation, SciChartJsNavyTheme, @@ -119,9 +171,7 @@ const chartConfig = { }; ``` -## Step 4: Create a React Component - -Charts can be initialized with the SciChartReact Component using the `config` property. +Then render it with the SciChartDeclarative Component using the `config` property. ```javascript function App() { @@ -145,7 +195,7 @@ function App() { scichart-react to create a simple chart with one X and Y axis

- + ); } diff --git a/BoilerPlates/scichart-react/package-lock.json b/BoilerPlates/scichart-react/package-lock.json index 4848ba8f3..a8ab64545 100644 --- a/BoilerPlates/scichart-react/package-lock.json +++ b/BoilerPlates/scichart-react/package-lock.json @@ -11,8 +11,8 @@ "dependencies": { "react": "^19.0.0", "react-dom": "^19.0.0", - "scichart": "^5.0.0-alpha.135", - "scichart-react": "^0.2.0-beta.2" + "scichart": "6.0.0-alpha.164", + "scichart-react": "2.0.0-alpha.2" }, "devDependencies": { "@babel/core": "^7.21.4", @@ -3734,19 +3734,22 @@ } }, "node_modules/scichart": { - "version": "5.0.0-alpha.135", - "resolved": "https://registry.npmjs.org/scichart/-/scichart-5.0.0-alpha.135.tgz", - "integrity": "sha512-veiL/RrDeXbTGbXRWqmiW0WSPaO8m+aBVgymq+bwi8Vuj0iqob2ME+wZN9GYt8K6uqmfG9N7hy1n9kNnezSuJA==", - "license": "https://www.scichart.com/scichart-eula" + "version": "6.0.0-alpha.164", + "resolved": "https://registry.npmjs.org/scichart/-/scichart-6.0.0-alpha.164.tgz", + "integrity": "sha512-Tw8g9WORJRCywoHwKZR0nh14tZpgmBCzQY3cEg6CUAOAJh7SMfskGOh0DMHmsZZr9xIrgIt0U2YJZWbZQ++KSA==", + "license": "https://www.scichart.com/scichart-eula", + "engines": { + "node": ">=22" + } }, "node_modules/scichart-react": { - "version": "0.2.0-beta.2", - "resolved": "https://registry.npmjs.org/scichart-react/-/scichart-react-0.2.0-beta.2.tgz", - "integrity": "sha512-GOCDzWXsmgQTfc2hCe0OdPd7GbYHvs5da3xX63xvFMgUAASuMXaDsEI9ZjD2zcy9Rb5jO90qpBSICEy6tiqg1Q==", + "version": "2.0.0-alpha.2", + "resolved": "https://registry.npmjs.org/scichart-react/-/scichart-react-2.0.0-alpha.2.tgz", + "integrity": "sha512-Q1n72TF00Pp2Za0AmOzShd0dtJEtR66gr/RjKqtZCGKXI83wBIH1ZrRcIYqITgzRrn6IHo5fmskul7xLD7rUhg==", "license": "MIT", "peerDependencies": { - "react": ">=16.8.0", - "scichart": ">=4.0.0-beta" + "react": ">=16.14.0", + "scichart": ">=6.0.0-0" } }, "node_modules/select-hose": { diff --git a/BoilerPlates/scichart-react/package.json b/BoilerPlates/scichart-react/package.json index d09f1755a..0900fc14e 100644 --- a/BoilerPlates/scichart-react/package.json +++ b/BoilerPlates/scichart-react/package.json @@ -23,10 +23,10 @@ "dependencies": { "react": "^19.0.0", "react-dom": "^19.0.0", - "scichart": "^5.0.0-alpha.135", - "scichart-react": "^0.2.0-beta.2" + "scichart": "6.0.0-alpha.164", + "scichart-react": "2.0.0-alpha.2" }, "overrides": { - "scichart": "^5.0.0-alpha.135" + "scichart": "$scichart" } } diff --git a/BoilerPlates/scichart-react/src/App.jsx b/BoilerPlates/scichart-react/src/App.jsx index 82b80ed2e..aae5f63ab 100644 --- a/BoilerPlates/scichart-react/src/App.jsx +++ b/BoilerPlates/scichart-react/src/App.jsx @@ -8,7 +8,7 @@ import { EPointMarkerType, } from "scichart"; import React from "react"; -import { SciChartReact } from "scichart-react"; +import { SciChartDeclarative } from "scichart-react"; const chartConfig = { surface: { @@ -101,7 +101,7 @@ function App() { scichart-react to create a simple chart with one X and Y axis

- Date: Wed, 2 Sep 2026 14:39:44 +0300 Subject: [PATCH 5/5] chore(examples): keep scichart-react tsconfig paths alias commented out instead of removed --- Examples/tsconfig.json | 3 +++ 1 file changed, 3 insertions(+) diff --git a/Examples/tsconfig.json b/Examples/tsconfig.json index 2ae41322a..e20988911 100644 --- a/Examples/tsconfig.json +++ b/Examples/tsconfig.json @@ -25,6 +25,9 @@ "module": "ESNext", "moduleResolution": "bundler", "baseUrl": ".", + // "paths": { + // "scichart-react": ["./src/scichart-react/index.ts"] + // }, "target": "es2018", "downlevelIteration": true, "jsx": "react-jsx",