@learningpool/ui 1.19.3 → 1.19.4
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/components/stream/AppHub/AppHub.js +2 -2
- package/components/stream/AppHub/AppHubBannerAdvert.js +1 -1
- package/components/stream/AppSwitcher/AppSwitcher.js +3 -4
- package/components/stream/AppSwitcher/AppSwitcherStyles.d.ts +0 -13
- package/components/stream/AppSwitcher/AppSwitcherStyles.js +4 -13
- package/package.json +1 -1
- package/types/components/stream/AppHub.d.ts +0 -1
|
@@ -23,7 +23,7 @@ const AppHub = (props) => {
|
|
|
23
23
|
? { columns: { xs: 8 } }
|
|
24
24
|
: { columns: { xs: 12 } };
|
|
25
25
|
const renderRow = (rowData, rowIndex) => {
|
|
26
|
-
const { type, items, title, allowEditLinks
|
|
26
|
+
const { type, items, title, allowEditLinks } = rowData;
|
|
27
27
|
switch (type) {
|
|
28
28
|
case Constants.DataRowType.BannerAdvert: {
|
|
29
29
|
rowData.welcomeMessage = messages['stream-hub-welcome'];
|
|
@@ -38,7 +38,7 @@ const AppHub = (props) => {
|
|
|
38
38
|
return (renderBannerAdvertRow(rowData, rowIndex));
|
|
39
39
|
}
|
|
40
40
|
case Constants.DataRowType.Product: {
|
|
41
|
-
return (_jsxs(AppHubRow, { children: [
|
|
41
|
+
return (_jsxs(AppHubRow, { children: [title && _jsx(AppHubHeader, { component: isPageLayout ? 'h2' : 'div', children: title }), _jsx(Grid, { container: true, spacing: { xs: 2, md: 3 }, rowSpacing: { xs: 3, md: 4 }, columns: gridSpacing.columns, children: items.map(({ subtitle, shortName, internalName, url, children, hubEventTypeId, hubReferenceId, ...rest }, index) => {
|
|
42
42
|
if (!url && !children) {
|
|
43
43
|
return null;
|
|
44
44
|
}
|
|
@@ -30,7 +30,7 @@ export const renderBannerAdvertRow = (rowData, rowIndex) => {
|
|
|
30
30
|
if (!hasValidImage || validItems.length === 0)
|
|
31
31
|
return null;
|
|
32
32
|
const { hubApiUrl, apiKey, token, isAppSwitcher } = hubTrackingProps;
|
|
33
|
-
return (_jsx(AppHubRow, { children: _jsxs(Grid, { container: true, spacing: 2, children: [validItems.map((item, index) => (_jsx(Grid, { xs: 12, children: _jsx(StyledAdvertPaper, { elevation: 0, children: _jsx(StyledAdvertLink, { href: addUtmParams(item.basePromoUrl, 'hub', 'hub_dashboard_banner_advert', item.name), target: "_blank", onClick: () => handleHubTracking({
|
|
33
|
+
return (_jsx(AppHubRow, { style: { margin: isAppSwitcher ? '0 0 0 2rem' : '2rem 0 0 2rem' }, children: _jsxs(Grid, { container: true, spacing: 2, children: [validItems.map((item, index) => (_jsx(Grid, { xs: 12, children: _jsx(StyledAdvertPaper, { elevation: 0, children: _jsx(StyledAdvertLink, { href: addUtmParams(item.basePromoUrl, 'hub', 'hub_dashboard_banner_advert', item.name), target: "_blank", onClick: () => handleHubTracking({
|
|
34
34
|
hubApiUrl,
|
|
35
35
|
apiKey,
|
|
36
36
|
token,
|
|
@@ -3,7 +3,7 @@ import { useState, useEffect } from 'react';
|
|
|
3
3
|
import PropTypes from 'prop-types';
|
|
4
4
|
import jwtDecode from 'jwt-decode';
|
|
5
5
|
import * as queryString from 'query-string';
|
|
6
|
-
import { AppSwitcherPanel, AppSwitcherHeaderPanel,
|
|
6
|
+
import { AppSwitcherPanel, AppSwitcherHeaderPanel, AppSwitcherCloseButton, AppSwitcherFooterPanel, StyledHomeButton, AppSwitcherShadow } from './AppSwitcherStyles';
|
|
7
7
|
import { Constants } from './constants';
|
|
8
8
|
import { defaultAttributes } from '../../../utils/dataAttributes';
|
|
9
9
|
import ChevronLeftIcon from '@mui/icons-material/ChevronLeft';
|
|
@@ -136,8 +136,7 @@ const AppSwitcher = (props) => {
|
|
|
136
136
|
});
|
|
137
137
|
}),
|
|
138
138
|
type: 'product',
|
|
139
|
-
title: messages['explore-more']
|
|
140
|
-
allowTitle: true
|
|
139
|
+
title: messages['explore-more']
|
|
141
140
|
}];
|
|
142
141
|
if (userDashboard.promotionalCampaigns?.length > 0) {
|
|
143
142
|
userDashboardData.unshift({
|
|
@@ -198,7 +197,7 @@ const AppSwitcher = (props) => {
|
|
|
198
197
|
display: isAppSwitcherOpen ? 'block' : 'none',
|
|
199
198
|
left: isDrawerOpen ? Constants.DrawerWidth.Expanded : Constants.DrawerWidth.Collapsed - 3,
|
|
200
199
|
right: (docTextDirection === 'rtl' && isDrawerOpen) ? Constants.DrawerWidth.Expanded : Constants.DrawerWidth.Collapsed - 3
|
|
201
|
-
}, role: 'dialog', "aria-label": "App Switcher", onKeyDown: handleKeyDown, "data-id": dataIds.AppSwitcherContainer, onMouseDown: (event) => event.stopPropagation(), children: [
|
|
200
|
+
}, role: 'dialog', "aria-label": "App Switcher", onKeyDown: handleKeyDown, "data-id": dataIds.AppSwitcherContainer, onMouseDown: (event) => event.stopPropagation(), children: [_jsx(AppSwitcherHeaderPanel, { children: _jsx(AppSwitcherCloseButton, { onClick: handleDialogClose }) }), dashboardData.length > 0 && _jsx(Box, { sx: { marginBottom: '3rem' }, children: _jsx(AppHub, { data: dashboardData, hasPromotionalCampaigns: hasPromotionalCampaigns, isAppSwitcher: true, userName: userFirstName || avatarName, userOrganization: userOrg, hubApiUrl: baseUrl || Constants.BaseUrl, hubApiKey: apiKey, hubToken: token }) }), dashboardData.length === 0 && _jsx(Typography, { variant: 'h2', component: 'h4', sx: { marginTop: '1rem', justifySelf: 'anchor-center' }, children: messages['data-not-found'] }), _jsx(AppSwitcherFooterPanel, { children: _jsx(StyledHomeButton, { "aria-label": messages['go-to-hub'], endIcon: docTextDirection === 'rtl' ? _jsx(ChevronLeftIcon, { sx: { marginRight: '0.5em' } }) : _jsx(ChevronRightIcon, {}), onClick: e => window.open(props.StreamHomeUrl || Constants.DefaultStreamHomeUrl), children: messages['go-to-hub'] }) })] }), _jsx(AppSwitcherShadow, { style: {
|
|
202
201
|
display: isAppSwitcherOpen ? 'block' : 'none',
|
|
203
202
|
left: isDrawerOpen ? Constants.DrawerWidth.Expanded : Constants.DrawerWidth.Collapsed - 3
|
|
204
203
|
} }), isAppSwitcherOpen && !isStandalone &&
|
|
@@ -17,19 +17,6 @@ export declare const AppSwitcherFooterPanel: import("@emotion/styled").StyledCom
|
|
|
17
17
|
} & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
|
|
18
18
|
ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
|
|
19
19
|
}, keyof import("@mui/material/OverridableComponent").CommonProps | "ref" | "children" | "sx" | "component" | ("p" | "color" | "alignContent" | "alignItems" | "alignSelf" | "bottom" | "boxShadow" | "boxSizing" | "columnGap" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "lineHeight" | "marginBlockEnd" | "marginBlockStart" | "marginBottom" | "marginInlineEnd" | "marginInlineStart" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBlockEnd" | "paddingBlockStart" | "paddingBottom" | "paddingInlineEnd" | "paddingInlineStart" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "top" | "visibility" | "whiteSpace" | "width" | "zIndex" | "border" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "marginBlock" | "marginInline" | "overflow" | "padding" | "paddingBlock" | "paddingInline" | "bgcolor" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "typography" | "displayPrint")> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
|
|
20
|
-
export declare const AppSwitcherHeader: import("@emotion/styled").StyledComponent<import("@mui/system").SystemProps<import("@mui/material").Theme> & {
|
|
21
|
-
align?: "left" | "right" | "inherit" | "center" | "justify" | undefined;
|
|
22
|
-
children?: import("react").ReactNode;
|
|
23
|
-
classes?: Partial<import("@mui/material").TypographyClasses> | undefined;
|
|
24
|
-
gutterBottom?: boolean | undefined;
|
|
25
|
-
noWrap?: boolean | undefined;
|
|
26
|
-
paragraph?: boolean | undefined;
|
|
27
|
-
sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
|
|
28
|
-
variant?: "button" | "caption" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "inherit" | "overline" | "subtitle1" | "subtitle2" | "body1" | "body2" | undefined;
|
|
29
|
-
variantMapping?: Partial<Record<"button" | "caption" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "inherit" | "overline" | "subtitle1" | "subtitle2" | "body1" | "body2", string>> | undefined;
|
|
30
|
-
} & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
|
|
31
|
-
ref?: ((instance: HTMLSpanElement | null) => void) | import("react").RefObject<HTMLSpanElement> | null | undefined;
|
|
32
|
-
}, keyof import("@mui/material/OverridableComponent").CommonProps | "children" | "sx" | "variant" | "align" | ("p" | "color" | "alignContent" | "alignItems" | "alignSelf" | "bottom" | "boxShadow" | "boxSizing" | "columnGap" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "lineHeight" | "marginBlockEnd" | "marginBlockStart" | "marginBottom" | "marginInlineEnd" | "marginInlineStart" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBlockEnd" | "paddingBlockStart" | "paddingBottom" | "paddingInlineEnd" | "paddingInlineStart" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "top" | "visibility" | "whiteSpace" | "width" | "zIndex" | "border" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "marginBlock" | "marginInline" | "overflow" | "padding" | "paddingBlock" | "paddingInline" | "bgcolor" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "typography" | "displayPrint") | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
|
|
33
20
|
export declare const AppSwitcherCloseButton: import("@emotion/styled").StyledComponent<{
|
|
34
21
|
children?: import("react").ReactNode;
|
|
35
22
|
classes?: Partial<import("@mui/material").SvgIconClasses> | undefined;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { Box
|
|
1
|
+
import { Box } from '@mui/material';
|
|
2
2
|
import CloseIcon from '@mui/icons-material/Close';
|
|
3
3
|
import { styled } from '@mui/material/styles';
|
|
4
4
|
import Button from '@mui/material/Button';
|
|
@@ -32,11 +32,9 @@ export const AppSwitcherPanel = styled('div') `
|
|
|
32
32
|
z-index: -2;
|
|
33
33
|
`;
|
|
34
34
|
export const AppSwitcherHeaderPanel = styled(Box) `
|
|
35
|
-
background-color:
|
|
36
|
-
? props.theme.palette.primary.dark
|
|
37
|
-
: defaultWhite};
|
|
35
|
+
background-color: transparent;
|
|
38
36
|
display: flex;
|
|
39
|
-
justify-content:
|
|
37
|
+
justify-content: flex-end;
|
|
40
38
|
overflow: hidden;
|
|
41
39
|
position: sticky;
|
|
42
40
|
top: 0;
|
|
@@ -53,16 +51,9 @@ export const AppSwitcherFooterPanel = styled(Box) `
|
|
|
53
51
|
z-index: 1;
|
|
54
52
|
width: ${panelWidth};
|
|
55
53
|
`;
|
|
56
|
-
export const AppSwitcherHeader = styled(Typography) `
|
|
57
|
-
display: flex;
|
|
58
|
-
font-size: 1.5rem;
|
|
59
|
-
font-weight: 400;
|
|
60
|
-
margin: 1rem;
|
|
61
|
-
text-wrap: auto;
|
|
62
|
-
`;
|
|
63
54
|
export const AppSwitcherCloseButton = styled(CloseIcon) `
|
|
64
55
|
font-size: 2rem;
|
|
65
|
-
margin:
|
|
56
|
+
margin: 0.5rem 0.75rem 0 0.75rem;
|
|
66
57
|
|
|
67
58
|
&:hover {
|
|
68
59
|
cursor: pointer;
|
package/package.json
CHANGED