# Command Palette
## Content
The core advantage of ****SpreadJS Designer's **Command Palette** is its ability to ****significantly enhance operational efficiency. Instead of navigating through multi-layered menus, users can simply invoke the panel with a shortcut (**Ctrl/Cmd+P**), enter a keyword (such as *"merge cells"* or *"data validation"*), and execute commands instantly, reducing steps and saving time.
This feature is particularly valuable for high-frequency, complex tasks like formula editing and batch styling. By enabling keyboard-driven navigation and intelligent search, it minimizes distractions from interface switching, allowing users to focus on core workflows and accelerate spreadsheet design and data processing.
## Configuration
The Command Palette is integrated into the designer's layout via `GC.Spread.Sheets.Designer.DefaultConfig`. It is registered as a pop-up side panel in the configuration:
```javascript
GC.Spread.Sheets.Designer.DefaultConfig = {
// ...
sidePanels: [
// ...
{
/**
* Displays the panel as a popup modal.
*/
position: 'popup',
command: GC.Spread.Sheets.Designer.CommandNames.CommandPalettePanel,
uiTemplate: GC.Spread.Sheets.Designer.TemplateNames.CommandPaletteTemplate,
}
]
};
```
## **How to Open the Command Palette**
### **1\. Default Shortcut \(**`Ctrl/Cmd + P`**)**
Press ****`Ctrl + P`**** (Windows) or ****`Cmd + P`**** (Mac) to open the Command Palette instantly.
### **2\. Ribbon Button**
The Command Palette can also be accessed from the **View tab** in the Ribbon.
## **User Interface & Interaction**
### **Search & Execution**
* **Search Field**: Enter keywords to filter commands (searches `title`, `text`, `tip`, and `name`).
* **Keyboard Navigation**
| Shortcut | Action |
| -------- | ------ |
| **Up / Down Arrow** | Move selection up/down |
| **Enter** | Execute the selected command |
| **Esc** | - When a list item is focused, pressing Esc returns focus to the search box.
- When the search box is focused, pressing Esc closes the command palette.
- When focused in a submenu dropdown, pressing Esc:
- Closes the current submenu
- Returns focus to the search box
|
| **Backspace** | Remove search tags |
### **Supported Commands**
The Command Palette searches:
1. **All ribbon commands**
2. **Hidden commands** (e.g., `GC.Spread.Sheets.Designer.CommandNames.Background`)
3. **Custom commands** defined in `GC.Spread.Sheets.Designer.DefaultConfig.commandMap`
1. Customizing command types in the command palette currently only supports a subset of built-in types:
**Supported command types:** `button`, `RibbonList`, `checkbox`, `colorPicker`, `dropdown`, `comboBox`, `SparklineColorPicker`, `editableSelect`, `ThemeSetting`, `ThemeFonts`, `ThemeColors`, `FileMenuButton`, `dbclickCheckbox`, `listContent`, `chartFormat`, and No type (drawn as a button component by default)