diff --git a/package-lock.json b/package-lock.json index b1a8116cb..8fdbdcf72 100644 --- a/package-lock.json +++ b/package-lock.json @@ -21465,7 +21465,7 @@ }, "packages/map-template": { "name": "@mapsindoors/map-template", - "version": "1.66.2", + "version": "1.66.3", "devDependencies": { "@googlemaps/js-api-loader": "^1.15.1", "@mapsindoors/components": "*", diff --git a/packages/map-template/CHANGELOG.md b/packages/map-template/CHANGELOG.md index b9565fa8f..31f77fa8a 100644 --- a/packages/map-template/CHANGELOG.md +++ b/packages/map-template/CHANGELOG.md @@ -5,6 +5,18 @@ All notable changes to this project will be documented in this file. The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html). +## [1.66.4] - 2025-01-23 + +## Fixed + +- Fix `miTransitionLevel` prop breaking the React Component package. + +## [1.66.3] - 2025-01-23 + +## Fixed + +- Fix package-lock issues. + ## [1.66.2] - 2025-01-21 ## Fixed diff --git a/packages/map-template/src/components/MapWrapper/MapWrapper.jsx b/packages/map-template/src/components/MapWrapper/MapWrapper.jsx index 016a9b51c..1266128ea 100644 --- a/packages/map-template/src/components/MapWrapper/MapWrapper.jsx +++ b/packages/map-template/src/components/MapWrapper/MapWrapper.jsx @@ -1,4 +1,4 @@ -import { useEffect } from "react"; +import { useEffect, useState } from "react"; import { useRecoilState, useRecoilValue } from 'recoil'; import MIMap from '@mapsindoors/react-components/src/components/MIMap/MIMap'; import { mapTypes } from "../../constants/mapTypes"; @@ -20,6 +20,7 @@ import solutionState from '../../atoms/solutionState'; import notificationMessageState from '../../atoms/notificationMessageState'; import useMapBoundsDeterminer from '../../hooks/useMapBoundsDeterminer'; import hideNonMatchesState from "../../atoms/hideNonMatchesState"; +import miTransitionLevelState from "../../atoms/miTransitionLevelState"; /** * Private variable used for storing the tile style. @@ -57,6 +58,8 @@ function MapWrapper({ onLocationClick, onMapPositionKnown, useMapProviderModule, const solution = useRecoilValue(solutionState); const [, setErrorMessage] = useRecoilState(notificationMessageState); const hideNonMatches = useRecoilValue(hideNonMatchesState); + const [mapOptions, setMapOptions] = useState({}); + const miTransitionLevel = useRecoilValue(miTransitionLevelState); useLiveData(apiKey); @@ -274,6 +277,15 @@ function MapWrapper({ onLocationClick, onMapPositionKnown, useMapProviderModule, onTileStyleChanged(mapsIndoorsInstance); }, [tileStyle]); + /** + * React on changes in the miTransitionLevel prop. + */ + useEffect(() => { + if (!isNaN(parseInt(miTransitionLevel))) { + setMapOptions({ miTransitionLevel: miTransitionLevel}) + } + }, [miTransitionLevel]) + return (<> {apiKey && } ) }; diff --git a/packages/react-components/src/components/MIMap/MapboxMap/MapboxMap.jsx b/packages/react-components/src/components/MIMap/MapboxMap/MapboxMap.jsx index 05c2f2bb6..8c7d68df7 100644 --- a/packages/react-components/src/components/MIMap/MapboxMap/MapboxMap.jsx +++ b/packages/react-components/src/components/MIMap/MapboxMap/MapboxMap.jsx @@ -6,8 +6,6 @@ import './MapboxMap.scss'; import ViewModeSwitch from './ViewModeSwitch/ViewModeSwitch'; import { useIsDesktop } from '../../../hooks/useIsDesktop'; import isNullOrUndefined from '../../../../../map-template/src/helpers/isNullOrUndefined'; -import { useRecoilValue } from 'recoil'; -import miTransitionLevelState from '../../../../../map-template/src/atoms/miTransitionLevelState'; MapboxMap.propTypes = { accessToken: PropTypes.string.isRequired, @@ -46,7 +44,6 @@ function MapboxMap({ accessToken, onInitialized, onPositionControl, center, zoom const [hasPositionControl, setHasPositionControl] = useState(false); const [hasZoomControl, setHasZoomControl] = useState(false); const isDesktop = useIsDesktop(); - const miTransitionLevel = useRecoilValue(miTransitionLevelState); /* * React on any props that are used to control the position of the map. @@ -138,8 +135,8 @@ function MapboxMap({ accessToken, onInitialized, onPositionControl, center, zoom }; // If miTransitionLevel exists and it's a number, set it in the mapViewOptions - if (miTransitionLevel && !isNaN(parseInt(miTransitionLevel))) { - mapViewOptions.mapsIndoorsTransitionLevel = parseInt(miTransitionLevel); + if (mapOptions?.miTransitionLevel && !isNaN(parseInt(mapOptions?.miTransitionLevel))) { + mapViewOptions.mapsIndoorsTransitionLevel = parseInt(mapOptions.miTransitionLevel); } const mapView = new window.mapsindoors.mapView.MapboxV3View(mapViewOptions); diff --git a/packages/react-components/src/main.jsx b/packages/react-components/src/main.jsx index 99f21ac9e..4fe035e1e 100644 --- a/packages/react-components/src/main.jsx +++ b/packages/react-components/src/main.jsx @@ -1,4 +1,3 @@ -import React from 'react' import ReactDOM from 'react-dom/client' import App from './App.jsx' import './index.css'