xchain-components/src/stories/XLoaderStory.js

Xchain Components

/* @flow */
/* eslint react/jsx-filename-extension: 0 */

import React from 'react';
import { storiesOf } from '@storybook/react';
import { action } from '@storybook/addon-actions';
import { withInfo } from '@storybook/addon-info';
import XLoader from 'components/XLoader';
import XDimmer from 'components/XDimmer';
import XImage from 'components/XImage';

export default storiesOf('XLoader', module)
  .addDecorator(withInfo)
  .add('loader', () => (
    <div style={{marginTop:'10%'}}>
    <XDimmer active>
      <XLoader active content="wait"  />

    </XDimmer>
    {/* <p>hello</p> */}
    <XImage src="https://react.semantic-ui.com/images/wireframe/image.png" height="50%" width="70%" />
    </div>
  ));