vue-maplibre-gl/dist/vue-maplibre-gl.cjs

Vue 3 plugin for maplibre-gl

/*!
* vue-maplibre-gl v5.6.1
* (c) 2026 Volker Nauruhn
* @license MIT
*/
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("vue"),r=require("./draw.control-CLwG5zT4.cjs"),P=require("maplibre-gl"),re=require("mitt"),u=t.reactive({style:"https://demotiles.maplibre.org/style.json",center:[0,0],zoom:1,trackResize:!1});function x(e,o){const i=e.getStyle();if(!i?.layers)return;const n=o?`name:${o}`:"name";function a(s){if(typeof s=="string")return/\{name(:\S+)?\}/.test(s)?["coalesce",["get",n],["get","name"]]:s;if(Array.isArray(s)){const c=s[0];return c==="get"?typeof s[1]=="string"&&s[1].startsWith("name")?["coalesce",["get",n],["get","name"]]:s:s.map(a)}return s}i.layers.forEach(s=>{if(s.type!=="symbol")return;const c=e.getLayoutProperty(s.id,"text-field");if(!c)return;const g=a(c);g&&e.setLayoutProperty(s.id,"text-field",g)})}class R{static MAP_OPTION_KEYS=["attributionControl","bearing","bearingSnap","bounds","boxZoom","cancelPendingTileRequestsWhileZooming","canvasContextAttributes","center","centerClampedToGround","clickTolerance","collectResourceTiming","cooperativeGestures","crossSourceCollisions","doubleClickZoom","dragPan","dragRotate","elevation","fadeDuration","fitBoundsOptions","hash","interactive","keyboard","locale","localIdeographFontFamily","logoPosition","maplibreLogo","maxBounds","maxCanvasSize","maxPitch","maxTileCacheSize","maxTileCacheZoomLevels","maxZoom","minPitch","minZoom","pitch","pitchWithRotate","pixelRatio","refreshExpiredTiles","renderWorldCopies","roll","rollEnabled","scrollZoom","touchPitch","touchZoomRotate","trackResize","transformCameraUpdate","transformRequest","validateStyle","zoom","mapStyle"];static MARKER_OPTION_KEYS=["element","offset","anchor","color","draggable","clickTolerance","rotation","rotationAlignment","pitchAlignment","scale"];static MAP_EVENT_TYPES=["boxzoomcancel","boxzoomend","boxzoomstart","click","contextmenu","cooperativegestureprevented","data","dataabort","dataloading","dblclick","drag","dragend","dragstart","error","idle","load","mousedown","mousemove","mouseout","mouseover","mouseup","move","moveend","movestart","pitch","pitchend","pitchstart","projectiontransition","remove","render","resize","rotate","rotateend","rotatestart","sourcedata","sourcedataabort","sourcedataloading","styledata","styledataloading","styleimagemissing","terrain","tiledataloading","touchcancel","touchend","touchmove","touchstart","webglcontextlost","webglcontextrestored","wheel","zoom","zoomend","zoomstart"];static createEventHandler(o,i,n,a){return(s={})=>n.emit(a,{type:s.type,map:i,component:o,event:s})}}const E=new Map,B=Symbol("default");function le(e=B){let o=E.get(e);return o||(o=t.reactive({isLoaded:!1,isMounted:!1,language:void 0}),E.set(e,o)),o}function se(e,o,i=B){let n=E.get(i);return n||(n=t.reactive({isLoaded:!1,isMounted:!1,language:void 0}),E.set(i,n)),n.component=e,n.map=o.value,n.isLoaded=o.value?.loaded()||!1,n.isMounted=!1,n}const T=t.defineComponent({name:"MglMap",props:{width:{type:[Number,String],default:"100%"},height:{type:[Number,String],default:"100%"},attributionControl:{type:[Boolean,Object],default:()=>u.attributionControl},bearing:{type:Number,default:()=>u.bearing},bearingSnap:{type:Number,default:()=>u.bearingSnap},bounds:{type:[Array,Object],default:()=>u.bounds},boxZoom:{type:Boolean,default:()=>u.boxZoom},cancelPendingTileRequestsWhileZooming:{type:Boolean,default:()=>u.cancelPendingTileRequestsWhileZooming},canvasContextAttributes:{type:Object,default:()=>u.canvasContextAttributes},center:{type:[Array,Object],default:()=>u.center},centerClampedToGround:{type:Boolean,default:()=>u.centerClampedToGround},clickTolerance:{type:Number,default:()=>u.clickTolerance},collectResourceTiming:{type:Boolean,default:()=>u.collectResourceTiming},cooperativeGestures:{type:[Boolean,Object],default:()=>u.cooperativeGestures},crossSourceCollisions:{type:Boolean,default:()=>u.crossSourceCollisions},doubleClickZoom:{type:Boolean,default:()=>u.doubleClickZoom},dragPan:{type:Boolean,default:()=>u.dragPan},dragRotate:{type:Boolean,default:()=>u.dragRotate},elevation:{type:Number,default:()=>u.elevation},fadeDuration:{type:Number,default:()=>u.fadeDuration},fitBoundsOptions:{type:Object,default:()=>u.fitBoundsOptions},hash:{type:[Boolean,String],default:()=>u.hash},interactive:{type:Boolean,default:()=>u.interactive},keyboard:{type:Boolean,default:()=>u.keyboard},language:{type:String,default:()=>u.language||void 0},locale:{type:Object,default:()=>u.locale},localIdeographFontFamily:{type:String,default:()=>u.localIdeographFontFamily},logoPosition:{type:[String],default:()=>u.logoPosition},mapKey:{type:[String,Symbol]},maplibreLogo:{type:Boolean,default:()=>u.maplibreLogo},mapStyle:{type:[String,Object],default:()=>u.style},maxBounds:{type:[Array,Object],default:()=>u.maxBounds},maxCanvasSize:{type:Array,default:()=>u.maxCanvasSize},maxPitch:{type:Number,default:()=>u.maxPitch},maxTileCacheSize:{type:Number,default:()=>u.maxTileCacheSize},maxTileCacheZoomLevels:{type:Number,default:()=>u.maxTileCacheZoomLevels},maxZoom:{type:Number,default:()=>u.maxZoom},minPitch:{type:Number,default:()=>u.minPitch},minZoom:{type:Number,default:()=>u.minZoom},pitch:{type:Number,default:()=>u.pitch},pitchWithRotate:{type:Boolean,default:()=>u.pitchWithRotate},pixelRatio:{type:Number,default:()=>u.pixelRatio},refreshExpiredTiles:{type:Boolean,default:()=>u.refreshExpiredTiles},renderWorldCopies:{type:Boolean,default:()=>u.renderWorldCopies},roll:{type:Number,default:()=>u.roll},rollEnabled:{typed:Boolean,default:()=>u.rollEnabled},scrollZoom:{type:Boolean,default:()=>u.scrollZoom},touchPitch:{type:Boolean,default:()=>u.touchPitch},touchZoomRotate:{type:Boolean,default:()=>u.touchZoomRotate},trackResize:{type:Boolean,default:()=>u.trackResize},transformCameraUpdate:{type:Function,default:u.transformCameraUpdate},transformRequest:{type:Function,default:u.transformRequest},validateStyle:{type:Boolean,default:()=>u.validateStyle},zoom:{type:Number,default:()=>u.zoom},projection:{type:Object}},emits:["map:boxzoomcancel","map:boxzoomend","map:boxzoomstart","map:click","map:contextmenu","map:cooperativegestureprevented","map:data","map:dataabort","map:dataloading","map:dblclick","map:drag","map:dragend","map:dragstart","map:error","map:idle","map:load","map:mousedown","map:mousemove","map:mouseout","map:mouseover","map:mouseup","map:move","map:moveend","map:movestart","map:pitch","map:pitchend","map:pitchstart","map:projectiontransition","map:remove","map:render","map:resize","map:rotate","map:rotateend","map:rotatestart","map:sourcedata","map:sourcedataabort","map:sourcedataloading","map:styledata","map:styledataloading","map:styleimagemissing","map:terrain","map:tiledataloading","map:touchcancel","map:touchend","map:touchmove","map:touchstart","map:webglcontextlost","map:webglcontextrestored","map:wheel","map:zoom","map:zoomend","map:zoomstart"],slots:Object,setup(e,o){const i=t.markRaw(t.getCurrentInstance()),n=t.shallowRef(),a=t.shallowRef(),s=t.ref(!1),c=t.ref(!1),g=t.ref(!1),f=new Map,y=re(),p=se(i,a,e.mapKey);let b;t.provide(r.mapSymbol,a),t.provide(r.isLoadedSymbol,c),t.provide(r.isInitializedSymbol,s),t.provide(r.componentIdSymbol,i.uid),t.provide(r.sourceIdSymbol,""),t.provide(r.emitterSymbol,y),t.provide(r.fitBoundsOptionsSymbol,e.fitBoundsOptions),t.watch(()=>e.bearing,l=>l&&a.value?.setBearing(l)),t.watch(()=>e.bounds,l=>l&&a.value?.fitBounds(l,e.fitBoundsOptions?.useOnBoundsUpdate?e.fitBoundsOptions:void 0)),t.watch(()=>e.center,l=>l&&a.value?.setCenter(l)),t.watch(()=>e.maxBounds,l=>l&&a.value?.setMaxBounds(l)),t.watch(()=>e.maxPitch,l=>l&&a.value?.setMaxPitch(l)),t.watch(()=>e.maxZoom,l=>l&&a.value?.setMaxZoom(l)),t.watch(()=>e.minPitch,l=>l&&a.value?.setMinPitch(l)),t.watch(()=>e.minZoom,l=>l&&a.value?.setMinZoom(l)),t.watch(()=>e.pitch,l=>l&&a.value?.setPitch(l)),t.watch(()=>e.renderWorldCopies,l=>l&&a.value?.setRenderWorldCopies(l)),t.watch(()=>e.mapStyle,l=>l&&a.value?.setStyle(l)),t.watch(()=>e.transformRequest,l=>l&&a.value?.setTransformRequest(l)),t.watch(()=>e.zoom,l=>l&&a.value?.setZoom(l)),t.watch(()=>e.projection,l=>l&&a.value?.setProjection(l)),e.language&&(p.language=e.language),t.watch(()=>e.language,l=>{g.value&&a.value&&p.language!==(l||void 0)&&(x(a.value,l),p.language=l||void 0)}),t.watch(()=>p.language,l=>{g.value&&a.value&&x(a.value,l)});function O(){g.value=!0,e.projection&&a.value.setProjection(e.projection)}function S(){x(a.value,p.language)}function C(){p.isMounted=!0;const l=Object.keys(e).filter(v=>e[v]!==void 0&&R.MAP_OPTION_KEYS.indexOf(v)!==-1).reduce((v,A)=>(v[A==="mapStyle"?"style":A]=t.unref(e[A]),v),{container:n.value});if(a.value=t.markRaw(new P.Map(l)),p.map=a.value,s.value=!0,f.set("__load",()=>{c.value=!0,p.isLoaded=!0}),a.value.once("styledata",O),a.value.on("load",f.get("__load")),a.value.on("style.load",S),i.vnode.props){for(let v=0,A=R.MAP_EVENT_TYPES.length;v<A;v++)if(i.vnode.props["onMap:"+R.MAP_EVENT_TYPES[v]]){const N=R.createEventHandler(i,a.value,o,"map:"+R.MAP_EVENT_TYPES[v]);f.set(R.MAP_EVENT_TYPES[v],N),a.value.on(R.MAP_EVENT_TYPES[v],N)}}a.value.getCanvas().addEventListener("webglcontextlost",h)}async function d(){p.isMounted=!1,p.isLoaded=!1,c.value=!1,a.value&&(a.value.off("style.load",S),a.value.getCanvas().removeEventListener("webglcontextlost",h),a.value._controls.forEach(l=>{a.value.removeControl(l)}),s.value=!1,f.forEach((l,v)=>{a.value.off(v.startsWith("__")?v.substring(2):v,l)}),a.value.remove())}function h(){d(),t.nextTick(C)}return t.onMounted(()=>{C(),a.value&&(b=new ResizeObserver(r.debounce(a.value.resize.bind(a.value),100)),b.observe(n.value))}),t.onBeforeUnmount(()=>{b!==void 0&&(b.disconnect(),b=void 0),d()}),o.expose({map:a}),()=>t.h("div",{class:"mgl-container",style:{height:e.height,width:e.width}},[t.h("div",{ref:n,class:"mgl-wrapper"}),s.value&&o.slots.default?o.slots.default({}):void 0])}}),z=t.defineComponent({name:"MglAttributionControl",props:{position:{type:String,validator:e=>r.PositionValues.indexOf(e)!==-1},compact:Boolean,customAttribution:[String,Array]},setup(e){const o=t.inject(r.mapSymbol),i=t.inject(r.isInitializedSymbol),n=new P.AttributionControl({compact:e.compact,customAttribution:e.customAttribution});r.usePositionWatcher(()=>e.position,o,n),t.onBeforeUnmount(()=>i.value&&o.value.removeControl(n))},render(){}}),I=t.defineComponent({name:"MglFullscreenControl",props:{position:{type:String,default:r.Position.TOP_RIGHT,validator:e=>r.PositionValues.indexOf(e)!==-1},container:{type:Object,default:null}},setup(e){const o=t.inject(r.mapSymbol),i=t.inject(r.isInitializedSymbol),n=new P.FullscreenControl({container:e.container||void 0});function a(){t.nextTick(()=>o.value?.resize())}n.on("fullscreenstart",a),n.on("fullscreenend",a),r.usePositionWatcher(()=>e.position,o,n),t.onBeforeUnmount(()=>{n.off("fullscreenstart",a),n.off("fullscreenend",a),i.value&&o.value?.removeControl(n)})},render(){}});class ue{constructor(o="rgba(0,0,0,0.9)",i=4*window.devicePixelRatio,n="#7cf859",a="Monaco, Consolas, Courier, monospace",s=60*window.devicePixelRatio,c=90*window.devicePixelRatio,g=0,f=5*window.devicePixelRatio,y=100*window.devicePixelRatio){this.background=o,this.barWidth=i,this.color=n,this.font=a,this.graphHeight=s,this.graphWidth=c,this.graphTop=g,this.graphRight=f,this.width=y}frames=0;totalTime=0;totalFrames=0;time=null;map;container;readOutput;canvas;eventHandlers=new Map;getDefaultPosition(){return r.Position.TOP_RIGHT}onAdd(o){this.map=o;const i=this.container=document.createElement("div");return i.className="maplibregl-ctrl maplibregl-ctrl-fps",i.style.backgroundColor=this.background,i.style.borderRadius="6px",this.readOutput=document.createElement("div"),this.readOutput.style.color=this.color,this.readOutput.style.fontFamily=this.font,this.readOutput.style.padding="0 5px 5px",this.readOutput.style.fontSize="9px",this.readOutput.style.fontWeight="bold",this.readOutput.textContent="Waiting…",this.canvas=document.createElement("canvas"),this.canvas.className="maplibregl-ctrl-canvas",this.canvas.width=this.width,this.canvas.height=this.graphHeight,this.canvas.style.cssText=`width: ${this.width/window.devicePixelRatio}px; height: ${this.graphHeight/window.devicePixelRatio}px;`,i.appendChild(this.readOutput),i.appendChild(this.canvas),this.eventHandlers.set("movestart",this.onMoveStart.bind(this)),this.eventHandlers.set("moveend",this.onMoveEnd.bind(this)),this.map.on("movestart",this.eventHandlers.get("movestart")),this.map.on("moveend",this.eventHandlers.get("moveend")),this.container}onRemove(){this.map.off("movestart",this.eventHandlers.get("movestart")),this.map.off("moveend",this.eventHandlers.get("moveend")),this.eventHandlers.clear(),this.container.parentNode.removeChild(this.container),this.map=void 0}onMoveStart(){this.frames=0,this.time=performance.now(),this.eventHandlers.set("render",this.onRender.bind(this)),this.map.on("render",this.eventHandlers.get("render"))}onMoveEnd(){const o=performance.now();this.updateGraph(this.getFPS(o)),this.frames=0,this.time=null,this.map.off("render",this.eventHandlers.get("render"))}onRender(){if(this.time){this.frames++;const o=performance.now();o>=this.time+1e3&&(this.updateGraph(this.getFPS(o)),this.frames=0,this.time=performance.now())}}getFPS(o){return this.totalTime+=o-this.time,this.totalFrames+=this.frames,Math.round(1e3*this.frames/(o-this.time))||0}updateGraph(o){const i=this.canvas.getContext("2d"),n=Math.round(1e3*this.totalFrames/this.totalTime)||0,a=(this.graphHeight,this.barWidth);i.fillStyle=this.background,i.globalAlpha=1,i.fillRect(0,0,this.graphWidth,this.graphTop),i.fillStyle=this.color,this.readOutput.textContent=`${o} FPS (${n} Avg)`,i.drawImage(this.canvas,this.graphRight+a,this.graphTop,this.graphWidth-a,this.graphHeight,this.graphRight,this.graphTop,this.graphWidth-a,this.graphHeight),i.fillRect(this.graphRight+this.graphWidth-a,this.graphTop,a,this.graphHeight),i.fillStyle=this.background,i.globalAlpha=.75,i.fillRect(this.graphRight+this.graphWidth-a,this.graphTop,a,(1-o/100)*this.graphHeight)}}const _=t.defineComponent({name:"MglFrameRateControl",props:{position:{type:String,validator:e=>r.PositionValues.indexOf(e)!==-1},background:{type:String,default:"rgba(0,0,0,0.9)"},barWidth:{type:Number,default:4*window.devicePixelRatio},color:{type:String,default:"#7cf859"},font:{type:String,default:"Monaco, Consolas, Courier, monospace"},graphHeight:{type:Number,default:60*window.devicePixelRatio},graphWidth:{type:Number,default:90*window.devicePixelRatio},graphTop:{type:Number,default:0},graphRight:{type:Number,default:5*window.devicePixelRatio},width:{type:Number,default:100*window.devicePixelRatio}},setup(e){const o=t.inject(r.mapSymbol),i=t.inject(r.isInitializedSymbol),n=new ue(e.background,e.barWidth,e.color,e.font,e.graphHeight,e.graphWidth,e.graphTop,e.graphRight,e.width);r.usePositionWatcher(()=>e.position,o,n),t.onBeforeUnmount(()=>i.value&&o.value?.removeControl(n))},render(){}}),H=t.defineComponent({name:"MglGeolocationControl",props:{position:{type:String,default:r.Position.TOP_RIGHT,validator:e=>r.PositionValues.indexOf(e)!==-1},positionOptions:{type:Object,default:{enableHighAccuracy:!1,timeout:6e3}},fitBoundsOptions:{type:Object,default:{maxZoom:15}},trackUserLocation:{type:Boolean,default:!1},showAccuracyCircle:{type:Boolean,default:!0},showUserLocation:{type:Boolean,default:!0}},setup(e){const o=t.inject(r.mapSymbol),i=t.inject(r.isInitializedSymbol),n=new P.GeolocateControl({positionOptions:e.positionOptions,fitBoundsOptions:e.fitBoundsOptions,trackUserLocation:e.trackUserLocation,showAccuracyCircle:e.showAccuracyCircle,showUserLocation:e.showUserLocation});r.usePositionWatcher(()=>e.position,o,n),t.onBeforeUnmount(()=>i.value&&o.value?.removeControl(n))},render(){}}),V=t.defineComponent({name:"MglNavigationControl",props:{position:{type:String,default:r.Position.TOP_RIGHT,validator:e=>r.PositionValues.indexOf(e)!==-1},showCompass:{type:Boolean,default:!0},showZoom:{type:Boolean,default:!0},visualizePitch:Boolean},setup(e){const o=t.inject(r.mapSymbol),i=t.inject(r.isInitializedSymbol),n=new P.NavigationControl({showCompass:e.showCompass,showZoom:e.showZoom,visualizePitch:e.visualizePitch});r.usePositionWatcher(()=>e.position,o,n),t.onBeforeUnmount(()=>i.value&&o.value?.removeControl(n))},render(){}});var k=(e=>(e.IMPERIAL="imperial",e.METRIC="metric",e.NAUTICAL="nautical",e))(k||{});const ce=Object.values(k),F=t.defineComponent({name:"MglScaleControl",props:{position:{type:String,validator:e=>r.PositionValues.indexOf(e)!==-1},maxWidth:{type:Number,default:100},unit:{type:String,default:"metric",validator:e=>ce.indexOf(e)!==-1}},setup(e){const o=t.inject(r.mapSymbol),i=t.inject(r.isInitializedSymbol),n=new P.ScaleControl({maxWidth:e.maxWidth,unit:e.unit});r.usePositionWatcher(()=>e.position,o,n),t.onBeforeUnmount(()=>i.value&&o.value?.removeControl(n))},render(){}});function j(e){return e&&!!e.stopPropagation}const D=t.defineComponent({name:"MglStyleSwitchControl",props:{position:{type:String,validator:e=>r.PositionValues.indexOf(e)!==-1},mapStyles:{type:Array,required:!0,default:[]},modelValue:{type:Object},isOpen:{type:Boolean,default:void 0}},slots:Object,emits:["update:modelValue","update:isOpen"],setup(e,{emit:o,slots:i}){const n=t.inject(r.mapSymbol),a=t.inject(r.isInitializedSymbol),s=t.inject(r.isLoadedSymbol),c=t.inject(r.emitterSymbol),g=t.ref(!1),f=t.ref(e.isOpen===void 0?!1:e.isOpen),y=t.shallowRef(e.modelValue===void 0?e.mapStyles.length?e.mapStyles[0]:void 0:e.modelValue),p=new r.CustomControl(g,!1),b=C.bind(null,!1);function O(){const d=n.value.getStyle().name;for(let h=0,l=e.mapStyles.length;h<l;h++)if(e.mapStyles[h].name===d){S(e.mapStyles[h]);break}}t.watch(s,d=>{d&&O()},{immediate:!0}),n.value.on("style.load",O),document.addEventListener("click",b),r.usePositionWatcher(()=>e.position,n,p),e.modelValue!==void 0&&t.watch(()=>e.modelValue,d=>{d!==void 0&&(y.value=d)}),e.isOpen!==void 0&&t.watch(()=>e.isOpen,d=>{d!==void 0&&(f.value=d)}),t.onBeforeUnmount(()=>{a.value&&(n.value.removeControl(p),n.value.off("style.load",O)),document.removeEventListener("click",b)});function S(d){y.value?.name!==d.name&&(c.emit("styleSwitched",d),n.value.setStyle(d.style,{diff:!1}),e.modelValue===void 0&&(y.value=d),o("update:modelValue",d),C(!1))}function C(d,h){j(h)?h.stopPropagation():j(d)&&d.stopPropagation(),!(e.isOpen!==void 0&&e.isOpen===d||f.value===d)&&(e.isOpen===void 0?(f.value=typeof d=="boolean"?d:!f.value,o("update:isOpen",f.value)):o("update:isOpen",typeof d=="boolean"?d:!e.isOpen))}return()=>{if(!g.value)return t.createCommentVNode("style-switch-control");const d={isOpen:f,toggleOpen:C,setStyle:S,mapStyles:e.mapStyles,currentStyle:y};return t.h(t.Teleport,{to:p.container},i.default?i.default(d):[i.button?i.button(d):t.h(r.MglButton,{type:r.ButtonType.MDI,path:"M12,18.54L19.37,12.8L21,14.07L12,21.07L3,14.07L4.62,12.81L12,18.54M12,16L3,9L12,2L21,9L12,16M12,4.53L6.26,9L12,13.47L17.74,9L12,4.53Z",class:["maplibregl-ctrl-icon maplibregl-style-switch",f.value?"is-open":""],onClick:C.bind(null,!0)}),i.styleList?i.styleList(d):t.h("div",{class:["maplibregl-style-list",f.value?"is-open":""]},e.mapStyles.map(h=>h.icon?t.h(r.MglButton,{type:r.ButtonType.MDI,path:h.icon.path,class:y.value?.name===h.name?"is-active":"",onClick:()=>S(h)},t.createTextVNode(h.label)):t.h("button",{type:"button",class:y.value?.name===h.name?"is-active":"",onClick:()=>S(h)},t.createTextVNode(h.label))))])}},template:`
		<slot>
			<slot name="button"></slot>
			<slot name="styleList"></slot>
		</slot>
	`}),W=t.defineComponent({name:"MglMarker",props:{coordinates:{type:[Object,Array],required:!0},offset:[Object,Array],anchor:String,color:String,clickTolerance:Number,rotation:Number,rotationAlignment:String,pitchAlignment:String,scale:Number},setup(e){const o=t.inject(r.mapSymbol),i=Object.keys(e).filter(a=>e[a]!==void 0&&R.MARKER_OPTION_KEYS.indexOf(a)!==-1).reduce((a,s)=>(a[s]=t.unref(e[s]),a),{}),n=new P.Marker(i);return n.setLngLat(e.coordinates).addTo(o.value),t.watch(()=>e.coordinates,a=>n.setLngLat(a)),t.watch(()=>e.offset,a=>n.setOffset(a||[0,0])),t.watch(()=>e.pitchAlignment,a=>n.setPitchAlignment(a||"auto")),t.watch(()=>e.rotationAlignment,a=>n.setRotationAlignment(a||"auto")),t.onBeforeUnmount(n.remove.bind(n)),{marker:n}},render(){}});class L{static REFS=new Map;static genSourceOpts(o,i,n){return Object.keys(i).filter(a=>i[a]!==void 0&&n.indexOf(a)!==-1).reduce((a,s)=>(a[s]=t.unref(i[s]),a),{type:o})}static getSourceRef(o,i){const n=typeof i=="string",a=String(o)+(n?i:"");let s=L.REFS.get(a);return s||(s=t.ref(n?null:void 0),L.REFS.set(a,s)),s}}class de{unmountHandlers=new Map;registerUnmountHandler(o,i){this.unmountHandlers.set(o,i)}unregisterUnmountHandler(o){this.unmountHandlers.delete(o)}unmount(){this.unmountHandlers.forEach(o=>o())}}function w(e,o,i){const n=t.inject(r.mapSymbol),a=t.inject(r.isLoadedSymbol),s=t.inject(r.emitterSymbol),c=t.inject(r.componentIdSymbol),g=L.getSourceRef(c,e.sourceId),f=new de;t.provide(r.sourceIdSymbol,e.sourceId),t.provide(r.sourceLayerRegistry,f);function y(){a.value&&(n.value.addSource(e.sourceId,L.genSourceOpts(o,e,i)),g.value=n.value.getSource(e.sourceId))}function p(){g.value=null}return t.watch(a,y,{immediate:!0}),n.value.on("style.load",y),s.on("styleSwitched",p),t.onBeforeUnmount(()=>{a.value&&(f.unmount(),n.value.removeSource(e.sourceId)),n.value.off("style.load",y),s.off("styleSwitched",p)}),g}const me=r.AllSourceOptions({animate:void 0,canvas:void 0,coordinates:void 0}),Z=t.defineComponent({name:"MglCanvasSource",props:{sourceId:{type:String,required:!0},coordinates:Array,animate:Boolean,canvas:[Object,String]},slots:Object,setup(e,{slots:o}){const i=w(e,"canvas",me);return t.watch(t.isRef(e.coordinates)?e.coordinates:()=>e.coordinates,n=>{i.value?.setCoordinates(n)},{immediate:!0}),()=>[t.createCommentVNode("Canvas Source"),i.value&&o.default?o.default({}):void 0]}}),ge=r.AllSourceOptions({data:void 0,maxzoom:void 0,attribution:void 0,buffer:void 0,tolerance:void 0,cluster:void 0,clusterRadius:void 0,clusterMaxZoom:void 0,clusterMinPoints:void 0,clusterProperties:void 0,lineMetrics:void 0,generateId:void 0,promoteId:void 0,filter:void 0}),U=t.defineComponent({name:"MglGeoJsonSource",props:{sourceId:{type:String,required:!0},data:[Object,String],maxzoom:Number,attribution:String,buffer:Number,tolerance:Number,cluster:[Number,Boolean],clusterRadius:Number,clusterMaxZoom:Number,clusterMinPoints:Number,clusterProperties:Object,lineMetrics:Boolean,generateId:Boolean,promoteId:[Object,String],filter:[Array,String,Object]},slots:Object,setup(e,{slots:o}){const i=w(e,"geojson",ge);return t.watch(t.isRef(e.data)?e.data:()=>e.data,n=>{i.value?.setData(n||{type:"FeatureCollection",features:[]})},{immediate:!0}),()=>[t.createCommentVNode("GeoJSON Source"),i.value&&o.default?o.default({}):void 0]}}),fe=r.AllSourceOptions({url:void 0,coordinates:void 0}),G=t.defineComponent({name:"MglImageSource",props:{sourceId:{type:String,required:!0},url:String,coordinates:Array},slots:Object,setup(e,{slots:o}){const i=w(e,"image",fe);return t.watch(t.isRef(e.coordinates)?e.coordinates:()=>e.coordinates,n=>{i.value?.setCoordinates(n)},{immediate:!0}),()=>[t.createCommentVNode("Image Source"),i.value&&o.default?o.default({}):void 0]}}),pe=r.AllSourceOptions({url:void 0,tiles:void 0,bounds:void 0,minzoom:void 0,maxzoom:void 0,tileSize:void 0,scheme:void 0,attribution:void 0,volatile:void 0}),q=t.defineComponent({name:"MglRasterSource",props:{sourceId:{type:String,required:!0},url:String,tiles:Array,bounds:Array,minzoom:Number,maxzoom:Number,tileSize:Number,scheme:String,attribution:String,volatile:Boolean},slots:Object,setup(e,{slots:o}){const i=w(e,"raster",pe);return()=>[t.createCommentVNode("Raster Source"),i.value&&o.default?o.default({}):void 0]}}),he=r.AllSourceOptions({url:void 0,tiles:void 0,bounds:void 0,minzoom:void 0,maxzoom:void 0,tileSize:void 0,attribution:void 0,encoding:void 0,volatile:void 0,redFactor:void 0,blueFactor:void 0,greenFactor:void 0,baseShift:void 0}),Y=t.defineComponent({name:"MglRasterDemSource",props:{sourceId:{type:String,required:!0},url:String,tiles:Array,bounds:Array,minzoom:Number,maxzoom:Number,tileSize:Number,attribution:String,encoding:String,volatile:Boolean,redFactor:Number,blueFactor:Number,greenFactor:Number,baseShift:Number},slots:Object,setup(e,{slots:o}){const i=w(e,"raster-dem",he);return()=>[t.createCommentVNode("RasterDem Source"),i.value&&o.default?o.default({}):void 0]}}),ye=r.AllSourceOptions({url:void 0,tiles:void 0,bounds:void 0,scheme:void 0,minzoom:void 0,maxzoom:void 0,attribution:void 0,promoteId:void 0,volatile:void 0,encoding:void 0}),$=t.defineComponent({name:"MglVectorSource",props:{sourceId:{type:String,required:!0},url:String,tiles:Array,bounds:Array,scheme:String,minzoom:Number,maxzoom:Number,attribution:String,promoteId:[Object,String],volatile:Boolean,encoding:String},slots:Object,setup(e,{slots:o}){const i=w(e,"vector",ye);return t.watch(t.isRef(e.tiles)?e.tiles:()=>e.tiles,n=>{i.value?.setTiles(n||[])},{immediate:!0}),t.watch(t.isRef(e.url)?e.url:()=>e.url,n=>{i.value?.setUrl(n||"")},{immediate:!0}),()=>[t.createCommentVNode("Vector Source"),i.value&&o.default?o.default({}):void 0]}}),ve=r.AllSourceOptions({urls:void 0,coordinates:void 0}),K=t.defineComponent({name:"MglVideoSource",props:{sourceId:{type:String,required:!0},urls:Array,coordinates:Array},slots:Object,setup(e,{slots:o}){const i=w(e,"video",ve);return t.watch(t.isRef(e.coordinates)?e.coordinates:()=>e.coordinates,n=>{i.value?.setCoordinates(n)},{immediate:!0}),()=>[t.createCommentVNode("Video Source"),i.value&&o.default?o.default({}):void 0]}});class m{static SOURCE_OPTS=["metadata","ref","source","sourceLayer","minzoom","maxzoom","interactive","filter","layout","paint"];static LAYER_EVENTS=["click","dblclick","mousedown","mouseup","mousemove","mouseenter","mouseleave","mouseover","mouseout","contextmenu","touchstart","touchend","touchcancel"];static SHARED={props:{layerId:{type:String,required:!0},source:[String,Object],metadata:[Object,Array,String,Number],sourceLayer:String,minzoom:Number,maxzoom:Number,interactive:Boolean,before:String},emits:["click","dblclick","mousedown","mouseup","mousemove","mouseenter","mouseleave","mouseover","mouseout","contextmenu","touchstart","touchend","touchcancel"]};static genLayerOpts(o,i,n,a){return Object.keys(n).filter(s=>n[s]!==void 0&&m.SOURCE_OPTS.indexOf(s)!==-1).reduce((s,c)=>(s[c==="sourceLayer"?"source-layer":c]=t.unref(n[c]),s),{type:i,source:n.source||a,id:o})}static registerLayerEvents(o,i,n){if(n.props)for(let a=0,s=m.LAYER_EVENTS.length;a<s;a++){const c="on"+m.LAYER_EVENTS[a].charAt(0).toUpperCase()+m.LAYER_EVENTS[a].substr(1);n.props[c]&&o.on(m.LAYER_EVENTS[a],i,n.props[c])}}static unregisterLayerEvents(o,i,n){if(n.props)for(let a=0,s=m.LAYER_EVENTS.length;a<s;a++){const c="on"+m.LAYER_EVENTS[a].charAt(0).toUpperCase()+m.LAYER_EVENTS[a].substr(1);n.props[c]&&o.off(m.LAYER_EVENTS[a],i,n.props[c])}}}function M(e,o,i,n,a){const s=t.inject(r.sourceIdSymbol),c=o||s;c||t.warn(`Layer (${i}): layer must be used inside source tag or source prop must be set`);const g=t.inject(r.mapSymbol),f=t.inject(r.isLoadedSymbol),y=t.inject(r.componentIdSymbol),p=L.getSourceRef(y,c),b=t.inject(r.sourceLayerRegistry);function O(){f.value&&(a&&m.unregisterLayerEvents(g.value,i,a.vnode),g.value.getLayer(i)&&g.value.removeLayer(i))}return b.registerUnmountHandler(i,O),t.onBeforeUnmount(()=>{b.unregisterUnmountHandler(i),O()}),t.watch([f,p],([S,C])=>{S&&(C||C===void 0)&&(g.value.addLayer(m.genLayerOpts(i,e,n,c),n.before||void 0),a&&m.registerLayerEvents(g.value,n.layerId,a.vnode))},{immediate:!0}),{map:g,isLoaded:f,source:p}}const J=t.defineComponent({name:"MglBackgroundLayer",props:{...m.SHARED.props,layout:Object,paint:Object},emits:[...m.SHARED.emits],setup(e){return M("background",e.source,e.layerId,e),()=>t.createCommentVNode("Background Layer")}}),Q=t.defineComponent({name:"MglCircleLayer",props:{...m.SHARED.props,layout:Object,paint:Object,filter:[Boolean,Array]},emits:[...m.SHARED.emits],setup(e){const o=t.getCurrentInstance();return M("circle",e.source,e.layerId,e,o),()=>t.createCommentVNode("Circle Layer")}}),X=t.defineComponent({name:"MglFillLayer",props:{...m.SHARED.props,layout:Object,paint:Object,filter:[Boolean,Array]},emits:[...m.SHARED.emits],setup(e){const o=t.getCurrentInstance();return M("fill",e.source,e.layerId,e,o),()=>t.createCommentVNode("Fill Layer")}}),ee=t.defineComponent({name:"MglFillExtrusionLayer",props:{...m.SHARED.props,layout:Object,paint:Object,filter:[Boolean,Array]},emits:[...m.SHARED.emits],setup(e){const o=t.getCurrentInstance();return M("fill-extrusion",e.source,e.layerId,e,o),()=>t.createCommentVNode("Fill Extrusion Layer")}}),te=t.defineComponent({name:"MglHeatmapLayer",props:{...m.SHARED.props,layout:Object,paint:Object,filter:[Boolean,Array]},emits:[...m.SHARED.emits],setup(e){const o=t.getCurrentInstance();return M("heatmap",e.source,e.layerId,e,o),()=>t.createCommentVNode("Heatmap Layer")}}),oe=t.defineComponent({name:"MglHillshadeLayer",props:{...m.SHARED.props,layout:Object,paint:Object,filter:[Boolean,Array]},emits:[...m.SHARED.emits],setup(e){const o=t.getCurrentInstance();return M("hillshade",e.source,e.layerId,e,o),()=>t.createCommentVNode("Hillshade Layer")}}),ae=t.defineComponent({name:"MglLineLayer",props:{...m.SHARED.props,layout:Object,paint:Object,filter:[Boolean,Array]},emits:[...m.SHARED.emits],setup(e){const o=t.getCurrentInstance();return M("line",e.source,e.layerId,e,o),()=>t.createCommentVNode("Line Layer")}}),ne=t.defineComponent({name:"MglRasterLayer",props:{...m.SHARED.props,layout:Object,paint:Object,filter:[Boolean,Array]},emits:[...m.SHARED.emits],setup(e){const o=t.getCurrentInstance();return M("raster",e.source,e.layerId,e,o),()=>t.createCommentVNode("Raster Layer")}}),ie=t.defineComponent({name:"MglSymbolLayer",props:{...m.SHARED.props,layout:Object,paint:Object,filter:[Boolean,Array]},emits:[...m.SHARED.emits],setup(e){const o=t.getCurrentInstance();return M("symbol",e.source,e.layerId,e,o),()=>t.createCommentVNode("Symbol Layer")}}),be=Object.freeze(Object.defineProperty({__proto__:null,MglAttributionControl:z,MglBackgroundLayer:J,MglButton:r.MglButton,MglCanvasSource:Z,MglCircleLayer:Q,MglCustomControl:r.MglCustomControl,MglFillExtrusionLayer:ee,MglFillLayer:X,MglFrameRateControl:_,MglFullscreenControl:I,MglGeoJsonSource:U,MglGeolocationControl:H,MglHeatmapLayer:te,MglHillshadeLayer:oe,MglImageSource:G,MglLineLayer:ae,MglMap:T,MglMarker:W,MglNavigationControl:V,MglRasterDemSource:Y,MglRasterLayer:ne,MglRasterSource:q,MglScaleControl:F,MglStyleSwitchControl:D,MglSymbolLayer:ie,MglVectorSource:$,MglVideoSource:K,Position:r.Position},Symbol.toStringTag,{value:"Module"})),Se=function(o){Object.entries(be).forEach(([i,n])=>{o.component(i,n)})};exports.AllOptions=r.AllOptions;exports.AllSourceOptions=r.AllSourceOptions;exports.CircleMode=r.CircleMode;exports.CircleStaticMode=r.CircleStaticMode;exports.DrawMode=r.DrawMode;exports.DrawPlugin=r.DrawPlugin;exports.MglButton=r.MglButton;exports.MglCustomControl=r.MglCustomControl;exports.MglDrawControl=r.draw_control;exports.PolygonMode=r.PolygonMode;exports.Position=r.Position;exports.componentIdSymbol=r.componentIdSymbol;exports.emitterSymbol=r.emitterSymbol;exports.fitBoundsOptionsSymbol=r.fitBoundsOptionsSymbol;exports.isInitializedSymbol=r.isInitializedSymbol;exports.isLoadedSymbol=r.isLoadedSymbol;exports.mapSymbol=r.mapSymbol;exports.sourceIdSymbol=r.sourceIdSymbol;exports.sourceLayerRegistry=r.sourceLayerRegistry;exports.usePositionWatcher=r.usePositionWatcher;exports.MglAttributionControl=z;exports.MglBackgroundLayer=J;exports.MglCanvasSource=Z;exports.MglCircleLayer=Q;exports.MglDefaults=u;exports.MglFillExtrusionLayer=ee;exports.MglFillLayer=X;exports.MglFrameRateControl=_;exports.MglFullscreenControl=I;exports.MglGeoJsonSource=U;exports.MglGeolocationControl=H;exports.MglHeatmapLayer=te;exports.MglHillshadeLayer=oe;exports.MglImageSource=G;exports.MglLineLayer=ae;exports.MglMap=T;exports.MglMarker=W;exports.MglNavigationControl=V;exports.MglRasterDemSource=Y;exports.MglRasterLayer=ne;exports.MglRasterSource=q;exports.MglScaleControl=F;exports.MglStyleSwitchControl=D;exports.MglSymbolLayer=ie;exports.MglVectorSource=$;exports.MglVideoSource=K;exports.default=Se;exports.useDisposableLayer=M;exports.useMap=le;exports.useSource=w;
//# sourceMappingURL=vue-maplibre-gl.cjs.map