dk-plus/es/dkscrollbar/src/index2.js

DK-PLUS

import { defineComponent as u, ref as g, reactive as h, toRefs as L } from "vue";
import { dkScrollbar as S } from "./index3.js";
import "../../_icon/index.js";
import { getDkScroll as $ } from "../../_hooks/get-scrollbar/index.js";
const D = u({
  name: "DkScrollbar",
  props: S,
  emits: ["scroll"],
  setup(l, { emit: n }) {
    const { classList: i, styleList: e, wrapperClassList: m } = $(l), p = l, r = g(e), c = r.value["--scrollbar-thumb-color"], f = c && c.replace(/rgba\((\d+),\s*(\d+),\s*(\d+),\s*(\d+)\)/, "$1, $2, $3"), d = h({
      transition(s, t) {
        let o = t;
        const b = () => {
          r.value["--scrollbar-thumb-color"] = `rgba(${f}, ${o})`;
        }, a = () => {
          o += s, o < 1 && o > 0 && (b(), requestAnimationFrame(a));
        };
        a();
      },
      handleScrollChange(s) {
        const t = s.target, o = {
          scrollTop: t.scrollTop,
          scrollLeft: t.scrollLeft
        };
        n("scroll", o);
      }
    });
    return {
      ...p,
      classList: i,
      styleList: e,
      wrapperClassList: m,
      ...L(d),
      scrollBarStyle: r
    };
  }
});
export {
  D as default
};