How to add system support

Before we start

• Install the Koboltworks Data Inspector. It's a "must have" for every developer. Also, Alpha Suit integrates with the inspector and adds "inspect" buttons to observe data structure of items. It is especially helpful for compendium entities.
• Basic compendium filters can be done without any coding skills. But more advanced requires some js knowledge. Adding inline "info widgets" or "selected document info pages" needs at least basic Svelte skills.
• The module is based on TyphonJS so you can use its documentation to start working with Alpha Suit. TLDR: npm install & npm run dev then open http://localhost:30001
• Do not hesitate to ask me anything in Discord: Averrin#0374
• Use dnd5e or pf2e as example. This documentation can be incomplete or outdated.
• Filters are based on Filtrex lib. It's necessary to understand its syntax.
• Enable Browser advanced mode in Compendium Browser settings. It will help you to debug your filters.
• You may be confused by inconsistent using of data and system. In general, system is a modern v10 alternative to data. In most cases, you still can use data. But it doesn't work if we are speaking of compendium indexing. I made a couple of hacks to mitigate this difference. You can use either data and system everywhere, but direct getIndex calls.

First steps

We will use pf1 as an example. Please note, at the moment of its writing, this system isn't supported.

• create file src/systems/pf1.js (a file name will use only by you for importing) With content like

import System from "../modules/system.js";

const pf1 = new System({
  id: "pf1",  //this one MUST be the same as your `game.system.id`
  tabs: [],
});

export default pf1;

It's a minimal viable configuration.

• go to src/systems.js and add your system like others.

import pf1from "./systems/pf1.js";
addSystem(pf1);

• In the Alpha Browser's tab line, the tag with system ID should become purple instead of red.
• Congratulations, your system is now supported!
• Profit!