@abtnode/ux 1.8.66-beta-b56e3b54 → 1.8.67-beta-f8b4c9ec

package/lib/blocklet/component/add.js

@@ -32,6 +32,7 @@ var _Tag = _interopRequireDefault(require("@arcblock/ux/lib/Tag"));
 var _AnimationWaiter = _interopRequireDefault(require("@arcblock/ux/lib/AnimationWaiter"));
 var _launchResultMessage = _interopRequireDefault(require("@blocklet/launcher-layout/lib/launch-result-message"));
 var _util = require("@blocklet/meta/lib/util");
+var _urlFriendly = _interopRequireDefault(require("@blocklet/meta/lib/url-friendly"));
 var _node = require("../../contexts/node");
 var _util2 = require("../../util");
 var _toast = _interopRequireDefault(require("../../toast"));
@@ -138,6 +139,7 @@ function AddComponent(_ref2) {
   const [error, setError] = (0, _react.useState)('');
   const [showDialog, setShowDialog] = (0, _react.useState)('');
   const [configs, setConfigs] = (0, _react.useState)([]);
+  const [mountPointHelperText, setMountPointHelperText] = (0, _react.useState)('');
   const {
     api,
     ws: {
@@ -282,7 +284,7 @@ function AddComponent(_ref2) {
     const installInput = _objectSpread(_objectSpread(_objectSpread({
       rootDid: blocklet.meta.did,
       url,
-      mountPoint,
+      mountPoint: (0, _urlFriendly.default)(mountPoint),
       title,
       name: componentName,
       did: componentDid
@@ -546,7 +548,7 @@ function AddComponent(_ref2) {
     } else {
       var _component$current$me, _component$current$me2;
       doc = _objectSpread(_objectSpread({}, doc), {}, {
-        pathPrefix: "/".concat((0, _util.urlFriendly)(name)),
+        pathPrefix: "/".concat((0, _urlFriendly.default)(name)),
         title: title || '',
         componentName: '',
         hasEnvironmentsStep: ((_component$current$me = component.current.meta) === null || _component$current$me === void 0 ? void 0 : (_component$current$me2 = _component$current$me.environments) === null || _component$current$me2 === void 0 ? void 0 : _component$current$me2.length) > 0
@@ -818,7 +820,7 @@ function AddComponent(_ref2) {
           'data-cy': 'mount-point-input'
         },
         fullWidth: true,
-        helperText: t('blocklet.component.mountPointTip'),
+        helperText: mountPointHelperText || t('blocklet.component.mountPointTip'),
         style: {
           marginBottom: 32
         },
@@ -829,6 +831,9 @@ function AddComponent(_ref2) {
           updateParams({
             pathPrefix
           });
+          setMountPointHelperText(t('common.slugifyHint', {
+            value: (0, _util2.formatMountPoint)(pathPrefix)
+          }));
         }
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
         label: t('common.title'),

package/lib/blocklet/component/index.js

@@ -33,6 +33,7 @@ var _context = require("@arcblock/ux/lib/Locale/context");
 var _Button = _interopRequireDefault(require("@arcblock/ux/lib/Button"));
 var _Empty = _interopRequireDefault(require("@arcblock/ux/lib/Empty"));
 var _util = require("@blocklet/meta/lib/util");
+var _normalizePathPrefix = _interopRequireDefault(require("@abtnode/util/lib/normalize-path-prefix"));
 var _deletingBlocklets = require("../../contexts/deleting-blocklets");
 var _didAddress = _interopRequireDefault(require("../../did-address"));
 var _tag = _interopRequireDefault(require("../../tag"));
@@ -308,7 +309,7 @@ function ComponentItem(_ref) {
           overflow: "hidden",
           whiteSpace: "nowrap",
           textOverflow: "ellipsis",
-          children: mountPoint
+          children: (0, _normalizePathPrefix.default)(mountPoint)
         })
       })
     }, mountPoint), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {

package/lib/blocklet/component/setting.js

@@ -9,6 +9,7 @@ var _styled = _interopRequireDefault(require("@emotion/styled"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _Box = _interopRequireDefault(require("@mui/material/Box"));
 var _context = require("@arcblock/ux/lib/Locale/context");
+var _urlFriendly = _interopRequireDefault(require("@blocklet/meta/lib/url-friendly"));
 var _toast = _interopRequireDefault(require("../../toast"));
 var _formTextInput = _interopRequireDefault(require("../../form/form-text-input"));
 var _node = require("../../contexts/node");
@@ -43,6 +44,7 @@ function ComponentSetting(_ref) {
   const isDynamic = blocklet.dynamic;
   const rootDid = isRoot ? blocklet.meta.did : ancestors.map(x => x.meta.did)[0];
   const [loading, setLoading] = (0, _react.useState)('');
+  const [mountPointHelperText, setMountPointHelperText] = (0, _react.useState)('');
   const isDev = (0, _util.isBlockletDev)(blocklet);
   const disabled = isDev || loading || !hasPermission;
   if (!rootDid) {
@@ -74,7 +76,7 @@ function ComponentSetting(_ref) {
     try {
       const input = {
         rootDid,
-        mountPoint: value
+        mountPoint: (0, _urlFriendly.default)(value)
       };
       if (!isRoot) {
         input.did = blocklet.meta.did;
@@ -83,6 +85,7 @@ function ComponentSetting(_ref) {
         input
       });
       setLoading(false);
+      return true;
     } catch (err) {
       setLoading(false);
       err.message = (0, _util.formatError)(err);
@@ -90,6 +93,11 @@ function ComponentSetting(_ref) {
       throw err;
     }
   };
+  const handleMountPointChange = value => {
+    setMountPointHelperText(t('common.slugifyHint', {
+      value: (0, _util.formatMountPoint)(value)
+    }));
+  };
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(Div, _objectSpread(_objectSpread({
     component: "div"
   }, rest), {}, {
@@ -114,7 +122,10 @@ function ComponentSetting(_ref) {
         loading: loading,
         required: true,
         initialValue: blocklet.mountPoint,
-        onSubmit: onSubmitMountPoint
+        onSubmit: onSubmitMountPoint,
+        onChange: handleMountPointChange,
+        helperText: mountPointHelperText,
+        formatterBeforeSubmit: value => (0, _urlFriendly.default)(value)
       })]
     })
   }));

package/lib/blocklet/router/action/add-rule.js

@@ -13,12 +13,14 @@ var _TextField = _interopRequireDefault(require("@mui/material/TextField"));
 var _MenuItem = _interopRequireDefault(require("@mui/material/MenuItem"));
 var _context = require("@arcblock/ux/lib/Locale/context");
 var _constant = require("@abtnode/constant");
+var _urlFriendly = _interopRequireDefault(require("@blocklet/meta/lib/url-friendly"));
 var _node = require("../../../contexts/node");
 var _blocklet = require("../../../contexts/blocklet");
 var _confirm = _interopRequireDefault(require("../../../confirm"));
 var _toast = _interopRequireDefault(require("../../../toast"));
 var _util = require("../util");
 var _configRoutingRule = _interopRequireDefault(require("./config-routing-rule"));
+var _util2 = require("../../../util");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 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; }
@@ -56,7 +58,7 @@ function AddRule(_ref) {
       setLoading(true);
       const rule = {
         from: {
-          pathPrefix: params.pathPrefix.trim()
+          pathPrefix: (0, _urlFriendly.default)(params.pathPrefix)
         },
         to: {
           type: params.type
@@ -105,7 +107,7 @@ function AddRule(_ref) {
           "data-cy": "path-prefix-input",
           fullWidth: true,
           autoFocus: true,
-          helperText: t('router.rule.add.pathPrefixTip'),
+          helperText: params.helperText || t('router.rule.add.pathPrefixTip'),
           style: {
             marginBottom: 32
           },
@@ -133,8 +135,12 @@ function AddRule(_ref) {
             if (!disable) {
               setError('');
             }
+            const helperText = t('common.slugifyHint', {
+              value: (0, _util2.formatMountPoint)(e.target.value)
+            });
             setParams(_objectSpread(_objectSpread({}, params), {}, {
               pathPrefix: e.target.value,
+              helperText,
               __disableConfirm: disable
             }));
           }

package/lib/blocklet/router/action/update-rule.js

@@ -13,12 +13,14 @@ var _TextField = _interopRequireDefault(require("@mui/material/TextField"));
 var _MenuItem = _interopRequireDefault(require("@mui/material/MenuItem"));
 var _constant = require("@abtnode/constant");
 var _context = require("@arcblock/ux/lib/Locale/context");
+var _urlFriendly = _interopRequireDefault(require("@blocklet/meta/lib/url-friendly"));
 var _node = require("../../../contexts/node");
 var _blocklet = require("../../../contexts/blocklet");
 var _confirm = _interopRequireDefault(require("../../../confirm"));
 var _toast = _interopRequireDefault(require("../../../toast"));
 var _util = require("../util");
 var _configRoutingRule = _interopRequireDefault(require("./config-routing-rule"));
+var _util2 = require("../../../util");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 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; }
@@ -61,7 +63,7 @@ function UpdateRule(_ref) {
       const rule = {
         id: ruleId,
         from: {
-          pathPrefix: params.pathPrefix.trim()
+          pathPrefix: (0, _urlFriendly.default)(params.pathPrefix)
         },
         to: {
           type: params.type
@@ -109,7 +111,7 @@ function UpdateRule(_ref) {
           "data-cy": "path-prefix-input",
           fullWidth: true,
           autoFocus: true,
-          helperText: t('router.rule.add.pathPrefixTip'),
+          helperText: params.helperText || t('router.rule.add.pathPrefixTip'),
           style: {
             marginBottom: 32
           },
@@ -127,8 +129,12 @@ function UpdateRule(_ref) {
             if (!disable) {
               setError('');
             }
+            const helperText = t('common.slugifyHint', {
+              value: (0, _util2.formatMountPoint)(e.target.value)
+            });
             setParams(_objectSpread(_objectSpread({}, params), {}, {
               pathPrefix: e.target.value,
+              helperText,
               __disableConfirm: disable
             }));
           }

package/lib/form/form-text-input.js

@@ -16,7 +16,7 @@ var _IconButton = _interopRequireDefault(require("@mui/material/IconButton"));
 var _required = _interopRequireDefault(require("./required"));
 var _formWrapper = _interopRequireDefault(require("./form-wrapper"));
 var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["label", "disabled", "required", "initialValue", "onChange", "placeholder", "style", "onSubmit", "secure"];
+const _excluded = ["label", "disabled", "required", "initialValue", "onChange", "placeholder", "style", "onSubmit", "secure", "formatterBeforeSubmit"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 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; }
 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; }
@@ -35,7 +35,8 @@ function FormTextInput(_ref) {
       placeholder,
       style,
       onSubmit,
-      secure
+      secure,
+      formatterBeforeSubmit
     } = _ref,
     rest = _objectWithoutProperties(_ref, _excluded);
   const [editing, setEditing] = (0, _react.useState)(false);
@@ -49,7 +50,12 @@ function FormTextInput(_ref) {
       if (shouldUpdate === false) {
         setValue(defaultValue);
       } else {
-        setDefaultValue(value);
+        let tmpValue = value;
+        if (typeof formatterBeforeSubmit === 'function') {
+          tmpValue = formatterBeforeSubmit(value);
+        }
+        setValue(tmpValue);
+        setDefaultValue(tmpValue);
       }
     } catch (err) {
       setValue(defaultValue);
@@ -148,7 +154,8 @@ FormTextInput.propTypes = {
   placeholder: _propTypes.default.string,
   required: _propTypes.default.bool,
   disabled: _propTypes.default.bool,
-  secure: _propTypes.default.bool
+  secure: _propTypes.default.bool,
+  formatterBeforeSubmit: _propTypes.default.func
 };
 FormTextInput.defaultProps = {
   style: {},
@@ -159,5 +166,6 @@ FormTextInput.defaultProps = {
   placeholder: '',
   required: false,
   disabled: false,
-  secure: false
+  secure: false,
+  formatterBeforeSubmit: null
 };

package/lib/locales/en.js

@@ -278,7 +278,8 @@ module.exports = {
     normal: 'Normal',
     gateway: 'Gateway',
     verifyNFT: 'Verify NFT',
-    errorMessage: 'Error Message:'
+    errorMessage: 'Error Message:',
+    slugifyHint: 'The actual mount point will be: {value}'
   },
   blocklet: {
     external: 'External',

package/lib/locales/zh.js

@@ -284,7 +284,8 @@ module.exports = {
     normal: '正常',
     gateway: '网关',
     verifyNFT: '验证凭证',
-    errorMessage: '错误信息：'
+    errorMessage: '错误信息：',
+    slugifyHint: '最终生效的挂载点是: {value}'
   },
   blocklet: {
     external: '外部',

package/lib/util/index.js

@@ -9,7 +9,7 @@ exports.extractStatusUrlFromNextWorkflow = extractStatusUrlFromNextWorkflow;
 exports.formatDateTime = formatDateTime;
 exports.formatError = exports.formatDiskSize = void 0;
 exports.formatFactoryPrice = formatFactoryPrice;
-exports.formatRegistryScreenshotPath = exports.formatRegistryLogoPath = exports.formatPerson = exports.formatLocale = void 0;
+exports.formatRegistryScreenshotPath = exports.formatRegistryLogoPath = exports.formatPerson = exports.formatMountPoint = exports.formatLocale = void 0;
 exports.formatTime = formatTime;
 exports.formatTimeFromNow = formatTimeFromNow;
 exports.formatTimestamp = formatTimestamp;
@@ -57,6 +57,8 @@ var _constant2 = require("@blocklet/constant");
 var _urlEvaluation = require("@abtnode/util/lib/url-evaluation");
 var _checkAccessibleBrowser = _interopRequireDefault(require("@abtnode/util/lib/url-evaluation/check-accessible-browser"));
 var _axios = _interopRequireDefault(require("@abtnode/util/lib/axios"));
+var _normalizePathPrefix = _interopRequireDefault(require("@abtnode/util/lib/normalize-path-prefix"));
+var _urlFriendly = _interopRequireDefault(require("@blocklet/meta/lib/url-friendly"));
 var _window$env;
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function sleep(t) {
@@ -719,4 +721,6 @@ const sortDomains = domains => {
     return 1;
   });
 };
-exports.sortDomains = sortDomains;
+exports.sortDomains = sortDomains;
+const formatMountPoint = value => (0, _normalizePathPrefix.default)((0, _urlFriendly.default)(value));
+exports.formatMountPoint = formatMountPoint;

package/package.json

@@ -3,7 +3,7 @@
   "publishConfig": {
     "access": "public"
   },
-  "version": "1.8.66-beta-b56e3b54",
+  "version": "1.8.67-beta-f8b4c9ec",
   "description": "UX components shared across abtnode packages",
   "main": "lib/index.js",
   "files": [
@@ -21,19 +21,19 @@
   "author": "linchen <linchen1987@foxmail.com> (http://github.com/linchen1987)",
   "license": "MIT",
   "dependencies": {
-    "@abtnode/auth": "1.8.66-beta-b56e3b54",
-    "@abtnode/constant": "1.8.66-beta-b56e3b54",
-    "@abtnode/util": "1.8.66-beta-b56e3b54",
-    "@arcblock/did-connect": "^2.5.2",
+    "@abtnode/auth": "1.8.67-beta-f8b4c9ec",
+    "@abtnode/constant": "1.8.67-beta-f8b4c9ec",
+    "@abtnode/util": "1.8.67-beta-f8b4c9ec",
+    "@arcblock/did-connect": "^2.5.4",
     "@arcblock/did-motif": "^1.1.10",
-    "@arcblock/icons": "^2.5.2",
-    "@arcblock/terminal": "^2.5.2",
-    "@arcblock/ux": "^2.5.2",
-    "@blocklet/constant": "1.8.66-beta-b56e3b54",
+    "@arcblock/icons": "^2.5.4",
+    "@arcblock/terminal": "^2.5.4",
+    "@arcblock/ux": "^2.5.4",
+    "@blocklet/constant": "1.8.67-beta-f8b4c9ec",
     "@blocklet/launcher-layout": "^1.9.60",
-    "@blocklet/list": "^0.11.2",
-    "@blocklet/meta": "1.8.66-beta-b56e3b54",
-    "@blocklet/ui-react": "^2.5.2",
+    "@blocklet/list": "^0.11.4",
+    "@blocklet/meta": "1.8.67-beta-f8b4c9ec",
+    "@blocklet/ui-react": "^2.5.4",
     "@emotion/react": "^11.10.4",
     "@emotion/styled": "^11.10.4",
     "@iconify/react": "^4.0.0",
@@ -86,5 +86,5 @@
     "@babel/preset-react": "^7.18.6",
     "babel-plugin-inline-react-svg": "^1.1.2"
   },
-  "gitHead": "4d95b431526128c14cd04c0741cac423afce8f48"
+  "gitHead": "ebf19fcbc6d99fff0d214dc0680c4df81aa94d6d"
 }