@xyo-network/react-map 2.64.9 → 2.64.10

package/dist/browser/Components/MapBoxPoints.cjs

@@ -1,280 +0,0 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/Components/MapBoxPoints.tsx
-var MapBoxPoints_exports = {};
-__export(MapBoxPoints_exports, {
-  MapboxPointsFlexBox: () => MapboxPointsFlexBox
-});
-module.exports = __toCommonJS(MapBoxPoints_exports);
-var import_material3 = require("@mui/material");
-var import_react_flexbox2 = require("@xylabs/react-flexbox");
-var import_react7 = require("react");
-
-// src/hooks/useDynamicMapResize.tsx
-var import_react = require("react");
-var useDynamicMapResize = (mapContainerRef, mapCanvasRef, mapInstance, active = true) => {
-  const [dependenciesReady, setDependenciesReady] = (0, import_react.useState)(false);
-  const resizer = (0, import_react.useMemo)(
-    () => new ResizeObserver(() => {
-      const width = mapContainerRef.current?.getBoundingClientRect().width;
-      if (width && mapCanvasRef.current) {
-        mapCanvasRef.current.style.width = `${width}px`;
-        setTimeout(() => mapInstance?.resize());
-      }
-    }),
-    [mapCanvasRef, mapContainerRef, mapInstance]
-  );
-  (0, import_react.useEffect)(() => {
-    const dependenciesReady2 = !!(active && mapInstance && mapContainerRef?.current && mapCanvasRef.current);
-    setDependenciesReady(dependenciesReady2);
-  }, [active, mapCanvasRef, mapContainerRef, mapInstance]);
-  (0, import_react.useEffect)(() => {
-    if (dependenciesReady) {
-      if (mapContainerRef.current) {
-        resizer.observe(mapContainerRef.current);
-      }
-      return () => {
-        resizer.disconnect();
-      };
-    }
-  }, [active, dependenciesReady, mapCanvasRef, mapContainerRef, mapInstance, resizer]);
-};
-
-// src/MapBoxClasses/MapBase.ts
-var import_assert = require("@xylabs/assert");
-var import_sdk_geo = require("@xyo-network/sdk-geo");
-var MapBase = class {
-  _config;
-  constructor(config) {
-    this._config = { requestLocation: true, zoom: 2, ...config };
-  }
-  get isMapReady() {
-    return !!this._config.map;
-  }
-  initializeMapSource(layer) {
-    const getSource = () => {
-      const featuresCollection = import_sdk_geo.GeoJson.featureCollection(this._config.features);
-      return import_sdk_geo.GeoJson.featuresSource(featuresCollection);
-    };
-    const existingSource = this._config.map.getSource(layer.source);
-    const source = getSource();
-    if (existingSource) {
-      existingSource.setData((0, import_assert.assertEx)(source.data));
-    } else {
-      this._config.map.addSource(layer.source, source);
-    }
-    layer.update(this._config.map, true);
-    return this;
-  }
-};
-
-// src/MapBoxClasses/MapPoints.ts
-var import_mapbox_gl = require("mapbox-gl");
-var MapPoints = class extends MapBase {
-  config;
-  constructor(config) {
-    super(config);
-    this.config = config;
-  }
-  initialMapPositioning(options, initialBounds) {
-    let bounds;
-    if (initialBounds) {
-      bounds = initialBounds;
-    } else {
-      bounds = new import_mapbox_gl.LngLatBounds();
-      this.config.features.forEach((feature) => {
-        bounds.extend(feature.geometry.coordinates);
-      });
-    }
-    this.config.map.setCenter(bounds.getCenter());
-    this.config.map.fitBounds(bounds, options);
-    return this.config.map;
-  }
-};
-
-// src/Contexts/MapBoxInstance/Context.ts
-var import_react2 = require("react");
-var MapBoxInstanceContext = (0, import_react2.createContext)({});
-
-// src/Contexts/MapBoxInstance/useMapBoxInstance.tsx
-var import_assert2 = require("@xylabs/assert");
-var import_react3 = require("react");
-var useMapBoxInstance = () => {
-  const context = (0, import_react3.useContext)(MapBoxInstanceContext);
-  (0, import_assert2.assertEx)("map" in context, "useMapBoxInstance must be used within a MapBoxInstanceContext");
-  return context;
-};
-
-// src/Contexts/MapSettings/Context.ts
-var import_react4 = require("react");
-var MapSettingsContext = (0, import_react4.createContext)({});
-
-// src/Contexts/MapSettings/useMapSettings.tsx
-var import_react5 = require("react");
-var useMapSettings = () => {
-  const context = (0, import_react5.useContext)(MapSettingsContext);
-  return context;
-};
-
-// src/Components/MapBox.tsx
-var import_mapbox_gl2 = require("mapbox-gl/dist/mapbox-gl.css");
-var import_mapbox_gl3 = require("mapbox-gl");
-var import_react6 = require("react");
-var import_jsx_runtime = require("react/jsx-runtime");
-var MapBox = ({ accessToken, darkMode = false, options, zoom = 2, ...props }) => {
-  const [map, setMap] = (0, import_react6.useState)();
-  const mapContainerRef = (0, import_react6.useRef)(null);
-  const mapCanvasRef = (0, import_react6.useRef)(null);
-  const { setMapBoxInstance, map: mapInstance } = useMapBoxInstance();
-  const { mapSettings } = useMapSettings();
-  const activeResize = mapSettings?.dynamicMapResize.value;
-  useDynamicMapResize(mapContainerRef, mapCanvasRef, mapInstance, activeResize);
-  (0, import_react6.useEffect)(() => {
-    if (mapSettings?.preferDark?.value === true) {
-      map?.setStyle(`mapbox://styles/${"mapbox/dark-v10" /* Dark */}`);
-    } else {
-      map?.setStyle(`mapbox://styles/${darkMode ? "mapbox/dark-v10" /* Dark */ : "mapbox/light-v10" /* Light */}`);
-    }
-  }, [map, darkMode, mapSettings]);
-  (0, import_react6.useEffect)(() => {
-    const map2 = new import_mapbox_gl3.Map({
-      accessToken,
-      center: [0, 0],
-      container: mapContainerRef.current ?? "",
-      style: `mapbox://styles/${"mapbox/light-v10" /* Light */}`,
-      zoom,
-      ...options
-    });
-    setMapBoxInstance?.(map2);
-    setMap(map2);
-    mapCanvasRef.current = document.querySelector(".mapboxgl-canvas");
-    console.log("Created Map");
-    return () => {
-      console.log("Removing Map");
-      map2.remove();
-    };
-  }, [mapContainerRef, setMap, options, zoom, setMapBoxInstance, accessToken]);
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    "div",
-    {
-      ref: (el) => mapContainerRef.current = el,
-      style: {
-        bottom: 0,
-        left: 0,
-        position: "absolute",
-        right: 0,
-        top: 0,
-        ...props
-      }
-    }
-  );
-};
-
-// src/Components/MapSettingsComponents/Setting.tsx
-var import_material = require("@mui/material");
-var import_jsx_runtime2 = require("react/jsx-runtime");
-var MapSettingSwitch = ({ developerMode, field, ...props }) => {
-  const { mapSettings, setMapSettings } = useMapSettings();
-  const setting = mapSettings?.[field];
-  const onLocalChange = (event) => {
-    if (setting) {
-      setMapSettings?.((previous) => {
-        previous[setting.field].value = event.target.checked;
-        return { ...previous };
-      });
-    }
-  };
-  if (setting?.devMode && developerMode === false) {
-    return null;
-  }
-  return setting?.hidden ? null : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material.FormControlLabel, { label: setting?.label, control: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material.Switch, { checked: setting?.value, onChange: onLocalChange, ...props }) });
-};
-
-// src/Components/MapSettingsComponents/SettingsBox.tsx
-var import_material2 = require("@mui/material");
-var import_react_flexbox = require("@xylabs/react-flexbox");
-var import_react_app_settings = require("@xyo-network/react-app-settings");
-var import_jsx_runtime3 = require("react/jsx-runtime");
-var MapSettingsBox = ({ developerMode, ...props }) => {
-  const { mapSettings } = useMapSettings();
-  const { developerMode: devModeFromContext } = (0, import_react_app_settings.useAppSettings)();
-  const resolveDeveloperMode = developerMode ?? devModeFromContext;
-  return mapSettings && resolveDeveloperMode ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react_flexbox.FlexGrowRow, { bottom: 36, left: 10, position: "absolute", ...props, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react_flexbox.FlexRow, { paddingX: 2, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material2.Paper, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material2.Stack, { direction: "row", spacing: 1, marginX: 1, children: Object.keys(mapSettings).map((key, index) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(MapSettingSwitch, { field: mapSettings[key].field, developerMode }, index);
-  }) }) }) }) }) : null;
-};
-
-// src/Components/MapBoxPoints.tsx
-var import_jsx_runtime4 = require("react/jsx-runtime");
-var MapboxPointsFlexBox = ({
-  accessToken,
-  features,
-  fitToPointsPadding = 20,
-  layers,
-  zoom,
-  ...props
-}) => {
-  const [mapPoints, setMapPoints] = (0, import_react7.useState)();
-  const { mapSettings } = useMapSettings();
-  const { map, mapInitialized } = useMapBoxInstance();
-  const customFitToBoundsOptions = (zoom2) => {
-    if (zoom2 !== void 0) {
-      return {
-        maxZoom: zoom2
-      };
-    }
-    return {};
-  };
-  const updateFeatures = (0, import_react7.useCallback)(() => {
-    if (mapPoints?.isMapReady && features?.length) {
-      layers?.forEach((layer) => {
-        mapPoints.initializeMapSource(layer);
-      });
-    }
-  }, [mapPoints, features, layers]);
-  const updateMapSetup = (0, import_react7.useCallback)(() => {
-    const { fitToPoints } = mapSettings || {};
-    if (mapPoints && map) {
-      if (fitToPoints?.value === true) {
-        mapPoints.initialMapPositioning({ padding: fitToPointsPadding, ...customFitToBoundsOptions(zoom) });
-      }
-    }
-  }, [mapSettings, mapPoints, map, fitToPointsPadding, zoom]);
-  const reInitializeMap = (0, import_react7.useCallback)(() => {
-    mapPoints?.initialMapPositioning({ padding: fitToPointsPadding, ...customFitToBoundsOptions(zoom) });
-    updateFeatures();
-  }, [mapPoints, fitToPointsPadding, updateFeatures, zoom]);
-  (0, import_react7.useEffect)(() => {
-    if (map && features?.length) {
-      setMapPoints(new MapPoints({ features, map, zoom }));
-    }
-  }, [map, features, zoom]);
-  (0, import_react7.useEffect)(() => {
-    if (mapInitialized) {
-      updateMapSetup();
-      reInitializeMap();
-    }
-  }, [mapInitialized, reInitializeMap, updateMapSetup]);
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react_flexbox2.FlexCol, { alignItems: "stretch", id: "xyo-mapbox-wrap", ...props, children: features ? /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(MapBox, { accessToken, zoom }),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(MapSettingsBox, {})
-  ] }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_material3.Alert, { severity: "error", children: "No data to show" }) });
-};
-//# sourceMappingURL=MapBoxPoints.cjs.map

package/dist/browser/Components/MapBoxPoints.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/Components/MapBoxPoints.tsx","../../../src/hooks/useDynamicMapResize.tsx","../../../src/MapBoxClasses/MapBase.ts","../../../src/MapBoxClasses/MapPoints.ts","../../../src/Contexts/MapBoxInstance/Context.ts","../../../src/Contexts/MapBoxInstance/useMapBoxInstance.tsx","../../../src/Contexts/MapSettings/Context.ts","../../../src/Contexts/MapSettings/useMapSettings.tsx","../../../src/Components/MapBox.tsx","../../../src/Components/MapSettingsComponents/Setting.tsx","../../../src/Components/MapSettingsComponents/SettingsBox.tsx"],"sourcesContent":["import { Alert } from '@mui/material'\nimport { FlexCol } from '@xylabs/react-flexbox'\nimport { Feature, Point } from 'geojson'\nimport { FitBoundsOptions } from 'mapbox-gl'\nimport { useCallback, useEffect, useState } from 'react'\n\nimport { useMapBoxInstance, useMapSettings } from '../Contexts'\nimport { MapboxFlexBoxProps } from '../lib'\nimport { MapPoints } from '../MapBoxClasses'\nimport { MapBox } from './MapBox'\nimport { MapSettingsBox } from './MapSettingsComponents'\n\nexport interface MapboxPointsFlexBoxProps extends MapboxFlexBoxProps {\n  accessToken: string\n  features?: Feature<Point>[]\n}\n\nexport const MapboxPointsFlexBox: React.FC<MapboxPointsFlexBoxProps> = ({\n  accessToken,\n  features,\n  fitToPointsPadding = 20,\n  layers,\n  zoom,\n  ...props\n}) => {\n  const [mapPoints, setMapPoints] = useState<MapPoints>()\n  const { mapSettings } = useMapSettings()\n  const { map, mapInitialized } = useMapBoxInstance()\n\n  /**\n   * Needed because of a bug in mapbox taking undefined values for the config options of fitToBounds\n   * see - https://github.com/mapbox/mapbox-gl-js/issues/10013\n   */\n  const customFitToBoundsOptions = (zoom?: number): FitBoundsOptions => {\n    if (zoom !== undefined) {\n      return {\n        maxZoom: zoom,\n      }\n    }\n    return {}\n  }\n\n  const updateFeatures = useCallback(() => {\n    if (mapPoints?.isMapReady && features?.length) {\n      layers?.forEach((layer) => {\n        mapPoints.initializeMapSource(layer)\n      })\n    }\n  }, [mapPoints, features, layers])\n\n  const updateMapSetup = useCallback(() => {\n    const { fitToPoints } = mapSettings || {}\n\n    if (mapPoints && map) {\n      if (fitToPoints?.value === true) {\n        mapPoints.initialMapPositioning({ padding: fitToPointsPadding, ...customFitToBoundsOptions(zoom) })\n      }\n    }\n  }, [mapSettings, mapPoints, map, fitToPointsPadding, zoom])\n\n  const reInitializeMap = useCallback(() => {\n    mapPoints?.initialMapPositioning({ padding: fitToPointsPadding, ...customFitToBoundsOptions(zoom) })\n    updateFeatures()\n  }, [mapPoints, fitToPointsPadding, updateFeatures, zoom])\n\n  useEffect(() => {\n    if (map && features?.length) {\n      setMapPoints(new MapPoints({ features, map, zoom }))\n    }\n  }, [map, features, zoom])\n\n  useEffect(() => {\n    if (mapInitialized) {\n      updateMapSetup()\n      reInitializeMap()\n    }\n  }, [mapInitialized, reInitializeMap, updateMapSetup])\n\n  return (\n    <FlexCol alignItems=\"stretch\" id=\"xyo-mapbox-wrap\" {...props}>\n      {features ? (\n        <>\n          <MapBox accessToken={accessToken} zoom={zoom} />\n          <MapSettingsBox />\n        </>\n      ) : (\n        <Alert severity=\"error\">No data to show</Alert>\n      )}\n    </FlexCol>\n  )\n}\n","import { Map } from 'mapbox-gl'\nimport { MutableRefObject, useEffect, useMemo, useState } from 'react'\n\n/**\n * Inspired by - https://bl.ocks.org/danswick/fc56f37c10d40be62e4feac5984250d2\n */\nexport const useDynamicMapResize = (\n  mapContainerRef: MutableRefObject<HTMLDivElement | null>,\n  mapCanvasRef: MutableRefObject<HTMLCanvasElement | null>,\n  mapInstance?: Map,\n  active = true,\n) => {\n  const [dependenciesReady, setDependenciesReady] = useState(false)\n\n  const resizer = useMemo(\n    () =>\n      new ResizeObserver(() => {\n        const width = mapContainerRef.current?.getBoundingClientRect().width\n        if (width && mapCanvasRef.current) {\n          mapCanvasRef.current.style.width = `${width}px`\n          // setTimeout allows for the smoothest animation (vs requestAnimationFrame, debouce, etc)\n          // likely because it lets mapbox resize once when the event loop is ready?\n          setTimeout(() => mapInstance?.resize())\n        }\n      }),\n    [mapCanvasRef, mapContainerRef, mapInstance],\n  )\n\n  useEffect(() => {\n    const dependenciesReady = !!(active && mapInstance && mapContainerRef?.current && mapCanvasRef.current)\n    setDependenciesReady(dependenciesReady)\n  }, [active, mapCanvasRef, mapContainerRef, mapInstance])\n\n  useEffect(() => {\n    if (dependenciesReady) {\n      if (mapContainerRef.current) {\n        resizer.observe(mapContainerRef.current)\n      }\n\n      return () => {\n        resizer.disconnect()\n      }\n    }\n  }, [active, dependenciesReady, mapCanvasRef, mapContainerRef, mapInstance, resizer])\n}\n","import { assertEx } from '@xylabs/assert'\nimport { GeoJson } from '@xyo-network/sdk-geo'\nimport { Feature, Geometry } from 'geojson'\n// eslint-disable-next-line no-restricted-imports\nimport { GeoJSONSource, Map } from 'mapbox-gl'\n\nimport { MapLayer } from '../Layers'\n\nexport interface MapBaseConfig<T extends Geometry> {\n  features: Feature<T>[]\n  map: Map\n  requestLocation?: boolean\n  zoom?: number\n}\n\nexport abstract class MapBase<T extends Geometry> {\n  private _config: MapBaseConfig<T>\n\n  constructor(config: MapBaseConfig<T>) {\n    this._config = { requestLocation: true, zoom: 2, ...config }\n  }\n\n  get isMapReady() {\n    return !!this._config.map\n  }\n\n  initializeMapSource(layer: MapLayer) {\n    const getSource = () => {\n      const featuresCollection = GeoJson.featureCollection(this._config.features)\n      return GeoJson.featuresSource(featuresCollection)\n    }\n\n    const existingSource = this._config.map.getSource(layer.source as string) as GeoJSONSource\n    const source = getSource()\n    if (existingSource) {\n      existingSource.setData(assertEx(source.data as GeoJSON.Feature<GeoJSON.Geometry> | GeoJSON.FeatureCollection<GeoJSON.Geometry>))\n    } else {\n      this._config.map.addSource(layer.source as string, source)\n    }\n    layer.update(this._config.map, true)\n\n    return this\n  }\n}\n","import { Feature, Point } from 'geojson'\n// eslint-disable-next-line no-restricted-imports\nimport { FitBoundsOptions, LngLatBounds } from 'mapbox-gl'\n\nimport { MapBase, MapBaseConfig } from './MapBase'\n\nexport interface MapPointsConfig extends MapBaseConfig<Point> {\n  features: Feature<Point>[]\n}\n\nexport class MapPoints extends MapBase<Point> {\n  private config: MapPointsConfig\n\n  constructor(config: MapPointsConfig) {\n    super(config)\n    this.config = config\n  }\n\n  initialMapPositioning(options: FitBoundsOptions, initialBounds?: LngLatBounds) {\n    let bounds: LngLatBounds\n\n    if (initialBounds) {\n      bounds = initialBounds\n    } else {\n      bounds = new LngLatBounds()\n\n      this.config.features.forEach((feature: Feature<Point>) => {\n        bounds.extend(feature.geometry.coordinates as [number, number])\n      })\n    }\n\n    this.config.map.setCenter(bounds.getCenter())\n    this.config.map.fitBounds(bounds, options)\n\n    return this.config.map\n  }\n}\n","import { createContext } from 'react'\n\nimport { MapBoxInstanceState } from './State'\n\nconst MapBoxInstanceContext = createContext<MapBoxInstanceState>({})\n\nexport { MapBoxInstanceContext }\n","import { assertEx } from '@xylabs/assert'\nimport { useContext } from 'react'\n\nimport { MapBoxInstanceContext } from './Context'\n\nconst useMapBoxInstance = () => {\n  const context = useContext(MapBoxInstanceContext)\n  assertEx('map' in context, 'useMapBoxInstance must be used within a MapBoxInstanceContext')\n\n  return context\n}\n\nexport { useMapBoxInstance }\n","import { createContext } from 'react'\n\nimport { MapSettingsState } from './State'\n\nconst MapSettingsContext = createContext<MapSettingsState>({})\n\nexport { MapSettingsContext }\n","import { useContext } from 'react'\n\nimport { MapSettingsContext } from './Context'\n\nconst useMapSettings = () => {\n  const context = useContext(MapSettingsContext)\n\n  return context\n}\n\nexport { useMapSettings }\n","// eslint-disable-next-line import/no-internal-modules\nimport 'mapbox-gl/dist/mapbox-gl.css'\n\nimport { Map, MapboxOptions } from 'mapbox-gl'\nimport { useEffect, useRef, useState } from 'react'\n\nimport { useMapBoxInstance, useMapSettings } from '../Contexts'\nimport { useDynamicMapResize } from '../hooks'\nimport { MapStyle } from '../lib'\n\nexport interface MapBoxProps {\n  accessToken: string\n  darkMode?: boolean\n  options?: Partial<MapboxOptions>\n  zoom?: number\n}\n\nexport const MapBox: React.FC<MapBoxProps> = ({ accessToken, darkMode = false, options, zoom = 2, ...props }) => {\n  const [map, setMap] = useState<Map>()\n  const mapContainerRef = useRef<HTMLDivElement | null>(null)\n  const mapCanvasRef = useRef<HTMLCanvasElement | null>(null)\n  const { setMapBoxInstance, map: mapInstance } = useMapBoxInstance()\n  const { mapSettings } = useMapSettings()\n\n  const activeResize = mapSettings?.dynamicMapResize.value\n  useDynamicMapResize(mapContainerRef, mapCanvasRef, mapInstance, activeResize)\n\n  useEffect(() => {\n    if (mapSettings?.preferDark?.value === true) {\n      map?.setStyle(`mapbox://styles/${MapStyle.Dark}`)\n    } else {\n      map?.setStyle(`mapbox://styles/${darkMode ? MapStyle.Dark : MapStyle.Light}`)\n    }\n  }, [map, darkMode, mapSettings])\n\n  useEffect(() => {\n    const map = new Map({\n      accessToken,\n      center: [0, 0],\n      container: mapContainerRef.current ?? '',\n      style: `mapbox://styles/${MapStyle.Light}`,\n      zoom,\n      ...options,\n    })\n\n    // Allow external components to control the map\n    setMapBoxInstance?.(map)\n    setMap(map)\n\n    // save the map canvas ref to help with resizing\n    mapCanvasRef.current = document.querySelector('.mapboxgl-canvas')\n\n    console.log('Created Map')\n\n    return () => {\n      console.log('Removing Map')\n      map.remove()\n    }\n  }, [mapContainerRef, setMap, options, zoom, setMapBoxInstance, accessToken])\n\n  return (\n    <div\n      ref={(el) => (mapContainerRef.current = el)}\n      style={{\n        bottom: 0,\n        left: 0,\n        position: 'absolute',\n        right: 0,\n        top: 0,\n        ...props,\n      }}\n    />\n  )\n}\n","import { FormControlLabel, Switch, SwitchProps } from '@mui/material'\n\nimport { useMapSettings } from '../../Contexts'\n\nexport interface MapSettingSwitchProps extends SwitchProps {\n  developerMode?: boolean\n  field: string\n}\n\nexport const MapSettingSwitch: React.FC<MapSettingSwitchProps> = ({ developerMode, field, ...props }) => {\n  const { mapSettings, setMapSettings } = useMapSettings()\n  const setting = mapSettings?.[field]\n\n  const onLocalChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n    if (setting) {\n      setMapSettings?.((previous) => {\n        previous[setting.field].value = event.target.checked\n        return { ...previous }\n      })\n    }\n  }\n\n  if (setting?.devMode && developerMode === false) {\n    return null\n  }\n\n  return setting?.hidden ? null : (\n    <FormControlLabel label={setting?.label} control={<Switch checked={setting?.value} onChange={onLocalChange} {...props} />} />\n  )\n}\n","import { Paper, Stack } from '@mui/material'\nimport { FlexBoxProps, FlexGrowRow, FlexRow } from '@xylabs/react-flexbox'\nimport { useAppSettings } from '@xyo-network/react-app-settings'\n\nimport { useMapSettings } from '../../Contexts'\nimport { MapSettingSwitch } from './Setting'\n\nexport interface MapSettingsBoxProps extends FlexBoxProps {\n  developerMode?: boolean\n}\n\nexport const MapSettingsBox: React.FC<MapSettingsBoxProps> = ({ developerMode, ...props }) => {\n  const { mapSettings } = useMapSettings()\n  const { developerMode: devModeFromContext } = useAppSettings()\n  const resolveDeveloperMode = developerMode ?? devModeFromContext\n\n  return mapSettings && resolveDeveloperMode ? (\n    <FlexGrowRow bottom={36} left={10} position=\"absolute\" {...props}>\n      <FlexRow paddingX={2}>\n        <Paper>\n          <Stack direction=\"row\" spacing={1} marginX={1}>\n            {Object.keys(mapSettings).map((key, index) => {\n              return <MapSettingSwitch key={index} field={mapSettings[key].field} developerMode={developerMode} />\n            })}\n          </Stack>\n        </Paper>\n      </FlexRow>\n    </FlexGrowRow>\n  ) : null\n}\n"],"mappings":"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","names":["import_material","import_react_flexbox","import_react","dependenciesReady","import_react","import_assert","import_react","import_react","import_react","import_mapbox_gl","import_react","map","import_jsx_runtime","import_material","import_jsx_runtime","import_jsx_runtime","zoom"]}

package/dist/browser/Components/MapBoxPoints.js

@@ -1,259 +0,0 @@
-// src/Components/MapBoxPoints.tsx
-import { Alert } from "@mui/material";
-import { FlexCol } from "@xylabs/react-flexbox";
-import { useCallback, useEffect as useEffect3, useState as useState3 } from "react";
-
-// src/hooks/useDynamicMapResize.tsx
-import { useEffect, useMemo, useState } from "react";
-var useDynamicMapResize = (mapContainerRef, mapCanvasRef, mapInstance, active = true) => {
-  const [dependenciesReady, setDependenciesReady] = useState(false);
-  const resizer = useMemo(
-    () => new ResizeObserver(() => {
-      const width = mapContainerRef.current?.getBoundingClientRect().width;
-      if (width && mapCanvasRef.current) {
-        mapCanvasRef.current.style.width = `${width}px`;
-        setTimeout(() => mapInstance?.resize());
-      }
-    }),
-    [mapCanvasRef, mapContainerRef, mapInstance]
-  );
-  useEffect(() => {
-    const dependenciesReady2 = !!(active && mapInstance && mapContainerRef?.current && mapCanvasRef.current);
-    setDependenciesReady(dependenciesReady2);
-  }, [active, mapCanvasRef, mapContainerRef, mapInstance]);
-  useEffect(() => {
-    if (dependenciesReady) {
-      if (mapContainerRef.current) {
-        resizer.observe(mapContainerRef.current);
-      }
-      return () => {
-        resizer.disconnect();
-      };
-    }
-  }, [active, dependenciesReady, mapCanvasRef, mapContainerRef, mapInstance, resizer]);
-};
-
-// src/MapBoxClasses/MapBase.ts
-import { assertEx } from "@xylabs/assert";
-import { GeoJson } from "@xyo-network/sdk-geo";
-var MapBase = class {
-  _config;
-  constructor(config) {
-    this._config = { requestLocation: true, zoom: 2, ...config };
-  }
-  get isMapReady() {
-    return !!this._config.map;
-  }
-  initializeMapSource(layer) {
-    const getSource = () => {
-      const featuresCollection = GeoJson.featureCollection(this._config.features);
-      return GeoJson.featuresSource(featuresCollection);
-    };
-    const existingSource = this._config.map.getSource(layer.source);
-    const source = getSource();
-    if (existingSource) {
-      existingSource.setData(assertEx(source.data));
-    } else {
-      this._config.map.addSource(layer.source, source);
-    }
-    layer.update(this._config.map, true);
-    return this;
-  }
-};
-
-// src/MapBoxClasses/MapPoints.ts
-import { LngLatBounds } from "mapbox-gl";
-var MapPoints = class extends MapBase {
-  config;
-  constructor(config) {
-    super(config);
-    this.config = config;
-  }
-  initialMapPositioning(options, initialBounds) {
-    let bounds;
-    if (initialBounds) {
-      bounds = initialBounds;
-    } else {
-      bounds = new LngLatBounds();
-      this.config.features.forEach((feature) => {
-        bounds.extend(feature.geometry.coordinates);
-      });
-    }
-    this.config.map.setCenter(bounds.getCenter());
-    this.config.map.fitBounds(bounds, options);
-    return this.config.map;
-  }
-};
-
-// src/Contexts/MapBoxInstance/Context.ts
-import { createContext } from "react";
-var MapBoxInstanceContext = createContext({});
-
-// src/Contexts/MapBoxInstance/useMapBoxInstance.tsx
-import { assertEx as assertEx2 } from "@xylabs/assert";
-import { useContext } from "react";
-var useMapBoxInstance = () => {
-  const context = useContext(MapBoxInstanceContext);
-  assertEx2("map" in context, "useMapBoxInstance must be used within a MapBoxInstanceContext");
-  return context;
-};
-
-// src/Contexts/MapSettings/Context.ts
-import { createContext as createContext2 } from "react";
-var MapSettingsContext = createContext2({});
-
-// src/Contexts/MapSettings/useMapSettings.tsx
-import { useContext as useContext2 } from "react";
-var useMapSettings = () => {
-  const context = useContext2(MapSettingsContext);
-  return context;
-};
-
-// src/Components/MapBox.tsx
-import "mapbox-gl/dist/mapbox-gl.css";
-import { Map } from "mapbox-gl";
-import { useEffect as useEffect2, useRef, useState as useState2 } from "react";
-import { jsx } from "react/jsx-runtime";
-var MapBox = ({ accessToken, darkMode = false, options, zoom = 2, ...props }) => {
-  const [map, setMap] = useState2();
-  const mapContainerRef = useRef(null);
-  const mapCanvasRef = useRef(null);
-  const { setMapBoxInstance, map: mapInstance } = useMapBoxInstance();
-  const { mapSettings } = useMapSettings();
-  const activeResize = mapSettings?.dynamicMapResize.value;
-  useDynamicMapResize(mapContainerRef, mapCanvasRef, mapInstance, activeResize);
-  useEffect2(() => {
-    if (mapSettings?.preferDark?.value === true) {
-      map?.setStyle(`mapbox://styles/${"mapbox/dark-v10" /* Dark */}`);
-    } else {
-      map?.setStyle(`mapbox://styles/${darkMode ? "mapbox/dark-v10" /* Dark */ : "mapbox/light-v10" /* Light */}`);
-    }
-  }, [map, darkMode, mapSettings]);
-  useEffect2(() => {
-    const map2 = new Map({
-      accessToken,
-      center: [0, 0],
-      container: mapContainerRef.current ?? "",
-      style: `mapbox://styles/${"mapbox/light-v10" /* Light */}`,
-      zoom,
-      ...options
-    });
-    setMapBoxInstance?.(map2);
-    setMap(map2);
-    mapCanvasRef.current = document.querySelector(".mapboxgl-canvas");
-    console.log("Created Map");
-    return () => {
-      console.log("Removing Map");
-      map2.remove();
-    };
-  }, [mapContainerRef, setMap, options, zoom, setMapBoxInstance, accessToken]);
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      ref: (el) => mapContainerRef.current = el,
-      style: {
-        bottom: 0,
-        left: 0,
-        position: "absolute",
-        right: 0,
-        top: 0,
-        ...props
-      }
-    }
-  );
-};
-
-// src/Components/MapSettingsComponents/Setting.tsx
-import { FormControlLabel, Switch } from "@mui/material";
-import { jsx as jsx2 } from "react/jsx-runtime";
-var MapSettingSwitch = ({ developerMode, field, ...props }) => {
-  const { mapSettings, setMapSettings } = useMapSettings();
-  const setting = mapSettings?.[field];
-  const onLocalChange = (event) => {
-    if (setting) {
-      setMapSettings?.((previous) => {
-        previous[setting.field].value = event.target.checked;
-        return { ...previous };
-      });
-    }
-  };
-  if (setting?.devMode && developerMode === false) {
-    return null;
-  }
-  return setting?.hidden ? null : /* @__PURE__ */ jsx2(FormControlLabel, { label: setting?.label, control: /* @__PURE__ */ jsx2(Switch, { checked: setting?.value, onChange: onLocalChange, ...props }) });
-};
-
-// src/Components/MapSettingsComponents/SettingsBox.tsx
-import { Paper, Stack } from "@mui/material";
-import { FlexGrowRow, FlexRow } from "@xylabs/react-flexbox";
-import { useAppSettings } from "@xyo-network/react-app-settings";
-import { jsx as jsx3 } from "react/jsx-runtime";
-var MapSettingsBox = ({ developerMode, ...props }) => {
-  const { mapSettings } = useMapSettings();
-  const { developerMode: devModeFromContext } = useAppSettings();
-  const resolveDeveloperMode = developerMode ?? devModeFromContext;
-  return mapSettings && resolveDeveloperMode ? /* @__PURE__ */ jsx3(FlexGrowRow, { bottom: 36, left: 10, position: "absolute", ...props, children: /* @__PURE__ */ jsx3(FlexRow, { paddingX: 2, children: /* @__PURE__ */ jsx3(Paper, { children: /* @__PURE__ */ jsx3(Stack, { direction: "row", spacing: 1, marginX: 1, children: Object.keys(mapSettings).map((key, index) => {
-    return /* @__PURE__ */ jsx3(MapSettingSwitch, { field: mapSettings[key].field, developerMode }, index);
-  }) }) }) }) }) : null;
-};
-
-// src/Components/MapBoxPoints.tsx
-import { Fragment, jsx as jsx4, jsxs } from "react/jsx-runtime";
-var MapboxPointsFlexBox = ({
-  accessToken,
-  features,
-  fitToPointsPadding = 20,
-  layers,
-  zoom,
-  ...props
-}) => {
-  const [mapPoints, setMapPoints] = useState3();
-  const { mapSettings } = useMapSettings();
-  const { map, mapInitialized } = useMapBoxInstance();
-  const customFitToBoundsOptions = (zoom2) => {
-    if (zoom2 !== void 0) {
-      return {
-        maxZoom: zoom2
-      };
-    }
-    return {};
-  };
-  const updateFeatures = useCallback(() => {
-    if (mapPoints?.isMapReady && features?.length) {
-      layers?.forEach((layer) => {
-        mapPoints.initializeMapSource(layer);
-      });
-    }
-  }, [mapPoints, features, layers]);
-  const updateMapSetup = useCallback(() => {
-    const { fitToPoints } = mapSettings || {};
-    if (mapPoints && map) {
-      if (fitToPoints?.value === true) {
-        mapPoints.initialMapPositioning({ padding: fitToPointsPadding, ...customFitToBoundsOptions(zoom) });
-      }
-    }
-  }, [mapSettings, mapPoints, map, fitToPointsPadding, zoom]);
-  const reInitializeMap = useCallback(() => {
-    mapPoints?.initialMapPositioning({ padding: fitToPointsPadding, ...customFitToBoundsOptions(zoom) });
-    updateFeatures();
-  }, [mapPoints, fitToPointsPadding, updateFeatures, zoom]);
-  useEffect3(() => {
-    if (map && features?.length) {
-      setMapPoints(new MapPoints({ features, map, zoom }));
-    }
-  }, [map, features, zoom]);
-  useEffect3(() => {
-    if (mapInitialized) {
-      updateMapSetup();
-      reInitializeMap();
-    }
-  }, [mapInitialized, reInitializeMap, updateMapSetup]);
-  return /* @__PURE__ */ jsx4(FlexCol, { alignItems: "stretch", id: "xyo-mapbox-wrap", ...props, children: features ? /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx4(MapBox, { accessToken, zoom }),
-    /* @__PURE__ */ jsx4(MapSettingsBox, {})
-  ] }) : /* @__PURE__ */ jsx4(Alert, { severity: "error", children: "No data to show" }) });
-};
-export {
-  MapboxPointsFlexBox
-};
-//# sourceMappingURL=MapBoxPoints.js.map

package/dist/browser/Components/MapBoxPoints.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/Components/MapBoxPoints.tsx","../../../src/hooks/useDynamicMapResize.tsx","../../../src/MapBoxClasses/MapBase.ts","../../../src/MapBoxClasses/MapPoints.ts","../../../src/Contexts/MapBoxInstance/Context.ts","../../../src/Contexts/MapBoxInstance/useMapBoxInstance.tsx","../../../src/Contexts/MapSettings/Context.ts","../../../src/Contexts/MapSettings/useMapSettings.tsx","../../../src/Components/MapBox.tsx","../../../src/Components/MapSettingsComponents/Setting.tsx","../../../src/Components/MapSettingsComponents/SettingsBox.tsx"],"sourcesContent":["import { Alert } from '@mui/material'\nimport { FlexCol } from '@xylabs/react-flexbox'\nimport { Feature, Point } from 'geojson'\nimport { FitBoundsOptions } from 'mapbox-gl'\nimport { useCallback, useEffect, useState } from 'react'\n\nimport { useMapBoxInstance, useMapSettings } from '../Contexts'\nimport { MapboxFlexBoxProps } from '../lib'\nimport { MapPoints } from '../MapBoxClasses'\nimport { MapBox } from './MapBox'\nimport { MapSettingsBox } from './MapSettingsComponents'\n\nexport interface MapboxPointsFlexBoxProps extends MapboxFlexBoxProps {\n  accessToken: string\n  features?: Feature<Point>[]\n}\n\nexport const MapboxPointsFlexBox: React.FC<MapboxPointsFlexBoxProps> = ({\n  accessToken,\n  features,\n  fitToPointsPadding = 20,\n  layers,\n  zoom,\n  ...props\n}) => {\n  const [mapPoints, setMapPoints] = useState<MapPoints>()\n  const { mapSettings } = useMapSettings()\n  const { map, mapInitialized } = useMapBoxInstance()\n\n  /**\n   * Needed because of a bug in mapbox taking undefined values for the config options of fitToBounds\n   * see - https://github.com/mapbox/mapbox-gl-js/issues/10013\n   */\n  const customFitToBoundsOptions = (zoom?: number): FitBoundsOptions => {\n    if (zoom !== undefined) {\n      return {\n        maxZoom: zoom,\n      }\n    }\n    return {}\n  }\n\n  const updateFeatures = useCallback(() => {\n    if (mapPoints?.isMapReady && features?.length) {\n      layers?.forEach((layer) => {\n        mapPoints.initializeMapSource(layer)\n      })\n    }\n  }, [mapPoints, features, layers])\n\n  const updateMapSetup = useCallback(() => {\n    const { fitToPoints } = mapSettings || {}\n\n    if (mapPoints && map) {\n      if (fitToPoints?.value === true) {\n        mapPoints.initialMapPositioning({ padding: fitToPointsPadding, ...customFitToBoundsOptions(zoom) })\n      }\n    }\n  }, [mapSettings, mapPoints, map, fitToPointsPadding, zoom])\n\n  const reInitializeMap = useCallback(() => {\n    mapPoints?.initialMapPositioning({ padding: fitToPointsPadding, ...customFitToBoundsOptions(zoom) })\n    updateFeatures()\n  }, [mapPoints, fitToPointsPadding, updateFeatures, zoom])\n\n  useEffect(() => {\n    if (map && features?.length) {\n      setMapPoints(new MapPoints({ features, map, zoom }))\n    }\n  }, [map, features, zoom])\n\n  useEffect(() => {\n    if (mapInitialized) {\n      updateMapSetup()\n      reInitializeMap()\n    }\n  }, [mapInitialized, reInitializeMap, updateMapSetup])\n\n  return (\n    <FlexCol alignItems=\"stretch\" id=\"xyo-mapbox-wrap\" {...props}>\n      {features ? (\n        <>\n          <MapBox accessToken={accessToken} zoom={zoom} />\n          <MapSettingsBox />\n        </>\n      ) : (\n        <Alert severity=\"error\">No data to show</Alert>\n      )}\n    </FlexCol>\n  )\n}\n","import { Map } from 'mapbox-gl'\nimport { MutableRefObject, useEffect, useMemo, useState } from 'react'\n\n/**\n * Inspired by - https://bl.ocks.org/danswick/fc56f37c10d40be62e4feac5984250d2\n */\nexport const useDynamicMapResize = (\n  mapContainerRef: MutableRefObject<HTMLDivElement | null>,\n  mapCanvasRef: MutableRefObject<HTMLCanvasElement | null>,\n  mapInstance?: Map,\n  active = true,\n) => {\n  const [dependenciesReady, setDependenciesReady] = useState(false)\n\n  const resizer = useMemo(\n    () =>\n      new ResizeObserver(() => {\n        const width = mapContainerRef.current?.getBoundingClientRect().width\n        if (width && mapCanvasRef.current) {\n          mapCanvasRef.current.style.width = `${width}px`\n          // setTimeout allows for the smoothest animation (vs requestAnimationFrame, debouce, etc)\n          // likely because it lets mapbox resize once when the event loop is ready?\n          setTimeout(() => mapInstance?.resize())\n        }\n      }),\n    [mapCanvasRef, mapContainerRef, mapInstance],\n  )\n\n  useEffect(() => {\n    const dependenciesReady = !!(active && mapInstance && mapContainerRef?.current && mapCanvasRef.current)\n    setDependenciesReady(dependenciesReady)\n  }, [active, mapCanvasRef, mapContainerRef, mapInstance])\n\n  useEffect(() => {\n    if (dependenciesReady) {\n      if (mapContainerRef.current) {\n        resizer.observe(mapContainerRef.current)\n      }\n\n      return () => {\n        resizer.disconnect()\n      }\n    }\n  }, [active, dependenciesReady, mapCanvasRef, mapContainerRef, mapInstance, resizer])\n}\n","import { assertEx } from '@xylabs/assert'\nimport { GeoJson } from '@xyo-network/sdk-geo'\nimport { Feature, Geometry } from 'geojson'\n// eslint-disable-next-line no-restricted-imports\nimport { GeoJSONSource, Map } from 'mapbox-gl'\n\nimport { MapLayer } from '../Layers'\n\nexport interface MapBaseConfig<T extends Geometry> {\n  features: Feature<T>[]\n  map: Map\n  requestLocation?: boolean\n  zoom?: number\n}\n\nexport abstract class MapBase<T extends Geometry> {\n  private _config: MapBaseConfig<T>\n\n  constructor(config: MapBaseConfig<T>) {\n    this._config = { requestLocation: true, zoom: 2, ...config }\n  }\n\n  get isMapReady() {\n    return !!this._config.map\n  }\n\n  initializeMapSource(layer: MapLayer) {\n    const getSource = () => {\n      const featuresCollection = GeoJson.featureCollection(this._config.features)\n      return GeoJson.featuresSource(featuresCollection)\n    }\n\n    const existingSource = this._config.map.getSource(layer.source as string) as GeoJSONSource\n    const source = getSource()\n    if (existingSource) {\n      existingSource.setData(assertEx(source.data as GeoJSON.Feature<GeoJSON.Geometry> | GeoJSON.FeatureCollection<GeoJSON.Geometry>))\n    } else {\n      this._config.map.addSource(layer.source as string, source)\n    }\n    layer.update(this._config.map, true)\n\n    return this\n  }\n}\n","import { Feature, Point } from 'geojson'\n// eslint-disable-next-line no-restricted-imports\nimport { FitBoundsOptions, LngLatBounds } from 'mapbox-gl'\n\nimport { MapBase, MapBaseConfig } from './MapBase'\n\nexport interface MapPointsConfig extends MapBaseConfig<Point> {\n  features: Feature<Point>[]\n}\n\nexport class MapPoints extends MapBase<Point> {\n  private config: MapPointsConfig\n\n  constructor(config: MapPointsConfig) {\n    super(config)\n    this.config = config\n  }\n\n  initialMapPositioning(options: FitBoundsOptions, initialBounds?: LngLatBounds) {\n    let bounds: LngLatBounds\n\n    if (initialBounds) {\n      bounds = initialBounds\n    } else {\n      bounds = new LngLatBounds()\n\n      this.config.features.forEach((feature: Feature<Point>) => {\n        bounds.extend(feature.geometry.coordinates as [number, number])\n      })\n    }\n\n    this.config.map.setCenter(bounds.getCenter())\n    this.config.map.fitBounds(bounds, options)\n\n    return this.config.map\n  }\n}\n","import { createContext } from 'react'\n\nimport { MapBoxInstanceState } from './State'\n\nconst MapBoxInstanceContext = createContext<MapBoxInstanceState>({})\n\nexport { MapBoxInstanceContext }\n","import { assertEx } from '@xylabs/assert'\nimport { useContext } from 'react'\n\nimport { MapBoxInstanceContext } from './Context'\n\nconst useMapBoxInstance = () => {\n  const context = useContext(MapBoxInstanceContext)\n  assertEx('map' in context, 'useMapBoxInstance must be used within a MapBoxInstanceContext')\n\n  return context\n}\n\nexport { useMapBoxInstance }\n","import { createContext } from 'react'\n\nimport { MapSettingsState } from './State'\n\nconst MapSettingsContext = createContext<MapSettingsState>({})\n\nexport { MapSettingsContext }\n","import { useContext } from 'react'\n\nimport { MapSettingsContext } from './Context'\n\nconst useMapSettings = () => {\n  const context = useContext(MapSettingsContext)\n\n  return context\n}\n\nexport { useMapSettings }\n","// eslint-disable-next-line import/no-internal-modules\nimport 'mapbox-gl/dist/mapbox-gl.css'\n\nimport { Map, MapboxOptions } from 'mapbox-gl'\nimport { useEffect, useRef, useState } from 'react'\n\nimport { useMapBoxInstance, useMapSettings } from '../Contexts'\nimport { useDynamicMapResize } from '../hooks'\nimport { MapStyle } from '../lib'\n\nexport interface MapBoxProps {\n  accessToken: string\n  darkMode?: boolean\n  options?: Partial<MapboxOptions>\n  zoom?: number\n}\n\nexport const MapBox: React.FC<MapBoxProps> = ({ accessToken, darkMode = false, options, zoom = 2, ...props }) => {\n  const [map, setMap] = useState<Map>()\n  const mapContainerRef = useRef<HTMLDivElement | null>(null)\n  const mapCanvasRef = useRef<HTMLCanvasElement | null>(null)\n  const { setMapBoxInstance, map: mapInstance } = useMapBoxInstance()\n  const { mapSettings } = useMapSettings()\n\n  const activeResize = mapSettings?.dynamicMapResize.value\n  useDynamicMapResize(mapContainerRef, mapCanvasRef, mapInstance, activeResize)\n\n  useEffect(() => {\n    if (mapSettings?.preferDark?.value === true) {\n      map?.setStyle(`mapbox://styles/${MapStyle.Dark}`)\n    } else {\n      map?.setStyle(`mapbox://styles/${darkMode ? MapStyle.Dark : MapStyle.Light}`)\n    }\n  }, [map, darkMode, mapSettings])\n\n  useEffect(() => {\n    const map = new Map({\n      accessToken,\n      center: [0, 0],\n      container: mapContainerRef.current ?? '',\n      style: `mapbox://styles/${MapStyle.Light}`,\n      zoom,\n      ...options,\n    })\n\n    // Allow external components to control the map\n    setMapBoxInstance?.(map)\n    setMap(map)\n\n    // save the map canvas ref to help with resizing\n    mapCanvasRef.current = document.querySelector('.mapboxgl-canvas')\n\n    console.log('Created Map')\n\n    return () => {\n      console.log('Removing Map')\n      map.remove()\n    }\n  }, [mapContainerRef, setMap, options, zoom, setMapBoxInstance, accessToken])\n\n  return (\n    <div\n      ref={(el) => (mapContainerRef.current = el)}\n      style={{\n        bottom: 0,\n        left: 0,\n        position: 'absolute',\n        right: 0,\n        top: 0,\n        ...props,\n      }}\n    />\n  )\n}\n","import { FormControlLabel, Switch, SwitchProps } from '@mui/material'\n\nimport { useMapSettings } from '../../Contexts'\n\nexport interface MapSettingSwitchProps extends SwitchProps {\n  developerMode?: boolean\n  field: string\n}\n\nexport const MapSettingSwitch: React.FC<MapSettingSwitchProps> = ({ developerMode, field, ...props }) => {\n  const { mapSettings, setMapSettings } = useMapSettings()\n  const setting = mapSettings?.[field]\n\n  const onLocalChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n    if (setting) {\n      setMapSettings?.((previous) => {\n        previous[setting.field].value = event.target.checked\n        return { ...previous }\n      })\n    }\n  }\n\n  if (setting?.devMode && developerMode === false) {\n    return null\n  }\n\n  return setting?.hidden ? null : (\n    <FormControlLabel label={setting?.label} control={<Switch checked={setting?.value} onChange={onLocalChange} {...props} />} />\n  )\n}\n","import { Paper, Stack } from '@mui/material'\nimport { FlexBoxProps, FlexGrowRow, FlexRow } from '@xylabs/react-flexbox'\nimport { useAppSettings } from '@xyo-network/react-app-settings'\n\nimport { useMapSettings } from '../../Contexts'\nimport { MapSettingSwitch } from './Setting'\n\nexport interface MapSettingsBoxProps extends FlexBoxProps {\n  developerMode?: boolean\n}\n\nexport const MapSettingsBox: React.FC<MapSettingsBoxProps> = ({ developerMode, ...props }) => {\n  const { mapSettings } = useMapSettings()\n  const { developerMode: devModeFromContext } = useAppSettings()\n  const resolveDeveloperMode = developerMode ?? devModeFromContext\n\n  return mapSettings && resolveDeveloperMode ? (\n    <FlexGrowRow bottom={36} left={10} position=\"absolute\" {...props}>\n      <FlexRow paddingX={2}>\n        <Paper>\n          <Stack direction=\"row\" spacing={1} marginX={1}>\n            {Object.keys(mapSettings).map((key, index) => {\n              return <MapSettingSwitch key={index} field={mapSettings[key].field} developerMode={developerMode} />\n            })}\n          </Stack>\n        </Paper>\n      </FlexRow>\n    </FlexGrowRow>\n  ) : null\n}\n"],"mappings":"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","names":["useEffect","useState","dependenciesReady","assertEx","assertEx","createContext","useContext","useContext","useEffect","useState","useState","useEffect","map","jsx","jsx","jsx","useState","zoom","useEffect"]}