jevstrudel.git / website / src / docs / ApiDoc.jsx
ApiDoc.jsx60 lines · 2.1 KB · raw
1import React, { Fragment } from 'react';
2import { docs } from '../../../doc.json';
3import { MiniRepl } from '../../../tutorial/MiniRepl';
4
5const visible = window.location.href.includes('?api=true');
6
7function ApiDoc() {
8  if (!visible) {
9    return (
10      <p>
11        There remaining function documentation is a work in progress, but you can preview it by clicking{' '}
12        <a href="?api=true#everything-else">here</a>. Beware that everything is not properly ordered from this point.
13      </p>
14    );
15  }
16  // console.log('docJson', docs);
17  return (
18    <div>
19      <p>
20        The following Chapter is autogenerated from the jsdoc comments in the source files.{' '}
21        <a href="?#everything-else">hide</a>. Beware that everything is not properly ordered from this point.
22      </p>
23      {docs
24        .filter((item) => !item.name?.startsWith('_') && item.kind !== 'package')
25        .map((item, i) => (
26          <Fragment key={i}>
27            {' '}
28            <h2 id={`${item.memberof ? `${item.memberof}-` : ''}${item.name}`}>
29              {item.memberof && item.memberof !== item.name ? `${item.memberof}.` : ''}
30              {item.name}
31            </h2>
32            <div
33              dangerouslySetInnerHTML={{
34                __html: item.description.replaceAll(/\{\@link ([a-zA-Z]+)?\#?([a-zA-Z]*)\}/g, (_, a, b) => {
35                  // console.log(_, 'a', a, 'b', b);
36                  return `<a href="#${a}${b ? `-${b}` : ''}">${a}${b ? `#${b}` : ''}</a>`;
37                }),
38              }}
39            />
40            {!!item.params?.length && <h3>Parameters</h3>}
41            <ul>
42              {item.params?.map((param, i) => (
43                <li key={i}>
44                  {param.name} ({param.type?.names?.join('|')}): {param.description?.replace(/(<([^>]+)>)/gi, '')}
45                </li>
46              ))}
47            </ul>
48            {item.examples?.length && <h3>Examples</h3>}
49            <div className="space-y-2">
50              {item.examples?.map((example, k) => (
51                <MiniRepl key={k} tune={example} />
52              ))}
53            </div>
54          </Fragment>
55        ))}
56    </div>
57  );
58}
59
60export default ApiDoc;