From 7364b8a3065a231b04ebf8e624d9a3f16cd0c531 Mon Sep 17 00:00:00 2001
From: Moritz Vetter <16950410+HansAuger@users.noreply.github.com>
Date: Thu, 14 Oct 2021 04:33:18 +0200
Subject: [PATCH] refactor(kottiPagination): add prop types, zod schema and add
 to exported kotti types

---
 .../source/kotti-pagination/KtPagination.vue  | 22 ++++++-------------
 .../kotti-ui/source/kotti-pagination/index.ts |  6 ++++-
 .../kotti-ui/source/kotti-pagination/types.ts | 21 ++++++++++++++++++
 packages/kotti-ui/source/types/kotti.ts       |  1 +
 4 files changed, 34 insertions(+), 16 deletions(-)
 create mode 100644 packages/kotti-ui/source/kotti-pagination/types.ts

diff --git a/packages/kotti-ui/source/kotti-pagination/KtPagination.vue b/packages/kotti-ui/source/kotti-pagination/KtPagination.vue
index b28b6e7614..b779e6f48f 100644
--- a/packages/kotti-ui/source/kotti-pagination/KtPagination.vue
+++ b/packages/kotti-ui/source/kotti-pagination/KtPagination.vue
@@ -20,19 +20,16 @@
 import { Yoco } from '@3yourmind/yoco'
 import { computed, defineComponent, ref } from '@vue/composition-api'
 
+import { makeProps } from '../make-props'
+
 import PaginationExpanded from './components/PaginationExpanded.vue'
 import PaginationFlexible from './components/PaginationFlexible.vue'
 import PaginationFractionated from './components/PaginationFractionated.vue'
+import { KottiPagination } from './types'
 
-export default defineComponent<{
-	adjacentAmount: number
-	fixedWidth: boolean
-	fractionStyle: boolean
-	page: number
-	pageSize: number
-	pagingStyle: 'default' | 'flex' | 'fraction'
-	total: number
-}>({
+export default defineComponent<
+	KottiPagination.PropsInternal & { fractionStyle: boolean }
+>({
 	name: 'KtPagination',
 	components: {
 		PaginationExpanded,
@@ -40,12 +37,7 @@ export default defineComponent<{
 		PaginationFractionated,
 	},
 	props: {
-		adjacentAmount: { type: Number, default: 1 },
-		fixedWidth: { type: Boolean, default: false },
-		page: { type: Number, default: 1 },
-		pageSize: { type: Number, default: 10 },
-		pagingStyle: { type: String, default: 'expand' },
-		total: { type: Number, required: true },
+		...makeProps(KottiPagination.propsSchema),
 
 		/**
 		 * @deprecated
diff --git a/packages/kotti-ui/source/kotti-pagination/index.ts b/packages/kotti-ui/source/kotti-pagination/index.ts
index 57ab2cd6e0..4ad4b3858c 100644
--- a/packages/kotti-ui/source/kotti-pagination/index.ts
+++ b/packages/kotti-ui/source/kotti-pagination/index.ts
@@ -2,6 +2,7 @@ import { MetaDesignType } from '../types/kotti'
 import { attachMeta, makeInstallable } from '../utilities'
 
 import KtPaginationVue from './KtPagination.vue'
+import { KottiPagination } from './types'
 
 export const KtPagination = attachMeta(makeInstallable(KtPaginationVue), {
 	addedVersion: '0.0.6',
@@ -11,5 +12,8 @@ export const KtPagination = attachMeta(makeInstallable(KtPaginationVue), {
 		url: 'https://www.figma.com/file/0yFVivSWXgFf2ddEF92zkf/Kotti-Design-System?node-id=101%3A1106',
 	},
 	slots: {},
-	typeScript: null,
+	typeScript: {
+		namespace: 'KottiPagination',
+		schema: KottiPagination.propsSchema,
+	},
 })
diff --git a/packages/kotti-ui/source/kotti-pagination/types.ts b/packages/kotti-ui/source/kotti-pagination/types.ts
new file mode 100644
index 0000000000..ae3e189076
--- /dev/null
+++ b/packages/kotti-ui/source/kotti-pagination/types.ts
@@ -0,0 +1,21 @@
+import { z } from 'zod'
+
+export namespace KottiPagination {
+	export enum PagingStyle {
+		DEFAULT = 'default',
+		FLEX = 'flex',
+		FRACTION = 'fraction',
+	}
+
+	export const propsSchema = z.object({
+		adjacentAmount: z.number().nullable().default(null),
+		fixedWidth: z.boolean().nullable().default(null),
+		page: z.number().nullable().default(null),
+		pageSize: z.number().nullable().default(null),
+		pagingStyle: z.nativeEnum(PagingStyle).nullable().default(null),
+		total: z.number(),
+	})
+
+	export type PropsInternal = z.output<typeof propsSchema>
+	export type Props = z.input<typeof propsSchema>
+}
diff --git a/packages/kotti-ui/source/types/kotti.ts b/packages/kotti-ui/source/types/kotti.ts
index d594db71f8..63836943e2 100644
--- a/packages/kotti-ui/source/types/kotti.ts
+++ b/packages/kotti-ui/source/types/kotti.ts
@@ -40,6 +40,7 @@ export { KottiI18n as I18n } from '../kotti-i18n/types'
 export { KottiLine as Line } from '../kotti-line/types'
 export { KottiModal as Modal } from '../kotti-modal/types'
 export { KottiNavbar as Navbar } from '../kotti-navbar/types'
+export { KottiPagination as Pagination } from '../kotti-pagination/types'
 export { KottiPopover as Popover } from '../kotti-popover/types'
 export { KottiRow as Row } from '../kotti-row/types'