Skip to content

Add TypeScript types for Standard Style configuration #4210

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
mfazekas wants to merge 4 commits into
base: main
Choose a base branch
from
Open

Add TypeScript types for Standard Style configuration #4210

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
ca1b0b1
feat: add TypeScript types for Standard Style configuration
mfazekas May 17, 2026
b10087f
Include generated docs
mfazekas May 17, 2026
6fc6eab
Upgrade react-docgen to v8, fix intersection/union type rendering in …
mfazekas May 17, 2026
f601ef9
Fix index signature key rendering in docs
mfazekas May 17, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 5 additions & 2 deletions docs/Camera.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,10 @@ The location on which the map should center.
### bounds

```tsx
intersection
type Bounds = {
ne: Position; /* FIX ME NO DESCRIPTION */
sw: Position; /* FIX ME NO DESCRIPTION */
}
```
The corners of a box around which the map should bound. Contains padding props for backwards
compatibility; the root `padding` prop should be used instead.
Expand Down Expand Up @@ -217,7 +220,7 @@ compatibility; the root `padding` prop should be used instead. */
zoomLevel: number; /* The zoom level of the map. */
padding: signature; /* The viewport padding in points. */
animationDuration: number; /* The duration the map takes to animate to a new configuration. */
animationMode: union; /* The easing or path the camera uses to animate to a new configuration. */
animationMode: 'flyTo' \| 'easeTo' \| 'linearTo' \| 'moveTo' \| 'none'; /* The easing or path the camera uses to animate to a new configuration. */
}
```
The configuration that the camera falls back on, if no other values are specified.
Expand Down
2 changes: 1 addition & 1 deletion docs/Images.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ Images defines the images used in Symbol etc. layers.

```tsx
type Images = {
[object Object]: union; /* FIX ME NO DESCRIPTION */
[key: string]: string \| ImageSourcePropType \| ImageEntryData; /* FIX ME NO DESCRIPTION */
}
```
Specifies the external images in key-value pairs required for the shape source.
Expand Down
2 changes: 1 addition & 1 deletion docs/Models.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ Name of 3D model assets to be used in the map

```tsx
type Models = {
[object Object]: union; /* FIX ME NO DESCRIPTION */
[key: string]: string \| number; /* FIX ME NO DESCRIPTION */
}
```
_required_
Expand Down
28 changes: 27 additions & 1 deletion docs/StyleImport.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,12 +39,38 @@ existing is now always required as true

```tsx
type Config = {
[object Object]: string; /* FIX ME NO DESCRIPTION */
lightPreset: 'dawn' \| 'day' \| 'dusk' \| 'night'; /* Light preset: controls time-of-day lighting */
theme: 'default' \| 'faded' \| 'monochrome'; /* Color theme */
font: string; /* Font family for labels (e.g., 'Montserrat') */
show3dObjects: boolean; /* Show generic 3D objects */
show3dBuildings: boolean; /* Show extruded 3D buildings */
show3dFacades: boolean; /* Show 3D building facades (v11.16+) */
show3dLandmarks: boolean; /* Show 3D landmarks (v11.16+) */
show3dTrees: boolean; /* Show 3D trees (v11.17+) */
showPointOfInterestLabels: boolean; /* Show point of interest labels */
showTransitLabels: boolean; /* Show transit labels */
showPlaceLabels: boolean; /* Show place labels */
showRoadLabels: boolean; /* Show road labels */
showPedestrianRoads: boolean; /* Show pedestrian roads */
colorBuildings: string; /* Color override for buildings (v11.18+) */
colorCommercial: string; /* Color override for commercial areas (v11.18+) */
colorEducation: string; /* Color override for education areas (v11.18+) */
colorIndustrial: string; /* Color override for industrial areas (v11.18+) */
colorLand: string; /* Color override for land (v11.18+) */
colorMedical: string; /* Color override for medical areas (v11.18+) */
colorRoads: string; /* Color override for roads (v11.18+) */
colorMotorways: string; /* Color override for motorways (v11.18+) */
colorWater: string; /* Color override for water (v11.18+) */
colorGreenspaces: string; /* Color override for greenspaces (v11.18+) */
colorBoundaries: string; /* Color override for boundaries (v11.18+) */
}
```
_required_
config is a dictionary of configuration options for the style import.

When using the Mapbox Standard style with `id="basemap"`, use {@link StandardStyleConfig}
keys for autocomplete. Arbitrary keys are also accepted for forward compatibility.

See https://github.com/mapbox/mapbox-maps-ios/blob/main/Sources/MapboxMaps/Documentation.docc/Migrate%20to%20v11.md#21-the-mapbox-standard-style


Expand Down
205 changes: 189 additions & 16 deletions docs/docs.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -747,7 +747,25 @@
{
"name": "bounds",
"required": false,
"type": "intersection",
"type": {
"name": "shape",
"value": [
{
"name": "ne",
"required": true,
"type": "Position",
"default": "none",
"description": "FIX ME NO DESCRIPTION"
},
{
"name": "sw",
"required": true,
"type": "Position",
"default": "none",
"description": "FIX ME NO DESCRIPTION"
}
]
},
"default": "none",
"description": "The corners of a box around which the map should bound. Contains padding props for backwards\ncompatibility; the root `padding` prop should be used instead."
},
Expand Down Expand Up @@ -971,7 +989,7 @@
{
"name": "animationMode",
"required": false,
"type": "union",
"type": "'flyTo' \\| 'easeTo' \\| 'linearTo' \\| 'moveTo' \\| 'none'",
"default": "none",
"description": "The easing or path the camera uses to animate to a new configuration."
}
Expand Down Expand Up @@ -3479,11 +3497,9 @@
"name": "shape",
"value": [
{
"name": {
"name": "string"
},
"name": "[key: string]",
"required": true,
"type": "union",
"type": "string \\| ImageSourcePropType \\| ImageEntryData",
"default": "none",
"description": "FIX ME NO DESCRIPTION"
}
Expand Down Expand Up @@ -6360,11 +6376,9 @@
"name": "shape",
"value": [
{
"name": {
"name": "string"
},
"name": "[key: string]",
"required": true,
"type": "union",
"type": "string \\| number",
"default": "none",
"description": "FIX ME NO DESCRIPTION"
}
Expand Down Expand Up @@ -8130,18 +8144,177 @@
"name": "shape",
"value": [
{
"name": {
"name": "string"
},
"required": true,
"name": "lightPreset",
"required": false,
"type": "'dawn' \\| 'day' \\| 'dusk' \\| 'night'",
"default": "none",
"description": "Light preset: controls time-of-day lighting"
},
{
"name": "theme",
"required": false,
"type": "'default' \\| 'faded' \\| 'monochrome'",
"default": "none",
"description": "Color theme"
},
{
"name": "font",
"required": false,
"type": "string",
"default": "none",
"description": "FIX ME NO DESCRIPTION"
"description": "Font family for labels (e.g., 'Montserrat')"
},
{
"name": "show3dObjects",
"required": false,
"type": "boolean",
"default": "none",
"description": "Show generic 3D objects"
},
{
"name": "show3dBuildings",
"required": false,
"type": "boolean",
"default": "none",
"description": "Show extruded 3D buildings"
},
{
"name": "show3dFacades",
"required": false,
"type": "boolean",
"default": "none",
"description": "Show 3D building facades (v11.16+)"
},
{
"name": "show3dLandmarks",
"required": false,
"type": "boolean",
"default": "none",
"description": "Show 3D landmarks (v11.16+)"
},
{
"name": "show3dTrees",
"required": false,
"type": "boolean",
"default": "none",
"description": "Show 3D trees (v11.17+)"
},
{
"name": "showPointOfInterestLabels",
"required": false,
"type": "boolean",
"default": "none",
"description": "Show point of interest labels"
},
{
"name": "showTransitLabels",
"required": false,
"type": "boolean",
"default": "none",
"description": "Show transit labels"
},
{
"name": "showPlaceLabels",
"required": false,
"type": "boolean",
"default": "none",
"description": "Show place labels"
},
{
"name": "showRoadLabels",
"required": false,
"type": "boolean",
"default": "none",
"description": "Show road labels"
},
{
"name": "showPedestrianRoads",
"required": false,
"type": "boolean",
"default": "none",
"description": "Show pedestrian roads"
},
{
"name": "colorBuildings",
"required": false,
"type": "string",
"default": "none",
"description": "Color override for buildings (v11.18+)"
},
{
"name": "colorCommercial",
"required": false,
"type": "string",
"default": "none",
"description": "Color override for commercial areas (v11.18+)"
},
{
"name": "colorEducation",
"required": false,
"type": "string",
"default": "none",
"description": "Color override for education areas (v11.18+)"
},
{
"name": "colorIndustrial",
"required": false,
"type": "string",
"default": "none",
"description": "Color override for industrial areas (v11.18+)"
},
{
"name": "colorLand",
"required": false,
"type": "string",
"default": "none",
"description": "Color override for land (v11.18+)"
},
{
"name": "colorMedical",
"required": false,
"type": "string",
"default": "none",
"description": "Color override for medical areas (v11.18+)"
},
{
"name": "colorRoads",
"required": false,
"type": "string",
"default": "none",
"description": "Color override for roads (v11.18+)"
},
{
"name": "colorMotorways",
"required": false,
"type": "string",
"default": "none",
"description": "Color override for motorways (v11.18+)"
},
{
"name": "colorWater",
"required": false,
"type": "string",
"default": "none",
"description": "Color override for water (v11.18+)"
},
{
"name": "colorGreenspaces",
"required": false,
"type": "string",
"default": "none",
"description": "Color override for greenspaces (v11.18+)"
},
{
"name": "colorBoundaries",
"required": false,
"type": "string",
"default": "none",
"description": "Color override for boundaries (v11.18+)"
}
]
},
"default": "none",
"description": "config is a dictionary of configuration options for the style import.\n\nSee https://github.com/mapbox/mapbox-maps-ios/blob/main/Sources/MapboxMaps/Documentation.docc/Migrate%20to%20v11.md#21-the-mapbox-standard-style"
"description": "config is a dictionary of configuration options for the style import.\n\nWhen using the Mapbox Standard style with `id=\"basemap\"`, use {@link StandardStyleConfig}\nkeys for autocomplete. Arbitrary keys are also accepted for forward compatibility.\n\nSee https://github.com/mapbox/mapbox-maps-ios/blob/main/Sources/MapboxMaps/Documentation.docc/Migrate%20to%20v11.md#21-the-mapbox-standard-style"
}
],
"fileNameWithExt": "StyleImport.tsx",
Expand Down
2 changes: 1 addition & 1 deletion example/src/examples/V11/StyleImportConfig.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import { useState } from 'react';
import { MapView, Camera, StyleImport } from '@rnmapbox/maps';

const StyleImportConfig = () => {
const [lightPreset, setLightPreset] = useState('night');
const [lightPreset, setLightPreset] = useState<'day' | 'night'>('night');
const nextLightPreset = lightPreset === 'night' ? 'day' : 'night';
return (
<>
Expand Down
2 changes: 1 addition & 1 deletion package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -116,7 +116,7 @@
"node-dir": "0.1.17",
"prettier": "^3.6.2",
"react": "19.1.0",
"react-docgen": "rnmapbox/react-docgen#rnmapbox-dist-react-docgen-v6",
"react-docgen": "rnmapbox/react-docgen#rnmapbox-dist-react-docgen-v8",
"react-native": "0.81.1",
"react-native-builder-bob": "^0.40.13",
"react-test-renderer": "19.1.0",
Expand Down
Loading
Loading