@opengeoweb/webmap-react 14.5.1 → 15.0.0

package/index.esm.js

@@ -1,4 +1,4 @@
-import { WMInvalidDateValues, getCorrectWMSDimName, WMImageStore, WMImageStoreLoadType, WMJSDimension, webmapUtils, WMLayer, LayerType, legendImageStore, WMImageEventType, getLegendGraphicURLForLayer, WEBMAP_NAMESPACE, WMProj4Defs, privateWebMapUtils, tilesettings } from '@opengeoweb/webmap';
+import { WMInvalidDateValues, getCorrectWMSDimName, WMImageStore, WMImageStoreLoadType, WMJSDimension, webmapUtils, WMLayer, LayerType, legendImageStore, WMImageEventType, getLegendGraphicURLForLayer, WEBMAP_NAMESPACE, WMProj4Defs, privateWebMapUtils, wmDetermineDimensionMode, tilesettings } from '@opengeoweb/webmap';
 export { WEBMAP_NAMESPACE, webmapTranslations } from '@opengeoweb/webmap';
 import React, { createContext, useMemo, useRef, useState, useEffect, useContext, useCallback, useLayoutEffect } from 'react';
 import { memoize, range, without, isEqual, throttle, debounce, cloneDeep } from 'lodash';
@@ -10,12 +10,12 @@ import ImageSource, { getRequestExtent } from 'ol/source/Image';
 import ImageWrapper, { load } from 'ol/Image';
 import { getImageSrc, getRequestParams, createLoader } from 'ol/source/wms';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
-import { CustomTooltip, CanvasComponent, useWheelStopPropagation, ToolContainerDraggable, CustomIconButton, dateUtils } from '@opengeoweb/shared';
-import { Paper, Box, Typography, useTheme, Grid, styled, Slider, TextField, FormControl, InputLabel, Select, MenuItem, Icon as Icon$2, FormLabel, Switch } from '@mui/material';
+import { CustomTooltip, CanvasComponent, useWheelStopPropagation, ToolContainerDraggable, CustomIconButton, dateUtils, useMakeSureContainerStaysInsideWindow, Draggable, Resizable } from '@opengeoweb/shared';
+import { Paper, Box, Typography, useTheme, Grid, styled, Slider, TextField, FormControl, InputLabel, Select, MenuItem, Icon as Icon$2, FormLabel, Switch, ThemeProvider } from '@mui/material';
 import { queryOptions, useQuery } from '@tanstack/react-query';
 import { Point, MultiPoint, Polygon, LineString } from 'ol/geom';
 import { Style, Icon as Icon$1, Circle, Stroke, Fill, Text } from 'ol/style';
-import { arrowUpPath, Home, Add, Minus, List, Equalizer, DimensionsElevation, Link, LinkOff, Info, DimensionsOther, DimensionsRefTime, DimensionsTime, locationPath, Location, DrawToolSmoothLine, DrawToolFreehand, DrawToolOval, DrawToolCircle, DrawToolSquare, Delete, DrawToolLineString, DrawToolRectangle, DrawToolPolygon, DrawToolPoint, DrawFIRLand, ArrowUp } from '@opengeoweb/theme';
+import { arrowUpPath, Home, Add, Minus, List, Equalizer, DimensionsElevation, Link, LinkOff, Info, DimensionsOther, DimensionsRefTime, DimensionsTime, locationPath, Location, DrawToolSmoothLine, DrawToolFreehand, DrawToolOval, DrawToolCircle, DrawToolSquare, Delete, DrawToolLineString, DrawToolRectangle, DrawToolPolygon, DrawToolPoint, DrawFIRLand, ArrowUp, darkTheme, ChevronRight, Clock as Clock$1, Resize } from '@opengeoweb/theme';
 import { http, HttpResponse } from 'msw';
 import 'i18next';
 import { useTranslation } from 'react-i18next';
@@ -60,6 +60,7 @@ var en = {
 	"webmap-react-title": "Title",
 	"webmap-react-name": "Name",
 	"webmap-react-service": "Service",
+	"webmap-react-service-url": "Service URL",
 	"webmap-react-abstract": "Abstract",
 	"webmap-react-dimensions": "Dimensions",
 	"webmap-react-styles": "Styles",
@@ -99,7 +100,9 @@ var en = {
 	"webmap-react-location": "Location",
 	"webmap-react-delete": "Delete",
 	"webmap-react-legend-no-image": "No legend graphic available",
-	"webmap-react-map-measure-help-tooltip": "Click to measure"
+	"webmap-react-map-measure-help-tooltip": "Click to measure",
+	"clock-show": "Show clock",
+	"clock-hide": "Hide clock"
 };
 var fi = {
 	"webmap-react-event": "tapahtuma:",
@@ -113,6 +116,7 @@ var fi = {
 	"webmap-react-title": "Otsikko",
 	"webmap-react-name": "Nimi",
 	"webmap-react-service": "Palvelu",
+	"webmap-react-service-url": "Palvelun URL",
 	"webmap-react-abstract": "Tiivistelmä",
 	"webmap-react-dimensions": "Ulottuvuudet",
 	"webmap-react-styles": "Tyylit",
@@ -144,7 +148,9 @@ var fi = {
 	"webmap-react-polygon": "Monikulmio",
 	"webmap-react-box": "Laatikko",
 	"webmap-react-linestring": "Viivajono",
-	"webmap-react-delete": "Poista"
+	"webmap-react-delete": "Poista",
+	"clock-show": "Näytä kello",
+	"clock-hide": "Piilota kello"
 };
 var no = {
 	"webmap-react-event": "hendelse:",
@@ -158,6 +164,7 @@ var no = {
 	"webmap-react-title": "Tittel",
 	"webmap-react-name": "Navn",
 	"webmap-react-service": "Service",
+	"webmap-react-service-url": "Service URL",
 	"webmap-react-abstract": "Abstrakt",
 	"webmap-react-dimensions": "Dimensjoner",
 	"webmap-react-styles": "Stiler",
@@ -189,7 +196,9 @@ var no = {
 	"webmap-react-polygon": "Polygon",
 	"webmap-react-box": "Boks",
 	"webmap-react-linestring": "Linje",
-	"webmap-react-delete": "Fjerne"
+	"webmap-react-delete": "Fjerne",
+	"clock-show": "Vis klokke",
+	"clock-hide": "Skjul klokke"
 };
 var nl = {
 	"webmap-react-event": "event:",
@@ -203,6 +212,7 @@ var nl = {
 	"webmap-react-title": "Titel",
 	"webmap-react-name": "Naam",
 	"webmap-react-service": "Service",
+	"webmap-react-service-url": "Service-URL",
 	"webmap-react-abstract": "Abstract",
 	"webmap-react-dimensions": "Dimensies",
 	"webmap-react-styles": "Stijlen",
@@ -242,7 +252,9 @@ var nl = {
 	"webmap-react-location": "Locatie",
 	"webmap-react-delete": "Verwijder",
 	"webmap-react-legend-no-image": "Geen legenda beschikbaar",
-	"webmap-react-map-measure-help-tooltip": "Klik om te meten"
+	"webmap-react-map-measure-help-tooltip": "Klik om te meten",
+	"clock-show": "Klok tonen",
+	"clock-hide": "Klok verbergen"
 };
 var webmapReactTranslations = {
 	en: en,
@@ -11225,7 +11237,8 @@ var LayerInfoButton = function LayerInfoButton(_ref) {
 
 var textStyle = {
   lineHeight: '20px',
-  letterSpacing: '0.25px'
+  letterSpacing: '0.25px',
+  overflowWrap: 'break-word'
 };
 var textStyleWithMargin = _objectSpread2(_objectSpread2({}, textStyle), {}, {
   marginBottom: 1
@@ -11410,6 +11423,7 @@ var LayerInfoDialog = function LayerInfoDialog(_ref) {
   var onClose = _ref.onClose,
     layer = _ref.layer,
     serviceName = _ref.serviceName,
+    serviceUrl = _ref.serviceUrl,
     isOpen = _ref.isOpen,
     _ref$onMouseDown = _ref.onMouseDown,
     onMouseDown = _ref$onMouseDown === void 0 ? function () {} : _ref$onMouseDown,
@@ -11453,6 +11467,9 @@ var LayerInfoDialog = function LayerInfoDialog(_ref) {
       }), jsx(LayerInfoText, {
         label: t('webmap-react-service'),
         value: serviceName
+      }), jsx(LayerInfoText, {
+        label: t('webmap-react-service-url'),
+        value: serviceUrl || '-'
       }), jsx(LayerInfoText, {
         label: t('webmap-react-abstract'),
         value: layer["abstract"] || '-'
@@ -12546,7 +12563,12 @@ var useQueryGetWMSLayers = function useQueryGetWMSLayers(serviceUrl) {
     if (!getCapabilitiesJSON) {
       setLayers([]);
     } else {
-      setLayers(privateWmsFlattenLayerTree(privateWmsGetLayerTree(getCapabilitiesJSON)));
+      var tree = privateWmsGetLayerTree(getCapabilitiesJSON);
+      if (!tree) {
+        setLayers([]);
+      } else {
+        setLayers(privateWmsFlattenLayerTree(tree));
+      }
     }
   }, [serviceUrl, getCapabilitiesJSON]);
   return layers;
@@ -12603,17 +12625,26 @@ var useGetWMLayerInstance = function useGetWMLayerInstance(layerFoundation) {
     setErrorMessage = _React$useState10[1];
   var refId = useRef(id || webmapUtils.generateLayerId());
   var layerId = refId.current;
+  var _useContext = useContext(TimeContext),
+    refTimeDimensionModes = _useContext.refTimeDimensionModes;
   // Check if the layer is already registered
   var tmpWMLayer = webmapUtils.getWMLayerById(layerId);
   var layerIdChanged = id && id !== (tmpWMLayer === null || tmpWMLayer === void 0 ? void 0 : tmpWMLayer.id);
   var layerServiceChanged = (tmpWMLayer === null || tmpWMLayer === void 0 ? void 0 : tmpWMLayer.service) !== serviceUrl;
   if (layerServiceChanged || layerIdChanged) {
     // Make a new layer if the serviceUrl changes. (But not when the name changes)
+    var refTimeDimensionMode = wmDetermineDimensionMode({
+      name: name,
+      service: serviceUrl,
+      id: layerId,
+      layerType: layerType
+    }, refTimeDimensionModes);
     var wmLayer = new WMLayer({
       name: name,
       service: serviceUrl,
       layerType: layerType,
-      id: layerId
+      id: layerId,
+      refTimeDimensionMode: refTimeDimensionMode
     });
     webmapUtils.registerWMLayer(wmLayer, layerId);
   }
@@ -13417,6 +13448,7 @@ var USEANIMATIONFORLAYER_DEFAULT_MSINHOUR = 3600000;
 var useAnimationForLayer = function useAnimationForLayer(layerProps, intervalInMs) {
   var numStepsTillLatest = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : USEANIMATIONFORLAYER_DEFAULT_NUMSTEPS;
   var checkForUpdatesMs = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : USEANIMATIONFORLAYER_DEFAULT_UPDATEINTERVALMS;
+  var refTimeDimensionModes = arguments.length > 4 ? arguments[4] : undefined;
   var now = dateUtils.getNowUtc().getTime();
   var animationStep = useRef(0);
   var _React$useState = React.useState(''),
@@ -13504,7 +13536,9 @@ var useAnimationForLayer = function useAnimationForLayer(layerProps, intervalInM
       name: 'time',
       currentValue: timeValue
     }],
-    timeContext: timeSpan
+    timeContext: _objectSpread2(_objectSpread2({}, timeSpan), {}, {
+      refTimeDimensionModes: refTimeDimensionModes
+    })
   };
 };
 
@@ -13840,12 +13874,14 @@ var TimeAwareEDRLocationLayer = function TimeAwareEDRLocationLayer(_ref) {
     features: [],
     type: 'FeatureCollection'
   };
+  // Don't show anything if no parameter is selected
+  var isVisible = visible && parameter.length > 0;
   return jsx(OpenLayersFeatureLayer, {
     declutter: true,
     featureCollection: featureCollection,
     opacity: opacity,
     style: isFetching ? loadingStyle : style,
-    visible: visible,
+    visible: isVisible,
     zIndex: zIndex
   });
 };
@@ -18279,6 +18315,265 @@ var MapMeasure = function MapMeasure(_ref) {
   return null;
 };
 
+/* *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * Copyright 2024 - Koninklijk Nederlands Meteorologisch Instituut (KNMI)
+ * Copyright 2024 - Finnish Meteorological Institute (FMI)
+ * Copyright 2024 - The Norwegian Meteorological Institute (MET Norway)
+ * */
+// To be used with translations of days in formatted date
+// enum DaysOfWeeki18n {
+//   SUNDAY = 'timeslider-sunday',
+//   MONDAY = 'timeslider-monday',
+//   TUESDAY = 'timeslider-tuesday',
+//   WEDNESDAY = 'timeslider-wednesday',
+//   THURSDAY = 'timeslider-thursday',
+//   FRIDAY = 'timeslider-friday',
+//   SATURDAY = 'timeslider-saturday',
+// }
+// To be used with translations of months in formatted date
+// enum MonthsOfTheYeari18n {
+//   JANUARY = 'timeslider-january',
+//   FEBRUARY = 'timeslider-february',
+//   MARCH = 'timeslider-march',
+//   APRIL = 'timeslider-april',
+//   MAY = 'timeslider-may',
+//   JUNE = 'timeslider-june',
+//   JULY = 'timeslider-july',
+//   AUGUST = 'timeslider-august',
+//   SEPTEMBER = 'timeslider-september',
+//   OCTOBER = 'timeslider-october',
+//   NOVEMBER = 'timeslider-november',
+//   DECEMBER = 'timeslider-december',
+// }
+var DaysOfWeek;
+(function (DaysOfWeek) {
+  DaysOfWeek["SUNDAY"] = "Sun";
+  DaysOfWeek["MONDAY"] = "Mon";
+  DaysOfWeek["TUESDAY"] = "Tue";
+  DaysOfWeek["WEDNESDAY"] = "Wed";
+  DaysOfWeek["THURSDAY"] = "Thu";
+  DaysOfWeek["FRIDAY"] = "Fri";
+  DaysOfWeek["SATURDAY"] = "Sat";
+})(DaysOfWeek || (DaysOfWeek = {}));
+var MonthsOfTheYear;
+(function (MonthsOfTheYear) {
+  MonthsOfTheYear["JANUARY"] = "Jan";
+  MonthsOfTheYear["FEBRUARY"] = "Feb";
+  MonthsOfTheYear["MARCH"] = "Mar";
+  MonthsOfTheYear["APRIL"] = "Apr";
+  MonthsOfTheYear["MAY"] = "May";
+  MonthsOfTheYear["JUNE"] = "Jun";
+  MonthsOfTheYear["JULY"] = "Jul";
+  MonthsOfTheYear["AUGUST"] = "Aug";
+  MonthsOfTheYear["SEPTEMBER"] = "Sep";
+  MonthsOfTheYear["OCTOBER"] = "Oct";
+  MonthsOfTheYear["NOVEMBER"] = "Nov";
+  MonthsOfTheYear["DECEMBER"] = "Dec";
+})(MonthsOfTheYear || (MonthsOfTheYear = {}));
+var dateToManualFormatString = function dateToManualFormatString(inDate) {
+  if (!inDate) {
+    return 'Date not available';
+  }
+  var EEE = inDate && Object.values(DaysOfWeek)[inDate.getUTCDay()];
+  var dd = "0".concat(inDate === null || inDate === void 0 ? void 0 : inDate.getUTCDate()).slice(-2);
+  var MMM = inDate && Object.values(MonthsOfTheYear)[inDate.getUTCMonth()];
+  var HH = "0".concat(inDate === null || inDate === void 0 ? void 0 : inDate.getUTCHours()).slice(-2);
+  var mm = "0".concat(inDate === null || inDate === void 0 ? void 0 : inDate.getUTCMinutes()).slice(-2);
+  return "".concat(EEE, " ").concat(dd, " ").concat(MMM, " ").concat(HH, ":").concat(mm, " UTC");
+};
+
+/**
+ * Format a date to a string
+ *
+ * Expects the following props:
+ * @param {Date} inDate - date to be formatted
+ *
+ */
+var ClockContainer = function ClockContainer(_ref) {
+  var fontSize = _ref.fontSize,
+    onButtonClick = _ref.onButtonClick,
+    time = _ref.time;
+  var _useWebmapReactTransl = useWebmapReactTranslation(),
+    t = _useWebmapReactTransl.t;
+  var title = t('clock-hide');
+  var currentDateString = dateToManualFormatString(dateUtils.fromUnix(time));
+  return jsxs(Grid, {
+    container: true,
+    sx: {
+      justifyContent: 'space-evenly',
+      alignItems: 'center',
+      cursor: 'move',
+      height: '100%',
+      width: '100%',
+      backgroundColor: 'geowebColors.timeSlider.playerTimeMarkers.fill',
+      borderRadius: '5px'
+    },
+    wrap: "nowrap",
+    children: [jsx(Grid, {
+      sx: {
+        width: '4px'
+      }
+    }), jsx(CustomTooltip, {
+      title: title,
+      children: jsx(Grid, {
+        sx: {
+          zIndex: 2
+        },
+        children: jsx(ThemeProvider, {
+          theme: darkTheme,
+          children: jsx(CustomIconButton, {
+            "aria-label": title,
+            onClick: onButtonClick,
+            variant: "boxed",
+            children: jsx(ChevronRight, {})
+          })
+        })
+      })
+    }), jsx(Grid, {
+      children: jsx(Typography, {
+        sx: {
+          whiteSpace: 'nowrap',
+          fontSize: fontSize,
+          color: '#fff'
+        },
+        variant: "subtitle2",
+        children: currentDateString
+      })
+    })]
+  });
+};
+
+var MIN_WIDTH = 170;
+var MIN_HEIGHT = 32;
+var MIN_FONT_SIZE = 14; // bigger font size will cause render delay in LCP
+var FONT_SIZE_WIDTH_RATIO = MIN_FONT_SIZE / MIN_WIDTH;
+var BUTTON_WIDTH = 40;
+var resizeHandlePlacement = {
+  top: false,
+  right: false,
+  bottom: false,
+  left: false,
+  topRight: false,
+  bottomRight: false,
+  bottomLeft: true,
+  topLeft: false
+};
+var Clock = function Clock(_ref2) {
+  var time = _ref2.time,
+    _ref2$isVisible = _ref2.isVisible,
+    isClockVisible = _ref2$isVisible === void 0 ? true : _ref2$isVisible,
+    onToggleClock = _ref2.onToggleClock;
+  var _useWebmapReactTransl = useWebmapReactTranslation(),
+    t = _useWebmapReactTransl.t;
+  var clockElement = useRef(null);
+  var _useState = useState({
+      x: 0,
+      y: 0
+    }),
+    _useState2 = _slicedToArray(_useState, 2),
+    position = _useState2[0],
+    setPosition = _useState2[1];
+  useMakeSureContainerStaysInsideWindow(clockElement, position, setPosition);
+  var _useState3 = useState({
+      width: MIN_WIDTH,
+      height: MIN_HEIGHT
+    }),
+    _useState4 = _slicedToArray(_useState3, 2),
+    size = _useState4[0],
+    setSize = _useState4[1];
+  var _useState5 = useState(MIN_FONT_SIZE),
+    _useState6 = _slicedToArray(_useState5, 2),
+    fontSize = _useState6[0],
+    setFontSize = _useState6[1];
+  var toggleClock = function toggleClock(isClockVisible) {
+    onToggleClock === null || onToggleClock === void 0 || onToggleClock(isClockVisible);
+  };
+  return jsx(Fragment, {
+    children: !isClockVisible ? jsx(CustomIconButton, {
+      "aria-label": t('clock-show'),
+      onClick: function onClick() {
+        toggleClock(true);
+      },
+      sx: {
+        position: 'absolute',
+        top: 16,
+        right: 8,
+        zIndex: 1
+      },
+      tooltipTitle: t('clock-show'),
+      variant: "boxed",
+      children: jsx(Clock$1, {})
+    }) : jsx(Draggable, {
+      bounds: "parent",
+      cancel: ".MuiButtonBase-root",
+      nodeRef: clockElement,
+      onStop: function onStop(_event, position) {
+        setPosition(position);
+      },
+      position: position,
+      children: jsx("div", {
+        ref: function ref(_ref3) {
+          clockElement.current = _ref3;
+        },
+        style: {
+          position: 'absolute',
+          zIndex: 1001,
+          top: '10px',
+          right: '10px'
+        },
+        children: jsx(Resizable, {
+          enable: resizeHandlePlacement,
+          handleComponent: {
+            bottomLeft: jsx(Resize, {
+              isRightAligned: true,
+              style: {
+                fill: '#FFFFFF'
+              }
+            })
+          },
+          lockAspectRatio: true,
+          minHeight: MIN_HEIGHT,
+          minWidth: MIN_WIDTH + BUTTON_WIDTH,
+          onResize: function onResize(_event, _direction, _ref, delta) {
+            var width = size.width + delta.width;
+            var adjustedWidth = width - BUTTON_WIDTH;
+            var fontSize = FONT_SIZE_WIDTH_RATIO * adjustedWidth;
+            setFontSize(fontSize);
+          },
+          onResizeStop: function onResizeStop(_event, _direction, _ref, delta) {
+            var width = size.width + delta.width;
+            var height = size.height + delta.height;
+            setSize({
+              width: width,
+              height: height
+            });
+          },
+          size: size,
+          children: jsx(ClockContainer, {
+            fontSize: fontSize,
+            onButtonClick: function onButtonClick() {
+              toggleClock(false);
+            },
+            time: time
+          })
+        })
+      })
+    })
+  });
+};
+
 /* *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
@@ -18304,7 +18599,7 @@ function getIsInsideAcceptanceTime(acceptanceTimeInMinutes, mapDimensions, layer
   var layerCurrentTime = layerDimensions === null || layerDimensions === void 0 || (_layerDimensions$find = layerDimensions.find(function (dimension) {
     return dimension.name === 'time';
   })) === null || _layerDimensions$find === void 0 ? void 0 : _layerDimensions$find.currentValue;
-  if (acceptanceTimeInMinutes === undefined || !mapCurrentTime || !layerCurrentTime) {
+  if (acceptanceTimeInMinutes === undefined || acceptanceTimeInMinutes === null || !mapCurrentTime || !layerCurrentTime) {
     return true;
   }
   var minutesBetween = dateUtils.differenceInMinutes(new Date(mapCurrentTime), new Date(layerCurrentTime));
@@ -18355,4 +18650,4 @@ var getLayerUpdateInfo = function getLayerUpdateInfo(wmLayer, mapId) {
   return updateObject;
 };
 
-export { BaseLayerType, CLASSNAME_MAP_MEASURE_TOOLTIP, ClickOnMapTool, DEFAULT_GEOJSON_STYLE_FILL_OPACITY, DRAWMODE, DefaultBaseLayers, DimensionSelectButton, DimensionSelectDialog, DimensionSelectSlider, EditModeButton as EditModeButtonField, FEATURE_DRAW_FILL_COLOR, FEATURE_DRAW_FILL_COLOR_TRANSPARENT, FEATURE_DRAW_SECONDARY_FILL_COLOR, FEATURE_DRAW_SECONDARY_STROKE_COLOR, FEATURE_DRAW_STROKE_COLOR, FEATURE_FILL, FEATURE_FILL_SELECTED, FEATURE_STROKE, FEATURE_STROKE_EDIT, FEATURE_STROKE_SELECTED, FEATURE_VERTICES_EDIT_HANDLES, FEATURE_VERTICE_HANDLE_IMAGE, FEATURE_VERTICE_IMAGE, FeatureLayer, FeatureLayers, GeoJSONTextField, IntersectionSelect, LayerInfoButton, LayerInfoDialog, LayerInfoLegend, LayerInfoList, LayerInfoText, Legend, LegendButton, LegendDialog, LegendLayout, MapContext, MapControlButton, MapControls, MapDimensionSelect, MapFeatureClass, MapMeasure, MapTime, MapWarningProperties, NEW_FEATURE_CREATED, NEW_LINESTRING_CREATED, NEW_POINT_CREATED, OpenLayersFeatureLayer, OpenLayersGetFeatureInfo, OpenLayersLayer, OpenLayersMapDraw, OpenLayersMapView, OpenLayersZoomControl, SelectField, StoryLayoutGrid, TimeAwareEDRLocationLayer, TimeAwareGeoTIFFLayer, TimeAwareWMTSLayer, TimeContext, TimeawareImageSource, TimeawareImageSourceWMSLayer, WEBMAP_REACT_NAMESPACE, WMSLayer, WMTSLayer, XYZLayer, ZoomControls, addFeatureProperties, addGeoJSONProperties, addSelectionTypeToGeoJSON, basicExampleDrawOptions, basicExampleMultipleShapeDrawOptions, basicExampleMultipleShapeWithValuesDrawOptions, catmullRomSpline, clearImageCacheForAllMaps, colorMaps, createBoxBasedOnModifiedVertex, createIconStyle, createInterSections, createOval, currentlySupportedDrawModes, defaultBox, defaultCircle, defaultDelete, defaultEdrStyles, defaultFreehandLine, defaultGeoJSONStyleProperties, defaultIntersectionStyleProperties, defaultLayers, defaultLineString, defaultLocation, defaultModes, defaultOval, defaultPoint, defaultPolygon, defaultSmoothLine, defaultSquare, defaultTimeFormat, dimensionConfig, drawPolyStoryStyles, drawStyles, emptyGeoJSON, endToolExampleConfig, exampleIntersectionOptions, exampleIntersectionWithShapeOptions, exampleIntersections, exampleIntersectionsMultiDrawTool, fakeEdrLayerApiHandlers, featureMultiPoint, featurePoint, featurePolygon, fillOptions, firSelectionType, formatTime, generateImageFromLegend, genericOpenLayersFeatureStyle, geowebColorToOpenLayersColor, getDimensionIcon, getDimensionLabel, getDimensionValue, getDimensionsList, getDoubleControlToolIcon, getDrawModeIdFromSelectionType, getFeatureCollection, getFeatureExtent, getFeaturePointStyle, getFirTitle, getGeoJSONPropertyValue, getGeoJson, getIcon, getIntersectionToolIcon, getIsInsideAcceptanceTime, getLastEmptyFeatureIndex, getLayerBbox, getLayerStyles, getLayerUpdateInfo, getLegendClass, getProj4, getTimeDimension, getToolIcon, initializeOpenLayersProjections, inlineFeatureStyle, intersectPointGeoJSONS, intersectPolygonGeoJSONS, intersectionFeatureBE, intersectionFeatureNL, isGeoJSONFeatureCreatedByTool, isGeoJSONGeometryEmpty, isPointFeatureCollection, labelOptions, lineString, lineStringCollection, makeFeatureStyleDisc, makeFeatureStyleLoading, makeFeatureStyleMultiParam, makeFeatureStyleMultiParamLoading, makeFeatureStyleWind, makeLegendFromColorMap, makeLegendFromStyleName, makeTimeList, makeView, marksByDimension, measureResultStyle, measureToolStyle, modifyStyles, moveFeature, multiLineStringLabelStyle, multiPolygonLabelStyle, opacityOptions, openLayersGetMapImageStore, precipitationMMLegendColorsWoW, projectorCache, publicLayers, publicServices, rewindGeometry, roundCoordinates, selectPreferredWMSProjection, setMapCenter, setViewFromExtent, setViewFromFeature, simpleBoxGeoJSON, simpleBoxGeoJSONWrongOrder, simpleFlightRouteLineStringGeoJSON, simpleFlightRoutePointsGeoJSON, simpleGeometryCollectionGeoJSON, simpleLineStringGeoJSON, simpleMultiPolygon, simplePointsGeojson, simplePolygonGeoJSON, simpleSmallLineStringGeoJSON, startToolExampleConfig, strokeWidthOptions, styleNameToStyleLike, temperatureLegendColorsCWK, temperatureLegendColorsWoW, textLabelStyle, textStyle, textStyleWithMargin, updateEditModeButtonsWithFir, useAnimationForLayer, useEDRGetCollectionDetails, useEDRGetParameterData, useEDRWMLayer, useGeoJSON, useGetWMLayerInstance, useGetWMSLayerStyleList, useIconStyle, useMapDrawTool, useProjection, useQueryGetWMSGetCapabilities, useQueryGetWMSLayer, useQueryGetWMSLayers, useQueryGetWMSLayersTree, useQueryGetWMSServiceInfo, useQueryWMTSGetCapabilities, useSetIntervalWhenVisible, useViewFromLayer, viewUtils, webmapEDRQueryOptions, webmapReactTranslations };
+export { BaseLayerType, CLASSNAME_MAP_MEASURE_TOOLTIP, ClickOnMapTool, Clock, DEFAULT_GEOJSON_STYLE_FILL_OPACITY, DRAWMODE, DefaultBaseLayers, DimensionSelectButton, DimensionSelectDialog, DimensionSelectSlider, EditModeButton as EditModeButtonField, FEATURE_DRAW_FILL_COLOR, FEATURE_DRAW_FILL_COLOR_TRANSPARENT, FEATURE_DRAW_SECONDARY_FILL_COLOR, FEATURE_DRAW_SECONDARY_STROKE_COLOR, FEATURE_DRAW_STROKE_COLOR, FEATURE_FILL, FEATURE_FILL_SELECTED, FEATURE_STROKE, FEATURE_STROKE_EDIT, FEATURE_STROKE_SELECTED, FEATURE_VERTICES_EDIT_HANDLES, FEATURE_VERTICE_HANDLE_IMAGE, FEATURE_VERTICE_IMAGE, FeatureLayer, FeatureLayers, GeoJSONTextField, IntersectionSelect, LayerInfoButton, LayerInfoDialog, LayerInfoLegend, LayerInfoList, LayerInfoText, Legend, LegendButton, LegendDialog, LegendLayout, MapContext, MapControlButton, MapControls, MapDimensionSelect, MapFeatureClass, MapMeasure, MapTime, MapWarningProperties, NEW_FEATURE_CREATED, NEW_LINESTRING_CREATED, NEW_POINT_CREATED, OpenLayersFeatureLayer, OpenLayersGetFeatureInfo, OpenLayersLayer, OpenLayersMapDraw, OpenLayersMapView, OpenLayersZoomControl, SelectField, StoryLayoutGrid, TimeAwareEDRLocationLayer, TimeAwareGeoTIFFLayer, TimeAwareWMTSLayer, TimeContext, TimeawareImageSource, TimeawareImageSourceWMSLayer, WEBMAP_REACT_NAMESPACE, WMSLayer, WMTSLayer, XYZLayer, ZoomControls, addFeatureProperties, addGeoJSONProperties, addSelectionTypeToGeoJSON, basicExampleDrawOptions, basicExampleMultipleShapeDrawOptions, basicExampleMultipleShapeWithValuesDrawOptions, catmullRomSpline, clearImageCacheForAllMaps, colorMaps, createBoxBasedOnModifiedVertex, createIconStyle, createInterSections, createOval, currentlySupportedDrawModes, defaultBox, defaultCircle, defaultDelete, defaultEdrStyles, defaultFreehandLine, defaultGeoJSONStyleProperties, defaultIntersectionStyleProperties, defaultLayers, defaultLineString, defaultLocation, defaultModes, defaultOval, defaultPoint, defaultPolygon, defaultSmoothLine, defaultSquare, defaultTimeFormat, dimensionConfig, drawPolyStoryStyles, drawStyles, emptyGeoJSON, endToolExampleConfig, exampleIntersectionOptions, exampleIntersectionWithShapeOptions, exampleIntersections, exampleIntersectionsMultiDrawTool, fakeEdrLayerApiHandlers, featureMultiPoint, featurePoint, featurePolygon, fillOptions, firSelectionType, formatTime, generateImageFromLegend, genericOpenLayersFeatureStyle, geowebColorToOpenLayersColor, getDimensionIcon, getDimensionLabel, getDimensionValue, getDimensionsList, getDoubleControlToolIcon, getDrawModeIdFromSelectionType, getFeatureCollection, getFeatureExtent, getFeaturePointStyle, getFirTitle, getGeoJSONPropertyValue, getGeoJson, getIcon, getIntersectionToolIcon, getIsInsideAcceptanceTime, getLastEmptyFeatureIndex, getLayerBbox, getLayerStyles, getLayerUpdateInfo, getLegendClass, getProj4, getTimeDimension, getToolIcon, initializeOpenLayersProjections, inlineFeatureStyle, intersectPointGeoJSONS, intersectPolygonGeoJSONS, intersectionFeatureBE, intersectionFeatureNL, isGeoJSONFeatureCreatedByTool, isGeoJSONGeometryEmpty, isPointFeatureCollection, labelOptions, lineString, lineStringCollection, makeFeatureStyleDisc, makeFeatureStyleLoading, makeFeatureStyleMultiParam, makeFeatureStyleMultiParamLoading, makeFeatureStyleWind, makeLegendFromColorMap, makeLegendFromStyleName, makeTimeList, makeView, marksByDimension, measureResultStyle, measureToolStyle, modifyStyles, moveFeature, multiLineStringLabelStyle, multiPolygonLabelStyle, opacityOptions, openLayersGetMapImageStore, precipitationMMLegendColorsWoW, projectorCache, publicLayers, publicServices, rewindGeometry, roundCoordinates, selectPreferredWMSProjection, setMapCenter, setViewFromExtent, setViewFromFeature, simpleBoxGeoJSON, simpleBoxGeoJSONWrongOrder, simpleFlightRouteLineStringGeoJSON, simpleFlightRoutePointsGeoJSON, simpleGeometryCollectionGeoJSON, simpleLineStringGeoJSON, simpleMultiPolygon, simplePointsGeojson, simplePolygonGeoJSON, simpleSmallLineStringGeoJSON, startToolExampleConfig, strokeWidthOptions, styleNameToStyleLike, temperatureLegendColorsCWK, temperatureLegendColorsWoW, textLabelStyle, textStyle, textStyleWithMargin, updateEditModeButtonsWithFir, useAnimationForLayer, useEDRGetCollectionDetails, useEDRGetParameterData, useEDRWMLayer, useGeoJSON, useGetWMLayerInstance, useGetWMSLayerStyleList, useIconStyle, useMapDrawTool, useProjection, useQueryGetWMSGetCapabilities, useQueryGetWMSLayer, useQueryGetWMSLayers, useQueryGetWMSLayersTree, useQueryGetWMSServiceInfo, useQueryWMTSGetCapabilities, useSetIntervalWhenVisible, useViewFromLayer, viewUtils, webmapEDRQueryOptions, webmapReactTranslations };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opengeoweb/webmap-react",
-  "version": "14.5.1",
+  "version": "15.0.0",
   "description": "GeoWeb react wrapper for webmap",
   "license": "Apache-2.0",
   "repository": {
@@ -8,9 +8,9 @@
     "url": "git@gitlab.com:opengeoweb/opengeoweb.git"
   },
   "dependencies": {
-    "@opengeoweb/webmap": "14.5.1",
-    "@opengeoweb/theme": "14.5.1",
-    "@opengeoweb/shared": "14.5.1",
+    "@opengeoweb/webmap": "15.0.0",
+    "@opengeoweb/theme": "15.0.0",
+    "@opengeoweb/shared": "15.0.0",
     "lodash": "^4.17.21",
     "ol": "^10.4.0",
     "proj4": "^2.9.2",

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

@@ -0,0 +1,6 @@
+import type { FC } from 'react';
+export declare const Clock: FC<{
+    time: number;
+    isVisible?: boolean;
+    onToggleClock?: (isVisible: boolean) => void;
+}>;

package/src/lib/components/Clock/Clock.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/src/lib/components/Clock/Clock.stories.d.ts

@@ -0,0 +1,9 @@
+import type { Meta, StoryObj } from '@storybook/react-webpack5';
+import { Clock } from './Clock';
+declare const meta: Meta<typeof Clock>;
+export default meta;
+type Story = StoryObj<typeof Clock>;
+export declare const Component: Story;
+export declare const ComponentDark: Story;
+export declare const ComponentClosed: Story;
+export declare const ComponentClosedDark: Story;

package/src/lib/components/Clock/ClockContainer.d.ts

@@ -0,0 +1,13 @@
+import type { FC } from 'react';
+/**
+ * Format a date to a string
+ *
+ * Expects the following props:
+ * @param {Date} inDate - date to be formatted
+ *
+ */
+export declare const ClockContainer: FC<{
+    onButtonClick: () => void;
+    fontSize: number;
+    time: number;
+}>;

package/src/lib/components/Clock/clockContainerUtils.d.ts

@@ -0,0 +1 @@
+export declare const dateToManualFormatString: (inDate: Date | undefined) => string;

package/src/lib/components/Clock/clockContainerUtils.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/src/lib/components/Clock/index.d.ts

@@ -0,0 +1 @@
+export * from './Clock';

package/src/lib/components/LayerInfo/LayerInfoDialog.d.ts

@@ -3,6 +3,7 @@ import type { LayerProps } from '@opengeoweb/webmap';
 export interface LayerInfoDialogProps {
     layer: LayerProps;
     serviceName: string;
+    serviceUrl?: string;
     onClose: () => void;
     isOpen: boolean;
     onMouseDown?: () => void;

package/src/lib/components/LayerInfo/LayerInfoText.d.ts

@@ -5,10 +5,12 @@ export interface LayerInfoTextProps {
 export declare const textStyle: {
     lineHeight: string;
     letterSpacing: string;
+    overflowWrap: string;
 };
 export declare const textStyleWithMargin: {
     marginBottom: number;
     lineHeight: string;
     letterSpacing: string;
+    overflowWrap: string;
 };
 export declare const LayerInfoText: React.FC<LayerInfoTextProps>;

package/src/lib/components/OpenLayers/OpenLayersMapView.ReferenceTimeModes.stories.d.ts

@@ -0,0 +1,6 @@
+import type { Meta, StoryObj } from '@storybook/react-webpack5';
+import { OpenLayersMapView } from '.';
+declare const meta: Meta<typeof OpenLayersMapView>;
+export default meta;
+type Story = StoryObj<typeof OpenLayersMapView>;
+export declare const ReferenceTimeModes: Story;

package/src/lib/components/OpenLayers/types/Timespan.d.ts

@@ -1,3 +1,4 @@
+import type { RefTimeDimensionModes } from '@opengeoweb/webmap';
 export interface Timespan {
     start: number;
     end: number;
@@ -6,4 +7,5 @@ export interface Timespan {
 export interface TimeContextType {
     isAnimating: boolean;
     prefetchList: number[];
+    refTimeDimensionModes?: RefTimeDimensionModes;
 }

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

@@ -6,3 +6,4 @@ export * from './MapDimensionSelect';
 export * from './LayerInfo';
 export * from './OpenLayers';
 export * from './MapMeasure';
+export * from './Clock';

package/src/lib/hooks/useAnimationForLayer.d.ts

@@ -1,9 +1,9 @@
-import type { Dimension } from '@opengeoweb/webmap';
+import type { Dimension, RefTimeDimensionModes } from '@opengeoweb/webmap';
 import type { OpenLayersLayerProps } from '../components/OpenLayers/layers';
 import type { TimeContextType } from '../components/OpenLayers/types/Timespan';
 interface UseAnimationForLayerProps {
     dimensions: Dimension[];
     timeContext: TimeContextType;
 }
-export declare const useAnimationForLayer: (layerProps: OpenLayersLayerProps, intervalInMs: number, numStepsTillLatest?: number, checkForUpdatesMs?: number) => UseAnimationForLayerProps;
+export declare const useAnimationForLayer: (layerProps: OpenLayersLayerProps, intervalInMs: number, numStepsTillLatest?: number, checkForUpdatesMs?: number, refTimeDimensionModes?: RefTimeDimensionModes) => UseAnimationForLayerProps;
 export {};

package/src/lib/types/types.d.ts

@@ -47,6 +47,12 @@ export interface SetLayerStylePayload {
     mapId?: string;
     origin?: string;
 }
+export interface SetLayerAcceptanceTimePayload {
+    layerId: string;
+    acceptanceTime: number | null;
+    mapId?: string;
+    origin?: string;
+}
 export interface UpdateLayerInfoPayload {
     origin: string;
     mapDimensions?: UpdateAllMapDimensionsPayload;

package/src/lib/utils/utils.d.ts

@@ -1,4 +1,4 @@
 import type { Dimension, WMLayer } from '@opengeoweb/webmap';
 import type { UpdateLayerInfoPayload } from '../types/types';
-export declare function getIsInsideAcceptanceTime(acceptanceTimeInMinutes: number | undefined, mapDimensions: Dimension[] | undefined, layerDimensions: Dimension[] | undefined): boolean;
+export declare function getIsInsideAcceptanceTime(acceptanceTimeInMinutes: number | null | undefined, mapDimensions: Dimension[] | undefined, layerDimensions: Dimension[] | undefined): boolean;
 export declare const getLayerUpdateInfo: (wmLayer: WMLayer, mapId: string) => UpdateLayerInfoPayload;