From d603038a696afec9c1fef925d9d2f1433b117f88 Mon Sep 17 00:00:00 2001
From: Jose Socorro <jsocorro@coderabbit.ai>
Date: Fri, 19 Jun 2026 11:10:43 -0400
Subject: [PATCH] Preview/React Doctor: add React files to trigger React Doctor
 findings

---
 package.json           | 14 ++++++++++++++
 src/App.tsx            | 34 ++++++++++++++++++++++++++++++++++
 src/AssertiveHints.tsx | 21 +++++++++++++++++++++
 src/main.tsx           |  7 +++++++
 tsconfig.json          | 14 ++++++++++++++
 5 files changed, 90 insertions(+)
 create mode 100644 package.json
 create mode 100644 src/App.tsx
 create mode 100644 src/AssertiveHints.tsx
 create mode 100644 src/main.tsx
 create mode 100644 tsconfig.json

diff --git a/package.json b/package.json
new file mode 100644
index 0000000..c218f9d
--- /dev/null
+++ b/package.json
@@ -0,0 +1,14 @@
+{
+  "name": "react-doctor-cr-test",
+  "private": true,
+  "type": "module",
+  "dependencies": {
+    "react": "^18.3.0",
+    "react-dom": "^18.3.0"
+  },
+  "devDependencies": {
+    "typescript": "^5.0.0",
+    "@types/react": "^18.0.0",
+    "@types/react-dom": "^18.0.0"
+  }
+}
diff --git a/src/App.tsx b/src/App.tsx
new file mode 100644
index 0000000..801d929
--- /dev/null
+++ b/src/App.tsx
@@ -0,0 +1,34 @@
+import { createContext, useState } from "react";
+import { AssertiveHints } from "./AssertiveHints.js";
+
+const items = ["alpha", "beta", "gamma"];
+
+export function App() {
+  const ThemeContext = createContext("light");
+  const [userHtml] = useState("<img src=x onerror=alert(1)>");
+  const userInput = "alert('xss')";
+
+  return (
+    <ThemeContext.Provider value="dark">
+      <main>
+        <div dangerouslySetInnerHTML={{ __html: userHtml }} />
+        <a href="javascript:alert(1)">click me</a>
+        <iframe src="https://example.com" title="embed" />
+        <ul>
+          {items.map((item) => (
+            <li>{item}</li>
+          ))}
+        </ul>
+        <button
+          onClick={() => {
+            eval(userInput);
+            new Function(userInput)();
+          }}
+        >
+          run
+        </button>
+        <AssertiveHints />
+      </main>
+    </ThemeContext.Provider>
+  );
+}
diff --git a/src/AssertiveHints.tsx b/src/AssertiveHints.tsx
new file mode 100644
index 0000000..1725336
--- /dev/null
+++ b/src/AssertiveHints.tsx
@@ -0,0 +1,21 @@
+type RowProps = {
+  label: string;
+  onSelect: () => void;
+};
+
+function Row({ label, onSelect }: RowProps) {
+  return <span>{label}</span>;
+}
+
+export function AssertiveHints() {
+  const handleAction = () => console.log("action");
+
+  return (
+    <section>
+      <button>Save</button>
+      <img src="/logo.png" />
+      <div onClick={handleAction}>Open menu</div>
+      <Row label="item-a" onSelect={() => console.log("selected")} />
+    </section>
+  );
+}
diff --git a/src/main.tsx b/src/main.tsx
new file mode 100644
index 0000000..ecbc456
--- /dev/null
+++ b/src/main.tsx
@@ -0,0 +1,7 @@
+import { createRoot } from "react-dom/client";
+import { App } from "./App.js";
+
+const root = document.getElementById("root");
+if (root) {
+  createRoot(root).render(<App />);
+}
diff --git a/tsconfig.json b/tsconfig.json
new file mode 100644
index 0000000..0389b2e
--- /dev/null
+++ b/tsconfig.json
@@ -0,0 +1,14 @@
+{
+  "compilerOptions": {
+    "target": "ES2020",
+    "lib": ["ES2020", "DOM", "DOM.Iterable"],
+    "jsx": "react-jsx",
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "strict": true,
+    "noEmit": true,
+    "skipLibCheck": true,
+    "isolatedModules": true
+  },
+  "include": ["src"]
+}