# @qijenchen/design-system

> World-class React design system(Radix/shadcn + Tailwind v4 + 自訂 design token)。
> 54 components + 4 public patterns + design tokens。v0.1.0-beta.61。

本檔由 source(spec.md frontmatter + Storybook index)build-time 自動生成,**禁手改**(CI --check drift gate 守)。
每元件 / pattern 的完整 variants / sizes / 禁止事項 全文見 [llms-full.txt](./llms-full.txt)。
元件原始範例 source:node_modules/@qijenchen/design-system/src/<dir>/*.stories.tsx;rendered:Storybook 連結。

## Components
- [Accordion](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/Accordion
- [Alert](https://ajenchen-design-system.netlify.app): variants:neutral/info/success/warning/error — src:components/Alert
- [app-shell](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/AppShell
- [AspectRatio](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/AspectRatio
- [Avatar](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/Avatar
- [Badge](https://ajenchen-design-system.netlify.app): variants:critical/high/medium/low — src:components/Badge
- [Breadcrumb](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/Breadcrumb
- [BulkActionBar](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/BulkActionBar
- [Button](https://ajenchen-design-system.netlify.app): variants:primary/secondary/tertiary/text/link;sizes:xs/sm/md/lg — src:components/Button
- [Calendar](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/Calendar
- [Carousel](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/Carousel
- [Chart](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/Chart
- [Checkbox](https://ajenchen-design-system.netlify.app): sizes:sm/md/lg — src:components/Checkbox
- [Chip](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/Chip
- [CircularProgress](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/CircularProgress
- [Coachmark](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/Coachmark
- [Combobox](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/Combobox
- [DataTable](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/DataTable
- [DatePicker](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/DatePicker
- [DescriptionList](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/DescriptionList
- [Dialog](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/Dialog
- [DropdownMenu](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/DropdownMenu
- [Empty](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/Empty
- [Field](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/Field
- [FieldControlGroup](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/FieldControlGroup
- [FieldControls](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/Field
- [FileItem](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/FileItem
- [FileUpload](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/FileUpload
- [FileViewer](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/FileViewer
- [Input](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/Input
- [LinkInput](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/LinkInput
- [NumberInput](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/NumberInput
- [PeoplePicker](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/PeoplePicker
- [Popover](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/Popover
- [ProgressBar](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/ProgressBar
- [RadioGroup](https://ajenchen-design-system.netlify.app): sizes:sm/md/lg — src:components/RadioGroup
- [Rating](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/Rating
- [ScrollArea](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/ScrollArea
- [SegmentedControl](https://ajenchen-design-system.netlify.app): sizes:xs/sm/md/lg — src:components/SegmentedControl
- [Select](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/Select
- [Separator](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/Separator
- [Sheet](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/Sheet
- [Sidebar](https://ajenchen-design-system.netlify.app): variants:default/meta;sizes:sm/md/lg — src:components/Sidebar
- [Skeleton](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/Skeleton
- [Slider](https://ajenchen-design-system.netlify.app): sizes:sm/md/lg — src:components/Slider
- [Steps](https://ajenchen-design-system.netlify.app): sizes:sm/md/lg — src:components/Steps
- [Switch](https://ajenchen-design-system.netlify.app): sizes:sm/md/lg — src:components/Switch
- [Tabs](https://ajenchen-design-system.netlify.app): sizes:sm/md/lg — src:components/Tabs
- [Tag](https://ajenchen-design-system.netlify.app): variants:neutral/blue/green/deep-orange/yellow/red/orange/amber/lime/turquoise/indigo/purple/magenta;sizes:sm/md/lg — src:components/Tag
- [Textarea](https://ajenchen-design-system.netlify.app): sizes:sm/md/lg — src:components/Textarea
- [TimePicker](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/TimePicker
- [Toast](https://ajenchen-design-system.netlify.app): variants:neutral/info/success/warning/error — src:components/Toast
- [Tooltip](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/Tooltip
- [TreeView](https://ajenchen-design-system.netlify.app): 見 Storybook / spec — src:components/TreeView

## Patterns
- [action-bar](https://ajenchen-design-system.netlify.app): 跨元件 anatomy / 設計參照 pattern — src:patterns/action-bar
- [element-anatomy](https://ajenchen-design-system.netlify.app): 跨元件 anatomy / 設計參照 pattern — src:patterns/element-anatomy
- [header-canonical](https://ajenchen-design-system.netlify.app): 跨元件 anatomy / 設計參照 pattern — src:patterns/header-canonical
- [ResizeHandle](https://ajenchen-design-system.netlify.app): 跨元件 anatomy / 設計參照 pattern — src:patterns/resize-handle
