+
+ These docs are plain markdown, following the{" "}
+
+ llms.txt
+ {" "}
+ convention.
+
+
+
+ {docs.map(({ href, path, description }) => (
+
+
+
+ {path}
+
+ |
+ {description} |
+
+ ))}
+
+
+
+ The full docs also ship inside the package, at{" "}
+
+ node_modules/calligraph/llms-full.txt
+
+ .
+
+
>
);
}
diff --git a/apps/web/app/styles.module.css b/apps/web/app/styles.module.css
index 09219b4..21fd85a 100644
--- a/apps/web/app/styles.module.css
+++ b/apps/web/app/styles.module.css
@@ -100,3 +100,24 @@
.content {
min-height: 0;
}
+
+.link {
+ color: var(--gray-12);
+ text-decoration: underline;
+ text-decoration-color: var(--gray-6);
+ text-underline-offset: 3px;
+ transition: text-decoration-color 0.15s;
+}
+
+.link:hover {
+ text-decoration-color: var(--gray-9);
+}
+
+.code {
+ padding: 1px 5px;
+ font-family: "JetBrains Mono", var(--font-mono), monospace;
+ font-size: 12px;
+ color: var(--gray-12);
+ background: var(--gray-2);
+ border-radius: 4px;
+}
diff --git a/apps/web/lib/docs.ts b/apps/web/lib/docs.ts
new file mode 100644
index 0000000..0f00579
--- /dev/null
+++ b/apps/web/lib/docs.ts
@@ -0,0 +1,10 @@
+import { readFileSync } from "node:fs";
+import { join } from "node:path";
+
+// Single source of truth: the docs files that also ship inside the npm package.
+// Read at build time — every route using them is force-static.
+const read = (name: string) =>
+ readFileSync(join(process.cwd(), "../../packages/calligraph", name), "utf8");
+
+export const index = read("llms.txt");
+export const full = read("llms-full.txt");
diff --git a/packages/calligraph/llms-full.txt b/packages/calligraph/llms-full.txt
new file mode 100644
index 0000000..0e85a8c
--- /dev/null
+++ b/packages/calligraph/llms-full.txt
@@ -0,0 +1,220 @@
+# Calligraph
+
+> Fluid text and number transitions for React, powered by [Motion](https://motion.dev). Shared characters slide to their new positions, entering characters fade in, exiting ones fade out. Numbers roll vertically or spin like a slot machine.
+
+- Package: `calligraph` (npm, MIT, ESM only, ~20 kB unminified)
+- Docs: https://calligraph.raphaelsalaja.com
+- Repo: https://github.com/raphaelsalaja/calligraph
+- Exports: the `Calligraph` component and the `CalligraphProps` type. Nothing else is public.
+
+## Install
+
+```bash
+npm install calligraph
+# pnpm add calligraph
+# yarn add calligraph
+```
+
+`motion`, `react` and `react-dom` are peer dependencies (`motion >=11`, `react >=18`, `react-dom >=18`). Calligraph bundles nothing but itself and ships no CSS - there is no stylesheet to import.
+
+## Quick start
+
+```tsx
+"use client";
+
+import { Calligraph } from "calligraph";
+import { useState } from "react";
+
+const words = ["Hello", "World", "Calligraph"];
+
+export function Example() {
+ const [index, setIndex] = useState(0);
+
+ return (
+