{"version":3,"sources":["webpack:///./src/views/components/carousel/code.js"],"names":["codeCarouselBasic","codeCarouselCaption","codeCarouselCrossfade","codeCarouselInterval","codeVsupport","codeProgrammaticSlide","codeWrap","codePause","codeKeyboard"],"mappings":"kHAAA,2bAAO,IAAMA,EAAoB,4hBAyBpBC,EAAsB,y2CAwCtBC,EAAwB,8hBA0BxBC,EAAuB,yiBA0BvBC,EAAe,0xDAyEfC,EAAwB,qqFA8GxBC,EAAW,ujBA2BXC,EAAY,+jBA2BZC,EAAe","file":"js/chunk-2d0b3a0b.9524c999.js","sourcesContent":["export const codeCarouselBasic = `\n<template>\n  <b-carousel\n    id=\"carousel-example-generic\"\n    controls\n    indicators\n  >\n    <b-carousel-slide :img-src=\"require('@/assets/images/slider/01.jpg')\" />\n    <b-carousel-slide :img-src=\"require('@/assets/images/slider/02.jpg')\" />\n    <b-carousel-slide :img-src=\"require('@/assets/images/slider/03.jpg')\" />\n  </b-carousel>\n</template>\n\n<script>\nimport { BCarousel, BCarouselSlide } from 'bootstrap-vue'\n\nexport default {\n  components: {\n    BCarousel,\n    BCarouselSlide,\n  },\n}\n</script>\n`\n\nexport const codeCarouselCaption = `\n<template>\n  <b-carousel\n    id=\"carousel-caption\"\n    controls\n    indicators\n  >\n    <b-carousel-slide\n      caption-html=\"<span class='text-white'>First Slide Label</span>\"\n      class=\"card-img-overlay\"\n      text=\"Donut jujubes I love topping I love sweet. Jujubes I love brownie gummi bears I love donut sweet chocolate. Tart chocolate marshmallow.Tart carrot cake muffin.\"\n      :img-src=\"require('@/assets/images/slider/08.jpg')\"\n    />\n    <b-carousel-slide\n      caption-html=\"<span class='text-white'>Second Slide Label</span>\"\n      class=\"card-img-overlay\"\n      text=\"Tart macaroon marzipan I love soufflé apple pie wafer. Chocolate bar jelly caramels jujubes chocolate cake gummies. Cupcake cake I love cake danish carrot cake.\"\n      :img-src=\"require('@/assets/images/slider/09.jpg')\"\n    />\n    <b-carousel-slide\n      caption-html=\"<span class='text-white'>Third Slide Label</span>\"\n      class=\"card-img-overlay\"\n      text=\"Pudding sweet pie gummies. Chocolate bar sweet tiramisu cheesecake chocolate cotton candy pastry muffin. Marshmallow cake powder icing.\"\n      :img-src=\"require('@/assets/images/slider/10.jpg')\"\n    />\n  </b-carousel>\n</template>\n\n<script>\nimport { BCarousel, BCarouselSlide} from 'bootstrap-vue'\n\nexport default {\n  components: {\n    BCarousel,\n    BCarouselSlide,\n  },\n}\n</script>\n`\n\nexport const codeCarouselCrossfade = `\n<template>\n  <b-carousel\n    id=\"carousel-crossfade\"\n    controls\n    indicators\n    fade\n  >\n    <b-carousel-slide :img-src=\"require('@/assets/images/slider/01.jpg')\" />\n    <b-carousel-slide :img-src=\"require('@/assets/images/slider/02.jpg')\" />\n    <b-carousel-slide :img-src=\"require('@/assets/images/slider/03.jpg')\" />\n  </b-carousel>\n</template>\n\n<script>\nimport {BCarousel, BCarouselSlide} from 'bootstrap-vue'\n\nexport default {\n  components: {\n    BCarousel,\n    BCarouselSlide,\n  },\n}\n</script>\n`\n\nexport const codeCarouselInterval = `\n<template>\n  <b-carousel\n    id=\"carousel-interval\"\n    controls\n    indicators\n    :interval=\"400\"\n  >\n    <b-carousel-slide :img-src=\"require('@/assets/images/slider/01.jpg')\" />\n    <b-carousel-slide :img-src=\"require('@/assets/images/slider/02.jpg')\" />\n    <b-carousel-slide :img-src=\"require('@/assets/images/slider/03.jpg')\" />\n  </b-carousel>\n</template>\n\n<script>\nimport { BCarousel, BCarouselSlide} from 'bootstrap-vue'\n\nexport default {\n  components: {\n    BCarousel,\n    BCarouselSlide,\n  },\n}\n</script>\n`\n\nexport const codeVsupport = `\n<template>\n  <div>\n    <b-carousel\n      id=\"carousel-1\"\n      v-model=\"slide\"\n      :interval=\"4000\"\n      controls\n      indicators\n      background=\"#ababab\"\n      img-width=\"924\"\n      img-height=\"380\"\n      @sliding-start=\"onSlideStart\"\n      @sliding-end=\"onSlideEnd\"\n    >\n      <!-- Text slides with image -->\n      <b-carousel-slide\n        text=\"Nulla vitae elit libero, a pharetra augue mollis interdum.\"\n        :img-src=\"require('@/assets/images/slider/05.jpg')\"\n      />\n\n      <!-- Slides with custom text -->\n      <b-carousel-slide :img-src=\"require('@/assets/images/slider/06.jpg')\" />\n\n      <!-- Slides with image only -->\n      <b-carousel-slide :img-src=\"require('@/assets/images/slider/03.jpg')\" />\n\n      <!-- Slides with img slot -->\n      <!-- Note the classes .d-block and .img-fluid to prevent browser default image alignment -->\n      <b-carousel-slide>\n        <template #img>\n          <img\n            class=\"d-block img-fluid w-100\"\n            width=\"924\"\n            height=\"380\"\n            :src=\"require('@/assets/images/slider/04.jpg')\"\n            alt=\"image slot\"\n          >\n        </template>\n      </b-carousel-slide>\n    </b-carousel>\n\n    <b-card-text class=\"mt-1 mb-0\">\n      <strong>Slide #:</strong> {{ slide }} <strong>Sliding:</strong> {{ sliding }}\n    </b-card-text>\n  </div>\n</template>\n\n<script>\nimport { BCarousel, BCarouselSlide, BCardText } from 'bootstrap-vue'\n\nexport default {\n  components: {\n    BCarousel,\n    BCarouselSlide,\n    BCardText,\n  },\n  data: () => ({\n    slide: 0,\n    sliding: null,\n  }),\n  methods: {\n    onSlideStart() {\n      this.sliding = true\n    },\n    onSlideEnd() {\n      this.sliding = false\n    },\n  },\n}\n</script>\n`\n\nexport const codeProgrammaticSlide = `\n<template>\n  <div>\n    <b-carousel\n      id=\"carousel-1\"\n      ref=\"myCarousel\"\n      :interval=\"4000\"\n      controls\n      indicators\n      background=\"#ababab\"\n      img-width=\"924\"\n      img-height=\"380\"\n    >\n      <!-- Text slides with image -->\n      <b-carousel-slide\n        text=\"Nulla vitae elit libero, a pharetra augue mollis interdum.\"\n        :img-src=\"require('@/assets/images/slider/01.jpg')\"\n      />\n\n      <!-- Slides with custom text -->\n      <b-carousel-slide :img-src=\"require('@/assets/images/slider/02.jpg')\" />\n\n      <!-- Slides with image only -->\n      <b-carousel-slide :img-src=\"require('@/assets/images/slider/03.jpg')\" />\n\n      <!-- Slides with img slot -->\n      <!-- Note the classes .d-block and .img-fluid to prevent browser default image alignment -->\n      <b-carousel-slide>\n        <template #img>\n          <img\n            class=\"d-block img-fluid w-100\"\n            width=\"924\"\n            height=\"380\"\n            :src=\"require('@/assets/images/slider/04.jpg')\"\n            alt=\"image slot\"\n          >\n        </template>\n      </b-carousel-slide>\n    </b-carousel>\n\n    <!-- programmatically  -->\n    <div class=\"d-flex align-items-center justify-content-center mt-1\">\n      <b-button-group>\n        <b-button\n          v-ripple.400=\"'rgba(113, 102, 240, 0.15)'\"\n          variant=\"outline-primary\"\n          @click=\"prev\"\n        >\n          Pre\n        </b-button>\n        <b-button\n          v-ripple.400=\"'rgba(113, 102, 240, 0.15)'\"\n          variant=\"outline-primary\"\n          @click=\"start\"\n        >\n          {{ status ? 'Start' : 'Pause' }}\n        </b-button>\n        <b-button\n          v-ripple.400=\"'rgba(113, 102, 240, 0.15)'\"\n          variant=\"outline-primary\"\n          @click=\"next\"\n        >\n          Next\n        </b-button>\n      </b-button-group>\n    </div>\n  </div>\n</template>\n\n<script>\nimport { BCarousel, BCarouselSlide, BButtonGroup, BButton} from 'bootstrap-vue'\nimport Ripple from 'vue-ripple-directive'\n\nexport default {\n  components: {\n    BCarousel,\n    BCarouselSlide,\n    BButtonGroup,\n    BButton,\n  },\n  directives: {\n    Ripple,\n  },\n  data: () => ({\n    status: false,\n  }),\n  methods: {\n    prev() {\n      if (!this.status) {\n        this.$refs.myCarousel.prev()\n      }\n    },\n    next() {\n      if (!this.status) {\n        this.$refs.myCarousel.next()\n      }\n    },\n    start() {\n      this.status = !this.status\n      if (this.status) {\n        this.$refs.myCarousel.pause()\n      } else {\n        this.$refs.myCarousel.start()\n      }\n    },\n  },\n}\n</script>\n`\n\nexport const codeWrap = `\n<template>\n  <b-carousel\n    id=\"carousel-interval\"\n    no-wrap\n    controls\n    indicators\n    :interval=\"400\"\n  >\n    <b-carousel-slide :img-src=\"require('@/assets/images/slider/01.jpg')\" />\n    <b-carousel-slide :img-src=\"require('@/assets/images/slider/02.jpg')\" />\n    <b-carousel-slide :img-src=\"require('@/assets/images/slider/04.jpg')\" />\n  </b-carousel>\n</template>\n\n<script>\nimport { BCarousel, BCarouselSlide } from 'bootstrap-vue'\n\nexport default {\n  components: {\n    BCarousel,\n    BCarouselSlide,\n  },\n}\n</script>\n`\n\nexport const codePause = `\n<template>\n  <b-carousel\n    id=\"carousel-interval\"\n    no-hover-pause\n    controls\n    indicators\n    :interval=\"5000\"\n  >\n    <b-carousel-slide :img-src=\"require('@/assets/images/slider/04.jpg')\" />\n    <b-carousel-slide :img-src=\"require('@/assets/images/slider/05.jpg')\" />\n    <b-carousel-slide :img-src=\"require('@/assets/images/slider/06.jpg')\" />\n  </b-carousel>\n</template>\n\n<script>\nimport { BCarousel, BCarouselSlide } from 'bootstrap-vue'\n\nexport default {\n  components: {\n    BCarousel,\n    BCarouselSlide,\n  },\n}\n</script>\n`\n\nexport const codeKeyboard = `\n<template>\n  <b-carousel\n    id=\"carousel-interval\"\n    controls\n    indicators\n    :interval=\"400\"\n  >\n    <b-carousel-slide :img-src=\"require('@/assets/images/slider/07.jpg')\" />\n    <b-carousel-slide :img-src=\"require('@/assets/images/slider/08.jpg')\" />\n    <b-carousel-slide :img-src=\"require('@/assets/images/slider/09.jpg')\" />\n  </b-carousel>\n</template>\n\n<script>\nimport { BCarousel, BCarouselSlide } from 'bootstrap-vue'\n\nexport default {\n  components: {\n    BCarousel,\n    BCarouselSlide,\n  },\n}\n</script>\n`\n"],"sourceRoot":""}