UNPKG

react-spinkit

Version:

A collection of loading indicators animated with CSS for React

1,148 lines (982 loc) 674 kB
/******/ (function(modules) { // webpackBootstrap /******/ // The module cache /******/ var installedModules = {}; /******/ // The require function /******/ function __webpack_require__(moduleId) { /******/ // Check if module is in cache /******/ if(installedModules[moduleId]) /******/ return installedModules[moduleId].exports; /******/ // Create a new module (and put it into the cache) /******/ var module = installedModules[moduleId] = { /******/ exports: {}, /******/ id: moduleId, /******/ loaded: false /******/ }; /******/ // Execute the module function /******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); /******/ // Flag the module as loaded /******/ module.loaded = true; /******/ // Return the exports of the module /******/ return module.exports; /******/ } /******/ // expose the modules object (__webpack_modules__) /******/ __webpack_require__.m = modules; /******/ // expose the module cache /******/ __webpack_require__.c = installedModules; /******/ // __webpack_public_path__ /******/ __webpack_require__.p = ""; /******/ // Load entry module and return exports /******/ return __webpack_require__(0); /******/ }) /************************************************************************/ /******/ ([ /* 0 */ /***/ function(module, exports, __webpack_require__) { module.exports = __webpack_require__(1); /***/ }, /* 1 */ /***/ function(module, exports, __webpack_require__) { var React = __webpack_require__(3); var Spinner = React.createFactory(__webpack_require__(2)); React.render( React.DOM.div({style:{margin:'0 auto', width: '400px'}}, [ React.DOM.h1(null, "React-Spinkit"), React.DOM.a({href:"https://github.com/KyleAMathews/react-spinkit"}, "Browse code on Github"), React.DOM.br(), React.DOM.br(), React.DOM.br(), React.DOM.code(null, "<Spinner spinnerName='three-bounce'/>"), React.DOM.br(), React.DOM.br(), Spinner({spinnerName: 'three-bounce', overrideSpinnerClassName: "sk-spinner"}), React.DOM.br(), React.DOM.code(null, "<Spinner spinnerName='double-bounce'/>"), React.DOM.br(), React.DOM.br(), Spinner({spinnerName: 'double-bounce'}), React.DOM.br(), React.DOM.code(null, "<Spinner spinnerName='rotating-plane'/>"), React.DOM.br(), React.DOM.br(), Spinner({spinnerName: 'rotating-plane'}), React.DOM.br(), React.DOM.code(null, "<Spinner spinnerName='wave'/>"), React.DOM.br(), React.DOM.br(), Spinner({spinnerName: 'wave'}), React.DOM.br(), React.DOM.code(null, "<Spinner spinnerName='wandering-cubes'/>"), React.DOM.br(), React.DOM.br(), Spinner({spinnerName: 'wandering-cubes'}), React.DOM.br(), React.DOM.code(null, "<Spinner spinnerName='pulse'/>"), React.DOM.br(), React.DOM.br(), Spinner({spinnerName: 'pulse'}), React.DOM.br(), React.DOM.code(null, "<Spinner spinnerName='chasing-dots'/>"), React.DOM.br(), React.DOM.br(), Spinner({spinnerName: 'chasing-dots'}), React.DOM.br(), React.DOM.code(null, "<Spinner spinnerName='circle'/>"), React.DOM.br(), React.DOM.br(), Spinner({spinnerName: 'circle'}), React.DOM.br(), React.DOM.code(null, "<Spinner spinnerName='cube-grid'/>"), React.DOM.br(), React.DOM.br(), Spinner({spinnerName: 'cube-grid'}), React.DOM.br(), React.DOM.code(null, "<Spinner spinnerName='wordpress'/>"), React.DOM.br(), React.DOM.br(), Spinner({spinnerName: 'wordpress'}), React.DOM.br(), React.DOM.br(), React.DOM.br(), React.DOM.br(), ]), document.body); /***/ }, /* 2 */ /***/ function(module, exports, __webpack_require__) { var React, cx, objectAssign; React = __webpack_require__(3); cx = __webpack_require__(6); objectAssign = __webpack_require__(4); module.exports = React.createClass({ displayName: "SpinKit", propTypes: { spinnerName: React.PropTypes.string.isRequired, noFadeIn: React.PropTypes.bool, overrideSpinnerClassName: React.PropTypes.string }, getDefaultProps: function() { return { spinnerName: 'three-bounce', noFadeIn: false, overrideSpinnerClassName: "" }; }, render: function() { var classTests, classes; classTests = { "fade-in": !this.props.noFadeIn, spinner: this.props.overrideSpinnerClassName === "" }; classTests[this.props.overrideSpinnerClassName] = this.props.overrideSpinnerClassName; classes = cx(classTests); if (this.props.className) { classes = classes + " " + this.props.className; } if (!this.props.noFadeIn) { __webpack_require__(7); } switch (this.props.spinnerName) { case "three-bounce": __webpack_require__(9); return React.createElement("div", React.__spread({}, this.props, { "className": "three-bounce " + classes }), React.createElement("div", { "className": "bounce1" }), React.createElement("div", { "className": "bounce2" }), React.createElement("div", { "className": "bounce3" })); case "double-bounce": __webpack_require__(11); return React.createElement("div", React.__spread({}, this.props, { "className": "double-bounce " + classes }), React.createElement("div", { "className": "double-bounce1" }), React.createElement("div", { "className": "double-bounce2" })); case "rotating-plane": __webpack_require__(13); return React.createElement("div", React.__spread({}, this.props, { "className": classes }), React.createElement("div", { "className": "rotating-plane" })); case "wave": __webpack_require__(15); return React.createElement("div", React.__spread({}, this.props, { "className": "wave " + classes }), React.createElement("div", { "className": "rect1" }), React.createElement("div", { "className": "rect2" }), React.createElement("div", { "className": "rect3" }), React.createElement("div", { "className": "rect4" }), React.createElement("div", { "className": "rect5" })); case "wandering-cubes": __webpack_require__(17); return React.createElement("div", React.__spread({}, this.props, { "className": "wandering-cubes " + classes }), React.createElement("div", { "className": "cube1" }), React.createElement("div", { "className": "cube2" })); case "pulse": __webpack_require__(19); return React.createElement("div", React.__spread({}, this.props, { "className": classes }), React.createElement("div", { "className": "pulse" })); case "chasing-dots": __webpack_require__(21); return React.createElement("div", React.__spread({}, this.props, { "className": classes }), React.createElement("div", { "className": "chasing-dots" }, React.createElement("div", { "className": "dot1" }), React.createElement("div", { "className": "dot2" }))); case "circle": __webpack_require__(23); return React.createElement("div", React.__spread({}, this.props, { "className": "circle-wrapper " + classes }), React.createElement("div", { "className": "circle1 circle" }), React.createElement("div", { "className": "circle2 circle" }), React.createElement("div", { "className": "circle3 circle" }), React.createElement("div", { "className": "circle4 circle" }), React.createElement("div", { "className": "circle5 circle" }), React.createElement("div", { "className": "circle6 circle" }), React.createElement("div", { "className": "circle7 circle" }), React.createElement("div", { "className": "circle8 circle" }), React.createElement("div", { "className": "circle9 circle" }), React.createElement("div", { "className": "circle10 circle" }), React.createElement("div", { "className": "circle11 circle" }), React.createElement("div", { "className": "circle12 circle" })); case "cube-grid": __webpack_require__(25); return React.createElement("div", React.__spread({}, this.props, { "className": "cube-grid " + classes }), React.createElement("div", { "className": "cube" }), React.createElement("div", { "className": "cube" }), React.createElement("div", { "className": "cube" }), React.createElement("div", { "className": "cube" }), React.createElement("div", { "className": "cube" }), React.createElement("div", { "className": "cube" }), React.createElement("div", { "className": "cube" }), React.createElement("div", { "className": "cube" }), React.createElement("div", { "className": "cube" })); case "wordpress": __webpack_require__(27); return React.createElement("div", React.__spread({}, this.props, { "className": classes }), React.createElement("div", { "className": "wordpress" }, React.createElement("span", { "className": "inner-circle" }))); } } }); /***/ }, /* 3 */ /***/ function(module, exports, __webpack_require__) { module.exports = __webpack_require__(5); /***/ }, /* 4 */ /***/ function(module, exports, __webpack_require__) { /** * Copyright 2014-2015, Facebook, Inc. * All rights reserved. * * This source code is licensed under the BSD-style license found in the * LICENSE file in the root directory of this source tree. An additional grant * of patent rights can be found in the PATENTS file in the same directory. * * @providesModule Object.assign */ // https://people.mozilla.org/~jorendorff/es6-draft.html#sec-object.assign 'use strict'; function assign(target, sources) { if (target == null) { throw new TypeError('Object.assign target cannot be null or undefined'); } var to = Object(target); var hasOwnProperty = Object.prototype.hasOwnProperty; for (var nextIndex = 1; nextIndex < arguments.length; nextIndex++) { var nextSource = arguments[nextIndex]; if (nextSource == null) { continue; } var from = Object(nextSource); // We don't currently support accessors nor proxies. Therefore this // copy cannot throw. If we ever supported this then we must handle // exceptions and side-effects. We don't support symbols so they won't // be transferred. for (var key in from) { if (hasOwnProperty.call(from, key)) { to[key] = from[key]; } } } return to; } module.exports = assign; /***/ }, /* 5 */ /***/ function(module, exports, __webpack_require__) { /* WEBPACK VAR INJECTION */(function(process) {/** * Copyright 2013-2015, Facebook, Inc. * All rights reserved. * * This source code is licensed under the BSD-style license found in the * LICENSE file in the root directory of this source tree. An additional grant * of patent rights can be found in the PATENTS file in the same directory. * * @providesModule React */ /* globals __REACT_DEVTOOLS_GLOBAL_HOOK__*/ 'use strict'; var EventPluginUtils = __webpack_require__(30); var ReactChildren = __webpack_require__(31); var ReactComponent = __webpack_require__(32); var ReactClass = __webpack_require__(33); var ReactContext = __webpack_require__(34); var ReactCurrentOwner = __webpack_require__(35); var ReactElement = __webpack_require__(36); var ReactElementValidator = __webpack_require__(37); var ReactDOM = __webpack_require__(38); var ReactDOMTextComponent = __webpack_require__(39); var ReactDefaultInjection = __webpack_require__(40); var ReactInstanceHandles = __webpack_require__(41); var ReactMount = __webpack_require__(42); var ReactPerf = __webpack_require__(43); var ReactPropTypes = __webpack_require__(44); var ReactReconciler = __webpack_require__(45); var ReactServerRendering = __webpack_require__(46); var assign = __webpack_require__(4); var findDOMNode = __webpack_require__(47); var onlyChild = __webpack_require__(48); ReactDefaultInjection.inject(); var createElement = ReactElement.createElement; var createFactory = ReactElement.createFactory; var cloneElement = ReactElement.cloneElement; if ("production" !== process.env.NODE_ENV) { createElement = ReactElementValidator.createElement; createFactory = ReactElementValidator.createFactory; cloneElement = ReactElementValidator.cloneElement; } var render = ReactPerf.measure('React', 'render', ReactMount.render); var React = { Children: { map: ReactChildren.map, forEach: ReactChildren.forEach, count: ReactChildren.count, only: onlyChild }, Component: ReactComponent, DOM: ReactDOM, PropTypes: ReactPropTypes, initializeTouchEvents: function(shouldUseTouch) { EventPluginUtils.useTouchEvents = shouldUseTouch; }, createClass: ReactClass.createClass, createElement: createElement, cloneElement: cloneElement, createFactory: createFactory, createMixin: function(mixin) { // Currently a noop. Will be used to validate and trace mixins. return mixin; }, constructAndRenderComponent: ReactMount.constructAndRenderComponent, constructAndRenderComponentByID: ReactMount.constructAndRenderComponentByID, findDOMNode: findDOMNode, render: render, renderToString: ReactServerRendering.renderToString, renderToStaticMarkup: ReactServerRendering.renderToStaticMarkup, unmountComponentAtNode: ReactMount.unmountComponentAtNode, isValidElement: ReactElement.isValidElement, withContext: ReactContext.withContext, // Hook for JSX spread, don't use this for anything else. __spread: assign }; // Inject the runtime into a devtools global hook regardless of browser. // Allows for debugging when the hook is injected on the page. if ( typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ !== 'undefined' && typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.inject === 'function') { __REACT_DEVTOOLS_GLOBAL_HOOK__.inject({ CurrentOwner: ReactCurrentOwner, InstanceHandles: ReactInstanceHandles, Mount: ReactMount, Reconciler: ReactReconciler, TextComponent: ReactDOMTextComponent }); } if ("production" !== process.env.NODE_ENV) { var ExecutionEnvironment = __webpack_require__(49); if (ExecutionEnvironment.canUseDOM && window.top === window.self) { // If we're in Chrome, look for the devtools marker and provide a download // link if not installed. if (navigator.userAgent.indexOf('Chrome') > -1) { if (typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ === 'undefined') { console.debug( 'Download the React DevTools for a better development experience: ' + 'http://fb.me/react-devtools' ); } } var expectedFeatures = [ // shims Array.isArray, Array.prototype.every, Array.prototype.forEach, Array.prototype.indexOf, Array.prototype.map, Date.now, Function.prototype.bind, Object.keys, String.prototype.split, String.prototype.trim, // shams Object.create, Object.freeze ]; for (var i = 0; i < expectedFeatures.length; i++) { if (!expectedFeatures[i]) { console.error( 'One or more ES5 shim/shams expected by React are not available: ' + 'http://fb.me/react-warning-polyfills' ); break; } } } } React.version = '0.13.1'; module.exports = React; /* WEBPACK VAR INJECTION */}.call(exports, __webpack_require__(50))) /***/ }, /* 6 */ /***/ function(module, exports, __webpack_require__) { function classNames() { var classes = ''; var arg; for (var i = 0; i < arguments.length; i++) { arg = arguments[i]; if (!arg) { continue; } if ('string' === typeof arg || 'number' === typeof arg) { classes += ' ' + arg; } else if (Object.prototype.toString.call(arg) === '[object Array]') { classes += ' ' + classNames.apply(null, arg); } else if ('object' === typeof arg) { for (var key in arg) { if (!arg.hasOwnProperty(key) || !arg[key]) { continue; } classes += ' ' + key; } } } return classes.substr(1); } // safely export classNames in case the script is included directly on a page if (typeof module !== 'undefined' && module.exports) { module.exports = classNames; } /***/ }, /* 7 */ /***/ function(module, exports, __webpack_require__) { // style-loader: Adds some css to the DOM by adding a <style> tag // load the styles var content = __webpack_require__(8); if(typeof content === 'string') content = [[module.id, content, '']]; // add the styles to the DOM var update = __webpack_require__(29)(content, {}); // Hot Module Replacement if(false) { // When the styles change, update the <style> tags module.hot.accept("!!/Users/kylemathews/programs/react-spinkit/node_modules/css-loader/index.js!/Users/kylemathews/programs/react-spinkit/css/fade-in.css", function() { var newContent = require("!!/Users/kylemathews/programs/react-spinkit/node_modules/css-loader/index.js!/Users/kylemathews/programs/react-spinkit/css/fade-in.css"); if(typeof newContent === 'string') newContent = [[module.id, newContent, '']]; update(newContent); }); // When the module is disposed, remove the <style> tags module.hot.dispose(function() { update(); }); } /***/ }, /* 8 */ /***/ function(module, exports, __webpack_require__) { exports = module.exports = __webpack_require__(51)(); exports.push([module.id, "@-webkit-keyframes fade-in {\n 0% {\n opacity: 0;\n }\n 50% {\n opacity: 0;\n }\n 100% {\n opacity: 1;\n }\n}\n\n@-moz-keyframes fade-in {\n 0% {\n opacity: 0;\n }\n 50% {\n opacity: 0;\n }\n 100% {\n opacity: 1;\n }\n}\n\n@-ms-keyframes fade-in {\n 0% {\n opacity: 0;\n }\n 50% {\n opacity: 0;\n }\n 100% {\n opacity: 1;\n }\n}\n\n@keyframes fade-in {\n 0% {\n opacity: 0;\n }\n 50% {\n opacity: 0;\n }\n 100% {\n opacity: 1;\n }\n}\n\n.fade-in {\n -webkit-animation: fade-in 2s;\n -moz-animation: fade-in 2s;\n -o-animation: fade-in 2s;\n -ms-animation: fade-in 2s;\n}\n", ""]); /***/ }, /* 9 */ /***/ function(module, exports, __webpack_require__) { // style-loader: Adds some css to the DOM by adding a <style> tag // load the styles var content = __webpack_require__(10); if(typeof content === 'string') content = [[module.id, content, '']]; // add the styles to the DOM var update = __webpack_require__(29)(content, {}); // Hot Module Replacement if(false) { // When the styles change, update the <style> tags module.hot.accept("!!/Users/kylemathews/programs/react-spinkit/node_modules/css-loader/index.js!/Users/kylemathews/programs/react-spinkit/css/three-bounce.css", function() { var newContent = require("!!/Users/kylemathews/programs/react-spinkit/node_modules/css-loader/index.js!/Users/kylemathews/programs/react-spinkit/css/three-bounce.css"); if(typeof newContent === 'string') newContent = [[module.id, newContent, '']]; update(newContent); }); // When the module is disposed, remove the <style> tags module.hot.dispose(function() { update(); }); } /***/ }, /* 10 */ /***/ function(module, exports, __webpack_require__) { exports = module.exports = __webpack_require__(51)(); exports.push([module.id, ".three-bounce > div {\n width: 18px;\n height: 18px;\n background-color: #333;\n\n border-radius: 100%;\n display: inline-block;\n -webkit-animation: bouncedelay 1.4s infinite ease-in-out;\n animation: bouncedelay 1.4s infinite ease-in-out;\n /* Prevent first frame from flickering when animation starts */\n -webkit-animation-fill-mode: both;\n animation-fill-mode: both;\n}\n\n.three-bounce .bounce1 {\n -webkit-animation-delay: -0.32s;\n animation-delay: -0.32s;\n}\n\n.three-bounce .bounce2 {\n -webkit-animation-delay: -0.16s;\n animation-delay: -0.16s;\n}\n\n@-webkit-keyframes bouncedelay {\n 0%, 80%, 100% { -webkit-transform: scale(0.0) }\n 40% { -webkit-transform: scale(1.0) }\n}\n\n@keyframes bouncedelay {\n 0%, 80%, 100% {\n transform: scale(0.0);\n -webkit-transform: scale(0.0);\n } 40% {\n transform: scale(1.0);\n -webkit-transform: scale(1.0);\n }\n}\n", ""]); /***/ }, /* 11 */ /***/ function(module, exports, __webpack_require__) { // style-loader: Adds some css to the DOM by adding a <style> tag // load the styles var content = __webpack_require__(12); if(typeof content === 'string') content = [[module.id, content, '']]; // add the styles to the DOM var update = __webpack_require__(29)(content, {}); // Hot Module Replacement if(false) { // When the styles change, update the <style> tags module.hot.accept("!!/Users/kylemathews/programs/react-spinkit/node_modules/css-loader/index.js!/Users/kylemathews/programs/react-spinkit/css/double-bounce.css", function() { var newContent = require("!!/Users/kylemathews/programs/react-spinkit/node_modules/css-loader/index.js!/Users/kylemathews/programs/react-spinkit/css/double-bounce.css"); if(typeof newContent === 'string') newContent = [[module.id, newContent, '']]; update(newContent); }); // When the module is disposed, remove the <style> tags module.hot.dispose(function() { update(); }); } /***/ }, /* 12 */ /***/ function(module, exports, __webpack_require__) { exports = module.exports = __webpack_require__(51)(); exports.push([module.id, ".double-bounce {\n width: 27px;\n height: 27px;\n\n position: relative;\n}\n\n.double-bounce1, .double-bounce2 {\n width: 100%;\n height: 100%;\n border-radius: 50%;\n background-color: #333;\n opacity: 0.6;\n position: absolute;\n top: 0;\n left: 0;\n\n -webkit-animation: bounce 2.0s infinite ease-in-out;\n animation: bounce 2.0s infinite ease-in-out;\n}\n\n.double-bounce2 {\n -webkit-animation-delay: -1.0s;\n animation-delay: -1.0s;\n}\n\n@-webkit-keyframes bounce {\n 0%, 100% { -webkit-transform: scale(0.0) }\n 50% { -webkit-transform: scale(1.0) }\n}\n\n@keyframes bounce {\n 0%, 100% {\n transform: scale(0.0);\n -webkit-transform: scale(0.0);\n } 50% {\n transform: scale(1.0);\n -webkit-transform: scale(1.0);\n }\n}\n\n", ""]); /***/ }, /* 13 */ /***/ function(module, exports, __webpack_require__) { // style-loader: Adds some css to the DOM by adding a <style> tag // load the styles var content = __webpack_require__(14); if(typeof content === 'string') content = [[module.id, content, '']]; // add the styles to the DOM var update = __webpack_require__(29)(content, {}); // Hot Module Replacement if(false) { // When the styles change, update the <style> tags module.hot.accept("!!/Users/kylemathews/programs/react-spinkit/node_modules/css-loader/index.js!/Users/kylemathews/programs/react-spinkit/css/rotating-plane.css", function() { var newContent = require("!!/Users/kylemathews/programs/react-spinkit/node_modules/css-loader/index.js!/Users/kylemathews/programs/react-spinkit/css/rotating-plane.css"); if(typeof newContent === 'string') newContent = [[module.id, newContent, '']]; update(newContent); }); // When the module is disposed, remove the <style> tags module.hot.dispose(function() { update(); }); } /***/ }, /* 14 */ /***/ function(module, exports, __webpack_require__) { exports = module.exports = __webpack_require__(51)(); exports.push([module.id, ".rotating-plane {\n width: 27px;\n height: 27px;\n background-color: #333;\n\n -webkit-animation: rotateplane 1.2s infinite ease-in-out;\n animation: rotateplane 1.2s infinite ease-in-out;\n}\n\n@-webkit-keyframes rotateplane {\n 0% { -webkit-transform: perspective(120px) }\n 50% { -webkit-transform: perspective(120px) rotateY(180deg) }\n 100% { -webkit-transform: perspective(120px) rotateY(180deg) rotateX(180deg) }\n}\n\n@keyframes rotateplane {\n 0% {\n transform: perspective(120px) rotateX(0deg) rotateY(0deg);\n -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg);\n } 50% {\n transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);\n -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);\n } 100% {\n transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);\n -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);\n }\n}\n\n", ""]); /***/ }, /* 15 */ /***/ function(module, exports, __webpack_require__) { // style-loader: Adds some css to the DOM by adding a <style> tag // load the styles var content = __webpack_require__(16); if(typeof content === 'string') content = [[module.id, content, '']]; // add the styles to the DOM var update = __webpack_require__(29)(content, {}); // Hot Module Replacement if(false) { // When the styles change, update the <style> tags module.hot.accept("!!/Users/kylemathews/programs/react-spinkit/node_modules/css-loader/index.js!/Users/kylemathews/programs/react-spinkit/css/wave.css", function() { var newContent = require("!!/Users/kylemathews/programs/react-spinkit/node_modules/css-loader/index.js!/Users/kylemathews/programs/react-spinkit/css/wave.css"); if(typeof newContent === 'string') newContent = [[module.id, newContent, '']]; update(newContent); }); // When the module is disposed, remove the <style> tags module.hot.dispose(function() { update(); }); } /***/ }, /* 16 */ /***/ function(module, exports, __webpack_require__) { exports = module.exports = __webpack_require__(51)(); exports.push([module.id, ".wave {\n width: 50px;\n height: 27px;\n}\n\n.wave > div {\n background-color: #333;\n height: 100%;\n width: 6px;\n display: inline-block;\n\n -webkit-animation: stretchdelay 1.2s infinite ease-in-out;\n animation: stretchdelay 1.2s infinite ease-in-out;\n}\n\n.wave .rect2 {\n -webkit-animation-delay: -1.1s;\n animation-delay: -1.1s;\n}\n\n.wave .rect3 {\n -webkit-animation-delay: -1.0s;\n animation-delay: -1.0s;\n}\n\n.wave .rect4 {\n -webkit-animation-delay: -0.9s;\n animation-delay: -0.9s;\n}\n\n.wave .rect5 {\n -webkit-animation-delay: -0.8s;\n animation-delay: -0.8s;\n}\n\n@-webkit-keyframes stretchdelay {\n 0%, 40%, 100% { -webkit-transform: scaleY(0.4) }\n 20% { -webkit-transform: scaleY(1.0) }\n}\n\n@keyframes stretchdelay {\n 0%, 40%, 100% {\n transform: scaleY(0.4);\n -webkit-transform: scaleY(0.4);\n } 20% {\n transform: scaleY(1.0);\n -webkit-transform: scaleY(1.0);\n }\n}\n\n", ""]); /***/ }, /* 17 */ /***/ function(module, exports, __webpack_require__) { // style-loader: Adds some css to the DOM by adding a <style> tag // load the styles var content = __webpack_require__(18); if(typeof content === 'string') content = [[module.id, content, '']]; // add the styles to the DOM var update = __webpack_require__(29)(content, {}); // Hot Module Replacement if(false) { // When the styles change, update the <style> tags module.hot.accept("!!/Users/kylemathews/programs/react-spinkit/node_modules/css-loader/index.js!/Users/kylemathews/programs/react-spinkit/css/wandering-cubes.css", function() { var newContent = require("!!/Users/kylemathews/programs/react-spinkit/node_modules/css-loader/index.js!/Users/kylemathews/programs/react-spinkit/css/wandering-cubes.css"); if(typeof newContent === 'string') newContent = [[module.id, newContent, '']]; update(newContent); }); // When the module is disposed, remove the <style> tags module.hot.dispose(function() { update(); }); } /***/ }, /* 18 */ /***/ function(module, exports, __webpack_require__) { exports = module.exports = __webpack_require__(51)(); exports.push([module.id, ".wandering-cubes {\n width: 27px;\n height: 27px;\n position: relative;\n}\n\n.cube1, .cube2 {\n background-color: #333;\n width: 10px;\n height: 10px;\n position: absolute;\n top: 0;\n left: 0;\n\n -webkit-animation: cubemove 1.8s infinite ease-in-out;\n animation: cubemove 1.8s infinite ease-in-out;\n}\n\n.cube2 {\n -webkit-animation-delay: -0.9s;\n animation-delay: -0.9s;\n}\n\n@-webkit-keyframes cubemove {\n 25% { -webkit-transform: translateX(22px) rotate(-90deg) scale(0.5) }\n 50% { -webkit-transform: translateX(22px) translateY(22px) rotate(-180deg) }\n 75% { -webkit-transform: translateX(0px) translateY(22px) rotate(-270deg) scale(0.5) }\n 100% { -webkit-transform: rotate(-360deg) }\n}\n\n@keyframes cubemove {\n 25% { \n transform: translateX(42px) rotate(-90deg) scale(0.5);\n -webkit-transform: translateX(42px) rotate(-90deg) scale(0.5);\n } 50% {\n /* Hack to make FF rotate in the right direction */\n transform: translateX(42px) translateY(42px) rotate(-179deg);\n -webkit-transform: translateX(42px) translateY(42px) rotate(-179deg);\n } 50.1% {\n transform: translateX(42px) translateY(42px) rotate(-180deg);\n -webkit-transform: translateX(42px) translateY(42px) rotate(-180deg);\n } 75% {\n transform: translateX(0px) translateY(42px) rotate(-270deg) scale(0.5);\n -webkit-transform: translateX(0px) translateY(42px) rotate(-270deg) scale(0.5);\n } 100% {\n transform: rotate(-360deg);\n -webkit-transform: rotate(-360deg);\n }\n}\n\n", ""]); /***/ }, /* 19 */ /***/ function(module, exports, __webpack_require__) { // style-loader: Adds some css to the DOM by adding a <style> tag // load the styles var content = __webpack_require__(20); if(typeof content === 'string') content = [[module.id, content, '']]; // add the styles to the DOM var update = __webpack_require__(29)(content, {}); // Hot Module Replacement if(false) { // When the styles change, update the <style> tags module.hot.accept("!!/Users/kylemathews/programs/react-spinkit/node_modules/css-loader/index.js!/Users/kylemathews/programs/react-spinkit/css/pulse.css", function() { var newContent = require("!!/Users/kylemathews/programs/react-spinkit/node_modules/css-loader/index.js!/Users/kylemathews/programs/react-spinkit/css/pulse.css"); if(typeof newContent === 'string') newContent = [[module.id, newContent, '']]; update(newContent); }); // When the module is disposed, remove the <style> tags module.hot.dispose(function() { update(); }); } /***/ }, /* 20 */ /***/ function(module, exports, __webpack_require__) { exports = module.exports = __webpack_require__(51)(); exports.push([module.id, ".pulse {\n width: 27px;\n height: 27px;\n background-color: #333;\n\n border-radius: 100%;\n -webkit-animation: scaleout 1.0s infinite ease-in-out;\n animation: scaleout 1.0s infinite ease-in-out;\n}\n\n@-webkit-keyframes scaleout {\n 0% { -webkit-transform: scale(0.0) }\n 100% {\n -webkit-transform: scale(1.0);\n opacity: 0;\n }\n}\n\n@keyframes scaleout {\n 0% {\n transform: scale(0.0);\n -webkit-transform: scale(0.0);\n } 100% {\n transform: scale(1.0);\n -webkit-transform: scale(1.0);\n opacity: 0;\n }\n}\n\n", ""]); /***/ }, /* 21 */ /***/ function(module, exports, __webpack_require__) { // style-loader: Adds some css to the DOM by adding a <style> tag // load the styles var content = __webpack_require__(22); if(typeof content === 'string') content = [[module.id, content, '']]; // add the styles to the DOM var update = __webpack_require__(29)(content, {}); // Hot Module Replacement if(false) { // When the styles change, update the <style> tags module.hot.accept("!!/Users/kylemathews/programs/react-spinkit/node_modules/css-loader/index.js!/Users/kylemathews/programs/react-spinkit/css/chasing-dots.css", function() { var newContent = require("!!/Users/kylemathews/programs/react-spinkit/node_modules/css-loader/index.js!/Users/kylemathews/programs/react-spinkit/css/chasing-dots.css"); if(typeof newContent === 'string') newContent = [[module.id, newContent, '']]; update(newContent); }); // When the module is disposed, remove the <style> tags module.hot.dispose(function() { update(); }); } /***/ }, /* 22 */ /***/ function(module, exports, __webpack_require__) { exports = module.exports = __webpack_require__(51)(); exports.push([module.id, ".chasing-dots {\n width: 27px;\n height: 27px;\n position: relative;\n\n -webkit-animation: rotate 2.0s infinite linear;\n animation: rotate 2.0s infinite linear;\n}\n\n.dot1, .dot2 {\n width: 60%;\n height: 60%;\n display: inline-block;\n position: absolute;\n top: 0;\n background-color: #333;\n border-radius: 100%;\n\n -webkit-animation: bounce 2.0s infinite ease-in-out;\n animation: bounce 2.0s infinite ease-in-out;\n}\n\n.dot2 {\n top: auto;\n bottom: 0px;\n -webkit-animation-delay: -1.0s;\n animation-delay: -1.0s;\n}\n\n@-webkit-keyframes rotate { 100% { -webkit-transform: rotate(360deg) }}\n@keyframes rotate {\n 100% {\n transform: rotate(360deg);\n -webkit-transform: rotate(360deg);\n }\n}\n\n@-webkit-keyframes bounce {\n 0%, 100% { -webkit-transform: scale(0.0) }\n 50% { -webkit-transform: scale(1.0) }\n}\n\n@keyframes bounce {\n 0%, 100% {\n transform: scale(0.0);\n -webkit-transform: scale(0.0);\n } 50% {\n transform: scale(1.0);\n -webkit-transform: scale(1.0);\n }\n}\n\n", ""]); /***/ }, /* 23 */ /***/ function(module, exports, __webpack_require__) { // style-loader: Adds some css to the DOM by adding a <style> tag // load the styles var content = __webpack_require__(24); if(typeof content === 'string') content = [[module.id, content, '']]; // add the styles to the DOM var update = __webpack_require__(29)(content, {}); // Hot Module Replacement if(false) { // When the styles change, update the <style> tags module.hot.accept("!!/Users/kylemathews/programs/react-spinkit/node_modules/css-loader/index.js!/Users/kylemathews/programs/react-spinkit/css/circle.css", function() { var newContent = require("!!/Users/kylemathews/programs/react-spinkit/node_modules/css-loader/index.js!/Users/kylemathews/programs/react-spinkit/css/circle.css"); if(typeof newContent === 'string') newContent = [[module.id, newContent, '']]; update(newContent); }); // When the module is disposed, remove the <style> tags module.hot.dispose(function() { update(); }); } /***/ }, /* 24 */ /***/ function(module, exports, __webpack_require__) { exports = module.exports = __webpack_require__(51)(); exports.push([module.id, ".circle-wrapper {\n width: 22px;\n height: 22px;\n position: relative;\n}\n\n.circle {\n width: 100%;\n height: 100%;\n position: absolute;\n left: 0;\n top: 0;\n}\n\n.circle:before {\n content: '';\n display: block;\n margin: 0 auto;\n width: 20%;\n height: 20%;\n background-color: #333;\n\n border-radius: 100%;\n -webkit-animation: bouncedelay 1.2s infinite ease-in-out;\n animation: bouncedelay 1.2s infinite ease-in-out;\n /* Prevent first frame from flickering when animation starts */\n -webkit-animation-fill-mode: both;\n animation-fill-mode: both;\n}\n\n.circle2 { -webkit-transform: rotate(30deg); transform: rotate(30deg) }\n.circle3 { -webkit-transform: rotate(60deg); transform: rotate(60deg) }\n.circle4 { -webkit-transform: rotate(90deg); transform: rotate(90deg) }\n.circle5 { -webkit-transform: rotate(120deg); transform: rotate(120deg) }\n.circle6 { -webkit-transform: rotate(150deg); transform: rotate(150deg) }\n.circle7 { -webkit-transform: rotate(180deg); transform: rotate(180deg) }\n.circle8 { -webkit-transform: rotate(210deg); transform: rotate(210deg) }\n.circle9 { -webkit-transform: rotate(240deg); transform: rotate(240deg) }\n.circle10 { -webkit-transform: rotate(270deg); transform: rotate(270deg) }\n.circle11 { -webkit-transform: rotate(300deg); transform: rotate(300deg) }\n.circle12 { -webkit-transform: rotate(330deg); transform: rotate(330deg) }\n\n.circle2:before { -webkit-animation-delay: -1.1s; animation-delay: -1.1s }\n.circle3:before { -webkit-animation-delay: -1.0s; animation-delay: -1.0s }\n.circle4:before { -webkit-animation-delay: -0.9s; animation-delay: -0.9s }\n.circle5:before { -webkit-animation-delay: -0.8s; animation-delay: -0.8s }\n.circle6:before { -webkit-animation-delay: -0.7s; animation-delay: -0.7s }\n.circle7:before { -webkit-animation-delay: -0.6s; animation-delay: -0.6s }\n.circle8:before { -webkit-animation-delay: -0.5s; animation-delay: -0.5s }\n.circle9:before { -webkit-animation-delay: -0.4s; animation-delay: -0.4s }\n.circle10:before { -webkit-animation-delay: -0.3s; animation-delay: -0.3s }\n.circle11:before { -webkit-animation-delay: -0.2s; animation-delay: -0.2s }\n.circle12:before { -webkit-animation-delay: -0.1s; animation-delay: -0.1s }\n\n@-webkit-keyframes bouncedelay {\n 0%, 80%, 100% { -webkit-transform: scale(0.0) }\n 40% { -webkit-transform: scale(1.0) }\n}\n\n@keyframes bouncedelay {\n 0%, 80%, 100% {\n -webkit-transform: scale(0.0);\n transform: scale(0.0);\n } 40% {\n -webkit-transform: scale(1.0);\n transform: scale(1.0);\n }\n}\n\n", ""]); /***/ }, /* 25 */ /***/ function(module, exports, __webpack_require__) { // style-loader: Adds some css to the DOM by adding a <style> tag // load the styles var content = __webpack_require__(26); if(typeof content === 'string') content = [[module.id, content, '']]; // add the styles to the DOM var update = __webpack_require__(29)(content, {}); // Hot Module Replacement if(false) { // When the styles change, update the <style> tags module.hot.accept("!!/Users/kylemathews/programs/react-spinkit/node_modules/css-loader/index.js!/Users/kylemathews/programs/react-spinkit/css/cube-grid.css", function() { var newContent = require("!!/Users/kylemathews/programs/react-spinkit/node_modules/css-loader/index.js!/Users/kylemathews/programs/react-spinkit/css/cube-grid.css"); if(typeof newContent === 'string') newContent = [[module.id, newContent, '']]; update(newContent); }); // When the module is disposed, remove the <style> tags module.hot.dispose(function() { update(); }); } /***/ }, /* 26 */ /***/ function(module, exports, __webpack_require__) { exports = module.exports = __webpack_require__(51)(); exports.push([module.id, ".cube-grid {\n width:27px;\n height:27px;\n}\n\n.cube {\n width:33%;\n height:33%;\n background:#333;\n float:left;\n -webkit-animation: scaleDelay 1.3s infinite ease-in-out;\n animation: scaleDelay 1.3s infinite ease-in-out;\n}\n\n/*\n * Spinner positions\n * 1 2 3\n * 4 5 6\n * 7 8 9\n */\n\n.spinner .cube:nth-child(1) { -webkit-animation-delay: 0.2s; animation-delay: 0.2s }\n.spinner .cube:nth-child(2) { -webkit-animation-delay: 0.3s; animation-delay: 0.3s }\n.spinner .cube:nth-child(3) { -webkit-animation-delay: 0.4s; animation-delay: 0.4s }\n.spinner .cube:nth-child(4) { -webkit-animation-delay: 0.1s; animation-delay: 0.1s }\n.spinner .cube:nth-child(5) { -webkit-animation-delay: 0.2s; animation-delay: 0.2s }\n.spinner .cube:nth-child(6) { -webkit-animation-delay: 0.3s; animation-delay: 0.3s }\n.spinner .cube:nth-child(7) { -webkit-animation-delay: 0.0s; animation-delay: 0.0s }\n.spinner .cube:nth-child(8) { -webkit-animation-delay: 0.1s; animation-delay: 0.1s }\n.spinner .cube:nth-child(9) { -webkit-animation-delay: 0.2s; animation-delay: 0.2s }\n\n@-webkit-keyframes scaleDelay {\n 0%, 70%, 100% { -webkit-transform:scale3D(1.0, 1.0, 1.0) }\n 35% { -webkit-transform:scale3D(0.0, 0.0, 1.0) }\n}\n\n@keyframes scaleDelay {\n 0%, 70%, 100% { -webkit-transform:scale3D(1.0, 1.0, 1.0); transform:scale3D(1.0, 1.0, 1.0) }\n 35% { -webkit-transform:scale3D(1.0, 1.0, 1.0); transform:scale3D(0.0, 0.0, 1.0) }\n}\n\n", ""]); /***/ }, /* 27 */ /***/ function(module, exports, __webpack_require__) { // style-loader: Adds some css to the DOM by adding a <style> tag // load the styles var content = __webpack_require__(28); if(typeof content === 'string') content = [[module.id, content, '']]; // add the styles to the DOM var update = __webpack_require__(29)(content, {}); // Hot Module Replacement if(false) { // When the styles change, update the <style> tags module.hot.accept("!!/Users/kylemathews/programs/react-spinkit/node_modules/css-loader/index.js!/Users/kylemathews/programs/react-spinkit/css/wordpress.css", function() { var newContent = require("!!/Users/kylemathews/programs/react-spinkit/node_modules/css-loader/index.js!/Users/kylemathews/programs/react-spinkit/css/wordpress.css"); if(typeof newContent === 'string') newContent = [[module.id, newContent, '']]; update(newContent); }); // When the module is disposed, remove the <style> tags module.hot.dispose(function() { update(); }); } /***/ }, /* 28 */ /***/ function(module, exports, __webpack_require__) { exports = module.exports = __webpack_require__(51)(); exports.push([module.id, ".wordpress {\n background: #333;\n width: 27px;\n height: 27px;\n display: inline-block;\n border-radius: 27px;\n position: relative;\n -webkit-animation: inner-circle 1s linear infinite;\n animation: inner-circle 1s linear infinite;\n}\n\n.inner-circle {\n display: block;\n background: #fff;\n width: 8px;\n height: 8px;\n position: absolute;\n border-radius: 8px;\n top: 5px;\n left: 5px;\n}\n\n@-webkit-keyframes inner-circle {\n 0% { -webkit-transform: rotate(0); }\n 100% { -webkit-transform: rotate(360deg); }\n}\n\n@keyframes inner-circle {\n 0% { transform: rotate(0); -webkit-transform:rotate(0); }\n 100% { transform: rotate(360deg); -webkit-transform:rotate(360deg); }\n}\n\n", ""]); /***/ }, /* 29 */ /***/ function(module, exports, __webpack_require__) { /* MIT License http://www.opensource.org/licenses/mit-license.php Author Tobias Koppers @sokra */ var stylesInDom = {}, memoize = function(fn) { var memo; return function () { if (typeof memo === "undefined") memo = fn.apply(this, arguments); return memo; }; }, isOldIE = memoize(function() { return /msie [6-9]\b/.test(window.navigator.userAgent.toLowerCase()); }), getHeadElement = memoize(function () { return document.head || document.getElementsByTagName("head")[0]; }), singletonElement = null, singletonCounter = 0; module.exports = function(list, options) { if(false) { if(typeof document !== "object") throw new Error("The style-loader cannot be used in a non-browser environment"); } options = options || {}; // Force single-tag solution on IE6-9, which has a hard limit on the # of <style> // tags it will allow on a page if (typeof options.singleton === "undefined") options.singleton = isOldIE(); var styles = listToStyles(list); addStylesToDom(styles, options); return function update(newList) { var mayRemove = []; for(var i = 0; i < styles.length; i++) { var item = styles[i]; var domStyle = stylesInDom[item.id]; domStyle.refs--; mayRemove.push(domStyle); } if(newList) { var newStyles = listToStyles(newList); addStylesToDom(newStyles, options); } for(var i = 0; i < mayRemove.length; i++) { var domStyle = mayRemove[i]; if(domStyle.refs === 0) { for(var j = 0; j < domStyle.parts.length; j++) domStyle.parts[j](); delete stylesInDom[domStyle.id]; } } }; } function addStylesToDom(styles, options) { for(var i = 0; i < styles.length; i++) { var item = styles[i]; var domStyle = stylesInDom[item.id]; if(domStyle) { domStyle.refs++; for(var j = 0; j < domStyle.parts.length; j++) { domStyle.parts[j](item.parts[j]); } for(; j < item.parts.length; j++) { domStyle.parts.push(addStyle(item.parts[j], options)); } } else { var parts = []; for(var j = 0; j < item.parts.length; j++) { parts.push(addStyle(item.parts[j], options)); } stylesInDom[item.id] = {id: item.id, refs: 1, parts: parts}; } } } function listToStyles(list) { var styles = []; var newStyles = {}; for(var i = 0; i < list.length; i++) { var item = list[i]; var id = item[0]; var css = item[1]; var media = item[2]; var sourceMap = item[3]; var part = {css: css, media: media, sourceMap: sourceMap}; if(!newStyles[id]) styles.push(newStyles[id] = {id: id, parts: [part]}); else newStyles[id].parts.push(part); } return styles; } function createStyleElement() { var styleElement = document.createElement("style"); var head = getHeadElement(); styleElement.type = "text/css"; head.appendChild(styleElement); return styleElement; } function addStyle(obj, options) { var styleElement, update, remove; if (options.singleton) { var styleIndex = singletonCounter++; styleElement = singletonElement || (singletonElement = createStyleElement()); update = applyToSingletonTag.bind(null, styleElement, styleIndex, false); remove = applyToSingletonTag.bind(null, styleElement, styleIndex, true); } else { styleElement = createStyleElement(); update = applyToTag.bind(null, styleElement); remove = function () { styleElement.parentNode.removeChild(styleElement); }; } update(obj); return function updateStyle(newObj) { if(newObj) { if(newObj.css === obj.css && newObj.media === obj.media && newObj.sourceMap === obj.sourceMap) return; update(obj = newObj); } else { remove(); } }; } function replaceText(source, id, replacement) { var boundaries = ["/** >>" + id + " **/", "/** " + id + "<< **/"]; var start = source.lastIndexOf(boundaries[0]); var wrappedReplacement = replacement ? (boundaries[0] + replacement + boundaries[1]) : ""; if (source.lastIndexOf(boundaries[0]) >= 0) { var end = source.lastIndexOf(boundaries[1]) + boundaries[1].length; return source.slice(0, start) + wrappedReplacement + source.slice(end); } else { return source + wrappedReplacement; } } function applyToSingletonTag(styleElement, index, remove, obj) { var css = remove ? "" : obj.css; if(styleElement.styleSheet) { styleElement.styleSheet.cssText = replaceText(styleElement.styleSheet.cssText, index, css); } else { var cssNode = document.createTextNode(css); var childNodes = styleElement.childNodes; if (childNodes[index]) styleElement.removeChild(childNodes[index]); if (childNodes.length) { styleElement.insertBefore(cssNode, childNodes[index]); } else { styleElement.appendChild(cssNode); } } } function applyToTag(styleElement, obj) { var css = obj.css; var media = obj.media; var sourceMap = obj.sourceMap; if(sourceMap && typeof btoa === "function") { try { css += "\n/*# sourceMappingURL=data:application/json;base64," + btoa(JSON.stringify(sourceMap)) + " */"; css = "@import url(\"data:text/css;base64," + btoa(css) + "\")"; } catch(e) {} } if(media) { styleElement.setAttribute("media", media) } if(styleElement.styleSheet) { styleElement.styleSheet.cssText = css; } else { while(styleElement.firstChild) { styleElement.removeChild(styleElement.firstChild); } styleElement.appendChild(document.createTextNode(css)); } } /***/ }, /* 30 */ /***/ function(module, exports, __webpack_require__) { /* WEBPACK VAR INJECTION */(function(process) {/** * Copyright 2013-2015, Facebook, Inc. * All rights reserved. * * This source code is licensed under the BSD-style license found in the * LICENSE file in the root directory of this source tree. An additional grant * of patent rights can be found in the PATENTS file in the same directory. * * @providesModule EventPluginUtils */ 'use strict'; var EventConstants = __webpack_require__(52); var invariant = __webpack_require__(53); /** * Injected dependencies: */ /** * - `Mount`: [required] Module that can convert between React dom IDs and * actual node references. */ var injection = { Mount: null, injectMount: function(InjectedMount) { injection.Mount = InjectedMount; if ("production" !== process.env.NODE_ENV) { ("production" !== process.env.NODE_ENV ? invariant( InjectedMount && InjectedMount.getNode, 'EventPluginUtils.injection.injectMount(...): Injected Mount module ' + 'is missing getNode.' ) : invariant(InjectedMount && InjectedMount.getNode)); } } }; var topLevelTypes = EventConstants.topLevelTypes; function isEndish(topLevelType) { return topLevelType === topLevelTypes.topMouseUp || topLevelType === topLevelTypes.topTouchEnd || topLevelType === topLevelTypes.topTouchCancel; } function isMoveish(topLevelType) { return topLevelType === topLevelTypes.topMouseMove || topLevelType === topLevelTypes.topTouchMove; } function isStartish(topLevelType) { return topLevelType === topLevelTypes.topMouseDown || topLevelType === topLevelTypes.topTouchStart; } var validateEventDispatches; if ("production" !== process.env.NODE_ENV) { validateEventDispatches = functi