bj-web-components 0.2.28 → 0.2.30

package/dist/web/Modal/Modal.js

@@ -1,84 +1 @@
-"use strict";
-const jsxRuntime = require("react/jsx-runtime");
-;/* empty css            */
-function BuModal({
-  open = false,
-  title = "标题",
-  mode = "standard",
-  children,
-  okText = "确认",
-  cancelText = "取消",
-  onOk,
-  onCancel,
-  onClose,
-  activeLang = "zh",
-  onLangChange,
-  labels,
-  hint,
-  confirmLoading = false,
-  width,
-  className,
-  style
-}) {
-  const zhLabel = (labels == null ? void 0 : labels.zh) ?? "中文";
-  const enLabel = (labels == null ? void 0 : labels.en) ?? "EN";
-  if (!open) return null;
-  const isBilingual = mode === "bilingual";
-  const isSingle = mode === "single";
-  const containerStyle = width != null ? { width, ...style } : style;
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: ["bu-modal__overlay", className].filter(Boolean).join(" "), onClick: onClose, children: /* @__PURE__ */ jsxRuntime.jsxs(
-    "div",
-    {
-      className: "bu-modal__container",
-      style: containerStyle,
-      onClick: (e) => e.stopPropagation(),
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bu-modal__header", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "bu-modal__title", children: title }),
-          isBilingual && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bu-modal__lang-toggle", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(
-              "button",
-              {
-                type: "button",
-                className: `bu-modal__lang-btn${activeLang === "zh" ? " bu-modal__lang-btn--active" : ""}`,
-                onClick: () => onLangChange == null ? void 0 : onLangChange("zh"),
-                children: zhLabel
-              }
-            ),
-            /* @__PURE__ */ jsxRuntime.jsx(
-              "button",
-              {
-                type: "button",
-                className: `bu-modal__lang-btn${activeLang === "en" ? " bu-modal__lang-btn--active" : ""}`,
-                onClick: () => onLangChange == null ? void 0 : onLangChange("en"),
-                children: enLabel
-              }
-            )
-          ] }),
-          /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", className: "bu-modal__close", onClick: onClose, children: /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M16.5613 6.73027C16.7558 6.53571 17.0723 6.53442 17.2684 6.72736C17.4644 6.92032 17.4657 7.23444 17.2713 7.42901L12.7036 12.0002L17.2713 16.5714C17.4657 16.766 17.4644 17.0801 17.2684 17.273C17.0723 17.4659 16.7558 17.4646 16.5613 17.2701L11.9996 12.7047L7.43794 17.2701C7.24352 17.4647 6.92699 17.4659 6.73091 17.273C6.53485 17.0801 6.53355 16.7659 6.72798 16.5714L11.2955 12.0002L6.72798 7.42901C6.53355 7.23442 6.53485 6.92032 6.73091 6.72736C6.92698 6.53442 7.2435 6.53571 7.43794 6.73027L11.9996 11.2955L16.5613 6.73027Z", fill: "currentColor" }) }) })
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bu-modal__body", children }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bu-modal__footer", children: [
-          hint && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "bu-modal__hint", children: hint }),
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bu-modal__btn-row", children: [
-            !isSingle && /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", className: "bu-modal__btn-cancel", onClick: onCancel ?? onClose, children: cancelText }),
-            /* @__PURE__ */ jsxRuntime.jsxs(
-              "button",
-              {
-                type: "button",
-                className: ["bu-modal__btn-ok", confirmLoading ? "bu-modal__btn-ok--loading" : ""].filter(Boolean).join(" "),
-                disabled: confirmLoading,
-                onClick: confirmLoading ? void 0 : onOk,
-                children: [
-                  confirmLoading && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "bu-modal__btn-ok-spinner" }),
-                  okText
-                ]
-              }
-            )
-          ] })
-        ] })
-      ]
-    }
-  ) });
-}
-module.exports = BuModal;
+"use strict";const l=require("react/jsx-runtime");;/* empty css            */function w({open:u=!1,title:r="标题",mode:o="standard",children:_,okText:b="确认",cancelText:m="取消",onOk:x,onCancel:j,onClose:i,activeLang:n="zh",onLangChange:s,labels:t,hint:c,confirmLoading:e=!1,width:a,className:N,style:d}){const h=(t==null?void 0:t.zh)??"中文",p=(t==null?void 0:t.en)??"EN";if(!u)return null;const v=o==="bilingual",k=o==="single",y=a!=null?{width:a,...d}:d;return l.jsx("div",{className:["bu-modal__overlay",N].filter(Boolean).join(" "),onClick:i,children:l.jsxs("div",{className:"bu-modal__container",style:y,onClick:f=>f.stopPropagation(),children:[l.jsxs("div",{className:"bu-modal__header",children:[l.jsx("p",{className:"bu-modal__title",children:r}),v&&l.jsxs("div",{className:"bu-modal__lang-toggle",children:[l.jsx("button",{type:"button",className:`bu-modal__lang-btn${n==="zh"?" bu-modal__lang-btn--active":""}`,onClick:()=>s==null?void 0:s("zh"),children:h}),l.jsx("button",{type:"button",className:`bu-modal__lang-btn${n==="en"?" bu-modal__lang-btn--active":""}`,onClick:()=>s==null?void 0:s("en"),children:p})]}),l.jsx("button",{type:"button",className:"bu-modal__close",onClick:i,children:l.jsx("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:l.jsx("path",{d:"M16.5613 6.73027C16.7558 6.53571 17.0723 6.53442 17.2684 6.72736C17.4644 6.92032 17.4657 7.23444 17.2713 7.42901L12.7036 12.0002L17.2713 16.5714C17.4657 16.766 17.4644 17.0801 17.2684 17.273C17.0723 17.4659 16.7558 17.4646 16.5613 17.2701L11.9996 12.7047L7.43794 17.2701C7.24352 17.4647 6.92699 17.4659 6.73091 17.273C6.53485 17.0801 6.53355 16.7659 6.72798 16.5714L11.2955 12.0002L6.72798 7.42901C6.53355 7.23442 6.53485 6.92032 6.73091 6.72736C6.92698 6.53442 7.2435 6.53571 7.43794 6.73027L11.9996 11.2955L16.5613 6.73027Z",fill:"currentColor"})})})]}),l.jsx("div",{className:"bu-modal__body",children:_}),l.jsxs("div",{className:"bu-modal__footer",children:[c&&l.jsx("p",{className:"bu-modal__hint",children:c}),l.jsxs("div",{className:"bu-modal__btn-row",children:[!k&&l.jsx("button",{type:"button",className:"bu-modal__btn-cancel",onClick:j??i,children:m}),l.jsxs("button",{type:"button",className:["bu-modal__btn-ok",e?"bu-modal__btn-ok--loading":""].filter(Boolean).join(" "),disabled:e,onClick:e?void 0:x,children:[e&&l.jsx("span",{className:"bu-modal__btn-ok-spinner"}),b]})]})]})]})})}module.exports=w;

package/dist/web/Modal/Modal.mjs

@@ -1,76 +1,73 @@
-import { jsx, jsxs } from "react/jsx-runtime";
+import { jsx as l, jsxs as i } from "react/jsx-runtime";
 /* empty css            */
-function BuModal({
-  open = false,
-  title = "标题",
-  mode = "standard",
-  children,
-  okText = "确认",
-  cancelText = "取消",
-  onOk,
-  onCancel,
-  onClose,
-  activeLang = "zh",
-  onLangChange,
-  labels,
-  hint,
-  confirmLoading = false,
-  width,
-  className,
-  style
+function j({
+  open: _ = !1,
+  title: r = "标题",
+  mode: n = "standard",
+  children: b,
+  okText: m = "确认",
+  cancelText: p = "取消",
+  onOk: N,
+  onCancel: h,
+  onClose: a,
+  activeLang: c = "zh",
+  onLangChange: t,
+  labels: o,
+  hint: d,
+  confirmLoading: e = !1,
+  width: s,
+  className: v,
+  style: u
 }) {
-  const zhLabel = (labels == null ? void 0 : labels.zh) ?? "中文";
-  const enLabel = (labels == null ? void 0 : labels.en) ?? "EN";
-  if (!open) return null;
-  const isBilingual = mode === "bilingual";
-  const isSingle = mode === "single";
-  const containerStyle = width != null ? { width, ...style } : style;
-  return /* @__PURE__ */ jsx("div", { className: ["bu-modal__overlay", className].filter(Boolean).join(" "), onClick: onClose, children: /* @__PURE__ */ jsxs(
+  const k = (o == null ? void 0 : o.zh) ?? "中文", f = (o == null ? void 0 : o.en) ?? "EN";
+  if (!_) return null;
+  const y = n === "bilingual", w = n === "single", x = s != null ? { width: s, ...u } : u;
+  return /* @__PURE__ */ l("div", { className: ["bu-modal__overlay", v].filter(Boolean).join(" "), onClick: a, children: /* @__PURE__ */ i(
     "div",
     {
       className: "bu-modal__container",
-      style: containerStyle,
-      onClick: (e) => e.stopPropagation(),
+      style: x,
+      onClick: (z) => z.stopPropagation(),
       children: [
-        /* @__PURE__ */ jsxs("div", { className: "bu-modal__header", children: [
-          /* @__PURE__ */ jsx("p", { className: "bu-modal__title", children: title }),
-          isBilingual && /* @__PURE__ */ jsxs("div", { className: "bu-modal__lang-toggle", children: [
-            /* @__PURE__ */ jsx(
+        /* @__PURE__ */ i("div", { className: "bu-modal__header", children: [
+          /* @__PURE__ */ l("p", { className: "bu-modal__title", children: r }),
+          y && /* @__PURE__ */ i("div", { className: "bu-modal__lang-toggle", children: [
+            /* @__PURE__ */ l(
               "button",
               {
                 type: "button",
-                className: `bu-modal__lang-btn${activeLang === "zh" ? " bu-modal__lang-btn--active" : ""}`,
-                onClick: () => onLangChange == null ? void 0 : onLangChange("zh"),
-                children: zhLabel
+                className: `bu-modal__lang-btn${c === "zh" ? " bu-modal__lang-btn--active" : ""}`,
+                onClick: () => t == null ? void 0 : t("zh"),
+                children: k
               }
             ),
-            /* @__PURE__ */ jsx(
+            /* @__PURE__ */ l(
               "button",
               {
                 type: "button",
-                className: `bu-modal__lang-btn${activeLang === "en" ? " bu-modal__lang-btn--active" : ""}`,
-                onClick: () => onLangChange == null ? void 0 : onLangChange("en"),
-                children: enLabel
+                className: `bu-modal__lang-btn${c === "en" ? " bu-modal__lang-btn--active" : ""}`,
+                onClick: () => t == null ? void 0 : t("en"),
+                children: f
               }
             )
           ] }),
-          /* @__PURE__ */ jsx("button", { type: "button", className: "bu-modal__close", onClick: onClose, children: /* @__PURE__ */ jsx("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx("path", { d: "M16.5613 6.73027C16.7558 6.53571 17.0723 6.53442 17.2684 6.72736C17.4644 6.92032 17.4657 7.23444 17.2713 7.42901L12.7036 12.0002L17.2713 16.5714C17.4657 16.766 17.4644 17.0801 17.2684 17.273C17.0723 17.4659 16.7558 17.4646 16.5613 17.2701L11.9996 12.7047L7.43794 17.2701C7.24352 17.4647 6.92699 17.4659 6.73091 17.273C6.53485 17.0801 6.53355 16.7659 6.72798 16.5714L11.2955 12.0002L6.72798 7.42901C6.53355 7.23442 6.53485 6.92032 6.73091 6.72736C6.92698 6.53442 7.2435 6.53571 7.43794 6.73027L11.9996 11.2955L16.5613 6.73027Z", fill: "currentColor" }) }) })
+          /* @__PURE__ */ l("button", { type: "button", className: "bu-modal__close", onClick: a, children: /* @__PURE__ */ l("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ l("path", { d: "M16.5613 6.73027C16.7558 6.53571 17.0723 6.53442 17.2684 6.72736C17.4644 6.92032 17.4657 7.23444 17.2713 7.42901L12.7036 12.0002L17.2713 16.5714C17.4657 16.766 17.4644 17.0801 17.2684 17.273C17.0723 17.4659 16.7558 17.4646 16.5613 17.2701L11.9996 12.7047L7.43794 17.2701C7.24352 17.4647 6.92699 17.4659 6.73091 17.273C6.53485 17.0801 6.53355 16.7659 6.72798 16.5714L11.2955 12.0002L6.72798 7.42901C6.53355 7.23442 6.53485 6.92032 6.73091 6.72736C6.92698 6.53442 7.2435 6.53571 7.43794 6.73027L11.9996 11.2955L16.5613 6.73027Z", fill: "currentColor" }) }) })
         ] }),
-        /* @__PURE__ */ jsx("div", { className: "bu-modal__body", children }),
-        /* @__PURE__ */ jsxs("div", { className: "bu-modal__footer", children: [
-          hint && /* @__PURE__ */ jsx("p", { className: "bu-modal__hint", children: hint }),
-          /* @__PURE__ */ jsxs("div", { className: "bu-modal__btn-row", children: [
-            !isSingle && /* @__PURE__ */ jsx("button", { type: "button", className: "bu-modal__btn-cancel", onClick: onCancel ?? onClose, children: cancelText }),
-            /* @__PURE__ */ jsxs(
+        /* @__PURE__ */ l("div", { className: "bu-modal__body", children: b }),
+        /* @__PURE__ */ i("div", { className: "bu-modal__footer", children: [
+          d && /* @__PURE__ */ l("p", { className: "bu-modal__hint", children: d }),
+          /* @__PURE__ */ i("div", { className: "bu-modal__btn-row", children: [
+            !w && /* @__PURE__ */ l("button", { type: "button", className: "bu-modal__btn-cancel", onClick: h ?? a, children: p }),
+            /* @__PURE__ */ i(
               "button",
               {
                 type: "button",
-                className: ["bu-modal__btn-ok", confirmLoading ? "bu-modal__btn-ok--loading" : ""].filter(Boolean).join(" "),
-                disabled: confirmLoading,
-                onClick: confirmLoading ? void 0 : onOk,
+                className: ["bu-modal__btn-ok", e ? "bu-modal__btn-ok--loading" : ""].filter(Boolean).join(" "),
+                disabled: e,
+                onClick: e ? void 0 : N,
                 children: [
-                  confirmLoading && /* @__PURE__ */ jsx("span", { className: "bu-modal__btn-ok-spinner" }),
-                  okText
+                  e && /* @__PURE__ */ l("span", { className: "bu-modal__btn-ok-spinner" }),
+                  m
                 ]
               }
             )
@@ -81,5 +78,5 @@ function BuModal({
   ) });
 }
 export {
-  BuModal as default
+  j as default
 };

package/dist/web/OverlayScrollbar/BOverlayScrollbar.js

@@ -1,232 +1 @@
-"use strict";
-const jsxRuntime = require("react/jsx-runtime");
-const react = require("react");
-;/* empty css                        */
-const MIN_THUMB_SIZE = 24;
-const HIDE_DELAY = 800;
-const EMPTY_THUMB = { visible: false, offset: 0, length: 0, cross: 0 };
-function BOverlayScrollbar({
-  containerRef,
-  targetRef,
-  selector,
-  direction = "vertical",
-  size = 4,
-  gap = 0,
-  background,
-  showOnHover = true,
-  showOnScroll = true,
-  hoverSelector,
-  horizontalInsetStart = 0,
-  horizontalInsetEnd = 0,
-  horizontalThumbLength,
-  className = ""
-}) {
-  const showVertical = direction === "vertical" || direction === "both";
-  const showHorizontal = direction === "horizontal" || direction === "both";
-  const scrollElementRef = react.useRef(null);
-  const dragRef = react.useRef(null);
-  const hideTimerRef = react.useRef(null);
-  const hoverTargetRef = react.useRef(false);
-  const thumbHoverRef = react.useRef(false);
-  const [verticalThumb, setVerticalThumb] = react.useState(EMPTY_THUMB);
-  const [horizontalThumb, setHorizontalThumb] = react.useState(EMPTY_THUMB);
-  const [active, setActive] = react.useState(!showOnHover);
-  react.useEffect(() => {
-    if (!showOnHover) setActive(true);
-  }, [showOnHover]);
-  const sync = react.useCallback(() => {
-    const element = scrollElementRef.current;
-    const container = containerRef.current;
-    if (!element || !container) return;
-    const { scrollTop, scrollHeight, clientHeight, scrollLeft, scrollWidth, clientWidth } = element;
-    const elementRect = element.getBoundingClientRect();
-    const containerRect = container.getBoundingClientRect();
-    const offsetTop = elementRect.top - containerRect.top;
-    const offsetLeft = elementRect.left - containerRect.left;
-    if (showVertical) {
-      const maxScroll = scrollHeight - clientHeight;
-      if (maxScroll <= 1) {
-        setVerticalThumb((previous) => previous.visible ? EMPTY_THUMB : previous);
-      } else {
-        const length = Math.max(clientHeight / scrollHeight * clientHeight, MIN_THUMB_SIZE);
-        setVerticalThumb({
-          visible: true,
-          offset: offsetTop + scrollTop / maxScroll * (clientHeight - length),
-          length,
-          cross: offsetLeft + clientWidth - size - gap
-        });
-      }
-    }
-    if (showHorizontal) {
-      const maxScroll = scrollWidth - clientWidth;
-      const trackLength = Math.max(clientWidth - horizontalInsetStart - horizontalInsetEnd, 0);
-      if (maxScroll <= 1 || trackLength <= 0) {
-        setHorizontalThumb((previous) => previous.visible ? EMPTY_THUMB : previous);
-      } else {
-        const proportionalLength = clientWidth / scrollWidth * trackLength;
-        const length = Math.min(trackLength, Math.max(horizontalThumbLength ?? proportionalLength, MIN_THUMB_SIZE));
-        setHorizontalThumb({
-          visible: true,
-          offset: offsetLeft + horizontalInsetStart + scrollLeft / maxScroll * (trackLength - length),
-          length,
-          cross: offsetTop + clientHeight - size - gap
-        });
-      }
-    }
-  }, [containerRef, gap, horizontalInsetEnd, horizontalInsetStart, horizontalThumbLength, showHorizontal, showVertical, size]);
-  const wakeUp = react.useCallback(() => {
-    if (!showOnHover) return;
-    const interacting = hoverTargetRef.current || thumbHoverRef.current || dragRef.current;
-    if (!showOnScroll && !interacting) {
-      setActive(false);
-      return;
-    }
-    setActive(true);
-    if (hideTimerRef.current) clearTimeout(hideTimerRef.current);
-    hideTimerRef.current = setTimeout(() => {
-      if (!dragRef.current && !hoverTargetRef.current && !thumbHoverRef.current) setActive(false);
-    }, HIDE_DELAY);
-  }, [showOnHover, showOnScroll]);
-  const onScroll = react.useCallback(() => {
-    sync();
-    wakeUp();
-  }, [sync, wakeUp]);
-  react.useEffect(() => {
-    const container = containerRef.current;
-    if (!container) return;
-    if (window.getComputedStyle(container).position === "static") container.style.position = "relative";
-    let detach;
-    let hoverElement = null;
-    const attach = () => {
-      const element = (targetRef == null ? void 0 : targetRef.current) ?? (selector ? container.querySelector(selector) : container.firstElementChild);
-      if (!element || element === scrollElementRef.current) return;
-      detach == null ? void 0 : detach();
-      scrollElementRef.current = element;
-      element.addEventListener("scroll", onScroll, { passive: true });
-      const observer = new ResizeObserver(sync);
-      observer.observe(element);
-      if (element.firstElementChild) observer.observe(element.firstElementChild);
-      detach = () => {
-        element.removeEventListener("scroll", onScroll);
-        observer.disconnect();
-      };
-      sync();
-    };
-    const onEnter = () => {
-      hoverTargetRef.current = true;
-      if (showOnHover) setActive(true);
-    };
-    const onLeave = () => {
-      hoverTargetRef.current = false;
-      if (showOnHover && !thumbHoverRef.current && !dragRef.current) setActive(false);
-    };
-    const detachHover = () => {
-      hoverElement == null ? void 0 : hoverElement.removeEventListener("mouseenter", onEnter);
-      hoverElement == null ? void 0 : hoverElement.removeEventListener("mouseleave", onLeave);
-      hoverElement = null;
-      hoverTargetRef.current = false;
-    };
-    const attachHover = () => {
-      const next = hoverSelector ? container.querySelector(hoverSelector) : container;
-      if (!next || next === hoverElement) return;
-      detachHover();
-      hoverElement = next;
-      hoverElement.addEventListener("mouseenter", onEnter);
-      hoverElement.addEventListener("mouseleave", onLeave);
-    };
-    attach();
-    attachHover();
-    const mutation = new MutationObserver(() => {
-      if (!scrollElementRef.current || !container.contains(scrollElementRef.current)) attach();
-      if (hoverElement && !container.contains(hoverElement)) detachHover();
-      if (!hoverElement) attachHover();
-      sync();
-    });
-    mutation.observe(container, { childList: true, subtree: true });
-    return () => {
-      mutation.disconnect();
-      detach == null ? void 0 : detach();
-      detachHover();
-      scrollElementRef.current = null;
-      if (hideTimerRef.current) clearTimeout(hideTimerRef.current);
-    };
-  }, [containerRef, hoverSelector, onScroll, selector, showOnHover, sync, targetRef]);
-  const onDragMove = react.useCallback((event) => {
-    const element = scrollElementRef.current;
-    const start = dragRef.current;
-    if (!element || !start) return;
-    const vertical = start.axis === "vertical";
-    const clientSize = vertical ? element.clientHeight : element.clientWidth;
-    const scrollSize = vertical ? element.scrollHeight : element.scrollWidth;
-    const trackLength = vertical ? clientSize : Math.max(clientSize - horizontalInsetStart - horizontalInsetEnd, 0);
-    const proportionalLength = clientSize / scrollSize * trackLength;
-    const thumbLength = Math.min(trackLength, Math.max(vertical ? proportionalLength : horizontalThumbLength ?? proportionalLength, MIN_THUMB_SIZE));
-    const trackRange = trackLength - thumbLength;
-    if (trackRange <= 0) return;
-    const delta = (vertical ? event.clientY : event.clientX) - start.client;
-    const moved = start.scroll + delta * ((scrollSize - clientSize) / trackRange);
-    if (vertical) element.scrollTop = moved;
-    else element.scrollLeft = moved;
-  }, [horizontalInsetEnd, horizontalInsetStart, horizontalThumbLength]);
-  const onDragEnd = react.useCallback(() => {
-    const wasDragging = Boolean(dragRef.current);
-    dragRef.current = null;
-    document.body.style.userSelect = "";
-    document.removeEventListener("mousemove", onDragMove);
-    document.removeEventListener("mouseup", onDragEnd);
-    if (wasDragging) wakeUp();
-  }, [onDragMove, wakeUp]);
-  const startDrag = (axis) => (event) => {
-    const element = scrollElementRef.current;
-    if (!element) return;
-    event.preventDefault();
-    event.stopPropagation();
-    dragRef.current = {
-      axis,
-      client: axis === "vertical" ? event.clientY : event.clientX,
-      scroll: axis === "vertical" ? element.scrollTop : element.scrollLeft
-    };
-    document.body.style.userSelect = "none";
-    document.addEventListener("mousemove", onDragMove);
-    document.addEventListener("mouseup", onDragEnd);
-  };
-  react.useEffect(() => () => {
-    dragRef.current = null;
-    document.body.style.userSelect = "";
-    document.removeEventListener("mousemove", onDragMove);
-    document.removeEventListener("mouseup", onDragEnd);
-  }, [onDragEnd, onDragMove]);
-  const thumbClassName = ["bj-overlay-scrollbar__thumb", active && "bj-overlay-scrollbar__thumb--active", className].filter(Boolean).join(" ");
-  const colorStyle = background ? { "--bj-overlay-scrollbar-bg": background } : void 0;
-  const onThumbEnter = () => {
-    thumbHoverRef.current = true;
-    if (showOnHover) setActive(true);
-  };
-  const onThumbLeave = () => {
-    thumbHoverRef.current = false;
-    if (showOnHover && !hoverTargetRef.current && !dragRef.current) setActive(false);
-  };
-  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    showVertical && verticalThumb.visible && /* @__PURE__ */ jsxRuntime.jsx(
-      "div",
-      {
-        className: `${thumbClassName} bj-overlay-scrollbar__thumb--vertical`,
-        onMouseDown: startDrag("vertical"),
-        onMouseEnter: onThumbEnter,
-        onMouseLeave: onThumbLeave,
-        style: { ...colorStyle, top: verticalThumb.offset, left: verticalThumb.cross, height: verticalThumb.length, width: size }
-      }
-    ),
-    showHorizontal && horizontalThumb.visible && /* @__PURE__ */ jsxRuntime.jsx(
-      "div",
-      {
-        className: `${thumbClassName} bj-overlay-scrollbar__thumb--horizontal`,
-        onMouseDown: startDrag("horizontal"),
-        onMouseEnter: onThumbEnter,
-        onMouseLeave: onThumbLeave,
-        style: { ...colorStyle, left: horizontalThumb.offset, top: horizontalThumb.cross, width: horizontalThumb.length, height: size }
-      }
-    )
-  ] });
-}
-module.exports = BOverlayScrollbar;
+"use strict";const Y=require("react/jsx-runtime"),s=require("react");;/* empty css                        */const $=24,re=800,H={visible:!1,offset:0,length:0,cross:0};function se({containerRef:_,targetRef:j,selector:U,direction:S="vertical",size:E=4,gap:w=0,background:F,showOnHover:l=!0,showOnScroll:Z=!0,hoverSelector:A,horizontalInsetStart:p=0,horizontalInsetEnd:D=0,horizontalThumbLength:R,className:te=""}){const P=S==="vertical"||S==="both",V=S==="horizontal"||S==="both",m=s.useRef(null),f=s.useRef(null),y=s.useRef(null),L=s.useRef(!1),M=s.useRef(!1),[k,G]=s.useState(H),[B,J]=s.useState(H),[ne,v]=s.useState(!l);s.useEffect(()=>{l||v(!0)},[l]);const g=s.useCallback(()=>{const e=m.current,n=_.current;if(!e||!n)return;const{scrollTop:t,scrollHeight:o,clientHeight:c,scrollLeft:d,scrollWidth:u,clientWidth:i}=e,h=e.getBoundingClientRect(),r=n.getBoundingClientRect(),b=h.top-r.top,x=h.left-r.left;if(P){const C=o-c;if(C<=1)G(a=>a.visible?H:a);else{const a=Math.max(c/o*c,$);G({visible:!0,offset:b+t/C*(c-a),length:a,cross:x+i-E-w})}}if(V){const C=u-i,a=Math.max(i-p-D,0);if(C<=1||a<=0)J(W=>W.visible?H:W);else{const W=i/u*a,ee=Math.min(a,Math.max(R??W,$));J({visible:!0,offset:x+p+d/C*(a-ee),length:ee,cross:b+c-E-w})}}},[_,w,D,p,R,V,P,E]),q=s.useCallback(()=>{if(!l)return;const e=L.current||M.current||f.current;if(!Z&&!e){v(!1);return}v(!0),y.current&&clearTimeout(y.current),y.current=setTimeout(()=>{!f.current&&!L.current&&!M.current&&v(!1)},re)},[l,Z]),X=s.useCallback(()=>{g(),q()},[g,q]);s.useEffect(()=>{const e=_.current;if(!e)return;window.getComputedStyle(e).position==="static"&&(e.style.position="relative");let n,t=null;const o=()=>{const r=(j==null?void 0:j.current)??(U?e.querySelector(U):e.firstElementChild);if(!r||r===m.current)return;n==null||n(),m.current=r,r.addEventListener("scroll",X,{passive:!0});const b=new ResizeObserver(g);b.observe(r),r.firstElementChild&&b.observe(r.firstElementChild),n=()=>{r.removeEventListener("scroll",X),b.disconnect()},g()},c=()=>{L.current=!0,l&&v(!0)},d=()=>{L.current=!1,l&&!M.current&&!f.current&&v(!1)},u=()=>{t==null||t.removeEventListener("mouseenter",c),t==null||t.removeEventListener("mouseleave",d),t=null,L.current=!1},i=()=>{const r=A?e.querySelector(A):e;!r||r===t||(u(),t=r,t.addEventListener("mouseenter",c),t.addEventListener("mouseleave",d))};o(),i();const h=new MutationObserver(()=>{(!m.current||!e.contains(m.current))&&o(),t&&!e.contains(t)&&u(),t||i(),g()});return h.observe(e,{childList:!0,subtree:!0}),()=>{h.disconnect(),n==null||n(),u(),m.current=null,y.current&&clearTimeout(y.current)}},[_,A,X,U,l,g,j]);const T=s.useCallback(e=>{const n=m.current,t=f.current;if(!n||!t)return;const o=t.axis==="vertical",c=o?n.clientHeight:n.clientWidth,d=o?n.scrollHeight:n.scrollWidth,u=o?c:Math.max(c-p-D,0),i=c/d*u,h=Math.min(u,Math.max(o?i:R??i,$)),r=u-h;if(r<=0)return;const b=(o?e.clientY:e.clientX)-t.client,x=t.scroll+b*((d-c)/r);o?n.scrollTop=x:n.scrollLeft=x},[D,p,R]),N=s.useCallback(()=>{const e=!!f.current;f.current=null,document.body.style.userSelect="",document.removeEventListener("mousemove",T),document.removeEventListener("mouseup",N),e&&q()},[T,q]),K=e=>n=>{const t=m.current;t&&(n.preventDefault(),n.stopPropagation(),f.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",T),document.addEventListener("mouseup",N))};s.useEffect(()=>()=>{f.current=null,document.body.style.userSelect="",document.removeEventListener("mousemove",T),document.removeEventListener("mouseup",N)},[N,T]);const Q=["bj-overlay-scrollbar__thumb",ne&&"bj-overlay-scrollbar__thumb--active",te].filter(Boolean).join(" "),I=F?{"--bj-overlay-scrollbar-bg":F}:void 0,z=()=>{M.current=!0,l&&v(!0)},O=()=>{M.current=!1,l&&!L.current&&!f.current&&v(!1)};return Y.jsxs(Y.Fragment,{children:[P&&k.visible&&Y.jsx("div",{className:`${Q} bj-overlay-scrollbar__thumb--vertical`,onMouseDown:K("vertical"),onMouseEnter:z,onMouseLeave:O,style:{...I,top:k.offset,left:k.cross,height:k.length,width:E}}),V&&B.visible&&Y.jsx("div",{className:`${Q} bj-overlay-scrollbar__thumb--horizontal`,onMouseDown:K("horizontal"),onMouseEnter:z,onMouseLeave:O,style:{...I,left:B.offset,top:B.cross,width:B.length,height:E}})]})}module.exports=se;