Tab scrolling while in edit mode

[Borvik]

Ideas:

While in edit mode, 5 ways to tab?

Tab = Normal tabbing, next element in row Shift + Tab = Normal reverse tabbing, like previous Ctrl + Tab = Tab down the column (bottom goes to top of next) Shift + Ctrl + Tab = Tab Up the column (top goes to bottom of prev) Ctrl + Alt + Arrow = Tab in direction of arrow press

Should scroll horizontally or vertically only if needed (depending on the tab action)

perliminary:

const OVERFLOW_REGEX = /(auto|scroll)/;

export function getScrollParent(node?: Element | null): Element {
  if (!node) return document.body;

  let style = getComputedStyle(node);
  let excludeStaticParent = (style.position === 'absolute');

  if (style.position === 'fixed') return document.body;
  for (let parent = node.parentElement; (parent = parent?.parentElement ?? null);) {
    style = getComputedStyle(parent);
    if (excludeStaticParent && style.position === 'static') {
      continue;
    }
    if (OVERFLOW_REGEX.test(style.overflow + style.overflowY + style.overflowX)) {
      return parent;
    }
  }
  return document.body;
}

export function scrollElementIntoView(node: Element): void {
  if (!node) throw new Error('Cannot check view status of null or undefined');

  const scrollParent = getScrollParent(node);
  const nodeRect = node.getBoundingClientRect();
  const parentRect = scrollParent.getBoundingClientRect();

  const scrollX = (
    nodeRect.left >= 0 &&
    nodeRect.right <= parentRect.right
  );
  const scrollY = (
    nodeRect.top >= 0 &&
    nodeRect.bottom <= parentRect.bottom
  );

  // TODO: ACCOUNT FOR table fixed columns

  if (!scrollY && !scrollX) {
    console.log({ nodeRect, parentRect, node, scrollParent });
    console.log('SCROLL BOTH');
  }
  else if (!scrollY) {
    console.log({ nodeRect, parentRect, node, scrollParent });
    console.log('SCROLL VERT');
  }
  else if (!scrollX) {
    console.log({ nodeRect, parentRect, node, scrollParent });
    console.log('SCROLL HORZ');
  } else {
    console.log({ nodeRect, parentRect, node, scrollParent });
    console.log('NO SCROLL');
  }
}