@maplibre/maplibre-react-native 10.0.0-alpha.21 → 10.0.0-alpha.22

package/scripts/{autogenHelpers → utils}/DocJSONBuilder.js

@@ -1,31 +1,31 @@
-const fs = require('fs');
-const path = require('path');
-const { exec } = require('child_process');
+const { exec } = require("child_process");
+const fs = require("fs");
+const dir = require("node-dir");
+const path = require("path");
+const docgen = require("react-docgen");
+const parseJsDoc = require("react-docgen/dist/utils/parseJsDoc").default;
 
-const dir = require('node-dir');
-const docgen = require('react-docgen');
-const parseJsDoc = require('react-docgen/dist/utils/parseJsDoc').default;
-
-const JSDocNodeTree = require('./JSDocNodeTree');
+const JSDocNodeTree = require("./JSDocNodeTree");
+const { pascalCase } = require("./template-globals");
 
 const COMPONENT_PATH = path.join(
   __dirname,
-  '..',
-  '..',
-  'javascript',
-  'components',
+  "..",
+  "..",
+  "javascript",
+  "components",
 );
-const MODULES_PATH = path.join(__dirname, '..', '..', 'javascript', 'modules');
+const MODULES_PATH = path.join(__dirname, "..", "..", "javascript", "modules");
 
-const OUTPUT_PATH = path.join(__dirname, '..', '..', 'docs', 'docs.json');
+const OUTPUT_PATH = path.join(__dirname, "..", "..", "docs", "docs.json");
 const IGNORE_FILES = [
-  'AbstractLayer',
-  'AbstractSource',
-  'NativeBridgeComponent',
+  "AbstractLayer",
+  "AbstractSource",
+  "NativeBridgeComponent",
 ];
 const IGNORE_PATTERN = /\.web\./;
 
-const IGNORE_METHODS = ['setNativeProps'];
+const IGNORE_METHODS = ["setNativeProps"];
 
 const fileExtensionsRegex = /.(js|tsx|(?<!d.)ts)$/;
 
@@ -34,12 +34,12 @@ class DocJSONBuilder {
     this._styledLayers = {};
 
     for (const styleLayer of styledLayers) {
-      let ComponentName = pascelCase(styleLayer.name);
-      const fakeLayers = ['Light', 'Atmosphere', 'Terrain'];
+      const ComponentName = pascalCase(styleLayer.name);
+      const fakeLayers = ["Light", "Atmosphere", "Terrain"];
       if (fakeLayers.includes(ComponentName)) {
         this._styledLayers[ComponentName] = styleLayer;
       } else {
-        this._styledLayers[ComponentName + 'Layer'] = styleLayer;
+        this._styledLayers[ComponentName + "Layer"] = styleLayer;
       }
     }
   }
@@ -52,8 +52,8 @@ class DocJSONBuilder {
     };
   }
 
-  isPrivateMethod(methodName = '') {
-    return !methodName || methodName.charAt(0) === '_';
+  isPrivateMethod(methodName = "") {
+    return !methodName || methodName.charAt(0) === "_";
   }
 
   postprocess(component, name) {
@@ -68,7 +68,7 @@ class DocJSONBuilder {
     // Main description
     component.description = component.description.replace(
       /(\n*)(@\w+) (\{.*})/g,
-      '',
+      "",
     );
 
     // Styles
@@ -91,11 +91,11 @@ class DocJSONBuilder {
           expression: prop.expression,
           transition: prop.transition,
         };
-        if (prop.type === 'enum') {
+        if (prop.type === "enum") {
           docStyle.values = Object.keys(prop.doc.values).map((value) => {
             return { value, doc: prop.doc.values[value].doc };
           });
-        } else if (prop.type === 'array') {
+        } else if (prop.type === "array") {
           docStyle.type = `${docStyle.type}<${prop.value}>`;
         }
 
@@ -123,21 +123,21 @@ class DocJSONBuilder {
         return null;
       }
 
-      if (tsType.name === 'signature') {
+      if (tsType.name === "signature") {
         if (tsType.raw.length < 200) {
           return `${tsType.raw
-            .replace(/(\n|\s)/g, '')
-            .replace(/(\|)/g, '\\|')}`;
+            .replace(/(\n|\s)/g, "")
+            .replace(/(\|)/g, "\\|")}`;
         } else {
-          return 'FIX ME FORMAT BIG OBJECT';
+          return "FIX ME FORMAT BIG OBJECT";
         }
-      } else if (tsType.name === 'union') {
+      } else if (tsType.name === "union") {
         if (tsType.raw) {
           // Props
-          return tsType.raw.replace(/\|/g, '\\|');
+          return tsType.raw.replace(/\|/g, "\\|");
         } else if (tsType.elements) {
           // Methods
-          return tsType.elements.map((e) => e.name).join(' \\| ');
+          return tsType.elements.map((e) => e.name).join(" \\| ");
         }
       } else {
         return tsType.name;
@@ -160,7 +160,7 @@ class DocJSONBuilder {
      * @returns {tsType is TSFunctionType}
      */
     function tsTypeIsFunction(tsType) {
-      return tsType.type === 'function';
+      return tsType.type === "function";
     }
 
     /**
@@ -168,7 +168,7 @@ class DocJSONBuilder {
      * @returns {tsType is TSObjectType}
      */
     function tsTypeIsObject(tsType) {
-      return tsType.type === 'object';
+      return tsType.type === "object";
     }
 
     /**
@@ -176,15 +176,15 @@ class DocJSONBuilder {
      */
     function tsTypeDump(tsType) {
       if (tsTypeIsFunction(tsType)) {
-        let { signature } = tsType;
+        const { signature } = tsType;
         return `(${signature.arguments
           .map(({ name, type }) => `${name}:${tsTypeDump(type)}`)
-          .join(', ')}) => ${tsTypeDump(signature.return)}`;
+          .join(", ")}) => ${tsTypeDump(signature.return)}`;
       } else if (tsTypeIsObject(tsType)) {
-        let { signature } = tsType;
+        const { signature } = tsType;
         return `{${signature.properties
           .map(({ key, value }) => `${key}: ${tsTypeDump(value)}`)
-          .join(', ')}}`;
+          .join(", ")}}`;
       } else {
         return tsType.name;
       }
@@ -195,7 +195,7 @@ class DocJSONBuilder {
         return null;
       }
 
-      if (tsType.name === 'signature' && tsType.type === 'object') {
+      if (tsType.name === "signature" && tsType.type === "object") {
         const { properties } = tsType.signature;
         if (properties) {
           const value = properties.map((kv) => {
@@ -205,23 +205,23 @@ class DocJSONBuilder {
               false,
             );
           });
-          return { name: 'shape', value };
+          return { name: "shape", value };
         } else if (tsType.raw.length < 200) {
           return `${tsType.raw
-            .replace(/(\n|\s)/g, '')
-            .replace(/(\|)/g, '\\|')}`;
+            .replace(/(\n|\s)/g, "")
+            .replace(/(\|)/g, "\\|")}`;
         } else {
-          return 'FIX ME FORMAT BIG OBJECT';
+          return "FIX ME FORMAT BIG OBJECT";
         }
-      } else if (tsType.name === 'signature' && tsType.type === 'function') {
-        return { name: 'func', funcSignature: tsTypeDump(tsType) };
-      } else if (tsType.name === 'union') {
+      } else if (tsType.name === "signature" && tsType.type === "function") {
+        return { name: "func", funcSignature: tsTypeDump(tsType) };
+      } else if (tsType.name === "union") {
         if (tsType.raw) {
           // Props
-          return tsType.raw.replace(/\|/g, '\\|');
+          return tsType.raw.replace(/\|/g, "\\|");
         } else if (tsType.elements) {
           // Methods
-          return tsType.elements.map((e) => e.name).join(' \\| ');
+          return tsType.elements.map((e) => e.name).join(" \\| ");
         }
       } else {
         return tsType.name;
@@ -232,20 +232,20 @@ class DocJSONBuilder {
       let result = {};
       if (!array) {
         result = {
-          name: propName || 'FIX ME NO NAME',
+          name: propName || "FIX ME NO NAME",
           required: propMeta.required || false,
           type:
             propMeta.type?.name ||
             tsTypeDescType(propMeta.tsType) ||
-            'FIX ME UNKNOWN TYPE',
+            "FIX ME UNKNOWN TYPE",
           default: !propMeta.defaultValue
-            ? 'none'
-            : propMeta.defaultValue.value.replace(/\n/g, ''),
-          description: propMeta.description || 'FIX ME NO DESCRIPTION',
+            ? "none"
+            : propMeta.defaultValue.value.replace(/\n/g, ""),
+          description: propMeta.description || "FIX ME NO DESCRIPTION",
         };
         if (
           result.type &&
-          result.type.name === 'func' &&
+          result.type.name === "func" &&
           result.type.funcSignature
         ) {
           result.description = `${result.description}\n*signature:*\`${result.type.funcSignature}\``;
@@ -260,9 +260,9 @@ class DocJSONBuilder {
         result.type =
           (propMeta.type && propMeta.type.name) ||
           tsTypeDescType(propMeta.tsType) ||
-          'FIX ME UNKNOWN TYPE';
+          "FIX ME UNKNOWN TYPE";
         if (propMeta.defaultValue) {
-          result.default = propMeta.defaultValue.value.replace(/\n/g, '');
+          result.default = propMeta.defaultValue.value.replace(/\n/g, "");
         }
         if (propMeta.description) {
           result.description = propMeta.description;
@@ -271,16 +271,16 @@ class DocJSONBuilder {
 
       if (
         propMeta.type &&
-        propMeta.type.name === 'arrayOf' &&
+        propMeta.type.name === "arrayOf" &&
         propMeta.type.value
       ) {
         result.type = {
-          name: 'array',
+          name: "array",
           value: mapProp(mapNestedProp(propMeta.type.value), undefined, true),
         };
       }
 
-      if (propMeta.type && propMeta.type.name === 'func') {
+      if (propMeta.type && propMeta.type.name === "func") {
         const jsdoc = parseJsDoc(propMeta.description);
         if (jsdoc && jsdoc.description) {
           result.description = jsdoc.description;
@@ -294,14 +294,14 @@ class DocJSONBuilder {
       }
       if (
         propMeta.type &&
-        propMeta.type.name === 'shape' &&
+        propMeta.type.name === "shape" &&
         propMeta.type.value
       ) {
         const type = propMeta.type.value;
         const value = Object.keys(type).map((_name) =>
           mapProp(mapNestedProp(type[_name]), _name, false),
         );
-        result.type = { name: 'shape', value };
+        result.type = { name: "shape", value };
       }
       return result;
     }
@@ -323,10 +323,10 @@ class DocJSONBuilder {
 
       if (method.docblock) {
         const examples = method.docblock
-          .split('@')
-          .filter((block) => block.startsWith('example'));
+          .split("@")
+          .filter((block) => block.startsWith("example"));
         method.examples = examples.map((example) =>
-          example.substring('example'.length),
+          example.substring("example".length),
         );
       }
     }
@@ -359,7 +359,7 @@ class DocJSONBuilder {
             return reject(err);
           }
 
-          let fileName = fileNameWithExt.replace(/\.(js|tsx|ts$)/, '');
+          let fileName = fileNameWithExt.replace(/\.(js|tsx|ts$)/, "");
           if (
             IGNORE_FILES.includes(fileName) ||
             fileName.match(IGNORE_PATTERN)
@@ -368,13 +368,13 @@ class DocJSONBuilder {
             return;
           }
 
-          let parsedComponents = docgen.parse(content, {
+          const parsedComponents = docgen.parse(content, {
             babelOptions: {
               filename: fileNameWithExt,
             },
           });
-          let [parsed] = parsedComponents;
-          fileName = fileName.replace(fileExtensionsRegex, '');
+          const [parsed] = parsedComponents;
+          fileName = fileName.replace(fileExtensionsRegex, "");
           parsed.fileNameWithExt = fileNameWithExt;
           results[fileName] = parsed;
 
@@ -404,7 +404,7 @@ class DocJSONBuilder {
               .charAt(0)
               .toLowerCase()}${module.name.substring(1)}`;
 
-            const pathParts = module.context.file.split('/');
+            const pathParts = module.context.file.split("/");
             const fileNameWithExt = pathParts[pathParts.length - 1];
 
             results[name] = {

package/scripts/{autogenHelpers → utils}/JSDocNodeTree.js

@@ -1,30 +1,33 @@
 class JSDocNodeTree {
-  constructor (root) {
+  constructor(root) {
     this._root = root;
   }
 
-  getChildrenByTag (node, tag) {
+  getChildrenByTag(node, tag) {
     if (!node || !Array.isArray(node.children)) {
       return [];
     }
     return node.children.filter((child) => child.type === tag);
   }
 
-  getName () {
+  getName() {
     if (!this._root) {
-      return '';
+      return "";
     }
     return this._root.namespace;
   }
 
-  getText () {
+  getText() {
     if (!this.hasChildren()) {
-      return '';
+      return "";
     }
 
-    let text = '';
-    for (let paragraph of this.getChildrenByTag(this._root.description, 'paragraph')) {
-      for (let textNode of this.getChildrenByTag(paragraph, 'text')) {
+    let text = "";
+    for (const paragraph of this.getChildrenByTag(
+      this._root.description,
+      "paragraph",
+    )) {
+      for (const textNode of this.getChildrenByTag(paragraph, "text")) {
         text += textNode.value;
       }
     }
@@ -32,14 +35,14 @@ class JSDocNodeTree {
     return text;
   }
 
-  getMethods () {
-    if (!this._hasArray(this._root.members, 'instance')) {
+  getMethods() {
+    if (!this._hasArray(this._root.members, "instance")) {
       return [];
     }
 
     const methods = [];
-    for (let field of this._root.members.instance) {
-      if (field.kind !== 'function' || this._isPrivateMethod(field)) {
+    for (const field of this._root.members.instance) {
+      if (field.kind !== "function" || this._isPrivateMethod(field)) {
         continue;
       }
 
@@ -56,14 +59,14 @@ class JSDocNodeTree {
     return methods;
   }
 
-  getMethodParams (field) {
-    if (!this._hasArray(field, 'params')) {
+  getMethodParams(field) {
+    if (!this._hasArray(field, "params")) {
       return [];
     }
 
     const methodParams = [];
-    for (let param of field.params) {
-      if (param.title !== 'param') {
+    for (const param of field.params) {
+      if (param.title !== "param") {
         continue;
       }
 
@@ -72,22 +75,22 @@ class JSDocNodeTree {
         name: param.name,
         description: node.getText(),
         type: { name: this.getType(param.type) },
-        optional: param.type.type === 'OptionalType',
-      })
+        optional: param.type.type === "OptionalType",
+      });
     }
 
     return methodParams;
   }
 
-  getExamples (field) {
-    if (!this._hasArray(field, 'examples')) {
+  getExamples(field) {
+    if (!this._hasArray(field, "examples")) {
       return [];
     }
     return field.examples.map((example) => example.description);
   }
 
-  getReturnValue (field) {
-    if (!this._hasArray(field, 'returns')) {
+  getReturnValue(field) {
+    if (!this._hasArray(field, "returns")) {
       return null;
     }
 
@@ -100,23 +103,23 @@ class JSDocNodeTree {
     };
   }
 
-  getType (typeNode) {
+  getType(typeNode) {
     if (!typeNode) {
-      return '';
+      return "";
     }
 
     if (typeNode.expression) {
       return typeNode.expression.name;
     }
 
-    return typeNode.name || '';
+    return typeNode.name || "";
   }
 
-  hasChildren () {
-    return this._hasArray(this._root.description, 'children');
+  hasChildren() {
+    return this._hasArray(this._root.description, "children");
   }
 
-  _hasArray (node, propName) {
+  _hasArray(node, propName) {
     if (!this._root) {
       return false;
     }
@@ -124,7 +127,7 @@ class JSDocNodeTree {
   }
 
   _isPrivateMethod(field) {
-    return field.name.charAt(0) === '_';
+    return field.name.charAt(0) === "_";
   }
 }
 

package/scripts/utils/MarkdownBuilder.js

@@ -0,0 +1,37 @@
+const ejs = require("ejs");
+const fs = require("fs");
+const path = require("path");
+
+const TMPL_PATH = path.join(__dirname, "..", "templates");
+const TMPL_FILE = fs.readFileSync(
+  path.join(TMPL_PATH, "component.md.ejs"),
+  "utf8",
+);
+
+class MarkdownBuilder {
+  generateComponentFile(docJSON, componentName) {
+    const tmpl = ejs.compile(TMPL_FILE, { strict: true });
+    const fileContents = tmpl({ component: docJSON[componentName] });
+    fs.writeFileSync(
+      path.join(__dirname, "..", "..", "docs", `${componentName}.md`),
+      fileContents,
+    );
+  }
+
+  generate() {
+    const docJSONFile = fs.readFileSync(
+      path.join(__dirname, "..", "..", "docs", "docs.json"),
+      "utf8",
+    );
+    const docJSON = JSON.parse(docJSONFile);
+    const componentPaths = Object.keys(docJSON);
+
+    for (const componentPath of componentPaths) {
+      this.generateComponentFile(docJSON, componentPath);
+    }
+
+    console.log("Markdown is finished generating");
+  }
+}
+
+module.exports = MarkdownBuilder;