@rerun-io/web-viewer-react 0.17.0-alpha.7 → 0.17.0-alpha.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +7 -3
- package/index.js +3 -1
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -21,7 +21,7 @@ $ npm i @rerun-io/web-viewer-react
|
|
|
21
21
|
```
|
|
22
22
|
|
|
23
23
|
ℹ️ Note:
|
|
24
|
-
The package version is equal to the supported Rerun SDK version.
|
|
24
|
+
The package version is equal to the supported Rerun SDK version, and [RRD files are not yet stable across different versions](https://github.com/rerun-io/rerun/issues/6410).
|
|
25
25
|
This means that `@rerun-io/web-viewer-react@0.10.0` can only connect to a data source (`.rrd` file, websocket connection, etc.) that originates from a Rerun SDK with version `0.10.0`!
|
|
26
26
|
|
|
27
27
|
## Usage
|
|
@@ -30,15 +30,19 @@ This means that `@rerun-io/web-viewer-react@0.10.0` can only connect to a data s
|
|
|
30
30
|
import WebViewer from "@rerun-io/web-viewer-react";
|
|
31
31
|
|
|
32
32
|
export default function App() {
|
|
33
|
-
return <WebViewer rrd="...">
|
|
33
|
+
return <WebViewer width="800px" height="600px" rrd="...">
|
|
34
34
|
}
|
|
35
35
|
```
|
|
36
36
|
|
|
37
37
|
The `rrd` in the snippet above should be a URL pointing to either:
|
|
38
|
-
- A hosted `.rrd` file, such as <https://app.rerun.io/version/0.17.0-alpha.
|
|
38
|
+
- A hosted `.rrd` file, such as <https://app.rerun.io/version/0.17.0-alpha.9/examples/dna.rrd>
|
|
39
39
|
- A WebSocket connection to the SDK opened via the [`serve`](https://www.rerun.io/docs/reference/sdk-operating-modes#serve) API
|
|
40
40
|
|
|
41
41
|
If `rrd` is not set, the Viewer will display the same welcome screen as <https://app.rerun.io>.
|
|
42
|
+
This can be disabled by setting the `hide_welcome_screen` prop to `true`.
|
|
43
|
+
|
|
44
|
+
⚠ It's important to set the viewer's width and height, as without it the viewer may not display correctly.
|
|
45
|
+
Setting the values to empty strings is valid, as long as you style the canvas through other means.
|
|
42
46
|
|
|
43
47
|
ℹ️ Note:
|
|
44
48
|
This package only targets recent versions of browsers.
|
package/index.js
CHANGED
|
@@ -44,6 +44,8 @@ export default class WebViewer extends React.Component {
|
|
|
44
44
|
const current = /** @type {HTMLDivElement} */ (this.#parent.current);
|
|
45
45
|
this.#handle.start(this.#recordings, current, {
|
|
46
46
|
hide_welcome_screen: this.#hide_welcome_screen,
|
|
47
|
+
width: "100%",
|
|
48
|
+
height: "100%",
|
|
47
49
|
});
|
|
48
50
|
}
|
|
49
51
|
|
|
@@ -61,7 +63,7 @@ export default class WebViewer extends React.Component {
|
|
|
61
63
|
}
|
|
62
64
|
|
|
63
65
|
render() {
|
|
64
|
-
const { width = "
|
|
66
|
+
const { width = "640px", height = "360px" } = this.props;
|
|
65
67
|
return React.createElement("div", {
|
|
66
68
|
className: "rerun-web-viewer",
|
|
67
69
|
style: { width, height, position: "relative" },
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@rerun-io/web-viewer-react",
|
|
3
|
-
"version": "0.17.0-alpha.
|
|
3
|
+
"version": "0.17.0-alpha.9",
|
|
4
4
|
"description": "Embed the Rerun web viewer in your React app",
|
|
5
5
|
"licenses": [
|
|
6
6
|
{
|
|
@@ -39,7 +39,7 @@
|
|
|
39
39
|
"tsconfig.json"
|
|
40
40
|
],
|
|
41
41
|
"dependencies": {
|
|
42
|
-
"@rerun-io/web-viewer": "0.17.0-alpha.
|
|
42
|
+
"@rerun-io/web-viewer": "0.17.0-alpha.9",
|
|
43
43
|
"@types/react": "^18.2.33",
|
|
44
44
|
"react": "^18.2.0"
|
|
45
45
|
},
|