, and apply responsive
16 | // data attributes
17 | if (node.tagName === 'table') {
18 | if (parent) {
19 | parent.children[index] = {
20 | type: 'element',
21 | tagName: 'div',
22 | properties: { className: ['overflow-container'] },
23 | children: [node],
24 | };
25 | }
26 |
27 | // Not every table will have a header, so only do this on tables
28 | // with them.
29 | const thead = node.children.find(el => el.tagName === 'thead');
30 |
31 | if (thead) {
32 | const headers = thead.children[0].children.map(toString);
33 | const tbody = node.children.find(el => el.tagName === 'tbody');
34 |
35 | visit(
36 | tbody,
37 | node => node.tagName === 'td',
38 | (node, index) => (node.properties['data-label'] = headers[index])
39 | );
40 | }
41 | }
42 | });
43 |
44 | // Are there footnotes?
45 | if (tree.children.at(-1).tagName === 'section') {
46 | const section = tree.children.pop();
47 | // If so, move it into the proper location
48 | // Root -> Article -> Main content
49 | tree.children[2]?.children[1]?.children[0]?.children?.push(
50 | ...section.children
51 | );
52 | }
53 | };
54 |
55 | /**
56 | * Transforms elements in a syntax tree by replacing tag names according to the mapping.
57 | *
58 | * Also moves any generated root section into its proper location in the AST.
59 | */
60 | export default () => transformer;
61 |
--------------------------------------------------------------------------------
/src/generators/legacy-html-all/index.mjs:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | import { readFile, writeFile } from 'node:fs/promises';
4 | import { join, resolve } from 'node:path';
5 |
6 | import HTMLMinifier from '@minify-html/node';
7 |
8 | import { getRemarkRehype } from '../../utils/remark.mjs';
9 | import { replaceTemplateValues } from '../legacy-html/utils/replaceTemplateValues.mjs';
10 | import tableOfContents from '../legacy-html/utils/tableOfContents.mjs';
11 |
12 | /**
13 | * This generator generates the legacy HTML pages of the legacy API docs
14 | * for retro-compatibility and while we are implementing the new 'react' and 'html' generators.
15 | *
16 | * This generator is a top-level generator, and it takes the raw AST tree of the API doc files
17 | * and generates the HTML files to the specified output directory from the configuration settings
18 | *
19 | * @typedef {Array
} Input
20 | *
21 | * @type {GeneratorMetadata}
22 | */
23 | export default {
24 | name: 'legacy-html-all',
25 |
26 | version: '1.0.0',
27 |
28 | description:
29 | 'Generates the `all.html` file from the `legacy-html` generator, which includes all the modules in one single file',
30 |
31 | dependsOn: 'legacy-html',
32 |
33 | /**
34 | * Generates the `all.html` file from the `legacy-html` generator
35 | * @param {Input} input
36 | * @param {Partial} options
37 | * @returns {Promise}
38 | */
39 | async generate(input, { version, releases, output }) {
40 | // Gets a Remark Processor that parses Markdown to minified HTML
41 | const remarkWithRehype = getRemarkRehype();
42 |
43 | // Current directory path relative to the `index.mjs` file
44 | // from the `legacy-html` generator, as all the assets are there
45 | const baseDir = resolve(import.meta.dirname, '..', 'legacy-html');
46 |
47 | // Reads the API template.html file to be used as a base for the HTML files
48 | const apiTemplate = await readFile(join(baseDir, 'template.html'), 'utf-8');
49 |
50 | // Filter out index entries and extract needed properties
51 | const entries = input.filter(entry => entry.api !== 'index');
52 |
53 | // Aggregates all individual Table of Contents into one giant string
54 | const aggregatedToC = entries.map(entry => entry.toc).join('\n');
55 |
56 | // Aggregates all individual content into one giant string
57 | const aggregatedContent = entries.map(entry => entry.content).join('\n');
58 |
59 | // Creates a "mimic" of an `ApiDocMetadataEntry` which fulfils the requirements
60 | // for generating the `tableOfContents` with the `tableOfContents.parseNavigationNode` parser
61 | const sideNavigationFromValues = entries.map(entry => ({
62 | api: entry.api,
63 | heading: { data: { depth: 1, name: entry.section } },
64 | }));
65 |
66 | // Generates the global Table of Contents (Sidebar Navigation)
67 | const parsedSideNav = remarkWithRehype.processSync(
68 | tableOfContents(sideNavigationFromValues, {
69 | maxDepth: 1,
70 | parser: tableOfContents.parseNavigationNode,
71 | })
72 | );
73 |
74 | const templateValues = {
75 | api: 'all',
76 | added: '',
77 | section: 'All',
78 | version: `v${version.version}`,
79 | toc: aggregatedToC,
80 | nav: String(parsedSideNav),
81 | content: aggregatedContent,
82 | };
83 |
84 | const result = replaceTemplateValues(
85 | apiTemplate,
86 | templateValues,
87 | releases,
88 | { skipGitHub: true, skipGtocPicker: true }
89 | );
90 |
91 | // We minify the html result to reduce the file size and keep it "clean"
92 | const minified = HTMLMinifier.minify(Buffer.from(result), {});
93 |
94 | if (output) {
95 | await writeFile(join(output, 'all.html'), minified);
96 | }
97 |
98 | return minified;
99 | },
100 | };
101 |
--------------------------------------------------------------------------------
/src/generators/legacy-html/assets/js-flavor-cjs.svg:
--------------------------------------------------------------------------------
1 |
5 |
6 |
--------------------------------------------------------------------------------
/src/generators/legacy-html/assets/js-flavor-esm.svg:
--------------------------------------------------------------------------------
1 |
5 |
6 |
--------------------------------------------------------------------------------
/src/generators/legacy-html/types.d.ts:
--------------------------------------------------------------------------------
1 | export interface TemplateValues {
2 | api: string;
3 | added: string;
4 | section: string;
5 | version: string;
6 | toc: string;
7 | nav: string;
8 | content: string;
9 | }
10 |
--------------------------------------------------------------------------------
/src/generators/legacy-html/utils/buildDropdowns.mjs:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | import { DOC_API_BLOB_EDIT_BASE_URL } from '../../../constants.mjs';
4 | import {
5 | getCompatibleVersions,
6 | getVersionFromSemVer,
7 | getVersionURL,
8 | } from '../../../utils/generators.mjs';
9 |
10 | /**
11 | * Builds the Dropdown for the current Table of Contents
12 | *
13 | * Note.: We use plain strings here instead of HAST, since these are just
14 | * templates and not actual content that needs to be transformed.
15 | *
16 | * @param {string} tableOfContents The stringified ToC
17 | */
18 | export const buildToC = tableOfContents => {
19 | if (tableOfContents.length) {
20 | return (
21 | `
7 | 
21 |
22 |
23 |