mirror of https://github.com/apache/superset.git synced 2026-05-08 17:35:33 +00:00

Files

Superset Dev 752ebd47cb docs: cut 6.1.0 versions for docs, admin_docs, developer_docs, components

- Snapshot all four versioned docs sections at v6.1.0; master continues to
  serve as "Next" (lastVersion: current, banner: unreleased) so editing
  master keeps updating the canonical URLs
- Enable the previously-disabled components plugin and version it
- Rename stale "developer_portal" references to "developer_docs" across
  package.json scripts, manage-versions.mjs, theme files (DocVersionBadge,
  DocVersionBanner), DOCS_CLAUDE.md, and README.md (URL backward-compat
  redirect /developer_portal/* preserved)
- Add admin_docs version scripts; drop dead "tutorials" plugin id from
  the version badge
- Generalize fixVersionedImports in manage-versions.mjs to walk every
  section's snapshot and rewrite ../../src/ and ../../data/ imports,
  catching admin_docs and components files that previous version cuts
  would have broken
- Remove orphan files: developer_portal_versions.json,
  tutorials_versions.json, and stray empty versions.json files inside
  components/ and developer_docs/ content directories

2026-05-02 11:53:56 -07:00

3.0 KiB

Raw Blame History

title, sidebar_position

title	sidebar_position
Storybook	5

Storybook

Superset uses Storybook for developing and testing UI components in isolation. Storybook provides a sandbox to build components independently, outside of the main application.

Public Storybook

A public Storybook with components from the master branch is available at:

apache-superset.github.io/superset-ui

Running Locally

Main Superset Storybook

To run the main Superset Storybook locally:

cd superset-frontend

# Start Storybook (opens at http://localhost:6006)
npm run storybook

# Build static Storybook
npm run build-storybook

@superset-ui Package Storybook

The @superset-ui packages have a separate Storybook for component library development:

cd superset-frontend

# Install dependencies and bootstrap packages
npm ci && npm run bootstrap

# Start the @superset-ui Storybook (opens at http://localhost:9001)
cd packages/superset-ui-demo
npm run storybook

Adding Stories

To an Existing Package

If stories already exist for the package, extend the examples array in the package's story file:

storybook/stories/<package>/index.js

To a New Package

Add package dependencies:
```
npm install <package>
```

Create a story folder matching the package name:

mkdir storybook/stories/superset-ui-<package>/

Create an index.js file with the story configuration:

export default {
  examples: [
    {
      storyPath: '@superset-ui/package',
      storyName: 'My Story',
      renderStory: () => <MyComponent />,
    },
  ],
};

Use the | separator for nested stories:

storyPath: '@superset-ui/package|Category|Subcategory'

Best Practices

Isolate components: Stories should render components in isolation, without application context
Show variations: Create stories for different states, sizes, and configurations
Document props: Use Storybook's controls to expose configurable props
Test edge cases: Include stories for loading states, error states, and empty states

3.0 KiB Raw Blame History