Navigation

FindBar

Docked, backend-agnostic find controls with debounced query notifications and match navigation.

import { FindBar } from '@lostgradient/cinder/find-bar';
find-bar
01

Overview

Docked find-in-document controls for a host-provided search backend.

Live preview

Type at least 3 characters to search.2 of 4
02

When to use

Use when
  • Providing find-in-document controls backed by a host search implementation.
Avoid when
  • Building a general search field with suggestions — use SearchField or Combobox.
03

Examples

Basic find bar

A find-in-page control with match navigation.

04

Props

Props for find-bar
Name
Type
Default
Description
value bindable text ''
matchCount bindable number null
activeIndex bindable number 0
minQueryLength number 3
debounceMs number 250
onQueryChange (query: string) => void
onPrevious () => void
onNext () => void
onDismiss () => void
label text 'Find'
id text