V3 Doc Event Commands Library

Command Library

The Command Library is a central component of Pokémon Studio’s event editor. It allows game creators to browse, search, and quickly add event commands through a simple, organized interface.

1. Overview & behavior

The Command Library opens automatically whenever an event is being edited. It is structured into three main sections:

1. List of categories
2. List of commands within a category
3. Search bar

Users can:

• Browse categories to explore available commands
• Display the commands of a category with one click
• Search for a command by name
• Drag and drop commands directly into the event editor
• View descriptions or quick help text through tooltips

The interface is designed to be extensible, making it easy to add new commands over time.

Note

The current visual style is temporary. It will be updated later to better match the overall Pokémon Studio design.

2. Code structure and organization

The component’s architecture is designed to make new commands and categories easy to manage.

Adding a category

File: src/models/entities/event/category.ts

• Define the new category: internal name, identifier, associated commands.

File: src/views/components/world/event/common/EventIcon.tsx

• Assign an icon and color via IconsFromCategory.

Adding a command

File: src/models/entities/event/command.ts

• Declare the command: identifier, internal name, optional metadata.
• Add it to the desired category (in category.ts).

File: src/views/components/world/event/common/EventIcon.tsx

• Assign an icon via IconsFromCommand.

Adding translations

In the i18n files:

• Category: event_category_{category_name}
• Command: event_command_{command_name}
• Helper text: event_command_{command_name}_helper

Note

Make sure to keep translations consistent across all supported languages.

3. Available features

Browse categories

Display all commands belonging to a category.

Search

Quickly find a command by typing its name.

Drag & Drop

Drag a command into the Event Editor to insert it into the event flow.

Tooltips

Hover a command to see a short description or help text.

4. Current limitations & planned improvements

Some parts of the component are fully functional, while others will be added later. To clarify what exists today and what will come next:

Not yet included in the current version

• The final visual design has not yet been applied (temporary styling).
• No additional filters to refine searches.

Features coming in future updates

• Favorites: allow users to bookmark their most used commands.
• Recent commands: show the commands used recently by the user.
• Advanced filters: filter commands based on their purpose or usage.
• Visual improvements: enhanced previews and better rendering of nodes in the editor.

5. Resources

• Figma mockups
• Issue #428
• Integration Pull Request #677