Function createObjectNode

src/lib/table/createNode.ts:187–238

* Creates a `TableNode` for a JSON object. This function arranges the key-value pairs * into a two-column layout. The first column contains the keys, and the second column * contains the values. If a value is a nested object or array, it is represented by a * `dummy` node that will be recursively

(ctx: CreateContext, tree: Tree, node: Node)

 * @param node The JSON `Node` representing the object.
 */
function createObjectNode(ctx: CreateContext, tree: Tree, node: Node): TableNode {
  let maxKeyWidth = 0;
  let maxValWidth = 0;
  let span = 0;
  let maxSpan = 0;

  const childCnt = node.childrenKeys?.length || 0;
  // Generate a key and a value node for each child property.
  const kvNodes = tree.mapChildren(node, (child, key, idx) => {
    const newCtx = { ...ctx, row: ctx.row + span };
    const isFirst = idx === 0;
    const isLast = idx === childCnt - 1;

    const keyNode = newNode(newCtx, "key")
      .setText(key || '""')
      .addClass(key ? "text-hl-key" : "text-hl-empty")
      .setId(child.id)
      .setBorderFlag("left")
      .setBorderFlag(isFirst ? "top" : "")
      .setBorderFlag(isLast ? "bottom" : "");
    const valNode = createNode(newCtx, tree, child)
      .setBorderFlag("right")
      .setBorderFlag(isFirst ? "top" : "")
      .setBorderFlag(isLast ? "bottom" : "");

    span += valNode.span;
    maxSpan = Math.max(maxSpan, valNode.span);
    maxKeyWidth = Math.max(maxKeyWidth, keyNode.width);
    maxValWidth = Math.max(maxValWidth, valNode.width);
    return { keyNode, valNode };
  });

  const parent = newNode(ctx, "leftHeaderTable");
  const heads = kvNodes.map(({ keyNode, valNode }, i) => {
    valNode
      .setWidth(maxValWidth)
      .setParent(parent)
      .setUp(kvNodes?.[i - 1]?.valNode);
    keyNode
      .setRight(valNode)
      .setSpan(valNode.span)
      .setWidth(maxKeyWidth)
      .setParent(parent)
      .setUp(kvNodes?.[i - 1]?.keyNode);
    return keyNode;
  });

  return parent
    .setWidth(maxKeyWidth + maxValWidth)
    .setSpan(span)
    .setHeads(heads);
}

function newNode(ctx: CreateContext, type: TableNodeType, id?: string) {
  return new TableNode(type)