[UI/UX] Internal pokedex

[Wlowscha]

What are the changes the user will see?

A new "Pokedex" entry is available in the game menu, accessible from the title page or during a run. Selecting the option opens the Pokedex interface, which has two parts:

1. A display of all mons in a box-like container, identical to the starter-select menu, but displaying evolutions as well as starters. In addition to the filter bars from the starter-select menu, new text forms allow to search mons with a given name, move, or ability. Bringing the cursor on a mon displays the name, number and sprite of the base form. By default, icons do not include shiny overlays, candy icons and abilities, but these can be toggled on with C.

2. Clicking on a mon will open a second page, where a second menu allows details such as level moves, egg moves, biomes etc to be displayed.
   For egg moves and abilities, the ones that have not yet been unlocked are shown in darker text, but still visible to the user.
   The Evolutions entry shows a list of prevolution, evolutions, and forms available during a run such as megas and g-max forms. Selecting one brings the user to another page for that specific evolution stage or form.
   What options exactly should be available in what shape is still to be finalized.

It should also be possible for users to buy candy upgrades directly from the dex page, without needing to interrupt a run and go through the starter select screen. This is not implemented yet but the logic is already there, it is a matter of picking a button.

Why am I making these changes?

An internal dex is a key functionality. Having to leave the game in order to look up information can be bothersome; in the case of mobile users, it can lead to the game shutting down and reloading altogether. Moreover, the dex can implement some functionalities, such as buying candies, which are currently unavailable during a run and require to go back to the title screen.
Most importantly, a functional internal dex reduces the need to rely on external sources, and ensures that data is always fully up to date.

What are the changes from a developer perspective?

Balance:
Helper functions have been added in biomes.ts, pokemon-evolutions.ts and tms.ts, to collect information that the pokedex needs to access in a compact form.

Ui:
The ui/abstact-option-select-ui-handler file has been modified to change the color of individual options, as well as to allow the insertion of lines which are skipped by the cursor (such as headers or descriptions). The new version replicates the old behavior in all cases, but allows for more customization of the menus if required.

The ui/dropdown.ts file has been extended to include a scrollbar when there are too many options (needed for the biome filter).

A new ui/pokedex-ui-scan.ts has been added to manage the auto-complete interface that selects names, moves or abilities.

The ui/pokedex-ui-handler.ts and ui/pokedex-page-ui-handler.ts files have been added, replicating and changes functionality from starter-select-ui-handler.ts.

The ui/pokedex-info-overlay.ts file has been introduced to display e.g. ability descriptions while dynamically resizing the box.

Relevant ui files have been updated to accomodate the new options.

IMPORTANT: Since a new option is being added to menu-ui-handler.ts, it will be necessary to make some space there, or the menu will fall out of the screen.

Screenshots/Videos

Layout of the first page, plus the name filter (Ponyta getting both Standard and Galar versions)

Showcase.Layout.mp4

Some combinations of filters of moves and abilities

Showcase.Filter.Moves.Abilities.mp4

Displaying stats, moves, abilities and so on for a given mon; switching between evolution stages and forms

Showcase.Evolution.Forms.mp4

Biome filter: can be used e.g. to look for uncaught mons or shinies in a given biome, also allows a combination of biomes

Showcase.Biome.mp4

Data for uncaught mons (this will need some polishing)

Showcase.Uncaught.mp4

Toggling decorations on, filtering shinies, looking at unlocked shiny forms for a given evolution line

Showcase.Shiny.mp4

How to test the changes?

Open the menu, select Pokedex and enjoy!

Checklist

• I'm using beta as my base branch
• There is no overlap with another PR?
• The PR is self-contained and cannot be split into smaller PRs?
• Have I provided a clear explanation of the changes?
• Have I tested the changes manually?
• Are all unit tests still passing? (npm run test)
• Have I provided screenshots/videos of the changes (if applicable)?
  • Have I made sure that any UI change works for both UI themes (default and legacy)?

Are there any localization additions or changes? If so:

• Has a locales PR been created on the locales repo?
  • If so, please leave a link to it here: [UI/UX] Internal pokedex pokerogue-locales#96
• Has the translation team been contacted for proofreading/translation?

[damocleas]

Also reporting this minor visual issue I found mashing the menu

Moving down just from 'Sort' removes the bracket highlights from the selected mon, making it harder to navigate.

How it should look after moving down from 'Sort'

[Wlowscha]

Transition from filter bar to pokemon box now works correctly:
https://github.com/user-attachments/assets/774ae224-e4f6-4ab3-98c8-dc9656ffd397