"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = exports.SpinnerWithoutDefaultDelay = exports.SpinnerWithFallback = exports.SpinnerWithCustom2SecDelay = exports.SpinnerDefault = exports.SpinnerBig = exports.Regression2SpinnersWithSameColorAndSizeAffectsEachOtherInChrome = exports.Documentation = exports.Colors = void 0;
var _react = _interopRequireDefault(require("react"));
var _reactMarkdown = _interopRequireDefault(require("react-markdown"));
var _Display = require("../../common/Display");
var _Spinner = _interopRequireDefault(require("./Spinner.md"));
var _ = require("../..");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var _default = exports.default = {
  title: 'Atoms / Spinner',
  parameters: {
    component: _.Spinner
  }
};
var Documentation = exports.Documentation = function Documentation() {
  return _react.default.createElement(_.Typography, null, _react.default.createElement(_reactMarkdown.default, null, _Spinner.default), _react.default.createElement("div", null, _react.default.createElement(_.Spinner, {
    id: "defaultSpinner"
  })), _react.default.createElement("div", null, _react.default.createElement(_.Spinner, {
    size: 8,
    id: "largerSpinner"
  })));
};
var SpinnerDefault = exports.SpinnerDefault = {
  render: function render() {
    return _react.default.createElement(_.Spinner, {
      id: "mySpinner"
    });
  },
  name: 'Spinner default'
};
var SpinnerBig = exports.SpinnerBig = {
  render: function render() {
    return _react.default.createElement(_.Spinner, {
      size: 16,
      id: "mySpinner"
    });
  },
  name: 'Spinner big'
};
var SpinnerWithFallback = exports.SpinnerWithFallback = {
  render: function render() {
    return _react.default.createElement("div", {
      style: {
        height: '32px'
      }
    }, _react.default.createElement(_.Spinner, {
      size: 8,
      id: "mySpinnerFallback",
      fallback: _react.default.createElement(_.Icon.Account32, null)
    }));
  },
  name: 'Spinner with fallback during the timeout delay instead of null'
};
var SpinnerWithoutDefaultDelay = exports.SpinnerWithoutDefaultDelay = {
  render: function render() {
    return _react.default.createElement(_.Spinner, {
      size: 16,
      id: "mySpinner",
      delay: false
    });
  },
  name: 'Spinner without default delay'
};
var SpinnerWithCustom2SecDelay = exports.SpinnerWithCustom2SecDelay = {
  render: function render() {
    return _react.default.createElement(_.Spinner, {
      size: 16,
      id: "mySpinner",
      delay: 2000
    });
  },
  name: 'Spinner with custom 2 sec delay'
};
var Colors = exports.Colors = function Colors() {
  return _react.default.createElement(_Display.Display, {
    items: [{
      title: 'Default',
      component: _react.default.createElement(_.Spinner, {
        id: "defaultSpinner"
      })
    }, {
      title: 'Color: text',
      component: _react.default.createElement(_.Spinner, {
        color: function color(t) {
          return t.color.text;
        },
        id: "defaultSpinnerText"
      })
    }, {
      title: 'Color: positive',
      component: _react.default.createElement(_.Spinner, {
        color: function color(t) {
          return t.color.positive;
        },
        id: "defaultSpinnerPositive"
      })
    }, {
      title: 'Color: negative',
      component: _react.default.createElement(_.Spinner, {
        color: function color(t) {
          return t.color.negative;
        },
        id: "defaultSpinnerNegative"
      })
    }, {
      title: 'Color: warning',
      component: _react.default.createElement(_.Spinner, {
        color: function color(t) {
          return t.color.warning;
        },
        id: "defaultSpinnerWarning"
      })
    }, {
      title: 'Color: label',
      component: _react.default.createElement(_.Spinner, {
        color: function color(t) {
          return t.color.label;
        },
        id: "defaultSpinnerLabel"
      })
    }]
  });
};
var Regression2SpinnersWithSameColorAndSizeAffectsEachOtherInChrome = exports.Regression2SpinnersWithSameColorAndSizeAffectsEachOtherInChrome = {
  render: function render() {
    return _react.default.createElement(_react.default.Fragment, null, _react.default.createElement(_.Typography, {
      type: "primary"
    }, "Only the one with green border should be shown. The bug before was that if two spinners had the same size and color, both were hidden."), _react.default.createElement("div", {
      style: {
        display: 'none',
        border: '1px red solid'
      }
    }, _react.default.createElement(_.Spinner, {
      size: 8,
      id: "firstSpinner"
    })), _react.default.createElement("div", {
      style: {
        border: '1px green solid'
      }
    }, _react.default.createElement(_.Spinner, {
      size: 8,
      id: "secondSpinner"
    })));
  },
  name: 'Regression: 2 spinners with same color and size affects each other in Chrome'
};