All files / src/CodeViewer/utils astToReact.ts

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
3x
 
 
 
 
40x
16x
 
 
 
 
 
 
 
 
 
 
24x
 
 
3x
18x
40x
 
 
 
import { createElement, ReactNode } from 'react';
import { RefractorNode } from 'refractor/core';
 
// based on https://github.com/rexxars/react-lowlight/blob/master/src/mapChildren.js
function mapChild(child: RefractorNode, i: number, depth: number): ReactNode {
  if ('tagName' in child) {
    return createElement(
      child.tagName,
      {
        key: `cv-${depth}-${i}`,
        ...child.properties,
        className: child.properties && (child.properties.className || []).join(' '),
      },
      child.children && child.children.map(astToReact(depth + 1)),
    );
  }
 
  return child.value;
}
 
export function astToReact(depth: number = 0) {
  return function mapChildrenWithDepth(child: RefractorNode, i: number) {
    return mapChild(child, i, depth);
  };
}