bj-web-components 0.2.34 → 0.2.36

package/dist/web/OverlayScrollbar/BOverlayScrollbar.mjs

@@ -1,152 +1,271 @@
-import { jsxs as se, Fragment as le, jsx as re } from "react/jsx-runtime";
-import { useRef as x, useState as $, useEffect as F, useCallback as D } from "react";
+function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
+function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t.return || t.return(); } finally { if (u) throw o; } } }; }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+import { jsxs as ae, Fragment as fe, jsx as ne } from "react/jsx-runtime";
+import { useRef as S, useState as X, useEffect as $, useCallback as w } from "react";
 /* empty css                        */
-const Z = 24, ie = 800, U = { visible: !1, offset: 0, length: 0, cross: 0 };
-function fe({
-  containerRef: j,
-  targetRef: C,
-  selector: q,
-  direction: S = "vertical",
-  size: g = 4,
-  gap: w = 0,
-  background: G,
-  showOnHover: s = !0,
-  showOnScroll: J = !0,
-  hoverSelector: A,
-  horizontalInsetStart: p = 0,
-  horizontalInsetEnd: B = 0,
-  horizontalThumbLength: k,
-  className: ce = ""
-}) {
-  const P = S === "vertical" || S === "both", V = S === "horizontal" || S === "both", m = x(null), a = x(null), y = x(null), h = x(!1), E = x(!1), [N, K] = $(U), [R, Q] = $(U), [oe, f] = $(!s);
-  F(() => {
-    s || f(!0);
-  }, [s]);
-  const L = D(() => {
-    const e = m.current, n = j.current;
-    if (!e || !n) return;
-    const { scrollTop: t, scrollHeight: o, clientHeight: c, scrollLeft: b, scrollWidth: l, clientWidth: i } = e, d = e.getBoundingClientRect(), r = n.getBoundingClientRect(), v = d.top - r.top, T = d.left - r.left;
-    if (P) {
-      const _ = o - c;
-      if (_ <= 1)
-        K((u) => u.visible ? U : u);
-      else {
-        const u = Math.max(c / o * c, Z);
-        K({
-          visible: !0,
-          offset: v + t / _ * (c - u),
-          length: u,
-          cross: T + i - g - w
-        });
+var me = Object.defineProperty,
+  ve = Object.defineProperties,
+  de = Object.getOwnPropertyDescriptors,
+  oe = Object.getOwnPropertySymbols,
+  pe = Object.prototype.hasOwnProperty,
+  be = Object.prototype.propertyIsEnumerable,
+  ce = function ce(o, n, c) {
+    return n in o ? me(o, n, {
+      enumerable: !0,
+      configurable: !0,
+      writable: !0,
+      value: c
+    }) : o[n] = c;
+  },
+  se = function se(o, n) {
+    for (var c in n || (n = {})) pe.call(n, c) && ce(o, c, n[c]);
+    if (oe) {
+      var _iterator = _createForOfIteratorHelper(oe(n)),
+        _step;
+      try {
+        for (_iterator.s(); !(_step = _iterator.n()).done;) {
+          var c = _step.value;
+          be.call(n, c) && ce(o, c, n[c]);
+        }
+      } catch (err) {
+        _iterator.e(err);
+      } finally {
+        _iterator.f();
       }
     }
-    if (V) {
-      const _ = l - i, u = Math.max(i - p - B, 0);
-      if (_ <= 1 || u <= 0)
-        Q((H) => H.visible ? U : H);
-      else {
-        const H = i / l * u, ne = Math.min(u, Math.max(k ?? H, Z));
-        Q({
-          visible: !0,
-          offset: T + p + b / _ * (u - ne),
-          length: ne,
-          cross: v + c - g - w
-        });
+    return o;
+  },
+  le = function le(o, n) {
+    return ve(o, de(n));
+  };
+var F = 24,
+  he = 800,
+  H = {
+    visible: !1,
+    offset: 0,
+    length: 0,
+    cross: 0
+  };
+function Ee(_ref) {
+  var o = _ref.containerRef,
+    n = _ref.targetRef,
+    c = _ref.selector,
+    _ref$direction = _ref.direction,
+    C = _ref$direction === void 0 ? "vertical" : _ref$direction,
+    _ref$size = _ref.size,
+    M = _ref$size === void 0 ? 4 : _ref$size,
+    _ref$gap = _ref.gap,
+    U = _ref$gap === void 0 ? 0 : _ref$gap,
+    Z = _ref.background,
+    _ref$showOnHover = _ref.showOnHover,
+    a = _ref$showOnHover === void 0 ? !0 : _ref$showOnHover,
+    _ref$showOnScroll = _ref.showOnScroll,
+    G = _ref$showOnScroll === void 0 ? !0 : _ref$showOnScroll,
+    V = _ref.hoverSelector,
+    _ref$horizontalInsetS = _ref.horizontalInsetStart,
+    P = _ref$horizontalInsetS === void 0 ? 0 : _ref$horizontalInsetS,
+    _ref$horizontalInsetE = _ref.horizontalInsetEnd,
+    B = _ref$horizontalInsetE === void 0 ? 0 : _ref$horizontalInsetE,
+    y = _ref.horizontalThumbLength,
+    _ref$className = _ref.className,
+    ie = _ref$className === void 0 ? "" : _ref$className;
+  var k = C === "vertical" || C === "both",
+    q = C === "horizontal" || C === "both",
+    b = S(null),
+    d = S(null),
+    T = S(null),
+    E = S(!1),
+    j = S(!1),
+    _X = X(H),
+    _X2 = _slicedToArray(_X, 2),
+    R = _X2[0],
+    J = _X2[1],
+    _X3 = X(H),
+    _X4 = _slicedToArray(_X3, 2),
+    N = _X4[0],
+    K = _X4[1],
+    _X5 = X(!a),
+    _X6 = _slicedToArray(_X5, 2),
+    ue = _X6[0],
+    h = _X6[1];
+  $(function () {
+    a || h(!0);
+  }, [a]);
+  var L = w(function () {
+      var e = b.current,
+        r = o.current;
+      if (!e || !r) return;
+      var t = e.scrollTop,
+        i = e.scrollHeight,
+        s = e.clientHeight,
+        _ = e.scrollLeft,
+        f = e.scrollWidth,
+        m = e.clientWidth,
+        g = e.getBoundingClientRect(),
+        u = r.getBoundingClientRect(),
+        l = g.top - u.top,
+        p = g.left - u.left;
+      if (k) {
+        var x = i - s;
+        if (x <= 1) J(function (v) {
+          return v.visible ? H : v;
+        });else {
+          var v = Math.max(s / i * s, F);
+          J({
+            visible: !0,
+            offset: l + t / x * (s - v),
+            length: v,
+            cross: p + m - M - U
+          });
+        }
       }
-    }
-  }, [j, w, B, p, k, V, P, g]), W = D(() => {
-    if (!s) return;
-    const e = h.current || E.current || a.current;
-    if (!J && !e) {
-      f(!1);
-      return;
-    }
-    f(!0), y.current && clearTimeout(y.current), y.current = setTimeout(() => {
-      !a.current && !h.current && !E.current && f(!1);
-    }, ie);
-  }, [s, J]), X = D(() => {
-    L(), W();
-  }, [L, W]);
-  F(() => {
-    const e = j.current;
+      if (q) {
+        var _x = f - m,
+          _v = Math.max(m - P - B, 0);
+        if (_x <= 1 || _v <= 0) K(function (Y) {
+          return Y.visible ? H : Y;
+        });else {
+          var Y = m / f * _v,
+            re = Math.min(_v, Math.max(y != null ? y : Y, F));
+          K({
+            visible: !0,
+            offset: p + P + _ / _x * (_v - re),
+            length: re,
+            cross: l + s - M - U
+          });
+        }
+      }
+    }, [o, U, B, P, y, q, k, M]),
+    O = w(function () {
+      if (!a) return;
+      var e = E.current || j.current || d.current;
+      if (!G && !e) {
+        h(!1);
+        return;
+      }
+      h(!0), T.current && clearTimeout(T.current), T.current = setTimeout(function () {
+        !d.current && !E.current && !j.current && h(!1);
+      }, he);
+    }, [a, G]),
+    A = w(function () {
+      L(), O();
+    }, [L, O]);
+  $(function () {
+    var e = o.current;
     if (!e) return;
     window.getComputedStyle(e).position === "static" && (e.style.position = "relative");
-    let n, t = null;
-    const o = () => {
-      const r = (C == null ? void 0 : C.current) ?? (q ? e.querySelector(q) : e.firstElementChild);
-      if (!r || r === m.current) return;
-      n == null || n(), m.current = r, r.addEventListener("scroll", X, { passive: !0 });
-      const v = new ResizeObserver(L);
-      v.observe(r), r.firstElementChild && v.observe(r.firstElementChild), n = () => {
-        r.removeEventListener("scroll", X), v.disconnect();
-      }, L();
-    }, c = () => {
-      h.current = !0, s && f(!0);
-    }, b = () => {
-      h.current = !1, s && !E.current && !a.current && f(!1);
-    }, l = () => {
-      t == null || t.removeEventListener("mouseenter", c), t == null || t.removeEventListener("mouseleave", b), t = null, h.current = !1;
-    }, i = () => {
-      const r = A ? e.querySelector(A) : e;
-      !r || r === t || (l(), t = r, t.addEventListener("mouseenter", c), t.addEventListener("mouseleave", b));
-    };
-    o(), i();
-    const d = new MutationObserver(() => {
-      (!m.current || !e.contains(m.current)) && o(), t && !e.contains(t) && l(), t || i(), L();
+    var r,
+      t = null;
+    var i = function i() {
+        var u;
+        var l = (u = n == null ? void 0 : n.current) != null ? u : c ? e.querySelector(c) : e.firstElementChild;
+        if (!l || l === b.current) return;
+        r == null || r(), b.current = l, l.addEventListener("scroll", A, {
+          passive: !0
+        });
+        var p = new ResizeObserver(L);
+        p.observe(l), l.firstElementChild && p.observe(l.firstElementChild), r = function r() {
+          l.removeEventListener("scroll", A), p.disconnect();
+        }, L();
+      },
+      s = function s() {
+        E.current = !0, a && h(!0);
+      },
+      _ = function _() {
+        E.current = !1, a && !j.current && !d.current && h(!1);
+      },
+      f = function f() {
+        t == null || t.removeEventListener("mouseenter", s), t == null || t.removeEventListener("mouseleave", _), t = null, E.current = !1;
+      },
+      m = function m() {
+        var u = V ? e.querySelector(V) : e;
+        !u || u === t || (f(), t = u, t.addEventListener("mouseenter", s), t.addEventListener("mouseleave", _));
+      };
+    i(), m();
+    var g = new MutationObserver(function () {
+      (!b.current || !e.contains(b.current)) && i(), t && !e.contains(t) && f(), t || m(), L();
     });
-    return d.observe(e, { childList: !0, subtree: !0 }), () => {
-      d.disconnect(), n == null || n(), l(), m.current = null, y.current && clearTimeout(y.current);
+    return g.observe(e, {
+      childList: !0,
+      subtree: !0
+    }), function () {
+      g.disconnect(), r == null || r(), f(), b.current = null, T.current && clearTimeout(T.current);
     };
-  }, [j, A, X, q, s, L, C]);
-  const M = D((e) => {
-    const n = m.current, t = a.current;
-    if (!n || !t) return;
-    const o = t.axis === "vertical", c = o ? n.clientHeight : n.clientWidth, b = o ? n.scrollHeight : n.scrollWidth, l = o ? c : Math.max(c - p - B, 0), i = c / b * l, d = Math.min(l, Math.max(o ? i : k ?? i, Z)), r = l - d;
-    if (r <= 0) return;
-    const v = (o ? e.clientY : e.clientX) - t.client, T = t.scroll + v * ((b - c) / r);
-    o ? n.scrollTop = T : n.scrollLeft = T;
-  }, [B, p, k]), Y = D(() => {
-    const e = !!a.current;
-    a.current = null, document.body.style.userSelect = "", document.removeEventListener("mousemove", M), document.removeEventListener("mouseup", Y), e && W();
-  }, [M, W]), I = (e) => (n) => {
-    const t = m.current;
-    t && (n.preventDefault(), n.stopPropagation(), a.current = {
-      axis: e,
-      client: e === "vertical" ? n.clientY : n.clientX,
-      scroll: e === "vertical" ? t.scrollTop : t.scrollLeft
-    }, document.body.style.userSelect = "none", document.addEventListener("mousemove", M), document.addEventListener("mouseup", Y));
-  };
-  F(() => () => {
-    a.current = null, document.body.style.userSelect = "", document.removeEventListener("mousemove", M), document.removeEventListener("mouseup", Y);
-  }, [Y, M]);
-  const z = ["bj-overlay-scrollbar__thumb", oe && "bj-overlay-scrollbar__thumb--active", ce].filter(Boolean).join(" "), O = G ? { "--bj-overlay-scrollbar-bg": G } : void 0, ee = () => {
-    E.current = !0, s && f(!0);
-  }, te = () => {
-    E.current = !1, s && !h.current && !a.current && f(!1);
-  };
-  return /* @__PURE__ */ se(le, { children: [
-    P && N.visible && /* @__PURE__ */ re(
-      "div",
-      {
-        className: `${z} bj-overlay-scrollbar__thumb--vertical`,
-        onMouseDown: I("vertical"),
-        onMouseEnter: ee,
-        onMouseLeave: te,
-        style: { ...O, top: N.offset, left: N.cross, height: N.length, width: g }
-      }
-    ),
-    V && R.visible && /* @__PURE__ */ re(
-      "div",
-      {
-        className: `${z} bj-overlay-scrollbar__thumb--horizontal`,
-        onMouseDown: I("horizontal"),
-        onMouseEnter: ee,
-        onMouseLeave: te,
-        style: { ...O, left: R.offset, top: R.cross, width: R.length, height: g }
-      }
-    )
-  ] });
+  }, [o, V, A, c, a, L, n]);
+  var D = w(function (e) {
+      var r = b.current,
+        t = d.current;
+      if (!r || !t) return;
+      var i = t.axis === "vertical",
+        s = i ? r.clientHeight : r.clientWidth,
+        _ = i ? r.scrollHeight : r.scrollWidth,
+        f = i ? s : Math.max(s - P - B, 0),
+        m = s / _ * f,
+        g = Math.min(f, Math.max(i ? m : y != null ? y : m, F)),
+        u = f - g;
+      if (u <= 0) return;
+      var l = (i ? e.clientY : e.clientX) - t.client,
+        p = t.scroll + l * ((_ - s) / u);
+      i ? r.scrollTop = p : r.scrollLeft = p;
+    }, [B, P, y]),
+    W = w(function () {
+      var e = !!d.current;
+      d.current = null, document.body.style.userSelect = "", document.removeEventListener("mousemove", D), document.removeEventListener("mouseup", W), e && O();
+    }, [D, O]),
+    Q = function Q(e) {
+      return function (r) {
+        var t = b.current;
+        t && (r.preventDefault(), r.stopPropagation(), d.current = {
+          axis: e,
+          client: e === "vertical" ? r.clientY : r.clientX,
+          scroll: e === "vertical" ? t.scrollTop : t.scrollLeft
+        }, document.body.style.userSelect = "none", document.addEventListener("mousemove", D), document.addEventListener("mouseup", W));
+      };
+    };
+  $(function () {
+    return function () {
+      d.current = null, document.body.style.userSelect = "", document.removeEventListener("mousemove", D), document.removeEventListener("mouseup", W);
+    };
+  }, [W, D]);
+  var I = ["bj-overlay-scrollbar__thumb", ue && "bj-overlay-scrollbar__thumb--active", ie].filter(Boolean).join(" "),
+    z = Z ? {
+      "--bj-overlay-scrollbar-bg": Z
+    } : void 0,
+    ee = function ee() {
+      j.current = !0, a && h(!0);
+    },
+    te = function te() {
+      j.current = !1, a && !E.current && !d.current && h(!1);
+    };
+  return /* @__PURE__ */ae(fe, {
+    children: [k && R.visible && /* @__PURE__ */ne("div", {
+      className: "".concat(I, " bj-overlay-scrollbar__thumb--vertical"),
+      onMouseDown: Q("vertical"),
+      onMouseEnter: ee,
+      onMouseLeave: te,
+      style: le(se({}, z), {
+        top: R.offset,
+        left: R.cross,
+        height: R.length,
+        width: M
+      })
+    }), q && N.visible && /* @__PURE__ */ne("div", {
+      className: "".concat(I, " bj-overlay-scrollbar__thumb--horizontal"),
+      onMouseDown: Q("horizontal"),
+      onMouseEnter: ee,
+      onMouseLeave: te,
+      style: le(se({}, z), {
+        left: N.offset,
+        top: N.cross,
+        width: N.length,
+        height: M
+      })
+    })]
+  });
 }
-export {
-  fe as default
-};
+export { Ee as default };