From 566b8ea43c2bf1bb92cc2e5fe7412cfd4f181743 Mon Sep 17 00:00:00 2001
From: Buddy <git@buddy.wtf>
Date: Mon, 8 Jun 2026 22:29:27 -0700
Subject: [PATCH] fix: handle runtime attribute changes for marker title/alt
 and media props

Marker title/alt now set via getElement() on the icon element.
VideoOverlay loop/autoplay/muted/playsInline set via getElement()
on the video element. ImageOverlay alt set via getElement() on
the img element. These props have no Leaflet set* method but
can be updated through the underlying DOM element.
---
 src/components/leaflet-image-overlay.ts |  3 +++
 src/components/leaflet-marker.ts        |  6 ++++++
 src/components/leaflet-video-overlay.ts | 13 +++++++++++++
 3 files changed, 22 insertions(+)

diff --git a/src/components/leaflet-image-overlay.ts b/src/components/leaflet-image-overlay.ts
index 5fe29f2..e3f4c7b 100644
--- a/src/components/leaflet-image-overlay.ts
+++ b/src/components/leaflet-image-overlay.ts
@@ -55,6 +55,9 @@ export class LeafletImageOverlay extends withProps(HTMLElement, PROPS) {
       if (val) this.#obj.setUrl(val);
     } else if (name === 'bounds') {
       this.#obj.setBounds(new LatLngBounds(this.#parsedBounds() as LatLngExpression[]));
+    } else if (name === 'alt') {
+      const el = this.#obj.getElement();
+      if (el) (el as HTMLImageElement).alt = val ?? '';
     } else {
       const propName = PROP_BY_ATTR.get(name);
       if (!propName) return;
diff --git a/src/components/leaflet-marker.ts b/src/components/leaflet-marker.ts
index 11edf46..e3cb516 100644
--- a/src/components/leaflet-marker.ts
+++ b/src/components/leaflet-marker.ts
@@ -55,6 +55,12 @@ export class LeafletMarker extends withProps(HTMLElement, PROPS) {
     } else if (name === 'draggable') {
       if (val !== null) this.#obj.dragging?.enable();
       else this.#obj.dragging?.disable();
+    } else if (name === 'title') {
+      const el = this.#obj.getElement();
+      if (el) (el as HTMLImageElement).title = val ?? '';
+    } else if (name === 'alt') {
+      const el = this.#obj.getElement();
+      if (el) (el as HTMLImageElement).alt = val ?? '';
     } else {
       const propName = PROP_BY_ATTR.get(name);
       if (!propName) return;
diff --git a/src/components/leaflet-video-overlay.ts b/src/components/leaflet-video-overlay.ts
index a2ac012..20905fa 100644
--- a/src/components/leaflet-video-overlay.ts
+++ b/src/components/leaflet-video-overlay.ts
@@ -56,6 +56,19 @@ export class LeafletVideoOverlay extends withProps(HTMLElement, PROPS) {
       if (val) this.#obj.setUrl(val);
     } else if (name === 'bounds') {
       this.#obj.setBounds(new LatLngBounds(this.#parsedBounds() as LatLngExpression[]));
+    } else if (
+      name === 'loop' ||
+      name === 'autoplay' ||
+      name === 'muted' ||
+      name === 'playsinline'
+    ) {
+      const el = this.#obj.getElement();
+      if (el) {
+        if (name === 'loop') el.loop = val !== null;
+        else if (name === 'autoplay') el.autoplay = val !== null;
+        else if (name === 'muted') el.muted = val !== null;
+        else if (name === 'playsinline') el.playsInline = val !== null;
+      }
     } else {
       const propName = PROP_BY_ATTR.get(name);
       if (!propName) return;