@selfcommunity/react-ui 0.11.0-alpha.98 → 0.11.0-alpha.99

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.
Files changed (8) hide show
  1. package/lib/cjs/components/NavigationMenuIconButton/DefaultDrawerContent.d.ts +1 -0
  2. package/lib/cjs/components/NavigationMenuIconButton/DefaultDrawerContent.js +4 -4
  3. package/lib/cjs/components/NavigationMenuIconButton/NavigationMenuDrawer.js +3 -3
  4. package/lib/esm/components/NavigationMenuIconButton/DefaultDrawerContent.d.ts +1 -0
  5. package/lib/esm/components/NavigationMenuIconButton/DefaultDrawerContent.js +4 -4
  6. package/lib/esm/components/NavigationMenuIconButton/NavigationMenuDrawer.js +3 -3
  7. package/lib/umd/react-ui.js +1 -1
  8. package/package.json +2 -2
package/lib/cjs/components/NavigationMenuIconButton/DefaultDrawerContent.d.ts CHANGED
@@ -3,6 +3,7 @@ import { CategoryProps } from '../Category';
3
3
  export interface DefaultDrawerContentProps extends BoxProps {
4
4
  CategoryItemProps?: CategoryProps;
5
5
  tagImage?: string;
6
+ onClose?: () => void;
6
7
  onClickHome?: () => void;
7
8
  }
8
9
  export default function DefaultDrawerContent(inProps: DefaultDrawerContentProps): JSX.Element;
package/lib/cjs/components/NavigationMenuIconButton/DefaultDrawerContent.js CHANGED
@@ -32,7 +32,7 @@ function DefaultDrawerContent(inProps) {
32
32
  props: inProps,
33
33
  name: PREFIX
34
34
  });
35
- const { className, CategoryItemProps = { showTooltip: true }, tagImage = '/', onClickHome } = props, rest = tslib_1.__rest(props, ["className", "CategoryItemProps", "tagImage", "onClickHome"]);
35
+ const { className, CategoryItemProps = { showTooltip: true }, tagImage = '/', onClose, onClickHome } = props, rest = tslib_1.__rest(props, ["className", "CategoryItemProps", "tagImage", "onClose", "onClickHome"]);
36
36
  // HOOKS
37
37
  const { categories } = (0, react_core_1.useSCFetchCategories)();
38
38
  const [categoriesOrdered, setCategoriesOrdered] = (0, react_1.useState)([]);
@@ -127,10 +127,10 @@ function DefaultDrawerContent(inProps) {
127
127
  var _a;
128
128
  if (!categories.length || !((_a = categories[0].tags) === null || _a === void 0 ? void 0 : _a.length))
129
129
  return null;
130
- return ((0, jsx_runtime_1.jsxs)(material_1.Accordion, Object.assign({ expanded: expanded === tagName, onChange: handleChange(tagName), elevation: 0, onFocus: (e) => e.stopPropagation(), onClick: (e) => e.stopPropagation() }, { children: [(0, jsx_runtime_1.jsx)(material_1.AccordionSummary, Object.assign({ expandIcon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "expand_more" }) }, { children: (0, jsx_runtime_1.jsx)(BaseItem_1.default, { elevation: 0, image: (0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: tagName, src: tagName === DefaultDrawerContent_1.DefaultCategoryTagName ? formazione_1.default : tagImage, variant: "square" }), primary: tagName, disableTypography: false }) })), (0, jsx_runtime_1.jsx)(material_1.AccordionDetails, { children: (0, jsx_runtime_1.jsx)(material_1.List, { children: categories.map((c) => ((0, jsx_runtime_1.jsx)(material_1.Zoom, Object.assign({ in: true }, { children: (0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(Category_1.default, Object.assign({ ButtonBaseProps: {
130
+ return ((0, jsx_runtime_1.jsxs)(material_1.Accordion, Object.assign({ expanded: expanded === tagName, onChange: handleChange(tagName), elevation: 0, onFocus: (e) => e.stopPropagation() }, { children: [(0, jsx_runtime_1.jsx)(material_1.AccordionSummary, Object.assign({ expandIcon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "expand_more" }) }, { children: (0, jsx_runtime_1.jsx)(BaseItem_1.default, { elevation: 0, image: (0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: tagName, src: tagName === DefaultDrawerContent_1.DefaultCategoryTagName ? formazione_1.default : tagImage, variant: "square" }), primary: tagName, disableTypography: false }) })), (0, jsx_runtime_1.jsx)(material_1.AccordionDetails, { children: (0, jsx_runtime_1.jsx)(material_1.List, { children: categories.map((c) => ((0, jsx_runtime_1.jsx)(material_1.Zoom, Object.assign({ in: true }, { children: (0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(Category_1.default, Object.assign({ ButtonBaseProps: {
131
131
  component: react_core_1.Link,
132
132
  to: scRoutingContext.url(react_core_1.SCRoutes.CATEGORY_ROUTE_NAME, c)
133
- }, elevation: 0, category: c, actions: null }, CategoryItemProps, getMouseEvents(() => handleMouseEnter(c.id), () => handleMouseLeave(c.id)))) }) }), c.id))) }) })] }), tagName));
134
- }), untaggedCategories.length > 0 && ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: untaggedCategories.map((c, index) => ((0, jsx_runtime_1.jsx)(material_1.Zoom, Object.assign({ in: true, style: { transform: isHovered[c.id] && 'scale(1.05)' } }, { children: (0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(Category_1.default, Object.assign({ ButtonBaseProps: { component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.CATEGORY_ROUTE_NAME, c) }, elevation: 0, category: c, actions: null }, CategoryItemProps, getMouseEvents(() => handleMouseEnter(c.id), () => handleMouseLeave(c.id)))) }, c.id) }), index))) }))] })] })));
133
+ }, elevation: 0, category: c, actions: null }, CategoryItemProps, getMouseEvents(() => handleMouseEnter(c.id), () => handleMouseLeave(c.id)), { onClick: onClose })) }) }), c.id))) }) })] }), tagName));
134
+ }), untaggedCategories.length > 0 && ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: untaggedCategories.map((c, index) => ((0, jsx_runtime_1.jsx)(material_1.Zoom, Object.assign({ in: true, style: { transform: isHovered[c.id] && 'scale(1.05)' } }, { children: (0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(Category_1.default, Object.assign({ ButtonBaseProps: { component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.CATEGORY_ROUTE_NAME, c) }, elevation: 0, category: c, actions: null }, CategoryItemProps, getMouseEvents(() => handleMouseEnter(c.id), () => handleMouseLeave(c.id)), { onClick: onClose })) }, c.id) }), index))) }))] })] })));
135
135
  }
136
136
  exports.default = DefaultDrawerContent;
package/lib/cjs/components/NavigationMenuIconButton/NavigationMenuDrawer.js CHANGED
@@ -25,7 +25,7 @@ const classes = {
25
25
  const Root = (0, material_1.styled)(material_1.Drawer, {
26
26
  name: PREFIX,
27
27
  slot: 'Root',
28
- overridesResolver: (props, styles) => styles.root
28
+ overridesResolver: (_props, styles) => styles.root
29
29
  })(({ theme }) => ({}));
30
30
  function NavigationMenuDrawer(inProps) {
31
31
  // PROPS
@@ -33,7 +33,7 @@ function NavigationMenuDrawer(inProps) {
33
33
  props: inProps,
34
34
  name: PREFIX
35
35
  });
36
- const { className = null, showDrawerHeader = true, defaultDrawerContentProps = null, drawerHeaderContent = (0, jsx_runtime_1.jsx)(DefaultHeaderContent_1.default, {}), drawerContent = (0, jsx_runtime_1.jsx)(DefaultDrawerContent_1.default, Object.assign({}, defaultDrawerContentProps)), showDrawerFooterContent = true, drawerFooterContent = null, ScrollContainerProps = { hideTracksWhenNotNeeded: true }, CreateLiveStreamButtonComponentProps = {}, open, onClose } = props, rest = tslib_1.__rest(props, ["className", "showDrawerHeader", "defaultDrawerContentProps", "drawerHeaderContent", "drawerContent", "showDrawerFooterContent", "drawerFooterContent", "ScrollContainerProps", "CreateLiveStreamButtonComponentProps", "open", "onClose"]);
36
+ const { className = null, showDrawerHeader = true, defaultDrawerContentProps = null, drawerHeaderContent = (0, jsx_runtime_1.jsx)(DefaultHeaderContent_1.default, {}), drawerContent = (0, jsx_runtime_1.jsx)(DefaultDrawerContent_1.default, Object.assign({ onClose: () => onClose({}, 'backdropClick') }, defaultDrawerContentProps)), showDrawerFooterContent = true, drawerFooterContent = null, ScrollContainerProps = { hideTracksWhenNotNeeded: true }, CreateLiveStreamButtonComponentProps = {}, open, onClose } = props, rest = tslib_1.__rest(props, ["className", "showDrawerHeader", "defaultDrawerContentProps", "drawerHeaderContent", "drawerContent", "showDrawerFooterContent", "drawerFooterContent", "ScrollContainerProps", "CreateLiveStreamButtonComponentProps", "open", "onClose"]);
37
37
  const footerContent = (() => {
38
38
  if (typeof drawerFooterContent === 'function') {
39
39
  return drawerFooterContent({ handleCloseMenuDrawer: onClose });
@@ -45,6 +45,6 @@ function NavigationMenuDrawer(inProps) {
45
45
  }
46
46
  return drawerFooterContent;
47
47
  })();
48
- return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ anchor: "left", className: (0, classnames_1.default)(classes.root, className), open: open, onClose: onClose }, rest, { children: [showDrawerHeader && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.drawerHeader }, { children: [drawerHeaderContent, (0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ className: classes.drawerHeaderAction, onClick: onClose }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) }))] })), (0, jsx_runtime_1.jsx)(material_1.Divider, {})] })), (0, jsx_runtime_1.jsx)(ScrollContainer_1.default, Object.assign({}, ScrollContainerProps, { children: (0, jsx_runtime_1.jsx)(material_1.List, Object.assign({ className: classes.drawerContent, onClick: onClose }, { children: drawerContent })) })), showDrawerFooterContent && ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ component: "div", className: classes.drawerFooter }, { children: footerContent || ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.drawerFooterLiveStream }, { children: (0, jsx_runtime_1.jsx)(CreateLiveStreamButton_1.default, Object.assign({ color: "primary", className: classes.drawerFooterLiveStreamButton, fullWidth: true }, CreateLiveStreamButtonComponentProps)) }))) })) }))] })));
48
+ return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ anchor: "left", className: (0, classnames_1.default)(classes.root, className), open: open, onClose: onClose }, rest, { children: [showDrawerHeader && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.drawerHeader }, { children: [drawerHeaderContent, (0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ className: classes.drawerHeaderAction, onClick: onClose }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) }))] })), (0, jsx_runtime_1.jsx)(material_1.Divider, {})] })), (0, jsx_runtime_1.jsx)(ScrollContainer_1.default, Object.assign({}, ScrollContainerProps, { children: (0, jsx_runtime_1.jsx)(material_1.List, Object.assign({ className: classes.drawerContent }, { children: drawerContent })) })), showDrawerFooterContent && ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ component: "div", className: classes.drawerFooter }, { children: footerContent || ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.drawerFooterLiveStream }, { children: (0, jsx_runtime_1.jsx)(CreateLiveStreamButton_1.default, Object.assign({ color: "primary", className: classes.drawerFooterLiveStreamButton, fullWidth: true }, CreateLiveStreamButtonComponentProps)) }))) })) }))] })));
49
49
  }
50
50
  exports.default = NavigationMenuDrawer;
package/lib/esm/components/NavigationMenuIconButton/DefaultDrawerContent.d.ts CHANGED
@@ -3,6 +3,7 @@ import { CategoryProps } from '../Category';
3
3
  export interface DefaultDrawerContentProps extends BoxProps {
4
4
  CategoryItemProps?: CategoryProps;
5
5
  tagImage?: string;
6
+ onClose?: () => void;
6
7
  onClickHome?: () => void;
7
8
  }
8
9
  export default function DefaultDrawerContent(inProps: DefaultDrawerContentProps): JSX.Element;
package/lib/esm/components/NavigationMenuIconButton/DefaultDrawerContent.js CHANGED
@@ -30,7 +30,7 @@ export default function DefaultDrawerContent(inProps) {
30
30
  props: inProps,
31
31
  name: PREFIX
32
32
  });
33
- const { className, CategoryItemProps = { showTooltip: true }, tagImage = '/', onClickHome } = props, rest = __rest(props, ["className", "CategoryItemProps", "tagImage", "onClickHome"]);
33
+ const { className, CategoryItemProps = { showTooltip: true }, tagImage = '/', onClose, onClickHome } = props, rest = __rest(props, ["className", "CategoryItemProps", "tagImage", "onClose", "onClickHome"]);
34
34
  // HOOKS
35
35
  const { categories } = useSCFetchCategories();
36
36
  const [categoriesOrdered, setCategoriesOrdered] = useState([]);
@@ -125,9 +125,9 @@ export default function DefaultDrawerContent(inProps) {
125
125
  var _a;
126
126
  if (!categories.length || !((_a = categories[0].tags) === null || _a === void 0 ? void 0 : _a.length))
127
127
  return null;
128
- return (_jsxs(Accordion, Object.assign({ expanded: expanded === tagName, onChange: handleChange(tagName), elevation: 0, onFocus: (e) => e.stopPropagation(), onClick: (e) => e.stopPropagation() }, { children: [_jsx(AccordionSummary, Object.assign({ expandIcon: _jsx(Icon, { children: "expand_more" }) }, { children: _jsx(BaseItem, { elevation: 0, image: _jsx(Avatar, { alt: tagName, src: tagName === DefaultCategoryTagName ? FormazionePlaceholder : tagImage, variant: "square" }), primary: tagName, disableTypography: false }) })), _jsx(AccordionDetails, { children: _jsx(List, { children: categories.map((c) => (_jsx(Zoom, Object.assign({ in: true }, { children: _jsx(ListItem, { children: _jsx(Category, Object.assign({ ButtonBaseProps: {
128
+ return (_jsxs(Accordion, Object.assign({ expanded: expanded === tagName, onChange: handleChange(tagName), elevation: 0, onFocus: (e) => e.stopPropagation() }, { children: [_jsx(AccordionSummary, Object.assign({ expandIcon: _jsx(Icon, { children: "expand_more" }) }, { children: _jsx(BaseItem, { elevation: 0, image: _jsx(Avatar, { alt: tagName, src: tagName === DefaultCategoryTagName ? FormazionePlaceholder : tagImage, variant: "square" }), primary: tagName, disableTypography: false }) })), _jsx(AccordionDetails, { children: _jsx(List, { children: categories.map((c) => (_jsx(Zoom, Object.assign({ in: true }, { children: _jsx(ListItem, { children: _jsx(Category, Object.assign({ ButtonBaseProps: {
129
129
  component: Link,
130
130
  to: scRoutingContext.url(SCRoutes.CATEGORY_ROUTE_NAME, c)
131
- }, elevation: 0, category: c, actions: null }, CategoryItemProps, getMouseEvents(() => handleMouseEnter(c.id), () => handleMouseLeave(c.id)))) }) }), c.id))) }) })] }), tagName));
132
- }), untaggedCategories.length > 0 && (_jsx(_Fragment, { children: untaggedCategories.map((c, index) => (_jsx(Zoom, Object.assign({ in: true, style: { transform: isHovered[c.id] && 'scale(1.05)' } }, { children: _jsx(ListItem, { children: _jsx(Category, Object.assign({ ButtonBaseProps: { component: Link, to: scRoutingContext.url(SCRoutes.CATEGORY_ROUTE_NAME, c) }, elevation: 0, category: c, actions: null }, CategoryItemProps, getMouseEvents(() => handleMouseEnter(c.id), () => handleMouseLeave(c.id)))) }, c.id) }), index))) }))] })] })));
131
+ }, elevation: 0, category: c, actions: null }, CategoryItemProps, getMouseEvents(() => handleMouseEnter(c.id), () => handleMouseLeave(c.id)), { onClick: onClose })) }) }), c.id))) }) })] }), tagName));
132
+ }), untaggedCategories.length > 0 && (_jsx(_Fragment, { children: untaggedCategories.map((c, index) => (_jsx(Zoom, Object.assign({ in: true, style: { transform: isHovered[c.id] && 'scale(1.05)' } }, { children: _jsx(ListItem, { children: _jsx(Category, Object.assign({ ButtonBaseProps: { component: Link, to: scRoutingContext.url(SCRoutes.CATEGORY_ROUTE_NAME, c) }, elevation: 0, category: c, actions: null }, CategoryItemProps, getMouseEvents(() => handleMouseEnter(c.id), () => handleMouseLeave(c.id)), { onClick: onClose })) }, c.id) }), index))) }))] })] })));
133
133
  }
package/lib/esm/components/NavigationMenuIconButton/NavigationMenuDrawer.js CHANGED
@@ -23,7 +23,7 @@ const classes = {
23
23
  const Root = styled(Drawer, {
24
24
  name: PREFIX,
25
25
  slot: 'Root',
26
- overridesResolver: (props, styles) => styles.root
26
+ overridesResolver: (_props, styles) => styles.root
27
27
  })(({ theme }) => ({}));
28
28
  export default function NavigationMenuDrawer(inProps) {
29
29
  // PROPS
@@ -31,7 +31,7 @@ export default function NavigationMenuDrawer(inProps) {
31
31
  props: inProps,
32
32
  name: PREFIX
33
33
  });
34
- const { className = null, showDrawerHeader = true, defaultDrawerContentProps = null, drawerHeaderContent = _jsx(DefaultHeaderContent, {}), drawerContent = _jsx(DefaultDrawerContent, Object.assign({}, defaultDrawerContentProps)), showDrawerFooterContent = true, drawerFooterContent = null, ScrollContainerProps = { hideTracksWhenNotNeeded: true }, CreateLiveStreamButtonComponentProps = {}, open, onClose } = props, rest = __rest(props, ["className", "showDrawerHeader", "defaultDrawerContentProps", "drawerHeaderContent", "drawerContent", "showDrawerFooterContent", "drawerFooterContent", "ScrollContainerProps", "CreateLiveStreamButtonComponentProps", "open", "onClose"]);
34
+ const { className = null, showDrawerHeader = true, defaultDrawerContentProps = null, drawerHeaderContent = _jsx(DefaultHeaderContent, {}), drawerContent = _jsx(DefaultDrawerContent, Object.assign({ onClose: () => onClose({}, 'backdropClick') }, defaultDrawerContentProps)), showDrawerFooterContent = true, drawerFooterContent = null, ScrollContainerProps = { hideTracksWhenNotNeeded: true }, CreateLiveStreamButtonComponentProps = {}, open, onClose } = props, rest = __rest(props, ["className", "showDrawerHeader", "defaultDrawerContentProps", "drawerHeaderContent", "drawerContent", "showDrawerFooterContent", "drawerFooterContent", "ScrollContainerProps", "CreateLiveStreamButtonComponentProps", "open", "onClose"]);
35
35
  const footerContent = (() => {
36
36
  if (typeof drawerFooterContent === 'function') {
37
37
  return drawerFooterContent({ handleCloseMenuDrawer: onClose });
@@ -43,5 +43,5 @@ export default function NavigationMenuDrawer(inProps) {
43
43
  }
44
44
  return drawerFooterContent;
45
45
  })();
46
- return (_jsxs(Root, Object.assign({ anchor: "left", className: classNames(classes.root, className), open: open, onClose: onClose }, rest, { children: [showDrawerHeader && (_jsxs(_Fragment, { children: [_jsxs(Box, Object.assign({ className: classes.drawerHeader }, { children: [drawerHeaderContent, _jsx(IconButton, Object.assign({ className: classes.drawerHeaderAction, onClick: onClose }, { children: _jsx(Icon, { children: "close" }) }))] })), _jsx(Divider, {})] })), _jsx(ScrollContainer, Object.assign({}, ScrollContainerProps, { children: _jsx(List, Object.assign({ className: classes.drawerContent, onClick: onClose }, { children: drawerContent })) })), showDrawerFooterContent && (_jsx(_Fragment, { children: _jsx(Box, Object.assign({ component: "div", className: classes.drawerFooter }, { children: footerContent || (_jsx(Box, Object.assign({ className: classes.drawerFooterLiveStream }, { children: _jsx(CreateLiveStreamButton, Object.assign({ color: "primary", className: classes.drawerFooterLiveStreamButton, fullWidth: true }, CreateLiveStreamButtonComponentProps)) }))) })) }))] })));
46
+ return (_jsxs(Root, Object.assign({ anchor: "left", className: classNames(classes.root, className), open: open, onClose: onClose }, rest, { children: [showDrawerHeader && (_jsxs(_Fragment, { children: [_jsxs(Box, Object.assign({ className: classes.drawerHeader }, { children: [drawerHeaderContent, _jsx(IconButton, Object.assign({ className: classes.drawerHeaderAction, onClick: onClose }, { children: _jsx(Icon, { children: "close" }) }))] })), _jsx(Divider, {})] })), _jsx(ScrollContainer, Object.assign({}, ScrollContainerProps, { children: _jsx(List, Object.assign({ className: classes.drawerContent }, { children: drawerContent })) })), showDrawerFooterContent && (_jsx(_Fragment, { children: _jsx(Box, Object.assign({ component: "div", className: classes.drawerFooter }, { children: footerContent || (_jsx(Box, Object.assign({ className: classes.drawerFooterLiveStream }, { children: _jsx(CreateLiveStreamButton, Object.assign({ color: "primary", className: classes.drawerFooterLiveStreamButton, fullWidth: true }, CreateLiveStreamButtonComponentProps)) }))) })) }))] })));
47
47
  }