Skip to main content

Install the SDK

Now that we have our code running as a extension to Owlbear Rodeo we want to be able to interact with the site.

To do this we'll install the Owlbear Rodeo SDK.

Inside your hello-world project run:

$ npm install @owlbear-rodeo/sdk

This will install the SDK using NPM.

Interact with the SDK

To test our interaction with the SDK we're going to show a notification every time the counter in the Vite example changes.

Edit the counter.js file in the src folder of your hello-world project to import the SDK and call when the counter changes:

import OBR from "@owlbear-rodeo/sdk";

export function setupCounter(element) {
let counter = 0;
const setCounter = (count) => {
counter = count;
element.innerHTML = `count is ${counter}`;`count is ${counter}`);
element.addEventListener("click", () => setCounter(counter + 1));

Now whenever you click the count button a notification should show in the Owlbear Rodeo interface.