@india-boundary-corrector/leaflet-layer 0.2.0 → 0.2.2

package/README.md

@@ -4,7 +4,7 @@
 
 Leaflet TileLayer extension that automatically applies India boundary corrections.
 
-[Try it on JSFiddle](https://jsfiddle.net/z8d76em5/1/)
+[Try it on JSFiddle](https://jsfiddle.net/ak3fpn7z/)
 
 ## Installation
 

package/dist/index.cjs

@@ -86,12 +86,11 @@ var configs_default = [
       "https://{s}.basemaps.cartocdn.com/rastertiles/voyager_labels_under/{z}/{x}/{y}.png",
       "https://basemaps.cartocdn.com/rastertiles/voyager_labels_under/{z}/{x}/{y}.png"
     ],
-    lineWidthStops: { "1": 0.5, "2": 0.75, "3": 0.75, "4": 1, "5": 1, "7": 1.5, "16": 2.5 },
+    lineWidthStops: { "1": 0.5, "2": 0.75, "3": 0.75, "4": 1, "5": 1, "7": 1.75, "16": 2.5 },
     lineStyles: [
       { color: "rgb(235, 214, 214)", layerSuffix: "ne", endZoom: 4, lineExtensionFactor: 0.1, delWidthFactor: 2.5 },
       { color: "rgb(235, 214, 214)", layerSuffix: "ne-disp", endZoom: 4, delWidthFactor: 0 },
-      { color: "rgb(235, 214, 214)", layerSuffix: "osm", alpha: 0.2, startZoom: 6, endZoom: 11, widthFraction: 5, lineExtensionFactor: 0.1 },
-      { color: "rgb(235, 214, 214)", layerSuffix: "osm", alpha: 0.2, startZoom: 12, widthFraction: 4, lineExtensionFactor: 0.1 },
+      { color: "rgb(235, 214, 214)", layerSuffix: "osm", alpha: 0.1, startZoom: 6, lineWidthStops: { "6": 9, "10": 8, "14": 8 }, lineExtensionFactor: 0.1 },
       { color: "rgb(235, 214, 214)", layerSuffix: "osm", startZoom: 5, lineExtensionFactor: 0.1 },
       { color: "rgb(235, 214, 214)", layerSuffix: "osm-disp", startZoom: 5, delWidthFactor: 0 },
       { color: "rgb(235, 214, 214)", layerSuffix: "osm-internal", startZoom: 5, widthFraction: 0.5, dashArray: [2, 2], delWidthFactor: 2 },
@@ -114,12 +113,11 @@ var configs_default = [
       "https://{s}.basemaps.cartocdn.com/rastertiles/voyager_labels_under/{z}/{x}/{y}{r}.png",
       "https://basemaps.cartocdn.com/rastertiles/voyager_labels_under/{z}/{x}/{y}{r}.png"
     ],
-    lineWidthStops: { "1": 0.75, "2": 0.75, "3": 0.75, "4": 1, "5": 1, "7": 1.5, "11": 2 },
+    lineWidthStops: { "1": 1, "3": 1, "4": 2, "5": 2, "6": 2.5, "7": 3, "8": 3, "10": 4, "11": 4, "12": 4 },
     lineStyles: [
       { color: "rgb(235, 214, 214)", layerSuffix: "ne", endZoom: 4, lineExtensionFactor: 0.1, delWidthFactor: 2.5 },
       { color: "rgb(235, 214, 214)", layerSuffix: "ne-disp", endZoom: 4, delWidthFactor: 0 },
-      { color: "rgb(235, 214, 214)", layerSuffix: "osm", alpha: 0.1, startZoom: 6, endZoom: 11, widthFraction: 5, lineExtensionFactor: 0.1 },
-      { color: "rgb(235, 214, 214)", layerSuffix: "osm", alpha: 0.1, startZoom: 12, widthFraction: 4, lineExtensionFactor: 0.1 },
+      { color: "rgb(235, 214, 214)", layerSuffix: "osm", alpha: 0.1, startZoom: 6, lineWidthStops: { "6": 20, "8": 19, "10": 18, "12": 17 }, lineExtensionFactor: 0.1 },
       { color: "rgb(235, 214, 214)", layerSuffix: "osm", startZoom: 5, lineExtensionFactor: 0.1 },
       { color: "rgb(235, 214, 214)", layerSuffix: "osm-disp", startZoom: 5, delWidthFactor: 0 },
       { color: "rgb(235, 214, 214)", layerSuffix: "osm-internal", startZoom: 5, widthFraction: 0.5, dashArray: [4, 4], delWidthFactor: 2 },
@@ -130,15 +128,20 @@ var configs_default = [
     id: "open-topo",
     tileUrlTemplates: [
       "https://{s}.tile.opentopomap.org/{z}/{x}/{y}.png",
-      "https://tile.opentopomap.org/{z}/{x}/{y}.png"
+      "https://tile.opentopomap.org/{z}/{x}/{y}.png",
+      "https://{s}.tile.top-o-map.de/{z}/{x}/{y}.png",
+      "https://tile.top-o-map.de/{z}/{x}/{y}.png"
     ],
     lineWidthStops: { "4": 0.75, "5": 1, "6": 1.25, "7": 1.5, "8": 1.75, "9": 1.25, "10": 1.25, "13": 1.5 },
     lineStyles: [
       { color: "rgb(83, 83, 83)", layerSuffix: "ne", startZoom: 4, endZoom: 6 },
       { color: "rgb(173, 173, 173)", layerSuffix: "osm", startZoom: 7, endZoom: 8, alpha: 0.5, widthFraction: 4 },
       { color: "rgb(83, 83, 83)", layerSuffix: "osm", startZoom: 7, endZoom: 8 },
+      { color: "rgb(83, 83, 83)", layerSuffix: "osm-internal", widthFraction: 0.75, startZoom: 7, endZoom: 8 },
       { color: "rgb(199, 158, 204)", layerSuffix: "osm", startZoom: 9, widthFraction: 7, alpha: 0.6, lineExtensionFactor: 0.2 },
-      { color: "rgb(175, 41, 203)", layerSuffix: "osm", startZoom: 9, lineExtensionFactor: 0.2 }
+      { color: "rgb(175, 41, 203)", layerSuffix: "osm", startZoom: 9, lineExtensionFactor: 0.2 },
+      { color: "rgb(199, 158, 204)", layerSuffix: "osm-internal", startZoom: 9, widthFraction: 2.25, alpha: 0.6, lineExtensionFactor: 0.2 },
+      { color: "rgb(175, 41, 203)", layerSuffix: "osm-internal", startZoom: 9, widthFactor: 0.75, lineExtensionFactor: 0.2 }
     ]
   },
   {
@@ -147,9 +150,8 @@ var configs_default = [
       "https://tile.openstreetmap.org/{z}/{x}/{y}.png",
       "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
     ],
-    lineWidthStops: { "1": 0.5, "2": 0.6, "3": 0.7, "4": 1, "10": 3.75 },
+    lineWidthStops: { "3": 0.7, "4": 1, "10": 3.75 },
     lineStyles: [
-      { color: "rgb(200, 180, 200)", layerSuffix: "osm", startZoom: 1, endZoom: 3, delWidthFactor: 2.5, widthFraction: 1.5 },
       { color: "rgb(200, 180, 200)", layerSuffix: "osm", startZoom: 4, delWidthFactor: 1.5 },
       { color: "rgb(160, 120, 160)", layerSuffix: "osm", startZoom: 4, widthFraction: 0.333, dashArray: [30, 2, 8, 2], delWidthFactor: 0 },
       { color: "rgb(200, 180, 200)", layerSuffix: "osm-internal", startZoom: 4, widthFraction: 0.45 },
@@ -173,6 +175,39 @@ var configs_default = [
 var INFINITY = -1;
 var MIN_LINE_WIDTH = 0.1;
 var DEFAULT_LINE_WIDTH = 1;
+function interpolateLineWidth(zoom, lineWidthStops) {
+  const zooms = Object.keys(lineWidthStops).map(Number).sort((a, b2) => a - b2);
+  if (lineWidthStops[zoom] !== void 0) {
+    return lineWidthStops[zoom];
+  }
+  if (zoom < zooms[0]) {
+    const z1 = zooms[0];
+    const z2 = zooms[1];
+    const w1 = lineWidthStops[z1];
+    const w2 = lineWidthStops[z2];
+    const slope = (w2 - w1) / (z2 - z1);
+    return Math.max(MIN_LINE_WIDTH, w1 + slope * (zoom - z1));
+  }
+  if (zoom > zooms[zooms.length - 1]) {
+    const z1 = zooms[zooms.length - 2];
+    const z2 = zooms[zooms.length - 1];
+    const w1 = lineWidthStops[z1];
+    const w2 = lineWidthStops[z2];
+    const slope = (w2 - w1) / (z2 - z1);
+    return Math.max(MIN_LINE_WIDTH, w2 + slope * (zoom - z2));
+  }
+  for (let i2 = 0; i2 < zooms.length - 1; i2++) {
+    if (zoom > zooms[i2] && zoom < zooms[i2 + 1]) {
+      const z1 = zooms[i2];
+      const z2 = zooms[i2 + 1];
+      const w1 = lineWidthStops[z1];
+      const w2 = lineWidthStops[z2];
+      const t = (zoom - z1) / (z2 - z1);
+      return w1 + t * (w2 - w1);
+    }
+  }
+  return DEFAULT_LINE_WIDTH;
+}
 function templateToRegex(template) {
   const groups = [];
   const hasRetina = template.includes("{r}");
@@ -239,14 +274,33 @@ function isValidColor(color) {
   if (/^[a-z]+$/.test(trimmed)) return true;
   return false;
 }
+function validateLineWidthStops(lineWidthStops, prefix) {
+  if (!lineWidthStops || typeof lineWidthStops !== "object" || Array.isArray(lineWidthStops)) {
+    throw new Error(`${prefix}: lineWidthStops must be an object`);
+  }
+  const stopKeys = Object.keys(lineWidthStops);
+  if (stopKeys.length < 2) {
+    throw new Error(`${prefix}: lineWidthStops must have at least 2 entries`);
+  }
+  for (const key of stopKeys) {
+    const zoom = Number(key);
+    if (!Number.isInteger(zoom) || zoom < 0) {
+      throw new Error(`${prefix}: lineWidthStops keys must be non-negative integers, got "${key}"`);
+    }
+    if (typeof lineWidthStops[key] !== "number" || lineWidthStops[key] <= 0) {
+      throw new Error(`${prefix}: lineWidthStops values must be positive numbers`);
+    }
+  }
+}
 var LineStyle = class _LineStyle {
   /**
    * Validate a LineStyle configuration object.
    * @param {Object} obj - The object to validate
    * @param {number} [index] - Optional index for error messages (when validating in an array)
+   * @param {boolean} [requireLineWidthStops=false] - Whether lineWidthStops is required
    * @throws {Error} If validation fails
    */
-  static validateJSON(obj, index) {
+  static validateJSON(obj, index, requireLineWidthStops = false) {
     const prefix = index !== void 0 ? `lineStyles[${index}]` : "LineStyle";
     if (!obj || typeof obj !== "object") {
       throw new Error(`${prefix}: must be an object`);
@@ -281,22 +335,30 @@ var LineStyle = class _LineStyle {
     if (obj.delWidthFactor !== void 0 && (typeof obj.delWidthFactor !== "number" || obj.delWidthFactor < 0)) {
       throw new Error(`${prefix}: delWidthFactor must be a non-negative number`);
     }
+    if (requireLineWidthStops && obj.lineWidthStops === void 0) {
+      throw new Error(`${prefix}: lineWidthStops is required`);
+    }
+    if (obj.lineWidthStops !== void 0) {
+      validateLineWidthStops(obj.lineWidthStops, prefix);
+    }
   }
   /**
    * @param {Object} options
    * @param {string} options.color - CSS color string
    * @param {string} options.layerSuffix - Layer suffix (e.g., 'osm', 'ne', 'osm-disp')
+   * @param {Object<number, number>} options.lineWidthStops - Line width stops for this style
    * @param {number} [options.widthFraction=1.0] - Multiplier for base line width
    * @param {number[]} [options.dashArray] - Dash pattern for dashed lines
    * @param {number} [options.alpha=1.0] - Opacity (0-1)
    * @param {number} [options.startZoom=0] - Minimum zoom level for this style
    * @param {number} [options.endZoom=INFINITY] - Maximum zoom level for this style (INFINITY means no limit)
-   * @param {number} [options.lineExtensionFactor=0.5] - Factor to extend lines by (multiplied by deletion line width)
+   * @param {number} [options.lineExtensionFactor=0.0] - Factor to extend lines by (multiplied by deletion line width)
    * @param {number} [options.delWidthFactor=1.5] - Factor to multiply line width for deletion blur
    */
-  constructor({ color, layerSuffix, widthFraction = 1, dashArray, alpha = 1, startZoom = 0, endZoom = INFINITY, lineExtensionFactor = 0, delWidthFactor = 1.5 }) {
+  constructor({ color, layerSuffix, lineWidthStops, widthFraction = 1, dashArray, alpha = 1, startZoom = 0, endZoom = INFINITY, lineExtensionFactor = 0, delWidthFactor = 1.5 }) {
     this.color = color;
     this.layerSuffix = layerSuffix;
+    this.lineWidthStops = lineWidthStops;
     this.widthFraction = widthFraction;
     this.dashArray = dashArray;
     this.alpha = alpha;
@@ -305,6 +367,14 @@ var LineStyle = class _LineStyle {
     this.lineExtensionFactor = lineExtensionFactor;
     this.delWidthFactor = delWidthFactor;
   }
+  /**
+   * Get base line width for this style at a given zoom level.
+   * @param {number} zoom - Zoom level
+   * @returns {number}
+   */
+  getLineWidth(zoom) {
+    return interpolateLineWidth(zoom, this.lineWidthStops);
+  }
   /**
    * Check if this style is active at the given zoom level.
    * @param {number} z - Zoom level
@@ -321,6 +391,7 @@ var LineStyle = class _LineStyle {
     return {
       color: this.color,
       layerSuffix: this.layerSuffix,
+      lineWidthStops: this.lineWidthStops,
       widthFraction: this.widthFraction,
       dashArray: this.dashArray,
       alpha: this.alpha,
@@ -337,7 +408,7 @@ var LineStyle = class _LineStyle {
    * @returns {LineStyle}
    */
   static fromJSON(obj, index) {
-    _LineStyle.validateJSON(obj, index);
+    _LineStyle.validateJSON(obj, index, true);
     return new _LineStyle(obj);
   }
 };
@@ -403,9 +474,13 @@ var LayerConfig = class _LayerConfig {
     this._compiledPatterns = templates.map((t) => templateToRegex(t));
     this._templatePatterns = templates.map((t) => templateToTemplateRegex(t));
     this.lineWidthStops = lineWidthStops;
-    this.lineStyles = lineStyles.map(
-      (style) => style instanceof LineStyle ? style : new LineStyle(style)
-    );
+    this.lineStyles = lineStyles.map((style) => {
+      if (style instanceof LineStyle) {
+        return style;
+      }
+      const styleWithStops = style.lineWidthStops ? style : { ...style, lineWidthStops };
+      return new LineStyle(styleWithStops);
+    });
   }
   /**
    * Get line styles active at a given zoom level
@@ -424,45 +499,6 @@ var LayerConfig = class _LayerConfig {
     const activeStyles = this.getLineStylesForZoom(z2);
     return [...new Set(activeStyles.map((s) => s.layerSuffix))];
   }
-  /**
-   * Interpolate or extrapolate line width for a given zoom level.
-   * Uses the lineWidthStops map to calculate the appropriate width.
-   * @param {number} zoom - Zoom level
-   * @returns {number}
-   */
-  getLineWidth(zoom) {
-    const zooms = Object.keys(this.lineWidthStops).map(Number).sort((a, b2) => a - b2);
-    if (this.lineWidthStops[zoom] !== void 0) {
-      return this.lineWidthStops[zoom];
-    }
-    if (zoom < zooms[0]) {
-      const z1 = zooms[0];
-      const z2 = zooms[1];
-      const w1 = this.lineWidthStops[z1];
-      const w2 = this.lineWidthStops[z2];
-      const slope = (w2 - w1) / (z2 - z1);
-      return Math.max(MIN_LINE_WIDTH, w1 + slope * (zoom - z1));
-    }
-    if (zoom > zooms[zooms.length - 1]) {
-      const z1 = zooms[zooms.length - 2];
-      const z2 = zooms[zooms.length - 1];
-      const w1 = this.lineWidthStops[z1];
-      const w2 = this.lineWidthStops[z2];
-      const slope = (w2 - w1) / (z2 - z1);
-      return Math.max(MIN_LINE_WIDTH, w2 + slope * (zoom - z2));
-    }
-    for (let i2 = 0; i2 < zooms.length - 1; i2++) {
-      if (zoom > zooms[i2] && zoom < zooms[i2 + 1]) {
-        const z1 = zooms[i2];
-        const z2 = zooms[i2 + 1];
-        const w1 = this.lineWidthStops[z1];
-        const w2 = this.lineWidthStops[z2];
-        const t = (zoom - z1) / (z2 - z1);
-        return w1 + t * (w2 - w1);
-      }
-    }
-    return DEFAULT_LINE_WIDTH;
-  }
   /**
    * Check if this config matches the given template URLs (with {z}/{x}/{y} placeholders)
    * @param {string | string[]} templates - Single template URL or array of template URLs
@@ -2916,12 +2952,11 @@ var configs_default2 = [
       "https://{s}.basemaps.cartocdn.com/rastertiles/voyager_labels_under/{z}/{x}/{y}.png",
       "https://basemaps.cartocdn.com/rastertiles/voyager_labels_under/{z}/{x}/{y}.png"
     ],
-    lineWidthStops: { "1": 0.5, "2": 0.75, "3": 0.75, "4": 1, "5": 1, "7": 1.5, "16": 2.5 },
+    lineWidthStops: { "1": 0.5, "2": 0.75, "3": 0.75, "4": 1, "5": 1, "7": 1.75, "16": 2.5 },
     lineStyles: [
       { color: "rgb(235, 214, 214)", layerSuffix: "ne", endZoom: 4, lineExtensionFactor: 0.1, delWidthFactor: 2.5 },
       { color: "rgb(235, 214, 214)", layerSuffix: "ne-disp", endZoom: 4, delWidthFactor: 0 },
-      { color: "rgb(235, 214, 214)", layerSuffix: "osm", alpha: 0.2, startZoom: 6, endZoom: 11, widthFraction: 5, lineExtensionFactor: 0.1 },
-      { color: "rgb(235, 214, 214)", layerSuffix: "osm", alpha: 0.2, startZoom: 12, widthFraction: 4, lineExtensionFactor: 0.1 },
+      { color: "rgb(235, 214, 214)", layerSuffix: "osm", alpha: 0.1, startZoom: 6, lineWidthStops: { "6": 9, "10": 8, "14": 8 }, lineExtensionFactor: 0.1 },
       { color: "rgb(235, 214, 214)", layerSuffix: "osm", startZoom: 5, lineExtensionFactor: 0.1 },
       { color: "rgb(235, 214, 214)", layerSuffix: "osm-disp", startZoom: 5, delWidthFactor: 0 },
       { color: "rgb(235, 214, 214)", layerSuffix: "osm-internal", startZoom: 5, widthFraction: 0.5, dashArray: [2, 2], delWidthFactor: 2 },
@@ -2944,12 +2979,11 @@ var configs_default2 = [
       "https://{s}.basemaps.cartocdn.com/rastertiles/voyager_labels_under/{z}/{x}/{y}{r}.png",
       "https://basemaps.cartocdn.com/rastertiles/voyager_labels_under/{z}/{x}/{y}{r}.png"
     ],
-    lineWidthStops: { "1": 0.75, "2": 0.75, "3": 0.75, "4": 1, "5": 1, "7": 1.5, "11": 2 },
+    lineWidthStops: { "1": 1, "3": 1, "4": 2, "5": 2, "6": 2.5, "7": 3, "8": 3, "10": 4, "11": 4, "12": 4 },
     lineStyles: [
       { color: "rgb(235, 214, 214)", layerSuffix: "ne", endZoom: 4, lineExtensionFactor: 0.1, delWidthFactor: 2.5 },
       { color: "rgb(235, 214, 214)", layerSuffix: "ne-disp", endZoom: 4, delWidthFactor: 0 },
-      { color: "rgb(235, 214, 214)", layerSuffix: "osm", alpha: 0.1, startZoom: 6, endZoom: 11, widthFraction: 5, lineExtensionFactor: 0.1 },
-      { color: "rgb(235, 214, 214)", layerSuffix: "osm", alpha: 0.1, startZoom: 12, widthFraction: 4, lineExtensionFactor: 0.1 },
+      { color: "rgb(235, 214, 214)", layerSuffix: "osm", alpha: 0.1, startZoom: 6, lineWidthStops: { "6": 20, "8": 19, "10": 18, "12": 17 }, lineExtensionFactor: 0.1 },
       { color: "rgb(235, 214, 214)", layerSuffix: "osm", startZoom: 5, lineExtensionFactor: 0.1 },
       { color: "rgb(235, 214, 214)", layerSuffix: "osm-disp", startZoom: 5, delWidthFactor: 0 },
       { color: "rgb(235, 214, 214)", layerSuffix: "osm-internal", startZoom: 5, widthFraction: 0.5, dashArray: [4, 4], delWidthFactor: 2 },
@@ -2960,15 +2994,20 @@ var configs_default2 = [
     id: "open-topo",
     tileUrlTemplates: [
       "https://{s}.tile.opentopomap.org/{z}/{x}/{y}.png",
-      "https://tile.opentopomap.org/{z}/{x}/{y}.png"
+      "https://tile.opentopomap.org/{z}/{x}/{y}.png",
+      "https://{s}.tile.top-o-map.de/{z}/{x}/{y}.png",
+      "https://tile.top-o-map.de/{z}/{x}/{y}.png"
     ],
     lineWidthStops: { "4": 0.75, "5": 1, "6": 1.25, "7": 1.5, "8": 1.75, "9": 1.25, "10": 1.25, "13": 1.5 },
     lineStyles: [
       { color: "rgb(83, 83, 83)", layerSuffix: "ne", startZoom: 4, endZoom: 6 },
       { color: "rgb(173, 173, 173)", layerSuffix: "osm", startZoom: 7, endZoom: 8, alpha: 0.5, widthFraction: 4 },
       { color: "rgb(83, 83, 83)", layerSuffix: "osm", startZoom: 7, endZoom: 8 },
+      { color: "rgb(83, 83, 83)", layerSuffix: "osm-internal", widthFraction: 0.75, startZoom: 7, endZoom: 8 },
       { color: "rgb(199, 158, 204)", layerSuffix: "osm", startZoom: 9, widthFraction: 7, alpha: 0.6, lineExtensionFactor: 0.2 },
-      { color: "rgb(175, 41, 203)", layerSuffix: "osm", startZoom: 9, lineExtensionFactor: 0.2 }
+      { color: "rgb(175, 41, 203)", layerSuffix: "osm", startZoom: 9, lineExtensionFactor: 0.2 },
+      { color: "rgb(199, 158, 204)", layerSuffix: "osm-internal", startZoom: 9, widthFraction: 2.25, alpha: 0.6, lineExtensionFactor: 0.2 },
+      { color: "rgb(175, 41, 203)", layerSuffix: "osm-internal", startZoom: 9, widthFactor: 0.75, lineExtensionFactor: 0.2 }
     ]
   },
   {
@@ -2977,9 +3016,8 @@ var configs_default2 = [
       "https://tile.openstreetmap.org/{z}/{x}/{y}.png",
       "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
     ],
-    lineWidthStops: { "1": 0.5, "2": 0.6, "3": 0.7, "4": 1, "10": 3.75 },
+    lineWidthStops: { "3": 0.7, "4": 1, "10": 3.75 },
     lineStyles: [
-      { color: "rgb(200, 180, 200)", layerSuffix: "osm", startZoom: 1, endZoom: 3, delWidthFactor: 2.5, widthFraction: 1.5 },
       { color: "rgb(200, 180, 200)", layerSuffix: "osm", startZoom: 4, delWidthFactor: 1.5 },
       { color: "rgb(160, 120, 160)", layerSuffix: "osm", startZoom: 4, widthFraction: 0.333, dashArray: [30, 2, 8, 2], delWidthFactor: 0 },
       { color: "rgb(200, 180, 200)", layerSuffix: "osm-internal", startZoom: 4, widthFraction: 0.45 },
@@ -3003,6 +3041,39 @@ var configs_default2 = [
 var INFINITY2 = -1;
 var MIN_LINE_WIDTH2 = 0.1;
 var DEFAULT_LINE_WIDTH2 = 1;
+function interpolateLineWidth2(zoom, lineWidthStops) {
+  const zooms = Object.keys(lineWidthStops).map(Number).sort((a, b2) => a - b2);
+  if (lineWidthStops[zoom] !== void 0) {
+    return lineWidthStops[zoom];
+  }
+  if (zoom < zooms[0]) {
+    const z1 = zooms[0];
+    const z2 = zooms[1];
+    const w1 = lineWidthStops[z1];
+    const w2 = lineWidthStops[z2];
+    const slope = (w2 - w1) / (z2 - z1);
+    return Math.max(MIN_LINE_WIDTH2, w1 + slope * (zoom - z1));
+  }
+  if (zoom > zooms[zooms.length - 1]) {
+    const z1 = zooms[zooms.length - 2];
+    const z2 = zooms[zooms.length - 1];
+    const w1 = lineWidthStops[z1];
+    const w2 = lineWidthStops[z2];
+    const slope = (w2 - w1) / (z2 - z1);
+    return Math.max(MIN_LINE_WIDTH2, w2 + slope * (zoom - z2));
+  }
+  for (let i2 = 0; i2 < zooms.length - 1; i2++) {
+    if (zoom > zooms[i2] && zoom < zooms[i2 + 1]) {
+      const z1 = zooms[i2];
+      const z2 = zooms[i2 + 1];
+      const w1 = lineWidthStops[z1];
+      const w2 = lineWidthStops[z2];
+      const t = (zoom - z1) / (z2 - z1);
+      return w1 + t * (w2 - w1);
+    }
+  }
+  return DEFAULT_LINE_WIDTH2;
+}
 function templateToRegex2(template) {
   const groups = [];
   const hasRetina = template.includes("{r}");
@@ -3069,14 +3140,33 @@ function isValidColor2(color) {
   if (/^[a-z]+$/.test(trimmed)) return true;
   return false;
 }
+function validateLineWidthStops2(lineWidthStops, prefix) {
+  if (!lineWidthStops || typeof lineWidthStops !== "object" || Array.isArray(lineWidthStops)) {
+    throw new Error(`${prefix}: lineWidthStops must be an object`);
+  }
+  const stopKeys = Object.keys(lineWidthStops);
+  if (stopKeys.length < 2) {
+    throw new Error(`${prefix}: lineWidthStops must have at least 2 entries`);
+  }
+  for (const key of stopKeys) {
+    const zoom = Number(key);
+    if (!Number.isInteger(zoom) || zoom < 0) {
+      throw new Error(`${prefix}: lineWidthStops keys must be non-negative integers, got "${key}"`);
+    }
+    if (typeof lineWidthStops[key] !== "number" || lineWidthStops[key] <= 0) {
+      throw new Error(`${prefix}: lineWidthStops values must be positive numbers`);
+    }
+  }
+}
 var LineStyle2 = class _LineStyle2 {
   /**
    * Validate a LineStyle configuration object.
    * @param {Object} obj - The object to validate
    * @param {number} [index] - Optional index for error messages (when validating in an array)
+   * @param {boolean} [requireLineWidthStops=false] - Whether lineWidthStops is required
    * @throws {Error} If validation fails
    */
-  static validateJSON(obj, index) {
+  static validateJSON(obj, index, requireLineWidthStops = false) {
     const prefix = index !== void 0 ? `lineStyles[${index}]` : "LineStyle";
     if (!obj || typeof obj !== "object") {
       throw new Error(`${prefix}: must be an object`);
@@ -3111,22 +3201,30 @@ var LineStyle2 = class _LineStyle2 {
     if (obj.delWidthFactor !== void 0 && (typeof obj.delWidthFactor !== "number" || obj.delWidthFactor < 0)) {
       throw new Error(`${prefix}: delWidthFactor must be a non-negative number`);
     }
+    if (requireLineWidthStops && obj.lineWidthStops === void 0) {
+      throw new Error(`${prefix}: lineWidthStops is required`);
+    }
+    if (obj.lineWidthStops !== void 0) {
+      validateLineWidthStops2(obj.lineWidthStops, prefix);
+    }
   }
   /**
    * @param {Object} options
    * @param {string} options.color - CSS color string
    * @param {string} options.layerSuffix - Layer suffix (e.g., 'osm', 'ne', 'osm-disp')
+   * @param {Object<number, number>} options.lineWidthStops - Line width stops for this style
    * @param {number} [options.widthFraction=1.0] - Multiplier for base line width
    * @param {number[]} [options.dashArray] - Dash pattern for dashed lines
    * @param {number} [options.alpha=1.0] - Opacity (0-1)
    * @param {number} [options.startZoom=0] - Minimum zoom level for this style
    * @param {number} [options.endZoom=INFINITY] - Maximum zoom level for this style (INFINITY means no limit)
-   * @param {number} [options.lineExtensionFactor=0.5] - Factor to extend lines by (multiplied by deletion line width)
+   * @param {number} [options.lineExtensionFactor=0.0] - Factor to extend lines by (multiplied by deletion line width)
    * @param {number} [options.delWidthFactor=1.5] - Factor to multiply line width for deletion blur
    */
-  constructor({ color, layerSuffix, widthFraction = 1, dashArray, alpha = 1, startZoom = 0, endZoom = INFINITY2, lineExtensionFactor = 0, delWidthFactor = 1.5 }) {
+  constructor({ color, layerSuffix, lineWidthStops, widthFraction = 1, dashArray, alpha = 1, startZoom = 0, endZoom = INFINITY2, lineExtensionFactor = 0, delWidthFactor = 1.5 }) {
     this.color = color;
     this.layerSuffix = layerSuffix;
+    this.lineWidthStops = lineWidthStops;
     this.widthFraction = widthFraction;
     this.dashArray = dashArray;
     this.alpha = alpha;
@@ -3135,6 +3233,14 @@ var LineStyle2 = class _LineStyle2 {
     this.lineExtensionFactor = lineExtensionFactor;
     this.delWidthFactor = delWidthFactor;
   }
+  /**
+   * Get base line width for this style at a given zoom level.
+   * @param {number} zoom - Zoom level
+   * @returns {number}
+   */
+  getLineWidth(zoom) {
+    return interpolateLineWidth2(zoom, this.lineWidthStops);
+  }
   /**
    * Check if this style is active at the given zoom level.
    * @param {number} z - Zoom level
@@ -3151,6 +3257,7 @@ var LineStyle2 = class _LineStyle2 {
     return {
       color: this.color,
       layerSuffix: this.layerSuffix,
+      lineWidthStops: this.lineWidthStops,
       widthFraction: this.widthFraction,
       dashArray: this.dashArray,
       alpha: this.alpha,
@@ -3167,7 +3274,7 @@ var LineStyle2 = class _LineStyle2 {
    * @returns {LineStyle}
    */
   static fromJSON(obj, index) {
-    _LineStyle2.validateJSON(obj, index);
+    _LineStyle2.validateJSON(obj, index, true);
     return new _LineStyle2(obj);
   }
 };
@@ -3233,9 +3340,13 @@ var LayerConfig2 = class _LayerConfig2 {
     this._compiledPatterns = templates.map((t) => templateToRegex2(t));
     this._templatePatterns = templates.map((t) => templateToTemplateRegex2(t));
     this.lineWidthStops = lineWidthStops;
-    this.lineStyles = lineStyles.map(
-      (style) => style instanceof LineStyle2 ? style : new LineStyle2(style)
-    );
+    this.lineStyles = lineStyles.map((style) => {
+      if (style instanceof LineStyle2) {
+        return style;
+      }
+      const styleWithStops = style.lineWidthStops ? style : { ...style, lineWidthStops };
+      return new LineStyle2(styleWithStops);
+    });
   }
   /**
    * Get line styles active at a given zoom level
@@ -3254,45 +3365,6 @@ var LayerConfig2 = class _LayerConfig2 {
     const activeStyles = this.getLineStylesForZoom(z2);
     return [...new Set(activeStyles.map((s) => s.layerSuffix))];
   }
-  /**
-   * Interpolate or extrapolate line width for a given zoom level.
-   * Uses the lineWidthStops map to calculate the appropriate width.
-   * @param {number} zoom - Zoom level
-   * @returns {number}
-   */
-  getLineWidth(zoom) {
-    const zooms = Object.keys(this.lineWidthStops).map(Number).sort((a, b2) => a - b2);
-    if (this.lineWidthStops[zoom] !== void 0) {
-      return this.lineWidthStops[zoom];
-    }
-    if (zoom < zooms[0]) {
-      const z1 = zooms[0];
-      const z2 = zooms[1];
-      const w1 = this.lineWidthStops[z1];
-      const w2 = this.lineWidthStops[z2];
-      const slope = (w2 - w1) / (z2 - z1);
-      return Math.max(MIN_LINE_WIDTH2, w1 + slope * (zoom - z1));
-    }
-    if (zoom > zooms[zooms.length - 1]) {
-      const z1 = zooms[zooms.length - 2];
-      const z2 = zooms[zooms.length - 1];
-      const w1 = this.lineWidthStops[z1];
-      const w2 = this.lineWidthStops[z2];
-      const slope = (w2 - w1) / (z2 - z1);
-      return Math.max(MIN_LINE_WIDTH2, w2 + slope * (zoom - z2));
-    }
-    for (let i2 = 0; i2 < zooms.length - 1; i2++) {
-      if (zoom > zooms[i2] && zoom < zooms[i2 + 1]) {
-        const z1 = zooms[i2];
-        const z2 = zooms[i2 + 1];
-        const w1 = this.lineWidthStops[z1];
-        const w2 = this.lineWidthStops[z2];
-        const t = (zoom - z1) / (z2 - z1);
-        return w1 + t * (w2 - w1);
-      }
-    }
-    return DEFAULT_LINE_WIDTH2;
-  }
   /**
    * Check if this config matches the given template URLs (with {z}/{x}/{y} placeholders)
    * @param {string | string[]} templates - Single template URL or array of template URLs
@@ -3785,12 +3857,13 @@ var _TileFixer = class _TileFixer2 {
     const canvas = this._canvas;
     const ctx = canvas.getContext("2d", { willReadFrequently: true });
     ctx.drawImage(imageBitmap, 0, 0, tileSize, tileSize);
-    const baseLineWidth = layerConfig.getLineWidth(zoom);
     const delLineWidthBySuffix = {};
     for (const suffix of layerSuffixes) {
       const stylesForSuffix = activeLineStyles.filter((s) => s.layerSuffix === suffix);
-      const maxProduct = Math.max(...stylesForSuffix.map((s) => s.widthFraction * s.delWidthFactor));
-      delLineWidthBySuffix[suffix] = baseLineWidth * maxProduct;
+      const maxDelWidth = Math.max(...stylesForSuffix.map(
+        (s) => s.getLineWidth(zoom) * s.widthFraction * s.delWidthFactor
+      ));
+      delLineWidthBySuffix[suffix] = maxDelWidth;
     }
     for (const suffix of layerSuffixes) {
       const delLineWidth = delLineWidthBySuffix[suffix];
@@ -3805,7 +3878,7 @@ var _TileFixer = class _TileFixer2 {
       }
     }
     for (const style of activeLineStyles) {
-      const { color, layerSuffix, widthFraction, dashArray, alpha, lineExtensionFactor } = style;
+      const { color, widthFraction, dashArray, alpha, lineExtensionFactor, layerSuffix } = style;
       const addLayerName = `to-add-${layerSuffix}`;
       let addFeatures = corrections[addLayerName] || [];
       if (addFeatures.length > 0) {
@@ -3813,7 +3886,7 @@ var _TileFixer = class _TileFixer2 {
         if (lineExtensionFactor > 0) {
           addFeatures = extendFeaturesByFactor(addFeatures, lineExtensionFactor, delLineWidth, tileSize);
         }
-        const lineWidth = baseLineWidth * widthFraction;
+        const lineWidth = style.getLineWidth(zoom) * widthFraction;
         drawFeatures(ctx, addFeatures, color, lineWidth, tileSize, dashArray, alpha);
       }
     }