| 1 |
- import{c as V,h as u,L as B,F as x,k as n,g as p,H as ee,e as i,an as te,w as le,ao as q,ap as ae,aq as re,o as oe,ar as ie,as as j}from"./index-Cd2JsgaO.js";import{Q as $,a as ne}from"./QScrollObserver-DaC2mRIK.js";import{T as D}from"./TouchPan-Y70gTfBa.js";import{b as z}from"./format-hlGAdIUH.js";const ue=V({props:["store","barStyle","verticalBarStyle","horizontalBarStyle"],setup(l){return()=>[u("div",{class:l.store.scroll.vertical.barClass.value,style:[l.barStyle,l.verticalBarStyle],"aria-hidden":"true",onMousedown:l.store.onVerticalMousedown}),u("div",{class:l.store.scroll.horizontal.barClass.value,style:[l.barStyle,l.horizontalBarStyle],"aria-hidden":"true",onMousedown:l.store.onHorizontalMousedown}),B(u("div",{ref:l.store.scroll.vertical.ref,class:l.store.scroll.vertical.thumbClass.value,style:l.store.scroll.vertical.style.value,"aria-hidden":"true"}),l.store.thumbVertDir),B(u("div",{ref:l.store.scroll.horizontal.ref,class:l.store.scroll.horizontal.thumbClass.value,style:l.store.scroll.horizontal.style.value,"aria-hidden":"true"}),l.store.thumbHorizDir)]}}),Q=["vertical","horizontal"],M={vertical:{offset:"offsetY",scroll:"scrollTop",dir:"down",dist:"y"},horizontal:{offset:"offsetX",scroll:"scrollLeft",dir:"right",dist:"x"}},k={prevent:!0,mouse:!0,mouseAllDir:!0},R=l=>l>=250?50:Math.ceil(l/5),fe=V({name:"QScrollArea",props:{...x,thumbStyle:Object,verticalThumbStyle:Object,horizontalThumbStyle:Object,barStyle:[Array,String,Object],verticalBarStyle:[Array,String,Object],horizontalBarStyle:[Array,String,Object],verticalOffset:{type:Array,default:[0,0]},horizontalOffset:{type:Array,default:[0,0]},contentStyle:[Array,String,Object],contentActiveStyle:[Array,String,Object],delay:{type:[String,Number],default:1e3},visible:{type:Boolean,default:null},tabindex:[String,Number],onScroll:Function},setup(l,{slots:E,emit:F}){const d=n(!1),f=n(!1),m=n(!1),r={vertical:n(0),horizontal:n(0)},e={vertical:{ref:n(null),position:n(0),size:n(0)},horizontal:{ref:n(null),position:n(0),size:n(0)}},{proxy:c}=p(),L=ee(l,c.$q);let S=null,T;const s=n(null),N=i(()=>"q-scrollarea"+(L.value===!0?" q-scrollarea--dark":""));Object.assign(r,{verticalInner:i(()=>r.vertical.value-l.verticalOffset[0]-l.verticalOffset[1]),horizontalInner:i(()=>r.horizontal.value-l.horizontalOffset[0]-l.horizontalOffset[1])}),e.vertical.percentage=i(()=>{const t=e.vertical.size.value-r.vertical.value;if(t<=0)return 0;const a=z(e.vertical.position.value/t,0,1);return Math.round(a*1e4)/1e4}),e.vertical.thumbHidden=i(()=>(l.visible===null?m.value:l.visible)!==!0&&d.value===!1&&f.value===!1||e.vertical.size.value<=r.vertical.value+1),e.vertical.thumbStart=i(()=>l.verticalOffset[0]+e.vertical.percentage.value*(r.verticalInner.value-e.vertical.thumbSize.value)),e.vertical.thumbSize=i(()=>Math.round(z(r.verticalInner.value*r.verticalInner.value/e.vertical.size.value,R(r.verticalInner.value),r.verticalInner.value))),e.vertical.style=i(()=>({...l.thumbStyle,...l.verticalThumbStyle,top:`${e.vertical.thumbStart.value}px`,height:`${e.vertical.thumbSize.value}px`,right:`${l.horizontalOffset[1]}px`})),e.vertical.thumbClass=i(()=>"q-scrollarea__thumb q-scrollarea__thumb--v absolute-right"+(e.vertical.thumbHidden.value===!0?" q-scrollarea__thumb--invisible":"")),e.vertical.barClass=i(()=>"q-scrollarea__bar q-scrollarea__bar--v absolute-right"+(e.vertical.thumbHidden.value===!0?" q-scrollarea__bar--invisible":"")),e.horizontal.percentage=i(()=>{const t=e.horizontal.size.value-r.horizontal.value;if(t<=0)return 0;const a=z(Math.abs(e.horizontal.position.value)/t,0,1);return Math.round(a*1e4)/1e4}),e.horizontal.thumbHidden=i(()=>(l.visible===null?m.value:l.visible)!==!0&&d.value===!1&&f.value===!1||e.horizontal.size.value<=r.horizontal.value+1),e.horizontal.thumbStart=i(()=>l.horizontalOffset[0]+e.horizontal.percentage.value*(r.horizontalInner.value-e.horizontal.thumbSize.value)),e.horizontal.thumbSize=i(()=>Math.round(z(r.horizontalInner.value*r.horizontalInner.value/e.horizontal.size.value,R(r.horizontalInner.value),r.horizontalInner.value))),e.horizontal.style=i(()=>({...l.thumbStyle,...l.horizontalThumbStyle,[c.$q.lang.rtl===!0?"right":"left"]:`${e.horizontal.thumbStart.value}px`,width:`${e.horizontal.thumbSize.value}px`,bottom:`${l.verticalOffset[1]}px`})),e.horizontal.thumbClass=i(()=>"q-scrollarea__thumb q-scrollarea__thumb--h absolute-bottom"+(e.horizontal.thumbHidden.value===!0?" q-scrollarea__thumb--invisible":"")),e.horizontal.barClass=i(()=>"q-scrollarea__bar q-scrollarea__bar--h absolute-bottom"+(e.horizontal.thumbHidden.value===!0?" q-scrollarea__bar--invisible":""));const U=i(()=>e.vertical.thumbHidden.value===!0&&e.horizontal.thumbHidden.value===!0?l.contentStyle:l.contentActiveStyle);function I(){const t={};return Q.forEach(a=>{const o=e[a];Object.assign(t,{[a+"Position"]:o.position.value,[a+"Percentage"]:o.percentage.value,[a+"Size"]:o.size.value,[a+"ContainerSize"]:r[a].value,[a+"ContainerInnerSize"]:r[a+"Inner"].value})}),t}const P=te(()=>{const t=I();t.ref=c,F("scroll",t)},0);function H(t,a,o){if(Q.includes(t)===!1){console.error("[QScrollArea]: wrong first param of setScrollPosition (vertical/horizontal)");return}(t==="vertical"?j:q)(s.value,a,o)}function X({height:t,width:a}){let o=!1;r.vertical.value!==t&&(r.vertical.value=t,o=!0),r.horizontal.value!==a&&(r.horizontal.value=a,o=!0),o===!0&&y()}function Y({position:t}){let a=!1;e.vertical.position.value!==t.top&&(e.vertical.position.value=t.top,a=!0),e.horizontal.position.value!==t.left&&(e.horizontal.position.value=t.left,a=!0),a===!0&&y()}function G({height:t,width:a}){e.horizontal.size.value!==a&&(e.horizontal.size.value=a,y()),e.vertical.size.value!==t&&(e.vertical.size.value=t,y())}function A(t,a){const o=e[a];if(t.isFirst===!0){if(o.thumbHidden.value===!0)return;T=o.position.value,f.value=!0}else if(f.value!==!0)return;t.isFinal===!0&&(f.value=!1);const h=M[a],b=(o.size.value-r[a].value)/(r[a+"Inner"].value-o.thumbSize.value),_=t.distance[h.dist],O=T+(t.direction===h.dir?1:-1)*_*b;C(O,a)}function w(t,a){const o=e[a];if(o.thumbHidden.value!==!0){const h=a==="vertical"?l.verticalOffset[0]:l.horizontalOffset[0],b=t[M[a].offset]-h,_=o.thumbStart.value-h;if(b<_||b>_+o.thumbSize.value){const O=b-o.thumbSize.value/2,Z=z(O/(r[a+"Inner"].value-o.thumbSize.value),0,1);C(Z*Math.max(0,o.size.value-r[a].value),a)}o.ref.value!==null&&o.ref.value.dispatchEvent(new MouseEvent(t.type,t))}}function y(){d.value=!0,S!==null&&clearTimeout(S),S=setTimeout(()=>{S=null,d.value=!1},l.delay),l.onScroll!==void 0&&P()}function C(t,a){s.value[M[a].scroll]=t}let v=null;function J(){v!==null&&clearTimeout(v),v=setTimeout(()=>{v=null,m.value=!0},c.$q.platform.is.ios?50:0)}function K(){v!==null&&(clearTimeout(v),v=null),m.value=!1}let g=null;le(()=>c.$q.lang.rtl,t=>{s.value!==null&&q(s.value,Math.abs(e.horizontal.position.value)*(t===!0?-1:1))}),ae(()=>{g={top:e.vertical.position.value,left:e.horizontal.position.value}}),re(()=>{if(g===null)return;const t=s.value;t!==null&&(q(t,g.left),j(t,g.top))}),oe(P.cancel),Object.assign(c,{getScrollTarget:()=>s.value,getScroll:I,getScrollPosition:()=>({top:e.vertical.position.value,left:e.horizontal.position.value}),getScrollPercentage:()=>({top:e.vertical.percentage.value,left:e.horizontal.percentage.value}),setScrollPosition:H,setScrollPercentage(t,a,o){H(t,a*(e[t].size.value-r[t].value)*(t==="horizontal"&&c.$q.lang.rtl===!0?-1:1),o)}});const W={scroll:e,thumbVertDir:[[D,t=>{A(t,"vertical")},void 0,{vertical:!0,...k}]],thumbHorizDir:[[D,t=>{A(t,"horizontal")},void 0,{horizontal:!0,...k}]],onVerticalMousedown(t){w(t,"vertical")},onHorizontalMousedown(t){w(t,"horizontal")}};return()=>u("div",{class:N.value,onMouseenter:J,onMouseleave:K},[u("div",{ref:s,class:"q-scrollarea__container scroll relative-position fit hide-scrollbar",tabindex:l.tabindex!==void 0?l.tabindex:void 0},[u("div",{class:"q-scrollarea__content absolute",style:U.value},ie(E.default,[u($,{debounce:0,onResize:G})])),u(ne,{axis:"both",onScroll:Y})]),u($,{debounce:0,onResize:X}),u(ue,{store:W,barStyle:l.barStyle,verticalBarStyle:l.verticalBarStyle,horizontalBarStyle:l.horizontalBarStyle})])}});export{fe as Q};
|
