Toolbar

Row of filters/controls above a table or grid.

Import

import { Toolbar } from "@jcsoftdev/ui/containers";

Single-component entry points tree-shake to just this component: @jcsoftdev/ui/containers/toolbar.

Usage

<Toolbar>
  <>
          <Button size="sm" variant="secondary">
            Todos los barberos
          </Button>
          <Button size="sm" variant="ghost">
            Hoy
          </Button>
          <ToolbarRight>
            <Chip tone="neutral">12 citas</Chip>
            <Button size="sm">Nueva cita</Button>
          </ToolbarRight>
        </>
</Toolbar>

Props

This component declares no props of its own.

It also accepts the native props of the element or primitive it renders (for example className, id, aria-* and event handlers).

Storybook stories

• Default
• Filters Only
• Narrow

Source

packages/ui/src/containers/toolbar/toolbar.tsx