| 1 |
- import{a5 as We,ac as Ge,ah as D,af as n,ai as m,ag as U,dF as he,dT as Qe,dU as qe,d as Je,ab as Ze,ao as ge,r as k,dG as eo,U as w,al as oo,ak as to,A as fe,p as ao,ap as ve,dI as no,dH as ee,ad as f,dK as ro,dL as lo,dy as io,dN as so,_ as co,dQ as j,aw as O,ax as _,S as Z}from"./index-d5898469-1724872791500.js";const uo={railHeight:"4px",railWidthVertical:"4px",handleSize:"18px",dotHeight:"8px",dotWidth:"8px",dotBorderRadius:"4px"},ho=a=>{const l="rgba(0, 0, 0, .85)",y="0 2px 8px 0 rgba(0, 0, 0, 0.12)",{railColor:v,primaryColor:s,baseColor:d,cardColor:z,modalColor:R,popoverColor:L,borderRadius:K,fontSize:M,opacityDisabled:B}=a;return Object.assign(Object.assign({},uo),{fontSize:M,markFontSize:M,railColor:v,railColorHover:v,fillColor:s,fillColorHover:s,opacityDisabled:B,handleColor:"#FFF",dotColor:z,dotColorModal:R,dotColorPopover:L,handleBoxShadow:"0 1px 4px 0 rgba(0, 0, 0, 0.3), inset 0 0 1px 0 rgba(0, 0, 0, 0.05)",handleBoxShadowHover:"0 1px 4px 0 rgba(0, 0, 0, 0.3), inset 0 0 1px 0 rgba(0, 0, 0, 0.05)",handleBoxShadowActive:"0 1px 4px 0 rgba(0, 0, 0, 0.3), inset 0 0 1px 0 rgba(0, 0, 0, 0.05)",handleBoxShadowFocus:"0 1px 4px 0 rgba(0, 0, 0, 0.3), inset 0 0 1px 0 rgba(0, 0, 0, 0.05)",indicatorColor:l,indicatorBoxShadow:y,indicatorTextColor:d,indicatorBorderRadius:K,dotBorder:"2px solid ".concat(v),dotBorderActive:"2px solid ".concat(s),dotBoxShadow:""})},fo={name:"Slider",common:We,self:ho},vo=fo;function me(a){return window.TouchEvent&&a instanceof window.TouchEvent}function be(){const a=new Map,l=y=>v=>{a.set(y,v)};return Ge(()=>{a.clear()}),[a,l]}const mo=D([n("slider","\n display: block;\n padding: calc((var(--n-handle-size) - var(--n-rail-height)) / 2) 0;\n position: relative;\n z-index: 0;\n width: 100%;\n cursor: pointer;\n user-select: none;\n -webkit-user-select: none;\n ",[m("reverse",[n("slider-handles",[n("slider-handle-wrapper","\n transform: translate(50%, -50%);\n ")]),n("slider-dots",[n("slider-dot","\n transform: translateX(50%, -50%);\n ")]),m("vertical",[n("slider-handles",[n("slider-handle-wrapper","\n transform: translate(-50%, -50%);\n ")]),n("slider-marks",[n("slider-mark","\n transform: translateY(calc(-50% + var(--n-dot-height) / 2));\n ")]),n("slider-dots",[n("slider-dot","\n transform: translateX(-50%) translateY(0);\n ")])])]),m("vertical","\n padding: 0 calc((var(--n-handle-size) - var(--n-rail-height)) / 2);\n width: var(--n-rail-width-vertical);\n height: 100%;\n ",[n("slider-handles","\n top: calc(var(--n-handle-size) / 2);\n right: 0;\n bottom: calc(var(--n-handle-size) / 2);\n left: 0;\n ",[n("slider-handle-wrapper","\n top: unset;\n left: 50%;\n transform: translate(-50%, 50%);\n ")]),n("slider-rail","\n height: 100%;\n ",[U("fill","\n top: unset;\n right: 0;\n bottom: unset;\n left: 0;\n ")]),m("with-mark","\n width: var(--n-rail-width-vertical);\n margin: 0 32px 0 8px;\n "),n("slider-marks","\n top: calc(var(--n-handle-size) / 2);\n right: unset;\n bottom: calc(var(--n-handle-size) / 2);\n left: 22px;\n font-size: var(--n-mark-font-size);\n ",[n("slider-mark","\n transform: translateY(50%);\n white-space: nowrap;\n ")]),n("slider-dots","\n top: calc(var(--n-handle-size) / 2);\n right: unset;\n bottom: calc(var(--n-handle-size) / 2);\n left: 50%;\n ",[n("slider-dot","\n transform: translateX(-50%) translateY(50%);\n ")])]),m("disabled","\n cursor: not-allowed;\n opacity: var(--n-opacity-disabled);\n ",[n("slider-handle","\n cursor: not-allowed;\n ")]),m("with-mark","\n width: 100%;\n margin: 8px 0 32px 0;\n "),D("&:hover",[n("slider-rail",{backgroundColor:"var(--n-rail-color-hover)"},[U("fill",{backgroundColor:"var(--n-fill-color-hover)"})]),n("slider-handle",{boxShadow:"var(--n-handle-box-shadow-hover)"})]),m("active",[n("slider-rail",{backgroundColor:"var(--n-rail-color-hover)"},[U("fill",{backgroundColor:"var(--n-fill-color-hover)"})]),n("slider-handle",{boxShadow:"var(--n-handle-box-shadow-hover)"})]),n("slider-marks","\n position: absolute;\n top: 18px;\n left: calc(var(--n-handle-size) / 2);\n right: calc(var(--n-handle-size) / 2);\n ",[n("slider-mark","\n position: absolute;\n transform: translateX(-50%);\n white-space: nowrap;\n ")]),n("slider-rail","\n width: 100%;\n position: relative;\n height: var(--n-rail-height);\n background-color: var(--n-rail-color);\n transition: background-color .3s var(--n-bezier);\n border-radius: calc(var(--n-rail-height) / 2);\n ",[U("fill","\n position: absolute;\n top: 0;\n bottom: 0;\n border-radius: calc(var(--n-rail-height) / 2);\n transition: background-color .3s var(--n-bezier);\n background-color: var(--n-fill-color);\n ")]),n("slider-handles","\n position: absolute;\n top: 0;\n right: calc(var(--n-handle-size) / 2);\n bottom: 0;\n left: calc(var(--n-handle-size) / 2);\n ",[n("slider-handle-wrapper","\n outline: none;\n position: absolute;\n top: 50%;\n transform: translate(-50%, -50%);\n cursor: pointer;\n display: flex;\n ",[n("slider-handle","\n height: var(--n-handle-size);\n width: var(--n-handle-size);\n border-radius: 50%;\n overflow: hidden;\n transition: box-shadow .2s var(--n-bezier), background-color .3s var(--n-bezier);\n background-color: var(--n-handle-color);\n box-shadow: var(--n-handle-box-shadow);\n ",[D("&:hover","\n box-shadow: var(--n-handle-box-shadow-hover);\n ")]),D("&:focus",[n("slider-handle","\n box-shadow: var(--n-handle-box-shadow-focus);\n ",[D("&:hover","\n box-shadow: var(--n-handle-box-shadow-active);\n ")])])])]),n("slider-dots","\n position: absolute;\n top: 50%;\n left: calc(var(--n-handle-size) / 2);\n right: calc(var(--n-handle-size) / 2);\n ",[m("transition-disabled",[n("slider-dot","transition: none;")]),n("slider-dot","\n transition:\n border-color .3s var(--n-bezier),\n box-shadow .3s var(--n-bezier),\n background-color .3s var(--n-bezier);\n position: absolute;\n transform: translate(-50%, -50%);\n height: var(--n-dot-height);\n width: var(--n-dot-width);\n border-radius: var(--n-dot-border-radius);\n overflow: hidden;\n box-sizing: border-box;\n border: var(--n-dot-border);\n background-color: var(--n-dot-color);\n ",[m("active","border: var(--n-dot-border-active);")])])]),n("slider-handle-indicator","\n font-size: var(--n-font-size);\n padding: 6px 10px;\n border-radius: var(--n-indicator-border-radius);\n color: var(--n-indicator-text-color);\n background-color: var(--n-indicator-color);\n box-shadow: var(--n-indicator-box-shadow);\n ",[he()]),n("slider-handle-indicator","\n font-size: var(--n-font-size);\n padding: 6px 10px;\n border-radius: var(--n-indicator-border-radius);\n color: var(--n-indicator-text-color);\n background-color: var(--n-indicator-color);\n box-shadow: var(--n-indicator-box-shadow);\n ",[m("top","\n margin-bottom: 12px;\n "),m("right","\n margin-left: 12px;\n "),m("bottom","\n margin-top: 12px;\n "),m("left","\n margin-right: 12px;\n "),he()]),Qe(n("slider",[n("slider-dot","background-color: var(--n-dot-color-modal);")])),qe(n("slider",[n("slider-dot","background-color: var(--n-dot-color-popover);")]))]),bo=0,go=Object.assign(Object.assign({},ge.props),{to:ee.propTo,defaultValue:{type:[Number,Array],default:0},marks:Object,disabled:{type:Boolean,default:void 0},formatTooltip:Function,keyboard:{type:Boolean,default:!0},min:{type:Number,default:0},max:{type:Number,default:100},step:{type:[Number,String],default:1},range:Boolean,value:[Number,Array],placement:String,showTooltip:{type:Boolean,default:void 0},tooltip:{type:Boolean,default:!0},vertical:Boolean,reverse:Boolean,"onUpdate:value":[Function,Array],onUpdateValue:[Function,Array],onDragstart:[Function],onDragend:[Function]}),wo=Je({name:"Slider",props:go,setup(a){const{mergedClsPrefixRef:l,namespaceRef:y,inlineThemeDisabled:v}=Ze(a),s=ge("Slider","-slider",mo,vo,a,l),d=k(null),[z,R]=be(),[L,K]=be(),M=k(new Set),B=eo(a),{mergedDisabledRef:$}=B,oe=w(()=>{const{step:e}=a;if(Number(e)<=0||e==="mark")return 0;const o=e.toString();let t=0;return o.includes(".")&&(t=o.length-o.indexOf(".")-1),t}),X=k(a.defaultValue),pe=oo(a,"value"),Y=to(pe,X),b=w(()=>{const{value:e}=Y;return(a.range?e:[e]).map(se)}),te=w(()=>b.value.length>2),we=w(()=>a.placement===void 0?a.vertical?"right":"top":a.placement),ae=w(()=>{const{marks:e}=a;return e?Object.keys(e).map(parseFloat):null}),g=k(-1),ne=k(-1),C=k(-1),S=k(!1),F=k(!1),W=w(()=>{const{vertical:e,reverse:o}=a;return e?o?"top":"bottom":o?"right":"left"}),xe=w(()=>{if(te.value)return;const e=b.value,o=H(a.range?Math.min(...e):a.min),t=H(a.range?Math.max(...e):e[0]),{value:r}=W;return a.vertical?{[r]:"".concat(o,"%"),height:"".concat(t-o,"%")}:{[r]:"".concat(o,"%"),width:"".concat(t-o,"%")}}),ke=w(()=>{const e=[],{marks:o}=a;if(o){const t=b.value.slice();t.sort((u,h)=>u-h);const{value:r}=W,{value:i}=te,{range:c}=a,p=i?()=>!1:u=>c?u>=t[0]&&u<=t[t.length-1]:u<=t[0];for(const u of Object.keys(o)){const h=Number(u);e.push({active:p(h),label:o[u],style:{[r]:"".concat(H(h),"%")}})}}return e});function ye(e,o){const t=H(e),{value:r}=W;return{[r]:"".concat(t,"%"),zIndex:o===g.value?1:0}}function re(e){return a.showTooltip||C.value===e||g.value===e&&S.value}function Re(e){return S.value?!(g.value===e&&ne.value===e):!0}function Ce(e){var o;~e&&(g.value=e,(o=z.get(e))===null||o===void 0||o.focus())}function Se(){L.forEach((e,o)=>{re(o)&&e.syncPosition()})}function le(e){const{"onUpdate:value":o,onUpdateValue:t}=a,{nTriggerFormInput:r,nTriggerFormChange:i}=B;t&&j(t,e),o&&j(o,e),X.value=e,r(),i()}function ie(e){const{range:o}=a;if(o){if(Array.isArray(e)){const{value:t}=b;e.join()!==t.join()&&le(e)}}else Array.isArray(e)||b.value[0]!==e&&le(e)}function G(e,o){if(a.range){const t=b.value.slice();t.splice(o,1,e),ie(t)}else ie(e)}function Q(e,o,t){const r=t!==void 0;t||(t=e-o>0?1:-1);const i=ae.value||[],{step:c}=a;if(c==="mark"){const h=I(e,i.concat(o),r?t:void 0);return h?h.value:o}if(c<=0)return o;const{value:p}=oe;let u;if(r){const h=Number((o/c).toFixed(p)),x=Math.floor(h),q=h>x?x:x-1,J=h<x?x:x+1;u=I(o,[Number((q*c).toFixed(p)),Number((J*c).toFixed(p)),...i],t)}else{const h=Te(e);u=I(e,[...i,h])}return u?se(u.value):o}function se(e){return Math.min(a.max,Math.max(a.min,e))}function H(e){const{max:o,min:t}=a;return(e-t)/(o-t)*100}function ze(e){const{max:o,min:t}=a;return t+(o-t)*e}function Te(e){const{step:o,min:t}=a;if(Number(o)<=0||o==="mark")return e;const r=Math.round((e-t)/o)*o+t;return Number(r.toFixed(oe.value))}function I(e,o=ae.value,t){if(!(o!=null&&o.length))return null;let r=null,i=-1;for(;++i<o.length;){const c=o[i]-e,p=Math.abs(c);(t===void 0||c*t>0)&&(r===null||p<r.distance)&&(r={index:i,distance:p,value:o[i]})}return r}function de(e){const o=d.value;if(!o)return;const t=me(e)?e.touches[0]:e,r=o.getBoundingClientRect();let i;return a.vertical?i=(r.bottom-t.clientY)/r.height:i=(t.clientX-r.left)/r.width,a.reverse&&(i=1-i),ze(i)}function Ve(e){if($.value||!a.keyboard)return;const{vertical:o,reverse:t}=a;switch(e.key){case"ArrowUp":e.preventDefault(),A(o&&t?-1:1);break;case"ArrowRight":e.preventDefault(),A(!o&&t?-1:1);break;case"ArrowDown":e.preventDefault(),A(o&&t?1:-1);break;case"ArrowLeft":e.preventDefault(),A(!o&&t?1:-1);break}}function A(e){const o=g.value;if(o===-1)return;const{step:t}=a,r=b.value[o],i=Number(t)<=0||t==="mark"?r:r+t*e;G(Q(i,r,e>0?1:-1),o)}function De(e){var o,t;if($.value||!me(e)&&e.button!==bo)return;const r=de(e);if(r===void 0)return;const i=b.value.slice(),c=a.range?(t=(o=I(r,i))===null||o===void 0?void 0:o.index)!==null&&t!==void 0?t:-1:0;c!==-1&&(e.preventDefault(),Ce(c),Me(),G(Q(r,b.value[c]),c))}function Me(){S.value||(S.value=!0,a.onDragstart&&j(a.onDragstart),O("touchend",document,P),O("mouseup",document,P),O("touchmove",document,N),O("mousemove",document,N))}function E(){S.value&&(S.value=!1,a.onDragend&&j(a.onDragend),_("touchend",document,P),_("mouseup",document,P),_("touchmove",document,N),_("mousemove",document,N))}function N(e){const{value:o}=g;if(!S.value||o===-1){E();return}const t=de(e);t!==void 0&&G(Q(t,b.value[o]),o)}function P(){E()}function Be(e){g.value=e,$.value||(C.value=e)}function $e(e){g.value===e&&(g.value=-1,E()),C.value===e&&(C.value=-1)}function Fe(e){C.value=e}function He(e){C.value===e&&(C.value=-1)}fe(g,(e,o)=>void Z(()=>ne.value=o)),fe(Y,()=>{if(a.marks){if(F.value)return;F.value=!0,Z(()=>{F.value=!1})}Z(Se)}),ao(()=>{E()});const ce=w(()=>{const{self:{markFontSize:e,railColor:o,railColorHover:t,fillColor:r,fillColorHover:i,handleColor:c,opacityDisabled:p,dotColor:u,dotColorModal:h,handleBoxShadow:x,handleBoxShadowHover:q,handleBoxShadowActive:J,handleBoxShadowFocus:Ie,dotBorder:Ae,dotBoxShadow:Ee,railHeight:Ne,railWidthVertical:Pe,handleSize:Ue,dotHeight:je,dotWidth:Oe,dotBorderRadius:_e,fontSize:Le,dotBorderActive:Ke,dotColorPopover:Xe},common:{cubicBezierEaseInOut:Ye}}=s.value;return{"--n-bezier":Ye,"--n-dot-border":Ae,"--n-dot-border-active":Ke,"--n-dot-border-radius":_e,"--n-dot-box-shadow":Ee,"--n-dot-color":u,"--n-dot-color-modal":h,"--n-dot-color-popover":Xe,"--n-dot-height":je,"--n-dot-width":Oe,"--n-fill-color":r,"--n-fill-color-hover":i,"--n-font-size":Le,"--n-handle-box-shadow":x,"--n-handle-box-shadow-active":J,"--n-handle-box-shadow-focus":Ie,"--n-handle-box-shadow-hover":q,"--n-handle-color":c,"--n-handle-size":Ue,"--n-opacity-disabled":p,"--n-rail-color":o,"--n-rail-color-hover":t,"--n-rail-height":Ne,"--n-rail-width-vertical":Pe,"--n-mark-font-size":e}}),T=v?ve("slider",void 0,ce,a):void 0,ue=w(()=>{const{self:{fontSize:e,indicatorColor:o,indicatorBoxShadow:t,indicatorTextColor:r,indicatorBorderRadius:i}}=s.value;return{"--n-font-size":e,"--n-indicator-border-radius":i,"--n-indicator-box-shadow":t,"--n-indicator-color":o,"--n-indicator-text-color":r}}),V=v?ve("slider-indicator",void 0,ue,a):void 0;return{mergedClsPrefix:l,namespace:y,uncontrolledValue:X,mergedValue:Y,mergedDisabled:$,mergedPlacement:we,isMounted:no(),adjustedTo:ee(a),dotTransitionDisabled:F,markInfos:ke,isShowTooltip:re,shouldKeepTooltipTransition:Re,handleRailRef:d,setHandleRefs:R,setFollowerRefs:K,fillStyle:xe,getHandleStyle:ye,activeIndex:g,arrifiedValues:b,followerEnabledIndexSet:M,handleRailMouseDown:De,handleHandleFocus:Be,handleHandleBlur:$e,handleHandleMouseEnter:Fe,handleHandleMouseLeave:He,handleRailKeyDown:Ve,indicatorCssVars:v?void 0:ue,indicatorThemeClass:V==null?void 0:V.themeClass,indicatorOnRender:V==null?void 0:V.onRender,cssVars:v?void 0:ce,themeClass:T==null?void 0:T.themeClass,onRender:T==null?void 0:T.onRender}},render(){var a;const{mergedClsPrefix:l,themeClass:y,formatTooltip:v}=this;return(a=this.onRender)===null||a===void 0||a.call(this),f("div",{class:["".concat(l,"-slider"),y,{["".concat(l,"-slider--disabled")]:this.mergedDisabled,["".concat(l,"-slider--active")]:this.activeIndex!==-1,["".concat(l,"-slider--with-mark")]:this.marks,["".concat(l,"-slider--vertical")]:this.vertical,["".concat(l,"-slider--reverse")]:this.reverse}],style:this.cssVars,onKeydown:this.handleRailKeyDown,onMousedown:this.handleRailMouseDown,onTouchstart:this.handleRailMouseDown},f("div",{class:"".concat(l,"-slider-rail")},f("div",{class:"".concat(l,"-slider-rail__fill"),style:this.fillStyle}),this.marks?f("div",{class:["".concat(l,"-slider-dots"),this.dotTransitionDisabled&&"".concat(l,"-slider-dots--transition-disabled")]},this.markInfos.map(s=>f("div",{key:s.label,class:["".concat(l,"-slider-dot"),{["".concat(l,"-slider-dot--active")]:s.active}],style:s.style}))):null,f("div",{ref:"handleRailRef",class:"".concat(l,"-slider-handles")},this.arrifiedValues.map((s,d)=>{const z=this.isShowTooltip(d);return f(ro,null,{default:()=>[f(lo,null,{default:()=>f("div",{ref:this.setHandleRefs(d),class:"".concat(l,"-slider-handle-wrapper"),tabindex:this.mergedDisabled?-1:0,style:this.getHandleStyle(s,d),onFocus:()=>{this.handleHandleFocus(d)},onBlur:()=>{this.handleHandleBlur(d)},onMouseenter:()=>{this.handleHandleMouseEnter(d)},onMouseleave:()=>{this.handleHandleMouseLeave(d)}},io(this.$slots.thumb,()=>[f("div",{class:"".concat(l,"-slider-handle")})]))}),this.tooltip&&f(so,{ref:this.setFollowerRefs(d),show:z,to:this.adjustedTo,enabled:this.showTooltip&&!this.range||this.followerEnabledIndexSet.has(d),teleportDisabled:this.adjustedTo===ee.tdkey,placement:this.mergedPlacement,containerClass:this.namespace},{default:()=>f(co,{name:"fade-in-scale-up-transition",appear:this.isMounted,css:this.shouldKeepTooltipTransition(d),onEnter:()=>{this.followerEnabledIndexSet.add(d)},onAfterLeave:()=>{this.followerEnabledIndexSet.delete(d)}},{default:()=>{var R;return z?((R=this.indicatorOnRender)===null||R===void 0||R.call(this),f("div",{class:["".concat(l,"-slider-handle-indicator"),this.indicatorThemeClass,"".concat(l,"-slider-handle-indicator--").concat(this.mergedPlacement)],style:this.indicatorCssVars},typeof v=="function"?v(s):s)):null}})})]})})),this.marks?f("div",{class:"".concat(l,"-slider-marks")},this.markInfos.map(s=>f("div",{key:s.label,class:"".concat(l,"-slider-mark"),style:s.style},s.label))):null))}});export{wo as N};
|
