@hexure/ui 1.13.86 → 1.13.87

package/dist/cjs/types/components/AppMenu/AppMenu.d.ts

@@ -18,6 +18,7 @@ export interface AppMenuProps extends AccessibleProps {
     footerTag?: string;
     defaultWidth?: string;
     dataItemid?: string;
+    onChange?: (isCollapsed: boolean) => void;
 }
 declare const AppMenu: FC<AppMenuProps>;
 export default AppMenu;

package/dist/esm/index.js

@@ -3287,10 +3287,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 = useContext(ThemeContext) || EditableTheme;
     const [collapsed, toggleCollapse] = useState(isCollapsed);
     const baseId = dataItemid || 'app-menu';
+    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}`;
@@ -3313,6 +3316,9 @@ const AppMenu = ({ menu, isCollapsed, footerTag, defaultWidth = '280px', dataIte
             React.createElement(Button, { dataItemid: `${baseId}-collapse-button`, icon: collapsed ? mdiChevronRight : mdiChevronLeft, onClick: (e) => {
                     e.preventDefault();
                     toggleCollapse(!collapsed);
+                    if (onChange) {
+                        onChange(!collapsed);
+                    }
                 }, small: true, type: 'button' }))));
 };