@opengeoweb/theme 4.4.0 → 4.6.0

package/index.d.ts

@@ -2,3 +2,4 @@ import * as Icons from './lib/components/Icons';
 export { Icons };
 export * from './lib/components/Theme';
 export * from './lib/components/Icons';
+export * from './lib/components/Paths';

package/index.esm.js

@@ -28,6 +28,24 @@ function __rest(s, e) {
     return t;
 }
 
+/* *
+ * 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 dragHandlePath = 'M9.5 8a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3zm5 0a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3zm-5 5.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3zm5 0a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3zm-5 5.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3zm5 0a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3z';
+
 /* *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
@@ -285,6 +303,14 @@ var Clock = function Clock(props) {
     d: "M8.485 3.717a9 9 0 1 1 7.033 16.569 9 9 0 0 1-7.033-16.57zm.74 1.744a7.105 7.105 0 1 0 5.552 13.08 7.105 7.105 0 0 0-5.552-13.08zm1.825 1.522h1.894v4.734l3.049 1.76-.947 1.641-2.606-1.504h-1.39V6.983z"
   }));
 };
+var Animation = function Animation(props) {
+  return /*#__PURE__*/React.createElement(SvgIcon, Object.assign({}, props), /*#__PURE__*/React.createElement("g", {
+    transform: "translate(3.000000, 4.000000)"
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M18,0 L18,16 L0,16 L0,0 L18,0 Z M2.7,13.4444444 L0.9,13.4444444 L0.9,15 L2.7,15 L2.7,13.4444444 Z M17.1,13.4444444 L15.3,13.4444444 L15.3,15 L17.1,15 L17.1,13.4444444 Z M6.7430548,3 C6.36845508,3 5.96666667,3.31868791 5.96666667,4.01673445 L5.96666667,11.9839323 C5.96666667,12.6819788 6.36905927,13 6.7430548,13 C6.94123014,13 7.14423902,12.9206614 7.34362274,12.7633176 L12.1668963,8.93772918 C12.4641593,8.70304687 12.6333333,8.36169078 12.6333333,7.99966664 C12.6333333,7.63897593 12.4635551,7.29828655 12.1675005,7.06293753 L7.34181016,3.23734916 C7.14423902,3.07933862 6.94123014,3 6.7430548,3 Z M2.7,10.3333333 L0.9,10.3333333 L0.9,11.8888889 L2.7,11.8888889 L2.7,10.3333333 Z M17.1,10.3333333 L15.3,10.3333333 L15.3,11.8888889 L17.1,11.8888889 L17.1,10.3333333 Z M2.7,7.22222222 L0.9,7.22222222 L0.9,8.77777778 L2.7,8.77777778 L2.7,7.22222222 Z M17.1,7.22222222 L15.3,7.22222222 L15.3,8.77777778 L17.1,8.77777778 L17.1,7.22222222 Z M2.7,4.11111111 L0.9,4.11111111 L0.9,5.66666667 L2.7,5.66666667 L2.7,4.11111111 Z M17.1,4.11111111 L15.3,4.11111111 L15.3,5.66666667 L17.1,5.66666667 L17.1,4.11111111 Z M2.7,1 L0.9,1 L0.9,2.55555556 L2.7,2.55555556 L2.7,1 Z M17.1,1 L15.3,1 L15.3,2.55555556 L17.1,2.55555556 L17.1,1 Z",
+    id: "AnimationSvgPath"
+  })));
+};
 var Success = function Success(props) {
   return /*#__PURE__*/React.createElement(SvgIcon, Object.assign({}, props), /*#__PURE__*/React.createElement("path", {
     d: "m16.51 10.034-5.633 5.633-3.387-3.386a.954.954 0 0 1 0-1.343.975.975 0 0 1 1.342 0l2.045 2.046 4.292-4.291a.972.972 0 0 1 1.342 0c.368.369.368.97 0 1.341M12 4a8 8 0 1 0 0 16.001A8 8 0 0 0 12 4"
@@ -297,7 +323,7 @@ var Cancel = function Cancel(props) {
 };
 var DragHandle = function DragHandle(props) {
   return /*#__PURE__*/React.createElement(SvgIcon, Object.assign({}, props), /*#__PURE__*/React.createElement("path", {
-    d: "M9.5 8a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3zm5 0a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3zm-5 5.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3zm5 0a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3zm-5 5.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3zm5 0a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3z"
+    d: dragHandlePath
   }));
 };
 var AutoUpdateActive = function AutoUpdateActive(props) {
@@ -443,18 +469,14 @@ var Search = function Search(props) {
     d: "M7.81701445,12.5845372 L7.81701445,12.5845372 C7.17924024,11.946763 6.82932049,11.100321 6.82932049,10.1993044 C6.82932049,9.29828785 7.17924024,8.45077582 7.81701445,7.8140717 C8.47405029,7.15703585 9.3376137,6.82851792 10.2022472,6.82851792 C11.0658106,6.82851792 11.929374,7.15703585 12.5874799,7.8140717 C13.9026217,9.12921348 13.9026217,11.2693954 12.5874799,12.5845372 C11.9497057,13.2212413 11.1021937,13.5722311 10.2022472,13.5722311 C9.3012306,13.5722311 8.45371857,13.2212413 7.81701445,12.5845372 M19.5858748,17.581862 L15.4681648,13.465222 C16.9513109,11.0735688 16.6613162,7.88683788 14.5874799,5.81300161 C12.1690744,3.39566613 8.23434992,3.39566613 5.81594436,5.81300161 C4.64419476,6.9847512 4,8.54280364 4,10.1993044 C4,11.8558052 4.64419476,13.4138577 5.81594436,14.5845372 C6.98769395,15.7562868 8.5446763,16.4015516 10.2022472,16.4015516 C11.376137,16.4015516 12.4965222,16.0719636 13.4681648,15.4662921 L17.5837346,19.582932 C17.8608882,19.8590155 18.2225789,19.9970572 18.5853398,19.9970572 C18.9470305,19.9970572 19.3087212,19.8590155 19.5858748,19.582932 C20.1380417,19.029695 20.1380417,18.135099 19.5858748,17.581862"
   }));
 };
-var Flag = function Flag(props) {
-  return /*#__PURE__*/React.createElement(SvgIcon, Object.assign({}, props), /*#__PURE__*/React.createElement("path", {
-    d: "M7.257 7.703c1.295-1.416 2.854-2.124 4.679-2.124 1.97 0 1.676 1.718 3.821 1.61 1.43-.073 2.847-.803 4.25-2.189v10c-1.554 1.47-2.971 2.213-4.25 2.228-1.918.023-1.632-1.61-3.821-1.61-1.46 0-3.02.795-4.679 2.382V7.703zM5.507 4a1.501 1.501 0 0 1 .75 2.803V20h-1.5L4.756 6.803A1.502 1.502 0 0 1 5.507 4z"
-  }));
-};
 var Resize = function Resize(_a) {
   var _a$isRightAligned = _a.isRightAligned,
       isRightAligned = _a$isRightAligned === void 0 ? false : _a$isRightAligned,
-      props = __rest(_a, ["isRightAligned"]);
+      sx = _a.sx,
+      props = __rest(_a, ["isRightAligned", "sx"]);
 
   return /*#__PURE__*/React.createElement(SvgIcon, Object.assign({
-    sx: Object.assign(Object.assign({
+    sx: Object.assign(Object.assign(Object.assign({
       width: 20,
       height: 20,
       top: -10,
@@ -466,7 +488,7 @@ var Resize = function Resize(_a) {
       left: -10
     }), {
       zIndex: 1
-    }),
+    }), sx),
     "data-testid": "resizeHandle"
   }, props), /*#__PURE__*/React.createElement("path", {
     d: "M19.687 18.037v1h-6v-1h6zm3.5-3.5v1h-13v-1h13z",
@@ -594,6 +616,69 @@ var Picture = function Picture(props) {
     transform: "translate(1 2)"
   }));
 };
+var CollapseWindow = function CollapseWindow(props) {
+  return /*#__PURE__*/React.createElement(SvgIcon, Object.assign({}, props), /*#__PURE__*/React.createElement("path", {
+    d: "M5,17 C4.43301962,17 4,17.4597824 4,18.0268006 C4,18.5938188 4.43301962,19 5,19 L19,19 C19.5669804,19 20,18.5938188 20,18.0268006 C20,17.4597824 19.5669804,17 19,17 L5,17 Z"
+  }));
+};
+var ExpandWindow = function ExpandWindow(props) {
+  return /*#__PURE__*/React.createElement(SvgIcon, Object.assign({}, props), /*#__PURE__*/React.createElement("path", {
+    d: "M18,4.5 C18.81657,4.52323671 19.4399034,4.74990338 19.87,5.18 C20.3000966,5.61009662 20.5100966,6.21676329 20.5,7 L20.5,17 C20.4955176,17.7444824 20.2855176,18.3244824 19.87,18.74 C19.4544824,19.1555176 18.8311491,19.4088509 18,19.5 L6,19.5 C5.1805214,19.4148333 4.56096049,19.1624284 4.1413173,18.7427852 C3.7216741,18.323142 3.50790167,17.7422136 3.5,17 L3.5,7 C3.52565636,6.18855517 3.73942879,5.5818885 4.1413173,5.18 C4.5432058,4.7781115 5.1627667,4.55144483 6,4.5 L18,4.5 Z M17.6875,6.75 L6.3125,6.75 C5.85182844,6.75 5.5,7.20978239 5.5,7.77680061 C5.5,8.34381884 5.85182844,8.75 6.3125,8.75 L17.6875,8.75 C18.1481716,8.75 18.5,8.34381884 18.5,7.77680061 C18.5,7.20978239 18.1481716,6.75 17.6875,6.75 Z"
+  }));
+};
+var CollapseLarge = function CollapseLarge(props) {
+  return /*#__PURE__*/React.createElement(SvgIcon, Object.assign({}, props), /*#__PURE__*/React.createElement("g", {
+    id: "Icons-/-Collapse-L",
+    stroke: "none",
+    strokeWidth: "1",
+    fill: "none",
+    fillRule: "evenodd"
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M18.0000715,4.5 C18.8166416,4.52323671 19.4399749,4.74990338 19.8700715,5.18 C20.3001681,5.61009662 20.5101681,6.21676329 20.5000715,7 L20.5000715,17 C20.4955891,17.7444824 20.2855891,18.3244824 19.8700715,18.74 C19.4545539,19.1555176 18.8312206,19.4088509 18.0000715,19.5 L6.00007152,19.5 C5.18059291,19.4148333 4.56103201,19.1624284 4.14138882,18.7427852 C3.72174562,18.323142 3.50797319,17.7422136 3.50007152,17 L3.50007152,7 C3.52572788,6.18855517 3.73950031,5.5818885 4.14138882,5.18 C4.54327732,4.7781115 5.16283822,4.55144483 6.00007152,4.5 L18.0000715,4.5 Z M17.5015692,6.5 L6.49857385,6.5 C5.94711624,6.5 5.50007152,6.94483697 5.50007152,7.4955775 L5.50007152,16.5044225 C5.50007152,17.0542648 5.94756094,17.5 6.49857385,17.5 L17.5015692,17.5 C18.0530268,17.5 18.5000715,17.055163 18.5000715,16.5044225 L18.5000715,7.4955775 C18.5000715,6.94573523 18.0525821,6.5 17.5015692,6.5 Z M11.51,8.14 L11.51,13.93 L14.4857761,13.93 L14.4857761,15.2471595 L9.79,15.2471595 L9.79,8.14 L11.51,8.14 Z",
+    id: "Icons-/-expand-L",
+    fill: "currentColor"
+  })));
+};
+var CollapseMedium = function CollapseMedium(props) {
+  return /*#__PURE__*/React.createElement(SvgIcon, Object.assign({}, props), /*#__PURE__*/React.createElement("g", {
+    id: "Icons-/-Collapse-M",
+    stroke: "none",
+    strokeWidth: "1",
+    fill: "none",
+    fillRule: "evenodd"
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M18.0000715,4.5 C18.8166416,4.52323671 19.4399749,4.74990338 19.8700715,5.18 C20.3001681,5.61009662 20.5101681,6.21676329 20.5000715,7 L20.5000715,17 C20.4955891,17.7444824 20.2855891,18.3244824 19.8700715,18.74 C19.4545539,19.1555176 18.8312206,19.4088509 18.0000715,19.5 L6.00007152,19.5 C5.18059291,19.4148333 4.56103201,19.1624284 4.14138882,18.7427852 C3.72174562,18.323142 3.50797319,17.7422136 3.50007152,17 L3.50007152,7 C3.52572788,6.18855517 3.73950031,5.5818885 4.14138882,5.18 C4.54327732,4.7781115 5.16283822,4.55144483 6.00007152,4.5 L18.0000715,4.5 Z M17.5015692,6.5 L6.49857385,6.5 C5.94711624,6.5 5.50007152,6.94483697 5.50007152,7.4955775 L5.50007152,16.5044225 C5.50007152,17.0542648 5.94756094,17.5 6.49857385,17.5 L17.5015692,17.5 C18.0530268,17.5 18.5000715,17.055163 18.5000715,16.5044225 L18.5000715,7.4955775 C18.5000715,6.94573523 18.0525821,6.5 17.5015692,6.5 Z M10.3720217,8.13793154 L11.9560108,13.0709727 L13.54,8.13793154 L15.79,8.13793154 L15.79,15.25 L14.0828502,15.25 L14.0828502,13.5960917 L14.24,10.1828615 L12.52,15.25 L11.3929679,15.25 L9.66668436,10.1828615 L9.83,13.5960917 L9.83,15.25 L8.12,15.25 L8.12,8.13793154 L10.3720217,8.13793154 Z",
+    id: "Icons-/-expand-M",
+    fill: "currentColor"
+  })));
+};
+var CollapseSmall = function CollapseSmall(props) {
+  return /*#__PURE__*/React.createElement(SvgIcon, Object.assign({}, props), /*#__PURE__*/React.createElement("g", {
+    id: "Icons-/-Collapse-S",
+    stroke: "none",
+    strokeWidth: "1",
+    fill: "none",
+    fillRule: "evenodd"
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M18.0000715,4.5 C18.8166416,4.52323671 19.4399749,4.74990338 19.8700715,5.18 C20.3001681,5.61009662 20.5101681,6.21676329 20.5000715,7 L20.5000715,17 C20.4955891,17.7444824 20.2855891,18.3244824 19.8700715,18.74 C19.4545539,19.1555176 18.8312206,19.4088509 18.0000715,19.5 L6.00007152,19.5 C5.18059291,19.4148333 4.56103201,19.1624284 4.14138882,18.7427852 C3.72174562,18.323142 3.50797319,17.7422136 3.50007152,17 L3.50007152,7 C3.52572788,6.18855517 3.73950031,5.5818885 4.14138882,5.18 C4.54327732,4.7781115 5.16283822,4.55144483 6.00007152,4.5 L18.0000715,4.5 Z M17.5015692,6.5 L6.49857385,6.5 C5.94711624,6.5 5.50007152,6.94483697 5.50007152,7.4955775 L5.50007152,16.5044225 C5.50007152,17.0542648 5.94756094,17.5 6.49857385,17.5 L17.5015692,17.5 C18.0530268,17.5 18.5000715,17.055163 18.5000715,16.5044225 L18.5000715,7.4955775 C18.5000715,6.94573523 18.0525821,6.5 17.5015692,6.5 Z M12,8.04223293 C12.3816424,8.04223293 12.7614621,8.07548514 13.1091818,8.18 C13.5650277,8.31701461 13.9657061,8.56252016 14.2430015,8.87556815 C14.5528447,9.22536046 14.7487564,9.63866568 14.7487564,10.2519529 L13.0420578,10.2519529 C13.0420578,10.1288369 13.0272095,9.87711169 12.8626035,9.66926494 C12.7706891,9.55320533 12.6320802,9.43866588 12.4232884,9.38 C12.3058648,9.34700656 12.1662431,9.34 12.0002452,9.34 C11.7669952,9.34 11.5569756,9.40134185 11.3953298,9.49974489 C11.191832,9.62362564 11.065,9.80624313 11.065,9.99915266 C11.065,10.4659624 11.5303207,10.7054039 12.0069825,10.88 C12.251836,10.9696872 12.4996821,11.0509766 12.6889856,11.1190164 C13.2468104,11.3195109 14.7487564,11.8079437 14.7487564,13.3345338 C14.7487564,14.1523847 14.3639594,14.7065019 13.71,15.0235466 C13.2549114,15.2441772 12.7956716,15.35 12,15.35 C11.5837341,15.35 11.0482218,15.2531638 10.57,15.0437157 C10.1291519,14.8506364 9.73916298,14.5618589 9.48671724,14.1650248 C9.25557241,13.8016749 9.14333333,13.3931427 9.15,12.939428 L10.8662463,12.939428 C10.8586095,13.2482201 10.923194,13.4935781 11.06,13.6755022 C11.265209,13.9483883 11.6785712,14.059404 12.0002452,14.059404 C12.416347,14.059404 13.0420578,13.9897611 13.0420578,13.3345338 C13.0420578,13.0169697 12.9081037,12.8095581 12.4695878,12.5923469 C12.3796921,12.5478187 12.2231629,12.4829201 12,12.3976512 C11.2094155,12.128282 10.6637991,11.8940163 10.3631508,11.6948541 C10.1074343,11.5254567 9.88191516,11.3372466 9.73293087,11.1353958 C9.51970344,10.8465054 9.36,10.5472019 9.36,9.99915266 C9.36,9.53454971 9.57462649,9.02233509 10.0735216,8.63036466 C10.4735262,8.31609021 11.2198472,8.04223293 12,8.04223293 Z",
+    id: "Icons-/-expand-S",
+    fill: "currentColor"
+  })));
+};
+var None = function None(props) {
+  return /*#__PURE__*/React.createElement(SvgIcon, Object.assign({}, props), /*#__PURE__*/React.createElement("g", {
+    transform: "translate(3 3)"
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M16.0000589,0 C17.1046284,-2.02906125e-16 18.0000589,0.8954305 18.0000589,2 L18.0010775,6.26818814 C17.7066608,6.0976323 17.364732,6 17,6 L16.285,6 L16.2857676,2.71429132 C16.2857676,2.16200657 15.8380523,1.71429132 15.2857676,1.71429132 L2.71429132,1.71429132 C2.16200657,1.71429132 1.71429132,2.16200657 1.71429132,2.71429132 L1.71429132,15.2857676 C1.71429132,15.8380523 2.16200657,16.2857676 2.71429132,16.2857676 L6,16.285 L6,17 C6,17.364732 6.0976323,17.7066608 6.26818814,18.0010775 L2,18.0000589 C0.8954305,18.0000589 1.3527075e-16,17.1046284 0,16.0000589 L0,2 C-1.3527075e-16,0.8954305 0.8954305,2.02906125e-16 2,0 L16.0000589,0 Z M16.0000589,7.71431095 C17.1046284,7.71431095 18.0000589,8.60974145 18.0000589,9.71431095 L18.0000589,16.0000589 C18.0000589,17.1046284 17.1046284,18.0000589 16.0000589,18.0000589 L9.71431095,18.0000589 C8.60974145,18.0000589 7.71431095,17.1046284 7.71431095,16.0000589 L7.71431095,9.71431095 C7.71431095,8.60974145 8.60974145,7.71431095 9.71431095,7.71431095 L16.0000589,7.71431095 Z M15.2857676,9.42860228 L10.4286023,9.42860228 C9.87631753,9.42860228 9.42860228,9.87631753 9.42860228,10.4286023 L9.42860228,15.2857676 C9.42860228,15.8380523 9.87631753,16.2857676 10.4286023,16.2857676 L15.2857676,16.2857676 C15.8380523,16.2857676 16.2857676,15.8380523 16.2857676,15.2857676 L16.2857676,10.4286023 C16.2857676,9.87631753 15.8380523,9.42860228 15.2857676,9.42860228 Z M14.5347673,10.2701019 L15.4312535,11.2107189 L13.8227128,12.8181019 L15.4312535,14.4261565 L14.5127019,15.344708 L12.9047128,13.7361019 L11.2972643,15.344708 L10.3787128,14.4261565 L11.9867128,12.8181019 L10.3787128,11.2107189 L11.2751989,10.2701019 L12.9047128,11.9001019 L14.5347673,10.2701019 Z"
+  })));
+};
+var Both = function Both(props) {
+  return /*#__PURE__*/React.createElement(SvgIcon, Object.assign({}, props), /*#__PURE__*/React.createElement("g", {
+    transform: "translate(3 3)"
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M6.12154852,-4.08562073e-14 L11.5665318,2.08618237 L7.16343758,5.90884652 L6.89046265,4.36072873 L6.80957756,4.39003855 C3.87189613,5.46406081 2.0365417,8.52135417 2.59891997,11.7107598 C2.74916282,12.5628294 3.05699221,13.3475078 3.48712515,14.0400746 L3.654,14.294 L4.03341039,13.916165 C4.300998,13.6487868 4.57483053,13.3752128 4.84929787,13.1010377 L5.49808471,12.4529989 L5.81818597,12.133305 L6.43943768,11.5129063 C6.54018288,11.4123056 6.63929935,11.3133343 6.73644152,11.2163368 L7.29283868,10.6607958 C7.46856431,10.4853491 7.63362837,10.3205548 7.78526647,10.1691699 L8.06982232,9.88509612 C8.15816112,9.79690915 8.23971374,9.71549875 8.3136611,9.64168177 L8.51186835,9.44382795 L8.55371431,9.40205768 L17.4815559,0.474640695 C18.0545559,-0.0983593047 18.9845559,-0.0983593047 19.5575559,0.474640695 C20.1305559,1.0476407 20.1305559,1.9776407 19.5575559,2.5506407 L14.831,7.276 L19.4288065,10.9204157 C19.784072,11.2028346 19.9878059,11.6116618 19.9878059,12.0444907 C19.9878059,12.4789196 19.784797,12.8885469 19.4280814,13.1701657 L13.6401532,17.7608718 C13.4008927,17.9496843 13.1572821,18.0448907 12.9194717,18.0448907 C12.470677,18.0448907 11.9878059,17.6632653 11.9878059,16.8256094 L11.987,10.12 L8.78355591,13.3246407 C8.78355591,13.3246407 8.77632036,13.3318973 8.76236846,13.3458891 L8.70088296,13.4075489 C8.68745028,13.4210194 8.67246832,13.4360433 8.65600198,13.4525555 L8.30579109,13.8037142 C8.12024363,13.9897508 7.88938874,14.2211951 7.62907158,14.482136 L7.3035632,14.8084053 C6.96594112,15.1467963 6.5950202,15.5184978 6.21818091,15.8960157 L5.46472391,16.6506601 C5.40263036,16.7128356 5.34087945,16.7746636 5.27959794,16.8360167 L3.83147258,18.2843629 L3.76884939,18.3468742 L3.40610402,18.7083747 C3.32314137,18.7908588 3.25923448,18.8541764 3.21780591,18.8948907 C2.63780591,19.4648907 1.70780591,19.4648907 1.13780591,18.8948907 C0.567805911,18.3248907 0.567805911,17.3948907 1.13780591,16.8148907 L1.30316348,16.6480048 L1.34269001,16.6082679 L1.58700213,16.3630806 C1.67091753,16.2789466 1.76427895,16.1854034 1.86593963,16.0835947 C1.00935344,14.9643562 0.401202684,13.6284705 0.139524125,12.1444177 C-0.668062091,7.56436865 2.10797283,3.18177303 6.45256841,1.87618962 L6.12154852,-4.08562073e-14 Z"
+  })));
+};
 
 /* *
  * Licensed under the Apache License, Version 2.0 (the "License");
@@ -642,6 +727,7 @@ var index = /*#__PURE__*/Object.freeze({
     GeoWebLogo: GeoWebLogo,
     Add: Add,
     Clock: Clock,
+    Animation: Animation,
     Success: Success,
     Cancel: Cancel,
     DragHandle: DragHandle,
@@ -666,7 +752,6 @@ var index = /*#__PURE__*/Object.freeze({
     Filter: Filter,
     Clear: Clear,
     Search: Search,
-    Flag: Flag,
     Resize: Resize,
     PresetWorkspace: PresetWorkspace,
     Preset: Preset,
@@ -688,7 +773,14 @@ var index = /*#__PURE__*/Object.freeze({
     DimensionsTime: DimensionsTime,
     DimensionsRefTime: DimensionsRefTime,
     DimensionsOther: DimensionsOther,
-    Picture: Picture
+    Picture: Picture,
+    CollapseWindow: CollapseWindow,
+    ExpandWindow: ExpandWindow,
+    CollapseLarge: CollapseLarge,
+    CollapseMedium: CollapseMedium,
+    CollapseSmall: CollapseSmall,
+    None: None,
+    Both: Both
 });
 
 function _defineProperty(obj, key, value) {
@@ -778,6 +870,13 @@ function _nonIterableRest() {
  * Copyright 2021 - Koninklijk Nederlands Meteorologisch Instituut (KNMI)
  * Copyright 2021 - Finnish Meteorological Institute (FMI)
  * */
+var ThemeTypes;
+
+(function (ThemeTypes) {
+  ThemeTypes["DARK_THEME"] = "darkTheme";
+  ThemeTypes["LIGHT_THEME"] = "lightTheme";
+})(ThemeTypes || (ThemeTypes = {}));
+
 var gwButtonVariants = ['primary', 'secondary', 'tertiary', 'flat', 'tool', 'boxed', 'icon'];
 
 var defaultButtonStyle = function defaultButtonStyle(button) {
@@ -1354,6 +1453,40 @@ var createTheme = function createTheme(paletteType, geowebColors, shadows) {
             fontSize: 16
           })
         }
+      },
+      MuiAccordion: {
+        styleOverrides: {
+          root: {
+            backgroundColor: geowebColors.cards.cardContainer,
+            borderRadius: '3px',
+            border: 'solid 1px',
+            borderColor: geowebColors.cards.cardContainerBorder,
+            color: geowebColors.buttons.flat["default"].color,
+            padding: '0px',
+            margin: '0px 12px 4px 12px',
+            fontSize: '12px',
+            '&:before': {
+              display: 'none'
+            },
+            '& .MuiAccordionSummary-root.Mui-expanded': {
+              borderBottom: 'solid 1px',
+              borderColor: geowebColors.cards.cardContainerBorder
+            },
+            '& .MuiAccordionSummary-content': {
+              margin: '2px',
+              padding: '4px 4px 4px 10px'
+            }
+          }
+        }
+      },
+      MuiAccordionSummary: {
+        styleOverrides: {
+          root: {
+            minHeight: '32px',
+            padding: '0px',
+            paddingRight: '5px'
+          }
+        }
       }
     }
   });
@@ -1645,24 +1778,8 @@ var colors$1 = {
       fill: '#67F0FF',
       opacity: 0.75
     },
-    playerRailObservation: {
-      fill: '#0876B6',
-      opacity: 100
-    },
-    playerRailSelection: {
-      fill: '#C6D111',
-      opacity: 0.5
-    },
-    playerRailForecastData: {
-      fill: '#FD64FF',
-      opacity: 0.6
-    },
-    playerRailForecastNoData: {
-      fill: '#051039',
-      opacity: 0.67
-    },
     playerTimeMarkers: {
-      fill: '#2C2C2C'
+      fill: '#051039'
     },
     playerTimeText: {
       color: '#FFFFFF',
@@ -1674,16 +1791,16 @@ var colors$1 = {
       fill: '#767676'
     },
     timelineText: {
-      fontSize: 14,
+      fontSize: 12,
       color: '#FFFFFF',
       fontFamily: 'Roboto'
     },
     timelineTimeScale: {
-      fill: '#979797'
+      fill: '#FFFFFF'
     },
     timelineNightTime: {
-      fill: '#070808',
-      opacity: 0.1
+      fill: '#051038',
+      opacity: 0.67
     },
     timelineTimelineSurface: {
       fill: '#FFFFFF'
@@ -1694,7 +1811,11 @@ var colors$1 = {
     },
     timelineSelectionBackground: {
       fill: '#FFFFFF',
-      opacity: 0.32
+      opacity: 0.15
+    },
+    timelineSelectionOutline: {
+      fill: '#F0FF00',
+      opacity: 0.4
     },
     // time scale
     timeScalePointer: {
@@ -2459,24 +2580,8 @@ var colors = {
       fill: '#67F0FF',
       opacity: 0.75
     },
-    playerRailObservation: {
-      fill: '#0876B6',
-      opacity: 100
-    },
-    playerRailSelection: {
-      fill: '#C6D111',
-      opacity: 0.5
-    },
-    playerRailForecastData: {
-      fill: '#FD64FF',
-      opacity: 0.6
-    },
-    playerRailForecastNoData: {
-      fill: '#051039',
-      opacity: 0.67
-    },
     playerTimeMarkers: {
-      fill: '#2C2C2C'
+      fill: '#051039'
     },
     playerTimeText: {
       color: '#FFFFFF',
@@ -2488,16 +2593,16 @@ var colors = {
       fill: '#A2A2A2'
     },
     timelineText: {
-      fontSize: 14,
+      fontSize: 12,
       color: '#FFFFFF',
       fontFamily: 'Roboto'
     },
     timelineTimeScale: {
-      fill: '#979797'
+      fill: '#FFFFFF'
     },
     timelineNightTime: {
-      fill: '#070808',
-      opacity: 0.3
+      fill: '#051038',
+      opacity: 0.67
     },
     timelineTimelineSurface: {
       fill: '#303030'
@@ -2508,7 +2613,11 @@ var colors = {
     },
     timelineSelectionBackground: {
       fill: '#FFFFFF',
-      opacity: 0.32
+      opacity: 0.15
+    },
+    timelineSelectionOutline: {
+      fill: '#F0FF00',
+      opacity: 0.4
     },
     // time scale
     timeScalePointer: {
@@ -2682,19 +2791,21 @@ var ThemeContext = /*#__PURE__*/React.createContext({
 });
 var ThemeProvider = function ThemeProvider(_ref) {
   var children = _ref.children,
-      _ref$theme = _ref.theme,
-      defaultTheme = _ref$theme === void 0 ? lightTheme : _ref$theme,
+      theme = _ref.theme,
+      defaultThemeName = _ref.defaultThemeName,
       _ref$disableCssBaseli = _ref.disableCssBaseline,
       disableCssBaseline = _ref$disableCssBaseli === void 0 ? false : _ref$disableCssBaseli;
+  var defaultTheme = defaultThemeName === ThemeTypes.DARK_THEME ? darkTheme : lightTheme;
 
-  var _React$useState = React.useState(false),
+  var _React$useState = React.useState(defaultTheme === darkTheme),
       _React$useState2 = _slicedToArray(_React$useState, 2),
       isDark = _React$useState2[0],
       setDark = _React$useState2[1];
 
+  var configuredTheme = isDark ? darkTheme : lightTheme;
   var currentTheme = React.useMemo(function () {
-    return isDark ? darkTheme : defaultTheme;
-  }, [isDark, defaultTheme]);
+    return theme || configuredTheme;
+  }, [configuredTheme, theme]);
 
   var toggleTheme = function toggleTheme() {
     return setDark(!isDark);
@@ -2715,14 +2826,15 @@ var useThemeContext = function useThemeContext() {
 
 var ThemeWrapper = function ThemeWrapper(_ref2) {
   var children = _ref2.children,
-      _ref2$theme = _ref2.theme,
-      theme = _ref2$theme === void 0 ? lightTheme : _ref2$theme,
+      theme = _ref2.theme,
+      defaultThemeName = _ref2.defaultThemeName,
       _ref2$disableCssBasel = _ref2.disableCssBaseline,
       disableCssBaseline = _ref2$disableCssBasel === void 0 ? false : _ref2$disableCssBasel;
   return /*#__PURE__*/React.createElement(StyledEngineProvider, {
     injectFirst: true
   }, /*#__PURE__*/React.createElement(ThemeProvider, {
     theme: theme,
+    defaultThemeName: defaultThemeName,
     disableCssBaseline: disableCssBaseline
   }, children));
 }; // Wrapper for storybook stories with GWTheme. Will be deprecated
@@ -2737,4 +2849,4 @@ var ThemeWrapperOldTheme = function ThemeWrapperOldTheme(_a) {
   }, props), children);
 };
 
-export { Add, ArrowDown, ArrowLeft, ArrowRight, ArrowUp, AutoUpdateActive, AutoUpdateInActive, Cached, CalendarToday, Cancel, ChevronDown, ChevronLeft, ChevronRight, ChevronUp, Clear, Clock, Close, Copy, Delete, DimensionsElevation, DimensionsOther, DimensionsRefTime, DimensionsTime, DragHandle, DrawFIRLand, DrawPolygon, DrawRegion, Edit, Equalizer, Exclamation, Expand, Export, FastForward, Filter, Flag, GWTheme, GeoWebLogo, HamburgerMenu, Home, index as Icons, Info, KeyCommand, KeyOption, Layers, Link, LinkOff, List, ListItem, Location, Minus, Notifications, Now, Options, Pause, Picture, Play, Preset, PresetTiles, PresetWorkspace, Resize, Search, SliderThumb, Speed, SplitHorizontal, SplitVertical, StepBackward, StepForward, SubdirectoryArrowRight, Success, TextIcon, ThemeContext, ThemeProvider, ThemeWrapper, ThemeWrapperOldTheme, ThumbsUp, TimeSeriesManager, UnExpand, Update, Visibility, VisibilityOff, WebAssetOff, darkTheme, gwButtonVariants, lightTheme, useThemeContext };
+export { Add, Animation, ArrowDown, ArrowLeft, ArrowRight, ArrowUp, AutoUpdateActive, AutoUpdateInActive, Both, Cached, CalendarToday, Cancel, ChevronDown, ChevronLeft, ChevronRight, ChevronUp, Clear, Clock, Close, CollapseLarge, CollapseMedium, CollapseSmall, CollapseWindow, Copy, Delete, DimensionsElevation, DimensionsOther, DimensionsRefTime, DimensionsTime, DragHandle, DrawFIRLand, DrawPolygon, DrawRegion, Edit, Equalizer, Exclamation, Expand, ExpandWindow, Export, FastForward, Filter, GWTheme, GeoWebLogo, HamburgerMenu, Home, index as Icons, Info, KeyCommand, KeyOption, Layers, Link, LinkOff, List, ListItem, Location, Minus, None, Notifications, Now, Options, Pause, Picture, Play, Preset, PresetTiles, PresetWorkspace, Resize, Search, SliderThumb, Speed, SplitHorizontal, SplitVertical, StepBackward, StepForward, SubdirectoryArrowRight, Success, TextIcon, ThemeContext, ThemeProvider, ThemeTypes, ThemeWrapper, ThemeWrapperOldTheme, ThumbsUp, TimeSeriesManager, UnExpand, Update, Visibility, VisibilityOff, WebAssetOff, darkTheme, dragHandlePath, gwButtonVariants, lightTheme, useThemeContext };

package/index.umd.js

@@ -79,6 +79,24 @@
         return ar;
     }
 
+    /* *
+     * 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 dragHandlePath = 'M9.5 8a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3zm5 0a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3zm-5 5.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3zm5 0a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3zm-5 5.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3zm5 0a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3z';
+
     /* *
      * Licensed under the Apache License, Version 2.0 (the "License");
      * you may not use this file except in compliance with the License.
@@ -336,6 +354,14 @@
         d: "M8.485 3.717a9 9 0 1 1 7.033 16.569 9 9 0 0 1-7.033-16.57zm.74 1.744a7.105 7.105 0 1 0 5.552 13.08 7.105 7.105 0 0 0-5.552-13.08zm1.825 1.522h1.894v4.734l3.049 1.76-.947 1.641-2.606-1.504h-1.39V6.983z"
       }));
     };
+    var Animation = function Animation(props) {
+      return /*#__PURE__*/React__namespace.createElement(material.SvgIcon, __assign({}, props), /*#__PURE__*/React__namespace.createElement("g", {
+        transform: "translate(3.000000, 4.000000)"
+      }, /*#__PURE__*/React__namespace.createElement("path", {
+        d: "M18,0 L18,16 L0,16 L0,0 L18,0 Z M2.7,13.4444444 L0.9,13.4444444 L0.9,15 L2.7,15 L2.7,13.4444444 Z M17.1,13.4444444 L15.3,13.4444444 L15.3,15 L17.1,15 L17.1,13.4444444 Z M6.7430548,3 C6.36845508,3 5.96666667,3.31868791 5.96666667,4.01673445 L5.96666667,11.9839323 C5.96666667,12.6819788 6.36905927,13 6.7430548,13 C6.94123014,13 7.14423902,12.9206614 7.34362274,12.7633176 L12.1668963,8.93772918 C12.4641593,8.70304687 12.6333333,8.36169078 12.6333333,7.99966664 C12.6333333,7.63897593 12.4635551,7.29828655 12.1675005,7.06293753 L7.34181016,3.23734916 C7.14423902,3.07933862 6.94123014,3 6.7430548,3 Z M2.7,10.3333333 L0.9,10.3333333 L0.9,11.8888889 L2.7,11.8888889 L2.7,10.3333333 Z M17.1,10.3333333 L15.3,10.3333333 L15.3,11.8888889 L17.1,11.8888889 L17.1,10.3333333 Z M2.7,7.22222222 L0.9,7.22222222 L0.9,8.77777778 L2.7,8.77777778 L2.7,7.22222222 Z M17.1,7.22222222 L15.3,7.22222222 L15.3,8.77777778 L17.1,8.77777778 L17.1,7.22222222 Z M2.7,4.11111111 L0.9,4.11111111 L0.9,5.66666667 L2.7,5.66666667 L2.7,4.11111111 Z M17.1,4.11111111 L15.3,4.11111111 L15.3,5.66666667 L17.1,5.66666667 L17.1,4.11111111 Z M2.7,1 L0.9,1 L0.9,2.55555556 L2.7,2.55555556 L2.7,1 Z M17.1,1 L15.3,1 L15.3,2.55555556 L17.1,2.55555556 L17.1,1 Z",
+        id: "AnimationSvgPath"
+      })));
+    };
     var Success = function Success(props) {
       return /*#__PURE__*/React__namespace.createElement(material.SvgIcon, __assign({}, props), /*#__PURE__*/React__namespace.createElement("path", {
         d: "m16.51 10.034-5.633 5.633-3.387-3.386a.954.954 0 0 1 0-1.343.975.975 0 0 1 1.342 0l2.045 2.046 4.292-4.291a.972.972 0 0 1 1.342 0c.368.369.368.97 0 1.341M12 4a8 8 0 1 0 0 16.001A8 8 0 0 0 12 4"
@@ -348,7 +374,7 @@
     };
     var DragHandle = function DragHandle(props) {
       return /*#__PURE__*/React__namespace.createElement(material.SvgIcon, __assign({}, props), /*#__PURE__*/React__namespace.createElement("path", {
-        d: "M9.5 8a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3zm5 0a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3zm-5 5.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3zm5 0a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3zm-5 5.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3zm5 0a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3z"
+        d: dragHandlePath
       }));
     };
     var AutoUpdateActive = function AutoUpdateActive(props) {
@@ -494,18 +520,14 @@
         d: "M7.81701445,12.5845372 L7.81701445,12.5845372 C7.17924024,11.946763 6.82932049,11.100321 6.82932049,10.1993044 C6.82932049,9.29828785 7.17924024,8.45077582 7.81701445,7.8140717 C8.47405029,7.15703585 9.3376137,6.82851792 10.2022472,6.82851792 C11.0658106,6.82851792 11.929374,7.15703585 12.5874799,7.8140717 C13.9026217,9.12921348 13.9026217,11.2693954 12.5874799,12.5845372 C11.9497057,13.2212413 11.1021937,13.5722311 10.2022472,13.5722311 C9.3012306,13.5722311 8.45371857,13.2212413 7.81701445,12.5845372 M19.5858748,17.581862 L15.4681648,13.465222 C16.9513109,11.0735688 16.6613162,7.88683788 14.5874799,5.81300161 C12.1690744,3.39566613 8.23434992,3.39566613 5.81594436,5.81300161 C4.64419476,6.9847512 4,8.54280364 4,10.1993044 C4,11.8558052 4.64419476,13.4138577 5.81594436,14.5845372 C6.98769395,15.7562868 8.5446763,16.4015516 10.2022472,16.4015516 C11.376137,16.4015516 12.4965222,16.0719636 13.4681648,15.4662921 L17.5837346,19.582932 C17.8608882,19.8590155 18.2225789,19.9970572 18.5853398,19.9970572 C18.9470305,19.9970572 19.3087212,19.8590155 19.5858748,19.582932 C20.1380417,19.029695 20.1380417,18.135099 19.5858748,17.581862"
       }));
     };
-    var Flag = function Flag(props) {
-      return /*#__PURE__*/React__namespace.createElement(material.SvgIcon, __assign({}, props), /*#__PURE__*/React__namespace.createElement("path", {
-        d: "M7.257 7.703c1.295-1.416 2.854-2.124 4.679-2.124 1.97 0 1.676 1.718 3.821 1.61 1.43-.073 2.847-.803 4.25-2.189v10c-1.554 1.47-2.971 2.213-4.25 2.228-1.918.023-1.632-1.61-3.821-1.61-1.46 0-3.02.795-4.679 2.382V7.703zM5.507 4a1.501 1.501 0 0 1 .75 2.803V20h-1.5L4.756 6.803A1.502 1.502 0 0 1 5.507 4z"
-      }));
-    };
     var Resize = function Resize(_a) {
       var _b = _a.isRightAligned,
           isRightAligned = _b === void 0 ? false : _b,
-          props = __rest(_a, ["isRightAligned"]);
+          sx = _a.sx,
+          props = __rest(_a, ["isRightAligned", "sx"]);
 
       return /*#__PURE__*/React__namespace.createElement(material.SvgIcon, __assign({
-        sx: __assign(__assign({
+        sx: __assign(__assign(__assign({
           width: 20,
           height: 20,
           top: -10,
@@ -517,7 +539,7 @@
           left: -10
         }), {
           zIndex: 1
-        }),
+        }), sx),
         "data-testid": "resizeHandle"
       }, props), /*#__PURE__*/React__namespace.createElement("path", {
         d: "M19.687 18.037v1h-6v-1h6zm3.5-3.5v1h-13v-1h13z",
@@ -645,6 +667,69 @@
         transform: "translate(1 2)"
       }));
     };
+    var CollapseWindow = function CollapseWindow(props) {
+      return /*#__PURE__*/React__namespace.createElement(material.SvgIcon, __assign({}, props), /*#__PURE__*/React__namespace.createElement("path", {
+        d: "M5,17 C4.43301962,17 4,17.4597824 4,18.0268006 C4,18.5938188 4.43301962,19 5,19 L19,19 C19.5669804,19 20,18.5938188 20,18.0268006 C20,17.4597824 19.5669804,17 19,17 L5,17 Z"
+      }));
+    };
+    var ExpandWindow = function ExpandWindow(props) {
+      return /*#__PURE__*/React__namespace.createElement(material.SvgIcon, __assign({}, props), /*#__PURE__*/React__namespace.createElement("path", {
+        d: "M18,4.5 C18.81657,4.52323671 19.4399034,4.74990338 19.87,5.18 C20.3000966,5.61009662 20.5100966,6.21676329 20.5,7 L20.5,17 C20.4955176,17.7444824 20.2855176,18.3244824 19.87,18.74 C19.4544824,19.1555176 18.8311491,19.4088509 18,19.5 L6,19.5 C5.1805214,19.4148333 4.56096049,19.1624284 4.1413173,18.7427852 C3.7216741,18.323142 3.50790167,17.7422136 3.5,17 L3.5,7 C3.52565636,6.18855517 3.73942879,5.5818885 4.1413173,5.18 C4.5432058,4.7781115 5.1627667,4.55144483 6,4.5 L18,4.5 Z M17.6875,6.75 L6.3125,6.75 C5.85182844,6.75 5.5,7.20978239 5.5,7.77680061 C5.5,8.34381884 5.85182844,8.75 6.3125,8.75 L17.6875,8.75 C18.1481716,8.75 18.5,8.34381884 18.5,7.77680061 C18.5,7.20978239 18.1481716,6.75 17.6875,6.75 Z"
+      }));
+    };
+    var CollapseLarge = function CollapseLarge(props) {
+      return /*#__PURE__*/React__namespace.createElement(material.SvgIcon, __assign({}, props), /*#__PURE__*/React__namespace.createElement("g", {
+        id: "Icons-/-Collapse-L",
+        stroke: "none",
+        strokeWidth: "1",
+        fill: "none",
+        fillRule: "evenodd"
+      }, /*#__PURE__*/React__namespace.createElement("path", {
+        d: "M18.0000715,4.5 C18.8166416,4.52323671 19.4399749,4.74990338 19.8700715,5.18 C20.3001681,5.61009662 20.5101681,6.21676329 20.5000715,7 L20.5000715,17 C20.4955891,17.7444824 20.2855891,18.3244824 19.8700715,18.74 C19.4545539,19.1555176 18.8312206,19.4088509 18.0000715,19.5 L6.00007152,19.5 C5.18059291,19.4148333 4.56103201,19.1624284 4.14138882,18.7427852 C3.72174562,18.323142 3.50797319,17.7422136 3.50007152,17 L3.50007152,7 C3.52572788,6.18855517 3.73950031,5.5818885 4.14138882,5.18 C4.54327732,4.7781115 5.16283822,4.55144483 6.00007152,4.5 L18.0000715,4.5 Z M17.5015692,6.5 L6.49857385,6.5 C5.94711624,6.5 5.50007152,6.94483697 5.50007152,7.4955775 L5.50007152,16.5044225 C5.50007152,17.0542648 5.94756094,17.5 6.49857385,17.5 L17.5015692,17.5 C18.0530268,17.5 18.5000715,17.055163 18.5000715,16.5044225 L18.5000715,7.4955775 C18.5000715,6.94573523 18.0525821,6.5 17.5015692,6.5 Z M11.51,8.14 L11.51,13.93 L14.4857761,13.93 L14.4857761,15.2471595 L9.79,15.2471595 L9.79,8.14 L11.51,8.14 Z",
+        id: "Icons-/-expand-L",
+        fill: "currentColor"
+      })));
+    };
+    var CollapseMedium = function CollapseMedium(props) {
+      return /*#__PURE__*/React__namespace.createElement(material.SvgIcon, __assign({}, props), /*#__PURE__*/React__namespace.createElement("g", {
+        id: "Icons-/-Collapse-M",
+        stroke: "none",
+        strokeWidth: "1",
+        fill: "none",
+        fillRule: "evenodd"
+      }, /*#__PURE__*/React__namespace.createElement("path", {
+        d: "M18.0000715,4.5 C18.8166416,4.52323671 19.4399749,4.74990338 19.8700715,5.18 C20.3001681,5.61009662 20.5101681,6.21676329 20.5000715,7 L20.5000715,17 C20.4955891,17.7444824 20.2855891,18.3244824 19.8700715,18.74 C19.4545539,19.1555176 18.8312206,19.4088509 18.0000715,19.5 L6.00007152,19.5 C5.18059291,19.4148333 4.56103201,19.1624284 4.14138882,18.7427852 C3.72174562,18.323142 3.50797319,17.7422136 3.50007152,17 L3.50007152,7 C3.52572788,6.18855517 3.73950031,5.5818885 4.14138882,5.18 C4.54327732,4.7781115 5.16283822,4.55144483 6.00007152,4.5 L18.0000715,4.5 Z M17.5015692,6.5 L6.49857385,6.5 C5.94711624,6.5 5.50007152,6.94483697 5.50007152,7.4955775 L5.50007152,16.5044225 C5.50007152,17.0542648 5.94756094,17.5 6.49857385,17.5 L17.5015692,17.5 C18.0530268,17.5 18.5000715,17.055163 18.5000715,16.5044225 L18.5000715,7.4955775 C18.5000715,6.94573523 18.0525821,6.5 17.5015692,6.5 Z M10.3720217,8.13793154 L11.9560108,13.0709727 L13.54,8.13793154 L15.79,8.13793154 L15.79,15.25 L14.0828502,15.25 L14.0828502,13.5960917 L14.24,10.1828615 L12.52,15.25 L11.3929679,15.25 L9.66668436,10.1828615 L9.83,13.5960917 L9.83,15.25 L8.12,15.25 L8.12,8.13793154 L10.3720217,8.13793154 Z",
+        id: "Icons-/-expand-M",
+        fill: "currentColor"
+      })));
+    };
+    var CollapseSmall = function CollapseSmall(props) {
+      return /*#__PURE__*/React__namespace.createElement(material.SvgIcon, __assign({}, props), /*#__PURE__*/React__namespace.createElement("g", {
+        id: "Icons-/-Collapse-S",
+        stroke: "none",
+        strokeWidth: "1",
+        fill: "none",
+        fillRule: "evenodd"
+      }, /*#__PURE__*/React__namespace.createElement("path", {
+        d: "M18.0000715,4.5 C18.8166416,4.52323671 19.4399749,4.74990338 19.8700715,5.18 C20.3001681,5.61009662 20.5101681,6.21676329 20.5000715,7 L20.5000715,17 C20.4955891,17.7444824 20.2855891,18.3244824 19.8700715,18.74 C19.4545539,19.1555176 18.8312206,19.4088509 18.0000715,19.5 L6.00007152,19.5 C5.18059291,19.4148333 4.56103201,19.1624284 4.14138882,18.7427852 C3.72174562,18.323142 3.50797319,17.7422136 3.50007152,17 L3.50007152,7 C3.52572788,6.18855517 3.73950031,5.5818885 4.14138882,5.18 C4.54327732,4.7781115 5.16283822,4.55144483 6.00007152,4.5 L18.0000715,4.5 Z M17.5015692,6.5 L6.49857385,6.5 C5.94711624,6.5 5.50007152,6.94483697 5.50007152,7.4955775 L5.50007152,16.5044225 C5.50007152,17.0542648 5.94756094,17.5 6.49857385,17.5 L17.5015692,17.5 C18.0530268,17.5 18.5000715,17.055163 18.5000715,16.5044225 L18.5000715,7.4955775 C18.5000715,6.94573523 18.0525821,6.5 17.5015692,6.5 Z M12,8.04223293 C12.3816424,8.04223293 12.7614621,8.07548514 13.1091818,8.18 C13.5650277,8.31701461 13.9657061,8.56252016 14.2430015,8.87556815 C14.5528447,9.22536046 14.7487564,9.63866568 14.7487564,10.2519529 L13.0420578,10.2519529 C13.0420578,10.1288369 13.0272095,9.87711169 12.8626035,9.66926494 C12.7706891,9.55320533 12.6320802,9.43866588 12.4232884,9.38 C12.3058648,9.34700656 12.1662431,9.34 12.0002452,9.34 C11.7669952,9.34 11.5569756,9.40134185 11.3953298,9.49974489 C11.191832,9.62362564 11.065,9.80624313 11.065,9.99915266 C11.065,10.4659624 11.5303207,10.7054039 12.0069825,10.88 C12.251836,10.9696872 12.4996821,11.0509766 12.6889856,11.1190164 C13.2468104,11.3195109 14.7487564,11.8079437 14.7487564,13.3345338 C14.7487564,14.1523847 14.3639594,14.7065019 13.71,15.0235466 C13.2549114,15.2441772 12.7956716,15.35 12,15.35 C11.5837341,15.35 11.0482218,15.2531638 10.57,15.0437157 C10.1291519,14.8506364 9.73916298,14.5618589 9.48671724,14.1650248 C9.25557241,13.8016749 9.14333333,13.3931427 9.15,12.939428 L10.8662463,12.939428 C10.8586095,13.2482201 10.923194,13.4935781 11.06,13.6755022 C11.265209,13.9483883 11.6785712,14.059404 12.0002452,14.059404 C12.416347,14.059404 13.0420578,13.9897611 13.0420578,13.3345338 C13.0420578,13.0169697 12.9081037,12.8095581 12.4695878,12.5923469 C12.3796921,12.5478187 12.2231629,12.4829201 12,12.3976512 C11.2094155,12.128282 10.6637991,11.8940163 10.3631508,11.6948541 C10.1074343,11.5254567 9.88191516,11.3372466 9.73293087,11.1353958 C9.51970344,10.8465054 9.36,10.5472019 9.36,9.99915266 C9.36,9.53454971 9.57462649,9.02233509 10.0735216,8.63036466 C10.4735262,8.31609021 11.2198472,8.04223293 12,8.04223293 Z",
+        id: "Icons-/-expand-S",
+        fill: "currentColor"
+      })));
+    };
+    var None = function None(props) {
+      return /*#__PURE__*/React__namespace.createElement(material.SvgIcon, __assign({}, props), /*#__PURE__*/React__namespace.createElement("g", {
+        transform: "translate(3 3)"
+      }, /*#__PURE__*/React__namespace.createElement("path", {
+        d: "M16.0000589,0 C17.1046284,-2.02906125e-16 18.0000589,0.8954305 18.0000589,2 L18.0010775,6.26818814 C17.7066608,6.0976323 17.364732,6 17,6 L16.285,6 L16.2857676,2.71429132 C16.2857676,2.16200657 15.8380523,1.71429132 15.2857676,1.71429132 L2.71429132,1.71429132 C2.16200657,1.71429132 1.71429132,2.16200657 1.71429132,2.71429132 L1.71429132,15.2857676 C1.71429132,15.8380523 2.16200657,16.2857676 2.71429132,16.2857676 L6,16.285 L6,17 C6,17.364732 6.0976323,17.7066608 6.26818814,18.0010775 L2,18.0000589 C0.8954305,18.0000589 1.3527075e-16,17.1046284 0,16.0000589 L0,2 C-1.3527075e-16,0.8954305 0.8954305,2.02906125e-16 2,0 L16.0000589,0 Z M16.0000589,7.71431095 C17.1046284,7.71431095 18.0000589,8.60974145 18.0000589,9.71431095 L18.0000589,16.0000589 C18.0000589,17.1046284 17.1046284,18.0000589 16.0000589,18.0000589 L9.71431095,18.0000589 C8.60974145,18.0000589 7.71431095,17.1046284 7.71431095,16.0000589 L7.71431095,9.71431095 C7.71431095,8.60974145 8.60974145,7.71431095 9.71431095,7.71431095 L16.0000589,7.71431095 Z M15.2857676,9.42860228 L10.4286023,9.42860228 C9.87631753,9.42860228 9.42860228,9.87631753 9.42860228,10.4286023 L9.42860228,15.2857676 C9.42860228,15.8380523 9.87631753,16.2857676 10.4286023,16.2857676 L15.2857676,16.2857676 C15.8380523,16.2857676 16.2857676,15.8380523 16.2857676,15.2857676 L16.2857676,10.4286023 C16.2857676,9.87631753 15.8380523,9.42860228 15.2857676,9.42860228 Z M14.5347673,10.2701019 L15.4312535,11.2107189 L13.8227128,12.8181019 L15.4312535,14.4261565 L14.5127019,15.344708 L12.9047128,13.7361019 L11.2972643,15.344708 L10.3787128,14.4261565 L11.9867128,12.8181019 L10.3787128,11.2107189 L11.2751989,10.2701019 L12.9047128,11.9001019 L14.5347673,10.2701019 Z"
+      })));
+    };
+    var Both = function Both(props) {
+      return /*#__PURE__*/React__namespace.createElement(material.SvgIcon, __assign({}, props), /*#__PURE__*/React__namespace.createElement("g", {
+        transform: "translate(3 3)"
+      }, /*#__PURE__*/React__namespace.createElement("path", {
+        d: "M6.12154852,-4.08562073e-14 L11.5665318,2.08618237 L7.16343758,5.90884652 L6.89046265,4.36072873 L6.80957756,4.39003855 C3.87189613,5.46406081 2.0365417,8.52135417 2.59891997,11.7107598 C2.74916282,12.5628294 3.05699221,13.3475078 3.48712515,14.0400746 L3.654,14.294 L4.03341039,13.916165 C4.300998,13.6487868 4.57483053,13.3752128 4.84929787,13.1010377 L5.49808471,12.4529989 L5.81818597,12.133305 L6.43943768,11.5129063 C6.54018288,11.4123056 6.63929935,11.3133343 6.73644152,11.2163368 L7.29283868,10.6607958 C7.46856431,10.4853491 7.63362837,10.3205548 7.78526647,10.1691699 L8.06982232,9.88509612 C8.15816112,9.79690915 8.23971374,9.71549875 8.3136611,9.64168177 L8.51186835,9.44382795 L8.55371431,9.40205768 L17.4815559,0.474640695 C18.0545559,-0.0983593047 18.9845559,-0.0983593047 19.5575559,0.474640695 C20.1305559,1.0476407 20.1305559,1.9776407 19.5575559,2.5506407 L14.831,7.276 L19.4288065,10.9204157 C19.784072,11.2028346 19.9878059,11.6116618 19.9878059,12.0444907 C19.9878059,12.4789196 19.784797,12.8885469 19.4280814,13.1701657 L13.6401532,17.7608718 C13.4008927,17.9496843 13.1572821,18.0448907 12.9194717,18.0448907 C12.470677,18.0448907 11.9878059,17.6632653 11.9878059,16.8256094 L11.987,10.12 L8.78355591,13.3246407 C8.78355591,13.3246407 8.77632036,13.3318973 8.76236846,13.3458891 L8.70088296,13.4075489 C8.68745028,13.4210194 8.67246832,13.4360433 8.65600198,13.4525555 L8.30579109,13.8037142 C8.12024363,13.9897508 7.88938874,14.2211951 7.62907158,14.482136 L7.3035632,14.8084053 C6.96594112,15.1467963 6.5950202,15.5184978 6.21818091,15.8960157 L5.46472391,16.6506601 C5.40263036,16.7128356 5.34087945,16.7746636 5.27959794,16.8360167 L3.83147258,18.2843629 L3.76884939,18.3468742 L3.40610402,18.7083747 C3.32314137,18.7908588 3.25923448,18.8541764 3.21780591,18.8948907 C2.63780591,19.4648907 1.70780591,19.4648907 1.13780591,18.8948907 C0.567805911,18.3248907 0.567805911,17.3948907 1.13780591,16.8148907 L1.30316348,16.6480048 L1.34269001,16.6082679 L1.58700213,16.3630806 C1.67091753,16.2789466 1.76427895,16.1854034 1.86593963,16.0835947 C1.00935344,14.9643562 0.401202684,13.6284705 0.139524125,12.1444177 C-0.668062091,7.56436865 2.10797283,3.18177303 6.45256841,1.87618962 L6.12154852,-4.08562073e-14 Z"
+      })));
+    };
 
     /* *
      * Licensed under the Apache License, Version 2.0 (the "License");
@@ -693,6 +778,7 @@
         GeoWebLogo: GeoWebLogo,
         Add: Add,
         Clock: Clock,
+        Animation: Animation,
         Success: Success,
         Cancel: Cancel,
         DragHandle: DragHandle,
@@ -717,7 +803,6 @@
         Filter: Filter,
         Clear: Clear,
         Search: Search,
-        Flag: Flag,
         Resize: Resize,
         PresetWorkspace: PresetWorkspace,
         Preset: Preset,
@@ -739,7 +824,14 @@
         DimensionsTime: DimensionsTime,
         DimensionsRefTime: DimensionsRefTime,
         DimensionsOther: DimensionsOther,
-        Picture: Picture
+        Picture: Picture,
+        CollapseWindow: CollapseWindow,
+        ExpandWindow: ExpandWindow,
+        CollapseLarge: CollapseLarge,
+        CollapseMedium: CollapseMedium,
+        CollapseSmall: CollapseSmall,
+        None: None,
+        Both: Both
     });
 
     /* *
@@ -758,6 +850,13 @@
      * Copyright 2021 - Koninklijk Nederlands Meteorologisch Instituut (KNMI)
      * Copyright 2021 - Finnish Meteorological Institute (FMI)
      * */
+    exports.ThemeTypes = void 0;
+
+    (function (ThemeTypes) {
+      ThemeTypes["DARK_THEME"] = "darkTheme";
+      ThemeTypes["LIGHT_THEME"] = "lightTheme";
+    })(exports.ThemeTypes || (exports.ThemeTypes = {}));
+
     var gwButtonVariants = ['primary', 'secondary', 'tertiary', 'flat', 'tool', 'boxed', 'icon'];
 
     var defaultButtonStyle = function defaultButtonStyle(button) {
@@ -1341,6 +1440,40 @@
                 fontSize: 16
               })
             }
+          },
+          MuiAccordion: {
+            styleOverrides: {
+              root: {
+                backgroundColor: geowebColors.cards.cardContainer,
+                borderRadius: '3px',
+                border: 'solid 1px',
+                borderColor: geowebColors.cards.cardContainerBorder,
+                color: geowebColors.buttons.flat["default"].color,
+                padding: '0px',
+                margin: '0px 12px 4px 12px',
+                fontSize: '12px',
+                '&:before': {
+                  display: 'none'
+                },
+                '& .MuiAccordionSummary-root.Mui-expanded': {
+                  borderBottom: 'solid 1px',
+                  borderColor: geowebColors.cards.cardContainerBorder
+                },
+                '& .MuiAccordionSummary-content': {
+                  margin: '2px',
+                  padding: '4px 4px 4px 10px'
+                }
+              }
+            }
+          },
+          MuiAccordionSummary: {
+            styleOverrides: {
+              root: {
+                minHeight: '32px',
+                padding: '0px',
+                paddingRight: '5px'
+              }
+            }
           }
         }
       });
@@ -1632,24 +1765,8 @@
           fill: '#67F0FF',
           opacity: 0.75
         },
-        playerRailObservation: {
-          fill: '#0876B6',
-          opacity: 100
-        },
-        playerRailSelection: {
-          fill: '#C6D111',
-          opacity: 0.5
-        },
-        playerRailForecastData: {
-          fill: '#FD64FF',
-          opacity: 0.6
-        },
-        playerRailForecastNoData: {
-          fill: '#051039',
-          opacity: 0.67
-        },
         playerTimeMarkers: {
-          fill: '#2C2C2C'
+          fill: '#051039'
         },
         playerTimeText: {
           color: '#FFFFFF',
@@ -1661,16 +1778,16 @@
           fill: '#767676'
         },
         timelineText: {
-          fontSize: 14,
+          fontSize: 12,
           color: '#FFFFFF',
           fontFamily: 'Roboto'
         },
         timelineTimeScale: {
-          fill: '#979797'
+          fill: '#FFFFFF'
         },
         timelineNightTime: {
-          fill: '#070808',
-          opacity: 0.1
+          fill: '#051038',
+          opacity: 0.67
         },
         timelineTimelineSurface: {
           fill: '#FFFFFF'
@@ -1681,7 +1798,11 @@
         },
         timelineSelectionBackground: {
           fill: '#FFFFFF',
-          opacity: 0.32
+          opacity: 0.15
+        },
+        timelineSelectionOutline: {
+          fill: '#F0FF00',
+          opacity: 0.4
         },
         // time scale
         timeScalePointer: {
@@ -2430,24 +2551,8 @@
           fill: '#67F0FF',
           opacity: 0.75
         },
-        playerRailObservation: {
-          fill: '#0876B6',
-          opacity: 100
-        },
-        playerRailSelection: {
-          fill: '#C6D111',
-          opacity: 0.5
-        },
-        playerRailForecastData: {
-          fill: '#FD64FF',
-          opacity: 0.6
-        },
-        playerRailForecastNoData: {
-          fill: '#051039',
-          opacity: 0.67
-        },
         playerTimeMarkers: {
-          fill: '#2C2C2C'
+          fill: '#051039'
         },
         playerTimeText: {
           color: '#FFFFFF',
@@ -2459,16 +2564,16 @@
           fill: '#A2A2A2'
         },
         timelineText: {
-          fontSize: 14,
+          fontSize: 12,
           color: '#FFFFFF',
           fontFamily: 'Roboto'
         },
         timelineTimeScale: {
-          fill: '#979797'
+          fill: '#FFFFFF'
         },
         timelineNightTime: {
-          fill: '#070808',
-          opacity: 0.3
+          fill: '#051038',
+          opacity: 0.67
         },
         timelineTimelineSurface: {
           fill: '#303030'
@@ -2479,7 +2584,11 @@
         },
         timelineSelectionBackground: {
           fill: '#FFFFFF',
-          opacity: 0.32
+          opacity: 0.15
+        },
+        timelineSelectionOutline: {
+          fill: '#F0FF00',
+          opacity: 0.4
         },
         // time scale
         timeScalePointer: {
@@ -2653,18 +2762,20 @@
     });
     var ThemeProvider = function ThemeProvider(_a) {
       var children = _a.children,
-          _b = _a.theme,
-          defaultTheme = _b === void 0 ? lightTheme : _b,
-          _c = _a.disableCssBaseline,
-          disableCssBaseline = _c === void 0 ? false : _c;
+          theme = _a.theme,
+          defaultThemeName = _a.defaultThemeName,
+          _b = _a.disableCssBaseline,
+          disableCssBaseline = _b === void 0 ? false : _b;
+      var defaultTheme = defaultThemeName === exports.ThemeTypes.DARK_THEME ? darkTheme : lightTheme;
 
-      var _d = __read(React__namespace.useState(false), 2),
-          isDark = _d[0],
-          setDark = _d[1];
+      var _c = __read(React__namespace.useState(defaultTheme === darkTheme), 2),
+          isDark = _c[0],
+          setDark = _c[1];
 
+      var configuredTheme = isDark ? darkTheme : lightTheme;
       var currentTheme = React__namespace.useMemo(function () {
-        return isDark ? darkTheme : defaultTheme;
-      }, [isDark, defaultTheme]);
+        return theme || configuredTheme;
+      }, [configuredTheme, theme]);
 
       var toggleTheme = function toggleTheme() {
         return setDark(!isDark);
@@ -2685,14 +2796,15 @@
 
     var ThemeWrapper = function ThemeWrapper(_a) {
       var children = _a.children,
-          _b = _a.theme,
-          theme = _b === void 0 ? lightTheme : _b,
-          _c = _a.disableCssBaseline,
-          disableCssBaseline = _c === void 0 ? false : _c;
+          theme = _a.theme,
+          defaultThemeName = _a.defaultThemeName,
+          _b = _a.disableCssBaseline,
+          disableCssBaseline = _b === void 0 ? false : _b;
       return /*#__PURE__*/React__namespace.createElement(material.StyledEngineProvider, {
         injectFirst: true
       }, /*#__PURE__*/React__namespace.createElement(ThemeProvider, {
         theme: theme,
+        defaultThemeName: defaultThemeName,
         disableCssBaseline: disableCssBaseline
       }, children));
     }; // Wrapper for storybook stories with GWTheme. Will be deprecated
@@ -2708,12 +2820,14 @@
     };
 
     exports.Add = Add;
+    exports.Animation = Animation;
     exports.ArrowDown = ArrowDown;
     exports.ArrowLeft = ArrowLeft;
     exports.ArrowRight = ArrowRight;
     exports.ArrowUp = ArrowUp;
     exports.AutoUpdateActive = AutoUpdateActive;
     exports.AutoUpdateInActive = AutoUpdateInActive;
+    exports.Both = Both;
     exports.Cached = Cached;
     exports.CalendarToday = CalendarToday;
     exports.Cancel = Cancel;
@@ -2724,6 +2838,10 @@
     exports.Clear = Clear;
     exports.Clock = Clock;
     exports.Close = Close;
+    exports.CollapseLarge = CollapseLarge;
+    exports.CollapseMedium = CollapseMedium;
+    exports.CollapseSmall = CollapseSmall;
+    exports.CollapseWindow = CollapseWindow;
     exports.Copy = Copy;
     exports.Delete = Delete;
     exports.DimensionsElevation = DimensionsElevation;
@@ -2738,10 +2856,10 @@
     exports.Equalizer = Equalizer;
     exports.Exclamation = Exclamation;
     exports.Expand = Expand;
+    exports.ExpandWindow = ExpandWindow;
     exports.Export = Export;
     exports.FastForward = FastForward;
     exports.Filter = Filter;
-    exports.Flag = Flag;
     exports.GWTheme = GWTheme;
     exports.GeoWebLogo = GeoWebLogo;
     exports.HamburgerMenu = HamburgerMenu;
@@ -2757,6 +2875,7 @@
     exports.ListItem = ListItem;
     exports.Location = Location;
     exports.Minus = Minus;
+    exports.None = None;
     exports.Notifications = Notifications;
     exports.Now = Now;
     exports.Options = Options;
@@ -2789,6 +2908,7 @@
     exports.VisibilityOff = VisibilityOff;
     exports.WebAssetOff = WebAssetOff;
     exports.darkTheme = darkTheme;
+    exports.dragHandlePath = dragHandlePath;
     exports.gwButtonVariants = gwButtonVariants;
     exports.lightTheme = lightTheme;
     exports.useThemeContext = useThemeContext;

package/lib/components/Icons/Icons.d.ts

@@ -28,6 +28,7 @@ export declare const HamburgerMenu: React.FC<SvgIconProps>;
 export declare const GeoWebLogo: React.FC<SvgIconProps>;
 export declare const Add: (props: SvgIconProps) => JSX.Element;
 export declare const Clock: (props: SvgIconProps) => JSX.Element;
+export declare const Animation: (props: SvgIconProps) => JSX.Element;
 export declare const Success: (props: SvgIconProps) => JSX.Element;
 export declare const Cancel: (props: SvgIconProps) => JSX.Element;
 export declare const DragHandle: (props: SvgIconProps) => JSX.Element;
@@ -55,11 +56,10 @@ export declare const Copy: (props: SvgIconProps) => JSX.Element;
 export declare const Filter: (props: SvgIconProps) => JSX.Element;
 export declare const Clear: (props: SvgIconProps) => JSX.Element;
 export declare const Search: (props: SvgIconProps) => JSX.Element;
-export declare const Flag: (props: SvgIconProps) => JSX.Element;
 interface ResizeIconProps extends SvgIconProps {
     isRightAligned?: boolean;
 }
-export declare const Resize: ({ isRightAligned, ...props }: ResizeIconProps) => JSX.Element;
+export declare const Resize: ({ isRightAligned, sx, ...props }: ResizeIconProps) => JSX.Element;
 export declare const PresetWorkspace: (props: SvgIconProps) => JSX.Element;
 export declare const Preset: (props: SvgIconProps) => JSX.Element;
 export declare const PresetTiles: (props: SvgIconProps) => JSX.Element;
@@ -81,4 +81,11 @@ export declare const DimensionsTime: (props: SvgIconProps) => JSX.Element;
 export declare const DimensionsRefTime: (props: SvgIconProps) => JSX.Element;
 export declare const DimensionsOther: (props: SvgIconProps) => JSX.Element;
 export declare const Picture: (props: SvgIconProps) => JSX.Element;
+export declare const CollapseWindow: (props: SvgIconProps) => JSX.Element;
+export declare const ExpandWindow: (props: SvgIconProps) => JSX.Element;
+export declare const CollapseLarge: (props: SvgIconProps) => JSX.Element;
+export declare const CollapseMedium: (props: SvgIconProps) => JSX.Element;
+export declare const CollapseSmall: (props: SvgIconProps) => JSX.Element;
+export declare const None: (props: SvgIconProps) => JSX.Element;
+export declare const Both: (props: SvgIconProps) => JSX.Element;
 export {};

package/lib/components/Paths/Paths.d.ts

@@ -0,0 +1 @@
+export declare const dragHandlePath = "M9.5 8a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3zm5 0a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3zm-5 5.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3zm5 0a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3zm-5 5.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3zm5 0a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3z";

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

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

package/lib/components/Theme/ThemeContext.d.ts

@@ -1,5 +1,6 @@
 import * as React from 'react';
 import { Theme as MUITheme } from '@mui/material';
+import { ThemeTypes } from './types';
 interface ThemeContextProps {
     toggleTheme?: () => void;
     isDark?: boolean;
@@ -8,6 +9,7 @@ export declare const ThemeContext: React.Context<Partial<ThemeContextProps>>;
 export interface ThemeProviderProps {
     children: React.ReactNode;
     theme?: MUITheme;
+    defaultThemeName?: ThemeTypes;
     disableCssBaseline?: boolean;
 }
 export declare const ThemeProvider: React.FC<ThemeProviderProps>;

package/lib/components/Theme/types.d.ts

@@ -2,6 +2,10 @@
 interface CSSProperties extends React.CSSProperties {
     rgba?: string;
 }
+export declare enum ThemeTypes {
+    DARK_THEME = "darkTheme",
+    LIGHT_THEME = "lightTheme"
+}
 export declare const gwButtonVariants: readonly ["primary", "secondary", "tertiary", "flat", "tool", "boxed", "icon"];
 export declare type ButtonVariant = typeof gwButtonVariants[number];
 export interface ButtonStyle {
@@ -71,10 +75,6 @@ export declare type GeowebColorPalette = {
         playerNeedleTime: CSSProperties;
         playerNeedlePlayerTop: CSSProperties;
         playerNeedlePlayer: CSSProperties;
-        playerRailObservation: CSSProperties;
-        playerRailSelection: CSSProperties;
-        playerRailForecastData: CSSProperties;
-        playerRailForecastNoData: CSSProperties;
         playerTimeMarkers: CSSProperties;
         playerTimeText: CSSProperties;
         timelineIndicator: CSSProperties;
@@ -84,6 +84,7 @@ export declare type GeowebColorPalette = {
         timelineTimelineSurface: CSSProperties;
         timelineMonthChangeDash: CSSProperties;
         timelineSelectionBackground: CSSProperties;
+        timelineSelectionOutline: CSSProperties;
         timeScalePointer: CSSProperties;
         timeScaleHorizontalScale: CSSProperties;
         timeScaleTimeIndicators: CSSProperties;

package/lib/stories/Accordion.stories.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+export declare const AccordionDemo: React.FC;
+export declare const Accordion: () => React.ReactElement;

package/lib/stories/index.stories.d.ts

@@ -1,3 +1,4 @@
+export { Accordion } from './Accordion.stories';
 export { Avatar } from './Avatar.stories';
 export { Backdrop } from './Backdrop.stories';
 export { Cards } from './Card.stories';

package/lib/stories/snapshots/Accordion.stories.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+declare const _default: {
+    title: string;
+};
+export default _default;
+export declare const AccordionLight: () => React.ReactElement;
+export declare const AccordionDark: () => React.ReactElement;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opengeoweb/theme",
-  "version": "4.4.0",
+  "version": "4.6.0",
   "description": "GeoWeb Theme library for the opengeoweb project",
   "license": "Apache-2.0",
   "repository": {