Skip to content

Conversation

@gitmotion
Copy link

@gitmotion gitmotion commented Jan 23, 2026

Hey there! awesome repo, just hopped on opencode and stumbled across this 🙌🏻

Noticed there was a search models functionality and thought it could use some enhancements by adding a command palette with search, actions, grouping, etc to help with navigating through the list of models and providers

Previews:

image
Description Preview
Models, Providers, Sort
(Grouping & Search by model in parent/child directories)
cmdpalette
Mobile Friendly
- Tap/Click & Responsive
- Fixed Search Icon Alignment in later commit
cmdpalette-mobile
Models.dev Section
(Github External link & How to Use)
cmdpalette-brand
Light & Dark Mode
(Works with current theme handling)
cmdpalette-theme

Command Palette Features:

Feature/Section Details
Activation - On click search
- Shortcut: cmd+k / ctrl+k
Global Search - Start typing to search by model name, provider, family
- Navigate into Browse Models/Providers to drill down
Input Methods - Keyboard responsive
- Click/tap responsive
Theme Support - Light mode support
- Dark mode support
Responsiveness - Mobile Friendly
- Dynamically adjusts to displays
Breadcrumbs Navigation - Displays parent and child sections
- Current section highlighted
- Click/tap to navigate
- Backspace to go back
- Enter to select/go forward
- esc/click off screen to close
Command Palette Sections - Browse Models: Independent grouping of models
- Browse Providers: Independent grouping of providers
- Models.Dev section: (external link to GitHub & how to use)
- Actions Section:
  - Clear search: clears search query/param
  - Clear sort: clears sort and order
  - Reset Search: clears both search and sort
  - Sort by: menu for sorting by columns on table with options for ascending/descending based on column
Placeholder Text - Dynamic placeholder text based on current navigation
Compatibility - Works with existing search/sort
- Does not interfere with existing functionality
Data Extraction - Extracts models, providers, and column names from the table
- No hardcoded values for models, providers, columns (for grouping and sorting menus)
- Dynamically adjusts to codebase changes
Sort Menu - Extracts column names from table
- Sort menu updates dynamically as columns are added/removed
Caching - Caches models & providers for instant feedback and searching

Changes (5 files):

Feature/Section Details
Shadow DOM Integration - Contained command palette files added to shadow DOM
  - command-palette.ts
  - command-palette-element.ts
Brand Colors & Mobile Search Icon - Command palette styles inherit brand colors
- Search icon for mobile added
- Relevant file(s): index.css
Mobile Search Enablement - Search enabled on mobile
- Only displays search icon based on device width
- Relevant file(s): render.tsx, index.ts, index.css
Architecture & Minimalism - Respects current architecture with minimal changes to main web directory
- No new package dependencies
- Reuses existing styles and sort functionalities
- Reuses provider data/SVGs for logos in command palette
- Relevant Icon SVGs added for command palette (no tree-shaking icon packages used)
Git Hygiene - All commits rebased for clean git history

Thanks! 🙏🏻

@gitmotion gitmotion force-pushed the feat/add-command-palette-fuzzy-search branch 4 times, most recently from 99c588b to a473dcb Compare January 23, 2026 23:58
@gitmotion gitmotion changed the title feat: add command palette fuzzy search feat(web): add command palette fuzzy search Jan 24, 2026
Update command palette search to only show results based on parent

update command palette selection hover color to brand color

Update command palette scrollbar to be theme aware

Update static actions

update command palatte search to wordbased scores and minor refactors

Fix command-palette view to adjust on mobile portrait/landscape

add kbd styles to footer and update home/root name of command palette

hide command palette footer on small width screens

reorg command palette files to separate dir

update model fetching to get from table rows with caching

reorg models and providers as parents and list items by parent, refactor icons, add external link icon, etc

rename view actions from view to Browse

revert bun.lock

Refactor sort by menu to pull dynamically

remove unused code

cleanup github logo usage

Adjust mobile search icon and command palette chevron alignment
@gitmotion gitmotion force-pushed the feat/add-command-palette-fuzzy-search branch from a473dcb to 5c8f3c5 Compare January 24, 2026 22:31
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant