Nitrogen Pumpkin Mulch

    @etchteam/storybook-addon-marker

    2.0.2 • Public • Published

    Storybook Addon Marker

    A Storybook Addon to add a Marker.io feedback button in Storybook.

    React Storybook Screenshot

    Installation

    npm install @etchteam/storybook-addon-marker --save-dev

    Configuration

    Create a file called main.js in your .storybook config folder.

    Add the following content to it:

    module.exports = {
      addons: ['@etchteam/storybook-addon-marker']
    }

    Then create a file called preview.js in the same folder and add your Marker destination as a parameter as well as the withMarker decorator:

    import { addDecorator } from '@storybook/react';
    import withMarker from '@etchteam/storybook-addon-marker/with-marker';
    
    addDecorator(withMarker);
    
    export const parameters = {
      marker: {
        destination: 'abcd1234567890', // <- Your unique destination ID
      }
    }

    To set the type of capture to trigger, the optional mode property can be added to the marker options:

    export const parameters = {
      marker: {
        destination: 'abcd1234567890', // <- Your unique destination ID
        mode: 'fullscreen', // fullscreen | advanced
      }
    }

    It's possible to pass other Marker options to the marker parameter, either globally or per story. For example, custom metadata can be passed per story with the customData property:

    export default {
      title: 'Example/Page',
      component: Page,
      parameters: {
        marker: {
          customData: {
            story: 'Page'
          }
        }
      }
    };

    Where to find your Marker destination and other Marker configuration options can be found on the Marker SDK documentation.

    Made with at Etch

    Install

    npm i @etchteam/storybook-addon-marker

    DownloadsWeekly Downloads

    444

    Version

    2.0.2

    License

    MIT

    Unpacked Size

    23.2 kB

    Total Files

    10

    Last publish

    Collaborators

    • joshthewanderer
    • gavmck
    • dan-webb