@blocklet/ui-react 2.12.2 → 2.12.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/lib/Footer/index.js +1 -23
- package/lib/Footer/layout/plain.js +5 -5
- package/lib/Footer/layout/standard.js +34 -26
- package/lib/Footer/links.js +12 -1
- package/lib/Header/index.js +0 -20
- package/package.json +4 -4
- package/src/Footer/index.jsx +1 -25
- package/src/Footer/layout/plain.jsx +16 -14
- package/src/Footer/layout/standard.jsx +18 -11
- package/src/Footer/links.jsx +7 -1
- package/src/Header/index.tsx +0 -20
package/lib/Footer/index.js
CHANGED
|
@@ -1,14 +1,12 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
2
|
import { useMemo } from "react";
|
|
3
3
|
import PropTypes from "prop-types";
|
|
4
|
-
import { useCreation } from "ahooks";
|
|
5
4
|
import { styled } from "@arcblock/ux/lib/Theme";
|
|
6
5
|
import { withErrorBoundary } from "react-error-boundary";
|
|
7
6
|
import { useLocaleContext } from "@arcblock/ux/lib/Locale/context";
|
|
8
7
|
import { ErrorFallback } from "@arcblock/ux/lib/ErrorBoundary";
|
|
9
8
|
import { temp as colors } from "@arcblock/ux/lib/Colors";
|
|
10
9
|
import omit from "lodash/omit";
|
|
11
|
-
import isFinite from "lodash/isFinite";
|
|
12
10
|
import OverridableThemeProvider from "../common/overridable-theme-provider.js";
|
|
13
11
|
import InternalFooter from "./internal-footer.js";
|
|
14
12
|
import { mapRecursive } from "../utils.js";
|
|
@@ -26,32 +24,12 @@ function Footer({ meta, theme: themeOverrides, ...rest }) {
|
|
|
26
24
|
return blocklet;
|
|
27
25
|
}
|
|
28
26
|
}, [meta]);
|
|
29
|
-
const productsNav = useCreation(() => {
|
|
30
|
-
return {
|
|
31
|
-
title: { en: "Products", zh: "\u4EA7\u54C1" },
|
|
32
|
-
section: ["footer"],
|
|
33
|
-
items: [
|
|
34
|
-
{ title: "ArcSphere", link: `https://www.arcblock.io/content/tags/${locale}/arcsphere`, isNew: true },
|
|
35
|
-
{ title: "DID Wallet", link: `https://www.didwallet.io/${locale}` },
|
|
36
|
-
{ title: "DID Spaces", link: `https://www.didspaces.com/${locale}` },
|
|
37
|
-
{ title: "DID Name Service", link: `https://www.didnames.io/${locale}` },
|
|
38
|
-
{ title: "Blocklet Launcher", link: `https://launcher.arcblock.io/${locale}` },
|
|
39
|
-
{ title: "Blocklet Server", link: `https://www.arcblock.io/content/collections/${locale}/blocklet-server` },
|
|
40
|
-
{ title: "AIGNE", link: `https://www.aigne.io/${locale}` }
|
|
41
|
-
]
|
|
42
|
-
};
|
|
43
|
-
}, [locale]);
|
|
44
27
|
if (!formattedBlocklet.appName) {
|
|
45
28
|
return null;
|
|
46
29
|
}
|
|
47
30
|
const { appLogo, appLogoRect, appName, appDescription, description, theme, copyright } = formattedBlocklet;
|
|
48
|
-
const navFooter = [...formattedBlocklet?.navigation?.footer ?? []];
|
|
49
|
-
const productsNavOrder = parseInt(window.blocklet?.USE_ARCBLOCK_THEME, 10);
|
|
50
|
-
if (isFinite(productsNavOrder)) {
|
|
51
|
-
navFooter.splice(productsNavOrder, 0, productsNav);
|
|
52
|
-
}
|
|
53
31
|
const localized = {
|
|
54
|
-
footerNav: getLocalizedNavigation(
|
|
32
|
+
footerNav: getLocalizedNavigation(formattedBlocklet?.navigation?.footer, locale) || [],
|
|
55
33
|
socialMedia: getLocalizedNavigation(formattedBlocklet?.navigation?.social, locale) || [],
|
|
56
34
|
links: getLocalizedNavigation(formattedBlocklet?.navigation?.bottom, locale) || []
|
|
57
35
|
};
|
|
@@ -1,20 +1,20 @@
|
|
|
1
1
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { cloneElement } from "react";
|
|
3
3
|
import PropTypes from "prop-types";
|
|
4
|
-
import Container from "@mui/material
|
|
4
|
+
import { Container } from "@mui/material";
|
|
5
5
|
import { styled } from "@arcblock/ux/lib/Theme";
|
|
6
6
|
import Row from "./row.js";
|
|
7
7
|
function PlainLayout({ elements, data, ...rest }) {
|
|
8
|
-
return /* @__PURE__ */ jsx(Root, { ...rest, children: /* @__PURE__ */ jsxs(Container, { className: "plain-layout-container", children: [
|
|
9
|
-
|
|
8
|
+
return /* @__PURE__ */ jsx(Root, { ...rest, children: /* @__PURE__ */ jsx(Container, { children: /* @__PURE__ */ jsxs(Container, { className: "plain-layout-container", style: { padding: 0 }, children: [
|
|
9
|
+
elements.links && /* @__PURE__ */ jsxs(Row, { sx: { width: 1 }, autoCenter: true, children: [
|
|
10
10
|
elements.copyright,
|
|
11
11
|
elements.links
|
|
12
12
|
] }),
|
|
13
|
-
!
|
|
13
|
+
!elements.links && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
14
14
|
cloneElement(elements.brand, { name: null, description: null }),
|
|
15
15
|
elements.copyright
|
|
16
16
|
] })
|
|
17
|
-
] }) });
|
|
17
|
+
] }) }) });
|
|
18
18
|
}
|
|
19
19
|
PlainLayout.propTypes = {
|
|
20
20
|
elements: PropTypes.shape({
|
|
@@ -1,39 +1,45 @@
|
|
|
1
1
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
2
|
import PropTypes from "prop-types";
|
|
3
3
|
import clsx from "clsx";
|
|
4
|
-
import Box from "@mui/material
|
|
4
|
+
import { Box, Container } from "@mui/material";
|
|
5
5
|
import { grey } from "@mui/material/colors";
|
|
6
|
-
import Container from "@mui/material/Container";
|
|
7
6
|
import { styled } from "@arcblock/ux/lib/Theme";
|
|
8
7
|
import Row from "./row.js";
|
|
9
8
|
function StandardLayout({ elements, data, className, ...rest }) {
|
|
10
9
|
const withNavigation = !!data.navigation?.length;
|
|
11
10
|
let topSection = null;
|
|
12
11
|
if (withNavigation) {
|
|
13
|
-
topSection = /* @__PURE__ */ jsxs(
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
{
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
12
|
+
topSection = /* @__PURE__ */ jsxs(
|
|
13
|
+
Container,
|
|
14
|
+
{
|
|
15
|
+
sx: { display: "flex", flexDirection: { xs: "column", md: "row" }, justifyContent: "space-between" },
|
|
16
|
+
style: { padding: 0 },
|
|
17
|
+
children: [
|
|
18
|
+
/* @__PURE__ */ jsxs(
|
|
19
|
+
Box,
|
|
20
|
+
{
|
|
21
|
+
sx: {
|
|
22
|
+
flex: "1 1 auto",
|
|
23
|
+
paddingRight: { xs: 0, md: 3 },
|
|
24
|
+
display: "flex",
|
|
25
|
+
flexDirection: "column",
|
|
26
|
+
alignItems: { xs: "center", md: "flex-start" },
|
|
27
|
+
gap: 2,
|
|
28
|
+
pb: 3
|
|
29
|
+
},
|
|
30
|
+
children: [
|
|
31
|
+
/* @__PURE__ */ jsx(Box, { children: elements.brand }),
|
|
32
|
+
/* @__PURE__ */ jsx(Box, { lineHeight: 1, children: elements.socialMedia })
|
|
33
|
+
]
|
|
34
|
+
}
|
|
35
|
+
),
|
|
36
|
+
/* @__PURE__ */ jsx(Box, { sx: { mb: 3, borderTop: { xs: `1px solid ${grey[200]}`, md: 0 } }, children: elements.navigation })
|
|
37
|
+
]
|
|
38
|
+
}
|
|
39
|
+
);
|
|
34
40
|
} else {
|
|
35
41
|
topSection = /* @__PURE__ */ jsxs(
|
|
36
|
-
|
|
42
|
+
Container,
|
|
37
43
|
{
|
|
38
44
|
sx: {
|
|
39
45
|
display: "flex",
|
|
@@ -43,6 +49,7 @@ function StandardLayout({ elements, data, className, ...rest }) {
|
|
|
43
49
|
gap: 2,
|
|
44
50
|
pb: 3
|
|
45
51
|
},
|
|
52
|
+
style: { padding: 0 },
|
|
46
53
|
children: [
|
|
47
54
|
/* @__PURE__ */ jsx(Box, { children: elements.brand }),
|
|
48
55
|
/* @__PURE__ */ jsx(Box, { lineHeight: 1, children: elements.socialMedia })
|
|
@@ -52,10 +59,11 @@ function StandardLayout({ elements, data, className, ...rest }) {
|
|
|
52
59
|
}
|
|
53
60
|
return /* @__PURE__ */ jsx(Root, { ...rest, className: clsx({ "footer--with-navs": withNavigation }, className), children: /* @__PURE__ */ jsxs(Container, { children: [
|
|
54
61
|
topSection,
|
|
55
|
-
/* @__PURE__ */
|
|
62
|
+
/* @__PURE__ */ jsx(Box, { sx: { pt: 3, borderTop: 1, borderColor: "grey.200" } }),
|
|
63
|
+
/* @__PURE__ */ jsx(Container, { style: { padding: 0 }, children: /* @__PURE__ */ jsxs(Row, { autoCenter: true, children: [
|
|
56
64
|
elements.copyright,
|
|
57
65
|
elements.links
|
|
58
|
-
] })
|
|
66
|
+
] }) })
|
|
59
67
|
] }) });
|
|
60
68
|
}
|
|
61
69
|
StandardLayout.propTypes = {
|
package/lib/Footer/links.js
CHANGED
|
@@ -19,7 +19,18 @@ export default function Links({ links, flowLayout, columns, ...rest }) {
|
|
|
19
19
|
if (render) {
|
|
20
20
|
result = render({ label, link, props });
|
|
21
21
|
} else if (link) {
|
|
22
|
-
|
|
22
|
+
const isExternal = link.startsWith("http") || link.startsWith("//");
|
|
23
|
+
result = /* @__PURE__ */ jsx(
|
|
24
|
+
"a",
|
|
25
|
+
{
|
|
26
|
+
href: link,
|
|
27
|
+
"aria-label": `Footer link for ${label}`,
|
|
28
|
+
target: isExternal ? "_blank" : "_self",
|
|
29
|
+
rel: isExternal ? "noreferrer noopener" : void 0,
|
|
30
|
+
...props,
|
|
31
|
+
children: label
|
|
32
|
+
}
|
|
33
|
+
);
|
|
23
34
|
}
|
|
24
35
|
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
25
36
|
icon && /* @__PURE__ */ jsx(Icon, { icon, size: 20, sx: { mr: 0.5 } }),
|
package/lib/Header/index.js
CHANGED
|
@@ -157,26 +157,6 @@ const StyledUxHeader = styled(ResponsiveHeader)`
|
|
|
157
157
|
min-width: 32px;
|
|
158
158
|
}
|
|
159
159
|
}
|
|
160
|
-
.header-nav {
|
|
161
|
-
.navmenu-sub .navmenu-item {
|
|
162
|
-
min-width: 80px;
|
|
163
|
-
}
|
|
164
|
-
}
|
|
165
|
-
.header-nav.navmenu--horizontal {
|
|
166
|
-
.navmenu-root > .navmenu-sub,
|
|
167
|
-
.navmenu-root > .navmenu-item {
|
|
168
|
-
padding: 16px 4px;
|
|
169
|
-
|
|
170
|
-
.navmenu-sub-container {
|
|
171
|
-
padding-top: 0;
|
|
172
|
-
}
|
|
173
|
-
}
|
|
174
|
-
.navmenu-item-icon > .MuiAvatar-root,
|
|
175
|
-
.navmenu-sub-icon > .MuiAvatar-root {
|
|
176
|
-
width: 20px;
|
|
177
|
-
height: 20px;
|
|
178
|
-
}
|
|
179
|
-
}
|
|
180
160
|
`;
|
|
181
161
|
export default withErrorBoundary(withHideWhenEmbed(Header), {
|
|
182
162
|
FallbackComponent: ErrorFallback
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@blocklet/ui-react",
|
|
3
|
-
"version": "2.12.
|
|
3
|
+
"version": "2.12.4",
|
|
4
4
|
"description": "Some useful front-end web components that can be used in Blocklets.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"react",
|
|
@@ -33,8 +33,8 @@
|
|
|
33
33
|
},
|
|
34
34
|
"dependencies": {
|
|
35
35
|
"@abtnode/constant": "^1.16.39",
|
|
36
|
-
"@arcblock/bridge": "^2.12.
|
|
37
|
-
"@arcblock/react-hooks": "^2.12.
|
|
36
|
+
"@arcblock/bridge": "^2.12.4",
|
|
37
|
+
"@arcblock/react-hooks": "^2.12.4",
|
|
38
38
|
"@arcblock/ws": "^1.19.13",
|
|
39
39
|
"@blocklet/did-space-react": "^1.0.22",
|
|
40
40
|
"@iconify-icons/logos": "^1.2.36",
|
|
@@ -84,5 +84,5 @@
|
|
|
84
84
|
"jest": "^29.7.0",
|
|
85
85
|
"unbuild": "^2.0.0"
|
|
86
86
|
},
|
|
87
|
-
"gitHead": "
|
|
87
|
+
"gitHead": "f8648a2f55bb57212a24a5948a5f026e2c20b1a7"
|
|
88
88
|
}
|
package/src/Footer/index.jsx
CHANGED
|
@@ -1,13 +1,11 @@
|
|
|
1
1
|
import { useMemo } from 'react';
|
|
2
2
|
import PropTypes from 'prop-types';
|
|
3
|
-
import { useCreation } from 'ahooks';
|
|
4
3
|
import { styled } from '@arcblock/ux/lib/Theme';
|
|
5
4
|
import { withErrorBoundary } from 'react-error-boundary';
|
|
6
5
|
import { useLocaleContext } from '@arcblock/ux/lib/Locale/context';
|
|
7
6
|
import { ErrorFallback } from '@arcblock/ux/lib/ErrorBoundary';
|
|
8
7
|
import { temp as colors } from '@arcblock/ux/lib/Colors';
|
|
9
8
|
import omit from 'lodash/omit';
|
|
10
|
-
import isFinite from 'lodash/isFinite';
|
|
11
9
|
|
|
12
10
|
import OverridableThemeProvider from '../common/overridable-theme-provider';
|
|
13
11
|
import InternalFooter from './internal-footer';
|
|
@@ -30,37 +28,15 @@ function Footer({ meta, theme: themeOverrides, ...rest }) {
|
|
|
30
28
|
return blocklet;
|
|
31
29
|
}
|
|
32
30
|
}, [meta]);
|
|
33
|
-
const productsNav = useCreation(() => {
|
|
34
|
-
return {
|
|
35
|
-
title: { en: 'Products', zh: '产品' },
|
|
36
|
-
section: ['footer'],
|
|
37
|
-
items: [
|
|
38
|
-
{ title: 'ArcSphere', link: `https://www.arcblock.io/content/tags/${locale}/arcsphere`, isNew: true },
|
|
39
|
-
{ title: 'DID Wallet', link: `https://www.didwallet.io/${locale}` },
|
|
40
|
-
{ title: 'DID Spaces', link: `https://www.didspaces.com/${locale}` },
|
|
41
|
-
{ title: 'DID Name Service', link: `https://www.didnames.io/${locale}` },
|
|
42
|
-
{ title: 'Blocklet Launcher', link: `https://launcher.arcblock.io/${locale}` },
|
|
43
|
-
{ title: 'Blocklet Server', link: `https://www.arcblock.io/content/collections/${locale}/blocklet-server` },
|
|
44
|
-
{ title: 'AIGNE', link: `https://www.aigne.io/${locale}` },
|
|
45
|
-
],
|
|
46
|
-
};
|
|
47
|
-
}, [locale]);
|
|
48
31
|
|
|
49
32
|
if (!formattedBlocklet.appName) {
|
|
50
33
|
return null;
|
|
51
34
|
}
|
|
52
35
|
|
|
53
36
|
const { appLogo, appLogoRect, appName, appDescription, description, theme, copyright } = formattedBlocklet;
|
|
54
|
-
const navFooter = [...(formattedBlocklet?.navigation?.footer ?? [])];
|
|
55
|
-
|
|
56
|
-
// 显示 Products 导航
|
|
57
|
-
const productsNavOrder = parseInt(window.blocklet?.USE_ARCBLOCK_THEME, 10);
|
|
58
|
-
if (isFinite(productsNavOrder)) {
|
|
59
|
-
navFooter.splice(productsNavOrder, 0, productsNav);
|
|
60
|
-
}
|
|
61
37
|
|
|
62
38
|
const localized = {
|
|
63
|
-
footerNav: getLocalizedNavigation(
|
|
39
|
+
footerNav: getLocalizedNavigation(formattedBlocklet?.navigation?.footer, locale) || [],
|
|
64
40
|
socialMedia: getLocalizedNavigation(formattedBlocklet?.navigation?.social, locale) || [],
|
|
65
41
|
links: getLocalizedNavigation(formattedBlocklet?.navigation?.bottom, locale) || [],
|
|
66
42
|
};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { cloneElement } from 'react';
|
|
2
2
|
import PropTypes from 'prop-types';
|
|
3
|
-
import Container from '@mui/material
|
|
3
|
+
import { Container } from '@mui/material';
|
|
4
4
|
import { styled } from '@arcblock/ux/lib/Theme';
|
|
5
5
|
import Row from './row';
|
|
6
6
|
|
|
@@ -10,19 +10,21 @@ import Row from './row';
|
|
|
10
10
|
function PlainLayout({ elements, data, ...rest }) {
|
|
11
11
|
return (
|
|
12
12
|
<Root {...rest}>
|
|
13
|
-
<Container
|
|
14
|
-
{
|
|
15
|
-
|
|
16
|
-
{
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
13
|
+
<Container>
|
|
14
|
+
<Container className="plain-layout-container" style={{ padding: 0 }}>
|
|
15
|
+
{elements.links && (
|
|
16
|
+
<Row sx={{ width: 1 }} autoCenter>
|
|
17
|
+
{elements.copyright}
|
|
18
|
+
{elements.links}
|
|
19
|
+
</Row>
|
|
20
|
+
)}
|
|
21
|
+
{!elements.links && (
|
|
22
|
+
<>
|
|
23
|
+
{cloneElement(elements.brand, { name: null, description: null })}
|
|
24
|
+
{elements.copyright}
|
|
25
|
+
</>
|
|
26
|
+
)}
|
|
27
|
+
</Container>
|
|
26
28
|
</Container>
|
|
27
29
|
</Root>
|
|
28
30
|
);
|
|
@@ -1,8 +1,7 @@
|
|
|
1
1
|
import PropTypes from 'prop-types';
|
|
2
2
|
import clsx from 'clsx';
|
|
3
|
-
import Box from '@mui/material
|
|
3
|
+
import { Box, Container } from '@mui/material';
|
|
4
4
|
import { grey } from '@mui/material/colors';
|
|
5
|
-
import Container from '@mui/material/Container';
|
|
6
5
|
import { styled } from '@arcblock/ux/lib/Theme';
|
|
7
6
|
|
|
8
7
|
import Row from './row';
|
|
@@ -12,12 +11,15 @@ import Row from './row';
|
|
|
12
11
|
*/
|
|
13
12
|
function StandardLayout({ elements, data, className, ...rest }) {
|
|
14
13
|
const withNavigation = !!data.navigation?.length;
|
|
14
|
+
|
|
15
15
|
let topSection = null;
|
|
16
16
|
|
|
17
17
|
if (withNavigation) {
|
|
18
18
|
// 左 brand & social，右导航栏
|
|
19
19
|
topSection = (
|
|
20
|
-
<
|
|
20
|
+
<Container
|
|
21
|
+
sx={{ display: 'flex', flexDirection: { xs: 'column', md: 'row' }, justifyContent: 'space-between' }}
|
|
22
|
+
style={{ padding: 0 }}>
|
|
21
23
|
<Box
|
|
22
24
|
sx={{
|
|
23
25
|
flex: '1 1 auto',
|
|
@@ -32,12 +34,12 @@ function StandardLayout({ elements, data, className, ...rest }) {
|
|
|
32
34
|
<Box lineHeight={1}>{elements.socialMedia}</Box>
|
|
33
35
|
</Box>
|
|
34
36
|
<Box sx={{ mb: 3, borderTop: { xs: `1px solid ${grey[200]}`, md: 0 } }}>{elements.navigation}</Box>
|
|
35
|
-
</
|
|
37
|
+
</Container>
|
|
36
38
|
);
|
|
37
39
|
} else {
|
|
38
40
|
// 左 brand，右 social
|
|
39
41
|
topSection = (
|
|
40
|
-
<
|
|
42
|
+
<Container
|
|
41
43
|
sx={{
|
|
42
44
|
display: 'flex',
|
|
43
45
|
flexDirection: { xs: 'column', md: 'row' },
|
|
@@ -45,10 +47,11 @@ function StandardLayout({ elements, data, className, ...rest }) {
|
|
|
45
47
|
alignItems: { xs: 'center', md: 'space-between' },
|
|
46
48
|
gap: 2,
|
|
47
49
|
pb: 3,
|
|
48
|
-
}}
|
|
50
|
+
}}
|
|
51
|
+
style={{ padding: 0 }}>
|
|
49
52
|
<Box>{elements.brand}</Box>
|
|
50
53
|
<Box lineHeight={1}>{elements.socialMedia}</Box>
|
|
51
|
-
</
|
|
54
|
+
</Container>
|
|
52
55
|
);
|
|
53
56
|
}
|
|
54
57
|
|
|
@@ -56,10 +59,14 @@ function StandardLayout({ elements, data, className, ...rest }) {
|
|
|
56
59
|
<Root {...rest} className={clsx({ 'footer--with-navs': withNavigation }, className)}>
|
|
57
60
|
<Container>
|
|
58
61
|
{topSection}
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
62
|
+
{/* 分割线可以延伸 */}
|
|
63
|
+
<Box sx={{ pt: 3, borderTop: 1, borderColor: 'grey.200' }} />
|
|
64
|
+
<Container style={{ padding: 0 }}>
|
|
65
|
+
<Row autoCenter>
|
|
66
|
+
{elements.copyright}
|
|
67
|
+
{elements.links}
|
|
68
|
+
</Row>
|
|
69
|
+
</Container>
|
|
63
70
|
</Container>
|
|
64
71
|
</Root>
|
|
65
72
|
);
|
package/src/Footer/links.jsx
CHANGED
|
@@ -26,8 +26,14 @@ export default function Links({ links, flowLayout, columns, ...rest }) {
|
|
|
26
26
|
if (render) {
|
|
27
27
|
result = render({ label, link, props });
|
|
28
28
|
} else if (link) {
|
|
29
|
+
const isExternal = link.startsWith('http') || link.startsWith('//');
|
|
29
30
|
result = (
|
|
30
|
-
<a
|
|
31
|
+
<a
|
|
32
|
+
href={link}
|
|
33
|
+
aria-label={`Footer link for ${label}`}
|
|
34
|
+
target={isExternal ? '_blank' : '_self'}
|
|
35
|
+
rel={isExternal ? 'noreferrer noopener' : undefined}
|
|
36
|
+
{...props}>
|
|
31
37
|
{label}
|
|
32
38
|
</a>
|
|
33
39
|
);
|
package/src/Header/index.tsx
CHANGED
|
@@ -205,26 +205,6 @@ const StyledUxHeader = styled(ResponsiveHeader)<StyledUxHeaderProps>`
|
|
|
205
205
|
min-width: 32px;
|
|
206
206
|
}
|
|
207
207
|
}
|
|
208
|
-
.header-nav {
|
|
209
|
-
.navmenu-sub .navmenu-item {
|
|
210
|
-
min-width: 80px;
|
|
211
|
-
}
|
|
212
|
-
}
|
|
213
|
-
.header-nav.navmenu--horizontal {
|
|
214
|
-
.navmenu-root > .navmenu-sub,
|
|
215
|
-
.navmenu-root > .navmenu-item {
|
|
216
|
-
padding: 16px 4px;
|
|
217
|
-
|
|
218
|
-
.navmenu-sub-container {
|
|
219
|
-
padding-top: 0;
|
|
220
|
-
}
|
|
221
|
-
}
|
|
222
|
-
.navmenu-item-icon > .MuiAvatar-root,
|
|
223
|
-
.navmenu-sub-icon > .MuiAvatar-root {
|
|
224
|
-
width: 20px;
|
|
225
|
-
height: 20px;
|
|
226
|
-
}
|
|
227
|
-
}
|
|
228
208
|
`;
|
|
229
209
|
|
|
230
210
|
export default withErrorBoundary(withHideWhenEmbed(Header), {
|