react-double-range-slider - npm Package Compare versions

Comparing version 1.6.1 to 1.7.0

dist/cjs/components/RangeSlider/RangeSlider.types.d.ts

@@ -5,2 +5,8 @@ export interface Simple {
 }
+export interface Output {
+    min: string;
+    max: string;
+    minIndex: number;
+    maxIndex: number;
+}
 export interface RangeSliderProps {
@@ -14,8 +20,3 @@ hasSteps?: boolean;
     formatter?: (value: number | string) => string;
-    onChange: (value: {
-        min: string;
-        max: string;
-        minIndex: number;
-        maxIndex: number;
-    }) => void;
+    onChange: (value: Output) => void;
 }
@@ -22,0 +23,0 @@ export interface Status {

dist/cjs/index.js

@@ -1,2 +0,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),n=function(){return n=Object.assign||function(e){for(var t,n=1,r=arguments.length;n<r;n++)for(var i in t=arguments[n])Object.prototype.hasOwnProperty.call(t,i)&&(e[i]=t[i]);return e},n.apply(this,arguments)};exports.RangeSlider=function(r){var i,l,u,d=r.hasSteps,c=r.tooltipVisibility,o=r.tooltipPosition,a=r.value,s=r.onChange,h=r.from,f=r.to,v=r.formatter,g=a instanceof Array?a:Array.from(function(e,t,n){return Array.from(Array.from(Array(Math.ceil((t-e)/n)).keys()),(function(t){return e+t*n}))}(a.min,a.max+1,1)),b=h?-1===g.indexOf(h)?0:g.indexOf(h):0,m=f?-1===g.indexOf(f)?g.length-1:g.indexOf(f):g.length-1,x=v||function(e){return"".concat(e)},W=t.useState({value:x(g[b]),valueIndex:b}),p=W[0],S=W[1],y=t.useState({value:x(g[m]),valueIndex:m}),w=y[0],M=y[1];c||(c="always");var j=t.useState(null),O=j[0],C=j[1],N=t.useState(null),R=N[0],I=N[1],E=t.useState(null),L=E[0],A=E[1],k=t.useState("always"===c?"visible":"hidden"),X=k[0],B=k[1],P=t.useState("hidden"),q=P[0],z=P[1],D=t.useState("always"===c?"visible":"hidden"),K=D[0],_=D[1],F=t.useState(null),V=F[0],G=F[1],H=t.useState(!1),J=H[0],Q=H[1],T=t.useState(0),U=T[0],Y=T[1],Z=t.useState(!1),$=Z[0],ee=Z[1],te=t.useRef(null),ne=t.useRef(null),re=t.useRef(null),ie=t.useRef(null),le=t.useRef(null),ue=t.useRef(null),de=t.useRef(null),ce=t.useState(null),oe=ce[0],ae=ce[1],se=t.useState(null),he=se[0],fe=se[1],ve=t.useState(null),ge=ve[0],be=ve[1],me=t.useState(null),xe=me[0],We=me[1],pe=t.useState(null),Se=pe[0],ye=pe[1],we=t.useState(null),Me=we[0],je=we[1],Oe=t.useState(null),Ce=Oe[0],Ne=Oe[1],Re=t.useRef(!0),Ie=t.useState(0),Ee=Ie[0],Le=Ie[1];function Ae(){ie.current&&de.current&&(I(ie.current.clientWidth-de.current.clientWidth/2),ye(de.current.clientWidth)),ue.current&&(ae(ue.current.clientWidth/-2),C(ie.current.clientWidth/(g.length-1)*b-ue.current.clientWidth/2)),de.current&&le.current&&(fe(le.current.clientWidth-de.current.clientWidth/2),I(ie.current.clientWidth/(g.length-1)*m-de.current.clientWidth/2));var e=ie.current.clientWidth/(g.length-1)*m-ie.current.clientWidth/(g.length-1)*b,t=ie.current.clientWidth/(g.length-1)*b;le.current&&A({width:e,left:t}),ne.current&&G((t+e/2-ne.current.clientWidth/2)/ie.current.clientWidth*100);var n=window.getComputedStyle(te.current).transform,r=parseInt(window.getComputedStyle(te.current).width),i=new WebKitCSSMatrix(n),l=Math.round(10*i.m41)/20/r*100,u=window.getComputedStyle(re.current).transform,d=parseInt(window.getComputedStyle(re.current).width),c=new WebKitCSSMatrix(u),o=Math.round(10*c.m41)/20/d*100;Le(isFinite(1/(Math.floor((l-o)/10)/10+1))?1/(Math.floor((l-o)/10)/10+1):0),te.current&&re.current&&le.current&&Q(te.current.clientWidth/2+re.current.clientWidth/2>e*Ee)}function ke(){Ae()}t.useEffect((function(){return document.addEventListener("mousemove",(function(e){Y(e.clientX)})),document.addEventListener("mouseup",(function(e){We(null),ee(!1),"hover"===c&&(B("hidden"),_("hidden"),z("hidden"))})),window.addEventListener("resize",ke),Ae(),function(){window.removeEventListener("resize",ke)}}),[]),t.useEffect((function(){Re.current||(null!==O&&null!==R&&Se&&A({left:O+Se/2,width:R-O}),L&&ne.current&&G((L.left+L.width/2-ne.current.clientWidth/2)/ie.current.clientWidth*100),Ce&&Be(Ce),te.current&&re.current&&le.current&&Q(te.current.clientWidth/2+re.current.clientWidth/2>le.current.clientWidth*Ee))}),[Ce]),t.useEffect((function(){Re.current?Re.current=!1:s({min:p.value,max:w.value,minIndex:p.valueIndex,maxIndex:w.valueIndex})}),[p.value,w.value]),t.useEffect((function(){"hover"===c?J&&$?(z("visible"),B("hidden"),_("hidden")):ge===ue.current&&$?(B("visible"),z("hidden"),_("hidden")):ge===de.current&&$?(_("visible"),z("hidden"),B("hidden")):(B("hidden"),_("hidden"),z("hidden")):"always"===c&&(J?(z("visible"),B("hidden"),_("hidden")):(z("hidden"),B("visible"),_("visible")))}),[J]),t.useEffect((function(){if($&&xe&&ge&&oe&&he&&Se&&null!==Me&&ie.current&&null!==O&&null!==R){var e=(Me||0)+(U-xe),t=Math.round(e/(ie.current.clientWidth/(g.length-1))),n=ie.current.clientWidth/(g.length-1)*t-Se/2;if(d){if(n>=oe&&n<=he){if(ge===ue.current&&n>R)return;if(ge===de.current&&n<O)return;ge===ue.current&&C(n),ge===de.current&&I(n)}}else if(e>=oe&&e<=he){if(ge===ue.current&&e>=R)return;if(ge===de.current&&e<=O)return;ge===ue.current&&C(e),ge===de.current&&I(e)}Ne(ge)}}),[U]);var Xe=function(e){if(ue.current&&de.current&&Se&&oe&&he&&null!==O&&null!==R){var t=Math.abs(e.clientX-ue.current.getBoundingClientRect().left)>Math.abs(e.clientX-de.current.getBoundingClientRect().left)?de.current:ue.current;je(t.offsetLeft);var n=t.offsetLeft+(e.clientX-t.getBoundingClientRect().left)-Se/2,r=Math.round(n/(ie.current.clientWidth/(g.length-1))),i=ie.current.clientWidth/(g.length-1)*r-Se/2;if(d){if(i>=oe&&i<=he){if(t===ue.current&&i>R)return;if(t===de.current&&i<O)return;t===ue.current&&C(i),t===de.current&&I(i)}}else if(n>=oe&&n<=he){if(t===ue.current&&n>=R)return;if(t===de.current&&n<=O)return;t===ue.current&&C(n),t===de.current&&I(n)}Ne(t)}},Be=function(e){if(ie.current&&le.current&&e&&Se){var t=ie.current.clientWidth/g.length,n=Number(window.getComputedStyle(e).left.replace("px",""));n=(n=n>ie.current.clientWidth?ie.current.clientWidth+Se/2:n+Se/2)<=0?0:n;var r=Math.floor(n/t);r>=g.length&&(r=g.length-1);var i="string"==typeof g[r]?g[r]:g[r].toString();e===ue.current&&S({value:x(i),valueIndex:r}),e===de.current&&M({value:x(i),valueIndex:r})}Ne(null)};return e.jsxs("div",n({className:"double-range-slider-container"},{children:[e.jsx("div",n({className:"double-range-slider-rail",ref:ie,onClick:Xe},{children:d&&g.map((function(t,n){return ie.current&&n>0&&n<g.length-1&&e.jsx("div",{className:"double-range-slider-step",style:{left:"".concat(ie.current.clientWidth/(g.length-1)*n-2.5,"px")}},n)}))})),e.jsx("div",{className:"double-range-slider-track",ref:le,style:L?{left:"".concat(L.left/(null===(i=ie.current)||void 0===i?void 0:i.clientWidth)*100,"%"),width:"".concat(L.width,"px")}:void 0,onMouseOver:function(){"hover"===c&&J?(z("visible"),B("hidden"),_("hidden")):"hover"===c&&(z("hidden"),B("hidden"),_("hidden"))},onMouseOut:function(){("hover"===c&&J||"hover"===c)&&(z("hidden"),B("hidden"),_("hidden"))},onClick:Xe}),e.jsx("div",n({className:"double-range-slider-min double-range-slider-ball".concat(ge===ue.current?" double-range-slider-active":""),style:{left:"".concat(O/(null===(l=ie.current)||void 0===l?void 0:l.clientWidth)*100,"%")},ref:ue,onMouseOver:function(){"hover"!==c||J?"hover"===c&&J&&(B("hidden"),z("visible")):(B("visible"),z("hidden"))},onMouseOut:function(){"hover"!==c||J?"hover"===c&&J&&(B("hidden"),z("hidden")):(B("hidden"),z("hidden"))},onMouseDown:function(e){We(U),be(ue.current),je(O),ee(!0)}},{children:e.jsx("div",n({className:"double-range-slider-tooltip ".concat(o?"double-range-slider-".concat(o):"double-range-slider-over"),style:{visibility:X},ref:te},{children:e.jsx("p",n({className:"double-range-slider-min-text-holder double-range-slider-text-holder"},{children:p.value}))}))})),e.jsx("div",n({className:"double-range-slider-mid double-range-slider-tooltip ".concat(o?"double-range-slider-".concat(o):"double-range-slider-over"),ref:ne,style:{visibility:q,left:"".concat(V,"%")}},{children:e.jsx("p",n({className:"double-range-slider-mid-text-holder double-range-slider-text-holder"},{children:p.value===w.value?"".concat(p.value):"".concat(p.value," - ").concat(w.value)}))})),e.jsx("div",n({className:"double-range-slider-max double-range-slider-ball".concat(ge===de.current?" double-range-slider-active":""),style:{left:"".concat(R/(null===(u=ie.current)||void 0===u?void 0:u.clientWidth)*100,"%")},ref:de,onMouseOver:function(){"hover"!==c||J?"hover"===c&&J&&(_("hidden"),z("visible")):(_("visible"),z("hidden"))},onMouseOut:function(){"hover"!==c||J?"hover"===c&&J&&(_("hidden"),z("hidden")):(_("hidden"),z("hidden"))},onMouseDown:function(e){We(U),be(de.current),je(R),ee(!0)}},{children:e.jsx("div",n({className:"double-range-slider-tooltip ".concat(o?"double-range-slider-".concat(o):"double-range-slider-over"),style:{visibility:K},ref:re},{children:e.jsx("p",n({className:"double-range-slider-max-text-holder double-range-slider-text-holder"},{children:w.value}))}))}))]}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r=n(t),i=function(){return i=Object.assign||function(e){for(var t,n=1,r=arguments.length;n<r;n++)for(var i in t=arguments[n])Object.prototype.hasOwnProperty.call(t,i)&&(e[i]=t[i]);return e},i.apply(this,arguments)};exports.RangeSlider=function(n){var l,u,d,c=n.hasSteps,o=n.tooltipVisibility,a=n.tooltipPosition,s=n.value,h=n.onChange,f=n.from,v=n.to,g=n.formatter,b=s instanceof Array?s:Array.from(function(e,t,n){return Array.from(Array.from(Array(Math.ceil((t-e)/n)).keys()),(function(t){return e+t*n}))}(s.min,s.max+1,1)),m=f?-1===b.indexOf(f)?0:b.indexOf(f):0,x=v?-1===b.indexOf(v)?b.length-1:b.indexOf(v):b.length-1,W=g||function(e){return"".concat(e)},p=t.useState({value:W(b[m]),valueIndex:m}),y=p[0],S=p[1],w=t.useState({value:W(b[x]),valueIndex:x}),M=w[0],j=w[1];o||(o="always");var O=t.useState(null),C=O[0],N=O[1],R=t.useState(null),I=R[0],E=R[1],L=t.useState(null),A=L[0],k=L[1],X=t.useState("always"===o?"visible":"hidden"),B=X[0],P=X[1],q=t.useState("hidden"),z=q[0],D=q[1],K=t.useState("always"===o?"visible":"hidden"),_=K[0],F=K[1],V=t.useState(null),G=V[0],H=V[1],J=t.useState(!1),Q=J[0],T=J[1],U=t.useState(0),Y=U[0],Z=U[1],$=t.useState(!1),ee=$[0],te=$[1],ne=t.useRef(null),re=t.useRef(null),ie=t.useRef(null),le=t.useRef(null),ue=t.useRef(null),de=t.useRef(null),ce=t.useRef(null),oe=t.useState(null),ae=oe[0],se=oe[1],he=t.useState(null),fe=he[0],ve=he[1],ge=t.useState(null),be=ge[0],me=ge[1],xe=t.useState(null),We=xe[0],pe=xe[1],ye=t.useState(null),Se=ye[0],we=ye[1],Me=t.useState(null),je=Me[0],Oe=Me[1],Ce=t.useState(null),Ne=Ce[0],Re=Ce[1],Ie=t.useRef(!0),Ee=t.useState(0),Le=Ee[0],Ae=Ee[1],ke=r.default.useRef(null);function Xe(){le.current&&ce.current&&(E(le.current.clientWidth-ce.current.clientWidth/2),we(ce.current.clientWidth)),de.current&&(se(de.current.clientWidth/-2),N(le.current.clientWidth/(b.length-1)*m-de.current.clientWidth/2)),ce.current&&ue.current&&(ve(ue.current.clientWidth-ce.current.clientWidth/2),E(le.current.clientWidth/(b.length-1)*x-ce.current.clientWidth/2));var e=le.current.clientWidth/(b.length-1)*x-le.current.clientWidth/(b.length-1)*m,t=le.current.clientWidth/(b.length-1)*m;ue.current&&k({width:e,left:t}),re.current&&H((t+e/2-re.current.clientWidth/2)/le.current.clientWidth*100);var n=window.getComputedStyle(ne.current).transform,r=parseInt(window.getComputedStyle(ne.current).width),i=new WebKitCSSMatrix(n),l=Math.round(10*i.m41)/20/r*100,u=window.getComputedStyle(ie.current).transform,d=parseInt(window.getComputedStyle(ie.current).width),c=new WebKitCSSMatrix(u),o=Math.round(10*c.m41)/20/d*100;Ae(isFinite(1/(Math.floor((l-o)/10)/10+1))?1/(Math.floor((l-o)/10)/10+1):0),ne.current&&ie.current&&ue.current&&T(ne.current.clientWidth/2+ie.current.clientWidth/2>e*Le)}function Be(){ke.current&&h(ke.current),pe(null),te(!1),"hover"===o&&(P("hidden"),F("hidden"),D("hidden"))}function Pe(){Xe()}t.useEffect((function(){return document.addEventListener("mousemove",(function(e){Z(e.clientX)})),document.addEventListener("mouseup",Be),window.addEventListener("resize",Pe),Xe(),function(){window.removeEventListener("resize",Pe)}}),[]),t.useEffect((function(){Ie.current||(null!==C&&null!==I&&Se&&k({left:C+Se/2,width:I-C}),A&&re.current&&H((A.left+A.width/2-re.current.clientWidth/2)/le.current.clientWidth*100),Ne&&ze(Ne),ne.current&&ie.current&&ue.current&&T(ne.current.clientWidth/2+ie.current.clientWidth/2>ue.current.clientWidth*Le))}),[Ne]),t.useEffect((function(){Ie.current?Ie.current=!1:ke.current={min:y.value,max:M.value,minIndex:y.valueIndex,maxIndex:M.valueIndex}}),[y.value,M.value]),t.useEffect((function(){"hover"===o?Q&&ee?(D("visible"),P("hidden"),F("hidden")):be===de.current&&ee?(P("visible"),D("hidden"),F("hidden")):be===ce.current&&ee?(F("visible"),D("hidden"),P("hidden")):(P("hidden"),F("hidden"),D("hidden")):"always"===o&&(Q?(D("visible"),P("hidden"),F("hidden")):(D("hidden"),P("visible"),F("visible")))}),[Q]),t.useEffect((function(){if(ee&&We&&be&&ae&&fe&&Se&&null!==je&&le.current&&null!==C&&null!==I){var e=(je||0)+(Y-We),t=Math.round(e/(le.current.clientWidth/(b.length-1))),n=le.current.clientWidth/(b.length-1)*t-Se/2;if(c){if(n>=ae&&n<=fe){if(be===de.current&&n>I)return;if(be===ce.current&&n<C)return;be===de.current&&N(n),be===ce.current&&E(n)}}else if(e>=ae&&e<=fe){if(be===de.current&&e>=I)return;if(be===ce.current&&e<=C)return;be===de.current&&N(e),be===ce.current&&E(e)}Re(be)}}),[Y]);var qe=function(e){if(de.current&&ce.current&&Se&&ae&&fe&&null!==C&&null!==I){var t=Math.abs(e.clientX-de.current.getBoundingClientRect().left)>Math.abs(e.clientX-ce.current.getBoundingClientRect().left)?ce.current:de.current;Oe(t.offsetLeft);var n=t.offsetLeft+(e.clientX-t.getBoundingClientRect().left)-Se/2,r=Math.round(n/(le.current.clientWidth/(b.length-1))),i=le.current.clientWidth/(b.length-1)*r-Se/2;if(c){if(i>=ae&&i<=fe){if(t===de.current&&i>I)return;if(t===ce.current&&i<C)return;t===de.current&&N(i),t===ce.current&&E(i)}}else if(n>=ae&&n<=fe){if(t===de.current&&n>=I)return;if(t===ce.current&&n<=C)return;t===de.current&&N(n),t===ce.current&&E(n)}Re(t)}},ze=function(e){if(le.current&&ue.current&&e&&Se){var t=le.current.clientWidth/b.length,n=Number(window.getComputedStyle(e).left.replace("px",""));n=(n=n>le.current.clientWidth?le.current.clientWidth+Se/2:n+Se/2)<=0?0:n;var r=Math.floor(n/t);r>=b.length&&(r=b.length-1);var i="string"==typeof b[r]?b[r]:b[r].toString();e===de.current&&S({value:W(i),valueIndex:r}),e===ce.current&&j({value:W(i),valueIndex:r})}Re(null)};return e.jsxs("div",i({className:"double-range-slider-container"},{children:[e.jsx("div",i({className:"double-range-slider-rail",ref:le,onClick:qe},{children:c&&b.map((function(t,n){return le.current&&n>0&&n<b.length-1&&e.jsx("div",{className:"double-range-slider-step",style:{left:"".concat(le.current.clientWidth/(b.length-1)*n-2.5,"px")}},n)}))})),e.jsx("div",{className:"double-range-slider-track",ref:ue,style:A?{left:"".concat(A.left/(null===(l=le.current)||void 0===l?void 0:l.clientWidth)*100,"%"),width:"".concat(A.width,"px")}:void 0,onMouseOver:function(){"hover"===o&&Q?(D("visible"),P("hidden"),F("hidden")):"hover"===o&&(D("hidden"),P("hidden"),F("hidden"))},onMouseOut:function(){("hover"===o&&Q||"hover"===o)&&(D("hidden"),P("hidden"),F("hidden"))},onClick:qe}),e.jsx("div",i({className:"double-range-slider-min double-range-slider-ball".concat(be===de.current?" double-range-slider-active":""),style:{left:"".concat(C/(null===(u=le.current)||void 0===u?void 0:u.clientWidth)*100,"%")},ref:de,onMouseOver:function(){"hover"!==o||Q?"hover"===o&&Q&&(P("hidden"),D("visible")):(P("visible"),D("hidden"))},onMouseOut:function(){"hover"!==o||Q?"hover"===o&&Q&&(P("hidden"),D("hidden")):(P("hidden"),D("hidden"))},onMouseDown:function(e){pe(Y),me(de.current),Oe(C),te(!0)}},{children:e.jsx("div",i({className:"double-range-slider-tooltip ".concat(a?"double-range-slider-".concat(a):"double-range-slider-over"),style:{visibility:B},ref:ne},{children:e.jsx("p",i({className:"double-range-slider-min-text-holder double-range-slider-text-holder"},{children:y.value}))}))})),e.jsx("div",i({className:"double-range-slider-mid double-range-slider-tooltip ".concat(a?"double-range-slider-".concat(a):"double-range-slider-over"),ref:re,style:{visibility:z,left:"".concat(G,"%")}},{children:e.jsx("p",i({className:"double-range-slider-mid-text-holder double-range-slider-text-holder"},{children:y.value===M.value?"".concat(y.value):"".concat(y.value," - ").concat(M.value)}))})),e.jsx("div",i({className:"double-range-slider-max double-range-slider-ball".concat(be===ce.current?" double-range-slider-active":""),style:{left:"".concat(I/(null===(d=le.current)||void 0===d?void 0:d.clientWidth)*100,"%")},ref:ce,onMouseOver:function(){"hover"!==o||Q?"hover"===o&&Q&&(F("hidden"),D("visible")):(F("visible"),D("hidden"))},onMouseOut:function(){"hover"!==o||Q?"hover"===o&&Q&&(F("hidden"),D("hidden")):(F("hidden"),D("hidden"))},onMouseDown:function(e){pe(Y),me(ce.current),Oe(I),te(!0)}},{children:e.jsx("div",i({className:"double-range-slider-tooltip ".concat(a?"double-range-slider-".concat(a):"double-range-slider-over"),style:{visibility:_},ref:ie},{children:e.jsx("p",i({className:"double-range-slider-max-text-holder double-range-slider-text-holder"},{children:M.value}))}))}))]}))};
 //# sourceMappingURL=index.js.map

dist/esm/components/RangeSlider/RangeSlider.types.d.ts

@@ -5,2 +5,8 @@ export interface Simple {
 }
+export interface Output {
+    min: string;
+    max: string;
+    minIndex: number;
+    maxIndex: number;
+}
 export interface RangeSliderProps {
@@ -14,8 +20,3 @@ hasSteps?: boolean;
     formatter?: (value: number | string) => string;
-    onChange: (value: {
-        min: string;
-        max: string;
-        minIndex: number;
-        maxIndex: number;
-    }) => void;
+    onChange: (value: Output) => void;
 }
@@ -22,0 +23,0 @@ export interface Status {

dist/esm/index.js

@@ -1,2 +0,2 @@
-import{jsxs as e,jsx as n}from"react/jsx-runtime";import{useState as t,useRef as r,useEffect as i}from"react";var l=function(){return l=Object.assign||function(e){for(var n,t=1,r=arguments.length;t<r;t++)for(var i in n=arguments[t])Object.prototype.hasOwnProperty.call(n,i)&&(e[i]=n[i]);return e},l.apply(this,arguments)},d=function(d){var u,c,o,a=d.hasSteps,h=d.tooltipVisibility,s=d.tooltipPosition,v=d.value,f=d.onChange,g=d.from,b=d.to,m=d.formatter,W=v instanceof Array?v:Array.from(function(e,n,t){return Array.from(Array.from(Array(Math.ceil((n-e)/t)).keys()),(function(n){return e+n*t}))}(v.min,v.max+1,1)),p=g?-1===W.indexOf(g)?0:W.indexOf(g):0,w=b?-1===W.indexOf(b)?W.length-1:W.indexOf(b):W.length-1,x=m||function(e){return"".concat(e)},y=t({value:x(W[p]),valueIndex:p}),M=y[0],C=y[1],N=t({value:x(W[w]),valueIndex:w}),O=N[0],S=N[1];h||(h="always");var I=t(null),L=I[0],A=I[1],k=t(null),E=k[0],X=k[1],j=t(null),B=j[0],R=j[1],z=t("always"===h?"visible":"hidden"),D=z[0],K=z[1],P=t("hidden"),F=P[0],V=P[1],q=t("always"===h?"visible":"hidden"),G=q[0],H=q[1],J=t(null),Q=J[0],T=J[1],U=t(!1),Y=U[0],Z=U[1],$=t(0),_=$[0],ee=$[1],ne=t(!1),te=ne[0],re=ne[1],ie=r(null),le=r(null),de=r(null),ue=r(null),ce=r(null),oe=r(null),ae=r(null),he=t(null),se=he[0],ve=he[1],fe=t(null),ge=fe[0],be=fe[1],me=t(null),We=me[0],pe=me[1],we=t(null),xe=we[0],ye=we[1],Me=t(null),Ce=Me[0],Ne=Me[1],Oe=t(null),Se=Oe[0],Ie=Oe[1],Le=t(null),Ae=Le[0],ke=Le[1],Ee=r(!0),Xe=t(0),je=Xe[0],Be=Xe[1];function Re(){ue.current&&ae.current&&(X(ue.current.clientWidth-ae.current.clientWidth/2),Ne(ae.current.clientWidth)),oe.current&&(ve(oe.current.clientWidth/-2),A(ue.current.clientWidth/(W.length-1)*p-oe.current.clientWidth/2)),ae.current&&ce.current&&(be(ce.current.clientWidth-ae.current.clientWidth/2),X(ue.current.clientWidth/(W.length-1)*w-ae.current.clientWidth/2));var e=ue.current.clientWidth/(W.length-1)*w-ue.current.clientWidth/(W.length-1)*p,n=ue.current.clientWidth/(W.length-1)*p;ce.current&&R({width:e,left:n}),le.current&&T((n+e/2-le.current.clientWidth/2)/ue.current.clientWidth*100);var t=window.getComputedStyle(ie.current).transform,r=parseInt(window.getComputedStyle(ie.current).width),i=new WebKitCSSMatrix(t),l=Math.round(10*i.m41)/20/r*100,d=window.getComputedStyle(de.current).transform,u=parseInt(window.getComputedStyle(de.current).width),c=new WebKitCSSMatrix(d),o=Math.round(10*c.m41)/20/u*100;Be(isFinite(1/(Math.floor((l-o)/10)/10+1))?1/(Math.floor((l-o)/10)/10+1):0),ie.current&&de.current&&ce.current&&Z(ie.current.clientWidth/2+de.current.clientWidth/2>e*je)}function ze(){Re()}i((function(){return document.addEventListener("mousemove",(function(e){ee(e.clientX)})),document.addEventListener("mouseup",(function(e){ye(null),re(!1),"hover"===h&&(K("hidden"),H("hidden"),V("hidden"))})),window.addEventListener("resize",ze),Re(),function(){window.removeEventListener("resize",ze)}}),[]),i((function(){Ee.current||(null!==L&&null!==E&&Ce&&R({left:L+Ce/2,width:E-L}),B&&le.current&&T((B.left+B.width/2-le.current.clientWidth/2)/ue.current.clientWidth*100),Ae&&Ke(Ae),ie.current&&de.current&&ce.current&&Z(ie.current.clientWidth/2+de.current.clientWidth/2>ce.current.clientWidth*je))}),[Ae]),i((function(){Ee.current?Ee.current=!1:f({min:M.value,max:O.value,minIndex:M.valueIndex,maxIndex:O.valueIndex})}),[M.value,O.value]),i((function(){"hover"===h?Y&&te?(V("visible"),K("hidden"),H("hidden")):We===oe.current&&te?(K("visible"),V("hidden"),H("hidden")):We===ae.current&&te?(H("visible"),V("hidden"),K("hidden")):(K("hidden"),H("hidden"),V("hidden")):"always"===h&&(Y?(V("visible"),K("hidden"),H("hidden")):(V("hidden"),K("visible"),H("visible")))}),[Y]),i((function(){if(te&&xe&&We&&se&&ge&&Ce&&null!==Se&&ue.current&&null!==L&&null!==E){var e=(Se||0)+(_-xe),n=Math.round(e/(ue.current.clientWidth/(W.length-1))),t=ue.current.clientWidth/(W.length-1)*n-Ce/2;if(a){if(t>=se&&t<=ge){if(We===oe.current&&t>E)return;if(We===ae.current&&t<L)return;We===oe.current&&A(t),We===ae.current&&X(t)}}else if(e>=se&&e<=ge){if(We===oe.current&&e>=E)return;if(We===ae.current&&e<=L)return;We===oe.current&&A(e),We===ae.current&&X(e)}ke(We)}}),[_]);var De=function(e){if(oe.current&&ae.current&&Ce&&se&&ge&&null!==L&&null!==E){var n=Math.abs(e.clientX-oe.current.getBoundingClientRect().left)>Math.abs(e.clientX-ae.current.getBoundingClientRect().left)?ae.current:oe.current;Ie(n.offsetLeft);var t=n.offsetLeft+(e.clientX-n.getBoundingClientRect().left)-Ce/2,r=Math.round(t/(ue.current.clientWidth/(W.length-1))),i=ue.current.clientWidth/(W.length-1)*r-Ce/2;if(a){if(i>=se&&i<=ge){if(n===oe.current&&i>E)return;if(n===ae.current&&i<L)return;n===oe.current&&A(i),n===ae.current&&X(i)}}else if(t>=se&&t<=ge){if(n===oe.current&&t>=E)return;if(n===ae.current&&t<=L)return;n===oe.current&&A(t),n===ae.current&&X(t)}ke(n)}},Ke=function(e){if(ue.current&&ce.current&&e&&Ce){var n=ue.current.clientWidth/W.length,t=Number(window.getComputedStyle(e).left.replace("px",""));t=(t=t>ue.current.clientWidth?ue.current.clientWidth+Ce/2:t+Ce/2)<=0?0:t;var r=Math.floor(t/n);r>=W.length&&(r=W.length-1);var i="string"==typeof W[r]?W[r]:W[r].toString();e===oe.current&&C({value:x(i),valueIndex:r}),e===ae.current&&S({value:x(i),valueIndex:r})}ke(null)};return e("div",l({className:"double-range-slider-container"},{children:[n("div",l({className:"double-range-slider-rail",ref:ue,onClick:De},{children:a&&W.map((function(e,t){return ue.current&&t>0&&t<W.length-1&&n("div",{className:"double-range-slider-step",style:{left:"".concat(ue.current.clientWidth/(W.length-1)*t-2.5,"px")}},t)}))})),n("div",{className:"double-range-slider-track",ref:ce,style:B?{left:"".concat(B.left/(null===(u=ue.current)||void 0===u?void 0:u.clientWidth)*100,"%"),width:"".concat(B.width,"px")}:void 0,onMouseOver:function(){"hover"===h&&Y?(V("visible"),K("hidden"),H("hidden")):"hover"===h&&(V("hidden"),K("hidden"),H("hidden"))},onMouseOut:function(){("hover"===h&&Y||"hover"===h)&&(V("hidden"),K("hidden"),H("hidden"))},onClick:De}),n("div",l({className:"double-range-slider-min double-range-slider-ball".concat(We===oe.current?" double-range-slider-active":""),style:{left:"".concat(L/(null===(c=ue.current)||void 0===c?void 0:c.clientWidth)*100,"%")},ref:oe,onMouseOver:function(){"hover"!==h||Y?"hover"===h&&Y&&(K("hidden"),V("visible")):(K("visible"),V("hidden"))},onMouseOut:function(){"hover"!==h||Y?"hover"===h&&Y&&(K("hidden"),V("hidden")):(K("hidden"),V("hidden"))},onMouseDown:function(e){ye(_),pe(oe.current),Ie(L),re(!0)}},{children:n("div",l({className:"double-range-slider-tooltip ".concat(s?"double-range-slider-".concat(s):"double-range-slider-over"),style:{visibility:D},ref:ie},{children:n("p",l({className:"double-range-slider-min-text-holder double-range-slider-text-holder"},{children:M.value}))}))})),n("div",l({className:"double-range-slider-mid double-range-slider-tooltip ".concat(s?"double-range-slider-".concat(s):"double-range-slider-over"),ref:le,style:{visibility:F,left:"".concat(Q,"%")}},{children:n("p",l({className:"double-range-slider-mid-text-holder double-range-slider-text-holder"},{children:M.value===O.value?"".concat(M.value):"".concat(M.value," - ").concat(O.value)}))})),n("div",l({className:"double-range-slider-max double-range-slider-ball".concat(We===ae.current?" double-range-slider-active":""),style:{left:"".concat(E/(null===(o=ue.current)||void 0===o?void 0:o.clientWidth)*100,"%")},ref:ae,onMouseOver:function(){"hover"!==h||Y?"hover"===h&&Y&&(H("hidden"),V("visible")):(H("visible"),V("hidden"))},onMouseOut:function(){"hover"!==h||Y?"hover"===h&&Y&&(H("hidden"),V("hidden")):(H("hidden"),V("hidden"))},onMouseDown:function(e){ye(_),pe(ae.current),Ie(E),re(!0)}},{children:n("div",l({className:"double-range-slider-tooltip ".concat(s?"double-range-slider-".concat(s):"double-range-slider-over"),style:{visibility:G},ref:de},{children:n("p",l({className:"double-range-slider-max-text-holder double-range-slider-text-holder"},{children:O.value}))}))}))]}))};export{d as RangeSlider};
+import{jsxs as e,jsx as n}from"react/jsx-runtime";import r,{useState as t,useRef as i,useEffect as l}from"react";var u=function(){return u=Object.assign||function(e){for(var n,r=1,t=arguments.length;r<t;r++)for(var i in n=arguments[r])Object.prototype.hasOwnProperty.call(n,i)&&(e[i]=n[i]);return e},u.apply(this,arguments)},d=function(d){var c,o,a,h=d.hasSteps,s=d.tooltipVisibility,v=d.tooltipPosition,f=d.value,g=d.onChange,b=d.from,m=d.to,W=d.formatter,p=f instanceof Array?f:Array.from(function(e,n,r){return Array.from(Array.from(Array(Math.ceil((n-e)/r)).keys()),(function(n){return e+n*r}))}(f.min,f.max+1,1)),w=b?-1===p.indexOf(b)?0:p.indexOf(b):0,x=m?-1===p.indexOf(m)?p.length-1:p.indexOf(m):p.length-1,y=W||function(e){return"".concat(e)},M=t({value:y(p[w]),valueIndex:w}),C=M[0],N=M[1],O=t({value:y(p[x]),valueIndex:x}),S=O[0],I=O[1];s||(s="always");var L=t(null),A=L[0],k=L[1],E=t(null),R=E[0],X=E[1],j=t(null),B=j[0],z=j[1],D=t("always"===s?"visible":"hidden"),K=D[0],P=D[1],F=t("hidden"),V=F[0],q=F[1],G=t("always"===s?"visible":"hidden"),H=G[0],J=G[1],Q=t(null),T=Q[0],U=Q[1],Y=t(!1),Z=Y[0],$=Y[1],_=t(0),ee=_[0],ne=_[1],re=t(!1),te=re[0],ie=re[1],le=i(null),ue=i(null),de=i(null),ce=i(null),oe=i(null),ae=i(null),he=i(null),se=t(null),ve=se[0],fe=se[1],ge=t(null),be=ge[0],me=ge[1],We=t(null),pe=We[0],we=We[1],xe=t(null),ye=xe[0],Me=xe[1],Ce=t(null),Ne=Ce[0],Oe=Ce[1],Se=t(null),Ie=Se[0],Le=Se[1],Ae=t(null),ke=Ae[0],Ee=Ae[1],Re=i(!0),Xe=t(0),je=Xe[0],Be=Xe[1],ze=r.useRef(null);function De(){ce.current&&he.current&&(X(ce.current.clientWidth-he.current.clientWidth/2),Oe(he.current.clientWidth)),ae.current&&(fe(ae.current.clientWidth/-2),k(ce.current.clientWidth/(p.length-1)*w-ae.current.clientWidth/2)),he.current&&oe.current&&(me(oe.current.clientWidth-he.current.clientWidth/2),X(ce.current.clientWidth/(p.length-1)*x-he.current.clientWidth/2));var e=ce.current.clientWidth/(p.length-1)*x-ce.current.clientWidth/(p.length-1)*w,n=ce.current.clientWidth/(p.length-1)*w;oe.current&&z({width:e,left:n}),ue.current&&U((n+e/2-ue.current.clientWidth/2)/ce.current.clientWidth*100);var r=window.getComputedStyle(le.current).transform,t=parseInt(window.getComputedStyle(le.current).width),i=new WebKitCSSMatrix(r),l=Math.round(10*i.m41)/20/t*100,u=window.getComputedStyle(de.current).transform,d=parseInt(window.getComputedStyle(de.current).width),c=new WebKitCSSMatrix(u),o=Math.round(10*c.m41)/20/d*100;Be(isFinite(1/(Math.floor((l-o)/10)/10+1))?1/(Math.floor((l-o)/10)/10+1):0),le.current&&de.current&&oe.current&&$(le.current.clientWidth/2+de.current.clientWidth/2>e*je)}function Ke(){ze.current&&g(ze.current),Me(null),ie(!1),"hover"===s&&(P("hidden"),J("hidden"),q("hidden"))}function Pe(){De()}l((function(){return document.addEventListener("mousemove",(function(e){ne(e.clientX)})),document.addEventListener("mouseup",Ke),window.addEventListener("resize",Pe),De(),function(){window.removeEventListener("resize",Pe)}}),[]),l((function(){Re.current||(null!==A&&null!==R&&Ne&&z({left:A+Ne/2,width:R-A}),B&&ue.current&&U((B.left+B.width/2-ue.current.clientWidth/2)/ce.current.clientWidth*100),ke&&Ve(ke),le.current&&de.current&&oe.current&&$(le.current.clientWidth/2+de.current.clientWidth/2>oe.current.clientWidth*je))}),[ke]),l((function(){Re.current?Re.current=!1:ze.current={min:C.value,max:S.value,minIndex:C.valueIndex,maxIndex:S.valueIndex}}),[C.value,S.value]),l((function(){"hover"===s?Z&&te?(q("visible"),P("hidden"),J("hidden")):pe===ae.current&&te?(P("visible"),q("hidden"),J("hidden")):pe===he.current&&te?(J("visible"),q("hidden"),P("hidden")):(P("hidden"),J("hidden"),q("hidden")):"always"===s&&(Z?(q("visible"),P("hidden"),J("hidden")):(q("hidden"),P("visible"),J("visible")))}),[Z]),l((function(){if(te&&ye&&pe&&ve&&be&&Ne&&null!==Ie&&ce.current&&null!==A&&null!==R){var e=(Ie||0)+(ee-ye),n=Math.round(e/(ce.current.clientWidth/(p.length-1))),r=ce.current.clientWidth/(p.length-1)*n-Ne/2;if(h){if(r>=ve&&r<=be){if(pe===ae.current&&r>R)return;if(pe===he.current&&r<A)return;pe===ae.current&&k(r),pe===he.current&&X(r)}}else if(e>=ve&&e<=be){if(pe===ae.current&&e>=R)return;if(pe===he.current&&e<=A)return;pe===ae.current&&k(e),pe===he.current&&X(e)}Ee(pe)}}),[ee]);var Fe=function(e){if(ae.current&&he.current&&Ne&&ve&&be&&null!==A&&null!==R){var n=Math.abs(e.clientX-ae.current.getBoundingClientRect().left)>Math.abs(e.clientX-he.current.getBoundingClientRect().left)?he.current:ae.current;Le(n.offsetLeft);var r=n.offsetLeft+(e.clientX-n.getBoundingClientRect().left)-Ne/2,t=Math.round(r/(ce.current.clientWidth/(p.length-1))),i=ce.current.clientWidth/(p.length-1)*t-Ne/2;if(h){if(i>=ve&&i<=be){if(n===ae.current&&i>R)return;if(n===he.current&&i<A)return;n===ae.current&&k(i),n===he.current&&X(i)}}else if(r>=ve&&r<=be){if(n===ae.current&&r>=R)return;if(n===he.current&&r<=A)return;n===ae.current&&k(r),n===he.current&&X(r)}Ee(n)}},Ve=function(e){if(ce.current&&oe.current&&e&&Ne){var n=ce.current.clientWidth/p.length,r=Number(window.getComputedStyle(e).left.replace("px",""));r=(r=r>ce.current.clientWidth?ce.current.clientWidth+Ne/2:r+Ne/2)<=0?0:r;var t=Math.floor(r/n);t>=p.length&&(t=p.length-1);var i="string"==typeof p[t]?p[t]:p[t].toString();e===ae.current&&N({value:y(i),valueIndex:t}),e===he.current&&I({value:y(i),valueIndex:t})}Ee(null)};return e("div",u({className:"double-range-slider-container"},{children:[n("div",u({className:"double-range-slider-rail",ref:ce,onClick:Fe},{children:h&&p.map((function(e,r){return ce.current&&r>0&&r<p.length-1&&n("div",{className:"double-range-slider-step",style:{left:"".concat(ce.current.clientWidth/(p.length-1)*r-2.5,"px")}},r)}))})),n("div",{className:"double-range-slider-track",ref:oe,style:B?{left:"".concat(B.left/(null===(c=ce.current)||void 0===c?void 0:c.clientWidth)*100,"%"),width:"".concat(B.width,"px")}:void 0,onMouseOver:function(){"hover"===s&&Z?(q("visible"),P("hidden"),J("hidden")):"hover"===s&&(q("hidden"),P("hidden"),J("hidden"))},onMouseOut:function(){("hover"===s&&Z||"hover"===s)&&(q("hidden"),P("hidden"),J("hidden"))},onClick:Fe}),n("div",u({className:"double-range-slider-min double-range-slider-ball".concat(pe===ae.current?" double-range-slider-active":""),style:{left:"".concat(A/(null===(o=ce.current)||void 0===o?void 0:o.clientWidth)*100,"%")},ref:ae,onMouseOver:function(){"hover"!==s||Z?"hover"===s&&Z&&(P("hidden"),q("visible")):(P("visible"),q("hidden"))},onMouseOut:function(){"hover"!==s||Z?"hover"===s&&Z&&(P("hidden"),q("hidden")):(P("hidden"),q("hidden"))},onMouseDown:function(e){Me(ee),we(ae.current),Le(A),ie(!0)}},{children:n("div",u({className:"double-range-slider-tooltip ".concat(v?"double-range-slider-".concat(v):"double-range-slider-over"),style:{visibility:K},ref:le},{children:n("p",u({className:"double-range-slider-min-text-holder double-range-slider-text-holder"},{children:C.value}))}))})),n("div",u({className:"double-range-slider-mid double-range-slider-tooltip ".concat(v?"double-range-slider-".concat(v):"double-range-slider-over"),ref:ue,style:{visibility:V,left:"".concat(T,"%")}},{children:n("p",u({className:"double-range-slider-mid-text-holder double-range-slider-text-holder"},{children:C.value===S.value?"".concat(C.value):"".concat(C.value," - ").concat(S.value)}))})),n("div",u({className:"double-range-slider-max double-range-slider-ball".concat(pe===he.current?" double-range-slider-active":""),style:{left:"".concat(R/(null===(a=ce.current)||void 0===a?void 0:a.clientWidth)*100,"%")},ref:he,onMouseOver:function(){"hover"!==s||Z?"hover"===s&&Z&&(J("hidden"),q("visible")):(J("visible"),q("hidden"))},onMouseOut:function(){"hover"!==s||Z?"hover"===s&&Z&&(J("hidden"),q("hidden")):(J("hidden"),q("hidden"))},onMouseDown:function(e){Me(ee),we(he.current),Le(R),ie(!0)}},{children:n("div",u({className:"double-range-slider-tooltip ".concat(v?"double-range-slider-".concat(v):"double-range-slider-over"),style:{visibility:H},ref:de},{children:n("p",u({className:"double-range-slider-max-text-holder double-range-slider-text-holder"},{children:S.value}))}))}))]}))};export{d as RangeSlider};
 //# sourceMappingURL=index.js.map

dist/index.d.ts

@@ -7,2 +7,8 @@ import React from 'react';
 }
+interface Output {
+    min: string;
+    max: string;
+    minIndex: number;
+    maxIndex: number;
+}
 interface RangeSliderProps {
@@ -16,8 +22,3 @@ hasSteps?: boolean;
     formatter?: (value: number | string) => string;
-    onChange: (value: {
-        min: string;
-        max: string;
-        minIndex: number;
-        maxIndex: number;
-    }) => void;
+    onChange: (value: Output) => void;
 }
@@ -24,0 +25,0 @@

package.json

 {
   "name": "react-double-range-slider",
-  "version": "1.6.1",
+  "version": "1.7.0",
   "description": "Range slider component for React 18",
@@ -5,0 +5,0 @@ "main": "dist/cjs/index.js",

Fixed alerts

AI-detected possible typosquat

Supply chain risk

AI has identified this package as a potential typosquat of a more popular package. This suggests that the package may be intentionally mimicking another package's name, description, or other metadata.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

94027

increased by0.48%

Lines of code

386

increased by1.05%

Number of medium supply chain risk alerts

0

decreased by-100%

No dependency changes