PresetSearch #

PresetSearch is a standalone content-search component for your own custom datasets (not the global docs search).

What it does #

Filters pre-defined result cards by title, description, tags, and metadata values.
Renders results as cards with optional badges and metadata rows.
Works directly inside MDX via structured items data.

Props #

Prop	Type	Required	Description
`items`	`Array<{ title: string, description?: string, href?: string, tags?: string[], metadata?: Record<string, unknown> }>`	Yes	Search dataset rendered as cards.
`placeholder`	`string`	No	Input placeholder text.
`emptyMessage`	`string`	No	Message shown when nothing matches.
`limit`	`number`	No	Maximum number of rendered results.

Live example: wiki-style catalog search #

0 result(s)

No matching catalog entries.

Live example: product cards with richer metadata #

0 result(s)

No matching results.

MDX usage pattern #

mdx

<PresetSearch
  placeholder="Search..."
  items={[
    {
      title: 'My Card',
      description: 'Description text',
      href: '/my/route',
      tags: ['tag-a', 'tag-b'],
      metadata: {
        owner: 'Team Name',
        status: 'Active',
      },
    },
  ]}
/>

Notes #

If href is provided, the whole card is clickable.
metadata values can be strings, numbers, arrays, or nested objects; all are searchable.
Use this for curated search experiences (catalogs, directories, showcases), not full-site indexing.

Edit this page