How to use the @ephox/alloy.Boxes.box function in @ephox/alloy

lazyContext (comp) {
          const headerHeight = Height.getOuter(comp.element());
          const container = editor.inline ? editor.getContentAreaContainer() : editor.getContainer();
          const box = Boxes.box(Element.fromDom(container));
          // Force the header to hide before it overflows outside the container
          const boxHeight = box.height() - headerHeight;
          return Option.some(Boxes.bounds(box.x(), box.y(), box.width(), boxHeight));
        },
        onShow: () => {

const getIframeBounds = (editor: Editor, contentAreaBox: Bounds, viewportBounds: Bounds): Bounds => {
  const { x, width } = getHorizontalBounds(contentAreaBox, viewportBounds);
  const container = Element.fromDom(editor.getContainer());
  const header = SelectorFind.descendant(container, '.tox-editor-header').getOr(container);
  const containerBox = Boxes.box(container);
  const headerBox = Boxes.box(header);

  const y = Math.max(viewportBounds.y(), contentAreaBox.y(), headerBox.bottom());
  // Use the container here, so that the statusbar is included
  const contentBoxHeight = containerBox.bottom() - y;
  const maxViewportHeight = viewportBounds.height() - (y - viewportBounds.y());
  const height = Math.min(contentBoxHeight, maxViewportHeight);

  return Boxes.bounds(x, y, width, height);
};

const getContextToolbarBounds = (editor: Editor) => {
  const toolbarOrMenubarEnabled = Settings.isMenubarEnabled(editor) || Settings.isToolbarEnabled(editor) || Settings.isMultipleToolbars(editor);
  const viewportBounds = VisualViewport.getBounds(window);
  const contentAreaBox = Boxes.box(Element.fromDom(editor.getContentAreaContainer()));

  // Create a bounds that lets the context toolbar overflow outside the content area, but remains in the viewport
  if (editor.inline && !toolbarOrMenubarEnabled) {
    return getDistractionFreeBounds(editor, contentAreaBox, viewportBounds);
  } else if (editor.inline) {
    return getInlineBounds(editor, contentAreaBox, viewportBounds);
  } else {
    return getIframeBounds(editor, contentAreaBox, viewportBounds);
  }
};

const getInlineBounds = (editor: Editor, contentAreaBox: Bounds, viewportBounds: Bounds): Bounds => {
  const { x, width } = getHorizontalBounds(contentAreaBox, viewportBounds);
  const container = Element.fromDom(editor.getContainer());
  const header = SelectorFind.descendant(container, '.tox-editor-header').getOr(container);
  const headerBox = Boxes.box(header);

  const vpHeight = viewportBounds.height();
  const vpTop = viewportBounds.y();

  // Fixed toolbar container allows the toolbar to be above or below
  // so we need to constrain the overflow based on that
  if (headerBox.y() >= contentAreaBox.bottom()) {
    // Toolbar is below, so allow overflowing the top
    const bottom = Math.min(vpHeight + vpTop, headerBox.y());
    const height = bottom - vpTop;
    return Boxes.bounds(x, vpTop, width, height);
  } else {
    // Toolbar is above, so allow overflowing the bottom
    const y = Math.max(vpTop, headerBox.bottom());
    const height = vpHeight - (y - vpTop);
    return Boxes.bounds(x, y, width, height);

const getIframeBounds = (editor: Editor, contentAreaBox: Bounds, viewportBounds: Bounds): Bounds => {
  const { x, width } = getHorizontalBounds(contentAreaBox, viewportBounds);
  const container = Element.fromDom(editor.getContainer());
  const header = SelectorFind.descendant(container, '.tox-editor-header').getOr(container);
  const containerBox = Boxes.box(container);
  const headerBox = Boxes.box(header);

  const y = Math.max(viewportBounds.y(), contentAreaBox.y(), headerBox.bottom());
  // Use the container here, so that the statusbar is included
  const contentBoxHeight = containerBox.bottom() - y;
  const maxViewportHeight = viewportBounds.height() - (y - viewportBounds.y());
  const height = Math.min(contentBoxHeight, maxViewportHeight);

  return Boxes.bounds(x, y, width, height);
};

          lazyContext: () => Option.some(Boxes.box(Element.fromDom(editor.getContentAreaContainer()))),
          fadeInClass: 'tox-dialog-dock-fadein',