chore: convert items/visibleItems to generic

Author: TT1228

src/components/KPagination/KPagination.vue

@@ -149,7 +149,7 @@
   </nav>
 </template>
 
-<script setup lang="ts">
+<script setup lang="ts" generic="T">
 import { ref, computed, watch, onMounted, onUnmounted, nextTick } from 'vue'
 import KDropdown from '@/components/KDropdown/KDropdown.vue'
 import KButton from '@/components/KButton/KButton.vue'
@@ -173,9 +173,9 @@ const {
   offset,
   offsetPreviousButtonDisabled,
   offsetNextButtonDisabled,
-} = defineProps<PaginationProps>()
+} = defineProps<PaginationProps<T>>()
 
-const emit = defineEmits<PaginationEmits>()
+const emit = defineEmits<PaginationEmits<T>>()
 
 const kPaginationElement = ref<HTMLElement | null>(null)
 const resizeObserver = ref<ResizeObserverHelper>()

src/types/pagination.ts

@@ -1,23 +1,23 @@
-export interface PageChangeData {
+export interface PageChangeData<T = any> {
   page: number
   pageCount: number
   firstItem: number
   lastItem: number
-  visibleItems: string | number[]
+  visibleItems: T[]
 }
 
 export interface PageSizeChangeData {
   pageSize: number
   pageCount: number
 }
 
-export interface PaginationProps {
+export interface PaginationProps<T> {
   /**
    * Optional array of items that can be provided for easy pagination.
    * Slice of this array with visible items is returned as visibleItems inside the pageChange event.
    * @default []
    */
-  items?: string | number[]
+  items?: T[]
 
   /**
    * The total number of items.
@@ -74,11 +74,11 @@ export interface PaginationProps {
   offsetNextButtonDisabled?: boolean
 }
 
-export interface PaginationEmits {
+export interface PaginationEmits<T> {
   /**
    * Emitted when the page changes, pass the current page information along with it.
    */
-  pageChange: [data: PageChangeData]
+  pageChange: [data: PageChangeData<T>]
   /**
    * Emitted when the page size changes, pass the current page size and page count.
    */