@toptal/picasso 28.14.2 → 29.0.0

package/MenuItem/styles.js

@@ -97,6 +97,7 @@ export default ({ typography, palette, shadows }) => createStyles({
     },
     itemWrapper: {
         flex: 1,
+        maxWidth: '100%',
     },
     content: {
         flex: 1,

package/MenuItem/styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../src/MenuItem/styles.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../src/MenuItem/styles.ts"],"names":[],"mappings":"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"}

package/SidebarItem/ParentItemContextProvider.d.ts

@@ -0,0 +1,22 @@
+import { ReactNode } from 'react';
+export interface ContextProps {
+    /**
+     * Render indicator on the parent item
+     * when some of children has badge or tag rendered
+     */
+    isIndicatorVisible: boolean;
+    /**
+     * When submenu item with badge or tag is mounted
+     */
+    handleDecoratedItemMount: () => void;
+    /**
+     * When submenu item with badge or tag is unmounted
+     */
+    handleDecoratedItemUnmount: () => void;
+}
+export interface Props {
+    children?: ReactNode;
+    isOpened: boolean;
+}
+export declare const ParentItemContextProvider: ({ children, isOpened }: Props) => JSX.Element;
+export declare const useParentItemContext: () => ContextProps;

package/SidebarItem/ParentItemContextProvider.js

@@ -0,0 +1,20 @@
+import React, { createContext, useContext, useState } from 'react';
+const Context = createContext({
+    isIndicatorVisible: false,
+    handleDecoratedItemMount: () => { },
+    handleDecoratedItemUnmount: () => { },
+});
+export const ParentItemContextProvider = ({ children, isOpened }) => {
+    const [countItemsWithBadgeOrTag, updateCount] = useState(0);
+    const isIndicatorVisible = countItemsWithBadgeOrTag > 0 && !isOpened;
+    const handleDecoratedItemMount = () => updateCount(count => count + 1);
+    const handleDecoratedItemUnmount = () => updateCount(count => count - 1);
+    const value = {
+        isIndicatorVisible,
+        handleDecoratedItemMount,
+        handleDecoratedItemUnmount,
+    };
+    return React.createElement(Context.Provider, { value: value }, children);
+};
+export const useParentItemContext = () => useContext(Context);
+//# sourceMappingURL=ParentItemContextProvider.js.map

package/SidebarItem/ParentItemContextProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ParentItemContextProvider.js","sourceRoot":"","sources":["../../src/SidebarItem/ParentItemContextProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,aAAa,EAAE,UAAU,EAAa,QAAQ,EAAE,MAAM,OAAO,CAAA;AAkB7E,MAAM,OAAO,GAAG,aAAa,CAAe;IAC1C,kBAAkB,EAAE,KAAK;IACzB,wBAAwB,EAAE,GAAG,EAAE,GAAE,CAAC;IAClC,0BAA0B,EAAE,GAAG,EAAE,GAAE,CAAC;CACrC,CAAC,CAAA;AAOF,MAAM,CAAC,MAAM,yBAAyB,GAAG,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAS,EAAE,EAAE;IACzE,MAAM,CAAC,wBAAwB,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAA;IAE3D,MAAM,kBAAkB,GAAG,wBAAwB,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAA;IACpE,MAAM,wBAAwB,GAAG,GAAG,EAAE,CAAC,WAAW,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,GAAG,CAAC,CAAC,CAAA;IACtE,MAAM,0BAA0B,GAAG,GAAG,EAAE,CAAC,WAAW,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,GAAG,CAAC,CAAC,CAAA;IAExE,MAAM,KAAK,GAAG;QACZ,kBAAkB;QAClB,wBAAwB;QACxB,0BAA0B;KAC3B,CAAA;IAED,OAAO,oBAAC,OAAO,CAAC,QAAQ,IAAC,KAAK,EAAE,KAAK,IAAG,QAAQ,CAAoB,CAAA;AACtE,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,oBAAoB,GAAG,GAAG,EAAE,CAAC,UAAU,CAAC,OAAO,CAAC,CAAA"}

package/SidebarItem/SidebarItemAccordion.js

@@ -5,6 +5,7 @@ import Accordion from '../Accordion';
 import { ArrowDownMinor16 } from '../Icon';
 import styles from './styles';
 import { SubMenuContextProvider } from './SubMenuContextProvider';
+import { ParentItemContextProvider } from './ParentItemContextProvider';
 import { SidebarItemHeader } from './SidebarItemHeader';
 const useStyles = makeStyles(styles, {
     name: 'PicassoSidebarItemAccordion',
@@ -14,17 +15,16 @@ export const SidebarItemAccordion = forwardRef(function SidebarItemAccordion(pro
     const classes = useStyles();
     const handleAccordionChange = useCallback((event, isAccordionExpanded) => {
         event.stopPropagation();
-        if (isAccordionExpanded) {
-            expand === null || expand === void 0 ? void 0 : expand(index !== null && index !== void 0 ? index : null);
-        }
+        expand === null || expand === void 0 ? void 0 : expand((isAccordionExpanded && index) || null);
     }, [index, expand]);
     const content = (React.createElement(SubMenuContextProvider, { parentMenu: { icon, compact }, parentSidebarItemIndex: index }, menu));
-    return (React.createElement(Accordion, { onChange: handleAccordionChange, classes: {
-            summary: classes.collapsibleWrapper,
-            content: classes.content,
-        }, content: content, borders: 'none', disabled: disabled, expanded: isExpanded, expandIcon: React.createElement(ArrowDownMinor16, { className: cx(classes.expandIcon, classes[`${variant}ExpandIcon`], {
-                [classes.expandIconDisabled]: disabled,
-            }) }) },
-        React.createElement(SidebarItemHeader, Object.assign({}, props, { ref: ref }))));
+    return (React.createElement(ParentItemContextProvider, { isOpened: isExpanded || false },
+        React.createElement(Accordion, { onChange: handleAccordionChange, classes: {
+                summary: classes.collapsibleWrapper,
+                content: classes.content,
+            }, content: content, borders: 'none', disabled: disabled, expanded: isExpanded, expandIcon: React.createElement(ArrowDownMinor16, { className: cx(classes.expandIcon, classes[`${variant}ExpandIcon`], {
+                    [classes.expandIconDisabled]: disabled,
+                }) }) },
+            React.createElement(SidebarItemHeader, Object.assign({}, props, { ref: ref })))));
 });
 //# sourceMappingURL=SidebarItemAccordion.js.map

package/SidebarItem/SidebarItemAccordion.js.map

@@ -1 +1 @@
-{"version":3,"file":"SidebarItemAccordion.js","sourceRoot":"","sources":["../../src/SidebarItem/SidebarItemAccordion.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAS,MAAM,0BAA0B,CAAA;AAC5D,OAAO,EAAE,MAAM,YAAY,CAAA;AAC3B,OAAO,KAAK,EAAE,EAAe,UAAU,EAAE,WAAW,EAAE,MAAM,OAAO,CAAA;AAEnE,OAAO,SAAS,MAAM,cAAc,CAAA;AACpC,OAAO,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAA;AAC1C,OAAO,MAAM,MAAM,UAAU,CAAA;AAC7B,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAA;AAEjE,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAA;AAEvD,MAAM,SAAS,GAAG,UAAU,CAAQ,MAAM,EAAE;IAC1C,IAAI,EAAE,6BAA6B;CACpC,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,oBAAoB,GAAG,UAAU,CAC5C,SAAS,oBAAoB,CAAC,KAAY,EAAE,GAAG;IAC7C,MAAM,EACJ,MAAM,EACN,KAAK,EACL,IAAI,EACJ,QAAQ,EACR,OAAO,EACP,UAAU,EACV,IAAI,EACJ,OAAO,GACR,GAAG,KAAK,CAAA;IAET,MAAM,OAAO,GAAG,SAAS,EAAE,CAAA;IAE3B,MAAM,qBAAqB,GAAG,WAAW,CACvC,CAAC,KAAsB,EAAE,mBAA4B,EAAE,EAAE;QACvD,KAAK,CAAC,eAAe,EAAE,CAAA;QAEvB,IAAI,mBAAmB,EAAE;YACvB,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAG,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,IAAI,CAAC,CAAA;SACxB;IACH,CAAC,EACD,CAAC,KAAK,EAAE,MAAM,CAAC,CAChB,CAAA;IAED,MAAM,OAAO,GAAG,CACd,oBAAC,sBAAsB,IACrB,UAAU,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,EAC7B,sBAAsB,EAAE,KAAK,IAE5B,IAAI,CACkB,CAC1B,CAAA;IAED,OAAO,CACL,oBAAC,SAAS,IACR,QAAQ,EAAE,qBAAqB,EAC/B,OAAO,EAAE;YACP,OAAO,EAAE,OAAO,CAAC,kBAAkB;YACnC,OAAO,EAAE,OAAO,CAAC,OAAO;SACzB,EACD,OAAO,EAAE,OAAO,EAChB,OAAO,EAAC,MAAM,EACd,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,UAAU,EACpB,UAAU,EACR,oBAAC,gBAAgB,IACf,SAAS,EAAE,EAAE,CAAC,OAAO,CAAC,UAAU,EAAE,OAAO,CAAC,GAAG,OAAO,YAAY,CAAC,EAAE;gBACjE,CAAC,OAAO,CAAC,kBAAkB,CAAC,EAAE,QAAQ;aACvC,CAAC,GACF;QAGJ,oBAAC,iBAAiB,oBAAK,KAAK,IAAE,GAAG,EAAE,GAAG,IAAI,CAChC,CACb,CAAA;AACH,CAAC,CACF,CAAA"}
+{"version":3,"file":"SidebarItemAccordion.js","sourceRoot":"","sources":["../../src/SidebarItem/SidebarItemAccordion.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAS,MAAM,0BAA0B,CAAA;AAC5D,OAAO,EAAE,MAAM,YAAY,CAAA;AAC3B,OAAO,KAAK,EAAE,EAAe,UAAU,EAAE,WAAW,EAAE,MAAM,OAAO,CAAA;AAEnE,OAAO,SAAS,MAAM,cAAc,CAAA;AACpC,OAAO,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAA;AAC1C,OAAO,MAAM,MAAM,UAAU,CAAA;AAC7B,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAA;AACjE,OAAO,EAAE,yBAAyB,EAAE,MAAM,6BAA6B,CAAA;AAEvE,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAA;AAEvD,MAAM,SAAS,GAAG,UAAU,CAAQ,MAAM,EAAE;IAC1C,IAAI,EAAE,6BAA6B;CACpC,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,oBAAoB,GAAG,UAAU,CAC5C,SAAS,oBAAoB,CAAC,KAAY,EAAE,GAAG;IAC7C,MAAM,EACJ,MAAM,EACN,KAAK,EACL,IAAI,EACJ,QAAQ,EACR,OAAO,EACP,UAAU,EACV,IAAI,EACJ,OAAO,GACR,GAAG,KAAK,CAAA;IACT,MAAM,OAAO,GAAG,SAAS,EAAE,CAAA;IAE3B,MAAM,qBAAqB,GAAG,WAAW,CACvC,CAAC,KAAsB,EAAE,mBAA4B,EAAE,EAAE;QACvD,KAAK,CAAC,eAAe,EAAE,CAAA;QAEvB,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAG,CAAC,mBAAmB,IAAI,KAAK,CAAC,IAAI,IAAI,CAAC,CAAA;IAClD,CAAC,EACD,CAAC,KAAK,EAAE,MAAM,CAAC,CAChB,CAAA;IAED,MAAM,OAAO,GAAG,CACd,oBAAC,sBAAsB,IACrB,UAAU,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,EAC7B,sBAAsB,EAAE,KAAK,IAE5B,IAAI,CACkB,CAC1B,CAAA;IAED,OAAO,CACL,oBAAC,yBAAyB,IAAC,QAAQ,EAAE,UAAU,IAAI,KAAK;QACtD,oBAAC,SAAS,IACR,QAAQ,EAAE,qBAAqB,EAC/B,OAAO,EAAE;gBACP,OAAO,EAAE,OAAO,CAAC,kBAAkB;gBACnC,OAAO,EAAE,OAAO,CAAC,OAAO;aACzB,EACD,OAAO,EAAE,OAAO,EAChB,OAAO,EAAC,MAAM,EACd,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,UAAU,EACpB,UAAU,EACR,oBAAC,gBAAgB,IACf,SAAS,EAAE,EAAE,CACX,OAAO,CAAC,UAAU,EAClB,OAAO,CAAC,GAAG,OAAO,YAAY,CAAC,EAC/B;oBACE,CAAC,OAAO,CAAC,kBAAkB,CAAC,EAAE,QAAQ;iBACvC,CACF,GACD;YAGJ,oBAAC,iBAAiB,oBAAK,KAAK,IAAE,GAAG,EAAE,GAAG,IAAI,CAChC,CACc,CAC7B,CAAA;AACH,CAAC,CACF,CAAA"}

package/SidebarItem/SidebarItemCompact.js

@@ -5,15 +5,21 @@ import Dropdown from '../Dropdown';
 import { SidebarItemHeader } from './SidebarItemHeader';
 import { SubMenuContextProvider } from './SubMenuContextProvider';
 import styles from './styles';
+import { ParentItemContextProvider } from './ParentItemContextProvider';
+import useOpen from '../utils/useBoolean';
 const useStyles = makeStyles(styles, {
     name: 'PicassoSidebarItemCompact',
 });
 export const SidebarItemCompact = forwardRef(function CompactSidebarItem(props, ref) {
     const { menu, index, compact, icon } = props;
+    const [isOpened, handleOpen, handleClose] = useOpen();
     const classes = useStyles();
     const subMenu = (React.createElement(SubMenuContextProvider, { parentMenu: { compact, icon }, parentSidebarItemIndex: index }, menu));
-    return (React.createElement(Container, { left: 'small', right: 'small' },
-        React.createElement(Dropdown, { classes: { popper: classes.compactDropdown }, placement: 'right-start', content: subMenu },
-            React.createElement(SidebarItemHeader, Object.assign({}, props, { ref: ref })))));
+    return (React.createElement(ParentItemContextProvider, { isOpened: isOpened },
+        React.createElement(Container, { left: 'small', right: 'small' },
+            React.createElement(Dropdown, { classes: { popper: classes.compactDropdown }, placement: 'right-start', content: subMenu, keepMounted: true, onOpen: handleOpen, onClose: handleClose, popperProps: {
+                    role: 'menu',
+                } },
+                React.createElement(SidebarItemHeader, Object.assign({}, props, { ref: ref }))))));
 });
 //# sourceMappingURL=SidebarItemCompact.js.map

package/SidebarItem/SidebarItemCompact.js.map

@@ -1 +1 @@
-{"version":3,"file":"SidebarItemCompact.js","sourceRoot":"","sources":["../../src/SidebarItem/SidebarItemCompact.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAS,MAAM,0BAA0B,CAAA;AAC5D,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAEzC,OAAO,SAAS,MAAM,cAAc,CAAA;AACpC,OAAO,QAAQ,MAAM,aAAa,CAAA;AAClC,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAA;AACvD,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAA;AAEjE,OAAO,MAAM,MAAM,UAAU,CAAA;AAE7B,MAAM,SAAS,GAAG,UAAU,CAAQ,MAAM,EAAE;IAC1C,IAAI,EAAE,2BAA2B;CAClC,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,kBAAkB,GAAG,UAAU,CAC1C,SAAS,kBAAkB,CAAC,KAAY,EAAE,GAAG;IAC3C,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,EAAE,IAAI,EAAE,GAAG,KAAK,CAAA;IAE5C,MAAM,OAAO,GAAG,SAAS,EAAE,CAAA;IAE3B,MAAM,OAAO,GAAG,CACd,oBAAC,sBAAsB,IACrB,UAAU,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,EAC7B,sBAAsB,EAAE,KAAK,IAE5B,IAAI,CACkB,CAC1B,CAAA;IAED,OAAO,CACL,oBAAC,SAAS,IAAC,IAAI,EAAC,OAAO,EAAC,KAAK,EAAC,OAAO;QACnC,oBAAC,QAAQ,IACP,OAAO,EAAE,EAAE,MAAM,EAAE,OAAO,CAAC,eAAe,EAAE,EAC5C,SAAS,EAAC,aAAa,EACvB,OAAO,EAAE,OAAO;YAEhB,oBAAC,iBAAiB,oBAAK,KAAK,IAAE,GAAG,EAAE,GAAG,IAAI,CACjC,CACD,CACb,CAAA;AACH,CAAC,CACF,CAAA"}
+{"version":3,"file":"SidebarItemCompact.js","sourceRoot":"","sources":["../../src/SidebarItem/SidebarItemCompact.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAS,MAAM,0BAA0B,CAAA;AAC5D,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAEzC,OAAO,SAAS,MAAM,cAAc,CAAA;AACpC,OAAO,QAAQ,MAAM,aAAa,CAAA;AAClC,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAA;AACvD,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAA;AAEjE,OAAO,MAAM,MAAM,UAAU,CAAA;AAC7B,OAAO,EAAE,yBAAyB,EAAE,MAAM,6BAA6B,CAAA;AACvE,OAAO,OAAO,MAAM,qBAAqB,CAAA;AAEzC,MAAM,SAAS,GAAG,UAAU,CAAQ,MAAM,EAAE;IAC1C,IAAI,EAAE,2BAA2B;CAClC,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,kBAAkB,GAAG,UAAU,CAC1C,SAAS,kBAAkB,CAAC,KAAY,EAAE,GAAG;IAC3C,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,EAAE,IAAI,EAAE,GAAG,KAAK,CAAA;IAC5C,MAAM,CAAC,QAAQ,EAAE,UAAU,EAAE,WAAW,CAAC,GAAG,OAAO,EAAE,CAAA;IACrD,MAAM,OAAO,GAAG,SAAS,EAAE,CAAA;IAE3B,MAAM,OAAO,GAAG,CACd,oBAAC,sBAAsB,IACrB,UAAU,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,EAC7B,sBAAsB,EAAE,KAAK,IAE5B,IAAI,CACkB,CAC1B,CAAA;IAED,OAAO,CACL,oBAAC,yBAAyB,IAAC,QAAQ,EAAE,QAAQ;QAC3C,oBAAC,SAAS,IAAC,IAAI,EAAC,OAAO,EAAC,KAAK,EAAC,OAAO;YACnC,oBAAC,QAAQ,IACP,OAAO,EAAE,EAAE,MAAM,EAAE,OAAO,CAAC,eAAe,EAAE,EAC5C,SAAS,EAAC,aAAa,EACvB,OAAO,EAAE,OAAO,EAChB,WAAW,QACX,MAAM,EAAE,UAAU,EAClB,OAAO,EAAE,WAAW,EACpB,WAAW,EAAE;oBACX,IAAI,EAAE,MAAM;iBACb;gBAED,oBAAC,iBAAiB,oBAAK,KAAK,IAAE,GAAG,EAAE,GAAG,IAAI,CACjC,CACD,CACc,CAC7B,CAAA;AACH,CAAC,CACF,CAAA"}

package/SidebarItem/SidebarItemHeader.js

@@ -16,6 +16,8 @@ import MenuItem from '../MenuItem';
 import SidebarItemContent from '../SidebarItemContent';
 import styles from './styles';
 import { useSubMenuContext } from './SubMenuContextProvider';
+import getBadgeProps from './utils/getBadgeProps/getBadgeProps';
+import getTagProps from './utils/getTagProps/getTagProps';
 const useStyles = makeStyles(styles, {
     name: 'PicassoSidebarItemHeader',
 });
@@ -23,9 +25,9 @@ export const SidebarItemHeader = forwardRef(function SidebarItemHeader(props, re
     const { className, disabled, menu, selected, compact, variant = 'light', onClick, collapsible, testIds, 
     // these props are being destructured only for the purpose of excluding them from `...rest`
     /* eslint-disable @typescript-eslint/no-unused-vars */
-    icon, isSubMenu, badge, isExpanded, expand, index } = props, 
+    icon, isSubMenu, badge, tag, isExpanded, expand, index } = props, 
     /* eslint-enable */
-    rest = __rest(props, ["className", "disabled", "menu", "selected", "compact", "variant", "onClick", "collapsible", "testIds", "icon", "isSubMenu", "badge", "isExpanded", "expand", "index"]);
+    rest = __rest(props, ["className", "disabled", "menu", "selected", "compact", "variant", "onClick", "collapsible", "testIds", "icon", "isSubMenu", "badge", "tag", "isExpanded", "expand", "index"]);
     const classes = useStyles();
     const { parentMenu } = useSubMenuContext();
     const hasMenu = menu != null;
@@ -43,6 +45,6 @@ export const SidebarItemHeader = forwardRef(function SidebarItemHeader(props, re
             [classes.parentCompact]: parentMenu === null || parentMenu === void 0 ? void 0 : parentMenu.compact,
             [classes.collapsible]: hasMenu && (collapsible || compact),
         }, className), onClick: handleMenuItemClick, selected: shouldShowSelected, disabled: disabled, variant: variant, nonSelectable: true, "data-testid": testIds === null || testIds === void 0 ? void 0 : testIds.header }),
-        React.createElement(SidebarItemContent, Object.assign({}, props))));
+        React.createElement(SidebarItemContent, Object.assign({}, props, { badge: getBadgeProps(badge), tag: getTagProps(tag) }))));
 });
 //# sourceMappingURL=SidebarItemHeader.js.map

package/SidebarItem/SidebarItemHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"SidebarItemHeader.js","sourceRoot":"","sources":["../../src/SidebarItem/SidebarItemHeader.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EAAE,UAAU,EAAS,MAAM,0BAA0B,CAAA;AAC5D,OAAO,EAAE,MAAM,YAAY,CAAA;AAC3B,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,OAAO,CAAA;AAEtD,OAAO,QAAQ,MAAM,aAAa,CAAA;AAClC,OAAO,kBAAkB,MAAM,uBAAuB,CAAA;AACtD,OAAO,MAAM,MAAM,UAAU,CAAA;AAE7B,OAAO,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAA;AAE5D,MAAM,SAAS,GAAG,UAAU,CAAQ,MAAM,EAAE;IAC1C,IAAI,EAAE,0BAA0B;CACjC,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG,UAAU,CACzC,SAAS,iBAAiB,CAAC,KAAY,EAAE,GAAG;IAC1C,MAAM,EACJ,SAAS,EACT,QAAQ,EACR,IAAI,EACJ,QAAQ,EACR,OAAO,EACP,OAAO,GAAG,OAAO,EACjB,OAAO,EACP,WAAW,EACX,OAAO;IACP,2FAA2F;IAC3F,sDAAsD;IACtD,IAAI,EACJ,SAAS,EACT,KAAK,EACL,UAAU,EACV,MAAM,EACN,KAAK,KAGH,KAAK;IAFP,mBAAmB;IAChB,IAAI,UACL,KAAK,EApBH,uKAoBL,CAAQ,CAAA;IAET,MAAM,OAAO,GAAG,SAAS,EAAE,CAAA;IAE3B,MAAM,EAAE,UAAU,EAAE,GAAG,iBAAiB,EAAE,CAAA;IAE1C,MAAM,OAAO,GAAG,IAAI,IAAI,IAAI,CAAA;IAE5B,MAAM,mBAAmB,GAAG,WAAW,CACrC,CAAC,KAAgD,EAAE,EAAE;QACnD,IAAI,CAAC,OAAO,EAAE;YACZ,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAG,KAAK,CAAC,CAAA;SACjB;IACH,CAAC,EACD,CAAC,OAAO,EAAE,OAAO,CAAC,CACnB,CAAA;IAED,MAAM,YAAY,GAChB,UAAU;QACV,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,kBAAkB,CAAC,CAAC,CAAC,OAAO,CAAC,UAAU,CAAC,CAAA;IAErE,MAAM,kBAAkB,GAAG,CAAC,OAAO,IAAI,CAAC,OAAO,CAAC,IAAI,QAAQ,CAAA;IAE5D,OAAO,CACL,oBAAC,QAAQ,oBACH,IAAI,IACR,OAAO,EAAE,OAAO,EAChB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACX,OAAO,CAAC,IAAI,EACZ,OAAO,CAAC,MAAM,EACd,OAAO,CAAC,OAAO,CAAC,EAChB,YAAY,EACZ;YACE,CAAC,OAAO,CAAC,OAAO,CAAC,EAAE,OAAO;YAC1B,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE,kBAAkB;YACtC,CAAC,OAAO,CAAC,aAAa,CAAC,EAAE,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,OAAO;YAC5C,CAAC,OAAO,CAAC,WAAW,CAAC,EAAE,OAAO,IAAI,CAAC,WAAW,IAAI,OAAO,CAAC;SAC3D,EACD,SAAS,CACV,EACD,OAAO,EAAE,mBAAmB,EAC5B,QAAQ,EAAE,kBAAkB,EAC5B,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,OAAO,EAChB,aAAa,uBACA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,MAAM;QAE5B,oBAAC,kBAAkB,oBAAK,KAAK,EAAI,CACxB,CACZ,CAAA;AACH,CAAC,CACF,CAAA"}
+{"version":3,"file":"SidebarItemHeader.js","sourceRoot":"","sources":["../../src/SidebarItem/SidebarItemHeader.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EAAE,UAAU,EAAS,MAAM,0BAA0B,CAAA;AAC5D,OAAO,EAAE,MAAM,YAAY,CAAA;AAC3B,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,OAAO,CAAA;AAEtD,OAAO,QAAQ,MAAM,aAAa,CAAA;AAClC,OAAO,kBAAkB,MAAM,uBAAuB,CAAA;AACtD,OAAO,MAAM,MAAM,UAAU,CAAA;AAE7B,OAAO,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAA;AAC5D,OAAO,aAAa,MAAM,qCAAqC,CAAA;AAC/D,OAAO,WAAW,MAAM,iCAAiC,CAAA;AAEzD,MAAM,SAAS,GAAG,UAAU,CAAQ,MAAM,EAAE;IAC1C,IAAI,EAAE,0BAA0B;CACjC,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG,UAAU,CACzC,SAAS,iBAAiB,CAAC,KAAY,EAAE,GAAG;IAC1C,MAAM,EACJ,SAAS,EACT,QAAQ,EACR,IAAI,EACJ,QAAQ,EACR,OAAO,EACP,OAAO,GAAG,OAAO,EACjB,OAAO,EACP,WAAW,EACX,OAAO;IACP,2FAA2F;IAC3F,sDAAsD;IACtD,IAAI,EACJ,SAAS,EACT,KAAK,EACL,GAAG,EACH,UAAU,EACV,MAAM,EACN,KAAK,KAGH,KAAK;IAFP,mBAAmB;IAChB,IAAI,UACL,KAAK,EArBH,8KAqBL,CAAQ,CAAA;IAET,MAAM,OAAO,GAAG,SAAS,EAAE,CAAA;IAE3B,MAAM,EAAE,UAAU,EAAE,GAAG,iBAAiB,EAAE,CAAA;IAE1C,MAAM,OAAO,GAAG,IAAI,IAAI,IAAI,CAAA;IAE5B,MAAM,mBAAmB,GAAG,WAAW,CACrC,CAAC,KAAgD,EAAE,EAAE;QACnD,IAAI,CAAC,OAAO,EAAE;YACZ,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAG,KAAK,CAAC,CAAA;SACjB;IACH,CAAC,EACD,CAAC,OAAO,EAAE,OAAO,CAAC,CACnB,CAAA;IAED,MAAM,YAAY,GAChB,UAAU;QACV,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,kBAAkB,CAAC,CAAC,CAAC,OAAO,CAAC,UAAU,CAAC,CAAA;IAErE,MAAM,kBAAkB,GAAG,CAAC,OAAO,IAAI,CAAC,OAAO,CAAC,IAAI,QAAQ,CAAA;IAE5D,OAAO,CACL,oBAAC,QAAQ,oBACH,IAAI,IACR,OAAO,EAAE,OAAO,EAChB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACX,OAAO,CAAC,IAAI,EACZ,OAAO,CAAC,MAAM,EACd,OAAO,CAAC,OAAO,CAAC,EAChB,YAAY,EACZ;YACE,CAAC,OAAO,CAAC,OAAO,CAAC,EAAE,OAAO;YAC1B,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE,kBAAkB;YACtC,CAAC,OAAO,CAAC,aAAa,CAAC,EAAE,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,OAAO;YAC5C,CAAC,OAAO,CAAC,WAAW,CAAC,EAAE,OAAO,IAAI,CAAC,WAAW,IAAI,OAAO,CAAC;SAC3D,EACD,SAAS,CACV,EACD,OAAO,EAAE,mBAAmB,EAC5B,QAAQ,EAAE,kBAAkB,EAC5B,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,OAAO,EAChB,aAAa,uBACA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,MAAM;QAE5B,oBAAC,kBAAkB,oBACb,KAAK,IACT,KAAK,EAAE,aAAa,CAAC,KAAK,CAAC,EAC3B,GAAG,EAAE,WAAW,CAAC,GAAG,CAAC,IACrB,CACO,CACZ,CAAA;AACH,CAAC,CACF,CAAA"}

package/SidebarItem/styles.js

@@ -56,11 +56,11 @@ export default ({ palette, sizes }) => createStyles({
         margin: '0 1rem',
     },
     nestedMenu: {
-        padding: '0 0 0 2rem',
+        padding: '0 1rem 0 2rem',
         marginRight: '1rem',
     },
     nestedMenuWithIcon: {
-        padding: '0 0 0 2.875rem',
+        padding: '0 1rem 0 2.875rem',
         marginRight: '1rem',
     },
     content: {

package/SidebarItem/styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../src/SidebarItem/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAS,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAE9D,eAAe,CAAC,EAAE,OAAO,EAAE,KAAK,EAAS,EAAE,EAAE,CAC3C,YAAY,CAAC;IACX,IAAI,EAAE;QACJ,MAAM,EAAE,QAAQ;QAChB,OAAO,EAAE,QAAQ;QACjB,MAAM,EAAE,QAAQ;QAChB,UAAU,EAAE,QAAQ;QACpB,YAAY,EAAE,KAAK,CAAC,YAAY,CAAC,KAAK;QACtC,QAAQ,EAAE,MAAM;KACjB;IACD,KAAK,EAAE;QACL,KAAK,EAAE,OAAO,CAAC,IAAI,CAAC,IAAI;QACxB,SAAS,EAAE;YACT,KAAK,EAAE,OAAO,CAAC,IAAI,CAAC,IAAI;SACzB;QACD,SAAS,EAAE;YACT,KAAK,EAAE,OAAO,CAAC,IAAI,CAAC,IAAI;SACzB;KACF;IACD,IAAI,EAAE;QACJ,SAAS,EAAE;YACT,KAAK,EAAE,OAAO,CAAC,MAAM,CAAC,KAAK;SAC5B;QACD,SAAS,EAAE;YACT,KAAK,EAAE,OAAO,CAAC,MAAM,CAAC,KAAK;SAC5B;KACF;IACD,QAAQ,EAAE;QACR,SAAS,EAAE;YACT,qBAAqB,EAAE;gBACrB,KAAK,EAAE,OAAO,CAAC,IAAI,CAAC,IAAI;gBACxB,eAAe,EAAE,OAAO,CAAC,IAAI,CAAC,KAAK;aACpC;SACF;QACD,QAAQ,EAAE;YACR,qBAAqB,EAAE;gBACrB,KAAK,EAAE,OAAO,CAAC,MAAM,CAAC,KAAK;gBAC3B,eAAe,EAAE,OAAO,CAAC,IAAI,CAAC,IAAI;aACnC;SACF;KACF;IACD,aAAa,EAAE;QACb,SAAS,EAAE;YACT,qBAAqB,EAAE;gBACrB,MAAM,EAAE,CAAC;gBACT,OAAO,EAAE,aAAa;gBACtB,YAAY,EAAE,KAAK,CAAC,YAAY,CAAC,KAAK;gBACtC,YAAY,EAAE;oBACZ,eAAe,EAAE,OAAO,CAAC,IAAI,CAAC,OAAO;iBACtC;aACF;SACF;KACF;IACD,kBAAkB,EAAE;QAClB,OAAO,EAAE,YAAY;QACrB,MAAM,EAAE,QAAQ;KACjB;IACD,UAAU,EAAE;QACV,OAAO,EAAE,YAAY;QACrB,WAAW,EAAE,MAAM;KACpB;IACD,kBAAkB,EAAE;QAClB,OAAO,EAAE,gBAAgB;QACzB,WAAW,EAAE,MAAM;KACpB;IACD,OAAO,EAAE;QACP,qDAAqD;QACrD,QAAQ,EAAE,MAAM;KACjB;IACD,UAAU,EAAE;QACV,QAAQ,EAAE,KAAK;KAChB;IACD,eAAe,EAAE;QACf,UAAU,EAAE,OAAO;KACpB;IACD,eAAe,EAAE;QACf,KAAK,EAAE,OAAO,CAAC,IAAI,CAAC,IAAI;KACzB;IACD,cAAc,EAAE;QACd,KAAK,EAAE,OAAO,CAAC,IAAI,CAAC,IAAI;KACzB;IACD,kBAAkB,EAAE;QAClB,KAAK,EAAE,OAAO,CAAC,IAAI,CAAC,IAAI;KACzB;IACD,OAAO,EAAE;QACP,OAAO,EAAE,CAAC;QACV,QAAQ,EAAE,SAAS;KACpB;IACD,MAAM,EAAE;QACN,IAAI,EAAE,CAAC;QACP,QAAQ,EAAE,CAAC;KACZ;IACD,WAAW,EAAE;QACX,MAAM,EAAE,CAAC;QACT,OAAO,EAAE,CAAC;KACX;CACF,CAAC,CAAA"}
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../src/SidebarItem/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAS,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAE9D,eAAe,CAAC,EAAE,OAAO,EAAE,KAAK,EAAS,EAAE,EAAE,CAC3C,YAAY,CAAC;IACX,IAAI,EAAE;QACJ,MAAM,EAAE,QAAQ;QAChB,OAAO,EAAE,QAAQ;QACjB,MAAM,EAAE,QAAQ;QAChB,UAAU,EAAE,QAAQ;QACpB,YAAY,EAAE,KAAK,CAAC,YAAY,CAAC,KAAK;QACtC,QAAQ,EAAE,MAAM;KACjB;IACD,KAAK,EAAE;QACL,KAAK,EAAE,OAAO,CAAC,IAAI,CAAC,IAAI;QACxB,SAAS,EAAE;YACT,KAAK,EAAE,OAAO,CAAC,IAAI,CAAC,IAAI;SACzB;QACD,SAAS,EAAE;YACT,KAAK,EAAE,OAAO,CAAC,IAAI,CAAC,IAAI;SACzB;KACF;IACD,IAAI,EAAE;QACJ,SAAS,EAAE;YACT,KAAK,EAAE,OAAO,CAAC,MAAM,CAAC,KAAK;SAC5B;QACD,SAAS,EAAE;YACT,KAAK,EAAE,OAAO,CAAC,MAAM,CAAC,KAAK;SAC5B;KACF;IACD,QAAQ,EAAE;QACR,SAAS,EAAE;YACT,qBAAqB,EAAE;gBACrB,KAAK,EAAE,OAAO,CAAC,IAAI,CAAC,IAAI;gBACxB,eAAe,EAAE,OAAO,CAAC,IAAI,CAAC,KAAK;aACpC;SACF;QACD,QAAQ,EAAE;YACR,qBAAqB,EAAE;gBACrB,KAAK,EAAE,OAAO,CAAC,MAAM,CAAC,KAAK;gBAC3B,eAAe,EAAE,OAAO,CAAC,IAAI,CAAC,IAAI;aACnC;SACF;KACF;IACD,aAAa,EAAE;QACb,SAAS,EAAE;YACT,qBAAqB,EAAE;gBACrB,MAAM,EAAE,CAAC;gBACT,OAAO,EAAE,aAAa;gBACtB,YAAY,EAAE,KAAK,CAAC,YAAY,CAAC,KAAK;gBACtC,YAAY,EAAE;oBACZ,eAAe,EAAE,OAAO,CAAC,IAAI,CAAC,OAAO;iBACtC;aACF;SACF;KACF;IACD,kBAAkB,EAAE;QAClB,OAAO,EAAE,YAAY;QACrB,MAAM,EAAE,QAAQ;KACjB;IACD,UAAU,EAAE;QACV,OAAO,EAAE,eAAe;QACxB,WAAW,EAAE,MAAM;KACpB;IACD,kBAAkB,EAAE;QAClB,OAAO,EAAE,mBAAmB;QAC5B,WAAW,EAAE,MAAM;KACpB;IACD,OAAO,EAAE;QACP,qDAAqD;QACrD,QAAQ,EAAE,MAAM;KACjB;IACD,UAAU,EAAE;QACV,QAAQ,EAAE,KAAK;KAChB;IACD,eAAe,EAAE;QACf,UAAU,EAAE,OAAO;KACpB;IACD,eAAe,EAAE;QACf,KAAK,EAAE,OAAO,CAAC,IAAI,CAAC,IAAI;KACzB;IACD,cAAc,EAAE;QACd,KAAK,EAAE,OAAO,CAAC,IAAI,CAAC,IAAI;KACzB;IACD,kBAAkB,EAAE;QAClB,KAAK,EAAE,OAAO,CAAC,IAAI,CAAC,IAAI;KACzB;IACD,OAAO,EAAE;QACP,OAAO,EAAE,CAAC;QACV,QAAQ,EAAE,SAAS;KACpB;IACD,MAAM,EAAE;QACN,IAAI,EAAE,CAAC;QACP,QAAQ,EAAE,CAAC;KACZ;IACD,WAAW,EAAE;QACX,MAAM,EAAE,CAAC;QACT,OAAO,EAAE,CAAC;KACX;CACF,CAAC,CAAA"}

package/SidebarItem/types.d.ts

@@ -3,7 +3,7 @@ import { BaseProps, TextLabelProps } from '@toptal/picasso-shared';
 import { MenuItemProps } from '@material-ui/core/MenuItem';
 import { MenuItemAttributes } from '../MenuItem';
 import { VariantType } from '../PageSidebar/types';
-import { BadgeProps } from '../Badge';
+import { SidebarTagProps, SidebarBadgeProps } from '../SidebarItemContent/types';
 export interface Props extends BaseProps, TextLabelProps, MenuItemAttributes {
     /** Pass icon to be used as part of item */
     icon?: ReactElement;
@@ -18,7 +18,9 @@ export interface Props extends BaseProps, TextLabelProps, MenuItemAttributes {
     /** Component name to render the menu item as */
     as?: ElementType<MenuItemProps>;
     /** Definition of the embedded badge  */
-    badge?: Omit<BadgeProps, 'size' | 'children'>;
+    badge?: number | SidebarBadgeProps;
+    /** Render Tag.Rectangular */
+    tag?: string | SidebarTagProps;
     /** Callback when item is clicked */
     onClick?: (event: React.MouseEvent<HTMLElement, MouseEvent>) => void;
     /** Callback when item is hovered */

package/SidebarItem/utils/getBadgeProps/getBadgeProps.d.ts

@@ -0,0 +1,3 @@
+import { SidebarBadgeProps } from '../../../SidebarItemContent';
+declare const getBadgeProps: (badge?: number | SidebarBadgeProps) => SidebarBadgeProps | undefined;
+export default getBadgeProps;

package/SidebarItem/utils/getBadgeProps/getBadgeProps.js

@@ -0,0 +1,8 @@
+const getBadgeProps = (badge) => {
+    if (typeof badge === 'number') {
+        return { content: badge };
+    }
+    return badge;
+};
+export default getBadgeProps;
+//# sourceMappingURL=getBadgeProps.js.map

package/SidebarItem/utils/getBadgeProps/getBadgeProps.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"getBadgeProps.js","sourceRoot":"","sources":["../../../../src/SidebarItem/utils/getBadgeProps/getBadgeProps.ts"],"names":[],"mappings":"AAEA,MAAM,aAAa,GAAG,CAAC,KAAkC,EAAE,EAAE;IAC3D,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;QAC7B,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,CAAA;KAC1B;IAED,OAAO,KAAK,CAAA;AACd,CAAC,CAAA;AAED,eAAe,aAAa,CAAA"}

package/SidebarItem/utils/getTagProps/getTagProps.d.ts

@@ -0,0 +1,3 @@
+import { SidebarTagProps } from '../../../SidebarItemContent';
+declare const getTagProps: (tag?: string | SidebarTagProps) => SidebarTagProps | undefined;
+export default getTagProps;

package/SidebarItem/utils/getTagProps/getTagProps.js

@@ -0,0 +1,8 @@
+const getTagProps = (tag) => {
+    if (typeof tag === 'string') {
+        return { content: tag };
+    }
+    return tag;
+};
+export default getTagProps;
+//# sourceMappingURL=getTagProps.js.map

package/SidebarItem/utils/getTagProps/getTagProps.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"getTagProps.js","sourceRoot":"","sources":["../../../../src/SidebarItem/utils/getTagProps/getTagProps.ts"],"names":[],"mappings":"AAEA,MAAM,WAAW,GAAG,CAAC,GAA8B,EAAE,EAAE;IACrD,IAAI,OAAO,GAAG,KAAK,QAAQ,EAAE;QAC3B,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,CAAA;KACxB;IAED,OAAO,GAAG,CAAA;AACZ,CAAC,CAAA;AAED,eAAe,WAAW,CAAA"}

package/SidebarItemContent/SidebarItemContent.d.ts

@@ -1,14 +1,3 @@
-import { ReactElement, ReactNode } from 'react';
-import { BadgeProps } from '../Badge';
-export interface Props {
-    compact?: boolean;
-    icon?: ReactElement;
-    badge?: Omit<BadgeProps, 'size' | 'children'>;
-    children?: ReactNode;
-    titleCase?: boolean;
-    testIds?: {
-        content?: string;
-    };
-}
+import { Props } from './types';
 declare const SidebarItemContent: (props: Props) => JSX.Element;
 export default SidebarItemContent;

package/SidebarItemContent/SidebarItemContent.js

@@ -17,48 +17,63 @@ import Typography from '../Typography';
 import Tooltip from '../Tooltip';
 import Container from '../Container';
 import Badge from '../Badge';
+import TagRectangular from '../TagRectangular';
 import { getReactNodeTextContent } from '../utils';
 import styles from './styles';
+import Indicator from '../Indicator';
+import useIndicatorOnParentItem from './useIndicatorOnParentItem';
 const useStyles = makeStyles(styles, {
     name: 'PicassoSidebarItemContent',
 });
 const resolveChildrenText = (text, titleCase) => typeof text === 'string' ? (React.createElement(Typography, { color: 'inherit', size: 'medium', titleCase: titleCase, noWrap: true }, text)) : (text);
 const ItemContentBadge = (props) => {
     const { children, variant = 'red' } = props, rest = __rest(props, ["children", "variant"]);
-    const classes = useStyles();
     const isOverlay = React.Children.count(children) > 0;
-    return (React.createElement(Badge, Object.assign({ className: cx({
-            [classes.staticBadge]: !isOverlay,
-        }), variant: variant, size: isOverlay ? 'small' : 'large' }, rest), children));
+    return (React.createElement(Badge, Object.assign({ variant: variant, size: isOverlay ? 'small' : 'large' }, rest), children));
 };
 const CompactItemContent = (props) => {
-    const { icon, children, badge } = props;
+    const { icon, children, badge, isIndicatorVisible, menu } = props;
     const classes = useStyles();
     const hasBadge = badge != null;
-    const wrappedIcon = icon && hasBadge ? (React.createElement(ItemContentBadge, { content: badge.content }, icon)) : (icon);
+    const hasSubItems = menu != null;
+    const wrappedIcon = icon && hasBadge && !hasSubItems ? (React.createElement(ItemContentBadge, { content: badge.content, variant: badge.variant }, icon)) : (icon);
     return (React.createElement(Container, { className: classes.noWrap, inline: true, flex: true, alignItems: 'center', padded: 'small' },
         React.createElement(Tooltip, { compact: true, placement: 'right', content: getReactNodeTextContent(children) },
-            React.createElement("div", { className: classes.iconWrapper }, wrappedIcon))));
+            React.createElement("div", { className: classes.iconWrapper },
+                wrappedIcon,
+                hasSubItems && isIndicatorVisible && (React.createElement(Container, { className: classes.compactIndicator },
+                    React.createElement(Indicator, { color: 'red' })))))));
 };
 const ExpandedItemContent = (props) => {
-    const { icon, badge, children, testIds } = props;
+    const { icon, badge, children, testIds, tag, isIndicatorVisible, menu, isSubMenu, } = props;
     const classes = useStyles();
-    const hasIcon = icon != null;
+    const hasIcon = icon != null && !isSubMenu;
     const hasBadge = badge != null;
-    return (React.createElement(Container, { className: classes.noWrap, inline: true, flex: true, alignItems: 'center' },
-        icon,
+    const hasTag = tag != null;
+    const hasSubItems = menu != null;
+    return (React.createElement(Container, { className: classes.noWrap, inline: true, flex: true, alignItems: 'center', gap: 'xsmall' },
+        !isSubMenu && icon,
         React.createElement(Container, { className: cx(classes.noWrap, {
                 [classes.withIcon]: hasIcon,
-            }), flex: true, alignItems: 'center', "data-testid": testIds === null || testIds === void 0 ? void 0 : testIds.content },
-            children,
-            hasBadge && React.createElement(ItemContentBadge, Object.assign({}, badge)))));
+            }), flex: true, alignItems: 'center', "data-testid": testIds === null || testIds === void 0 ? void 0 : testIds.content }, children),
+        hasTag && !hasSubItems && (React.createElement(TagRectangular, { variant: tag.variant || 'red' }, tag.content)),
+        hasBadge && !hasSubItems && React.createElement(ItemContentBadge, Object.assign({}, badge)),
+        isIndicatorVisible && hasSubItems && (React.createElement(Container, { className: classes.expandedIndicator },
+            React.createElement(Indicator, { color: 'red' })))));
 };
 const SidebarItemContent = (props) => {
-    const { children, titleCase: propsTitleCase, compact } = props;
+    const { children, titleCase: propsTitleCase, compact, isSubMenu, badge, tag, } = props;
     const titleCase = useTitleCase(propsTitleCase);
     const resolvedChildren = resolveChildrenText(children, !!titleCase);
+    const hasBadge = badge != null;
+    const hasTag = tag != null;
+    const isIndicatorVisible = useIndicatorOnParentItem({
+        isSubMenu,
+        hasBadge,
+        hasTag,
+    });
     const ItemContentVariant = compact ? CompactItemContent : ExpandedItemContent;
-    return (React.createElement(ItemContentVariant, Object.assign({}, props, { titleCase: titleCase }), resolvedChildren));
+    return (React.createElement(ItemContentVariant, Object.assign({}, props, { isIndicatorVisible: isIndicatorVisible, titleCase: titleCase }), resolvedChildren));
 };
 export default SidebarItemContent;
 //# sourceMappingURL=SidebarItemContent.js.map

package/SidebarItemContent/SidebarItemContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"SidebarItemContent.js","sourceRoot":"","sources":["../../src/SidebarItemContent/SidebarItemContent.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"SidebarItemContent.js","sourceRoot":"","sources":["../../src/SidebarItemContent/SidebarItemContent.tsx"],"names":[],"mappings":"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"}

package/SidebarItemContent/index.d.ts

@@ -1,4 +1,5 @@
 import { OmitInternalProps } from '@toptal/picasso-shared';
-import { Props } from './SidebarItemContent';
+import { Props } from './types';
+export type { SidebarTagProps, SidebarBadgeProps } from './types';
 export { default } from './SidebarItemContent';
 export declare type SidebarItemContentProps = OmitInternalProps<Props>;

package/SidebarItemContent/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/SidebarItemContent/index.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/SidebarItemContent/index.ts"],"names":[],"mappings":"AAKA,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAA"}

package/SidebarItemContent/styles.d.ts

@@ -1,2 +1,2 @@
-declare const _default: () => import("@material-ui/styles").StyleRules<{}, "noWrap" | "iconWrapper" | "withIcon" | "hiddenContent" | "staticBadge">;
+declare const _default: () => import("@material-ui/styles").StyleRules<{}, "noWrap" | "iconWrapper" | "withIcon" | "hiddenContent" | "compactIndicator" | "expandedIndicator">;
 export default _default;

package/SidebarItemContent/styles.js

@@ -1,11 +1,12 @@
 import { createStyles } from '@material-ui/core';
+import { rem } from '@toptal/picasso-shared';
 export default () => createStyles({
     noWrap: {
         flex: 1,
         minWidth: 0,
     },
     withIcon: {
-        marginLeft: '0.875em',
+        marginLeft: rem('6px'),
     },
     hiddenContent: {
         visibility: 'hidden',
@@ -13,9 +14,16 @@ export default () => createStyles({
     iconWrapper: {
         width: '1em',
         height: '1em',
+        position: 'relative',
     },
-    staticBadge: {
-        marginLeft: '0.5em',
+    compactIndicator: {
+        position: 'absolute',
+        top: 0,
+        right: 0,
+        transform: 'translate(50%, -50%)',
+    },
+    expandedIndicator: {
+        marginRight: rem('6px'),
     },
 });
 //# sourceMappingURL=styles.js.map

package/SidebarItemContent/styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../src/SidebarItemContent/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAA;AAEhD,eAAe,GAAG,EAAE,CAClB,YAAY,CAAC;IACX,MAAM,EAAE;QACN,IAAI,EAAE,CAAC;QACP,QAAQ,EAAE,CAAC;KACZ;IACD,QAAQ,EAAE;QACR,UAAU,EAAE,SAAS;KACtB;IACD,aAAa,EAAE;QACb,UAAU,EAAE,QAAQ;KACrB;IACD,WAAW,EAAE;QACX,KAAK,EAAE,KAAK;QACZ,MAAM,EAAE,KAAK;KACd;IACD,WAAW,EAAE;QACX,UAAU,EAAE,OAAO;KACpB;CACF,CAAC,CAAA"}
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../src/SidebarItemContent/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAA;AAChD,OAAO,EAAE,GAAG,EAAE,MAAM,wBAAwB,CAAA;AAE5C,eAAe,GAAG,EAAE,CAClB,YAAY,CAAC;IACX,MAAM,EAAE;QACN,IAAI,EAAE,CAAC;QACP,QAAQ,EAAE,CAAC;KACZ;IACD,QAAQ,EAAE;QACR,UAAU,EAAE,GAAG,CAAC,KAAK,CAAC;KACvB;IACD,aAAa,EAAE;QACb,UAAU,EAAE,QAAQ;KACrB;IACD,WAAW,EAAE;QACX,KAAK,EAAE,KAAK;QACZ,MAAM,EAAE,KAAK;QACb,QAAQ,EAAE,UAAU;KACrB;IACD,gBAAgB,EAAE;QAChB,QAAQ,EAAE,UAAU;QACpB,GAAG,EAAE,CAAC;QACN,KAAK,EAAE,CAAC;QACR,SAAS,EAAE,sBAAsB;KAClC;IACD,iBAAiB,EAAE;QACjB,WAAW,EAAE,GAAG,CAAC,KAAK,CAAC;KACxB;CACF,CAAC,CAAA"}

package/SidebarItemContent/types.d.ts

@@ -0,0 +1,22 @@
+import { ReactElement, ReactNode } from 'react';
+import { BadgeProps } from '../Badge';
+import { VariantOnlyProps } from '../TagRectangular/types';
+/** Render Tag.Rectangular */
+export interface SidebarTagProps extends VariantOnlyProps {
+    content: string;
+}
+/** Definition of the embedded badge  */
+export declare type SidebarBadgeProps = Omit<BadgeProps, 'size' | 'children'>;
+export interface Props {
+    compact?: boolean;
+    icon?: ReactElement;
+    badge?: SidebarBadgeProps;
+    tag?: SidebarTagProps;
+    children?: ReactNode;
+    titleCase?: boolean;
+    testIds?: {
+        content?: string;
+    };
+    isSubMenu?: boolean;
+    menu?: ReactElement;
+}

package/SidebarItemContent/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/SidebarItemContent/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/SidebarItemContent/types.ts"],"names":[],"mappings":""}

package/SidebarItemContent/useIndicatorOnParentItem.d.ts

@@ -0,0 +1,7 @@
+declare type HookProps = {
+    isSubMenu?: boolean;
+    hasBadge: boolean;
+    hasTag: boolean;
+};
+declare const useIndicatorOnParentItem: ({ isSubMenu, hasBadge, hasTag, }: HookProps) => boolean;
+export default useIndicatorOnParentItem;

package/SidebarItemContent/useIndicatorOnParentItem.js

@@ -0,0 +1,20 @@
+import { useEffect } from 'react';
+import { useParentItemContext } from '../SidebarItem/ParentItemContextProvider';
+const useIndicatorOnParentItem = ({ isSubMenu, hasBadge, hasTag, }) => {
+    const { handleDecoratedItemMount, handleDecoratedItemUnmount, isIndicatorVisible, } = useParentItemContext();
+    useEffect(() => {
+        if (isSubMenu && (hasBadge || hasTag)) {
+            handleDecoratedItemMount();
+            return handleDecoratedItemUnmount;
+        }
+    }, [
+        isSubMenu,
+        hasBadge,
+        hasTag,
+        handleDecoratedItemMount,
+        handleDecoratedItemUnmount,
+    ]);
+    return isIndicatorVisible;
+};
+export default useIndicatorOnParentItem;
+//# sourceMappingURL=useIndicatorOnParentItem.js.map

package/SidebarItemContent/useIndicatorOnParentItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useIndicatorOnParentItem.js","sourceRoot":"","sources":["../../src/SidebarItemContent/useIndicatorOnParentItem.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEjC,OAAO,EAAE,oBAAoB,EAAE,MAAM,0CAA0C,CAAA;AAQ/E,MAAM,wBAAwB,GAAG,CAAC,EAChC,SAAS,EACT,QAAQ,EACR,MAAM,GACI,EAAE,EAAE;IACd,MAAM,EACJ,wBAAwB,EACxB,0BAA0B,EAC1B,kBAAkB,GACnB,GAAG,oBAAoB,EAAE,CAAA;IAE1B,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,SAAS,IAAI,CAAC,QAAQ,IAAI,MAAM,CAAC,EAAE;YACrC,wBAAwB,EAAE,CAAA;YAE1B,OAAO,0BAA0B,CAAA;SAClC;IACH,CAAC,EAAE;QACD,SAAS;QACT,QAAQ;QACR,MAAM;QACN,wBAAwB;QACxB,0BAA0B;KAC3B,CAAC,CAAA;IAEF,OAAO,kBAAkB,CAAA;AAC3B,CAAC,CAAA;AAED,eAAe,wBAAwB,CAAA"}

package/TagCompound/index.d.ts

@@ -1,6 +1,6 @@
 export declare const TagCompound: import("react").ForwardRefExoticComponent<import("../Tag/Tag").Props & import("react").RefAttributes<HTMLDivElement>> & {
     Group: import("react").ForwardRefExoticComponent<import("../TagGroup/TagGroup").Props & import("react").RefAttributes<HTMLDivElement>>;
-    Rectangular: import("react").ForwardRefExoticComponent<import("../TagRectangular/TagRectangular").Props & import("react").RefAttributes<HTMLDivElement>>;
+    Rectangular: import("react").ForwardRefExoticComponent<import("../TagRectangular/types").Props & import("react").RefAttributes<HTMLDivElement>>;
     Connection: ({ children }: import("../TagConnection/TagConnection").Props) => JSX.Element;
     Checkable: import("react").ForwardRefExoticComponent<import("../TagCheckable/TagCheckable").Props & import("react").RefAttributes<HTMLDivElement>>;
 };

package/TagRectangular/TagRectangular.d.ts

@@ -1,18 +1,4 @@
-import React, { HTMLAttributes, AnchorHTMLAttributes } from 'react';
-import { BaseProps, TextLabelProps } from '@toptal/picasso-shared';
-import { IndicatorProps } from '../Indicator';
-export declare type VariantType = 'red' | 'yellow' | 'dark-grey' | 'light-grey' | 'green';
-export declare type DivOrAnchorProps = AnchorHTMLAttributes<HTMLAnchorElement> & HTMLAttributes<HTMLDivElement>;
-interface VariantOnlyProps extends BaseProps, TextLabelProps, DivOrAnchorProps {
-    /** Variant of the rectangular `Tag`, can not be used with the `indicator` property at the same time. */
-    variant?: VariantType;
-    /** Indicator color, can not be used with the `variant` property at the same time. The Tag's `variant` property is automatically set to `light` when indicator color is set. */
-    indicator?: never;
-}
-interface IndicatorOnlyProps extends BaseProps, TextLabelProps, DivOrAnchorProps {
-    variant?: never;
-    indicator: IndicatorProps['color'];
-}
-export declare type Props = VariantOnlyProps | IndicatorOnlyProps;
+import React from 'react';
+import { Props } from './types';
 export declare const TagRectangular: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLDivElement>>;
 export default TagRectangular;

package/TagRectangular/TagRectangular.js.map

@@ -1 +1 @@
-{"version":3,"file":"TagRectangular.js","sourceRoot":"","sources":["../../src/TagRectangular/TagRectangular.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAwC,MAAM,OAAO,CAAA;AAC/E,OAAO,EAAE,UAAU,EAAS,MAAM,0BAA0B,CAAA;AAC5D,OAAO,EAAE,MAAM,YAAY,CAAA;AAC3B,OAAO,EAA6B,YAAY,EAAE,MAAM,wBAAwB,CAAA;AAEhF,OAAO,SAA6B,MAAM,cAAc,CAAA;AACxD,OAAO,IAAI,MAAM,SAAS,CAAA;AAC1B,OAAO,WAAW,MAAM,wBAAwB,CAAA;AAChD,OAAO,MAAM,MAAM,UAAU,CAAA;AA6B7B,MAAM,SAAS,GAAG,UAAU,CAAQ,MAAM,EAAE;IAC1C,IAAI,EAAE,uBAAuB;CAC9B,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,UAAU,CACtC,SAAS,cAAc,CAAC,KAAK,EAAE,GAAG;IAChC,MAAM;IACJ,6DAA6D;IAC7D,KAAK,EACL,QAAQ,EACR,KAAK,EACL,SAAS,EACT,SAAS,EAAE,cAAc,EACzB,OAAO,GAAG,YAAY,EACtB,SAAS,KAEP,KAAK,EADJ,IAAI,UACL,KAAK,EAVH,gFAUL,CAAQ,CAAA;IAET,MAAM,OAAO,GAAG,SAAS,EAAE,CAAA;IAC3B,MAAM,SAAS,GAAG,YAAY,CAAC,cAAc,CAAC,CAAA;IAE9C,OAAO,CACL,oBAAC,IAAI,oBACC,IAAI,IACR,GAAG,EAAE,GAAG,EACR,OAAO,EAAE;YACP,IAAI,EAAE,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,OAAO,CAAC,OAAO,CAAC,CAAC;YACxC,KAAK,EAAE,OAAO,CAAC,KAAK;YACpB,IAAI,EAAE,OAAO,CAAC,IAAI;SACnB,EACD,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,SAAS,CAAC,CAAC,CAAC,oBAAC,SAAS,IAAC,KAAK,EAAE,SAAS,GAAI,CAAC,CAAC,CAAC,SAAS,EAC7D,KAAK,EACH,8BACE,SAAS,EAAE,EAAE,CAAC,OAAO,CAAC,UAAU,EAAE;gBAChC,CAAC,OAAO,CAAC,kBAAkB,CAAC,EAAE,OAAO,KAAK,YAAY;aACvD,CAAC,IAED,SAAS,CAAC,CAAC,CAAC,WAAW,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,QAAQ,CACxC,IAET,CACH,CAAA;AACH,CAAC,CACF,CAAA;AAED,cAAc,CAAC,YAAY,GAAG;IAC5B,OAAO,EAAE,YAAY;CACtB,CAAA;AAED,cAAc,CAAC,WAAW,GAAG,gBAAgB,CAAA;AAE7C,eAAe,cAAc,CAAA"}
+{"version":3,"file":"TagRectangular.js","sourceRoot":"","sources":["../../src/TagRectangular/TagRectangular.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AACzC,OAAO,EAAE,UAAU,EAAS,MAAM,0BAA0B,CAAA;AAC5D,OAAO,EAAE,MAAM,YAAY,CAAA;AAC3B,OAAO,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAA;AAErD,OAAO,SAAS,MAAM,cAAc,CAAA;AACpC,OAAO,IAAI,MAAM,SAAS,CAAA;AAC1B,OAAO,WAAW,MAAM,wBAAwB,CAAA;AAChD,OAAO,MAAM,MAAM,UAAU,CAAA;AAG7B,MAAM,SAAS,GAAG,UAAU,CAAQ,MAAM,EAAE;IAC1C,IAAI,EAAE,uBAAuB;CAC9B,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,UAAU,CACtC,SAAS,cAAc,CAAC,KAAK,EAAE,GAAG;IAChC,MAAM;IACJ,6DAA6D;IAC7D,KAAK,EACL,QAAQ,EACR,KAAK,EACL,SAAS,EACT,SAAS,EAAE,cAAc,EACzB,OAAO,GAAG,YAAY,EACtB,SAAS,KAEP,KAAK,EADJ,IAAI,UACL,KAAK,EAVH,gFAUL,CAAQ,CAAA;IAET,MAAM,OAAO,GAAG,SAAS,EAAE,CAAA;IAC3B,MAAM,SAAS,GAAG,YAAY,CAAC,cAAc,CAAC,CAAA;IAE9C,OAAO,CACL,oBAAC,IAAI,oBACC,IAAI,IACR,GAAG,EAAE,GAAG,EACR,OAAO,EAAE;YACP,IAAI,EAAE,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,OAAO,CAAC,OAAO,CAAC,CAAC;YACxC,KAAK,EAAE,OAAO,CAAC,KAAK;YACpB,IAAI,EAAE,OAAO,CAAC,IAAI;SACnB,EACD,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,SAAS,CAAC,CAAC,CAAC,oBAAC,SAAS,IAAC,KAAK,EAAE,SAAS,GAAI,CAAC,CAAC,CAAC,SAAS,EAC7D,KAAK,EACH,8BACE,SAAS,EAAE,EAAE,CAAC,OAAO,CAAC,UAAU,EAAE;gBAChC,CAAC,OAAO,CAAC,kBAAkB,CAAC,EAAE,OAAO,KAAK,YAAY;aACvD,CAAC,IAED,SAAS,CAAC,CAAC,CAAC,WAAW,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,QAAQ,CACxC,IAET,CACH,CAAA;AACH,CAAC,CACF,CAAA;AAED,cAAc,CAAC,YAAY,GAAG;IAC5B,OAAO,EAAE,YAAY;CACtB,CAAA;AAED,cAAc,CAAC,WAAW,GAAG,gBAAgB,CAAA;AAE7C,eAAe,cAAc,CAAA"}

package/TagRectangular/index.d.ts

@@ -1,4 +1,4 @@
 import { OmitInternalProps } from '@toptal/picasso-shared';
-import { Props } from './TagRectangular';
+import { Props } from './types';
 export { default } from './TagRectangular';
 export declare type TagRectangularProps = OmitInternalProps<Props>;

package/TagRectangular/types.d.ts

@@ -0,0 +1,16 @@
+import { HTMLAttributes, AnchorHTMLAttributes } from 'react';
+import { BaseProps, TextLabelProps } from '@toptal/picasso-shared';
+import { IndicatorProps } from '../Indicator';
+export declare type DivOrAnchorProps = AnchorHTMLAttributes<HTMLAnchorElement> & HTMLAttributes<HTMLDivElement>;
+export declare type VariantType = 'red' | 'yellow' | 'dark-grey' | 'light-grey' | 'green';
+export interface VariantOnlyProps extends BaseProps, TextLabelProps, DivOrAnchorProps {
+    /** Variant of the rectangular `Tag`, can not be used with the `indicator` property at the same time. */
+    variant?: VariantType;
+    /** Indicator color, can not be used with the `variant` property at the same time. The Tag's `variant` property is automatically set to `light` when indicator color is set. */
+    indicator?: never;
+}
+export interface IndicatorOnlyProps extends BaseProps, TextLabelProps, DivOrAnchorProps {
+    variant?: never;
+    indicator: IndicatorProps['color'];
+}
+export declare type Props = VariantOnlyProps | IndicatorOnlyProps;

package/TagRectangular/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/TagRectangular/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/TagRectangular/types.ts"],"names":[],"mappings":""}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@toptal/picasso",
-  "version": "28.14.2",
+  "version": "29.0.0",
   "description": "Toptal UI components library",
   "publishConfig": {
     "access": "public",