classroom-instruments/dist/Slider-legacy-78bcbcd3-1694675857467.js

System.register(["./index-legacy-35b1c5cd-1694675857467.js"],(function(e,n){"use strict";var o,r,a,t,l,i,d,s,c,u,h,v,f,p,b,m,g,x,w,k,y,z,C,S,B,R,T,$,D,F,H,M;return{setters:[e=>{o=e.cq,r=e.r,a=e.b0,t=e.cP,l=e.cm,i=e.cS,d=e.cR,s=e.cQ,c=e.dx,u=e.dy,h=e.d,v=e.cT,f=e.cU,p=e.cX,b=e.L,m=e.bA,g=e.cW,x=e.y,w=e.o,k=e.c$,y=e.cZ,z=e.cY,C=e.aG,S=e.d0,B=e.d1,R=e.cI,T=e.d3,$=e.T,D=e.dz,F=e.dA,H=e.E,M=e.d7}],execute:function(){const n={railHeight:"4px",railWidthVertical:"4px",handleSize:"18px",dotHeight:"8px",dotWidth:"8px",dotBorderRadius:"4px"},A={name:"Slider",common:o,self:e=>{const{railColor:o,primaryColor:r,baseColor:a,cardColor:t,modalColor:l,popoverColor:i,borderRadius:d,fontSize:s,opacityDisabled:c}=e;return Object.assign(Object.assign({},n),{fontSize:s,markFontSize:s,railColor:o,railColorHover:o,fillColor:r,fillColorHover:r,opacityDisabled:c,handleColor:"#FFF",dotColor:t,dotColorModal:l,dotColorPopover:i,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:"rgba(0, 0, 0, .85)",indicatorBoxShadow:"0 2px 8px 0 rgba(0, 0, 0, 0.12)",indicatorTextColor:a,indicatorBorderRadius:d,dotBorder:`2px solid ${o}`,dotBorderActive:`2px solid ${r}`,dotBoxShadow:""})}};function N(e){return window.TouchEvent&&e instanceof window.TouchEvent}function V(){const e=r(new Map);return a((()=>{e.value.clear()})),[e,n=>o=>{e.value.set(n,o)}]}const j=t([l("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 ",[i("reverse",[l("slider-handles",[l("slider-handle-wrapper","\n transform: translate(50%, -50%);\n ")]),l("slider-dots",[l("slider-dot","\n transform: translateX(50%, -50%);\n ")]),i("vertical",[l("slider-handles",[l("slider-handle-wrapper","\n transform: translate(-50%, -50%);\n ")]),l("slider-marks",[l("slider-mark","\n transform: translateY(calc(-50% + var(--n-dot-height) / 2));\n ")]),l("slider-dots",[l("slider-dot","\n transform: translateX(-50%) translateY(0);\n ")])])]),i("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 ",[l("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 ",[l("slider-handle-wrapper","\n top: unset;\n left: 50%;\n transform: translate(-50%, 50%);\n ")]),l("slider-rail","\n height: 100%;\n ",[d("fill","\n top: unset;\n right: 0;\n bottom: unset;\n left: 0;\n ")]),i("with-mark","\n width: var(--n-rail-width-vertical);\n margin: 0 32px 0 8px;\n "),l("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 ",[l("slider-mark","\n transform: translateY(50%);\n white-space: nowrap;\n ")]),l("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 ",[l("slider-dot","\n transform: translateX(-50%) translateY(50%);\n ")])]),i("disabled","\n cursor: not-allowed;\n opacity: var(--n-opacity-disabled);\n ",[l("slider-handle","\n cursor: not-allowed;\n ")]),i("with-mark","\n width: 100%;\n margin: 8px 0 32px 0;\n "),t("&:hover",[l("slider-rail",{backgroundColor:"var(--n-rail-color-hover)"},[d("fill",{backgroundColor:"var(--n-fill-color-hover)"})]),l("slider-handle",{boxShadow:"var(--n-handle-box-shadow-hover)"})]),i("active",[l("slider-rail",{backgroundColor:"var(--n-rail-color-hover)"},[d("fill",{backgroundColor:"var(--n-fill-color-hover)"})]),l("slider-handle",{boxShadow:"var(--n-handle-box-shadow-hover)"})]),l("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 ",[l("slider-mark","\n position: absolute;\n transform: translateX(-50%);\n white-space: nowrap;\n ")]),l("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 ",[d("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 ")]),l("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 ",[l("slider-handle-wrapper","\n outline: none;\n position: absolute;\n top: 50%;\n transform: translate(-50%, -50%);\n cursor: pointer;\n display: flex;\n ",[l("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 ",[t("&:hover","\n box-shadow: var(--n-handle-box-shadow-hover);\n ")]),t("&:focus",[l("slider-handle","\n box-shadow: var(--n-handle-box-shadow-focus);\n ",[t("&:hover","\n box-shadow: var(--n-handle-box-shadow-active);\n ")])])])]),l("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 ",[i("transition-disabled",[l("slider-dot","transition: none;")]),l("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 ",[i("active","border: var(--n-dot-border-active);")])])]),l("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 ",[s()]),l("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 ",[i("top","\n margin-bottom: 12px;\n "),i("right","\n margin-left: 12px;\n "),i("bottom","\n margin-top: 12px;\n "),i("left","\n margin-right: 12px;\n "),s()]),c(l("slider",[l("slider-dot","background-color: var(--n-dot-color-modal);")])),u(l("slider",[l("slider-dot","background-color: var(--n-dot-color-popover);")]))]),I=Object.assign(Object.assign({},f.props),{to:z.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]});e("N",h({name:"Slider",props:I,setup(e){const{mergedClsPrefixRef:n,namespaceRef:o,inlineThemeDisabled:a}=v(e),t=f("Slider","-slider",j,A,e,n),l=r(null),[i,d]=V(),[s,c]=V(),u=r(new Set),h=p(e),{mergedDisabledRef:C}=h,S=b((()=>{const{step:n}=e;if(Number(n)<=0||"mark"===n)return 0;const o=n.toString();let r=0;return o.includes(".")&&(r=o.length-o.indexOf(".")-1),r})),B=r(e.defaultValue),R=m(e,"value"),T=g(R,B),$=b((()=>{const{value:n}=T;return(e.range?n:[n]).map(ne)})),I=b((()=>$.value.length>2)),E=b((()=>void 0===e.placement?e.vertical?"right":"top":e.placement)),O=b((()=>{const{marks:n}=e;return n?Object.keys(n).map(parseFloat):null})),P=r(-1),U=r(-1),X=r(-1),Y=r(!1),K=r(!1),L=b((()=>{const{vertical:n,reverse:o}=e;return n?o?"top":"bottom":o?"right":"left"})),W=b((()=>{if(I.value)return;const n=$.value,o=oe(e.range?Math.min(...n):e.min),r=oe(e.range?Math.max(...n):n[0]),{value:a}=L;return e.vertical?{[a]:`${o}%`,height:r-o+"%"}:{[a]:`${o}%`,width:r-o+"%"}})),_=b((()=>{const n=[],{marks:o}=e;if(o){const r=$.value.slice();r.sort(((e,n)=>e-n));const{value:a}=L,{value:t}=I,{range:l}=e,i=t?()=>!1:e=>l?e>=r[0]&&e<=r[r.length-1]:e<=r[0];for(const e of Object.keys(o)){const r=Number(e);n.push({active:i(r),label:o[e],style:{[a]:`${oe(r)}%`}})}}return n}));function q(n){return e.showTooltip||X.value===n||P.value===n&&Y.value}function G(){s.value.forEach(((e,n)=>{q(n)&&e.syncPosition()}))}function Q(n){const{"onUpdate:value":o,onUpdateValue:r}=e,{nTriggerFormInput:a,nTriggerFormChange:t}=h;r&&M(r,n),o&&M(o,n),B.value=n,a(),t()}function Z(n){const{range:o}=e;if(o){if(Array.isArray(n)){const{value:e}=$;n.join()!==e.join()&&Q(n)}}else Array.isArray(n)||$.value[0]!==n&&Q(n)}function J(n,o){if(e.range){const e=$.value.slice();e.splice(o,1,n),Z(e)}else Z(n)}function ee(n,o,r){const a=void 0!==r;r||(r=n-o>0?1:-1);const t=O.value||[],{step:l}=e;if("mark"===l){const e=re(n,t.concat(o),a?r:void 0);return e?e.value:o}if(l<=0)return o;const{value:i}=S;let d;if(a){const e=Number((o/l).toFixed(i)),n=Math.floor(e),a=e<n?n:n+1;d=re(o,[Number(((e>n?n:n-1)*l).toFixed(i)),Number((a*l).toFixed(i)),...t],r)}else{const o=function(n){const{step:o,min:r}=e;if(Number(o)<=0||"mark"===o)return n;const a=Math.round((n-r)/o)*o+r;return Number(a.toFixed(S.value))}(n);d=re(n,[...t,o])}return d?ne(d.value):o}function ne(n){return Math.min(e.max,Math.max(e.min,n))}function oe(n){const{max:o,min:r}=e;return(n-r)/(o-r)*100}function re(e,n=O.value,o){if(!(null==n?void 0:n.length))return null;let r=null,a=-1;for(;++a<n.length;){const t=n[a]-e,l=Math.abs(t);(void 0===o||t*o>0)&&(null===r||l<r.distance)&&(r={index:a,distance:l,value:n[a]})}return r}function ae(n){const o=l.value;if(!o)return;const r=N(n)?n.touches[0]:n,a=o.getBoundingClientRect();let t;return t=e.vertical?(a.bottom-r.clientY)/a.height:(r.clientX-a.left)/a.width,e.reverse&&(t=1-t),function(n){const{max:o,min:r}=e;return r+(o-r)*n}(t)}function te(n){const o=P.value;if(-1===o)return;const{step:r}=e,a=$.value[o];J(ee(Number(r)<=0||"mark"===r?a:a+r*n,a,n>0?1:-1),o)}function le(){Y.value&&(Y.value=!1,F("touchend",document,de),F("mouseup",document,de),F("touchmove",document,ie),F("mousemove",document,ie))}function ie(e){const{value:n}=P;Y.value&&-1!==n?J(ee(ae(e),$.value[n]),n):le()}function de(){le()}x(P,((e,n)=>{H((()=>U.value=n))})),x(T,(()=>{if(e.marks){if(K.value)return;K.value=!0,H((()=>{K.value=!1}))}H(G)})),w((()=>{le()}));const se=b((()=>{const{self:{markFontSize:e,railColor:n,railColorHover:o,fillColor:r,fillColorHover:a,handleColor:l,opacityDisabled:i,dotColor:d,dotColorModal:s,handleBoxShadow:c,handleBoxShadowHover:u,handleBoxShadowActive:h,handleBoxShadowFocus:v,dotBorder:f,dotBoxShadow:p,railHeight:b,railWidthVertical:m,handleSize:g,dotHeight:x,dotWidth:w,dotBorderRadius:k,fontSize:y,dotBorderActive:z,dotColorPopover:C},common:{cubicBezierEaseInOut:S}}=t.value;return{"--n-bezier":S,"--n-dot-border":f,"--n-dot-border-active":z,"--n-dot-border-radius":k,"--n-dot-box-shadow":p,"--n-dot-color":d,"--n-dot-color-modal":s,"--n-dot-color-popover":C,"--n-dot-height":x,"--n-dot-width":w,"--n-fill-color":r,"--n-fill-color-hover":a,"--n-font-size":y,"--n-handle-box-shadow":c,"--n-handle-box-shadow-active":h,"--n-handle-box-shadow-focus":v,"--n-handle-box-shadow-hover":u,"--n-handle-color":l,"--n-handle-size":g,"--n-opacity-disabled":i,"--n-rail-color":n,"--n-rail-color-hover":o,"--n-rail-height":b,"--n-rail-width-vertical":m,"--n-mark-font-size":e}})),ce=a?k("slider",void 0,se,e):void 0,ue=b((()=>{const{self:{fontSize:e,indicatorColor:n,indicatorBoxShadow:o,indicatorTextColor:r,indicatorBorderRadius:a}}=t.value;return{"--n-font-size":e,"--n-indicator-border-radius":a,"--n-indicator-box-shadow":o,"--n-indicator-color":n,"--n-indicator-text-color":r}})),he=a?k("slider-indicator",void 0,ue,e):void 0;return{mergedClsPrefix:n,namespace:o,uncontrolledValue:B,mergedValue:T,mergedDisabled:C,mergedPlacement:E,isMounted:y(),adjustedTo:z(e),dotTransitionDisabled:K,markInfos:_,isShowTooltip:q,shouldKeepTooltipTransition:function(e){return!Y.value||!(P.value===e&&U.value===e)},handleRailRef:l,setHandleRefs:d,setFollowerRefs:c,fillStyle:W,getHandleStyle:function(e,n){const o=oe(e),{value:r}=L;return{[r]:`${o}%`,zIndex:n===P.value?1:0}},activeIndex:P,arrifiedValues:$,followerEnabledIndexSet:u,handleRailMouseDown:function(n){var o,r;if(C.value)return;if(!N(n)&&0!==n.button)return;const a=ae(n);if(void 0===a)return;const t=$.value.slice(),l=e.range?null!==(r=null===(o=re(a,t))||void 0===o?void 0:o.index)&&void 0!==r?r:-1:0;-1!==l&&(n.preventDefault(),function(e){var n;~e&&(P.value=e,null===(n=i.value.get(e))||void 0===n||n.focus())}(l),Y.value||(Y.value=!0,D("touchend",document,de),D("mouseup",document,de),D("touchmove",document,ie),D("mousemove",document,ie)),J(ee(a,$.value[l]),l))},handleHandleFocus:function(e){P.value=e,C.value||(X.value=e)},handleHandleBlur:function(e){P.value===e&&(P.value=-1,le()),X.value===e&&(X.value=-1)},handleHandleMouseEnter:function(e){X.value=e},handleHandleMouseLeave:function(e){X.value===e&&(X.value=-1)},handleRailKeyDown:function(n){if(C.value||!e.keyboard)return;const{vertical:o,reverse:r}=e;switch(n.key){case"ArrowUp":n.preventDefault(),te(o&&r?-1:1);break;case"ArrowRight":n.preventDefault(),te(!o&&r?-1:1);break;case"ArrowDown":n.preventDefault(),te(o&&r?1:-1);break;case"ArrowLeft":n.preventDefault(),te(!o&&r?1:-1)}},indicatorCssVars:a?void 0:ue,indicatorThemeClass:null==he?void 0:he.themeClass,indicatorOnRender:null==he?void 0:he.onRender,cssVars:a?void 0:se,themeClass:null==ce?void 0:ce.themeClass,onRender:null==ce?void 0:ce.onRender}},render(){var e;const{mergedClsPrefix:n,themeClass:o,formatTooltip:r}=this;return null===(e=this.onRender)||void 0===e||e.call(this),C("div",{class:[`${n}-slider`,o,{[`${n}-slider--disabled`]:this.mergedDisabled,[`${n}-slider--active`]:-1!==this.activeIndex,[`${n}-slider--with-mark`]:this.marks,[`${n}-slider--vertical`]:this.vertical,[`${n}-slider--reverse`]:this.reverse}],style:this.cssVars,onKeydown:this.handleRailKeyDown,onMousedown:this.handleRailMouseDown,onTouchstart:this.handleRailMouseDown},C("div",{class:`${n}-slider-rail`},C("div",{class:`${n}-slider-rail__fill`,style:this.fillStyle}),this.marks?C("div",{class:[`${n}-slider-dots`,this.dotTransitionDisabled&&`${n}-slider-dots--transition-disabled`]},this.markInfos.map((e=>C("div",{key:e.label,class:[`${n}-slider-dot`,{[`${n}-slider-dot--active`]:e.active}],style:e.style})))):null,C("div",{ref:"handleRailRef",class:`${n}-slider-handles`},this.arrifiedValues.map(((e,o)=>{const a=this.isShowTooltip(o);return C(S,null,{default:()=>[C(B,null,{default:()=>C("div",{ref:this.setHandleRefs(o),class:`${n}-slider-handle-wrapper`,tabindex:this.mergedDisabled?-1:0,style:this.getHandleStyle(e,o),onFocus:()=>{this.handleHandleFocus(o)},onBlur:()=>{this.handleHandleBlur(o)},onMouseenter:()=>{this.handleHandleMouseEnter(o)},onMouseleave:()=>{this.handleHandleMouseLeave(o)}},R(this.$slots.thumb,(()=>[C("div",{class:`${n}-slider-handle`})])))}),this.tooltip&&C(T,{ref:this.setFollowerRefs(o),show:a,to:this.adjustedTo,enabled:this.showTooltip&&!this.range||this.followerEnabledIndexSet.has(o),teleportDisabled:this.adjustedTo===z.tdkey,placement:this.mergedPlacement,containerClass:this.namespace},{default:()=>C($,{name:"fade-in-scale-up-transition",appear:this.isMounted,css:this.shouldKeepTooltipTransition(o),onEnter:()=>{this.followerEnabledIndexSet.add(o)},onAfterLeave:()=>{this.followerEnabledIndexSet.delete(o)}},{default:()=>{var o;return a?(null===(o=this.indicatorOnRender)||void 0===o||o.call(this),C("div",{class:[`${n}-slider-handle-indicator`,this.indicatorThemeClass,`${n}-slider-handle-indicator--${this.mergedPlacement}`],style:this.indicatorCssVars},"function"==typeof r?r(e):e)):null}})})]})}))),this.marks?C("div",{class:`${n}-slider-marks`},this.markInfos.map((e=>C("div",{key:e.label,class:`${n}-slider-mark`,style:e.style},e.label)))):null))}}))}}}));