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​

<script>
    import { Editor } from "@svar-ui/svelte-editor";

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

<Editor {bottomBar} />

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