# SelectionBar

Group: Editing

The verbs for whatever is selected in edit mode, floating just above it.
- Provide `label` ("Idea: Encoding") and `actions`: `{ id, label, icon, group, onSelect, danger? }`. Groups always sort **text → structure → navigate → delete**, separated by hairlines, so every construct's bar reads the same way.
- Today: **Idea** — Rename · Summary | Connect · Group | Step inside | Delete. **Connector** — Edit label | Delete. **Group** — Rename | Edit ideas | Ungroup. A future construct only declares its verbs.
- 44px targets with an icon over a short label; under 640px labels become screen-reader-only. A `toolbar` with an accessible name; Delete in `danger`.


## Props

```ts
export interface SelectionBarProps { label: string; actions: EditAction[]; style?: CSSProperties }
```

## Use

```ts
import { SelectionBar } from '@visualli/design-system/components';
```