Pin Input
fandhe-frontend-pre-styled-ui の pin_input mod が提供するスタイル済み Pin Input 部品です。
関連 API: fandhe-frontend-pre-styled-ui API / fandhe-frontend-headless-ui API
Demo
PIN コード等、固定桁数の入力に使う部品。`complete`/`disabled` の 2 状態を持つ。
Features
- `size` variant クラスを `root` へ付与し、headless-ui の `pin_input::root` へ委譲する。
- `complete`(全桁入力済み)・`disabled` の 2 状態フラグを直接引数で受け取る。
Anatomy
rootAPI Reference
Arguments
| Name | Type | Default | Description |
|---|---|---|---|
| size | Size | Size::Md | サイズ variant。 |
| complete | bool | false | 全桁入力済み状態。 |
| disabled | bool | false | 無効化状態。 |
| attrs | Vec<(&str, &str)> | root パーツへ合成する追加属性。 | |
| children | Vec<Node> | root 配下の子ノード(通常 1 桁ずつの input パーツ列)。 |
CSS Variables
| Variable | Default |
|---|---|
| --fandhe-pin-input-font-size | var(--fandhe-font-font-size-md) |
| --fandhe-pin-input-size | 2.5rem |