7span · darshak-7span · Feb 2, 2026 · Feb 2, 2026 · Feb 2, 2026 · Mar 20, 2026
diff --git a/apps/playground-typescript/index.html b/apps/playground-typescript/index.html
@@ -0,0 +1,14 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Vite + React (TypeScript)</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>
+
diff --git a/apps/playground-typescript/package.json b/apps/playground-typescript/package.json
@@ -0,0 +1,29 @@
+{
+  "name": "playground-typescript",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "typecheck": "tsc -p tsconfig.json --noEmit",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "@7span/react-list": "workspace:*",
+    "@iconify/react": "^5.2.1",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0"
+  },
+  "devDependencies": {
+    "@tailwindcss/postcss": "^4.2.2",
+    "@types/react": "^19.0.10",
+    "@types/react-dom": "^19.0.4",
+    "@vitejs/plugin-react": "^4.3.4",
+    "autoprefixer": "^10.4.27",
+    "postcss": "^8.5.8",
+    "tailwindcss": "^4.2.2",
+    "typescript": "^5.9.3",
+    "vite": "^6.3.1"
+  }
+}
diff --git a/apps/playground-typescript/postcss.config.mjs b/apps/playground-typescript/postcss.config.mjs
@@ -0,0 +1,6 @@
+export default {
+  plugins: {
+    '@tailwindcss/postcss': {},
+    autoprefixer: {},
+  },
+};
diff --git a/apps/playground-typescript/src/App.tsx b/apps/playground-typescript/src/App.tsx
@@ -0,0 +1,6 @@
+import ListWrapper from './components/list-wrapper';
+
+export default function App() {
+  return <ListWrapper />;
+}
+
diff --git a/apps/playground-typescript/src/api/request-handler.ts b/apps/playground-typescript/src/api/request-handler.ts
@@ -0,0 +1,87 @@
+import type { ReactListRequestArgs, ReactListResponse } from '@7span/react-list';
+
+export type PlaygroundItem = {
+  id: number;
+  name: string;
+  status?: string;
+  date_updated?: string;
+  [key: string]: unknown;
+};
+
+type Filters = Record<string, unknown>;
+
+const requestHandler = async (
+  args: ReactListRequestArgs<Filters>,
+): Promise<ReactListResponse<PlaygroundItem>> => {
+  const {
+    endpoint,
+    page,
+    perPage,
+    search,
+    sortBy,
+    sortOrder,
+    filters,
+    meta,
+  } = args;
+
+  const params = new URLSearchParams();
+
+  if (page && perPage) {
+    params.append('page', String(page));
+    params.append('limit', String(perPage));
+  }
+
+  if (search) params.append('search', search);
+
+  if (sortBy) {
+    params.append(
+      'sort',
+      sortOrder === 'desc' ? `-${sortBy}` : sortBy,
+    );
+  }
+
+  if (filters && Object.keys(filters).length > 0) {
+    // Keep it simple for the playground.
+    for (const [key, value] of Object.entries(filters)) {
+      if (value === undefined || value === '') continue;
+      params.append(`filter[${key}][_eq]`, String(value));
+    }
+  }
+
+  // Example: meta support (not required by ReactList, just forwarded in args)
+  if (meta && typeof meta === 'object') {
+    // noop; you can add meta params here.
+  }
+
+  const queryString = params.toString();
+  const url = `https://everest.7span.in/items/${endpoint}${
+    queryString ? `?${queryString}` : ''
+  }`;
+
+  try {
+    const response = await fetch(url);
+    if (!response.ok) {
+      throw new Error(`API request failed: ${response.status}`);
+    }
+    const data: any = await response.json();
+
+    return {
+      items: (data.data ?? []) as PlaygroundItem[],
+      count:
+        data.meta?.total_count ??
+        data.meta?.filter_count ??
+        0,
+      meta: data.meta ?? {},
+    };
+  } catch (error) {
+    return {
+      items: [],
+      count: 0,
+      meta: {},
+      error: error instanceof Error ? error : undefined,
+    } as unknown as ReactListResponse<PlaygroundItem>;
+  }
+};
+
+export default requestHandler;
+