@blocklet/launcher-layout 2.1.86 → 2.1.87
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/README.md +34 -4
- package/lib/header.js +86 -26
- package/lib/index.js +83 -63
- package/lib/nav.js +4 -16
- package/package.json +5 -4
package/README.md
CHANGED
|
@@ -16,13 +16,43 @@ import Layout from '@blocklet/launcher-layout';
|
|
|
16
16
|
### Layout
|
|
17
17
|
|
|
18
18
|
```jsx
|
|
19
|
-
|
|
19
|
+
return (
|
|
20
|
+
<LocaleProvider translations={[]}>
|
|
21
|
+
<StepProvider steps={steps}>
|
|
22
|
+
<Layout blockletMeta={blockletMeta} loading={false} navSubTitle="Restore">
|
|
23
|
+
This is page content
|
|
24
|
+
</Layout>
|
|
25
|
+
</StepProvider>
|
|
26
|
+
</LocaleProvider>
|
|
27
|
+
);
|
|
28
|
+
```
|
|
29
|
+
|
|
30
|
+
`Custom theme`
|
|
31
|
+
|
|
32
|
+
```jsx
|
|
33
|
+
const theme = create({
|
|
34
|
+
typography: {
|
|
35
|
+
fontSize: 14,
|
|
36
|
+
},
|
|
37
|
+
palette: {
|
|
38
|
+
primary: {
|
|
39
|
+
main: '#1dc1c7',
|
|
40
|
+
contrastText: '#fff',
|
|
41
|
+
},
|
|
42
|
+
secondary: {
|
|
43
|
+
main: '#1976d2',
|
|
44
|
+
contrastText: '#fff',
|
|
45
|
+
},
|
|
46
|
+
},
|
|
47
|
+
});
|
|
20
48
|
|
|
21
|
-
return
|
|
49
|
+
return (
|
|
22
50
|
<LocaleProvider translations={[]}>
|
|
23
51
|
<StepProvider steps={steps}>
|
|
24
|
-
<Layout blockletMeta={blockletMeta} loading={false} navSubTitle="
|
|
52
|
+
<Layout blockletMeta={blockletMeta} loading={false} navSubTitle="Launching" theme={theme}>
|
|
53
|
+
This is page content
|
|
54
|
+
</Layout>
|
|
25
55
|
</StepProvider>
|
|
26
56
|
</LocaleProvider>
|
|
27
|
-
|
|
57
|
+
);
|
|
28
58
|
```
|
package/lib/header.js
CHANGED
|
@@ -4,21 +4,24 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
|
-
var
|
|
8
|
-
var
|
|
7
|
+
var _Img = _interopRequireDefault(require("@arcblock/ux/lib/Img"));
|
|
8
|
+
var _launcherUtil = require("@blocklet/launcher-util");
|
|
9
9
|
var _styled = _interopRequireDefault(require("@emotion/styled"));
|
|
10
|
-
var _useMediaQuery = _interopRequireDefault(require("@mui/material/useMediaQuery"));
|
|
11
10
|
var _Skeleton = _interopRequireDefault(require("@mui/material/Skeleton"));
|
|
12
|
-
var
|
|
11
|
+
var _useMediaQuery = _interopRequireDefault(require("@mui/material/useMediaQuery"));
|
|
12
|
+
var _isEmpty = _interopRequireDefault(require("is-empty"));
|
|
13
|
+
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
14
|
+
var _react = require("react");
|
|
15
|
+
var _urlJoin = _interopRequireDefault(require("url-join"));
|
|
13
16
|
var _blockletDefaultLogo = _interopRequireDefault(require("./assets/blocklet-default-logo.png"));
|
|
14
17
|
var _locale = require("./locale");
|
|
15
18
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
16
|
-
var _templateObject;
|
|
19
|
+
var _templateObject, _templateObject2, _templateObject3;
|
|
17
20
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
18
21
|
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
19
22
|
function AppHeader(_ref) {
|
|
20
23
|
let {
|
|
21
|
-
|
|
24
|
+
blockletMeta,
|
|
22
25
|
subTitle,
|
|
23
26
|
logoUrl,
|
|
24
27
|
locale,
|
|
@@ -29,14 +32,6 @@ function AppHeader(_ref) {
|
|
|
29
32
|
const blockletSize = isMobile ? 18 : 48;
|
|
30
33
|
const appNameRef = (0, _react.useRef)(null);
|
|
31
34
|
const [appNameSize, setAppNameSize] = (0, _react.useState)('');
|
|
32
|
-
const appIcon = loading ? /*#__PURE__*/(0, _jsxRuntime.jsx)(AppIconSkeleton, {
|
|
33
|
-
blockletSize: blockletSize,
|
|
34
|
-
isMobile: isMobile,
|
|
35
|
-
title: title
|
|
36
|
-
}) : /*#__PURE__*/(0, _jsxRuntime.jsx)(AppIcon, {
|
|
37
|
-
blockletSize: blockletSize,
|
|
38
|
-
logoUrl: logoUrl
|
|
39
|
-
});
|
|
40
35
|
(0, _react.useEffect)(() => {
|
|
41
36
|
if (appNameRef.current && appNameRef.current.offsetHeight > 34) {
|
|
42
37
|
if (appNameSize === '') {
|
|
@@ -45,15 +40,21 @@ function AppHeader(_ref) {
|
|
|
45
40
|
setAppNameSize('small');
|
|
46
41
|
}
|
|
47
42
|
}
|
|
48
|
-
}, [appNameSize
|
|
43
|
+
}, [appNameSize]);
|
|
49
44
|
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(Container, {
|
|
50
45
|
className: appNameSize === 'small' ? 'center-mode' : '',
|
|
51
46
|
children: [isMobile ? /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
52
47
|
className: "app-icon",
|
|
53
48
|
children: navLogo
|
|
54
|
-
}) : /*#__PURE__*/(0, _jsxRuntime.
|
|
49
|
+
}) : /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
|
55
50
|
className: "app-icon",
|
|
56
|
-
children:
|
|
51
|
+
children: [loading && /*#__PURE__*/(0, _jsxRuntime.jsx)(AppIconSkeleton, {
|
|
52
|
+
blockletSize: blockletSize,
|
|
53
|
+
isMobile: isMobile
|
|
54
|
+
}), !loading && /*#__PURE__*/(0, _jsxRuntime.jsx)(AppIcon, {
|
|
55
|
+
blockletSize: blockletSize,
|
|
56
|
+
logoUrl: logoUrl
|
|
57
|
+
})]
|
|
57
58
|
}), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
|
58
59
|
className: "header-title",
|
|
59
60
|
children: [isMobile && subTitle && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
@@ -64,17 +65,23 @@ function AppHeader(_ref) {
|
|
|
64
65
|
children: [!isMobile && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
65
66
|
className: "launching-context",
|
|
66
67
|
children: subTitle || (0, _locale.getLaunchingText)(locale)
|
|
67
|
-
}),
|
|
68
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
68
69
|
className: "header-title-name ".concat(appNameSize === 'middle' || appNameSize === 'small' ? 'middle-size' : ''),
|
|
69
70
|
ref: appNameRef,
|
|
70
|
-
children:
|
|
71
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(AppTitle, {
|
|
72
|
+
logoUrl: logoUrl,
|
|
73
|
+
isMobile: isMobile,
|
|
74
|
+
blockletMeta: blockletMeta,
|
|
75
|
+
blockletSize: blockletSize,
|
|
76
|
+
loading: loading
|
|
77
|
+
})
|
|
71
78
|
})]
|
|
72
79
|
})]
|
|
73
80
|
})]
|
|
74
81
|
});
|
|
75
82
|
}
|
|
76
83
|
AppHeader.propTypes = {
|
|
77
|
-
|
|
84
|
+
blockletMeta: _propTypes.default.object,
|
|
78
85
|
subTitle: _propTypes.default.any,
|
|
79
86
|
logoUrl: _propTypes.default.string,
|
|
80
87
|
locale: _propTypes.default.string,
|
|
@@ -82,27 +89,26 @@ AppHeader.propTypes = {
|
|
|
82
89
|
loading: _propTypes.default.bool
|
|
83
90
|
};
|
|
84
91
|
AppHeader.defaultProps = {
|
|
85
|
-
title: '',
|
|
86
92
|
subTitle: '',
|
|
87
93
|
logoUrl: '',
|
|
88
94
|
locale: '',
|
|
89
95
|
navLogo: '',
|
|
90
|
-
loading: false
|
|
96
|
+
loading: false,
|
|
97
|
+
blockletMeta: {}
|
|
91
98
|
};
|
|
92
99
|
|
|
93
100
|
// eslint-disable-next-line react/prop-types
|
|
94
101
|
function AppIconSkeleton(_ref2) {
|
|
95
102
|
let {
|
|
96
103
|
blockletSize,
|
|
97
|
-
isMobile
|
|
98
|
-
title
|
|
104
|
+
isMobile
|
|
99
105
|
} = _ref2;
|
|
100
106
|
if (isMobile) {
|
|
101
107
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Skeleton.default, {
|
|
102
108
|
variant: "rectangular",
|
|
103
109
|
width: 100,
|
|
104
110
|
height: 16,
|
|
105
|
-
alt: "
|
|
111
|
+
alt: "icon",
|
|
106
112
|
style: {
|
|
107
113
|
marginTop: 4
|
|
108
114
|
}
|
|
@@ -132,6 +138,60 @@ function AppIcon(_ref3) {
|
|
|
132
138
|
}
|
|
133
139
|
});
|
|
134
140
|
}
|
|
141
|
+
|
|
142
|
+
// eslint-disable-next-line react/prop-types
|
|
143
|
+
function AppTitle(_ref4) {
|
|
144
|
+
let {
|
|
145
|
+
isMobile,
|
|
146
|
+
logoUrl,
|
|
147
|
+
blockletMeta,
|
|
148
|
+
blockletSize,
|
|
149
|
+
loading
|
|
150
|
+
} = _ref4;
|
|
151
|
+
const name = (0, _launcherUtil.getBlockletDisplayName)(blockletMeta);
|
|
152
|
+
if (loading) {
|
|
153
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(AppIconSkeleton, {
|
|
154
|
+
blockletSize: blockletSize
|
|
155
|
+
});
|
|
156
|
+
}
|
|
157
|
+
if ((0, _isEmpty.default)(blockletMeta)) {
|
|
158
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Skeleton.default, {
|
|
159
|
+
variant: "rectangular",
|
|
160
|
+
animation: false,
|
|
161
|
+
width: 100,
|
|
162
|
+
height: 16,
|
|
163
|
+
alt: "icon",
|
|
164
|
+
style: {
|
|
165
|
+
marginTop: 4
|
|
166
|
+
}
|
|
167
|
+
});
|
|
168
|
+
}
|
|
169
|
+
if (isMobile) {
|
|
170
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(MobileTitleStyle, {
|
|
171
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(AppIcon, {
|
|
172
|
+
blockletSize: blockletSize,
|
|
173
|
+
logoUrl: logoUrl
|
|
174
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
|
|
175
|
+
className: "ellipsis-title",
|
|
176
|
+
children: (0, _launcherUtil.getBlockletDisplayName)(blockletMeta)
|
|
177
|
+
})]
|
|
178
|
+
});
|
|
179
|
+
}
|
|
180
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(AppLink, {
|
|
181
|
+
target: "_blank",
|
|
182
|
+
href: (0, _urlJoin.default)((blockletMeta === null || blockletMeta === void 0 ? void 0 : blockletMeta.registryUrl) || '', "/blocklets/".concat(blockletMeta === null || blockletMeta === void 0 ? void 0 : blockletMeta.did)),
|
|
183
|
+
title: name,
|
|
184
|
+
children: name
|
|
185
|
+
});
|
|
186
|
+
}
|
|
187
|
+
const MobileTitleStyle = _styled.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n .ellipsis-title {\n flex: 1;\n position: absolute;\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n\n ", " {\n left: 26px;\n width: calc(100% - 26px);\n }\n }\n"])), props => props.theme.breakpoints.down('md'));
|
|
188
|
+
AppTitle.propTypes = {
|
|
189
|
+
blockletMeta: _propTypes.default.object
|
|
190
|
+
};
|
|
191
|
+
AppTitle.defaultProps = {
|
|
192
|
+
blockletMeta: {}
|
|
193
|
+
};
|
|
135
194
|
var _default = AppHeader;
|
|
136
195
|
exports.default = _default;
|
|
137
|
-
const
|
|
196
|
+
const AppLink = _styled.default.a(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n color: ", ";\n text-decoration: none;\n overflow: hidden;\n text-overflow: ellipsis;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n font-family: Lato, Avenir, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif,\n 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';\n text-decoration: none;\n font-weight: 700;\n -webkit-font-smoothing: antialiased;\n\n ", " {\n display: block;\n max-width: calc(100vw - 150px);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n"])), props => props.theme.palette.common.black, props => props.theme.breakpoints.down('md'));
|
|
197
|
+
const Container = _styled.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n display: flex;\n justify-content: flex-start;\n align-items: flex-start;\n width: 100%;\n ", " {\n min-height: 70px;\n }\n ", " {\n align-items: center;\n }\n .app-name-content {\n width: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n ", " {\n align-items: flex-start;\n flex-direction: column;\n }\n ", " {\n height: 22px;\n }\n }\n .launching-context {\n flex-shrink: 0;\n font-size: 14px;\n font-weight: 600;\n color: ", ";\n ", " {\n margin-bottom: 4px;\n }\n ", " {\n font-size: 14px;\n line-height: 15px;\n &:after {\n display: inline-block;\n margin: 0 4px;\n content: ':';\n }\n }\n }\n\n &.center-mode {\n align-items: flex-start;\n .launching-context {\n ", " {\n margin-bottom: 0;\n }\n }\n }\n\n .app-icon {\n flex-shrink: 0;\n > * {\n display: block;\n vertical-align: middle;\n }\n }\n\n .header-title {\n flex: 1;\n display: flex;\n flex-direction: column;\n justify-content: space-around;\n align-items: flex-start;\n margin-left: 24px;\n ", " {\n margin-left: 16px;\n }\n .header-title-name {\n position: relative;\n display: flex;\n justify-content: center;\n align-items: center;\n flex: 1;\n height: 100%;\n color: ", ";\n font-weight: 700;\n ", " {\n font-size: 18px;\n\n &.middle-size {\n font-size: 16px;\n }\n }\n ", " {\n display: block;\n max-width: calc(100vw - 100px);\n font-size: 16px;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n }\n\n .header-title-sub {\n color: ", ";\n font-size: 12px;\n line-height: 16px;\n\n ", " {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n }\n }\n"])), props => props.theme.breakpoints.up('md'), props => props.theme.breakpoints.down('md'), props => props.theme.breakpoints.up('md'), props => props.theme.breakpoints.down('md'), props => props.theme.palette.grey[500], props => props.theme.breakpoints.up('md'), props => props.theme.breakpoints.down('md'), props => props.theme.breakpoints.up('sm'), props => props.theme.breakpoints.down('md'), props => props.theme.palette.common.black, props => props.theme.breakpoints.up('sm'), props => props.theme.breakpoints.down('md'), props => props.theme.palette.grey[700], props => props.theme.breakpoints.down('md'));
|
package/lib/index.js
CHANGED
|
@@ -5,11 +5,12 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
7
|
var _Center = _interopRequireDefault(require("@arcblock/ux/lib/Center"));
|
|
8
|
-
var
|
|
9
|
-
var _launcherUtil = require("@blocklet/launcher-util");
|
|
8
|
+
var _Theme = require("@arcblock/ux/lib/Theme");
|
|
10
9
|
var _smallCircleProgress = _interopRequireDefault(require("@blocklet/launcher-ux/lib/small-circle-progress"));
|
|
11
10
|
var _styled = _interopRequireDefault(require("@emotion/styled"));
|
|
11
|
+
var _CircularProgress = _interopRequireDefault(require("@mui/material/CircularProgress"));
|
|
12
12
|
var _Hidden = _interopRequireDefault(require("@mui/material/Hidden"));
|
|
13
|
+
var _styles = require("@mui/material/styles");
|
|
13
14
|
var _useMediaQuery = _interopRequireDefault(require("@mui/material/useMediaQuery"));
|
|
14
15
|
var _isObject = _interopRequireDefault(require("lodash/isObject"));
|
|
15
16
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
@@ -19,7 +20,7 @@ var _header = _interopRequireDefault(require("./header"));
|
|
|
19
20
|
var _locale = require("./locale");
|
|
20
21
|
var _nav = _interopRequireDefault(require("./nav"));
|
|
21
22
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
22
|
-
const _excluded = ["blockletMeta", "loading", "children", "logoUrl", "locale", "header", "headerEndAddons", "pcWidth", "pcHeight", "navLogo", "useOfSkeleton", "stepTip", "navSubTitle", "contentMaxWidth"];
|
|
23
|
+
const _excluded = ["blockletMeta", "loading", "children", "logoUrl", "locale", "header", "headerEndAddons", "pcWidth", "pcHeight", "navLogo", "useOfSkeleton", "stepTip", "navSubTitle", "contentMaxWidth", "theme"];
|
|
23
24
|
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
|
|
24
25
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
25
26
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
@@ -33,6 +34,21 @@ function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(
|
|
|
33
34
|
const HEADER_HEIGHT_MD = '72px';
|
|
34
35
|
const MobileContent = _styled.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n box-sizing: border-box;\n display: flex;\n overflow: hidden;\n width: 100%;\n height: 100%;\n padding-top: ", ";\n"])), HEADER_HEIGHT_MD);
|
|
35
36
|
const PcContent = _styled.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n display: flex;\n min-width: 900px;\n max-width: ", ";\n max-height: 880px;\n border-radius: 8px;\n background-color: #fff;\n width: ", ";\n height: ", ";\n\n @media (max-height: 900px) {\n margin-top: ", ";\n width: 100%;\n height: 100%;\n }\n"])), props => props.contentMaxWidth, props => props.width || '80%', props => props.height || '80%', HEADER_HEIGHT_MD);
|
|
37
|
+
const theme = (0, _Theme.create)({
|
|
38
|
+
typography: {
|
|
39
|
+
fontSize: 14
|
|
40
|
+
},
|
|
41
|
+
palette: {
|
|
42
|
+
primary: {
|
|
43
|
+
main: '#1dc1c7',
|
|
44
|
+
contrastText: '#fff'
|
|
45
|
+
},
|
|
46
|
+
secondary: {
|
|
47
|
+
main: '#1976d2',
|
|
48
|
+
contrastText: '#fff'
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
});
|
|
36
52
|
function Layout(_ref) {
|
|
37
53
|
let {
|
|
38
54
|
blockletMeta,
|
|
@@ -48,10 +64,11 @@ function Layout(_ref) {
|
|
|
48
64
|
useOfSkeleton,
|
|
49
65
|
stepTip,
|
|
50
66
|
navSubTitle,
|
|
51
|
-
contentMaxWidth
|
|
67
|
+
contentMaxWidth,
|
|
68
|
+
theme: userTheme
|
|
52
69
|
} = _ref,
|
|
53
70
|
rest = _objectWithoutProperties(_ref, _excluded);
|
|
54
|
-
const isMobile = (0, _useMediaQuery.default)(
|
|
71
|
+
const isMobile = (0, _useMediaQuery.default)(t => t.breakpoints.down('md'));
|
|
55
72
|
const {
|
|
56
73
|
activeStep,
|
|
57
74
|
totalStepsCount
|
|
@@ -69,65 +86,66 @@ function Layout(_ref) {
|
|
|
69
86
|
});
|
|
70
87
|
}
|
|
71
88
|
}
|
|
72
|
-
return /*#__PURE__*/(0, _jsxRuntime.
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
}
|
|
91
|
-
})
|
|
92
|
-
|
|
89
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.ThemeProvider, {
|
|
90
|
+
theme: Object.assign(theme, userTheme || {}),
|
|
91
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(Root, _objectSpread(_objectSpread({}, rest), {}, {
|
|
92
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(Header, {
|
|
93
|
+
maxWidth: contentMaxWidth,
|
|
94
|
+
width: pcWidth,
|
|
95
|
+
children: [header && header, !header && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
|
|
96
|
+
children: [isMobile && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
97
|
+
className: "left",
|
|
98
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_header.default, {
|
|
99
|
+
blockletMeta: blockletMeta,
|
|
100
|
+
navLogo: navLogo,
|
|
101
|
+
subTitle: /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
|
|
102
|
+
children: ["".concat(navSubTitle || translations.defaultNavSubTitle, " ").concat(activeStep + 1, "/").concat(totalStepsCount), /*#__PURE__*/(0, _jsxRuntime.jsx)(_smallCircleProgress.default, {
|
|
103
|
+
value: (activeStep + 1) / totalStepsCount * 100,
|
|
104
|
+
style: {
|
|
105
|
+
marginLeft: 3
|
|
106
|
+
}
|
|
107
|
+
})]
|
|
108
|
+
}),
|
|
109
|
+
logoUrl: logoUrl,
|
|
110
|
+
locale: locale,
|
|
111
|
+
loading: loading
|
|
112
|
+
})
|
|
113
|
+
}), navLogo && !isMobile && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
114
|
+
className: "left",
|
|
115
|
+
children: navLogo
|
|
116
|
+
}), headerEndAddons && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
117
|
+
className: "right",
|
|
118
|
+
children: headerEndAddons
|
|
119
|
+
})]
|
|
120
|
+
})]
|
|
121
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsxs)(Container, {
|
|
122
|
+
contentMaxWidth: contentMaxWidth,
|
|
123
|
+
width: pcWidth,
|
|
124
|
+
height: pcHeight,
|
|
125
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Hidden.default, {
|
|
126
|
+
mdDown: true,
|
|
127
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_nav.default, {
|
|
128
|
+
locale: locale,
|
|
129
|
+
blockletMeta: blockletMeta,
|
|
93
130
|
logoUrl: logoUrl,
|
|
94
|
-
|
|
131
|
+
useOfSkeleton: useOfSkeleton,
|
|
132
|
+
subTitle: navSubTitle,
|
|
133
|
+
loading: loading
|
|
95
134
|
})
|
|
96
|
-
}),
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
135
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_react.Suspense, {
|
|
136
|
+
fallback: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Center.default, {
|
|
137
|
+
relative: "parent",
|
|
138
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_CircularProgress.default, {
|
|
139
|
+
style: {
|
|
140
|
+
marginTop: 36
|
|
141
|
+
}
|
|
142
|
+
})
|
|
143
|
+
}),
|
|
144
|
+
children: children
|
|
102
145
|
})]
|
|
103
146
|
})]
|
|
104
|
-
})
|
|
105
|
-
|
|
106
|
-
width: pcWidth,
|
|
107
|
-
height: pcHeight,
|
|
108
|
-
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Hidden.default, {
|
|
109
|
-
mdDown: true,
|
|
110
|
-
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_nav.default, {
|
|
111
|
-
locale: locale,
|
|
112
|
-
blockletMeta: blockletMeta,
|
|
113
|
-
logoUrl: logoUrl,
|
|
114
|
-
useOfSkeleton: useOfSkeleton,
|
|
115
|
-
subTitle: navSubTitle,
|
|
116
|
-
loading: loading
|
|
117
|
-
})
|
|
118
|
-
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_react.Suspense, {
|
|
119
|
-
fallback: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Center.default, {
|
|
120
|
-
relative: "parent",
|
|
121
|
-
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_CircularProgress.default, {
|
|
122
|
-
style: {
|
|
123
|
-
marginTop: 36
|
|
124
|
-
}
|
|
125
|
-
})
|
|
126
|
-
}),
|
|
127
|
-
children: children
|
|
128
|
-
})]
|
|
129
|
-
})]
|
|
130
|
-
}));
|
|
147
|
+
}))
|
|
148
|
+
});
|
|
131
149
|
}
|
|
132
150
|
Layout.propTypes = {
|
|
133
151
|
loading: _propTypes.default.bool,
|
|
@@ -143,7 +161,8 @@ Layout.propTypes = {
|
|
|
143
161
|
navLogo: _propTypes.default.oneOfType([_propTypes.default.node, _propTypes.default.object]),
|
|
144
162
|
useOfSkeleton: _propTypes.default.bool,
|
|
145
163
|
stepTip: _propTypes.default.string,
|
|
146
|
-
navSubTitle: _propTypes.default.string
|
|
164
|
+
navSubTitle: _propTypes.default.string,
|
|
165
|
+
theme: _propTypes.default.object
|
|
147
166
|
};
|
|
148
167
|
Layout.defaultProps = {
|
|
149
168
|
loading: false,
|
|
@@ -158,7 +177,8 @@ Layout.defaultProps = {
|
|
|
158
177
|
navLogo: '',
|
|
159
178
|
useOfSkeleton: true,
|
|
160
179
|
stepTip: '',
|
|
161
|
-
navSubTitle: ''
|
|
180
|
+
navSubTitle: '',
|
|
181
|
+
theme: null
|
|
162
182
|
};
|
|
163
183
|
|
|
164
184
|
// 针对 safari 下的 chrome 适配
|
|
@@ -167,7 +187,7 @@ let injectStyle = '';
|
|
|
167
187
|
if (ua.includes('iphone os') && ua.includes('crios')) {
|
|
168
188
|
injectStyle = 'height: calc(100vh - 60px);';
|
|
169
189
|
}
|
|
170
|
-
const Header = _styled.default.header(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n width: ", ";\n min-width: 900px;\n box-sizing: border-box;\n position: absolute;\n z-index: 200;\n top: 0;\n display: flex;\n max-width: ", ";\n height: 68px;\n align-items: center;\n\n @media (max-height: 900px) {\n width: 100%;\n }\n\n ", " and (min-height: 900px) {\n justify-content: flex-end;\n }\n\n ", " {\n min-width: 360px;\n width: 100%;\n height: ", ";\n padding: 14px 16px;\n justify-content: space-between;\n background: #f6f8fa;\n }\n\n .left {\n flex: 1;\n display: flex;\n align-items: center;\n }\n\n .right {\n display: flex;\n align-items: center;\n ", " {\n button,\n a {\n padding-left: 8px;\n padding-right: 8px;\n }\n }\n }\n
|
|
190
|
+
const Header = _styled.default.header(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n width: ", ";\n min-width: 900px;\n box-sizing: border-box;\n position: absolute;\n z-index: 200;\n top: 0;\n display: flex;\n max-width: ", ";\n height: 68px;\n align-items: center;\n\n @media (max-height: 900px) {\n width: 100%;\n }\n\n ", " and (min-height: 900px) {\n justify-content: flex-end;\n }\n\n ", " {\n min-width: 360px;\n width: 100%;\n height: ", ";\n padding: 14px 16px;\n justify-content: space-between;\n background: #f6f8fa;\n }\n\n .left {\n flex: 1;\n display: flex;\n align-items: center;\n }\n\n .right {\n display: flex;\n align-items: center;\n ", " {\n button,\n a {\n padding-left: 8px;\n padding-right: 8px;\n }\n }\n }\n"])), props => props.width || '80%', props => props.maxWidth, props => props.theme.breakpoints.up('sm'), props => props.theme.breakpoints.down('md'), HEADER_HEIGHT_MD, props => props.theme.breakpoints.down('md'));
|
|
171
191
|
const Root = _styled.default.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n letter-spacing: normal;\n ", "\n\n .circular {\n display: inline-block;\n position: relative;\n width: 15px;\n height: 12px;\n > * {\n position: absolute;\n left: 3px;\n top: 2px;\n width: 100%;\n height: 100%;\n }\n }\n\n ", " {\n background: #f6f8fa;\n }\n\n ", " {\n background: ", ";\n }\n"])), injectStyle, props => props.theme.breakpoints.up('sm'), props => props.theme.breakpoints.down('md'), props => props.theme.palette.common.white);
|
|
172
192
|
const LogoContainer = _styled.default.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n display: block;\n margin-top: 4px;\n"])));
|
|
173
193
|
var _default = Layout;
|
package/lib/nav.js
CHANGED
|
@@ -4,16 +4,14 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
|
-
var _util = require("@blocklet/launcher-util/lib/util");
|
|
8
7
|
var _styled = _interopRequireDefault(require("@emotion/styled"));
|
|
9
8
|
var _Check = _interopRequireDefault(require("@mui/icons-material/Check"));
|
|
10
9
|
var _Skeleton = _interopRequireDefault(require("@mui/material/Skeleton"));
|
|
11
10
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
12
|
-
var _urlJoin = _interopRequireDefault(require("url-join"));
|
|
13
11
|
var _step = require("./context/step");
|
|
14
12
|
var _header = _interopRequireDefault(require("./header"));
|
|
15
13
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
16
|
-
var _templateObject, _templateObject2
|
|
14
|
+
var _templateObject, _templateObject2;
|
|
17
15
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
18
16
|
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
19
17
|
function Nav(_ref) {
|
|
@@ -33,7 +31,6 @@ function Nav(_ref) {
|
|
|
33
31
|
getStepStatus,
|
|
34
32
|
canBackToStep
|
|
35
33
|
} = (0, _step.useStepContext)();
|
|
36
|
-
const name = (0, _util.getBlockletDisplayName)(blockletMeta);
|
|
37
34
|
const showSkeleton = useOfSkeleton ? loading : false;
|
|
38
35
|
const getNodeClassName = (step, index) => {
|
|
39
36
|
const classNameList = ['step-block'];
|
|
@@ -72,16 +69,8 @@ function Nav(_ref) {
|
|
|
72
69
|
};
|
|
73
70
|
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(Div, {
|
|
74
71
|
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_header.default, {
|
|
72
|
+
blockletMeta: blockletMeta,
|
|
75
73
|
loading: loading,
|
|
76
|
-
title: /*#__PURE__*/(0, _jsxRuntime.jsxs)(AppLink, {
|
|
77
|
-
target: "_blank",
|
|
78
|
-
href: (0, _urlJoin.default)(blockletMeta.registryUrl || '', "/blocklets/".concat(blockletMeta.did)),
|
|
79
|
-
title: name,
|
|
80
|
-
children: [loading && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Skeleton.default, {
|
|
81
|
-
variant: "text",
|
|
82
|
-
width: 150
|
|
83
|
-
}), !loading && name]
|
|
84
|
-
}),
|
|
85
74
|
logoUrl: logoUrl,
|
|
86
75
|
locale: locale,
|
|
87
76
|
subTitle: subTitle
|
|
@@ -148,9 +137,8 @@ function Nav(_ref) {
|
|
|
148
137
|
})]
|
|
149
138
|
});
|
|
150
139
|
}
|
|
151
|
-
const
|
|
152
|
-
const
|
|
153
|
-
const StepContainer = _styled.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n margin-top: 60px;\n\n @media (max-height: 900px) {\n margin-top: 32px;\n }\n\n ", " {\n margin-top: 30px;\n }\n .step-clickable {\n cursor: pointer;\n &:hover {\n color: ", ";\n }\n }\n .step-line {\n display: block;\n position: absolute;\n z-index: 1;\n left: 11px;\n top: 12px;\n width: 2px;\n height: 100%;\n opacity: 0.5;\n background-color: ", ";\n transition: all ease 0.2s;\n }\n .step-icon {\n position: relative;\n z-index: 2;\n display: flex;\n flex-shrink: 0;\n justify-content: center;\n align-items: center;\n width: 24px;\n height: 24px;\n border-radius: 13px;\n background-color: ", ";\n color: ", ";\n transition: all ease 0.3s;\n &:before {\n position: absolute;\n left: 4px;\n top: 4px;\n z-index: 3;\n display: block;\n background-color: ", ";\n width: 16px;\n height: 16px;\n border-radius: 10px;\n content: '';\n transform: scale(0);\n transition: all ease 0.3s;\n }\n & > * {\n transform: scale(0);\n transition: all ease 0.2s;\n }\n }\n .step-content {\n position: relative;\n flex: 1;\n padding-top: 1px;\n margin-left: 22px;\n font-size: 16px;\n color: ", ";\n white-space: nowrap;\n }\n .step-desc {\n margin-top: 24px;\n font-size: 12px;\n font-weight: 500;\n height: 17px;\n color: ", ";\n transition: all ease 0.3s;\n overflow: hidden;\n }\n ", " {\n .step-content-name {\n position: absolute;\n left: 0;\n top: 0;\n width: 100%;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n }\n &.hide-child-step-desc {\n .step-desc {\n margin: 0;\n opacity: 0;\n height: 0;\n }\n }\n .step-block {\n position: relative;\n display: flex;\n min-height: 70px;\n opacity: 0.5;\n overflow: hidden;\n transition: all ease 0.2s;\n &:last-child {\n height: auto;\n min-height: auto;\n }\n &.step-optional {\n height: 0;\n opacity: 0;\n min-height: 0px;\n }\n\n &.step-checked,\n &.step-active {\n .step-desc {\n margin: 0;\n opacity: 0;\n height: 0;\n }\n }\n\n &.step-checked {\n opacity: 1;\n .step-icon {\n color: ", ";\n background-color: ", ";\n & > * {\n transform: scale(1);\n }\n }\n\n .step-line {\n background-color: ", ";\n opacity: 1;\n }\n }\n\n &.step-active {\n opacity: 1;\n .step-icon {\n background-color: ", ";\n }\n .step-icon:before {\n transform: scale(1);\n }\n .step-content {\n color: ", ";\n }\n }\n\n &:last-child {\n .step-line {\n display: none;\n }\n\n .step-child-block {\n &:last-child {\n padding-bottom: 0;\n }\n }\n }\n\n &.hide-step-child {\n .step-children {\n .step-child-block {\n margin-top: 0;\n height: 0;\n opacity: 0;\n &:last-child {\n padding-bottom: 0;\n }\n }\n }\n }\n }\n .step-children {\n padding-top: 20px;\n .step-child-block {\n margin-top: 4px;\n height: 24px;\n line-height: 24px;\n font-size: 14px;\n color: #9397a1;\n transition: all ease 0.3s;\n &:first-of-type {\n margin-top: 8px;\n }\n &:last-child {\n padding-bottom: 40px;\n }\n &.step-child-block-active {\n color: ", ";\n font-weight: 700;\n }\n &.step-child-block-checked {\n color: ", ";\n }\n }\n }\n\n .step-active {\n .step-child-block {\n animation: stepChildAnime ease 0.3s;\n }\n }\n\n @keyframes stepChildAnime {\n 0% {\n height: 0;\n }\n 100% {\n height: 24px;\n }\n }\n"])), props => props.theme.breakpoints.down('md'), props => props.theme.palette.primary.main, props => props.theme.palette.grey[400], props => props.theme.palette.grey[400], props => props.theme.palette.common.white, props => props.theme.palette.common.white, props => props.theme.palette.grey[700], props => props.theme.palette.grey[700], props => props.theme.breakpoints.up('md'), props => props.theme.palette.common.white, props => props.theme.palette.primary.main, props => props.theme.palette.primary.main, props => props.theme.palette.primary.main, props => props.theme.palette.primary.main, props => props.theme.palette.common.black, props => props.theme.palette.common.black);
|
|
140
|
+
const Div = _styled.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n overflow-y: auto;\n ", " {\n padding: 24px;\n border-right: 1px solid ", ";\n flex: 0 0 280px;\n min-height: 48px;\n\n .MuiStepConnector-vertical {\n padding: 0;\n }\n }\n\n ", " {\n padding: 16px;\n\n .MuiStepConnector-lineVertical {\n border: none;\n }\n }\n\n .stepper {\n padding: 0 !important;\n background: transparent;\n\n ", " {\n margin-top: 100px;\n }\n\n ", " {\n margin-top: 40px;\n }\n\n .step {\n cursor: pointer;\n }\n }\n\n .always-step-child {\n .step-child-block {\n animation: none !important;\n }\n }\n"])), props => props.theme.breakpoints.up('md'), props => props.theme.palette.grey[100], props => props.theme.breakpoints.down('md'), props => props.theme.breakpoints.up('sm'), props => props.theme.breakpoints.down('md'));
|
|
141
|
+
const StepContainer = _styled.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n margin-top: 60px;\n\n @media (max-height: 900px) {\n margin-top: 32px;\n }\n\n ", " {\n margin-top: 30px;\n }\n .step-clickable {\n cursor: pointer;\n &:hover {\n color: ", ";\n }\n }\n .step-line {\n display: block;\n position: absolute;\n z-index: 1;\n left: 11px;\n top: 12px;\n width: 2px;\n height: 100%;\n opacity: 0.5;\n background-color: ", ";\n transition: all ease 0.2s;\n }\n .step-icon {\n position: relative;\n z-index: 2;\n display: flex;\n flex-shrink: 0;\n justify-content: center;\n align-items: center;\n width: 24px;\n height: 24px;\n border-radius: 13px;\n background-color: ", ";\n color: ", ";\n transition: all ease 0.3s;\n &:before {\n position: absolute;\n left: 4px;\n top: 4px;\n z-index: 3;\n display: block;\n background-color: ", ";\n width: 16px;\n height: 16px;\n border-radius: 10px;\n content: '';\n transform: scale(0);\n transition: all ease 0.3s;\n }\n & > * {\n transform: scale(0);\n transition: all ease 0.2s;\n }\n }\n .step-content {\n position: relative;\n flex: 1;\n padding-top: 1px;\n margin-left: 22px;\n font-size: 16px;\n color: ", ";\n white-space: nowrap;\n }\n .step-desc {\n margin-top: 24px;\n font-size: 12px;\n font-weight: 500;\n height: 17px;\n color: ", ";\n transition: all ease 0.3s;\n overflow: hidden;\n }\n ", " {\n .step-content-name {\n position: absolute;\n left: 0;\n top: 0;\n width: 100%;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n }\n &.hide-child-step-desc {\n .step-desc {\n margin: 0;\n opacity: 0;\n height: 0;\n }\n }\n .step-block {\n position: relative;\n display: flex;\n min-height: 70px;\n opacity: 0.5;\n overflow: hidden;\n transition: all ease 0.2s;\n &:last-child {\n height: auto;\n min-height: auto;\n }\n &.step-optional {\n height: 0;\n opacity: 0;\n min-height: 0px;\n }\n\n &.step-checked,\n &.step-active {\n .step-desc {\n margin: 0;\n opacity: 0;\n height: 0;\n }\n }\n\n &.step-checked {\n opacity: 1;\n .step-icon {\n color: ", ";\n background-color: ", ";\n & > * {\n transform: scale(1);\n }\n }\n\n .step-line {\n background-color: ", ";\n opacity: 1;\n }\n }\n\n &.step-active {\n opacity: 1;\n .step-icon {\n background-color: ", ";\n }\n .step-icon:before {\n transform: scale(1);\n }\n .step-content {\n color: ", ";\n }\n }\n\n &:last-child {\n .step-line {\n display: none;\n }\n\n .step-child-block {\n &:last-child {\n padding-bottom: 0;\n }\n }\n }\n\n &.hide-step-child {\n .step-children {\n .step-child-block {\n margin-top: 0;\n height: 0;\n opacity: 0;\n &:last-child {\n padding-bottom: 0;\n }\n }\n }\n }\n }\n .step-children {\n padding-top: 20px;\n .step-child-block {\n margin-top: 4px;\n height: 24px;\n line-height: 24px;\n font-size: 14px;\n color: #9397a1;\n transition: all ease 0.3s;\n &:first-of-type {\n margin-top: 8px;\n }\n &:last-child {\n padding-bottom: 40px;\n }\n &.step-child-block-active {\n color: ", ";\n font-weight: 700;\n }\n &.step-child-block-checked {\n color: ", ";\n }\n }\n }\n\n .step-active {\n .step-child-block {\n animation: stepChildAnime ease 0.3s;\n }\n }\n\n @keyframes stepChildAnime {\n 0% {\n height: 0;\n }\n 100% {\n height: 24px;\n }\n }\n"])), props => props.theme.breakpoints.down('md'), props => props.theme.palette.primary.main, props => props.theme.palette.grey[400], props => props.theme.palette.grey[400], props => props.theme.palette.common.white, props => props.theme.palette.common.white, props => props.theme.palette.grey[700], props => props.theme.palette.grey[700], props => props.theme.breakpoints.up('md'), props => props.theme.palette.common.white, props => props.theme.palette.primary.main, props => props.theme.palette.primary.main, props => props.theme.palette.primary.main, props => props.theme.palette.primary.main, props => props.theme.palette.common.black, props => props.theme.palette.common.black);
|
|
154
142
|
Nav.propTypes = {
|
|
155
143
|
blockletMeta: _propTypes.default.object.isRequired,
|
|
156
144
|
logoUrl: _propTypes.default.string,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@blocklet/launcher-layout",
|
|
3
|
-
"version": "2.1.
|
|
3
|
+
"version": "2.1.87",
|
|
4
4
|
"description": "Common ux components of launcher",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"access": "public"
|
|
@@ -39,13 +39,14 @@
|
|
|
39
39
|
"@arcblock/did-connect": "^2.6.7",
|
|
40
40
|
"@arcblock/icons": "^2.6.7",
|
|
41
41
|
"@arcblock/ux": "^2.6.7",
|
|
42
|
-
"@blocklet/launcher-util": "2.1.
|
|
43
|
-
"@blocklet/launcher-ux": "2.1.
|
|
42
|
+
"@blocklet/launcher-util": "2.1.87",
|
|
43
|
+
"@blocklet/launcher-ux": "2.1.87",
|
|
44
44
|
"@blocklet/meta": "^1.16.13",
|
|
45
45
|
"@emotion/react": "^11.11.1",
|
|
46
46
|
"@emotion/styled": "^11.11.0",
|
|
47
47
|
"@mui/icons-material": "^5.14.1",
|
|
48
48
|
"@mui/material": "^5.14.2",
|
|
49
|
+
"is-empty": "^1.2.0",
|
|
49
50
|
"lodash": "^4.17.21",
|
|
50
51
|
"prop-types": "^15.8.1",
|
|
51
52
|
"rehype-react": "^7.2.0",
|
|
@@ -59,5 +60,5 @@
|
|
|
59
60
|
"@storybook/react": "^6.5.16",
|
|
60
61
|
"babel-plugin-inline-react-svg": "^2.0.2"
|
|
61
62
|
},
|
|
62
|
-
"gitHead": "
|
|
63
|
+
"gitHead": "2449eebc1d6a3689dfb2d3ee899cb61d5445779d"
|
|
63
64
|
}
|