#054 Display Timeline

Display timeline UI with overlapping/stacked bars, Shape Comment, #040 ColorPicker caller integration, #125 Blend, parent fit, and weekly/monthly group display.

## HTML Functional Class

正式Classは `bf-display-timeline` 1件です。Bar / Shape Commentは別Classではなく、`data-timeline-items` の各Itemで `displayType: "bar"` / `displayType: "shapeComment"` を指定します。

詳細なHTML属性、Bar Property、Shape Comment Property、JavaScript API、週報例は `054-Display-Timeline-HTML-Class.md` を参照してください。

実行サンプル: `http://localhost/boneflow/sample/054/`

## Parent attachment
`snapToParent` + `parentHeight`; explicit parent height fills width and height, while 0 keeps automatic content height. Parent snap removes the #054 outer frame/padding and fits content directly to the parent edges.

## Consumer group settings
日間隔 / 1日枠線 / 枠線太さ / 枠線色(#040) / 角丸。


## Runtime Property Schema API

#054はConsumerがProperty名を再定義しなくてよいように、Runtimeから正式Property Schemaを公開します。

```js
const schema = BoneDisplayTimeline.getPropertySchema();
const defaults = BoneDisplayTimeline.getPropertyDefaults();
const timeAxis = BoneDisplayTimeline.getPropertyDefinition("timeAxisMode");
```

`timeAxisMode` が正式な「時間ラベル表示」Propertyです。値は `all / group-first / none`。`showLabels` は既存互換の共通ゲートで、通常の表示選択には `timeAxisMode` を使用します。Bar内のItem `label` とは別責務です。

#048 TableなどのConsumerは、#054のPropertyを独自にハードコードせず `getPropertySchema()` を参照します。これにより#054のProperty追加・修正をConsumer側で再定義する事故を防ぎます。


### 縦表示 (orientation: vertical) / v1.0.27
- 時間は上から下へ進みます。時間目盛は左側、Gridは横線、バーは時間に応じた縦長の矩形です。
- barLayout=stack は複数の縦レーンを左右へ配置します。Drag/ResizeはY軸で動作します。
- orientation=horizontal は従来どおり横向きです。

## 縦表示と #048 Table 連携 (Package v1.0.34)
#054 テスト画面の方向を「縦」にすると、縦方向の時刻軸と #048 Table の複数列を組み合わせます。列数既定7（1〜31）、列幅既定140px（100〜480px）。幅は列単位で指定し、横幅が足りない場合は水平スクロールします。#048 正式Runtime 1.0.16とHTML Functional Class Bridgeを既設として使用し、#048のFrozenファイルは変更・同梱しません。初期タスクは第1列に表示し他列は空欄（捏造データを複製しません）。


### v1.0.34 縦表示／#048 Table 列幅仕様
縦表示の「タイムバー表示幅」は #054 の表示領域だけの幅です（既定140px）。列数既定7列。「グループ先頭だけ表示」は最左列にのみ時間軸ラベルを設け、その列幅にはラベル62pxを追加します。2列目以降の列幅は指定表示幅そのままです。例：7列・140px・先頭のみ表示では 202px + 140px × 6 = 1042px。表示しない場合は140px × 7 = 980px。各Timelineに表示する場合は202px × 7 = 1414px。#048 正式Runtimeは変更しません。


## 縦表示（v1.0.34）

縦表示では `displayType: "shapeComment"` をシェイプ吹き出しではなくタイムバーとして描画します。元データの `displayType` は保持するため、横表示では従来のシェイプコメントが使えます。縦表示ではタイムバーが #048 Table の各列のタイムバー領域幅に一致します。各 Item の `verticalCommentPosition` は `top-left`（既定・左上）、`center`（中央）、`bottom`（下）から選択し、文字はタイムバー内に表示します。


### タイムバー重なり（v1.0.34）

既定は `barLayout: "overlap"`（重ねて表示）。縦では `left` / `right`、横では `top` / `bottom` を使用します。重複するバーは **同じ時間軸／同じ#048 Tableセル内** で左右または上下に配置し、行を増やしません。過去の `stack` 入力は縦なら `left`、横なら `top` に移行します。設定画面から「自動で別行」は削除しました。


## v1.0.34 変更：項目別の重なり／時間ラベルの初期値
時間ラベルの初期値は縦横とも `group-first`（グループ先頭だけ表示）。縦表示では左端列だけに62pxを追加します。#048 Tableの設定列幅（既定140px）をタイムバー全体に使用し、重なるバーでも幅を縮小しません。各Itemの `verticalOverlap` は `overlap`／`left`／`right`、`horizontalOverlap` は `overlap`／`top`／`bottom`。左右上下の指定はそのItemの前面表示（z-index）を意味し、列幅を分割しません。旧 `barLayout` は互換入力として扱います。


### v1.0.36 — 縦表示の文字収まり・親要素吸着・別画面Preview
- `verticalTextFitMode`（HTML: `data-timeline-text-fit`）：`shrink` 初期値 / `expand-column`。縦向きで短時間バーを左右吸着した場合も、バー実測幅・高さと文字の実測長からフォントを12pxから必要サイズへ縮小（下限7px）。内容が下限でも入り切らない極端な短時間・長文では、`title` の全文Tooltipで参照可能。
- `expand-column` はConsumer側の#048 Table列幅を拡張する方式。今回の正式Previewではサンプルデータを置く左端列だけ自動拡張し、他列は既定幅140pxを保つ。設定幅最大480px。#048 Runtime/Frozenは変更しない。
- 本体Property画面のPreview枠は右下ドラッグの `resize: both` で変更可能。吸着ONのときPreview親の高さに追従（時間目盛が読める最低高さ624pxまではスクロール）。縦7列の幅は保持し、狭くしても列を押しつぶさず横スクロールを表示。
- `別画面で表示` は `/boneflow/test/bone-display-timeline-preview.html` にPreview専用ウィンドウを開き、同一Origin内でProperty変更を反映。別画面自身に再「別画面」ボタンや開発ログは付けない。ウィンドウを縮小してもタイムバーの幅と時間軸を維持しスクロールで表示。

### Package v1.0.38 — 横表示消失と#040連携の修正
- v1.0.37で `gridTicks()` が未定義だったため、横・縦のタイムライン描画が例外停止していた不具合を修復。
- 軸ラベルは `step`、時間グリッドは `snap` 単位。15分補助線と1時間主線を区別。
- #040 ColorPicker Callerは形式API・互換Versionと実依存を照合し、初期化できないときは理由・Caller件数を表示。
- #040本体、#048 Table Frozen、#000累積回帰は変更しない。


## v1.0.39 #026 TimePicker consumer integration

The #054 test UI uses the independently installed #026 `bf-timepicker` HTML Functional Class for Timeline and Item start/end inputs. It listens for `bone-timepicker:select`, commits the value in the #054 consumer, and redraws. #026 Runtime and Functional Class are not distributed or edited by this package.