@ophiuchus/circle/dist/index.umd.js

### 介绍

/*!
* @ophiuchus/circle v1.0.0 Sun Sep 26 2021 14:35:57 GMT+0800 (中国标准时间)
* (c) 2021 @mws_ophiuchus
* Released under the MIT License.
*/
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e(require("vue")):"function"==typeof define&&define.amd?define(["vue"],e):(t="undefined"!=typeof globalThis?globalThis:t||self).SFCircle=e(t.Vue)}(this,(function(t){"use strict";function e(t){return t&&"object"==typeof t&&"default"in t?t:{default:t}}function i(t,e){return e?"string"==typeof e?` ${t}--${e}`:Array.isArray(e)?e.reduce(((e,s)=>e+i(t,s)),""):Object.keys(e).reduce(((s,r)=>s+(e[r]?i(t,r):"")),""):""}function s(t){return function(e,s){return e&&"string"!=typeof e&&(s=e,e=""),`${e=e?`${t}__${e}`:t}${i(e,s)}`}}const r=/-(\w)/g;const n={methods:{slots(t="default",e){const{$slots:i,$scopedSlots:s}=this,r=s[t];return r?r(e):i[t]}}};function o(t){const{name:e}=this;t.component(e,this),t.component(`-${e}`.replace(r,((t,e)=>e.toUpperCase())),this)}function a(t){return{functional:!0,props:t.props,model:t.model,render:(e,i)=>t(e,i.props,function(t){const e=t.scopedSlots||t.data.scopedSlots||{},i=t.slots();return Object.keys(i).forEach((t=>{e[t]||(e[t]=()=>i[t])})),e}(i),i)}}function h(t){return function(e){return"function"==typeof e&&(e=a(e)),e.functional||(e.mixins=e.mixins||[],e.mixins.push(n)),e.name=t,e.install=o,e}}const l=e(t).default.prototype.$isServer;let u=Date.now();const c=l?global:window,d=c.requestAnimationFrame||function(t){const e=Date.now(),i=Math.max(0,16-(e-u)),s=setTimeout(t,i);return u=e+i,s},p=c.cancelAnimationFrame||c.clearTimeout;function f(t){return d.call(c,t)}const[m,y]=[h($="sf-"+($="circle")),s($)];var $;let x=0;function S(t){return Math.min(Math.max(t,0),100)}return m({props:{text:String,size:[Number,String],color:[String,Object],layerColor:String,strokeLinecap:String,value:{type:Number,default:0},speed:{type:[Number,String],default:0},fill:{type:String,default:"none"},rate:{type:[Number,String],default:100},strokeWidth:{type:[Number,String],default:40},clockwise:{type:Boolean,default:!0}},beforeCreate(){this.uid="sf-circle-gradient-"+x++},computed:{style(){const t=function(t){if(null!=t)return e=t=String(t),/^\d+(\.\d+)?$/.test(e)?`${t}px`:t;var e}(this.size);return{width:t,height:t}},path(){return function(t,e){const i=t?1:0;return`M ${e/2} ${e/2} m 0, -500 a 500, 500 0 1, ${i} 0, 1000 a 500, 500 0 1, ${i} 0, -1000`}(this.clockwise,this.viewBoxSize)},viewBoxSize(){return+this.strokeWidth+1e3},layerStyle(){return{fill:`${this.fill}`,stroke:`${this.layerColor}`,strokeWidth:`${this.strokeWidth}px`}},hoverStyle(){const t=3140*this.value/100;return{stroke:`${this.gradient?`url(#${this.uid})`:this.color}`,strokeWidth:+this.strokeWidth+1+"px",strokeLinecap:this.strokeLinecap,strokeDasharray:`${t}px 3140px`}},gradient(){return null!==(t=this.color)&&"object"==typeof t;var t},LinearGradient(){const t=this.$createElement;if(!this.gradient)return;const e=Object.keys(this.color).sort(((t,e)=>parseFloat(t)-parseFloat(e))).map(((e,i)=>t("stop",{key:i,attrs:{offset:e,"stop-color":this.color[e]}})));return t("defs",[t("linearGradient",{attrs:{id:this.uid,x1:"100%",y1:"0%",x2:"0%",y2:"0%"}},[e])])}},watch:{rate:{handler(t){var e;this.startTime=Date.now(),this.startRate=this.value,this.endRate=S(t),this.increase=this.endRate>this.startRate,this.duration=Math.abs(1e3*(this.startRate-this.endRate)/this.speed),this.speed?(e=this.rafId,p.call(c,e),this.rafId=f(this.animate)):this.$emit("input",this.endRate)},immediate:!0}},methods:{animate(){const t=Date.now(),e=Math.min((t-this.startTime)/this.duration,1)*(this.endRate-this.startRate)+this.startRate;this.$emit("input",S(parseFloat(e.toFixed(1)))),(this.increase?e<this.endRate:e>this.endRate)&&(this.rafId=f(this.animate))}},render(){const t=arguments[0];return t("div",{class:y(),style:this.style},[t("svg",{attrs:{viewBox:`0 0 ${this.viewBoxSize} ${this.viewBoxSize}`}},[this.LinearGradient,t("path",{class:y("layer"),style:this.layerStyle,attrs:{d:this.path}}),t("path",{attrs:{d:this.path},class:y("hover"),style:this.hoverStyle})]),this.slots()||this.text&&t("div",{class:y("text")},[this.text])])}})}));