vcc-ui/es/components/loading-bar/stories.js

VCC UI is a collection of React UI Components that can be used for developing front-end applications at Volvo Car Corporation.

import React from 'react';
import { storiesOf } from '@storybook/react';
import { boolean, number } from '@storybook/addon-knobs/react';
import { LoadingBar } from './';
import { Block } from '../block';

var Container = function Container(_ref) {
  var children = _ref.children;
  return React.createElement(Block, {
    extend: {
      padding: 20
    }
  }, React.createElement(Block, {
    extend: {
      padding: 40
    }
  }, children));
};

storiesOf('Feedback Indicators/LoadingBar', module).addWithJSX('Default', function () {
  return React.createElement(Container, null, React.createElement(LoadingBar, {
    isLoading: boolean('isLoading', true),
    transitionDuration: number('Animation duration', 1500)
  }));
}).addWithJSX('Fixed to top', function () {
  return React.createElement(Block, {
    extend: {
      position: 'fixed',
      top: 0,
      left: 0,
      width: '100%'
    }
  }, React.createElement(LoadingBar, {
    isLoading: boolean('isLoading', true)
  }));
});