Native Select
fandhe-frontend-pre-styled-ui の native_select mod が提供するスタイル済み Native Select 部品です。
Note
Anatomy は共有スコープ field のパーツ構成として導出されます。Field / Fieldset は headless-ui のみが提供する部品であり、pre-styled-ui 側に独立ページを持ちません。
Demo
素の select/option 要素をそのまま styled 化した選択部品。
Features
- `variant`/`size` の 2 軸を持ち、headless-ui の `field::select`(`data-scope="field"`)へ委譲する。ネイティブ `<select>` を組み立てるため、キーボード操作はブラウザ標準に委ねる。
Anatomy
selectAPI Reference
Arguments
| Name | Type | Default | Description |
|---|---|---|---|
| props | &NativeSelectProps | `variant`・`size` を束ねる構造体。 | |
| field | &FieldProps<'_> | headless-ui `field` スコープ共通の状態。 | |
| extra_attrs | Vec<(&str, &str)> | `<select>` へ合成する追加属性。 | |
| children | Vec<Node> | `<option>` 等の子ノード。 |
Accessibility
Keyboard Interactions
| Key | Description |
|---|---|
| ArrowUp / ArrowDown | ネイティブ `<select>` の標準挙動として選択肢を移動する(ブラウザ実装依存、本フレームワークの JS 出力によらない)。 |