@stokr/components-library 2.3.0 → 2.3.1-2.1

package/dist/components/ROI/ROIPixelmatic.js

@@ -0,0 +1,356 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _reactCollapse = require("react-collapse");
+var _Grid = require("components/ui/Grid/Grid.styles");
+var _Text = _interopRequireDefault(require("components/ui/Text/Text.styles"));
+var _ComponentWrapper = _interopRequireDefault(require("components/ui/ComponentWrapper/ComponentWrapper.styles"));
+var _RangeInput = _interopRequireDefault(require("components/ui/Input/RangeInput"));
+var _ExpandButton = _interopRequireDefault(require("components/ui/ExpandButton/ExpandButton"));
+var _ROI = require("./ROI.styles");
+var _ROIScenarioBox = _interopRequireDefault(require("./ROIScenarioBox"));
+var _ROIChart = _interopRequireDefault(require("./ROIChart"));
+var _ROIModal = _interopRequireDefault(require("./ROIModal"));
+var _componentsLibrary = require("@stokr/components-library");
+var _ui = require("components/ui");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && 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; }
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a 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, _toPropertyKey(descriptor.key), descriptor); } }
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
+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 } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } 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 _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); } // import { TextButton } from 'components/ui/TextLink/TextLink.styles'
+var PANEL = {
+  FORECAST_SCENARIO: 'forecast_scenario',
+  PROFITPAYMENT_SCENARIO: 'profitpayment_scenario'
+};
+
+// let lastStoredGain, payoutCheck
+// let userCumPayout
+var ROIPixelmatic = /*#__PURE__*/function (_PureComponent) {
+  _inherits(ROIPixelmatic, _PureComponent);
+  var _super = _createSuper(ROIPixelmatic);
+  function ROIPixelmatic() {
+    var _this;
+    _classCallCheck(this, ROIPixelmatic);
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    _this = _super.call.apply(_super, [this].concat(args));
+    _defineProperty(_assertThisInitialized(_this), "state", {
+      totalInvestment: 100,
+      years: 6,
+      // Default selected years
+      extendedPanel: null,
+      forecast: 'companyScenario',
+      profitpayment: 'profitpayment01',
+      isModalOpen: false,
+      gain: null,
+      cumulativePayout: 0
+    });
+    _defineProperty(_assertThisInitialized(_this), "handleTotalInvestmentChange", function (value) {
+      _this.setState({
+        totalInvestment: value
+      });
+    });
+    _defineProperty(_assertThisInitialized(_this), "handleYearsChange", function (value) {
+      _this.setState({
+        years: value
+      });
+    });
+    _defineProperty(_assertThisInitialized(_this), "handleForecastChange", function (e) {
+      _this.setState({
+        forecast: e.target.value
+      });
+    });
+    _defineProperty(_assertThisInitialized(_this), "handleProfitpaymentChange", function (e) {
+      _this.setState({
+        profitpayment: e.target.value
+      });
+    });
+    _defineProperty(_assertThisInitialized(_this), "togglePanel", function (panelId) {
+      var extendedPanel = _this.state.extendedPanel;
+      _this.setState({
+        extendedPanel: extendedPanel !== panelId ? panelId : null
+      });
+    });
+    _defineProperty(_assertThisInitialized(_this), "toggleModal", function (isModalOpen) {
+      _this.setState({
+        isModalOpen: isModalOpen
+      });
+    });
+    _defineProperty(_assertThisInitialized(_this), "generateChartData", function () {
+      var _this$state = _this.state,
+        years = _this$state.years,
+        totalInvestment = _this$state.totalInvestment;
+
+      /* calculation variables for company scenario start */
+      var revenueForCompanyScenario = [653069, 3084549, 7796537, 15253860, 25438310, 31511615, 36698241, 42010258, 44110771, 46316309];
+      var payoutForCompanyScenario = [300000, 308455, 779654, 1525386, 2543831, 3151162, 3669824, 2921689, 441108, 463163];
+      var fullNumberOfTokens = 15000000;
+
+      /* calculation variables for company scenario end */
+
+      /* calculation variables for conservative, industry average, positive start */
+
+      var cagr = 0.094;
+      var lastValueConservative, lastValueIndustryAverage, lastValuePositive;
+      var conservativeRevenueArray = [653069, 3084549];
+      var conservativePayoutArray = [300000, 308455];
+      var industryAverageRevenueArray = [653069, 3084549];
+      var industryAveragePayoutArray = [300000, 308455];
+      var positiveRevenueArray = [653069, 3084549];
+      var positivePayoutArray = [300000, 308455];
+      if (_this.state.forecast === 'conservative') {
+        var loopVar = 2;
+        while (loopVar < 10) {
+          lastValueConservative = conservativeRevenueArray[loopVar - 1];
+          var calculateConservativeRevenue = Math.round(0.67 * cagr * lastValueConservative + lastValueConservative);
+          var calculateConservativePayout = calculateConservativeRevenue * 0.1;
+          conservativeRevenueArray.push(calculateConservativeRevenue);
+          conservativePayoutArray.push(calculateConservativePayout);
+          loopVar++;
+        }
+      }
+      if (_this.state.forecast === 'industryAverage') {
+        var _loopVar = 2;
+        while (_loopVar < 10) {
+          lastValueIndustryAverage = industryAverageRevenueArray[_loopVar - 1];
+          var calculateIndustryAverageRevenue = Math.round(cagr * lastValueIndustryAverage + lastValueIndustryAverage);
+          var calculateIndustryAveragePayout = calculateIndustryAverageRevenue * 0.1;
+          industryAverageRevenueArray.push(calculateIndustryAverageRevenue);
+          industryAveragePayoutArray.push(calculateIndustryAveragePayout);
+          _loopVar++;
+        }
+      }
+      if (_this.state.forecast === 'positive') {
+        var _loopVar2 = 2;
+        while (_loopVar2 < 10) {
+          lastValuePositive = positiveRevenueArray[_loopVar2 - 1];
+          var calculatePositiveRevenue = Math.round(1.5 * cagr * lastValuePositive + lastValuePositive);
+          var calculatePositivePayout = calculatePositiveRevenue * 0.1;
+          positiveRevenueArray.push(calculatePositiveRevenue);
+          positivePayoutArray.push(calculatePositivePayout);
+          _loopVar2++;
+        }
+      }
+      var cumulativePayout = 0;
+      var arrayResult = _toConsumableArray(Array(years).fill({})).map(function (_, index) {
+        // const factor = index >= 0 ? index : index - 1
+        var profit, gain, formattedRevenue, formattedPayout;
+        if (_this.state.forecast === 'companyScenario') {
+          formattedRevenue = (0, _componentsLibrary.km_ify)(revenueForCompanyScenario[index]);
+          formattedPayout = (0, _componentsLibrary.km_ify)(payoutForCompanyScenario[index]);
+          profit = revenueForCompanyScenario[index];
+          gain = payoutForCompanyScenario[index];
+        } else if (_this.state.forecast === 'conservative') {
+          formattedRevenue = (0, _componentsLibrary.km_ify)(conservativeRevenueArray[index]);
+          formattedPayout = (0, _componentsLibrary.km_ify)(conservativePayoutArray[index]);
+          profit = conservativeRevenueArray[index];
+          gain = conservativePayoutArray[index];
+        } else if (_this.state.forecast === 'industryAverage') {
+          formattedRevenue = (0, _componentsLibrary.km_ify)(industryAverageRevenueArray[index]);
+          formattedPayout = (0, _componentsLibrary.km_ify)(industryAveragePayoutArray[index]);
+          profit = industryAverageRevenueArray[index];
+          gain = industryAveragePayoutArray[index];
+        } else if (_this.state.forecast === 'positive') {
+          formattedRevenue = (0, _componentsLibrary.km_ify)(positiveRevenueArray[index]);
+          formattedPayout = (0, _componentsLibrary.km_ify)(positivePayoutArray[index]);
+          profit = positiveRevenueArray[index];
+          gain = positivePayoutArray[index];
+        }
+        var payoutForUser = gain / fullNumberOfTokens * totalInvestment;
+        payoutForUser = payoutForUser.toFixed(2);
+        cumulativePayout += parseFloat(payoutForUser);
+        return {
+          year: "".concat(index + 1, "y"),
+          profit: profit,
+          gain: gain,
+          tooltip: /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement(_ROI.TooltipTitle, null, "YEAR ".concat(index + 1)), /*#__PURE__*/_react.default.createElement(_ROI.TooltipContent, null, "ESTIMATED PAYOUTS: \u20AC ".concat(formattedPayout), /*#__PURE__*/_react.default.createElement("br", null), "ESTIMATED REVENUE: \u20AC ".concat(formattedRevenue), /*#__PURE__*/_react.default.createElement("br", null), "PAYOUT FOR YOU: \u20AC ".concat(payoutForUser)))
+        };
+      });
+      return {
+        arrayResult: arrayResult,
+        cumulativePayout: cumulativePayout.toFixed(2)
+      };
+    });
+    return _this;
+  }
+  _createClass(ROIPixelmatic, [{
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      var chartData = this.generateChartData();
+      this.setState({
+        chartData: chartData.arrayResult,
+        cumulativePayout: chartData.cumulativePayout
+      });
+    }
+  }, {
+    key: "componentDidUpdate",
+    value: function componentDidUpdate(prevProps, prevState) {
+      var _this$state2 = this.state,
+        years = _this$state2.years,
+        totalInvestment = _this$state2.totalInvestment,
+        forecast = _this$state2.forecast;
+      if (prevState.years !== years || prevState.totalInvestment !== totalInvestment || prevState.forecast !== forecast) {
+        var chartData = this.generateChartData();
+        this.setState({
+          chartData: chartData.arrayResult,
+          cumulativePayout: chartData.cumulativePayout
+        });
+      }
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _this2 = this;
+      var _this$state3 = this.state,
+        totalInvestment = _this$state3.totalInvestment,
+        years = _this$state3.years,
+        extendedPanel = _this$state3.extendedPanel,
+        forecast = _this$state3.forecast,
+        isModalOpen = _this$state3.isModalOpen,
+        chartData = _this$state3.chartData,
+        cumulativePayout = _this$state3.cumulativePayout;
+      var companyScenarioCumPayout = [300000, 608455, 1388109, 2913495, 5457326, 8608488, 12278312, 15200001, 15641109, 16104272];
+      var conservativeCumPayout = [300000, 608455, 936336, 1284868, 1655350, 2049164, 2467782, 2912763, 3385770, 3888567];
+      var industryAverageCumPayout = [300000, 608455, 945905, 1315074, 1718946, 2160782, 2644151, 3172956, 3751468, 4384361];
+      var positiveCumPayout = [300000, 608455, 960402, 1361974, 1820167, 2342965, 2939478, 3620099, 4396688, 5282776];
+      var cumTotalPayout;
+      if (this.state.forecast === 'companyScenario') {
+        cumTotalPayout = (0, _componentsLibrary.km_ify)(Math.round(companyScenarioCumPayout[years - 1]));
+      } else if (this.state.forecast === 'conservative') {
+        cumTotalPayout = (0, _componentsLibrary.km_ify)(Math.round(conservativeCumPayout[years - 1]));
+      } else if (this.state.forecast === 'industryAverage') {
+        cumTotalPayout = (0, _componentsLibrary.km_ify)(Math.round(industryAverageCumPayout[years - 1]));
+      } else if (this.state.forecast === 'positive') {
+        cumTotalPayout = (0, _componentsLibrary.km_ify)(Math.round(positiveCumPayout[years - 1]));
+      }
+      return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement(_Grid.Row, {
+        style: {
+          width: '100%'
+        }
+      }, /*#__PURE__*/_react.default.createElement(_Grid.Column, {
+        part: 7,
+        style: {
+          width: '50%'
+        },
+        roiColumn: true
+      }, /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, null, /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
+        noPaddingHorizontal: true
+      }, /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
+        noPaddingTop: true,
+        noPaddingHorizontal: true
+      }, /*#__PURE__*/_react.default.createElement(_Text.default, null, /*#__PURE__*/_react.default.createElement(_ROI.Title, null, "Return on investment tool"), /*#__PURE__*/_react.default.createElement(_ui.RichText, {
+        style: {
+          paddingLeft: '56px'
+        }
+      }, "Gain a basic understanding of how an investment could possibly develop. This data and estimations are provided by Infinite Fleet. For your safety\u2019s sake, always make your own calculations."))), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
+        noPaddingHorizontal: true
+      }, /*#__PURE__*/_react.default.createElement(_ROI.Label, null, "YOUR INVESTMENT"), /*#__PURE__*/_react.default.createElement(_ROI.Value, null, "\u20AC ".concat(totalInvestment)), /*#__PURE__*/_react.default.createElement(_RangeInput.default, {
+        id: "totalInvestmentRange",
+        name: "totalInvestmentRange",
+        value: totalInvestment,
+        min: 100,
+        max: 100000,
+        step: 100,
+        onChange: this.handleTotalInvestmentChange
+      })), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
+        noPaddingTop: true,
+        noPaddingHorizontal: true
+      }, /*#__PURE__*/_react.default.createElement(_ROI.Label, null, "Years"), /*#__PURE__*/_react.default.createElement(_ROI.Value, null, years), /*#__PURE__*/_react.default.createElement(_RangeInput.default, {
+        id: "yearsRange",
+        name: "yearsRange",
+        value: years,
+        min: 1,
+        max: 10,
+        onChange: this.handleYearsChange
+      })))), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
+        noPadding: true,
+        borderTop: true
+      }, /*#__PURE__*/_react.default.createElement(_ExpandButton.default, {
+        title: "FORECAST SCENARIO",
+        textLeft: true,
+        isOpened: extendedPanel === PANEL.FORECAST_SCENARIO,
+        onClick: function onClick() {
+          return _this2.togglePanel(PANEL.FORECAST_SCENARIO);
+        }
+      }), /*#__PURE__*/_react.default.createElement(_reactCollapse.Collapse, {
+        isOpened: extendedPanel === PANEL.FORECAST_SCENARIO
+      }, /*#__PURE__*/_react.default.createElement(_ROI.TabContainer, {
+        borderTop: true
+      }, /*#__PURE__*/_react.default.createElement(_ROIScenarioBox.default, {
+        title: "Company Scenario",
+        subtitle: "Earnings forecast",
+        tooltip: "Revenues that Infinite Fleet forecasts",
+        radio: {
+          id: 'companyScenario',
+          value: 'companyScenario',
+          name: 'roiForecast',
+          checked: forecast === 'companyScenario',
+          onChange: this.handleForecastChange
+        }
+      }))))), /*#__PURE__*/_react.default.createElement(_Grid.Column, {
+        part: 9,
+        withBorder: true,
+        style: {
+          width: '50%'
+        },
+        roiColumn: true
+      }, /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
+        style: {
+          paddingBottom: '5rem'
+        }
+      }, /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
+        noPaddingHorizontal: true
+      }, chartData && /*#__PURE__*/_react.default.createElement(_ROIChart.default, {
+        id: "roichart",
+        data: chartData
+      })), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
+        noPaddingHorizontal: true,
+        noPaddingTop: true
+      }, /*#__PURE__*/_react.default.createElement(_ROI.Label, null, "INVESTMENT RESULTS"), /*#__PURE__*/_react.default.createElement(_ROI.ROIItemsRow, null, /*#__PURE__*/_react.default.createElement(_Grid.Column, {
+        part: 1,
+        full: 3
+      }, /*#__PURE__*/_react.default.createElement(_ROI.ROIItemContainer, null, /*#__PURE__*/_react.default.createElement(_ROI.ROIItemTitle, null, "CUMULATIVE PAYOUT FOR YOU"), /*#__PURE__*/_react.default.createElement(_ROI.ROIItemContent, null, cumulativePayout ? '€ ' + cumulativePayout : '-'))), /*#__PURE__*/_react.default.createElement(_Grid.Column, {
+        part: 1,
+        full: 3
+      }, /*#__PURE__*/_react.default.createElement(_ROI.ROIItemContainer, null, /*#__PURE__*/_react.default.createElement(_ROI.ROIItemTitle, null, "CUMULATIVE TOTAL PAYOUT"), /*#__PURE__*/_react.default.createElement(_ROI.ROIItemContent, null, "\u20AC ", cumTotalPayout))))), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
+        noPadding: true
+      }, /*#__PURE__*/_react.default.createElement(_ui.OutUrl, {
+        url: "/roi",
+        onClick: function onClick() {
+          return _this2.toggleModal(true);
+        }
+      }, "CHECK HOW WE CALCULATE THIS"))))), /*#__PURE__*/_react.default.createElement(_ROIModal.default, {
+        isModalOpen: isModalOpen,
+        onModalClose: function onModalClose() {
+          return _this2.toggleModal(false);
+        }
+      }));
+    }
+  }]);
+  return ROIPixelmatic;
+}(_react.PureComponent);
+var _default = ROIPixelmatic;
+exports.default = _default;

package/dist/components/SigningSubflow/index.js

@@ -3,18 +3,6 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-Object.defineProperty(exports, "SignSubConnectLedger", {
-  enumerable: true,
-  get: function get() {
-    return _SignSubConnectLedger.default;
-  }
-});
-Object.defineProperty(exports, "SignSubConnectMetamask", {
-  enumerable: true,
-  get: function get() {
-    return _SignSubConnectMetamask.default;
-  }
-});
 Object.defineProperty(exports, "SignSubInfo", {
   enumerable: true,
   get: function get() {
@@ -27,36 +15,12 @@ Object.defineProperty(exports, "SignSubIntro", {
     return _SignSubIntro.default;
   }
 });
-Object.defineProperty(exports, "SignSubSendLedger", {
-  enumerable: true,
-  get: function get() {
-    return _SignSubSendLedger.default;
-  }
-});
-Object.defineProperty(exports, "SignSubSendMetamask", {
-  enumerable: true,
-  get: function get() {
-    return _SignSubSendMetamask.default;
-  }
-});
 Object.defineProperty(exports, "SignSubStep", {
   enumerable: true,
   get: function get() {
     return _styles.SignSubStep;
   }
 });
-Object.defineProperty(exports, "SignSubTransactionLedger", {
-  enumerable: true,
-  get: function get() {
-    return _SignSubTransactionLedger.default;
-  }
-});
-Object.defineProperty(exports, "SignSubTransactionMetamask", {
-  enumerable: true,
-  get: function get() {
-    return _SignSubTransactionMetamask.default;
-  }
-});
 Object.defineProperty(exports, "SignSubWrapper", {
   enumerable: true,
   get: function get() {
@@ -64,11 +28,5 @@ Object.defineProperty(exports, "SignSubWrapper", {
   }
 });
 var _SignSubIntro = _interopRequireDefault(require("./SignSubIntro"));
-var _SignSubConnectLedger = _interopRequireDefault(require("./SignSubConnectLedger"));
-var _SignSubConnectMetamask = _interopRequireDefault(require("./SignSubConnectMetamask"));
-var _SignSubTransactionLedger = _interopRequireDefault(require("./SignSubTransactionLedger"));
-var _SignSubTransactionMetamask = _interopRequireDefault(require("./SignSubTransactionMetamask"));
-var _SignSubSendLedger = _interopRequireDefault(require("./SignSubSendLedger"));
-var _SignSubSendMetamask = _interopRequireDefault(require("./SignSubSendMetamask"));
 var _styles = require("./_styles");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/dist/components/StepsProgress/StepsProgress.styles.js

@@ -28,7 +28,7 @@ exports.Items = Items;
 var Item = _styledComponents.default.button.withConfig({
   displayName: "StepsProgressstyles__Item",
   componentId: "sc-1gnllve-3"
-})(["position:relative;display:inline-block;vertical-align:middle;padding:0;flex:1;margin:0 4px;height:32px;max-width:32px;cursor:pointer;&:before{z-index:0;content:'';display:block;width:100%;height:4px;position:absolute;top:14px;left:0;border-radius:3px;box-shadow:inset 0 1px 3px 0 rgba(0,0,0,0.05);background-color:", ";}&:after{z-index:1;content:'';display:block;width:100%;height:4px;position:absolute;top:14px;left:0;border-radius:3px;background-color:transparent;transition:background-color .2s;}&:focus{outline:none;}&:hover:after{background-color:", ";}", " ", " ", ""], _colors.default.grey, _colors.default.black, function (props) {
+})(["position:relative;display:inline-block;vertical-align:middle;padding:0;flex:1;margin:0 4px;height:32px;max-width:32px;cursor:pointer;&:before{z-index:0;content:'';display:block;width:100%;height:4px;position:absolute;top:14px;left:0;border-radius:3px;box-shadow:inset 0 1px 3px 0 rgba(0,0,0,0.05);background-color:", ";}&:after{z-index:1;content:'';display:block;width:100%;height:4px;position:absolute;top:14px;left:0;border-radius:3px;background-color:transparent;transition:background-color 0.2s;}&:focus{outline:none;}&:hover:after{background-color:", ";}", " ", " ", ""], _colors.default.lightGrey, _colors.default.black, function (props) {
   return props.isDone && "\n    &:after {\n      background-color: ".concat(_colors.default.progressGreen, ";\n    }\n\n    &:hover:after {\n      background-color: ").concat(_colors.default.black, ";\n    }\n  ");
 }, function (props) {
   return props.isActive && "\n    &:after {\n      background-color: ".concat(_colors.default.grey2, ";\n    }\n\n    &:hover:after {\n      background-color: ").concat(_colors.default.black, ";\n    }\n  ");

package/dist/components/StokrLoader/StokrLoader.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.StokrLoader = StokrLoader;
-exports.loaderGif = exports.default = void 0;
+exports.loaderGif = exports.default = exports.StokrLoaderBox = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
 var _media = _interopRequireDefault(require("./media"));
@@ -17,16 +17,33 @@ function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(
 // Render a new image everytime, avoiding jump on the spinning
 var loaderGif = "https://res.cloudinary.com/stokr/image/upload/f_auto,q_auto/v1575035788/Static/stokr_loader_white_400x400_egnhgb.gif?a=".concat(Math.random());
 exports.loaderGif = loaderGif;
+var CenterFullWidth = _styledComponents.default.div.withConfig({
+  displayName: "StokrLoader__CenterFullWidth",
+  componentId: "sc-1chowhw-0"
+})(["width:100%;height:100%;display:flex;align-items:center;justify-content:center;"]);
 function StokrLoader() {
   var fadeIn = (0, _styledComponents.keyframes)(["0%{opacity:0;}60%{opacity:1;}100%{opacity:1;}"]);
   var StyledStokrLoader = _styledComponents.default.div.withConfig({
     displayName: "StokrLoader__StyledStokrLoader",
-    componentId: "sc-1chowhw-0"
-  })(["align-items:center;animation:", " 1.8s ease-in-out forwards;background:rgb(254,254,254);display:flex;height:100vh;justify-content:center;left:0;position:fixed;top:0;width:100vw;z-index:1000;", ";", ";", ";"], fadeIn, _media.default.mobileS(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    img {\n      height: 15rem;\n      width: 15rem;\n    }\n  "]))), _media.default.mobile(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    img {\n      height: 18rem;\n      width: 18rem;\n    }\n  "]))), _media.default.tablet(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    img {\n      height: 30rem;\n      width: 30rem;\n    }\n  "]))));
+    componentId: "sc-1chowhw-1"
+  })(["align-items:center;animation:", " 1.8s ease-in-out forwards;background:rgb(254,254,254);display:flex;height:100vh;justify-content:center;left:0;position:fixed;top:0;width:100vw;z-index:1000;", " ", ";", ";", ";"], fadeIn, function (_ref) {
+    var noFullscreen = _ref.noFullscreen;
+    return noFullscreen && "\n      height: calc(100vh - 97px);\n      bottom: 0;\n      top: unset;\n    ";
+  }, _media.default.mobileS(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    img {\n      height: 15rem;\n      width: 15rem;\n    }\n  "]))), _media.default.mobile(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    img {\n      height: 18rem;\n      width: 18rem;\n    }\n  "]))), _media.default.tablet(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    img {\n      height: 30rem;\n      width: 30rem;\n    }\n  "]))));
   return /*#__PURE__*/_react.default.createElement(StyledStokrLoader, null, /*#__PURE__*/_react.default.createElement("img", {
     src: loaderGif,
     alt: "\xA0"
   }));
 }
+var StokrLoaderBox = function StokrLoaderBox(_ref2) {
+  var noFullscreen = _ref2.noFullscreen;
+  return /*#__PURE__*/_react.default.createElement(CenterFullWidth, {
+    noFullscreen: noFullscreen
+  }, /*#__PURE__*/_react.default.createElement("img", {
+    src: loaderGif,
+    alt: "\xA0"
+  }));
+};
+exports.StokrLoaderBox = StokrLoaderBox;
 var _default = StokrLoader;
 exports.default = _default;

package/dist/components/SvgIcons/SocialFacebook.js

@@ -6,20 +6,25 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-var SocialFacebook = function SocialFacebook() {
-  return /*#__PURE__*/_react.default.createElement("svg", {
-    version: "1.1",
-    xmlns: "http://www.w3.org/2000/svg",
-    viewBox: "0 0 12 12",
-    width: "12",
-    height: "12",
-    style: {
-      width: '12px',
-      height: '12px'
-    }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : 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 SocialFacebook = function SocialFacebook(props) {
+  return /*#__PURE__*/_react.default.createElement("svg", _extends({
+    viewBox: "0 0 933.33331 933.33331"
+  }, props), /*#__PURE__*/_react.default.createElement("g", {
+    transform: "matrix(1.3333333,0,0,-1.3333333,0,933.33333)"
+  }, /*#__PURE__*/_react.default.createElement("g", {
+    clipPath: "url(#clipPath16)"
+  }, /*#__PURE__*/_react.default.createElement("g", {
+    transform: "translate(600,350)"
   }, /*#__PURE__*/_react.default.createElement("path", {
-    d: "M11.338,0H.662A.662.662,0,0,0,0,.662V11.338A.662.662,0,0,0,.662,12H6.414V7.359H4.852V5.543H6.414V4.206a2.183,2.183,0,0,1,2.33-2.394,13.283,13.283,0,0,1,1.394.07V3.5H9.186c-.753,0-.9.356-.9.881V5.541h1.8L9.852,7.357H8.276V12h3.062A.662.662,0,0,0,12,11.338V.662A.662.662,0,0,0,11.338,0Z"
-  }));
+    d: "m 0,0 c 0,138.071 -111.929,250 -250,250 -138.071,0 -250,-111.929 -250,-250 0,-117.245 80.715,-215.622 189.606,-242.638 v 166.242 h -51.552 V 0 h 51.552 v 32.919 c 0,85.092 38.508,124.532 122.048,124.532 15.838,0 43.167,-3.105 54.347,-6.211 V 81.986 c -5.901,0.621 -16.149,0.932 -28.882,0.932 -40.993,0 -56.832,-15.528 -56.832,-55.9 V 0 h 81.659 l -14.028,-76.396 h -67.631 V -248.169 C -95.927,-233.218 0,-127.818 0,0",
+    fill: "#0866ff"
+  })), /*#__PURE__*/_react.default.createElement("g", {
+    transform: "translate(447.9175,273.6036)"
+  }, /*#__PURE__*/_react.default.createElement("path", {
+    d: "M 0,0 14.029,76.396 H -67.63 v 27.019 c 0,40.372 15.838,55.899 56.831,55.899 12.733,0 22.981,-0.31 28.882,-0.931 v 69.253 c -11.18,3.106 -38.509,6.212 -54.347,6.212 -83.539,0 -122.048,-39.441 -122.048,-124.533 V 76.396 h -51.552 V 0 h 51.552 v -166.242 c 19.343,-4.798 39.568,-7.362 60.394,-7.362 10.254,0 20.358,0.632 30.288,1.831 L -67.63,0 Z",
+    fill: "#ffffff"
+  })))));
 };
 var _default = SocialFacebook;
 exports.default = _default;

package/dist/components/SvgIcons/SocialLinkedIn.js

@@ -6,19 +6,29 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-var SocialLinkedIn = function SocialLinkedIn() {
-  return /*#__PURE__*/_react.default.createElement("svg", {
-    version: "1.1",
-    xmlns: "http://www.w3.org/2000/svg",
-    viewBox: "0 0 12 12",
-    width: "12",
-    height: "12",
-    style: {
-      width: '12px',
-      height: '12px'
-    }
-  }, /*#__PURE__*/_react.default.createElement("path", {
-    d: "m6.7205 11.596h-2.5675v-0.12089c0.00963-2.038 0.027815-6.8468 0-7.4244h2.5675v1.0698l-0.00749 0.00963-0.00963 0.013907h0.017117v-0.025677a2.5504 2.5504 0 0 1 2.3183-1.2463c1.854 0 2.9612 1.2699 2.9612 3.3956v4.3263h-2.5675v-4.0364c0-1.1158-0.45039-1.7063-1.3041-1.7063a1.425 1.425 0 0 0-1.3191 0.91789 1.6047 1.6047 0 0 0-0.085584 0.61193v4.214zm-3.9957 0h-2.5718v-7.5475h2.5675v7.5443zm-1.2838-8.5745h-0.019256a1.3223 1.3223 0 0 1-1.4218-1.3062 1.3255 1.3255 0 0 1 1.456-1.3041 1.3212 1.3212 0 0 1 1.4378 1.3041 1.3255 1.3255 0 0 1-1.4549 1.3041z"
+function _extends() { _extends = Object.assign ? Object.assign.bind() : 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 SocialLinkedIn = function SocialLinkedIn(props) {
+  return /*#__PURE__*/_react.default.createElement("svg", _extends({
+    viewBox: "7.025 7.025 497.951 497.951",
+    width: 32,
+    height: 32
+  }, props), /*#__PURE__*/_react.default.createElement("defs", null, /*#__PURE__*/_react.default.createElement("linearGradient", {
+    id: "a",
+    gradientUnits: "userSpaceOnUse",
+    x1: "-974.482",
+    y1: "1306.773",
+    x2: "-622.378",
+    y2: "1658.877",
+    gradientTransform: "translate(1054.43 -1226.825)"
+  }, /*#__PURE__*/_react.default.createElement("stop", {
+    offset: "0",
+    stopColor: "#2489be"
+  }), /*#__PURE__*/_react.default.createElement("stop", {
+    offset: "1",
+    stopColor: "#0575b3"
+  }))), /*#__PURE__*/_react.default.createElement("path", {
+    d: "M256 7.025C118.494 7.025 7.025 118.494 7.025 256S118.494 504.975 256 504.975 504.976 393.506 504.976 256C504.975 118.494 393.504 7.025 256 7.025zm-66.427 369.343h-54.665V199.761h54.665v176.607zM161.98 176.633c-17.853 0-32.326-14.591-32.326-32.587 0-17.998 14.475-32.588 32.326-32.588s32.324 14.59 32.324 32.588c.001 17.997-14.472 32.587-32.324 32.587zm232.45 199.735h-54.4v-92.704c0-25.426-9.658-39.619-29.763-39.619-21.881 0-33.312 14.782-33.312 39.619v92.704h-52.43V199.761h52.43v23.786s15.771-29.173 53.219-29.173c37.449 0 64.257 22.866 64.257 70.169l-.001 111.825z",
+    fill: "url(#a)"
   }));
 };
 var _default = SocialLinkedIn;

package/dist/components/SvgIcons/SocialTelegram.js

@@ -6,20 +6,54 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-var SocialTelegram = function SocialTelegram() {
-  return /*#__PURE__*/_react.default.createElement("svg", {
-    version: "1.1",
-    xmlns: "http://www.w3.org/2000/svg",
-    viewBox: "0 0 12 12",
-    width: "12",
-    height: "12",
-    style: {
-      width: '12px',
-      height: '12px'
-    }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : 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 SocialTelegram = function SocialTelegram(props) {
+  return /*#__PURE__*/_react.default.createElement("svg", _extends({
+    viewBox: "0 0 240 240"
+  }, props), /*#__PURE__*/_react.default.createElement("defs", null, /*#__PURE__*/_react.default.createElement("linearGradient", {
+    id: "path2995-1-0_1_",
+    gradientUnits: "userSpaceOnUse",
+    x1: "-683.305",
+    y1: "534.845",
+    x2: "-693.305",
+    y2: "511.512",
+    gradientTransform: "matrix(6 0 0 -6 4255 3247)"
+  }, /*#__PURE__*/_react.default.createElement("stop", {
+    offset: "0",
+    stopColor: "#37aee2"
+  }), /*#__PURE__*/_react.default.createElement("stop", {
+    offset: "1",
+    stopColor: "#1e96c8"
+  })), /*#__PURE__*/_react.default.createElement("linearGradient", {
+    id: "path2991_1_",
+    gradientUnits: "userSpaceOnUse",
+    x1: "128.991",
+    y1: "118.245",
+    x2: "153.991",
+    y2: "78.245",
+    gradientTransform: "matrix(1 0 0 -1 0 242)"
+  }, /*#__PURE__*/_react.default.createElement("stop", {
+    offset: "0",
+    stopColor: "#eff7fc"
+  }), /*#__PURE__*/_react.default.createElement("stop", {
+    offset: "1",
+    stopColor: "#ffffff"
+  }))), /*#__PURE__*/_react.default.createElement("g", {
+    fill: "none",
+    fillRule: "evenodd"
   }, /*#__PURE__*/_react.default.createElement("path", {
-    d: "m9.5367 11.136a0.58633 0.58633 0 0 1-0.34559-0.11342c-0.97794-0.7158-2.7252-2.0329-2.799-2.0853l-1.5482 1.5001a0.42798 0.42798 0 0 1-0.40658 0.107 0.44831 0.44831 0 0 1-0.30173-0.29531c-0.36806-1.116-1.07-3.304-1.1042-3.3971-0.00535 0-1.5568-0.50716-2.738-0.86987a0.42798 0.42798 0 0 1-0.024609-0.80353c1.3567-0.51572 3.7106-1.4198 5.9917-2.2929h0.00642c2.1506-0.82493 4.1814-1.6049 5.201-1.9923a0.38839 0.38839 0 0 1 0.13481-0.028889 0.39481 0.39481 0 0 1 0.25786 0.097366 0.40444 0.40444 0 0 1 0.13054 0.38946c-0.19152 0.92765-0.53498 2.6299-0.89662 4.4328-0.37555 1.8692-0.76395 3.8026-0.98757 4.8811a0.59061 0.59061 0 0 1-0.36164 0.42798 0.57242 0.57242 0 0 1-0.20864 0.0428zm0.17226-8.4933a0.13909 0.13909 0 0 0-0.075967 0.022469l-5.9479 3.901 0.83991 2.845 0.18617-1.8061 5.094-4.7142a0.14551 0.14551 0 0 0 0.016049-0.19366 0.13802 0.13802 0 0 0-0.11128-0.054567z"
-  }));
+    d: "M240 120c0 66.3-53.7 120-120 120S0 186.3 0 120 53.7 0 120 0s120 53.7 120 120z",
+    fill: "url(#path2995-1-0_1_)"
+  }), /*#__PURE__*/_react.default.createElement("path", {
+    d: "M98 175c-3.9 0-3.2-1.5-4.6-5.2L82 132.2 152.8 88l8.3 2.2-6.9 18.8L98 175z",
+    fill: "#c8daea"
+  }), /*#__PURE__*/_react.default.createElement("path", {
+    d: "M98 175c3 0 4.3-1.4 6-3 2.6-2.5 36-35 36-35l-20.5-5-19 12-2.5 30v1z",
+    fill: "#a9c9dd"
+  }), /*#__PURE__*/_react.default.createElement("path", {
+    d: "M100 144.4l48.4 35.7c5.5 3 9.5 1.5 10.9-5.1L179 82.2c2-8.1-3.1-11.7-8.4-9.3L55 117.5c-7.9 3.2-7.8 7.6-1.4 9.5l29.7 9.3L152 93c3.2-2 6.2-.9 3.8 1.3L100 144.4z",
+    fill: "url(#path2991_1_)"
+  })));
 };
 var _default = SocialTelegram;
 exports.default = _default;