namehash · notrab · Apr 27, 2026 · May 11, 2026 · May 11, 2026 · May 11, 2026
diff --git a/examples/ensnode-react-example/LICENSE b/examples/ensnode-react-example/LICENSE
@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 NameHash
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
diff --git a/examples/ensnode-react-example/README.md b/examples/ensnode-react-example/README.md
@@ -0,0 +1,20 @@
+# ensnode-react Example
+
+A minimal React app demonstrating how to use `@ensnode/ensnode-react` to resolve
+an address' Mainnet Primary Name (via `usePrimaryName`).
+
+By default it connects to the NameHash-hosted alpha ENSNode at
+`https://api.alpha.ensnode.io`.
+
+## Usage
+
+```bash
+pnpm install
+pnpm -F @ensnode/ensnode-react-example dev
+```
+
+To point at a different ENSNode, set `VITE_ENSNODE_URL`:
+
+```bash
+VITE_ENSNODE_URL=http://localhost:4334 pnpm -F @ensnode/ensnode-react-example dev
+```
diff --git a/examples/ensnode-react-example/index.html b/examples/ensnode-react-example/index.html
@@ -0,0 +1,12 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>ensnode-react Example</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>
diff --git a/examples/ensnode-react-example/package.json b/examples/ensnode-react-example/package.json
@@ -0,0 +1,28 @@
+{
+  "name": "@ensnode/ensnode-react-example",
+  "private": true,
+  "version": "0.0.1",
+  "license": "MIT",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "preview": "vite preview",
+    "typecheck": "tsgo --noEmit"
+  },
+  "dependencies": {
+    "@ensnode/ensnode-react": "workspace:*",
+    "@ensnode/ensnode-sdk": "workspace:*",
+    "@tanstack/react-query": "^5.62.14",
+    "enssdk": "workspace:*",
+    "react": "catalog:",
+    "react-dom": "catalog:"
+  },
+  "devDependencies": {
+    "@types/react": "catalog:",
+    "@types/react-dom": "catalog:",
+    "@vitejs/plugin-react": "^4.5.2",
+    "typescript": "catalog:",
+    "vite": "catalog:"
+  }
+}
diff --git a/examples/ensnode-react-example/src/App.tsx b/examples/ensnode-react-example/src/App.tsx
@@ -0,0 +1,25 @@
+import { StrictMode } from "react";
+
+import { createEnsNodeProviderOptions, EnsNodeProvider } from "@ensnode/ensnode-react";
+
+import { PrimaryNameView } from "./PrimaryNameView";
+
+const ENSNODE_URL = import.meta.env.VITE_ENSNODE_URL ?? "https://api.alpha.ensnode.io";
+
+const options = createEnsNodeProviderOptions({ url: ENSNODE_URL });
+
+export function App() {
+  return (
+    <StrictMode>
+      <EnsNodeProvider options={options}>
+        <h1>
+          <code>ensnode-react</code> Example App
+        </h1>
+        <p>
+          Connected to <code>{ENSNODE_URL}</code>
+        </p>
+        <PrimaryNameView />
+      </EnsNodeProvider>
+    </StrictMode>
+  );
+}
diff --git a/examples/ensnode-react-example/src/PrimaryNameView.tsx b/examples/ensnode-react-example/src/PrimaryNameView.tsx
@@ -0,0 +1,51 @@
+import type { Address, ChainId } from "enssdk";
+import { useState } from "react";
+
+import { usePrimaryName } from "@ensnode/ensnode-react";
+
+const DEFAULT_ADDRESS: Address = "0xd8dA6BF26964aF9D7eEd9e03E53415D37aA96045"; // vitalik.eth
+const MAINNET: ChainId = 1;
+
+export function PrimaryNameView() {
+  const [address, setAddress] = useState<Address>(DEFAULT_ADDRESS);
+  const [input, setInput] = useState<string>(DEFAULT_ADDRESS);
+
+  const { data, isLoading, error } = usePrimaryName({
+    address,
+    chainId: MAINNET,
+    accelerate: true,
+  });
+
+  return (
+    <div>
+      <h2>Primary Name</h2>
+      <p>
+        Resolves the ENSIP-19 Mainnet Primary Name for an address using <code>usePrimaryName</code>.
+      </p>
+
+      <form
+        onSubmit={(event) => {
+          event.preventDefault();
+          setAddress(input as Address);
+        }}
+      >
+        <input
+          type="text"
+          value={input}
+          onChange={(event) => setInput(event.target.value)}
+          placeholder="0x..."
+          style={{ width: "28rem" }}
+        />
+        <button type="submit">Resolve</button>
+      </form>
+
+      {isLoading && <p>Loading...</p>}
+      {error && <p>Error: {error.message}</p>}
+      {data && (
+        <p>
+          Primary Name: <strong>{data.name ?? "(none)"}</strong>
+        </p>
+      )}
+    </div>
+  );
+}
diff --git a/examples/ensnode-react-example/src/main.tsx b/examples/ensnode-react-example/src/main.tsx
@@ -0,0 +1,6 @@
+import { createRoot } from "react-dom/client";
+
+import { App } from "./App";
+
+// biome-ignore lint/style/noNonNullAssertion: the #root element definitely exists (see index.html)
+createRoot(document.getElementById("root")!).render(<App />);
diff --git a/examples/ensnode-react-example/src/vite-env.d.ts b/examples/ensnode-react-example/src/vite-env.d.ts
@@ -0,0 +1 @@
+/// <reference types="vite/client" />
diff --git a/examples/ensnode-react-example/tsconfig.json b/examples/ensnode-react-example/tsconfig.json
@@ -0,0 +1,13 @@
+{
+  "compilerOptions": {
+    "target": "ES2022",
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "jsx": "react-jsx",
+    "strict": true,
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "lib": ["ESNext", "DOM", "DOM.Iterable"]
+  },
+  "include": ["src"]
+}
diff --git a/examples/ensnode-react-example/vite.config.ts b/examples/ensnode-react-example/vite.config.ts
@@ -0,0 +1,6 @@
+import react from "@vitejs/plugin-react";
+import { defineConfig } from "vite";
+
+export default defineConfig({
+  plugins: [react()],
+});