A Svelte UI component for building flexible button panels, from simple button sets to complex structures with numerous buttons and select boxes. It provides an easy way to organize and display multiple toolbar items, with support for multiline layouts and collapsible item groups that can be shown on demand.
To use the widget, simply import the package and include the component in your Svelte file:
<script>
import { Toolbar } from "wx-svelte-toolbar";
function onClick(item) {
message = "Button '" + item.id + "' clicked";
}
let items = [
{ id: "label", text: "Toolbar with icon buttons" },
{
id: "search",
comp: "button",
icon: "wxi-search",
handler: onClick,
},
];
</script>
<Toolbar {items} />
Typically, you don't need to modify the code. However, if you wish to do so, follow these steps:
yarn
to install dependencies. Note that this project is a monorepo using yarn
workspaces, so npm will not workyarn start
To run the test:
yarn start:tests
yarn test:cypress