removeNodeFromDOMFlow = (
  childData: NodeData,
  verticalAlignment: VerticalAlignment,
) => {
  const { domNode, boundingBox } = childData;

  if (!domNode || !boundingBox) {
    return;
  }

  // For this to work, we have to offset any given `margin`.
  const computed: CSSStyleDeclaration = window.getComputedStyle(domNode);

  // We need to clean up margins, by converting and removing suffix:
  // eg. '21px' -> 21
  const marginAttrs = ['margin-top', 'margin-left', 'margin-right'];
  const margins: {
    [string]: number,
  } = marginAttrs.reduce((acc, margin) => {
    const propertyVal = computed.getPropertyValue(margin);

    return {
      ...acc,
      [margin]: Number(propertyVal.replace('px', '')),
    };
  }, {});

  // If we're bottom-aligned, we need to add the height of the child to its
  // top offset. This is because, when the container is bottom-aligned, its
  // height shrinks from the top, not the bottom. We're removing this node
  // from the flow, so the top is going to drop by its height.
  const topOffset =
    verticalAlignment === 'bottom'
      ? boundingBox.top - boundingBox.height
      : boundingBox.top;

  const styles: Styles = {
    position: 'absolute',
    top: `${topOffset - margins['margin-top']}px`,
    left: `${boundingBox.left - margins['margin-left']}px`,
    right: `${boundingBox.right - margins['margin-right']}px`,
  };

  applyStylesToDOMNode({ domNode, styles });
}
removeNodeFromDOMFlow
This method does something very sneaky: it removes a DOM node from the
document flow, but without actually changing its on-screen position.

It works by calculating where the node is, and then applying styles
so that it winds up being positioned absolutely, but in exactly the
same place.

This is a vital part of the FLIP technique.