PHPackages eseperio/yii2-command-palette - PHPackages - PHPackages [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register) 1. [Directory](/) 2. / 3. [Utility & Helpers](/categories/utility) 4. / 5. eseperio/yii2-command-palette ActiveLibrary[Utility & Helpers](/categories/utility) eseperio/yii2-command-palette ============================= A command palette widget for Yii2 projects 1.2.0(7mo ago)1672↓61.1%[1 PRs](https://github.com/Eseperio/yii2-command-palette/pulls)MITPHPPHP >=8.0 Since Aug 6Pushed 7mo agoCompare [ Source](https://github.com/Eseperio/yii2-command-palette)[ Packagist](https://packagist.org/packages/eseperio/yii2-command-palette)[ RSS](/packages/eseperio-yii2-command-palette/feed)WikiDiscussions main Synced 2d ago READMEChangelog (5)Dependencies (4)Versions (8)Used By (0) Yii2 Command Palette Widget =========================== [](#yii2-command-palette-widget) A widget to add a command palette to your Yii2 application, similar to the ones in VSCode, GitHub, and other modern applications. The command palette provides a quick way to access commands and navigate through your application using keyboard shortcuts. [![Command Palette Demo](img.png)](img.png) Features -------- [](#features) > \[!INFO\] 1.2.0 External search is now available. Command palette + categorized search. > [![img_1.png](img_1.png)](img_1.png) - 🚀 Keyboard-driven interface (Ctrl+K / Cmd+K to open by default, customizable) - 🔍 Fuzzy search with Levenshtein distance algorithm - ⌨️ Full keyboard navigation (arrow keys, enter, escape) - 🎨 Customizable appearance with multiple themes (default, dark, modern) - 🌐 Internationalization support for 10 languages - 🧩 Multiple palettes on the same page - 📱 Responsive design - 🔗 Support for URLs and JavaScript actions - 🖼️ Support for emoji, image icons, and HTML icons (FontAwesome, etc.) **Available since 1.2.0** - 🆕 **URL type labels** - Automatic labels for HTTP (unsecure), email, phone, and protocol links - 🆕 **Debug mode** - Console logging with \[CommandPalette\] prefix - 🆕 **New tab shortcuts** - Ctrl/Cmd+Enter to open links in new tabs - 🆕 **External search** - Search items from external API endpoints with type filtering - 🆕 **Recent items** - Remember and display recently selected items at the top - 🆕 **Links scraper** - Automatically scrape and add links from the page - 🆕 **Recent items** - Remember and display recently selected items at the top DEMO ==== [](#demo) > Clone repository, run `composer install` and then `composer serve`. Requirements ------------ [](#requirements) - PHP 8.0+ - Yii2 2.0+ Installation ------------ [](#installation) Install the package via Composer: ``` composer require eseperio/yii2-command-palette ``` Basic Usage ----------- [](#basic-usage) ``` use eseperio\commandPalette\CommandPaletteWidget; echo CommandPaletteWidget::widget([ 'items' => [ [ 'icon' => '🏠', 'name' => 'Home', 'subtitle' => 'Go to homepage', 'action' => '/', ], [ 'icon' => '🔍', 'name' => 'Search', 'subtitle' => 'Search for content', 'action' => '/search', ], [ 'icon' => '⚙️', 'name' => 'Settings', 'subtitle' => 'Application settings', 'action' => '/settings', ], [ 'icon' => 'https://example.com/icons/user.png', 'name' => 'Profile', 'subtitle' => 'View your profile', 'action' => '/profile', ], ], ]); ``` Item Configuration ------------------ [](#item-configuration) Each item in the command palette can have the following properties: - `icon` (string): An emoji, URL to an image, or HTML (if allowHtmlIcons is true) - `name` (string): The name of the item - `subtitle` (string, optional): A subtitle or description - `action` (string|callable): A URL or JavaScript function to execute when the item is selected - `visible` (boolean, optional): Whether the item should be displayed (default: true) The widget itself can be configured with the following properties: - `items` (array): The items to display in the command palette - `locale` (string, optional): The locale for translations - `theme` (string, optional): The theme to use (default, dark, or modern) - `allowHtmlIcons` (boolean, optional): Whether to allow HTML in icons (default: false) - `debug` (boolean, optional): Enable debug mode with console logging (defaults to YII\_DEBUG) - `maxRecentItems` (int, optional): Maximum number of recent items to keep (default: 3, 0 to disable) ### URL Actions [](#url-actions) You can specify a URL as the action, and the user will be redirected to that URL when the item is selected: ``` 'action' => '/profile', // Relative URL 'action' => 'https://example.com', // Absolute URL ``` ### JavaScript Actions [](#javascript-actions) You can specify a JavaScript function as the action using Yii2's JsExpression: ``` use yii\web\JsExpression; 'action' => new JsExpression('function() { alert("Hello, world!"); }'), ``` Or use a more complex function: ``` use yii\web\JsExpression; 'action' => new JsExpression('function() { console.log("Item selected"); window.location.href = "/profile"; }'), ``` This approach ensures that the JavaScript code is properly encoded and executed when the item is selected. Documentation ------------- [](#documentation) - [Advanced Usage](docs/advanced-usage.md) - HTML icons, multiple palettes, conditional items, programmatic control, debug mode, keyboard shortcuts - [Customization](docs/customization.md) - CSS variables, themes, keyboard shortcuts, language support - [External Search](docs/external-search.md) - Configure external API search with type filtering and debouncing Development and Testing ----------------------- [](#development-and-testing) The package includes a test application that demonstrates the usage of the command palette widget. You can run this application using the built-in PHP server: ``` composer serve ``` This will start a PHP server on `localhost:8081`. Open your browser and navigate to to see the command palette widget in action. The test application includes several examples: - Basic usage of the command palette - Multiple command palettes on the same page - Custom styled command palette - HTML icons example (FontAwesome) - URL type labels example - External search example ### Compile assets [](#compile-assets) This project uses vite to compile assets. To compile assets, run the following command: `vite build` License ------- [](#license) MIT ### Health Score 37 — LowBetter than 81% of packages Maintenance64 Regular maintenance activity Popularity19 Limited adoption so far Community8 Small or concentrated contributor base Maturity46 Maturing project, gaining track record Bus Factor1 Top contributor holds 70.9% of commits — single point of failure How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window. **Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores. **Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement. **Maturity (30%)** — Project age, version count, PHP version support, and release stability. ### Release Activity Cadence Every ~26 days Total 5 Last Release 228d ago ### Community Maintainers ![](https://www.gravatar.com/avatar/b1e173755eb4a5abae378ed4c8a8e8066f578c3192105c5e3f9b8ea3ef0086e7?d=identicon)[Eseperio](/maintainers/Eseperio) --- Top Contributors [![Eseperio](https://avatars.githubusercontent.com/u/5459366?v=4)](https://github.com/Eseperio "Eseperio (56 commits)")[![Copilot](https://avatars.githubusercontent.com/in/1143301?v=4)](https://github.com/Copilot "Copilot (23 commits)") ### Code Quality TestsCodeception ### Embed Badge ![Health badge](/badges/eseperio-yii2-command-palette/health.svg) ``` [![Health](https://phpackages.com/badges/eseperio-yii2-command-palette/health.svg)](https://phpackages.com/packages/eseperio-yii2-command-palette) ``` ### Alternatives [craftcms/cms Craft CMS 3.6k3.6M3.1k](/packages/craftcms-cms) PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)