Button
Basic
jui-button の最も基本的な使用例です。
Variants
variant プロパティを使用してコンポーネントの視覚的なスタイルを変更します。
Sizes
size プロパティを使用してコンポーネントの大きさを変更します。
States
is-disabled などのプロパティを使用してコンポーネントの状態（非活性など）を制御します。
With Icons
スロットなどを利用して、アイコン付きのパターンを作成できます。
概要 (Overview)
jui-button — 汎用ボタンコンポーネント
バリアント: brand / danger / ghost / outline サイズ: sm / md / lg
プロパティ (Properties)
コンポーネントが受け付ける属性（Props）の一覧と詳細仕様です。
| Property | Attribute | Description | Type | Default |
|---|---|---|---|---|
isDisabled | is-disabled | 無効状態 | boolean | false |
size | size | ボタンのサイズ | "lg" | "md" | "sm" | 'md' |
type | type | ボタンの type 属性 | "button" | "reset" | "submit" | 'button' |
variant | variant | ボタンのバリアント | "brand" | "danger" | "ghost" | "outline" | 'brand' |
イベント (Events)
コンポーネントから発火するカスタムイベントの一覧です。
| Event | Description | Type |
|---|---|---|
juiClick | クリック時に発火するイベント（disabled 時は不発火） | CustomEvent<{ originalEvent: MouseEvent; }> |
スロット (Slots)
コンポーネント内に子要素を挿入するためのスロット一覧です。
| Slot | Description |
|---|---|
| ボタンラベル（デフォルトスロット） | |
"prefix" | ラベル前のアイコン等 |
"suffix" | ラベル後のアイコン等 |
シャドウパーツ (Shadow Parts)
CSSから直接スタイリング可能な内部要素（Parts）の一覧です。
| Part | Description |
|---|---|
"button" | ルートの |
"label" | ラベルを囲む 要素 |
Built with StencilJS