{"version":3,"sources":["webpack:///./src/view/pages/resources/documentation/base/helpers/Borders.vue","webpack:///./src/view/pages/resources/documentation/base/helpers/Borders.vue?c295","webpack:///./src/view/pages/resources/documentation/base/helpers/Borders.vue?9bcd","webpack:///./src/core/helpers/breadcrumbs/breadcrumb.ts","webpack:///./src/view/content/highlighters/CodeHighlighter.vue","webpack:///./src/view/content/highlighters/CodeHighlighter.vue?1b19","webpack:///./src/view/content/highlighters/CodeHighlighter.vue?0140"],"names":["class","id","href","themeName","lang","gray","item","i","name","components","CodeHighlighter","setup","render","setCurrentPageBreadcrumbs","section","title","dispatch","SET_BREADCRUMB_ACTION","setCurrentPageTitle","data-bs-toggle","data-bs-original-title","style","getHeightInPixesls","props","String","fieldHeight","Number","height","init","value","highlightAll"],"mappings":"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","file":"js/chunk-0aa95211.3d0d4304.js","sourcesContent":["<template>\n  <!--begin::Card-->\n  <div class=\"card\">\n    <!--begin::Card Body-->\n    <div class=\"card-body p-10 p-lg-15\">\n      <!--begin::Section-->\n      <div class=\"pb-10\">\n        <!--begin::Heading-->\n        <h1 class=\"anchor fw-bolder mb-5\" id=\"overview\">\n          <a href=\"#overview\"></a>\n          Overview\n        </h1>\n        <!--end::Heading-->\n\n        <!--begin::Block-->\n        <div class=\"py-5\">\n          <b>{{ themeName }}</b> extends\n          <a\n            href=\"https://getbootstrap.com/docs/5.0/utilities/borders/\"\n            class=\"fw-bold\"\n            >Bootstrap Borders</a\n          >; in <code>src/sass/helpers/_borders.scss</code> to provide\n          additional border utility classes to cover its own design system.\n        </div>\n        <!--end::Block-->\n      </div>\n      <!--end::Section-->\n\n      <!--begin::Section-->\n      <div class=\"py-10\">\n        <!--begin::Heading-->\n        <h1 class=\"anchor fw-bolder mb-3\" id=\"border-styles\">\n          <a href=\"#border-styles\"></a>\n          Border Styles\n        </h1>\n        <!--end::Heading-->\n\n        <!--begin::Block-->\n        <div class=\"py-5\">\n          Use <code>.border-dashed</code> or <code>.border-dotted</code> classes\n          to set an element's border style.\n        </div>\n        <!--end::Block-->\n\n        <!--begin::Block-->\n        <div class=\"py-5\">\n          <div class=\"rounded border p-10\">\n            <div class=\"d-flex flex-wrap align-items-center\">\n              <div\n                class=\"border w-150px h-150px d-flex flex-center me-5 mb-5 fw-bold\"\n              >\n                default style\n              </div>\n\n              <div\n                class=\"border border-dashed w-150px h-150px d-flex flex-center me-5 mb-5 fw-bold\"\n              >\n                .border-dashed\n              </div>\n\n              <div\n                class=\"border border-dotted w-150px h-150px d-flex flex-center me-5 mb-5 fw-bold\"\n              >\n                .border-dotted\n              </div>\n            </div>\n          </div>\n        </div>\n        <!--end::Block-->\n\n        <!--begin::Code-->\n        <div class=\"py-5\">\n          <CodeHighlighter lang=\"html\"\n            >{{`\n            <div class=\"border\">\n              default style\n            </div>\n\n            <div class=\"border border-dashed\">\n              .border-dashed\n            </div>\n\n            <div class=\"border border-dotted\">\n              .border-dotted\n            </div>\n            `}}</CodeHighlighter\n          >\n        </div>\n        <!--end::Code-->\n      </div>\n      <!--end::Section-->\n\n      <!--begin::Section-->\n      <div class=\"py-10\">\n        <!--begin::Heading-->\n        <h1 class=\"anchor fw-bolder mb-3\" id=\"border-states\">\n          <a href=\"#border-states\"></a>\n          Border States\n        </h1>\n        <!--end::Heading-->\n\n        <!--begin::Block-->\n        <div class=\"py-5\">\n          Use <code>.border-hover</code> to display an element's border on hover\n          and <code>.border-active</code> to enable the border when\n          <code>.active</code> class is applied.\n        </div>\n        <!--end::Block-->\n\n        <!--begin::Block-->\n        <div class=\"py-5\">\n          <div class=\"rounded border p-10\">\n            <div class=\"d-flex flex-wrap align-items-center\">\n              <div\n                class=\"border border-primary border-hover w-150px h-150px d-flex flex-center me-5 mb-5 fw-bold\"\n              >\n                .border-hover\n              </div>\n\n              <div\n                class=\"border border-primary border-active active w-150px h-150px d-flex flex-center me-5 mb-5 fw-bold\"\n              >\n                .border-active<br />.active\n              </div>\n            </div>\n          </div>\n        </div>\n        <!--end::Block-->\n\n        <!--begin::Code-->\n        <div class=\"py-5\">\n          <CodeHighlighter lang=\"html\"\n            >{{`\n            <div class=\"border border-primary border-hover\">\n              .border-hover\n            </div>\n\n            <div class=\"border border-primary border-active active\">\n              .border-dashed\n            </div>\n            `}}</CodeHighlighter\n          >\n        </div>\n        <!--end::Code-->\n      </div>\n      <!--end::Section-->\n\n      <!--begin::Section-->\n      <div class=\"pt-10\">\n        <!--begin::Heading-->\n        <h1 class=\"anchor fw-bolder mb-3\" id=\"border-gray-colors\">\n          <a href=\"#border-gray-colors\"></a>\n          Border Gray Colors\n        </h1>\n        <!--end::Heading-->\n\n        <!--begin::Block-->\n        <div class=\"py-5\">\n          Use\n          <code\n            >.border-gray-{100, 200, 300, 400, 500, 600, 700, 800, 900}</code\n          >\n          to set an element's border color.\n        </div>\n        <!--end::Block-->\n\n        <!--begin::Block-->\n        <div class=\"py-5\">\n          <div class=\"rounded border p-10\">\n            <div class=\"d-flex flex-wrap align-items-center\">\n              <template v-for=\"(item, i) in gray\" :key=\"i\">\n                <div\n                  :class=\"`border-${item}`\"\n                  class=\"w-100px h-100px d-flex flex-center p-3 me-5 mb-5 fw-bold border\"\n                >\n                  .border-{{ item }}\n                </div>\n              </template>\n            </div>\n          </div>\n        </div>\n        <!--end::Block-->\n\n        <!--begin::Code-->\n        <div class=\"pt-5\">\n          <CodeHighlighter lang=\"html\"\n            >{{`\n            <div class=\"border border-gray-100\"></div>\n            <div class=\"border border-gray-200\"></div>\n            <div class=\"border border-gray-300\"></div>\n            <div class=\"border border-gray-400\"></div>\n            <div class=\"border border-gray-500\"></div>\n            <div class=\"border border-gray-600\"></div>\n            <div class=\"border border-gray-700\"></div>\n            <div class=\"border border-gray-800\"></div>\n            <div class=\"border border-gray-900\"></div>\n            `}}</CodeHighlighter\n          >\n        </div>\n        <!--end::Code-->\n      </div>\n      <!--end::Section-->\n    </div>\n    <!--end::Card Body-->\n  </div>\n  <!--end::Card-->\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, onMounted } from \"vue\";\nimport { setCurrentPageTitle } from \"@/core/helpers/breadcrumbs/breadcrumb\";\nimport { themeName } from \"@/core/helpers/documentation\";\nimport CodeHighlighter from \"@/view/content/highlighters/CodeHighlighter.vue\";\n\nexport default defineComponent({\n  name: \"borders\",\n  components: {\n    CodeHighlighter\n  },\n  setup() {\n    const gray = [\n      \"gray-100\",\n      \"gray-200\",\n      \"gray-300\",\n      \"gray-400\",\n      \"gray-500\",\n      \"gray-600\",\n      \"gray-700\",\n      \"gray-800\",\n      \"gray-900\"\n    ];\n\n    onMounted(() => {\n      setCurrentPageTitle(\"Borders\");\n    });\n\n    return {\n      themeName,\n      gray\n    };\n  }\n});\n</script>\n","\nimport { defineComponent, onMounted } from \"vue\";\nimport { setCurrentPageTitle } from \"@/core/helpers/breadcrumbs/breadcrumb\";\nimport { themeName } from \"@/core/helpers/documentation\";\nimport CodeHighlighter from \"@/view/content/highlighters/CodeHighlighter.vue\";\n\nexport default defineComponent({\n  name: \"borders\",\n  components: {\n    CodeHighlighter\n  },\n  setup() {\n    const gray = [\n      \"gray-100\",\n      \"gray-200\",\n      \"gray-300\",\n      \"gray-400\",\n      \"gray-500\",\n      \"gray-600\",\n      \"gray-700\",\n      \"gray-800\",\n      \"gray-900\"\n    ];\n\n    onMounted(() => {\n      setCurrentPageTitle(\"Borders\");\n    });\n\n    return {\n      themeName,\n      gray\n    };\n  }\n});\n","import { render } from \"./Borders.vue?vue&type=template&id=7ef63007\"\nimport script from \"./Borders.vue?vue&type=script&lang=ts\"\nexport * from \"./Borders.vue?vue&type=script&lang=ts\"\nscript.render = render\n\nexport default script","import store from \"@/store\";\nimport { Actions } from \"@/store/enums/store.enums\";\n\n/**\n * Sets current page breadcrumbs\n * @param {string} section Current page section name\n * @param {string} title Current page title name\n */\nexport const setCurrentPageBreadcrumbs = (\n  section: string,\n  title: string\n): void => {\n  store.dispatch(Actions.SET_BREADCRUMB_ACTION, {\n    section: section,\n    title: title\n  });\n};\n\n/**\n * Sets current page breadcrumbs\n * @param {string} title Current page title name\n */\nexport const setCurrentPageTitle = (title: string): void => {\n  store.dispatch(Actions.SET_BREADCRUMB_ACTION, {\n    title: title\n  });\n};\n","<template>\n  <div class=\"py-5\">\n    <div class=\"highlight\">\n      <button\n        class=\"highlight-copy btn\"\n        data-bs-toggle=\"tooltip\"\n        title=\"\"\n        data-bs-original-title=\"Copy code\"\n      >\n        copy\n      </button>\n      <div class=\"highlight-code\">\n        <pre\n          :class=\"`language-${lang}`\"\n          :style=\"{ height: getHeightInPixesls }\"\n        ><code :class=\"`language-${lang}`\">\n          <slot></slot>\n        </code></pre>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, computed, ref, onMounted } from \"vue\";\nimport { useCopyClipboard } from \"@/core/helpers/documentation\";\nimport Prism from \"prismjs\";\n\nexport default defineComponent({\n  name: \"CodeHighlighter\",\n  props: {\n    lang: String,\n    fieldHeight: Number\n  },\n  setup(props) {\n    const height = ref(props.fieldHeight);\n\n    const { init } = useCopyClipboard();\n\n    const getHeightInPixesls = computed(() => {\n      return height.value + \"px\";\n    });\n\n    onMounted(() => {\n      Prism.highlightAll();\n      init();\n    });\n\n    return {\n      getHeightInPixesls\n    };\n  },\n  components: {}\n});\n</script>\n","\nimport { defineComponent, computed, ref, onMounted } from \"vue\";\nimport { useCopyClipboard } from \"@/core/helpers/documentation\";\nimport Prism from \"prismjs\";\n\nexport default defineComponent({\n  name: \"CodeHighlighter\",\n  props: {\n    lang: String,\n    fieldHeight: Number\n  },\n  setup(props) {\n    const height = ref(props.fieldHeight);\n\n    const { init } = useCopyClipboard();\n\n    const getHeightInPixesls = computed(() => {\n      return height.value + \"px\";\n    });\n\n    onMounted(() => {\n      Prism.highlightAll();\n      init();\n    });\n\n    return {\n      getHeightInPixesls\n    };\n  },\n  components: {}\n});\n","import { render } from \"./CodeHighlighter.vue?vue&type=template&id=9d0e1ad0\"\nimport script from \"./CodeHighlighter.vue?vue&type=script&lang=ts\"\nexport * from \"./CodeHighlighter.vue?vue&type=script&lang=ts\"\nscript.render = render\n\nexport default script"],"sourceRoot":""}