Search
Astro向け検索エンジン「Pagefind」を利用した、モーダル形式のサイト内検索コンポーネントです。
Design Note
現在のSearchコンポーネントのデザインは暫定的なものであり、将来のアップデートでUIが変更される可能性があります。
Dependencies
このコンポーネントは外部ライブラリ astro-pagefind に依存しています。bun add astro-pagefind でインストールし、astro.config.mjs に組み込む必要があります。
Properties
Searchコンポーネントは見た目を調整するためのプロパティを受け付けます。
| Property | Type | Description |
|---|---|---|
text | string | 虫眼鏡アイコンの横に表示するテキストを指定します。 |
square | boolean | true の場合、正方形(アイコンのみ)のボタンになります。 |
Usage
---
import Search from '@/components/Search.astro';
---
<!-- テキスト付きの長方形ボタン -->
<Search text="Search..." />
<!-- アイコンのみの正方形ボタン -->
<Search square={true} />← コンポーネント一覧へ戻る