Skip to main content

FilterBar

Filter bar with category dropdown, optional search input, and optional difficulty filter. Works with the existing pin-filter.ts script via data attributes.

Props

Prop Type Default Description
categoriesstring[]Category options (required)
difficultiesstring[]Difficulty level options
showSearchbooleanfalseShow search input
langstringLanguage for i18n labels
searchPlaceholderstring'Search...'Placeholder text for search

Categories only

Minimal configuration with just categories.

showSearch=true adds a search input.

With difficulty

Adding difficulty levels shows a second dropdown.

Full (all options)

Search + categories + difficulty together.

Search Esc to close / Enter to view results