e30e75b5d4
Code Quality / Oxlint + Oxfmt (push) Waiting to run
Code Quality / Template Sync (push) Waiting to run
Code Quality / Build Changed Packages (push) Waiting to run
Code Quality / Test Changed Packages (push) Waiting to run
Deploy Expo Example / Deploy Production (push) Waiting to run
Deploy Ink Example / Deploy Production (push) Waiting to run
Python Tests / pytest (assistant-stream, 3.10) (push) Waiting to run
Python Tests / pytest (assistant-stream, 3.12) (push) Waiting to run
Python Tests / pytest (assistant-ui-sync-server-api, 3.10) (push) Waiting to run
Python Tests / pytest (assistant-ui-sync-server-api, 3.12) (push) Waiting to run
Deploy Shadcn Registry / Deploy Production (push) Waiting to run
Template Metrics / LOC + Bundle Size (push) Waiting to run
Changesets / Create Version PR (push) Has been cancelled
34 lines
1.2 KiB
Plaintext
34 lines
1.2 KiB
Plaintext
---
|
|
title: Examples
|
|
description: Production-ready examples of AI chat in React — ChatGPT clones, copilots, generative UI, artifacts, multimodal, and more, all built with assistant-ui.
|
|
---
|
|
|
|
import { ExampleCard } from "@/components/docs/example-card";
|
|
import { INTERNAL_EXAMPLES, COMMUNITY_EXAMPLES } from "@/lib/examples";
|
|
|
|
<header className="mt-12 mb-16 text-center md:mt-20">
|
|
<h1 className="mb-4 font-medium text-4xl">Examples</h1>
|
|
|
|
<span className="block text-muted-foreground">
|
|
Explore our collection of examples that demonstrate different ways to integrate assistant-ui into your applications.
|
|
</span>
|
|
</header>
|
|
|
|
<div className="grid gap-6 lg:grid-cols-2 xl:grid-cols-3">
|
|
{INTERNAL_EXAMPLES.map((item) => (
|
|
<ExampleCard key={item.title} {...item} />
|
|
))}
|
|
</div>
|
|
|
|
<h2 className="mt-16 mb-8 font-medium text-2xl">Community Examples</h2>
|
|
|
|
<div className="grid gap-6 lg:grid-cols-2 xl:grid-cols-3">
|
|
{COMMUNITY_EXAMPLES.map((item) => (
|
|
<ExampleCard key={item.title} {...item} />
|
|
))}
|
|
</div>
|
|
|
|
<div className="my-16 not-prose">
|
|
<p className="text-muted-foreground">Looking for more examples? <a href="/showcase" className="font-medium text-foreground transition-colors hover:text-foreground/70">Check out the community showcase →</a></p>
|
|
</div>
|