@abtnode/ux 1.8.67-beta-794a8082 → 1.8.68-beta-500af7e5

package/lib/blocklet/component/space-gateway-selector.js

@@ -0,0 +1,174 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _styled = _interopRequireDefault(require("@emotion/styled"));
+var _urlJoin = _interopRequireDefault(require("url-join"));
+var _isUrl = _interopRequireDefault(require("is-url"));
+var _useLocalStorage = _interopRequireDefault(require("react-use/lib/useLocalStorage"));
+var _Button = _interopRequireDefault(require("@arcblock/ux/lib/Button"));
+var _context = require("@arcblock/ux/lib/Locale/context");
+var _material = require("@mui/material");
+var _Autocomplete = _interopRequireWildcard(require("@mui/material/Autocomplete"));
+var _session = require("../../../lib/contexts/session");
+var _toast = _interopRequireDefault(require("../../toast"));
+var _jsxRuntime = require("react/jsx-runtime");
+var _templateObject;
+const _excluded = ["onSelect", "endpoint", "loading"];
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+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; }
+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; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
+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); }
+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; }
+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; }
+const DEFAULT_GATEWAY_LIST = [{
+  value: 'https://www.didspaces.com/app',
+  label: 'Prod DID Spaces',
+  avatar: 'P'
+}, {
+  value: 'https://storage.staging.abtnet.io/app',
+  label: 'Staging DID Spaces',
+  avatar: 'S'
+}];
+const filter = (0, _Autocomplete.createFilterOptions)();
+function SpaceGatewaySelector(_ref) {
+  let {
+      onSelect,
+      endpoint,
+      loading
+    } = _ref,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  const [gatewayList, setGatewayList] = (0, _useLocalStorage.default)('did-space-gateway-list', DEFAULT_GATEWAY_LIST);
+  const [gatewayUrl, setGatewayUrl] = (0, _useLocalStorage.default)('did-space-gateway-url', DEFAULT_GATEWAY_LIST[0].value);
+  const {
+    t
+  } = (0, _context.useLocaleContext)();
+  const {
+    api
+  } = (0, _session.useSessionContext)();
+  (0, _react.useEffect)(() => {
+    if (gatewayUrl && !gatewayList.find(x => x.value === gatewayUrl)) {
+      api.get((0, _urlJoin.default)(gatewayUrl, '/__blocklet__.js?type=json')).then(res => {
+        // FIXME: @wangshijun handle mountPoint
+        setGatewayList([...gatewayList, {
+          value: gatewayUrl,
+          label: res.data.appName
+        }]);
+      }).catch(err => {
+        console.error(err);
+        _toast.default.error('Can not add this gateway, please check the url and try again');
+      });
+    }
+  }, [gatewayUrl]); // eslint-disable-line
+
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Container, _objectSpread(_objectSpread({}, rest), {}, {
+    freeSolo: true,
+    selectOnFocus: true,
+    clearOnBlur: true,
+    handleHomeEndKeys: true,
+    value: gatewayUrl,
+    options: gatewayList,
+    onChange: (e, v) => {
+      if (!v) {
+        return;
+      }
+      if (typeof v === 'string') {
+        const x = gatewayList.find(o => o.label === v);
+        if (x) {
+          setGatewayUrl(x.value);
+        }
+      } else if (v.inputValue) {
+        // Create a new value from the user input
+        setGatewayUrl(v.inputValue);
+      } else if (v.value) {
+        setGatewayUrl(v.value);
+      }
+    },
+    getOptionLabel: x => {
+      // Value selected with enter, right from the input
+      if (typeof x === 'string') {
+        return x;
+      }
+
+      // Add "xxx" x created dynamically
+      if (x.inputValue) {
+        return x.inputValue;
+      }
+      return x.label;
+    },
+    renderOption: (props, x) => {
+      return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.ListItem, _objectSpread(_objectSpread({}, props), {}, {
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.ListItemAvatar, {
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Avatar, {
+            children: x.avatar
+          })
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.ListItemText, {
+          primary: x.label,
+          secondary: x.value
+        })]
+      }), x.value);
+    },
+    filterOptions: (options, params) => {
+      const filtered = filter(options, params);
+
+      // Suggest the creation of a new value if its a valid url
+      if (params.inputValue && (0, _isUrl.default)(params.inputValue)) {
+        const isExisting = options.some(x => params.inputValue === x.value);
+        if (!isExisting) {
+          filtered.push({
+            value: params.inputValue,
+            label: 'Add new gateway'
+          });
+        }
+      }
+      return filtered;
+    },
+    renderInput: params => {
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TextField, _objectSpread(_objectSpread({}, params), {}, {
+        label: t('storage.spaces.label'),
+        size: "small",
+        InputProps: _objectSpread(_objectSpread({}, params.InputProps), {}, {
+          type: 'search',
+          endAdornment: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.default, {
+            variant: "contained",
+            onClick: () => onSelect(gatewayUrl),
+            size: "small",
+            loading: loading,
+            disable: loading,
+            sx: {
+              position: 'absolute',
+              right: 0,
+              display: 'flex',
+              justifyContent: 'center',
+              alignItems: 'center',
+              width: '100px',
+              height: '100%'
+            },
+            children: endpoint ? t('storage.spaces.reconnect') : t('storage.spaces.connect')
+          })
+        })
+      }));
+    }
+  }));
+}
+const Container = (0, _styled.default)(_Autocomplete.default)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  height: 40px;\n  width: 100%;\n  max-width: 720px;\n  ", " {\n    width: 75%;\n  }\n  input.MuiInputBase-input {\n    max-width: calc(100% - 80px);\n  }\n"])), props => props.theme.breakpoints.down('md'));
+SpaceGatewaySelector.propTypes = {
+  onSelect: _propTypes.default.func.isRequired,
+  endpoint: _propTypes.default.string,
+  loading: _propTypes.default.bool
+};
+SpaceGatewaySelector.defaultProps = {
+  endpoint: undefined,
+  loading: false
+};
+var _default = SpaceGatewaySelector;
+exports.default = _default;

package/lib/blocklet/configuration.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = BlockletEnvironmentWithPermission;
-var _react = require("react");
+var _react = _interopRequireWildcard(require("react"));
 var _styled = _interopRequireDefault(require("@emotion/styled"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _get = _interopRequireDefault(require("lodash/get"));
@@ -41,6 +41,8 @@ var _templateObject;
 const _excluded = ["blocklet", "onUpdate", "hasPermission"],
   _excluded2 = ["value"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 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; }

package/lib/blocklet/overview.js

@@ -4,6 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = BlockletOverview;
+var _react = _interopRequireDefault(require("react"));
 var _styled = _interopRequireDefault(require("@emotion/styled"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _Box = _interopRequireDefault(require("@mui/material/Box"));
@@ -113,13 +114,25 @@ function BlockletOverview() {
     loadingRuntimeInfo
   } = (0, _blocklet.useBlockletContext)();
   const {
-    value: appDid
-  } = (blocklet.environments || []).find(x => x.key === 'BLOCKLET_APP_ID') || {};
+    appDid,
+    appPid,
+    migratedFrom = []
+  } = blocklet;
   const infoRows = [appDid ? {
     name: t('blocklet.appId'),
     value: /*#__PURE__*/(0, _jsxRuntime.jsx)(_didAddress.default, {
       did: appDid
     })
+  } : null, appPid ? {
+    name: t('blocklet.appPid'),
+    value: /*#__PURE__*/(0, _jsxRuntime.jsx)(_didAddress.default, {
+      did: appPid
+    })
+  } : null, migratedFrom !== null && migratedFrom !== void 0 && migratedFrom.length ? {
+    name: t('blocklet.alsoKnownAs'),
+    value: migratedFrom.map(x => /*#__PURE__*/(0, _jsxRuntime.jsx)(_didAddress.default, {
+      did: x.appDid
+    }))
   } : null, {
     name: t('common.name'),
     value: (0, _util.getDisplayName)(blocklet, true)

package/lib/blocklet/preferences/app-sk.js

@@ -4,13 +4,17 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = AppSk;
-var _react = require("react");
+var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _styled = _interopRequireDefault(require("@emotion/styled"));
+var _useSetState = _interopRequireDefault(require("react-use/lib/useSetState"));
+var _Connect = _interopRequireDefault(require("@arcblock/did-connect/lib/Connect"));
 var _Box = _interopRequireDefault(require("@mui/material/Box"));
 var _context = require("@arcblock/ux/lib/Locale/context");
 var _formTextInput = _interopRequireDefault(require("../../form/form-text-input"));
 var _confirm = _interopRequireDefault(require("../../confirm"));
+var _session = require("../../contexts/session");
+var _blocklet = require("../../contexts/blocklet");
 var _jsxRuntime = require("react/jsx-runtime");
 var _templateObject;
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -25,10 +29,19 @@ function AppSk(_ref) {
   const {
     t
   } = (0, _context.useLocaleContext)();
-  const [confirmAppSk, setConfirmAppSk] = (0, _react.useState)(null);
+  const {
+    api
+  } = (0, _session.useSessionContext)();
+  const {
+    blocklet
+  } = (0, _blocklet.useBlockletContext)();
+  const [state, setState] = (0, _useSetState.default)({
+    newAppSk: '',
+    isConnectOpen: false
+  });
   const onAppSkChange = value => {
-    setConfirmAppSk({
-      value
+    setState({
+      newAppSk: value
     });
     return false;
   };
@@ -36,16 +49,29 @@ function AppSk(_ref) {
     try {
       await onChange(v);
     } finally {
-      setConfirmAppSk(null);
+      setState({
+        newAppSk: ''
+      });
     }
   };
+  const onClose = () => setState({
+    isConnectOpen: false
+  });
+  const triggers = [{
+    key: 'rotate-with-did-wallet',
+    title: 'Migrate with DID Wallet',
+    handler: () => setState({
+      isConnectOpen: true
+    })
+  }];
   return [/*#__PURE__*/(0, _jsxRuntime.jsx)(_formTextInput.default, {
     disabled: disabled,
     loading: loading,
     initialValue: initialValue,
     onSubmit: onAppSkChange,
+    triggers: triggers,
     secure: true
-  }), confirmAppSk && /*#__PURE__*/(0, _jsxRuntime.jsx)(_confirm.default, {
+  }), state.newAppSk && /*#__PURE__*/(0, _jsxRuntime.jsx)(_confirm.default, {
     title: t('blocklet.config.appSkTitle'),
     description: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
@@ -64,8 +90,28 @@ function AppSk(_ref) {
     }),
     confirm: t('confirm'),
     cancel: t('cancel'),
-    onConfirm: () => _onConfirm(confirmAppSk.value),
-    onCancel: () => setConfirmAppSk(null)
+    onConfirm: () => _onConfirm(state.newAppSk),
+    onCancel: () => setState({
+      newAppSk: ''
+    })
+  }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Connect.default, {
+    popup: true,
+    open: state.isConnectOpen,
+    forceConnected: false,
+    action: "rotate-key-pair",
+    checkFn: api.get,
+    checkTimeout: 5 * 60 * 1000,
+    onSuccess: onClose,
+    extraParams: {
+      appDid: blocklet.appDid
+    },
+    messages: {
+      title: t('setup.keyPair.title'),
+      scan: t('setup.keyPair.scan'),
+      confirm: t('setup.keyPair.confirm'),
+      success: t('setup.keyPair.success')
+    },
+    onClose: onClose
   })];
 }
 AppSk.propTypes = {

package/lib/blocklet/storage.js

@@ -4,9 +4,9 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = Storage;
+var _react = _interopRequireWildcard(require("react"));
 var _Box = _interopRequireDefault(require("@mui/material/Box"));
 var _Connect = _interopRequireDefault(require("@arcblock/did-connect/lib/Connect"));
-var _react = require("react");
 var _context = require("@arcblock/ux/lib/Locale/context");
 var _constant = require("@blocklet/constant");
 var _axios = _interopRequireDefault(require("axios"));
@@ -14,35 +14,77 @@ var _urlJoin = _interopRequireDefault(require("url-join"));
 var _styled = _interopRequireDefault(require("@emotion/styled"));
 var _lodash = require("lodash");
 var _Typography = _interopRequireDefault(require("@mui/material/Typography"));
-var _Button = _interopRequireDefault(require("@arcblock/ux/lib/Button"));
 var _material = require("@mui/material");
 var _blocklet = require("../../lib/contexts/blocklet");
 var _node = require("../contexts/node");
 var _toast = _interopRequireDefault(require("../../lib/toast"));
+var _spaceGatewaySelector = _interopRequireDefault(require("./component/space-gateway-selector"));
 var _jsxRuntime = require("react/jsx-runtime");
-var _templateObject, _templateObject2;
+var _templateObject;
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 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; }
 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; }
 function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
 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); }
-function Storage() {
-  var _localStorage$getItem, _blocklet$environment, _blocklet$environment2, _blocklet$environment3;
-  const options = [
-  // TODO: 测试用，上线后才需删除
-  {
-    value: (_localStorage$getItem = localStorage.getItem('test-spaces')) !== null && _localStorage$getItem !== void 0 && _localStorage$getItem.startsWith('http') ? localStorage.getItem('test-spaces') : 'https://bbqazi2fhuczchrlggs4njj2bucbvnwjjm2xlq6yk6i.did.abtnet.io',
-    label: 'test spaces'
-  }, {
-    value: 'https://storage.staging.abtnet.io/app',
-    label: 'staging spaces'
-  }, {
-    value: 'https://service.didspaces.com/app',
-    label: 'prod spaces'
-  }];
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+const Container = (0, _styled.default)('div')(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  height: 100%;\n  overflow-y: auto;\n"])));
+
+/**
+ * @description 实时显示备份的进度
+ * @param {{appDid: string}} {appDid}
+ * @return {{message: string, progress: number, completed: boolean}}
+ */
+function useBackupProgress(_ref) {
+  let {
+    appDid
+  } = _ref;
+  const [progress, setProgress] = (0, _react.useState)({
+    message: '',
+    progress: 0,
+    completed: false
+  });
+  const node = (0, _node.useNodeContext)();
+  const webSocketClient = node.ws.getWsClient();
+  (0, _react.useEffect)(() => {
+    webSocketClient.on(_constant.BlockletEvents.backupProgress, data => {
+      if (appDid === (data === null || data === void 0 ? void 0 : data.did)) {
+        setProgress(preValue => _objectSpread(_objectSpread({}, preValue), data));
+      }
+    });
+    return () => {
+      webSocketClient.off(_constant.BlockletEvents.backupProgress);
+    };
+  }, [appDid, webSocketClient]);
+  return progress;
+}
+
+/**
+ *
+ *
+ * @param {import('@abtnode/client').BlockletState} blocklet
+ * @return {*}
+ */
+function useAppUrl(blocklet) {
+  var _blocklet$site, _blocklet$site$domain, _blocklet$site$domain2;
+  const appUrls = blocklet === null || blocklet === void 0 ? void 0 : (_blocklet$site = blocklet.site) === null || _blocklet$site === void 0 ? void 0 : (_blocklet$site$domain = _blocklet$site.domainAliases) === null || _blocklet$site$domain === void 0 ? void 0 : (_blocklet$site$domain2 = _blocklet$site$domain.sort((a, b) => {
+    if (a.accessibility.accessible && b.accessibility.accessible) {
+      return +a.isProtected - +b.isProtected;
+    }
+    return +b.accessibility.accessible - +a.accessibility.accessible;
+  })) === null || _blocklet$site$domain2 === void 0 ? void 0 : _blocklet$site$domain2.map(domainAlias => domainAlias.accessibility.url);
+  const appUrl = appUrls === null || appUrls === void 0 ? void 0 : appUrls[0];
 
+  // 授权的时候提供 appUrl, 因为 appUrl 可能很久都拿不到值，所以加一个 loading 效果过渡一下
+  return {
+    appUrl,
+    isReady: Boolean(appUrl)
+  };
+}
+function Storage() {
+  var _blocklet$environment;
   /** @type {{ api: import('@abtnode/client').ABTNodeClient }} */
   const {
     api
@@ -51,13 +93,15 @@ function Storage() {
     t,
     locale
   } = (0, _react.useContext)(_context.LocaleContext);
-  const [errorMessage, setErrorMessage] = (0, _react.useState)(false);
   /** @type {{ blocklet: import('@abtnode/client').BlockletState }} */
   const {
     blocklet
   } = (0, _blocklet.useBlockletContext)();
+  const [gatewayUrl, setGatewayUrl] = (0, _react.useState)('');
   const [endpoint, setEndpoint] = (0, _react.useState)(((_blocklet$environment = blocklet.environments.find(e => e.key === _constant.BLOCKLET_CONFIGURABLE_KEY.BLOCKLET_APP_SPACE_ENDPOINT)) === null || _blocklet$environment === void 0 ? void 0 : _blocklet$environment.value) || '');
-  const [didSpacesUrl, setDidSpacesUrl] = (0, _react.useState)((_blocklet$environment2 = (_blocklet$environment3 = blocklet.environments.find(e => e.key === _constant.BLOCKLET_CONFIGURABLE_KEY.BLOCKLET_APP_SPACES_URL)) === null || _blocklet$environment3 === void 0 ? void 0 : _blocklet$environment3.value) !== null && _blocklet$environment2 !== void 0 ? _blocklet$environment2 : options[0].value);
+  const progress = useBackupProgress({
+    appDid: blocklet === null || blocklet === void 0 ? void 0 : blocklet.appDid
+  });
   const [isLoading, setIsLoading] = (0, _react.useState)(false);
   const {
     appDid
@@ -66,26 +110,24 @@ function Storage() {
     title: appName,
     description: appDescription
   } = blocklet.meta;
-
-  /**
-   *
-   * @param {string} did
-   * @param {string} storageEndpoint
-   */
+  const {
+    appUrl,
+    isReady
+  } = useAppUrl(blocklet);
   async function saveStorageEndpoint(did, storageEndpoint) {
     await api.configBlocklet({
       input: {
         did: [did],
         configs: [{
           key: _constant.BLOCKLET_CONFIGURABLE_KEY.BLOCKLET_APP_SPACES_URL,
-          value: didSpacesUrl
+          value: gatewayUrl
         }, {
           key: _constant.BLOCKLET_CONFIGURABLE_KEY.BLOCKLET_APP_SPACE_ENDPOINT,
           value: storageEndpoint
         }]
       }
     }).then(() => {
-      _toast.default.success(t('storage.didSpaces.getSpacesAuthorizeSuccessfully', locale));
+      _toast.default.success(t('storage.spaces.connected', locale));
     }).catch(error => {
       console.error(error);
       _toast.default.error(error.message);
@@ -101,49 +143,41 @@ function Storage() {
     }, 3000);
   };
   const [authorizeConnect, setAuthorizeConnect] = (0, _react.useState)({
-    open: false,
-    action: 'one-click-authorization',
-    checkTimeout: 1000 * 300,
-    checkFn: _axios.default.create({
-      baseURL: (0, _urlJoin.default)(didSpacesUrl, 'space')
-    }).get,
-    onClose: () => {
-      setAuthorizeConnect(preValue => _objectSpread(_objectSpread({}, preValue), {}, {
-        open: false
-      }));
-    }
+    open: false
   });
-  const handleOnClickAuthorize = async () => {
-    if ((0, _lodash.isEmpty)(didSpacesUrl)) {
-      _toast.default.error(t('storage.didSpaces.addressCannotEmpty', locale));
+
+  // eslint-disable-next-line no-shadow
+  const handleOnClickAuthorize = async gatewayUrl => {
+    if ((0, _lodash.isEmpty)(gatewayUrl)) {
+      _toast.default.error(t('storage.spaces.addressCannotEmpty', locale));
       return;
     }
+    setGatewayUrl(gatewayUrl);
     setAuthorizeConnect(preValue => _objectSpread(_objectSpread({}, preValue), {}, {
-      prefix: (0, _urlJoin.default)(didSpacesUrl, 'space/api/did'),
-      baseUrl: new URL(didSpacesUrl).origin,
+      action: 'one-click-authorization',
+      checkTimeout: 1000 * 300,
+      prefix: (0, _urlJoin.default)(gatewayUrl, 'space/api/did'),
+      baseUrl: new URL(gatewayUrl).origin,
       checkFn: _axios.default.create({
-        baseURL: (0, _urlJoin.default)(didSpacesUrl, 'space')
+        baseURL: (0, _urlJoin.default)(gatewayUrl, 'space')
       }).get,
       extraParams: {
         appDid,
         appName,
         appDescription,
-        scopes: 'list:object read:object write:object'
+        scopes: 'list:object read:object write:object',
+        appUrl,
+        referrer: window.location.href
+      },
+      onClose: () => {
+        // eslint-disable-next-line no-shadow
+        setAuthorizeConnect(preValue => _objectSpread(_objectSpread({}, preValue), {}, {
+          open: false
+        }));
       },
       open: true
     }));
   };
-  const onDidSpacesUrlChange = event => {
-    const {
-      value
-    } = event.target;
-    if ((0, _lodash.isEmpty)(value)) {
-      setErrorMessage(t('storage.didSpaces.addressCannotEmpty', locale));
-      return;
-    }
-    setErrorMessage(null);
-    setDidSpacesUrl(value);
-  };
   const onBackup = async () => {
     try {
       if (isLoading) {
@@ -155,7 +189,7 @@ function Storage() {
           did: blocklet.appDid
         }
       });
-      _toast.default.success(t('storage.didSpaces.backupSuccessfully'));
+      _toast.default.success(t('storage.spaces.backupSuccessfully'));
     } catch (error) {
       _toast.default.error(error.message);
       console.error(error);
@@ -166,88 +200,96 @@ function Storage() {
   (0, _react.useEffect)(() => {
     setAuthorizeConnect(preValue => _objectSpread(_objectSpread({}, preValue), {}, {
       messages: {
-        title: t('storage.didSpaces.authorize.title', {
+        title: t('storage.spaces.authorize.title', {
           appName
         }),
-        scan: t('storage.didSpaces.authorize.scan', {
+        scan: t('storage.spaces.authorize.scan', {
           appName
         }),
         confirm: '',
         success: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
           gutterBottom: true,
-          children: t('storage.didSpaces.authorize.success')
+          children: t('storage.spaces.authorize.success')
         })
       }
     }));
   }, [appName, locale, t]);
+  (0, _react.useEffect)(() => {
+    if (progress !== null && progress !== void 0 && progress.completed) {
+      setIsLoading(false);
+    } else if (progress !== null && progress !== void 0 && progress.message) {
+      setIsLoading(true);
+    }
+  }, [progress === null || progress === void 0 ? void 0 : progress.completed, progress === null || progress === void 0 ? void 0 : progress.message, t]);
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(Container, {
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(StorageUrlTextField, {
-      select: true,
+    style: {
+      maxWidth: '720px'
+    },
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_spaceGatewaySelector.default, {
       sx: {
-        marginTop: '20px'
+        marginTop: '24px',
+        marginBottom: '40px'
       },
-      label: t('storage.didSpaces.label'),
-      value: didSpacesUrl,
-      onChange: onDidSpacesUrlChange,
-      autoFocus: true,
-      size: "small",
-      error: !!errorMessage,
-      helperText: errorMessage,
-      InputProps: {
-        endAdornment: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.default, {
-          variant: "contained",
-          onClick: handleOnClickAuthorize,
-          size: "small",
-          sx: {
-            position: 'absolute',
-            right: 0,
-            display: 'flex',
-            justifyContent: 'center',
-            alignItems: 'center',
-            width: '140px',
-            height: '100%'
-          },
-          children: endpoint ? t('storage.didSpaces.reAuthorization') : t('storage.didSpaces.goToAuthorization')
-        })
-      },
-      children: options.map(option => /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.MenuItem, {
-        value: option.value,
-        children: option.label
-      }, option.value))
-    }), endpoint && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
-      color: "text.secondary",
-      sx: {
-        marginTop: '20px'
-      },
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
-        display: "flex",
-        children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
-          display: "inline",
-          children: [t('storage.didSpaces.tips'), ": \xA0", ' ', /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
-            display: "inline",
-            color: "primary.main",
-            fontWeight: "fontWeightBold",
-            children: t('storage.didSpaces.getSpacesAuthorizeSuccessfully')
-          })]
-        })
-      })
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
+      onSelect: handleOnClickAuthorize,
+      endpoint: endpoint,
+      loading: !isReady
+    }), endpoint && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
+      mt: 3,
       display: "flex",
-      justifyContent: "center",
-      sx: {
-        maxWidth: '580px',
-        marginTop: '20px',
-        padding: '0px 0px'
-      },
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.default, {
+      alignItems: "center",
+      justifyContent: "space-between",
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
+        display: "inline",
+        children: [t('storage.spaces.tips'), ": \xA0", ' ', /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
+          display: "inline",
+          color: "primary.main",
+          fontWeight: "fontWeightBold",
+          children: t('storage.spaces.connected')
+        })]
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Button, {
         onClick: onBackup,
         loading: isLoading,
         variant: "contained",
         color: "primary",
         "data-cy": "add-domain-alias",
         disabled: !endpoint || isLoading,
-        children: t('storage.didSpaces.backup')
-      })
+        children: t('storage.spaces.backup')
+      })]
+    }), isLoading && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
+      display: "flex",
+      flexDirection: "column",
+      justifyContent: "center",
+      textAlign: "center",
+      marginTop: "16px",
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
+        color: "primary",
+        children: progress === null || progress === void 0 ? void 0 : progress.message
+      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
+        sx: {
+          display: 'flex',
+          alignItems: 'center'
+        },
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
+          sx: {
+            width: '100%',
+            mr: 1
+          },
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.LinearProgress, {
+            color: "primary",
+            variant: "determinate",
+            value: progress === null || progress === void 0 ? void 0 : progress.progress
+          })
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
+          sx: {
+            minWidth: 35
+          },
+          children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Typography.default, {
+            variant: "body2",
+            color: "text.secondary",
+            children: [progress === null || progress === void 0 ? void 0 : progress.progress, "%"]
+          })
+        })]
+      })]
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Connect.default, {
       prefix: authorizeConnect.prefix,
       open: authorizeConnect.open,
@@ -264,6 +306,4 @@ function Storage() {
     })]
   });
 }
-const Container = (0, _styled.default)('div')(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  height: 100%;\n  overflow-y: auto;\n"])));
-const StorageUrlTextField = (0, _styled.default)(_material.TextField)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  height: 56px;\n  width: 580px;\n  ", " {\n    width: 75%;\n  }\n  input.MuiInputBase-input {\n    width: calc(100% - 144px);\n  }\n"])), props => props.theme.breakpoints.down('md'));
 Storage.propTypes = {};

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

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = FormTextInput;
-var _react = require("react");
+var _react = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _Box = _interopRequireDefault(require("@mui/material/Box"));
 var _TextField = _interopRequireDefault(require("@mui/material/TextField"));
@@ -13,11 +13,21 @@ var _EditIcon = _interopRequireDefault(require("@arcblock/icons/lib/EditIcon"));
 var _Close = _interopRequireDefault(require("@mui/icons-material/Close"));
 var _Done = _interopRequireDefault(require("@mui/icons-material/Done"));
 var _IconButton = _interopRequireDefault(require("@mui/material/IconButton"));
+var _Button = _interopRequireDefault(require("@mui/material/Button"));
+var _ButtonGroup = _interopRequireDefault(require("@mui/material/ButtonGroup"));
+var _ArrowDropDown = _interopRequireDefault(require("@mui/icons-material/ArrowDropDown"));
+var _ClickAwayListener = _interopRequireDefault(require("@mui/material/ClickAwayListener"));
+var _Paper = _interopRequireDefault(require("@mui/material/Paper"));
+var _Popper = _interopRequireDefault(require("@mui/material/Popper"));
+var _MenuItem = _interopRequireDefault(require("@mui/material/MenuItem"));
+var _MenuList = _interopRequireDefault(require("@mui/material/MenuList"));
 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", "formatterBeforeSubmit"];
+const _excluded = ["label", "disabled", "required", "initialValue", "onChange", "placeholder", "style", "onSubmit", "secure", "triggers", "formatterBeforeSubmit"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 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; }
 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; }
@@ -25,7 +35,91 @@ function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typ
 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); }
 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; }
 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; }
-function FormTextInput(_ref) {
+function InputTriggers(_ref) {
+  let {
+    triggers,
+    onEnterEdit,
+    disabled
+  } = _ref;
+  const anchorRef = _react.default.useRef(null);
+  const [open, setOpen] = _react.default.useState(false);
+  const handleTriggerClick = cb => {
+    setOpen(false);
+    cb();
+  };
+  const handleToggle = () => {
+    setOpen(prevOpen => !prevOpen);
+  };
+  const handleClose = event => {
+    if (anchorRef.current && anchorRef.current.contains(event.target)) {
+      return;
+    }
+    setOpen(false);
+  };
+  if (triggers.length === 0) {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_IconButton.default, {
+      "data-cy": "schema-form-item-edit",
+      onClick: onEnterEdit,
+      disabled: disabled,
+      size: "large",
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_EditIcon.default, {})
+    });
+  }
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_ButtonGroup.default, {
+      variant: "outlined",
+      ref: anchorRef,
+      "aria-label": "split button",
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.default, {
+        "data-cy": "schema-form-item-edit",
+        onClick: onEnterEdit,
+        disabled: disabled,
+        size: "large",
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_EditIcon.default, {})
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.default, {
+        size: "small",
+        "aria-controls": open ? 'split-button-menu' : undefined,
+        "aria-expanded": open ? 'true' : undefined,
+        onClick: handleToggle,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ArrowDropDown.default, {})
+      })]
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popper.default, {
+      sx: {
+        zIndex: 9999
+      },
+      open: open,
+      anchorEl: anchorRef.current,
+      role: undefined,
+      placement: "bottom-end",
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Paper.default, {
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ClickAwayListener.default, {
+          onClickAway: handleClose,
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_MenuList.default, {
+            id: "split-button-menu",
+            autoFocusItem: true,
+            children: triggers.map(x => /*#__PURE__*/(0, _jsxRuntime.jsx)(_MenuItem.default, {
+              onClick: () => handleTriggerClick(x.handler),
+              children: x.title
+            }, x.key))
+          })
+        })
+      })
+    })]
+  });
+}
+InputTriggers.propTypes = {
+  triggers: _propTypes.default.arrayOf(_propTypes.default.shape({
+    key: _propTypes.default.string.isRequired,
+    title: _propTypes.default.string.isRequired,
+    handler: _propTypes.default.func.isRequired
+  })),
+  onEnterEdit: _propTypes.default.func.isRequired,
+  disabled: _propTypes.default.bool.isRequired
+};
+InputTriggers.defaultProps = {
+  triggers: []
+};
+function FormTextInput(_ref2) {
   let {
       label,
       disabled,
@@ -36,9 +130,10 @@ function FormTextInput(_ref) {
       style,
       onSubmit,
       secure,
+      triggers,
       formatterBeforeSubmit
-    } = _ref,
-    rest = _objectWithoutProperties(_ref, _excluded);
+    } = _ref2,
+    rest = _objectWithoutProperties(_ref2, _excluded);
   const [editing, setEditing] = (0, _react.useState)(false);
   const [loading, setLoading] = (0, _react.useState)(false);
   const [defaultValue, setDefaultValue] = (0, _react.useState)(secure && initialValue === '__encrypted__' ? '' : initialValue);
@@ -133,12 +228,10 @@ function FormTextInput(_ref) {
               size: "large",
               children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Close.default, {})
             })]
-          }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_IconButton.default, {
-            "data-cy": "schema-form-item-edit",
-            onClick: () => setEditing(true),
-            disabled: disabled,
-            size: "large",
-            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_EditIcon.default, {})
+          }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(InputTriggers, {
+            triggers: triggers,
+            onEnterEdit: () => setEditing(true),
+            disabled: disabled
           })
         })]
       })]
@@ -155,6 +248,7 @@ FormTextInput.propTypes = {
   required: _propTypes.default.bool,
   disabled: _propTypes.default.bool,
   secure: _propTypes.default.bool,
+  triggers: _propTypes.default.array,
   formatterBeforeSubmit: _propTypes.default.func
 };
 FormTextInput.defaultProps = {
@@ -167,5 +261,6 @@ FormTextInput.defaultProps = {
   required: false,
   disabled: false,
   secure: false,
+  triggers: [],
   formatterBeforeSubmit: null
 };

package/lib/locales/en.js

@@ -297,6 +297,8 @@ module.exports = {
     upstreamPort: 'Upstream Port',
     noService: 'No Services',
     appId: 'App ID',
+    appPid: 'Permanent ID',
+    alsoKnownAs: 'Also Known As',
     reloadSuccess: 'Blocklet was reloaded successfully',
     statusTip: 'Blocklet is {status}',
     initialUptime: 'Less than 1m',
@@ -1188,12 +1190,14 @@ module.exports = {
     }
   },
   storage: {
-    didSpaces: {
+    spaces: {
       tips: 'Tips',
-      label: 'Please enter DID Spaces service address',
-      getSpacesAuthorizeSuccessfully: 'You have successfully obtained a Spaces license',
-      goToAuthorization: 'Go to Authorization',
-      reAuthorization: 'Re-authorization',
+      label: 'Enter DID Spaces Gateway',
+      connected: 'You have successfully connect to did-space gateway',
+      connect: 'Connect',
+      reconnect: 'Reconnect',
+      addressCannotEmpty: 'Address cannot be empty',
+      addressNotValid: '{url} is not a valid address',
       authorize: {
         title: 'Authorize {appName}',
         scan: 'Use your DID Wallet to scan the QR code below to authorize the app {appName} to access the space in spaces',

package/lib/locales/zh.js

@@ -303,6 +303,8 @@ module.exports = {
     upstreamPort: '上游端口',
     noService: '暂无服务',
     appId: '应用 ID',
+    appPid: '永久性 ID',
+    alsoKnownAs: '曾用 ID',
     reloadSuccess: 'Blocklet 重启成功',
     statusTip: 'Blocklet {status}',
     initialUptime: '少于1分钟',
@@ -1193,13 +1195,14 @@ module.exports = {
     }
   },
   storage: {
-    didSpaces: {
+    spaces: {
       tips: '提示',
       label: '请输入 DID Spaces 服务地址',
-      getSpacesAuthorizeSuccessfully: '你已成功获得 Spaces 授权',
-      goToAuthorization: '前往授权',
-      reAuthorization: '重新授权',
+      connected: '你已成功获得 Spaces 授权',
+      connect: '前往授权',
+      reconnect: '重新授权',
       addressCannotEmpty: '地址不能为空',
+      addressNotValid: '{url} 不是一个合法的地址',
       authorize: {
         title: '授权 {appName}',
         scan: '使用你的 DID Wallet 扫描下面的二维码以授权应用 {appName} 访问 Spaces 中的空间',

package/lib/util/index.js

@@ -26,7 +26,6 @@ exports.getBlockletServices = void 0;
 exports.getBlockletUrl = getBlockletUrl;
 exports.getBlockletUrlParams = void 0;
 exports.getBlockletUrls = getBlockletUrls;
-exports.getEndPoint = void 0;
 exports.getExplorerLink = getExplorerLink;
 exports.getPathPrefix = exports.getIssuePassportLink = exports.getInviteLink = void 0;
 exports.getRelativeTime = getRelativeTime;
@@ -377,30 +376,7 @@ const stringSortHandlerAsc = function stringSortHandlerAsc() {
   }
   return 0;
 };
-
-/**
- *
- * @param {ABTNode} nodeInfo
- * @returns {string} like http://localhost:3000, http://localhost:3000/admin
- */
 exports.stringSortHandlerAsc = stringSortHandlerAsc;
-const getEndPoint = nodeInfo => {
-  const {
-    routing
-  } = nodeInfo;
-  const {
-    protocol,
-    hostname,
-    origin,
-    port
-  } = window.location;
-  let endpoint = "".concat(origin).concat(routing.adminPath);
-  if (process.env.NODE_ENV === 'development') {
-    endpoint = "".concat(protocol, "//").concat(hostname, ":").concat(port);
-  }
-  return endpoint;
-};
-exports.getEndPoint = getEndPoint;
 const getInviteLink = _ref2 => {
   let {
     inviteId,

package/package.json

@@ -3,7 +3,7 @@
   "publishConfig": {
     "access": "public"
   },
-  "version": "1.8.67-beta-794a8082",
+  "version": "1.8.68-beta-500af7e5",
   "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.67-beta-794a8082",
-    "@abtnode/constant": "1.8.67-beta-794a8082",
-    "@abtnode/util": "1.8.67-beta-794a8082",
-    "@arcblock/did-connect": "^2.5.4",
+    "@abtnode/auth": "1.8.68-beta-500af7e5",
+    "@abtnode/constant": "1.8.68-beta-500af7e5",
+    "@abtnode/util": "1.8.68-beta-500af7e5",
+    "@arcblock/did-connect": "^2.5.5",
     "@arcblock/did-motif": "^1.1.10",
-    "@arcblock/icons": "^2.5.4",
-    "@arcblock/terminal": "^2.5.4",
-    "@arcblock/ux": "^2.5.4",
-    "@blocklet/constant": "1.8.67-beta-794a8082",
-    "@blocklet/launcher-layout": "^1.9.60",
+    "@arcblock/icons": "^2.5.5",
+    "@arcblock/terminal": "^2.5.5",
+    "@arcblock/ux": "^2.5.5",
+    "@blocklet/constant": "1.8.68-beta-500af7e5",
+    "@blocklet/launcher-layout": "^1.9.61",
     "@blocklet/list": "^0.11.4",
-    "@blocklet/meta": "1.8.67-beta-794a8082",
-    "@blocklet/ui-react": "^2.5.4",
+    "@blocklet/meta": "1.8.68-beta-500af7e5",
+    "@blocklet/ui-react": "^2.5.5",
     "@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": "f4ad32bea4d80b12971fb6bef941bdbe2af6a834"
+  "gitHead": "9070621373f317a10ff0d289323bf725e30d3521"
 }