backpack-ui/dist/components/loading/index.js

Lonely Planet's Components

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});

var _extends2 = require("babel-runtime/helpers/extends");

var _extends3 = _interopRequireDefault(_extends2);

var _react = require("react");

var _react2 = _interopRequireDefault(_react);

var _radium = require("radium");

var _radium2 = _interopRequireDefault(_radium);

var _icon = require("../icon");

var _colors = require("../../styles/colors");

var _colors2 = _interopRequireDefault(_colors);

var _typography = require("../../styles/typography");

var _color = require("../../utils/color");

var _propTypes = require("../../utils/propTypes");

var _propTypes2 = _interopRequireDefault(_propTypes);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

var spinKeyframes = _radium2.default.keyframes({
  "0%": {
    transform: "rotate(0)"
  },
  "100%": {
    transform: "rotate(360deg)"
  }
}, "spin");

var styles = {
  animation: "spin 500ms linear infinite",
  animationName: spinKeyframes,
  color: (0, _color.rgba)(_colors2.default.textPrimary, 0.5),
  fontSize: _typography.fontSizeHeading4 + "px"
};

var Loading = function Loading(props) {
  return _react2.default.createElement(_icon.Loading, (0, _extends3.default)({}, props, {
    style: (0, _extends3.default)({}, styles, props.style)
  }));
};

Loading.propTypes = {
  style: _propTypes2.default.style
};

Loading.defaultProps = {
  style: null
};

exports.default = Loading;