# Addons and Enhancing Stories — Storybook: Component-Driven UI Development

Source: https://www.skillbyai.com/en/storybook/sb-addons

> Extend Storybook with addons for docs, actions, interactions and accessibility, and log callbacks while you build.

## Popular addons

Storybook has a rich addon ecosystem, including Docs, Controls, Interactions and A11y (Accessibility). Most are bundled in `@storybook/addon-essentials` (Storybook 8).

## Using the Actions addon

`fn()` from `@storybook/test` records callback calls, shows them in the Actions panel and lets you assert on them.

```tsx
import type { Meta, StoryObj } from '@storybook/react';
import { fn } from '@storybook/test';
import { Button } from './Button';

const meta = { component: Button, title: 'Components/Button' } satisfies Meta<typeof Button>;
export default meta;

// fn() logs calls in the Actions panel and can be asserted in play functions
export const Clickable: StoryObj<typeof meta> = {
  args: { children: 'Click me', onClick: fn() },
};
```

## Docs addon for auto-generated docs

The Docs addon automatically generates component documentation from your stories and JSDoc comments, creating a living style guide.