# XWUIToolbar

A standalone toolbar of icon/label action buttons - e.g. a rich-text formatting bar (bold, italic, list) or any cluster of related commands. Each `items` entry is `{ id, icon?, label?, active?, disabled? }`, rendered with XWUIButton. Lay it out `horizontal` or `vertical` via `orientation`, and apply a shared `variant` (`default` / `outlined` / `ghost`) and `size` across buttons. Subscribe with `onItemClick(handler)` and replace the set at runtime with `setItems()`.

## Usage

```ts
import { XWUIToolbar } from './XWUIToolbar';

const toolbar = new XWUIToolbar(
  container,
  {
    items: [
      { id: 'bold', icon: 'bold', active: true },
      { id: 'italic', icon: 'italic' },
      { id: 'list', icon: 'list' },
    ],
  },
  { variant: 'ghost', size: 'sm', orientation: 'horizontal' }
);

toolbar.onItemClick((id) => applyFormat(id));
```

## Basic Toolbar

A ghost-style formatting toolbar with Bold active alongside Italic and Underline buttons.

```example
file: examples/BasicUsage.ts
html: examples/BasicUsage.html
title: Basic Toolbar
description: A ghost-style formatting toolbar with Bold active alongside Italic and Underline buttons.
```

## Vertical Actions

A vertical, outlined toolbar of editor actions (Cut, Copy, Paste, Delete) with Delete disabled.

```example
file: examples/VerticalActions.ts
html: examples/VerticalActions.html
title: Vertical Actions
description: A vertical, outlined toolbar of editor actions (Cut, Copy, Paste, Delete) with Delete disabled.
```

## Size Variants

The same three-button toolbar rendered at sm, md, and lg sizes for comparison.

```example
file: examples/SizeVariants.ts
html: examples/SizeVariants.html
title: Size Variants
description: The same three-button toolbar rendered at sm, md, and lg sizes for comparison.
```

```api
```