Highlight
fandhe-frontend-pre-styled-ui の highlight mod が提供するスタイル済み Highlight 部品です。
Demo
テキスト中の一致語句を <mark> で強調します。正規表現ではなく決定的な部分文字列検索のみで一致判定します。query（複数可）・match_all（全一致 or 最初の 1 件）・ignore_case（ASCII 限定）・variant（subtle/solid/text/plain）・colorPalette の各プロパティを持ちます。
The quick brown fox jumps over the lazy dog
The quick brown fox jumps over the lazy dog
The quick brown fox jumps over the lazy dog
Variant
subtlesolidtextplain
Palette
AccentInfoSuccessWarningDangerNeutral
Features
- テキスト中の一致語句を <mark> で囲んで強調する
- 正規表現ではなく決定的な部分文字列検索のみで一致判定する（ReDoS の面を持たない）
- query（複数可）・match_all（全一致 or 最初の 1 件）・ignore_case（ASCII 限定）の 3 プロパティを持つ
- variant（subtle/solid/text/plain）4 種、colorPalette 6 値を持つ（mark と同一語彙、イシュー #1435）
Anatomy
root
markAPI Reference
Arguments
| Name | Type | Default | Description |
|---|---|---|---|
query | &[&str] | &[] | 強調する語句（複数可）。空文字列の要素は無視する。 |
ignore_case | bool | false | 大文字小文字を区別しない一致（ASCII の範囲のみ）。 |
match_all | bool | false | true なら全一致箇所、false なら最初の 1 箇所のみ強調する。 |
variant | HighlightVariant | Subtle | 見た目のバリアント（subtle/solid/text/plain）。 |
palette | ColorPalette | Accent | colorPalette 軸。 |
Examples
単一一致・全一致・大文字小文字無視
query / match_all / ignore_case の組み合わせを並べます。
The quick brown fox jumps over the lazy dogThe quick brown fox jumps over the lazy dogThe quick brown fox jumps over the lazy dog
variant 4 種
subtle/solid/text/plain の見た目を並べます。
subtlesolidtextplain