Update types

packages/supersearch/src/lib/types/json.ts

@@ -0,0 +1,8 @@
+type JSONPrimitive = string | number | boolean | null | undefined;
+
+export type JSONValue =
+	| JSONPrimitive
+	| JSONValue[]
+	| {
+			[key: string]: JSONValue;
+	  };

packages/supersearch/src/lib/types/superSearch.ts

@@ -1,18 +1,8 @@
+import type { JSONValue } from './json.js';
+
 export type QueryFunction = (value: string) => URLSearchParams;
 export type PaginationQueryFunction = (
 	searchParams: URLSearchParams,
-	data: QueryResponse
+	data: JSONValue
 ) => URLSearchParams | undefined;
-export type TransformFunction = (data: unknown) => unknown;
-
-export interface ResultItem {
-	'@id'?: string;
-	heading: string;
-}
-
-export interface QueryResponse {
-	'@id'?: string;
-	context?: string;
-	items: ResultItem[];
-	totalItems: number;
-}
+export type TransformFunction = (data: JSONValue) => JSONValue;

packages/supersearch/src/lib/utils/useSearchRequest.svelte.ts

@@ -3,6 +3,7 @@ import type {
 	PaginationQueryFunction,
 	TransformFunction
 } from '$lib/types/superSearch.js';
+import type { JSONValue } from '$lib/types/json.js';
 import debounce from '$lib/utils/debounce.js';
 
 export function useSearchRequest({
@@ -38,7 +39,7 @@ export function useSearchRequest({
 			const response = await fetch(`${endpoint}?${searchParams.toString()}`, {
 				signal: controller.signal
 			});
-			const jsonResponse = await response.json();
+			const jsonResponse = (await response.json()) as JSONValue;
 
 			const _data = transformFn?.(jsonResponse) || jsonResponse;
 			moreSearchParams = paginationQueryFn?.(searchParams, _data);

packages/supersearch/src/routes/+page.svelte

@@ -1,21 +1,33 @@
 <script lang="ts">
 	import SuperSearch from '$lib/components/SuperSearch.svelte';
+	import type { JSONValue } from '$lib/types/json.js';
 	import type { MockQueryResponse } from './api/find/+server.js';
 
 	let value1 = $state('');
 	let value2 = $state('');
 	let placeholder = $state('Search');
 
-	function handlePaginationQuery(searchParams: URLSearchParams, prevData: MockQueryResponse) {
+	function handlePaginationQuery(searchParams: URLSearchParams, prevData: JSONValue) {
 		const paginatedSearchParams = new URLSearchParams(Array.from(searchParams.entries()));
 		const limit = parseInt(searchParams.get('_limit')!, 10);
 		const offset = limit + parseInt(searchParams.get('_offset') || '0', 10);
-		if (prevData && offset < prevData.totalItems) {
+		if (prevData && offset < (prevData as unknown as MockQueryResponse).totalItems) {
 			paginatedSearchParams.set('_offset', offset.toString());
 			return paginatedSearchParams;
 		}
 		return undefined;
 	}
+
+	function handleTransform(data: JSONValue) {
+		const { items, ...rest } = data as unknown as MockQueryResponse;
+		return {
+			...rest,
+			items: items.map((item) => ({
+				...item,
+				heading: `${item.heading} for ${value1}`
+			}))
+		};
+	}
 </script>
 
 <form action="test1">
@@ -32,6 +44,7 @@
 					_limit: '10'
 				})}
 			paginationQueryFn={handlePaginationQuery}
+			transformFn={handleTransform}
 		>
 			{#snippet resultItem(item)}
 				<button type="button" data-test-id="result-item">

packages/supersearch/src/routes/api/find/+server.ts

@@ -1,4 +1,3 @@
-import type { QueryResponse, ResultItem } from '$lib/types/superSearch.js';
 import type { RequestHandler } from './$types.ts';
 import { json } from '@sveltejs/kit';
 
@@ -10,22 +9,24 @@ const MOCK_ITEMS_DATA = Array.from({ length: MAX_ITEMS }, (_, i) => ({
 }));
 
 export const GET: RequestHandler = async ({ url }) => {
-	const q = url.searchParams.get('_q');
 	const limit = parseInt(url.searchParams.get('_limit')!, 10);
 	const offset = parseInt(url.searchParams.get('_offset') || '0', 10);
 
 	return json({
 		'@id': `/api/find?${url.searchParams.toString()}`,
 		items: MOCK_ITEMS_DATA.slice(offset, offset + limit).map((item) => ({
-			'@id': `${q}-${item.id}`,
-			heading: `${item.heading} for query: "${q}"`
+			'@id': item.id,
+			heading: item.heading
 		})),
 		totalItems: MAX_ITEMS
 	});
 };
 
-export interface MockQueryResponse extends QueryResponse {
+export interface MockQueryResponse {
 	'@id'?: string;
-	items: ResultItem[];
+	items: {
+		'@id'?: string;
+		heading: string;
+	}[];
 	totalItems: number;
 }