# Exporting a Client Side Prover

## Circuit Export

When you select the **Export > Export TypeScript circuit** option in AxiomREPL, a `circuit.ts` file will be downloaded with all the artifacts specific to your circuit that are required to run the circuit inside your own application. Namely, `circuit.ts` includes: the circuit size and configuration, default circuit inputs and their types, the circuit verification key, and your circuit code. This is all exported as a singular `circuit` object.

To add this into a React app, first install `@axiom-crypto/react` using a package manager such as `npm`/`yarn`/`pnpm`.

{% code title="Terminal" %}

```bash
npm install @axiom-crypto/react
```

{% endcode %}

## AxiomCircuitProvider

In order to use this in your Next.js 13 app, you'll need to wrap `AxiomCircuitProvider` in its own file to ensure that it's only mounted once:

{% code title="src/axiomProvider.tsx" %}

```typescript
"use client";

import { useEffect, useState } from "react";
import { AxiomCircuitProvider } from '@axiom-crypto/react';
import { circuit } from "@/lib/circuit";  // REPLACE w/ path to exported circuit.ts

export default function AxiomProvider({ children }: { children: React.ReactNode }) {
  const [mounted, setMounted] = useState(false);
  useEffect(() => setMounted(true), []);

  return (
    <AxiomCircuitProvider
      circuit={circuit}
      providerUri={process.env.NEXT_PUBLIC_PROVIDER_URI_GOERLI as string}
      chainId={5}
      mock={true}
    >
      {mounted && children}
    </AxiomCircuitProvider>
  )
}
```

{% endcode %}

and in your layout file:

{% code title="src/layout.tsx" %}

```javascript
return (
  ...
    <AxiomProvider>
      {children}
    </AxiomProvider>
  ...
)
```

{% endcode %}

## useAxiomCircuit

Then you can use the `useAxiomCircuit` hook to get built queries inside your application:

```typescript
const circuit = useAxiomCircuit();

// you may need to wrap the `setParams` call in a useEffect hook to prevent an
// infinite reload loop 
useEffect(() => {
    circuit.setParams(inputs, callback);
}, [circuit, inputs, callback]);
const builtQuery = circuit.builtQuery;

// can now use builtQuery to send an on-chain Query to Axiom
```

### Hook functionality

The following functions and variables are available from the `useAxiomCircuit` hook:

#### axiom

The `Axiom` instance variable. Exposes useful things like the `AxiomV2Query` contract address and ABI.

#### setParams

Function to set the `inputs` and `callback`.

#### areParamsSet

Boolean that returns `true` if `inputs` and `callback` are set, or `false` otherwise.

#### build

Async function to build the `inputs` and `callback` along with the provided circuit into a `Query` to be sent to `AxiomV2Query`.

#### builtQuery

The full `builtQuery` variable that contains all inputs required for calling `sendQuery` on `AxiomV2Query`.

#### payment

Variable that gives the calculated payment amount for the `Query`.

#### reset

Function to reset the `inputs` and `callback` variables.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://intrinsic-1.gitbook.io/axiomv2-sdk/developers/exporting-a-client-side-prover.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
