@aiquants/menu-bar 1.15.0 → 1.15.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +20 -10
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -28,13 +28,13 @@ export { MenuBar } from '@aiquants/menu-bar';
|
|
|
28
28
|
export { SessionInfo, DefaultLink } from '@aiquants/menu-bar';
|
|
29
29
|
|
|
30
30
|
// Types
|
|
31
|
-
export type { IMenu, ISubmenu } from '@aiquants/menu-bar';
|
|
31
|
+
export type { IMenu, ISubmenu, MenuNavigationPayload } from '@aiquants/menu-bar';
|
|
32
32
|
export type { Theme } from '@aiquants/menu-bar';
|
|
33
33
|
export type { SessionInfoProps, LinkProps } from '@aiquants/menu-bar';
|
|
34
|
-
export type { UserProfile
|
|
34
|
+
export type { UserProfile } from '@aiquants/menu-bar';
|
|
35
35
|
|
|
36
36
|
// CSS (import separately)
|
|
37
|
-
import '@aiquants/menu-bar/css';
|
|
37
|
+
import '@aiquants/menu-bar/styles/menu-bar.css';
|
|
38
38
|
```
|
|
39
39
|
|
|
40
40
|
## Basic Usage
|
|
@@ -42,7 +42,7 @@ import '@aiquants/menu-bar/css';
|
|
|
42
42
|
```tsx
|
|
43
43
|
import React, { useState } from 'react';
|
|
44
44
|
import { MenuBar } from '@aiquants/menu-bar';
|
|
45
|
-
import '@aiquants/menu-bar/css';
|
|
45
|
+
import '@aiquants/menu-bar/styles/menu-bar.css';
|
|
46
46
|
|
|
47
47
|
function App() {
|
|
48
48
|
const [theme, setTheme] = useState('light');
|
|
@@ -99,6 +99,11 @@ function App() {
|
|
|
99
99
|
| `onClickSignout` | `() => void` | Yes | Callback function for sign out action |
|
|
100
100
|
| `menuHeader` | `React.ReactNode` | No | Optional header content for the menu |
|
|
101
101
|
| `isMenuhide` | `boolean` | No | Whether to hide the menu bar entirely |
|
|
102
|
+
| `onMenuNavigate` | `(payload: MenuNavigationPayload) => void` | No | Callback function triggered when a menu or submenu item is selected |
|
|
103
|
+
| `onPinChange` | `(pinned: boolean) => void` | No | Callback function triggered when the menu bar's pin state changes |
|
|
104
|
+
| `pinnedSubmenuIds` | `number[]` | No | Pinned submenu IDs (controlled) |
|
|
105
|
+
| `initialPinnedSubmenuIds` | `number[]` | No | Initial pinned submenu IDs |
|
|
106
|
+
| `onSubmenuPinChange` | `(pinnedIds: number[]) => void` | No | Callback function triggered when submenu pin states change |
|
|
102
107
|
|
|
103
108
|
### IMenu Type
|
|
104
109
|
|
|
@@ -123,18 +128,23 @@ interface ISubmenu {
|
|
|
123
128
|
}
|
|
124
129
|
```
|
|
125
130
|
|
|
131
|
+
### MenuNavigationPayload Type
|
|
132
|
+
|
|
133
|
+
```tsx
|
|
134
|
+
type MenuNavigationPayload = {
|
|
135
|
+
menu: Pick<IMenu, 'id' | 'title' | 'href'>;
|
|
136
|
+
submenu?: Pick<ISubmenu, 'subid' | 'title' | 'href' | 'mark' | 'new'>;
|
|
137
|
+
};
|
|
138
|
+
```
|
|
139
|
+
|
|
126
140
|
### UserProfile Type
|
|
127
141
|
|
|
128
142
|
```tsx
|
|
129
143
|
interface UserProfile {
|
|
130
144
|
displayName: string;
|
|
131
|
-
|
|
145
|
+
photo: string;
|
|
132
146
|
id?: string;
|
|
133
147
|
}
|
|
134
|
-
|
|
135
|
-
interface UserPhoto {
|
|
136
|
-
value: string;
|
|
137
|
-
}
|
|
138
148
|
```
|
|
139
149
|
|
|
140
150
|
### SessionInfoProps Type
|
|
@@ -275,7 +285,7 @@ import { SessionInfo } from '@aiquants/menu-bar';
|
|
|
275
285
|
<SessionInfo
|
|
276
286
|
user={{
|
|
277
287
|
displayName: "John Doe",
|
|
278
|
-
|
|
288
|
+
photo: "https://example.com/avatar.jpg"
|
|
279
289
|
}}
|
|
280
290
|
onLogout={() => console.log('Logout')}
|
|
281
291
|
LinkComponent={({ to, children, ...props }) => (
|