Popover

OBR.popover

The popover API allows you to display custom UI over the top of the Owlbear Rodeo interface.

Reference

Methods

open

async open(popover)

Open a new popover.

Parameters

NAME	TYPE	DESCRIPTION
popover	Popover	The popover to open

Example

OBR.contextMenu.create({
  id: "rodeo.owlbear.example",
  icons: [
    {
      icon: "icon.svg",
      label: "Example",
    },
  ],
  onClick(_, elementId) {
    OBR.popover.open({
      id: "rodeo.owlbear.example/popover",
      url: "/popover",
      height: 80,
      width: 200,
      anchorElementId: elementId,
    });
  },
});

---

close

async close(id)

Close an open popover.

Parameters

NAME	TYPE	DESCRIPTION
id	string	The ID of the popover to close

---

Type Definitions

Popover

TYPE
object

Properties

NAME	TYPE	DESCRIPTION
id	string	The ID of this popover
url	string	The url of the site to embed
width	number	The width of the popover in pixels
height	number	The height of the popover in pixels
anchorElementId	string	An optional ID of the element to anchor the popover to
anchorPosition	{ left: number; right: number }	An optional position to anchor the popover to
anchorOrigin	{ horizontal: "CENTER" | "LEFT" | "RIGHT"; vertical: "BOTTOM" | "CENTER" | "TOP" }	An optional origin for the popover anchor
transformOrigin	{ horizontal: "CENTER" | "LEFT" | "RIGHT"; vertical: "BOTTOM" | "CENTER" | "TOP" }	An optional origin for the popover transform
anchorReference	"ELEMENT" | "POSITION"	Optionally use either the elementId as the anchor or the position