Overwolf Nano Stores

Nano Stores implementation for Overwolf Plugin

Prerequisite

Nano Stores is a powerful state manager library designed to support multiple frontend frameworks and tiny bundle sizes.

To have Overwolf API such as Window, Game Event stored in Nano Stores is an easy way to use the API and handle the state.

Supported frameworks: React, React Native, Preact, Vue, Svelte, Solid, Lit, Angular, and vanilla JS.

See how to use Nano Stores in a different framework at The Nano Store Guide.

Installation

npm i overwolf-nanostores

Documentation

Link: https://ntsd.github.io/overwolf-nanostores

Documentation is generated by TypeDoc.

Examples

Example for League of Legends game

import {
  setGameEventRequiredFeatures,
  gameInfoAtom,
  gameEventAtom,
} from "overwolf-nanostores";

// Set required event features
// check different game features from the Overwolf Docs
// https://overwolf.github.io/api/live-game-data/supported-games/league-of-legends#available-features
setGameEventRequiredFeatures(["gep_internal", "match_info", "chat"]);

// The subscribe will trigger every time when the Game Info is updated
gameInfoAtom.subscribe((newInfo) => {
  if (!newInfo) return;
   // use condition to check the feature name
  if (newInfo.feature === "gep_internal") {
    console.log("Local + Public version number:", JSON.stringify(newInfo.info));
  }
  if (newInfo.feature === "match_info") {
    console.log("match info:", JSON.stringify(newInfo.info));
  }
});

// The subscribe will trigger every time when a new Game Event occurs
gameEventAtom.subscribe((newEvent) => {
  if (!newEvent) return;
  newEvent.events.forEach((event) => {
    // use condition to check the event name
    if (event.name === "chat") {
      console.log("new chat:", event.data);
    }
  });
});

In the example,

gep_internal and match_info are features for Game Info so they will trigger the gameInfoAtom

chat is a feature for Game Event so it will trigger the gameEventAtom