@hexure/ui 1.13.86 → 1.13.88

package/dist/cjs/index.js

@@ -3289,10 +3289,13 @@ const FooterInfo = styled.div `
 const SidebarMenuContainer = styled.div `
   flex-grow: 1;
 `;
-const AppMenu = ({ menu, isCollapsed, footerTag, defaultWidth = '280px', dataItemid, }) => {
+const AppMenu = ({ menu, isCollapsed, footerTag, defaultWidth = '280px', dataItemid, onChange, }) => {
     const theme = React.useContext(styled.ThemeContext) || EditableTheme;
     const [collapsed, toggleCollapse] = React.useState(isCollapsed);
     const baseId = dataItemid || 'app-menu';
+    React.useEffect(() => {
+        toggleCollapse(isCollapsed);
+    }, [isCollapsed]);
     return (React.createElement(SidebarContainer, { "$isOpen": !collapsed, "$width": defaultWidth, "data-itemid": `${baseId}-sidebar-container` },
         React.createElement(SidebarMenuContainer, { "data-itemid": `${baseId}-sidebar-menu-container` }, menu.map((nav_item, navIndex) => {
             const navItemId = `${baseId}-nav-item-${navIndex}`;
@@ -3315,6 +3318,9 @@ const AppMenu = ({ menu, isCollapsed, footerTag, defaultWidth = '280px', dataIte
             React.createElement(Button, { dataItemid: `${baseId}-collapse-button`, icon: collapsed ? js.mdiChevronRight : js.mdiChevronLeft, onClick: (e) => {
                     e.preventDefault();
                     toggleCollapse(!collapsed);
+                    if (onChange) {
+                        onChange(!collapsed);
+                    }
                 }, small: true, type: 'button' }))));
 };
 
@@ -3452,7 +3458,7 @@ const MoreMenu = (_a) => {
     return (React.createElement(Wrapper$c, Object.assign({ "$maxHeight": maxHeight }, accessibleProps, { "data-itemid": `${baseId}-wrapper` }), menuItems.map((item, i) => {
         var _a;
         const itemId = `${baseId}`;
-        return (React.createElement(MenuItem, { "data-itemid": `${itemId}-menu-item`, key: i, onClick: item.onClick },
+        return (React.createElement(MenuItem, { className: item === null || item === void 0 ? void 0 : item.className, "data-itemid": `${itemId}-menu-item`, key: i, onClick: item.onClick },
             item.icon ? (React.createElement(Icon, { color: item.disabled ? Colors.LIGHT_GRAY.Hex : Colors.MEDIUM_GRAY.Hex, "data-itemid": `${itemId}-icon`, path: item.icon, size: '20px' })) : null,
             React.createElement(Title$1, { "data-itemid": `${itemId}-title`, disabled: (_a = item.disabled) !== null && _a !== void 0 ? _a : false }, item.label)));
     })));