MazPagination

MazPagination is a standalone component

INFO

Before you have to import the global css files in your project, follow instructions in Getting Started

Basic usage

v-model="1"

<template>
  <MazPagination v-bind="props" v-model="currentPage" size="md" />
</template>

<script lang="ts" setup>
  import MazPagination, { type Props } from 'maz-ui/components/MazPagination'

  import { ref } from 'vue'

  const currentPage = ref(1)

  const props: Props = {
    resultsSize: 100,
    totalPages: 10,
    activeColor: 'primary',
  }
</script>

Sizes

<MazPagination v-bind="props" v-model="currentPage" size="xs" />
<MazPagination v-bind="props" v-model="currentPage" size="sm" />
<MazPagination v-bind="props" v-model="currentPage" size="md" />
<MazPagination v-bind="props" v-model="currentPage" size="lg" />
<MazPagination v-bind="props" v-model="currentPage" size="xl" />

Colors