# Bone Flow #031 — TimeBox #031 TimeBox は `TYPE = TIMEBOX` の時刻入力 Component。 正式 value は `HH:mm | null` とし、24時間制の時刻を文字列のまま扱う。 ## value 例 ```text 09:30 18:45 23:59 null ``` ## 主な Property - value - placeholder - min / max - step（分） - required / readonly / disabled - theme / backgroundColor / appearance - 親要素に依存 - width / height - 9方向表示位置 - 入力時文字位置 - Font FIT / 固定サイズ - Active Border Effect / Color / Direction / Speed（#022へ委譲） ## 時刻契約 - 正式形式は `HH:mm` - `00:00` ～ `23:59` - `Date.parse` 不使用 - timezone 変換なし - Date object / getter / Proxy / 非HH:mm文字列は Untrusted IN で拒否 - `step` は `any` または整数分 ## 使用コンポーネント Test UI の「使用コンポーネント」欄では次のリンクを維持する。 - #001 Bone Core - #002 Bone Joint - #022 Bone Hover Border Effect v1.0.1 - #026 Bone TimePicker v1.0.4 - #017 Bone Text ## Joint / QA commit 後の OUT 配送は #002 Bone Joint に委譲する。 WAIT / FIFO / BLOCKED の Runtime Test、Smoke、Validation、Report、Completion の共通構成を持つ。 パッケージ作成時点では Browser Runtime QA / WAIT・BLOCK目視確認 / Completion を実施済みとは扱わない。 ## 確認 URL ```text http://localhost/BoneFlow/test/bone-timebox.html ``` ## v1.0.8 正式Picker追従 - 正式依存: `#026 Bone TimePicker v1.0.4`。 - 時刻選択UI・時/分列・Picker開閉は #026 へ委譲する。 - #031 は `HH:mm | null`、Validation、commit、Bone.value、OUT、Security、WAIT/BLOCKED、#002 Delivery Channel を保持する。 - #031 の `step` は分刻み。Property UI は `1 / 5 / 10 / 15 / 30`。`step=any` の内部API時は #026 へ1分刻みとして委譲する。 - #031 は秒をvalueに持たないため、#026は `showHour=true / showMinute=true / showSecond=false` で利用する。 ## v1.0.9 #022 Active Border Effect正式委譲 - Focus / Blur を #022 の Active ON / OFF へ委譲。 - Effect: `normal / neon / spin / cross / blink`。 - 色・方向・速度も #022 へ渡す。 - TimeBox固有処理、#026 TimePicker、Security、WAIT/BLOCKED、接続イメージ、Completion は変更しない。