remold/ui

Scene

A canvas scene of objects that springs between layouts.

Two clients talk to one API, which owns the database.

Installation

npm install @remold-ui/react

Import scenes from @remold-ui/react/canvas so canvas rendering stays opt-in.

Using plain JavaScript? Install @remold-ui/canvas instead.

Usage

import { Remold } from "@remold-ui/react/canvas";

<Remold.Scene label="Our architecture" objects={objects} layouts={layouts} layout={layout} />

Describe the objects once and each layout as plain data: where every object sits, and the camera. Changing layout (or calling to with a layout's name) springs every object, link and the camera to the new arrangement. People can drag to turn the scene, tap an object to focus it, or tab through the objects with a screen reader.

API reference

Prop

Type

Data attributes

AttributeMeaning
data-rm-layoutThe layout on screen.
data-rm-focusedThe focused object, if any.

On this page