mobility-toolbox-js 2.0.0-beta.2 → 2.0.0-beta.8

package/src/doc/components/Esdoc/SummaryHTML.js

@@ -0,0 +1,96 @@
+/* eslint-disable react/prop-types */
+/* eslint-disable react/no-array-index-key */
+/* eslint-disable no-underscore-dangle */
+import React, { useMemo } from 'react';
+import { _findAccessDocs, _find } from './DocBuilderUtils';
+import SummaryDoc from './SummaryDoc';
+
+const accessValues = ['public', 'protected', 'private'];
+
+/**
+ * build inherited method/member summary.
+ * https://github.com/esdoc/esdoc-plugins/blob/2de5022baa569785a189056a99acd1d7ca8284b7/esdoc-publish-html-plugin/src/Builder/ClassDocBuilder.js#L220
+ * @param {DocObject} doc - target class doc.
+ * @returns {string} html of inherited method/member from ancestor classes.
+ * @private
+ */
+function SummaryHTML({ doc, kind, title, isStatic = true, inherited = false }) {
+  const accessDocs = useMemo(() => {
+    const classDocs = _findAccessDocs(doc, kind, isStatic);
+
+    if (doc && ['class', 'interface'].indexOf(doc.kind) !== -1) {
+      const longnames = [
+        ...(doc._custom_extends_chains || []),
+        // ...doc.implements || [],
+        // ...doc._custom_indirect_implements || [],
+      ];
+
+      longnames
+        .map((longname) => _find({ longname })[0])
+        .forEach((classDoc) => {
+          // Add inherited methods or members.
+          if (classDoc && inherited) {
+            const docVals = _find({
+              memberof: classDoc.longname,
+              kind: [kind],
+              static: isStatic,
+            }).filter(
+              // We display only public classes
+              (v) => v.access === 'public' && !v.builtinExternal,
+            );
+
+            if (docVals.length) {
+              docVals.forEach((docV) => {
+                const idx = accessValues.indexOf(docV.access);
+                if (
+                  idx !== -1 &&
+                  !classDocs[idx][1].find((el) => el.name === docV.name)
+                ) {
+                  classDocs[idx][1].push(docV);
+                }
+              });
+            }
+          }
+        });
+    }
+
+    // Order alphabetically (by name) the members/methods.
+    return classDocs.map((cD) => {
+      /* eslint-disable no-param-reassign */
+      cD[1] = cD[1].sort((a, b) => {
+        if (a.name < b.name) {
+          return -1;
+        }
+        if (a.name > b.name) {
+          return 1;
+        }
+        return 0;
+      });
+      return cD;
+    });
+  }, [doc, kind, isStatic, inherited]);
+
+  return (
+    <>
+      {accessDocs.map((accessDoc, idx) => {
+        const docs = accessDoc[1];
+        if (!docs.length) return null;
+
+        let prefix = '';
+        if (docs[0].static) prefix = 'Static ';
+        const _title = `${prefix}${
+          accessDoc[0] === 'Public' ? '' : `${accessDoc[0]} `
+        }${title}`;
+        return (
+          <SummaryDoc
+            key={idx}
+            docs={docs}
+            title={_title}
+            memberof={doc && doc.memberof}
+          />
+        );
+      })}
+    </>
+  );
+}
+export default SummaryHTML;

package/src/doc/components/Esdoc/TypeDocLinkHTML.js

@@ -0,0 +1,249 @@
+/* eslint-disable prefer-destructuring */
+/* eslint-disable no-shadow */
+/* eslint-disable no-restricted-syntax */
+/* eslint-disable no-param-reassign */
+/* eslint-disable react/prop-types */
+/* eslint-disable react/no-array-index-key */
+import React from 'react';
+import DocLinkHTML from './DocLinkHTML';
+
+/**
+ * build html link of type.
+ * https://github.com/esdoc/esdoc-plugins/blob/2de5022baa569785a189056a99acd1d7ca8284b7/esdoc-publish-html-plugin/src/Builder/DocBuilder.js#L621
+ * @param {string} typeName - type name(e.g. ``number[]``, ``Map<number, string>``)
+ * @returns {string} html of link.
+ * @private
+ * @todo re-implement with parser combinator.
+ */
+function TypeDocLinkHTML({ typeName }) {
+  // e.g. number[]
+  let matched = typeName.match(/^(.*?)\[\]$/);
+  if (matched) {
+    typeName = matched[1];
+    return (
+      <span>
+        <DocLinkHTML longname={typeName} text={typeName} />
+        <span>[]</span>
+      </span>
+    );
+  }
+
+  // e.g. function(a: number, b: string): boolean
+  matched = typeName.match(/function *\((.*?)\)(.*)/);
+  if (matched) {
+    const functionLink = <DocLinkHTML longname="function" />;
+    if (!matched[1] && !matched[2])
+      return (
+        <span>
+          {functionLink}
+          <span>()</span>
+        </span>
+      );
+
+    let innerTypes = [];
+    if (matched[1]) {
+      // bad hack: Map.<string, boolean> => Map.<string\Z boolean>
+      // bad hack: {a: string, b: boolean} => {a\Y string\Z b\Y boolean}
+      const inner = matched[1]
+        .replace(/<.*?>/g, (a) => a.replace(/,/g, '\\Z'))
+        .replace(/{.*?}/g, (a) => a.replace(/,/g, '\\Z').replace(/:/g, '\\Y'));
+      innerTypes = inner.split(',').map((v) => {
+        const tmp = v.split(':').map((v) => v.trim());
+        if (tmp.length !== 2)
+          throw new SyntaxError(
+            `Invalid function type annotation: \`${matched[0]}\``,
+          );
+
+        const paramName = tmp[0];
+        const typeName = tmp[1].replace(/\\Z/g, ',').replace(/\\Y/g, ':');
+        return (
+          <>
+            {paramName}: <TypeDocLinkHTML typeName={typeName} />
+          </>
+        );
+      });
+    }
+
+    let returnType = '';
+    if (matched[2]) {
+      const type = matched[2].split(':')[1];
+
+      if (type)
+        returnType = (
+          <>
+            : <TypeDocLinkHTML typeName={type.trim()} />
+          </>
+        );
+    }
+
+    return (
+      <span>
+        {functionLink}
+        <span>
+          (
+          {innerTypes.map((comp, idx) => {
+            return (
+              <React.Fragment key={idx}>
+                {comp}
+                {idx !== innerTypes.length - 1 ? ', ' : ''}
+              </React.Fragment>
+            );
+          })}
+          )
+        </span>
+        {returnType}
+      </span>
+    );
+  }
+
+  // e.g. {a: number, b: string}
+  matched = typeName.match(/^\{(.*?)\}$/);
+  if (matched) {
+    if (!matched[1]) return '{}';
+
+    // bad hack: Map.<string, boolean> => Map.<string\Z boolean>
+    // bad hack: {a: string, b: boolean} => {a\Y string\Z b\Y boolean}
+    const inner = matched[1]
+      .replace(/<.*?>/g, (a) => a.replace(/,/g, '\\Z'))
+      .replace(/{.*?}/g, (a) => a.replace(/,/g, '\\Z').replace(/:/g, '\\Y'));
+
+    let broken = false;
+
+    const innerTypes = inner.split(',').map((v) => {
+      const tmp = v.split(':').map((v) => v.trim());
+
+      // edge case: if object key includes comma, this parsing is broken.
+      // e.g. {"a,b": 10}
+      // https://github.com/esdoc/esdoc-plugins/pull/49
+      if (!tmp[0] || !tmp[1]) {
+        broken = true;
+        return null;
+      }
+
+      const paramName = tmp[0];
+      let typeName = tmp[1].replace(/\\Z/g, ',').replace(/\\Y/g, ':');
+      if (typeName.includes('|')) {
+        typeName = typeName.replace(/^\(/, '').replace(/\)$/, '');
+        const typeNames = typeName.split('|').map((v) => v.trim());
+        const html = [];
+        for (const unionType of typeNames) {
+          html.push(<TypeDocLinkHTML typeName={unionType} />);
+        }
+        return (
+          <>
+            {paramName}:{' '}
+            {html.map((comp, idx) => {
+              return (
+                <React.Fragment key={idx}>
+                  {comp}
+                  {idx !== html.length - 1 ? '|' : ''}
+                </React.Fragment>
+              );
+            })}
+          </>
+        );
+      }
+      return (
+        <>
+          {paramName}: <TypeDocLinkHTML typeName={typeName} />
+        </>
+      );
+    });
+
+    if (broken) return `*`;
+
+    return (
+      <>
+        {`{`}
+        {innerTypes.map((comp, idx) => {
+          return (
+            <React.Fragment key={idx}>
+              {comp}
+              {idx !== innerTypes.length - 1 ? ', ' : ''}
+            </React.Fragment>
+          );
+        })}
+        {`}`}
+      </>
+    );
+  }
+
+  // e.g. Map<number, string>
+  matched = typeName.match(/^(.*?)\.?<(.*?)>$/);
+  if (matched) {
+    const mainType = matched[1];
+    // bad hack: Map.<string, boolean> => Map.<string\Z boolean>
+    // bad hack: {a: string, b: boolean} => {a\Y string\Z b\Y boolean}
+    const inner = matched[2]
+      .replace(/<.*?>/g, (a) => a.replace(/,/g, '\\Z'))
+      .replace(/{.*?}/g, (a) => a.replace(/,/g, '\\Z').replace(/:/g, '\\Y'));
+    const innerTypes = inner.split(',').map((v) => {
+      return v.split('|').map((vv, idx) => {
+        vv = vv.trim().replace(/\\Z/g, ',').replace(/\\Y/g, ':');
+        return (
+          <React.Fragment key={idx}>
+            <TypeDocLinkHTML typeName={vv} />
+            {idx !== v.split('|').length - 1 ? '|' : ''}
+          </React.Fragment>
+        );
+      });
+    });
+
+    const html = (
+      <>
+        <DocLinkHTML longname={mainType} text={mainType} />
+        {`<`}
+        {innerTypes.map((comp, idx) => {
+          return (
+            <React.Fragment key={idx}>
+              {comp}
+              {idx !== innerTypes.length - 1 ? ', ' : ''}
+            </React.Fragment>
+          );
+        })}
+        {`>`}
+      </>
+    );
+    return html;
+  }
+
+  if (typeName.indexOf('...') === 0) {
+    typeName = typeName.replace('...', '');
+    if (typeName.includes('|')) {
+      const typeNames = typeName.replace('(', '').replace(')', '').split('|');
+      const typeLinks = typeNames.map((v) => <DocLinkHTML longname={v} />);
+      return (
+        <>
+          ...(
+          {typeLinks.map((comp, idx) => {
+            return (
+              <React.Fragment key={idx}>
+                {comp}
+                {idx !== typeLinks.length - 1 ? '|' : ''}
+              </React.Fragment>
+            );
+          })}
+          )
+        </>
+      );
+    }
+    return (
+      <>
+        ...
+        <DocLinkHTML longname={typeName} />
+      </>
+    );
+  }
+  if (typeName.indexOf('?') === 0) {
+    typeName = typeName.replace('?', '');
+    return (
+      <>
+        ?
+        <DocLinkHTML longname={typeName} />
+      </>
+    );
+  }
+  return <DocLinkHTML longname={typeName} />;
+}
+
+export default React.memo(TypeDocLinkHTML);

package/src/doc/components/Esdoc/css/identifiers.css

@@ -0,0 +1,38 @@
+/* stylelint-disable */
+/* .identifiers-wrap {
+  display: flex;
+  align-items: flex-start;
+} */
+
+.identifier-dir-tree {
+  background: #fff;
+  border: solid 1px #ddd;
+  border-radius: 0.25em;
+  top: 52px;
+  position: -webkit-sticky;
+  position: sticky;
+  max-height: calc(100vh - 155px);
+  overflow-y: scroll;
+  min-width: 200px;
+  margin-left: 1em;
+}
+
+.identifier-dir-tree-header {
+  padding: 0.5em;
+  background-color: #fafafa;
+  border-bottom: solid 1px #ddd;
+}
+
+.identifier-dir-tree-content {
+  padding: 0 0.5em 0;
+}
+
+.identifier-dir-tree-content > div {
+  padding-top: 0.25em;
+  padding-bottom: 0.25em;
+}
+
+.identifier-dir-tree-content a {
+  color: inherit;
+}
+

package/src/doc/components/Esdoc/css/search.css

@@ -0,0 +1,76 @@
+/* stylelint-disable */
+/* search box */
+.search-box {
+  /* position: absolute;
+  top: 10px;
+  right: 50px; */
+  position: relative;
+  margin: 10px;
+  line-height: normal;
+  font-size: 12px;
+
+  /* Geops */
+  background: white;
+  margin: 20px 5px 10px !important;
+}
+
+.search-box img {
+  width: 20px;
+  vertical-align: top;
+}
+
+.esdoc .search-result {
+  position: absolute;
+  height: 600px;
+  width: 100%;
+  padding: 0;
+  margin-top: 5px;
+  margin-left: 24px;
+  background: white;
+  box-shadow: 1px 1px 4px rgb(0,0,0);
+  white-space: nowrap;
+  overflow-y: scroll;
+
+  /* Geops */
+  max-height: 300px;
+  min-width: 200px;
+  max-width: 500px;
+  width: auto;
+  margin-left: 0px;
+  height: auto;
+
+}
+
+.esdoc .search-result-import-path {
+  color: #aaa;
+  font-size: 12px;
+}
+
+.esdoc .search-result li {
+  list-style: none;
+  padding: 2px 4px;
+}
+
+.search-result li a {
+  display: block;
+}
+
+.search-result li.selected {
+  background: #ddd;
+}
+
+.search-result li.search-separator {
+  background: rgb(37, 138, 175);
+  color: white;
+}
+
+.search-box.active .search-input {
+  visibility: visible;
+  transition: width 0.2s ease-out;
+  /* Geops width: 300px; */
+}
+
+.search-box.active .search-input-edge {
+  display: inline-block;
+}
+