@abtnode/ux 1.15.17 → 1.16.0-beta-b16cb035

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

@@ -0,0 +1,266 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = FormTextInput;
+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"));
+var _CircularProgress = _interopRequireDefault(require("@mui/material/CircularProgress"));
+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", "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; }
+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; }
+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,
+      required,
+      initialValue,
+      onChange,
+      placeholder,
+      style,
+      onSubmit,
+      secure,
+      triggers,
+      formatterBeforeSubmit
+    } = _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);
+  const [value, setValue] = (0, _react.useState)(defaultValue);
+  const handleSubmit = async () => {
+    setLoading(true);
+    try {
+      const shouldUpdate = await onSubmit(value);
+      if (shouldUpdate === false) {
+        setValue(defaultValue);
+      } else {
+        let tmpValue = value;
+        if (typeof formatterBeforeSubmit === 'function') {
+          tmpValue = formatterBeforeSubmit(value);
+        }
+        setValue(tmpValue);
+        setDefaultValue(tmpValue);
+      }
+    } catch (err) {
+      setValue(defaultValue);
+    } finally {
+      setLoading(false);
+      setEditing(false);
+    }
+  };
+  const onInputChange = changeValue => {
+    setValue(changeValue);
+    onChange(changeValue);
+  };
+
+  // enter keydown
+  const handleKeydown = e => {
+    if (e.key === 'Enter') {
+      handleSubmit();
+    }
+  };
+  const input = editing ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, _objectSpread({
+    style: {
+      flex: 1
+    },
+    fullWidth: true,
+    value: value,
+    onChange: e => {
+      onInputChange(e.target.value);
+    },
+    autoFocus: true,
+    size: "small",
+    variant: "outlined",
+    placeholder: placeholder,
+    onKeyDown: handleKeydown,
+    disabled: disabled,
+    type: secure ? 'password' : 'text'
+  }, rest)) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
+    px: 1,
+    className: "form-item-input slot",
+    style: {
+      whiteSpace: 'pre-wrap'
+    },
+    children: secure ? '******' : value
+  });
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_formWrapper.default, {
+    className: "form",
+    style: style,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
+      className: "form-item",
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
+        className: "form-item-label",
+        children: [label, required && /*#__PURE__*/(0, _jsxRuntime.jsx)(_required.default, {})]
+      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
+        className: "form-item-body",
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
+          className: "form-item-input",
+          children: input
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
+          className: "form-item-action",
+          children: editing ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_IconButton.default, {
+              "data-cy": "schema-form-item-confirm",
+              onClick: handleSubmit,
+              disabled: disabled || loading,
+              size: "large",
+              children: loading ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_CircularProgress.default, {
+                size: 24
+              }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_Done.default, {})
+            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_IconButton.default, {
+              "data-cy": "schema-form-item-cancel",
+              onClick: () => {
+                setValue(defaultValue);
+                setEditing(false);
+              },
+              disabled: disabled || loading,
+              size: "large",
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Close.default, {})
+            })]
+          }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(InputTriggers, {
+            triggers: triggers,
+            onEnterEdit: () => setEditing(true),
+            disabled: disabled
+          })
+        })]
+      })]
+    })
+  });
+}
+FormTextInput.propTypes = {
+  style: _propTypes.default.object,
+  onSubmit: _propTypes.default.func,
+  onChange: _propTypes.default.func,
+  label: _propTypes.default.string,
+  initialValue: _propTypes.default.string,
+  placeholder: _propTypes.default.string,
+  required: _propTypes.default.bool,
+  disabled: _propTypes.default.bool,
+  secure: _propTypes.default.bool,
+  triggers: _propTypes.default.array,
+  formatterBeforeSubmit: _propTypes.default.func
+};
+FormTextInput.defaultProps = {
+  style: {},
+  onSubmit: () => {},
+  onChange: () => {},
+  label: '',
+  initialValue: '',
+  placeholder: '',
+  required: false,
+  disabled: false,
+  secure: false,
+  triggers: [],
+  formatterBeforeSubmit: null
+};

package/lib/form/form-wrapper.js

@@ -0,0 +1,13 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _styled = _interopRequireDefault(require("@emotion/styled"));
+var _Box = _interopRequireDefault(require("@mui/material/Box"));
+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) } })); }
+var _default = (0, _styled.default)(_Box.default)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  width: 100%;\n  flex-grow: 1;\n  overflow-y: auto;\n  ", " {\n    width: 100%;\n    flex-shrink: 0;\n    padding: 0 24px;\n    transform: translate(0, 0);\n    /* max-height: 60vh; */\n  }\n\n  .form-item {\n    width: 100%;\n    margin-bottom: 24px;\n    position: relative;\n    ", " {\n      flex-wrap: wrap;\n      justify-content: space-between;\n      width: 100%;\n      flex-shrink: 0;\n    }\n  }\n\n  .form-item-body {\n    display: flex;\n    align-items: center;\n    width: 100%;\n    margin-top: 4px;\n  }\n\n  .form-item-label {\n    line-height: 1.2;\n    font-size: 14px;\n    color: #888;\n    font-weight: bold;\n\n    ", " {\n      text-align: left;\n      width: auto;\n      flex-grow: 1;\n    }\n  }\n\n  .form-item-input {\n    flex-grow: 1;\n    overflow: hidden;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n\n    &.slot {\n      height: 40px;\n      line-height: 40px;\n      background: #f8f8f8;\n      font-size: 16px;\n    }\n  }\n\n  .form-item-action {\n    // width: 100px;\n    text-align: left;\n    margin-left: 12px;\n    flex-shrink: 0;\n    ", " {\n      width: auto;\n      margin-left: 0px;\n    }\n    .MuiIconButton-root {\n      padding: 8px;\n      svg {\n        fill: #888;\n      }\n      &.Mui-disabled {\n        opacity: 0.4;\n      }\n    }\n  }\n"])), props => props.theme.breakpoints.down('md'), props => props.theme.breakpoints.down('md'), props => props.theme.breakpoints.down('md'), props => props.theme.breakpoints.down('md'));
+exports.default = _default;

package/lib/form/required.js

@@ -0,0 +1,13 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _styled = _interopRequireDefault(require("@emotion/styled"));
+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) } })); }
+const Required = _styled.default.span(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  color: ", ";\n  &::before {\n    content: '*';\n  }\n"])), props => props.theme.palette.error.main);
+var _default = Required;
+exports.default = _default;

package/lib/hooks/blocklet.js

@@ -0,0 +1,231 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useBlocklet = useBlocklet;
+var _react = require("react");
+var _merge = _interopRequireDefault(require("lodash/merge"));
+var _omit = _interopRequireDefault(require("lodash/omit"));
+var _constant = require("@blocklet/constant");
+var _toast = _interopRequireDefault(require("../toast"));
+var _util = require("../util");
+var _util2 = require("../blocklet/util");
+var _urlEvaluation = require("./url-evaluation");
+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; }
+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); }
+// eslint-disable-next-line import/prefer-default-export
+function useBlocklet(_ref) {
+  var _blocklet$site, _blocklet$site$domain, _blocklet$meta, _blocklet$meta2, _blocklet$meta3, _blocklet$meta4, _blocklet$meta5, _blocklet$meta6, _blocklet$meta7, _blocklet$meta8, _blocklet$meta9;
+  let {
+    did,
+    client,
+    useSubscription,
+    getIP,
+    useLocaleContext,
+    disableSubscription
+  } = _ref;
+  const {
+    t,
+    locale
+  } = useLocaleContext();
+  const [error, setError] = (0, _react.useState)(null);
+  const [loading, setLoading] = (0, _react.useState)(false);
+  const [loadingRuntimeInfo, setLoadingRuntimeInfo] = (0, _react.useState)(false);
+  const [blocklet, setBlocklet] = (0, _react.useState)();
+  const [runtimeHistory, setRuntimeHistory] = (0, _react.useState)({
+    cpu: [],
+    memory: []
+  });
+  const [domainStatus, setDomainStatus] = (0, _react.useState)({});
+  const domainListStr = blocklet !== null && blocklet !== void 0 && (_blocklet$site = blocklet.site) !== null && _blocklet$site !== void 0 && (_blocklet$site$domain = _blocklet$site.domainAliases) !== null && _blocklet$site$domain !== void 0 && _blocklet$site$domain.length ? JSON.stringify(blocklet.site.domainAliases.map(x => x.value)) : '';
+  const domains = (0, _react.useMemo)(() => {
+    var _blocklet$site2;
+    return ((blocklet === null || blocklet === void 0 ? void 0 : (_blocklet$site2 = blocklet.site) === null || _blocklet$site2 === void 0 ? void 0 : _blocklet$site2.domainAliases) || []).map(x => x.value);
+  }, [domainListStr]); // eslint-disable-line
+
+  const {
+    domainsAccessibility,
+    recommendedDomain
+  } = (0, _urlEvaluation.useDomainsAccessibility)(domains);
+  const refreshRuntimeInfo = async () => {
+    setLoadingRuntimeInfo(true);
+    try {
+      const {
+        blocklet: data
+      } = await client.getBlocklet({
+        input: {
+          did,
+          attachRuntimeInfo: true
+        }
+      });
+      await (0, _util2.fixBlocklet)(data, {
+        getIP
+      });
+      setBlocklet(data);
+    } catch (err) {
+      _toast.default.error(err.message);
+    } finally {
+      setLoadingRuntimeInfo(false);
+    }
+  };
+  const getRuntimeHistory = async () => {
+    try {
+      const data = await client.getBlockletRuntimeHistory({
+        input: {
+          did,
+          hours: 6
+        }
+      });
+      if (data) {
+        setRuntimeHistory({
+          cpu: data.history.map(x => ({
+            date: x.date,
+            value: x.cpu
+          })),
+          memory: data.history.map(x => ({
+            date: x.date,
+            value: x.mem
+          }))
+        });
+      }
+    } catch (err) {
+      _toast.default.error(err.message);
+    }
+  };
+  const refreshBlocklet = async function refreshBlocklet() {
+    let {
+      showError = true,
+      attachRuntimeInfo = true
+    } = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    if (loading) {
+      return;
+    }
+    try {
+      setLoading(true);
+      setError(null);
+      const {
+        blocklet: data
+      } = await client.getBlocklet({
+        input: {
+          did,
+          attachRuntimeInfo: false
+        }
+      });
+      if (data) {
+        setBlocklet(oldBlocklet => {
+          (0, _util2.fixBlocklet)(data, {
+            fixRuntime: 'merge-old',
+            oldBlocklet
+          });
+          return data;
+        });
+        setLoading(false);
+        if (attachRuntimeInfo) {
+          refreshRuntimeInfo();
+          getRuntimeHistory();
+        }
+      } else {
+        throw new Error(t('blocklet.notFound'));
+      }
+    } catch (err) {
+      setLoading(false);
+      setError(err);
+      if (showError) {
+        _toast.default.error(err.message);
+      }
+    }
+  };
+  const handleRefresh = data => {
+    var _data$meta;
+    if ((data === null || data === void 0 ? void 0 : (_data$meta = data.meta) === null || _data$meta === void 0 ? void 0 : _data$meta.did) === blocklet.meta.did) {
+      refreshBlocklet({
+        showError: false
+      });
+    }
+  };
+  const handleRefreshWithoutRuntime = data => {
+    var _data$meta2;
+    if ((data === null || data === void 0 ? void 0 : (_data$meta2 = data.meta) === null || _data$meta2 === void 0 ? void 0 : _data$meta2.did) === blocklet.meta.did) {
+      refreshBlocklet({
+        attachRuntimeInfo: false,
+        showError: false
+      });
+    }
+  };
+  const refreshDomainStatus = () => {
+    if (did && domainListStr) {
+      client.checkDomains({
+        input: {
+          did
+        }
+      }).catch(err => {
+        console.error(err);
+      });
+    }
+  };
+  const configNavigations = async value => {
+    const {
+      blocklet: data
+    } = await client.configNavigations({
+      input: {
+        did,
+        navigations: value
+      }
+    });
+    setBlocklet(data);
+  };
+  (0, _react.useEffect)(() => {
+    if (domainListStr && !disableSubscription) {
+      refreshDomainStatus();
+    }
+  }, [domainListStr, disableSubscription]); // eslint-disable-line
+
+  useSubscription(_constant.BlockletEvents.domainStatus, data => {
+    setDomainStatus(pre => _objectSpread(_objectSpread({}, pre), {}, {
+      [data.domain]: _objectSpread(_objectSpread({}, pre[data.domain]), data)
+    }));
+  }, [blocklet === null || blocklet === void 0 ? void 0 : (_blocklet$meta = blocklet.meta) === null || _blocklet$meta === void 0 ? void 0 : _blocklet$meta.did, !disableSubscription]);
+  useSubscription(_constant.BlockletEvents.statusChange, handleRefreshWithoutRuntime, [blocklet === null || blocklet === void 0 ? void 0 : (_blocklet$meta2 = blocklet.meta) === null || _blocklet$meta2 === void 0 ? void 0 : _blocklet$meta2.did, !disableSubscription]); // eslint-disable-line prettier/prettier
+  useSubscription(_constant.BlockletEvents.storeChange, handleRefreshWithoutRuntime, [blocklet === null || blocklet === void 0 ? void 0 : (_blocklet$meta3 = blocklet.meta) === null || _blocklet$meta3 === void 0 ? void 0 : _blocklet$meta3.did, !disableSubscription]);
+  useSubscription(_constant.BlockletEvents.started, handleRefresh, [blocklet === null || blocklet === void 0 ? void 0 : (_blocklet$meta4 = blocklet.meta) === null || _blocklet$meta4 === void 0 ? void 0 : _blocklet$meta4.did, !disableSubscription]);
+  useSubscription(_constant.BlockletEvents.startFailed, handleRefresh, [blocklet === null || blocklet === void 0 ? void 0 : (_blocklet$meta5 = blocklet.meta) === null || _blocklet$meta5 === void 0 ? void 0 : _blocklet$meta5.did, !disableSubscription]);
+  useSubscription(_constant.BlockletEvents.installed, handleRefresh, [blocklet === null || blocklet === void 0 ? void 0 : (_blocklet$meta6 = blocklet.meta) === null || _blocklet$meta6 === void 0 ? void 0 : _blocklet$meta6.did, !disableSubscription]);
+  useSubscription(_constant.BlockletEvents.upgraded, handleRefresh, [blocklet === null || blocklet === void 0 ? void 0 : (_blocklet$meta7 = blocklet.meta) === null || _blocklet$meta7 === void 0 ? void 0 : _blocklet$meta7.did, !disableSubscription]);
+  useSubscription(_constant.BlockletEvents.downgraded, handleRefresh, [blocklet === null || blocklet === void 0 ? void 0 : (_blocklet$meta8 = blocklet.meta) === null || _blocklet$meta8 === void 0 ? void 0 : _blocklet$meta8.did, !disableSubscription]);
+  useSubscription(_constant.BlockletEvents.updated, handleRefresh, [blocklet === null || blocklet === void 0 ? void 0 : (_blocklet$meta9 = blocklet.meta) === null || _blocklet$meta9 === void 0 ? void 0 : _blocklet$meta9.did, !disableSubscription]);
+  const data = blocklet ? (0, _merge.default)(blocklet, {
+    site: {
+      domainAliases: blocklet.site.domainAliases.map(x => {
+        const domain = x.value;
+        const key = (0, _util.toSlotDomain)(domain);
+        x.domainStatus = (0, _omit.default)(domainStatus[key], ['domain', 'meta']);
+        x.accessibility = (0, _omit.default)(domainsAccessibility[domain], ['domain']);
+        x.href = (0, _util.getBlockletUrl)({
+          blocklet,
+          domain: x,
+          params: (0, _util.getBlockletUrlParams)(blocklet, locale)
+        });
+        return x;
+      })
+    }
+  }) : null;
+  return {
+    loading,
+    loadingRuntimeInfo,
+    error,
+    blocklet: data,
+    runtimeHistory,
+    recommendedDomain: recommendedDomain || '',
+    actions: {
+      refreshBlocklet,
+      refreshDomainStatus,
+      setBlocklet,
+      configNavigations
+    }
+  };
+}

package/lib/hooks/mobile-width.js

@@ -0,0 +1,19 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _styles = require("@mui/styles");
+var _useMediaQuery = _interopRequireDefault(require("@mui/material/useMediaQuery"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function useMobileWidth() {
+  const theme = (0, _styles.useTheme)();
+  const isBreakpointsDownSm = (0, _useMediaQuery.default)(theme.breakpoints.down('md'));
+  const minWidth = isBreakpointsDownSm ? 300 : theme.breakpoints.values.sm;
+  return {
+    minWidth
+  };
+}
+var _default = useMobileWidth;
+exports.default = _default;