How to use the @storybook/react.configure function in @storybook/react

To help you get started, we’ve selected a few @storybook/react examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github storybook-eol / storybook-addon-jest / example / .storybook / config.js View on Github external
import { setOptions } from '@storybook/addon-options';
// --> import { setupJestAddon } from 'storybook-addon-jest';


setOptions({
  name: 'JEST ADDON',
  url: 'https://github.com/renaudtertrais/storybook-addon-jest',
  downPanelInRight: true,
  showLeftPanel: true,
});

function loadStories() {
  require('../List.story');
}

configure(loadStories, module);
github storybookjs / storybook / examples / dev-kits / config.js View on Github external
import { configure } from '@storybook/react';

// The simplest version of examples would export this function for users to use
function importAll(context) {
  context.keys().forEach(filename => context(filename));
}

function loadStories() {
  importAll(require.context('./stories', true, /\.js$/));
}

configure(loadStories, module);
github zooniverse / front-end-monorepo / packages / lib-classifier / .storybook / config.js View on Github external
addParameters({
  backgrounds: backgrounds.lightDefault,
  viewport: {
    viewports: INITIAL_VIEWPORTS
  }
})
addDecorator(withA11y)

// automatically import all files ending in *.stories.js
const req = require.context('../src', true, /\.stories\.js$/);
function loadStories() {
  req.keys().forEach(filename => req(filename));
}

configure(loadStories, module);
github CityOfZion / neon-wallet / .storybook / config.js View on Github external
import { configure } from '@storybook/react'
import { storiesOf, addDecorator } from '@storybook/react'
import { withKnobs } from '@storybook/addon-knobs'

addDecorator(withKnobs)

function loadStories() {
  require('../stories/index.js')
}

configure(loadStories, module)
github storybookjs / storybook / examples / official-storybook / config.js View on Github external
});
}

function loadStories() {
  let req;
  req = require.context('../../lib/ui/src', true, /\.stories\.js$/);
  importAll(req);

  req = require.context('../../lib/components/src', true, /\.stories\.tsx?$/);
  importAll(req);

  req = require.context('./stories', true, /\.stories\.js$/);
  importAll(req);
}

configure(loadStories, module);
github fdaciuk / workflow-reactjs / storybook / config.js View on Github external
import { configure } from '@storybook/react'

const req = require.context('../src/components', true, /\.story\.js$/)

function loadStories () {
  req.keys().forEach((filename) => req(filename))
}

configure(loadStories, module)
github appbaseio / playground / .storybook / config.js View on Github external
theme: create({
      base: 'light',
      brandTitle: 'ReactiveSearch',
      brandUrl: 'https://github.com/appbaseio/playground',
    }),
  },
});

addDecorator(withKnobs);
addDecorator(addReadme);

function loadStories() {
	require("../stories");
}

configure(loadStories, module);
github tajo / react-range / .storybook / config.js View on Github external
initializeRTL();

addDecorator(
  withOptions({
    name: 'react-range',
    url: 'https://github.com/tajo/react-range',
    showAddonPanel: false,
    showSearchBox: false
  })
);

function loadStories() {
  require('./example.stories.js');
}

configure(loadStories, module);
github plotly / react-pivottable / .storybook / config.js View on Github external
import { configure } from '@storybook/react';
import { setOptions } from '@storybook/addon-options';

setOptions({
  name: "React-PivotTable",
  url: "https://github.com/plotly/react-pivottable",
});

function loadStories() {
  require('../stories');
}

configure(loadStories, module);