> ## Documentation Index
> 
> Fetch the complete documentation index at: [/docs/llms.txt](/docs/llms.txt)
> 
> Use this file to discover all available pages before exploring further.

[Skip to main content](#content-area)

## 

[​

](#requirements)

Requirements

-   React 18 or later

## 

[​

](#install)

Install

```
npm install @osforms/react
```

```
pnpm add @osforms/react
```

```
yarn add @osforms/react
```

## 

[​

](#typescript)

TypeScript

Types are bundled — no separate `@types` package needed. All types from `@osforms/types` are re-exported from `@osforms/react`:

```
import type {
  FormSchema,
  FormField,
  FormTheme,
  FieldType,
  ConditionalLogic,
} from '@osforms/react';
```

## 

[​

](#next-js-app-router)

Next.js (App Router)

Works out of the box. Add `'use client'` when using in a Server Component file:

```
'use client';

import { OSForm } from '@osforms/react';

export default function ContactPage() {
  return <OSForm formId="abc123" mode="conversational" fullScreen />;
}
```

## 

[​

](#next-js-pages-router)

Next.js (Pages Router)

No special configuration needed — all files in `pages/` are client-side by default:

```
import { OSForm } from '@osforms/react';

export default function ContactPage() {
  return <OSForm formId="abc123" />;
}
```

## 

[​

](#vite-/-cra)

Vite / CRA

Works without additional configuration.

## 

[​

](#bundle-size)

Bundle size

| What | Size |
| --- | --- |
| `@osforms/react` (gzipped) | ~25 kB |
| `framer-motion` (gzipped, auto-installed) | ~40 kB |

⌘I