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

To help you get started, we’ve selected a few @storybook/react-native 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 anarock / pebble-native / storybook / storybook.tsx View on Github external
import * as React from "react";
import { AppRegistry } from "react-native";
import {
  getStorybookUI,
  configure,
  addDecorator
} from "@storybook/react-native";
import { withKnobs } from "@storybook/addon-knobs";

addDecorator(withKnobs);

// import stories
configure(() => {
  require("./stories");
}, module);

// This assumes that storybook is running on the same host as your RN packager,
// to set manually use, e.g. host: 'localhost' option
const StorybookUIRoot = getStorybookUI({ port: 7007, onDeviceUI: true });

import "./rn-addons";

// react-native hot module loader must take in a Class - https://github.com/facebook/react-native/issues/10991
// https://github.com/storybooks/storybook/issues/2081
// eslint-disable-next-line react/prefer-stateless-function
class StorybookUIHMRRoot extends React.Component {
  render() {
    return ;
  }
github kiwicom / margarita / apps / storybook / config / index.js View on Github external
/* eslint-disable flowtype/require-valid-file-annotation */
import { getStorybookUI, configure } from '@storybook/react-native';

import { loadStories } from './storyLoader'; //eslint-disable-line

import './rn-addons';

// import stories
configure(loadStories, module);

const StorybookUI = getStorybookUI({
  port: 7007,
  host: 'localhost',
});

export default StorybookUI;
github JesperLekland / react-native-svg-charts / storybook / storybook.js View on Github external
/* eslint-disable global-require */
import React, { Component } from 'react'
import { AppRegistry } from 'react-native'
import { configure, getStorybookUI } from '@storybook/react-native'

// import stories
configure(() => {
    require('./stories')
}, module)

// This assumes that storybook is running on the same host as your RN packager,
// to set manually use, e.g. host: 'localhost' option
const StorybookUIRoot = getStorybookUI({ port: 7008, onDeviceUI: false })

// react-native hot module loader must take in a Class - https://github.com/facebook/react-native/issues/10991
// https://github.com/storybooks/storybook/issues/2081
// eslint-disable-next-line react/prefer-stateless-function
class StorybookUIHMRRoot extends Component {
    render() {
        return 
    }
}
github oblador / loki / examples / react-native / storybook / storybook.js View on Github external
/* eslint-disable import/no-extraneous-dependencies, import/no-unresolved, import/extensions, global-require */

import { AppRegistry } from 'react-native';
import { getStorybookUI, configure } from '@storybook/react-native';
import 'loki/configure-react-native';

// import stories
configure(() => {
  require('./stories');
}, module);

const StorybookUI = getStorybookUI({
  port: 7007,
  host: 'localhost',
  onDeviceUI: false,
});
AppRegistry.registerComponent('Loki', () => StorybookUI);
export default StorybookUI;
github storybookjs / storybook / examples-native / crna-kitchen-sink / storybook / index.js View on Github external
import { getStorybookUI, configure } from '@storybook/react-native';
import './rn-addons';

configure(() => {
  // eslint-disable-next-line global-require
  require('./stories');
}, module);

// const darkTheme = {
//   backgroundColor: 'black',
//   headerTextColor: 'white',
//   labelColor: 'white',
//   borderColor: 'white',
//   previewBorderColor: 'gray',
//   buttonTextColor: 'white',
//   buttonActiveTextColor: 'white',
// };

// const StorybookUIRoot = getStorybookUI({ theme: darkTheme });
github storybookjs / storybook / examples / react-native-typescript / storybook / storybook.js View on Github external
/* eslint-disable global-require */
import React, { Component } from 'react';
import { AppRegistry } from 'react-native';
import { getStorybookUI, configure } from '@storybook/react-native';

// import stories
configure(() => {
  // eslint-disable-next-line
  require('./stories');
}, module);

// This assumes that storybook is running on the same host as your RN packager,
// to set manually use, e.g. host: 'localhost' option
const StorybookUIRoot = getStorybookUI({ port: 7007, onDeviceUI: true });

// react-native hot module loader must take in a Class - https://github.com/facebook/react-native/issues/10991
// https://github.com/storybooks/storybook/issues/2081
// eslint-disable-next-line react/prefer-stateless-function
class StorybookUIHMRRoot extends Component {
  render() {
    return ;
  }
}
github storybookjs / storybook / lib / cli / generators / REACT_NATIVE_SCRIPTS / template / storybook / index.js View on Github external
import React, { Component } from 'react';
import { AppRegistry } from 'react-native';
import { getStorybookUI, configure } from '@storybook/react-native';

// import stories
configure(() => {
  require('./stories');
}, module);

// This assumes that storybook is running on the same host as your RN packager,
// to set manually use, e.g. host: 'localhost' option
const StorybookUIRoot = getStorybookUI({ port: 7007, onDeviceUI: true });

// react-native hot module loader must take in a Class - https://github.com/facebook/react-native/issues/10991
// https://github.com/storybooks/storybook/issues/2081
// eslint-disable-next-line react/prefer-stateless-function
class StorybookUIHMRRoot extends Component {
  render() {
    return ;
  }
}
github wix / wix-react-native-storybook-template / get-storybook.js View on Github external
export function configureStoriesWithDecorators(resolveFunction, moduleName) {
  configure(resolveFunction, moduleName);
}
github keybase / client / shared / stories / index.native.js View on Github external
const load = () => {
  configure(() => {
    noScrollBars.forEach(s => stories[s] && stories[s]())

    addDecorator(scrollViewDecorator)
    Object.keys(stories)
      .filter(s => !noScrollBars.includes(s))
      .forEach(s => stories[s]())
  }, module)
}