React Bricks


This is the main React Bricks component, which wraps all the other ones.

It is used to configure React Bricks (app credentials, block schema, etc.) and provide the configuration via context to all the other components.

See also See ReactBricksContext

Usage example from the Vanilla React starter

<ReactBricks {...config}>
    <Login path="/login" />

    <Editor path="/editor" />
    <Playground path="/playground" />
    <AppSettings path="/app-settings" />

    <Viewer path="/" />
    <ViewerFetch path="/viewer-fetch" />


The configuration object is extensively documented here.


The ReactBricks component provides the configuration to the children components, using the ReactBricksContext, which has the following TypeScript interface:

interface IReactBricksContext {
    appId: string
    apiKey: string
    blockTypeSchema: IBlockType[]
    pageTypeSchema: IPageType[]
    logo: string
    contentClassName: string
    renderLocalLink: RenderLocalLink
    navigate: (path: string) => void
    loginPath: string
    editorPath: string
    playgroundPath: string
    appSettingsPath: string