インラインバッジ

推奨: インラインバッジは避ける

現在の推奨は、インラインバッジを避けることです。なぜなら、可読性に悪影響を及ぼす可能性があるからです。

ガイドライン:

• 機能の主なドキュメントページでベータ/アルファ/早期アクセスについて言及してください（この目的のために<Badge>コンポーネントを使用します）。
• テキストの中で追加の参照が必要な場合は、機能名の後に特別なフォーマットなしで「(beta)」を使用してください。
• 機能に関連する指示（機能のオンまたはオフにする方法など）については、再度ベータであることを言及し、サイドナビにも「(beta)」を含めてください。

例

アルファ Alpha

ベータ Beta

廃止予定 Deprecated

早期アクセス Early Access

レガシー Legacy

カスタム Custom

import { InlineBadge } from '~/components';

### アルファ <InlineBadge preset="alpha" />

### ベータ <InlineBadge preset="beta" />

### 廃止予定 <InlineBadge preset="deprecated" />

### 早期アクセス <InlineBadge preset="early-access" />

### レガシー <InlineBadge preset="legacy" />

### カスタム <InlineBadge text="Custom" variant="success" />

入力

presetまたはtextとvariantのいずれかを指定する必要があります。

プリセット

• alpha

  • テキスト: Alpha
  • バリアント success

• beta

  • テキスト: Beta
  • バリアント caution

• deprecated

  • テキスト: Deprecated
  • バリアント danger

• early-access

  • テキスト: Early Access
  • バリアント note

• legacy

  • テキスト: Legacy
  • バリアント danger

テキスト

任意の文字列。

バリアント

• note

  • 色: 青

• tip

  • 色: 紫

• danger

  • 色: 赤

• caution

  • 色: オレンジ

• success

  • 色: 緑