Components
Toolbar
A workbench rail: the start tools at the leading edge, the end tools at the trailing, the rail itself carrying the toolbar role so assistive tech reads it as one group of commands. The vessel holds; the tools inside stay the caller's own buttons and menus.
#Basic usage
<script setup lang="ts">
import { Button, Toolbar } from "@bysages/vue";
</script>
<template>
<Toolbar label="Document tools" class="w-full">
<template #start>
<Button size="sm" variant="outline">Save</Button>
<Button size="sm" variant="ghost">Preview</Button>
</template>
<template #end>
<Button size="sm" variant="solid">Publish</Button>
</template>
</Toolbar>
</template>
#Props
#Toolbar
A workbench rail: the start tools at the leading edge, the end tools at the trailing, the rail itself carrying the toolbar role so assistive tech reads it as one group of commands. The vessel holds; the tools inside stay the caller's own buttons and menus.
| Prop | Type | Default | Description |
|---|---|---|---|
label | String | undefined | Accessible name when more than one toolbar shares a page. |