superset/superset-frontend/packages/superset-ui-demo
dependabot[bot] 91781ca045
build(deps): bump @storybook/types from 7.6.13 to 7.6.17 in /superset-frontend (#27347)
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
2024-03-11 12:31:55 -06:00
..
.storybook feat(storybook): Co-habitating/Upgrading Storybooks to v7 (dependency madness ensues) (#26907) 2024-02-15 07:40:17 -07:00
storybook chore: Removes Chromatic workflow and dependencies (#27232) 2024-02-23 13:31:58 -05:00
.babelrc.json feat(storybook): Co-habitating/Upgrading Storybooks to v7 (dependency madness ensues) (#26907) 2024-02-15 07:40:17 -07:00
CHANGELOG.md chore: Reformat changelogs (#26815) 2024-01-26 21:48:17 +01:00
README.md refactor(monorepo): move superset-ui to superset(stage 2) (#17552) 2021-11-30 08:29:57 +08:00
package.json build(deps): bump @storybook/types from 7.6.13 to 7.6.17 in /superset-frontend (#27347) 2024-03-11 12:31:55 -06:00
tsconfig.json refactor(storybok): upgrade to webpack5 in storybook of plugins (#17909) 2022-01-05 10:39:33 +08:00

README.md

@superset-ui/demo

Version David (path)

Storybook of @superset-ui packages. See it live at apache-superset.github.io/superset-ui

Development

Run storybook

To view the storybook locally, you should first run npm ci && npm run bootstrap in the @superset-ui monorepo root directory, which will install all dependencies for this package and sym-link any @superset-ui packages to your local system.

After that run npm run storybook which will open up a dev server at http://localhost:9001.

Adding new stories

Existing package

If stories already exist for the package you are adding, simply extend the examples already exported for that package in the storybook/stories/<package>/index.js file.

New package

If you are creating stories for a package that doesn't yet have any stories, follow these steps:

  1. Add any new package dependencies (including any @superset-ui/* packages) via npm install <package>.

  2. Create a new folder that mirrors the package name

    e.g., mkdir storybook/stories/superset-ui-color/

  3. Add an index.js file to that folder with a default export with the following shape:

you can use the | separator within the storyPath string to denote nested stories e.g., storyPath: '@superset-ui/package|Nested i|Nested ii'

 default export {
   examples: [
     {
       storyPath: <string>,
       storyName: <string>,
       renderStory: <func> () => node,
     },
     ...
   ]
 };