├── static └── .gitkeep ├── .eslintignore ├── config ├── npm.env.js ├── prod.env.js ├── test.env.js ├── dev.env.js └── index.js ├── demo ├── assets │ └── logo.png ├── router │ └── index.js ├── main.js ├── App.vue ├── components │ ├── Card.vue │ └── Examples.vue └── constants.js ├── src ├── constants.js ├── utils.js ├── index.js └── Progress.vue ├── .gitignore ├── .npmrc ├── test └── unit │ ├── .eslintrc │ ├── specs │ └── Hello.spec.js │ ├── index.js │ └── karma.conf.js ├── .editorconfig ├── .postcssrc.js ├── .babelrc ├── index.html ├── docs ├── index.html └── static │ ├── js │ ├── manifest.08c6f6216be29efa9e11.js │ ├── app.e2e75b5745caf242a70f.js │ ├── manifest.08c6f6216be29efa9e11.js.map │ └── app.e2e75b5745caf242a70f.js.map │ └── css │ ├── app.f0a01a6ce3d970685a35462b0367cac2.css │ └── app.f0a01a6ce3d970685a35462b0367cac2.css.map ├── .eslintrc.js ├── examples └── index.html ├── package.json ├── README.md └── dist └── vue-progress.min.js /static/.gitkeep: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /.eslintignore: -------------------------------------------------------------------------------- 1 | build/*.js 2 | config/*.js 3 | -------------------------------------------------------------------------------- /config/npm.env.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | NODE_ENV: '"npm"' 3 | } 4 | -------------------------------------------------------------------------------- /config/prod.env.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | NODE_ENV: '"production"' 3 | } 4 | -------------------------------------------------------------------------------- /demo/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wangdahoo/vue-progress/HEAD/demo/assets/logo.png -------------------------------------------------------------------------------- /src/constants.js: -------------------------------------------------------------------------------- 1 | export const LINE = 'line' 2 | export const CIRCLE = 'circle' 3 | export const PATH = 'path' 4 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules/ 3 | npm-debug.log* 4 | yarn-debug.log* 5 | yarn-error.log* 6 | test/unit/coverage 7 | -------------------------------------------------------------------------------- /.npmrc: -------------------------------------------------------------------------------- 1 | phantomjs_cdnurl=http://cnpmjs.org/downloads 2 | sass_binary_site=https://npm.taobao.org/mirrors/node-sass/ 3 | registry=https://registry.npm.taobao.org 4 | -------------------------------------------------------------------------------- /src/utils.js: -------------------------------------------------------------------------------- 1 | export const extend = (target, source) => { 2 | for (let key in source) { 3 | target[key] = source[key] 4 | } 5 | return target 6 | } 7 | -------------------------------------------------------------------------------- /test/unit/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "mocha": true 4 | }, 5 | "globals": { 6 | "expect": true, 7 | "sinon": true 8 | } 9 | } 10 | -------------------------------------------------------------------------------- /config/test.env.js: -------------------------------------------------------------------------------- 1 | var merge = require('webpack-merge') 2 | var devEnv = require('./dev.env') 3 | 4 | module.exports = merge(devEnv, { 5 | NODE_ENV: '"testing"' 6 | }) 7 | -------------------------------------------------------------------------------- /config/dev.env.js: -------------------------------------------------------------------------------- 1 | var merge = require('webpack-merge') 2 | var prodEnv = require('./prod.env') 3 | 4 | module.exports = merge(prodEnv, { 5 | NODE_ENV: '"development"' 6 | }) 7 | -------------------------------------------------------------------------------- /.editorconfig: -------------------------------------------------------------------------------- 1 | root = true 2 | 3 | [*] 4 | charset = utf-8 5 | indent_style = space 6 | indent_size = 2 7 | end_of_line = lf 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | -------------------------------------------------------------------------------- /.postcssrc.js: -------------------------------------------------------------------------------- 1 | // https://github.com/michael-ciniawsky/postcss-load-config 2 | 3 | module.exports = { 4 | "plugins": { 5 | // to edit target browsers: use "browserlist" field in package.json 6 | "autoprefixer": {} 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | ["env", { "modules": false }], 4 | "stage-2" 5 | ], 6 | "plugins": ["transform-runtime"], 7 | "comments": false, 8 | "env": { 9 | "test": { 10 | "presets": ["env", "stage-2"], 11 | "plugins": [ "istanbul" ] 12 | } 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /src/index.js: -------------------------------------------------------------------------------- 1 | import Progress from './Progress' 2 | 3 | let VueProgress = { 4 | install: function (Vue, options) { 5 | Vue.component('progress-bar', Progress) 6 | } 7 | } 8 | 9 | export default VueProgress 10 | 11 | if (typeof window !== 'undefined' && window.Vue) { 12 | window.Vue.use(VueProgress) 13 | } 14 | -------------------------------------------------------------------------------- /demo/router/index.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import Router from 'vue-router' 3 | import Examples from '@/components/Examples' 4 | 5 | Vue.use(Router) 6 | 7 | export default new Router({ 8 | routes: [ 9 | { 10 | path: '/', 11 | name: 'Examples', 12 | component: Examples 13 | } 14 | ] 15 | }) 16 | -------------------------------------------------------------------------------- /demo/main.js: -------------------------------------------------------------------------------- 1 | import 'normalize.css/normalize.css' 2 | 3 | import Vue from 'vue' 4 | import App from './App' 5 | import router from './router' 6 | 7 | import VProgress from 'vprogress' 8 | Vue.use(VProgress) 9 | Vue.config.productionTip = false 10 | 11 | /* eslint-disable no-new */ 12 | new Vue({ 13 | el: '#app', 14 | router, 15 | template: '', 16 | components: { App } 17 | }) 18 | -------------------------------------------------------------------------------- /test/unit/specs/Hello.spec.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import Hello from '@/components/Hello' 3 | 4 | describe('Hello.vue', () => { 5 | it('should render correct contents', () => { 6 | const Constructor = Vue.extend(Hello) 7 | const vm = new Constructor().$mount() 8 | expect(vm.$el.querySelector('.hello h1').textContent) 9 | .to.equal('Welcome to Your Vue.js App') 10 | }) 11 | }) 12 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | vue-progress 7 | 8 | 9 | 10 |
11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /docs/index.html: -------------------------------------------------------------------------------- 1 | vue-progress
-------------------------------------------------------------------------------- /test/unit/index.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | Vue.config.productionTip = false 3 | 4 | // Polyfill fn.bind() for PhantomJS 5 | /* eslint-disable no-extend-native */ 6 | Function.prototype.bind = require('function-bind') 7 | 8 | // require all test files (files that ends with .spec.js) 9 | const testsContext = require.context('./specs', true, /\.spec$/) 10 | testsContext.keys().forEach(testsContext) 11 | 12 | // require all src files except main.js for coverage. 13 | // you can also change this to match only the subset of files that 14 | // you want coverage for. 15 | const srcContext = require.context('../../src', true, /^\.\/(?!main(\.js)?$)/) 16 | srcContext.keys().forEach(srcContext) 17 | -------------------------------------------------------------------------------- /.eslintrc.js: -------------------------------------------------------------------------------- 1 | // http://eslint.org/docs/user-guide/configuring 2 | 3 | module.exports = { 4 | root: true, 5 | parser: 'babel-eslint', 6 | parserOptions: { 7 | sourceType: 'module' 8 | }, 9 | env: { 10 | browser: true, 11 | }, 12 | // https://github.com/feross/standard/blob/master/RULES.md#javascript-standard-style 13 | extends: 'standard', 14 | // required to lint *.vue files 15 | plugins: [ 16 | 'html' 17 | ], 18 | // add your custom rules here 19 | 'rules': { 20 | // allow paren-less arrow functions 21 | 'arrow-parens': 0, 22 | // allow async-await 23 | 'generator-star-spacing': 0, 24 | // allow debugger during development 25 | 'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0 26 | } 27 | } 28 | -------------------------------------------------------------------------------- /demo/App.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 12 | 46 | -------------------------------------------------------------------------------- /demo/components/Card.vue: -------------------------------------------------------------------------------- 1 | 11 | 38 | -------------------------------------------------------------------------------- /examples/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | vue-progress 7 | 8 | 9 | 15 | 16 | 17 |
18 | 19 | 28 | 29 | 37 | 38 | 39 | -------------------------------------------------------------------------------- /test/unit/karma.conf.js: -------------------------------------------------------------------------------- 1 | // This is a karma config file. For more details see 2 | // http://karma-runner.github.io/0.13/config/configuration-file.html 3 | // we are also using it with karma-webpack 4 | // https://github.com/webpack/karma-webpack 5 | 6 | var webpackConfig = require('../../build/webpack.test.conf') 7 | 8 | module.exports = function (config) { 9 | config.set({ 10 | // to run in additional browsers: 11 | // 1. install corresponding karma launcher 12 | // http://karma-runner.github.io/0.13/config/browsers.html 13 | // 2. add it to the `browsers` array below. 14 | browsers: ['PhantomJS'], 15 | frameworks: ['mocha', 'sinon-chai'], 16 | reporters: ['spec', 'coverage'], 17 | files: ['./index.js'], 18 | preprocessors: { 19 | './index.js': ['webpack', 'sourcemap'] 20 | }, 21 | webpack: webpackConfig, 22 | webpackMiddleware: { 23 | noInfo: true 24 | }, 25 | coverageReporter: { 26 | dir: './coverage', 27 | reporters: [ 28 | { type: 'lcov', subdir: '.' }, 29 | { type: 'text-summary' } 30 | ] 31 | } 32 | }) 33 | } 34 | -------------------------------------------------------------------------------- /docs/static/js/manifest.08c6f6216be29efa9e11.js: -------------------------------------------------------------------------------- 1 | !function(e){function r(n){if(t[n])return t[n].exports;var o=t[n]={i:n,l:!1,exports:{}};return e[n].call(o.exports,o,o.exports,r),o.l=!0,o.exports}var n=window.webpackJsonp;window.webpackJsonp=function(t,c,a){for(var i,u,f,s=0,l=[];s", 6 | "main": "dist/vue-progress.min.js", 7 | "scripts": { 8 | "dev": "node build/dev-server.js", 9 | "build": "node build/build.js", 10 | "unit": "cross-env BABEL_ENV=test karma start test/unit/karma.conf.js --single-run", 11 | "test": "npm run unit", 12 | "lint": "eslint --ext .js,.vue src test/unit/specs", 13 | "pack": "node build/pack.js" 14 | }, 15 | "dependencies": { 16 | "progressbar.js": "^1.0.1" 17 | }, 18 | "devDependencies": { 19 | "vue": "^2.2.2", 20 | "vue-router": "^2.2.0", 21 | "autoprefixer": "^6.7.2", 22 | "babel-core": "^6.22.1", 23 | "babel-eslint": "^7.1.1", 24 | "babel-loader": "^6.2.10", 25 | "babel-plugin-istanbul": "^3.1.2", 26 | "babel-plugin-transform-runtime": "^6.22.0", 27 | "babel-preset-env": "^1.2.1", 28 | "babel-preset-stage-2": "^6.22.0", 29 | "babel-register": "^6.22.0", 30 | "chai": "^3.5.0", 31 | "chalk": "^1.1.3", 32 | "connect-history-api-fallback": "^1.3.0", 33 | "copy-webpack-plugin": "^4.0.1", 34 | "cross-env": "^3.1.4", 35 | "css-loader": "^0.26.1", 36 | "eslint": "^3.14.1", 37 | "eslint-config-standard": "^6.2.1", 38 | "eslint-friendly-formatter": "^2.0.7", 39 | "eslint-loader": "^1.6.1", 40 | "eslint-plugin-html": "^2.0.0", 41 | "eslint-plugin-promise": "^3.4.0", 42 | "eslint-plugin-standard": "^2.0.1", 43 | "eventsource-polyfill": "^0.9.6", 44 | "express": "^4.14.1", 45 | "extract-text-webpack-plugin": "^2.0.0", 46 | "file-loader": "^0.10.0", 47 | "friendly-errors-webpack-plugin": "^1.1.3", 48 | "function-bind": "^1.1.0", 49 | "html-webpack-plugin": "^2.28.0", 50 | "http-proxy-middleware": "^0.17.3", 51 | "inject-loader": "^2.0.1", 52 | "karma": "^1.4.1", 53 | "karma-coverage": "^1.1.1", 54 | "karma-mocha": "^1.3.0", 55 | "karma-phantomjs-launcher": "^1.0.2", 56 | "karma-sinon-chai": "^1.2.4", 57 | "karma-sourcemap-loader": "^0.3.7", 58 | "karma-spec-reporter": "0.0.26", 59 | "karma-webpack": "^2.0.2", 60 | "lolex": "^1.5.2", 61 | "mocha": "^3.2.0", 62 | "normalize.css": "^6.0.0", 63 | "opn": "^4.0.2", 64 | "optimize-css-assets-webpack-plugin": "^1.3.0", 65 | "ora": "^1.1.0", 66 | "phantomjs-prebuilt": "^2.1.14", 67 | "rimraf": "^2.6.0", 68 | "semver": "^5.3.0", 69 | "sinon": "^1.17.7", 70 | "sinon-chai": "^2.8.0", 71 | "url-loader": "^0.5.7", 72 | "vue-loader": "^11.1.4", 73 | "vue-style-loader": "^2.0.0", 74 | "vue-template-compiler": "^2.2.4", 75 | "webpack": "^2.2.1", 76 | "webpack-bundle-analyzer": "^2.2.1", 77 | "webpack-dev-middleware": "^1.10.0", 78 | "webpack-hot-middleware": "^2.16.1", 79 | "webpack-merge": "^2.6.1" 80 | }, 81 | "engines": { 82 | "node": ">= 4.0.0", 83 | "npm": ">= 3.0.0" 84 | }, 85 | "browserslist": [ 86 | "> 1%", 87 | "last 2 versions", 88 | "not ie <= 8" 89 | ] 90 | } 91 | -------------------------------------------------------------------------------- /demo/constants.js: -------------------------------------------------------------------------------- 1 | export const ANIMATE_DURATION = 1400 2 | export const ANIMATE_DELAY = 400 3 | 4 | const LINE_BASIC = { 5 | strokeWidth: 4, 6 | easing: 'easeInOut', 7 | duration: ANIMATE_DURATION, 8 | color: '#FFEA82', 9 | trailColor: '#eee', 10 | trailWidth: 1, 11 | svgStyle: { width: '100%', height: '100%' } 12 | } 13 | 14 | const LINE_PERCENT = { 15 | strokeWidth: 4, 16 | easing: 'easeInOut', 17 | duration: ANIMATE_DURATION, 18 | color: '#FFEA82', 19 | trailColor: '#eee', 20 | trailWidth: 1, 21 | svgStyle: {width: '100%', height: '100%'}, 22 | text: { 23 | style: { 24 | // Text color. 25 | // Default: same as stroke color (options.color) 26 | color: '#999', 27 | position: 'absolute', 28 | right: '0', 29 | top: '30px', 30 | padding: 0, 31 | margin: 0, 32 | transform: null 33 | }, 34 | autoStyleContainer: false 35 | }, 36 | from: {color: '#FFEA82'}, 37 | to: {color: '#ED6A5A'}, 38 | step: (state, bar) => { 39 | bar.setText(Math.round(bar.value() * 100) + ' %') 40 | } 41 | } 42 | 43 | const LINE_COLOR_ANIMATION = { 44 | strokeWidth: 4, 45 | easing: 'easeInOut', 46 | duration: ANIMATE_DURATION, 47 | color: '#FFEA82', 48 | trailColor: '#eee', 49 | trailWidth: 1, 50 | svgStyle: {width: '100%', height: '100%'}, 51 | from: {color: '#FFEA82'}, 52 | to: {color: '#ED6A5A'}, 53 | step: (state, bar) => { 54 | bar.path.setAttribute('stroke', state.color) 55 | } 56 | } 57 | 58 | const CIRCLE_BASIC = { 59 | strokeWidth: 6, 60 | easing: 'easeInOut', 61 | duration: ANIMATE_DURATION, 62 | color: '#FFEA82', 63 | trailColor: '#eee', 64 | trailWidth: 1, 65 | svgStyle: null 66 | } 67 | 68 | const CIRCLE_BOUNCE_EASING = { 69 | color: '#FFEA82', 70 | trailColor: '#eee', 71 | trailWidth: 1, 72 | duration: ANIMATE_DURATION, 73 | easing: 'bounce', 74 | strokeWidth: 6, 75 | from: {color: '#FFEA82', a:0}, 76 | to: {color: '#ED6A5A', a:1}, 77 | // Set default step function for all animate calls 78 | step: function(state, circle) { 79 | circle.path.setAttribute('stroke', state.color) 80 | } 81 | } 82 | 83 | const CIRCLE_MULTIPLE_PROPERTIES = { 84 | color: '#aaa', 85 | // This has to be the same size as the maximum width to 86 | // prevent clipping 87 | strokeWidth: 4, 88 | trailWidth: 1, 89 | easing: 'easeInOut', 90 | duration: ANIMATE_DURATION, 91 | text: { 92 | autoStyleContainer: false 93 | }, 94 | from: { color: '#aaa', width: 1 }, 95 | to: { color: '#333', width: 4 }, 96 | // Set default step function for all animate calls 97 | step: function(state, circle) { 98 | circle.path.setAttribute('stroke', state.color) 99 | circle.path.setAttribute('stroke-width', state.width) 100 | var value = Math.round(circle.value() * 100) 101 | if (value === 0) { 102 | circle.setText('') 103 | } else { 104 | circle.setText(value) 105 | } 106 | } 107 | } 108 | 109 | const CUSTOM_HEART = { 110 | easing: 'easeInOut', 111 | duration: ANIMATE_DURATION 112 | } 113 | 114 | // example options 115 | export const OPTIONS = { 116 | LINE_BASIC, 117 | LINE_PERCENT, 118 | LINE_COLOR_ANIMATION, 119 | CIRCLE_BASIC, 120 | CIRCLE_BOUNCE_EASING, 121 | CIRCLE_MULTIPLE_PROPERTIES, 122 | CUSTOM_HEART 123 | } 124 | -------------------------------------------------------------------------------- /docs/static/css/app.f0a01a6ce3d970685a35462b0367cac2.css: -------------------------------------------------------------------------------- 1 | /*! normalize.css v6.0.0 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}article,aside,footer,header,nav,section{display:block}h1{font-size:2em;margin:.67em 0}figcaption,figure,main{display:block}figure{margin:1em 40px}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent;-webkit-text-decoration-skip:objects}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:inherit;font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}dfn{font-style:italic}mark{background-color:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}audio,video{display:inline-block}audio:not([controls]){display:none;height:0}img{border-style:none}svg:not(:root){overflow:hidden}button,input,optgroup,select,textarea{margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{display:inline-block;vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details,menu{display:block}summary{display:list-item}canvas{display:inline-block}[hidden],template{display:none}body,html{margin:0;padding:0}*{box-sizing:border-box}.github-corner:hover .octo-arm{-webkit-animation:octocat-wave .56s ease-in-out;animation:octocat-wave .56s ease-in-out}@-webkit-keyframes octocat-wave{0%,to{-webkit-transform:rotate(0);transform:rotate(0)}20%,60%{-webkit-transform:rotate(-25deg);transform:rotate(-25deg)}40%,80%{-webkit-transform:rotate(10deg);transform:rotate(10deg)}}@keyframes octocat-wave{0%,to{-webkit-transform:rotate(0);transform:rotate(0)}20%,60%{-webkit-transform:rotate(-25deg);transform:rotate(-25deg)}40%,80%{-webkit-transform:rotate(10deg);transform:rotate(10deg)}}@media (max-width:500px){.github-corner:hover .octo-arm{-webkit-animation:none;animation:none}.github-corner .octo-arm{-webkit-animation:octocat-wave .56s ease-in-out;animation:octocat-wave .56s ease-in-out}}.wrap[data-v-19a499da]{padding-top:80px}h1[data-v-19a499da],h2[data-v-19a499da]{font-family:Raleway,Helvetica,sans-serif;color:#444;text-transform:uppercase}h3[data-v-19a499da]{font-family:Josefin Sans,Helvetica,sans-serif;color:silver}.text-center[data-v-19a499da]{text-align:center}.text-left[data-v-19a499da]{text-align:left}.container[data-v-19a499da]{padding:0 50px 50px}.line[data-v-19a499da]{position:absolute;width:200px;height:8px;top:96px;left:50%;margin-left:-100px}.circle[data-v-19a499da],.heart[data-v-19a499da]{position:absolute;width:140px;height:140px;top:30px;left:50%;margin-left:-70px}.card{font-family:Raleway,Helvetica,sans-serif;color:#555;border:1px solid hsla(0,0%,63%,.3);margin-bottom:50px}.card-content{height:200px;position:relative}.card-footer{background-color:#fafafa;padding:10px 20px}.card-footer .text{text-align:right;margin:0;font-size:12px;line-height:18px;text-transform:uppercase;letter-spacing:3px} -------------------------------------------------------------------------------- /src/Progress.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 165 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # vue-progress 2 | 3 | > Progressbar.js as a Vue Component 4 | 5 | ## How to use 6 | 7 | ### install 8 | 9 | ```bash 10 | npm i vue-progress -S 11 | ``` 12 | 13 | ### import as a vue plugin 14 | 15 | ```js 16 | import VueProgress from 'vue-progress' 17 | Vue.use(VueProgress) 18 | ``` 19 | 20 | ### hello `` 21 | ```html 22 | 28 | 29 | 42 | 43 | 49 | ``` 50 | 51 | ## ProgressBar component attributes 52 | 53 | #### `type`: type of path `line`, `circle`, `custom` 54 | #### `options`: Options for path drawing. 55 | 56 | ```js 57 | { 58 | // Stroke color. 59 | // Default: '#555' 60 | color: '#3a3a3a', 61 | 62 | // Width of the stroke. 63 | // Unit is percentage of SVG canvas' size. 64 | // Default: 1.0 65 | // NOTE: In Line shape, you should control 66 | // the stroke width by setting container's height. 67 | // WARNING: IE doesn't support values over 6, see this bug: 68 | // https://github.com/kimmobrunfeldt/progressbar.js/issues/79 69 | strokeWidth: 2.1, 70 | 71 | // If trail options are not defined, trail won't be drawn 72 | 73 | // Color for lighter trail stroke 74 | // underneath the actual progress path. 75 | // Default: '#eee' 76 | trailColor: '#f4f4f4', 77 | 78 | // Width of the trail stroke. Trail is always centered relative to 79 | // actual progress path. 80 | // Default: same as strokeWidth 81 | trailWidth: 0.8, 82 | 83 | // Inline CSS styles for the created SVG element 84 | // Set null to disable all default styles. 85 | // You can disable individual defaults by setting them to `null` 86 | // If you specify anything in this object, none of the default styles 87 | // apply 88 | svgStyle: { 89 | display: 'block', 90 | 91 | // Important: make sure that your container has same 92 | // aspect ratio as the SVG canvas. See SVG canvas sizes above. 93 | width: '100%' 94 | }, 95 | 96 | // Text options. Text element is a

element appended to container 97 | // You can add CSS rules for the text element with the className 98 | // NOTE: When text is set, 'position: relative' will be set to the 99 | // container for centering. You can also prevent all default inline 100 | // styles with 'text.style: null' 101 | // Default: null 102 | text: { 103 | // Initial value for text. 104 | // Default: null 105 | value: 'Text', 106 | 107 | // Class name for text element. 108 | // Default: 'progressbar-text' 109 | className: 'progressbar__label', 110 | 111 | // Inline CSS styles for the text element. 112 | // If you want to modify all CSS your self, set null to disable 113 | // all default styles. 114 | // If the style option contains values, container is automatically 115 | // set to position: relative. You can disable behavior this with 116 | // autoStyleContainer: false 117 | // If you specify anything in this object, none of the default styles 118 | // apply 119 | // Default: object speficied below 120 | style: { 121 | // Text color. 122 | // Default: same as stroke color (options.color) 123 | color: '#f00', 124 | position: 'absolute', 125 | left: '50%', 126 | top: '50%', 127 | padding: 0, 128 | margin: 0, 129 | // You can specify styles which will be browser prefixed 130 | transform: { 131 | prefix: true, 132 | value: 'translate(-50%, -50%)' 133 | } 134 | }, 135 | 136 | // Only effective if the text.style is not null 137 | // By default position: relative is applied to container if text 138 | // is set. Setting this to false disables that feature. 139 | autoStyleContainer: true, 140 | 141 | // Only effective if the shape is SemiCircle. 142 | // If true, baseline for text is aligned with bottom of 143 | // the SVG canvas. If false, bottom line of SVG canvas 144 | // is in the center of text. 145 | // Default: true 146 | alignToBottom: true 147 | }, 148 | 149 | // Fill color for the shape. If null, no fill. 150 | // Default: null 151 | fill: 'rgba(0, 0, 0, 0.5)', 152 | 153 | // Duration for animation in milliseconds 154 | // Default: 800 155 | duration: 1200, 156 | 157 | // Easing for animation. See #easing section. 158 | // Default: 'linear' 159 | easing: 'easeOut', 160 | 161 | // See #custom-animations section 162 | // Built-in shape passes reference to itself and a custom attachment 163 | // object to step function 164 | from: { color: '#eee' }, 165 | to: { color: '#000' }, 166 | step: function(state, circle, attachment) { 167 | circle.path.setAttribute('stroke', state.color); 168 | }, 169 | 170 | // If true, some useful console.warn calls will be done if it seems 171 | // that progressbar is used incorrectly 172 | // Default: false 173 | warnings: false 174 | } 175 | ``` 176 | 177 | ## ProgressBar vm methods 178 | 179 | #### svg() 180 | Reference to SVG element where progress bar is drawn. 181 | 182 | #### path() 183 | Reference to SVG path which presents the actual progress bar. 184 | 185 | #### trail() 186 | Reference to SVG path which presents the trail of the progress bar. Returns null if trail is not defined. 187 | 188 | #### text() 189 | Reference to p element which presents the text label for progress bar. Returns null if text is not defined. 190 | 191 | #### animate(progress, [options], [cb]) 192 | Animates drawing of a shape. 193 | 194 | - `progress`: progress from 0 to 1. 195 | - `options`: Animation options. These options override the defaults given in initialization. 196 | ```js 197 | { 198 | // Duration for animation in milliseconds 199 | // Default: 800 200 | duration: 1200, 201 | 202 | // Easing for animation. See #easing section. 203 | // Default: 'linear' 204 | easing: 'easeInOut', 205 | 206 | // See #custom-animations section 207 | // Built-in shape passes reference to itself and a custom attachment 208 | // object to step function 209 | from: { color: '#eee' }, 210 | to: { color: '#000' }, 211 | step: function(state, circle, attachment) { 212 | circle.path.setAttribute('stroke', state.color); 213 | } 214 | } 215 | ``` 216 | - `cb`: Callback function which is called after animation ends. 217 | 218 | #### set(progress) 219 | Sets progress instantly without animation. Clears all animations for path. 220 | 221 | #### stop() 222 | Stops animation to its current position. 223 | 224 | #### value() 225 | Returns current shown progress from 0 to 1. This value changes when animation is running. 226 | 227 | #### setText(text) 228 | Sets text to given a string. If you need to dynamically modify the text element, see .text attribute. 229 | -------------------------------------------------------------------------------- /demo/components/Examples.vue: -------------------------------------------------------------------------------- 1 | 91 | 92 | 149 | 150 | 205 | -------------------------------------------------------------------------------- /docs/static/js/app.e2e75b5745caf242a70f.js: -------------------------------------------------------------------------------- 1 | webpackJsonp([0],[,,,,,,function(t,e,r){"use strict";var i=r(3),s=r(31),o=r(25),n=r.n(o);i.a.use(s.a),e.a=new s.a({routes:[{path:"/",name:"Examples",component:n.a}]})},function(t,e,r){"use strict";var i=r(26),s=r.n(i),o={install:function(t,e){t.component("progress-bar",s.a)}};e.a=o,"undefined"!=typeof window&&window.Vue&&window.Vue.use(o)},function(t,e){},function(t,e,r){r(18);var i=r(2)(r(14),r(28),null,null);t.exports=i.exports},function(t,e,r){"use strict";r.d(e,"a",function(){return i}),r.d(e,"b",function(){return p});var i=400,s={strokeWidth:4,easing:"easeInOut",duration:1400,color:"#FFEA82",trailColor:"#eee",trailWidth:1,svgStyle:{width:"100%",height:"100%"}},o={strokeWidth:4,easing:"easeInOut",duration:1400,color:"#FFEA82",trailColor:"#eee",trailWidth:1,svgStyle:{width:"100%",height:"100%"},text:{style:{color:"#999",position:"absolute",right:"0",top:"30px",padding:0,margin:0,transform:null},autoStyleContainer:!1},from:{color:"#FFEA82"},to:{color:"#ED6A5A"},step:function(t,e){e.setText(Math.round(100*e.value())+" %")}},n={strokeWidth:4,easing:"easeInOut",duration:1400,color:"#FFEA82",trailColor:"#eee",trailWidth:1,svgStyle:{width:"100%",height:"100%"},from:{color:"#FFEA82"},to:{color:"#ED6A5A"},step:function(t,e){e.path.setAttribute("stroke",t.color)}},a={strokeWidth:6,easing:"easeInOut",duration:1400,color:"#FFEA82",trailColor:"#eee",trailWidth:1,svgStyle:null},c={color:"#FFEA82",trailColor:"#eee",trailWidth:1,duration:1400,easing:"bounce",strokeWidth:6,from:{color:"#FFEA82",a:0},to:{color:"#ED6A5A",a:1},step:function(t,e){e.path.setAttribute("stroke",t.color)}},l={color:"#aaa",strokeWidth:4,trailWidth:1,easing:"easeInOut",duration:1400,text:{autoStyleContainer:!1},from:{color:"#aaa",width:1},to:{color:"#333",width:4},step:function(t,e){e.path.setAttribute("stroke",t.color),e.path.setAttribute("stroke-width",t.width);var r=Math.round(100*e.value());0===r?e.setText(""):e.setText(r)}},u={easing:"easeInOut",duration:1400},p={LINE_BASIC:s,LINE_PERCENT:o,LINE_COLOR_ANIMATION:n,CIRCLE_BASIC:a,CIRCLE_BOUNCE_EASING:c,CIRCLE_MULTIPLE_PROPERTIES:l,CUSTOM_HEART:u}},function(t,e,r){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var i=r(8),s=(r.n(i),r(3)),o=r(9),n=r.n(o),a=r(6),c=r(7);s.a.use(c.a),s.a.config.productionTip=!1,new s.a({el:"#app",router:a.a,template:"",components:{App:n.a}})},function(t,e,r){"use strict";r.d(e,"a",function(){return i}),r.d(e,"b",function(){return s}),r.d(e,"c",function(){return o});var i="line",s="circle",o="path"},function(t,e,r){"use strict";r.d(e,"a",function(){return i});var i=function(t,e){for(var r in e)t[r]=e[r];return t}},function(t,e,r){"use strict";Object.defineProperty(e,"__esModule",{value:!0}),e.default={name:"app"}},function(t,e,r){"use strict";function i(t){t.animate(1,function(){setTimeout(t.animate(0,function(){setTimeout(i(t),n.a)}),n.a)})}Object.defineProperty(e,"__esModule",{value:!0});var s=r(24),o=r.n(s),n=r(10);e.default={components:{Card:o.a},data:function(){return{title:"ProgressBar.js",subtitle:"As a Vue Component",lineBasicOptions:n.b.LINE_BASIC,linePercentOptions:n.b.LINE_PERCENT,lineColorAnimationOptions:n.b.LINE_COLOR_ANIMATION,circleBasicOptions:n.b.CIRCLE_BASIC,circleBounceEasingOptions:n.b.CIRCLE_BOUNCE_EASING,circleMultiplePropertiesOptions:n.b.CIRCLE_MULTIPLE_PROPERTIES,customHeartOptions:n.b.CUSTOM_HEART}},mounted:function(){this.init()},methods:{init:function(){i(this.$refs.basicLine),i(this.$refs.percentLine),i(this.$refs.colorAnimationLine),i(this.$refs.basicCircle),i(this.$refs.bounceEasingCircle),i(this.$refs.multiplePropertiesCircle),i(this.$refs.customHeart)}}}},function(t,e,r){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var i=r(12),s=r(13),o=r(21),n=(r.n(o),/^\d+(\.\d+)?$/),a=/^\+?[1-9][0-9]*$/;e.default={props:{type:{type:String,default:i.a,validator:function(t){return t===i.a||t===i.b||t===i.c}},color:{type:String,default:"#555"},strokeWidth:{type:[Number,String],default:1,validator:function(t){return n.test(t)}},trailColor:{type:String,default:"#eee"},trailWidth:{type:[Number,String],default:.5,validator:function(t){return n.test(t)}},duration:{type:[Number,String],default:800,validator:function(t){return a.test(t)}},easing:{type:String,default:"linear"},svgStyle:Object,text:Object,fill:String,from:Object,to:Object,step:Function,options:{type:Object,default:function(){return{}}}},data:function(){return{progress:void 0}},mounted:function(){this.init()},destroyed:function(){this.progress&&this.progress.destroy()},methods:{init:function(){var t={color:this.color,strokeWidth:parseFloat(this.strokeWidth),trailColor:this.trailColor,trailWidth:parseFloat(this.trailWidth),duration:parseInt(this.duration),easing:this.easing};this.svgStyle&&(t.svgStyle=this.svgStyle),this.text&&(t.text=this.text),this.fill&&(t.fill=this.fill),this.from&&(t.from=this.from),this.to&&(t.to=this.to),this.step&&(t.step=this.step);var e=r.i(s.a)(t,this.options||{});switch(this.type){case i.b:this.progress=new o.Circle(this.$el,e);break;case i.c:var n=this.$el.querySelectorAll("path");if(0===n.length)throw new Error("[VueProgress Error] Path not found in slot svg.");this.progress=new o.Path(n[n.length-1],e);break;default:this.progress=new o.Line(this.$el,e)}},svg:function(){return this.progress.svg},path:function(){return this.progress.path},trail:function(){return this.progress.trail},text:function(){return this.progress.text},animate:function(t,e,r){this.progress.animate(t,e,r)},set:function(t){this.progress.set(t)},stop:function(){this.progress.stop()},value:function(){return this.progress.value()},setText:function(t){this.progress.setText(t)}}}},function(t,e){},function(t,e){},function(t,e){},,,,,function(t,e,r){r(19);var i=r(2)(null,r(30),null,null);t.exports=i.exports},function(t,e,r){r(17);var i=r(2)(r(15),r(27),"data-v-19a499da",null);t.exports=i.exports},function(t,e,r){var i=r(2)(r(16),r(29),null,null);t.exports=i.exports},function(t,e){t.exports={render:function(){var t=this,e=t.$createElement,r=t._self._c||e;return r("div",{staticClass:"wrap"},[r("a",{staticClass:"github-corner",attrs:{href:"https://github.com/wangdahoo/vue-progress","aria-label":"View source on Github"}},[r("svg",{staticStyle:{fill:"#ec4949",color:"#fff",position:"absolute",top:"0",border:"0",right:"0"},attrs:{width:"80",height:"80",viewBox:"0 0 250 250","aria-hidden":"true"}},[r("path",{attrs:{d:"M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"}}),r("path",{staticClass:"octo-arm",staticStyle:{"transform-origin":"130px 106px"},attrs:{d:"M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2",fill:"currentColor"}}),r("path",{staticClass:"octo-body",attrs:{d:"M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z",fill:"currentColor"}})])]),t._v(" "),r("h1",{staticClass:"text-center",domProps:{innerHTML:t._s(t.title)}}),t._v(" "),r("h3",{staticClass:"text-center",domProps:{textContent:t._s(t.subtitle)}}),t._v(" "),r("div",{staticClass:"container"},[r("h2",{staticClass:"text-left"},[t._v("line")]),t._v(" "),r("card",[r("div",{slot:"content"},[r("progress-bar",{ref:"basicLine",staticClass:"line",attrs:{type:"line",options:t.lineBasicOptions}})],1),t._v(" "),r("div",{slot:"footer"},[t._v("\n basic line\n ")])]),t._v(" "),r("card",[r("div",{slot:"content"},[r("progress-bar",{ref:"percentLine",staticClass:"line",attrs:{type:"line",options:t.linePercentOptions}})],1),t._v(" "),r("div",{slot:"footer"},[t._v("\n percent\n ")])]),t._v(" "),r("card",[r("div",{slot:"content"},[r("progress-bar",{ref:"colorAnimationLine",staticClass:"line",attrs:{type:"line",options:t.lineColorAnimationOptions}})],1),t._v(" "),r("div",{slot:"footer"},[t._v("\n color animation\n ")])]),t._v(" "),r("h2",{staticClass:"text-left"},[t._v("circle")]),t._v(" "),r("card",[r("div",{slot:"content"},[r("progress-bar",{ref:"basicCircle",staticClass:"circle",attrs:{type:"circle",options:t.circleBasicOptions}})],1),t._v(" "),r("div",{slot:"footer"},[t._v("\n basic circle\n ")])]),t._v(" "),r("card",[r("div",{slot:"content"},[r("progress-bar",{ref:"bounceEasingCircle",staticClass:"circle",attrs:{type:"circle",options:t.circleBounceEasingOptions}})],1),t._v(" "),r("div",{slot:"footer"},[t._v("\n bounce easing\n ")])]),t._v(" "),r("card",[r("div",{slot:"content"},[r("progress-bar",{ref:"multiplePropertiesCircle",staticClass:"circle",attrs:{type:"circle",options:t.circleMultiplePropertiesOptions}})],1),t._v(" "),r("div",{slot:"footer"},[t._v("\n multiple properties\n ")])]),t._v(" "),r("h2",{staticClass:"text-left"},[t._v("custom")]),t._v(" "),r("card",[r("div",{slot:"content"},[r("progress-bar",{ref:"customHeart",staticClass:"heart",attrs:{type:"path","path-id":"heart-path",options:t.customHeartOptions}},[r("svg",{attrs:{xmlns:"http://www.w3.org/2000/svg",version:"1.1",x:"0px",y:"0px",viewBox:"0 0 100 100"},slot:"svg"},[r("path",{attrs:{"fill-opacity":"0","stroke-width":"1",stroke:"#bbb",d:"M81.495,13.923c-11.368-5.261-26.234-0.311-31.489,11.032C44.74,13.612,29.879,8.657,18.511,13.923 C6.402,19.539,0.613,33.883,10.175,50.804c6.792,12.04,18.826,21.111,39.831,37.379c20.993-16.268,33.033-25.344,39.819-37.379 C99.387,33.883,93.598,19.539,81.495,13.923z"}}),t._v(" "),r("path",{attrs:{id:"heart-path","fill-opacity":"0","stroke-width":"3",stroke:"#ED6A5A",d:"M81.495,13.923c-11.368-5.261-26.234-0.311-31.489,11.032C44.74,13.612,29.879,8.657,18.511,13.923 C6.402,19.539,0.613,33.883,10.175,50.804c6.792,12.04,18.826,21.111,39.831,37.379c20.993-16.268,33.033-25.344,39.819-37.379 C99.387,33.883,93.598,19.539,81.495,13.923z"}})])])],1),t._v(" "),r("div",{slot:"footer"},[t._v("\n heart\n ")])])],1)])},staticRenderFns:[]}},function(t,e){t.exports={render:function(){var t=this,e=t.$createElement,r=t._self._c||e;return r("div",{attrs:{id:"app"}},[r("router-view")],1)},staticRenderFns:[]}},function(t,e){t.exports={render:function(){var t=this,e=t.$createElement;return(t._self._c||e)("div",[t._t("svg")],2)},staticRenderFns:[]}},function(t,e){t.exports={render:function(){var t=this,e=t.$createElement,r=t._self._c||e;return r("div",{staticClass:"card"},[r("div",{staticClass:"card-content"},[t._t("content")],2),t._v(" "),r("div",{staticClass:"card-footer"},[r("div",{staticClass:"text"},[t._t("footer")],2)])])},staticRenderFns:[]}}],[11]); 2 | //# sourceMappingURL=app.e2e75b5745caf242a70f.js.map -------------------------------------------------------------------------------- /docs/static/css/app.f0a01a6ce3d970685a35462b0367cac2.css.map: -------------------------------------------------------------------------------- 1 | {"version":3,"sources":["webpack:///./~/normalize.css/normalize.css","webpack:///./demo/App.vue","webpack:///./demo/components/Examples.vue","webpack:///./demo/components/Card.vue"],"names":[],"mappings":"AAAA,4EAWA,KACE,iBACA,0BACA,6BAA+B,CAUjC,wCAME,aAAe,CAQjB,GACE,cACA,cAAiB,CAWnB,uBAGE,aAAe,CAOjB,OACE,eAAiB,CAQnB,GACE,uBACA,SACA,gBAAkB,CAQpB,IACE,gCACA,aAAe,CAWjB,EACE,6BACA,oCAAsC,CAQxC,YACE,mBACA,0BACA,gCAAkC,CAOpC,SAEE,oBASA,kBAAoB,CAQtB,cAGE,gCACA,aAAe,CAOjB,IACE,iBAAmB,CAOrB,KACE,sBACA,UAAY,CAOd,MACE,aAAe,CAQjB,QAEE,cACA,cACA,kBACA,uBAAyB,CAG3B,IACE,aAAgB,CAGlB,IACE,SAAY,CAUd,YAEE,oBAAsB,CAOxB,sBACE,aACA,QAAU,CAOZ,IACE,iBAAmB,CAOrB,eACE,eAAiB,CAUnB,sCAKE,QAAU,CAQZ,aAEE,gBAAkB,CAQpB,cAEE,mBAAqB,CASvB,qDAIE,yBAA2B,CAO7B,wHAIE,kBACA,SAAW,CAOb,4GAIE,6BAA+B,CAUjC,OACE,sBACA,cACA,cACA,eACA,UACA,kBAAoB,CAQtB,SACE,qBACA,uBAAyB,CAO3B,SACE,aAAe,CAQjB,6BAEE,sBACA,SAAW,CAOb,kFAEE,WAAa,CAQf,cACE,6BACA,mBAAqB,CAOvB,qFAEE,uBAAyB,CAQ3B,6BACE,0BACA,YAAc,CAWhB,aAEE,aAAe,CAOjB,QACE,iBAAmB,CAUrB,OACE,oBAAsB,CAkBxB,kBACE,YAAc,CCxahB,UACE,SACA,SAAW,CAEb,EACE,qBAAuB,CAIzB,+BACE,gDACQ,uCAAyC,CAEnD,gCACA,MACI,4BACQ,mBAAoB,CAEhC,QACI,iCACQ,wBAAyB,CAErC,QACI,gCACQ,uBAAwB,CACnC,CAED,wBACA,MACI,4BACQ,mBAAoB,CAEhC,QACI,iCACQ,wBAAyB,CAErC,QACI,gCACQ,uBAAwB,CACnC,CAED,yBACA,+BACI,uBACQ,cAAe,CAE3B,yBACI,gDACQ,uCAAyC,CACpD,CCjDD,uBACE,gBAAkB,CAEpB,wCACE,yCACA,WACA,wBAA0B,CAE5B,oBACE,8CACA,YAAe,CAEjB,8BACE,iBAAmB,CAErB,4BACE,eAAiB,CAEnB,4BACE,mBAA0B,CAE5B,uBACE,kBACA,YACA,WACA,SACA,SACA,kBAAoB,CAUtB,iDAPE,kBACA,YACA,aACA,SACA,SACA,iBAAmB,CCnCrB,MACE,yCACA,WACA,mCACA,kBAAoB,CAEtB,cACE,aACA,iBAAmB,CAErB,aACE,yBACA,iBAAmB,CAErB,mBACE,iBACA,SACA,eACA,iBACA,yBACA,kBAAoB","file":"static/css/app.f0a01a6ce3d970685a35462b0367cac2.css","sourcesContent":["/*! normalize.css v6.0.0 | MIT License | github.com/necolas/normalize.css */\n\n/* Document\n ========================================================================== */\n\n/**\n * 1. Correct the line height in all browsers.\n * 2. Prevent adjustments of font size after orientation changes in\n * IE on Windows Phone and in iOS.\n */\n\nhtml {\n line-height: 1.15; /* 1 */\n -ms-text-size-adjust: 100%; /* 2 */\n -webkit-text-size-adjust: 100%; /* 2 */\n}\n\n/* Sections\n ========================================================================== */\n\n/**\n * Add the correct display in IE 9-.\n */\n\narticle,\naside,\nfooter,\nheader,\nnav,\nsection {\n display: block;\n}\n\n/**\n * Correct the font size and margin on `h1` elements within `section` and\n * `article` contexts in Chrome, Firefox, and Safari.\n */\n\nh1 {\n font-size: 2em;\n margin: 0.67em 0;\n}\n\n/* Grouping content\n ========================================================================== */\n\n/**\n * Add the correct display in IE 9-.\n * 1. Add the correct display in IE.\n */\n\nfigcaption,\nfigure,\nmain { /* 1 */\n display: block;\n}\n\n/**\n * Add the correct margin in IE 8.\n */\n\nfigure {\n margin: 1em 40px;\n}\n\n/**\n * 1. Add the correct box sizing in Firefox.\n * 2. Show the overflow in Edge and IE.\n */\n\nhr {\n box-sizing: content-box; /* 1 */\n height: 0; /* 1 */\n overflow: visible; /* 2 */\n}\n\n/**\n * 1. Correct the inheritance and scaling of font size in all browsers.\n * 2. Correct the odd `em` font sizing in all browsers.\n */\n\npre {\n font-family: monospace, monospace; /* 1 */\n font-size: 1em; /* 2 */\n}\n\n/* Text-level semantics\n ========================================================================== */\n\n/**\n * 1. Remove the gray background on active links in IE 10.\n * 2. Remove gaps in links underline in iOS 8+ and Safari 8+.\n */\n\na {\n background-color: transparent; /* 1 */\n -webkit-text-decoration-skip: objects; /* 2 */\n}\n\n/**\n * 1. Remove the bottom border in Chrome 57- and Firefox 39-.\n * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.\n */\n\nabbr[title] {\n border-bottom: none; /* 1 */\n text-decoration: underline; /* 2 */\n text-decoration: underline dotted; /* 2 */\n}\n\n/**\n * Prevent the duplicate application of `bolder` by the next rule in Safari 6.\n */\n\nb,\nstrong {\n font-weight: inherit;\n}\n\n/**\n * Add the correct font weight in Chrome, Edge, and Safari.\n */\n\nb,\nstrong {\n font-weight: bolder;\n}\n\n/**\n * 1. Correct the inheritance and scaling of font size in all browsers.\n * 2. Correct the odd `em` font sizing in all browsers.\n */\n\ncode,\nkbd,\nsamp {\n font-family: monospace, monospace; /* 1 */\n font-size: 1em; /* 2 */\n}\n\n/**\n * Add the correct font style in Android 4.3-.\n */\n\ndfn {\n font-style: italic;\n}\n\n/**\n * Add the correct background and color in IE 9-.\n */\n\nmark {\n background-color: #ff0;\n color: #000;\n}\n\n/**\n * Add the correct font size in all browsers.\n */\n\nsmall {\n font-size: 80%;\n}\n\n/**\n * Prevent `sub` and `sup` elements from affecting the line height in\n * all browsers.\n */\n\nsub,\nsup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n}\n\nsub {\n bottom: -0.25em;\n}\n\nsup {\n top: -0.5em;\n}\n\n/* Embedded content\n ========================================================================== */\n\n/**\n * Add the correct display in IE 9-.\n */\n\naudio,\nvideo {\n display: inline-block;\n}\n\n/**\n * Add the correct display in iOS 4-7.\n */\n\naudio:not([controls]) {\n display: none;\n height: 0;\n}\n\n/**\n * Remove the border on images inside links in IE 10-.\n */\n\nimg {\n border-style: none;\n}\n\n/**\n * Hide the overflow in IE.\n */\n\nsvg:not(:root) {\n overflow: hidden;\n}\n\n/* Forms\n ========================================================================== */\n\n/**\n * Remove the margin in Firefox and Safari.\n */\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n margin: 0;\n}\n\n/**\n * Show the overflow in IE.\n * 1. Show the overflow in Edge.\n */\n\nbutton,\ninput { /* 1 */\n overflow: visible;\n}\n\n/**\n * Remove the inheritance of text transform in Edge, Firefox, and IE.\n * 1. Remove the inheritance of text transform in Firefox.\n */\n\nbutton,\nselect { /* 1 */\n text-transform: none;\n}\n\n/**\n * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`\n * controls in Android 4.\n * 2. Correct the inability to style clickable types in iOS and Safari.\n */\n\nbutton,\nhtml [type=\"button\"], /* 1 */\n[type=\"reset\"],\n[type=\"submit\"] {\n -webkit-appearance: button; /* 2 */\n}\n\n/**\n * Remove the inner border and padding in Firefox.\n */\n\nbutton::-moz-focus-inner,\n[type=\"button\"]::-moz-focus-inner,\n[type=\"reset\"]::-moz-focus-inner,\n[type=\"submit\"]::-moz-focus-inner {\n border-style: none;\n padding: 0;\n}\n\n/**\n * Restore the focus styles unset by the previous rule.\n */\n\nbutton:-moz-focusring,\n[type=\"button\"]:-moz-focusring,\n[type=\"reset\"]:-moz-focusring,\n[type=\"submit\"]:-moz-focusring {\n outline: 1px dotted ButtonText;\n}\n\n/**\n * 1. Correct the text wrapping in Edge and IE.\n * 2. Correct the color inheritance from `fieldset` elements in IE.\n * 3. Remove the padding so developers are not caught out when they zero out\n * `fieldset` elements in all browsers.\n */\n\nlegend {\n box-sizing: border-box; /* 1 */\n color: inherit; /* 2 */\n display: table; /* 1 */\n max-width: 100%; /* 1 */\n padding: 0; /* 3 */\n white-space: normal; /* 1 */\n}\n\n/**\n * 1. Add the correct display in IE 9-.\n * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.\n */\n\nprogress {\n display: inline-block; /* 1 */\n vertical-align: baseline; /* 2 */\n}\n\n/**\n * Remove the default vertical scrollbar in IE.\n */\n\ntextarea {\n overflow: auto;\n}\n\n/**\n * 1. Add the correct box sizing in IE 10-.\n * 2. Remove the padding in IE 10-.\n */\n\n[type=\"checkbox\"],\n[type=\"radio\"] {\n box-sizing: border-box; /* 1 */\n padding: 0; /* 2 */\n}\n\n/**\n * Correct the cursor style of increment and decrement buttons in Chrome.\n */\n\n[type=\"number\"]::-webkit-inner-spin-button,\n[type=\"number\"]::-webkit-outer-spin-button {\n height: auto;\n}\n\n/**\n * 1. Correct the odd appearance in Chrome and Safari.\n * 2. Correct the outline style in Safari.\n */\n\n[type=\"search\"] {\n -webkit-appearance: textfield; /* 1 */\n outline-offset: -2px; /* 2 */\n}\n\n/**\n * Remove the inner padding and cancel buttons in Chrome and Safari on macOS.\n */\n\n[type=\"search\"]::-webkit-search-cancel-button,\n[type=\"search\"]::-webkit-search-decoration {\n -webkit-appearance: none;\n}\n\n/**\n * 1. Correct the inability to style clickable types in iOS and Safari.\n * 2. Change font properties to `inherit` in Safari.\n */\n\n::-webkit-file-upload-button {\n -webkit-appearance: button; /* 1 */\n font: inherit; /* 2 */\n}\n\n/* Interactive\n ========================================================================== */\n\n/*\n * Add the correct display in IE 9-.\n * 1. Add the correct display in Edge, IE, and Firefox.\n */\n\ndetails, /* 1 */\nmenu {\n display: block;\n}\n\n/*\n * Add the correct display in all browsers.\n */\n\nsummary {\n display: list-item;\n}\n\n/* Scripting\n ========================================================================== */\n\n/**\n * Add the correct display in IE 9-.\n */\n\ncanvas {\n display: inline-block;\n}\n\n/**\n * Add the correct display in IE.\n */\n\ntemplate {\n display: none;\n}\n\n/* Hidden\n ========================================================================== */\n\n/**\n * Add the correct display in IE 10-.\n */\n\n[hidden] {\n display: none;\n}\n\n\n\n// WEBPACK FOOTER //\n// ./~/normalize.css/normalize.css","\nhtml, body {\n margin: 0;\n padding: 0;\n}\n* {\n box-sizing: border-box;\n}\n\n/* github corner */\n.github-corner:hover .octo-arm {\n -webkit-animation: octocat-wave 560ms ease-in-out;\n animation: octocat-wave 560ms ease-in-out\n}\n@-webkit-keyframes octocat-wave {\n0%, 100% {\n -webkit-transform: rotate(0);\n transform: rotate(0)\n}\n20%, 60% {\n -webkit-transform: rotate(-25deg);\n transform: rotate(-25deg)\n}\n40%, 80% {\n -webkit-transform: rotate(10deg);\n transform: rotate(10deg)\n}\n}\n@keyframes octocat-wave {\n0%, 100% {\n -webkit-transform: rotate(0);\n transform: rotate(0)\n}\n20%, 60% {\n -webkit-transform: rotate(-25deg);\n transform: rotate(-25deg)\n}\n40%, 80% {\n -webkit-transform: rotate(10deg);\n transform: rotate(10deg)\n}\n}\n@media (max-width:500px) {\n.github-corner:hover .octo-arm {\n -webkit-animation: none;\n animation: none\n}\n.github-corner .octo-arm {\n -webkit-animation: octocat-wave 560ms ease-in-out;\n animation: octocat-wave 560ms ease-in-out\n}\n}\n\n\n\n// WEBPACK FOOTER //\n// ./demo/App.vue","\n.wrap[data-v-19a499da] {\n padding-top: 80px;\n}\nh1[data-v-19a499da], h2[data-v-19a499da] {\n font-family: 'Raleway', Helvetica, sans-serif;\n color: #444;\n text-transform: uppercase;\n}\nh3[data-v-19a499da] {\n font-family: 'Josefin Sans', Helvetica, sans-serif;\n color: #c0c0c0;\n}\n.text-center[data-v-19a499da] {\n text-align: center;\n}\n.text-left[data-v-19a499da] {\n text-align: left;\n}\n.container[data-v-19a499da] {\n padding: 0 50px 50px 50px;\n}\n.line[data-v-19a499da] {\n position: absolute;\n width: 200px;\n height: 8px;\n top: 96px;\n left: 50%;\n margin-left: -100px;\n}\n.circle[data-v-19a499da] {\n position: absolute;\n width: 140px;\n height: 140px;\n top: 30px;\n left: 50%;\n margin-left: -70px;\n}\n.heart[data-v-19a499da] {\n position: absolute;\n width: 140px;\n height: 140px;\n top: 30px;\n left: 50%;\n margin-left: -70px;\n}\n\n\n\n// WEBPACK FOOTER //\n// ./demo/components/Examples.vue","\n.card {\n font-family: Raleway, Helvetica, sans-serif;\n color: #555;\n border: 1px solid rgba(160, 160, 160, 0.3);\n margin-bottom: 50px;\n}\n.card-content {\n height: 200px;\n position: relative;\n}\n.card-footer {\n background-color: #fafafa;\n padding: 10px 20px;\n}\n.card-footer .text {\n text-align: right;\n margin: 0;\n font-size: 12px;\n line-height: 18px;\n text-transform: uppercase;\n letter-spacing: 3px;\n}\n\n\n\n// WEBPACK FOOTER //\n// ./demo/components/Card.vue"],"sourceRoot":""} -------------------------------------------------------------------------------- /docs/static/js/manifest.08c6f6216be29efa9e11.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"sources":["webpack:///static/js/manifest.08c6f6216be29efa9e11.js","webpack:///webpack/bootstrap 6f908934922a64111dde"],"names":["modules","__webpack_require__","moduleId","installedModules","exports","module","i","l","call","parentJsonpFunction","window","chunkIds","moreModules","executeModules","chunkId","result","resolves","length","installedChunks","push","Object","prototype","hasOwnProperty","shift","s","2","e","onScriptComplete","script","onerror","onload","clearTimeout","timeout","chunk","Error","undefined","Promise","resolve","promise","reject","head","document","getElementsByTagName","createElement","type","charset","async","nc","setAttribute","src","p","0","1","setTimeout","appendChild","m","c","value","d","name","getter","o","defineProperty","configurable","enumerable","get","n","__esModule","object","property","oe","err","console","error"],"mappings":"CAAS,SAAUA,GCqCnB,QAAAC,GAAAC,GAGA,GAAAC,EAAAD,GACA,MAAAC,GAAAD,GAAAE,OAGA,IAAAC,GAAAF,EAAAD,IACAI,EAAAJ,EACAK,GAAA,EACAH,WAUA,OANAJ,GAAAE,GAAAM,KAAAH,EAAAD,QAAAC,IAAAD,QAAAH,GAGAI,EAAAE,GAAA,EAGAF,EAAAD,QAxDA,GAAAK,GAAAC,OAAA,YACAA,QAAA,sBAAAC,EAAAC,EAAAC,GAIA,IADA,GAAAX,GAAAY,EAAAC,EAAAT,EAAA,EAAAU,KACQV,EAAAK,EAAAM,OAAoBX,IAC5BQ,EAAAH,EAAAL,GACAY,EAAAJ,IACAE,EAAAG,KAAAD,EAAAJ,GAAA,IACAI,EAAAJ,GAAA,CAEA,KAAAZ,IAAAU,GACAQ,OAAAC,UAAAC,eAAAd,KAAAI,EAAAV,KACAF,EAAAE,GAAAU,EAAAV,GAIA,KADAO,KAAAE,EAAAC,EAAAC,GACAG,EAAAC,QACAD,EAAAO,SACA,IAAAV,EACA,IAAAP,EAAA,EAAYA,EAAAO,EAAAI,OAA2BX,IACvCS,EAAAd,IAAAuB,EAAAX,EAAAP,GAGA,OAAAS,GAIA,IAAAZ,MAGAe,GACAO,EAAA,EA6BAxB,GAAAyB,EAAA,SAAAZ,GA6BA,QAAAa,KAEAC,EAAAC,QAAAD,EAAAE,OAAA,KACAC,aAAAC,EACA,IAAAC,GAAAf,EAAAJ,EACA,KAAAmB,IACAA,KAAA,MAAAC,OAAA,iBAAApB,EAAA,aACAI,EAAAJ,OAAAqB,IAnCA,OAAAjB,EAAAJ,GACA,MAAAsB,SAAAC,SAGA,IAAAnB,EAAAJ,GACA,MAAAI,GAAAJ,GAAA,EAIA,IAAAwB,GAAA,GAAAF,SAAA,SAAAC,EAAAE,GACArB,EAAAJ,IAAAuB,EAAAE,IAEArB,GAAAJ,GAAA,GAAAwB,CAGA,IAAAE,GAAAC,SAAAC,qBAAA,WACAd,EAAAa,SAAAE,cAAA,SACAf,GAAAgB,KAAA,kBACAhB,EAAAiB,QAAA,QACAjB,EAAAkB,OAAA,EACAlB,EAAAI,QAAA,KAEA/B,EAAA8C,IACAnB,EAAAoB,aAAA,QAAA/C,EAAA8C,IAEAnB,EAAAqB,IAAAhD,EAAAiD,EAAA,aAAApC,EAAA,KAAwEqC,EAAA,uBAAAC,EAAA,wBAAsDtC,GAAA,KAC9H,IAAAkB,GAAAqB,WAAA1B,EAAA,KAcA,OAbAC,GAAAC,QAAAD,EAAAE,OAAAH,EAWAa,EAAAc,YAAA1B,GAEAU,GAIArC,EAAAsD,EAAAvD,EAGAC,EAAAuD,EAAArD,EAGAF,EAAAK,EAAA,SAAAmD,GAA2C,MAAAA,IAG3CxD,EAAAyD,EAAA,SAAAtD,EAAAuD,EAAAC,GACA3D,EAAA4D,EAAAzD,EAAAuD,IACAvC,OAAA0C,eAAA1D,EAAAuD,GACAI,cAAA,EACAC,YAAA,EACAC,IAAAL,KAMA3D,EAAAiE,EAAA,SAAA7D,GACA,GAAAuD,GAAAvD,KAAA8D,WACA,WAA2B,MAAA9D,GAAA,SAC3B,WAAiC,MAAAA,GAEjC,OADAJ,GAAAyD,EAAAE,EAAA,IAAAA,GACAA,GAIA3D,EAAA4D,EAAA,SAAAO,EAAAC,GAAsD,MAAAjD,QAAAC,UAAAC,eAAAd,KAAA4D,EAAAC,IAGtDpE,EAAAiD,EAAA,KAGAjD,EAAAqE,GAAA,SAAAC,GAA8D,KAApBC,SAAAC,MAAAF,GAAoBA","file":"static/js/manifest.08c6f6216be29efa9e11.js","sourcesContent":["/******/ (function(modules) { // webpackBootstrap\n/******/ \t// install a JSONP callback for chunk loading\n/******/ \tvar parentJsonpFunction = window[\"webpackJsonp\"];\n/******/ \twindow[\"webpackJsonp\"] = function webpackJsonpCallback(chunkIds, moreModules, executeModules) {\n/******/ \t\t// add \"moreModules\" to the modules object,\n/******/ \t\t// then flag all \"chunkIds\" as loaded and fire callback\n/******/ \t\tvar moduleId, chunkId, i = 0, resolves = [], result;\n/******/ \t\tfor(;i < chunkIds.length; i++) {\n/******/ \t\t\tchunkId = chunkIds[i];\n/******/ \t\t\tif(installedChunks[chunkId])\n/******/ \t\t\t\tresolves.push(installedChunks[chunkId][0]);\n/******/ \t\t\tinstalledChunks[chunkId] = 0;\n/******/ \t\t}\n/******/ \t\tfor(moduleId in moreModules) {\n/******/ \t\t\tif(Object.prototype.hasOwnProperty.call(moreModules, moduleId)) {\n/******/ \t\t\t\tmodules[moduleId] = moreModules[moduleId];\n/******/ \t\t\t}\n/******/ \t\t}\n/******/ \t\tif(parentJsonpFunction) parentJsonpFunction(chunkIds, moreModules, executeModules);\n/******/ \t\twhile(resolves.length)\n/******/ \t\t\tresolves.shift()();\n/******/ \t\tif(executeModules) {\n/******/ \t\t\tfor(i=0; i < executeModules.length; i++) {\n/******/ \t\t\t\tresult = __webpack_require__(__webpack_require__.s = executeModules[i]);\n/******/ \t\t\t}\n/******/ \t\t}\n/******/ \t\treturn result;\n/******/ \t};\n/******/\n/******/ \t// The module cache\n/******/ \tvar installedModules = {};\n/******/\n/******/ \t// objects to store loaded and loading chunks\n/******/ \tvar installedChunks = {\n/******/ \t\t2: 0\n/******/ \t};\n/******/\n/******/ \t// The require function\n/******/ \tfunction __webpack_require__(moduleId) {\n/******/\n/******/ \t\t// Check if module is in cache\n/******/ \t\tif(installedModules[moduleId])\n/******/ \t\t\treturn installedModules[moduleId].exports;\n/******/\n/******/ \t\t// Create a new module (and put it into the cache)\n/******/ \t\tvar module = installedModules[moduleId] = {\n/******/ \t\t\ti: moduleId,\n/******/ \t\t\tl: false,\n/******/ \t\t\texports: {}\n/******/ \t\t};\n/******/\n/******/ \t\t// Execute the module function\n/******/ \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n/******/\n/******/ \t\t// Flag the module as loaded\n/******/ \t\tmodule.l = true;\n/******/\n/******/ \t\t// Return the exports of the module\n/******/ \t\treturn module.exports;\n/******/ \t}\n/******/\n/******/ \t// This file contains only the entry chunk.\n/******/ \t// The chunk loading function for additional chunks\n/******/ \t__webpack_require__.e = function requireEnsure(chunkId) {\n/******/ \t\tif(installedChunks[chunkId] === 0)\n/******/ \t\t\treturn Promise.resolve();\n/******/\n/******/ \t\t// a Promise means \"currently loading\".\n/******/ \t\tif(installedChunks[chunkId]) {\n/******/ \t\t\treturn installedChunks[chunkId][2];\n/******/ \t\t}\n/******/\n/******/ \t\t// setup Promise in chunk cache\n/******/ \t\tvar promise = new Promise(function(resolve, reject) {\n/******/ \t\t\tinstalledChunks[chunkId] = [resolve, reject];\n/******/ \t\t});\n/******/ \t\tinstalledChunks[chunkId][2] = promise;\n/******/\n/******/ \t\t// start chunk loading\n/******/ \t\tvar head = document.getElementsByTagName('head')[0];\n/******/ \t\tvar script = document.createElement('script');\n/******/ \t\tscript.type = 'text/javascript';\n/******/ \t\tscript.charset = 'utf-8';\n/******/ \t\tscript.async = true;\n/******/ \t\tscript.timeout = 120000;\n/******/\n/******/ \t\tif (__webpack_require__.nc) {\n/******/ \t\t\tscript.setAttribute(\"nonce\", __webpack_require__.nc);\n/******/ \t\t}\n/******/ \t\tscript.src = __webpack_require__.p + \"static/js/\" + chunkId + \".\" + {\"0\":\"e2e75b5745caf242a70f\",\"1\":\"42f23ac550e39caf78d2\"}[chunkId] + \".js\";\n/******/ \t\tvar timeout = setTimeout(onScriptComplete, 120000);\n/******/ \t\tscript.onerror = script.onload = onScriptComplete;\n/******/ \t\tfunction onScriptComplete() {\n/******/ \t\t\t// avoid mem leaks in IE.\n/******/ \t\t\tscript.onerror = script.onload = null;\n/******/ \t\t\tclearTimeout(timeout);\n/******/ \t\t\tvar chunk = installedChunks[chunkId];\n/******/ \t\t\tif(chunk !== 0) {\n/******/ \t\t\t\tif(chunk) chunk[1](new Error('Loading chunk ' + chunkId + ' failed.'));\n/******/ \t\t\t\tinstalledChunks[chunkId] = undefined;\n/******/ \t\t\t}\n/******/ \t\t};\n/******/ \t\thead.appendChild(script);\n/******/\n/******/ \t\treturn promise;\n/******/ \t};\n/******/\n/******/ \t// expose the modules object (__webpack_modules__)\n/******/ \t__webpack_require__.m = modules;\n/******/\n/******/ \t// expose the module cache\n/******/ \t__webpack_require__.c = installedModules;\n/******/\n/******/ \t// identity function for calling harmony imports with the correct context\n/******/ \t__webpack_require__.i = function(value) { return value; };\n/******/\n/******/ \t// define getter function for harmony exports\n/******/ \t__webpack_require__.d = function(exports, name, getter) {\n/******/ \t\tif(!__webpack_require__.o(exports, name)) {\n/******/ \t\t\tObject.defineProperty(exports, name, {\n/******/ \t\t\t\tconfigurable: false,\n/******/ \t\t\t\tenumerable: true,\n/******/ \t\t\t\tget: getter\n/******/ \t\t\t});\n/******/ \t\t}\n/******/ \t};\n/******/\n/******/ \t// getDefaultExport function for compatibility with non-harmony modules\n/******/ \t__webpack_require__.n = function(module) {\n/******/ \t\tvar getter = module && module.__esModule ?\n/******/ \t\t\tfunction getDefault() { return module['default']; } :\n/******/ \t\t\tfunction getModuleExports() { return module; };\n/******/ \t\t__webpack_require__.d(getter, 'a', getter);\n/******/ \t\treturn getter;\n/******/ \t};\n/******/\n/******/ \t// Object.prototype.hasOwnProperty.call\n/******/ \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n/******/\n/******/ \t// __webpack_public_path__\n/******/ \t__webpack_require__.p = \"./\";\n/******/\n/******/ \t// on error function for async loading\n/******/ \t__webpack_require__.oe = function(err) { console.error(err); throw err; };\n/******/ })\n/************************************************************************/\n/******/ ([]);\n\n\n// WEBPACK FOOTER //\n// static/js/manifest.08c6f6216be29efa9e11.js"," \t// install a JSONP callback for chunk loading\n \tvar parentJsonpFunction = window[\"webpackJsonp\"];\n \twindow[\"webpackJsonp\"] = function webpackJsonpCallback(chunkIds, moreModules, executeModules) {\n \t\t// add \"moreModules\" to the modules object,\n \t\t// then flag all \"chunkIds\" as loaded and fire callback\n \t\tvar moduleId, chunkId, i = 0, resolves = [], result;\n \t\tfor(;i < chunkIds.length; i++) {\n \t\t\tchunkId = chunkIds[i];\n \t\t\tif(installedChunks[chunkId])\n \t\t\t\tresolves.push(installedChunks[chunkId][0]);\n \t\t\tinstalledChunks[chunkId] = 0;\n \t\t}\n \t\tfor(moduleId in moreModules) {\n \t\t\tif(Object.prototype.hasOwnProperty.call(moreModules, moduleId)) {\n \t\t\t\tmodules[moduleId] = moreModules[moduleId];\n \t\t\t}\n \t\t}\n \t\tif(parentJsonpFunction) parentJsonpFunction(chunkIds, moreModules, executeModules);\n \t\twhile(resolves.length)\n \t\t\tresolves.shift()();\n \t\tif(executeModules) {\n \t\t\tfor(i=0; i < executeModules.length; i++) {\n \t\t\t\tresult = __webpack_require__(__webpack_require__.s = executeModules[i]);\n \t\t\t}\n \t\t}\n \t\treturn result;\n \t};\n\n \t// The module cache\n \tvar installedModules = {};\n\n \t// objects to store loaded and loading chunks\n \tvar installedChunks = {\n \t\t2: 0\n \t};\n\n \t// The require function\n \tfunction __webpack_require__(moduleId) {\n\n \t\t// Check if module is in cache\n \t\tif(installedModules[moduleId])\n \t\t\treturn installedModules[moduleId].exports;\n\n \t\t// Create a new module (and put it into the cache)\n \t\tvar module = installedModules[moduleId] = {\n \t\t\ti: moduleId,\n \t\t\tl: false,\n \t\t\texports: {}\n \t\t};\n\n \t\t// Execute the module function\n \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n \t\t// Flag the module as loaded\n \t\tmodule.l = true;\n\n \t\t// Return the exports of the module\n \t\treturn module.exports;\n \t}\n\n \t// This file contains only the entry chunk.\n \t// The chunk loading function for additional chunks\n \t__webpack_require__.e = function requireEnsure(chunkId) {\n \t\tif(installedChunks[chunkId] === 0)\n \t\t\treturn Promise.resolve();\n\n \t\t// a Promise means \"currently loading\".\n \t\tif(installedChunks[chunkId]) {\n \t\t\treturn installedChunks[chunkId][2];\n \t\t}\n\n \t\t// setup Promise in chunk cache\n \t\tvar promise = new Promise(function(resolve, reject) {\n \t\t\tinstalledChunks[chunkId] = [resolve, reject];\n \t\t});\n \t\tinstalledChunks[chunkId][2] = promise;\n\n \t\t// start chunk loading\n \t\tvar head = document.getElementsByTagName('head')[0];\n \t\tvar script = document.createElement('script');\n \t\tscript.type = 'text/javascript';\n \t\tscript.charset = 'utf-8';\n \t\tscript.async = true;\n \t\tscript.timeout = 120000;\n\n \t\tif (__webpack_require__.nc) {\n \t\t\tscript.setAttribute(\"nonce\", __webpack_require__.nc);\n \t\t}\n \t\tscript.src = __webpack_require__.p + \"static/js/\" + chunkId + \".\" + {\"0\":\"e2e75b5745caf242a70f\",\"1\":\"42f23ac550e39caf78d2\"}[chunkId] + \".js\";\n \t\tvar timeout = setTimeout(onScriptComplete, 120000);\n \t\tscript.onerror = script.onload = onScriptComplete;\n \t\tfunction onScriptComplete() {\n \t\t\t// avoid mem leaks in IE.\n \t\t\tscript.onerror = script.onload = null;\n \t\t\tclearTimeout(timeout);\n \t\t\tvar chunk = installedChunks[chunkId];\n \t\t\tif(chunk !== 0) {\n \t\t\t\tif(chunk) chunk[1](new Error('Loading chunk ' + chunkId + ' failed.'));\n \t\t\t\tinstalledChunks[chunkId] = undefined;\n \t\t\t}\n \t\t};\n \t\thead.appendChild(script);\n\n \t\treturn promise;\n \t};\n\n \t// expose the modules object (__webpack_modules__)\n \t__webpack_require__.m = modules;\n\n \t// expose the module cache\n \t__webpack_require__.c = installedModules;\n\n \t// identity function for calling harmony imports with the correct context\n \t__webpack_require__.i = function(value) { return value; };\n\n \t// define getter function for harmony exports\n \t__webpack_require__.d = function(exports, name, getter) {\n \t\tif(!__webpack_require__.o(exports, name)) {\n \t\t\tObject.defineProperty(exports, name, {\n \t\t\t\tconfigurable: false,\n \t\t\t\tenumerable: true,\n \t\t\t\tget: getter\n \t\t\t});\n \t\t}\n \t};\n\n \t// getDefaultExport function for compatibility with non-harmony modules\n \t__webpack_require__.n = function(module) {\n \t\tvar getter = module && module.__esModule ?\n \t\t\tfunction getDefault() { return module['default']; } :\n \t\t\tfunction getModuleExports() { return module; };\n \t\t__webpack_require__.d(getter, 'a', getter);\n \t\treturn getter;\n \t};\n\n \t// Object.prototype.hasOwnProperty.call\n \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n\n \t// __webpack_public_path__\n \t__webpack_require__.p = \"./\";\n\n \t// on error function for async loading\n \t__webpack_require__.oe = function(err) { console.error(err); throw err; };\n\n\n\n// WEBPACK FOOTER //\n// webpack/bootstrap 6f908934922a64111dde"],"sourceRoot":""} -------------------------------------------------------------------------------- /dist/vue-progress.min.js: -------------------------------------------------------------------------------- 1 | /*! 2 | * VueProgress 0.2.1 3 | * ProgressBar.js as a Vue component. 4 | */ 5 | !function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.VueProgress=e():t.VueProgress=e()}(this,function(){return function(t){function e(r){if(n[r])return n[r].exports;var i=n[r]={i:r,l:!1,exports:{}};return t[r].call(i.exports,i,i.exports,e),i.l=!0,i.exports}var n={};return e.m=t,e.c=n,e.i=function(t){return t},e.d=function(t,n,r){e.o(t,n)||Object.defineProperty(t,n,{configurable:!1,enumerable:!0,get:r})},e.n=function(t){var n=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(n,"a",n),n},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="/",e(e.s=6)}([function(t,e){function n(t,e,r){t=t||{},e=e||{},r=r||!1;for(var i in e)if(e.hasOwnProperty(i)){var o=t[i],s=e[i];r&&c(o)&&c(s)?t[i]=n(o,s,r):t[i]=s}return t}function r(t,e){var n=t;for(var r in e)if(e.hasOwnProperty(r)){var i=e[r],o="\\{"+r+"\\}",s=new RegExp(o,"g");n=n.replace(s,i)}return n}function i(t,e,n){for(var r=t.style,i=0;it.strokeWidth&&(e=t.trailWidth);var n=50-e/2;return i.render(this._pathTemplate,{radius:n,"2radius":2*n})},o.prototype._trailString=function(t){return this._pathString(t)},t.exports=o},function(t,e,n){var r=n(12),i=n(0),o={easeIn:"easeInCubic",easeOut:"easeOutCubic",easeInOut:"easeInOutCubic"},s=function t(e,n){if(!(this instanceof t))throw new Error("Constructor was called without new keyword");n=i.extend({duration:800,easing:"linear",from:{},to:{},step:function(){}},n);var r;r=i.isString(e)?document.querySelector(e):e,this.path=r,this._opts=n,this._tweenable=null;var o=this.path.getTotalLength();this.path.style.strokeDasharray=o+" "+o,this.set(0)};s.prototype.value=function(){var t=this._getComputedDashOffset(),e=this.path.getTotalLength(),n=1-t/e;return parseFloat(n.toFixed(6),10)},s.prototype.set=function(t){this.stop(),this.path.style.strokeDashoffset=this._progressToOffset(t);var e=this._opts.step;if(i.isFunction(e)){var n=this._easing(this._opts.easing);e(this._calculateTo(t,n),this._opts.shape||this,this._opts.attachment)}},s.prototype.stop=function(){this._stopTween(),this.path.style.strokeDashoffset=this._getComputedDashOffset()},s.prototype.animate=function(t,e,n){e=e||{},i.isFunction(e)&&(n=e,e={});var o=i.extend({},e),s=i.extend({},this._opts);e=i.extend(s,e);var a=this._easing(e.easing),u=this._resolveFromAndTo(t,a,o);this.stop(),this.path.getBoundingClientRect();var h=this._getComputedDashOffset(),c=this._progressToOffset(t),p=this;this._tweenable=new r,this._tweenable.tween({from:i.extend({offset:h},u.from),to:i.extend({offset:c},u.to),duration:e.duration,easing:a,step:function(t){p.path.style.strokeDashoffset=t.offset;var n=e.shape||p;e.step(t,n,e.attachment)},finish:function(t){i.isFunction(n)&&n()}})},s.prototype._getComputedDashOffset=function(){var t=window.getComputedStyle(this.path,null);return parseFloat(t.getPropertyValue("stroke-dashoffset"),10)},s.prototype._progressToOffset=function(t){var e=this.path.getTotalLength();return e-t*e},s.prototype._resolveFromAndTo=function(t,e,n){return n.from&&n.to?{from:n.from,to:n.to}:{from:this._calculateFrom(e),to:this._calculateTo(t,e)}},s.prototype._calculateFrom=function(t){return r.interpolate(this._opts.from,this._opts.to,this.value(),t)},s.prototype._calculateTo=function(t,e){return r.interpolate(this._opts.from,this._opts.to,t,e)},s.prototype._stopTween=function(){null!==this._tweenable&&(this._tweenable.stop(),this._tweenable=null)},s.prototype._easing=function(t){return o.hasOwnProperty(t)?o[t]:t},t.exports=s},function(t,e,n){var r=n(13)(n(8),n(14),null,null);r.options.__file="/Users/tom/github/vue-progress/src/Progress.vue",r.esModule&&Object.keys(r.esModule).some(function(t){return"default"!==t&&"__esModule"!==t})&&console.error("named exports are not supported in *.vue files."),r.options.functional&&console.error("[vue-loader] Progress.vue: functional components are not supported with templates, they should use render functions."),t.exports=r.exports},function(t,e,n){"use strict";n.d(e,"a",function(){return r}),n.d(e,"b",function(){return i}),n.d(e,"c",function(){return o});var r="line",i="circle",o="path"},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var r=n(4),i=n.n(r),o={install:function(t,e){t.component("progress-bar",i.a)}};e.default=o,"undefined"!=typeof window&&window.Vue&&window.Vue.use(o)},function(t,e,n){"use strict";n.d(e,"a",function(){return r});var r=function(t,e){for(var n in e)t[n]=e[n];return t}},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var r=n(5),i=n(7),o=n(10),s=(n.n(o),/^\d+(\.\d+)?$/),a=/^\+?[1-9][0-9]*$/;e.default={props:{type:{type:String,default:r.a,validator:function(t){return t===r.a||t===r.b||t===r.c}},color:{type:String,default:"#555"},strokeWidth:{type:[Number,String],default:1,validator:function(t){return s.test(t)}},trailColor:{type:String,default:"#eee"},trailWidth:{type:[Number,String],default:.5,validator:function(t){return s.test(t)}},duration:{type:[Number,String],default:800,validator:function(t){return a.test(t)}},easing:{type:String,default:"linear"},svgStyle:Object,text:Object,fill:String,from:Object,to:Object,step:Function,options:{type:Object,default:function(){return{}}}},data:function(){return{progress:void 0}},mounted:function(){this.init()},destroyed:function(){this.progress&&this.progress.destroy()},methods:{init:function(){var t={color:this.color,strokeWidth:parseFloat(this.strokeWidth),trailColor:this.trailColor,trailWidth:parseFloat(this.trailWidth),duration:parseInt(this.duration),easing:this.easing};this.svgStyle&&(t.svgStyle=this.svgStyle),this.text&&(t.text=this.text),this.fill&&(t.fill=this.fill),this.from&&(t.from=this.from),this.to&&(t.to=this.to),this.step&&(t.step=this.step);var e=n.i(i.a)(t,this.options||{});switch(this.type){case r.b:this.progress=new o.Circle(this.$el,e);break;case r.c:var s=this.$el.querySelectorAll("path");if(0===s.length)throw new Error("[VueProgress Error] Path not found in slot svg.");this.progress=new o.Path(s[s.length-1],e);break;default:this.progress=new o.Line(this.$el,e)}},svg:function(){return this.progress.svg},path:function(){return this.progress.path},trail:function(){return this.progress.trail},text:function(){return this.progress.text},animate:function(t,e,n){this.progress.animate(t,e,n)},set:function(t){this.progress.set(t)},stop:function(){this.progress.stop()},value:function(){return this.progress.value()},setText:function(t){this.progress.setText(t)}}}},function(t,e,n){var r=n(1),i=n(0),o=function(t,e){this._pathTemplate="M 0,{center} L 100,{center}",r.apply(this,arguments)};o.prototype=new r,o.prototype.constructor=o,o.prototype._initializeSvg=function(t,e){t.setAttribute("viewBox","0 0 100 "+e.strokeWidth),t.setAttribute("preserveAspectRatio","none")},o.prototype._pathString=function(t){return i.render(this._pathTemplate,{center:t.strokeWidth/2})},o.prototype._trailString=function(t){return this._pathString(t)},t.exports=o},function(t,e,n){t.exports={Line:n(9),Circle:n(2),SemiCircle:n(11),Path:n(3),Shape:n(1),utils:n(0)}},function(t,e,n){var r=n(1),i=n(2),o=n(0),s=function(t,e){this._pathTemplate="M 50,50 m -{radius},0 a {radius},{radius} 0 1 1 {2radius},0",this.containerAspectRatio=2,r.apply(this,arguments)};s.prototype=new r,s.prototype.constructor=s,s.prototype._initializeSvg=function(t,e){t.setAttribute("viewBox","0 0 100 50")},s.prototype._initializeTextContainer=function(t,e,n){t.text.style&&(n.style.top="auto",n.style.bottom="0",t.text.alignToBottom?o.setStyle(n,"transform","translate(-50%, 0)"):o.setStyle(n,"transform","translate(-50%, 50%)"))},s.prototype._pathString=i.prototype._pathString,s.prototype._trailString=i.prototype._trailString,t.exports=s},function(t,e,n){(function(){var e=this||Function("return this")(),n=function(){"use strict";function n(){}function r(t,e){var n;for(n in t)Object.hasOwnProperty.call(t,n)&&e(n)}function i(t,e){return r(e,function(n){t[n]=e[n]}),t}function o(t,e){r(e,function(n){void 0===t[n]&&(t[n]=e[n])})}function s(t,e,n,r,i,o,s){var u,h,c,p=t=v,b=r-(v-m),t.isPlaying()&&(w?(c(a,t._attachment,b),t.stop(!0)):(t._scheduleId=p(t._timeoutHandler,g),u(t,"beforeTween"),m=0?t:0-t}function c(t,e){var n,r,i,o,a,c;for(i=t,c=0;c<8;c++){if(o=s(i)-t,h(o)r)return r;for(;no?n=i:r=i,i=.5*(r-n)+n}return i}var p=0,l=0,f=0,d=0,g=0,_=0;return f=3*e,l=3*(r-e)-f,p=1-f-l,_=3*n,g=3*(i-n)-_,d=1-_-g,function(t,e){return a(c(t,e))}(t,function(t){return 1/(200*t)}(o))}function e(e,n,r,i){return function(o){return t(o,e,n,r,i,1)}}n.setBezierFunction=function(t,r,i,o,s){var a=e(r,i,o,s);return a.displayName=t,a.x1=r,a.y1=i,a.x2=o,a.y2=s,n.prototype.formula[t]=a},n.unsetBezierFunction=function(t){delete n.prototype.formula[t]}}(),function(){function t(t,e,r,i,o,s){return n.tweenProps(i,e,t,r,1,s,o)}var e=new n;e._filterArgs=[],n.interpolate=function(r,i,o,s,a){var u=n.shallowCopy({},r),h=a||0,c=n.composeEasingObject(r,s||"linear");e.set({});var p=e._filterArgs;p.length=0,p[0]=u,p[1]=r,p[2]=i,p[3]=c,n.applyFilter(e,"tweenCreated"),n.applyFilter(e,"beforeTween");var l=t(r,u,i,o,c,h);return n.applyFilter(e,"afterTween"),l}}(),function(t){function e(t,e){var n,r=[],i=t.length;for(n=0;n',\n components: { App: __WEBPACK_IMPORTED_MODULE_2__App___default.a }\n});\n\n/***/ }),\n/* 12 */\n/***/ (function(module, __webpack_exports__, __webpack_require__) {\n\n\"use strict\";\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"a\", function() { return LINE; });\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"b\", function() { return CIRCLE; });\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"c\", function() { return PATH; });\nvar LINE = 'line';\nvar CIRCLE = 'circle';\nvar PATH = 'path';\n\n/***/ }),\n/* 13 */\n/***/ (function(module, __webpack_exports__, __webpack_require__) {\n\n\"use strict\";\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"a\", function() { return extend; });\nvar extend = function extend(target, source) {\n for (var key in source) {\n target[key] = source[key];\n }\n return target;\n};\n\n/***/ }),\n/* 14 */\n/***/ (function(module, __webpack_exports__, __webpack_require__) {\n\n\"use strict\";\nObject.defineProperty(__webpack_exports__, \"__esModule\", { value: true });\n\n\n/* harmony default export */ __webpack_exports__[\"default\"] = ({\n name: 'app'\n});\n\n/***/ }),\n/* 15 */\n/***/ (function(module, __webpack_exports__, __webpack_require__) {\n\n\"use strict\";\nObject.defineProperty(__webpack_exports__, \"__esModule\", { value: true });\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__Card__ = __webpack_require__(24);\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__Card___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_0__Card__);\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__constants__ = __webpack_require__(10);\n\n\n\n\n\n\nfunction loopAnimate(target) {\n target.animate(1.0, function () {\n setTimeout(target.animate(0, function () {\n setTimeout(loopAnimate(target), __WEBPACK_IMPORTED_MODULE_1__constants__[\"a\" /* ANIMATE_DELAY */]);\n }), __WEBPACK_IMPORTED_MODULE_1__constants__[\"a\" /* ANIMATE_DELAY */]);\n });\n}\n\n/* harmony default export */ __webpack_exports__[\"default\"] = ({\n components: {\n Card: __WEBPACK_IMPORTED_MODULE_0__Card___default.a\n },\n\n data: function data() {\n return {\n title: 'ProgressBar.js',\n subtitle: 'As a Vue Component',\n\n lineBasicOptions: __WEBPACK_IMPORTED_MODULE_1__constants__[\"b\" /* OPTIONS */].LINE_BASIC,\n linePercentOptions: __WEBPACK_IMPORTED_MODULE_1__constants__[\"b\" /* OPTIONS */].LINE_PERCENT,\n lineColorAnimationOptions: __WEBPACK_IMPORTED_MODULE_1__constants__[\"b\" /* OPTIONS */].LINE_COLOR_ANIMATION,\n circleBasicOptions: __WEBPACK_IMPORTED_MODULE_1__constants__[\"b\" /* OPTIONS */].CIRCLE_BASIC,\n circleBounceEasingOptions: __WEBPACK_IMPORTED_MODULE_1__constants__[\"b\" /* OPTIONS */].CIRCLE_BOUNCE_EASING,\n circleMultiplePropertiesOptions: __WEBPACK_IMPORTED_MODULE_1__constants__[\"b\" /* OPTIONS */].CIRCLE_MULTIPLE_PROPERTIES,\n customHeartOptions: __WEBPACK_IMPORTED_MODULE_1__constants__[\"b\" /* OPTIONS */].CUSTOM_HEART\n };\n },\n mounted: function mounted() {\n this.init();\n },\n\n\n methods: {\n init: function init() {\n var basicLine = this.$refs.basicLine;\n loopAnimate(basicLine);\n var percentLine = this.$refs.percentLine;\n loopAnimate(percentLine);\n var colorAnimationLine = this.$refs.colorAnimationLine;\n loopAnimate(colorAnimationLine);\n var basicCircle = this.$refs.basicCircle;\n loopAnimate(basicCircle);\n var bounceEasingCircle = this.$refs.bounceEasingCircle;\n loopAnimate(bounceEasingCircle);\n var multiplePropertiesCircle = this.$refs.multiplePropertiesCircle;\n loopAnimate(multiplePropertiesCircle);\n var customHeart = this.$refs.customHeart;\n loopAnimate(customHeart);\n }\n }\n});\n\n/***/ }),\n/* 16 */\n/***/ (function(module, __webpack_exports__, __webpack_require__) {\n\n\"use strict\";\nObject.defineProperty(__webpack_exports__, \"__esModule\", { value: true });\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__constants__ = __webpack_require__(12);\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__utils__ = __webpack_require__(13);\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2_progressbar_js__ = __webpack_require__(21);\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2_progressbar_js___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_2_progressbar_js__);\n\n\n\n\n\n\nvar RE_FLOAT = /^\\d+(\\.\\d+)?$/;\nvar RE_INT = /^\\+?[1-9][0-9]*$/;\n\n/* harmony default export */ __webpack_exports__[\"default\"] = ({\n props: {\n type: {\n type: String,\n default: __WEBPACK_IMPORTED_MODULE_0__constants__[\"a\" /* LINE */],\n validator: function validator(val) {\n return val === __WEBPACK_IMPORTED_MODULE_0__constants__[\"a\" /* LINE */] || val === __WEBPACK_IMPORTED_MODULE_0__constants__[\"b\" /* CIRCLE */] || val === __WEBPACK_IMPORTED_MODULE_0__constants__[\"c\" /* PATH */];\n }\n },\n color: {\n type: String,\n default: '#555'\n },\n strokeWidth: {\n type: [Number, String],\n default: 1.0,\n validator: function validator(val) {\n return RE_FLOAT.test(val);\n }\n },\n trailColor: {\n type: String,\n default: '#eee'\n },\n trailWidth: {\n type: [Number, String],\n default: 0.5,\n validator: function validator(val) {\n return RE_FLOAT.test(val);\n }\n },\n duration: {\n type: [Number, String],\n default: 800,\n validator: function validator(val) {\n return RE_INT.test(val);\n }\n },\n easing: {\n type: String,\n default: 'linear'\n },\n svgStyle: Object,\n text: Object,\n fill: String,\n from: Object,\n to: Object,\n step: Function,\n options: {\n type: Object,\n default: function _default() {\n return {};\n }\n }\n },\n\n data: function data() {\n return {\n progress: undefined\n };\n },\n mounted: function mounted() {\n this.init();\n },\n destroyed: function destroyed() {\n if (this.progress) this.progress.destroy();\n },\n\n\n methods: {\n init: function init() {\n var _options = {\n color: this.color,\n strokeWidth: parseFloat(this.strokeWidth),\n trailColor: this.trailColor,\n trailWidth: parseFloat(this.trailWidth),\n duration: parseInt(this.duration),\n easing: this.easing\n };\n\n if (this.svgStyle) _options.svgStyle = this.svgStyle;\n if (this.text) _options.text = this.text;\n if (this.fill) _options.fill = this.fill;\n if (this.from) _options.from = this.from;\n if (this.to) _options.to = this.to;\n if (this.step) _options.step = this.step;\n\n var options = __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_1__utils__[\"a\" /* extend */])(_options, this.options || {});\n\n switch (this.type) {\n case __WEBPACK_IMPORTED_MODULE_0__constants__[\"b\" /* CIRCLE */]:\n this.progress = new __WEBPACK_IMPORTED_MODULE_2_progressbar_js__[\"Circle\"](this.$el, options);\n break;\n case __WEBPACK_IMPORTED_MODULE_0__constants__[\"c\" /* PATH */]:\n var paths = this.$el.querySelectorAll('path');\n if (paths.length === 0) throw new Error('[VueProgress Error] Path not found in slot svg.');\n this.progress = new __WEBPACK_IMPORTED_MODULE_2_progressbar_js__[\"Path\"](paths[paths.length - 1], options);\n break;\n default:\n this.progress = new __WEBPACK_IMPORTED_MODULE_2_progressbar_js__[\"Line\"](this.$el, options);\n }\n },\n svg: function svg() {\n return this.progress.svg;\n },\n path: function path() {\n return this.progress.path;\n },\n trail: function trail() {\n return this.progress.trail;\n },\n text: function text() {\n return this.progress.text;\n },\n animate: function animate(progress, options, cb) {\n this.progress.animate(progress, options, cb);\n },\n set: function set(progress) {\n this.progress.set(progress);\n },\n stop: function stop() {\n this.progress.stop();\n },\n value: function value() {\n return this.progress.value();\n },\n setText: function setText(text) {\n this.progress.setText(text);\n }\n }\n});\n\n/***/ }),\n/* 17 */\n/***/ (function(module, exports) {\n\n// removed by extract-text-webpack-plugin\n\n/***/ }),\n/* 18 */\n/***/ (function(module, exports) {\n\n// removed by extract-text-webpack-plugin\n\n/***/ }),\n/* 19 */\n/***/ (function(module, exports) {\n\n// removed by extract-text-webpack-plugin\n\n/***/ }),\n/* 20 */,\n/* 21 */,\n/* 22 */,\n/* 23 */,\n/* 24 */\n/***/ (function(module, exports, __webpack_require__) {\n\n\n/* styles */\n__webpack_require__(19)\n\nvar Component = __webpack_require__(2)(\n /* script */\n null,\n /* template */\n __webpack_require__(30),\n /* scopeId */\n null,\n /* cssModules */\n null\n)\n\nmodule.exports = Component.exports\n\n\n/***/ }),\n/* 25 */\n/***/ (function(module, exports, __webpack_require__) {\n\n\n/* styles */\n__webpack_require__(17)\n\nvar Component = __webpack_require__(2)(\n /* script */\n __webpack_require__(15),\n /* template */\n __webpack_require__(27),\n /* scopeId */\n \"data-v-19a499da\",\n /* cssModules */\n null\n)\n\nmodule.exports = Component.exports\n\n\n/***/ }),\n/* 26 */\n/***/ (function(module, exports, __webpack_require__) {\n\nvar Component = __webpack_require__(2)(\n /* script */\n __webpack_require__(16),\n /* template */\n __webpack_require__(29),\n /* scopeId */\n null,\n /* cssModules */\n null\n)\n\nmodule.exports = Component.exports\n\n\n/***/ }),\n/* 27 */\n/***/ (function(module, exports) {\n\nmodule.exports={render:function (){var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;\n return _c('div', {\n staticClass: \"wrap\"\n }, [_c('a', {\n staticClass: \"github-corner\",\n attrs: {\n \"href\": \"https://github.com/wangdahoo/vue-progress\",\n \"aria-label\": \"View source on Github\"\n }\n }, [_c('svg', {\n staticStyle: {\n \"fill\": \"#ec4949\",\n \"color\": \"#fff\",\n \"position\": \"absolute\",\n \"top\": \"0\",\n \"border\": \"0\",\n \"right\": \"0\"\n },\n attrs: {\n \"width\": \"80\",\n \"height\": \"80\",\n \"viewBox\": \"0 0 250 250\",\n \"aria-hidden\": \"true\"\n }\n }, [_c('path', {\n attrs: {\n \"d\": \"M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z\"\n }\n }), _c('path', {\n staticClass: \"octo-arm\",\n staticStyle: {\n \"transform-origin\": \"130px 106px\"\n },\n attrs: {\n \"d\": \"M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2\",\n \"fill\": \"currentColor\"\n }\n }), _c('path', {\n staticClass: \"octo-body\",\n attrs: {\n \"d\": \"M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z\",\n \"fill\": \"currentColor\"\n }\n })])]), _vm._v(\" \"), _c('h1', {\n staticClass: \"text-center\",\n domProps: {\n \"innerHTML\": _vm._s(_vm.title)\n }\n }), _vm._v(\" \"), _c('h3', {\n staticClass: \"text-center\",\n domProps: {\n \"textContent\": _vm._s(_vm.subtitle)\n }\n }), _vm._v(\" \"), _c('div', {\n staticClass: \"container\"\n }, [_c('h2', {\n staticClass: \"text-left\"\n }, [_vm._v(\"line\")]), _vm._v(\" \"), _c('card', [_c('div', {\n slot: \"content\"\n }, [_c('progress-bar', {\n ref: \"basicLine\",\n staticClass: \"line\",\n attrs: {\n \"type\": \"line\",\n \"options\": _vm.lineBasicOptions\n }\n })], 1), _vm._v(\" \"), _c('div', {\n slot: \"footer\"\n }, [_vm._v(\"\\n basic line\\n \")])]), _vm._v(\" \"), _c('card', [_c('div', {\n slot: \"content\"\n }, [_c('progress-bar', {\n ref: \"percentLine\",\n staticClass: \"line\",\n attrs: {\n \"type\": \"line\",\n \"options\": _vm.linePercentOptions\n }\n })], 1), _vm._v(\" \"), _c('div', {\n slot: \"footer\"\n }, [_vm._v(\"\\n percent\\n \")])]), _vm._v(\" \"), _c('card', [_c('div', {\n slot: \"content\"\n }, [_c('progress-bar', {\n ref: \"colorAnimationLine\",\n staticClass: \"line\",\n attrs: {\n \"type\": \"line\",\n \"options\": _vm.lineColorAnimationOptions\n }\n })], 1), _vm._v(\" \"), _c('div', {\n slot: \"footer\"\n }, [_vm._v(\"\\n color animation\\n \")])]), _vm._v(\" \"), _c('h2', {\n staticClass: \"text-left\"\n }, [_vm._v(\"circle\")]), _vm._v(\" \"), _c('card', [_c('div', {\n slot: \"content\"\n }, [_c('progress-bar', {\n ref: \"basicCircle\",\n staticClass: \"circle\",\n attrs: {\n \"type\": \"circle\",\n \"options\": _vm.circleBasicOptions\n }\n })], 1), _vm._v(\" \"), _c('div', {\n slot: \"footer\"\n }, [_vm._v(\"\\n basic circle\\n \")])]), _vm._v(\" \"), _c('card', [_c('div', {\n slot: \"content\"\n }, [_c('progress-bar', {\n ref: \"bounceEasingCircle\",\n staticClass: \"circle\",\n attrs: {\n \"type\": \"circle\",\n \"options\": _vm.circleBounceEasingOptions\n }\n })], 1), _vm._v(\" \"), _c('div', {\n slot: \"footer\"\n }, [_vm._v(\"\\n bounce easing\\n \")])]), _vm._v(\" \"), _c('card', [_c('div', {\n slot: \"content\"\n }, [_c('progress-bar', {\n ref: \"multiplePropertiesCircle\",\n staticClass: \"circle\",\n attrs: {\n \"type\": \"circle\",\n \"options\": _vm.circleMultiplePropertiesOptions\n }\n })], 1), _vm._v(\" \"), _c('div', {\n slot: \"footer\"\n }, [_vm._v(\"\\n multiple properties\\n \")])]), _vm._v(\" \"), _c('h2', {\n staticClass: \"text-left\"\n }, [_vm._v(\"custom\")]), _vm._v(\" \"), _c('card', [_c('div', {\n slot: \"content\"\n }, [_c('progress-bar', {\n ref: \"customHeart\",\n staticClass: \"heart\",\n attrs: {\n \"type\": \"path\",\n \"path-id\": \"heart-path\",\n \"options\": _vm.customHeartOptions\n }\n }, [_c('svg', {\n attrs: {\n \"xmlns\": \"http://www.w3.org/2000/svg\",\n \"version\": \"1.1\",\n \"x\": \"0px\",\n \"y\": \"0px\",\n \"viewBox\": \"0 0 100 100\"\n },\n slot: \"svg\"\n }, [_c('path', {\n attrs: {\n \"fill-opacity\": \"0\",\n \"stroke-width\": \"1\",\n \"stroke\": \"#bbb\",\n \"d\": \"M81.495,13.923c-11.368-5.261-26.234-0.311-31.489,11.032C44.74,13.612,29.879,8.657,18.511,13.923 C6.402,19.539,0.613,33.883,10.175,50.804c6.792,12.04,18.826,21.111,39.831,37.379c20.993-16.268,33.033-25.344,39.819-37.379 C99.387,33.883,93.598,19.539,81.495,13.923z\"\n }\n }), _vm._v(\" \"), _c('path', {\n attrs: {\n \"id\": \"heart-path\",\n \"fill-opacity\": \"0\",\n \"stroke-width\": \"3\",\n \"stroke\": \"#ED6A5A\",\n \"d\": \"M81.495,13.923c-11.368-5.261-26.234-0.311-31.489,11.032C44.74,13.612,29.879,8.657,18.511,13.923 C6.402,19.539,0.613,33.883,10.175,50.804c6.792,12.04,18.826,21.111,39.831,37.379c20.993-16.268,33.033-25.344,39.819-37.379 C99.387,33.883,93.598,19.539,81.495,13.923z\"\n }\n })])])], 1), _vm._v(\" \"), _c('div', {\n slot: \"footer\"\n }, [_vm._v(\"\\n heart\\n \")])])], 1)])\n},staticRenderFns: []}\n\n/***/ }),\n/* 28 */\n/***/ (function(module, exports) {\n\nmodule.exports={render:function (){var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;\n return _c('div', {\n attrs: {\n \"id\": \"app\"\n }\n }, [_c('router-view')], 1)\n},staticRenderFns: []}\n\n/***/ }),\n/* 29 */\n/***/ (function(module, exports) {\n\nmodule.exports={render:function (){var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;\n return _c('div', [_vm._t(\"svg\")], 2)\n},staticRenderFns: []}\n\n/***/ }),\n/* 30 */\n/***/ (function(module, exports) {\n\nmodule.exports={render:function (){var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;\n return _c('div', {\n staticClass: \"card\"\n }, [_c('div', {\n staticClass: \"card-content\"\n }, [_vm._t(\"content\")], 2), _vm._v(\" \"), _c('div', {\n staticClass: \"card-footer\"\n }, [_c('div', {\n staticClass: \"text\"\n }, [_vm._t(\"footer\")], 2)])])\n},staticRenderFns: []}\n\n/***/ })\n],[11]);\n\n\n// WEBPACK FOOTER //\n// static/js/app.e2e75b5745caf242a70f.js","import Vue from 'vue'\nimport Router from 'vue-router'\nimport Examples from '@/components/Examples'\n\nVue.use(Router)\n\nexport default new Router({\n routes: [\n {\n path: '/',\n name: 'Examples',\n component: Examples\n }\n ]\n})\n\n\n\n// WEBPACK FOOTER //\n// ./demo/router/index.js","import Progress from './Progress'\n\nlet VueProgress = {\n install: function (Vue, options) {\n Vue.component('progress-bar', Progress)\n }\n}\n\nexport default VueProgress\n\nif (typeof window !== 'undefined' && window.Vue) {\n window.Vue.use(VueProgress)\n}\n\n\n\n// WEBPACK FOOTER //\n// ./src/index.js","\n/* styles */\nrequire(\"!!../node_modules/extract-text-webpack-plugin/loader.js?{\\\"omit\\\":1,\\\"remove\\\":true}!vue-style-loader!css-loader?{\\\"minimize\\\":true,\\\"sourceMap\\\":true}!../node_modules/vue-loader/lib/style-compiler/index?{\\\"id\\\":\\\"data-v-1fdc5852\\\",\\\"scoped\\\":false,\\\"hasInlineConfig\\\":false}!../node_modules/vue-loader/lib/selector?type=styles&index=0!./App.vue\")\n\nvar Component = require(\"!../node_modules/vue-loader/lib/component-normalizer\")(\n /* script */\n require(\"!!babel-loader!../node_modules/vue-loader/lib/selector?type=script&index=0!./App.vue\"),\n /* template */\n require(\"!!../node_modules/vue-loader/lib/template-compiler/index?{\\\"id\\\":\\\"data-v-1fdc5852\\\"}!../node_modules/vue-loader/lib/selector?type=template&index=0!./App.vue\"),\n /* scopeId */\n null,\n /* cssModules */\n null\n)\n\nmodule.exports = Component.exports\n\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./demo/App.vue\n// module id = 9\n// module chunks = 0","export const ANIMATE_DURATION = 1400\nexport const ANIMATE_DELAY = 400\n\nconst LINE_BASIC = {\n strokeWidth: 4,\n easing: 'easeInOut',\n duration: ANIMATE_DURATION,\n color: '#FFEA82',\n trailColor: '#eee',\n trailWidth: 1,\n svgStyle: { width: '100%', height: '100%' }\n}\n\nconst LINE_PERCENT = {\n strokeWidth: 4,\n easing: 'easeInOut',\n duration: ANIMATE_DURATION,\n color: '#FFEA82',\n trailColor: '#eee',\n trailWidth: 1,\n svgStyle: {width: '100%', height: '100%'},\n text: {\n style: {\n // Text color.\n // Default: same as stroke color (options.color)\n color: '#999',\n position: 'absolute',\n right: '0',\n top: '30px',\n padding: 0,\n margin: 0,\n transform: null\n },\n autoStyleContainer: false\n },\n from: {color: '#FFEA82'},\n to: {color: '#ED6A5A'},\n step: (state, bar) => {\n bar.setText(Math.round(bar.value() * 100) + ' %')\n }\n}\n\nconst LINE_COLOR_ANIMATION = {\n strokeWidth: 4,\n easing: 'easeInOut',\n duration: ANIMATE_DURATION,\n color: '#FFEA82',\n trailColor: '#eee',\n trailWidth: 1,\n svgStyle: {width: '100%', height: '100%'},\n from: {color: '#FFEA82'},\n to: {color: '#ED6A5A'},\n step: (state, bar) => {\n bar.path.setAttribute('stroke', state.color)\n }\n}\n\nconst CIRCLE_BASIC = {\n strokeWidth: 6,\n easing: 'easeInOut',\n duration: ANIMATE_DURATION,\n color: '#FFEA82',\n trailColor: '#eee',\n trailWidth: 1,\n svgStyle: null\n}\n\nconst CIRCLE_BOUNCE_EASING = {\n color: '#FFEA82',\n trailColor: '#eee',\n trailWidth: 1,\n duration: ANIMATE_DURATION,\n easing: 'bounce',\n strokeWidth: 6,\n from: {color: '#FFEA82', a:0},\n to: {color: '#ED6A5A', a:1},\n // Set default step function for all animate calls\n step: function(state, circle) {\n circle.path.setAttribute('stroke', state.color)\n }\n}\n\nconst CIRCLE_MULTIPLE_PROPERTIES = {\n color: '#aaa',\n // This has to be the same size as the maximum width to\n // prevent clipping\n strokeWidth: 4,\n trailWidth: 1,\n easing: 'easeInOut',\n duration: ANIMATE_DURATION,\n text: {\n autoStyleContainer: false\n },\n from: { color: '#aaa', width: 1 },\n to: { color: '#333', width: 4 },\n // Set default step function for all animate calls\n step: function(state, circle) {\n circle.path.setAttribute('stroke', state.color)\n circle.path.setAttribute('stroke-width', state.width)\n var value = Math.round(circle.value() * 100)\n if (value === 0) {\n circle.setText('')\n } else {\n circle.setText(value)\n }\n }\n}\n\nconst CUSTOM_HEART = {\n easing: 'easeInOut',\n duration: ANIMATE_DURATION\n}\n\n// example options\nexport const OPTIONS = {\n LINE_BASIC,\n LINE_PERCENT,\n LINE_COLOR_ANIMATION,\n CIRCLE_BASIC,\n CIRCLE_BOUNCE_EASING,\n CIRCLE_MULTIPLE_PROPERTIES,\n CUSTOM_HEART\n}\n\n\n\n// WEBPACK FOOTER //\n// ./demo/constants.js","import 'normalize.css/normalize.css'\n\nimport Vue from 'vue'\nimport App from './App'\nimport router from './router'\n\nimport VProgress from 'vprogress'\nVue.use(VProgress)\nVue.config.productionTip = false\n\n/* eslint-disable no-new */\nnew Vue({\n el: '#app',\n router,\n template: '',\n components: { App }\n})\n\n\n\n// WEBPACK FOOTER //\n// ./demo/main.js","export const LINE = 'line'\nexport const CIRCLE = 'circle'\nexport const PATH = 'path'\n\n\n\n// WEBPACK FOOTER //\n// ./src/constants.js","export const extend = (target, source) => {\n for (let key in source) {\n target[key] = source[key]\n }\n return target\n}\n\n\n\n// WEBPACK FOOTER //\n// ./src/utils.js","\n\n\n\n\n\n\n// WEBPACK FOOTER //\n// App.vue?4a7f0822","\n\n\n\n\n\n\n\n// WEBPACK FOOTER //\n// Examples.vue?ae527f04","\n\n\n\n\n\n// WEBPACK FOOTER //\n// Progress.vue?017deb82","\n/* styles */\nrequire(\"!!../../node_modules/extract-text-webpack-plugin/loader.js?{\\\"omit\\\":1,\\\"remove\\\":true}!vue-style-loader!css-loader?{\\\"minimize\\\":true,\\\"sourceMap\\\":true}!../../node_modules/vue-loader/lib/style-compiler/index?{\\\"id\\\":\\\"data-v-f707014c\\\",\\\"scoped\\\":false,\\\"hasInlineConfig\\\":false}!../../node_modules/vue-loader/lib/selector?type=styles&index=0!./Card.vue\")\n\nvar Component = require(\"!../../node_modules/vue-loader/lib/component-normalizer\")(\n /* script */\n null,\n /* template */\n require(\"!!../../node_modules/vue-loader/lib/template-compiler/index?{\\\"id\\\":\\\"data-v-f707014c\\\"}!../../node_modules/vue-loader/lib/selector?type=template&index=0!./Card.vue\"),\n /* scopeId */\n null,\n /* cssModules */\n null\n)\n\nmodule.exports = Component.exports\n\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./demo/components/Card.vue\n// module id = 24\n// module chunks = 0","\n/* styles */\nrequire(\"!!../../node_modules/extract-text-webpack-plugin/loader.js?{\\\"omit\\\":1,\\\"remove\\\":true}!vue-style-loader!css-loader?{\\\"minimize\\\":true,\\\"sourceMap\\\":true}!../../node_modules/vue-loader/lib/style-compiler/index?{\\\"id\\\":\\\"data-v-19a499da\\\",\\\"scoped\\\":true,\\\"hasInlineConfig\\\":false}!../../node_modules/vue-loader/lib/selector?type=styles&index=0!./Examples.vue\")\n\nvar Component = require(\"!../../node_modules/vue-loader/lib/component-normalizer\")(\n /* script */\n require(\"!!babel-loader!../../node_modules/vue-loader/lib/selector?type=script&index=0!./Examples.vue\"),\n /* template */\n require(\"!!../../node_modules/vue-loader/lib/template-compiler/index?{\\\"id\\\":\\\"data-v-19a499da\\\"}!../../node_modules/vue-loader/lib/selector?type=template&index=0!./Examples.vue\"),\n /* scopeId */\n \"data-v-19a499da\",\n /* cssModules */\n null\n)\n\nmodule.exports = Component.exports\n\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./demo/components/Examples.vue\n// module id = 25\n// module chunks = 0","var Component = require(\"!../node_modules/vue-loader/lib/component-normalizer\")(\n /* script */\n require(\"!!babel-loader!../node_modules/vue-loader/lib/selector?type=script&index=0!./Progress.vue\"),\n /* template */\n require(\"!!../node_modules/vue-loader/lib/template-compiler/index?{\\\"id\\\":\\\"data-v-67ac3a95\\\"}!../node_modules/vue-loader/lib/selector?type=template&index=0!./Progress.vue\"),\n /* scopeId */\n null,\n /* cssModules */\n null\n)\n\nmodule.exports = Component.exports\n\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./src/Progress.vue\n// module id = 26\n// module chunks = 0","module.exports={render:function (){var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;\n return _c('div', {\n staticClass: \"wrap\"\n }, [_c('a', {\n staticClass: \"github-corner\",\n attrs: {\n \"href\": \"https://github.com/wangdahoo/vue-progress\",\n \"aria-label\": \"View source on Github\"\n }\n }, [_c('svg', {\n staticStyle: {\n \"fill\": \"#ec4949\",\n \"color\": \"#fff\",\n \"position\": \"absolute\",\n \"top\": \"0\",\n \"border\": \"0\",\n \"right\": \"0\"\n },\n attrs: {\n \"width\": \"80\",\n \"height\": \"80\",\n \"viewBox\": \"0 0 250 250\",\n \"aria-hidden\": \"true\"\n }\n }, [_c('path', {\n attrs: {\n \"d\": \"M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z\"\n }\n }), _c('path', {\n staticClass: \"octo-arm\",\n staticStyle: {\n \"transform-origin\": \"130px 106px\"\n },\n attrs: {\n \"d\": \"M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2\",\n \"fill\": \"currentColor\"\n }\n }), _c('path', {\n staticClass: \"octo-body\",\n attrs: {\n \"d\": \"M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z\",\n \"fill\": \"currentColor\"\n }\n })])]), _vm._v(\" \"), _c('h1', {\n staticClass: \"text-center\",\n domProps: {\n \"innerHTML\": _vm._s(_vm.title)\n }\n }), _vm._v(\" \"), _c('h3', {\n staticClass: \"text-center\",\n domProps: {\n \"textContent\": _vm._s(_vm.subtitle)\n }\n }), _vm._v(\" \"), _c('div', {\n staticClass: \"container\"\n }, [_c('h2', {\n staticClass: \"text-left\"\n }, [_vm._v(\"line\")]), _vm._v(\" \"), _c('card', [_c('div', {\n slot: \"content\"\n }, [_c('progress-bar', {\n ref: \"basicLine\",\n staticClass: \"line\",\n attrs: {\n \"type\": \"line\",\n \"options\": _vm.lineBasicOptions\n }\n })], 1), _vm._v(\" \"), _c('div', {\n slot: \"footer\"\n }, [_vm._v(\"\\n basic line\\n \")])]), _vm._v(\" \"), _c('card', [_c('div', {\n slot: \"content\"\n }, [_c('progress-bar', {\n ref: \"percentLine\",\n staticClass: \"line\",\n attrs: {\n \"type\": \"line\",\n \"options\": _vm.linePercentOptions\n }\n })], 1), _vm._v(\" \"), _c('div', {\n slot: \"footer\"\n }, [_vm._v(\"\\n percent\\n \")])]), _vm._v(\" \"), _c('card', [_c('div', {\n slot: \"content\"\n }, [_c('progress-bar', {\n ref: \"colorAnimationLine\",\n staticClass: \"line\",\n attrs: {\n \"type\": \"line\",\n \"options\": _vm.lineColorAnimationOptions\n }\n })], 1), _vm._v(\" \"), _c('div', {\n slot: \"footer\"\n }, [_vm._v(\"\\n color animation\\n \")])]), _vm._v(\" \"), _c('h2', {\n staticClass: \"text-left\"\n }, [_vm._v(\"circle\")]), _vm._v(\" \"), _c('card', [_c('div', {\n slot: \"content\"\n }, [_c('progress-bar', {\n ref: \"basicCircle\",\n staticClass: \"circle\",\n attrs: {\n \"type\": \"circle\",\n \"options\": _vm.circleBasicOptions\n }\n })], 1), _vm._v(\" \"), _c('div', {\n slot: \"footer\"\n }, [_vm._v(\"\\n basic circle\\n \")])]), _vm._v(\" \"), _c('card', [_c('div', {\n slot: \"content\"\n }, [_c('progress-bar', {\n ref: \"bounceEasingCircle\",\n staticClass: \"circle\",\n attrs: {\n \"type\": \"circle\",\n \"options\": _vm.circleBounceEasingOptions\n }\n })], 1), _vm._v(\" \"), _c('div', {\n slot: \"footer\"\n }, [_vm._v(\"\\n bounce easing\\n \")])]), _vm._v(\" \"), _c('card', [_c('div', {\n slot: \"content\"\n }, [_c('progress-bar', {\n ref: \"multiplePropertiesCircle\",\n staticClass: \"circle\",\n attrs: {\n \"type\": \"circle\",\n \"options\": _vm.circleMultiplePropertiesOptions\n }\n })], 1), _vm._v(\" \"), _c('div', {\n slot: \"footer\"\n }, [_vm._v(\"\\n multiple properties\\n \")])]), _vm._v(\" \"), _c('h2', {\n staticClass: \"text-left\"\n }, [_vm._v(\"custom\")]), _vm._v(\" \"), _c('card', [_c('div', {\n slot: \"content\"\n }, [_c('progress-bar', {\n ref: \"customHeart\",\n staticClass: \"heart\",\n attrs: {\n \"type\": \"path\",\n \"path-id\": \"heart-path\",\n \"options\": _vm.customHeartOptions\n }\n }, [_c('svg', {\n attrs: {\n \"xmlns\": \"http://www.w3.org/2000/svg\",\n \"version\": \"1.1\",\n \"x\": \"0px\",\n \"y\": \"0px\",\n \"viewBox\": \"0 0 100 100\"\n },\n slot: \"svg\"\n }, [_c('path', {\n attrs: {\n \"fill-opacity\": \"0\",\n \"stroke-width\": \"1\",\n \"stroke\": \"#bbb\",\n \"d\": \"M81.495,13.923c-11.368-5.261-26.234-0.311-31.489,11.032C44.74,13.612,29.879,8.657,18.511,13.923 C6.402,19.539,0.613,33.883,10.175,50.804c6.792,12.04,18.826,21.111,39.831,37.379c20.993-16.268,33.033-25.344,39.819-37.379 C99.387,33.883,93.598,19.539,81.495,13.923z\"\n }\n }), _vm._v(\" \"), _c('path', {\n attrs: {\n \"id\": \"heart-path\",\n \"fill-opacity\": \"0\",\n \"stroke-width\": \"3\",\n \"stroke\": \"#ED6A5A\",\n \"d\": \"M81.495,13.923c-11.368-5.261-26.234-0.311-31.489,11.032C44.74,13.612,29.879,8.657,18.511,13.923 C6.402,19.539,0.613,33.883,10.175,50.804c6.792,12.04,18.826,21.111,39.831,37.379c20.993-16.268,33.033-25.344,39.819-37.379 C99.387,33.883,93.598,19.539,81.495,13.923z\"\n }\n })])])], 1), _vm._v(\" \"), _c('div', {\n slot: \"footer\"\n }, [_vm._v(\"\\n heart\\n \")])])], 1)])\n},staticRenderFns: []}\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./~/vue-loader/lib/template-compiler?{\"id\":\"data-v-19a499da\"}!./~/vue-loader/lib/selector.js?type=template&index=0!./demo/components/Examples.vue\n// module id = 27\n// module chunks = 0","module.exports={render:function (){var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;\n return _c('div', {\n attrs: {\n \"id\": \"app\"\n }\n }, [_c('router-view')], 1)\n},staticRenderFns: []}\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./~/vue-loader/lib/template-compiler?{\"id\":\"data-v-1fdc5852\"}!./~/vue-loader/lib/selector.js?type=template&index=0!./demo/App.vue\n// module id = 28\n// module chunks = 0","module.exports={render:function (){var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;\n return _c('div', [_vm._t(\"svg\")], 2)\n},staticRenderFns: []}\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./~/vue-loader/lib/template-compiler?{\"id\":\"data-v-67ac3a95\"}!./~/vue-loader/lib/selector.js?type=template&index=0!./src/Progress.vue\n// module id = 29\n// module chunks = 0","module.exports={render:function (){var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;\n return _c('div', {\n staticClass: \"card\"\n }, [_c('div', {\n staticClass: \"card-content\"\n }, [_vm._t(\"content\")], 2), _vm._v(\" \"), _c('div', {\n staticClass: \"card-footer\"\n }, [_c('div', {\n staticClass: \"text\"\n }, [_vm._t(\"footer\")], 2)])])\n},staticRenderFns: []}\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./~/vue-loader/lib/template-compiler?{\"id\":\"data-v-f707014c\"}!./~/vue-loader/lib/selector.js?type=template&index=0!./demo/components/Card.vue\n// module id = 30\n// module chunks = 0"],"sourceRoot":""} --------------------------------------------------------------------------------