@storybook/manager-api

What is @storybook/manager-api?

The @storybook/manager-api package is part of the Storybook ecosystem, which is a tool for developing UI components in isolation for React, Vue, Angular, and more. This particular package provides APIs for managing Storybook's UI and its addons, allowing developers to customize and extend the Storybook manager interface programmatically.

What are @storybook/manager-api's main functionalities?

Addons registration

This feature allows developers to register custom addons with Storybook. The code sample demonstrates how to register an addon named 'my-addon' using the manager API.

import { addons } from '@storybook/manager-api';

addons.register('my-addon', (api) => {
  // Do something with the Storybook API
});

Add panel

This feature enables the addition of custom panels to the Storybook UI. The code sample shows how to add a new panel to the Storybook interface within a registered addon.

import { addons } from '@storybook/manager-api';

addons.register('my-addon', (api) => {
  addons.addPanel('my-addon/panel', {
    title: 'My Panel',
    render: ({ active, key }) => (
      // Render your panel content here
    ),
  });
});

Other packages similar to @storybook/manager-api

@storybook/addons

This package is also part of the Storybook ecosystem and provides the foundation for creating and using addons in Storybook. It is similar to @storybook/manager-api in that it allows for the extension and customization of Storybook, but it focuses more on the addon infrastructure itself rather than the manager UI.

@storybook/api

Another package within the Storybook ecosystem, @storybook/api is designed to interact with Storybook's internal API for tasks such as fetching stories, managing globals, and interacting with Storybook's state. It complements @storybook/manager-api by providing a more data-focused approach to interacting with Storybook, as opposed to UI customization.