v-range-component - npm Package Compare versions

Comparing version 1.0.4 to 1.0.5

dist/vRangeSlider.common.js

@@ -201,3 +201,3 @@ module.exports =
 // EXPORTS
-__webpack_require__.d(__webpack_exports__, "RangeSlider", function() { return /* reexport */ RangeSlider; });
+__webpack_require__.d(__webpack_exports__, "vRangeSlider", function() { return /* reexport */ RangeSlider; });
 
@@ -204,0 +204,0 @@ // CONCATENATED MODULE: C:/Users/webwizards/AppData/Roaming/npm/node_modules/@vue/cli-service/lib/commands/build/setPublicPath.js

dist/vRangeSlider.umd.js

@@ -210,3 +210,3 @@ (function webpackUniversalModuleDefinition(root, factory) {
 // EXPORTS
-__webpack_require__.d(__webpack_exports__, "RangeSlider", function() { return /* reexport */ RangeSlider; });
+__webpack_require__.d(__webpack_exports__, "vRangeSlider", function() { return /* reexport */ RangeSlider; });
 
@@ -213,0 +213,0 @@ // CONCATENATED MODULE: C:/Users/webwizards/AppData/Roaming/npm/node_modules/@vue/cli-service/lib/commands/build/setPublicPath.js

dist/vRangeSlider.umd.min.js

@@ -1,2 +0,2 @@
-(function(e,t){"object"===typeof exports&&"object"===typeof module?module.exports=t():"function"===typeof define&&define.amd?define([],t):"object"===typeof exports?exports["vRangeSlider"]=t():e["vRangeSlider"]=t()})("undefined"!==typeof self?self:this,(function(){return function(e){var t={};function r(a){if(t[a])return t[a].exports;var n=t[a]={i:a,l:!1,exports:{}};return e[a].call(n.exports,n,n.exports,r),n.l=!0,n.exports}return r.m=e,r.c=t,r.d=function(e,t,a){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:a})},r.r=function(e){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"===typeof e&&e&&e.__esModule)return e;var a=Object.create(null);if(r.r(a),Object.defineProperty(a,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var n in e)r.d(a,n,function(t){return e[t]}.bind(null,n));return a},r.n=function(e){var t=e&&e.__esModule?function(){return e["default"]}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.p="",r(r.s="fe4d")}({c5ab:function(e,t,r){var a,n,i;(function(r,s){n=[],a=s,i="function"===typeof a?a.apply(t,n):a,void 0===i||(e.exports=i)})("undefined"!==typeof self&&self,(function(){function e(){var t=Object.getOwnPropertyDescriptor(document,"currentScript");if(!t&&"currentScript"in document&&document.currentScript)return document.currentScript;if(t&&t.get!==e&&document.currentScript)return document.currentScript;try{throw new Error}catch(h){var r,a,n,i=/.*at [^(]*\((.*):(.+):(.+)\)$/gi,s=/@([^@]*):(\d+):(\d+)\s*$/gi,l=i.exec(h.stack)||s.exec(h.stack),o=l&&l[1]||!1,d=l&&l[2]||!1,u=document.location.href.replace(document.location.hash,""),c=document.getElementsByTagName("script");o===u&&(r=document.documentElement.outerHTML,a=new RegExp("(?:[^\\n]+?\\n){0,"+(d-2)+"}[^<]*<script>([\\d\\D]*?)<\\/script>[\\d\\D]*","i"),n=r.replace(a,"$1").trim());for(var p=0;p<c.length;p++){if("interactive"===c[p].readyState)return c[p];if(c[p].src===o)return c[p];if(o===u&&c[p].innerHTML&&c[p].innerHTML.trim()===n)return c[p]}return null}}return e}))},cac4:function(e,t,r){"use strict";r("e037")},e037:function(e,t,r){},fe4d:function(e,t,r){"use strict";if(r.r(t),r.d(t,"RangeSlider",(function(){return p})),"undefined"!==typeof window){var a=window.document.currentScript,n=r("c5ab");a=n(),"currentScript"in document||Object.defineProperty(document,"currentScript",{get:n});var i=a&&a.src.match(/(.+\/)[^/]+\.js(\?.*)?$/);i&&(r.p=i[1])}var s=function(){var e=this,t=e.$createElement,r=e._self._c||t;return r("div",{ref:"rangeSlider",staticClass:"c-rangeSlider"},[r("div",{staticClass:"c-rangeSlider__labelFrom"},[e._v(" "+e._s(e.label[0])+" ")]),r("div",{staticClass:"c-rangeSlider__wrap"},[r("div",{staticClass:"c-rangeSlider__track"}),r("div",{staticClass:"c-rangeSlider__bar"}),r("div",{staticClass:"c-rangeSlider__mid",style:{left:e.params.middlePrecentage+"%"}}),e._l(e.value,(function(t,a){return[r("div",{key:"h"+a,staticClass:"c-rangeSlider__handle",attrs:{draggable:"false"}}),r("div",{key:"i"+a,staticClass:"c-rangeSlider__handleInput"},[r("input",{directives:[{name:"model",rawName:"v-model",value:e.params.inputValue[a],expression:"params.inputValue[key]"}],attrs:{type:"number",min:a-1<!0?e.params.values[a-1]:e.range[0],max:a+1<e.params.inputValue.length?e.params.values[a+1]:e.range[1]},domProps:{value:e.params.inputValue[a]},on:{input:[function(t){t.target.composing||e.$set(e.params.inputValue,a,t.target.value)},function(t){return e.setHandleByInput()}]}}),e._v(" "+e._s(e.unit)+" ")])]})),e.showSteps?r("div",{staticClass:"c-rangeSlider__steps"},e._l(e.steps,(function(e){return r("div",{key:"step"+e,staticClass:"c-rangeSlider__step"})})),0):e._e()],2),r("div",{staticClass:"c-rangeSlider__labelTo"},[e._v(" "+e._s(e.label[1])+" ")])])},l=[],o={data(){return{slider:null,sliderTrack:null,sliderBar:null,sliderHandlers:null,sliderInputs:null,timer:null,params:{precentage:[],middlePrecentage:50,inputValue:[],values:[],dragging:[!1,!1]}}},props:{value:{type:Array,default:()=>[0,100]},label:{type:Array,default:()=>["from","to"]},unit:{type:String,default:()=>"PLN"},range:{type:Array,default:()=>[0,100]},step:{type:Number,default:()=>1},showSteps:{type:Boolean,default:()=>!1},lazy:{type:Number,default:()=>500},logarithmic:{type:Boolean,default:()=>!1}},computed:{steps(){return(this.range[1]-this.range[0])/this.step}},methods:{addEventsToHandlers(){this.sliderHandlers.forEach((e,t)=>{e.addEventListener("mousedown",()=>this.params.dragging[t]=!0,!1),this.slider.addEventListener("mouseup",()=>this.params.dragging[t]=!1,!1),this.slider.addEventListener("mousemove",e=>{this.params.dragging[t]&&this.handleDragging(e,t)},!1)});const e=this.slider.querySelector(".c-rangeSlider__wrap");e.addEventListener("click",this.handleClick)},handleDragging(e,t){let r=this.getPrecentageFromTrack(e.clientX);this.params.inputValue=[...this.params.values],this.setHandlePosition(r,this.sliderHandlers[t],t)},handleClick(e){let t=this.getPrecentageFromTrack(e.clientX);this.params.inputValue=[...this.params.values];let r=t>this.params.middlePrecentage?1:0;this.setHandlePosition(t,this.sliderHandlers[r],r)},getPrecentageFromTrack(e){let t=this.sliderTrack.getBoundingClientRect(),r=e-t.left,a=Math.round(100*r/t.width);return a},getPrecentageFromValue(e){let t=Math.round(100*e/this.range[1]);return t},getValue(e){let t=this.logarithmic?Math.round(e*(Math.log(e+1)/Math.log(100))):e;return Math.round(this.range[1]*(t/this.steps))},setHandleByInput(){this.params.inputValue.forEach((e,t)=>{this.setHandlePosition(this.getPrecentageFromValue(e),this.sliderHandlers[t],t)})},setHandlePosition(e,t,r){let a=this.params.precentage[r-1]?this.params.precentage[r-1]:0,n=this.params.precentage[r+1]?this.params.precentage[r+1]:100;e>=0&&e<=100&&e>=a&&e<=n&&(t.style.left=e+"%",this.params.precentage[r]=e,this.params.values[r]=this.getValue(e),this.setBarPosition())},initHandlesPositions(){this.params.precentage=this.value.map(e=>this.getPrecentageFromValue(e)),this.params.precentage.forEach((e,t)=>this.setHandlePosition(e,this.sliderHandlers[t],t)),this.params.values=this.value,this.params.inputValue=[...Object.values(this.params.values)]},setBarPosition(){this.sliderBar.style.left=this.params.precentage[0]+"%",this.sliderBar.style.right=100-this.params.precentage[1]+"%",this.params.middlePrecentage=(this.params.precentage[1]+this.params.precentage[0])/2}},watch:{params:{handler(){this.timer&&(clearTimeout(this.timer),this.timer=null),this.timer=setTimeout(()=>{this.$emit("change",Object.values(this.params.values))},this.lazy)},deep:!0},value:{handler(){this.value[0]==this.params.values[0]&&this.value[1]==this.params.values[1]||this.initHandlesPositions()},deep:!0},range:{handler(){this.initHandlesPositions()},deep:!0}},mounted(){this.slider=this.$refs.rangeSlider,this.sliderTrack=this.slider.querySelector(".c-rangeSlider__track"),this.sliderBar=this.slider.querySelector(".c-rangeSlider__bar"),this.sliderHandlers=this.slider.querySelectorAll(".c-rangeSlider__handle"),this.sliderInputs=this.slider.querySelectorAll(".c-rangeSlider__input"),this.initHandlesPositions(),this.addEventsToHandlers()}},d=o;r("cac4");function u(e,t,r,a,n,i,s,l){var o,d="function"===typeof e?e.options:e;if(t&&(d.render=t,d.staticRenderFns=r,d._compiled=!0),a&&(d.functional=!0),i&&(d._scopeId="data-v-"+i),s?(o=function(e){e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext,e||"undefined"===typeof __VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),n&&n.call(this,e),e&&e._registeredComponents&&e._registeredComponents.add(s)},d._ssrRegister=o):n&&(o=l?function(){n.call(this,(d.functional?this.parent:this).$root.$options.shadowRoot)}:n),o)if(d.functional){d._injectStyles=o;var u=d.render;d.render=function(e,t){return o.call(t),u(e,t)}}else{var c=d.beforeCreate;d.beforeCreate=c?[].concat(c,o):[o]}return{exports:e,options:d}}var c=u(d,s,l,!1,null,null,null),p=c.exports}})}));
+(function(e,t){"object"===typeof exports&&"object"===typeof module?module.exports=t():"function"===typeof define&&define.amd?define([],t):"object"===typeof exports?exports["vRangeSlider"]=t():e["vRangeSlider"]=t()})("undefined"!==typeof self?self:this,(function(){return function(e){var t={};function r(a){if(t[a])return t[a].exports;var n=t[a]={i:a,l:!1,exports:{}};return e[a].call(n.exports,n,n.exports,r),n.l=!0,n.exports}return r.m=e,r.c=t,r.d=function(e,t,a){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:a})},r.r=function(e){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"===typeof e&&e&&e.__esModule)return e;var a=Object.create(null);if(r.r(a),Object.defineProperty(a,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var n in e)r.d(a,n,function(t){return e[t]}.bind(null,n));return a},r.n=function(e){var t=e&&e.__esModule?function(){return e["default"]}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.p="",r(r.s="fe4d")}({c5ab:function(e,t,r){var a,n,i;(function(r,s){n=[],a=s,i="function"===typeof a?a.apply(t,n):a,void 0===i||(e.exports=i)})("undefined"!==typeof self&&self,(function(){function e(){var t=Object.getOwnPropertyDescriptor(document,"currentScript");if(!t&&"currentScript"in document&&document.currentScript)return document.currentScript;if(t&&t.get!==e&&document.currentScript)return document.currentScript;try{throw new Error}catch(h){var r,a,n,i=/.*at [^(]*\((.*):(.+):(.+)\)$/gi,s=/@([^@]*):(\d+):(\d+)\s*$/gi,l=i.exec(h.stack)||s.exec(h.stack),o=l&&l[1]||!1,d=l&&l[2]||!1,u=document.location.href.replace(document.location.hash,""),c=document.getElementsByTagName("script");o===u&&(r=document.documentElement.outerHTML,a=new RegExp("(?:[^\\n]+?\\n){0,"+(d-2)+"}[^<]*<script>([\\d\\D]*?)<\\/script>[\\d\\D]*","i"),n=r.replace(a,"$1").trim());for(var p=0;p<c.length;p++){if("interactive"===c[p].readyState)return c[p];if(c[p].src===o)return c[p];if(o===u&&c[p].innerHTML&&c[p].innerHTML.trim()===n)return c[p]}return null}}return e}))},cac4:function(e,t,r){"use strict";r("e037")},e037:function(e,t,r){},fe4d:function(e,t,r){"use strict";if(r.r(t),r.d(t,"vRangeSlider",(function(){return p})),"undefined"!==typeof window){var a=window.document.currentScript,n=r("c5ab");a=n(),"currentScript"in document||Object.defineProperty(document,"currentScript",{get:n});var i=a&&a.src.match(/(.+\/)[^/]+\.js(\?.*)?$/);i&&(r.p=i[1])}var s=function(){var e=this,t=e.$createElement,r=e._self._c||t;return r("div",{ref:"rangeSlider",staticClass:"c-rangeSlider"},[r("div",{staticClass:"c-rangeSlider__labelFrom"},[e._v(" "+e._s(e.label[0])+" ")]),r("div",{staticClass:"c-rangeSlider__wrap"},[r("div",{staticClass:"c-rangeSlider__track"}),r("div",{staticClass:"c-rangeSlider__bar"}),r("div",{staticClass:"c-rangeSlider__mid",style:{left:e.params.middlePrecentage+"%"}}),e._l(e.value,(function(t,a){return[r("div",{key:"h"+a,staticClass:"c-rangeSlider__handle",attrs:{draggable:"false"}}),r("div",{key:"i"+a,staticClass:"c-rangeSlider__handleInput"},[r("input",{directives:[{name:"model",rawName:"v-model",value:e.params.inputValue[a],expression:"params.inputValue[key]"}],attrs:{type:"number",min:a-1<!0?e.params.values[a-1]:e.range[0],max:a+1<e.params.inputValue.length?e.params.values[a+1]:e.range[1]},domProps:{value:e.params.inputValue[a]},on:{input:[function(t){t.target.composing||e.$set(e.params.inputValue,a,t.target.value)},function(t){return e.setHandleByInput()}]}}),e._v(" "+e._s(e.unit)+" ")])]})),e.showSteps?r("div",{staticClass:"c-rangeSlider__steps"},e._l(e.steps,(function(e){return r("div",{key:"step"+e,staticClass:"c-rangeSlider__step"})})),0):e._e()],2),r("div",{staticClass:"c-rangeSlider__labelTo"},[e._v(" "+e._s(e.label[1])+" ")])])},l=[],o={data(){return{slider:null,sliderTrack:null,sliderBar:null,sliderHandlers:null,sliderInputs:null,timer:null,params:{precentage:[],middlePrecentage:50,inputValue:[],values:[],dragging:[!1,!1]}}},props:{value:{type:Array,default:()=>[0,100]},label:{type:Array,default:()=>["from","to"]},unit:{type:String,default:()=>"PLN"},range:{type:Array,default:()=>[0,100]},step:{type:Number,default:()=>1},showSteps:{type:Boolean,default:()=>!1},lazy:{type:Number,default:()=>500},logarithmic:{type:Boolean,default:()=>!1}},computed:{steps(){return(this.range[1]-this.range[0])/this.step}},methods:{addEventsToHandlers(){this.sliderHandlers.forEach((e,t)=>{e.addEventListener("mousedown",()=>this.params.dragging[t]=!0,!1),this.slider.addEventListener("mouseup",()=>this.params.dragging[t]=!1,!1),this.slider.addEventListener("mousemove",e=>{this.params.dragging[t]&&this.handleDragging(e,t)},!1)});const e=this.slider.querySelector(".c-rangeSlider__wrap");e.addEventListener("click",this.handleClick)},handleDragging(e,t){let r=this.getPrecentageFromTrack(e.clientX);this.params.inputValue=[...this.params.values],this.setHandlePosition(r,this.sliderHandlers[t],t)},handleClick(e){let t=this.getPrecentageFromTrack(e.clientX);this.params.inputValue=[...this.params.values];let r=t>this.params.middlePrecentage?1:0;this.setHandlePosition(t,this.sliderHandlers[r],r)},getPrecentageFromTrack(e){let t=this.sliderTrack.getBoundingClientRect(),r=e-t.left,a=Math.round(100*r/t.width);return a},getPrecentageFromValue(e){let t=Math.round(100*e/this.range[1]);return t},getValue(e){let t=this.logarithmic?Math.round(e*(Math.log(e+1)/Math.log(100))):e;return Math.round(this.range[1]*(t/this.steps))},setHandleByInput(){this.params.inputValue.forEach((e,t)=>{this.setHandlePosition(this.getPrecentageFromValue(e),this.sliderHandlers[t],t)})},setHandlePosition(e,t,r){let a=this.params.precentage[r-1]?this.params.precentage[r-1]:0,n=this.params.precentage[r+1]?this.params.precentage[r+1]:100;e>=0&&e<=100&&e>=a&&e<=n&&(t.style.left=e+"%",this.params.precentage[r]=e,this.params.values[r]=this.getValue(e),this.setBarPosition())},initHandlesPositions(){this.params.precentage=this.value.map(e=>this.getPrecentageFromValue(e)),this.params.precentage.forEach((e,t)=>this.setHandlePosition(e,this.sliderHandlers[t],t)),this.params.values=this.value,this.params.inputValue=[...Object.values(this.params.values)]},setBarPosition(){this.sliderBar.style.left=this.params.precentage[0]+"%",this.sliderBar.style.right=100-this.params.precentage[1]+"%",this.params.middlePrecentage=(this.params.precentage[1]+this.params.precentage[0])/2}},watch:{params:{handler(){this.timer&&(clearTimeout(this.timer),this.timer=null),this.timer=setTimeout(()=>{this.$emit("change",Object.values(this.params.values))},this.lazy)},deep:!0},value:{handler(){this.value[0]==this.params.values[0]&&this.value[1]==this.params.values[1]||this.initHandlesPositions()},deep:!0},range:{handler(){this.initHandlesPositions()},deep:!0}},mounted(){this.slider=this.$refs.rangeSlider,this.sliderTrack=this.slider.querySelector(".c-rangeSlider__track"),this.sliderBar=this.slider.querySelector(".c-rangeSlider__bar"),this.sliderHandlers=this.slider.querySelectorAll(".c-rangeSlider__handle"),this.sliderInputs=this.slider.querySelectorAll(".c-rangeSlider__input"),this.initHandlesPositions(),this.addEventsToHandlers()}},d=o;r("cac4");function u(e,t,r,a,n,i,s,l){var o,d="function"===typeof e?e.options:e;if(t&&(d.render=t,d.staticRenderFns=r,d._compiled=!0),a&&(d.functional=!0),i&&(d._scopeId="data-v-"+i),s?(o=function(e){e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext,e||"undefined"===typeof __VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),n&&n.call(this,e),e&&e._registeredComponents&&e._registeredComponents.add(s)},d._ssrRegister=o):n&&(o=l?function(){n.call(this,(d.functional?this.parent:this).$root.$options.shadowRoot)}:n),o)if(d.functional){d._injectStyles=o;var u=d.render;d.render=function(e,t){return o.call(t),u(e,t)}}else{var c=d.beforeCreate;d.beforeCreate=c?[].concat(c,o):[o]}return{exports:e,options:d}}var c=u(d,s,l,!1,null,null,null),p=c.exports}})}));
 //# sourceMappingURL=vRangeSlider.umd.min.js.map

package.json

 {
   "name": "v-range-component",
-  "version": "1.0.4",
+  "version": "1.0.5",
   "description": "Vue Range Slider component",
@@ -5,0 +5,0 @@ "keywords": [

No alert changes

Improved metrics

Total package byte prevSize

152564

No dependency changes