@opengeoweb/shared 9.35.0 → 9.36.0

package/index.esm.js

@@ -53,6 +53,7 @@ var en = {
 	"shared-shortcut-home": "Home",
 	"shared-shortcut-mouse-scroll": "+ Mouse scroll",
 	"shared-shortcut-or": "or",
+	"shared-shortcut-toggle-workspace-time-scroll": "Toggle workspace time scroll ON and OFF",
 	"shared-sentry-recording": "Sentry Recording",
 	"shared-sentry-information": "For monitoring performance and errors, GeoWeb is logging usage information. In this process, no sensitive user information will leave the browser.",
 	"shared-sentry-enable-message": "By enabling recording I understand that the recording related data will be send to Sentry´s servers for processing.",
@@ -111,6 +112,7 @@ var fi = {
 	"shared-shortcut-home": "Koti",
 	"shared-shortcut-mouse-scroll": "+ hiiren rulla",
 	"shared-shortcut-or": "tai",
+	"shared-shortcut-toggle-workspace-time-scroll": "Aseta työtilan ajan scrollaus päälle tai pois päältä",
 	"shared-sentry-recording": "Sentry Tallennus",
 	"shared-sentry-information": "Geoweb tallentaa tietoja sovelluksen käytöstä monitoroidakseen suorituskykyä, sekä virhetilanteita. Arkaluonteista dataa ei kerätä tai lähetetä.",
 	"shared-sentry-enable-message": "Ymmärrän, että laittamalla tallennuksen päälle tallennukseen liittyvää dataa lähetetään Sentryn palvelimille.",
@@ -169,6 +171,7 @@ var no = {
 	"shared-shortcut-home": "Hjem",
 	"shared-shortcut-mouse-scroll": "+ skroll",
 	"shared-shortcut-or": "eller",
+	"shared-shortcut-toggle-workspace-time-scroll": "ikke oversatt",
 	"shared-sentry-recording": "Skjermopptak av Sentry",
 	"shared-sentry-information": "GeoWeb tar opp brukerinformasjon for å monitorere ytelse og feilmeldinger. Underveis vil ingen sensitiv brukerinformasjon forlate nettleser.",
 	"shared-sentry-enable-message": "Ved å bruke skjermopptak forstår jeg at opptaksdata vil bli sendt til Sentry for analysering",
@@ -227,6 +230,7 @@ var nl = {
 	"shared-shortcut-home": "Home",
 	"shared-shortcut-mouse-scroll": "+ Scroll",
 	"shared-shortcut-or": "of",
+	"shared-shortcut-toggle-workspace-time-scroll": "niet vertaald",
 	"shared-sentry-recording": "Sentry Opname",
 	"shared-sentry-information": "Om performance en fouten te monitoren, registreert GeoWeb gebruiksinformatie. Tijdens dit proces verlaat geen enkele gevoelige gebruikersinformatie de browser.",
 	"shared-sentry-enable-message": "Door opname te starten, ga ik akkoord dat de opnamegerelateerde gegevens ter verwerking naar de servers van Sentry worden verzonden.",
@@ -596,7 +600,7 @@ function _setPrototypeOf(t, e) {
   }, _setPrototypeOf(t, e);
 }
 
-var _excluded$d = ["content", "color", "icon"];
+var _excluded$e = ["content", "color", "icon"];
 var bgColors = {
   green: 'geowebColors.functional.successOutline.fill',
   grey: 'geowebColors.functional.disabledOutline.fill',
@@ -634,7 +638,7 @@ var StatusTag = function StatusTag(_ref) {
   var content = _ref.content,
     color = _ref.color,
     icon = _ref.icon,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$d);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$e);
   return jsxs(Box, {
     display: "flex",
     alignItems: "center",
@@ -689,7 +693,7 @@ var CustomTooltip = function CustomTooltip(props) {
   }));
 };
 
-var _excluded$c = ["tooltipTitle", "variant", "isSelected", "shouldShowAsDisabled", "size", "children", "className", "tooltipProps"];
+var _excluded$d = ["tooltipTitle", "variant", "isSelected", "shouldShowAsDisabled", "size", "children", "className", "tooltipProps"];
 var CustomIconButtonNoMemo = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var _ref$tooltipTitle = _ref.tooltipTitle,
     defaultTooltipTitle = _ref$tooltipTitle === void 0 ? '' : _ref$tooltipTitle,
@@ -704,7 +708,7 @@ var CustomIconButtonNoMemo = /*#__PURE__*/React.forwardRef(function (_ref, ref)
     children = _ref.children,
     className = _ref.className,
     defaultTooltipProps = _ref.tooltipProps,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$c);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$d);
   var classNames = [].concat(className ? [className] : [], isSelected ? ['Mui-selected'] : [], [variant]).join(' ');
   var tooltipTitle = (defaultTooltipProps == null ? void 0 : defaultTooltipProps.title) || defaultTooltipTitle;
   var tooltipProps = React.useMemo(function () {
@@ -741,7 +745,7 @@ var CustomIconButtonNoMemo = /*#__PURE__*/React.forwardRef(function (_ref, ref)
 });
 var CustomIconButton = /*#__PURE__*/React.memo(CustomIconButtonNoMemo);
 
-var _excluded$b = ["title", "onClose", "description", "actions", "children", "sx"];
+var _excluded$c = ["title", "onClose", "description", "actions", "children", "sx"];
 var CustomDialog = function CustomDialog(_ref) {
   var title = _ref.title,
     _onClose = _ref.onClose,
@@ -751,7 +755,7 @@ var CustomDialog = function CustomDialog(_ref) {
     actions = _ref$actions === void 0 ? null : _ref$actions,
     children = _ref.children,
     sx = _ref.sx,
-    other = _objectWithoutPropertiesLoose(_ref, _excluded$b);
+    other = _objectWithoutPropertiesLoose(_ref, _excluded$c);
   return jsxs(Dialog, Object.assign({
     "data-testid": "customDialog",
     PaperProps: {
@@ -842,7 +846,7 @@ var useSharedTranslation = function useSharedTranslation() {
   return useTranslation([SHARED_NAMESPACE]);
 };
 
-var _excluded$a = ["open", "title", "description", "confirmLabel", "cancelLabel", "onSubmit", "onClose", "content", "disableAutoFocus", "isLoading"],
+var _excluded$b = ["open", "title", "description", "confirmLabel", "cancelLabel", "onSubmit", "onClose", "content", "disableAutoFocus", "isLoading"],
   _excluded2$1 = ["catchOnCancel"];
 var confirmStyle = {
   width: {
@@ -876,7 +880,7 @@ var ConfirmationDialog = function ConfirmationDialog(_ref) {
     disableAutoFocus = _ref$disableAutoFocus === void 0 ? false : _ref$disableAutoFocus,
     _ref$isLoading = _ref.isLoading,
     isLoading = _ref$isLoading === void 0 ? false : _ref$isLoading,
-    other = _objectWithoutPropertiesLoose(_ref, _excluded$a);
+    other = _objectWithoutPropertiesLoose(_ref, _excluded$b);
   other.catchOnCancel;
     var rest = _objectWithoutPropertiesLoose(other, _excluded2$1); // remove unwanted props
   var _useSharedTranslation = useSharedTranslation(),
@@ -1611,12 +1615,12 @@ var AppHeader = function AppHeader(_ref) {
   });
 };
 
-var _excluded$9 = ["bounds", "children"];
+var _excluded$a = ["bounds", "children"];
 var DraggableComponent$1 = function DraggableComponent(_ref) {
   var _ref$bounds = _ref.bounds,
     bounds = _ref$bounds === void 0 ? 'body' : _ref$bounds,
     children = _ref.children,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$9);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$a);
   var onDragStart = function onDragStart(e) {
     // This makes sure that nothing is selected during drag
     e.preventDefault();
@@ -1630,7 +1634,7 @@ var DraggableComponent$1 = function DraggableComponent(_ref) {
   }));
 };
 
-var _excluded$8 = ["children", "onResizeStart", "onResizeStop", "size", "setSize", "minHeight", "minWidth", "enable", "nodeRef"];
+var _excluded$9 = ["children", "onResizeStart", "onResizeStop", "size", "setSize", "minHeight", "minWidth", "enable", "nodeRef"];
 var isDraggingClassName = 'is-dragging';
 var useBoundsProps = function useBoundsProps(nodeRef) {
   var _React$useState = React__default.useState({}),
@@ -1673,7 +1677,7 @@ var ResizeComponent = function ResizeComponent(_ref) {
       topLeft: true
     } : _ref$enable,
     nodeRef = _ref.nodeRef,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$8);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$9);
   var theme = useTheme();
   var onStartResize = React__default.useCallback(function (event, _direction, node) {
     event.stopPropagation();
@@ -2179,7 +2183,7 @@ var ToolHeader = function ToolHeader(_ref) {
   });
 };
 
-var _excluded$7 = ["title", "size", "children", "onClose", "isResizable", "isDraggable", "maxHeight", "elevation", "headerClassName", "leftHeaderComponent", "rightHeaderComponent", "dragHandleIcon", "closeIcon"];
+var _excluded$8 = ["title", "size", "children", "onClose", "isResizable", "isDraggable", "maxHeight", "elevation", "headerClassName", "leftHeaderComponent", "rightHeaderComponent", "dragHandleIcon", "closeIcon"];
 var styles$3 = {
   container: {
     overflow: 'hidden',
@@ -2218,7 +2222,7 @@ var ToolContainer = function ToolContainer(_ref) {
     rightHeaderComponent = _ref$rightHeaderCompo === void 0 ? null : _ref$rightHeaderCompo,
     dragHandleIcon = _ref.dragHandleIcon,
     closeIcon = _ref.closeIcon,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$7);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$8);
   return jsxs(Paper, Object.assign({
     elevation: elevation,
     sx: styles$3.container
@@ -2386,7 +2390,7 @@ var useHandleSizeFromOutsideComponent = function useHandleSizeFromOutsideCompone
   }, [isOpen, getBoundsNode]);
 };
 
-var _excluded$6 = ["title", "bounds", "cancel", "headerSize", "startSize", "startPosition", "children", "isOpen", "onClose", "initialMaxHeight", "onChangeSize", "onMouseDown", "onResizeStop", "onDragEnd", "order", "source", "leftHeaderComponent", "rightHeaderComponent", "dragHandleIcon", "closeIcon", "className", "sx"];
+var _excluded$7 = ["title", "bounds", "cancel", "headerSize", "startSize", "startPosition", "children", "isOpen", "onClose", "initialMaxHeight", "onChangeSize", "onMouseDown", "onResizeStop", "onDragEnd", "order", "source", "leftHeaderComponent", "rightHeaderComponent", "dragHandleIcon", "closeIcon", "className", "sx"];
 // calculate dialog size and position to 85% of screensize
 var calculateDialogSizeAndPosition = function calculateDialogSizeAndPosition() {
   var width = window.innerWidth * 0.85;
@@ -2481,7 +2485,7 @@ var DraggableComponent = function DraggableComponent(_ref) {
     className = _ref.className,
     _ref$sx = _ref.sx,
     sx = _ref$sx === void 0 ? {} : _ref$sx,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$6);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$7);
   var zIndex = (source === 'app' ? BASE_Z_INDEX : 1000) + order;
   var elevation = BASE_ELEVATION + order;
   var nodeRef = React__default.useRef(null);
@@ -2950,6 +2954,16 @@ var ShortcutList = function ShortcutList(_ref) {
         children: "l"
       })]
     })
+  }, {
+    titleKey: 'shared-shortcut-toggle-workspace-time-scroll',
+    description: jsx(ShortCutSegment, {
+      type: "icon",
+      children: "S"
+    }),
+    descriptionMac: jsx(ShortCutSegment, {
+      type: "icon",
+      children: "S"
+    })
   }];
   return jsx(List, {
     "data-testid": "list-" + platform,
@@ -3371,7 +3385,7 @@ var getInitials = function getInitials(name) {
   }
 };
 
-var _excluded$5 = ["value", "orientation", "shouldAutoFocus"];
+var _excluded$6 = ["value", "orientation", "shouldAutoFocus"];
 var sliderHeaderStyle = {
   fontFamily: 'Roboto-Black, Roboto',
   fontSize: 12,
@@ -3428,7 +3442,7 @@ var CustomSlider = function CustomSlider(_ref) {
     orientation = _ref$orientation === void 0 ? 'vertical' : _ref$orientation,
     _ref$shouldAutoFocus = _ref.shouldAutoFocus,
     shouldAutoFocus = _ref$shouldAutoFocus === void 0 ? false : _ref$shouldAutoFocus,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$5);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$6);
   // Add custom class (for bold text) to label adjacent to thumb component.
   // Material UI doesn't support highlighing only adjacent label
   // when track is highlighted everywhere below selected value.
@@ -3474,7 +3488,7 @@ var CustomSlider = function CustomSlider(_ref) {
   }, props));
 };
 
-var _excluded$4 = ["variant", "className", "value"];
+var _excluded$5 = ["variant", "className", "value"];
 // This button is same as MUI ToggleButton but adds the variant prop
 var CustomToggleButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var _ref$variant = _ref.variant,
@@ -3482,7 +3496,7 @@ var CustomToggleButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     className = _ref.className,
     _ref$value = _ref.value,
     value = _ref$value === void 0 ? 0 : _ref$value,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$4);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$5);
   return jsx(ToggleButton, Object.assign({
     ref: ref,
     className: variant + " " + className,
@@ -3653,7 +3667,7 @@ var ToggleMenu = function ToggleMenu(_ref) {
   });
 };
 
-var _excluded$3 = ["tooltip", "list", "currentIndex", "onChangeMouseWheel", "requiresCtrlToChange", "isEnabled", "hasBackgroundColor", "variant", "additionalStyling", "skipLocalStyling"],
+var _excluded$4 = ["tooltip", "list", "currentIndex", "onChangeMouseWheel", "requiresCtrlToChange", "isEnabled", "hasBackgroundColor", "variant", "additionalStyling", "skipLocalStyling"],
   _excluded2 = ["className", "additionalStyling"];
 var TooltipSelect = function TooltipSelect(_ref) {
   var _ref$tooltip = _ref.tooltip,
@@ -3674,7 +3688,7 @@ var TooltipSelect = function TooltipSelect(_ref) {
     additionalStyling = _ref$additionalStylin === void 0 ? {} : _ref$additionalStylin,
     _ref$skipLocalStyling = _ref.skipLocalStyling,
     skipLocalStyling = _ref$skipLocalStyling === void 0 ? false : _ref$skipLocalStyling,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$3);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$4);
   var _React$useState = React.useState(false),
     selectOpen = _React$useState[0],
     setSelectOpen = _React$useState[1];
@@ -3889,7 +3903,7 @@ function withEggs(eggs) {
   };
 }
 
-var _excluded$2 = ["title", "title2", "defaultExpanded", "disableGutters", "expandedElevation", "collapsedElevation", "transitionDuration", "detailsSx", "CustomExpandIcon", "children", "amountOfItems"];
+var _excluded$3 = ["title", "title2", "defaultExpanded", "disableGutters", "expandedElevation", "collapsedElevation", "transitionDuration", "detailsSx", "CustomExpandIcon", "children", "amountOfItems"];
 var CustomAccordion = function CustomAccordion(_ref) {
   var title = _ref.title,
     title2 = _ref.title2,
@@ -3907,7 +3921,7 @@ var CustomAccordion = function CustomAccordion(_ref) {
     CustomExpandIcon = _ref.CustomExpandIcon,
     children = _ref.children,
     amountOfItems = _ref.amountOfItems,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$2);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$3);
   var _React$useState = React.useState(defaultExpanded),
     expanded = _React$useState[0],
     setExpanded = _React$useState[1];
@@ -4013,7 +4027,7 @@ var SearchHighlight = function SearchHighlight(_ref) {
   });
 };
 
-var _excluded$1 = ["activeLabel", "inActiveLabel", "tooltip"];
+var _excluded$2 = ["activeLabel", "inActiveLabel", "tooltip"];
 var styles = {
   label: {
     color: 'geowebColors.buttons.tertiary.default.color',
@@ -4029,7 +4043,7 @@ var SwitchButton = function SwitchButton(_ref) {
     inActiveLabel = _ref$inActiveLabel === void 0 ? 'Viewer' : _ref$inActiveLabel,
     _ref$tooltip = _ref.tooltip,
     tooltip = _ref$tooltip === void 0 ? 'Switch mode' : _ref$tooltip,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$1);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$2);
   return jsx(CustomTooltip, {
     title: tooltip,
     children: jsxs("span", {
@@ -4708,7 +4722,7 @@ var SearchField = function SearchField(_ref3) {
   });
 };
 
-var _excluded = ["filters", "onClickFilterChip", "onSearch", "isAllSelected", "searchQuery"];
+var _excluded$1 = ["filters", "onClickFilterChip", "onSearch", "isAllSelected", "searchQuery"];
 var DEFAULT_FILTER_HEIGHT = 85;
 var Filter = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var filters = _ref.filters,
@@ -4718,7 +4732,7 @@ var Filter = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     onSearch = _ref$onSearch === void 0 ? function () {} : _ref$onSearch,
     isAllSelected = _ref.isAllSelected,
     searchQuery = _ref.searchQuery,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$1);
   return jsx(Box, {
     sx: Object.assign({
       marginBottom: '8px'
@@ -4962,6 +4976,20 @@ var FilterOption = function FilterOption(_ref) {
   });
 };
 
+var _excluded = ["isDark", "children"];
+var StorybookDocsWrapper = function StorybookDocsWrapper(_ref) {
+  var _ref$isDark = _ref.isDark,
+    isDark = _ref$isDark === void 0 ? false : _ref$isDark,
+    children = _ref.children,
+    props = _objectWithoutPropertiesLoose(_ref, _excluded);
+  return jsx(Box, {
+    sx: Object.assign({}, isDark && {
+      backgroundColor: 'geowebColors.background.surfaceBrowser'
+    }, props.sx),
+    children: children
+  });
+};
+
 /* *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
@@ -5784,6 +5812,15 @@ var createToolkitMockStoreWithEggs = function createToolkitMockStoreWithEggs(sto
   store.addEggs = typeof jest !== 'undefined' ? jest.fn() : function () {}; // mocking the dynamic module loader
   return store;
 };
+var createToolkitMockStore = function createToolkitMockStore(storeConfig) {
+  var reducer = storeConfig.reducer,
+    preloadedState = storeConfig.preloadedState;
+  var store = configureStore(Object.assign({}, storeConfig, {
+    reducer: reducer,
+    preloadedState: preloadedState
+  }));
+  return store;
+};
 
 /* *
  * Licensed under the Apache License, Version 2.0 (the "License");
@@ -5929,4 +5966,4 @@ var RenderCounter = /*#__PURE__*/function () {
 }();
 var renderCounter = new RenderCounter();
 
-export { AlertBanner, AlertIcon, AppHeader, AppLayout, Avatar, CanvasComponent, ConfirmationDialog, ConfirmationServiceProvider, CustomAccordion, CustomDialog, CustomIconButton, CustomSlider, CustomToggleButton, CustomTooltip, DEBOUNCE_TIMEOUT, DEFAULT_ERROR_MESSAGE, DEFAULT_FILTER_HEIGHT, DraggableComponent$1 as Draggable, ErrorBoundary, Filter, FilterChip, FilterLabel, FilterListItem, FilterOption, LastUpdateTime, PROJECTION, ResizeComponent as Resizable, SHARED_NAMESPACE, SearchField$1 as SearchField, SearchFieldButton, SearchHighlight, StatusTag, SwitchButton, ToggleMenu, ToolContainer, DraggableComponent as ToolContainerDraggable, ToolFooter, ToolHeader, TooltipSelect, UserMenu, UserMenuItemCheatSheet, UserMenuItemSentryRecording, MenuItemTheme as UserMenuItemTheme, adjustPosition, calculateDialogSizeAndPosition, calculateStartSize, createToolkitMockStoreWithEggs, index as dateUtils, defaultDelay, getAxiosErrorMessage, getAxiosWarningMessage, getErrorMessage, getInitials, getLastUpdateTitle, getPosition, getWarningMessage, isAxiosAuthError, isAxiosError, pollingIntervalTimeout, renderCounter, sharedTranslations, showPrompt, sliderHeaderStyle, tooltipContainerStyles, useConfirmationDialog, useControlledTooltip, useDebounce, useDialogActions, useIsMounted, useMakeSureContainerStaysInsideWindow, usePoller, usePreventBrowserClose, usePrevious, useUserMenu, useWheelStopPropagation, withEggs };
+export { AlertBanner, AlertIcon, AppHeader, AppLayout, Avatar, CanvasComponent, ConfirmationDialog, ConfirmationServiceProvider, CustomAccordion, CustomDialog, CustomIconButton, CustomSlider, CustomToggleButton, CustomTooltip, DEBOUNCE_TIMEOUT, DEFAULT_ERROR_MESSAGE, DEFAULT_FILTER_HEIGHT, DraggableComponent$1 as Draggable, ErrorBoundary, Filter, FilterChip, FilterLabel, FilterListItem, FilterOption, LastUpdateTime, PROJECTION, ResizeComponent as Resizable, SHARED_NAMESPACE, SearchField$1 as SearchField, SearchFieldButton, SearchHighlight, StatusTag, StorybookDocsWrapper, SwitchButton, ToggleMenu, ToolContainer, DraggableComponent as ToolContainerDraggable, ToolFooter, ToolHeader, TooltipSelect, UserMenu, UserMenuItemCheatSheet, UserMenuItemSentryRecording, MenuItemTheme as UserMenuItemTheme, adjustPosition, calculateDialogSizeAndPosition, calculateStartSize, createToolkitMockStore, createToolkitMockStoreWithEggs, index as dateUtils, defaultDelay, getAxiosErrorMessage, getAxiosWarningMessage, getErrorMessage, getInitials, getLastUpdateTitle, getPosition, getWarningMessage, isAxiosAuthError, isAxiosError, pollingIntervalTimeout, renderCounter, sharedTranslations, showPrompt, sliderHeaderStyle, tooltipContainerStyles, useConfirmationDialog, useControlledTooltip, useDebounce, useDialogActions, useIsMounted, useMakeSureContainerStaysInsideWindow, usePoller, usePreventBrowserClose, usePrevious, useUserMenu, useWheelStopPropagation, withEggs };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opengeoweb/shared",
-  "version": "9.35.0",
+  "version": "9.36.0",
   "description": "GeoWeb shared library with shared components and utils for the opengeoweb project",
   "license": "Apache-2.0",
   "repository": {

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

@@ -1,13 +1,8 @@
-import * as React from 'react';
-declare const _default: {
-    title: string;
-};
-export default _default;
-export declare const AlertBannersLight: {
-    (): React.ReactElement;
-    tags: string[];
-};
-export declare const AlertBannersDark: {
-    (): React.ReactElement;
-    tags: string[];
-};
+import { Meta, StoryObj } from '@storybook/react/*';
+import AlertBanner from './AlertBanner';
+declare const meta: Meta<typeof AlertBanner>;
+export default meta;
+type Story = StoryObj<typeof AlertBanner>;
+export declare const Component: Story;
+export declare const AlertBannersLight: Story;
+export declare const AlertBannersDark: Story;

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

@@ -1,25 +1,8 @@
-import React from 'react';
-declare const _default: {
-    title: string;
-};
-export default _default;
-export declare const AppHeaderDark: {
-    (): React.ReactElement;
-    tags: string[];
-    parameters: {
-        zeplinLink: {
-            name: string;
-            link: string;
-        }[];
-    };
-};
-export declare const AppHeaderLight: {
-    (): React.ReactElement;
-    tags: string[];
-    parameters: {
-        zeplinLink: {
-            name: string;
-            link: string;
-        }[];
-    };
-};
+import { Meta, StoryObj } from '@storybook/react/*';
+import { AppHeader } from '.';
+declare const meta: Meta<typeof AppHeader>;
+export default meta;
+type Story = StoryObj<typeof AppHeader>;
+export declare const Component: Story;
+export declare const AppHeaderLight: Story;
+export declare const AppHeaderDark: Story;

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

@@ -1,7 +1,8 @@
-import React from 'react';
-declare const _default: {
-    title: string;
-};
-export default _default;
-export declare const ThemeLight: () => React.ReactElement;
-export declare const ThemeDark: () => React.ReactElement;
+import { Meta, StoryObj } from '@storybook/react/*';
+import AppLayout from './AppLayout';
+declare const meta: Meta<typeof AppLayout>;
+export default meta;
+type Story = StoryObj<typeof AppLayout>;
+export declare const Component: Story;
+export declare const ThemeLight: Story;
+export declare const ThemeDark: Story;

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

@@ -1,5 +1,5 @@
 import * as React from 'react';
-interface AvatarProps {
+export interface AvatarProps {
     children: React.ReactNode;
     size?: 'small' | 'large';
 }

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

@@ -1,25 +1,8 @@
-import * as React from 'react';
-declare const _default: {
-    title: string;
-};
-export default _default;
-export declare const AvatarLight: {
-    (): React.ReactElement;
-    tags: string[];
-    parameters: {
-        zeplinLink: {
-            name: string;
-            link: string;
-        }[];
-    };
-};
-export declare const AvatarDark: {
-    (): React.ReactElement;
-    tags: string[];
-    parameters: {
-        zeplinLink: {
-            name: string;
-            link: string;
-        }[];
-    };
-};
+import type { Meta, StoryObj } from '@storybook/react';
+import Avatar from './Avatar';
+declare const meta: Meta<typeof Avatar>;
+export default meta;
+type Story = StoryObj<typeof Avatar>;
+export declare const Component: Story;
+export declare const AvatarLight: Story;
+export declare const AvatarDark: Story;

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

@@ -1,7 +1,8 @@
-import * as React from 'react';
-declare const _default: {
-    title: string;
-};
-export default _default;
-export declare const DynamicCanvas: React.FC;
-export declare const StaticCanvas: React.FC;
+import { Meta, StoryObj } from '@storybook/react/*';
+import { CanvasComponent } from './CanvasComponent';
+declare const meta: Meta<typeof CanvasComponent>;
+export default meta;
+type Story = StoryObj<typeof CanvasComponent>;
+export declare const Component: Story;
+export declare const DynamicCanvas: Story;
+export declare const StaticCanvas: Story;

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

@@ -3,8 +3,14 @@ declare const _default: {
     title: string;
 };
 export default _default;
-export declare const ConfirmationDialogCustom: () => React.ReactElement;
-export declare const ConfirmationDialogLoading: () => React.ReactElement;
+export declare const ConfirmationDialogCustom: {
+    (): React.ReactElement;
+    tags: string[];
+};
+export declare const ConfirmationDialogLoading: {
+    (): React.ReactElement;
+    tags: string[];
+};
 export declare const ConfirmationDialogLight: {
     (): React.ReactElement;
     tags: string[];

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

@@ -1,13 +1,8 @@
-import * as React from 'react';
-declare const _default: {
-    title: string;
-};
-export default _default;
-export declare const CustomAccordionLight: {
-    (): React.ReactElement;
-    tags: string[];
-};
-export declare const CustomAccordionDark: {
-    (): React.ReactElement;
-    tags: string[];
-};
+import type { Meta, StoryObj } from '@storybook/react';
+import { CustomAccordion } from './CustomAccordion';
+declare const meta: Meta<typeof CustomAccordion>;
+export default meta;
+type Story = StoryObj<typeof CustomAccordion>;
+export declare const Component: Story;
+export declare const CustomAccordionLight: Story;
+export declare const CustomAccordionDark: Story;

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

@@ -1,25 +1,8 @@
-import * as React from 'react';
-declare const _default: {
-    title: string;
-};
-export default _default;
-export declare const CustomIconButtonLight: {
-    (): React.ReactElement;
-    tags: string[];
-    parameters: {
-        zeplinLink: {
-            name: string;
-            link: string;
-        }[];
-    };
-};
-export declare const CustomIconButtonDark: {
-    (): React.ReactElement;
-    tags: string[];
-    parameters: {
-        zeplinLink: {
-            name: string;
-            link: string;
-        }[];
-    };
-};
+import type { Meta, StoryObj } from '@storybook/react';
+import { CustomIconButton } from './CustomIconButton';
+declare const meta: Meta<typeof CustomIconButton>;
+export default meta;
+type Story = StoryObj<typeof CustomIconButton>;
+export declare const Component: Story;
+export declare const CustomIconButtonLight: Story;
+export declare const CustomIconButtonDark: Story;

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

@@ -1,13 +1,8 @@
-import * as React from 'react';
-declare const _default: {
-    title: string;
-};
-export default _default;
-export declare const CustomSliderLightTheme: {
-    (): React.ReactElement;
-    tags: string[];
-};
-export declare const CustomSliderDarkTheme: {
-    (): React.ReactElement;
-    tags: string[];
-};
+import type { Meta, StoryObj } from '@storybook/react';
+import { CustomSlider } from './CustomSlider';
+declare const meta: Meta<typeof CustomSlider>;
+export default meta;
+type Story = StoryObj<typeof CustomSlider>;
+export declare const Component: Story;
+export declare const CustomSliderLightTheme: Story;
+export declare const CustomSliderDarkTheme: Story;

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

@@ -1,13 +1,8 @@
-import React from 'react';
-declare const _default: {
-    title: string;
-};
-export default _default;
-export declare const CustomToggleButtonLight: {
-    (): React.ReactElement;
-    tags: string[];
-};
-export declare const CustomToggleButtonDark: {
-    (): React.ReactElement;
-    tags: string[];
-};
+import type { Meta, StoryObj } from '@storybook/react';
+import { CustomToggleButton } from './CustomToggleButton';
+declare const meta: Meta<typeof CustomToggleButton>;
+export default meta;
+type Story = StoryObj<typeof CustomToggleButton>;
+export declare const Component: Story;
+export declare const CustomToggleButtonLight: Story;
+export declare const CustomToggleButtonDark: Story;

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

@@ -1,10 +1,8 @@
-import * as React from 'react';
-declare const _default: {
-    title: string;
-};
-export default _default;
-export declare const ErrorBoundaryDemo: {
-    (): React.ReactElement;
-    storyName: string;
-};
-export declare const ErrorBoundaryInsideBox: () => React.ReactElement;
+import type { Meta, StoryObj } from '@storybook/react';
+import { ErrorBoundary } from './ErrorBoundary';
+declare const meta: Meta<typeof ErrorBoundary>;
+export default meta;
+type Story = StoryObj<typeof ErrorBoundary>;
+export declare const Component: Story;
+export declare const ErrorBoundaryDemo: Story;
+export declare const ErrorBoundaryInsideBox: Story;

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

@@ -1,25 +1,8 @@
-import * as React from 'react';
-declare const _default: {
-    title: string;
-};
-export default _default;
-export declare const FilterLight: {
-    (): React.ReactElement;
-    parameters: {
-        zeplinLink: {
-            name: string;
-            link: string;
-        }[];
-    };
-    tags: string[];
-};
-export declare const FilterDark: {
-    (): React.ReactElement;
-    parameters: {
-        zeplinLink: {
-            name: string;
-            link: string;
-        }[];
-    };
-    tags: string[];
-};
+import type { Meta, StoryObj } from '@storybook/react';
+import Filter from './Filter';
+declare const meta: Meta<typeof Filter>;
+export default meta;
+type Story = StoryObj<typeof Filter>;
+export declare const Component: Story;
+export declare const FilterLight: Story;
+export declare const FilterDark: Story;

package/src/lib/components/Filter/FilterListItem.stories.d.ts

@@ -3,5 +3,11 @@ declare const _default: {
     title: string;
 };
 export default _default;
-export declare const FilterListItemLight: () => React.ReactElement;
-export declare const FilterListItemDark: () => React.ReactElement;
+export declare const FilterListItemLight: {
+    (): React.ReactElement;
+    tags: string[];
+};
+export declare const FilterListItemDark: {
+    (): React.ReactElement;
+    tags: string[];
+};

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

@@ -1,13 +1,8 @@
-import * as React from 'react';
-declare const _default: {
-    title: string;
-};
-export default _default;
-export declare const LastUpdateTimeLightTheme: {
-    (): React.ReactElement;
-    tags: string[];
-};
-export declare const LastUpdateTimeDarkTheme: {
-    (): React.ReactElement;
-    tags: string[];
-};
+import type { Meta, StoryObj } from '@storybook/react';
+import LastUpdateTime from './LastUpdateTime';
+declare const meta: Meta<typeof LastUpdateTime>;
+export default meta;
+type Story = StoryObj<typeof LastUpdateTime>;
+export declare const Component: Story;
+export declare const LastUpdateTimeLightTheme: Story;
+export declare const LastUpdateTimeDarkTheme: Story;

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

@@ -1,5 +1,5 @@
 import React from 'react';
-interface HighlightProps {
+export interface HighlightProps {
     text: string;
     search: string;
 }

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

@@ -1,13 +1,8 @@
-import React from 'react';
-declare const _default: {
-    title: string;
-};
-export default _default;
-export declare const SearchHighlightLightTheme: {
-    (): React.ReactElement;
-    tags: string[];
-};
-export declare const SearchHighlightDarkTheme: {
-    (): React.ReactElement;
-    tags: string[];
-};
+import type { Meta, StoryObj } from '@storybook/react';
+import SearchHighlight from './SearchHighlight';
+declare const meta: Meta<typeof SearchHighlight>;
+export default meta;
+type Story = StoryObj<typeof SearchHighlight>;
+export declare const Component: Story;
+export declare const SearchHighlightLightTheme: Story;
+export declare const SearchHighlightDarkTheme: Story;

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

@@ -1,5 +1,13 @@
 import * as React from 'react';
 import { BoxProps } from '@mui/material';
+export declare const bgColors: {
+    green: string;
+    grey: string;
+    purple: string;
+    red: string;
+    yellow: string;
+    blue: string;
+};
 interface StatusTagProps extends BoxProps {
     content: string;
     color: string;

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

@@ -1,25 +1,8 @@
-import React from 'react';
-declare const _default: {
-    title: string;
-};
-export default _default;
-export declare const StatusTagsLight: {
-    (): React.ReactElement;
-    tags: string[];
-    parameters: {
-        zeplinLink: {
-            name: string;
-            link: string;
-        }[];
-    };
-};
-export declare const StatusTagsDark: {
-    (): React.ReactElement;
-    tags: string[];
-    parameters: {
-        zeplinLink: {
-            name: string;
-            link: string;
-        }[];
-    };
-};
+import { Meta, StoryObj } from '@storybook/react/*';
+import StatusTag from './StatusTag';
+declare const meta: Meta<typeof StatusTag>;
+export default meta;
+type Story = StoryObj<typeof StatusTag>;
+export declare const Component: Story;
+export declare const StatusTagsLight: Story;
+export declare const StatusTagsDark: Story;

package/src/lib/components/Storybook/StorybookDocsWrapper.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import { BoxProps } from '@mui/material';
+interface StorybookDocsWrapperProps extends BoxProps {
+    isDark?: boolean;
+}
+export declare const StorybookDocsWrapper: React.FC<StorybookDocsWrapperProps>;
+export {};

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

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

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

@@ -1,13 +1,8 @@
-import React from 'react';
-declare const _default: {
-    title: string;
-};
-export default _default;
-export declare const ToggleMenuLight: {
-    (): React.ReactElement;
-    tags: string[];
-};
-export declare const ToggleMenuDark: {
-    (): React.ReactElement;
-    tags: string[];
-};
+import type { Meta, StoryObj } from '@storybook/react';
+import { ToggleMenu } from './ToggleMenu';
+declare const meta: Meta<typeof ToggleMenu>;
+export default meta;
+type Story = StoryObj<typeof ToggleMenu>;
+export declare const Component: Story;
+export declare const ToggleMenuLight: Story;
+export declare const ToggleMenuDark: Story;

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

@@ -1,28 +1,16 @@
 import React from 'react';
-declare const _default: {
-    title: string;
-    includeStories: string[];
-};
-export default _default;
+import type { Meta, StoryObj } from '@storybook/react';
+import { ToolContainer } from '.';
+declare const meta: Meta<typeof ToolContainer>;
+export default meta;
+type Story = StoryObj<typeof ToolContainer>;
+export declare const Component: Story;
 interface ToolContainerDemoProps {
     isSnapShot?: boolean;
 }
-export declare const ToolContainerDemo: React.FC<ToolContainerDemoProps>;
-export declare const ThemeLight: {
-    (): React.ReactElement;
-    parameters: {
-        zeplinLink: {
-            name: string;
-            link: string;
-        }[];
-    };
-};
-export declare const ThemeDark: {
-    (): React.ReactElement;
-    parameters: {
-        zeplinLink: {
-            name: string;
-            link: string;
-        }[];
-    };
+export declare const ToolContainerDemo: {
+    ({ isSnapShot, }: ToolContainerDemoProps): React.ReactElement;
+    tags: string[];
 };
+export declare const ThemeLight: Story;
+export declare const ThemeDark: Story;

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

@@ -3,5 +3,11 @@ declare const _default: {
     title: string;
 };
 export default _default;
-export declare const ThemeLight: React.FC;
-export declare const ThemeDark: React.FC;
+export declare const ThemeLight: {
+    (): React.ReactElement;
+    tags: string[];
+};
+export declare const ThemeDark: {
+    (): React.ReactElement;
+    tags: string[];
+};

package/src/lib/components/ToolContainer/ToolHeader.stories.d.ts

@@ -1,23 +1,8 @@
-import React from 'react';
-declare const _default: {
-    title: string;
-};
-export default _default;
-export declare const ThemeLight: {
-    (): React.ReactElement;
-    parameters: {
-        zeplinLink: {
-            name: string;
-            link: string;
-        }[];
-    };
-};
-export declare const ThemeDark: {
-    (): React.ReactElement;
-    parameters: {
-        zeplinLink: {
-            name: string;
-            link: string;
-        }[];
-    };
-};
+import type { Meta, StoryObj } from '@storybook/react';
+import { ToolHeader } from '.';
+declare const meta: Meta<typeof ToolHeader>;
+export default meta;
+type Story = StoryObj<typeof ToolHeader>;
+export declare const Component: Story;
+export declare const ThemeLight: Story;
+export declare const ThemeDark: Story;

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

@@ -1,13 +1,10 @@
-import React from 'react';
-declare const _default: {
-    title: string;
-};
-export default _default;
-export declare const TooltipSelectLight: {
-    (): React.ReactElement;
-    tags: string[];
-};
-export declare const TooltipSelectDark: {
-    (): React.ReactElement;
-    tags: string[];
-};
+import type { Meta, StoryObj } from '@storybook/react';
+import { TooltipSelect } from './TooltipSelect';
+declare const meta: Meta<typeof TooltipSelect>;
+export default meta;
+type Story = StoryObj<typeof TooltipSelect>;
+export declare const Component: Story;
+export declare const TooltipSelectLightDemo: Story;
+export declare const TooltipSelectDarkDemo: Story;
+export declare const TooltipSelectLight: Story;
+export declare const TooltipSelectDark: Story;

package/src/lib/components/UserMenu/CheatSheet/CheatSheet.stories.d.ts

@@ -1,31 +1,10 @@
-import React from 'react';
-declare const _default: {
-    title: string;
-};
-export default _default;
-export declare const ThemeLight: {
-    (): React.ReactElement;
-    parameters: {
-        zeplinLink: {
-            name: string;
-            link: string;
-        }[];
-    };
-};
-export declare const ThemeDark: {
-    (): React.ReactElement;
-    parameters: {
-        zeplinLink: {
-            name: string;
-            link: string;
-        }[];
-    };
-};
-export declare const CheatSheetLight: {
-    (): React.ReactElement;
-    tags: string[];
-};
-export declare const CheatSheetDark: {
-    (): React.ReactElement;
-    tags: string[];
-};
+import type { Meta, StoryObj } from '@storybook/react';
+import CheatSheet from './CheatSheet';
+declare const meta: Meta<typeof CheatSheet>;
+export default meta;
+type Story = StoryObj<typeof CheatSheet>;
+export declare const Component: Story;
+export declare const ThemeLight: Story;
+export declare const ThemeDark: Story;
+export declare const CheatSheetLight: Story;
+export declare const CheatSheetDark: Story;

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

@@ -1,15 +1,10 @@
-import React from 'react';
-declare const _default: {
-    title: string;
-};
-export default _default;
-export declare const ThemeLight: () => React.ReactElement;
-export declare const ThemeDark: () => React.ReactElement;
-export declare const UserMenuLight: {
-    (): React.ReactElement;
-    tags: string[];
-};
-export declare const UserMenuDark: {
-    (): React.ReactElement;
-    tags: string[];
-};
+import type { Meta, StoryObj } from '@storybook/react';
+import { UserMenu } from '.';
+declare const meta: Meta<typeof UserMenu>;
+export default meta;
+type Story = StoryObj<typeof UserMenu>;
+export declare const Component: Story;
+export declare const ThemeLight: Story;
+export declare const ThemeDark: Story;
+export declare const UserMenuLight: Story;
+export declare const UserMenuDark: Story;

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

@@ -24,3 +24,4 @@ export * from './SearchField';
 export * from './LastUpdateTime';
 export * from './CanvasComponent';
 export * from './Filter';
+export * from './Storybook';

package/src/lib/hooks/usePoller/usePoller.stories.d.ts

@@ -1,6 +1,6 @@
-import React from 'react';
-declare const _default: {
-    title: string;
-};
-export default _default;
-export declare const usePollerDemo: () => React.ReactElement;
+import type { Meta, StoryObj } from '@storybook/react';
+import { usePoller } from './usePoller';
+declare const meta: Meta<typeof usePoller>;
+export default meta;
+type Story = StoryObj<typeof usePoller>;
+export declare const Component: Story;

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

@@ -3,4 +3,5 @@ interface ToolkitStoreWithEggs extends ToolkitStore {
     addEggs?: () => void;
 }
 export declare const createToolkitMockStoreWithEggs: (storeConfig: ConfigureStoreOptions) => ToolkitStoreWithEggs;
+export declare const createToolkitMockStore: (storeConfig: ConfigureStoreOptions) => ToolkitStore;
 export {};