Provides a panel-style radio button component for single selection with support for supplementary text and status labels. Useful when choices need visual emphasis or additional context.
How this skill is triggered — by the user, by Claude, or both
Slash command
/smarthr-design-system:smarthr-ui-radio-button-panelThe summary Claude sees in its skill listing — used to decide when to auto-load this skill
RadioButtonをパネル型に視覚的強化した単一選択コンポーネントです。選択肢に説明やステータスを付加するとき、視覚的に強調して操作領域を確保するときに使います。
RadioButtonをパネル型に視覚的強化した単一選択コンポーネントです。選択肢に説明やステータスを付加するとき、視覚的に強調して操作領域を確保するときに使います。
RadioButtonをパネル型に視覚的強化した単一選択コンポーネントです。選択肢に説明やステータスを付加するとき、視覚的に強調して操作領域を確保するときに使います。
import { RadioButtonPanel } from 'smarthr-ui'
| Props 名 | 型 | デフォルト値 | 必須 | 説明 |
|---|---|---|---|---|
| label | ReactNode | - | ✓ | - |
RadioButtonPanel に直接関連する eslint-plugin-smarthr のルールは現時点ではありません。
送信 や 保存 などの type=submit ボタンを押すことで反映される場面で使用する
helpMessage props などを使用するdisabled 状態の組み合わせ、またはステップを複数に分けたモードを検討するnpx claudepluginhub kufu/smarthr-design-system --plugin smarthr-design-systemRadio button component from SmartHR UI for single selection from a short list (≤5 items). Includes accessibility rules and usage guidelines.
Creates, edits, and optimizes skills for Claude Code, including drafting, evaluating with test prompts, iterating on performance, and improving skill descriptions for better triggering accuracy.