live_design! {
// 標準ボタン
<Button> { text: "クリック" }

// アイコン付きボタン
<Button> {
draw_icon: {
svg_file: dep("crate://self/resources/icon.svg")
color: #fff
}
text: "アイコン付き"
}

// グラデーションボタン
<ButtonGradientX> { text: "グラデーション X" }
<ButtonGradientY> { text: "グラデーション Y" }

// アイコンのみのボタン
<ButtonIcon> {
draw_icon: {
svg_file: dep("crate://self/resources/icon.svg")
}
}
}

live_design! {
// 標準テキスト入力
<TextInput> { empty_text: "テキストを入力." }

// パスワード入力
<TextInput> {
empty_text: "パスワード"
password: true
}

// 複数行
<TextInput> {
empty_text: "説明を入力"
height: Fill
}
}

live_design! {
// 標準スライダー
<Slider> { min: 0, max: 100, value: 50 }

// ラウンドスライダー
<SliderRound> { min: 0, max: 1.0, value: 0.5 }

// ミニマルスライダー
<SliderMinimal> { min: 0, max: 100, value: 25 }
}

live_design! {
// チェックボックス
<CheckBox> { text: "機能を有効にする" }

// トグルスイッチ
<CheckBoxToggle> { text: "ダークモード" }

// ラジオボタングループ
<View> {
flow: Down, spacing: 10
<RadioButton> { radio_id: 1, text: "オプション 1" }
<RadioButton> { radio_id: 2, text: "オプション 2" }
<RadioButton> { radio_id: 3, text: "オプション 3" }
}
}

live_design! {
<PortalList> {
drag_scrolling: true
item_template: <ItemView> {
// 各アイテムのテンプレート
}
}
}