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

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 {

import { withKnobs } from '@storybook/addon-knobs';

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

// Refer to https://github.com/storybookjs/storybook/tree/master/app/react-native#start-command-parameters
// To find allowed options for getStorybookUI
const StorybookUIRoot = getStorybookUI({ port: 7007, host: 'localhost' });

// If you are using React Native vanilla and after installation you don't see your app name here, write it manually.
// If you use Expo you can safely remove this line.
AppRegistry.registerComponent('%APP_NAME%', () => StorybookUIRoot);

addDecorator(withKnobs);

export default StorybookUIRoot;

addDecorator
} from "@storybook/react-native";
import { AppearanceProvider } from "react-native-appearance";
import ThemeProvider from "../src/containers/Theme.tsx";
import { loadStories } from "./storyLoader";
import "./rn-addons";

export const provider = story => (
  
    
      {story()}
    
  
);

addDecorator(provider);

configure(() => {
  loadStories();
}, module);

// Refer to https://github.com/storybooks/storybook/tree/master/app/react-native#start-command-parameters
// To find allowed options for getStorybookUI
const StorybookUIRoot = getStorybookUI({});

export default StorybookUIRoot;

import { name as appName } from '../app.json';
import { Container } from '../src/components/Container';

// addons!
import './rn-addons';

// adding a centered-view layout!
const CenterView = ({ children }) => (
  
    {children}
  
);

// global decorators!
addDecorator(getStory => {getStory()});
addDecorator(withBackgrounds);
addParameters({
  backgrounds: [
    { name: 'light', value: '#fff', default: true },
    { name: 'gray', value: '#808080' },
    { name: 'dark', value: '#000' },
  ],
});

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

// Refer to https://github.com/storybookjs/storybook/tree/master/app/react-native#start-command-parameters
// To find allowed options for getStorybookUI
const StorybookUIRoot = getStorybookUI({});

/* eslint-disable global-require */
import React, { Component } from 'react';
import { AppRegistry } from 'react-native';
import { getStorybookUI, configure, addDecorator } from '@storybook/react-native';
import { withKnobs } from '@storybook/addon-knobs';

import Container from './stories/Container';

addDecorator(story => );
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 });

// 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 ;

import React from "react";
import { ActionSheetProvider } from "@expo/react-native-action-sheet";
import {
  getStorybookUI,
  configure,
  addDecorator
} from "@storybook/react-native";
import { loadStories } from "./storyLoader";

export const provider = story => (
  {story()}
);

addDecorator(provider);

configure(() => {
  loadStories();
}, module);

const StorybookUI = getStorybookUI({ port: 7007, host: "localhost" });
export default StorybookUI;

import React from 'react';
import { Text } from 'react-native';

import { storiesOf, addDecorator, addParameters } from '@storybook/react-native';
import { action } from '@storybook/addon-actions';
import { linkTo } from '@storybook/addon-links';
import { withKnobs } from '@storybook/addon-knobs';
import { withBackgrounds } from '@storybook/addon-ondevice-backgrounds';
import knobsWrapper from './Knobs';
import Button from './Button';
import CenterView from './CenterView';
import Welcome from './Welcome';

addDecorator(withBackgrounds);

addParameters({
  backgrounds: [
    { name: 'dark', value: '#222222' },
    { name: 'white', value: '#ffffff', default: true },
  ],
});

storiesOf('Welcome', module).add('to Storybook', () => , {
  notes: `
# Markdown!\n
* List Item
* [List Item with Link](https://storybook.js.org)
`,
});

configure(() => {
  addDecorator(withKnobs);

  let lastRender = null;
  const CommonStoryDecorator = ({story}) => {
    const [shouldRender, setShouldRender] = React.useState(false);

    React.useEffect(() => {
      const timeout = setTimeout(() => {
        setShouldRender(true);
      });

      return () => {
        clearTimeout(timeout);
        delete DataStore["instance"];
      };
    }, []);

import { AppRegistry, NativeModules, Platform } from "react-native";
import {
  getStorybookUI,
  configure,
  addDecorator
} from "@storybook/react-native";
import { withKnobs } from "@storybook/addon-knobs";
import {
  BarSpacingDecorator,
  WhiteBgColorDecorator
} from "@times-components/storybook";
import { loadStories } from "./story-loader";
import "./rn-addons";

if (Platform.OS === "ios") {
  addDecorator(BarSpacingDecorator);
}

if (Platform.OS === "android") {
  addDecorator(WhiteBgColorDecorator);
}

addDecorator(withKnobs);

configure(loadStories, module);

const { hostname } = url.parse(NativeModules.SourceCode.scriptURL);

const StorybookUIRoot = getStorybookUI({
  port: 7007,
  host: hostname
});

import { configure, getStorybookUI, addDecorator } from '@storybook/react-native'
import { loadStories } from './storyLoader'

import './rn-addons'
import { withKnobs } from '@storybook/addon-knobs'

addDecorator(withKnobs)

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

configure(() => {
  loadStories()
}, module)

export default StorybookUI