# Bone Flow #002 - Bone Joint

Runtime: 1.1.40  
Package: 1.0.4  
Status: Development Candidate

## Role
#002 Bone Joint is the Bone Flow connection layer. It resolves Source/Target endpoints and fields, evaluates compatibility, tracks connection state, performs WAIT/FIFO/BLOCKED delivery, resolves routes, and renders diagnostic Joint lines.

## Guide
Use `test/bone-joint.html` → `操作ガイド DOC-0002`. The modal provides JP/EN, Help Search, Print, TOC, cache-safe package versioning, and detailed sections for anatomy, ports, compatibility, states, delivery, routes, display, errors, Public API, QA, completion and examples.

## Completion
Smoke ALL PASS + Validation ALL PASS + localhost visual WAIT/FIFO + BLOCKED checks + user explicit completion.


## HTML Functional Class bf-joint 1.1.1
`straight` / `curve` / `orthogonal`（直線 / 曲線 / 直角）と、WAIT / BLOCKED / error、異常アイコン、アニメーション、コメント、診断Codeをdata属性で宣言して接続イメージを作成できる。


## HTML Functional Class

`bf-joint` is a thin adapter to BoneJoint Runtime 1.1.40. It does not define a second Joint implementation.

- `data-route`: `straight` / `curve` / `orthogonal` -> formal `routeStyle`.
- `data-state`: formal BoneJoint state names only.
- `data-source`, `data-target`, `data-bones`: JSON values passed to formal `BoneJoint.evaluate()`.
- `data-source-port`, `data-target-port`: formal TOP / RIGHT / BOTTOM / LEFT positions.
- `bf-joint-in`: semantic IN modifier on the existing `bf-joint` host; exposes `data-bf-joint-role="in"` and `data-joint-role="in"` on the formal path.
- `bf-joint-out`: semantic OUT modifier on the existing `bf-joint` host; exposes `data-bf-joint-role="out"` and `data-joint-role="out"` on the formal path.
- Direction marker triangle tip is aligned to the actual Target endpoint; the triangle has no black outline.
- Direction marker uses the exact same SVG paint as the Joint line. Animation ON/OFF and animation speed are shared; orthogonal path-flow also animates the endpoint marker while preserving the Joint color.
- WAIT uses the formal `.bf-joint-waiting-spinner` marker.
- BLOCKED uses the formal `.bf-joint-blocked-ban` marker (`ban`, `beat-fade`).
- Missing endpoint/field uses `BoneJoint.drawError()`.
- Type compatibility uses `BoneJoint.drawCompatibilityMarker()`.
- No bf-joint-specific alert icon, spinner, ban, marker, diagnostic, or animation is implemented.