@monkey-mini-app/dsh-mini-app 0.1.1 → 0.1.5

package/skills/monkey-mini-app/references/contracts/autocomplete.md

@@ -1,10 +1,14 @@
-<!-- generated by scripts/generate-skill.mjs — do not edit -->
+<!-- generated by scripts/gen/skill — do not edit -->
 
 # Autocomplete
 
+Text input with filtered suggestions.
+
+**when** Free text allowed but known values should be suggested. Strict pick-list → `Select`.
+
 `import { Autocomplete } from "@monkey-mini-app/ui"`
 
-`packages/ui/src/composites/autocomplete.tsx` · composites
+`packages/ui/src/composites/autocomplete.tsx` · family: Form · type: composite
 
 ## Props
 
@@ -14,3 +18,9 @@
 | `options` | `string[]` | ✓ |  |
 | `placeholder` | `string \| undefined` |  |  |
 | `value` | `string \| undefined` |  |  |
+
+## Example
+
+```tsx
+<Autocomplete options={["main", "develop"]} onChange={(v) => set(v)} />
+```

package/skills/monkey-mini-app/references/contracts/avatar.md

@@ -0,0 +1,24 @@
+<!-- generated by scripts/gen/skill — do not edit -->
+
+# Avatar (L1 primitive)
+
+**when** User initials/photo next to a name in rows, comments, pickers.
+
+Compound: compose the parts below — **do not invent part names**.
+
+`import { Avatar, AvatarBadge, AvatarFallback, AvatarGroup, AvatarGroupCount, AvatarImage } from "@monkey-mini-app/ui"`
+
+`packages/ui/src/components/avatar.tsx` · family: Layout & structure · type: component · primitive
+
+## Parts
+
+| part | own props |
+|---|---|
+| `Avatar` | `render?` `size?=default/sm/lg` |
+| `AvatarBadge` | — |
+| `AvatarFallback` | `delay?` `render?` |
+| `AvatarGroup` | — |
+| `AvatarGroupCount` | — |
+| `AvatarImage` | `onLoadingStatusChange?` `render?` |
+
+_Inherited HTML/ARIA props (`className`, `style`, `id`, `onClick`, `aria-*`, …) omitted — every component takes them._

package/skills/monkey-mini-app/references/contracts/badge.md

@@ -0,0 +1,26 @@
+<!-- generated by scripts/gen/skill — do not edit -->
+
+# Badge (L1 primitive)
+
+Inline label chip.
+
+**when** Static tags/counts. Status → `StatusBadge`, severity → `SeverityChip`.
+
+`import { Badge, badgeVariants } from "@monkey-mini-app/ui"`
+
+`packages/ui/src/components/badge.tsx` · family: Feedback & status · type: component · primitive
+
+## Parts
+
+| part | own props |
+|---|---|
+| `Badge` | `render?` `variant?=link/default/outline/secondary/ghost/destructive` |
+| `badgeVariants` (hook/util) | `class?` `variant?=link/default/outline/secondary/ghost/destructive` |
+
+_Inherited HTML/ARIA props (`className`, `style`, `id`, `onClick`, `aria-*`, …) omitted — every component takes them._
+
+## Skeleton
+
+```tsx
+<Badge variant="secondary">草稿</Badge>
+```

package/skills/monkey-mini-app/references/contracts/breadcrumb.md

@@ -0,0 +1,33 @@
+<!-- generated by scripts/gen/skill — do not edit -->
+
+# Breadcrumb (L1 primitive)
+
+**when** Deep mini-app views; usually one level is enough — prefer `Tabs`/`AppShell` nav.
+
+Compound: compose the parts below — **do not invent part names**.
+
+`import { Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator } from "@monkey-mini-app/ui"`
+
+`packages/ui/src/components/breadcrumb.tsx` · family: Navigation · type: component · primitive
+
+## Parts
+
+| part | own props |
+|---|---|
+| `Breadcrumb` | — |
+| `BreadcrumbEllipsis` | — |
+| `BreadcrumbItem` | — |
+| `BreadcrumbLink` | `render?` |
+| `BreadcrumbList` | — |
+| `BreadcrumbPage` | — |
+| `BreadcrumbSeparator` | — |
+
+_Inherited HTML/ARIA props (`className`, `style`, `id`, `onClick`, `aria-*`, …) omitted — every component takes them._
+
+## Examples
+
+Runnable files under `references/examples/` — portable by construction (`react` +
+`@monkey-mini-app/ui` + relatives), so copy the closest one into `ui.tsx` / `ui/`.
+Pick by **scenario**, then open the file you need.
+
+- **[breadcrumb-01.tsx](../examples/breadcrumb/breadcrumb-01.tsx)** — Breadcrumb — Deep-navigation path where the current level is not a link and separators are automatic; use for drill-down pages (org / team / project / run).

package/skills/monkey-mini-app/references/contracts/bubble.md

@@ -0,0 +1,30 @@
+<!-- generated by scripts/gen/skill — do not edit -->
+
+# Bubble (L1 primitive)
+
+**when** Conversational UI (assistant turns). Records/logs → `ActivityFeed` / `Message`.
+
+Compound: compose the parts below — **do not invent part names**.
+
+`import { Bubble, BubbleContent, BubbleGroup, BubbleReactions } from "@monkey-mini-app/ui"`
+
+`packages/ui/src/components/bubble.tsx` · family: Surface · type: component · primitive
+
+## Parts
+
+| part | own props |
+|---|---|
+| `Bubble` | `align?=start/end` `variant?` |
+| `BubbleContent` | `render?` |
+| `BubbleGroup` | — |
+| `BubbleReactions` | `align?=start/end` `side?=top/bottom` |
+
+_Inherited HTML/ARIA props (`className`, `style`, `id`, `onClick`, `aria-*`, …) omitted — every component takes them._
+
+## Examples
+
+Runnable files under `references/examples/` — portable by construction (`react` +
+`@monkey-mini-app/ui` + relatives), so copy the closest one into `ui.tsx` / `ui/`.
+Pick by **scenario**, then open the file you need.
+
+- **[bubble-01.tsx](../examples/bubble/bubble-01.tsx)** — Bubble — One side of a chat transcript — agent vs user bubble without hand-rolling alignment or spacing.

package/skills/monkey-mini-app/references/contracts/button-group.md

@@ -0,0 +1,36 @@
+<!-- generated by scripts/gen/skill — do not edit -->
+
+# ButtonGroup (L1 primitive)
+
+**when** 2–5 mutually related actions (view switch, alignment). Tabs of content → `Tabs`.
+
+Compound: compose the parts below — **do not invent part names**.
+
+`import { ButtonGroup, ButtonGroupSeparator, ButtonGroupText, buttonGroupVariants } from "@monkey-mini-app/ui"`
+
+`packages/ui/src/components/button-group.tsx` · family: Form · type: component · primitive
+
+## Parts
+
+| part | own props |
+|---|---|
+| `ButtonGroup` | `orientation?=vertical/horizontal` |
+| `ButtonGroupSeparator` | `orientation?` `render?` |
+| `ButtonGroupText` | `render?` |
+| `buttonGroupVariants` (hook/util) | `class?` `orientation?=vertical/horizontal` |
+
+_Inherited HTML/ARIA props (`className`, `style`, `id`, `onClick`, `aria-*`, …) omitted — every component takes them._
+
+## Skeleton
+
+```tsx
+<ButtonGroup><Button variant="outline">List</Button><Button variant="outline">Board</Button></ButtonGroup>
+```
+
+## Examples
+
+Runnable files under `references/examples/` — portable by construction (`react` +
+`@monkey-mini-app/ui` + relatives), so copy the closest one into `ui.tsx` / `ui/`.
+Pick by **scenario**, then open the file you need.
+
+- **[button-group-01.tsx](../examples/button-group/button-group-01.tsx)** — Button / ButtonGroup — Related buttons fused into one visual unit (joined borders/radius) — e.g. Save + dropdown Split action; distinct from Toolbar/ToggleGroup because there is no pressed state.

package/skills/monkey-mini-app/references/contracts/button.md

@@ -0,0 +1,26 @@
+<!-- generated by scripts/gen/skill — do not edit -->
+
+# Button (L1 primitive)
+
+Action button with variants and icon sizing.
+
+**when** Every click target. `variant="destructive"` for delete, `size="icon*"` for icon-only (add aria-label).
+
+`import { Button, buttonVariants } from "@monkey-mini-app/ui"`
+
+`packages/ui/src/components/button.tsx` · family: Form · type: component · primitive
+
+## Parts
+
+| part | own props |
+|---|---|
+| `Button` | `focusableWhenDisabled?` `nativeButton?` `render?` `size?=default/xs/sm/lg/icon/icon-xs/icon-sm/icon-lg` `variant?=link/default/outline/secondary/ghost/destructive` |
+| `buttonVariants` (hook/util) | `class?` `size?=default/xs/sm/lg/icon/icon-xs/icon-sm/icon-lg` `variant?=link/default/outline/secondary/ghost/destructive` |
+
+_Inherited HTML/ARIA props (`className`, `style`, `id`, `onClick`, `aria-*`, …) omitted — every component takes them._
+
+## Skeleton
+
+```tsx
+<Button variant="outline" size="sm" onClick={run}>刷新</Button>
+```

package/skills/monkey-mini-app/references/contracts/calendar.md

@@ -0,0 +1,20 @@
+<!-- generated by scripts/gen/skill — do not edit -->
+
+# Calendar (L1 primitive)
+
+**when** An inline calendar inside your own layout. As a field with input → `DatePicker`.
+
+Compound: compose the parts below — **do not invent part names**.
+
+`import { Calendar, CalendarDayButton } from "@monkey-mini-app/ui"`
+
+`packages/ui/src/components/calendar.tsx` · family: Calendar & date · type: component · primitive
+
+## Parts
+
+| part | own props |
+|---|---|
+| `Calendar` | `animate?` `broadcastCalendar?` `buttonVariant?=link/default/outline/secondary/ghost/destructive` `captionLayout?=label/dropdown/dropdown-months/dropdown-years` `classNames?` `components?` `dateLib?` `defaultMonth?` `disabled?` `disableNavigation?` `endMonth?` `firstWeekContainsDate?` +39 |
+| `CalendarDayButton` | `day` `locale?` `modifiers` |
+
+_Inherited HTML/ARIA props (`className`, `style`, `id`, `onClick`, `aria-*`, …) omitted — every component takes them._

package/skills/monkey-mini-app/references/contracts/card.md

@@ -0,0 +1,41 @@
+<!-- generated by scripts/gen/skill — do not edit -->
+
+# Card (L1 primitive)
+
+Surface with header/content/footer.
+
+**when** The default container for a block of related UI.
+
+Compound: compose the parts below — **do not invent part names**.
+
+`import { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from "@monkey-mini-app/ui"`
+
+`packages/ui/src/components/card.tsx` · family: Surface · type: component · primitive
+
+## Parts
+
+| part | own props |
+|---|---|
+| `Card` | `size?=default/sm` |
+| `CardAction` | — |
+| `CardContent` | — |
+| `CardDescription` | — |
+| `CardFooter` | — |
+| `CardHeader` | — |
+| `CardTitle` | — |
+
+_Inherited HTML/ARIA props (`className`, `style`, `id`, `onClick`, `aria-*`, …) omitted — every component takes them._
+
+## Skeleton
+
+```tsx
+<Card><CardHeader><CardTitle>今日摘要</CardTitle></CardHeader><CardContent>…</CardContent></Card>
+```
+
+## Examples
+
+Runnable files under `references/examples/` — portable by construction (`react` +
+`@monkey-mini-app/ui` + relatives), so copy the closest one into `ui.tsx` / `ui/`.
+Pick by **scenario**, then open the file you need.
+
+- **[card-01.tsx](../examples/card/card-01.tsx)** — Card — The default content container: header (title + description), body, optional footer. Start here for any panel before writing custom borders/padding.

package/skills/monkey-mini-app/references/contracts/cascader.md

@@ -1,10 +1,14 @@
-<!-- generated by scripts/generate-skill.mjs — do not edit -->
+<!-- generated by scripts/gen/skill — do not edit -->
 
 # Cascader
 
+Multi-level drill-down picker.
+
+**when** Hierarchical codes (region → site → line). Flat tree → `TreeView`.
+
 `import { Cascader, CascaderNode } from "@monkey-mini-app/ui"`
 
-`packages/ui/src/composites/cascader.tsx` · composites
+`packages/ui/src/composites/cascader.tsx` · family: Form · type: composite
 
 ## Props
 
@@ -23,3 +27,9 @@
 | `children` | `CascaderNode[] \| undefined` |  |  |
 | `label` | `string` | ✓ |  |
 | `value` | `string` | ✓ |  |
+
+## Example
+
+```tsx
+<Cascader options={[{ label: "华东", value: "cn", children: [{ label: "上海", value: "sha" }] }]} onChange={(v) => set(v)} />
+```

package/skills/monkey-mini-app/references/contracts/chart.md

@@ -0,0 +1,32 @@
+<!-- generated by scripts/gen/skill — do not edit -->
+
+# Chart (L1 primitive)
+
+Recharts container + theme CSS vars + tooltip/legend parts.
+
+**when** Only when no `*Chart` block fits — then you own the series. Prefer `DonutChart` / `StackedBarChart` / `Sparkline` / `Gauge` / `RadarChart`.
+
+Compound: compose the parts below — **do not invent part names**.
+
+`import { ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent } from "@monkey-mini-app/ui"`
+
+`packages/ui/src/components/chart.tsx` · family: Chart & data · type: component · primitive
+
+## Parts
+
+| part | own props |
+|---|---|
+| `ChartContainer` | `config` `initialDimension?` |
+| `ChartLegend` | `align?` `formatter?` `height?` `iconSize?` `iconType?` `inactiveColor?` `itemSorter?` `labelStyle?` `layout?` `offset?` `onBBoxUpdate?` `onPointerEnterCapture?` +7 |
+| `ChartLegendContent` | `align?` `formatter?` `hideIcon?` `iconSize?` `iconType?` `inactiveColor?` `labelStyle?` `layout?` `nameKey?` `onPointerEnterCapture?` `onPointerLeaveCapture?` `payload?` +1 |
+| `ChartStyle` | `config` `id` |
+| `ChartTooltip` | `active?` `allowEscapeViewBox?` `animationDuration?` `animationEasing?` `axisId?` `contentStyle?` `cursor?` `defaultIndex?` `filterNull?` `formatter?` `includeHidden?` `isAnimationActive?` +16 |
+| `ChartTooltipContent` | `active?` `allowEscapeViewBox?` `animationDuration?` `animationEasing?` `axisId?` `contentStyle?` `cursor?` `defaultIndex?` `filterNull?` `formatter?` `hideIndicator?` `hideLabel?` +23 |
+
+_Inherited HTML/ARIA props (`className`, `style`, `id`, `onClick`, `aria-*`, …) omitted — every component takes them._
+
+## Skeleton
+
+```tsx
+<ChartContainer config={cfg} className="h-40 w-full"><Bar data={rows} dataKey="v" /></ChartContainer>
+```

package/skills/monkey-mini-app/references/contracts/checkbox.md

@@ -0,0 +1,19 @@
+<!-- generated by scripts/gen/skill — do not edit -->
+
+# Checkbox (L1 primitive)
+
+Single boolean box.
+
+**when** Multi-select rows / opt-in.
+
+`import { Checkbox } from "@monkey-mini-app/ui"`
+
+`packages/ui/src/components/checkbox.tsx` · family: Form · type: component · primitive
+
+## Parts
+
+| part | own props |
+|---|---|
+| `Checkbox` | `checked?` `disabled?` `form?` `indeterminate?` `inputRef?` `name?` `nativeButton?` `onCheckedChange?` `parent?` `readOnly?` `render?` `required?` +2 |
+
+_Inherited HTML/ARIA props (`className`, `style`, `id`, `onClick`, `aria-*`, …) omitted — every component takes them._

package/skills/monkey-mini-app/references/contracts/code-block.md

@@ -1,10 +1,14 @@
-<!-- generated by scripts/generate-skill.mjs — do not edit -->
+<!-- generated by scripts/gen/skill — do not edit -->
 
 # CodeBlock
 
+Static read-only code with highlighting (shiki via CDN).
+
+**when** Showing a snippet/command. Editable → `CodeEditor`.
+
 `import { CodeBlock } from "@monkey-mini-app/ui"`
 
-`packages/ui/src/products/code-block.tsx` · products
+`packages/ui/src/products/code-block.tsx` · family: Discovery & inspect · type: product
 
 ## Props
 
@@ -13,3 +17,17 @@
 | `className` | `string \| undefined` |  |  |
 | `code` | `string` | ✓ |  |
 | `language` | `string \| undefined` |  |  |
+
+## Example
+
+```tsx
+<CodeBlock code="pnpm test" language="bash" />
+```
+
+## Examples
+
+Runnable files under `references/examples/` — portable by construction (`react` +
+`@monkey-mini-app/ui` + relatives), so copy the closest one into `ui.tsx` / `ui/`.
+Pick by **scenario**, then open the file you need.
+
+- **[code-block-01.tsx](../examples/code-block/code-block-01.tsx)** — CodeBlock — Read-only highlighted source with filename, language badge and copy button (shiki via CDN); use when the code is shown, not edited.

package/skills/monkey-mini-app/references/contracts/code-editor.md

@@ -1,10 +1,14 @@
-<!-- generated by scripts/generate-skill.mjs — do not edit -->
+<!-- generated by scripts/gen/skill — do not edit -->
 
 # CodeEditor
 
-`import { CodeEditor } from "@monkey-mini-app/ui"`
+Vanilla CodeMirror 6 loaded on demand from `esm.sh` (not npm, not a React wrapper). Do not import `@codemirror/*` or `@uiw/react-codemirror` — the latter pulls a second React. Highlighting needs `@codemirror/language` + a theme; lang packages only provide the parser. If the CDN fails the host stays empty (no editor), rather than requiring a peer install.
 
-`packages/ui/src/products/code-editor.tsx` · products
+**when** Editing config/scripts in-app. Do not `import @codemirror/*` or add it to package.json.
+
+`import { CodeEditor, LangS } from "@monkey-mini-app/ui"`
+
+`packages/ui/src/products/code-editor.tsx` · family: Discovery & inspect · type: product
 
 ## Props
 
@@ -12,6 +16,28 @@
 |---|---|:---:|---|
 | `className` | `string \| undefined` |  |  |
 | `height` | `string \| undefined` |  |  |
-| `language` | `"js" \| "ts" \| "json" \| "html" \| "md" \| undefined` |  |  |
+| `language` | `LangS \| undefined` |  |  |
 | `onChange` | `((value: string) => void) \| undefined` |  |  |
 | `value` | `string` | ✓ |  |
+
+## Types
+
+### `LangS`
+
+```ts
+"js" | "ts" | "json" | "html" | "md"
+```
+
+## Example
+
+```tsx
+<CodeEditor value={src} language="ts" onChange={(v) => set(v)} />
+```
+
+## Examples
+
+Runnable files under `references/examples/` — portable by construction (`react` +
+`@monkey-mini-app/ui` + relatives), so copy the closest one into `ui.tsx` / `ui/`.
+Pick by **scenario**, then open the file you need.
+
+- **[code-editor-01.tsx](../examples/code-editor/code-editor-01.tsx)** — CodeEditor — Editable source with syntax highlighting and line numbers (CodeMirror 6 via CDN). Reach for it when the user changes config/scripts in-app; degrade to Textarea if the network blocks the CDN. — _*CodeMirror 6*_

package/skills/monkey-mini-app/references/contracts/collapsible.md

@@ -0,0 +1,21 @@
+<!-- generated by scripts/gen/skill — do not edit -->
+
+# Collapsible (L1 primitive)
+
+**when** A single disclosure (advanced options). Several stacked → `Accordion`.
+
+Compound: compose the parts below — **do not invent part names**.
+
+`import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "@monkey-mini-app/ui"`
+
+`packages/ui/src/components/collapsible.tsx` · family: Layout & structure · type: component · primitive
+
+## Parts
+
+| part | own props |
+|---|---|
+| `Collapsible` | `defaultOpen?` `disabled?` `onOpenChange?` `open?` `render?` |
+| `CollapsibleContent` | `hiddenUntilFound?` `keepMounted?` `render?` |
+| `CollapsibleTrigger` | `nativeButton?` `render?` |
+
+_Inherited HTML/ARIA props (`className`, `style`, `id`, `onClick`, `aria-*`, …) omitted — every component takes them._

package/skills/monkey-mini-app/references/contracts/color-picker.md

@@ -1,10 +1,14 @@
-<!-- generated by scripts/generate-skill.mjs — do not edit -->
+<!-- generated by scripts/gen/skill — do not edit -->
 
 # ColorPicker
 
+Swatch + hex colour input.
+
+**when** Theme/label colour config. Never for secrets.
+
 `import { ColorPicker } from "@monkey-mini-app/ui"`
 
-`packages/ui/src/composites/color-picker.tsx` · composites
+`packages/ui/src/composites/color-picker.tsx` · family: Form · type: composite
 
 ## Props
 
@@ -12,3 +16,9 @@
 |---|---|:---:|---|
 | `onChange` | `((value: string) => void) \| undefined` |  |  |
 | `value` | `string \| undefined` |  |  |
+
+## Example
+
+```tsx
+<ColorPicker value={c} onChange={(v) => set(v)} />
+```

package/skills/monkey-mini-app/references/contracts/combobox.md

@@ -0,0 +1,34 @@
+<!-- generated by scripts/gen/skill — do not edit -->
+
+# Combobox (L1 primitive)
+
+**when** When you need full control of the popover list. Simple suggestion box → `Autocomplete`.
+
+Compound: compose the parts below — **do not invent part names**.
+
+`import { Combobox, ComboboxChip, ComboboxChips, ComboboxChipsInput, ComboboxCollection, ComboboxContent, ComboboxEmpty, ComboboxGroup, ComboboxInput, ComboboxItem, ComboboxLabel, ComboboxList, ComboboxSeparator, ComboboxTrigger, ComboboxValue, useComboboxAnchor } from "@monkey-mini-app/ui"`
+
+`packages/ui/src/components/combobox.tsx` · family: Form · type: component · primitive
+
+## Parts
+
+| part | own props |
+|---|---|
+| `Combobox` | `actionsRef?` `autoComplete?` `autoHighlight?` `defaultInputValue?` `defaultOpen?` `disabled?` `filter?` `filteredItems?` `form?` `grid?` `highlightItemOnHover?` `inline?` +23 |
+| `ComboboxChip` | `render?` `showRemove?` |
+| `ComboboxChips` | `render?` |
+| `ComboboxChipsInput` | `disabled?` `render?` |
+| `ComboboxCollection` | — |
+| `ComboboxContent` | `align?` `alignOffset?` `anchor?` `finalFocus?` `initialFocus?` `render?` `side?` `sideOffset?` |
+| `ComboboxEmpty` | `render?` |
+| `ComboboxGroup` | `items?` `render?` |
+| `ComboboxInput` | `disabled?` `render?` `showClear?` `showTrigger?` |
+| `ComboboxItem` | `disabled?` `index?` `nativeButton?` `render?` `value?` |
+| `ComboboxLabel` | `render?` |
+| `ComboboxList` | `render?` |
+| `ComboboxSeparator` | `orientation?` `render?` |
+| `ComboboxTrigger` | `disabled?` `nativeButton?` `render?` |
+| `ComboboxValue` | `placeholder?` |
+| `useComboboxAnchor` (hook/util) | — |
+
+_Inherited HTML/ARIA props (`className`, `style`, `id`, `onClick`, `aria-*`, …) omitted — every component takes them._

package/skills/monkey-mini-app/references/contracts/command.md

@@ -0,0 +1,41 @@
+<!-- generated by scripts/gen/skill — do not edit -->
+
+# Command (L1 primitive)
+
+**when** Jump between views/actions inside one app.
+
+Compound: compose the parts below — **do not invent part names**.
+
+`import { Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut } from "@monkey-mini-app/ui"`
+
+`packages/ui/src/components/command.tsx` · family: Navigation · type: component · primitive
+
+## Parts
+
+| part | own props |
+|---|---|
+| `Command` | `asChild?` `disablePointerSelection?` `filter?` `label?` `loop?` `onValueChange?` `shouldFilter?` `value?` `vimBindings?` |
+| `CommandDialog` | `actionsRef?` `children` `className?` `defaultOpen?` `defaultTriggerId?` `description?` `disablePointerDismissal?` `handle?` `modal?` `onOpenChange?` `onOpenChangeComplete?` `open?` +3 |
+| `CommandEmpty` | `asChild?` |
+| `CommandGroup` | `asChild?` `forceMount?` `heading?` `value?` |
+| `CommandInput` | `asChild?` `onValueChange?` `value?` |
+| `CommandItem` | `asChild?` `disabled?` `forceMount?` `keywords?` `value?` |
+| `CommandList` | `asChild?` `label?` |
+| `CommandSeparator` | `alwaysRender?` `asChild?` |
+| `CommandShortcut` | — |
+
+_Inherited HTML/ARIA props (`className`, `style`, `id`, `onClick`, `aria-*`, …) omitted — every component takes them._
+
+## Skeleton
+
+```tsx
+<CommandDialog open={open} onOpenChange={setOpen}><CommandInput placeholder="跳转…" /><CommandList><CommandItem onSelect={go}>今日</CommandItem></CommandList></CommandDialog>
+```
+
+## Examples
+
+Runnable files under `references/examples/` — portable by construction (`react` +
+`@monkey-mini-app/ui` + relatives), so copy the closest one into `ui.tsx` / `ui/`.
+Pick by **scenario**, then open the file you need.
+
+- **[command-01.tsx](../examples/command/command-01.tsx)** — Command — Cmd-K style palette: fuzzy input over grouped actions with an empty state, mounted inline rather than as a dialog.

package/skills/monkey-mini-app/references/contracts/comment-thread.md

@@ -1,10 +1,14 @@
-<!-- generated by scripts/generate-skill.mjs — do not edit -->
+<!-- generated by scripts/gen/skill — do not edit -->
 
 # CommentThread
 
+Nested comments with author + time.
+
+**when** Issue/ticket discussion, review comments. Editing a comment is your job, not the component's.
+
 `import { CommentThread, Comment } from "@monkey-mini-app/ui"`
 
-`packages/ui/src/blocks/comment-thread.tsx` · blocks
+`packages/ui/src/blocks/comment-thread.tsx` · family: Realtime · type: block
 
 ## Props
 
@@ -22,3 +26,9 @@
 | `body` | `string` | ✓ |  |
 | `id` | `string` | ✓ |  |
 | `time` | `string \| undefined` |  |  |
+
+## Example
+
+```tsx
+<CommentThread comments={[{ id: "c1", author: "P.Wang", text: "这里再确认下" }]} />
+```

package/skills/monkey-mini-app/references/contracts/commit-graph.md

@@ -0,0 +1,50 @@
+<!-- generated by scripts/gen/skill — do not edit -->
+
+# CommitGraph
+
+Topological git commit graph (forks / merges).
+
+**when** App history, release notes, git timeline views
+
+`import { CommitGraph, CommitAuthor, Commit } from "@monkey-mini-app/ui"`
+
+`packages/ui/src/products/commit-graph.tsx` · family: Chart & data · type: product
+
+## Props
+
+Extends `Omit<ComponentProps<"div">, "children">` — those HTML/ARIA props are not repeated below.
+
+| field | type | required | note |
+|---|---|:---:|---|
+| `commits` | `Commit[]` | ✓ | Commits in topological order (newest first). Each commit includes parent hashes. |
+| `railWidth` | `number \| undefined` |  | Pixel width per rail column. |
+| `truncateHash` | `number \| undefined` |  | Number of hash characters to display. |
+
+_Inherited HTML/ARIA props (`className`, `style`, `id`, `onClick`, `aria-*`, …) omitted — every component takes them._
+
+## Types
+
+### `CommitAuthor`
+
+| field | type | required | note |
+|---|---|:---:|---|
+| `avatarUrl` | `string \| undefined` |  |  |
+| `name` | `string` | ✓ |  |
+
+### `Commit`
+
+| field | type | required | note |
+|---|---|:---:|---|
+| `author` | `CommitAuthor` | ✓ | Commit author. |
+| `date` | `string \| Date` | ✓ | ISO date string or Date object. |
+| `hash` | `string` | ✓ | Commit hash (full or abbreviated). |
+| `message` | `string` | ✓ | Commit message (first line). |
+| `parents` | `string[]` | ✓ | Parent commit hashes. Empty for root commits. Two parents = merge commit. |
+| `refs` | `string[] \| undefined` |  | Branch or ref label (e.g. "main", "feat/auth"). |
+| `tag` | `string \| undefined` |  | Tag label (e.g. "v1.0.0"). |
+
+## Example
+
+```tsx
+<CommitGraph commits={[{ hash, message, author, date, parents }]} />
+```