Cosmo

Window

Manage the widget's window size and position.

The window module allows your widget to interact with its containing window. You can get and set the window's size and position on the screen.

Usage

Import the methods from @buildcosmo/widget:

import {
  getWindowSize,
  setWindowSize,
  getWindowPosition,
  setWindowPosition,
} from "@buildcosmo/widget";

Methods

getWindowSize()

Returns the current size of the widget window in points.

const size = await getWindowSize();
console.log(size.width, size.height);

setWindowSize(size)

Sets the size of the widget window.

setWindowSize({ width: 400, height: 300 });

getWindowPosition()

Returns the current position of the widget window (bottom-left corner) in screen coordinates.

const pos = await getWindowPosition();
console.log(pos.x, pos.y);

setWindowPosition(x, y, options?)

Sets the position of the widget window.

You can set the position in two ways:

  1. Exact Coordinates: Pass x and y to set the position of the window's bottom-left corner in screen coordinates (pixels), where (0, 0) is the bottom-left of the main screen.
  2. Proportional Coordinates: Pass x and y with { proportional: true } to set the position based on screen proportions (0-1), where 0.5, 0.5 is the center of the screen. In this mode, the position references the center of the window. y=0 is the bottom edge, and y=1 is the top edge.
// Set exact position (bottom-left corner at 100, 100)
setWindowPosition(100, 100);

// Center the window on the screen
setWindowPosition(0.5, 0.5, { proportional: true });

// Position at top-right corner (center of window at top-right of screen)
setWindowPosition(1, 1, { proportional: true });

The window position is clamped to the screen boundaries. If you attempt to set a position that would place the window partially or fully off-screen, it will be adjusted to stay within the screen area.