vue-scroll-picker - npm Package Compare versions

Comparing version 0.0.5 to 0.1.0

dist/index.js

@@ -1,1 +0,1 @@
-!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.VueScrollPicker=t():e.VueScrollPicker=t()}(this,function(){return function(e){function t(r){if(i[r])return i[r].exports;var o=i[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,t),o.l=!0,o.exports}var i={};return t.m=e,t.c=i,t.i=function(e){return e},t.d=function(e,i,r){t.o(e,i)||Object.defineProperty(e,i,{configurable:!1,enumerable:!0,get:r})},t.n=function(e){var i=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(i,"a",i),i},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=6)}([function(e,t){e.exports=function(){var e=[];return e.toString=function(){for(var e=[],t=0;t<this.length;t++){var i=this[t];i[2]?e.push("@media "+i[2]+"{"+i[1]+"}"):e.push(i[1])}return e.join("")},e.i=function(t,i){"string"==typeof t&&(t=[[null,t,""]]);for(var r={},o=0;o<this.length;o++){var n=this[o][0];"number"==typeof n&&(r[n]=!0)}for(o=0;o<t.length;o++){var s=t[o];"number"==typeof s[0]&&r[s[0]]||(i&&!s[2]?s[2]=i:i&&(s[2]="("+s[2]+") and ("+i+")"),e.push(s))}},e}},function(e,t){e.exports=function(e,t,i,r,o){var n,s=e=e||{},l=typeof e.default;"object"!==l&&"function"!==l||(n=e,s=e.default);var a="function"==typeof s?s.options:s;t&&(a.render=t.render,a.staticRenderFns=t.staticRenderFns),r&&(a._scopeId=r);var c;if(o?(c=function(e){(e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),i&&i.call(this,e),e&&e._registeredComponents&&e._registeredComponents.add(o)},a._ssrRegister=c):i&&(c=i),c){var u=a.functional,h=u?a.render:a.beforeCreate;u?a.render=function(e,t){return c.call(t),h(e,t)}:a.beforeCreate=h?[].concat(h,c):[c]}return{esModule:n,exports:s,options:a}}},function(e,t,i){function r(e){for(var t=0;t<e.length;t++){var i=e[t],r=u[i.id];if(r){r.refs++;for(s=0;s<r.parts.length;s++)r.parts[s](i.parts[s]);for(;s<i.parts.length;s++)r.parts.push(n(i.parts[s]));r.parts.length>i.parts.length&&(r.parts.length=i.parts.length)}else{for(var o=[],s=0;s<i.parts.length;s++)o.push(n(i.parts[s]));u[i.id]={id:i.id,refs:1,parts:o}}}}function o(){var e=document.createElement("style");return e.type="text/css",h.appendChild(e),e}function n(e){var t,i,r=document.querySelector('style[data-vue-ssr-id~="'+e.id+'"]');if(r){if(f)return v;r.parentNode.removeChild(r)}if(g){var n=p++;r=d||(d=o()),t=s.bind(null,r,n,!1),i=s.bind(null,r,n,!0)}else r=o(),t=l.bind(null,r),i=function(){r.parentNode.removeChild(r)};return t(e),function(r){if(r){if(r.css===e.css&&r.media===e.media&&r.sourceMap===e.sourceMap)return;t(e=r)}else i()}}function s(e,t,i,r){var o=i?"":r.css;if(e.styleSheet)e.styleSheet.cssText=m(t,o);else{var n=document.createTextNode(o),s=e.childNodes;s[t]&&e.removeChild(s[t]),s.length?e.insertBefore(n,s[t]):e.appendChild(n)}}function l(e,t){var i=t.css,r=t.media,o=t.sourceMap;if(r&&e.setAttribute("media",r),o&&(i+="\n/*# sourceURL="+o.sources[0]+" */",i+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(o))))+" */"),e.styleSheet)e.styleSheet.cssText=i;else{for(;e.firstChild;)e.removeChild(e.firstChild);e.appendChild(document.createTextNode(i))}}var a="undefined"!=typeof document;if("undefined"!=typeof DEBUG&&DEBUG&&!a)throw new Error("vue-style-loader cannot be used in a non-browser environment. Use { target: 'node' } in your Webpack config to indicate a server-rendering environment.");var c=i(13),u={},h=a&&(document.head||document.getElementsByTagName("head")[0]),d=null,p=0,f=!1,v=function(){},g="undefined"!=typeof navigator&&/msie [6-9]\b/.test(navigator.userAgent.toLowerCase());e.exports=function(e,t,i){f=i;var o=c(e,t);return r(o),function(t){for(var i=[],n=0;n<o.length;n++){var s=o[n];(l=u[s.id]).refs--,i.push(l)}t?r(o=c(e,t)):o=[];for(n=0;n<i.length;n++){var l=i[n];if(0===l.refs){for(var a=0;a<l.parts.length;a++)l.parts[a]();delete u[l.id]}}}};var m=function(){var e=[];return function(t,i){return e[t]=i,e.filter(Boolean).join("\n")}}()},function(e,t,i){"use strict";var r=i(10),o=i(1)(null,r.a,function(e){i(12)},null,null);t.a=o.exports},function(e,t,i){"use strict";var r=i(5),o=i(9),n=i(1)(r.a,o.a,function(e){i(11)},null,null);t.a=n.exports},function(e,t,i){"use strict";const r="undefined"!=typeof window&&"ontouchstart"in window;t.a={props:{value:null,options:{type:Array,default:()=>[]},placeholder:String},data(){var e=this.placeholder?-1:0;return this.value&&this.options.forEach(function(t,i){t!=this.value&&t.value!=this.value||(e=i)}.bind(this)),{top:0,pivots:null,lastIndex:e,transitioning:!1,transitionTO:null,startTop:null,isMouseDown:!1,isDragging:!1,isScrolling:!1,startY:null,scrollMax:null}},mounted(){r?(this.$el.addEventListener("touchstart",this.handleStart),this.$el.addEventListener("touchmove",this.handleMove),this.$el.addEventListener("touchend",this.handleEnd),this.$el.addEventListener("touchcancel",this.handleCancel)):(this.$el.addEventListener("mousewheel",this.handleWheel),this.$el.addEventListener("mousedown",this.handleStart),this.$el.addEventListener("mousemove",this.handleMove),this.$el.addEventListener("mouseup",this.handleEnd),this.$el.addEventListener("mouseleave",this.handleCancel));var e=this.$refs.selection.getBoundingClientRect(),t=(e.top+e.bottom)/2;this.pivots=this.$refs.items.map(e=>{var i=e.getBoundingClientRect();return Math.round(10*((i.top+i.bottom)/2-t))/10}),this.scrollMax=-1*this.pivots[this.pivots.length-1],this.lastIndex>0&&(this.top=-1*this.pivots[this.lastIndex]),!this.value&&this.sanitizedOptions[this.lastIndex]&&this.$emit("input",this.sanitizedOptions[this.lastIndex].value)},destroyed(){r?(this.$el.removeEventListener("touchstart",this.handleStart),this.$el.removeEventListener("touchmove",this.handleMove),this.$el.removeEventListener("touchend",this.handleEnd),this.$el.removeEventListener("touchcancel",this.handleCancel)):(this.$el.removeEventListener("mousewheel",this.handleWheel),this.$el.removeEventListener("mousedown",this.handleStart),this.$el.removeEventListener("mousemove",this.handleMove),this.$el.removeEventListener("mouseup",this.handleEnd),this.$el.removeEventListener("mouseleave",this.handleCancel))},computed:{sanitizedOptions(){return this.options.map(e=>e.hasOwnProperty("value")&&e.hasOwnProperty("name")?e:{value:e,name:e})}},watch:{value(e,t){var i=-1;this.sanitizedOptions.forEach(function(t,r){t.value==e&&(i=r)}),this.lastIndex!==i&&this.correction(i)}},methods:{handleWheel(e){this.top>=0&&e.deltaY<0||this.top<=this.scrollMax&&e.deltaY>0||(e.preventDefault(),e.stopPropagation(),this.isScrolling||(this.isScrolling=!0,e.deltaY<0?this.correction(this.lastIndex-Math.floor(Math.abs(e.deltaY)/30+1)):e.deltaY>0&&this.correction(this.lastIndex+Math.floor(Math.abs(e.deltaY)/30+1)),setTimeout(function(){this.isScrolling=!1}.bind(this),80)))},getTouchInfo:e=>r?e.changedTouches[0]||e.touches[0]:e,handleStart(e){e.cancelable&&(e.preventDefault(),e.stopPropagation());const t=this.getTouchInfo(e);this.startTop=this.top,this.startY=t.pageY,r||(this.isMouseDown=!0)},handleMove(e){if(e.preventDefault(),e.stopPropagation(),r||this.isMouseDown){this.isDragging=!0;const t=this.getTouchInfo(e);this.top=this.startTop+t.pageY-this.startY}},handleEnd(e){if(e.preventDefault(),e.stopPropagation(),!this.isDragging)return this.isDragging=!1,this.isMouseDown=!1,void this.handleClick(e);this.isDragging=!1,this.isMouseDown=!1,this.correctionAfterDragging()},handleCancel(e){e.preventDefault(),e.stopPropagation(),(r||this.isMouseDown)&&(this.correctionAfterDragging(),this.isMouseDown=!1,this.isDragging=!1)},handleClick(e){var t=e.x,i=e.y,r=this.$refs.top.getBoundingClientRect(),o=this.$refs.bottom.getBoundingClientRect();r.left<=t&&t<=r.right&&r.top<=i&&i<=r.bottom?this.correction(this.lastIndex-1):o.left<=t&&t<=o.right&&o.top<=i&&i<=o.bottom&&this.correction(this.lastIndex+1)},correctionAfterDragging(){var e=null,t=null,i=this.top;this.placeholder&&(e=-1,t=0+i),this.pivots.forEach((r,o)=>{var n=r+i;(null===t||Math.abs(t)>Math.abs(n))&&(e=o,t=n)}),this.correction(e)},correction(e){if(e=Math.min(Math.max(e,this.placeholder?-1:0),this.pivots.length-1),this.lastIndex!==e){this.lastIndex=e;var t=null;e>-1&&(t=this.sanitizedOptions[e].value),this.$emit("input",t)}var i=0;e>-1&&(i=-1*this.pivots[e]),this.top=i,this.transitioning=!0,this.transitionTO&&(clearTimeout(this.transitionTO),this.transitionTO=null),this.transitionTO=setTimeout(function(){this.transitioning=!1,this.transitionTO=null}.bind(this),100)}}}},function(e,t,i){"use strict";function r(e){e.component("ScrollPicker",o.a),e.component("ScrollPickerGroup",n.a)}Object.defineProperty(t,"__esModule",{value:!0}),t.install=r;var o=i(4),n=i(3);i.d(t,"ScrollPicker",function(){return o.a}),i.d(t,"ScrollPickerGroup",function(){return n.a}),"undefined"!=typeof window&&window.Vue&&r(window.Vue),t.default={install:r}},function(e,t,i){(e.exports=i(0)()).push([e.i,".vue-scroll-picker{position:relative;width:100%;height:10em;overflow:hidden}.vue-scroll-picker-list{position:absolute;left:0;right:0;top:0;bottom:0}.vue-scroll-picker-list-rotator{position:absolute;left:0;right:0;top:0;padding-top:4.4em}.vue-scroll-picker-list-rotator.transition{transition:top .2s ease}.vue-scroll-picker-item,.vue-scroll-picker-item-placeholder{text-align:center;height:1.2em;line-height:1.2em}.vue-scroll-picker-item-placeholder{color:#aaa}.vue-scroll-picker-layer{position:absolute;left:0;right:0;top:0;bottom:0}.vue-scroll-picker-layer .bottom,.vue-scroll-picker-layer .middle,.vue-scroll-picker-layer .top{position:absolute}.vue-scroll-picker-layer .top{box-sizing:border-box;border-bottom:1px solid #c8c7cc;background:linear-gradient(180deg,#fff 10%,hsla(0,0%,100%,.7));top:0;left:0;right:0;height:40%}.vue-scroll-picker-layer .middle{top:40%;left:0;right:0;bottom:40%}.vue-scroll-picker-layer .bottom{border-top:1px solid #c8c7cc;background:linear-gradient(0deg,#fff 10%,hsla(0,0%,100%,.7));bottom:0;left:0;right:0;height:40%}",""])},function(e,t,i){(e.exports=i(0)()).push([e.i,'.vue-scroll-picker-group.flex{display:flex}.vue-scroll-picker-group:after{clear:both;display:table;content:""}.vue-scroll-picker-group>.vue-scroll-picker-1{float:left;width:8.33333%}.vue-scroll-picker-group>.vue-scroll-picker-2{float:left;width:16.66667%}.vue-scroll-picker-group>.vue-scroll-picker-3{float:left;width:25%}.vue-scroll-picker-group>.vue-scroll-picker-4{float:left;width:33.33333%}.vue-scroll-picker-group>.vue-scroll-picker-5{float:left;width:41.66667%}.vue-scroll-picker-group>.vue-scroll-picker-6{float:left;width:50%}.vue-scroll-picker-group>.vue-scroll-picker-7{float:left;width:58.33333%}.vue-scroll-picker-group>.vue-scroll-picker-8{float:left;width:66.66667%}.vue-scroll-picker-group>.vue-scroll-picker-9{float:left;width:75%}.vue-scroll-picker-group>.vue-scroll-picker-10{float:left;width:83.33333%}.vue-scroll-picker-group>.vue-scroll-picker-11{float:left;width:91.66667%}.vue-scroll-picker-group>.vue-scroll-picker-12{float:left;width:100%}',""])},function(e,t,i){"use strict";var r={render:function(){var e=this,t=e.$createElement,i=e._self._c||t;return i("div",{staticClass:"vue-scroll-picker"},[i("div",{staticClass:"vue-scroll-picker-list"},[i("div",{staticClass:"vue-scroll-picker-list-rotator",class:{transition:e.transitioning},style:{top:e.top+"px"}},[e.placeholder?i("div",{ref:"placeholder",staticClass:"vue-scroll-picker-item-placeholder"},[e._v(e._s(e.placeholder))]):e._e(),e._v(" "),e._l(e.sanitizedOptions,function(t,r){return i("div",{key:t.value,ref:"items",refInFor:!0,staticClass:"vue-scroll-picker-item"},[e._v(e._s(t.name))])})],2)]),e._v(" "),i("div",{staticClass:"vue-scroll-picker-layer"},[i("div",{ref:"top",staticClass:"top"}),e._v(" "),i("div",{ref:"selection",staticClass:"middle"}),e._v(" "),i("div",{ref:"bottom",staticClass:"bottom"})])])},staticRenderFns:[]};t.a=r},function(e,t,i){"use strict";var r={render:function(){var e=this,t=e.$createElement;return(e._self._c||t)("div",{staticClass:"vue-scroll-picker-group"},[e._t("default")],2)},staticRenderFns:[]};t.a=r},function(e,t,i){var r=i(7);"string"==typeof r&&(r=[[e.i,r,""]]),r.locals&&(e.exports=r.locals);i(2)("08d1ef24",r,!0)},function(e,t,i){var r=i(8);"string"==typeof r&&(r=[[e.i,r,""]]),r.locals&&(e.exports=r.locals);i(2)("1b122190",r,!0)},function(e,t){e.exports=function(e,t){for(var i=[],r={},o=0;o<t.length;o++){var n=t[o],s=n[0],l={id:e+":"+o,css:n[1],media:n[2],sourceMap:n[3]};r[s]?r[s].parts.push(l):i.push(r[s]={id:s,parts:[l]})}return i}}])});
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.VueScrollPicker=t():e.VueScrollPicker=t()}(this,function(){return function(e){function t(r){if(i[r])return i[r].exports;var o=i[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,t),o.l=!0,o.exports}var i={};return t.m=e,t.c=i,t.i=function(e){return e},t.d=function(e,i,r){t.o(e,i)||Object.defineProperty(e,i,{configurable:!1,enumerable:!0,get:r})},t.n=function(e){var i=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(i,"a",i),i},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=6)}([function(e,t){e.exports=function(){var e=[];return e.toString=function(){for(var e=[],t=0;t<this.length;t++){var i=this[t];i[2]?e.push("@media "+i[2]+"{"+i[1]+"}"):e.push(i[1])}return e.join("")},e.i=function(t,i){"string"==typeof t&&(t=[[null,t,""]]);for(var r={},o=0;o<this.length;o++){var n=this[o][0];"number"==typeof n&&(r[n]=!0)}for(o=0;o<t.length;o++){var s=t[o];"number"==typeof s[0]&&r[s[0]]||(i&&!s[2]?s[2]=i:i&&(s[2]="("+s[2]+") and ("+i+")"),e.push(s))}},e}},function(e,t){e.exports=function(e,t,i,r,o){var n,s=e=e||{},l=typeof e.default;"object"!==l&&"function"!==l||(n=e,s=e.default);var a="function"==typeof s?s.options:s;t&&(a.render=t.render,a.staticRenderFns=t.staticRenderFns),r&&(a._scopeId=r);var c;if(o?(c=function(e){(e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),i&&i.call(this,e),e&&e._registeredComponents&&e._registeredComponents.add(o)},a._ssrRegister=c):i&&(c=i),c){var u=a.functional,h=u?a.render:a.beforeCreate;u?a.render=function(e,t){return c.call(t),h(e,t)}:a.beforeCreate=h?[].concat(h,c):[c]}return{esModule:n,exports:s,options:a}}},function(e,t,i){function r(e){for(var t=0;t<e.length;t++){var i=e[t],r=u[i.id];if(r){r.refs++;for(s=0;s<r.parts.length;s++)r.parts[s](i.parts[s]);for(;s<i.parts.length;s++)r.parts.push(n(i.parts[s]));r.parts.length>i.parts.length&&(r.parts.length=i.parts.length)}else{for(var o=[],s=0;s<i.parts.length;s++)o.push(n(i.parts[s]));u[i.id]={id:i.id,refs:1,parts:o}}}}function o(){var e=document.createElement("style");return e.type="text/css",h.appendChild(e),e}function n(e){var t,i,r=document.querySelector('style[data-vue-ssr-id~="'+e.id+'"]');if(r){if(f)return v;r.parentNode.removeChild(r)}if(g){var n=p++;r=d||(d=o()),t=s.bind(null,r,n,!1),i=s.bind(null,r,n,!0)}else r=o(),t=l.bind(null,r),i=function(){r.parentNode.removeChild(r)};return t(e),function(r){if(r){if(r.css===e.css&&r.media===e.media&&r.sourceMap===e.sourceMap)return;t(e=r)}else i()}}function s(e,t,i,r){var o=i?"":r.css;if(e.styleSheet)e.styleSheet.cssText=m(t,o);else{var n=document.createTextNode(o),s=e.childNodes;s[t]&&e.removeChild(s[t]),s.length?e.insertBefore(n,s[t]):e.appendChild(n)}}function l(e,t){var i=t.css,r=t.media,o=t.sourceMap;if(r&&e.setAttribute("media",r),o&&(i+="\n/*# sourceURL="+o.sources[0]+" */",i+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(o))))+" */"),e.styleSheet)e.styleSheet.cssText=i;else{for(;e.firstChild;)e.removeChild(e.firstChild);e.appendChild(document.createTextNode(i))}}var a="undefined"!=typeof document;if("undefined"!=typeof DEBUG&&DEBUG&&!a)throw new Error("vue-style-loader cannot be used in a non-browser environment. Use { target: 'node' } in your Webpack config to indicate a server-rendering environment.");var c=i(13),u={},h=a&&(document.head||document.getElementsByTagName("head")[0]),d=null,p=0,f=!1,v=function(){},g="undefined"!=typeof navigator&&/msie [6-9]\b/.test(navigator.userAgent.toLowerCase());e.exports=function(e,t,i){f=i;var o=c(e,t);return r(o),function(t){for(var i=[],n=0;n<o.length;n++){var s=o[n];(l=u[s.id]).refs--,i.push(l)}t?r(o=c(e,t)):o=[];for(n=0;n<i.length;n++){var l=i[n];if(0===l.refs){for(var a=0;a<l.parts.length;a++)l.parts[a]();delete u[l.id]}}}};var m=function(){var e=[];return function(t,i){return e[t]=i,e.filter(Boolean).join("\n")}}()},function(e,t,i){"use strict";var r=i(10),o=i(1)(null,r.a,function(e){i(12)},null,null);t.a=o.exports},function(e,t,i){"use strict";var r=i(5),o=i(9),n=i(1)(r.a,o.a,function(e){i(11)},null,null);t.a=n.exports},function(e,t,i){"use strict";const r="undefined"!=typeof window&&"ontouchstart"in window;t.a={props:{value:null,options:{type:Array,default:()=>[]},placeholder:String},data(){var e=this.placeholder?-1:0;return this.value&&this.options.forEach(function(t,i){t!=this.value&&t.value!=this.value||(e=i)}.bind(this)),{top:0,pivots:null,lastIndex:e,transitioning:!1,transitionTO:null,startTop:null,isMouseDown:!1,isDragging:!1,isScrolling:!1,startY:null,scrollMax:null}},mounted(){r?(this.$el.addEventListener("touchstart",this.handleStart),this.$el.addEventListener("touchmove",this.handleMove),this.$el.addEventListener("touchend",this.handleEnd),this.$el.addEventListener("touchcancel",this.handleCancel)):(this.$el.addEventListener("mousewheel",this.handleWheel),this.$el.addEventListener("mousedown",this.handleStart),this.$el.addEventListener("mousemove",this.handleMove),this.$el.addEventListener("mouseup",this.handleEnd),this.$el.addEventListener("mouseleave",this.handleCancel));var e=this.$refs.selection.getBoundingClientRect(),t=(e.top+e.bottom)/2;this.pivots=this.$refs.items.map(e=>{var i=e.getBoundingClientRect();return Math.round(10*((i.top+i.bottom)/2-t))/10}),this.scrollMax=-1*this.pivots[this.pivots.length-1],this.lastIndex>0&&(this.top=-1*this.pivots[this.lastIndex]),!this.value&&this.sanitizedOptions[this.lastIndex]&&this.$emit("input",this.sanitizedOptions[this.lastIndex].value)},destroyed(){r?(this.$el.removeEventListener("touchstart",this.handleStart),this.$el.removeEventListener("touchmove",this.handleMove),this.$el.removeEventListener("touchend",this.handleEnd),this.$el.removeEventListener("touchcancel",this.handleCancel)):(this.$el.removeEventListener("mousewheel",this.handleWheel),this.$el.removeEventListener("mousedown",this.handleStart),this.$el.removeEventListener("mousemove",this.handleMove),this.$el.removeEventListener("mouseup",this.handleEnd),this.$el.removeEventListener("mouseleave",this.handleCancel))},computed:{sanitizedOptions(){return this.options.map(e=>e.hasOwnProperty("value")&&e.hasOwnProperty("name")?e:{value:e,name:e})}},watch:{value(e,t){var i=-1;this.sanitizedOptions.forEach(function(t,r){t.value==e&&(i=r)}),this.lastIndex!==i&&this.correction(i)}},methods:{handleWheel(e){this.top>=0&&e.deltaY<0||this.top<=this.scrollMax&&e.deltaY>0||(e.preventDefault(),e.stopPropagation(),this.isScrolling||(this.isScrolling=!0,e.deltaY<0?this.correction(this.lastIndex-Math.floor(Math.abs(e.deltaY)/30+1)):e.deltaY>0&&this.correction(this.lastIndex+Math.floor(Math.abs(e.deltaY)/30+1)),setTimeout(function(){this.isScrolling=!1}.bind(this),80)))},getTouchInfo:e=>r?e.changedTouches[0]||e.touches[0]:e,handleStart(e){e.cancelable&&(e.preventDefault(),e.stopPropagation());const t=this.getTouchInfo(e);this.startTop=this.top,this.startY=t.pageY,r||(this.isMouseDown=!0)},handleMove(e){if(e.preventDefault(),e.stopPropagation(),r||this.isMouseDown){this.isDragging=!0;const t=this.getTouchInfo(e);this.top=this.startTop+t.pageY-this.startY}},handleEnd(e){if(e.preventDefault(),e.stopPropagation(),!this.isDragging)return this.isDragging=!1,this.isMouseDown=!1,void this.handleClick(e);this.isDragging=!1,this.isMouseDown=!1,this.correctionAfterDragging()},handleCancel(e){e.preventDefault(),e.stopPropagation(),(r||this.isMouseDown)&&(this.correctionAfterDragging(),this.isMouseDown=!1,this.isDragging=!1)},handleClick(e){var t=e.x,i=e.y,r=this.$refs.top.getBoundingClientRect(),o=this.$refs.bottom.getBoundingClientRect();r.left<=t&&t<=r.right&&r.top<=i&&i<=r.bottom?this.correction(this.lastIndex-1):o.left<=t&&t<=o.right&&o.top<=i&&i<=o.bottom&&this.correction(this.lastIndex+1)},correctionAfterDragging(){var e=null,t=null,i=this.top;this.placeholder&&(e=-1,t=0+i),this.pivots.forEach((r,o)=>{var n=r+i;(null===t||Math.abs(t)>Math.abs(n))&&(e=o,t=n)}),this.correction(e)},correction(e){if(e=Math.min(Math.max(e,this.placeholder?-1:0),this.pivots.length-1),this.lastIndex!==e){this.lastIndex=e;var t=null;e>-1&&(t=this.sanitizedOptions[e].value),this.$emit("input",t)}var i=0;e>-1&&(i=-1*this.pivots[e]),this.top=i,this.transitioning=!0,this.transitionTO&&(clearTimeout(this.transitionTO),this.transitionTO=null),this.transitionTO=setTimeout(function(){this.transitioning=!1,this.transitionTO=null}.bind(this),100)}}}},function(e,t,i){"use strict";function r(e){e.component("ScrollPicker",o.a),e.component("ScrollPickerGroup",n.a)}Object.defineProperty(t,"__esModule",{value:!0}),t.install=r;var o=i(4),n=i(3);i.d(t,"ScrollPicker",function(){return o.a}),i.d(t,"ScrollPickerGroup",function(){return n.a}),"undefined"!=typeof window&&window.Vue&&r(window.Vue),t.default={install:r}},function(e,t,i){(e.exports=i(0)()).push([e.i,".vue-scroll-picker{position:relative;width:100%;height:10em;overflow:hidden}.vue-scroll-picker-list{position:absolute;left:0;right:0;top:0;bottom:0}.vue-scroll-picker-list-rotator{position:absolute;left:0;right:0;top:0;padding-top:4.4em}.vue-scroll-picker-list-rotator.-transition{transition:top .2s ease}.vue-scroll-picker-item{text-align:center;height:1.2em;line-height:1.2em}.vue-scroll-picker-item.-placeholder{color:#aaa}.vue-scroll-picker-layer{position:absolute;left:0;right:0;top:0;bottom:0}.vue-scroll-picker-layer .bottom,.vue-scroll-picker-layer .middle,.vue-scroll-picker-layer .top{position:absolute}.vue-scroll-picker-layer .top{box-sizing:border-box;border-bottom:1px solid #c8c7cc;background:linear-gradient(180deg,#fff 10%,hsla(0,0%,100%,.7));top:0;left:0;right:0;height:40%}.vue-scroll-picker-layer .middle{top:40%;left:0;right:0;bottom:40%}.vue-scroll-picker-layer .bottom{border-top:1px solid #c8c7cc;background:linear-gradient(0deg,#fff 10%,hsla(0,0%,100%,.7));bottom:0;left:0;right:0;height:40%}",""])},function(e,t,i){(e.exports=i(0)()).push([e.i,'.vue-scroll-picker-group.flex{display:flex}.vue-scroll-picker-group:after{clear:both;display:table;content:""}.vue-scroll-picker-group>.vue-scroll-picker-1{float:left;width:8.33333%}.vue-scroll-picker-group>.vue-scroll-picker-2{float:left;width:16.66667%}.vue-scroll-picker-group>.vue-scroll-picker-3{float:left;width:25%}.vue-scroll-picker-group>.vue-scroll-picker-4{float:left;width:33.33333%}.vue-scroll-picker-group>.vue-scroll-picker-5{float:left;width:41.66667%}.vue-scroll-picker-group>.vue-scroll-picker-6{float:left;width:50%}.vue-scroll-picker-group>.vue-scroll-picker-7{float:left;width:58.33333%}.vue-scroll-picker-group>.vue-scroll-picker-8{float:left;width:66.66667%}.vue-scroll-picker-group>.vue-scroll-picker-9{float:left;width:75%}.vue-scroll-picker-group>.vue-scroll-picker-10{float:left;width:83.33333%}.vue-scroll-picker-group>.vue-scroll-picker-11{float:left;width:91.66667%}.vue-scroll-picker-group>.vue-scroll-picker-12{float:left;width:100%}',""])},function(e,t,i){"use strict";var r={render:function(){var e=this,t=e.$createElement,i=e._self._c||t;return i("div",{staticClass:"vue-scroll-picker"},[i("div",{staticClass:"vue-scroll-picker-list"},[i("div",{staticClass:"vue-scroll-picker-list-rotator",class:{"-transition":e.transitioning},style:{top:e.top+"px"}},[e.placeholder?i("div",{ref:"placeholder",staticClass:"vue-scroll-picker-item -placeholder",class:{"-selected":-1==e.lastIndex}},[e._v(e._s(e.placeholder))]):e._e(),e._v(" "),e._l(e.sanitizedOptions,function(t,r){return i("div",{key:t.value,ref:"items",refInFor:!0,staticClass:"vue-scroll-picker-item",class:{"-selected":e.lastIndex==r}},[e._v(e._s(t.name))])})],2)]),e._v(" "),i("div",{staticClass:"vue-scroll-picker-layer"},[i("div",{ref:"top",staticClass:"top"}),e._v(" "),i("div",{ref:"selection",staticClass:"middle"}),e._v(" "),i("div",{ref:"bottom",staticClass:"bottom"})])])},staticRenderFns:[]};t.a=r},function(e,t,i){"use strict";var r={render:function(){var e=this,t=e.$createElement;return(e._self._c||t)("div",{staticClass:"vue-scroll-picker-group"},[e._t("default")],2)},staticRenderFns:[]};t.a=r},function(e,t,i){var r=i(7);"string"==typeof r&&(r=[[e.i,r,""]]),r.locals&&(e.exports=r.locals);i(2)("08d1ef24",r,!0)},function(e,t,i){var r=i(8);"string"==typeof r&&(r=[[e.i,r,""]]),r.locals&&(e.exports=r.locals);i(2)("1b122190",r,!0)},function(e,t){e.exports=function(e,t){for(var i=[],r={},o=0;o<t.length;o++){var n=t[o],s=n[0],l={id:e+":"+o,css:n[1],media:n[2],sourceMap:n[3]};r[s]?r[s].parts.push(l):i.push(r[s]={id:s,parts:[l]})}return i}}])});

example/index.js

@@ -1,1 +0,1 @@
-!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("Vue"),require("VueScrollPicker")):"function"==typeof define&&define.amd?define(["Vue","VueScrollPicker"],t):"object"==typeof exports?exports.VueScrollPicker=t(require("Vue"),require("VueScrollPicker")):e.VueScrollPicker=t(e.Vue,e.VueScrollPicker)}(this,function(e,t){return function(e){function t(i){if(n[i])return n[i].exports;var a=n[i]={i:i,l:!1,exports:{}};return e[i].call(a.exports,a,a.exports,t),a.l=!0,a.exports}var n={};return t.m=e,t.c=n,t.i=function(e){return e},t.d=function(e,n,i){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:i})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=3)}([function(e,t,n){"use strict";var i=n(4),a=n(8),r=n(7)(i.a,a.a,function(e){n(9)},null,null);t.a=r.exports},function(t,n){t.exports=e},function(e,n){e.exports=t},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var i=n(1),a=n.n(i),r=n(0),s=n(2),o=n.n(s);a.a.use(o.a),new a.a({el:"#app",render:e=>e(r.a)})},function(e,t,n){"use strict";t.a={data:()=>({stringOptions:"Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.".split(" "),options:[{value:0,name:"0KG"},{value:10,name:"10KG"},{value:20,name:"20KG"},{value:30,name:"30KG"},{value:40,name:"40KG"},{value:50,name:"50KG"},{value:60,name:"60KG"},{value:70,name:"70KG"},{value:80,name:"80KG"},{value:90,name:"90KG"},{value:100,name:"100KG"}],dataBindingTest1:null,dataBindingTest2:20,dataBindingTest3:null,dataBindingTest4:20}),methods:{change(e){}}}},function(e,t,n){(e.exports=n(6)()).push([e.i,"body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:16px;line-height:1.5}a{display:inline-block;background:#ccc;color:#fff;padding:10px 10px 7px;cursor:pointer;margin:3px}a.active{background:#333}",""])},function(e,t){e.exports=function(){var e=[];return e.toString=function(){for(var e=[],t=0;t<this.length;t++){var n=this[t];n[2]?e.push("@media "+n[2]+"{"+n[1]+"}"):e.push(n[1])}return e.join("")},e.i=function(t,n){"string"==typeof t&&(t=[[null,t,""]]);for(var i={},a=0;a<this.length;a++){var r=this[a][0];"number"==typeof r&&(i[r]=!0)}for(a=0;a<t.length;a++){var s=t[a];"number"==typeof s[0]&&i[s[0]]||(n&&!s[2]?s[2]=n:n&&(s[2]="("+s[2]+") and ("+n+")"),e.push(s))}},e}},function(e,t){e.exports=function(e,t,n,i,a){var r,s=e=e||{},o=typeof e.default;"object"!==o&&"function"!==o||(r=e,s=e.default);var l="function"==typeof s?s.options:s;t&&(l.render=t.render,l.staticRenderFns=t.staticRenderFns),i&&(l._scopeId=i);var c;if(a?(c=function(e){(e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),n&&n.call(this,e),e&&e._registeredComponents&&e._registeredComponents.add(a)},l._ssrRegister=c):n&&(c=n),c){var u=l.functional,d=u?l.render:l.beforeCreate;u?l.render=function(e,t){return c.call(t),d(e,t)}:l.beforeCreate=d?[].concat(d,c):[c]}return{esModule:r,exports:s,options:l}}},function(e,t,n){"use strict";var i={render:function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",[n("h2",[e._v("Support All Font Size")]),e._v(" "),n("div",[n("h3",[e._v("Font Size 24px")]),e._v(" "),n("div",{staticStyle:{"font-size":"24px"}},[n("scroll-picker-group",{staticClass:"flex"},[n("scroll-picker",{attrs:{options:e.stringOptions},on:{input:e.change}}),e._v(" "),n("scroll-picker",{attrs:{options:e.stringOptions},on:{input:e.change}}),e._v(" "),n("scroll-picker",{attrs:{options:e.stringOptions},on:{input:e.change}})],1)],1),e._v(" "),n("h3",[e._v("Font Size 12px")]),e._v(" "),n("div",{staticStyle:{"font-size":"12px"}},[n("scroll-picker-group",[n("scroll-picker",{staticClass:"vue-scroll-picker-8",attrs:{options:e.options},on:{input:e.change}}),e._v(" "),n("scroll-picker",{staticClass:"vue-scroll-picker-4",attrs:{options:e.options},on:{input:e.change}})],1)],1)]),e._v(" "),n("h2",[e._v("Binding Tests")]),e._v(" "),n("div",[n("h4",[e._v("start value is null (current value = "+e._s(e.dataBindingTest1)+")")]),e._v(" "),n("div",[n("scroll-picker",{attrs:{options:e.options},model:{value:e.dataBindingTest1,callback:function(t){e.dataBindingTest1=t},expression:"dataBindingTest1"}}),e._v(" "),n("div",{staticStyle:{"text-align":"center"}},e._l(e.options,function(t){return n("a",{class:{active:e.dataBindingTest1==t.value},on:{click:function(n){e.dataBindingTest1=t.value}}},[e._v(e._s(t.name))])}))],1),e._v(" "),n("h4",[e._v("start value is 20 (current value = "+e._s(e.dataBindingTest2)+")")]),e._v(" "),n("div",[n("scroll-picker",{attrs:{options:e.options},model:{value:e.dataBindingTest2,callback:function(t){e.dataBindingTest2=t},expression:"dataBindingTest2"}}),e._v(" "),n("div",{staticStyle:{"text-align":"center"}},e._l(e.options,function(t){return n("a",{class:{active:e.dataBindingTest2==t.value},on:{click:function(n){e.dataBindingTest2=t.value}}},[e._v(e._s(t.name))])}))],1),e._v(" "),n("h4",[e._v("start value is null with placeholder (current value = "+e._s(e.dataBindingTest3)+")")]),e._v(" "),n("div",[n("scroll-picker",{attrs:{options:e.options,placeholder:"Select One"},model:{value:e.dataBindingTest3,callback:function(t){e.dataBindingTest3=t},expression:"dataBindingTest3"}}),e._v(" "),n("div",{staticStyle:{"text-align":"center"}},[n("a",{class:{active:null===e.dataBindingTest3},on:{click:function(t){e.dataBindingTest3=null}}},[e._v("None")]),e._v(" "),e._l(e.options,function(t){return n("a",{class:{active:e.dataBindingTest3==t.value},on:{click:function(n){e.dataBindingTest3=t.value}}},[e._v(e._s(t.name))])})],2)],1),e._v(" "),n("h4",[e._v("start value is 20 with placeholder (current value = "+e._s(e.dataBindingTest4)+")")]),e._v(" "),n("div",[n("scroll-picker",{attrs:{options:e.options,placeholder:"Select One"},model:{value:e.dataBindingTest4,callback:function(t){e.dataBindingTest4=t},expression:"dataBindingTest4"}}),e._v(" "),n("div",{staticStyle:{"text-align":"center"}},[n("a",{class:{active:null===e.dataBindingTest4},on:{click:function(t){e.dataBindingTest4=null}}},[e._v("None")]),e._v(" "),e._l(e.options,function(t){return n("a",{class:{active:e.dataBindingTest4==t.value},on:{click:function(n){e.dataBindingTest4=t.value}}},[e._v(e._s(t.name))])})],2)],1)])])},staticRenderFns:[]};t.a=i},function(e,t,n){var i=n(5);"string"==typeof i&&(i=[[e.i,i,""]]),i.locals&&(e.exports=i.locals);n(10)("12eda470",i,!0)},function(e,t,n){function i(e){for(var t=0;t<e.length;t++){var n=e[t],i=u[n.id];if(i){i.refs++;for(s=0;s<i.parts.length;s++)i.parts[s](n.parts[s]);for(;s<n.parts.length;s++)i.parts.push(r(n.parts[s]));i.parts.length>n.parts.length&&(i.parts.length=n.parts.length)}else{for(var a=[],s=0;s<n.parts.length;s++)a.push(r(n.parts[s]));u[n.id]={id:n.id,refs:1,parts:a}}}}function a(){var e=document.createElement("style");return e.type="text/css",d.appendChild(e),e}function r(e){var t,n,i=document.querySelector('style[data-vue-ssr-id~="'+e.id+'"]');if(i){if(f)return g;i.parentNode.removeChild(i)}if(h){var r=v++;i=p||(p=a()),t=s.bind(null,i,r,!1),n=s.bind(null,i,r,!0)}else i=a(),t=o.bind(null,i),n=function(){i.parentNode.removeChild(i)};return t(e),function(i){if(i){if(i.css===e.css&&i.media===e.media&&i.sourceMap===e.sourceMap)return;t(e=i)}else n()}}function s(e,t,n,i){var a=n?"":i.css;if(e.styleSheet)e.styleSheet.cssText=m(t,a);else{var r=document.createTextNode(a),s=e.childNodes;s[t]&&e.removeChild(s[t]),s.length?e.insertBefore(r,s[t]):e.appendChild(r)}}function o(e,t){var n=t.css,i=t.media,a=t.sourceMap;if(i&&e.setAttribute("media",i),a&&(n+="\n/*# sourceURL="+a.sources[0]+" */",n+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(a))))+" */"),e.styleSheet)e.styleSheet.cssText=n;else{for(;e.firstChild;)e.removeChild(e.firstChild);e.appendChild(document.createTextNode(n))}}var l="undefined"!=typeof document;if("undefined"!=typeof DEBUG&&DEBUG&&!l)throw new Error("vue-style-loader cannot be used in a non-browser environment. Use { target: 'node' } in your Webpack config to indicate a server-rendering environment.");var c=n(11),u={},d=l&&(document.head||document.getElementsByTagName("head")[0]),p=null,v=0,f=!1,g=function(){},h="undefined"!=typeof navigator&&/msie [6-9]\b/.test(navigator.userAgent.toLowerCase());e.exports=function(e,t,n){f=n;var a=c(e,t);return i(a),function(t){for(var n=[],r=0;r<a.length;r++){var s=a[r];(o=u[s.id]).refs--,n.push(o)}t?i(a=c(e,t)):a=[];for(r=0;r<n.length;r++){var o=n[r];if(0===o.refs){for(var l=0;l<o.parts.length;l++)o.parts[l]();delete u[o.id]}}}};var m=function(){var e=[];return function(t,n){return e[t]=n,e.filter(Boolean).join("\n")}}()},function(e,t){e.exports=function(e,t){for(var n=[],i={},a=0;a<t.length;a++){var r=t[a],s=r[0],o={id:e+":"+a,css:r[1],media:r[2],sourceMap:r[3]};i[s]?i[s].parts.push(o):n.push(i[s]={id:s,parts:[o]})}return n}}])});
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("Vue"),require("VueScrollPicker")):"function"==typeof define&&define.amd?define(["Vue","VueScrollPicker"],t):"object"==typeof exports?exports.VueScrollPicker=t(require("Vue"),require("VueScrollPicker")):e.VueScrollPicker=t(e.Vue,e.VueScrollPicker)}(this,function(e,t){return function(e){function t(i){if(n[i])return n[i].exports;var r=n[i]={i:i,l:!1,exports:{}};return e[i].call(r.exports,r,r.exports,t),r.l=!0,r.exports}var n={};return t.m=e,t.c=n,t.i=function(e){return e},t.d=function(e,n,i){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:i})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=3)}([function(e,t,n){"use strict";var i=n(4),r=n(8),a=n(7)(i.a,r.a,function(e){n(9)},null,null);t.a=a.exports},function(t,n){t.exports=e},function(e,n){e.exports=t},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var i=n(1),r=n.n(i),a=n(0),s=n(2),o=n.n(s);r.a.use(o.a),new r.a({el:"#app",render:e=>e(a.a)})},function(e,t,n){"use strict";t.a={data:()=>({stringOptions:"Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.".split(" "),options:[{value:0,name:"0KG"},{value:10,name:"10KG"},{value:20,name:"20KG"},{value:30,name:"30KG"},{value:40,name:"40KG"},{value:50,name:"50KG"},{value:60,name:"60KG"},{value:70,name:"70KG"},{value:80,name:"80KG"},{value:90,name:"90KG"},{value:100,name:"100KG"}],dataBindingTest1:null,dataBindingTest2:20,dataBindingTest3:null,dataBindingTest4:20}),methods:{change(e){}}}},function(e,t,n){(e.exports=n(6)()).push([e.i,"body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:16px;line-height:1.5}a{display:inline-block;background:#ccc;color:#fff;padding:10px 10px 7px;cursor:pointer;margin:3px}a.active{background:#333}.vue-scroll-picker-item-placeholder.-selected{color:#17a2b8}.vue-scroll-picker-item.-selected{color:#007bff}",""])},function(e,t){e.exports=function(){var e=[];return e.toString=function(){for(var e=[],t=0;t<this.length;t++){var n=this[t];n[2]?e.push("@media "+n[2]+"{"+n[1]+"}"):e.push(n[1])}return e.join("")},e.i=function(t,n){"string"==typeof t&&(t=[[null,t,""]]);for(var i={},r=0;r<this.length;r++){var a=this[r][0];"number"==typeof a&&(i[a]=!0)}for(r=0;r<t.length;r++){var s=t[r];"number"==typeof s[0]&&i[s[0]]||(n&&!s[2]?s[2]=n:n&&(s[2]="("+s[2]+") and ("+n+")"),e.push(s))}},e}},function(e,t){e.exports=function(e,t,n,i,r){var a,s=e=e||{},o=typeof e.default;"object"!==o&&"function"!==o||(a=e,s=e.default);var l="function"==typeof s?s.options:s;t&&(l.render=t.render,l.staticRenderFns=t.staticRenderFns),i&&(l._scopeId=i);var c;if(r?(c=function(e){(e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),n&&n.call(this,e),e&&e._registeredComponents&&e._registeredComponents.add(r)},l._ssrRegister=c):n&&(c=n),c){var u=l.functional,d=u?l.render:l.beforeCreate;u?l.render=function(e,t){return c.call(t),d(e,t)}:l.beforeCreate=d?[].concat(d,c):[c]}return{esModule:a,exports:s,options:l}}},function(e,t,n){"use strict";var i={render:function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",[n("h2",[e._v("Support All Font Size")]),e._v(" "),n("div",[n("h3",[e._v("Font Size 24px")]),e._v(" "),n("div",{staticStyle:{"font-size":"24px"}},[n("scroll-picker-group",{staticClass:"flex"},[n("scroll-picker",{attrs:{options:e.stringOptions},on:{input:e.change}}),e._v(" "),n("scroll-picker",{attrs:{options:e.stringOptions},on:{input:e.change}}),e._v(" "),n("scroll-picker",{attrs:{options:e.stringOptions},on:{input:e.change}})],1)],1),e._v(" "),n("h3",[e._v("Font Size 12px")]),e._v(" "),n("div",{staticStyle:{"font-size":"12px"}},[n("scroll-picker-group",[n("scroll-picker",{staticClass:"vue-scroll-picker-8",attrs:{options:e.options},on:{input:e.change}}),e._v(" "),n("scroll-picker",{staticClass:"vue-scroll-picker-4",attrs:{options:e.options},on:{input:e.change}})],1)],1)]),e._v(" "),n("h2",[e._v("Binding Tests")]),e._v(" "),n("div",[n("h4",[e._v("start value is null (current value = "+e._s(e.dataBindingTest1)+")")]),e._v(" "),n("div",[n("scroll-picker",{attrs:{options:e.options},model:{value:e.dataBindingTest1,callback:function(t){e.dataBindingTest1=t},expression:"dataBindingTest1"}}),e._v(" "),n("div",{staticStyle:{"text-align":"center"}},e._l(e.options,function(t){return n("a",{class:{active:e.dataBindingTest1==t.value},on:{click:function(n){e.dataBindingTest1=t.value}}},[e._v(e._s(t.name))])}))],1),e._v(" "),n("h4",[e._v("start value is 20 (current value = "+e._s(e.dataBindingTest2)+")")]),e._v(" "),n("div",[n("scroll-picker",{attrs:{options:e.options},model:{value:e.dataBindingTest2,callback:function(t){e.dataBindingTest2=t},expression:"dataBindingTest2"}}),e._v(" "),n("div",{staticStyle:{"text-align":"center"}},e._l(e.options,function(t){return n("a",{class:{active:e.dataBindingTest2==t.value},on:{click:function(n){e.dataBindingTest2=t.value}}},[e._v(e._s(t.name))])}))],1),e._v(" "),n("h4",[e._v("start value is null with placeholder (current value = "+e._s(e.dataBindingTest3)+")")]),e._v(" "),n("div",[n("scroll-picker",{attrs:{options:e.options,placeholder:"Select One"},model:{value:e.dataBindingTest3,callback:function(t){e.dataBindingTest3=t},expression:"dataBindingTest3"}}),e._v(" "),n("div",{staticStyle:{"text-align":"center"}},[n("a",{class:{active:null===e.dataBindingTest3},on:{click:function(t){e.dataBindingTest3=null}}},[e._v("None")]),e._v(" "),e._l(e.options,function(t){return n("a",{class:{active:e.dataBindingTest3==t.value},on:{click:function(n){e.dataBindingTest3=t.value}}},[e._v(e._s(t.name))])})],2)],1),e._v(" "),n("h4",[e._v("start value is 20 with placeholder (current value = "+e._s(e.dataBindingTest4)+")")]),e._v(" "),n("div",[n("scroll-picker",{attrs:{options:e.options,placeholder:"Select One"},model:{value:e.dataBindingTest4,callback:function(t){e.dataBindingTest4=t},expression:"dataBindingTest4"}}),e._v(" "),n("div",{staticStyle:{"text-align":"center"}},[n("a",{class:{active:null===e.dataBindingTest4},on:{click:function(t){e.dataBindingTest4=null}}},[e._v("None")]),e._v(" "),e._l(e.options,function(t){return n("a",{class:{active:e.dataBindingTest4==t.value},on:{click:function(n){e.dataBindingTest4=t.value}}},[e._v(e._s(t.name))])})],2)],1)])])},staticRenderFns:[]};t.a=i},function(e,t,n){var i=n(5);"string"==typeof i&&(i=[[e.i,i,""]]),i.locals&&(e.exports=i.locals);n(10)("12eda470",i,!0)},function(e,t,n){function i(e){for(var t=0;t<e.length;t++){var n=e[t],i=u[n.id];if(i){i.refs++;for(s=0;s<i.parts.length;s++)i.parts[s](n.parts[s]);for(;s<n.parts.length;s++)i.parts.push(a(n.parts[s]));i.parts.length>n.parts.length&&(i.parts.length=n.parts.length)}else{for(var r=[],s=0;s<n.parts.length;s++)r.push(a(n.parts[s]));u[n.id]={id:n.id,refs:1,parts:r}}}}function r(){var e=document.createElement("style");return e.type="text/css",d.appendChild(e),e}function a(e){var t,n,i=document.querySelector('style[data-vue-ssr-id~="'+e.id+'"]');if(i){if(f)return g;i.parentNode.removeChild(i)}if(h){var a=v++;i=p||(p=r()),t=s.bind(null,i,a,!1),n=s.bind(null,i,a,!0)}else i=r(),t=o.bind(null,i),n=function(){i.parentNode.removeChild(i)};return t(e),function(i){if(i){if(i.css===e.css&&i.media===e.media&&i.sourceMap===e.sourceMap)return;t(e=i)}else n()}}function s(e,t,n,i){var r=n?"":i.css;if(e.styleSheet)e.styleSheet.cssText=m(t,r);else{var a=document.createTextNode(r),s=e.childNodes;s[t]&&e.removeChild(s[t]),s.length?e.insertBefore(a,s[t]):e.appendChild(a)}}function o(e,t){var n=t.css,i=t.media,r=t.sourceMap;if(i&&e.setAttribute("media",i),r&&(n+="\n/*# sourceURL="+r.sources[0]+" */",n+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(r))))+" */"),e.styleSheet)e.styleSheet.cssText=n;else{for(;e.firstChild;)e.removeChild(e.firstChild);e.appendChild(document.createTextNode(n))}}var l="undefined"!=typeof document;if("undefined"!=typeof DEBUG&&DEBUG&&!l)throw new Error("vue-style-loader cannot be used in a non-browser environment. Use { target: 'node' } in your Webpack config to indicate a server-rendering environment.");var c=n(11),u={},d=l&&(document.head||document.getElementsByTagName("head")[0]),p=null,v=0,f=!1,g=function(){},h="undefined"!=typeof navigator&&/msie [6-9]\b/.test(navigator.userAgent.toLowerCase());e.exports=function(e,t,n){f=n;var r=c(e,t);return i(r),function(t){for(var n=[],a=0;a<r.length;a++){var s=r[a];(o=u[s.id]).refs--,n.push(o)}t?i(r=c(e,t)):r=[];for(a=0;a<n.length;a++){var o=n[a];if(0===o.refs){for(var l=0;l<o.parts.length;l++)o.parts[l]();delete u[o.id]}}}};var m=function(){var e=[];return function(t,n){return e[t]=n,e.filter(Boolean).join("\n")}}()},function(e,t){e.exports=function(e,t){for(var n=[],i={},r=0;r<t.length;r++){var a=t[r],s=a[0],o={id:e+":"+r,css:a[1],media:a[2],sourceMap:a[3]};i[s]?i[s].parts.push(o):n.push(i[s]={id:s,parts:[o]})}return n}}])});

package.json

 {
   "name": "vue-scroll-picker",
-  "version": "0.0.5",
+  "version": "0.1.0",
   "description": "scroll picker component for Vue.js.",
@@ -5,0 +5,0 @@ "author": "Changwan Jun",

README.md

@@ -80,1 +80,10 @@ Vue Scroll Picker
  - `@input` : you can use `v-model` :-)
+
+### Styling
+
+- [rscss](http://rscss.io/index.html)
+- [Vue Loader Deep Selector](https://vue-loader.vuejs.org/en/features/scoped-css.html) : if you want to override css style, use deep selector in vue-loader!
+
+### License
+
+MIT

Fixed alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

210691

0.35%

Number of package files

17

6.25%

Lines of code

147

5.76%

Number of lines in readme file

89

11.25%

Number of medium supply chain risk alerts

0

-100%

No dependency changes