feat(docs): add bilingual package documentation site

2026-09-20 15:53:28 +08:00
parent 60f6f1fb1a
commit dc80bd8ae0
111 changed files with 6531 additions and 0 deletions
@@ -0,0 +1,30 @@
+---
+title: Choose components
+description: Select primitives by responsibility instead of importing a single monolithic component index.
+order: 11
+toc:
+  - id: forms
+    title: Forms and input
+  - id: overlays
+    title: Overlays and menus
+  - id: content
+    title: Content and feedback
+  - id: icons
+    title: Icons
+---
+
+## Forms and input {#forms}
+
+Use `Button`, `Input`, `Textarea`, `Field`, and `Label` for ordinary forms. Add `Checkbox`, `RadioGroup`, `Switch`, or `Slider` for choices, and `Select`, `Combobox`, `Command`, or `Calendar` for richer selection.
+
+## Overlays and menus {#overlays}
+
+`Dialog`, `AlertDialog`, `Sheet`, and `Drawer` cover modal surfaces. `Popover`, `HoverCard`, and `Tooltip` provide anchored information, while the menu modules cover context, dropdown, menubar, and navigation patterns.
+
+## Content and feedback {#content}
+
+Cards, items, tables, charts, progress, skeletons, spinners, empty states, messages, and toasts provide the common display vocabulary. Accordion, Collapsible, Tabs, Carousel, and Pagination organize larger content sets.
+
+## Icons {#icons}
+
+Import named icons from `@workspace/ui/components/icon`. The module centralizes the `@icones/react` vocabulary so applications and packages use the same icon source.
@@ -0,0 +1,39 @@
+---
+title: Project setup
+description: Import the global stylesheet and begin with explicit component subpaths.
+order: 10
+toc:
+  - id: import-styles
+    title: Import styles
+  - id: import-a-component
+    title: Import a component
+  - id: entry-points
+    title: Entry points
+---
+
+## Import styles {#import-styles}
+
+Import the global stylesheet once at the application entry:
+
+```ts
+import "@workspace/ui/globals.css"
+```
+
+It provides the shared Tailwind layers, design variables, font setup, and utilities expected by the components.
+
+## Import a component {#import-a-component}
+
+```tsx
+import { Button } from "@workspace/ui/components/button"
+
+export function SaveButton() {
+  return <Button>Save</Button>
+}
+```
+
+## Entry points {#entry-points}
+
+- `@workspace/ui/components/*` exposes one component module.
+- `@workspace/ui/hooks/*` exposes reusable interactions and media-query state.
+- `@workspace/ui/lib/utils` exposes shared class-name composition.
+- `@workspace/ui/locales/*` exposes language-specific catalogs.