Enum Values

Enum Values 组件用于显示 API 参数或响应字段的枚举值列表，帮助开发者了解可接受的值。

activeinactivependingarchived

安装

使用方法

import { EnumValues } from "@/components/pivot/enum-values";

<EnumValues values={["active", "inactive", "pending"]} />

示例

基本用法

<div className="space-y-4">
  <div>
    <h4 className="text-sm font-medium mb-2">用户状态</h4>
    <EnumValues values={["active", "inactive", "pending"]} />
  </div>
 
  <div>
    <h4 className="text-sm font-medium mb-2">订单状态</h4>
    <EnumValues
      values={["created", "paid", "shipped", "delivered", "cancelled"]}
    />
  </div>
</div>

在 API 文档中使用

<div className="space-y-3">
  <div className="p-3 border rounded">
    <div className="flex items-center gap-3 mb-2">
      <code className="font-mono">status</code>
      <TypeIndicator type="string" />
      <RequiredBadge />
    </div>
    <p className="text-sm text-muted-foreground mb-2">用户账户状态</p>
    <EnumValues values={["active", "inactive", "suspended"]} />
  </div>
 
  <div className="p-3 border rounded">
    <div className="flex items-center gap-3 mb-2">
      <code className="font-mono">priority</code>
      <TypeIndicator type="string" />
    </div>
    <p className="text-sm text-muted-foreground mb-2">任务优先级</p>
    <EnumValues values={["low", "medium", "high", "urgent"]} />
  </div>
</div>

API 参考

Props

属性	类型	默认值	描述
`values`	`string[]`	-	枚举值数组
`className`	`string`	-	额外的 CSS 类名