@aiquants/menu-bar 1.14.0 → 1.15.1

package/README.md

@@ -28,13 +28,13 @@ export { MenuBar } from '@aiquants/menu-bar';
 export { SessionInfo, DefaultLink } from '@aiquants/menu-bar';
 
 // Types
-export type { IMenu, ISubmenu } from '@aiquants/menu-bar';
+export type { IMenu, ISubmenu, MenuNavigationPayload } from '@aiquants/menu-bar';
 export type { Theme } from '@aiquants/menu-bar';
 export type { SessionInfoProps, LinkProps } from '@aiquants/menu-bar';
-export type { UserProfile, UserPhoto } from '@aiquants/menu-bar';
+export type { UserProfile } from '@aiquants/menu-bar';
 
 // CSS (import separately)
-import '@aiquants/menu-bar/css';
+import '@aiquants/menu-bar/styles/menu-bar.css';
 ```
 
 ## Basic Usage
@@ -42,7 +42,7 @@ import '@aiquants/menu-bar/css';
 ```tsx
 import React, { useState } from 'react';
 import { MenuBar } from '@aiquants/menu-bar';
-import '@aiquants/menu-bar/css';
+import '@aiquants/menu-bar/styles/menu-bar.css';
 
 function App() {
   const [theme, setTheme] = useState('light');
@@ -99,6 +99,11 @@ function App() {
 | `onClickSignout` | `() => void` | Yes | Callback function for sign out action |
 | `menuHeader` | `React.ReactNode` | No | Optional header content for the menu |
 | `isMenuhide` | `boolean` | No | Whether to hide the menu bar entirely |
+| `onMenuNavigate` | `(payload: MenuNavigationPayload) => void` | No | Callback function triggered when a menu or submenu item is selected |
+| `onPinChange` | `(pinned: boolean) => void` | No | Callback function triggered when the menu bar's pin state changes |
+| `pinnedSubmenuIds` | `number[]` | No | Pinned submenu IDs (controlled) |
+| `initialPinnedSubmenuIds` | `number[]` | No | Initial pinned submenu IDs |
+| `onSubmenuPinChange` | `(pinnedIds: number[]) => void` | No | Callback function triggered when submenu pin states change |
 
 ### IMenu Type
 
@@ -123,18 +128,23 @@ interface ISubmenu {
 }
 ```
 
+### MenuNavigationPayload Type
+
+```tsx
+type MenuNavigationPayload = {
+  menu: Pick<IMenu, 'id' | 'title' | 'href'>;
+  submenu?: Pick<ISubmenu, 'subid' | 'title' | 'href' | 'mark' | 'new'>;
+};
+```
+
 ### UserProfile Type
 
 ```tsx
 interface UserProfile {
   displayName: string;
-  photos: UserPhoto[];
+  photo: string;
   id?: string;
 }
-
-interface UserPhoto {
-  value: string;
-}
 ```
 
 ### SessionInfoProps Type
@@ -275,7 +285,7 @@ import { SessionInfo } from '@aiquants/menu-bar';
 <SessionInfo
   user={{
     displayName: "John Doe",
-    photos: [{ value: "https://example.com/avatar.jpg" }]
+    photo: "https://example.com/avatar.jpg"
   }}
   onLogout={() => console.log('Logout')}
   LinkComponent={({ to, children, ...props }) => (

package/dist/MenuBar.d.ts

@@ -22,6 +22,9 @@ interface IMenuBarProps {
     toggleTheme: () => void;
     onMenuNavigate?(payload: MenuNavigationPayload): void;
     onPinChange?(pinned: boolean): void;
+    pinnedSubmenuIds?: number[];
+    initialPinnedSubmenuIds?: number[];
+    onSubmenuPinChange?(pinnedIds: number[]): void;
 }
 /**
  * @function MenuBar

package/dist/contents/MenuContent.d.ts

@@ -25,6 +25,8 @@ interface IMenuContentProps {
     toggleTheme: () => void;
     isPinned: boolean;
     onTogglePin(): void;
+    pinnedSubmenuIds: number[];
+    onToggleSubmenuPin(id: number): void;
 }
 /**
  * Renders the content of the menu bar.

package/dist/contents/MenuList.d.ts

@@ -56,6 +56,8 @@ export type MenuNavigationPayload = {
 interface IMenuListProps {
     menuList: IMenu[];
     onMenuSelected?(payload: MenuNavigationPayload): void;
+    pinnedSubmenuIds?: number[];
+    onToggleSubmenuPin?(id: number): void;
 }
 export declare const MenuList: (props: IMenuListProps) => React.JSX.Element;
 export {};