Separator

fandhe-frontend-pre-styled-ui の separator mod が提供するスタイル済み Separator 部品です。

コンテンツ間を区切る罫線部品です。orientation が role="separator"（固定）+ aria-orientation + data-orientation + variant クラスの 3 箇所へ連動します。呼び出し側が role/aria-orientation を偽装しても常にフレームワーク値へ一本化されます。

Demo

区切り線。role="separator" と aria-orientation/data-orientation を常時出力します。orientation（horizontal/vertical）と variant（solid/dashed）の 2 軸を持ちます。

Features

orientation が role="separator"（固定） + aria-orientation + data-orientation + variant クラスの 3 箇所へ連動する（crates/pre-styled-ui/src/separator.rs:10, 17）
SeparatorVariant（Solid/Dashed、separator.rs:74-84）で罫線種別を切り替える
role/aria-orientation/data-orientation は呼び出し側の偽装を除去し常にフレームワーク値へ一本化する（separator.rs:213-217、skeleton の aria-hidden 除去と同型）

Anatomy

root

API Reference

Arguments

Name	Type	Default	Description
orientation	Orientation	Horizontal	向き（separator.rs:114-124）。
variant	SeparatorVariant	Solid	罫線種別（separator.rs:74-84, 122-124）。

Data Attributes

Part	Attribute	Observed Values
root	data-orientation	horizontal, vertical

CSS Variables

Variable	Default
--fandhe-separator-height	auto

Examples

Vertical dashed

縦向き・破線の Separator の例です。

Accessibility

WAI-ARIA

Attribute	Description
role="separator" + aria-orientation	orientation と連動し常に固定出力される（separator.rs:10, 17, 58-59）。