Bone Flow #002 - Bone Joint Guide

1. Bone Flow and Joint

#001 Bone Core creates the smallest unit of meaning. #002 Joint resolves endpoints and fields, checks compatibility, manages connection state and delivery, and exposes the result as a visible route.

2. Joint anatomy

Source, Target, Endpoint, Field, Compatibility and State are separate diagnostic layers. A missing Bone is not the same as a missing Endpoint or Field.

3. Port / RETURN

Normal flow is OUT → IN. RETURN is reserved for return routing. Port roles rotate with TB/BT/LR/RL.

4. Compatibility

Exact types connect normally. Numeric Source → STRING Target is a warning but allowed. Other implicit mismatches are errors. NULL can be allowed by rule.

5. Connection states

6. WAIT / FIFO / BLOCKED

createDeliveryChannel() implements real queue and delivery behavior. WAIT means deliver later; BLOCKED means do not deliver.

7. Straight / Curve / Orthogonal

The connection route can be declared directly on the HTML Functional Class. These are live bf-joint examples, not images.

8. Display settings

Markers, line style, animation, orthogonal clearance, corner radius, lane separation, shape avoidance, intersections and labels affect rendering only; they must not rewrite connection semantics.

9. Abnormal connections and formal markers

bf-joint owns no independent abnormal icon. WAIT, BLOCKED, Error, and Compatibility visuals are drawn by the formal BoneJoint 1.1.40 marker functions.

10. Public API (Runtime 1.1.40)

11. HTML Functional Class: bf-joint

bf-joint is a thin HTML adapter to the formal BoneJoint API, not another Joint implementation.

<div class="bf-joint" data-route="orthogonal" data-state="blocked">
  <div class="bf-joint-source">OUT</div>
  <div class="bf-joint-target">Target</div>
</div>

bf-joint-in and bf-joint-out are semantic role modifiers on the existing bf-joint host. Formal drawing remains owned by BoneJoint Runtime; the host exposes data-bf-joint-role and the formal path exposes data-joint-role as in / out. The direction triangle tip is aligned to the real Target endpoint and has no black outline. Its fill uses the same SVG paint as the Joint line, and Animation ON/OFF plus speed are synchronized with the line.

<div class="bf-joint bf-joint-in" ...>...</div>
<div class="bf-joint bf-joint-out" ...>...</div>

Abnormal meanings, marker shapes, and animations are not redefined by HTML; formal Runtime results are used.

11. Smoke / Validation / 000 cumulative regression

Smoke and Validation are #002-local checks. 000 validates the cumulative boneflow.js / boneflow.css bundle after #001 + #002 integration.

13. Completion

1. Smoke ALL PASS
2. Validation ALL PASS
3. Visual WAIT queue/FIFO check
4. Visual BLOCKED zero-delivery check
5. No double completion
6. Completion state survives reload
7. Only user confirmation makes it formally Completed/Frozen

14. Examples

const result = BoneJoint.evaluate(definition, bones);
const channel = BoneJoint.createDeliveryChannel({ targetReady:false, deliver(payload){ target.receive(payload); } });

14. Verification checklist

• Separate Source/Target/Bone/Endpoint/Field diagnostics
• Correct OUT/IN/RETURN rules
• Correct compatibility direction
• Real WAIT/FIFO queue behavior
• BLOCKED delivers zero payloads
• Correct route geometry and missing-side drawing rule
• JP/EN/search/print/TOC work in the Guide modal