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

Comparing version 1.0.4 to 1.0.5

lib/MultiRangeSlider.js

@@ -1,1 +0,1 @@
-module.exports=function(e){var t={};function n(r){if(t[r])return t[r].exports;var a=t[r]={i:r,l:!1,exports:{}};return e[r].call(a.exports,a,a.exports,n),a.l=!0,a.exports}return n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var a in e)n.d(r,a,function(t){return e[t]}.bind(null,a));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=0)}([function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var r,a=function(e,t){if(Array.isArray(e))return e;if(Symbol.iterator in Object(e))return function(e,t){var n=[],r=!0,a=!1,o=void 0;try{for(var i,l=e[Symbol.iterator]();!(r=(i=l.next()).done)&&(n.push(i.value),!t||n.length!==t);r=!0);}catch(e){a=!0,o=e}finally{try{!r&&l.return&&l.return()}finally{if(a)throw o}}return n}(e,t);throw new TypeError("Invalid attempt to destructure non-iterable instance")},o=n(1),i=(r=o)&&r.__esModule?r:{default:r};n(2);t.default=function(e){var t=e.baseClassName||"multi-range-slider",n=parseFloat(e.min||0),r=parseFloat(e.max||100),l=parseFloat(e.step||5),u=(r-n)/l,s="true"===e.preventWheel||!0===e.preventWheel||!1,c=(0,o.useState)(parseFloat(e.minValue||25)),d=a(c,2),p=d[0],f=d[1],m=(0,o.useState)(parseFloat(e.maxValue||75)),v=a(m,2),h=v[0],x=v[1],b=(0,o.useState)((p-n)/(r-n)*100),g=a(b,2),y=g[0],w=g[1],E=(0,o.useState)((r-h)/(r-n)*100),k=a(E,2),N=k[0],S=k[1],L=(0,o.useState)(!0),j=a(L,2),C=j[0],M=j[1],O="MultiRangeSlider"+function(e){var t="0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ";e=e||10;for(var n="_",r=0;r<e;r++)n+=t[Math.floor(Math.random()*t.length)];return n}(15),F=null,T=null,_=0,A=null,I=function(e){if(T=e.clientX,"touchstart"===e.type){if(1!==e.touches.length)return;T=e.touches[0].clientX}_=p,A=e.target.parentNode,F=A.getBoundingClientRect(),document.addEventListener("mousemove",K),document.addEventListener("mouseup",R),document.addEventListener("touchmove",K),document.addEventListener("touchend",R),A.classList.add("active")},K=function(e){var t=e.clientX;"touchmove"===e.type&&(t=e.touches[0].clientX);var a=(t-T)/F.width,o=_+(r-n)*a,i=0;(""+l).indexOf(".")>=0&&(i=2),(o=parseFloat(o.toFixed(i)))<n?o=n:o>h-l&&(o=h-l),f(o),w((o-n)/(r-n)*100),B(o,h)},R=function e(t){document.removeEventListener("mousemove",K),document.removeEventListener("mouseup",e),document.removeEventListener("touchmove",K),document.removeEventListener("touchend",e),A.classList.remove("active")},z=function(e){if(T=e.clientX,"touchstart"===e.type){if(1!==e.touches.length)return;T=e.touches[0].clientX}_=h,A=e.target.parentNode,F=A.getBoundingClientRect(),document.addEventListener("mousemove",X),document.addEventListener("mouseup",P),document.addEventListener("touchmove",X),document.addEventListener("touchend",P),A.classList.add("active")},X=function(e){var t=e.clientX;"touchmove"===e.type&&(t=e.touches[0].clientX);var a=(t-T)/F.width,o=_+(r-n)*a,i=0;(""+l).indexOf(".")>=0&&(i=2),(o=parseFloat(o.toFixed(i)))<p+l?o=p+l:o>r&&(o=r),x(o),S((r-o)/(r-n)*100),B(p,o)},P=function e(t){document.removeEventListener("mousemove",X),document.removeEventListener("mouseup",e),document.removeEventListener("touchmove",X),document.removeEventListener("touchend",e),A.classList.remove("active")},B=function(t,a){var o={min:n,max:r,minValue:t,maxValue:a};e.onInput&&e.onInput(o),e.onChange&&e.onChange(o)};return(0,o.useEffect)((function(){C&&(document.querySelector("#"+O).addEventListener("wheel",(function(e){!0!==s&&(e.shiftKey||e.ctrlKey)&&e.preventDefault()})),M(!1))}),[C,s,O]),i.default.createElement("div",{id:O,className:t,onWheel:function(e){if(!0!==s&&(e.shiftKey||e.ctrlKey)){var t=(r-n)/100;t>1&&(t=1),e.deltaY<0&&(t=-t);var a=p,o=h;e.shiftKey&&e.ctrlKey?a+t>=n&&o+t<=r&&(a+=t,o+=t):e.ctrlKey?((t=o+t)<a+l?t=a+l:t>r&&(t=r),o=t):e.shiftKey&&((t=a+t)<n?t=n:t>o-l&&(t=o-l),a=t),x(o),f(a),w((a-n)/(r-n)*100),S((r-o)/(r-n)*100),B(a,o)}}},i.default.createElement("div",{className:"bar"},i.default.createElement("div",{className:"bar-left",style:{width:y+"%"},onClick:function(e){var t=p-l;t<n&&(t=n),f(t),w((t-n)/(r-n)*100),B(t,h)}}),i.default.createElement("input",{className:"input-type-range input-type-range-min",type:"range",min:n,max:r,step:l,value:p,onInput:function(e){var t=parseFloat(e.target.value);t>h-l&&(t=h-l),f(t),w((t-n)/(r-n)*100),B(t,h)}}),i.default.createElement("div",{className:"thumb thumb-left",onMouseDown:I,onTouchStart:I},i.default.createElement("div",{className:"min-value"},p)),i.default.createElement("div",{className:"bar-inner"},i.default.createElement("div",{className:"bar-inner-left",onClick:function(e){var t=p+l;t>h-l&&(t=h-l),f(t),w((t-n)/(r-n)*100),B(t,h)}}),i.default.createElement("div",{className:"bar-inner-right",onClick:function(e){var t=h-l;t<p+l&&(t=p+l),x(t),S((r-t)/(r-n)*100),B(p,t)}})),i.default.createElement("input",{className:"input-type-range input-type-range-max",type:"range",min:n,max:r,step:l,value:h,onInput:function(e){var t=parseFloat(e.target.value);t<p+l&&(t=p+l),x(t),S((r-t)/(r-n)*100),B(p,t)}}),i.default.createElement("div",{className:"thumb thumb-right",onMouseDown:z,onTouchStart:z},i.default.createElement("div",{className:"max-value"},h)),i.default.createElement("div",{className:"bar-right",style:{width:N+"%"},onClick:function(e){var t=h+l;t>r&&(t=r),x(t),S((r-t)/(r-n)*100),B(p,t)}})),i.default.createElement("div",{className:"ruler"},[].concat(function(e){if(Array.isArray(e)){for(var t=0,n=Array(e.length);t<e.length;t++)n[t]=e[t];return n}return Array.from(e)}(Array(u))).map((function(e,t){return i.default.createElement("div",{key:t,className:"ruler-rule"})}))),i.default.createElement("div",{className:"label"},i.default.createElement("div",{className:"label-min"},n),i.default.createElement("div",{className:"label-max"},r)))}},function(e,t){e.exports=require("react")},function(e,t,n){var r=n(3),a=n(4);"string"==typeof(a=a.__esModule?a.default:a)&&(a=[[e.i,a,""]]);var o={insert:"head",singleton:!1};r(a,o);e.exports=a.locals||{}},function(e,t,n){"use strict";var r,a=function(){return void 0===r&&(r=Boolean(window&&document&&document.all&&!window.atob)),r},o=function(){var e={};return function(t){if(void 0===e[t]){var n=document.querySelector(t);if(window.HTMLIFrameElement&&n instanceof window.HTMLIFrameElement)try{n=n.contentDocument.head}catch(e){n=null}e[t]=n}return e[t]}}(),i=[];function l(e){for(var t=-1,n=0;n<i.length;n++)if(i[n].identifier===e){t=n;break}return t}function u(e,t){for(var n={},r=[],a=0;a<e.length;a++){var o=e[a],u=t.base?o[0]+t.base:o[0],s=n[u]||0,c="".concat(u," ").concat(s);n[u]=s+1;var d=l(c),p={css:o[1],media:o[2],sourceMap:o[3]};-1!==d?(i[d].references++,i[d].updater(p)):i.push({identifier:c,updater:h(p,t),references:1}),r.push(c)}return r}function s(e){var t=document.createElement("style"),r=e.attributes||{};if(void 0===r.nonce){var a=n.nc;a&&(r.nonce=a)}if(Object.keys(r).forEach((function(e){t.setAttribute(e,r[e])})),"function"==typeof e.insert)e.insert(t);else{var i=o(e.insert||"head");if(!i)throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");i.appendChild(t)}return t}var c,d=(c=[],function(e,t){return c[e]=t,c.filter(Boolean).join("\n")});function p(e,t,n,r){var a=n?"":r.media?"@media ".concat(r.media," {").concat(r.css,"}"):r.css;if(e.styleSheet)e.styleSheet.cssText=d(t,a);else{var o=document.createTextNode(a),i=e.childNodes;i[t]&&e.removeChild(i[t]),i.length?e.insertBefore(o,i[t]):e.appendChild(o)}}function f(e,t,n){var r=n.css,a=n.media,o=n.sourceMap;if(a?e.setAttribute("media",a):e.removeAttribute("media"),o&&"undefined"!=typeof btoa&&(r+="\n/*# sourceMappingURL=data:application/json;base64,".concat(btoa(unescape(encodeURIComponent(JSON.stringify(o))))," */")),e.styleSheet)e.styleSheet.cssText=r;else{for(;e.firstChild;)e.removeChild(e.firstChild);e.appendChild(document.createTextNode(r))}}var m=null,v=0;function h(e,t){var n,r,a;if(t.singleton){var o=v++;n=m||(m=s(t)),r=p.bind(null,n,o,!1),a=p.bind(null,n,o,!0)}else n=s(t),r=f.bind(null,n,t),a=function(){!function(e){if(null===e.parentNode)return!1;e.parentNode.removeChild(e)}(n)};return r(e),function(t){if(t){if(t.css===e.css&&t.media===e.media&&t.sourceMap===e.sourceMap)return;r(e=t)}else a()}}e.exports=function(e,t){(t=t||{}).singleton||"boolean"==typeof t.singleton||(t.singleton=a());var n=u(e=e||[],t);return function(e){if(e=e||[],"[object Array]"===Object.prototype.toString.call(e)){for(var r=0;r<n.length;r++){var a=l(n[r]);i[a].references--}for(var o=u(e,t),s=0;s<n.length;s++){var c=l(n[s]);0===i[c].references&&(i[c].updater(),i.splice(c,1))}n=o}}}},function(e,t,n){(t=n(5)(!1)).push([e.i,".multi-range-slider * {\r\n\tbox-sizing: border-box;\r\n\tpadding: 0px;\r\n\tmargin: 0px;\r\n}\r\n.multi-range-slider {\r\n\tdisplay: flex;\r\n\tposition: relative;\r\n\tborder: solid 1px gray;\r\n\tborder-radius: 10px;\r\n\tpadding: 20px 10px;\r\n\tbox-shadow: 1px 1px 4px black;\r\n\tflex-direction: column;\r\n\t-webkit-touch-callout: none; /* iOS Safari */\r\n\t-webkit-user-select: none; /* Safari */\r\n\t-khtml-user-select: none; /* Konqueror HTML */\r\n\t-moz-user-select: none; /* Old versions of Firefox */\r\n\t-ms-user-select: none; /* Internet Explorer/Edge */\r\n\tuser-select: none; /* Non-prefixed version, currently supported by Chrome, Edge,*/\r\n}\r\n.multi-range-slider .bar {\r\n\tdisplay: flex;\r\n}\r\n.multi-range-slider .bar * {\r\n\ttransition: all 100ms;\r\n}\r\n.multi-range-slider .bar.active * {\r\n\ttransition: none;\r\n}\r\n.multi-range-slider .bar-left {\r\n\twidth: 25%;\r\n\tbackground-color: #f0f0f0;\r\n\tborder-radius: 10px 0px 0px 10px;\r\n\tbox-shadow: inset 0px 0px 5px black;\r\n\tpadding: 4px 0px;\r\n}\r\n.multi-range-slider .bar-right {\r\n\twidth: 25%;\r\n\tbackground-color: #f0f0f0;\r\n\tborder-radius: 0px 10px 10px 0px;\r\n\tbox-shadow: inset 0px 0px 5px black;\r\n}\r\n.multi-range-slider .bar-inner {\r\n\tbackground-color: lime;\r\n\tdisplay: flex;\r\n\tflex-grow: 1;\r\n\tflex-shrink: 1;\r\n\tjustify-content: space-between;\r\n\tposition: relative;\r\n\tborder: solid 1px black;\r\n\tjustify-content: space-between;\r\n\tbox-shadow: inset 0px 0px 5px black;\r\n}\r\n.multi-range-slider .bar-inner-left {\r\n\twidth: 50%;\r\n}\r\n.multi-range-slider .bar-inner-right {\r\n\twidth: 50%;\r\n}\r\n.multi-range-slider .thumb {\r\n\tbackground-color: red;\r\n\tposition: relative;\r\n\tz-index: 1;\r\n\tcursor: pointer;\r\n}\r\n.multi-range-slider .thumb::before {\r\n\tcontent: '';\r\n\tbackground-color: white;\r\n\tposition: absolute;\r\n\twidth: 20px;\r\n\theight: 20px;\r\n\tborder: solid 1px black;\r\n\tbox-shadow: 0px 0px 3px black, inset 0px 0px 5px gray;\r\n\tborder-radius: 50%;\r\n\tz-index: 1;\r\n\tmargin: -8px;\r\n\tcursor: pointer;\r\n}\r\n.multi-range-slider .input-type-range:focus + .thumb::after {\r\n\tcontent: '';\r\n\tposition: absolute;\r\n\ttop: -4px;\r\n\tleft: -4px;\r\n\twidth: 11px;\r\n\theight: 11px;\r\n\tz-index: 2;\r\n\tborder-radius: 50%;\r\n\tborder: dotted 1px black;\r\n\tbox-shadow: 0px 0px 5px white, inset 0px 0px 10px black;\r\n}\r\n\r\n.multi-range-slider .thumb * {\r\n\tposition: absolute;\r\n\tbottom: 25px;\r\n\twidth: 30px;\r\n\theight: 30px;\r\n\tleft: -15px;\r\n\tfont-size: 75%;\r\n\ttext-align: center;\r\n\tline-height: 30px;\r\n\tbackground-color: blue;\r\n\tborder-radius: 50%;\r\n\tcolor: white;\r\n\tbox-shadow: 0px 0px 5px black;\r\n\tdisplay: none;\r\n}\r\n.multi-range-slider .thumb:active * {\r\n\tdisplay: block;\r\n}\r\n.input-type-range {\r\n\tposition: absolute;\r\n\ttop: 0px;\r\n\tleft: 0px;\r\n\twidth: 100%;\r\n\topacity: 0;\r\n\tpointer-events: none;\r\n}\r\n\r\n.multi-range-slider .ruler {\r\n\tmargin: 10px 0px -5px 0px;\r\n\tdisplay: flex;\r\n\t/* display: none; */\r\n}\r\n.multi-range-slider .ruler .ruler-rule {\r\n\tborder-left: solid 1px;\r\n\tborder-bottom: solid 1px;\r\n\tdisplay: flex;\r\n\tflex-grow: 1;\r\n\tflex-shrink: 1;\r\n\tpadding: 5px 0px;\r\n}\r\n\r\n.multi-range-slider .ruler .ruler-rule:last-child {\r\n\tborder-right: solid 1px;\r\n}\r\n\r\n.multi-range-slider .label {\r\n\tdisplay: flex;\r\n\tjustify-content: space-between;\r\n\tpadding: 0px;\r\n\tmargin-top: 10px;\r\n\tmargin-bottom: -20px;\r\n\t/* display: none; */\r\n}\r\n.multi-range-slider .label-min {\r\n\tfont-size: 80%;\r\n}\r\n.multi-range-slider .label-max {\r\n\tfont-size: 80%;\r\n}\r\n",""]),e.exports=t},function(e,t,n){"use strict";e.exports=function(e){var t=[];return t.toString=function(){return this.map((function(t){var n=function(e,t){var n=e[1]||"",r=e[3];if(!r)return n;if(t&&"function"==typeof btoa){var a=(i=r,l=btoa(unescape(encodeURIComponent(JSON.stringify(i)))),u="sourceMappingURL=data:application/json;charset=utf-8;base64,".concat(l),"/*# ".concat(u," */")),o=r.sources.map((function(e){return"/*# sourceURL=".concat(r.sourceRoot||"").concat(e," */")}));return[n].concat(o).concat([a]).join("\n")}var i,l,u;return[n].join("\n")}(t,e);return t[2]?"@media ".concat(t[2]," {").concat(n,"}"):n})).join("")},t.i=function(e,n,r){"string"==typeof e&&(e=[[null,e,""]]);var a={};if(r)for(var o=0;o<this.length;o++){var i=this[o][0];null!=i&&(a[i]=!0)}for(var l=0;l<e.length;l++){var u=[].concat(e[l]);r&&a[u[0]]||(n&&(u[2]?u[2]="".concat(n," and ").concat(u[2]):u[2]=n),t.push(u))}},t}}]);
+module.exports=function(e){var t={};function n(r){if(t[r])return t[r].exports;var a=t[r]={i:r,l:!1,exports:{}};return e[r].call(a.exports,a,a.exports,n),a.l=!0,a.exports}return n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var a in e)n.d(r,a,function(t){return e[t]}.bind(null,a));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=0)}([function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var r,a=function(e,t){if(Array.isArray(e))return e;if(Symbol.iterator in Object(e))return function(e,t){var n=[],r=!0,a=!1,o=void 0;try{for(var i,l=e[Symbol.iterator]();!(r=(i=l.next()).done)&&(n.push(i.value),!t||n.length!==t);r=!0);}catch(e){a=!0,o=e}finally{try{!r&&l.return&&l.return()}finally{if(a)throw o}}return n}(e,t);throw new TypeError("Invalid attempt to destructure non-iterable instance")},o=n(1),i=(r=o)&&r.__esModule?r:{default:r};n(2);t.default=function(e){var t=e.baseClassName||"multi-range-slider",n=parseFloat(e.min||0),r=parseFloat(e.max||100),l=parseFloat(e.step||5),u=(r-n)/l,s=void 0===e.ruler||e.ruler,c=void 0===e.label||e.label;s=!("false"===s||!s),c=!("false"===c||!c);var d="true"===e.preventWheel||!0===e.preventWheel||!1,p=(0,o.useState)(parseFloat(e.minValue||25)),f=a(p,2),m=f[0],v=f[1],h=(0,o.useState)(parseFloat(e.maxValue||75)),x=a(h,2),b=x[0],g=x[1],y=(0,o.useState)((m-n)/(r-n)*100),w=a(y,2),E=w[0],k=w[1],N=(0,o.useState)((r-b)/(r-n)*100),S=a(N,2),L=S[0],j=S[1],C=(0,o.useState)(!0),M=a(C,2),O=M[0],F=M[1],T="MultiRangeSlider"+function(e){var t="0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ";e=e||10;for(var n="_",r=0;r<e;r++)n+=t[Math.floor(Math.random()*t.length)];return n}(15),_=null,A=null,I=0,K=null,R=function(e){if(A=e.clientX,"touchstart"===e.type){if(1!==e.touches.length)return;A=e.touches[0].clientX}I=m,K=e.target.parentNode,_=K.getBoundingClientRect(),document.addEventListener("mousemove",z),document.addEventListener("mouseup",X),document.addEventListener("touchmove",z),document.addEventListener("touchend",X),K.classList.add("active")},z=function(e){var t=e.clientX;"touchmove"===e.type&&(t=e.touches[0].clientX);var a=(t-A)/_.width,o=I+(r-n)*a,i=0;(""+l).indexOf(".")>=0&&(i=2),(o=parseFloat(o.toFixed(i)))<n?o=n:o>b-l&&(o=b-l),v(o),k((o-n)/(r-n)*100),q(o,b)},X=function e(t){document.removeEventListener("mousemove",z),document.removeEventListener("mouseup",e),document.removeEventListener("touchmove",z),document.removeEventListener("touchend",e),K.classList.remove("active")},P=function(e){if(A=e.clientX,"touchstart"===e.type){if(1!==e.touches.length)return;A=e.touches[0].clientX}I=b,K=e.target.parentNode,_=K.getBoundingClientRect(),document.addEventListener("mousemove",B),document.addEventListener("mouseup",U),document.addEventListener("touchmove",B),document.addEventListener("touchend",U),K.classList.add("active")},B=function(e){var t=e.clientX;"touchmove"===e.type&&(t=e.touches[0].clientX);var a=(t-A)/_.width,o=I+(r-n)*a,i=0;(""+l).indexOf(".")>=0&&(i=2),(o=parseFloat(o.toFixed(i)))<m+l?o=m+l:o>r&&(o=r),g(o),j((r-o)/(r-n)*100),q(m,o)},U=function e(t){document.removeEventListener("mousemove",B),document.removeEventListener("mouseup",e),document.removeEventListener("touchmove",B),document.removeEventListener("touchend",e),K.classList.remove("active")},q=function(t,a){var o={min:n,max:r,minValue:t,maxValue:a};e.onInput&&e.onInput(o),e.onChange&&e.onChange(o)};return(0,o.useEffect)((function(){O&&(document.querySelector("#"+T).addEventListener("wheel",(function(e){!0!==d&&(e.shiftKey||e.ctrlKey)&&e.preventDefault()})),F(!1))}),[O,d,T]),i.default.createElement("div",{id:T,className:t,onWheel:function(e){if(!0!==d&&(e.shiftKey||e.ctrlKey)){var t=(r-n)/100;t>1&&(t=1),e.deltaY<0&&(t=-t);var a=m,o=b;e.shiftKey&&e.ctrlKey?a+t>=n&&o+t<=r&&(a+=t,o+=t):e.ctrlKey?((t=o+t)<a+l?t=a+l:t>r&&(t=r),o=t):e.shiftKey&&((t=a+t)<n?t=n:t>o-l&&(t=o-l),a=t),g(o),v(a),k((a-n)/(r-n)*100),j((r-o)/(r-n)*100),q(a,o)}}},i.default.createElement("div",{className:"bar"},i.default.createElement("div",{className:"bar-left",style:{width:E+"%"},onClick:function(e){var t=m-l;t<n&&(t=n),v(t),k((t-n)/(r-n)*100),q(t,b)}}),i.default.createElement("input",{className:"input-type-range input-type-range-min",type:"range",min:n,max:r,step:l,value:m,onInput:function(e){var t=parseFloat(e.target.value);t>b-l&&(t=b-l),v(t),k((t-n)/(r-n)*100),q(t,b)}}),i.default.createElement("div",{className:"thumb thumb-left",onMouseDown:R,onTouchStart:R},i.default.createElement("div",{className:"min-value"},m)),i.default.createElement("div",{className:"bar-inner"},i.default.createElement("div",{className:"bar-inner-left",onClick:function(e){var t=m+l;t>b-l&&(t=b-l),v(t),k((t-n)/(r-n)*100),q(t,b)}}),i.default.createElement("div",{className:"bar-inner-right",onClick:function(e){var t=b-l;t<m+l&&(t=m+l),g(t),j((r-t)/(r-n)*100),q(m,t)}})),i.default.createElement("input",{className:"input-type-range input-type-range-max",type:"range",min:n,max:r,step:l,value:b,onInput:function(e){var t=parseFloat(e.target.value);t<m+l&&(t=m+l),g(t),j((r-t)/(r-n)*100),q(m,t)}}),i.default.createElement("div",{className:"thumb thumb-right",onMouseDown:P,onTouchStart:P},i.default.createElement("div",{className:"max-value"},b)),i.default.createElement("div",{className:"bar-right",style:{width:L+"%"},onClick:function(e){var t=b+l;t>r&&(t=r),g(t),j((r-t)/(r-n)*100),q(m,t)}})),s&&i.default.createElement("div",{className:"ruler"},[].concat(function(e){if(Array.isArray(e)){for(var t=0,n=Array(e.length);t<e.length;t++)n[t]=e[t];return n}return Array.from(e)}(Array(u))).map((function(e,t){return i.default.createElement("div",{key:t,className:"ruler-rule"})}))),c&&i.default.createElement("div",{className:"label"},i.default.createElement("div",{className:"label-min"},n),i.default.createElement("div",{className:"label-max"},r)))}},function(e,t){e.exports=require("react")},function(e,t,n){var r=n(3),a=n(4);"string"==typeof(a=a.__esModule?a.default:a)&&(a=[[e.i,a,""]]);var o={insert:"head",singleton:!1};r(a,o);e.exports=a.locals||{}},function(e,t,n){"use strict";var r,a=function(){return void 0===r&&(r=Boolean(window&&document&&document.all&&!window.atob)),r},o=function(){var e={};return function(t){if(void 0===e[t]){var n=document.querySelector(t);if(window.HTMLIFrameElement&&n instanceof window.HTMLIFrameElement)try{n=n.contentDocument.head}catch(e){n=null}e[t]=n}return e[t]}}(),i=[];function l(e){for(var t=-1,n=0;n<i.length;n++)if(i[n].identifier===e){t=n;break}return t}function u(e,t){for(var n={},r=[],a=0;a<e.length;a++){var o=e[a],u=t.base?o[0]+t.base:o[0],s=n[u]||0,c="".concat(u," ").concat(s);n[u]=s+1;var d=l(c),p={css:o[1],media:o[2],sourceMap:o[3]};-1!==d?(i[d].references++,i[d].updater(p)):i.push({identifier:c,updater:h(p,t),references:1}),r.push(c)}return r}function s(e){var t=document.createElement("style"),r=e.attributes||{};if(void 0===r.nonce){var a=n.nc;a&&(r.nonce=a)}if(Object.keys(r).forEach((function(e){t.setAttribute(e,r[e])})),"function"==typeof e.insert)e.insert(t);else{var i=o(e.insert||"head");if(!i)throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");i.appendChild(t)}return t}var c,d=(c=[],function(e,t){return c[e]=t,c.filter(Boolean).join("\n")});function p(e,t,n,r){var a=n?"":r.media?"@media ".concat(r.media," {").concat(r.css,"}"):r.css;if(e.styleSheet)e.styleSheet.cssText=d(t,a);else{var o=document.createTextNode(a),i=e.childNodes;i[t]&&e.removeChild(i[t]),i.length?e.insertBefore(o,i[t]):e.appendChild(o)}}function f(e,t,n){var r=n.css,a=n.media,o=n.sourceMap;if(a?e.setAttribute("media",a):e.removeAttribute("media"),o&&"undefined"!=typeof btoa&&(r+="\n/*# sourceMappingURL=data:application/json;base64,".concat(btoa(unescape(encodeURIComponent(JSON.stringify(o))))," */")),e.styleSheet)e.styleSheet.cssText=r;else{for(;e.firstChild;)e.removeChild(e.firstChild);e.appendChild(document.createTextNode(r))}}var m=null,v=0;function h(e,t){var n,r,a;if(t.singleton){var o=v++;n=m||(m=s(t)),r=p.bind(null,n,o,!1),a=p.bind(null,n,o,!0)}else n=s(t),r=f.bind(null,n,t),a=function(){!function(e){if(null===e.parentNode)return!1;e.parentNode.removeChild(e)}(n)};return r(e),function(t){if(t){if(t.css===e.css&&t.media===e.media&&t.sourceMap===e.sourceMap)return;r(e=t)}else a()}}e.exports=function(e,t){(t=t||{}).singleton||"boolean"==typeof t.singleton||(t.singleton=a());var n=u(e=e||[],t);return function(e){if(e=e||[],"[object Array]"===Object.prototype.toString.call(e)){for(var r=0;r<n.length;r++){var a=l(n[r]);i[a].references--}for(var o=u(e,t),s=0;s<n.length;s++){var c=l(n[s]);0===i[c].references&&(i[c].updater(),i.splice(c,1))}n=o}}}},function(e,t,n){(t=n(5)(!1)).push([e.i,".multi-range-slider * {\r\n\tbox-sizing: border-box;\r\n\tpadding: 0px;\r\n\tmargin: 0px;\r\n}\r\n.multi-range-slider {\r\n\tdisplay: flex;\r\n\tposition: relative;\r\n\tborder: solid 1px gray;\r\n\tborder-radius: 10px;\r\n\tpadding: 20px 10px;\r\n\tbox-shadow: 1px 1px 4px black;\r\n\tflex-direction: column;\r\n\t-webkit-touch-callout: none; /* iOS Safari */\r\n\t-webkit-user-select: none; /* Safari */\r\n\t-khtml-user-select: none; /* Konqueror HTML */\r\n\t-moz-user-select: none; /* Old versions of Firefox */\r\n\t-ms-user-select: none; /* Internet Explorer/Edge */\r\n\tuser-select: none; /* Non-prefixed version, currently supported by Chrome, Edge,*/\r\n}\r\n.multi-range-slider .bar {\r\n\tdisplay: flex;\r\n}\r\n.multi-range-slider .bar * {\r\n\ttransition: all 100ms;\r\n}\r\n.multi-range-slider .bar.active * {\r\n\ttransition: none;\r\n}\r\n.multi-range-slider .bar-left {\r\n\twidth: 25%;\r\n\tbackground-color: #f0f0f0;\r\n\tborder-radius: 10px 0px 0px 10px;\r\n\tbox-shadow: inset 0px 0px 5px black;\r\n\tpadding: 4px 0px;\r\n}\r\n.multi-range-slider .bar-right {\r\n\twidth: 25%;\r\n\tbackground-color: #f0f0f0;\r\n\tborder-radius: 0px 10px 10px 0px;\r\n\tbox-shadow: inset 0px 0px 5px black;\r\n}\r\n.multi-range-slider .bar-inner {\r\n\tbackground-color: lime;\r\n\tdisplay: flex;\r\n\tflex-grow: 1;\r\n\tflex-shrink: 1;\r\n\tjustify-content: space-between;\r\n\tposition: relative;\r\n\tborder: solid 1px black;\r\n\tjustify-content: space-between;\r\n\tbox-shadow: inset 0px 0px 5px black;\r\n}\r\n.multi-range-slider .bar-inner-left {\r\n\twidth: 50%;\r\n}\r\n.multi-range-slider .bar-inner-right {\r\n\twidth: 50%;\r\n}\r\n.multi-range-slider .thumb {\r\n\tbackground-color: red;\r\n\tposition: relative;\r\n\tz-index: 1;\r\n\tcursor: pointer;\r\n}\r\n.multi-range-slider .thumb::before {\r\n\tcontent: '';\r\n\tbackground-color: white;\r\n\tposition: absolute;\r\n\twidth: 20px;\r\n\theight: 20px;\r\n\tborder: solid 1px black;\r\n\tbox-shadow: 0px 0px 3px black, inset 0px 0px 5px gray;\r\n\tborder-radius: 50%;\r\n\tz-index: 1;\r\n\tmargin: -8px;\r\n\tcursor: pointer;\r\n}\r\n.multi-range-slider .input-type-range:focus + .thumb::after {\r\n\tcontent: '';\r\n\tposition: absolute;\r\n\ttop: -4px;\r\n\tleft: -4px;\r\n\twidth: 11px;\r\n\theight: 11px;\r\n\tz-index: 2;\r\n\tborder-radius: 50%;\r\n\tborder: dotted 1px black;\r\n\tbox-shadow: 0px 0px 5px white, inset 0px 0px 10px black;\r\n}\r\n\r\n.multi-range-slider .thumb * {\r\n\tposition: absolute;\r\n\tbottom: 25px;\r\n\twidth: 30px;\r\n\theight: 30px;\r\n\tleft: -15px;\r\n\tfont-size: 75%;\r\n\ttext-align: center;\r\n\tline-height: 30px;\r\n\tbackground-color: blue;\r\n\tborder-radius: 50%;\r\n\tcolor: white;\r\n\tbox-shadow: 0px 0px 5px black;\r\n\tdisplay: none;\r\n}\r\n.multi-range-slider .thumb:active * {\r\n\tdisplay: block;\r\n}\r\n.input-type-range {\r\n\tposition: absolute;\r\n\ttop: 0px;\r\n\tleft: 0px;\r\n\twidth: 100%;\r\n\topacity: 0;\r\n\tpointer-events: none;\r\n}\r\n\r\n.multi-range-slider .ruler {\r\n\tmargin: 10px 0px -5px 0px;\r\n\tdisplay: flex;\r\n\t/* display: none; */\r\n}\r\n.multi-range-slider .ruler .ruler-rule {\r\n\tborder-left: solid 1px;\r\n\tborder-bottom: solid 1px;\r\n\tdisplay: flex;\r\n\tflex-grow: 1;\r\n\tflex-shrink: 1;\r\n\tpadding: 5px 0px;\r\n}\r\n\r\n.multi-range-slider .ruler .ruler-rule:last-child {\r\n\tborder-right: solid 1px;\r\n}\r\n\r\n.multi-range-slider .label {\r\n\tdisplay: flex;\r\n\tjustify-content: space-between;\r\n\tpadding: 0px;\r\n\tmargin-top: 10px;\r\n\tmargin-bottom: -20px;\r\n\t/* display: none; */\r\n}\r\n.multi-range-slider .label-min {\r\n\tfont-size: 80%;\r\n}\r\n.multi-range-slider .label-max {\r\n\tfont-size: 80%;\r\n}\r\n",""]),e.exports=t},function(e,t,n){"use strict";e.exports=function(e){var t=[];return t.toString=function(){return this.map((function(t){var n=function(e,t){var n=e[1]||"",r=e[3];if(!r)return n;if(t&&"function"==typeof btoa){var a=(i=r,l=btoa(unescape(encodeURIComponent(JSON.stringify(i)))),u="sourceMappingURL=data:application/json;charset=utf-8;base64,".concat(l),"/*# ".concat(u," */")),o=r.sources.map((function(e){return"/*# sourceURL=".concat(r.sourceRoot||"").concat(e," */")}));return[n].concat(o).concat([a]).join("\n")}var i,l,u;return[n].join("\n")}(t,e);return t[2]?"@media ".concat(t[2]," {").concat(n,"}"):n})).join("")},t.i=function(e,n,r){"string"==typeof e&&(e=[[null,e,""]]);var a={};if(r)for(var o=0;o<this.length;o++){var i=this[o][0];null!=i&&(a[i]=!0)}for(var l=0;l<e.length;l++){var u=[].concat(e[l]);r&&a[u[0]]||(n&&(u[2]?u[2]="".concat(n," and ").concat(u[2]):u[2]=n),t.push(u))}},t}}]);

package.json

 {
 	"name": "multi-range-slider-react",
-	"version": "1.0.4",
+	"version": "1.0.5",
 	"description": "react component that return two value minValue and maxValue by event onInput/onChange.",
@@ -5,0 +5,0 @@ "main": "./lib/MultiRangeSlider.js",

No alert changes

Improved metrics

Total package byte prevSize

35416

0.46%

No dependency changes