@india-boundary-corrector/leaflet-layer 0.0.1 → 0.0.3

package/README.md

@@ -1,7 +1,11 @@
 # @india-boundary-corrector/leaflet-layer
 
+[![npm version](https://img.shields.io/npm/v/@india-boundary-corrector/leaflet-layer)](https://www.npmjs.com/package/@india-boundary-corrector/leaflet-layer)
+
 Leaflet TileLayer extension that automatically applies India boundary corrections.
 
+[Try it on JSFiddle](https://jsfiddle.net/z8d76em5/1/)
+
 ## Installation
 
 ```bash
@@ -26,7 +30,7 @@ No bundler required! Just include the script and use the global `IndiaBoundaryCo
   IndiaBoundaryCorrector.extendLeaflet(L);
 
   // Create map
-  const map = L.map('map').setView([20.5937, 78.9629], 5);
+  const map = L.map('map').setView([33.2778, 75.3412], 5);
 
   // Use corrected tile layer - config auto-detected from URL
   L.tileLayer.indiaBoundaryCorrected('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
@@ -45,7 +49,7 @@ import { extendLeaflet } from '@india-boundary-corrector/leaflet-layer';
 extendLeaflet(L);
 
 // Create map
-const map = L.map('map').setView([20.5937, 78.9629], 5);
+const map = L.map('map').setView([33.2778, 75.3412], 5);
 
 // Use corrected tile layer - config auto-detected from URL
 L.tileLayer.indiaBoundaryCorrected('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
@@ -61,12 +65,12 @@ import { extendLeaflet, layerConfigs } from '@india-boundary-corrector/leaflet-l
 
 extendLeaflet(L);
 
-const map = L.map('map').setView([20.5937, 78.9629], 5);
+const map = L.map('map').setView([33.2778, 75.3412], 5);
 
 // Use a specific config by ID
 L.tileLayer.indiaBoundaryCorrected('https://{s}.basemaps.cartocdn.com/dark_all/{z}/{x}/{y}.png', {
   layerConfig: 'cartodb-dark',
-  attribution: '© CartoDB © OpenStreetMap contributors'
+  attribution: '© CARTO © OpenStreetMap contributors'
 }).addTo(map);
 ```
 
@@ -78,7 +82,7 @@ import { extendLeaflet, LayerConfig } from '@india-boundary-corrector/leaflet-la
 
 extendLeaflet(L);
 
-const map = L.map('map').setView([20.5937, 78.9629], 5);
+const map = L.map('map').setView([33.2778, 75.3412], 5);
 
 // Create custom config
 const osmDeConfig = new LayerConfig({
@@ -134,21 +138,6 @@ layer.on('correctionerror', (e) => {
 | `coords` | object | Tile coordinates `{ z, x, y }` |
 | `tileUrl` | string | URL of the tile being loaded |
 
-## Global Auto-extension
-
-If Leaflet is available as a global `L` object, the extension is applied automatically on import:
-
-```html
-<script src="https://unpkg.com/leaflet/dist/leaflet.js"></script>
-<script type="module">
-  import '@india-boundary-corrector/leaflet-layer';
-  
-  // L.TileLayer.IndiaBoundaryCorrected is now available
-  const map = L.map('map').setView([20.5937, 78.9629], 5);
-  L.tileLayer.indiaBoundaryCorrected('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png').addTo(map);
-</script>
-```
-
 ## License
 
 Unlicense

package/dist/index.cjs

@@ -139,10 +139,10 @@ function templateToTemplateRegex(template) {
   let pattern = template.replace(/[.*+?^${}()|[\]\\]/g, (char) => {
     if (char === "{" || char === "}") return char;
     return "\\" + char;
-  }).replace(/^https:\/\//, "https?://").replace(/^http:\/\//, "https?://").replace(/\{([a-z0-9])-([a-z0-9])\}/gi, (_2, start, end) => `(\\{${start}-${end}\\}|[a-z0-9]+)`).replace(/\{(z|x|y|s|r)\}/gi, (_2, name) => {
+  }).replace(/^https:\/\//, "https?://").replace(/^http:\/\//, "https?://").replace(/\{([a-z0-9])-([a-z0-9])\}/gi, (_2, start, end) => `(\\{${start}-${end}\\}|\\{s\\}|[a-z0-9]+)`).replace(/\{(z|x|y|s|r)\}/gi, (_2, name) => {
     const lowerName = name.toLowerCase();
     if (lowerName === "s") {
-      return "(\\{s\\}|[a-z0-9]+)";
+      return "(\\{s\\}|\\{[a-z0-9]-[a-z0-9]\\}|[a-z0-9]+)";
     }
     if (lowerName === "r") {
       return "(\\{r\\}|@\\d+x)?";
@@ -176,6 +176,9 @@ var LayerConfig = class _LayerConfig {
     if (!id || typeof id !== "string") {
       throw new Error("LayerConfig requires a non-empty string id");
     }
+    if (id.includes("/")) {
+      throw new Error(`LayerConfig id cannot contain slashes: "${id}"`);
+    }
     this.id = id;
     this.startZoom = startZoom;
     this.zoomThreshold = zoomThreshold;
@@ -2677,7 +2680,7 @@ function applyMedianBlurAlongPath(ctx, features, lineWidth, tileSize, maskCanvas
   if (!maskCanvas || maskCanvas.width !== tileSize || maskCanvas.height !== tileSize) {
     maskCanvas = new OffscreenCanvas(tileSize, tileSize);
   }
-  const maskCtx = maskCanvas.getContext("2d");
+  const maskCtx = maskCanvas.getContext("2d", { willReadFrequently: true });
   maskCtx.fillStyle = "black";
   maskCtx.fillRect(0, 0, tileSize, tileSize);
   maskCtx.strokeStyle = "white";
@@ -2879,8 +2882,11 @@ var BoundaryCorrector = class {
     const useOsm = zoom >= zoomThreshold;
     const addLayerName = useOsm ? "to-add-osm" : "to-add-ne";
     const delLayerName = useOsm ? "to-del-osm" : "to-del-ne";
-    const canvas = new OffscreenCanvas(tileSize, tileSize);
-    const ctx = canvas.getContext("2d");
+    if (!this._canvas || this._canvas.width !== tileSize) {
+      this._canvas = new OffscreenCanvas(tileSize, tileSize);
+    }
+    const canvas = this._canvas;
+    const ctx = canvas.getContext("2d", { willReadFrequently: true });
     const blob = new Blob([rasterTile]);
     const imageBitmap = await createImageBitmap(blob);
     ctx.drawImage(imageBitmap, 0, 0, tileSize, tileSize);