mirror of
https://github.com/CorentinTh/it-tools.git
synced 2025-05-11 08:31:30 -04:00
159 lines
16 KiB
JavaScript
159 lines
16 KiB
JavaScript
![]() |
import{r as x,aJ as We,d as qe,c as w,C as Ge,A as ue,a1 as Je,h as f,f as Qe,n as Q}from"./chunk-449c23a2.js";import{b as Ze,n as M,o as n,q as m,p as j,an as eo,ao as oo,u as to,v as ge,O as ao,x as he,a6 as no,aF as Z,V as ro,G as lo,al as io,H as so,ad as N,ac as O,P as fe}from"../entries/src_pages_Home.page.16dc467b.js";import{f as ve}from"./chunk-051b56e8.js";import{s as co}from"./chunk-887755bb.js";import{u as uo}from"./chunk-2749dac9.js";const 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:U,borderRadius:L,fontSize:B,opacityDisabled:$}=a;return Object.assign(Object.assign({},co),{fontSize:B,markFontSize:B,railColor:v,railColorHover:v,fillColor:s,fillColorHover:s,opacityDisabled:$,handleColor:"#FFF",dotColor:z,dotColorModal:R,dotColorPopover:U,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:L,dotBorder:`2px solid ${v}`,dotBorderActive:`2px solid ${s}`,dotBoxShadow:""})},fo={name:"Slider",common:Ze,self:ho},vo=fo;function me(a){return window.TouchEvent&&a instanceof window.TouchEvent}function be(){const a=x(new Map),l=y=>v=>{a.value.set(y,v)};return We(()=>{a.value.clear()}),[a,l]}const mo=M([n("slider",`
|
||
|
display: block;
|
||
|
padding: calc((var(--n-handle-size) - var(--n-rail-height)) / 2) 0;
|
||
|
position: relative;
|
||
|
z-index: 0;
|
||
|
width: 100%;
|
||
|
cursor: pointer;
|
||
|
user-select: none;
|
||
|
-webkit-user-select: none;
|
||
|
`,[m("reverse",[n("slider-handles",[n("slider-handle-wrapper",`
|
||
|
transform: translate(50%, -50%);
|
||
|
`)]),n("slider-dots",[n("slider-dot",`
|
||
|
transform: translateX(50%, -50%);
|
||
|
`)]),m("vertical",[n("slider-handles",[n("slider-handle-wrapper",`
|
||
|
transform: translate(-50%, -50%);
|
||
|
`)]),n("slider-marks",[n("slider-mark",`
|
||
|
transform: translateY(calc(-50% + var(--n-dot-height) / 2));
|
||
|
`)]),n("slider-dots",[n("slider-dot",`
|
||
|
transform: translateX(-50%) translateY(0);
|
||
|
`)])])]),m("vertical",`
|
||
|
padding: 0 calc((var(--n-handle-size) - var(--n-rail-height)) / 2);
|
||
|
width: var(--n-rail-width-vertical);
|
||
|
height: 100%;
|
||
|
`,[n("slider-handles",`
|
||
|
top: calc(var(--n-handle-size) / 2);
|
||
|
right: 0;
|
||
|
bottom: calc(var(--n-handle-size) / 2);
|
||
|
left: 0;
|
||
|
`,[n("slider-handle-wrapper",`
|
||
|
top: unset;
|
||
|
left: 50%;
|
||
|
transform: translate(-50%, 50%);
|
||
|
`)]),n("slider-rail",`
|
||
|
height: 100%;
|
||
|
`,[j("fill",`
|
||
|
top: unset;
|
||
|
right: 0;
|
||
|
bottom: unset;
|
||
|
left: 0;
|
||
|
`)]),m("with-mark",`
|
||
|
width: var(--n-rail-width-vertical);
|
||
|
margin: 0 32px 0 8px;
|
||
|
`),n("slider-marks",`
|
||
|
top: calc(var(--n-handle-size) / 2);
|
||
|
right: unset;
|
||
|
bottom: calc(var(--n-handle-size) / 2);
|
||
|
left: 22px;
|
||
|
font-size: var(--n-mark-font-size);
|
||
|
`,[n("slider-mark",`
|
||
|
transform: translateY(50%);
|
||
|
white-space: nowrap;
|
||
|
`)]),n("slider-dots",`
|
||
|
top: calc(var(--n-handle-size) / 2);
|
||
|
right: unset;
|
||
|
bottom: calc(var(--n-handle-size) / 2);
|
||
|
left: 50%;
|
||
|
`,[n("slider-dot",`
|
||
|
transform: translateX(-50%) translateY(50%);
|
||
|
`)])]),m("disabled",`
|
||
|
cursor: not-allowed;
|
||
|
opacity: var(--n-opacity-disabled);
|
||
|
`,[n("slider-handle",`
|
||
|
cursor: not-allowed;
|
||
|
`)]),m("with-mark",`
|
||
|
width: 100%;
|
||
|
margin: 8px 0 32px 0;
|
||
|
`),M("&:hover",[n("slider-rail",{backgroundColor:"var(--n-rail-color-hover)"},[j("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)"},[j("fill",{backgroundColor:"var(--n-fill-color-hover)"})]),n("slider-handle",{boxShadow:"var(--n-handle-box-shadow-hover)"})]),n("slider-marks",`
|
||
|
position: absolute;
|
||
|
top: 18px;
|
||
|
left: calc(var(--n-handle-size) / 2);
|
||
|
right: calc(var(--n-handle-size) / 2);
|
||
|
`,[n("slider-mark",`
|
||
|
position: absolute;
|
||
|
transform: translateX(-50%);
|
||
|
white-space: nowrap;
|
||
|
`)]),n("slider-rail",`
|
||
|
width: 100%;
|
||
|
position: relative;
|
||
|
height: var(--n-rail-height);
|
||
|
background-color: var(--n-rail-color);
|
||
|
transition: background-color .3s var(--n-bezier);
|
||
|
border-radius: calc(var(--n-rail-height) / 2);
|
||
|
`,[j("fill",`
|
||
|
position: absolute;
|
||
|
top: 0;
|
||
|
bottom: 0;
|
||
|
border-radius: calc(var(--n-rail-height) / 2);
|
||
|
transition: background-color .3s var(--n-bezier);
|
||
|
background-color: var(--n-fill-color);
|
||
|
`)]),n("slider-handles",`
|
||
|
position: absolute;
|
||
|
top: 0;
|
||
|
right: calc(var(--n-handle-size) / 2);
|
||
|
bottom: 0;
|
||
|
left: calc(var(--n-handle-size) / 2);
|
||
|
`,[n("slider-handle-wrapper",`
|
||
|
outline: none;
|
||
|
position: absolute;
|
||
|
top: 50%;
|
||
|
transform: translate(-50%, -50%);
|
||
|
cursor: pointer;
|
||
|
display: flex;
|
||
|
`,[n("slider-handle",`
|
||
|
height: var(--n-handle-size);
|
||
|
width: var(--n-handle-size);
|
||
|
border-radius: 50%;
|
||
|
overflow: hidden;
|
||
|
transition: box-shadow .2s var(--n-bezier), background-color .3s var(--n-bezier);
|
||
|
background-color: var(--n-handle-color);
|
||
|
box-shadow: var(--n-handle-box-shadow);
|
||
|
`,[M("&:hover",`
|
||
|
box-shadow: var(--n-handle-box-shadow-hover);
|
||
|
`)]),M("&:focus",[n("slider-handle",`
|
||
|
box-shadow: var(--n-handle-box-shadow-focus);
|
||
|
`,[M("&:hover",`
|
||
|
box-shadow: var(--n-handle-box-shadow-active);
|
||
|
`)])])])]),n("slider-dots",`
|
||
|
position: absolute;
|
||
|
top: 50%;
|
||
|
left: calc(var(--n-handle-size) / 2);
|
||
|
right: calc(var(--n-handle-size) / 2);
|
||
|
`,[m("transition-disabled",[n("slider-dot","transition: none;")]),n("slider-dot",`
|
||
|
transition:
|
||
|
border-color .3s var(--n-bezier),
|
||
|
box-shadow .3s var(--n-bezier),
|
||
|
background-color .3s var(--n-bezier);
|
||
|
position: absolute;
|
||
|
transform: translate(-50%, -50%);
|
||
|
height: var(--n-dot-height);
|
||
|
width: var(--n-dot-width);
|
||
|
border-radius: var(--n-dot-border-radius);
|
||
|
overflow: hidden;
|
||
|
box-sizing: border-box;
|
||
|
border: var(--n-dot-border);
|
||
|
background-color: var(--n-dot-color);
|
||
|
`,[m("active","border: var(--n-dot-border-active);")])])]),n("slider-handle-indicator",`
|
||
|
font-size: var(--n-font-size);
|
||
|
padding: 6px 10px;
|
||
|
border-radius: var(--n-indicator-border-radius);
|
||
|
color: var(--n-indicator-text-color);
|
||
|
background-color: var(--n-indicator-color);
|
||
|
box-shadow: var(--n-indicator-box-shadow);
|
||
|
`,[ve()]),n("slider-handle-indicator",`
|
||
|
font-size: var(--n-font-size);
|
||
|
padding: 6px 10px;
|
||
|
border-radius: var(--n-indicator-border-radius);
|
||
|
color: var(--n-indicator-text-color);
|
||
|
background-color: var(--n-indicator-color);
|
||
|
box-shadow: var(--n-indicator-box-shadow);
|
||
|
`,[m("top",`
|
||
|
margin-bottom: 12px;
|
||
|
`),m("right",`
|
||
|
margin-left: 12px;
|
||
|
`),m("bottom",`
|
||
|
margin-top: 12px;
|
||
|
`),m("left",`
|
||
|
margin-right: 12px;
|
||
|
`),ve()]),eo(n("slider",[n("slider-dot","background-color: var(--n-dot-color-modal);")])),oo(n("slider",[n("slider-dot","background-color: var(--n-dot-color-popover);")]))]),bo=0,go=Object.assign(Object.assign({},ge.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]}),Ro=qe({name:"Slider",props:go,setup(a){const{mergedClsPrefixRef:l,namespaceRef:y,inlineThemeDisabled:v}=to(a),s=ge("Slider","-slider",mo,vo,a,l),d=x(null),[z,R]=be(),[U,L]=be(),B=x(new Set),$=uo(a),{mergedDisabledRef:D}=$,ee=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}),K=x(a.defaultValue),pe=Ge(a,"value"),X=ao(pe,K),b=w(()=>{const{value:e}=X;return(a.range?e:[e]).map(ie)}),oe=w(()=>b.value.length>2),we=w(()=>a.placement===void 0?a.vertical?"right":"top":a.placement),te=w(()=>{const{marks:e}=a;return e?Object.keys(e).map(parseFloat):null}),g=x(-1),ae=x(-1),C=x(-1),S=x(!1),F=x(!1),Y=w(()=>{const{vertical:e,reverse:o}=a;return e?o?"top":"bottom":o?"right":"left"}),xe=w(()=>{if(oe.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}=Y;return a.vertical?{[r]:`${o}%`,height:`${t-o}%`}:{[r]:`${o}%`,width:`${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}=Y,{value:i}=oe,{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]:`${H(h)}%`}})}}return e});function ye(e,o){const t=H(e),{value:r}=Y;return{[r]:`${t}%`,zIndex:o===g.value?1:0}}function ne(e){return a.showTooltip||C.value===e||g.value===e&&S.value}function Re(e){return S.value?!(g.value===e&&ae.value===e):!0}function Ce(e){var o;~e&&(g.value=e,(o=z.value.get(e))===null||o===void 0||o.focus())}function Se(){U.value.forEach((e,o)=>{ne(o)&&e.syncPosition()})}function re(e){const{"onUpdate:value":o,onUpdateValue:t}=a,{nTriggerFormInput:r,nTriggerFormChange:i}=$;t&&fe(t,e),o&&fe(o,e),K.value=e,r(),i()}function le(e){const{range:o}=a;if(o){if(Array.isArray(e)){const{value:t}=b;e.join()!==t.join()&&re(e)}}else Array.isArray(e)||b.value[0]!==e&&re(e)}function W(e,o){if(a.range){const t=b.value.slice();t.splice(o,1,e),le(t)}else le(e)}function q(e,o,t){const r=t!==void 0;t||(t=e-o>0?1:-1);const i=te.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}=ee;let u;if(r){const h=Number((o/c).toFixed(p)),k=Math.floor(h),G=h>k?k:k-1,J=h<k?k:k+1;u=I(o,[Number((G*c).toFixed(p)),Number((J*c).toFixed(p)),...i],t)}else{const h=Te(e);u=I(e,[...i,h])}return u?ie(u.value):o}function ie(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(ee.value))}function I(e,o=te.value,t){if(!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 se(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(D.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
|