@superdispatch/ui-lab 0.50.4 → 0.50.6
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-node/index.js +41 -21
- package/dist-node/index.js.map +1 -1
- package/dist-src/email-autocomplate/EmailAutocomplete.js +3 -3
- package/dist-src/file-drop-zone/FileDropZone.js +2 -2
- package/dist-src/index.js +1 -0
- package/dist-src/navbar/Navbar.js +13 -4
- package/dist-src/navbar/NavbarAccordion.js +18 -9
- package/dist-src/navbar/NavbarList.js +1 -1
- package/dist-src/sidebar/SidebarBackButton.js +1 -1
- package/dist-src/sidebar/SidebarMenuItem.js +1 -1
- package/dist-src/sidebar/SidebarMenuItemAvatar.js +1 -1
- package/dist-types/index.d.ts +8 -2
- package/dist-web/index.js +41 -23
- package/dist-web/index.js.map +1 -1
- package/package.json +4 -4
|
@@ -36,7 +36,7 @@ export var EmailAutocomplete = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
36
36
|
},
|
|
37
37
|
onChange: (_event, selectedValue, reason) => {
|
|
38
38
|
var emails = selectedValue.flatMap(item => item.split(',')).map(item => item.trim());
|
|
39
|
-
_onChange === null || _onChange === void 0
|
|
39
|
+
_onChange === null || _onChange === void 0 || _onChange(emails, reason);
|
|
40
40
|
},
|
|
41
41
|
renderTags: items => {
|
|
42
42
|
return /*#__PURE__*/_jsx(Inline, {
|
|
@@ -71,13 +71,13 @@ export var EmailAutocomplete = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
71
71
|
var text = event.target.value.replace(/,/g, '');
|
|
72
72
|
var hasCommaOrSpace = /,|\s/.test(event.target.value);
|
|
73
73
|
if (hasCommaOrSpace && text.trim() !== '') {
|
|
74
|
-
_onChange === null || _onChange === void 0
|
|
74
|
+
_onChange === null || _onChange === void 0 || _onChange([...(value || []), text.trim()], 'select-option');
|
|
75
75
|
}
|
|
76
76
|
},
|
|
77
77
|
onBlur: event => {
|
|
78
78
|
var text = event.target.value;
|
|
79
79
|
if (text.trim() !== '') {
|
|
80
|
-
_onChange === null || _onChange === void 0
|
|
80
|
+
_onChange === null || _onChange === void 0 || _onChange([...(value || []), text.trim()], 'select-option');
|
|
81
81
|
}
|
|
82
82
|
}
|
|
83
83
|
}))
|
|
@@ -86,10 +86,10 @@ export var FileDropZone = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
86
86
|
maxFiles: maxFiles,
|
|
87
87
|
disabled: disabled,
|
|
88
88
|
onDropAccepted: files => {
|
|
89
|
-
_onDropAccepted === null || _onDropAccepted === void 0
|
|
89
|
+
_onDropAccepted === null || _onDropAccepted === void 0 || _onDropAccepted(files);
|
|
90
90
|
},
|
|
91
91
|
onDropRejected: fileRejections => {
|
|
92
|
-
_onDropRejected === null || _onDropRejected === void 0
|
|
92
|
+
_onDropRejected === null || _onDropRejected === void 0 || _onDropRejected(fileRejections);
|
|
93
93
|
},
|
|
94
94
|
children: _ref3 => {
|
|
95
95
|
var {
|
package/dist-src/index.js
CHANGED
|
@@ -16,6 +16,7 @@ export * from "./flag-list/FlagListItem.js";
|
|
|
16
16
|
export * from "./linked-text/LinkedText.js";
|
|
17
17
|
export * from "./multiline-text/MultilineText.js";
|
|
18
18
|
export * from "./navbar/Navbar.js";
|
|
19
|
+
export * from "./navbar/NavbarAccordion.js";
|
|
19
20
|
export * from "./navbar/NavbarAvatar.js";
|
|
20
21
|
export * from "./navbar/NavbarBottomBar.js";
|
|
21
22
|
export { useNavbarContext } from "./navbar/NavbarContext.js";
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import _objectSpread from "@babel/runtime/helpers/objectSpread2";
|
|
2
2
|
import { Drawer, useMediaQuery, useTheme } from '@material-ui/core';
|
|
3
3
|
import { ColorDynamic, useResponsiveValue } from '@superdispatch/ui';
|
|
4
|
-
import { useMemo, useState } from 'react';
|
|
4
|
+
import { useCallback, useMemo, useState } from 'react';
|
|
5
5
|
import styled from 'styled-components';
|
|
6
6
|
import { NavbarBottomBar } from "./NavbarBottomBar.js";
|
|
7
7
|
import { NavbarContext } from "./NavbarContext.js";
|
|
@@ -23,7 +23,9 @@ export function Navbar(_ref) {
|
|
|
23
23
|
bottomItems,
|
|
24
24
|
children,
|
|
25
25
|
containerStyle,
|
|
26
|
-
hasExtraBadge
|
|
26
|
+
hasExtraBadge,
|
|
27
|
+
isMenuExpanded: controlledIsMenuExpanded,
|
|
28
|
+
onMenuExpandedChange
|
|
27
29
|
} = _ref;
|
|
28
30
|
var theme = useTheme();
|
|
29
31
|
var [isDrawerOpen, setDrawerOpen] = useState(false);
|
|
@@ -32,7 +34,14 @@ export function Navbar(_ref) {
|
|
|
32
34
|
var matches = useMediaQuery(theme.breakpoints.up('md'), {
|
|
33
35
|
noSsr: true
|
|
34
36
|
});
|
|
35
|
-
var [
|
|
37
|
+
var [internalIsMenuExpanded, setInternalMenuExpanded] = useState(matches);
|
|
38
|
+
var isMenuExpanded = controlledIsMenuExpanded !== undefined ? controlledIsMenuExpanded : internalIsMenuExpanded;
|
|
39
|
+
var setMenuExpanded = useCallback(value => {
|
|
40
|
+
if (controlledIsMenuExpanded === undefined) {
|
|
41
|
+
setInternalMenuExpanded(value);
|
|
42
|
+
}
|
|
43
|
+
onMenuExpandedChange === null || onMenuExpandedChange === void 0 || onMenuExpandedChange(value);
|
|
44
|
+
}, [controlledIsMenuExpanded, onMenuExpandedChange]);
|
|
36
45
|
var hasBadge = hasExtraBadge || items.some(item => item.badge);
|
|
37
46
|
var ctx = useMemo(() => ({
|
|
38
47
|
isDrawerOpen,
|
|
@@ -40,7 +49,7 @@ export function Navbar(_ref) {
|
|
|
40
49
|
setDrawerOpen,
|
|
41
50
|
setMenuExpanded,
|
|
42
51
|
isNavbarExpanded: isMenuExpanded || isDrawerOpen
|
|
43
|
-
}), [isDrawerOpen, isMenuExpanded,
|
|
52
|
+
}), [isDrawerOpen, isMenuExpanded, setDrawerOpen, setMenuExpanded]);
|
|
44
53
|
return /*#__PURE__*/_jsx(NavbarContext.Provider, {
|
|
45
54
|
value: ctx,
|
|
46
55
|
children: /*#__PURE__*/_jsxs("div", {
|
|
@@ -34,19 +34,28 @@ export function NavbarAccordion(_ref2) {
|
|
|
34
34
|
icon,
|
|
35
35
|
gutter,
|
|
36
36
|
items,
|
|
37
|
-
onClick: _onClick
|
|
37
|
+
onClick: _onClick,
|
|
38
|
+
isExpanded: controlledIsExpanded,
|
|
39
|
+
onExpandedChange
|
|
38
40
|
} = _ref2;
|
|
39
41
|
var uid = useUID();
|
|
40
42
|
var {
|
|
41
43
|
setDrawerOpen,
|
|
42
44
|
isNavbarExpanded
|
|
43
45
|
} = useNavbarContext();
|
|
44
|
-
var [
|
|
45
|
-
|
|
46
|
-
// sync accordion state with Desktop menu state
|
|
46
|
+
var [internalIsExpanded, setInternalExpanded] = useState(true);
|
|
47
47
|
useEffect(() => {
|
|
48
|
-
|
|
49
|
-
|
|
48
|
+
if (controlledIsExpanded === undefined) {
|
|
49
|
+
setInternalExpanded(isNavbarExpanded);
|
|
50
|
+
}
|
|
51
|
+
}, [isNavbarExpanded, controlledIsExpanded]);
|
|
52
|
+
var isExpanded = controlledIsExpanded !== undefined ? controlledIsExpanded : internalIsExpanded;
|
|
53
|
+
function setExpanded(value) {
|
|
54
|
+
if (controlledIsExpanded === undefined) {
|
|
55
|
+
setInternalExpanded(value);
|
|
56
|
+
}
|
|
57
|
+
onExpandedChange === null || onExpandedChange === void 0 || onExpandedChange(value);
|
|
58
|
+
}
|
|
50
59
|
var filteredItems = useMemo(() => items.filter(item => !item.hide), [items]);
|
|
51
60
|
return /*#__PURE__*/_jsxs(NavbarAccordionRoot, {
|
|
52
61
|
square: true,
|
|
@@ -54,8 +63,8 @@ export function NavbarAccordion(_ref2) {
|
|
|
54
63
|
"aria-labelledby": uid,
|
|
55
64
|
expanded: isExpanded,
|
|
56
65
|
onClick: event => {
|
|
57
|
-
_onClick === null || _onClick === void 0
|
|
58
|
-
if (isNavbarExpanded) {
|
|
66
|
+
_onClick === null || _onClick === void 0 || _onClick(event);
|
|
67
|
+
if (controlledIsExpanded !== undefined || isNavbarExpanded) {
|
|
59
68
|
setExpanded(!isExpanded);
|
|
60
69
|
}
|
|
61
70
|
},
|
|
@@ -84,7 +93,7 @@ export function NavbarAccordion(_ref2) {
|
|
|
84
93
|
onClick: event => {
|
|
85
94
|
var _item$onClick;
|
|
86
95
|
event.stopPropagation();
|
|
87
|
-
(_item$onClick = item.onClick) === null || _item$onClick === void 0
|
|
96
|
+
(_item$onClick = item.onClick) === null || _item$onClick === void 0 || _item$onClick.call(item, event);
|
|
88
97
|
if (!event.isDefaultPrevented()) {
|
|
89
98
|
setDrawerOpen(false);
|
|
90
99
|
}
|
|
@@ -122,7 +122,7 @@ export function NavbarList(_ref6) {
|
|
|
122
122
|
gutter: prev && prev.groupKey !== item.groupKey,
|
|
123
123
|
onClick: event => {
|
|
124
124
|
var _item$onClick;
|
|
125
|
-
(_item$onClick = item.onClick) === null || _item$onClick === void 0
|
|
125
|
+
(_item$onClick = item.onClick) === null || _item$onClick === void 0 || _item$onClick.call(item, event);
|
|
126
126
|
if (!event.isDefaultPrevented()) {
|
|
127
127
|
setDrawerOpen(false);
|
|
128
128
|
}
|
|
@@ -24,7 +24,7 @@ export function SidebarBackButton(_ref) {
|
|
|
24
24
|
return /*#__PURE__*/_jsx(IconButton, _objectSpread(_objectSpread({}, props), {}, {
|
|
25
25
|
size: "small",
|
|
26
26
|
onClick: event => {
|
|
27
|
-
_onClick === null || _onClick === void 0
|
|
27
|
+
_onClick === null || _onClick === void 0 || _onClick(event);
|
|
28
28
|
if (!event.isDefaultPrevented()) {
|
|
29
29
|
openSidebar();
|
|
30
30
|
}
|
|
@@ -68,7 +68,7 @@ export var SidebarMenuItem = /*#__PURE__*/forwardRef((_ref2, ref) => {
|
|
|
68
68
|
disabled: disabled,
|
|
69
69
|
"aria-current": selected,
|
|
70
70
|
onClick: event => {
|
|
71
|
-
_onClick === null || _onClick === void 0
|
|
71
|
+
_onClick === null || _onClick === void 0 || _onClick(event);
|
|
72
72
|
if (!event.isDefaultPrevented() && openContentOnClick) {
|
|
73
73
|
openSidebarContent();
|
|
74
74
|
}
|
|
@@ -36,7 +36,7 @@ export var SidebarMenuItemAvatar = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
36
36
|
onMouseDown: stopPropagation,
|
|
37
37
|
onTouchStart: stopPropagation,
|
|
38
38
|
onChange: (_, checked) => {
|
|
39
|
-
_onChange === null || _onChange === void 0
|
|
39
|
+
_onChange === null || _onChange === void 0 || _onChange(checked);
|
|
40
40
|
}
|
|
41
41
|
})
|
|
42
42
|
});
|
package/dist-types/index.d.ts
CHANGED
|
@@ -252,13 +252,17 @@ interface NavbarBottomBarProps {
|
|
|
252
252
|
}
|
|
253
253
|
declare function NavbarBottomBar({ items, hasMenuBadge, }: NavbarBottomBarProps): ReactElement;
|
|
254
254
|
|
|
255
|
+
declare const NavbarAccordionLabel: StyledComponent<"span", DefaultTheme, {}, never>;
|
|
255
256
|
interface NavbarAccordionProps {
|
|
256
257
|
label: ReactNode;
|
|
257
258
|
icon?: ReactNode;
|
|
258
259
|
gutter?: boolean;
|
|
259
260
|
items: Array<Omit<NavbarItemOptions, 'icon'>>;
|
|
260
261
|
onClick?: (event: MouseEvent<HTMLDivElement>) => void;
|
|
262
|
+
isExpanded?: boolean;
|
|
263
|
+
onExpandedChange?: (isExpanded: boolean) => void;
|
|
261
264
|
}
|
|
265
|
+
declare function NavbarAccordion({ label, icon, gutter, items, onClick, isExpanded: controlledIsExpanded, onExpandedChange, }: NavbarAccordionProps): ReactElement;
|
|
262
266
|
|
|
263
267
|
declare const NavbarBadge: StyledComponent<"span", DefaultTheme, {}, never>;
|
|
264
268
|
declare const NavbarLabel: StyledComponent<"span", DefaultTheme, {}, never>;
|
|
@@ -307,8 +311,10 @@ interface NavbarProps {
|
|
|
307
311
|
bottomItems: NavbarBottomBarItem[];
|
|
308
312
|
footer?: ReactNode;
|
|
309
313
|
hasExtraBadge?: boolean;
|
|
314
|
+
isMenuExpanded?: boolean;
|
|
315
|
+
onMenuExpandedChange?: (isExpanded: boolean) => void;
|
|
310
316
|
}
|
|
311
|
-
declare function Navbar({ footer, items, header, bottomItems, children, containerStyle, hasExtraBadge, }: NavbarProps): ReactElement;
|
|
317
|
+
declare function Navbar({ footer, items, header, bottomItems, children, containerStyle, hasExtraBadge, isMenuExpanded: controlledIsMenuExpanded, onMenuExpandedChange, }: NavbarProps): ReactElement;
|
|
312
318
|
|
|
313
319
|
interface NavbarAvatarProps extends Omit<AvatarProps, 'title'> {
|
|
314
320
|
title: ReactNode;
|
|
@@ -435,4 +441,4 @@ interface TextBoxProps {
|
|
|
435
441
|
}
|
|
436
442
|
declare const TextBox: ForwardRefExoticComponent<TextBoxProps & RefAttributes<HTMLElement>>;
|
|
437
443
|
|
|
438
|
-
export { Alert, AlertProps, AlertSeverityProp, AnchorButton, AnchorButtonProps, Banner, BorderRadiusProp, BorderWidthProp, Box, BoxProps, Button, ButtonArea, ButtonAreaProps, ButtonProps, ButtonSizeProp, ButtonVariantProp, Chat, ChatMessage, Container, ContainerProps, DescriptionItem, DescriptionItemProps, DescriptionLineItem, DottedLine, EmailAutocomplete, EmailAutocompleteProps, FileDropZone, FileDropZoneProps, FileListItem, FileListItemProps, FlagList, FlagListItem, LinkComponentProps, LinkedText, LinkedTextProps, MarginProp, MultilineText, MultilineTextProps, Navbar, NavbarAccordionOptions, NavbarAvatar, NavbarBadge, NavbarBottomBar, NavbarBottomBarItem, NavbarItem, NavbarItemOptions, NavbarItemProps, NavbarLabel, NavbarList, NavbarMenu, NavbarMenuItem, NavbarMenuItemOption, PasswordStrength, Sidebar, SidebarBackButton, SidebarContainer, SidebarContainerProps, SidebarContent, SidebarContentProps, SidebarDivider, SidebarMenuItem, SidebarMenuItemAction, SidebarMenuItemActionProps, SidebarMenuItemAvatar, SidebarMenuItemAvatarProps, SidebarMenuItemProps, SidebarProps, SidebarSubheader, SidebarSubheaderProps, TextAlignProp, TextBox, TextBoxProps, TextColorProp, TextDisplayProp, TextVariantProp, formatBytes, toBytes, useNavbarContext, useSidebarContext };
|
|
444
|
+
export { Alert, AlertProps, AlertSeverityProp, AnchorButton, AnchorButtonProps, Banner, BorderRadiusProp, BorderWidthProp, Box, BoxProps, Button, ButtonArea, ButtonAreaProps, ButtonProps, ButtonSizeProp, ButtonVariantProp, Chat, ChatMessage, Container, ContainerProps, DescriptionItem, DescriptionItemProps, DescriptionLineItem, DottedLine, EmailAutocomplete, EmailAutocompleteProps, FileDropZone, FileDropZoneProps, FileListItem, FileListItemProps, FlagList, FlagListItem, LinkComponentProps, LinkedText, LinkedTextProps, MarginProp, MultilineText, MultilineTextProps, Navbar, NavbarAccordion, NavbarAccordionLabel, NavbarAccordionOptions, NavbarAccordionProps, NavbarAvatar, NavbarBadge, NavbarBottomBar, NavbarBottomBarItem, NavbarItem, NavbarItemOptions, NavbarItemProps, NavbarLabel, NavbarList, NavbarMenu, NavbarMenuItem, NavbarMenuItemOption, PasswordStrength, Sidebar, SidebarBackButton, SidebarContainer, SidebarContainerProps, SidebarContent, SidebarContentProps, SidebarDivider, SidebarMenuItem, SidebarMenuItemAction, SidebarMenuItemActionProps, SidebarMenuItemAvatar, SidebarMenuItemAvatarProps, SidebarMenuItemProps, SidebarProps, SidebarSubheader, SidebarSubheaderProps, TextAlignProp, TextBox, TextBoxProps, TextColorProp, TextDisplayProp, TextVariantProp, formatBytes, toBytes, useNavbarContext, useSidebarContext };
|
package/dist-web/index.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { CheckCircle, Info, Error as Error$1, WarningRounded, Image, Refresh, Delete, Warning, Flag, Help, Menu, ExpandMore, MenuOpen, Check, ArrowBack, OpenInNew } from '@material-ui/icons';
|
|
2
2
|
import { Alert as Alert$1, Autocomplete } from '@material-ui/lab';
|
|
3
3
|
import { ColorDynamic, parseResponsiveProp, isColorDynamicProp, parseSpaceProp, Stack, Color, Inline, mergeRefs, useUID, isEmptyReactNode, Columns, Column, Tag, CardButton, useResponsiveValue, ColorDark, useCollapseBreakpoint } from '@superdispatch/ui';
|
|
4
|
-
import { forwardRef, useState, useEffect, Children, useRef, useLayoutEffect, Suspense, memo, useContext, createContext, useMemo, createElement } from 'react';
|
|
4
|
+
import { forwardRef, useState, useEffect, Children, useRef, useLayoutEffect, Suspense, memo, useContext, createContext, useMemo, createElement, useCallback } from 'react';
|
|
5
5
|
import styled, { css, keyframes } from 'styled-components';
|
|
6
6
|
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
7
7
|
import _objectSpread from '@babel/runtime/helpers/objectSpread2';
|
|
@@ -902,7 +902,7 @@ var EmailAutocomplete = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
902
902
|
},
|
|
903
903
|
onChange: (_event, selectedValue, reason) => {
|
|
904
904
|
var emails = selectedValue.flatMap(item => item.split(',')).map(item => item.trim());
|
|
905
|
-
_onChange === null || _onChange === void 0
|
|
905
|
+
_onChange === null || _onChange === void 0 || _onChange(emails, reason);
|
|
906
906
|
},
|
|
907
907
|
renderTags: items => {
|
|
908
908
|
return /*#__PURE__*/jsx(Inline, {
|
|
@@ -937,13 +937,13 @@ var EmailAutocomplete = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
937
937
|
var text = event.target.value.replace(/,/g, '');
|
|
938
938
|
var hasCommaOrSpace = /,|\s/.test(event.target.value);
|
|
939
939
|
if (hasCommaOrSpace && text.trim() !== '') {
|
|
940
|
-
_onChange === null || _onChange === void 0
|
|
940
|
+
_onChange === null || _onChange === void 0 || _onChange([...(value || []), text.trim()], 'select-option');
|
|
941
941
|
}
|
|
942
942
|
},
|
|
943
943
|
onBlur: event => {
|
|
944
944
|
var text = event.target.value;
|
|
945
945
|
if (text.trim() !== '') {
|
|
946
|
-
_onChange === null || _onChange === void 0
|
|
946
|
+
_onChange === null || _onChange === void 0 || _onChange([...(value || []), text.trim()], 'select-option');
|
|
947
947
|
}
|
|
948
948
|
}
|
|
949
949
|
}))
|
|
@@ -1030,10 +1030,10 @@ var FileDropZone = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
1030
1030
|
maxFiles: maxFiles,
|
|
1031
1031
|
disabled: disabled,
|
|
1032
1032
|
onDropAccepted: files => {
|
|
1033
|
-
_onDropAccepted === null || _onDropAccepted === void 0
|
|
1033
|
+
_onDropAccepted === null || _onDropAccepted === void 0 || _onDropAccepted(files);
|
|
1034
1034
|
},
|
|
1035
1035
|
onDropRejected: fileRejections => {
|
|
1036
|
-
_onDropRejected === null || _onDropRejected === void 0
|
|
1036
|
+
_onDropRejected === null || _onDropRejected === void 0 || _onDropRejected(fileRejections);
|
|
1037
1037
|
},
|
|
1038
1038
|
children: _ref3 => {
|
|
1039
1039
|
var {
|
|
@@ -1483,19 +1483,28 @@ function NavbarAccordion(_ref2) {
|
|
|
1483
1483
|
icon,
|
|
1484
1484
|
gutter,
|
|
1485
1485
|
items,
|
|
1486
|
-
onClick: _onClick
|
|
1486
|
+
onClick: _onClick,
|
|
1487
|
+
isExpanded: controlledIsExpanded,
|
|
1488
|
+
onExpandedChange
|
|
1487
1489
|
} = _ref2;
|
|
1488
1490
|
var uid = useUID();
|
|
1489
1491
|
var {
|
|
1490
1492
|
setDrawerOpen,
|
|
1491
1493
|
isNavbarExpanded
|
|
1492
1494
|
} = useNavbarContext();
|
|
1493
|
-
var [
|
|
1494
|
-
|
|
1495
|
-
// sync accordion state with Desktop menu state
|
|
1495
|
+
var [internalIsExpanded, setInternalExpanded] = useState(true);
|
|
1496
1496
|
useEffect(() => {
|
|
1497
|
-
|
|
1498
|
-
|
|
1497
|
+
if (controlledIsExpanded === undefined) {
|
|
1498
|
+
setInternalExpanded(isNavbarExpanded);
|
|
1499
|
+
}
|
|
1500
|
+
}, [isNavbarExpanded, controlledIsExpanded]);
|
|
1501
|
+
var isExpanded = controlledIsExpanded !== undefined ? controlledIsExpanded : internalIsExpanded;
|
|
1502
|
+
function setExpanded(value) {
|
|
1503
|
+
if (controlledIsExpanded === undefined) {
|
|
1504
|
+
setInternalExpanded(value);
|
|
1505
|
+
}
|
|
1506
|
+
onExpandedChange === null || onExpandedChange === void 0 || onExpandedChange(value);
|
|
1507
|
+
}
|
|
1499
1508
|
var filteredItems = useMemo(() => items.filter(item => !item.hide), [items]);
|
|
1500
1509
|
return /*#__PURE__*/jsxs(NavbarAccordionRoot, {
|
|
1501
1510
|
square: true,
|
|
@@ -1503,8 +1512,8 @@ function NavbarAccordion(_ref2) {
|
|
|
1503
1512
|
"aria-labelledby": uid,
|
|
1504
1513
|
expanded: isExpanded,
|
|
1505
1514
|
onClick: event => {
|
|
1506
|
-
_onClick === null || _onClick === void 0
|
|
1507
|
-
if (isNavbarExpanded) {
|
|
1515
|
+
_onClick === null || _onClick === void 0 || _onClick(event);
|
|
1516
|
+
if (controlledIsExpanded !== undefined || isNavbarExpanded) {
|
|
1508
1517
|
setExpanded(!isExpanded);
|
|
1509
1518
|
}
|
|
1510
1519
|
},
|
|
@@ -1533,7 +1542,7 @@ function NavbarAccordion(_ref2) {
|
|
|
1533
1542
|
onClick: event => {
|
|
1534
1543
|
var _item$onClick;
|
|
1535
1544
|
event.stopPropagation();
|
|
1536
|
-
(_item$onClick = item.onClick) === null || _item$onClick === void 0
|
|
1545
|
+
(_item$onClick = item.onClick) === null || _item$onClick === void 0 || _item$onClick.call(item, event);
|
|
1537
1546
|
if (!event.isDefaultPrevented()) {
|
|
1538
1547
|
setDrawerOpen(false);
|
|
1539
1548
|
}
|
|
@@ -1657,7 +1666,7 @@ function NavbarList(_ref6) {
|
|
|
1657
1666
|
gutter: prev && prev.groupKey !== item.groupKey,
|
|
1658
1667
|
onClick: event => {
|
|
1659
1668
|
var _item$onClick;
|
|
1660
|
-
(_item$onClick = item.onClick) === null || _item$onClick === void 0
|
|
1669
|
+
(_item$onClick = item.onClick) === null || _item$onClick === void 0 || _item$onClick.call(item, event);
|
|
1661
1670
|
if (!event.isDefaultPrevented()) {
|
|
1662
1671
|
setDrawerOpen(false);
|
|
1663
1672
|
}
|
|
@@ -1686,7 +1695,9 @@ function Navbar(_ref) {
|
|
|
1686
1695
|
bottomItems,
|
|
1687
1696
|
children,
|
|
1688
1697
|
containerStyle,
|
|
1689
|
-
hasExtraBadge
|
|
1698
|
+
hasExtraBadge,
|
|
1699
|
+
isMenuExpanded: controlledIsMenuExpanded,
|
|
1700
|
+
onMenuExpandedChange
|
|
1690
1701
|
} = _ref;
|
|
1691
1702
|
var theme = useTheme();
|
|
1692
1703
|
var [isDrawerOpen, setDrawerOpen] = useState(false);
|
|
@@ -1695,7 +1706,14 @@ function Navbar(_ref) {
|
|
|
1695
1706
|
var matches = useMediaQuery(theme.breakpoints.up('md'), {
|
|
1696
1707
|
noSsr: true
|
|
1697
1708
|
});
|
|
1698
|
-
var [
|
|
1709
|
+
var [internalIsMenuExpanded, setInternalMenuExpanded] = useState(matches);
|
|
1710
|
+
var isMenuExpanded = controlledIsMenuExpanded !== undefined ? controlledIsMenuExpanded : internalIsMenuExpanded;
|
|
1711
|
+
var setMenuExpanded = useCallback(value => {
|
|
1712
|
+
if (controlledIsMenuExpanded === undefined) {
|
|
1713
|
+
setInternalMenuExpanded(value);
|
|
1714
|
+
}
|
|
1715
|
+
onMenuExpandedChange === null || onMenuExpandedChange === void 0 || onMenuExpandedChange(value);
|
|
1716
|
+
}, [controlledIsMenuExpanded, onMenuExpandedChange]);
|
|
1699
1717
|
var hasBadge = hasExtraBadge || items.some(item => item.badge);
|
|
1700
1718
|
var ctx = useMemo(() => ({
|
|
1701
1719
|
isDrawerOpen,
|
|
@@ -1703,7 +1721,7 @@ function Navbar(_ref) {
|
|
|
1703
1721
|
setDrawerOpen,
|
|
1704
1722
|
setMenuExpanded,
|
|
1705
1723
|
isNavbarExpanded: isMenuExpanded || isDrawerOpen
|
|
1706
|
-
}), [isDrawerOpen, isMenuExpanded,
|
|
1724
|
+
}), [isDrawerOpen, isMenuExpanded, setDrawerOpen, setMenuExpanded]);
|
|
1707
1725
|
return /*#__PURE__*/jsx(NavbarContext.Provider, {
|
|
1708
1726
|
value: ctx,
|
|
1709
1727
|
children: /*#__PURE__*/jsxs("div", {
|
|
@@ -2154,7 +2172,7 @@ function SidebarBackButton(_ref) {
|
|
|
2154
2172
|
return /*#__PURE__*/jsx(IconButton, _objectSpread(_objectSpread({}, props), {}, {
|
|
2155
2173
|
size: "small",
|
|
2156
2174
|
onClick: event => {
|
|
2157
|
-
_onClick === null || _onClick === void 0
|
|
2175
|
+
_onClick === null || _onClick === void 0 || _onClick(event);
|
|
2158
2176
|
if (!event.isDefaultPrevented()) {
|
|
2159
2177
|
openSidebar();
|
|
2160
2178
|
}
|
|
@@ -2350,7 +2368,7 @@ var SidebarMenuItem = /*#__PURE__*/forwardRef((_ref2, ref) => {
|
|
|
2350
2368
|
disabled: disabled,
|
|
2351
2369
|
"aria-current": selected,
|
|
2352
2370
|
onClick: event => {
|
|
2353
|
-
_onClick === null || _onClick === void 0
|
|
2371
|
+
_onClick === null || _onClick === void 0 || _onClick(event);
|
|
2354
2372
|
if (!event.isDefaultPrevented() && openContentOnClick) {
|
|
2355
2373
|
openSidebarContent();
|
|
2356
2374
|
}
|
|
@@ -2464,7 +2482,7 @@ var SidebarMenuItemAvatar = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
2464
2482
|
onMouseDown: stopPropagation,
|
|
2465
2483
|
onTouchStart: stopPropagation,
|
|
2466
2484
|
onChange: (_, checked) => {
|
|
2467
|
-
_onChange === null || _onChange === void 0
|
|
2485
|
+
_onChange === null || _onChange === void 0 || _onChange(checked);
|
|
2468
2486
|
}
|
|
2469
2487
|
})
|
|
2470
2488
|
});
|
|
@@ -2509,5 +2527,5 @@ var SidebarSubheader = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
2509
2527
|
});
|
|
2510
2528
|
if (process.env.NODE_ENV !== "production") SidebarSubheader.displayName = "SidebarSubheader";
|
|
2511
2529
|
|
|
2512
|
-
export { Alert, AnchorButton, Banner, Box, Button, ButtonArea, Chat, ChatMessage, Container, DescriptionItem, DescriptionLineItem, DottedLine, EmailAutocomplete, FileDropZone, FileListItem, FlagList, FlagListItem, LinkedText, MultilineText, Navbar, NavbarAvatar, NavbarBadge, NavbarBottomBar, NavbarItem, NavbarLabel, NavbarList, NavbarMenu, NavbarMenuItem, PasswordStrength, Sidebar, SidebarBackButton, SidebarContainer, SidebarContent, SidebarDivider, SidebarMenuItem, SidebarMenuItemAction, SidebarMenuItemAvatar, SidebarSubheader, TextBox, formatBytes, toBytes, useNavbarContext, useSidebarContext };
|
|
2530
|
+
export { Alert, AnchorButton, Banner, Box, Button, ButtonArea, Chat, ChatMessage, Container, DescriptionItem, DescriptionLineItem, DottedLine, EmailAutocomplete, FileDropZone, FileListItem, FlagList, FlagListItem, LinkedText, MultilineText, Navbar, NavbarAccordion, NavbarAccordionLabel, NavbarAvatar, NavbarBadge, NavbarBottomBar, NavbarItem, NavbarLabel, NavbarList, NavbarMenu, NavbarMenuItem, PasswordStrength, Sidebar, SidebarBackButton, SidebarContainer, SidebarContent, SidebarDivider, SidebarMenuItem, SidebarMenuItemAction, SidebarMenuItemAvatar, SidebarSubheader, TextBox, formatBytes, toBytes, useNavbarContext, useSidebarContext };
|
|
2513
2531
|
//# sourceMappingURL=index.js.map
|