diff --git a/apps/web/.gitignore b/apps/web/.gitignore index 394dc2509..8b25bb54e 100644 --- a/apps/web/.gitignore +++ b/apps/web/.gitignore @@ -11,4 +11,3 @@ dist-ssr .vinxi __unconfig* todos.json -.source diff --git a/apps/web/content/docs/dev/contribution.mdx b/apps/web/content/docs/dev/contribution.mdx index 441cb1b55..7a2387997 100644 --- a/apps/web/content/docs/dev/contribution.mdx +++ b/apps/web/content/docs/dev/contribution.mdx @@ -109,6 +109,20 @@ npm run build --- +## Docs for AI Agents + +The documentation portal in `apps/web` speaks Markdown as well as HTML, so agents and LLM tools can read it without scraping: + +| URL | What you get | +| :--- | :--- | +| `/llms.txt` | An index of every docs page with its title, URL and description | +| `/llms-full.txt` | The whole documentation as one Markdown document | +| `/docs/.md` | A single page as Markdown, for example `/docs/dev/setup.md` | + +Requesting a docs page with an `Accept: text/markdown` header redirects to its `.md` twin, so a curious agent gets Markdown without asking twice. Every page also has a **Copy Markdown** button and an **Open in** menu for ChatGPT, Claude and friends. + +--- + ## Pull Request Guidelines 1. **Focused PRs**: Keep changes scoped to a single feature or bug fix. diff --git a/apps/web/content/docs/dev/data-loading.mdx b/apps/web/content/docs/dev/data-loading.mdx index 65992a1ce..bcd886f2a 100644 --- a/apps/web/content/docs/dev/data-loading.mdx +++ b/apps/web/content/docs/dev/data-loading.mdx @@ -1,7 +1,7 @@ --- title: Data Loading description: Load data in TanStack Start routes with server-side query warming and client-side suspense. -icon: DownloadCloud +icon: CloudDownload --- VitNode loads feature data through plugin routes. `definePluginRoute({ load })` diff --git a/apps/web/content/docs/dev/routing/loading-states.mdx b/apps/web/content/docs/dev/routing/loading-states.mdx index 23a1b7cc7..a2cbcee0c 100644 --- a/apps/web/content/docs/dev/routing/loading-states.mdx +++ b/apps/web/content/docs/dev/routing/loading-states.mdx @@ -1,7 +1,7 @@ --- title: Loading States description: Render instant skeleton shapes while TanStack Start routes load data or download chunks. -icon: Loader2 +icon: LoaderCircle --- import { TypeTable } from 'fumadocs-ui/components/type-table' diff --git a/apps/web/content/docs/ui/alert-dialog.mdx b/apps/web/content/docs/ui/alert-dialog.mdx index fef0fb3f8..5224201bb 100644 --- a/apps/web/content/docs/ui/alert-dialog.mdx +++ b/apps/web/content/docs/ui/alert-dialog.mdx @@ -1,7 +1,7 @@ --- title: Alert Dialog description: Display important messages to users in a modal dialog. -icon: AlertOctagon +icon: OctagonAlert --- A modal dialog that interrupts the user with important content and expects a diff --git a/apps/web/content/docs/ui/alert.mdx b/apps/web/content/docs/ui/alert.mdx index 9777d19bd..7061c7dd6 100644 --- a/apps/web/content/docs/ui/alert.mdx +++ b/apps/web/content/docs/ui/alert.mdx @@ -1,7 +1,7 @@ --- title: Alert description: Display an important status message with a clear action or next step. -icon: AlertTriangle +icon: TriangleAlert --- ## Preview diff --git a/apps/web/content/docs/ui/auto-form.mdx b/apps/web/content/docs/ui/auto-form.mdx index 6124f6d4d..4b719ff88 100644 --- a/apps/web/content/docs/ui/auto-form.mdx +++ b/apps/web/content/docs/ui/auto-form.mdx @@ -1,7 +1,7 @@ --- title: Auto Form description: Generates forms based on Zod schemas and react-hook-form with validation and input controls. -icon: FormInput +icon: RectangleEllipsis --- import { TypeTable } from "fumadocs-ui/components/type-table" diff --git a/apps/web/content/docs/ui/checkbox.mdx b/apps/web/content/docs/ui/checkbox.mdx index de4094481..892926901 100644 --- a/apps/web/content/docs/ui/checkbox.mdx +++ b/apps/web/content/docs/ui/checkbox.mdx @@ -1,7 +1,7 @@ --- title: Checkbox description: Let people select one or more options with accessible checked states. -icon: CheckSquare +icon: SquareCheck --- ## Preview diff --git a/apps/web/content/docs/ui/confirm-action-alert-dialog.mdx b/apps/web/content/docs/ui/confirm-action-alert-dialog.mdx index c2d6b9d81..0cfdbfb2b 100644 --- a/apps/web/content/docs/ui/confirm-action-alert-dialog.mdx +++ b/apps/web/content/docs/ui/confirm-action-alert-dialog.mdx @@ -1,7 +1,7 @@ --- title: Confirm Action Alert Dialog description: A dialog component for confirming destructive actions like delete operations, built on top of the Alert Dialog. -icon: HelpCircle +icon: CircleQuestionMark --- The Confirm Action Alert Dialog is a specialized dialog component built on top of the [Alert Dialog](/docs/ui/alert-dialog) that provides a consistent way to confirm potentially destructive or irreversible actions before they're executed. diff --git a/apps/web/content/docs/ui/editor.mdx b/apps/web/content/docs/ui/editor.mdx index 13fe7b548..d195c188c 100644 --- a/apps/web/content/docs/ui/editor.mdx +++ b/apps/web/content/docs/ui/editor.mdx @@ -8,6 +8,146 @@ icon: PenTool +import { TypeTable } from 'fumadocs-ui/components/type-table' + +## What you get + +The toolbar ships with everything below, and every feature is also available +through its own keyboard shortcut or markdown-style input rule. + +| Group | Controls | +| ---------- | --------------------------------------------------------------------------------------------- | +| History | Undo, redo | +| Text | Paragraph, headings 1-4, font size, bold, italic, underline, strike, inline code, text colour | +| Layout | Left / center / right / justify alignment | +| Blocks | Bullet list, ordered list, blockquote, code block, horizontal rule | +| Rich media | Tables, emoji, audio | + +A few extras run quietly in the background: + +- **Typography** turns `(c)`, `->`, `1/2` and friends into `©`, `→` and `½` as you type. +- **Emoji** has three ways in - see [Emoji](#emoji) below. +- **Placeholder** shows a hint while the editor is empty. Override it with the + `placeholder` prop. +- **Drag handle** appears next to the block under your cursor so any block - + nested ones included - can be dragged somewhere else. A **drop cursor** shows + where it will land. +- **Trailing node** always keeps an empty paragraph at the end, so you can never + get stuck under a table or a code block. + +### Emoji + +There are three ways to get an emoji into the editor, and they all end up as the +same node: + +- **Type a shortcode.** `:tada:` becomes 🎉 the moment you close the second + colon. +- **Use the `:` menu.** Start typing `:tad` and an autocomplete appears. Arrow + keys move, `Enter` or `Tab` inserts, `Esc` closes. Results are ranked, so + `:flag` puts flags first rather than everything tagged "flag". +- **Open the picker.** The toolbar's emoji button opens a searchable, + virtualised grid with categories and skin tones, from + [Ferruccio's emoji picker](https://emoji.ferrucc.io/). Hovering an emoji + previews it in the footer with its name and its shortcode, so the picker also + teaches you what to type next time. + +Pasting a raw emoji character works too - it is upgraded to a node on the way +in. + +#### Custom emoji + +Your own emoji are app-wide, so they live in `vitnode.config.ts` and every +`Editor` in the app picks them up - no props to pass: + +```ts title="src/vitnode.config.ts" +import { buildConfig } from '@vitnode/core/vitnode.config' + +export const vitNodeConfig = buildConfig({ + editor: { + emojis: [ + { + label: 'VitNode', + emojis: [ + { + name: 'vitnode', + src: '/logo_vitnode_icon.svg', + tags: ['logo', 'brand'], + }, + ], + }, + ], + }, + // ...the rest of your config +}) +``` + +That one entry gives you all three routes at once: `:vitnode:` converts as you +type, `:vitn` finds it in the `:` menu, and the picker grows a **VitNode** +section you can search. + + + +A custom emoji is stored as `` with +your image inside, so `EditorContent` renders it on public pages exactly as the +editor does - as long as `src` is still reachable from there. + +### Tables + +Insert a 3x3 table with a header row from the table menu, then use the same menu +to add or remove rows and columns, toggle the header row or column, merge or +split cells, or delete the table. Columns are resizable by dragging their edge, +and wide tables scroll horizontally instead of breaking the page. + +### Audio + +Paste a link to an `mp3`, `wav`, `ogg` (or any other browser-playable file) and +it renders as a native `