Namespace, Primitive, Method

    This package has been deprecated

    Author message:

    Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.

    @croquiscom/storybook-addon-backgrounds

    0.1.0 • Public • Published

    Storybook Addon Backgrounds

    Build Status on CircleCI CodeFactor Known Vulnerabilities BCH compliance codecov Storybook Slack Backers on Open Collective Sponsors on Open Collective


    Storybook Background Addon can be used to change background colors inside the preview in Storybook.

    Framework Support

    React Storybook Screenshot

    Installation

    npm i -D @storybook/addon-backgrounds

    Configuration

    Then create a file called addons.js in your storybook config.

    Add following content to it:

    import '@storybook/addon-backgrounds/register';

    Usage

    Then write your stories like this:

    import React from 'react';
    import { storiesOf } from "@storybook/react";
    import backgrounds from "@storybook/addon-backgrounds";
    
    storiesOf("Button", module)
      .addDecorator(backgrounds([
        { name: "twitter", value: "#00aced", default: true },
        { name: "facebook", value: "#3b5998" },
      ]))
      .add("with text", () => <button>Click me</button>);

    Of course it's easy to create a library module so you can re-use:

    import addonBackgrounds from "@storybook/addon-backgrounds";
    
    export const backgrounds = addonBackgrounds([
      { name: "twitter", value: "#00aced", default: true },
      { name: "facebook", value: "#3b5998" },
    ]);
    import React from 'react';
    import { storiesOf } from "@storybook/react";
    
    import { backgrounds } from "./my-lib";
    
    storiesOf("Button", module)
      .addDecorator(backgrounds)
      .add("with text", () => <button>Click me</button>);

    In the case of Mithril, use these imports:

    import { storiesOf } from '@storybook/mithril';
    import backgrounds from "@storybook/addon-backgrounds/mithril";

    Install

    npm i @croquiscom/storybook-addon-backgrounds

    DownloadsWeekly Downloads

    3

    Version

    0.1.0

    License

    MIT

    Unpacked Size

    36.9 kB

    Total Files

    18

    Last publish

    Collaborators

    • chiabi
    • colin.kwon
    • croquiscom-admin
    • hazel.moon
    • ho12345c
    • nabigraphics
    • olive-sally
    • pepper.ha
    • sixmen
    • yoo2001818
    • youngsoohan
    • zao1214