组件注册表 Registry

概述

组件注册表是一个机器可读的 JSON 文件，描述了所有 Kumo 组件及其属性、变体、示例和语义令牌。它专为 AI 智能体、代码生成器及其他工具设计。

查看 JSON API

访问注册表

通过 CLI

# 列出所有组件
npx @cloudflare/kumo ls

# 获取特定组件的文档
npx @cloudflare/kumo doc Button

通过 HTTP API

# JSON 端点
curl https://kumo-ui.cn/api/component-registry

通过 jq(本地)

# 获取 Button 的属性
jq '.components.Button.props' packages/kumo/ai/component-registry.json

# 按分类列出组件
jq '.search.byCategory' packages/kumo/ai/component-registry.json

注册表内容

54components

9categories

v1.0.0

AllActionData VisualizationDisplayFeedbackInputLayoutNavigationOtherOverlay

Autocomplete

Autocomplete — free-form text input with an optional filtered suggestion list.

+

Badge

Small status label for categorizing or highlighting content.

+

Banner

Full-width message bar with an optional trailing CTA slot.

+

Breadcrumbs

Breadcrumbs component

+

BubbleMap

BubbleMap component

+

Button

Primary action trigger. Supports multiple variants, sizes, shapes, icons, and loading state.

+

ButtonGroup

Joins a small set of tightly-coupled buttons into a single control — most commonly a **split button**: a primary action next to a dropdown trigger for related, secondary actions.

+

Chart

Chart — a low-level wrapper around [Apache ECharts](https://echarts.apache.org).

+

Checkbox

Checkbox component

+

ChoroplethMap

ChoroplethMap component

+

ClipboardText

Read-only text field with a one-click copy-to-clipboard button.

+

CloudflareLogo

Cloudflare logo component.

+

Code

Code component

+

Collapsible

Collapsible — a composable disclosure component for showing/hiding content.

+

Combobox

Combobox — autocomplete input with filterable dropdown list.

+

CommandPalette

CommandPalette — accessible command palette / spotlight search overlay.

+

DatePicker

DatePicker — a date selection calendar.

+

DateRangePicker

DateRangePicker — dual-calendar date range selector.

+

Dialog

Dialog component

+

DropdownMenu

DropdownMenu — accessible dropdown menu anchored to a trigger.

+

Empty

Placeholder shown when a list, table, or page has no content to display.

+

Field

Form field wrapper that provides a label, optional description, and error display around any form control. Built on Base UI Field primitives.

+

GlobeMap

GlobeMap — an SVG orthographic globe with hatched land and geographic markers. Rendering is SVG-only and does not use WebGL.

+

Grid

Responsive CSS grid layout container with preset column configurations.

+

InlineCopyText

Compact, borderless copy control for IDs and other short values displayed inline or inside dense table cells.

+

Input

Input component

+

InputArea

Multi-line textarea input with Input variants and InputArea-specific dimensions

+

InputGroup

InputGroup component

+

Label

Label component for form fields.

+

LayerCard

LayerCard component

+

LayerDialog

LayerDialog component

+

Link

Link component

+

Loader

Animated circular spinner for indicating loading states.

+

MenuBar

MenuBar — horizontal icon-button toolbar with keyboard arrow-key navigation.

+

Meter

Progress bar showing a measured value within a known range (e.g. quota usage).

+

Pagination

Pagination component

+

Popover

Popover component for displaying accessible popup content anchored to a trigger.

+

Radio

Radio — radio button group for single-select choices.

+

SankeyChart

SankeyChart component

+

Select

Select component

+

SensitiveInput

Password/secret input that masks its value by default and reveals on click. Includes a built-in copy-to-clipboard button on hover.

+

Sidebar

Sidebar — responsive navigation panel with expand/collapse support.

+

Slider

Slider component

+

Surface

Surface component

+

Switch

Switch component

+

Table

Table — semantic HTML table with styled rows, cells, and selection support.

+

TableOfContents

TableOfContents — presentational compound component for section navigation.

+

Tabs

Tab navigation component with segmented or underline style. Built on Base UI Tabs with animated active indicator.

+

TagInput

TagInput component

+

Text

Text component

+

TimeseriesChart

TimeseriesChart — a time-series line or bar chart.

+

Toasty

Toasty — toast notification provider and viewport.

+

Toolbar

Toolbar component

+

Tooltip

Accessible popup that shows additional information on hover/focus. Wrap your app or section with `<TooltipProvider>` to enable delay grouping.

+