refactor: remove leaflet-request-icon event protocol

The discovery handshake (marker dispatching leaflet-request-icon on
children, icons listening and responding with icon-changed) existed
to handle the edge case where icon definitions register before marker
definitions. Since bundled imports register all components in deterministic
order and deep imports are an advanced use case left to the consumer,
remove the event entirely. icon-changed bubbling alone covers all
practical timing scenarios.

- Remove LeafletRequestIconEvent type and HTMLElementEventMap entry
- Remove #onRequest handler and addEventListener/removeEventListener
  calls from both leaflet-icon and leaflet-div-icon
- Remove child-iteration dispatch loop from leaflet-marker
main
Buddy 3 months ago
parent 35190bacc5
commit 2a1b56c6e3

@ -16,15 +16,10 @@ const JSON_KEYS = new Set(['iconSize', 'iconAnchor', 'popupAnchor', 'tooltipAnch
export class LeafletDivIcon extends HTMLElement {
#obj?: Icon;
#observer?: MutationObserver;
#onRequest = () => {
if (!this.#obj) return;
emitIconChanged(this, this.#obj);
};
connectedCallback() {
this.#applyIcon();
emitIconChanged(this, this.#obj);
this.addEventListener('leaflet-request-icon', this.#onRequest);
this.#observer = new MutationObserver(() => {
this.#applyIcon();
@ -38,7 +33,6 @@ export class LeafletDivIcon extends HTMLElement {
}
disconnectedCallback() {
this.removeEventListener('leaflet-request-icon', this.#onRequest);
this.#observer?.disconnect();
this.#observer = undefined;
emitIconChanged(this, null);

@ -26,19 +26,13 @@ const JSON_KEYS = new Set([
export class LeafletIcon extends HTMLElement {
#obj?: Icon;
#onRequest = () => {
if (!this.#obj) return;
emitIconChanged(this, this.#obj);
};
connectedCallback() {
this.#applyIcon();
emitIconChanged(this, this.#obj);
this.addEventListener('leaflet-request-icon', this.#onRequest);
}
disconnectedCallback() {
this.removeEventListener('leaflet-request-icon', this.#onRequest);
emitIconChanged(this, null);
}

@ -27,9 +27,6 @@ export class LeafletMarker extends WithProps(HTMLElement, PROPS) {
this.#obj.on('dragend move', this.#onChange, this);
registerChildren(this, this.#obj);
this.addEventListener('icon-changed', this.#onIconChanged);
for (const child of this.children) {
child.dispatchEvent(new CustomEvent('leaflet-request-icon'));
}
}
disconnectedCallback() {

@ -13,15 +13,12 @@ export type LeafletLayerEvent = CustomEvent<{ layer: Layer }>;
export type LeafletIconChangedEvent = CustomEvent<{ icon: Icon | null }>;
export type LeafletRequestIconEvent = CustomEvent<Record<string, never>>;
declare global {
interface HTMLElementEventMap {
'leaflet-register': LeafletRegisterEvent;
'leaflet-add-layer': LeafletLayerEvent;
'leaflet-remove-layer': LeafletLayerEvent;
'icon-changed': LeafletIconChangedEvent;
'leaflet-request-icon': LeafletRequestIconEvent;
}
}

Loading…
Cancel
Save