From 0e9a4c0a9bac6223f6bca76d53b03b791b5281af Mon Sep 17 00:00:00 2001 From: Kilian Finger Date: Sun, 15 Dec 2024 13:34:28 +0100 Subject: [PATCH 01/19] chore: remove unused TemplateHelpers functions --- __tests__/exports.ts | 25 +------ scripts/utils/TemplateHelpers.ts | 119 ------------------------------- 2 files changed, 2 insertions(+), 142 deletions(-) diff --git a/__tests__/exports.ts b/__tests__/exports.ts index 9207fed77..87f7badbb 100644 --- a/__tests__/exports.ts +++ b/__tests__/exports.ts @@ -32,42 +32,21 @@ describe("Package Exports", () => { "BackgroundLayer", "RasterLayer", - // sources + // Sources "VectorSource", "ShapeSource", "RasterSource", "ImageSource", "Images", - // constants + // Constants "UserTrackingMode", "UserLocationRenderMode", "StyleURL", // "EventTypes", "CameraModes", "StyleSource", - // "InterpolationMode", "LineJoin", - // "LineCap", - // "LineTranslateAnchor", - // "CirclePitchScale", - // "CircleTranslateAnchor", - // 'CirclePitchAlignment', - // "FillExtrusionTranslateAnchor", - // "FillTranslateAnchor", - // "IconRotationAlignment", - // "IconTextFit", - // 'IconAnchor', - // "IconTranslateAnchor", - // 'IconPitchAlignment', - // "SymbolPlacement", - // "TextAnchor", - // "TextJustify", - // "TextPitchAlignment", - // "TextRotationAlignment", - // "TextTransform", - // "TextTranslateAnchor", - // "LightAnchor", "OfflinePackDownloadState", // "OfflineCallbackName", diff --git a/scripts/utils/TemplateHelpers.ts b/scripts/utils/TemplateHelpers.ts index 6146466de..e7fc81f70 100644 --- a/scripts/utils/TemplateHelpers.ts +++ b/scripts/utils/TemplateHelpers.ts @@ -50,13 +50,6 @@ export function exists(value: T): value is NonNullable { return typeof value !== "undefined" && value !== null; } -export function getValue(value: any, defaultValue: any) { - if (!exists(value) || value === "") { - return defaultValue; - } - return value; -} - export function camelCase(str: string, delimiter = "-") { const parts = str.split(delimiter); return parts @@ -123,10 +116,6 @@ export function ifOrElseIf(index: number) { return "} else if"; } -export function iosStringArrayLiteral(array: string[]) { - return `@[@${array.map((item) => `"${item}"`).join(", @")}]`; -} - export function iosPropName(name: string) { if (name.indexOf("visibility") !== -1) { return "visible"; @@ -140,14 +129,6 @@ export function iosPropName(name: string) { return name; } -export function iosMapLibrePropName(name: string) { - const result = iosPropName(name); - if (result === "fillExtrusionVerticalGradient") { - return "fillExtrusionHasVerticalGradient"; - } - return undefined; -} - export function iosPropMethodName(layer: any, name: string) { if (name.indexOf("Visibility") !== -1) { return pascalCase(layer.name) + "StyleLayer" + name; @@ -172,23 +153,6 @@ export function androidInputType(type: string, value?: string): string { } } -export function androidOutputType(type: string, value?: any): string { - if (type === "array" && value) { - return `${androidOutputType(value)}[]`; - } - - switch (type) { - case "color": - return "String"; - case "boolean": - return "Boolean"; - case "number": - return "Float"; - default: - return "String"; - } -} - export function androidGetConfigType(androidType: string, prop: any) { switch (androidType) { case "Integer": @@ -234,21 +198,6 @@ export function jsStyleType(prop: any) { return "StyleTypes.Constant"; } -export function jsDocPropRequires(prop: any) { - if (!prop.doc.requires) { - return undefined; - } - - let desc = ""; - for (const item of prop.doc.requires) { - if (typeof item === "string") { - desc += item + ", "; - } - } - - return desc; -} - export function getEnums(layers: any[]) { const result: Record = {}; @@ -315,12 +264,6 @@ export function dtsInterfaceType(prop: any) { throw new Error(`Unexpected type: ${prop.type} for ${prop.name}`); } - /* - if (prop.allowedFunctionTypes && prop.allowedFunctionTypes.length > 0) { - propTypes.push('StyleFunctionProps'); - } - */ - if (propTypes.length > 1) { return `${propTypes.map((p) => startAtSpace(4, p)).join(" | ")}, ${startAtSpace(2, "")}`; @@ -339,60 +282,6 @@ ${startAtSpace(2, "")}`; } } -export function jsDocReactProp(prop: any) { - const propTypes = []; - - if (prop.type === "color") { - propTypes.push("PropTypes.string"); - } else if (prop.type === "array") { - switch (prop.value) { - case "number": - propTypes.push("PropTypes.arrayOf(PropTypes.number)"); - break; - case "boolean": - propTypes.push("PropTypes.arrayOf(PropTypes.bool)"); - break; - case "string": - propTypes.push("PropTypes.arrayOf(PropTypes.string)"); - break; - default: - propTypes.push("PropTypes.array"); - } - } else if (prop.type === "number") { - propTypes.push("PropTypes.number"); - } else if (prop.type === "boolean") { - propTypes.push("PropTypes.bool"); - } else if (prop.type === "enum") { - if (prop.doc.values) { - propTypes.push( - `PropTypes.oneOf([${Object.keys(prop.doc.values) - .map((v) => `'${v}'`) - .join(", ")}])`, - ); - } else { - propTypes.push("PropTypes.any"); - } - } else { - // images can be required which result in a number - if (prop.image) { - propTypes.push("PropTypes.number"); - } - propTypes.push("PropTypes.string"); - } - - if (prop.expressionSupported && !propTypes.includes("PropTypes.array")) { - propTypes.push("PropTypes.array"); - } - - if (propTypes.length > 1) { - return `PropTypes.oneOfType([ -${propTypes.map((p) => startAtSpace(4, p)).join(",\n")}, -${startAtSpace(2, "])")}`; - } else { - return propTypes[0]; - } -} - export function startAtSpace(spaceCount: number, str: string) { let value = ""; @@ -407,14 +296,6 @@ export function replaceNewLine(str: string) { return str?.replace(/\n/g, "
"); } -export function styleMarkdownTableRow(style: any) { - return `| \`${style.name}\` | \`${style.type}\` | \`${ - style.requires.join(", ") || "none" - }\` | \`${style.disabledBy.join(", ") || "none"}\` | ${replaceNewLine( - style.description, - )} |`; -} - export function methodMarkdownTableRow(method: any) { return method.params .map((param: any) => { From ec930a1bd0db1890028bbc71652b46f27a42fe09 Mon Sep 17 00:00:00 2001 From: Kilian Finger Date: Sun, 15 Dec 2024 13:35:48 +0100 Subject: [PATCH 02/19] refactor: remove mapbox stylesheet from MLRNStyle --- .../maplibre/reactnative/components/styles/MLRNStyle.java | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/android/src/main/java/org/maplibre/reactnative/components/styles/MLRNStyle.java b/android/src/main/java/org/maplibre/reactnative/components/styles/MLRNStyle.java index bc8662e56..3d8220dc5 100644 --- a/android/src/main/java/org/maplibre/reactnative/components/styles/MLRNStyle.java +++ b/android/src/main/java/org/maplibre/reactnative/components/styles/MLRNStyle.java @@ -35,10 +35,7 @@ public List getAllStyleKeys() { while (it.hasNextKey()) { String key = it.nextKey(); - - if (!key.equals("__MAPBOX_STYLESHEET__")) { - keys.add(key); - } + keys.add(key); } return keys; From 369d0f1c88911736ac85a4f68aa1f7f5ff5173b1 Mon Sep 17 00:00:00 2001 From: Kilian Finger Date: Sun, 15 Dec 2024 13:36:03 +0100 Subject: [PATCH 03/19] refactor: cleanup MLRNStyleFactory --- .../components/styles/MLRNStyleFactory.java | 21 +++++++++---------- scripts/templates/MLRNStyleFactory.java.ejs | 3 +-- 2 files changed, 11 insertions(+), 13 deletions(-) diff --git a/android/src/main/java/org/maplibre/reactnative/components/styles/MLRNStyleFactory.java b/android/src/main/java/org/maplibre/reactnative/components/styles/MLRNStyleFactory.java index 010493296..e9054992f 100644 --- a/android/src/main/java/org/maplibre/reactnative/components/styles/MLRNStyleFactory.java +++ b/android/src/main/java/org/maplibre/reactnative/components/styles/MLRNStyleFactory.java @@ -9,7 +9,6 @@ import org.maplibre.android.style.layers.FillLayer; import org.maplibre.android.style.layers.LineLayer; import org.maplibre.android.style.layers.PropertyFactory; -import org.maplibre.android.style.layers.PropertyValue; import org.maplibre.android.style.layers.RasterLayer; import org.maplibre.android.style.layers.SymbolLayer; import org.maplibre.android.style.layers.HeatmapLayer; @@ -28,7 +27,7 @@ public class MLRNStyleFactory { public static void setFillLayerStyle(final FillLayer layer, MLRNStyle style) { List styleKeys = style.getAllStyleKeys(); - if (styleKeys.size() == 0) { + if (styleKeys.isEmpty()) { return; } @@ -89,7 +88,7 @@ public void onAllImagesLoaded() { public static void setLineLayerStyle(final LineLayer layer, MLRNStyle style) { List styleKeys = style.getAllStyleKeys(); - if (styleKeys.size() == 0) { + if (styleKeys.isEmpty()) { return; } @@ -186,7 +185,7 @@ public void onAllImagesLoaded() { public static void setSymbolLayerStyle(final SymbolLayer layer, MLRNStyle style) { List styleKeys = style.getAllStyleKeys(); - if (styleKeys.size() == 0) { + if (styleKeys.isEmpty()) { return; } @@ -409,7 +408,7 @@ public void onAllImagesLoaded() { public static void setCircleLayerStyle(final CircleLayer layer, MLRNStyle style) { List styleKeys = style.getAllStyleKeys(); - if (styleKeys.size() == 0) { + if (styleKeys.isEmpty()) { return; } @@ -486,7 +485,7 @@ public static void setCircleLayerStyle(final CircleLayer layer, MLRNStyle style) public static void setHeatmapLayerStyle(final HeatmapLayer layer, MLRNStyle style) { List styleKeys = style.getAllStyleKeys(); - if (styleKeys.size() == 0) { + if (styleKeys.isEmpty()) { return; } @@ -527,7 +526,7 @@ public static void setHeatmapLayerStyle(final HeatmapLayer layer, MLRNStyle styl public static void setFillExtrusionLayerStyle(final FillExtrusionLayer layer, MLRNStyle style) { List styleKeys = style.getAllStyleKeys(); - if (styleKeys.size() == 0) { + if (styleKeys.isEmpty()) { return; } @@ -591,7 +590,7 @@ public void onAllImagesLoaded() { public static void setRasterLayerStyle(final RasterLayer layer, MLRNStyle style) { List styleKeys = style.getAllStyleKeys(); - if (styleKeys.size() == 0) { + if (styleKeys.isEmpty()) { return; } @@ -650,7 +649,7 @@ public static void setRasterLayerStyle(final RasterLayer layer, MLRNStyle style) public static void setHillshadeLayerStyle(final HillshadeLayer layer, MLRNStyle style) { List styleKeys = style.getAllStyleKeys(); - if (styleKeys.size() == 0) { + if (styleKeys.isEmpty()) { return; } @@ -697,7 +696,7 @@ public static void setHillshadeLayerStyle(final HillshadeLayer layer, MLRNStyle public static void setBackgroundLayerStyle(final BackgroundLayer layer, MLRNStyle style) { List styleKeys = style.getAllStyleKeys(); - if (styleKeys.size() == 0) { + if (styleKeys.isEmpty()) { return; } @@ -737,7 +736,7 @@ public void onAllImagesLoaded() { public static void setLightLayerStyle(final Light layer, MLRNStyle style) { List styleKeys = style.getAllStyleKeys(); - if (styleKeys.size() == 0) { + if (styleKeys.isEmpty()) { return; } diff --git a/scripts/templates/MLRNStyleFactory.java.ejs b/scripts/templates/MLRNStyleFactory.java.ejs index 4a692ab25..978ea4ecd 100644 --- a/scripts/templates/MLRNStyleFactory.java.ejs +++ b/scripts/templates/MLRNStyleFactory.java.ejs @@ -13,7 +13,6 @@ import org.maplibre.android.style.layers.FillExtrusionLayer; import org.maplibre.android.style.layers.FillLayer; import org.maplibre.android.style.layers.LineLayer; import org.maplibre.android.style.layers.PropertyFactory; -import org.maplibre.android.style.layers.PropertyValue; import org.maplibre.android.style.layers.RasterLayer; import org.maplibre.android.style.layers.SymbolLayer; import org.maplibre.android.style.layers.HeatmapLayer; @@ -33,7 +32,7 @@ public class MLRNStyleFactory { public static void <%- helpers.setLayerMethodName(layer) -%>(final <%- helpers.getLayerType(layer, 'android') -%> layer, MLRNStyle style) { List styleKeys = style.getAllStyleKeys(); - if (styleKeys.size() == 0) { + if (styleKeys.isEmpty()) { return; } From 69112473f7a01b513b56785abf44f5afa25ab718 Mon Sep 17 00:00:00 2001 From: Kilian Finger Date: Sun, 15 Dec 2024 13:49:11 +0100 Subject: [PATCH 04/19] feat: replace enums with string types --- scripts/templates/MapLibreRNStyles.ts.ejs | 12 - scripts/utils/TemplateHelpers.ts | 31 +- src/utils/MapLibreRNStyles.d.ts | 443 +++------------------- 3 files changed, 67 insertions(+), 419 deletions(-) diff --git a/scripts/templates/MapLibreRNStyles.ts.ejs b/scripts/templates/MapLibreRNStyles.ts.ejs index 14eff92a6..a78c9d91f 100644 --- a/scripts/templates/MapLibreRNStyles.ts.ejs +++ b/scripts/templates/MapLibreRNStyles.ts.ejs @@ -61,18 +61,6 @@ export type Value = | T | Expression; -<%_ for (let enumInfo of helpers.getEnums(layers)) { _%> - enum <%- helpers.pascalCase(enumInfo.name) %>Enum { - <%_ for (let k of Object.keys(enumInfo.values)) { _%> - /** <%- enumInfo.values[k].doc %> */ - <%- helpers.pascalCase(k) %> = '<%- k %>', - <%_ } _%> - } - type <%- helpers.pascalCase(enumInfo.name) %>EnumValues = <%- Object.keys(enumInfo.values).map(k => `'${k}'`).join(' | ') %>; -<%_ } _%> - -type Enum = EnumType | EnumValues; - <%_ for (let layer of layers) { _%> export interface <%- helpers.pascalCase(layer.name) %>LayerStyleProps { <%_ for (let prop of layer.properties) { _%> diff --git a/scripts/utils/TemplateHelpers.ts b/scripts/utils/TemplateHelpers.ts index e7fc81f70..f3b8171a6 100644 --- a/scripts/utils/TemplateHelpers.ts +++ b/scripts/utils/TemplateHelpers.ts @@ -198,25 +198,6 @@ export function jsStyleType(prop: any) { return "StyleTypes.Constant"; } -export function getEnums(layers: any[]) { - const result: Record = {}; - - layers.forEach((layer) => { - layer.properties.forEach((property: any) => { - if ( - property.type === "enum" || - (property.type === "array" && property.value === "enum") - ) { - result[property.name] = { - values: property.doc.values, - name: property.name, - }; - } - }); - }); - return Object.values(result); -} - export function dtsInterfaceType(prop: any) { const propTypes: string[] = []; @@ -224,7 +205,6 @@ export function dtsInterfaceType(prop: any) { propTypes.push("Translation"); } else if (prop.type === "color") { propTypes.push("string"); - // propTypes.push('ConstantPropType'); } else if (prop.type === "array") { switch (prop.value) { case "number": @@ -238,18 +218,19 @@ export function dtsInterfaceType(prop: any) { break; case "enum": propTypes.push( - `Enum<${pascalCase(prop.name)}Enum, ${pascalCase( - prop.name, - )}EnumValues>[]`, + `(${Object.keys(prop.doc.values) + .map((value) => `"${value}"`) + .join(" | ")})[]`, ); break; } - // propTypes.push('ConstantPropType'); } else if (prop.type === "number") { propTypes.push("number"); } else if (prop.type === "enum") { propTypes.push( - `Enum<${pascalCase(prop.name)}Enum, ${pascalCase(prop.name)}EnumValues>`, + Object.keys(prop.doc.values) + .map((value) => `"${value}"`) + .join(" | "), ); } else if (prop.type === "boolean") { propTypes.push("boolean"); diff --git a/src/utils/MapLibreRNStyles.d.ts b/src/utils/MapLibreRNStyles.d.ts index 65f3b40d6..61d37f413 100644 --- a/src/utils/MapLibreRNStyles.d.ts +++ b/src/utils/MapLibreRNStyles.d.ts @@ -134,299 +134,6 @@ export type Value = | T | Expression; -export enum VisibilityEnum { - /** The layer is shown. */ - Visible = "visible", - /** The layer is not shown. */ - None = "none", -} -type VisibilityEnumValues = "visible" | "none"; -export enum FillTranslateAnchorEnum { - /** The fill is translated relative to the map. */ - Map = "map", - /** The fill is translated relative to the viewport. */ - Viewport = "viewport", -} -type FillTranslateAnchorEnumValues = "map" | "viewport"; -export enum LineCapEnum { - /** A cap with a squared-off end which is drawn to the exact endpoint of the line. */ - Butt = "butt", - /** A cap with a rounded end which is drawn beyond the endpoint of the line at a radius of one-half of the line's width and centered on the endpoint of the line. */ - Round = "round", - /** A cap with a squared-off end which is drawn beyond the endpoint of the line at a distance of one-half of the line's width. */ - Square = "square", -} -type LineCapEnumValues = "butt" | "round" | "square"; -export enum LineJoinEnum { - /** A join with a squared-off end which is drawn beyond the endpoint of the line at a distance of one-half of the line's width. */ - Bevel = "bevel", - /** A join with a rounded end which is drawn beyond the endpoint of the line at a radius of one-half of the line's width and centered on the endpoint of the line. */ - Round = "round", - /** A join with a sharp, angled corner which is drawn with the outer sides beyond the endpoint of the path until they meet. */ - Miter = "miter", -} -type LineJoinEnumValues = "bevel" | "round" | "miter"; -export enum LineTranslateAnchorEnum { - /** The line is translated relative to the map. */ - Map = "map", - /** The line is translated relative to the viewport. */ - Viewport = "viewport", -} -type LineTranslateAnchorEnumValues = "map" | "viewport"; -export enum SymbolPlacementEnum { - /** The label is placed at the point where the geometry is located. */ - Point = "point", - /** The label is placed along the line of the geometry. Can only be used on `LineString` and `Polygon` geometries. */ - Line = "line", - /** The label is placed at the center of the line of the geometry. Can only be used on `LineString` and `Polygon` geometries. Note that a single feature in a vector tile may contain multiple line geometries. */ - LineCenter = "line-center", -} -type SymbolPlacementEnumValues = "point" | "line" | "line-center"; -export enum SymbolZOrderEnum { - /** Sorts symbols by `symbol-sort-key` if set. Otherwise, sorts symbols by their y-position relative to the viewport if `icon-allow-overlap` or `text-allow-overlap` is set to `true` or `icon-ignore-placement` or `text-ignore-placement` is `false`. */ - Auto = "auto", - /** Sorts symbols by their y-position relative to the viewport if `icon-allow-overlap` or `text-allow-overlap` is set to `true` or `icon-ignore-placement` or `text-ignore-placement` is `false`. */ - ViewportY = "viewport-y", - /** Sorts symbols by `symbol-sort-key` if set. Otherwise, no sorting is applied; symbols are rendered in the same order as the source data. */ - Source = "source", -} -type SymbolZOrderEnumValues = "auto" | "viewport-y" | "source"; -export enum IconRotationAlignmentEnum { - /** When `symbol-placement` is set to `point`, aligns icons east-west. When `symbol-placement` is set to `line` or `line-center`, aligns icon x-axes with the line. */ - Map = "map", - /** Produces icons whose x-axes are aligned with the x-axis of the viewport, regardless of the value of `symbol-placement`. */ - Viewport = "viewport", - /** When `symbol-placement` is set to `point`, this is equivalent to `viewport`. When `symbol-placement` is set to `line` or `line-center`, this is equivalent to `map`. */ - Auto = "auto", -} -type IconRotationAlignmentEnumValues = "map" | "viewport" | "auto"; -export enum IconTextFitEnum { - /** The icon is displayed at its intrinsic aspect ratio. */ - None = "none", - /** The icon is scaled in the x-dimension to fit the width of the text. */ - Width = "width", - /** The icon is scaled in the y-dimension to fit the height of the text. */ - Height = "height", - /** The icon is scaled in both x- and y-dimensions. */ - Both = "both", -} -type IconTextFitEnumValues = "none" | "width" | "height" | "both"; -export enum IconAnchorEnum { - /** The center of the icon is placed closest to the anchor. */ - Center = "center", - /** The left side of the icon is placed closest to the anchor. */ - Left = "left", - /** The right side of the icon is placed closest to the anchor. */ - Right = "right", - /** The top of the icon is placed closest to the anchor. */ - Top = "top", - /** The bottom of the icon is placed closest to the anchor. */ - Bottom = "bottom", - /** The top left corner of the icon is placed closest to the anchor. */ - TopLeft = "top-left", - /** The top right corner of the icon is placed closest to the anchor. */ - TopRight = "top-right", - /** The bottom left corner of the icon is placed closest to the anchor. */ - BottomLeft = "bottom-left", - /** The bottom right corner of the icon is placed closest to the anchor. */ - BottomRight = "bottom-right", -} -type IconAnchorEnumValues = - | "center" - | "left" - | "right" - | "top" - | "bottom" - | "top-left" - | "top-right" - | "bottom-left" - | "bottom-right"; -export enum IconPitchAlignmentEnum { - /** The icon is aligned to the plane of the map. */ - Map = "map", - /** The icon is aligned to the plane of the viewport. */ - Viewport = "viewport", - /** Automatically matches the value of `icon-rotation-alignment`. */ - Auto = "auto", -} -type IconPitchAlignmentEnumValues = "map" | "viewport" | "auto"; -export enum TextPitchAlignmentEnum { - /** The text is aligned to the plane of the map. */ - Map = "map", - /** The text is aligned to the plane of the viewport. */ - Viewport = "viewport", - /** Automatically matches the value of `text-rotation-alignment`. */ - Auto = "auto", -} -type TextPitchAlignmentEnumValues = "map" | "viewport" | "auto"; -export enum TextRotationAlignmentEnum { - /** When `symbol-placement` is set to `point`, aligns text east-west. When `symbol-placement` is set to `line` or `line-center`, aligns text x-axes with the line. */ - Map = "map", - /** Produces glyphs whose x-axes are aligned with the x-axis of the viewport, regardless of the value of `symbol-placement`. */ - Viewport = "viewport", - /** When `symbol-placement` is set to `point`, aligns text to the x-axis of the viewport. When `symbol-placement` is set to `line` or `line-center`, aligns glyphs to the x-axis of the viewport and places them along the line. */ - ViewportGlyph = "viewport-glyph", - /** When `symbol-placement` is set to `point`, this is equivalent to `viewport`. When `symbol-placement` is set to `line` or `line-center`, this is equivalent to `map`. */ - Auto = "auto", -} -type TextRotationAlignmentEnumValues = - | "map" - | "viewport" - | "viewport-glyph" - | "auto"; -export enum TextJustifyEnum { - /** The text is aligned towards the anchor position. */ - Auto = "auto", - /** The text is aligned to the left. */ - Left = "left", - /** The text is centered. */ - Center = "center", - /** The text is aligned to the right. */ - Right = "right", -} -type TextJustifyEnumValues = "auto" | "left" | "center" | "right"; -export enum TextVariableAnchorEnum { - /** The center of the text is placed closest to the anchor. */ - Center = "center", - /** The left side of the text is placed closest to the anchor. */ - Left = "left", - /** The right side of the text is placed closest to the anchor. */ - Right = "right", - /** The top of the text is placed closest to the anchor. */ - Top = "top", - /** The bottom of the text is placed closest to the anchor. */ - Bottom = "bottom", - /** The top left corner of the text is placed closest to the anchor. */ - TopLeft = "top-left", - /** The top right corner of the text is placed closest to the anchor. */ - TopRight = "top-right", - /** The bottom left corner of the text is placed closest to the anchor. */ - BottomLeft = "bottom-left", - /** The bottom right corner of the text is placed closest to the anchor. */ - BottomRight = "bottom-right", -} -type TextVariableAnchorEnumValues = - | "center" - | "left" - | "right" - | "top" - | "bottom" - | "top-left" - | "top-right" - | "bottom-left" - | "bottom-right"; -export enum TextAnchorEnum { - /** The center of the text is placed closest to the anchor. */ - Center = "center", - /** The left side of the text is placed closest to the anchor. */ - Left = "left", - /** The right side of the text is placed closest to the anchor. */ - Right = "right", - /** The top of the text is placed closest to the anchor. */ - Top = "top", - /** The bottom of the text is placed closest to the anchor. */ - Bottom = "bottom", - /** The top left corner of the text is placed closest to the anchor. */ - TopLeft = "top-left", - /** The top right corner of the text is placed closest to the anchor. */ - TopRight = "top-right", - /** The bottom left corner of the text is placed closest to the anchor. */ - BottomLeft = "bottom-left", - /** The bottom right corner of the text is placed closest to the anchor. */ - BottomRight = "bottom-right", -} -type TextAnchorEnumValues = - | "center" - | "left" - | "right" - | "top" - | "bottom" - | "top-left" - | "top-right" - | "bottom-left" - | "bottom-right"; -export enum TextWritingModeEnum { - /** If a text's language supports horizontal writing mode, symbols with point placement would be laid out horizontally. */ - Horizontal = "horizontal", - /** If a text's language supports vertical writing mode, symbols with point placement would be laid out vertically. */ - Vertical = "vertical", -} -type TextWritingModeEnumValues = "horizontal" | "vertical"; -export enum TextTransformEnum { - /** The text is not altered. */ - None = "none", - /** Forces all letters to be displayed in uppercase. */ - Uppercase = "uppercase", - /** Forces all letters to be displayed in lowercase. */ - Lowercase = "lowercase", -} -type TextTransformEnumValues = "none" | "uppercase" | "lowercase"; -export enum IconTranslateAnchorEnum { - /** Icons are translated relative to the map. */ - Map = "map", - /** Icons are translated relative to the viewport. */ - Viewport = "viewport", -} -type IconTranslateAnchorEnumValues = "map" | "viewport"; -export enum TextTranslateAnchorEnum { - /** The text is translated relative to the map. */ - Map = "map", - /** The text is translated relative to the viewport. */ - Viewport = "viewport", -} -type TextTranslateAnchorEnumValues = "map" | "viewport"; -export enum CircleTranslateAnchorEnum { - /** The circle is translated relative to the map. */ - Map = "map", - /** The circle is translated relative to the viewport. */ - Viewport = "viewport", -} -type CircleTranslateAnchorEnumValues = "map" | "viewport"; -export enum CirclePitchScaleEnum { - /** Circles are scaled according to their apparent distance to the camera. */ - Map = "map", - /** Circles are not scaled. */ - Viewport = "viewport", -} -type CirclePitchScaleEnumValues = "map" | "viewport"; -export enum CirclePitchAlignmentEnum { - /** The circle is aligned to the plane of the map. */ - Map = "map", - /** The circle is aligned to the plane of the viewport. */ - Viewport = "viewport", -} -type CirclePitchAlignmentEnumValues = "map" | "viewport"; -export enum FillExtrusionTranslateAnchorEnum { - /** The fill extrusion is translated relative to the map. */ - Map = "map", - /** The fill extrusion is translated relative to the viewport. */ - Viewport = "viewport", -} -type FillExtrusionTranslateAnchorEnumValues = "map" | "viewport"; -export enum RasterResamplingEnum { - /** (Bi)linear filtering interpolates pixel values using the weighted average of the four closest original source pixels creating a smooth but blurry look when overscaled */ - Linear = "linear", - /** Nearest neighbor filtering interpolates pixel values using the nearest original source pixel creating a sharp but pixelated look when overscaled */ - Nearest = "nearest", -} -type RasterResamplingEnumValues = "linear" | "nearest"; -export enum HillshadeIlluminationAnchorEnum { - /** The hillshade illumination is relative to the north direction. */ - Map = "map", - /** The hillshade illumination is relative to the top of the viewport. */ - Viewport = "viewport", -} -type HillshadeIlluminationAnchorEnumValues = "map" | "viewport"; -export enum AnchorEnum { - /** The position of the light source is aligned to the rotation of the map. */ - Map = "map", - /** The position of the light source is aligned to the rotation of the viewport. */ - Viewport = "viewport", -} -type AnchorEnumValues = "map" | "viewport"; - -type Enum = EnumType | EnumValues; - export interface FillLayerStyleProps { /** * Sorts features in ascending order based on this value. Features with a higher sort key will appear above features with a lower sort key. @@ -435,7 +142,7 @@ export interface FillLayerStyleProps { /** * Whether this layer is displayed. */ - visibility?: Enum; + visibility?: "visible" | "none"; /** * Whether or not the fill should be antialiased. */ @@ -485,10 +192,7 @@ export interface FillLayerStyleProps { * * @requires fillTranslate */ - fillTranslateAnchor?: Value< - Enum, - ["zoom"] - >; + fillTranslateAnchor?: Value<"map" | "viewport", ["zoom"]>; /** * Name of image in sprite to use for drawing image fills. For seamless patterns, image width and height must be a factor of two (2, 4, 8, ..., 512). Note that zoomDependent expressions will be evaluated only at integer zoom levels. */ @@ -503,11 +207,11 @@ export interface LineLayerStyleProps { /** * The display of line endings. */ - lineCap?: Value, ["zoom"]>; + lineCap?: Value<"butt" | "round" | "square", ["zoom"]>; /** * The display of lines when joining. */ - lineJoin?: Value, ["zoom", "feature"]>; + lineJoin?: Value<"bevel" | "round" | "miter", ["zoom", "feature"]>; /** * Used to automatically convert miter joins to bevel joins for sharp angles. */ @@ -523,7 +227,7 @@ export interface LineLayerStyleProps { /** * Whether this layer is displayed. */ - visibility?: Enum; + visibility?: "visible" | "none"; /** * The opacity at which the line will be drawn. */ @@ -558,10 +262,7 @@ export interface LineLayerStyleProps { * * @requires lineTranslate */ - lineTranslateAnchor?: Value< - Enum, - ["zoom"] - >; + lineTranslateAnchor?: Value<"map" | "viewport", ["zoom"]>; /** * Stroke thickness. */ @@ -629,10 +330,7 @@ export interface SymbolLayerStyleProps { /** * Label placement relative to its geometry. */ - symbolPlacement?: Value< - Enum, - ["zoom"] - >; + symbolPlacement?: Value<"point" | "line" | "line-center", ["zoom"]>; /** * Distance between two symbol anchors. */ @@ -648,10 +346,7 @@ export interface SymbolLayerStyleProps { /** * Determines whether overlapping symbols in the same layer are rendered in the order that they appear in the data source or by their yPosition relative to the viewport. To control the order and prioritization of symbols otherwise, use `symbolSortKey`. */ - symbolZOrder?: Value< - Enum, - ["zoom"] - >; + symbolZOrder?: Value<"auto" | "viewport-y" | "source", ["zoom"]>; /** * If true, the icon will be visible even if it collides with other previously drawn symbols. * @@ -677,10 +372,7 @@ export interface SymbolLayerStyleProps { * * @requires iconImage */ - iconRotationAlignment?: Value< - Enum, - ["zoom"] - >; + iconRotationAlignment?: Value<"map" | "viewport" | "auto", ["zoom"]>; /** * Scales the original size of the icon by the provided factor. The new pixel size of the image will be the original pixel size multiplied by `iconSize`. 1 is the original size; 3 triples the size of the image. * @@ -692,7 +384,7 @@ export interface SymbolLayerStyleProps { * * @requires iconImage, textField */ - iconTextFit?: Value, ["zoom"]>; + iconTextFit?: Value<"none" | "width" | "height" | "both", ["zoom"]>; /** * Size of the additional area added to dimensions determined by `iconTextFit`, in clockwise order: top, right, bottom, left. * @@ -733,7 +425,15 @@ export interface SymbolLayerStyleProps { * @requires iconImage */ iconAnchor?: Value< - Enum, + | "center" + | "left" + | "right" + | "top" + | "bottom" + | "top-left" + | "top-right" + | "bottom-left" + | "bottom-right", ["zoom", "feature"] >; /** @@ -741,26 +441,20 @@ export interface SymbolLayerStyleProps { * * @requires iconImage */ - iconPitchAlignment?: Value< - Enum, - ["zoom"] - >; + iconPitchAlignment?: Value<"map" | "viewport" | "auto", ["zoom"]>; /** * Orientation of text when map is pitched. * * @requires textField */ - textPitchAlignment?: Value< - Enum, - ["zoom"] - >; + textPitchAlignment?: Value<"map" | "viewport" | "auto", ["zoom"]>; /** * In combination with `symbolPlacement`, determines the rotation behavior of the individual glyphs forming the text. * * @requires textField */ textRotationAlignment?: Value< - Enum, + "map" | "viewport" | "viewport-glyph" | "auto", ["zoom"] >; /** @@ -803,7 +497,7 @@ export interface SymbolLayerStyleProps { * @requires textField */ textJustify?: Value< - Enum, + "auto" | "left" | "center" | "right", ["zoom", "feature"] >; /** @@ -818,7 +512,17 @@ export interface SymbolLayerStyleProps { * @requires textField */ textVariableAnchor?: Value< - Enum[], + ( + | "center" + | "left" + | "right" + | "top" + | "bottom" + | "top-left" + | "top-right" + | "bottom-left" + | "bottom-right" + )[], ["zoom"] >; /** @@ -829,7 +533,15 @@ export interface SymbolLayerStyleProps { * @disabledBy textVariableAnchor */ textAnchor?: Value< - Enum, + | "center" + | "left" + | "right" + | "top" + | "bottom" + | "top-left" + | "top-right" + | "bottom-left" + | "bottom-right", ["zoom", "feature"] >; /** @@ -843,10 +555,7 @@ export interface SymbolLayerStyleProps { * * @requires textField */ - textWritingMode?: Value< - Enum[], - ["zoom"] - >; + textWritingMode?: Value<("horizontal" | "vertical")[], ["zoom"]>; /** * Rotates the text clockwise. * @@ -871,7 +580,7 @@ export interface SymbolLayerStyleProps { * @requires textField */ textTransform?: Value< - Enum, + "none" | "uppercase" | "lowercase", ["zoom", "feature"] >; /** @@ -905,7 +614,7 @@ export interface SymbolLayerStyleProps { /** * Whether this layer is displayed. */ - visibility?: Enum; + visibility?: "visible" | "none"; /** * The opacity at which the icon will be drawn. * @@ -979,10 +688,7 @@ The unit is in pixels only for SDF sprites that were created with a blur radius * * @requires iconImage, iconTranslate */ - iconTranslateAnchor?: Value< - Enum, - ["zoom"] - >; + iconTranslateAnchor?: Value<"map" | "viewport", ["zoom"]>; /** * The opacity at which the text will be drawn. * @@ -1054,10 +760,7 @@ The unit is in pixels only for SDF sprites that were created with a blur radius * * @requires textField, textTranslate */ - textTranslateAnchor?: Value< - Enum, - ["zoom"] - >; + textTranslateAnchor?: Value<"map" | "viewport", ["zoom"]>; } export interface CircleLayerStyleProps { /** @@ -1067,7 +770,7 @@ export interface CircleLayerStyleProps { /** * Whether this layer is displayed. */ - visibility?: Enum; + visibility?: "visible" | "none"; /** * Circle radius. */ @@ -1118,24 +821,15 @@ export interface CircleLayerStyleProps { * * @requires circleTranslate */ - circleTranslateAnchor?: Value< - Enum, - ["zoom"] - >; + circleTranslateAnchor?: Value<"map" | "viewport", ["zoom"]>; /** * Controls the scaling behavior of the circle when the map is pitched. */ - circlePitchScale?: Value< - Enum, - ["zoom"] - >; + circlePitchScale?: Value<"map" | "viewport", ["zoom"]>; /** * Orientation of circle when map is pitched. */ - circlePitchAlignment?: Value< - Enum, - ["zoom"] - >; + circlePitchAlignment?: Value<"map" | "viewport", ["zoom"]>; /** * The width of the circle's stroke. Strokes are placed outside of the `circleRadius`. */ @@ -1168,7 +862,7 @@ export interface HeatmapLayerStyleProps { /** * Whether this layer is displayed. */ - visibility?: Enum; + visibility?: "visible" | "none"; /** * Radius of influence of one heatmap point in pixels. Increasing the value makes the heatmap smoother, but less detailed. */ @@ -1209,7 +903,7 @@ export interface FillExtrusionLayerStyleProps { /** * Whether this layer is displayed. */ - visibility?: Enum; + visibility?: "visible" | "none"; /** * The opacity of the entire fill extrusion layer. This is rendered on a perLayer, not perFeature, basis, and dataDriven styling is not available. */ @@ -1244,13 +938,7 @@ export interface FillExtrusionLayerStyleProps { * * @requires fillExtrusionTranslate */ - fillExtrusionTranslateAnchor?: Value< - Enum< - FillExtrusionTranslateAnchorEnum, - FillExtrusionTranslateAnchorEnumValues - >, - ["zoom"] - >; + fillExtrusionTranslateAnchor?: Value<"map" | "viewport", ["zoom"]>; /** * Name of image in sprite to use for drawing images on extruded fills. For seamless patterns, image width and height must be a factor of two (2, 4, 8, ..., 512). Note that zoomDependent expressions will be evaluated only at integer zoom levels. */ @@ -1289,7 +977,7 @@ export interface RasterLayerStyleProps { /** * Whether this layer is displayed. */ - visibility?: Enum; + visibility?: "visible" | "none"; /** * The opacity at which the image will be drawn. */ @@ -1347,10 +1035,7 @@ export interface RasterLayerStyleProps { /** * The resampling/interpolation method to use for overscaling, also known as texture magnification filter */ - rasterResampling?: Value< - Enum, - ["zoom"] - >; + rasterResampling?: Value<"linear" | "nearest", ["zoom"]>; /** * Fade duration when a new tile is added, or when a video is started or its coordinates are updated. */ @@ -1360,7 +1045,7 @@ export interface HillshadeLayerStyleProps { /** * Whether this layer is displayed. */ - visibility?: Enum; + visibility?: "visible" | "none"; /** * The direction of the light source used to generate the hillshading with 0 as the top of the viewport if `hillshadeIlluminationAnchor` is set to `viewport` and due north if `hillshadeIlluminationAnchor` is set to `map`. */ @@ -1368,13 +1053,7 @@ export interface HillshadeLayerStyleProps { /** * Direction of light source when map is rotated. */ - hillshadeIlluminationAnchor?: Value< - Enum< - HillshadeIlluminationAnchorEnum, - HillshadeIlluminationAnchorEnumValues - >, - ["zoom"] - >; + hillshadeIlluminationAnchor?: Value<"map" | "viewport", ["zoom"]>; /** * Intensity of the hillshade */ @@ -1416,7 +1095,7 @@ export interface BackgroundLayerStyleProps { /** * Whether this layer is displayed. */ - visibility?: Enum; + visibility?: "visible" | "none"; /** * The color with which the background will be drawn. * @@ -1451,7 +1130,7 @@ export interface LightLayerStyleProps { /** * Whether extruded geometries are lit relative to the map or viewport. */ - anchor?: Value, ["zoom"]>; + anchor?: Value<"map" | "viewport", ["zoom"]>; /** * Position of the light source relative to lit (extruded) geometries, in [r radial coordinate, a azimuthal angle, p polar angle] where r indicates the distance from the center of the base of an object to its light, a indicates the position of the light relative to 0° (0° when `light.anchor` is set to `viewport` corresponds to the top of the viewport, or 0° when `light.anchor` is set to `map` corresponds to due north, and degrees proceed clockwise), and p indicates the height of the light (from 0°, directly above, to 180°, directly below). */ From fb5bc4f58260657adfd76b04f5590d2390ea76db Mon Sep 17 00:00:00 2001 From: Kilian Finger Date: Sun, 15 Dec 2024 15:27:26 +0100 Subject: [PATCH 05/19] feat: remove native style enums from module --- __tests__/exports.ts | 6 +- .../reactnative/modules/MLRNModule.java | 145 ------------------ ios/MLRN/MLRNModule.m | 135 ---------------- jest-setup.ts | 34 ---- src/MLRNModule.ts | 15 +- 5 files changed, 7 insertions(+), 328 deletions(-) diff --git a/__tests__/exports.ts b/__tests__/exports.ts index 87f7badbb..2edaf945f 100644 --- a/__tests__/exports.ts +++ b/__tests__/exports.ts @@ -42,14 +42,10 @@ describe("Package Exports", () => { // Constants "UserTrackingMode", "UserLocationRenderMode", - "StyleURL", - // "EventTypes", "CameraModes", + "StyleURL", "StyleSource", - "LineJoin", - "OfflinePackDownloadState", - // "OfflineCallbackName", // Methods diff --git a/android/src/main/java/org/maplibre/reactnative/modules/MLRNModule.java b/android/src/main/java/org/maplibre/reactnative/modules/MLRNModule.java index 4ea0c9398..b35d8741f 100644 --- a/android/src/main/java/org/maplibre/reactnative/modules/MLRNModule.java +++ b/android/src/main/java/org/maplibre/reactnative/modules/MLRNModule.java @@ -11,9 +11,7 @@ import com.facebook.react.module.annotations.ReactModule; import org.maplibre.android.MapLibre; import org.maplibre.android.WellKnownTileServer; -import org.maplibre.android.style.layers.Property; import org.maplibre.reactnative.components.camera.constants.CameraMode; -import org.maplibre.reactnative.components.styles.MLRNStyleValue; import org.maplibre.reactnative.components.styles.sources.MLRNSource; import org.maplibre.reactnative.events.constants.EventTypes; import org.maplibre.reactnative.http.CustomHeadersInterceptor; @@ -99,127 +97,6 @@ public Map getConstants() { Map styleSourceConsts = new HashMap<>(); styleSourceConsts.put("DefaultSourceID", MLRNSource.DEFAULT_ID); - // interpolation modes - Map interpolationModes = new HashMap<>(); - interpolationModes.put("Exponential", MLRNStyleValue.InterpolationModeExponential); - interpolationModes.put("Categorical", MLRNStyleValue.InterpolationModeCategorical); - interpolationModes.put("Interval", MLRNStyleValue.InterpolationModeInterval); - interpolationModes.put("Identity", MLRNStyleValue.InterpolationModeIdentity); - - // line layer constants - Map lineJoin = new HashMap<>(); - lineJoin.put("Bevel", Property.LINE_JOIN_BEVEL); - lineJoin.put("Round", Property.LINE_JOIN_ROUND); - lineJoin.put("Miter", Property.LINE_JOIN_MITER); - - Map lineCap = new HashMap<>(); - lineCap.put("Butt", Property.LINE_CAP_BUTT); - lineCap.put("Round", Property.LINE_CAP_ROUND); - lineCap.put("Square", Property.LINE_CAP_SQUARE); - - Map lineTranslateAnchor = new HashMap<>(); - lineTranslateAnchor.put("Map", Property.LINE_TRANSLATE_ANCHOR_MAP); - lineTranslateAnchor.put("Viewport", Property.LINE_TRANSLATE_ANCHOR_VIEWPORT); - - // circle layer constants - Map circlePitchScale = new HashMap<>(); - circlePitchScale.put("Map", Property.CIRCLE_PITCH_SCALE_MAP); - circlePitchScale.put("Viewport", Property.CIRCLE_PITCH_SCALE_VIEWPORT); - - Map circleTranslateAnchor = new HashMap<>(); - circleTranslateAnchor.put("Map", Property.CIRCLE_TRANSLATE_ANCHOR_MAP); - circleTranslateAnchor.put("Viewport", Property.CIRCLE_TRANSLATE_ANCHOR_VIEWPORT); - - Map circlePitchAlignment = new HashMap<>(); - circlePitchAlignment.put("Map", Property.CIRCLE_PITCH_ALIGNMENT_MAP); - circlePitchAlignment.put("Viewport", Property.CIRCLE_PITCH_ALIGNMENT_VIEWPORT); - - // fill extrusion layer constants - Map fillExtrusionTranslateAnchor = new HashMap<>(); - fillExtrusionTranslateAnchor.put("Map", Property.FILL_EXTRUSION_TRANSLATE_ANCHOR_MAP); - fillExtrusionTranslateAnchor.put("Viewport", Property.FILL_EXTRUSION_TRANSLATE_ANCHOR_VIEWPORT); - - // fill layer constants - Map fillTranslateAnchor = new HashMap<>(); - fillTranslateAnchor.put("Map", Property.FILL_TRANSLATE_ANCHOR_MAP); - fillTranslateAnchor.put("Viewport", Property.FILL_TRANSLATE_ANCHOR_VIEWPORT); - - // symbol layer constants - Map iconRotationAlignment = new HashMap<>(); - iconRotationAlignment.put("Auto", Property.ICON_ROTATION_ALIGNMENT_AUTO); - iconRotationAlignment.put("Map", Property.ICON_ROTATION_ALIGNMENT_MAP); - iconRotationAlignment.put("Viewport", Property.ICON_ROTATION_ALIGNMENT_VIEWPORT); - - Map iconTextFit = new HashMap<>(); - iconTextFit.put("None", Property.ICON_TEXT_FIT_NONE); - iconTextFit.put("Width", Property.ICON_TEXT_FIT_WIDTH); - iconTextFit.put("Height", Property.ICON_TEXT_FIT_HEIGHT); - iconTextFit.put("Both", Property.ICON_TEXT_FIT_BOTH); - - Map iconAnchor = new HashMap<>(); - iconAnchor.put("Center", Property.ICON_ANCHOR_CENTER); - iconAnchor.put("Left", Property.ICON_ANCHOR_LEFT); - iconAnchor.put("Right", Property.ICON_ANCHOR_RIGHT); - iconAnchor.put("Top", Property.ICON_ANCHOR_TOP); - iconAnchor.put("Bottom", Property.ICON_ANCHOR_BOTTOM); - iconAnchor.put("TopLeft", Property.ICON_ANCHOR_TOP_LEFT); - iconAnchor.put("TopRight", Property.ICON_ANCHOR_TOP_RIGHT); - iconAnchor.put("BottomLeft", Property.ICON_ANCHOR_BOTTOM_LEFT); - iconAnchor.put("BottomRight", Property.ICON_ANCHOR_BOTTOM_RIGHT); - - Map iconPitchAlignment = new HashMap<>(); - iconPitchAlignment.put("Auto", Property.ICON_PITCH_ALIGNMENT_AUTO); - iconPitchAlignment.put("Map", Property.ICON_PITCH_ALIGNMENT_MAP); - iconPitchAlignment.put("Viewport", Property.ICON_PITCH_ALIGNMENT_VIEWPORT); - - Map iconTranslateAnchor = new HashMap<>(); - iconTranslateAnchor.put("Map", Property.ICON_TRANSLATE_ANCHOR_MAP); - iconTranslateAnchor.put("Viewport", Property.ICON_TRANSLATE_ANCHOR_VIEWPORT); - - Map symbolPlacement = new HashMap<>(); - symbolPlacement.put("Line", Property.SYMBOL_PLACEMENT_LINE); - symbolPlacement.put("Point", Property.SYMBOL_PLACEMENT_POINT); - - Map textAnchor = new HashMap<>(); - textAnchor.put("Center", Property.TEXT_ANCHOR_CENTER); - textAnchor.put("Left", Property.TEXT_ANCHOR_LEFT); - textAnchor.put("Right", Property.TEXT_ANCHOR_RIGHT); - textAnchor.put("Top", Property.TEXT_ANCHOR_TOP); - textAnchor.put("Bottom", Property.TEXT_ANCHOR_BOTTOM); - textAnchor.put("TopLeft", Property.TEXT_ANCHOR_TOP_LEFT); - textAnchor.put("TopRight", Property.TEXT_ANCHOR_TOP_RIGHT); - textAnchor.put("BottomLeft", Property.TEXT_ANCHOR_BOTTOM_LEFT); - textAnchor.put("BottomRight", Property.TEXT_ANCHOR_BOTTOM_RIGHT); - - Map textJustify = new HashMap<>(); - textJustify.put("Center", Property.TEXT_JUSTIFY_CENTER); - textJustify.put("Left", Property.TEXT_JUSTIFY_LEFT); - textJustify.put("Right", Property.TEXT_JUSTIFY_RIGHT); - - Map textPitchAlignment = new HashMap<>(); - textPitchAlignment.put("Auto", Property.TEXT_PITCH_ALIGNMENT_AUTO); - textPitchAlignment.put("Map", Property.TEXT_PITCH_ALIGNMENT_MAP); - textPitchAlignment.put("Viewport", Property.TEXT_PITCH_ALIGNMENT_VIEWPORT); - - Map textRotationAlignment = new HashMap<>(); - textRotationAlignment.put("Auto", Property.TEXT_ROTATION_ALIGNMENT_AUTO); - textRotationAlignment.put("Map", Property.TEXT_ROTATION_ALIGNMENT_MAP); - textRotationAlignment.put("Viewport", Property.TEXT_ROTATION_ALIGNMENT_VIEWPORT); - - Map textTransform = new HashMap<>(); - textTransform.put("None", Property.TEXT_TRANSFORM_NONE); - textTransform.put("Lowercase", Property.TEXT_TRANSFORM_LOWERCASE); - textTransform.put("Uppercase", Property.TEXT_TRANSFORM_UPPERCASE); - - Map textTranslateAnchor = new HashMap<>(); - textTranslateAnchor.put("Map", Property.TEXT_TRANSLATE_ANCHOR_MAP); - textTranslateAnchor.put("Viewport", Property.TEXT_TRANSLATE_ANCHOR_VIEWPORT); - - // light constants - Map lightAnchor = new HashMap<>(); - lightAnchor.put("Map", Property.ANCHOR_MAP); - lightAnchor.put("Viewport", Property.ANCHOR_VIEWPORT); - // offline region download states Map offlinePackDownloadStates = new HashMap<>(); offlinePackDownloadStates.put("Inactive", MLRNOfflineModule.INACTIVE_REGION_DOWNLOAD_STATE); @@ -242,28 +119,6 @@ public Map getConstants() { .put("UserLocationVerticalAlignment", userLocationVerticalAlignment) .put("CameraModes", cameraModes) .put("StyleSource", styleSourceConsts) - .put("InterpolationMode", interpolationModes) - .put("LineJoin", lineJoin) - .put("LineCap", lineCap) - .put("LineTranslateAnchor", lineTranslateAnchor) - .put("CirclePitchScale", circlePitchScale) - .put("CircleTranslateAnchor", circleTranslateAnchor) - .put("CirclePitchAlignment", circlePitchAlignment) - .put("FillExtrusionTranslateAnchor", fillExtrusionTranslateAnchor) - .put("FillTranslateAnchor", fillTranslateAnchor) - .put("IconRotationAlignment", iconRotationAlignment) - .put("IconTextFit", iconTextFit) - .put("IconTranslateAnchor", iconTranslateAnchor) - .put("SymbolPlacement", symbolPlacement) - .put("IconAnchor", iconAnchor) - .put("TextAnchor", textAnchor) - .put("TextJustify", textJustify) - .put("IconPitchAlignment", iconPitchAlignment) - .put("TextPitchAlignment", textPitchAlignment) - .put("TextRotationAlignment", textRotationAlignment) - .put("TextTransform", textTransform) - .put("TextTranslateAnchor", textTranslateAnchor) - .put("LightAnchor", lightAnchor) .put("OfflinePackDownloadState", offlinePackDownloadStates) .put("OfflineCallbackName", offlineModuleCallbackNames) .put("LocationCallbackName", locationModuleCallbackNames) diff --git a/ios/MLRN/MLRNModule.m b/ios/MLRN/MLRNModule.m index 7a5658788..33aa9359e 100644 --- a/ios/MLRN/MLRNModule.m +++ b/ios/MLRN/MLRNModule.m @@ -71,120 +71,6 @@ + (BOOL)requiresMainQueueSetup NSMutableDictionary *styleSourceConsts = [[NSMutableDictionary alloc] init]; [styleSourceConsts setObject:DEFAULT_SOURCE_ID forKey:@"DefaultSourceID"]; - // line layer constants - NSMutableDictionary *lineJoin = [[NSMutableDictionary alloc] init]; - [lineJoin setObject:@(MLNLineJoinBevel) forKey:@"Bevel"]; - [lineJoin setObject:@(MLNLineJoinRound) forKey:@"Round"]; - [lineJoin setObject:@(MLNLineJoinMiter) forKey:@"Miter"]; - - NSMutableDictionary *lineCap = [[NSMutableDictionary alloc] init]; - [lineCap setObject:@(MLNLineCapButt) forKey:@"Butt"]; - [lineCap setObject:@(MLNLineCapRound) forKey:@"Round"]; - [lineCap setObject:@(MLNLineCapSquare) forKey:@"Square"]; - - NSMutableDictionary *lineTranslateAnchor = [[NSMutableDictionary alloc] init]; - [lineTranslateAnchor setObject:@(MLNLineTranslationAnchorMap) forKey:@"Map"]; - [lineTranslateAnchor setObject:@(MLNLineTranslationAnchorViewport) forKey:@"Viewport"]; - - // circle layer constants - NSMutableDictionary *circlePitchScale = [[NSMutableDictionary alloc] init]; - [circlePitchScale setObject:@(MLNCircleScaleAlignmentMap) forKey:@"Map"]; - [circlePitchScale setObject:@(MLNCircleScaleAlignmentViewport) forKey:@"Viewport"]; - - NSMutableDictionary *circlePitchAlignment = [[NSMutableDictionary alloc] init]; - [circlePitchAlignment setObject:@(MLNCirclePitchAlignmentMap) forKey:@"Map"]; - [circlePitchAlignment setObject:@(MLNCirclePitchAlignmentViewport) forKey:@"Viewport"]; - - NSMutableDictionary *circleTranslateAnchor = [[NSMutableDictionary alloc] init]; - [circleTranslateAnchor setObject:@(MLNCircleTranslationAnchorMap) forKey:@"Map"]; - [circleTranslateAnchor setObject:@(MLNCircleTranslationAnchorViewport) forKey:@"Viewport"]; - - // fill extrusion layer constants - NSMutableDictionary *fillExtrusionTranslateAnchor = [[NSMutableDictionary alloc] init]; - [fillExtrusionTranslateAnchor setObject:@(MLNFillExtrusionTranslationAnchorMap) forKey:@"Map"]; - [fillExtrusionTranslateAnchor setObject:@(MLNFillExtrusionTranslationAnchorViewport) forKey:@"Viewport"]; - - // fill layer constants - NSMutableDictionary *fillTranslateAnchor = [[NSMutableDictionary alloc] init]; - [fillTranslateAnchor setObject:@(MLNFillTranslationAnchorMap) forKey:@"Map"]; - [fillTranslateAnchor setObject:@(MLNFillTranslationAnchorViewport) forKey:@"Viewport"]; - - // symbol layer constants - NSMutableDictionary *iconRotationAlignment = [[NSMutableDictionary alloc] init]; - [iconRotationAlignment setObject:@(MLNIconRotationAlignmentAuto) forKey:@"Auto"]; - [iconRotationAlignment setObject:@(MLNIconRotationAlignmentMap) forKey:@"Map"]; - [iconRotationAlignment setObject:@(MLNIconRotationAlignmentViewport) forKey:@"Viewport"]; - - NSMutableDictionary *iconTextFit = [[NSMutableDictionary alloc] init]; - [iconTextFit setObject:@(MLNIconTextFitNone) forKey:@"None"]; - [iconTextFit setObject:@(MLNIconTextFitWidth) forKey:@"Width"]; - [iconTextFit setObject:@(MLNIconTextFitHeight) forKey:@"Height"]; - [iconTextFit setObject:@(MLNIconTextFitBoth) forKey:@"Both"]; - - NSMutableDictionary *iconAnchor = [[NSMutableDictionary alloc] init]; - [iconAnchor setObject:@(MLNIconAnchorCenter) forKey:@"Center"]; - [iconAnchor setObject:@(MLNIconAnchorTop) forKey:@"Top"]; - [iconAnchor setObject:@(MLNIconAnchorBottom) forKey:@"Bottom"]; - [iconAnchor setObject:@(MLNIconAnchorLeft) forKey:@"Left"]; - [iconAnchor setObject:@(MLNIconAnchorRight) forKey:@"Right"]; - [iconAnchor setObject:@(MLNIconAnchorTopLeft) forKey:@"TopLeft"]; - [iconAnchor setObject:@(MLNIconAnchorTopRight) forKey:@"TopRight"]; - [iconAnchor setObject:@(MLNIconAnchorBottomLeft) forKey:@"BottomLeft"]; - [iconAnchor setObject:@(MLNIconAnchorBottomRight) forKey:@"BottomRight"]; - - NSMutableDictionary *iconTranslateAnchor = [[NSMutableDictionary alloc] init]; - [iconTranslateAnchor setObject:@(MLNIconTranslationAnchorMap) forKey:@"Map"]; - [iconTranslateAnchor setObject:@(MLNIconTranslationAnchorViewport) forKey:@"Viewport"]; - - NSMutableDictionary *iconPitchAlignment = [[NSMutableDictionary alloc] init]; - [iconPitchAlignment setObject:@(MLNIconPitchAlignmentAuto) forKey:@"Auto"]; - [iconPitchAlignment setObject:@(MLNIconPitchAlignmentMap) forKey:@"Map"]; - [iconPitchAlignment setObject:@(MLNIconPitchAlignmentViewport) forKey:@"Viewport"]; - - NSMutableDictionary *symbolPlacement = [[NSMutableDictionary alloc] init]; - [symbolPlacement setObject:@(MLNSymbolPlacementLine) forKey:@"Line"]; - [symbolPlacement setObject:@(MLNSymbolPlacementPoint) forKey:@"Point"]; - - NSMutableDictionary *textAnchor = [[NSMutableDictionary alloc] init]; - [textAnchor setObject:@(MLNTextAnchorCenter) forKey:@"Center"]; - [textAnchor setObject:@(MLNTextAnchorLeft) forKey:@"Left"]; - [textAnchor setObject:@(MLNTextAnchorRight) forKey:@"Right"]; - [textAnchor setObject:@(MLNTextAnchorTop) forKey:@"Top"]; - [textAnchor setObject:@(MLNTextAnchorBottom) forKey:@"Bottom"]; - [textAnchor setObject:@(MLNTextAnchorTopLeft) forKey:@"TopLeft"]; - [textAnchor setObject:@(MLNTextAnchorTopRight) forKey:@"TopRight"]; - [textAnchor setObject:@(MLNTextAnchorBottomLeft) forKey:@"BottomLeft"]; - [textAnchor setObject:@(MLNTextAnchorBottomRight) forKey:@"BottomRight"]; - - NSMutableDictionary *textJustify = [[NSMutableDictionary alloc] init]; - [textJustify setObject:@(MLNTextJustificationCenter) forKey:@"Center"]; - [textJustify setObject:@(MLNTextJustificationLeft) forKey:@"Left"]; - [textJustify setObject:@(MLNTextJustificationRight) forKey:@"Right"]; - - NSMutableDictionary *textPitchAlignment = [[NSMutableDictionary alloc] init]; - [textPitchAlignment setObject:@(MLNTextPitchAlignmentAuto) forKey:@"Auto"]; - [textPitchAlignment setObject:@(MLNTextPitchAlignmentMap) forKey:@"Map"]; - [textPitchAlignment setObject:@(MLNTextPitchAlignmentViewport) forKey:@"Viewport"]; - - NSMutableDictionary *textRotationAlignment = [[NSMutableDictionary alloc] init]; - [textRotationAlignment setObject:@(MLNTextRotationAlignmentAuto) forKey:@"Auto"]; - [textRotationAlignment setObject:@(MLNTextRotationAlignmentMap) forKey:@"Map"]; - [textRotationAlignment setObject:@(MLNTextRotationAlignmentViewport) forKey:@"Viewport"]; - - NSMutableDictionary *textTransform = [[NSMutableDictionary alloc] init]; - [textTransform setObject:@(MLNTextTransformNone) forKey:@"None"]; - [textTransform setObject:@(MLNTextTransformLowercase) forKey:@"Lowercase"]; - [textTransform setObject:@(MLNTextTransformUppercase) forKey:@"Uppercase"]; - - NSMutableDictionary *textTranslateAnchor = [[NSMutableDictionary alloc] init]; - [textTranslateAnchor setObject:@(MLNTextTranslationAnchorMap) forKey:@"Map"]; - [textTranslateAnchor setObject:@(MLNTextTranslationAnchorViewport) forKey:@"Viewport"]; - - // light constants - NSMutableDictionary *lightAnchor = [[NSMutableDictionary alloc] init]; - [lightAnchor setObject:@(MLNLightAnchorMap) forKey:@"Map"]; - [lightAnchor setObject:@(MLNLightAnchorViewport) forKey:@"Viewport"]; - // offline module callback names NSMutableDictionary *offlineModuleCallbackNames = [[NSMutableDictionary alloc] init]; [offlineModuleCallbackNames setObject:RCT_MAPBOX_OFFLINE_CALLBACK_ERROR forKey:@"Error"]; @@ -202,27 +88,6 @@ + (BOOL)requiresMainQueueSetup @"UserLocationVerticalAlignment": userLocationVerticalAlignment, @"CameraModes": cameraModes, @"StyleSource": styleSourceConsts, - @"LineJoin": lineJoin, - @"LineCap": lineCap, - @"LineTranslateAnchor": lineTranslateAnchor, - @"CirclePitchScale": circlePitchScale, - @"CircleTranslateAnchor": circleTranslateAnchor, - @"CirclePitchAlignment": circlePitchAlignment, - @"FillExtrusionTranslateAnchor": fillExtrusionTranslateAnchor, - @"FillTranslateAnchor": fillTranslateAnchor, - @"IconRotationAlignment": iconRotationAlignment, - @"IconTextFit": iconTextFit, - @"IconTranslateAnchor": iconTranslateAnchor, - @"IconAnchor": iconAnchor, - @"IconPitchAlignment": iconPitchAlignment, - @"SymbolPlacement": symbolPlacement, - @"TextAnchor": textAnchor, - @"TextJustify": textJustify, - @"TextPitchAlignment": textPitchAlignment, - @"TextRotationAlignment": textRotationAlignment, - @"TextTransform": textTransform, - @"TextTranslateAnchor": textTranslateAnchor, - @"LightAnchor": lightAnchor, @"OfflineCallbackName": offlineModuleCallbackNames, @"OfflinePackDownloadState": offlinePackDownloadState, @"LocationCallbackName": locationModuleEvents diff --git a/jest-setup.ts b/jest-setup.ts index ee8540f41..cf33ba785 100644 --- a/jest-setup.ts +++ b/jest-setup.ts @@ -35,40 +35,6 @@ NativeModules.MLRNModule = { ]), CameraModes: keyMirror(["Flight", "Ease", "None"]), StyleSource: keyMirror(["DefaultSourceID"]), - InterpolationMode: keyMirror([ - "Exponential", - "Categorical", - "Interval", - "Identity", - ]), - LineJoin: keyMirror(["Bevel", "Round", "Miter"]), - LineCap: keyMirror(["Butt", "Round", "Square"]), - LineTranslateAnchor: keyMirror(["Map", "Viewport"]), - CirclePitchScale: keyMirror(["Map", "Viewport"]), - CircleTranslateAnchor: keyMirror(["Map", "Viewport"]), - FillExtrusionTranslateAnchor: keyMirror(["Map", "Viewport"]), - FillTranslateAnchor: keyMirror(["Map", "Viewport"]), - IconRotationAlignment: keyMirror(["Auto", "Map", "Viewport"]), - IconTextFit: keyMirror(["None", "Width", "Height", "Both"]), - IconTranslateAnchor: keyMirror(["Map", "Viewport"]), - SymbolPlacement: keyMirror(["Line", "Point"]), - TextAnchor: keyMirror([ - "Center", - "Left", - "Right", - "Top", - "Bottom", - "TopLeft", - "TopRight", - "BottomLeft", - "BottomRight", - ]), - TextJustify: keyMirror(["Center", "Left", "Right"]), - TextPitchAlignment: keyMirror(["Auto", "Map", "Viewport"]), - TextRotationAlignment: keyMirror(["Auto", "Map", "Viewport"]), - TextTransform: keyMirror(["None", "Lowercase", "Uppercase"]), - TextTranslateAnchor: keyMirror(["Map", "Viewport"]), - LightAnchor: keyMirror(["Map", "Viewport"]), OfflinePackDownloadState: keyMirror(["Inactive", "Active", "Complete"]), OfflineCallbackName: keyMirror(["Progress", "Error"]), diff --git a/src/MLRNModule.ts b/src/MLRNModule.ts index c628daa7e..59cab9a52 100644 --- a/src/MLRNModule.ts +++ b/src/MLRNModule.ts @@ -9,20 +9,18 @@ interface IMLRNModule { Linear: CameraMode.Linear; None: CameraMode.None; }; - StyleURL: { - Default: URL; - }; + OfflinePackDownloadState: { Inactive: string | number; Active: string | number; Complete: string | number; Unknown?: string | number; }; - LineJoin: { - Bevel: string | number; - Round: string | number; - Miter: string | number; + + StyleURL: { + Default: URL; }; + StyleSource: { DefaultSourceID: string; }; @@ -40,10 +38,9 @@ const MLRNModule: IMLRNModule = Object.create(NativeModules.MLRNModule); export const { CameraModes, - StyleURL, OfflinePackDownloadState, - LineJoin, StyleSource, + StyleURL, setAccessToken, getAccessToken, From e0013361f4ffff51faa68f464a2dce1cd1d6e358 Mon Sep 17 00:00:00 2001 From: Kilian Finger Date: Sun, 15 Dec 2024 15:28:19 +0100 Subject: [PATCH 06/19] refactor: cleanup getStylePropertyType --- scripts/codegen.ts | 4 +- ...Map.ts.ejs => getStylePropertyType.ts.ejs} | 32 +-- scripts/utils/TemplateHelpers.ts | 12 +- src/utils/StyleValue.ts | 4 +- src/utils/getStylePropertyType.ts | 265 ++++++++++++++++++ src/utils/styleMap.ts | 265 ------------------ 6 files changed, 291 insertions(+), 291 deletions(-) rename scripts/templates/{styleMap.ts.ejs => getStylePropertyType.ts.ejs} (71%) create mode 100644 src/utils/getStylePropertyType.ts delete mode 100644 src/utils/styleMap.ts diff --git a/scripts/codegen.ts b/scripts/codegen.ts index fee15098b..581602a37 100644 --- a/scripts/codegen.ts +++ b/scripts/codegen.ts @@ -52,8 +52,8 @@ const TEMPLATE_MAPPINGS = [ output: path.join(ANDROID_OUTPUT_PATH, "MLRNStyleFactory.java"), }, { - input: path.join(TEMPLATES_PATH, "styleMap.ts.ejs"), - output: path.join(JS_OUTPUT_PATH, "styleMap.ts"), + input: path.join(TEMPLATES_PATH, "getStylePropertyType.ts.ejs"), + output: path.join(JS_OUTPUT_PATH, "getStylePropertyType.ts"), }, ]; diff --git a/scripts/templates/styleMap.ts.ejs b/scripts/templates/getStylePropertyType.ts.ejs similarity index 71% rename from scripts/templates/styleMap.ts.ejs rename to scripts/templates/getStylePropertyType.ts.ejs index bfdae141e..7f56fdece 100644 --- a/scripts/templates/styleMap.ts.ejs +++ b/scripts/templates/getStylePropertyType.ts.ejs @@ -8,7 +8,7 @@ import { isAndroid } from './index'; -export const StyleTypes = { +const StyleType = { Constant: 'constant', Color: 'color', Transition: 'transition', @@ -18,34 +18,24 @@ export const StyleTypes = { Enum: 'enum', }; -export function getStyleType(styleProp: keyof typeof styleExtras): string { - if (!isAndroid() && styleExtras[styleProp]) { - return styleExtras[styleProp].iosType; - } - if (styleMap[styleProp]) { - return styleMap[styleProp]; - } - throw new Error(`${styleProp} is not a valid MapLibre layer style`); -} - -const styleMap = { +const STYLE_MAP = { <%_ for (let layer of layers) { _%> <%_ for (let prop of layer.properties) { _%> <%_ if (prop.name !== 'visibility') { _%> <%= prop.name %>: <%- helpers.jsStyleType(prop) %>, <%_ if (prop.transition) { _%> - <%= prop.name %>Transition: StyleTypes.Transition, + <%= prop.name %>Transition: StyleType.Transition, <%_ } _%> <%_ } _%> <%_ } _%> <%_ } _%> - visibility: StyleTypes.Constant, + visibility: StyleType.Constant, }; -export const styleExtras = { +const STYLE_OVERRIDES = { // padding iconTextFitPadding: { iosType: 'edgeinsets', @@ -83,4 +73,14 @@ export const styleExtras = { }, }; -export default styleMap; +export function getStylePropertyType(styleProperty: keyof typeof STYLE_OVERRIDES): string { + if (!isAndroid() && STYLE_OVERRIDES[styleProperty]) { + return STYLE_OVERRIDES[styleProperty].iosType; + } + + if (STYLE_MAP[styleProperty]) { + return STYLE_MAP[styleProperty]; + } + + throw new Error(`${styleProperty} is not a valid MapLibre layer style`); +} diff --git a/scripts/utils/TemplateHelpers.ts b/scripts/utils/TemplateHelpers.ts index f3b8171a6..6c6c71a02 100644 --- a/scripts/utils/TemplateHelpers.ts +++ b/scripts/utils/TemplateHelpers.ts @@ -176,26 +176,26 @@ export function androidGetConfigType(androidType: string, prop: any) { export function jsStyleType(prop: any) { if (prop.type === "color") { - return "StyleTypes.Color"; + return "StyleType.Color"; } if (prop.type === "enum") { - return "StyleTypes.Enum"; + return "StyleType.Enum"; } if (prop.type === "string" && prop.image) { - return "StyleTypes.Image"; + return "StyleType.Image"; } if (prop.type === "resolvedImage") { - return "StyleTypes.Image"; + return "StyleType.Image"; } if (prop.name.indexOf("Translate") !== -1) { - return "StyleTypes.Translation"; + return "StyleType.Translation"; } - return "StyleTypes.Constant"; + return "StyleType.Constant"; } export function dtsInterfaceType(prop: any) { diff --git a/src/utils/StyleValue.ts b/src/utils/StyleValue.ts index cec2c0cde..aafd05386 100644 --- a/src/utils/StyleValue.ts +++ b/src/utils/StyleValue.ts @@ -5,7 +5,7 @@ import BridgeValue, { type StyleValueJSON, } from "./BridgeValue"; import { type AllLayerStyleProps } from "./MapLibreRNStyles"; -import { getStyleType } from "./styleMap"; +import { getStylePropertyType } from "./getStylePropertyType"; export type StyleValue = { styletype: string; @@ -22,7 +22,7 @@ export function transformStyle( const nativeStyle: { [key: string]: StyleValue } = {}; const styleProps = Object.keys(style) as (keyof typeof style)[]; for (const styleProp of styleProps) { - const styleType = getStyleType(styleProp); + const styleType = getStylePropertyType(styleProp); let rawStyle: RawValueType | undefined = style[styleProp]; if (styleType === "color" && typeof rawStyle === "string") { diff --git a/src/utils/getStylePropertyType.ts b/src/utils/getStylePropertyType.ts new file mode 100644 index 000000000..e4c8b3786 --- /dev/null +++ b/src/utils/getStylePropertyType.ts @@ -0,0 +1,265 @@ +/* eslint-disable */ +// DO NOT MODIFY +// This file is auto-generated from scripts/templates/getStylePropertyType.ts.ejs + +import { isAndroid } from "./index"; + +const StyleType = { + Constant: "constant", + Color: "color", + Transition: "transition", + Translation: "translation", + Function: "function", + Image: "image", + Enum: "enum", +}; + +const STYLE_MAP = { + fillSortKey: StyleType.Constant, + fillAntialias: StyleType.Constant, + fillOpacity: StyleType.Constant, + fillOpacityTransition: StyleType.Transition, + fillColor: StyleType.Color, + fillColorTransition: StyleType.Transition, + fillOutlineColor: StyleType.Color, + fillOutlineColorTransition: StyleType.Transition, + fillTranslate: StyleType.Translation, + fillTranslateTransition: StyleType.Transition, + fillTranslateAnchor: StyleType.Enum, + fillPattern: StyleType.Image, + fillPatternTransition: StyleType.Transition, + + lineCap: StyleType.Enum, + lineJoin: StyleType.Enum, + lineMiterLimit: StyleType.Constant, + lineRoundLimit: StyleType.Constant, + lineSortKey: StyleType.Constant, + lineOpacity: StyleType.Constant, + lineOpacityTransition: StyleType.Transition, + lineColor: StyleType.Color, + lineColorTransition: StyleType.Transition, + lineTranslate: StyleType.Translation, + lineTranslateTransition: StyleType.Transition, + lineTranslateAnchor: StyleType.Enum, + lineWidth: StyleType.Constant, + lineWidthTransition: StyleType.Transition, + lineGapWidth: StyleType.Constant, + lineGapWidthTransition: StyleType.Transition, + lineOffset: StyleType.Constant, + lineOffsetTransition: StyleType.Transition, + lineBlur: StyleType.Constant, + lineBlurTransition: StyleType.Transition, + lineDasharray: StyleType.Constant, + lineDasharrayTransition: StyleType.Transition, + linePattern: StyleType.Image, + linePatternTransition: StyleType.Transition, + lineGradient: StyleType.Color, + + symbolPlacement: StyleType.Enum, + symbolSpacing: StyleType.Constant, + symbolAvoidEdges: StyleType.Constant, + symbolSortKey: StyleType.Constant, + symbolZOrder: StyleType.Enum, + iconAllowOverlap: StyleType.Constant, + iconIgnorePlacement: StyleType.Constant, + iconOptional: StyleType.Constant, + iconRotationAlignment: StyleType.Enum, + iconSize: StyleType.Constant, + iconTextFit: StyleType.Enum, + iconTextFitPadding: StyleType.Constant, + iconImage: StyleType.Image, + iconRotate: StyleType.Constant, + iconPadding: StyleType.Constant, + iconKeepUpright: StyleType.Constant, + iconOffset: StyleType.Constant, + iconAnchor: StyleType.Enum, + iconPitchAlignment: StyleType.Enum, + textPitchAlignment: StyleType.Enum, + textRotationAlignment: StyleType.Enum, + textField: StyleType.Constant, + textFont: StyleType.Constant, + textSize: StyleType.Constant, + textMaxWidth: StyleType.Constant, + textLineHeight: StyleType.Constant, + textLetterSpacing: StyleType.Constant, + textJustify: StyleType.Enum, + textRadialOffset: StyleType.Constant, + textVariableAnchor: StyleType.Constant, + textAnchor: StyleType.Enum, + textMaxAngle: StyleType.Constant, + textWritingMode: StyleType.Constant, + textRotate: StyleType.Constant, + textPadding: StyleType.Constant, + textKeepUpright: StyleType.Constant, + textTransform: StyleType.Enum, + textOffset: StyleType.Constant, + textAllowOverlap: StyleType.Constant, + textIgnorePlacement: StyleType.Constant, + textOptional: StyleType.Constant, + iconOpacity: StyleType.Constant, + iconOpacityTransition: StyleType.Transition, + iconColor: StyleType.Color, + iconColorTransition: StyleType.Transition, + iconHaloColor: StyleType.Color, + iconHaloColorTransition: StyleType.Transition, + iconHaloWidth: StyleType.Constant, + iconHaloWidthTransition: StyleType.Transition, + iconHaloBlur: StyleType.Constant, + iconHaloBlurTransition: StyleType.Transition, + iconTranslate: StyleType.Translation, + iconTranslateTransition: StyleType.Transition, + iconTranslateAnchor: StyleType.Enum, + textOpacity: StyleType.Constant, + textOpacityTransition: StyleType.Transition, + textColor: StyleType.Color, + textColorTransition: StyleType.Transition, + textHaloColor: StyleType.Color, + textHaloColorTransition: StyleType.Transition, + textHaloWidth: StyleType.Constant, + textHaloWidthTransition: StyleType.Transition, + textHaloBlur: StyleType.Constant, + textHaloBlurTransition: StyleType.Transition, + textTranslate: StyleType.Translation, + textTranslateTransition: StyleType.Transition, + textTranslateAnchor: StyleType.Enum, + + circleSortKey: StyleType.Constant, + circleRadius: StyleType.Constant, + circleRadiusTransition: StyleType.Transition, + circleColor: StyleType.Color, + circleColorTransition: StyleType.Transition, + circleBlur: StyleType.Constant, + circleBlurTransition: StyleType.Transition, + circleOpacity: StyleType.Constant, + circleOpacityTransition: StyleType.Transition, + circleTranslate: StyleType.Translation, + circleTranslateTransition: StyleType.Transition, + circleTranslateAnchor: StyleType.Enum, + circlePitchScale: StyleType.Enum, + circlePitchAlignment: StyleType.Enum, + circleStrokeWidth: StyleType.Constant, + circleStrokeWidthTransition: StyleType.Transition, + circleStrokeColor: StyleType.Color, + circleStrokeColorTransition: StyleType.Transition, + circleStrokeOpacity: StyleType.Constant, + circleStrokeOpacityTransition: StyleType.Transition, + + heatmapRadius: StyleType.Constant, + heatmapRadiusTransition: StyleType.Transition, + heatmapWeight: StyleType.Constant, + heatmapIntensity: StyleType.Constant, + heatmapIntensityTransition: StyleType.Transition, + heatmapColor: StyleType.Color, + heatmapOpacity: StyleType.Constant, + heatmapOpacityTransition: StyleType.Transition, + + fillExtrusionOpacity: StyleType.Constant, + fillExtrusionOpacityTransition: StyleType.Transition, + fillExtrusionColor: StyleType.Color, + fillExtrusionColorTransition: StyleType.Transition, + fillExtrusionTranslate: StyleType.Translation, + fillExtrusionTranslateTransition: StyleType.Transition, + fillExtrusionTranslateAnchor: StyleType.Enum, + fillExtrusionPattern: StyleType.Image, + fillExtrusionPatternTransition: StyleType.Transition, + fillExtrusionHeight: StyleType.Constant, + fillExtrusionHeightTransition: StyleType.Transition, + fillExtrusionBase: StyleType.Constant, + fillExtrusionBaseTransition: StyleType.Transition, + fillExtrusionVerticalGradient: StyleType.Constant, + + rasterOpacity: StyleType.Constant, + rasterOpacityTransition: StyleType.Transition, + rasterHueRotate: StyleType.Constant, + rasterHueRotateTransition: StyleType.Transition, + rasterBrightnessMin: StyleType.Constant, + rasterBrightnessMinTransition: StyleType.Transition, + rasterBrightnessMax: StyleType.Constant, + rasterBrightnessMaxTransition: StyleType.Transition, + rasterSaturation: StyleType.Constant, + rasterSaturationTransition: StyleType.Transition, + rasterContrast: StyleType.Constant, + rasterContrastTransition: StyleType.Transition, + rasterResampling: StyleType.Enum, + rasterFadeDuration: StyleType.Constant, + + hillshadeIlluminationDirection: StyleType.Constant, + hillshadeIlluminationAnchor: StyleType.Enum, + hillshadeExaggeration: StyleType.Constant, + hillshadeExaggerationTransition: StyleType.Transition, + hillshadeShadowColor: StyleType.Color, + hillshadeShadowColorTransition: StyleType.Transition, + hillshadeHighlightColor: StyleType.Color, + hillshadeHighlightColorTransition: StyleType.Transition, + hillshadeAccentColor: StyleType.Color, + hillshadeAccentColorTransition: StyleType.Transition, + + backgroundColor: StyleType.Color, + backgroundColorTransition: StyleType.Transition, + backgroundPattern: StyleType.Image, + backgroundPatternTransition: StyleType.Transition, + backgroundOpacity: StyleType.Constant, + backgroundOpacityTransition: StyleType.Transition, + + anchor: StyleType.Enum, + position: StyleType.Constant, + positionTransition: StyleType.Transition, + color: StyleType.Color, + colorTransition: StyleType.Transition, + intensity: StyleType.Constant, + intensityTransition: StyleType.Transition, + + visibility: StyleType.Constant, +}; + +const STYLE_OVERRIDES = { + // padding + iconTextFitPadding: { + iosType: "edgeinsets", + }, + + // offsets + iconOffset: { + iosType: "vector", + }, + textOffset: { + iosType: "vector", + }, + lineOffset: { + iosType: "vector", + }, + + // translates + fillTranslate: { + iosType: "vector", + }, + lineTranslate: { + iosType: "vector", + }, + iconTranslate: { + iosType: "vector", + }, + textTranslate: { + iosType: "vector", + }, + circleTranslate: { + iosType: "vector", + }, + fillExtrusionTranslate: { + iosType: "vector", + }, +}; + +export function getStylePropertyType( + styleProperty: keyof typeof STYLE_OVERRIDES, +): string { + if (!isAndroid() && STYLE_OVERRIDES[styleProperty]) { + return STYLE_OVERRIDES[styleProperty].iosType; + } + + if (STYLE_MAP[styleProperty]) { + return STYLE_MAP[styleProperty]; + } + + throw new Error(`${styleProperty} is not a valid MapLibre layer style`); +} diff --git a/src/utils/styleMap.ts b/src/utils/styleMap.ts deleted file mode 100644 index dbd66dc3d..000000000 --- a/src/utils/styleMap.ts +++ /dev/null @@ -1,265 +0,0 @@ -/* eslint-disable */ -// DO NOT MODIFY -// This file is auto-generated from scripts/templates/styleMap.ts.ejs - -import { isAndroid } from "./index"; - -export const StyleTypes = { - Constant: "constant", - Color: "color", - Transition: "transition", - Translation: "translation", - Function: "function", - Image: "image", - Enum: "enum", -}; - -export function getStyleType(styleProp: keyof typeof styleExtras): string { - if (!isAndroid() && styleExtras[styleProp]) { - return styleExtras[styleProp].iosType; - } - - if (styleMap[styleProp]) { - return styleMap[styleProp]; - } - - throw new Error(`${styleProp} is not a valid MapLibre layer style`); -} - -const styleMap = { - fillSortKey: StyleTypes.Constant, - fillAntialias: StyleTypes.Constant, - fillOpacity: StyleTypes.Constant, - fillOpacityTransition: StyleTypes.Transition, - fillColor: StyleTypes.Color, - fillColorTransition: StyleTypes.Transition, - fillOutlineColor: StyleTypes.Color, - fillOutlineColorTransition: StyleTypes.Transition, - fillTranslate: StyleTypes.Translation, - fillTranslateTransition: StyleTypes.Transition, - fillTranslateAnchor: StyleTypes.Enum, - fillPattern: StyleTypes.Image, - fillPatternTransition: StyleTypes.Transition, - - lineCap: StyleTypes.Enum, - lineJoin: StyleTypes.Enum, - lineMiterLimit: StyleTypes.Constant, - lineRoundLimit: StyleTypes.Constant, - lineSortKey: StyleTypes.Constant, - lineOpacity: StyleTypes.Constant, - lineOpacityTransition: StyleTypes.Transition, - lineColor: StyleTypes.Color, - lineColorTransition: StyleTypes.Transition, - lineTranslate: StyleTypes.Translation, - lineTranslateTransition: StyleTypes.Transition, - lineTranslateAnchor: StyleTypes.Enum, - lineWidth: StyleTypes.Constant, - lineWidthTransition: StyleTypes.Transition, - lineGapWidth: StyleTypes.Constant, - lineGapWidthTransition: StyleTypes.Transition, - lineOffset: StyleTypes.Constant, - lineOffsetTransition: StyleTypes.Transition, - lineBlur: StyleTypes.Constant, - lineBlurTransition: StyleTypes.Transition, - lineDasharray: StyleTypes.Constant, - lineDasharrayTransition: StyleTypes.Transition, - linePattern: StyleTypes.Image, - linePatternTransition: StyleTypes.Transition, - lineGradient: StyleTypes.Color, - - symbolPlacement: StyleTypes.Enum, - symbolSpacing: StyleTypes.Constant, - symbolAvoidEdges: StyleTypes.Constant, - symbolSortKey: StyleTypes.Constant, - symbolZOrder: StyleTypes.Enum, - iconAllowOverlap: StyleTypes.Constant, - iconIgnorePlacement: StyleTypes.Constant, - iconOptional: StyleTypes.Constant, - iconRotationAlignment: StyleTypes.Enum, - iconSize: StyleTypes.Constant, - iconTextFit: StyleTypes.Enum, - iconTextFitPadding: StyleTypes.Constant, - iconImage: StyleTypes.Image, - iconRotate: StyleTypes.Constant, - iconPadding: StyleTypes.Constant, - iconKeepUpright: StyleTypes.Constant, - iconOffset: StyleTypes.Constant, - iconAnchor: StyleTypes.Enum, - iconPitchAlignment: StyleTypes.Enum, - textPitchAlignment: StyleTypes.Enum, - textRotationAlignment: StyleTypes.Enum, - textField: StyleTypes.Constant, - textFont: StyleTypes.Constant, - textSize: StyleTypes.Constant, - textMaxWidth: StyleTypes.Constant, - textLineHeight: StyleTypes.Constant, - textLetterSpacing: StyleTypes.Constant, - textJustify: StyleTypes.Enum, - textRadialOffset: StyleTypes.Constant, - textVariableAnchor: StyleTypes.Constant, - textAnchor: StyleTypes.Enum, - textMaxAngle: StyleTypes.Constant, - textWritingMode: StyleTypes.Constant, - textRotate: StyleTypes.Constant, - textPadding: StyleTypes.Constant, - textKeepUpright: StyleTypes.Constant, - textTransform: StyleTypes.Enum, - textOffset: StyleTypes.Constant, - textAllowOverlap: StyleTypes.Constant, - textIgnorePlacement: StyleTypes.Constant, - textOptional: StyleTypes.Constant, - iconOpacity: StyleTypes.Constant, - iconOpacityTransition: StyleTypes.Transition, - iconColor: StyleTypes.Color, - iconColorTransition: StyleTypes.Transition, - iconHaloColor: StyleTypes.Color, - iconHaloColorTransition: StyleTypes.Transition, - iconHaloWidth: StyleTypes.Constant, - iconHaloWidthTransition: StyleTypes.Transition, - iconHaloBlur: StyleTypes.Constant, - iconHaloBlurTransition: StyleTypes.Transition, - iconTranslate: StyleTypes.Translation, - iconTranslateTransition: StyleTypes.Transition, - iconTranslateAnchor: StyleTypes.Enum, - textOpacity: StyleTypes.Constant, - textOpacityTransition: StyleTypes.Transition, - textColor: StyleTypes.Color, - textColorTransition: StyleTypes.Transition, - textHaloColor: StyleTypes.Color, - textHaloColorTransition: StyleTypes.Transition, - textHaloWidth: StyleTypes.Constant, - textHaloWidthTransition: StyleTypes.Transition, - textHaloBlur: StyleTypes.Constant, - textHaloBlurTransition: StyleTypes.Transition, - textTranslate: StyleTypes.Translation, - textTranslateTransition: StyleTypes.Transition, - textTranslateAnchor: StyleTypes.Enum, - - circleSortKey: StyleTypes.Constant, - circleRadius: StyleTypes.Constant, - circleRadiusTransition: StyleTypes.Transition, - circleColor: StyleTypes.Color, - circleColorTransition: StyleTypes.Transition, - circleBlur: StyleTypes.Constant, - circleBlurTransition: StyleTypes.Transition, - circleOpacity: StyleTypes.Constant, - circleOpacityTransition: StyleTypes.Transition, - circleTranslate: StyleTypes.Translation, - circleTranslateTransition: StyleTypes.Transition, - circleTranslateAnchor: StyleTypes.Enum, - circlePitchScale: StyleTypes.Enum, - circlePitchAlignment: StyleTypes.Enum, - circleStrokeWidth: StyleTypes.Constant, - circleStrokeWidthTransition: StyleTypes.Transition, - circleStrokeColor: StyleTypes.Color, - circleStrokeColorTransition: StyleTypes.Transition, - circleStrokeOpacity: StyleTypes.Constant, - circleStrokeOpacityTransition: StyleTypes.Transition, - - heatmapRadius: StyleTypes.Constant, - heatmapRadiusTransition: StyleTypes.Transition, - heatmapWeight: StyleTypes.Constant, - heatmapIntensity: StyleTypes.Constant, - heatmapIntensityTransition: StyleTypes.Transition, - heatmapColor: StyleTypes.Color, - heatmapOpacity: StyleTypes.Constant, - heatmapOpacityTransition: StyleTypes.Transition, - - fillExtrusionOpacity: StyleTypes.Constant, - fillExtrusionOpacityTransition: StyleTypes.Transition, - fillExtrusionColor: StyleTypes.Color, - fillExtrusionColorTransition: StyleTypes.Transition, - fillExtrusionTranslate: StyleTypes.Translation, - fillExtrusionTranslateTransition: StyleTypes.Transition, - fillExtrusionTranslateAnchor: StyleTypes.Enum, - fillExtrusionPattern: StyleTypes.Image, - fillExtrusionPatternTransition: StyleTypes.Transition, - fillExtrusionHeight: StyleTypes.Constant, - fillExtrusionHeightTransition: StyleTypes.Transition, - fillExtrusionBase: StyleTypes.Constant, - fillExtrusionBaseTransition: StyleTypes.Transition, - fillExtrusionVerticalGradient: StyleTypes.Constant, - - rasterOpacity: StyleTypes.Constant, - rasterOpacityTransition: StyleTypes.Transition, - rasterHueRotate: StyleTypes.Constant, - rasterHueRotateTransition: StyleTypes.Transition, - rasterBrightnessMin: StyleTypes.Constant, - rasterBrightnessMinTransition: StyleTypes.Transition, - rasterBrightnessMax: StyleTypes.Constant, - rasterBrightnessMaxTransition: StyleTypes.Transition, - rasterSaturation: StyleTypes.Constant, - rasterSaturationTransition: StyleTypes.Transition, - rasterContrast: StyleTypes.Constant, - rasterContrastTransition: StyleTypes.Transition, - rasterResampling: StyleTypes.Enum, - rasterFadeDuration: StyleTypes.Constant, - - hillshadeIlluminationDirection: StyleTypes.Constant, - hillshadeIlluminationAnchor: StyleTypes.Enum, - hillshadeExaggeration: StyleTypes.Constant, - hillshadeExaggerationTransition: StyleTypes.Transition, - hillshadeShadowColor: StyleTypes.Color, - hillshadeShadowColorTransition: StyleTypes.Transition, - hillshadeHighlightColor: StyleTypes.Color, - hillshadeHighlightColorTransition: StyleTypes.Transition, - hillshadeAccentColor: StyleTypes.Color, - hillshadeAccentColorTransition: StyleTypes.Transition, - - backgroundColor: StyleTypes.Color, - backgroundColorTransition: StyleTypes.Transition, - backgroundPattern: StyleTypes.Image, - backgroundPatternTransition: StyleTypes.Transition, - backgroundOpacity: StyleTypes.Constant, - backgroundOpacityTransition: StyleTypes.Transition, - - anchor: StyleTypes.Enum, - position: StyleTypes.Constant, - positionTransition: StyleTypes.Transition, - color: StyleTypes.Color, - colorTransition: StyleTypes.Transition, - intensity: StyleTypes.Constant, - intensityTransition: StyleTypes.Transition, - - visibility: StyleTypes.Constant, -}; - -export const styleExtras = { - // padding - iconTextFitPadding: { - iosType: "edgeinsets", - }, - - // offsets - iconOffset: { - iosType: "vector", - }, - textOffset: { - iosType: "vector", - }, - lineOffset: { - iosType: "vector", - }, - - // translates - fillTranslate: { - iosType: "vector", - }, - lineTranslate: { - iosType: "vector", - }, - iconTranslate: { - iosType: "vector", - }, - textTranslate: { - iosType: "vector", - }, - circleTranslate: { - iosType: "vector", - }, - fillExtrusionTranslate: { - iosType: "vector", - }, -}; - -export default styleMap; From c5e946bb2766f74f9096444416044919791ef7df Mon Sep 17 00:00:00 2001 From: Kilian Finger Date: Sun, 15 Dec 2024 15:34:09 +0100 Subject: [PATCH 07/19] refactor: drop Props suffix on style types --- docs/components/BackgroundLayer.md | 2 +- docs/components/CircleLayer.md | 2 +- docs/components/FillExtrusionLayer.md | 2 +- docs/components/FillLayer.md | 2 +- docs/components/HeatmapLayer.md | 2 +- docs/components/Light.md | 2 +- docs/components/LineLayer.md | 2 +- docs/components/RasterLayer.md | 2 +- docs/components/SymbolLayer.md | 2 +- docs/docs.json | 18 +++++----- scripts/templates/MapLibreRNStyles.ts.ejs | 4 +-- src/MapLibreRN.ts | 20 +++++------ src/components/Annotation.tsx | 6 ++-- src/components/BackgroundLayer.tsx | 4 +-- src/components/CircleLayer.tsx | 4 +-- src/components/FillExtrusionLayer.tsx | 4 +-- src/components/FillLayer.tsx | 4 +-- src/components/HeatmapLayer.tsx | 4 +-- src/components/Light.tsx | 4 +-- src/components/LineLayer.tsx | 4 +-- src/components/RasterLayer.tsx | 4 +-- src/components/SymbolLayer.tsx | 4 +-- src/components/UserLocation.tsx | 4 +-- src/hooks/useAbstractLayer.ts | 4 +-- src/utils/MapLibreRNStyles.d.ts | 42 +++++++++++------------ src/utils/StyleValue.ts | 4 +-- 26 files changed, 78 insertions(+), 78 deletions(-) diff --git a/docs/components/BackgroundLayer.md b/docs/components/BackgroundLayer.md index d532ed197..125505713 100644 --- a/docs/components/BackgroundLayer.md +++ b/docs/components/BackgroundLayer.md @@ -6,7 +6,7 @@ ## Props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | -| style | `BackgroundLayerStyleProps` | `none` | `false` | Customizable style attributes | +| style | `BackgroundLayerStyle` | `none` | `false` | Customizable style attributes | | sourceID | `FIX ME UNKNOWN TYPE` | `MapLibreRN.StyleSource.DefaultSourceID` | `false` | FIX ME NO DESCRIPTION | diff --git a/docs/components/CircleLayer.md b/docs/components/CircleLayer.md index de5fbaae3..c9e90fdea 100644 --- a/docs/components/CircleLayer.md +++ b/docs/components/CircleLayer.md @@ -6,7 +6,7 @@ CircleLayer is a style layer that renders one or more filled circles on the map. ## Props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | -| style | `CircleLayerStyleProps` | `none` | `false` | Customizable style attributes | +| style | `CircleLayerStyle` | `none` | `false` | Customizable style attributes | | sourceID | `FIX ME UNKNOWN TYPE` | `MapLibreRN.StyleSource.DefaultSourceID` | `false` | FIX ME NO DESCRIPTION | diff --git a/docs/components/FillExtrusionLayer.md b/docs/components/FillExtrusionLayer.md index 89ff80e32..f5ef3dc1f 100644 --- a/docs/components/FillExtrusionLayer.md +++ b/docs/components/FillExtrusionLayer.md @@ -6,7 +6,7 @@ FillExtrusionLayer is a style layer that renders one or more 3D extruded polygon ## Props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | -| style | `FillExtrusionLayerStyleProps` | `none` | `false` | Customizable style attributes | +| style | `FillExtrusionLayerStyle` | `none` | `false` | Customizable style attributes | | sourceID | `FIX ME UNKNOWN TYPE` | `MapLibreRN.StyleSource.DefaultSourceID` | `false` | FIX ME NO DESCRIPTION | diff --git a/docs/components/FillLayer.md b/docs/components/FillLayer.md index 797b51373..ee990dc72 100644 --- a/docs/components/FillLayer.md +++ b/docs/components/FillLayer.md @@ -6,7 +6,7 @@ FillLayer is a style layer that renders one or more filled (and optionally strok ## Props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | -| style | `FillLayerStyleProps` | `none` | `false` | Customizable style attributes | +| style | `FillLayerStyle` | `none` | `false` | Customizable style attributes | | sourceID | `FIX ME UNKNOWN TYPE` | `MapLibreRN.StyleSource.DefaultSourceID` | `false` | FIX ME NO DESCRIPTION | diff --git a/docs/components/HeatmapLayer.md b/docs/components/HeatmapLayer.md index 0a54971c4..307472972 100644 --- a/docs/components/HeatmapLayer.md +++ b/docs/components/HeatmapLayer.md @@ -6,7 +6,7 @@ HeatmapLayer is a style layer that renders one or more filled circles on the map ## Props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | -| style | `HeatmapLayerStyleProps` | `none` | `false` | Customizable style attributes | +| style | `HeatmapLayerStyle` | `none` | `false` | Customizable style attributes | | sourceID | `FIX ME UNKNOWN TYPE` | `MapLibreRN.StyleSource.DefaultSourceID` | `false` | FIX ME NO DESCRIPTION | diff --git a/docs/components/Light.md b/docs/components/Light.md index e78d3ed5a..d17997119 100644 --- a/docs/components/Light.md +++ b/docs/components/Light.md @@ -6,7 +6,7 @@ Light represents the light source for extruded geometries ## Props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | -| style | `LightLayerStyleProps` | `none` | `false` | Customizable style attributes | +| style | `LightLayerStyle` | `none` | `false` | Customizable style attributes | ## Styles diff --git a/docs/components/LineLayer.md b/docs/components/LineLayer.md index e1d1d2720..55dd18304 100644 --- a/docs/components/LineLayer.md +++ b/docs/components/LineLayer.md @@ -6,7 +6,7 @@ LineLayer is a style layer that renders one or more stroked polylines on the map ## Props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | -| style | `LineLayerStyleProps` | `none` | `false` | Customizable style attributes | +| style | `LineLayerStyle` | `none` | `false` | Customizable style attributes | | sourceID | `FIX ME UNKNOWN TYPE` | `MapLibreRN.StyleSource.DefaultSourceID` | `false` | FIX ME NO DESCRIPTION | diff --git a/docs/components/RasterLayer.md b/docs/components/RasterLayer.md index 0eb561ca4..1ff8a4f10 100644 --- a/docs/components/RasterLayer.md +++ b/docs/components/RasterLayer.md @@ -6,7 +6,7 @@ ## Props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | -| style | `RasterLayerStyleProps` | `none` | `false` | Customizable style attributes | +| style | `RasterLayerStyle` | `none` | `false` | Customizable style attributes | | sourceID | `FIX ME UNKNOWN TYPE` | `MapLibreRN.StyleSource.DefaultSourceID` | `false` | FIX ME NO DESCRIPTION | diff --git a/docs/components/SymbolLayer.md b/docs/components/SymbolLayer.md index 0fcdc20db..673037285 100644 --- a/docs/components/SymbolLayer.md +++ b/docs/components/SymbolLayer.md @@ -6,7 +6,7 @@ SymbolLayer is a style layer that renders icon and text labels at points or alon ## Props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | -| style | `SymbolLayerStyleProps` | `none` | `false` | Customizable style attributes | +| style | `SymbolLayerStyle` | `none` | `false` | Customizable style attributes | | sourceID | `FIX ME UNKNOWN TYPE` | `MapLibreRN.StyleSource.DefaultSourceID` | `false` | FIX ME NO DESCRIPTION | diff --git a/docs/docs.json b/docs/docs.json index 49dd675b4..cfcb91f01 100644 --- a/docs/docs.json +++ b/docs/docs.json @@ -93,7 +93,7 @@ { "name": "style", "required": false, - "type": "BackgroundLayerStyleProps", + "type": "BackgroundLayerStyle", "default": "none", "description": "Customizable style attributes" }, @@ -562,7 +562,7 @@ { "name": "style", "required": false, - "type": "CircleLayerStyleProps", + "type": "CircleLayerStyle", "default": "none", "description": "Customizable style attributes" }, @@ -866,7 +866,7 @@ { "name": "style", "required": false, - "type": "FillExtrusionLayerStyleProps", + "type": "FillExtrusionLayerStyle", "default": "none", "description": "Customizable style attributes" }, @@ -1081,7 +1081,7 @@ { "name": "style", "required": false, - "type": "FillLayerStyleProps", + "type": "FillLayerStyle", "default": "none", "description": "Customizable style attributes" }, @@ -1309,7 +1309,7 @@ { "name": "style", "required": false, - "type": "HeatmapLayerStyleProps", + "type": "HeatmapLayerStyle", "default": "none", "description": "Customizable style attributes" }, @@ -1568,7 +1568,7 @@ { "name": "style", "required": false, - "type": "LightLayerStyleProps", + "type": "LightLayerStyle", "default": "none", "description": "Customizable style attributes" } @@ -1674,7 +1674,7 @@ { "name": "style", "required": false, - "type": "LineLayerStyleProps", + "type": "LineLayerStyle", "default": "none", "description": "Customizable style attributes" }, @@ -2772,7 +2772,7 @@ { "name": "style", "required": false, - "type": "RasterLayerStyleProps", + "type": "RasterLayerStyle", "default": "none", "description": "Customizable style attributes" }, @@ -3363,7 +3363,7 @@ { "name": "style", "required": false, - "type": "SymbolLayerStyleProps", + "type": "SymbolLayerStyle", "default": "none", "description": "Customizable style attributes" }, diff --git a/scripts/templates/MapLibreRNStyles.ts.ejs b/scripts/templates/MapLibreRNStyles.ts.ejs index a78c9d91f..a5a5021c9 100644 --- a/scripts/templates/MapLibreRNStyles.ts.ejs +++ b/scripts/templates/MapLibreRNStyles.ts.ejs @@ -62,7 +62,7 @@ export type Value = | Expression; <%_ for (let layer of layers) { _%> - export interface <%- helpers.pascalCase(layer.name) %>LayerStyleProps { + export interface <%- helpers.pascalCase(layer.name) %>LayerStyle { <%_ for (let prop of layer.properties) { _%> /** * <%- prop.doc.description %> @@ -87,4 +87,4 @@ export type Value = }; <%_ } _%> -export type AllLayerStyleProps = <%- layers.map(l => `${helpers.pascalCase(l.name)}LayerStyleProps`).join("|") -%>; \ No newline at end of file +export type AllLayerStyle = <%- layers.map(l => `${helpers.pascalCase(l.name)}LayerStyle`).join("|") -%>; \ No newline at end of file diff --git a/src/MapLibreRN.ts b/src/MapLibreRN.ts index 9886dcd38..3135c7212 100644 --- a/src/MapLibreRN.ts +++ b/src/MapLibreRN.ts @@ -56,14 +56,14 @@ export type { MapLibreRNEvent } from "./types/MapLibreRNEvent"; export { default as Animated } from "./utils/animated/Animated"; export { default as Logger, type LogLevel } from "./utils/Logger"; export type { - FillLayerStyleProps as FillLayerStyle, - LineLayerStyleProps as LineLayerStyle, - SymbolLayerStyleProps as SymbolLayerStyle, - CircleLayerStyleProps as CircleLayerStyle, - HeatmapLayerStyleProps as HeatmapLayerStyle, - FillExtrusionLayerStyleProps as FillExtrusionLayerStyle, - RasterLayerStyleProps as RasterLayerStyle, - HillshadeLayerStyleProps as HillshadeLayerStyle, - BackgroundLayerStyleProps as BackgroundLayerStyle, - LightLayerStyleProps as LightLayerStyle, + FillLayerStyle, + LineLayerStyle, + SymbolLayerStyle, + CircleLayerStyle, + HeatmapLayerStyle, + FillExtrusionLayerStyle, + RasterLayerStyle, + HillshadeLayerStyle, + BackgroundLayerStyle, + LightLayerStyle, } from "./utils/MapLibreRNStyles"; diff --git a/src/components/Annotation.tsx b/src/components/Annotation.tsx index 6c8ec6811..9ed478466 100644 --- a/src/components/Annotation.tsx +++ b/src/components/Annotation.tsx @@ -10,7 +10,7 @@ import { Animated as RNAnimated, Easing } from "react-native"; import SymbolLayer from "./SymbolLayer"; import { type OnPressEvent } from "../types/OnPressEvent"; -import { type SymbolLayerStyleProps } from "../utils/MapLibreRNStyles"; +import { type SymbolLayerStyle } from "../utils/MapLibreRNStyles"; import { AnimatedShapeSource } from "../utils/animated/Animated"; import AnimatedMapPoint from "../utils/animated/AnimatedPoint"; @@ -46,7 +46,7 @@ function isShapeAnimated(shape: Shape): shape is AnimatedMapPoint { interface AnnotationRef { onPress(event: OnPressEvent): void; - symbolStyle: SymbolLayerStyleProps | undefined; + symbolStyle: SymbolLayerStyle | undefined; } const Annotation = forwardRef( @@ -126,7 +126,7 @@ const Annotation = forwardRef( } const children = []; - const symbolStyle: SymbolLayerStyleProps | undefined = props.icon + const symbolStyle: SymbolLayerStyle | undefined = props.icon ? { ...props.style, iconImage: typeof props.icon === "string" ? props.icon : undefined, diff --git a/src/components/BackgroundLayer.tsx b/src/components/BackgroundLayer.tsx index 9304768b0..af586c3ad 100644 --- a/src/components/BackgroundLayer.tsx +++ b/src/components/BackgroundLayer.tsx @@ -6,7 +6,7 @@ import useAbstractLayer, { type NativeBaseProps, } from "../hooks/useAbstractLayer"; import { type BaseProps } from "../types/BaseProps"; -import { type BackgroundLayerStyleProps } from "../utils/MapLibreRNStyles"; +import { type BackgroundLayerStyle } from "../utils/MapLibreRNStyles"; const MapLibreRN = NativeModules.MLRNModule; @@ -16,7 +16,7 @@ export interface BackgroundLayerProps extends BaseProps, BaseLayerProps { /** * Customizable style attributes */ - style?: BackgroundLayerStyleProps; + style?: BackgroundLayerStyle; } interface NativeProps diff --git a/src/components/CircleLayer.tsx b/src/components/CircleLayer.tsx index b4b7274d8..3497fa698 100644 --- a/src/components/CircleLayer.tsx +++ b/src/components/CircleLayer.tsx @@ -6,7 +6,7 @@ import useAbstractLayer, { type NativeBaseProps, } from "../hooks/useAbstractLayer"; import { type BaseProps } from "../types/BaseProps"; -import { type CircleLayerStyleProps } from "../utils/MapLibreRNStyles"; +import { type CircleLayerStyle } from "../utils/MapLibreRNStyles"; const MapLibreRN = NativeModules.MLRNModule; @@ -16,7 +16,7 @@ export interface CircleLayerProps extends BaseProps, BaseLayerProps { /** * Customizable style attributes */ - style?: CircleLayerStyleProps; + style?: CircleLayerStyle; } interface NativeProps diff --git a/src/components/FillExtrusionLayer.tsx b/src/components/FillExtrusionLayer.tsx index 9133a4bbc..003962cb6 100644 --- a/src/components/FillExtrusionLayer.tsx +++ b/src/components/FillExtrusionLayer.tsx @@ -6,7 +6,7 @@ import useAbstractLayer, { type NativeBaseProps, } from "../hooks/useAbstractLayer"; import { type BaseProps } from "../types/BaseProps"; -import { type FillExtrusionLayerStyleProps } from "../utils/MapLibreRNStyles"; +import { type FillExtrusionLayerStyle } from "../utils/MapLibreRNStyles"; const MapLibreRN = NativeModules.MLRNModule; @@ -16,7 +16,7 @@ export interface FillExtrusionLayerProps extends BaseProps, BaseLayerProps { /** * Customizable style attributes */ - style?: FillExtrusionLayerStyleProps; + style?: FillExtrusionLayerStyle; } interface NativeProps diff --git a/src/components/FillLayer.tsx b/src/components/FillLayer.tsx index e54a393c9..5944b80c8 100644 --- a/src/components/FillLayer.tsx +++ b/src/components/FillLayer.tsx @@ -6,7 +6,7 @@ import useAbstractLayer, { type NativeBaseProps, } from "../hooks/useAbstractLayer"; import { type BaseProps } from "../types/BaseProps"; -import { type FillLayerStyleProps } from "../utils/MapLibreRNStyles"; +import { type FillLayerStyle } from "../utils/MapLibreRNStyles"; const MapLibreRN = NativeModules.MLRNModule; @@ -16,7 +16,7 @@ export interface FillLayerProps extends BaseProps, BaseLayerProps { /** * Customizable style attributes */ - style?: FillLayerStyleProps; + style?: FillLayerStyle; } interface NativeProps extends Omit, NativeBaseProps {} diff --git a/src/components/HeatmapLayer.tsx b/src/components/HeatmapLayer.tsx index 9be2d8cac..eb728469b 100644 --- a/src/components/HeatmapLayer.tsx +++ b/src/components/HeatmapLayer.tsx @@ -6,7 +6,7 @@ import useAbstractLayer, { type NativeBaseProps, } from "../hooks/useAbstractLayer"; import { type BaseProps } from "../types/BaseProps"; -import { type HeatmapLayerStyleProps } from "../utils/MapLibreRNStyles"; +import { type HeatmapLayerStyle } from "../utils/MapLibreRNStyles"; const MapLibreRN = NativeModules.MLRNModule; @@ -16,7 +16,7 @@ export interface HeatmapLayerProps extends BaseProps, BaseLayerProps { /** * Customizable style attributes */ - style?: HeatmapLayerStyleProps; + style?: HeatmapLayerStyle; } interface NativeProps diff --git a/src/components/Light.tsx b/src/components/Light.tsx index eec816bd5..0cf125d37 100644 --- a/src/components/Light.tsx +++ b/src/components/Light.tsx @@ -5,7 +5,7 @@ import useAbstractLayer, { type BaseLayerProps, } from "../hooks/useAbstractLayer"; import { type BaseProps } from "../types/BaseProps"; -import { type LightLayerStyleProps } from "../utils/MapLibreRNStyles"; +import { type LightLayerStyle } from "../utils/MapLibreRNStyles"; import { type StyleValue } from "../utils/StyleValue"; export const NATIVE_MODULE_NAME = "MLRNLight"; @@ -14,7 +14,7 @@ interface LightProps extends BaseProps, BaseLayerProps { /** * Customizable style attributes */ - style?: LightLayerStyleProps; + style?: LightLayerStyle; } interface NativeProps extends Omit { diff --git a/src/components/LineLayer.tsx b/src/components/LineLayer.tsx index 908aea6f8..a8b3d31f6 100644 --- a/src/components/LineLayer.tsx +++ b/src/components/LineLayer.tsx @@ -6,7 +6,7 @@ import useAbstractLayer, { type NativeBaseProps, } from "../hooks/useAbstractLayer"; import { type BaseProps } from "../types/BaseProps"; -import { type LineLayerStyleProps } from "../utils/MapLibreRNStyles"; +import { type LineLayerStyle } from "../utils/MapLibreRNStyles"; const MapLibreRN = NativeModules.MLRNModule; @@ -16,7 +16,7 @@ export interface LineLayerProps extends BaseProps, BaseLayerProps { /** * Customizable style attributes */ - style?: LineLayerStyleProps; + style?: LineLayerStyle; } interface NativeProps extends Omit, NativeBaseProps {} diff --git a/src/components/RasterLayer.tsx b/src/components/RasterLayer.tsx index bfded88c1..ccad105de 100644 --- a/src/components/RasterLayer.tsx +++ b/src/components/RasterLayer.tsx @@ -6,7 +6,7 @@ import useAbstractLayer, { type NativeBaseProps, } from "../hooks/useAbstractLayer"; import { type BaseProps } from "../types/BaseProps"; -import { type RasterLayerStyleProps } from "../utils/MapLibreRNStyles"; +import { type RasterLayerStyle } from "../utils/MapLibreRNStyles"; const MapLibreRN = NativeModules.MLRNModule; @@ -16,7 +16,7 @@ export interface RasterLayerProps extends BaseProps, BaseLayerProps { /** * Customizable style attributes */ - style?: RasterLayerStyleProps; + style?: RasterLayerStyle; } interface NativeProps diff --git a/src/components/SymbolLayer.tsx b/src/components/SymbolLayer.tsx index 41a3d291d..cd2f55062 100644 --- a/src/components/SymbolLayer.tsx +++ b/src/components/SymbolLayer.tsx @@ -5,7 +5,7 @@ import useAbstractLayer, { type NativeBaseProps, } from "../hooks/useAbstractLayer"; import { type BaseProps } from "../types/BaseProps"; -import { type SymbolLayerStyleProps } from "../utils/MapLibreRNStyles"; +import { type SymbolLayerStyle } from "../utils/MapLibreRNStyles"; const MapLibreRN = NativeModules.MLRNModule; @@ -15,7 +15,7 @@ export interface SymbolLayerProps extends BaseProps, BaseLayerProps { /** * Customizable style attributes */ - style?: SymbolLayerStyleProps; + style?: SymbolLayerStyle; } interface NativeProps diff --git a/src/components/UserLocation.tsx b/src/components/UserLocation.tsx index e5ded6551..4ffdf603a 100644 --- a/src/components/UserLocation.tsx +++ b/src/components/UserLocation.tsx @@ -15,11 +15,11 @@ import NativeUserLocation from "./NativeUserLocation"; import locationManager, { type Location, } from "../modules/location/locationManager"; -import { type CircleLayerStyleProps } from "../utils/MapLibreRNStyles"; +import { type CircleLayerStyle } from "../utils/MapLibreRNStyles"; const mapboxBlue = "rgba(51, 181, 229, 100)"; -const layerStyles: Record = { +const layerStyles: Record = { pluse: { circleRadius: 15, circleColor: mapboxBlue, diff --git a/src/hooks/useAbstractLayer.ts b/src/hooks/useAbstractLayer.ts index 5e9aeef5f..e59391c8a 100644 --- a/src/hooks/useAbstractLayer.ts +++ b/src/hooks/useAbstractLayer.ts @@ -3,7 +3,7 @@ import { processColor, type NativeMethods } from "react-native"; import { type BaseProps } from "../types/BaseProps"; import { - type AllLayerStyleProps, + type AllLayerStyle, type ExpressionField, type ExpressionName, type FilterExpression, @@ -53,7 +53,7 @@ export interface BaseLayerProps { /** * Customizable style attributes */ - style?: AllLayerStyleProps; + style?: AllLayerStyle; } export interface NativeBaseProps { diff --git a/src/utils/MapLibreRNStyles.d.ts b/src/utils/MapLibreRNStyles.d.ts index 61d37f413..ca3c6d3b8 100644 --- a/src/utils/MapLibreRNStyles.d.ts +++ b/src/utils/MapLibreRNStyles.d.ts @@ -134,7 +134,7 @@ export type Value = | T | Expression; -export interface FillLayerStyleProps { +export interface FillLayerStyle { /** * Sorts features in ascending order based on this value. Features with a higher sort key will appear above features with a lower sort key. */ @@ -203,7 +203,7 @@ export interface FillLayerStyleProps { */ fillPatternTransition?: Transition; } -export interface LineLayerStyleProps { +export interface LineLayerStyle { /** * The display of line endings. */ @@ -326,7 +326,7 @@ export interface LineLayerStyleProps { */ lineGradient?: Value; } -export interface SymbolLayerStyleProps { +export interface SymbolLayerStyle { /** * Label placement relative to its geometry. */ @@ -762,7 +762,7 @@ The unit is in pixels only for SDF sprites that were created with a blur radius */ textTranslateAnchor?: Value<"map" | "viewport", ["zoom"]>; } -export interface CircleLayerStyleProps { +export interface CircleLayerStyle { /** * Sorts features in ascending order based on this value. Features with a higher sort key will appear above features with a lower sort key. */ @@ -858,7 +858,7 @@ export interface CircleLayerStyleProps { */ circleStrokeOpacityTransition?: Transition; } -export interface HeatmapLayerStyleProps { +export interface HeatmapLayerStyle { /** * Whether this layer is displayed. */ @@ -899,7 +899,7 @@ export interface HeatmapLayerStyleProps { */ heatmapOpacityTransition?: Transition; } -export interface FillExtrusionLayerStyleProps { +export interface FillExtrusionLayerStyle { /** * Whether this layer is displayed. */ @@ -973,7 +973,7 @@ export interface FillExtrusionLayerStyleProps { */ fillExtrusionVerticalGradient?: Value; } -export interface RasterLayerStyleProps { +export interface RasterLayerStyle { /** * Whether this layer is displayed. */ @@ -1041,7 +1041,7 @@ export interface RasterLayerStyleProps { */ rasterFadeDuration?: Value; } -export interface HillshadeLayerStyleProps { +export interface HillshadeLayerStyle { /** * Whether this layer is displayed. */ @@ -1091,7 +1091,7 @@ export interface HillshadeLayerStyleProps { */ hillshadeAccentColorTransition?: Transition; } -export interface BackgroundLayerStyleProps { +export interface BackgroundLayerStyle { /** * Whether this layer is displayed. */ @@ -1126,7 +1126,7 @@ export interface BackgroundLayerStyleProps { */ backgroundOpacityTransition?: Transition; } -export interface LightLayerStyleProps { +export interface LightLayerStyle { /** * Whether extruded geometries are lit relative to the map or viewport. */ @@ -1160,14 +1160,14 @@ export interface LightLayerStyleProps { intensityTransition?: Transition; } -export type AllLayerStyleProps = - | FillLayerStyleProps - | LineLayerStyleProps - | SymbolLayerStyleProps - | CircleLayerStyleProps - | HeatmapLayerStyleProps - | FillExtrusionLayerStyleProps - | RasterLayerStyleProps - | HillshadeLayerStyleProps - | BackgroundLayerStyleProps - | LightLayerStyleProps; +export type AllLayerStyle = + | FillLayerStyle + | LineLayerStyle + | SymbolLayerStyle + | CircleLayerStyle + | HeatmapLayerStyle + | FillExtrusionLayerStyle + | RasterLayerStyle + | HillshadeLayerStyle + | BackgroundLayerStyle + | LightLayerStyle; diff --git a/src/utils/StyleValue.ts b/src/utils/StyleValue.ts index aafd05386..73cf4cf82 100644 --- a/src/utils/StyleValue.ts +++ b/src/utils/StyleValue.ts @@ -4,7 +4,7 @@ import BridgeValue, { type RawValueType, type StyleValueJSON, } from "./BridgeValue"; -import { type AllLayerStyleProps } from "./MapLibreRNStyles"; +import { type AllLayerStyle } from "./MapLibreRNStyles"; import { getStylePropertyType } from "./getStylePropertyType"; export type StyleValue = { @@ -13,7 +13,7 @@ export type StyleValue = { }; export function transformStyle( - style: AllLayerStyleProps | undefined, + style: AllLayerStyle | undefined, ): undefined | { [key: string]: StyleValue } { if (!style) { return undefined; From be6d7656abe39d3783f7236f1bbb1ec66f2b223d Mon Sep 17 00:00:00 2001 From: Kilian Finger Date: Sun, 15 Dec 2024 15:55:14 +0100 Subject: [PATCH 08/19] refactor: move MapLibreRNStyles --- scripts/codegen.ts | 8 ++++---- ...{MapLibreRNStyles.ts.ejs => MapLibreRNStyles.d.ts.ejs} | 4 ++-- src/MapLibreRN.ts | 2 +- src/components/Annotation.tsx | 2 +- src/components/BackgroundLayer.tsx | 2 +- src/components/CircleLayer.tsx | 2 +- src/components/FillExtrusionLayer.tsx | 2 +- src/components/FillLayer.tsx | 2 +- src/components/HeatmapLayer.tsx | 2 +- src/components/Light.tsx | 2 +- src/components/LineLayer.tsx | 2 +- src/components/MapView.tsx | 2 +- src/components/RasterLayer.tsx | 2 +- src/components/ShapeSource.tsx | 8 ++++---- src/components/SymbolLayer.tsx | 2 +- src/components/UserLocation.tsx | 2 +- src/components/VectorSource.tsx | 2 +- src/hooks/useAbstractLayer.ts | 2 +- src/{utils => types}/MapLibreRNStyles.d.ts | 6 +++--- src/utils/StyleValue.ts | 2 +- src/utils/filterUtils.ts | 2 +- 21 files changed, 30 insertions(+), 30 deletions(-) rename scripts/templates/{MapLibreRNStyles.ts.ejs => MapLibreRNStyles.d.ts.ejs} (98%) rename src/{utils => types}/MapLibreRNStyles.d.ts (99%) diff --git a/scripts/codegen.ts b/scripts/codegen.ts index 581602a37..6c160d01b 100644 --- a/scripts/codegen.ts +++ b/scripts/codegen.ts @@ -32,7 +32,7 @@ const ANDROID_OUTPUT_PATH = path.join( "styles", ); -const JS_OUTPUT_PATH = path.join(__dirname, "..", "src", "utils"); +const JS_OUTPUT_PATH = path.join(__dirname, "..", "src"); const TEMPLATE_MAPPINGS = [ { @@ -40,8 +40,8 @@ const TEMPLATE_MAPPINGS = [ output: path.join(IOS_OUTPUT_PATH, "MLRNStyle.h"), }, { - input: path.join(TEMPLATES_PATH, "MapLibreRNStyles.ts.ejs"), - output: path.join(JS_OUTPUT_PATH, "MapLibreRNStyles.d.ts"), + input: path.join(TEMPLATES_PATH, "MapLibreRNStyles.d.ts.ejs"), + output: path.join(JS_OUTPUT_PATH, "types", "MapLibreRNStyles.d.ts"), }, { input: path.join(TEMPLATES_PATH, "MLRNStyle.m.ejs"), @@ -53,7 +53,7 @@ const TEMPLATE_MAPPINGS = [ }, { input: path.join(TEMPLATES_PATH, "getStylePropertyType.ts.ejs"), - output: path.join(JS_OUTPUT_PATH, "getStylePropertyType.ts"), + output: path.join(JS_OUTPUT_PATH, "utils", "getStylePropertyType.ts"), }, ]; diff --git a/scripts/templates/MapLibreRNStyles.ts.ejs b/scripts/templates/MapLibreRNStyles.d.ts.ejs similarity index 98% rename from scripts/templates/MapLibreRNStyles.ts.ejs rename to scripts/templates/MapLibreRNStyles.d.ts.ejs index a5a5021c9..7892eeadb 100644 --- a/scripts/templates/MapLibreRNStyles.ts.ejs +++ b/scripts/templates/MapLibreRNStyles.d.ts.ejs @@ -16,7 +16,7 @@ export interface Transition { export type FormattedString = string; /* TODO */ -type ExpressionName = +export type ExpressionName = // Types | 'array' | 'boolean' | 'collator' | 'format' | 'image' | 'literal' | 'number' | 'number-format' | 'object' | 'string' | 'to-boolean' | 'to-color' | 'to-number' | 'to-string' | 'typeof' @@ -40,7 +40,7 @@ type ExpressionName = // Zoom, Heatmap | 'zoom' | 'heatmap-density'; -type ExpressionField = +export type ExpressionField = | string | number | boolean diff --git a/src/MapLibreRN.ts b/src/MapLibreRN.ts index 3135c7212..424222148 100644 --- a/src/MapLibreRN.ts +++ b/src/MapLibreRN.ts @@ -66,4 +66,4 @@ export type { HillshadeLayerStyle, BackgroundLayerStyle, LightLayerStyle, -} from "./utils/MapLibreRNStyles"; +} from "./types/MapLibreRNStyles"; diff --git a/src/components/Annotation.tsx b/src/components/Annotation.tsx index 9ed478466..6b93fab76 100644 --- a/src/components/Annotation.tsx +++ b/src/components/Annotation.tsx @@ -9,8 +9,8 @@ import { import { Animated as RNAnimated, Easing } from "react-native"; import SymbolLayer from "./SymbolLayer"; +import { type SymbolLayerStyle } from "../types/MapLibreRNStyles"; import { type OnPressEvent } from "../types/OnPressEvent"; -import { type SymbolLayerStyle } from "../utils/MapLibreRNStyles"; import { AnimatedShapeSource } from "../utils/animated/Animated"; import AnimatedMapPoint from "../utils/animated/AnimatedPoint"; diff --git a/src/components/BackgroundLayer.tsx b/src/components/BackgroundLayer.tsx index af586c3ad..fc54d7570 100644 --- a/src/components/BackgroundLayer.tsx +++ b/src/components/BackgroundLayer.tsx @@ -6,7 +6,7 @@ import useAbstractLayer, { type NativeBaseProps, } from "../hooks/useAbstractLayer"; import { type BaseProps } from "../types/BaseProps"; -import { type BackgroundLayerStyle } from "../utils/MapLibreRNStyles"; +import { type BackgroundLayerStyle } from "../types/MapLibreRNStyles"; const MapLibreRN = NativeModules.MLRNModule; diff --git a/src/components/CircleLayer.tsx b/src/components/CircleLayer.tsx index 3497fa698..50b4253a2 100644 --- a/src/components/CircleLayer.tsx +++ b/src/components/CircleLayer.tsx @@ -6,7 +6,7 @@ import useAbstractLayer, { type NativeBaseProps, } from "../hooks/useAbstractLayer"; import { type BaseProps } from "../types/BaseProps"; -import { type CircleLayerStyle } from "../utils/MapLibreRNStyles"; +import { type CircleLayerStyle } from "../types/MapLibreRNStyles"; const MapLibreRN = NativeModules.MLRNModule; diff --git a/src/components/FillExtrusionLayer.tsx b/src/components/FillExtrusionLayer.tsx index 003962cb6..6ed0bc6a7 100644 --- a/src/components/FillExtrusionLayer.tsx +++ b/src/components/FillExtrusionLayer.tsx @@ -6,7 +6,7 @@ import useAbstractLayer, { type NativeBaseProps, } from "../hooks/useAbstractLayer"; import { type BaseProps } from "../types/BaseProps"; -import { type FillExtrusionLayerStyle } from "../utils/MapLibreRNStyles"; +import { type FillExtrusionLayerStyle } from "../types/MapLibreRNStyles"; const MapLibreRN = NativeModules.MLRNModule; diff --git a/src/components/FillLayer.tsx b/src/components/FillLayer.tsx index 5944b80c8..aa5dd181f 100644 --- a/src/components/FillLayer.tsx +++ b/src/components/FillLayer.tsx @@ -6,7 +6,7 @@ import useAbstractLayer, { type NativeBaseProps, } from "../hooks/useAbstractLayer"; import { type BaseProps } from "../types/BaseProps"; -import { type FillLayerStyle } from "../utils/MapLibreRNStyles"; +import { type FillLayerStyle } from "../types/MapLibreRNStyles"; const MapLibreRN = NativeModules.MLRNModule; diff --git a/src/components/HeatmapLayer.tsx b/src/components/HeatmapLayer.tsx index eb728469b..f4bd84bf3 100644 --- a/src/components/HeatmapLayer.tsx +++ b/src/components/HeatmapLayer.tsx @@ -6,7 +6,7 @@ import useAbstractLayer, { type NativeBaseProps, } from "../hooks/useAbstractLayer"; import { type BaseProps } from "../types/BaseProps"; -import { type HeatmapLayerStyle } from "../utils/MapLibreRNStyles"; +import { type HeatmapLayerStyle } from "../types/MapLibreRNStyles"; const MapLibreRN = NativeModules.MLRNModule; diff --git a/src/components/Light.tsx b/src/components/Light.tsx index 0cf125d37..a24f2cb8e 100644 --- a/src/components/Light.tsx +++ b/src/components/Light.tsx @@ -5,7 +5,7 @@ import useAbstractLayer, { type BaseLayerProps, } from "../hooks/useAbstractLayer"; import { type BaseProps } from "../types/BaseProps"; -import { type LightLayerStyle } from "../utils/MapLibreRNStyles"; +import { type LightLayerStyle } from "../types/MapLibreRNStyles"; import { type StyleValue } from "../utils/StyleValue"; export const NATIVE_MODULE_NAME = "MLRNLight"; diff --git a/src/components/LineLayer.tsx b/src/components/LineLayer.tsx index a8b3d31f6..1b8daa71b 100644 --- a/src/components/LineLayer.tsx +++ b/src/components/LineLayer.tsx @@ -6,7 +6,7 @@ import useAbstractLayer, { type NativeBaseProps, } from "../hooks/useAbstractLayer"; import { type BaseProps } from "../types/BaseProps"; -import { type LineLayerStyle } from "../utils/MapLibreRNStyles"; +import { type LineLayerStyle } from "../types/MapLibreRNStyles"; const MapLibreRN = NativeModules.MLRNModule; diff --git a/src/components/MapView.tsx b/src/components/MapView.tsx index 97c2d6b87..ece9160a6 100644 --- a/src/components/MapView.tsx +++ b/src/components/MapView.tsx @@ -26,9 +26,9 @@ import useNativeBridge from "../hooks/useNativeBridge"; import useOnce from "../hooks/useOnce"; import { type Location } from "../modules/location/locationManager"; import { type BaseProps } from "../types/BaseProps"; +import { type FilterExpression } from "../types/MapLibreRNStyles"; import { isFunction, isAndroid } from "../utils"; import Logger from "../utils/Logger"; -import { type FilterExpression } from "../utils/MapLibreRNStyles"; import { getFilter } from "../utils/filterUtils"; const MapLibreRN = NativeModules.MLRNModule; diff --git a/src/components/RasterLayer.tsx b/src/components/RasterLayer.tsx index ccad105de..2a0516f6b 100644 --- a/src/components/RasterLayer.tsx +++ b/src/components/RasterLayer.tsx @@ -6,7 +6,7 @@ import useAbstractLayer, { type NativeBaseProps, } from "../hooks/useAbstractLayer"; import { type BaseProps } from "../types/BaseProps"; -import { type RasterLayerStyle } from "../utils/MapLibreRNStyles"; +import { type RasterLayerStyle } from "../types/MapLibreRNStyles"; const MapLibreRN = NativeModules.MLRNModule; diff --git a/src/components/ShapeSource.tsx b/src/components/ShapeSource.tsx index 147256cfc..656b1804f 100644 --- a/src/components/ShapeSource.tsx +++ b/src/components/ShapeSource.tsx @@ -15,6 +15,10 @@ import { import useNativeBridge from "../hooks/useNativeBridge"; import { type BaseProps } from "../types/BaseProps"; +import { + type ExpressionField, + type FilterExpression, +} from "../types/MapLibreRNStyles"; import { type OnPressEvent } from "../types/OnPressEvent"; import { cloneReactChildrenWithProps, @@ -22,10 +26,6 @@ import { isFunction, toJSONString, } from "../utils"; -import { - type ExpressionField, - type FilterExpression, -} from "../utils/MapLibreRNStyles"; import { getFilter } from "../utils/filterUtils"; const MapLibreRN = NativeModules.MLRNModule; diff --git a/src/components/SymbolLayer.tsx b/src/components/SymbolLayer.tsx index cd2f55062..18ee78526 100644 --- a/src/components/SymbolLayer.tsx +++ b/src/components/SymbolLayer.tsx @@ -5,7 +5,7 @@ import useAbstractLayer, { type NativeBaseProps, } from "../hooks/useAbstractLayer"; import { type BaseProps } from "../types/BaseProps"; -import { type SymbolLayerStyle } from "../utils/MapLibreRNStyles"; +import { type SymbolLayerStyle } from "../types/MapLibreRNStyles"; const MapLibreRN = NativeModules.MLRNModule; diff --git a/src/components/UserLocation.tsx b/src/components/UserLocation.tsx index 4ffdf603a..5df37befb 100644 --- a/src/components/UserLocation.tsx +++ b/src/components/UserLocation.tsx @@ -15,7 +15,7 @@ import NativeUserLocation from "./NativeUserLocation"; import locationManager, { type Location, } from "../modules/location/locationManager"; -import { type CircleLayerStyle } from "../utils/MapLibreRNStyles"; +import { type CircleLayerStyle } from "../types/MapLibreRNStyles"; const mapboxBlue = "rgba(51, 181, 229, 100)"; diff --git a/src/components/VectorSource.tsx b/src/components/VectorSource.tsx index 604b30d9b..9c196d890 100644 --- a/src/components/VectorSource.tsx +++ b/src/components/VectorSource.tsx @@ -9,9 +9,9 @@ import { import useAbstractSource from "../hooks/useAbstractSource"; import useNativeBridge from "../hooks/useNativeBridge"; import { type BaseProps } from "../types/BaseProps"; +import { type FilterExpression } from "../types/MapLibreRNStyles"; import { type OnPressEvent } from "../types/OnPressEvent"; import { cloneReactChildrenWithProps, isFunction, isAndroid } from "../utils"; -import { type FilterExpression } from "../utils/MapLibreRNStyles"; import { getFilter } from "../utils/filterUtils"; const MapLibreRN = NativeModules.MLRNModule; diff --git a/src/hooks/useAbstractLayer.ts b/src/hooks/useAbstractLayer.ts index e59391c8a..a1079c837 100644 --- a/src/hooks/useAbstractLayer.ts +++ b/src/hooks/useAbstractLayer.ts @@ -7,7 +7,7 @@ import { type ExpressionField, type ExpressionName, type FilterExpression, -} from "../utils/MapLibreRNStyles"; +} from "../types/MapLibreRNStyles"; import { type StyleValue, transformStyle } from "../utils/StyleValue"; import { getFilter } from "../utils/filterUtils"; diff --git a/src/utils/MapLibreRNStyles.d.ts b/src/types/MapLibreRNStyles.d.ts similarity index 99% rename from src/utils/MapLibreRNStyles.d.ts rename to src/types/MapLibreRNStyles.d.ts index ca3c6d3b8..2fd501792 100644 --- a/src/utils/MapLibreRNStyles.d.ts +++ b/src/types/MapLibreRNStyles.d.ts @@ -1,5 +1,5 @@ // DO NOT MODIFY -// This file is auto-generated from scripts/templates/MapLibreRNStyles.ts.ejs +// This file is auto-generated from scripts/templates/MapLibreRNStyles.d.ts.ejs import { type ImageSourcePropType } from "react-native"; @@ -12,7 +12,7 @@ export interface Transition { export type FormattedString = string; /* TODO */ -type ExpressionName = +export type ExpressionName = // Types | "array" | "boolean" @@ -107,7 +107,7 @@ type ExpressionName = | "zoom" | "heatmap-density"; -type ExpressionField = +export type ExpressionField = | string | number | boolean diff --git a/src/utils/StyleValue.ts b/src/utils/StyleValue.ts index 73cf4cf82..efa6a0353 100644 --- a/src/utils/StyleValue.ts +++ b/src/utils/StyleValue.ts @@ -4,8 +4,8 @@ import BridgeValue, { type RawValueType, type StyleValueJSON, } from "./BridgeValue"; -import { type AllLayerStyle } from "./MapLibreRNStyles"; import { getStylePropertyType } from "./getStylePropertyType"; +import { type AllLayerStyle } from "../types/MapLibreRNStyles"; export type StyleValue = { styletype: string; diff --git a/src/utils/filterUtils.ts b/src/utils/filterUtils.ts index 39ffd8a63..7dddac161 100644 --- a/src/utils/filterUtils.ts +++ b/src/utils/filterUtils.ts @@ -1,4 +1,4 @@ -import { type FilterExpression } from "./MapLibreRNStyles"; +import { type FilterExpression } from "../types/MapLibreRNStyles"; export function getFilter(filter: FilterExpression | undefined): string[] { if (!Array.isArray(filter) || filter.length === 0) { From 63e8dc93cfb8f5ededdfd6ad92108137db73838f Mon Sep 17 00:00:00 2001 From: Kilian Finger Date: Sun, 15 Dec 2024 16:19:51 +0100 Subject: [PATCH 09/19] fix: drop .d on MapLibreRNStyles.ts --- scripts/codegen.ts | 4 ++-- .../{MapLibreRNStyles.d.ts.ejs => MapLibreRNStyles.ts.ejs} | 1 + src/types/{MapLibreRNStyles.d.ts => MapLibreRNStyles.ts} | 3 ++- 3 files changed, 5 insertions(+), 3 deletions(-) rename scripts/templates/{MapLibreRNStyles.d.ts.ejs => MapLibreRNStyles.ts.ejs} (99%) rename src/types/{MapLibreRNStyles.d.ts => MapLibreRNStyles.ts} (99%) diff --git a/scripts/codegen.ts b/scripts/codegen.ts index 6c160d01b..2c16cf88d 100644 --- a/scripts/codegen.ts +++ b/scripts/codegen.ts @@ -40,8 +40,8 @@ const TEMPLATE_MAPPINGS = [ output: path.join(IOS_OUTPUT_PATH, "MLRNStyle.h"), }, { - input: path.join(TEMPLATES_PATH, "MapLibreRNStyles.d.ts.ejs"), - output: path.join(JS_OUTPUT_PATH, "types", "MapLibreRNStyles.d.ts"), + input: path.join(TEMPLATES_PATH, "MapLibreRNStyles.ts.ejs"), + output: path.join(JS_OUTPUT_PATH, "types", "MapLibreRNStyles.ts"), }, { input: path.join(TEMPLATES_PATH, "MLRNStyle.m.ejs"), diff --git a/scripts/templates/MapLibreRNStyles.d.ts.ejs b/scripts/templates/MapLibreRNStyles.ts.ejs similarity index 99% rename from scripts/templates/MapLibreRNStyles.d.ts.ejs rename to scripts/templates/MapLibreRNStyles.ts.ejs index 7892eeadb..c4cabeed8 100644 --- a/scripts/templates/MapLibreRNStyles.d.ts.ejs +++ b/scripts/templates/MapLibreRNStyles.ts.ejs @@ -56,6 +56,7 @@ type ExpressionParameters = 'zoom' | 'feature' | 'feature-state' | 'sky-radial-p type ResolvedImageType = ImageSourcePropType | string; +// @ts-ignore // eslint-disable-next-line @typescript-eslint/no-unused-vars export type Value = | T diff --git a/src/types/MapLibreRNStyles.d.ts b/src/types/MapLibreRNStyles.ts similarity index 99% rename from src/types/MapLibreRNStyles.d.ts rename to src/types/MapLibreRNStyles.ts index 2fd501792..f088c04d1 100644 --- a/src/types/MapLibreRNStyles.d.ts +++ b/src/types/MapLibreRNStyles.ts @@ -1,5 +1,5 @@ // DO NOT MODIFY -// This file is auto-generated from scripts/templates/MapLibreRNStyles.d.ts.ejs +// This file is auto-generated from scripts/templates/MapLibreRNStyles.ts.ejs import { type ImageSourcePropType } from "react-native"; @@ -129,6 +129,7 @@ type ExpressionParameters = type ResolvedImageType = ImageSourcePropType | string; +// @ts-ignore // eslint-disable-next-line @typescript-eslint/no-unused-vars export type Value = | T From 218f05d3b1eaab179e497c15a7e377459e7d2352 Mon Sep 17 00:00:00 2001 From: Kilian Finger Date: Mon, 16 Dec 2024 19:16:28 +0100 Subject: [PATCH 10/19] feat: upgrade native dependencies --- android/build.gradle | 2 +- docs/guides/setup/iOS.md | 6 +++--- maplibre-react-native.podspec | 2 +- .../project.pbxproj | 16 +++------------- .../xcshareddata/swiftpm/Package.resolved | 4 ++-- scripts/codegen.ts | 8 +++++++- scripts/templates/MapLibreRNStyles.ts.ejs | 3 ++- src/types/MapLibreRNStyles.ts | 2 +- 8 files changed, 20 insertions(+), 23 deletions(-) diff --git a/android/build.gradle b/android/build.gradle index 41abb73fe..461039b45 100644 --- a/android/build.gradle +++ b/android/build.gradle @@ -99,7 +99,7 @@ dependencies { implementation "org.jetbrains.kotlin:kotlin-stdlib:$kotlin_version" // MapLibre SDK - implementation "org.maplibre.gl:android-sdk:11.5.0" + implementation "org.maplibre.gl:android-sdk:11.7.0" implementation "org.maplibre.gl:android-sdk-turf:6.0.1" // Dependencies diff --git a/docs/guides/setup/iOS.md b/docs/guides/setup/iOS.md index a08f573c9..b6daee51f 100644 --- a/docs/guides/setup/iOS.md +++ b/docs/guides/setup/iOS.md @@ -12,7 +12,7 @@ Add the following to your `ios/Podfile`: end ``` -Running `pod install` will add version `6.5.4` of the MapLibre SDK. +Running `pod install` will add version `6.8.1` of the MapLibre SDK. ```sh # Go to the ios directory @@ -33,7 +33,7 @@ until this is fixed upstream. iOS devs can open the workspace in Xcode and run f ## Installing a specific version -The current default MapLibre version is `6.5.4`. +The current default MapLibre version is `6.8.1`. If you want to install a different version, you can override as follows in your `Podfile`: @@ -42,7 +42,7 @@ $MLRN_SPM_Spec = { url: "https://github.com/maplibre/maplibre-gl-native-distribution", requirement: { kind: "upToNextMajorVersion", - minimumVersion: "6.5.4" + minimumVersion: "6.8.1" }, product_name: "MapLibre" } diff --git a/maplibre-react-native.podspec b/maplibre-react-native.podspec index f3466147f..bca2335f4 100644 --- a/maplibre-react-native.podspec +++ b/maplibre-react-native.podspec @@ -28,7 +28,7 @@ def $MLRN.post_install(installer) url: "https://github.com/maplibre/maplibre-gl-native-distribution", requirement: { kind: "exactVersion", - version: "6.5.4" + version: "6.8.1" }, product_name: "MapLibre" } diff --git a/packages/react-native-app/ios/MapLibreReactNativeExample.xcodeproj/project.pbxproj b/packages/react-native-app/ios/MapLibreReactNativeExample.xcodeproj/project.pbxproj index 391442e79..c8149a289 100644 --- a/packages/react-native-app/ios/MapLibreReactNativeExample.xcodeproj/project.pbxproj +++ b/packages/react-native-app/ios/MapLibreReactNativeExample.xcodeproj/project.pbxproj @@ -140,10 +140,6 @@ attributes = { LastUpgradeCheck = 1210; TargetAttributes = { - 00E356ED1AD99517003FC87E = { - CreatedOnToolsVersion = 6.2; - TestTargetID = 13B07F861A680F5B00A75B9A; - }; 13B07F861A680F5B00A75B9A = { LastSwiftMigration = 1120; }; @@ -394,10 +390,7 @@ "-DFOLLY_CFG_NO_COROUTINES=1", "-DFOLLY_HAVE_CLOCK_GETTIME=1", ); - OTHER_LDFLAGS = ( - "$(inherited)", - " ", - ); + OTHER_LDFLAGS = "$(inherited) "; REACT_NATIVE_PATH = "${PODS_ROOT}/../../node_modules/react-native"; SDKROOT = iphoneos; SWIFT_ACTIVE_COMPILATION_CONDITIONS = "$(inherited) DEBUG"; @@ -466,10 +459,7 @@ "-DFOLLY_CFG_NO_COROUTINES=1", "-DFOLLY_HAVE_CLOCK_GETTIME=1", ); - OTHER_LDFLAGS = ( - "$(inherited)", - " ", - ); + OTHER_LDFLAGS = "$(inherited) "; REACT_NATIVE_PATH = "${PODS_ROOT}/../../node_modules/react-native"; SDKROOT = iphoneos; USE_HERMES = true; @@ -506,7 +496,7 @@ repositoryURL = "https://github.com/maplibre/maplibre-gl-native-distribution"; requirement = { kind = exactVersion; - version = 6.5.4; + version = 6.8.1; }; }; /* End XCRemoteSwiftPackageReference section */ diff --git a/packages/react-native-app/ios/MapLibreReactNativeExample.xcworkspace/xcshareddata/swiftpm/Package.resolved b/packages/react-native-app/ios/MapLibreReactNativeExample.xcworkspace/xcshareddata/swiftpm/Package.resolved index 6b466cb47..5f4f7d996 100644 --- a/packages/react-native-app/ios/MapLibreReactNativeExample.xcworkspace/xcshareddata/swiftpm/Package.resolved +++ b/packages/react-native-app/ios/MapLibreReactNativeExample.xcworkspace/xcshareddata/swiftpm/Package.resolved @@ -6,8 +6,8 @@ "kind" : "remoteSourceControl", "location" : "https://github.com/maplibre/maplibre-gl-native-distribution", "state" : { - "revision" : "abe762f1e19e03a4c6943d2aad92c219da384b29", - "version" : "6.5.4" + "revision" : "b84a0decbe9ca1caeff1402efdce71349c09d790", + "version" : "6.8.1" } } ], diff --git a/scripts/codegen.ts b/scripts/codegen.ts index 2c16cf88d..28cb3d23f 100644 --- a/scripts/codegen.ts +++ b/scripts/codegen.ts @@ -118,7 +118,13 @@ async function generate() { }, ); - return layoutProps.concat(paintProps); + const props = [...layoutProps, ...paintProps]; + + return props.filter((prop) => { + // TODO: Codegen adoptions for native style code + // https://github.com/maplibre/maplibre-react-native/issues/562 + return !["textVariableAnchorOffset"].includes(prop.name); + }); } function getSupportedLayers() { diff --git a/scripts/templates/MapLibreRNStyles.ts.ejs b/scripts/templates/MapLibreRNStyles.ts.ejs index c4cabeed8..d7bb7e3f8 100644 --- a/scripts/templates/MapLibreRNStyles.ts.ejs +++ b/scripts/templates/MapLibreRNStyles.ts.ejs @@ -14,7 +14,8 @@ export interface Transition { delay: number; } -export type FormattedString = string; /* TODO */ +<% /* TODO */ %> +export type FormattedString = string; export type ExpressionName = // Types diff --git a/src/types/MapLibreRNStyles.ts b/src/types/MapLibreRNStyles.ts index f088c04d1..81a168f58 100644 --- a/src/types/MapLibreRNStyles.ts +++ b/src/types/MapLibreRNStyles.ts @@ -10,7 +10,7 @@ export interface Transition { delay: number; } -export type FormattedString = string; /* TODO */ +export type FormattedString = string; export type ExpressionName = // Types From 9d83dfd6f1e5f1aa1934dfd5e4e984643ae89336 Mon Sep 17 00:00:00 2001 From: Kilian Finger Date: Mon, 16 Dec 2024 21:28:51 +0100 Subject: [PATCH 11/19] test: adapt Android attribution title --- packages/react-native-app/e2e/show-map.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-native-app/e2e/show-map.yml b/packages/react-native-app/e2e/show-map.yml index 1a810e91e..74df9acee 100644 --- a/packages/react-native-app/e2e/show-map.yml +++ b/packages/react-native-app/e2e/show-map.yml @@ -10,7 +10,7 @@ appId: org.maplibre.reactnative.example platform: Android commands: - tapOn: "Attribution icon. Activate to show attribution dialog." - - assertVisible: "MapLibre Maps SDK for Android" + - assertVisible: "MapLibre Android" - runFlow: when: From aafa14c3a6e2a819852837b616ae7980d70ab6a1 Mon Sep 17 00:00:00 2001 From: Kilian Finger Date: Mon, 16 Dec 2024 21:46:44 +0100 Subject: [PATCH 12/19] feat: upgrade iOS to 6.9.0 --- docs/guides/setup/iOS.md | 6 +++--- maplibre-react-native.podspec | 2 +- .../project.pbxproj | 12 +++++++++--- .../xcshareddata/swiftpm/Package.resolved | 4 ++-- 4 files changed, 15 insertions(+), 9 deletions(-) diff --git a/docs/guides/setup/iOS.md b/docs/guides/setup/iOS.md index b6daee51f..06510b432 100644 --- a/docs/guides/setup/iOS.md +++ b/docs/guides/setup/iOS.md @@ -12,7 +12,7 @@ Add the following to your `ios/Podfile`: end ``` -Running `pod install` will add version `6.8.1` of the MapLibre SDK. +Running `pod install` will add version `6.9.0` of the MapLibre SDK. ```sh # Go to the ios directory @@ -33,7 +33,7 @@ until this is fixed upstream. iOS devs can open the workspace in Xcode and run f ## Installing a specific version -The current default MapLibre version is `6.8.1`. +The current default MapLibre version is `6.9.0`. If you want to install a different version, you can override as follows in your `Podfile`: @@ -42,7 +42,7 @@ $MLRN_SPM_Spec = { url: "https://github.com/maplibre/maplibre-gl-native-distribution", requirement: { kind: "upToNextMajorVersion", - minimumVersion: "6.8.1" + minimumVersion: "6.9.0" }, product_name: "MapLibre" } diff --git a/maplibre-react-native.podspec b/maplibre-react-native.podspec index bca2335f4..d7ccac7c7 100644 --- a/maplibre-react-native.podspec +++ b/maplibre-react-native.podspec @@ -28,7 +28,7 @@ def $MLRN.post_install(installer) url: "https://github.com/maplibre/maplibre-gl-native-distribution", requirement: { kind: "exactVersion", - version: "6.8.1" + version: "6.9.0" }, product_name: "MapLibre" } diff --git a/packages/react-native-app/ios/MapLibreReactNativeExample.xcodeproj/project.pbxproj b/packages/react-native-app/ios/MapLibreReactNativeExample.xcodeproj/project.pbxproj index c8149a289..542524186 100644 --- a/packages/react-native-app/ios/MapLibreReactNativeExample.xcodeproj/project.pbxproj +++ b/packages/react-native-app/ios/MapLibreReactNativeExample.xcodeproj/project.pbxproj @@ -390,7 +390,10 @@ "-DFOLLY_CFG_NO_COROUTINES=1", "-DFOLLY_HAVE_CLOCK_GETTIME=1", ); - OTHER_LDFLAGS = "$(inherited) "; + OTHER_LDFLAGS = ( + "$(inherited)", + " ", + ); REACT_NATIVE_PATH = "${PODS_ROOT}/../../node_modules/react-native"; SDKROOT = iphoneos; SWIFT_ACTIVE_COMPILATION_CONDITIONS = "$(inherited) DEBUG"; @@ -459,7 +462,10 @@ "-DFOLLY_CFG_NO_COROUTINES=1", "-DFOLLY_HAVE_CLOCK_GETTIME=1", ); - OTHER_LDFLAGS = "$(inherited) "; + OTHER_LDFLAGS = ( + "$(inherited)", + " ", + ); REACT_NATIVE_PATH = "${PODS_ROOT}/../../node_modules/react-native"; SDKROOT = iphoneos; USE_HERMES = true; @@ -496,7 +502,7 @@ repositoryURL = "https://github.com/maplibre/maplibre-gl-native-distribution"; requirement = { kind = exactVersion; - version = 6.8.1; + version = 6.9.0; }; }; /* End XCRemoteSwiftPackageReference section */ diff --git a/packages/react-native-app/ios/MapLibreReactNativeExample.xcworkspace/xcshareddata/swiftpm/Package.resolved b/packages/react-native-app/ios/MapLibreReactNativeExample.xcworkspace/xcshareddata/swiftpm/Package.resolved index 5f4f7d996..2992eff4c 100644 --- a/packages/react-native-app/ios/MapLibreReactNativeExample.xcworkspace/xcshareddata/swiftpm/Package.resolved +++ b/packages/react-native-app/ios/MapLibreReactNativeExample.xcworkspace/xcshareddata/swiftpm/Package.resolved @@ -6,8 +6,8 @@ "kind" : "remoteSourceControl", "location" : "https://github.com/maplibre/maplibre-gl-native-distribution", "state" : { - "revision" : "b84a0decbe9ca1caeff1402efdce71349c09d790", - "version" : "6.8.1" + "revision" : "93cb32c95b48f62edb27c75792038849cdfdaa35", + "version" : "6.9.0" } } ], From 2f2d9a50c98072ac2a0f7afab65702ae20c6097e Mon Sep 17 00:00:00 2001 From: Kilian Finger Date: Tue, 17 Dec 2024 00:36:29 +0100 Subject: [PATCH 13/19] feat: remove MapLibreGL default export BREAKING CHANGE: Remove MapLibreGL default export, use `import * as MapLibreRN` instead --- README.md | 2 +- __tests__/exports.ts | 4 +- .../modules/location/locationManager.test.js | 12 +-- .../modules/offline/offlineManager.test.js | 102 ++++++++---------- .../modules/snapshot/snapshotManager.test.js | 4 +- docs/components/Annotation.md | 2 +- docs/components/BackgroundLayer.md | 4 +- docs/components/Callout.md | 2 +- docs/components/Camera.md | 4 +- docs/components/CircleLayer.md | 4 +- docs/components/FillExtrusionLayer.md | 4 +- docs/components/FillLayer.md | 4 +- docs/components/HeadingIndicator.md | 2 +- docs/components/HeatmapLayer.md | 4 +- docs/components/ImageSource.md | 2 +- docs/components/Images.md | 2 +- docs/components/Light.md | 2 +- docs/components/LineLayer.md | 4 +- docs/components/MapView.md | 4 +- docs/components/MarkerView.md | 2 +- docs/components/NativeUserLocation.md | 2 +- docs/components/PointAnnotation.md | 2 +- docs/components/RasterLayer.md | 4 +- docs/components/RasterSource.md | 4 +- docs/components/ShapeSource.md | 4 +- docs/components/SymbolLayer.md | 4 +- docs/components/UserLocation.md | 2 +- docs/components/VectorSource.md | 4 +- docs/docs.json | 56 +++++----- docs/guides/CustomHTTPHeaders.md | 10 +- docs/guides/{MapLibreGL.md => MLRNModule.md} | 2 +- docs/guides/setup/Android.md | 6 +- docs/guides/setup/GettingStarted.md | 6 +- docs/modules/coordinates.md | 2 +- docs/modules/location.md | 2 +- docs/modules/offlineManager.md | 30 +++--- docs/modules/snapshotManager.md | 14 +-- packages/examples/src/App.tsx | 9 +- .../src/components/PulseCircleLayer.tsx | 13 +-- .../Animations/AnimateCircleAlongLine.tsx | 25 +++-- .../examples/Annotations/CustomCallout.tsx | 21 ++-- .../src/examples/Annotations/Heatmap.tsx | 16 +-- .../src/examples/Annotations/MarkerView.tsx | 23 ++-- .../Annotations/PointAnnotationAnchors.js | 20 ++-- .../Annotations/ShowPointAnnotation.tsx | 36 ++++--- .../examples/src/examples/CacheManagement.js | 10 +- packages/examples/src/examples/Camera/Fit.js | 14 +-- .../examples/src/examples/Camera/FlyTo.js | 10 +- .../examples/src/examples/Camera/GetCenter.js | 11 +- .../examples/src/examples/Camera/GetZoom.tsx | 6 +- .../src/examples/Camera/RestrictMapBounds.tsx | 19 ++-- .../src/examples/Camera/SetHeading.js | 22 ++-- .../examples/src/examples/Camera/SetPitch.js | 19 ++-- .../src/examples/Camera/TakeSnapshot.js | 6 +- .../examples/Camera/TakeSnapshotWithMap.js | 11 +- .../examples/src/examples/Camera/YoYo.tsx | 8 +- .../FillRasterLayer/CustomVectorSource.tsx | 16 +-- .../FillRasterLayer/GeoJSONSource.tsx | 25 +++-- .../examples/FillRasterLayer/ImageOverlay.tsx | 19 ++-- .../FillRasterLayer/IndoorBuilding.tsx | 24 +++-- .../OpenStreetMapRasterTiles.tsx | 19 ++-- .../examples/FillRasterLayer/QueryAtPoint.js | 37 +++---- .../examples/FillRasterLayer/QueryWithRect.js | 39 ++++--- .../src/examples/LineLayer/GradientLine.js | 22 ++-- .../src/examples/Map/ChangeLayerColor.js | 17 +-- .../src/examples/Map/CreateOfflineRegion.tsx | 36 +++---- .../src/examples/Map/PointInMapView.js | 11 +- .../src/examples/Map/SetTintColor.tsx | 20 ++-- .../src/examples/Map/ShowAndHideLayer.js | 10 +- .../examples/src/examples/Map/ShowClick.js | 4 +- .../examples/src/examples/Map/ShowMap.tsx | 4 +- .../src/examples/Map/ShowRegionDidChange.js | 8 +- .../examples/Map/SourceLayerVisibility.tsx | 4 +- .../examples/src/examples/Map/TwoMapViews.tsx | 16 +-- .../examples/SymbolCircleLayer/CustomIcon.js | 19 ++-- .../DataDrivenCircleColors.js | 23 ++-- .../SymbolCircleLayer/Earthquakes.tsx | 20 ++-- .../SymbolCircleLayer/ShapeSourceIcon.tsx | 19 ++-- .../FollowUserLocationAlignment.tsx | 13 +-- .../FollowUserLocationRenderMode.tsx | 20 ++-- .../SetAndroidPreferredFramesPerSecond.tsx | 19 ++-- .../UserLocation/UserLocationDisplacement.tsx | 22 ++-- .../UserLocation/UserLocationUpdate.tsx | 19 ++-- scripts/templates/component.md.ejs | 2 +- src/components/BackgroundLayer.tsx | 4 +- src/components/Camera.tsx | 2 +- src/components/CircleLayer.tsx | 4 +- src/components/FillExtrusionLayer.tsx | 4 +- src/components/FillLayer.tsx | 4 +- src/components/HeatmapLayer.tsx | 4 +- src/components/LineLayer.tsx | 4 +- src/components/MapView.tsx | 64 +++++------ src/components/RasterLayer.tsx | 4 +- src/components/RasterSource.tsx | 4 +- src/components/ShapeSource.tsx | 4 +- src/components/SymbolLayer.tsx | 4 +- src/components/VectorSource.tsx | 4 +- src/index.ts | 3 - src/modules/location/locationManager.ts | 4 +- src/modules/offline/offlineManager.ts | 36 +++---- src/modules/snapshot/SnapshotOptions.ts | 4 +- src/modules/snapshot/snapshotManager.ts | 12 +-- 102 files changed, 681 insertions(+), 618 deletions(-) rename docs/guides/{MapLibreGL.md => MLRNModule.md} (99%) diff --git a/README.md b/README.md index 72b3b16fd..f80f46070 100644 --- a/README.md +++ b/README.md @@ -69,7 +69,7 @@ diverged, it has become necessary to separate the projects into specific wrapper ### Misc -- [MapLibreGL](/docs/guides/MapLibreGL.md) +- [MLRNModule](/docs/guides/MLRNModule) - [Custom HTTP Headers](/docs/guides/CustomHTTPHeaders.md) - [Logger](/docs/guides/Logger.md) diff --git a/__tests__/exports.ts b/__tests__/exports.ts index 2edaf945f..82b766124 100644 --- a/__tests__/exports.ts +++ b/__tests__/exports.ts @@ -1,8 +1,8 @@ -import MapLibreGL from "../src"; +import * as MapLibreRN from "../src"; describe("Package Exports", () => { it("should contain all expected components and utils", () => { - const actualKeys = Object.keys(MapLibreGL); + const actualKeys = Object.keys(MapLibreRN); const expectedKeys = [ // Components diff --git a/__tests__/modules/location/locationManager.test.js b/__tests__/modules/location/locationManager.test.js index 214bf654d..cc94c2043 100644 --- a/__tests__/modules/location/locationManager.test.js +++ b/__tests__/modules/location/locationManager.test.js @@ -4,7 +4,7 @@ import LocationManager, { LocationModuleEventEmitter, } from "../../../src/modules/location/locationManager"; -const MapLibreRN = NativeModules.MLRNModule; +const MLRNModule = NativeModules.MLRNModule; const MLRNLocationModule = NativeModules.MLRNLocationModule; const location = { @@ -67,7 +67,7 @@ describe("LocationManager", () => { describe("#addListener", () => { const myListener = jest.fn(); - MapLibreRN.LocationCallbackName = { Update: "MapboxUserLocationUpdate" }; + MLRNModule.LocationCallbackName = { Update: "MapboxUserLocationUpdate" }; afterEach(() => { locationManager._listeners = []; @@ -154,7 +154,7 @@ describe("LocationManager", () => { }); test("starts native location manager and adds event emitter listener", () => { - MapLibreRN.LocationCallbackName = { + MLRNModule.LocationCallbackName = { Update: "MapboxUserLocationUpdate", }; @@ -164,7 +164,7 @@ describe("LocationManager", () => { expect(MLRNLocationModule.start).toHaveBeenCalledTimes(1); expect(LocationModuleEventEmitter.addListener).toHaveBeenCalledWith( - MapLibreRN.LocationCallbackName.Update, + MLRNModule.LocationCallbackName.Update, locationManager.onUpdate, ); @@ -198,7 +198,7 @@ describe("LocationManager", () => { // native location manager has no #stop exposed in tests? MLRNLocationModule.stop = jest.fn(); - MapLibreRN.LocationCallbackName = { + MLRNModule.LocationCallbackName = { Update: "MapboxUserLocationUpdate", }; @@ -218,7 +218,7 @@ describe("LocationManager", () => { // native location manager has no #stop exposed in tests? MLRNLocationModule.stop = jest.fn(); - MapLibreRN.LocationCallbackName = { + MLRNModule.LocationCallbackName = { Update: "MapboxUserLocationUpdate", }; diff --git a/__tests__/modules/offline/offlineManager.test.js b/__tests__/modules/offline/offlineManager.test.js index 3ad605801..41215fa0b 100644 --- a/__tests__/modules/offline/offlineManager.test.js +++ b/__tests__/modules/offline/offlineManager.test.js @@ -1,6 +1,6 @@ import { NativeModules, Platform } from "react-native"; -import MapLibreGL from "../../../src"; +import { offlineManager, OfflinePackDownloadState } from "../../../src"; import { OfflineModuleEventEmitter } from "../../../src/modules/offline/offlineManager"; describe("offlineManager", () => { @@ -19,7 +19,7 @@ describe("offlineManager", () => { type: "offlinestatus", payload: { name: packOptions.name, - state: MapLibreGL.OfflinePackDownloadState.Active, + state: OfflinePackDownloadState.Active, progress: 50.0, }, }; @@ -28,7 +28,7 @@ describe("offlineManager", () => { type: "offlinestatus", payload: { name: packOptions.name, - state: MapLibreGL.OfflinePackDownloadState.Complete, + state: OfflinePackDownloadState.Complete, progress: 100.0, }, }; @@ -42,30 +42,30 @@ describe("offlineManager", () => { }; afterEach(async () => { - const packs = await MapLibreGL.offlineManager.getPacks(); + const packs = await offlineManager.getPacks(); for (const pack of packs) { - await MapLibreGL.offlineManager.deletePack(pack.name); + await offlineManager.deletePack(pack.name); } jest.clearAllMocks(); }); it("should create pack", async () => { - let offlinePack = await MapLibreGL.offlineManager.getPack(packOptions.name); + let offlinePack = await offlineManager.getPack(packOptions.name); expect(offlinePack).toBeFalsy(); - await MapLibreGL.offlineManager.createPack(packOptions); - offlinePack = await MapLibreGL.offlineManager.getPack(packOptions.name); + await offlineManager.createPack(packOptions); + offlinePack = await offlineManager.getPack(packOptions.name); expect(offlinePack).toBeTruthy(); }); it("should delete pack", async () => { - await MapLibreGL.offlineManager.createPack(packOptions); - let offlinePack = await MapLibreGL.offlineManager.getPack(packOptions.name); + await offlineManager.createPack(packOptions); + let offlinePack = await offlineManager.getPack(packOptions.name); expect(offlinePack).toBeTruthy(); - await MapLibreGL.offlineManager.deletePack(packOptions.name); - offlinePack = await MapLibreGL.offlineManager.getPack(packOptions.name); + await offlineManager.deletePack(packOptions.name); + offlinePack = await offlineManager.getPack(packOptions.name); expect(offlinePack).toBeFalsy(); }); @@ -75,7 +75,7 @@ describe("offlineManager", () => { NativeModules.MLRNOfflineModule, "setTileCountLimit", ); - MapLibreGL.offlineManager.setTileCountLimit(expectedLimit); + offlineManager.setTileCountLimit(expectedLimit); expect(spy).toHaveBeenCalledWith(expectedLimit); spy.mockRestore(); }); @@ -86,7 +86,7 @@ describe("offlineManager", () => { NativeModules.MLRNOfflineModule, "setProgressEventThrottle", ); - MapLibreGL.offlineManager.setProgressEventThrottle(expectedThrottleValue); + offlineManager.setProgressEventThrottle(expectedThrottleValue); expect(spy).toHaveBeenCalledWith(expectedThrottleValue); spy.mockRestore(); }); @@ -95,18 +95,18 @@ describe("offlineManager", () => { it("should subscribe to native events", async () => { const spy = jest.spyOn(OfflineModuleEventEmitter, "addListener"); const noop = () => {}; - await MapLibreGL.offlineManager.createPack(packOptions, noop, noop); + await offlineManager.createPack(packOptions, noop, noop); expect(spy).toHaveBeenCalledTimes(2); spy.mockClear(); }); it("should call progress listener", async () => { const listener = jest.fn(); - await MapLibreGL.offlineManager.createPack(packOptions, listener); - const expectedOfflinePack = await MapLibreGL.offlineManager.getPack( + await offlineManager.createPack(packOptions, listener); + const expectedOfflinePack = await offlineManager.getPack( packOptions.name, ); - MapLibreGL.offlineManager._onProgress(mockOnProgressEvent); + offlineManager._onProgress(mockOnProgressEvent); expect(listener).toHaveBeenCalledWith( expectedOfflinePack, mockOnProgressEvent.payload, @@ -115,11 +115,11 @@ describe("offlineManager", () => { it("should call error listener", async () => { const listener = jest.fn(); - await MapLibreGL.offlineManager.createPack(packOptions, null, listener); - const expectedOfflinePack = await MapLibreGL.offlineManager.getPack( + await offlineManager.createPack(packOptions, null, listener); + const expectedOfflinePack = await offlineManager.getPack( packOptions.name, ); - MapLibreGL.offlineManager._onError(mockErrorEvent); + offlineManager._onError(mockErrorEvent); expect(listener).toHaveBeenCalledWith( expectedOfflinePack, mockErrorEvent.payload, @@ -128,66 +128,56 @@ describe("offlineManager", () => { it("should not call listeners after unsubscribe", async () => { const listener = jest.fn(); - await MapLibreGL.offlineManager.createPack( - packOptions, - listener, - listener, - ); - MapLibreGL.offlineManager.unsubscribe(packOptions.name); - MapLibreGL.offlineManager._onProgress(mockOnProgressEvent); - MapLibreGL.offlineManager._onError(mockErrorEvent); + await offlineManager.createPack(packOptions, listener, listener); + offlineManager.unsubscribe(packOptions.name); + offlineManager._onProgress(mockOnProgressEvent); + offlineManager._onError(mockErrorEvent); expect(listener).not.toHaveBeenCalled(); }); it("should unsubscribe from native events", async () => { const noop = () => {}; - await MapLibreGL.offlineManager.createPack(packOptions, noop, noop); - MapLibreGL.offlineManager.unsubscribe(packOptions.name); + await offlineManager.createPack(packOptions, noop, noop); + offlineManager.unsubscribe(packOptions.name); - expect( - MapLibreGL.offlineManager.subscriptionProgress.remove, - ).toHaveBeenCalledTimes(1); - expect( - MapLibreGL.offlineManager.subscriptionError.remove, - ).toHaveBeenCalledTimes(1); + expect(offlineManager.subscriptionProgress.remove).toHaveBeenCalledTimes( + 1, + ); + expect(offlineManager.subscriptionError.remove).toHaveBeenCalledTimes(1); }); it("should unsubscribe event listeners once a pack download has completed", async () => { const listener = jest.fn(); - await MapLibreGL.offlineManager.createPack( - packOptions, - listener, - listener, - ); + await offlineManager.createPack(packOptions, listener, listener); expect( - MapLibreGL.offlineManager._hasListeners( + offlineManager._hasListeners( packOptions.name, - MapLibreGL.offlineManager._progressListeners, + offlineManager._progressListeners, ), ).toBeTruthy(); expect( - MapLibreGL.offlineManager._hasListeners( + offlineManager._hasListeners( packOptions.name, - MapLibreGL.offlineManager._errorListeners, + offlineManager._errorListeners, ), ).toBeTruthy(); - MapLibreGL.offlineManager._onProgress(mockOnProgressCompleteEvent); + offlineManager._onProgress(mockOnProgressCompleteEvent); expect( - MapLibreGL.offlineManager._hasListeners( + offlineManager._hasListeners( packOptions.name, - MapLibreGL.offlineManager._progressListeners, + offlineManager._progressListeners, ), ).toBeFalsy(); expect( - MapLibreGL.offlineManager._hasListeners( + offlineManager._hasListeners( packOptions.name, - MapLibreGL.offlineManager._errorListeners, + offlineManager._errorListeners, ), ).toBeFalsy(); }); @@ -205,8 +195,8 @@ describe("offlineManager", () => { const name = `test-${Date.now()}`; const noop = () => {}; const options = { ...packOptions, name }; - await MapLibreGL.offlineManager.createPack(options); - await MapLibreGL.offlineManager.subscribe(name, noop, noop); + await offlineManager.createPack(options); + await offlineManager.subscribe(name, noop, noop); expect(spy).toHaveBeenCalled(); spy.mockRestore(); @@ -221,7 +211,7 @@ describe("offlineManager", () => { const name = `test-${Date.now()}`; const noop = () => {}; const options = { ...packOptions, name }; - await MapLibreGL.offlineManager.createPack(options, noop, noop); + await offlineManager.createPack(options, noop, noop); expect(spy).not.toHaveBeenCalled(); spy.mockRestore(); @@ -240,8 +230,8 @@ describe("offlineManager", () => { const name = `test-${Date.now()}`; const noop = () => {}; const options = { ...packOptions, name }; - await MapLibreGL.offlineManager.createPack(options); - await MapLibreGL.offlineManager.subscribe(name, noop, noop); + await offlineManager.createPack(options); + await offlineManager.subscribe(name, noop, noop); expect(spy).not.toHaveBeenCalled(); spy.mockRestore(); diff --git a/__tests__/modules/snapshot/snapshotManager.test.js b/__tests__/modules/snapshot/snapshotManager.test.js index 076db9794..097094467 100644 --- a/__tests__/modules/snapshot/snapshotManager.test.js +++ b/__tests__/modules/snapshot/snapshotManager.test.js @@ -1,9 +1,9 @@ -import MapLibreGL from "../../../src"; +import { snapshotManager } from "../../../src"; describe("snapshotManager", () => { it("should resolve uri", async () => { const options = { centerCoordinate: [1, 2] }; - const uri = await MapLibreGL.snapshotManager.takeSnap(options); + const uri = await snapshotManager.takeSnap(options); expect(uri).toEqual("file://test.png"); }); }); diff --git a/docs/components/Annotation.md b/docs/components/Annotation.md index 6709a2e11..3c07793d7 100644 --- a/docs/components/Annotation.md +++ b/docs/components/Annotation.md @@ -1,6 +1,6 @@ -# `` +# `` ## Props diff --git a/docs/components/BackgroundLayer.md b/docs/components/BackgroundLayer.md index 125505713..1dbe4f523 100644 --- a/docs/components/BackgroundLayer.md +++ b/docs/components/BackgroundLayer.md @@ -1,13 +1,13 @@ -# `` +# `` ## Props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | | style | `BackgroundLayerStyle` | `none` | `false` | Customizable style attributes | -| sourceID | `FIX ME UNKNOWN TYPE` | `MapLibreRN.StyleSource.DefaultSourceID` | `false` | FIX ME NO DESCRIPTION | +| sourceID | `FIX ME UNKNOWN TYPE` | `MLRNModule.StyleSource.DefaultSourceID` | `false` | FIX ME NO DESCRIPTION | ## Styles diff --git a/docs/components/Callout.md b/docs/components/Callout.md index b4f95963d..624ae3e50 100644 --- a/docs/components/Callout.md +++ b/docs/components/Callout.md @@ -1,6 +1,6 @@ -# `` +# `` Callout that displays information about a selected annotation near the annotation. ## Props diff --git a/docs/components/Camera.md b/docs/components/Camera.md index c83b76630..132f3b108 100644 --- a/docs/components/Camera.md +++ b/docs/components/Camera.md @@ -1,6 +1,6 @@ -# `` +# `` ## Props @@ -19,7 +19,7 @@ | maxZoomLevel | `number` | `none` | `false` | Maximum zoom level of the map | | maxBounds | `CameraBounds` | `none` | `false` | Restrict map panning so that the center is within these bounds | | followUserLocation | `boolean` | `none` | `false` | Should the map orientation follow the user's. | -| followUserMode | `UserTrackingMode` | `none` | `false` | The mode used to track the user location on the map. One of; "normal", "compass", "course". Each mode string is also available as a member on the `MapLibreGL.UserTrackingMode` object. `Follow` (normal), `FollowWithHeading` (compass), `FollowWithCourse` (course). NOTE: `followUserLocation` must be set to `true` for any of the modes to take effect. [Example](/packages/examples/src/examples/Camera/SetUserTrackingMode.js) | +| followUserMode | `UserTrackingMode` | `none` | `false` | The mode used to track the user location on the map. One of; "normal", "compass", "course". Each mode string is also available as a member on the `UserTrackingMode` object. `Follow` (normal), `FollowWithHeading` (compass), `FollowWithCourse` (course). NOTE: `followUserLocation` must be set to `true` for any of the modes to take effect. [Example](/packages/examples/src/examples/Camera/SetUserTrackingMode.js) | | followZoomLevel | `number` | `none` | `false` | The zoomLevel on map while followUserLocation is set to `true` | | followPitch | `number` | `none` | `false` | The pitch on map while followUserLocation is set to `true` | | followHeading | `number` | `none` | `false` | The heading on map while followUserLocation is set to `true` | diff --git a/docs/components/CircleLayer.md b/docs/components/CircleLayer.md index c9e90fdea..c556d78a8 100644 --- a/docs/components/CircleLayer.md +++ b/docs/components/CircleLayer.md @@ -1,13 +1,13 @@ -# `` +# `` CircleLayer is a style layer that renders one or more filled circles on the map. ## Props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | | style | `CircleLayerStyle` | `none` | `false` | Customizable style attributes | -| sourceID | `FIX ME UNKNOWN TYPE` | `MapLibreRN.StyleSource.DefaultSourceID` | `false` | FIX ME NO DESCRIPTION | +| sourceID | `FIX ME UNKNOWN TYPE` | `MLRNModule.StyleSource.DefaultSourceID` | `false` | FIX ME NO DESCRIPTION | ## Styles diff --git a/docs/components/FillExtrusionLayer.md b/docs/components/FillExtrusionLayer.md index f5ef3dc1f..cd88f08e1 100644 --- a/docs/components/FillExtrusionLayer.md +++ b/docs/components/FillExtrusionLayer.md @@ -1,13 +1,13 @@ -# `` +# `` FillExtrusionLayer is a style layer that renders one or more 3D extruded polygons on the map. ## Props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | | style | `FillExtrusionLayerStyle` | `none` | `false` | Customizable style attributes | -| sourceID | `FIX ME UNKNOWN TYPE` | `MapLibreRN.StyleSource.DefaultSourceID` | `false` | FIX ME NO DESCRIPTION | +| sourceID | `FIX ME UNKNOWN TYPE` | `MLRNModule.StyleSource.DefaultSourceID` | `false` | FIX ME NO DESCRIPTION | ## Styles diff --git a/docs/components/FillLayer.md b/docs/components/FillLayer.md index ee990dc72..9aff3da5a 100644 --- a/docs/components/FillLayer.md +++ b/docs/components/FillLayer.md @@ -1,13 +1,13 @@ -# `` +# `` FillLayer is a style layer that renders one or more filled (and optionally stroked) polygons on the map. ## Props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | | style | `FillLayerStyle` | `none` | `false` | Customizable style attributes | -| sourceID | `FIX ME UNKNOWN TYPE` | `MapLibreRN.StyleSource.DefaultSourceID` | `false` | FIX ME NO DESCRIPTION | +| sourceID | `FIX ME UNKNOWN TYPE` | `MLRNModule.StyleSource.DefaultSourceID` | `false` | FIX ME NO DESCRIPTION | ## Styles diff --git a/docs/components/HeadingIndicator.md b/docs/components/HeadingIndicator.md index 96e9e6bdc..b1242ee64 100644 --- a/docs/components/HeadingIndicator.md +++ b/docs/components/HeadingIndicator.md @@ -1,6 +1,6 @@ -# `` +# `` ## Props diff --git a/docs/components/HeatmapLayer.md b/docs/components/HeatmapLayer.md index 307472972..cb333fd9b 100644 --- a/docs/components/HeatmapLayer.md +++ b/docs/components/HeatmapLayer.md @@ -1,13 +1,13 @@ -# `` +# `` HeatmapLayer is a style layer that renders one or more filled circles on the map. ## Props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | | style | `HeatmapLayerStyle` | `none` | `false` | Customizable style attributes | -| sourceID | `FIX ME UNKNOWN TYPE` | `MapLibreRN.StyleSource.DefaultSourceID` | `false` | FIX ME NO DESCRIPTION | +| sourceID | `FIX ME UNKNOWN TYPE` | `MLRNModule.StyleSource.DefaultSourceID` | `false` | FIX ME NO DESCRIPTION | ## Styles diff --git a/docs/components/ImageSource.md b/docs/components/ImageSource.md index cb32c6232..255847a8e 100644 --- a/docs/components/ImageSource.md +++ b/docs/components/ImageSource.md @@ -1,6 +1,6 @@ -# `` +# `` ImageSource is a content source that is used for a georeferenced raster image to be shown on the map.
The georeferenced image scales and rotates as the user zooms and rotates the map ## Props diff --git a/docs/components/Images.md b/docs/components/Images.md index 8bcf3d1c3..d993be82b 100644 --- a/docs/components/Images.md +++ b/docs/components/Images.md @@ -1,6 +1,6 @@ -# `` +# `` Images defines the images used in Symbol etc layers ## Props diff --git a/docs/components/Light.md b/docs/components/Light.md index d17997119..cc8ffe302 100644 --- a/docs/components/Light.md +++ b/docs/components/Light.md @@ -1,6 +1,6 @@ -# `` +# `` Light represents the light source for extruded geometries ## Props diff --git a/docs/components/LineLayer.md b/docs/components/LineLayer.md index 55dd18304..6fb004f3f 100644 --- a/docs/components/LineLayer.md +++ b/docs/components/LineLayer.md @@ -1,13 +1,13 @@ -# `` +# `` LineLayer is a style layer that renders one or more stroked polylines on the map. ## Props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | | style | `LineLayerStyle` | `none` | `false` | Customizable style attributes | -| sourceID | `FIX ME UNKNOWN TYPE` | `MapLibreRN.StyleSource.DefaultSourceID` | `false` | FIX ME NO DESCRIPTION | +| sourceID | `FIX ME UNKNOWN TYPE` | `MLRNModule.StyleSource.DefaultSourceID` | `false` | FIX ME NO DESCRIPTION | ## Styles diff --git a/docs/components/MapView.md b/docs/components/MapView.md index 2f4dd62b8..e3f7960ec 100644 --- a/docs/components/MapView.md +++ b/docs/components/MapView.md @@ -1,6 +1,6 @@ -# `` +# `` MapView backed by MapLibre Native ## Props @@ -8,7 +8,7 @@ MapView backed by MapLibre Native | ---- | :--: | :-----: | :------: | :----------: | | contentInset | `number[] \| number` | `none` | `false` | The distance from the edges of the map view’s frame to the edges of the map view’s logical viewport. | | style | `ViewProps["style"]` | `none` | `false` | Style for wrapping React Native View | -| styleURL | `string` | `none` | `false` | Style URL for map - notice, if non is set it _will_ default to `MapLibreGL.StyleURL.Default` | +| styleURL | `string` | `none` | `false` | Style URL for map - notice, if non is set it _will_ default to `StyleURL.Default` | | styleJSON | `string` | `none` | `false` | StyleJSON for map - according to TileJSON specs: https://github.com/mapbox/tilejson-spec | | preferredFramesPerSecond | `number` | `none` | `false` | iOS: The preferred frame rate at which the map view is rendered.
The default value for this property is MLNMapViewPreferredFramesPerSecondDefault,
which will adaptively set the preferred frame rate based on the capability of
the user’s device to maintain a smooth experience. This property can be set to arbitrary integer values.

Android: The maximum frame rate at which the map view is rendered, but it can't excess the ability of device hardware.
This property can be set to arbitrary integer values. | | localizeLabels | `boolean` | `false` | `false` | Automatically change the language of the map labels to the system’s preferred language,
this is not something that can be toggled on/off | diff --git a/docs/components/MarkerView.md b/docs/components/MarkerView.md index da9a4a963..925802ae4 100644 --- a/docs/components/MarkerView.md +++ b/docs/components/MarkerView.md @@ -1,6 +1,6 @@ -# `` +# `` MarkerView allows you to place a interactive react native marker to the map.

If you have static view consider using PointAnnotation or SymbolLayer they'll offer much better performance
.
This is based on [MakerView plugin](https://docs.mapbox.com/android/plugins/overview/markerview/) on Android
and PointAnnotation on iOS. ## Props diff --git a/docs/components/NativeUserLocation.md b/docs/components/NativeUserLocation.md index 697729b78..a12b1d2d8 100644 --- a/docs/components/NativeUserLocation.md +++ b/docs/components/NativeUserLocation.md @@ -1,6 +1,6 @@ -# `` +# `` ## Props diff --git a/docs/components/PointAnnotation.md b/docs/components/PointAnnotation.md index b396e4dfa..29d83db55 100644 --- a/docs/components/PointAnnotation.md +++ b/docs/components/PointAnnotation.md @@ -1,6 +1,6 @@ -# `` +# `` PointAnnotation represents a one-dimensional shape located at a single geographical coordinate.

Consider using ShapeSource and SymbolLayer instead, if you have many points and you have static images,
they'll offer much better performance

.
If you need interctive views please use MarkerView,
as with PointAnnotation on Android child views are rendered onto a bitmap for better performance. ## Props diff --git a/docs/components/RasterLayer.md b/docs/components/RasterLayer.md index 1ff8a4f10..a072a6245 100644 --- a/docs/components/RasterLayer.md +++ b/docs/components/RasterLayer.md @@ -1,13 +1,13 @@ -# `` +# `` ## Props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | | style | `RasterLayerStyle` | `none` | `false` | Customizable style attributes | -| sourceID | `FIX ME UNKNOWN TYPE` | `MapLibreRN.StyleSource.DefaultSourceID` | `false` | FIX ME NO DESCRIPTION | +| sourceID | `FIX ME UNKNOWN TYPE` | `MLRNModule.StyleSource.DefaultSourceID` | `false` | FIX ME NO DESCRIPTION | ## Styles diff --git a/docs/components/RasterSource.md b/docs/components/RasterSource.md index becefedbd..2b70c6a45 100644 --- a/docs/components/RasterSource.md +++ b/docs/components/RasterSource.md @@ -1,12 +1,12 @@ -# `` +# `` RasterSource is a map content source that supplies raster image tiles to be shown on the map.
The location of and metadata about the tiles are defined either by an option dictionary
or by an external file that conforms to the TileJSON specification. ## Props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | -| id | `string` | `MapLibreRN.StyleSource.DefaultSourceID` | `false` | A string that uniquely identifies the source. | +| id | `string` | `MLRNModule.StyleSource.DefaultSourceID` | `false` | A string that uniquely identifies the source. | | url | `string` | `none` | `false` | A URL to a TileJSON configuration file describing the source’s contents and other metadata. | | tileUrlTemplates | `Array` | `none` | `false` | An array of tile URL templates. If multiple endpoints are specified, clients may use any combination of endpoints.
Example: https://example.com/raster-tiles/{z}/{x}/{y}.png | | minZoomLevel | `number` | `none` | `false` | An unsigned integer that specifies the minimum zoom level at which to display tiles from the source.
The value should be between 0 and 22, inclusive, and less than
maxZoomLevel, if specified. The default value for this option is 0. | diff --git a/docs/components/ShapeSource.md b/docs/components/ShapeSource.md index 112b43f2c..81bfb637e 100644 --- a/docs/components/ShapeSource.md +++ b/docs/components/ShapeSource.md @@ -1,12 +1,12 @@ -# `` +# `` ShapeSource is a map content source that supplies vector shapes to be shown on the map.
The shape may be a url or a GeoJSON object ## Props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | -| id | `string` | `MapLibreRN.StyleSource.DefaultSourceID` | `false` | A string that uniquely identifies the source. | +| id | `string` | `MLRNModule.StyleSource.DefaultSourceID` | `false` | A string that uniquely identifies the source. | | url | `string` | `none` | `false` | An HTTP(S) URL, absolute file URL, or local file URL relative to the current application’s resource bundle. | | shape | `GeoJSON.GeometryCollection \| GeoJSON.Feature \| GeoJSON.FeatureCollection \| GeoJSON.Geometry` | `none` | `false` | The contents of the source. A shape can represent a GeoJSON geometry, a feature, or a feature colllection. | | cluster | `boolean` | `none` | `false` | Enables clustering on the source for point shapes. | diff --git a/docs/components/SymbolLayer.md b/docs/components/SymbolLayer.md index 673037285..bfa54ab79 100644 --- a/docs/components/SymbolLayer.md +++ b/docs/components/SymbolLayer.md @@ -1,13 +1,13 @@ -# `` +# `` SymbolLayer is a style layer that renders icon and text labels at points or along lines on the map. ## Props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | | style | `SymbolLayerStyle` | `none` | `false` | Customizable style attributes | -| sourceID | `FIX ME UNKNOWN TYPE` | `MapLibreRN.StyleSource.DefaultSourceID` | `false` | FIX ME NO DESCRIPTION | +| sourceID | `FIX ME UNKNOWN TYPE` | `MLRNModule.StyleSource.DefaultSourceID` | `false` | FIX ME NO DESCRIPTION | ## Styles diff --git a/docs/components/UserLocation.md b/docs/components/UserLocation.md index 7ff852e21..0c9439555 100644 --- a/docs/components/UserLocation.md +++ b/docs/components/UserLocation.md @@ -1,6 +1,6 @@ -# `` +# `` ## Props diff --git a/docs/components/VectorSource.md b/docs/components/VectorSource.md index 09a854654..bfd67542b 100644 --- a/docs/components/VectorSource.md +++ b/docs/components/VectorSource.md @@ -1,12 +1,12 @@ -# `` +# `` VectorSource is a map content source that supplies tiled vector data in Mapbox Vector Tile format to be shown on the map.
The location of and metadata about the tiles are defined either by an option dictionary or by an external file that conforms to the TileJSON specification. ## Props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | -| id | `string` | `MapLibreRN.StyleSource.DefaultSourceID` | `false` | A string that uniquely identifies the source. | +| id | `string` | `MLRNModule.StyleSource.DefaultSourceID` | `false` | A string that uniquely identifies the source. | | url | `string` | `none` | `false` | A URL to a TileJSON configuration file describing the source’s contents and other metadata. | | tileUrlTemplates | `Array` | `none` | `false` | An array of tile URL templates. If multiple endpoints are specified, clients may use any combination of endpoints.
Example: https://example.com/vector-tiles/{z}/{x}/{y}.pbf | | minZoomLevel | `number` | `none` | `false` | An unsigned integer that specifies the minimum zoom level at which to display tiles from the source.
The value should be between 0 and 22, inclusive, and less than
maxZoomLevel, if specified. The default value for this option is 0. | diff --git a/docs/docs.json b/docs/docs.json index cfcb91f01..c36e4e2d2 100644 --- a/docs/docs.json +++ b/docs/docs.json @@ -101,7 +101,7 @@ "name": "sourceID", "required": false, "type": "FIX ME UNKNOWN TYPE", - "default": "MapLibreRN.StyleSource.DefaultSourceID", + "default": "MLRNModule.StyleSource.DefaultSourceID", "description": "FIX ME NO DESCRIPTION" } ], @@ -513,7 +513,7 @@ "required": false, "type": "UserTrackingMode", "default": "none", - "description": "The mode used to track the user location on the map. One of; \"normal\", \"compass\", \"course\". Each mode string is also available as a member on the `MapLibreGL.UserTrackingMode` object. `Follow` (normal), `FollowWithHeading` (compass), `FollowWithCourse` (course). NOTE: `followUserLocation` must be set to `true` for any of the modes to take effect. [Example](/packages/examples/src/examples/Camera/SetUserTrackingMode.js)" + "description": "The mode used to track the user location on the map. One of; \"normal\", \"compass\", \"course\". Each mode string is also available as a member on the `UserTrackingMode` object. `Follow` (normal), `FollowWithHeading` (compass), `FollowWithCourse` (course). NOTE: `followUserLocation` must be set to `true` for any of the modes to take effect. [Example](/packages/examples/src/examples/Camera/SetUserTrackingMode.js)" }, { "name": "followZoomLevel", @@ -570,7 +570,7 @@ "name": "sourceID", "required": false, "type": "FIX ME UNKNOWN TYPE", - "default": "MapLibreRN.StyleSource.DefaultSourceID", + "default": "MLRNModule.StyleSource.DefaultSourceID", "description": "FIX ME NO DESCRIPTION" } ], @@ -874,7 +874,7 @@ "name": "sourceID", "required": false, "type": "FIX ME UNKNOWN TYPE", - "default": "MapLibreRN.StyleSource.DefaultSourceID", + "default": "MLRNModule.StyleSource.DefaultSourceID", "description": "FIX ME NO DESCRIPTION" } ], @@ -1089,7 +1089,7 @@ "name": "sourceID", "required": false, "type": "FIX ME UNKNOWN TYPE", - "default": "MapLibreRN.StyleSource.DefaultSourceID", + "default": "MLRNModule.StyleSource.DefaultSourceID", "description": "FIX ME NO DESCRIPTION" } ], @@ -1317,7 +1317,7 @@ "name": "sourceID", "required": false, "type": "FIX ME UNKNOWN TYPE", - "default": "MapLibreRN.StyleSource.DefaultSourceID", + "default": "MLRNModule.StyleSource.DefaultSourceID", "description": "FIX ME NO DESCRIPTION" } ], @@ -1682,7 +1682,7 @@ "name": "sourceID", "required": false, "type": "FIX ME UNKNOWN TYPE", - "default": "MapLibreRN.StyleSource.DefaultSourceID", + "default": "MLRNModule.StyleSource.DefaultSourceID", "description": "FIX ME NO DESCRIPTION" } ], @@ -2409,7 +2409,7 @@ "required": false, "type": "string", "default": "none", - "description": "Style URL for map - notice, if non is set it _will_ default to `MapLibreGL.StyleURL.Default`" + "description": "Style URL for map - notice, if non is set it _will_ default to `StyleURL.Default`" }, { "name": "styleJSON", @@ -2780,7 +2780,7 @@ "name": "sourceID", "required": false, "type": "FIX ME UNKNOWN TYPE", - "default": "MapLibreRN.StyleSource.DefaultSourceID", + "default": "MLRNModule.StyleSource.DefaultSourceID", "description": "FIX ME NO DESCRIPTION" } ], @@ -2979,7 +2979,7 @@ "name": "id", "required": false, "type": "string", - "default": "MapLibreRN.StyleSource.DefaultSourceID", + "default": "MLRNModule.StyleSource.DefaultSourceID", "description": "A string that uniquely identifies the source." }, { @@ -3219,7 +3219,7 @@ "name": "id", "required": false, "type": "string", - "default": "MapLibreRN.StyleSource.DefaultSourceID", + "default": "MLRNModule.StyleSource.DefaultSourceID", "description": "A string that uniquely identifies the source." }, { @@ -3371,7 +3371,7 @@ "name": "sourceID", "required": false, "type": "FIX ME UNKNOWN TYPE", - "default": "MapLibreRN.StyleSource.DefaultSourceID", + "default": "MLRNModule.StyleSource.DefaultSourceID", "description": "FIX ME NO DESCRIPTION" } ], @@ -4904,7 +4904,7 @@ "name": "id", "required": false, "type": "string", - "default": "MapLibreRN.StyleSource.DefaultSourceID", + "default": "MLRNModule.StyleSource.DefaultSourceID", "description": "A string that uniquely identifies the source." }, { @@ -5055,7 +5055,7 @@ } ], "examples": [ - "const progressListener = (offlineRegion, status) => console.log(offlineRegion, status);\nconst errorListener = (offlineRegion, err) => console.log(offlineRegion, err);\n\nawait MapLibreGL.offlineManager.createPack({\n name: 'offlinePack',\n styleURL: 'https://demotiles.maplibre.org/tiles/tiles.json',\n minZoom: 14,\n maxZoom: 20,\n bounds: [[neLng, neLat], [swLng, swLat]]\n}, progressListener, errorListener)" + "const progressListener = (offlineRegion, status) => console.log(offlineRegion, status);\nconst errorListener = (offlineRegion, err) => console.log(offlineRegion, err);\n\nawait offlineManager.createPack({\n name: 'offlinePack',\n styleURL: 'https://demotiles.maplibre.org/tiles/tiles.json',\n minZoom: 14,\n maxZoom: 20,\n bounds: [[neLng, neLat], [swLng, swLat]]\n}, progressListener, errorListener)" ], "returns": { "description": "", @@ -5078,7 +5078,7 @@ } ], "examples": [ - "await MapLibreGL.offlineManager.invalidatePack('packName')" + "await offlineManager.invalidatePack('packName')" ], "returns": { "description": "", @@ -5101,7 +5101,7 @@ } ], "examples": [ - "await MapLibreGL.offlineManager.deletePack('packName')" + "await offlineManager.deletePack('packName')" ], "returns": { "description": "", @@ -5115,7 +5115,7 @@ "description": "Forces a revalidation of the tiles in the ambient cache and downloads a fresh version of the tiles from the tile server.\nThis is the recommend method for clearing the cache.\nThis is the most efficient method because tiles in the ambient cache are re-downloaded to remove outdated data from a device.\nIt does not erase resources from the ambient cache or delete the database, which can be computationally expensive operations that may carry unintended side effects.", "params": [], "examples": [ - "await MapLibreGL.offlineManager.invalidateAmbientCache();" + "await offlineManager.invalidateAmbientCache();" ], "returns": { "description": "", @@ -5129,7 +5129,7 @@ "description": "Erases resources from the ambient cache.\nThis method clears the cache and decreases the amount of space that map resources take up on the device.", "params": [], "examples": [ - "await MapLibreGL.offlineManager.clearAmbientCache();" + "await offlineManager.clearAmbientCache();" ], "returns": { "description": "", @@ -5152,7 +5152,7 @@ } ], "examples": [ - "await MapLibreGL.offlineManager.setMaximumAmbientCacheSize(5000000);" + "await offlineManager.setMaximumAmbientCacheSize(5000000);" ], "returns": { "description": "", @@ -5166,7 +5166,7 @@ "description": "Deletes the existing database, which includes both the ambient cache and offline packs, then reinitializes it.", "params": [], "examples": [ - "await MapLibreGL.offlineManager.resetDatabase();" + "await offlineManager.resetDatabase();" ], "returns": { "description": "", @@ -5180,7 +5180,7 @@ "description": "Retrieves all the current offline packs that are stored in the database.", "params": [], "examples": [ - "const offlinePacks = await MapLibreGL.offlineManager.getPacks();" + "const offlinePacks = await offlineManager.getPacks();" ], "returns": { "description": "", @@ -5203,7 +5203,7 @@ } ], "examples": [ - "const offlinePack = await MapLibreGL.offlineManager.getPack();" + "const offlinePack = await offlineManager.getPack();" ], "returns": { "description": "", @@ -5226,7 +5226,7 @@ } ], "examples": [ - "await MapLibreGL.offlineManager.mergeOfflineRegions(path);" + "await offlineManager.mergeOfflineRegions(path);" ], "returns": { "description": "", @@ -5249,7 +5249,7 @@ } ], "examples": [ - "MapLibreGL.offlineManager.setTileCountLimit(1000);" + "offlineManager.setTileCountLimit(1000);" ], "returns": { "description": "", @@ -5272,7 +5272,7 @@ } ], "examples": [ - "MapLibreGL.offlineManager.setProgressEventThrottle(500);" + "offlineManager.setProgressEventThrottle(500);" ], "returns": { "description": "", @@ -5311,7 +5311,7 @@ } ], "examples": [ - "const progressListener = (offlinePack, status) => console.log(offlinePack, status)\nconst errorListener = (offlinePack, err) => console.log(offlinePack, err)\nMapLibreGL.offlineManager.subscribe('packName', progressListener, errorListener)" + "const progressListener = (offlinePack, status) => console.log(offlinePack, status)\nconst errorListener = (offlinePack, err) => console.log(offlinePack, err)\nofflineManager.subscribe('packName', progressListener, errorListener)" ], "returns": { "description": "", @@ -5334,7 +5334,7 @@ } ], "examples": [ - "MapLibreGL.offlineManager.unsubscribe('packName')" + "offlineManager.unsubscribe('packName')" ], "returns": { "description": "", @@ -5367,7 +5367,7 @@ } ], "examples": [ - "// creates a temp file png of base map\nconst uri = await MapLibreGL.snapshotManager.takeSnap({\n centerCoordinate: [-74.126410, 40.797968],\n width: width,\n height: height,\n zoomLevel: 12,\n pitch: 30,\n heading: 20,\n styleURL: MapLibreGL.StyleURL.Default,\n writeToDisk: true, // Create a temporary file\n});\n\n// creates base64 png of base map without logo\nconst uri = await MapLibreGL.snapshotManager.takeSnap({\n centerCoordinate: [-74.126410, 40.797968],\n width: width,\n height: height,\n zoomLevel: 12,\n pitch: 30,\n heading: 20,\n styleURL: MapLibreGL.StyleURL.Default,\n withLogo: false, // Disable Mapbox logo (Android only)\n});\n\n// creates snapshot with bounds\nconst uri = await MapLibreGL.snapshotManager.takeSnap({\n bounds: [[-74.126410, 40.797968], [-74.143727, 40.772177]],\n width: width,\n height: height,\n styleURL: MapLibreGL.StyleURL.Default,\n});" + "// creates a temp file png of base map\nconst uri = await snapshotManager.takeSnap({\n centerCoordinate: [-74.126410, 40.797968],\n width: width,\n height: height,\n zoomLevel: 12,\n pitch: 30,\n heading: 20,\n styleURL: StyleURL.Default,\n writeToDisk: true, // Create a temporary file\n});\n\n// creates base64 png of base map without logo\nconst uri = await snapshotManager.takeSnap({\n centerCoordinate: [-74.126410, 40.797968],\n width: width,\n height: height,\n zoomLevel: 12,\n pitch: 30,\n heading: 20,\n styleURL: StyleURL.Default,\n withLogo: false, // Disable Mapbox logo (Android only)\n});\n\n// creates snapshot with bounds\nconst uri = await snapshotManager.takeSnap({\n bounds: [[-74.126410, 40.797968], [-74.143727, 40.772177]],\n width: width,\n height: height,\n styleURL: StyleURL.Default,\n});" ], "returns": { "description": "", diff --git a/docs/guides/CustomHTTPHeaders.md b/docs/guides/CustomHTTPHeaders.md index d3c419b1b..aceec08c9 100644 --- a/docs/guides/CustomHTTPHeaders.md +++ b/docs/guides/CustomHTTPHeaders.md @@ -54,13 +54,13 @@ You can add and remove headers at runtime. ### Adding a Header ```javascript -MapLibreGL.addCustomHeader("Authorization", "{auth header}"); +addCustomHeader("Authorization", "{auth header}"); ``` ### Removing a Header ```javascript -MapLibreGL.removeCustomHeader("Authorization"); +removeCustomHeader("Authorization"); ``` ### Working Example @@ -68,11 +68,11 @@ MapLibreGL.removeCustomHeader("Authorization"); ```javascript export default function App() { useEffect(() => { - MapLibreGL.addCustomHeader("Authorization", "{auth header}"); + addCustomHeader("Authorization", "{auth header}"); }, []); - MapLibreGL.addCustomHeader("X-Some-Header", "my-value"); + addCustomHeader("X-Some-Header", "my-value"); - return ; + return ; } ``` diff --git a/docs/guides/MapLibreGL.md b/docs/guides/MLRNModule.md similarity index 99% rename from docs/guides/MapLibreGL.md rename to docs/guides/MLRNModule.md index f93e5b097..1c0ac0148 100644 --- a/docs/guides/MapLibreGL.md +++ b/docs/guides/MLRNModule.md @@ -1,4 +1,4 @@ -# MapLibreGL +# MLRNModule ## Methods diff --git a/docs/guides/setup/Android.md b/docs/guides/setup/Android.md index 3369c2e7d..54bca129e 100644 --- a/docs/guides/setup/Android.md +++ b/docs/guides/setup/Android.md @@ -10,7 +10,7 @@ you have to have a line like this in your code before using the library. You can put this near the top of your `App.js` for convenience. ```javascript -MapLibreGL.setAccessToken(null); +setAccessToken(null); ``` ## Setting connection status @@ -26,7 +26,5 @@ Manually sets the connectivity state of the app, bypassing any checks to the and `null` for the normal `ConnectivityManager` behavior. ```js -import MapLibreGL from "@maplibre/maplibre-react-native"; - -MapLibreGL.setConnected(true); +setConnected(true); ``` diff --git a/docs/guides/setup/GettingStarted.md b/docs/guides/setup/GettingStarted.md index 9835338f8..0e01443aa 100644 --- a/docs/guides/setup/GettingStarted.md +++ b/docs/guides/setup/GettingStarted.md @@ -55,14 +55,14 @@ Here is an example minimal `App.tsx`: ```tsx import React from "react"; -import MapLibreGL from "@maplibre/maplibre-react-native"; +import { MapView, setAccessToken } from "@maplibre/maplibre-react-native"; // Will be null for most users (only Mapbox authenticates this way). // Required on Android. See Android installation notes. -MapLibreGL.setAccessToken(null); +setAccessToken(null); export default function App() { - return ; + return ; } ``` diff --git a/docs/modules/coordinates.md b/docs/modules/coordinates.md index d51df86c8..095d5e021 100644 --- a/docs/modules/coordinates.md +++ b/docs/modules/coordinates.md @@ -1,6 +1,6 @@ -# `` +# `` Coorinates sent by locationManager diff --git a/docs/modules/location.md b/docs/modules/location.md index 17f690303..2e4aa0fa4 100644 --- a/docs/modules/location.md +++ b/docs/modules/location.md @@ -1,6 +1,6 @@ -# `` +# `` Location sent by locationManager diff --git a/docs/modules/offlineManager.md b/docs/modules/offlineManager.md index 4eeac181e..52a17db38 100644 --- a/docs/modules/offlineManager.md +++ b/docs/modules/offlineManager.md @@ -1,6 +1,6 @@ -# `` +# `` OfflineManager implements a singleton (shared object) that manages offline packs.
All of this class’s instance methods are asynchronous, reflecting the fact that offline resources are stored in a database.
The shared object maintains a canonical collection of offline packs. @@ -22,7 +22,7 @@ Creates and registers an offline pack that downloads the resources needed to use const progressListener = (offlineRegion, status) => console.log(offlineRegion, status); const errorListener = (offlineRegion, err) => console.log(offlineRegion, err); -await MapLibreGL.offlineManager.createPack({ +await offlineManager.createPack({ name: 'offlinePack', styleURL: 'https://demotiles.maplibre.org/tiles/tiles.json', minZoom: 14, @@ -44,7 +44,7 @@ Invalidates the specified offline pack. This method checks that the tiles in the ```javascript -await MapLibreGL.offlineManager.invalidatePack('packName') +await offlineManager.invalidatePack('packName') ``` @@ -60,7 +60,7 @@ Unregisters the given offline pack and allows resources that are no longer requi ```javascript -await MapLibreGL.offlineManager.deletePack('packName') +await offlineManager.deletePack('packName') ``` @@ -72,7 +72,7 @@ Forces a revalidation of the tiles in the ambient cache and downloads a fresh ve ```javascript -await MapLibreGL.offlineManager.invalidateAmbientCache(); +await offlineManager.invalidateAmbientCache(); ``` @@ -84,7 +84,7 @@ Erases resources from the ambient cache.
This method clears the cache and de ```javascript -await MapLibreGL.offlineManager.clearAmbientCache(); +await offlineManager.clearAmbientCache(); ``` @@ -100,7 +100,7 @@ Sets the maximum size of the ambient cache in bytes. Disables the ambient cache ```javascript -await MapLibreGL.offlineManager.setMaximumAmbientCacheSize(5000000); +await offlineManager.setMaximumAmbientCacheSize(5000000); ``` @@ -112,7 +112,7 @@ Deletes the existing database, which includes both the ambient cache and offline ```javascript -await MapLibreGL.offlineManager.resetDatabase(); +await offlineManager.resetDatabase(); ``` @@ -124,7 +124,7 @@ Retrieves all the current offline packs that are stored in the database. ```javascript -const offlinePacks = await MapLibreGL.offlineManager.getPacks(); +const offlinePacks = await offlineManager.getPacks(); ``` @@ -140,7 +140,7 @@ Retrieves an offline pack that is stored in the database by name. ```javascript -const offlinePack = await MapLibreGL.offlineManager.getPack(); +const offlinePack = await offlineManager.getPack(); ``` @@ -156,7 +156,7 @@ Sideloads offline db ```javascript -await MapLibreGL.offlineManager.mergeOfflineRegions(path); +await offlineManager.mergeOfflineRegions(path); ``` @@ -172,7 +172,7 @@ Sets the maximum number of tiles that may be downloaded and stored on the curren ```javascript -MapLibreGL.offlineManager.setTileCountLimit(1000); +offlineManager.setTileCountLimit(1000); ``` @@ -188,7 +188,7 @@ Sets the period at which download status events will be sent over the React Nati ```javascript -MapLibreGL.offlineManager.setProgressEventThrottle(500); +offlineManager.setProgressEventThrottle(500); ``` @@ -208,7 +208,7 @@ Subscribe to download status/error events for the requested offline pack.
No ```javascript const progressListener = (offlinePack, status) => console.log(offlinePack, status) const errorListener = (offlinePack, err) => console.log(offlinePack, err) -MapLibreGL.offlineManager.subscribe('packName', progressListener, errorListener) +offlineManager.subscribe('packName', progressListener, errorListener) ``` @@ -224,7 +224,7 @@ Unsubscribes any listeners associated with the offline pack.
It's a good ide ```javascript -MapLibreGL.offlineManager.unsubscribe('packName') +offlineManager.unsubscribe('packName') ``` diff --git a/docs/modules/snapshotManager.md b/docs/modules/snapshotManager.md index caf7541ef..8a7596801 100644 --- a/docs/modules/snapshotManager.md +++ b/docs/modules/snapshotManager.md @@ -1,6 +1,6 @@ -# `` +# `` The snapshotManager generates static raster images of the map.
Each snapshot image depicts a portion of a map defined by an SnapshotOptions object you provide.
The snapshotter generates the snapshot asynchronous. @@ -18,35 +18,35 @@ Takes a snapshot of the base map using the provided Snapshot options. NOTE pitch ```javascript // creates a temp file png of base map -const uri = await MapLibreGL.snapshotManager.takeSnap({ +const uri = await snapshotManager.takeSnap({ centerCoordinate: [-74.126410, 40.797968], width: width, height: height, zoomLevel: 12, pitch: 30, heading: 20, - styleURL: MapLibreGL.StyleURL.Default, + styleURL: StyleURL.Default, writeToDisk: true, // Create a temporary file }); // creates base64 png of base map without logo -const uri = await MapLibreGL.snapshotManager.takeSnap({ +const uri = await snapshotManager.takeSnap({ centerCoordinate: [-74.126410, 40.797968], width: width, height: height, zoomLevel: 12, pitch: 30, heading: 20, - styleURL: MapLibreGL.StyleURL.Default, + styleURL: StyleURL.Default, withLogo: false, // Disable Mapbox logo (Android only) }); // creates snapshot with bounds -const uri = await MapLibreGL.snapshotManager.takeSnap({ +const uri = await snapshotManager.takeSnap({ bounds: [[-74.126410, 40.797968], [-74.143727, 40.772177]], width: width, height: height, - styleURL: MapLibreGL.StyleURL.Default, + styleURL: StyleURL.Default, }); ``` diff --git a/packages/examples/src/App.tsx b/packages/examples/src/App.tsx index cc00a481a..c0f02fc1e 100755 --- a/packages/examples/src/App.tsx +++ b/packages/examples/src/App.tsx @@ -1,4 +1,7 @@ -import MapLibreGL from "@maplibre/maplibre-react-native"; +import { + requestAndroidLocationPermissions, + setAccessToken, +} from "@maplibre/maplibre-react-native"; import { useEffect, useState } from "react"; import { LogBox, Platform, StyleSheet, Text, View } from "react-native"; import { SafeAreaProvider, SafeAreaView } from "react-native-safe-area-context"; @@ -21,7 +24,7 @@ const styles = StyleSheet.create({ const IS_ANDROID = Platform.OS === "android"; -MapLibreGL.setAccessToken(null); +setAccessToken(null); export function App() { const [isFetchingAndroidPermission, setIsFetchingAndroidPermission] = @@ -32,7 +35,7 @@ export function App() { useEffect(() => { (async () => { if (IS_ANDROID) { - const isGranted = await MapLibreGL.requestAndroidLocationPermissions(); + const isGranted = await requestAndroidLocationPermissions(); setIsAndroidPermissionGranted(isGranted); setIsFetchingAndroidPermission(false); diff --git a/packages/examples/src/components/PulseCircleLayer.tsx b/packages/examples/src/components/PulseCircleLayer.tsx index e336c9c97..2049dcf0c 100755 --- a/packages/examples/src/components/PulseCircleLayer.tsx +++ b/packages/examples/src/components/PulseCircleLayer.tsx @@ -1,4 +1,5 @@ -import MapLibreGL, { +import { + Animated as MLRNAnimated, type CircleLayerStyle, } from "@maplibre/maplibre-react-native"; import { useEffect, useRef } from "react"; @@ -92,8 +93,8 @@ function PulseCircleLayer({ } return ( - - + - - - + ); } diff --git a/packages/examples/src/examples/Animations/AnimateCircleAlongLine.tsx b/packages/examples/src/examples/Animations/AnimateCircleAlongLine.tsx index dffafe551..3a7da2590 100755 --- a/packages/examples/src/examples/Animations/AnimateCircleAlongLine.tsx +++ b/packages/examples/src/examples/Animations/AnimateCircleAlongLine.tsx @@ -1,5 +1,10 @@ -import MapLibreGL, { +import { + Animated, + Camera, + LineLayer, type LineLayerStyle, + MapView, + ShapeSource, } from "@maplibre/maplibre-react-native"; import { useEffect, useState } from "react"; @@ -86,20 +91,20 @@ export default function AnimateCircleAlongLine() { }; return ( - + {/* @ts-ignore */} - - + ); }; return ( - - + - - - + + + {currentPoint && } {renderProgressLine()} - + ); } diff --git a/packages/examples/src/examples/Annotations/CustomCallout.tsx b/packages/examples/src/examples/Annotations/CustomCallout.tsx index 4523ec757..5eeb49071 100644 --- a/packages/examples/src/examples/Annotations/CustomCallout.tsx +++ b/packages/examples/src/examples/Annotations/CustomCallout.tsx @@ -1,4 +1,9 @@ -import MapLibreGL from "@maplibre/maplibre-react-native"; +import { + MapView, + MarkerView, + ShapeSource, + SymbolLayer, +} from "@maplibre/maplibre-react-native"; import { useState } from "react"; import { Text, View } from "react-native"; @@ -11,8 +16,8 @@ export default function CustomCallout() { useState>(); return ( - - + { @@ -23,7 +28,7 @@ export default function CustomCallout() { setSelectedFeature(feature); }} > - - + {selectedFeature && ( - {selectedFeature?.properties?.name} - + )} - + ); } diff --git a/packages/examples/src/examples/Annotations/Heatmap.tsx b/packages/examples/src/examples/Annotations/Heatmap.tsx index 8ea6e13ed..65e6df547 100644 --- a/packages/examples/src/examples/Annotations/Heatmap.tsx +++ b/packages/examples/src/examples/Annotations/Heatmap.tsx @@ -1,15 +1,19 @@ -import MapLibreGL from "@maplibre/maplibre-react-native"; +import { + HeatmapLayer, + MapView, + ShapeSource, +} from "@maplibre/maplibre-react-native"; import { sheet } from "../../styles/sheet"; export default function Heatmap() { return ( - - + - - - + + ); } diff --git a/packages/examples/src/examples/Annotations/MarkerView.tsx b/packages/examples/src/examples/Annotations/MarkerView.tsx index 2c19989df..44ebfa8e1 100644 --- a/packages/examples/src/examples/Annotations/MarkerView.tsx +++ b/packages/examples/src/examples/Annotations/MarkerView.tsx @@ -1,4 +1,9 @@ -import MapLibreGL from "@maplibre/maplibre-react-native"; +import { + Camera, + MapView, + MarkerView, + PointAnnotation, +} from "@maplibre/maplibre-react-native"; import { StyleSheet, Text, TouchableOpacity, View } from "react-native"; import { sheet } from "../../styles/sheet"; @@ -43,18 +48,18 @@ const COORDINATES = [ [-73.99155, 40.73681], ] as [GeoJSON.Position, GeoJSON.Position]; -export default function MarkerView() { +export default function MarkerViewExample() { return ( - - + + - + - + - + - - + + ); } diff --git a/packages/examples/src/examples/Annotations/PointAnnotationAnchors.js b/packages/examples/src/examples/Annotations/PointAnnotationAnchors.js index f2a6197ac..51ec07129 100644 --- a/packages/examples/src/examples/Annotations/PointAnnotationAnchors.js +++ b/packages/examples/src/examples/Annotations/PointAnnotationAnchors.js @@ -1,4 +1,8 @@ -import MapLibreGL from "@maplibre/maplibre-react-native"; +import { + Camera, + MapView, + PointAnnotation, +} from "@maplibre/maplibre-react-native"; import React from "react"; import { StyleSheet, Text, View } from "react-native"; @@ -71,10 +75,10 @@ const styles = StyleSheet.create({ const PointAnnotationAnchors = () => { return ( - - + + {corners.map((p, i) => ( - { x={p.anchor.x.toPrecision(2)}, y={p.anchor.y.toPrecision(2)} - + ))} {sides.map((p, i) => { let { x, y } = p.anchor; @@ -96,7 +100,7 @@ const PointAnnotationAnchors = () => { y = 0; } return ( - { x={p.anchor.x.toPrecision(2)}, y={p.anchor.y.toPrecision(2)} - + ); })} - + ); }; diff --git a/packages/examples/src/examples/Annotations/ShowPointAnnotation.tsx b/packages/examples/src/examples/Annotations/ShowPointAnnotation.tsx index ebd76380a..64f934ffe 100755 --- a/packages/examples/src/examples/Annotations/ShowPointAnnotation.tsx +++ b/packages/examples/src/examples/Annotations/ShowPointAnnotation.tsx @@ -1,4 +1,12 @@ -import MapLibreGL from "@maplibre/maplibre-react-native"; +import { + Callout, + Camera, + FillLayer, + MapView, + PointAnnotation, + type PointAnnotationRef, + ShapeSource, +} from "@maplibre/maplibre-react-native"; import { type ReactNode, useRef, useState } from "react"; import { Image, @@ -39,10 +47,10 @@ const AnnotationWithRemoteImage = ({ coordinate, title, }: AnnotationWithRemoteImageProps) => { - const pointAnnotation = useRef(null); + const pointAnnotation = useRef(null); return ( - - - + + ); }; @@ -101,15 +109,15 @@ const ShowPointAnnotation = () => { } else { items.push( null, - - - , + + , ); } }); @@ -119,7 +127,7 @@ const ShowPointAnnotation = () => { return ( <> - { setCoordinates((prevState) => [ ...prevState, @@ -128,13 +136,13 @@ const ShowPointAnnotation = () => { }} style={sheet.matchParent} > - {renderAnnotations()} - { type: "Polygon", }} > - { fillOutlineColor: "red", }} /> - - + + diff --git a/packages/examples/src/examples/CacheManagement.js b/packages/examples/src/examples/CacheManagement.js index 0d2aa3412..09576a5f9 100755 --- a/packages/examples/src/examples/CacheManagement.js +++ b/packages/examples/src/examples/CacheManagement.js @@ -1,4 +1,4 @@ -import MapLibreGL, { MapView } from "@maplibre/maplibre-react-native"; +import { MapView, offlineManager } from "@maplibre/maplibre-react-native"; import React from "react"; import { Alert, @@ -50,23 +50,23 @@ class CacheManagement extends React.Component { }; invalidateAmbientCache = async () => { - await MapLibreGL.offlineManager.invalidateAmbientCache(); + await offlineManager.invalidateAmbientCache(); Alert.alert("Ambient cache successfully invalidated"); }; resetDatabase = async () => { - await MapLibreGL.offlineManager.resetDatabase(); + await offlineManager.resetDatabase(); Alert.alert("Database successfully reset"); }; clearAmbientCache = async () => { - await MapLibreGL.offlineManager.clearAmbientCache(); + await offlineManager.clearAmbientCache(); Alert.alert("Ambient cache successfully cleared"); }; setMaximumAmbientCacheSize = async () => { const newMaxSize = parseInt(this.state.cacheSize, 10); - await MapLibreGL.offlineManager.setMaximumAmbientCacheSize(newMaxSize); + await offlineManager.setMaximumAmbientCacheSize(newMaxSize); Alert.alert(`Max cache size successfully set to ${newMaxSize} bytes`); }; diff --git a/packages/examples/src/examples/Camera/Fit.js b/packages/examples/src/examples/Camera/Fit.js index 40fb58ea7..29666032f 100755 --- a/packages/examples/src/examples/Camera/Fit.js +++ b/packages/examples/src/examples/Camera/Fit.js @@ -1,4 +1,4 @@ -import MapLibreGL from "@maplibre/maplibre-react-native"; +import { Camera, MapView, StyleURL } from "@maplibre/maplibre-react-native"; import { isEqual } from "lodash"; import React from "react"; import { ScrollView, Text, TouchableOpacity, View } from "react-native"; @@ -186,18 +186,12 @@ class Fit extends React.Component { return ( <> - - (this.camera = ref)} - {...this.cameraProps()} - /> + + (this.camera = ref)} {...this.cameraProps()} /> - + - - + - - + + ); } diff --git a/packages/examples/src/examples/Camera/GetCenter.js b/packages/examples/src/examples/Camera/GetCenter.js index 7fc77f582..d7f6ee42b 100755 --- a/packages/examples/src/examples/Camera/GetCenter.js +++ b/packages/examples/src/examples/Camera/GetCenter.js @@ -1,4 +1,4 @@ -import MapLibreGL from "@maplibre/maplibre-react-native"; +import { Camera, MapView } from "@maplibre/maplibre-react-native"; import React from "react"; import { Text } from "react-native"; @@ -39,17 +39,14 @@ class GetCenter extends React.Component { render() { return ( <> - (this._map = c)} onPress={this.onPress} style={styles.mapView} > - - + + Center diff --git a/packages/examples/src/examples/Camera/GetZoom.tsx b/packages/examples/src/examples/Camera/GetZoom.tsx index 763045cd4..d86119d0d 100755 --- a/packages/examples/src/examples/Camera/GetZoom.tsx +++ b/packages/examples/src/examples/Camera/GetZoom.tsx @@ -1,4 +1,4 @@ -import MapLibreGL from "@maplibre/maplibre-react-native"; +import { MapView, type MapViewRef } from "@maplibre/maplibre-react-native"; import { useRef, useState } from "react"; import { Text } from "react-native"; @@ -7,11 +7,11 @@ import { sheet } from "../../styles/sheet"; export default function GetZoom() { const [zoom, setZoom] = useState(); - const mapViewRef = useRef(null); + const mapViewRef = useRef(null); return ( <> - { setZoom(await mapViewRef.current?.getZoom()); diff --git a/packages/examples/src/examples/Camera/RestrictMapBounds.tsx b/packages/examples/src/examples/Camera/RestrictMapBounds.tsx index 59fa02e57..53a2af267 100644 --- a/packages/examples/src/examples/Camera/RestrictMapBounds.tsx +++ b/packages/examples/src/examples/Camera/RestrictMapBounds.tsx @@ -1,4 +1,9 @@ -import MapLibreGL from "@maplibre/maplibre-react-native"; +import { + Camera, + FillLayer, + MapView, + ShapeSource, +} from "@maplibre/maplibre-react-native"; import bboxPolygon from "@turf/bbox-polygon"; import { EU_BOUNDS } from "../../constants/GEOMETRIES"; @@ -14,10 +19,10 @@ const POLYGON = bboxPolygon([ export default function RestrictMapBounds() { return ( - - - - + + + - - + + ); } diff --git a/packages/examples/src/examples/Camera/SetHeading.js b/packages/examples/src/examples/Camera/SetHeading.js index 3a4bcb9b1..64c8a4a69 100755 --- a/packages/examples/src/examples/Camera/SetHeading.js +++ b/packages/examples/src/examples/Camera/SetHeading.js @@ -1,4 +1,9 @@ -import MapLibreGL from "@maplibre/maplibre-react-native"; +import { + Camera, + locationManager, + MapView, + UserLocation, +} from "@maplibre/maplibre-react-native"; import React from "react"; import TabBarView from "../../components/TabBarView"; @@ -25,7 +30,7 @@ class SetHeading extends React.Component { } componentDidMount() { - MapLibreGL.locationManager.start(); + locationManager.start(); } componentDidUpdate() { @@ -35,7 +40,7 @@ class SetHeading extends React.Component { } componentWillUnmount() { - MapLibreGL.locationManager.stop(); + locationManager.stop(); } onHeadingChange(index, heading) { @@ -49,13 +54,10 @@ class SetHeading extends React.Component { options={this._bearingOptions} onOptionPress={this.onHeadingChange} > - (this.map = ref)} - style={sheet.matchParent} - > - - - + (this.map = ref)} style={sheet.matchParent}> + + + ); } diff --git a/packages/examples/src/examples/Camera/SetPitch.js b/packages/examples/src/examples/Camera/SetPitch.js index 44c363d89..076cd8482 100755 --- a/packages/examples/src/examples/Camera/SetPitch.js +++ b/packages/examples/src/examples/Camera/SetPitch.js @@ -1,4 +1,9 @@ -import MapLibreGL from "@maplibre/maplibre-react-native"; +import { + Camera, + locationManager, + MapView, + UserLocation, +} from "@maplibre/maplibre-react-native"; import React from "react"; import TabBarView from "../../components/TabBarView"; @@ -24,11 +29,11 @@ class SetPitch extends React.Component { } componentDidMount() { - MapLibreGL.locationManager.start(); + locationManager.start(); } componentWillUnmount() { - MapLibreGL.locationManager.stop(); + locationManager.stop(); } onUpdatePitch(index, pitch) { @@ -42,10 +47,10 @@ class SetPitch extends React.Component { options={this._pitchOptions} onOptionPress={this.onUpdatePitch} > - - - - + + + + ); } diff --git a/packages/examples/src/examples/Camera/TakeSnapshot.js b/packages/examples/src/examples/Camera/TakeSnapshot.js index 90e710882..02d4e9343 100755 --- a/packages/examples/src/examples/Camera/TakeSnapshot.js +++ b/packages/examples/src/examples/Camera/TakeSnapshot.js @@ -1,4 +1,4 @@ -import MapLibreGL from "@maplibre/maplibre-react-native"; +import { snapshotManager, StyleURL } from "@maplibre/maplibre-react-native"; import React from "react"; import { ActivityIndicator, @@ -36,14 +36,14 @@ class TakeSnapshot extends React.Component { async takeSnapshot() { const { width, height } = Dimensions.get("window"); - const uri = await MapLibreGL.snapshotManager.takeSnap({ + const uri = await snapshotManager.takeSnap({ centerCoordinate: [-74.12641, 40.797968], width, height, zoomLevel: 3, pitch: 30, heading: 20, - styleURL: MapLibreGL.StyleURL.Default, + styleURL: StyleURL.Default, writeToDisk: true, }); diff --git a/packages/examples/src/examples/Camera/TakeSnapshotWithMap.js b/packages/examples/src/examples/Camera/TakeSnapshotWithMap.js index 9486c35b9..b1d7975f8 100755 --- a/packages/examples/src/examples/Camera/TakeSnapshotWithMap.js +++ b/packages/examples/src/examples/Camera/TakeSnapshotWithMap.js @@ -1,4 +1,4 @@ -import MapLibreGL from "@maplibre/maplibre-react-native"; +import { Camera, MapView } from "@maplibre/maplibre-react-native"; import React from "react"; import { Image, StyleSheet, Text, TouchableOpacity, View } from "react-native"; @@ -38,16 +38,13 @@ class TakeSnapshotWithMap extends React.Component { return ( <> - (this.map = ref)} - style={styles.map} - > - (this.map = ref)} style={styles.map}> + - + {this.state.uri ? ( diff --git a/packages/examples/src/examples/Camera/YoYo.tsx b/packages/examples/src/examples/Camera/YoYo.tsx index 2c150169c..472908911 100755 --- a/packages/examples/src/examples/Camera/YoYo.tsx +++ b/packages/examples/src/examples/Camera/YoYo.tsx @@ -1,4 +1,4 @@ -import MapLibreGL from "@maplibre/maplibre-react-native"; +import { Camera, MapView } from "@maplibre/maplibre-react-native"; import { useEffect, useState } from "react"; import { sheet } from "../../styles/sheet"; @@ -25,12 +25,12 @@ export default function YoYo() { }, []); return ( - - + - + ); } diff --git a/packages/examples/src/examples/FillRasterLayer/CustomVectorSource.tsx b/packages/examples/src/examples/FillRasterLayer/CustomVectorSource.tsx index ab8e70b2f..e5e6622f8 100755 --- a/packages/examples/src/examples/FillRasterLayer/CustomVectorSource.tsx +++ b/packages/examples/src/examples/FillRasterLayer/CustomVectorSource.tsx @@ -1,4 +1,8 @@ -import MapLibreGL from "@maplibre/maplibre-react-native"; +import { + FillLayer, + MapView, + VectorSource, +} from "@maplibre/maplibre-react-native"; import { useRef, useState } from "react"; import { Text } from "react-native"; @@ -11,8 +15,8 @@ export default function CustomVectorSource() { return ( <> - - + - - - + + { const features = await vectorSourceRef.current?.features?.([ diff --git a/packages/examples/src/examples/FillRasterLayer/GeoJSONSource.tsx b/packages/examples/src/examples/FillRasterLayer/GeoJSONSource.tsx index 353b4157b..334f09c4b 100755 --- a/packages/examples/src/examples/FillRasterLayer/GeoJSONSource.tsx +++ b/packages/examples/src/examples/FillRasterLayer/GeoJSONSource.tsx @@ -1,4 +1,10 @@ -import MapLibreGL from "@maplibre/maplibre-react-native"; +import { + BackgroundLayer, + Camera, + FillLayer, + MapView, + ShapeSource, +} from "@maplibre/maplibre-react-native"; import type { FeatureCollection } from "geojson"; import smileyFeatureCollection from "../../assets/geojson/smiley.json"; @@ -7,24 +13,21 @@ import { sheet } from "../../styles/sheet"; export default function GeoJSONSource() { return ( - - + + - - - - - + + ); } diff --git a/packages/examples/src/examples/FillRasterLayer/ImageOverlay.tsx b/packages/examples/src/examples/FillRasterLayer/ImageOverlay.tsx index 1223ba218..dd8b67dd8 100755 --- a/packages/examples/src/examples/FillRasterLayer/ImageOverlay.tsx +++ b/packages/examples/src/examples/FillRasterLayer/ImageOverlay.tsx @@ -1,4 +1,9 @@ -import MapLibreGL from "@maplibre/maplibre-react-native"; +import { + Camera, + ImageSource, + MapView, + RasterLayer, +} from "@maplibre/maplibre-react-native"; import { useEffect, useState } from "react"; import radar0 from "../../assets/images/radar0.png"; @@ -48,16 +53,16 @@ export default function ImageOverlay() { }, []); return ( - - + + - - - - + + + ); } diff --git a/packages/examples/src/examples/FillRasterLayer/IndoorBuilding.tsx b/packages/examples/src/examples/FillRasterLayer/IndoorBuilding.tsx index 94bf269a0..1f0dc0bf3 100755 --- a/packages/examples/src/examples/FillRasterLayer/IndoorBuilding.tsx +++ b/packages/examples/src/examples/FillRasterLayer/IndoorBuilding.tsx @@ -1,5 +1,10 @@ -import MapLibreGL, { +import { + Camera, + FillExtrusionLayer, type FillExtrusionLayerStyle, + Light, + MapView, + ShapeSource, } from "@maplibre/maplibre-react-native"; import { useState } from "react"; @@ -31,26 +36,23 @@ export default function IndoorBuilding() { }))} onOptionPress={(_index, data) => setValue(data)} > - - + - + - - - - + + + ); } diff --git a/packages/examples/src/examples/FillRasterLayer/OpenStreetMapRasterTiles.tsx b/packages/examples/src/examples/FillRasterLayer/OpenStreetMapRasterTiles.tsx index 4fcca422d..7fa0d3891 100755 --- a/packages/examples/src/examples/FillRasterLayer/OpenStreetMapRasterTiles.tsx +++ b/packages/examples/src/examples/FillRasterLayer/OpenStreetMapRasterTiles.tsx @@ -1,4 +1,8 @@ -import MapLibreGL from "@maplibre/maplibre-react-native"; +import { + MapView, + RasterLayer, + RasterSource, +} from "@maplibre/maplibre-react-native"; import { useState } from "react"; import TabBarView from "../../components/TabBarView"; @@ -20,18 +24,15 @@ export default function OpenStreetMapRasterTiles() { }))} onOptionPress={(_index, data) => setValue(data)} > - - + - - - + + + ); } diff --git a/packages/examples/src/examples/FillRasterLayer/QueryAtPoint.js b/packages/examples/src/examples/FillRasterLayer/QueryAtPoint.js index d3826c184..27f80edaa 100755 --- a/packages/examples/src/examples/FillRasterLayer/QueryAtPoint.js +++ b/packages/examples/src/examples/FillRasterLayer/QueryAtPoint.js @@ -1,4 +1,10 @@ -import MapLibreGL from "@maplibre/maplibre-react-native"; +import { + Camera, + FillLayer, + MapView, + ShapeSource, + StyleURL, +} from "@maplibre/maplibre-react-native"; import React from "react"; import { Text } from "react-native"; @@ -54,36 +60,27 @@ class QueryAtPoint extends React.Component { render() { return ( <> - (this._map = c)} onPress={this.onPress} style={sheet.matchParent} - styleURL={MapLibreGL.StyleURL.Default} + styleURL={StyleURL.Default} > - + - - - + + + {this.state.selectedGeoJSON ? ( - - + - + ) : null} - + Press on a feature to highlight it. diff --git a/packages/examples/src/examples/FillRasterLayer/QueryWithRect.js b/packages/examples/src/examples/FillRasterLayer/QueryWithRect.js index 202454845..a5dcf0692 100755 --- a/packages/examples/src/examples/FillRasterLayer/QueryWithRect.js +++ b/packages/examples/src/examples/FillRasterLayer/QueryWithRect.js @@ -1,4 +1,10 @@ -import MapLibreGL from "@maplibre/maplibre-react-native"; +import { + Camera, + FillLayer, + MapView, + ShapeSource, + StyleURL, +} from "@maplibre/maplibre-react-native"; import React from "react"; import { Text } from "react-native"; @@ -75,36 +81,27 @@ class QueryWithRect extends React.Component { render() { return ( <> - (this._map = c)} onPress={this.onPress} style={sheet.matchParent} - styleURL={MapLibreGL.StyleURL.Default} + styleURL={StyleURL.Default} > - - - - - + + + + + {this.state.selectedGeoJSON ? ( - - + - + ) : null} - + {this.message} diff --git a/packages/examples/src/examples/LineLayer/GradientLine.js b/packages/examples/src/examples/LineLayer/GradientLine.js index d35a58109..986c9b9a6 100644 --- a/packages/examples/src/examples/LineLayer/GradientLine.js +++ b/packages/examples/src/examples/LineLayer/GradientLine.js @@ -1,4 +1,9 @@ -import MapLibreGL from "@maplibre/maplibre-react-native"; +import { + Camera, + LineLayer, + MapView, + ShapeSource, +} from "@maplibre/maplibre-react-native"; import React from "react"; import { sheet } from "../../styles/sheet"; @@ -32,12 +37,9 @@ const styles = { class GradientLine extends React.Component { render() { return ( - - - + + - - - + + + ); } } diff --git a/packages/examples/src/examples/Map/ChangeLayerColor.js b/packages/examples/src/examples/Map/ChangeLayerColor.js index 8417cb9bc..dec9ed1e5 100644 --- a/packages/examples/src/examples/Map/ChangeLayerColor.js +++ b/packages/examples/src/examples/Map/ChangeLayerColor.js @@ -1,4 +1,8 @@ -import MapLibreGL from "@maplibre/maplibre-react-native"; +import { + BackgroundLayer, + Camera, + MapView, +} from "@maplibre/maplibre-react-native"; import React from "react"; import { Text } from "react-native"; @@ -27,19 +31,16 @@ class ChangeLayerColor extends React.Component { const { backgroundColor } = this.state; return ( <> - (this._map = c)} onPress={this.onPress} style={styles.mapView} > - + {!!backgroundColor && ( - + )} - + Paint Water diff --git a/packages/examples/src/examples/Map/CreateOfflineRegion.tsx b/packages/examples/src/examples/Map/CreateOfflineRegion.tsx index bf006c353..acee7e17a 100755 --- a/packages/examples/src/examples/Map/CreateOfflineRegion.tsx +++ b/packages/examples/src/examples/Map/CreateOfflineRegion.tsx @@ -1,6 +1,10 @@ import geoViewport from "@mapbox/geo-viewport"; -import MapLibreGL, { +import { + Camera, + MapView, + offlineManager, OfflinePack, + OfflinePackDownloadState, type OfflinePackError, type OfflinePackStatus, } from "@maplibre/maplibre-react-native"; @@ -50,17 +54,17 @@ const styles = StyleSheet.create({ }, }); -type OfflinePackDownloadState = - (typeof MapLibreGL.OfflinePackDownloadState)[keyof typeof MapLibreGL.OfflinePackDownloadState]; +type CustomOfflinePackDownloadState = + (typeof OfflinePackDownloadState)[keyof typeof OfflinePackDownloadState]; -function getRegionDownloadState(downloadState: OfflinePackDownloadState) { +function getRegionDownloadState(downloadState: CustomOfflinePackDownloadState) { switch (downloadState) { - case MapLibreGL.OfflinePackDownloadState.Active: + case OfflinePackDownloadState.Active: return "Active"; - case MapLibreGL.OfflinePackDownloadState.Complete: + case OfflinePackDownloadState.Complete: return "Complete"; - case MapLibreGL.OfflinePackDownloadState.Inactive: + case OfflinePackDownloadState.Inactive: return "Inactive"; default: return "UNKNOWN"; @@ -75,7 +79,7 @@ export default function CreateOfflineRegion() { useEffect(() => { return () => { - MapLibreGL.offlineManager.unsubscribe(PACK_NAME); + offlineManager.unsubscribe(PACK_NAME); }; }, []); @@ -112,16 +116,12 @@ export default function CreateOfflineRegion() { }; // start download - MapLibreGL.offlineManager.createPack( - options, - onDownloadProgress, - onDownloadError, - ); + offlineManager.createPack(options, onDownloadProgress, onDownloadError); } async function onDidFinishLoadingStyle() { try { - const pack = await MapLibreGL.offlineManager.getPack(PACK_NAME); + const pack = await offlineManager.getPack(PACK_NAME); if (!pack) { return; @@ -157,7 +157,7 @@ export default function CreateOfflineRegion() { return; } - await MapLibreGL.offlineManager.deletePack(PACK_NAME); + await offlineManager.deletePack(PACK_NAME); setOfflinePack(null); setOfflineRegionStatus(null); @@ -179,18 +179,18 @@ export default function CreateOfflineRegion() { return ( <> - - - + {isLoading === false && ( diff --git a/packages/examples/src/examples/Map/PointInMapView.js b/packages/examples/src/examples/Map/PointInMapView.js index 381ff9914..7e4b0c7ed 100755 --- a/packages/examples/src/examples/Map/PointInMapView.js +++ b/packages/examples/src/examples/Map/PointInMapView.js @@ -1,4 +1,4 @@ -import MapLibreGL from "@maplibre/maplibre-react-native"; +import { Camera, MapView } from "@maplibre/maplibre-react-native"; import React from "react"; import { Text } from "react-native"; @@ -38,16 +38,13 @@ class PointInMapView extends React.Component { render() { return ( <> - (this._map = c)} onPress={this.onPress} style={styles.mapView} > - - + + {this.renderPointInView()} diff --git a/packages/examples/src/examples/Map/SetTintColor.tsx b/packages/examples/src/examples/Map/SetTintColor.tsx index 86b2b13e2..073c3b597 100644 --- a/packages/examples/src/examples/Map/SetTintColor.tsx +++ b/packages/examples/src/examples/Map/SetTintColor.tsx @@ -1,4 +1,9 @@ -import MapLibreGL from "@maplibre/maplibre-react-native"; +import { + Camera, + MapView, + UserLocation, + UserTrackingMode, +} from "@maplibre/maplibre-react-native"; import { useState } from "react"; import TabBarView from "../../components/TabBarView"; @@ -19,18 +24,15 @@ export default function SetTintColor() { setTintColor(data); }} > - - + - - + + ); } diff --git a/packages/examples/src/examples/Map/ShowAndHideLayer.js b/packages/examples/src/examples/Map/ShowAndHideLayer.js index f3f3e5933..7ce8dde22 100644 --- a/packages/examples/src/examples/Map/ShowAndHideLayer.js +++ b/packages/examples/src/examples/Map/ShowAndHideLayer.js @@ -1,4 +1,4 @@ -import MapLibreGL from "@maplibre/maplibre-react-native"; +import { Camera, FillLayer, MapView } from "@maplibre/maplibre-react-native"; import React from "react"; import { Text } from "react-native"; @@ -28,14 +28,14 @@ class ShowAndHideLayer extends React.Component { const visibility = this.state.show ? "visible" : "none"; return ( <> - (this._map = c)} onPress={this.onPress} style={styles.mapView} > - - - + + + {this.state.show ? "Hide Country Labels" : "Show Country Labels"} diff --git a/packages/examples/src/examples/Map/ShowClick.js b/packages/examples/src/examples/Map/ShowClick.js index 52e56d8a9..f69d7d38f 100755 --- a/packages/examples/src/examples/Map/ShowClick.js +++ b/packages/examples/src/examples/Map/ShowClick.js @@ -1,4 +1,4 @@ -import MapLibreGL from "@maplibre/maplibre-react-native"; +import { MapView } from "@maplibre/maplibre-react-native"; import React from "react"; import { Text } from "react-native"; @@ -59,7 +59,7 @@ class ShowClick extends React.Component { render() { return ( <> - + {this.renderLastClicked()} ); diff --git a/packages/examples/src/examples/Map/ShowMap.tsx b/packages/examples/src/examples/Map/ShowMap.tsx index b6b9d4ff6..9338f5dae 100755 --- a/packages/examples/src/examples/Map/ShowMap.tsx +++ b/packages/examples/src/examples/Map/ShowMap.tsx @@ -1,7 +1,7 @@ -import MapLibreGL from "@maplibre/maplibre-react-native"; +import { MapView } from "@maplibre/maplibre-react-native"; import { sheet } from "../../styles/sheet"; export default function ShowMap() { - return ; + return ; } diff --git a/packages/examples/src/examples/Map/ShowRegionDidChange.js b/packages/examples/src/examples/Map/ShowRegionDidChange.js index c268286b5..79916fb4a 100644 --- a/packages/examples/src/examples/Map/ShowRegionDidChange.js +++ b/packages/examples/src/examples/Map/ShowRegionDidChange.js @@ -1,4 +1,4 @@ -import MapLibreGL from "@maplibre/maplibre-react-native"; +import { Camera, MapView } from "@maplibre/maplibre-react-native"; import React from "react"; import { Text } from "react-native"; @@ -128,15 +128,15 @@ class ShowRegionDidChange extends React.Component { options={this._tabOptions} onOptionPress={this.onOptionPress} > - (this.map = c)} style={sheet.matchParent} onRegionWillChange={this.onRegionWillChange} onRegionIsChanging={this.onRegionIsChanging} onRegionDidChange={this.onRegionDidChange} > - - + + {this.renderRegionChange()} ); diff --git a/packages/examples/src/examples/Map/SourceLayerVisibility.tsx b/packages/examples/src/examples/Map/SourceLayerVisibility.tsx index 30b78d471..8bce3fbc9 100755 --- a/packages/examples/src/examples/Map/SourceLayerVisibility.tsx +++ b/packages/examples/src/examples/Map/SourceLayerVisibility.tsx @@ -1,4 +1,4 @@ -import MapLibreGL, { type MapViewRef } from "@maplibre/maplibre-react-native"; +import { MapView, type MapViewRef } from "@maplibre/maplibre-react-native"; import { useRef, useState } from "react"; import { Text } from "react-native"; @@ -11,7 +11,7 @@ export default function SourceLayerVisibility() { return ( <> - + { mapViewRef.current?.setSourceVisibility( diff --git a/packages/examples/src/examples/Map/TwoMapViews.tsx b/packages/examples/src/examples/Map/TwoMapViews.tsx index a319e5894..807a9189a 100755 --- a/packages/examples/src/examples/Map/TwoMapViews.tsx +++ b/packages/examples/src/examples/Map/TwoMapViews.tsx @@ -1,4 +1,8 @@ -import MapLibreGL from "@maplibre/maplibre-react-native"; +import { + FillLayer, + MapView, + ShapeSource, +} from "@maplibre/maplibre-react-native"; import type { FeatureCollection } from "geojson"; import smileyFeatureCollection from "../../assets/geojson/smiley.json"; @@ -23,14 +27,14 @@ export default function TwoMapViews() { {[layerStyles.smileyFaceDark, layerStyles.smileyFaceLight].map( (style) => { return ( - - + - - - + + + ); }, )} diff --git a/packages/examples/src/examples/SymbolCircleLayer/CustomIcon.js b/packages/examples/src/examples/SymbolCircleLayer/CustomIcon.js index 8bcf40ebf..cf3fce73c 100755 --- a/packages/examples/src/examples/SymbolCircleLayer/CustomIcon.js +++ b/packages/examples/src/examples/SymbolCircleLayer/CustomIcon.js @@ -1,4 +1,8 @@ -import MapLibreGL from "@maplibre/maplibre-react-native"; +import { + MapView, + ShapeSource, + SymbolLayer, +} from "@maplibre/maplibre-react-native"; import { feature, featureCollection } from "@turf/helpers"; import React from "react"; import { Text } from "react-native"; @@ -50,23 +54,20 @@ class CustomIcon extends React.Component { render() { return ( <> - (this._map = c)} onPress={this.onPress} style={sheet.matchParent} > - - - - + + + Tap to add an icon diff --git a/packages/examples/src/examples/SymbolCircleLayer/DataDrivenCircleColors.js b/packages/examples/src/examples/SymbolCircleLayer/DataDrivenCircleColors.js index b8ed769d3..aea934103 100755 --- a/packages/examples/src/examples/SymbolCircleLayer/DataDrivenCircleColors.js +++ b/packages/examples/src/examples/SymbolCircleLayer/DataDrivenCircleColors.js @@ -1,4 +1,10 @@ -import MapLibreGL from "@maplibre/maplibre-react-native"; +import { + CircleLayer, + Camera, + MapView, + StyleURL, + VectorSource, +} from "@maplibre/maplibre-react-native"; import React from "react"; import { sheet } from "../../styles/sheet"; @@ -33,24 +39,21 @@ const styles = { function DataDrivenCircleColors() { return ( - - + - - + - - + + ); } diff --git a/packages/examples/src/examples/SymbolCircleLayer/Earthquakes.tsx b/packages/examples/src/examples/SymbolCircleLayer/Earthquakes.tsx index aa1da9342..31eb47b5e 100755 --- a/packages/examples/src/examples/SymbolCircleLayer/Earthquakes.tsx +++ b/packages/examples/src/examples/SymbolCircleLayer/Earthquakes.tsx @@ -1,6 +1,10 @@ -import MapLibreGL, { +import { + CircleLayer, type CircleLayerStyle, + MapView, + ShapeSource, type ShapeSourceRef, + SymbolLayer, type SymbolLayerStyle, } from "@maplibre/maplibre-react-native"; import moment from "moment"; @@ -180,8 +184,8 @@ export default function Earthquakes() { <> - - + - - - - - + + ); diff --git a/packages/examples/src/examples/SymbolCircleLayer/ShapeSourceIcon.tsx b/packages/examples/src/examples/SymbolCircleLayer/ShapeSourceIcon.tsx index f942d3481..e8cc8e0e0 100755 --- a/packages/examples/src/examples/SymbolCircleLayer/ShapeSourceIcon.tsx +++ b/packages/examples/src/examples/SymbolCircleLayer/ShapeSourceIcon.tsx @@ -1,4 +1,9 @@ -import MapLibreGL from "@maplibre/maplibre-react-native"; +import { + Images, + MapView, + ShapeSource, + SymbolLayer, +} from "@maplibre/maplibre-react-native"; import { useState } from "react"; import maplibreIcon from "../../assets/images/maplibre.png"; @@ -11,8 +16,8 @@ export default function ShapeSourceIcon() { }); return ( - - + setImages((prevState) => ({ @@ -21,14 +26,14 @@ export default function ShapeSourceIcon() { })) } /> - - + - - + + ); } diff --git a/packages/examples/src/examples/UserLocation/FollowUserLocationAlignment.tsx b/packages/examples/src/examples/UserLocation/FollowUserLocationAlignment.tsx index 6faab15eb..50118199e 100755 --- a/packages/examples/src/examples/UserLocation/FollowUserLocationAlignment.tsx +++ b/packages/examples/src/examples/UserLocation/FollowUserLocationAlignment.tsx @@ -1,4 +1,4 @@ -import MapLibreGL from "@maplibre/maplibre-react-native"; +import { Camera, MapView, UserLocation } from "@maplibre/maplibre-react-native"; import { useState } from "react"; import TabBarView from "../../components/TabBarView"; @@ -29,13 +29,10 @@ export default function FollowUserLocationAlignment() { setAlignment(data); }} > - - - - + + + + ); } diff --git a/packages/examples/src/examples/UserLocation/FollowUserLocationRenderMode.tsx b/packages/examples/src/examples/UserLocation/FollowUserLocationRenderMode.tsx index 8d95c7d76..b1de270c6 100755 --- a/packages/examples/src/examples/UserLocation/FollowUserLocationRenderMode.tsx +++ b/packages/examples/src/examples/UserLocation/FollowUserLocationRenderMode.tsx @@ -1,4 +1,8 @@ -import MapLibreGL, { +import { + Camera, + CircleLayer, + MapView, + UserLocation, UserLocationRenderMode, UserTrackingMode, } from "@maplibre/maplibre-react-native"; @@ -96,11 +100,11 @@ export default function FollowUserLocationRenderMode() { )} - - - {renderMode === ExampleRenderMode.CustomChildren ? [ - , - , ] : undefined} - - + + { - MapLibreGL.locationManager.start(); + locationManager.start(); return () => { - MapLibreGL.locationManager.stop(); + locationManager.stop(); }; }, []); @@ -25,15 +30,15 @@ export default function SetAndroidPreferredFramesPerSecond() { setAndroidPreferredFramesPerSecond(data); }} > - - + + - - + ); } diff --git a/packages/examples/src/examples/UserLocation/UserLocationDisplacement.tsx b/packages/examples/src/examples/UserLocation/UserLocationDisplacement.tsx index 3f4d9f504..b0ea33853 100644 --- a/packages/examples/src/examples/UserLocation/UserLocationDisplacement.tsx +++ b/packages/examples/src/examples/UserLocation/UserLocationDisplacement.tsx @@ -1,4 +1,10 @@ -import MapLibreGL from "@maplibre/maplibre-react-native"; +import { + Camera, + locationManager, + MapView, + UserLocation, + UserTrackingMode, +} from "@maplibre/maplibre-react-native"; import { useEffect, useState } from "react"; import TabBarView from "../../components/TabBarView"; @@ -10,10 +16,10 @@ export default function UserLocationDisplacement() { const [minDisplacement, setMinDisplacement] = useState(OPTIONS[0]!.data); useEffect(() => { - MapLibreGL.locationManager.start(); + locationManager.start(); return () => { - MapLibreGL.locationManager.stop(); + locationManager.stop(); }; }, []); @@ -24,15 +30,15 @@ export default function UserLocationDisplacement() { setMinDisplacement(data); }} > - - + - - + + ); } diff --git a/packages/examples/src/examples/UserLocation/UserLocationUpdate.tsx b/packages/examples/src/examples/UserLocation/UserLocationUpdate.tsx index f9fe33b24..388c18bca 100755 --- a/packages/examples/src/examples/UserLocation/UserLocationUpdate.tsx +++ b/packages/examples/src/examples/UserLocation/UserLocationUpdate.tsx @@ -1,4 +1,9 @@ -import MapLibreGL from "@maplibre/maplibre-react-native"; +import { + Camera, + type Location, + MapView, + UserLocation, +} from "@maplibre/maplibre-react-native"; import { useState } from "react"; import { Text } from "react-native"; @@ -6,16 +11,14 @@ import Bubble from "../../components/Bubble"; import { sheet } from "../../styles/sheet"; export default function UserLocationUpdate() { - const [location, setLocation] = useState(); + const [location, setLocation] = useState(); return ( <> - - setLocation(newLocation)} - /> - - + + setLocation(newLocation)} /> + + {location && ( diff --git a/scripts/templates/component.md.ejs b/scripts/templates/component.md.ejs index c3e6599cf..b2032f9dc 100644 --- a/scripts/templates/component.md.ejs +++ b/scripts/templates/component.md.ejs @@ -4,7 +4,7 @@ -%> -# ` />` +# `<<%- component.name %> />` <%- helpers.replaceNewLine(component.description) %> <%_ if (component.props && component.props.length) { _%> diff --git a/src/components/BackgroundLayer.tsx b/src/components/BackgroundLayer.tsx index fc54d7570..595c057ec 100644 --- a/src/components/BackgroundLayer.tsx +++ b/src/components/BackgroundLayer.tsx @@ -8,7 +8,7 @@ import useAbstractLayer, { import { type BaseProps } from "../types/BaseProps"; import { type BackgroundLayerStyle } from "../types/MapLibreRNStyles"; -const MapLibreRN = NativeModules.MLRNModule; +const MLRNModule = NativeModules.MLRNModule; export const NATIVE_MODULE_NAME = "MLRNBackgroundLayer"; @@ -27,7 +27,7 @@ const MLRNBackgroundLayer = requireNativeComponent(NATIVE_MODULE_NAME); const BackgroundLayer: React.FC = ({ - sourceID = MapLibreRN.StyleSource.DefaultSourceID, + sourceID = MLRNModule.StyleSource.DefaultSourceID, ...props }: BackgroundLayerProps) => { const { baseProps, setNativeLayer } = useAbstractLayer< diff --git a/src/components/Camera.tsx b/src/components/Camera.tsx index 946c36a67..c14c49c12 100644 --- a/src/components/Camera.tsx +++ b/src/components/Camera.tsx @@ -211,7 +211,7 @@ export interface CameraProps extends BaseProps, CameraStop { followUserLocation?: boolean; /** - * The mode used to track the user location on the map. One of; "normal", "compass", "course". Each mode string is also available as a member on the `MapLibreGL.UserTrackingMode` object. `Follow` (normal), `FollowWithHeading` (compass), `FollowWithCourse` (course). NOTE: `followUserLocation` must be set to `true` for any of the modes to take effect. [Example](/packages/examples/src/examples/Camera/SetUserTrackingMode.js) + * The mode used to track the user location on the map. One of; "normal", "compass", "course". Each mode string is also available as a member on the `UserTrackingMode` object. `Follow` (normal), `FollowWithHeading` (compass), `FollowWithCourse` (course). NOTE: `followUserLocation` must be set to `true` for any of the modes to take effect. [Example](/packages/examples/src/examples/Camera/SetUserTrackingMode.js) */ followUserMode?: UserTrackingMode; diff --git a/src/components/CircleLayer.tsx b/src/components/CircleLayer.tsx index 50b4253a2..163c48e06 100644 --- a/src/components/CircleLayer.tsx +++ b/src/components/CircleLayer.tsx @@ -8,7 +8,7 @@ import useAbstractLayer, { import { type BaseProps } from "../types/BaseProps"; import { type CircleLayerStyle } from "../types/MapLibreRNStyles"; -const MapLibreRN = NativeModules.MLRNModule; +const MLRNModule = NativeModules.MLRNModule; export const NATIVE_MODULE_NAME = "MLRNCircleLayer"; @@ -29,7 +29,7 @@ const MLRNCircleLayer = requireNativeComponent(NATIVE_MODULE_NAME); * CircleLayer is a style layer that renders one or more filled circles on the map. */ const CircleLayer: React.FC = ({ - sourceID = MapLibreRN.StyleSource.DefaultSourceID, + sourceID = MLRNModule.StyleSource.DefaultSourceID, ...props }: CircleLayerProps) => { const { baseProps, setNativeLayer } = useAbstractLayer< diff --git a/src/components/FillExtrusionLayer.tsx b/src/components/FillExtrusionLayer.tsx index 6ed0bc6a7..c6b7d219f 100644 --- a/src/components/FillExtrusionLayer.tsx +++ b/src/components/FillExtrusionLayer.tsx @@ -8,7 +8,7 @@ import useAbstractLayer, { import { type BaseProps } from "../types/BaseProps"; import { type FillExtrusionLayerStyle } from "../types/MapLibreRNStyles"; -const MapLibreRN = NativeModules.MLRNModule; +const MLRNModule = NativeModules.MLRNModule; export const NATIVE_MODULE_NAME = "MLRNFillExtrusionLayer"; @@ -30,7 +30,7 @@ const MLRNFillExtrusionLayer = * FillExtrusionLayer is a style layer that renders one or more 3D extruded polygons on the map. */ const FillExtrusionLayer: React.FC = ({ - sourceID = MapLibreRN.StyleSource.DefaultSourceID, + sourceID = MLRNModule.StyleSource.DefaultSourceID, ...props }: FillExtrusionLayerProps) => { const { baseProps, setNativeLayer } = useAbstractLayer< diff --git a/src/components/FillLayer.tsx b/src/components/FillLayer.tsx index aa5dd181f..0d08a8633 100644 --- a/src/components/FillLayer.tsx +++ b/src/components/FillLayer.tsx @@ -8,7 +8,7 @@ import useAbstractLayer, { import { type BaseProps } from "../types/BaseProps"; import { type FillLayerStyle } from "../types/MapLibreRNStyles"; -const MapLibreRN = NativeModules.MLRNModule; +const MLRNModule = NativeModules.MLRNModule; export const NATIVE_MODULE_NAME = "MLRNFillLayer"; @@ -27,7 +27,7 @@ const MLRNFillLayer = requireNativeComponent(NATIVE_MODULE_NAME); * FillLayer is a style layer that renders one or more filled (and optionally stroked) polygons on the map. */ const FillLayer: React.FC = ({ - sourceID = MapLibreRN.StyleSource.DefaultSourceID, + sourceID = MLRNModule.StyleSource.DefaultSourceID, ...props }: FillLayerProps) => { const { baseProps, setNativeLayer } = useAbstractLayer< diff --git a/src/components/HeatmapLayer.tsx b/src/components/HeatmapLayer.tsx index f4bd84bf3..0a775479b 100644 --- a/src/components/HeatmapLayer.tsx +++ b/src/components/HeatmapLayer.tsx @@ -8,7 +8,7 @@ import useAbstractLayer, { import { type BaseProps } from "../types/BaseProps"; import { type HeatmapLayerStyle } from "../types/MapLibreRNStyles"; -const MapLibreRN = NativeModules.MLRNModule; +const MLRNModule = NativeModules.MLRNModule; export const NATIVE_MODULE_NAME = "MLRNHeatmapLayer"; @@ -29,7 +29,7 @@ const MLRNHeatmapLayer = * HeatmapLayer is a style layer that renders one or more filled circles on the map. */ const HeatmapLayer: React.FC = ({ - sourceID = MapLibreRN.StyleSource.DefaultSourceID, + sourceID = MLRNModule.StyleSource.DefaultSourceID, ...props }: HeatmapLayerProps) => { const { baseProps, setNativeLayer } = useAbstractLayer< diff --git a/src/components/LineLayer.tsx b/src/components/LineLayer.tsx index 1b8daa71b..95cca282d 100644 --- a/src/components/LineLayer.tsx +++ b/src/components/LineLayer.tsx @@ -8,7 +8,7 @@ import useAbstractLayer, { import { type BaseProps } from "../types/BaseProps"; import { type LineLayerStyle } from "../types/MapLibreRNStyles"; -const MapLibreRN = NativeModules.MLRNModule; +const MLRNModule = NativeModules.MLRNModule; export const NATIVE_MODULE_NAME = "MLRNLineLayer"; @@ -28,7 +28,7 @@ const MLRNLineLayer = * LineLayer is a style layer that renders one or more stroked polylines on the map. */ const LineLayer: React.FC = ({ - sourceID = MapLibreRN.StyleSource.DefaultSourceID, + sourceID = MLRNModule.StyleSource.DefaultSourceID, ...props }: LineLayerProps) => { const { baseProps, setNativeLayer } = useAbstractLayer< diff --git a/src/components/MapView.tsx b/src/components/MapView.tsx index ece9160a6..4d7eab6f1 100644 --- a/src/components/MapView.tsx +++ b/src/components/MapView.tsx @@ -31,8 +31,8 @@ import { isFunction, isAndroid } from "../utils"; import Logger from "../utils/Logger"; import { getFilter } from "../utils/filterUtils"; -const MapLibreRN = NativeModules.MLRNModule; -if (MapLibreRN == null) { +const MLRNModule = NativeModules.MLRNModule; +if (MLRNModule == null) { console.error( "Native module of @maplibre/maplibre-react-native library was not registered properly, please consult the docs: https://github.com/maplibre/maplibre-react-native", ); @@ -46,7 +46,7 @@ const styles = StyleSheet.create({ matchParent: { flex: 1 }, }); -const defaultStyleURL = MapLibreRN.StyleURL.Street; +const defaultStyleURL = MLRNModule.StyleURL.Street; export interface RegionPayload { zoomLevel: number; @@ -69,7 +69,7 @@ interface MapViewProps extends BaseProps { */ style?: ViewProps["style"]; /** - * Style URL for map - notice, if non is set it _will_ default to `MapLibreGL.StyleURL.Default` + * Style URL for map - notice, if non is set it _will_ default to `StyleURL.Default` */ styleURL?: string; /** @@ -438,46 +438,46 @@ const MapView = memo( const events = []; if (props.onRegionWillChange) { - events.push(MapLibreRN.EventTypes.RegionWillChange); + events.push(MLRNModule.EventTypes.RegionWillChange); } if (props.onRegionIsChanging) { - events.push(MapLibreRN.EventTypes.RegionIsChanging); + events.push(MLRNModule.EventTypes.RegionIsChanging); } if (props.onRegionDidChange) { - events.push(MapLibreRN.EventTypes.RegionDidChange); + events.push(MLRNModule.EventTypes.RegionDidChange); } if (props.onUserLocationUpdate) { - events.push(MapLibreRN.EventTypes.UserLocationUpdated); + events.push(MLRNModule.EventTypes.UserLocationUpdated); } if (props.onWillStartLoadingMap) { - events.push(MapLibreRN.EventTypes.WillStartLoadingMap); + events.push(MLRNModule.EventTypes.WillStartLoadingMap); } if (props.onDidFinishLoadingMap) { - events.push(MapLibreRN.EventTypes.DidFinishLoadingMap); + events.push(MLRNModule.EventTypes.DidFinishLoadingMap); } if (props.onDidFailLoadingMap) { - events.push(MapLibreRN.EventTypes.DidFailLoadingMap); + events.push(MLRNModule.EventTypes.DidFailLoadingMap); } if (props.onWillStartRenderingFrame) { - events.push(MapLibreRN.EventTypes.WillStartRenderingFrame); + events.push(MLRNModule.EventTypes.WillStartRenderingFrame); } if (props.onDidFinishRenderingFrame) { - events.push(MapLibreRN.EventTypes.DidFinishRenderingFrame); + events.push(MLRNModule.EventTypes.DidFinishRenderingFrame); } if (props.onDidFinishRenderingFrameFully) { - events.push(MapLibreRN.EventTypes.DidFinishRenderingFrameFully); + events.push(MLRNModule.EventTypes.DidFinishRenderingFrameFully); } if (props.onWillStartRenderingMap) { - events.push(MapLibreRN.EventTypes.WillStartRenderingMap); + events.push(MLRNModule.EventTypes.WillStartRenderingMap); } if (props.onDidFinishRenderingMap) { - events.push(MapLibreRN.EventTypes.DidFinishRenderingMap); + events.push(MLRNModule.EventTypes.DidFinishRenderingMap); } if (props.onDidFinishRenderingMapFully) { - events.push(MapLibreRN.EventTypes.DidFinishRenderingMapFully); + events.push(MLRNModule.EventTypes.DidFinishRenderingMapFully); } if (props.onDidFinishLoadingStyle) { - events.push(MapLibreRN.EventTypes.DidFinishLoadingStyle); + events.push(MLRNModule.EventTypes.DidFinishLoadingStyle); } _runNativeCommand( @@ -661,7 +661,7 @@ const MapView = memo( let propName: CallableProps | undefined; switch (type) { - case MapLibreRN.EventTypes.RegionWillChange: + case MLRNModule.EventTypes.RegionWillChange: if ( regionWillChangeDebounceTime && regionWillChangeDebounceTime > 0 @@ -675,10 +675,10 @@ const MapView = memo( propName = "onRegionWillChange"; } break; - case MapLibreRN.EventTypes.RegionIsChanging: + case MLRNModule.EventTypes.RegionIsChanging: propName = "onRegionIsChanging"; break; - case MapLibreRN.EventTypes.RegionDidChange: + case MLRNModule.EventTypes.RegionDidChange: if ( regionDidChangeDebounceTime && regionDidChangeDebounceTime > 0 @@ -692,37 +692,37 @@ const MapView = memo( propName = "onRegionDidChange"; } break; - case MapLibreRN.EventTypes.UserLocationUpdated: + case MLRNModule.EventTypes.UserLocationUpdated: propName = "onUserLocationUpdate"; break; - case MapLibreRN.EventTypes.WillStartLoadingMap: + case MLRNModule.EventTypes.WillStartLoadingMap: propName = "onWillStartLoadingMap"; break; - case MapLibreRN.EventTypes.DidFinishLoadingMap: + case MLRNModule.EventTypes.DidFinishLoadingMap: propName = "onDidFinishLoadingMap"; break; - case MapLibreRN.EventTypes.DidFailLoadingMap: + case MLRNModule.EventTypes.DidFailLoadingMap: propName = "onDidFailLoadingMap"; break; - case MapLibreRN.EventTypes.WillStartRenderingFrame: + case MLRNModule.EventTypes.WillStartRenderingFrame: propName = "onWillStartRenderingFrame"; break; - case MapLibreRN.EventTypes.DidFinishRenderingFrame: + case MLRNModule.EventTypes.DidFinishRenderingFrame: propName = "onDidFinishRenderingFrame"; break; - case MapLibreRN.EventTypes.DidFinishRenderingFrameFully: + case MLRNModule.EventTypes.DidFinishRenderingFrameFully: propName = "onDidFinishRenderingFrameFully"; break; - case MapLibreRN.EventTypes.WillStartRenderingMap: + case MLRNModule.EventTypes.WillStartRenderingMap: propName = "onWillStartRenderingMap"; break; - case MapLibreRN.EventTypes.DidFinishRenderingMap: + case MLRNModule.EventTypes.DidFinishRenderingMap: propName = "onDidFinishRenderingMap"; break; - case MapLibreRN.EventTypes.DidFinishRenderingMapFully: + case MLRNModule.EventTypes.DidFinishRenderingMapFully: propName = "onDidFinishRenderingMapFully"; break; - case MapLibreRN.EventTypes.DidFinishLoadingStyle: + case MLRNModule.EventTypes.DidFinishLoadingStyle: propName = "onDidFinishLoadingStyle"; break; default: diff --git a/src/components/RasterLayer.tsx b/src/components/RasterLayer.tsx index 2a0516f6b..03d2d98a2 100644 --- a/src/components/RasterLayer.tsx +++ b/src/components/RasterLayer.tsx @@ -8,7 +8,7 @@ import useAbstractLayer, { import { type BaseProps } from "../types/BaseProps"; import { type RasterLayerStyle } from "../types/MapLibreRNStyles"; -const MapLibreRN = NativeModules.MLRNModule; +const MLRNModule = NativeModules.MLRNModule; export const NATIVE_MODULE_NAME = "MLRNRasterLayer"; @@ -26,7 +26,7 @@ interface NativeProps const MLRNRasterLayer = requireNativeComponent(NATIVE_MODULE_NAME); const RasterLayer: React.FC = ({ - sourceID = MapLibreRN.StyleSource.DefaultSourceID, + sourceID = MLRNModule.StyleSource.DefaultSourceID, ...props }: RasterLayerProps) => { const { baseProps, setNativeLayer } = useAbstractLayer< diff --git a/src/components/RasterSource.tsx b/src/components/RasterSource.tsx index c21087f6e..0cc943bfe 100644 --- a/src/components/RasterSource.tsx +++ b/src/components/RasterSource.tsx @@ -6,7 +6,7 @@ import useOnce from "../hooks/useOnce"; import { type BaseProps } from "../types/BaseProps"; import { cloneReactChildrenWithProps } from "../utils"; -const MapLibreRN = NativeModules.MLRNModule; +const MLRNModule = NativeModules.MLRNModule; export const NATIVE_MODULE_NAME = "MLRNRasterSource"; @@ -69,7 +69,7 @@ const MLRNRasterSource = * or by an external file that conforms to the TileJSON specification. */ const RasterSource: React.FC = ({ - id = MapLibreRN.StyleSource.DefaultSourceID, + id = MLRNModule.StyleSource.DefaultSourceID, ...props }: RasterSourceProps) => { useOnce(() => { diff --git a/src/components/ShapeSource.tsx b/src/components/ShapeSource.tsx index 656b1804f..f5ff52fe4 100644 --- a/src/components/ShapeSource.tsx +++ b/src/components/ShapeSource.tsx @@ -28,7 +28,7 @@ import { } from "../utils"; import { getFilter } from "../utils/filterUtils"; -const MapLibreRN = NativeModules.MLRNModule; +const MLRNModule = NativeModules.MLRNModule; export const NATIVE_MODULE_NAME = "MLRNShapeSource"; interface NativeProps { @@ -162,7 +162,7 @@ const ShapeSource = memo( forwardRef( ( { - id: shapeId = MapLibreRN.StyleSource.DefaultSourceID, + id: shapeId = MLRNModule.StyleSource.DefaultSourceID, ...props }: ShapeSourceProps, ref, diff --git a/src/components/SymbolLayer.tsx b/src/components/SymbolLayer.tsx index 18ee78526..bca98d47d 100644 --- a/src/components/SymbolLayer.tsx +++ b/src/components/SymbolLayer.tsx @@ -7,7 +7,7 @@ import useAbstractLayer, { import { type BaseProps } from "../types/BaseProps"; import { type SymbolLayerStyle } from "../types/MapLibreRNStyles"; -const MapLibreRN = NativeModules.MLRNModule; +const MLRNModule = NativeModules.MLRNModule; export const NATIVE_MODULE_NAME = "MLRNSymbolLayer"; @@ -28,7 +28,7 @@ const MLRNSymbolLayer = requireNativeComponent(NATIVE_MODULE_NAME); * SymbolLayer is a style layer that renders icon and text labels at points or along lines on the map. */ const SymbolLayer: React.FC = ({ - sourceID = MapLibreRN.StyleSource.DefaultSourceID, + sourceID = MLRNModule.StyleSource.DefaultSourceID, ...props }: SymbolLayerProps) => { const { baseProps, setNativeLayer } = useAbstractLayer< diff --git a/src/components/VectorSource.tsx b/src/components/VectorSource.tsx index 9c196d890..2b090eece 100644 --- a/src/components/VectorSource.tsx +++ b/src/components/VectorSource.tsx @@ -14,7 +14,7 @@ import { type OnPressEvent } from "../types/OnPressEvent"; import { cloneReactChildrenWithProps, isFunction, isAndroid } from "../utils"; import { getFilter } from "../utils/filterUtils"; -const MapLibreRN = NativeModules.MLRNModule; +const MLRNModule = NativeModules.MLRNModule; export const NATIVE_MODULE_NAME = "MLRNVectorSource"; @@ -93,7 +93,7 @@ const VectorSource = memo( forwardRef( ( { - id = MapLibreRN.StyleSource.DefaultSourceID, + id = MLRNModule.StyleSource.DefaultSourceID, ...props }: VectorSourceProps, ref, diff --git a/src/index.ts b/src/index.ts index 429fc66c7..259858691 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,4 +1 @@ -import * as MapLibreRN from "./MapLibreRN"; export * from "./MapLibreRN"; - -export default MapLibreRN; diff --git a/src/modules/location/locationManager.ts b/src/modules/location/locationManager.ts index 60ec52f9f..6b59ec3ee 100644 --- a/src/modules/location/locationManager.ts +++ b/src/modules/location/locationManager.ts @@ -4,7 +4,7 @@ import { type EmitterSubscription, } from "react-native"; -const MapLibreRN = NativeModules.MLRNModule; +const MLRNModule = NativeModules.MLRNModule; const MLRNLocationModule = NativeModules.MLRNLocationModule; export const LocationModuleEventEmitter = new NativeEventEmitter( @@ -129,7 +129,7 @@ class LocationManager { MLRNLocationModule.start(displacement); this.subscription = LocationModuleEventEmitter.addListener( - MapLibreRN.LocationCallbackName.Update, + MLRNModule.LocationCallbackName.Update, this.onUpdate, ); diff --git a/src/modules/offline/offlineManager.ts b/src/modules/offline/offlineManager.ts index ad3723a92..227720faf 100644 --- a/src/modules/offline/offlineManager.ts +++ b/src/modules/offline/offlineManager.ts @@ -10,7 +10,7 @@ import OfflineCreatePackOptions, { import OfflinePack, { type OfflinePackStatus } from "./OfflinePack"; import { isUndefined, isFunction, isAndroid } from "../../utils"; -const MapLibreRN = NativeModules.MLRNModule; +const MLRNModule = NativeModules.MLRNModule; const MLRNOfflineModule = NativeModules.MLRNOfflineModule; export const OfflineModuleEventEmitter = new NativeEventEmitter( MLRNOfflineModule, @@ -67,7 +67,7 @@ class OfflineManager { * const progressListener = (offlineRegion, status) => console.log(offlineRegion, status); * const errorListener = (offlineRegion, err) => console.log(offlineRegion, err); * - * await MapLibreGL.offlineManager.createPack({ + * await offlineManager.createPack({ * name: 'offlinePack', * styleURL: 'https://demotiles.maplibre.org/tiles/tiles.json', * minZoom: 14, @@ -106,7 +106,7 @@ class OfflineManager { * This is more efficient than deleting the offline pack and downloading it again. If the data stored locally matches that on the server, new data will not be downloaded. * * @example - * await MapLibreGL.offlineManager.invalidatePack('packName') + * await offlineManager.invalidatePack('packName') * * @param {String} name Name of the offline pack. * @return {void} @@ -128,7 +128,7 @@ class OfflineManager { * Unregisters the given offline pack and allows resources that are no longer required by any remaining packs to be potentially freed. * * @example - * await MapLibreGL.offlineManager.deletePack('packName') + * await offlineManager.deletePack('packName') * * @param {String} name Name of the offline pack. * @return {void} @@ -154,7 +154,7 @@ class OfflineManager { * It does not erase resources from the ambient cache or delete the database, which can be computationally expensive operations that may carry unintended side effects. * * @example - * await MapLibreGL.offlineManager.invalidateAmbientCache(); + * await offlineManager.invalidateAmbientCache(); * * @return {void} */ @@ -168,7 +168,7 @@ class OfflineManager { * This method clears the cache and decreases the amount of space that map resources take up on the device. * * @example - * await MapLibreGL.offlineManager.clearAmbientCache(); + * await offlineManager.clearAmbientCache(); * * @return {void} */ @@ -182,7 +182,7 @@ class OfflineManager { * This method may be computationally expensive because it will erase resources from the ambient cache if its size is decreased. * * @example - * await MapLibreGL.offlineManager.setMaximumAmbientCacheSize(5000000); + * await offlineManager.setMaximumAmbientCacheSize(5000000); * * @param {Number} size Size of ambient cache. * @return {void} @@ -196,7 +196,7 @@ class OfflineManager { * Deletes the existing database, which includes both the ambient cache and offline packs, then reinitializes it. * * @example - * await MapLibreGL.offlineManager.resetDatabase(); + * await offlineManager.resetDatabase(); * * @return {void} */ @@ -209,7 +209,7 @@ class OfflineManager { * Retrieves all the current offline packs that are stored in the database. * * @example - * const offlinePacks = await MapLibreGL.offlineManager.getPacks(); + * const offlinePacks = await offlineManager.getPacks(); * * @return {Array} */ @@ -225,7 +225,7 @@ class OfflineManager { * Retrieves an offline pack that is stored in the database by name. * * @example - * const offlinePack = await MapLibreGL.offlineManager.getPack(); + * const offlinePack = await offlineManager.getPack(); * * @param {String} name Name of the offline pack. * @return {OfflinePack} @@ -239,7 +239,7 @@ class OfflineManager { * Sideloads offline db * * @example - * await MapLibreGL.offlineManager.mergeOfflineRegions(path); + * await offlineManager.mergeOfflineRegions(path); * * @param {String} path Path to offline tile db on file system. * @return {void} @@ -254,7 +254,7 @@ class OfflineManager { * Consult the Terms of Service for your map tile host before changing this value. * * @example - * MapLibreGL.offlineManager.setTileCountLimit(1000); + * offlineManager.setTileCountLimit(1000); * * @param {Number} limit Map tile limit count. * @return {void} @@ -268,7 +268,7 @@ class OfflineManager { * The default is 500ms. * * @example - * MapLibreGL.offlineManager.setProgressEventThrottle(500); + * offlineManager.setProgressEventThrottle(500); * * @param {Number} throttleValue event throttle value in ms. * @return {void} @@ -284,7 +284,7 @@ class OfflineManager { * @example * const progressListener = (offlinePack, status) => console.log(offlinePack, status) * const errorListener = (offlinePack, err) => console.log(offlinePack, err) - * MapLibreGL.offlineManager.subscribe('packName', progressListener, errorListener) + * offlineManager.subscribe('packName', progressListener, errorListener) * * @param {string} packName Name of the offline pack. * @param {ProgressListener} progressListener Callback that listens for status events while downloading the offline resource. @@ -300,7 +300,7 @@ class OfflineManager { if (isFunction(progressListener)) { if (totalProgressListeners === 0) { this.subscriptionProgress = OfflineModuleEventEmitter.addListener( - MapLibreRN.OfflineCallbackName.Progress, + MLRNModule.OfflineCallbackName.Progress, this._onProgress, ); } @@ -311,7 +311,7 @@ class OfflineManager { if (isFunction(errorListener)) { if (totalErrorListeners === 0) { this.subscriptionError = OfflineModuleEventEmitter.addListener( - MapLibreRN.OfflineCallbackName.Error, + MLRNModule.OfflineCallbackName.Error, this._onError, ); } @@ -335,7 +335,7 @@ class OfflineManager { * It's a good idea to call this on componentWillUnmount. * * @example - * MapLibreGL.offlineManager.unsubscribe('packName') + * offlineManager.unsubscribe('packName') * * @param {String} packName Name of the offline pack. * @return {void} @@ -390,7 +390,7 @@ class OfflineManager { } // cleanup listeners now that they are no longer needed - if (state === MapLibreRN.OfflinePackDownloadState.Complete) { + if (state === MLRNModule.OfflinePackDownloadState.Complete) { this.unsubscribe(name); } } diff --git a/src/modules/snapshot/SnapshotOptions.ts b/src/modules/snapshot/SnapshotOptions.ts index c1f76c824..a464c1e69 100644 --- a/src/modules/snapshot/SnapshotOptions.ts +++ b/src/modules/snapshot/SnapshotOptions.ts @@ -3,7 +3,7 @@ import { NativeModules } from "react-native"; import { toJSONString } from "../../utils"; -const MapLibreRN = NativeModules.MLRNModule; +const MLRNModule = NativeModules.MLRNModule; export interface SnapshotInputOptions { centerCoordinate?: GeoJSON.Position; @@ -50,7 +50,7 @@ export class SnapshotOptions { ); } - this.styleURL = options.styleURL || MapLibreRN.StyleURL.Default; + this.styleURL = options.styleURL || MLRNModule.StyleURL.Default; this.heading = options.heading || 0.0; this.pitch = options.pitch || 0.0; this.zoomLevel = options.zoomLevel || 16.0; diff --git a/src/modules/snapshot/snapshotManager.ts b/src/modules/snapshot/snapshotManager.ts index d005ff7cb..58ecda39b 100644 --- a/src/modules/snapshot/snapshotManager.ts +++ b/src/modules/snapshot/snapshotManager.ts @@ -16,35 +16,35 @@ class SnapshotManager { * @example * * // creates a temp file png of base map - * const uri = await MapLibreGL.snapshotManager.takeSnap({ + * const uri = await snapshotManager.takeSnap({ * centerCoordinate: [-74.126410, 40.797968], * width: width, * height: height, * zoomLevel: 12, * pitch: 30, * heading: 20, - * styleURL: MapLibreGL.StyleURL.Default, + * styleURL: StyleURL.Default, * writeToDisk: true, // Create a temporary file * }); * * // creates base64 png of base map without logo - * const uri = await MapLibreGL.snapshotManager.takeSnap({ + * const uri = await snapshotManager.takeSnap({ * centerCoordinate: [-74.126410, 40.797968], * width: width, * height: height, * zoomLevel: 12, * pitch: 30, * heading: 20, - * styleURL: MapLibreGL.StyleURL.Default, + * styleURL: StyleURL.Default, * withLogo: false, // Disable Mapbox logo (Android only) * }); * * // creates snapshot with bounds - * const uri = await MapLibreGL.snapshotManager.takeSnap({ + * const uri = await snapshotManager.takeSnap({ * bounds: [[-74.126410, 40.797968], [-74.143727, 40.772177]], * width: width, * height: height, - * styleURL: MapLibreGL.StyleURL.Default, + * styleURL: StyleURL.Default, * }); * * @param {SnapshotOptions} options Snapshot options for create a static image of the base map From 49cc762d4ace5264df76dae591382a3f62c99133 Mon Sep 17 00:00:00 2001 From: Kilian Finger Date: Thu, 19 Dec 2024 19:43:15 +0100 Subject: [PATCH 14/19] fix: StyleURL.Default of type string --- src/MLRNModule.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/MLRNModule.ts b/src/MLRNModule.ts index b3aa1d283..473cfe1ae 100644 --- a/src/MLRNModule.ts +++ b/src/MLRNModule.ts @@ -22,7 +22,7 @@ interface IMLRNModule { }; StyleURL: { - Default: URL; + Default: string; }; setAccessToken(accessToken: string | null): Promise; From d495a4f38279bf06f90fe58251d702384022735f Mon Sep 17 00:00:00 2001 From: Kilian Finger Date: Fri, 20 Dec 2024 01:08:03 +0100 Subject: [PATCH 15/19] feat: remove default exports --- README.md | 4 +- __tests__/components/BackgroundLayer.test.js | 2 +- __tests__/components/Callout.test.js | 2 +- __tests__/components/Camera.test.tsx | 9 +- __tests__/components/CircleLayer.test.js | 2 +- __tests__/components/HeatmapLayer.test.js | 2 +- __tests__/components/Light.test.js | 2 +- __tests__/components/MapView.test.js | 2 +- __tests__/components/SymbolLayer.test.js | 3 +- __tests__/components/UserLocation.test.js | 48 +++---- __tests__/exports.ts | 6 +- ...anager.test.js => LocationManager.test.js} | 128 +++++++++--------- .../offline/OfflineCreatePackOptions.test.js | 2 +- ...Manager.test.js => OfflineManager.test.js} | 88 ++++++------ __tests__/modules/offline/OfflinePack.test.js | 2 +- ...anager.test.js => SnapshotManager.test.js} | 6 +- .../modules/snapshot/SnapshotOptions.test.js | 2 +- __tests__/utils/BridgeValue.test.js | 2 +- .../animated/AnimatedCoordinatesArray.test.js | 6 +- __tests__/utils/filterUtils.test.js | 2 +- docs/components/Annotation.md | 2 +- docs/components/ImageSource.md | 2 +- docs/components/Images.md | 2 +- docs/components/MarkerView.md | 2 +- docs/components/PointAnnotation.md | 2 +- docs/components/RasterSource.md | 2 +- docs/components/ShapeSource.md | 2 +- docs/components/UserLocation.md | 6 +- docs/components/VectorSource.md | 2 +- docs/docs.json | 70 +++++----- docs/guides/CustomHTTPHeaders.md | 2 +- docs/guides/setup/GettingStarted.md | 2 +- docs/modules/coordinates.md | 4 +- docs/modules/location.md | 4 +- docs/modules/offlineManager.md | 30 ++-- docs/modules/snapshotManager.md | 10 +- packages/examples/index.js | 4 +- packages/examples/src/App.tsx | 2 +- packages/examples/src/Examples.tsx | 4 +- packages/examples/src/components/Bubble.tsx | 2 +- .../src/components/MapSafeAreaView.tsx | 2 +- .../src/components/PulseCircleLayer.tsx | 5 +- .../examples/src/components/TabBarView.tsx | 5 +- .../Animations/AnimateCircleAlongLine.tsx | 6 +- .../src/examples/Animations/AnimatedLine.js | 8 +- .../examples/Annotations/CustomCallout.tsx | 2 +- .../src/examples/Annotations/Heatmap.tsx | 2 +- .../src/examples/Annotations/MarkerView.tsx | 2 +- .../Annotations/PointAnnotationAnchors.js | 6 +- .../Annotations/ShowPointAnnotation.tsx | 8 +- packages/examples/src/examples/BugReport.tsx | 2 +- .../examples/src/examples/CacheManagement.js | 16 +-- .../src/examples/Camera/CompassView.js | 4 +- packages/examples/src/examples/Camera/Fit.js | 6 +- .../examples/src/examples/Camera/FlyTo.js | 8 +- .../examples/src/examples/Camera/GetCenter.js | 8 +- .../examples/src/examples/Camera/GetZoom.tsx | 4 +- .../src/examples/Camera/RestrictMapBounds.tsx | 2 +- .../src/examples/Camera/SetHeading.js | 14 +- .../examples/src/examples/Camera/SetPitch.js | 14 +- .../src/examples/Camera/TakeSnapshot.js | 10 +- .../examples/Camera/TakeSnapshotWithMap.js | 6 +- .../examples/src/examples/Camera/YoYo.tsx | 2 +- .../FillRasterLayer/CustomVectorSource.tsx | 4 +- .../FillRasterLayer/GeoJSONSource.tsx | 2 +- .../examples/FillRasterLayer/ImageOverlay.tsx | 2 +- .../FillRasterLayer/IndoorBuilding.tsx | 4 +- .../OpenStreetMapRasterTiles.tsx | 4 +- .../examples/FillRasterLayer/QueryAtPoint.js | 8 +- .../examples/FillRasterLayer/QueryWithRect.js | 8 +- .../src/examples/LineLayer/GradientLine.js | 6 +- .../src/examples/Map/ChangeLayerColor.js | 8 +- .../src/examples/Map/CreateOfflineRegion.tsx | 14 +- .../src/examples/Map/LocalStyleJSON.tsx | 4 +- .../src/examples/Map/PointInMapView.js | 8 +- .../src/examples/Map/SetTintColor.tsx | 4 +- .../src/examples/Map/ShowAndHideLayer.js | 8 +- .../examples/src/examples/Map/ShowClick.js | 8 +- .../examples/src/examples/Map/ShowMap.tsx | 2 +- .../src/examples/Map/ShowRegionDidChange.js | 10 +- .../examples/Map/SourceLayerVisibility.tsx | 4 +- .../examples/src/examples/Map/TwoMapViews.tsx | 2 +- .../examples/SymbolCircleLayer/CustomIcon.js | 8 +- .../DataDrivenCircleColors.js | 5 +- .../SymbolCircleLayer/Earthquakes.tsx | 2 +- .../SymbolCircleLayer/ShapeSourceIcon.tsx | 2 +- .../FollowUserLocationAlignment.tsx | 4 +- .../FollowUserLocationRenderMode.tsx | 4 +- .../SetAndroidPreferredFramesPerSecond.tsx | 10 +- .../UserLocation/UserLocationDisplacement.tsx | 10 +- .../UserLocation/UserLocationUpdate.tsx | 4 +- packages/examples/src/examples/index.ts | 96 ++++++------- packages/examples/src/utils/RouteSimulator.ts | 4 +- src/MapLibreRN.ts | 69 ---------- src/components/Annotation.tsx | 20 ++- src/components/BackgroundLayer.tsx | 8 +- src/components/Callout.tsx | 18 ++- src/components/Camera.tsx | 4 +- src/components/CircleLayer.tsx | 8 +- src/components/FillExtrusionLayer.tsx | 8 +- src/components/FillLayer.tsx | 8 +- src/components/HeadingIndicator.tsx | 8 +- src/components/HeatmapLayer.tsx | 8 +- src/components/ImageSource.tsx | 10 +- src/components/Images.tsx | 14 +- src/components/Light.tsx | 8 +- src/components/LineLayer.tsx | 8 +- src/components/MapView.tsx | 11 +- src/components/MarkerView.tsx | 10 +- src/components/NativeUserLocation.tsx | 5 +- src/components/PointAnnotation.tsx | 13 +- src/components/RasterLayer.tsx | 8 +- src/components/RasterSource.tsx | 12 +- src/components/ShapeSource.tsx | 10 +- src/components/SymbolLayer.tsx | 7 +- src/components/UserLocation.tsx | 37 +++-- src/components/VectorSource.tsx | 12 +- src/hooks/useAbstractLayer.ts | 10 +- src/hooks/useAbstractSource.ts | 12 +- src/hooks/useNativeBridge.ts | 15 +- src/hooks/useNativeRef.ts | 4 +- src/hooks/useOnce.ts | 6 +- src/index.ts | 70 +++++++++- ...{locationManager.ts => LocationManager.ts} | 9 +- .../offline/OfflineCreatePackOptions.ts | 4 +- .../{offlineManager.ts => OfflineManager.ts} | 35 ++--- src/modules/offline/OfflinePack.ts | 6 +- ...{snapshotManager.ts => SnapshotManager.ts} | 12 +- src/modules/snapshot/SnapshotOptions.ts | 2 - src/utils/BridgeValue.ts | 2 +- src/utils/Logger.ts | 4 +- src/utils/StyleValue.ts | 3 +- .../animated/AbstractAnimatedCoordinates.ts | 6 +- src/utils/animated/Animated.ts | 44 +++--- .../animated/AnimatedCoordinatesArray.ts | 7 +- .../AnimatedExtractCoordinateFromArray.ts | 2 +- src/utils/animated/AnimatedPoint.ts | 2 - .../animated/AnimatedRouteCoordinatesArray.ts | 5 +- src/utils/animated/AnimatedShape.ts | 10 +- 139 files changed, 691 insertions(+), 780 deletions(-) rename __tests__/modules/location/{locationManager.test.js => LocationManager.test.js} (60%) rename __tests__/modules/offline/{offlineManager.test.js => OfflineManager.test.js} (66%) rename __tests__/modules/snapshot/{snapshotManager.test.js => SnapshotManager.test.js} (50%) delete mode 100644 src/MapLibreRN.ts rename src/modules/location/{locationManager.ts => LocationManager.ts} (94%) rename src/modules/offline/{offlineManager.ts => OfflineManager.ts} (93%) rename src/modules/snapshot/{snapshotManager.ts => SnapshotManager.ts} (83%) diff --git a/README.md b/README.md index 436205306..346352b49 100644 --- a/README.md +++ b/README.md @@ -66,8 +66,8 @@ diverged, it has become necessary to separate the projects into specific wrapper ### Modules -- [OfflineManager](/docs/modules/offlineManager.md) -- [SnapshotManager](/docs/modules/snapshotManager.md) +- [OfflineManager](/docs/modules/OfflineManager.md) +- [SnapshotManager](/docs/modules/SnapshotManager.md) ### Misc diff --git a/__tests__/components/BackgroundLayer.test.js b/__tests__/components/BackgroundLayer.test.js index fcaa06619..15a15bf94 100644 --- a/__tests__/components/BackgroundLayer.test.js +++ b/__tests__/components/BackgroundLayer.test.js @@ -1,7 +1,7 @@ import { render } from "@testing-library/react-native"; import React from "react"; -import BackgroundLayer from "../../src/components/BackgroundLayer"; +import { BackgroundLayer } from "../../src"; describe("BackgroundLayer", () => { test("renders correctly with default props", () => { diff --git a/__tests__/components/Callout.test.js b/__tests__/components/Callout.test.js index 9f27809dc..bbefd8bb6 100644 --- a/__tests__/components/Callout.test.js +++ b/__tests__/components/Callout.test.js @@ -2,7 +2,7 @@ import { render } from "@testing-library/react-native"; import React from "react"; import { View } from "react-native"; -import Callout from "../../src/components/Callout"; +import { Callout } from "../../src"; describe("Callout", () => { test("renders with custom title", () => { diff --git a/__tests__/components/Camera.test.tsx b/__tests__/components/Camera.test.tsx index 81df8726d..5537caaab 100644 --- a/__tests__/components/Camera.test.tsx +++ b/__tests__/components/Camera.test.tsx @@ -1,7 +1,8 @@ import { render } from "@testing-library/react-native"; -import React from "react"; +import { createRef } from "react"; -import Camera, { +import { + Camera, type CameraBounds, type CameraProps, type CameraRef, @@ -13,7 +14,7 @@ import Camera, { } from "../../src/components/Camera"; import { type NativeRef } from "../../src/hooks/useNativeRef"; -const mockCameraNativeRef = React.createRef>(); +const mockCameraNativeRef = createRef>(); jest.mock("../../src/hooks/useNativeRef", () => ({ useNativeRef: () => { return mockCameraNativeRef; @@ -21,7 +22,7 @@ jest.mock("../../src/hooks/useNativeRef", () => ({ })); function renderCamera(props: CameraProps = {}) { - const cameraRef = React.createRef(); + const cameraRef = createRef(); const result = render(); diff --git a/__tests__/components/CircleLayer.test.js b/__tests__/components/CircleLayer.test.js index f350ef3c9..aa9105fe9 100644 --- a/__tests__/components/CircleLayer.test.js +++ b/__tests__/components/CircleLayer.test.js @@ -1,7 +1,7 @@ import { render } from "@testing-library/react-native"; import React from "react"; -import CircleLayer from "../../src/components/CircleLayer"; +import { CircleLayer } from "../../src"; describe("CircleLayer", () => { test("renders correctly with default props", () => { diff --git a/__tests__/components/HeatmapLayer.test.js b/__tests__/components/HeatmapLayer.test.js index a30e7ac4d..97965c101 100644 --- a/__tests__/components/HeatmapLayer.test.js +++ b/__tests__/components/HeatmapLayer.test.js @@ -1,7 +1,7 @@ import { render } from "@testing-library/react-native"; import React from "react"; -import HeatmapLayer from "../../src/components/HeatmapLayer"; +import { HeatmapLayer } from "../../src"; describe("HeatmapLayer", () => { test("renders correctly with default props", () => { diff --git a/__tests__/components/Light.test.js b/__tests__/components/Light.test.js index 9111c6e74..53d01dc15 100644 --- a/__tests__/components/Light.test.js +++ b/__tests__/components/Light.test.js @@ -1,7 +1,7 @@ import { render } from "@testing-library/react-native"; import React from "react"; -import Light from "../../src/components/Light"; +import { Light } from "../../src"; describe("Light", () => { test("renders correctly", () => { diff --git a/__tests__/components/MapView.test.js b/__tests__/components/MapView.test.js index 3e9b972dc..b88503682 100644 --- a/__tests__/components/MapView.test.js +++ b/__tests__/components/MapView.test.js @@ -1,7 +1,7 @@ import { render } from "@testing-library/react-native"; import * as React from "react"; -import MapView from "../../src/components/MapView"; +import { MapView } from "../../src"; describe("MapView", () => { test("renders with testID", () => { diff --git a/__tests__/components/SymbolLayer.test.js b/__tests__/components/SymbolLayer.test.js index 56e1c743c..10bc9744e 100644 --- a/__tests__/components/SymbolLayer.test.js +++ b/__tests__/components/SymbolLayer.test.js @@ -1,7 +1,8 @@ import { render } from "@testing-library/react-native"; import React from "react"; -import SymbolLayer, { +import { + SymbolLayer, NATIVE_MODULE_NAME, } from "../../src/components/SymbolLayer"; diff --git a/__tests__/components/UserLocation.test.js b/__tests__/components/UserLocation.test.js index 413f4a1e5..a9c6331f5 100644 --- a/__tests__/components/UserLocation.test.js +++ b/__tests__/components/UserLocation.test.js @@ -1,10 +1,12 @@ import { render, fireEvent, waitFor } from "@testing-library/react-native"; -import React from "react"; +import React, { createRef } from "react"; -import CircleLayer from "../../src/components/CircleLayer"; -import ShapeSource from "../../src/components/ShapeSource"; -import UserLocation from "../../src/components/UserLocation"; -import locationManager from "../../src/modules/location/locationManager"; +import { + CircleLayer, + ShapeSource, + UserLocation, + LocationManager, +} from "../../src"; const position = { coords: { @@ -20,7 +22,7 @@ const position = { }; function renderUserLocation(props = {}) { - const userLocationRef = React.createRef(); + const userLocationRef = createRef(); const { rerender, unmount } = render( , ); @@ -34,14 +36,14 @@ function renderUserLocation(props = {}) { describe("UserLocation", () => { describe("render", () => { - jest.spyOn(locationManager, "start").mockImplementation(jest.fn()); + jest.spyOn(LocationManager, "start").mockImplementation(jest.fn()); jest - .spyOn(locationManager, "getLastKnownLocation") + .spyOn(LocationManager, "getLastKnownLocation") .mockImplementation(() => position); - jest.spyOn(locationManager, "addListener"); + jest.spyOn(LocationManager, "addListener"); - jest.spyOn(locationManager, "removeListener"); + jest.spyOn(LocationManager, "removeListener"); beforeEach(() => { jest.clearAllMocks(); @@ -102,7 +104,7 @@ describe("UserLocation", () => { render(); - locationManager.onUpdate({ + LocationManager.onUpdate({ coords: { accuracy: 9.977999687194824, altitude: 44.64373779296875, @@ -136,21 +138,21 @@ describe("UserLocation", () => { test("correctly unmounts", async () => { const { unmount } = renderUserLocation(); - expect(locationManager.addListener).toHaveBeenCalledTimes(1); - expect(locationManager.removeListener).not.toHaveBeenCalled(); + expect(LocationManager.addListener).toHaveBeenCalledTimes(1); + expect(LocationManager.removeListener).not.toHaveBeenCalled(); unmount(); - expect(locationManager.removeListener).toHaveBeenCalledTimes(1); + expect(LocationManager.removeListener).toHaveBeenCalledTimes(1); }); }); describe("methods", () => { beforeEach(() => { - jest.spyOn(locationManager, "start").mockImplementation(jest.fn()); - jest.spyOn(locationManager, "stop").mockImplementation(jest.fn()); + jest.spyOn(LocationManager, "start").mockImplementation(jest.fn()); + jest.spyOn(LocationManager, "stop").mockImplementation(jest.fn()); jest - .spyOn(locationManager, "getLastKnownLocation") + .spyOn(LocationManager, "getLastKnownLocation") .mockImplementation(() => position); }); @@ -160,7 +162,7 @@ describe("UserLocation", () => { test("initial state is as expected", () => { renderUserLocation(); - expect(locationManager.start).toHaveBeenCalledTimes(1); + expect(LocationManager.start).toHaveBeenCalledTimes(1); }); // TODO: replace object { running: boolean } argument with simple boolean @@ -171,8 +173,8 @@ describe("UserLocation", () => { await userLocationRef.current.setLocationManager({ running: true }); - expect(locationManager.start).toHaveBeenCalledTimes(1); - expect(locationManager.getLastKnownLocation).toHaveBeenCalledTimes(1); + expect(LocationManager.start).toHaveBeenCalledTimes(1); + expect(LocationManager.getLastKnownLocation).toHaveBeenCalledTimes(1); expect(onUpdate).toHaveBeenCalledWith({ coords: { accuracy: 9.977999687194824, @@ -186,7 +188,7 @@ describe("UserLocation", () => { timestamp: 1573730357879, }); - expect(locationManager.stop).not.toHaveBeenCalled(); + expect(LocationManager.stop).not.toHaveBeenCalled(); }); test('called with "running" false', async () => { @@ -198,9 +200,9 @@ describe("UserLocation", () => { await userLocationRef.current.setLocationManager({ running: false }); // only once from start - expect(locationManager.start).toHaveBeenCalledTimes(1); + expect(LocationManager.start).toHaveBeenCalledTimes(1); // stop should not be called - expect(locationManager.stop).not.toHaveBeenCalled(); + expect(LocationManager.stop).not.toHaveBeenCalled(); }); }); diff --git a/__tests__/exports.ts b/__tests__/exports.ts index 82b766124..3b94266e9 100644 --- a/__tests__/exports.ts +++ b/__tests__/exports.ts @@ -16,11 +16,11 @@ describe("Package Exports", () => { "UserLocation", // modules - "offlineManager", + "OfflineManager", "OfflineCreatePackOptions", "OfflinePack", - "snapshotManager", - "locationManager", + "SnapshotManager", + "LocationManager", // layers "FillLayer", diff --git a/__tests__/modules/location/locationManager.test.js b/__tests__/modules/location/LocationManager.test.js similarity index 60% rename from __tests__/modules/location/locationManager.test.js rename to __tests__/modules/location/LocationManager.test.js index cc94c2043..ec98133f4 100644 --- a/__tests__/modules/location/locationManager.test.js +++ b/__tests__/modules/location/LocationManager.test.js @@ -1,8 +1,9 @@ import { NativeModules } from "react-native"; -import LocationManager, { +import { + LocationManager, LocationModuleEventEmitter, -} from "../../../src/modules/location/locationManager"; +} from "../../../src/modules/location/LocationManager"; const MLRNModule = NativeModules.MLRNModule; const MLRNLocationModule = NativeModules.MLRNLocationModule; @@ -20,12 +21,11 @@ const location = { }; describe("LocationManager", () => { - const locationManager = LocationManager; describe("constructor", () => { - test("initializes locationManager correctly", () => { - expect(locationManager._listeners).toStrictEqual([]); - expect(locationManager._lastKnownLocation).toStrictEqual(null); - expect(locationManager._isListening).toStrictEqual(false); + test("initializes LocationManager correctly", () => { + expect(LocationManager._listeners).toStrictEqual([]); + expect(LocationManager._lastKnownLocation).toStrictEqual(null); + expect(LocationManager._isListening).toStrictEqual(false); }); }); @@ -35,33 +35,33 @@ describe("LocationManager", () => { }); describe("#getLastKnownLocation", () => { - test("gets last known location from native locationManager if non available", async () => { + test("gets last known location from native LocationManager if non available", async () => { jest .spyOn(MLRNLocationModule, "getLastKnownLocation") .mockImplementation(() => location); - const lastKnownLocation = await locationManager.getLastKnownLocation(); + const lastKnownLocation = await LocationManager.getLastKnownLocation(); expect(lastKnownLocation).toStrictEqual(location); - expect(locationManager._lastKnownLocation).toStrictEqual(location); + expect(LocationManager._lastKnownLocation).toStrictEqual(location); expect(MLRNLocationModule.getLastKnownLocation).toHaveBeenCalledTimes( 1, ); - locationManager._lastKnownLocation = null; + LocationManager._lastKnownLocation = null; }); test("returns cached location if available", async () => { - locationManager._lastKnownLocation = location; + LocationManager._lastKnownLocation = location; - await locationManager.getLastKnownLocation(); + await LocationManager.getLastKnownLocation(); - expect(locationManager._lastKnownLocation).toStrictEqual(location); + expect(LocationManager._lastKnownLocation).toStrictEqual(location); expect(MLRNLocationModule.getLastKnownLocation).not.toHaveBeenCalled(); // reset - locationManager._lastKnownLocation = null; + LocationManager._lastKnownLocation = null; }); }); @@ -70,28 +70,28 @@ describe("LocationManager", () => { MLRNModule.LocationCallbackName = { Update: "MapboxUserLocationUpdate" }; afterEach(() => { - locationManager._listeners = []; + LocationManager._listeners = []; }); test("adds the listener", () => { - expect(locationManager._listeners).toStrictEqual([]); - locationManager.addListener(myListener); - expect(locationManager._listeners).toStrictEqual([myListener]); + expect(LocationManager._listeners).toStrictEqual([]); + LocationManager.addListener(myListener); + expect(LocationManager._listeners).toStrictEqual([myListener]); }); test("does not re-add same listener", () => { - locationManager.addListener(myListener); - expect(locationManager._listeners).toStrictEqual([myListener]); - locationManager.addListener(myListener); - expect(locationManager._listeners).toStrictEqual([myListener]); + LocationManager.addListener(myListener); + expect(LocationManager._listeners).toStrictEqual([myListener]); + LocationManager.addListener(myListener); + expect(LocationManager._listeners).toStrictEqual([myListener]); expect(myListener).not.toHaveBeenCalled(); }); test('calls listener with "lastKnownLocation"', () => { - locationManager._lastKnownLocation = location; + LocationManager._lastKnownLocation = location; - locationManager.addListener(myListener); - expect(locationManager._listeners).toStrictEqual([myListener]); + LocationManager.addListener(myListener); + expect(LocationManager._listeners).toStrictEqual([myListener]); expect(myListener).toHaveBeenCalledWith(location); expect(myListener).toHaveBeenCalledTimes(1); }); @@ -105,23 +105,23 @@ describe("LocationManager", () => { const listenerA = jest.fn(() => "listenerA"); const listenerB = () => "listenerB"; - locationManager.addListener(listenerA); - expect(locationManager._listeners).toStrictEqual([listenerA]); + LocationManager.addListener(listenerA); + expect(LocationManager._listeners).toStrictEqual([listenerA]); expect(MLRNLocationModule.stop).not.toHaveBeenCalled(); - locationManager.addListener(listenerB); - expect(locationManager._listeners).toStrictEqual([ + LocationManager.addListener(listenerB); + expect(LocationManager._listeners).toStrictEqual([ listenerA, listenerB, ]); expect(MLRNLocationModule.stop).not.toHaveBeenCalled(); - locationManager.removeListener(listenerB); - expect(locationManager._listeners).toStrictEqual([listenerA]); + LocationManager.removeListener(listenerB); + expect(LocationManager._listeners).toStrictEqual([listenerA]); expect(MLRNLocationModule.stop).not.toHaveBeenCalled(); - locationManager.removeListener(listenerA); - expect(locationManager._listeners).toStrictEqual([]); + LocationManager.removeListener(listenerA); + expect(LocationManager._listeners).toStrictEqual([]); expect(MLRNLocationModule.stop).toHaveBeenCalledTimes(1); }); }); @@ -132,16 +132,16 @@ describe("LocationManager", () => { const listenerA = jest.fn(() => "listenerA"); const listenerB = () => "listenerB"; - locationManager.addListener(listenerA); - expect(locationManager._listeners).toStrictEqual([listenerA]); - locationManager.addListener(listenerB); - expect(locationManager._listeners).toStrictEqual([ + LocationManager.addListener(listenerA); + expect(LocationManager._listeners).toStrictEqual([listenerA]); + LocationManager.addListener(listenerB); + expect(LocationManager._listeners).toStrictEqual([ listenerA, listenerB, ]); - locationManager.removeAllListeners(); - expect(locationManager._listeners).toStrictEqual([]); + LocationManager.removeAllListeners(); + expect(LocationManager._listeners).toStrictEqual([]); }); }); @@ -150,7 +150,7 @@ describe("LocationManager", () => { jest.spyOn(LocationModuleEventEmitter, "addListener"); afterEach(() => { - locationManager._isListening = false; + LocationManager._isListening = false; }); test("starts native location manager and adds event emitter listener", () => { @@ -158,21 +158,21 @@ describe("LocationManager", () => { Update: "MapboxUserLocationUpdate", }; - expect(locationManager._isListening).toStrictEqual(false); + expect(LocationManager._isListening).toStrictEqual(false); - locationManager.start(); + LocationManager.start(); expect(MLRNLocationModule.start).toHaveBeenCalledTimes(1); expect(LocationModuleEventEmitter.addListener).toHaveBeenCalledWith( MLRNModule.LocationCallbackName.Update, - locationManager.onUpdate, + LocationManager.onUpdate, ); - expect(locationManager._isListening).toStrictEqual(true); + expect(LocationManager._isListening).toStrictEqual(true); }); test('passes "displacement"', () => { - locationManager.start(5); // displacement 5meters + LocationManager.start(5); // displacement 5meters expect(MLRNLocationModule.start).toHaveBeenCalledTimes(1); expect(MLRNLocationModule.start).toHaveBeenCalledWith(5); @@ -180,11 +180,11 @@ describe("LocationManager", () => { test("does not start when already listening", () => { // we're already listening - locationManager._isListening = true; + LocationManager._isListening = true; - expect(locationManager._isListening).toStrictEqual(true); + expect(LocationManager._isListening).toStrictEqual(true); - locationManager.start(); + LocationManager.start(); expect(MLRNLocationModule.start).not.toHaveBeenCalled(); expect(LocationModuleEventEmitter.addListener).not.toHaveBeenCalled(); @@ -194,7 +194,7 @@ describe("LocationManager", () => { describe("#stop", () => { test("stops native location manager", () => { // set listening to true - locationManager._isListening = true; + LocationManager._isListening = true; // native location manager has no #stop exposed in tests? MLRNLocationModule.stop = jest.fn(); @@ -202,19 +202,19 @@ describe("LocationManager", () => { Update: "MapboxUserLocationUpdate", }; - expect(locationManager._isListening).toStrictEqual(true); + expect(LocationManager._isListening).toStrictEqual(true); - locationManager.stop(); + LocationManager.stop(); expect(MLRNLocationModule.stop).toHaveBeenCalledTimes(1); - expect(locationManager.subscription.remove).toHaveBeenCalled(); + expect(LocationManager.subscription.remove).toHaveBeenCalled(); - expect(locationManager._isListening).toStrictEqual(false); + expect(LocationManager._isListening).toStrictEqual(false); }); test("only removes event emitter listener when listening", () => { // set listening to true - locationManager._isListening = false; + LocationManager._isListening = false; // native location manager has no #stop exposed in tests? MLRNLocationModule.stop = jest.fn(); @@ -222,42 +222,42 @@ describe("LocationManager", () => { Update: "MapboxUserLocationUpdate", }; - expect(locationManager._isListening).toStrictEqual(false); + expect(LocationManager._isListening).toStrictEqual(false); - locationManager.stop(); + LocationManager.stop(); expect(MLRNLocationModule.stop).toHaveBeenCalledTimes(1); - expect(locationManager.subscription.remove).not.toHaveBeenCalled(); + expect(LocationManager.subscription.remove).not.toHaveBeenCalled(); }); }); describe("#setMinDisplacement", () => { test('calls native "setMinDisplacement"', () => { MLRNLocationModule.setMinDisplacement = jest.fn(); - locationManager.setMinDisplacement(5); + LocationManager.setMinDisplacement(5); expect(MLRNLocationModule.setMinDisplacement).toHaveBeenCalledWith(5); }); }); describe("#onUpdate", () => { beforeEach(() => { - locationManager._lastKnownLocation = null; + LocationManager._lastKnownLocation = null; }); test('sets "_lastKnownLocation"', () => { - locationManager.onUpdate(location); + LocationManager.onUpdate(location); - expect(locationManager._lastKnownLocation).toStrictEqual(location); + expect(LocationManager._lastKnownLocation).toStrictEqual(location); }); test("calls listeners with location", () => { const listeners = [jest.fn(), jest.fn(), jest.fn()]; listeners.forEach((listener) => { - locationManager.addListener(listener); + LocationManager.addListener(listener); }); - locationManager.onUpdate(location); + LocationManager.onUpdate(location); listeners.forEach((listener) => { expect(listener).toHaveBeenCalledTimes(1); diff --git a/__tests__/modules/offline/OfflineCreatePackOptions.test.js b/__tests__/modules/offline/OfflineCreatePackOptions.test.js index f0c01f6d5..1182dc68c 100644 --- a/__tests__/modules/offline/OfflineCreatePackOptions.test.js +++ b/__tests__/modules/offline/OfflineCreatePackOptions.test.js @@ -1,6 +1,6 @@ import { featureCollection, point } from "@turf/helpers"; -import OfflineCreatePackOptions from "../../../src/modules/offline/OfflineCreatePackOptions"; +import { OfflineCreatePackOptions } from "../../../src/modules/offline/OfflineCreatePackOptions"; describe("OfflineCreatePackOptions", () => { const options = { diff --git a/__tests__/modules/offline/offlineManager.test.js b/__tests__/modules/offline/OfflineManager.test.js similarity index 66% rename from __tests__/modules/offline/offlineManager.test.js rename to __tests__/modules/offline/OfflineManager.test.js index 41215fa0b..6f1bae2cd 100644 --- a/__tests__/modules/offline/offlineManager.test.js +++ b/__tests__/modules/offline/OfflineManager.test.js @@ -1,9 +1,9 @@ import { NativeModules, Platform } from "react-native"; -import { offlineManager, OfflinePackDownloadState } from "../../../src"; -import { OfflineModuleEventEmitter } from "../../../src/modules/offline/offlineManager"; +import { OfflineManager, OfflinePackDownloadState } from "../../../src"; +import { OfflineModuleEventEmitter } from "../../../src/modules/offline/OfflineManager"; -describe("offlineManager", () => { +describe("OfflineManager", () => { const packOptions = { name: "test", styleURL: "https://demotiles.maplibre.org/style.json", @@ -42,30 +42,30 @@ describe("offlineManager", () => { }; afterEach(async () => { - const packs = await offlineManager.getPacks(); + const packs = await OfflineManager.getPacks(); for (const pack of packs) { - await offlineManager.deletePack(pack.name); + await OfflineManager.deletePack(pack.name); } jest.clearAllMocks(); }); it("should create pack", async () => { - let offlinePack = await offlineManager.getPack(packOptions.name); + let offlinePack = await OfflineManager.getPack(packOptions.name); expect(offlinePack).toBeFalsy(); - await offlineManager.createPack(packOptions); - offlinePack = await offlineManager.getPack(packOptions.name); + await OfflineManager.createPack(packOptions); + offlinePack = await OfflineManager.getPack(packOptions.name); expect(offlinePack).toBeTruthy(); }); it("should delete pack", async () => { - await offlineManager.createPack(packOptions); - let offlinePack = await offlineManager.getPack(packOptions.name); + await OfflineManager.createPack(packOptions); + let offlinePack = await OfflineManager.getPack(packOptions.name); expect(offlinePack).toBeTruthy(); - await offlineManager.deletePack(packOptions.name); - offlinePack = await offlineManager.getPack(packOptions.name); + await OfflineManager.deletePack(packOptions.name); + offlinePack = await OfflineManager.getPack(packOptions.name); expect(offlinePack).toBeFalsy(); }); @@ -75,7 +75,7 @@ describe("offlineManager", () => { NativeModules.MLRNOfflineModule, "setTileCountLimit", ); - offlineManager.setTileCountLimit(expectedLimit); + OfflineManager.setTileCountLimit(expectedLimit); expect(spy).toHaveBeenCalledWith(expectedLimit); spy.mockRestore(); }); @@ -86,7 +86,7 @@ describe("offlineManager", () => { NativeModules.MLRNOfflineModule, "setProgressEventThrottle", ); - offlineManager.setProgressEventThrottle(expectedThrottleValue); + OfflineManager.setProgressEventThrottle(expectedThrottleValue); expect(spy).toHaveBeenCalledWith(expectedThrottleValue); spy.mockRestore(); }); @@ -95,18 +95,18 @@ describe("offlineManager", () => { it("should subscribe to native events", async () => { const spy = jest.spyOn(OfflineModuleEventEmitter, "addListener"); const noop = () => {}; - await offlineManager.createPack(packOptions, noop, noop); + await OfflineManager.createPack(packOptions, noop, noop); expect(spy).toHaveBeenCalledTimes(2); spy.mockClear(); }); it("should call progress listener", async () => { const listener = jest.fn(); - await offlineManager.createPack(packOptions, listener); - const expectedOfflinePack = await offlineManager.getPack( + await OfflineManager.createPack(packOptions, listener); + const expectedOfflinePack = await OfflineManager.getPack( packOptions.name, ); - offlineManager._onProgress(mockOnProgressEvent); + OfflineManager._onProgress(mockOnProgressEvent); expect(listener).toHaveBeenCalledWith( expectedOfflinePack, mockOnProgressEvent.payload, @@ -115,11 +115,11 @@ describe("offlineManager", () => { it("should call error listener", async () => { const listener = jest.fn(); - await offlineManager.createPack(packOptions, null, listener); - const expectedOfflinePack = await offlineManager.getPack( + await OfflineManager.createPack(packOptions, null, listener); + const expectedOfflinePack = await OfflineManager.getPack( packOptions.name, ); - offlineManager._onError(mockErrorEvent); + OfflineManager._onError(mockErrorEvent); expect(listener).toHaveBeenCalledWith( expectedOfflinePack, mockErrorEvent.payload, @@ -128,56 +128,56 @@ describe("offlineManager", () => { it("should not call listeners after unsubscribe", async () => { const listener = jest.fn(); - await offlineManager.createPack(packOptions, listener, listener); - offlineManager.unsubscribe(packOptions.name); - offlineManager._onProgress(mockOnProgressEvent); - offlineManager._onError(mockErrorEvent); + await OfflineManager.createPack(packOptions, listener, listener); + OfflineManager.unsubscribe(packOptions.name); + OfflineManager._onProgress(mockOnProgressEvent); + OfflineManager._onError(mockErrorEvent); expect(listener).not.toHaveBeenCalled(); }); it("should unsubscribe from native events", async () => { const noop = () => {}; - await offlineManager.createPack(packOptions, noop, noop); - offlineManager.unsubscribe(packOptions.name); + await OfflineManager.createPack(packOptions, noop, noop); + OfflineManager.unsubscribe(packOptions.name); - expect(offlineManager.subscriptionProgress.remove).toHaveBeenCalledTimes( + expect(OfflineManager.subscriptionProgress.remove).toHaveBeenCalledTimes( 1, ); - expect(offlineManager.subscriptionError.remove).toHaveBeenCalledTimes(1); + expect(OfflineManager.subscriptionError.remove).toHaveBeenCalledTimes(1); }); it("should unsubscribe event listeners once a pack download has completed", async () => { const listener = jest.fn(); - await offlineManager.createPack(packOptions, listener, listener); + await OfflineManager.createPack(packOptions, listener, listener); expect( - offlineManager._hasListeners( + OfflineManager._hasListeners( packOptions.name, - offlineManager._progressListeners, + OfflineManager._progressListeners, ), ).toBeTruthy(); expect( - offlineManager._hasListeners( + OfflineManager._hasListeners( packOptions.name, - offlineManager._errorListeners, + OfflineManager._errorListeners, ), ).toBeTruthy(); - offlineManager._onProgress(mockOnProgressCompleteEvent); + OfflineManager._onProgress(mockOnProgressCompleteEvent); expect( - offlineManager._hasListeners( + OfflineManager._hasListeners( packOptions.name, - offlineManager._progressListeners, + OfflineManager._progressListeners, ), ).toBeFalsy(); expect( - offlineManager._hasListeners( + OfflineManager._hasListeners( packOptions.name, - offlineManager._errorListeners, + OfflineManager._errorListeners, ), ).toBeFalsy(); }); @@ -195,8 +195,8 @@ describe("offlineManager", () => { const name = `test-${Date.now()}`; const noop = () => {}; const options = { ...packOptions, name }; - await offlineManager.createPack(options); - await offlineManager.subscribe(name, noop, noop); + await OfflineManager.createPack(options); + await OfflineManager.subscribe(name, noop, noop); expect(spy).toHaveBeenCalled(); spy.mockRestore(); @@ -211,7 +211,7 @@ describe("offlineManager", () => { const name = `test-${Date.now()}`; const noop = () => {}; const options = { ...packOptions, name }; - await offlineManager.createPack(options, noop, noop); + await OfflineManager.createPack(options, noop, noop); expect(spy).not.toHaveBeenCalled(); spy.mockRestore(); @@ -230,8 +230,8 @@ describe("offlineManager", () => { const name = `test-${Date.now()}`; const noop = () => {}; const options = { ...packOptions, name }; - await offlineManager.createPack(options); - await offlineManager.subscribe(name, noop, noop); + await OfflineManager.createPack(options); + await OfflineManager.subscribe(name, noop, noop); expect(spy).not.toHaveBeenCalled(); spy.mockRestore(); diff --git a/__tests__/modules/offline/OfflinePack.test.js b/__tests__/modules/offline/OfflinePack.test.js index 98e2845c8..f9f81f039 100644 --- a/__tests__/modules/offline/OfflinePack.test.js +++ b/__tests__/modules/offline/OfflinePack.test.js @@ -1,6 +1,6 @@ import { NativeModules } from "react-native"; -import OfflinePack from "../../../src/modules/offline/OfflinePack"; +import { OfflinePack } from "../../../src"; describe("OfflinePack", () => { const fakeNativePack = { diff --git a/__tests__/modules/snapshot/snapshotManager.test.js b/__tests__/modules/snapshot/SnapshotManager.test.js similarity index 50% rename from __tests__/modules/snapshot/snapshotManager.test.js rename to __tests__/modules/snapshot/SnapshotManager.test.js index 097094467..1a4201f83 100644 --- a/__tests__/modules/snapshot/snapshotManager.test.js +++ b/__tests__/modules/snapshot/SnapshotManager.test.js @@ -1,9 +1,9 @@ -import { snapshotManager } from "../../../src"; +import { SnapshotManager } from "../../../src"; -describe("snapshotManager", () => { +describe("SnapshotManager", () => { it("should resolve uri", async () => { const options = { centerCoordinate: [1, 2] }; - const uri = await snapshotManager.takeSnap(options); + const uri = await SnapshotManager.takeSnap(options); expect(uri).toEqual("file://test.png"); }); }); diff --git a/__tests__/modules/snapshot/SnapshotOptions.test.js b/__tests__/modules/snapshot/SnapshotOptions.test.js index 08451081d..a6f106b5e 100644 --- a/__tests__/modules/snapshot/SnapshotOptions.test.js +++ b/__tests__/modules/snapshot/SnapshotOptions.test.js @@ -1,7 +1,7 @@ import { featureCollection, point } from "@turf/helpers"; import { NativeModules } from "react-native"; -import SnapshotOptions from "../../../src/modules/snapshot/SnapshotOptions"; +import { SnapshotOptions } from "../../../src/modules/snapshot/SnapshotOptions"; describe("SnapshotOptions", () => { it("should throw error if no centerCoordinate or bounds are provided", () => { diff --git a/__tests__/utils/BridgeValue.test.js b/__tests__/utils/BridgeValue.test.js index 99e3516b4..81a7179e6 100644 --- a/__tests__/utils/BridgeValue.test.js +++ b/__tests__/utils/BridgeValue.test.js @@ -1,4 +1,4 @@ -import BridgeValue from "../../src/utils/BridgeValue"; +import { BridgeValue } from "../../src/utils/BridgeValue"; describe("BridgeValue", () => { it("should convert to array of numbers", () => { diff --git a/__tests__/utils/animated/AnimatedCoordinatesArray.test.js b/__tests__/utils/animated/AnimatedCoordinatesArray.test.js index fd48f6836..6d825da09 100644 --- a/__tests__/utils/animated/AnimatedCoordinatesArray.test.js +++ b/__tests__/utils/animated/AnimatedCoordinatesArray.test.js @@ -3,9 +3,9 @@ import React from "react"; import { Animated, Easing } from "react-native"; import TestRenderer from "react-test-renderer"; -import ShapeSource from "../../../src/components/ShapeSource"; -import AnimatedCoordinatesArray from "../../../src/utils/animated/AnimatedCoordinatesArray"; -import AnimatedShape from "../../../src/utils/animated/AnimatedShape"; +import { ShapeSource } from "../../../src"; +import { AnimatedCoordinatesArray } from "../../../src/utils/animated/AnimatedCoordinatesArray"; +import { AnimatedShape } from "../../../src/utils/animated/AnimatedShape"; let clock = null; let oldNodeEnv = null; diff --git a/__tests__/utils/filterUtils.test.js b/__tests__/utils/filterUtils.test.js index 91f02c131..07be5a5b9 100644 --- a/__tests__/utils/filterUtils.test.js +++ b/__tests__/utils/filterUtils.test.js @@ -1,4 +1,4 @@ -import BridgeValue from "../../src/utils/BridgeValue"; +import { BridgeValue } from "../../src/utils/BridgeValue"; import { getFilter } from "../../src/utils/filterUtils"; const FilterItem = BridgeValue; diff --git a/docs/components/Annotation.md b/docs/components/Annotation.md index 3c07793d7..9052336d7 100644 --- a/docs/components/Annotation.md +++ b/docs/components/Annotation.md @@ -10,7 +10,7 @@ | animated | `boolean` | `false` | `false` | FIX ME NO DESCRIPTION | | animationDuration | `number` | `1000` | `false` | FIX ME NO DESCRIPTION | | coordinates | `Array` | `none` | `false` | FIX ME NO DESCRIPTION | -| children | `ReactElement \| ReactElement[]` | `none` | `false` | FIX ME NO DESCRIPTION | +| children | `ReactNode` | `none` | `false` | FIX ME NO DESCRIPTION | | style | `object` | `none` | `false` | FIX ME NO DESCRIPTION | | icon | `string \| number \| object` | `none` | `false` | FIX ME NO DESCRIPTION | | animationEasingFunction | `FIX ME UNKNOWN TYPE` | `Easing.linear` | `false` | FIX ME NO DESCRIPTION | diff --git a/docs/components/ImageSource.md b/docs/components/ImageSource.md index 255847a8e..bd39669a7 100644 --- a/docs/components/ImageSource.md +++ b/docs/components/ImageSource.md @@ -9,6 +9,6 @@ ImageSource is a content source that is used for a georeferenced raster image to | id | `string` | `none` | `true` | A string that uniquely identifies the source. | | url | `number \| string` | `none` | `false` | An HTTP(S) URL, absolute file URL, or local file URL to the source image.
Gifs are currently not supported. | | coordinates | `tuple` | `none` | `false` | The top left, top right, bottom right, and bottom left coordinates for the image. | -| children | `ReactElement \| ReactElement[]` | `none` | `false` | FIX ME NO DESCRIPTION | +| children | `ReactNode` | `none` | `false` | FIX ME NO DESCRIPTION | diff --git a/docs/components/Images.md b/docs/components/Images.md index d993be82b..532c7e9d8 100644 --- a/docs/components/Images.md +++ b/docs/components/Images.md @@ -10,6 +10,6 @@ Images defines the images used in Symbol etc layers |   [object Object] | `union` | `none` | `true` | FIX ME NO DESCRIPTION | | nativeAssetImages | `Array` | `none` | `false` | If you have an asset under Image.xcassets on iOS and the drawables directory on android
you can specify an array of string names with assets as the key `['pin']`. | | id | `string` | `none` | `false` | FIX ME NO DESCRIPTION | -| children | `ReactElement` | `none` | `false` | FIX ME NO DESCRIPTION | +| children | `ReactNode` | `none` | `false` | FIX ME NO DESCRIPTION | diff --git a/docs/components/MarkerView.md b/docs/components/MarkerView.md index 925802ae4..440c459cc 100644 --- a/docs/components/MarkerView.md +++ b/docs/components/MarkerView.md @@ -12,6 +12,6 @@ MarkerView allows you to place a interactive react native marker to the map.
The anchor point is specified in the continuous space [0.0, 1.0] x [0.0, 1.0],
where (0, 0) is the top-left corner of the image, and (1, 1) is the bottom-right corner.
Note this is only for custom annotations not the default pin view.
Defaults to the center of the view. | |   x | `number` | `none` | `true` | See anchor | |   y | `number` | `none` | `true` | See anchor | -| children | `React.ReactElement \| [React.ReactElement, React.ReactElement]` | `none` | `true` | Expects one child, and an optional callout can be added as well | +| children | `ReactElement \| [ReactElement, ReactElement]` | `none` | `true` | Expects one child, and an optional callout can be added as well | | style | `ViewProps["style"]` | `none` | `false` | FIX ME NO DESCRIPTION | ## Methods diff --git a/docs/components/RasterSource.md b/docs/components/RasterSource.md index 2b70c6a45..67d261519 100644 --- a/docs/components/RasterSource.md +++ b/docs/components/RasterSource.md @@ -14,6 +14,6 @@ RasterSource is a map content source that supplies raster image tiles to be show | tileSize | `number` | `none` | `false` | Size of the map tiles.
Mapbox urls default to 256, all others default to 512. | | tms | `boolean` | `none` | `false` | Influences the y direction of the tile coordinates. (tms inverts y axis) | | attribution | `string` | `none` | `false` | An HTML or literal text string defining the buttons to be displayed in an action sheet when the
source is part of a map view’s style and the map view’s attribution button is pressed. | -| children | `React.ReactElement \| React.ReactElement[]` | `none` | `false` | FIX ME NO DESCRIPTION | +| children | `ReactNode` | `none` | `false` | FIX ME NO DESCRIPTION | diff --git a/docs/components/ShapeSource.md b/docs/components/ShapeSource.md index 81bfb637e..5ce9691e5 100644 --- a/docs/components/ShapeSource.md +++ b/docs/components/ShapeSource.md @@ -22,7 +22,7 @@ ShapeSource is a map content source that supplies vector shapes to be shown on t | hitbox | `shape` | `none` | `false` | Overrides the default touch hitbox(44x44 pixels) for the source layers | |   width | `number` | `none` | `true` | `width` of hitbox | |   height | `number` | `none` | `true` | `height` of hitbox | -| children | `ReactElement \| ReactElement[]` | `none` | `false` | FIX ME NO DESCRIPTION | +| children | `ReactNode` | `none` | `false` | FIX ME NO DESCRIPTION | ## Methods ### `features([filter])` diff --git a/docs/components/UserLocation.md b/docs/components/UserLocation.md index 0c9439555..3831e92bb 100644 --- a/docs/components/UserLocation.md +++ b/docs/components/UserLocation.md @@ -13,7 +13,7 @@ | showsUserHeadingIndicator | `boolean` | `false` | `false` | Show or hide small arrow which indicates direction the device is pointing relative to north. | | minDisplacement | `number` | `0` | `false` | Minimum amount of movement before GPS location is updated in meters | | androidPreferredFramesPerSecond | `number` | `none` | `false` | Android only. Set max FPS at which location animators can output updates. Use this setting to limit animation rate of the location puck on higher zoom levels to decrease the stress on the device's CPU which can directly improve battery life, without sacrificing UX.

@platform android | -| children | `ReactElement \| ReactElement[]` | `none` | `false` | Custom location icon of type mapbox-gl-native components

NOTE: Forking maintainer does not understand the above comment. | +| children | `ReactNode` | `none` | `false` | Custom location icon of type mapbox-gl-native components

NOTE: Forking maintainer does not understand the above comment. | ## Methods ### `setLocationManager({ @@ -22,7 +22,7 @@ running: boolean; })` -Whether to start or stop listening to the locationManager

Notice, that listening will start automatically when
either `onUpdate` or `visible` are set +Whether to start or stop listening to the LocationManager

Notice, that listening will start automatically when
either `onUpdate` or `visible` are set #### Arguments | Name | Type | Required | Description | @@ -36,7 +36,7 @@ Whether to start or stop listening to the locationManager

Notice, that ### `needsLocationManagerRunning()` -If locationManager should be running +If LocationManager should be running diff --git a/docs/components/VectorSource.md b/docs/components/VectorSource.md index bfd67542b..7fc5fdc8e 100644 --- a/docs/components/VectorSource.md +++ b/docs/components/VectorSource.md @@ -17,7 +17,7 @@ VectorSource is a map content source that supplies tiled vector data in Mapbox V | hitbox | `shape` | `none` | `false` | Overrides the default touch hitbox(44x44 pixels) for the source layers | |   width | `number` | `none` | `true` | `width` of hitbox | |   height | `number` | `none` | `true` | `height` of hitbox | -| children | `React.ReactElement \| React.ReactElement[]` | `none` | `false` | FIX ME NO DESCRIPTION | +| children | `ReactNode` | `none` | `false` | FIX ME NO DESCRIPTION | ## Methods ### `features([layerIDs], [filter])` diff --git a/docs/docs.json b/docs/docs.json index ebeda53c1..93b60681a 100644 --- a/docs/docs.json +++ b/docs/docs.json @@ -55,7 +55,7 @@ { "name": "children", "required": false, - "type": "ReactElement \\| ReactElement[]", + "type": "ReactNode", "default": "none", "description": "FIX ME NO DESCRIPTION" }, @@ -1494,7 +1494,7 @@ { "name": "children", "required": false, - "type": "ReactElement \\| ReactElement[]", + "type": "ReactNode", "default": "none", "description": "FIX ME NO DESCRIPTION" } @@ -1548,7 +1548,7 @@ { "name": "children", "required": false, - "type": "ReactElement", + "type": "ReactNode", "default": "none", "description": "FIX ME NO DESCRIPTION" } @@ -2609,7 +2609,7 @@ { "name": "children", "required": true, - "type": "ReactReactElement", + "type": "ReactElement", "default": "none", "description": "Expects one child - can be container with multiple elements" } @@ -2741,7 +2741,7 @@ { "name": "children", "required": true, - "type": "React.ReactElement \\| [React.ReactElement, React.ReactElement]", + "type": "ReactElement \\| [ReactElement, ReactElement]", "default": "none", "description": "Expects one child, and an optional callout can be added as well" }, @@ -3027,7 +3027,7 @@ { "name": "children", "required": false, - "type": "React.ReactElement \\| React.ReactElement[]", + "type": "ReactNode", "default": "none", "description": "FIX ME NO DESCRIPTION" } @@ -3336,7 +3336,7 @@ { "name": "children", "required": false, - "type": "ReactElement \\| ReactElement[]", + "type": "ReactNode", "default": "none", "description": "FIX ME NO DESCRIPTION" } @@ -4725,7 +4725,7 @@ "methods": [ { "name": "setLocationManager", - "docblock": "Whether to start or stop listening to the locationManager\n\nNotice, that listening will start automatically when\neither `onUpdate` or `visible` are set\n\n@async\n@param {Object} running - Object with key `running` and `boolean` value\n@return {Promise}", + "docblock": "Whether to start or stop listening to the LocationManager\n\nNotice, that listening will start automatically when\neither `onUpdate` or `visible` are set\n\n@async\n@param {Object} running - Object with key `running` and `boolean` value\n@return {Promise}", "modifiers": [ "async" ], @@ -4749,12 +4749,12 @@ "raw": "Promise" } }, - "description": "Whether to start or stop listening to the locationManager\n\nNotice, that listening will start automatically when\neither `onUpdate` or `visible` are set", + "description": "Whether to start or stop listening to the LocationManager\n\nNotice, that listening will start automatically when\neither `onUpdate` or `visible` are set", "examples": [] }, { "name": "needsLocationManagerRunning", - "docblock": "If locationManager should be running\n\n@return {boolean}", + "docblock": "If LocationManager should be running\n\n@return {boolean}", "modifiers": [], "params": [], "returns": { @@ -4762,7 +4762,7 @@ "name": "boolean" } }, - "description": "If locationManager should be running", + "description": "If LocationManager should be running", "examples": [] } ], @@ -4819,7 +4819,7 @@ { "name": "children", "required": false, - "type": "ReactElement \\| ReactElement[]", + "type": "ReactNode", "default": "none", "description": "Custom location icon of type mapbox-gl-native components\n\nNOTE: Forking maintainer does not understand the above comment." } @@ -4980,7 +4980,7 @@ { "name": "children", "required": false, - "type": "React.ReactElement \\| React.ReactElement[]", + "type": "ReactNode", "default": "none", "description": "FIX ME NO DESCRIPTION" } @@ -4995,8 +4995,8 @@ "coordinates": { "name": "coordinates", "type": "module", - "filePath": "src/modules/location/locationManager.ts", - "description": "Coorinates sent by locationManager", + "filePath": "src/modules/location/LocationManager.ts", + "description": "Coorinates sent by LocationManager", "props": [], "styles": [], "methods": [] @@ -5004,8 +5004,8 @@ "location": { "name": "location", "type": "module", - "filePath": "src/modules/location/locationManager.ts", - "description": "Location sent by locationManager", + "filePath": "src/modules/location/LocationManager.ts", + "description": "Location sent by LocationManager", "props": [], "styles": [], "methods": [] @@ -5013,7 +5013,7 @@ "offlineManager": { "name": "offlineManager", "type": "module", - "filePath": "src/modules/offline/offlineManager.ts", + "filePath": "src/modules/offline/OfflineManager.ts", "description": "OfflineManager implements a singleton (shared object) that manages offline packs.\nAll of this class’s instance methods are asynchronous, reflecting the fact that offline resources are stored in a database.\nThe shared object maintains a canonical collection of offline packs.", "props": [], "styles": [], @@ -5048,7 +5048,7 @@ } ], "examples": [ - "const progressListener = (offlineRegion, status) => console.log(offlineRegion, status);\nconst errorListener = (offlineRegion, err) => console.log(offlineRegion, err);\n\nawait offlineManager.createPack({\n name: 'offlinePack',\n styleURL: 'https://demotiles.maplibre.org/tiles/tiles.json',\n minZoom: 14,\n maxZoom: 20,\n bounds: [[neLng, neLat], [swLng, swLat]]\n}, progressListener, errorListener)" + "const progressListener = (offlineRegion, status) => console.log(offlineRegion, status);\nconst errorListener = (offlineRegion, err) => console.log(offlineRegion, err);\n\nawait OfflineManager.createPack({\n name: 'offlinePack',\n styleURL: 'https://demotiles.maplibre.org/tiles/tiles.json',\n minZoom: 14,\n maxZoom: 20,\n bounds: [[neLng, neLat], [swLng, swLat]]\n}, progressListener, errorListener)" ], "returns": { "description": "", @@ -5071,7 +5071,7 @@ } ], "examples": [ - "await offlineManager.invalidatePack('packName')" + "await OfflineManager.invalidatePack('packName')" ], "returns": { "description": "", @@ -5094,7 +5094,7 @@ } ], "examples": [ - "await offlineManager.deletePack('packName')" + "await OfflineManager.deletePack('packName')" ], "returns": { "description": "", @@ -5108,7 +5108,7 @@ "description": "Forces a revalidation of the tiles in the ambient cache and downloads a fresh version of the tiles from the tile server.\nThis is the recommend method for clearing the cache.\nThis is the most efficient method because tiles in the ambient cache are re-downloaded to remove outdated data from a device.\nIt does not erase resources from the ambient cache or delete the database, which can be computationally expensive operations that may carry unintended side effects.", "params": [], "examples": [ - "await offlineManager.invalidateAmbientCache();" + "await OfflineManager.invalidateAmbientCache();" ], "returns": { "description": "", @@ -5122,7 +5122,7 @@ "description": "Erases resources from the ambient cache.\nThis method clears the cache and decreases the amount of space that map resources take up on the device.", "params": [], "examples": [ - "await offlineManager.clearAmbientCache();" + "await OfflineManager.clearAmbientCache();" ], "returns": { "description": "", @@ -5145,7 +5145,7 @@ } ], "examples": [ - "await offlineManager.setMaximumAmbientCacheSize(5000000);" + "await OfflineManager.setMaximumAmbientCacheSize(5000000);" ], "returns": { "description": "", @@ -5159,7 +5159,7 @@ "description": "Deletes the existing database, which includes both the ambient cache and offline packs, then reinitializes it.", "params": [], "examples": [ - "await offlineManager.resetDatabase();" + "await OfflineManager.resetDatabase();" ], "returns": { "description": "", @@ -5173,7 +5173,7 @@ "description": "Retrieves all the current offline packs that are stored in the database.", "params": [], "examples": [ - "const offlinePacks = await offlineManager.getPacks();" + "const offlinePacks = await OfflineManager.getPacks();" ], "returns": { "description": "", @@ -5196,7 +5196,7 @@ } ], "examples": [ - "const offlinePack = await offlineManager.getPack();" + "const offlinePack = await OfflineManager.getPack();" ], "returns": { "description": "", @@ -5219,7 +5219,7 @@ } ], "examples": [ - "await offlineManager.mergeOfflineRegions(path);" + "await OfflineManager.mergeOfflineRegions(path);" ], "returns": { "description": "", @@ -5242,7 +5242,7 @@ } ], "examples": [ - "offlineManager.setTileCountLimit(1000);" + "OfflineManager.setTileCountLimit(1000);" ], "returns": { "description": "", @@ -5265,7 +5265,7 @@ } ], "examples": [ - "offlineManager.setProgressEventThrottle(500);" + "OfflineManager.setProgressEventThrottle(500);" ], "returns": { "description": "", @@ -5304,7 +5304,7 @@ } ], "examples": [ - "const progressListener = (offlinePack, status) => console.log(offlinePack, status)\nconst errorListener = (offlinePack, err) => console.log(offlinePack, err)\nofflineManager.subscribe('packName', progressListener, errorListener)" + "const progressListener = (offlinePack, status) => console.log(offlinePack, status)\nconst errorListener = (offlinePack, err) => console.log(offlinePack, err)\nOfflineManager.subscribe('packName', progressListener, errorListener)" ], "returns": { "description": "", @@ -5327,7 +5327,7 @@ } ], "examples": [ - "offlineManager.unsubscribe('packName')" + "OfflineManager.unsubscribe('packName')" ], "returns": { "description": "", @@ -5341,8 +5341,8 @@ "snapshotManager": { "name": "snapshotManager", "type": "module", - "filePath": "src/modules/snapshot/snapshotManager.ts", - "description": "The snapshotManager generates static raster images of the map.\nEach snapshot image depicts a portion of a map defined by an SnapshotOptions object you provide.\nThe snapshotter generates the snapshot asynchronous.", + "filePath": "src/modules/snapshot/SnapshotManager.ts", + "description": "The SnapshotManager generates static raster images of the map.\nEach snapshot image depicts a portion of a map defined by an SnapshotOptions object you provide.\nThe snapshotter generates the snapshot asynchronous.", "props": [], "styles": [], "methods": [ @@ -5360,7 +5360,7 @@ } ], "examples": [ - "// creates a temp file png of base map\nconst uri = await snapshotManager.takeSnap({\n centerCoordinate: [-74.126410, 40.797968],\n width: width,\n height: height,\n zoomLevel: 12,\n pitch: 30,\n heading: 20,\n styleURL: StyleURL.Default,\n writeToDisk: true, // Create a temporary file\n});\n\n// creates base64 png of base map without logo\nconst uri = await snapshotManager.takeSnap({\n centerCoordinate: [-74.126410, 40.797968],\n width: width,\n height: height,\n zoomLevel: 12,\n pitch: 30,\n heading: 20,\n styleURL: StyleURL.Default,\n withLogo: false, // Disable Mapbox logo (Android only)\n});\n\n// creates snapshot with bounds\nconst uri = await snapshotManager.takeSnap({\n bounds: [[-74.126410, 40.797968], [-74.143727, 40.772177]],\n width: width,\n height: height,\n styleURL: StyleURL.Default,\n});" + "// creates a temp file png of base map\nconst uri = await SnapshotManager.takeSnap({\n centerCoordinate: [-74.126410, 40.797968],\n width: width,\n height: height,\n zoomLevel: 12,\n pitch: 30,\n heading: 20,\n styleURL: StyleURL.Default,\n writeToDisk: true, // Create a temporary file\n});\n\n// creates base64 png of base map without logo\nconst uri = await SnapshotManager.takeSnap({\n centerCoordinate: [-74.126410, 40.797968],\n width: width,\n height: height,\n zoomLevel: 12,\n pitch: 30,\n heading: 20,\n styleURL: StyleURL.Default,\n withLogo: false, // Disable Mapbox logo (Android only)\n});\n\n// creates snapshot with bounds\nconst uri = await SnapshotManager.takeSnap({\n bounds: [[-74.126410, 40.797968], [-74.143727, 40.772177]],\n width: width,\n height: height,\n styleURL: StyleURL.Default,\n});" ], "returns": { "description": "", diff --git a/docs/guides/CustomHTTPHeaders.md b/docs/guides/CustomHTTPHeaders.md index aceec08c9..11953ca09 100644 --- a/docs/guides/CustomHTTPHeaders.md +++ b/docs/guides/CustomHTTPHeaders.md @@ -66,7 +66,7 @@ removeCustomHeader("Authorization"); ### Working Example ```javascript -export default function App() { +function App() { useEffect(() => { addCustomHeader("Authorization", "{auth header}"); }, []); diff --git a/docs/guides/setup/GettingStarted.md b/docs/guides/setup/GettingStarted.md index 0e01443aa..01c48d0f9 100644 --- a/docs/guides/setup/GettingStarted.md +++ b/docs/guides/setup/GettingStarted.md @@ -61,7 +61,7 @@ import { MapView, setAccessToken } from "@maplibre/maplibre-react-native"; // Required on Android. See Android installation notes. setAccessToken(null); -export default function App() { +function App() { return ; } ``` diff --git a/docs/modules/coordinates.md b/docs/modules/coordinates.md index 095d5e021..322bb36a0 100644 --- a/docs/modules/coordinates.md +++ b/docs/modules/coordinates.md @@ -1,7 +1,7 @@ - + # `` -Coorinates sent by locationManager +Coorinates sent by LocationManager diff --git a/docs/modules/location.md b/docs/modules/location.md index 2e4aa0fa4..ee0b7b247 100644 --- a/docs/modules/location.md +++ b/docs/modules/location.md @@ -1,7 +1,7 @@ - + # `` -Location sent by locationManager +Location sent by LocationManager diff --git a/docs/modules/offlineManager.md b/docs/modules/offlineManager.md index 52a17db38..b91076af3 100644 --- a/docs/modules/offlineManager.md +++ b/docs/modules/offlineManager.md @@ -1,5 +1,5 @@ - + # `` OfflineManager implements a singleton (shared object) that manages offline packs.
All of this class’s instance methods are asynchronous, reflecting the fact that offline resources are stored in a database.
The shared object maintains a canonical collection of offline packs. @@ -22,7 +22,7 @@ Creates and registers an offline pack that downloads the resources needed to use const progressListener = (offlineRegion, status) => console.log(offlineRegion, status); const errorListener = (offlineRegion, err) => console.log(offlineRegion, err); -await offlineManager.createPack({ +await OfflineManager.createPack({ name: 'offlinePack', styleURL: 'https://demotiles.maplibre.org/tiles/tiles.json', minZoom: 14, @@ -44,7 +44,7 @@ Invalidates the specified offline pack. This method checks that the tiles in the ```javascript -await offlineManager.invalidatePack('packName') +await OfflineManager.invalidatePack('packName') ``` @@ -60,7 +60,7 @@ Unregisters the given offline pack and allows resources that are no longer requi ```javascript -await offlineManager.deletePack('packName') +await OfflineManager.deletePack('packName') ``` @@ -72,7 +72,7 @@ Forces a revalidation of the tiles in the ambient cache and downloads a fresh ve ```javascript -await offlineManager.invalidateAmbientCache(); +await OfflineManager.invalidateAmbientCache(); ``` @@ -84,7 +84,7 @@ Erases resources from the ambient cache.
This method clears the cache and de ```javascript -await offlineManager.clearAmbientCache(); +await OfflineManager.clearAmbientCache(); ``` @@ -100,7 +100,7 @@ Sets the maximum size of the ambient cache in bytes. Disables the ambient cache ```javascript -await offlineManager.setMaximumAmbientCacheSize(5000000); +await OfflineManager.setMaximumAmbientCacheSize(5000000); ``` @@ -112,7 +112,7 @@ Deletes the existing database, which includes both the ambient cache and offline ```javascript -await offlineManager.resetDatabase(); +await OfflineManager.resetDatabase(); ``` @@ -124,7 +124,7 @@ Retrieves all the current offline packs that are stored in the database. ```javascript -const offlinePacks = await offlineManager.getPacks(); +const offlinePacks = await OfflineManager.getPacks(); ``` @@ -140,7 +140,7 @@ Retrieves an offline pack that is stored in the database by name. ```javascript -const offlinePack = await offlineManager.getPack(); +const offlinePack = await OfflineManager.getPack(); ``` @@ -156,7 +156,7 @@ Sideloads offline db ```javascript -await offlineManager.mergeOfflineRegions(path); +await OfflineManager.mergeOfflineRegions(path); ``` @@ -172,7 +172,7 @@ Sets the maximum number of tiles that may be downloaded and stored on the curren ```javascript -offlineManager.setTileCountLimit(1000); +OfflineManager.setTileCountLimit(1000); ``` @@ -188,7 +188,7 @@ Sets the period at which download status events will be sent over the React Nati ```javascript -offlineManager.setProgressEventThrottle(500); +OfflineManager.setProgressEventThrottle(500); ``` @@ -208,7 +208,7 @@ Subscribe to download status/error events for the requested offline pack.
No ```javascript const progressListener = (offlinePack, status) => console.log(offlinePack, status) const errorListener = (offlinePack, err) => console.log(offlinePack, err) -offlineManager.subscribe('packName', progressListener, errorListener) +OfflineManager.subscribe('packName', progressListener, errorListener) ``` @@ -224,7 +224,7 @@ Unsubscribes any listeners associated with the offline pack.
It's a good ide ```javascript -offlineManager.unsubscribe('packName') +OfflineManager.unsubscribe('packName') ``` diff --git a/docs/modules/snapshotManager.md b/docs/modules/snapshotManager.md index 8a7596801..b20f5770c 100644 --- a/docs/modules/snapshotManager.md +++ b/docs/modules/snapshotManager.md @@ -1,7 +1,7 @@ - + # `` -The snapshotManager generates static raster images of the map.
Each snapshot image depicts a portion of a map defined by an SnapshotOptions object you provide.
The snapshotter generates the snapshot asynchronous. +The SnapshotManager generates static raster images of the map.
Each snapshot image depicts a portion of a map defined by an SnapshotOptions object you provide.
The snapshotter generates the snapshot asynchronous. ## Methods @@ -18,7 +18,7 @@ Takes a snapshot of the base map using the provided Snapshot options. NOTE pitch ```javascript // creates a temp file png of base map -const uri = await snapshotManager.takeSnap({ +const uri = await SnapshotManager.takeSnap({ centerCoordinate: [-74.126410, 40.797968], width: width, height: height, @@ -30,7 +30,7 @@ const uri = await snapshotManager.takeSnap({ }); // creates base64 png of base map without logo -const uri = await snapshotManager.takeSnap({ +const uri = await SnapshotManager.takeSnap({ centerCoordinate: [-74.126410, 40.797968], width: width, height: height, @@ -42,7 +42,7 @@ const uri = await snapshotManager.takeSnap({ }); // creates snapshot with bounds -const uri = await snapshotManager.takeSnap({ +const uri = await SnapshotManager.takeSnap({ bounds: [[-74.126410, 40.797968], [-74.143727, 40.772177]], width: width, height: height, diff --git a/packages/examples/index.js b/packages/examples/index.js index 9e65133d0..8d09384e4 100644 --- a/packages/examples/index.js +++ b/packages/examples/index.js @@ -1,3 +1 @@ -import { App } from "./src/App"; - -export default App; +export { App } from "./src/App"; diff --git a/packages/examples/src/App.tsx b/packages/examples/src/App.tsx index c0f02fc1e..18272a426 100755 --- a/packages/examples/src/App.tsx +++ b/packages/examples/src/App.tsx @@ -7,7 +7,7 @@ import { LogBox, Platform, StyleSheet, Text, View } from "react-native"; import { SafeAreaProvider, SafeAreaView } from "react-native-safe-area-context"; import "react-native-gesture-handler"; -import { default as Home } from "./Examples"; +import { Home } from "./Examples"; import { sheet } from "./styles/sheet"; LogBox.ignoreLogs([ diff --git a/packages/examples/src/Examples.tsx b/packages/examples/src/Examples.tsx index 1a02835a8..69594fcee 100644 --- a/packages/examples/src/Examples.tsx +++ b/packages/examples/src/Examples.tsx @@ -267,7 +267,7 @@ function buildNavigationScreens(example: any, Stack: any) { ); } -function Home() { +export function Home() { const Stack = createStackNavigator(); return ( @@ -289,5 +289,3 @@ function Home() { ); } - -export default Home; diff --git a/packages/examples/src/components/Bubble.tsx b/packages/examples/src/components/Bubble.tsx index 7867be09e..023963ef6 100755 --- a/packages/examples/src/components/Bubble.tsx +++ b/packages/examples/src/components/Bubble.tsx @@ -29,7 +29,7 @@ interface BubbleProps { onPress?: (event: GestureResponderEvent) => void; } -export default function Bubble({ children, style, onPress }: BubbleProps) { +export function Bubble({ children, style, onPress }: BubbleProps) { return ( {onPress ? ( diff --git a/packages/examples/src/components/MapSafeAreaView.tsx b/packages/examples/src/components/MapSafeAreaView.tsx index 7ccda1b98..09002c73f 100755 --- a/packages/examples/src/components/MapSafeAreaView.tsx +++ b/packages/examples/src/components/MapSafeAreaView.tsx @@ -7,7 +7,7 @@ interface PageProps { children: ReactNode; } -export default function MapSafeAreaView({ children }: PageProps) { +export function MapSafeAreaView({ children }: PageProps) { return ( {children} diff --git a/packages/examples/src/components/PulseCircleLayer.tsx b/packages/examples/src/components/PulseCircleLayer.tsx index 2049dcf0c..9328f44af 100755 --- a/packages/examples/src/components/PulseCircleLayer.tsx +++ b/packages/examples/src/components/PulseCircleLayer.tsx @@ -118,4 +118,7 @@ function PulseCircleLayer({ ); } -export default Animated.createAnimatedComponent(PulseCircleLayer); +const AnimatedPulseCircleLayer = + Animated.createAnimatedComponent(PulseCircleLayer); + +export { AnimatedPulseCircleLayer as PulseCircleLayer }; diff --git a/packages/examples/src/components/TabBarView.tsx b/packages/examples/src/components/TabBarView.tsx index 00280ef71..ae62b2adf 100755 --- a/packages/examples/src/components/TabBarView.tsx +++ b/packages/examples/src/components/TabBarView.tsx @@ -1,7 +1,7 @@ import { type ReactNode, useState } from "react"; import { ButtonGroup } from "./ButtonGroup"; -import MapSafeAreaView from "./MapSafeAreaView"; +import { MapSafeAreaView } from "./MapSafeAreaView"; interface TabBarViewProps { children: ReactNode; @@ -11,7 +11,7 @@ interface TabBarViewProps { defaultValue?: number; } -function TabBarView({ +export function TabBarView({ children, scrollable = false, options, @@ -35,4 +35,3 @@ function TabBarView({ ); } -export default TabBarView; diff --git a/packages/examples/src/examples/Animations/AnimateCircleAlongLine.tsx b/packages/examples/src/examples/Animations/AnimateCircleAlongLine.tsx index 3a7da2590..a1c433f9c 100755 --- a/packages/examples/src/examples/Animations/AnimateCircleAlongLine.tsx +++ b/packages/examples/src/examples/Animations/AnimateCircleAlongLine.tsx @@ -8,9 +8,9 @@ import { } from "@maplibre/maplibre-react-native"; import { useEffect, useState } from "react"; -import PulseCircleLayer from "../../components/PulseCircleLayer"; +import { PulseCircleLayer } from "../../components/PulseCircleLayer"; import { sheet } from "../../styles/sheet"; -import RouteSimulator from "../../utils/RouteSimulator"; +import { RouteSimulator } from "../../utils/RouteSimulator"; const ROUTE_FEATURE: GeoJSON.Feature = { type: "Feature", @@ -43,7 +43,7 @@ const layerStyles: { }, }; -export default function AnimateCircleAlongLine() { +export function AnimateCircleAlongLine() { const [currentPoint, setCurrentPoint] = useState< GeoJSON.Feature diff --git a/packages/examples/src/examples/Animations/AnimatedLine.js b/packages/examples/src/examples/Animations/AnimatedLine.js index 7c773755a..a20642c98 100755 --- a/packages/examples/src/examples/Animations/AnimatedLine.js +++ b/packages/examples/src/examples/Animations/AnimatedLine.js @@ -2,10 +2,10 @@ import { Animated, Camera, MapView } from "@maplibre/maplibre-react-native"; import along from "@turf/along"; import { lineString, point } from "@turf/helpers"; import length from "@turf/length"; -import React from "react"; +import React, { Component } from "react"; import { Button, Easing } from "react-native"; -import Bubble from "../../components/Bubble"; +import { Bubble } from "../../components/Bubble"; import { sheet } from "../../styles/sheet"; const blon = -73.99155; @@ -37,7 +37,7 @@ const styles = { }, }; -class AnimatedLine extends React.Component { +export class AnimatedLine extends Component { constructor(props) { super(props); @@ -272,5 +272,3 @@ class AnimatedLine extends React.Component { ); } } - -export default AnimatedLine; diff --git a/packages/examples/src/examples/Annotations/CustomCallout.tsx b/packages/examples/src/examples/Annotations/CustomCallout.tsx index 5eeb49071..cd7bcda6f 100644 --- a/packages/examples/src/examples/Annotations/CustomCallout.tsx +++ b/packages/examples/src/examples/Annotations/CustomCallout.tsx @@ -11,7 +11,7 @@ import maplibreIcon from "../../assets/images/maplibre.png"; import { FEATURE_COLLECTION } from "../../constants/GEOMETRIES"; import { sheet } from "../../styles/sheet"; -export default function CustomCallout() { +export function CustomCallout() { const [selectedFeature, setSelectedFeature] = useState>(); diff --git a/packages/examples/src/examples/Annotations/Heatmap.tsx b/packages/examples/src/examples/Annotations/Heatmap.tsx index 65e6df547..c237a82bd 100644 --- a/packages/examples/src/examples/Annotations/Heatmap.tsx +++ b/packages/examples/src/examples/Annotations/Heatmap.tsx @@ -6,7 +6,7 @@ import { import { sheet } from "../../styles/sheet"; -export default function Heatmap() { +export function Heatmap() { return ( diff --git a/packages/examples/src/examples/Annotations/PointAnnotationAnchors.js b/packages/examples/src/examples/Annotations/PointAnnotationAnchors.js index 51ec07129..5e65ed143 100644 --- a/packages/examples/src/examples/Annotations/PointAnnotationAnchors.js +++ b/packages/examples/src/examples/Annotations/PointAnnotationAnchors.js @@ -73,7 +73,7 @@ const styles = StyleSheet.create({ }, }); -const PointAnnotationAnchors = () => { +export function PointAnnotationAnchors() { return ( @@ -130,6 +130,4 @@ const PointAnnotationAnchors = () => { })} ); -}; - -export default PointAnnotationAnchors; +} diff --git a/packages/examples/src/examples/Annotations/ShowPointAnnotation.tsx b/packages/examples/src/examples/Annotations/ShowPointAnnotation.tsx index 64f934ffe..2c34c32b6 100755 --- a/packages/examples/src/examples/Annotations/ShowPointAnnotation.tsx +++ b/packages/examples/src/examples/Annotations/ShowPointAnnotation.tsx @@ -17,7 +17,7 @@ import { View, } from "react-native"; -import Bubble from "../../components/Bubble"; +import { Bubble } from "../../components/Bubble"; import { sheet } from "../../styles/sheet"; const ANNOTATION_SIZE = 40; @@ -83,7 +83,7 @@ const AnnotationWithRemoteImage = ({ ); }; -const ShowPointAnnotation = () => { +export function ShowPointAnnotation() { const [coordinates, setCoordinates] = useState([[-73.99155, 40.73581]]); const [layerRendering, setLayerRendering] = useState<"below" | "above">( "below", @@ -191,6 +191,4 @@ const ShowPointAnnotation = () => { ); -}; - -export default ShowPointAnnotation; +} diff --git a/packages/examples/src/examples/BugReport.tsx b/packages/examples/src/examples/BugReport.tsx index fdedeffdc..6708317fa 100644 --- a/packages/examples/src/examples/BugReport.tsx +++ b/packages/examples/src/examples/BugReport.tsx @@ -2,7 +2,7 @@ import { MapView } from "@maplibre/maplibre-react-native"; import { sheet } from "../styles/sheet"; -export default function BugReport() { +export function BugReport() { return ( {/* Reproduce your Bug here! */} diff --git a/packages/examples/src/examples/CacheManagement.js b/packages/examples/src/examples/CacheManagement.js index 09576a5f9..35bbe1fe3 100755 --- a/packages/examples/src/examples/CacheManagement.js +++ b/packages/examples/src/examples/CacheManagement.js @@ -1,5 +1,5 @@ -import { MapView, offlineManager } from "@maplibre/maplibre-react-native"; -import React from "react"; +import { MapView, OfflineManager } from "@maplibre/maplibre-react-native"; +import React, { Component } from "react"; import { Alert, StyleSheet, @@ -44,29 +44,29 @@ const styles = StyleSheet.create({ }, }); -class CacheManagement extends React.Component { +export class CacheManagement extends Component { state = { cacheSize: "", }; invalidateAmbientCache = async () => { - await offlineManager.invalidateAmbientCache(); + await OfflineManager.invalidateAmbientCache(); Alert.alert("Ambient cache successfully invalidated"); }; resetDatabase = async () => { - await offlineManager.resetDatabase(); + await OfflineManager.resetDatabase(); Alert.alert("Database successfully reset"); }; clearAmbientCache = async () => { - await offlineManager.clearAmbientCache(); + await OfflineManager.clearAmbientCache(); Alert.alert("Ambient cache successfully cleared"); }; setMaximumAmbientCacheSize = async () => { const newMaxSize = parseInt(this.state.cacheSize, 10); - await offlineManager.setMaximumAmbientCacheSize(newMaxSize); + await OfflineManager.setMaximumAmbientCacheSize(newMaxSize); Alert.alert(`Max cache size successfully set to ${newMaxSize} bytes`); }; @@ -135,5 +135,3 @@ class CacheManagement extends React.Component { ); } } - -export default CacheManagement; diff --git a/packages/examples/src/examples/Camera/CompassView.js b/packages/examples/src/examples/Camera/CompassView.js index 25fb58608..4b20bd10b 100644 --- a/packages/examples/src/examples/Camera/CompassView.js +++ b/packages/examples/src/examples/Camera/CompassView.js @@ -3,7 +3,7 @@ import React from "react"; import { sheet } from "../../styles/sheet"; -function CompassView() { +export function CompassView() { return ( ); } - -export default CompassView; diff --git a/packages/examples/src/examples/Camera/Fit.js b/packages/examples/src/examples/Camera/Fit.js index 29666032f..4393ead25 100755 --- a/packages/examples/src/examples/Camera/Fit.js +++ b/packages/examples/src/examples/Camera/Fit.js @@ -1,6 +1,6 @@ import { Camera, MapView, StyleURL } from "@maplibre/maplibre-react-native"; import { isEqual } from "lodash"; -import React from "react"; +import React, { Component } from "react"; import { ScrollView, Text, TouchableOpacity, View } from "react-native"; import { @@ -24,7 +24,7 @@ const paddingZero = buildPadding(); const paddingTop = buildPadding([200, 40, 40, 40]); const paddingBottom = buildPadding([40, 40, 200, 40]); -class Fit extends React.Component { +export class Fit extends Component { constructor(props) { super(props); @@ -266,5 +266,3 @@ class Fit extends React.Component { ); } } - -export default Fit; diff --git a/packages/examples/src/examples/Camera/FlyTo.js b/packages/examples/src/examples/Camera/FlyTo.js index c5064ce96..8ffb6e967 100755 --- a/packages/examples/src/examples/Camera/FlyTo.js +++ b/packages/examples/src/examples/Camera/FlyTo.js @@ -1,15 +1,15 @@ import { Camera, MapView, UserLocation } from "@maplibre/maplibre-react-native"; -import React from "react"; +import React, { Component } from "react"; import { Alert } from "react-native"; -import TabBarView from "../../components/TabBarView"; +import { TabBarView } from "../../components/TabBarView"; import { EU_CENTER_COORDINATES, US_CENTER_COORDINATES, } from "../../constants/GEOMETRIES"; import { sheet } from "../../styles/sheet"; -class FlyTo extends React.Component { +export class FlyTo extends Component { static ZERO_ZERO = [0, 0]; static ZERO_TEN = [0, 10]; static TEN_ZERO = [10, 0]; @@ -62,5 +62,3 @@ class FlyTo extends React.Component { ); } } - -export default FlyTo; diff --git a/packages/examples/src/examples/Camera/GetCenter.js b/packages/examples/src/examples/Camera/GetCenter.js index d7f6ee42b..31464e8be 100755 --- a/packages/examples/src/examples/Camera/GetCenter.js +++ b/packages/examples/src/examples/Camera/GetCenter.js @@ -1,14 +1,14 @@ import { Camera, MapView } from "@maplibre/maplibre-react-native"; -import React from "react"; +import React, { Component } from "react"; import { Text } from "react-native"; -import Bubble from "../../components/Bubble"; +import { Bubble } from "../../components/Bubble"; const styles = { mapView: { flex: 1 }, }; -class GetCenter extends React.Component { +export class GetCenter extends Component { constructor(props) { super(props); @@ -57,5 +57,3 @@ class GetCenter extends React.Component { ); } } - -export default GetCenter; diff --git a/packages/examples/src/examples/Camera/GetZoom.tsx b/packages/examples/src/examples/Camera/GetZoom.tsx index d86119d0d..29ad0eb6e 100755 --- a/packages/examples/src/examples/Camera/GetZoom.tsx +++ b/packages/examples/src/examples/Camera/GetZoom.tsx @@ -2,10 +2,10 @@ import { MapView, type MapViewRef } from "@maplibre/maplibre-react-native"; import { useRef, useState } from "react"; import { Text } from "react-native"; -import Bubble from "../../components/Bubble"; +import { Bubble } from "../../components/Bubble"; import { sheet } from "../../styles/sheet"; -export default function GetZoom() { +export function GetZoom() { const [zoom, setZoom] = useState(); const mapViewRef = useRef(null); diff --git a/packages/examples/src/examples/Camera/RestrictMapBounds.tsx b/packages/examples/src/examples/Camera/RestrictMapBounds.tsx index 53a2af267..817364815 100644 --- a/packages/examples/src/examples/Camera/RestrictMapBounds.tsx +++ b/packages/examples/src/examples/Camera/RestrictMapBounds.tsx @@ -17,7 +17,7 @@ const POLYGON = bboxPolygon([ EU_BOUNDS.ne[1], ]); -export default function RestrictMapBounds() { +export function RestrictMapBounds() { return ( diff --git a/packages/examples/src/examples/Camera/SetHeading.js b/packages/examples/src/examples/Camera/SetHeading.js index 64c8a4a69..43a26e8fb 100755 --- a/packages/examples/src/examples/Camera/SetHeading.js +++ b/packages/examples/src/examples/Camera/SetHeading.js @@ -1,15 +1,15 @@ import { Camera, - locationManager, + LocationManager, MapView, UserLocation, } from "@maplibre/maplibre-react-native"; -import React from "react"; +import React, { Component } from "react"; -import TabBarView from "../../components/TabBarView"; +import { TabBarView } from "../../components/TabBarView"; import { sheet } from "../../styles/sheet"; -class SetHeading extends React.Component { +export class SetHeading extends Component { constructor(props) { super(props); @@ -30,7 +30,7 @@ class SetHeading extends React.Component { } componentDidMount() { - locationManager.start(); + LocationManager.start(); } componentDidUpdate() { @@ -40,7 +40,7 @@ class SetHeading extends React.Component { } componentWillUnmount() { - locationManager.stop(); + LocationManager.stop(); } onHeadingChange(index, heading) { @@ -62,5 +62,3 @@ class SetHeading extends React.Component { ); } } - -export default SetHeading; diff --git a/packages/examples/src/examples/Camera/SetPitch.js b/packages/examples/src/examples/Camera/SetPitch.js index 076cd8482..867fcb0ab 100755 --- a/packages/examples/src/examples/Camera/SetPitch.js +++ b/packages/examples/src/examples/Camera/SetPitch.js @@ -1,15 +1,15 @@ import { Camera, - locationManager, + LocationManager, MapView, UserLocation, } from "@maplibre/maplibre-react-native"; -import React from "react"; +import React, { Component } from "react"; -import TabBarView from "../../components/TabBarView"; +import { TabBarView } from "../../components/TabBarView"; import { sheet } from "../../styles/sheet"; -class SetPitch extends React.Component { +export class SetPitch extends Component { constructor(props) { super(props); @@ -29,11 +29,11 @@ class SetPitch extends React.Component { } componentDidMount() { - locationManager.start(); + LocationManager.start(); } componentWillUnmount() { - locationManager.stop(); + LocationManager.stop(); } onUpdatePitch(index, pitch) { @@ -55,5 +55,3 @@ class SetPitch extends React.Component { ); } } - -export default SetPitch; diff --git a/packages/examples/src/examples/Camera/TakeSnapshot.js b/packages/examples/src/examples/Camera/TakeSnapshot.js index 02d4e9343..6fb3142c3 100755 --- a/packages/examples/src/examples/Camera/TakeSnapshot.js +++ b/packages/examples/src/examples/Camera/TakeSnapshot.js @@ -1,5 +1,5 @@ -import { snapshotManager, StyleURL } from "@maplibre/maplibre-react-native"; -import React from "react"; +import { SnapshotManager, StyleURL } from "@maplibre/maplibre-react-native"; +import React, { Component } from "react"; import { ActivityIndicator, Dimensions, @@ -20,7 +20,7 @@ const styles = StyleSheet.create({ spinnerContainer: { alignItems: "center", flex: 1, justifyContent: "center" }, }); -class TakeSnapshot extends React.Component { +export class TakeSnapshot extends Component { constructor(props) { super(props); @@ -36,7 +36,7 @@ class TakeSnapshot extends React.Component { async takeSnapshot() { const { width, height } = Dimensions.get("window"); - const uri = await snapshotManager.takeSnap({ + const uri = await SnapshotManager.takeSnap({ centerCoordinate: [-74.12641, 40.797968], width, height, @@ -71,5 +71,3 @@ class TakeSnapshot extends React.Component { } } } - -export default TakeSnapshot; diff --git a/packages/examples/src/examples/Camera/TakeSnapshotWithMap.js b/packages/examples/src/examples/Camera/TakeSnapshotWithMap.js index b1d7975f8..d31ec5f14 100755 --- a/packages/examples/src/examples/Camera/TakeSnapshotWithMap.js +++ b/packages/examples/src/examples/Camera/TakeSnapshotWithMap.js @@ -1,5 +1,5 @@ import { Camera, MapView } from "@maplibre/maplibre-react-native"; -import React from "react"; +import React, { Component } from "react"; import { Image, StyleSheet, Text, TouchableOpacity, View } from "react-native"; import { colors } from "../../styles/colors"; @@ -20,7 +20,7 @@ const styles = StyleSheet.create({ mapContainer: { flex: 1 }, }); -class TakeSnapshotWithMap extends React.Component { +export class TakeSnapshotWithMap extends Component { constructor(props) { super(props); @@ -66,5 +66,3 @@ class TakeSnapshotWithMap extends React.Component { ); } } - -export default TakeSnapshotWithMap; diff --git a/packages/examples/src/examples/Camera/YoYo.tsx b/packages/examples/src/examples/Camera/YoYo.tsx index 472908911..fefb2b172 100755 --- a/packages/examples/src/examples/Camera/YoYo.tsx +++ b/packages/examples/src/examples/Camera/YoYo.tsx @@ -3,7 +3,7 @@ import { useEffect, useState } from "react"; import { sheet } from "../../styles/sheet"; -export default function YoYo() { +export function YoYo() { const [zoomLevel, setZoomLevel] = useState(2); useEffect(() => { diff --git a/packages/examples/src/examples/FillRasterLayer/CustomVectorSource.tsx b/packages/examples/src/examples/FillRasterLayer/CustomVectorSource.tsx index e5e6622f8..b47f10e09 100755 --- a/packages/examples/src/examples/FillRasterLayer/CustomVectorSource.tsx +++ b/packages/examples/src/examples/FillRasterLayer/CustomVectorSource.tsx @@ -6,10 +6,10 @@ import { import { useRef, useState } from "react"; import { Text } from "react-native"; -import Bubble from "../../components/Bubble"; +import { Bubble } from "../../components/Bubble"; import { sheet } from "../../styles/sheet"; -export default function CustomVectorSource() { +export function CustomVectorSource() { const vectorSourceRef = useRef(); const [featuresCount, setFeaturesCount] = useState(); diff --git a/packages/examples/src/examples/FillRasterLayer/GeoJSONSource.tsx b/packages/examples/src/examples/FillRasterLayer/GeoJSONSource.tsx index 334f09c4b..b45746060 100755 --- a/packages/examples/src/examples/FillRasterLayer/GeoJSONSource.tsx +++ b/packages/examples/src/examples/FillRasterLayer/GeoJSONSource.tsx @@ -11,7 +11,7 @@ import smileyFeatureCollection from "../../assets/geojson/smiley.json"; import gridPattern from "../../assets/images/maplibre.png"; import { sheet } from "../../styles/sheet"; -export default function GeoJSONSource() { +export function GeoJSONSource() { return ( diff --git a/packages/examples/src/examples/FillRasterLayer/ImageOverlay.tsx b/packages/examples/src/examples/FillRasterLayer/ImageOverlay.tsx index dd8b67dd8..2efb1349a 100755 --- a/packages/examples/src/examples/FillRasterLayer/ImageOverlay.tsx +++ b/packages/examples/src/examples/FillRasterLayer/ImageOverlay.tsx @@ -30,7 +30,7 @@ const COORDINATES: [ [-80.425, 37.936], // bottom left ]; -export default function ImageOverlay() { +export function ImageOverlay() { const [index, setIndex] = useState(0); useEffect(() => { diff --git a/packages/examples/src/examples/FillRasterLayer/IndoorBuilding.tsx b/packages/examples/src/examples/FillRasterLayer/IndoorBuilding.tsx index 1f0dc0bf3..be689d7eb 100755 --- a/packages/examples/src/examples/FillRasterLayer/IndoorBuilding.tsx +++ b/packages/examples/src/examples/FillRasterLayer/IndoorBuilding.tsx @@ -9,7 +9,7 @@ import { import { useState } from "react"; import indoor3DFeatureCollection from "../../assets/geojson/indoor-3d.json"; -import TabBarView from "../../components/TabBarView"; +import { TabBarView } from "../../components/TabBarView"; import { sheet } from "../../styles/sheet"; const OPTIONS = [-180, -90, 0, 90, 180]; @@ -24,7 +24,7 @@ const layerStyles: { building: FillExtrusionLayerStyle } = { }, }; -export default function IndoorBuilding() { +export function IndoorBuilding() { const [value, setValue] = useState(-90); return ( diff --git a/packages/examples/src/examples/FillRasterLayer/OpenStreetMapRasterTiles.tsx b/packages/examples/src/examples/FillRasterLayer/OpenStreetMapRasterTiles.tsx index 7fa0d3891..0f546e753 100755 --- a/packages/examples/src/examples/FillRasterLayer/OpenStreetMapRasterTiles.tsx +++ b/packages/examples/src/examples/FillRasterLayer/OpenStreetMapRasterTiles.tsx @@ -5,14 +5,14 @@ import { } from "@maplibre/maplibre-react-native"; import { useState } from "react"; -import TabBarView from "../../components/TabBarView"; +import { TabBarView } from "../../components/TabBarView"; import { OSM_RASTER_STYLE } from "../../constants/OSM_RASTER_STYLE"; import { sheet } from "../../styles/sheet"; const OPTIONS = [0, 0.25, 0.5, 0.75, 1]; const DEFAULT_OPTION = 4; -export default function OpenStreetMapRasterTiles() { +export function OpenStreetMapRasterTiles() { const [value, setValue] = useState(OPTIONS[DEFAULT_OPTION]); return ( diff --git a/packages/examples/src/examples/FillRasterLayer/QueryAtPoint.js b/packages/examples/src/examples/FillRasterLayer/QueryAtPoint.js index 27f80edaa..32ab24c33 100755 --- a/packages/examples/src/examples/FillRasterLayer/QueryAtPoint.js +++ b/packages/examples/src/examples/FillRasterLayer/QueryAtPoint.js @@ -5,11 +5,11 @@ import { ShapeSource, StyleURL, } from "@maplibre/maplibre-react-native"; -import React from "react"; +import React, { Component } from "react"; import { Text } from "react-native"; import newYorkCityDistrictsFeatureCollection from "../../assets/geojson/new-york-city-districts.json"; -import Bubble from "../../components/Bubble"; +import { Bubble } from "../../components/Bubble"; import { sheet } from "../../styles/sheet"; const styles = { @@ -26,7 +26,7 @@ const styles = { }, }; -class QueryAtPoint extends React.Component { +export class QueryAtPoint extends Component { constructor(props) { super(props); this.state = this.emptyState; @@ -89,5 +89,3 @@ class QueryAtPoint extends React.Component { ); } } - -export default QueryAtPoint; diff --git a/packages/examples/src/examples/FillRasterLayer/QueryWithRect.js b/packages/examples/src/examples/FillRasterLayer/QueryWithRect.js index a5dcf0692..75141abbb 100755 --- a/packages/examples/src/examples/FillRasterLayer/QueryWithRect.js +++ b/packages/examples/src/examples/FillRasterLayer/QueryWithRect.js @@ -5,11 +5,11 @@ import { ShapeSource, StyleURL, } from "@maplibre/maplibre-react-native"; -import React from "react"; +import React, { Component } from "react"; import { Text } from "react-native"; import newYorkCityDistrictsFeatureCollection from "../../assets/geojson/new-york-city-districts.json"; -import Bubble from "../../components/Bubble"; +import { Bubble } from "../../components/Bubble"; import { sheet } from "../../styles/sheet"; const styles = { @@ -27,7 +27,7 @@ const styles = { bubbleText: { textAlign: "center" }, }; -class QueryWithRect extends React.Component { +export class QueryWithRect extends Component { constructor(props) { super(props); @@ -110,5 +110,3 @@ class QueryWithRect extends React.Component { ); } } - -export default QueryWithRect; diff --git a/packages/examples/src/examples/LineLayer/GradientLine.js b/packages/examples/src/examples/LineLayer/GradientLine.js index 986c9b9a6..db0522ce7 100644 --- a/packages/examples/src/examples/LineLayer/GradientLine.js +++ b/packages/examples/src/examples/LineLayer/GradientLine.js @@ -4,7 +4,7 @@ import { MapView, ShapeSource, } from "@maplibre/maplibre-react-native"; -import React from "react"; +import React, { Component } from "react"; import { sheet } from "../../styles/sheet"; @@ -34,7 +34,7 @@ const styles = { }, }; -class GradientLine extends React.Component { +export class GradientLine extends Component { render() { return ( @@ -74,5 +74,3 @@ class GradientLine extends React.Component { ); } } - -export default GradientLine; diff --git a/packages/examples/src/examples/Map/ChangeLayerColor.js b/packages/examples/src/examples/Map/ChangeLayerColor.js index dec9ed1e5..6d30b0f5f 100644 --- a/packages/examples/src/examples/Map/ChangeLayerColor.js +++ b/packages/examples/src/examples/Map/ChangeLayerColor.js @@ -3,10 +3,10 @@ import { Camera, MapView, } from "@maplibre/maplibre-react-native"; -import React from "react"; +import React, { Component } from "react"; import { Text } from "react-native"; -import Bubble from "../../components/Bubble"; +import { Bubble } from "../../components/Bubble"; const defaultCamera = { centerCoordinate: [12.338, 45.4385], @@ -17,7 +17,7 @@ const styles = { mapView: { flex: 1 }, }; -class ChangeLayerColor extends React.Component { +export class ChangeLayerColor extends Component { state = { backgroundColor: "", }; @@ -48,5 +48,3 @@ class ChangeLayerColor extends React.Component { ); } } - -export default ChangeLayerColor; diff --git a/packages/examples/src/examples/Map/CreateOfflineRegion.tsx b/packages/examples/src/examples/Map/CreateOfflineRegion.tsx index aaea51209..0e5214515 100755 --- a/packages/examples/src/examples/Map/CreateOfflineRegion.tsx +++ b/packages/examples/src/examples/Map/CreateOfflineRegion.tsx @@ -2,7 +2,7 @@ import geoViewport from "@mapbox/geo-viewport"; import { Camera, MapView, - offlineManager, + OfflineManager, OfflinePack, OfflinePackDownloadState, type OfflinePackError, @@ -18,7 +18,7 @@ import { View, } from "react-native"; -import Bubble from "../../components/Bubble"; +import { Bubble } from "../../components/Bubble"; import { AMERICANA_VECTOR_STYLE } from "../../constants/AMERICANA_VECTOR_STYLE"; import { sheet } from "../../styles/sheet"; @@ -71,7 +71,7 @@ function getRegionDownloadState(downloadState: CustomOfflinePackDownloadState) { } } -export default function CreateOfflineRegion() { +export function CreateOfflineRegion() { const [offlineRegionStatus, setOfflineRegionStatus] = useState(null); const [offlinePack, setOfflinePack] = useState(null); @@ -79,7 +79,7 @@ export default function CreateOfflineRegion() { useEffect(() => { return () => { - offlineManager.unsubscribe(PACK_NAME); + OfflineManager.unsubscribe(PACK_NAME); }; }, []); @@ -116,12 +116,12 @@ export default function CreateOfflineRegion() { }; // start download - offlineManager.createPack(options, onDownloadProgress, onDownloadError); + OfflineManager.createPack(options, onDownloadProgress, onDownloadError); } async function onDidFinishLoadingStyle() { try { - const pack = await offlineManager.getPack(PACK_NAME); + const pack = await OfflineManager.getPack(PACK_NAME); if (!pack) { return; @@ -157,7 +157,7 @@ export default function CreateOfflineRegion() { return; } - await offlineManager.deletePack(PACK_NAME); + await OfflineManager.deletePack(PACK_NAME); setOfflinePack(null); setOfflineRegionStatus(null); diff --git a/packages/examples/src/examples/Map/LocalStyleJSON.tsx b/packages/examples/src/examples/Map/LocalStyleJSON.tsx index ab75bc8bd..91144d624 100644 --- a/packages/examples/src/examples/Map/LocalStyleJSON.tsx +++ b/packages/examples/src/examples/Map/LocalStyleJSON.tsx @@ -4,10 +4,10 @@ import { Text } from "react-native"; import MapLibreDemoTilesBlue from "../../assets/styles/maplibre-demo-tiles-blue.json"; import MapLibreDemoTilesWhite from "../../assets/styles/maplibre-demo-tiles-white.json"; -import Bubble from "../../components/Bubble"; +import { Bubble } from "../../components/Bubble"; import { sheet } from "../../styles/sheet"; -export default function LocalStyleJSON() { +export function LocalStyleJSON() { const [color, setColor] = useState<"blue" | "white">("blue"); return ( diff --git a/packages/examples/src/examples/Map/PointInMapView.js b/packages/examples/src/examples/Map/PointInMapView.js index 7e4b0c7ed..a897dcd89 100755 --- a/packages/examples/src/examples/Map/PointInMapView.js +++ b/packages/examples/src/examples/Map/PointInMapView.js @@ -1,14 +1,14 @@ import { Camera, MapView } from "@maplibre/maplibre-react-native"; -import React from "react"; +import React, { Component } from "react"; import { Text } from "react-native"; -import Bubble from "../../components/Bubble"; +import { Bubble } from "../../components/Bubble"; const styles = { mapView: { flex: 1 }, }; -class PointInMapView extends React.Component { +export class PointInMapView extends Component { constructor(props) { super(props); @@ -51,5 +51,3 @@ class PointInMapView extends React.Component { ); } } - -export default PointInMapView; diff --git a/packages/examples/src/examples/Map/SetTintColor.tsx b/packages/examples/src/examples/Map/SetTintColor.tsx index 073c3b597..6de8f88d3 100644 --- a/packages/examples/src/examples/Map/SetTintColor.tsx +++ b/packages/examples/src/examples/Map/SetTintColor.tsx @@ -6,7 +6,7 @@ import { } from "@maplibre/maplibre-react-native"; import { useState } from "react"; -import TabBarView from "../../components/TabBarView"; +import { TabBarView } from "../../components/TabBarView"; import { sheet } from "../../styles/sheet"; const OPTIONS = ["red", "yellow", "green"].map((data) => ({ @@ -14,7 +14,7 @@ const OPTIONS = ["red", "yellow", "green"].map((data) => ({ data, })); -export default function SetTintColor() { +export function SetTintColor() { const [tintColor, setTintColor] = useState(OPTIONS[0]!.data); return ( diff --git a/packages/examples/src/examples/Map/ShowAndHideLayer.js b/packages/examples/src/examples/Map/ShowAndHideLayer.js index 7ce8dde22..4509b7624 100644 --- a/packages/examples/src/examples/Map/ShowAndHideLayer.js +++ b/packages/examples/src/examples/Map/ShowAndHideLayer.js @@ -1,8 +1,8 @@ import { Camera, FillLayer, MapView } from "@maplibre/maplibre-react-native"; -import React from "react"; +import React, { Component } from "react"; import { Text } from "react-native"; -import Bubble from "../../components/Bubble"; +import { Bubble } from "../../components/Bubble"; const defaultCamera = { centerCoordinate: [-77.036532, 38.897318], @@ -13,7 +13,7 @@ const styles = { mapView: { flex: 1 }, }; -class ShowAndHideLayer extends React.Component { +export class ShowAndHideLayer extends Component { state = { show: true, }; @@ -45,5 +45,3 @@ class ShowAndHideLayer extends React.Component { ); } } - -export default ShowAndHideLayer; diff --git a/packages/examples/src/examples/Map/ShowClick.js b/packages/examples/src/examples/Map/ShowClick.js index f69d7d38f..b0261172d 100755 --- a/packages/examples/src/examples/Map/ShowClick.js +++ b/packages/examples/src/examples/Map/ShowClick.js @@ -1,11 +1,11 @@ import { MapView } from "@maplibre/maplibre-react-native"; -import React from "react"; +import React, { Component } from "react"; import { Text } from "react-native"; -import Bubble from "../../components/Bubble"; +import { Bubble } from "../../components/Bubble"; import { sheet } from "../../styles/sheet"; -class ShowClick extends React.Component { +export class ShowClick extends Component { constructor(props) { super(props); @@ -65,5 +65,3 @@ class ShowClick extends React.Component { ); } } - -export default ShowClick; diff --git a/packages/examples/src/examples/Map/ShowMap.tsx b/packages/examples/src/examples/Map/ShowMap.tsx index 9338f5dae..1a314d1f3 100755 --- a/packages/examples/src/examples/Map/ShowMap.tsx +++ b/packages/examples/src/examples/Map/ShowMap.tsx @@ -2,6 +2,6 @@ import { MapView } from "@maplibre/maplibre-react-native"; import { sheet } from "../../styles/sheet"; -export default function ShowMap() { +export function ShowMap() { return ; } diff --git a/packages/examples/src/examples/Map/ShowRegionDidChange.js b/packages/examples/src/examples/Map/ShowRegionDidChange.js index 79916fb4a..02baf7015 100644 --- a/packages/examples/src/examples/Map/ShowRegionDidChange.js +++ b/packages/examples/src/examples/Map/ShowRegionDidChange.js @@ -1,9 +1,9 @@ import { Camera, MapView } from "@maplibre/maplibre-react-native"; -import React from "react"; +import React, { Component } from "react"; import { Text } from "react-native"; -import Bubble from "../../components/Bubble"; -import TabBarView from "../../components/TabBarView"; +import { Bubble } from "../../components/Bubble"; +import { TabBarView } from "../../components/TabBarView"; import { EU_BOUNDS, EU_CENTER_COORDINATES } from "../../constants/GEOMETRIES"; import { sheet } from "../../styles/sheet"; @@ -18,7 +18,7 @@ const isValidCoordinate = (geometry) => { return geometry.coordinates[0] !== 0 && geometry.coordinates[1] !== 0; }; -class ShowRegionDidChange extends React.Component { +export class ShowRegionDidChange extends Component { constructor(props) { super(props); @@ -142,5 +142,3 @@ class ShowRegionDidChange extends React.Component { ); } } - -export default ShowRegionDidChange; diff --git a/packages/examples/src/examples/Map/SourceLayerVisibility.tsx b/packages/examples/src/examples/Map/SourceLayerVisibility.tsx index 8bce3fbc9..a92f4208b 100755 --- a/packages/examples/src/examples/Map/SourceLayerVisibility.tsx +++ b/packages/examples/src/examples/Map/SourceLayerVisibility.tsx @@ -2,10 +2,10 @@ import { MapView, type MapViewRef } from "@maplibre/maplibre-react-native"; import { useRef, useState } from "react"; import { Text } from "react-native"; -import Bubble from "../../components/Bubble"; +import { Bubble } from "../../components/Bubble"; import { sheet } from "../../styles/sheet"; -export default function SourceLayerVisibility() { +export function SourceLayerVisibility() { const mapViewRef = useRef(null); const [visible, setVisible] = useState(true); diff --git a/packages/examples/src/examples/Map/TwoMapViews.tsx b/packages/examples/src/examples/Map/TwoMapViews.tsx index 807a9189a..642e6a22b 100755 --- a/packages/examples/src/examples/Map/TwoMapViews.tsx +++ b/packages/examples/src/examples/Map/TwoMapViews.tsx @@ -21,7 +21,7 @@ const layerStyles = { }, }; -export default function TwoMapViews() { +export function TwoMapViews() { return ( <> {[layerStyles.smileyFaceDark, layerStyles.smileyFaceLight].map( diff --git a/packages/examples/src/examples/SymbolCircleLayer/CustomIcon.js b/packages/examples/src/examples/SymbolCircleLayer/CustomIcon.js index cf3fce73c..e8aadf38c 100755 --- a/packages/examples/src/examples/SymbolCircleLayer/CustomIcon.js +++ b/packages/examples/src/examples/SymbolCircleLayer/CustomIcon.js @@ -4,11 +4,11 @@ import { SymbolLayer, } from "@maplibre/maplibre-react-native"; import { feature, featureCollection } from "@turf/helpers"; -import React from "react"; +import React, { Component } from "react"; import { Text } from "react-native"; import maplibreIcon from "../../assets/images/maplibre.png"; -import Bubble from "../../components/Bubble"; +import { Bubble } from "../../components/Bubble"; import { sheet } from "../../styles/sheet"; const styles = { @@ -18,7 +18,7 @@ const styles = { }, }; -class CustomIcon extends React.Component { +export class CustomIcon extends Component { constructor(props) { super(props); @@ -76,5 +76,3 @@ class CustomIcon extends React.Component { ); } } - -export default CustomIcon; diff --git a/packages/examples/src/examples/SymbolCircleLayer/DataDrivenCircleColors.js b/packages/examples/src/examples/SymbolCircleLayer/DataDrivenCircleColors.js index aea934103..fb00c6cb4 100755 --- a/packages/examples/src/examples/SymbolCircleLayer/DataDrivenCircleColors.js +++ b/packages/examples/src/examples/SymbolCircleLayer/DataDrivenCircleColors.js @@ -5,7 +5,7 @@ import { StyleURL, VectorSource, } from "@maplibre/maplibre-react-native"; -import React from "react"; +import React, { memo } from "react"; import { sheet } from "../../styles/sheet"; @@ -57,4 +57,5 @@ function DataDrivenCircleColors() { ); } -export default React.memo(DataDrivenCircleColors); +const MemoDataDrivenCircleColors = memo(DataDrivenCircleColors); +export { MemoDataDrivenCircleColors as DataDrivenCircleColors }; diff --git a/packages/examples/src/examples/SymbolCircleLayer/Earthquakes.tsx b/packages/examples/src/examples/SymbolCircleLayer/Earthquakes.tsx index 31eb47b5e..6663b0fe6 100755 --- a/packages/examples/src/examples/SymbolCircleLayer/Earthquakes.tsx +++ b/packages/examples/src/examples/SymbolCircleLayer/Earthquakes.tsx @@ -121,7 +121,7 @@ const mag3 = ["all", [">=", ["get", "mag"], 3], ["<", ["get", "mag"], 4]]; const mag4 = ["all", [">=", ["get", "mag"], 4], ["<", ["get", "mag"], 5]]; const mag5 = [">=", ["get", "mag"], 5]; -export default function Earthquakes() { +export function Earthquakes() { const shapeSource = useRef(null); const [cluster, setCluster] = useState(); diff --git a/packages/examples/src/examples/SymbolCircleLayer/ShapeSourceIcon.tsx b/packages/examples/src/examples/SymbolCircleLayer/ShapeSourceIcon.tsx index e8cc8e0e0..cce802490 100755 --- a/packages/examples/src/examples/SymbolCircleLayer/ShapeSourceIcon.tsx +++ b/packages/examples/src/examples/SymbolCircleLayer/ShapeSourceIcon.tsx @@ -10,7 +10,7 @@ import maplibreIcon from "../../assets/images/maplibre.png"; import { FEATURE_COLLECTION } from "../../constants/GEOMETRIES"; import { sheet } from "../../styles/sheet"; -export default function ShapeSourceIcon() { +export function ShapeSourceIcon() { const [images, setImages] = useState({ [FEATURE_COLLECTION.features[0]!.properties.name]: maplibreIcon, }); diff --git a/packages/examples/src/examples/UserLocation/FollowUserLocationAlignment.tsx b/packages/examples/src/examples/UserLocation/FollowUserLocationAlignment.tsx index 50118199e..de4f13a37 100755 --- a/packages/examples/src/examples/UserLocation/FollowUserLocationAlignment.tsx +++ b/packages/examples/src/examples/UserLocation/FollowUserLocationAlignment.tsx @@ -1,7 +1,7 @@ import { Camera, MapView, UserLocation } from "@maplibre/maplibre-react-native"; import { useState } from "react"; -import TabBarView from "../../components/TabBarView"; +import { TabBarView } from "../../components/TabBarView"; import { sheet } from "../../styles/sheet"; enum Alignment { @@ -15,7 +15,7 @@ const INSETS: Record = { [Alignment.Bottom]: [300, 0, 0, 0], }; -export default function FollowUserLocationAlignment() { +export function FollowUserLocationAlignment() { const [alignment, setAlignment] = useState(Alignment.Center); return ( diff --git a/packages/examples/src/examples/UserLocation/FollowUserLocationRenderMode.tsx b/packages/examples/src/examples/UserLocation/FollowUserLocationRenderMode.tsx index 8d86ff7dd..31fa7e727 100755 --- a/packages/examples/src/examples/UserLocation/FollowUserLocationRenderMode.tsx +++ b/packages/examples/src/examples/UserLocation/FollowUserLocationRenderMode.tsx @@ -10,7 +10,7 @@ import { type ReactNode, useState } from "react"; import { Button, Platform, Text, View } from "react-native"; import { ButtonGroup } from "../../components/ButtonGroup"; -import MapSafeAreaView from "../../components/MapSafeAreaView"; +import { MapSafeAreaView } from "../../components/MapSafeAreaView"; import { OSM_RASTER_STYLE } from "../../constants/OSM_RASTER_STYLE"; import { sheet } from "../../styles/sheet"; @@ -46,7 +46,7 @@ const ANDROID_RENDER_MODES: ("normal" | "compass" | "gps")[] = [ "gps", ]; -export default function FollowUserLocationRenderMode() { +export function FollowUserLocationRenderMode() { const [renderMode, setRenderMode] = useState( ExampleRenderMode.Normal, ); diff --git a/packages/examples/src/examples/UserLocation/SetAndroidPreferredFramesPerSecond.tsx b/packages/examples/src/examples/UserLocation/SetAndroidPreferredFramesPerSecond.tsx index f287fd843..8e1c49342 100644 --- a/packages/examples/src/examples/UserLocation/SetAndroidPreferredFramesPerSecond.tsx +++ b/packages/examples/src/examples/UserLocation/SetAndroidPreferredFramesPerSecond.tsx @@ -1,25 +1,25 @@ import { Camera, - locationManager, + LocationManager, MapView, UserLocation, } from "@maplibre/maplibre-react-native"; import { useEffect, useState } from "react"; -import TabBarView from "../../components/TabBarView"; +import { TabBarView } from "../../components/TabBarView"; import { sheet } from "../../styles/sheet"; const OPTIONS = [5, 10, 15].map((data) => ({ label: data + " FPS", data })); -export default function SetAndroidPreferredFramesPerSecond() { +export function SetAndroidPreferredFramesPerSecond() { const [androidPreferredFramesPerSecond, setAndroidPreferredFramesPerSecond] = useState(OPTIONS[0]?.data); useEffect(() => { - locationManager.start(); + LocationManager.start(); return () => { - locationManager.stop(); + LocationManager.stop(); }; }, []); diff --git a/packages/examples/src/examples/UserLocation/UserLocationDisplacement.tsx b/packages/examples/src/examples/UserLocation/UserLocationDisplacement.tsx index b0ea33853..fd00d3fc9 100644 --- a/packages/examples/src/examples/UserLocation/UserLocationDisplacement.tsx +++ b/packages/examples/src/examples/UserLocation/UserLocationDisplacement.tsx @@ -1,25 +1,25 @@ import { Camera, - locationManager, + LocationManager, MapView, UserLocation, UserTrackingMode, } from "@maplibre/maplibre-react-native"; import { useEffect, useState } from "react"; -import TabBarView from "../../components/TabBarView"; +import { TabBarView } from "../../components/TabBarView"; import { sheet } from "../../styles/sheet"; const OPTIONS = [0, 5, 10].map((data) => ({ label: data + " Meter", data })); -export default function UserLocationDisplacement() { +export function UserLocationDisplacement() { const [minDisplacement, setMinDisplacement] = useState(OPTIONS[0]!.data); useEffect(() => { - locationManager.start(); + LocationManager.start(); return () => { - locationManager.stop(); + LocationManager.stop(); }; }, []); diff --git a/packages/examples/src/examples/UserLocation/UserLocationUpdate.tsx b/packages/examples/src/examples/UserLocation/UserLocationUpdate.tsx index 388c18bca..f352fb88a 100755 --- a/packages/examples/src/examples/UserLocation/UserLocationUpdate.tsx +++ b/packages/examples/src/examples/UserLocation/UserLocationUpdate.tsx @@ -7,10 +7,10 @@ import { import { useState } from "react"; import { Text } from "react-native"; -import Bubble from "../../components/Bubble"; +import { Bubble } from "../../components/Bubble"; import { sheet } from "../../styles/sheet"; -export default function UserLocationUpdate() { +export function UserLocationUpdate() { const [location, setLocation] = useState(); return ( diff --git a/packages/examples/src/examples/index.ts b/packages/examples/src/examples/index.ts index bf11827db..50f79a0df 100644 --- a/packages/examples/src/examples/index.ts +++ b/packages/examples/src/examples/index.ts @@ -1,58 +1,58 @@ // @ts-nocheck // ANIMATIONS -export { default as AnimatedLine } from "./Animations/AnimatedLine"; -export { default as AnimateCircleAlongLine } from "./Animations/AnimateCircleAlongLine"; +export { AnimatedLine } from "./Animations/AnimatedLine"; +export { AnimateCircleAlongLine } from "./Animations/AnimateCircleAlongLine"; // ANNOTATIONS -export { default as CustomCallout } from "./Annotations/CustomCallout"; -export { default as Heatmap } from "./Annotations/Heatmap"; -export { default as MarkerView } from "./Annotations/MarkerView"; -export { default as ShowPointAnnotation } from "./Annotations/ShowPointAnnotation"; -export { default as PointAnnotationAnchors } from "./Annotations/PointAnnotationAnchors"; +export { CustomCallout } from "./Annotations/CustomCallout"; +export { Heatmap } from "./Annotations/Heatmap"; +export { MarkerView } from "./Annotations/MarkerView"; +export { ShowPointAnnotation } from "./Annotations/ShowPointAnnotation"; +export { PointAnnotationAnchors } from "./Annotations/PointAnnotationAnchors"; // CAMERA -export { default as CompassView } from "./Camera/CompassView"; -export { default as Fit } from "./Camera/Fit"; -export { default as FlyTo } from "./Camera/FlyTo"; -export { default as GetCenter } from "./Camera/GetCenter"; -export { default as GetZoom } from "./Camera/GetZoom"; -export { default as RestrictMapBounds } from "./Camera/RestrictMapBounds"; -export { default as SetHeading } from "./Camera/SetHeading"; -export { default as SetPitch } from "./Camera/SetPitch"; -export { default as TakeSnapshot } from "./Camera/TakeSnapshot"; -export { default as TakeSnapshotWithMap } from "./Camera/TakeSnapshotWithMap"; -export { default as YoYo } from "./Camera/YoYo"; +export { CompassView } from "./Camera/CompassView"; +export { Fit } from "./Camera/Fit"; +export { FlyTo } from "./Camera/FlyTo"; +export { GetCenter } from "./Camera/GetCenter"; +export { GetZoom } from "./Camera/GetZoom"; +export { RestrictMapBounds } from "./Camera/RestrictMapBounds"; +export { SetHeading } from "./Camera/SetHeading"; +export { SetPitch } from "./Camera/SetPitch"; +export { TakeSnapshot } from "./Camera/TakeSnapshot"; +export { TakeSnapshotWithMap } from "./Camera/TakeSnapshotWithMap"; +export { YoYo } from "./Camera/YoYo"; // FILLRASTERLAYER -export { default as CustomVectorSource } from "./FillRasterLayer/CustomVectorSource"; -export { default as GeoJSONSource } from "./FillRasterLayer/GeoJSONSource"; -export { default as ImageOverlay } from "./FillRasterLayer/ImageOverlay"; -export { default as IndoorBuilding } from "./FillRasterLayer/IndoorBuilding"; -export { default as QueryAtPoint } from "./FillRasterLayer/QueryAtPoint"; -export { default as QueryWithRect } from "./FillRasterLayer/QueryWithRect"; -export { default as OpenStreetMapRasterTiles } from "./FillRasterLayer/OpenStreetMapRasterTiles"; +export { CustomVectorSource } from "./FillRasterLayer/CustomVectorSource"; +export { GeoJSONSource } from "./FillRasterLayer/GeoJSONSource"; +export { ImageOverlay } from "./FillRasterLayer/ImageOverlay"; +export { IndoorBuilding } from "./FillRasterLayer/IndoorBuilding"; +export { QueryAtPoint } from "./FillRasterLayer/QueryAtPoint"; +export { QueryWithRect } from "./FillRasterLayer/QueryWithRect"; +export { OpenStreetMapRasterTiles } from "./FillRasterLayer/OpenStreetMapRasterTiles"; // LINE LAYER -export { default as GradientLine } from "./LineLayer/GradientLine"; +export { GradientLine } from "./LineLayer/GradientLine"; // MAP -export { default as ChangeLayerColor } from "./Map/ChangeLayerColor"; -export { default as CreateOfflineRegion } from "./Map/CreateOfflineRegion"; -export { default as PointInMapView } from "./Map/PointInMapView"; -export { default as ShowAndHideLayer } from "./Map/ShowAndHideLayer"; -export { default as ShowClick } from "./Map/ShowClick"; -export { default as ShowMap } from "./Map/ShowMap"; -export { default as LocalStyleJSON } from "./Map/LocalStyleJSON"; -export { default as ShowRegionDidChange } from "./Map/ShowRegionDidChange"; -export { default as SourceLayerVisibility } from "./Map/SourceLayerVisibility"; -export { default as TwoMapViews } from "./Map/TwoMapViews"; -export { default as SetTintColor } from "./Map/SetTintColor"; +export { ChangeLayerColor } from "./Map/ChangeLayerColor"; +export { CreateOfflineRegion } from "./Map/CreateOfflineRegion"; +export { PointInMapView } from "./Map/PointInMapView"; +export { ShowAndHideLayer } from "./Map/ShowAndHideLayer"; +export { ShowClick } from "./Map/ShowClick"; +export { ShowMap } from "./Map/ShowMap"; +export { LocalStyleJSON } from "./Map/LocalStyleJSON"; +export { ShowRegionDidChange } from "./Map/ShowRegionDidChange"; +export { SourceLayerVisibility } from "./Map/SourceLayerVisibility"; +export { TwoMapViews } from "./Map/TwoMapViews"; +export { SetTintColor } from "./Map/SetTintColor"; // SYMBOLCIRCLELAYER -export { default as CustomIcon } from "./SymbolCircleLayer/CustomIcon"; -export { default as DataDrivenCircleColors } from "./SymbolCircleLayer/DataDrivenCircleColors"; -export { default as Earthquakes } from "./SymbolCircleLayer/Earthquakes"; -export { default as ShapeSourceIcon } from "./SymbolCircleLayer/ShapeSourceIcon"; +export { CustomIcon } from "./SymbolCircleLayer/CustomIcon"; +export { DataDrivenCircleColors } from "./SymbolCircleLayer/DataDrivenCircleColors"; +export { Earthquakes } from "./SymbolCircleLayer/Earthquakes"; +export { ShapeSourceIcon } from "./SymbolCircleLayer/ShapeSourceIcon"; // USERLOCATION -export { default as FollowUserLocationRenderMode } from "./UserLocation/FollowUserLocationRenderMode"; -export { default as FollowUserLocationAlignment } from "./UserLocation/FollowUserLocationAlignment"; -export { default as SetAndroidPreferredFramesPerSecond } from "./UserLocation/SetAndroidPreferredFramesPerSecond"; -export { default as UserLocationDisplacement } from "./UserLocation/UserLocationDisplacement"; -export { default as UserLocationUpdate } from "./UserLocation/UserLocationUpdate"; +export { FollowUserLocationRenderMode } from "./UserLocation/FollowUserLocationRenderMode"; +export { FollowUserLocationAlignment } from "./UserLocation/FollowUserLocationAlignment"; +export { SetAndroidPreferredFramesPerSecond } from "./UserLocation/SetAndroidPreferredFramesPerSecond"; +export { UserLocationDisplacement } from "./UserLocation/UserLocationDisplacement"; +export { UserLocationUpdate } from "./UserLocation/UserLocationUpdate"; // MISC -export { default as BugReport } from "./BugReport"; -export { default as CacheManagement } from "./CacheManagement"; +export { BugReport } from "./BugReport"; +export { CacheManagement } from "./CacheManagement"; diff --git a/packages/examples/src/utils/RouteSimulator.ts b/packages/examples/src/utils/RouteSimulator.ts index 33c6e5aef..e1e885068 100755 --- a/packages/examples/src/utils/RouteSimulator.ts +++ b/packages/examples/src/utils/RouteSimulator.ts @@ -61,7 +61,7 @@ class Polyline { } } -class RouteSimulator { +export class RouteSimulator { private readonly polyline: Polyline; private previousDistance: number; private currentDistance: number; @@ -151,5 +151,3 @@ class RouteSimulator { this.listener?.(pointFeature); } } - -export default RouteSimulator; diff --git a/src/MapLibreRN.ts b/src/MapLibreRN.ts deleted file mode 100644 index 424222148..000000000 --- a/src/MapLibreRN.ts +++ /dev/null @@ -1,69 +0,0 @@ -export * from "./MLRNModule"; -export { - default as Camera, - UserTrackingMode, - type CameraPadding, - type CameraAnimationMode, - type CameraBounds, - type CameraRef, -} from "./components/Camera"; -export { - default as MapView, - type MapViewRef, - type RegionPayload, -} from "./components/MapView"; -export { default as Light } from "./components/Light"; -export { default as PointAnnotation } from "./components/PointAnnotation"; -export type { PointAnnotationRef } from "./components/PointAnnotation"; -export { default as Annotation } from "./components/Annotation"; -export { default as Callout } from "./components/Callout"; -export { requestAndroidLocationPermissions } from "./requestAndroidLocationPermissions"; -export { - default as UserLocation, - UserLocationRenderMode, -} from "./components/UserLocation"; -export type { UserLocationRef } from "./components/UserLocation"; -export { default as VectorSource } from "./components/VectorSource"; -export { default as ShapeSource } from "./components/ShapeSource"; -export type { ShapeSourceRef } from "./components/ShapeSource"; -export { default as RasterSource } from "./components/RasterSource"; -export { default as ImageSource } from "./components/ImageSource"; -export { default as Images } from "./components/Images"; -export { default as FillLayer } from "./components/FillLayer"; -export { default as FillExtrusionLayer } from "./components/FillExtrusionLayer"; -export { default as HeatmapLayer } from "./components/HeatmapLayer"; -export { default as LineLayer } from "./components/LineLayer"; -export { default as CircleLayer } from "./components/CircleLayer"; -export { default as SymbolLayer } from "./components/SymbolLayer"; -export { default as RasterLayer } from "./components/RasterLayer"; -export { default as BackgroundLayer } from "./components/BackgroundLayer"; -export { default as MarkerView } from "./components/MarkerView"; - -export { - default as locationManager, - type Location, -} from "./modules/location/locationManager"; -export { default as offlineManager } from "./modules/offline/offlineManager"; -export type { OfflinePackError } from "./modules/offline/offlineManager"; -export type { OfflinePackStatus } from "./modules/offline/OfflinePack"; -export { default as OfflinePack } from "./modules/offline/OfflinePack"; -export { default as OfflineCreatePackOptions } from "./modules/offline/OfflineCreatePackOptions"; -export { default as snapshotManager } from "./modules/snapshot/snapshotManager"; -export type { SnapshotInputOptions } from "./modules/snapshot/SnapshotOptions"; - -export type { MapLibreRNEvent } from "./types/MapLibreRNEvent"; - -export { default as Animated } from "./utils/animated/Animated"; -export { default as Logger, type LogLevel } from "./utils/Logger"; -export type { - FillLayerStyle, - LineLayerStyle, - SymbolLayerStyle, - CircleLayerStyle, - HeatmapLayerStyle, - FillExtrusionLayerStyle, - RasterLayerStyle, - HillshadeLayerStyle, - BackgroundLayerStyle, - LightLayerStyle, -} from "./types/MapLibreRNStyles"; diff --git a/src/components/Annotation.tsx b/src/components/Annotation.tsx index 6b93fab76..5795b63fe 100644 --- a/src/components/Annotation.tsx +++ b/src/components/Annotation.tsx @@ -1,6 +1,6 @@ import { forwardRef, - type ReactElement, + type ReactNode, useCallback, useEffect, useImperativeHandle, @@ -8,11 +8,11 @@ import { } from "react"; import { Animated as RNAnimated, Easing } from "react-native"; -import SymbolLayer from "./SymbolLayer"; +import { SymbolLayer } from "./SymbolLayer"; import { type SymbolLayerStyle } from "../types/MapLibreRNStyles"; import { type OnPressEvent } from "../types/OnPressEvent"; import { AnimatedShapeSource } from "../utils/animated/Animated"; -import AnimatedMapPoint from "../utils/animated/AnimatedPoint"; +import { AnimatedPoint } from "../utils/animated/AnimatedPoint"; interface AnnotationProps { id: string; @@ -21,12 +21,12 @@ interface AnnotationProps { animationEasingFunction?(x: number): number; coordinates?: number[]; onPress?(event: OnPressEvent): void; - children?: ReactElement | ReactElement[]; + children?: ReactNode; style?: object; icon?: string | number | object; } -type Shape = AnimatedMapPoint | GeoJSON.Point; +type Shape = AnimatedPoint | GeoJSON.Point; function getShapeFromProps(props: Partial = {}): Shape { const lng = props.coordinates?.[0] || 0; @@ -34,14 +34,14 @@ function getShapeFromProps(props: Partial = {}): Shape { const point: GeoJSON.Point = { type: "Point", coordinates: [lng, lat] }; if (props.animated) { - return new AnimatedMapPoint(point); + return new AnimatedPoint(point); } return point; } -function isShapeAnimated(shape: Shape): shape is AnimatedMapPoint { - return shape instanceof AnimatedMapPoint; +function isShapeAnimated(shape: Shape): shape is AnimatedPoint { + return shape instanceof AnimatedPoint; } interface AnnotationRef { @@ -49,7 +49,7 @@ interface AnnotationRef { symbolStyle: SymbolLayerStyle | undefined; } -const Annotation = forwardRef( +export const Annotation = forwardRef( ( { animated = false, @@ -160,5 +160,3 @@ const Annotation = forwardRef( ); Annotation.displayName = "Annotation"; - -export default Annotation; diff --git a/src/components/BackgroundLayer.tsx b/src/components/BackgroundLayer.tsx index 595c057ec..4d1307b05 100644 --- a/src/components/BackgroundLayer.tsx +++ b/src/components/BackgroundLayer.tsx @@ -1,7 +1,7 @@ -import React from "react"; import { NativeModules, requireNativeComponent } from "react-native"; -import useAbstractLayer, { +import { + useAbstractLayer, type BaseLayerProps, type NativeBaseProps, } from "../hooks/useAbstractLayer"; @@ -26,7 +26,7 @@ interface NativeProps const MLRNBackgroundLayer = requireNativeComponent(NATIVE_MODULE_NAME); -const BackgroundLayer: React.FC = ({ +export const BackgroundLayer = ({ sourceID = MLRNModule.StyleSource.DefaultSourceID, ...props }: BackgroundLayerProps) => { @@ -46,5 +46,3 @@ const BackgroundLayer: React.FC = ({ /> ); }; - -export default BackgroundLayer; diff --git a/src/components/Callout.tsx b/src/components/Callout.tsx index 07bcf2e31..cd8626f70 100644 --- a/src/components/Callout.tsx +++ b/src/components/Callout.tsx @@ -1,13 +1,13 @@ -import { Children, type ReactElement } from "react"; +import { Children } from "react"; import { - View, - Text, Animated, requireNativeComponent, + type StyleProp, StyleSheet, - type ViewStyle, + Text, + View, type ViewProps, - type StyleProp, + type ViewStyle, } from "react-native"; export const NATIVE_MODULE_NAME = "MLRNCallout"; @@ -82,7 +82,7 @@ interface NativeProps extends Omit { /** * Callout that displays information about a selected annotation near the annotation. */ -const Callout = (props: CalloutProps): ReactElement => { +export const Callout = (props: CalloutProps) => { const { title, style, @@ -104,7 +104,7 @@ const Callout = (props: CalloutProps): ReactElement => { const _hasChildren = Children.count(children) > 0; - const _renderDefaultCallout = (): ReactElement => { + const _renderDefaultCallout = () => { return ( @@ -117,7 +117,7 @@ const Callout = (props: CalloutProps): ReactElement => { ); }; - const _renderCustomCallout = (): ReactElement => { + const _renderCustomCallout = () => { return ( {children} @@ -137,5 +137,3 @@ const Callout = (props: CalloutProps): ReactElement => { }; const MLRNCallout = requireNativeComponent(NATIVE_MODULE_NAME); - -export default Callout; diff --git a/src/components/Camera.tsx b/src/components/Camera.tsx index c14c49c12..40e6e6f0a 100644 --- a/src/components/Camera.tsx +++ b/src/components/Camera.tsx @@ -244,7 +244,7 @@ export interface NativeCameraProps defaultStop?: NativeCameraStop; } -const Camera = memo( +export const Camera = memo( forwardRef( ( { @@ -488,5 +488,3 @@ const Camera = memo( const MLRNCamera = requireNativeComponent(NATIVE_MODULE_NAME); - -export default Camera; diff --git a/src/components/CircleLayer.tsx b/src/components/CircleLayer.tsx index 163c48e06..c97340732 100644 --- a/src/components/CircleLayer.tsx +++ b/src/components/CircleLayer.tsx @@ -1,7 +1,7 @@ -import React from "react"; import { NativeModules, requireNativeComponent } from "react-native"; -import useAbstractLayer, { +import { + useAbstractLayer, type BaseLayerProps, type NativeBaseProps, } from "../hooks/useAbstractLayer"; @@ -28,7 +28,7 @@ const MLRNCircleLayer = requireNativeComponent(NATIVE_MODULE_NAME); /** * CircleLayer is a style layer that renders one or more filled circles on the map. */ -const CircleLayer: React.FC = ({ +export const CircleLayer = ({ sourceID = MLRNModule.StyleSource.DefaultSourceID, ...props }: CircleLayerProps) => { @@ -48,5 +48,3 @@ const CircleLayer: React.FC = ({ /> ); }; - -export default CircleLayer; diff --git a/src/components/FillExtrusionLayer.tsx b/src/components/FillExtrusionLayer.tsx index c6b7d219f..0bc262c48 100644 --- a/src/components/FillExtrusionLayer.tsx +++ b/src/components/FillExtrusionLayer.tsx @@ -1,7 +1,7 @@ -import React from "react"; import { NativeModules, requireNativeComponent } from "react-native"; -import useAbstractLayer, { +import { + useAbstractLayer, type BaseLayerProps, type NativeBaseProps, } from "../hooks/useAbstractLayer"; @@ -29,7 +29,7 @@ const MLRNFillExtrusionLayer = /** * FillExtrusionLayer is a style layer that renders one or more 3D extruded polygons on the map. */ -const FillExtrusionLayer: React.FC = ({ +export const FillExtrusionLayer = ({ sourceID = MLRNModule.StyleSource.DefaultSourceID, ...props }: FillExtrusionLayerProps) => { @@ -43,5 +43,3 @@ const FillExtrusionLayer: React.FC = ({ return ; }; - -export default FillExtrusionLayer; diff --git a/src/components/FillLayer.tsx b/src/components/FillLayer.tsx index 0d08a8633..596452283 100644 --- a/src/components/FillLayer.tsx +++ b/src/components/FillLayer.tsx @@ -1,7 +1,7 @@ -import React from "react"; import { NativeModules, requireNativeComponent } from "react-native"; -import useAbstractLayer, { +import { + useAbstractLayer, type BaseLayerProps, type NativeBaseProps, } from "../hooks/useAbstractLayer"; @@ -26,7 +26,7 @@ const MLRNFillLayer = requireNativeComponent(NATIVE_MODULE_NAME); /** * FillLayer is a style layer that renders one or more filled (and optionally stroked) polygons on the map. */ -const FillLayer: React.FC = ({ +export const FillLayer = ({ sourceID = MLRNModule.StyleSource.DefaultSourceID, ...props }: FillLayerProps) => { @@ -40,5 +40,3 @@ const FillLayer: React.FC = ({ return ; }; - -export default FillLayer; diff --git a/src/components/HeadingIndicator.tsx b/src/components/HeadingIndicator.tsx index 0aa4b6ccb..336894090 100644 --- a/src/components/HeadingIndicator.tsx +++ b/src/components/HeadingIndicator.tsx @@ -1,6 +1,4 @@ -import { type ReactElement } from "react"; - -import SymbolLayer from "./SymbolLayer"; +import { SymbolLayer } from "./SymbolLayer"; import headingIcon from "../assets/heading.png"; import { type BaseProps } from "../types/BaseProps"; @@ -15,7 +13,7 @@ interface HeadingIndicatorProps extends BaseProps { heading?: number; } -const HeadingIndicator = ({ heading }: HeadingIndicatorProps): ReactElement => ( +export const HeadingIndicator = ({ heading }: HeadingIndicatorProps) => ( ( }} /> ); - -export default HeadingIndicator; diff --git a/src/components/HeatmapLayer.tsx b/src/components/HeatmapLayer.tsx index 0a775479b..6aa6e68e7 100644 --- a/src/components/HeatmapLayer.tsx +++ b/src/components/HeatmapLayer.tsx @@ -1,9 +1,9 @@ -import React from "react"; import { NativeModules, requireNativeComponent } from "react-native"; -import useAbstractLayer, { +import { type BaseLayerProps, type NativeBaseProps, + useAbstractLayer, } from "../hooks/useAbstractLayer"; import { type BaseProps } from "../types/BaseProps"; import { type HeatmapLayerStyle } from "../types/MapLibreRNStyles"; @@ -28,7 +28,7 @@ const MLRNHeatmapLayer = /** * HeatmapLayer is a style layer that renders one or more filled circles on the map. */ -const HeatmapLayer: React.FC = ({ +export const HeatmapLayer = ({ sourceID = MLRNModule.StyleSource.DefaultSourceID, ...props }: HeatmapLayerProps) => { @@ -42,5 +42,3 @@ const HeatmapLayer: React.FC = ({ return ; }; - -export default HeatmapLayer; diff --git a/src/components/ImageSource.tsx b/src/components/ImageSource.tsx index e593f4b6c..68f2a1621 100644 --- a/src/components/ImageSource.tsx +++ b/src/components/ImageSource.tsx @@ -1,7 +1,7 @@ -import { type ReactElement } from "react"; +import { type ReactNode } from "react"; import { requireNativeComponent } from "react-native"; -import useAbstractSource from "../hooks/useAbstractSource"; +import { useAbstractSource } from "../hooks/useAbstractSource"; import { type BaseProps } from "../types/BaseProps"; import { cloneReactChildrenWithProps, @@ -31,7 +31,7 @@ export interface ImageSourceProps extends BaseProps { GeoJSON.Position, ]; - children?: ReactElement | ReactElement[]; + children?: ReactNode; } type NativeProps = ImageSourceProps; @@ -42,7 +42,7 @@ const MLRNImageSource = requireNativeComponent(NATIVE_MODULE_NAME); * ImageSource is a content source that is used for a georeferenced raster image to be shown on the map. * The georeferenced image scales and rotates as the user zooms and rotates the map */ -const ImageSource: React.FC = (props: ImageSourceProps) => { +export const ImageSource = (props: ImageSourceProps) => { const { setNativeRef } = useAbstractSource(); const _getURL = (): string | undefined => { @@ -66,5 +66,3 @@ const ImageSource: React.FC = (props: ImageSourceProps) => { ); }; - -export default ImageSource; diff --git a/src/components/Images.tsx b/src/components/Images.tsx index d686145a6..f9458a8fe 100644 --- a/src/components/Images.tsx +++ b/src/components/Images.tsx @@ -1,10 +1,10 @@ -import { type ReactElement } from "react"; +import { type ReactNode } from "react"; import { - requireNativeComponent, Image, - type NativeSyntheticEvent, type ImageSourcePropType, type ImageURISource, + type NativeSyntheticEvent, + requireNativeComponent, } from "react-native"; import { type BaseProps } from "../types/BaseProps"; @@ -55,19 +55,19 @@ interface ImagesProps extends BaseProps { id?: string; - children?: ReactElement; + children?: ReactNode; } /** * Images defines the images used in Symbol etc layers */ -const Images = ({ +export const Images = ({ images, nativeAssetImages, onImageMissing, id, children, -}: ImagesProps): ReactElement => { +}: ImagesProps) => { const _getImages = (): { images?: { [key: string]: ImageEntry }; nativeImages?: ImageEntry[]; @@ -123,5 +123,3 @@ const Images = ({ }; const MLRNImages = requireNativeComponent(NATIVE_MODULE_NAME); - -export default Images; diff --git a/src/components/Light.tsx b/src/components/Light.tsx index a24f2cb8e..fb2fae491 100644 --- a/src/components/Light.tsx +++ b/src/components/Light.tsx @@ -1,7 +1,7 @@ -import React from "react"; import { requireNativeComponent } from "react-native"; -import useAbstractLayer, { +import { + useAbstractLayer, type BaseLayerProps, } from "../hooks/useAbstractLayer"; import { type BaseProps } from "../types/BaseProps"; @@ -26,7 +26,7 @@ const MLRNLight = requireNativeComponent(NATIVE_MODULE_NAME); /** * Light represents the light source for extruded geometries */ -const Light: React.FC = (props: LightProps) => { +export const Light = (props: LightProps) => { const { baseProps, setNativeLayer } = useAbstractLayer< LightProps, NativeProps @@ -36,5 +36,3 @@ const Light: React.FC = (props: LightProps) => { return ; }; - -export default Light; diff --git a/src/components/LineLayer.tsx b/src/components/LineLayer.tsx index 95cca282d..30caf8c2c 100644 --- a/src/components/LineLayer.tsx +++ b/src/components/LineLayer.tsx @@ -1,7 +1,7 @@ -import React from "react"; import { NativeModules, requireNativeComponent } from "react-native"; -import useAbstractLayer, { +import { + useAbstractLayer, type BaseLayerProps, type NativeBaseProps, } from "../hooks/useAbstractLayer"; @@ -27,7 +27,7 @@ const MLRNLineLayer = /** * LineLayer is a style layer that renders one or more stroked polylines on the map. */ -const LineLayer: React.FC = ({ +export const LineLayer = ({ sourceID = MLRNModule.StyleSource.DefaultSourceID, ...props }: LineLayerProps) => { @@ -41,5 +41,3 @@ const LineLayer: React.FC = ({ return ; }; - -export default LineLayer; diff --git a/src/components/MapView.tsx b/src/components/MapView.tsx index da02eb21b..535b5f387 100644 --- a/src/components/MapView.tsx +++ b/src/components/MapView.tsx @@ -22,13 +22,13 @@ import { type NativeSyntheticEvent, } from "react-native"; -import useNativeBridge from "../hooks/useNativeBridge"; -import useOnce from "../hooks/useOnce"; -import { type Location } from "../modules/location/locationManager"; +import { useNativeBridge } from "../hooks/useNativeBridge"; +import { useOnce } from "../hooks/useOnce"; +import { type Location } from "../modules/location/LocationManager"; import { type BaseProps } from "../types/BaseProps"; import { type FilterExpression } from "../types/MapLibreRNStyles"; import { isFunction, isAndroid } from "../utils"; -import Logger from "../utils/Logger"; +import { Logger } from "../utils/Logger"; import { getFilter } from "../utils/filterUtils"; const MLRNModule = NativeModules.MLRNModule; @@ -278,7 +278,7 @@ export interface MapViewRef { /** * MapView backed by MapLibre Native */ -const MapView = memo( +export const MapView = memo( forwardRef( ( { @@ -852,4 +852,3 @@ if (isAndroid()) { ANDROID_TEXTURE_NATIVE_MODULE_NAME, ); } -export default MapView; diff --git a/src/components/MarkerView.tsx b/src/components/MarkerView.tsx index 58eba8a66..a6a7fea4b 100644 --- a/src/components/MarkerView.tsx +++ b/src/components/MarkerView.tsx @@ -2,7 +2,7 @@ import { point } from "@turf/helpers"; import { type ReactElement, useMemo } from "react"; import { Platform, requireNativeComponent, type ViewProps } from "react-native"; -import PointAnnotation from "./PointAnnotation"; +import { PointAnnotation } from "./PointAnnotation"; import { toJSONString } from "../utils"; export const NATIVE_MODULE_NAME = "MLRNMarkerView"; @@ -35,7 +35,7 @@ interface MarkerViewProps extends ViewProps { /** * Expects one child - can be container with multiple elements */ - children: React.ReactElement; + children: ReactElement; } interface NativeProps extends ViewProps { @@ -53,12 +53,12 @@ interface NativeProps extends ViewProps { * This is based on [MakerView plugin](https://docs.mapbox.com/android/plugins/overview/markerview/) on Android * and PointAnnotation on iOS. */ -const MarkerView = ({ +export const MarkerView = ({ anchor = { x: 0.5, y: 0.5 }, allowOverlap = false, isSelected = false, ...rest -}: MarkerViewProps): ReactElement => { +}: MarkerViewProps) => { const props = { anchor, allowOverlap, isSelected, ...rest }; const coordinate = props.coordinate ? toJSONString(point(props.coordinate)) @@ -84,5 +84,3 @@ const MarkerView = ({ let lastId = 0; const MLRNMarkerView = requireNativeComponent(NATIVE_MODULE_NAME); - -export default MarkerView; diff --git a/src/components/NativeUserLocation.tsx b/src/components/NativeUserLocation.tsx index e3bd46bf9..cdc9c42fc 100644 --- a/src/components/NativeUserLocation.tsx +++ b/src/components/NativeUserLocation.tsx @@ -1,4 +1,3 @@ -import { type ReactElement } from "react"; import { requireNativeComponent } from "react-native"; const NATIVE_MODULE_NAME = "MLRNNativeUserLocation"; @@ -26,10 +25,8 @@ interface NativeUserLocationProps { androidPreferredFramesPerSecond?: number; } -const NativeUserLocation = (props: NativeUserLocationProps): ReactElement => { +export const NativeUserLocation = (props: NativeUserLocationProps) => { return ; }; const MLRNNativeUserLocation = requireNativeComponent(NATIVE_MODULE_NAME); - -export default NativeUserLocation; diff --git a/src/components/PointAnnotation.tsx b/src/components/PointAnnotation.tsx index fbadb5eb7..26f547faa 100644 --- a/src/components/PointAnnotation.tsx +++ b/src/components/PointAnnotation.tsx @@ -14,7 +14,7 @@ import { requireNativeComponent, } from "react-native"; -import useNativeBridge, { type RNMLEvent } from "../hooks/useNativeBridge"; +import { useNativeBridge, type RNMLEvent } from "../hooks/useNativeBridge"; import { isFunction, toJSONString } from "../utils"; export const NATIVE_MODULE_NAME = "MLRNPointAnnotation"; @@ -102,7 +102,7 @@ export interface PointAnnotationProps { /** * Expects one child, and an optional callout can be added as well */ - children: React.ReactElement | [React.ReactElement, React.ReactElement]; + children: ReactElement | [ReactElement, ReactElement]; style?: ViewProps["style"]; } @@ -125,7 +125,10 @@ export interface PointAnnotationRef { * If you need interctive views please use MarkerView, * as with PointAnnotation on Android child views are rendered onto a bitmap for better performance. */ -const PointAnnotation = forwardRef( +export const PointAnnotation = forwardRef< + PointAnnotationRef, + PointAnnotationProps +>( ( { anchor = { x: 0.5, y: 0.5 }, @@ -133,7 +136,7 @@ const PointAnnotation = forwardRef( ...props }: PointAnnotationProps, ref, - ): ReactElement => { + ) => { useImperativeHandle( ref, (): PointAnnotationRef => ({ @@ -241,5 +244,3 @@ PointAnnotation.displayName = "PointAnnotation"; const MLRNPointAnnotation = requireNativeComponent(NATIVE_MODULE_NAME); - -export default PointAnnotation; diff --git a/src/components/RasterLayer.tsx b/src/components/RasterLayer.tsx index 03d2d98a2..2e7f63ae5 100644 --- a/src/components/RasterLayer.tsx +++ b/src/components/RasterLayer.tsx @@ -1,7 +1,7 @@ -import React from "react"; import { NativeModules, requireNativeComponent } from "react-native"; -import useAbstractLayer, { +import { + useAbstractLayer, type BaseLayerProps, type NativeBaseProps, } from "../hooks/useAbstractLayer"; @@ -25,7 +25,7 @@ interface NativeProps const MLRNRasterLayer = requireNativeComponent(NATIVE_MODULE_NAME); -const RasterLayer: React.FC = ({ +export const RasterLayer = ({ sourceID = MLRNModule.StyleSource.DefaultSourceID, ...props }: RasterLayerProps) => { @@ -39,5 +39,3 @@ const RasterLayer: React.FC = ({ return ; }; - -export default RasterLayer; diff --git a/src/components/RasterSource.tsx b/src/components/RasterSource.tsx index 0cc943bfe..cc38c8684 100644 --- a/src/components/RasterSource.tsx +++ b/src/components/RasterSource.tsx @@ -1,8 +1,8 @@ -import React from "react"; +import { type ReactNode } from "react"; import { NativeModules, requireNativeComponent } from "react-native"; -import useAbstractSource from "../hooks/useAbstractSource"; -import useOnce from "../hooks/useOnce"; +import { useAbstractSource } from "../hooks/useAbstractSource"; +import { useOnce } from "../hooks/useOnce"; import { type BaseProps } from "../types/BaseProps"; import { cloneReactChildrenWithProps } from "../utils"; @@ -55,7 +55,7 @@ interface RasterSourceProps extends BaseProps { */ attribution?: string; - children?: React.ReactElement | React.ReactElement[]; + children?: ReactNode; } type NativeProps = RasterSourceProps; @@ -68,7 +68,7 @@ const MLRNRasterSource = * The location of and metadata about the tiles are defined either by an option dictionary * or by an external file that conforms to the TileJSON specification. */ -const RasterSource: React.FC = ({ +export const RasterSource = ({ id = MLRNModule.StyleSource.DefaultSourceID, ...props }: RasterSourceProps) => { @@ -110,5 +110,3 @@ const RasterSource: React.FC = ({ ); }; - -export default RasterSource; diff --git a/src/components/ShapeSource.tsx b/src/components/ShapeSource.tsx index f5ff52fe4..7a58be794 100644 --- a/src/components/ShapeSource.tsx +++ b/src/components/ShapeSource.tsx @@ -1,8 +1,8 @@ import { Component, - type ReactElement, forwardRef, memo, + type ReactNode, useImperativeHandle, useRef, } from "react"; @@ -13,7 +13,7 @@ import { requireNativeComponent, } from "react-native"; -import useNativeBridge from "../hooks/useNativeBridge"; +import { useNativeBridge } from "../hooks/useNativeBridge"; import { type BaseProps } from "../types/BaseProps"; import { type ExpressionField, @@ -133,7 +133,7 @@ export interface ShapeSourceProps extends BaseProps { height: number; }; - children?: ReactElement | ReactElement[]; + children?: ReactNode; } export interface ShapeSourceRef { @@ -158,7 +158,7 @@ export interface ShapeSourceRef { * ShapeSource is a map content source that supplies vector shapes to be shown on the map. * The shape may be a url or a GeoJSON object */ -const ShapeSource = memo( +export const ShapeSource = memo( forwardRef( ( { @@ -364,5 +364,3 @@ const ShapeSource = memo( ); const MLRNShapeSource = requireNativeComponent(NATIVE_MODULE_NAME); - -export default ShapeSource; diff --git a/src/components/SymbolLayer.tsx b/src/components/SymbolLayer.tsx index bca98d47d..55fb92198 100644 --- a/src/components/SymbolLayer.tsx +++ b/src/components/SymbolLayer.tsx @@ -1,6 +1,7 @@ import { NativeModules, requireNativeComponent } from "react-native"; -import useAbstractLayer, { +import { + useAbstractLayer, type BaseLayerProps, type NativeBaseProps, } from "../hooks/useAbstractLayer"; @@ -27,7 +28,7 @@ const MLRNSymbolLayer = requireNativeComponent(NATIVE_MODULE_NAME); /** * SymbolLayer is a style layer that renders icon and text labels at points or along lines on the map. */ -const SymbolLayer: React.FC = ({ +export const SymbolLayer = ({ sourceID = MLRNModule.StyleSource.DefaultSourceID, ...props }: SymbolLayerProps) => { @@ -45,5 +46,3 @@ const SymbolLayer: React.FC = ({ return ; }; - -export default SymbolLayer; diff --git a/src/components/UserLocation.tsx b/src/components/UserLocation.tsx index 5df37befb..1573a81d1 100644 --- a/src/components/UserLocation.tsx +++ b/src/components/UserLocation.tsx @@ -1,20 +1,21 @@ import { forwardRef, memo, - type ReactElement, + type ReactNode, useEffect, useImperativeHandle, useRef, useState, } from "react"; -import Annotation from "./Annotation"; -import CircleLayer from "./CircleLayer"; -import HeadingIndicator from "./HeadingIndicator"; -import NativeUserLocation from "./NativeUserLocation"; -import locationManager, { +import { Annotation } from "./Annotation"; +import { CircleLayer } from "./CircleLayer"; +import { HeadingIndicator } from "./HeadingIndicator"; +import { NativeUserLocation } from "./NativeUserLocation"; +import { type Location, -} from "../modules/location/locationManager"; + LocationManager, +} from "../modules/location/LocationManager"; import { type CircleLayerStyle } from "../types/MapLibreRNStyles"; const mapboxBlue = "rgba(51, 181, 229, 100)"; @@ -41,7 +42,7 @@ const layerStyles: Record = { export const normalIcon = ( showsUserHeadingIndicator?: boolean, heading?: number, -): ReactElement[] => [ +) => [ void; } -const UserLocation = memo( +export const UserLocation = memo( forwardRef( ( { @@ -163,7 +164,7 @@ const UserLocation = memo( ref, (): UserLocationRef => ({ /** - * Whether to start or stop listening to the locationManager + * Whether to start or stop listening to the LocationManager * * Notice, that listening will start automatically when * either `onUpdate` or `visible` are set @@ -175,7 +176,7 @@ const UserLocation = memo( setLocationManager, /** * - * If locationManager should be running + * If LocationManager should be running * * @return {boolean} */ @@ -194,7 +195,7 @@ const UserLocation = memo( return; } - locationManager.setMinDisplacement(minDisplacement ?? 0); + LocationManager.setMinDisplacement(minDisplacement ?? 0); }); return (): void => { @@ -205,7 +206,7 @@ const UserLocation = memo( }, []); useEffect(() => { - locationManager.setMinDisplacement(minDisplacement ?? 0); + LocationManager.setMinDisplacement(minDisplacement ?? 0); }, [minDisplacement]); useEffect(() => { @@ -227,11 +228,11 @@ const UserLocation = memo( locationManagerRunning.current = running; if (running) { - locationManager.addListener(_onLocationUpdate); - const location = await locationManager.getLastKnownLocation(); + LocationManager.addListener(_onLocationUpdate); + const location = await LocationManager.getLastKnownLocation(); _onLocationUpdate(location); } else { - locationManager.removeListener(_onLocationUpdate); + LocationManager.removeListener(_onLocationUpdate); } } } @@ -303,5 +304,3 @@ const UserLocation = memo( }, ), ); - -export default UserLocation; diff --git a/src/components/VectorSource.tsx b/src/components/VectorSource.tsx index 2b090eece..844e9e08d 100644 --- a/src/components/VectorSource.tsx +++ b/src/components/VectorSource.tsx @@ -1,13 +1,13 @@ import { featureCollection } from "@turf/helpers"; -import { forwardRef, memo, useImperativeHandle } from "react"; +import { forwardRef, memo, type ReactNode, useImperativeHandle } from "react"; import { NativeModules, type NativeSyntheticEvent, requireNativeComponent, } from "react-native"; -import useAbstractSource from "../hooks/useAbstractSource"; -import useNativeBridge from "../hooks/useNativeBridge"; +import { useAbstractSource } from "../hooks/useAbstractSource"; +import { useNativeBridge } from "../hooks/useNativeBridge"; import { type BaseProps } from "../types/BaseProps"; import { type FilterExpression } from "../types/MapLibreRNStyles"; import { type OnPressEvent } from "../types/OnPressEvent"; @@ -77,7 +77,7 @@ interface VectorSourceProps extends BaseProps { height: number; }; - children?: React.ReactElement | React.ReactElement[]; + children?: ReactNode; } type NativeProps = VectorSourceProps; @@ -89,7 +89,7 @@ const MLRNVectorSource = * VectorSource is a map content source that supplies tiled vector data in Mapbox Vector Tile format to be shown on the map. * The location of and metadata about the tiles are defined either by an option dictionary or by an external file that conforms to the TileJSON specification. */ -const VectorSource = memo( +export const VectorSource = memo( forwardRef( ( { @@ -198,5 +198,3 @@ const VectorSource = memo( }, ), ); - -export default VectorSource; diff --git a/src/hooks/useAbstractLayer.ts b/src/hooks/useAbstractLayer.ts index a1079c837..34444290f 100644 --- a/src/hooks/useAbstractLayer.ts +++ b/src/hooks/useAbstractLayer.ts @@ -1,4 +1,4 @@ -import { useMemo, useRef } from "react"; +import { type Component, useMemo, useRef } from "react"; import { processColor, type NativeMethods } from "react-native"; import { type BaseProps } from "../types/BaseProps"; @@ -60,7 +60,7 @@ export interface NativeBaseProps { reactStyle?: { [key: string]: StyleValue }; } -export default function useAbstractLayer< +export function useAbstractLayer< Props extends BaseProps, NativeProps extends NativeBaseProps, >( @@ -68,13 +68,13 @@ export default function useAbstractLayer< ): { baseProps: Props & BaseLayerProps; setNativeLayer: ( - instance: (React.Component & Readonly) | null, + instance: (Component & Readonly) | null, ) => void; getStyleTypeFormatter: (styleType: string) => typeof processColor | undefined; setNativeProps: (nativeProps: { [key: string]: unknown }) => void; } { const nativeLayer = useRef< - (React.Component & Readonly) | null + (Component & Readonly) | null >(null); const baseProps = useMemo(() => { @@ -94,7 +94,7 @@ export default function useAbstractLayer< }, [props]); const setNativeLayer = ( - instance: (React.Component & Readonly) | null, + instance: (Component & Readonly) | null, ): void => { nativeLayer.current = instance; }; diff --git a/src/hooks/useAbstractSource.ts b/src/hooks/useAbstractSource.ts index 6def4303e..a51e942b0 100644 --- a/src/hooks/useAbstractSource.ts +++ b/src/hooks/useAbstractSource.ts @@ -1,21 +1,21 @@ -import { useRef } from "react"; +import { Component, useRef } from "react"; import { type NativeMethods } from "react-native"; -export default function useAbstractSource(): { +export function useAbstractSource(): { _nativeRef: - | (React.Component & Readonly) + | (Component & Readonly) | undefined; setNativeRef: ( - instance: React.Component & Readonly, + instance: Component & Readonly, ) => void; setNativeProps: (nativeProps: NativePropsType) => void; } { const _nativeRef = useRef< - (React.Component & Readonly) | undefined + (Component & Readonly) | undefined >(undefined); const setNativeRef = ( - instance: React.Component & Readonly, + instance: Component & Readonly, ): void => { _nativeRef.current = instance; }; diff --git a/src/hooks/useNativeBridge.ts b/src/hooks/useNativeBridge.ts index 445f6326a..48fedb948 100644 --- a/src/hooks/useNativeBridge.ts +++ b/src/hooks/useNativeBridge.ts @@ -1,4 +1,9 @@ -import { Component, type SyntheticEvent, useRef } from "react"; +import { + Component, + type MutableRefObject, + type SyntheticEvent, + useRef, +} from "react"; import { runNativeCommand, isAndroid, type NativeArg } from "../utils"; @@ -12,8 +17,8 @@ let callbackIncrement = 0; type UseNativeBridge = { _nativeModuleName: string; _onAndroidCallback: (e: SyntheticEvent) => void; - _callbackMap: React.MutableRefObject>; - _preRefMapMethodQueue: React.MutableRefObject; + _callbackMap: MutableRefObject>; + _preRefMapMethodQueue: MutableRefObject; _addAddAndroidCallback: ( id: string, resolve: (value: ReturnType) => void, @@ -30,7 +35,7 @@ type UseNativeBridge = { ) => Promise; }; -const useNativeBridge: (moduleName: string) => UseNativeBridge = ( +export const useNativeBridge: (moduleName: string) => UseNativeBridge = ( _nativeModuleName: string, ) => { const _callbackMap = useRef>(new Map()); @@ -121,5 +126,3 @@ const useNativeBridge: (moduleName: string) => UseNativeBridge = ( _runNativeCommand, }; }; - -export default useNativeBridge; diff --git a/src/hooks/useNativeRef.ts b/src/hooks/useNativeRef.ts index 587e12c64..7f35ae3b6 100644 --- a/src/hooks/useNativeRef.ts +++ b/src/hooks/useNativeRef.ts @@ -1,4 +1,4 @@ -import { Component, useRef } from "react"; +import { Component, type RefObject, useRef } from "react"; import { type NativeMethods } from "react-native"; export type NativeRef = Component & @@ -7,7 +7,7 @@ export type NativeRef = Component & /** * Separate module which allows to be mocked in tests. */ -export function useNativeRef(): React.RefObject< +export function useNativeRef(): RefObject< NativeRef > { return useRef>(null); diff --git a/src/hooks/useOnce.ts b/src/hooks/useOnce.ts index a15cb9550..83bdbd769 100644 --- a/src/hooks/useOnce.ts +++ b/src/hooks/useOnce.ts @@ -1,6 +1,8 @@ import { useRef } from "react"; -const useOnce: (callback: () => void) => void = (callback: () => void) => { +export const useOnce: (callback: () => void) => void = ( + callback: () => void, +) => { const once = useRef(false); if (!once.current) { @@ -8,5 +10,3 @@ const useOnce: (callback: () => void) => void = (callback: () => void) => { callback(); } }; - -export default useOnce; diff --git a/src/index.ts b/src/index.ts index 259858691..3f490af87 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1 +1,69 @@ -export * from "./MapLibreRN"; +export * from "./MLRNModule"; +export { + Camera, + UserTrackingMode, + type CameraPadding, + type CameraAnimationMode, + type CameraBounds, + type CameraRef, +} from "./components/Camera"; +export { + MapView, + type MapViewRef, + type RegionPayload, +} from "./components/MapView"; +export { Light } from "./components/Light"; +export { PointAnnotation } from "./components/PointAnnotation"; +export type { PointAnnotationRef } from "./components/PointAnnotation"; +export { Annotation } from "./components/Annotation"; +export { Callout } from "./components/Callout"; +export { requestAndroidLocationPermissions } from "./requestAndroidLocationPermissions"; +export { + UserLocation, + UserLocationRenderMode, +} from "./components/UserLocation"; +export type { UserLocationRef } from "./components/UserLocation"; +export { VectorSource } from "./components/VectorSource"; +export { ShapeSource } from "./components/ShapeSource"; +export type { ShapeSourceRef } from "./components/ShapeSource"; +export { RasterSource } from "./components/RasterSource"; +export { ImageSource } from "./components/ImageSource"; +export { Images } from "./components/Images"; +export { FillLayer } from "./components/FillLayer"; +export { FillExtrusionLayer } from "./components/FillExtrusionLayer"; +export { HeatmapLayer } from "./components/HeatmapLayer"; +export { LineLayer } from "./components/LineLayer"; +export { CircleLayer } from "./components/CircleLayer"; +export { SymbolLayer } from "./components/SymbolLayer"; +export { RasterLayer } from "./components/RasterLayer"; +export { BackgroundLayer } from "./components/BackgroundLayer"; +export { MarkerView } from "./components/MarkerView"; + +export { + LocationManager, + type Location, +} from "./modules/location/LocationManager"; +export { OfflineManager } from "./modules/offline/OfflineManager"; +export type { OfflinePackError } from "./modules/offline/OfflineManager"; +export type { OfflinePackStatus } from "./modules/offline/OfflinePack"; +export { OfflinePack } from "./modules/offline/OfflinePack"; +export { OfflineCreatePackOptions } from "./modules/offline/OfflineCreatePackOptions"; +export { SnapshotManager } from "./modules/snapshot/SnapshotManager"; +export type { SnapshotInputOptions } from "./modules/snapshot/SnapshotOptions"; + +export type { MapLibreRNEvent } from "./types/MapLibreRNEvent"; + +export { Animated } from "./utils/animated/Animated"; +export { Logger, type LogLevel } from "./utils/Logger"; +export type { + FillLayerStyle, + LineLayerStyle, + SymbolLayerStyle, + CircleLayerStyle, + HeatmapLayerStyle, + FillExtrusionLayerStyle, + RasterLayerStyle, + HillshadeLayerStyle, + BackgroundLayerStyle, + LightLayerStyle, +} from "./types/MapLibreRNStyles"; diff --git a/src/modules/location/locationManager.ts b/src/modules/location/LocationManager.ts similarity index 94% rename from src/modules/location/locationManager.ts rename to src/modules/location/LocationManager.ts index 6b59ec3ee..cc95926f1 100644 --- a/src/modules/location/locationManager.ts +++ b/src/modules/location/LocationManager.ts @@ -12,7 +12,7 @@ export const LocationModuleEventEmitter = new NativeEventEmitter( ); /** - * Location sent by locationManager + * Location sent by LocationManager */ export interface Location { coords: Coordinates; @@ -20,7 +20,7 @@ export interface Location { } /** - * Coorinates sent by locationManager + * Coorinates sent by LocationManager */ interface Coordinates { /** @@ -88,7 +88,7 @@ class LocationManager { try { lastKnownLocation = await MLRNLocationModule.getLastKnownLocation(); } catch (error) { - console.log("locationManager Error: ", error); + console.log("LocationManager Error: ", error); } if (!this._lastKnownLocation && lastKnownLocation) { @@ -158,4 +158,5 @@ class LocationManager { } } -export default new LocationManager(); +const locationManager = new LocationManager(); +export { locationManager as LocationManager }; diff --git a/src/modules/offline/OfflineCreatePackOptions.ts b/src/modules/offline/OfflineCreatePackOptions.ts index ad2fdae1d..5585126f7 100644 --- a/src/modules/offline/OfflineCreatePackOptions.ts +++ b/src/modules/offline/OfflineCreatePackOptions.ts @@ -9,7 +9,7 @@ export interface OfflineCreatePackInputOptions { metadata?: Record; } -class OfflineCreatePackOptions { +export class OfflineCreatePackOptions { name: string; styleURL: string; bounds: string; @@ -51,5 +51,3 @@ class OfflineCreatePackOptions { }); } } - -export default OfflineCreatePackOptions; diff --git a/src/modules/offline/offlineManager.ts b/src/modules/offline/OfflineManager.ts similarity index 93% rename from src/modules/offline/offlineManager.ts rename to src/modules/offline/OfflineManager.ts index 227720faf..f58bef5fe 100644 --- a/src/modules/offline/offlineManager.ts +++ b/src/modules/offline/OfflineManager.ts @@ -4,10 +4,11 @@ import { type EventSubscription, } from "react-native"; -import OfflineCreatePackOptions, { +import { + OfflineCreatePackOptions, type OfflineCreatePackInputOptions, } from "./OfflineCreatePackOptions"; -import OfflinePack, { type OfflinePackStatus } from "./OfflinePack"; +import { OfflinePack, type OfflinePackStatus } from "./OfflinePack"; import { isUndefined, isFunction, isAndroid } from "../../utils"; const MLRNModule = NativeModules.MLRNModule; @@ -67,7 +68,7 @@ class OfflineManager { * const progressListener = (offlineRegion, status) => console.log(offlineRegion, status); * const errorListener = (offlineRegion, err) => console.log(offlineRegion, err); * - * await offlineManager.createPack({ + * await OfflineManager.createPack({ * name: 'offlinePack', * styleURL: 'https://demotiles.maplibre.org/tiles/tiles.json', * minZoom: 14, @@ -106,7 +107,7 @@ class OfflineManager { * This is more efficient than deleting the offline pack and downloading it again. If the data stored locally matches that on the server, new data will not be downloaded. * * @example - * await offlineManager.invalidatePack('packName') + * await OfflineManager.invalidatePack('packName') * * @param {String} name Name of the offline pack. * @return {void} @@ -128,7 +129,7 @@ class OfflineManager { * Unregisters the given offline pack and allows resources that are no longer required by any remaining packs to be potentially freed. * * @example - * await offlineManager.deletePack('packName') + * await OfflineManager.deletePack('packName') * * @param {String} name Name of the offline pack. * @return {void} @@ -154,7 +155,7 @@ class OfflineManager { * It does not erase resources from the ambient cache or delete the database, which can be computationally expensive operations that may carry unintended side effects. * * @example - * await offlineManager.invalidateAmbientCache(); + * await OfflineManager.invalidateAmbientCache(); * * @return {void} */ @@ -168,7 +169,7 @@ class OfflineManager { * This method clears the cache and decreases the amount of space that map resources take up on the device. * * @example - * await offlineManager.clearAmbientCache(); + * await OfflineManager.clearAmbientCache(); * * @return {void} */ @@ -182,7 +183,7 @@ class OfflineManager { * This method may be computationally expensive because it will erase resources from the ambient cache if its size is decreased. * * @example - * await offlineManager.setMaximumAmbientCacheSize(5000000); + * await OfflineManager.setMaximumAmbientCacheSize(5000000); * * @param {Number} size Size of ambient cache. * @return {void} @@ -196,7 +197,7 @@ class OfflineManager { * Deletes the existing database, which includes both the ambient cache and offline packs, then reinitializes it. * * @example - * await offlineManager.resetDatabase(); + * await OfflineManager.resetDatabase(); * * @return {void} */ @@ -209,7 +210,7 @@ class OfflineManager { * Retrieves all the current offline packs that are stored in the database. * * @example - * const offlinePacks = await offlineManager.getPacks(); + * const offlinePacks = await OfflineManager.getPacks(); * * @return {Array} */ @@ -225,7 +226,7 @@ class OfflineManager { * Retrieves an offline pack that is stored in the database by name. * * @example - * const offlinePack = await offlineManager.getPack(); + * const offlinePack = await OfflineManager.getPack(); * * @param {String} name Name of the offline pack. * @return {OfflinePack} @@ -239,7 +240,7 @@ class OfflineManager { * Sideloads offline db * * @example - * await offlineManager.mergeOfflineRegions(path); + * await OfflineManager.mergeOfflineRegions(path); * * @param {String} path Path to offline tile db on file system. * @return {void} @@ -254,7 +255,7 @@ class OfflineManager { * Consult the Terms of Service for your map tile host before changing this value. * * @example - * offlineManager.setTileCountLimit(1000); + * OfflineManager.setTileCountLimit(1000); * * @param {Number} limit Map tile limit count. * @return {void} @@ -268,7 +269,7 @@ class OfflineManager { * The default is 500ms. * * @example - * offlineManager.setProgressEventThrottle(500); + * OfflineManager.setProgressEventThrottle(500); * * @param {Number} throttleValue event throttle value in ms. * @return {void} @@ -284,7 +285,7 @@ class OfflineManager { * @example * const progressListener = (offlinePack, status) => console.log(offlinePack, status) * const errorListener = (offlinePack, err) => console.log(offlinePack, err) - * offlineManager.subscribe('packName', progressListener, errorListener) + * OfflineManager.subscribe('packName', progressListener, errorListener) * * @param {string} packName Name of the offline pack. * @param {ProgressListener} progressListener Callback that listens for status events while downloading the offline resource. @@ -335,7 +336,7 @@ class OfflineManager { * It's a good idea to call this on componentWillUnmount. * * @example - * offlineManager.unsubscribe('packName') + * OfflineManager.unsubscribe('packName') * * @param {String} packName Name of the offline pack. * @return {void} @@ -421,4 +422,4 @@ class OfflineManager { } const offlineManager = new OfflineManager(); -export default offlineManager; +export { offlineManager as OfflineManager }; diff --git a/src/modules/offline/OfflinePack.ts b/src/modules/offline/OfflinePack.ts index 6503e883f..9357dbf7f 100644 --- a/src/modules/offline/OfflinePack.ts +++ b/src/modules/offline/OfflinePack.ts @@ -1,6 +1,6 @@ import { NativeModules } from "react-native"; -import OfflineCreatePackOptions from "./OfflineCreatePackOptions"; +import { OfflineCreatePackOptions } from "./OfflineCreatePackOptions"; const MLRNOfflineModule = NativeModules.MLRNOfflineModule; @@ -15,7 +15,7 @@ export type OfflinePackStatus = { requiredResourceCount: number; }; -class OfflinePack { +export class OfflinePack { private pack: OfflineCreatePackOptions; private _metadata: Record | null; @@ -52,5 +52,3 @@ class OfflinePack { return MLRNOfflineModule.pausePackDownload(this.name); } } - -export default OfflinePack; diff --git a/src/modules/snapshot/snapshotManager.ts b/src/modules/snapshot/SnapshotManager.ts similarity index 83% rename from src/modules/snapshot/snapshotManager.ts rename to src/modules/snapshot/SnapshotManager.ts index 58ecda39b..ed1f31d12 100644 --- a/src/modules/snapshot/snapshotManager.ts +++ b/src/modules/snapshot/SnapshotManager.ts @@ -1,11 +1,11 @@ import { NativeModules } from "react-native"; -import SnapshotOptions, { type SnapshotInputOptions } from "./SnapshotOptions"; +import { SnapshotOptions, type SnapshotInputOptions } from "./SnapshotOptions"; const MLRNSnapshotModule = NativeModules.MLRNSnapshotModule; /** - * The snapshotManager generates static raster images of the map. + * The SnapshotManager generates static raster images of the map. * Each snapshot image depicts a portion of a map defined by an SnapshotOptions object you provide. * The snapshotter generates the snapshot asynchronous. */ @@ -16,7 +16,7 @@ class SnapshotManager { * @example * * // creates a temp file png of base map - * const uri = await snapshotManager.takeSnap({ + * const uri = await SnapshotManager.takeSnap({ * centerCoordinate: [-74.126410, 40.797968], * width: width, * height: height, @@ -28,7 +28,7 @@ class SnapshotManager { * }); * * // creates base64 png of base map without logo - * const uri = await snapshotManager.takeSnap({ + * const uri = await SnapshotManager.takeSnap({ * centerCoordinate: [-74.126410, 40.797968], * width: width, * height: height, @@ -40,7 +40,7 @@ class SnapshotManager { * }); * * // creates snapshot with bounds - * const uri = await snapshotManager.takeSnap({ + * const uri = await SnapshotManager.takeSnap({ * bounds: [[-74.126410, 40.797968], [-74.143727, 40.772177]], * width: width, * height: height, @@ -59,4 +59,4 @@ class SnapshotManager { } const snapshotManager = new SnapshotManager(); -export default snapshotManager; +export { snapshotManager as SnapshotManager }; diff --git a/src/modules/snapshot/SnapshotOptions.ts b/src/modules/snapshot/SnapshotOptions.ts index a464c1e69..63bfb40b3 100644 --- a/src/modules/snapshot/SnapshotOptions.ts +++ b/src/modules/snapshot/SnapshotOptions.ts @@ -99,5 +99,3 @@ export class SnapshotOptions { return toJSONString(featureCollection(features)); } } - -export default SnapshotOptions; diff --git a/src/utils/BridgeValue.ts b/src/utils/BridgeValue.ts index 0d6ba5be1..6d51c4f47 100644 --- a/src/utils/BridgeValue.ts +++ b/src/utils/BridgeValue.ts @@ -16,7 +16,7 @@ export type StyleValueJSON = type StyleValueTypes = "boolean" | "number" | "string" | "hashmap" | "array"; -export default class BridgeValue { +export class BridgeValue { rawValue: RawValueType; constructor(rawValue: RawValueType) { diff --git a/src/utils/Logger.ts b/src/utils/Logger.ts index ea840996f..7a751d248 100644 --- a/src/utils/Logger.ts +++ b/src/utils/Logger.ts @@ -14,7 +14,7 @@ interface Log { type LogCallback = (log: Log) => boolean; -class Logger { +export class Logger { static instance: Logger | null = null; static sharedInstance(): Logger { @@ -129,5 +129,3 @@ class Logger { } } } - -export default Logger; diff --git a/src/utils/StyleValue.ts b/src/utils/StyleValue.ts index efa6a0353..cf9af59f7 100644 --- a/src/utils/StyleValue.ts +++ b/src/utils/StyleValue.ts @@ -1,6 +1,7 @@ import { Image, processColor } from "react-native"; -import BridgeValue, { +import { + BridgeValue, type RawValueType, type StyleValueJSON, } from "./BridgeValue"; diff --git a/src/utils/animated/AbstractAnimatedCoordinates.ts b/src/utils/animated/AbstractAnimatedCoordinates.ts index f4758e696..692abe171 100644 --- a/src/utils/animated/AbstractAnimatedCoordinates.ts +++ b/src/utils/animated/AbstractAnimatedCoordinates.ts @@ -17,7 +17,9 @@ const defaultConfig = { useNativeDriver: false, }; -abstract class AbstractAnimatedCoordinates extends AnimatedWithChildren { +export abstract class AbstractAnimatedCoordinates< + State, +> extends AnimatedWithChildren { constructor(coords: AnimatedCoordinates[]) { super(); @@ -130,5 +132,3 @@ abstract class AbstractAnimatedCoordinates extends AnimatedWithChildren { ); } } - -export default AbstractAnimatedCoordinates; diff --git a/src/utils/animated/Animated.ts b/src/utils/animated/Animated.ts index 0a684e193..93406d631 100644 --- a/src/utils/animated/Animated.ts +++ b/src/utils/animated/Animated.ts @@ -1,24 +1,29 @@ -import React from "react"; +import { + type ForwardRefExoticComponent, + type MemoExoticComponent, + type RefAttributes, +} from "react"; import { Animated as RNAnimated } from "react-native"; -import AnimatedCoordinatesArray from "./AnimatedCoordinatesArray"; -import AnimatedExtractCoordinateFromArray from "./AnimatedExtractCoordinateFromArray"; -import AnimatedRouteCoordinatesArray from "./AnimatedRouteCoordinatesArray"; -import AnimatedShape from "./AnimatedShape"; -import BackgroundLayer from "../../components/BackgroundLayer"; -import CircleLayer from "../../components/CircleLayer"; -import FillExtrusionLayer from "../../components/FillExtrusionLayer"; -import FillLayer from "../../components/FillLayer"; -import ImageSource from "../../components/ImageSource"; -import LineLayer from "../../components/LineLayer"; -import RasterLayer from "../../components/RasterLayer"; -import ShapeSource, { +import { AnimatedCoordinatesArray } from "./AnimatedCoordinatesArray"; +import { AnimatedExtractCoordinateFromArray } from "./AnimatedExtractCoordinateFromArray"; +import { AnimatedRouteCoordinatesArray } from "./AnimatedRouteCoordinatesArray"; +import { AnimatedShape } from "./AnimatedShape"; +import { BackgroundLayer } from "../../components/BackgroundLayer"; +import { CircleLayer } from "../../components/CircleLayer"; +import { FillExtrusionLayer } from "../../components/FillExtrusionLayer"; +import { FillLayer } from "../../components/FillLayer"; +import { ImageSource } from "../../components/ImageSource"; +import { LineLayer } from "../../components/LineLayer"; +import { RasterLayer } from "../../components/RasterLayer"; +import { + ShapeSource, type ShapeSourceProps, type ShapeSourceRef, } from "../../components/ShapeSource"; -import SymbolLayer from "../../components/SymbolLayer"; +import { SymbolLayer } from "../../components/SymbolLayer"; -const Animated = { +export const Animated = { // sources ShapeSource: RNAnimated.createAnimatedComponent(ShapeSource), ImageSource: RNAnimated.createAnimatedComponent(ImageSource), @@ -39,15 +44,14 @@ const Animated = { ExtractCoordinateFromArray: AnimatedExtractCoordinateFromArray, }; -type ShapeSourcePropsWithRef = ShapeSourceProps & - React.RefAttributes; +type ShapeSourcePropsWithRef = ShapeSourceProps & RefAttributes; type BaseShapeSourceComponent = - React.ForwardRefExoticComponent; + ForwardRefExoticComponent; type AnimatedShapeSourceType = RNAnimated.AnimatedComponent & - React.MemoExoticComponent; + MemoExoticComponent; /** * Manual typing is required for AnimatedShapeSource because the @@ -57,5 +61,3 @@ type AnimatedShapeSourceType = export const AnimatedShapeSource = RNAnimated.createAnimatedComponent( ShapeSource, ) as AnimatedShapeSourceType; - -export default Animated; diff --git a/src/utils/animated/AnimatedCoordinatesArray.ts b/src/utils/animated/AnimatedCoordinatesArray.ts index c622ee026..c5cdff6c1 100644 --- a/src/utils/animated/AnimatedCoordinatesArray.ts +++ b/src/utils/animated/AnimatedCoordinatesArray.ts @@ -1,4 +1,5 @@ -import AbstractAnimatedCoordinates, { +import { + AbstractAnimatedCoordinates, type AnimatedCoordinates, } from "./AbstractAnimatedCoordinates"; @@ -7,7 +8,7 @@ interface CoordinatesState { targetCoords: AnimatedCoordinates[]; } -class AnimatedCoordinatesArray extends AbstractAnimatedCoordinates { +export class AnimatedCoordinatesArray extends AbstractAnimatedCoordinates { /** * Subclasses can override to calculate initial state * @@ -109,5 +110,3 @@ class AnimatedCoordinatesArray extends AbstractAnimatedCoordinates { +export class AnimatedRouteCoordinatesArray extends AbstractAnimatedCoordinates { /** * Calculate initial state * diff --git a/src/utils/animated/AnimatedShape.ts b/src/utils/animated/AnimatedShape.ts index 133d36a64..3820d5409 100644 --- a/src/utils/animated/AnimatedShape.ts +++ b/src/utils/animated/AnimatedShape.ts @@ -2,9 +2,9 @@ import { Animated } from "react-native"; -import AnimatedCoordinatesArray from "./AnimatedCoordinatesArray"; -import AnimatedExtractCoordinateFromArray from "./AnimatedExtractCoordinateFromArray"; -import AnimatedRouteCoordinatesArray from "./AnimatedRouteCoordinatesArray"; +import { AnimatedCoordinatesArray } from "./AnimatedCoordinatesArray"; +import { AnimatedExtractCoordinateFromArray } from "./AnimatedExtractCoordinateFromArray"; +import { AnimatedRouteCoordinatesArray } from "./AnimatedRouteCoordinatesArray"; // see // https://github.com/facebook/react-native/blob/master/Libraries/Animated/src/nodes/AnimatedWithChildren.js @@ -34,7 +34,7 @@ type Shape = * @example * */ -class AnimatedShape extends AnimatedWithChildren { +export class AnimatedShape extends AnimatedWithChildren { // equivalent of AnimatedStyle for shapes // https://github.com/facebook/react-native/blob/master/Libraries/Animated/src/nodes/AnimatedStyle.js @@ -89,5 +89,3 @@ class AnimatedShape extends AnimatedWithChildren { super.__detach(); } } - -export default AnimatedShape; From 2ec0b7a347ec5451122b657feb29034e7fa26da7 Mon Sep 17 00:00:00 2001 From: Kilian Finger Date: Fri, 20 Dec 2024 10:50:24 +0100 Subject: [PATCH 16/19] fix: App imports --- packages/examples/src/examples/Annotations/MarkerView.tsx | 4 +++- packages/expo-app/index.js | 2 +- packages/react-native-app/index.js | 2 +- 3 files changed, 5 insertions(+), 3 deletions(-) diff --git a/packages/examples/src/examples/Annotations/MarkerView.tsx b/packages/examples/src/examples/Annotations/MarkerView.tsx index 841c35831..e4ba5f0ad 100644 --- a/packages/examples/src/examples/Annotations/MarkerView.tsx +++ b/packages/examples/src/examples/Annotations/MarkerView.tsx @@ -48,7 +48,7 @@ const COORDINATES = [ [-73.99155, 40.73681], ] as [GeoJSON.Position, GeoJSON.Position]; -export function MarkerViewExample() { +function MarkerViewExample() { return ( @@ -63,3 +63,5 @@ export function MarkerViewExample() { ); } + +export { MarkerViewExample as MarkerView }; diff --git a/packages/expo-app/index.js b/packages/expo-app/index.js index d2030392b..a88d16f24 100644 --- a/packages/expo-app/index.js +++ b/packages/expo-app/index.js @@ -1,4 +1,4 @@ -import App from "@maplibre-react-native/examples"; +import { App } from "@maplibre-react-native/examples"; import { registerRootComponent } from "expo"; registerRootComponent(App); diff --git a/packages/react-native-app/index.js b/packages/react-native-app/index.js index 47bf771d3..0268d26ba 100644 --- a/packages/react-native-app/index.js +++ b/packages/react-native-app/index.js @@ -1,4 +1,4 @@ -import App from "@maplibre-react-native/examples"; +import { App } from "@maplibre-react-native/examples"; import { AppRegistry } from "react-native"; import { name as appName } from "./app.json"; From 4c99fab31977235b98db5ed605850c28fba5441d Mon Sep 17 00:00:00 2001 From: Kilian Finger Date: Fri, 20 Dec 2024 19:37:33 +0100 Subject: [PATCH 17/19] refactor: align type imports --- jest.config.ts | 2 +- .../examples/src/examples/FillRasterLayer/GeoJSONSource.tsx | 2 +- packages/examples/src/examples/Map/TwoMapViews.tsx | 2 +- src/components/Camera.tsx | 2 +- 4 files changed, 4 insertions(+), 4 deletions(-) diff --git a/jest.config.ts b/jest.config.ts index c3597ca64..0155a8eae 100644 --- a/jest.config.ts +++ b/jest.config.ts @@ -1,4 +1,4 @@ -import type { Config } from "jest"; +import { type Config } from "jest"; const config: Config = { preset: "@testing-library/react-native", diff --git a/packages/examples/src/examples/FillRasterLayer/GeoJSONSource.tsx b/packages/examples/src/examples/FillRasterLayer/GeoJSONSource.tsx index b45746060..dec7f3727 100755 --- a/packages/examples/src/examples/FillRasterLayer/GeoJSONSource.tsx +++ b/packages/examples/src/examples/FillRasterLayer/GeoJSONSource.tsx @@ -5,7 +5,7 @@ import { MapView, ShapeSource, } from "@maplibre/maplibre-react-native"; -import type { FeatureCollection } from "geojson"; +import { type FeatureCollection } from "geojson"; import smileyFeatureCollection from "../../assets/geojson/smiley.json"; import gridPattern from "../../assets/images/maplibre.png"; diff --git a/packages/examples/src/examples/Map/TwoMapViews.tsx b/packages/examples/src/examples/Map/TwoMapViews.tsx index 642e6a22b..6cb096a18 100755 --- a/packages/examples/src/examples/Map/TwoMapViews.tsx +++ b/packages/examples/src/examples/Map/TwoMapViews.tsx @@ -3,7 +3,7 @@ import { MapView, ShapeSource, } from "@maplibre/maplibre-react-native"; -import type { FeatureCollection } from "geojson"; +import { type FeatureCollection } from "geojson"; import smileyFeatureCollection from "../../assets/geojson/smiley.json"; import { sheet } from "../../styles/sheet"; diff --git a/src/components/Camera.tsx b/src/components/Camera.tsx index 40e6e6f0a..0521dce3e 100644 --- a/src/components/Camera.tsx +++ b/src/components/Camera.tsx @@ -6,7 +6,7 @@ import { CameraModes } from "../MLRNModule"; import { useNativeRef } from "../hooks/useNativeRef"; import { type BaseProps } from "../types/BaseProps"; import { CameraMode } from "../types/CameraMode"; -import type { MapLibreRNEvent } from "../types/MapLibreRNEvent"; +import { type MapLibreRNEvent } from "../types/MapLibreRNEvent"; import { makeNativeBounds } from "../utils/makeNativeBounds"; export const NATIVE_MODULE_NAME = "MLRNCamera"; From a0ca331670eae5c808952a15b182aea3c6761e76 Mon Sep 17 00:00:00 2001 From: Kilian Finger Date: Fri, 20 Dec 2024 20:16:29 +0100 Subject: [PATCH 18/19] docs: add migration for imports --- docs/guides/migrations/v10.md | 26 ++++++++++++++++++++++++++ 1 file changed, 26 insertions(+) diff --git a/docs/guides/migrations/v10.md b/docs/guides/migrations/v10.md index 459af1340..7320bb22f 100644 --- a/docs/guides/migrations/v10.md +++ b/docs/guides/migrations/v10.md @@ -1,5 +1,31 @@ # Migrating to v10 +## Default Export removed + +The library no longer has a default export. Choose between named imports or namespace import. + +### Named Imports + +```diff +- import MapLibreGL from "@maplibre/maplibre-react-native"; ++ import { MapView } from "@maplibre/maplibre-react-native"; + +- ++ +``` + +### Namespace Import + +```diff +- import MapLibreGL from "@maplibre/maplibre-react-native"; ++ import * as MapLibreRN from "@maplibre/maplibre-react-native"; + +- ++ +``` + +Any namespace can be chosen, but using `MapLibreGL` is not recommended anymore due to risk of confusion. + ## Changes to `Camera` Component ### Default `animationMode` is now `CameraMode.None` From 149966d9c020b0ba4084044699025ea55831cbc2 Mon Sep 17 00:00:00 2001 From: Kilian Finger Date: Fri, 20 Dec 2024 21:38:03 +0100 Subject: [PATCH 19/19] docs: remove MapLibreRN --- docs/components/MapView.md | 2 +- docs/docs.json | 2 +- src/components/MapView.tsx | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/docs/components/MapView.md b/docs/components/MapView.md index 47a8fef7b..227357562 100644 --- a/docs/components/MapView.md +++ b/docs/components/MapView.md @@ -8,7 +8,7 @@ MapView backed by MapLibre Native | ---- | :--: | :-----: | :------: | :----------: | | contentInset | `number[] \| number` | `none` | `false` | The distance from the edges of the map view’s frame to the edges of the map view’s logical viewport. | | style | `ViewProps["style"]` | `none` | `false` | Style for wrapping React Native View | -| mapStyle | `string \| object` | `none` | `false` | Style for map - either a URL or a Style JSON (https://maplibre.org/maplibre-style-spec/). Default: `MapLibreRN.StyleURL.Default` | +| mapStyle | `string \| object` | `none` | `false` | Style for map - either a URL or a Style JSON (https://maplibre.org/maplibre-style-spec/). Default: `StyleURL.Default` | | preferredFramesPerSecond | `number` | `none` | `false` | iOS: The preferred frame rate at which the map view is rendered.
The default value for this property is MLNMapViewPreferredFramesPerSecondDefault,
which will adaptively set the preferred frame rate based on the capability of
the user’s device to maintain a smooth experience. This property can be set to arbitrary integer values.

Android: The maximum frame rate at which the map view is rendered, but it can't excess the ability of device hardware.
This property can be set to arbitrary integer values. | | localizeLabels | `boolean` | `false` | `false` | Automatically change the language of the map labels to the system’s preferred language,
this is not something that can be toggled on/off | | zoomEnabled | `boolean` | `none` | `false` | Enable/Disable zoom on the map | diff --git a/docs/docs.json b/docs/docs.json index 93b60681a..21f346e12 100644 --- a/docs/docs.json +++ b/docs/docs.json @@ -2409,7 +2409,7 @@ "required": false, "type": "string \\| object", "default": "none", - "description": "Style for map - either a URL or a Style JSON (https://maplibre.org/maplibre-style-spec/). Default: `MapLibreRN.StyleURL.Default`" + "description": "Style for map - either a URL or a Style JSON (https://maplibre.org/maplibre-style-spec/). Default: `StyleURL.Default`" }, { "name": "preferredFramesPerSecond", diff --git a/src/components/MapView.tsx b/src/components/MapView.tsx index 535b5f387..8315c5216 100644 --- a/src/components/MapView.tsx +++ b/src/components/MapView.tsx @@ -67,7 +67,7 @@ interface MapViewProps extends BaseProps { */ style?: ViewProps["style"]; /** - * Style for map - either a URL or a Style JSON (https://maplibre.org/maplibre-style-spec/). Default: `MapLibreRN.StyleURL.Default` + * Style for map - either a URL or a Style JSON (https://maplibre.org/maplibre-style-spec/). Default: `StyleURL.Default` */ mapStyle?: string | object; /**