mapbox-gl 1.13.2

package/src/style/style_layer/line_style_layer.js

@@ -0,0 +1,150 @@
+// @flow
+
+import Point from '@mapbox/point-geometry';
+
+import StyleLayer from '../style_layer';
+import LineBucket from '../../data/bucket/line_bucket';
+import {polygonIntersectsBufferedMultiLine} from '../../util/intersection_tests';
+import {getMaximumPaintValue, translateDistance, translate} from '../query_utils';
+import properties from './line_style_layer_properties';
+import {extend, MAX_SAFE_INTEGER} from '../../util/util';
+import EvaluationParameters from '../evaluation_parameters';
+import {Transitionable, Transitioning, Layout, PossiblyEvaluated, DataDrivenProperty} from '../properties';
+
+import Step from '../../style-spec/expression/definitions/step';
+import type {FeatureState, ZoomConstantExpression} from '../../style-spec/expression';
+import type {Bucket, BucketParameters} from '../../data/bucket';
+import type {LayoutProps, PaintProps} from './line_style_layer_properties';
+import type Transform from '../../geo/transform';
+import type {LayerSpecification} from '../../style-spec/types';
+
+class LineFloorwidthProperty extends DataDrivenProperty<number> {
+    useIntegerZoom: true;
+
+    possiblyEvaluate(value, parameters) {
+        parameters = new EvaluationParameters(Math.floor(parameters.zoom), {
+            now: parameters.now,
+            fadeDuration: parameters.fadeDuration,
+            zoomHistory: parameters.zoomHistory,
+            transition: parameters.transition
+        });
+        return super.possiblyEvaluate(value, parameters);
+    }
+
+    evaluate(value, globals, feature, featureState) {
+        globals = extend({}, globals, {zoom: Math.floor(globals.zoom)});
+        return super.evaluate(value, globals, feature, featureState);
+    }
+}
+
+const lineFloorwidthProperty = new LineFloorwidthProperty(properties.paint.properties['line-width'].specification);
+lineFloorwidthProperty.useIntegerZoom = true;
+
+class LineStyleLayer extends StyleLayer {
+    _unevaluatedLayout: Layout<LayoutProps>;
+    layout: PossiblyEvaluated<LayoutProps>;
+
+    gradientVersion: number;
+    stepInterpolant: boolean;
+
+    _transitionablePaint: Transitionable<PaintProps>;
+    _transitioningPaint: Transitioning<PaintProps>;
+    paint: PossiblyEvaluated<PaintProps>;
+
+    constructor(layer: LayerSpecification) {
+        super(layer, properties);
+        this.gradientVersion = 0;
+    }
+
+    _handleSpecialPaintPropertyUpdate(name: string) {
+        if (name === 'line-gradient') {
+            const expression: ZoomConstantExpression<'source'> = ((this._transitionablePaint._values['line-gradient'].value.expression): any);
+            this.stepInterpolant = expression._styleExpression.expression instanceof Step;
+            this.gradientVersion = (this.gradientVersion + 1) % MAX_SAFE_INTEGER;
+        }
+    }
+
+    gradientExpression() {
+        return this._transitionablePaint._values['line-gradient'].value.expression;
+    }
+
+    recalculate(parameters: EvaluationParameters, availableImages: Array<string>) {
+        super.recalculate(parameters, availableImages);
+
+        (this.paint._values: any)['line-floorwidth'] =
+            lineFloorwidthProperty.possiblyEvaluate(this._transitioningPaint._values['line-width'].value, parameters);
+    }
+
+    createBucket(parameters: BucketParameters<*>) {
+        return new LineBucket(parameters);
+    }
+
+    queryRadius(bucket: Bucket): number {
+        const lineBucket: LineBucket = (bucket: any);
+        const width = getLineWidth(
+            getMaximumPaintValue('line-width', this, lineBucket),
+            getMaximumPaintValue('line-gap-width', this, lineBucket));
+        const offset = getMaximumPaintValue('line-offset', this, lineBucket);
+        return width / 2 + Math.abs(offset) + translateDistance(this.paint.get('line-translate'));
+    }
+
+    queryIntersectsFeature(queryGeometry: Array<Point>,
+                           feature: VectorTileFeature,
+                           featureState: FeatureState,
+                           geometry: Array<Array<Point>>,
+                           zoom: number,
+                           transform: Transform,
+                           pixelsToTileUnits: number): boolean {
+        const translatedPolygon = translate(queryGeometry,
+            this.paint.get('line-translate'),
+            this.paint.get('line-translate-anchor'),
+            transform.angle, pixelsToTileUnits);
+        const halfWidth = pixelsToTileUnits / 2 * getLineWidth(
+            this.paint.get('line-width').evaluate(feature, featureState),
+            this.paint.get('line-gap-width').evaluate(feature, featureState));
+        const lineOffset = this.paint.get('line-offset').evaluate(feature, featureState);
+        if (lineOffset) {
+            geometry = offsetLine(geometry, lineOffset * pixelsToTileUnits);
+        }
+
+        return polygonIntersectsBufferedMultiLine(translatedPolygon, geometry, halfWidth);
+    }
+
+    isTileClipped() {
+        return true;
+    }
+}
+
+export default LineStyleLayer;
+
+function getLineWidth(lineWidth, lineGapWidth) {
+    if (lineGapWidth > 0) {
+        return lineGapWidth + 2 * lineWidth;
+    } else {
+        return lineWidth;
+    }
+}
+
+function offsetLine(rings, offset) {
+    const newRings = [];
+    const zero = new Point(0, 0);
+    for (let k = 0; k < rings.length; k++) {
+        const ring = rings[k];
+        const newRing = [];
+        for (let i = 0; i < ring.length; i++) {
+            const a = ring[i - 1];
+            const b = ring[i];
+            const c = ring[i + 1];
+            const aToB = i === 0 ? zero : b.sub(a)._unit()._perp();
+            const bToC = i === ring.length - 1 ? zero : c.sub(b)._unit()._perp();
+            const extrude = aToB._add(bToC)._unit();
+
+            const cosHalfAngle = extrude.x * bToC.x + extrude.y * bToC.y;
+            extrude._mult(1 / cosHalfAngle);
+
+            newRing.push(extrude._mult(offset)._add(b));
+        }
+        newRings.push(newRing);
+    }
+    return newRings;
+}

package/src/style/style_layer/line_style_layer_properties.js

@@ -0,0 +1,71 @@
+// This file is generated. Edit build/generate-style-code.js, then run `yarn run codegen`.
+// @flow
+/* eslint-disable */
+
+import styleSpec from '../../style-spec/reference/latest';
+
+import {
+    Properties,
+    DataConstantProperty,
+    DataDrivenProperty,
+    CrossFadedDataDrivenProperty,
+    CrossFadedProperty,
+    ColorRampProperty
+} from '../properties';
+
+import type Color from '../../style-spec/util/color';
+
+import type Formatted from '../../style-spec/expression/types/formatted';
+
+import type ResolvedImage from '../../style-spec/expression/types/resolved_image';
+
+export type LayoutProps = {|
+    "line-cap": DataConstantProperty<"butt" | "round" | "square">,
+    "line-join": DataDrivenProperty<"bevel" | "round" | "miter">,
+    "line-miter-limit": DataConstantProperty<number>,
+    "line-round-limit": DataConstantProperty<number>,
+    "line-sort-key": DataDrivenProperty<number>,
+|};
+
+const layout: Properties<LayoutProps> = new Properties({
+    "line-cap": new DataConstantProperty(styleSpec["layout_line"]["line-cap"]),
+    "line-join": new DataDrivenProperty(styleSpec["layout_line"]["line-join"]),
+    "line-miter-limit": new DataConstantProperty(styleSpec["layout_line"]["line-miter-limit"]),
+    "line-round-limit": new DataConstantProperty(styleSpec["layout_line"]["line-round-limit"]),
+    "line-sort-key": new DataDrivenProperty(styleSpec["layout_line"]["line-sort-key"]),
+});
+
+export type PaintProps = {|
+    "line-opacity": DataDrivenProperty<number>,
+    "line-color": DataDrivenProperty<Color>,
+    "line-translate": DataConstantProperty<[number, number]>,
+    "line-translate-anchor": DataConstantProperty<"map" | "viewport">,
+    "line-width": DataDrivenProperty<number>,
+    "line-gap-width": DataDrivenProperty<number>,
+    "line-offset": DataDrivenProperty<number>,
+    "line-blur": DataDrivenProperty<number>,
+    "line-dasharray": CrossFadedProperty<Array<number>>,
+    "line-pattern": CrossFadedDataDrivenProperty<ResolvedImage>,
+    "line-gradient": ColorRampProperty,
+|};
+
+const paint: Properties<PaintProps> = new Properties({
+    "line-opacity": new DataDrivenProperty(styleSpec["paint_line"]["line-opacity"]),
+    "line-color": new DataDrivenProperty(styleSpec["paint_line"]["line-color"]),
+    "line-translate": new DataConstantProperty(styleSpec["paint_line"]["line-translate"]),
+    "line-translate-anchor": new DataConstantProperty(styleSpec["paint_line"]["line-translate-anchor"]),
+    "line-width": new DataDrivenProperty(styleSpec["paint_line"]["line-width"]),
+    "line-gap-width": new DataDrivenProperty(styleSpec["paint_line"]["line-gap-width"]),
+    "line-offset": new DataDrivenProperty(styleSpec["paint_line"]["line-offset"]),
+    "line-blur": new DataDrivenProperty(styleSpec["paint_line"]["line-blur"]),
+    "line-dasharray": new CrossFadedProperty(styleSpec["paint_line"]["line-dasharray"]),
+    "line-pattern": new CrossFadedDataDrivenProperty(styleSpec["paint_line"]["line-pattern"]),
+    "line-gradient": new ColorRampProperty(styleSpec["paint_line"]["line-gradient"]),
+});
+
+// Note: without adding the explicit type annotation, Flow infers weaker types
+// for these objects from their use in the constructor to StyleLayer, as
+// {layout?: Properties<...>, paint: Properties<...>}
+export default ({ paint, layout }: $Exact<{
+  paint: Properties<PaintProps>, layout: Properties<LayoutProps>
+}>);

package/src/style/style_layer/raster_style_layer.js

@@ -0,0 +1,21 @@
+// @flow
+
+import StyleLayer from '../style_layer';
+
+import properties from './raster_style_layer_properties';
+import {Transitionable, Transitioning, PossiblyEvaluated} from '../properties';
+
+import type {PaintProps} from './raster_style_layer_properties';
+import type {LayerSpecification} from '../../style-spec/types';
+
+class RasterStyleLayer extends StyleLayer {
+    _transitionablePaint: Transitionable<PaintProps>;
+    _transitioningPaint: Transitioning<PaintProps>;
+    paint: PossiblyEvaluated<PaintProps>;
+
+    constructor(layer: LayerSpecification) {
+        super(layer, properties);
+    }
+}
+
+export default RasterStyleLayer;

package/src/style/style_layer/raster_style_layer_properties.js

@@ -0,0 +1,50 @@
+// This file is generated. Edit build/generate-style-code.js, then run `yarn run codegen`.
+// @flow
+/* eslint-disable */
+
+import styleSpec from '../../style-spec/reference/latest';
+
+import {
+    Properties,
+    DataConstantProperty,
+    DataDrivenProperty,
+    CrossFadedDataDrivenProperty,
+    CrossFadedProperty,
+    ColorRampProperty
+} from '../properties';
+
+import type Color from '../../style-spec/util/color';
+
+import type Formatted from '../../style-spec/expression/types/formatted';
+
+import type ResolvedImage from '../../style-spec/expression/types/resolved_image';
+
+
+export type PaintProps = {|
+    "raster-opacity": DataConstantProperty<number>,
+    "raster-hue-rotate": DataConstantProperty<number>,
+    "raster-brightness-min": DataConstantProperty<number>,
+    "raster-brightness-max": DataConstantProperty<number>,
+    "raster-saturation": DataConstantProperty<number>,
+    "raster-contrast": DataConstantProperty<number>,
+    "raster-resampling": DataConstantProperty<"linear" | "nearest">,
+    "raster-fade-duration": DataConstantProperty<number>,
+|};
+
+const paint: Properties<PaintProps> = new Properties({
+    "raster-opacity": new DataConstantProperty(styleSpec["paint_raster"]["raster-opacity"]),
+    "raster-hue-rotate": new DataConstantProperty(styleSpec["paint_raster"]["raster-hue-rotate"]),
+    "raster-brightness-min": new DataConstantProperty(styleSpec["paint_raster"]["raster-brightness-min"]),
+    "raster-brightness-max": new DataConstantProperty(styleSpec["paint_raster"]["raster-brightness-max"]),
+    "raster-saturation": new DataConstantProperty(styleSpec["paint_raster"]["raster-saturation"]),
+    "raster-contrast": new DataConstantProperty(styleSpec["paint_raster"]["raster-contrast"]),
+    "raster-resampling": new DataConstantProperty(styleSpec["paint_raster"]["raster-resampling"]),
+    "raster-fade-duration": new DataConstantProperty(styleSpec["paint_raster"]["raster-fade-duration"]),
+});
+
+// Note: without adding the explicit type annotation, Flow infers weaker types
+// for these objects from their use in the constructor to StyleLayer, as
+// {layout?: Properties<...>, paint: Properties<...>}
+export default ({ paint }: $Exact<{
+  paint: Properties<PaintProps>
+}>);

package/src/style/style_layer/symbol_style_layer.js

@@ -0,0 +1,190 @@
+// @flow
+
+import StyleLayer from '../style_layer';
+
+import assert from 'assert';
+import SymbolBucket from '../../data/bucket/symbol_bucket';
+import resolveTokens from '../../util/resolve_tokens';
+import properties from './symbol_style_layer_properties';
+
+import {
+    Transitionable,
+    Transitioning,
+    Layout,
+    PossiblyEvaluated,
+    PossiblyEvaluatedPropertyValue,
+    PropertyValue
+} from '../properties';
+
+import {
+    isExpression,
+    StyleExpression,
+    ZoomConstantExpression,
+    ZoomDependentExpression
+} from '../../style-spec/expression';
+
+import type {BucketParameters} from '../../data/bucket';
+import type {LayoutProps, PaintProps} from './symbol_style_layer_properties';
+import type EvaluationParameters from '../evaluation_parameters';
+import type {LayerSpecification} from '../../style-spec/types';
+import type {Feature, SourceExpression, CompositeExpression} from '../../style-spec/expression';
+import type {Expression} from '../../style-spec/expression/expression';
+import type {CanonicalTileID} from '../../source/tile_id';
+import {FormattedType} from '../../style-spec/expression/types';
+import {typeOf} from '../../style-spec/expression/values';
+import Formatted from '../../style-spec/expression/types/formatted';
+import FormatSectionOverride from '../format_section_override';
+import FormatExpression from '../../style-spec/expression/definitions/format';
+import Literal from '../../style-spec/expression/definitions/literal';
+
+class SymbolStyleLayer extends StyleLayer {
+    _unevaluatedLayout: Layout<LayoutProps>;
+    layout: PossiblyEvaluated<LayoutProps>;
+
+    _transitionablePaint: Transitionable<PaintProps>;
+    _transitioningPaint: Transitioning<PaintProps>;
+    paint: PossiblyEvaluated<PaintProps>;
+
+    constructor(layer: LayerSpecification) {
+        super(layer, properties);
+    }
+
+    recalculate(parameters: EvaluationParameters, availableImages: Array<string>) {
+        super.recalculate(parameters, availableImages);
+
+        if (this.layout.get('icon-rotation-alignment') === 'auto') {
+            if (this.layout.get('symbol-placement') !== 'point') {
+                this.layout._values['icon-rotation-alignment'] = 'map';
+            } else {
+                this.layout._values['icon-rotation-alignment'] = 'viewport';
+            }
+        }
+
+        if (this.layout.get('text-rotation-alignment') === 'auto') {
+            if (this.layout.get('symbol-placement') !== 'point') {
+                this.layout._values['text-rotation-alignment'] = 'map';
+            } else {
+                this.layout._values['text-rotation-alignment'] = 'viewport';
+            }
+        }
+
+        // If unspecified, `*-pitch-alignment` inherits `*-rotation-alignment`
+        if (this.layout.get('text-pitch-alignment') === 'auto') {
+            this.layout._values['text-pitch-alignment'] = this.layout.get('text-rotation-alignment');
+        }
+        if (this.layout.get('icon-pitch-alignment') === 'auto') {
+            this.layout._values['icon-pitch-alignment'] = this.layout.get('icon-rotation-alignment');
+        }
+
+        if (this.layout.get('symbol-placement') === 'point') {
+            const writingModes = this.layout.get('text-writing-mode');
+            if (writingModes) {
+                // remove duplicates, preserving order
+                const deduped = [];
+                for (const m of writingModes) {
+                    if (deduped.indexOf(m) < 0) deduped.push(m);
+                }
+                this.layout._values['text-writing-mode'] = deduped;
+            } else {
+                this.layout._values['text-writing-mode'] = ['horizontal'];
+            }
+        }
+
+        this._setPaintOverrides();
+    }
+
+    getValueAndResolveTokens(name: *, feature: Feature, canonical: CanonicalTileID, availableImages: Array<string>) {
+        const value = this.layout.get(name).evaluate(feature, {}, canonical, availableImages);
+        const unevaluated = this._unevaluatedLayout._values[name];
+        if (!unevaluated.isDataDriven() && !isExpression(unevaluated.value) && value) {
+            return resolveTokens(feature.properties, value);
+        }
+
+        return value;
+    }
+
+    createBucket(parameters: BucketParameters<*>) {
+        return new SymbolBucket(parameters);
+    }
+
+    queryRadius(): number {
+        return 0;
+    }
+
+    queryIntersectsFeature(): boolean {
+        assert(false); // Should take a different path in FeatureIndex
+        return false;
+    }
+
+    _setPaintOverrides() {
+        for (const overridable of properties.paint.overridableProperties) {
+            if (!SymbolStyleLayer.hasPaintOverride(this.layout, overridable)) {
+                continue;
+            }
+            const overriden = this.paint.get(overridable);
+            const override = new FormatSectionOverride(overriden);
+            const styleExpression = new StyleExpression(override, overriden.property.specification);
+            let expression = null;
+            if (overriden.value.kind === 'constant' || overriden.value.kind === 'source') {
+                expression = (new ZoomConstantExpression('source', styleExpression): SourceExpression);
+            } else {
+                expression = (new ZoomDependentExpression('composite',
+                                                          styleExpression,
+                                                          overriden.value.zoomStops,
+                                                          overriden.value._interpolationType): CompositeExpression);
+            }
+            this.paint._values[overridable] = new PossiblyEvaluatedPropertyValue(overriden.property,
+                                                                                 expression,
+                                                                                 overriden.parameters);
+        }
+    }
+
+    _handleOverridablePaintPropertyUpdate<T, R>(name: string, oldValue: PropertyValue<T, R>, newValue: PropertyValue<T, R>): boolean {
+        if (!this.layout || oldValue.isDataDriven() || newValue.isDataDriven()) {
+            return false;
+        }
+        return SymbolStyleLayer.hasPaintOverride(this.layout, name);
+    }
+
+    static hasPaintOverride(layout: PossiblyEvaluated<LayoutProps>, propertyName: string): boolean {
+        const textField = layout.get('text-field');
+        const property = properties.paint.properties[propertyName];
+        let hasOverrides = false;
+
+        const checkSections = (sections) => {
+            for (const section of sections) {
+                if (property.overrides && property.overrides.hasOverride(section)) {
+                    hasOverrides = true;
+                    return;
+                }
+            }
+        };
+
+        if (textField.value.kind === 'constant' && textField.value.value instanceof Formatted) {
+            checkSections(textField.value.value.sections);
+        } else if (textField.value.kind === 'source') {
+
+            const checkExpression = (expression: Expression) => {
+                if (hasOverrides) return;
+
+                if (expression instanceof Literal && typeOf(expression.value) === FormattedType) {
+                    const formatted: Formatted = ((expression.value): any);
+                    checkSections(formatted.sections);
+                } else if (expression instanceof FormatExpression) {
+                    checkSections(expression.sections);
+                } else {
+                    expression.eachChild(checkExpression);
+                }
+            };
+
+            const expr: ZoomConstantExpression<'source'> = ((textField.value): any);
+            if (expr._styleExpression) {
+                checkExpression(expr._styleExpression.expression);
+            }
+        }
+
+        return hasOverrides;
+    }
+}
+
+export default SymbolStyleLayer;

package/src/style/style_layer/symbol_style_layer_properties.js

@@ -0,0 +1,153 @@
+// This file is generated. Edit build/generate-style-code.js, then run `yarn run codegen`.
+// @flow
+/* eslint-disable */
+
+import styleSpec from '../../style-spec/reference/latest';
+
+import {
+    Properties,
+    DataConstantProperty,
+    DataDrivenProperty,
+    CrossFadedDataDrivenProperty,
+    CrossFadedProperty,
+    ColorRampProperty
+} from '../properties';
+
+import type Color from '../../style-spec/util/color';
+
+import type Formatted from '../../style-spec/expression/types/formatted';
+
+import type ResolvedImage from '../../style-spec/expression/types/resolved_image';
+
+import {
+    ColorType
+} from '../../style-spec/expression/types';
+
+export type LayoutProps = {|
+    "symbol-placement": DataConstantProperty<"point" | "line" | "line-center">,
+    "symbol-spacing": DataConstantProperty<number>,
+    "symbol-avoid-edges": DataConstantProperty<boolean>,
+    "symbol-sort-key": DataDrivenProperty<number>,
+    "symbol-z-order": DataConstantProperty<"auto" | "viewport-y" | "source">,
+    "icon-allow-overlap": DataConstantProperty<boolean>,
+    "icon-ignore-placement": DataConstantProperty<boolean>,
+    "icon-optional": DataConstantProperty<boolean>,
+    "icon-rotation-alignment": DataConstantProperty<"map" | "viewport" | "auto">,
+    "icon-size": DataDrivenProperty<number>,
+    "icon-text-fit": DataConstantProperty<"none" | "width" | "height" | "both">,
+    "icon-text-fit-padding": DataConstantProperty<[number, number, number, number]>,
+    "icon-image": DataDrivenProperty<ResolvedImage>,
+    "icon-rotate": DataDrivenProperty<number>,
+    "icon-padding": DataConstantProperty<number>,
+    "icon-keep-upright": DataConstantProperty<boolean>,
+    "icon-offset": DataDrivenProperty<[number, number]>,
+    "icon-anchor": DataDrivenProperty<"center" | "left" | "right" | "top" | "bottom" | "top-left" | "top-right" | "bottom-left" | "bottom-right">,
+    "icon-pitch-alignment": DataConstantProperty<"map" | "viewport" | "auto">,
+    "text-pitch-alignment": DataConstantProperty<"map" | "viewport" | "auto">,
+    "text-rotation-alignment": DataConstantProperty<"map" | "viewport" | "auto">,
+    "text-field": DataDrivenProperty<Formatted>,
+    "text-font": DataDrivenProperty<Array<string>>,
+    "text-size": DataDrivenProperty<number>,
+    "text-max-width": DataDrivenProperty<number>,
+    "text-line-height": DataConstantProperty<number>,
+    "text-letter-spacing": DataDrivenProperty<number>,
+    "text-justify": DataDrivenProperty<"auto" | "left" | "center" | "right">,
+    "text-radial-offset": DataDrivenProperty<number>,
+    "text-variable-anchor": DataConstantProperty<Array<"center" | "left" | "right" | "top" | "bottom" | "top-left" | "top-right" | "bottom-left" | "bottom-right">>,
+    "text-anchor": DataDrivenProperty<"center" | "left" | "right" | "top" | "bottom" | "top-left" | "top-right" | "bottom-left" | "bottom-right">,
+    "text-max-angle": DataConstantProperty<number>,
+    "text-writing-mode": DataConstantProperty<Array<"horizontal" | "vertical">>,
+    "text-rotate": DataDrivenProperty<number>,
+    "text-padding": DataConstantProperty<number>,
+    "text-keep-upright": DataConstantProperty<boolean>,
+    "text-transform": DataDrivenProperty<"none" | "uppercase" | "lowercase">,
+    "text-offset": DataDrivenProperty<[number, number]>,
+    "text-allow-overlap": DataConstantProperty<boolean>,
+    "text-ignore-placement": DataConstantProperty<boolean>,
+    "text-optional": DataConstantProperty<boolean>,
+|};
+
+const layout: Properties<LayoutProps> = new Properties({
+    "symbol-placement": new DataConstantProperty(styleSpec["layout_symbol"]["symbol-placement"]),
+    "symbol-spacing": new DataConstantProperty(styleSpec["layout_symbol"]["symbol-spacing"]),
+    "symbol-avoid-edges": new DataConstantProperty(styleSpec["layout_symbol"]["symbol-avoid-edges"]),
+    "symbol-sort-key": new DataDrivenProperty(styleSpec["layout_symbol"]["symbol-sort-key"]),
+    "symbol-z-order": new DataConstantProperty(styleSpec["layout_symbol"]["symbol-z-order"]),
+    "icon-allow-overlap": new DataConstantProperty(styleSpec["layout_symbol"]["icon-allow-overlap"]),
+    "icon-ignore-placement": new DataConstantProperty(styleSpec["layout_symbol"]["icon-ignore-placement"]),
+    "icon-optional": new DataConstantProperty(styleSpec["layout_symbol"]["icon-optional"]),
+    "icon-rotation-alignment": new DataConstantProperty(styleSpec["layout_symbol"]["icon-rotation-alignment"]),
+    "icon-size": new DataDrivenProperty(styleSpec["layout_symbol"]["icon-size"]),
+    "icon-text-fit": new DataConstantProperty(styleSpec["layout_symbol"]["icon-text-fit"]),
+    "icon-text-fit-padding": new DataConstantProperty(styleSpec["layout_symbol"]["icon-text-fit-padding"]),
+    "icon-image": new DataDrivenProperty(styleSpec["layout_symbol"]["icon-image"]),
+    "icon-rotate": new DataDrivenProperty(styleSpec["layout_symbol"]["icon-rotate"]),
+    "icon-padding": new DataConstantProperty(styleSpec["layout_symbol"]["icon-padding"]),
+    "icon-keep-upright": new DataConstantProperty(styleSpec["layout_symbol"]["icon-keep-upright"]),
+    "icon-offset": new DataDrivenProperty(styleSpec["layout_symbol"]["icon-offset"]),
+    "icon-anchor": new DataDrivenProperty(styleSpec["layout_symbol"]["icon-anchor"]),
+    "icon-pitch-alignment": new DataConstantProperty(styleSpec["layout_symbol"]["icon-pitch-alignment"]),
+    "text-pitch-alignment": new DataConstantProperty(styleSpec["layout_symbol"]["text-pitch-alignment"]),
+    "text-rotation-alignment": new DataConstantProperty(styleSpec["layout_symbol"]["text-rotation-alignment"]),
+    "text-field": new DataDrivenProperty(styleSpec["layout_symbol"]["text-field"]),
+    "text-font": new DataDrivenProperty(styleSpec["layout_symbol"]["text-font"]),
+    "text-size": new DataDrivenProperty(styleSpec["layout_symbol"]["text-size"]),
+    "text-max-width": new DataDrivenProperty(styleSpec["layout_symbol"]["text-max-width"]),
+    "text-line-height": new DataConstantProperty(styleSpec["layout_symbol"]["text-line-height"]),
+    "text-letter-spacing": new DataDrivenProperty(styleSpec["layout_symbol"]["text-letter-spacing"]),
+    "text-justify": new DataDrivenProperty(styleSpec["layout_symbol"]["text-justify"]),
+    "text-radial-offset": new DataDrivenProperty(styleSpec["layout_symbol"]["text-radial-offset"]),
+    "text-variable-anchor": new DataConstantProperty(styleSpec["layout_symbol"]["text-variable-anchor"]),
+    "text-anchor": new DataDrivenProperty(styleSpec["layout_symbol"]["text-anchor"]),
+    "text-max-angle": new DataConstantProperty(styleSpec["layout_symbol"]["text-max-angle"]),
+    "text-writing-mode": new DataConstantProperty(styleSpec["layout_symbol"]["text-writing-mode"]),
+    "text-rotate": new DataDrivenProperty(styleSpec["layout_symbol"]["text-rotate"]),
+    "text-padding": new DataConstantProperty(styleSpec["layout_symbol"]["text-padding"]),
+    "text-keep-upright": new DataConstantProperty(styleSpec["layout_symbol"]["text-keep-upright"]),
+    "text-transform": new DataDrivenProperty(styleSpec["layout_symbol"]["text-transform"]),
+    "text-offset": new DataDrivenProperty(styleSpec["layout_symbol"]["text-offset"]),
+    "text-allow-overlap": new DataConstantProperty(styleSpec["layout_symbol"]["text-allow-overlap"]),
+    "text-ignore-placement": new DataConstantProperty(styleSpec["layout_symbol"]["text-ignore-placement"]),
+    "text-optional": new DataConstantProperty(styleSpec["layout_symbol"]["text-optional"]),
+});
+
+export type PaintProps = {|
+    "icon-opacity": DataDrivenProperty<number>,
+    "icon-color": DataDrivenProperty<Color>,
+    "icon-halo-color": DataDrivenProperty<Color>,
+    "icon-halo-width": DataDrivenProperty<number>,
+    "icon-halo-blur": DataDrivenProperty<number>,
+    "icon-translate": DataConstantProperty<[number, number]>,
+    "icon-translate-anchor": DataConstantProperty<"map" | "viewport">,
+    "text-opacity": DataDrivenProperty<number>,
+    "text-color": DataDrivenProperty<Color>,
+    "text-halo-color": DataDrivenProperty<Color>,
+    "text-halo-width": DataDrivenProperty<number>,
+    "text-halo-blur": DataDrivenProperty<number>,
+    "text-translate": DataConstantProperty<[number, number]>,
+    "text-translate-anchor": DataConstantProperty<"map" | "viewport">,
+|};
+
+const paint: Properties<PaintProps> = new Properties({
+    "icon-opacity": new DataDrivenProperty(styleSpec["paint_symbol"]["icon-opacity"]),
+    "icon-color": new DataDrivenProperty(styleSpec["paint_symbol"]["icon-color"]),
+    "icon-halo-color": new DataDrivenProperty(styleSpec["paint_symbol"]["icon-halo-color"]),
+    "icon-halo-width": new DataDrivenProperty(styleSpec["paint_symbol"]["icon-halo-width"]),
+    "icon-halo-blur": new DataDrivenProperty(styleSpec["paint_symbol"]["icon-halo-blur"]),
+    "icon-translate": new DataConstantProperty(styleSpec["paint_symbol"]["icon-translate"]),
+    "icon-translate-anchor": new DataConstantProperty(styleSpec["paint_symbol"]["icon-translate-anchor"]),
+    "text-opacity": new DataDrivenProperty(styleSpec["paint_symbol"]["text-opacity"]),
+    "text-color": new DataDrivenProperty(styleSpec["paint_symbol"]["text-color"], { runtimeType: ColorType, getOverride: (o) => o.textColor, hasOverride: (o) => !!o.textColor }),
+    "text-halo-color": new DataDrivenProperty(styleSpec["paint_symbol"]["text-halo-color"]),
+    "text-halo-width": new DataDrivenProperty(styleSpec["paint_symbol"]["text-halo-width"]),
+    "text-halo-blur": new DataDrivenProperty(styleSpec["paint_symbol"]["text-halo-blur"]),
+    "text-translate": new DataConstantProperty(styleSpec["paint_symbol"]["text-translate"]),
+    "text-translate-anchor": new DataConstantProperty(styleSpec["paint_symbol"]["text-translate-anchor"]),
+});
+
+// Note: without adding the explicit type annotation, Flow infers weaker types
+// for these objects from their use in the constructor to StyleLayer, as
+// {layout?: Properties<...>, paint: Properties<...>}
+export default ({ paint, layout }: $Exact<{
+  paint: Properties<PaintProps>, layout: Properties<LayoutProps>
+}>);

package/src/style/style_layer/typed_style_layer.js

@@ -0,0 +1,17 @@
+// @flow
+
+import type CircleStyleLayer from './circle_style_layer';
+import type FillStyleLayer from './fill_style_layer';
+import type FillExtrusionStyleLayer from './fill_extrusion_style_layer';
+import type HeatmapStyleLayer from './heatmap_style_layer';
+import type HillshadeStyleLayer from './hillshade_style_layer';
+import type LineStyleLayer from './line_style_layer';
+import type SymbolStyleLayer from './symbol_style_layer';
+
+export type TypedStyleLayer = CircleStyleLayer |
+    FillStyleLayer |
+    FillExtrusionStyleLayer |
+    HeatmapStyleLayer |
+    HillshadeStyleLayer |
+    LineStyleLayer |
+    SymbolStyleLayer;