refactor: extract #parsedBounds into parseBoundsAttr helper

Replaces the identical private #parsedBounds method in rectangle,
image-overlay, video-overlay, and svg-overlay with a call to
parseBoundsAttr(el) from utils.ts. Removes 4 x 5 = 20 lines
of method definitions.

src/components/leaflet-image-overlay.ts

@@ -1,5 +1,5 @@
-import { ImageOverlay, LatLngBounds, LatLngBoundsExpression, LatLngExpression } from 'leaflet';
-import { buildOptions, parseAttributeValue } from '../core/utils.js';
+import { ImageOverlay, LatLngBounds, LatLngExpression } from 'leaflet';
+import { buildOptions, parseAttributeValue, parseBoundsAttr } from '../core/utils.js';
 import { withProps } from '../core/with-props.js';
 
 import { registerChildren, unregisterChildren } from '../core/register.js';
@@ -28,7 +28,7 @@ export class LeafletImageOverlay extends withProps(HTMLElement, PROPS) {
     const url = this.getAttribute('url') || '';
     this.#obj = new ImageOverlay(
       url,
-      this.#parsedBounds(),
+      parseBoundsAttr(this),
       buildOptions(this, PROPS, ['url', 'bounds']),
     );
     registerChildren(this, this.#obj);
@@ -45,7 +45,7 @@ export class LeafletImageOverlay extends withProps(HTMLElement, PROPS) {
     if (name === 'url') {
       if (val) this.#obj.setUrl(val);
     } else if (name === 'bounds') {
-      this.#obj.setBounds(new LatLngBounds(this.#parsedBounds() as LatLngExpression[]));
+      this.#obj.setBounds(new LatLngBounds(parseBoundsAttr(this) as LatLngExpression[]));
     } else if (name === 'alt') {
       const el = this.#obj.getElement();
       if (el) (el as HTMLImageElement).alt = val ?? '';
@@ -61,11 +61,6 @@ export class LeafletImageOverlay extends withProps(HTMLElement, PROPS) {
       }
     }
   }
-
-  #parsedBounds(): LatLngBoundsExpression {
-    const raw = this.getAttribute('bounds');
-    return raw ? (JSON.parse(raw) as LatLngBoundsExpression) : [];
-  }
 }
 
 customElements.define('leaflet-image-overlay', LeafletImageOverlay);

src/components/leaflet-rectangle.ts

@@ -1,5 +1,5 @@
-import { Rectangle, LatLngBoundsExpression } from 'leaflet';
-import { buildOptions } from '../core/utils.js';
+import { Rectangle } from 'leaflet';
+import { buildOptions, parseBoundsAttr } from '../core/utils.js';
 import { withProps } from '../core/with-props.js';
 
 import { registerChildren, unregisterChildren } from '../core/register.js';
@@ -20,7 +20,7 @@ export class LeafletRectangle extends withProps(HTMLElement, PROPS) {
   #obj?: Rectangle;
 
   connectedCallback() {
-    this.#obj = new Rectangle(this.#parsedBounds(), buildOptions(this, PROPS, ['bounds']));
+    this.#obj = new Rectangle(parseBoundsAttr(this), buildOptions(this, PROPS, ['bounds']));
     registerChildren(this, this.#obj);
   }
 
@@ -33,16 +33,11 @@ export class LeafletRectangle extends withProps(HTMLElement, PROPS) {
   attributeChangedCallback(name: string, _old: string | null, val: string | null) {
     if (!this.#obj) return;
     if (name === 'bounds') {
-      this.#obj.setBounds(this.#parsedBounds());
+      this.#obj.setBounds(parseBoundsAttr(this));
     } else if (isPathStyleAttr(name)) {
       updatePathStyle(this.#obj, name, val);
     }
   }
-
-  #parsedBounds(): LatLngBoundsExpression {
-    const raw = this.getAttribute('bounds');
-    return raw ? (JSON.parse(raw) as LatLngBoundsExpression) : [];
-  }
 }
 
 customElements.define('leaflet-rectangle', LeafletRectangle);

src/components/leaflet-svg-overlay.ts

@@ -1,5 +1,5 @@
-import { SVGOverlay, LatLngBounds, LatLngBoundsExpression, LatLngExpression } from 'leaflet';
-import { buildOptions, parseAttributeValue } from '../core/utils.js';
+import { SVGOverlay, LatLngBounds, LatLngExpression } from 'leaflet';
+import { buildOptions, parseAttributeValue, parseBoundsAttr } from '../core/utils.js';
 import { withProps } from '../core/with-props.js';
 
 import { registerChildren, unregisterChildren } from '../core/register.js';
@@ -26,7 +26,7 @@ export class LeafletSVGOverlay extends withProps(HTMLElement, PROPS) {
     const dummy = !svg ? document.createElementNS('http://www.w3.org/2000/svg', 'svg') : undefined;
     this.#obj = new SVGOverlay(
       svg ?? dummy!,
-      this.#parsedBounds(),
+      parseBoundsAttr(this),
       buildOptions(this, PROPS, ['bounds']),
     );
     registerChildren(this, this.#obj);
@@ -41,7 +41,7 @@ export class LeafletSVGOverlay extends withProps(HTMLElement, PROPS) {
   attributeChangedCallback(name: string, _old: string | null, val: string | null) {
     if (!this.#obj) return;
     if (name === 'bounds') {
-      this.#obj.setBounds(new LatLngBounds(this.#parsedBounds() as LatLngExpression[]));
+      this.#obj.setBounds(new LatLngBounds(parseBoundsAttr(this) as LatLngExpression[]));
     } else {
       const propName = PROP_BY_ATTR.get(name);
       if (!propName) return;
@@ -54,11 +54,6 @@ export class LeafletSVGOverlay extends withProps(HTMLElement, PROPS) {
       }
     }
   }
-
-  #parsedBounds(): LatLngBoundsExpression {
-    const raw = this.getAttribute('bounds');
-    return raw ? (JSON.parse(raw) as LatLngBoundsExpression) : [];
-  }
 }
 
 customElements.define('leaflet-svg-overlay', LeafletSVGOverlay);

src/components/leaflet-video-overlay.ts

@@ -1,5 +1,5 @@
-import { VideoOverlay, LatLngBounds, LatLngBoundsExpression, LatLngExpression } from 'leaflet';
-import { buildOptions, parseAttributeValue } from '../core/utils.js';
+import { VideoOverlay, LatLngBounds, LatLngExpression } from 'leaflet';
+import { buildOptions, parseAttributeValue, parseBoundsAttr } from '../core/utils.js';
 import { withProps } from '../core/with-props.js';
 
 import { registerChildren, unregisterChildren } from '../core/register.js';
@@ -29,7 +29,7 @@ export class LeafletVideoOverlay extends withProps(HTMLElement, PROPS) {
     const url = this.getAttribute('url') || '';
     this.#obj = new VideoOverlay(
       url,
-      this.#parsedBounds(),
+      parseBoundsAttr(this),
       buildOptions(this, PROPS, ['url', 'bounds']),
     );
     registerChildren(this, this.#obj);
@@ -46,7 +46,7 @@ export class LeafletVideoOverlay extends withProps(HTMLElement, PROPS) {
     if (name === 'url') {
       if (val) this.#obj.setUrl(val);
     } else if (name === 'bounds') {
-      this.#obj.setBounds(new LatLngBounds(this.#parsedBounds() as LatLngExpression[]));
+      this.#obj.setBounds(new LatLngBounds(parseBoundsAttr(this) as LatLngExpression[]));
     } else if (
       name === 'loop' ||
       name === 'autoplay' ||
@@ -73,11 +73,6 @@ export class LeafletVideoOverlay extends withProps(HTMLElement, PROPS) {
     }
   }
 
-  #parsedBounds(): LatLngBoundsExpression {
-    const raw = this.getAttribute('bounds');
-    return raw ? (JSON.parse(raw) as LatLngBoundsExpression) : [];
-  }
-
   getElement(): HTMLVideoElement | undefined {
     return this.#obj?.getElement();
   }

src/core/utils.ts

@@ -1,4 +1,5 @@
 import type { PropDef } from '../types/props.js';
+import type { LatLngBoundsExpression } from 'leaflet';
 
 export function camelCase(str: string): string {
   return str.replace(/-([a-z])/g, (g) => g[1].toUpperCase());
@@ -44,6 +45,11 @@ export function numAttr(el: HTMLElement, props: Record<string, PropDef>, name: s
   return (props[name] as { default: number }).default;
 }
 
+export function parseBoundsAttr(el: HTMLElement): LatLngBoundsExpression {
+  const raw = el.getAttribute('bounds');
+  return raw ? (JSON.parse(raw) as LatLngBoundsExpression) : [];
+}
+
 export function buildOptions(
   el: HTMLElement,
   props: Record<string, PropDef>,