# Bone Flow #038 Slider

Version: 1.0.9  
Status: Development

## Purpose

Finite-number Slider Input UI with practical display patterns and time-related formatting. The existing `value / min / max / step` contract remains, while v1.0.4 adds Horizontal / Vertical / Range / Ticks / Value Bubble / Fill / Center and Time / Duration / unit / Time Range / Timeline / Playback / Schedule Range presentation.

## Range

Range uses two native range thumbs. `Bone.value` stays the numeric end/current value. OUT additionally exposes `range.start` and `range.end`.

## Time display

Time formatting does not convert external string input. Internal values remain finite numbers. Time/Schedule use minutes; Duration/Timeline/Playback use seconds.

## Test URL

`/boneflow/test/bone-slider.html`

## Runtime dependencies

#001 Bone Core v1.0.0 / #002 Bone Joint v1.1.36 / #017 Bone Text / #020 Bone Label / #022 Bone Hover Border Effect v1.0.1 / #117 Animation v1.0.9.

## Completion rule

Package QA is not Browser Runtime QA. The Component becomes Completed only after user localhost Runtime ALL PASS and Completion operation.


## v1.0.4 QA layout correction

Security / Smoke Test / Validation Report / Runtime Report / Runtime Console / Completion の責務と表示順を完成済みInput UIの正式構成へ合わせた。


## v1.0.4 Animation Property（v1.0.7で廃止）
- Active Border Effect (#022)とは別責務。
- 値変更Animation: none / fade / slide / pulse / bounce。
- Animation速度: slow / normal / fast。
- 値契約、Security、Joint、WAIT/BLOCK、Completion契約は変更しない。

## v1.0.5 Animation visibility correction（v1.0.7で廃止）

- Fade / Slide / Pulse / Bounce now animate the complete Slider operation area (`track + thumb + value`) instead of relying on the value text / native thumb pseudo-element only.
- Horizontal and Vertical Slide use separate motion axes.
- Animation class is cleared on `animationend` with a browser timer fallback so repeated value changes restart visibly.
- Active Border Effect remains a separate #022 responsibility.


## v1.0.7 Fill-only Animation correction

- Animation target is the blue filled range only. Track background, thumb(s), value bubble and value text do not shake, bounce, slide or scale.
- Animation types: `none / flow / shimmer / glow-sweep / breathing-glow`.
- `flow`: moving color/light gradient inside the filled range.
- `shimmer`: narrow white highlight passes through the filled range.
- `glow-sweep`: luminous glow travels through the filled range.
- `breathing-glow`: filled range brightness/glow breathes without changing geometry.
- Animation speed remains `slow / normal / fast`.
- The Fill animation is continuous while selected and remains independent from #022 Active Border Effect.


## v1.0.7 Animation direction / Validation correction
- 青いFill専用Animationに `animationDirection` を追加。
- `forward`: 横は左→右、縦は下→上。
- `reverse`: 横は右→左、縦は上→下。
- `Breathing Glow` は位置移動を伴わないため方向差は視覚上ほぼありません。
- Validation V30は `prefers-reduced-motion` による意図的なAnimation無効化をFAIL扱いしない。CSS selectorがFillへ適用され、通常環境ではanimationNameが有効であることを確認する。


## v1.0.9 #020 Label delegation Smoke correction

- `getLabelOutput()` は内部キャッシュではなく、現在の #020 `BoneLabel.getOutput(label)` 公開OUTを返す。
- Smoke S08 は実Label DOM、#020公開OUT、#020 `getChildOutput()` による #017 Child OUTをその場で検査する。
- #020/#017の実委譲が存在しない場合はPASSにしない。


## v1.0.9 S08 false-fail correction
- v1.0.8 Runtime ReportでS08のみFAIL、V21はPASS。
- S08を #020公開契約ベースへ戻し、非公開dataset / Child OUTを必須条件にしない。


## v1.0.10 #117 Animation delegation

- Fill Animation is delegated to completed `#117 Animation v1.0.7`.
- Slider exposes `Slider UI番号` and `Animation UI番号` for the Motion relation.
- The relation is `#117 Animation -> #038 Slider UI番号 -> fill`.
- Slider CSS no longer owns Animation keyframes; it owns only Fill geometry/appearance.
- `flow / shimmer / glow-sweep / breathing-glow`, speed and direction are passed to #117.
- Slider interaction restarts the selected #117 animation.
- #022 Active Border Effect remains independent.
- Browser Runtime / Completion for v1.0.10 are not pre-confirmed by package QA.


## v1.0.11 #117 Animation Loop / WAIT delegation

- Formal Animation dependency updated to completed `#117 Animation v1.0.9`.
- Slider exposes `Animationループ` and `ループ間WAIT (ms)` as #117 delegation properties.
- Defaults follow #117: `animationLoop = true`, `animationLoopWaitMs = 300`.
- Slider does not implement an independent loop timer. It passes `loop` / `loopWaitMs` to #117.
- OUT records the delegated Loop / WAIT values.
- Existing Slider numeric, Label, Effect, Security, Joint, WAIT/BLOCK and Completion responsibilities are unchanged.
