# Bone Flow Common Standalone UI Test v1.0.0

対象: #017〜#029（#023 Flow Editorを除外）。

## 基本

HTML側で次の2ファイルだけを読み込みます。

```html
<link rel="stylesheet" href="./boneflow.css">
<script src="./boneflow.js"></script>
```

`boneflow.js` には対象UI Runtime / HTML Functional Class / 必要Core・Joint・Registryと、Shape Registry・Font Awesome catalogを内蔵しています。
`boneflow.css` はFont Awesome woff2をdata URIとして内蔵しているため `/vendor` 依存はありません。

## Normal-use HTML Functional Class

- #017 `bf-text`
- #018 `bf-icon`
- #019 `bf-image`
- #020 `bf-label`
- #021 `bf-shape`
- #022 `bf-hover-border-effect`
- #024 `bf-calendar`
- #025 `bf-datepicker`
- #026 `bf-timepicker`
- #027 `bf-textbox`
- #028 `bf-textarea`
- #029 `bf-numberbox`

## Registry

- `BoneFlow.holidays`: JP 2026/2027を標準内蔵。`load()` / `register()` / `registerMany()` で追加・上書き。
- `BoneFlow.emoji`: 既存 `BoneEmojiRegistry` の標準Catalogを利用。`load()` / `register()` で追加・上書き。
- `BoneFlow.data`: 今日のタスク等の流動データ。`set/get/update/provider/refresh/load/subscribe`。

外部JSON例は `sample/data/` にあります。外部JSONは任意であり、基本UI起動には不要です。

## 注意

これは共通2ファイル化の動作確認用候補です。正式Completed/Frozen版ではありません。

## Realtime Preview #001 v1.0.6 candidate

`sample/001/boneflow-realtime.js` は複数の `.bf-realtime-layout` を同一ページで独立表示できるよう、各hostのPreview Runtimeを独立したsame-origin iframeへ分離します。既存#023 Renderer / Shape Adapter / Joint Adapter本体は変更しません。

通常はPreviewのみです。

```html
<div class="bf-realtime-layout">
  <script type="text/boneflow">
  @id sample
  (start:開始) => ((end:終了))
  </script>
</div>
```

Editor + Previewが必要な場合だけ明示します。

```html
<div class="bf-realtime-layout" data-boneflow-mode="editor-preview"></div>
```

目視確認ページ: `sample/001/multi-instance-test.html`

#002 Markdown Previewはv1.0.8候補として #001 Realtime Preview v1.0.6 を使用します。