@desynova-digital/components 9.0.26 → 9.1.0

package/atoms/dropdownList/index.js

@@ -1,13 +1,9 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-
-var _dropdownList = require("./dropdownList");
-
-var _dropdownList2 = _interopRequireDefault(_dropdownList);
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-exports.default = _dropdownList2.default;
+exports["default"] = void 0;
+var _dropdownList = _interopRequireDefault(require("./dropdownList"));
+var _default = exports["default"] = _dropdownList["default"];

package/atoms/graphs/barGraph/barGraph.js

@@ -1,169 +1,119 @@
-'use strict';
+"use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-
-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 _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 _templateObject = _taggedTemplateLiteral(['\n  display: inline-block;\n  vertical-align: middle;\n  line-height: 1;\n  border-radius: ', ';\n'], ['\n  display: inline-block;\n  vertical-align: middle;\n  line-height: 1;\n  border-radius: ', ';\n']);
-
-var _react = require('react');
-
-var _react2 = _interopRequireDefault(_react);
-
-var _styledComponents = require('styled-components');
-
-var _styledComponents2 = _interopRequireDefault(_styledComponents);
-
-var _propTypes = require('prop-types');
-
-var _propTypes2 = _interopRequireDefault(_propTypes);
-
-var _tokens = require('@desynova-digital/tokens');
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _taggedTemplateLiteral(strings, raw) { return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-
-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 _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; }
-
-var BarGraph = function (_React$Component) {
-  _inherits(BarGraph, _React$Component);
-
-  function BarGraph(props) {
-    _classCallCheck(this, BarGraph);
-
-    var _this = _possibleConstructorReturn(this, (BarGraph.__proto__ || Object.getPrototypeOf(BarGraph)).call(this, props));
-
-    _initialiseProps.call(_this);
-
+exports["default"] = void 0;
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _react = _interopRequireDefault(require("react"));
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _tokens = require("@desynova-digital/tokens");
+var _templateObject;
+function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2["default"])(o), (0, _possibleConstructorReturn2["default"])(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2["default"])(t).constructor) : o.apply(t, e)); }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
+var BarGraph = /*#__PURE__*/function (_React$Component) {
+  function BarGraph(_props) {
+    var _this;
+    (0, _classCallCheck2["default"])(this, BarGraph);
+    _this = _callSuper(this, BarGraph, [_props]);
+    (0, _defineProperty2["default"])(_this, "getFilteredData", function (dataObj) {
+      var props = _this.props;
+      var total_val = dataObj.total;
+      var total_length = props.type === 'vertical' ? props.height : props.width;
+      var valueObjs = dataObj.values;
+      valueObjs.sort(function (a, b) {
+        var keyA = a.index,
+          keyB = b.index;
+        if (keyA < keyB) return -1;
+        if (keyA > keyB) return 1;
+        return 0;
+      });
+      var filteredData = [];
+      var length_sum = 0;
+      var percentSum = 0;
+      valueObjs.forEach(function (valueObj) {
+        var value = valueObj.data;
+        var percent2 = value / total_val * 100 + percentSum;
+        var percent = value / total_val;
+        var length = (typeof total_length === 'string' ? 100 : total_length) * percent + length_sum;
+        var data = {};
+        data.name = valueObj.name;
+        data.value = valueObj.value;
+        data.width = props.type === 'vertical' ? props.width : length;
+        data.height = props.type === 'vertical' ? length : props.height;
+        data.length = length;
+        data.percentLength = percent2;
+        data.index = valueObj.index;
+        filteredData.push(data);
+        length_sum = length;
+        percentSum = percent2;
+      });
+      return filteredData;
+    });
     _this.getFilteredData = _this.getFilteredData.bind(_this);
     return _this;
   }
-
-  _createClass(BarGraph, [{
-    key: 'componentDidMount',
+  (0, _inherits2["default"])(BarGraph, _React$Component);
+  return (0, _createClass2["default"])(BarGraph, [{
+    key: "componentDidMount",
     value: function componentDidMount() {}
   }, {
-    key: 'render',
+    key: "render",
     value: function render() {
       var _this2 = this;
-
       var data = this.props.data;
       var filteredData = this.getFilteredData(data);
-      return _react2.default.createElement(
-        _react2.default.Fragment,
-        null,
-        _react2.default.createElement(
-          GraphSVG,
-          _extends({}, this.props, {
-            width: this.props.width,
-            height: this.props.height
-            // viewBox={`0 0 ${this.props.width} ${this.props.height}`}
-            , preserveAspectRatio: 'none'
-          }),
-          this.props.colorType === 'gradient' ? _react2.default.createElement('defs', null) : null,
-          _react2.default.createElement(
-            'g',
-            {
-              transform: this.props.type === 'vertical' ? 'scale(1,-1) translate(0,-' + this.props.height + ')' : 'scale(1)'
-            },
-            filteredData.map(function (data, index) {
-              var item = filteredData[filteredData.length - index - 1];
-              var attrName = _this2.props.type === 'vertical' ? 'height' : 'width';
-
-              return _react2.default.createElement(
-                'rect',
-                {
-                  x: '0',
-                  y: '0',
-                  fill: _tokens.colors[_this2.props.theme].graph[item.value],
-                  width: item.width,
-                  height: item.height,
-                  key: index
-                },
-                _react2.default.createElement('animate', {
-                  attributeName: attrName,
-                  from: '0',
-                  to: item.percentLength + '%',
-                  dur: '0.5s',
-                  fill: 'freeze'
-                })
-              );
-            })
-          )
-        )
-      );
+      return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(GraphSVG, (0, _extends2["default"])({}, this.props, {
+        width: this.props.width,
+        height: this.props.height
+        // viewBox={`0 0 ${this.props.width} ${this.props.height}`}
+        ,
+        preserveAspectRatio: "none"
+      }), this.props.colorType === 'gradient' ? /*#__PURE__*/_react["default"].createElement("defs", null) : null, /*#__PURE__*/_react["default"].createElement("g", {
+        transform: this.props.type === 'vertical' ? "scale(1,-1) translate(0,-".concat(this.props.height, ")") : 'scale(1)'
+      }, filteredData.map(function (data, index) {
+        var item = filteredData[filteredData.length - index - 1];
+        var attrName = _this2.props.type === 'vertical' ? 'height' : 'width';
+        return /*#__PURE__*/_react["default"].createElement("rect", {
+          x: "0",
+          y: "0",
+          fill: _tokens.colors[_this2.props.theme].graph[item.value],
+          width: item.width,
+          height: item.height,
+          key: index
+        }, /*#__PURE__*/_react["default"].createElement("animate", {
+          attributeName: attrName,
+          from: "0",
+          to: item.percentLength + '%',
+          dur: "0.5s",
+          fill: "freeze"
+        }));
+      }))));
     }
   }]);
-
-  return BarGraph;
-}(_react2.default.Component);
-
-var _initialiseProps = function _initialiseProps() {
-  var _this3 = this;
-
-  this.getFilteredData = function (dataObj) {
-    var props = _this3.props;
-    var total_val = dataObj.total;
-    var total_length = props.type === 'vertical' ? props.height : props.width;
-    var valueObjs = dataObj.values;
-    valueObjs.sort(function (a, b) {
-      var keyA = a.index,
-          keyB = b.index;
-
-      if (keyA < keyB) return -1;
-      if (keyA > keyB) return 1;
-      return 0;
-    });
-    var filteredData = [];
-    var length_sum = 0;
-    var percentSum = 0;
-    valueObjs.forEach(function (valueObj) {
-      var value = valueObj.data;
-      var percent2 = value / total_val * 100 + percentSum;
-      var percent = value / total_val;
-      var length = (typeof total_length === 'string' ? 100 : total_length) * percent + length_sum;
-
-      var data = {};
-      data.name = valueObj.name;
-      data.value = valueObj.value;
-      data.width = props.type === 'vertical' ? props.width : length;
-      data.height = props.type === 'vertical' ? length : props.height;
-      data.length = length;
-      data.percentLength = percent2;
-      data.index = valueObj.index;
-      filteredData.push(data);
-      length_sum = length;
-      percentSum = percent2;
-    });
-
-    return filteredData;
-  };
-};
-
-var GraphSVG = _styledComponents2.default.svg(_templateObject, function (props) {
+}(_react["default"].Component);
+var GraphSVG = _styledComponents["default"].svg(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n  display: inline-block;\n  vertical-align: middle;\n  line-height: 1;\n  border-radius: ", ";\n"])), function (props) {
   return props.type === 'vertical' ? '0' : '5px';
 });
-
 BarGraph.propTypes = {
   /** Graph Data */
-  data: _propTypes2.default.object.isRequired,
+  data: _propTypes["default"].object.isRequired,
   /** Graph size */
   //width: PropTypes.number || PropTypes.string,
-  height: _propTypes2.default.number,
-  colorType: _propTypes2.default.oneOf(['gradient', 'normal']),
-  type: _propTypes2.default.oneOf(['vertical', 'horizontal']),
-  theme: _propTypes2.default.oneOf(['light', 'dark', 'nexc'])
+  height: _propTypes["default"].number,
+  colorType: _propTypes["default"].oneOf(['gradient', 'normal']),
+  type: _propTypes["default"].oneOf(['vertical', 'horizontal']),
+  theme: _propTypes["default"].oneOf(['light', 'dark', 'nexc'])
 };
-
 BarGraph.defaultProps = {
   data: {
     name: 'Archieve',
@@ -191,5 +141,4 @@ BarGraph.defaultProps = {
   type: 'vertical',
   theme: 'light'
 };
-
-exports.default = BarGraph;
+var _default = exports["default"] = BarGraph;

package/atoms/graphs/barGraph/barGraph.story.js

@@ -1,91 +1,69 @@
-'use strict';
+"use strict";
 
-var _react = require('react');
-
-var _react2 = _interopRequireDefault(_react);
-
-var _react3 = require('@storybook/react');
-
-var _storyHelpers = require('../../../_helpers/story-helpers');
-
-var _components = require('../../../../components');
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-(0, _react3.storiesOf)('BarGraph').add('light theme', function () {
-  return _react2.default.createElement(
-    _storyHelpers.Example,
-    { title: 'Appearances' },
-    _react2.default.createElement(
-      _storyHelpers.Stack,
-      null,
-      _react2.default.createElement(_components.BarGraph, { width: 50, height: 235, type: 'vertical' })
-    ),
-    _react2.default.createElement(
-      _storyHelpers.Stack,
-      null,
-      _react2.default.createElement(_components.BarGraph, { width: '50%', height: 12, type: 'horizontal' })
-    ),
-    _react2.default.createElement(
-      _storyHelpers.Stack,
-      null,
-      _react2.default.createElement(_components.BarGraph, { width: 360, height: 12, type: 'horizontal', colorType: 'gradient' })
-    )
-  );
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _react = _interopRequireDefault(require("react"));
+var _react2 = require("@storybook/react");
+var _storyHelpers = require("../../../_helpers/story-helpers");
+var _components = require("../../../../components");
+(0, _react2.storiesOf)('BarGraph').add('light theme', function () {
+  return /*#__PURE__*/_react["default"].createElement(_storyHelpers.Example, {
+    title: "Appearances"
+  }, /*#__PURE__*/_react["default"].createElement(_storyHelpers.Stack, null, /*#__PURE__*/_react["default"].createElement(_components.BarGraph, {
+    width: 50,
+    height: 235,
+    type: "vertical"
+  })), /*#__PURE__*/_react["default"].createElement(_storyHelpers.Stack, null, /*#__PURE__*/_react["default"].createElement(_components.BarGraph, {
+    width: '50%',
+    height: 12,
+    type: "horizontal"
+  })), /*#__PURE__*/_react["default"].createElement(_storyHelpers.Stack, null, /*#__PURE__*/_react["default"].createElement(_components.BarGraph, {
+    width: 360,
+    height: 12,
+    type: "horizontal",
+    colorType: "gradient"
+  })));
 });
-
-(0, _react3.storiesOf)('BarGraph').add('dark theme', function () {
-  return _react2.default.createElement(
-    _storyHelpers.Example,
-    { title: 'Tag', background: 'dark' },
-    _react2.default.createElement(
-      _storyHelpers.Stack,
-      null,
-      _react2.default.createElement(_components.BarGraph, { theme: 'dark', width: 50, height: 235, type: 'vertical' })
-    ),
-    _react2.default.createElement(
-      _storyHelpers.Stack,
-      null,
-      _react2.default.createElement(_components.BarGraph, { theme: 'dark', width: '100%', height: 12, type: 'horizontal' })
-    ),
-    _react2.default.createElement(
-      _storyHelpers.Stack,
-      null,
-      _react2.default.createElement(_components.BarGraph, {
-        theme: 'dark',
-        width: '360',
-        height: 12,
-        type: 'horizontal',
-        colorType: 'gradient'
-      })
-    )
-  );
+(0, _react2.storiesOf)('BarGraph').add('dark theme', function () {
+  return /*#__PURE__*/_react["default"].createElement(_storyHelpers.Example, {
+    title: "Tag",
+    background: "dark"
+  }, /*#__PURE__*/_react["default"].createElement(_storyHelpers.Stack, null, /*#__PURE__*/_react["default"].createElement(_components.BarGraph, {
+    theme: "dark",
+    width: 50,
+    height: 235,
+    type: "vertical"
+  })), /*#__PURE__*/_react["default"].createElement(_storyHelpers.Stack, null, /*#__PURE__*/_react["default"].createElement(_components.BarGraph, {
+    theme: "dark",
+    width: '100%',
+    height: 12,
+    type: "horizontal"
+  })), /*#__PURE__*/_react["default"].createElement(_storyHelpers.Stack, null, /*#__PURE__*/_react["default"].createElement(_components.BarGraph, {
+    theme: "dark",
+    width: '360',
+    height: 12,
+    type: "horizontal",
+    colorType: "gradient"
+  })));
 });
-
-(0, _react3.storiesOf)('BarGraph').add('nexc theme', function () {
-  return _react2.default.createElement(
-    _storyHelpers.Example,
-    { title: 'Tag', background: 'dark' },
-    _react2.default.createElement(
-      _storyHelpers.Stack,
-      null,
-      _react2.default.createElement(_components.BarGraph, { theme: 'nexc', width: 50, height: 235, type: 'vertical' })
-    ),
-    _react2.default.createElement(
-      _storyHelpers.Stack,
-      null,
-      _react2.default.createElement(_components.BarGraph, { theme: 'nexc', width: '100%', height: 12, type: 'horizontal' })
-    ),
-    _react2.default.createElement(
-      _storyHelpers.Stack,
-      null,
-      _react2.default.createElement(_components.BarGraph, {
-        theme: 'nexc',
-        width: '360',
-        height: 12,
-        type: 'horizontal',
-        colorType: 'gradient'
-      })
-    )
-  );
+(0, _react2.storiesOf)('BarGraph').add('nexc theme', function () {
+  return /*#__PURE__*/_react["default"].createElement(_storyHelpers.Example, {
+    title: "Tag",
+    background: "dark"
+  }, /*#__PURE__*/_react["default"].createElement(_storyHelpers.Stack, null, /*#__PURE__*/_react["default"].createElement(_components.BarGraph, {
+    theme: "nexc",
+    width: 50,
+    height: 235,
+    type: "vertical"
+  })), /*#__PURE__*/_react["default"].createElement(_storyHelpers.Stack, null, /*#__PURE__*/_react["default"].createElement(_components.BarGraph, {
+    theme: "nexc",
+    width: '100%',
+    height: 12,
+    type: "horizontal"
+  })), /*#__PURE__*/_react["default"].createElement(_storyHelpers.Stack, null, /*#__PURE__*/_react["default"].createElement(_components.BarGraph, {
+    theme: "nexc",
+    width: '360',
+    height: 12,
+    type: "horizontal",
+    colorType: "gradient"
+  })));
 });

package/atoms/graphs/barGraph/index.js

@@ -1,13 +1,9 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-
-var _barGraph = require("./barGraph");
-
-var _barGraph2 = _interopRequireDefault(_barGraph);
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-exports.default = _barGraph2.default;
+exports["default"] = void 0;
+var _barGraph = _interopRequireDefault(require("./barGraph"));
+var _default = exports["default"] = _barGraph["default"];