solid-map-gl 1.1.26 → 1.2.0

package/dist/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/events.ts","../../src/components/MapGL/index.tsx","../../src/components/Source/index.tsx","../../src/components/Layer/index.tsx","../../src/components/Fog/index.tsx","../../src/components/Sky/index.tsx","../../src/components/Terrain/index.tsx","../../src/components/Control/index.tsx","../../src/components/Marker/index.tsx","../../src/components/Popup/index.tsx","../../src/components/Image/index.tsx"],"sourcesContent":["const mapEvents: string[] = [\n  'onMouseDown',\n  'onMouseUp',\n  'onMouseOver',\n  'onMouseOut',\n  'onMouseMove',\n  'onMouseEnter',\n  'onMouseLeave',\n  'onPreClick',\n  'onClick',\n  'onDblClick',\n  'onContextMenu',\n  'onTouchStart',\n  'onTouchEnd',\n  'onTouchCancel',\n  'onWheel',\n  'onResize',\n  'onRemove',\n  'onTouchMove',\n  'onMoveStart',\n  'onMove',\n  'onMoveEnd',\n  'onDragStart',\n  'onDrag',\n  'onDragEnd',\n  'onZoomStart',\n  'onZoom',\n  'onZoomEnd',\n  'onRotateStart',\n  'onRotate',\n  'onRotatEnd',\n  'onPitchStart',\n  'onPitch',\n  'onPitchEnd',\n  'onBoxZoomStart',\n  'onBoxZoomEnd',\n  'onBoxZoomCancel',\n  'onWebglContextLost',\n  'onWebglContextRestored',\n  'onLoad',\n  'onRender',\n  'onIdle',\n  'onError',\n  'onData',\n  'onStyleData',\n  'onSourceData',\n  'onDataLoading',\n  'onStyleDataLoading',\n  'onSourceDataLoading',\n  'onStyleImageMissing',\n]\n\nconst layerEvents: string[] = [\n  'onMouseDown',\n  'onMouseUp',\n  'onMouseOver',\n  'onMouseOut',\n  'onMouseMove',\n  'onMouseEnter',\n  'onMouseLeave',\n  'onClick',\n  'onDblClick',\n  'onContextMenu',\n  'onTouchStart',\n  'onTouchEnd',\n  'onTouchCancel',\n]\n\nexport { mapEvents, layerEvents }\n","import {\n  createSignal,\n  createEffect,\n  onMount,\n  onCleanup,\n  createContext,\n  useContext,\n  Component,\n  useTransition,\n  createUniqueId,\n  untrack,\n} from 'solid-js'\nimport { mapEvents } from '../../events'\nimport mapboxgl from 'mapbox-gl'\nimport 'mapbox-gl/dist/mapbox-gl.css'\nimport type { MapboxMap, MapboxOptions } from 'mapbox-gl/src/ui/map'\nimport type { LngLatLike } from 'mapbox-gl/src/geo/lng_lat.js'\nimport type { LngLatBounds } from 'mapbox-gl/src/geo/lng_lat_bounds.js'\nimport type { PaddingOptions } from 'mapbox-gl/src/geo/edge_insets.js'\nimport type { JSX } from 'solid-js'\n\nexport type Viewport = {\n  id?: string\n  center?: LngLatLike\n  bounds?: LngLatBounds\n  zoom?: number\n  pitch?: number\n  bearing?: number\n  padding?: PaddingOptions\n}\n\nconst [pending, start] = useTransition()\nconst [transitionType, setTransitionType] = createSignal('flyTo')\n\nconst MapContext = createContext<MapboxMap>()\nconst useMap = () => useContext(MapContext)\n\nconst MapGL: Component<{\n  id?: string\n  style?: JSX.CSSProperties\n  class?: string\n  classList?: {\n    [k: string]: boolean | undefined\n  }\n  viewport?: Viewport\n  options?: MapboxOptions\n  children?: Element | Element[]\n  triggerResize?: boolean\n  transitionType?: 'flyTo' | 'easeTo' | 'jumpTo'\n  onViewportChange?: (viewport: Viewport) => void\n  showTileBoundaries?: boolean\n  showTerrainWireframe?: boolean\n  showPadding?: boolean\n  showCollisionBoxes?: boolean\n  showOverdrawInspector?: boolean\n  repaint?: boolean\n  cursorStyle?: string\n  ref?: HTMLDivElement\n}> = props => {\n  let map: MapboxMap\n  let mapRef: HTMLDivElement\n  props.id = props.id || createUniqueId()\n\n  onMount(() => {\n    map = new mapboxgl.Map({\n      ...props.options,\n      container: mapRef,\n      interactive: !!props.onViewportChange,\n      bounds: props.viewport.bounds,\n      center: props.viewport.center,\n      zoom: props.viewport.zoom || null,\n      pitch: props.viewport.pitch || null,\n      bearing: props.viewport.bearing || null,\n      fitBoundsOptions: { padding: props.viewport.padding },\n    } as MapboxOptions)\n  })\n\n  onCleanup(() => map.remove())\n\n  // Hook up events\n  createEffect(() =>\n    mapEvents.forEach(item => {\n      if (props[item]) {\n        const event = item.slice(2).toLowerCase()\n        const callback = e => props[item](e)\n        map.on(event, callback)\n        onCleanup(() => map.off(event, callback))\n      }\n    })\n  )\n\n  // Update debug features\n  createEffect(() => (map.showTileBoundaries = props.showTileBoundaries))\n  createEffect(() => (map.showTerrainWireframe = props.showTerrainWireframe))\n  createEffect(() => (map.showPadding = props.showPadding))\n  createEffect(() => (map.showCollisionBoxes = props.showCollisionBoxes))\n  createEffect(() => (map.showOverdrawInspector = props.showOverdrawInspector))\n  createEffect(() => (map.getCanvas().style.cursor = props.cursorStyle))\n\n  // Update map style\n  createEffect(prev => {\n    prev !== props.options.style && map.setStyle(props.options.style)\n  }, props.options.style)\n\n  // Update projection\n  createEffect(prev => {\n    prev !== props.options.projection &&\n      map.setProjection(props.options.projection)\n  }, props.options.projection)\n\n  createEffect(() => setTransitionType(props.transitionType))\n\n  // Hook up viewport events\n  createEffect(() => {\n    const viewport = {\n      id: null,\n      center: map.getCenter(),\n      zoom: map.getZoom(),\n      pitch: map.getPitch(),\n      bearing: map.getBearing(),\n      padding: props.viewport.padding,\n      bounds: props.viewport.bounds,\n    }\n\n    const callMove = event => {\n      if (event.originalEvent)\n        props.onViewportChange({ ...viewport, id: props.id })\n      setTransitionType('jumpTo')\n    }\n\n    const callEnd = event => {\n      if (event.originalEvent) props.onViewportChange(viewport)\n      setTransitionType(props.transitionType)\n    }\n\n    map.on('move', callMove).on('moveend', callEnd)\n    onCleanup(() => map.off('move', callMove).off('moveend', callEnd))\n  })\n\n  // Update boundaries\n  createEffect(prev => {\n    if (props.viewport.bounds != prev)\n      props.onViewportChange({\n        ...props.viewport,\n        ...map.cameraForBounds(props.viewport.bounds, {\n          padding: props.viewport.padding,\n        }),\n      })\n    return props.viewport.bounds\n  }, props.viewport.bounds)\n\n  // Update Viewport\n  createEffect(() => {\n    if (props.id === props.viewport.id) return\n    const viewport = { ...props.viewport, padding: props.viewport.padding || 0 }\n    switch (untrack(transitionType)) {\n      case 'easeTo':\n        map.stop().easeTo(viewport)\n      case 'jumpTo':\n        map.stop().jumpTo(viewport)\n      default:\n        map.stop().flyTo(viewport)\n    }\n  })\n\n  let index = 0\n\n  createEffect(() => {\n    if (props.triggerResize) {\n      index = 0\n      window.requestAnimationFrame(function loop() {\n        if (index < 15) {\n          index++\n          window.requestAnimationFrame(loop)\n          start(() => map.resize())\n        }\n      })\n    }\n  })\n\n  return (\n    <MapContext.Provider value={() => map}>\n      {props.children}\n      <section\n        ref={mapRef}\n        class={props.class || ''}\n        classList={props.classList}\n        style={{ height: '100%', width: '100%', ...props.style }}></section>\n    </MapContext.Provider>\n  )\n}\n\nexport { MapGL as default, useMap }\n","import {\n  onMount,\n  onCleanup,\n  createEffect,\n  Component,\n  createContext,\n  useContext,\n  createUniqueId,\n} from 'solid-js'\nimport { useMap } from '../MapGL'\nimport type MapboxMap from 'mapbox-gl/src/ui/map'\nimport type {\n  Source,\n  SourceSpecification,\n} from 'mapbox-gl/src/style-spec/types.js'\n\nconst SourceContext = createContext<Source>()\n\nconst useSource = (): Source => useContext(SourceContext)\n\nconst SourceComponent: Component<{\n  id?: string\n  source: SourceSpecification\n}> = props => {\n  const map: MapboxMap = useMap()\n  props.id = props.id || createUniqueId()\n  // Add Source\n  onMount(async () => {\n    !map().isStyleLoaded() && (await map().once('styledata'))\n    !map().getSource(props.id) && map().addSource(props.id, props.source)\n  })\n\n  // Remove Source\n  onCleanup(() => {\n    map()\n      .getStyle()\n      .layers.forEach(\n        layer => layer.source === props.id && map().removeLayer(layer.id)\n      )\n    map().getSource(props.id) && map().removeSource(props.id)\n  })\n\n  // Update GeoJSON Data\n  createEffect(async () => {\n    if (props.source.type !== 'geojson' && !props.source.data) return\n\n    map().style &&\n      map().getSource(props.id) &&\n      map().getSource(props.id).setData(props.source.data)\n  })\n\n  return (\n    <SourceContext.Provider value={{ id: props.id }}>\n      {props.children}\n    </SourceContext.Provider>\n  )\n}\n\nexport { SourceComponent as default, useSource }\n","import {\n  onMount,\n  onCleanup,\n  createEffect,\n  Component,\n  createUniqueId,\n} from 'solid-js'\nimport { useMap } from '../MapGL'\nimport { useSource } from '../Source'\nimport { layerEvents } from '../../events'\nimport type MapboxMap from 'mapbox-gl/src/ui/map'\nimport type {\n  FilterSpecification,\n  StyleSpecification,\n  SourceSpecification,\n} from 'mapbox-gl/src/style-spec/types.js'\nimport type { CustomLayerInterface } from 'mapbox-gl/src/style/style_layer/custom_style_layer'\n\nconst diff = (\n  newProps: StyleSpecification = {},\n  prevProps: StyleSpecification = {}\n) => {\n  const keys = new Set([...Object.keys(newProps), ...Object.keys(prevProps)])\n  return [...keys].reduce((acc, key: string) => {\n    const value = newProps[key]\n    if (value !== prevProps[key]) {\n      acc.push([key, value])\n    }\n    return acc\n  }, [])\n}\n\nconst Layer: Component<{\n  id?: string\n  style?: StyleSpecification\n  layer?: CustomLayerInterface\n  filter?: FilterSpecification\n  visible?: boolean\n  sourceId?: string\n  beforeType?:\n    | 'background'\n    | 'fill'\n    | 'line'\n    | 'symbol'\n    | 'raster'\n    | 'circle'\n    | 'fill-extrusion'\n    | 'heatmap'\n    | 'hillshade'\n    | 'sky'\n  beforeId?: string\n  featureState?: { id: number | string; state: object }\n}> = props => {\n  const map: MapboxMap = useMap()\n  const source: SourceSpecification = useSource()\n  props.id = props.id || createUniqueId()\n  // Add Layer\n  onMount(async () => {\n    !map().isStyleLoaded() && (await map().once('styledata'))\n\n    if (map().getLayer(props.id)) return\n\n    map().addLayer(\n      props.layer || {\n        ...props.style,\n        id: props.id,\n        source: source.id,\n      },\n      props.beforeType\n        ? map()\n            .getStyle()\n            .layers.find(l => l.type === props.beforeType).id\n        : props.beforeId\n    )\n  })\n\n  onCleanup(() => map().removeLayer(props.id))\n\n  // Hook up events\n  createEffect(() =>\n    layerEvents.forEach(item => {\n      if (props[item]) {\n        const event = item.slice(2).toLowerCase()\n        const callback = e => props[item](e)\n        map().on(event, props.id, callback)\n        onCleanup(() => map().off(event, props.id, callback))\n      }\n    })\n  )\n\n  // Update Style\n  createEffect((prev: StyleSpecification) => {\n    if (\n      !props.style ||\n      !map().style ||\n      !map().getSource(source.id) ||\n      !map().getLayer(props.id)\n    )\n      return\n\n    if (props.style.layout !== prev?.layout)\n      diff(props.style.layout, prev?.layout).forEach(([key, value]) =>\n        map().setLayoutProperty(props.id, key, value, { validate: false })\n      )\n\n    if (props.style.paint !== prev?.paint)\n      diff(props.style.paint, prev?.paint).forEach(([key, value]) =>\n        map().setPaintProperty(props.id, key, value, { validate: false })\n      )\n\n    if (\n      props.style.minzoom !== prev?.minzoom ||\n      props.style.maxzoom !== prev?.maxzoom\n    )\n      map().setLayerZoomRange(\n        props.id,\n        props.style.minzoom,\n        props.style.maxzoom\n      )\n\n    if (props.style.filter !== prev?.filter)\n      map().setFilter(props.id, props.style.filter, { validate: false })\n\n    return props.style\n  }, props.style)\n\n  // Update Visibility\n  createEffect((prev: boolean) => {\n    if (\n      props.visible === undefined ||\n      props.visible === prev ||\n      !map().getSource(source.id) ||\n      !map().getLayer(props.id)\n    )\n      return\n\n    map().setLayoutProperty(\n      props.id,\n      'visibility',\n      props.visible ? 'visible' : 'none',\n      { validate: false }\n    )\n    return props.visible\n  }, props.visible)\n\n  // Update Filter\n  createEffect(async () => {\n    if (!props.filter) return\n\n    !map().isStyleLoaded() && (await map().once('styledata'))\n    map().setFilter(props.id, props.filter)\n  })\n\n  // Update Feature State\n  createEffect(async () => {\n    if (!props.featureState || !props.featureState.id) return\n\n    !map().isStyleLoaded() && (await map().once('styledata'))\n\n    map().removeFeatureState({\n      source: source.id,\n      sourceLayer: props.style['source-layer'],\n    })\n    map().setFeatureState(\n      {\n        source: source.id,\n        sourceLayer: props.style['source-layer'],\n        id: props.featureState.id,\n      },\n      props.featureState.state\n    )\n  })\n\n  return props.children\n}\n\nexport default Layer\n","import { onMount, onCleanup, createEffect, Component } from 'solid-js'\nimport { useMap } from '../MapGL'\nimport type MapboxMap from 'mapbox-gl/src/ui/map'\nimport type { FogSpecification } from 'mapbox-gl/src/style-spec/types.js'\n\nconst Fog: Component<{\n  style: FogSpecification\n  visible?: boolean\n}> = props => {\n  const map: MapboxMap = useMap()\n  // Add Fog Layer\n  onMount(async () => {\n    !map().isStyleLoaded() && (await map().once('styledata'))\n    map().setFog(props.style)\n  })\n  // Remove Fog Layer\n  onCleanup(() => map().setFog(null))\n\n  // Update Visibility\n  createEffect(async () => {\n    if (props.visible === undefined) return\n\n    !map().isStyleLoaded() && (await map().once('styledata'))\n    map().setFog(props.visible ? props.style : null)\n  })\n\n  return props.children\n}\n\nexport default Fog\n","import { onMount, onCleanup, createEffect, Component } from 'solid-js'\nimport { useMap } from '../MapGL'\nimport type MapboxMap from 'mapbox-gl/src/ui/map'\nimport type { StyleSpecification } from 'mapbox-gl/src/style-spec/types.js'\n\nconst Sky: Component<{\n  style: StyleSpecification\n  visible?: boolean\n}> = props => {\n  const map: MapboxMap = useMap()\n  const layerId = '_sky'\n  // Add Sky Layer\n  onMount(async () => {\n    !map().isStyleLoaded() && (await map().once('styledata'))\n    !map().getLayer(layerId) && map().addLayer({ ...props.style, id: layerId })\n  })\n\n  // Remove Sky Layer\n  onCleanup(() => map().getLayer(layerId) && map().removeLayer(layerId))\n\n  // Update Visibility\n  createEffect(async () => {\n    if (props.visible === undefined) return\n\n    !map().isStyleLoaded() && (await map().once('styledata'))\n    map().setLayoutProperty(\n      layerId,\n      'visibility',\n      props.visible ? 'visible' : 'none'\n    )\n  })\n\n  return props.children\n}\n\nexport default Sky\n","import { onMount, onCleanup, createEffect, Component } from 'solid-js'\nimport { useMap } from '../MapGL'\nimport { useSource } from '../Source'\nimport type MapboxMap from 'mapbox-gl/src/ui/map'\nimport type {\n  TerrainSpecification,\n  SourceSpecification,\n} from 'mapbox-gl/src/style-spec/types.js'\n\nconst Terrain: Component<{\n  style: TerrainSpecification\n  visible?: boolean\n}> = props => {\n  const map: MapboxMap = useMap()\n  const source: SourceSpecification = useSource()\n\n  // Add Terrain Layer\n  onMount(async () => {\n    !map().isStyleLoaded() && (await map().once('styledata'))\n    map().setTerrain({ ...props.style, source: source.id })\n  })\n\n  // Remove Terrain Layer\n  onCleanup(() => map().setTerrain(null))\n\n  // Update Visibility\n  createEffect(async () => {\n    if (props.visible === undefined) return\n\n    !map().isStyleLoaded() && (await map().once('styledata'))\n    map().setTerrain(props.visible ? props.style : null)\n  })\n\n  return props.children\n}\n\nexport default Terrain\n","import { onMount, onCleanup, createSignal, Component } from 'solid-js'\nimport { useMap } from '../MapGL'\nimport mapboxgl from 'mapbox-gl'\nimport type MapboxMap from 'mapbox-gl/src/ui/map'\nimport type { Options as AttributionOptions } from 'mapbox-gl/src/ui/control/attribution_control'\nimport type { Options as FullscreenOptions } from 'mapbox-gl/src/ui/control/fullscreen_control'\nimport type { Options as GeolocateOptions } from 'mapbox-gl/src/ui/control/geolocate_control'\nimport type { Options as NavigationOptions } from 'mapbox-gl/src/ui/control/navigation_control'\nimport type { Options as ScaleOptions } from 'mapbox-gl/src/ui/control/scale_control'\n\nconst Control: Component<{\n  type: 'navigation' | 'scale' | 'attribution' | 'fullscreen' | 'geolocate'\n  options?:\n    | NavigationOptions\n    | ScaleOptions\n    | AttributionOptions\n    | FullscreenOptions\n    | GeolocateOptions\n    | object\n  custom?: any\n  position?: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right'\n}> = props => {\n  const map: MapboxMap = useMap()\n  const [control, setControl] = createSignal(null)\n\n  const getControl = (type, options) => {\n    if (props.custom) return new props.custom(options)\n    switch (type) {\n      case 'navigation':\n        return new mapboxgl.NavigationControl(options)\n      case 'scale':\n        return new mapboxgl.ScaleControl(options)\n      case 'attribution':\n        return new mapboxgl.AttributionControl(options)\n      case 'geolocate':\n        return new mapboxgl.GeolocateControl(options)\n      case 'fullscreen':\n        return new mapboxgl.FullscreenControl(\n          options || { container: map().container }\n        )\n      default:\n        throw new Error(`Unknown control type: ${type}`)\n    }\n  }\n\n  // Add Control\n  onMount(() => {\n    const control = getControl(props.type, props.options)\n    control && map().addControl(control, props.position)\n    setControl(control)\n  })\n\n  onCleanup(() => map().removeControl(control()))\n\n  return props.children\n}\n\nexport default Control\n","import { onMount, onCleanup, createEffect, Component, children } from 'solid-js'\nimport { useMap } from '../MapGL'\nimport mapboxgl from 'mapbox-gl'\nimport type MapboxMap from 'mapbox-gl/src/ui/map'\nimport type { MarkerSpecification } from 'mapbox-gl/src/style-spec/types.js'\nimport type { LngLatLike } from 'mapbox-gl/src/geo/lng_lat.js'\n\nconst Marker: Component<{\n  options?: MarkerSpecification\n  lnglat: LngLatLike\n}> = props => {\n  const map: MapboxMap = useMap()\n  let marker = null\n\n  // Add Marker\n  onMount(async () => {\n    marker = new mapboxgl.Marker(props.options)\n      .setLngLat(props.lnglat)\n      .setPopup(\n        props.children\n          ? new mapboxgl.Popup().setDOMContent(<div>{props.children}</div>)\n          : null\n      )\n      .addTo(map())\n  })\n  // Remove Marker\n  onCleanup(() => marker.remove())\n\n  // Update Position\n  createEffect(() => marker.setLngLat(props.lnglat))\n\n  return <></>\n}\n\nexport default Marker\n","import { onMount, onCleanup, createEffect, Component } from 'solid-js'\nimport { useMap } from '../MapGL'\nimport mapboxgl from 'mapbox-gl'\nimport type MapboxMap from 'mapbox-gl/src/ui/map'\nimport type { PopupSpecification } from 'mapbox-gl/src/style-spec/types.js'\nimport type { LngLatLike } from 'mapbox-gl/src/geo/lng_lat.js'\n\nconst Popup: Component<{\n  options?: PopupSpecification\n  lnglat: LngLatLike\n}> = props => {\n  const map: MapboxMap = useMap()\n  let popup = null\n\n  // Add Popup\n  onMount(async () => {\n    popup = new mapboxgl.Popup(props.options)\n      .setLngLat(props.lnglat)\n      .setDOMContent(<div>{props.children}</div>)\n      .addTo(map())\n  })\n  // Remove Popup\n  onCleanup(() => popup.remove())\n\n  // Update Position\n  createEffect(() => popup.setLngLat(props.lnglat))\n\n  // Update Content\n  createEffect(() => popup.setDOMContent(<div>{props.children}</div>))\n\n  return <></>\n}\n\nexport default Popup\n","import { onMount, onCleanup, createEffect, Component } from 'solid-js'\nimport { useMap } from '../MapGL'\nimport type MapboxMap from 'mapbox-gl/src/ui/map'\nimport type {\n  StyleImageInterface,\n  StyleImageMetadata,\n} from 'mapbox-gl/src/style/style_image'\n\nconst Image: Component<{\n  id: string\n  url?: string\n  image?:\n    | HTMLImageElement\n    | ImageBitmap\n    | ImageData\n    | { width: number; height: number; data: Uint8Array | Uint8ClampedArray }\n    | StyleImageInterface\n  options?: StyleImageMetadata\n}> = props => {\n  const map: MapboxMap = useMap()\n  // Add Image\n  onMount(async () => {\n    !map().isStyleLoaded() && (await map().once('styledata'))\n    if (props.url) {\n      map().loadImage(props.url, (error, image) => {\n        if (error) throw error\n        !map().hasImage(props.id) && map().addImage(props.id, image)\n      })\n    } else {\n      !map().hasImage(props.id) &&\n        map().addImage(props.id, props.image, props.options)\n    }\n  })\n  // Remove Image\n  onCleanup(() => map().hasImage(props.id) && map().removeImage(props.id))\n\n  // Update Image\n  createEffect(async () => {\n    if (props.image && props.url) return\n\n    if (props.url) {\n      map().loadImage(props.url, (error, image) => {\n        if (error) throw error\n        !map().hasImage(props.id) && map().updateImage(props.id, image)\n      })\n    } else {\n      map().style &&\n        map().hasImage(props.id) &&\n        map().updateImage(props.id, props.image)\n    }\n  })\n\n  return <></>\n}\n\nexport default Image\n"],"names":["mapEvents","layerEvents","pending","start","useTransition","transitionType","setTransitionType","createSignal","MapContext","createContext","useMap","useContext","MapGL","props","map","mapRef","index","id","createUniqueId","onMount","mapboxgl","Map","options","container","interactive","onViewportChange","bounds","viewport","center","zoom","pitch","bearing","fitBoundsOptions","padding","onCleanup","remove","createEffect","forEach","item","event","slice","toLowerCase","callback","e","on","off","showTileBoundaries","showTerrainWireframe","showPadding","showCollisionBoxes","showOverdrawInspector","getCanvas","style","cursor","cursorStyle","prev","setStyle","projection","setProjection","getCenter","getZoom","getPitch","getBearing","callMove","originalEvent","callEnd","cameraForBounds","untrack","stop","easeTo","jumpTo","flyTo","triggerResize","window","requestAnimationFrame","loop","resize","Provider","value","children","class","classList","height","width","SourceContext","useSource","SourceComponent","async","isStyleLoaded","once","getSource","addSource","source","getStyle","layers","layer","removeLayer","removeSource","type","data","setData","diff","newProps","prevProps","Set","Object","keys","reduce","acc","key","push","Layer","getLayer","addLayer","beforeType","find","l","beforeId","layout","setLayoutProperty","validate","paint","setPaintProperty","minzoom","maxzoom","setLayerZoomRange","filter","setFilter","undefined","visible","featureState","removeFeatureState","sourceLayer","setFeatureState","state","Fog","setFog","Sky","layerId","Terrain","setTerrain","Control","control","setControl","custom","NavigationControl","ScaleControl","AttributionControl","GeolocateControl","FullscreenControl","Error","getControl","addControl","position","removeControl","Marker","marker","setLngLat","lnglat","setPopup","Popup","setDOMContent","addTo","popup","Image","url","loadImage","error","image","hasImage","addImage","removeImage","updateImage"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../src/events.ts","../../src/styles.ts","../../src/components/MapGL/index.tsx","../../src/components/Source/index.tsx","../../src/components/Layer/index.tsx","../../src/components/Fog/index.tsx","../../src/components/Sky/index.tsx","../../src/components/Terrain/index.tsx","../../src/components/Control/index.tsx","../../src/components/Marker/index.tsx","../../src/components/Popup/index.tsx","../../src/components/Image/index.tsx","../../src/components/Camera/index.tsx"],"sourcesContent":["const mapEvents: string[] = [\n  'onMouseDown',\n  'onMouseUp',\n  'onMouseOver',\n  'onMouseOut',\n  'onMouseMove',\n  'onMouseEnter',\n  'onMouseLeave',\n  'onPreClick',\n  'onClick',\n  'onDblClick',\n  'onContextMenu',\n  'onTouchStart',\n  'onTouchEnd',\n  'onTouchCancel',\n  'onWheel',\n  'onResize',\n  'onRemove',\n  'onTouchMove',\n  'onMoveStart',\n  'onMove',\n  'onMoveEnd',\n  'onDragStart',\n  'onDrag',\n  'onDragEnd',\n  'onZoomStart',\n  'onZoom',\n  'onZoomEnd',\n  'onRotateStart',\n  'onRotate',\n  'onRotatEnd',\n  'onPitchStart',\n  'onPitch',\n  'onPitchEnd',\n  'onBoxZoomStart',\n  'onBoxZoomEnd',\n  'onBoxZoomCancel',\n  'onWebglContextLost',\n  'onWebglContextRestored',\n  'onLoad',\n  'onRender',\n  'onIdle',\n  'onError',\n  'onData',\n  'onStyleData',\n  'onSourceData',\n  'onDataLoading',\n  'onStyleDataLoading',\n  'onSourceDataLoading',\n  'onStyleImageMissing',\n]\n\nconst layerEvents: string[] = [\n  'onMouseDown',\n  'onMouseUp',\n  'onMouseOver',\n  'onMouseOut',\n  'onMouseMove',\n  'onMouseEnter',\n  'onMouseLeave',\n  'onClick',\n  'onDblClick',\n  'onContextMenu',\n  'onTouchStart',\n  'onTouchEnd',\n  'onTouchCancel',\n]\n\nexport { mapEvents, layerEvents }\n","const mapBase = 'mapbox://styles/mapbox'\nconst gitBase = 'https://raw.githubusercontent.com'\n\nexport const vectorStyleList = {\n  'mb:light': `${mapBase}/light-v10`,\n  'mb:dark': `${mapBase}/dark-v10`,\n  'mb:streets': `${mapBase}/streets-v11`,\n  'mb:outdoor': `${mapBase}/outdoors-v11`,\n  'mb:sat': `${mapBase}/satellite-v9`,\n  'mb:sat-streets': `${mapBase}/satellite-streets-v11`,\n  'mb:nav': `${mapBase}/navigation-guidance-day-v4`,\n  'mb:nav-night': `${mapBase}/navigation-guidance-night-v4`,\n\n  'mb:basic': `${mapBase}/cjf4m44iw0uza2spb3q0a7s41`,\n  'mb:monochrome': `${mapBase}/cjv6rzz4j3m4b1fqcchuxclhb`,\n  'mb:leshine': `${mapBase}/cjcunv5ae262f2sm9tfwg8i0w`,\n  'mb:icecream': `${mapBase}/cj7t3i5yj0unt2rmt3y4b5e32`,\n  'mb:cali': `${mapBase}/cjerxnqt3cgvp2rmyuxbeqme7`,\n  'mb:northstar': `${mapBase}/cj44mfrt20f082snokim4ungi`,\n  'mb:mineral': `${mapBase}/cjtep62gq54l21frr1whf27ak`,\n  'mb:moonlight': `${mapBase}/cj3kbeqzo00022smj7akz3o1e`,\n  'mb:frank': `${mapBase}-map-design/ckshxkppe0gge18nz20i0nrwq`,\n  'mb:minimo': `${mapBase}-map-design/cksjc2nsq1bg117pnekb655h1`,\n  'mb:decimal': `${mapBase}-map-design/ck4014y110wt61ctt07egsel6`,\n  'mb:standard': `${mapBase}-map-design/ckr0svm3922ki18qntevm857n`,\n  'mb:blueprint': `${mapBase}-map-design/cks97e1e37nsd17nzg7p0308g`,\n  'mb:bubble': `${mapBase}-map-design/cksysy2nl62zp17quosctdtcc`,\n  'mb:pencil': `${mapBase}-map-design/cks9iema71es417mlrft4go2k`,\n\n  'mb:swiss-ski': `${gitBase}/mapbox/mapbox-gl-swiss-ski-style/master/cij1zoclj002y8rkkdjl69psd.json`,\n  'mb:vintage': `${gitBase}/mapbox/mapbox-gl-vintage-style/master/cif5p01n202nisaktvljx9mv3.json`,\n  'mb:whaam': `${gitBase}/mapbox/mapbox-gl-whaam-style/master/cii8323c8004w0nlvtss3dbm2.json`,\n  'mb:neon': `${gitBase}/NatEvatt/awesome-mapbox-gl-styles/master/styles/Neon/style.json`,\n  'mb:camoflauge': `${gitBase}/jingsam/mapbox-gl-styles/master/Camouflage.json`,\n  'mb:emerald': `${gitBase}/jingsam/mapbox-gl-styles/master/Emerald.json`,\n  'mb:runner': `${gitBase}/jingsam/mapbox-gl-styles/master/Runner.json`,\n  'mb:x-ray': `${gitBase}/jingsam/mapbox-gl-styles/master/X-ray.json`,\n}\n\nexport const rasterStyleList = {\n  'osm:org': [\n    'https://tile.openstreetmap.org/{z}/{x}/{y}.png',\n    'Map &copy; <a href=\"https://www.openstreetmap.org\"><em>OpenStreetMap</em></a>',\n  ],\n  'osm:human': [\n    'https://{s}.tile.openstreetmap.fr/hot/{z}/{x}/{y}.png',\n    'Map &copy; <a href=\"http://hot.openstreetmap.org\"><em>Humanitarian OpenStreetMap Team</em></a>',\n  ],\n  'osm:cycle': [\n    'https://{s}.tile-cyclosm.openstreetmap.fr/cyclosm/{z}/{x}/{y}.png',\n    'Maps &copy; <a href=\"https://www.cyclosm.org\" target=\"_blank\"><em>CyclOSM</em></a>, Data &copy; <a href=\"http://www.openstreetmap.org/copyright\" target=\"_blank\"><em>OpenStreetMap</em></a>',\n  ],\n  'carto:voyager': [\n    'https://{s}.basemaps.cartocdn.com/rastertiles/voyager_labels_under/{z}/{x}/{y}.png',\n    'Maps &copy; <a href=\"https://carto.com/attribution\"><em>Carto</em></a>',\n  ],\n  'carto:positron': [\n    'https://{s}.basemaps.cartocdn.com/rastertiles/light_all/{z}/{x}/{y}.png',\n    'Maps &copy; <a href=\"https://carto.com/attribution\"><em>Carto</em></a>',\n  ],\n  'carto:dark': [\n    'https://{s}.basemaps.cartocdn.com/rastertiles/dark_all/{z}/{x}/{y}.png',\n    'Maps &copy; <a href=\"https://carto.com/attribution\"><em>Carto</em></a>',\n  ],\n  'open:topo': [\n    'https://{s}.tile.opentopomap.org/{z}/{x}/{y}.png',\n    'Maps &copy; <a href=\"https://opentopomap.org/credits\"><em>OpenTopoMap</em></a>, Data &copy; <a href=\"http://www.openstreetmap.org/copyright\" target=\"_blank\"><em>OpenStreetMap</em></a>',\n  ],\n  'stamen:toner': [\n    'https://stamen-tiles-{s}.a.ssl.fastly.net/toner/{z}/{x}/{y}.png',\n    'Maps &copy; <a href=\"https://stamen.com\" target=\"_blank\"><em>Stamen Design</em></a>, Data &copy; <a href=\"http://www.openstreetmap.org/copyright\" target=\"_blank\"><em>OpenStreetMap</em></a>',\n  ],\n  'stamen:toner-lite': [\n    'https://stamen-tiles-{s}.a.ssl.fastly.net/toner-lite/{z}/{x}/{y}.png',\n    'Maps &copy; <a href=\"https://stamen.com\" target=\"_blank\"><em>Stamen Design</em></a>, Data &copy; <a href=\"http://www.openstreetmap.org/copyright\" target=\"_blank\"><em>OpenStreetMap</em></a>',\n  ],\n  'stamen:watercolor': [\n    'https://stamen-tiles-{s}.a.ssl.fastly.net/watercolor/{z}/{x}/{y}.jpg',\n    'Maps &copy; <a href=\"https://stamen.com\" target=\"_blank\"><em>Stamen Design</em></a>, Data &copy; <a href=\"http://www.openstreetmap.org/copyright\" target=\"_blank\"><em>OpenStreetMap</em></a>',\n  ],\n  'stamen:terrain': [\n    'https://stamen-tiles-{s}.a.ssl.fastly.net/terrain/{z}/{x}/{y}.jpg',\n    'Maps &copy; <a href=\"https://stamen.com\" target=\"_blank\"><em>Stamen Design</em></a>, Data &copy; <a href=\"http://www.openstreetmap.org/copyright\" target=\"_blank\"><em>OpenStreetMap</em></a>',\n  ],\n  'tf:cycle': [\n    'https://{s}.tile.thunderforest.com/cycle/{z}/{x}/{y}@2x.png?apikey={apikey}',\n    'Maps &copy; <a href=\"https://thunderforest.com\" target=\"_blank\"><em>Thunderforest</em></a>, Data &copy; <a href=\"http://www.openstreetmap.org/copyright\" target=\"_blank\"><em>OpenStreetMap</em></a>',\n  ],\n  'tf:trans': [\n    'https://{s}.tile.thunderforest.com/transport/{z}/{x}/{y}.png?apikey={apikey}',\n    'Maps &copy; <a href=\"https://thunderforest.com\" target=\"_blank\"><em>Thunderforest</em></a>, Data &copy; <a href=\"http://www.openstreetmap.org/copyright\" target=\"_blank\"><em>OpenStreetMap</em></a>',\n  ],\n  'tf:trans-dark': [\n    'https://{s}.tile.thunderforest.com/transport-dark/{z}/{x}/{y}.png?apikey={apikey}',\n    'Maps &copy; <a href=\"https://thunderforest.com\" target=\"_blank\"><em>Thunderforest</em></a>, Data &copy; <a href=\"http://www.openstreetmap.org/copyright\" target=\"_blank\"><em>OpenStreetMap</em></a>',\n  ],\n  'tf:landscape': [\n    'https://{s}.tile.thunderforest.com/landscape/{z}/{x}/{y}.png?apikey={apikey}',\n    'Maps &copy; <a href=\"https://thunderforest.com\" target=\"_blank\"><em>Thunderforest</em></a>, Data &copy; <a href=\"http://www.openstreetmap.org/copyright\" target=\"_blank\"><em>OpenStreetMap</em></a>',\n  ],\n  'tf:outdoors': [\n    'https://{s}.tile.thunderforest.com/outdoors/{z}/{x}/{y}.png?apikey={apikey}',\n    'Maps &copy; <a href=\"https://thunderforest.com\" target=\"_blank\"><em>Thunderforest</em></a>, Data &copy; <a href=\"http://www.openstreetmap.org/copyright\" target=\"_blank\"><em>OpenStreetMap</em></a>',\n  ],\n  'tf:neighbourhood': [\n    'https://{s}.tile.thunderforest.com/neighbourhood/{z}/{x}/{y}.png?apikey={apikey}',\n    'Maps &copy; <a href=\"https://thunderforest.com\" target=\"_blank\"><em>Thunderforest</em></a>, Data &copy; <a href=\"http://www.openstreetmap.org/copyright\" target=\"_blank\"><em>OpenStreetMap</em></a>',\n  ],\n  'tf:spinal': [\n    'https://{s}.tile.thunderforest.com/spinal-map/{z}/{x}/{y}.png?apikey={apikey}',\n    'Maps &copy; <a href=\"https://thunderforest.com\" target=\"_blank\"><em>Thunderforest</em></a>, Data &copy; <a href=\"http://www.openstreetmap.org/copyright\" target=\"_blank\"><em>OpenStreetMap</em></a>',\n  ],\n  'tf:pioneer': [\n    'https://{s}.tile.thunderforest.com/pioneer/{z}/{x}/{y}.png?apikey={apikey}',\n    'Maps &copy; <a href=\"https://thunderforest.com\" target=\"_blank\"><em>Thunderforest</em></a>, Data &copy; <a href=\"http://www.openstreetmap.org/copyright\" target=\"_blank\"><em>OpenStreetMap</em></a>',\n  ],\n  'tf:atlas': [\n    'https://{s}.tile.thunderforest.com/atlas/{z}/{x}/{y}.png?apikey={apikey}',\n    'Maps &copy; <a href=\"https://thunderforest.com\" target=\"_blank\"><em>Thunderforest</em></a>, Data &copy; <a href=\"http://www.openstreetmap.org/copyright\" target=\"_blank\"><em>OpenStreetMap</em></a>',\n  ],\n  'tf:mobile': [\n    'https://{s}.tile.thunderforest.com/mobile-atlas/{z}/{x}/{y}.png?apikey={apikey}',\n    'Maps &copy; <a href=\"https://thunderforest.com\" target=\"_blank\"><em>Thunderforest</em></a>, Data &copy; <a href=\"http://www.openstreetmap.org/copyright\" target=\"_blank\"><em>OpenStreetMap</em></a>',\n  ],\n}\n","import {\n  createSignal,\n  createEffect,\n  onMount,\n  onCleanup,\n  createContext,\n  useContext,\n  Component,\n  useTransition,\n  createUniqueId,\n  untrack,\n  on,\n} from 'solid-js'\nimport { mapEvents } from '../../events'\nimport { vectorStyleList } from '../../styles'\nimport mapboxgl from 'mapbox-gl'\nimport 'mapbox-gl/dist/mapbox-gl.css'\nimport type { MapboxMap, MapboxOptions } from 'mapbox-gl/src/ui/map'\nimport type { LngLatLike } from 'mapbox-gl/src/geo/lng_lat.js'\nimport type { LngLatBounds } from 'mapbox-gl/src/geo/lng_lat_bounds.js'\nimport type { PaddingOptions } from 'mapbox-gl/src/geo/edge_insets.js'\nimport type { JSX } from 'solid-js'\n\nexport type Viewport = {\n  id?: string\n  center?: LngLatLike\n  bounds?: LngLatBounds\n  zoom?: number\n  pitch?: number\n  bearing?: number\n  padding?: PaddingOptions\n}\n\nconst MapContext = createContext<MapboxMap>()\n/** Provides the Mapbox Map Object */\nexport const useMap = (): MapboxMap => useContext(MapContext)\n\n/** Creates a new Map Container */\nexport const MapGL: Component<{\n  id?: string\n  /** Map Container CSS Style */\n  style?: JSX.CSSProperties\n  /** Map Container CSS Class */\n  class?: string\n  /** SolidJS Class List for Map Container */\n  classList?: {\n    [k: string]: boolean | undefined\n  }\n  /** Current Map View */\n  viewport?: Viewport\n  /** Mapbox Options\n   * @see https://docs.mapbox.com/mapbox-gl-js/api/map/#map-parameters\n   */\n  options?: MapboxOptions\n  /** Type for pan, move and zoom transitions */\n  transitionType?: 'flyTo' | 'easeTo' | 'jumpTo'\n  /** Event listener for Viewport updates */\n  onViewportChange?: (viewport: Viewport) => void\n  /** Displays Map Tile Borders */\n  showTileBoundaries?: boolean\n  /** Displays Wireframe if Terrain is visible */\n  showTerrainWireframe?: boolean\n  /** Displays Borders if Padding is set */\n  showPadding?: boolean\n  /** Displays Label Collision Boxes */\n  showCollisionBoxes?: boolean\n  /** Displays all feature outlines even if normally not drawn by style rules */\n  showOverdrawInspector?: boolean\n  triggerResize?: boolean\n  repaint?: boolean\n  /** Mouse Cursor Style */\n  cursorStyle?: string\n  ref?: HTMLDivElement\n  /** Children within the Map Container */\n  children?: Element | Element[]\n}> = props => {\n  let map: MapboxMap\n  let mapRef: HTMLDivElement\n  let containerRef: HTMLElement\n  props.id = props.id || createUniqueId()\n\n  const [mapRoot, setMapRoot] = createSignal<MapboxMap>()\n  const [pending, start] = useTransition()\n  const [transitionType, setTransitionType] = createSignal('flyTo')\n\n  onMount(async () => {\n    map = new mapboxgl.Map({\n      ...props.options,\n      style: vectorStyleList[props.options?.style] ||\n        props.options?.style || { version: 8, sources: {}, layers: [] },\n      container: mapRef,\n      interactive: !!props.onViewportChange,\n      bounds: props.viewport?.bounds,\n      center: props.viewport?.center,\n      zoom: props.viewport?.zoom || null,\n      pitch: props.viewport?.pitch || null,\n      bearing: props.viewport?.bearing || null,\n      fitBoundsOptions: { padding: props.viewport?.padding },\n    } as MapboxOptions)\n\n    map.container = containerRef\n\n    await map.once('styledata')\n    setMapRoot(map)\n  })\n\n  onCleanup(() => map.remove())\n\n  // Hook up events\n  createEffect(() =>\n    mapEvents.forEach(item => {\n      if (props[item]) {\n        const event = item.slice(2).toLowerCase()\n        const callback = e => props[item](e)\n        map.on(event, callback)\n        onCleanup(() => map.off(event, callback))\n      }\n    })\n  )\n\n  // Update debug features\n  createEffect(() => (map.showTileBoundaries = props.showTileBoundaries))\n  createEffect(() => (map.showTerrainWireframe = props.showTerrainWireframe))\n  createEffect(() => (map.showPadding = props.showPadding))\n  createEffect(() => (map.showCollisionBoxes = props.showCollisionBoxes))\n  createEffect(() => (map.showOverdrawInspector = props.showOverdrawInspector))\n\n  createEffect(() => (map.getCanvas().style.cursor = props.cursorStyle))\n  createEffect(() => setTransitionType(props.transitionType))\n\n  // Update projection\n  createEffect(\n    on(\n      () => props.options?.projection,\n      proj => map.setProjection(proj),\n      { defer: true }\n    )\n  )\n\n  // Update map style\n  createEffect(\n    on(\n      () => props.options?.style,\n      style => {\n        const oldStyle = map.getStyle()\n        const oldLayers = oldStyle.layers.filter(l => l.id.startsWith('cl-'))\n        const oldSources = Object.keys(oldStyle.sources)\n          .filter(s => s.startsWith('cl-'))\n          .reduce((obj, key) => ({ ...obj, [key]: oldStyle.sources[key] }), {})\n        map.setStyle(\n          vectorStyleList[style] ||\n            style || { version: 8, sources: {}, layers: [] }\n        )\n        map.once('styledata', () => {\n          const newStyle = map.getStyle()\n          map.setStyle({\n            ...newStyle,\n            sources: { ...newStyle.sources, ...oldSources },\n            layers: [...newStyle.layers, ...oldLayers],\n          })\n        })\n      },\n      { defer: true }\n    )\n  )\n\n  // Hook up viewport events\n  createEffect(() => {\n    const viewport = {\n      id: null,\n      center: map.getCenter(),\n      zoom: map.getZoom(),\n      pitch: map.getPitch(),\n      bearing: map.getBearing(),\n      padding: props.viewport?.padding,\n      bounds: props.viewport?.bounds,\n    }\n\n    const callMove = event => {\n      if (event.originalEvent)\n        props.onViewportChange &&\n          props.onViewportChange({ ...viewport, id: props.id })\n      setTransitionType('jumpTo')\n    }\n\n    const callEnd = event => {\n      if (event.originalEvent)\n        props.onViewportChange && props.onViewportChange(viewport)\n      setTransitionType(props.transitionType)\n    }\n\n    map.on('move', callMove).on('moveend', callEnd)\n    onCleanup(() => map.off('move', callMove).off('moveend', callEnd))\n  })\n\n  // Update boundaries\n  createEffect(prev => {\n    if (props.viewport?.bounds != prev)\n      props.onViewportChange({\n        ...props.viewport,\n        ...map.cameraForBounds(props.viewport?.bounds, {\n          padding: props.viewport?.padding,\n        }),\n      })\n    return props.viewport?.bounds\n  }, props.viewport?.bounds)\n\n  // Update Viewport\n  createEffect(() => {\n    if (props.id === props.viewport?.id) return\n    const viewport = {\n      ...props.viewport,\n      padding: props.viewport?.padding || 0,\n    }\n    switch (untrack(transitionType)) {\n      case 'easeTo':\n        map.stop().easeTo(viewport)\n      case 'jumpTo':\n        map.stop().jumpTo(viewport)\n      default:\n        map.stop().flyTo(viewport)\n    }\n  })\n\n  let index = 0\n\n  createEffect(() => {\n    if (props.triggerResize) {\n      index = 0\n      window.requestAnimationFrame(function loop() {\n        if (index < 15) {\n          index++\n          window.requestAnimationFrame(loop)\n          start(() => map.resize())\n        }\n      })\n    }\n  })\n\n  return (\n    <MapContext.Provider value={mapRoot}>\n      <section\n        ref={containerRef}\n        style={{ position: 'absolute', 'z-index': 1 }}>\n        {props.children || null}\n      </section>\n      <div\n        ref={mapRef}\n        class={props.class || null}\n        classList={props.classList || null}\n        style={{ height: '100%', width: '100%', ...props.style }}\n      />\n    </MapContext.Provider>\n  )\n}\n","import {\n  onCleanup,\n  createEffect,\n  Component,\n  createContext,\n  useContext,\n  createUniqueId,\n} from 'solid-js'\nimport { useMap } from '../MapGL'\nimport type MapboxMap from 'mapbox-gl/src/ui/map'\nimport type { SourceSpecification } from 'mapbox-gl/src/style-spec/types.js'\nimport { rasterStyleList } from '../../styles'\n\nconst SourceContext = createContext<string>()\nexport const useSourceId = (): string => useContext(SourceContext)\n\nexport const Source: Component<{\n  /** @optional Source ID for referencing non nexted Layers */\n  id?: string\n  /** @see https://docs.mapbox.com/mapbox-gl-js/style-spec/sources/ */\n  source: SourceSpecification\n  children?: any\n}> = props => {\n  const map: MapboxMap = useMap()\n  props.id = props.id || createUniqueId()\n\n  const lookup = url =>\n    rasterStyleList[url]\n      ? {\n          ...props.source,\n          url: '',\n          tiles: [\n            rasterStyleList[url][0].replace('{apikey}', props.source.apikey),\n          ],\n          attribution: rasterStyleList[url][1],\n        }\n      : props.source\n\n  // Add Source\n  createEffect(() => {\n    if (!map()) return\n    const source = lookup(props.source.url)\n    source.tiles &&\n      (source.tiles = ['a', 'b', 'c'].map(i =>\n        source.tiles[0].replace('{s}', i)\n      ))\n    !map().getSource(props.id) && map().addSource(props.id, source)\n  })\n\n  // Remove Source\n  onCleanup(() => {\n    map()\n      .getStyle()\n      .layers.forEach(\n        layer => layer.source === props.id && map().removeLayer(layer.id)\n      )\n    map().getSource(props.id) && map().removeSource(props.id)\n  })\n\n  // Update\n  createEffect(() => {\n    if (!map()) return\n    const source = map().getSource(props.id)\n    if (!source) return\n\n    // Update GeoJSON Data\n    if (props.source.type === 'geojson' && props.source.data)\n      source.setData(props.source.data)\n\n    // Update Image URL\n    if (\n      props.source.type === 'image' &&\n      (props.source.url || props.source.coordinates)\n    )\n      source.updateImage(props.source.url, props.source.coordinates)\n\n    // Update Vector URL or Tiles\n    if (\n      props.source.type === 'vector' &&\n      (props.source.url || props.source.tiles)\n    )\n      props.source.url\n        ? source.setUrl(props.source.url)\n        : source.setTiles(props.source.tiles)\n\n    // Update Raster URL or Tiles\n    if (\n      props.source.type === 'raster' &&\n      (props.source.url || props.source.tiles)\n    ) {\n      const src = lookup(props.source.url)\n      src.tiles &&\n        (src.tiles = ['a', 'b', 'c'].map(i => src.tiles[0].replace('{s}', i)))\n      source._tileJSONRequest?.cancel()\n      source.url = src.url\n      source.scheme = src.scheme\n      source._options = { ...source._options, ...src }\n      map().style._sourceCaches[`other:${props.id}`]?.clearTiles()\n      source.load()\n    }\n  })\n\n  return (\n    <SourceContext.Provider value={props.id}>\n      {props.children}\n    </SourceContext.Provider>\n  )\n}\n","import { onCleanup, createEffect, Component, createUniqueId } from 'solid-js'\nimport { useMap } from '../MapGL'\nimport { useSourceId } from '../Source'\nimport { layerEvents } from '../../events'\nimport type MapboxMap from 'mapbox-gl/src/ui/map'\nimport type {\n  FilterSpecification,\n  StyleSpecification,\n} from 'mapbox-gl/src/style-spec/types.js'\nimport type { CustomLayerInterface } from 'mapbox-gl/src/style/style_layer/custom_style_layer'\n\nconst diff = (\n  newProps: StyleSpecification = {},\n  prevProps: StyleSpecification = {}\n) => {\n  const keys = new Set([...Object.keys(newProps), ...Object.keys(prevProps)])\n  return [...keys].reduce((acc, key: string) => {\n    const value = newProps[key]\n    if (value !== prevProps[key]) {\n      acc.push([key, value])\n    }\n    return acc\n  }, [])\n}\n\nexport const Layer: Component<{\n  id?: string\n  style?: StyleSpecification\n  customLayer?: CustomLayerInterface\n  filter?: FilterSpecification\n  visible?: boolean\n  sourceId?: string\n  beforeType?:\n    | 'background'\n    | 'fill'\n    | 'line'\n    | 'symbol'\n    | 'raster'\n    | 'circle'\n    | 'fill-extrusion'\n    | 'heatmap'\n    | 'hillshade'\n    | 'sky'\n  beforeId?: string\n  featureState?: { id: number | string; state: object }\n  children?: any\n}> = props => {\n  const map: MapboxMap = useMap()\n  const sourceId: string = useSourceId()\n  props.id = props.id || createUniqueId()\n\n  // Add Layer\n  createEffect(() => {\n    if (!map()) return\n    !map().getLayer(props.id) &&\n      map().addLayer(\n        props.customLayer || {\n          ...props.style,\n          id: props.id,\n          source: sourceId,\n          metadata: {\n            smg: { beforeType: props.beforeType, beforeId: props.beforeId },\n          },\n        },\n        props.beforeType\n          ? map()\n              ?.getStyle()\n              .layers.find(l => l.type === props.beforeType).id\n          : props.beforeId\n      )\n  })\n\n  //Remove Layer\n  onCleanup(() => map().removeLayer(props.id))\n\n  // Hook up events\n  createEffect(() =>\n    layerEvents.forEach(item => {\n      if (props[item]) {\n        const event = item.slice(2).toLowerCase()\n        const callback = e => props[item](e)\n        map()?.on(event, props.id, callback)\n        onCleanup(() => map()?.off(event, props.id, callback))\n      }\n    })\n  )\n\n  // Update Style\n  createEffect((prev: StyleSpecification) => {\n    if (!map()) return\n    if (\n      !props.style ||\n      !map().style ||\n      !map().getSource(sourceId) ||\n      !map().getLayer(props.id)\n    )\n      return\n\n    if (props.style.layout !== prev?.layout)\n      diff(props.style.layout, prev?.layout).forEach(([key, value]) =>\n        map().setLayoutProperty(props.id, key, value, { validate: false })\n      )\n\n    if (props.style.paint !== prev?.paint)\n      diff(props.style.paint, prev?.paint).forEach(([key, value]) =>\n        map().setPaintProperty(props.id, key, value, { validate: false })\n      )\n\n    if (\n      props.style.minzoom !== prev?.minzoom ||\n      props.style.maxzoom !== prev?.maxzoom\n    )\n      map().setLayerZoomRange(\n        props.id,\n        props.style.minzoom,\n        props.style.maxzoom\n      )\n\n    if (props.style.filter !== prev?.filter)\n      map().setFilter(props.id, props.style.filter, { validate: false })\n\n    return props.style\n  }, props.style)\n\n  // Update Visibility\n  createEffect((prev: boolean) => {\n    if (\n      props.visible === undefined ||\n      props.visible === prev ||\n      !map().getSource(sourceId) ||\n      !map().getLayer(props.id)\n    )\n      return\n\n    map().setLayoutProperty(\n      props.id,\n      'visibility',\n      props.visible ? 'visible' : 'none',\n      { validate: false }\n    )\n    return props.visible\n  }, props.visible)\n\n  // Update Filter\n  createEffect(async () => {\n    if (!props.filter) return\n\n    !map().isStyleLoaded() && (await map().once('styledata'))\n    map().setFilter(props.id, props.filter)\n  })\n\n  // Update Feature State\n  createEffect(async () => {\n    if (!props.featureState || !props.featureState.id) return\n\n    !map().isStyleLoaded() && (await map().once('styledata'))\n\n    map().removeFeatureState({\n      source: sourceId,\n      sourceLayer: props.style['source-layer'],\n    })\n    map().setFeatureState(\n      {\n        source: sourceId,\n        sourceLayer: props.style['source-layer'],\n        id: props.featureState.id,\n      },\n      props.featureState.state\n    )\n  })\n\n  return props.children\n}\n","import { onCleanup, createEffect, Component } from 'solid-js'\nimport { useMap } from '../MapGL'\nimport type MapboxMap from 'mapbox-gl/src/ui/map'\nimport type { FogSpecification } from 'mapbox-gl/src/style-spec/types.js'\n\nexport const Fog: Component<{\n  style: FogSpecification\n  visible?: boolean\n  children?: any\n}> = props => {\n  const map: MapboxMap = useMap()\n  // Add Fog Layer\n  createEffect(() => {\n    if (!map()) return\n    map().setFog(props.style)\n  })\n\n  // Remove Fog Layer\n  onCleanup(() => map().setFog(null))\n\n  // Update Visibility\n  createEffect(() => {\n    if (!map()) return\n    props.visible !== undefined &&\n      map().setFog(props.visible ? props.style : null)\n  })\n\n  return props.children\n}\n","import { onCleanup, createEffect, Component } from 'solid-js'\nimport { useMap } from '../MapGL'\nimport type MapboxMap from 'mapbox-gl/src/ui/map'\nimport type { StyleSpecification } from 'mapbox-gl/src/style-spec/types.js'\n\nexport const Sky: Component<{\n  style: StyleSpecification\n  visible?: boolean\n  children?: any\n}> = props => {\n  const map: MapboxMap = useMap()\n  const layerId = '_sky'\n\n  // Add Sky Layer\n  createEffect(() => {\n    if (!map()) return\n    map().getLayer(layerId) && map().addLayer({ ...props.style, id: layerId })\n  })\n\n  // Remove Sky Layer\n  onCleanup(() => map().getLayer(layerId) && map().removeLayer(layerId))\n\n  // Update Visibility\n  createEffect(() => {\n    if (!map()) return\n    props.visible !== undefined &&\n      map().setLayoutProperty(\n        layerId,\n        'visibility',\n        props.visible ? 'visible' : 'none'\n      )\n  })\n\n  return props.children\n}\n","import { onCleanup, createEffect, Component } from 'solid-js'\nimport { useMap } from '../MapGL'\nimport { useSourceId } from '../Source'\nimport type MapboxMap from 'mapbox-gl/src/ui/map'\nimport type {\n  TerrainSpecification,\n  SourceSpecification,\n} from 'mapbox-gl/src/style-spec/types.js'\n\nexport const Terrain: Component<{\n  style: TerrainSpecification\n  visible?: boolean\n  children?: any\n}> = props => {\n  const map: MapboxMap = useMap()\n  const sourceId: SourceSpecification = useSourceId()\n\n  // Add Terrain Layer\n  createEffect(() => {\n    if (!map()) return\n    map().setTerrain({ ...props.style, source: sourceId })\n  })\n\n  // Remove Terrain Layer\n  onCleanup(() => map().setTerrain(null))\n\n  // Update Visibility\n  createEffect(() => {\n    if (!map()) return\n    props.visible !== undefined &&\n      map().setTerrain(props.visible ? props.style : null)\n  })\n\n  return props.children\n}\n","import { createEffect, onCleanup, createSignal, Component } from 'solid-js'\nimport { useMap } from '../MapGL'\nimport mapboxgl from 'mapbox-gl'\nimport type MapboxMap from 'mapbox-gl/src/ui/map'\nimport type { Options as AttributionOptions } from 'mapbox-gl/src/ui/control/attribution_control'\nimport type { Options as FullscreenOptions } from 'mapbox-gl/src/ui/control/fullscreen_control'\nimport type { Options as GeolocateOptions } from 'mapbox-gl/src/ui/control/geolocate_control'\nimport type { Options as NavigationOptions } from 'mapbox-gl/src/ui/control/navigation_control'\nimport type { Options as ScaleOptions } from 'mapbox-gl/src/ui/control/scale_control'\n\nexport const Control: Component<{\n  type: 'navigation' | 'scale' | 'attribution' | 'fullscreen' | 'geolocate'\n  options?:\n    | NavigationOptions\n    | ScaleOptions\n    | AttributionOptions\n    | FullscreenOptions\n    | GeolocateOptions\n    | object\n  custom?: any\n  position?: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right'\n  children?: any\n}> = props => {\n  const map: MapboxMap = useMap()\n  const [control, setControl] = createSignal(null)\n\n  const getControl = (type, options) => {\n    if (props.custom) return new props.custom(options)\n    switch (type) {\n      case 'navigation':\n        return new mapboxgl.NavigationControl(options)\n      case 'scale':\n        return new mapboxgl.ScaleControl(options)\n      case 'attribution':\n        return new mapboxgl.AttributionControl(options)\n      case 'geolocate':\n        return new mapboxgl.GeolocateControl(options)\n      case 'fullscreen':\n        return new mapboxgl.FullscreenControl()\n        // options || { container: map().container }\n      default:\n        throw new Error(`Unknown control type: ${type}`)\n    }\n  }\n\n  // Add Control\n  createEffect(() => {\n    if (!map()) return\n    const control = getControl(props.type, props.options)\n    control && map()?.addControl(control, props.position)\n    setControl(control)\n  })\n\n  onCleanup(() => map().removeControl(control()))\n\n  return props.children\n}\n","import { onCleanup, createEffect, Component } from 'solid-js'\nimport { useMap } from '../MapGL'\nimport mapboxgl from 'mapbox-gl'\nimport type MapboxMap from 'mapbox-gl/src/ui/map'\nimport type { MarkerSpecification } from 'mapbox-gl/src/style-spec/types.js'\nimport type { LngLatLike } from 'mapbox-gl/src/geo/lng_lat.js'\n\nexport const Marker: Component<{\n  options?: MarkerSpecification\n  lnglat: LngLatLike\n  children?: any\n}> = props => {\n  const map: MapboxMap = useMap()\n  let marker = null\n\n  // Add Marker\n  createEffect(() => {\n    if (!map()) return\n    marker = new mapboxgl.Marker(props.options)\n      .setLngLat(props.lnglat)\n      .setPopup(\n        props.children\n          ? new mapboxgl.Popup().setDOMContent(<div>{props.children}</div>)\n          : null\n      )\n      .addTo(map())\n  })\n  // Remove Marker\n  onCleanup(() => marker.remove())\n\n  // Update Position\n  createEffect(() => marker && marker.setLngLat(props.lnglat))\n\n  return <></>\n}\n","import { onCleanup, createEffect, Component } from 'solid-js'\nimport { useMap } from '../MapGL'\nimport mapboxgl from 'mapbox-gl'\nimport type MapboxMap from 'mapbox-gl/src/ui/map'\nimport type { PopupSpecification } from 'mapbox-gl/src/style-spec/types.js'\nimport type { LngLatLike } from 'mapbox-gl/src/geo/lng_lat.js'\n\nexport const Popup: Component<{\n  options?: PopupSpecification\n  lnglat: LngLatLike\n  children?: any\n}> = props => {\n  const map: MapboxMap = useMap()\n  let popup = null\n\n  // Add Popup\n  createEffect(() => {\n    if (!map()) return\n    popup = new mapboxgl.Popup(props.options)\n      .setLngLat(props.lnglat)\n      .setDOMContent(<div>{props.children}</div>)\n      .addTo(map())\n  })\n\n  // Remove Popup\n  onCleanup(() => popup.remove())\n\n  // Update Position\n  createEffect(() => popup && popup.setLngLat(props.lnglat))\n\n  // Update Content\n  createEffect(() => popup && popup.setDOMContent(<div>{props.children}</div>))\n\n  return <></>\n}\n","import { onCleanup, createEffect, Component } from 'solid-js'\nimport { useMap } from '../MapGL'\nimport type MapboxMap from 'mapbox-gl/src/ui/map'\nimport type {\n  StyleImageInterface,\n  StyleImageMetadata,\n} from 'mapbox-gl/src/style/style_image'\n\nexport const Image: Component<{\n  id: string\n  url?: string\n  image?:\n    | HTMLImageElement\n    | ImageBitmap\n    | ImageData\n    | { width: number; height: number; data: Uint8Array | Uint8ClampedArray }\n    | StyleImageInterface\n  options?: StyleImageMetadata\n}> = props => {\n  const map: MapboxMap = useMap()\n  // Add Image\n  createEffect(() => {\n    if (!map()) return\n    if (props.url) {\n      map().loadImage(\n        props.url,\n        (_, image) =>\n          !map().hasImage(props.id) && map().addImage(props.id, image)\n      )\n    } else {\n      !map().hasImage(props.id) &&\n        map().addImage(props.id, props.image, props.options)\n    }\n  })\n\n  // Remove Image\n  onCleanup(() => map().hasImage(props.id) && map().removeImage(props.id))\n\n  // Update Image\n  createEffect(async () => {\n    if (!map()) return\n    if (props.image && props.url) return\n\n    if (props.url) {\n      map().loadImage(props.url, (error, image) => {\n        if (error) throw error\n        !map().hasImage(props.id) && map().updateImage(props.id, image)\n      })\n    } else {\n      map().style &&\n        map().hasImage(props.id) &&\n        map().updateImage(props.id, props.image)\n    }\n  })\n\n  return <></>\n}\n","import { createEffect, Component } from 'solid-js'\nimport { useMap } from '../MapGL'\nimport type MapboxMap from 'mapbox-gl/src/ui/map'\nimport type LngLatLike from 'mapbox-gl/src/geo/lng_lat.js'\nimport { MercatorCoordinate } from 'mapbox-gl'\n\n// linearly interpolate between two positions [x,y,z] based on time\nconst lerp = (a, b, t) => a.map((_, idx) => (1.0 - t) * a[idx] + t * b[idx])\n\n// sphericaly interpolate between two positions [x,y,z] based on time\nconst slerp = (a, b, t) => {\n  const omega = 0.075\n  // TODO: Proper Calculation\n  // a.map((_, idx) => a[idx] * b[idx]).reduce((m, n) => m + n)\n\n  return a.map(\n    (_, idx) =>\n      (Math.sin((1 - t) * omega) / Math.sin(omega)) * a[idx] +\n      (Math.sin(t * omega) / Math.sin(omega)) * b[idx]\n  )\n}\n\n// calculations from: https://easings.net\nconst easeQuad = {\n  in: (x: number): number => x * x,\n  out: (x: number): number => 1 - (1 - x) * (1 - x),\n  inOut: (x: number): number =>\n    x < 0.5 ? 2 * x * x : 1 - Math.pow(-2 * x + 2, 2) / 2,\n}\n\nexport const Camera: Component<{\n  animate: boolean\n  translate?: {\n    type?: 'line' | 'sphere'\n    start: [number, number, number]\n    end: [number, number, number]\n    target: LngLatLike\n    targetEnd?: LngLatLike\n    easing?: 'in' | 'out' | 'inOut'\n    loop?: boolean\n    duration: number\n  }\n}> = props => {\n  const map: MapboxMap = useMap()\n  let animationTime = 0.1\n  let isReverse = false\n\n  const updateCameraPosition = ([lng, lat, alt], target) => {\n    const camera = map().getFreeCameraOptions()\n    camera.position = MercatorCoordinate.fromLngLat([lng, lat], alt)\n    camera.lookAtPoint(target)\n    map().setFreeCameraOptions(camera)\n  }\n\n  const frame = (time: number) => {\n    props.animate && window.requestAnimationFrame(frame)\n    const params = [\n      props.translate.start,\n      props.translate.end,\n      props.translate.easing\n        ? easeQuad[props.translate.easing](animationTime)\n        : animationTime,\n    ] as const\n    const position =\n      props.translate.type === 'line' ? lerp(...params) : slerp(...params)\n\n    updateCameraPosition(position, props.translate.target)\n\n    if (!props.translate.loop && (animationTime > 1.0 || animationTime < 0.0))\n      isReverse = !isReverse\n    animationTime = isReverse ? animationTime - 0.001 : animationTime + 0.001\n  }\n\n  createEffect(async () => {\n    props.animate && window.requestAnimationFrame(frame)\n  })\n\n  return props.children\n}\n"],"names":["mapEvents","layerEvents","mapBase","gitBase","vectorStyleList","mb:light","mb:dark","mb:streets","mb:outdoor","mb:sat","mb:sat-streets","mb:nav","mb:nav-night","mb:basic","mb:monochrome","mb:leshine","mb:icecream","mb:cali","mb:northstar","mb:mineral","mb:moonlight","mb:frank","mb:minimo","mb:decimal","mb:standard","mb:blueprint","mb:bubble","mb:pencil","mb:swiss-ski","mb:vintage","mb:whaam","mb:neon","mb:camoflauge","mb:emerald","mb:runner","mb:x-ray","rasterStyleList","osm:org","osm:human","osm:cycle","carto:voyager","carto:positron","carto:dark","open:topo","stamen:toner","stamen:toner-lite","stamen:watercolor","stamen:terrain","tf:cycle","tf:trans","tf:trans-dark","tf:landscape","tf:outdoors","tf:neighbourhood","tf:spinal","tf:pioneer","tf:atlas","tf:mobile","MapContext","createContext","useMap","useContext","MapGL","props","_props$viewport13","let","map","mapRef","containerRef","id","createUniqueId","mapRoot","setMapRoot","createSignal","start","useTransition","transitionType","setTransitionType","onMount","async","_props$viewport6","mapboxgl","Map","options","style","_props$options","_props$options2","version","sources","layers","container","interactive","onViewportChange","bounds","viewport","_props$viewport","center","_props$viewport2","zoom","pitch","bearing","fitBoundsOptions","padding","once","onCleanup","remove","createEffect","forEach","item","event","slice","toLowerCase","callback","e","on","off","showTileBoundaries","showTerrainWireframe","showPadding","showCollisionBoxes","showOverdrawInspector","getCanvas","cursor","cursorStyle","_props$options3","projection","proj","setProjection","defer","_props$options4","oldStyle","getStyle","oldLayers","filter","l","startsWith","oldSources","Object","keys","s","reduce","obj","key","setStyle","newStyle","_props$viewport8","getCenter","getZoom","getPitch","getBearing","_props$viewport7","callMove","originalEvent","callEnd","prev","_props$viewport12","_props$viewport9","cameraForBounds","_props$viewport10","_props$viewport11","_props$viewport15","_props$viewport14","untrack","stop","easeTo","jumpTo","flyTo","index","triggerResize","window","requestAnimationFrame","loop","resize","_$createComponent","Provider","value","children","_el$","_tmpl$","cloneNode","_ref$","setProperty","_$insert","_el$2","_tmpl$2","_ref$2","_$effect","_p$","_v$","class","_v$2","classList","_v$3","height","width","_$className","_$classList","_$style","undefined","SourceContext","useSourceId","Source","lookup","url","source","tiles","replace","apikey","attribution","i","getSource","addSource","layer","removeLayer","removeSource","type","data","setData","coordinates","updateImage","setUrl","setTiles","_map$style$_sourceCac","src","_source$_tileJSONRequ","_tileJSONRequest","cancel","scheme","_options","_sourceCaches","clearTiles","load","diff","newProps","prevProps","Set","acc","push","Layer","sourceId","_map","getLayer","addLayer","customLayer","metadata","smg","beforeType","beforeId","find","_map2","_map3","layout","setLayoutProperty","validate","paint","setPaintProperty","minzoom","maxzoom","setLayerZoomRange","setFilter","visible","isStyleLoaded","featureState","removeFeatureState","sourceLayer","setFeatureState","state","Fog","setFog","Sky","layerId","Terrain","setTerrain","Control","control","setControl","custom","NavigationControl","ScaleControl","AttributionControl","GeolocateControl","FullscreenControl","Error","getControl","addControl","position","removeControl","Marker","marker","setLngLat","lnglat","setPopup","Popup","setDOMContent","addTo","popup","Image","loadImage","_","image","hasImage","addImage","removeImage","error","lerp","a","b","t","idx","slerp","Math","sin","easeQuad","in","x","out","inOut","pow","Camera","animationTime","isReverse","frame","time","animate","params","translate","end","easing","updateCameraPosition","lng","lat","alt","target","camera","getFreeCameraOptions","MercatorCoordinate","fromLngLat","lookAtPoint","setFreeCameraOptions"],"mappings":"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"}

package/dist/index/components/Camera/index.d.ts

@@ -0,0 +1,15 @@
+import { Component } from 'solid-js';
+import type LngLatLike from 'mapbox-gl/src/geo/lng_lat.js';
+export declare const Camera: Component<{
+    animate: boolean;
+    translate?: {
+        type?: 'line' | 'sphere';
+        start: [number, number, number];
+        end: [number, number, number];
+        target: LngLatLike;
+        targetEnd?: LngLatLike;
+        easing?: 'in' | 'out' | 'inOut';
+        loop?: boolean;
+        duration: number;
+    };
+}>;

package/dist/index/components/Camera/index.jsx

@@ -0,0 +1,49 @@
+import { createEffect } from 'solid-js';
+import { useMap } from '../MapGL';
+import { MercatorCoordinate } from 'mapbox-gl';
+// linearly interpolate between two positions [x,y,z] based on time
+const lerp = (a, b, t) => a.map((_, idx) => (1.0 - t) * a[idx] + t * b[idx]);
+// sphericaly interpolate between two positions [x,y,z] based on time
+const slerp = (a, b, t) => {
+    const omega = 0.075;
+    // TODO: Proper Calculation
+    // a.map((_, idx) => a[idx] * b[idx]).reduce((m, n) => m + n)
+    return a.map((_, idx) => (Math.sin((1 - t) * omega) / Math.sin(omega)) * a[idx] +
+        (Math.sin(t * omega) / Math.sin(omega)) * b[idx]);
+};
+// calculations from: https://easings.net
+const easeQuad = {
+    in: (x) => x * x,
+    out: (x) => 1 - (1 - x) * (1 - x),
+    inOut: (x) => x < 0.5 ? 2 * x * x : 1 - Math.pow(-2 * x + 2, 2) / 2,
+};
+export const Camera = props => {
+    const map = useMap();
+    let animationTime = 0.1;
+    let isReverse = false;
+    const updateCameraPosition = ([lng, lat, alt], target) => {
+        const camera = map().getFreeCameraOptions();
+        camera.position = MercatorCoordinate.fromLngLat([lng, lat], alt);
+        camera.lookAtPoint(target);
+        map().setFreeCameraOptions(camera);
+    };
+    const frame = (time) => {
+        props.animate && window.requestAnimationFrame(frame);
+        const params = [
+            props.translate.start,
+            props.translate.end,
+            props.translate.easing
+                ? easeQuad[props.translate.easing](animationTime)
+                : animationTime,
+        ];
+        const position = props.translate.type === 'line' ? lerp(...params) : slerp(...params);
+        updateCameraPosition(position, props.translate.target);
+        if (!props.translate.loop && (animationTime > 1.0 || animationTime < 0.0))
+            isReverse = !isReverse;
+        animationTime = isReverse ? animationTime - 0.001 : animationTime + 0.001;
+    };
+    createEffect(async () => {
+        props.animate && window.requestAnimationFrame(frame);
+    });
+    return props.children;
+};

package/dist/{types → index}/components/Control/index.d.ts

@@ -4,10 +4,10 @@ import type { Options as FullscreenOptions } from 'mapbox-gl/src/ui/control/full
 import type { Options as GeolocateOptions } from 'mapbox-gl/src/ui/control/geolocate_control';
 import type { Options as NavigationOptions } from 'mapbox-gl/src/ui/control/navigation_control';
 import type { Options as ScaleOptions } from 'mapbox-gl/src/ui/control/scale_control';
-declare const Control: Component<{
+export declare const Control: Component<{
     type: 'navigation' | 'scale' | 'attribution' | 'fullscreen' | 'geolocate';
     options?: NavigationOptions | ScaleOptions | AttributionOptions | FullscreenOptions | GeolocateOptions | object;
     custom?: any;
     position?: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';
+    children?: any;
 }>;
-export default Control;

package/dist/{source → index}/components/Control/index.jsx

@@ -1,7 +1,7 @@
-import { onMount, onCleanup, createSignal } from 'solid-js';
+import { createEffect, onCleanup, createSignal } from 'solid-js';
 import { useMap } from '../MapGL';
 import mapboxgl from 'mapbox-gl';
-const Control = props => {
+export const Control = props => {
     const map = useMap();
     const [control, setControl] = createSignal(null);
     const getControl = (type, options) => {
@@ -17,18 +17,20 @@ const Control = props => {
             case 'geolocate':
                 return new mapboxgl.GeolocateControl(options);
             case 'fullscreen':
-                return new mapboxgl.FullscreenControl(options || { container: map().container });
+                return new mapboxgl.FullscreenControl();
+            // options || { container: map().container }
             default:
                 throw new Error(`Unknown control type: ${type}`);
         }
     };
     // Add Control
-    onMount(() => {
+    createEffect(() => {
+        if (!map())
+            return;
         const control = getControl(props.type, props.options);
-        control && map().addControl(control, props.position);
+        control && map()?.addControl(control, props.position);
         setControl(control);
     });
     onCleanup(() => map().removeControl(control()));
     return props.children;
 };
-export default Control;

package/dist/{types → index}/components/Fog/index.d.ts

@@ -1,7 +1,7 @@
 import { Component } from 'solid-js';
 import type { FogSpecification } from 'mapbox-gl/src/style-spec/types.js';
-declare const Fog: Component<{
+export declare const Fog: Component<{
     style: FogSpecification;
     visible?: boolean;
+    children?: any;
 }>;
-export default Fog;

package/dist/index/components/Fog/index.jsx

@@ -0,0 +1,21 @@
+import { onCleanup, createEffect } from 'solid-js';
+import { useMap } from '../MapGL';
+export const Fog = props => {
+    const map = useMap();
+    // Add Fog Layer
+    createEffect(() => {
+        if (!map())
+            return;
+        map().setFog(props.style);
+    });
+    // Remove Fog Layer
+    onCleanup(() => map().setFog(null));
+    // Update Visibility
+    createEffect(() => {
+        if (!map())
+            return;
+        props.visible !== undefined &&
+            map().setFog(props.visible ? props.style : null);
+    });
+    return props.children;
+};

package/dist/{types → index}/components/Image/index.d.ts

@@ -1,6 +1,6 @@
 import { Component } from 'solid-js';
 import type { StyleImageInterface, StyleImageMetadata } from 'mapbox-gl/src/style/style_image';
-declare const Image: Component<{
+export declare const Image: Component<{
     id: string;
     url?: string;
     image?: HTMLImageElement | ImageBitmap | ImageData | {
@@ -10,4 +10,3 @@ declare const Image: Component<{
     } | StyleImageInterface;
     options?: StyleImageMetadata;
 }>;
-export default Image;

package/dist/{source → index}/components/Image/index.jsx

@@ -1,16 +1,13 @@
-import { onMount, onCleanup, createEffect } from 'solid-js';
+import { onCleanup, createEffect } from 'solid-js';
 import { useMap } from '../MapGL';
-const Image = props => {
+export const Image = props => {
     const map = useMap();
     // Add Image
-    onMount(async () => {
-        !map().isStyleLoaded() && (await map().once('styledata'));
+    createEffect(() => {
+        if (!map())
+            return;
         if (props.url) {
-            map().loadImage(props.url, (error, image) => {
-                if (error)
-                    throw error;
-                !map().hasImage(props.id) && map().addImage(props.id, image);
-            });
+            map().loadImage(props.url, (_, image) => !map().hasImage(props.id) && map().addImage(props.id, image));
         }
         else {
             !map().hasImage(props.id) &&
@@ -21,6 +18,8 @@ const Image = props => {
     onCleanup(() => map().hasImage(props.id) && map().removeImage(props.id));
     // Update Image
     createEffect(async () => {
+        if (!map())
+            return;
         if (props.image && props.url)
             return;
         if (props.url) {
@@ -38,4 +37,3 @@ const Image = props => {
     });
     return <></>;
 };
-export default Image;

package/dist/{types → index}/components/Layer/index.d.ts

@@ -1,10 +1,10 @@
 import { Component } from 'solid-js';
 import type { FilterSpecification, StyleSpecification } from 'mapbox-gl/src/style-spec/types.js';
 import type { CustomLayerInterface } from 'mapbox-gl/src/style/style_layer/custom_style_layer';
-declare const Layer: Component<{
+export declare const Layer: Component<{
     id?: string;
     style?: StyleSpecification;
-    layer?: CustomLayerInterface;
+    customLayer?: CustomLayerInterface;
     filter?: FilterSpecification;
     visible?: boolean;
     sourceId?: string;
@@ -14,5 +14,5 @@ declare const Layer: Component<{
         id: number | string;
         state: object;
     };
+    children?: any;
 }>;
-export default Layer;

package/dist/{source → index}/components/Layer/index.jsx

@@ -1,6 +1,6 @@
-import { onMount, onCleanup, createEffect, createUniqueId, } from 'solid-js';
+import { onCleanup, createEffect, createUniqueId } from 'solid-js';
 import { useMap } from '../MapGL';
-import { useSource } from '../Source';
+import { useSourceId } from '../Source';
 import { layerEvents } from '../../events';
 const diff = (newProps = {}, prevProps = {}) => {
     const keys = new Set([...Object.keys(newProps), ...Object.keys(prevProps)]);
@@ -12,40 +12,46 @@ const diff = (newProps = {}, prevProps = {}) => {
         return acc;
     }, []);
 };
-const Layer = props => {
+export const Layer = props => {
     const map = useMap();
-    const source = useSource();
+    const sourceId = useSourceId();
     props.id = props.id || createUniqueId();
     // Add Layer
-    onMount(async () => {
-        !map().isStyleLoaded() && (await map().once('styledata'));
-        if (map().getLayer(props.id))
+    createEffect(() => {
+        if (!map())
             return;
-        map().addLayer(props.layer || {
-            ...props.style,
-            id: props.id,
-            source: source.id,
-        }, props.beforeType
-            ? map()
-                .getStyle()
-                .layers.find(l => l.type === props.beforeType).id
-            : props.beforeId);
+        !map().getLayer(props.id) &&
+            map().addLayer(props.customLayer || {
+                ...props.style,
+                id: props.id,
+                source: sourceId,
+                metadata: {
+                    smg: { beforeType: props.beforeType, beforeId: props.beforeId },
+                },
+            }, props.beforeType
+                ? map()
+                    ?.getStyle()
+                    .layers.find(l => l.type === props.beforeType).id
+                : props.beforeId);
     });
+    //Remove Layer
     onCleanup(() => map().removeLayer(props.id));
     // Hook up events
     createEffect(() => layerEvents.forEach(item => {
         if (props[item]) {
             const event = item.slice(2).toLowerCase();
             const callback = e => props[item](e);
-            map().on(event, props.id, callback);
-            onCleanup(() => map().off(event, props.id, callback));
+            map()?.on(event, props.id, callback);
+            onCleanup(() => map()?.off(event, props.id, callback));
         }
     }));
     // Update Style
     createEffect((prev) => {
+        if (!map())
+            return;
         if (!props.style ||
             !map().style ||
-            !map().getSource(source.id) ||
+            !map().getSource(sourceId) ||
             !map().getLayer(props.id))
             return;
         if (props.style.layout !== prev?.layout)
@@ -63,7 +69,7 @@ const Layer = props => {
     createEffect((prev) => {
         if (props.visible === undefined ||
             props.visible === prev ||
-            !map().getSource(source.id) ||
+            !map().getSource(sourceId) ||
             !map().getLayer(props.id))
             return;
         map().setLayoutProperty(props.id, 'visibility', props.visible ? 'visible' : 'none', { validate: false });
@@ -82,15 +88,14 @@ const Layer = props => {
             return;
         !map().isStyleLoaded() && (await map().once('styledata'));
         map().removeFeatureState({
-            source: source.id,
+            source: sourceId,
             sourceLayer: props.style['source-layer'],
         });
         map().setFeatureState({
-            source: source.id,
+            source: sourceId,
             sourceLayer: props.style['source-layer'],
             id: props.featureState.id,
         }, props.featureState.state);
     });
     return props.children;
 };
-export default Layer;

package/dist/{types → index}/components/MapGL/index.d.ts

@@ -14,27 +14,44 @@ export declare type Viewport = {
     bearing?: number;
     padding?: PaddingOptions;
 };
-declare const useMap: () => MapboxMap;
-declare const MapGL: Component<{
+/** Provides the Mapbox Map Object */
+export declare const useMap: () => MapboxMap;
+/** Creates a new Map Container */
+export declare const MapGL: Component<{
     id?: string;
+    /** Map Container CSS Style */
     style?: JSX.CSSProperties;
+    /** Map Container CSS Class */
     class?: string;
+    /** SolidJS Class List for Map Container */
     classList?: {
         [k: string]: boolean | undefined;
     };
+    /** Current Map View */
     viewport?: Viewport;
+    /** Mapbox Options
+     * @see https://docs.mapbox.com/mapbox-gl-js/api/map/#map-parameters
+     */
     options?: MapboxOptions;
-    children?: Element | Element[];
-    triggerResize?: boolean;
+    /** Type for pan, move and zoom transitions */
     transitionType?: 'flyTo' | 'easeTo' | 'jumpTo';
+    /** Event listener for Viewport updates */
     onViewportChange?: (viewport: Viewport) => void;
+    /** Displays Map Tile Borders */
     showTileBoundaries?: boolean;
+    /** Displays Wireframe if Terrain is visible */
     showTerrainWireframe?: boolean;
+    /** Displays Borders if Padding is set */
     showPadding?: boolean;
+    /** Displays Label Collision Boxes */
     showCollisionBoxes?: boolean;
+    /** Displays all feature outlines even if normally not drawn by style rules */
     showOverdrawInspector?: boolean;
+    triggerResize?: boolean;
     repaint?: boolean;
+    /** Mouse Cursor Style */
     cursorStyle?: string;
     ref?: HTMLDivElement;
+    /** Children within the Map Container */
+    children?: Element | Element[];
 }>;
-export { MapGL as default, useMap };