@versatiles/style 5.8.3 → 5.9.0

package/dist/index.js

@@ -145,7 +145,7 @@ function mod(value, max) {
     value = value % max;
     if (value < 0)
         value += max;
-    if (value == 0)
+    if (value === 0)
         return 0;
     return value;
 }
@@ -236,7 +236,7 @@ function randomColor(options) {
     function randomWithin(range) {
         //Seeded random algorithm from http://indiegamr.com/generate-repeatable-random-numbers-in-js/
         seed = (seed * 9301 + 49297) % 233280;
-        return Math.floor(range[0] + seed / 233280.0 * (range[1] - range[0]));
+        return Math.floor(range[0] + (seed / 233280.0) * (range[1] - range[0]));
     }
 }
 function inputToSeed(input) {
@@ -261,14 +261,81 @@ function initColorDictionary() {
             brightnessRange: [colorful[1], greyest[1]],
         });
     };
-    defineColor('monochrome', null, [[0, 0], [100, 0]]);
-    defineColor('red', [-26, 18], [[20, 100], [30, 92], [40, 89], [50, 85], [60, 78], [70, 70], [80, 60], [90, 55], [100, 50]]);
-    defineColor('orange', [18, 46], [[20, 100], [30, 93], [40, 88], [50, 86], [60, 85], [70, 70], [100, 70]]);
-    defineColor('yellow', [46, 62], [[25, 100], [40, 94], [50, 89], [60, 86], [70, 84], [80, 82], [90, 80], [100, 75]]);
-    defineColor('green', [62, 178], [[30, 100], [40, 90], [50, 85], [60, 81], [70, 74], [80, 64], [90, 50], [100, 40]]);
-    defineColor('blue', [178, 257], [[20, 100], [30, 86], [40, 80], [50, 74], [60, 60], [70, 52], [80, 44], [90, 39], [100, 35]]);
-    defineColor('purple', [257, 282], [[20, 100], [30, 87], [40, 79], [50, 70], [60, 65], [70, 59], [80, 52], [90, 45], [100, 42]]);
-    defineColor('pink', [282, 334], [[20, 100], [30, 90], [40, 86], [60, 84], [80, 80], [90, 75], [100, 73]]);
+    defineColor('monochrome', null, [
+        [0, 0],
+        [100, 0],
+    ]);
+    defineColor('red', [-26, 18], [
+        [20, 100],
+        [30, 92],
+        [40, 89],
+        [50, 85],
+        [60, 78],
+        [70, 70],
+        [80, 60],
+        [90, 55],
+        [100, 50],
+    ]);
+    defineColor('orange', [18, 46], [
+        [20, 100],
+        [30, 93],
+        [40, 88],
+        [50, 86],
+        [60, 85],
+        [70, 70],
+        [100, 70],
+    ]);
+    defineColor('yellow', [46, 62], [
+        [25, 100],
+        [40, 94],
+        [50, 89],
+        [60, 86],
+        [70, 84],
+        [80, 82],
+        [90, 80],
+        [100, 75],
+    ]);
+    defineColor('green', [62, 178], [
+        [30, 100],
+        [40, 90],
+        [50, 85],
+        [60, 81],
+        [70, 74],
+        [80, 64],
+        [90, 50],
+        [100, 40],
+    ]);
+    defineColor('blue', [178, 257], [
+        [20, 100],
+        [30, 86],
+        [40, 80],
+        [50, 74],
+        [60, 60],
+        [70, 52],
+        [80, 44],
+        [90, 39],
+        [100, 35],
+    ]);
+    defineColor('purple', [257, 282], [
+        [20, 100],
+        [30, 87],
+        [40, 79],
+        [50, 70],
+        [60, 65],
+        [70, 59],
+        [80, 52],
+        [90, 45],
+        [100, 42],
+    ]);
+    defineColor('pink', [282, 334], [
+        [20, 100],
+        [30, 90],
+        [40, 86],
+        [60, 84],
+        [80, 80],
+        [90, 75],
+        [100, 73],
+    ]);
     return dict;
 }
 function getColorInfo(hue) {
@@ -280,7 +347,7 @@ function getColorInfo(hue) {
             return color;
         }
     }
-    throw Error('Color hue value not found');
+    throw new Error(`getColorInfo: No color info found for hue value ${hue}. This indicates a gap in the color dictionary hue ranges.`);
 }
 
 /**
@@ -370,7 +437,9 @@ class RGB extends Color {
             return `#${r}${g}${b}`.toUpperCase();
         }
         else {
-            const a = Math.round(this.a * 255).toString(16).padStart(2, '0');
+            const a = Math.round(this.a * 255)
+                .toString(16)
+                .padStart(2, '0');
             return `#${r}${g}${b}${a}`.toUpperCase();
         }
     }
@@ -408,7 +477,6 @@ class RGB extends Color {
             s = delta / (2 - max - min);
         return new HSL(h, s * 100, l * 100, this.a);
     }
-    ;
     /**
      * Converts the RGB color to an HSV color.
      *
@@ -433,9 +501,9 @@ class RGB extends Color {
             if (r === v)
                 h = bdif - gdif;
             else if (g === v)
-                h = (1 / 3) + rdif - bdif;
+                h = 1 / 3 + rdif - bdif;
             else if (b === v)
-                h = (2 / 3) + gdif - rdif;
+                h = 2 / 3 + gdif - rdif;
             if (h < 0)
                 h += 1;
             else if (h > 1)
@@ -451,14 +519,6 @@ class RGB extends Color {
     asRGB() {
         return this.clone();
     }
-    /**
-     * Returns the RGB color.
-     *
-     * @returns The current RGB instance.
-     */
-    toRGB() {
-        return this;
-    }
     /**
      * Parses a string or Color instance into an RGB color.
      *
@@ -551,7 +611,7 @@ class RGB extends Color {
         if (value > 1)
             value = 1;
         const a = 1 - Math.abs(value);
-        const b = (value < 0) ? 0 : 255 * value;
+        const b = value < 0 ? 0 : 255 * value;
         return new RGB(this.r * a + b, this.g * a + b, this.b * a + b, this.a);
     }
     /**
@@ -682,7 +742,7 @@ class HSV extends Color {
         const v = this.v / 100;
         const k = (2 - s) * v;
         const q = k < 1 ? k : 2 - k;
-        return new HSL(this.h, q == 0 ? 0 : 100 * s * v / q, 100 * k / 2, this.a);
+        return new HSL(this.h, q === 0 ? 0 : (100 * s * v) / q, (100 * k) / 2, this.a);
     }
     /**
      * Returns the current HSV color.
@@ -849,13 +909,6 @@ class HSL extends Color {
     asHSL() {
         return this.clone();
     }
-    /**
-     * Returns the current HSL color.
-     * @returns The current HSL color.
-     */
-    toHSL() {
-        return this;
-    }
     /**
      * Converts the HSL color to an HSV color.
      * @returns A new HSV color representing the same color.
@@ -963,7 +1016,7 @@ Color.parse = function (input) {
         case 'hsla(':
             return HSL.parse(input);
         default:
-            throw Error('Unknown color format: ' + input);
+            throw new Error(`Color.parse: Unknown color format "${input}". Expected formats: "#RRGGBB", "#RGB", "rgb(...)", "rgba(...)", "hsl(...)", or "hsla(...)".`);
     }
 };
 Color.HSL = HSL;
@@ -983,19 +1036,12 @@ function getShortbreadTemplate() {
         sources: {
             'versatiles-shortbread': {
                 attribution: '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors',
-                tiles: [
-                    'https://tiles.versatiles.org/tiles/osm/{z}/{x}/{y}',
-                ],
+                tiles: ['https://tiles.versatiles.org/tiles/osm/{z}/{x}/{y}'],
                 type: 'vector',
                 scheme: 'xyz',
-                bounds: [
-                    -180,
-                    -85.0511287798066,
-                    180,
-                    85.0511287798066,
-                ],
+                bounds: [-180, -85.0511287798066, 180, 85.0511287798066],
                 minzoom: 0,
-                maxzoom
+                maxzoom,
             },
         },
         layers: [],
@@ -1006,12 +1052,7 @@ function getShortbreadLayers(option) {
     const { language } = option;
     let nameField = ['get', 'name'];
     if (language) {
-        nameField = [
-            'case',
-            ['to-boolean', ['get', 'name_' + language]],
-            ['get', 'name_' + language],
-            ['get', 'name']
-        ];
+        nameField = ['case', ['to-boolean', ['get', 'name_' + language]], ['get', 'name_' + language], ['get', 'name']];
     }
     return [
         // background
@@ -1021,14 +1062,27 @@ function getShortbreadLayers(option) {
         // land
         {
             id: 'land-glacier',
-            type: 'fill', 'source-layer': 'water_polygons',
+            type: 'fill',
+            'source-layer': 'water_polygons',
             filter: ['all', ['==', 'kind', 'glacier']],
         },
         ...[
             { id: 'commercial', kinds: ['commercial', 'retail'] },
             { id: 'industrial', kinds: ['industrial', 'quarry', 'railway'] },
             { id: 'residential', kinds: ['garages', 'residential'] },
-            { id: 'agriculture', kinds: ['brownfield', 'farmland', 'farmyard', 'greenfield', 'greenhouse_horticulture', 'orchard', 'plant_nursery', 'vineyard'] },
+            {
+                id: 'agriculture',
+                kinds: [
+                    'brownfield',
+                    'farmland',
+                    'farmyard',
+                    'greenfield',
+                    'greenhouse_horticulture',
+                    'orchard',
+                    'plant_nursery',
+                    'vineyard',
+                ],
+            },
             { id: 'waste', kinds: ['landfill'] },
             { id: 'park', kinds: ['park', 'village_green', 'recreation_ground'] },
             { id: 'garden', kinds: ['allotments', 'garden'] },
@@ -1044,45 +1098,63 @@ function getShortbreadLayers(option) {
             id: 'land-' + id,
             type: 'fill',
             'source-layer': 'land',
-            filter: ['all',
-                ['in', 'kind', ...kinds],
-            ],
+            filter: ['all', ['in', 'kind', ...kinds]],
         })),
         // water-lines
         ...['river', 'canal', 'stream', 'ditch'].map((t) => ({
             id: 'water-' + t,
             type: 'line',
             'source-layer': 'water_lines',
-            filter: ['all',
-                ['in', 'kind', t],
-                ['!=', 'tunnel', true],
-                ['!=', 'bridge', true],
-            ],
+            filter: ['all', ['in', 'kind', t], ['!=', 'tunnel', true], ['!=', 'bridge', true]],
         })),
         // water polygons
         {
             id: 'water-area',
-            type: 'fill', 'source-layer': 'water_polygons',
+            type: 'fill',
+            'source-layer': 'water_polygons',
             filter: ['==', 'kind', 'water'],
         },
         {
             id: 'water-area-river',
-            type: 'fill', 'source-layer': 'water_polygons',
+            type: 'fill',
+            'source-layer': 'water_polygons',
             filter: ['==', 'kind', 'river'],
         },
         {
             id: 'water-area-small',
-            type: 'fill', 'source-layer': 'water_polygons',
+            type: 'fill',
+            'source-layer': 'water_polygons',
             filter: ['in', 'kind', 'reservoir', 'basin', 'dock'],
         },
         // dam
         { id: 'water-dam-area', type: 'fill', 'source-layer': 'dam_polygons', filter: ['==', 'kind', 'dam'] },
         { id: 'water-dam', type: 'line', 'source-layer': 'dam_lines', filter: ['==', 'kind', 'dam'] },
         // pier
-        { id: 'water-pier-area', type: 'fill', 'source-layer': 'pier_polygons', filter: ['in', 'kind', 'pier', 'breakwater', 'groyne'] },
-        { id: 'water-pier', type: 'line', 'source-layer': 'pier_lines', filter: ['in', 'kind', 'pier', 'breakwater', 'groyne'] },
+        {
+            id: 'water-pier-area',
+            type: 'fill',
+            'source-layer': 'pier_polygons',
+            filter: ['in', 'kind', 'pier', 'breakwater', 'groyne'],
+        },
+        {
+            id: 'water-pier',
+            type: 'line',
+            'source-layer': 'pier_lines',
+            filter: ['in', 'kind', 'pier', 'breakwater', 'groyne'],
+        },
         // site
-        ...['danger_area', 'sports_center', 'university', 'college', 'school', 'hospital', 'prison', 'parking', 'bicycle_parking', 'construction'].map((t) => ({
+        ...[
+            'danger_area',
+            'sports_center',
+            'university',
+            'college',
+            'school',
+            'hospital',
+            'prison',
+            'parking',
+            'bicycle_parking',
+            'construction',
+        ].map((t) => ({
             id: 'site-' + t.replace(/_/g, ''),
             type: 'fill',
             'source-layer': 'sites',
@@ -1091,32 +1163,44 @@ function getShortbreadLayers(option) {
         // airport
         {
             id: 'airport-area',
-            type: 'fill', 'source-layer': 'street_polygons', filter: ['in', 'kind', 'runway', 'taxiway'],
+            type: 'fill',
+            'source-layer': 'street_polygons',
+            filter: ['in', 'kind', 'runway', 'taxiway'],
         },
         {
             id: 'airport-taxiway:outline',
-            type: 'line', 'source-layer': 'streets', filter: ['==', 'kind', 'taxiway'],
+            type: 'line',
+            'source-layer': 'streets',
+            filter: ['==', 'kind', 'taxiway'],
         },
         {
             id: 'airport-runway:outline',
-            type: 'line', 'source-layer': 'streets', filter: ['==', 'kind', 'runway'],
+            type: 'line',
+            'source-layer': 'streets',
+            filter: ['==', 'kind', 'runway'],
         },
         {
             id: 'airport-taxiway',
-            type: 'line', 'source-layer': 'streets', filter: ['==', 'kind', 'taxiway'],
+            type: 'line',
+            'source-layer': 'streets',
+            filter: ['==', 'kind', 'taxiway'],
         },
         {
             id: 'airport-runway',
-            type: 'line', 'source-layer': 'streets', filter: ['==', 'kind', 'runway'],
+            type: 'line',
+            'source-layer': 'streets',
+            filter: ['==', 'kind', 'runway'],
         },
         // building
         {
             id: 'building:outline',
-            type: 'fill', 'source-layer': 'buildings',
+            type: 'fill',
+            'source-layer': 'buildings',
         },
         {
             id: 'building',
-            type: 'fill', 'source-layer': 'buildings',
+            type: 'fill',
+            'source-layer': 'buildings',
         },
         // tunnel-, street-, bridges-bridge
         ...['tunnel', 'street', 'bridge'].flatMap((c) => {
@@ -1131,7 +1215,10 @@ function getShortbreadLayers(option) {
                     suffixes = [':outline', ''];
                     break;
                 case 'street':
-                    filter = [['!=', 'bridge', true], ['!=', 'tunnel', true]];
+                    filter = [
+                        ['!=', 'bridge', true],
+                        ['!=', 'tunnel', true],
+                    ];
                     prefix = '';
                     suffixes = [':outline', ''];
                     break;
@@ -1155,85 +1242,64 @@ function getShortbreadLayers(option) {
                     type: 'fill',
                     'source-layer': 'bridges',
                 });
-            suffixes.forEach(suffix => {
+            suffixes.forEach((suffix) => {
                 // pedestrian zone — no outline
                 if (suffix === ':outline')
                     results.push({
                         id: prefix + 'street-pedestrian-zone',
                         type: 'fill',
                         'source-layer': 'street_polygons',
-                        filter: ['all',
-                            ...filter,
-                            ['==', 'kind', 'pedestrian'],
-                        ],
+                        filter: ['all', ...filter, ['==', 'kind', 'pedestrian']],
                     });
                 // non-car streets
-                ['footway', 'steps', 'path', 'cycleway'].forEach(t => {
+                ['footway', 'steps', 'path', 'cycleway'].forEach((t) => {
                     results.push({
                         id: prefix + 'way-' + t.replace(/_/g, '') + suffix,
                         type: 'line',
                         'source-layer': 'streets',
-                        filter: ['all',
-                            ...filter,
-                            ['in', 'kind', t],
-                        ],
+                        filter: ['all', ...filter, ['in', 'kind', t]],
                     });
                 });
                 // no links
-                ['track', 'pedestrian', 'service', 'living_street', 'residential', 'unclassified'].forEach(t => {
+                ['track', 'pedestrian', 'service', 'living_street', 'residential', 'unclassified'].forEach((t) => {
                     results.push({
                         id: prefix + 'street-' + t.replace(/_/g, '') + suffix,
                         type: 'line',
                         'source-layer': 'streets',
-                        filter: ['all',
-                            ['==', 'kind', t],
-                            ...filter,
-                        ],
+                        filter: ['all', ['==', 'kind', t], ...filter],
                     });
                 });
                 // no links, bicycle=designated
                 if (suffix === '')
-                    ['track', 'pedestrian', 'service', 'living_street', 'residential', 'unclassified'].forEach(t => {
+                    ['track', 'pedestrian', 'service', 'living_street', 'residential', 'unclassified'].forEach((t) => {
                         results.push({
                             id: prefix + 'street-' + t.replace(/_/g, '') + '-bicycle',
                             type: 'line',
                             'source-layer': 'streets',
-                            filter: ['all',
-                                ['==', 'kind', t],
-                                ['==', 'bicycle', 'designated'],
-                                ...filter,
-                            ],
+                            filter: ['all', ['==', 'kind', t], ['==', 'bicycle', 'designated'], ...filter],
                         });
                     });
                 // links
-                ['tertiary', 'secondary', 'primary', 'trunk', 'motorway'].forEach(t => {
+                ['tertiary', 'secondary', 'primary', 'trunk', 'motorway'].forEach((t) => {
                     results.push({
                         id: prefix + 'street-' + t.replace(/_/g, '') + '-link' + suffix,
                         type: 'line',
                         'source-layer': 'streets',
-                        filter: ['all',
-                            ...filter,
-                            ['in', 'kind', t],
-                            ['==', 'link', true],
-                        ],
+                        filter: ['all', ...filter, ['in', 'kind', t], ['==', 'link', true]],
                     });
                 });
                 // main
-                ['tertiary', 'secondary', 'primary', 'trunk', 'motorway'].forEach(t => {
+                ['tertiary', 'secondary', 'primary', 'trunk', 'motorway'].forEach((t) => {
                     results.push({
                         id: prefix + 'street-' + t.replace(/_/g, '') + suffix,
                         type: 'line',
                         'source-layer': 'streets',
-                        filter: ['all',
-                            ...filter,
-                            ['in', 'kind', t],
-                            ['!=', 'link', true],
-                        ],
+                        filter: ['all', ...filter, ['in', 'kind', t], ['!=', 'link', true]],
                     });
                 });
             });
             // separate outline for trains
-            [':outline', ''].forEach(suffix => {
+            [':outline', ''].forEach((suffix) => {
                 // with service distinction
                 ['rail', 'light_rail', 'subway', 'narrow_gauge', 'tram'].reverse().forEach((t) => {
                     // main rail
@@ -1241,22 +1307,14 @@ function getShortbreadLayers(option) {
                         id: prefix + 'transport-' + t.replace(/_/g, '') + suffix,
                         type: 'line',
                         'source-layer': 'streets',
-                        filter: ['all',
-                            ['in', 'kind', t],
-                            ['!has', 'service'],
-                            ...filter,
-                        ],
+                        filter: ['all', ['in', 'kind', t], ['!has', 'service'], ...filter],
                     });
                     // service rail (crossover, siding, spur, yard)
                     results.push({
                         id: prefix + 'transport-' + t.replace(/_/g, '') + '-service' + suffix,
                         type: 'line',
                         'source-layer': 'streets',
-                        filter: ['all',
-                            ['in', 'kind', t],
-                            ['has', 'service'],
-                            ...filter,
-                        ],
+                        filter: ['all', ['in', 'kind', t], ['has', 'service'], ...filter],
                     });
                 });
                 // other transport
@@ -1265,23 +1323,19 @@ function getShortbreadLayers(option) {
                         id: prefix + 'transport-' + t.replace(/_/g, '') + suffix,
                         type: 'line',
                         'source-layer': 'streets',
-                        filter: ['all',
-                            ['in', 'kind', t],
-                            ...filter,
-                        ],
+                        filter: ['all', ['in', 'kind', t], ...filter],
                     });
                 });
                 if (c === 'street') {
                     // aerialway, no bridges, above street evel
-                    ['cable_car', 'gondola', 'goods', 'chair_lift', 'drag_lift', 't-bar', 'j-bar', 'platter', 'rope-tow'].reverse().forEach((t) => {
+                    ['cable_car', 'gondola', 'goods', 'chair_lift', 'drag_lift', 't-bar', 'j-bar', 'platter', 'rope-tow']
+                        .reverse()
+                        .forEach((t) => {
                         results.push({
                             id: 'aerialway-' + t.replace(/[_-]+/g, '') + suffix,
                             type: 'line',
                             'source-layer': 'aerialways',
-                            filter: ['all',
-                                ...filter,
-                                ['in', 'kind', t],
-                            ],
+                            filter: ['all', ...filter, ['in', 'kind', t]],
                         });
                     });
                     // ferry — only on street level
@@ -1307,7 +1361,8 @@ function getShortbreadLayers(option) {
                 id: 'boundary-country' + suffix,
                 type: 'line',
                 'source-layer': 'boundaries',
-                filter: ['all',
+                filter: [
+                    'all',
                     ['==', 'admin_level', 2],
                     ['!=', 'maritime', true],
                     ['!=', 'disputed', true],
@@ -1318,7 +1373,8 @@ function getShortbreadLayers(option) {
                 id: 'boundary-country-disputed' + suffix,
                 type: 'line',
                 'source-layer': 'boundaries',
-                filter: ['all',
+                filter: [
+                    'all',
                     ['==', 'admin_level', 2],
                     ['==', 'disputed', true],
                     ['!=', 'maritime', true],
@@ -1329,7 +1385,8 @@ function getShortbreadLayers(option) {
                 id: 'boundary-country-maritime' + suffix,
                 type: 'line',
                 'source-layer': 'boundaries',
-                filter: ['all',
+                filter: [
+                    'all',
                     ['==', 'admin_level', 2],
                     ['==', 'maritime', true],
                     ['!=', 'disputed', true],
@@ -1340,7 +1397,8 @@ function getShortbreadLayers(option) {
                 id: 'boundary-state' + suffix,
                 type: 'line',
                 'source-layer': 'boundaries',
-                filter: ['all',
+                filter: [
+                    'all',
                     ['==', 'admin_level', 4],
                     ['!=', 'maritime', true],
                     ['!=', 'disputed', true],
@@ -1382,7 +1440,14 @@ function getShortbreadLayers(option) {
             layout: { 'text-field': nameField },
         })),
         // label-place of small places
-        ...[/*'locality', 'island', 'farm', 'dwelling',*/ 'neighbourhood', 'quarter', 'suburb', 'hamlet', 'village', 'town'].map((id) => ({
+        ...[
+            /*'locality', 'island', 'farm', 'dwelling',*/ 'neighbourhood',
+            'quarter',
+            'suburb',
+            'hamlet',
+            'village',
+            'town',
+        ].map((id) => ({
             id: 'label-place-' + id.replace(/_/g, ''),
             type: 'symbol',
             'source-layer': 'place_labels',
@@ -1409,31 +1474,21 @@ function getShortbreadLayers(option) {
             id: 'label-boundary-country-small',
             type: 'symbol',
             'source-layer': 'boundary_labels',
-            filter: ['all',
-                ['in', 'admin_level', 2, '2'],
-                ['<=', 'way_area', 10000000],
-            ],
+            filter: ['all', ['in', 'admin_level', 2, '2'], ['<=', 'way_area', 10000000]],
             layout: { 'text-field': nameField },
         },
         {
             id: 'label-boundary-country-medium',
             type: 'symbol',
             'source-layer': 'boundary_labels',
-            filter: ['all',
-                ['in', 'admin_level', 2, '2'],
-                ['<', 'way_area', 90000000],
-                ['>', 'way_area', 10000000],
-            ],
+            filter: ['all', ['in', 'admin_level', 2, '2'], ['<', 'way_area', 90000000], ['>', 'way_area', 10000000]],
             layout: { 'text-field': nameField },
         },
         {
             id: 'label-boundary-country-large',
             type: 'symbol',
             'source-layer': 'boundary_labels',
-            filter: ['all',
-                ['in', 'admin_level', 2, '2'],
-                ['>=', 'way_area', 90000000],
-            ],
+            filter: ['all', ['in', 'admin_level', 2, '2'], ['>=', 'way_area', 90000000]],
             layout: { 'text-field': nameField },
         },
         // marking
@@ -1441,7 +1496,8 @@ function getShortbreadLayers(option) {
             id: 'marking-oneway', // streets → oneway
             type: 'symbol',
             'source-layer': 'streets',
-            filter: ['all',
+            filter: [
+                'all',
                 ['==', 'oneway', true],
                 ['in', 'kind', 'trunk', 'primary', 'secondary', 'tertiary', 'unclassified', 'residential', 'living_street'],
             ],
@@ -1458,7 +1514,8 @@ function getShortbreadLayers(option) {
             id: 'marking-oneway-reverse', // oneway_reverse
             type: 'symbol',
             'source-layer': 'streets',
-            filter: ['all',
+            filter: [
+                'all',
                 ['==', 'oneway_reverse', true],
                 ['in', 'kind', 'trunk', 'primary', 'secondary', 'tertiary', 'unclassified', 'residential', 'living_street'],
             ],
@@ -1475,10 +1532,7 @@ function getShortbreadLayers(option) {
             id: 'marking-bicycle', // bicycle=designated or kind=cycleway
             type: 'symbol',
             'source-layer': 'streets',
-            filter: ['all',
-                ['==', 'bicycle', 'designated'],
-                ['==', 'kind', 'cycleway'],
-            ],
+            filter: ['all', ['==', 'bicycle', 'designated'], ['==', 'kind', 'cycleway']],
             layout: {
                 'symbol-placement': 'line',
                 'symbol-spacing': 50,
@@ -1503,50 +1557,35 @@ function getShortbreadLayers(option) {
             id: 'symbol-transit-subway',
             type: 'symbol',
             'source-layer': 'public_transport',
-            filter: ['all',
-                ['in', 'kind', 'station', 'halt'],
-                ['==', 'station', 'subway'],
-            ],
+            filter: ['all', ['in', 'kind', 'station', 'halt'], ['==', 'station', 'subway']],
             layout: { 'text-field': nameField },
         },
         {
             id: 'symbol-transit-lightrail',
             type: 'symbol',
             'source-layer': 'public_transport',
-            filter: ['all',
-                ['in', 'kind', 'station', 'halt'],
-                ['==', 'station', 'light_rail'],
-            ],
+            filter: ['all', ['in', 'kind', 'station', 'halt'], ['==', 'station', 'light_rail']],
             layout: { 'text-field': nameField },
         },
         {
             id: 'symbol-transit-station',
             type: 'symbol',
             'source-layer': 'public_transport',
-            filter: ['all',
-                ['in', 'kind', 'station', 'halt'],
-                ['!in', 'station', 'light_rail', 'subway'],
-            ],
+            filter: ['all', ['in', 'kind', 'station', 'halt'], ['!in', 'station', 'light_rail', 'subway']],
             layout: { 'text-field': nameField },
         },
         {
             id: 'symbol-transit-airfield',
             type: 'symbol',
             'source-layer': 'public_transport',
-            filter: ['all',
-                ['==', 'kind', 'aerodrome'],
-                ['!has', 'iata'],
-            ],
+            filter: ['all', ['==', 'kind', 'aerodrome'], ['!has', 'iata']],
             layout: { 'text-field': nameField },
         },
         {
             id: 'symbol-transit-airport',
             type: 'symbol',
             'source-layer': 'public_transport',
-            filter: ['all',
-                ['==', 'kind', 'aerodrome'],
-                ['has', 'iata'],
-            ],
+            filter: ['all', ['==', 'kind', 'aerodrome'], ['has', 'iata']],
             layout: { 'text-field': nameField },
         },
     ];
@@ -1915,7 +1954,12 @@ const propertyDefs = [
     { parent: 'layout', types: 'symbol', key: 'text-rotation-alignment', valueType: 'enum' },
     { parent: 'layout', types: 'symbol', key: 'text-size', short: 'size', valueType: 'number' },
     { parent: 'layout', types: 'symbol', key: 'text-transform', valueType: 'enum' },
-    { parent: 'layout', types: 'symbol', key: 'text-variable-anchor-offset', valueType: 'variableAnchorOffsetCollection' },
+    {
+        parent: 'layout',
+        types: 'symbol',
+        key: 'text-variable-anchor-offset',
+        valueType: 'variableAnchorOffsetCollection',
+    },
     { parent: 'layout', types: 'symbol', key: 'text-variable-anchor', valueType: 'array' },
     { parent: 'layout', types: 'symbol', key: 'text-writing-mode', valueType: 'array' },
     { parent: 'paint', types: 'background', key: 'background-color', short: 'color', valueType: 'color' },
@@ -1996,7 +2040,8 @@ function deepClone(obj) {
             case 'string':
             case 'undefined':
                 return obj;
-            default: throw new Error(`Not implemented yet: "${type}" case`);
+            default:
+                throw new Error(`Not implemented yet: "${type}" case`);
         }
     }
     if (isSimpleObject(obj)) {
@@ -2010,9 +2055,7 @@ function deepClone(obj) {
     }
     if (obj == null)
         return obj;
-    console.log('obj', obj);
-    console.log('obj.prototype', Object.getPrototypeOf(obj));
-    throw Error();
+    throw new Error(`deepClone: Unsupported object type "${Object.getPrototypeOf(obj)?.constructor?.name ?? 'unknown'}"`);
 }
 function isSimpleObject(item) {
     if (item === null)
@@ -2038,7 +2081,7 @@ function isBasicType(item) {
         case 'object':
             return false;
         default:
-            throw Error('unknown type: ' + typeof item);
+            throw new Error(`isBasicType: Unknown type "${typeof item}"`);
     }
 }
 function deepMerge(source0, ...sources) {
@@ -2050,9 +2093,7 @@ function deepMerge(source0, ...sources) {
             if (!(key in source))
                 continue;
             const sourceValue = source[key];
-            // *********
-            // overwrite
-            // *********
+            // Handle basic types (number, string, boolean) - always overwrite
             switch (typeof sourceValue) {
                 case 'number':
                 case 'string':
@@ -2060,28 +2101,23 @@ function deepMerge(source0, ...sources) {
                     target[key] = sourceValue;
                     continue;
             }
+            // If target is a basic type, overwrite with deep clone of source
             if (isBasicType(target[key])) {
                 target[key] = deepClone(sourceValue);
                 continue;
             }
+            // Handle Color instances - clone the source color
             if (sourceValue instanceof Color) {
                 target[key] = sourceValue.clone();
                 continue;
             }
+            // If both are simple objects, merge them recursively
             if (isSimpleObject(target[key]) && isSimpleObject(sourceValue)) {
                 target[key] = deepMerge(target[key], sourceValue);
                 continue;
             }
-            // *********
-            // merge
-            // *********
-            if (isSimpleObject(target[key]) && isSimpleObject(sourceValue)) {
-                target[key] = deepMerge(target[key], sourceValue);
-                continue;
-            }
-            console.log('target[key]:', target[key]);
-            console.log('source[key]:', source[key]);
-            throw Error('unpredicted case');
+            // Incompatible types - throw error
+            throw new Error(`deepMerge: Cannot merge incompatible types for key "${String(key)}" (target: ${typeof target[key]}, source: ${typeof sourceValue})`);
         }
     }
     return target;
@@ -2108,7 +2144,7 @@ function basename(url) {
 }
 
 function decorate(layers, rules, recolor) {
-    const layerIds = layers.map(l => l.id);
+    const layerIds = layers.map((l) => l.id);
     const layerIdSet = new Set(layerIds);
     // Initialize a new map to hold final styles for layers
     const layerStyles = new Map();
@@ -2117,25 +2153,25 @@ function decorate(layers, rules, recolor) {
         if (layerStyle == null)
             return;
         // Expand any braces in IDs and filter them through a RegExp if necessary
-        const ids = expandTop(idDef).flatMap(id => {
+        const ids = expandTop(idDef).flatMap((id) => {
             if (!id.includes('*'))
                 return id;
-            const regExpString = id.replace(/[^a-z_:-]/g, c => {
+            const regExpString = id.replace(/[^a-z_:-]/g, (c) => {
                 if (c === '*')
                     return '[a-z_-]*';
-                throw new Error('unknown char to process. Do not know how to make a RegExp from: ' + JSON.stringify(c));
+                throw new Error(`decorator: Invalid character ${JSON.stringify(c)} in layer ID pattern "${id}". Only alphanumeric, underscore, colon, hyphen, and asterisk are allowed.`);
             });
             const regExp = new RegExp(`^${regExpString}$`, 'i');
-            return layerIds.filter(layerId => regExp.test(layerId));
+            return layerIds.filter((layerId) => regExp.test(layerId));
         });
-        ids.forEach(id => {
+        ids.forEach((id) => {
             if (!layerIdSet.has(id))
                 return;
             layerStyles.set(id, deepMerge(layerStyles.get(id) ?? {}, layerStyle));
         });
     });
     // Deep clone the original layers and apply styles
-    return layers.flatMap(layer => {
+    return layers.flatMap((layer) => {
         // Get the id and style of the layer
         const layerStyle = layerStyles.get(layer.id);
         // Don't export layers that have no style
@@ -2150,11 +2186,11 @@ function decorate(layers, rules, recolor) {
             if (ruleValue == null)
                 continue;
             // CamelCase to not-camel-case
-            const ruleKey = ruleKeyCamelCase.replace(/[A-Z]/g, c => '-' + c.toLowerCase());
+            const ruleKey = ruleKeyCamelCase.replace(/[A-Z]/g, (c) => '-' + c.toLowerCase());
             const propertyDefs = propertyLookup.get(layer.type + '/' + ruleKey);
             if (!propertyDefs)
                 continue;
-            propertyDefs.forEach(propertyDef => {
+            propertyDefs.forEach((propertyDef) => {
                 const { key } = propertyDef;
                 let value = ruleValue;
                 switch (propertyDef.valueType) {
@@ -2172,27 +2208,25 @@ function decorate(layers, rules, recolor) {
                     case 'number':
                         value = processExpression(value);
                         break;
-                    default: throw new Error(`unknown propertyDef.valueType "${propertyDef.valueType}" for key "${key}"`);
+                    default:
+                        throw new Error(`decorator: Unknown property value type "${propertyDef.valueType}" for key "${key}" on layer type "${layer.type}". This may indicate a MapLibre property definition mismatch.`);
                 }
                 switch (propertyDef.parent) {
                     case 'layer':
-                        // @ts-expect-error: too complex to handle
                         layer[key] = value;
                         break;
                     case 'layout':
                         if (!layer.layout)
                             layer.layout = {};
-                        // @ts-expect-error: too complex to handle
                         layer.layout[key] = value;
                         break;
                     case 'paint':
                         if (!layer.paint)
                             layer.paint = {};
-                        // @ts-expect-error: too complex to handle
                         layer.paint[key] = value;
                         break;
                     default:
-                        throw new Error(`unknown parent "${propertyDef.parent}" for key "${key}"`);
+                        throw new Error(`decorator: Unknown property parent "${propertyDef.parent}" for key "${key}" on layer type "${layer.type}". Expected "layer", "layout", or "paint".`);
                 }
             });
         }
@@ -2203,12 +2237,12 @@ function decorate(layers, rules, recolor) {
                 const color = recolor.do(value);
                 return color.asString();
             }
-            throw new Error(`unknown color type "${typeof value}"`);
+            throw new Error(`decorator.processColor: Expected a color string or Color instance, but got ${typeof value}. Value: ${JSON.stringify(value)}`);
         }
         function processFont(value) {
             if (typeof value === 'string')
                 return [value];
-            throw new Error(`unknown font type "${typeof value}"`);
+            throw new Error(`decorator.processFont: Expected a font name string, but got ${typeof value}. Value: ${JSON.stringify(value)}`);
         }
         function processExpression(value, cbValue) {
             if (typeof value === 'object') {
@@ -2255,7 +2289,7 @@ function getDefaultRecolorFlags() {
  * Checks if the given options object contains any active recolor transformations.
  * @param opt The recolor options to validate.
  */
-function isValidRecolorOptions(opt) {
+function hasActiveRecolorOptions(opt) {
     if (!opt)
         return false;
     return (opt.invertBrightness ||
@@ -2276,14 +2310,20 @@ class CachedRecolor {
     skip;
     opt;
     cache;
+    parsedTintColor;
+    parsedBlendColor;
     /**
      * Creates a cached recolor instance.
      * @param opt Optional recolor options.
      */
     constructor(opt) {
-        this.skip = !isValidRecolorOptions(opt);
+        this.skip = !hasActiveRecolorOptions(opt);
         this.cache = new Map();
         this.opt = opt;
+        if (opt?.tint && opt.tintColor != null)
+            this.parsedTintColor = Color.parse(opt.tintColor);
+        if (opt?.blend && opt.blendColor != null)
+            this.parsedBlendColor = Color.parse(opt.blendColor);
     }
     /**
      * Applies cached recoloring to a given color.
@@ -2296,7 +2336,7 @@ class CachedRecolor {
         const key = color.asHex();
         if (this.cache.has(key))
             return this.cache.get(key);
-        const recolored = recolor(color, this.opt);
+        const recolored = recolor(color, this.opt, this.parsedTintColor, this.parsedBlendColor);
         this.cache.set(key, recolored);
         return recolored;
     }
@@ -2305,10 +2345,12 @@ class CachedRecolor {
  * Applies the specified recoloring transformations to a single color.
  * @param color The original color.
  * @param opt Optional recolor options.
+ * @param parsedTintColor Optional pre-parsed tint color to avoid repeated parsing.
+ * @param parsedBlendColor Optional pre-parsed blend color to avoid repeated parsing.
  * @returns A new `Color` instance with applied transformations.
  */
-function recolor(color, opt) {
-    if (!isValidRecolorOptions(opt))
+function recolor(color, opt, parsedTintColor, parsedBlendColor) {
+    if (!hasActiveRecolorOptions(opt))
         return color;
     if (opt.invertBrightness)
         color = color.invertLuminosity();
@@ -2316,35 +2358,77 @@ function recolor(color, opt) {
         color = color.rotateHue(opt.rotate);
     if (opt.saturate)
         color = color.saturate(opt.saturate);
-    if (opt.gamma != null && opt.gamma != 1)
+    if (opt.gamma != null && opt.gamma !== 1)
         color = color.gamma(opt.gamma);
-    if (opt.contrast != null && opt.contrast != 1)
+    if (opt.contrast != null && opt.contrast !== 1)
         color = color.contrast(opt.contrast);
     if (opt.brightness)
         color = color.brightness(opt.brightness);
     if (opt.tint && opt.tintColor != null)
-        color = color.tint(opt.tint, Color.parse(opt.tintColor));
+        color = color.tint(opt.tint, parsedTintColor ?? Color.parse(opt.tintColor));
     if (opt.blend && opt.blendColor != null)
-        color = color.blend(opt.blend, Color.parse(opt.blendColor));
+        color = color.blend(opt.blend, parsedBlendColor ?? Color.parse(opt.blendColor));
     return color;
 }
 
-const styleBuilderColorKeys = ['agriculture', 'boundary', 'building', 'buildingbg', 'burial', 'commercial', 'construction', 'cycle', 'danger', 'disputed', 'education', 'foot', 'glacier', 'grass', 'hospital', 'industrial', 'label', 'labelHalo', 'land', 'leisure', 'motorway', 'motorwaybg', 'park', 'parking', 'poi', 'prison', 'rail', 'residential', 'rock', 'sand', 'shield', 'street', 'streetbg', 'subway', 'symbol', 'trunk', 'trunkbg', 'waste', 'water', 'wetland', 'wood'];
+const styleBuilderColorKeys = [
+    'agriculture',
+    'boundary',
+    'building',
+    'buildingbg',
+    'burial',
+    'commercial',
+    'construction',
+    'cycle',
+    'danger',
+    'disputed',
+    'education',
+    'foot',
+    'glacier',
+    'grass',
+    'hospital',
+    'industrial',
+    'label',
+    'labelHalo',
+    'land',
+    'leisure',
+    'motorway',
+    'motorwaybg',
+    'park',
+    'parking',
+    'poi',
+    'prison',
+    'rail',
+    'residential',
+    'rock',
+    'sand',
+    'shield',
+    'street',
+    'streetbg',
+    'subway',
+    'symbol',
+    'trunk',
+    'trunkbg',
+    'waste',
+    'water',
+    'wetland',
+    'wood',
+];
 
 // StyleBuilder class definition
 class StyleBuilder {
     #sourceName = 'versatiles-shortbread';
     build(options) {
         options ??= {};
-        // @ts-expect-error globalThis may be undefined in some environments
-        const baseUrl = options.baseUrl ?? globalThis?.document?.location?.origin ?? 'https://tiles.versatiles.org';
-        const glyphs = options.glyphs ?? '/assets/glyphs/{fontstack}/{range}.pbf';
-        const sprite = options.sprite ?? [{ id: 'basics', url: '/assets/sprites/basics/sprites' }];
-        const tiles = options.tiles ?? ['/tiles/osm/{z}/{x}/{y}'];
-        const bounds = options.bounds ?? [-180, -85.0511287798066, 180, 85.0511287798066];
-        const hideLabels = options.hideLabels ?? false;
-        const language = options.language ?? null;
-        const recolorOptions = options.recolor ?? getDefaultRecolorFlags();
+        const defaults = this.getDefaultOptions();
+        const baseUrl = options.baseUrl ?? defaults.baseUrl;
+        const glyphs = options.glyphs ?? defaults.glyphs;
+        const sprite = options.sprite ?? defaults.sprite;
+        const tiles = options.tiles ?? defaults.tiles;
+        const bounds = options.bounds ?? defaults.bounds;
+        const hideLabels = options.hideLabels ?? defaults.hideLabels;
+        const language = options.language ?? defaults.language;
+        const recolorOptions = options.recolor ?? defaults.recolor;
         const colors = this.getColors(this.defaultColors);
         if (options.colors) {
             let key;
@@ -2374,8 +2458,9 @@ class StyleBuilder {
         const layerStyleRules = this.getStyleRules(styleRuleOptions);
         // get shortbread layers
         const layerDefinitions = getShortbreadLayers({ language });
-        let layers = layerDefinitions.map(layer => {
-            switch (layer.type) {
+        let layers = layerDefinitions.map((layer) => {
+            const { type, id } = layer;
+            switch (type) {
                 case 'background':
                     return layer;
                 case 'fill':
@@ -2386,17 +2471,17 @@ class StyleBuilder {
                         ...layer,
                     };
             }
-            throw Error('unknown layer type');
+            throw new Error(`StyleBuilder: Unknown layer type "${type}" for layer "${id}". Expected "background", "fill", "line", or "symbol".`);
         });
         // apply layer rules
         layers = decorate(layers, layerStyleRules, new CachedRecolor(recolorOptions));
         // hide labels, if wanted
         if (hideLabels)
-            layers = layers.filter(l => l.type !== 'symbol');
+            layers = layers.filter((l) => l.type !== 'symbol');
         style.layers = layers;
         style.name = 'versatiles-' + this.name.toLowerCase();
         style.glyphs = resolveUrl(baseUrl, glyphs);
-        if (typeof sprite == 'string') {
+        if (typeof sprite === 'string') {
             style.sprite = [{ id: basename(sprite), url: resolveUrl(baseUrl, sprite) }];
         }
         else {
@@ -2404,7 +2489,7 @@ class StyleBuilder {
         }
         const source = style.sources[this.#sourceName];
         if ('tiles' in source)
-            source.tiles = tiles.map(url => resolveUrl(baseUrl, url));
+            source.tiles = tiles.map((url) => resolveUrl(baseUrl, url));
         if ('bounds' in source)
             source.bounds = bounds;
         return style;
@@ -2416,18 +2501,14 @@ class StyleBuilder {
     }
     getDefaultOptions() {
         return {
-            baseUrl: '',
-            bounds: [
-                -180,
-                -85.0511287798066,
-                180,
-                85.0511287798066
-            ],
-            glyphs: '',
-            sprite: '',
-            tiles: [],
+            // @ts-expect-error globalThis may be undefined in some environments
+            baseUrl: globalThis?.document?.location?.origin ?? 'https://tiles.versatiles.org',
+            bounds: [-180, -85.0511287798066, 180, 85.0511287798066],
+            glyphs: '/assets/glyphs/{fontstack}/{range}.pbf',
+            sprite: [{ id: 'basics', url: '/assets/sprites/basics/sprites' }],
+            tiles: ['/tiles/osm/{z}/{x}/{y}'],
             hideLabels: false,
-            language: undefined,
+            language: '',
             colors: deepClone(this.defaultColors),
             fonts: deepClone(this.defaultFonts),
             recolor: getDefaultRecolorFlags(),
@@ -2535,7 +2616,7 @@ class Colorful extends StyleBuilder {
         const { colors, fonts } = options;
         return {
             // background
-            'background': {
+            background: {
                 color: colors.land,
             },
             // boundary
@@ -2689,7 +2770,8 @@ class Colorful extends StyleBuilder {
                 color: colors.buildingbg,
                 opacity: { 14: 0, 15: 1 },
             },
-            'building': {
+            building: {
+                // fake 2.5d with translate
                 color: colors.building,
                 opacity: { 14: 0, 15: 1 },
                 fillTranslate: [-2, -2],
@@ -2722,7 +2804,7 @@ class Colorful extends StyleBuilder {
                 opacity: { 13: 0, 14: 1 },
             },
             // bridge
-            'bridge': {
+            bridge: {
                 color: colors.land.darken(0.02),
                 fillAntialias: true,
                 opacity: 0.8,
@@ -2768,37 +2850,37 @@ class Colorful extends StyleBuilder {
                 opacity: 0.5,
             },
             'bridge-street-motorway:bridge': {
-                size: { '5': 0, '6': 3, '10': 7, '14': 7, '16': 20, '18': 53, '19': 118, '20': 235 }
+                size: { '5': 0, '6': 3, '10': 7, '14': 7, '16': 20, '18': 53, '19': 118, '20': 235 },
             },
             'bridge-street-trunk:bridge': {
-                size: { '7': 0, '8': 3, '10': 6, '14': 8, '16': 17, '18': 50, '19': 104, '20': 202 }
+                size: { '7': 0, '8': 3, '10': 6, '14': 8, '16': 17, '18': 50, '19': 104, '20': 202 },
             },
             'bridge-street-primary:bridge': {
-                size: { '8': 0, '9': 1, '10': 6, '14': 8, '16': 17, '18': 50, '19': 104, '20': 202 }
+                size: { '8': 0, '9': 1, '10': 6, '14': 8, '16': 17, '18': 50, '19': 104, '20': 202 },
             },
             'bridge-street-secondary:bridge': {
                 size: { '11': 3, '14': 7, '16': 11, '18': 42, '19': 95, '20': 193 },
-                opacity: { '11': 0, '12': 1 }
+                opacity: { '11': 0, '12': 1 },
             },
             'bridge-street-motorway-link:bridge': {
                 minzoom: 12,
-                size: { '12': 3, '14': 4, '16': 10, '18': 20, '20': 56 }
+                size: { '12': 3, '14': 4, '16': 10, '18': 20, '20': 56 },
             },
             'bridge-street-{trunk,primary,secondary}-link:bridge': {
                 minzoom: 13,
-                size: { '12': 3, '14': 4, '16': 10, '18': 20, '20': 56 }
+                size: { '12': 3, '14': 4, '16': 10, '18': 20, '20': 56 },
             },
             'bridge-street-{tertiary,tertiary-link,unclassified,residential,livingstreet,pedestrian}*:bridge': {
                 size: { '12': 3, '14': 4, '16': 8, '18': 36, '19': 90, '20': 179 },
-                opacity: { '12': 0, '13': 1 }
+                opacity: { '12': 0, '13': 1 },
             },
             'bridge-street-{service,track}:bridge': {
                 size: { '14': 3, '16': 6, '18': 25, '19': 67, '20': 134 },
-                opacity: { '14': 0, '15': 1 }
+                opacity: { '14': 0, '15': 1 },
             },
             'bridge-way-*:bridge': {
                 size: { '15': 0, '16': 7, '18': 10, '19': 17, '20': 31 },
-                minzoom: 15
+                minzoom: 15,
             },
             // special color: motorway
             '{bridge-,}street-motorway{-link,}:outline': {
@@ -3228,177 +3310,285 @@ class Colorful extends StyleBuilder {
                 color: colors.poi,
             },
             'poi-amenity': {
-                image: ['match',
+                image: [
+                    'match',
                     ['get', 'amenity'],
-                    'arts_centre', 'basics:icon-art_gallery',
-                    'atm', 'basics:icon-atm',
-                    'bank', 'basics:icon-bank',
-                    'bar', 'basics:icon-bar',
-                    'bench', 'basics:icon-bench',
-                    'bicycle_rental', 'basics:icon-bicycle_share',
-                    'biergarten', 'basics:icon-beergarden',
-                    'cafe', 'basics:icon-cafe',
-                    'car_rental', 'basics:icon-car_rental',
-                    'car_sharing', 'basics:icon-car_rental',
-                    'car_wash', 'basics:icon-car_wash',
-                    'cinema', 'basics:icon-cinema',
+                    'arts_centre',
+                    'basics:icon-art_gallery',
+                    'atm',
+                    'basics:icon-atm',
+                    'bank',
+                    'basics:icon-bank',
+                    'bar',
+                    'basics:icon-bar',
+                    'bench',
+                    'basics:icon-bench',
+                    'bicycle_rental',
+                    'basics:icon-bicycle_share',
+                    'biergarten',
+                    'basics:icon-beergarden',
+                    'cafe',
+                    'basics:icon-cafe',
+                    'car_rental',
+                    'basics:icon-car_rental',
+                    'car_sharing',
+                    'basics:icon-car_rental',
+                    'car_wash',
+                    'basics:icon-car_wash',
+                    'cinema',
+                    'basics:icon-cinema',
                     //'clinic', 'basics:icon-clinic',
-                    'college', 'basics:icon-college',
-                    'community_centre', 'basics:icon-community',
+                    'college',
+                    'basics:icon-college',
+                    'community_centre',
+                    'basics:icon-community',
                     //'courthouse', 'basics:icon-courthouse',
-                    'dentist', 'basics:icon-dentist',
-                    'doctors', 'basics:icon-doctor',
-                    'dog_park', 'basics:icon-dog_park',
-                    'drinking_water', 'basics:icon-drinking_water',
-                    'embassy', 'basics:icon-embassy',
-                    'fast_food', 'basics:icon-fast_food',
-                    'fire_station', 'basics:icon-fire_station',
+                    'dentist',
+                    'basics:icon-dentist',
+                    'doctors',
+                    'basics:icon-doctor',
+                    'dog_park',
+                    'basics:icon-dog_park',
+                    'drinking_water',
+                    'basics:icon-drinking_water',
+                    'embassy',
+                    'basics:icon-embassy',
+                    'fast_food',
+                    'basics:icon-fast_food',
+                    'fire_station',
+                    'basics:icon-fire_station',
                     //'food_court', 'basics:icon-food_court',
-                    'fountain', 'basics:icon-fountain',
-                    'grave_yard', 'basics:icon-cemetery',
-                    'hospital', 'basics:icon-hospital',
-                    'hunting_stand', 'basics:icon-huntingstand',
-                    'library', 'basics:icon-library',
-                    'marketplace', 'basics:icon-marketplace',
-                    'nightclub', 'basics:icon-nightclub',
-                    'nursing_home', 'basics:icon-nursinghome',
-                    'pharmacy', 'basics:icon-pharmacy',
-                    'place_of_worship', 'basics:icon-place_of_worship',
-                    'playground', 'basics:icon-playground',
-                    'police', 'basics:icon-police',
-                    'post_box', 'basics:icon-postbox',
-                    'post_office', 'basics:icon-post',
-                    'prison', 'basics:icon-prison',
-                    'pub', 'basics:icon-beer',
+                    'fountain',
+                    'basics:icon-fountain',
+                    'grave_yard',
+                    'basics:icon-cemetery',
+                    'hospital',
+                    'basics:icon-hospital',
+                    'hunting_stand',
+                    'basics:icon-huntingstand',
+                    'library',
+                    'basics:icon-library',
+                    'marketplace',
+                    'basics:icon-marketplace',
+                    'nightclub',
+                    'basics:icon-nightclub',
+                    'nursing_home',
+                    'basics:icon-nursinghome',
+                    'pharmacy',
+                    'basics:icon-pharmacy',
+                    'place_of_worship',
+                    'basics:icon-place_of_worship',
+                    'playground',
+                    'basics:icon-playground',
+                    'police',
+                    'basics:icon-police',
+                    'post_box',
+                    'basics:icon-postbox',
+                    'post_office',
+                    'basics:icon-post',
+                    'prison',
+                    'basics:icon-prison',
+                    'pub',
+                    'basics:icon-beer',
                     //'public_building', 'basics:icon-public_building',
-                    'recycling', 'basics:icon-recycling',
-                    'restaurant', 'basics:icon-restaurant',
-                    'school', 'basics:icon-school',
-                    'shelter', 'basics:icon-shelter',
-                    'telephone', 'basics:icon-telephone',
-                    'theatre', 'basics:icon-theatre',
-                    'toilets', 'basics:icon-toilet',
-                    'townhall', 'basics:icon-town_hall',
+                    'recycling',
+                    'basics:icon-recycling',
+                    'restaurant',
+                    'basics:icon-restaurant',
+                    'school',
+                    'basics:icon-school',
+                    'shelter',
+                    'basics:icon-shelter',
+                    'telephone',
+                    'basics:icon-telephone',
+                    'theatre',
+                    'basics:icon-theatre',
+                    'toilets',
+                    'basics:icon-toilet',
+                    'townhall',
+                    'basics:icon-town_hall',
                     //'university', 'basics:icon-university',
-                    'vending_machine', 'basics:icon-vendingmachine',
-                    'veterinary', 'basics:icon-veterinary',
-                    'waste_basket', 'basics:icon-waste_basket',
+                    'vending_machine',
+                    'basics:icon-vendingmachine',
+                    'veterinary',
+                    'basics:icon-veterinary',
+                    'waste_basket',
+                    'basics:icon-waste_basket',
                     '',
                 ],
             },
             'poi-leisure': {
-                image: ['match',
+                image: [
+                    'match',
                     ['get', 'leisure'],
-                    'golf_course', 'basics:icon-golf',
-                    'ice_rink', 'basics:icon-icerink',
-                    'pitch', 'basics:icon-pitch',
+                    'golf_course',
+                    'basics:icon-golf',
+                    'ice_rink',
+                    'basics:icon-icerink',
+                    'pitch',
+                    'basics:icon-pitch',
                     //'sports_centre', 'basics:icon-sports_centre',
-                    'stadium', 'basics:icon-stadium',
-                    'swimming_pool', 'basics:icon-swimming',
-                    'water_park', 'basics:icon-waterpark',
+                    'stadium',
+                    'basics:icon-stadium',
+                    'swimming_pool',
+                    'basics:icon-swimming',
+                    'water_park',
+                    'basics:icon-waterpark',
                     'basics:icon-sports',
                 ],
             },
             'poi-tourism': {
-                image: ['match',
+                image: [
+                    'match',
                     ['get', 'tourism'],
                     //'alpine_hut', 'basics:icon-alpine_hut',
                     //'bed_and_breakfast', 'basics:icon-bed_and_breakfast',
                     //'camp_site', 'basics:icon-camp_site',
                     //'caravan_site', 'basics:icon-caravan_site',
-                    'chalet', 'basics:icon-chalet',
+                    'chalet',
+                    'basics:icon-chalet',
                     //'guest_house', 'basics:icon-guest_house',
                     //'hostel', 'basics:icon-hostel',
                     //'hotel', 'basics:icon-hotel',
-                    'information', 'basics:transport-information',
+                    'information',
+                    'basics:transport-information',
                     //'motel', 'basics:icon-motel',
-                    'picnic_site', 'basics:icon-picnic_site',
+                    'picnic_site',
+                    'basics:icon-picnic_site',
                     //'theme_park', 'basics:icon-theme_park',
-                    'viewpoint', 'basics:icon-viewpoint',
-                    'zoo', 'basics:icon-zoo',
+                    'viewpoint',
+                    'basics:icon-viewpoint',
+                    'zoo',
+                    'basics:icon-zoo',
                     '',
                 ],
             },
             'poi-shop': {
-                image: ['match',
+                image: [
+                    'match',
                     ['get', 'shop'],
-                    'alcohol', 'basics:icon-alcohol_shop',
-                    'bakery', 'basics:icon-bakery',
-                    'beauty', 'basics:icon-beauty',
-                    'beverages', 'basics:icon-beverages',
+                    'alcohol',
+                    'basics:icon-alcohol_shop',
+                    'bakery',
+                    'basics:icon-bakery',
+                    'beauty',
+                    'basics:icon-beauty',
+                    'beverages',
+                    'basics:icon-beverages',
                     //'bicycle', 'basics:icon-bicycle',
-                    'books', 'basics:icon-books',
-                    'butcher', 'basics:icon-butcher',
+                    'books',
+                    'basics:icon-books',
+                    'butcher',
+                    'basics:icon-butcher',
                     //'car', 'basics:icon-car',
-                    'chemist', 'basics:icon-chemist',
-                    'clothes', 'basics:icon-clothes',
+                    'chemist',
+                    'basics:icon-chemist',
+                    'clothes',
+                    'basics:icon-clothes',
                     //'computer', 'basics:icon-computer',
                     //'convinience', 'basics:icon-convinience',
                     //'department_store', 'basics:icon-department_store',
-                    'doityourself', 'basics:icon-doityourself',
-                    'dry_cleaning', 'basics:icon-drycleaning',
-                    'florist', 'basics:icon-florist',
-                    'furniture', 'basics:icon-furniture',
-                    'garden_centre', 'basics:icon-garden_centre',
-                    'general', 'basics:icon-shop',
-                    'gift', 'basics:icon-gift',
-                    'greengrocer', 'basics:icon-greengrocer',
-                    'hairdresser', 'basics:icon-hairdresser',
-                    'hardware', 'basics:icon-hardware',
-                    'jewelry', 'basics:icon-jewelry_store',
-                    'kiosk', 'basics:icon-kiosk',
-                    'laundry', 'basics:icon-laundry',
+                    'doityourself',
+                    'basics:icon-doityourself',
+                    'dry_cleaning',
+                    'basics:icon-drycleaning',
+                    'florist',
+                    'basics:icon-florist',
+                    'furniture',
+                    'basics:icon-furniture',
+                    'garden_centre',
+                    'basics:icon-garden_centre',
+                    'general',
+                    'basics:icon-shop',
+                    'gift',
+                    'basics:icon-gift',
+                    'greengrocer',
+                    'basics:icon-greengrocer',
+                    'hairdresser',
+                    'basics:icon-hairdresser',
+                    'hardware',
+                    'basics:icon-hardware',
+                    'jewelry',
+                    'basics:icon-jewelry_store',
+                    'kiosk',
+                    'basics:icon-kiosk',
+                    'laundry',
+                    'basics:icon-laundry',
                     //'mall', 'basics:icon-mall',
                     //'mobile_phone', 'basics:icon-mobile_phone',
-                    'newsagent', 'basics:icon-newsagent',
-                    'optican', 'basics:icon-optician',
-                    'outdoor', 'basics:icon-outdoor',
-                    'shoes', 'basics:icon-shoes',
-                    'sports', 'basics:icon-sports',
-                    'stationery', 'basics:icon-stationery',
+                    'newsagent',
+                    'basics:icon-newsagent',
+                    'optican',
+                    'basics:icon-optician',
+                    'outdoor',
+                    'basics:icon-outdoor',
+                    'shoes',
+                    'basics:icon-shoes',
+                    'sports',
+                    'basics:icon-sports',
+                    'stationery',
+                    'basics:icon-stationery',
                     //'supermarket', 'basics:icon-supermarket',
-                    'toys', 'basics:icon-toys',
-                    'travel_agency', 'basics:icon-travel_agent',
-                    'video', 'basics:icon-video',
+                    'toys',
+                    'basics:icon-toys',
+                    'travel_agency',
+                    'basics:icon-travel_agent',
+                    'video',
+                    'basics:icon-video',
                     'basics:icon-shop',
                 ],
             },
             'poi-man_made': {
-                image: ['match',
+                image: [
+                    'match',
                     ['get', 'man_made'],
-                    'lighthouse', 'basics:icon-lighthouse',
-                    'surveillance', 'basics:icon-surveillance',
-                    'tower', 'basics:icon-observation_tower',
+                    'lighthouse',
+                    'basics:icon-lighthouse',
+                    'surveillance',
+                    'basics:icon-surveillance',
+                    'tower',
+                    'basics:icon-observation_tower',
                     //'wastewater_plant', 'basics:icon-wastewater_plant',
                     //'water_well', 'basics:icon-water_well',
                     //'water_works', 'basics:icon-water_works',
-                    'watermill', 'basics:icon-watermill',
-                    'windmill', 'basics:icon-windmill',
+                    'watermill',
+                    'basics:icon-watermill',
+                    'windmill',
+                    'basics:icon-windmill',
                     '',
                 ],
             },
             'poi-historic': {
-                image: ['match',
+                image: [
+                    'match',
                     ['get', 'historic'],
                     //'archaelogical_site', 'basics:icon-archaelogical_site',
-                    'artwork', 'basics:icon-artwork',
+                    'artwork',
+                    'basics:icon-artwork',
                     //'battlefield', 'basics:icon-battlefield',
-                    'castle', 'basics:icon-castle',
+                    'castle',
+                    'basics:icon-castle',
                     //'fort', 'basics:icon-fort',
                     //'memorial', 'basics:icon-memorial',
-                    'monument', 'basics:icon-monument',
+                    'monument',
+                    'basics:icon-monument',
                     //'ruins', 'basics:icon-ruins',
                     //'wayside_cross', 'basics:icon-wayside_cross',
-                    'wayside_shrine', 'basics:icon-shrine',
+                    'wayside_shrine',
+                    'basics:icon-shrine',
                     'basics:icon-historic',
                 ],
             },
             'poi-emergency': {
-                image: ['match',
+                image: [
+                    'match',
                     ['get', 'emergency'],
-                    'defibrillator', 'basics:icon-defibrillator',
-                    'fire_hydrant', 'basics:icon-hydrant',
-                    'phone', 'basics:icon-emergency_phone',
+                    'defibrillator',
+                    'basics:icon-defibrillator',
+                    'fire_hydrant',
+                    'basics:icon-hydrant',
+                    'phone',
+                    'basics:icon-emergency_phone',
                     '',
                 ],
             },
@@ -3426,7 +3616,7 @@ class Eclipse extends Colorful {
     name = 'Eclipse';
     constructor() {
         super();
-        this.transformDefaultColors(color => color.invertLuminosity());
+        this.transformDefaultColors((color) => color.invertLuminosity());
     }
 }
 
@@ -3434,7 +3624,7 @@ class Graybeard extends Colorful {
     name = 'Graybeard';
     constructor() {
         super();
-        this.transformDefaultColors(color => color.saturate(-1));
+        this.transformDefaultColors((color) => color.saturate(-1));
     }
 }
 
@@ -3442,7 +3632,7 @@ class Shadow extends Colorful {
     name = 'Shadow';
     constructor() {
         super();
-        this.transformDefaultColors(color => color.saturate(-1).invert().brightness(0.2));
+        this.transformDefaultColors((color) => color.saturate(-1).invert().brightness(0.2));
     }
 }
 
@@ -3511,7 +3701,7 @@ class Neutrino extends Colorful {
     getStyleRules(options) {
         const { colors, fonts } = options;
         return {
-            'background': {
+            background: {
                 color: colors.land,
             },
             'boundary-{country,state}': {
@@ -3582,11 +3772,11 @@ class Neutrino extends Colorful {
             'site-{bicycleparking,parking}': {
                 color: colors.commercial,
             },
-            'building': {
+            building: {
                 color: colors.building,
                 opacity: { 14: 0, 15: 1 },
             },
-            'bridge': {
+            bridge: {
                 color: colors.land.darken(0.01),
             },
             '{tunnel-,bridge-,}street-*': {
@@ -3853,6 +4043,92 @@ class Empty extends Colorful {
     }
 }
 
+function buildSatelliteStyle(options) {
+    options ??= {};
+    const baseUrl = options.baseUrl ?? 'https://tiles.versatiles.org';
+    const rasterTiles = options.rasterTiles ?? [`${baseUrl}/tiles/satellite/{z}/{x}/{y}`];
+    const overlay = options.overlay ?? true;
+    let style;
+    if (overlay) {
+        // Generate graybeard style for overlay
+        style = new Graybeard().build({
+            baseUrl,
+            tiles: options.overlayTiles,
+            language: options.language,
+        });
+        // Filter out background, fill layers, and unwanted layer groups
+        style.layers = style.layers.filter((l) => l.id !== 'background' && l.type !== 'fill' && !/^(land|water|site|airport|tunnel)-/.test(l.id));
+        // Modify remaining layers
+        for (const layer of style.layers) {
+            if (layer.type === 'symbol') {
+                // Bold font, white text, black halo
+                if (layer.layout?.['text-font']) {
+                    layer.layout['text-font'] = ['noto_sans_bold'];
+                }
+                if (layer.paint) {
+                    layer.paint['text-color'] = '#fff';
+                    layer.paint['text-halo-color'] = '#000';
+                    if ('text-halo-blur' in layer.paint)
+                        layer.paint['text-halo-blur'] = 0;
+                    if ('text-halo-width' in layer.paint)
+                        layer.paint['text-halo-width'] = 1;
+                }
+            }
+            if (layer.type === 'line' && layer.paint) {
+                // Multiply existing opacity by 0.2
+                const v = layer.paint['line-opacity'];
+                if (v == null) {
+                    layer.paint['line-opacity'] = 0.2;
+                }
+                else if (typeof v === 'number') {
+                    layer.paint['line-opacity'] = v * 0.2;
+                }
+                else if (typeof v === 'object' && 'stops' in v) {
+                    v.stops = v.stops.map((s) => [s[0], s[1] * 0.2]);
+                }
+            }
+        }
+    }
+    else {
+        // Minimal style with no overlay
+        style = { version: 8, sources: {}, layers: [] };
+    }
+    // Build raster paint properties
+    const rasterPaint = {};
+    if (options.rasterOpacity != null)
+        rasterPaint['raster-opacity'] = options.rasterOpacity;
+    if (options.rasterHueRotate != null)
+        rasterPaint['raster-hue-rotate'] = options.rasterHueRotate;
+    if (options.rasterBrightnessMin != null)
+        rasterPaint['raster-brightness-min'] = options.rasterBrightnessMin;
+    if (options.rasterBrightnessMax != null)
+        rasterPaint['raster-brightness-max'] = options.rasterBrightnessMax;
+    if (options.rasterSaturation != null)
+        rasterPaint['raster-saturation'] = options.rasterSaturation;
+    if (options.rasterContrast != null)
+        rasterPaint['raster-contrast'] = options.rasterContrast;
+    // Add raster source
+    style.sources.satellite = {
+        type: 'raster',
+        tiles: rasterTiles,
+        tileSize: 512,
+        attribution: "<a href='https://versatiles.org/sources/'>VersaTiles sources</a>",
+        bounds: [-178.187256, -21.401934, 55.846252, 58.061897],
+        minzoom: 0,
+        maxzoom: 17,
+    };
+    // Add raster layer at bottom
+    style.layers.unshift({
+        id: 'satellite',
+        type: 'raster',
+        source: 'satellite',
+        minzoom: 0,
+        ...(Object.keys(rasterPaint).length > 0 ? { paint: rasterPaint } : {}),
+    });
+    style.name = 'versatiles-satellite';
+    return style;
+}
+
 // import styles
 function getStyleBuilder(styleBuilder) {
     const fn = function (options) {
@@ -3870,88 +4146,88 @@ const neutrino = getStyleBuilder(Neutrino);
 getStyleBuilder(Empty);
 
 /**
-* Checks if an object adheres to the TileJSON specification.
-* Throws errors if the object does not conform to the expected structure or types.
-*/
+ * Checks if an object adheres to the TileJSON specification.
+ * Throws errors if the object does not conform to the expected structure or types.
+ */
 function isTileJSONSpecification(spec) {
     if (typeof spec !== 'object' || spec === null) {
-        throw Error('spec must be an object');
+        throw new Error(`TileJSON validation: spec must be an object, but got ${typeof spec}`);
     }
     const obj = spec;
     // Common property validation
     if (obj.data != null && obj.tilejson !== '3.0.0') {
-        throw Error('spec.tilejson must be "3.0.0"');
+        throw new Error(`TileJSON validation: spec.tilejson must be "3.0.0", but got "${obj.tilejson}"`);
     }
     if (obj.attribution != null && typeof obj.attribution !== 'string') {
-        throw Error('spec.attribution must be a string if present');
+        throw new Error(`TileJSON validation: spec.attribution must be a string if present, but got ${typeof obj.attribution}`);
     }
     if (obj.bounds != null) {
-        if (!Array.isArray(obj.bounds) || obj.bounds.length !== 4 || obj.bounds.some(num => typeof num !== 'number')) {
-            throw Error('spec.bounds must be an array of four numbers if present');
+        if (!Array.isArray(obj.bounds) || obj.bounds.length !== 4 || obj.bounds.some((num) => typeof num !== 'number')) {
+            throw new Error(`TileJSON validation: spec.bounds must be an array of four numbers if present, but got ${JSON.stringify(obj.bounds)}`);
         }
         const a = obj.bounds;
         if (a[0] < -180 || a[0] > 180)
-            throw Error('spec.bounds[0] must be between -180 and 180');
+            throw new Error(`TileJSON validation: spec.bounds[0] (longitude) must be between -180 and 180, but got ${a[0]}`);
         if (a[1] < -90 || a[1] > 90)
-            throw Error('spec.bounds[1] must be between -90 and 90');
+            throw new Error(`TileJSON validation: spec.bounds[1] (latitude) must be between -90 and 90, but got ${a[1]}`);
         if (a[2] < -180 || a[2] > 180)
-            throw Error('spec.bounds[2] must be between -180 and 180');
+            throw new Error(`TileJSON validation: spec.bounds[2] (longitude) must be between -180 and 180, but got ${a[2]}`);
         if (a[3] < -90 || a[3] > 90)
-            throw Error('spec.bounds[3] must be between -90 and 90');
+            throw new Error(`TileJSON validation: spec.bounds[3] (latitude) must be between -90 and 90, but got ${a[3]}`);
         if (a[0] > a[2])
-            throw Error('spec.bounds[0] must be smaller than spec.bounds[2]');
+            throw new Error(`TileJSON validation: spec.bounds[0] must be smaller than spec.bounds[2] (min longitude < max longitude), but got [${a[0]}, ${a[2]}]`);
         if (a[1] > a[3])
-            throw Error('spec.bounds[1] must be smaller than spec.bounds[3]');
+            throw new Error(`TileJSON validation: spec.bounds[1] must be smaller than spec.bounds[3] (min latitude < max latitude), but got [${a[1]}, ${a[3]}]`);
     }
     if (obj.center != null) {
-        if (!Array.isArray(obj.center) || obj.center.length !== 2 || obj.center.some(num => typeof num !== 'number')) {
-            throw Error('spec.center must be an array of two numbers if present');
+        if (!Array.isArray(obj.center) || obj.center.length !== 2 || obj.center.some((num) => typeof num !== 'number')) {
+            throw new Error(`TileJSON validation: spec.center must be an array of two numbers if present, but got ${JSON.stringify(obj.center)}`);
         }
         const a = obj.center;
         if (a[0] < -180 || a[0] > 180)
-            throw Error('spec.center[0] must be between -180 and 180');
+            throw new Error(`TileJSON validation: spec.center[0] (longitude) must be between -180 and 180, but got ${a[0]}`);
         if (a[1] < -90 || a[1] > 90)
-            throw Error('spec.center[1] must be between -90 and 90');
+            throw new Error(`TileJSON validation: spec.center[1] (latitude) must be between -90 and 90, but got ${a[1]}`);
     }
-    if (obj.data != null && (!Array.isArray(obj.data) || obj.data.some(url => typeof url !== 'string'))) {
-        throw Error('spec.data must be an array of strings if present');
+    if (obj.data != null && (!Array.isArray(obj.data) || obj.data.some((url) => typeof url !== 'string'))) {
+        throw new Error('TileJSON validation: spec.data must be an array of strings if present');
     }
     if (obj.description != null && typeof obj.description !== 'string') {
-        throw Error('spec.description must be a string if present');
+        throw new Error(`TileJSON validation: spec.description must be a string if present, but got ${typeof obj.description}`);
     }
-    if (obj.fillzoom != null && (typeof obj.fillzoom !== 'number' || (obj.fillzoom < 0))) {
-        throw Error('spec.fillzoom must be a positive integer if present');
+    if (obj.fillzoom != null && (typeof obj.fillzoom !== 'number' || obj.fillzoom < 0)) {
+        throw new Error(`TileJSON validation: spec.fillzoom must be a positive integer if present, but got ${obj.fillzoom}`);
     }
-    if (obj.grids != null && (!Array.isArray(obj.grids) || obj.grids.some(url => typeof url !== 'string'))) {
-        throw Error('spec.grids must be an array of strings if present');
+    if (obj.grids != null && (!Array.isArray(obj.grids) || obj.grids.some((url) => typeof url !== 'string'))) {
+        throw new Error('TileJSON validation: spec.grids must be an array of strings if present');
     }
     if (obj.legend != null && typeof obj.legend !== 'string') {
-        throw Error('spec.legend must be a string if present');
+        throw new Error(`TileJSON validation: spec.legend must be a string if present, but got ${typeof obj.legend}`);
     }
-    if (obj.minzoom != null && (typeof obj.minzoom !== 'number' || (obj.minzoom < 0))) {
-        throw Error('spec.minzoom must be a positive integer if present');
+    if (obj.minzoom != null && (typeof obj.minzoom !== 'number' || obj.minzoom < 0)) {
+        throw new Error(`TileJSON validation: spec.minzoom must be a positive integer if present, but got ${obj.minzoom}`);
     }
-    if (obj.maxzoom != null && (typeof obj.maxzoom !== 'number' || (obj.maxzoom < 0))) {
-        throw Error('spec.maxzoom must be a positive integer if present');
+    if (obj.maxzoom != null && (typeof obj.maxzoom !== 'number' || obj.maxzoom < 0)) {
+        throw new Error(`TileJSON validation: spec.maxzoom must be a positive integer if present, but got ${obj.maxzoom}`);
     }
     if (obj.name != null && typeof obj.name !== 'string') {
-        throw Error('spec.name must be a string if present');
+        throw new Error(`TileJSON validation: spec.name must be a string if present, but got ${typeof obj.name}`);
     }
     if (obj.scheme != null && obj.scheme !== 'xyz' && obj.scheme !== 'tms') {
-        throw Error('spec.scheme must be "tms" or "xyz" if present');
+        throw new Error(`TileJSON validation: spec.scheme must be "tms" or "xyz" if present, but got "${obj.scheme}"`);
     }
     if (obj.template != null && typeof obj.template !== 'string') {
-        throw Error('spec.template must be a string if present');
+        throw new Error(`TileJSON validation: spec.template must be a string if present, but got ${typeof obj.template}`);
     }
-    if (!Array.isArray(obj.tiles) || obj.tiles.length === 0 || obj.tiles.some(url => typeof url !== 'string')) {
-        throw Error('spec.tiles must be an array of strings');
+    if (!Array.isArray(obj.tiles) || obj.tiles.length === 0 || obj.tiles.some((url) => typeof url !== 'string')) {
+        throw new Error('TileJSON validation: spec.tiles must be a non-empty array of strings');
     }
     return true;
 }
 function isRasterTileJSONSpecification(spec) {
     if (!isTileJSONSpecification(spec))
         ;
-    if (('vector_layers' in spec) && (spec.vector_layers != null))
+    if ('vector_layers' in spec && spec.vector_layers != null)
         return false;
     return true;
 }
@@ -3971,10 +4247,9 @@ function guessStyle(tileJSON, options) {
     tileJSON = deepClone(tileJSON);
     if (options && options.baseUrl) {
         const { baseUrl } = options;
-        tileJSON.tiles = tileJSON.tiles.map(url => resolveUrl(baseUrl, url));
+        tileJSON.tiles = tileJSON.tiles.map((url) => resolveUrl(baseUrl, url));
     }
-    if (!isTileJSONSpecification(tileJSON))
-        ;
+    if (!isTileJSONSpecification(tileJSON)) ;
     let style;
     if (isRasterTileJSONSpecification(tileJSON)) {
         style = getRasterStyle(tileJSON);
@@ -4000,9 +4275,36 @@ function isShortbread(spec) {
         return false;
     if (!Array.isArray(spec.vector_layers))
         return false;
-    const layerIds = new Set(spec.vector_layers.map(l => String(l.id)));
-    const shortbreadIds = ['place_labels', 'boundaries', 'boundary_labels', 'addresses', 'water_lines', 'water_lines_labels', 'dam_lines', 'dam_polygons', 'pier_lines', 'pier_polygons', 'bridges', 'street_polygons', 'streets_polygons_labels', 'ferries', 'streets', 'street_labels', 'street_labels_points', 'aerialways', 'public_transport', 'buildings', 'water_polygons', 'ocean', 'water_polygons_labels', 'land', 'sites', 'pois'];
-    return shortbreadIds.every(id => layerIds.has(id));
+    const layerIds = new Set(spec.vector_layers.map((l) => String(l.id)));
+    const shortbreadIds = [
+        'place_labels',
+        'boundaries',
+        'boundary_labels',
+        'addresses',
+        'water_lines',
+        'water_lines_labels',
+        'dam_lines',
+        'dam_polygons',
+        'pier_lines',
+        'pier_polygons',
+        'bridges',
+        'street_polygons',
+        'streets_polygons_labels',
+        'ferries',
+        'streets',
+        'street_labels',
+        'street_labels_points',
+        'aerialways',
+        'public_transport',
+        'buildings',
+        'water_polygons',
+        'ocean',
+        'water_polygons_labels',
+        'land',
+        'sites',
+        'pois',
+    ];
+    return shortbreadIds.every((id) => layerIds.has(id));
 }
 function getShortbreadStyle(spec, builderOption) {
     return colorful({
@@ -4032,7 +4334,7 @@ function getShortbreadStyle(spec, builderOption) {
 function getInspectorStyle(spec) {
     const sourceName = 'vectorSource';
     const layers = { background: [], circle: [], line: [], fill: [] };
-    layers.background.push({ 'id': 'background', 'type': 'background', 'paint': { 'background-color': '#fff' } });
+    layers.background.push({ id: 'background', type: 'background', paint: { 'background-color': '#fff' } });
     spec.vector_layers.forEach((vector_layer) => {
         let luminosity = 'bright', saturation, hue;
         if (/water|ocean|lake|sea|river/.test(vector_layer.id))
@@ -4091,12 +4393,7 @@ function getInspectorStyle(spec) {
         sources: {
             [sourceName]: sourceFromSpec(spec, 'vector'),
         },
-        layers: [
-            ...layers.background,
-            ...layers.fill,
-            ...layers.line,
-            ...layers.circle,
-        ],
+        layers: [...layers.background, ...layers.fill, ...layers.line, ...layers.circle],
     };
 }
 function getRasterStyle(spec) {
@@ -4106,11 +4403,13 @@ function getRasterStyle(spec) {
         sources: {
             [sourceName]: sourceFromSpec(spec, 'raster'),
         },
-        layers: [{
+        layers: [
+            {
                 id: 'raster',
                 type: 'raster',
                 source: sourceName,
-            }],
+            },
+        ],
     };
 }
 function sourceFromSpec(spec, type) {
@@ -4213,7 +4512,8 @@ const styles = {
     graybeard,
     shadow,
     neutrino,
+    satellite: buildSatelliteStyle,
 };
 
-export { Color, colorful, eclipse, graybeard, guessStyle, neutrino, shadow, styles };
+export { Color, colorful, eclipse, graybeard, guessStyle, neutrino, buildSatelliteStyle as satellite, shadow, styles };
 //# sourceMappingURL=index.js.map