open-index/open-npm huggingface dataset:
npm package: @rpglogs/report-component-types
Description: This package is aimed at users that want to write [Report Components](https://www.archon.gg/wow/articles/help/what-are-report-components) inside their own code editors. It provides the same TypeScript types that are available in the web-based [Report Comp
Latest version: 1.0.8

This package is aimed at users that want to write [Report Components](https://www.archon.gg/wow/articles/help/what-are-report-components) inside their own code editors.
It provides the same TypeScript types that are available in the web-based [Report Component Sandbox](https://www.archon.gg/wow/articles/help/report-components-the-sandbox).

Because types can be game-specific, you will want to import the types for the specific game you are working with:
```ts
import type { RpgLogs } from "@rpglogs/report-component-types/warcraft";
import type { RpgLogs } from "@rpglogs/report-component-types/ff";
import type { RpgLogs } from "@rpglogs/report-component-types/eso";
import type { RpgLogs } from "@rpglogs/report-component-types/swtor";
```

Due to how these are structured internally, the types hang off of a single `RpgLogs` namespace. Some helpful types are:
- `RpgLogs.ReportComponentContext`: The context passed to the component function, which includes information about the report group.
- `RpgLogs.Component`: The type for a report component, which includes the component name and its props.

Online documentation for these types is available at: https://www.warcraftlogs.com/scripting-api-docs/warcraft/

# Example Usage

```ts
import type { RpgLogs } from "@rpglogs/report-component-types/warcraft";

export default function getComponent({
  reportGroup,
}: RpgLogs.ReportComponentContext): RpgLogs.Component {
  return {
    component: "JsonTree",
    props: {
      gameVersion: reportGroup.reports[0].gameVersion,
      fights: reportGroup.fights.map((fight) => fight.id),
    },
  };
}

```