{"version":3,"sources":["webpack:///./src/views/components/progress/code.js"],"names":["codeBasic","codeAnimated","codeLabel","codeMultipleBar","codeSize","codeStripped","codeCustomLabel","codeCustomSize","codeColored"],"mappings":"gHAAA,yZAAO,IAAMA,EAAY,68CAyEZC,EAAe,4pCA2DfC,EAAY,svCAsEZC,EAAkB,inBAuClBC,EAAW,ssBA4CXC,EAAe,qkCAiEfC,EAAkB,4uCA8DlBC,EAAiB,ynBA0CjBC,EAAc","file":"js/chunk-2d2380c1.0d6dd838.js","sourcesContent":["export const codeBasic = `\n<template>\n  <div class=\"demo-vertical-spacing\">\n    <div class=\"progress-wrapper\">\n      <b-card-text class=\"mb-0\">\n        Reticulating splines… {{ value+'%' }}\n      </b-card-text>\n      <b-progress\n        v-model=\"value\"\n        max=\"100\"\n      />\n    </div>\n    <div class=\"progress-wrapper\">\n      <b-card-text class=\"mb-0\">\n        Reticulating splines… {{ value1+'%' }}\n      </b-card-text>\n      <b-progress\n        v-model=\"value1\"\n        max=\"100\"\n      />\n    </div>\n    <div class=\"progress-wrapper\">\n      <b-card-text class=\"mb-0\">\n        Reticulating splines… {{ value2+'%' }}\n      </b-card-text>\n      <b-progress\n        v-model=\"value2\"\n        max=\"100\"\n      />\n    </div>\n\n    <div class=\"progress-wrapper\">\n      <b-card-text class=\"mb-0\">\n        Reticulating splines… {{ value3+'%' }}\n      </b-card-text>\n      <b-progress\n        v-model=\"value3\"\n        max=\"100\"\n      />\n    </div>\n\n    <div class=\"progress-wrapper\">\n      <b-card-text class=\"mb-0\">\n        Reticulating splines… {{ value4+'%' }}\n      </b-card-text>\n      <b-progress\n        v-model=\"value4\"\n        max=\"100\"\n      />\n    </div>\n  </div>\n</template>\n\n<script>\nimport { BProgress } from 'bootstrap-vue'\n\nexport default {\n  components: {\n    BProgress,\n  },\n  data() {\n    return {\n      value: 0,\n      value1: 25,\n      value2: 50,\n      value3: 75,\n      value4: 100,\n    }\n  },\n}\n</script>\n`\n\nexport const codeAnimated = `\n<template>\n  <b-row\n    v-for=\"bar in bars\"\n    :key=\"bar.variant\"\n  >\n    <b-col\n      md=\"2\"\n      class=\"pt-2\"\n    >\n      {{ bar.variant }}:\n    </b-col>\n    <b-col\n      md=\"10\"\n      class=\"pt-md-2\"\n    >\n      <b-progress\n        :key=\"bar.variant\"\n        animated\n        :value=\"bar.value\"\n        :variant=\"bar.variant\"\n        :class=\"'progress-bar-'+bar.variant\"\n      />\n    </b-col>\n  </b-row>\n</template>\n\n<script>\nimport {BProgress, BRow, BCol} from 'bootstrap-vue'\n\nexport default {\n  components: {\n    BProgress,\n  },\n  data: () => ({\n    bars: [\n      { variant: 'success', value: 75 },\n      { variant: 'info', value: 75 },\n      { variant: 'warning', value: 75 },\n      { variant: 'danger', value: 75 },\n      { variant: 'primary', value: 75 },\n      { variant: 'secondary', value: 75 },\n    ],\n    timer: null,\n  }),\n  mounted() {\n    this.timer = setInterval(() => {\n      // eslint-disable-next-line\n      this.bars.forEach(bar => (bar.value = 25 + Math.random() * 75))\n    }, 2000)\n  },\n  beforeDestroy() {\n    clearInterval(this.timer)\n    this.timer = null\n  },\n}\n</script>\n`\n\nexport const codeLabel = `\n<template>\n  <div class=\"demo-vertical-spacing\">\n    <div>\n      <label>No label</label>\n      <b-progress\n        value=\"25\"\n        max=\"100\"\n      />\n    </div>\n\n    <div>\n      <label>Value label</label>\n      <b-progress\n        value=\"35\"\n        max=\"100\"\n        show-value\n        variant=\"secondary\"\n        class=\"progress-bar-secondary\"\n      />\n    </div>\n\n    <div>\n      <label>Progress label</label>\n      <b-progress\n        value=\"45\"\n        max=\"100\"\n        show-progress\n        variant=\"success\"\n        class=\"progress-bar-success\"\n      />\n    </div>\n\n    <div>\n      <label>Value label with precision</label>\n      <b-progress\n        value=\"55\"\n        max=\"100\"\n        precision=\"2\"\n        show-value\n        variant=\"danger\"\n        class=\"progress-bar-danger\"\n      />\n    </div>\n\n    <div>\n      <label>Progress label with precision</label>\n      <b-progress\n        value=\"65\"\n        max=\"100\"\n        precision=\"2\"\n        show-progress\n        variant=\"warning\"\n        class=\"progress-bar-warning\"\n      />\n    </div>\n  </div>\n</template>\n\n<script>\nimport { BProgress } from 'bootstrap-vue'\n\nexport default {\n  components: {\n    BProgress,\n  },\n}\n</script>\n`\n\nexport const codeMultipleBar = `\n<template>\n  <b-progress :max=\"max\">\n    <b-progress-bar\n      variant=\"danger\"\n      :value=\"values[0]\"\n      show-progress\n    />\n    <b-progress-bar\n      variant=\"warning\"\n      :value=\"values[1]\"\n      show-progress\n    />\n    <b-progress-bar\n      variant=\"primary\"\n      :value=\"values[2]\"\n      show-progress\n    />\n  </b-progress>\n</template>\n\n<script>\nimport { BProgressBar, BProgress } from 'bootstrap-vue'\n\nexport default {\n  components: {\n    BProgressBar,\n    BProgress,\n  },\n  data() {\n    return {\n      values: [15, 50, 10],\n      max: 100,\n    }\n  },\n}\n</script>\n`\n\nexport const codeSize = `\n<template>\n  <div>\n    <b-progress\n      value=\"65\"\n      variant=\"primary\"\n      class=\"progress-xl mb-2\"\n    />\n    <b-progress\n      value=\"65\"\n      variant=\"success\"\n      class=\"progress-lg mb-2\"\n    />\n    <b-progress\n      value=\"65\"\n      variant=\"danger\"\n      class=\"progress-md mb-2\"\n    />\n    <b-progress\n      value=\"65\"\n      variant=\"info\"\n      class=\"progress-sm mb-2\"\n    />\n    <h6>Custom heights</h6>\n    <b-progress\n      height=\"1rem\"\n      value=\"55\"\n      show-progress\n      class=\"mb-0\"\n    />\n  </div>\n</template>\n\n<script>\nimport { BProgress } from 'bootstrap-vue'\n\nexport default {\n  components: {\n    BProgress,\n  },\n}\n</script>\n`\n\nexport const codeStripped = `\n<template>\n  <div class=\"demo-vertical-spacing\">\n    <b-progress\n      value=\"25\"\n      max=\"100\"\n      striped\n    />\n    <b-progress\n      value=\"35\"\n      max=\"100\"\n      striped\n      class=\"progress-bar-secondary\"\n      variant=\"secondary\"\n    />\n    <b-progress\n      value=\"45\"\n      max=\"100\"\n      striped\n      variant=\"success\"\n      class=\"progress-bar-success\"\n    />\n    <b-progress\n      value=\"55\"\n      max=\"100\"\n      striped\n      variant=\"danger\"\n      class=\"progress-bar-danger\"\n    />\n    <b-progress\n      value=\"65\"\n      max=\"100\"\n      striped\n      variant=\"warning\"\n      class=\"progress-bar-warning\"\n    />\n    <b-progress\n      value=\"75\"\n      max=\"100\"\n      striped\n      variant=\"info\"\n      class=\"progress-bar-info\"\n    />\n    <b-progress\n      value=\"85\"\n      max=\"100\"\n      striped\n      variant=\"dark\"\n      class=\"progress-bar-dark\"\n    />\n  </div>\n</template>\n\n<script>\nimport { BProgress } from 'bootstrap-vue'\n\nexport default {\n  components: {\n    BProgress,\n  },\n}\n</script>\n\n`\n\nexport const codeCustomLabel = `\n<template>\n  <div class=\"demo-vertical-spacing\">\n    <div>\n      <label>Custom label via default slot</label>\n      <b-progress\n        :max=\"max\"\n      >\n        <b-progress-bar :value=\"value\">\n          <strong>{{ value.toFixed(2) }} / {{ max }}</strong>\n        </b-progress-bar>\n      </b-progress>\n    </div>\n\n    <div>\n      <label>Custom label via property</label>\n      <b-progress\n        :max=\"max\"\n        class=\"progress-bar-info\"\n      >\n        <b-progress-bar\n          :value=\"value\"\n          :label=\"\\`\\${((value / max) * 100).toFixed(2)}%\\`\"\n          variant=\"info\"\n        />\n      </b-progress>\n    </div>\n\n    <div>\n      <label>Custom label via property (HTML support)</label>\n      <b-progress\n        :max=\"max\"\n        class=\"progress-bar-warning\"\n      >\n        <b-progress-bar\n          :value=\"value\"\n          :label-html=\"\\`<del>\\${value}</del>\\`\"\n          variant=\"warning\"\n        />\n      </b-progress>\n    </div>\n  </div>\n</template>\n\n<script>\nimport { BProgress, BProgressBar } from 'bootstrap-vue'\n\nexport default {\n  components: {\n    BProgress,\n    BProgressBar,\n  },\n  data() {\n    return {\n      value: 33.333333333,\n      max: 50,\n    }\n  },\n}\n</script>\n`\n\nexport const codeCustomSize = `\n<template>\n  <div>\n    <h6>Default width</h6>\n    <b-progress\n      :value=\"value\"\n      class=\"mb-3\"\n    />\n\n    <h6>Custom widths</h6>\n    <b-progress\n      :value=\"value\"\n      class=\"w-75 mb-2\"\n      variant=\"info\"\n    />\n    <b-progress\n      :value=\"value\"\n      variant=\"warning\"\n      class=\"w-50 mb-2\"\n    />\n    <b-progress\n      :value=\"value\"\n      class=\"w-25 mb-0\"\n      variant=\"danger\"\n    />\n  </div>\n</template>\n\n<script>\nimport { BProgress } from 'bootstrap-vue'\n\nexport default {\n  components: {\n    BProgress,\n  },\n  data: () => ({\n    value: 75,\n  }),\n}\n</script>\n`\n\nexport const codeColored = `\n<template>\n  <div class=\"demo-vertical-spacing\">\n    <b-progress\n      value=\"25\"\n      max=\"100\"\n    />\n    <b-progress\n      value=\"35\"\n      max=\"100\"\n      class=\"progress-bar-secondary\"\n      variant=\"secondary\"\n    />\n    <b-progress\n      value=\"45\"\n      max=\"100\"\n      class=\"progress-bar-success\"\n      variant=\"success\"\n    />\n    <b-progress\n      value=\"55\"\n      max=\"100\"\n      class=\"progress-bar-danger\"\n      variant=\"danger\"\n    />\n    <b-progress\n      value=\"65\"\n      max=\"100\"\n      class=\"progress-bar-warning\"\n      variant=\"warning\"\n    />\n    <b-progress\n      value=\"75\"\n      max=\"100\"\n      class=\"progress-bar-info\"\n      variant=\"info\"\n    />\n    <b-progress\n      value=\"85\"\n      max=\"100\"\n      class=\"progress-bar-dark\"\n      variant=\"dark\"\n    />\n  </div>\n</template>\n\n<script>\nimport { BProgress } from 'bootstrap-vue'\n\nexport default {\n  components: {\n    BProgress,\n  },\n}\n</script>\n`\n"],"sourceRoot":""}