• v0.1.0 Stable

    buddy released this 2 weeks ago | 0 commits to main since this release

    Initial release.

    leaflet-web-components (npm) / @buddy/leaflet-components (JSR) — native Web
    Components wrapping Leaflet.js. Each <leaflet-*>
    element maps 1:1 to a Leaflet object, and nesting the elements mirrors the
    Leaflet object graph.

    Elements

    24 custom elements: leaflet-map, leaflet-tile-layer, leaflet-tile-layer-wms,
    leaflet-marker, leaflet-popup, leaflet-tooltip, leaflet-circle,
    leaflet-circle-marker, leaflet-polygon, leaflet-polyline,
    leaflet-rectangle, leaflet-line, leaflet-image-overlay,
    leaflet-video-overlay, leaflet-svg-overlay, leaflet-geojson,
    leaflet-layer-group, leaflet-feature-group, leaflet-control-zoom,
    leaflet-control-scale, leaflet-control-layers, leaflet-control-attribution,
    leaflet-icon, leaflet-div-icon.

    Core

    • WithProps mixin — each element declares a prop table; the mixin keeps
      attribute ⇄ property ⇄ live Leaflet option in sync, both directions, without
      cycles.
    • Event forwarding — every Leaflet event the wrapped object fires is
      re-emitted on the element as leaflet:<type>, with detail matching what a
      real Leaflet .on() listener would receive.
    • Registration protocol — children announce themselves to the nearest
      ancestor component via a bubbling leaflet-register event; no component
      reaches into another's DOM.
    • elements/ vs components/elements/leaflet-foo.ts exports the class
      only; components/leaflet-foo.ts adds customElements.define. Plugin authors
      can subclass or re-register under a different tag without triggering the
      built-in define.

    Packaging

    • Dual publish: npm (leaflet-web-components) and JSR
      (@buddy/leaflet-components), with separate entry points. JSR passes the
      "no slow types" check.
    • leaflet is a peer dependency (^1.9.4); @types/leaflet ships as a
      regular dependency.
    • Individual ESM modules, no bundling. Subpath exports for elements/* and
      components/* (npm).
    • HTMLElementTagNameMap / HTMLElementEventMap augmented for npm consumers.

    Tests

    Vitest + jsdom suite covering prop/attribute wiring, event forwarding, the
    registration protocol, and real-page load order.

    Downloads