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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (49) hide show
  1. package/.eslintrc.js +5 -0
  2. package/.git-blame-ignore-revs +3 -0
  3. package/CHANGELOG.md +21 -0
  4. package/CONTRIBUTING.md +20 -14
  5. package/README.md +12 -13
  6. package/android/install.md +3 -2
  7. package/app.plugin.js +1 -1
  8. package/babel.config.js +6 -3
  9. package/docs/Camera.md +1 -1
  10. package/docs/GettingStarted.md +3 -4
  11. package/docs/MapView.md +1 -1
  12. package/docs/ShapeSource.md +3 -3
  13. package/docs/docs.json +15 -15
  14. package/ios/RCTMLN.xcodeproj/project.pbxproj +1 -775
  15. package/ios/install.md +1 -1
  16. package/javascript/components/Camera.tsx +8 -8
  17. package/javascript/components/MapView.tsx +4 -6
  18. package/javascript/components/MarkerView.tsx +2 -2
  19. package/javascript/components/PointAnnotation.tsx +2 -2
  20. package/javascript/components/ShapeSource.tsx +29 -28
  21. package/javascript/components/Style.tsx +1 -1
  22. package/javascript/modules/offline/OfflineCreatePackOptions.ts +2 -9
  23. package/javascript/modules/snapshot/SnapshotOptions.ts +4 -5
  24. package/javascript/utils/StyleValue.ts +3 -1
  25. package/javascript/utils/makeNativeBounds.ts +5 -0
  26. package/jest-setup.ts +113 -0
  27. package/jest.config.js +8 -0
  28. package/maplibre-react-native.podspec +7 -7
  29. package/package.json +30 -73
  30. package/plugin/build/withMapLibre.js +16 -1
  31. package/plugin/install.md +1 -8
  32. package/react-native.config.js +1 -1
  33. package/scripts/.eslintrc.js +3 -0
  34. package/scripts/{autogenerate.js → generate-docs.js} +144 -137
  35. package/scripts/templates/MaplibreStyles.ts.ejs +5 -5
  36. package/scripts/templates/RCTMLNStyle.h.ejs +2 -2
  37. package/scripts/templates/RCTMLNStyle.m.ejs +6 -6
  38. package/scripts/templates/RCTMLNStyleFactory.java.ejs +8 -8
  39. package/scripts/{autogenHelpers → utils}/DocJSONBuilder.js +70 -70
  40. package/scripts/{autogenHelpers → utils}/JSDocNodeTree.js +33 -30
  41. package/scripts/utils/MarkdownBuilder.js +37 -0
  42. package/scripts/utils/template-globals.js +528 -0
  43. package/style-spec/v8.json +32 -1
  44. package/tsconfig.json +2 -2
  45. package/assets/mapbox_logo.png +0 -0
  46. package/javascript/utils/geoUtils.ts +0 -79
  47. package/scripts/autogenHelpers/MarkdownBuilder.js +0 -29
  48. package/scripts/autogenHelpers/globals.js +0 -508
  49. package/setup-jest.js +0 -108
@@ -1,31 +1,31 @@
1
- const fs = require('fs');
2
- const path = require('path');
3
- const { exec } = require('child_process');
1
+ const { exec } = require("child_process");
2
+ const fs = require("fs");
3
+ const dir = require("node-dir");
4
+ const path = require("path");
5
+ const docgen = require("react-docgen");
6
+ const parseJsDoc = require("react-docgen/dist/utils/parseJsDoc").default;
4
7
 
5
- const dir = require('node-dir');
6
- const docgen = require('react-docgen');
7
- const parseJsDoc = require('react-docgen/dist/utils/parseJsDoc').default;
8
-
9
- const JSDocNodeTree = require('./JSDocNodeTree');
8
+ const JSDocNodeTree = require("./JSDocNodeTree");
9
+ const { pascalCase } = require("./template-globals");
10
10
 
11
11
  const COMPONENT_PATH = path.join(
12
12
  __dirname,
13
- '..',
14
- '..',
15
- 'javascript',
16
- 'components',
13
+ "..",
14
+ "..",
15
+ "javascript",
16
+ "components",
17
17
  );
18
- const MODULES_PATH = path.join(__dirname, '..', '..', 'javascript', 'modules');
18
+ const MODULES_PATH = path.join(__dirname, "..", "..", "javascript", "modules");
19
19
 
20
- const OUTPUT_PATH = path.join(__dirname, '..', '..', 'docs', 'docs.json');
20
+ const OUTPUT_PATH = path.join(__dirname, "..", "..", "docs", "docs.json");
21
21
  const IGNORE_FILES = [
22
- 'AbstractLayer',
23
- 'AbstractSource',
24
- 'NativeBridgeComponent',
22
+ "AbstractLayer",
23
+ "AbstractSource",
24
+ "NativeBridgeComponent",
25
25
  ];
26
26
  const IGNORE_PATTERN = /\.web\./;
27
27
 
28
- const IGNORE_METHODS = ['setNativeProps'];
28
+ const IGNORE_METHODS = ["setNativeProps"];
29
29
 
30
30
  const fileExtensionsRegex = /.(js|tsx|(?<!d.)ts)$/;
31
31
 
@@ -34,12 +34,12 @@ class DocJSONBuilder {
34
34
  this._styledLayers = {};
35
35
 
36
36
  for (const styleLayer of styledLayers) {
37
- let ComponentName = pascelCase(styleLayer.name);
38
- const fakeLayers = ['Light', 'Atmosphere', 'Terrain'];
37
+ const ComponentName = pascalCase(styleLayer.name);
38
+ const fakeLayers = ["Light", "Atmosphere", "Terrain"];
39
39
  if (fakeLayers.includes(ComponentName)) {
40
40
  this._styledLayers[ComponentName] = styleLayer;
41
41
  } else {
42
- this._styledLayers[ComponentName + 'Layer'] = styleLayer;
42
+ this._styledLayers[ComponentName + "Layer"] = styleLayer;
43
43
  }
44
44
  }
45
45
  }
@@ -52,8 +52,8 @@ class DocJSONBuilder {
52
52
  };
53
53
  }
54
54
 
55
- isPrivateMethod(methodName = '') {
56
- return !methodName || methodName.charAt(0) === '_';
55
+ isPrivateMethod(methodName = "") {
56
+ return !methodName || methodName.charAt(0) === "_";
57
57
  }
58
58
 
59
59
  postprocess(component, name) {
@@ -68,7 +68,7 @@ class DocJSONBuilder {
68
68
  // Main description
69
69
  component.description = component.description.replace(
70
70
  /(\n*)(@\w+) (\{.*})/g,
71
- '',
71
+ "",
72
72
  );
73
73
 
74
74
  // Styles
@@ -91,11 +91,11 @@ class DocJSONBuilder {
91
91
  expression: prop.expression,
92
92
  transition: prop.transition,
93
93
  };
94
- if (prop.type === 'enum') {
94
+ if (prop.type === "enum") {
95
95
  docStyle.values = Object.keys(prop.doc.values).map((value) => {
96
96
  return { value, doc: prop.doc.values[value].doc };
97
97
  });
98
- } else if (prop.type === 'array') {
98
+ } else if (prop.type === "array") {
99
99
  docStyle.type = `${docStyle.type}<${prop.value}>`;
100
100
  }
101
101
 
@@ -123,21 +123,21 @@ class DocJSONBuilder {
123
123
  return null;
124
124
  }
125
125
 
126
- if (tsType.name === 'signature') {
126
+ if (tsType.name === "signature") {
127
127
  if (tsType.raw.length < 200) {
128
128
  return `${tsType.raw
129
- .replace(/(\n|\s)/g, '')
130
- .replace(/(\|)/g, '\\|')}`;
129
+ .replace(/(\n|\s)/g, "")
130
+ .replace(/(\|)/g, "\\|")}`;
131
131
  } else {
132
- return 'FIX ME FORMAT BIG OBJECT';
132
+ return "FIX ME FORMAT BIG OBJECT";
133
133
  }
134
- } else if (tsType.name === 'union') {
134
+ } else if (tsType.name === "union") {
135
135
  if (tsType.raw) {
136
136
  // Props
137
- return tsType.raw.replace(/\|/g, '\\|');
137
+ return tsType.raw.replace(/\|/g, "\\|");
138
138
  } else if (tsType.elements) {
139
139
  // Methods
140
- return tsType.elements.map((e) => e.name).join(' \\| ');
140
+ return tsType.elements.map((e) => e.name).join(" \\| ");
141
141
  }
142
142
  } else {
143
143
  return tsType.name;
@@ -160,7 +160,7 @@ class DocJSONBuilder {
160
160
  * @returns {tsType is TSFunctionType}
161
161
  */
162
162
  function tsTypeIsFunction(tsType) {
163
- return tsType.type === 'function';
163
+ return tsType.type === "function";
164
164
  }
165
165
 
166
166
  /**
@@ -168,7 +168,7 @@ class DocJSONBuilder {
168
168
  * @returns {tsType is TSObjectType}
169
169
  */
170
170
  function tsTypeIsObject(tsType) {
171
- return tsType.type === 'object';
171
+ return tsType.type === "object";
172
172
  }
173
173
 
174
174
  /**
@@ -176,15 +176,15 @@ class DocJSONBuilder {
176
176
  */
177
177
  function tsTypeDump(tsType) {
178
178
  if (tsTypeIsFunction(tsType)) {
179
- let { signature } = tsType;
179
+ const { signature } = tsType;
180
180
  return `(${signature.arguments
181
181
  .map(({ name, type }) => `${name}:${tsTypeDump(type)}`)
182
- .join(', ')}) => ${tsTypeDump(signature.return)}`;
182
+ .join(", ")}) => ${tsTypeDump(signature.return)}`;
183
183
  } else if (tsTypeIsObject(tsType)) {
184
- let { signature } = tsType;
184
+ const { signature } = tsType;
185
185
  return `{${signature.properties
186
186
  .map(({ key, value }) => `${key}: ${tsTypeDump(value)}`)
187
- .join(', ')}}`;
187
+ .join(", ")}}`;
188
188
  } else {
189
189
  return tsType.name;
190
190
  }
@@ -195,7 +195,7 @@ class DocJSONBuilder {
195
195
  return null;
196
196
  }
197
197
 
198
- if (tsType.name === 'signature' && tsType.type === 'object') {
198
+ if (tsType.name === "signature" && tsType.type === "object") {
199
199
  const { properties } = tsType.signature;
200
200
  if (properties) {
201
201
  const value = properties.map((kv) => {
@@ -205,23 +205,23 @@ class DocJSONBuilder {
205
205
  false,
206
206
  );
207
207
  });
208
- return { name: 'shape', value };
208
+ return { name: "shape", value };
209
209
  } else if (tsType.raw.length < 200) {
210
210
  return `${tsType.raw
211
- .replace(/(\n|\s)/g, '')
212
- .replace(/(\|)/g, '\\|')}`;
211
+ .replace(/(\n|\s)/g, "")
212
+ .replace(/(\|)/g, "\\|")}`;
213
213
  } else {
214
- return 'FIX ME FORMAT BIG OBJECT';
214
+ return "FIX ME FORMAT BIG OBJECT";
215
215
  }
216
- } else if (tsType.name === 'signature' && tsType.type === 'function') {
217
- return { name: 'func', funcSignature: tsTypeDump(tsType) };
218
- } else if (tsType.name === 'union') {
216
+ } else if (tsType.name === "signature" && tsType.type === "function") {
217
+ return { name: "func", funcSignature: tsTypeDump(tsType) };
218
+ } else if (tsType.name === "union") {
219
219
  if (tsType.raw) {
220
220
  // Props
221
- return tsType.raw.replace(/\|/g, '\\|');
221
+ return tsType.raw.replace(/\|/g, "\\|");
222
222
  } else if (tsType.elements) {
223
223
  // Methods
224
- return tsType.elements.map((e) => e.name).join(' \\| ');
224
+ return tsType.elements.map((e) => e.name).join(" \\| ");
225
225
  }
226
226
  } else {
227
227
  return tsType.name;
@@ -232,20 +232,20 @@ class DocJSONBuilder {
232
232
  let result = {};
233
233
  if (!array) {
234
234
  result = {
235
- name: propName || 'FIX ME NO NAME',
235
+ name: propName || "FIX ME NO NAME",
236
236
  required: propMeta.required || false,
237
237
  type:
238
238
  propMeta.type?.name ||
239
239
  tsTypeDescType(propMeta.tsType) ||
240
- 'FIX ME UNKNOWN TYPE',
240
+ "FIX ME UNKNOWN TYPE",
241
241
  default: !propMeta.defaultValue
242
- ? 'none'
243
- : propMeta.defaultValue.value.replace(/\n/g, ''),
244
- description: propMeta.description || 'FIX ME NO DESCRIPTION',
242
+ ? "none"
243
+ : propMeta.defaultValue.value.replace(/\n/g, ""),
244
+ description: propMeta.description || "FIX ME NO DESCRIPTION",
245
245
  };
246
246
  if (
247
247
  result.type &&
248
- result.type.name === 'func' &&
248
+ result.type.name === "func" &&
249
249
  result.type.funcSignature
250
250
  ) {
251
251
  result.description = `${result.description}\n*signature:*\`${result.type.funcSignature}\``;
@@ -260,9 +260,9 @@ class DocJSONBuilder {
260
260
  result.type =
261
261
  (propMeta.type && propMeta.type.name) ||
262
262
  tsTypeDescType(propMeta.tsType) ||
263
- 'FIX ME UNKNOWN TYPE';
263
+ "FIX ME UNKNOWN TYPE";
264
264
  if (propMeta.defaultValue) {
265
- result.default = propMeta.defaultValue.value.replace(/\n/g, '');
265
+ result.default = propMeta.defaultValue.value.replace(/\n/g, "");
266
266
  }
267
267
  if (propMeta.description) {
268
268
  result.description = propMeta.description;
@@ -271,16 +271,16 @@ class DocJSONBuilder {
271
271
 
272
272
  if (
273
273
  propMeta.type &&
274
- propMeta.type.name === 'arrayOf' &&
274
+ propMeta.type.name === "arrayOf" &&
275
275
  propMeta.type.value
276
276
  ) {
277
277
  result.type = {
278
- name: 'array',
278
+ name: "array",
279
279
  value: mapProp(mapNestedProp(propMeta.type.value), undefined, true),
280
280
  };
281
281
  }
282
282
 
283
- if (propMeta.type && propMeta.type.name === 'func') {
283
+ if (propMeta.type && propMeta.type.name === "func") {
284
284
  const jsdoc = parseJsDoc(propMeta.description);
285
285
  if (jsdoc && jsdoc.description) {
286
286
  result.description = jsdoc.description;
@@ -294,14 +294,14 @@ class DocJSONBuilder {
294
294
  }
295
295
  if (
296
296
  propMeta.type &&
297
- propMeta.type.name === 'shape' &&
297
+ propMeta.type.name === "shape" &&
298
298
  propMeta.type.value
299
299
  ) {
300
300
  const type = propMeta.type.value;
301
301
  const value = Object.keys(type).map((_name) =>
302
302
  mapProp(mapNestedProp(type[_name]), _name, false),
303
303
  );
304
- result.type = { name: 'shape', value };
304
+ result.type = { name: "shape", value };
305
305
  }
306
306
  return result;
307
307
  }
@@ -323,10 +323,10 @@ class DocJSONBuilder {
323
323
 
324
324
  if (method.docblock) {
325
325
  const examples = method.docblock
326
- .split('@')
327
- .filter((block) => block.startsWith('example'));
326
+ .split("@")
327
+ .filter((block) => block.startsWith("example"));
328
328
  method.examples = examples.map((example) =>
329
- example.substring('example'.length),
329
+ example.substring("example".length),
330
330
  );
331
331
  }
332
332
  }
@@ -359,7 +359,7 @@ class DocJSONBuilder {
359
359
  return reject(err);
360
360
  }
361
361
 
362
- let fileName = fileNameWithExt.replace(/\.(js|tsx|ts$)/, '');
362
+ let fileName = fileNameWithExt.replace(/\.(js|tsx|ts$)/, "");
363
363
  if (
364
364
  IGNORE_FILES.includes(fileName) ||
365
365
  fileName.match(IGNORE_PATTERN)
@@ -368,13 +368,13 @@ class DocJSONBuilder {
368
368
  return;
369
369
  }
370
370
 
371
- let parsedComponents = docgen.parse(content, {
371
+ const parsedComponents = docgen.parse(content, {
372
372
  babelOptions: {
373
373
  filename: fileNameWithExt,
374
374
  },
375
375
  });
376
- let [parsed] = parsedComponents;
377
- fileName = fileName.replace(fileExtensionsRegex, '');
376
+ const [parsed] = parsedComponents;
377
+ fileName = fileName.replace(fileExtensionsRegex, "");
378
378
  parsed.fileNameWithExt = fileNameWithExt;
379
379
  results[fileName] = parsed;
380
380
 
@@ -404,7 +404,7 @@ class DocJSONBuilder {
404
404
  .charAt(0)
405
405
  .toLowerCase()}${module.name.substring(1)}`;
406
406
 
407
- const pathParts = module.context.file.split('/');
407
+ const pathParts = module.context.file.split("/");
408
408
  const fileNameWithExt = pathParts[pathParts.length - 1];
409
409
 
410
410
  results[name] = {
@@ -1,30 +1,33 @@
1
1
  class JSDocNodeTree {
2
- constructor (root) {
2
+ constructor(root) {
3
3
  this._root = root;
4
4
  }
5
5
 
6
- getChildrenByTag (node, tag) {
6
+ getChildrenByTag(node, tag) {
7
7
  if (!node || !Array.isArray(node.children)) {
8
8
  return [];
9
9
  }
10
10
  return node.children.filter((child) => child.type === tag);
11
11
  }
12
12
 
13
- getName () {
13
+ getName() {
14
14
  if (!this._root) {
15
- return '';
15
+ return "";
16
16
  }
17
17
  return this._root.namespace;
18
18
  }
19
19
 
20
- getText () {
20
+ getText() {
21
21
  if (!this.hasChildren()) {
22
- return '';
22
+ return "";
23
23
  }
24
24
 
25
- let text = '';
26
- for (let paragraph of this.getChildrenByTag(this._root.description, 'paragraph')) {
27
- for (let textNode of this.getChildrenByTag(paragraph, 'text')) {
25
+ let text = "";
26
+ for (const paragraph of this.getChildrenByTag(
27
+ this._root.description,
28
+ "paragraph",
29
+ )) {
30
+ for (const textNode of this.getChildrenByTag(paragraph, "text")) {
28
31
  text += textNode.value;
29
32
  }
30
33
  }
@@ -32,14 +35,14 @@ class JSDocNodeTree {
32
35
  return text;
33
36
  }
34
37
 
35
- getMethods () {
36
- if (!this._hasArray(this._root.members, 'instance')) {
38
+ getMethods() {
39
+ if (!this._hasArray(this._root.members, "instance")) {
37
40
  return [];
38
41
  }
39
42
 
40
43
  const methods = [];
41
- for (let field of this._root.members.instance) {
42
- if (field.kind !== 'function' || this._isPrivateMethod(field)) {
44
+ for (const field of this._root.members.instance) {
45
+ if (field.kind !== "function" || this._isPrivateMethod(field)) {
43
46
  continue;
44
47
  }
45
48
 
@@ -56,14 +59,14 @@ class JSDocNodeTree {
56
59
  return methods;
57
60
  }
58
61
 
59
- getMethodParams (field) {
60
- if (!this._hasArray(field, 'params')) {
62
+ getMethodParams(field) {
63
+ if (!this._hasArray(field, "params")) {
61
64
  return [];
62
65
  }
63
66
 
64
67
  const methodParams = [];
65
- for (let param of field.params) {
66
- if (param.title !== 'param') {
68
+ for (const param of field.params) {
69
+ if (param.title !== "param") {
67
70
  continue;
68
71
  }
69
72
 
@@ -72,22 +75,22 @@ class JSDocNodeTree {
72
75
  name: param.name,
73
76
  description: node.getText(),
74
77
  type: { name: this.getType(param.type) },
75
- optional: param.type.type === 'OptionalType',
76
- })
78
+ optional: param.type.type === "OptionalType",
79
+ });
77
80
  }
78
81
 
79
82
  return methodParams;
80
83
  }
81
84
 
82
- getExamples (field) {
83
- if (!this._hasArray(field, 'examples')) {
85
+ getExamples(field) {
86
+ if (!this._hasArray(field, "examples")) {
84
87
  return [];
85
88
  }
86
89
  return field.examples.map((example) => example.description);
87
90
  }
88
91
 
89
- getReturnValue (field) {
90
- if (!this._hasArray(field, 'returns')) {
92
+ getReturnValue(field) {
93
+ if (!this._hasArray(field, "returns")) {
91
94
  return null;
92
95
  }
93
96
 
@@ -100,23 +103,23 @@ class JSDocNodeTree {
100
103
  };
101
104
  }
102
105
 
103
- getType (typeNode) {
106
+ getType(typeNode) {
104
107
  if (!typeNode) {
105
- return '';
108
+ return "";
106
109
  }
107
110
 
108
111
  if (typeNode.expression) {
109
112
  return typeNode.expression.name;
110
113
  }
111
114
 
112
- return typeNode.name || '';
115
+ return typeNode.name || "";
113
116
  }
114
117
 
115
- hasChildren () {
116
- return this._hasArray(this._root.description, 'children');
118
+ hasChildren() {
119
+ return this._hasArray(this._root.description, "children");
117
120
  }
118
121
 
119
- _hasArray (node, propName) {
122
+ _hasArray(node, propName) {
120
123
  if (!this._root) {
121
124
  return false;
122
125
  }
@@ -124,7 +127,7 @@ class JSDocNodeTree {
124
127
  }
125
128
 
126
129
  _isPrivateMethod(field) {
127
- return field.name.charAt(0) === '_';
130
+ return field.name.charAt(0) === "_";
128
131
  }
129
132
  }
130
133
 
@@ -0,0 +1,37 @@
1
+ const ejs = require("ejs");
2
+ const fs = require("fs");
3
+ const path = require("path");
4
+
5
+ const TMPL_PATH = path.join(__dirname, "..", "templates");
6
+ const TMPL_FILE = fs.readFileSync(
7
+ path.join(TMPL_PATH, "component.md.ejs"),
8
+ "utf8",
9
+ );
10
+
11
+ class MarkdownBuilder {
12
+ generateComponentFile(docJSON, componentName) {
13
+ const tmpl = ejs.compile(TMPL_FILE, { strict: true });
14
+ const fileContents = tmpl({ component: docJSON[componentName] });
15
+ fs.writeFileSync(
16
+ path.join(__dirname, "..", "..", "docs", `${componentName}.md`),
17
+ fileContents,
18
+ );
19
+ }
20
+
21
+ generate() {
22
+ const docJSONFile = fs.readFileSync(
23
+ path.join(__dirname, "..", "..", "docs", "docs.json"),
24
+ "utf8",
25
+ );
26
+ const docJSON = JSON.parse(docJSONFile);
27
+ const componentPaths = Object.keys(docJSON);
28
+
29
+ for (const componentPath of componentPaths) {
30
+ this.generateComponentFile(docJSON, componentPath);
31
+ }
32
+
33
+ console.log("Markdown is finished generating");
34
+ }
35
+ }
36
+
37
+ module.exports = MarkdownBuilder;