Skip to main content

getToolbarButtons

Description

Returns the full default configuration of toolbar buttons

Usage

getToolbarButtons(config?: {
undo?: boolean,
splitTasks?: boolean,
}): IButtonConfig[];

Parameters

  • config (optional) — an object with the next parameters:
    • undoPRO feature enables Undo and Redo buttons
    • splitTasksPRO feature enables the Split task button

Returns

The method returns an array of toolbar button configuration objects. Conditional blocks are included only when the corresponding config properties are enabled. If no parameter is defined, only default config is returned.

[
{
id: "add-task",
comp: "button",
icon: "wxi-plus",
text: "New task",
type: "primary",
},
{
id: "edit-task",
comp: "icon",
icon: "wxi-edit",
menuText: "Edit",
text: "Ctrl+E",
},

// appears only if config.splitTasks is true
{
id: "split-task",
comp: "icon",
icon: "wxi-arrow-split",
menuText: "Split",
},
// end

{
id: "delete-task",
comp: "icon",
icon: "wxi-delete",
menuText: "Delete",
text: "Ctrl+D, Backspace",
},
{ comp: "separator" },

{
id: "move-task:up",
comp: "icon",
icon: "wxi-angle-up",
menuText: "Move up",
},
{
id: "move-task:down",
comp: "icon",
icon: "wxi-angle-down",
menuText: "Move down",
},

{ comp: "separator" },

{
id: "copy-task",
comp: "icon",
icon: "wxi-content-copy",
menuText: "Copy",
text: "Ctrl+C",
},
{
id: "cut-task",
comp: "icon",
icon: "wxi-content-cut",
menuText: "Cut",
text: "Ctrl+X",
},
{
id: "paste-task",
comp: "icon",
icon: "wxi-content-paste",
menuText: "Paste",
text: "Ctrl+V",
},

{ comp: "separator" },

{
id: "indent-task:add",
comp: "icon",
icon: "wxi-indent",
menuText: "Indent",
},
{
id: "indent-task:remove",
comp: "icon",
icon: "wxi-unindent",
menuText: "Outdent",
},

// appears only if config.undo is true
{ comp: "separator" },
{
id: "undo",
comp: "icon",
icon: "wxi-undo",
menuText: "Undo",
},
{
id: "redo",
comp: "icon",
icon: "wxi-redo",
menuText: "Redo",
}
// end
]

Example

<script>
import { Gantt, getToolbarButtons } from "@svar-ui/svelte-gantt";
import { getData } from "../data";

const data = getData();

function init(api) {
const toolbar = getToolbarButtons({
splitTasks: true,
undo: true
});

console.log("Toolbar buttons:", toolbar);
}
</script>

<Gantt
tasks={data.tasks}
links={data.links}
scales={data.scales}
{init}
/>

Related article: defaultToolbarButtons