Skip to main content

bottomBar

Description​

Optional. Controls the configuration of the bottom toolbar in the editor

Usage​

bottomBar?: boolean | { items: IToolbarItem[] };

Parameters​

The bottomBar can take the next values:

  • true - enables the bottom toolbar
  • false - hides the bottom toolbar
  • an object with the items array, where each element is a ToolbarItem and supports the same parameters as items in the Toolbar component

Examples​

Adding bottom bar to editor​

import { Editor } from "@svar-ui/react-editor";

const bottomBar = {
  items: [
    { comp: "spacer" },
    { comp: "button", label: "Click me", onClick: () => alert("clicked") },
  ],
};

function App() {
  return <Editor bottomBar={bottomBar} />;
}

The bottom bar will display a spacer followed by a button that triggers an alert when clicked.