@galaxy-ds/core 2.0.3 → 2.0.5

package/dist/index.js

@@ -23,8 +23,9 @@ var FormHelperText = require('@mui/material/FormHelperText');
 var Toolbar$1 = require('@mui/material/Toolbar');
 var ListItemIcon$1 = require('@mui/material/ListItemIcon');
 var ListItemText$1 = require('@mui/material/ListItemText');
-var ListItemButton = require('@mui/material/ListItemButton');
 var Button$1 = require('@mui/material/Button');
+var ButtonGroup = require('@mui/material/ButtonGroup');
+var ListItemButton = require('@mui/material/ListItemButton');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -46,8 +47,9 @@ var FormHelperText__default = /*#__PURE__*/_interopDefaultLegacy(FormHelperText)
 var Toolbar__default = /*#__PURE__*/_interopDefaultLegacy(Toolbar$1);
 var ListItemIcon__default = /*#__PURE__*/_interopDefaultLegacy(ListItemIcon$1);
 var ListItemText__default = /*#__PURE__*/_interopDefaultLegacy(ListItemText$1);
-var ListItemButton__default = /*#__PURE__*/_interopDefaultLegacy(ListItemButton);
 var Button__default = /*#__PURE__*/_interopDefaultLegacy(Button$1);
+var ButtonGroup__default = /*#__PURE__*/_interopDefaultLegacy(ButtonGroup);
+var ListItemButton__default = /*#__PURE__*/_interopDefaultLegacy(ListItemButton);
 
 /******************************************************************************
 Copyright (c) Microsoft Corporation.
@@ -16543,6 +16545,17 @@ var ProgressBar = function (props) {
     return jsxRuntime.jsx(material.LinearProgress, __assign({ variant: "determinate", color: color }, rest));
 };
 
+var Popover = function (props) {
+    props.anchorEl; var setAnchorEl = props.setAnchorEl, rest = __rest(props, ["anchorEl", "setAnchorEl"]);
+    var handleClose = function () {
+        setAnchorEl && setAnchorEl(null);
+    };
+    return (jsxRuntime.jsx(material.Popover, __assign({ id: "gds-popover", anchorEl: props.anchorEl, onClose: handleClose, anchorOrigin: {
+            vertical: 'bottom',
+            horizontal: 'left',
+        } }, rest, { children: props.children })));
+};
+
 var MuiFormControlLabel = styles$1.styled(material.FormControlLabel)({
     marginLeft: 0,
 });
@@ -16552,353 +16565,142 @@ var Radio = function (props) {
     return (jsxRuntime.jsx(MuiFormControlLabel, { value: value, label: label, control: jsxRuntime.jsx(material.Radio, __assign({ value: value, disableRipple: true, color: "default", icon: jsxRuntime.jsx(Icon, { name: SvgRadioDefault }), checkedIcon: jsxRuntime.jsx(Icon, { name: SvgRadioChecked }) }, rest)) }));
 };
 
-var RadioGroup = function (props) {
-    var label = props.label, rest = __rest(props, ["label"]);
-    return (jsxRuntime.jsxs(material.FormControl, __assign({ component: "fieldset" }, { children: [label ? jsxRuntime.jsx(material.FormLabel, { children: label }) : '', jsxRuntime.jsx(material.RadioGroup, __assign({ "aria-label": label }, rest, { children: props.children }))] })));
-};
-
-var SelectStyled = styles$1.styled(material.Select)(function (_a) {
-    var theme = _a.theme;
-    return ({
-        borderRadius: theme.shapes.card,
-        height: 40,
-        select: {
-            padding: '0 16px',
-            height: 40,
-            lineHeight: '40px',
-            display: 'flex',
-            alignItems: 'center',
-            '& .MuiTypography-root': {
-                fontWeight: 'inherit',
-            },
-            '&.MuiInputBase-input, &.MuiOutlinedInput-input': {
-                paddingRight: '44px',
-                paddingTop: 0,
-            },
-            '&.MuiInputBase-input.MuiFilledInput-input': {},
-            '&.MuiInputBase-input': {
-                '&.MuiFilledInput-input': {
-                    '&:focus': {
-                        backgroundColor: 'transparent',
-                    },
-                },
+styles$1.styled('div')({
+    height: '80px',
+    display: 'flex',
+    alignItems: 'center',
+    borderLeft: '1px solid transparent',
+    '&:active': {
+        backgroundColor: '#9DC9F4',
+        borderColor: '#9DC9F4',
+    },
+});
+var RibbonButtonStyled$1 = styles$1.styled(Button__default["default"])({
+    '&.MuiButton-root': {
+        height: '80px',
+        minWidth: 'unset',
+        padding: '0 8px',
+        textTransform: 'capitalize',
+        border: '1px solid transparent',
+        display: 'flex',
+        '&.carat': {
+            borderLeft: '1px solid transparent',
+        },
+        '&:hover': {
+            backgroundColor: '#DDE7F3',
+            borderColor: '#CADEF3',
+            '& .carat': {
+                borderColor: '#CADEF3',
             },
         },
-        '& .MuiFilledInput-input': {
-            paddingTop: '8px',
-            '&:focus': {
-                backgroundColor: 'transparent',
+        '&:active': {
+            backgroundColor: '#C7DEF3',
+            borderColor: '#9DC9F4',
+            '& .carat': {
+                borderColor: '#9DC9F4',
             },
         },
-        legend: {
-            display: 'none',
+    },
+});
+var RibbonLabelStyled = styles$1.styled(Typography)({
+    color: '#444444',
+});
+var RibbonContentStyled = styles$1.styled('div', {
+    shouldForwardProp: function (prop) { return prop !== 'isWrapped'; },
+})(function (_a) {
+    var isWrapped = _a.isWrapped;
+    return (__assign({}, (isWrapped && {
+        height: '80px',
+        width: '54px',
+        p: {
+            position: 'relative',
+            bottom: '8px',
         },
-    });
+    })));
 });
 
-var Select = function (props) {
-    return jsxRuntime.jsx(SelectStyled, __assign({ IconComponent: SvgChevronDownLg }, props));
-};
-
-var SidebarWrapper = styles$1.styled(Box)(templateObject_1$3 || (templateObject_1$3 = __makeTemplateObject(["\n  height: 100%;\n  overflow: hidden;\n"], ["\n  height: 100%;\n  overflow: hidden;\n"])));
-var SidebarMain = styles$1.styled(Box)(templateObject_2$1 || (templateObject_2$1 = __makeTemplateObject(["\n  flex: auto;\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n"], ["\n  flex: auto;\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n"])));
-var SidebarSide = styles$1.styled(Box)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n"], ["\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n"])));
-var templateObject_1$3, templateObject_2$1, templateObject_3;
-
-var Sidebar = function () { return null; };
-var Main = function () { return null; };
-var SidebarLayout = function (_a) {
-    var children = _a.children, _b = _a.sidebarWidth, sidebarWidth = _b === void 0 ? 260 : _b, _c = _a.sidebarBgColor, sidebarBgColor = _c === void 0 ? '#f3f3f3' : _c;
-    var sidebar = children.find(function (el) { return el.type === Sidebar; });
-    var main = children.find(function (el) { return el.type === Main; });
-    return (jsxRuntime.jsxs(SidebarWrapper, __assign({ display: "flex" }, { children: [jsxRuntime.jsx(SidebarSide, __assign({ bgcolor: sidebarBgColor, width: sidebarWidth }, { children: sidebar && sidebar.props.children })), jsxRuntime.jsx(SidebarMain, { children: main && main.props.children })] })));
-};
-SidebarLayout.Sidebar = Sidebar;
-SidebarLayout.Main = Main;
+var RibbonButton = React.forwardRef(function RibbonMenuListButton(props, ref) {
+    return (jsxRuntime.jsx(RibbonButtonStyled$1, __assign({ ref: ref, variant: "outlined" }, props, { children: jsxRuntime.jsxs(RibbonContentStyled, __assign({ isWrapped: props.isWrapped }, { children: [props.icon, jsxRuntime.jsx(RibbonLabelStyled, __assign({ variant: "body2" }, { children: props.label }))] })) })));
+});
 
-var StepsContainer = styles$1.styled('div')(function (_a) {
-    var theme = _a.theme;
-    return ({
-        height: 4,
-        width: '100%',
-        borderRadius: theme.shape.borderRadius,
-        backgroundColor: theme.palette.background.default,
+var RibbonButtonGroupStyled = styles$1.styled(ButtonGroup__default["default"])({
+    '&.MuiButtonGroup-root': {
+        width: 'max-content',
+        textTransform: 'capitalize',
+        border: '1px solid transparent',
+        padding: '0',
         display: 'flex',
-    });
-});
-var StepBar = styles$1.styled('div')(function (_a) {
-    var theme = _a.theme;
-    return ({
-        height: 4,
-        width: '100%',
-        '&:first-of-type': {
-            borderRadius: theme.shape.borderRadius,
-            borderBottomRightRadius: 0,
-            borderTopRightRadius: 0,
-        },
-        '&:last-of-type': {
-            borderRadius: theme.shape.borderRadius,
-            borderBottomLeftRadius: 0,
-            borderTopLeftRadius: 0,
+        '&.carat': {
+            border: '1px solid transparent',
         },
-        '&.active': {
-            backgroundColor: theme.palette.text.primary,
-            borderRadius: theme.shape.borderRadius,
-            '&:not(:first-of-type)': {
-                borderBottomLeftRadius: 0,
-                borderTopLeftRadius: 0,
+        '&:hover': {
+            backgroundColor: '#DDE7F3',
+            borderColor: '#CADEF3',
+            '& .carat': {
+                borderLeftColor: '#CADEF3',
             },
         },
-        '&.completed': {
-            backgroundColor: theme.palette.text.secondary,
-        },
-    });
-});
-var LabelsContainer = styles$1.styled('div')(function () { return ({
-    marginTop: 8,
-    display: 'flex',
-}); });
-var StepLabel = styles$1.styled(Typography)(function (_a) {
-    var theme = _a.theme;
-    return ({
-        color: theme.palette.text.disabled,
-        '&.active': {
-            color: theme.palette.text.primary,
-        },
-        '&.completed': {
-            color: theme.palette.text.secondary,
+        '&:active': {
+            borderColor: '#9DC9F4',
+            '& .carat': {
+                backgroundColor: '#C7DEF3',
+                borderLeftColor: '#9DC9F4',
+            },
         },
-    });
-});
-
-var StepNavigation = function (props) {
-    var ref = props.ref, steps = props.steps, activeStep = props.activeStep;
-    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(StepsContainer, __assign({ ref: ref }, { children: steps === null || steps === void 0 ? void 0 : steps.map(function (_a, index) {
-                    var label = _a.label;
-                    return (jsxRuntime.jsx(StepBar, { className: clsx(activeStep === index ? 'active' : '', activeStep > index ? 'completed' : '') }, label));
-                }) })), jsxRuntime.jsx(LabelsContainer, { children: steps === null || steps === void 0 ? void 0 : steps.map(function (_a, index) {
-                    var label = _a.label;
-                    return (jsxRuntime.jsx(StepLabel, __assign({ className: clsx(activeStep === index ? 'active' : '', activeStep > index ? 'completed' : ''), variant: 'subtitle2', width: 100 / steps.length + '%' }, { children: label }), label));
-                }) })] }));
-};
-
-var Switch = function (props) {
-    return jsxRuntime.jsx(material.Switch, __assign({ color: "default" }, props));
-};
-
-var Tab = function (props) {
-    return jsxRuntime.jsx(material.Tab, __assign({}, props, { children: props.children }));
-};
-
-var StyledListItemButton = styles$1.styled(ListItemButton__default["default"])({
-    backgroundColor: 'transparent',
-    textTransform: 'none',
-    padding: '8px 16px',
-    alignItems: 'flex-start',
-    position: 'relative',
-    zIndex: 0,
-    lineHeight: '1.25rem',
-    '&:hover .hide-on-hover': {
-        opacity: 0,
-    },
-    '&:hover .show-on-hover': {
-        opacity: 1,
-    },
-    '&:hover': {
-        backgroundColor: 'transparent',
     },
-    '& > *:nth-child(n+2)': {
-        marginLeft: 8,
+    '& .MuiButtonGroup-grouped': {
+        minWidth: 'unset',
     },
-    '& .MuiListItemAvatar-root': {
-        minWidth: 20,
-        marginRight: 0,
-        marginLeft: 0,
+    '& .MuiButtonGroup-firstButton:hover': {
+        borderRightColor: '#CADEF3',
     },
-    '& .MuiListItemText-root': {
-        marginTop: 0,
-        marginBottom: 0,
-        lineHeight: '1.25rem',
+});
+var RibbonCaratWrapperStyled = styles$1.styled(Button__default["default"])({
+    '& .MuiButtonGroup-grouped': {
+        minWidth: 'unset',
     },
-    '& .MuiTypography-root': {
-        lineHeight: '1.25rem',
+    '& .MuiSvgIcon-root': {
+        fontSize: '6px',
     },
-    '& .MuiTypography-root.MuiListItemText-secondary': {
-        lineHeight: '1rem',
+    '&.MuiButton-root': {
+        minWidth: 'unset',
+        width: '12px',
+        textTransform: 'capitalize',
+        border: '1px solid transparent',
+        padding: '0',
+        display: 'flex',
+        '&.carat': {
+            borderLeft: '1px solid transparent',
+        },
+        '&:hover': {
+            backgroundColor: '#DDE7F3',
+        },
+        '&:active': {
+            backgroundColor: '#C7DEF3',
+            '& .carat': {
+                borderLeftColor: '#9DC9F4',
+                backgroundColor: '#C7DEF3',
+            },
+        },
     },
 });
-var ShowOnHover = styles$1.styled('div')({
-    opacity: 0,
-    position: 'absolute',
-    right: 16,
-    zIndex: 99,
-});
-var HideOnHover = styles$1.styled('div')({
-    opacity: 1,
-    position: 'absolute',
-    right: 16,
-});
-var HoverContentWrapper = styles$1.styled('div', {
-    shouldForwardProp: function (prop) { return prop !== 'width'; },
-})(function (_a) {
-    var width = _a.width;
-    return ({
-        width: width,
-    });
+var RibbonButtonStyled = styles$1.styled(RibbonButton)({
+    '&.MuiButton-root': {
+        border: 'none',
+    },
 });
 
-var TabListItem = function (_a) {
-    var children = _a.children, hideOnHover = _a.hideOnHover, showOnHover = _a.showOnHover, props = __rest(_a, ["children", "hideOnHover", "showOnHover"]);
-    /**
-     * As child divs are absolute positioning, the parent container doesn't have a width.
-     * It can lead to sibling list text truncate incorrectly and text overlapping.
-     * The following code uses refs to get the widths of the contents,
-     * and set the bigger one as parent's width.
-     */
-    var contentRef1 = React.useRef(null);
-    var contentRef2 = React.useRef(null);
-    var _b = React.useState(24), width = _b[0], setWidth = _b[1];
-    React.useEffect(function () {
-        if (!contentRef1.current || !contentRef2.current)
-            return;
-        var width1 = contentRef1.current.clientWidth;
-        var width2 = contentRef2.current.clientWidth;
-        setWidth(width1 > width2 ? width1 : width2);
-    }, [contentRef1, contentRef2]);
-    return (jsxRuntime.jsx(StyledListItemButton, __assign({ disableGutters: true }, props, { children: jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [children, jsxRuntime.jsxs(HoverContentWrapper, __assign({ width: width }, { children: [jsxRuntime.jsx(HideOnHover, __assign({ ref: contentRef1, className: "hide-on-hover" }, { children: hideOnHover })), jsxRuntime.jsx(ShowOnHover, __assign({ ref: contentRef2, className: "show-on-hover" }, { children: showOnHover }))] }))] }) })));
-};
-
-var Table = function (props) {
-    return jsxRuntime.jsx(material.Table, __assign({}, props));
-};
+function AvatarBusinessIcon(props) {
+    return (jsxRuntime.jsxs(SvgIcon__default["default"], __assign({}, props, { viewBox: "0 0 48 48" }, { children: [jsxRuntime.jsx("path", { d: "M17.407 12.025h-3.472v-1.869c0-.227.158-.406.344-.406h2.777c.193 0 .344.187.344.406v1.869h.007zm17.215 0h-5.81v-1.869c0-.227.159-.406.344-.406h5.115c.193 0 .344.187.344.406v1.869h.007z", fill: "#B8BDC5" }), jsxRuntime.jsx("path", { d: "M32.622 13.187H15.749a2 2 0 00-2 2V46.75a2 2 0 002 2h16.873a2 2 0 002-2V15.187a2 2 0 00-2-2z", fill: "#fff" }), jsxRuntime.jsx("path", { d: "M34.622 13.187H13.749v.877h20.873v-.877z", fill: "#9DA4AF" }), jsxRuntime.jsx("path", { d: "M35.096 13.187h-21.82c-.31 0-.558-.293-.558-.658v-1.382c0-.365.248-.658.557-.658h21.821c.31 0 .557.293.557.658v1.373c0 .366-.247.667-.557.667zM20.02 20.419h-2.73c-.254 0-.46-.244-.46-.545v-3.217c0-.3.206-.545.46-.545h2.73c.254 0 .46.244.46.545v3.225c0 .3-.206.537-.46.537zm5.534 0h-2.73c-.254 0-.46-.244-.46-.545v-3.217c0-.3.206-.545.46-.545h2.73c.254 0 .46.244.46.545v3.225c-.006.3-.206.537-.46.537zm5.527 0h-2.73c-.254 0-.46-.244-.46-.545v-3.217c0-.3.206-.545.46-.545h2.73c.255 0 .46.244.46.545v3.225c0 .3-.206.537-.46.537zM20.02 26.78h-2.73c-.254 0-.46-.244-.46-.544V23.01c0-.3.206-.544.46-.544h2.73c.254 0 .46.244.46.544v3.226c0 .3-.206.544-.46.544zm5.534 0h-2.73c-.254 0-.46-.244-.46-.544V23.01c0-.3.206-.544.46-.544h2.73c.254 0 .46.244.46.544v3.226c-.006.3-.206.544-.46.544zm5.527 0h-2.73c-.254 0-.46-.244-.46-.544V23.01c0-.3.206-.544.46-.544h2.73c.255 0 .46.244.46.544v3.226c0 .3-.206.544-.46.544zM20.02 33.142h-2.73c-.254 0-.46-.244-.46-.545v-3.226c0-.3.206-.544.46-.544h2.73c.254 0 .46.244.46.544v3.226c0 .3-.206.544-.46.544zm5.534 0h-2.73c-.254 0-.46-.244-.46-.545v-3.226c0-.3.206-.544.46-.544h2.73c.254 0 .46.244.46.544v3.226c-.006.3-.206.544-.46.544zm5.527 0h-2.73c-.254 0-.46-.244-.46-.545v-3.226c0-.3.206-.544.46-.544h2.73c.255 0 .46.244.46.544v3.226c0 .3-.206.544-.46.544zM20.02 39.496h-2.73c-.254 0-.46-.244-.46-.544v-3.226c0-.3.206-.544.46-.544h2.73c.254 0 .46.243.46.544v3.226c0 .3-.206.544-.46.544zm5.534 0h-2.73c-.254 0-.46-.244-.46-.544v-3.226c0-.3.206-.544.46-.544h2.73c.254 0 .46.243.46.544v3.226c-.006.3-.206.544-.46.544zm5.527 0h-2.73c-.254 0-.46-.244-.46-.544v-3.226c0-.3.206-.544.46-.544h2.73c.255 0 .46.243.46.544v3.226c0 .3-.206.544-.46.544zM20.02 45.857h-2.73c-.254 0-.46-.243-.46-.544v-3.226c0-.3.206-.544.46-.544h2.73c.254 0 .46.244.46.544v3.226c0 .3-.206.544-.46.544z", fill: "#B8BDC5" }), jsxRuntime.jsx("path", { d: "M25.554 45.857h-2.73c-.254 0-.46-.243-.46-.544v-3.226c0-.3.206-.544.46-.544h2.73c.254 0 .46.244.46.544v3.226c-.006.3-.206.544-.46.544z", fill: "#fff" }), jsxRuntime.jsx("path", { d: "M31.081 45.857h-2.73c-.254 0-.46-.243-.46-.544v-3.226c0-.3.206-.544.46-.544h2.73c.255 0 .46.244.46.544v3.226c0 .3-.206.544-.46.544zm-5.369-5.102h-3.046c-.281 0-.508.268-.508.601v7.394h4.07v-7.386c-.007-.333-.234-.61-.516-.61z", fill: "#B8BDC5" }), jsxRuntime.jsx("path", { d: "M27.513 47.808h-6.648v.942h6.648v-.942z", fill: "#9DA4AF" })] })));
+}
 
-var TableBody = function (props) {
-    return jsxRuntime.jsx(material.TableBody, __assign({}, props));
-};
+function AvatarCompanyIcon(props) {
+    return (jsxRuntime.jsxs(SvgIcon__default["default"], __assign({}, props, { viewBox: "0 0 48 48" }, { children: [jsxRuntime.jsx("path", { d: "M39.782 40.45h-5.334V29.075c0-.275.191-.5.425-.5h4.483c.234 0 .425.225.425.5V40.45zM9.125 26.075H7v-6.008c0-.192.135-.35.298-.35h1.53c.162 0 .297.158.297.35v6.008z", fill: "#B8BDC5" }), jsxRuntime.jsx("path", { d: "M11.073 46.016H7V23.241h3.386c.382 0 .687.367.687.808v21.967z", fill: "#B8BDC5" }), jsxRuntime.jsx("path", { d: "M14.77 25.208H7v22.775h7.77V25.208zM23.653 9.9l-6.432 4.367c-.212.142-.347.408-.347.7v19.516c0 .45.305.809.687.809h12.863c.383 0 .688-.358.688-.809V14.968c0-.292-.135-.559-.348-.7L24.333 9.9a.597.597 0 00-.68 0z", fill: "#B8BDC5" }), jsxRuntime.jsx("path", { d: "M23.653 15.008l-8.543 5.8c-.212.142-.347.408-.347.7V48h18.46V21.508c0-.292-.135-.558-.348-.7l-8.528-5.8a.592.592 0 00-.694 0z", fill: "#fff" }), jsxRuntime.jsx("path", { d: "M25.063 14.35h-2.125v-6c0-.192.134-.35.297-.35h1.53c.163 0 .297.158.297.35v6zM38.18 32.425h-2.124v-6.009c0-.191.134-.35.297-.35h1.53c.163 0 .298.159.298.35v6.009zM18.843 25.5h-.779c-.148 0-.276-.142-.276-.325v-1.958c0-.175.12-.325.276-.325h.78c.148 0 .276.141.276.325v1.958c-.007.183-.128.325-.277.325zM21.613 25.5h-.78c-.148 0-.268-.142-.268-.325v-1.958c0-.175.12-.325.269-.325h.779c.149 0 .276.141.276.325v1.958c0 .183-.12.325-.276.325zM24.39 25.5h-.78c-.148 0-.276-.142-.276-.325v-1.958c0-.175.12-.325.276-.325h.78c.148 0 .276.141.276.325v1.958c-.007.183-.128.325-.277.325zM27.159 25.5h-.78c-.148 0-.276-.142-.276-.325v-1.958c0-.175.12-.325.277-.325h.779c.149 0 .276.141.276.325v1.958c0 .183-.12.325-.276.325zM29.936 25.5h-.78c-.148 0-.276-.142-.276-.325v-1.958c0-.175.12-.325.277-.325h.779c.148 0 .276.141.276.325v1.958c-.007.183-.128.325-.276.325zM18.843 30.066h-.779c-.148 0-.276-.141-.276-.325v-1.958c0-.175.12-.325.276-.325h.78c.148 0 .276.142.276.325v1.958c-.007.184-.128.325-.277.325zM21.613 30.066h-.78c-.148 0-.268-.141-.268-.325v-1.958c0-.175.12-.325.269-.325h.779c.149 0 .276.142.276.325v1.958c0 .184-.12.325-.276.325zM24.39 30.066h-.78c-.148 0-.276-.141-.276-.325v-1.958c0-.175.12-.325.276-.325h.78c.148 0 .276.142.276.325v1.958c-.007.184-.128.325-.277.325zM27.159 30.066h-.78c-.148 0-.276-.141-.276-.325v-1.958c0-.175.12-.325.277-.325h.779c.149 0 .276.142.276.325v1.958c0 .184-.12.325-.276.325zM29.936 30.066h-.78c-.148 0-.276-.141-.276-.325v-1.958c0-.175.12-.325.277-.325h.779c.148 0 .276.142.276.325v1.958c-.007.184-.128.325-.276.325zM18.843 34.634h-.779c-.148 0-.276-.142-.276-.325V32.35c0-.175.12-.325.276-.325h.78c.148 0 .276.142.276.325v1.959c-.007.183-.128.325-.277.325zM21.613 34.634h-.78c-.148 0-.268-.142-.268-.325V32.35c0-.175.12-.325.269-.325h.779c.149 0 .276.142.276.325v1.959c0 .183-.12.325-.276.325zM24.39 34.634h-.78c-.148 0-.276-.142-.276-.325V32.35c0-.175.12-.325.276-.325h.78c.148 0 .276.142.276.325v1.959c-.007.183-.128.325-.277.325zM27.159 34.634h-.78c-.148 0-.276-.142-.276-.325V32.35c0-.175.12-.325.277-.325h.779c.149 0 .276.142.276.325v1.959c0 .183-.12.325-.276.325zM29.936 34.634h-.78c-.148 0-.276-.142-.276-.325V32.35c0-.175.12-.325.277-.325h.779c.148 0 .276.142.276.325v1.959c-.007.183-.128.325-.276.325zM18.843 39.2h-.779c-.148 0-.276-.142-.276-.325v-1.958c0-.175.12-.325.276-.325h.78c.148 0 .276.142.276.325v1.958c-.007.184-.128.325-.277.325zM21.613 39.2h-.78c-.148 0-.268-.142-.268-.325v-1.958c0-.175.12-.325.269-.325h.779c.149 0 .276.142.276.325v1.958c0 .184-.12.325-.276.325zM24.39 39.2h-.78c-.148 0-.276-.142-.276-.325v-1.958c0-.175.12-.325.276-.325h.78c.148 0 .276.142.276.325v1.958c-.007.184-.128.325-.277.325zM27.159 39.2h-.78c-.148 0-.276-.142-.276-.325v-1.958c0-.175.12-.325.277-.325h.779c.149 0 .276.142.276.325v1.958c0 .184-.12.325-.276.325zM29.936 39.2h-.78c-.148 0-.276-.142-.276-.325v-1.958c0-.175.12-.325.277-.325h.779c.148 0 .276.142.276.325v1.958c-.007.184-.128.325-.276.325zM18.843 43.767h-.779c-.148 0-.276-.142-.276-.326v-1.958c0-.175.12-.325.276-.325h.78c.148 0 .276.142.276.325v1.959c-.007.175-.128.325-.277.325zM21.613 43.767h-.78c-.148 0-.268-.142-.268-.326v-1.958c0-.175.12-.325.269-.325h.779c.149 0 .276.142.276.325v1.959c0 .175-.12.325-.276.325zM24.39 43.767h-.78c-.148 0-.276-.142-.276-.326v-1.958c0-.175.12-.325.276-.325h.78c.148 0 .276.142.276.325v1.959c-.007.175-.128.325-.277.325zM27.159 43.767h-.78c-.148 0-.276-.142-.276-.326v-1.958c0-.175.12-.325.277-.325h.779c.149 0 .276.142.276.325v1.959c0 .175-.12.325-.276.325zM29.936 43.767h-.78c-.148 0-.276-.142-.276-.326v-1.958c0-.175.12-.325.277-.325h.779c.148 0 .276.142.276.325v1.959c-.007.175-.128.325-.276.325zM19.112 48v-1.95c0-.175-.12-.325-.276-.325h-.779c-.149 0-.276.141-.276.325V48h1.331zM21.889 48v-1.95c0-.175-.12-.325-.276-.325h-.78c-.148 0-.268.141-.268.325V48h1.324zM24.659 48v-1.95c0-.175-.12-.325-.276-.325h-.78c-.148 0-.276.141-.276.325V48h1.332zM27.435 48v-1.95c0-.175-.12-.325-.276-.325h-.78c-.148 0-.276.141-.276.325V48h1.332zM30.205 48v-1.95c0-.175-.12-.325-.276-.325h-.78c-.148 0-.276.141-.276.325V48h1.332z", fill: "#B8BDC5" }), jsxRuntime.jsx("path", { d: "M13.056 29.091H8.714c-.134 0-.248-.125-.248-.292v-.516c0-.159.107-.292.248-.292h4.335c.135 0 .248.125.248.292v.516c0 .167-.106.292-.24.292zM13.056 31.8H8.714c-.134 0-.248-.125-.248-.292V31c0-.159.107-.292.248-.292h4.335c.135 0 .248.125.248.292v.516c0 .159-.106.284-.24.284zM13.056 34.508H8.714c-.134 0-.248-.125-.248-.291V33.7c0-.159.107-.292.248-.292h4.335c.135 0 .248.125.248.292v.517c0 .166-.106.291-.24.291zM13.056 37.217H8.714c-.134 0-.248-.125-.248-.292v-.508c0-.159.107-.292.248-.292h4.335c.135 0 .248.125.248.292v.516c0 .159-.106.284-.24.284zM13.056 39.925H8.714c-.134 0-.248-.125-.248-.291v-.517c0-.158.107-.292.248-.292h4.335c.135 0 .248.125.248.292v.517c0 .166-.106.291-.24.291zM13.056 42.634H8.714c-.134 0-.248-.125-.248-.292v-.508c0-.159.107-.292.248-.292h4.335c.135 0 .248.125.248.292v.516c0 .159-.106.284-.24.284zM13.056 45.341H8.714c-.134 0-.248-.125-.248-.291v-.517c0-.159.107-.292.248-.292h4.335c.135 0 .248.125.248.292v.517c0 .166-.106.291-.24.291z", fill: "#fff" }), jsxRuntime.jsx("path", { d: "M41 30.708h-7.77V48H41V30.708z", fill: "#B8BDC5" }), jsxRuntime.jsx("path", { d: "M35.447 34.267h-.737c-.142 0-.255-.134-.255-.3V33.1c0-.167.113-.3.255-.3h.737c.141 0 .255.133.255.3v.867c0 .166-.114.3-.255.3zM37.487 34.267h-.737c-.142 0-.255-.134-.255-.3V33.1c0-.167.114-.3.255-.3h.737c.142 0 .255.133.255.3v.867c0 .166-.113.3-.255.3zM39.527 34.267h-.737c-.142 0-.255-.134-.255-.3V33.1c0-.167.114-.3.255-.3h.737c.142 0 .255.133.255.3v.867c0 .166-.113.3-.255.3zM35.447 36.767h-.737c-.142 0-.255-.134-.255-.3V35.6c0-.167.113-.3.255-.3h.737c.141 0 .255.133.255.3v.867c0 .166-.114.3-.255.3zM37.487 36.767h-.737c-.142 0-.255-.134-.255-.3V35.6c0-.167.114-.3.255-.3h.737c.142 0 .255.133.255.3v.867c0 .166-.113.3-.255.3zM39.527 36.767h-.737c-.142 0-.255-.134-.255-.3V35.6c0-.167.114-.3.255-.3h.737c.142 0 .255.133.255.3v.867c0 .166-.113.3-.255.3zM35.447 39.267h-.737c-.142 0-.255-.134-.255-.3V38.1c0-.167.113-.3.255-.3h.737c.141 0 .255.133.255.3v.867c0 .166-.114.3-.255.3zM37.487 39.267h-.737c-.142 0-.255-.134-.255-.3V38.1c0-.167.114-.3.255-.3h.737c.142 0 .255.133.255.3v.867c0 .166-.113.3-.255.3zM39.527 39.267h-.737c-.142 0-.255-.134-.255-.3V38.1c0-.167.114-.3.255-.3h.737c.142 0 .255.133.255.3v.867c0 .166-.113.3-.255.3zM35.447 41.767h-.737c-.142 0-.255-.134-.255-.3V40.6c0-.167.113-.3.255-.3h.737c.141 0 .255.133.255.3v.867c0 .166-.114.3-.255.3zM37.487 41.767h-.737c-.142 0-.255-.134-.255-.3V40.6c0-.167.114-.3.255-.3h.737c.142 0 .255.133.255.3v.867c0 .166-.113.3-.255.3zM39.527 41.767h-.737c-.142 0-.255-.134-.255-.3V40.6c0-.167.114-.3.255-.3h.737c.142 0 .255.133.255.3v.867c0 .166-.113.3-.255.3zM35.447 44.267h-.737c-.142 0-.255-.134-.255-.3V43.1c0-.167.113-.3.255-.3h.737c.141 0 .255.133.255.3v.867c0 .166-.114.3-.255.3zM37.487 44.267h-.737c-.142 0-.255-.134-.255-.3V43.1c0-.167.114-.3.255-.3h.737c.142 0 .255.133.255.3v.867c0 .166-.113.3-.255.3zM39.527 44.267h-.737c-.142 0-.255-.134-.255-.3V43.1c0-.167.114-.3.255-.3h.737c.142 0 .255.133.255.3v.867c0 .166-.113.3-.255.3zM35.447 46.767h-.737c-.142 0-.255-.134-.255-.3V45.6c0-.167.113-.3.255-.3h.737c.141 0 .255.133.255.3v.867c0 .166-.114.3-.255.3zM37.487 46.767h-.737c-.142 0-.255-.134-.255-.3V45.6c0-.167.114-.3.255-.3h.737c.142 0 .255.133.255.3v.867c0 .166-.113.3-.255.3zM39.527 46.767h-.737c-.142 0-.255-.134-.255-.3V45.6c0-.167.114-.3.255-.3h.737c.142 0 .255.133.255.3v.867c0 .166-.113.3-.255.3z", fill: "#fff" })] })));
+}
 
-var TableCell = function (props) {
-    var variant = props.variant, width = props.width, sx = props.sx, rest = __rest(props, ["variant", "width", "sx"]);
-    return (jsxRuntime.jsx(material.TableCell, __assign({ className: "".concat(variant === 'footer' ? 'tc-footer' : '') }, rest, { sx: __assign({ width: width }, sx) })));
-};
-
-var TableCellIconContainer = material.styled('div')(templateObject_1$2 || (templateObject_1$2 = __makeTemplateObject([""], [""])));
-var TableCellIcon = function (props) {
-    var align = props.align, rest = __rest(props, ["align"]);
-    return (jsxRuntime.jsx(TableCellIconContainer, __assign({ sx: {
-            display: 'flex',
-            alignItems: 'center',
-            justifyContent: align === 'center'
-                ? 'center'
-                : align === 'right'
-                    ? 'flex-end'
-                    : 'flex-start',
-        } }, rest, { children: props.children })));
-};
-var templateObject_1$2;
-
-var TableContainer = React__default["default"].forwardRef(function TableContainer(props, ref) {
-    return jsxRuntime.jsx(material.TableContainer, __assign({ ref: ref }, props));
-});
-
-var TableFooter = function (props) {
-    var children = props.children, rest = __rest(props, ["children"]);
-    return jsxRuntime.jsx(material.TableFooter, __assign({}, rest, { children: children }));
-};
-
-var TableHead = function (props) {
-    return jsxRuntime.jsx(material.TableHead, __assign({}, props));
-};
-
-var TableRow = React__default["default"].forwardRef(function TableRow(props, ref) {
-    return jsxRuntime.jsx(material.TableRow, __assign({ ref: ref }, props));
-});
-
-var Tabs = function (props) {
-    var isVertical = props.orientation === 'vertical' ? { maxWidth: '16.5rem' } : {};
-    return (jsxRuntime.jsx(material.Tabs, __assign({ sx: isVertical }, props, { children: props.children })));
-};
-
-var TagWrapper = styles$1.styled('div')(templateObject_1$1 || (templateObject_1$1 = __makeTemplateObject(["\n  display: inline-flex;\n  align-items: center;\n  border: 1px solid #C0D7EE;\n  background-color: #EBF2F9;\n  overflow: hidden;\n  border-radius: 2px;\n  height: 24px;\n  margin-right: 3px; \n  align-items: center;\n"], ["\n  display: inline-flex;\n  align-items: center;\n  border: 1px solid #C0D7EE;\n  background-color: #EBF2F9;\n  overflow: hidden;\n  border-radius: 2px;\n  height: 24px;\n  margin-right: 3px; \n  align-items: center;\n"])));
-var TagLabel = styles$1.styled('div')(function (_a) {
-    var theme = _a.theme;
-    return "\n  padding-left: 5px;\n  padding-right: 5px;\n  align-items: center;\n  color:".concat(theme.palette.text.primary, "; \n");
-});
-var TagStartIcon = styles$1.styled('div')(function () { return "\n  display: flex;\n  padding: 0 5px;\n  .MuiSvgIcon-root {\n    font-size: 16px;\n  }\n"; });
-var TagEndIcon = styles$1.styled('div')(function () { return "\n  display: flex;\n  .MuiSvgIcon-root {\n    font-size: 16px;\n  }\n  .MuiIconButton-root {\n    padding-left: 5px;\n    padding-right: 5px;\n  }\n  .MuiButtonBase-root{\n    color: inherit;\n  }\n"; });
-var TagDelete = styles$1.styled('div')(function () { return "\n  display: flex;\n  border-left: 1px solid #C0D7EE;\n  .MuiButtonBase-root{\n    color: inherit;\n  }\n  '& > *:last-of-type': {\n    .MuiSvgIcon-root {\n      font-size: 24px;\n    }  \n  }\n"; });
-var MuiIconButton = styles$1.styled(material.IconButton)(function (_a) {
-    var theme = _a.theme;
-    return "\n    height: 24px;\n    width: 24px;\n    border-radius: 0 ".concat(theme.shapes.tag, " ").concat(theme.shapes.tag, " 0;\n");
-});
-var MuiTypography = styles$1.styled(Typography)(function () { return "\n  line-height: 1;\n"; });
-var templateObject_1$1;
-
-var Tag = function (props) {
-    var tooltip = props.tooltip, tooltipPlacement = props.tooltipPlacement, tooltipDelete = props.tooltipDelete, tooltipDeletePlacement = props.tooltipDeletePlacement, tooltipLabelPlacement = props.tooltipLabelPlacement, tooltipLabel = props.tooltipLabel, disabled = props.disabled; props.platformWeb; var rest = __rest(props, ["tooltip", "tooltipPlacement", "tooltipDelete", "tooltipDeletePlacement", "tooltipLabelPlacement", "tooltipLabel", "disabled", "platformWeb"]);
-    var placement = tooltipPlacement !== undefined ? tooltipPlacement : 'top';
-    var placementLabel = tooltipLabelPlacement !== undefined ? tooltipLabelPlacement : 'top';
-    var placementDelete = tooltipDeletePlacement !== undefined ? tooltipDeletePlacement : 'top';
-    return (jsxRuntime.jsxs(TagWrapper, { children: [rest.startIcon ? jsxRuntime.jsx(TagStartIcon, { children: rest.startIcon }) : null, jsxRuntime.jsx(TagLabel, { children: tooltipLabel ? (jsxRuntime.jsx(material.Tooltip, __assign({ title: tooltipLabel, placement: placementLabel, TransitionProps: { timeout: 0 } }, { children: jsxRuntime.jsx(MuiTypography, __assign({ variant: "body2" }, { children: rest.label })) }))) : (jsxRuntime.jsx(MuiTypography, __assign({ variant: "body2" }, { children: rest.label }))) }), rest.endIcon ? (jsxRuntime.jsx(TagEndIcon, { children: tooltip ? (jsxRuntime.jsx(material.Tooltip, __assign({ title: tooltip, placement: placement, TransitionProps: { timeout: 0 } }, { children: jsxRuntime.jsx(MuiIconButton, __assign({ disabled: disabled, onClick: rest.onClick }, { children: rest.endIcon })) }))) : (jsxRuntime.jsx(MuiIconButton, __assign({ disabled: disabled, onClick: rest.onClick }, { children: rest.endIcon }))) })) : null, rest.onDelete ? (jsxRuntime.jsx(TagDelete, { children: tooltipDelete ? (jsxRuntime.jsx(material.Tooltip, __assign({ title: tooltipDelete, placement: placementDelete, TransitionProps: { timeout: 0 } }, { children: jsxRuntime.jsx(MuiIconButton, __assign({ onClick: rest.onDelete }, { children: rest.deleteIcon ? rest.deleteIcon : jsxRuntime.jsx(Icon, { name: SvgCross }) })) }))) : (jsxRuntime.jsx(MuiIconButton, __assign({ onClick: rest.onDelete }, { children: rest.deleteIcon ? rest.deleteIcon : jsxRuntime.jsx(Icon, { name: SvgCross }) }))) })) : null] }));
-};
-
-var TextField = function (props) {
-    var defaultProps = __rest(props, []);
-    return (jsxRuntime.jsx(material.TextField, __assign({ variant: "outlined", color: "secondary" }, defaultProps, { children: props.children })));
-};
-
-var Toolbar = function (props) {
-    return jsxRuntime.jsx(material.Toolbar, __assign({}, props));
-};
-
-var StyledToolbarButton = styles$1.styled(Button__default["default"])(function (_a) {
-    var theme = _a.theme;
-    return (__assign(__assign({}, (theme.platform.name === 'leap_desktop' && __assign(__assign({ height: 'auto', maxWidth: 70, minWidth: 'unset', margin: '0 15px', border: '1px solid transparent', backgroundColor: 'transparent', flexDirection: 'column', padding: '0 4px', whiteSpace: 'normal' }, theme.typography.body2), { lineHeight: '1rem', '&:hover': {
-            backgroundColor: '#DDE7F3',
-            borderColor: '#CADEF3',
-        }, '.MuiSvgIcon-root': {
-            width: 32,
-            height: 32,
-            marginBottom: 6,
-        }, '.MuiButton-startIcon': {
-            margin: 0,
-        } }))), (theme.platform.name === 'leap_web' && {
-        '.MuiButton-startIcon': {
-            display: 'none',
-        },
-    })));
-});
-
-var ToolbarButton = function (_a) {
-    var label = _a.label, icon = _a.icon, props = __rest(_a, ["label", "icon"]);
-    return (jsxRuntime.jsx(StyledToolbarButton, __assign({ variant: "outlined", startIcon: icon }, props, { children: label })));
-};
-
-var FullHeightGridContainer = styles$1.styled(Grid)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  height: 100%;\n  overflow: hidden;\n"], ["\n  height: 100%;\n  overflow: hidden;\n"])));
-var FullHeightGridItem = styles$1.styled(Grid)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  height: 100%;\n"], ["\n  height: 100%;\n"])));
-var templateObject_1, templateObject_2;
-
-var Left = function () { return null; };
-var Right = function () { return null; };
-var TwoColumnLayout = function (_a) {
-    var children = _a.children, props = __rest(_a, ["children"]);
-    var left = children.find(function (el) { return el.type === Left; });
-    var right = children.find(function (el) { return el.type === Right; });
-    return (jsxRuntime.jsxs(FullHeightGridContainer, __assign({ container: true, direction: "row", alignItems: "stretch" }, props, { children: [jsxRuntime.jsx(FullHeightGridItem, __assign({ item: true, xs: 12, sm: 6, container: true, direction: "column", display: "block" }, { children: left && left.props.children })), jsxRuntime.jsx(FullHeightGridItem, __assign({ item: true, xs: 12, sm: 6, container: true, direction: "column" }, { children: right && right.props.children }))] })));
-};
-TwoColumnLayout.Left = Left;
-TwoColumnLayout.Right = Right;
-
-function AvatarBusinessIcon(props) {
-    return (jsxRuntime.jsxs(SvgIcon__default["default"], __assign({}, props, { viewBox: "0 0 48 48" }, { children: [jsxRuntime.jsx("path", { d: "M17.407 12.025h-3.472v-1.869c0-.227.158-.406.344-.406h2.777c.193 0 .344.187.344.406v1.869h.007zm17.215 0h-5.81v-1.869c0-.227.159-.406.344-.406h5.115c.193 0 .344.187.344.406v1.869h.007z", fill: "#B8BDC5" }), jsxRuntime.jsx("path", { d: "M32.622 13.187H15.749a2 2 0 00-2 2V46.75a2 2 0 002 2h16.873a2 2 0 002-2V15.187a2 2 0 00-2-2z", fill: "#fff" }), jsxRuntime.jsx("path", { d: "M34.622 13.187H13.749v.877h20.873v-.877z", fill: "#9DA4AF" }), jsxRuntime.jsx("path", { d: "M35.096 13.187h-21.82c-.31 0-.558-.293-.558-.658v-1.382c0-.365.248-.658.557-.658h21.821c.31 0 .557.293.557.658v1.373c0 .366-.247.667-.557.667zM20.02 20.419h-2.73c-.254 0-.46-.244-.46-.545v-3.217c0-.3.206-.545.46-.545h2.73c.254 0 .46.244.46.545v3.225c0 .3-.206.537-.46.537zm5.534 0h-2.73c-.254 0-.46-.244-.46-.545v-3.217c0-.3.206-.545.46-.545h2.73c.254 0 .46.244.46.545v3.225c-.006.3-.206.537-.46.537zm5.527 0h-2.73c-.254 0-.46-.244-.46-.545v-3.217c0-.3.206-.545.46-.545h2.73c.255 0 .46.244.46.545v3.225c0 .3-.206.537-.46.537zM20.02 26.78h-2.73c-.254 0-.46-.244-.46-.544V23.01c0-.3.206-.544.46-.544h2.73c.254 0 .46.244.46.544v3.226c0 .3-.206.544-.46.544zm5.534 0h-2.73c-.254 0-.46-.244-.46-.544V23.01c0-.3.206-.544.46-.544h2.73c.254 0 .46.244.46.544v3.226c-.006.3-.206.544-.46.544zm5.527 0h-2.73c-.254 0-.46-.244-.46-.544V23.01c0-.3.206-.544.46-.544h2.73c.255 0 .46.244.46.544v3.226c0 .3-.206.544-.46.544zM20.02 33.142h-2.73c-.254 0-.46-.244-.46-.545v-3.226c0-.3.206-.544.46-.544h2.73c.254 0 .46.244.46.544v3.226c0 .3-.206.544-.46.544zm5.534 0h-2.73c-.254 0-.46-.244-.46-.545v-3.226c0-.3.206-.544.46-.544h2.73c.254 0 .46.244.46.544v3.226c-.006.3-.206.544-.46.544zm5.527 0h-2.73c-.254 0-.46-.244-.46-.545v-3.226c0-.3.206-.544.46-.544h2.73c.255 0 .46.244.46.544v3.226c0 .3-.206.544-.46.544zM20.02 39.496h-2.73c-.254 0-.46-.244-.46-.544v-3.226c0-.3.206-.544.46-.544h2.73c.254 0 .46.243.46.544v3.226c0 .3-.206.544-.46.544zm5.534 0h-2.73c-.254 0-.46-.244-.46-.544v-3.226c0-.3.206-.544.46-.544h2.73c.254 0 .46.243.46.544v3.226c-.006.3-.206.544-.46.544zm5.527 0h-2.73c-.254 0-.46-.244-.46-.544v-3.226c0-.3.206-.544.46-.544h2.73c.255 0 .46.243.46.544v3.226c0 .3-.206.544-.46.544zM20.02 45.857h-2.73c-.254 0-.46-.243-.46-.544v-3.226c0-.3.206-.544.46-.544h2.73c.254 0 .46.244.46.544v3.226c0 .3-.206.544-.46.544z", fill: "#B8BDC5" }), jsxRuntime.jsx("path", { d: "M25.554 45.857h-2.73c-.254 0-.46-.243-.46-.544v-3.226c0-.3.206-.544.46-.544h2.73c.254 0 .46.244.46.544v3.226c-.006.3-.206.544-.46.544z", fill: "#fff" }), jsxRuntime.jsx("path", { d: "M31.081 45.857h-2.73c-.254 0-.46-.243-.46-.544v-3.226c0-.3.206-.544.46-.544h2.73c.255 0 .46.244.46.544v3.226c0 .3-.206.544-.46.544zm-5.369-5.102h-3.046c-.281 0-.508.268-.508.601v7.394h4.07v-7.386c-.007-.333-.234-.61-.516-.61z", fill: "#B8BDC5" }), jsxRuntime.jsx("path", { d: "M27.513 47.808h-6.648v.942h6.648v-.942z", fill: "#9DA4AF" })] })));
-}
-
-function AvatarCompanyIcon(props) {
-    return (jsxRuntime.jsxs(SvgIcon__default["default"], __assign({}, props, { viewBox: "0 0 48 48" }, { children: [jsxRuntime.jsx("path", { d: "M39.782 40.45h-5.334V29.075c0-.275.191-.5.425-.5h4.483c.234 0 .425.225.425.5V40.45zM9.125 26.075H7v-6.008c0-.192.135-.35.298-.35h1.53c.162 0 .297.158.297.35v6.008z", fill: "#B8BDC5" }), jsxRuntime.jsx("path", { d: "M11.073 46.016H7V23.241h3.386c.382 0 .687.367.687.808v21.967z", fill: "#B8BDC5" }), jsxRuntime.jsx("path", { d: "M14.77 25.208H7v22.775h7.77V25.208zM23.653 9.9l-6.432 4.367c-.212.142-.347.408-.347.7v19.516c0 .45.305.809.687.809h12.863c.383 0 .688-.358.688-.809V14.968c0-.292-.135-.559-.348-.7L24.333 9.9a.597.597 0 00-.68 0z", fill: "#B8BDC5" }), jsxRuntime.jsx("path", { d: "M23.653 15.008l-8.543 5.8c-.212.142-.347.408-.347.7V48h18.46V21.508c0-.292-.135-.558-.348-.7l-8.528-5.8a.592.592 0 00-.694 0z", fill: "#fff" }), jsxRuntime.jsx("path", { d: "M25.063 14.35h-2.125v-6c0-.192.134-.35.297-.35h1.53c.163 0 .297.158.297.35v6zM38.18 32.425h-2.124v-6.009c0-.191.134-.35.297-.35h1.53c.163 0 .298.159.298.35v6.009zM18.843 25.5h-.779c-.148 0-.276-.142-.276-.325v-1.958c0-.175.12-.325.276-.325h.78c.148 0 .276.141.276.325v1.958c-.007.183-.128.325-.277.325zM21.613 25.5h-.78c-.148 0-.268-.142-.268-.325v-1.958c0-.175.12-.325.269-.325h.779c.149 0 .276.141.276.325v1.958c0 .183-.12.325-.276.325zM24.39 25.5h-.78c-.148 0-.276-.142-.276-.325v-1.958c0-.175.12-.325.276-.325h.78c.148 0 .276.141.276.325v1.958c-.007.183-.128.325-.277.325zM27.159 25.5h-.78c-.148 0-.276-.142-.276-.325v-1.958c0-.175.12-.325.277-.325h.779c.149 0 .276.141.276.325v1.958c0 .183-.12.325-.276.325zM29.936 25.5h-.78c-.148 0-.276-.142-.276-.325v-1.958c0-.175.12-.325.277-.325h.779c.148 0 .276.141.276.325v1.958c-.007.183-.128.325-.276.325zM18.843 30.066h-.779c-.148 0-.276-.141-.276-.325v-1.958c0-.175.12-.325.276-.325h.78c.148 0 .276.142.276.325v1.958c-.007.184-.128.325-.277.325zM21.613 30.066h-.78c-.148 0-.268-.141-.268-.325v-1.958c0-.175.12-.325.269-.325h.779c.149 0 .276.142.276.325v1.958c0 .184-.12.325-.276.325zM24.39 30.066h-.78c-.148 0-.276-.141-.276-.325v-1.958c0-.175.12-.325.276-.325h.78c.148 0 .276.142.276.325v1.958c-.007.184-.128.325-.277.325zM27.159 30.066h-.78c-.148 0-.276-.141-.276-.325v-1.958c0-.175.12-.325.277-.325h.779c.149 0 .276.142.276.325v1.958c0 .184-.12.325-.276.325zM29.936 30.066h-.78c-.148 0-.276-.141-.276-.325v-1.958c0-.175.12-.325.277-.325h.779c.148 0 .276.142.276.325v1.958c-.007.184-.128.325-.276.325zM18.843 34.634h-.779c-.148 0-.276-.142-.276-.325V32.35c0-.175.12-.325.276-.325h.78c.148 0 .276.142.276.325v1.959c-.007.183-.128.325-.277.325zM21.613 34.634h-.78c-.148 0-.268-.142-.268-.325V32.35c0-.175.12-.325.269-.325h.779c.149 0 .276.142.276.325v1.959c0 .183-.12.325-.276.325zM24.39 34.634h-.78c-.148 0-.276-.142-.276-.325V32.35c0-.175.12-.325.276-.325h.78c.148 0 .276.142.276.325v1.959c-.007.183-.128.325-.277.325zM27.159 34.634h-.78c-.148 0-.276-.142-.276-.325V32.35c0-.175.12-.325.277-.325h.779c.149 0 .276.142.276.325v1.959c0 .183-.12.325-.276.325zM29.936 34.634h-.78c-.148 0-.276-.142-.276-.325V32.35c0-.175.12-.325.277-.325h.779c.148 0 .276.142.276.325v1.959c-.007.183-.128.325-.276.325zM18.843 39.2h-.779c-.148 0-.276-.142-.276-.325v-1.958c0-.175.12-.325.276-.325h.78c.148 0 .276.142.276.325v1.958c-.007.184-.128.325-.277.325zM21.613 39.2h-.78c-.148 0-.268-.142-.268-.325v-1.958c0-.175.12-.325.269-.325h.779c.149 0 .276.142.276.325v1.958c0 .184-.12.325-.276.325zM24.39 39.2h-.78c-.148 0-.276-.142-.276-.325v-1.958c0-.175.12-.325.276-.325h.78c.148 0 .276.142.276.325v1.958c-.007.184-.128.325-.277.325zM27.159 39.2h-.78c-.148 0-.276-.142-.276-.325v-1.958c0-.175.12-.325.277-.325h.779c.149 0 .276.142.276.325v1.958c0 .184-.12.325-.276.325zM29.936 39.2h-.78c-.148 0-.276-.142-.276-.325v-1.958c0-.175.12-.325.277-.325h.779c.148 0 .276.142.276.325v1.958c-.007.184-.128.325-.276.325zM18.843 43.767h-.779c-.148 0-.276-.142-.276-.326v-1.958c0-.175.12-.325.276-.325h.78c.148 0 .276.142.276.325v1.959c-.007.175-.128.325-.277.325zM21.613 43.767h-.78c-.148 0-.268-.142-.268-.326v-1.958c0-.175.12-.325.269-.325h.779c.149 0 .276.142.276.325v1.959c0 .175-.12.325-.276.325zM24.39 43.767h-.78c-.148 0-.276-.142-.276-.326v-1.958c0-.175.12-.325.276-.325h.78c.148 0 .276.142.276.325v1.959c-.007.175-.128.325-.277.325zM27.159 43.767h-.78c-.148 0-.276-.142-.276-.326v-1.958c0-.175.12-.325.277-.325h.779c.149 0 .276.142.276.325v1.959c0 .175-.12.325-.276.325zM29.936 43.767h-.78c-.148 0-.276-.142-.276-.326v-1.958c0-.175.12-.325.277-.325h.779c.148 0 .276.142.276.325v1.959c-.007.175-.128.325-.276.325zM19.112 48v-1.95c0-.175-.12-.325-.276-.325h-.779c-.149 0-.276.141-.276.325V48h1.331zM21.889 48v-1.95c0-.175-.12-.325-.276-.325h-.78c-.148 0-.268.141-.268.325V48h1.324zM24.659 48v-1.95c0-.175-.12-.325-.276-.325h-.78c-.148 0-.276.141-.276.325V48h1.332zM27.435 48v-1.95c0-.175-.12-.325-.276-.325h-.78c-.148 0-.276.141-.276.325V48h1.332zM30.205 48v-1.95c0-.175-.12-.325-.276-.325h-.78c-.148 0-.276.141-.276.325V48h1.332z", fill: "#B8BDC5" }), jsxRuntime.jsx("path", { d: "M13.056 29.091H8.714c-.134 0-.248-.125-.248-.292v-.516c0-.159.107-.292.248-.292h4.335c.135 0 .248.125.248.292v.516c0 .167-.106.292-.24.292zM13.056 31.8H8.714c-.134 0-.248-.125-.248-.292V31c0-.159.107-.292.248-.292h4.335c.135 0 .248.125.248.292v.516c0 .159-.106.284-.24.284zM13.056 34.508H8.714c-.134 0-.248-.125-.248-.291V33.7c0-.159.107-.292.248-.292h4.335c.135 0 .248.125.248.292v.517c0 .166-.106.291-.24.291zM13.056 37.217H8.714c-.134 0-.248-.125-.248-.292v-.508c0-.159.107-.292.248-.292h4.335c.135 0 .248.125.248.292v.516c0 .159-.106.284-.24.284zM13.056 39.925H8.714c-.134 0-.248-.125-.248-.291v-.517c0-.158.107-.292.248-.292h4.335c.135 0 .248.125.248.292v.517c0 .166-.106.291-.24.291zM13.056 42.634H8.714c-.134 0-.248-.125-.248-.292v-.508c0-.159.107-.292.248-.292h4.335c.135 0 .248.125.248.292v.516c0 .159-.106.284-.24.284zM13.056 45.341H8.714c-.134 0-.248-.125-.248-.291v-.517c0-.159.107-.292.248-.292h4.335c.135 0 .248.125.248.292v.517c0 .166-.106.291-.24.291z", fill: "#fff" }), jsxRuntime.jsx("path", { d: "M41 30.708h-7.77V48H41V30.708z", fill: "#B8BDC5" }), jsxRuntime.jsx("path", { d: "M35.447 34.267h-.737c-.142 0-.255-.134-.255-.3V33.1c0-.167.113-.3.255-.3h.737c.141 0 .255.133.255.3v.867c0 .166-.114.3-.255.3zM37.487 34.267h-.737c-.142 0-.255-.134-.255-.3V33.1c0-.167.114-.3.255-.3h.737c.142 0 .255.133.255.3v.867c0 .166-.113.3-.255.3zM39.527 34.267h-.737c-.142 0-.255-.134-.255-.3V33.1c0-.167.114-.3.255-.3h.737c.142 0 .255.133.255.3v.867c0 .166-.113.3-.255.3zM35.447 36.767h-.737c-.142 0-.255-.134-.255-.3V35.6c0-.167.113-.3.255-.3h.737c.141 0 .255.133.255.3v.867c0 .166-.114.3-.255.3zM37.487 36.767h-.737c-.142 0-.255-.134-.255-.3V35.6c0-.167.114-.3.255-.3h.737c.142 0 .255.133.255.3v.867c0 .166-.113.3-.255.3zM39.527 36.767h-.737c-.142 0-.255-.134-.255-.3V35.6c0-.167.114-.3.255-.3h.737c.142 0 .255.133.255.3v.867c0 .166-.113.3-.255.3zM35.447 39.267h-.737c-.142 0-.255-.134-.255-.3V38.1c0-.167.113-.3.255-.3h.737c.141 0 .255.133.255.3v.867c0 .166-.114.3-.255.3zM37.487 39.267h-.737c-.142 0-.255-.134-.255-.3V38.1c0-.167.114-.3.255-.3h.737c.142 0 .255.133.255.3v.867c0 .166-.113.3-.255.3zM39.527 39.267h-.737c-.142 0-.255-.134-.255-.3V38.1c0-.167.114-.3.255-.3h.737c.142 0 .255.133.255.3v.867c0 .166-.113.3-.255.3zM35.447 41.767h-.737c-.142 0-.255-.134-.255-.3V40.6c0-.167.113-.3.255-.3h.737c.141 0 .255.133.255.3v.867c0 .166-.114.3-.255.3zM37.487 41.767h-.737c-.142 0-.255-.134-.255-.3V40.6c0-.167.114-.3.255-.3h.737c.142 0 .255.133.255.3v.867c0 .166-.113.3-.255.3zM39.527 41.767h-.737c-.142 0-.255-.134-.255-.3V40.6c0-.167.114-.3.255-.3h.737c.142 0 .255.133.255.3v.867c0 .166-.113.3-.255.3zM35.447 44.267h-.737c-.142 0-.255-.134-.255-.3V43.1c0-.167.113-.3.255-.3h.737c.141 0 .255.133.255.3v.867c0 .166-.114.3-.255.3zM37.487 44.267h-.737c-.142 0-.255-.134-.255-.3V43.1c0-.167.114-.3.255-.3h.737c.142 0 .255.133.255.3v.867c0 .166-.113.3-.255.3zM39.527 44.267h-.737c-.142 0-.255-.134-.255-.3V43.1c0-.167.114-.3.255-.3h.737c.142 0 .255.133.255.3v.867c0 .166-.113.3-.255.3zM35.447 46.767h-.737c-.142 0-.255-.134-.255-.3V45.6c0-.167.113-.3.255-.3h.737c.141 0 .255.133.255.3v.867c0 .166-.114.3-.255.3zM37.487 46.767h-.737c-.142 0-.255-.134-.255-.3V45.6c0-.167.114-.3.255-.3h.737c.142 0 .255.133.255.3v.867c0 .166-.113.3-.255.3zM39.527 46.767h-.737c-.142 0-.255-.134-.255-.3V45.6c0-.167.114-.3.255-.3h.737c.142 0 .255.133.255.3v.867c0 .166-.113.3-.255.3z", fill: "#fff" })] })));
-}
-
-function AvatarGovernmentIcon(props) {
-    return (jsxRuntime.jsxs(SvgIcon__default["default"], __assign({}, props, { viewBox: "0 0 48 48" }, { children: [jsxRuntime.jsx("path", { d: "M45.496 48H2.495C2.22 48 2 47.82 2 47.595V32.032C2 30.909 3.109 30 4.484 30h39.032c1.366 0 2.484.907 2.484 2.032v15.57c-.01.218-.23.398-.504.398z", fill: "#fff" }), jsxRuntime.jsx("path", { d: "M23.13 18.877l-9.517 5.498c-.54.315-.87.885-.87 1.515v11.985h22.515V25.882c0-.622-.33-1.2-.87-1.515l-9.518-5.49a1.756 1.756 0 00-1.74 0z", fill: "#fff" }), jsxRuntime.jsx("path", { d: "M24.683 28.688h-1.365a.656.656 0 01-.66-.66v-1.365c0-.368.292-.66.66-.66h1.365c.367 0 .66.292.66.66v1.365c0 .367-.293.66-.66.66zM12.758 40.342h-1.373a.656.656 0 01-.66-.66v-1.365c0-.367.293-.66.66-.66h1.365c.368 0 .66.293.66.66v1.365a.65.65 0 01-.652.66zM36.615 40.342H35.25a.656.656 0 01-.66-.66v-1.365c0-.367.292-.66.66-.66h1.365c.367 0 .66.293.66.66v1.365c0 .368-.3.66-.66.66zM28.733 48h-9.465v-7.545a4.732 4.732 0 119.465 0V48z", fill: "#B8BDC5" }), jsxRuntime.jsx("path", { d: "M24.952 21h-1.905v-8.047a.954.954 0 011.905 0V21z", fill: "#fff" }), jsxRuntime.jsx("path", { opacity: ".3", d: "M30.533 17.715h-5.58v-4.68h5.58a.97.97 0 01.967.968v2.76a.962.962 0 01-.967.952z", fill: "#fff" })] })));
-}
+function AvatarGovernmentIcon(props) {
+    return (jsxRuntime.jsxs(SvgIcon__default["default"], __assign({}, props, { viewBox: "0 0 48 48" }, { children: [jsxRuntime.jsx("path", { d: "M45.496 48H2.495C2.22 48 2 47.82 2 47.595V32.032C2 30.909 3.109 30 4.484 30h39.032c1.366 0 2.484.907 2.484 2.032v15.57c-.01.218-.23.398-.504.398z", fill: "#fff" }), jsxRuntime.jsx("path", { d: "M23.13 18.877l-9.517 5.498c-.54.315-.87.885-.87 1.515v11.985h22.515V25.882c0-.622-.33-1.2-.87-1.515l-9.518-5.49a1.756 1.756 0 00-1.74 0z", fill: "#fff" }), jsxRuntime.jsx("path", { d: "M24.683 28.688h-1.365a.656.656 0 01-.66-.66v-1.365c0-.368.292-.66.66-.66h1.365c.367 0 .66.292.66.66v1.365c0 .367-.293.66-.66.66zM12.758 40.342h-1.373a.656.656 0 01-.66-.66v-1.365c0-.367.293-.66.66-.66h1.365c.368 0 .66.293.66.66v1.365a.65.65 0 01-.652.66zM36.615 40.342H35.25a.656.656 0 01-.66-.66v-1.365c0-.367.292-.66.66-.66h1.365c.367 0 .66.293.66.66v1.365c0 .368-.3.66-.66.66zM28.733 48h-9.465v-7.545a4.732 4.732 0 119.465 0V48z", fill: "#B8BDC5" }), jsxRuntime.jsx("path", { d: "M24.952 21h-1.905v-8.047a.954.954 0 011.905 0V21z", fill: "#fff" }), jsxRuntime.jsx("path", { opacity: ".3", d: "M30.533 17.715h-5.58v-4.68h5.58a.97.97 0 01.967.968v2.76a.962.962 0 01-.967.952z", fill: "#fff" })] })));
+}
 
 function AvatarPeopleIcon(props) {
     return (jsxRuntime.jsxs(SvgIcon__default["default"], __assign({}, props, { viewBox: "0 0 48 48" }, { children: [jsxRuntime.jsx("path", { d: "M17.838 21.94v-1.563a3.49 3.49 0 10-6.981 0v1.562a3.05 3.05 0 001.53 2.65c1.213.7 2.707.7 3.92 0a3.05 3.05 0 001.53-2.65z", fill: "#B8BDC5" }), jsxRuntime.jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M21.894 32.57a1.677 1.677 0 01-.806 1.713 1.683 1.683 0 01-.842.227c.293 0 .582-.08.835-.227.6-.35.913-1.032.806-1.713a7.643 7.643 0 00-5.456-6.156 11.165 11.165 0 00-3.55 7.287 64.91 64.91 0 004.217.569 61.519 61.519 0 01-5.223-.744A3.516 3.516 0 019 30.07c0-1.294.7-2.506 1.85-3.106a7.642 7.642 0 0111.044 5.606z", fill: "#B8BDC5" }), jsxRuntime.jsx("path", { d: "M37.144 21.94v-1.563a3.488 3.488 0 00-5.238-3.025 3.488 3.488 0 00-1.743 3.025v1.562a3.05 3.05 0 001.53 2.65c1.213.7 2.707.7 3.92 0a3.05 3.05 0 001.53-2.65z", fill: "#B8BDC5" }), jsxRuntime.jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M26.227 33.153zm1.98 1.337a2.024 2.024 0 01-.007 0 63.216 63.216 0 00.006 0zm1.108-.077c2.37-.182 4.65-.48 6.798-.88A3.523 3.523 0 0039 30.071c0-1.294-.7-2.507-1.85-3.1a7.552 7.552 0 00-3.493-.844c-.724 0-1.424.1-2.087.289a11.144 11.144 0 013.543 7.286c-1.853.312-3.791.556-5.798.711z", fill: "#B8BDC5" }), jsxRuntime.jsx("path", { d: "M28.412 19.677v-1.975a4.433 4.433 0 00-2.206-3.825 4.416 4.416 0 00-4.412 0 4.417 4.417 0 00-2.207 3.825v1.975c0 1.381.738 2.662 1.938 3.35a4.946 4.946 0 004.956 0 3.861 3.861 0 001.931-3.35zM24 24.964c-5.106 0-9.269 3.962-9.619 8.975 3.025.444 6.257.681 9.62.681 3.362 0 6.593-.237 9.618-.675-.35-5.012-4.513-8.981-9.619-8.981z", fill: "#fff" })] })));
@@ -17196,6 +16998,353 @@ function NewEntryRibbonIcons() {
     return (jsxRuntime.jsxs("svg", __assign({ width: "32", height: "40", viewBox: "0 0 32 40", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: [jsxRuntime.jsx("rect", { width: "32", height: "40", transform: "translate(0.5 0.5)" }), jsxRuntime.jsx("path", { d: "M29 17.5V12.5C29 10.906 27.593 10 26 10H7C5.407 10 4 11.406 4 13V18C4 19.594 5.907 21 7.5 21H17.5", stroke: "#1E365E", strokeLinecap: "round", strokeLinejoin: "round" }), jsxRuntime.jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M31 25C31 28.313 28.313 31 25 31C21.686 31 19 28.313 19 25C19 21.686 21.686 19 25 19C28.313 19 31 21.686 31 25V25Z", stroke: "#3FAF2A", strokeLinecap: "round", strokeLinejoin: "round" }), jsxRuntime.jsx("path", { d: "M22 25H28", stroke: "#3FAF2A", strokeLinecap: "round", strokeLinejoin: "round" }), jsxRuntime.jsx("path", { d: "M25 22V28", stroke: "#3FAF2A", strokeLinecap: "round", strokeLinejoin: "round" }), jsxRuntime.jsx("path", { d: "M12 10.5V20", stroke: "#1E365E", strokeLinecap: "square", strokeLinejoin: "round" }), jsxRuntime.jsx("path", { d: "M21 10.5V16.5", stroke: "#1E365E", strokeLinecap: "round", strokeLinejoin: "round" })] })));
 }
 
+var RibbonButtonGroup = React.forwardRef(function RibbonButtonGroup(props, ref) {
+    var icon = props.icon, label = props.label, isWrapped = props.isWrapped, onToggle = props.onToggle, onClick = props.onClick;
+    return (jsxRuntime.jsxs(RibbonButtonGroupStyled, __assign({ variant: "outlined", disableRipple: true, ref: ref }, props, { children: [jsxRuntime.jsx(RibbonButtonStyled, { variant: "outlined", icon: icon, label: label, isWrapped: isWrapped, onClick: function (event) {
+                    event.stopPropagation();
+                    onClick && onClick();
+                } }), jsxRuntime.jsx(RibbonCaratWrapperStyled, __assign({ className: "carat", onClick: function (event) {
+                    event.stopPropagation();
+                    onToggle && onToggle();
+                } }, { children: jsxRuntime.jsx(CaratIcon, {}) }))] })));
+});
+
+var RadioGroup = function (props) {
+    var label = props.label, rest = __rest(props, ["label"]);
+    return (jsxRuntime.jsxs(material.FormControl, __assign({ component: "fieldset" }, { children: [label ? jsxRuntime.jsx(material.FormLabel, { children: label }) : '', jsxRuntime.jsx(material.RadioGroup, __assign({ "aria-label": label }, rest, { children: props.children }))] })));
+};
+
+var SelectStyled = styles$1.styled(material.Select)(function (_a) {
+    var theme = _a.theme;
+    return ({
+        borderRadius: theme.shapes.card,
+        height: 40,
+        select: {
+            padding: '0 16px',
+            height: 40,
+            lineHeight: '40px',
+            display: 'flex',
+            alignItems: 'center',
+            '& .MuiTypography-root': {
+                fontWeight: 'inherit',
+            },
+            '&.MuiInputBase-input, &.MuiOutlinedInput-input': {
+                paddingRight: '44px',
+                paddingTop: 0,
+            },
+            '&.MuiInputBase-input.MuiFilledInput-input': {},
+            '&.MuiInputBase-input': {
+                '&.MuiFilledInput-input': {
+                    '&:focus': {
+                        backgroundColor: 'transparent',
+                    },
+                },
+            },
+        },
+        '& .MuiFilledInput-input': {
+            paddingTop: '8px',
+            '&:focus': {
+                backgroundColor: 'transparent',
+            },
+        },
+        legend: {
+            display: 'none',
+        },
+    });
+});
+
+var Select = function (props) {
+    return jsxRuntime.jsx(SelectStyled, __assign({ IconComponent: SvgChevronDownLg }, props));
+};
+
+var SidebarWrapper = styles$1.styled(Box)(templateObject_1$3 || (templateObject_1$3 = __makeTemplateObject(["\n  height: 100%;\n  overflow: hidden;\n"], ["\n  height: 100%;\n  overflow: hidden;\n"])));
+var SidebarMain = styles$1.styled(Box)(templateObject_2$1 || (templateObject_2$1 = __makeTemplateObject(["\n  flex: auto;\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n"], ["\n  flex: auto;\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n"])));
+var SidebarSide = styles$1.styled(Box)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n"], ["\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n"])));
+var templateObject_1$3, templateObject_2$1, templateObject_3;
+
+var Sidebar = function () { return null; };
+var Main = function () { return null; };
+var SidebarLayout = function (_a) {
+    var children = _a.children, _b = _a.sidebarWidth, sidebarWidth = _b === void 0 ? 260 : _b, _c = _a.sidebarBgColor, sidebarBgColor = _c === void 0 ? '#f3f3f3' : _c;
+    var sidebar = children.find(function (el) { return el.type === Sidebar; });
+    var main = children.find(function (el) { return el.type === Main; });
+    return (jsxRuntime.jsxs(SidebarWrapper, __assign({ display: "flex" }, { children: [jsxRuntime.jsx(SidebarSide, __assign({ bgcolor: sidebarBgColor, width: sidebarWidth }, { children: sidebar && sidebar.props.children })), jsxRuntime.jsx(SidebarMain, { children: main && main.props.children })] })));
+};
+SidebarLayout.Sidebar = Sidebar;
+SidebarLayout.Main = Main;
+
+var StepsContainer = styles$1.styled('div')(function (_a) {
+    var theme = _a.theme;
+    return ({
+        height: 4,
+        width: '100%',
+        borderRadius: theme.shape.borderRadius,
+        backgroundColor: theme.palette.background.default,
+        display: 'flex',
+    });
+});
+var StepBar = styles$1.styled('div')(function (_a) {
+    var theme = _a.theme;
+    return ({
+        height: 4,
+        width: '100%',
+        '&:first-of-type': {
+            borderRadius: theme.shape.borderRadius,
+            borderBottomRightRadius: 0,
+            borderTopRightRadius: 0,
+        },
+        '&:last-of-type': {
+            borderRadius: theme.shape.borderRadius,
+            borderBottomLeftRadius: 0,
+            borderTopLeftRadius: 0,
+        },
+        '&.active': {
+            backgroundColor: theme.palette.text.primary,
+            borderRadius: theme.shape.borderRadius,
+            '&:not(:first-of-type)': {
+                borderBottomLeftRadius: 0,
+                borderTopLeftRadius: 0,
+            },
+        },
+        '&.completed': {
+            backgroundColor: theme.palette.text.secondary,
+        },
+    });
+});
+var LabelsContainer = styles$1.styled('div')(function () { return ({
+    marginTop: 8,
+    display: 'flex',
+}); });
+var StepLabel = styles$1.styled(Typography)(function (_a) {
+    var theme = _a.theme;
+    return ({
+        color: theme.palette.text.disabled,
+        '&.active': {
+            color: theme.palette.text.primary,
+        },
+        '&.completed': {
+            color: theme.palette.text.secondary,
+        },
+    });
+});
+
+var StepNavigation = function (props) {
+    var ref = props.ref, steps = props.steps, activeStep = props.activeStep;
+    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(StepsContainer, __assign({ ref: ref }, { children: steps === null || steps === void 0 ? void 0 : steps.map(function (_a, index) {
+                    var label = _a.label;
+                    return (jsxRuntime.jsx(StepBar, { className: clsx(activeStep === index ? 'active' : '', activeStep > index ? 'completed' : '') }, label));
+                }) })), jsxRuntime.jsx(LabelsContainer, { children: steps === null || steps === void 0 ? void 0 : steps.map(function (_a, index) {
+                    var label = _a.label;
+                    return (jsxRuntime.jsx(StepLabel, __assign({ className: clsx(activeStep === index ? 'active' : '', activeStep > index ? 'completed' : ''), variant: 'subtitle2', width: 100 / steps.length + '%' }, { children: label }), label));
+                }) })] }));
+};
+
+var Switch = function (props) {
+    return jsxRuntime.jsx(material.Switch, __assign({ color: "default" }, props));
+};
+
+var Tab = function (props) {
+    return jsxRuntime.jsx(material.Tab, __assign({}, props, { children: props.children }));
+};
+
+var StyledListItemButton = styles$1.styled(ListItemButton__default["default"])({
+    backgroundColor: 'transparent',
+    textTransform: 'none',
+    padding: '8px 16px',
+    alignItems: 'flex-start',
+    position: 'relative',
+    zIndex: 0,
+    lineHeight: '1.25rem',
+    '&:hover .hide-on-hover': {
+        opacity: 0,
+    },
+    '&:hover .show-on-hover': {
+        opacity: 1,
+    },
+    '&:hover': {
+        backgroundColor: 'transparent',
+    },
+    '& > *:nth-child(n+2)': {
+        marginLeft: 8,
+    },
+    '& .MuiListItemAvatar-root': {
+        minWidth: 20,
+        marginRight: 0,
+        marginLeft: 0,
+    },
+    '& .MuiListItemText-root': {
+        marginTop: 0,
+        marginBottom: 0,
+        lineHeight: '1.25rem',
+    },
+    '& .MuiTypography-root': {
+        lineHeight: '1.25rem',
+    },
+    '& .MuiTypography-root.MuiListItemText-secondary': {
+        lineHeight: '1rem',
+    },
+});
+var ShowOnHover = styles$1.styled('div')({
+    opacity: 0,
+    position: 'absolute',
+    right: 16,
+    zIndex: 99,
+});
+var HideOnHover = styles$1.styled('div')({
+    opacity: 1,
+    position: 'absolute',
+    right: 16,
+});
+var HoverContentWrapper = styles$1.styled('div', {
+    shouldForwardProp: function (prop) { return prop !== 'width'; },
+})(function (_a) {
+    var width = _a.width;
+    return ({
+        width: width,
+    });
+});
+
+var TabListItem = function (_a) {
+    var children = _a.children, hideOnHover = _a.hideOnHover, showOnHover = _a.showOnHover, props = __rest(_a, ["children", "hideOnHover", "showOnHover"]);
+    /**
+     * As child divs are absolute positioning, the parent container doesn't have a width.
+     * It can lead to sibling list text truncate incorrectly and text overlapping.
+     * The following code uses refs to get the widths of the contents,
+     * and set the bigger one as parent's width.
+     */
+    var contentRef1 = React.useRef(null);
+    var contentRef2 = React.useRef(null);
+    var _b = React.useState(24), width = _b[0], setWidth = _b[1];
+    React.useEffect(function () {
+        if (!contentRef1.current || !contentRef2.current)
+            return;
+        var width1 = contentRef1.current.clientWidth;
+        var width2 = contentRef2.current.clientWidth;
+        setWidth(width1 > width2 ? width1 : width2);
+    }, [contentRef1, contentRef2]);
+    return (jsxRuntime.jsx(StyledListItemButton, __assign({ disableGutters: true }, props, { children: jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [children, jsxRuntime.jsxs(HoverContentWrapper, __assign({ width: width }, { children: [jsxRuntime.jsx(HideOnHover, __assign({ ref: contentRef1, className: "hide-on-hover" }, { children: hideOnHover })), jsxRuntime.jsx(ShowOnHover, __assign({ ref: contentRef2, className: "show-on-hover" }, { children: showOnHover }))] }))] }) })));
+};
+
+var Table = function (props) {
+    return jsxRuntime.jsx(material.Table, __assign({}, props));
+};
+
+var TableBody = function (props) {
+    return jsxRuntime.jsx(material.TableBody, __assign({}, props));
+};
+
+var TableCell = function (props) {
+    var variant = props.variant, width = props.width, sx = props.sx, rest = __rest(props, ["variant", "width", "sx"]);
+    return (jsxRuntime.jsx(material.TableCell, __assign({ className: "".concat(variant === 'footer' ? 'tc-footer' : '') }, rest, { sx: __assign({ width: width }, sx) })));
+};
+
+var TableCellIconContainer = material.styled('div')(templateObject_1$2 || (templateObject_1$2 = __makeTemplateObject([""], [""])));
+var TableCellIcon = function (props) {
+    var align = props.align, rest = __rest(props, ["align"]);
+    return (jsxRuntime.jsx(TableCellIconContainer, __assign({ sx: {
+            display: 'flex',
+            alignItems: 'center',
+            justifyContent: align === 'center'
+                ? 'center'
+                : align === 'right'
+                    ? 'flex-end'
+                    : 'flex-start',
+        } }, rest, { children: props.children })));
+};
+var templateObject_1$2;
+
+var TableContainer = React__default["default"].forwardRef(function TableContainer(props, ref) {
+    return jsxRuntime.jsx(material.TableContainer, __assign({ ref: ref }, props));
+});
+
+var TableFooter = function (props) {
+    var children = props.children, rest = __rest(props, ["children"]);
+    return jsxRuntime.jsx(material.TableFooter, __assign({}, rest, { children: children }));
+};
+
+var TableHead = function (props) {
+    return jsxRuntime.jsx(material.TableHead, __assign({}, props));
+};
+
+var TableRow = React__default["default"].forwardRef(function TableRow(props, ref) {
+    return jsxRuntime.jsx(material.TableRow, __assign({ ref: ref }, props));
+});
+
+var Tabs = function (props) {
+    var isVertical = props.orientation === 'vertical' ? { maxWidth: '16.5rem' } : {};
+    return (jsxRuntime.jsx(material.Tabs, __assign({ sx: isVertical }, props, { children: props.children })));
+};
+
+var TagWrapper = styles$1.styled('div')(templateObject_1$1 || (templateObject_1$1 = __makeTemplateObject(["\n  display: inline-flex;\n  align-items: center;\n  border: 1px solid #C0D7EE;\n  background-color: #EBF2F9;\n  overflow: hidden;\n  border-radius: 2px;\n  height: 24px;\n  margin-right: 3px; \n  align-items: center;\n"], ["\n  display: inline-flex;\n  align-items: center;\n  border: 1px solid #C0D7EE;\n  background-color: #EBF2F9;\n  overflow: hidden;\n  border-radius: 2px;\n  height: 24px;\n  margin-right: 3px; \n  align-items: center;\n"])));
+var TagLabel = styles$1.styled('div')(function (_a) {
+    var theme = _a.theme;
+    return "\n  padding-left: 5px;\n  padding-right: 5px;\n  align-items: center;\n  color:".concat(theme.palette.text.primary, "; \n");
+});
+var TagStartIcon = styles$1.styled('div')(function () { return "\n  display: flex;\n  padding: 0 5px;\n  .MuiSvgIcon-root {\n    font-size: 16px;\n  }\n"; });
+var TagEndIcon = styles$1.styled('div')(function () { return "\n  display: flex;\n  .MuiSvgIcon-root {\n    font-size: 16px;\n  }\n  .MuiIconButton-root {\n    padding-left: 5px;\n    padding-right: 5px;\n  }\n  .MuiButtonBase-root{\n    color: inherit;\n  }\n"; });
+var TagDelete = styles$1.styled('div')(function () { return "\n  display: flex;\n  border-left: 1px solid #C0D7EE;\n  .MuiButtonBase-root{\n    color: inherit;\n  }\n  '& > *:last-of-type': {\n    .MuiSvgIcon-root {\n      font-size: 24px;\n    }  \n  }\n"; });
+var MuiIconButton = styles$1.styled(material.IconButton)(function (_a) {
+    var theme = _a.theme;
+    return "\n    height: 24px;\n    width: 24px;\n    border-radius: 0 ".concat(theme.shapes.tag, " ").concat(theme.shapes.tag, " 0;\n");
+});
+var MuiTypography = styles$1.styled(Typography)(function () { return "\n  line-height: 1;\n"; });
+var templateObject_1$1;
+
+var Tag = function (props) {
+    var tooltip = props.tooltip, tooltipPlacement = props.tooltipPlacement, tooltipDelete = props.tooltipDelete, tooltipDeletePlacement = props.tooltipDeletePlacement, tooltipLabelPlacement = props.tooltipLabelPlacement, tooltipLabel = props.tooltipLabel, disabled = props.disabled; props.platformWeb; var rest = __rest(props, ["tooltip", "tooltipPlacement", "tooltipDelete", "tooltipDeletePlacement", "tooltipLabelPlacement", "tooltipLabel", "disabled", "platformWeb"]);
+    var placement = tooltipPlacement !== undefined ? tooltipPlacement : 'top';
+    var placementLabel = tooltipLabelPlacement !== undefined ? tooltipLabelPlacement : 'top';
+    var placementDelete = tooltipDeletePlacement !== undefined ? tooltipDeletePlacement : 'top';
+    return (jsxRuntime.jsxs(TagWrapper, { children: [rest.startIcon ? jsxRuntime.jsx(TagStartIcon, { children: rest.startIcon }) : null, jsxRuntime.jsx(TagLabel, { children: tooltipLabel ? (jsxRuntime.jsx(material.Tooltip, __assign({ title: tooltipLabel, placement: placementLabel, TransitionProps: { timeout: 0 } }, { children: jsxRuntime.jsx(MuiTypography, __assign({ variant: "body2" }, { children: rest.label })) }))) : (jsxRuntime.jsx(MuiTypography, __assign({ variant: "body2" }, { children: rest.label }))) }), rest.endIcon ? (jsxRuntime.jsx(TagEndIcon, { children: tooltip ? (jsxRuntime.jsx(material.Tooltip, __assign({ title: tooltip, placement: placement, TransitionProps: { timeout: 0 } }, { children: jsxRuntime.jsx(MuiIconButton, __assign({ disabled: disabled, onClick: rest.onClick }, { children: rest.endIcon })) }))) : (jsxRuntime.jsx(MuiIconButton, __assign({ disabled: disabled, onClick: rest.onClick }, { children: rest.endIcon }))) })) : null, rest.onDelete ? (jsxRuntime.jsx(TagDelete, { children: tooltipDelete ? (jsxRuntime.jsx(material.Tooltip, __assign({ title: tooltipDelete, placement: placementDelete, TransitionProps: { timeout: 0 } }, { children: jsxRuntime.jsx(MuiIconButton, __assign({ onClick: rest.onDelete }, { children: rest.deleteIcon ? rest.deleteIcon : jsxRuntime.jsx(Icon, { name: SvgCross }) })) }))) : (jsxRuntime.jsx(MuiIconButton, __assign({ onClick: rest.onDelete }, { children: rest.deleteIcon ? rest.deleteIcon : jsxRuntime.jsx(Icon, { name: SvgCross }) }))) })) : null] }));
+};
+
+var TextField = function (props) {
+    var defaultProps = __rest(props, []);
+    return (jsxRuntime.jsx(material.TextField, __assign({ variant: "outlined", color: "secondary" }, defaultProps, { children: props.children })));
+};
+
+var Toolbar = function (props) {
+    return jsxRuntime.jsx(material.Toolbar, __assign({}, props));
+};
+
+var StyledToolbarButton = styles$1.styled(Button__default["default"])(function (_a) {
+    var theme = _a.theme;
+    return (__assign(__assign({}, (theme.platform.name === 'leap_desktop' && __assign(__assign({ height: 'auto', maxWidth: 70, minWidth: 'unset', margin: '0 15px', border: '1px solid transparent', backgroundColor: 'transparent', flexDirection: 'column', padding: '0 4px', whiteSpace: 'normal' }, theme.typography.body2), { lineHeight: '1rem', '&:hover': {
+            backgroundColor: '#DDE7F3',
+            borderColor: '#CADEF3',
+        }, '.MuiSvgIcon-root': {
+            width: 32,
+            height: 32,
+            marginBottom: 6,
+        }, '.MuiButton-startIcon': {
+            margin: 0,
+        } }))), (theme.platform.name === 'leap_web' && {
+        '.MuiButton-startIcon': {
+            display: 'none',
+        },
+    })));
+});
+
+var ToolbarButton = function (_a) {
+    var label = _a.label, icon = _a.icon, props = __rest(_a, ["label", "icon"]);
+    return (jsxRuntime.jsx(StyledToolbarButton, __assign({ variant: "outlined", startIcon: icon }, props, { children: label })));
+};
+
+var FullHeightGridContainer = styles$1.styled(Grid)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  height: 100%;\n  overflow: hidden;\n"], ["\n  height: 100%;\n  overflow: hidden;\n"])));
+var FullHeightGridItem = styles$1.styled(Grid)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  height: 100%;\n"], ["\n  height: 100%;\n"])));
+var templateObject_1, templateObject_2;
+
+var Left = function () { return null; };
+var Right = function () { return null; };
+var TwoColumnLayout = function (_a) {
+    var children = _a.children, props = __rest(_a, ["children"]);
+    var left = children.find(function (el) { return el.type === Left; });
+    var right = children.find(function (el) { return el.type === Right; });
+    return (jsxRuntime.jsxs(FullHeightGridContainer, __assign({ container: true, direction: "row", alignItems: "stretch" }, props, { children: [jsxRuntime.jsx(FullHeightGridItem, __assign({ item: true, xs: 12, sm: 6, container: true, direction: "column", display: "block" }, { children: left && left.props.children })), jsxRuntime.jsx(FullHeightGridItem, __assign({ item: true, xs: 12, sm: 6, container: true, direction: "column" }, { children: right && right.props.children }))] })));
+};
+TwoColumnLayout.Left = Left;
+TwoColumnLayout.Right = Right;
+
 function LawconnectIcon(props) {
     return (jsxRuntime.jsx("svg", __assign({ fill: "none", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 141 140" }, props, { children: jsxRuntime.jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M21.163 119.104a69.739 69.739 0 0049.313 20.426h.133a69.68 69.68 0 0064.35-43.067 69.663 69.663 0 005.281-26.673h-33.528v.042a36.23 36.23 0 01-22.382 33.464 36.236 36.236 0 11-13.853-69.718V.05a69.74 69.74 0 00-49.314 119.054zm119.049-95.585c0 12.962-10.507 23.47-23.469 23.47-12.962 0-23.47-10.508-23.47-23.47S103.782.049 116.744.049s23.469 10.508 23.469 23.47z", fill: "#ecedef" }) })));
 }
@@ -17318,6 +17467,7 @@ exports.NewAppointmentIcon = NewAppointmentIcon;
 exports.NewEntryRibbonIcon = NewEntryRibbonIcons;
 exports.Pagination = Pagination;
 exports.PhoneCall16Icon = PhoneCall16Icon;
+exports.Popover = Popover;
 exports.PowerIcon = PowerIcon;
 exports.PoweredByLawconnectLogo = PoweredByLawconnectLogo;
 exports.PrecedentNotification16Icon = PrecedentNotification16Icon;
@@ -17328,6 +17478,8 @@ exports.RadioGroup = RadioGroup;
 exports.ReportingIcon = ReportingIcon;
 exports.ResponseIcon = ResponseIcon;
 exports.RevokeAccessIcon = RevokeAccessIcon;
+exports.RibbonButton = RibbonButton;
+exports.RibbonButtonGroup = RibbonButtonGroup;
 exports.ScannedDoc16Icon = ScannedDoc16Icon;
 exports.SearchIcon = SearchIcon;
 exports.Select = Select;