@xyo-network/react-appbar 2.37.14 → 2.37.15
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/dist/cjs/components/SiteMenu/Menu.js +2 -2
- package/dist/cjs/components/SiteMenu/Menu.js.map +1 -1
- package/dist/cjs/components/SiteMenu/MenuListItem/MenuListItemContainer.d.ts +10 -0
- package/dist/cjs/components/SiteMenu/MenuListItem/MenuListItemContainer.d.ts.map +1 -0
- package/dist/cjs/components/SiteMenu/MenuListItem/MenuListItemContainer.js +28 -0
- package/dist/cjs/components/SiteMenu/MenuListItem/MenuListItemContainer.js.map +1 -0
- package/dist/cjs/components/SiteMenu/MenuListItem/index.d.ts +2 -0
- package/dist/cjs/components/SiteMenu/MenuListItem/index.d.ts.map +1 -0
- package/dist/cjs/components/SiteMenu/MenuListItem/index.js +5 -0
- package/dist/cjs/components/SiteMenu/MenuListItem/index.js.map +1 -0
- package/dist/cjs/components/SiteMenu/MenuListItem/list-item-components/ListItemTooltip.d.ts +7 -0
- package/dist/cjs/components/SiteMenu/MenuListItem/list-item-components/ListItemTooltip.d.ts.map +1 -0
- package/dist/cjs/components/SiteMenu/MenuListItem/list-item-components/ListItemTooltip.js +14 -0
- package/dist/cjs/components/SiteMenu/MenuListItem/list-item-components/ListItemTooltip.js.map +1 -0
- package/dist/cjs/components/SiteMenu/{MenuIcon.d.ts → MenuListItem/list-item-components/MenuIcon.d.ts} +0 -0
- package/dist/cjs/components/SiteMenu/MenuListItem/list-item-components/MenuIcon.d.ts.map +1 -0
- package/dist/cjs/components/SiteMenu/{MenuIcon.js → MenuListItem/list-item-components/MenuIcon.js} +0 -0
- package/dist/cjs/components/SiteMenu/MenuListItem/list-item-components/MenuIcon.js.map +1 -0
- package/dist/{esm/components/SiteMenu → cjs/components/SiteMenu/MenuListItem/list-item-components}/MenuListItem.d.ts +1 -1
- package/dist/cjs/components/SiteMenu/MenuListItem/list-item-components/MenuListItem.d.ts.map +1 -0
- package/dist/cjs/components/SiteMenu/{MenuListItem.js → MenuListItem/list-item-components/MenuListItem.js} +1 -2
- package/dist/cjs/components/SiteMenu/MenuListItem/list-item-components/MenuListItem.js.map +1 -0
- package/dist/cjs/components/SiteMenu/MenuListItem/list-item-components/index.d.ts +4 -0
- package/dist/cjs/components/SiteMenu/MenuListItem/list-item-components/index.d.ts.map +1 -0
- package/dist/cjs/components/SiteMenu/MenuListItem/list-item-components/index.js +7 -0
- package/dist/cjs/components/SiteMenu/MenuListItem/list-item-components/index.js.map +1 -0
- package/dist/cjs/components/SiteMenu/MenuListItem/sub-nav/SubNavListItemCollapse.d.ts +11 -0
- package/dist/cjs/components/SiteMenu/MenuListItem/sub-nav/SubNavListItemCollapse.d.ts.map +1 -0
- package/dist/cjs/components/SiteMenu/MenuListItem/sub-nav/SubNavListItemCollapse.js +12 -0
- package/dist/cjs/components/SiteMenu/MenuListItem/sub-nav/SubNavListItemCollapse.js.map +1 -0
- package/dist/cjs/components/SiteMenu/MenuListItem/sub-nav/SubNavToggleIconButton.d.ts +8 -0
- package/dist/cjs/components/SiteMenu/MenuListItem/sub-nav/SubNavToggleIconButton.d.ts.map +1 -0
- package/dist/cjs/components/SiteMenu/MenuListItem/sub-nav/SubNavToggleIconButton.js +15 -0
- package/dist/cjs/components/SiteMenu/MenuListItem/sub-nav/SubNavToggleIconButton.js.map +1 -0
- package/dist/cjs/components/SiteMenu/MenuListItem/sub-nav/index.d.ts +3 -0
- package/dist/cjs/components/SiteMenu/MenuListItem/sub-nav/index.d.ts.map +1 -0
- package/dist/cjs/components/SiteMenu/MenuListItem/sub-nav/index.js +6 -0
- package/dist/cjs/components/SiteMenu/MenuListItem/sub-nav/index.js.map +1 -0
- package/dist/cjs/components/SiteMenu/MenuSection.d.ts +2 -2
- package/dist/cjs/components/SiteMenu/MenuSection.d.ts.map +1 -1
- package/dist/cjs/components/SiteMenu/MenuSection.js +2 -2
- package/dist/cjs/components/SiteMenu/MenuSection.js.map +1 -1
- package/dist/cjs/components/SiteMenu/hooks/useMenuItemsShared.d.ts +2 -2
- package/dist/cjs/components/SiteMenu/hooks/useMenuItemsShared.d.ts.map +1 -1
- package/dist/cjs/components/SiteMenu/index.d.ts +1 -1
- package/dist/cjs/components/SiteMenu/index.d.ts.map +1 -1
- package/dist/cjs/components/SiteMenu/index.js +1 -1
- package/dist/cjs/components/SiteMenu/index.js.map +1 -1
- package/dist/cjs/components/SiteMenu/lib/NavListItemProps.d.ts +13 -0
- package/dist/cjs/components/SiteMenu/lib/NavListItemProps.d.ts.map +1 -0
- package/dist/cjs/components/SiteMenu/lib/NavListItemProps.js +3 -0
- package/dist/cjs/components/SiteMenu/lib/NavListItemProps.js.map +1 -0
- package/dist/cjs/components/SiteMenu/lib/index.d.ts +1 -0
- package/dist/cjs/components/SiteMenu/lib/index.d.ts.map +1 -1
- package/dist/cjs/components/SiteMenu/lib/index.js +1 -0
- package/dist/cjs/components/SiteMenu/lib/index.js.map +1 -1
- package/dist/docs.json +1158 -1321
- package/dist/esm/components/SiteMenu/Menu.js +2 -2
- package/dist/esm/components/SiteMenu/Menu.js.map +1 -1
- package/dist/esm/components/SiteMenu/MenuListItem/MenuListItemContainer.d.ts +10 -0
- package/dist/esm/components/SiteMenu/MenuListItem/MenuListItemContainer.d.ts.map +1 -0
- package/dist/esm/components/SiteMenu/MenuListItem/MenuListItemContainer.js +22 -0
- package/dist/esm/components/SiteMenu/MenuListItem/MenuListItemContainer.js.map +1 -0
- package/dist/esm/components/SiteMenu/MenuListItem/index.d.ts +2 -0
- package/dist/esm/components/SiteMenu/MenuListItem/index.d.ts.map +1 -0
- package/dist/esm/components/SiteMenu/MenuListItem/index.js +2 -0
- package/dist/esm/components/SiteMenu/MenuListItem/index.js.map +1 -0
- package/dist/esm/components/SiteMenu/MenuListItem/list-item-components/ListItemTooltip.d.ts +7 -0
- package/dist/esm/components/SiteMenu/MenuListItem/list-item-components/ListItemTooltip.d.ts.map +1 -0
- package/dist/esm/components/SiteMenu/MenuListItem/list-item-components/ListItemTooltip.js +8 -0
- package/dist/esm/components/SiteMenu/MenuListItem/list-item-components/ListItemTooltip.js.map +1 -0
- package/dist/esm/components/SiteMenu/{MenuIcon.d.ts → MenuListItem/list-item-components/MenuIcon.d.ts} +0 -0
- package/dist/esm/components/SiteMenu/MenuListItem/list-item-components/MenuIcon.d.ts.map +1 -0
- package/dist/esm/components/SiteMenu/{MenuIcon.js → MenuListItem/list-item-components/MenuIcon.js} +0 -0
- package/dist/esm/components/SiteMenu/MenuListItem/list-item-components/MenuIcon.js.map +1 -0
- package/dist/{cjs/components/SiteMenu → esm/components/SiteMenu/MenuListItem/list-item-components}/MenuListItem.d.ts +1 -1
- package/dist/esm/components/SiteMenu/MenuListItem/list-item-components/MenuListItem.d.ts.map +1 -0
- package/dist/esm/components/SiteMenu/{MenuListItem.js → MenuListItem/list-item-components/MenuListItem.js} +1 -2
- package/dist/esm/components/SiteMenu/MenuListItem/list-item-components/MenuListItem.js.map +1 -0
- package/dist/esm/components/SiteMenu/MenuListItem/list-item-components/index.d.ts +4 -0
- package/dist/esm/components/SiteMenu/MenuListItem/list-item-components/index.d.ts.map +1 -0
- package/dist/esm/components/SiteMenu/MenuListItem/list-item-components/index.js +4 -0
- package/dist/esm/components/SiteMenu/MenuListItem/list-item-components/index.js.map +1 -0
- package/dist/esm/components/SiteMenu/MenuListItem/sub-nav/SubNavListItemCollapse.d.ts +11 -0
- package/dist/esm/components/SiteMenu/MenuListItem/sub-nav/SubNavListItemCollapse.d.ts.map +1 -0
- package/dist/esm/components/SiteMenu/MenuListItem/sub-nav/SubNavListItemCollapse.js +6 -0
- package/dist/esm/components/SiteMenu/MenuListItem/sub-nav/SubNavListItemCollapse.js.map +1 -0
- package/dist/esm/components/SiteMenu/MenuListItem/sub-nav/SubNavToggleIconButton.d.ts +8 -0
- package/dist/esm/components/SiteMenu/MenuListItem/sub-nav/SubNavToggleIconButton.d.ts.map +1 -0
- package/dist/esm/components/SiteMenu/MenuListItem/sub-nav/SubNavToggleIconButton.js +11 -0
- package/dist/esm/components/SiteMenu/MenuListItem/sub-nav/SubNavToggleIconButton.js.map +1 -0
- package/dist/esm/components/SiteMenu/MenuListItem/sub-nav/index.d.ts +3 -0
- package/dist/esm/components/SiteMenu/MenuListItem/sub-nav/index.d.ts.map +1 -0
- package/dist/esm/components/SiteMenu/MenuListItem/sub-nav/index.js +3 -0
- package/dist/esm/components/SiteMenu/MenuListItem/sub-nav/index.js.map +1 -0
- package/dist/esm/components/SiteMenu/MenuSection.d.ts +2 -2
- package/dist/esm/components/SiteMenu/MenuSection.d.ts.map +1 -1
- package/dist/esm/components/SiteMenu/MenuSection.js +3 -3
- package/dist/esm/components/SiteMenu/MenuSection.js.map +1 -1
- package/dist/esm/components/SiteMenu/hooks/useMenuItemsShared.d.ts +2 -2
- package/dist/esm/components/SiteMenu/hooks/useMenuItemsShared.d.ts.map +1 -1
- package/dist/esm/components/SiteMenu/index.d.ts +1 -1
- package/dist/esm/components/SiteMenu/index.d.ts.map +1 -1
- package/dist/esm/components/SiteMenu/index.js +1 -1
- package/dist/esm/components/SiteMenu/index.js.map +1 -1
- package/dist/esm/components/SiteMenu/lib/NavListItemProps.d.ts +13 -0
- package/dist/esm/components/SiteMenu/lib/NavListItemProps.d.ts.map +1 -0
- package/dist/esm/components/SiteMenu/lib/NavListItemProps.js +2 -0
- package/dist/esm/components/SiteMenu/lib/NavListItemProps.js.map +1 -0
- package/dist/esm/components/SiteMenu/lib/index.d.ts +1 -0
- package/dist/esm/components/SiteMenu/lib/index.d.ts.map +1 -1
- package/dist/esm/components/SiteMenu/lib/index.js +1 -0
- package/dist/esm/components/SiteMenu/lib/index.js.map +1 -1
- package/package.json +6 -6
- package/src/components/AppBar/Application.stories.tsx +3 -3
- package/src/components/CollapsibleDrawer/CollapseDrawer.stories.tsx +1 -1
- package/src/components/CollapsibleDrawer/{ExampleMenuData.tsx → ExampleMenuData.stories.tsx} +3 -3
- package/src/components/SiteMenu/Menu.tsx +2 -2
- package/src/components/SiteMenu/{MenuItem.stories.tsx → MenuListItem/MenuListItemContainer.stories.tsx} +9 -9
- package/src/components/SiteMenu/MenuListItem/MenuListItemContainer.tsx +76 -0
- package/src/components/SiteMenu/MenuListItem/index.ts +1 -0
- package/src/components/SiteMenu/MenuListItem/list-item-components/ListItemTooltip.tsx +20 -0
- package/src/components/SiteMenu/{MenuIcon.tsx → MenuListItem/list-item-components/MenuIcon.tsx} +0 -0
- package/src/components/SiteMenu/{MenuListItem.tsx → MenuListItem/list-item-components/MenuListItem.tsx} +2 -4
- package/src/components/SiteMenu/MenuListItem/list-item-components/index.ts +3 -0
- package/src/components/SiteMenu/MenuListItem/sub-nav/SubNavListItemCollapse.tsx +18 -0
- package/src/components/SiteMenu/MenuListItem/sub-nav/SubNavToggleIconButton.tsx +23 -0
- package/src/components/SiteMenu/MenuListItem/sub-nav/index.ts +2 -0
- package/src/components/SiteMenu/MenuSection.tsx +3 -5
- package/src/components/SiteMenu/hooks/useMenuItemsShared.tsx +2 -2
- package/src/components/SiteMenu/index.ts +1 -1
- package/src/components/SiteMenu/lib/NavListItemProps.ts +13 -0
- package/src/components/SiteMenu/lib/index.ts +1 -0
- package/src/components/Toolbar/System/SystemToolbar.stories.tsx +5 -4
- package/dist/cjs/components/CollapsibleDrawer/ExampleMenuData.d.ts +0 -4
- package/dist/cjs/components/CollapsibleDrawer/ExampleMenuData.d.ts.map +0 -1
- package/dist/cjs/components/CollapsibleDrawer/ExampleMenuData.js +0 -69
- package/dist/cjs/components/CollapsibleDrawer/ExampleMenuData.js.map +0 -1
- package/dist/cjs/components/SiteMenu/MenuIcon.d.ts.map +0 -1
- package/dist/cjs/components/SiteMenu/MenuIcon.js.map +0 -1
- package/dist/cjs/components/SiteMenu/MenuItems.d.ts +0 -26
- package/dist/cjs/components/SiteMenu/MenuItems.d.ts.map +0 -1
- package/dist/cjs/components/SiteMenu/MenuItems.js +0 -35
- package/dist/cjs/components/SiteMenu/MenuItems.js.map +0 -1
- package/dist/cjs/components/SiteMenu/MenuListItem.d.ts.map +0 -1
- package/dist/cjs/components/SiteMenu/MenuListItem.js.map +0 -1
- package/dist/cjs/components/SiteMenu/MenuListItemText.d.ts +0 -7
- package/dist/cjs/components/SiteMenu/MenuListItemText.d.ts.map +0 -1
- package/dist/cjs/components/SiteMenu/MenuListItemText.js +0 -13
- package/dist/cjs/components/SiteMenu/MenuListItemText.js.map +0 -1
- package/dist/esm/components/CollapsibleDrawer/ExampleMenuData.d.ts +0 -4
- package/dist/esm/components/CollapsibleDrawer/ExampleMenuData.d.ts.map +0 -1
- package/dist/esm/components/CollapsibleDrawer/ExampleMenuData.js +0 -66
- package/dist/esm/components/CollapsibleDrawer/ExampleMenuData.js.map +0 -1
- package/dist/esm/components/SiteMenu/MenuIcon.d.ts.map +0 -1
- package/dist/esm/components/SiteMenu/MenuIcon.js.map +0 -1
- package/dist/esm/components/SiteMenu/MenuItems.d.ts +0 -26
- package/dist/esm/components/SiteMenu/MenuItems.d.ts.map +0 -1
- package/dist/esm/components/SiteMenu/MenuItems.js +0 -29
- package/dist/esm/components/SiteMenu/MenuItems.js.map +0 -1
- package/dist/esm/components/SiteMenu/MenuListItem.d.ts.map +0 -1
- package/dist/esm/components/SiteMenu/MenuListItem.js.map +0 -1
- package/dist/esm/components/SiteMenu/MenuListItemText.d.ts +0 -7
- package/dist/esm/components/SiteMenu/MenuListItemText.d.ts.map +0 -1
- package/dist/esm/components/SiteMenu/MenuListItemText.js +0 -13
- package/dist/esm/components/SiteMenu/MenuListItemText.js.map +0 -1
- package/src/components/SiteMenu/MenuItems.tsx +0 -115
- package/src/components/SiteMenu/MenuListItemText.tsx +0 -21
@@ -4,7 +4,7 @@ import SettingsIcon from '@mui/icons-material/Settings';
|
|
4
4
|
import { IconButton, List, SwipeableDrawer } from '@mui/material';
|
5
5
|
import { FlexRow } from '@xylabs/react-flexbox';
|
6
6
|
import { useEffect, useState } from 'react';
|
7
|
-
import {
|
7
|
+
import { MenuListItemContainer } from './MenuListItem';
|
8
8
|
export const SiteMenu = ({ side = 'right', children, onMenuToggle, ...props }) => {
|
9
9
|
const [open, setOpen] = useState(false);
|
10
10
|
useEffect(() => {
|
@@ -12,6 +12,6 @@ export const SiteMenu = ({ side = 'right', children, onMenuToggle, ...props }) =
|
|
12
12
|
}, [onMenuToggle, open]);
|
13
13
|
return (_jsxs(FlexRow, { alignItems: "stretch", ...props, children: [_jsx(IconButton, { size: "small", color: "inherit", onClick: () => {
|
14
14
|
setOpen(!open);
|
15
|
-
}, children: _jsx(MenuIcon, { fontSize: "large" }) }), _jsx(SwipeableDrawer, { anchor: side, open: open, onClick: () => setOpen(false), onKeyDown: () => setOpen(false), onClose: () => setOpen(false), onOpen: () => setOpen(true), children: children ?? (_jsx(List, { children: _jsx(
|
15
|
+
}, children: _jsx(MenuIcon, { fontSize: "large" }) }), _jsx(SwipeableDrawer, { anchor: side, open: open, onClick: () => setOpen(false), onKeyDown: () => setOpen(false), onClose: () => setOpen(false), onOpen: () => setOpen(true), children: children ?? (_jsx(List, { children: _jsx(MenuListItemContainer, { primary: "Settings", icon: _jsx(SettingsIcon, {}), to: "/settings" }) })) })] }));
|
16
16
|
};
|
17
17
|
//# sourceMappingURL=Menu.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Menu.js","sourceRoot":"","sources":["../../../../src/components/SiteMenu/Menu.tsx"],"names":[],"mappings":";AAAA,OAAO,QAAQ,MAAM,0BAA0B,CAAA;AAC/C,OAAO,YAAY,MAAM,8BAA8B,CAAA;AACvD,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,eAAe,EAAE,MAAM,eAAe,CAAA;AACjE,OAAO,EAAgB,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAC7D,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAE3C,OAAO,EAAE,
|
1
|
+
{"version":3,"file":"Menu.js","sourceRoot":"","sources":["../../../../src/components/SiteMenu/Menu.tsx"],"names":[],"mappings":";AAAA,OAAO,QAAQ,MAAM,0BAA0B,CAAA;AAC/C,OAAO,YAAY,MAAM,8BAA8B,CAAA;AACvD,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,eAAe,EAAE,MAAM,eAAe,CAAA;AACjE,OAAO,EAAgB,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAC7D,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAE3C,OAAO,EAAE,qBAAqB,EAAE,MAAM,gBAAgB,CAAA;AAQtD,MAAM,CAAC,MAAM,QAAQ,GAA4B,CAAC,EAAE,IAAI,GAAG,OAAO,EAAE,QAAQ,EAAE,YAAY,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;IACxG,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IAEvC,SAAS,CAAC,GAAG,EAAE;QACb,YAAY,EAAE,CAAC,IAAI,CAAC,CAAA;IACtB,CAAC,EAAE,CAAC,YAAY,EAAE,IAAI,CAAC,CAAC,CAAA;IAExB,OAAO,CACL,MAAC,OAAO,IAAC,UAAU,EAAC,SAAS,KAAK,KAAK,aACrC,KAAC,UAAU,IACT,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,SAAS,EACf,OAAO,EAAE,GAAG,EAAE;oBACZ,OAAO,CAAC,CAAC,IAAI,CAAC,CAAA;gBAChB,CAAC,YAED,KAAC,QAAQ,IAAC,QAAQ,EAAC,OAAO,GAAG,GAClB,EACb,KAAC,eAAe,IACd,MAAM,EAAE,IAAI,EACZ,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC,EAC7B,SAAS,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC,EAC/B,OAAO,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC,EAC7B,MAAM,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC,YAE1B,QAAQ,IAAI,CACX,KAAC,IAAI,cACH,KAAC,qBAAqB,IAAC,OAAO,EAAC,UAAU,EAAC,IAAI,EAAE,KAAC,YAAY,KAAG,EAAE,EAAE,EAAC,WAAW,GAAG,GAC9E,CACR,GACe,IACV,CACX,CAAA;AACH,CAAC,CAAA"}
|
@@ -0,0 +1,10 @@
|
|
1
|
+
/// <reference types="react" />
|
2
|
+
import { ListItemProps } from '@mui/material';
|
3
|
+
import { NavListItemProps, SiteMenuListItemBase } from '../lib';
|
4
|
+
export interface MenuListItemProps extends NavListItemProps, SiteMenuListItemBase, ListItemProps {
|
5
|
+
subNavListItems?: NavListItemProps[];
|
6
|
+
subNavOpen?: boolean;
|
7
|
+
iconOnly?: boolean;
|
8
|
+
}
|
9
|
+
export declare const MenuListItemContainer: React.FC<MenuListItemProps>;
|
10
|
+
//# sourceMappingURL=MenuListItemContainer.d.ts.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"MenuListItemContainer.d.ts","sourceRoot":"","sources":["../../../../../src/components/SiteMenu/MenuListItem/MenuListItemContainer.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAA0B,MAAM,eAAe,CAAA;AAMrE,OAAO,EAAE,gBAAgB,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAAA;AAI/D,MAAM,WAAW,iBAAkB,SAAQ,gBAAgB,EAAE,oBAAoB,EAAE,aAAa;IAC9F,eAAe,CAAC,EAAE,gBAAgB,EAAE,CAAA;IACpC,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAED,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CA2D7D,CAAA"}
|
@@ -0,0 +1,22 @@
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
2
|
+
import { ListItemText, useTheme } from '@mui/material';
|
3
|
+
import { FlexRow } from '@xylabs/react-flexbox';
|
4
|
+
import { LinkEx } from '@xylabs/react-link';
|
5
|
+
import { useState } from 'react';
|
6
|
+
import { useCollapsible } from '../../../contexts';
|
7
|
+
import { ListItemTooltip, MenuIcon, MenuListItem } from './list-item-components';
|
8
|
+
import { SubNavListItemsCollapse, SubNavToggleIconButton } from './sub-nav';
|
9
|
+
export const MenuListItemContainer = ({ style, subNavListItems, iconOnly, tooltip, icon, primary, onButtonClick, to, sx, ...props }) => {
|
10
|
+
const { dense } = props;
|
11
|
+
const theme = useTheme();
|
12
|
+
const { collapse } = useCollapsible();
|
13
|
+
const [openSubNav, setOpenSubNav] = useState(false);
|
14
|
+
const [hovered, setHovered] = useState(false);
|
15
|
+
return (_jsxs(_Fragment, { children: [_jsxs(MenuListItem, { disableGutters: true, iconOnly: iconOnly, onClick: onButtonClick, dense: dense, sx: { justifyContent: 'space-between', ...sx }, style: { whiteSpace: 'nowrap', ...style }, ...props, children: [_jsx(LinkEx, { onMouseEnter: () => setHovered(true), onMouseLeave: () => setHovered(false), color: "inherit", to: to, sx: {
|
16
|
+
'& :hover': {
|
17
|
+
cursor: 'pointer',
|
18
|
+
textDecoration: 'underline',
|
19
|
+
},
|
20
|
+
}, children: _jsxs(FlexRow, { children: [_jsx(MenuIcon, { icon: icon, paddingRight: theme.spacing(1), color: hovered ? 'secondary' : 'inherit' }), _jsx(ListItemText, { primary: primary })] }) }), _jsxs(FlexRow, { style: { marginLeft: theme.spacing(1) }, children: [subNavListItems ? _jsx(SubNavToggleIconButton, { setOpenSubNav: setOpenSubNav, openSubNav: openSubNav }) : null, tooltip ? _jsx(ListItemTooltip, { title: tooltip }) : null] })] }), subNavListItems ? (_jsx(SubNavListItemsCollapse, { openSubNav: openSubNav, collapse: collapse, children: subNavListItems?.map((item, index) => (_jsx(MenuListItemContainer, { dense: dense, sx: { pl: theme.spacing(1) }, ...item }, index))) })) : null] }));
|
21
|
+
};
|
22
|
+
//# sourceMappingURL=MenuListItemContainer.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"MenuListItemContainer.js","sourceRoot":"","sources":["../../../../../src/components/SiteMenu/MenuListItem/MenuListItemContainer.tsx"],"names":[],"mappings":"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"}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/SiteMenu/MenuListItem/index.ts"],"names":[],"mappings":"AAAA,cAAc,yBAAyB,CAAA"}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/components/SiteMenu/MenuListItem/index.ts"],"names":[],"mappings":"AAAA,cAAc,yBAAyB,CAAA"}
|
@@ -0,0 +1,7 @@
|
|
1
|
+
/// <reference types="react" />
|
2
|
+
import { TooltipProps } from '@mui/material';
|
3
|
+
export interface ListItemTooltipProps extends Omit<TooltipProps, 'children'> {
|
4
|
+
title: string;
|
5
|
+
}
|
6
|
+
export declare const ListItemTooltip: React.FC<ListItemTooltipProps>;
|
7
|
+
//# sourceMappingURL=ListItemTooltip.d.ts.map
|
package/dist/esm/components/SiteMenu/MenuListItem/list-item-components/ListItemTooltip.d.ts.map
ADDED
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"ListItemTooltip.d.ts","sourceRoot":"","sources":["../../../../../../src/components/SiteMenu/MenuListItem/list-item-components/ListItemTooltip.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAW,YAAY,EAAE,MAAM,eAAe,CAAA;AAIrD,MAAM,WAAW,oBAAqB,SAAQ,IAAI,CAAC,YAAY,EAAE,UAAU,CAAC;IAC1E,KAAK,EAAE,MAAM,CAAA;CACd;AAED,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAW1D,CAAA"}
|
@@ -0,0 +1,8 @@
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
2
|
+
import { Tooltip } from '@mui/material';
|
3
|
+
import { FlexCol } from '@xylabs/react-flexbox';
|
4
|
+
import { VscInfo } from 'react-icons/vsc';
|
5
|
+
export const ListItemTooltip = ({ title, ...props }) => {
|
6
|
+
return (_jsx(Tooltip, { title: title, placement: "right", ...props, children: _jsx("div", { children: _jsx(FlexCol, { justifyContent: "center", children: _jsx(VscInfo, { color: "grey" }) }) }) }));
|
7
|
+
};
|
8
|
+
//# sourceMappingURL=ListItemTooltip.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"ListItemTooltip.js","sourceRoot":"","sources":["../../../../../../src/components/SiteMenu/MenuListItem/list-item-components/ListItemTooltip.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAgB,MAAM,eAAe,CAAA;AACrD,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAC/C,OAAO,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAA;AAMzC,MAAM,CAAC,MAAM,eAAe,GAAmC,CAAC,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;IACrF,OAAO,CACL,KAAC,OAAO,IAAC,KAAK,EAAE,KAAK,EAAE,SAAS,EAAC,OAAO,KAAK,KAAK,YAEhD,wBACE,KAAC,OAAO,IAAC,cAAc,EAAC,QAAQ,YAC9B,KAAC,OAAO,IAAC,KAAK,EAAC,MAAM,GAAG,GAChB,GACN,GACE,CACX,CAAA;AACH,CAAC,CAAA"}
|
File without changes
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"MenuIcon.d.ts","sourceRoot":"","sources":["../../../../../../src/components/SiteMenu/MenuListItem/list-item-components/MenuIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,eAAe,EAAE,MAAM,eAAe,CAAA;AAC3D,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEjC,MAAM,WAAW,aAAc,SAAQ,eAAe;IACpD,IAAI,CAAC,EAAE,SAAS,CAAA;CACjB;AAED,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAM5C,CAAA"}
|
package/dist/esm/components/SiteMenu/{MenuIcon.js → MenuListItem/list-item-components/MenuIcon.js}
RENAMED
File without changes
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"MenuIcon.js","sourceRoot":"","sources":["../../../../../../src/components/SiteMenu/MenuListItem/list-item-components/MenuIcon.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAmB,MAAM,eAAe,CAAA;AAO3D,MAAM,CAAC,MAAM,QAAQ,GAA4B,CAAC,EAAE,IAAI,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;IACtE,OAAO,CACL,KAAC,UAAU,IAAC,OAAO,EAAC,MAAM,KAAK,KAAK,YACjC,IAAI,GACM,CACd,CAAA;AACH,CAAC,CAAA"}
|
@@ -1,6 +1,6 @@
|
|
1
1
|
/// <reference types="react" />
|
2
2
|
import { ListItemProps } from '@mui/material';
|
3
|
-
import { SiteMenuListItemBase } from '
|
3
|
+
import { SiteMenuListItemBase } from '../../lib';
|
4
4
|
export interface ListItemExProps extends SiteMenuListItemBase, ListItemProps {
|
5
5
|
}
|
6
6
|
export declare const MenuListItem: React.FC<ListItemExProps>;
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"MenuListItem.d.ts","sourceRoot":"","sources":["../../../../../../src/components/SiteMenu/MenuListItem/list-item-components/MenuListItem.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAY,aAAa,EAAE,MAAM,eAAe,CAAA;AAEvD,OAAO,EAAE,oBAAoB,EAAE,MAAM,WAAW,CAAA;AAEhD,MAAM,WAAW,eAAgB,SAAQ,oBAAoB,EAAE,aAAa;CAAG;AAE/E,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAWlD,CAAA"}
|
@@ -1,7 +1,6 @@
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
2
2
|
import { ListItem } from '@mui/material';
|
3
|
-
export const MenuListItem = ({ iconOnly, collapseEnd, sx, children, ...props }) => {
|
4
|
-
const dense = props;
|
3
|
+
export const MenuListItem = ({ iconOnly, collapseEnd, sx, children, dense, ...props }) => {
|
5
4
|
const listItemSx = iconOnly ? { borderRadius: '50%', display: 'inline-flex', flexGrow: 0, width: 'auto' } : { width: '100%' };
|
6
5
|
// wait till collapseEnds to remove the spacing between items
|
7
6
|
const spacingSx = collapseEnd ? { columnGap: 0 } : { columnGap: 1.5 };
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"MenuListItem.js","sourceRoot":"","sources":["../../../../../../src/components/SiteMenu/MenuListItem/list-item-components/MenuListItem.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAiB,MAAM,eAAe,CAAA;AAMvD,MAAM,CAAC,MAAM,YAAY,GAA8B,CAAC,EAAE,QAAQ,EAAE,WAAW,EAAE,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;IAClH,MAAM,UAAU,GAAG,QAAQ,CAAC,CAAC,CAAC,EAAE,YAAY,EAAE,KAAK,EAAE,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,CAAA;IAC7H,6DAA6D;IAC7D,MAAM,SAAS,GAAG,WAAW,CAAC,CAAC,CAAC,EAAE,SAAS,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,SAAS,EAAE,GAAG,EAAE,CAAA;IACrE,6EAA6E;IAC7E,MAAM,SAAS,GAAG,KAAK,CAAC,CAAC,CAAC,EAAE,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC,EAAE,EAAE,EAAE,MAAM,EAAE,CAAA;IACxD,OAAO,CACL,KAAC,QAAQ,IAAC,EAAE,EAAE,EAAE,GAAG,UAAU,EAAE,GAAG,SAAS,EAAE,GAAG,SAAS,EAAE,GAAG,EAAE,EAAE,KAAM,KAAK,YAC1E,QAAQ,GACA,CACZ,CAAA;AACH,CAAC,CAAA"}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/SiteMenu/MenuListItem/list-item-components/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAA;AACjC,cAAc,YAAY,CAAA;AAC1B,cAAc,gBAAgB,CAAA"}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../src/components/SiteMenu/MenuListItem/list-item-components/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAA;AACjC,cAAc,YAAY,CAAA;AAC1B,cAAc,gBAAgB,CAAA"}
|
@@ -0,0 +1,11 @@
|
|
1
|
+
/// <reference types="react" />
|
2
|
+
import { CollapseProps } from '@mui/material';
|
3
|
+
import { WithChildren } from '@xylabs/react-shared';
|
4
|
+
import { NavListItemProps } from '../../lib';
|
5
|
+
export interface SubNavListItemsCollapseProps extends WithChildren, CollapseProps {
|
6
|
+
collapse?: boolean;
|
7
|
+
openSubNav?: boolean;
|
8
|
+
subNavListItems?: NavListItemProps[];
|
9
|
+
}
|
10
|
+
export declare const SubNavListItemsCollapse: React.FC<SubNavListItemsCollapseProps>;
|
11
|
+
//# sourceMappingURL=SubNavListItemCollapse.d.ts.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"SubNavListItemCollapse.d.ts","sourceRoot":"","sources":["../../../../../../src/components/SiteMenu/MenuListItem/sub-nav/SubNavListItemCollapse.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAY,aAAa,EAAQ,MAAM,eAAe,CAAA;AAC7D,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAA;AAEnD,OAAO,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAA;AAE5C,MAAM,WAAW,4BAA6B,SAAQ,YAAY,EAAE,aAAa;IAC/E,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,eAAe,CAAC,EAAE,gBAAgB,EAAE,CAAA;CACrC;AAED,eAAO,MAAM,uBAAuB,EAAE,KAAK,CAAC,EAAE,CAAC,4BAA4B,CAM1E,CAAA"}
|
@@ -0,0 +1,6 @@
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
2
|
+
import { Collapse, List } from '@mui/material';
|
3
|
+
export const SubNavListItemsCollapse = ({ collapse, openSubNav, children, ...props }) => {
|
4
|
+
return (_jsx(Collapse, { in: collapse == true ? false : openSubNav, ...props, children: _jsx(List, { children: children }) }));
|
5
|
+
};
|
6
|
+
//# sourceMappingURL=SubNavListItemCollapse.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"SubNavListItemCollapse.js","sourceRoot":"","sources":["../../../../../../src/components/SiteMenu/MenuListItem/sub-nav/SubNavListItemCollapse.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAiB,IAAI,EAAE,MAAM,eAAe,CAAA;AAW7D,MAAM,CAAC,MAAM,uBAAuB,GAA2C,CAAC,EAAE,QAAQ,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;IAC9H,OAAO,CACL,KAAC,QAAQ,IAAC,EAAE,EAAE,QAAQ,IAAI,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,UAAU,KAAM,KAAK,YAC5D,KAAC,IAAI,cAAE,QAAQ,GAAQ,GACd,CACZ,CAAA;AACH,CAAC,CAAA"}
|
@@ -0,0 +1,8 @@
|
|
1
|
+
import { IconButtonProps } from '@mui/material';
|
2
|
+
import { Dispatch, SetStateAction } from 'react';
|
3
|
+
export interface SubNavToggleIconButtonProps extends IconButtonProps {
|
4
|
+
openSubNav?: boolean;
|
5
|
+
setOpenSubNav?: Dispatch<SetStateAction<boolean>>;
|
6
|
+
}
|
7
|
+
export declare const SubNavToggleIconButton: React.FC<SubNavToggleIconButtonProps>;
|
8
|
+
//# sourceMappingURL=SubNavToggleIconButton.d.ts.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"SubNavToggleIconButton.d.ts","sourceRoot":"","sources":["../../../../../../src/components/SiteMenu/MenuListItem/sub-nav/SubNavToggleIconButton.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,eAAe,EAAY,MAAM,eAAe,CAAA;AACrE,OAAO,EAAE,QAAQ,EAAE,cAAc,EAAkB,MAAM,OAAO,CAAA;AAGhE,MAAM,WAAW,2BAA4B,SAAQ,eAAe;IAClE,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,aAAa,CAAC,EAAE,QAAQ,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAA;CAClD;AAED,eAAO,MAAM,sBAAsB,EAAE,KAAK,CAAC,EAAE,CAAC,2BAA2B,CAaxE,CAAA"}
|
@@ -0,0 +1,11 @@
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
2
|
+
import { IconButton, useTheme } from '@mui/material';
|
3
|
+
import { VscChevronDown } from 'react-icons/vsc';
|
4
|
+
export const SubNavToggleIconButton = ({ setOpenSubNav, openSubNav }) => {
|
5
|
+
const theme = useTheme();
|
6
|
+
return (_jsx(IconButton, { onClick: (event) => {
|
7
|
+
event.stopPropagation();
|
8
|
+
setOpenSubNav?.(!openSubNav);
|
9
|
+
}, sx: { marginRight: theme.spacing(0.5) }, children: _jsx(VscChevronDown, { fontSize: "16px" }) }));
|
10
|
+
};
|
11
|
+
//# sourceMappingURL=SubNavToggleIconButton.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"SubNavToggleIconButton.js","sourceRoot":"","sources":["../../../../../../src/components/SiteMenu/MenuListItem/sub-nav/SubNavToggleIconButton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAmB,QAAQ,EAAE,MAAM,eAAe,CAAA;AAErE,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAA;AAOhD,MAAM,CAAC,MAAM,sBAAsB,GAA0C,CAAC,EAAE,aAAa,EAAE,UAAU,EAAE,EAAE,EAAE;IAC7G,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAA;IACxB,OAAO,CACL,KAAC,UAAU,IACT,OAAO,EAAE,CAAC,KAAqB,EAAE,EAAE;YACjC,KAAK,CAAC,eAAe,EAAE,CAAA;YACvB,aAAa,EAAE,CAAC,CAAC,UAAU,CAAC,CAAA;QAC9B,CAAC,EACD,EAAE,EAAE,EAAE,WAAW,EAAE,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE,YAEvC,KAAC,cAAc,IAAC,QAAQ,EAAC,MAAM,GAAG,GACvB,CACd,CAAA;AACH,CAAC,CAAA"}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/SiteMenu/MenuListItem/sub-nav/index.ts"],"names":[],"mappings":"AAAA,cAAc,0BAA0B,CAAA;AACxC,cAAc,0BAA0B,CAAA"}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../src/components/SiteMenu/MenuListItem/sub-nav/index.ts"],"names":[],"mappings":"AAAA,cAAc,0BAA0B,CAAA;AACxC,cAAc,0BAA0B,CAAA"}
|
@@ -1,9 +1,9 @@
|
|
1
1
|
/// <reference types="react" />
|
2
2
|
import { FlexBoxProps } from '@xylabs/react-flexbox';
|
3
|
-
import {
|
3
|
+
import { MenuListItemProps } from './MenuListItem';
|
4
4
|
export interface MenuSectionProps extends FlexBoxProps {
|
5
5
|
title: string;
|
6
|
-
listItems:
|
6
|
+
listItems: MenuListItemProps[];
|
7
7
|
showTitle?: boolean;
|
8
8
|
}
|
9
9
|
export declare const MenuSection: React.FC<MenuSectionProps>;
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"MenuSection.d.ts","sourceRoot":"","sources":["../../../../src/components/SiteMenu/MenuSection.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,YAAY,EAAW,MAAM,uBAAuB,CAAA;AAE7D,OAAO,
|
1
|
+
{"version":3,"file":"MenuSection.d.ts","sourceRoot":"","sources":["../../../../src/components/SiteMenu/MenuSection.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,YAAY,EAAW,MAAM,uBAAuB,CAAA;AAE7D,OAAO,EAAyB,iBAAiB,EAAE,MAAM,gBAAgB,CAAA;AAEzE,MAAM,WAAW,gBAAiB,SAAQ,YAAY;IACpD,KAAK,EAAE,MAAM,CAAA;IACb,SAAS,EAAE,iBAAiB,EAAE,CAAA;IAC9B,SAAS,CAAC,EAAE,OAAO,CAAA;CACpB;AAED,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAYlD,CAAA"}
|
@@ -1,8 +1,8 @@
|
|
1
|
-
import { jsx as _jsx,
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
2
2
|
import { Collapse, ListSubheader } from '@mui/material';
|
3
3
|
import { FlexCol } from '@xylabs/react-flexbox';
|
4
|
-
import {
|
4
|
+
import { MenuListItemContainer } from './MenuListItem';
|
5
5
|
export const MenuSection = ({ title, listItems, showTitle = true, ...props }) => {
|
6
|
-
return (_jsxs(FlexCol, { alignItems: "stretch", ...props, children: [_jsx(Collapse, { in: showTitle, timeout: 700, children: _jsx(ListSubheader, { children: title }) }), listItems.map((item, index) => (_jsx(
|
6
|
+
return (_jsxs(FlexCol, { alignItems: "stretch", ...props, children: [_jsx(Collapse, { in: showTitle, timeout: 700, children: _jsx(ListSubheader, { children: title }) }), listItems.map((item, index) => (_jsx(MenuListItemContainer, { ...item }, index)))] }));
|
7
7
|
};
|
8
8
|
//# sourceMappingURL=MenuSection.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"MenuSection.js","sourceRoot":"","sources":["../../../../src/components/SiteMenu/MenuSection.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,eAAe,CAAA;AACvD,OAAO,EAAgB,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAE7D,OAAO,EAAE,
|
1
|
+
{"version":3,"file":"MenuSection.js","sourceRoot":"","sources":["../../../../src/components/SiteMenu/MenuSection.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,eAAe,CAAA;AACvD,OAAO,EAAgB,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAE7D,OAAO,EAAE,qBAAqB,EAAqB,MAAM,gBAAgB,CAAA;AAQzE,MAAM,CAAC,MAAM,WAAW,GAA+B,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,SAAS,GAAG,IAAI,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;IAC1G,OAAO,CACL,MAAC,OAAO,IAAC,UAAU,EAAC,SAAS,KAAK,KAAK,aACrC,KAAC,QAAQ,IAAC,EAAE,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,YACnC,KAAC,aAAa,cAAE,KAAK,GAAiB,GAC7B,EAEV,SAAS,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,CAC9B,KAAC,qBAAqB,OAAiB,IAAI,IAAf,KAAK,CAAoC,CACtE,CAAC,IACM,CACX,CAAA;AACH,CAAC,CAAA"}
|
@@ -1,5 +1,5 @@
|
|
1
|
-
import {
|
2
|
-
declare type DefaultSiteMenuListItemProps = Pick<
|
1
|
+
import { MenuListItemProps } from '../MenuListItem';
|
2
|
+
declare type DefaultSiteMenuListItemProps = Pick<MenuListItemProps, 'collapseEnd' | 'dense' | 'iconOnly' | 'sx'>;
|
3
3
|
export declare const useMenuItemsShared: () => {
|
4
4
|
defaultSiteMenuListItemProps: DefaultSiteMenuListItemProps;
|
5
5
|
onMenuItemToggle: (open?: boolean) => void;
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"useMenuItemsShared.d.ts","sourceRoot":"","sources":["../../../../../src/components/SiteMenu/hooks/useMenuItemsShared.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,
|
1
|
+
{"version":3,"file":"useMenuItemsShared.d.ts","sourceRoot":"","sources":["../../../../../src/components/SiteMenu/hooks/useMenuItemsShared.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAA;AAEnD,aAAK,4BAA4B,GAAG,IAAI,CAAC,iBAAiB,EAAE,aAAa,GAAG,OAAO,GAAG,UAAU,GAAG,IAAI,CAAC,CAAA;AAExG,eAAO,MAAM,kBAAkB;;8BAGI,OAAO;CAkBzC,CAAA"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/SiteMenu/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAA;AACvB,cAAc,QAAQ,CAAA;AACtB,cAAc,
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/SiteMenu/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAA;AACvB,cAAc,QAAQ,CAAA;AACtB,cAAc,gBAAgB,CAAA;AAC9B,cAAc,eAAe,CAAA"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/SiteMenu/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAA;AACvB,cAAc,QAAQ,CAAA;AACtB,cAAc,
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/SiteMenu/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAA;AACvB,cAAc,QAAQ,CAAA;AACtB,cAAc,gBAAgB,CAAA;AAC9B,cAAc,eAAe,CAAA"}
|
@@ -0,0 +1,13 @@
|
|
1
|
+
import { ListItemTextProps } from '@mui/material';
|
2
|
+
import { LinkExProps } from '@xylabs/react-link';
|
3
|
+
import { ReactNode } from 'react';
|
4
|
+
import { To } from 'react-router-dom';
|
5
|
+
export interface NavListItemProps {
|
6
|
+
primary: ListItemTextProps['primary'];
|
7
|
+
to?: To;
|
8
|
+
href?: string;
|
9
|
+
icon?: ReactNode;
|
10
|
+
onButtonClick?: LinkExProps['onClick'];
|
11
|
+
tooltip?: string;
|
12
|
+
}
|
13
|
+
//# sourceMappingURL=NavListItemProps.d.ts.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"NavListItemProps.d.ts","sourceRoot":"","sources":["../../../../../src/components/SiteMenu/lib/NavListItemProps.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAA;AACjD,OAAO,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAA;AAChD,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACjC,OAAO,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAA;AAErC,MAAM,WAAW,gBAAgB;IAC/B,OAAO,EAAE,iBAAiB,CAAC,SAAS,CAAC,CAAA;IACrC,EAAE,CAAC,EAAE,EAAE,CAAA;IACP,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB,aAAa,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,CAAA;IACtC,OAAO,CAAC,EAAE,MAAM,CAAA;CACjB"}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"NavListItemProps.js","sourceRoot":"","sources":["../../../../../src/components/SiteMenu/lib/NavListItemProps.ts"],"names":[],"mappings":""}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/SiteMenu/lib/index.ts"],"names":[],"mappings":"AAAA,cAAc,wBAAwB,CAAA"}
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/SiteMenu/lib/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAA;AAClC,cAAc,wBAAwB,CAAA"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/components/SiteMenu/lib/index.ts"],"names":[],"mappings":"AAAA,cAAc,wBAAwB,CAAA"}
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/components/SiteMenu/lib/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAA;AAClC,cAAc,wBAAwB,CAAA"}
|
package/package.json
CHANGED
@@ -16,11 +16,11 @@
|
|
16
16
|
"@xylabs/react-flexbox": "^2.15.1",
|
17
17
|
"@xylabs/react-link": "^2.15.1",
|
18
18
|
"@xylabs/react-shared": "^2.15.1",
|
19
|
-
"@xyo-network/react-app-settings": "^2.37.
|
20
|
-
"@xyo-network/react-archive": "^2.37.
|
21
|
-
"@xyo-network/react-auth-sets": "^2.37.
|
22
|
-
"@xyo-network/react-network": "^2.37.
|
23
|
-
"@xyo-network/react-shared": "^2.37.
|
19
|
+
"@xyo-network/react-app-settings": "^2.37.15",
|
20
|
+
"@xyo-network/react-archive": "^2.37.15",
|
21
|
+
"@xyo-network/react-auth-sets": "^2.37.15",
|
22
|
+
"@xyo-network/react-network": "^2.37.15",
|
23
|
+
"@xyo-network/react-shared": "^2.37.15",
|
24
24
|
"tslib": "^2.4.0"
|
25
25
|
},
|
26
26
|
"peerDependencies": {
|
@@ -77,5 +77,5 @@
|
|
77
77
|
},
|
78
78
|
"sideEffects": false,
|
79
79
|
"types": "dist/esm/index.d.ts",
|
80
|
-
"version": "2.37.
|
80
|
+
"version": "2.37.15"
|
81
81
|
}
|
@@ -12,7 +12,7 @@ import { XyoWalletBase } from '@xyo-network/wallet'
|
|
12
12
|
import { BrowserRouter } from 'react-router-dom'
|
13
13
|
|
14
14
|
import { SearchBar } from '../SearchBar'
|
15
|
-
import {
|
15
|
+
import { MenuListItemContainer } from '../SiteMenu'
|
16
16
|
import { SystemToolbar } from '../Toolbar'
|
17
17
|
import { ApplicationAppBar } from './Application'
|
18
18
|
|
@@ -41,7 +41,7 @@ const Template: ComponentStory<typeof ApplicationAppBar> = (args) => (
|
|
41
41
|
<SystemToolbar
|
42
42
|
menuItems={
|
43
43
|
<List>
|
44
|
-
<
|
44
|
+
<MenuListItemContainer primary="Hello" />
|
45
45
|
</List>
|
46
46
|
}
|
47
47
|
/>
|
@@ -71,7 +71,7 @@ WithSearchBar.args = {
|
|
71
71
|
authButton
|
72
72
|
menuItems={
|
73
73
|
<List>
|
74
|
-
<
|
74
|
+
<MenuListItemContainer primary="Hello" />
|
75
75
|
</List>
|
76
76
|
}
|
77
77
|
/>
|
@@ -6,7 +6,7 @@ import { CollapsibleProvider, useCollapsible } from '../../contexts'
|
|
6
6
|
import { MenuSection } from '../SiteMenu'
|
7
7
|
import { CollapseToggleFlex } from './CollapseToggle'
|
8
8
|
import { CollapsibleDrawer } from './CollapsibleDrawer'
|
9
|
-
import { menuDataBottom, menuDataTop } from './ExampleMenuData'
|
9
|
+
import { menuDataBottom, menuDataTop } from './ExampleMenuData.stories'
|
10
10
|
|
11
11
|
const CollapseProviderDecorator: DecoratorFn = (Story, args) => {
|
12
12
|
return (
|
package/src/components/CollapsibleDrawer/{ExampleMenuData.tsx → ExampleMenuData.stories.tsx}
RENAMED
@@ -13,9 +13,9 @@ import {
|
|
13
13
|
VscTable,
|
14
14
|
} from 'react-icons/vsc'
|
15
15
|
|
16
|
-
import {
|
16
|
+
import { MenuListItemProps } from '../SiteMenu'
|
17
17
|
|
18
|
-
export const menuDataTop:
|
18
|
+
export const menuDataTop: MenuListItemProps[] = [
|
19
19
|
{
|
20
20
|
icon: <VscGlobe fontSize="body1" />,
|
21
21
|
primary: 'Explore',
|
@@ -53,7 +53,7 @@ export const menuDataTop: SiteMenuListItemProps[] = [
|
|
53
53
|
},
|
54
54
|
]
|
55
55
|
|
56
|
-
export const menuDataBottom:
|
56
|
+
export const menuDataBottom: MenuListItemProps[] = [
|
57
57
|
{
|
58
58
|
icon: <VscGraphLine fontSize="body1" />,
|
59
59
|
primary: 'Statistics',
|
@@ -4,7 +4,7 @@ import { IconButton, List, SwipeableDrawer } from '@mui/material'
|
|
4
4
|
import { FlexBoxProps, FlexRow } from '@xylabs/react-flexbox'
|
5
5
|
import { useEffect, useState } from 'react'
|
6
6
|
|
7
|
-
import {
|
7
|
+
import { MenuListItemContainer } from './MenuListItem'
|
8
8
|
|
9
9
|
export interface SiteMenuProps extends FlexBoxProps {
|
10
10
|
hideSettingsMenuItem?: boolean
|
@@ -40,7 +40,7 @@ export const SiteMenu: React.FC<SiteMenuProps> = ({ side = 'right', children, on
|
|
40
40
|
>
|
41
41
|
{children ?? (
|
42
42
|
<List>
|
43
|
-
<
|
43
|
+
<MenuListItemContainer primary="Settings" icon={<SettingsIcon />} to="/settings" />
|
44
44
|
</List>
|
45
45
|
)}
|
46
46
|
</SwipeableDrawer>
|
@@ -2,30 +2,30 @@ import { List } from '@mui/material'
|
|
2
2
|
import { ComponentMeta, ComponentStory } from '@storybook/react'
|
3
3
|
import { FaGlobeAmericas } from 'react-icons/fa'
|
4
4
|
|
5
|
-
import {
|
5
|
+
import { MenuListItemContainer, MenuListItemProps } from './MenuListItemContainer'
|
6
6
|
|
7
7
|
const StorybookEntry = {
|
8
8
|
argTypes: {},
|
9
|
-
component:
|
9
|
+
component: MenuListItemContainer,
|
10
10
|
parameters: {
|
11
11
|
docs: {
|
12
12
|
page: null,
|
13
13
|
},
|
14
14
|
},
|
15
|
-
title: 'appbar/
|
16
|
-
} as ComponentMeta<typeof
|
15
|
+
title: 'appbar/MenuListItemContainer',
|
16
|
+
} as ComponentMeta<typeof MenuListItemContainer>
|
17
17
|
|
18
|
-
const SiteMenuList: React.FC<
|
18
|
+
const SiteMenuList: React.FC<MenuListItemProps> = (args) => {
|
19
19
|
return (
|
20
20
|
<List>
|
21
|
-
<
|
22
|
-
<
|
23
|
-
<
|
21
|
+
<MenuListItemContainer {...args} />
|
22
|
+
<MenuListItemContainer {...args} />
|
23
|
+
<MenuListItemContainer {...args} />
|
24
24
|
</List>
|
25
25
|
)
|
26
26
|
}
|
27
27
|
|
28
|
-
const Template: ComponentStory<typeof
|
28
|
+
const Template: ComponentStory<typeof MenuListItemContainer> = (args) => {
|
29
29
|
return <SiteMenuList {...args} />
|
30
30
|
}
|
31
31
|
|