# Bone Flow #034 Radio Specification v1.0

Component ID: #034  
Component: Radio  
Specification Version: 1.0  
Implementation: v1.0.14  
Status: Specification Draft / Development

## 1. 責務

#034 Radio は複数候補から同時に1つだけを選ぶ Input UI。#033 Checkbox の boolean ON/OFF 責務は持たず、#035 Switch の切替責務も持たない。

Development Order の Input UI 順序に従い、#033 Checkbox v1.0.10 で確認済みの Property / #020 Label / Joint / Security / WAIT / BLOCKED / Smoke / Validation / Runtime QA / Completion の共通構造を参考にし、Radio固有差分だけを持つ。

## 2. Bone / value Contract

- `type`: `RADIO`
- `value`: 選択中 item の `string` value、または未選択 `null`
- stringをnumber/booleanへ変換しない
- number / boolean / object / getter / Proxyをstringへ暗黙変換しない
- 選択値は必ず `items` に存在すること
- 同一Radio Group内で同時にcheckedとなるinputは最大1件

## 3. items

`items` は `{ value, label, disabled? }` の配列。

- `value`: 空でないstring / group内重複禁止
- `label`: 空でないstring
- `disabled`: boolean。trueのitemはユーザー選択不可
- Label描画は #020 Bone Label `BoneLabel.create()` を使用する
- #034独自spanへLabel文字を直接描画しない

## 4. Editing / Commit

`committedValue` と `editingValue` を分離する。

- `changeCommit=true` を既定
- `required=true` の場合、`null` commitを拒否しcommittedValueを保持
- `readonly=true`: ユーザー選択・commit不可
- `disabled=true`: ユーザー選択・commit不可
- `select(value)` はRadio固有の公開選択API
- `clear()` は未選択へ戻すAPI。required時のcommitはValidationで拒否
- Checkboxの `toggle()` は持たない

## 5. Radio固有Property

- `items`
- `orientation`: `vertical / horizontal / vertical-fit / horizontal-fit`
- `elementClickSelect`: default `false`。true時のみRadio item内（label/余白）クリックでそのitemを選択する
- `itemGap`: item間余白 0～64px
- `labelGap`: radio glyphと#020 Label間余白 0～64px
- `labelFontSize`: #020 Labelへ渡す文字サイズ 8～56px。Radio glyphサイズも連動

## 6. Input UI共通Property

- 日本語 / English Property
- theme: default / dark / light / neon
- backgroundColor: theme / transparent / HEX
- appearance: standard / outline / filled / rounded / circle / neon / minimal
- Parent Dependency
- width / height
- position 9方向
- inputAlign: auto / left / center / right
- Active Border Effect: normal / neon / blink
- Effect color / direction / speed
- Active Border Effect は各Radio要素単位で適用する
- Parent Dependency時はcontrolにauto scrollbarを生成しない
- `inputAlign` / 親textAlignはRadio itemの実配置へ反映する

## 7. OUT / #002 Delivery Channel

#034自身でQueue/Retryを実装せず、#002 Bone Joint v1.1.36 `createDeliveryChannel()` を使用する。

- READY: 即配送
- WAITING: Joint FIFO待機 → Target READY後に自動配送
- BLOCKED: 接続維持 / TargetへBLOCK対象データを配送しない

OUTは `value / selectedValue / bone.value` のRadio string/null契約を維持する。

## 8. Security

Untrusted INを安全に検査する。

- itemsに存在するstring: ACCEPTED
- null: ACCEPTED（required時はValidationで拒否）
- unknown string: BLOCKED
- number / boolean / object: BLOCKED
- getter / Proxy: BLOCKED
- 暗黙変換禁止
- Security Gateに code / message / Before / After / Preview / Result JSONを表示

## 9. 接続イメージ

#002 Bone Joint正式描画で5ケースを維持する。

1. 正常接続（IN / OUT）
2. IN Target Field不存在
3. OUT Target Field不存在
4. 型不一致（IN）
5. 型不一致（OUT）

Raw State / 診断 / 4色凡例を表示する。

## 10. Smoke / Validation / Completion

Browser RuntimeではSmoke / Validationを実行し、WAIT / BLOCKEDは通常Previewと独立したRadio instanceで実動作確認する。

Completion条件:

1. Runtime Smoke ALL PASS
2. Runtime Validation ALL PASS
3. WAIT実動作成功 + ユーザー目視確認
4. BLOCK実動作成功 + ユーザー目視確認

Packaging時点でBrowser Runtime未実施なら `ALL PASS / Completed` と記載しない。ユーザーlocalhost確認前はDevelopment。


## v1.0.11 correction
- v1.0.11: horizontal表示で各要素幅を均等化し、3要素のLabel欠けを抑止。
- v1.0.11: group outer focus ring を除去し、Active Border Effect は各要素のみに適用。


## v1.0.11 correction
- v1.0.11: vertical / vertical-fit で active枠が見えないケースを補正。option を内容幅基準にし、active適用を row + item-frame の両方で評価。


## v1.0.11 correction
- v1.0.11: standalone position の既定値を top-left（左上）へ修正。9方向 position をJS描画へ直接反映。


## v1.0.11 correction
- v1.0.11: position 9方向を component root だけでなく Radio option group の実描画位置へ反映。default top-left。


## v1.0.12 correction
- v1.0.12: FITの固定140px基準を廃止。横FITはRadio+Labelの実内容幅+itemGapで横詰めして折返し、縦FITは実要素高+itemGapで縦詰めして列折返し。


## v1.0.13 runtime correction
- #002 Delivery Channel呼び出しを誤った `send()` から正式な `deliver()` へ修正。
- Node test doubleも `deliver()` のみに修正し、誤APIをテスト側で追認しない。
- Overall / Report の `ALL PASS` は Smoke と Validation の両方が実行済みかつ全PASSの場合だけ成立する。
- #033参照版を正式正本 v1.0.10 に修正。
- `connectOutput()` の targetReady未指定時は #033/#002 共通契約どおり READY。非object optionsは拒否。
- Bone入力を #033 共通境界どおり #001 `BoneCore.normalize()` に通すよう復元。
- Browser Runtimeは未実施。ユーザーlocalhost確認前はDevelopment。


## #022 Active Border Effect delegation / Implementation v1.0.14
- Active Border Effect描画は #022 Bone Hover Border Effect v1.0.1へ委譲する。
- Active対象はRadio group全体ではなく、従来どおり選択中の各Radio item。
- `activeBorderEffect`: `normal / neon / spin / cross / blink`。
- group / 単一選択 / FIT / Label / Security / WAIT / BLOCK / Completion契約は変更しない。