@aplus-frontend/ui/lib/src/scroll-bar/internal.vue.js

"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("vue");require("../config-provider/index.js");const D=require("./hooks/use-track.js"),S=require("./utils/index.js"),T=require("../config-provider/hooks/use-namespace.js"),P=t.defineComponent({__name:"internal",props:{direction:{default:"vertical"},scroll:{default:0},barLength:{default:35},width:{},barColor:{},trackColor:{},trackWidth:{},disabled:{type:Boolean,default:!1},showTrack:{type:Boolean,default:!0},trackSpeed:{default:2},onScrollStart:{},onScroll:{},onScrollEnd:{}},setup(w,{expose:y}){const r=w,p=t.ref(),i=t.ref(),l=t.ref(),{b:E,e:h,m:L,em:c,cssVar:C}=T.useNamespace("scroll-bar"),o=t.ref(r.scroll),{handleMouseDown:b}=D.useTrack({currentScroll:o,track:i,bar:l,type:t.toRef(r,"direction"),trackSpeed:t.toRef(r,"trackSpeed"),barLength:t.toRef(r,"barLength"),disabled:t.toRef(r,"disabled"),onDown:e=>{r.onScrollStart?.(e)},onUp:e=>{r.onScrollEnd?.(e)},onScroll:e=>{r.onScroll?.(e)}});t.watch(()=>r.scroll,e=>{o.value=e}),t.watchEffect(()=>{if(!t.unref(l))return;const e=`${(100-r.barLength)*o.value/r.barLength}%`,n=`${r.barLength}%`;r.direction==="vertical"?(l.value.style.height=n,l.value.style.transform=`translate3d(0, ${e}, 0)`):(l.value.style.width=n,l.value.style.transform=`translate3d(${e}, 0, 0)`)});let f,s,u;function R(e){if(r.disabled||e.button!==0)return;e.preventDefault(),e.stopPropagation();const n=t.unref(i),a=t.unref(l);if(!n||!a)return;document.addEventListener("pointermove",k),document.addEventListener("pointerup",v);const d=n.getBoundingClientRect(),g=a.getBoundingClientRect();r.direction==="vertical"?(f=d.height,s=g.top-d.top,u=e.clientY):(f=d.width,s=g.left-d.left,u=e.clientX),r.onScrollStart?.(t.unref(o))}function k(e){e.stopPropagation(),e.preventDefault();let n;r.direction==="vertical"?n=s+e.clientY-u:n=s+e.clientX-u;const a=n/f/(100-r.barLength)*1e4;o.value=S.ensureRangeValue(a),r.onScroll?.(t.unref(o))}function v(e){e.preventDefault(),document.removeEventListener("pointermove",k),document.removeEventListener("pointerup",v),r.onScrollEnd?.(t.unref(o))}function m(e){e.cancelable&&(e.stopPropagation(),e.preventDefault())}function M(e){Math.abs(t.unref(o)-e)<=.001||(o.value=S.ensureRangeValue(e))}return y({currentScroll:o,container:p,bar:l,track:i,scroll:M}),(e,n)=>(t.openBlock(),t.createElementBlock("div",{ref_key:"container",ref:p,class:t.normalizeClass([t.unref(E)(),t.unref(L)(e.direction)]),style:t.normalizeStyle(t.unref(C)({"bar-color":e.barColor,"track-color":e.trackColor,"bar-width":e.width?`${e.width}px`:void 0,"track-width":e.trackWidth?`${e.trackWidth}px`:void 0}))},[t.createElementVNode("div",{ref_key:"track",ref:i,class:t.normalizeClass([t.unref(h)("track"),e.disabled?t.unref(c)("track","disabled"):null,e.showTrack?null:t.unref(c)("track","hidden")]),onPointerdown:n[0]||(n[0]=(...a)=>t.unref(b)&&t.unref(b)(...a)),onTouchstart:m},null,34),t.createElementVNode("div",{ref_key:"bar",ref:l,class:t.normalizeClass([t.unref(h)("bar"),t.unref(c)("bar",e.direction),e.disabled?t.unref(c)("bar","disabled"):null]),onPointerdown:R,onTouchstart:m},null,34)],6))}});exports.default=P;