Example: Add a custom element to the toolbar of the default layout

This example demonstrates how we can add a custom element to the toolbar created by the Default Layout plugin.

const renderToolbar = (Toolbar: ((props: ToolbarProps) => ReactElement)) => (
    <>
        <Toolbar />
        <div
            style={{
                borderTop: '1px solid rgba(0, 0, 0, 0.1)',
                marginTop: '4px',
                padding: '4px',
            }}
        >
            Custom element
        </div>
    </>
);

const defaultLayoutPluginInstance = defaultLayoutPlugin({
    renderToolbar,
});

(The sample code)

Related examples