> ## Documentation Index
> Fetch the complete documentation index at: https://docs.cognite.com/llms.txt
> Use this file to discover all available pages before exploring further.

> ## Agent Instructions
> Cognite Data Fusion (CDF) is an industrial DataOps platform. Prefer English docs unless the user asks for another locale.
> Follow /_llms/ index links recursively until you reach page URLs ending in .md. Fetch those Markdown twins instead of HTML.
> For REST APIs, default to calendar version 20230101 (stable). Use 20230101-beta or 20230101-alpha only if the user is on a preview API. Cite paths under /api-reference/concepts/<version>/ and the Cdf-Version header. Prefer the Python SDK (cognite-sdk) unless the user is in JavaScript/TypeScript.
> Start here by task: platform overview /cdf/index.md; data modeling /cdf/dm/index.md; data integration /cdf/integration/index.md; access /cdf/access/index.md; CDF Toolkit /cdf/deploy/cdf_toolkit/index.md; REST quickstart /dev/quickstart.md; Python SDK /dev/sdks/python/index.md; Atlas AI /cdf/atlas_ai/concepts/index.md; Flows apps /cdf/flows/index.md; Aura UI /cdf/aura/index.md; MCP and IDE setup /dev/guides/ide_ai_integration.md.
> For implementation work, also load /skill.md.

# Action toolbar

> An Action toolbar provides users with quick access to key actions relevant to a specific page, section, or data set. It appears at the bottom center of the page as a floating toolbar when items on the page are selected, most often from a Data grid.

<Badge color="blue">v1.0.0</Badge> | [View in Storybook](https://master--695bb4b1b8041ae09768950a.chromatic.com/?path=/docs/primitives-actiontoolbar--docs)

<Frame>
  <iframe className="aura-storybook-embed w-full rounded-lg border border-zinc-950/10 dark:border-white/10" data-story-id="primitives-actiontoolbar--basic" src="https://master--695bb4b1b8041ae09768950a.chromatic.com/iframe.html?id=primitives-actiontoolbar--basic&viewMode=story&globals=theme:light" title="Action toolbar basic story" loading="lazy" style={{ height: "360px", display: "block", width: "100%" }} />
</Frame>

## When to use

* Data in a list, Table or Card must be selected before applying actions such as "Run parsing," "Add to sequence," or "Remove from plan".

*Example:* Showing Delete, Duplicate, and Export actions after a user selects one or more rows in a [Data grid](/cdf/aura/primitives/data-grid).

* You need to conserve table space; an Action toolbar can be used to house common table actions like Delete, Copy, and Duplicate instead of displaying them in the Table or persistent Page toolbar.

*Example:* Moving row actions out of individual table columns into a floating toolbar that appears on selection.

* Item(s) must be selected before continuing on with the workflow and there are many paths a user can take.

*Example:* Offering several next-step actions—such as "Add to plan," "Assign owner," or "Archive"—after multi-select in a list view.

## When to use something else

* Use a [Toolbar](/cdf/aura/primitives/toolbar) (including page-level toolbars) when item(s) do **not** need to be selected before applying an action.

## Dos and don'ts

* **Do** center align the Action toolbar within the container or page it applies to.
* **Do** keep it contextual and only include actions relevant to the current view or selection.
* **Don't** make the Action toolbar draggable or position it anywhere but the bottom area.
* **Don't** clutter the toolbar with too many actions. Use progressive disclosure with menus if needed.

## Behavior

* The toolbar does not appear until the user has made a selection (for example in a [Data grid](/cdf/aura/primitives/data-grid) or list).
* It transitions in from the bottom of the page or section and stays fixed until the user clears selection, completes the action, or navigates away. It is not draggable.
* If the page does not reload when an action runs, the toolbar transitions downward off screen while the action completes.

## Often used with

[Data grid](/cdf/aura/primitives/data-grid) or list multi-select, [Checkbox](/cdf/aura/primitives/checkbox) row selection, [Button](/cdf/aura/primitives/button) (including icon-only), [Menu](/cdf/aura/primitives/dropdown-menu) for overflow actions, [Tooltip](/cdf/aura/primitives/tooltip) on icon-only actions.

## Visual examples

The examples below are interactive and follow the doc site's theming: light mode when the docs site is in light mode, and dark mode when you switch the docs site to dark mode.

### Selection and actions

Use the Action toolbar when users select one or more items in a list or data grid and need contextual actions such as delete, duplicate, or export. The toolbar appears at the bottom of the view and shows the selection count alongside available actions.

<Frame>
  <iframe className="aura-storybook-embed w-full rounded-lg border border-zinc-950/10 dark:border-white/10" data-story-id="primitives-actiontoolbar--selection-and-actions" src="https://master--695bb4b1b8041ae09768950a.chromatic.com/iframe.html?id=primitives-actiontoolbar--selection-and-actions&viewMode=story&globals=theme:light" title="Action toolbar selection and actions story" loading="lazy" style={{ height: "360px", display: "block", width: "100%" }} />
</Frame>

### With primary action

Include a primary action Button in the Action toolbar when one action is the recommended next step for the current selection—for example, "Add to plan" or "Run parsing." Keep supporting actions as secondary or icon-only buttons to maintain clear hierarchy.

<Frame>
  <iframe className="aura-storybook-embed w-full rounded-lg border border-zinc-950/10 dark:border-white/10" data-story-id="primitives-actiontoolbar--with-primary-action" src="https://master--695bb4b1b8041ae09768950a.chromatic.com/iframe.html?id=primitives-actiontoolbar--with-primary-action&viewMode=story&globals=theme:light" title="Action toolbar with primary action story" loading="lazy" style={{ height: "360px", display: "block", width: "100%" }} />
</Frame>

### Custom label / many actions

Use a custom selection label and overflow actions when the default count label is not descriptive enough or when more actions are needed than fit comfortably in the toolbar. Group less common actions in a menu to avoid cluttering the bar.

<Frame>
  <iframe className="aura-storybook-embed w-full rounded-lg border border-zinc-950/10 dark:border-white/10" data-story-id="primitives-actiontoolbar--edge-cases" src="https://master--695bb4b1b8041ae09768950a.chromatic.com/iframe.html?id=primitives-actiontoolbar--edge-cases&viewMode=story&globals=theme:light" title="Action toolbar custom label / many actions story" loading="lazy" style={{ height: "360px", display: "block", width: "100%" }} />
</Frame>

### Accessibility

Ensure the Action toolbar announces the selection count and action labels to screen readers, and support keyboard navigation between toolbar actions without trapping focus in the underlying content.

<Frame>
  <iframe className="aura-storybook-embed w-full rounded-lg border border-zinc-950/10 dark:border-white/10" data-story-id="primitives-actiontoolbar--accessibility" src="https://master--695bb4b1b8041ae09768950a.chromatic.com/iframe.html?id=primitives-actiontoolbar--accessibility&viewMode=story&globals=theme:light" title="Action toolbar accessibility story" loading="lazy" style={{ height: "360px", display: "block", width: "100%" }} />
</Frame>
