import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
import React, { useState } from 'react';
import markdown from './README.mdx';
import Loading from '.';
import Button from '../Button';
export default {
  title: 'Components/UI Elements/Loading',
  component: Loading,
  parameters: {
    componentSubtitle: 'Component',
    status: 'released',
    mdx: markdown
  }
};
export var Regular = function Regular(args) {
  return /*#__PURE__*/React.createElement(Loading, args, "Text");
};
Regular.args = {
  withOverlay: false
};
export var overlay = function overlay(args) {
  var _useState = useState(false),
      _useState2 = _slicedToArray(_useState, 2),
      loading = _useState2[0],
      setLoading = _useState2[1];

  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Button, {
    onClick: function onClick() {
      return setLoading(true);
    }
  }, "Load with overlay     "), loading && /*#__PURE__*/React.createElement(Loading, {
    withOverlay: true
  }, "Text"));
};
var description = "\nWhen loader is applied with an overlay. Do this by specifying `true` to `withOverlay` prop.\n";
overlay.args = {
  withOverlay: false
};
overlay.story = {
  parameters: {
    docs: {
      storyDescription: description
    }
  }
};
export var small = function small(args) {
  return /*#__PURE__*/React.createElement(Loading, args, "Text");
};
var desc = "\nWhen loader has a `small` variant.\n";
small.args = {
  withOverlay: false,
  small: true
};
small.story = {
  parameters: {
    docs: {
      storyDescription: desc
    }
  }
};