Commands and Shortcuts

Command system integration providing keyboard shortcuts, menu access, and programmatic control of Visual Python functionality within JupyterLab.

Capabilities

Toggle Command

Main command for controlling Visual Python panel visibility.

/**
 * Command for toggling Visual Python panel visibility
 * ID: 'jupyterlab-visualpython:toggle'
 */
'jupyterlab-visualpython:toggle': Command;

Command Properties:

• ID: 'jupyterlab-visualpython:toggle'
• Label: "Toggle Visual Python"
• Category: "Visual Python"
• Description: Shows or hides the Visual Python panel in JupyterLab's right sidebar

Execution Behavior:

• If panel is visible: Hides the Visual Python panel
• If panel is hidden: Shows the Visual Python panel in right sidebar
• Automatically manages panel state and UI updates

Usage Examples:

// Execute programmatically
app.commands.execute('jupyterlab-visualpython:toggle');

// Check if command is available
const isEnabled = app.commands.isEnabled('jupyterlab-visualpython:toggle');

// Get command label
const label = app.commands.label('jupyterlab-visualpython:toggle');

Command Registration

Commands are registered during extension activation with the JupyterLab command registry.

/**
 * Command registration during extension activation
 * @param app - JupyterLab application instance
 * @param vpPanel - Visual Python panel instance
 */
app.commands.addCommand('jupyterlab-visualpython:toggle', {
  label: 'Toggle Visual Python',
  execute: () => void
});

Registration Process:

1. Command added to application command registry
2. Execute function bound to panel visibility logic
3. Label and metadata configured for UI display
4. Command becomes available in palette and shortcuts

Keyboard Shortcuts

Primary Shortcut

Main keyboard shortcut for accessing Visual Python functionality.

// Keyboard shortcut configuration
'Accel Shift V': 'jupyterlab-visualpython:toggle'

Shortcut Details:

• Keys: Accel + Shift + V
• Platform Mapping:
  • Windows/Linux: Ctrl + Shift + V
  • macOS: Cmd + Shift + V
• Scope: Global (works throughout JupyterLab interface)
• Action: Toggles Visual Python panel visibility

Usage: Press the keyboard combination from anywhere in JupyterLab to show/hide Visual Python panel.

Shortcut Configuration

Keyboard shortcuts are defined in the plugin schema and automatically registered:

{
  "shortcuts": [
    {
      "command": "jupyterlab-visualpython:toggle",
      "keys": ["Accel Shift V"],
      "selector": "body"
    }
  ]
}

Command Palette Integration

Palette Entry

Commands are automatically added to JupyterLab's command palette for easy access.

/**
 * Command palette integration
 * @param palette - JupyterLab command palette
 */
palette.addItem({
  command: 'jupyterlab-visualpython:toggle',
  category: 'Visual Python'
});

Palette Properties:

• Command: 'jupyterlab-visualpython:toggle'
• Category: "Visual Python"
• Display: "Toggle Visual Python"
• Search Terms: ["visual", "python", "toggle", "panel"]

Access Method:

1. Open command palette (Ctrl/Cmd + Shift + C)
2. Type "visual python" or "toggle"
3. Select "Toggle Visual Python" command
4. Press Enter to execute

Toolbar Integration

Notebook Toolbar

Visual Python integrates with the notebook toolbar for easy access during notebook editing.

// Toolbar button configuration
{
  "command": "show-visualpython",
  "name": "show-visualpython"
}

Toolbar Integration:

• Command: "show-visualpython" (mapped to toggle command)
• Button Label: Shows Visual Python panel
• Icon: Visual Python logo/icon
• Placement: Notebook toolbar alongside other tools

Usage: Click the Visual Python toolbar button in notebooks to open the visual programming interface.

Menu Integration

Context Menus

Visual Python commands can be accessed through various context menus in JupyterLab.

// Context menu integration (when applicable)
contextMenu.addItem({
  command: 'jupyterlab-visualpython:toggle',
  selector: '.jp-Notebook'
});

Command Execution Context

Panel State Management

Commands automatically manage Visual Python panel state:

// Command execution logic
execute: () => {
  if (vpPanel.isVisible) {
    vpPanel.hide();
    app.shell.remove(vpPanel);
  } else {
    app.shell.add(vpPanel, 'right');
    vpPanel.show();
  }
}

State Management:

• Show Panel: Adds panel to right sidebar and makes visible
• Hide Panel: Removes panel from sidebar and hides interface
• State Persistence: Panel state maintained across JupyterLab sessions
• UI Updates: Toolbar and menu items reflect current panel state

Error Handling

Commands include error handling for various failure scenarios:

execute: () => {
  try {
    // Panel toggle logic
  } catch (error) {
    console.error('Failed to toggle Visual Python panel:', error);
    // User notification of error
  }
}

Error Scenarios:

• Panel creation failures
• DOM manipulation errors
• Resource loading issues
• Extension dependency problems

Customization

Command Extension

Developers can extend Visual Python commands:

// Adding custom Visual Python commands
app.commands.addCommand('jupyterlab-visualpython:custom-action', {
  label: 'Custom Visual Python Action',
  execute: () => {
    // Custom functionality
  }
});

Shortcut Customization

Users can customize keyboard shortcuts through JupyterLab settings:

{
  "shortcuts": [
    {
      "command": "jupyterlab-visualpython:toggle",
      "keys": ["Ctrl Alt V"],
      "selector": "body"
    }
  ]
}

Types

// Command-related types
interface Command {
  execute(args?: any): Promise<any> | any;
  label?: string;
  caption?: string;
  usage?: string;
  iconClass?: string;
  iconLabel?: string;
  className?: string;
  isEnabled?(args?: any): boolean;
  isVisible?(args?: any): boolean;
  isToggled?(args?: any): boolean;
}

interface ICommandPalette {
  addItem(options: IPaletteItem): IDisposable;
}

interface IPaletteItem {
  command: string;
  category?: string;
  args?: any;
  rank?: number;
}