@desynova-digital/components 9.0.26 → 9.1.0

package/atoms/label/label.story.js

@@ -1,87 +1,46 @@
-'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)('Label').add('light theme', function () {
-  return _react2.default.createElement(
-    _storyHelpers.Example,
-    { title: 'Appearances Light', background: 'white' },
-    _react2.default.createElement(
-      _storyHelpers.Stack,
-      null,
-      _react2.default.createElement(
-        _components.Label,
-        { status: 'In Progress' },
-        'SHOW'
-      ),
-      _react2.default.createElement(
-        _components.Label,
-        { status: 'upload cancelled by user' },
-        'MOVIE'
-      ),
-      _react2.default.createElement(
-        _components.Label,
-        { status: 'fiNished' },
-        'CLIPS'
-      ),
-      _react2.default.createElement(
-        _components.Label,
-        { status: 'started' },
-        'TVC'
-      ),
-      _react2.default.createElement(
-        _components.Label,
-        { status: 'something else' },
-        'PROMOS'
-      )
-    )
-  );
+"use strict";
+
+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)('Label').add('light theme', function () {
+  return /*#__PURE__*/_react["default"].createElement(_storyHelpers.Example, {
+    title: "Appearances Light",
+    background: "white"
+  }, /*#__PURE__*/_react["default"].createElement(_storyHelpers.Stack, null, /*#__PURE__*/_react["default"].createElement(_components.Label, {
+    status: "In Progress"
+  }, "SHOW"), /*#__PURE__*/_react["default"].createElement(_components.Label, {
+    status: "upload cancelled by user"
+  }, "MOVIE"), /*#__PURE__*/_react["default"].createElement(_components.Label, {
+    status: "fiNished"
+  }, "CLIPS"), /*#__PURE__*/_react["default"].createElement(_components.Label, {
+    status: "started"
+  }, "TVC"), /*#__PURE__*/_react["default"].createElement(_components.Label, {
+    status: "something else"
+  }, "PROMOS")));
 });
-
-(0, _react3.storiesOf)('Label').add('dark theme', function () {
-  return _react2.default.createElement(
-    _storyHelpers.Example,
-    { title: 'Appearances Dark', background: 'dark' },
-    _react2.default.createElement(
-      _storyHelpers.Stack,
-      null,
-      _react2.default.createElement(
-        _components.Label,
-        { theme: 'dark', status: 'In Progress' },
-        'SHOW'
-      ),
-      _react2.default.createElement(
-        _components.Label,
-        { theme: 'dark', status: 'upload cancelled by user' },
-        'MOVIE'
-      ),
-      _react2.default.createElement(
-        _components.Label,
-        { theme: 'dark', status: 'fiNished' },
-        'CLIPS'
-      ),
-      _react2.default.createElement(
-        _components.Label,
-        { theme: 'dark', status: 'started' },
-        'TVC'
-      ),
-      _react2.default.createElement(
-        _components.Label,
-        { theme: 'drak', status: 'something else' },
-        'PROMOS'
-      )
-    )
-  );
+(0, _react2.storiesOf)('Label').add('dark theme', function () {
+  return /*#__PURE__*/_react["default"].createElement(_storyHelpers.Example, {
+    title: "Appearances Dark",
+    background: "dark"
+  }, /*#__PURE__*/_react["default"].createElement(_storyHelpers.Stack, null, /*#__PURE__*/_react["default"].createElement(_components.Label, {
+    theme: "dark",
+    status: "In Progress"
+  }, "SHOW"), /*#__PURE__*/_react["default"].createElement(_components.Label, {
+    theme: "dark",
+    status: "upload cancelled by user"
+  }, "MOVIE"), /*#__PURE__*/_react["default"].createElement(_components.Label, {
+    theme: "dark",
+    status: "fiNished"
+  }, "CLIPS"), /*#__PURE__*/_react["default"].createElement(_components.Label, {
+    theme: "dark",
+    status: "started"
+  }, "TVC"), /*#__PURE__*/_react["default"].createElement(_components.Label, {
+    theme: "drak",
+    status: "something else"
+  }, "PROMOS")));
 });
 
 // storiesOf("Label").add("appearance-dark", () => (

package/atoms/loader/CircleLoader.js

@@ -1,82 +1,48 @@
-'use strict';
+"use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-
-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  position: relative;\n  width: 100%;\n  height: 100%;\n  z-index: 1;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: transparent;\n  opacity: 1;\n  top: 1px;\n  left: 0px;\n  font-family: \'SFUIText-light\';\n\n\n  .loader,\n  .loader:after {\n    border-radius: 50%;\n    width: 10em;\n    height: 10em;\n  }\n  .loader {\n    margin: 0px auto;\n    font-size: 10px;\n    position: relative;\n    text-indent: -9999em;\n    border-top: 1.1em solid #eaeaea;\n    border-right: 1.1em solid #e3e3e3;\n    border-bottom: 1.1em solid #e0e0e0;\n    border-left: 1.1em solid ', ';\n    -webkit-transform: translateZ(0);\n    -ms-transform: translateZ(0);\n    transform: translateZ(0);\n    -webkit-animation: load8 1.1s infinite linear;\n    animation: load8 1.1s infinite linear;\n  }\n  @-webkit-keyframes load8 {\n    0% {\n      -webkit-transform: rotate(0deg);\n      transform: rotate(0deg);\n    }\n    100% {\n      -webkit-transform: rotate(360deg);\n      transform: rotate(360deg);\n    }\n  }\n  @keyframes load8 {\n    0% {\n      -webkit-transform: rotate(0deg);\n      transform: rotate(0deg);\n    }\n    100% {\n      -webkit-transform: rotate(360deg);\n      transform: rotate(360deg);\n    }\n  }\n'], ['\n  position: relative;\n  width: 100%;\n  height: 100%;\n  z-index: 1;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: transparent;\n  opacity: 1;\n  top: 1px;\n  left: 0px;\n  font-family: \'SFUIText-light\';\n\n\n  .loader,\n  .loader:after {\n    border-radius: 50%;\n    width: 10em;\n    height: 10em;\n  }\n  .loader {\n    margin: 0px auto;\n    font-size: 10px;\n    position: relative;\n    text-indent: -9999em;\n    border-top: 1.1em solid #eaeaea;\n    border-right: 1.1em solid #e3e3e3;\n    border-bottom: 1.1em solid #e0e0e0;\n    border-left: 1.1em solid ', ';\n    -webkit-transform: translateZ(0);\n    -ms-transform: translateZ(0);\n    transform: translateZ(0);\n    -webkit-animation: load8 1.1s infinite linear;\n    animation: load8 1.1s infinite linear;\n  }\n  @-webkit-keyframes load8 {\n    0% {\n      -webkit-transform: rotate(0deg);\n      transform: rotate(0deg);\n    }\n    100% {\n      -webkit-transform: rotate(360deg);\n      transform: rotate(360deg);\n    }\n  }\n  @keyframes load8 {\n    0% {\n      -webkit-transform: rotate(0deg);\n      transform: rotate(0deg);\n    }\n    100% {\n      -webkit-transform: rotate(360deg);\n      transform: rotate(360deg);\n    }\n  }\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 CircleLoader = function (_React$Component) {
-  _inherits(CircleLoader, _React$Component);
-
+exports["default"] = void 0;
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+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 _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 CircleLoader = /*#__PURE__*/function (_React$Component) {
   function CircleLoader(props) {
-    _classCallCheck(this, CircleLoader);
-
-    return _possibleConstructorReturn(this, (CircleLoader.__proto__ || Object.getPrototypeOf(CircleLoader)).call(this, props));
+    (0, _classCallCheck2["default"])(this, CircleLoader);
+    return _callSuper(this, CircleLoader, [props]);
   }
-
-  _createClass(CircleLoader, [{
-    key: 'render',
+  (0, _inherits2["default"])(CircleLoader, _React$Component);
+  return (0, _createClass2["default"])(CircleLoader, [{
+    key: "render",
     value: function render() {
-
-      return _react2.default.createElement(
-        LoaderBox,
-        this.props,
-        _react2.default.createElement(
-          'div',
-          null,
-          _react2.default.createElement(
-            'div',
-            { className: 'loader' },
-            'Loading...'
-          )
-        )
-      );
+      return /*#__PURE__*/_react["default"].createElement(LoaderBox, this.props, /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement("div", {
+        className: "loader"
+      }, "Loading...")));
     }
   }]);
-
-  return CircleLoader;
-}(_react2.default.Component);
-
+}(_react["default"].Component);
 var propTypes = {};
 CircleLoader.propTypes = {
   /** The visual style used to convey the label's purpose */
-  theme: _propTypes2.default.oneOf(['light', 'dark', 'nexc'])
+  theme: _propTypes["default"].oneOf(['light', 'dark', 'nexc'])
 };
-
-var LoaderBox = _styledComponents2.default.div(_templateObject, function (props) {
+var LoaderBox = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n  position: relative;\n  width: 100%;\n  height: 100%;\n  z-index: 1;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: transparent;\n  opacity: 1;\n  top: 1px;\n  left: 0px;\n  font-family: 'SFUIText-light';\n\n\n  .loader,\n  .loader:after {\n    border-radius: 50%;\n    width: 10em;\n    height: 10em;\n  }\n  .loader {\n    margin: 0px auto;\n    font-size: 10px;\n    position: relative;\n    text-indent: -9999em;\n    border-top: 1.1em solid #eaeaea;\n    border-right: 1.1em solid #e3e3e3;\n    border-bottom: 1.1em solid #e0e0e0;\n    border-left: 1.1em solid ", ";\n    -webkit-transform: translateZ(0);\n    -ms-transform: translateZ(0);\n    transform: translateZ(0);\n    -webkit-animation: load8 1.1s infinite linear;\n    animation: load8 1.1s infinite linear;\n  }\n  @-webkit-keyframes load8 {\n    0% {\n      -webkit-transform: rotate(0deg);\n      transform: rotate(0deg);\n    }\n    100% {\n      -webkit-transform: rotate(360deg);\n      transform: rotate(360deg);\n    }\n  }\n  @keyframes load8 {\n    0% {\n      -webkit-transform: rotate(0deg);\n      transform: rotate(0deg);\n    }\n    100% {\n      -webkit-transform: rotate(360deg);\n      transform: rotate(360deg);\n    }\n  }\n"])), function (props) {
   return _tokens.colors[props.theme].label.circleLoader;
 });
-
 LoaderBox.defaultProps = {};
-
 CircleLoader.defaultProps = {
   theme: 'dark'
 };
-exports.default = CircleLoader;
+var _default = exports["default"] = CircleLoader;

package/atoms/loader/ShimmerComponent/CollabShimmerCard.js

@@ -1,56 +1,45 @@
-'use strict';
+"use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-
-var _templateObject = _taggedTemplateLiteral(['\n  display: flex;\n  height: 189px;\n  width: 222px;\n  flex-direction: column;\n'], ['\n  display: flex;\n  height: 189px;\n  width: 222px;\n  flex-direction: column;\n']),
-    _templateObject2 = _taggedTemplateLiteral(['\n  position: relative;\n  top: 20px;\n  display: flex;\n  flex-direction: column;\n  gap: 5px;\n  left: 10px;\n'], ['\n  position: relative;\n  top: 20px;\n  display: flex;\n  flex-direction: column;\n  gap: 5px;\n  left: 10px;\n']);
-
-var _react = require('react');
-
-var _react2 = _interopRequireDefault(_react);
-
-var _styledComponents = require('styled-components');
-
-var _styledComponents2 = _interopRequireDefault(_styledComponents);
-
-var _Shimmer = require('./Shimmer');
-
-var _Shimmer2 = _interopRequireDefault(_Shimmer);
-
-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) } })); }
-
-var MainContainer = _styledComponents2.default.div(_templateObject);
-
-var ShimmerDivContainer = _styledComponents2.default.div(_templateObject2);
+exports["default"] = void 0;
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+var _react = _interopRequireDefault(require("react"));
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _Shimmer = _interopRequireDefault(require("./Shimmer"));
+var _templateObject, _templateObject2;
+var MainContainer = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n  display: flex;\n  height: 189px;\n  width: 222px;\n  flex-direction: column;\n"])));
+var ShimmerDivContainer = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n  position: relative;\n  top: 20px;\n  display: flex;\n  flex-direction: column;\n  gap: 5px;\n  left: 10px;\n"])));
 var CollabShimmerCard = function CollabShimmerCard() {
-  return _react2.default.createElement(
-    'div',
-    null,
-    _react2.default.createElement(
-      MainContainer,
-      null,
-      _react2.default.createElement('div', { style: { height: '124px', width: ' 100%', background: '#182738' } }),
-      _react2.default.createElement(
-        'div',
-        { style: { height: '65px', width: '100%', background: '#14202e' } },
-        _react2.default.createElement(
-          ShimmerDivContainer,
-          null,
-          _react2.default.createElement(_Shimmer2.default, { height: '12px', width: '56px' }),
-          _react2.default.createElement(
-            'div',
-            { style: { display: 'flex', flexDirection: 'row', gap: '5px' } },
-            _react2.default.createElement(_Shimmer2.default, { height: '10px', width: '27px' }),
-            _react2.default.createElement(_Shimmer2.default, { height: '10px', width: '44px' })
-          )
-        )
-      )
-    )
-  );
+  return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(MainContainer, null, /*#__PURE__*/_react["default"].createElement("div", {
+    style: {
+      height: '124px',
+      width: ' 100%',
+      background: '#182738'
+    }
+  }), /*#__PURE__*/_react["default"].createElement("div", {
+    style: {
+      height: '65px',
+      width: '100%',
+      background: '#14202e'
+    }
+  }, /*#__PURE__*/_react["default"].createElement(ShimmerDivContainer, null, /*#__PURE__*/_react["default"].createElement(_Shimmer["default"], {
+    height: "12px",
+    width: "56px"
+  }), /*#__PURE__*/_react["default"].createElement("div", {
+    style: {
+      display: 'flex',
+      flexDirection: 'row',
+      gap: '5px'
+    }
+  }, /*#__PURE__*/_react["default"].createElement(_Shimmer["default"], {
+    height: "10px",
+    width: "27px"
+  }), /*#__PURE__*/_react["default"].createElement(_Shimmer["default"], {
+    height: "10px",
+    width: "44px"
+  }))))));
 };
-
-exports.default = CollabShimmerCard;
+var _default = exports["default"] = CollabShimmerCard;

package/atoms/loader/ShimmerComponent/CollabShimmerCardTray.js

@@ -1,52 +1,51 @@
-'use strict';
+"use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-
-var _react = require('react');
-
-var _react2 = _interopRequireDefault(_react);
-
-var _CollabShimmerCard = require('./CollabShimmerCard');
-
-var _CollabShimmerCard2 = _interopRequireDefault(_CollabShimmerCard);
-
-var _Shimmer = require('./Shimmer');
-
-var _Shimmer2 = _interopRequireDefault(_Shimmer);
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
+exports["default"] = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _CollabShimmerCard = _interopRequireDefault(require("./CollabShimmerCard"));
+var _Shimmer = _interopRequireDefault(require("./Shimmer"));
 var CollabShimmerCardTray = function CollabShimmerCardTray() {
   var ShimmerCount = function ShimmerCount(_ref) {
     var count = _ref.count;
-
-    var shimmerCards = Array.from({ length: count }, function (_, index) {
-      return _react2.default.createElement(_CollabShimmerCard2.default, { key: index });
+    var shimmerCards = Array.from({
+      length: count
+    }, function (_, index) {
+      return /*#__PURE__*/_react["default"].createElement(_CollabShimmerCard["default"], {
+        key: index
+      });
     });
-    return _react2.default.createElement(
-      _react2.default.Fragment,
-      null,
-      shimmerCards
-    );
+    return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, shimmerCards);
   };
-
-  return _react2.default.createElement(
-    'div',
-    { style: { padding: '20px' } },
-    _react2.default.createElement(
-      'div',
-      { style: { height: '20px', width: '100%', display: 'flex', gap: '5px', marginBottom: '10px' } },
-      _react2.default.createElement(_Shimmer2.default, { height: '18px', width: '79px' }),
-      _react2.default.createElement(_Shimmer2.default, { height: '18px', width: '25px' })
-    ),
-    _react2.default.createElement(
-      'div',
-      { style: { display: 'flex', flexDirection: 'row', gap: '15px' } },
-      _react2.default.createElement(ShimmerCount, { count: 6 })
-    )
-  );
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    style: {
+      padding: '20px'
+    }
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    style: {
+      height: '20px',
+      width: '100%',
+      display: 'flex',
+      gap: '5px',
+      marginBottom: '10px'
+    }
+  }, /*#__PURE__*/_react["default"].createElement(_Shimmer["default"], {
+    height: "18px",
+    width: "79px"
+  }), /*#__PURE__*/_react["default"].createElement(_Shimmer["default"], {
+    height: "18px",
+    width: "25px"
+  })), /*#__PURE__*/_react["default"].createElement("div", {
+    style: {
+      display: 'flex',
+      flexDirection: 'row',
+      gap: '15px'
+    }
+  }, /*#__PURE__*/_react["default"].createElement(ShimmerCount, {
+    count: 6
+  })));
 };
-
-exports.default = CollabShimmerCardTray;
+var _default = exports["default"] = CollabShimmerCardTray;

package/atoms/loader/ShimmerComponent/FiltersShimmer.js

@@ -1,36 +1,36 @@
-'use strict';
+"use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-
-var _react = require('react');
-
-var _react2 = _interopRequireDefault(_react);
-
-var _Shimmer = require('./Shimmer');
-
-var _Shimmer2 = _interopRequireDefault(_Shimmer);
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
+exports["default"] = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _Shimmer = _interopRequireDefault(require("./Shimmer"));
 var FiltersShimmer = function FiltersShimmer() {
-  return _react2.default.createElement(
-    _react2.default.Fragment,
-    null,
-    _react2.default.createElement(
-      'div',
-      { style: { display: 'flex', flexDirection: 'column', gap: '5px' } },
-      _react2.default.createElement(_Shimmer2.default, { height: '12px', width: '40px' }),
-      _react2.default.createElement(
-        'div',
-        { style: { display: 'flex', gap: '5px' } },
-        _react2.default.createElement(_Shimmer2.default, { height: '24px', width: '119.5px' }),
-        _react2.default.createElement(_Shimmer2.default, { height: '24px', width: '119.5px' }),
-        _react2.default.createElement(_Shimmer2.default, { height: '24px', width: '29.5px' })
-      )
-    )
-  );
+  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("div", {
+    style: {
+      display: 'flex',
+      flexDirection: 'column',
+      gap: '5px'
+    }
+  }, /*#__PURE__*/_react["default"].createElement(_Shimmer["default"], {
+    height: "12px",
+    width: "40px"
+  }), /*#__PURE__*/_react["default"].createElement("div", {
+    style: {
+      display: 'flex',
+      gap: '5px'
+    }
+  }, /*#__PURE__*/_react["default"].createElement(_Shimmer["default"], {
+    height: "24px",
+    width: "119.5px"
+  }), /*#__PURE__*/_react["default"].createElement(_Shimmer["default"], {
+    height: "24px",
+    width: "119.5px"
+  }), /*#__PURE__*/_react["default"].createElement(_Shimmer["default"], {
+    height: "24px",
+    width: "29.5px"
+  }))));
 };
-
-exports.default = FiltersShimmer;
+var _default = exports["default"] = FiltersShimmer;

package/atoms/loader/ShimmerComponent/GraphDetailShimmer.js

@@ -1,40 +1,27 @@
-'use strict';
+"use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-
-var _templateObject = _taggedTemplateLiteral(['\n  height: 350px;\n  min-width: 295px;\n  border-radius: 4px;\n  background: #15212f;\n  box-shadow: 0px 12px 24px rgba(0, 0, 0, 0.1);\n  -webkit-transition: all 0.4s ease;\n  transition: all 0.4s ease;\n  position: relative;\n  overflow: hidden;\n  border-bottom: 0px solid #07d5cd;\n  max-width: 25%;\n  width: 100%;\n  margin: 0px 10px;\n'], ['\n  height: 350px;\n  min-width: 295px;\n  border-radius: 4px;\n  background: #15212f;\n  box-shadow: 0px 12px 24px rgba(0, 0, 0, 0.1);\n  -webkit-transition: all 0.4s ease;\n  transition: all 0.4s ease;\n  position: relative;\n  overflow: hidden;\n  border-bottom: 0px solid #07d5cd;\n  max-width: 25%;\n  width: 100%;\n  margin: 0px 10px;\n']);
-
-var _styledComponents = require('styled-components');
-
-var _styledComponents2 = _interopRequireDefault(_styledComponents);
-
-var _react = require('react');
-
-var _react2 = _interopRequireDefault(_react);
-
-var _Shimmer = require('./Shimmer');
-
-var _Shimmer2 = _interopRequireDefault(_Shimmer);
-
-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) } })); }
-
-var GraphDetailDiv = _styledComponents2.default.div(_templateObject);
-
-
+exports["default"] = void 0;
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _react = _interopRequireDefault(require("react"));
+var _Shimmer = _interopRequireDefault(require("./Shimmer"));
+var _templateObject;
+var GraphDetailDiv = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n  height: 350px;\n  min-width: 295px;\n  border-radius: 4px;\n  background: #15212f;\n  box-shadow: 0px 12px 24px rgba(0, 0, 0, 0.1);\n  -webkit-transition: all 0.4s ease;\n  transition: all 0.4s ease;\n  position: relative;\n  overflow: hidden;\n  border-bottom: 0px solid #07d5cd;\n  max-width: 25%;\n  width: 100%;\n  margin: 0px 10px;\n"])));
 var GraphDetailsShimmer = function GraphDetailsShimmer() {
-  return _react2.default.createElement(
-    GraphDetailDiv,
-    null,
-    _react2.default.createElement(
-      'div',
-      { style: { display: 'flex', alignItems: 'center', justifyContent: 'center', marginTop: '30px' } },
-      _react2.default.createElement(_Shimmer2.default, { height: '20px', width: '80px' })
-    )
-  );
+  return /*#__PURE__*/_react["default"].createElement(GraphDetailDiv, null, /*#__PURE__*/_react["default"].createElement("div", {
+    style: {
+      display: 'flex',
+      alignItems: 'center',
+      justifyContent: 'center',
+      marginTop: '30px'
+    }
+  }, /*#__PURE__*/_react["default"].createElement(_Shimmer["default"], {
+    height: "20px",
+    width: "80px"
+  })));
 };
-
-exports.default = GraphDetailsShimmer;
+var _default = exports["default"] = GraphDetailsShimmer;

package/atoms/loader/ShimmerComponent/GraphTitleShimmer.js

@@ -1,40 +1,36 @@
-'use strict';
+"use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-
-var _react = require('react');
-
-var _react2 = _interopRequireDefault(_react);
-
-var _Shimmer = require('./Shimmer');
-
-var _Shimmer2 = _interopRequireDefault(_Shimmer);
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
+exports["default"] = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _Shimmer = _interopRequireDefault(require("./Shimmer"));
 var GraphTitleShimmer = function GraphTitleShimmer() {
-  return _react2.default.createElement(
-    'div',
-    {
-      style: {
-        padding: '20px',
-        display: 'flex',
-        justifyContent: 'space-between',
-        alignItems: 'center'
-      } },
-    _react2.default.createElement(
-      'div',
-      { style: { width: '81.5px', height: '21px' } },
-      _react2.default.createElement(_Shimmer2.default, { height: '21px', width: '81.5' })
-    ),
-    _react2.default.createElement(
-      'div',
-      { style: { width: '71.8px', height: '18px' } },
-      _react2.default.createElement(_Shimmer2.default, { height: '18px', width: '71.8' })
-    )
-  );
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    style: {
+      padding: '20px',
+      display: 'flex',
+      justifyContent: 'space-between',
+      alignItems: 'center'
+    }
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    style: {
+      width: '81.5px',
+      height: '21px'
+    }
+  }, /*#__PURE__*/_react["default"].createElement(_Shimmer["default"], {
+    height: "21px",
+    width: "81.5"
+  })), /*#__PURE__*/_react["default"].createElement("div", {
+    style: {
+      width: '71.8px',
+      height: '18px'
+    }
+  }, /*#__PURE__*/_react["default"].createElement(_Shimmer["default"], {
+    height: "18px",
+    width: "71.8"
+  })));
 };
-
-exports.default = GraphTitleShimmer;
+var _default = exports["default"] = GraphTitleShimmer;