## HTML Functional Class（bf-textbox）

#017 Text の bf-text と同様、専用 bridge を読んでHTMLの class="bf-textbox" を使います。JavaScript classとは異なります。

```html
<div class="bf-textbox" data-id="name" data-value="初期値" data-placeholder="文字を入力" data-width="320" data-height="44" data-theme="light"></div>
```

Load bone-core.js, bone-textbox.js, then bone-textbox-html-class.js (and the normal Bone Flow shared dependencies). Attributes: data-id, data-value, data-placeholder, data-width, data-height, data-theme, data-required, data-readonly, data-disabled, data-position, data-align. The element is replaced by an instance and the existing BoneTextBox public API remains available.

# DOC-0027 Bone Flow TextBox 操作ガイド（日本語）

## 使用する場所
`/boneflow/test/bone-textbox.html` のヘッダーにある「操作ガイド DOC-0027」で開きます。ガイド上部の日本語 / English を切り替えます。

## Public API
`BoneTextBox.create` で作成し、`setValue` と `commit` で入力値を反映、`getState` で状態を確認、`destroy` で破棄します。API一覧と引数は実Runtimeから表示します。

## Classリスト・コード・実行結果
ガイドの「3. 操作説明」からClass一覧に進み、各Classの目的・入力データ・コード・実行結果を一緒に参照できます。サンプル実行後は画面に生成されたTextBoxとcommit後の状態を見比べてください。

## TextBoxClassSample
`TextBoxClassSample` は利用側の例として定義したClass名であり、BoneTextBox本体の名前ではありません。「Class リスト」には実コード、実際に生成したTextBoxとStateがあります。ガイドの「3. 操作説明」にも同じClassのコード、説明、操作可能な実行例があります。

## #040 ColorPicker
Property色選択は `BoneColorPicker.attachCaller` を利用します。#040の実装は変更しません。

## #002 Bone Joint
WAIT / FIFO / BLOCKEDは正式な#002 Delivery Channelへ委譲し、#027独自のJoint描画を追加しません。

## Untrusted IN / Security Testについて
この欄は利用者向けClass一覧ではなく、外部入力に対する独立した安全性テストです。「正常IN」は通過を、「getter / Proxy / object / 巨大IN」は拒否を、「HTML風文字列IN」はHTMLとして実行せず文字として扱うことを検証します。Previewには干渉しません。

## #022 Effectについて
枠Effectは #022 の公開カタログ（normal, neon, spin, blink, dash, corner, chase, double, wave）を使います。旧サンプルにあった `cross` は #022 の公開カタログ外のため選択しません。

## QA
Smoke TestとValidationはRuntimeが必要です。#000累積回帰は既存のページで実行し、本インストールでは上書きしません。