coloreact - npm Package Compare versions

Comparing version 0.2.4 to 0.3.0

lib/components/ColorPicker.js

@@ -1,2 +0,2 @@
-'use strict';
+"use strict";
 
@@ -6,58 +6,62 @@ Object.defineProperty(exports, "__esModule", {
 });
+exports["default"] = void 0;
 
-var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+var _react = _interopRequireWildcard(require("react"));
 
-var _react = require('react');
+var _propTypes = _interopRequireDefault(require("prop-types"));
 
-var _react2 = _interopRequireDefault(_react);
+var _Slider = _interopRequireDefault(require("./Slider"));
 
-var _propTypes = require('prop-types');
+var _Map = _interopRequireDefault(require("./Map"));
 
-var _propTypes2 = _interopRequireDefault(_propTypes);
+var _lodash = _interopRequireDefault(require("lodash.throttle"));
 
-var _Slider = require('./Slider');
+var _tinycolor = _interopRequireDefault(require("tinycolor2"));
 
-var _Slider2 = _interopRequireDefault(_Slider);
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
-var _Map = require('./Map');
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
 
-var _Map2 = _interopRequireDefault(_Map);
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; if (obj != null) { var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-var _lodash = require('lodash.throttle');
+function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
 
-var _lodash2 = _interopRequireDefault(_lodash);
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 
-var _tinycolor = require('tinycolor2');
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
 
-var _tinycolor2 = _interopRequireDefault(_tinycolor);
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
 
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
 
-function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
 
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
 
-var ColorPicker = function (_Component) {
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+
+var ColorPicker =
+/*#__PURE__*/
+function (_Component) {
   _inherits(ColorPicker, _Component);
 
   function ColorPicker(props) {
+    var _this;
+
     _classCallCheck(this, ColorPicker);
 
-    var _this = _possibleConstructorReturn(this, (ColorPicker.__proto__ || Object.getPrototypeOf(ColorPicker)).call(this, props));
-
-    var c = (0, _tinycolor2.default)(_this.props.color).toHsv();
+    _this = _possibleConstructorReturn(this, _getPrototypeOf(ColorPicker).call(this, props));
+    var c = (0, _tinycolor["default"])(_this.props.color).toHsv();
     _this.state = {
       color: _this.toPercentage(c)
     };
-
-    _this.throttle = (0, _lodash2.default)(function (fn, data) {
+    _this.throttle = (0, _lodash["default"])(function (fn, data) {
       fn(data);
     }, 100);
-
-    _this.handleSaturationValueChange = _this.handleSaturationValueChange.bind(_this);
-    _this.handleHueChange = _this.handleHueChange.bind(_this);
-    _this.handleAlphaChange = _this.handleAlphaChange.bind(_this);
-    _this.showLastValue = _this.showLastValue.bind(_this);
+    _this.handleSaturationValueChange = _this.handleSaturationValueChange.bind(_assertThisInitialized(_this));
+    _this.handleHueChange = _this.handleHueChange.bind(_assertThisInitialized(_this));
+    _this.handleAlphaChange = _this.handleAlphaChange.bind(_assertThisInitialized(_this));
+    _this.showLastValue = _this.showLastValue.bind(_assertThisInitialized(_this));
     return _this;
@@ -67,6 +71,6 @@ }
   _createClass(ColorPicker, [{
-    key: 'componentWillReceiveProps',
+    key: "componentWillReceiveProps",
     value: function componentWillReceiveProps(nextProps) {
-      if (!_tinycolor2.default.equals(nextProps.color, this.state.color)) {
-        var c = (0, _tinycolor2.default)(nextProps.color).toHsv();
+      if (!_tinycolor["default"].equals(nextProps.color, this.state.color)) {
+        var c = (0, _tinycolor["default"])(nextProps.color).toHsv();
         this.setState({
@@ -78,3 +82,3 @@ color: this.toPercentage(c)
   }, {
-    key: 'toPercentage',
+    key: "toPercentage",
     value: function toPercentage(hsv) {
@@ -85,3 +89,2 @@ var h = hsv.h,
           a = hsv.a;
-
       return {
@@ -95,32 +98,44 @@ h: h,
   }, {
-    key: 'handleHueChange',
+    key: "handleHueChange",
     value: function handleHueChange(h) {
-      var _state$color = this.state.color,
-          s = _state$color.s,
-          v = _state$color.v,
-          a = _state$color.a;
-
-      this.update({ h: h, s: s, v: v, a: a });
+      var _this$state$color = this.state.color,
+          s = _this$state$color.s,
+          v = _this$state$color.v,
+          a = _this$state$color.a;
+      this.update({
+        h: h,
+        s: s,
+        v: v,
+        a: a
+      });
     }
   }, {
-    key: 'handleSaturationValueChange',
+    key: "handleSaturationValueChange",
     value: function handleSaturationValueChange(s, v) {
-      var _state$color2 = this.state.color,
-          h = _state$color2.h,
-          a = _state$color2.a;
-
-      this.update({ h: h, s: s, v: v, a: a });
+      var _this$state$color2 = this.state.color,
+          h = _this$state$color2.h,
+          a = _this$state$color2.a;
+      this.update({
+        h: h,
+        s: s,
+        v: v,
+        a: a
+      });
     }
   }, {
-    key: 'handleAlphaChange',
+    key: "handleAlphaChange",
     value: function handleAlphaChange(a) {
-      var _state$color3 = this.state.color,
-          h = _state$color3.h,
-          s = _state$color3.s,
-          v = _state$color3.v;
-
-      this.update({ h: h, s: s, v: v, a: a });
+      var _this$state$color3 = this.state.color,
+          h = _this$state$color3.h,
+          s = _this$state$color3.s,
+          v = _this$state$color3.v;
+      this.update({
+        h: h,
+        s: s,
+        v: v,
+        a: a
+      });
     }
   }, {
-    key: 'getAlpha',
+    key: "getAlpha",
     value: function getAlpha() {
@@ -130,34 +145,40 @@ return this.state.color.a === undefined ? 1 : this.state.color.a;
   }, {
-    key: 'getBackgroundHue',
+    key: "getBackgroundHue",
     value: function getBackgroundHue() {
-      return (0, _tinycolor2.default)({
+      return (0, _tinycolor["default"])({
         h: this.state.color.h,
         s: 100,
-        v: 100 }).toRgbString();
+        v: 100
+      }).toRgbString();
     }
   }, {
-    key: 'getBackgroundGradient',
+    key: "getBackgroundGradient",
     value: function getBackgroundGradient() {
-      var _state$color4 = this.state.color,
-          h = _state$color4.h,
-          s = _state$color4.s,
-          v = _state$color4.v;
-
-      var opaque = (0, _tinycolor2.default)({
+      var _this$state$color4 = this.state.color,
+          h = _this$state$color4.h,
+          s = _this$state$color4.s,
+          v = _this$state$color4.v;
+      var opaque = (0, _tinycolor["default"])({
         h: h,
         s: s,
         v: v,
-        a: 1 }).toRgbString();
-      return 'linear-gradient(to right, rgba(0,0,0,0) 0%, ' + opaque + ' 100%)';
+        a: 1
+      }).toRgbString();
+      return "linear-gradient(to right, rgba(0,0,0,0) 0%, ".concat(opaque, " 100%)");
     }
   }, {
-    key: 'update',
+    key: "update",
     value: function update(color) {
-      this.setState({ color: color });
-      this.throttle(this.props.onChange, this.output());
+      var _this2 = this;
+
+      this.setState({
+        color: color
+      }, function () {
+        _this2.throttle(_this2.props.onChange, _this2.output());
+      });
     }
   }, {
-    key: 'output',
+    key: "output",
     value: function output() {
-      var c = (0, _tinycolor2.default)(this.state.color);
+      var c = (0, _tinycolor["default"])(this.state.color);
       return {
@@ -172,3 +193,3 @@ hsl: c.toHsl(),
   }, {
-    key: 'showLastValue',
+    key: "showLastValue",
     value: function showLastValue() {
@@ -178,76 +199,72 @@ this.props.onComplete && this.props.onComplete(this.output());
   }, {
-    key: 'render',
+    key: "render",
     value: function render() {
-      var _state$color5 = this.state.color,
-          h = _state$color5.h,
-          s = _state$color5.s,
-          v = _state$color5.v,
-          a = _state$color5.a;
-
-      return _react2.default.createElement(
-        'div',
-        {
-          className: this.props.className || 'ColorPicker',
-          style: this.props.style },
-        _react2.default.createElement(_Slider2.default, {
-          className: 'HueSlider',
-          vertical: true,
-          value: h,
-          type: 'hue',
-          max: 360,
-          onChange: this.handleHueChange,
-          onComplete: this.showLastValue,
-          style: {
-            right: '1.3em',
-            bottom: this.props.opacity ? '2.5em' : '1.3em'
-          },
-          trackStyle: {
-            borderRadius: '1em',
-            background: 'linear-gradient(to bottom,\n              #FF0000 0%,\n              #FF0099 10%,\n              #CD00FF 20%,\n              #3200FF 30%,\n              #0066FF 40%,\n              #00FFFD 50%,\n              #00FF66 60%,\n              #35FF00 70%,\n              #CDFF00 80%,\n              #FF9900 90%,\n              #FF0000 100%\n            )'
-          },
-          pointerStyle: {
-            boxShadow: 'inset 0 0 0 1px #ccc,0 1px 2px #ccc',
-            borderRadius: '100%'
-          } }),
-        this.props.opacity && _react2.default.createElement(_Slider2.default, {
-          className: 'OpacitySlider',
-          type: 'opacity',
-          value: a,
-          max: 1,
-          background: this.getBackgroundGradient(),
-          onChange: this.handleAlphaChange,
-          onComplete: this.showLastValue,
-          style: {
-            bottom: '1.3em',
-            right: '2.5em',
-            height: 8,
-            background: '#fff url("data:image/gif;base64,R0lGODdhEAAQAPEAAMvLy8zMzP///wAAACwAAAAAEAAQAEACHYxvosstCAEMrq6Jj812Y59NIDQipdY5XLWqH4sVADs=") repeat',
-            backgroundSize: '8px 8px'
-          },
-          trackStyle: {
-            borderRadius: '1em',
-            background: 'linear-gradient(to right, rgba(255,255,255,0) 0%, #FFF 100%)'
-          },
-          pointerStyle: {
-            boxShadow: 'inset 0 0 0 1px #ccc,0 1px 2px #ccc',
-            borderRadius: '100%'
-          } }),
-        _react2.default.createElement(_Map2.default, {
-          x: s,
-          y: v,
-          max: 100,
-          backgroundColor: this.getBackgroundHue(),
-          onChange: this.handleSaturationValueChange,
-          onComplete: this.showLastValue,
-          style: {
-            top: 0,
-            left: 0,
-            right: '2.5em',
-            bottom: this.props.opacity ? '2.5em' : '1.3em'
-          },
-          pointerStyle: {
-            borderColor: (0, _tinycolor2.default)(this.state.color).isDark() ? "#fff" : "#000"
-          }
-        })
-      );
+      var _this$state$color5 = this.state.color,
+          h = _this$state$color5.h,
+          s = _this$state$color5.s,
+          v = _this$state$color5.v,
+          a = _this$state$color5.a;
+      return _react["default"].createElement("div", {
+        className: this.props.className || 'ColorPicker',
+        style: this.props.style
+      }, _react["default"].createElement(_Slider["default"], {
+        className: "HueSlider",
+        vertical: true,
+        value: h,
+        type: "hue",
+        max: 360,
+        onChange: this.handleHueChange,
+        onComplete: this.showLastValue,
+        style: {
+          right: '1.3em',
+          bottom: this.props.opacity ? '2.5em' : '1.3em'
+        },
+        trackStyle: {
+          borderRadius: '1em',
+          background: "linear-gradient(to bottom,\n              #f00 0%,\n              #ff0 17%,\n              #0f0 33%,\n              #0ff 50%,\n              #00f 67%,\n              #f0f 83%,\n              #f00 100%\n            )"
+        },
+        pointerStyle: {
+          boxShadow: 'inset 0 0 0 1px #ccc,0 1px 2px #ccc',
+          borderRadius: '100%'
+        }
+      }), this.props.opacity && _react["default"].createElement(_Slider["default"], {
+        className: "OpacitySlider",
+        type: "opacity",
+        value: a,
+        max: 1,
+        background: this.getBackgroundGradient(),
+        onChange: this.handleAlphaChange,
+        onComplete: this.showLastValue,
+        style: {
+          bottom: '1.3em',
+          right: '2.5em',
+          height: 8,
+          background: '#fff url("data:image/gif;base64,R0lGODdhEAAQAPEAAMvLy8zMzP///wAAACwAAAAAEAAQAEACHYxvosstCAEMrq6Jj812Y59NIDQipdY5XLWqH4sVADs=") repeat',
+          backgroundSize: '8px 8px'
+        },
+        trackStyle: {
+          borderRadius: '1em',
+          background: 'linear-gradient(to right, rgba(255,255,255,0) 0%, #FFF 100%)'
+        },
+        pointerStyle: {
+          boxShadow: 'inset 0 0 0 1px #ccc,0 1px 2px #ccc',
+          borderRadius: '100%'
+        }
+      }), _react["default"].createElement(_Map["default"], {
+        x: s,
+        y: v,
+        max: 100,
+        backgroundColor: this.getBackgroundHue(),
+        onChange: this.handleSaturationValueChange,
+        onComplete: this.showLastValue,
+        style: {
+          top: 0,
+          left: 0,
+          right: '2.5em',
+          bottom: this.props.opacity ? '2.5em' : '1.3em'
+        },
+        pointerStyle: {
+          borderColor: (0, _tinycolor["default"])(this.state.color).isDark() ? '#fff' : '#000'
+        }
+      }));
     }
@@ -260,11 +277,10 @@ }]);
 ColorPicker.propTypes = {
-  color: _propTypes2.default.string.isRequired,
-  onChange: _propTypes2.default.func.isRequired,
-  onComplete: _propTypes2.default.func
+  color: _propTypes["default"].string.isRequired,
+  onChange: _propTypes["default"].func.isRequired,
+  onComplete: _propTypes["default"].func
 };
-
 ColorPicker.defaultProps = {
   color: 'rgba(0,0,0,1)'
 };
-
-exports.default = ColorPicker;
+var _default = ColorPicker;
+exports["default"] = _default;

lib/components/Draggable.js

@@ -1,2 +0,2 @@
-'use strict';
+"use strict";
 
@@ -6,44 +6,50 @@ Object.defineProperty(exports, "__esModule", {
 });
+exports["default"] = draggable;
 
-var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+var _react = _interopRequireWildcard(require("react"));
 
-var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+var _propTypes = _interopRequireDefault(require("prop-types"));
 
-exports.default = draggable;
+var _reactDom = _interopRequireDefault(require("react-dom"));
 
-var _react = require('react');
+var _hoistNonReactStatics = _interopRequireDefault(require("hoist-non-react-statics"));
 
-var _react2 = _interopRequireDefault(_react);
+var _lodash = _interopRequireDefault(require("lodash.throttle"));
 
-var _propTypes = require('prop-types');
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
-var _propTypes2 = _interopRequireDefault(_propTypes);
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
 
-var _reactDom = require('react-dom');
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; if (obj != null) { var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-var _reactDom2 = _interopRequireDefault(_reactDom);
+function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
 
-var _hoistNonReactStatics = require('hoist-non-react-statics');
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
-var _hoistNonReactStatics2 = _interopRequireDefault(_hoistNonReactStatics);
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 
-var _lodash = require('lodash.throttle');
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
 
-var _lodash2 = _interopRequireDefault(_lodash);
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
 
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
 
-function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
 
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
 
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+
 var noop = function noop() {};
+
 var getDocument = function getDocument(element) {
   return element.ownerDocument;
 };
+
 var clamp = function clamp(val, min, max) {
   return Math.min(Math.max(val, min), max);
 };
+
 var getDisplayName = function getDisplayName(WrappedComponent) {
@@ -55,25 +61,28 @@ return WrappedComponent.displayName || WrappedComponent.name || 'Component';
   var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-
   return function wrappedInDraggable(WrappedComponent) {
-    var Draggable = function (_Component) {
+    var Draggable =
+    /*#__PURE__*/
+    function (_Component) {
       _inherits(Draggable, _Component);
 
       function Draggable(props) {
+        var _this;
+
         _classCallCheck(this, Draggable);
 
-        var _this = _possibleConstructorReturn(this, (Draggable.__proto__ || Object.getPrototypeOf(Draggable)).call(this, props));
-
-        _this.state = { active: false };
-
-        _this.throttle = (0, _lodash2.default)(function (fn, data) {
+        _this = _possibleConstructorReturn(this, _getPrototypeOf(Draggable).call(this, props));
+        _this.state = {
+          active: false
+        };
+        _this.throttle = (0, _lodash["default"])(function (fn, data) {
           return fn(data);
         }, 30);
-        _this.getPercentageValue = _this.getPercentageValue.bind(_this);
-        _this.startUpdates = _this.startUpdates.bind(_this);
-        _this.handleUpdate = _this.handleUpdate.bind(_this);
-        _this.stopUpdates = _this.stopUpdates.bind(_this);
-        _this.getPosition = _this.getPosition.bind(_this);
-        _this.getScaledValue = _this.getScaledValue.bind(_this);
-        _this.updateBoundingRect = _this.updateBoundingRect.bind(_this);
-        _this.updatePosition = _this.updatePosition.bind(_this);
+        _this.getPercentageValue = _this.getPercentageValue.bind(_assertThisInitialized(_this));
+        _this.startUpdates = _this.startUpdates.bind(_assertThisInitialized(_this));
+        _this.handleUpdate = _this.handleUpdate.bind(_assertThisInitialized(_this));
+        _this.stopUpdates = _this.stopUpdates.bind(_assertThisInitialized(_this));
+        _this.getPosition = _this.getPosition.bind(_assertThisInitialized(_this));
+        _this.getScaledValue = _this.getScaledValue.bind(_assertThisInitialized(_this));
+        _this.updateBoundingRect = _this.updateBoundingRect.bind(_assertThisInitialized(_this));
+        _this.updatePosition = _this.updatePosition.bind(_assertThisInitialized(_this));
         return _this;
@@ -83,43 +92,42 @@ }
       _createClass(Draggable, [{
-        key: 'componentDidMount',
+        key: "componentDidMount",
         value: function componentDidMount() {
-          this.document = getDocument(_reactDom2.default.findDOMNode(this));
+          this.document = getDocument(_reactDom["default"].findDOMNode(this));
           var window = this.window = this.document.defaultView;
-
-          window.addEventListener("resize", this.updateBoundingRect);
-          window.addEventListener("scroll", this.updateBoundingRect);
-
+          window.addEventListener('resize', this.updateBoundingRect);
+          window.addEventListener('scroll', this.updateBoundingRect);
           this.updateBoundingRect();
         }
       }, {
-        key: 'componentWillUnmount',
+        key: "componentWillUnmount",
         value: function componentWillUnmount() {
           var window = this.window;
-
-          window.removeEventListener("resize", this.updateBoundingRect);
-          window.removeEventListener("scroll", this.updateBoundingRect);
+          window.removeEventListener('resize', this.updateBoundingRect);
+          window.removeEventListener('scroll', this.updateBoundingRect);
         }
       }, {
-        key: 'startUpdates',
+        key: "startUpdates",
         value: function startUpdates(e) {
           var document = this.document;
-
           e.preventDefault();
-
           var rect = this.updateBoundingRect();
-          document.addEventListener("mousemove", this.handleUpdate);
-          document.addEventListener("touchmove", this.handleUpdate);
-          document.addEventListener("mouseup", this.stopUpdates);
-          document.addEventListener("touchend", this.stopUpdates);
+          document.addEventListener('mousemove', this.handleUpdate);
+          document.addEventListener('touchmove', this.handleUpdate);
+          document.addEventListener('mouseup', this.stopUpdates);
+          document.addEventListener('touchend', this.stopUpdates);
 
-          var _getPosition = this.getPosition(e),
-              x = _getPosition.x,
-              y = _getPosition.y;
+          var _this$getPosition = this.getPosition(e),
+              x = _this$getPosition.x,
+              y = _this$getPosition.y;
 
-          this.setState({ active: true });
-          this.updatePosition({ x: x, y: y }, rect);
-          // this.throttle(this.updatePosition, { x, y });
+          this.setState({
+            active: true
+          });
+          this.updatePosition({
+            x: x,
+            y: y
+          }, rect); // this.throttle(this.updatePosition, { x, y });
         }
       }, {
-        key: 'handleUpdate',
+        key: "handleUpdate",
         value: function handleUpdate(e) {
@@ -129,28 +137,29 @@ if (this.state.active) {
 
-            var _getPosition2 = this.getPosition(e),
-                x = _getPosition2.x,
-                y = _getPosition2.y;
+            var _this$getPosition2 = this.getPosition(e),
+                x = _this$getPosition2.x,
+                y = _this$getPosition2.y;
 
-            this.updatePosition({ x: x, y: y });
-            // this.throttle(this.updatePosition, { x, y });
+            this.updatePosition({
+              x: x,
+              y: y
+            }); // this.throttle(this.updatePosition, { x, y });
           }
         }
       }, {
-        key: 'stopUpdates',
+        key: "stopUpdates",
         value: function stopUpdates() {
           if (this.state.active) {
             var document = this.document;
-
-
-            document.removeEventListener("mousemove", this.handleUpdate);
-            document.removeEventListener("touchmove", this.handleUpdate);
-            document.removeEventListener("mouseup", this.stopUpdates);
-            document.removeEventListener("touchend", this.stopUpdates);
-
+            document.removeEventListener('mousemove', this.handleUpdate);
+            document.removeEventListener('touchmove', this.handleUpdate);
+            document.removeEventListener('mouseup', this.stopUpdates);
+            document.removeEventListener('touchend', this.stopUpdates);
             this.props.onComplete();
-            this.setState({ active: false });
+            this.setState({
+              active: false
+            });
           }
         }
       }, {
-        key: 'updatePosition',
+        key: "updatePosition",
         value: function updatePosition(_ref) {
@@ -171,3 +180,3 @@ var clientX = _ref.x,
       }, {
-        key: 'getPosition',
+        key: "getPosition",
         value: function getPosition(e) {
@@ -184,12 +193,11 @@ if (e.touches) {
       }, {
-        key: 'getPercentageValue',
+        key: "getPercentageValue",
         value: function getPercentageValue(value) {
-          return value / this.props.max * 100 + "%";
+          return value / this.props.max * 100 + '%';
         }
       }, {
-        key: 'getScaledValue',
+        key: "getScaledValue",
         value: function getScaledValue(value) {
           return clamp(value, 0, 1) * this.props.max;
         }
-
         /**
@@ -201,14 +209,18 @@ * Findout the bounding rect - update state to send the rect to WrappedComponent
       }, {
-        key: 'updateBoundingRect',
+        key: "updateBoundingRect",
         value: function updateBoundingRect() {
-          var rect = _reactDom2.default.findDOMNode(this).getBoundingClientRect();
-          this.setState({ rect: rect });
+          var rect = _reactDom["default"].findDOMNode(this).getBoundingClientRect();
+
+          this.setState({
+            rect: rect
+          });
           return rect;
         }
       }, {
-        key: 'render',
+        key: "render",
         value: function render() {
-          return _react2.default.createElement(WrappedComponent, _extends({}, this.props, this.state, {
+          return _react["default"].createElement(WrappedComponent, _extends({}, this.props, this.state, {
             startUpdates: this.startUpdates,
-            getPercentageValue: this.getPercentageValue }));
+            getPercentageValue: this.getPercentageValue
+          }));
         }
@@ -220,8 +232,8 @@ }]);
 
-    Draggable.displayName = 'draggable(' + getDisplayName(WrappedComponent) + ')';
+    Draggable.displayName = "draggable(".concat(getDisplayName(WrappedComponent), ")");
     Draggable.WrappedComponent = WrappedComponent;
     Draggable.propTypes = {
-      onChange: _propTypes2.default.func.isRequired,
-      onComplete: _propTypes2.default.func,
-      max: _propTypes2.default.number
+      onChange: _propTypes["default"].func.isRequired,
+      onComplete: _propTypes["default"].func,
+      max: _propTypes["default"].number
     };
@@ -233,5 +245,4 @@ Draggable.defaultProps = {
     };
-
-    return (0, _hoistNonReactStatics2.default)(Draggable, WrappedComponent);
+    return (0, _hoistNonReactStatics["default"])(Draggable, WrappedComponent);
   };
 }

lib/components/Map.js

@@ -1,2 +0,2 @@
-'use strict';
+"use strict";
 
@@ -6,26 +6,37 @@ Object.defineProperty(exports, "__esModule", {
 });
+exports["default"] = void 0;
 
-var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+var _react = _interopRequireWildcard(require("react"));
 
-var _react = require('react');
+var _propTypes = _interopRequireDefault(require("prop-types"));
 
-var _react2 = _interopRequireDefault(_react);
+var _Draggable = _interopRequireDefault(require("./Draggable"));
 
-var _propTypes = require('prop-types');
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
-var _propTypes2 = _interopRequireDefault(_propTypes);
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
 
-var _Draggable = require('./Draggable');
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; if (obj != null) { var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-var _Draggable2 = _interopRequireDefault(_Draggable);
+function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 
-function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
 
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
 
-var Map = function (_Component) {
+function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
+
+function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+
+function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
+
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+
+var Map =
+/*#__PURE__*/
+function (_Component) {
   _inherits(Map, _Component);
@@ -36,7 +47,7 @@
 
-    return _possibleConstructorReturn(this, (Map.__proto__ || Object.getPrototypeOf(Map)).apply(this, arguments));
+    return _possibleConstructorReturn(this, _getPrototypeOf(Map).apply(this, arguments));
   }
 
   _createClass(Map, [{
-    key: 'getMapStyles',
+    key: "getMapStyles",
     value: function getMapStyles() {
@@ -46,7 +57,6 @@ var _Map$defaultStyles = Map.defaultStyles,
           mapActive = _Map$defaultStyles.mapActive;
-
       return Object.assign({}, map, this.props.style && this.props.style, this.props.active && mapActive);
     }
   }, {
-    key: 'getPointerStyles',
+    key: "getPointerStyles",
     value: function getPointerStyles() {
@@ -57,3 +67,2 @@ var _Map$defaultStyles2 = Map.defaultStyles,
           pointerLight = _Map$defaultStyles2.pointerLight;
-
       return Object.assign({}, pointer, this.props.pointerStyle && this.props.pointerStyle, {
@@ -65,28 +74,29 @@ left: this.props.getPercentageValue(this.props.x),
   }, {
-    key: 'getBgStyles',
+    key: "getBgStyles",
     value: function getBgStyles() {
       var bg = Map.defaultStyles.bg;
       var backgroundColor = this.props.backgroundColor;
-
-      return Object.assign({}, bg, { backgroundColor: backgroundColor });
+      return Object.assign({}, bg, {
+        backgroundColor: backgroundColor
+      });
     }
   }, {
-    key: 'render',
+    key: "render",
     value: function render() {
       var bgOverlay = Map.defaultStyles.bgOverlay;
-
-      return _react2.default.createElement(
-        'div',
-        {
-          className: this.props.className,
-          style: this.getMapStyles(),
-          onMouseDown: this.props.startUpdates,
-          onTouchStart: this.props.startUpdates },
-        _react2.default.createElement(
-          'div',
-          { className: 'Map__Background', style: this.getBgStyles() },
-          _react2.default.createElement('span', { className: 'Map__Background__overlay', style: bgOverlay })
-        ),
-        this.props.rect && _react2.default.createElement('div', { className: 'Map__Pointer', style: this.getPointerStyles() })
-      );
+      return _react["default"].createElement("div", {
+        className: this.props.className,
+        style: this.getMapStyles(),
+        onMouseDown: this.props.startUpdates,
+        onTouchStart: this.props.startUpdates
+      }, _react["default"].createElement("div", {
+        className: "Map__Background",
+        style: this.getBgStyles()
+      }, _react["default"].createElement("span", {
+        className: "Map__Background__overlay",
+        style: bgOverlay
+      })), this.props.rect && _react["default"].createElement("div", {
+        className: "Map__Pointer",
+        style: this.getPointerStyles()
+      }));
     }
@@ -99,8 +109,7 @@ }]);
 Map.propTypes = {
-  x: _propTypes2.default.number.isRequired,
-  y: _propTypes2.default.number.isRequired,
-  backgroundColor: _propTypes2.default.string,
-  className: _propTypes2.default.string
+  x: _propTypes["default"].number.isRequired,
+  y: _propTypes["default"].number.isRequired,
+  backgroundColor: _propTypes["default"].string,
+  className: _propTypes["default"].string
 };
-
 Map.defaultProps = {
@@ -112,3 +121,2 @@ x: 0,
 };
-
 Map.defaultStyles = {
@@ -128,3 +136,2 @@ // Map
   },
-
   // Pointer
@@ -141,3 +148,2 @@ pointer: {
   },
-
   // Background
@@ -158,6 +164,8 @@ bg: {
     right: 0,
-    background: 'linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%),\n                 linear-gradient(to right, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%)'
+    background: "linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%),\n                 linear-gradient(to right, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%)"
   }
 };
 
-exports.default = (0, _Draggable2.default)()(Map);
+var _default = (0, _Draggable["default"])()(Map);
+
+exports["default"] = _default;

lib/components/Slider.js

@@ -1,2 +0,2 @@
-'use strict';
+"use strict";
 
@@ -6,21 +6,20 @@ Object.defineProperty(exports, "__esModule", {
 });
+exports["default"] = void 0;
 
-var _horizontalSlider;
+var _react = _interopRequireWildcard(require("react"));
 
-var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+var _propTypes = _interopRequireDefault(require("prop-types"));
 
-var _react = require('react');
+var _Draggable = _interopRequireDefault(require("./Draggable"));
 
-var _react2 = _interopRequireDefault(_react);
+var _horizontalSlider;
 
-var _propTypes = require('prop-types');
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
-var _propTypes2 = _interopRequireDefault(_propTypes);
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
 
-var _Draggable = require('./Draggable');
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; if (obj != null) { var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-var _Draggable2 = _interopRequireDefault(_Draggable);
+function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
@@ -30,7 +29,19 @@
 
-function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
 
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
 
-var Slider = function (_Component) {
+function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
+
+function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+
+function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
+
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+
+var Slider =
+/*#__PURE__*/
+function (_Component) {
   _inherits(Slider, _Component);
@@ -41,10 +52,9 @@
 
-    return _possibleConstructorReturn(this, (Slider.__proto__ || Object.getPrototypeOf(Slider)).apply(this, arguments));
+    return _possibleConstructorReturn(this, _getPrototypeOf(Slider).apply(this, arguments));
   }
 
   _createClass(Slider, [{
-    key: 'getPointerStyles',
+    key: "getPointerStyles",
     value: function getPointerStyles() {
       var pointer = Slider.defaultStyles.pointer;
-
       var attr = this.props.vertical ? 'bottom' : 'left';
@@ -54,3 +64,3 @@ return Object.assign({}, pointer, this.props.pointerStyle && this.props.pointerStyle, _defineProperty({}, attr, this.props.getPercentageValue(this.props.value)));
   }, {
-    key: 'getSliderStyles',
+    key: "getSliderStyles",
     value: function getSliderStyles() {
@@ -61,7 +71,6 @@ var _Slider$defaultStyles = Slider.defaultStyles,
           horizontalSlider = _Slider$defaultStyles.horizontalSlider;
-
       return Object.assign({}, slider, this.props.vertical && verticalSlider, !this.props.vertical && horizontalSlider, this.props.style && this.props.style);
     }
   }, {
-    key: 'getTrackStyles',
+    key: "getTrackStyles",
     value: function getTrackStyles() {
@@ -74,8 +83,9 @@ var _Slider$defaultStyles2 = Slider.defaultStyles,
           hueTrack = _Slider$defaultStyles2.hueTrack;
-
       var background = this.props.background;
-      return Object.assign({}, track, this.props.vertical && verticalTrack, !this.props.vertical && horizontalTrack, this.props.trackStyle && this.props.trackStyle, this.props.background && { background: this.props.background });
+      return Object.assign({}, track, this.props.vertical && verticalTrack, !this.props.vertical && horizontalTrack, this.props.trackStyle && this.props.trackStyle, this.props.background && {
+        background: this.props.background
+      });
     }
   }, {
-    key: 'render',
+    key: "render",
     value: function render() {
@@ -85,13 +95,14 @@ var _Slider$defaultStyles3 = Slider.defaultStyles,
           opacitySlider__track = _Slider$defaultStyles3.opacitySlider__track;
-
-      return _react2.default.createElement(
-        'div',
-        {
-          className: this.props.className || 'Slider',
-          style: this.getSliderStyles(),
-          onMouseDown: this.props.startUpdates,
-          onTouchStart: this.props.startUpdates },
-        _react2.default.createElement('div', { className: 'Slider__Track', style: this.getTrackStyles() }),
-        this.props.rect && _react2.default.createElement('div', { className: 'Slider__Pointer', style: this.getPointerStyles() })
-      );
+      return _react["default"].createElement("div", {
+        className: this.props.className || 'Slider',
+        style: this.getSliderStyles(),
+        onMouseDown: this.props.startUpdates,
+        onTouchStart: this.props.startUpdates
+      }, _react["default"].createElement("div", {
+        className: "Slider__Track",
+        style: this.getTrackStyles()
+      }), this.props.rect && _react["default"].createElement("div", {
+        className: "Slider__Pointer",
+        style: this.getPointerStyles()
+      }));
     }
@@ -104,6 +115,5 @@ }]);
 Slider.propTypes = {
-  value: _propTypes2.default.number.isRequired,
-  background: _propTypes2.default.string
+  value: _propTypes["default"].number.isRequired,
+  background: _propTypes["default"].string
 };
-
 Slider.defaultProps = {
@@ -113,3 +123,2 @@ value: 0,
 };
-
 Slider.defaultStyles = {
@@ -125,3 +134,3 @@ // Slider
     right: 0
-  }, _defineProperty(_horizontalSlider, 'height', 10), _defineProperty(_horizontalSlider, 'cursor', 'ew-resize'), _horizontalSlider),
+  }, _defineProperty(_horizontalSlider, "height", 10), _defineProperty(_horizontalSlider, "cursor", 'ew-resize'), _horizontalSlider),
   verticalSlider: {
@@ -133,3 +142,2 @@ top: 0,
   },
-
   // Track
@@ -150,3 +158,2 @@ track: {
   },
-
   // Pointer
@@ -166,2 +173,6 @@ pointer: {
 
-exports.default = (0, _Draggable2.default)({ single: true })(Slider);
+var _default = (0, _Draggable["default"])({
+  single: true
+})(Slider);
+
+exports["default"] = _default;

lib/index.js

@@ -1,2 +0,2 @@
-'use strict';
+"use strict";
 
@@ -6,20 +6,25 @@ Object.defineProperty(exports, "__esModule", {
 });
-exports.Map = exports.Slider = undefined;
+Object.defineProperty(exports, "Slider", {
+  enumerable: true,
+  get: function get() {
+    return _Slider2["default"];
+  }
+});
+Object.defineProperty(exports, "Map", {
+  enumerable: true,
+  get: function get() {
+    return _Map2["default"];
+  }
+});
+exports["default"] = void 0;
 
-var _ColorPicker = require('./components/ColorPicker');
+var _ColorPicker = _interopRequireDefault(require("./components/ColorPicker"));
 
-var _ColorPicker2 = _interopRequireDefault(_ColorPicker);
+var _Slider2 = _interopRequireDefault(require("./components/Slider"));
 
-var _Slider2 = require('./components/Slider');
+var _Map2 = _interopRequireDefault(require("./components/Map"));
 
-var _Slider3 = _interopRequireDefault(_Slider2);
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
-var _Map2 = require('./components/Map');
-
-var _Map3 = _interopRequireDefault(_Map2);
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-exports.Slider = _Slider3.default;
-exports.Map = _Map3.default;
-exports.default = _ColorPicker2.default;
+var _default = _ColorPicker["default"];
+exports["default"] = _default;

package.json

 {
   "name": "coloreact",
-  "version": "0.2.4",
+  "version": "0.3.0",
   "description": "A tiny Color Picker for React",
@@ -8,5 +8,5 @@ "main": "lib/index.js",
     "prepublish": "npm run lib",
-    "start": "webpack-dev-server --port 3040",
+    "start": "webpack-dev-server --mode development --open",
     "lib": "NODE_ENV=production babel -d lib/ src/",
-    "build": "webpack -p"
+    "build": "webpack --mode production"
   },
@@ -25,20 +25,21 @@ "keywords": [
   "devDependencies": {
-    "babel-cli": "^6.9.0",
-    "babel-core": "^6.7.4",
-    "babel-loader": "7.1.2",
-    "babel-preset-env": "1.6.0",
-    "babel-preset-react": "6.24.1",
-    "babel-preset-stage-1": "^6.5.0",
-    "css-loader": "0.28.7",
-    "extract-text-webpack-plugin": "3.0.1",
-    "prop-types": "15.6.0",
-    "react": "16.0.0",
-    "react-dom": "16.0.0",
-    "react-syntax-highlighter": "5.7.0",
-    "style-loader": "0.19.0",
-    "webpack": "3.6.0",
-    "webpack-dev-server": "2.7.1"
+    "@babel/cli": "7.6.2",
+    "@babel/core": "7.6.2",
+    "@babel/plugin-proposal-export-default-from": "7.5.2",
+    "@babel/preset-env": "7.6.2",
+    "@babel/preset-react": "7.0.0",
+    "babel-loader": "8.0.6",
+    "css-loader": "3.2.0",
+    "mini-css-extract-plugin": "0.8.0",
+    "prop-types": "15.7.2",
+    "react": "16.10.1",
+    "react-dom": "16.10.1",
+    "react-syntax-highlighter": "11.0.2",
+    "style-loader": "1.0.0",
+    "webpack": "4.41.0",
+    "webpack-cli": "3.3.9",
+    "webpack-dev-server": "3.8.1"
   },
   "dependencies": {
-    "hoist-non-react-statics": "2.3.1",
+    "hoist-non-react-statics": "3.3.0",
     "lodash.throttle": "4.1.1",
@@ -45,0 +46,0 @@ "tinycolor2": "^1.3.0"

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Lines of code

765

increased by13%

Worsened metrics

Total package byte prevSize

40450

decreased by-79.32%

Dev dependency count

16

increased by6.67%

Number of package files

9

decreased by-18.18%

Dependency changes

• + Addedhoist-non-react-statics@3.3.0(transitive)

• - Removedhoist-non-react-statics@2.3.1(transitive)

• Updatedhoist-non-react-statics@3.3.0