@blocklet/launcher-workflow 2.0.14 → 2.0.16
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/components/layout/body.js +1 -1
- package/lib/components/plan.js +11 -24
- package/lib/purchase.js +9 -5
- package/package.json +10 -10
|
@@ -24,4 +24,4 @@ function Body(_ref) {
|
|
|
24
24
|
Body.propTypes = {
|
|
25
25
|
children: _propTypes.default.any.isRequired
|
|
26
26
|
};
|
|
27
|
-
const Container = _styled.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n flex: 1;\n margin-top: 32px;\n\n .page-body-article {\n width: 100%;\n height: 100%;\n overflow-y: auto;\n display: flex;\n flex-direction: column;\n }\n"])));
|
|
27
|
+
const Container = _styled.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n flex: 1;\n\n @media (min-width: 900px) {\n margin-top: 32px;\n }\n\n .page-body-article {\n width: 100%;\n height: 100%;\n overflow-y: auto;\n display: flex;\n flex-direction: column;\n }\n"])));
|
package/lib/components/plan.js
CHANGED
|
@@ -13,10 +13,9 @@ var _useMobile = _interopRequireDefault(require("@blocklet/launcher-ux/lib/use-m
|
|
|
13
13
|
var _util = require("../../lib/util");
|
|
14
14
|
var _locale = require("../contexts/locale");
|
|
15
15
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
16
|
-
var _templateObject, _templateObject2;
|
|
17
16
|
const _excluded = ["plan", "productFeatures", "toc", "checked", "recommend"];
|
|
17
|
+
var _templateObject, _templateObject2, _templateObject3, _templateObject4;
|
|
18
18
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
19
|
-
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
20
19
|
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; }
|
|
21
20
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
22
21
|
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
@@ -24,6 +23,7 @@ function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typ
|
|
|
24
23
|
function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
25
24
|
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
26
25
|
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; }
|
|
26
|
+
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
27
27
|
var CpuIcon = function CpuIcon(props) {
|
|
28
28
|
return /*#__PURE__*/(0, _jsxRuntime.jsxs)("svg", _objectSpread(_objectSpread({}, props), {}, {
|
|
29
29
|
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("rect", {
|
|
@@ -122,17 +122,12 @@ function Feature(_ref) {
|
|
|
122
122
|
valueEle = feature.value[locale];
|
|
123
123
|
}
|
|
124
124
|
if (isMobile) {
|
|
125
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(
|
|
126
|
-
|
|
127
|
-
display: 'flex',
|
|
128
|
-
alignItems: 'center'
|
|
129
|
-
},
|
|
130
|
-
children: [feature.type === 'boolean' && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
|
|
125
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
|
|
126
|
+
children: [feature.type === 'boolean' && /*#__PURE__*/(0, _jsxRuntime.jsxs)(MobileBooleanItem, {
|
|
131
127
|
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
|
|
132
128
|
component: "span",
|
|
133
129
|
style: {
|
|
134
|
-
display: 'flex'
|
|
135
|
-
alignItems: 'center'
|
|
130
|
+
display: 'flex'
|
|
136
131
|
},
|
|
137
132
|
children: valueEle
|
|
138
133
|
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
|
|
@@ -142,23 +137,15 @@ function Feature(_ref) {
|
|
|
142
137
|
},
|
|
143
138
|
children: feature.name[locale]
|
|
144
139
|
})]
|
|
145
|
-
}), feature.type === 'text' && /*#__PURE__*/(0, _jsxRuntime.
|
|
146
|
-
children: [
|
|
147
|
-
component: "span",
|
|
148
|
-
children: feature.name[locale]
|
|
149
|
-
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
|
|
150
|
-
component: "span",
|
|
151
|
-
style: {
|
|
152
|
-
display: 'flex',
|
|
153
|
-
alignItems: 'center'
|
|
154
|
-
},
|
|
155
|
-
children: valueEle
|
|
156
|
-
})]
|
|
140
|
+
}), feature.type === 'text' && /*#__PURE__*/(0, _jsxRuntime.jsx)(MobileTextItem, {
|
|
141
|
+
children: "".concat(feature.name[locale], ": ").concat(valueEle)
|
|
157
142
|
})]
|
|
158
143
|
});
|
|
159
144
|
}
|
|
160
145
|
return valueEle;
|
|
161
146
|
}
|
|
147
|
+
const MobileBooleanItem = _styled.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n display: flex;\n justify-content: center;\n"])));
|
|
148
|
+
const MobileTextItem = _styled.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n display: -webkit-box;\n white-space: normal;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n"])));
|
|
162
149
|
Feature.propTypes = {
|
|
163
150
|
feature: _propTypes.default.object.isRequired,
|
|
164
151
|
locale: _propTypes.default.string.isRequired,
|
|
@@ -261,8 +248,8 @@ function Plan(_ref2) {
|
|
|
261
248
|
})]
|
|
262
249
|
}));
|
|
263
250
|
}
|
|
264
|
-
const Outer = _styled.default.div(
|
|
265
|
-
const Container = _styled.default.div(
|
|
251
|
+
const Outer = _styled.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n position: relative;\n\n .recommend-icon {\n display: none;\n }\n\n &.card-recommend {\n margin-right: 8px;\n\n .recommend-icon {\n display: block;\n position: absolute;\n top: -8px;\n right: -8px;\n }\n"])));
|
|
252
|
+
const Container = _styled.default.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n flex-direction: column;\n border-radius: 12px;\n overflow: hidden;\n min-height: 400px;\n margin-top: 8px;\n white-space: nowrap;\n padding: 16px;\n\n .toc__title {\n font-weight: bolder;\n align-items: flex-start;\n }\n\n &:not(.toc) {\n color: #000;\n background-color: ", ";\n cursor: pointer;\n }\n\n &:not(.toc, .checked):hover {\n color: #000;\n background-color: #ddf6f8;\n cursor: pointer;\n }\n\n &.checked {\n color: #fff;\n background-color: ", ";\n cursor: pointer;\n }\n\n .basic {\n width: 100%;\n height: 8em;\n\n .header {\n text-align: center;\n .header__title {\n color: ", ";\n }\n\n .header__name {\n font-weight: bolder;\n }\n }\n\n .price-info {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n height: 6.5em;\n\n .price {\n font-size: 1.5em;\n font-weight: bolder;\n }\n\n .period {\n color: ", ";\n }\n }\n }\n\n .features {\n display: flex;\n flex-direction: column;\n width: 100%;\n margin-top: auto;\n\n .feature {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 48px;\n\n @media (max-width: 900px) {\n margin-left: 28px;\n justify-content: flex-start;\n }\n\n &:not(:last-child) {\n border-bottom: 1px solid;\n border-bottom-color: ", ";\n }\n }\n }\n"])), props => props.theme.palette.secondary.main, props => props.theme.palette.primary.main, props => props.checked ? '#ffffff' : '#9397a1', props => props.checked ? '#ffffff' : '#9397a1', props => props.checked || props.hovered ? 'rgba(255, 255, 255, 0.2)' : '#f6f6f6');
|
|
266
253
|
Plan.propTypes = {
|
|
267
254
|
plan: _propTypes.default.object,
|
|
268
255
|
productFeatures: _propTypes.default.array,
|
package/lib/purchase.js
CHANGED
|
@@ -146,10 +146,14 @@ function PurchasePage(_ref) {
|
|
|
146
146
|
productFeatures: productFeatures,
|
|
147
147
|
className: "toc"
|
|
148
148
|
}), ((_planState$value2 = planState.value) === null || _planState$value2 === void 0 ? void 0 : _planState$value2.length) > 0 && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactSplide.Splide, {
|
|
149
|
-
className: "plan-splide",
|
|
149
|
+
className: "plan-splide plan-container",
|
|
150
150
|
extensions: {
|
|
151
151
|
Grid: _splideExtensionGrid.Grid
|
|
152
152
|
},
|
|
153
|
+
onActive: (_, splide) => {
|
|
154
|
+
var _planState$value$spli;
|
|
155
|
+
setSelectedPlanId((_planState$value$spli = planState.value[splide.index]) === null || _planState$value$spli === void 0 ? void 0 : _planState$value$spli._id);
|
|
156
|
+
},
|
|
153
157
|
onPaginationMounted: (_, _ref2) => {
|
|
154
158
|
let {
|
|
155
159
|
items
|
|
@@ -177,15 +181,15 @@ function PurchasePage(_ref) {
|
|
|
177
181
|
perPage: Math.min(4, planState.value.length),
|
|
178
182
|
gap: '20px'
|
|
179
183
|
},
|
|
180
|
-
|
|
184
|
+
2900: {
|
|
181
185
|
perPage: Math.min(3, planState.value.length),
|
|
182
186
|
gap: '20px'
|
|
183
187
|
},
|
|
184
|
-
|
|
188
|
+
1600: {
|
|
185
189
|
perPage: Math.min(2, planState.value.length),
|
|
186
190
|
gap: '20px'
|
|
187
191
|
},
|
|
188
|
-
|
|
192
|
+
1360: {
|
|
189
193
|
perPage: 1,
|
|
190
194
|
gap: '8px'
|
|
191
195
|
}
|
|
@@ -246,7 +250,7 @@ function PurchasePage(_ref) {
|
|
|
246
250
|
})]
|
|
247
251
|
});
|
|
248
252
|
}
|
|
249
|
-
const Container = (0, _styled.default)(_layout.default)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n .plan-list {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-top: 20px;\n\n .toc {\n width: 30%;\n margin-right: 20px;\n }\n\n .plan-splide {\n width: 100%;\n }\n\n button.splide__pagination__page.is-active {\n background: #9397a1;\n }\n }\n\n .splide__pagination-custom {\n bottom: -24px;\n }\n\n .footer {\n display: flex;\n justify-content: ", ";\n align-item: center;\n margin-top: auto;\n\n @media (max-width: ", "px) {\n flex-direction: column;\n align-items: center;\n }\n\n .select-space {\n a {\n color: #000;\n }\n }\n\n .button-next {\n width: 200px;\n\n @media (max-width: ", "px) {\n width: 100%;\n margin-top: 20px;\n }\n }\n }\n"])), props => props.embed ? 'space-between' : 'flex-end', props => props.theme.breakpoints.values.sm, props => props.theme.breakpoints.values.sm);
|
|
253
|
+
const Container = (0, _styled.default)(_layout.default)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n .plan-list {\n display: flex;\n justify-content: space-between;\n align-items: center;\n\n @media (min-width: 900px) {\n margin-top: 20px;\n }\n\n @media (min-width: 680px) and (max-width: 899px) {\n justify-content: center;\n }\n\n .toc {\n width: 30%;\n min-width: 250px;\n margin-right: 20px;\n }\n\n .plan-splide {\n width: 100%;\n }\n\n .plan-container {\n @media (min-width: 1360px) and (max-width: 1599px) {\n max-width: 600px;\n }\n\n @media (min-width: 1200px) and (max-width: 1359px) {\n max-width: 300px;\n }\n\n @media (min-width: 900px) and (max-width: 1199px) {\n max-width: 250px;\n }\n\n @media (min-width: 680px) and (max-width: 899px) {\n width: 80%;\n }\n }\n\n button.splide__pagination__page.is-active {\n background: #9397a1;\n }\n }\n\n .splide__pagination-custom {\n bottom: -24px;\n }\n\n .footer {\n display: flex;\n justify-content: ", ";\n align-item: center;\n margin-top: auto;\n\n @media (max-width: ", "px) {\n flex-direction: column;\n align-items: center;\n margin-top: 24px;\n }\n\n .select-space {\n a {\n color: #000;\n }\n }\n\n .button-next {\n width: 200px;\n\n @media (max-width: ", "px) {\n width: 100%;\n margin-top: 20px;\n }\n }\n }\n"])), props => props.embed ? 'space-between' : 'flex-end', props => props.theme.breakpoints.values.sm, props => props.theme.breakpoints.values.sm);
|
|
250
254
|
PurchasePage.propTypes = {
|
|
251
255
|
disableBack: _propTypes.default.bool
|
|
252
256
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@blocklet/launcher-workflow",
|
|
3
|
-
"version": "2.0.
|
|
3
|
+
"version": "2.0.16",
|
|
4
4
|
"description": "Purchase components for Launcher UI",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"access": "public"
|
|
@@ -40,15 +40,15 @@
|
|
|
40
40
|
"@arcblock/icons": "^2.5.18",
|
|
41
41
|
"@arcblock/license": "^2.5.18",
|
|
42
42
|
"@arcblock/ux": "^2.5.18",
|
|
43
|
-
"@blocklet/launcher-layout": "2.0.
|
|
44
|
-
"@blocklet/launcher-util": "2.0.
|
|
45
|
-
"@blocklet/launcher-ux": "2.0.
|
|
46
|
-
"@did-pay/react": "^1.9.
|
|
43
|
+
"@blocklet/launcher-layout": "2.0.16",
|
|
44
|
+
"@blocklet/launcher-util": "2.0.16",
|
|
45
|
+
"@blocklet/launcher-ux": "2.0.16",
|
|
46
|
+
"@did-pay/react": "^1.9.49",
|
|
47
47
|
"@emotion/react": "^11.10.6",
|
|
48
48
|
"@emotion/styled": "^11.10.6",
|
|
49
49
|
"@mui/icons-material": "^5.11.11",
|
|
50
50
|
"@mui/material": "^5.11.15",
|
|
51
|
-
"@ocap/util": "^1.18.
|
|
51
|
+
"@ocap/util": "^1.18.65",
|
|
52
52
|
"@splidejs/react-splide": "^0.7.12",
|
|
53
53
|
"@splidejs/splide": "^4.1.4",
|
|
54
54
|
"@splidejs/splide-extension-grid": "^0.4.1",
|
|
@@ -61,16 +61,16 @@
|
|
|
61
61
|
"lodash.throttle": "^4.1.1",
|
|
62
62
|
"prop-types": "^15.8.1",
|
|
63
63
|
"react-lottie-player": "^1.5.4",
|
|
64
|
-
"react-router-dom": "^6.
|
|
64
|
+
"react-router-dom": "^6.10.0",
|
|
65
65
|
"react-use": "^17.4.0",
|
|
66
66
|
"url-join": "^4.0.1"
|
|
67
67
|
},
|
|
68
68
|
"devDependencies": {
|
|
69
69
|
"@babel/cli": "^7.21.0",
|
|
70
|
-
"@babel/core": "^7.21.
|
|
71
|
-
"@babel/preset-env": "^7.
|
|
70
|
+
"@babel/core": "^7.21.4",
|
|
71
|
+
"@babel/preset-env": "^7.21.4",
|
|
72
72
|
"@babel/preset-react": "^7.18.6",
|
|
73
73
|
"babel-plugin-inline-react-svg": "^2.0.2"
|
|
74
74
|
},
|
|
75
|
-
"gitHead": "
|
|
75
|
+
"gitHead": "3ced6709f92df8d60b4d559697b2a5f10a526a17"
|
|
76
76
|
}
|