UNPKG

2.18 kBJavaScriptView Raw
1/*!
2 * vue-chevron v0.1.0
3 * (c) 2017-present Ispal <irpa.oss@gmail.com>
4 * Released under the MIT License.
5 */
6!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):e.VueChevron=t()}(this,function(){"use strict";function e(e,t,n,i,r){var o=1===n?t:t+(1-n);o>=1&&(o=1);return e?r+i/2-o*i:r-i/2+o*i}var t,n=null;return{name:"VueChevron",props:{pointDown:{type:Boolean,default:!0},duration:{type:Number,default:500},thickness:{type:Number,default:4},angle:{type:Number,default:40},roundEdges:{type:Boolean,default:!0},easing:{type:Function,default:function(e){return e}}},data:function(){return{progress:1,clickProgress:1,reverse:!1,lineLength:30}},computed:{path:function(){var t=this.progress,n=this.triangleSideLengths,i=n.width,r=n.height,o=this.viewBoxCenter,s=o.x,h=o.y,a=this.clickProgress,u=e(this.pointDown,t,a,r,h);return"M"+(s-i)+","+u+", "+s+","+e(!this.pointDown,t,a,r,h)+" "+(s+i)+","+u},triangleSideLengths:function(){var e=this.lineLength*Math.sin(this.angle*(Math.PI/180));return{width:this.lineLength*Math.cos(this.angle*(Math.PI/180)),height:e}},viewBoxCenter:function(){var e=this.viewBoxSize;return{x:e.width/2,y:e.height/2}},viewBoxSize:function(){var e=this.lineLength,t=this.thickness;return{width:Math.ceil(2*e+2*t),height:Math.ceil(2*e*Math.sin(this.angle*(Math.PI/180))+2*t)}}},watch:{pointDown:function(){this.clickProgress=this.progress,this.progress=0,window.cancelAnimationFrame(t),function(e,i){n=i.progress<=1?performance.now():n;var r=function(o){var s=(o-n)/e;if(s>=1)return window.cancelAnimationFrame(t),i.clickProgress=1,void(i.progress=1);i.progress=i.easing(s),t=window.requestAnimationFrame(r)};t=window.requestAnimationFrame(r)}(this.duration,this)}},render:function(e){var t=this.roundEdges?"round":"square",n=this.viewBoxSize;return e("svg",{attrs:{height:32,width:32,xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 "+n.width+" "+n.height}},[e("title","vue-chevron"),e("path",{attrs:{d:this.path,fill:"none","stroke-linecap":t,"stroke-width":this.thickness,"stroke-linejoin":t,stroke:"currentColor"}})])}}});
7//# sourceMappingURL=vue-chevron.min.js.map