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: {
      background: "#f5f5f5",
      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", 300)
  }));
}).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)
  }));
});