@widergy/energy-ui 3.172.3 → 3.173.0

package/dist/esm/components/UTSidebar/components/LogosContainer/index.js

@@ -1 +1,39 @@
-import React,{memo}from"react";import{bool,elementType,string}from"prop-types";import UTLabel from"../../../UTLabel";import DynamicIcon from"./components/DynamicIcon";import styles from"./styles.module.scss";const LogosContainer=_ref=>{let{badgeClassName:badgeClassName,badgeContent:badgeContent,BigLogo:BigLogo,bigLogoClassName:bigLogoClassName,containerClassName:containerClassName,SmallLogo:SmallLogo,smallLogoClassName:smallLogoClassName,showBigLogo:showBigLogo}=_ref;return React.createElement("div",{className:"".concat(containerClassName," ").concat(styles.logoContainer)},BigLogo&&React.createElement(DynamicIcon,{Icon:BigLogo,className:"".concat(bigLogoClassName," ").concat(styles.logo," ").concat(showBigLogo&&styles.visibleIcon)}),SmallLogo&&React.createElement(DynamicIcon,{Icon:SmallLogo,className:"".concat(smallLogoClassName," ").concat(styles.logo," ").concat(!showBigLogo&&styles.visibleIcon)}),badgeContent&&React.createElement(UTLabel,{className:badgeClassName},badgeContent))};LogosContainer.propTypes={badgeClassName:string,badgeContent:string,BigLogo:elementType,bigLogoClassName:string,containerClassName:string,smallLogoClassName:string,SmallLogo:elementType,showBigLogo:bool};export default memo(LogosContainer);
+import React, { memo } from 'react';
+import { bool, elementType, string } from 'prop-types';
+import UTLabel from '../../../UTLabel';
+import DynamicIcon from './components/DynamicIcon';
+import styles from './styles.module.scss';
+const LogosContainer = _ref => {
+  let {
+    badgeClassName,
+    badgeContent,
+    BigLogo,
+    bigLogoClassName,
+    containerClassName,
+    SmallLogo,
+    smallLogoClassName,
+    showBigLogo
+  } = _ref;
+  return /*#__PURE__*/React.createElement("div", {
+    className: "".concat(containerClassName, " ").concat(styles.logoContainer)
+  }, BigLogo && /*#__PURE__*/React.createElement(DynamicIcon, {
+    Icon: BigLogo,
+    className: "".concat(bigLogoClassName, " ").concat(styles.logo, " ").concat(showBigLogo && styles.visibleIcon)
+  }), SmallLogo && /*#__PURE__*/React.createElement(DynamicIcon, {
+    Icon: SmallLogo,
+    className: "".concat(smallLogoClassName, " ").concat(styles.logo, " ").concat(!showBigLogo && styles.visibleIcon)
+  }), badgeContent && /*#__PURE__*/React.createElement(UTLabel, {
+    className: badgeClassName
+  }, badgeContent));
+};
+LogosContainer.propTypes = {
+  badgeClassName: string,
+  badgeContent: string,
+  BigLogo: elementType,
+  bigLogoClassName: string,
+  containerClassName: string,
+  smallLogoClassName: string,
+  SmallLogo: elementType,
+  showBigLogo: bool
+};
+export default /*#__PURE__*/memo(LogosContainer);

package/dist/esm/components/UTSidebar/components/Option/constants.js

@@ -1 +1,9 @@
-export const TOOLTIP_CONFIG={tippyProps:{placement:"right",interactive:!1,arrow:!1,boundary:"viewport",appendTo:document.body}};
+export const TOOLTIP_CONFIG = {
+  tippyProps: {
+    placement: 'right',
+    interactive: false,
+    arrow: false,
+    boundary: 'viewport',
+    appendTo: document.body
+  }
+};

package/dist/esm/components/UTSidebar/components/Option/index.js

@@ -1 +1,111 @@
-function _extends(){return _extends=Object.assign?Object.assign.bind():function(n){for(var e=1;e<arguments.length;e++){var t=arguments[e];for(var r in t)({}).hasOwnProperty.call(t,r)&&(n[r]=t[r])}return n},_extends.apply(null,arguments)}import React,{Fragment,memo}from"react";import{string,bool,func,any,shape,number}from"prop-types";import ListItem from"@material-ui/core/ListItem";import ListItemIcon from"@material-ui/core/ListItemIcon";import ListItemText from"@material-ui/core/ListItemText";import ExpandMoreIcon from"@material-ui/icons/ExpandMore";import{isUTIcon}from"../../../../utils/componentUtils";import UTLabel from"../../../UTLabel";import UTTooltip from"../../../UTTooltip";import UTIcon from"../../../UTIcon";import{classType,iconType}from"../../types";import{TOOLTIP_CONFIG}from"./constants";import styles from"./styles.module.scss";const Option=_ref=>{let{classes:classes,dataTestId:dataTestId,handleClose:handleClose,handleRedirect:handleRedirect,IconActive:IconActive,IconInactive:IconInactive,iconProps:iconProps,isSelectedGroup:isSelectedGroup,label:label,labelAlwaysVisible:labelAlwaysVisible,link:link,location:location,onClick:onClick,open:open,optionRef:optionRef,toggleArrowActive:toggleArrowActive,withToggleArrow:withToggleArrow,withTooltip:withTooltip}=_ref;const isSelected=isSelectedGroup||link===location,Container=withTooltip?UTTooltip:Fragment,containerProps=withTooltip&&{...TOOLTIP_CONFIG,content:React.createElement(UTLabel,{className:classes.tooltipLabel},label),className:classes.tooltip};return React.createElement(Container,containerProps,React.createElement(ListItem,{"data-testid":dataTestId,className:"\n        ".concat(styles.option,"\n        ").concat(classes.option,"\n        ").concat(isSelected&&"".concat(styles.optionSelected," ").concat(classes.optionSelected),"\n        ").concat(isSelected&&open&&classes.optionSelectedOpened,"\n        ").concat(isSelected&&!isSelectedGroup&&!withTooltip&&styles.removeEvents,"\n      "),onClick:onClick||(()=>{handleRedirect(link),handleClose&&handleClose()}),ref:optionRef},React.createElement(ListItemIcon,{className:"\n          ".concat(classes.optionIconContainer,"\n          ").concat(isSelected&&"".concat(classes.optionIconContainerSelected," ").concat(styles.optionIconContainerSelected),"\n          ").concat(styles.optionIconContainer,"\n        ")},IconInactive&&(isUTIcon(IconInactive)?React.createElement(UTIcon,_extends({name:IconInactive,className:"".concat(classes.optionIcon," ").concat(styles.optionIcon)},(null==iconProps?void 0:iconProps.inactive)||{})):React.createElement(IconInactive,{className:"".concat(classes.optionIcon," ").concat(styles.optionIcon)})),IconActive&&(isUTIcon(IconActive)?React.createElement(UTIcon,_extends({name:IconActive,className:"".concat(classes.optionIcon," ").concat(styles.optionIconSelected," ").concat(classes.optionIconSelected)},(null==iconProps?void 0:iconProps.active)||{})):React.createElement(IconActive,{className:"".concat(classes.optionIcon," ").concat(styles.optionIconSelected," ").concat(classes.optionIconSelected)}))),React.createElement(ListItemText,{disableTypography:!0,className:"\n          ".concat(classes.optionLabel,"\n          ").concat(isSelected&&classes.optionLabelSelected,"\n          ").concat(!open&&styles.hidden,"\n        "),primary:label}),!open&&labelAlwaysVisible&&React.createElement(ListItemText,{disableTypography:!0,className:"\n            ".concat(styles.optionLabelBottom,"\n            ").concat(classes.optionLabelBottom,"\n            ").concat(isSelected&&classes.optionLabelBottomSelected,"\n          "),primary:label}),open&&withToggleArrow&&React.createElement(ExpandMoreIcon,{className:"\n            ".concat(styles.toggleArrow,"\n            ").concat(classes.toggleArrow,"\n            ").concat(toggleArrowActive&&styles.toggleArrowActive,"\n          ")})))};Option.propTypes={classes:classType,dataTestId:string,handleClose:func,handleRedirect:func,IconActive:iconType,IconInactive:iconType,iconProps:shape({active:shape({colorTheme:string,name:string,shade:string,size:number}),inactive:shape({colorTheme:string,name:string,shade:string,size:number})}),isSelectedGroup:bool,label:string,labelAlwaysVisible:bool,link:string,location:string,onClick:func,open:bool,optionRef:any,toggleArrowActive:bool,withToggleArrow:bool,withTooltip:bool};export default memo(Option);
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import React, { Fragment, memo } from 'react';
+import { string, bool, func, any, shape, number } from 'prop-types';
+import ListItem from '@material-ui/core/ListItem';
+import ListItemIcon from '@material-ui/core/ListItemIcon';
+import ListItemText from '@material-ui/core/ListItemText';
+import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
+import { isUTIcon } from '../../../../utils/componentUtils';
+import UTLabel from '../../../UTLabel';
+import UTTooltip from '../../../UTTooltip';
+import UTIcon from '../../../UTIcon';
+import { classType, iconType } from '../../types';
+import { TOOLTIP_CONFIG } from './constants';
+import styles from './styles.module.scss';
+const Option = _ref => {
+  let {
+    classes,
+    dataTestId,
+    handleClose,
+    handleRedirect,
+    IconActive,
+    IconInactive,
+    iconProps,
+    isSelectedGroup,
+    label,
+    labelAlwaysVisible,
+    link,
+    location,
+    onClick,
+    open,
+    optionRef,
+    toggleArrowActive,
+    withToggleArrow,
+    withTooltip
+  } = _ref;
+  const isSelected = isSelectedGroup || link === location;
+  const handleRedirection = () => {
+    handleRedirect(link);
+    if (handleClose) handleClose();
+  };
+  const Container = withTooltip ? UTTooltip : Fragment;
+  const containerProps = withTooltip && {
+    ...TOOLTIP_CONFIG,
+    content: /*#__PURE__*/React.createElement(UTLabel, {
+      className: classes.tooltipLabel
+    }, label),
+    className: classes.tooltip
+  };
+  return /*#__PURE__*/React.createElement(Container, containerProps, /*#__PURE__*/React.createElement(ListItem, {
+    "data-testid": dataTestId,
+    className: "\n        ".concat(styles.option, "\n        ").concat(classes.option, "\n        ").concat(isSelected && "".concat(styles.optionSelected, " ").concat(classes.optionSelected), "\n        ").concat(isSelected && open && classes.optionSelectedOpened, "\n        ").concat(isSelected && !isSelectedGroup && !withTooltip && styles.removeEvents, "\n      "),
+    onClick: onClick || handleRedirection,
+    ref: optionRef
+  }, /*#__PURE__*/React.createElement(ListItemIcon, {
+    className: "\n          ".concat(classes.optionIconContainer, "\n          ").concat(isSelected && "".concat(classes.optionIconContainerSelected, " ").concat(styles.optionIconContainerSelected), "\n          ").concat(styles.optionIconContainer, "\n        ")
+  }, IconInactive && (isUTIcon(IconInactive) ? /*#__PURE__*/React.createElement(UTIcon, _extends({
+    name: IconInactive,
+    className: "".concat(classes.optionIcon, " ").concat(styles.optionIcon)
+  }, (iconProps === null || iconProps === void 0 ? void 0 : iconProps.inactive) || {})) : /*#__PURE__*/React.createElement(IconInactive, {
+    className: "".concat(classes.optionIcon, " ").concat(styles.optionIcon)
+  })), IconActive && (isUTIcon(IconActive) ? /*#__PURE__*/React.createElement(UTIcon, _extends({
+    name: IconActive,
+    className: "".concat(classes.optionIcon, " ").concat(styles.optionIconSelected, " ").concat(classes.optionIconSelected)
+  }, (iconProps === null || iconProps === void 0 ? void 0 : iconProps.active) || {})) : /*#__PURE__*/React.createElement(IconActive, {
+    className: "".concat(classes.optionIcon, " ").concat(styles.optionIconSelected, " ").concat(classes.optionIconSelected)
+  }))), /*#__PURE__*/React.createElement(ListItemText, {
+    disableTypography: true,
+    className: "\n          ".concat(classes.optionLabel, "\n          ").concat(isSelected && classes.optionLabelSelected, "\n          ").concat(!open && styles.hidden, "\n        "),
+    primary: label
+  }), !open && labelAlwaysVisible && /*#__PURE__*/React.createElement(ListItemText, {
+    disableTypography: true,
+    className: "\n            ".concat(styles.optionLabelBottom, "\n            ").concat(classes.optionLabelBottom, "\n            ").concat(isSelected && classes.optionLabelBottomSelected, "\n          "),
+    primary: label
+  }), open && withToggleArrow && /*#__PURE__*/React.createElement(ExpandMoreIcon, {
+    className: "\n            ".concat(styles.toggleArrow, "\n            ").concat(classes.toggleArrow, "\n            ").concat(toggleArrowActive && styles.toggleArrowActive, "\n          ")
+  })));
+};
+Option.propTypes = {
+  classes: classType,
+  dataTestId: string,
+  handleClose: func,
+  handleRedirect: func,
+  IconActive: iconType,
+  IconInactive: iconType,
+  iconProps: shape({
+    active: shape({
+      colorTheme: string,
+      name: string,
+      shade: string,
+      size: number
+    }),
+    inactive: shape({
+      colorTheme: string,
+      name: string,
+      shade: string,
+      size: number
+    })
+  }),
+  isSelectedGroup: bool,
+  label: string,
+  labelAlwaysVisible: bool,
+  link: string,
+  location: string,
+  onClick: func,
+  open: bool,
+  optionRef: any,
+  toggleArrowActive: bool,
+  withToggleArrow: bool,
+  withTooltip: bool
+};
+export default /*#__PURE__*/memo(Option);

package/dist/esm/components/UTSidebar/components/Toggler/index.js

@@ -1 +1,42 @@
-import React,{memo}from"react";import{bool,func,string}from"prop-types";import MenuIcon from"@material-ui/icons/Menu";import CloseIcon from"@material-ui/icons/Close";import UTTouchableWithoutFeedback from"../../../UTTouchableWithoutFeedback";import UTLabel from"../../../UTLabel";import{classType}from"../../types";import styles from"./styles.module.scss";const Toggler=_ref=>{let{classes:classes,open:open,toggleDrawer:toggleDrawer,title:title,subtitle:subtitle}=_ref;return React.createElement("div",{className:"".concat(classes.togglerContainer," ").concat(styles.togglerContainer)},open?React.createElement("div",{className:"".concat(classes.closeDrawerContainer," ").concat(styles.closeDrawerContainer)},React.createElement(UTTouchableWithoutFeedback,{onClick:toggleDrawer},React.createElement(CloseIcon,{className:classes.closeIcon})),React.createElement("div",null,React.createElement(UTLabel,{className:classes.drawerTitle},title),React.createElement(UTLabel,{className:classes.drawerSubtitle},subtitle))):React.createElement(UTTouchableWithoutFeedback,{onClick:toggleDrawer},React.createElement(MenuIcon,{className:classes.menuIcon})))};Toggler.propTypes={classes:classType,open:bool,subtitle:string,title:string,toggleDrawer:func};export default memo(Toggler);
+import React, { memo } from 'react';
+import { bool, func, string } from 'prop-types';
+import MenuIcon from '@material-ui/icons/Menu';
+import CloseIcon from '@material-ui/icons/Close';
+import UTTouchableWithoutFeedback from '../../../UTTouchableWithoutFeedback';
+import UTLabel from '../../../UTLabel';
+import { classType } from '../../types';
+import styles from './styles.module.scss';
+const Toggler = _ref => {
+  let {
+    classes,
+    open,
+    toggleDrawer,
+    title,
+    subtitle
+  } = _ref;
+  return /*#__PURE__*/React.createElement("div", {
+    className: "".concat(classes.togglerContainer, " ").concat(styles.togglerContainer)
+  }, open ? /*#__PURE__*/React.createElement("div", {
+    className: "".concat(classes.closeDrawerContainer, " ").concat(styles.closeDrawerContainer)
+  }, /*#__PURE__*/React.createElement(UTTouchableWithoutFeedback, {
+    onClick: toggleDrawer
+  }, /*#__PURE__*/React.createElement(CloseIcon, {
+    className: classes.closeIcon
+  })), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(UTLabel, {
+    className: classes.drawerTitle
+  }, title), /*#__PURE__*/React.createElement(UTLabel, {
+    className: classes.drawerSubtitle
+  }, subtitle))) : /*#__PURE__*/React.createElement(UTTouchableWithoutFeedback, {
+    onClick: toggleDrawer
+  }, /*#__PURE__*/React.createElement(MenuIcon, {
+    className: classes.menuIcon
+  })));
+};
+Toggler.propTypes = {
+  classes: classType,
+  open: bool,
+  subtitle: string,
+  title: string,
+  toggleDrawer: func
+};
+export default /*#__PURE__*/memo(Toggler);

package/dist/esm/components/UTSidebar/index.js

@@ -1 +1,139 @@
-function _extends(){return _extends=Object.assign?Object.assign.bind():function(n){for(var e=1;e<arguments.length;e++){var t=arguments[e];for(var r in t)({}).hasOwnProperty.call(t,r)&&(n[r]=t[r])}return n},_extends.apply(null,arguments)}import React,{Fragment,useMemo}from"react";import{bool,func,objectOf,oneOfType,string}from"prop-types";import Backdrop from"@material-ui/core/Backdrop";import Drawer from"@material-ui/core/Drawer";import List from"@material-ui/core/List";import ScrollBar from"react-perfect-scrollbar";import"react-perfect-scrollbar/dist/css/styles.css";import{isEmpty}from"@widergy/web-utils/lib/array";import{useScreenSize}from"../../utils/useScreenSize";import{mergeClasses}from"../../utils/classesUtils";import WithTheme from"../WithTheme";import{classType,iconType,optionsType}from"./types";import{retrieveStyle}from"./theme";import ListOption from"./components/ListOption";import LogosContainer from"./components/LogosContainer";import Option from"./components/Option";import Toggler from"./components/Toggler";import styles from"./styles.module.scss";const UTSidebar=_ref=>{let{badgeContent:badgeContent,BigLogo:BigLogo,classes:themeClasses,classNames:classNames,FooterBigLogo:FooterBigLogo,FooterSmallLogo:FooterSmallLogo,handleClose:handleClose,handleOpen:handleOpen,handleRedirect:handleRedirect,labelAlwaysVisible:labelAlwaysVisible,location:location,open:open,options:options,SmallLogo:SmallLogo,subtitle:subtitle,title:title,withMouseActions:withMouseActions,withoutToggler:withoutToggler,withTooltip:withTooltip}=_ref;const{isTabletOrDesktop:isTabletOrDesktop}=useScreenSize(),classes=useMemo(()=>mergeClasses(themeClasses,classNames),[classNames]),toggleDrawer=()=>open?handleClose():handleOpen();return React.createElement(Fragment,null,React.createElement(Drawer,{open:isTabletOrDesktop||open,variant:isTabletOrDesktop?"persistent":"temporary",classes:{root:classes.drawerRoot,paper:"\n            ".concat(classes.drawer,"\n            ").concat(styles.drawer,"\n            ").concat(open?classes.openedDrawer:styles.removeShadow,"\n          ")},ModalProps:{onClose:handleClose},onMouseLeave:()=>withMouseActions&&handleClose(),onMouseEnter:()=>withMouseActions&&handleOpen()},(BigLogo||SmallLogo)&&React.createElement(LogosContainer,{badgeClassName:open?classes.logoBadgeOpen:classes.logoBadgeClose,badgeContent:badgeContent,BigLogo:BigLogo,SmallLogo:SmallLogo,bigLogoClassName:classes.bigLogo,smallLogoClassName:classes.smallLogo,containerClassName:classes.logoContainer,showBigLogo:open}),!withoutToggler&&React.createElement(Toggler,{toggleDrawer:toggleDrawer,open:open,classes:classes,title:title,subtitle:subtitle}),React.createElement("div",{className:styles.sidebarContent},React.createElement(List,{className:"".concat(classes.list," ").concat(open&&classes.listOpened," ").concat(styles.list)},React.createElement(ScrollBar,{className:"".concat(!open&&styles.scrollbarClosed," ").concat(classes.listScrollbar),options:{suppressScrollX:!0}},options.map(_ref2=>{let{show:show=!0,options:menuOptions,...props}=_ref2;if(!show)return!1;const hasMenuOptions=!isEmpty(menuOptions),menuOptionsToShow=hasMenuOptions&&menuOptions.filter(opt=>opt.show);if(hasMenuOptions&&isEmpty(menuOptionsToShow))return!1;const Component=isEmpty(menuOptions)?Option:ListOption;return React.createElement(Component,_extends({classes:classes,handleClose:handleClose,handleRedirect:handleRedirect,labelAlwaysVisible:labelAlwaysVisible,location:location,open:open,openDrawer:handleOpen,options:menuOptionsToShow,withTooltip:withTooltip},props))}))),FooterBigLogo&&FooterSmallLogo&&React.createElement(LogosContainer,{BigLogo:FooterBigLogo,SmallLogo:FooterSmallLogo,bigLogoClassName:classes.footerBigLogo,smallLogoClassName:classes.footerSmallLogo,containerClassName:classes.footerLogoContainer,showBigLogo:open}))),React.createElement(Backdrop,{open:isTabletOrDesktop&&open,className:styles.backdrop,onClick:toggleDrawer}))};UTSidebar.propTypes={badgeContent:string,BigLogo:oneOfType([iconType,string]),classes:classType,classNames:objectOf(string),FooterBigLogo:oneOfType([iconType,string]),FooterSmallLogo:oneOfType([iconType,string]),handleClose:func,handleOpen:func,handleRedirect:func,labelAlwaysVisible:bool,location:string,open:bool,options:optionsType,SmallLogo:oneOfType([iconType,string]),subtitle:string,title:string,withMouseActions:bool,withoutToggler:bool,withTooltip:bool};export default WithTheme(retrieveStyle)(UTSidebar);
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import React, { Fragment, useMemo } from 'react';
+import { bool, func, objectOf, oneOfType, string } from 'prop-types';
+import Backdrop from '@material-ui/core/Backdrop';
+import Drawer from '@material-ui/core/Drawer';
+import List from '@material-ui/core/List';
+import ScrollBar from 'react-perfect-scrollbar';
+import 'react-perfect-scrollbar/dist/css/styles.css';
+import { isEmpty } from '@widergy/web-utils/lib/array';
+import { useScreenSize } from '../../utils/useScreenSize';
+import { mergeClasses } from '../../utils/classesUtils';
+import WithTheme from '../WithTheme';
+import { classType, iconType, optionsType } from './types';
+import { retrieveStyle } from './theme';
+import ListOption from './components/ListOption';
+import LogosContainer from './components/LogosContainer';
+import Option from './components/Option';
+import Toggler from './components/Toggler';
+import styles from './styles.module.scss';
+const UTSidebar = _ref => {
+  let {
+    badgeContent,
+    BigLogo,
+    classes: themeClasses,
+    classNames,
+    FooterBigLogo,
+    FooterSmallLogo,
+    handleClose,
+    handleOpen,
+    handleRedirect,
+    labelAlwaysVisible,
+    location,
+    open,
+    options,
+    SmallLogo,
+    subtitle,
+    title,
+    withMouseActions,
+    withoutToggler,
+    withTooltip
+  } = _ref;
+  const {
+    isTabletOrDesktop
+  } = useScreenSize();
+  const classes = useMemo(() => mergeClasses(themeClasses, classNames), [classNames]);
+  const toggleDrawer = () => open ? handleClose() : handleOpen();
+  return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(Drawer, {
+    open: isTabletOrDesktop || open,
+    variant: isTabletOrDesktop ? 'persistent' : 'temporary',
+    classes: {
+      root: classes.drawerRoot,
+      paper: "\n            ".concat(classes.drawer, "\n            ").concat(styles.drawer, "\n            ").concat(open ? classes.openedDrawer : styles.removeShadow, "\n          ")
+    },
+    ModalProps: {
+      onClose: handleClose
+    },
+    onMouseLeave: () => withMouseActions && handleClose(),
+    onMouseEnter: () => withMouseActions && handleOpen()
+  }, (BigLogo || SmallLogo) && /*#__PURE__*/React.createElement(LogosContainer, {
+    badgeClassName: open ? classes.logoBadgeOpen : classes.logoBadgeClose,
+    badgeContent: badgeContent,
+    BigLogo: BigLogo,
+    SmallLogo: SmallLogo,
+    bigLogoClassName: classes.bigLogo,
+    smallLogoClassName: classes.smallLogo,
+    containerClassName: classes.logoContainer,
+    showBigLogo: open
+  }), !withoutToggler && /*#__PURE__*/React.createElement(Toggler, {
+    toggleDrawer: toggleDrawer,
+    open: open,
+    classes: classes,
+    title: title,
+    subtitle: subtitle
+  }), /*#__PURE__*/React.createElement("div", {
+    className: styles.sidebarContent
+  }, /*#__PURE__*/React.createElement(List, {
+    className: "".concat(classes.list, " ").concat(open && classes.listOpened, " ").concat(styles.list)
+  }, /*#__PURE__*/React.createElement(ScrollBar, {
+    className: "".concat(!open && styles.scrollbarClosed, " ").concat(classes.listScrollbar),
+    options: {
+      suppressScrollX: true
+    }
+  }, options.map(_ref2 => {
+    let {
+      show = true,
+      options: menuOptions,
+      ...props
+    } = _ref2;
+    if (!show) return false;
+    const hasMenuOptions = !isEmpty(menuOptions);
+    const menuOptionsToShow = hasMenuOptions && menuOptions.filter(opt => opt.show);
+    if (hasMenuOptions && isEmpty(menuOptionsToShow)) return false;
+    const Component = isEmpty(menuOptions) ? Option : ListOption;
+    return /*#__PURE__*/React.createElement(Component, _extends({
+      classes: classes,
+      handleClose: handleClose,
+      handleRedirect: handleRedirect,
+      labelAlwaysVisible: labelAlwaysVisible,
+      location: location,
+      open: open,
+      openDrawer: handleOpen,
+      options: menuOptionsToShow,
+      withTooltip: withTooltip
+    }, props));
+  }))), FooterBigLogo && FooterSmallLogo && /*#__PURE__*/React.createElement(LogosContainer, {
+    BigLogo: FooterBigLogo,
+    SmallLogo: FooterSmallLogo,
+    bigLogoClassName: classes.footerBigLogo,
+    smallLogoClassName: classes.footerSmallLogo,
+    containerClassName: classes.footerLogoContainer,
+    showBigLogo: open
+  }))), /*#__PURE__*/React.createElement(Backdrop, {
+    open: isTabletOrDesktop && open,
+    className: styles.backdrop,
+    onClick: toggleDrawer
+  }));
+};
+UTSidebar.propTypes = {
+  badgeContent: string,
+  BigLogo: oneOfType([iconType, string]),
+  classes: classType,
+  classNames: objectOf(string),
+  FooterBigLogo: oneOfType([iconType, string]),
+  FooterSmallLogo: oneOfType([iconType, string]),
+  handleClose: func,
+  handleOpen: func,
+  handleRedirect: func,
+  labelAlwaysVisible: bool,
+  location: string,
+  open: bool,
+  options: optionsType,
+  SmallLogo: oneOfType([iconType, string]),
+  subtitle: string,
+  title: string,
+  withMouseActions: bool,
+  withoutToggler: bool,
+  withTooltip: bool
+};
+export default WithTheme(retrieveStyle)(UTSidebar);