{"version":3,"sources":["webpack:///./src/views/core/UiTooltips.vue","webpack:///src/views/core/UiTooltips.vue","webpack:///./src/views/core/UiTooltips.vue?b4dd","webpack:///./src/views/core/UiTooltips.vue?27ad"],"names":["render","_vm","this","_c","_self","attrs","scopedSlots","_u","key","fn","staticClass","_v","proxy","directives","name","rawName","modifiers","value","expression","staticStyle","staticRenderFns","mounted","core","index","component"],"mappings":"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","file":"js/chunk-2d0bacb6.4a9eb4de.js","sourcesContent":["var render = function render(){var _vm=this,_c=_vm._self._c;return _c('b-container',{attrs:{\"fluid\":\"\"}},[_c('b-row',[_c('b-col',{attrs:{\"lg\":\"6\",\"sm\":\"12\"}},[_c('iq-card',{scopedSlots:_vm._u([{key:\"headerTitle\",fn:function(){return [_c('h4',{staticClass:\"card-title\"},[_vm._v(\"Tooltips\")])]},proxy:true},{key:\"headerAction\",fn:function(){return [_c('a',{directives:[{name:\"b-toggle\",rawName:\"v-b-toggle.collapse-1\",modifiers:{\"collapse-1\":true}}],staticClass:\"text-primary float-right\",attrs:{\"role\":\"button\"}},[_c('i',{staticClass:\"ri-code-s-slash-line\"})])]},proxy:true},{key:\"body\",fn:function(){return [_c('p',[_vm._v(\"Hover over the buttons below to see the four tooltips directions: top, right, bottom, and left. The data-placement attribute specifies the tooltip position.\")]),_c('b-collapse',{staticClass:\"mb-2\",attrs:{\"id\":\"collapse-1\"}},[_c('div',{staticClass:\"card\"},[_c('kbd',{staticClass:\"bg-dark\"},[_c('pre',{staticClass:\"text-white\",attrs:{\"id\":\"tooltips-1\"}},[_vm._v(\"                    \"),_c('code',[_vm._v(\"\\n<b-button v-b-tooltip.top=\\\"'Tooltip on top'\\\" variant=\\\"secondary\\\" class=\\\"mt-3 mr-1\\\">Tooltip on top</b-button>\\n<b-button v-b-tooltip.right=\\\"'Tooltip on right'\\\" variant=\\\"secondary\\\" class=\\\"mt-3 mr-1\\\">Tooltip on right</b-button>\\n<b-button v-b-tooltip.bottom=\\\"'Tooltip on bottom'\\\" variant=\\\"secondary\\\" class=\\\"mt-3 mr-1\\\">Tooltip on bottom</b-button>\\n<b-button v-b-tooltip.left=\\\"'Tooltip on left'\\\" variant=\\\"secondary\\\" class=\\\"mt-3 mr-1\\\">Tooltip on left</b-button>\\n\")])])])])]),_c('b-button',{directives:[{name:\"b-tooltip\",rawName:\"v-b-tooltip.top\",value:('Tooltip on top'),expression:\"'Tooltip on top'\",modifiers:{\"top\":true}}],staticClass:\"mt-3 mr-1\",attrs:{\"variant\":\"secondary\"}},[_vm._v(\"Tooltip on top\")]),_c('b-button',{directives:[{name:\"b-tooltip\",rawName:\"v-b-tooltip.right\",value:('Tooltip on right'),expression:\"'Tooltip on right'\",modifiers:{\"right\":true}}],staticClass:\"mt-3 mr-1\",attrs:{\"variant\":\"secondary\"}},[_vm._v(\"Tooltip on right\")]),_c('b-button',{directives:[{name:\"b-tooltip\",rawName:\"v-b-tooltip.bottom\",value:('Tooltip on bottom'),expression:\"'Tooltip on bottom'\",modifiers:{\"bottom\":true}}],staticClass:\"mt-3 mr-1\",attrs:{\"variant\":\"secondary\"}},[_vm._v(\"Tooltip on bottom\")]),_c('b-button',{directives:[{name:\"b-tooltip\",rawName:\"v-b-tooltip.left\",value:('Tooltip on left'),expression:\"'Tooltip on left'\",modifiers:{\"left\":true}}],staticClass:\"mt-3 mr-1\",attrs:{\"variant\":\"secondary\"}},[_vm._v(\"Tooltip on left\")])]},proxy:true}])}),_c('iq-card',{scopedSlots:_vm._u([{key:\"headerTitle\",fn:function(){return [_c('h4',{staticClass:\"card-title\"},[_vm._v(\"Disabled elements\")])]},proxy:true},{key:\"headerAction\",fn:function(){return [_c('a',{directives:[{name:\"b-toggle\",rawName:\"v-b-toggle.collapse-2\",modifiers:{\"collapse-2\":true}}],staticClass:\"text-primary float-right\",attrs:{\"role\":\"button\"}},[_c('i',{staticClass:\"ri-code-s-slash-line\"})])]},proxy:true},{key:\"body\",fn:function(){return [_c('p',[_vm._v(\"Elements with the \"),_c('code',[_vm._v(\"disabled\")]),_vm._v(\" attribute aren’t interactive, meaning users cannot focus, hover, or click them to trigger a tooltip (or popover). As a workaround, you’ll want to trigger the tooltip from a wrapper \"),_c('code',[_vm._v(\"<div>\")]),_vm._v(\" or \"),_c('code',[_vm._v(\"<span>\")]),_vm._v(\", ideally made keyboard-focusable using \"),_c('code',[_vm._v(\"tabindex=\\\"0\\\"\")]),_vm._v(\", and override the \"),_c('code',[_vm._v(\"pointer-events\")]),_vm._v(\" on the disabled element.\")]),_c('b-collapse',{staticClass:\"mb-2\",attrs:{\"id\":\"collapse-2\"}},[_c('div',{staticClass:\"card\"},[_c('kbd',{staticClass:\"bg-dark\"},[_c('pre',{staticClass:\"text-white\",attrs:{\"id\":\"disabled-1\"}},[_vm._v(\"                    \"),_c('code',[_vm._v(\"\\n<span class=\\\"d-inline-block\\\" tabindex=\\\"0\\\" v-b-tooltip.top title=\\\"Disabled tooltip\\\">\\n  <b-button variant=\\\"primary\\\" style=\\\"pointer-events: none;\\\" disabled>Disabled button</b-button>\\n</span>\\n\")])])])])]),_c('span',{directives:[{name:\"b-tooltip\",rawName:\"v-b-tooltip.top\",modifiers:{\"top\":true}}],staticClass:\"d-inline-block\",attrs:{\"tabindex\":\"0\",\"title\":\"Disabled tooltip\"}},[_c('b-button',{staticStyle:{\"pointer-events\":\"none\"},attrs:{\"variant\":\"primary\",\"disabled\":\"\"}},[_vm._v(\"Disabled button\")])],1)]},proxy:true}])})],1),_c('b-col',{attrs:{\"lg\":\"6\",\"sm\":\"12\"}},[_c('iq-card',{scopedSlots:_vm._u([{key:\"headerTitle\",fn:function(){return [_c('h4',{staticClass:\"card-title\"},[_vm._v(\"Tooltips\")])]},proxy:true},{key:\"headerAction\",fn:function(){return [_c('a',{directives:[{name:\"b-toggle\",rawName:\"v-b-toggle.collapse-3\",modifiers:{\"collapse-3\":true}}],staticClass:\"text-primary float-right\",attrs:{\"role\":\"button\"}},[_c('i',{staticClass:\"ri-code-s-slash-line\"})])]},proxy:true},{key:\"body\",fn:function(){return [_c('p',[_vm._v(\"Hover over the buttons below to see the four tooltips directions: top, right, bottom, and left Using background colors\")]),_c('b-collapse',{staticClass:\"mb-2\",attrs:{\"id\":\"collapse-3\"}},[_c('div',{staticClass:\"card\"},[_c('kbd',{staticClass:\"bg-dark\"},[_c('pre',{staticClass:\"text-white\",attrs:{\"id\":\"tooltips-2\"}},[_vm._v(\"                    \"),_c('code',[_vm._v(\"\\n <b-button v-b-tooltip.top=\\\"'Tooltip on top'\\\" variant=\\\"primary\\\" class=\\\"mt-3 mr-1\\\">Tooltip on top</b-button>\\n<b-button v-b-tooltip.right=\\\"'Tooltip on right'\\\" variant=\\\"success\\\" class=\\\"mt-3 mr-1\\\">Tooltip on right</b-button>\\n<b-button v-b-tooltip.bottom=\\\"'Tooltip on bottom'\\\" variant=\\\"danger\\\" class=\\\"mt-3 mr-1\\\">Tooltip on bottom</b-button>\\n<b-button v-b-tooltip.left=\\\"'Tooltip on left'\\\" variant=\\\"info\\\" class=\\\"mt-3 mr-1\\\">Tooltip on left</b-button>\\n\")])])])])]),_c('b-button',{directives:[{name:\"b-tooltip\",rawName:\"v-b-tooltip.top\",value:('Tooltip on top'),expression:\"'Tooltip on top'\",modifiers:{\"top\":true}}],staticClass:\"mt-3 mr-1\",attrs:{\"variant\":\"primary\"}},[_vm._v(\"Tooltip on top\")]),_c('b-button',{directives:[{name:\"b-tooltip\",rawName:\"v-b-tooltip.right\",value:('Tooltip on right'),expression:\"'Tooltip on right'\",modifiers:{\"right\":true}}],staticClass:\"mt-3 mr-1\",attrs:{\"variant\":\"success\"}},[_vm._v(\"Tooltip on right\")]),_c('b-button',{directives:[{name:\"b-tooltip\",rawName:\"v-b-tooltip.bottom\",value:('Tooltip on bottom'),expression:\"'Tooltip on bottom'\",modifiers:{\"bottom\":true}}],staticClass:\"mt-3 mr-1\",attrs:{\"variant\":\"danger\"}},[_vm._v(\"Tooltip on bottom\")]),_c('b-button',{directives:[{name:\"b-tooltip\",rawName:\"v-b-tooltip.left\",value:('Tooltip on left'),expression:\"'Tooltip on left'\",modifiers:{\"left\":true}}],staticClass:\"mt-3 mr-1\",attrs:{\"variant\":\"info\"}},[_vm._v(\"Tooltip on left\")])]},proxy:true}])}),_c('iq-card',{scopedSlots:_vm._u([{key:\"headerTitle\",fn:function(){return [_c('h4',{staticClass:\"card-title\"},[_vm._v(\"Tooltips\")])]},proxy:true},{key:\"headerAction\",fn:function(){return [_c('a',{directives:[{name:\"b-toggle\",rawName:\"v-b-toggle.collapse-4\",modifiers:{\"collapse-4\":true}}],staticClass:\"text-primary float-right\",attrs:{\"role\":\"button\"}},[_c('i',{staticClass:\"ri-code-s-slash-line\"})])]},proxy:true},{key:\"body\",fn:function(){return [_c('p',[_vm._v(\"Hover over the buttons below to see the four tooltips directions: top, right, bottom, and left Using Light background colors\")]),_c('b-collapse',{staticClass:\"mb-2\",attrs:{\"id\":\"collapse-4\"}},[_c('div',{staticClass:\"card\"},[_c('kbd',{staticClass:\"bg-dark\"},[_c('pre',{staticClass:\"text-white\",attrs:{\"id\":\"tooltips-2\"}},[_vm._v(\"                    \"),_c('code',[_vm._v(\"\\n<b-button v-b-tooltip.top=\\\"'Tooltip on top'\\\" variant=\\\"none\\\" class=\\\"iq-bg-primary mt-3\\\">Tooltip on top</b-button>\\n<b-button v-b-tooltip.right=\\\"'Tooltip on right'\\\" variant=\\\"none\\\" class=\\\"iq-bg-success mt-3\\\">Tooltip on right</b-button>\\n<b-button v-b-tooltip.bottom=\\\"'Tooltip on bottom'\\\" variant=\\\"none\\\" class=\\\"iq-bg-danger mt-3\\\">Tooltip on bottom</b-button>\\n<b-button v-b-tooltip.left=\\\"'Tooltip on left'\\\" variant=\\\"none\\\" class=\\\"iq-bg-info mt-3\\\">Tooltip on left</b-button>\\n\")])])])])]),_c('b-button',{directives:[{name:\"b-tooltip\",rawName:\"v-b-tooltip.top\",value:('Tooltip on top'),expression:\"'Tooltip on top'\",modifiers:{\"top\":true}}],staticClass:\"iq-bg-primary mt-3 mr-1\",attrs:{\"variant\":\"none\"}},[_vm._v(\"Tooltip on top\")]),_c('b-button',{directives:[{name:\"b-tooltip\",rawName:\"v-b-tooltip.right\",value:('Tooltip on right'),expression:\"'Tooltip on right'\",modifiers:{\"right\":true}}],staticClass:\"iq-bg-success mt-3 mr-1\",attrs:{\"variant\":\"none\"}},[_vm._v(\"Tooltip on right\")]),_c('b-button',{directives:[{name:\"b-tooltip\",rawName:\"v-b-tooltip.bottom\",value:('Tooltip on bottom'),expression:\"'Tooltip on bottom'\",modifiers:{\"bottom\":true}}],staticClass:\"iq-bg-danger mt-3 mr-1\",attrs:{\"variant\":\"none\"}},[_vm._v(\"Tooltip on bottom\")]),_c('b-button',{directives:[{name:\"b-tooltip\",rawName:\"v-b-tooltip.left\",value:('Tooltip on left'),expression:\"'Tooltip on left'\",modifiers:{\"left\":true}}],staticClass:\"iq-bg-info mt-3 mr-1\",attrs:{\"variant\":\"none\"}},[_vm._v(\"Tooltip on left\")])]},proxy:true}])})],1),_c('b-col',{attrs:{\"lg\":\"12\"}},[_c('iq-card',{scopedSlots:_vm._u([{key:\"headerTitle\",fn:function(){return [_c('h4',{staticClass:\"card-title\"},[_vm._v(\"Hover elements\")])]},proxy:true},{key:\"headerAction\",fn:function(){return [_c('a',{directives:[{name:\"b-toggle\",rawName:\"v-b-toggle.collapse-5\",modifiers:{\"collapse-5\":true}}],staticClass:\"text-primary float-right\",attrs:{\"role\":\"button\"}},[_c('i',{staticClass:\"ri-code-s-slash-line\"})])]},proxy:true},{key:\"body\",fn:function(){return [_c('p',[_vm._v(\"Hover over the buttons below to see the tooltip.\")]),_c('b-collapse',{staticClass:\"mb-2\",attrs:{\"id\":\"collapse-5\"}},[_c('div',{staticClass:\"card\"},[_c('kbd',{staticClass:\"bg-dark\"},[_c('pre',{staticClass:\"text-white\",attrs:{\"id\":\"tooltips-5\"}},[_vm._v(\"                    \"),_c('code',[_vm._v(\"\\n<b-button href=\\\"#\\\" v-b-tooltip.hover=\\\"'Some tooltip text!'\\\" variant=\\\"link\\\" >Hover over me</b-button>\\n\")])])])])]),_c('b-button',{directives:[{name:\"b-tooltip\",rawName:\"v-b-tooltip.hover\",value:('Some tooltip text!'),expression:\"'Some tooltip text!'\",modifiers:{\"hover\":true}}],attrs:{\"href\":\"#\",\"variant\":\"link\"}},[_vm._v(\"Hover over me\")])]},proxy:true}])})],1)],1)],1)\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <b-container fluid>\n    <b-row>\n      <b-col lg=\"6\" sm=\"12\">\n        <iq-card>\n          <template v-slot:headerTitle>\n            <h4 class=\"card-title\">Tooltips</h4>\n          </template>\n          <template v-slot:headerAction>\n            <a class=\"text-primary float-right\" v-b-toggle.collapse-1 role=\"button\">\n              <i class=\"ri-code-s-slash-line\" />\n            </a>\n          </template>\n          <template v-slot:body>\n            <p>Hover over the buttons below to see the four tooltips directions: top, right, bottom, and left. The data-placement attribute specifies the tooltip position.</p>\n            <b-collapse id=\"collapse-1\" class=\"mb-2\">\n              <div class=\"card\">\n                <kbd class=\"bg-dark\">\n                  <pre class=\"text-white\" id=\"tooltips-1\">\n                    <code>\n&lt;b-button v-b-tooltip.top=\"'Tooltip on top'\" variant=\"secondary\" class=\"mt-3 mr-1\"&gt;Tooltip on top&lt;/b-button&gt;\n&lt;b-button v-b-tooltip.right=\"'Tooltip on right'\" variant=\"secondary\" class=\"mt-3 mr-1\"&gt;Tooltip on right&lt;/b-button&gt;\n&lt;b-button v-b-tooltip.bottom=\"'Tooltip on bottom'\" variant=\"secondary\" class=\"mt-3 mr-1\"&gt;Tooltip on bottom&lt;/b-button&gt;\n&lt;b-button v-b-tooltip.left=\"'Tooltip on left'\" variant=\"secondary\" class=\"mt-3 mr-1\"&gt;Tooltip on left&lt;/b-button&gt;\n</code></pre>\n                </kbd>\n              </div>\n            </b-collapse>\n            <b-button v-b-tooltip.top=\"'Tooltip on top'\" variant=\"secondary\" class=\"mt-3 mr-1\">Tooltip on top</b-button>\n            <b-button v-b-tooltip.right=\"'Tooltip on right'\" variant=\"secondary\" class=\"mt-3 mr-1\">Tooltip on right</b-button>\n            <b-button v-b-tooltip.bottom=\"'Tooltip on bottom'\" variant=\"secondary\" class=\"mt-3 mr-1\">Tooltip on bottom</b-button>\n            <b-button v-b-tooltip.left=\"'Tooltip on left'\" variant=\"secondary\" class=\"mt-3 mr-1\">Tooltip on left</b-button>\n          </template>\n        </iq-card>\n        <iq-card>\n          <template v-slot:headerTitle>\n            <h4 class=\"card-title\">Disabled elements</h4>\n          </template>\n          <template v-slot:headerAction>\n            <a class=\"text-primary float-right\" v-b-toggle.collapse-2 role=\"button\">\n              <i class=\"ri-code-s-slash-line\" />\n            </a>\n          </template>\n          <template v-slot:body>\n            <p>Elements with the <code>disabled</code> attribute aren’t interactive, meaning users cannot focus, hover, or click them to trigger a tooltip (or popover). As a workaround, you’ll want to trigger the tooltip from a wrapper <code>&lt;div&gt;</code> or <code>&lt;span&gt;</code>, ideally made keyboard-focusable using <code>tabindex=\"0\"</code>, and override the <code>pointer-events</code> on the disabled element.</p>\n            <b-collapse id=\"collapse-2\" class=\"mb-2\">\n              <div class=\"card\">\n                <kbd class=\"bg-dark\">\n                  <pre class=\"text-white\" id=\"disabled-1\">\n                    <code>\n&lt;span class=\"d-inline-block\" tabindex=\"0\" v-b-tooltip.top title=\"Disabled tooltip\"&gt;\n  &lt;b-button variant=\"primary\" style=\"pointer-events: none;\" disabled&gt;Disabled button&lt;/b-button&gt;\n&lt;/span&gt;\n</code></pre>\n                </kbd>\n              </div>\n            </b-collapse>\n            <span class=\"d-inline-block\" tabindex=\"0\" v-b-tooltip.top title=\"Disabled tooltip\">\n              <b-button variant=\"primary\" style=\"pointer-events: none;\" disabled>Disabled button</b-button>\n            </span>\n          </template>\n        </iq-card>\n      </b-col>\n      <b-col lg=\"6\" sm=\"12\">\n        <iq-card>\n          <template v-slot:headerTitle>\n            <h4 class=\"card-title\">Tooltips</h4>\n          </template>\n          <template v-slot:headerAction>\n            <a class=\"text-primary float-right\" v-b-toggle.collapse-3 role=\"button\">\n              <i class=\"ri-code-s-slash-line\" />\n            </a>\n          </template>\n          <template v-slot:body>\n            <p>Hover over the buttons below to see the four tooltips directions: top, right, bottom, and left Using background colors</p>\n            <b-collapse id=\"collapse-3\" class=\"mb-2\">\n              <div class=\"card\">\n                <kbd class=\"bg-dark\">\n                  <pre class=\"text-white\" id=\"tooltips-2\">\n                    <code>\n &lt;b-button v-b-tooltip.top=\"'Tooltip on top'\" variant=\"primary\" class=\"mt-3 mr-1\"&gt;Tooltip on top&lt;/b-button&gt;\n&lt;b-button v-b-tooltip.right=\"'Tooltip on right'\" variant=\"success\" class=\"mt-3 mr-1\"&gt;Tooltip on right&lt;/b-button&gt;\n&lt;b-button v-b-tooltip.bottom=\"'Tooltip on bottom'\" variant=\"danger\" class=\"mt-3 mr-1\"&gt;Tooltip on bottom&lt;/b-button&gt;\n&lt;b-button v-b-tooltip.left=\"'Tooltip on left'\" variant=\"info\" class=\"mt-3 mr-1\"&gt;Tooltip on left&lt;/b-button&gt;\n</code></pre>\n                </kbd>\n              </div>\n            </b-collapse>\n            <b-button v-b-tooltip.top=\"'Tooltip on top'\" variant=\"primary\" class=\"mt-3 mr-1\">Tooltip on top</b-button>\n            <b-button v-b-tooltip.right=\"'Tooltip on right'\" variant=\"success\" class=\"mt-3 mr-1\">Tooltip on right</b-button>\n            <b-button v-b-tooltip.bottom=\"'Tooltip on bottom'\" variant=\"danger\" class=\"mt-3 mr-1\">Tooltip on bottom</b-button>\n            <b-button v-b-tooltip.left=\"'Tooltip on left'\" variant=\"info\" class=\"mt-3 mr-1\">Tooltip on left</b-button>\n          </template>\n        </iq-card>\n        <iq-card>\n          <template v-slot:headerTitle>\n            <h4 class=\"card-title\">Tooltips</h4>\n          </template>\n          <template v-slot:headerAction>\n            <a class=\"text-primary float-right\" v-b-toggle.collapse-4 role=\"button\">\n              <i class=\"ri-code-s-slash-line\" />\n            </a>\n          </template>\n          <template v-slot:body>\n            <p>Hover over the buttons below to see the four tooltips directions: top, right, bottom, and left Using Light background colors</p>\n            <b-collapse id=\"collapse-4\" class=\"mb-2\">\n              <div class=\"card\">\n                <kbd class=\"bg-dark\">\n                  <pre class=\"text-white\" id=\"tooltips-2\">\n                    <code>\n&lt;b-button v-b-tooltip.top=\"'Tooltip on top'\" variant=\"none\" class=\"iq-bg-primary mt-3\"&gt;Tooltip on top&lt;/b-button&gt;\n&lt;b-button v-b-tooltip.right=\"'Tooltip on right'\" variant=\"none\" class=\"iq-bg-success mt-3\"&gt;Tooltip on right&lt;/b-button&gt;\n&lt;b-button v-b-tooltip.bottom=\"'Tooltip on bottom'\" variant=\"none\" class=\"iq-bg-danger mt-3\"&gt;Tooltip on bottom&lt;/b-button&gt;\n&lt;b-button v-b-tooltip.left=\"'Tooltip on left'\" variant=\"none\" class=\"iq-bg-info mt-3\"&gt;Tooltip on left&lt;/b-button&gt;\n</code></pre>\n                </kbd>\n              </div>\n            </b-collapse>\n            <b-button v-b-tooltip.top=\"'Tooltip on top'\" variant=\"none\" class=\"iq-bg-primary mt-3 mr-1\">Tooltip on top</b-button>\n            <b-button v-b-tooltip.right=\"'Tooltip on right'\" variant=\"none\" class=\"iq-bg-success mt-3  mr-1\">Tooltip on right</b-button>\n            <b-button v-b-tooltip.bottom=\"'Tooltip on bottom'\" variant=\"none\" class=\"iq-bg-danger mt-3  mr-1\">Tooltip on bottom</b-button>\n            <b-button v-b-tooltip.left=\"'Tooltip on left'\" variant=\"none\" class=\"iq-bg-info mt-3  mr-1\">Tooltip on left</b-button>\n          </template>\n        </iq-card>\n      </b-col>\n      <b-col lg=\"12\">\n        <iq-card>\n          <template v-slot:headerTitle>\n            <h4 class=\"card-title\">Hover elements</h4>\n          </template>\n          <template v-slot:headerAction>\n            <a class=\"text-primary float-right\" v-b-toggle.collapse-5 role=\"button\">\n              <i class=\"ri-code-s-slash-line\" />\n            </a>\n          </template>\n          <template v-slot:body>\n            <p>Hover over the buttons below to see the tooltip.</p>\n            <b-collapse id=\"collapse-5\" class=\"mb-2\">\n              <div class=\"card\">\n                <kbd class=\"bg-dark\">\n                  <pre class=\"text-white\" id=\"tooltips-5\">\n                    <code>\n&lt;b-button href=\"#\" v-b-tooltip.hover=\"'Some tooltip text!'\" variant=\"link\" &gt;Hover over me&lt;/b-button&gt;\n</code></pre>\n                </kbd>\n              </div>\n            </b-collapse>\n            <b-button href=\"#\" v-b-tooltip.hover=\"'Some tooltip text!'\" variant=\"link\" >Hover over me</b-button>\n          </template>\n        </iq-card>\n      </b-col>\n    </b-row>\n  </b-container>\n</template>\n<script>\nimport { core } from '../../config/pluginInit'\n\nexport default {\n  name: 'UiTooltips',\n  mounted () {\n    core.index()\n  }\n}\n</script>\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!./UiTooltips.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!./UiTooltips.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./UiTooltips.vue?vue&type=template&id=00b09f9c&\"\nimport script from \"./UiTooltips.vue?vue&type=script&lang=js&\"\nexport * from \"./UiTooltips.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"],"sourceRoot":""}