@rabbitio/ui-kit 1.0.0-beta.84 → 1.0.0-beta.85

package/dist/index.umd.js

@@ -2,12 +2,12 @@
 	typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react'), require('react-transition-group'), require('react-animate-height'), require('resize-observer-polyfill'), require('body-scroll-lock'), require('animated-scroll-to'), require('clipboard-copy'), require('bignumber.js'), require('react-textarea-autosize'), require('qrcode'), require('axios'), require('eventbusjs'), require('jshashes'), require('uuid')) :
 	typeof define === 'function' && define.amd ? define(['exports', 'react', 'react-transition-group', 'react-animate-height', 'resize-observer-polyfill', 'body-scroll-lock', 'animated-scroll-to', 'clipboard-copy', 'bignumber.js', 'react-textarea-autosize', 'qrcode', 'axios', 'eventbusjs', 'jshashes', 'uuid'], factory) :
 	(global = global || self, factory(global.uiKit = {}, global.react, global.reactTransitionGroup, global.reactAnimateHeight, global.resizeObserverPolyfill, global.bodyScrollLock, global.animatedScrollTo, global.clipboardCopy, global.bignumber_js, global.reactTextareaAutosize, global.qrcode, global.axios, global.eventbusjs, global.jshashes, global.uuid));
-})(this, (function (exports, React, reactTransitionGroup, AnimateHeight, ResizeObserver, bodyScrollLock, animateScrollTo, copy, bignumber_js, TextareaAutosize, QRCode, axios, EventBusInstance, Hashes, uuid) {
+})(this, (function (exports, React, reactTransitionGroup, AnimateHeight, ResizeObserver$1, bodyScrollLock, animateScrollTo, copy, bignumber_js, TextareaAutosize, QRCode, axios, EventBusInstance, Hashes, uuid) {
 	function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 	var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 	var AnimateHeight__default = /*#__PURE__*/_interopDefaultLegacy(AnimateHeight);
-	var ResizeObserver__default = /*#__PURE__*/_interopDefaultLegacy(ResizeObserver);
+	var ResizeObserver__default = /*#__PURE__*/_interopDefaultLegacy(ResizeObserver$1);
 	var animateScrollTo__default = /*#__PURE__*/_interopDefaultLegacy(animateScrollTo);
 	var copy__default = /*#__PURE__*/_interopDefaultLegacy(copy);
 	var TextareaAutosize__default = /*#__PURE__*/_interopDefaultLegacy(TextareaAutosize);
@@ -7040,8 +7040,8 @@
 	    setIsListFull: setIsListFull,
 	    setIsSearchResultEmpty: setIsSearchResultEmpty,
 	    triggerLoadMoreCoins: triggerLoadMoreCoins,
-	    coinsList: allCoins,
-	    coinsBundle: allCoins.map(function (coin, index) {
+	    coinsList: coins,
+	    coinsBundle: coins == null ? void 0 : coins.map(function (coin, index) {
 	      return {
 	        coin: coin,
 	        component: function component() {
@@ -7582,7 +7582,7 @@
 	  translations: PropTypes.object
 	};
 
-	var s = {"logo-carousel":"_CgRBd","logo-carousel-slide":"_hIh2D","slide":"_Gu7XN"};
+	var s = {"logo-carousel":"_CgRBd","logo-carousel-wrapper":"_cVsiX","slide":"_Gu7XN","logo-carousel-slide":"_hIh2D","clickable":"_VuuGX","easeIn":"_i56By"};
 
 	/**
 	 * LogoCarousel component renders a set of logos in a sliding carousel.
@@ -7593,9 +7593,38 @@
 	 * @param {Array<{logo: string, url: string}>} props.logos - Array of objects representing logos and their corresponding URLs.
 	 */
 	var LogoCarousel = function LogoCarousel(_ref) {
+	  var _wrapperRef$current;
 	  var logos = _ref.logos;
+	  var _useState = React.useState(),
+	    multiplier = _useState[0],
+	    setMultiplier = _useState[1];
+	  var _useState2 = React.useState(0),
+	    width = _useState2[0],
+	    setWidth = _useState2[1];
+	  var wrapperRef = React.useRef();
+	  React.useEffect(function () {
+	    var resizeObserver = new ResizeObserver(function (entries) {
+	      return entries.map(function (entry) {
+	        return setWidth(entry.contentRect.width);
+	      });
+	    });
+	    if (wrapperRef.current) resizeObserver.observe(wrapperRef.current);
+	    return function () {
+	      if (wrapperRef.current) resizeObserver.unobserve(wrapperRef.current);
+	    };
+	  }, []);
+	  React.useEffect(function () {
+	    setMultiplier(wrapperRef.current.clientWidth / 120);
+	    // eslint-disable-next-line react-hooks/exhaustive-deps
+	  }, [wrapperRef, wrapperRef == null || (_wrapperRef$current = wrapperRef.current) == null ? void 0 : _wrapperRef$current.clientWidth, logos, width]);
 	  return /*#__PURE__*/React__default["default"].createElement("div", {
 	    className: s["logo-carousel"]
+	  }, /*#__PURE__*/React__default["default"].createElement("div", {
+	    className: s["logo-carousel-wrapper"],
+	    ref: wrapperRef,
+	    style: {
+	      animationDuration: multiplier + "s"
+	    }
 	  }, [].concat(Array(2)).map(function (z, i) {
 	    return /*#__PURE__*/React__default["default"].createElement("div", {
 	      className: s["logo-carousel-slide"],
@@ -7603,14 +7632,15 @@
 	    }, logos.map(function (item, index) {
 	      return /*#__PURE__*/React__default["default"].createElement("a", {
 	        key: "logo-carousel-slide-" + i + "-" + index,
-	        href: item.url,
+	        className: item != null && item.url ? s["clickable"] : null,
+	        href: item == null ? void 0 : item.url,
 	        target: "_blank"
 	      }, /*#__PURE__*/React__default["default"].createElement("img", {
 	        src: item.logo,
 	        alt: "logo"
 	      }));
 	    }));
-	  }));
+	  })));
 	};
 	LogoCarousel.propTypes = {
 	  logos: PropTypes.arrayOf(PropTypes.shape({