{"version":3,"sources":["webpack:///./src/@core/components/b-card-code/index.js","webpack:///./src/views/components/overlay/Overlay.vue?095e","webpack:///./src/views/components/overlay/Overlay.vue?200c","webpack:///./src/views/components/overlay/OverlayBasic.vue?a0a8","webpack:///./src/views/components/overlay/code.js","webpack:///src/views/components/overlay/OverlayBasic.vue","webpack:///./src/views/components/overlay/OverlayBasic.vue?ba30","webpack:///./src/views/components/overlay/OverlayBasic.vue","webpack:///./src/views/components/overlay/OverlayBackdrop.vue?c67c","webpack:///src/views/components/overlay/OverlayBackdrop.vue","webpack:///./src/views/components/overlay/OverlayBackdrop.vue?4db4","webpack:///./src/views/components/overlay/OverlayBackdrop.vue","webpack:///./src/views/components/overlay/OverlayFade.vue?1ebc","webpack:///src/views/components/overlay/OverlayFade.vue","webpack:///./src/views/components/overlay/OverlayFade.vue?60e2","webpack:///./src/views/components/overlay/OverlayFade.vue","webpack:///./src/views/components/overlay/OverlaySpinner.vue?0beb","webpack:///src/views/components/overlay/OverlaySpinner.vue","webpack:///./src/views/components/overlay/OverlaySpinner.vue?17cf","webpack:///./src/views/components/overlay/OverlaySpinner.vue","webpack:///./src/views/components/overlay/OverlayCornerRound.vue?40b6","webpack:///src/views/components/overlay/OverlayCornerRound.vue","webpack:///./src/views/components/overlay/OverlayCornerRound.vue?59f6","webpack:///./src/views/components/overlay/OverlayCornerRound.vue","webpack:///./src/views/components/overlay/OverlayCustomContent.vue?bb4c","webpack:///src/views/components/overlay/OverlayCustomContent.vue","webpack:///./src/views/components/overlay/OverlayCustomContent.vue?1f87","webpack:///./src/views/components/overlay/OverlayCustomContent.vue","webpack:///./src/views/components/overlay/OverlayNoWrapMode.vue?d783","webpack:///src/views/components/overlay/OverlayNoWrapMode.vue","webpack:///./src/views/components/overlay/OverlayNoWrapMode.vue?92d5","webpack:///./src/views/components/overlay/OverlayNoWrapMode.vue","webpack:///./src/views/components/overlay/OverlayForm.vue?6b01","webpack:///src/views/components/overlay/OverlayForm.vue","webpack:///./src/views/components/overlay/OverlayForm.vue?1069","webpack:///./src/views/components/overlay/OverlayForm.vue","webpack:///./src/views/components/overlay/OverlayBusyState.vue?da3e","webpack:///src/views/components/overlay/OverlayBusyState.vue","webpack:///./src/views/components/overlay/OverlayBusyState.vue?a346","webpack:///./src/views/components/overlay/OverlayBusyState.vue","webpack:///src/views/components/overlay/Overlay.vue","webpack:///./src/views/components/overlay/Overlay.vue?aef7","webpack:///./src/views/components/overlay/Overlay.vue"],"names":["BCardCode","render","_vm","this","_h","$createElement","_c","_self","attrs","staticRenderFns","scopedSlots","_u","key","fn","_v","_s","codeBasic","proxy","show","directives","name","rawName","value","expression","modifiers","on","$event","staticClass","codeBackdrop","codeFade","codeSpinner","codeCornerRounded","codeCustomContent","codeNoWrapMode","codeForm","codeBusyState","components","BOverlay","BButton","BCardText","Ripple","data","component","variants","model","callback","$$v","variant","opacity","toFixed","blurs","blur","BRow","BCol","BFormGroup","BFormSelect","BFormInput","BInputGroupAppend","BCard","BInputGroup","text","BImg","onShown","onHidden","ref","methods","$refs","cancel","focus","preventDefault","onSubmit","busy","counter","onCancel","onOK","BForm","BProgress","BInputGroupPrepend","BFormFile","processing","interval","beforeDestroy","clearInterval","dialog","submit","setInterval","$nextTick","onClick","BSpinner","timeout","clearTimeout","setTimeout","button","OverlayBasic","OverlayBackdrop","OverlayFade","OverlaySpinner","OverlayCornerRound","OverlayCustomContent","OverlayNoWrapMode","OverlayForm","OverlayBusyState"],"mappings":"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","file":"js/chunk-7db4717a.b182ab98.js","sourcesContent":["import BCardCode from './BCardCode.vue'\r\n\r\nexport default BCardCode\r\n","export * from \"-!../../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--9-oneOf-1-0!../../../../node_modules/css-loader/dist/cjs.js??ref--9-oneOf-1-1!../../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../../node_modules/postcss-loader/src/index.js??ref--9-oneOf-1-2!../../../../node_modules/sass-loader/dist/cjs.js??ref--9-oneOf-1-3!../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Overlay.vue?vue&type=style&index=0&id=813c9d1e&prod&lang=scss&scoped=true&\"","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('b-row',[_c('b-col',{attrs:{\"cols\":\"12\"}},[_c('overlay-basic'),_c('overlay-backdrop'),_c('overlay-fade'),_c('overlay-spinner'),_c('overlay-corner-round'),_c('overlay-custom-content'),_c('overlay-no-wrap-mode'),_c('overlay-form'),_c('overlay-busy-state')],1)],1)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('b-card-code',{attrs:{\"title\":\"Card with overlay\"},scopedSlots:_vm._u([{key:\"code\",fn:function(){return [_vm._v(\" \"+_vm._s(_vm.codeBasic)+\" \")]},proxy:true}])},[_c('b-overlay',{attrs:{\"show\":_vm.show,\"rounded\":\"sm\"}},[_c('div',[_c('b-card-text',[_c('span',[_vm._v(\"BootstrapVue's custom \")]),_c('code',[_vm._v(\"b-overlay\")]),_c('span',[_vm._v(\" component is used to visually obscure a particular element or component and its content. It signals to the user of a state change within the element or component and can be used for creating loaders, warnings/alerts, prompts, and more. \")])]),_c('b-button',{directives:[{name:\"ripple\",rawName:\"v-ripple.400\",value:('rgba(113, 102, 240, 0.15)'),expression:\"'rgba(113, 102, 240, 0.15)'\",modifiers:{\"400\":true}}],attrs:{\"disabled\":_vm.show,\"variant\":\"outline-primary\"},on:{\"click\":function($event){_vm.show = true}}},[_vm._v(\" Show overlay \")])],1)]),_c('b-button',{directives:[{name:\"ripple\",rawName:\"v-ripple.400\",value:('rgba(255, 255, 255, 0.15)'),expression:\"'rgba(255, 255, 255, 0.15)'\",modifiers:{\"400\":true}}],staticClass:\"mt-1\",attrs:{\"variant\":\"primary\"},on:{\"click\":function($event){_vm.show = !_vm.show}}},[_vm._v(\" Toggle overlay \")])],1)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","export const codeBasic = `\r\n<template>\r\n  <div>\r\n    <b-overlay\r\n      :show=\"show\"\r\n      rounded=\"sm\"\r\n    >\r\n      <div>\r\n        <b-card-text>\r\n          <span>BootstrapVue's custom </span>\r\n          <code>b-overlay</code>\r\n          <span>\r\n            component is used to visually obscure a particular element or component and its content. It signals to the\r\n            user of a state change within the element or component and can be used for creating loaders,\r\n            warnings/alerts, prompts, and more.\r\n          </span>\r\n        </b-card-text>\r\n\r\n        <b-button\r\n          v-ripple.400=\"'rgba(113, 102, 240, 0.15)'\"\r\n          :disabled=\"show\"\r\n          variant=\"outline-primary\"\r\n          @click=\"show = true\"\r\n        >\r\n          Show overlay\r\n        </b-button>\r\n      </div>\r\n    </b-overlay>\r\n\r\n    <b-button\r\n      v-ripple.400=\"'rgba(255, 255, 255, 0.15)'\"\r\n      variant=\"primary\"\r\n      class=\"mt-1\"\r\n      @click=\"show = !show\"\r\n    >\r\n      Toggle overlay\r\n    </b-button>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport { BOverlay, BButton, BCardText } from 'bootstrap-vue'\r\nimport Ripple from 'vue-ripple-directive'\r\n\r\nexport default {\r\n  components: {\r\n    BOverlay,\r\n    BButton,\r\n    BCardText,\r\n  },\r\n  directives: {\r\n    Ripple,\r\n  },\r\n  data: () => ({\r\n    show: false,\r\n  }),\r\n}\r\n</script>\r\n`\r\n\r\nexport const codeBackdrop = `\r\n<template>\r\n  <b-row>\r\n    <b-col\r\n      lg=\"6\"\r\n      aria-controls=\"overlay-background\"\r\n    >\r\n      <b-form-group\r\n        label=\"Variant\"\r\n        label-for=\"bg-variant\"\r\n        label-cols-sm=\"4\"\r\n        label-cols-lg=\"12\"\r\n      >\r\n        <b-form-select\r\n          id=\"bg-variant\"\r\n          v-model=\"variant\"\r\n          :options=\"variants\"\r\n        />\r\n      </b-form-group>\r\n      <b-form-group\r\n        label=\"Opacity\"\r\n        label-for=\"bg-opacity\"\r\n        label-cols-sm=\"4\"\r\n        label-cols-lg=\"12\"\r\n      >\r\n        <b-input-group>\r\n          <b-form-input\r\n            id=\"bg-opacity\"\r\n            v-model=\"opacity\"\r\n            type=\"range\"\r\n            number\r\n            min=\"0\"\r\n            max=\"1\"\r\n            step=\"0.01\"\r\n          />\r\n          <b-input-group-append\r\n            is-text\r\n            class=\"text-monospace\"\r\n          >\r\n            {{ opacity.toFixed(2) }}\r\n          </b-input-group-append>\r\n        </b-input-group>\r\n      </b-form-group>\r\n      <b-form-group\r\n        label=\"Blur\"\r\n        label-for=\"bg-blur\"\r\n        label-cols-sm=\"4\"\r\n        label-cols-lg=\"12\"\r\n        class=\"mb-2 mb-lg-0\"\r\n      >\r\n        <b-form-select\r\n          id=\"bg-blur\"\r\n          v-model=\"blur\"\r\n          :options=\"blurs\"\r\n        />\r\n      </b-form-group>\r\n    </b-col>\r\n    <b-col lg=\"6\">\r\n      <b-overlay\r\n        id=\"overlay-background\"\r\n        show\r\n        :variant=\"variant\"\r\n        :opacity=\"opacity\"\r\n        :blur=\"blur\"\r\n        rounded=\"sm\"\r\n      >\r\n        <b-card\r\n          title=\"Card with overlay\"\r\n          aria-hidden=\"true\"\r\n          class=\"mb-0\"\r\n        >\r\n          <b-card-text>\r\n            Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et\r\n            dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip\r\n            ex ea commodo consequat.\r\n          </b-card-text>\r\n          <b-button\r\n            v-ripple.400=\"'rgba(255, 255, 255, 0.15)'\"\r\n            disabled\r\n            variant=\"primary\"\r\n          >\r\n            Button\r\n          </b-button>\r\n        </b-card>\r\n      </b-overlay>\r\n    </b-col>\r\n  </b-row>\r\n</template>\r\n\r\n<script>\r\n  import {\r\n    BRow,\r\n    BCol,\r\n    BFormGroup,\r\n    BFormSelect,\r\n    BFormInput,\r\n    BInputGroupAppend,\r\n    BCard,\r\n    BOverlay,\r\n    BButton,\r\n    BInputGroup,\r\n  } from 'bootstrap-vue'\r\nimport Ripple from 'vue-ripple-directive'\r\n\r\n  export default {\r\n    components: {\r\n      BRow,\r\n      BCol,\r\n      BFormGroup,\r\n      BFormSelect,\r\n      BFormInput,\r\n      BInputGroupAppend,\r\n      BCard,\r\n      BOverlay,\r\n      BButton,\r\n      BCardText,\r\n      BInputGroup,\r\n    },\r\n    directives: {\r\n    Ripple,\r\n  },\r\n    data: () => ({\r\n      variant: 'light',\r\n      opacity: 0.85,\r\n      blur: '2px',\r\n      variants: ['transparent', 'white', 'light', 'dark', 'primary', 'secondary', 'success', 'danger', 'warning', 'info'],\r\n      blurs: [{ text: 'None', value: '' }, '1px', '2px', '5px', '0.5em', '1rem'],\r\n    }),\r\n  }\r\n</script>\r\n`\r\n\r\nexport const codeFade = `\r\n<template>\r\n  <div>\r\n    <b-overlay\r\n      :show=\"show\"\r\n      rounded=\"sm\"\r\n      no-fade\r\n    >\r\n      <div\r\n        title=\"Card with overlay\"\r\n        :aria-hidden=\"show ? 'true' : null\"\r\n      >\r\n        <b-card-text>\r\n          Lorem ipsum dolor sit amet, consectetur adipisicing elit. Distinctio voluptatibus doloremque dolor nesciunt\r\n          est nobis consequuntur maxime ea ipsam? Doloribus quidem doloremque ad laudantium ullam eos, consequuntur\r\n          velit quas vero.\r\n        </b-card-text>\r\n\r\n        <b-button\r\n          v-ripple.400=\"'rgba(113, 102, 240, 0.15)'\"\r\n          :disabled=\"show\"\r\n          variant=\"outline-primary\"\r\n          @click=\"show = true\"\r\n        >\r\n          Show overlay\r\n        </b-button>\r\n      </div>\r\n    </b-overlay>\r\n\r\n    <!-- trigger button -->\r\n    <b-button\r\n      v-ripple.400=\"'rgba(255, 255, 255, 0.15)'\"\r\n      variant=\"primary\"\r\n      class=\"mt-1\"\r\n      @click=\"show = !show\"\r\n    >\r\n      Toggle overlay\r\n    </b-button>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport { BOverlay, BButton, BCardText } from 'bootstrap-vue'\r\nimport Ripple from 'vue-ripple-directive'\r\n\r\n  export default {\r\n    components: {\r\n      BOverlay,\r\n      BButton,\r\n      BCardText,\r\n    },\r\n    directives: {\r\n    Ripple,\r\n  },\r\n    data: () => ({\r\n      show: false,\r\n    }),\r\n  }\r\n</script>\r\n`\r\n\r\nexport const codeSpinner = `\r\n<template>\r\n  <b-overlay\r\n    show\r\n    spinner-variant=\"primary\"\r\n    spinner-type=\"grow\"\r\n    spinner-small\r\n    rounded=\"sm\"\r\n  >\r\n    <b-card\r\n      title=\"Card with spinner style\"\r\n      aria-hidden=\"true\"\r\n      class=\"mb-0\"\r\n    >\r\n      <b-card-text>\r\n        Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et\r\n        dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex\r\n        ea commodo consequat.\r\n      </b-card-text>\r\n      <b-button\r\n        v-ripple.400=\"'rgba(255, 255, 255, 0.15)'\"\r\n        disabled\r\n        variant=\"primary\"\r\n      >\r\n        Button\r\n      </b-button>\r\n    </b-card>\r\n  </b-overlay>\r\n</template>\r\n\r\n<script>\r\nimport { BOverlay, BButton, BCard, BCardText} from 'bootstrap-vue'\r\nimport Ripple from 'vue-ripple-directive'\r\n\r\nexport default {\r\n  components: {\r\n    BOverlay,\r\n    BButton,\r\n    BCard,\r\n    BCardText,\r\n  },\r\n  directives: {\r\n    Ripple,\r\n  },\r\n}\r\n</script>\r\n`\r\n\r\nexport const codeCornerRounded = `\r\n<template>\r\n  <div>\r\n    <b-button\r\n      v-ripple.400=\"'rgba(255, 255, 255, 0.15)'\"\r\n      variant=\"primary\"\r\n      @click=\"show = !show\"\r\n    >\r\n      Toggle overlay\r\n    </b-button>\r\n\r\n    <b-row class=\"text-center mt-2\">\r\n      <b-col md=\"6\">\r\n        <b-card-text>With rounding</b-card-text>\r\n        <b-overlay\r\n          :show=\"show\"\r\n          class=\"d-inline-block\"\r\n          rounded=\"circle\"\r\n        >\r\n          <b-img\r\n            rounded=\"circle\"\r\n            height=\"300\"\r\n            :src=\"require('@/assets/images/banner/banner-27.jpg')\"\r\n            alt=\"Image 1\"\r\n          />\r\n        </b-overlay>\r\n      </b-col>\r\n      <b-col\r\n        md=\"6\"\r\n        class=\"mt-1 mt-md-0\"\r\n      >\r\n        <b-card-text>Without rounding</b-card-text>\r\n        <b-overlay\r\n          :show=\"show\"\r\n          class=\"d-inline-block\"\r\n        >\r\n          <b-img\r\n            rounded=\"circle\"\r\n            height=\"300\"\r\n            :src=\"require('@/assets/images/banner/banner-27.jpg')\"\r\n            alt=\"Image 1\"\r\n          />\r\n        </b-overlay>\r\n      </b-col>\r\n    </b-row>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport {BOverlay, BButton, BImg, BRow, BCol, BCardText} from 'bootstrap-vue'\r\nimport Ripple from 'vue-ripple-directive'\r\n\r\nexport default {\r\n  components: {\r\n    BOverlay,\r\n    BButton,\r\n    BCardText,\r\n    // eslint-disable-next-line vue/no-unused-components\r\n    BImg,\r\n    BRow,\r\n    BCol,\r\n  },\r\n  directives: {\r\n    Ripple,\r\n  },\r\n  data: () => ({\r\n    show: false,\r\n  }),\r\n}\r\n</script>\r\n`\r\n\r\nexport const codeCustomContent = `\r\n<template>\r\n  <div>\r\n    <b-overlay :show=\"show\" rounded=\"sm\" @shown=\"onShown\" @hidden=\"onHidden\">\r\n    <div>\r\n      <h6>Card with custom overlay content</h6>\r\n      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>\r\n      <p>Click the button to toggle the overlay:</p>\r\n      <b-button v-ripple.400=\"'rgba(255, 255, 255, 0.15)'\" ref=\"show\" :disabled=\"show\" variant=\"primary\" @click=\"show = true\">\r\n        Show overlay\r\n      </b-button>\r\n    </div>\r\n    <template #overlay>\r\n      <div class=\"text-center\">\r\n        <b-icon icon=\"stopwatch\" font-scale=\"3\" animation=\"cylon\" />\r\n        <p id=\"cancel-label\">\r\n          Please wait...\r\n        </p>\r\n      <b-button\r\n          ref=\"cancel\"\r\n          v-ripple.400=\"'rgba(255, 255, 255, 0.15)'\"\r\n          variant=\"outline-danger\"\r\n          size=\"sm\"\r\n          aria-describedby=\"cancel-label\"\r\n          @click=\"show = false\"\r\n        >\r\n          Cancel\r\n      </b-button>\r\n    </template>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport { BOverlay, BButton } from 'bootstrap-vue'\r\nimport Ripple from 'vue-ripple-directive'\r\n\r\nexport default {\r\n  components: {\r\n    BOverlay,\r\n    BButton,\r\n  },\r\n  directives: {\r\n    Ripple,\r\n  },\r\n  data: () => ({\r\n    show: false,\r\n  }),\r\n  methods: {\r\n    onShown() {\r\n      // Focus the cancel button when the overlay is showing\r\n      this.$refs.cancel.focus()\r\n    },\r\n    onHidden() {\r\n      // Focus the show button when the overlay is removed\r\n      this.$refs.show.focus()\r\n    },\r\n  },\r\n}\r\n</script>\r\n`\r\n\r\nexport const codeNoWrapMode = `\r\n<template>\r\n <div>\r\n    <div class=\"position-relative p-2 bg-info\">\r\n      <b-card-text class=\"text-white font-weight-bold\">\r\n        Lorem ipsum dolor sit amet, consectetur adipiscing elit.\r\n      </b-card-text>\r\n      <b-card\r\n        title=\"Card with parent overlay\"\r\n        class=\"mb-1\"\r\n      >\r\n        <b-card-text>Laborum consequat non elit enim exercitation cillum.</b-card-text>\r\n        <b-card-text>Click the button to toggle the overlay:</b-card-text>\r\n        <b-button\r\n          v-ripple.400=\"'rgba(113, 102, 240, 0.15)'\"\r\n          :disabled=\"show\"\r\n          variant=\"outline-primary\"\r\n          @click=\"show = true\"\r\n        >\r\n          Show overlay\r\n        </b-button>\r\n      </b-card>\r\n      <b-card-text class=\"text-white font-weight-bold mb-0\">\r\n        Lorem ipsum dolor sit amet, consectetur adipiscing elit.\r\n      </b-card-text>\r\n      <b-overlay\r\n        :show=\"show\"\r\n        no-wrap\r\n      />\r\n    </div>\r\n    <b-button\r\n      v-ripple.400=\"'rgba(255, 255, 255, 0.15)'\"\r\n      class=\"mt-3\"\r\n      variant=\"primary\"\r\n      @click=\"show = !show\"\r\n    >\r\n      Toggle overlay\r\n    </b-button>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport { BOverlay, BButton, BCard, BCardText } from 'bootstrap-vue'\r\nimport Ripple from 'vue-ripple-directive'\r\n\r\nexport default {\r\n  components: {\r\n    BOverlay,\r\n    BButton,\r\n    BCard,\r\n    BCardText,\r\n  },\r\n   directives: {\r\n    Ripple,\r\n  },\r\n  data: () => ({\r\n    show: false,\r\n  }),\r\n}\r\n</script>\r\n`\r\n\r\nexport const codeForm = `\r\n<template>\r\n  <div>\r\n    <b-form\r\n      class=\"position-relative\"\r\n      @submit.prevent=\"onSubmit\"\r\n    >\r\n      <b-form-group\r\n        label=\"Name\"\r\n        label-for=\"form-name\"\r\n        label-cols-lg=\"2\"\r\n      >\r\n        <b-input-group>\r\n          <b-input-group-prepend is-text>\r\n            <b-icon icon=\"person-fill\" />\r\n          </b-input-group-prepend>\r\n          <b-form-input\r\n            id=\"form-name\"\r\n            :disabled=\"busy\"\r\n          />\r\n        </b-input-group>\r\n      </b-form-group>\r\n      <b-form-group\r\n        label=\"Email\"\r\n        label-for=\"form-mail\"\r\n        label-cols-lg=\"2\"\r\n      >\r\n        <b-input-group>\r\n          <b-input-group-prepend is-text>\r\n            <b-icon icon=\"envelope-fill\" />\r\n          </b-input-group-prepend>\r\n          <b-form-input\r\n            id=\"form-email\"\r\n            type=\"email\"\r\n            :disabled=\"busy\"\r\n          />\r\n        </b-input-group>\r\n      </b-form-group>\r\n      <b-form-group\r\n        label=\"Image\"\r\n        label-for=\"form-image\"\r\n        label-cols-lg=\"2\"\r\n      >\r\n        <b-input-group>\r\n          <b-input-group-prepend is-text>\r\n            <b-icon icon=\"image-fill\" />\r\n          </b-input-group-prepend>\r\n          <b-form-file\r\n            id=\"form-image\"\r\n            :disabled=\"busy\"\r\n            accept=\"image/*\"\r\n          />\r\n        </b-input-group>\r\n      </b-form-group>\r\n      <div class=\"d-flex justify-content-center\">\r\n        <b-button\r\n          v-ripple.400=\"'rgba(255, 255, 255, 0.15)'\"\r\n          ref=\"submit\"\r\n          type=\"submit\"\r\n          :disabled=\"busy\"\r\n        >\r\n          Submit\r\n        </b-button>\r\n      </div>\r\n\r\n      <b-overlay\r\n        :show=\"busy\"\r\n        no-wrap\r\n        @shown=\"onShown\"\r\n        @hidden=\"onHidden\"\r\n      >\r\n        <template v-slot:overlay>\r\n          <div\r\n            v-if=\"processing\"\r\n            class=\"text-center p-4 bg-primary text-light rounded\"\r\n          >\r\n            <b-icon\r\n              icon=\"cloud-upload\"\r\n              font-scale=\"4\"\r\n            />\r\n            <div class=\"mb-3\">\r\n              Processing...\r\n            </div>\r\n            <b-progress\r\n              min=\"1\"\r\n              max=\"20\"\r\n              :value=\"counter\"\r\n              variant=\"success\"\r\n              height=\"3px\"\r\n              class=\"mx-n4 rounded-0\"\r\n            />\r\n          </div>\r\n          <div\r\n            v-else\r\n            ref=\"dialog\"\r\n            tabindex=\"-1\"\r\n            role=\"dialog\"\r\n            aria-modal=\"false\"\r\n            aria-labelledby=\"form-confirm-label\"\r\n            class=\"text-center p-3\"\r\n          >\r\n            <p><strong id=\"form-confirm-label\">Are you sure?</strong></p>\r\n            <div class=\"d-flex\">\r\n              <b-button\r\n                v-ripple.400=\"'rgba(234, 84, 85, 0.15)'\"\r\n                variant=\"outline-danger\"\r\n                class=\"mr-3\"\r\n                @click=\"onCancel\"\r\n              >\r\n                Cancel\r\n              </b-button>\r\n              <b-button\r\n                v-ripple.400=\"'rgba(40, 199, 111, 0.15)'\"\r\n                variant=\"outline-success\"\r\n                @click=\"onOK\"\r\n              >\r\n                OK\r\n              </b-button>\r\n            </div>\r\n          </div>\r\n        </template>\r\n      </b-overlay>\r\n    </b-form>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport {\r\n  BButton,\r\n  BOverlay,\r\n  BForm,\r\n  BProgress,\r\n  BIcon,\r\n  BFormGroup,\r\n  BInputGroup,\r\n  BInputGroupPrepend,\r\n  BFormInput,\r\n  BFormFile,\r\n} from 'bootstrap-vue'\r\nimport Ripple from 'vue-ripple-directive'\r\n\r\nexport default {\r\n  components: {\r\n    BButton,\r\n    BOverlay,\r\n    BForm,\r\n    BProgress,\r\n    BIcon,\r\n    BFormGroup,\r\n    BInputGroup,\r\n    BInputGroupPrepend,\r\n    BFormInput,\r\n    BFormFile,\r\n  },\r\n  directives: {\r\n    Ripple,\r\n  },\r\n  data: () => ({\r\n    busy: false,\r\n    processing: false,\r\n    counter: 1,\r\n    interval: null,\r\n  }),\r\n  beforeDestroy() {\r\n    this.clearInterval()\r\n  },\r\n  methods: {\r\n    clearInterval() {\r\n      if (this.interval) {\r\n        clearInterval(this.interval)\r\n        this.interval = null\r\n      }\r\n    },\r\n    onShown() {\r\n      // Focus the dialog prompt\r\n      this.$refs.dialog.focus()\r\n    },\r\n    onHidden() {\r\n      // In this case, we return focus to the submit button\r\n      // You may need to alter this based on your application requirements\r\n      this.$refs.submit.focus()\r\n    },\r\n    onSubmit() {\r\n      this.processing = false\r\n      this.busy = true\r\n    },\r\n    onCancel() {\r\n      this.busy = false\r\n    },\r\n    onOK() {\r\n      this.counter = 1\r\n      this.processing = true\r\n      // Simulate an async request\r\n      this.clearInterval()\r\n      this.interval = setInterval(() => {\r\n        if (this.counter < 20) {\r\n          this.counter += 1\r\n        } else {\r\n          this.clearInterval()\r\n          this.$nextTick(() => {\r\n            // eslint-disable-next-line\r\n            this.busy = this.processing = false\r\n          })\r\n        }\r\n      }, 350)\r\n    },\r\n  },\r\n}\r\n</script>\r\n `\r\n\r\nexport const codeBusyState = `\r\n<template>\r\n  <div>\r\n    <b-overlay\r\n      :show=\"busy\"\r\n      rounded=\"lg\"\r\n      opacity=\"0.6\"\r\n      @hidden=\"onHidden\"\r\n    >\r\n      <template v-slot:overlay>\r\n        <div class=\"d-flex align-items-center\">\r\n          <b-spinner\r\n            small\r\n            type=\"grow\"\r\n            variant=\"secondary\"\r\n          />\r\n          <b-spinner\r\n            type=\"grow\"\r\n            variant=\"dark\"\r\n          />\r\n          <b-spinner\r\n            small\r\n            type=\"grow\"\r\n            variant=\"secondary\"\r\n          />\r\n          <!-- We add an SR only text for screen readers -->\r\n          <span class=\"sr-only\">Please wait...</span>\r\n        </div>\r\n      </template>\r\n      <b-input-group\r\n        size=\"lg\"\r\n        :aria-hidden=\"busy ? 'true' : null\"\r\n      >\r\n        <b-form-input\r\n          v-model=\"value\"\r\n          :disabled=\"busy\"\r\n        />\r\n        <b-input-group-append>\r\n          <b-button\r\n           v-ripple.400=\"'rgba(255, 255, 255, 0.15)'\"\r\n            ref=\"button\"\r\n            :disabled=\"busy\"\r\n            variant=\"primary\"\r\n            @click=\"onClick\"\r\n          >\r\n            Do something\r\n          </b-button>\r\n        </b-input-group-append>\r\n      </b-input-group>\r\n    </b-overlay>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport { BOverlay, BInputGroup, BFormInput, BInputGroupAppend, BButton, BSpinner} from 'bootstrap-vue'\r\nimport Ripple from 'vue-ripple-directive'\r\n\r\nexport default {\r\n  components: {\r\n    BOverlay,\r\n    BInputGroup,\r\n    BFormInput,\r\n    BInputGroupAppend,\r\n    BButton,\r\n    BSpinner,\r\n  },\r\n    directives: {\r\n    Ripple,\r\n  },\r\n  data: () => ({\r\n    value: 'Some value',\r\n    busy: false,\r\n    timeout: null,\r\n  }),\r\n  beforeDestroy() {\r\n    this.clearTimeout()\r\n  },\r\n  methods: {\r\n    clearTimeout() {\r\n      if (this.timeout) {\r\n        clearTimeout(this.timeout)\r\n        this.timeout = null\r\n      }\r\n    },\r\n    setTimeout(callback) {\r\n      this.clearTimeout()\r\n      this.timeout = setTimeout(() => {\r\n        this.clearTimeout()\r\n        callback()\r\n      }, 5000)\r\n    },\r\n    onHidden() {\r\n      // Return focus to the button\r\n      this.$refs.button.focus()\r\n    },\r\n    onClick() {\r\n      this.busy = true\r\n      // Simulate an async request\r\n      this.setTimeout(() => {\r\n        this.busy = false\r\n      })\r\n    },\r\n  },\r\n}\r\n</script>\r\n`\r\n","<template>\r\n  <b-card-code title=\"Card with overlay\">\r\n    <b-overlay\r\n      :show=\"show\"\r\n      rounded=\"sm\"\r\n    >\r\n      <div>\r\n        <b-card-text>\r\n          <span>BootstrapVue's custom </span>\r\n          <code>b-overlay</code>\r\n          <span>\r\n            component is used to visually obscure a particular element or component and its content. It signals to the\r\n            user of a state change within the element or component and can be used for creating loaders,\r\n            warnings/alerts, prompts, and more.\r\n          </span>\r\n        </b-card-text>\r\n\r\n        <b-button\r\n          v-ripple.400=\"'rgba(113, 102, 240, 0.15)'\"\r\n          :disabled=\"show\"\r\n          variant=\"outline-primary\"\r\n          @click=\"show = true\"\r\n        >\r\n          Show overlay\r\n        </b-button>\r\n      </div>\r\n    </b-overlay>\r\n\r\n    <b-button\r\n      v-ripple.400=\"'rgba(255, 255, 255, 0.15)'\"\r\n      variant=\"primary\"\r\n      class=\"mt-1\"\r\n      @click=\"show = !show\"\r\n    >\r\n      Toggle overlay\r\n    </b-button>\r\n\r\n    <template #code>\r\n      {{ codeBasic }}\r\n    </template>\r\n  </b-card-code>\r\n</template>\r\n\r\n<script>\r\nimport BCardCode from '@core/components/b-card-code'\r\nimport { BOverlay, BButton, BCardText } from 'bootstrap-vue'\r\nimport Ripple from 'vue-ripple-directive'\r\nimport { codeBasic } from './code'\r\n\r\nexport default {\r\n  components: {\r\n    BCardCode,\r\n    BOverlay,\r\n    BButton,\r\n    BCardText,\r\n  },\r\n  directives: {\r\n    Ripple,\r\n  },\r\n  data() {\r\n    return {\r\n      show: false,\r\n      codeBasic,\r\n    }\r\n  },\r\n}\r\n</script>\r\n","import mod from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./OverlayBasic.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./OverlayBasic.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./OverlayBasic.vue?vue&type=template&id=62eefc5d&\"\nimport script from \"./OverlayBasic.vue?vue&type=script&lang=js&\"\nexport * from \"./OverlayBasic.vue?vue&type=script&lang=js&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('b-card-code',{attrs:{\"title\":\"Overlay backdrop color\"},scopedSlots:_vm._u([{key:\"code\",fn:function(){return [_vm._v(\" \"+_vm._s(_vm.codeBackdrop)+\" \")]},proxy:true}])},[_c('b-card-text',[_c('span',[_vm._v(\"You can control the backdrop background color via the \")]),_c('code',[_vm._v(\"variant\")]),_c('span',[_vm._v(\" prop. The variant is translated into one of Bootstrap's \")]),_c('code',[_vm._v(\"background variant utility classes\")]),_c('span',[_vm._v(\". Control the opacity of the backdrop via the\")]),_c('code',[_vm._v(\"opacity\")]),_c('span',[_vm._v(\" prop (opacity values can range from \")]),_c('code',[_vm._v(\"0\")]),_c('span',[_vm._v(\" to \")]),_c('code',[_vm._v(\"1\")]),_c('span',[_vm._v(\"). And background blurring can be controlled via the \")]),_c('code',[_vm._v(\"blur\")]),_c('span',[_vm._v(\" prop.\")])]),_c('b-row',[_c('b-col',{attrs:{\"lg\":\"6\",\"aria-controls\":\"overlay-background\"}},[_c('b-form-group',{attrs:{\"label\":\"Variant\",\"label-for\":\"bg-variant\",\"label-cols-sm\":\"4\",\"label-cols-lg\":\"12\"}},[_c('b-form-select',{attrs:{\"id\":\"bg-variant\",\"options\":_vm.variants},model:{value:(_vm.variant),callback:function ($$v) {_vm.variant=$$v},expression:\"variant\"}})],1),_c('b-form-group',{attrs:{\"label\":\"Opacity\",\"label-for\":\"bg-opacity\",\"label-cols-sm\":\"4\",\"label-cols-lg\":\"12\"}},[_c('b-input-group',[_c('b-form-input',{attrs:{\"id\":\"bg-opacity\",\"type\":\"range\",\"number\":\"\",\"min\":\"0\",\"max\":\"1\",\"step\":\"0.01\"},model:{value:(_vm.opacity),callback:function ($$v) {_vm.opacity=$$v},expression:\"opacity\"}}),_c('b-input-group-append',{staticClass:\"text-monospace\",attrs:{\"is-text\":\"\"}},[_vm._v(\" \"+_vm._s(_vm.opacity.toFixed(2))+\" \")])],1)],1),_c('b-form-group',{staticClass:\"mb-2 mb-lg-0\",attrs:{\"label\":\"Blur\",\"label-for\":\"bg-blur\",\"label-cols-sm\":\"4\",\"label-cols-lg\":\"12\"}},[_c('b-form-select',{attrs:{\"id\":\"bg-blur\",\"options\":_vm.blurs},model:{value:(_vm.blur),callback:function ($$v) {_vm.blur=$$v},expression:\"blur\"}})],1)],1),_c('b-col',{attrs:{\"lg\":\"6\"}},[_c('b-overlay',{attrs:{\"id\":\"overlay-background\",\"show\":\"\",\"variant\":_vm.variant,\"opacity\":_vm.opacity,\"blur\":_vm.blur,\"rounded\":\"sm\"}},[_c('b-card',{staticClass:\"mb-0\",attrs:{\"title\":\"Card with overlay\",\"aria-hidden\":\"true\"}},[_c('b-card-text',[_vm._v(\" Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. \")]),_c('b-button',{directives:[{name:\"ripple\",rawName:\"v-ripple.400\",value:('rgba(255, 255, 255, 0.15)'),expression:\"'rgba(255, 255, 255, 0.15)'\",modifiers:{\"400\":true}}],attrs:{\"disabled\":\"\",\"variant\":\"primary\"}},[_vm._v(\" Button \")])],1)],1)],1)],1)],1)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\r\n  <b-card-code title=\"Overlay backdrop color\">\r\n    <b-card-text>\r\n      <span>You can control the backdrop background color via the </span>\r\n      <code>variant</code>\r\n      <span> prop. The variant is translated into one of Bootstrap's </span>\r\n      <code>background variant utility classes</code>\r\n      <span>. Control the opacity of the backdrop via the</span>\r\n      <code>opacity</code>\r\n      <span> prop (opacity values can range from </span>\r\n      <code>0</code>\r\n      <span> to </span>\r\n      <code>1</code>\r\n      <span>). And background blurring can be controlled via the </span>\r\n      <code>blur</code>\r\n      <span> prop.</span>\r\n    </b-card-text>\r\n\r\n    <b-row>\r\n      <b-col\r\n        lg=\"6\"\r\n        aria-controls=\"overlay-background\"\r\n      >\r\n        <b-form-group\r\n          label=\"Variant\"\r\n          label-for=\"bg-variant\"\r\n          label-cols-sm=\"4\"\r\n          label-cols-lg=\"12\"\r\n        >\r\n          <b-form-select\r\n            id=\"bg-variant\"\r\n            v-model=\"variant\"\r\n            :options=\"variants\"\r\n          />\r\n        </b-form-group>\r\n        <b-form-group\r\n          label=\"Opacity\"\r\n          label-for=\"bg-opacity\"\r\n          label-cols-sm=\"4\"\r\n          label-cols-lg=\"12\"\r\n        >\r\n          <b-input-group>\r\n            <b-form-input\r\n              id=\"bg-opacity\"\r\n              v-model=\"opacity\"\r\n              type=\"range\"\r\n              number\r\n              min=\"0\"\r\n              max=\"1\"\r\n              step=\"0.01\"\r\n            />\r\n            <b-input-group-append\r\n              is-text\r\n              class=\"text-monospace\"\r\n            >\r\n              {{ opacity.toFixed(2) }}\r\n            </b-input-group-append>\r\n          </b-input-group>\r\n        </b-form-group>\r\n        <b-form-group\r\n          label=\"Blur\"\r\n          label-for=\"bg-blur\"\r\n          label-cols-sm=\"4\"\r\n          label-cols-lg=\"12\"\r\n          class=\"mb-2 mb-lg-0\"\r\n        >\r\n          <b-form-select\r\n            id=\"bg-blur\"\r\n            v-model=\"blur\"\r\n            :options=\"blurs\"\r\n          />\r\n        </b-form-group>\r\n      </b-col>\r\n      <b-col lg=\"6\">\r\n        <b-overlay\r\n          id=\"overlay-background\"\r\n          show\r\n          :variant=\"variant\"\r\n          :opacity=\"opacity\"\r\n          :blur=\"blur\"\r\n          rounded=\"sm\"\r\n        >\r\n          <b-card\r\n            title=\"Card with overlay\"\r\n            aria-hidden=\"true\"\r\n            class=\"mb-0\"\r\n          >\r\n            <b-card-text>\r\n              Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et\r\n              dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip\r\n              ex ea commodo consequat.\r\n            </b-card-text>\r\n            <b-button\r\n              v-ripple.400=\"'rgba(255, 255, 255, 0.15)'\"\r\n              disabled\r\n              variant=\"primary\"\r\n            >\r\n              Button\r\n            </b-button>\r\n          </b-card>\r\n        </b-overlay>\r\n      </b-col>\r\n    </b-row>\r\n\r\n    <template #code>\r\n      {{ codeBackdrop }}\r\n    </template>\r\n  </b-card-code>\r\n</template>\r\n\r\n<script>\r\nimport BCardCode from '@core/components/b-card-code'\r\nimport {\r\n  BRow,\r\n  BCol,\r\n  BFormGroup,\r\n  BFormSelect,\r\n  BFormInput,\r\n  BInputGroupAppend,\r\n  BCard,\r\n  BOverlay,\r\n  BButton,\r\n  BCardText,\r\n  BInputGroup,\r\n} from 'bootstrap-vue'\r\nimport Ripple from 'vue-ripple-directive'\r\nimport { codeBackdrop } from './code'\r\n\r\nexport default {\r\n  components: {\r\n    BCardCode,\r\n    BRow,\r\n    BCol,\r\n    BFormGroup,\r\n    BFormSelect,\r\n    BFormInput,\r\n    BInputGroupAppend,\r\n    BCard,\r\n    BOverlay,\r\n    BButton,\r\n    BCardText,\r\n    BInputGroup,\r\n  },\r\n  directives: {\r\n    Ripple,\r\n  },\r\n  data() {\r\n    return {\r\n      variant: 'light',\r\n      opacity: 0.85,\r\n      blur: '2px',\r\n      variants: ['transparent', 'white', 'light', 'dark', 'primary', 'secondary', 'success', 'danger', 'warning', 'info'],\r\n      blurs: [{ text: 'None', value: '' }, '1px', '2px', '5px', '0.5em', '1rem'],\r\n      codeBackdrop,\r\n    }\r\n  },\r\n}\r\n</script>\r\n","import mod from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./OverlayBackdrop.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./OverlayBackdrop.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./OverlayBackdrop.vue?vue&type=template&id=659b4ddc&\"\nimport script from \"./OverlayBackdrop.vue?vue&type=script&lang=js&\"\nexport * from \"./OverlayBackdrop.vue?vue&type=script&lang=js&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('b-card-code',{attrs:{\"title\":\"Fade transition\"},scopedSlots:_vm._u([{key:\"code\",fn:function(){return [_vm._v(\" \"+_vm._s(_vm.codeFade)+\" \")]},proxy:true}])},[_c('b-card-text',[_c('span',[_vm._v(\"By default, the overlay uses Bootstrap's fade transition when showing or hiding. You can disable the fade transition via adding the \")]),_c('code',[_vm._v(\"no-fade\")]),_c('span',[_vm._v(\" prop to \")]),_c('code',[_vm._v(\" <b-overlay>.\")])]),_c('div',[_c('b-overlay',{attrs:{\"show\":_vm.show,\"rounded\":\"sm\",\"no-fade\":\"\"}},[_c('div',{attrs:{\"title\":\"Card with overlay\",\"aria-hidden\":_vm.show ? 'true' : null}},[_c('b-card-text',[_vm._v(\" Lorem ipsum dolor sit amet, consectetur adipisicing elit. Distinctio voluptatibus doloremque dolor nesciunt est nobis consequuntur maxime ea ipsam? Doloribus quidem doloremque ad laudantium ullam eos, consequuntur velit quas vero. \")]),_c('b-button',{directives:[{name:\"ripple\",rawName:\"v-ripple.400\",value:('rgba(113, 102, 240, 0.15)'),expression:\"'rgba(113, 102, 240, 0.15)'\",modifiers:{\"400\":true}}],attrs:{\"disabled\":_vm.show,\"variant\":\"outline-primary\"},on:{\"click\":function($event){_vm.show = true}}},[_vm._v(\" Show overlay \")])],1)]),_c('b-button',{directives:[{name:\"ripple\",rawName:\"v-ripple.400\",value:('rgba(255, 255, 255, 0.15)'),expression:\"'rgba(255, 255, 255, 0.15)'\",modifiers:{\"400\":true}}],staticClass:\"mt-1\",attrs:{\"variant\":\"primary\"},on:{\"click\":function($event){_vm.show = !_vm.show}}},[_vm._v(\" Toggle overlay \")])],1)],1)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\r\n  <b-card-code title=\"Fade transition\">\r\n    <b-card-text>\r\n      <span>By default, the overlay uses Bootstrap's fade transition when showing or hiding. You can disable the fade\r\n        transition via adding the\r\n      </span>\r\n      <code>no-fade</code>\r\n      <span> prop to </span>\r\n      <code> &lt;b-overlay&gt;.</code>\r\n    </b-card-text>\r\n\r\n    <div>\r\n      <b-overlay\r\n        :show=\"show\"\r\n        rounded=\"sm\"\r\n        no-fade\r\n      >\r\n        <div\r\n          title=\"Card with overlay\"\r\n          :aria-hidden=\"show ? 'true' : null\"\r\n        >\r\n          <b-card-text>\r\n            Lorem ipsum dolor sit amet, consectetur adipisicing elit. Distinctio voluptatibus doloremque dolor nesciunt\r\n            est nobis consequuntur maxime ea ipsam? Doloribus quidem doloremque ad laudantium ullam eos, consequuntur\r\n            velit quas vero.\r\n          </b-card-text>\r\n\r\n          <b-button\r\n            v-ripple.400=\"'rgba(113, 102, 240, 0.15)'\"\r\n            :disabled=\"show\"\r\n            variant=\"outline-primary\"\r\n            @click=\"show = true\"\r\n          >\r\n            Show overlay\r\n          </b-button>\r\n        </div>\r\n      </b-overlay>\r\n\r\n      <!-- trigger button -->\r\n      <b-button\r\n        v-ripple.400=\"'rgba(255, 255, 255, 0.15)'\"\r\n        variant=\"primary\"\r\n        class=\"mt-1\"\r\n        @click=\"show = !show\"\r\n      >\r\n        Toggle overlay\r\n      </b-button>\r\n    </div>\r\n\r\n    <template #code>\r\n      {{ codeFade }}\r\n    </template>\r\n  </b-card-code>\r\n</template>\r\n\r\n<script>\r\nimport BCardCode from '@core/components/b-card-code'\r\nimport { BOverlay, BButton, BCardText } from 'bootstrap-vue'\r\nimport Ripple from 'vue-ripple-directive'\r\nimport { codeFade } from './code'\r\n\r\nexport default {\r\n  components: {\r\n    BCardCode,\r\n    BOverlay,\r\n    BButton,\r\n    BCardText,\r\n  },\r\n  directives: {\r\n    Ripple,\r\n  },\r\n  data() {\r\n    return {\r\n      show: false,\r\n      codeFade,\r\n    }\r\n  },\r\n}\r\n</script>\r\n","import mod from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./OverlayFade.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./OverlayFade.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./OverlayFade.vue?vue&type=template&id=18f7cf9d&\"\nimport script from \"./OverlayFade.vue?vue&type=script&lang=js&\"\nexport * from \"./OverlayFade.vue?vue&type=script&lang=js&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('b-card-code',{attrs:{\"title\":\"Default spinner styling\"},scopedSlots:_vm._u([{key:\"code\",fn:function(){return [_vm._v(\" \"+_vm._s(_vm.codeSpinner)+\" \")]},proxy:true}])},[_c('b-card-text',[_c('span',[_vm._v(\"The default overlay content is a \")]),_c('code',[_vm._v(\"<b-spinner>\")]),_c('span',[_vm._v(\" of type \")]),_c('code',[_vm._v(\"'border'\")]),_c('span',[_vm._v(\". You can control the appearance of the spinner via the following props:\")])]),_c('b-overlay',{attrs:{\"show\":\"\",\"spinner-variant\":\"primary\",\"spinner-type\":\"grow\",\"spinner-small\":\"\",\"rounded\":\"sm\"}},[_c('b-card',{staticClass:\"mb-0\",attrs:{\"title\":\"Card with spinner style\",\"aria-hidden\":\"true\"}},[_c('b-card-text',[_vm._v(\" Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. \")]),_c('b-button',{directives:[{name:\"ripple\",rawName:\"v-ripple.400\",value:('rgba(255, 255, 255, 0.15)'),expression:\"'rgba(255, 255, 255, 0.15)'\",modifiers:{\"400\":true}}],attrs:{\"disabled\":\"\",\"variant\":\"primary\"}},[_vm._v(\" Button \")])],1)],1)],1)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\r\n  <b-card-code title=\"Default spinner styling\">\r\n    <b-card-text>\r\n      <span>The default overlay content is a </span>\r\n      <code>&lt;b-spinner&gt;</code>\r\n      <span> of type </span>\r\n      <code>'border'</code>\r\n      <span>. You can control the appearance of the spinner via the following props:</span>\r\n    </b-card-text>\r\n\r\n    <b-overlay\r\n      show\r\n      spinner-variant=\"primary\"\r\n      spinner-type=\"grow\"\r\n      spinner-small\r\n      rounded=\"sm\"\r\n    >\r\n      <b-card\r\n        title=\"Card with spinner style\"\r\n        aria-hidden=\"true\"\r\n        class=\"mb-0\"\r\n      >\r\n        <b-card-text>\r\n          Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et\r\n          dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex\r\n          ea commodo consequat.\r\n        </b-card-text>\r\n        <b-button\r\n          v-ripple.400=\"'rgba(255, 255, 255, 0.15)'\"\r\n          disabled\r\n          variant=\"primary\"\r\n        >\r\n          Button\r\n        </b-button>\r\n      </b-card>\r\n    </b-overlay>\r\n\r\n    <template #code>\r\n      {{ codeSpinner }}\r\n    </template>\r\n  </b-card-code>\r\n</template>\r\n\r\n<script>\r\nimport BCardCode from '@core/components/b-card-code'\r\nimport {\r\n  BOverlay, BButton, BCard, BCardText,\r\n} from 'bootstrap-vue'\r\nimport Ripple from 'vue-ripple-directive'\r\nimport { codeSpinner } from './code'\r\n\r\nexport default {\r\n  components: {\r\n    BCardCode,\r\n    BOverlay,\r\n    BButton,\r\n    BCard,\r\n    BCardText,\r\n  },\r\n  directives: {\r\n    Ripple,\r\n  },\r\n  data() {\r\n    return {\r\n      codeSpinner,\r\n    }\r\n  },\r\n}\r\n</script>\r\n","import mod from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./OverlaySpinner.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./OverlaySpinner.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./OverlaySpinner.vue?vue&type=template&id=3f0599d9&\"\nimport script from \"./OverlaySpinner.vue?vue&type=script&lang=js&\"\nexport * from \"./OverlaySpinner.vue?vue&type=script&lang=js&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('b-card-code',{attrs:{\"title\":\"Overlay corner rounding\"},scopedSlots:_vm._u([{key:\"code\",fn:function(){return [_vm._v(\" \"+_vm._s(_vm.codeCornerRounded)+\" \")]},proxy:true}])},[_c('b-card-text',[_c('span',[_vm._v(\" By default, the overlay backdrop has square corners. If the content you are wrapping has rounded corners, you can use the \")]),_c('code',[_vm._v(\"rounded\")]),_c('span',[_vm._v(\" prop to apply rounding to the overlay's corners to match the obscured content's rounded corners.\")])]),_c('div',[_c('b-button',{directives:[{name:\"ripple\",rawName:\"v-ripple.400\",value:('rgba(255, 255, 255, 0.15)'),expression:\"'rgba(255, 255, 255, 0.15)'\",modifiers:{\"400\":true}}],attrs:{\"variant\":\"primary\"},on:{\"click\":function($event){_vm.show = !_vm.show}}},[_vm._v(\" Toggle overlay \")]),_c('b-row',{staticClass:\"text-center mt-2\"},[_c('b-col',{attrs:{\"md\":\"6\"}},[_c('b-card-text',[_vm._v(\"With rounding\")]),_c('b-overlay',{staticClass:\"d-inline-block\",attrs:{\"show\":_vm.show,\"rounded\":\"circle\"}},[_c('b-img',{attrs:{\"rounded\":\"circle\",\"height\":\"300\",\"src\":require('@/assets/images/banner/banner-27.jpg'),\"alt\":\"Image 1\"}})],1)],1),_c('b-col',{staticClass:\"mt-1 mt-md-0\",attrs:{\"md\":\"6\"}},[_c('b-card-text',[_vm._v(\"Without rounding\")]),_c('b-overlay',{staticClass:\"d-inline-block\",attrs:{\"show\":_vm.show}},[_c('b-img',{attrs:{\"rounded\":\"circle\",\"height\":\"300\",\"src\":require('@/assets/images/banner/banner-27.jpg'),\"alt\":\"Image 1\"}})],1)],1)],1)],1)],1)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\r\n  <b-card-code title=\"Overlay corner rounding\">\r\n    <b-card-text>\r\n      <span>\r\n        By default, the overlay backdrop has square corners. If the content you are wrapping has rounded corners, you\r\n        can use the\r\n      </span>\r\n      <code>rounded</code>\r\n      <span> prop to apply rounding to the overlay's corners to match the obscured content's rounded corners.</span>\r\n    </b-card-text>\r\n\r\n    <div>\r\n      <b-button\r\n        v-ripple.400=\"'rgba(255, 255, 255, 0.15)'\"\r\n        variant=\"primary\"\r\n        @click=\"show = !show\"\r\n      >\r\n        Toggle overlay\r\n      </b-button>\r\n\r\n      <b-row class=\"text-center mt-2\">\r\n        <b-col md=\"6\">\r\n          <b-card-text>With rounding</b-card-text>\r\n          <b-overlay\r\n            :show=\"show\"\r\n            class=\"d-inline-block\"\r\n            rounded=\"circle\"\r\n          >\r\n            <b-img\r\n              rounded=\"circle\"\r\n              height=\"300\"\r\n              :src=\"require('@/assets/images/banner/banner-27.jpg')\"\r\n              alt=\"Image 1\"\r\n            />\r\n          </b-overlay>\r\n        </b-col>\r\n        <b-col\r\n          md=\"6\"\r\n          class=\"mt-1 mt-md-0\"\r\n        >\r\n          <b-card-text>Without rounding</b-card-text>\r\n          <b-overlay\r\n            :show=\"show\"\r\n            class=\"d-inline-block\"\r\n          >\r\n            <b-img\r\n              rounded=\"circle\"\r\n              height=\"300\"\r\n              :src=\"require('@/assets/images/banner/banner-27.jpg')\"\r\n              alt=\"Image 1\"\r\n            />\r\n          </b-overlay>\r\n        </b-col>\r\n      </b-row>\r\n    </div>\r\n\r\n    <template #code>\r\n      {{ codeCornerRounded }}\r\n    </template>\r\n  </b-card-code>\r\n</template>\r\n\r\n<script>\r\nimport BCardCode from '@core/components/b-card-code'\r\nimport {\r\n  BOverlay, BButton, BImg, BRow, BCol, BCardText,\r\n} from 'bootstrap-vue'\r\nimport Ripple from 'vue-ripple-directive'\r\nimport { codeCornerRounded } from './code'\r\n\r\nexport default {\r\n  components: {\r\n    BCardCode,\r\n    BOverlay,\r\n    BButton,\r\n    BCardText,\r\n    BImg,\r\n    BRow,\r\n    BCol,\r\n  },\r\n  directives: {\r\n    Ripple,\r\n  },\r\n  data() {\r\n    return {\r\n      show: false,\r\n      codeCornerRounded,\r\n    }\r\n  },\r\n}\r\n</script>\r\n","import mod from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./OverlayCornerRound.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./OverlayCornerRound.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./OverlayCornerRound.vue?vue&type=template&id=2e6db7d2&\"\nimport script from \"./OverlayCornerRound.vue?vue&type=script&lang=js&\"\nexport * from \"./OverlayCornerRound.vue?vue&type=script&lang=js&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('b-card-code',{attrs:{\"title\":\"Custom overlay content\"},scopedSlots:_vm._u([{key:\"code\",fn:function(){return [_vm._v(\" \"+_vm._s(_vm.codeCustomContent)+\" \")]},proxy:true}])},[_c('b-card-text',[_c('span',[_vm._v(\"Place custom content in the overlay (replacing the default spinner) via the optionally scoped slot \")]),_c('code',[_vm._v(\"overlay\")])]),_c('div',[_c('b-overlay',{attrs:{\"show\":_vm.show,\"rounded\":\"sm\"},on:{\"shown\":_vm.onShown,\"hidden\":_vm.onHidden},scopedSlots:_vm._u([{key:\"overlay\",fn:function(){return [_c('div',{staticClass:\"text-center\"},[_c('feather-icon',{attrs:{\"icon\":\"ClockIcon\",\"size\":\"24\"}}),_c('b-card-text',{attrs:{\"id\":\"cancel-label\"}},[_vm._v(\" Please wait... \")]),_c('b-button',{directives:[{name:\"ripple\",rawName:\"v-ripple.400\",value:('rgba(255, 255, 255, 0.15)'),expression:\"'rgba(255, 255, 255, 0.15)'\",modifiers:{\"400\":true}}],ref:\"cancel\",attrs:{\"variant\":\"outline-danger\",\"size\":\"sm\",\"aria-describedby\":\"cancel-label\"},on:{\"click\":function($event){_vm.show = false}}},[_vm._v(\" Cancel \")])],1)]},proxy:true}])},[_c('div',[_c('h6',[_vm._v(\"Card with custom overlay content\")]),_c('b-card-text',[_vm._v(\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\")]),_c('b-card-text',[_vm._v(\"Click the button to toggle the overlay:\")]),_c('b-button',{directives:[{name:\"ripple\",rawName:\"v-ripple.400\",value:('rgba(255, 255, 255, 0.15)'),expression:\"'rgba(255, 255, 255, 0.15)'\",modifiers:{\"400\":true}}],ref:\"show\",attrs:{\"disabled\":_vm.show,\"variant\":\"primary\"},on:{\"click\":function($event){_vm.show = true}}},[_vm._v(\" Show overlay \")])],1)])],1)],1)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\r\n  <b-card-code title=\"Custom overlay content\">\r\n    <b-card-text>\r\n      <span>Place custom content in the overlay (replacing the default spinner) via the optionally scoped slot </span>\r\n      <code>overlay</code>\r\n    </b-card-text>\r\n\r\n    <div>\r\n      <b-overlay\r\n        :show=\"show\"\r\n        rounded=\"sm\"\r\n        @shown=\"onShown\"\r\n        @hidden=\"onHidden\"\r\n      >\r\n        <div>\r\n          <h6>Card with custom overlay content</h6>\r\n          <b-card-text>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</b-card-text>\r\n          <b-card-text>Click the button to toggle the overlay:</b-card-text>\r\n          <b-button\r\n            ref=\"show\"\r\n            v-ripple.400=\"'rgba(255, 255, 255, 0.15)'\"\r\n            :disabled=\"show\"\r\n            variant=\"primary\"\r\n            @click=\"show = true\"\r\n          >\r\n            Show overlay\r\n          </b-button>\r\n        </div>\r\n        <template #overlay>\r\n          <div class=\"text-center\">\r\n            <feather-icon\r\n              icon=\"ClockIcon\"\r\n              size=\"24\"\r\n            />\r\n            <b-card-text id=\"cancel-label\">\r\n              Please wait...\r\n            </b-card-text>\r\n            <b-button\r\n              ref=\"cancel\"\r\n              v-ripple.400=\"'rgba(255, 255, 255, 0.15)'\"\r\n              variant=\"outline-danger\"\r\n              size=\"sm\"\r\n              aria-describedby=\"cancel-label\"\r\n              @click=\"show = false\"\r\n            >\r\n              Cancel\r\n            </b-button>\r\n          </div>\r\n        </template>\r\n      </b-overlay>\r\n    </div>\r\n\r\n    <template #code>\r\n      {{ codeCustomContent }}\r\n    </template>\r\n  </b-card-code>\r\n</template>\r\n\r\n<script>\r\nimport BCardCode from '@core/components/b-card-code'\r\nimport { BOverlay, BButton, BCardText } from 'bootstrap-vue'\r\nimport Ripple from 'vue-ripple-directive'\r\nimport { codeCustomContent } from './code'\r\n\r\nexport default {\r\n  components: {\r\n    BCardCode,\r\n    BCardText,\r\n    BOverlay,\r\n    BButton,\r\n  },\r\n  directives: {\r\n    Ripple,\r\n  },\r\n  data() {\r\n    return {\r\n      show: false,\r\n      codeCustomContent,\r\n    }\r\n  },\r\n  methods: {\r\n    onShown() {\r\n      // Focus the cancel button when the overlay is showing\r\n      this.$refs.cancel.focus()\r\n    },\r\n    onHidden() {\r\n      // Focus the show button when the overlay is removed\r\n      this.$refs.show.focus()\r\n    },\r\n  },\r\n}\r\n</script>\r\n","import mod from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./OverlayCustomContent.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./OverlayCustomContent.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./OverlayCustomContent.vue?vue&type=template&id=da8b4b2a&\"\nimport script from \"./OverlayCustomContent.vue?vue&type=script&lang=js&\"\nexport * from \"./OverlayCustomContent.vue?vue&type=script&lang=js&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('b-card-code',{attrs:{\"title\":\"Non-wrapping mode\"},scopedSlots:_vm._u([{key:\"code\",fn:function(){return [_vm._v(\" \"+_vm._s(_vm.codeNoWrapMode)+\" \")]},proxy:true}])},[_c('b-card-text',[_c('span',[_vm._v(\"By default, \")]),_c('code',[_vm._v(\"<b-overlay>\")]),_c('span',[_vm._v(\" wraps the content of the default slot. In some cases you may want to obscure a parent container. Use the \")]),_c('code',[_vm._v(\"no-wrap\")]),_c('span',[_vm._v(\" prop to disable rendering of the wrapping (and ignore the default slot). Note that this requires that the ancestor element that is to be obscured to have relative positioning (either via the utility class \")]),_c('code',[_vm._v(\"'position-relative'\")]),_c('span',[_vm._v(\" , or CSS style \")]),_c('code',[_vm._v(\"'position: relative;'\")]),_c('span',[_vm._v(\").\")])]),_c('div',[_c('div',{staticClass:\"position-relative p-2 bg-info\"},[_c('b-card-text',{staticClass:\"text-white font-weight-bold\"},[_vm._v(\" Lorem ipsum dolor sit amet, consectetur adipiscing elit. \")]),_c('b-card',{staticClass:\"mb-1\",attrs:{\"title\":\"Card with parent overlay\"}},[_c('b-card-text',[_vm._v(\"Laborum consequat non elit enim exercitation cillum.\")]),_c('b-card-text',[_vm._v(\"Click the button to toggle the overlay:\")]),_c('b-button',{directives:[{name:\"ripple\",rawName:\"v-ripple.400\",value:('rgba(113, 102, 240, 0.15)'),expression:\"'rgba(113, 102, 240, 0.15)'\",modifiers:{\"400\":true}}],attrs:{\"disabled\":_vm.show,\"variant\":\"outline-primary\"},on:{\"click\":function($event){_vm.show = true}}},[_vm._v(\" Show overlay \")])],1),_c('b-card-text',{staticClass:\"text-white font-weight-bold mb-0\"},[_vm._v(\" Lorem ipsum dolor sit amet, consectetur adipiscing elit. \")]),_c('b-overlay',{attrs:{\"show\":_vm.show,\"no-wrap\":\"\"}})],1),_c('b-button',{directives:[{name:\"ripple\",rawName:\"v-ripple.400\",value:('rgba(255, 255, 255, 0.15)'),expression:\"'rgba(255, 255, 255, 0.15)'\",modifiers:{\"400\":true}}],staticClass:\"mt-3\",attrs:{\"variant\":\"primary\"},on:{\"click\":function($event){_vm.show = !_vm.show}}},[_vm._v(\" Toggle overlay \")])],1)],1)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\r\n  <b-card-code\r\n    title=\"Non-wrapping mode\"\r\n  >\r\n    <b-card-text>\r\n      <span>By default, </span>\r\n      <code>&lt;b-overlay&gt;</code>\r\n      <span> wraps the content of the default slot. In some cases you may want to obscure a parent container. Use the </span>\r\n      <code>no-wrap</code>\r\n      <span> prop to disable rendering of the wrapping (and ignore the default slot). Note that this requires that the\r\n        ancestor element that is to be obscured to have relative positioning (either via the utility class </span>\r\n      <code>'position-relative'</code>\r\n      <span> , or CSS style </span>\r\n      <code>'position: relative;'</code>\r\n      <span>).</span>\r\n    </b-card-text>\r\n\r\n    <div>\r\n      <div class=\"position-relative p-2 bg-info\">\r\n        <b-card-text class=\"text-white font-weight-bold\">\r\n          Lorem ipsum dolor sit amet, consectetur adipiscing elit.\r\n        </b-card-text>\r\n        <b-card\r\n          title=\"Card with parent overlay\"\r\n          class=\"mb-1\"\r\n        >\r\n          <b-card-text>Laborum consequat non elit enim exercitation cillum.</b-card-text>\r\n          <b-card-text>Click the button to toggle the overlay:</b-card-text>\r\n          <b-button\r\n            v-ripple.400=\"'rgba(113, 102, 240, 0.15)'\"\r\n            :disabled=\"show\"\r\n            variant=\"outline-primary\"\r\n            @click=\"show = true\"\r\n          >\r\n            Show overlay\r\n          </b-button>\r\n        </b-card>\r\n        <b-card-text class=\"text-white font-weight-bold mb-0\">\r\n          Lorem ipsum dolor sit amet, consectetur adipiscing elit.\r\n        </b-card-text>\r\n        <b-overlay\r\n          :show=\"show\"\r\n          no-wrap\r\n        />\r\n      </div>\r\n      <b-button\r\n        v-ripple.400=\"'rgba(255, 255, 255, 0.15)'\"\r\n        class=\"mt-3\"\r\n        variant=\"primary\"\r\n        @click=\"show = !show\"\r\n      >\r\n        Toggle overlay\r\n      </b-button>\r\n    </div>\r\n\r\n    <template #code>\r\n      {{ codeNoWrapMode }}\r\n    </template>\r\n  </b-card-code>\r\n</template>\r\n\r\n<script>\r\nimport BCardCode from '@core/components/b-card-code'\r\nimport {\r\n  BOverlay, BButton, BCard, BCardText,\r\n} from 'bootstrap-vue'\r\nimport Ripple from 'vue-ripple-directive'\r\nimport { codeNoWrapMode } from './code'\r\n\r\nexport default {\r\n  components: {\r\n    BCardCode,\r\n    BOverlay,\r\n    BButton,\r\n    BCard,\r\n    BCardText,\r\n  },\r\n  directives: {\r\n    Ripple,\r\n  },\r\n  data() {\r\n    return {\r\n      show: false,\r\n      codeNoWrapMode,\r\n    }\r\n  },\r\n}\r\n</script>\r\n","import mod from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./OverlayNoWrapMode.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./OverlayNoWrapMode.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./OverlayNoWrapMode.vue?vue&type=template&id=5d468a85&\"\nimport script from \"./OverlayNoWrapMode.vue?vue&type=script&lang=js&\"\nexport * from \"./OverlayNoWrapMode.vue?vue&type=script&lang=js&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('b-card-code',{attrs:{\"title\":\"Form confirmation prompt and upload status\"},scopedSlots:_vm._u([{key:\"code\",fn:function(){return [_vm._v(\" \"+_vm._s(_vm.codeForm)+\" \")]},proxy:true}])},[_c('b-card-text',[_c('span',[_vm._v(\"This example is a bit more complex, but shows the use of \")]),_c('code',[_vm._v(\"no-wrap\")]),_c('span',[_vm._v(\" , and using the \")]),_c('code',[_vm._v(\"overlay\")]),_c('span',[_vm._v(\" slot to present the user with a prompt dialog, and once confirmed it shows a uploading status indicator. This example also demonstrates additional accessibility markup. \")])]),_c('div',[_c('b-form',{staticClass:\"position-relative\",on:{\"submit\":function($event){$event.preventDefault();return _vm.onSubmit($event)}}},[_c('b-form-group',{attrs:{\"label\":\"Name\",\"label-for\":\"form-name\",\"label-cols-lg\":\"2\"}},[_c('b-input-group',[_c('b-input-group-prepend',{attrs:{\"is-text\":\"\"}},[_c('feather-icon',{attrs:{\"icon\":\"UserIcon\"}})],1),_c('b-form-input',{attrs:{\"id\":\"form-name\",\"disabled\":_vm.busy}})],1)],1),_c('b-form-group',{attrs:{\"label\":\"Email\",\"label-for\":\"form-mail\",\"label-cols-lg\":\"2\"}},[_c('b-input-group',[_c('b-input-group-prepend',{attrs:{\"is-text\":\"\"}},[_c('feather-icon',{attrs:{\"icon\":\"MailIcon\"}})],1),_c('b-form-input',{attrs:{\"id\":\"form-email\",\"type\":\"email\",\"disabled\":_vm.busy}})],1)],1),_c('b-form-group',{attrs:{\"label\":\"Image\",\"label-for\":\"form-image\",\"label-cols-lg\":\"2\"}},[_c('b-input-group',[_c('b-input-group-prepend',{attrs:{\"is-text\":\"\"}},[_c('feather-icon',{attrs:{\"icon\":\"ImageIcon\"}})],1),_c('b-form-file',{attrs:{\"id\":\"form-image\",\"disabled\":_vm.busy,\"accept\":\"image/*\"}})],1)],1),_c('div',{staticClass:\"d-flex justify-content-center\"},[_c('b-button',{directives:[{name:\"ripple\",rawName:\"v-ripple.400\",value:('rgba(255, 255, 255, 0.15)'),expression:\"'rgba(255, 255, 255, 0.15)'\",modifiers:{\"400\":true}}],ref:\"submit\",attrs:{\"variant\":\"primary\",\"type\":\"submit\",\"disabled\":_vm.busy}},[_vm._v(\" Submit \")])],1),_c('b-overlay',{attrs:{\"show\":_vm.busy,\"no-wrap\":\"\"},on:{\"shown\":_vm.onShown,\"hidden\":_vm.onHidden},scopedSlots:_vm._u([{key:\"overlay\",fn:function(){return [(_vm.processing)?_c('div',{staticClass:\"text-center p-3 bg-primary text-light rounded\"},[_c('feather-icon',{attrs:{\"icon\":\"UploadCloudIcon\",\"size\":\"20\"}}),_c('div',{staticClass:\"mb-2\"},[_vm._v(\" Processing... \")]),_c('b-progress',{staticClass:\"mx-n3\",attrs:{\"min\":\"1\",\"max\":\"20\",\"value\":_vm.counter,\"variant\":\"success\",\"height\":\"6px\"}})],1):_c('div',{ref:\"dialog\",staticClass:\"text-center p-3\",attrs:{\"tabindex\":\"-1\",\"role\":\"dialog\",\"aria-modal\":\"false\",\"aria-labelledby\":\"form-confirm-label\"}},[_c('b-card-text',{staticClass:\"font-weight-bolder\"},[_vm._v(\" Are you sure? \")]),_c('div',{staticClass:\"d-flex\"},[_c('b-button',{directives:[{name:\"ripple\",rawName:\"v-ripple.400\",value:('rgba(234, 84, 85, 0.15)'),expression:\"'rgba(234, 84, 85, 0.15)'\",modifiers:{\"400\":true}}],staticClass:\"mr-3\",attrs:{\"variant\":\"outline-danger\"},on:{\"click\":_vm.onCancel}},[_vm._v(\" Cancel \")]),_c('b-button',{directives:[{name:\"ripple\",rawName:\"v-ripple.400\",value:('rgba(40, 199, 111, 0.15)'),expression:\"'rgba(40, 199, 111, 0.15)'\",modifiers:{\"400\":true}}],attrs:{\"variant\":\"outline-success\"},on:{\"click\":_vm.onOK}},[_vm._v(\" OK \")])],1)],1)]},proxy:true}])})],1)],1)],1)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\r\n  <b-card-code title=\"Form confirmation prompt and upload status\">\r\n    <b-card-text>\r\n      <span>This example is a bit more complex, but shows the use of </span>\r\n      <code>no-wrap</code>\r\n      <span> , and using the </span>\r\n      <code>overlay</code>\r\n      <span> slot to present the user with a prompt dialog, and once confirmed it shows a uploading status indicator. This\r\n        example also demonstrates additional accessibility markup.\r\n      </span>\r\n    </b-card-text>\r\n\r\n    <div>\r\n      <b-form\r\n        class=\"position-relative\"\r\n        @submit.prevent=\"onSubmit\"\r\n      >\r\n        <b-form-group\r\n          label=\"Name\"\r\n          label-for=\"form-name\"\r\n          label-cols-lg=\"2\"\r\n        >\r\n          <b-input-group>\r\n            <b-input-group-prepend is-text>\r\n              <feather-icon\r\n                icon=\"UserIcon\"\r\n              />\r\n            </b-input-group-prepend>\r\n            <b-form-input\r\n              id=\"form-name\"\r\n              :disabled=\"busy\"\r\n            />\r\n          </b-input-group>\r\n        </b-form-group>\r\n        <b-form-group\r\n          label=\"Email\"\r\n          label-for=\"form-mail\"\r\n          label-cols-lg=\"2\"\r\n        >\r\n          <b-input-group>\r\n            <b-input-group-prepend is-text>\r\n              <feather-icon icon=\"MailIcon\" />\r\n            </b-input-group-prepend>\r\n            <b-form-input\r\n              id=\"form-email\"\r\n              type=\"email\"\r\n              :disabled=\"busy\"\r\n            />\r\n          </b-input-group>\r\n        </b-form-group>\r\n        <b-form-group\r\n          label=\"Image\"\r\n          label-for=\"form-image\"\r\n          label-cols-lg=\"2\"\r\n        >\r\n          <b-input-group>\r\n            <b-input-group-prepend is-text>\r\n              <feather-icon icon=\"ImageIcon\" />\r\n            </b-input-group-prepend>\r\n            <b-form-file\r\n              id=\"form-image\"\r\n              :disabled=\"busy\"\r\n              accept=\"image/*\"\r\n            />\r\n          </b-input-group>\r\n        </b-form-group>\r\n        <div class=\"d-flex justify-content-center\">\r\n          <b-button\r\n            ref=\"submit\"\r\n            v-ripple.400=\"'rgba(255, 255, 255, 0.15)'\"\r\n            variant=\"primary\"\r\n            type=\"submit\"\r\n            :disabled=\"busy\"\r\n          >\r\n            Submit\r\n          </b-button>\r\n        </div>\r\n\r\n        <b-overlay\r\n          :show=\"busy\"\r\n          no-wrap\r\n          @shown=\"onShown\"\r\n          @hidden=\"onHidden\"\r\n        >\r\n          <template #overlay>\r\n            <div\r\n              v-if=\"processing\"\r\n              class=\"text-center p-3 bg-primary text-light rounded\"\r\n            >\r\n              <feather-icon\r\n                icon=\"UploadCloudIcon\"\r\n                size=\"20\"\r\n              />\r\n              <div class=\"mb-2\">\r\n                Processing...\r\n              </div>\r\n              <b-progress\r\n                min=\"1\"\r\n                max=\"20\"\r\n                :value=\"counter\"\r\n                variant=\"success\"\r\n                height=\"6px\"\r\n                class=\"mx-n3\"\r\n              />\r\n            </div>\r\n            <div\r\n              v-else\r\n              ref=\"dialog\"\r\n              tabindex=\"-1\"\r\n              role=\"dialog\"\r\n              aria-modal=\"false\"\r\n              aria-labelledby=\"form-confirm-label\"\r\n              class=\"text-center p-3\"\r\n            >\r\n              <b-card-text class=\"font-weight-bolder\">\r\n                Are you sure?\r\n              </b-card-text>\r\n              <div class=\"d-flex\">\r\n                <b-button\r\n                  v-ripple.400=\"'rgba(234, 84, 85, 0.15)'\"\r\n                  variant=\"outline-danger\"\r\n                  class=\"mr-3\"\r\n                  @click=\"onCancel\"\r\n                >\r\n                  Cancel\r\n                </b-button>\r\n                <b-button\r\n                  v-ripple.400=\"'rgba(40, 199, 111, 0.15)'\"\r\n                  variant=\"outline-success\"\r\n                  @click=\"onOK\"\r\n                >\r\n                  OK\r\n                </b-button>\r\n              </div>\r\n            </div>\r\n          </template>\r\n        </b-overlay>\r\n      </b-form>\r\n    </div>\r\n\r\n    <template #code>\r\n      {{ codeForm }}\r\n    </template>\r\n  </b-card-code>\r\n</template>\r\n\r\n<script>\r\nimport BCardCode from '@core/components/b-card-code'\r\nimport {\r\n  BButton,\r\n  BOverlay,\r\n  BForm,\r\n  BProgress,\r\n  BFormGroup,\r\n  BInputGroup,\r\n  BInputGroupPrepend,\r\n  BFormInput,\r\n  BFormFile,\r\n  BCardText,\r\n} from 'bootstrap-vue'\r\nimport Ripple from 'vue-ripple-directive'\r\nimport { codeForm } from './code'\r\n\r\nexport default {\r\n  components: {\r\n    BButton,\r\n    BOverlay,\r\n    BForm,\r\n    BProgress,\r\n    BFormGroup,\r\n    BInputGroup,\r\n    BCardCode,\r\n    BInputGroupPrepend,\r\n    BFormInput,\r\n    BFormFile,\r\n    BCardText,\r\n  },\r\n  directives: {\r\n    Ripple,\r\n  },\r\n  data() {\r\n    return {\r\n      busy: false,\r\n      processing: false,\r\n      counter: 1,\r\n      interval: null,\r\n      codeForm,\r\n    }\r\n  },\r\n  beforeDestroy() {\r\n    this.clearInterval()\r\n  },\r\n  methods: {\r\n    clearInterval() {\r\n      if (this.interval) {\r\n        clearInterval(this.interval)\r\n        this.interval = null\r\n      }\r\n    },\r\n    onShown() {\r\n      // Focus the dialog prompt\r\n      this.$refs.dialog.focus()\r\n    },\r\n    onHidden() {\r\n      // In this case, we return focus to the submit button\r\n      // You may need to alter this based on your application requirements\r\n      this.$refs.submit.focus()\r\n    },\r\n    onSubmit() {\r\n      this.processing = false\r\n      this.busy = true\r\n    },\r\n    onCancel() {\r\n      this.busy = false\r\n    },\r\n    onOK() {\r\n      this.counter = 1\r\n      this.processing = true\r\n      // Simulate an async request\r\n      this.clearInterval()\r\n      this.interval = setInterval(() => {\r\n        if (this.counter < 20) {\r\n          this.counter += 1\r\n        } else {\r\n          this.clearInterval()\r\n          this.$nextTick(() => {\r\n            // eslint-disable-next-line\r\n            this.busy = this.processing = false\r\n          })\r\n        }\r\n      }, 350)\r\n    },\r\n  },\r\n}\r\n</script>\r\n","import mod from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./OverlayForm.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./OverlayForm.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./OverlayForm.vue?vue&type=template&id=1a4927a1&\"\nimport script from \"./OverlayForm.vue?vue&type=script&lang=js&\"\nexport * from \"./OverlayForm.vue?vue&type=script&lang=js&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('b-card-code',{attrs:{\"title\":\"Busy state input group\"},scopedSlots:_vm._u([{key:\"code\",fn:function(){return [_vm._v(\" \"+_vm._s(_vm.codeBusyState)+\" \")]},proxy:true}])},[_c('b-card-text',[_vm._v(\"In this example, we obscure the input and button:\")]),_c('div',[_c('b-overlay',{attrs:{\"show\":_vm.busy,\"rounded\":\"lg\",\"opacity\":\"0.6\"},on:{\"hidden\":_vm.onHidden},scopedSlots:_vm._u([{key:\"overlay\",fn:function(){return [_c('div',{staticClass:\"d-flex align-items-center\"},[_c('b-spinner',{attrs:{\"small\":\"\",\"type\":\"grow\",\"variant\":\"secondary\"}}),_c('b-spinner',{attrs:{\"type\":\"grow\",\"variant\":\"dark\"}}),_c('b-spinner',{attrs:{\"small\":\"\",\"type\":\"grow\",\"variant\":\"secondary\"}}),_c('span',{staticClass:\"sr-only\"},[_vm._v(\"Please wait...\")])],1)]},proxy:true}])},[_c('b-input-group',{attrs:{\"size\":\"lg\",\"aria-hidden\":_vm.busy ? 'true' : null}},[_c('b-form-input',{attrs:{\"disabled\":_vm.busy},model:{value:(_vm.value),callback:function ($$v) {_vm.value=$$v},expression:\"value\"}}),_c('b-input-group-append',[_c('b-button',{directives:[{name:\"ripple\",rawName:\"v-ripple.400\",value:('rgba(255, 255, 255, 0.15)'),expression:\"'rgba(255, 255, 255, 0.15)'\",modifiers:{\"400\":true}}],ref:\"button\",attrs:{\"disabled\":_vm.busy,\"variant\":\"primary\"},on:{\"click\":_vm.onClick}},[_vm._v(\" Do something \")])],1)],1)],1)],1)],1)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\r\n  <b-card-code title=\"Busy state input group\">\r\n    <b-card-text>In this example, we obscure the input and button:</b-card-text>\r\n    <div>\r\n      <b-overlay\r\n        :show=\"busy\"\r\n        rounded=\"lg\"\r\n        opacity=\"0.6\"\r\n        @hidden=\"onHidden\"\r\n      >\r\n        <template #overlay>\r\n          <div class=\"d-flex align-items-center\">\r\n            <b-spinner\r\n              small\r\n              type=\"grow\"\r\n              variant=\"secondary\"\r\n            />\r\n            <b-spinner\r\n              type=\"grow\"\r\n              variant=\"dark\"\r\n            />\r\n            <b-spinner\r\n              small\r\n              type=\"grow\"\r\n              variant=\"secondary\"\r\n            />\r\n\r\n            <!-- We add an SR only text for screen readers -->\r\n            <span class=\"sr-only\">Please wait...</span>\r\n          </div>\r\n        </template>\r\n\r\n        <b-input-group\r\n          size=\"lg\"\r\n          :aria-hidden=\"busy ? 'true' : null\"\r\n        >\r\n          <b-form-input\r\n            v-model=\"value\"\r\n            :disabled=\"busy\"\r\n          />\r\n          <b-input-group-append>\r\n            <b-button\r\n              ref=\"button\"\r\n              v-ripple.400=\"'rgba(255, 255, 255, 0.15)'\"\r\n              :disabled=\"busy\"\r\n              variant=\"primary\"\r\n              @click=\"onClick\"\r\n            >\r\n              Do something\r\n            </b-button>\r\n          </b-input-group-append>\r\n        </b-input-group>\r\n      </b-overlay>\r\n    </div>\r\n\r\n    <template #code>\r\n      {{ codeBusyState }}\r\n    </template>\r\n  </b-card-code>\r\n</template>\r\n\r\n<script>\r\nimport BCardCode from '@core/components/b-card-code'\r\nimport {\r\n  BOverlay, BInputGroup, BFormInput, BInputGroupAppend, BButton, BSpinner, BCardText,\r\n} from 'bootstrap-vue'\r\nimport Ripple from 'vue-ripple-directive'\r\nimport { codeBusyState } from './code'\r\n\r\nexport default {\r\n  components: {\r\n    BOverlay,\r\n    BInputGroup,\r\n    BFormInput,\r\n    BInputGroupAppend,\r\n    BButton,\r\n    BCardText,\r\n    BSpinner,\r\n    BCardCode,\r\n  },\r\n  directives: {\r\n    Ripple,\r\n  },\r\n  data() {\r\n    return {\r\n      value: 'Some value',\r\n      busy: false,\r\n      timeout: null,\r\n      codeBusyState,\r\n    }\r\n  },\r\n  beforeDestroy() {\r\n    this.clearTimeout()\r\n  },\r\n  methods: {\r\n    clearTimeout() {\r\n      if (this.timeout) {\r\n        clearTimeout(this.timeout)\r\n        this.timeout = null\r\n      }\r\n    },\r\n    setTimeout(callback) {\r\n      this.clearTimeout()\r\n      this.timeout = setTimeout(() => {\r\n        this.clearTimeout()\r\n        callback()\r\n      }, 5000)\r\n    },\r\n    onHidden() {\r\n      // Return focus to the button\r\n      this.$refs.button.focus()\r\n    },\r\n    onClick() {\r\n      this.busy = true\r\n      // Simulate an async request\r\n      this.setTimeout(() => {\r\n        this.busy = false\r\n      })\r\n    },\r\n  },\r\n}\r\n</script>\r\n","import mod from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./OverlayBusyState.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./OverlayBusyState.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./OverlayBusyState.vue?vue&type=template&id=013111c5&\"\nimport script from \"./OverlayBusyState.vue?vue&type=script&lang=js&\"\nexport * from \"./OverlayBusyState.vue?vue&type=script&lang=js&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports","<template>\r\n  <b-row>\r\n    <b-col cols=\"12\">\r\n      <overlay-basic />\r\n      <overlay-backdrop />\r\n      <overlay-fade />\r\n      <overlay-spinner />\r\n      <overlay-corner-round />\r\n      <overlay-custom-content />\r\n      <overlay-no-wrap-mode />\r\n      <overlay-form />\r\n      <overlay-busy-state />\r\n    </b-col>\r\n  </b-row>\r\n</template>\r\n\r\n<script>\r\nimport { BRow, BCol } from 'bootstrap-vue'\r\nimport OverlayBasic from './OverlayBasic.vue'\r\nimport OverlayBackdrop from './OverlayBackdrop.vue'\r\nimport OverlayFade from './OverlayFade.vue'\r\nimport OverlaySpinner from './OverlaySpinner.vue'\r\nimport OverlayCornerRound from './OverlayCornerRound.vue'\r\nimport OverlayCustomContent from './OverlayCustomContent.vue'\r\nimport OverlayNoWrapMode from './OverlayNoWrapMode.vue'\r\nimport OverlayForm from './OverlayForm.vue'\r\nimport OverlayBusyState from './OverlayBusyState.vue'\r\n\r\nexport default {\r\n  components: {\r\n    BRow,\r\n    BCol,\r\n\r\n    OverlayBasic,\r\n    OverlayBackdrop,\r\n    OverlayFade,\r\n    OverlaySpinner,\r\n    OverlayCornerRound,\r\n    OverlayCustomContent,\r\n    OverlayNoWrapMode,\r\n    OverlayForm,\r\n    OverlayBusyState,\r\n  },\r\n}\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n@import '~@core/scss/base/bootstrap-extended/include';\r\n@import '~@core/scss/base/components/variables-dark';\r\n\r\n.dark-layout {\r\n  div ::v-deep .card .card-body {\r\n      .b-overlay {\r\n        .bg-light {\r\n          background-color: $theme-dark-body-bg !important;\r\n        }\r\n      }\r\n  }\r\n}\r\n</style>\r\n","import mod from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Overlay.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Overlay.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./Overlay.vue?vue&type=template&id=813c9d1e&scoped=true&\"\nimport script from \"./Overlay.vue?vue&type=script&lang=js&\"\nexport * from \"./Overlay.vue?vue&type=script&lang=js&\"\nimport style0 from \"./Overlay.vue?vue&type=style&index=0&id=813c9d1e&prod&lang=scss&scoped=true&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"813c9d1e\",\n  null\n  \n)\n\nexport default component.exports"],"sourceRoot":""}