vxe-pc-ui 4.20.2 → 4.20.5

package/lib/scrollbar/src/scrollbar.js

@@ -9,7 +9,6 @@ var _comp = require("../../ui/src/comp");
 var _xeUtils = _interopRequireDefault(require("xe-utils"));
 var _ui = require("../../ui");
 var _dom = require("../../ui/src/dom");
-var _util = require("./util");
 var _utils = require("../../ui/src/utils");
 var _loading = _interopRequireDefault(require("../../loading"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
@@ -17,10 +16,17 @@ const {
   getConfig,
   createEvent,
   domUtils,
+  scrollbarUtils,
   globalResize,
   globalEvents,
   renderEmptyElement
 } = _ui.VxeUI;
+const {
+  getThumbOffsetSize,
+  getThumbSize,
+  getScrollFromClick,
+  getScrollFromDrag
+} = scrollbarUtils;
 function createReactData() {
   return {
     yThumbHeight: 0,
@@ -312,14 +318,14 @@ var _default = exports.default = (0, _comp.defineVxeComponent)({
         return;
       }
       const trackXEl = refTrackXElem.value;
-      const xThumbWidth = trackXEl ? (0, _util.getThumbSize)(viewEl.clientWidth, viewEl.scrollWidth, trackXEl.clientWidth) : 0;
+      const xThumbWidth = trackXEl ? getThumbSize(viewEl.clientWidth, viewEl.scrollWidth, trackXEl.clientWidth) : 0;
       const thumbXElem = refThumbXElem.value;
       if (thumbXElem) {
         thumbXElem.style.width = xThumbWidth + 'px';
       }
       reactData.xThumbWidth = xThumbWidth;
       const trackYEl = refTrackYElem.value;
-      const yThumbHeight = trackYEl ? (0, _util.getThumbSize)(viewEl.clientHeight, viewEl.scrollHeight, trackYEl.clientHeight) : 0;
+      const yThumbHeight = trackYEl ? getThumbSize(viewEl.clientHeight, viewEl.scrollHeight, trackYEl.clientHeight) : 0;
       const thumbYElem = refThumbYElem.value;
       if (thumbYElem) {
         thumbYElem.style.height = yThumbHeight + 'px';
@@ -340,7 +346,7 @@ var _default = exports.default = (0, _comp.defineVxeComponent)({
       } = reactData;
       const trackXEl = refTrackXElem.value;
       const thumbXElem = refThumbXElem.value;
-      const xThumbLeft = trackXEl && xThumbWidth ? (0, _util.getThumbOffsetSize)(viewEl.scrollLeft, viewEl.clientWidth, viewEl.scrollWidth, trackXEl.clientWidth, xThumbWidth) : 0;
+      const xThumbLeft = trackXEl && xThumbWidth ? getThumbOffsetSize(viewEl.scrollLeft, viewEl.clientWidth, viewEl.scrollWidth, trackXEl.clientWidth, xThumbWidth) : 0;
       internalData.xThumbLeft = xThumbLeft;
       if (thumbXElem && xThumbWidth) {
         thumbXElem.style.width = xThumbWidth + 'px';
@@ -348,7 +354,7 @@ var _default = exports.default = (0, _comp.defineVxeComponent)({
       }
       const trackYEl = refTrackYElem.value;
       const thumbYElem = refThumbYElem.value;
-      const yThumbTop = trackYEl && yThumbHeight ? (0, _util.getThumbOffsetSize)(viewEl.scrollTop, viewEl.clientHeight, viewEl.scrollHeight, trackYEl.clientHeight, yThumbHeight) : 0;
+      const yThumbTop = trackYEl && yThumbHeight ? getThumbOffsetSize(viewEl.scrollTop, viewEl.clientHeight, viewEl.scrollHeight, trackYEl.clientHeight, yThumbHeight) : 0;
       internalData.yThumbTop = yThumbTop;
       if (thumbYElem && yThumbHeight) {
         thumbYElem.style.height = yThumbHeight + 'px';
@@ -454,7 +460,7 @@ var _default = exports.default = (0, _comp.defineVxeComponent)({
       } = reactData;
       const trackRect = trackEl.getBoundingClientRect();
       viewEl.scrollTo({
-        left: (0, _util.getScrollFromClick)(evnt.clientX - trackRect.left, viewEl.clientWidth, viewEl.scrollWidth, trackEl.clientWidth, xThumbWidth),
+        left: getScrollFromClick(evnt.clientX - trackRect.left, viewEl.clientWidth, viewEl.scrollWidth, trackEl.clientWidth, xThumbWidth),
         behavior: 'auto'
       });
     };
@@ -472,7 +478,7 @@ var _default = exports.default = (0, _comp.defineVxeComponent)({
       } = reactData;
       const trackRect = trackEl.getBoundingClientRect();
       viewEl.scrollTo({
-        top: (0, _util.getScrollFromClick)(evnt.clientY - trackRect.top, viewEl.clientHeight, viewEl.scrollHeight, trackEl.clientHeight, yThumbHeight),
+        top: getScrollFromClick(evnt.clientY - trackRect.top, viewEl.clientHeight, viewEl.scrollHeight, trackEl.clientHeight, yThumbHeight),
         behavior: 'auto'
       });
     };
@@ -491,7 +497,7 @@ var _default = exports.default = (0, _comp.defineVxeComponent)({
       const trackRect = trackEl.getBoundingClientRect();
       const pointerPosition = evnt.clientX - trackRect.left;
       // 记录 thumb 的偏移
-      const thumbOffset = (0, _util.getThumbOffsetSize)(viewEl.scrollLeft, viewEl.clientWidth, viewEl.scrollWidth, trackEl.clientWidth, xThumbWidth);
+      const thumbOffset = getThumbOffsetSize(viewEl.scrollLeft, viewEl.clientWidth, viewEl.scrollWidth, trackEl.clientWidth, xThumbWidth);
       internalData.thumbDragOffset = pointerPosition - thumbOffset;
     };
     const pointermoveThumbXEvent = evnt => {
@@ -515,7 +521,7 @@ var _default = exports.default = (0, _comp.defineVxeComponent)({
         const trackEl = thumbEl.parentElement;
         const trackRect = trackEl.getBoundingClientRect();
         // 更新偏移
-        viewEl.scrollLeft = (0, _util.getScrollFromDrag)(evnt.clientX - trackRect.left, thumbDragOffset, viewEl.clientWidth, viewEl.scrollWidth, trackEl.clientWidth, xThumbWidth);
+        viewEl.scrollLeft = getScrollFromDrag(evnt.clientX - trackRect.left, thumbDragOffset, viewEl.clientWidth, viewEl.scrollWidth, trackEl.clientWidth, xThumbWidth);
       }
     };
     const cleatPointerThumbEvent = evnt => {
@@ -538,7 +544,7 @@ var _default = exports.default = (0, _comp.defineVxeComponent)({
       const trackRect = trackEl.getBoundingClientRect();
       const pointerPosition = evnt.clientY - trackRect.top;
       // 记录 thumb 的偏移
-      const thumbOffset = (0, _util.getThumbOffsetSize)(viewEl.scrollTop, viewEl.clientHeight, viewEl.scrollHeight, trackEl.clientHeight, yThumbHeight);
+      const thumbOffset = getThumbOffsetSize(viewEl.scrollTop, viewEl.clientHeight, viewEl.scrollHeight, trackEl.clientHeight, yThumbHeight);
       internalData.thumbDragOffset = pointerPosition - thumbOffset;
     };
     const pointermoveThumbYEvent = evnt => {
@@ -562,7 +568,7 @@ var _default = exports.default = (0, _comp.defineVxeComponent)({
         const trackEl = thumbEl.parentElement;
         const trackRect = trackEl.getBoundingClientRect();
         // 更新偏移
-        viewEl.scrollTop = (0, _util.getScrollFromDrag)(evnt.clientY - trackRect.top, thumbDragOffset, viewEl.clientHeight, viewEl.scrollHeight, trackEl.clientHeight, yThumbHeight);
+        viewEl.scrollTop = getScrollFromDrag(evnt.clientY - trackRect.top, thumbDragOffset, viewEl.clientHeight, viewEl.scrollHeight, trackEl.clientHeight, yThumbHeight);
       }
     };
     const scrollbarPrivateMethods = {};

package/lib/scrollbar/src/scrollbar.min.js

@@ -1 +1 @@
-Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_comp=require("../../ui/src/comp"),_xeUtils=_interopRequireDefault(require("xe-utils")),_ui=require("../../ui"),_dom=require("../../ui/src/dom"),_util=require("./util"),_utils=require("../../ui/src/utils"),_loading=_interopRequireDefault(require("../../loading"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}let{getConfig,createEvent,domUtils,globalResize,globalEvents,renderEmptyElement}=_ui.VxeUI;function createReactData(){return{yThumbHeight:0,xThumbWidth:0}}function createInternalData(){return{thumbDragOffset:0,yThumbTop:0,xThumbLeft:0,lastScrollTop:0,lastScrollLeft:0}}var _default=exports.default=(0,_comp.defineVxeComponent)({name:"VxeScrollbar",props:{id:[String,Number],viewId:[String,Number],width:[String,Number],height:[String,Number],minWidth:[String,Number],minHeight:[String,Number],maxWidth:[String,Number],maxHeight:[String,Number],loading:Boolean,native:{type:Boolean,default:()=>getConfig().scrollbar.native},padding:{type:Boolean,default:()=>getConfig().scrollbar.padding},autoHide:{type:Boolean,default:()=>getConfig().scrollbar.autoHide},visible:{type:Boolean,default:()=>getConfig().scrollbar.visible},xConfig:Object,yConfig:Object,className:{type:String,default:()=>getConfig().scrollbar.className},viewAttrs:{type:Object,default:()=>getConfig().scrollbar.viewAttrs},viewClassName:{type:String,default:()=>getConfig().scrollbar.viewClassName},viewInnerClassName:{type:String,default:()=>getConfig().scrollbar.viewInnerClassName},autoResize:{type:Boolean,default:()=>getConfig().scrollbar.autoResize},syncResize:[Boolean,String,Number]},emits:["scroll","scroll-boundary"],setup(h,e){let{emit:i,slots:g}=e;var t=_xeUtils.default.uniqueId();let d=(0,_vue.ref)(),m=(0,_vue.ref)(),f=(0,_vue.ref)(),b=(0,_vue.ref)(),p=(0,_vue.ref)(),_=(0,_vue.ref)(),T=(0,_vue.ref)(),x=(0,_vue.reactive)(createReactData()),C=createInternalData(),y=(0,_vue.computed)(()=>{var{width:e,height:t,minWidth:l,minHeight:i,maxWidth:r,maxHeight:a}=h,o=c.value,u=s.value,n={};return e&&(n.width=(0,_dom.toCssUnit)(e)),t&&(n.height=(0,_dom.toCssUnit)(t)),l&&(n.minWidth=(0,_dom.toCssUnit)(l)),i&&(n.minHeight=(0,_dom.toCssUnit)(i)),r&&(n.maxWidth=(0,_dom.toCssUnit)(r)),a&&(n.maxHeight=(0,_dom.toCssUnit)(a)),(o||u)&&(n["--vxe-ui-scrollbar-y-width"]=(0,_dom.toCssUnit)(o||u),n["--vxe-ui-scrollbar-x-height"]=(0,_dom.toCssUnit)(u||o)),n}),s=(0,_vue.computed)(()=>R.value.height),c=(0,_vue.computed)(()=>L.value.width),H=(0,_vue.computed)(()=>{var e=h.visible,t=R.value;return(0,_utils.getDefaultConfig)(t.visible,e)}),w=(0,_vue.computed)(()=>{var e=h.visible,t=L.value;return(0,_utils.getDefaultConfig)(t.visible,e)}),v=(0,_vue.computed)(()=>{var e=h.autoHide,t=R.value;return(0,_utils.getDefaultConfig)(t.autoHide,e)}),W=(0,_vue.computed)(()=>{var e=h.autoHide,t=L.value;return(0,_utils.getDefaultConfig)(t.autoHide,e)}),S=(0,_vue.computed)(()=>{var{native:e,className:t,padding:l}=h,{yThumbHeight:i,xThumbWidth:r}=x,a=O.value,o=U.value,u=H.value,n=w.value,s=v.value,c=W.value;return domUtils.buildClass(["vxe-scrollbar","ov-x--"+(!1===u?"hidden":"visible"),"ov-y--"+(!1===n?"hidden":"visible"),"sx-pos--"+(a?"top":"bottom"),"sy-pos--"+(o?"left":"right"),e?"is--native":"is--virtual",t],{"is--padding":l,"ov-x--auto-hide":s,"ov-y--auto-hide":c,"overflow-y":i,"overflow-x":r})}),D=(0,_vue.computed)(()=>{var e=h.viewClassName;return domUtils.buildClass(["vxe-scrollbar--view",e])}),N=(0,_vue.computed)(()=>{var e=h.viewInnerClassName;return domUtils.buildClass(["vxe-scrollbar--view-inner",e])}),R=(0,_vue.computed)(()=>Object.assign({},getConfig().scrollbar.xConfig,h.xConfig)),L=(0,_vue.computed)(()=>Object.assign({},getConfig().scrollbar.yConfig,h.yConfig)),O=(0,_vue.computed)(()=>"top"===R.value.position),U=(0,_vue.computed)(()=>"left"===L.value.position),l={refElem:d},r={},z={xID:t,props:h,context:e,reactData:x,internalData:C,getRefMaps:()=>l,getComputeMaps:()=>r},E=(e,t,l)=>{i(e,createEvent(l,{$scrollbar:z},t))};t={dispatchEvent:E,scrollTo(e,t){var l=m.value;l&&(_xeUtils.default.isNumber(e)?l.scrollTo(e,t||0):l.scrollTo(e))},scrollIntoView(){var e=m.value;e&&e.scrollIntoView()},setScrollTop(e){var t=m.value;t&&(t.scrollTop=e)},setScrollLeft(e){var t=m.value;t&&(t.scrollLeft=e)},getScrollTop(){var e=m.value;return e?e.scrollTop:0},getScrollLeft(){var e=m.value;return e?e.scrollLeft:0},clearScroll(){var e=m.value;e&&(e.scrollTop=0,e.scrollLeft=0)},recalculate(){return a(),I(),(0,_vue.nextTick)()}};let a=()=>{var e,t,l=m.value;l&&l.clientHeight&&(t=(t=b.value)?(0,_util.getThumbSize)(l.clientWidth,l.scrollWidth,t.clientWidth):0,(e=_.value)&&(e.style.width=t+"px"),x.xThumbWidth=t,t=(e=p.value)?(0,_util.getThumbSize)(l.clientHeight,l.scrollHeight,e.clientHeight):0,(l=T.value)&&(l.style.height=t+"px"),x.yThumbHeight=t)},I=()=>{var e,t,l,i,r=m.value;r&&r.clientHeight&&({xThumbWidth:t,yThumbHeight:e}=x,i=b.value,l=_.value,i=i&&t?(0,_util.getThumbOffsetSize)(r.scrollLeft,r.clientWidth,r.scrollWidth,i.clientWidth,t):0,C.xThumbLeft=i,l&&t&&(l.style.width=t+"px",l.style.transform=`translateX(${i}px)`),t=p.value,l=T.value,i=t&&e?(0,_util.getThumbOffsetSize)(r.scrollTop,r.clientHeight,r.scrollHeight,t.clientHeight,e):0,C.yThumbTop=i,l)&&e&&(l.style.height=e+"px",l.style.transform=`translateY(${i}px)`)},P=e=>{var{xThumbWidth:t,yThumbHeight:l}=x,{lastScrollTop:i,lastScrollLeft:r}=C,a=R.value,o=L.value,{scrollTop:u,scrollLeft:n,clientWidth:s,clientHeight:c,scrollHeight:v,scrollWidth:h}=e.currentTarget;let g="",d=!1,m=!1,f=!1,b=!1;i!==u&&(o=_xeUtils.default.toNumber(o.threshold)||1,i<u?(g="bottom",0<l&&v-o<=u+c&&(m=!0)):(g="top",0<l&&u<=o&&(d=!0))),r!==n&&(i=_xeUtils.default.toNumber(a.threshold)||1,r<n?(g="right",0<t&&h-i<=n+s&&(b=!0)):(g="left",0<t&&n<=i&&(f=!0))),I(),C.lastScrollTop=u,C.lastScrollLeft=n,(m||d||b||f)&&E("scroll-boundary",{direction:g,isTop:d,isBottom:m,isLeft:f,isRight:b,scrollTop:u,scrollLeft:n,clientWidth:s,clientHeight:c,scrollHeight:v,scrollWidth:h},e),E("scroll",{direction:g,isTop:0<l&&u<=0,isBottom:0<l&&v<=u+c,isLeft:0<t&&n<=0,isRight:0<t&&h<=n+s,scrollTop:u,scrollLeft:n,clientWidth:s,clientHeight:c,scrollHeight:v,scrollWidth:h},e)},q=e=>{var t,l,i,r=e.currentTarget;r===e.target&&(t=m.value)&&(l=x.xThumbWidth,i=r.getBoundingClientRect(),t.scrollTo({left:(0,_util.getScrollFromClick)(e.clientX-i.left,t.clientWidth,t.scrollWidth,r.clientWidth,l),behavior:"auto"}))},k=e=>{var t,l,i,r=e.currentTarget;r===e.target&&(t=m.value)&&(l=x.yThumbHeight,i=r.getBoundingClientRect(),t.scrollTo({top:(0,_util.getScrollFromClick)(e.clientY-i.top,t.clientHeight,t.scrollHeight,r.clientHeight,l),behavior:"auto"}))},j=e=>{var t,l,i=e.currentTarget,r=(C.isThumbDrag=!0,i.setPointerCapture(e.pointerId),m.value);r&&(t=x.xThumbWidth,l=(i=i.parentElement).getBoundingClientRect(),e=e.clientX-l.left,l=(0,_util.getThumbOffsetSize)(r.scrollLeft,r.clientWidth,r.scrollWidth,i.clientWidth,t),C.thumbDragOffset=e-l)},V=t=>{let e=t.currentTarget;if(e.hasPointerCapture(t.pointerId)){var{isThumbDrag:l,thumbDragOffset:i}=C;if(l){l=m.value;if(l){var r=x.xThumbWidth;let e=t.currentTarget;var a=e.parentElement,o=a.getBoundingClientRect();l.scrollLeft=(0,_util.getScrollFromDrag)(t.clientX-o.left,i,l.clientWidth,l.scrollWidth,a.clientWidth,r)}}}},B=e=>{e.currentTarget.releasePointerCapture(e.pointerId),C.isThumbDrag=!1},M=e=>{var t,l,i=e.currentTarget,r=(C.isThumbDrag=!0,i.setPointerCapture(e.pointerId),m.value);r&&(t=x.yThumbHeight,l=(i=i.parentElement).getBoundingClientRect(),e=e.clientY-l.top,l=(0,_util.getThumbOffsetSize)(r.scrollTop,r.clientHeight,r.scrollHeight,i.clientHeight,t),C.thumbDragOffset=e-l)},F=t=>{let e=t.currentTarget;if(e.hasPointerCapture(t.pointerId)){var{isThumbDrag:l,thumbDragOffset:i}=C;if(l){l=m.value;if(l){var r=x.yThumbHeight;let e=t.currentTarget;var a=e.parentElement,o=a.getBoundingClientRect();l.scrollTop=(0,_util.getScrollFromDrag)(t.clientY-o.top,i,l.clientHeight,l.scrollHeight,a.clientHeight,r)}}}};Object.assign(z,t,{});let o=(0,_vue.ref)(0);return(0,_vue.watch)(()=>h.height,()=>{o.value++}),(0,_vue.watch)(()=>h.width,()=>{o.value++}),(0,_vue.watch)(()=>h.minHeight,()=>{o.value++}),(0,_vue.watch)(()=>h.minWidth,()=>{o.value++}),(0,_vue.watch)(()=>h.maxHeight,()=>{o.value++}),(0,_vue.watch)(()=>h.maxWidth,()=>{o.value++}),(0,_vue.watch)(()=>h.native,()=>{o.value++}),(0,_vue.watch)(()=>h.syncResize,()=>{o.value++}),(0,_vue.watch)(c,()=>{o.value++}),(0,_vue.watch)(s,()=>{o.value++}),(0,_vue.watch)(H,()=>{(0,_vue.nextTick)(()=>{o.value++})}),(0,_vue.watch)(w,()=>{(0,_vue.nextTick)(()=>{o.value++})}),(0,_vue.watch)(o,()=>{z.recalculate().then(()=>{z.recalculate()})}),(0,_vue.onMounted)(()=>{var e=h.autoResize,t=m.value,l=f.value;e&&(e=globalResize.create(()=>{h.autoResize&&o.value++}),t&&e.observe(t),l&&e.observe(l),C.resizeObserver=e),o.value++,globalEvents.on(z,"resize",()=>{o.value++})}),(0,_vue.onBeforeUnmount)(()=>{var e=C.resizeObserver;e&&e.disconnect(),globalEvents.off(z,"resize")}),z.renderVN=()=>{var{id:e,native:t,loading:l,viewId:i,viewAttrs:r}=h,a=y.value,o=S.value,u=D.value,n=N.value,s=H.value,c=w.value,v=g.default;return(0,_vue.h)("div",{ref:d,id:e||null,class:o,style:a},[(0,_vue.h)("div",Object.assign({ref:m,class:u,onScroll:P,id:i||null},r),[(0,_vue.h)("div",{key:"vi",ref:f,class:n},v?v({}):[])]),t||!1===s?renderEmptyElement(z):(0,_vue.h)("div",{ref:b,class:"vxe-scrollbar--track-x",onClick:q},[(0,_vue.h)("div",{ref:_,class:"vxe-scrollbar--thumb-x",onPointerdown:j,onPointermove:V,onPointerup:B,onPointercancel:B,onLostpointercapture:B})]),t||!1===c?renderEmptyElement(z):(0,_vue.h)("div",{ref:p,class:"vxe-scrollbar--track-y",onClick:k},[(0,_vue.h)("div",{ref:T,class:"vxe-scrollbar--thumb-y",onPointerdown:M,onPointermove:F,onPointerup:B,onPointercancel:B,onLostpointercapture:B})]),(0,_vue.h)(_loading.default,{class:"vxe-scrollbar--loading",modelValue:l})])},z},render(){return this.renderVN()}});
+Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_comp=require("../../ui/src/comp"),_xeUtils=_interopRequireDefault(require("xe-utils")),_ui=require("../../ui"),_dom=require("../../ui/src/dom"),_utils=require("../../ui/src/utils"),_loading=_interopRequireDefault(require("../../loading"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}let{getConfig,createEvent,domUtils,scrollbarUtils,globalResize,globalEvents,renderEmptyElement}=_ui.VxeUI,{getThumbOffsetSize,getThumbSize,getScrollFromClick,getScrollFromDrag}=scrollbarUtils;function createReactData(){return{yThumbHeight:0,xThumbWidth:0}}function createInternalData(){return{thumbDragOffset:0,yThumbTop:0,xThumbLeft:0,lastScrollTop:0,lastScrollLeft:0}}var _default=exports.default=(0,_comp.defineVxeComponent)({name:"VxeScrollbar",props:{id:[String,Number],viewId:[String,Number],width:[String,Number],height:[String,Number],minWidth:[String,Number],minHeight:[String,Number],maxWidth:[String,Number],maxHeight:[String,Number],loading:Boolean,native:{type:Boolean,default:()=>getConfig().scrollbar.native},padding:{type:Boolean,default:()=>getConfig().scrollbar.padding},autoHide:{type:Boolean,default:()=>getConfig().scrollbar.autoHide},visible:{type:Boolean,default:()=>getConfig().scrollbar.visible},xConfig:Object,yConfig:Object,className:{type:String,default:()=>getConfig().scrollbar.className},viewAttrs:{type:Object,default:()=>getConfig().scrollbar.viewAttrs},viewClassName:{type:String,default:()=>getConfig().scrollbar.viewClassName},viewInnerClassName:{type:String,default:()=>getConfig().scrollbar.viewInnerClassName},autoResize:{type:Boolean,default:()=>getConfig().scrollbar.autoResize},syncResize:[Boolean,String,Number]},emits:["scroll","scroll-boundary"],setup(h,e){let{emit:i,slots:g}=e;var t=_xeUtils.default.uniqueId();let d=(0,_vue.ref)(),m=(0,_vue.ref)(),f=(0,_vue.ref)(),b=(0,_vue.ref)(),p=(0,_vue.ref)(),_=(0,_vue.ref)(),T=(0,_vue.ref)(),x=(0,_vue.reactive)(createReactData()),C=createInternalData(),y=(0,_vue.computed)(()=>{var{width:e,height:t,minWidth:l,minHeight:i,maxWidth:r,maxHeight:a}=h,o=c.value,u=s.value,n={};return e&&(n.width=(0,_dom.toCssUnit)(e)),t&&(n.height=(0,_dom.toCssUnit)(t)),l&&(n.minWidth=(0,_dom.toCssUnit)(l)),i&&(n.minHeight=(0,_dom.toCssUnit)(i)),r&&(n.maxWidth=(0,_dom.toCssUnit)(r)),a&&(n.maxHeight=(0,_dom.toCssUnit)(a)),(o||u)&&(n["--vxe-ui-scrollbar-y-width"]=(0,_dom.toCssUnit)(o||u),n["--vxe-ui-scrollbar-x-height"]=(0,_dom.toCssUnit)(u||o)),n}),s=(0,_vue.computed)(()=>R.value.height),c=(0,_vue.computed)(()=>U.value.width),H=(0,_vue.computed)(()=>{var e=h.visible,t=R.value;return(0,_utils.getDefaultConfig)(t.visible,e)}),w=(0,_vue.computed)(()=>{var e=h.visible,t=U.value;return(0,_utils.getDefaultConfig)(t.visible,e)}),v=(0,_vue.computed)(()=>{var e=h.autoHide,t=R.value;return(0,_utils.getDefaultConfig)(t.autoHide,e)}),S=(0,_vue.computed)(()=>{var e=h.autoHide,t=U.value;return(0,_utils.getDefaultConfig)(t.autoHide,e)}),W=(0,_vue.computed)(()=>{var{native:e,className:t,padding:l}=h,{yThumbHeight:i,xThumbWidth:r}=x,a=z.value,o=L.value,u=H.value,n=w.value,s=v.value,c=S.value;return domUtils.buildClass(["vxe-scrollbar","ov-x--"+(!1===u?"hidden":"visible"),"ov-y--"+(!1===n?"hidden":"visible"),"sx-pos--"+(a?"top":"bottom"),"sy-pos--"+(o?"left":"right"),e?"is--native":"is--virtual",t],{"is--padding":l,"ov-x--auto-hide":s,"ov-y--auto-hide":c,"overflow-y":i,"overflow-x":r})}),D=(0,_vue.computed)(()=>{var e=h.viewClassName;return domUtils.buildClass(["vxe-scrollbar--view",e])}),N=(0,_vue.computed)(()=>{var e=h.viewInnerClassName;return domUtils.buildClass(["vxe-scrollbar--view-inner",e])}),R=(0,_vue.computed)(()=>Object.assign({},getConfig().scrollbar.xConfig,h.xConfig)),U=(0,_vue.computed)(()=>Object.assign({},getConfig().scrollbar.yConfig,h.yConfig)),z=(0,_vue.computed)(()=>"top"===R.value.position),L=(0,_vue.computed)(()=>"left"===U.value.position),l={refElem:d},r={},O={xID:t,props:h,context:e,reactData:x,internalData:C,getRefMaps:()=>l,getComputeMaps:()=>r},E=(e,t,l)=>{i(e,createEvent(l,{$scrollbar:O},t))};t={dispatchEvent:E,scrollTo(e,t){var l=m.value;l&&(_xeUtils.default.isNumber(e)?l.scrollTo(e,t||0):l.scrollTo(e))},scrollIntoView(){var e=m.value;e&&e.scrollIntoView()},setScrollTop(e){var t=m.value;t&&(t.scrollTop=e)},setScrollLeft(e){var t=m.value;t&&(t.scrollLeft=e)},getScrollTop(){var e=m.value;return e?e.scrollTop:0},getScrollLeft(){var e=m.value;return e?e.scrollLeft:0},clearScroll(){var e=m.value;e&&(e.scrollTop=0,e.scrollLeft=0)},recalculate(){return a(),I(),(0,_vue.nextTick)()}};let a=()=>{var e,t,l=m.value;l&&l.clientHeight&&(t=(t=b.value)?getThumbSize(l.clientWidth,l.scrollWidth,t.clientWidth):0,(e=_.value)&&(e.style.width=t+"px"),x.xThumbWidth=t,t=(e=p.value)?getThumbSize(l.clientHeight,l.scrollHeight,e.clientHeight):0,(l=T.value)&&(l.style.height=t+"px"),x.yThumbHeight=t)},I=()=>{var e,t,l,i,r=m.value;r&&r.clientHeight&&({xThumbWidth:t,yThumbHeight:e}=x,i=b.value,l=_.value,i=i&&t?getThumbOffsetSize(r.scrollLeft,r.clientWidth,r.scrollWidth,i.clientWidth,t):0,C.xThumbLeft=i,l&&t&&(l.style.width=t+"px",l.style.transform=`translateX(${i}px)`),t=p.value,l=T.value,i=t&&e?getThumbOffsetSize(r.scrollTop,r.clientHeight,r.scrollHeight,t.clientHeight,e):0,C.yThumbTop=i,l)&&e&&(l.style.height=e+"px",l.style.transform=`translateY(${i}px)`)},P=e=>{var{xThumbWidth:t,yThumbHeight:l}=x,{lastScrollTop:i,lastScrollLeft:r}=C,a=R.value,o=U.value,{scrollTop:u,scrollLeft:n,clientWidth:s,clientHeight:c,scrollHeight:v,scrollWidth:h}=e.currentTarget;let g="",d=!1,m=!1,f=!1,b=!1;i!==u&&(o=_xeUtils.default.toNumber(o.threshold)||1,i<u?(g="bottom",0<l&&v-o<=u+c&&(m=!0)):(g="top",0<l&&u<=o&&(d=!0))),r!==n&&(i=_xeUtils.default.toNumber(a.threshold)||1,r<n?(g="right",0<t&&h-i<=n+s&&(b=!0)):(g="left",0<t&&n<=i&&(f=!0))),I(),C.lastScrollTop=u,C.lastScrollLeft=n,(m||d||b||f)&&E("scroll-boundary",{direction:g,isTop:d,isBottom:m,isLeft:f,isRight:b,scrollTop:u,scrollLeft:n,clientWidth:s,clientHeight:c,scrollHeight:v,scrollWidth:h},e),E("scroll",{direction:g,isTop:0<l&&u<=0,isBottom:0<l&&v<=u+c,isLeft:0<t&&n<=0,isRight:0<t&&h<=n+s,scrollTop:u,scrollLeft:n,clientWidth:s,clientHeight:c,scrollHeight:v,scrollWidth:h},e)},k=e=>{var t,l,i,r=e.currentTarget;r===e.target&&(t=m.value)&&(l=x.xThumbWidth,i=r.getBoundingClientRect(),t.scrollTo({left:getScrollFromClick(e.clientX-i.left,t.clientWidth,t.scrollWidth,r.clientWidth,l),behavior:"auto"}))},q=e=>{var t,l,i,r=e.currentTarget;r===e.target&&(t=m.value)&&(l=x.yThumbHeight,i=r.getBoundingClientRect(),t.scrollTo({top:getScrollFromClick(e.clientY-i.top,t.clientHeight,t.scrollHeight,r.clientHeight,l),behavior:"auto"}))},j=e=>{var t,l,i=e.currentTarget,r=(C.isThumbDrag=!0,i.setPointerCapture(e.pointerId),m.value);r&&(t=x.xThumbWidth,l=(i=i.parentElement).getBoundingClientRect(),e=e.clientX-l.left,l=getThumbOffsetSize(r.scrollLeft,r.clientWidth,r.scrollWidth,i.clientWidth,t),C.thumbDragOffset=e-l)},V=t=>{let e=t.currentTarget;if(e.hasPointerCapture(t.pointerId)){var{isThumbDrag:l,thumbDragOffset:i}=C;if(l){l=m.value;if(l){var r=x.xThumbWidth;let e=t.currentTarget;var a=e.parentElement,o=a.getBoundingClientRect();l.scrollLeft=getScrollFromDrag(t.clientX-o.left,i,l.clientWidth,l.scrollWidth,a.clientWidth,r)}}}},B=e=>{e.currentTarget.releasePointerCapture(e.pointerId),C.isThumbDrag=!1},F=e=>{var t,l,i=e.currentTarget,r=(C.isThumbDrag=!0,i.setPointerCapture(e.pointerId),m.value);r&&(t=x.yThumbHeight,l=(i=i.parentElement).getBoundingClientRect(),e=e.clientY-l.top,l=getThumbOffsetSize(r.scrollTop,r.clientHeight,r.scrollHeight,i.clientHeight,t),C.thumbDragOffset=e-l)},M=t=>{let e=t.currentTarget;if(e.hasPointerCapture(t.pointerId)){var{isThumbDrag:l,thumbDragOffset:i}=C;if(l){l=m.value;if(l){var r=x.yThumbHeight;let e=t.currentTarget;var a=e.parentElement,o=a.getBoundingClientRect();l.scrollTop=getScrollFromDrag(t.clientY-o.top,i,l.clientHeight,l.scrollHeight,a.clientHeight,r)}}}};Object.assign(O,t,{});let o=(0,_vue.ref)(0);return(0,_vue.watch)(()=>h.height,()=>{o.value++}),(0,_vue.watch)(()=>h.width,()=>{o.value++}),(0,_vue.watch)(()=>h.minHeight,()=>{o.value++}),(0,_vue.watch)(()=>h.minWidth,()=>{o.value++}),(0,_vue.watch)(()=>h.maxHeight,()=>{o.value++}),(0,_vue.watch)(()=>h.maxWidth,()=>{o.value++}),(0,_vue.watch)(()=>h.native,()=>{o.value++}),(0,_vue.watch)(()=>h.syncResize,()=>{o.value++}),(0,_vue.watch)(c,()=>{o.value++}),(0,_vue.watch)(s,()=>{o.value++}),(0,_vue.watch)(H,()=>{(0,_vue.nextTick)(()=>{o.value++})}),(0,_vue.watch)(w,()=>{(0,_vue.nextTick)(()=>{o.value++})}),(0,_vue.watch)(o,()=>{O.recalculate().then(()=>{O.recalculate()})}),(0,_vue.onMounted)(()=>{var e=h.autoResize,t=m.value,l=f.value;e&&(e=globalResize.create(()=>{h.autoResize&&o.value++}),t&&e.observe(t),l&&e.observe(l),C.resizeObserver=e),o.value++,globalEvents.on(O,"resize",()=>{o.value++})}),(0,_vue.onBeforeUnmount)(()=>{var e=C.resizeObserver;e&&e.disconnect(),globalEvents.off(O,"resize")}),O.renderVN=()=>{var{id:e,native:t,loading:l,viewId:i,viewAttrs:r}=h,a=y.value,o=W.value,u=D.value,n=N.value,s=H.value,c=w.value,v=g.default;return(0,_vue.h)("div",{ref:d,id:e||null,class:o,style:a},[(0,_vue.h)("div",Object.assign({ref:m,class:u,onScroll:P,id:i||null},r),[(0,_vue.h)("div",{key:"vi",ref:f,class:n},v?v({}):[])]),t||!1===s?renderEmptyElement(O):(0,_vue.h)("div",{ref:b,class:"vxe-scrollbar--track-x",onClick:k},[(0,_vue.h)("div",{ref:_,class:"vxe-scrollbar--thumb-x",onPointerdown:j,onPointermove:V,onPointerup:B,onPointercancel:B,onLostpointercapture:B})]),t||!1===c?renderEmptyElement(O):(0,_vue.h)("div",{ref:p,class:"vxe-scrollbar--track-y",onClick:q},[(0,_vue.h)("div",{ref:T,class:"vxe-scrollbar--thumb-y",onPointerdown:F,onPointermove:M,onPointerup:B,onPointercancel:B,onLostpointercapture:B})]),(0,_vue.h)(_loading.default,{class:"vxe-scrollbar--loading",modelValue:l})])},O},render(){return this.renderVN()}});