1import jsdoc from '../../../doc.json'; // doc.json is built with `npm run jsdoc-json`
2const docs = jsdoc.docs.reduce((acc, obj) => Object.assign(acc, { [obj.longname]: obj }), {});
3import { MiniRepl } from './MiniRepl';
4
5export function JsDoc({ name, h = 3, hideDescription, punchcard, canvasHeight }) {
6  const item = docs[name];
7  if (!item) {
8    console.warn('Not found: ' + name);
9    return <div />;
10  }
11  const CustomHeading = `h${h}`;
12  const description =
13    item.description?.replaceAll(/\{@link ([a-zA-Z\.]+)?#?([a-zA-Z]*)\}/g, (_, a, b) => {
14      return `<a href="#${a.replaceAll('.', '').toLowerCase()}${b ? `-${b}` : ''}">${a}${b ? `#${b}` : ''}</a>`;
15    }) || '';
16  return (
17    <>
18      {!!h && <CustomHeading>{item.longname}</CustomHeading>}
19      {!hideDescription && (
20        <>
21          {!!item.synonyms_text && (
22            <span>
23              Synonyms: <code>{item.synonyms_text}</code>
24            </span>
25          )}
26          <div dangerouslySetInnerHTML={{ __html: description }} />
27        </>
28      )}
29      <ul>
30        {item.params?.map((param, i) => (
31          <li key={i}>
32            {param.name} ({param.type?.names?.join('|')}): {param.description?.replace(/(<([^>]+)>)/gi, '')}
33          </li>
34        ))}
35      </ul>
36
37      {item.examples?.length ? (
38        <div className="space-y-2">
39          {item.examples?.map((example, k) => (
40            <MiniRepl tune={example} key={k} {...{ punchcard, canvasHeight }} />
41          ))}
42        </div>
43      ) : (
44        <div />
45      )}
46    </>
47  );
48}