Skip to main content

Home > @jsplumbtoolkit/browser-ui-react > SurfaceProps

SurfaceProps interface#

Props for the Surface component. You are expected to provide, at a minimum, an instance of BrowserUIReact to this component, and in practise you will also almost certainly want to pass a view and renderParams.

Asynchronous rendering ----------------------

From version 5.8.0 onwards this component will, by default, render vertices "asynchronously", which is to say that it will hold off informing the Toolkit that the rendering of some vertex has been completed until an internal ResizeObserver detects that the initial hydration of the element is complete. This mechanism is of particular use when you're bulk loading data and you're using React 18, as React 18's rendering pipeline does not always hydrate a component immediately, and the Toolkit cannot therefore effectively run a layout or compute the positions of connectors.

ResizeObserver is supported on all recent versions of modern browsers, but not on IE11. In the absence of ResizeObserver, the component will fall back to the "synchronous" rendering mechanism.

It is extremely unlikely you will want to switch off asynchronous rendering, but you can do so by setting the prop asynchronous to false.

Signature:

export interface SurfaceProps 

Properties#

PropertyTypeDescription
asynchronous?boolean(Optional) Whether or not the renderer should run in "asynchronous" mode. See notes above.
childProps?any(Optional) Any props to pass to children.
renderParams?SurfaceRenderOptions(Optional) Render parameters such as layout, drag options etc
toolkitBrowserUIReactThe toolkit to render. Required.
view?any(Optional) Mappings of vertex types to components/jsx and edge types.