Published
Edited
Oct 2, 2021
Insert cell
Insert cell
Insert cell
render(() =>
form({
schema,
onChange: (type) => console.log(type),
onSubmit: (type) => console.log(type),
onError: (type) => console.log(type)
})
)
Insert cell
Insert cell
render(
() =>
jsx`<${Form} schema=${schema}
onChange=${() => console.log("changed")}
onSubmit=${() => console.log("submitted")}
onError=${() => console.log("errors")} />`
)
Insert cell
form = (props, children) => createElement(Form, props, children)
Insert cell
schema = ({
title: "Todo",
type: "object",
required: ["title"],
properties: {
title: { type: "string", title: "Title", default: "A new task" },
done: { type: "boolean", title: "Done?", default: false }
}
})
Insert cell
Form = {
const { default: Form } = await import("//cdn.skypack.dev/@rjsf/core?min");
return Form;
}
Insert cell
import { render, jsx, createElement } from "@gnestor/react"
Insert cell

Purpose-built for displays of data

Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Learn more