@opengeoweb/shared 4.6.0 → 4.7.0

package/index.esm.js

@@ -8,6 +8,7 @@ import { throttle } from 'lodash';
 import Draggable from 'react-draggable';
 import { Resizable } from 're-resizable';
 import { useStore } from 'react-redux';
+import { parseISO, parse, format, isEqual, isBefore, isAfter } from 'date-fns';
 
 /*! *****************************************************************************
 Copyright (c) Microsoft Corporation.
@@ -581,7 +582,9 @@ var useDraftFormHelpers = function useDraftFormHelpers() {
       register = _useFormContext.register;
 
   React.useEffect(function () {
-    setValue(HIDDEN_INPUT_HELPER_IS_DRAFT, isDefaultDraft); // eslint-disable-next-line react-hooks/exhaustive-deps
+    setValue(HIDDEN_INPUT_HELPER_IS_DRAFT, isDefaultDraft, {
+      shouldDirty: false
+    }); // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
   var isDraft = function isDraft() {
@@ -597,7 +600,9 @@ var useDraftFormHelpers = function useDraftFormHelpers() {
   };
 
   var toggleIsDraft = function toggleIsDraft(isDraft) {
-    return setValue(HIDDEN_INPUT_HELPER_IS_DRAFT, isDraft);
+    return setValue(HIDDEN_INPUT_HELPER_IS_DRAFT, isDraft, {
+      shouldDirty: false
+    });
   };
 
   var DraftFieldHelper = function DraftFieldHelper() {
@@ -1918,15 +1923,13 @@ var DraggableComponent = function DraggableComponent(_a) {
       leftHeaderComponent = _a$leftHeaderComponen === void 0 ? null : _a$leftHeaderComponen,
       _a$rightHeaderCompone = _a.rightHeaderComponent,
       rightHeaderComponent = _a$rightHeaderCompone === void 0 ? null : _a$rightHeaderCompone,
-      _a$hasElevation = _a.hasElevation,
-      hasElevation = _a$hasElevation === void 0 ? true : _a$hasElevation,
       className = _a.className,
       _a$sx = _a.sx,
       sx = _a$sx === void 0 ? {} : _a$sx,
-      props = __rest(_a, ["title", "bounds", "headerSize", "startSize", "startPosition", "children", "isOpen", "onClose", "initialMaxHeight", "onChangeSize", "onMouseDown", "onResizeStop", "onDragEnd", "order", "source", "leftHeaderComponent", "rightHeaderComponent", "hasElevation", "className", "sx"]);
+      props = __rest(_a, ["title", "bounds", "headerSize", "startSize", "startPosition", "children", "isOpen", "onClose", "initialMaxHeight", "onChangeSize", "onMouseDown", "onResizeStop", "onDragEnd", "order", "source", "leftHeaderComponent", "rightHeaderComponent", "className", "sx"]);
 
   var zIndex = (source === 'app' ? BASE_Z_INDEX : 1000) + order;
-  var elevation = hasElevation ? BASE_ELEVATION + order : 0;
+  var elevation = BASE_ELEVATION + order;
   var nodeRef = React__default.useRef(null);
 
   var _React$useState = React__default.useState({
@@ -3070,8 +3073,13 @@ var TooltipSelect = function TooltipSelect(_a) {
     if (requiresCtrlToChange && (event.ctrlKey || event.metaKey) || !requiresCtrlToChange) {
       if (selectOpen) return;
       var direction = event.deltaY < 0 ? 1 : -1;
-      var newValue = list[Math.min(Math.max(currentIndex - direction, 0), list.length - 1)];
-      onChangeMouseWheel(newValue);
+      var newIndex = currentIndex - direction;
+
+      if (newIndex < 0 || newIndex >= list.length) {
+        return;
+      }
+
+      onChangeMouseWheel(list[newIndex]);
     }
   }, [selectOpen, currentIndex, list, onChangeMouseWheel, requiresCtrlToChange]);
   var onOpen = React.useCallback(function () {
@@ -3294,4 +3302,245 @@ var getWarningMessage = function getWarningMessage(error) {
 // temporary check until we get the unit test passing with container queries
 var IS_JEST = typeof jest !== 'undefined';
 
-export { AlertBanner, AlertIcon, AppHeader, AppLayout, Avatar, ConfirmationDialog, ConfirmationServiceProvider, CustomAccordion, CustomSlider, CustomToggleButton, CustomTooltip, DEFAULT_ERROR_MESSAGE, DraggableComponent$1 as Draggable, EnableButton, ErrorBoundary, HIDDEN_INPUT_HELPER_IS_DRAFT, IS_JEST, ManagerButton, ManagerDeleteButton, ResizeComponent as Resizable, StatusTag, ToggleMenu, ToolButton, ToolContainer, DraggableComponent as ToolContainerDraggable, ToolFooter, ToolHeader, TooltipSelect, UserMenu, UserMenuItemCheatSheet, MenuItemTheme as UserMenuItemTheme, adjustPosition, calculateDialogSizeAndPosition, defaultDelay, getAxiosErrorMessage, getAxiosWarningMessage, getErrorMessage, getInitials, getPosition, getWarningMessage, isAxiosError, showPrompt, sliderHeaderStyle, tooltipContainerStyles, useConfirmationDialog, useControlledTooltip, useDialogActions, useDraftFormHelpers, useIsMounted, useMakeSureContainerStaysInsideWindow, usePoller, usePreventBrowserClose, usePrevious, useUserMenu, withEggs };
+/* *
+ * 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 2022 - Koninklijk Nederlands Meteorologisch Instituut (KNMI)
+ * Copyright 2022 - Finnish Meteorological Institute (FMI)
+ * */
+/**
+ * Parsing date strings with geoweb dateUtils:
+ *
+ * An ISO String *with timezone* can safely be parsed directly to a date:
+ *
+ * date = new Date('2022-10-10T15:30:00Z')
+ * date = new Date('2022-10-10T15:30:00+00:00')
+ * date = new Date('2022-10-10T15:30:00+02:00')
+ *
+ * or using the dateUtils isoStringToDate function *with utc=false*
+ *
+ * date = isoStringToDate('2022-10-10T15:30:00Z', false)
+ *
+ * An ISO String *without a timezone* can be parsed with isoStringToDate
+ *
+ * date = isoStringToDate('2022-10-10T15:30:00')
+ *
+ * *Do not parse ISO without timezone using `new Date()` unless you correct for the local timezone*
+ *
+ * To parse an arbitrary date string with timezone use:
+ *
+ * date = stringToDate('2022.11.10, 11:15 +01:00', 'yyyy.MM.dd, HH:mm xxx', false)
+ *
+ * To parse an arbitrary date string without timezone use:
+ *
+ * date = stringToDate('2022.11.10, 11:15', 'yyyy.MM.dd, HH:mm')
+ *
+ *
+ * To safely convert dates to utc strings use:
+ *
+ * date.toISOString()
+ *
+ * To get parts of UTC time use
+ *
+ * date.getUTCHours()
+ * date.getUTCMins()
+ *
+ * To parse an arbitrary date string to a UTC string use:
+ *
+ * dateToString(new Date('2022-10-10T15:30:00Z', 'HH:ss dd MMM yyyy')
+ *
+ */
+
+/**
+ * Parse an ISO string to a date
+ *
+ * Expects the following props:
+ * @param {string} input - string containing date
+ *
+ * @returns {Date} Date
+ * @example
+ * ``` isoStringToDate("2022-5-10T20:32:00+00:00")) ```
+ */
+
+var isoStringToDate = function isoStringToDate(input) {
+  var utc = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
+  var parsed = parseISO(input);
+
+  if (utc) {
+    return setUTCDate(parsed);
+  }
+
+  return parsed;
+};
+/**
+ * Parse a string to a date
+ *
+ * ***NOTE: String will be parsed in local time if utc is set to false***
+ *
+ * Expects the following props:
+ * @param {string} input - string containing date
+ * @param {string} strFormat - format of the string, see: https://date-fns.org/v2.29.3/docs/parse
+ * @param {boolean} utc [ default = true ] - boolean indicating whether to parse as UTC
+ * @param {Date} referenceDate [ default = new Date() ] - defines values missing from the parsed dateString
+ *
+ * @returns {Date} Date
+ * @example
+ * ``` stringToDate("2022 5 10 20:32", 'yyyy M d HH:mm')) ```
+ */
+
+var stringToDate = function stringToDate(input, strFormat) {
+  var utc = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
+  var referenceDate = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : new Date();
+  var parsed = parse(input, strFormat, referenceDate);
+
+  if (utc) {
+    return setUTCDate(parsed);
+  }
+
+  return parsed;
+};
+/**
+ * Use this if you initialise a date without a timezone to set it to utc correctly
+ * eg.
+ *   new Date(2022, 10, 12, 15, 30)
+ * should be:
+ *   setUTCDate(new Date(2022, 10, 12, 15, 30))
+ *
+ * Expects the following props:
+ * @param {Date} inDate - date to be set to UTC
+ *
+ * @returns {Date} - Date in UTC
+ * @example
+ * ``` setUTCDate(new Date(2022, 10, 12, 15, 30)) ```
+ */
+
+var setUTCDate = function setUTCDate(inDate) {
+  var utcDate = new Date(inDate);
+  utcDate.setUTCFullYear(inDate.getFullYear(), inDate.getMonth(), inDate.getDate());
+  utcDate.setUTCHours(inDate.getHours(), inDate.getMinutes(), inDate.getSeconds(), inDate.getMilliseconds());
+  return utcDate;
+};
+/**
+ * Format a date to a string
+ *
+ * Expects the following props:
+ * @param {Date} inDate - date to be formatted
+ * @param {string} strFormat - format of string
+ * @param {boolean} utc - [default: true] true to return in utc otherwise return in local timezone
+ *
+ * @returns {string} - formatted date string
+ * @example
+ * ``` dateToString(new Date(2022, 10, 12, 15, 30), 'dd MMM yyyy') ```
+ */
+
+var dateToString = function dateToString(inDate, strFormat) {
+  var utc = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
+
+  if (utc) {
+    return format(new Date(inDate.getUTCFullYear(), inDate.getUTCMonth(), inDate.getUTCDate(), inDate.getUTCHours(), inDate.getUTCMinutes(), inDate.getUTCSeconds()), strFormat);
+  }
+
+  return format(inDate, strFormat);
+};
+/**
+ * Find out if a date is between two other dates.
+ *
+ * Inclusivity parameter matches that used in momentjs where '[' indicates inclusion and '(' indicates exclusion.
+ *
+ * Expects the following props:
+ * @param {Date} date - date to be tested
+ * @param {Date} from - first date
+ * @param {Date} to - last date
+ * @param {string} inclusivity - [default: '()'] Must be one of : '()', '[]', '(]', '[)'
+ *
+ * @returns {boolen} - true if date is between, otherwise false
+ *
+ */
+
+var isBetween = function isBetween(date, from, to) {
+  var inclusivity = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : '()';
+
+  if (!['()', '[]', '(]', '[)'].includes(inclusivity)) {
+    throw new Error('Inclusivity parameter must be one of (), [], (], [)');
+  }
+
+  var isBeforeEqual = inclusivity[0] === '[';
+  var isAfterEqual = inclusivity[1] === ']';
+  return (isBeforeEqual ? isEqual(from, date) || isBefore(from, date) : isBefore(from, date)) && (isAfterEqual ? isEqual(to, date) || isAfter(to, date) : isAfter(to, date));
+};
+/**
+ * Creates a new Date object with the specified date and time, or the current date and time if no arguments are provided.
+ *
+ * @param yearOrIsoString The year for the new Date object, or an ISO-formatted string representing the date and time.
+ * @param month The month for the new Date object (0-11).
+ * @param day The day for the new Date object (1-31).
+ * @param hours The hour for the new Date object (0-23).
+ * @param minutes The minute for the new Date object (0-59).
+ * @param seconds The second for the new Date object (0-59).
+ * @param milliseconds The millisecond for the new Date object (0-999).
+ * @returns A new Date object with the specified date and time, or the current date and time if no arguments are provided.
+ *
+ * @example
+ * createDate(2022, 11, 13);
+ * // => 2022-12-13T00:00:00.000Z
+ *
+ * @example
+ * createDate('2022-12-13T00:00:00.000Z');
+ * // => 2022-12-13T00:00:00.000Z
+ */
+
+var createDate = function createDate(yearOrIsoString, month, day) {
+  var hours = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 0;
+  var minutes = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 0;
+  var seconds = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : 0;
+  var milliseconds = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : 0;
+
+  if (yearOrIsoString === undefined) {
+    return new Date();
+  }
+
+  if (typeof yearOrIsoString === 'string') {
+    return new Date(yearOrIsoString);
+  }
+
+  return new Date(yearOrIsoString, month, day, hours, minutes, seconds, milliseconds);
+};
+
+/* *
+ * 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 2022 - Koninklijk Nederlands Meteorologisch Instituut (KNMI)
+ * Copyright 2022 - Finnish Meteorological Institute (FMI)
+ * */
+
+var index = /*#__PURE__*/Object.freeze({
+    __proto__: null,
+    isoStringToDate: isoStringToDate,
+    stringToDate: stringToDate,
+    setUTCDate: setUTCDate,
+    dateToString: dateToString,
+    isBetween: isBetween,
+    createDate: createDate
+});
+
+export { AlertBanner, AlertIcon, AppHeader, AppLayout, Avatar, ConfirmationDialog, ConfirmationServiceProvider, CustomAccordion, CustomSlider, CustomToggleButton, CustomTooltip, DEFAULT_ERROR_MESSAGE, DraggableComponent$1 as Draggable, EnableButton, ErrorBoundary, HIDDEN_INPUT_HELPER_IS_DRAFT, IS_JEST, ManagerButton, ManagerDeleteButton, ResizeComponent as Resizable, StatusTag, ToggleMenu, ToolButton, ToolContainer, DraggableComponent as ToolContainerDraggable, ToolFooter, ToolHeader, TooltipSelect, UserMenu, UserMenuItemCheatSheet, MenuItemTheme as UserMenuItemTheme, adjustPosition, calculateDialogSizeAndPosition, index as dateUtils, defaultDelay, getAxiosErrorMessage, getAxiosWarningMessage, getErrorMessage, getInitials, getPosition, getWarningMessage, isAxiosError, showPrompt, sliderHeaderStyle, tooltipContainerStyles, useConfirmationDialog, useControlledTooltip, useDialogActions, useDraftFormHelpers, useIsMounted, useMakeSureContainerStaysInsideWindow, usePoller, usePreventBrowserClose, usePrevious, useUserMenu, withEggs };

package/index.umd.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react'), require('@mui/material'), require('@opengeoweb/theme'), require('react-hook-form'), require('@opengeoweb/form-fields'), require('lodash'), require('react-draggable'), require('re-resizable'), require('react-redux')) :
-    typeof define === 'function' && define.amd ? define(['exports', 'react', '@mui/material', '@opengeoweb/theme', 'react-hook-form', '@opengeoweb/form-fields', 'lodash', 'react-draggable', 're-resizable', 'react-redux'], factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.Shared = {}, global.React, global.material, global.theme, global.reactHookForm, global.formFields, global.lodash, global.Draggable, global.reResizable, global.reactRedux));
-})(this, (function (exports, React, material, theme, reactHookForm, formFields, lodash, Draggable, reResizable, reactRedux) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react'), require('@mui/material'), require('@opengeoweb/theme'), require('react-hook-form'), require('@opengeoweb/form-fields'), require('lodash'), require('react-draggable'), require('re-resizable'), require('react-redux'), require('date-fns')) :
+    typeof define === 'function' && define.amd ? define(['exports', 'react', '@mui/material', '@opengeoweb/theme', 'react-hook-form', '@opengeoweb/form-fields', 'lodash', 'react-draggable', 're-resizable', 'react-redux', 'date-fns'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.Shared = {}, global.React, global.material, global.theme, global.reactHookForm, global.formFields, global.lodash, global.Draggable, global.reResizable, global.reactRedux, global.dateFns));
+})(this, (function (exports, React, material, theme, reactHookForm, formFields, lodash, Draggable, reResizable, reactRedux, dateFns) { 'use strict';
 
     function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -450,7 +450,9 @@
           register = _a.register;
 
       React__namespace.useEffect(function () {
-        setValue(HIDDEN_INPUT_HELPER_IS_DRAFT, isDefaultDraft); // eslint-disable-next-line react-hooks/exhaustive-deps
+        setValue(HIDDEN_INPUT_HELPER_IS_DRAFT, isDefaultDraft, {
+          shouldDirty: false
+        }); // eslint-disable-next-line react-hooks/exhaustive-deps
       }, []);
 
       var isDraft = function isDraft() {
@@ -466,7 +468,9 @@
       };
 
       var toggleIsDraft = function toggleIsDraft(isDraft) {
-        return setValue(HIDDEN_INPUT_HELPER_IS_DRAFT, isDraft);
+        return setValue(HIDDEN_INPUT_HELPER_IS_DRAFT, isDraft, {
+          shouldDirty: false
+        });
       };
 
       var DraftFieldHelper = function DraftFieldHelper() {
@@ -1776,27 +1780,25 @@
           leftHeaderComponent = _q === void 0 ? null : _q,
           _r = _a.rightHeaderComponent,
           rightHeaderComponent = _r === void 0 ? null : _r,
-          _s = _a.hasElevation,
-          hasElevation = _s === void 0 ? true : _s,
           className = _a.className,
-          _t = _a.sx,
-          sx = _t === void 0 ? {} : _t,
-          props = __rest(_a, ["title", "bounds", "headerSize", "startSize", "startPosition", "children", "isOpen", "onClose", "initialMaxHeight", "onChangeSize", "onMouseDown", "onResizeStop", "onDragEnd", "order", "source", "leftHeaderComponent", "rightHeaderComponent", "hasElevation", "className", "sx"]);
+          _s = _a.sx,
+          sx = _s === void 0 ? {} : _s,
+          props = __rest(_a, ["title", "bounds", "headerSize", "startSize", "startPosition", "children", "isOpen", "onClose", "initialMaxHeight", "onChangeSize", "onMouseDown", "onResizeStop", "onDragEnd", "order", "source", "leftHeaderComponent", "rightHeaderComponent", "className", "sx"]);
 
       var zIndex = (source === 'app' ? BASE_Z_INDEX : 1000) + order;
-      var elevation = hasElevation ? BASE_ELEVATION + order : 0;
+      var elevation = BASE_ELEVATION + order;
       var nodeRef = React__default["default"].useRef(null);
 
-      var _u = __read(React__default["default"].useState({
+      var _t = __read(React__default["default"].useState({
         x: 0,
         y: 0
       }), 2),
-          position = _u[0],
-          setPosition = _u[1];
+          position = _t[0],
+          setPosition = _t[1];
 
-      var _v = __read(React__default["default"].useState(startSize), 2),
-          size = _v[0],
-          setSize = _v[1];
+      var _u = __read(React__default["default"].useState(startSize), 2),
+          size = _u[0],
+          setSize = _u[1];
 
       var isRightAligned = startPosition && startPosition.right !== null && startPosition.right !== undefined;
       var onStopDrag = React__default["default"].useCallback(function (_event, position) {
@@ -1804,13 +1806,13 @@
         onDragEnd(position, size);
       }, [setPosition, onDragEnd, size]);
 
-      var _w = __read(React__default["default"].useState(defaultInitialMaxHeight), 2),
-          initialMaxHeight = _w[0],
-          setInitialMaxHeight = _w[1];
+      var _v = __read(React__default["default"].useState(defaultInitialMaxHeight), 2),
+          initialMaxHeight = _v[0],
+          setInitialMaxHeight = _v[1];
 
-      var _x = __read(React__default["default"].useState(0), 2),
-          initialDragPositionX = _x[0],
-          setInitialDragPositionX = _x[1];
+      var _w = __read(React__default["default"].useState(0), 2),
+          initialDragPositionX = _w[0],
+          setInitialDragPositionX = _w[1];
 
       var onStartResize = function onStartResize() {
         setInitialMaxHeight('initial');
@@ -2940,8 +2942,13 @@
         if (requiresCtrlToChange && (event.ctrlKey || event.metaKey) || !requiresCtrlToChange) {
           if (selectOpen) return;
           var direction = event.deltaY < 0 ? 1 : -1;
-          var newValue = list[Math.min(Math.max(currentIndex - direction, 0), list.length - 1)];
-          onChangeMouseWheel(newValue);
+          var newIndex = currentIndex - direction;
+
+          if (newIndex < 0 || newIndex >= list.length) {
+            return;
+          }
+
+          onChangeMouseWheel(list[newIndex]);
         }
       }, [selectOpen, currentIndex, list, onChangeMouseWheel, requiresCtrlToChange]);
       var onOpen = React__namespace.useCallback(function () {
@@ -3162,6 +3169,271 @@
     // temporary check until we get the unit test passing with container queries
     var IS_JEST = typeof jest !== 'undefined';
 
+    /* *
+     * 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 2022 - Koninklijk Nederlands Meteorologisch Instituut (KNMI)
+     * Copyright 2022 - Finnish Meteorological Institute (FMI)
+     * */
+    /**
+     * Parsing date strings with geoweb dateUtils:
+     *
+     * An ISO String *with timezone* can safely be parsed directly to a date:
+     *
+     * date = new Date('2022-10-10T15:30:00Z')
+     * date = new Date('2022-10-10T15:30:00+00:00')
+     * date = new Date('2022-10-10T15:30:00+02:00')
+     *
+     * or using the dateUtils isoStringToDate function *with utc=false*
+     *
+     * date = isoStringToDate('2022-10-10T15:30:00Z', false)
+     *
+     * An ISO String *without a timezone* can be parsed with isoStringToDate
+     *
+     * date = isoStringToDate('2022-10-10T15:30:00')
+     *
+     * *Do not parse ISO without timezone using `new Date()` unless you correct for the local timezone*
+     *
+     * To parse an arbitrary date string with timezone use:
+     *
+     * date = stringToDate('2022.11.10, 11:15 +01:00', 'yyyy.MM.dd, HH:mm xxx', false)
+     *
+     * To parse an arbitrary date string without timezone use:
+     *
+     * date = stringToDate('2022.11.10, 11:15', 'yyyy.MM.dd, HH:mm')
+     *
+     *
+     * To safely convert dates to utc strings use:
+     *
+     * date.toISOString()
+     *
+     * To get parts of UTC time use
+     *
+     * date.getUTCHours()
+     * date.getUTCMins()
+     *
+     * To parse an arbitrary date string to a UTC string use:
+     *
+     * dateToString(new Date('2022-10-10T15:30:00Z', 'HH:ss dd MMM yyyy')
+     *
+     */
+
+    /**
+     * Parse an ISO string to a date
+     *
+     * Expects the following props:
+     * @param {string} input - string containing date
+     *
+     * @returns {Date} Date
+     * @example
+     * ``` isoStringToDate("2022-5-10T20:32:00+00:00")) ```
+     */
+
+    var isoStringToDate = function isoStringToDate(input, utc) {
+      if (utc === void 0) {
+        utc = true;
+      }
+
+      var parsed = dateFns.parseISO(input);
+
+      if (utc) {
+        return setUTCDate(parsed);
+      }
+
+      return parsed;
+    };
+    /**
+     * Parse a string to a date
+     *
+     * ***NOTE: String will be parsed in local time if utc is set to false***
+     *
+     * Expects the following props:
+     * @param {string} input - string containing date
+     * @param {string} strFormat - format of the string, see: https://date-fns.org/v2.29.3/docs/parse
+     * @param {boolean} utc [ default = true ] - boolean indicating whether to parse as UTC
+     * @param {Date} referenceDate [ default = new Date() ] - defines values missing from the parsed dateString
+     *
+     * @returns {Date} Date
+     * @example
+     * ``` stringToDate("2022 5 10 20:32", 'yyyy M d HH:mm')) ```
+     */
+
+    var stringToDate = function stringToDate(input, strFormat, utc, referenceDate) {
+      if (utc === void 0) {
+        utc = true;
+      }
+
+      if (referenceDate === void 0) {
+        referenceDate = new Date();
+      }
+
+      var parsed = dateFns.parse(input, strFormat, referenceDate);
+
+      if (utc) {
+        return setUTCDate(parsed);
+      }
+
+      return parsed;
+    };
+    /**
+     * Use this if you initialise a date without a timezone to set it to utc correctly
+     * eg.
+     *   new Date(2022, 10, 12, 15, 30)
+     * should be:
+     *   setUTCDate(new Date(2022, 10, 12, 15, 30))
+     *
+     * Expects the following props:
+     * @param {Date} inDate - date to be set to UTC
+     *
+     * @returns {Date} - Date in UTC
+     * @example
+     * ``` setUTCDate(new Date(2022, 10, 12, 15, 30)) ```
+     */
+
+    var setUTCDate = function setUTCDate(inDate) {
+      var utcDate = new Date(inDate);
+      utcDate.setUTCFullYear(inDate.getFullYear(), inDate.getMonth(), inDate.getDate());
+      utcDate.setUTCHours(inDate.getHours(), inDate.getMinutes(), inDate.getSeconds(), inDate.getMilliseconds());
+      return utcDate;
+    };
+    /**
+     * Format a date to a string
+     *
+     * Expects the following props:
+     * @param {Date} inDate - date to be formatted
+     * @param {string} strFormat - format of string
+     * @param {boolean} utc - [default: true] true to return in utc otherwise return in local timezone
+     *
+     * @returns {string} - formatted date string
+     * @example
+     * ``` dateToString(new Date(2022, 10, 12, 15, 30), 'dd MMM yyyy') ```
+     */
+
+    var dateToString = function dateToString(inDate, strFormat, utc) {
+      if (utc === void 0) {
+        utc = true;
+      }
+
+      if (utc) {
+        return dateFns.format(new Date(inDate.getUTCFullYear(), inDate.getUTCMonth(), inDate.getUTCDate(), inDate.getUTCHours(), inDate.getUTCMinutes(), inDate.getUTCSeconds()), strFormat);
+      }
+
+      return dateFns.format(inDate, strFormat);
+    };
+    /**
+     * Find out if a date is between two other dates.
+     *
+     * Inclusivity parameter matches that used in momentjs where '[' indicates inclusion and '(' indicates exclusion.
+     *
+     * Expects the following props:
+     * @param {Date} date - date to be tested
+     * @param {Date} from - first date
+     * @param {Date} to - last date
+     * @param {string} inclusivity - [default: '()'] Must be one of : '()', '[]', '(]', '[)'
+     *
+     * @returns {boolen} - true if date is between, otherwise false
+     *
+     */
+
+    var isBetween = function isBetween(date, from, to, inclusivity) {
+      if (inclusivity === void 0) {
+        inclusivity = '()';
+      }
+
+      if (!['()', '[]', '(]', '[)'].includes(inclusivity)) {
+        throw new Error('Inclusivity parameter must be one of (), [], (], [)');
+      }
+
+      var isBeforeEqual = inclusivity[0] === '[';
+      var isAfterEqual = inclusivity[1] === ']';
+      return (isBeforeEqual ? dateFns.isEqual(from, date) || dateFns.isBefore(from, date) : dateFns.isBefore(from, date)) && (isAfterEqual ? dateFns.isEqual(to, date) || dateFns.isAfter(to, date) : dateFns.isAfter(to, date));
+    };
+    /**
+     * Creates a new Date object with the specified date and time, or the current date and time if no arguments are provided.
+     *
+     * @param yearOrIsoString The year for the new Date object, or an ISO-formatted string representing the date and time.
+     * @param month The month for the new Date object (0-11).
+     * @param day The day for the new Date object (1-31).
+     * @param hours The hour for the new Date object (0-23).
+     * @param minutes The minute for the new Date object (0-59).
+     * @param seconds The second for the new Date object (0-59).
+     * @param milliseconds The millisecond for the new Date object (0-999).
+     * @returns A new Date object with the specified date and time, or the current date and time if no arguments are provided.
+     *
+     * @example
+     * createDate(2022, 11, 13);
+     * // => 2022-12-13T00:00:00.000Z
+     *
+     * @example
+     * createDate('2022-12-13T00:00:00.000Z');
+     * // => 2022-12-13T00:00:00.000Z
+     */
+
+    var createDate = function createDate(yearOrIsoString, month, day, hours, minutes, seconds, milliseconds) {
+      if (hours === void 0) {
+        hours = 0;
+      }
+
+      if (minutes === void 0) {
+        minutes = 0;
+      }
+
+      if (seconds === void 0) {
+        seconds = 0;
+      }
+
+      if (milliseconds === void 0) {
+        milliseconds = 0;
+      }
+
+      if (yearOrIsoString === undefined) {
+        return new Date();
+      }
+
+      if (typeof yearOrIsoString === 'string') {
+        return new Date(yearOrIsoString);
+      }
+
+      return new Date(yearOrIsoString, month, day, hours, minutes, seconds, milliseconds);
+    };
+
+    /* *
+     * 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 2022 - Koninklijk Nederlands Meteorologisch Instituut (KNMI)
+     * Copyright 2022 - Finnish Meteorological Institute (FMI)
+     * */
+
+    var index = /*#__PURE__*/Object.freeze({
+        __proto__: null,
+        isoStringToDate: isoStringToDate,
+        stringToDate: stringToDate,
+        setUTCDate: setUTCDate,
+        dateToString: dateToString,
+        isBetween: isBetween,
+        createDate: createDate
+    });
+
     exports.AlertBanner = AlertBanner;
     exports.AlertIcon = AlertIcon;
     exports.AppHeader = AppHeader;
@@ -3195,6 +3467,7 @@
     exports.UserMenuItemTheme = MenuItemTheme;
     exports.adjustPosition = adjustPosition;
     exports.calculateDialogSizeAndPosition = calculateDialogSizeAndPosition;
+    exports.dateUtils = index;
     exports.defaultDelay = defaultDelay;
     exports.getAxiosErrorMessage = getAxiosErrorMessage;
     exports.getAxiosWarningMessage = getAxiosWarningMessage;

package/lib/components/ToolContainer/ToolContainerDraggable.d.ts

@@ -25,7 +25,6 @@ interface DraggableComponentProps extends Omit<ResizableComponentProps, 'bounds'
     source?: 'app' | 'module';
     leftHeaderComponent?: React.ReactNode;
     rightHeaderComponent?: React.ReactNode;
-    hasElevation?: boolean;
     sx?: SxProps;
 }
 declare const DraggableComponent: React.FC<DraggableComponentProps>;

package/lib/utils/dateUtils/dateUtils.d.ts

@@ -0,0 +1,133 @@
+/**
+ * Parsing date strings with geoweb dateUtils:
+ *
+ * An ISO String *with timezone* can safely be parsed directly to a date:
+ *
+ * date = new Date('2022-10-10T15:30:00Z')
+ * date = new Date('2022-10-10T15:30:00+00:00')
+ * date = new Date('2022-10-10T15:30:00+02:00')
+ *
+ * or using the dateUtils isoStringToDate function *with utc=false*
+ *
+ * date = isoStringToDate('2022-10-10T15:30:00Z', false)
+ *
+ * An ISO String *without a timezone* can be parsed with isoStringToDate
+ *
+ * date = isoStringToDate('2022-10-10T15:30:00')
+ *
+ * *Do not parse ISO without timezone using `new Date()` unless you correct for the local timezone*
+ *
+ * To parse an arbitrary date string with timezone use:
+ *
+ * date = stringToDate('2022.11.10, 11:15 +01:00', 'yyyy.MM.dd, HH:mm xxx', false)
+ *
+ * To parse an arbitrary date string without timezone use:
+ *
+ * date = stringToDate('2022.11.10, 11:15', 'yyyy.MM.dd, HH:mm')
+ *
+ *
+ * To safely convert dates to utc strings use:
+ *
+ * date.toISOString()
+ *
+ * To get parts of UTC time use
+ *
+ * date.getUTCHours()
+ * date.getUTCMins()
+ *
+ * To parse an arbitrary date string to a UTC string use:
+ *
+ * dateToString(new Date('2022-10-10T15:30:00Z', 'HH:ss dd MMM yyyy')
+ *
+ */
+/**
+ * Parse an ISO string to a date
+ *
+ * Expects the following props:
+ * @param {string} input - string containing date
+ *
+ * @returns {Date} Date
+ * @example
+ * ``` isoStringToDate("2022-5-10T20:32:00+00:00")) ```
+ */
+export declare const isoStringToDate: (input: string, utc?: boolean) => Date;
+/**
+ * Parse a string to a date
+ *
+ * ***NOTE: String will be parsed in local time if utc is set to false***
+ *
+ * Expects the following props:
+ * @param {string} input - string containing date
+ * @param {string} strFormat - format of the string, see: https://date-fns.org/v2.29.3/docs/parse
+ * @param {boolean} utc [ default = true ] - boolean indicating whether to parse as UTC
+ * @param {Date} referenceDate [ default = new Date() ] - defines values missing from the parsed dateString
+ *
+ * @returns {Date} Date
+ * @example
+ * ``` stringToDate("2022 5 10 20:32", 'yyyy M d HH:mm')) ```
+ */
+export declare const stringToDate: (input: string, strFormat: string, utc?: boolean, referenceDate?: Date | number) => Date;
+/**
+ * Use this if you initialise a date without a timezone to set it to utc correctly
+ * eg.
+ *   new Date(2022, 10, 12, 15, 30)
+ * should be:
+ *   setUTCDate(new Date(2022, 10, 12, 15, 30))
+ *
+ * Expects the following props:
+ * @param {Date} inDate - date to be set to UTC
+ *
+ * @returns {Date} - Date in UTC
+ * @example
+ * ``` setUTCDate(new Date(2022, 10, 12, 15, 30)) ```
+ */
+export declare const setUTCDate: (inDate: Date) => Date;
+/**
+ * Format a date to a string
+ *
+ * Expects the following props:
+ * @param {Date} inDate - date to be formatted
+ * @param {string} strFormat - format of string
+ * @param {boolean} utc - [default: true] true to return in utc otherwise return in local timezone
+ *
+ * @returns {string} - formatted date string
+ * @example
+ * ``` dateToString(new Date(2022, 10, 12, 15, 30), 'dd MMM yyyy') ```
+ */
+export declare const dateToString: (inDate: Date, strFormat: string, utc?: boolean) => string;
+/**
+ * Find out if a date is between two other dates.
+ *
+ * Inclusivity parameter matches that used in momentjs where '[' indicates inclusion and '(' indicates exclusion.
+ *
+ * Expects the following props:
+ * @param {Date} date - date to be tested
+ * @param {Date} from - first date
+ * @param {Date} to - last date
+ * @param {string} inclusivity - [default: '()'] Must be one of : '()', '[]', '(]', '[)'
+ *
+ * @returns {boolen} - true if date is between, otherwise false
+ *
+ */
+export declare const isBetween: (date: Date, from: Date, to: Date, inclusivity?: string) => boolean;
+/**
+ * Creates a new Date object with the specified date and time, or the current date and time if no arguments are provided.
+ *
+ * @param yearOrIsoString The year for the new Date object, or an ISO-formatted string representing the date and time.
+ * @param month The month for the new Date object (0-11).
+ * @param day The day for the new Date object (1-31).
+ * @param hours The hour for the new Date object (0-23).
+ * @param minutes The minute for the new Date object (0-59).
+ * @param seconds The second for the new Date object (0-59).
+ * @param milliseconds The millisecond for the new Date object (0-999).
+ * @returns A new Date object with the specified date and time, or the current date and time if no arguments are provided.
+ *
+ * @example
+ * createDate(2022, 11, 13);
+ * // => 2022-12-13T00:00:00.000Z
+ *
+ * @example
+ * createDate('2022-12-13T00:00:00.000Z');
+ * // => 2022-12-13T00:00:00.000Z
+ */
+export declare const createDate: (yearOrIsoString?: string | number | undefined, month?: number | undefined, day?: number | undefined, hours?: number, minutes?: number, seconds?: number, milliseconds?: number) => Date;

package/lib/utils/dateUtils/dateUtils.spec.d.ts

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

package/lib/utils/dateUtils/index.d.ts

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

package/lib/utils/index.d.ts

@@ -1,2 +1,3 @@
 export * from './axiosErrorUtils';
 export * from './containerQueryHelper';
+export * as dateUtils from './dateUtils';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opengeoweb/shared",
-  "version": "4.6.0",
+  "version": "4.7.0",
   "description": "GeoWeb shared library with shared components and utils for the opengeoweb project",
   "license": "Apache-2.0",
   "repository": {
@@ -14,17 +14,18 @@
   "peerDependencies": {
     "react": "^17.0.2",
     "@mui/material": "^5.10.8",
-    "@opengeoweb/theme": "4.6.0",
+    "@opengeoweb/theme": "4.7.0",
     "react-draggable": "^4.4.5",
     "re-resizable": "^6.9.0",
     "@redux-eggs/core": "^2.2.0",
     "react-redux": "^8.0.4",
-    "@opengeoweb/form-fields": "4.6.0",
+    "@opengeoweb/form-fields": "4.7.0",
     "react-hook-form": "^6.12.1",
     "moment": "^2.29.0",
     "moment-timezone": "^0.5.31",
     "@mui/x-date-pickers": "^5.0.4",
     "lodash": "^4.17.20",
-    "axios": "^0.25.0"
+    "axios": "^0.25.0",
+    "date-fns": "^2.29.3"
   }
 }