maplibre-gl 2.2.0-pre.3 → 2.2.1

package/src/style-spec/style-spec.ts

@@ -1,7 +1,7 @@
 type ExpressionType = 'data-driven' | 'cross-faded' | 'cross-faded-data-driven' | 'color-ramp' | 'data-constant' | 'constant';
 type ExpressionParameters = Array<'zoom' | 'feature' | 'feature-state' | 'heatmap-density' | 'line-progress'>;
 
-type ExpressionSpecification = {
+type ExpressionSpecificationDefinition = {
     interpolated: boolean;
     parameters: ExpressionParameters;
 };
@@ -9,33 +9,33 @@ type ExpressionSpecification = {
 export type StylePropertySpecification = {
     type: 'number';
     'property-type': ExpressionType;
-    expression?: ExpressionSpecification;
+    expression?: ExpressionSpecificationDefinition;
     transition: boolean;
     default?: number;
 } | {
     type: 'string';
     'property-type': ExpressionType;
-    expression?: ExpressionSpecification;
+    expression?: ExpressionSpecificationDefinition;
     transition: boolean;
     default?: string;
     tokens?: boolean;
 } | {
     type: 'boolean';
     'property-type': ExpressionType;
-    expression?: ExpressionSpecification;
+    expression?: ExpressionSpecificationDefinition;
     transition: boolean;
     default?: boolean;
 } | {
     type: 'enum';
     'property-type': ExpressionType;
-    expression?: ExpressionSpecification;
+    expression?: ExpressionSpecificationDefinition;
     values: {[_: string]: {}};
     transition: boolean;
     default?: string;
 } | {
     type: 'color';
     'property-type': ExpressionType;
-    expression?: ExpressionSpecification;
+    expression?: ExpressionSpecificationDefinition;
     transition: boolean;
     default?: string;
     overridable: boolean;
@@ -43,7 +43,7 @@ export type StylePropertySpecification = {
     type: 'array';
     value: 'number';
     'property-type': ExpressionType;
-    expression?: ExpressionSpecification;
+    expression?: ExpressionSpecificationDefinition;
     length?: number;
     transition: boolean;
     default?: Array<number>;
@@ -51,13 +51,20 @@ export type StylePropertySpecification = {
     type: 'array';
     value: 'string';
     'property-type': ExpressionType;
-    expression?: ExpressionSpecification;
+    expression?: ExpressionSpecificationDefinition;
     length?: number;
     transition: boolean;
     default?: Array<string>;
+} | {
+    type: 'padding';
+    'property-type': ExpressionType;
+    expression?: ExpressionSpecificationDefinition;
+    transition: boolean;
+    default?: number | Array<number>;
 };
 
-import v8 from './reference/v8.json';
+import v8Spec from './reference/v8.json' assert {type: 'json'};
+const v8 = v8Spec as any;
 import latest from './reference/latest';
 import format from './format';
 import migrate from './migrate';
@@ -71,6 +78,7 @@ import featureFilter, {isExpressionFilter} from './feature_filter';
 
 import convertFilter from './feature_filter/convert';
 import Color from './util/color';
+import Padding from './util/padding';
 import {createFunction, isFunction} from './function';
 import convertFunction from './function/convert';
 import {eachSource, eachLayer, eachProperty} from './visit';
@@ -111,6 +119,7 @@ export {
     featureFilter,
     convertFilter,
     Color,
+    Padding,
     styleFunction as function,
     validate,
     visit

package/src/style-spec/types.g.ts

@@ -3,42 +3,160 @@
 
 export type ColorSpecification = string;
 
+export type PaddingSpecification = number | number[];
+
 export type FormattedSpecification = string;
 
 export type ResolvedImageSpecification = string;
 
 export type PromoteIdSpecification = {[_: string]: string} | string;
 
-export type FilterSpecificationInputType = string | number | boolean;
-export type FilterSpecification =
-    // Lookup
-    | ['at', number, (number |string)[]]
-    | ['get', string, Record<string, unknown>?]
-    | ['has', string, Record<string, unknown>?]
-    | ['in', ...FilterSpecificationInputType[], FilterSpecificationInputType | FilterSpecificationInputType[]]
-    | ['index-of', FilterSpecificationInputType, FilterSpecificationInputType | FilterSpecificationInputType[]]
-    | ['length', string | string[]]
-    | ['slice', string | string[], number]
+export type ExpressionInputType = string | number | boolean;
+
+export type CollatorExpressionSpecification = 
+    ['collator', {
+        'case-sensitive'?: boolean | ExpressionSpecification, 
+        'diacritic-sensitive'?: boolean | ExpressionSpecification, 
+        locale?: string | ExpressionSpecification}
+    ]; // collator
+
+export type InterpolationSpecification =
+    | ['linear'] 
+    | ['exponential', number | ExpressionSpecification] 
+    | ['cubic-bezier', number | ExpressionSpecification, number | ExpressionSpecification, number | ExpressionSpecification, number | ExpressionSpecification]
+    
+export type ExpressionSpecification = 
+    // types
+    | ['array', unknown | ExpressionSpecification] // array
+    | ['array', ExpressionInputType | ExpressionSpecification, unknown | ExpressionSpecification] // array
+    | ['array', ExpressionInputType | ExpressionSpecification, number | ExpressionSpecification, unknown | ExpressionSpecification] // array
+    | ['boolean', ...(unknown | ExpressionSpecification)[], unknown | ExpressionSpecification] // boolean
+    | CollatorExpressionSpecification
+    | ['format', ...(string | ['image', ExpressionSpecification] | ExpressionSpecification | {'font-scale'?: number | ExpressionSpecification, 'text-font'?: string[] | ExpressionSpecification, 'text-color': ColorSpecification | ExpressionSpecification})[]] // string
+    | ['image', unknown | ExpressionSpecification] // image
+    | ['literal', unknown]
+    | ['number', unknown | ExpressionSpecification, ...(unknown | ExpressionSpecification)[]] // number
+    | ['number-format', number | ExpressionSpecification, {'locale'?: string | ExpressionSpecification, 'currency'?: string | ExpressionSpecification, 'min-fraction-digits'?: number | ExpressionSpecification, 'max-fraction-digits'?: number | ExpressionSpecification}] // string
+    | ['object', unknown | ExpressionSpecification, ...(unknown | ExpressionSpecification)[]] // object
+    | ['string', unknown | ExpressionSpecification, ...(unknown | ExpressionSpecification)[]] // string
+    | ['to-boolean', unknown | ExpressionSpecification] // boolean
+    | ['to-color', unknown | ExpressionSpecification, ...(unknown | ExpressionSpecification)[]] // color
+    | ['to-number', unknown | ExpressionSpecification, ...(unknown | ExpressionSpecification)[]] // number
+    | ['to-string', unknown | ExpressionSpecification] // string
+    // feature data
+    | ['accumulated']
+    | ['feature-state', string]
+    | ['geometry-type'] // string
+    | ['id']
+    | ['line-progress'] // number
+    | ['properties'] // object
+    // lookup
+    | ['at', number | ExpressionSpecification, ExpressionSpecification]
+    | ['get', string | ExpressionSpecification, (Record<string, unknown> | ExpressionSpecification)?]
+    | ['has', string | ExpressionSpecification, (Record<string, unknown> | ExpressionSpecification)?]
+    | ['in', ExpressionInputType | ExpressionSpecification, ExpressionInputType | ExpressionSpecification]
+    | ['index-of', ExpressionInputType | ExpressionSpecification, ExpressionInputType | ExpressionSpecification] // number
+    | ['length', string | ExpressionSpecification]
+    | ['slice', string | ExpressionSpecification, number | ExpressionSpecification]
     // Decision
-    | ['!', FilterSpecification]
-    | ['!=', string | FilterSpecification, FilterSpecificationInputType]
-    | ['<', string | FilterSpecification, FilterSpecificationInputType]
-    | ['<=', string | FilterSpecification, FilterSpecificationInputType]
-    | ['==', string | FilterSpecification, FilterSpecificationInputType]
-    | ['>', string | FilterSpecification, FilterSpecificationInputType]
-    | ['>=', string | FilterSpecification, FilterSpecificationInputType]
-    | ["all", ...FilterSpecification[], FilterSpecificationInputType]
-    | ["any", ...FilterSpecification[], FilterSpecificationInputType]
-    | ["case", ...FilterSpecification[], FilterSpecificationInputType]
-    | ["coalesce", ...FilterSpecification[], FilterSpecificationInputType]
-    | ["match", ...FilterSpecification[], FilterSpecificationInputType]
-    | ["within", ...FilterSpecification[], FilterSpecificationInputType]
-    // Used in convert.ts
-    | ["!in", ...FilterSpecification[], FilterSpecificationInputType]
-    | ["!has", ...FilterSpecification[], FilterSpecificationInputType]
-    | ["none", ...FilterSpecification[], FilterSpecificationInputType]
-    // Fallbak for others
-    | Array<string | FilterSpecification>
+    | ['!', boolean | ExpressionSpecification] // boolean
+    | ['!=', ExpressionInputType | ExpressionSpecification, ExpressionInputType | ExpressionSpecification, CollatorExpressionSpecification?] // boolean
+    | ['<', ExpressionInputType | ExpressionSpecification, ExpressionInputType | ExpressionSpecification, CollatorExpressionSpecification?] // boolean
+    | ['<=', ExpressionInputType | ExpressionSpecification, ExpressionInputType | ExpressionSpecification, CollatorExpressionSpecification?] // boolean
+    | ['==', ExpressionInputType | ExpressionSpecification, ExpressionInputType | ExpressionSpecification, CollatorExpressionSpecification?] // boolean
+    | ['>', ExpressionInputType | ExpressionSpecification, ExpressionInputType | ExpressionSpecification, CollatorExpressionSpecification?] // boolean
+    | ['>=', ExpressionInputType | ExpressionSpecification, ExpressionInputType | ExpressionSpecification, CollatorExpressionSpecification?] // boolean
+    | ['all', ...(boolean | ExpressionSpecification)[]] // boolean
+    | ['any', ...(boolean | ExpressionSpecification)[]] // boolean
+    | ['case', boolean | ExpressionSpecification, ExpressionInputType | ExpressionSpecification, 
+        ...(boolean | ExpressionInputType | ExpressionSpecification)[], ExpressionInputType | ExpressionSpecification]
+    | ['coalesce', ExpressionInputType | ExpressionSpecification, ExpressionInputType | ExpressionSpecification, 
+        ...(ExpressionInputType | ExpressionSpecification)[]]
+    | ['match', ExpressionInputType | ExpressionSpecification, 
+        ExpressionInputType | ExpressionInputType[], ExpressionInputType | ExpressionSpecification, 
+        ...(ExpressionInputType | ExpressionInputType[] | ExpressionSpecification)[], // repeated as above
+        ExpressionInputType]
+    | ['within', unknown | ExpressionSpecification]
+    // Ramps, scales, curves
+    | ['interpolate', InterpolationSpecification, 
+        number | ExpressionSpecification, number | ExpressionSpecification, ExpressionInputType | ExpressionSpecification, 
+        ...(number | ExpressionInputType | ExpressionSpecification)[]]
+    | ['interpolate-hcl', InterpolationSpecification,
+        number | ExpressionSpecification, number | ExpressionSpecification, ExpressionInputType | ExpressionSpecification, 
+        ...(number | ColorSpecification | ExpressionSpecification)[]]
+    | ['interpolate-lab', InterpolationSpecification,
+        number | ExpressionSpecification, number | ExpressionSpecification, ExpressionInputType | ExpressionSpecification, 
+        ...(number | ColorSpecification | ExpressionSpecification)[]]
+    | ['step', number | ExpressionSpecification, number | ExpressionSpecification, ExpressionInputType | ExpressionSpecification, 
+        ...(number | ExpressionInputType | ExpressionSpecification)[]]
+    // Variable binding
+    | ['let', string, ExpressionInputType | ExpressionSpecification, ...(string | ExpressionInputType | ExpressionSpecification)[]]
+    | ['var', string]
+    // String
+    | ['concat', ExpressionInputType | ExpressionSpecification, ExpressionInputType | ExpressionSpecification, 
+        ...(ExpressionInputType | ExpressionSpecification)[]] // string
+    | ['downcase', string | ExpressionSpecification] // string
+    | ['is-supported-script', string | ExpressionSpecification] // boolean
+    | ['resolved-locale', CollatorExpressionSpecification] // string
+    | ['upcase', string | ExpressionSpecification] // string
+    // Color
+    | ['rgb', number | ExpressionSpecification, number | ExpressionSpecification, number | ExpressionSpecification] // color
+    | ['rgba', number | ExpressionSpecification, number | ExpressionSpecification, number | ExpressionSpecification, number | ExpressionSpecification]
+    | ['to-rgba', ColorSpecification | ExpressionSpecification]
+    // Math
+    | ['-', number | ExpressionSpecification, (number | ExpressionSpecification)?] // number
+    | ['*', number | ExpressionSpecification, number | ExpressionSpecification, ...(number | ExpressionSpecification)[]] // number
+    | ['/', number | ExpressionSpecification, number | ExpressionSpecification] // number
+    | ['%', number | ExpressionSpecification, number | ExpressionSpecification] // number
+    | ['^', number | ExpressionSpecification, number | ExpressionSpecification] // number
+    | ['+', number | ExpressionSpecification, number | ExpressionSpecification, ...(number | ExpressionSpecification)[]] // number
+    | ['abs', number | ExpressionSpecification] // number
+    | ['acos', number | ExpressionSpecification] // number
+    | ['asin', number | ExpressionSpecification] // number
+    | ['atan', number | ExpressionSpecification] // number
+    | ['ceil', number | ExpressionSpecification] // number
+    | ['cos', number | ExpressionSpecification] // number
+    | ['distance', Record<string, unknown> | ExpressionSpecification] // number
+    | ['ExpressionSpecification'] // number
+    | ['floor', number | ExpressionSpecification] // number
+    | ['ln', number | ExpressionSpecification] // number
+    | ['ln2'] // number
+    | ['log10', number | ExpressionSpecification] // number
+    | ['log2', number | ExpressionSpecification] // number
+    | ['max', number | ExpressionSpecification, ...(number | ExpressionSpecification)[]] // number
+    | ['min', number | ExpressionSpecification, ...(number | ExpressionSpecification)[]] // number
+    | ['pi'] // number
+    | ['round', number | ExpressionSpecification] // number
+    | ['sin', number | ExpressionSpecification] // number
+    | ['sqrt', number | ExpressionSpecification] // number
+    | ['tan', number | ExpressionSpecification] // number
+    // Zoom
+    | ['zoom'] // number
+    // Heatmap
+    | ['heatmap-density'] // number
+
+export type ExpressionFilterSpecification = boolean | ExpressionSpecification
+
+export type LegacyFilterSpecification =
+    // Existential
+    | ['has', string]
+    | ['!has', string]
+    // Comparison
+    | ['==', string, string | number | boolean]
+    | ['!=', string, string | number | boolean]
+    | ['>', string, string | number | boolean]
+    | ['>=', string, string | number | boolean]
+    | ['<', string, string | number | boolean]
+    | ['<=', string, string | number | boolean]
+    // Set membership
+    | ['in', string, ...(string | number | boolean)[]]
+    | ['!in', string, ...(string | number | boolean)[]]
+    // Combining
+    | ['all', ...LegacyFilterSpecification[]]
+    | ['any', ...LegacyFilterSpecification[]]
+    | ['none', ...LegacyFilterSpecification[]]
+
+export type FilterSpecification = ExpressionFilterSpecification | LegacyFilterSpecification
 
 export type TransitionSpecification = {
     duration?: number,
@@ -62,19 +180,17 @@ export type CompositeFunctionSpecification<T> =
     | { type: 'interval',    stops: Array<[{zoom: number, value: number}, T]>, property: string, default?: T }
     | { type: 'categorical', stops: Array<[{zoom: number, value: string | number | boolean}, T]>, property: string, default?: T };
 
-export type ExpressionSpecificationArray = Array<unknown>;
-
 export type PropertyValueSpecification<T> =
       T
     | CameraFunctionSpecification<T>
-    | ExpressionSpecificationArray;
+    | ExpressionSpecification;
 
 export type DataDrivenPropertyValueSpecification<T> =
       T
     | CameraFunctionSpecification<T>
     | SourceFunctionSpecification<T>
     | CompositeFunctionSpecification<T>
-    | ExpressionSpecificationArray;
+    | ExpressionSpecification;
 
 export type StyleSpecification = {
     "version": 8,
@@ -235,7 +351,7 @@ export type LineLayerSpecification = {
         "line-blur"?: DataDrivenPropertyValueSpecification<number>,
         "line-dasharray"?: PropertyValueSpecification<Array<number>>,
         "line-pattern"?: DataDrivenPropertyValueSpecification<ResolvedImageSpecification>,
-        "line-gradient"?: ExpressionSpecificationArray
+        "line-gradient"?: ExpressionSpecification
     }
 };
 
@@ -264,7 +380,7 @@ export type SymbolLayerSpecification = {
         "icon-text-fit-padding"?: PropertyValueSpecification<[number, number, number, number]>,
         "icon-image"?: DataDrivenPropertyValueSpecification<ResolvedImageSpecification>,
         "icon-rotate"?: DataDrivenPropertyValueSpecification<number>,
-        "icon-padding"?: PropertyValueSpecification<number>,
+        "icon-padding"?: DataDrivenPropertyValueSpecification<PaddingSpecification>,
         "icon-keep-upright"?: PropertyValueSpecification<boolean>,
         "icon-offset"?: DataDrivenPropertyValueSpecification<[number, number]>,
         "icon-anchor"?: DataDrivenPropertyValueSpecification<"center" | "left" | "right" | "top" | "bottom" | "top-left" | "top-right" | "bottom-left" | "bottom-right">,
@@ -356,7 +472,7 @@ export type HeatmapLayerSpecification = {
         "heatmap-radius"?: DataDrivenPropertyValueSpecification<number>,
         "heatmap-weight"?: DataDrivenPropertyValueSpecification<number>,
         "heatmap-intensity"?: PropertyValueSpecification<number>,
-        "heatmap-color"?: ExpressionSpecificationArray,
+        "heatmap-color"?: ExpressionSpecification,
         "heatmap-opacity"?: PropertyValueSpecification<number>
     }
 };

package/src/style-spec/util/interpolate.test.ts

@@ -1,5 +1,6 @@
 import * as interpolate from './interpolate';
 import Color from './color';
+import Padding from './padding';
 
 describe('interpolate', () => {
     test('interpolate.number', () => {
@@ -13,4 +14,8 @@ describe('interpolate', () => {
     test('interpolate.array', () => {
         expect(interpolate.array([0, 0, 0, 0], [1, 2, 3, 4], 0.5)).toEqual([0.5, 1, 3 / 2, 2]);
     });
+
+    test('interpolate.padding', () => {
+        expect(interpolate.padding(new Padding([0, 0, 0, 0]), new Padding([1, 2, 3, 4]), 0.5)).toEqual(new Padding([0.5, 1, 3 / 2, 2]));
+    });
 });

package/src/style-spec/util/interpolate.ts

@@ -1,4 +1,5 @@
 import Color from './color';
+import Padding from './padding';
 
 export function number(a: number, b: number, t: number) {
     return (a * (1 - t)) + (b * t);
@@ -18,3 +19,14 @@ export function array(from: Array<number>, to: Array<number>, t: number): Array<
         return number(d, to[i], t);
     });
 }
+
+export function padding(from: Padding, to: Padding, t: number): Padding {
+    const fromVal = from.values;
+    const toVal = to.values;
+    return new Padding([
+        number(fromVal[0], toVal[0], t),
+        number(fromVal[1], toVal[1], t),
+        number(fromVal[2], toVal[2], t),
+        number(fromVal[3], toVal[3], t)
+    ]);
+}

package/src/style-spec/util/padding.test.ts

@@ -0,0 +1,27 @@
+import Padding from './padding';
+
+describe('Padding', () => {
+    test('Padding.parse', () => {
+        expect(Padding.parse()).toBeUndefined();
+        expect(Padding.parse(null)).toBeUndefined();
+        expect(Padding.parse(undefined)).toBeUndefined();
+        expect(Padding.parse('Dennis' as any)).toBeUndefined();
+        expect(Padding.parse('3' as any)).toBeUndefined();
+        expect(Padding.parse([])).toBeUndefined();
+        expect(Padding.parse([3, '4'] as any)).toBeUndefined();
+        expect(Padding.parse(5)).toEqual(new Padding([5, 5, 5, 5]));
+        expect(Padding.parse([1])).toEqual(new Padding([1, 1, 1, 1]));
+        expect(Padding.parse([1, 2])).toEqual(new Padding([1, 2, 1, 2]));
+        expect(Padding.parse([1, 2, 3])).toEqual(new Padding([1, 2, 3, 2]));
+        expect(Padding.parse([1, 2, 3, 4])).toEqual(new Padding([1, 2, 3, 4]));
+        expect(Padding.parse([1, 2, 3, 4, 5])).toBeUndefined();
+
+        const passThru = new Padding([1, 2, 3, 4]);
+        expect(Padding.parse(passThru)).toBe(passThru);
+    });
+
+    test('Padding#toString', () => {
+        const padding = new Padding([1, 2, 3, 4]);
+        expect(padding.toString()).toBe('[1,2,3,4]');
+    });
+});

package/src/style-spec/util/padding.ts

@@ -0,0 +1,64 @@
+/**
+ * A set of four numbers representing padding around a box. Create instances from
+ * bare arrays or numeric values using the static method `Padding.parse`.
+ * @private
+ */
+class Padding {
+    /** Padding values are in CSS order: top, right, bottom, left */
+    values: [number, number, number, number];
+
+    constructor(values: [number, number, number, number]) {
+        this.values = values.slice() as [number, number, number, number];
+    }
+
+    /**
+     * Numeric padding values
+     * @returns A `Padding` instance, or `undefined` if the input is not a valid padding value.
+     */
+    static parse(input?: number | number[] | Padding | null): Padding | void {
+        if (input instanceof Padding) {
+            return input;
+        }
+
+        // Backwards compatibility: bare number is treated the same as array with single value.
+        // Padding applies to all four sides.
+        if (typeof input === 'number') {
+            return new Padding([input, input, input, input]);
+        }
+
+        if (!Array.isArray(input)) {
+            return undefined;
+        }
+
+        if (input.length < 1 || input.length > 4) {
+            return undefined;
+        }
+
+        for (const val of input) {
+            if (typeof val !== 'number') {
+                return undefined;
+            }
+        }
+
+        // Expand shortcut properties into explicit 4-sided values
+        switch (input.length) {
+            case 1:
+                input = [input[0], input[0], input[0], input[0]];
+                break;
+            case 2:
+                input = [input[0], input[1], input[0], input[1]];
+                break;
+            case 3:
+                input = [input[0], input[1], input[2], input[1]];
+                break;
+        }
+
+        return new Padding(input as [number, number, number, number]);
+    }
+
+    toString(): string {
+        return JSON.stringify(this.values);
+    }
+}
+
+export default Padding;

package/src/style-spec/validate/validate.ts

@@ -21,6 +21,7 @@ import validateTerrain from './validate_terrain';
 import validateString from './validate_string';
 import validateFormatted from './validate_formatted';
 import validateImage from './validate_image';
+import validatePadding from './validate_padding';
 
 const VALIDATORS = {
     '*'() {
@@ -41,7 +42,8 @@ const VALIDATORS = {
     'terrain': validateTerrain,
     'string': validateString,
     'formatted': validateFormatted,
-    'resolvedImage': validateImage
+    'resolvedImage': validateImage,
+    'padding': validatePadding
 };
 
 // Main recursive validation function. Tracks:

package/src/style-spec/validate/validate_padding.test.ts

@@ -0,0 +1,82 @@
+import validatePadding from './validate_padding';
+
+describe('Validate Padding', () => {
+    test('Should return error if type is not number or array', () => {
+        let errors = validatePadding({key: 'padding', value: '3'});
+        expect(errors).toHaveLength(1);
+        expect(errors[0].message).toBe('padding: number expected, string found');
+
+        errors = validatePadding({key: 'padding', value: true});
+        expect(errors).toHaveLength(1);
+        expect(errors[0].message).toBe('padding: number expected, boolean found');
+
+        errors = validatePadding({key: 'padding', value: null});
+        expect(errors).toHaveLength(1);
+        expect(errors[0].message).toBe('padding: number expected, null found');
+
+        errors = validatePadding({key: 'padding', value: {x: 1, y: 1}});
+        expect(errors).toHaveLength(1);
+        expect(errors[0].message).toBe('padding: number expected, object found');
+
+        errors = validatePadding({key: 'padding', value: NaN});
+        expect(errors).toHaveLength(1);
+        expect(errors[0].message).toBe('padding: number expected, NaN found');
+    });
+
+    test('Should pass if type is number', () => {
+        const errors = validatePadding({key: 'padding', value: 1});
+        expect(errors).toHaveLength(0);
+    });
+
+    test('Should return error if array length is invalid', () => {
+        let errors = validatePadding({key: 'padding', value: []});
+        expect(errors).toHaveLength(1);
+        expect(errors[0].message).toBe('padding: padding requires 1 to 4 values; 0 values found');
+
+        errors = validatePadding({key: 'padding', value: [1, 1, 1, 1, 1]});
+        expect(errors).toHaveLength(1);
+        expect(errors[0].message).toBe('padding: padding requires 1 to 4 values; 5 values found');
+
+        errors = validatePadding({key: 'padding', value: [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1]});
+        expect(errors).toHaveLength(1);
+        expect(errors[0].message).toBe('padding: padding requires 1 to 4 values; 12 values found');
+    });
+
+    test('Should return error if array contains non-numeric values', () => {
+        let errors = validatePadding({key: 'padding', value: ['1']});
+        expect(errors).toHaveLength(1);
+        expect(errors[0].message).toBe('padding[0]: number expected, string found');
+
+        errors = validatePadding({key: 'padding', value: [true]});
+        expect(errors).toHaveLength(1);
+        expect(errors[0].message).toBe('padding[0]: number expected, boolean found');
+
+        errors = validatePadding({key: 'padding', value: [NaN]});
+        expect(errors).toHaveLength(1);
+        expect(errors[0].message).toBe('padding[0]: number expected, NaN found');
+
+        errors = validatePadding({key: 'padding', value: [{x: 1}]});
+        expect(errors).toHaveLength(1);
+        expect(errors[0].message).toBe('padding[0]: number expected, object found');
+
+        errors = validatePadding({key: 'padding', value: [1, 3, false]});
+        expect(errors).toHaveLength(1);
+        expect(errors[0].message).toBe('padding[2]: number expected, boolean found');
+
+        errors = validatePadding({key: 'padding', value: ['1', 3, false]});
+        expect(errors).toHaveLength(2);
+        expect(errors[0].message).toBe('padding[0]: number expected, string found');
+        expect(errors[1].message).toBe('padding[2]: number expected, boolean found');
+    });
+
+    test('Should pass if type is numeric array', () => {
+        let errors = validatePadding({key: 'padding', value: [1]});
+        expect(errors).toHaveLength(0);
+        errors = validatePadding({key: 'padding', value: [1, 1]});
+        expect(errors).toHaveLength(0);
+        errors = validatePadding({key: 'padding', value: [1, 1, 1]});
+        expect(errors).toHaveLength(0);
+        errors = validatePadding({key: 'padding', value: [1, 1, 1, 1]});
+        expect(errors).toHaveLength(0);
+    });
+});

package/src/style-spec/validate/validate_padding.ts

@@ -0,0 +1,36 @@
+import ValidationError from '../error/validation_error';
+import getType from '../util/get_type';
+import validate from './validate';
+import validateNumber from './validate_number';
+
+export default function validatePadding(options) {
+    const key = options.key;
+    const value = options.value;
+    const type = getType(value);
+
+    if (type === 'array') {
+        if (value.length < 1 || value.length > 4) {
+            return [new ValidationError(key, value, `padding requires 1 to 4 values; ${value.length} values found`)];
+        }
+
+        const arrayElementSpec = {
+            type: 'number'
+        };
+
+        let errors = [];
+        for (let i = 0; i < value.length; i++) {
+            errors = errors.concat(validate({
+                key: `${key}[${i}]`,
+                value: value[i],
+                valueSpec: arrayElementSpec
+            }));
+        }
+        return errors;
+    } else {
+        return validateNumber({
+            key,
+            value,
+            valueSpec: {}
+        });
+    }
+}

package/src/style-spec/validate_style.ts

@@ -9,7 +9,7 @@ import type {StyleSpecification} from './types.g';
  *
  * @private
  * @alias validate
- * @param {StyleSpecification|String|Buffer} style The style to be validated. If a `String`
+ * @param {StyleSpecification|string|Buffer} style The style to be validated. If a `String`
  *     or `Buffer` is provided, the returned errors will contain line numbers.
  * @param {Object} [styleSpec] The style specification to validate against.
  *     If omitted, the spec version is inferred from the stylesheet.

package/src/symbol/check_max_angle.test.ts

@@ -4,14 +4,14 @@ import Anchor from './anchor';
 
 describe('checkMaxAngle', () => {
     test('line with no sharp angles', () => {
-        const line = [ new Point(0, 0), new Point(20, -1), new Point(40, 1), new Point(60, 0) ];
+        const line = [new Point(0, 0), new Point(20, -1), new Point(40, 1), new Point(60, 0)];
         const anchor = new Anchor(30, 0, 0, 1);
         expect(checkMaxAngle(line, anchor, 25, 20, Math.PI / 8)).toBeTruthy();
         expect(checkMaxAngle(line, anchor, 25, 20, 0)).toBeFalsy();
     });
 
     test('one sharp corner', () => {
-        const line = [ new Point(0, 0), new Point(0, 10), new Point(10, 10) ];
+        const line = [new Point(0, 0), new Point(0, 10), new Point(10, 10)];
         const anchor = new Anchor(0, 10, 0, 1);
         expect(checkMaxAngle(line, anchor, 10, 5, Math.PI / 2)).toBeTruthy();
         expect(checkMaxAngle(line, anchor, 10, 5, Math.PI / 2 - 0.01)).toBeFalsy();
@@ -27,20 +27,20 @@ describe('checkMaxAngle', () => {
     });
 
     test('label appears on the first line segment', () => {
-        const line = [ new Point(0, 0), new Point(100, 0) ];
+        const line = [new Point(0, 0), new Point(100, 0)];
         const anchor = new Anchor(50, 0, 0, 0);
         expect(checkMaxAngle(line, anchor, 30, 5, Math.PI / 2)).toBeTruthy();
     });
 
     test('not enough space before the end of the line', () => {
-        const line = [ new Point(0, 0), new Point(10, 0), new Point(20, 0), new Point(30, 0) ];
+        const line = [new Point(0, 0), new Point(10, 0), new Point(20, 0), new Point(30, 0)];
         const anchor = new Anchor(5, 0, 0, 0);
         expect(checkMaxAngle(line, anchor, 11, 5, Math.PI)).toBeFalsy();
         expect(checkMaxAngle(line, anchor, 10, 5, Math.PI)).toBeTruthy();
     });
 
     test('not enough space after the beginning of the line', () => {
-        const line = [ new Point(0, 0), new Point(10, 0), new Point(20, 0), new Point(30, 0) ];
+        const line = [new Point(0, 0), new Point(10, 0), new Point(20, 0), new Point(30, 0)];
         const anchor = new Anchor(25, 0, 0, 2);
         expect(checkMaxAngle(line, anchor, 11, 5, Math.PI)).toBeFalsy();
         expect(checkMaxAngle(line, anchor, 10, 5, Math.PI)).toBeTruthy();