@titaui/pc 1.11.4-1 → 1.11.4-2

package/es/components/scrollbar/simplebar/simplebar.js

@@ -1,852 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = void 0;
-
-var _lodash = _interopRequireDefault(require("lodash.throttle"));
-
-var _lodash2 = _interopRequireDefault(require("lodash.debounce"));
-
-var _lodash3 = _interopRequireDefault(require("lodash.memoize"));
-
-var _resizeObserverPolyfill = _interopRequireDefault(require("resize-observer-polyfill"));
-
-var _canUseDom = _interopRequireDefault(require("can-use-dom"));
-
-var _scrollbarWidth = _interopRequireDefault(require("./scrollbar-width"));
-
-var _helpers = require("./helpers");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
-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, 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; }
-
-var SimpleBar = /*#__PURE__*/function () {
-  function SimpleBar(element, options) {
-    var _this = this;
-
-    _classCallCheck(this, SimpleBar);
-
-    this.onScroll = function () {
-      var elWindow = (0, _helpers.getElementWindow)(_this.el);
-
-      if (!_this.scrollXTicking) {
-        elWindow.requestAnimationFrame(_this.scrollX);
-        _this.scrollXTicking = true;
-      }
-
-      if (!_this.scrollYTicking) {
-        elWindow.requestAnimationFrame(_this.scrollY);
-        _this.scrollYTicking = true;
-      }
-    };
-
-    this.scrollX = function () {
-      if (_this.axis.x.isOverflowing) {
-        _this.showScrollbar("x");
-
-        _this.positionScrollbar("x");
-      }
-
-      _this.scrollXTicking = false;
-    };
-
-    this.scrollY = function () {
-      if (_this.axis.y.isOverflowing) {
-        _this.showScrollbar("y");
-
-        _this.positionScrollbar("y");
-      }
-
-      _this.scrollYTicking = false;
-    };
-
-    this.onMouseEnter = function () {
-      _this.showScrollbar("x");
-
-      _this.showScrollbar("y");
-    };
-
-    this.onMouseMove = function (e) {
-      _this.mouseX = e.clientX;
-      _this.mouseY = e.clientY;
-
-      if (_this.axis.x.isOverflowing || _this.axis.x.forceVisible) {
-        _this.onMouseMoveForAxis("x");
-      }
-
-      if (_this.axis.y.isOverflowing || _this.axis.y.forceVisible) {
-        _this.onMouseMoveForAxis("y");
-      }
-    };
-
-    this.onMouseLeave = function () {
-      _this.onMouseMove.cancel();
-
-      if (_this.axis.x.isOverflowing || _this.axis.x.forceVisible) {
-        _this.onMouseLeaveForAxis("x");
-      }
-
-      if (_this.axis.y.isOverflowing || _this.axis.y.forceVisible) {
-        _this.onMouseLeaveForAxis("y");
-      }
-
-      _this.mouseX = -1;
-      _this.mouseY = -1;
-    };
-
-    this.onWindowResize = function () {
-      // Recalculate scrollbarWidth in case it's a zoom
-      _this.scrollbarWidth = _this.getScrollbarWidth();
-
-      _this.hideNativeScrollbar();
-    };
-
-    this.hideScrollbars = function () {
-      _this.axis.x.track.rect = _this.axis.x.track.el.getBoundingClientRect();
-      _this.axis.y.track.rect = _this.axis.y.track.el.getBoundingClientRect();
-
-      if (!_this.isWithinBounds(_this.axis.y.track.rect)) {
-        _this.axis.y.scrollbar.el.classList.remove(_this.classNames.visible);
-
-        _this.axis.y.isVisible = false;
-      }
-
-      if (!_this.isWithinBounds(_this.axis.x.track.rect)) {
-        _this.axis.x.scrollbar.el.classList.remove(_this.classNames.visible);
-
-        _this.axis.x.isVisible = false;
-      }
-    };
-
-    this.onPointerEvent = function (e) {
-      var isWithinTrackXBounds;
-      var isWithinTrackYBounds;
-      _this.axis.x.track.rect = _this.axis.x.track.el.getBoundingClientRect();
-      _this.axis.y.track.rect = _this.axis.y.track.el.getBoundingClientRect();
-
-      if (_this.axis.x.isOverflowing || _this.axis.x.forceVisible) {
-        isWithinTrackXBounds = _this.isWithinBounds(_this.axis.x.track.rect);
-      }
-
-      if (_this.axis.y.isOverflowing || _this.axis.y.forceVisible) {
-        isWithinTrackYBounds = _this.isWithinBounds(_this.axis.y.track.rect);
-      } // If any pointer event is called on the scrollbar
-
-
-      if (isWithinTrackXBounds || isWithinTrackYBounds) {
-        // Preventing the event's default action stops text being
-        // selectable during the drag.
-        e.preventDefault(); // Prevent event leaking
-
-        e.stopPropagation();
-
-        if (e.type === "mousedown") {
-          if (isWithinTrackXBounds) {
-            _this.axis.x.scrollbar.rect = _this.axis.x.scrollbar.el.getBoundingClientRect();
-
-            if (_this.isWithinBounds(_this.axis.x.scrollbar.rect)) {
-              _this.onDragStart(e, "x");
-            } else {
-              _this.onTrackClick(e, "x");
-            }
-          }
-
-          if (isWithinTrackYBounds) {
-            _this.axis.y.scrollbar.rect = _this.axis.y.scrollbar.el.getBoundingClientRect();
-
-            if (_this.isWithinBounds(_this.axis.y.scrollbar.rect)) {
-              _this.onDragStart(e, "y");
-            } else {
-              _this.onTrackClick(e, "y");
-            }
-          }
-        }
-      }
-    };
-
-    this.drag = function (e) {
-      var eventOffset;
-      var track = _this.axis[_this.draggedAxis].track;
-      var trackSize = track.rect[_this.axis[_this.draggedAxis].sizeAttr];
-      var scrollbar = _this.axis[_this.draggedAxis].scrollbar;
-      var contentSize = _this.contentWrapperEl[_this.axis[_this.draggedAxis].scrollSizeAttr];
-      var hostSize = parseInt(_this.elStyles[_this.axis[_this.draggedAxis].sizeAttr], 10);
-      e.preventDefault();
-      e.stopPropagation();
-
-      if (_this.draggedAxis === "y") {
-        eventOffset = e.pageY;
-      } else {
-        eventOffset = e.pageX;
-      } // Calculate how far the user's mouse is from the top/left of the scrollbar (minus the dragOffset).
-
-
-      var dragPos = eventOffset - track.rect[_this.axis[_this.draggedAxis].offsetAttr] - _this.axis[_this.draggedAxis].dragOffset; // Convert the mouse position into a percentage of the scrollbar height/width.
-
-      var dragPerc = dragPos / (trackSize - scrollbar.size); // Scroll the content by the same percentage.
-
-      var scrollPos = dragPerc * (contentSize - hostSize); // Fix browsers inconsistency on RTL
-
-      if (_this.draggedAxis === "x") {
-        scrollPos = _this.isRtl && SimpleBar.getRtlHelpers().isRtlScrollbarInverted ? scrollPos - (trackSize + scrollbar.size) : scrollPos;
-        scrollPos = _this.isRtl && SimpleBar.getRtlHelpers().isRtlScrollingInverted ? -scrollPos : scrollPos;
-      }
-
-      _this.contentWrapperEl[_this.axis[_this.draggedAxis].scrollOffsetAttr] = scrollPos;
-    };
-
-    this.onEndDrag = function (e) {
-      var elDocument = (0, _helpers.getElementDocument)(_this.el);
-      var elWindow = (0, _helpers.getElementWindow)(_this.el);
-      e.preventDefault();
-      e.stopPropagation();
-
-      _this.el.classList.remove(_this.classNames.dragging);
-
-      elDocument.removeEventListener("mousemove", _this.drag, true);
-      elDocument.removeEventListener("mouseup", _this.onEndDrag, true);
-      _this.removePreventClickId = elWindow.setTimeout(function () {
-        // Remove these asynchronously so we still suppress click events
-        // generated simultaneously with mouseup.
-        elDocument.removeEventListener("click", _this.preventClick, true);
-        elDocument.removeEventListener("dblclick", _this.preventClick, true);
-        _this.removePreventClickId = null;
-      });
-    };
-
-    this.preventClick = function (e) {
-      e.preventDefault();
-      e.stopPropagation();
-    };
-
-    this.el = element;
-    this.minScrollbarWidth = 20;
-    this.options = _objectSpread(_objectSpread({}, SimpleBar.defaultOptions), options);
-    this.classNames = _objectSpread(_objectSpread({}, SimpleBar.defaultOptions.classNames), this.options.classNames);
-    this.axis = {
-      x: {
-        scrollOffsetAttr: "scrollLeft",
-        sizeAttr: "width",
-        scrollSizeAttr: "scrollWidth",
-        offsetSizeAttr: "offsetWidth",
-        offsetAttr: "left",
-        overflowAttr: "overflowX",
-        dragOffset: 0,
-        isOverflowing: true,
-        isVisible: false,
-        forceVisible: false,
-        track: {},
-        scrollbar: {}
-      },
-      y: {
-        scrollOffsetAttr: "scrollTop",
-        sizeAttr: "height",
-        scrollSizeAttr: "scrollHeight",
-        offsetSizeAttr: "offsetHeight",
-        offsetAttr: "top",
-        overflowAttr: "overflowY",
-        dragOffset: 0,
-        isOverflowing: true,
-        isVisible: false,
-        forceVisible: false,
-        track: {},
-        scrollbar: {}
-      }
-    };
-    this.removePreventClickId = null; // Don't re-instantiate over an existing one
-
-    if (SimpleBar.instances.has(this.el)) {
-      return;
-    } // Tita TODO: 修改 64 到 1，解决卡顿问题
-
-
-    this.recalculate = (0, _lodash["default"])(this.recalculate.bind(this), 1);
-    this.onMouseMove = (0, _lodash["default"])(this.onMouseMove.bind(this), 64);
-    this.hideScrollbars = (0, _lodash2["default"])(this.hideScrollbars.bind(this), this.options.timeout);
-    this.onWindowResize = (0, _lodash2["default"])(this.onWindowResize.bind(this), 64, {
-      leading: true
-    });
-    SimpleBar.getRtlHelpers = (0, _lodash3["default"])(SimpleBar.getRtlHelpers);
-    this.init();
-  }
-  /**
-   * Static properties
-   */
-
-  /**
-   * Helper to fix browsers inconsistency on RTL:
-   *  - Firefox inverts the scrollbar initial position
-   *  - IE11 inverts both scrollbar position and scrolling offset
-   * Directly inspired by @KingSora's OverlayScrollbars https://github.com/KingSora/OverlayScrollbars/blob/master/js/OverlayScrollbars.js#L1634
-   */
-
-
-  _createClass(SimpleBar, [{
-    key: "init",
-    value: function init() {
-      // Save a reference to the instance, so we know this DOM node has already been instancied
-      SimpleBar.instances.set(this.el, this); // We stop here on server-side
-
-      if (_canUseDom["default"]) {
-        this.initDOM();
-        this.setAccessibilityAttributes();
-        this.scrollbarWidth = this.getScrollbarWidth();
-        this.recalculate();
-        this.initListeners();
-      }
-    }
-  }, {
-    key: "initDOM",
-    value: function initDOM() {
-      var _this2 = this;
-
-      // make sure this element doesn't have the elements yet
-      if (Array.prototype.filter.call(this.el.children, function (child) {
-        return child.classList.contains(_this2.classNames.wrapper);
-      }).length) {
-        // assume that element has his DOM already initiated
-        this.wrapperEl = this.el.querySelector(".".concat(this.classNames.wrapper));
-        this.contentWrapperEl = this.options.scrollableNode || this.el.querySelector(".".concat(this.classNames.contentWrapper));
-        this.contentEl = this.options.contentNode || this.el.querySelector(".".concat(this.classNames.contentEl));
-        this.offsetEl = this.el.querySelector(".".concat(this.classNames.offset));
-        this.maskEl = this.el.querySelector(".".concat(this.classNames.mask));
-        this.placeholderEl = this.findChild(this.wrapperEl, ".".concat(this.classNames.placeholder));
-        this.heightAutoObserverWrapperEl = this.el.querySelector(".".concat(this.classNames.heightAutoObserverWrapperEl));
-        this.heightAutoObserverEl = this.el.querySelector(".".concat(this.classNames.heightAutoObserverEl));
-        this.axis.x.track.el = this.findChild(this.el, ".".concat(this.classNames.track, ".").concat(this.classNames.horizontal));
-        this.axis.y.track.el = this.findChild(this.el, ".".concat(this.classNames.track, ".").concat(this.classNames.vertical));
-      } else {
-        // Prepare DOM
-        this.wrapperEl = document.createElement("div");
-        this.contentWrapperEl = document.createElement("div");
-        this.offsetEl = document.createElement("div");
-        this.maskEl = document.createElement("div");
-        this.contentEl = document.createElement("div");
-        this.placeholderEl = document.createElement("div");
-        this.heightAutoObserverWrapperEl = document.createElement("div");
-        this.heightAutoObserverEl = document.createElement("div");
-        this.wrapperEl.classList.add(this.classNames.wrapper);
-        this.contentWrapperEl.classList.add(this.classNames.contentWrapper);
-        this.offsetEl.classList.add(this.classNames.offset);
-        this.maskEl.classList.add(this.classNames.mask);
-        this.contentEl.classList.add(this.classNames.contentEl);
-        this.placeholderEl.classList.add(this.classNames.placeholder);
-        this.heightAutoObserverWrapperEl.classList.add(this.classNames.heightAutoObserverWrapperEl);
-        this.heightAutoObserverEl.classList.add(this.classNames.heightAutoObserverEl);
-
-        while (this.el.firstChild) {
-          this.contentEl.appendChild(this.el.firstChild);
-        }
-
-        this.contentWrapperEl.appendChild(this.contentEl);
-        this.offsetEl.appendChild(this.contentWrapperEl);
-        this.maskEl.appendChild(this.offsetEl);
-        this.heightAutoObserverWrapperEl.appendChild(this.heightAutoObserverEl);
-        this.wrapperEl.appendChild(this.heightAutoObserverWrapperEl);
-        this.wrapperEl.appendChild(this.maskEl);
-        this.wrapperEl.appendChild(this.placeholderEl);
-        this.el.appendChild(this.wrapperEl);
-      }
-
-      if (!this.axis.x.track.el || !this.axis.y.track.el) {
-        var track = document.createElement("div");
-        var scrollbar = document.createElement("div");
-        track.classList.add(this.classNames.track);
-        scrollbar.classList.add(this.classNames.scrollbar);
-        track.appendChild(scrollbar);
-        this.axis.x.track.el = track.cloneNode(true);
-        this.axis.x.track.el.classList.add(this.classNames.horizontal);
-        this.axis.y.track.el = track.cloneNode(true);
-        this.axis.y.track.el.classList.add(this.classNames.vertical);
-        this.el.appendChild(this.axis.x.track.el);
-        this.el.appendChild(this.axis.y.track.el);
-      }
-
-      this.axis.x.scrollbar.el = this.axis.x.track.el.querySelector(".".concat(this.classNames.scrollbar));
-      this.axis.y.scrollbar.el = this.axis.y.track.el.querySelector(".".concat(this.classNames.scrollbar));
-
-      if (!this.options.autoHide) {
-        this.axis.x.scrollbar.el.classList.add(this.classNames.visible);
-        this.axis.y.scrollbar.el.classList.add(this.classNames.visible);
-      }
-
-      this.el.setAttribute("data-simplebar", "init");
-    }
-  }, {
-    key: "setAccessibilityAttributes",
-    value: function setAccessibilityAttributes() {
-      var ariaLabel = this.options.ariaLabel || "scrollable content";
-      this.contentWrapperEl.setAttribute("tabindex", "0");
-      this.contentWrapperEl.setAttribute("role", "region");
-      this.contentWrapperEl.setAttribute("aria-label", ariaLabel);
-    }
-  }, {
-    key: "initListeners",
-    value: function initListeners() {
-      var _this3 = this;
-
-      var elWindow = (0, _helpers.getElementWindow)(this.el); // Event listeners
-
-      if (this.options.autoHide) {
-        this.el.addEventListener("mouseenter", this.onMouseEnter);
-      }
-
-      ["mousedown", "click", "dblclick"].forEach(function (e) {
-        _this3.el.addEventListener(e, _this3.onPointerEvent, true);
-      });
-      ["touchstart", "touchend", "touchmove"].forEach(function (e) {
-        _this3.el.addEventListener(e, _this3.onPointerEvent, {
-          capture: true,
-          passive: true
-        });
-      });
-      this.el.addEventListener("mousemove", this.onMouseMove);
-      this.el.addEventListener("mouseleave", this.onMouseLeave);
-      this.contentWrapperEl.addEventListener("scroll", this.onScroll); // Browser zoom triggers a window resize
-
-      elWindow.addEventListener("resize", this.onWindowResize); // Hack for https://github.com/WICG/ResizeObserver/issues/38
-
-      var resizeObserverStarted = false;
-      var resizeObserver = elWindow.ResizeObserver || _resizeObserverPolyfill["default"];
-      this.resizeObserver = new resizeObserver(function () {
-        if (!resizeObserverStarted) return;
-
-        _this3.recalculate();
-      });
-      this.resizeObserver.observe(this.el);
-      this.resizeObserver.observe(this.contentEl);
-      elWindow.requestAnimationFrame(function () {
-        resizeObserverStarted = true;
-      }); // This is required to detect horizontal scroll. Vertical scroll only needs the resizeObserver.
-
-      this.mutationObserver = new elWindow.MutationObserver(this.recalculate);
-      this.mutationObserver.observe(this.contentEl, {
-        childList: true,
-        subtree: true,
-        characterData: true
-      });
-    }
-  }, {
-    key: "recalculate",
-    value: function recalculate() {
-      var elWindow = (0, _helpers.getElementWindow)(this.el);
-      this.elStyles = elWindow.getComputedStyle(this.el);
-      this.isRtl = this.elStyles.direction === "rtl";
-      var isHeightAuto = this.heightAutoObserverEl.offsetHeight <= 1;
-      var isWidthAuto = this.heightAutoObserverEl.offsetWidth <= 1;
-      var contentElOffsetWidth = this.contentEl.offsetWidth;
-      var contentWrapperElOffsetWidth = this.contentWrapperEl.offsetWidth;
-      var elOverflowX = this.elStyles.overflowX;
-      var elOverflowY = this.elStyles.overflowY;
-      this.contentEl.style.padding = "".concat(this.elStyles.paddingTop, " ").concat(this.elStyles.paddingRight, " ").concat(this.elStyles.paddingBottom, " ").concat(this.elStyles.paddingLeft);
-      this.wrapperEl.style.margin = "-".concat(this.elStyles.paddingTop, " -").concat(this.elStyles.paddingRight, " -").concat(this.elStyles.paddingBottom, " -").concat(this.elStyles.paddingLeft);
-      var contentElScrollHeight = this.contentEl.scrollHeight;
-      var contentElScrollWidth = this.contentEl.scrollWidth;
-      this.contentWrapperEl.style.height = isHeightAuto ? "auto" : "100%"; // Determine placeholder size
-
-      this.placeholderEl.style.width = isWidthAuto ? "".concat(contentElOffsetWidth, "px") : "auto";
-      this.placeholderEl.style.height = "".concat(contentElScrollHeight, "px");
-      var contentWrapperElOffsetHeight = this.contentWrapperEl.offsetHeight;
-      this.axis.x.isOverflowing = contentElScrollWidth > contentElOffsetWidth;
-      this.axis.y.isOverflowing = contentElScrollHeight > contentWrapperElOffsetHeight; // Set isOverflowing to false if user explicitely set hidden overflow
-
-      this.axis.x.isOverflowing = elOverflowX === "hidden" ? false : this.axis.x.isOverflowing;
-      this.axis.y.isOverflowing = elOverflowY === "hidden" ? false : this.axis.y.isOverflowing;
-      this.axis.x.forceVisible = this.options.forceVisible === "x" || this.options.forceVisible === true;
-      this.axis.y.forceVisible = this.options.forceVisible === "y" || this.options.forceVisible === true;
-      this.hideNativeScrollbar(); // Set isOverflowing to false if scrollbar is not necessary (content is shorter than offset)
-
-      var offsetForXScrollbar = this.axis.x.isOverflowing ? this.scrollbarWidth : 0;
-      var offsetForYScrollbar = this.axis.y.isOverflowing ? this.scrollbarWidth : 0;
-      this.axis.x.isOverflowing = this.axis.x.isOverflowing && contentElScrollWidth > contentWrapperElOffsetWidth - offsetForYScrollbar;
-      this.axis.y.isOverflowing = this.axis.y.isOverflowing && contentElScrollHeight > contentWrapperElOffsetHeight - offsetForXScrollbar;
-      this.axis.x.scrollbar.size = this.getScrollbarSize("x");
-      this.axis.y.scrollbar.size = this.getScrollbarSize("y");
-      this.axis.x.scrollbar.el.style.width = "".concat(this.axis.x.scrollbar.size, "px");
-      this.axis.y.scrollbar.el.style.height = "".concat(this.axis.y.scrollbar.size, "px");
-      this.positionScrollbar("x");
-      this.positionScrollbar("y");
-      this.toggleTrackVisibility("x");
-      this.toggleTrackVisibility("y");
-    }
-    /**
-     * Calculate scrollbar size
-     */
-
-  }, {
-    key: "getScrollbarSize",
-    value: function getScrollbarSize() {
-      var axis = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : "y";
-
-      if (!this.axis[axis].isOverflowing) {
-        return 0;
-      }
-
-      var contentSize = this.contentEl[this.axis[axis].scrollSizeAttr];
-      var trackSize = this.axis[axis].track.el[this.axis[axis].offsetSizeAttr];
-      var scrollbarSize;
-      var scrollbarRatio = trackSize / contentSize; // Calculate new height/position of drag handle.
-
-      scrollbarSize = Math.max(~~(scrollbarRatio * trackSize), this.options.scrollbarMinSize);
-
-      if (this.options.scrollbarMaxSize) {
-        scrollbarSize = Math.min(scrollbarSize, this.options.scrollbarMaxSize);
-      }
-
-      return scrollbarSize;
-    }
-  }, {
-    key: "positionScrollbar",
-    value: function positionScrollbar() {
-      var axis = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : "y";
-
-      if (!this.axis[axis].isOverflowing) {
-        return;
-      }
-
-      var contentSize = this.contentWrapperEl[this.axis[axis].scrollSizeAttr];
-      var trackSize = this.axis[axis].track.el[this.axis[axis].offsetSizeAttr];
-      var hostSize = parseInt(this.elStyles[this.axis[axis].sizeAttr], 10);
-      var scrollbar = this.axis[axis].scrollbar;
-      var scrollOffset = this.contentWrapperEl[this.axis[axis].scrollOffsetAttr];
-      scrollOffset = axis === "x" && this.isRtl && SimpleBar.getRtlHelpers().isRtlScrollingInverted ? -scrollOffset : scrollOffset;
-      var scrollPourcent = scrollOffset / (contentSize - hostSize);
-      var handleOffset = ~~((trackSize - scrollbar.size) * scrollPourcent);
-      handleOffset = axis === "x" && this.isRtl && SimpleBar.getRtlHelpers().isRtlScrollbarInverted ? handleOffset + (trackSize - scrollbar.size) : handleOffset;
-      scrollbar.el.style.transform = axis === "x" ? "translate3d(".concat(handleOffset, "px, 0, 0)") : "translate3d(0, ".concat(handleOffset, "px, 0)");
-    }
-  }, {
-    key: "toggleTrackVisibility",
-    value: function toggleTrackVisibility() {
-      var axis = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : "y";
-      var track = this.axis[axis].track.el;
-      var scrollbar = this.axis[axis].scrollbar.el;
-
-      if (this.axis[axis].isOverflowing || this.axis[axis].forceVisible) {
-        track.style.visibility = "visible";
-        this.contentWrapperEl.style[this.axis[axis].overflowAttr] = "scroll";
-      } else {
-        track.style.visibility = "hidden";
-        this.contentWrapperEl.style[this.axis[axis].overflowAttr] = "hidden";
-      } // Even if forceVisible is enabled, scrollbar itself should be hidden
-
-
-      if (this.axis[axis].isOverflowing) {
-        scrollbar.style.display = "block";
-      } else {
-        scrollbar.style.display = "none";
-      }
-    }
-  }, {
-    key: "hideNativeScrollbar",
-    value: function hideNativeScrollbar() {
-      this.offsetEl.style[this.isRtl ? "left" : "right"] = this.axis.y.isOverflowing || this.axis.y.forceVisible ? "-".concat(this.scrollbarWidth, "px") : 0;
-      this.offsetEl.style.bottom = this.axis.x.isOverflowing || this.axis.x.forceVisible ? "-".concat(this.scrollbarWidth, "px") : 0;
-    }
-    /**
-     * On scroll event handling
-     */
-
-  }, {
-    key: "onMouseMoveForAxis",
-    value: function onMouseMoveForAxis() {
-      var axis = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : "y";
-      this.axis[axis].track.rect = this.axis[axis].track.el.getBoundingClientRect();
-      this.axis[axis].scrollbar.rect = this.axis[axis].scrollbar.el.getBoundingClientRect();
-      var isWithinScrollbarBoundsX = this.isWithinBounds(this.axis[axis].scrollbar.rect);
-
-      if (isWithinScrollbarBoundsX) {
-        this.axis[axis].scrollbar.el.classList.add(this.classNames.hover);
-      } else {
-        this.axis[axis].scrollbar.el.classList.remove(this.classNames.hover);
-      }
-
-      if (this.isWithinBounds(this.axis[axis].track.rect)) {
-        this.showScrollbar(axis);
-        this.axis[axis].track.el.classList.add(this.classNames.hover);
-      } else {
-        this.axis[axis].track.el.classList.remove(this.classNames.hover);
-      }
-    }
-  }, {
-    key: "onMouseLeaveForAxis",
-    value: function onMouseLeaveForAxis() {
-      var axis = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : "y";
-      this.axis[axis].track.el.classList.remove(this.classNames.hover);
-      this.axis[axis].scrollbar.el.classList.remove(this.classNames.hover);
-    }
-  }, {
-    key: "showScrollbar",
-    value:
-    /**
-     * Show scrollbar
-     */
-    function showScrollbar() {
-      var axis = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : "y";
-      var scrollbar = this.axis[axis].scrollbar.el;
-
-      if (!this.axis[axis].isVisible) {
-        scrollbar.classList.add(this.classNames.visible);
-        this.axis[axis].isVisible = true;
-      }
-
-      if (this.options.autoHide) {
-        this.hideScrollbars();
-      }
-    }
-    /**
-     * Hide Scrollbar
-     */
-
-  }, {
-    key: "onDragStart",
-    value:
-    /**
-     * on scrollbar handle drag movement starts
-     */
-    function onDragStart(e) {
-      var axis = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "y";
-      var elDocument = (0, _helpers.getElementDocument)(this.el);
-      var elWindow = (0, _helpers.getElementWindow)(this.el);
-      var scrollbar = this.axis[axis].scrollbar; // Measure how far the user's mouse is from the top of the scrollbar drag handle.
-
-      var eventOffset = axis === "y" ? e.pageY : e.pageX;
-      this.axis[axis].dragOffset = eventOffset - scrollbar.rect[this.axis[axis].offsetAttr];
-      this.draggedAxis = axis;
-      this.el.classList.add(this.classNames.dragging);
-      elDocument.addEventListener("mousemove", this.drag, true);
-      elDocument.addEventListener("mouseup", this.onEndDrag, true);
-
-      if (this.removePreventClickId === null) {
-        elDocument.addEventListener("click", this.preventClick, true);
-        elDocument.addEventListener("dblclick", this.preventClick, true);
-      } else {
-        elWindow.clearTimeout(this.removePreventClickId);
-        this.removePreventClickId = null;
-      }
-    }
-    /**
-     * Drag scrollbar handle
-     */
-
-  }, {
-    key: "onTrackClick",
-    value: function onTrackClick(e) {
-      var _this4 = this;
-
-      var axis = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "y";
-      if (!this.options.clickOnTrack) return;
-      var elWindow = (0, _helpers.getElementWindow)(this.el);
-      this.axis[axis].scrollbar.rect = this.axis[axis].scrollbar.el.getBoundingClientRect();
-      var scrollbar = this.axis[axis].scrollbar;
-      var scrollbarOffset = scrollbar.rect[this.axis[axis].offsetAttr];
-      var hostSize = parseInt(this.elStyles[this.axis[axis].sizeAttr], 10);
-      var scrolled = this.contentWrapperEl[this.axis[axis].scrollOffsetAttr];
-      var t = axis === "y" ? this.mouseY - scrollbarOffset : this.mouseX - scrollbarOffset;
-      var dir = t < 0 ? -1 : 1;
-      var scrollSize = dir === -1 ? scrolled - hostSize : scrolled + hostSize;
-
-      var scrollTo = function scrollTo() {
-        if (dir === -1) {
-          if (scrolled > scrollSize) {
-            scrolled -= _this4.options.clickOnTrackSpeed;
-
-            _this4.contentWrapperEl.scrollTo(_defineProperty({}, _this4.axis[axis].offsetAttr, scrolled));
-
-            elWindow.requestAnimationFrame(scrollTo);
-          }
-        } else if (scrolled < scrollSize) {
-          scrolled += _this4.options.clickOnTrackSpeed;
-
-          _this4.contentWrapperEl.scrollTo(_defineProperty({}, _this4.axis[axis].offsetAttr, scrolled));
-
-          elWindow.requestAnimationFrame(scrollTo);
-        }
-      };
-
-      scrollTo();
-    }
-    /**
-     * Getter for content element
-     */
-
-  }, {
-    key: "getContentElement",
-    value: function getContentElement() {
-      return this.contentEl;
-    }
-    /**
-     * Getter for original scrolling element
-     */
-
-  }, {
-    key: "getScrollElement",
-    value: function getScrollElement() {
-      return this.contentWrapperEl;
-    }
-  }, {
-    key: "getScrollbarWidth",
-    value: function getScrollbarWidth() {
-      // Try/catch for FF 56 throwing on undefined computedStyles
-      try {
-        // Detect browsers supporting CSS scrollbar styling and do not calculate
-        if (getComputedStyle(this.contentWrapperEl, "::-webkit-scrollbar").display === "none" || "scrollbarWidth" in document.documentElement.style || "-ms-overflow-style" in document.documentElement.style) {
-          return 0;
-        }
-
-        return (0, _scrollbarWidth["default"])(this.el);
-      } catch (e) {
-        return (0, _scrollbarWidth["default"])(this.el);
-      }
-    }
-  }, {
-    key: "removeListeners",
-    value: function removeListeners() {
-      var _this5 = this;
-
-      var elWindow = (0, _helpers.getElementWindow)(this.el); // Event listeners
-
-      if (this.options.autoHide) {
-        this.el.removeEventListener("mouseenter", this.onMouseEnter);
-      }
-
-      ["mousedown", "click", "dblclick"].forEach(function (e) {
-        _this5.el.removeEventListener(e, _this5.onPointerEvent, true);
-      });
-      ["touchstart", "touchend", "touchmove"].forEach(function (e) {
-        _this5.el.removeEventListener(e, _this5.onPointerEvent, {
-          capture: true,
-          passive: true
-        });
-      });
-      this.el.removeEventListener("mousemove", this.onMouseMove);
-      this.el.removeEventListener("mouseleave", this.onMouseLeave);
-
-      if (this.contentWrapperEl) {
-        this.contentWrapperEl.removeEventListener("scroll", this.onScroll);
-      }
-
-      elWindow.removeEventListener("resize", this.onWindowResize);
-
-      if (this.mutationObserver) {
-        this.mutationObserver.disconnect();
-      }
-
-      if (this.resizeObserver) {
-        this.resizeObserver.disconnect();
-      } // Cancel all debounced functions
-
-
-      this.recalculate.cancel();
-      this.onMouseMove.cancel();
-      this.hideScrollbars.cancel();
-      this.onWindowResize.cancel();
-    }
-    /**
-     * UnMount mutation observer and delete SimpleBar instance from DOM element
-     */
-
-  }, {
-    key: "unMount",
-    value: function unMount() {
-      this.removeListeners();
-      SimpleBar.instances["delete"](this.el);
-    }
-    /**
-     * Check if mouse is within bounds
-     */
-
-  }, {
-    key: "isWithinBounds",
-    value: function isWithinBounds(bbox) {
-      return this.mouseX >= bbox.left && this.mouseX <= bbox.left + bbox.width && this.mouseY >= bbox.top && this.mouseY <= bbox.top + bbox.height;
-    }
-    /**
-     * Find element children matches query
-     */
-
-  }, {
-    key: "findChild",
-    value: function findChild(el, query) {
-      var matches = el.matches || el.webkitMatchesSelector || el.mozMatchesSelector || el.msMatchesSelector;
-      return Array.prototype.filter.call(el.children, function (child) {
-        return matches.call(child, query);
-      })[0];
-    }
-  }], [{
-    key: "getRtlHelpers",
-    value: function getRtlHelpers() {
-      var dummyDiv = document.createElement("div");
-      dummyDiv.innerHTML = "<div class=\"hs-dummy-scrollbar-size\"><div style=\"height: 200%; width: 200%; margin: 10px 0;\"></div></div>";
-      var scrollbarDummyEl = dummyDiv.firstElementChild;
-      document.body.appendChild(scrollbarDummyEl);
-      var dummyContainerChild = scrollbarDummyEl.firstElementChild;
-      scrollbarDummyEl.scrollLeft = 0;
-      var dummyContainerOffset = SimpleBar.getOffset(scrollbarDummyEl);
-      var dummyContainerChildOffset = SimpleBar.getOffset(dummyContainerChild);
-      scrollbarDummyEl.scrollLeft = 999;
-      var dummyContainerScrollOffsetAfterScroll = SimpleBar.getOffset(dummyContainerChild);
-      return {
-        // determines if the scrolling is responding with negative values
-        isRtlScrollingInverted: dummyContainerOffset.left !== dummyContainerChildOffset.left && dummyContainerChildOffset.left - dummyContainerScrollOffsetAfterScroll.left !== 0,
-        // determines if the origin scrollbar position is inverted or not (positioned on left or right)
-        isRtlScrollbarInverted: dummyContainerOffset.left !== dummyContainerChildOffset.left
-      };
-    }
-  }, {
-    key: "getOffset",
-    value: function getOffset(el) {
-      var rect = el.getBoundingClientRect();
-      var elDocument = (0, _helpers.getElementDocument)(el);
-      var elWindow = (0, _helpers.getElementWindow)(el);
-      return {
-        top: rect.top + (elWindow.pageYOffset || elDocument.documentElement.scrollTop),
-        left: rect.left + (elWindow.pageXOffset || elDocument.documentElement.scrollLeft)
-      };
-    }
-  }]);
-
-  return SimpleBar;
-}();
-
-exports["default"] = SimpleBar;
-SimpleBar.defaultOptions = {
-  autoHide: true,
-  forceVisible: false,
-  clickOnTrack: true,
-  clickOnTrackSpeed: 40,
-  classNames: {
-    contentEl: "simplebar-content",
-    contentWrapper: "simplebar-content-wrapper",
-    offset: "simplebar-offset",
-    mask: "simplebar-mask",
-    wrapper: "simplebar-wrapper",
-    placeholder: "simplebar-placeholder",
-    scrollbar: "simplebar-scrollbar",
-    track: "simplebar-track",
-    heightAutoObserverWrapperEl: "simplebar-height-auto-observer-wrapper",
-    heightAutoObserverEl: "simplebar-height-auto-observer",
-    visible: "simplebar-visible",
-    horizontal: "simplebar-horizontal",
-    vertical: "simplebar-vertical",
-    hover: "simplebar-hover",
-    dragging: "simplebar-dragging"
-  },
-  scrollbarMinSize: 25,
-  scrollbarMaxSize: 0,
-  timeout: 1000
-};
-SimpleBar.instances = new WeakMap();