import { defineComponent as b, toRef as z, shallowRef as g, ref as x, watchEffect as _, unref as a, watch as k, computed as s, openBlock as C, createBlock as R, mergeProps as B, createCommentVNode as L } from "vue";
import { useResizeObserver as w } from "@vueuse/core";
import { omit as y } from "lodash-unified";
import "./internal.vue2.mjs";
import { getScrollable as u, ensureRangeValue as E } from "./utils/index.mjs";
import N from "./internal.vue.mjs";
const j = /* @__PURE__ */ b({
  name: "ScrollBar",
  __name: "index",
  props: {
    scrollContainer: {},
    extraSize: { default: 0 },
    direction: { default: "vertical" },
    scroll: {},
    barLength: { default: 30 },
    width: {},
    barColor: {},
    trackColor: {},
    trackWidth: {},
    disabled: { type: Boolean, default: !1 },
    showTrack: { type: Boolean, default: !0 },
    trackSpeed: { default: 2 },
    onScrollStart: {},
    onScroll: {},
    onScrollEnd: {}
  },
  setup(p, { expose: S }) {
    const r = p, o = z(r, "scrollContainer"), l = g(), n = x(r.barLength);
    function m() {
      if (!o.value || !l.value) return;
      const { totalSize: e, visibleSize: t, distance: c } = u(
        o.value,
        r.direction
      ), i = c / (e + r.extraSize - t || 1) * 100;
      l.value.scroll(i);
    }
    function f() {
      const { visibleSize: e, totalSize: t } = u(
        o.value,
        r.direction
      );
      n.value = E(
        e / (t + r.extraSize || 1) * 100
      );
    }
    w(o, () => {
      f();
    }), _(
      () => {
        const e = a(o.value);
        e && (f(), e.addEventListener("scroll", m));
      },
      { flush: "post" }
    ), k(
      () => r.barLength,
      (e) => {
        n.value = e;
      }
    );
    function d(e) {
      const t = a(o);
      if (!t) return;
      const { totalSize: c, visibleSize: i, topOrLeft: v } = u(
        t,
        r.direction
      );
      if (c <= i) return;
      const h = `scroll${v}`;
      t[h] = e * (c + r.extraSize - i) / 100;
    }
    return S({
      currentScroll: s(() => a(l.value?.currentScroll)),
      scroll: d,
      visible: s(() => n.value < 100),
      rootElement: s(() => a(l.value?.container))
    }), (e, t) => n.value !== 100 ? (C(), R(N, B({
      key: 0,
      ref_key: "barRef",
      ref: l
    }, a(y)(r, ["onScroll", "extraSize", "scrollContainer"]), {
      "bar-length": n.value,
      onScroll: d
    }), null, 16, ["bar-length"])) : L("", !0);
  }
});
export {
  j as default
};
