fix doc type error

docs/package.json

@@ -24,6 +24,8 @@
   "devDependencies": {
     "@docusaurus/module-type-aliases": "^3.9.2",
     "@docusaurus/types": "^3.9.2",
+    "@types/react": "18",
+    "@types/react-dom": "18",
     "autoprefixer": "^10.4.21",
     "tailwindcss": "3"
   },

docs/src/components/HomepageFeatures.tsx

@@ -1,10 +1,11 @@
 import Heading from '@theme/Heading';
 import styles from './HomepageFeatures.module.css';
+import type { ComponentType, ComponentProps, ReactNode } from 'react';
 
 type FeatureItem = {
   title: string;
-  Svg: React.ComponentType<React.ComponentProps<'svg'>>;
+  Svg: ComponentType<ComponentProps<'svg'>>;
-  description: JSX.Element;
+  description: ReactNode;
 };
 
 const FeatureList: FeatureItem[] = [
@@ -54,7 +55,7 @@ function Feature({title, Svg, description}: FeatureItem) {
   );
 }
 
-export default function HomepageFeatures(): JSX.Element {
+export default function HomepageFeatures() {
   return (
     <section className={styles.features}>
       <div className="container">

docs/src/css-modules.d.ts

@@ -0,0 +1,14 @@
+declare module '*.module.css' {
+  const classes: { [key: string]: string };
+  export default classes;
+}
+
+declare module '*.module.scss' {
+  const classes: { [key: string]: string };
+  export default classes;
+}
+
+declare module '*.module.sass' {
+  const classes: { [key: string]: string };
+  export default classes;
+}

docs/src/docusaurus.d.ts

@@ -0,0 +1,16 @@
+/// <reference types="@docusaurus/module-type-aliases" />
+/// <reference types="@docusaurus/types" />
+
+// Additional theme component type declarations
+declare module '@theme/Heading' {
+  import type {ReactNode, CSSProperties} from 'react';
+
+  export type Props = {
+    readonly as?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
+    readonly className?: string;
+    readonly style?: CSSProperties;
+    readonly children?: ReactNode;
+  };
+
+  export default function Heading(props: Props): ReactNode;
+}

docs/src/pages/index.tsx

@@ -55,11 +55,10 @@ function HomepageHeader() {
             className="text-5xl sm:text-6xl md:text-7xl lg:text-8xl font-extrabold mb-6 leading-tight animate-fade-in-up"
             style={{ animationDelay: '0.1s' }}
           >
-            <span className="text-gray-900">{t.title}</span>
+            <span className="text-gray-900">Route </span>
+            <span className="text-primary">Claude Code</span>
             <br />
-            <span className="text-transparent bg-clip-text bg-gradient-to-r from-primary to-primary/70">
+            <span className="text-gray-900">{t.highlight}</span>
-              {t.highlight}
-            </span>
           </Heading>
 
           {/* Subtitle */}
@@ -656,12 +655,9 @@ function CTASection() {
   );
 }
 
-export default function Home(): JSX.Element {
+export default function Home() {
-  const {siteConfig} = useDocusaurusContext();
   return (
-    <Layout
+    <Layout>
-      title={`${siteConfig.title}`}
-      description="Use Claude Code without an Anthropics account and route it to another LLM provider">
       <HomepageHeader />
       <main>
         <FeatureSection />

docs/tsconfig.json

@@ -2,9 +2,7 @@
   "extends": "../tsconfig.base.json",
   "compilerOptions": {
     "composite": true,
-    "jsx": "react",
+    "jsx": "react-jsx",
-    "jsxFactory": "React.createElement",
-    "jsxFragmentFactory": "React.Fragment",
     "module": "ESNext",
     "moduleResolution": "Bundler",
     "target": "ES2020",

package.json

@@ -36,6 +36,11 @@
     "shx": "^0.4.0",
     "typescript": "^5.8.2"
   },
+  "pnpm": {
+    "overrides": {
+      "@types/react": "18"
+    }
+  },
   "engines": {
     "node": ">=18.0.0",
     "pnpm": ">=8.0.0"