@blocklet/launcher-layout 1.9.65 → 2.0.0

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 (5) hide show
  1. package/lib/compact-layout.js +1 -1
  2. package/lib/context/step.js +1 -1
  3. package/lib/index.js +2 -6
  4. package/lib/page-header.js +8 -5
  5. package/package.json +3 -3
package/lib/compact-layout.js CHANGED
@@ -80,7 +80,7 @@ function CompactLayout(_ref) {
80
80
  })]
81
81
  });
82
82
  }
83
- const Container = _styled.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n width: 100%;\n height: 100%;\n animation: fadein ease 0.5s;\n &.scroll-mode {\n .compact-context {\n flex: 1;\n overflow-y: auto;\n }\n .fix-container {\n flex-shrink: 0;\n }\n }\n\n @keyframes fadein {\n 0% {\n opacity: 0;\n }\n 100% {\n opacity: 1;\n }\n }\n"])));
83
+ const Container = _styled.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n width: 100%;\n height: 100%;\n animation: fadein ease 0.5s;\n\n .fix-container {\n margin-top: auto;\n width: 100%;\n }\n\n &.scroll-mode {\n .compact-context {\n flex: 1;\n overflow-y: auto;\n }\n .fix-container {\n margin-top: auto;\n flex-shrink: 0;\n }\n }\n\n @keyframes fadein {\n 0% {\n opacity: 0;\n }\n 100% {\n opacity: 1;\n }\n }\n"])));
84
84
  CompactLayout.propTypes = {
85
85
  children: _propTypes.default.any,
86
86
  bottom: _propTypes.default.element.isRequired,
package/lib/context/step.js CHANGED
@@ -14,7 +14,7 @@ const {
14
14
  Provider
15
15
  } = StepContext;
16
16
  const matchPath = function matchPath(path, exact) {
17
- let currentPathname = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : window.location.pathname.replace(/\/$/, '');
17
+ let currentPathname = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : window.location.pathname.replace(/\/$/, '/');
18
18
  if (!path) {
19
19
  return false;
20
20
  }
package/lib/index.js CHANGED
@@ -30,7 +30,7 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
30
30
  function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
31
31
  function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
32
32
  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: 68px;\n"])));
33
- const PcContent = _styled.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n display: flex;\n max-width: 1245px;\n min-width: 900px;\n max-height: 880px;\n border-radius: 8px;\n background-color: #fff;\n"])));
33
+ const PcContent = _styled.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n display: flex;\n height: 80%;\n max-height: 880px;\n border-radius: 8px;\n background-color: #fff;\n\n @media (min-width: 2400px) {\n width: 50%;\n }\n\n @media (min-width: 1920px) and (max-width: 2399px) {\n width: 60%;\n }\n\n @media (min-width: 1025px) and (max-width: 1920px) {\n width: 80%;\n }\n\n @media (min-width: 769px) and (max-width: 1024px) {\n width: 80%;\n }\n\n @media (max-width: 768px) {\n width: 80%;\n }\n"])));
34
34
  function Layout(_ref) {
35
35
  let {
36
36
  blockletMeta,
@@ -94,10 +94,6 @@ function Layout(_ref) {
94
94
  children: headerEndAddons
95
95
  })]
96
96
  }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(Container, {
97
- style: !isMobile ? {
98
- width: pcWidth,
99
- height: pcHeight
100
- } : {},
101
97
  children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Hidden.default, {
102
98
  mdDown: true,
103
99
  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_nav.default, {
@@ -149,7 +145,7 @@ let injectStyle = '';
149
145
  if (ua.includes('iphone os') && ua.includes('crios')) {
150
146
  injectStyle = 'height: calc(100vh - 60px);';
151
147
  }
152
- const Root = _styled.default.div(_templateObject3 || (_templateObject3 = _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 .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\n ", " {\n background: #f6f8fa;\n }\n\n ", " {\n background: ", ";\n }\n\n .root-header {\n box-sizing: border-box;\n position: absolute;\n z-index: 200;\n top: 0;\n display: flex;\n width: 100%;\n max-width: 1245px;\n height: 68px;\n align-items: center;\n\n ", " {\n padding: 24px;\n justify-content: flex-end;\n }\n\n ", " {\n height: 56px;\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 }\n"])), injectStyle, props => props.theme.breakpoints.down('md'), props => props.theme.breakpoints.up('sm'), props => props.theme.breakpoints.down('md'), props => props.theme.palette.common.white, props => props.theme.breakpoints.up('sm'), props => props.theme.breakpoints.down('md'), props => props.theme.breakpoints.down('md'));
148
+ const Root = _styled.default.div(_templateObject3 || (_templateObject3 = _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 .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\n ", " {\n background: #f6f8fa;\n }\n\n ", " {\n background: ", ";\n }\n\n .root-header {\n box-sizing: border-box;\n position: absolute;\n z-index: 200;\n top: 0;\n display: flex;\n width: 100%;\n height: 68px;\n align-items: center;\n\n ", " {\n padding: 24px;\n justify-content: flex-end;\n }\n\n ", " {\n height: 56px;\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 }\n"])), injectStyle, props => props.theme.breakpoints.down('md'), props => props.theme.breakpoints.up('sm'), props => props.theme.breakpoints.down('md'), props => props.theme.palette.common.white, props => props.theme.breakpoints.up('sm'), props => props.theme.breakpoints.down('md'), props => props.theme.breakpoints.down('md'));
153
149
  const LogoContainer = _styled.default.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n display: block;\n margin-top: 4px;\n"])));
154
150
  var _default = Layout;
155
151
  exports.default = _default;
package/lib/page-header.js CHANGED
@@ -9,7 +9,7 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
9
9
  var _ArrowBackIos = _interopRequireDefault(require("@mui/icons-material/ArrowBackIos"));
10
10
  var _jsxRuntime = require("react/jsx-runtime");
11
11
  var _templateObject;
12
- const _excluded = ["title", "subTitle", "onClickBack"];
12
+ const _excluded = ["title", "subTitle", "disableBack", "onClickBack"];
13
13
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
14
14
  function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
15
15
  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; }
@@ -23,11 +23,12 @@ function PageHeader(_ref) {
23
23
  let {
24
24
  title,
25
25
  subTitle,
26
+ disableBack,
26
27
  onClickBack
27
28
  } = _ref,
28
29
  rest = _objectWithoutProperties(_ref, _excluded);
29
30
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(Content, _objectSpread(_objectSpread({}, rest), {}, {
30
- children: [onClickBack && /*#__PURE__*/(0, _jsxRuntime.jsx)(_ArrowBackIos.default, {
31
+ children: [!disableBack && /*#__PURE__*/(0, _jsxRuntime.jsx)(_ArrowBackIos.default, {
31
32
  className: "back-btn",
32
33
  onClick: onClickBack
33
34
  }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
@@ -39,16 +40,18 @@ function PageHeader(_ref) {
39
40
  })]
40
41
  }));
41
42
  }
42
- const Content = _styled.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n position: relative;\n width: 100%;\n text-align: center;\n\n .title {\n font-size: 24px;\n font-weight: 700;\n color: ", ";\n }\n\n .sub-title {\n font-size: 14px;\n color: ", ";\n padding: 0 14px;\n font-weight: 400;\n }\n\n .back-btn {\n position: absolute;\n left: 25px;\n top: 8px;\n color: #9397a1;\n font-size: 18px;\n cursor: pointer;\n }\n"])), props => props.theme.palette.common.black, props => props.theme.palette.grey[600]);
43
+ const Content = _styled.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n position: relative;\n width: 100%;\n text-align: center;\n\n .title {\n font-size: 24px;\n font-weight: 700;\n color: ", ";\n }\n\n .sub-title {\n font-size: 14px;\n color: ", ";\n padding: 0 14px;\n font-weight: 400;\n }\n\n .back-btn {\n position: absolute;\n left: 0;\n top: 8px;\n color: #9397a1;\n font-size: 18px;\n cursor: pointer;\n }\n"])), props => props.theme.palette.common.black, props => props.theme.palette.grey[600]);
43
44
  var _default = PageHeader;
44
45
  exports.default = _default;
45
46
  PageHeader.propTypes = {
46
47
  title: _propTypes.default.string,
47
48
  subTitle: _propTypes.default.string,
48
- onClickBack: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.string])
49
+ disableBack: _propTypes.default.bool,
50
+ onClickBack: _propTypes.default.func
49
51
  };
50
52
  PageHeader.defaultProps = {
51
53
  title: '',
52
54
  subTitle: '',
53
- onClickBack: ''
55
+ onClickBack: () => {},
56
+ disableBack: false
54
57
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@blocklet/launcher-layout",
3
- "version": "1.9.65",
3
+ "version": "2.0.0",
4
4
  "description": "Common ux components of launcher",
5
5
  "publishConfig": {
6
6
  "access": "public"
@@ -40,7 +40,7 @@
40
40
  "@arcblock/did-connect": "^2.4.68",
41
41
  "@arcblock/icons": "^2.4.68",
42
42
  "@arcblock/ux": "^2.4.68",
43
- "@blocklet/launcher-ux": "1.9.65",
43
+ "@blocklet/launcher-ux": "2.0.0",
44
44
  "@blocklet/meta": "^1.8.64",
45
45
  "@emotion/react": "^11.10.5",
46
46
  "@emotion/styled": "^11.10.5",
@@ -59,5 +59,5 @@
59
59
  "@storybook/react": "^6.5.16",
60
60
  "babel-plugin-inline-react-svg": "^2.0.1"
61
61
  },
62
- "gitHead": "3880d524f378269270842dcc34b9437ab11ab9a2"
62
+ "gitHead": "d55d16c2830ccaea07e9dd5cc81e55bffa6f597d"
63
63
  }