Back to integrations
Add your integration
Categories
  • ⭐️ Popular
  • 🧩 Essentials
  • 🛠 Code
  • ⚡️ Data & state
  • ✅ Test
  • 💅 Style
  • 🎨 Design
  • ⚙️ Appearance
  • 🗄 Organize
How to install addons Create an addon
Whats New
Storybook addon intended to let users see what is new with your repository
npm install storybook-addon-whats-new
Last updated over 2 years ago
3.5k
Downloads per week
Readme View on GitHub

storybook-addon-whats-new

What is it?

This is a Storybook addon intended to let users see what's new with your repository. The recommendation is to link to your CHANGELOG.md for automated updates, or you can custom manage a Markdown file with more tailored updates.

Security policy

Setup a Security Policy

How do I install it?

Install the dependency:

yarn add -D storybook-addon-whats-new

Storybook 5.3 and newer

Then add it to your .storybook/main.js

module.exports = {
  // other configs here
  addons: ['storybook-addon-whats-new']
}

Storybook <=5.2

Edit or create a file called addons.js in the Storybook config directory (by default, it’s .storybook). Add following content to it:

import 'storybook-addon-whats-new';

Getting Started

Local Configuration

To configure this addon, you must provide a whatsNewSource parameter with the location of your Markdown file to display:

import React from "react";
import { Button } from "./Button";
import WhatsNew from './WHATS_NEW.md';

export default {
  title: "Example/Button",
  component: Button,
  parameters: {
    whatsNewSource: WhatsNew,
  },
};

Global Configuration

If your want to show the What's New panel on every story you can configure it globally in .storybook/preview.js (.storybook/config.js for Storybook <= 5.2). To configure this addon, you must provide a whatsNewSource parameter with the location of your Markdown file to display:

import { addParameters } from '@storybook/react'; // <- or your storybook framework
import WhatsNew from './WHATS_NEW.md';

addParameters({
  whatsNewSource: WhatsNew,
});
Join the community
6,595 developers and counting
WhyWhy StorybookComponent-driven UI
DocsGuidesTutorialsChangelogTelemetryStatus
CommunityAddonsGet involvedBlog
ShowcaseExploreProjectsComponent glossary
Open source software
Storybook

Maintained by
Chromatic
Special thanks to Netlify and CircleCI