{"version":3,"sources":["webpack:///./src/view/pages/vuetify/Alerts.vue","webpack:///src/view/pages/vuetify/Alerts.vue","webpack:///./src/view/pages/vuetify/Alerts.vue?9b28","webpack:///./src/view/pages/vuetify/Alerts.vue?59ad","webpack:///./src/view/content/CodePreview.vue","webpack:///./src/view/content/Card.vue","webpack:///src/view/content/Card.vue","webpack:///./src/view/content/Card.vue?8715","webpack:///./src/view/content/Card.vue?eb51","webpack:///src/view/content/CodePreview.vue","webpack:///./src/view/content/CodePreview.vue?e189","webpack:///./src/view/content/CodePreview.vue?e254"],"names":["staticClass","attrs","_c","_vm","scopedSlots","key","_v","fn","proxy","model","value","alert","expression","render","data","code1","html","code2","code3","js","code4","components","KTCodePreview","mounted","$store","dispatch","SET_BREADCRUMB","title","route","component","staticRenderFns","this","_self","ref","_u","hasTitleSlot","_t","directives","name","rawName","modifiers","hasGeneralCode","hasSingleCodeType","_e","hasHtmlCode","on","setActiveTab","hasJsCode","hasScssCode","tabIndex","callback","$$v","class","classes","headClass","_s","bodyClass","bodyFit","bodyFluid","hasFootSlot","props","String","headSize","fluidHeight","Boolean","fluidHalfHeight","headOverlay","cardClass","example","methods","computed","cls","headSizeClass","$slots","concat","isOpen","KTCard","_this","$nextTick","KTLayoutExamples","init","$el","hljs","querySelectorAll","forEach","hl","classList","add","remove","event","tab","target","closest","links","i","length","parseInt","getAttribute","_this2","exist","type","hasOwnProperty"],"mappings":"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","file":"js/chunk-376b5904.6214da33.js","sourcesContent":["var render = function render(){var _vm=this,_c=_vm._self._c;return _c('div',[_c('b-alert',{staticClass:\"alert alert-custom alert-white alert-shadow fade show gutter-b\",attrs:{\"show\":\"\",\"variant\":\"light\"}},[_c('div',{staticClass:\"alert-icon\"},[_c('span',{staticClass:\"svg-icon svg-icon-lg\"},[_c('inline-svg',{attrs:{\"src\":\"media/svg/icons/Tools/Compass.svg\"}})],1)]),_c('div',{staticClass:\"alert-text\"},[_c('b',[_vm._v(\"Alerts\")]),_vm._v(\" The \"),_c('code',[_vm._v(\"v-alert\")]),_vm._v(\" component is used to convey important information to the user through the use contextual types icons and color. These default types come in in 4 variations: success, info, warning, and error. Default icons are assigned which help represent different actions each type portrays. Many parts of an alert such as \"),_c('code',[_vm._v(\"border\")]),_vm._v(\", \"),_c('code',[_vm._v(\"icon\")]),_vm._v(\", and \"),_c('code',[_vm._v(\"color\")]),_vm._v(\" can also be customized to fit almost any situation. \"),_c('a',{staticClass:\"font-weight-bold\",attrs:{\"href\":\"https://vuetifyjs.com/en/components/alerts\",\"target\":\"_blank\"}},[_vm._v(\" See documentation. \")])])]),_c('div',{staticClass:\"row\"},[_c('div',{staticClass:\"col-md-12\"},[_c('KTCodePreview',{attrs:{\"title\":'Type'},scopedSlots:_vm._u([{key:\"preview\",fn:function(){return [_c('div',[_c('v-alert',{attrs:{\"type\":\"success\"}},[_vm._v(\" I'm a success alert. \")]),_c('v-alert',{attrs:{\"type\":\"info\"}},[_vm._v(\" I'm an info alert. \")]),_c('v-alert',{attrs:{\"type\":\"warning\"}},[_vm._v(\" I'm a warning alert. \")]),_c('v-alert',{attrs:{\"type\":\"error\"}},[_vm._v(\" I'm an error alert. \")])],1)]},proxy:true},{key:\"html\",fn:function(){return [_vm._v(\" \"+_vm._s(_vm.code1.html)+\" \")]},proxy:true}])}),_c('KTCodePreview',{attrs:{\"title\":'Colored Border'},scopedSlots:_vm._u([{key:\"preview\",fn:function(){return [_c('div',[_c('v-alert',{attrs:{\"border\":\"left\",\"colored-border\":\"\",\"color\":\"deep-purple accent-4\",\"elevation\":\"2\"}},[_vm._v(\" Aliquam eu nunc. Fusce commodo aliquam arcu. In consectetuer turpis ut velit. Nulla facilisi.. Morbi mollis tellus ac sapien. Fusce vel dui. Praesent ut ligula non mi varius sagittis. Vivamus consectetuer hendrerit lacus. Suspendisse enim turpis, dictum sed, iaculis a, condimentum nec, nisi. \")]),_c('v-alert',{attrs:{\"border\":\"top\",\"colored-border\":\"\",\"type\":\"info\",\"elevation\":\"2\"}},[_vm._v(\" Vestibulum ullamcorper mauris at ligula. Nam pretium turpis et arcu. Ut varius tincidunt libero. Curabitur ligula sapien, tincidunt non, euismod vitae, posuere imperdiet, leo. Morbi nec metus. \")]),_c('v-alert',{attrs:{\"border\":\"bottom\",\"colored-border\":\"\",\"type\":\"warning\",\"elevation\":\"2\"}},[_vm._v(\" Sed in libero ut nibh placerat accumsan. Phasellus leo dolor, tempus non, auctor et, hendrerit quis, nisi. Phasellus leo dolor, tempus non, auctor et, hendrerit quis, nisi. Sed consequat, leo eget bibendum sodales, augue velit cursus nunc, quis gravida magna mi a libero. Donec elit libero, sodales nec, volutpat a, suscipit non, turpis. \")]),_c('v-alert',{attrs:{\"border\":\"right\",\"colored-border\":\"\",\"type\":\"error\",\"elevation\":\"2\"}},[_vm._v(\" Fusce commodo aliquam arcu. Pellentesque posuere. Phasellus tempus. Donec posuere vulputate arcu. \")])],1)]},proxy:true},{key:\"html\",fn:function(){return [_vm._v(\" \"+_vm._s(_vm.code3.html)+\" \")]},proxy:true}])})],1)]),_c('div',{staticClass:\"row\"},[_c('div',{staticClass:\"col-md-12\"},[_c('KTCodePreview',{attrs:{\"title\":'Border'},scopedSlots:_vm._u([{key:\"preview\",fn:function(){return [_c('div',[_c('v-alert',{attrs:{\"border\":\"top\",\"color\":\"red lighten-2\",\"dark\":\"\"}},[_vm._v(\" I'm an alert with a top border and red color \")]),_c('v-alert',{attrs:{\"border\":\"right\",\"color\":\"blue-grey\",\"dark\":\"\"}},[_vm._v(\" I'm an alert with a right border and blue-grey color \")]),_c('v-alert',{attrs:{\"border\":\"bottom\",\"color\":\"pink darken-1\",\"dark\":\"\"}},[_vm._v(\" I'm an alert with a bottom border and pink color \")]),_c('v-alert',{attrs:{\"border\":\"left\",\"color\":\"indigo\",\"dark\":\"\"}},[_vm._v(\" I'm an alert with a border left type info \")])],1)]},proxy:true},{key:\"html\",fn:function(){return [_vm._v(\" \"+_vm._s(_vm.code2.html)+\" \")]},proxy:true}])}),_c('KTCodePreview',{attrs:{\"title\":'Dismissible'},scopedSlots:_vm._u([{key:\"preview\",fn:function(){return [_c('div',[_c('v-alert',{attrs:{\"border\":\"left\",\"close-text\":\"Close Alert\",\"color\":\"deep-purple accent-4\",\"dark\":\"\",\"dismissible\":\"\"},model:{value:(_vm.alert),callback:function ($$v) {_vm.alert=$$v},expression:\"alert\"}},[_vm._v(\" Aenean imperdiet. Quisque id odio. Cras dapibus. Pellentesque ut neque. Cras dapibus. Vivamus consectetuer hendrerit lacus. Sed mollis, eros et ultrices tempus, mauris ipsum aliquam libero, non adipiscing dolor urna a orci. Sed mollis, eros et ultrices tempus, mauris ipsum aliquam libero, non adipiscing dolor urna a orci. Curabitur blandit mollis lacus. Curabitur ligula sapien, tincidunt non, euismod vitae, posuere imperdiet, leo. \")]),_c('div',{staticClass:\"text-center\"},[(!_vm.alert)?_c('v-btn',{attrs:{\"color\":\"deep-purple accent-4\",\"dark\":\"\"},on:{\"click\":function($event){_vm.alert = true}}},[_vm._v(\" Reset \")]):_vm._e()],1)],1)]},proxy:true},{key:\"html\",fn:function(){return [_vm._v(\" \"+_vm._s(_vm.code4.html)+\" \")]},proxy:true},{key:\"js\",fn:function(){return [_vm._v(\" \"+_vm._s(_vm.code4.js)+\" \")]},proxy:true}])})],1)])],1)\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <div>\n    <b-alert\n      show\n      variant=\"light\"\n      class=\"alert alert-custom alert-white alert-shadow fade show gutter-b\"\n    >\n      <div class=\"alert-icon\">\n        <span class=\"svg-icon svg-icon-lg\">\n          <inline-svg src=\"media/svg/icons/Tools/Compass.svg\" />\n        </span>\n      </div>\n      <div class=\"alert-text\">\n        <b>Alerts</b> The <code>v-alert</code> component is used to convey\n        important information to the user through the use contextual types icons\n        and color. These default types come in in 4 variations: success, info,\n        warning, and error. Default icons are assigned which help represent\n        different actions each type portrays. Many parts of an alert such as\n        <code>border</code>, <code>icon</code>, and <code>color</code> can also\n        be customized to fit almost any situation.\n        <a\n          class=\"font-weight-bold\"\n          href=\"https://vuetifyjs.com/en/components/alerts\"\n          target=\"_blank\"\n        >\n          See documentation.\n        </a>\n      </div>\n    </b-alert>\n\n    <div class=\"row\">\n      <div class=\"col-md-12\">\n        <KTCodePreview v-bind:title=\"'Type'\">\n          <template v-slot:preview>\n            <div>\n              <v-alert type=\"success\"> I'm a success alert. </v-alert>\n\n              <v-alert type=\"info\"> I'm an info alert. </v-alert>\n\n              <v-alert type=\"warning\"> I'm a warning alert. </v-alert>\n\n              <v-alert type=\"error\"> I'm an error alert. </v-alert>\n            </div>\n          </template>\n          <template v-slot:html>\n            {{ code1.html }}\n          </template>\n        </KTCodePreview>\n\n        <KTCodePreview v-bind:title=\"'Colored Border'\">\n          <template v-slot:preview>\n            <div>\n              <v-alert\n                border=\"left\"\n                colored-border\n                color=\"deep-purple accent-4\"\n                elevation=\"2\"\n              >\n                Aliquam eu nunc. Fusce commodo aliquam arcu. In consectetuer\n                turpis ut velit. Nulla facilisi.. Morbi mollis tellus ac sapien.\n                Fusce vel dui. Praesent ut ligula non mi varius sagittis.\n                Vivamus consectetuer hendrerit lacus. Suspendisse enim turpis,\n                dictum sed, iaculis a, condimentum nec, nisi.\n              </v-alert>\n              <v-alert border=\"top\" colored-border type=\"info\" elevation=\"2\">\n                Vestibulum ullamcorper mauris at ligula. Nam pretium turpis et\n                arcu. Ut varius tincidunt libero. Curabitur ligula sapien,\n                tincidunt non, euismod vitae, posuere imperdiet, leo. Morbi nec\n                metus.\n              </v-alert>\n              <v-alert\n                border=\"bottom\"\n                colored-border\n                type=\"warning\"\n                elevation=\"2\"\n              >\n                Sed in libero ut nibh placerat accumsan. Phasellus leo dolor,\n                tempus non, auctor et, hendrerit quis, nisi. Phasellus leo\n                dolor, tempus non, auctor et, hendrerit quis, nisi. Sed\n                consequat, leo eget bibendum sodales, augue velit cursus nunc,\n                quis gravida magna mi a libero. Donec elit libero, sodales nec,\n                volutpat a, suscipit non, turpis.\n              </v-alert>\n              <v-alert border=\"right\" colored-border type=\"error\" elevation=\"2\">\n                Fusce commodo aliquam arcu. Pellentesque posuere. Phasellus\n                tempus. Donec posuere vulputate arcu.\n              </v-alert>\n            </div>\n          </template>\n          <template v-slot:html>\n            {{ code3.html }}\n          </template>\n        </KTCodePreview>\n      </div>\n    </div>\n\n    <div class=\"row\">\n      <div class=\"col-md-12\">\n        <KTCodePreview v-bind:title=\"'Border'\">\n          <template v-slot:preview>\n            <div>\n              <v-alert border=\"top\" color=\"red lighten-2\" dark>\n                I'm an alert with a top border and red color\n              </v-alert>\n              <v-alert border=\"right\" color=\"blue-grey\" dark>\n                I'm an alert with a right border and blue-grey color\n              </v-alert>\n              <v-alert border=\"bottom\" color=\"pink darken-1\" dark>\n                I'm an alert with a bottom border and pink color\n              </v-alert>\n              <v-alert border=\"left\" color=\"indigo\" dark>\n                I'm an alert with a border left type info\n              </v-alert>\n            </div>\n          </template>\n          <template v-slot:html>\n            {{ code2.html }}\n          </template>\n        </KTCodePreview>\n\n        <KTCodePreview v-bind:title=\"'Dismissible'\">\n          <template v-slot:preview>\n            <div>\n              <v-alert\n                v-model=\"alert\"\n                border=\"left\"\n                close-text=\"Close Alert\"\n                color=\"deep-purple accent-4\"\n                dark\n                dismissible\n              >\n                Aenean imperdiet. Quisque id odio. Cras dapibus. Pellentesque ut\n                neque. Cras dapibus. Vivamus consectetuer hendrerit lacus. Sed\n                mollis, eros et ultrices tempus, mauris ipsum aliquam libero,\n                non adipiscing dolor urna a orci. Sed mollis, eros et ultrices\n                tempus, mauris ipsum aliquam libero, non adipiscing dolor urna a\n                orci. Curabitur blandit mollis lacus. Curabitur ligula sapien,\n                tincidunt non, euismod vitae, posuere imperdiet, leo.\n              </v-alert>\n              <div class=\"text-center\">\n                <v-btn\n                  v-if=\"!alert\"\n                  color=\"deep-purple accent-4\"\n                  dark\n                  @click=\"alert = true\"\n                >\n                  Reset\n                </v-btn>\n              </div>\n            </div>\n          </template>\n          <template v-slot:html>\n            {{ code4.html }}\n          </template>\n          <template v-slot:js>\n            {{ code4.js }}\n          </template>\n        </KTCodePreview>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script>\nimport KTCodePreview from \"@/view/content/CodePreview.vue\";\nimport { SET_BREADCRUMB } from \"@/core/services/store/breadcrumbs.module\";\n\nexport default {\n  data() {\n    return {\n      code1: {\n        html: `<div>\n  <v-alert type=\"success\">\n    I'm a success alert.\n  </v-alert>\n\n  <v-alert type=\"info\">\n    I'm an info alert.\n  </v-alert>\n\n  <v-alert type=\"warning\">\n    I'm a warning alert.\n  </v-alert>\n\n  <v-alert type=\"error\">\n    I'm an error alert.\n  </v-alert>\n</div>`,\n      },\n\n      code2: {\n        html: `<div>\n  <v-alert\n    border=\"top\"\n    color=\"red lighten-2\"\n    dark\n  >\n    I'm an alert with a top border and red color\n  </v-alert>\n  <v-alert\n    border=\"right\"\n    color=\"blue-grey\"\n    dark\n  >\n    I'm an alert with a right border and blue-grey color\n  </v-alert>\n  <v-alert\n    border=\"bottom\"\n    color=\"pink darken-1\"\n    dark\n  >\n    I'm an alert with a bottom border and pink color\n  </v-alert>\n  <v-alert\n    border=\"left\"\n    color=\"indigo\"\n    dark\n  >\n    I'm an alert with a border left type info\n  </v-alert>\n</div>`,\n      },\n\n      code3: {\n        html: ` <div>\n  <v-alert\n    border=\"left\"\n    colored-border\n    color=\"deep-purple accent-4\"\n    elevation=\"2\"\n  >\n    Aliquam eu nunc. Fusce commodo aliquam arcu. In consectetuer turpis ut velit. Nulla facilisi..\n\n    Morbi mollis tellus ac sapien. Fusce vel dui. Praesent ut ligula non mi varius sagittis. Vivamus consectetuer hendrerit lacus. Suspendisse enim turpis, dictum sed, iaculis a, condimentum nec, nisi.\n  </v-alert>\n  <v-alert\n    border=\"top\"\n    colored-border\n    type=\"info\"\n    elevation=\"2\"\n  >\n    Vestibulum ullamcorper mauris at ligula. Nam pretium turpis et arcu. Ut varius tincidunt libero. Curabitur ligula sapien, tincidunt non, euismod vitae, posuere imperdiet, leo. Morbi nec metus.\n  </v-alert>\n  <v-alert\n    border=\"bottom\"\n    colored-border\n    type=\"warning\"\n    elevation=\"2\"\n  >\n    Sed in libero ut nibh placerat accumsan. Phasellus leo dolor, tempus non, auctor et, hendrerit quis, nisi. Phasellus leo dolor, tempus non, auctor et, hendrerit quis, nisi. Sed consequat, leo eget bibendum sodales, augue velit cursus nunc, quis gravida magna mi a libero. Donec elit libero, sodales nec, volutpat a, suscipit non, turpis.\n  </v-alert>\n  <v-alert\n    border=\"right\"\n    colored-border\n    type=\"error\"\n    elevation=\"2\"\n  >\n    Fusce commodo aliquam arcu. Pellentesque posuere. Phasellus tempus. Donec posuere vulputate arcu.\n  </v-alert>\n</div>`,\n        js: ``,\n      },\n\n      code4: {\n        html: `<div>\n  <v-alert\n    v-model=\"alert\"\n    border=\"left\"\n    close-text=\"Close Alert\"\n    color=\"deep-purple accent-4\"\n    dark\n    dismissible\n  >\n    Aenean imperdiet. Quisque id odio. Cras dapibus. Pellentesque ut neque. Cras dapibus.\n\n    Vivamus consectetuer hendrerit lacus. Sed mollis, eros et ultrices tempus, mauris ipsum aliquam libero, non adipiscing dolor urna a orci. Sed mollis, eros et ultrices tempus, mauris ipsum aliquam libero, non adipiscing dolor urna a orci. Curabitur blandit mollis lacus. Curabitur ligula sapien, tincidunt non, euismod vitae, posuere imperdiet, leo.\n  </v-alert>\n  <div class=\"text-center\">\n    <v-btn\n      v-if=\"!alert\"\n      color=\"deep-purple accent-4\"\n      dark\n      @click=\"alert = true\"\n    >\n      Reset\n    </v-btn>\n  </div>\n</div>`,\n        js: `export default {\n    data () {\n      return {\n        alert: true\n      }\n    },\n  }`,\n      },\n      alert: true,\n    };\n  },\n  components: {\n    KTCodePreview,\n  },\n  mounted() {\n    this.$store.dispatch(SET_BREADCRUMB, [\n      { title: \"Vuetify\", route: \"alerts\" },\n      { title: \"Alerts\" },\n    ]);\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!./Alerts.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!./Alerts.vue?vue&type=script&lang=js\"","import { render, staticRenderFns } from \"./Alerts.vue?vue&type=template&id=dec2fc4a\"\nimport script from \"./Alerts.vue?vue&type=script&lang=js\"\nexport * from \"./Alerts.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 render(){var _vm=this,_c=_vm._self._c;return _c('KTCard',{ref:\"preview\",attrs:{\"title\":_vm.title,\"example\":true},scopedSlots:_vm._u([(_vm.hasTitleSlot)?{key:\"title\",fn:function(){return [_c('h3',{staticClass:\"card-title\"},[_vm._t(\"title\")],2)]},proxy:true}:null,{key:\"toolbar\",fn:function(){return [_c('div',{staticClass:\"example-tools justify-content-center\"},[_c('span',{directives:[{name:\"b-tooltip\",rawName:\"v-b-tooltip.hover.top\",value:('View code'),expression:\"'View code'\",modifiers:{\"hover\":true,\"top\":true}}],staticClass:\"example-toggle\",attrs:{\"data-toggle\":\"tooltip\"}}),_c('span',{directives:[{name:\"b-tooltip\",rawName:\"v-b-tooltip.hover.top\",value:('Copy code'),expression:\"'Copy code'\",modifiers:{\"hover\":true,\"top\":true}}],staticClass:\"example-copy\",attrs:{\"data-toggle\":\"tooltip\"}})])]},proxy:true},{key:\"body\",fn:function(){return [_c('div',{staticClass:\"example-code mb-5\"},[(!_vm.hasGeneralCode && !_vm.hasSingleCodeType)?_c('ul',{staticClass:\"example-nav nav nav-tabs nav-bold nav-tabs-line nav-tabs-line-2x\",attrs:{\"role\":\"tablist\"}},[(_vm.hasHtmlCode)?_c('li',{staticClass:\"nav-item\"},[_c('a',{staticClass:\"nav-link active\",attrs:{\"data-tab\":\"0\",\"data-toggle\":\"tab\",\"href\":\"#\",\"role\":\"tab\",\"aria-selected\":\"true\"},on:{\"click\":_vm.setActiveTab}},[_vm._v(\" HTML \")])]):_vm._e(),(_vm.hasJsCode)?_c('li',{staticClass:\"nav-item\"},[_c('a',{staticClass:\"nav-link\",attrs:{\"data-tab\":\"1\",\"data-toggle\":\"tab\",\"href\":\"#\",\"role\":\"tab\",\"aria-selected\":\"false\"},on:{\"click\":_vm.setActiveTab}},[_vm._v(\"  JS  \")])]):_vm._e(),(_vm.hasScssCode)?_c('li',{staticClass:\"nav-item\"},[_c('a',{staticClass:\"nav-link\",attrs:{\"data-tab\":\"2\",\"data-toggle\":\"tab\",\"href\":\"#\",\"role\":\"tab\",\"aria-selected\":\"false\"},on:{\"click\":_vm.setActiveTab}},[_vm._v(\" SCSS \")])]):_vm._e()]):_vm._e(),(_vm.hasGeneralCode)?_c('div',[_vm._t(\"code\")],2):_vm._e(),(!_vm.hasGeneralCode && !_vm.hasSingleCodeType)?_c('div',[_c('b-tabs',{staticClass:\"hide-tabs\",attrs:{\"content-class\":\"mt-3\"},model:{value:(_vm.tabIndex),callback:function ($$v) {_vm.tabIndex=$$v},expression:\"tabIndex\"}},[_c('b-tab',{staticClass:\"example-highlight\",attrs:{\"active\":\"\"}},[_c('highlight-code',{staticClass:\"language-html\",attrs:{\"lang\":\"html\"}},[_vm._t(\"html\")],2)],1),_c('b-tab',{staticClass:\"example-highlight\"},[_c('highlight-code',{staticClass:\"language-js\",attrs:{\"lang\":\"js\"}},[_vm._t(\"js\")],2)],1),_c('b-tab',{staticClass:\"example-highlight\"},[_c('highlight-code',{staticClass:\"language-scss\",attrs:{\"lang\":\"scss\"}},[_vm._t(\"scss\")],2)],1)],1)],1):_vm._e(),(_vm.hasSingleCodeType)?_c('div',{staticClass:\"example-highlight\"},[(_vm.hasHtmlCode)?_c('highlight-code',{staticClass:\"language-html\",attrs:{\"lang\":\"html\"}},[_vm._t(\"html\")],2):_vm._e(),(_vm.hasJsCode)?_c('highlight-code',{staticClass:\"language-js\",attrs:{\"lang\":\"js\"}},[_vm._t(\"js\")],2):_vm._e(),(_vm.hasScssCode)?_c('highlight-code',{staticClass:\"language-scss\",attrs:{\"lang\":\"scss\"}},[_vm._t(\"scss\")],2):_vm._e()],1):_vm._e()]),_vm._t(\"preview\")]},proxy:true}],null,true)})\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","var render = function render(){var _vm=this,_c=_vm._self._c;return _c('div',{staticClass:\"card card-custom gutter-b\",class:_vm.classes},[(_vm.hasTitleSlot || _vm.title)?_c('div',{staticClass:\"card-header\",class:_vm.headClass},[_c('div',{staticClass:\"card-title\"},[(_vm.hasTitleSlot)?_vm._t(\"title\"):_vm._e(),(!_vm.hasTitleSlot)?_c('h3',{staticClass:\"card-label\"},[_vm._v(\" \"+_vm._s(_vm.title)+\" \")]):_vm._e()],2),_c('div',{staticClass:\"card-toolbar\"},[_vm._t(\"toolbar\")],2)]):_vm._e(),_c('div',{staticClass:\"card-body\",class:{\n      bodyClass: _vm.bodyClass,\n      'body-fit': _vm.bodyFit,\n      'body-fluid': _vm.bodyFluid,\n    }},[_vm._t(\"body\")],2),(_vm.hasFootSlot)?_c('div',{staticClass:\"card-footer\"},[_vm._t(\"foot\")],2):_vm._e()])\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <div class=\"card card-custom gutter-b\" v-bind:class=\"classes\">\n    <div\n      class=\"card-header\"\n      v-bind:class=\"headClass\"\n      v-if=\"hasTitleSlot || title\"\n    >\n      <div class=\"card-title\">\n        <slot name=\"title\" v-if=\"hasTitleSlot\"></slot>\n        <h3 class=\"card-label\" v-if=\"!hasTitleSlot\">\n          {{ title }}\n        </h3>\n      </div>\n      <div class=\"card-toolbar\">\n        <slot name=\"toolbar\"></slot>\n      </div>\n    </div>\n    <div\n      class=\"card-body\"\n      v-bind:class=\"{\n        bodyClass,\n        'body-fit': bodyFit,\n        'body-fluid': bodyFluid,\n      }\"\n    >\n      <slot name=\"body\"></slot>\n    </div>\n    <div class=\"card-footer\" v-if=\"hasFootSlot\">\n      <slot name=\"foot\"></slot>\n    </div>\n  </div>\n</template>\n\n<script>\nexport default {\n  name: \"KTCard\",\n  props: {\n    /**\n     * String title\n     */\n    title: String,\n    /**\n     * Set card head size. Eg. md, lg, sm, etc.\n     */\n    headSize: String,\n    /**\n     * Set card to fluid\n     */\n    fluidHeight: Boolean,\n    /**\n     * Set card to fluid in half\n     */\n    fluidHalfHeight: Boolean,\n    /**\n     * Set overlay head\n     */\n    headOverlay: Boolean,\n    /**\n     * Set extra class for main card\n     */\n    cardClass: String,\n    /**\n     * Set extra class for card head\n     */\n    headClass: String,\n    /**\n     * Set extra class for card body\n     */\n    bodyClass: String,\n    /**\n     * Set card body to fit\n     */\n    bodyFit: Boolean,\n    /**\n     * Set card body to fluid\n     */\n    bodyFluid: Boolean,\n    /**\n     * Code examples\n     */\n    example: Boolean,\n  },\n  components: {},\n  methods: {},\n  computed: {\n    classes() {\n      const cls = {\n        \"example example-compact\": this.example,\n        \"height-fluid\": this.fluidHeight,\n        \"height-fluid-half\": this.fluidHalfHeight,\n        \"head-overlay\": this.headOverlay,\n      };\n\n      cls[this.headSizeClass] = this.headSizeClass;\n\n      // append extra classes\n      if (this.cardClass) {\n        cls[this.cardClass] = true;\n      }\n\n      return cls;\n    },\n    hasTitleSlot() {\n      return !!this.$slots[\"title\"];\n    },\n    hasFootSlot() {\n      return !!this.$slots[\"foot\"];\n    },\n    headSizeClass() {\n      if (this.headSize) {\n        return `head-${this.headSize}`;\n      }\n      return false;\n    },\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!./Card.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!./Card.vue?vue&type=script&lang=js\"","import { render, staticRenderFns } from \"./Card.vue?vue&type=template&id=27c3d7e4\"\nimport script from \"./Card.vue?vue&type=script&lang=js\"\nexport * from \"./Card.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>\n  <KTCard ref=\"preview\" v-bind:title=\"title\" v-bind:example=\"true\">\n    <template v-slot:title v-if=\"hasTitleSlot\">\n      <h3 class=\"card-title\">\n        <slot name=\"title\"></slot>\n      </h3>\n    </template>\n    <template v-slot:toolbar>\n      <div class=\"example-tools justify-content-center\">\n        <span\n          class=\"example-toggle\"\n          data-toggle=\"tooltip\"\n          v-b-tooltip.hover.top=\"'View code'\"\n        />\n        <span\n          class=\"example-copy\"\n          data-toggle=\"tooltip\"\n          v-b-tooltip.hover.top=\"'Copy code'\"\n        />\n      </div>\n    </template>\n    <template v-slot:body>\n      <!--begin::Code example-->\n      <div class=\"example-code mb-5\">\n        <ul\n          class=\"example-nav nav nav-tabs nav-bold nav-tabs-line nav-tabs-line-2x\"\n          role=\"tablist\"\n          v-if=\"!hasGeneralCode && !hasSingleCodeType\"\n        >\n          <li class=\"nav-item\" v-if=\"hasHtmlCode\">\n            <a\n              class=\"nav-link active\"\n              v-on:click=\"setActiveTab\"\n              data-tab=\"0\"\n              data-toggle=\"tab\"\n              href=\"#\"\n              role=\"tab\"\n              aria-selected=\"true\"\n            >\n              HTML\n            </a>\n          </li>\n          <li class=\"nav-item\" v-if=\"hasJsCode\">\n            <a\n              class=\"nav-link\"\n              v-on:click=\"setActiveTab\"\n              data-tab=\"1\"\n              data-toggle=\"tab\"\n              href=\"#\"\n              role=\"tab\"\n              aria-selected=\"false\"\n            >\n              &nbsp;JS&nbsp;\n            </a>\n          </li>\n          <li class=\"nav-item\" v-if=\"hasScssCode\">\n            <a\n              class=\"nav-link\"\n              v-on:click=\"setActiveTab\"\n              data-tab=\"2\"\n              data-toggle=\"tab\"\n              href=\"#\"\n              role=\"tab\"\n              aria-selected=\"false\"\n            >\n              SCSS\n            </a>\n          </li>\n        </ul>\n        <div v-if=\"hasGeneralCode\">\n          <slot name=\"code\"></slot>\n        </div>\n\n        <div v-if=\"!hasGeneralCode && !hasSingleCodeType\">\n          <b-tabs class=\"hide-tabs\" content-class=\"mt-3\" v-model=\"tabIndex\">\n            <b-tab active class=\"example-highlight\">\n              <highlight-code lang=\"html\" class=\"language-html\">\n                <slot name=\"html\"></slot>\n              </highlight-code>\n            </b-tab>\n            <b-tab class=\"example-highlight\">\n              <highlight-code lang=\"js\" class=\"language-js\">\n                <slot name=\"js\"></slot>\n              </highlight-code>\n            </b-tab>\n            <b-tab class=\"example-highlight\">\n              <highlight-code lang=\"scss\" class=\"language-scss\">\n                <slot name=\"scss\"></slot>\n              </highlight-code>\n            </b-tab>\n          </b-tabs>\n        </div>\n\n        <div v-if=\"hasSingleCodeType\" class=\"example-highlight\">\n          <highlight-code lang=\"html\" class=\"language-html\" v-if=\"hasHtmlCode\">\n            <slot name=\"html\"></slot>\n          </highlight-code>\n          <highlight-code lang=\"js\" class=\"language-js\" v-if=\"hasJsCode\">\n            <slot name=\"js\"></slot>\n          </highlight-code>\n          <highlight-code lang=\"scss\" class=\"language-scss\" v-if=\"hasScssCode\">\n            <slot name=\"scss\"></slot>\n          </highlight-code>\n        </div>\n      </div>\n      <!--end::Code example-->\n\n      <slot name=\"preview\"></slot>\n    </template>\n  </KTCard>\n</template>\n\n<script>\nimport KTCard from \"@/view/content/Card.vue\";\nimport KTLayoutExamples from \"@/assets/js/layout/extended/examples.js\";\n\nexport default {\n  name: \"KTCodePreview\",\n  props: {\n    title: String,\n  },\n  data() {\n    return {\n      tabIndex: 0,\n      isOpen: false,\n    };\n  },\n  components: {\n    KTCard,\n  },\n  mounted() {\n    // init example codes\n    this.$nextTick(() => {\n      KTLayoutExamples.init([this.$el]);\n      const hljs = this.$el.querySelectorAll(\".hljs\");\n      hljs.forEach((hl) => {\n        hl.classList.add(`language-${hl.classList[1]}`);\n        hl.classList.remove(\"hljs\");\n      });\n    });\n  },\n  methods: {\n    /**\n     * Set current active on click\n     * @param event\n     */\n    setActiveTab(event) {\n      // get all tab links\n      const tab = event.target.closest('[role=\"tablist\"]');\n      const links = tab.querySelectorAll('[data-toggle=\"tab\"]');\n      // remove active tab links\n      for (let i = 0; i < links.length; i++) {\n        links[i].classList.remove(\"active\");\n      }\n\n      // set current active tab\n      event.target.classList.add(\"active\");\n\n      // set clicked tab index to bootstrap tab\n      this.tabIndex = parseInt(event.target.getAttribute(\"data-tab\"));\n    },\n  },\n  computed: {\n    /**\n     * Check if has title\n     * @returns {boolean}\n     */\n    hasTitleSlot() {\n      return !!this.$slots[\"title\"];\n    },\n\n    /**\n     * Check if code only has one, exclude the tabs\n     * @returns {boolean}\n     */\n    hasSingleCodeType() {\n      let exist = 0;\n      [\"html\", \"js\", \"scss\"].forEach((type) => {\n        if (this.$slots.hasOwnProperty(type)) {\n          exist++;\n        }\n      });\n      return exist === 1;\n    },\n\n    /**\n     * Custom generate codes\n     * @returns {boolean}\n     */\n    hasGeneralCode() {\n      return !!this.$slots[\"code\"];\n    },\n\n    /**\n     * Check if has JS code slot\n     * @returns {boolean}\n     */\n    hasJsCode() {\n      return !!this.$slots[\"js\"];\n    },\n\n    /**\n     * Check if has SCSS code slot\n     * @returns {boolean}\n     */\n    hasScssCode() {\n      return !!this.$slots[\"scss\"];\n    },\n\n    /**\n     * Check if has HTML code slot\n     * @returns {boolean}\n     */\n    hasHtmlCode() {\n      return !!this.$slots[\"html\"];\n    },\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!./CodePreview.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!./CodePreview.vue?vue&type=script&lang=js\"","import { render, staticRenderFns } from \"./CodePreview.vue?vue&type=template&id=592e1862\"\nimport script from \"./CodePreview.vue?vue&type=script&lang=js\"\nexport * from \"./CodePreview.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":""}