@opengeoweb/shared 4.2.0 → 4.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/index.esm.js CHANGED
@@ -4,72 +4,10 @@ import { Box, Typography, Dialog, DialogTitle, IconButton, DialogContent, Dialog
4
4
  import { Close, Exclamation, Success, Info, ChevronRight, GeoWebLogo, Resize, useThemeContext, DragHandle, ArrowLeft, ArrowRight, KeyOption, ArrowUp, ArrowDown, KeyCommand, Options, Delete, VisibilityOff, Visibility } from '@opengeoweb/theme';
5
5
  import { useFormContext } from 'react-hook-form';
6
6
  import { isEmpty, errorMessages } from '@opengeoweb/form-fields';
7
+ import { throttle } from 'lodash';
7
8
  import Draggable from 'react-draggable';
8
9
  import { Resizable } from 're-resizable';
9
- import { throttle } from 'lodash';
10
-
11
- /* *
12
- * Licensed under the Apache License, Version 2.0 (the "License");
13
- * you may not use this file except in compliance with the License.
14
- * You may obtain a copy of the License at
15
- *
16
- * http://www.apache.org/licenses/LICENSE-2.0
17
- *
18
- * Unless required by applicable law or agreed to in writing, software
19
- * distributed under the License is distributed on an "AS IS" BASIS,
20
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
21
- * See the License for the specific language governing permissions and
22
- * limitations under the License.
23
- *
24
- * Copyright 2021 - Koninklijk Nederlands Meteorologisch Instituut (KNMI)
25
- * Copyright 2021 - Finnish Meteorological Institute (FMI)
26
- * */
27
- var bgColors = {
28
- green: '#fcffeb',
29
- grey: '#f8f9f9',
30
- purple: '#f8f9f9',
31
- red: '#f9e8ea',
32
- yellow: '#fff8eb'
33
- };
34
- var borderColors = {
35
- green: '#72bb23',
36
- grey: '#9b9fb0',
37
- purple: '#9d9df2',
38
- red: '#f24a00',
39
- yellow: '#ffa800'
40
- };
41
-
42
- var tagStyle = function tagStyle(color) {
43
- // Set color to grey for summary
44
- var bgcolor = bgColors[color];
45
- var borderColor = borderColors[color];
46
- return {
47
- backgroundColor: bgcolor,
48
- m: 0,
49
- p: 0.5,
50
- border: "2px solid ".concat(borderColor),
51
- borderRadius: '4px',
52
- width: '85px',
53
- height: '20px',
54
- color: '#051039',
55
- maxHeight: '1em',
56
- boxSizing: 'content-box'
57
- };
58
- };
59
-
60
- var StatusTag = function StatusTag(_ref) {
61
- var content = _ref.content,
62
- color = _ref.color;
63
- return /*#__PURE__*/React.createElement(Box, {
64
- display: "flex",
65
- alignItems: "center",
66
- justifyContent: "center",
67
- sx: Object.assign({}, tagStyle(color)),
68
- "data-testid": "statusTag"
69
- }, /*#__PURE__*/React.createElement(Typography, {
70
- variant: "caption"
71
- }, content));
72
- };
10
+ import { useStore } from 'react-redux';
73
11
 
74
12
  /*! *****************************************************************************
75
13
  Copyright (c) Microsoft Corporation.
@@ -98,6 +36,58 @@ function __rest(s, e) {
98
36
  return t;
99
37
  }
100
38
 
39
+ var bgColors = {
40
+ green: 'geowebColors.functional.successOutline.fill',
41
+ grey: 'geowebColors.functional.disabledOutline.fill',
42
+ purple: 'geowebColors.functional.summaryOutline.fill',
43
+ red: 'geowebColors.functional.errorOutline.fill',
44
+ yellow: 'geowebColors.functional.warningOutline.fill',
45
+ blue: 'geowebColors.functional.notificationOutline.fill'
46
+ };
47
+ var borderColors = {
48
+ green: 'geowebColors.functional.successOutline.borderColor',
49
+ grey: 'geowebColors.functional.disabledOutline.borderColor',
50
+ purple: 'geowebColors.functional.summaryOutline.borderColor',
51
+ red: 'geowebColors.functional.errorOutline.borderColor',
52
+ yellow: 'geowebColors.functional.warningOutline.borderColor',
53
+ blue: 'geowebColors.functional.notificationOutline.borderColor'
54
+ };
55
+
56
+ var tagStyle = function tagStyle(color) {
57
+ // Set color to grey for summary
58
+ var backgroundColor = bgColors[color];
59
+ var borderColor = borderColors[color];
60
+ return {
61
+ backgroundColor: backgroundColor,
62
+ m: 0,
63
+ p: 0,
64
+ border: '1px solid',
65
+ borderColor: borderColor,
66
+ borderRadius: '4px',
67
+ width: '120px',
68
+ height: '18px',
69
+ lineHeight: '16px',
70
+ color: 'geowebColors.captions.captionStatus.rgba'
71
+ };
72
+ };
73
+
74
+ var StatusTag = function StatusTag(_a) {
75
+ var content = _a.content,
76
+ color = _a.color,
77
+ props = __rest(_a, ["content", "color"]);
78
+
79
+ return /*#__PURE__*/React.createElement(Box, {
80
+ display: "flex",
81
+ alignItems: "center",
82
+ justifyContent: "center",
83
+ "data-testid": "statusTag",
84
+ className: "statusTag",
85
+ sx: Object.assign(Object.assign({}, tagStyle(color)), props.sx)
86
+ }, /*#__PURE__*/React.createElement(Typography, {
87
+ variant: "caption"
88
+ }, content));
89
+ };
90
+
101
91
  var confirmStyle = {
102
92
  width: {
103
93
  xs: '100%',
@@ -624,6 +614,65 @@ var useDraftFormHelpers = function useDraftFormHelpers() {
624
614
  };
625
615
  };
626
616
 
617
+ /* *
618
+ * Licensed under the Apache License, Version 2.0 (the "License");
619
+ * you may not use this file except in compliance with the License.
620
+ * You may obtain a copy of the License at
621
+ *
622
+ * http://www.apache.org/licenses/LICENSE-2.0
623
+ *
624
+ * Unless required by applicable law or agreed to in writing, software
625
+ * distributed under the License is distributed on an "AS IS" BASIS,
626
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
627
+ * See the License for the specific language governing permissions and
628
+ * limitations under the License.
629
+ *
630
+ * Copyright 2022 - Koninklijk Nederlands Meteorologisch Instituut (KNMI)
631
+ * Copyright 2022 - Finnish Meteorological Institute (FMI)
632
+ * */
633
+ var useMakeSureContainerStaysInsideWindow = function useMakeSureContainerStaysInsideWindow(nodeRef, position, setPosition) {
634
+ var onResizeWindow = React__default.useCallback(function (event) {
635
+ if (!nodeRef.current) return;
636
+ var bbox = nodeRef.current.firstChild.getBoundingClientRect();
637
+ var windowTarget = event.currentTarget;
638
+ if (!windowTarget) return;
639
+ var innerHeight = windowTarget.innerHeight,
640
+ innerWidth = windowTarget.innerWidth;
641
+ var isHorizontallyLarger = bbox.width > innerWidth;
642
+ var isVerticallyLarger = bbox.height > innerHeight; // left screen
643
+
644
+ if (bbox.x < 0 || isHorizontallyLarger) {
645
+ setPosition(Object.assign(Object.assign({}, position), {
646
+ x: position.x - bbox.x
647
+ }));
648
+ } // right screen
649
+ else if (bbox.x + bbox.width >= innerWidth) {
650
+ var diffX = innerWidth - bbox.x - bbox.width;
651
+ setPosition(Object.assign(Object.assign({}, position), {
652
+ x: position.x + diffX
653
+ }));
654
+ } // top screen
655
+ else if (bbox.y < 0 || isVerticallyLarger) {
656
+ setPosition(Object.assign(Object.assign({}, position), {
657
+ y: position.y - bbox.y
658
+ }));
659
+ } // bottom screen
660
+ else if (bbox.y + bbox.height >= innerHeight) {
661
+ var diffY = innerHeight - bbox.y - bbox.height;
662
+ setPosition(Object.assign(Object.assign({}, position), {
663
+ y: position.y + diffY
664
+ }));
665
+ }
666
+ }, [nodeRef, position, setPosition]);
667
+ React__default.useEffect(function () {
668
+ var throttledResize = throttle(onResizeWindow, 100);
669
+ window.addEventListener('resize', throttledResize);
670
+ return function () {
671
+ window.removeEventListener('resize', throttledResize);
672
+ };
673
+ }, [onResizeWindow]);
674
+ };
675
+
627
676
  var ConfirmationServiceContext = /*#__PURE__*/React.createContext(Promise.reject);
628
677
  var useConfirmationDialog = function useConfirmationDialog() {
629
678
  return React.useContext(ConfirmationServiceContext);
@@ -1681,46 +1730,7 @@ var DraggableComponent = function DraggableComponent(_a) {
1681
1730
  height: height
1682
1731
  });
1683
1732
  }, [onChangeSize]);
1684
- var onResizeWindow = React__default.useCallback(function (event) {
1685
- if (!nodeRef.current) return;
1686
- var bbox = nodeRef.current.firstChild.getBoundingClientRect();
1687
- var windowTarget = event.currentTarget;
1688
- if (!windowTarget) return;
1689
- var innerHeight = windowTarget.innerHeight,
1690
- innerWidth = windowTarget.innerWidth;
1691
- var isHorizontallyLarger = bbox.width > innerWidth;
1692
- var isVerticallyLarger = bbox.height > innerHeight; // left screen
1693
-
1694
- if (bbox.x < 0 || isHorizontallyLarger) {
1695
- setPosition(Object.assign(Object.assign({}, position), {
1696
- x: position.x - bbox.x
1697
- }));
1698
- } // right screen
1699
- else if (bbox.x + bbox.width >= innerWidth) {
1700
- var diffX = innerWidth - bbox.x - bbox.width;
1701
- setPosition(Object.assign(Object.assign({}, position), {
1702
- x: position.x + diffX
1703
- }));
1704
- } // top screen
1705
- else if (bbox.y < 0 || isVerticallyLarger) {
1706
- setPosition(Object.assign(Object.assign({}, position), {
1707
- y: position.y - bbox.y
1708
- }));
1709
- } // bottom screen
1710
- else if (bbox.y + bbox.height >= innerHeight) {
1711
- var diffY = innerHeight - bbox.y - bbox.height;
1712
- setPosition(Object.assign(Object.assign({}, position), {
1713
- y: position.y + diffY
1714
- }));
1715
- }
1716
- }, [position]);
1717
- React__default.useEffect(function () {
1718
- var throttledResize = throttle(onResizeWindow, 100);
1719
- window.addEventListener('resize', throttledResize);
1720
- return function () {
1721
- window.removeEventListener('resize', throttledResize);
1722
- };
1723
- }, [onResizeWindow]);
1733
+ useMakeSureContainerStaysInsideWindow(nodeRef, position, setPosition);
1724
1734
  var toolcontainerId = React__default.useRef(Date.now().toString()).current;
1725
1735
  var headerClassName = "header-".concat(toolcontainerId);
1726
1736
  return isOpen ? /*#__PURE__*/React__default.createElement(DraggableComponent$1, {
@@ -2835,6 +2845,28 @@ var TooltipSelect = function TooltipSelect(_a) {
2835
2845
  }, otherProps)));
2836
2846
  };
2837
2847
 
2848
+ function withEggs(eggs) {
2849
+ return function (Component) {
2850
+ var WithEggs = function WithEggs(props) {
2851
+ var store = useStore();
2852
+
2853
+ var _React$useState = React.useState(function () {
2854
+ return store.addEggs(eggs);
2855
+ }),
2856
+ _React$useState2 = _slicedToArray(_React$useState, 1),
2857
+ remover = _React$useState2[0];
2858
+
2859
+ React.useEffect(function () {
2860
+ return remover;
2861
+ }, [remover]);
2862
+ return /*#__PURE__*/React.createElement(Component, Object.assign({}, props));
2863
+ };
2864
+
2865
+ WithEggs.displayName = "withEggs(".concat(Component.displayName || Component.name || 'Component', ")");
2866
+ return WithEggs;
2867
+ };
2868
+ }
2869
+
2838
2870
  /* *
2839
2871
  * Licensed under the Apache License, Version 2.0 (the "License");
2840
2872
  * you may not use this file except in compliance with the License.
@@ -2897,4 +2929,4 @@ var getWarningMessage = function getWarningMessage(error) {
2897
2929
  return '';
2898
2930
  };
2899
2931
 
2900
- export { AlertBanner, AlertIcon, AppHeader, AppLayout, Avatar, ConfirmationDialog, ConfirmationServiceProvider, CustomSlider, CustomToggleButton, DEFAULT_ERROR_MESSAGE, DraggableComponent$1 as Draggable, EnableButton, ErrorBoundary, HIDDEN_INPUT_HELPER_IS_DRAFT, ManagerButton, ManagerDeleteButton, ResizeComponent as Resizable, StatusTag, ToggleMenu, ToolButton, ToolContainer, DraggableComponent as ToolContainerDraggable, ToolFooter, ToolHeader, TooltipSelect, UserMenu, UserMenuItemCheatSheet, MenuItemTheme as UserMenuItemTheme, calculateDialogSizeAndPosition, getAxiosErrorMessage, getAxiosWarningMessage, getErrorMessage, getInitials, getPosition, getWarningMessage, isAxiosError, showPrompt, sliderHeaderStyle, tooltipContainerStyles, useConfirmationDialog, useDialogActions, useDraftFormHelpers, useIsMounted, usePoller, usePreventBrowserClose, usePrevious, useUserMenu };
2932
+ export { AlertBanner, AlertIcon, AppHeader, AppLayout, Avatar, ConfirmationDialog, ConfirmationServiceProvider, CustomSlider, CustomToggleButton, DEFAULT_ERROR_MESSAGE, DraggableComponent$1 as Draggable, EnableButton, ErrorBoundary, HIDDEN_INPUT_HELPER_IS_DRAFT, ManagerButton, ManagerDeleteButton, ResizeComponent as Resizable, StatusTag, ToggleMenu, ToolButton, ToolContainer, DraggableComponent as ToolContainerDraggable, ToolFooter, ToolHeader, TooltipSelect, UserMenu, UserMenuItemCheatSheet, MenuItemTheme as UserMenuItemTheme, calculateDialogSizeAndPosition, getAxiosErrorMessage, getAxiosWarningMessage, getErrorMessage, getInitials, getPosition, getWarningMessage, isAxiosError, showPrompt, sliderHeaderStyle, tooltipContainerStyles, useConfirmationDialog, useDialogActions, useDraftFormHelpers, useIsMounted, useMakeSureContainerStaysInsideWindow, usePoller, usePreventBrowserClose, usePrevious, useUserMenu, withEggs };
package/index.umd.js CHANGED
@@ -1,8 +1,8 @@
1
1
  (function (global, factory) {
2
- 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('react-draggable'), require('re-resizable'), require('lodash')) :
3
- typeof define === 'function' && define.amd ? define(['exports', 'react', '@mui/material', '@opengeoweb/theme', 'react-hook-form', '@opengeoweb/form-fields', 'react-draggable', 're-resizable', 'lodash'], factory) :
4
- (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.Shared = {}, global.React, global.material, global.theme, global.reactHookForm, global.formFields, global.Draggable, global.reResizable, global.lodash));
5
- })(this, (function (exports, React, material, theme, reactHookForm, formFields, Draggable, reResizable, lodash) { 'use strict';
2
+ 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')) :
3
+ 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) :
4
+ (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));
5
+ })(this, (function (exports, React, material, theme, reactHookForm, formFields, lodash, Draggable, reResizable, reactRedux) { 'use strict';
6
6
 
7
7
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
8
8
 
@@ -110,47 +110,52 @@
110
110
  }
111
111
 
112
112
  var bgColors = {
113
- green: '#fcffeb',
114
- grey: '#f8f9f9',
115
- purple: '#f8f9f9',
116
- red: '#f9e8ea',
117
- yellow: '#fff8eb'
113
+ green: 'geowebColors.functional.successOutline.fill',
114
+ grey: 'geowebColors.functional.disabledOutline.fill',
115
+ purple: 'geowebColors.functional.summaryOutline.fill',
116
+ red: 'geowebColors.functional.errorOutline.fill',
117
+ yellow: 'geowebColors.functional.warningOutline.fill',
118
+ blue: 'geowebColors.functional.notificationOutline.fill'
118
119
  };
119
120
  var borderColors = {
120
- green: '#72bb23',
121
- grey: '#9b9fb0',
122
- purple: '#9d9df2',
123
- red: '#f24a00',
124
- yellow: '#ffa800'
121
+ green: 'geowebColors.functional.successOutline.borderColor',
122
+ grey: 'geowebColors.functional.disabledOutline.borderColor',
123
+ purple: 'geowebColors.functional.summaryOutline.borderColor',
124
+ red: 'geowebColors.functional.errorOutline.borderColor',
125
+ yellow: 'geowebColors.functional.warningOutline.borderColor',
126
+ blue: 'geowebColors.functional.notificationOutline.borderColor'
125
127
  };
126
128
 
127
129
  var tagStyle = function tagStyle(color) {
128
130
  // Set color to grey for summary
129
- var bgcolor = bgColors[color];
131
+ var backgroundColor = bgColors[color];
130
132
  var borderColor = borderColors[color];
131
133
  return {
132
- backgroundColor: bgcolor,
134
+ backgroundColor: backgroundColor,
133
135
  m: 0,
134
- p: 0.5,
135
- border: "2px solid " + borderColor,
136
+ p: 0,
137
+ border: '1px solid',
138
+ borderColor: borderColor,
136
139
  borderRadius: '4px',
137
- width: '85px',
138
- height: '20px',
139
- color: '#051039',
140
- maxHeight: '1em',
141
- boxSizing: 'content-box'
140
+ width: '120px',
141
+ height: '18px',
142
+ lineHeight: '16px',
143
+ color: 'geowebColors.captions.captionStatus.rgba'
142
144
  };
143
145
  };
144
146
 
145
147
  var StatusTag = function StatusTag(_a) {
146
148
  var content = _a.content,
147
- color = _a.color;
149
+ color = _a.color,
150
+ props = __rest(_a, ["content", "color"]);
151
+
148
152
  return /*#__PURE__*/React__namespace.createElement(material.Box, {
149
153
  display: "flex",
150
154
  alignItems: "center",
151
155
  justifyContent: "center",
152
- sx: __assign({}, tagStyle(color)),
153
- "data-testid": "statusTag"
156
+ "data-testid": "statusTag",
157
+ className: "statusTag",
158
+ sx: __assign(__assign({}, tagStyle(color)), props.sx)
154
159
  }, /*#__PURE__*/React__namespace.createElement(material.Typography, {
155
160
  variant: "caption"
156
161
  }, content));
@@ -478,6 +483,49 @@
478
483
  };
479
484
  };
480
485
 
486
+ var useMakeSureContainerStaysInsideWindow = function useMakeSureContainerStaysInsideWindow(nodeRef, position, setPosition) {
487
+ var onResizeWindow = React__default["default"].useCallback(function (event) {
488
+ if (!nodeRef.current) return;
489
+ var bbox = nodeRef.current.firstChild.getBoundingClientRect();
490
+ var windowTarget = event.currentTarget;
491
+ if (!windowTarget) return;
492
+ var innerHeight = windowTarget.innerHeight,
493
+ innerWidth = windowTarget.innerWidth;
494
+ var isHorizontallyLarger = bbox.width > innerWidth;
495
+ var isVerticallyLarger = bbox.height > innerHeight; // left screen
496
+
497
+ if (bbox.x < 0 || isHorizontallyLarger) {
498
+ setPosition(__assign(__assign({}, position), {
499
+ x: position.x - bbox.x
500
+ }));
501
+ } // right screen
502
+ else if (bbox.x + bbox.width >= innerWidth) {
503
+ var diffX = innerWidth - bbox.x - bbox.width;
504
+ setPosition(__assign(__assign({}, position), {
505
+ x: position.x + diffX
506
+ }));
507
+ } // top screen
508
+ else if (bbox.y < 0 || isVerticallyLarger) {
509
+ setPosition(__assign(__assign({}, position), {
510
+ y: position.y - bbox.y
511
+ }));
512
+ } // bottom screen
513
+ else if (bbox.y + bbox.height >= innerHeight) {
514
+ var diffY = innerHeight - bbox.y - bbox.height;
515
+ setPosition(__assign(__assign({}, position), {
516
+ y: position.y + diffY
517
+ }));
518
+ }
519
+ }, [nodeRef, position, setPosition]);
520
+ React__default["default"].useEffect(function () {
521
+ var throttledResize = lodash.throttle(onResizeWindow, 100);
522
+ window.addEventListener('resize', throttledResize);
523
+ return function () {
524
+ window.removeEventListener('resize', throttledResize);
525
+ };
526
+ }, [onResizeWindow]);
527
+ };
528
+
481
529
  var ConfirmationServiceContext = /*#__PURE__*/React__namespace.createContext(Promise.reject);
482
530
  var useConfirmationDialog = function useConfirmationDialog() {
483
531
  return React__namespace.useContext(ConfirmationServiceContext);
@@ -1544,46 +1592,7 @@
1544
1592
  height: height
1545
1593
  });
1546
1594
  }, [onChangeSize]);
1547
- var onResizeWindow = React__default["default"].useCallback(function (event) {
1548
- if (!nodeRef.current) return;
1549
- var bbox = nodeRef.current.firstChild.getBoundingClientRect();
1550
- var windowTarget = event.currentTarget;
1551
- if (!windowTarget) return;
1552
- var innerHeight = windowTarget.innerHeight,
1553
- innerWidth = windowTarget.innerWidth;
1554
- var isHorizontallyLarger = bbox.width > innerWidth;
1555
- var isVerticallyLarger = bbox.height > innerHeight; // left screen
1556
-
1557
- if (bbox.x < 0 || isHorizontallyLarger) {
1558
- setPosition(__assign(__assign({}, position), {
1559
- x: position.x - bbox.x
1560
- }));
1561
- } // right screen
1562
- else if (bbox.x + bbox.width >= innerWidth) {
1563
- var diffX = innerWidth - bbox.x - bbox.width;
1564
- setPosition(__assign(__assign({}, position), {
1565
- x: position.x + diffX
1566
- }));
1567
- } // top screen
1568
- else if (bbox.y < 0 || isVerticallyLarger) {
1569
- setPosition(__assign(__assign({}, position), {
1570
- y: position.y - bbox.y
1571
- }));
1572
- } // bottom screen
1573
- else if (bbox.y + bbox.height >= innerHeight) {
1574
- var diffY = innerHeight - bbox.y - bbox.height;
1575
- setPosition(__assign(__assign({}, position), {
1576
- y: position.y + diffY
1577
- }));
1578
- }
1579
- }, [position]);
1580
- React__default["default"].useEffect(function () {
1581
- var throttledResize = lodash.throttle(onResizeWindow, 100);
1582
- window.addEventListener('resize', throttledResize);
1583
- return function () {
1584
- window.removeEventListener('resize', throttledResize);
1585
- };
1586
- }, [onResizeWindow]);
1595
+ useMakeSureContainerStaysInsideWindow(nodeRef, position, setPosition);
1587
1596
  var toolcontainerId = React__default["default"].useRef(Date.now().toString()).current;
1588
1597
  var headerClassName = "header-" + toolcontainerId;
1589
1598
  return isOpen ? /*#__PURE__*/React__default["default"].createElement(DraggableComponent$1, {
@@ -2715,6 +2724,27 @@
2715
2724
  }, otherProps)));
2716
2725
  };
2717
2726
 
2727
+ function withEggs(eggs) {
2728
+ return function (Component) {
2729
+ var WithEggs = function WithEggs(props) {
2730
+ var store = reactRedux.useStore();
2731
+
2732
+ var _a = __read(React__namespace.useState(function () {
2733
+ return store.addEggs(eggs);
2734
+ }), 1),
2735
+ remover = _a[0];
2736
+
2737
+ React__namespace.useEffect(function () {
2738
+ return remover;
2739
+ }, [remover]);
2740
+ return /*#__PURE__*/React__namespace.createElement(Component, __assign({}, props));
2741
+ };
2742
+
2743
+ WithEggs.displayName = "withEggs(" + (Component.displayName || Component.name || 'Component') + ")";
2744
+ return WithEggs;
2745
+ };
2746
+ }
2747
+
2718
2748
  /* *
2719
2749
  * Licensed under the Apache License, Version 2.0 (the "License");
2720
2750
  * you may not use this file except in compliance with the License.
@@ -2820,10 +2850,12 @@
2820
2850
  exports.useDialogActions = useDialogActions;
2821
2851
  exports.useDraftFormHelpers = useDraftFormHelpers;
2822
2852
  exports.useIsMounted = useIsMounted;
2853
+ exports.useMakeSureContainerStaysInsideWindow = useMakeSureContainerStaysInsideWindow;
2823
2854
  exports.usePoller = usePoller;
2824
2855
  exports.usePreventBrowserClose = usePreventBrowserClose;
2825
2856
  exports.usePrevious = usePrevious;
2826
2857
  exports.useUserMenu = useUserMenu;
2858
+ exports.withEggs = withEggs;
2827
2859
 
2828
2860
  Object.defineProperty(exports, '__esModule', { value: true });
2829
2861
 
@@ -5,25 +5,21 @@ declare const _default: {
5
5
  export default _default;
6
6
  export declare const AvatarLight: {
7
7
  (): React.ReactElement;
8
- story: {
9
- name: string;
10
- parameters: {
11
- zeplinLink: {
12
- name: string;
13
- link: string;
14
- }[];
15
- };
8
+ storyName: string;
9
+ parameters: {
10
+ zeplinLink: {
11
+ name: string;
12
+ link: string;
13
+ }[];
16
14
  };
17
15
  };
18
16
  export declare const AvatarDark: {
19
17
  (): React.ReactElement;
20
- story: {
21
- name: string;
22
- parameters: {
23
- zeplinLink: {
24
- name: string;
25
- link: string;
26
- }[];
27
- };
18
+ storyName: string;
19
+ parameters: {
20
+ zeplinLink: {
21
+ name: string;
22
+ link: string;
23
+ }[];
28
24
  };
29
25
  };
@@ -3,6 +3,6 @@ import { ToggleButtonProps } from '@mui/material';
3
3
  import { ButtonVariant } from '@opengeoweb/theme';
4
4
  export interface CustomToggleButtonProps extends Omit<ToggleButtonProps, 'value'> {
5
5
  variant?: ButtonVariant;
6
- value?: unknown;
6
+ value?: any;
7
7
  }
8
8
  export declare const CustomToggleButton: React.FC<CustomToggleButtonProps>;
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
- declare type Position = {
2
+ export declare type DraggablePosition = {
3
3
  x: number;
4
4
  y: number;
5
5
  };
@@ -7,8 +7,8 @@ interface DraggableComponentProps {
7
7
  nodeRef?: React.RefObject<HTMLElement>;
8
8
  children?: React.ReactNode;
9
9
  bounds?: 'parent' | string;
10
- position?: Position;
11
- onStop?: (event: React.MouseEvent<HTMLElement>, pos: Position) => void;
10
+ position?: DraggablePosition;
11
+ onStop?: (event: React.MouseEvent<HTMLElement>, pos: DraggablePosition) => void;
12
12
  onMouseDown?: (event: MouseEvent) => void;
13
13
  handle?: string;
14
14
  }
@@ -1,5 +1,6 @@
1
1
  import * as React from 'react';
2
- interface StatusTagProps {
2
+ import { BoxProps } from '@mui/material';
3
+ interface StatusTagProps extends BoxProps {
3
4
  content: string;
4
5
  color: string;
5
6
  }
@@ -3,7 +3,27 @@ declare const _default: {
3
3
  title: string;
4
4
  };
5
5
  export default _default;
6
- export declare const StatusTags: {
6
+ export declare const StatusTagsGWTheme: {
7
7
  (): React.ReactElement;
8
8
  storyName: string;
9
9
  };
10
+ export declare const StatusTagsLight: {
11
+ (): React.ReactElement;
12
+ storyName: string;
13
+ parameters: {
14
+ zeplinLink: {
15
+ name: string;
16
+ link: string;
17
+ }[];
18
+ };
19
+ };
20
+ export declare const StatusTagsDark: {
21
+ (): React.ReactElement;
22
+ storyName: string;
23
+ parameters: {
24
+ zeplinLink: {
25
+ name: string;
26
+ link: string;
27
+ }[];
28
+ };
29
+ };
@@ -7,5 +7,6 @@ export interface ToolButtonProps extends CustomToggleButtonProps {
7
7
  height?: string;
8
8
  value?: unknown;
9
9
  sx?: SxProps<Theme>;
10
+ children?: React.ReactNode;
10
11
  }
11
12
  export declare const ToolButton: React.FC<ToolButtonProps>;
@@ -0,0 +1,3 @@
1
+ import * as React from 'react';
2
+ import { Egg } from '@redux-eggs/core';
3
+ export declare function withEggs(eggs: Egg[]): (Component: React.FC) => React.FC;
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1 @@
1
+ export { withEggs } from './WithEggs';
@@ -17,3 +17,4 @@ export * from './EnableButton';
17
17
  export * from './AlertIcon';
18
18
  export * from './TooltipSelect';
19
19
  export * from './Avatar';
20
+ export * from './WithEggs';
@@ -3,3 +3,4 @@ export * from './usePoller/usePoller';
3
3
  export * from './usePrevious/usePrevious';
4
4
  export * from './useIsMounted/useIsMounted';
5
5
  export * from './useDraftFormHelpers/useDraftFormHelpers';
6
+ export * from './useMakeSureContainerStaysInsideWindow/useMakeSureContainerStaysInsideWindow';
@@ -0,0 +1,3 @@
1
+ import React from 'react';
2
+ import { DraggablePosition } from '../../components/DraggableResizable/Draggable';
3
+ export declare const useMakeSureContainerStaysInsideWindow: (nodeRef: React.RefObject<HTMLDivElement>, position: DraggablePosition, setPosition: (position: DraggablePosition) => void) => void;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@opengeoweb/shared",
3
- "version": "4.2.0",
3
+ "version": "4.4.0",
4
4
  "description": "GeoWeb shared library with shared components and utils for the opengeoweb project",
5
5
  "license": "Apache-2.0",
6
6
  "repository": {
@@ -13,16 +13,18 @@
13
13
  "dependencies": {},
14
14
  "peerDependencies": {
15
15
  "react": "^17.0.2",
16
- "@mui/material": "^5.2.8",
17
- "@opengeoweb/theme": "4.2.0",
18
- "react-draggable": "^4.4.3",
16
+ "@mui/material": "^5.10.8",
17
+ "@opengeoweb/theme": "4.4.0",
18
+ "react-draggable": "^4.4.5",
19
19
  "re-resizable": "^6.9.0",
20
- "lodash": "^4.17.20",
21
- "@opengeoweb/form-fields": "4.2.0",
20
+ "@redux-eggs/core": "^2.2.0",
21
+ "react-redux": "^8.0.4",
22
+ "@opengeoweb/form-fields": "4.4.0",
22
23
  "react-hook-form": "^6.12.1",
23
24
  "moment": "^2.29.0",
24
25
  "moment-timezone": "^0.5.31",
25
- "@mui/lab": "^5.0.0-alpha.64",
26
+ "@mui/x-date-pickers": "^5.0.4",
27
+ "lodash": "^4.17.20",
26
28
  "axios": "^0.25.0"
27
29
  }
28
30
  }