import { Canvas, Controls, Meta, Title } from '@storybook/addon-docs/blocks';
import * as AgenticButtonStories from './AgenticButton.stories';
<Meta of={AgenticButtonStories} name='Usage' />
<Title />
## Purpose
A button for an action the agent does. It is the secondary Button look with the AI gradient as its border, and a gradient working spinner.
## Usage
- It is a separate component, not a variant or a prop of the Button. It takes every Button prop except `variant`: `label`, `size`, `displayType`, `iconName`, `isLoading`, `isWorking`, `disableWhenWorking`, `isFullWidth`, `tally`, `statusDot`, `tooltipText`, `disabled` and the rest.
- The look is always the secondary treatment: the surface fill with the gradient border. There is no primary (dark) version.
- `isAnimated` shimmers the border. It stops for reduced motion.
- Use it for the call to action of an agent's suggestion, or the trigger of a menu of agent actions. Use the regular Button for everything else.
## Implementation
See the table below for the available props.
<hr />
<Canvas of={AgenticButtonStories.Default} />
<Controls of={AgenticButtonStories.Default} />
Agentic Button
A separate component, `AgenticButton`, for an action the agent does:
Net-new componentOpen in Storybook