Storybook · Example Payload

Storybook Button Story Example

Example Storybook Button component story in Component Story Format (CSF)

Accessibility TestingComponent DocumentationComponent TestingDesign SystemsFront-End DevelopmentOpen-SourceReactUI ComponentsVisual Testing

Storybook Button Story Example is an example object payload from Storybook, with 3 top-level fields. It illustrates the shape of data this provider's APIs accept or return.

Top-level fields

descriptionfilenamecontent

Example Payload

{
  "description": "Example Storybook Button component story in Component Story Format (CSF)",
  "filename": "Button.stories.tsx",
  "content": {
    "defaultExport": {
      "title": "Components/Button",
      "component": "Button",
      "tags": ["autodocs"],
      "args": {
        "onClick": "fn()"
      },
      "argTypes": {
        "backgroundColor": {
          "control": "color"
        },
        "size": {
          "control": {
            "type": "select"
          },
          "options": ["small", "medium", "large"]
        }
      }
    },
    "namedExports": {
      "Primary": {
        "args": {
          "primary": true,
          "label": "Button"
        }
      },
      "Secondary": {
        "args": {
          "label": "Button"
        }
      },
      "Large": {
        "args": {
          "size": "large",
          "label": "Button"
        }
      },
      "Small": {
        "args": {
          "size": "small",
          "label": "Button"
        }
      },
      "WithInteraction": {
        "args": {
          "primary": true,
          "label": "Click me"
        },
        "play": "async ({ canvasElement }) => { const canvas = within(canvasElement); const button = canvas.getByRole('button', { name: /click me/i }); await userEvent.click(button); await expect(button).toHaveFocus(); }"
      }
    }
  }
}

Work with this as data

Every example here is available over the APIs.io API and to AI agents over MCP.

MCP server

One button, every client — Claude, Cursor, VS Code and the rest.

https://apis.io/mcp

Tools for examples

4 MCP tools reach this

find_examplesBrowse and filter every example in the catalog.
apis_io_searchSTART HERE — APIs, providers and tags for one query, each with its total.
resolveTurn a domain, URL or GitHub org into the provider it belongs to.
find_cohortsEvery scored population of providers in the catalog.

All 92 tools

Call it yourself

curl for this page

This example

curl "https://apis.io/api/v1/examples/storybook-button-story-example"

All examples

curl "https://apis.io/api/v1/examples?limit=25"

Discovery needs no key. Ratings and market analysis are Pro.

Get an API key

Free tier, no email required.

GitHub Google LinkedIn

A second provider on the same verified email joins the account you already have.