lib/leaflet-components
1
1
Fork 0
Code Issues Pull Requests Packages Projects Releases 3 Wiki Activity

fix: handle runtime attribute changes for marker title/alt and media props

Browse Source 
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.
This commit is contained in:
Buddy 2026-06-08 22:29:27 -07:00
parent 3846cad38e
commit 566b8ea43c
3 changed files with 22 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/components/leaflet-image-overlay.ts
View File

@ -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;

6
src/components/leaflet-marker.ts
View File

@ -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;

13
src/components/leaflet-video-overlay.ts
View File

@ -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;