@mapbox/mapbox-gl-style-spec 13.24.0-alpha.6 → 13.25.0-beta.1

package/reference/v8.json

@@ -63,7 +63,7 @@
     },
     "fog": {
       "type": "fog",
-      "doc": "A global effect that fades layers and markers based on their distance to the camera. The fog can be used to approximate the effect of atmosphere on distant objects and enhance the depth perception of the map when used with terrain or 3D features."
+      "doc": "A global effect that fades layers and markers based on their distance to the camera. The fog can be used to approximate the effect of atmosphere on distant objects and enhance the depth perception of the map when used with terrain or 3D features. Note: fog is renamed to atmosphere in the Android and iOS SDKs and planned to be changed in GL-JS v.3.0.0."
     },
     "sources": {
       "required": true,
@@ -3816,7 +3816,9 @@
       ],
       "sdk-support": {
         "basic functionality": {
-          "js": "2.3.0"
+          "js": "2.3.0",
+          "android": "10.6.0",
+          "ios": "10.6.0"
         }
       }
     },
@@ -3831,17 +3833,86 @@
         ]
       },
       "transition": true,
-      "doc": "The color of the fog. Using opacity is recommended only for smoothly transitioning fog on/off as anything less than 100% opacity results in more tiles loaded and drawn.",
+      "doc": "The color of the atmosphere region immediately below the horizon and within the `range` and above the horizon and within `horizon-blend`. Using opacity is recommended only for smoothly transitioning fog on/off as anything less than 100% opacity results in more tiles loaded and drawn.",
       "sdk-support": {
         "basic functionality": {
-          "js": "2.3.0"
+          "js": "2.3.0",
+          "android": "10.6.0",
+          "ios": "10.6.0"
+        }
+      }
+    },
+    "high-color": {
+      "type": "color",
+      "property-type": "data-constant",
+      "default": "#245cdf",
+      "expression": {
+        "interpolated": true,
+        "parameters": [
+          "zoom"
+        ]
+      },
+      "transition": true,
+      "doc": "The color of the atmosphere region above the horizon, `high-color` extends further above the horizon than the `color` property and its spread can be controlled with `horizon-blend`. The opacity can be set to `0` to remove the high atmosphere color contribution.",
+      "sdk-support": {
+        "basic functionality": {
+          "js": "2.9.0",
+          "android": "10.6.0",
+          "ios": "10.6.0"
+        }
+      }
+    },
+    "space-color": {
+      "type": "color",
+      "property-type": "data-constant",
+
+      "default":
+      [
+        "interpolate",
+        [
+          "linear"
+        ],
+        [
+          "zoom"
+        ],
+        4,
+        "#010b19",
+        7,
+        "#367ab9"
+      ],
+      "expression": {
+        "interpolated": true,
+        "parameters": [
+          "zoom"
+        ]
+      },
+      "transition": true,
+      "doc": "The color of the region above the horizon and after the end of the `horizon-blend` contribution. The opacity can be set to `0` to have a transparent background.",
+      "sdk-support": {
+        "basic functionality": {
+          "js": "2.9.0",
+          "android": "10.6.0",
+          "ios": "10.6.0"
         }
       }
     },
     "horizon-blend": {
       "type": "number",
       "property-type": "data-constant",
-      "default": 0.1,
+      "default":
+      [
+        "interpolate",
+        [
+          "linear"
+        ],
+        [
+          "zoom"
+        ],
+        4,
+        0.2,
+        7,
+        0.1
+      ],
       "minimum": 0,
       "maximum": 1,
       "expression": {
@@ -3851,10 +3922,47 @@
         ]
       },
       "transition": true,
-      "doc": "Horizon blend applies a smooth fade from the color of the fog to the color of the sky. A value of zero leaves a sharp transition from fog to sky. Increasing the value blends the color of fog into increasingly high angles of the sky.",
+      "doc": "Horizon blend applies a smooth fade from the color of the atmosphere to the color of space. A value of zero leaves a sharp transition from atmosphere to space. Increasing the value blends the color of atmosphere into increasingly high angles of the sky.",
       "sdk-support": {
         "basic functionality": {
-          "js": "2.3.0"
+          "js": "2.3.0",
+          "android": "10.6.0",
+          "ios": "10.6.0"
+        }
+      }
+    },
+    "star-intensity": {
+      "type": "number",
+      "property-type": "data-constant",
+      "default":
+      [
+        "interpolate",
+        [
+          "linear"
+        ],
+        [
+          "zoom"
+        ],
+        5,
+        0.35,
+        6,
+        0
+      ],
+      "minimum": 0,
+      "maximum": 1,
+      "expression": {
+        "interpolated": true,
+        "parameters": [
+          "zoom"
+        ]
+      },
+      "transition": true,
+      "doc": "A value controlling the star intensity where `0` will show no stars and `1` will show stars at their maximum intensity.",
+      "sdk-support": {
+        "basic functionality": {
+          "js": "2.9.0",
+          "android": "10.6.0",
+          "ios": "10.6.0"
         }
       }
     }
@@ -4083,6 +4191,9 @@
       },
       "transition": true,
       "doc": "Exaggerates the elevation of the terrain by multiplying the data from the DEM with this value.",
+      "requires": [
+        "source"
+      ],
       "sdk-support": {
         "basic functionality": {
           "js": "2.0.0",
@@ -4879,6 +4990,32 @@
         ]
       },
       "property-type": "color-ramp"
+    },
+    "line-trim-offset": {
+      "type": "array",
+      "value": "number",
+      "doc": "The line part between [trim-start, trim-end] will be marked as transparent to make a route vanishing effect. The line trim-off offset is based on the whole line gradient range [0.0, 1.0]. If either 'trim-start' or 'trim-end' offset is out of valid range, the default range will be set.",
+      "length": 2,
+      "default": [0.0, 0.0],
+      "transition": false,
+      "requires": [
+          "line-gradient",
+          {
+              "source": "geojson",
+              "has": {
+                  "lineMetrics": true
+              }
+          }
+      ],
+      "sdk-support": {
+        "basic functionality": {
+          "js": "2.3.0",
+          "android": "10.5.0",
+          "ios": "10.5.0",
+          "macos": "10.5.0"
+        }
+      },
+      "property-type": "constant"
     }
   },
   "paint_circle": {

package/types.js

@@ -91,7 +91,10 @@ export type TerrainSpecification = {|
 export type FogSpecification = {|
     "range"?: PropertyValueSpecification<[number, number]>,
     "color"?: PropertyValueSpecification<ColorSpecification>,
-    "horizon-blend"?: PropertyValueSpecification<number>
+    "high-color"?: PropertyValueSpecification<ColorSpecification>,
+    "space-color"?: PropertyValueSpecification<ColorSpecification>,
+    "horizon-blend"?: PropertyValueSpecification<number>,
+    "star-intensity"?: PropertyValueSpecification<number>
 |}
 
 export type ProjectionSpecification = {|
@@ -229,7 +232,8 @@ export type LineLayerSpecification = {|
         "line-blur"?: DataDrivenPropertyValueSpecification<number>,
         "line-dasharray"?: DataDrivenPropertyValueSpecification<Array<number>>,
         "line-pattern"?: DataDrivenPropertyValueSpecification<ResolvedImageSpecification>,
-        "line-gradient"?: ExpressionSpecification
+        "line-gradient"?: ExpressionSpecification,
+        "line-trim-offset"?: [number, number]
     |}
 |}
 

package/util/color.js

@@ -77,6 +77,11 @@ class Color {
         return `rgba(${Math.round(r)},${Math.round(g)},${Math.round(b)},${a})`;
     }
 
+    /**
+     * Returns an RGBA array of values representing the color, unpremultiplied by A.
+     *
+     * @returns An array of RGBA color values in the range [0, 255].
+     */
     toArray(): [number, number, number, number] {
         const {r, g, b, a} = this;
         return a === 0 ? [0, 0, 0, 0] : [
@@ -86,6 +91,36 @@ class Color {
             a
         ];
     }
+
+    /**
+     * Returns a RGBA array of float values representing the color, unpremultiplied by A.
+     *
+     * @returns An array of RGBA color values in the range [0, 1].
+     */
+    toArray01(): [number, number, number, number] {
+        const {r, g, b, a} = this;
+        return a === 0 ? [0, 0, 0, 0] : [
+            r / a,
+            g / a,
+            b / a,
+            a
+        ];
+    }
+
+    /**
+     * Returns an RGBA array of values representing the color, premultiplied by A.
+     *
+     * @returns An array of RGBA color values in the range [0, 1].
+     */
+    toArray01PremultipliedAlpha(): [number, number, number, number] {
+        const {r, g, b, a} = this;
+        return [
+            r,
+            g,
+            b,
+            a
+        ];
+    }
 }
 
 Color.black = new Color(0, 0, 0, 1);

package/validate/validate.js

@@ -1,3 +1,4 @@
+// @flow
 
 import extend from '../util/extend.js';
 import {unbundle, deepUnbundle} from '../util/unbundle_jsonlint.js';
@@ -23,6 +24,10 @@ import validateFormatted from './validate_formatted.js';
 import validateImage from './validate_image.js';
 import validateProjection from './validate_projection.js';
 
+import type {StyleReference} from '../reference/latest.js';
+import type {StyleSpecification} from '../types.js';
+import type ValidationError from '../error/validation_error.js';
+
 const VALIDATORS = {
     '*'() {
         return [];
@@ -55,8 +60,15 @@ const VALIDATORS = {
 //   scalar value.
 // - valueSpec: current spec being evaluated. Tracks value.
 // - styleSpec: current full spec being evaluated.
+export type ValidationOptions = {
+    key: string;
+    value: Object;
+    valueSpec: Object;
+    style: $Shape<StyleSpecification>;
+    styleSpec: StyleReference;
+}
 
-export default function validate(options) {
+export default function validate(options: ValidationOptions): Array<ValidationError> {
     const value = options.value;
     const valueSpec = options.valueSpec;
     const styleSpec = options.styleSpec;

package/validate/validate_array.js

@@ -1,9 +1,16 @@
+// @flow
 
 import getType from '../util/get_type.js';
 import validate from './validate.js';
 import ValidationError from '../error/validation_error.js';
 
-export default function validateArray(options) {
+import type {ValidationOptions} from './validate.js';
+
+type Options = ValidationOptions & {
+    arrayElementValidator: Function;
+};
+
+export default function validateArray(options: Options): Array<ValidationError> {
     const array = options.value;
     const arraySpec = options.valueSpec;
     const style = options.style;
@@ -27,7 +34,8 @@ export default function validateArray(options) {
         "type": arraySpec.value,
         "values": arraySpec.values,
         "minimum": arraySpec.minimum,
-        "maximum": arraySpec.maximum
+        "maximum": arraySpec.maximum,
+        function: undefined
     };
 
     if (styleSpec.$version < 7) {

package/validate/validate_boolean.js

@@ -1,8 +1,11 @@
+// @flow
 
 import getType from '../util/get_type.js';
 import ValidationError from '../error/validation_error.js';
 
-export default function validateBoolean(options) {
+import type {ValidationOptions} from './validate.js';
+
+export default function validateBoolean(options: ValidationOptions): Array<ValidationError> {
     const value = options.value;
     const key = options.key;
     const type = getType(value);

package/validate/validate_color.js

@@ -1,9 +1,12 @@
+// @flow
 
 import ValidationError from '../error/validation_error.js';
 import getType from '../util/get_type.js';
 import {parseCSSColor} from 'csscolorparser';
 
-export default function validateColor(options) {
+import type {ValidationOptions} from './validate.js';
+
+export default function validateColor(options: ValidationOptions): Array<ValidationError> {
     const key = options.key;
     const value = options.value;
     const type = getType(value);

package/validate/validate_enum.js

@@ -1,8 +1,11 @@
+// @flow
 
 import ValidationError from '../error/validation_error.js';
 import {unbundle} from '../util/unbundle_jsonlint.js';
 
-export default function validateEnum(options) {
+import type {ValidationOptions} from './validate.js';
+
+export default function validateEnum(options: ValidationOptions): Array<ValidationError> {
     const key = options.key;
     const value = options.value;
     const valueSpec = options.valueSpec;

package/validate/validate_expression.js

@@ -52,8 +52,11 @@ export function disallowedFilterParameters(e: Expression, options: any): Array<V
         'pitch',
         'distance-from-center'
     ]);
-    for (const param of options.valueSpec.expression.parameters) {
-        disallowedParameters.delete(param);
+
+    if (options.valueSpec && options.valueSpec.expression) {
+        for (const param of options.valueSpec.expression.parameters) {
+            disallowedParameters.delete(param);
+        }
     }
 
     if (disallowedParameters.size === 0) {

package/validate/validate_filter.js

@@ -1,3 +1,4 @@
+// @flow
 
 import ValidationError from '../error/validation_error.js';
 import validateExpression from './validate_expression.js';
@@ -7,13 +8,20 @@ import {unbundle, deepUnbundle} from '../util/unbundle_jsonlint.js';
 import extend from '../util/extend.js';
 import {isExpressionFilter} from '../feature_filter/index.js';
 
-export default function validateFilter(options) {
+import type {ValidationOptions} from './validate.js';
+
+type Options = ValidationOptions & {
+    layerType: string;
+}
+
+export default function validateFilter(options: Options): Array<ValidationError> {
     if (isExpressionFilter(deepUnbundle(options.value))) {
-        const layerType = deepUnbundle(options.layerType);
+        // We default to a layerType of `fill` because that points to a non-dynamic filter definition within the style-spec.
+        const layerType = options.layerType || 'fill';
+
         return validateExpression(extend({}, options, {
             expressionContext: 'filter',
-            // We default to a layerType of `fill` because that points to a non-dynamic filter definition within the style-spec.
-            valueSpec: options.styleSpec[`filter_${layerType || 'fill'}`]
+            valueSpec: options.styleSpec[`filter_${layerType}`]
         }));
     } else {
         return validateNonExpressionFilter(options);

package/validate/validate_fog.js

@@ -1,9 +1,12 @@
+// @flow
 
 import ValidationError from '../error/validation_error.js';
 import validate from './validate.js';
 import getType from '../util/get_type.js';
 
-export default function validateFog(options) {
+import type {ValidationOptions} from './validate.js';
+
+export default function validateFog(options: ValidationOptions): Array<ValidationError> {
     const fog = options.value;
     const style = options.style;
     const styleSpec = options.styleSpec;

package/validate/validate_formatted.js

@@ -1,8 +1,12 @@
 // @flow
+
 import validateExpression from './validate_expression.js';
 import validateString from './validate_string.js';
 
-export default function validateFormatted(options: any) {
+import type {ValidationOptions} from './validate.js';
+import type ValidationError from '../error/validation_error.js';
+
+export default function validateFormatted(options: ValidationOptions): Array<ValidationError> {
     if (validateString(options).length === 0) {
         return [];
     }

package/validate/validate_function.js

@@ -1,3 +1,4 @@
+// @flow
 
 import ValidationError from '../error/validation_error.js';
 import getType from '../util/get_type.js';
@@ -13,11 +14,13 @@ import {
     supportsInterpolation
 } from '../util/properties.js';
 
-export default function validateFunction(options) {
+import type {ValidationOptions} from './validate.js';
+
+export default function validateFunction(options: ValidationOptions): any {
     const functionValueSpec = options.valueSpec;
     const functionType = unbundle(options.value.type);
     let stopKeyType;
-    let stopDomainValues = {};
+    let stopDomainValues: {[string | number]: boolean} = {};
     let previousStopDomainValue;
     let previousStopDomainZoom;
 
@@ -66,7 +69,7 @@ export default function validateFunction(options) {
 
     return errors;
 
-    function validateFunctionStops(options) {
+    function validateFunctionStops(options: ValidationOptions) {
         if (functionType === 'identity') {
             return [new ValidationError(options.key, options.value, 'identity function may not have a "stops" property')];
         }
@@ -90,7 +93,7 @@ export default function validateFunction(options) {
         return errors;
     }
 
-    function validateFunctionStop(options) {
+    function validateFunctionStop(options: ValidationOptions) {
         let errors = [];
         const value = options.value;
         const key = options.key;
@@ -113,11 +116,17 @@ export default function validateFunction(options) {
             if (value[0].value === undefined) {
                 return [new ValidationError(key, value, 'object stop key must have value')];
             }
-            if (previousStopDomainZoom && previousStopDomainZoom > unbundle(value[0].zoom)) {
+
+            const nextStopDomainZoom = unbundle(value[0].zoom);
+            if (typeof nextStopDomainZoom !== 'number') {
+                return [new ValidationError(key, value[0].zoom, 'stop zoom values must be numbers')];
+            }
+
+            if (previousStopDomainZoom && previousStopDomainZoom > nextStopDomainZoom) {
                 return [new ValidationError(key, value[0].zoom, 'stop zoom values must appear in ascending order')];
             }
-            if (unbundle(value[0].zoom) !== previousStopDomainZoom) {
-                previousStopDomainZoom = unbundle(value[0].zoom);
+            if (nextStopDomainZoom !== previousStopDomainZoom) {
+                previousStopDomainZoom = nextStopDomainZoom;
                 previousStopDomainValue = undefined;
                 stopDomainValues = {};
             }
@@ -152,7 +161,7 @@ export default function validateFunction(options) {
         }));
     }
 
-    function validateStopDomainValue(options, stop) {
+    function validateStopDomainValue(options: ValidationOptions, stop) {
         const type = getType(options.value);
         const value = unbundle(options.value);
 
@@ -164,7 +173,7 @@ export default function validateFunction(options) {
             return [new ValidationError(options.key, reportValue, `${type} stop domain type must match previous stop domain type ${stopKeyType}`)];
         }
 
-        if (type !== 'number' && type !== 'string' && type !== 'boolean') {
+        if (type !== 'number' && type !== 'string' && type !== 'boolean' && typeof value !== 'number' && typeof value !== 'string' && typeof value !== 'boolean') {
             return [new ValidationError(options.key, reportValue, 'stop domain value must be a number, string, or boolean')];
         }
 
@@ -176,26 +185,26 @@ export default function validateFunction(options) {
             return [new ValidationError(options.key, reportValue, message)];
         }
 
-        if (functionType === 'categorical' && type === 'number' && (!isFinite(value) || Math.floor(value) !== value)) {
-            return [new ValidationError(options.key, reportValue, `integer expected, found ${value}`)];
+        if (functionType === 'categorical' && type === 'number' && (typeof value !== 'number' || !isFinite(value) || Math.floor(value) !== value)) {
+            return [new ValidationError(options.key, reportValue, `integer expected, found ${String(value)}`)];
         }
 
-        if (functionType !== 'categorical' && type === 'number' && previousStopDomainValue !== undefined && value < previousStopDomainValue) {
+        if (functionType !== 'categorical' && type === 'number' && typeof value === 'number' && typeof previousStopDomainValue === 'number' && previousStopDomainValue !== undefined && value < previousStopDomainValue) {
             return [new ValidationError(options.key, reportValue, 'stop domain values must appear in ascending order')];
         } else {
             previousStopDomainValue = value;
         }
 
-        if (functionType === 'categorical' && value in stopDomainValues) {
+        if (functionType === 'categorical' && (value: any) in stopDomainValues) {
             return [new ValidationError(options.key, reportValue, 'stop domain values must be unique')];
         } else {
-            stopDomainValues[value] = true;
+            stopDomainValues[(value: any)] = true;
         }
 
         return [];
     }
 
-    function validateFunctionDefault(options) {
+    function validateFunctionDefault(options: ValidationOptions) {
         return validate({
             key: options.key,
             value: options.value,

package/validate/validate_glyphs_url.js

@@ -1,8 +1,11 @@
+// @flow
 
 import ValidationError from '../error/validation_error.js';
 import validateString from './validate_string.js';
 
-export default function(options) {
+import type {ValidationOptions} from './validate.js';
+
+export default function(options: ValidationOptions): Array<ValidationError> {
     const value = options.value;
     const key = options.key;
 

package/validate/validate_image.js

@@ -1,8 +1,12 @@
 // @flow
+
 import validateExpression from './validate_expression.js';
 import validateString from './validate_string.js';
 
-export default function validateImage(options: any) {
+import type {ValidationOptions} from './validate.js';
+import type ValidationError from '../error/validation_error.js';
+
+export default function validateImage(options: ValidationOptions): Array<ValidationError> {
     if (validateString(options).length === 0) {
         return [];
     }

package/validate/validate_layer.js

@@ -1,3 +1,4 @@
+// @flow
 
 import ValidationError from '../error/validation_error.js';
 import {unbundle} from '../util/unbundle_jsonlint.js';
@@ -8,7 +9,15 @@ import validateLayoutProperty from './validate_layout_property.js';
 import validateSpec from './validate.js';
 import extend from '../util/extend.js';
 
-export default function validateLayer(options) {
+import type {ValidationOptions} from './validate.js';
+import type {LayerSpecification} from '../types.js';
+
+type Options = ValidationOptions & {
+    value: LayerSpecification;
+    arrayIndex: number;
+}
+
+export default function validateLayer(options: Options): Array<ValidationError> {
     let errors = [];
 
     const layer = options.value;
@@ -27,6 +36,7 @@ export default function validateLayer(options) {
         for (let i = 0; i < options.arrayIndex; i++) {
             const otherLayer = style.layers[i];
             if (unbundle(otherLayer.id) === layerId) {
+                // $FlowFixMe[prop-missing] - id.__line__ is added dynamically during the readStyle step
                 errors.push(new ValidationError(key, layer.id, `duplicate layer id "${layer.id}", previously used at line ${otherLayer.id.__line__}`));
             }
         }
@@ -46,7 +56,8 @@ export default function validateLayer(options) {
         });
 
         if (!parent) {
-            errors.push(new ValidationError(key, layer.ref, `ref layer "${ref}" not found`));
+            if (typeof ref === 'string')
+                errors.push(new ValidationError(key, layer.ref, `ref layer "${ref}" not found`));
         } else if (parent.ref) {
             errors.push(new ValidationError(key, layer.ref, 'ref cannot reference another ref layer'));
         } else {
@@ -71,6 +82,8 @@ export default function validateLayer(options) {
             } else if (type === 'line' && layer.paint && layer.paint['line-gradient'] &&
                        (sourceType !== 'geojson' || !source.lineMetrics)) {
                 errors.push(new ValidationError(key, layer, `layer "${layer.id}" specifies a line-gradient, which requires a GeoJSON source with \`lineMetrics\` enabled.`));
+            } else if (type === 'line' && layer.paint && layer.paint['line-trim-offset'] && !layer.paint['line-gradient']) {
+                errors.push(new ValidationError(key, layer, `layer "${layer.id}" specifies a line-trim-offset, which requires line-gradient enabled.`));
             }
         }
     }
@@ -106,6 +119,7 @@ export default function validateLayer(options) {
                     layer,
                     key: options.key,
                     value: options.value,
+                    valueSpec: {},
                     style: options.style,
                     styleSpec: options.styleSpec,
                     objectElementValidators: {
@@ -120,6 +134,7 @@ export default function validateLayer(options) {
                     layer,
                     key: options.key,
                     value: options.value,
+                    valueSpec: {},
                     style: options.style,
                     styleSpec: options.styleSpec,
                     objectElementValidators: {

package/validate/validate_layout_property.js

@@ -1,6 +1,10 @@
+// @flow
 
 import validateProperty from './validate_property.js';
 
-export default function validateLayoutProperty(options) {
+import type ValidationError from '../error/validation_error.js';
+import type {PropertyValidationOptions} from './validate_property.js';
+
+export default function validateLayoutProperty(options: PropertyValidationOptions): Array<ValidationError> {
     return validateProperty(options, 'layout');
 }