{"version":3,"sources":["webpack:///./src/views/components/pagination/code.js"],"names":["codeBasic","codeSeparated","codeColorOption","codeGoto","codeSize","codeContent","codePill","codeAlignment"],"mappings":"kHAAA,oWAAO,IAAMA,EAAY,8WA2BZC,EAAgB,4vBA2ChBC,EAAkB,+pDAuFlBC,EAAW,m7BAkDXC,EAAW,guBA8CXC,EAAc,o0DAuFdC,EAAW,+xBAiDXC,EAAgB","file":"js/chunk-2d0cf1b0.8c5a24f3.js","sourcesContent":["export const codeBasic = `\n<template>\n   <b-pagination\n    v-model=\"currentPage\"\n    hide-goto-end-buttons\n    :total-rows=\"rows\"\n  />\n</template>\n\n<script>\nimport { BPagination } from 'bootstrap-vue'\n\nexport default {\n  components: {\n    BPagination,\n  },\n  data() {\n    return {\n      currentPage: 1,\n      perPage: 1,\n      rows: 100,\n    }\n  },\n}\n</script>\n`\n\nexport const codeSeparated = `\n<template>\n  <div class=\"demo-spacing-0\">\n    <b-pagination\n      v-model=\"currentPage\"\n      :total-rows=\"rows\"\n      first-number\n      last-number\n      prev-class=\"prev-item\"\n      next-class=\"next-item\"\n    >\n      <template #prev-text>\n        <feather-icon\n          icon=\"ChevronLeftIcon\"\n          size=\"18\"\n        />\n      </template>\n      <template #next-text>\n        <feather-icon\n          icon=\"ChevronRightIcon\"\n          size=\"18\"\n        />\n      </template>\n    </b-pagination>\n  </div>\n</template>\n\n<script>\nimport { BPagination } from 'bootstrap-vue'\n\nexport default {\n  components: {\n    BPagination,\n  },\n  data: () => ({\n    currentPage: 1,\n    perPage: 1,\n    rows: 200,\n  }),\n}\n</script>\n`\n\nexport const codeColorOption = `\n<template>\n  <div class=\"demo-spacing-0\">\n    <b-pagination\n      v-model=\"currentPage\"\n      :total-rows=\"rows\"\n      first-number\n      last-number\n      class=\"pagination-success\"\n    >\n      <template #prev-text>\n        <feather-icon\n          size=\"18\"\n          icon=\"ChevronLeftIcon\"\n        />\n      </template>\n      <template #next-text>\n        <feather-icon\n          size=\"18\"\n          icon=\"ChevronRightIcon\"\n        />\n      </template>\n    </b-pagination>\n\n    <b-pagination\n      v-model=\"currentPage\"\n      :total-rows=\"rows\"\n      first-number\n      last-number\n      class=\"pagination-danger mt-2\"\n    >\n      <template #prev-text>\n        <feather-icon\n          size=\"18\"\n          icon=\"ChevronLeftIcon\"\n        />\n      </template>\n      <template #next-text>\n        <feather-icon\n          size=\"18\"\n          icon=\"ChevronRightIcon\"\n        />\n      </template>\n    </b-pagination>\n\n    <b-pagination\n      v-model=\"currentPage\"\n      :total-rows=\"rows\"\n      first-number\n      last-number\n      class=\"pagination-info mb-0\"\n    >\n      <template #prev-text>\n        <feather-icon\n          size=\"18\"\n          icon=\"ChevronLeftIcon\"\n        />\n      </template>\n      <template #next-text>\n        <feather-icon\n          size=\"18\"\n          icon=\"ChevronRightIcon\"\n        />\n      </template>\n    </b-pagination>\n  </div>\n</template>\n\n<script>\nimport { BPagination } from 'bootstrap-vue'\n\nexport default {\n  components: {\n    BPagination,\n  },\n data() {\n    return {\n      codeColorOption,\n      currentPage: 4,\n      perPage: 1,\n      rows: 200,\n    }\n  },\n}\n</script>\n`\n\nexport const codeGoto = `\n<template>\n  <div>\n    <div>\n      <h6>Goto first button number</h6>\n      <b-pagination\n        v-model=\"currentPage\"\n        :total-rows=\"rows\"\n        :per-page=\"perPage\"\n        first-number\n      />\n    </div>\n    <div class=\"mt-1\">\n      <h6>Goto last button number</h6>\n      <b-pagination\n        v-model=\"currentPage\"\n        :total-rows=\"rows\"\n        :per-page=\"perPage\"\n        last-number\n      />\n    </div>\n    <div class=\"mt-2 demo-spacing-0\">\n      <h6>Goto first and last button number</h6>\n      <b-pagination\n        v-model=\"currentPage\"\n        :total-rows=\"rows\"\n        :per-page=\"perPage\"\n        first-number\n        last-number\n      />\n    </div>\n  </div>\n</template>\n\n<script>\nimport { BPagination } from 'bootstrap-vue'\n\nexport default {\n  components: {\n    BPagination,\n  },\n  data: () => ({\n    currentPage: 5,\n    perPage: 1,\n    rows: 100,\n  }),\n}\n</script>\n`\n\nexport const codeSize = `\n<template>\n  <div>\n    <div>\n      <h6>Small</h6>\n      <b-pagination\n        v-model=\"currentPage\"\n        :total-rows=\"rows\"\n        size=\"sm\"\n      />\n    </div>\n\n    <div class=\"mt-1\">\n      <h6>Default</h6>\n      <b-pagination\n        v-model=\"currentPage\"\n        :total-rows=\"rows\"\n      />\n    </div>\n\n    <div class=\"mt-2 demo-spacing-0\">\n      <h6>Large</h6>\n      <b-pagination\n        v-model=\"currentPage\"\n        :total-rows=\"rows\"\n        size=\"lg\"\n      />\n    </div>\n  </div>\n</template>\n\n<script>\nimport { BPagination } from 'bootstrap-vue'\n\nexport default {\n  components: {\n    BPagination,\n  },\n  data: () => ({\n    currentPage: 1,\n    rows: 100,\n  }),\n}\n</script>\n`\n\nexport const codeContent = `\n<template>\n  <div class=\"demo-spacing-0\">\n    <!-- Use text in props -->\n    <b-pagination\n      v-model=\"currentPage\"\n      :total-rows=\"rows\"\n      :per-page=\"perPage\"\n      first-text=\"First\"\n      prev-text=\"Prev\"\n      next-text=\"Next\"\n      align=\"left\"\n      last-text=\"Last\"\n    />\n\n    <!-- Use emojis in props -->\n    <b-pagination\n      v-model=\"currentPage\"\n      :total-rows=\"rows\"\n      :per-page=\"perPage\"\n      first-text=\"⏮\"\n      prev-text=\"⏪\"\n      next-text=\"⏩\"\n      align=\"left\"\n      last-text=\"⏭\"\n      class=\"mt-1\"\n    />\n\n    <!-- Use HTML and sub-components in slots -->\n    <b-pagination\n      v-model=\"currentPage\"\n      :total-rows=\"rows\"\n      :per-page=\"perPage\"\n      align=\"left\"\n      class=\"mt-1\"\n    >\n      <template\n        #first-text\n      >\n        <span class=\"text-success\">First</span>\n      </template>\n      <template #prev-text>\n        <span class=\"text-danger\">Prev</span>\n      </template>\n      <template #next-text>\n        <span class=\"text-warning\">Next</span>\n      </template>\n      <template #last-text>\n        <span class=\"text-info\">Last</span>\n      </template>\n      <template #ellipsis-text>\n        <div>\n          <b-spinner\n            small\n            type=\"grow\"\n          />\n          <b-spinner\n            small\n            type=\"grow\"\n          />\n        </div>\n      </template>\n      <template #page=\"{ page, active }\">\n        <b v-if=\"active\">{{ page }}</b>\n        <i v-else>{{ page }}</i>\n      </template>\n    </b-pagination>\n  </div>\n</template>\n\n<script>\nimport { BPagination, BSpinner } from 'bootstrap-vue'\n\nexport default {\n  components: {\n    BPagination,\n    BSpinner,\n  },\n  data: () => ({\n    currentPage: 1,\n    perPage: 10,\n    rows: 100,\n  }),\n}\n</script>\n`\n\nexport const codePill = `\n<template>\n  <div>\n    <div>\n      <h6>Small Pills</h6>\n      <b-pagination\n        v-model=\"currentPage\"\n        pills\n        :total-rows=\"rows\"\n        size=\"sm\"\n      />\n    </div>\n\n    <div class=\"mt-1\">\n      <h6>Default Pills</h6>\n      <b-pagination\n        v-model=\"currentPage\"\n        pills\n        :total-rows=\"rows\"\n      />\n    </div>\n\n    <div class=\"mt-2 demo-spacing-0\">\n      <h6>Large Pills</h6>\n      <b-pagination\n        v-model=\"currentPage\"\n        pills\n        :total-rows=\"rows\"\n        size=\"lg\"\n      />\n    </div>\n  </div>\n</template>\n\n<script>\nimport { BPagination } from 'bootstrap-vue'\n\nexport default {\n  components: {\n    BPagination,\n  },\n  data: () => ({\n    currentPage: 1,\n    rows: 100,\n  }),\n}\n</script>\n`\n\nexport const codeAlignment = `\n<template>\n  <div class=\"demo-spacing-0\">\n    <span>Radios using options</span>\n    <div class=\"my-1\">\n      <b-form-radio\n        v-model=\"selected\"\n        name=\"vuexy-radio\"\n        value=\"default\"\n        inline\n      >\n        Default\n      </b-form-radio>\n      <b-form-radio\n        v-model=\"selected\"\n        name=\"vuexy-radio\"\n        value=\"right\"\n        inline\n      >\n        Right\n      </b-form-radio>\n      <b-form-radio\n        v-model=\"selected\"\n        name=\"vuexy-radio\"\n        value=\"center\"\n        inline\n      >\n        Center\n      </b-form-radio>\n      <b-form-radio\n        v-model=\"selected\"\n        name=\"vuexy-radio\"\n        value=\"fill\"\n        inline\n      >\n        Fill\n      </b-form-radio>\n    </div>\n\n    <!-- pagination -->\n    <b-pagination\n      v-model=\"currentPage\"\n      :total-rows=\"rows\"\n      base-url=\"#\"\n      :align=\"selected\"\n    />\n  </div>\n</template>\n\n<script>\nimport { BPagination, BFormRadio } from 'bootstrap-vue'\n\nexport default {\n  components: {\n    BPagination,\n    BFormRadio,\n  },\n  data() {\n    return {\n      selected: 'default',\n      currentPage: 1,\n      rows: 100,\n    }\n  },\n}\n</script>\n`\n"],"sourceRoot":""}