addWindowlessGlass

Description

Add a windowless glass — a glass that floats on document.body instead of living inside a bw-window. This is a static method on BinaryWindow, so it works without a mounted window. It returns a promise that resolves to the glass element once the open animation finishes.

BinaryWindow.addWindowlessGlass(options);

Parameters

options details

NameTypeDefaultDescription
modalbooleanfalseRender a backdrop behind the glass that blocks interaction underneath
closeOnBackdropClickbooleanfalseWhen modal, clicking the backdrop closes the glass
positionstring'center'Anchor: center, top-left, top-right, bottom-left, bottom-right
widthnumber222Glass width in px
heightnumber222Glass height in px
offsetnumber0Distance in px from the anchored corner/edge (no effect on center)
offsetX / offsetYnumber0Per-axis override of offset
idstringauto-generatedGlass id; used to remove it later
actionsobject[]close onlyAction buttons
titlestring | DOM Node | ReactNode1Header title
contentstring | DOM Node | ReactNode1Glass body content
draggablebooleantrueWhether the header can be dragged to move the glass
resizablebooleantrueWhether resize handles appear on hover
animatebooleantrueWhether to play the open animation (and fade the backdrop in)

Returns

Type: Promise<Element>

Description: Resolves to the windowless glass element once the open animation completes.

Examples

const glassEl = await BinaryWindow.addWindowlessGlass({
  modal: true,
  title: 'Dialog',
  content: 'Floating content',
});

See also

Footnotes

  1. DOM Node is for vanilla Javascript, and ReactNode is for React. 2