@opengeoweb/core 9.32.1 → 9.33.1-spike-ol.3

package/index.esm.js

@@ -5,7 +5,7 @@ import { Grid2, Box, MenuItem, Typography, useTheme, Popper, Fade, Tooltip, styl
 import { SHARED_NAMESPACE, sharedTranslations, CustomIconButton, TooltipSelect, AlertIcon, sliderHeaderStyle, CustomSlider, ToggleMenu, CustomTooltip, tooltipContainerStyles, renderCounter, AlertBanner, CustomAccordion, PROJECTION, calculateStartSize, ToolContainerDraggable, useDebounce, dateUtils, withEggs, ErrorBoundary } from '@opengeoweb/shared';
 import { CollapseSmall, CollapseMedium, CollapseLarge, CollapseWindow, ExpandWindow, LayersAdd, CloudLoading, Copy, None, FastForward, AutoUpdateActive, Both, Visibility, VisibilityOff, Delete, DragHandle as DragHandle$1, Cached, Add, MapAdd, WorldMapProjection, Layers, ExitDomain, Info, Search, Exclamation, MyLocation, Close, ThemeWrapper, lightTheme, FlagBritain, FlagNetherlands, FlagFinland, FlagNorway } from '@opengeoweb/theme';
 import i18n from 'i18next';
-import { useTranslation, initReactI18next, I18nextProvider } from 'react-i18next';
+import { initReactI18next, useTranslation, I18nextProvider } from 'react-i18next';
 import { TIMESLIDER_NAMESPACE, timesliderTranslations, defaultTimeSpan, TIME_SLIDER_LEGEND_HEIGHT, SpeedButton, TimeStepButton, AnimationLengthButton, AnimationLength, TimeSpanButton, secondsPerPxFromCanvasWidth, getNewCenterOfFixedPointZoom, OptionsMenuButton, PlayButton, defaultTimeStep, BackwardForwardStepButton, AutoUpdateButton, NowButton, handleSetNowEvent, TimeSliderButtons, TimeSliderCurrentTimeBox, TimeSliderLegend, TimeSlider, onsetNewDateDebounced, getFilteredTime, ControlButtons, OptionsMenu, TimeSliderClock } from '@opengeoweb/timeslider';
 import { WEBMAP_REACT_NAMESPACE, webmapReactTranslations, WEBMAP_NAMESPACE, webmapTranslations, LayerInfoButton, LayerInfoDialog, MapControlButton, MapDimensionSelect, dimensionConfig, DimensionSelectDialog, DimensionSelectButton, ZoomControls, MapView, MapViewLayer, LegendDialog, LegendButton, registerDrawFunction, emptyGeoJSON, MapControls, publicLayers } from '@opengeoweb/webmap-react';
 import { useDispatch, useSelector, connect, useStore, Provider } from 'react-redux';
@@ -2141,9 +2141,6 @@ const layerManagerStyle = {
   '.header-layermanager': {
     containerType: 'inline-size'
   },
-  '.header-mapPresets': {
-    display: 'none'
-  },
   '.medium-layermanager': {
     display: 'none'
   },
@@ -2197,25 +2194,9 @@ const layerManagerStyle = {
       },
       '.column-2': {
         width: `calc((100% - ${leftButtonsWidth}px) )`
-      },
-      // presets
-      '.header-layer.mappresetsModule-enabled': {
-        display: 'none'
-      },
-      '.header-mapPresets': {
-        display: 'block',
-        '.MuiButtonBase-root': {
-          height: 24,
-          '.MuiBox-root': {
-            textAlign: 'center'
-          }
-        }
       }
     },
     '.header-layermanager': {
-      '.mapPresets-btn': {
-        display: 'none'
-      },
       '.collapseLarge-btn': {
         display: 'inline-flex'
       }
@@ -2287,7 +2268,7 @@ const LayerSelectButton = ({
   });
 };
 
-const _excluded$6 = ["mapPresetsModule", "settings", "addLayerComponent"];
+const _excluded$6 = ["settings", "addLayerComponent"];
 const styles$3 = {
   text: theme => Object.assign({
     paddingLeft: '10px',
@@ -2299,7 +2280,6 @@ const styles$3 = {
 const DescriptionRow = _ref => {
   var _settings$addLayer, _settings$addLayer2, _settings$layerName$t, _settings$layerName, _settings$layerStyle$, _settings$layerStyle, _settings$opacity$tit, _settings$opacity, _settings$dimensions$, _settings$dimensions, _settings$acceptanceT, _settings$acceptanceT2;
   let {
-      mapPresetsModule,
       settings,
       addLayerComponent
     } = _ref,
@@ -2307,12 +2287,6 @@ const DescriptionRow = _ref => {
   const {
     t
   } = useCoreTranslation();
-  const [mapPresetsModuleInline] = React.useState(mapPresetsModule ? Object.assign({}, mapPresetsModule, {
-    props: Object.assign({}, mapPresetsModule.props, {
-      id: 'mappresets-menubuttonInline'
-    })
-  }) : undefined);
-  const hasMapPresetsModule = mapPresetsModule !== undefined;
   return jsxs(Grid2, Object.assign({
     container: true,
     "data-testid": "descriptionRow",
@@ -2332,19 +2306,12 @@ const DescriptionRow = _ref => {
         tooltipTitle: settings == null || (_settings$addLayer = settings.addLayer) == null ? void 0 : _settings$addLayer.tooltipTitle,
         icon: settings == null || (_settings$addLayer2 = settings.addLayer) == null ? void 0 : _settings$addLayer2.icon
       })
-    }), jsxs(Grid2, {
+    }), jsx(Grid2, {
       className: columnClasses.column2,
-      children: [jsx(Box, {
-        className: `header-layer ${hasMapPresetsModule ? 'mappresetsModule-enabled' : ''}`,
+      children: jsx(Box, {
         sx: styles$3.text,
         children: (_settings$layerName$t = settings == null || (_settings$layerName = settings.layerName) == null ? void 0 : _settings$layerName.title) != null ? _settings$layerName$t : t('layermanager-layer')
-      }), jsx(Box, {
-        className: "header-mapPresets",
-        sx: {
-          marginRight: 4
-        },
-        children: mapPresetsModuleInline
-      })]
+      })
     }), jsx(Grid2, {
       className: columnClasses.column3,
       children: jsx(Box, {
@@ -7640,7 +7607,6 @@ const LayerManager = ({
   onMouseDown: _onMouseDown = () => {},
   order: _order = 0,
   source: _source = 'app',
-  leftHeaderComponent: _leftHeaderComponent = undefined,
   isLoading: _isLoading = false,
   error,
   isDockedLayerManager: _isDockedLayerManager = false,
@@ -7683,7 +7649,6 @@ const LayerManager = ({
     onMouseDown: _onMouseDown,
     order: _order,
     source: _source,
-    leftHeaderComponent: _leftHeaderComponent,
     rightHeaderComponent: jsx(HeaderOptionsConnect, {
       isDockedLayerManager: _isDockedLayerManager,
       mapId: mapId,
@@ -7742,7 +7707,6 @@ const LayerManager = ({
           "data-testid": "layerManagerRowContainer",
           sx: styles$1.layerRowContainer,
           children: [jsx(DescriptionRow, {
-            mapPresetsModule: _leftHeaderComponent,
             source: _source,
             settings: settings == null ? void 0 : settings.header,
             addLayerComponent: addLayerComponent
@@ -7823,7 +7787,6 @@ const LayerManagerConnect = ({
   bounds,
   title,
   showMapIdInTitle: _showMapIdInTitle = false,
-  leftHeaderComponent: _leftHeaderComponent = undefined,
   mapId: initialMapId = null,
   isMultiMap: _isMultiMap = false,
   isDocked: _isDocked = false,
@@ -7884,7 +7847,6 @@ const LayerManagerConnect = ({
         order: dialogOrder,
         source: uiSource,
         size: _isDocked ? returnCorrectSize(dockedLayerManagerSize) : sizeLarge,
-        leftHeaderComponent: _leftHeaderComponent,
         isLoading: uiIsLoading,
         error: uiError,
         onToggleDock: onToggleDock,
@@ -7904,7 +7866,7 @@ const LayerManagerConnect = ({
         })
       }), !_isDocked && jsx(LayerInfoDialogConnect, {}), !_isDocked && jsx(LayerSelectConnect, {})]
     });
-  }, [bounds, dialogOrder, dockedLayerManagerSize, initialMapId, isDialogOpen, _isDocked, _isMultiMap, _leftHeaderComponent, mapId, onCloseDialog, onToggleDock, preloadedAvailableBaseLayers, preloadedBaseServices, setDialogOrder, _showMapIdInTitle, nonEmptyTitle, uiError, uiIsLoading, uiSource, _source]);
+  }, [bounds, dialogOrder, dockedLayerManagerSize, initialMapId, isDialogOpen, _isDocked, _isMultiMap, mapId, onCloseDialog, onToggleDock, preloadedAvailableBaseLayers, preloadedBaseServices, setDialogOrder, _showMapIdInTitle, nonEmptyTitle, uiError, uiIsLoading, uiSource, _source]);
 };
 
 const LayerManagerMapButtonConnect = ({
@@ -8683,11 +8645,31 @@ const TOUCH_PAN_STEP_PERCENTAGE = 0.02;
  * See the License for the specific language governing permissions and
  * limitations under the License.
  *
- * Copyright 2022 - Koninklijk Nederlands Meteorologisch Instituut (KNMI)
- * Copyright 2022 - Finnish Meteorological Institute (FMI)
+ * Copyright 2024 - Koninklijk Nederlands Meteorologisch Instituut (KNMI)
+ * Copyright 2024 - Finnish Meteorological Institute (FMI)
  * Copyright 2024 - The Norwegian Meteorological Institute (MET Norway)
  * */
-const useKeyboardZoomAndPan = (mapIsActive, mapId) => {
+const isDialogOpen = mapRef => {
+  const backdrops = Array.from(document.querySelectorAll('.MuiBackdrop-root'));
+  return backdrops.find(backdropNode => {
+    var _backdropNode$parentE;
+    return (_backdropNode$parentE = backdropNode.parentElement) == null ? void 0 : _backdropNode$parentE.contains(mapRef);
+  }) !== undefined;
+};
+const isMapKeyboardControlsAllowed = (target, mapRef) => {
+  if (isDialogOpen(mapRef)) {
+    return false;
+  }
+  if (target.tagName !== 'BODY') {
+    if (target.tagName === 'BUTTON') {
+      // return true for element is active but not focus visible to the user
+      return !target.classList.contains('Mui-focusVisible');
+    }
+    return false;
+  }
+  return true;
+};
+const useKeyboardZoomAndPan = (mapIsActive, mapId, mapRef) => {
   React.useEffect(() => {
     const keysPressedDown = {};
     const handleKeyPress = event => {
@@ -8698,7 +8680,7 @@ const useKeyboardZoomAndPan = (mapIsActive, mapId) => {
         type
       } = event;
       keysPressedDown[key] = type === 'keydown';
-      if (map && target.tagName !== 'INPUT' && mapIsActive) {
+      if (map && mapIsActive && isMapKeyboardControlsAllowed(target, mapRef)) {
         if (keysPressedDown['+']) {
           map.zoomIn(1);
         } else if (keysPressedDown['-']) {
@@ -8734,7 +8716,7 @@ const useKeyboardZoomAndPan = (mapIsActive, mapId) => {
       document.removeEventListener('keydown', handleKeyPress);
       document.removeEventListener('keyup', handleKeyPress);
     };
-  }, [mapIsActive, mapId]);
+  }, [mapIsActive, mapId, mapRef]);
 };
 const PAN_STEP_PERCENTAGE = 0.02;
 
@@ -8758,6 +8740,7 @@ const MapViewConnect = _ref => {
       children
     } = _ref,
     props = _objectWithoutPropertiesLoose(_ref, _excluded$2);
+  const mapRef = React.useRef(null);
   const store = useStore();
   const mapDimensions = useSelector(store => mapSelectors.getMapDimensions(store, mapId));
   const layers = useSelector(store => mapSelectors.getMapLayers(store, mapId));
@@ -8851,7 +8834,7 @@ const MapViewConnect = _ref => {
     }));
   }, [dispatch, store]);
   const isActiveWindowId = useSelector(store => uiSelectors.getIsActiveWindowId(store, mapId));
-  useKeyboardZoomAndPan(isActiveWindowId, mapId);
+  useKeyboardZoomAndPan(isActiveWindowId, mapId, mapRef.current);
   useTouchZoomPan(isActiveWindowId, mapId);
   const unRegister = React.useCallback(mapId => {
     unregisterMap({
@@ -8902,6 +8885,7 @@ const MapViewConnect = _ref => {
     style: {
       height: '100%'
     },
+    ref: mapRef,
     children: jsxs(MapView, Object.assign({}, props, {
       mapId: mapId,
       srs: srs,
@@ -9714,6 +9698,25 @@ const getTimeBounds = dimensions => {
     endTime
   };
 };
+const calculateNewAnimationEndTime = (newTimeInMilliseconds, dataStartTimeInMilliseconds, dataEndTimeInMilliseconds, animationDuration) => {
+  if (newTimeInMilliseconds <= dataStartTimeInMilliseconds) {
+    return dataStartTimeInMilliseconds + animationDuration;
+  }
+  if (newTimeInMilliseconds > dataEndTimeInMilliseconds) {
+    return dataEndTimeInMilliseconds;
+  }
+  return newTimeInMilliseconds;
+};
+const calculateNewAnimationTimeBounds = (newTime, animationStartTime, animationEndTime, dataStartTime, dataEndTime) => {
+  const dateToMillisecond = date => new Date(date).getTime();
+  const animationDuration = dateToMillisecond(animationEndTime) - dateToMillisecond(animationStartTime);
+  const newAnimationEndTime = calculateNewAnimationEndTime(newTime * 1000, dataStartTime * 1000, dataEndTime * 1000, animationDuration);
+  const newAnimationStartTime = newAnimationEndTime - animationDuration;
+  return {
+    newAnimationStartTime,
+    newAnimationEndTime
+  };
+};
 
 const SpeedButtonConnect = ({
   mapId
@@ -10076,7 +10079,8 @@ const TimeSliderCurrentTimeBoxConnectComponent = ({
   isAutoUpdating,
   setCenterTime,
   unfilteredSelectedTime,
-  setUnfilteredSelectedTime
+  setUnfilteredSelectedTime,
+  onCalendarSelect
 }) => {
   const [dataStartTime, dataEndTime] = useSelector(store => mapSelectors.getDataLimitsFromLayers(store, mapId));
   return jsx(TimeSliderCurrentTimeBox, {
@@ -10089,6 +10093,7 @@ const TimeSliderCurrentTimeBoxConnectComponent = ({
     isAutoUpdating: isAutoUpdating,
     unfilteredSelectedTime: unfilteredSelectedTime,
     setUnfilteredSelectedTime: setUnfilteredSelectedTime,
+    onCalendarSelect: onCalendarSelect,
     onSetCenterTime: newTime => {
       setCenterTime({
         mapId,
@@ -10323,6 +10328,8 @@ const TimeSliderConnect = ({
   const [dataStartTime, dataEndTime] = useSelector(store => mapSelectors.getDataLimitsFromLayers(store, mapId));
   const isAnimating = useSelector(store => mapSelectors.isAnimating(store, mapId));
   const selectedTime = useSelector(store => mapSelectors.getSelectedTime(store, mapId));
+  const animationStartTime = useSelector(store => mapSelectors.getAnimationStartTime(store, mapId));
+  const animationEndTime = useSelector(store => mapSelectors.getAnimationEndTime(store, mapId));
   useUpdateTimestep(mapId);
   useUpdateTimeSpan(mapId, onSetTimeSliderSpan);
   const turnOffAutoUpdateIfItsOn = useTurnOffAutoUpdateIfItsOn(mapId);
@@ -10364,6 +10371,30 @@ const TimeSliderConnect = ({
       onsetNewDateDebounced(timeToIso(filteredIsoTime), onSetNewDate);
     }
   };
+  // Move animation bar when user changes time using time picker
+  // Animation bar however cannot be moved into a time where there is no data
+  const moveAnimationUsingCalendar = newTime => {
+    if (!animationEndTime || !animationStartTime || !dataStartTime || !dataEndTime) {
+      return;
+    }
+    const formatToIsoString = date => handleDateUtilsISOString(new Date(date).toISOString());
+    const {
+      newAnimationStartTime,
+      newAnimationEndTime
+    } = calculateNewAnimationTimeBounds(newTime, animationStartTime, animationEndTime, dataStartTime, dataEndTime);
+    dispatch(mapActions.setAnimationStartTime({
+      mapId,
+      animationStartTime: formatToIsoString(newAnimationStartTime)
+    }));
+    dispatch(mapActions.setAnimationEndTime({
+      mapId,
+      animationEndTime: formatToIsoString(newAnimationEndTime)
+    }));
+  };
+  const onCalendarSelect = newSelectedTime => {
+    setUnfilteredSelectedTime(newSelectedTime);
+    moveAnimationUsingCalendar(newSelectedTime);
+  };
   return jsx(TimeSlider, {
     timeStep: timeStep,
     dataStartTime: dataStartTime,
@@ -10385,7 +10416,8 @@ const TimeSliderConnect = ({
     timeBox: jsx(TimeSliderCurrentTimeBoxConnect, {
       mapId: mapId,
       unfilteredSelectedTime: unfilteredSelectedTime,
-      setUnfilteredSelectedTime: setUnfilteredSelectedTime
+      setUnfilteredSelectedTime: setUnfilteredSelectedTime,
+      onCalendarSelect: onCalendarSelect
     }),
     legend: jsx(TimeSliderLegendConnect, {
       mapId: mapId,
@@ -11820,4 +11852,4 @@ const LanguageSelect = ({
   });
 };
 
-export { CORE_NAMESPACE, ConfigurableMapConnect, CoreThemeProvider, CoreThemeStoreProvider, DemoWrapper, DemoWrapperConnect, HarmonieTempAndPrecipPreset, LanguageSelect, LayerInfoButtonConnect, LayerInfoDialogConnect, LayerManager, BaseLayerRow as LayerManagerBaseLayerRow, LayerManagerConnect, DescriptionRow as LayerManagerDescriptionRow, HeaderOptions as LayerManagerHeaderOptions, LayerContainerRow as LayerManagerLayerContainerRow, LayerManagerMapButtonConnect, LegendConnect, LegendMapButtonConnect, MapViewConnect, MultiDimensionSelectMapButtonsConnect, MultiMapMultiDimensionSelectConnect as MultiMapDimensionSelectConnect, MultiMapViewConnect, MyMapLocation, RouterWrapperConnect, SearchControlButtonConnect, SearchControlConnect, SearchDialog, SentryRecordButton, SyncGroupViewerConnect, ThemeWrapperWithModules, TimeSliderConnect, ZoomControlConnect, componentsLookUp, coreTranslations, defaultBbox, defaultConfigurations, filterMapPresets, filterServices, filterTimeSeriesServices, testLayers, useFetchServices, useUpdateTimeSpan, useUpdateTimestep };
+export { CORE_NAMESPACE, ConfigurableMapConnect, CoreI18nProvider, CoreThemeProvider, CoreThemeStoreProvider, DemoWrapper, DemoWrapperConnect, HarmonieTempAndPrecipPreset, LanguageSelect, LayerInfoButtonConnect, LayerInfoDialogConnect, LayerManager, BaseLayerRow as LayerManagerBaseLayerRow, LayerManagerConnect, DescriptionRow as LayerManagerDescriptionRow, HeaderOptions as LayerManagerHeaderOptions, LayerContainerRow as LayerManagerLayerContainerRow, LayerManagerMapButtonConnect, LegendConnect, LegendMapButtonConnect, MapViewConnect, MultiDimensionSelectMapButtonsConnect, MultiMapMultiDimensionSelectConnect as MultiMapDimensionSelectConnect, MultiMapViewConnect, MyMapLocation, RouterWrapperConnect, SearchControlButtonConnect, SearchControlConnect, SearchDialog, SentryRecordButton, SyncGroupViewerConnect, ThemeWrapperWithModules, TimeSliderConnect, ZoomControlConnect, componentsLookUp, coreTranslations, defaultBbox, defaultConfigurations, filterMapPresets, filterServices, filterTimeSeriesServices, testLayers, useFetchServices, useUpdateTimeSpan, useUpdateTimestep };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opengeoweb/core",
-  "version": "9.32.1",
+  "version": "9.33.1-spike-ol.3",
   "description": "GeoWeb Core library for the opengeoweb project",
   "license": "Apache-2.0",
   "repository": {

package/src/lib/components/LayerManager/DescriptionRow/DescriptionRow.d.ts

@@ -3,7 +3,6 @@ import * as React from 'react';
 import { uiTypes } from '@opengeoweb/store';
 import { LayerManagerCustomSettings } from '../LayerManagerUtils';
 interface DescriptionRowProps extends React.ComponentProps<typeof Grid> {
-    mapPresetsModule?: React.ReactElement;
     source?: uiTypes.Source;
     settings?: LayerManagerCustomSettings['header'];
     addLayerComponent?: React.ReactElement;

package/src/lib/components/LayerManager/LayerManager.d.ts

@@ -14,7 +14,6 @@ interface LayerManagerProps {
     isOpen: boolean;
     order?: number;
     source?: uiTypes.Source;
-    leftHeaderComponent?: React.ReactElement;
     isLoading?: boolean;
     error?: string;
     isDockedLayerManager?: boolean;

package/src/lib/components/LayerManager/LayerManagerConnect.d.ts

@@ -9,7 +9,6 @@ interface LayerManagerConnectProps {
     bounds?: string;
     title?: string;
     showMapIdInTitle?: boolean;
-    leftHeaderComponent?: React.ReactElement;
     isMultiMap?: boolean;
     isDocked?: boolean;
     source?: uiTypes.Source;

package/src/lib/components/LayerManager/LayerManagerUtils.d.ts

@@ -59,9 +59,6 @@ export declare const layerManagerStyle: {
     '.header-layermanager': {
         containerType: string;
     };
-    '.header-mapPresets': {
-        display: string;
-    };
     '.medium-layermanager': {
         display: string;
     };
@@ -115,23 +112,8 @@ export declare const layerManagerStyle: {
             '.column-2': {
                 width: string;
             };
-            '.header-layer.mappresetsModule-enabled': {
-                display: string;
-            };
-            '.header-mapPresets': {
-                display: string;
-                '.MuiButtonBase-root': {
-                    height: number;
-                    '.MuiBox-root': {
-                        textAlign: string;
-                    };
-                };
-            };
         };
         '.header-layermanager': {
-            '.mapPresets-btn': {
-                display: string;
-            };
             '.collapseLarge-btn': {
                 display: string;
             };

package/src/lib/components/MapViewConnect/useKeyboardZoomAndPan.d.ts

@@ -1 +1,3 @@
-export declare const useKeyboardZoomAndPan: (mapIsActive: boolean, mapId: string) => void;
+export declare const isDialogOpen: (mapRef: HTMLElement | null) => boolean;
+export declare const isMapKeyboardControlsAllowed: (target: Element, mapRef: HTMLElement | null) => boolean;
+export declare const useKeyboardZoomAndPan: (mapIsActive: boolean, mapId: string, mapRef: HTMLElement | null) => void;

package/src/lib/components/Providers/Providers.d.ts

@@ -6,6 +6,9 @@ interface CoreThemeProviderProps {
     children?: React.ReactNode;
     theme?: Theme;
 }
+interface CoreTranslationWrapperProps {
+    children?: React.ReactNode;
+}
 /**
  * A Provider component which provides the GeoWeb theme
  * @param children
@@ -23,6 +26,7 @@ interface CoreThemeStoreProviderProps extends CoreThemeProviderProps {
  * @returns
  */
 export declare const CoreThemeStoreProvider: React.FC<CoreThemeStoreProviderProps>;
+export declare const CoreI18nProvider: React.FC<CoreTranslationWrapperProps>;
 export declare const DemoWrapper: React.FC<CoreThemeProviderProps>;
 export declare const DemoWrapperConnect: React.FC<CoreThemeStoreProviderProps>;
 export {};

package/src/lib/components/TimeSliderConnect/TimeSliderCurrentTimeBoxConnect.d.ts

@@ -10,11 +10,13 @@ interface TimeSliderCurrentTimeBoxConnectComponentProps {
     setCenterTime?: typeof mapActions.setTimeSliderCenterTime;
     unfilteredSelectedTime: number;
     setUnfilteredSelectedTime: (unfilteredSelectedTime: number) => void;
+    onCalendarSelect: (newTime: number) => void;
 }
 export declare const TimeSliderCurrentTimeBoxConnect: import("react-redux").ConnectedComponent<React.FC<TimeSliderCurrentTimeBoxConnectComponentProps>, {
     mapId: string;
     unfilteredSelectedTime: number;
     setUnfilteredSelectedTime: (unfilteredSelectedTime: number) => void;
+    onCalendarSelect: (newTime: number) => void;
     timeStep?: number | undefined;
     centerTime?: number | undefined;
     secondsPerPx?: number | undefined;

package/src/lib/components/TimeSliderConnect/timesliderUtils.d.ts

@@ -5,3 +5,8 @@ export declare const useTurnOffAutoUpdateIfItsOn: (mapId: string) => (() => void
  * Returns time bounds from the given dimension. If no time dimension given, current time is returned as default
  */
 export declare const getTimeBounds: (dimensions: mapTypes.Dimension[]) => TimeBounds;
+export declare const calculateNewAnimationEndTime: (newTimeInMilliseconds: number, dataStartTimeInMilliseconds: number, dataEndTimeInMilliseconds: number, animationDuration: number) => number;
+export declare const calculateNewAnimationTimeBounds: (newTime: number, animationStartTime: string, animationEndTime: string, dataStartTime: number, dataEndTime: number) => {
+    newAnimationStartTime: number;
+    newAnimationEndTime: number;
+};