@veracity/vui 2.14.5 → 2.14.6-beta.1

package/dist/cjs/header/header.types.d.ts

@@ -91,7 +91,7 @@ export type LoggedInHeaderProps = HeaderProps & {
     notifications?: HeaderNotificationsData | JSX.Element;
     /** Socket for services menu icon on the right side. */
     services?: HeaderServicesData | JSX.Element;
-    /** Socket for showing the alt user Info with role; introduced for APP; by default it is true. */
+    /** Socket for showing the 'alternative' user Info with role (alternative: 3 lines, role. default: 2 lines, no role); introduced for APP; by default it is true. */
     showAltUserInfo?: boolean;
     /** Socket for showing the services trigger up front; introduced for APP; by default it is displayed. */
     showServices?: boolean;

package/dist/cjs/header/header.types.d.ts.map

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

package/dist/cjs/header/loggedInHeader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"loggedInHeader.d.ts","sourceRoot":"","sources":["../../../src/header/loggedInHeader.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAkB,mBAAmB,EAAE,MAAM,gBAAgB,CAAA;AAIpE,uHAAuH;AACvH,eAAO,MAAM,cAAc,4DA+JzB,CAAA;AAIF,eAAe,cAAc,CAAA"}
+{"version":3,"file":"loggedInHeader.d.ts","sourceRoot":"","sources":["../../../src/header/loggedInHeader.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAkB,mBAAmB,EAAE,MAAM,gBAAgB,CAAA;AAIpE,uHAAuH;AACvH,eAAO,MAAM,cAAc,4DA4JzB,CAAA;AAIF,eAAe,cAAc,CAAA"}

package/dist/cjs/header/loggedInHeader.js

@@ -54,11 +54,6 @@ exports.LoggedInHeader = (0, core_1.vui)((props, ref) => {
                     showMainLinks && mainLinks !== undefined && (react_1.default.createElement(react_1.default.Fragment, null,
                         (0, utils_1.isJsx)(mainLinks) ? mainLinks : react_1.default.createElement(header_1.default.MainLinks, { links: mainLinks }),
                         react_1.default.createElement(header_1.default.Divider, { mx: 1 }))),
-                    !showMainLinks &&
-                        showAltUserInfo &&
-                        ((0, utils_1.isJsx)(userInfo) ? (userInfo) : (react_1.default.createElement(react_1.default.Fragment, null,
-                            react_1.default.createElement(headerAccountUserInfo_1.default, Object.assign({ className: "vui-altUserInfo", color: localTextColor, isApplication: true }, userInfo)),
-                            react_1.default.createElement(header_1.default.Divider, { mx: 1 })))),
                     !showMainLinks && mainLinks && (react_1.default.createElement(react_1.default.Fragment, null,
                         react_1.default.createElement(header_1.default.MobileToggle, { ml: 0 }),
                         react_1.default.createElement(header_1.default.MobileContent, null,
@@ -80,6 +75,11 @@ exports.LoggedInHeader = (0, core_1.vui)((props, ref) => {
                 mainLinks !== undefined && react_1.default.createElement(header_1.default.Divider, { mx: 1 }),
                 (0, utils_1.isJsx)(services) ? services : react_1.default.createElement(header_1.default.Services, Object.assign({}, services)))),
             (0, utils_1.isJsx)(notifications) ? notifications : react_1.default.createElement(header_1.default.Notifications, Object.assign({}, notifications)),
+            !showMainLinks &&
+                showAltUserInfo &&
+                ((0, utils_1.isJsx)(userInfo) ? (userInfo) : (react_1.default.createElement(react_1.default.Fragment, null,
+                    react_1.default.createElement(header_1.default.Divider, { ml: 2 }),
+                    react_1.default.createElement(headerAccountUserInfo_1.default, Object.assign({ className: "vui-altUserInfo", color: localTextColor, isApplication: true }, userInfo))))),
             (0, utils_1.isJsx)(account) ? account : react_1.default.createElement(header_1.default.Account, Object.assign({}, account)),
             react_1.default.createElement(core_1.RenderOnScreen, { maxWidth: "lg" },
                 isApplication && react_1.default.createElement(header_1.default.Divider, { ml: 1 }),

package/dist/cjs/sidemenu/sidemenu.js

@@ -52,17 +52,17 @@ const sidemenuTop_1 = __importDefault(require("./sidemenuTop"));
 exports.Sidemenu = (0, core_1.vui)((props, ref) => {
     var _a;
     const { children, className, items, isExpanded = false, isSticky = false, size, variant, width = 280, onNavigate } = props, rest = __rest(props, ["children", "className", "items", "isExpanded", "isSticky", "size", "variant", "width", "onNavigate"]);
-    const [isExpandedInternal, setIsExpandedInternal] = (0, react_1.useState)(isExpanded);
-    const context = (0, react_1.useMemo)(() => (0, utils_1.filterUndefined)({ size, variant, isExpandedInternal }), [size, variant, isExpandedInternal]);
+    const [isExpandedHorizontally, setIsExpandedHorizontally] = (0, react_1.useState)(isExpanded);
+    const context = (0, react_1.useMemo)(() => (0, utils_1.filterUndefined)({ size, variant, isExpandedHorizontally }), [size, variant, isExpandedHorizontally]);
     const styles = (0, core_1.useStyleConfig)('Sidemenu', props);
     const isDark = variant === 'dark';
     (0, react_1.useEffect)(() => {
-        setIsExpandedInternal(isExpanded);
+        setIsExpandedHorizontally(isExpanded);
     }, [isExpanded]);
-    const onToggle = () => setIsExpandedInternal(!isExpandedInternal);
-    const w = isExpandedInternal ? width : consts_1.expandedWidth;
-    const icon = `falArrow${isExpandedInternal ? 'Left' : 'Right'}`;
-    const justifyContent = isExpandedInternal ? 'flex-end' : 'center';
+    const onToggle = () => setIsExpandedHorizontally(!isExpandedHorizontally);
+    const w = isExpandedHorizontally ? width : consts_1.expandedWidth;
+    const icon = `falArrow${isExpandedHorizontally ? 'Left' : 'Right'}`;
+    const justifyContent = isExpandedHorizontally ? 'flex-end' : 'center';
     function onItemClick(item) {
         var _a;
         (_a = item === null || item === void 0 ? void 0 : item.onClick) === null || _a === void 0 ? void 0 : _a.call(item);

package/dist/cjs/sidemenu/sidemenu.types.d.ts

@@ -26,8 +26,14 @@ export type SidemenuItemProps = BoxProps & {
     iconSize?: 'md' | 'sm';
     /** Whether the item is active */
     isActive?: boolean;
+    /** Whether the item is expanded vertically */
+    isExpanded?: boolean;
     /** On click callback */
     onClick?: () => void;
+    /** On collapse callback @default true */
+    onCollapse?: () => void;
+    /** On expand callback */
+    onExpand?: () => void;
     /** Router path */
     path?: string;
     /** Title */

package/dist/cjs/sidemenu/sidemenu.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sidemenu.types.d.ts","sourceRoot":"","sources":["../../../src/sidemenu/sidemenu.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEjC,OAAO,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAA;AACjC,OAAO,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAClC,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AACvC,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAEvC,MAAM,MAAM,mBAAmB,GAAG,UAAU,GAAG,YAAY,CAAA;AAE3D,MAAM,MAAM,aAAa,GAAG,WAAW,GACrC,YAAY,CAAC,UAAU,CAAC,GAAG;IACzB,gCAAgC;IAChC,KAAK,CAAC,EAAE,iBAAiB,EAAE,CAAA;IAC3B,mDAAmD;IACnD,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,8JAA8J;IAC9J,UAAU,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAA;IACjC,yEAAyE;IACzE,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CAAA;AAEH,MAAM,MAAM,iBAAiB,GAAG,QAAQ,GAAG;IACzC,wBAAwB;IACxB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,eAAe;IACf,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,wBAAwB;IACxB,IAAI,EAAE,QAAQ,CAAA;IACd,6BAA6B;IAC7B,QAAQ,CAAC,EAAE,IAAI,GAAG,IAAI,CAAA;IACtB,iCAAiC;IACjC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,wBAAwB;IACxB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,kBAAkB;IAClB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,YAAY;IACZ,KAAK,EAAE,MAAM,CAAA;CACd,CAAA;AAED,MAAM,MAAM,gBAAgB,GAAG,QAAQ,GAAG;IACxC,wBAAwB;IACxB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,iCAAiC;IACjC,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,sDAAsD;IACtD,SAAS,CAAC,EAAE,SAAS,CAAA;CACtB,CAAA"}
+{"version":3,"file":"sidemenu.types.d.ts","sourceRoot":"","sources":["../../../src/sidemenu/sidemenu.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEjC,OAAO,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAA;AACjC,OAAO,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAClC,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AACvC,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAEvC,MAAM,MAAM,mBAAmB,GAAG,UAAU,GAAG,YAAY,CAAA;AAE3D,MAAM,MAAM,aAAa,GAAG,WAAW,GACrC,YAAY,CAAC,UAAU,CAAC,GAAG;IACzB,gCAAgC;IAChC,KAAK,CAAC,EAAE,iBAAiB,EAAE,CAAA;IAC3B,mDAAmD;IACnD,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,8JAA8J;IAC9J,UAAU,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAA;IACjC,yEAAyE;IACzE,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CAAA;AAEH,MAAM,MAAM,iBAAiB,GAAG,QAAQ,GAAG;IACzC,wBAAwB;IACxB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,eAAe;IACf,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,wBAAwB;IACxB,IAAI,EAAE,QAAQ,CAAA;IACd,6BAA6B;IAC7B,QAAQ,CAAC,EAAE,IAAI,GAAG,IAAI,CAAA;IACtB,iCAAiC;IACjC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,8CAA8C;IAC9C,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,wBAAwB;IACxB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,yCAAyC;IACzC,UAAU,CAAC,EAAE,MAAM,IAAI,CAAA;IACvB,yBAAyB;IACzB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,kBAAkB;IAClB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,YAAY;IACZ,KAAK,EAAE,MAAM,CAAA;CACd,CAAA;AAED,MAAM,MAAM,gBAAgB,GAAG,QAAQ,GAAG;IACxC,wBAAwB;IACxB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,iCAAiC;IACjC,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,sDAAsD;IACtD,SAAS,CAAC,EAAE,SAAS,CAAA;CACtB,CAAA"}

package/dist/cjs/sidemenu/sidemenuItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sidemenuItem.d.ts","sourceRoot":"","sources":["../../../src/sidemenu/sidemenuItem.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAyC,YAAY,EAAE,MAAM,SAAS,CAAA;AAM7E,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAA;AAEpD,mBAAmB;AACnB,eAAO,MAAM,YAAY,wCA+EmB,CAAA;AAI5C,eAAe,YAAY,CAAA"}
+{"version":3,"file":"sidemenuItem.d.ts","sourceRoot":"","sources":["../../../src/sidemenu/sidemenuItem.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAyB,YAAY,EAAE,MAAM,SAAS,CAAA;AAK7D,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAA;AAGpD,mBAAmB;AACnB,eAAO,MAAM,YAAY,wCAiGmB,CAAA;AAI5C,eAAe,YAAY,CAAA"}

package/dist/cjs/sidemenu/sidemenuItem.js

@@ -46,33 +46,36 @@ const icon_1 = __importDefault(require("../icon"));
 const popover_1 = require("../popover");
 const t_1 = __importDefault(require("../t"));
 const utils_1 = require("../utils");
-const context_1 = require("./context");
+const useSidemenuItem_1 = __importDefault(require("./useSidemenuItem"));
 /** A menu item. */
 exports.SidemenuItem = (0, core_1.vui)((props, ref) => {
-    const _a = (0, core_1.omitThemingProps)(props), { className, children, icon, iconSize = 'md', isActive, onClick, title } = _a, rest = __rest(_a, ["className", "children", "icon", "iconSize", "isActive", "onClick", "title"]);
-    const [displayChildren, setDisplayChildren] = (0, react_1.useState)(true);
-    const { variant, size, isExpandedInternal } = (0, context_1.useSidemenuContext)();
-    const styles = (0, core_1.useStyleConfig)('Sidemenu', context_1.useSidemenuContext);
-    const isDark = variant === 'dark';
-    const hasChildrenExpanded = !!children && isExpandedInternal;
+    const _a = (0, core_1.omitThemingProps)(props), { className, children, icon, iconSize = 'md', isActive, isExpanded = true, onClick, onCollapse, onExpand, title } = _a, rest = __rest(_a, ["className", "children", "icon", "iconSize", "isActive", "isExpanded", "onClick", "onCollapse", "onExpand", "title"]);
+    const { isExpandedVertically, setIsExpandedVertically, isDark, size, isExpandedHorizontally, styles } = (0, useSidemenuItem_1.default)(isExpanded);
+    (0, react_1.useEffect)(() => {
+        if (isExpandedVertically)
+            onExpand === null || onExpand === void 0 ? void 0 : onExpand();
+        if (!isExpandedVertically)
+            onCollapse === null || onCollapse === void 0 ? void 0 : onCollapse();
+    }, [isExpandedVertically]);
+    const hasChildrenExpanded = !!children && isExpandedHorizontally;
     const innerContent = (react_1.default.createElement(box_1.default, { centerV: true, px: 2, py: 1, w: "100%", whiteSpace: "pre" },
         react_1.default.createElement(icon_1.default, { ml: iconSize === 'sm' ? '4px' : 0, name: icon, size: iconSize }),
         react_1.default.createElement(t_1.default, { isTruncated: true, ml: 2 }, title)));
     const toggle = (e) => {
         e.preventDefault();
         e.stopPropagation();
-        setDisplayChildren(!displayChildren);
+        setIsExpandedVertically(!isExpandedVertically);
     };
-    const buttonStyles = Object.assign(Object.assign(Object.assign({ alignItems: 'center', border: 'none', borderRadius: 0, borderLeft: '3px solid transparent', borderLeftColor: isActive ? (isDark ? 'digiGreen.main' : 'seaBlue.main') : undefined, bg: isDark ? 'darkBlue.main' : isActive ? 'skyBlue.95' : 'white', color: hasChildrenExpanded ? 'seaBlue.main' : isDark ? 'digiGreen.main' : 'sandstone.10', h: 'auto', justifyContent: 'space-between', onClick: () => onClick === null || onClick === void 0 ? void 0 : onClick(), p: 0, variant: isDark ? 'tertiaryLight' : 'tertiaryDark', w: '100%' }, styles.item), { minH: size === 'lg' ? '56px' : '40px', hoverBg: isDark ? 'seaBlue.main' : 'skyBlue.90' }), rest);
+    const buttonStyles = Object.assign(Object.assign(Object.assign({ alignItems: 'center', border: 'none', borderRadius: 0, borderLeft: !hasChildrenExpanded && children ? 'none' : '3px solid transparent', borderLeftColor: isActive ? (isDark ? 'digiGreen.main' : 'seaBlue.main') : undefined, bg: isDark ? 'darkBlue.main' : isActive ? 'skyBlue.95' : 'white', color: hasChildrenExpanded ? 'seaBlue.main' : isDark ? 'digiGreen.main' : 'sandstone.10', h: 'auto', justifyContent: 'space-between', onClick: () => onClick === null || onClick === void 0 ? void 0 : onClick(), p: 0, variant: isDark ? 'tertiaryLight' : 'tertiaryDark', w: '100%' }, styles.item), { minH: size === 'lg' ? '56px' : '40px', hoverBg: isDark ? 'seaBlue.main' : 'skyBlue.90' }), rest);
     return (react_1.default.createElement(box_1.default, { flexDirection: "column", ref: ref, w: "100%" },
         !hasChildrenExpanded && children ? (react_1.default.createElement(popover_1.Popover, { offset: [0, 0], placement: "right-start", trigger: "mouseenter" },
-            react_1.default.createElement(popover_1.Popover.Trigger, Object.assign({ className: (0, utils_1.cs)('vui-sidemenu-item-popover', className) }, buttonStyles),
-                react_1.default.createElement(box_1.default, { borderLeft: `3px solid ${isDark ? 'digiGreen.main' : 'seaBlue.main'}` }, innerContent)),
-            react_1.default.createElement(popover_1.Popover.Content, { shadow: 'none' },
+            react_1.default.createElement(popover_1.Popover.Trigger, { as: box_1.default, className: (0, utils_1.cs)('vui-sidemenu-item-popover', className) },
+                react_1.default.createElement(box_1.default, Object.assign({}, buttonStyles, { borderLeft: `3px solid ${isDark ? 'digiGreen.main' : 'seaBlue.main'}` }), innerContent)),
+            react_1.default.createElement(popover_1.Popover.Content, { shadow: "none" },
                 react_1.default.createElement(box_1.default, { flexDirection: "column", justifyContent: "start", w: "100%" }, children)))) : (react_1.default.createElement(button_1.default, Object.assign({ className: (0, utils_1.cs)('vui-sidemenu-item', className) }, buttonStyles),
             innerContent,
-            hasChildrenExpanded && (react_1.default.createElement(button_1.default, { className: "vui-sidemenu-item-expand", icon: displayChildren ? 'falChevronUp' : 'falChevronDown', mr: 1, onClick: toggle, size: "sm", variant: isDark ? 'tertiaryLight' : 'tertiaryDark' })))),
-        !!children && hasChildrenExpanded && displayChildren && (react_1.default.createElement(box_1.default, { flexDirection: "column", justifyContent: "start", w: "100%" }, children))));
+            hasChildrenExpanded && (react_1.default.createElement(button_1.default, { className: "vui-sidemenu-item-expand", icon: isExpandedVertically ? 'falChevronUp' : 'falChevronDown', mr: 1, onClick: toggle, size: "sm", variant: isDark ? 'tertiaryLight' : 'tertiaryDark' })))),
+        !!children && hasChildrenExpanded && isExpandedVertically && (react_1.default.createElement(box_1.default, { flexDirection: "column", justifyContent: "start", w: "100%" }, children))));
 });
 exports.SidemenuItem.displayName = 'SidemenuItem';
 exports.default = exports.SidemenuItem;

package/dist/cjs/sidemenu/sidemenuTop.js

@@ -24,12 +24,12 @@ const context_1 = require("./context");
 const SidemenuTop = (props) => {
     const _a = (0, core_1.omitThemingProps)(props), { className, leftSlot, rightSlot } = _a, rest = __rest(_a, ["className", "leftSlot", "rightSlot"]);
     const styles = (0, core_1.useStyleConfig)('Sidemenu', props);
-    const { isExpandedInternal } = (0, context_1.useSidemenuContext)();
+    const { isExpandedHorizontally } = (0, context_1.useSidemenuContext)();
     if (!leftSlot && !rightSlot)
         return null;
     return (react_1.default.createElement(box_1.Box, Object.assign({ className: (0, utils_1.cs)('vui-sidemenu-top', className), mb: 1, w: "100%" }, styles.sidemenuTop, rest),
         !!leftSlot && leftSlot,
-        !!rightSlot && isExpandedInternal && rightSlot));
+        !!rightSlot && isExpandedHorizontally && rightSlot));
 };
 exports.SidemenuTop = SidemenuTop;
 exports.SidemenuTop.displayName = 'SidemenuTop';

package/dist/cjs/sidemenu/useSidemenuItem.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+declare const useSidemenuItem: (isExpanded: boolean) => {
+    isExpandedVertically: boolean;
+    isDark: boolean;
+    size: any;
+    isExpandedHorizontally: any;
+    styles: import("..").Dict<any>;
+    setIsExpandedVertically: import("react").Dispatch<import("react").SetStateAction<boolean>>;
+};
+export default useSidemenuItem;
+//# sourceMappingURL=useSidemenuItem.d.ts.map

package/dist/cjs/sidemenu/useSidemenuItem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSidemenuItem.d.ts","sourceRoot":"","sources":["../../../src/sidemenu/useSidemenuItem.ts"],"names":[],"mappings":";AAKA,QAAA,MAAM,eAAe,eAAgB,OAAO;;;;;;;CAiB3C,CAAA;AAED,eAAe,eAAe,CAAA"}

package/dist/cjs/sidemenu/useSidemenuItem.js

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = require("react");
+const core_1 = require("../core");
+const context_1 = require("./context");
+const useSidemenuItem = (isExpanded) => {
+    const [isExpandedVertically, setIsExpandedVertically] = (0, react_1.useState)(isExpanded);
+    const { variant, size, isExpandedHorizontally } = (0, context_1.useSidemenuContext)();
+    const styles = (0, core_1.useStyleConfig)('Sidemenu', context_1.useSidemenuContext);
+    (0, react_1.useEffect)(() => {
+        if (isExpanded !== isExpandedVertically)
+            setIsExpandedVertically(isExpanded);
+    }, [isExpanded]);
+    return {
+        isExpandedVertically,
+        isDark: variant === 'dark',
+        size,
+        isExpandedHorizontally,
+        styles,
+        setIsExpandedVertically
+    };
+};
+exports.default = useSidemenuItem;

package/dist/cjs/table/th.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"th.d.ts","sourceRoot":"","sources":["../../../src/table/th.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AAGvC,eAAO,MAAM,MAAM,8HAIlB,CAAA;AAED,oDAAoD;AACpD,eAAO,MAAM,EAAE,+CA+Db,CAAA;AAIF,eAAe,EAAE,CAAA"}
+{"version":3,"file":"th.d.ts","sourceRoot":"","sources":["../../../src/table/th.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AAGvC,eAAO,MAAM,MAAM,8HAIlB,CAAA;AAED,oDAAoD;AACpD,eAAO,MAAM,EAAE,+CA8Db,CAAA;AAIF,eAAe,EAAE,CAAA"}

package/dist/cjs/table/th.js

@@ -18,7 +18,6 @@ exports.Th = exports.ThBase = void 0;
 const react_1 = __importDefault(require("react"));
 const box_1 = __importDefault(require("../box"));
 const core_1 = require("../core");
-const t_1 = require("../t");
 const utils_1 = require("../utils");
 const context_1 = require("./context");
 const tableSortIcon_1 = __importDefault(require("./tableSortIcon"));
@@ -55,8 +54,7 @@ exports.Th = (0, core_1.vui)((props, ref) => {
         : {};
     return (react_1.default.createElement(exports.ThBase, Object.assign({ className: (0, utils_1.cs)('vui-th', className), "data-active": isActive, "data-disabled": disabled, hoverBg: hoverBg, px: 2, ref: ref }, styles.th, activeProps, disabledProps, interactiveProps, rest), children !== null && children !== void 0 ? children : (react_1.default.createElement(box_1.default, { centerV: true, display: "inline-flex" },
         title,
-        isSortable && react_1.default.createElement(tableSortIcon_1.default, { ml: 1, my: 0.5, order: sortOrder }))),
-        !title && react_1.default.createElement(t_1.T, { color: "white" }, "a11y fix")));
+        isSortable && react_1.default.createElement(tableSortIcon_1.default, { ml: 1, my: 0.5, order: sortOrder })))));
 });
 exports.Th.displayName = 'Th';
 exports.default = exports.Th;

package/dist/esm/header/header.types.d.ts

@@ -91,7 +91,7 @@ export type LoggedInHeaderProps = HeaderProps & {
     notifications?: HeaderNotificationsData | JSX.Element;
     /** Socket for services menu icon on the right side. */
     services?: HeaderServicesData | JSX.Element;
-    /** Socket for showing the alt user Info with role; introduced for APP; by default it is true. */
+    /** Socket for showing the 'alternative' user Info with role (alternative: 3 lines, role. default: 2 lines, no role); introduced for APP; by default it is true. */
     showAltUserInfo?: boolean;
     /** Socket for showing the services trigger up front; introduced for APP; by default it is displayed. */
     showServices?: boolean;

package/dist/esm/header/header.types.d.ts.map

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

package/dist/esm/header/loggedInHeader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"loggedInHeader.d.ts","sourceRoot":"","sources":["../../../src/header/loggedInHeader.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAkB,mBAAmB,EAAE,MAAM,gBAAgB,CAAA;AAIpE,uHAAuH;AACvH,eAAO,MAAM,cAAc,4DA+JzB,CAAA;AAIF,eAAe,cAAc,CAAA"}
+{"version":3,"file":"loggedInHeader.d.ts","sourceRoot":"","sources":["../../../src/header/loggedInHeader.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAkB,mBAAmB,EAAE,MAAM,gBAAgB,CAAA;AAIpE,uHAAuH;AACvH,eAAO,MAAM,cAAc,4DA4JzB,CAAA;AAIF,eAAe,cAAc,CAAA"}

package/dist/esm/header/loggedInHeader.js

@@ -37,11 +37,6 @@ export const LoggedInHeader = vui((props, ref) => {
                     showMainLinks && mainLinks !== undefined && (React.createElement(React.Fragment, null,
                         isJsx(mainLinks) ? mainLinks : React.createElement(Header.MainLinks, { links: mainLinks }),
                         React.createElement(Header.Divider, { mx: 1 }))),
-                    !showMainLinks &&
-                        showAltUserInfo &&
-                        (isJsx(userInfo) ? (userInfo) : (React.createElement(React.Fragment, null,
-                            React.createElement(HeaderAccountUserInfo, { className: "vui-altUserInfo", color: localTextColor, isApplication: true, ...userInfo }),
-                            React.createElement(Header.Divider, { mx: 1 })))),
                     !showMainLinks && mainLinks && (React.createElement(React.Fragment, null,
                         React.createElement(Header.MobileToggle, { ml: 0 }),
                         React.createElement(Header.MobileContent, null,
@@ -57,6 +52,11 @@ export const LoggedInHeader = vui((props, ref) => {
                 mainLinks !== undefined && React.createElement(Header.Divider, { mx: 1 }),
                 isJsx(services) ? services : React.createElement(Header.Services, { ...services }))),
             isJsx(notifications) ? notifications : React.createElement(Header.Notifications, { ...notifications }),
+            !showMainLinks &&
+                showAltUserInfo &&
+                (isJsx(userInfo) ? (userInfo) : (React.createElement(React.Fragment, null,
+                    React.createElement(Header.Divider, { ml: 2 }),
+                    React.createElement(HeaderAccountUserInfo, { className: "vui-altUserInfo", color: localTextColor, isApplication: true, ...userInfo })))),
             isJsx(account) ? account : React.createElement(Header.Account, { ...account }),
             React.createElement(RenderOnScreen, { maxWidth: "lg" },
                 isApplication && React.createElement(Header.Divider, { ml: 1 }),

package/dist/esm/sidemenu/sidemenu.js

@@ -11,17 +11,17 @@ import SidemenuTop from './sidemenuTop';
 /** A collapsible side menu for navigation. */
 export const Sidemenu = vui((props, ref) => {
     const { children, className, items, isExpanded = false, isSticky = false, size, variant, width = 280, onNavigate, ...rest } = props;
-    const [isExpandedInternal, setIsExpandedInternal] = useState(isExpanded);
-    const context = useMemo(() => filterUndefined({ size, variant, isExpandedInternal }), [size, variant, isExpandedInternal]);
+    const [isExpandedHorizontally, setIsExpandedHorizontally] = useState(isExpanded);
+    const context = useMemo(() => filterUndefined({ size, variant, isExpandedHorizontally }), [size, variant, isExpandedHorizontally]);
     const styles = useStyleConfig('Sidemenu', props);
     const isDark = variant === 'dark';
     useEffect(() => {
-        setIsExpandedInternal(isExpanded);
+        setIsExpandedHorizontally(isExpanded);
     }, [isExpanded]);
-    const onToggle = () => setIsExpandedInternal(!isExpandedInternal);
-    const w = isExpandedInternal ? width : expandedWidth;
-    const icon = `falArrow${isExpandedInternal ? 'Left' : 'Right'}`;
-    const justifyContent = isExpandedInternal ? 'flex-end' : 'center';
+    const onToggle = () => setIsExpandedHorizontally(!isExpandedHorizontally);
+    const w = isExpandedHorizontally ? width : expandedWidth;
+    const icon = `falArrow${isExpandedHorizontally ? 'Left' : 'Right'}`;
+    const justifyContent = isExpandedHorizontally ? 'flex-end' : 'center';
     function onItemClick(item) {
         item?.onClick?.();
         if (item?.path)

package/dist/esm/sidemenu/sidemenu.types.d.ts

@@ -26,8 +26,14 @@ export type SidemenuItemProps = BoxProps & {
     iconSize?: 'md' | 'sm';
     /** Whether the item is active */
     isActive?: boolean;
+    /** Whether the item is expanded vertically */
+    isExpanded?: boolean;
     /** On click callback */
     onClick?: () => void;
+    /** On collapse callback @default true */
+    onCollapse?: () => void;
+    /** On expand callback */
+    onExpand?: () => void;
     /** Router path */
     path?: string;
     /** Title */

package/dist/esm/sidemenu/sidemenu.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sidemenu.types.d.ts","sourceRoot":"","sources":["../../../src/sidemenu/sidemenu.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEjC,OAAO,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAA;AACjC,OAAO,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAClC,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AACvC,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAEvC,MAAM,MAAM,mBAAmB,GAAG,UAAU,GAAG,YAAY,CAAA;AAE3D,MAAM,MAAM,aAAa,GAAG,WAAW,GACrC,YAAY,CAAC,UAAU,CAAC,GAAG;IACzB,gCAAgC;IAChC,KAAK,CAAC,EAAE,iBAAiB,EAAE,CAAA;IAC3B,mDAAmD;IACnD,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,8JAA8J;IAC9J,UAAU,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAA;IACjC,yEAAyE;IACzE,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CAAA;AAEH,MAAM,MAAM,iBAAiB,GAAG,QAAQ,GAAG;IACzC,wBAAwB;IACxB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,eAAe;IACf,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,wBAAwB;IACxB,IAAI,EAAE,QAAQ,CAAA;IACd,6BAA6B;IAC7B,QAAQ,CAAC,EAAE,IAAI,GAAG,IAAI,CAAA;IACtB,iCAAiC;IACjC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,wBAAwB;IACxB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,kBAAkB;IAClB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,YAAY;IACZ,KAAK,EAAE,MAAM,CAAA;CACd,CAAA;AAED,MAAM,MAAM,gBAAgB,GAAG,QAAQ,GAAG;IACxC,wBAAwB;IACxB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,iCAAiC;IACjC,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,sDAAsD;IACtD,SAAS,CAAC,EAAE,SAAS,CAAA;CACtB,CAAA"}
+{"version":3,"file":"sidemenu.types.d.ts","sourceRoot":"","sources":["../../../src/sidemenu/sidemenu.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEjC,OAAO,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAA;AACjC,OAAO,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAClC,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AACvC,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAEvC,MAAM,MAAM,mBAAmB,GAAG,UAAU,GAAG,YAAY,CAAA;AAE3D,MAAM,MAAM,aAAa,GAAG,WAAW,GACrC,YAAY,CAAC,UAAU,CAAC,GAAG;IACzB,gCAAgC;IAChC,KAAK,CAAC,EAAE,iBAAiB,EAAE,CAAA;IAC3B,mDAAmD;IACnD,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,8JAA8J;IAC9J,UAAU,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAA;IACjC,yEAAyE;IACzE,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CAAA;AAEH,MAAM,MAAM,iBAAiB,GAAG,QAAQ,GAAG;IACzC,wBAAwB;IACxB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,eAAe;IACf,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,wBAAwB;IACxB,IAAI,EAAE,QAAQ,CAAA;IACd,6BAA6B;IAC7B,QAAQ,CAAC,EAAE,IAAI,GAAG,IAAI,CAAA;IACtB,iCAAiC;IACjC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,8CAA8C;IAC9C,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,wBAAwB;IACxB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,yCAAyC;IACzC,UAAU,CAAC,EAAE,MAAM,IAAI,CAAA;IACvB,yBAAyB;IACzB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,kBAAkB;IAClB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,YAAY;IACZ,KAAK,EAAE,MAAM,CAAA;CACd,CAAA;AAED,MAAM,MAAM,gBAAgB,GAAG,QAAQ,GAAG;IACxC,wBAAwB;IACxB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,iCAAiC;IACjC,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,sDAAsD;IACtD,SAAS,CAAC,EAAE,SAAS,CAAA;CACtB,CAAA"}

package/dist/esm/sidemenu/sidemenuItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sidemenuItem.d.ts","sourceRoot":"","sources":["../../../src/sidemenu/sidemenuItem.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAyC,YAAY,EAAE,MAAM,SAAS,CAAA;AAM7E,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAA;AAEpD,mBAAmB;AACnB,eAAO,MAAM,YAAY,wCA+EmB,CAAA;AAI5C,eAAe,YAAY,CAAA"}
+{"version":3,"file":"sidemenuItem.d.ts","sourceRoot":"","sources":["../../../src/sidemenu/sidemenuItem.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAyB,YAAY,EAAE,MAAM,SAAS,CAAA;AAK7D,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAA;AAGpD,mBAAmB;AACnB,eAAO,MAAM,YAAY,wCAiGmB,CAAA;AAI5C,eAAe,YAAY,CAAA"}

package/dist/esm/sidemenu/sidemenuItem.js

@@ -1,33 +1,36 @@
-import React, { useState } from 'react';
+import React, { useEffect } from 'react';
 import Box from '../box';
 import Button from '../button';
-import { omitThemingProps, useStyleConfig, vui } from '../core';
+import { omitThemingProps, vui } from '../core';
 import Icon from '../icon';
 import { Popover } from '../popover';
 import T from '../t';
 import { cs } from '../utils';
-import { useSidemenuContext } from './context';
+import useSidemenuItem from './useSidemenuItem';
 /** A menu item. */
 export const SidemenuItem = vui((props, ref) => {
-    const { className, children, icon, iconSize = 'md', isActive, onClick, title, ...rest } = omitThemingProps(props);
-    const [displayChildren, setDisplayChildren] = useState(true);
-    const { variant, size, isExpandedInternal } = useSidemenuContext();
-    const styles = useStyleConfig('Sidemenu', useSidemenuContext);
-    const isDark = variant === 'dark';
-    const hasChildrenExpanded = !!children && isExpandedInternal;
+    const { className, children, icon, iconSize = 'md', isActive, isExpanded = true, onClick, onCollapse, onExpand, title, ...rest } = omitThemingProps(props);
+    const { isExpandedVertically, setIsExpandedVertically, isDark, size, isExpandedHorizontally, styles } = useSidemenuItem(isExpanded);
+    useEffect(() => {
+        if (isExpandedVertically)
+            onExpand?.();
+        if (!isExpandedVertically)
+            onCollapse?.();
+    }, [isExpandedVertically]);
+    const hasChildrenExpanded = !!children && isExpandedHorizontally;
     const innerContent = (React.createElement(Box, { centerV: true, px: 2, py: 1, w: "100%", whiteSpace: "pre" },
         React.createElement(Icon, { ml: iconSize === 'sm' ? '4px' : 0, name: icon, size: iconSize }),
         React.createElement(T, { isTruncated: true, ml: 2 }, title)));
     const toggle = (e) => {
         e.preventDefault();
         e.stopPropagation();
-        setDisplayChildren(!displayChildren);
+        setIsExpandedVertically(!isExpandedVertically);
     };
     const buttonStyles = {
         alignItems: 'center',
         border: 'none',
         borderRadius: 0,
-        borderLeft: '3px solid transparent',
+        borderLeft: !hasChildrenExpanded && children ? 'none' : '3px solid transparent',
         borderLeftColor: isActive ? (isDark ? 'digiGreen.main' : 'seaBlue.main') : undefined,
         bg: isDark ? 'darkBlue.main' : isActive ? 'skyBlue.95' : 'white',
         color: hasChildrenExpanded ? 'seaBlue.main' : isDark ? 'digiGreen.main' : 'sandstone.10',
@@ -44,13 +47,13 @@ export const SidemenuItem = vui((props, ref) => {
     };
     return (React.createElement(Box, { flexDirection: "column", ref: ref, w: "100%" },
         !hasChildrenExpanded && children ? (React.createElement(Popover, { offset: [0, 0], placement: "right-start", trigger: "mouseenter" },
-            React.createElement(Popover.Trigger, { className: cs('vui-sidemenu-item-popover', className), ...buttonStyles },
-                React.createElement(Box, { borderLeft: `3px solid ${isDark ? 'digiGreen.main' : 'seaBlue.main'}` }, innerContent)),
-            React.createElement(Popover.Content, { shadow: 'none' },
+            React.createElement(Popover.Trigger, { as: Box, className: cs('vui-sidemenu-item-popover', className) },
+                React.createElement(Box, { ...buttonStyles, borderLeft: `3px solid ${isDark ? 'digiGreen.main' : 'seaBlue.main'}` }, innerContent)),
+            React.createElement(Popover.Content, { shadow: "none" },
                 React.createElement(Box, { flexDirection: "column", justifyContent: "start", w: "100%" }, children)))) : (React.createElement(Button, { className: cs('vui-sidemenu-item', className), ...buttonStyles },
             innerContent,
-            hasChildrenExpanded && (React.createElement(Button, { className: "vui-sidemenu-item-expand", icon: displayChildren ? 'falChevronUp' : 'falChevronDown', mr: 1, onClick: toggle, size: "sm", variant: isDark ? 'tertiaryLight' : 'tertiaryDark' })))),
-        !!children && hasChildrenExpanded && displayChildren && (React.createElement(Box, { flexDirection: "column", justifyContent: "start", w: "100%" }, children))));
+            hasChildrenExpanded && (React.createElement(Button, { className: "vui-sidemenu-item-expand", icon: isExpandedVertically ? 'falChevronUp' : 'falChevronDown', mr: 1, onClick: toggle, size: "sm", variant: isDark ? 'tertiaryLight' : 'tertiaryDark' })))),
+        !!children && hasChildrenExpanded && isExpandedVertically && (React.createElement(Box, { flexDirection: "column", justifyContent: "start", w: "100%" }, children))));
 });
 SidemenuItem.displayName = 'SidemenuItem';
 export default SidemenuItem;

package/dist/esm/sidemenu/sidemenuTop.js

@@ -7,12 +7,12 @@ import { useSidemenuContext } from './context';
 export const SidemenuTop = (props) => {
     const { className, leftSlot, rightSlot, ...rest } = omitThemingProps(props);
     const styles = useStyleConfig('Sidemenu', props);
-    const { isExpandedInternal } = useSidemenuContext();
+    const { isExpandedHorizontally } = useSidemenuContext();
     if (!leftSlot && !rightSlot)
         return null;
     return (React.createElement(Box, { className: cs('vui-sidemenu-top', className), mb: 1, w: "100%", ...styles.sidemenuTop, ...rest },
         !!leftSlot && leftSlot,
-        !!rightSlot && isExpandedInternal && rightSlot));
+        !!rightSlot && isExpandedHorizontally && rightSlot));
 };
 SidemenuTop.displayName = 'SidemenuTop';
 export default SidemenuTop;

package/dist/esm/sidemenu/useSidemenuItem.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+declare const useSidemenuItem: (isExpanded: boolean) => {
+    isExpandedVertically: boolean;
+    isDark: boolean;
+    size: any;
+    isExpandedHorizontally: any;
+    styles: import("..").Dict<any>;
+    setIsExpandedVertically: import("react").Dispatch<import("react").SetStateAction<boolean>>;
+};
+export default useSidemenuItem;
+//# sourceMappingURL=useSidemenuItem.d.ts.map

package/dist/esm/sidemenu/useSidemenuItem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSidemenuItem.d.ts","sourceRoot":"","sources":["../../../src/sidemenu/useSidemenuItem.ts"],"names":[],"mappings":";AAKA,QAAA,MAAM,eAAe,eAAgB,OAAO;;;;;;;CAiB3C,CAAA;AAED,eAAe,eAAe,CAAA"}

package/dist/esm/sidemenu/useSidemenuItem.js

@@ -0,0 +1,21 @@
+import { useEffect, useState } from 'react';
+import { useStyleConfig } from '../core';
+import { useSidemenuContext } from './context';
+const useSidemenuItem = (isExpanded) => {
+    const [isExpandedVertically, setIsExpandedVertically] = useState(isExpanded);
+    const { variant, size, isExpandedHorizontally } = useSidemenuContext();
+    const styles = useStyleConfig('Sidemenu', useSidemenuContext);
+    useEffect(() => {
+        if (isExpanded !== isExpandedVertically)
+            setIsExpandedVertically(isExpanded);
+    }, [isExpanded]);
+    return {
+        isExpandedVertically,
+        isDark: variant === 'dark',
+        size,
+        isExpandedHorizontally,
+        styles,
+        setIsExpandedVertically
+    };
+};
+export default useSidemenuItem;

package/dist/esm/table/th.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"th.d.ts","sourceRoot":"","sources":["../../../src/table/th.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AAGvC,eAAO,MAAM,MAAM,8HAIlB,CAAA;AAED,oDAAoD;AACpD,eAAO,MAAM,EAAE,+CA+Db,CAAA;AAIF,eAAe,EAAE,CAAA"}
+{"version":3,"file":"th.d.ts","sourceRoot":"","sources":["../../../src/table/th.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AAGvC,eAAO,MAAM,MAAM,8HAIlB,CAAA;AAED,oDAAoD;AACpD,eAAO,MAAM,EAAE,+CA8Db,CAAA;AAIF,eAAe,EAAE,CAAA"}

package/dist/esm/table/th.js

@@ -1,7 +1,6 @@
 import React from 'react';
 import Box from '../box';
 import { styled, useStyleConfig, vui } from '../core';
-import { T } from '../t';
 import { cs, useCallbackRef } from '../utils';
 import { useTableContext } from './context';
 import TableSortIcon from './tableSortIcon';
@@ -35,11 +34,9 @@ export const Th = vui((props, ref) => {
             userSelect: 'none'
         }
         : {};
-    return (React.createElement(ThBase, { className: cs('vui-th', className), "data-active": isActive, "data-disabled": disabled, hoverBg: hoverBg, px: 2, ref: ref, ...styles.th, ...activeProps, ...disabledProps, ...interactiveProps, ...rest },
-        children ?? (React.createElement(Box, { centerV: true, display: "inline-flex" },
-            title,
-            isSortable && React.createElement(TableSortIcon, { ml: 1, my: 0.5, order: sortOrder }))),
-        !title && React.createElement(T, { color: "white" }, "a11y fix")));
+    return (React.createElement(ThBase, { className: cs('vui-th', className), "data-active": isActive, "data-disabled": disabled, hoverBg: hoverBg, px: 2, ref: ref, ...styles.th, ...activeProps, ...disabledProps, ...interactiveProps, ...rest }, children ?? (React.createElement(Box, { centerV: true, display: "inline-flex" },
+        title,
+        isSortable && React.createElement(TableSortIcon, { ml: 1, my: 0.5, order: sortOrder })))));
 });
 Th.displayName = 'Th';
 export default Th;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@veracity/vui",
-  "version": "2.14.5",
+  "version": "2.14.6-beta.1",
   "description": "Veracity UI is a React component library crafted for use within Veracity applications and pages. Based on Styled Components and @xstyled.",
   "module": "./dist/esm/index.js",
   "main": "./dist/cjs/index.js",

package/src/header/header.types.ts

@@ -110,7 +110,7 @@ export type LoggedInHeaderProps = HeaderProps & {
   notifications?: HeaderNotificationsData | JSX.Element
   /** Socket for services menu icon on the right side. */
   services?: HeaderServicesData | JSX.Element
-  /** Socket for showing the alt user Info with role; introduced for APP; by default it is true. */
+  /** Socket for showing the 'alternative' user Info with role (alternative: 3 lines, role. default: 2 lines, no role); introduced for APP; by default it is true. */
   showAltUserInfo?: boolean
   /** Socket for showing the services trigger up front; introduced for APP; by default it is displayed. */
   showServices?: boolean

package/src/header/loggedInHeader.tsx

@@ -73,21 +73,6 @@ export const LoggedInHeader = vui<'div', LoggedInHeaderProps>((props, ref) => {
                   <Header.Divider mx={1} />
                 </>
               )}
-              {!showMainLinks &&
-                showAltUserInfo &&
-                (isJsx(userInfo) ? (
-                  userInfo
-                ) : (
-                  <>
-                    <HeaderAccountUserInfo
-                      className="vui-altUserInfo"
-                      color={localTextColor}
-                      isApplication
-                      {...userInfo}
-                    />
-                    <Header.Divider mx={1} />
-                  </>
-                ))}
 
               {/* the main-links are folded into the hamburger menu by default */}
               {!showMainLinks && mainLinks && (
@@ -152,6 +137,18 @@ export const LoggedInHeader = vui<'div', LoggedInHeaderProps>((props, ref) => {
           </RenderOnScreen>
         )}
         {isJsx(notifications) ? notifications : <Header.Notifications {...notifications} />}
+
+        {!showMainLinks &&
+          showAltUserInfo &&
+          (isJsx(userInfo) ? (
+            userInfo
+          ) : (
+            <>
+              <Header.Divider ml={2} />
+              <HeaderAccountUserInfo className="vui-altUserInfo" color={localTextColor} isApplication {...userInfo} />
+            </>
+          ))}
+
         {isJsx(account) ? account : <Header.Account {...account} />}
         <RenderOnScreen maxWidth="lg">
           {isApplication && <Header.Divider ml={1} />}

package/src/sidemenu/sidemenu.tsx

@@ -26,10 +26,10 @@ export const Sidemenu = vui<'div', SidemenuProps>((props, ref) => {
     ...rest
   } = props
 
-  const [isExpandedInternal, setIsExpandedInternal] = useState(isExpanded)
+  const [isExpandedHorizontally, setIsExpandedHorizontally] = useState(isExpanded)
   const context = useMemo(
-    () => filterUndefined({ size, variant, isExpandedInternal }),
-    [size, variant, isExpandedInternal]
+    () => filterUndefined({ size, variant, isExpandedHorizontally }),
+    [size, variant, isExpandedHorizontally]
   )
 
   const styles = useStyleConfig('Sidemenu', props)
@@ -37,14 +37,14 @@ export const Sidemenu = vui<'div', SidemenuProps>((props, ref) => {
   const isDark = variant === 'dark'
 
   useEffect(() => {
-    setIsExpandedInternal(isExpanded)
+    setIsExpandedHorizontally(isExpanded)
   }, [isExpanded])
 
-  const onToggle = () => setIsExpandedInternal(!isExpandedInternal)
+  const onToggle = () => setIsExpandedHorizontally(!isExpandedHorizontally)
 
-  const w = isExpandedInternal ? width : expandedWidth
-  const icon = `falArrow${isExpandedInternal ? 'Left' : 'Right'}`
-  const justifyContent = isExpandedInternal ? 'flex-end' : 'center'
+  const w = isExpandedHorizontally ? width : expandedWidth
+  const icon = `falArrow${isExpandedHorizontally ? 'Left' : 'Right'}`
+  const justifyContent = isExpandedHorizontally ? 'flex-end' : 'center'
 
   function onItemClick(item: SidemenuItemProps) {
     item?.onClick?.()

package/src/sidemenu/sidemenu.types.ts

@@ -31,8 +31,14 @@ export type SidemenuItemProps = BoxProps & {
   iconSize?: 'md' | 'sm'
   /** Whether the item is active */
   isActive?: boolean
+  /** Whether the item is expanded vertically */
+  isExpanded?: boolean
   /** On click callback */
   onClick?: () => void
+  /** On collapse callback @default true */
+  onCollapse?: () => void
+  /** On expand callback */
+  onExpand?: () => void
   /** Router path */
   path?: string
   /** Title */

package/src/sidemenu/sidemenuItem.tsx

@@ -1,24 +1,40 @@
-import React, { MouseEvent, useState } from 'react'
+import React, { MouseEvent, useEffect } from 'react'
 
 import Box from '../box'
 import Button from '../button'
-import { omitThemingProps, useStyleConfig, vui, VuiComponent } from '../core'
+import { omitThemingProps, vui, VuiComponent } from '../core'
 import Icon from '../icon'
 import { Popover } from '../popover'
 import T from '../t'
 import { cs } from '../utils'
-import { useSidemenuContext } from './context'
 import { SidemenuItemProps } from './sidemenu.types'
+import useSidemenuItem from './useSidemenuItem'
 
 /** A menu item. */
 export const SidemenuItem = vui<'button', SidemenuItemProps>((props, ref) => {
-  const { className, children, icon, iconSize = 'md', isActive, onClick, title, ...rest } = omitThemingProps(props)
-  const [displayChildren, setDisplayChildren] = useState(true)
-  const { variant, size, isExpandedInternal } = useSidemenuContext()
-  const styles = useStyleConfig('Sidemenu', useSidemenuContext)
+  const {
+    className,
+    children,
+    icon,
+    iconSize = 'md',
+    isActive,
+    isExpanded = true,
+    onClick,
+    onCollapse,
+    onExpand,
+    title,
+    ...rest
+  } = omitThemingProps(props)
+
+  const { isExpandedVertically, setIsExpandedVertically, isDark, size, isExpandedHorizontally, styles } =
+    useSidemenuItem(isExpanded)
 
-  const isDark = variant === 'dark'
-  const hasChildrenExpanded = !!children && isExpandedInternal
+  useEffect(() => {
+    if (isExpandedVertically) onExpand?.()
+    if (!isExpandedVertically) onCollapse?.()
+  }, [isExpandedVertically])
+
+  const hasChildrenExpanded = !!children && isExpandedHorizontally
 
   const innerContent = (
     <Box centerV px={2} py={1} w="100%" whiteSpace="pre">
@@ -32,14 +48,14 @@ export const SidemenuItem = vui<'button', SidemenuItemProps>((props, ref) => {
   const toggle = (e: MouseEvent<HTMLButtonElement>) => {
     e.preventDefault()
     e.stopPropagation()
-    setDisplayChildren(!displayChildren)
+    setIsExpandedVertically(!isExpandedVertically)
   }
 
   const buttonStyles = {
     alignItems: 'center',
     border: 'none',
     borderRadius: 0,
-    borderLeft: '3px solid transparent',
+    borderLeft: !hasChildrenExpanded && children ? 'none' : '3px solid transparent',
     borderLeftColor: isActive ? (isDark ? 'digiGreen.main' : 'seaBlue.main') : undefined,
     bg: isDark ? 'darkBlue.main' : isActive ? 'skyBlue.95' : 'white',
     color: hasChildrenExpanded ? 'seaBlue.main' : isDark ? 'digiGreen.main' : 'sandstone.10',
@@ -59,10 +75,12 @@ export const SidemenuItem = vui<'button', SidemenuItemProps>((props, ref) => {
     <Box flexDirection="column" ref={ref} w="100%">
       {!hasChildrenExpanded && children ? (
         <Popover offset={[0, 0]} placement="right-start" trigger="mouseenter">
-          <Popover.Trigger className={cs('vui-sidemenu-item-popover', className)} {...buttonStyles}>
-            <Box borderLeft={`3px solid ${isDark ? 'digiGreen.main' : 'seaBlue.main'}`}>{innerContent}</Box>
+          <Popover.Trigger as={Box} className={cs('vui-sidemenu-item-popover', className)}>
+            <Box {...buttonStyles} borderLeft={`3px solid ${isDark ? 'digiGreen.main' : 'seaBlue.main'}`}>
+              {innerContent}
+            </Box>
           </Popover.Trigger>
-          <Popover.Content shadow={'none'}>
+          <Popover.Content shadow="none">
             <Box flexDirection="column" justifyContent="start" w="100%">
               {children}
             </Box>
@@ -74,7 +92,7 @@ export const SidemenuItem = vui<'button', SidemenuItemProps>((props, ref) => {
           {hasChildrenExpanded && (
             <Button
               className="vui-sidemenu-item-expand"
-              icon={displayChildren ? 'falChevronUp' : 'falChevronDown'}
+              icon={isExpandedVertically ? 'falChevronUp' : 'falChevronDown'}
               mr={1}
               onClick={toggle}
               size="sm"
@@ -83,7 +101,7 @@ export const SidemenuItem = vui<'button', SidemenuItemProps>((props, ref) => {
           )}
         </Button>
       )}
-      {!!children && hasChildrenExpanded && displayChildren && (
+      {!!children && hasChildrenExpanded && isExpandedVertically && (
         <Box flexDirection="column" justifyContent="start" w="100%">
           {children}
         </Box>

package/src/sidemenu/sidemenuTop.tsx

@@ -10,14 +10,14 @@ import { SidemenuTopProps } from './sidemenu.types'
 export const SidemenuTop = (props: SidemenuTopProps) => {
   const { className, leftSlot, rightSlot, ...rest } = omitThemingProps(props)
   const styles = useStyleConfig('Sidemenu', props)
-  const { isExpandedInternal } = useSidemenuContext()
+  const { isExpandedHorizontally } = useSidemenuContext()
 
   if (!leftSlot && !rightSlot) return null
 
   return (
     <Box className={cs('vui-sidemenu-top', className)} mb={1} w="100%" {...styles.sidemenuTop} {...rest}>
       {!!leftSlot && leftSlot}
-      {!!rightSlot && isExpandedInternal && rightSlot}
+      {!!rightSlot && isExpandedHorizontally && rightSlot}
     </Box>
   )
 }

package/src/sidemenu/useSidemenuItem.ts

@@ -0,0 +1,25 @@
+import { useEffect, useState } from 'react'
+
+import { useStyleConfig } from '../core'
+import { useSidemenuContext } from './context'
+
+const useSidemenuItem = (isExpanded: boolean) => {
+  const [isExpandedVertically, setIsExpandedVertically] = useState(isExpanded)
+  const { variant, size, isExpandedHorizontally } = useSidemenuContext()
+  const styles = useStyleConfig('Sidemenu', useSidemenuContext)
+
+  useEffect(() => {
+    if (isExpanded !== isExpandedVertically) setIsExpandedVertically(isExpanded)
+  }, [isExpanded])
+
+  return {
+    isExpandedVertically,
+    isDark: variant === 'dark',
+    size,
+    isExpandedHorizontally,
+    styles,
+    setIsExpandedVertically
+  }
+}
+
+export default useSidemenuItem

package/src/table/th.tsx

@@ -2,7 +2,6 @@ import React from 'react'
 
 import Box from '../box'
 import { styled, useStyleConfig, vui } from '../core'
-import { T } from '../t'
 import { cs, MouseEvent, useCallbackRef } from '../utils'
 import { useTableContext } from './context'
 import { ThProps } from './table.types'
@@ -75,7 +74,6 @@ export const Th = vui<'th', ThProps>((props, ref) => {
           {isSortable && <TableSortIcon ml={1} my={0.5} order={sortOrder} />}
         </Box>
       )}
-      {!title && <T color="white">a11y fix</T>}
     </ThBase>
   )
 })