@abtnode/ux 1.16.26-beta-351de484 → 1.16.26-beta-63f52a83

package/lib/blocklet/component/component-info-dialog.js

@@ -0,0 +1,253 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.StyledComponentRow = exports.StyledBadge = void 0;
+exports.default = ComponentInfoDialog;
+var _context = require("@arcblock/ux/lib/Locale/context");
+var _react = require("react");
+var _styled = _interopRequireDefault(require("@emotion/styled"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _Badge = _interopRequireDefault(require("@mui/material/Badge"));
+var _Dialog = _interopRequireDefault(require("@mui/material/Dialog"));
+var _DialogContent = _interopRequireDefault(require("@mui/material/DialogContent"));
+var _DialogTitle = _interopRequireDefault(require("@mui/material/DialogTitle"));
+var _InfoRow = _interopRequireDefault(require("@arcblock/ux/lib/InfoRow"));
+var _Box = _interopRequireDefault(require("@mui/material/Box"));
+var _util = require("@blocklet/meta/lib/util");
+var _deletingBlocklets = require("../../contexts/deleting-blocklets");
+var _tag = _interopRequireDefault(require("../../tag"));
+var _util2 = require("../../util");
+var _didAddress = _interopRequireDefault(require("../../did-address"));
+var _blockletSource = _interopRequireDefault(require("../blocklet-source"));
+var _status = _interopRequireDefault(require("../status"));
+var _version = _interopRequireDefault(require("../version"));
+var _jsxRuntime = require("react/jsx-runtime");
+var _templateObject, _templateObject2;
+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 isResource = component => {
+  var _component$meta;
+  return !(component !== null && component !== void 0 && (_component$meta = component.meta) !== null && _component$meta !== void 0 && _component$meta.group);
+};
+const getEngineRows = (engine, t) => {
+  if (!engine) {
+    return [];
+  }
+  return [{
+    name: t('common.name'),
+    value: engine.displayName
+  }, {
+    name: t('common.description'),
+    value: engine.description
+  }, {
+    name: t('common.version'),
+    value: /*#__PURE__*/(0, _jsxRuntime.jsx)(_tag.default, {
+      children: engine.version
+    })
+  }];
+};
+const getSourceInfo = blocklet => {
+  const {
+    source,
+    deployedFrom,
+    bundleSource
+  } = blocklet;
+  if (source) {
+    return {
+      source,
+      deployedFrom
+    };
+  }
+  if (!bundleSource) {
+    return {
+      source: 'upload',
+      deployedFrom
+    };
+  }
+  if (bundleSource.url) {
+    return {
+      source: 'url',
+      deployedFrom: deployedFrom || Array.isArray(bundleSource.url) ? bundleSource.url[0] : bundleSource.url
+    };
+  }
+  if (bundleSource.store) {
+    return {
+      source: 'registry',
+      deployedFrom: deployedFrom || Array.isArray(bundleSource.store) ? bundleSource.store[0] : bundleSource.store
+    };
+  }
+  return {};
+};
+const getComponentName = (componentId, app) => {
+  const ids = componentId.split('/').slice(1);
+  let parent = app;
+  let index = 0;
+  const names = [];
+  while (parent && index < ids.length) {
+    // eslint-disable-next-line no-loop-func
+    const component = parent.children.find(x => x.meta.did === ids[index]);
+    parent = component;
+    index++;
+    if (component) {
+      names.push(component.meta.title);
+    }
+  }
+  return names.join(' / ');
+};
+function ComponentInfoDialog(_ref) {
+  var _blocklet$dependents, _blocklet$meta$resour;
+  let {
+    blocklet,
+    depth,
+    componentInfo,
+    app,
+    onClose: _onClose
+  } = _ref;
+  const {
+    t,
+    locale
+  } = (0, _react.useContext)(_context.LocaleContext);
+  const {
+    deletingBlocklets: deletingComponents
+  } = (0, _deletingBlocklets.useDeletingBlockletContext)();
+  let {
+    status
+  } = blocklet;
+  if (depth === 1 && deletingComponents.includes(blocklet.meta.did)) {
+    status = 'deleting';
+  }
+  const mountPoint = "/".concat(blocklet.mountPoint || '/').replace(/\/+/g, '/');
+  const renderRows = rows => rows.map(row => {
+    if (row.name === t('common.did') || row.name === t('blocklet.appId')) {
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_InfoRow.default, {
+        valueComponent: "div",
+        nameWidth: 120,
+        name: row.name,
+        nameFormatter: () => row.name,
+        children: row.value
+      }, row.name);
+    }
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_InfoRow.default, {
+      valueComponent: "div",
+      nameWidth: 120,
+      name: row.name,
+      children: row.value
+    }, row.name);
+  });
+  const sourceInfo = componentInfo ? getSourceInfo(componentInfo) : {};
+  const componentRows = componentInfo ? [{
+    name: t('common.name'),
+    value: (0, _util.getDisplayName)(componentInfo, true)
+  }, {
+    name: t('common.version'),
+    value: /*#__PURE__*/(0, _jsxRuntime.jsx)(_version.default, {
+      blocklet: componentInfo,
+      checkUpgrade: false
+    })
+  }, {
+    name: t('common.status'),
+    value: /*#__PURE__*/(0, _jsxRuntime.jsx)(_status.default, {
+      isResource: isResource(blocklet),
+      status: status,
+      source: componentInfo.source,
+      progress: blocklet.progress
+    })
+  }, blocklet.status === 'running' ? {
+    name: t('blocklet.startedAt'),
+    value: (0, _util2.formatToDatetime)(blocklet.startedAt, locale)
+  } : null, blocklet.status !== 'running' ? {
+    name: t('blocklet.stoppedAt'),
+    value: (0, _util2.formatToDatetime)(blocklet.stoppedAt, locale)
+  } : null, blocklet.installedAt ? {
+    name: t('blocklet.installedAt'),
+    value: (0, _util2.formatToDatetime)(blocklet.installedAt, locale)
+  } : null, (0, _util.hasStartEngine)(blocklet.meta) ? {
+    name: t('common.mountPoint'),
+    value: mountPoint
+  } : null, componentInfo.meta.group ? {
+    name: t('common.group'),
+    value: /*#__PURE__*/(0, _jsxRuntime.jsx)(_tag.default, {
+      type: "success",
+      children: componentInfo.meta.group
+    })
+  } : null, {
+    name: t('blocklet.overview.source'),
+    value: /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockletSource.default, {
+      sourceInfo: sourceInfo,
+      blocklet: blocklet
+    })
+  }, {
+    name: t('blocklet.overview.deployedFrom'),
+    value: sourceInfo.deployedFrom || '-'
+  }, {
+    name: t('common.did'),
+    value: /*#__PURE__*/(0, _jsxRuntime.jsx)(_didAddress.default, {
+      did: componentInfo.meta.did,
+      showQrcode: true
+    })
+  }, {
+    name: t('common.author'),
+    value: (0, _util2.formatPerson)(componentInfo.meta.author)
+  }, {
+    name: t('common.engine'),
+    value: getEngineRows(componentInfo.engine, t).map(_ref2 => {
+      let {
+        name,
+        value
+      } = _ref2;
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_InfoRow.default, {
+        style: {
+          marginBottom: 4
+        },
+        nameWidth: 120,
+        name: name,
+        children: value
+      }, name);
+    })
+  }, (_blocklet$dependents = blocklet.dependents) !== null && _blocklet$dependents !== void 0 && _blocklet$dependents.length ? {
+    name: t('common.dependents'),
+    value: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
+      children: blocklet.dependents.map(x => /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
+        children: "".concat(getComponentName(x.id, app), " ").concat(x.required ? "(".concat(t('common.required'), ")") : '')
+      }, x.id))
+    })
+  } : null, (_blocklet$meta$resour = blocklet.meta.resources) !== null && _blocklet$meta$resour !== void 0 && _blocklet$meta$resour.length ? {
+    name: t('common.resource'),
+    value: blocklet.meta.resources.join(', ')
+  } : null].filter(Boolean) : [];
+  if (!componentInfo) {
+    return null;
+  }
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Dialog.default, {
+    open: true,
+    fullWidth: true,
+    maxWidth: "md",
+    onClose: () => {
+      _onClose(null);
+    },
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
+      paddingY: 1.5,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_DialogTitle.default, {
+        children: t('common.componentBasicInfo')
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_DialogContent.default, {
+        children: renderRows(componentRows)
+      })]
+    }, "dialog-wrapper")
+  }, "base-info-dialog");
+}
+ComponentInfoDialog.propTypes = {
+  blocklet: _propTypes.default.object.isRequired,
+  depth: _propTypes.default.number,
+  app: _propTypes.default.object,
+  componentInfo: _propTypes.default.object,
+  onClose: _propTypes.default.func.isRequired
+};
+ComponentInfoDialog.defaultProps = {
+  depth: 0,
+  app: null,
+  componentInfo: null
+};
+const StyledBadge = exports.StyledBadge = (0, _styled.default)(_Badge.default)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  .BaseBadge-badge {\n    top: ", "px;\n    right: ", "px;\n  }\n"])), props => props.top * 8 || 6, props => props.right * 8 || 6);
+const StyledComponentRow = exports.StyledComponentRow = (0, _styled.default)(_Box.default)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  .component-header {\n    display: flex;\n    align-items: center;\n    align-items: flex-end;\n    cursor: pointer;\n  }\n  .component-name {\n    color: #222;\n    font-size: 16px;\n  }\n  .component-version {\n    color: #999;\n    font-size: 12px;\n    margin-left: 4px;\n    transform: translateY(-1px);\n  }\n"])));

package/lib/blocklet/component/index.js

@@ -396,18 +396,20 @@ function BlockletComponent(_ref) {
           onReload: reloadComponent,
           onRestart: restartComponent,
           getComponentUrl: getComponentUrl
-        }, "0-".concat(blocklet.meta.did)), blocklet.children.map(component => /*#__PURE__*/(0, _jsxRuntime.jsx)(_componentCell.default, {
-          depth: 1,
-          blocklet: component,
-          ancestors: [blocklet],
-          app: blocklet,
-          onRemove: removeComponent,
-          onStart: startComponent,
-          onStop: stopComponent,
-          onReload: reloadComponent,
-          onRestart: restartComponent,
-          getComponentUrl: getComponentUrl
-        }, "1-".concat(component.meta.did)))]
+        }, "0-".concat(blocklet.meta.did)), blocklet.children.map(component => {
+          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_componentCell.default, {
+            depth: 1,
+            blocklet: component,
+            ancestors: [blocklet],
+            app: blocklet,
+            onRemove: removeComponent,
+            onStart: startComponent,
+            onStop: stopComponent,
+            onReload: reloadComponent,
+            onRestart: restartComponent,
+            getComponentUrl: getComponentUrl
+          }, "1-".concat(component.meta.did));
+        })]
       }, "top-blocklet-".concat(blocklet.meta.did)), (_blocklet$optionalCom = blocklet.optionalComponents) === null || _blocklet$optionalCom === void 0 ? void 0 : _blocklet$optionalCom.map(component => /*#__PURE__*/(0, _jsxRuntime.jsx)(_componentCell.StyledComponentRow, {
         children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_optionalComponentCell.default, _objectSpread({
           setInstallComponentMeta: setInstallComponentMeta

package/lib/blocklet/component/store-blocklet-list.js

@@ -176,6 +176,7 @@ function BlockletList(_ref3) {
   const endpoint = storeUrl;
   (0, _react.useEffect)(() => {
     setFilters({
+      showResources: true,
       resourceType,
       resourceDid
     });
@@ -183,6 +184,7 @@ function BlockletList(_ref3) {
   (0, _react.useEffect)(() => {
     setInitialized(true);
     setFilters({
+      showResources: true,
       resourceType,
       resourceDid
     });
@@ -193,6 +195,7 @@ function BlockletList(_ref3) {
     resetKeys: [endpoint],
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", _objectSpread(_objectSpread({}, rest), {}, {
       children: initialized && /*#__PURE__*/(0, _jsxRuntime.jsx)(_list.default, {
+        showResourcesSwitch: true,
         blockletRender: blockletRenderProps => {
           const defaultProps = _objectSpread(_objectSpread({}, blockletRenderProps), {}, {
             handleButtonClick,

package/lib/blocklet/publish/connect-store-list.js

@@ -7,6 +7,10 @@ exports.default = void 0;
 var _react = require("react");
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _material = require("@mui/material");
+var _Alert = _interopRequireDefault(require("@arcblock/ux/lib/Alert"));
+var _context = require("@arcblock/ux/lib/Locale/context");
+var _Launch = _interopRequireDefault(require("@mui/icons-material/Launch"));
+var _colors = require("@mui/material/colors");
 var _add = _interopRequireDefault(require("../../store/add"));
 var _item = _interopRequireDefault(require("../../store/item"));
 var _jsxRuntime = require("react/jsx-runtime");
@@ -21,8 +25,12 @@ function ConnectStoreList(_ref) {
     releaseType,
     publishedStoreIds,
     onPublish,
-    onDelete
+    onDelete,
+    projectType
   } = _ref;
+  const {
+    t
+  } = (0, _context.useLocaleContext)();
   const storeList = (blocklet === null || blocklet === void 0 || (_blocklet$settings = blocklet.settings) === null || _blocklet$settings === void 0 ? void 0 : _blocklet$settings.storeList) || [];
   const connectedMap = (0, _react.useMemo)(() => {
     if (!(connectedStores !== null && connectedStores !== void 0 && connectedStores.length)) {
@@ -52,7 +60,26 @@ function ConnectStoreList(_ref) {
           onDelete: onDelete
         })
       })
-    }, x.url)), /*#__PURE__*/(0, _jsxRuntime.jsx)(_add.default, {
+    }, x.url)), !!(storeList !== null && storeList !== void 0 && storeList.length) && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Alert.default, {
+      type: "info",
+      style: {
+        width: '100%'
+      },
+      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
+        color: _colors.blueGrey[400],
+        component: "a",
+        href: projectType === 'pack' ? 'https://www.arcblock.io/docs/blocklet-developer/en/5PXToZve-5IXAN1bc8rkpxAc' : 'https://www.arcblock.io/docs/blocklet-developer/en/hB5VWLfg9VnbWsL1JGLuLUfW',
+        target: "_blank",
+        display: "flex",
+        alignItems: "center",
+        rel: "noreferrer",
+        children: [projectType === 'pack' ? t('blocklet.publish.whyCantSeeInStore') : t('blocklet.publish.whyCantSeeResourceBlockletInStore'), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Launch.default, {
+          sx: {
+            marginLeft: 1
+          }
+        })]
+      })
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_add.default, {
       onAdd: handleAddStore,
       teamDid: did,
       storeList: storeList
@@ -67,9 +94,11 @@ ConnectStoreList.propTypes = {
   onPublish: _propTypes.default.func,
   onDelete: _propTypes.default.func,
   publishedStoreIds: _propTypes.default.arrayOf(_propTypes.default.string),
-  connectedStores: _propTypes.default.arrayOf(_propTypes.default.object).isRequired
+  connectedStores: _propTypes.default.arrayOf(_propTypes.default.object).isRequired,
+  projectType: _propTypes.default.string
 };
 ConnectStoreList.defaultProps = {
+  projectType: '',
   publishedStoreIds: [],
   onPublish: () => {},
   onDelete: () => {}

package/lib/blocklet/publish/create-release.js

@@ -222,7 +222,7 @@ function CreateRelease(_ref2) {
       const data = res.project || {};
       if (!data.blockletVersion) {
         data.blockletVersion = '1.0.0';
-      } else if (_semver.default.valid(data.blockletVersion)) {
+      } else if (mode === 'create' && _semver.default.valid(data.blockletVersion)) {
         data.blockletVersion = _semver.default.inc(data.blockletVersion, 'patch');
       }
       const theParams = pickParams(data, blocklet);
@@ -960,12 +960,17 @@ function CreateRelease(_ref2) {
             onChange: handleChangeSelectedComponents
           })
         })]
-      }), projectType === 'pack' && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Alert.default, {
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Alert.default, {
         type: "info",
         style: {
           width: '100%'
         },
-        children: t('blocklet.publish.packTip')
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
+          display: "flex",
+          alignItems: "center",
+          rel: "noreferrer",
+          children: projectType === 'pack' ? t('blocklet.publish.packTip') : t('blocklet.publish.resourceTip')
+        })
       })]
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Dialog2.default, {
       title: t('common.connectToStore'),
@@ -975,6 +980,7 @@ function CreateRelease(_ref2) {
       open: showStoreDialog,
       onClose: () => setShowStoreDialog(false),
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_connectStoreList.default, {
+        projectType: projectType,
         blocklet: blocklet,
         releaseType: ((_params$blockletCompo3 = params.blockletComponents) === null || _params$blockletCompo3 === void 0 ? void 0 : _params$blockletCompo3.length) > 0 ? 'pack' : 'resource',
         projectId: projectId,
@@ -987,7 +993,6 @@ function CreateRelease(_ref2) {
     })]
   }));
 }
-CreateRelease.propTypes = {};
 CreateRelease.defaultProps = {};
 const Main = _styled.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  .sticky-header {\n    margin-top: -12px;\n    padding: 12px 0;\n    position: sticky;\n    top: 0;\n    z-index: 99;\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    background-color: #fff;\n    padding-bottom: 12px;\n    border-bottom: ", ";\n  }\n  .screenshot {\n    margin-bottom: 16px;\n    max-width: 200px;\n    max-height: 140px;\n    width: 200px;\n    height: 140px;\n    overflow: hidden;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    background-color: #eee;\n    margin-right: 16px;\n    position: relative;\n    .action {\n      visibility: hidden;\n      position: absolute;\n      top: 0px;\n      right: 0px;\n      background-color: rgba(0, 0, 0, 0.2);\n      color: rgba(255, 255, 255, 0.8);\n    }\n    &:hover .action {\n      visibility: visible;\n    }\n  }\n  .screenshot img {\n    width: 100%; /* \u56FE\u50CF\u5BBD\u5EA6\u586B\u5145\u5BB9\u5668 */\n    height: auto; /* \u56FE\u50CF\u9AD8\u5EA6\u81EA\u9002\u5E94 */\n  }\n  .section {\n    max-width: 800px;\n    &.full-width {\n      max-width: 100%;\n    }\n    .MuiTypography-h3 {\n      font-size: 1.1rem;\n      font-weight: 700;\n    }\n    .left {\n      flex-shrink: 0;\n      width: 140px;\n    }\n    .MuiTabs-indicator {\n      display: none;\n    }\n    .MuiTypography-subtitle1 {\n      width: 120px;\n      font-weight: 700;\n      font-size: 1rem;\n      ", " {\n        width: 80px;\n      }\n    }\n  }\n  .MuiButtonBase-root {\n    a {\n      color: inherit;\n    }\n  }\n  .MuiInputBase-multiline .MuiInputAdornment-positionEnd {\n    align-self: flex-end;\n    .MuiTypography-root {\n      font-size: 0.8rem;\n    }\n    font-size: 0.8rem;\n  }\n"])), _ref3 => {
   let {

package/lib/blocklet/status.js

@@ -13,7 +13,7 @@ var _util = require("@blocklet/meta/lib/util");
 var _dot = _interopRequireDefault(require("../dot"));
 var _tag = _interopRequireDefault(require("../tag"));
 var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["status", "variant", "source", "progress"];
+const _excluded = ["isResource", "status", "variant", "source", "progress"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -28,6 +28,7 @@ const colors = {
 };
 function BlockletStatus(_ref) {
   let {
+      isResource,
       status,
       variant,
       source,
@@ -53,7 +54,8 @@ function BlockletStatus(_ref) {
     upgrading: 'warning',
     restarting: 'warning',
     corrupted: 'error',
-    deleting: 'warning'
+    deleting: 'warning',
+    resource: 'primary'
   };
   const colorMap = {
     added: colors.grey,
@@ -71,22 +73,24 @@ function BlockletStatus(_ref) {
     upgrading: colors.yellow,
     restarting: colors.yellow,
     corrupted: 'error',
-    deleting: colors.yellow
+    deleting: colors.yellow,
+    resource: 'primary'
   };
   const inProgress = (0, _util.isInProgress)(status);
-  const statusTxt = t("blocklet.status.".concat(status));
+  const statusType = isResource && status === 'stopped' ? 'resource' : status;
+  const statusTxt = t("blocklet.status.".concat(statusType));
   if (variant === 'dot') {
     return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Tooltip.default, {
       title: t('blocklet.statusTip', {
         status: statusTxt
       }),
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_dot.default, _objectSpread({
-        color: colorMap[status]
+        color: colorMap[statusType]
       }, rest))
     });
   }
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_tag.default, _objectSpread(_objectSpread({
-    type: map[status]
+    type: map[statusType]
   }, rest), {}, {
     children: [inProgress && /*#__PURE__*/(0, _jsxRuntime.jsx)(_CircularProgress.default, {
       size: 12,
@@ -94,7 +98,7 @@ function BlockletStatus(_ref) {
       style: {
         marginRight: 5
       }
-    }), statusTxt, status === 'downloading' && progress ? /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    }), statusTxt, statusType === 'downloading' && progress ? /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       style: {
         marginLeft: 5
       },
@@ -106,9 +110,11 @@ BlockletStatus.propTypes = {
   status: _propTypes.default.string.isRequired,
   variant: _propTypes.default.oneOf(['dot', 'tag']),
   source: _propTypes.default.string,
-  progress: _propTypes.default.number
+  progress: _propTypes.default.number,
+  isResource: _propTypes.default.bool
 };
 BlockletStatus.defaultProps = {
+  isResource: false,
   variant: 'tag',
   source: '',
   progress: 0

package/lib/locales/ar.js

@@ -555,7 +555,8 @@ var _default = exports.default = {
       corrupted: 'فاسد',
       purchasing: 'في انتظار الشراء',
       purchased: 'مشترى',
-      verifying: 'التحقق من الشراء'
+      verifying: 'التحقق من الشراء',
+      resource: 'مورد'
     },
     list: {
       download: 'تحميل',
@@ -718,7 +719,10 @@ var _default = exports.default = {
         tip2: 'لن تكون قادرًا بعد الآن على نشر إصدارات جديدة للبلوكليت المحذوف ، مما يعني أن البلوكليت لن يتم تحديثه في المتجر بعد الآن.',
         tip3: 'سيؤدي حذف البلوكليت إلى ضرورة نشر الإصدار الحالي منه في المتجر.',
         description: 'بعد حذف البلوكليت، ستواجه المشكلات التالية، هل أنت متأكد أنك تريد حذفه؟'
-      }
+      },
+      resourceTip: 'حاليًا ، كما هو الحال بوصفه كتلة مورد ، لا يمكن تثبيته مباشرة من المتجر.',
+      whyCantSeeInStore: 'لماذا لا أستطيع رؤية هذا البلوكليت في المتجر؟',
+      whyCantSeeResourceBlockletInStore: 'لماذا لا يمكنني رؤية بلوكليت الموارد هذا في المتجر؟'
     },
     titleValidationError: 'يجب أن يكون طول العنوان على الأقل 3 أحرف',
     descriptionValidationError: 'يجب أن تكون طول الوصف بين 3 و 160 حرفًا'
@@ -1694,8 +1698,9 @@ var _default = exports.default = {
       domain: 'مجال',
       domainDescription: 'مطلوب نطاق Auth0',
       clientId: 'معرف العميل',
-      clientIdDescribe: 'مطلوب معرف عميل Auth0',
-      clientSecret: 'سر العميل'
+      clientIdDescription: 'مطلوب معرف عميل Auth0',
+      clientSecret: 'سر العميل',
+      clientSecretDescription: 'مطلوب سر العميل لتطبيق المصادقة OAuth الخاص بـ Auth0'
     },
     comingSoon: 'تحت الإنشاء طرق تسجيل الدخول الأخرى.',
     moreLogin: 'تسجيل الدخول المزيد',
@@ -1704,27 +1709,29 @@ var _default = exports.default = {
     github: {
       enable: 'تمكين تسجيل الدخول على Github',
       clientId: 'معرف العميل',
-      clientIdDescribe: 'مطلوب معرف عميل (clientId) لتطبيق Github OAuth',
+      clientIdDescription: 'مطلوب معرف عميل (clientId) لتطبيق Github OAuth',
       clientSecret: 'سر العميل',
-      clientSecretDescribe: 'مطلوب clientSecret لتطبيق Github OAuth'
+      clientSecretDescription: 'مطلوب clientSecret لتطبيق Github OAuth'
     },
     google: {
       enable: 'تفعيل تسجيل الدخول في جوجل',
       clientId: 'معرف العميل',
-      clientIdDescribe: 'مطلوب معرف تطبيق Google OAuth',
+      clientIdDescription: 'مطلوب معرف تطبيق Google OAuth',
       clientSecret: 'سر العميل',
-      clientSecretDescribe: 'مطلوب clientSecret لتطبيق Google OAuth'
+      clientSecretDescription: 'مطلوب clientSecret لتطبيق Google OAuth'
     },
     apple: {
       enable: 'تفعيل تسجيل الدخول الخاص بـ آبل',
       teamId: 'رقم فريق',
-      teamIdDescribe: 'مطلوب معرف فريق لتطبيق Apple OAuth',
+      teamIdDescription: 'مطلوب معرف فريق لتطبيق Apple OAuth',
       serviceId: 'رقم الخدمة',
-      serviceIdDescribe: 'مطلوب معرف خدمة لتطبيق Apple OAuth',
+      serviceIdDescription: 'مطلوب معرف خدمة لتطبيق Apple OAuth',
       keyId: 'مفتاح ID',
-      keyIdDescribe: 'مطلوب مفتاح تطبيق OAuth لأبل',
+      keyIdDescription: 'مطلوب مفتاح تطبيق OAuth لأبل',
       authKey: 'مفتاح Auth',
-      authKeyDescribe: 'مفتاح المصادقة لتطبيق Apple OAuth مطلوب'
+      authKeyDescription: 'مفتاح المصادقة لتطبيق Apple OAuth مطلوب',
+      bundleId: 'معرف الحزمة',
+      bundleIdDescription: 'معرّف حزمة تطبيق Apple OAuth مطلوب'
     },
     oauth: 'تسجيل الدخول من طرف ثالث'
   },

package/lib/locales/de.js

@@ -555,7 +555,8 @@ var _default = exports.default = {
       corrupted: 'Korrupt',
       purchasing: 'Warten auf den Kauf',
       purchased: 'Gekauft',
-      verifying: 'Kauf überprüfen'
+      verifying: 'Kauf überprüfen',
+      resource: 'Ressource'
     },
     list: {
       download: 'Herunterladen',
@@ -718,7 +719,10 @@ var _default = exports.default = {
         tip2: 'Sie können keine neuen Versionen mehr für den gelöschten Blocklet veröffentlichen, was bedeutet, dass das Blocklet nicht mehr im Store aktualisiert wird.',
         tip3: 'Das Löschen des Blocklets hat keine Auswirkungen auf seine derzeit veröffentlichte Version im Store.',
         description: 'Nach dem Löschen der Blocklet werden Sie auf die folgenden Probleme stoßen. Sind Sie sicher, dass Sie es löschen möchten?'
-      }
+      },
+      resourceTip: 'Zurzeit kann es als Ressourcen-Blocklet nicht direkt aus dem Store installiert werden.',
+      whyCantSeeInStore: 'Warum kann ich dieses Blocklet nicht im Store sehen?',
+      whyCantSeeResourceBlockletInStore: 'Warum kann ich diesen Ressourcen-Blocklet nicht im Store sehen?'
     },
     titleValidationError: 'Die Länge des Titels muss mindestens 3 Zeichen betragen',
     descriptionValidationError: 'Die Beschreibungslänge muss zwischen 3 und 160 Zeichen liegen'
@@ -1694,8 +1698,9 @@ var _default = exports.default = {
       domain: 'Domain',
       domainDescription: 'Die Domäne von Auth0 ist erforderlich',
       clientId: 'Kunden-ID',
-      clientIdDescribe: 'Die clientId von Auth0 ist erforderlich',
-      clientSecret: 'Geheimclient'
+      clientIdDescription: 'Die clientId von Auth0 ist erforderlich',
+      clientSecret: 'Geheimclient',
+      clientSecretDescription: 'Auth0-OAuth-Anwendung Der geheime Clientschlüssel ist erforderlich'
     },
     comingSoon: 'Es werden weitere Anmeldeverfahren entwickelt.',
     moreLogin: 'Mehr Anmeldung',
@@ -1704,27 +1709,29 @@ var _default = exports.default = {
     github: {
       enable: 'Aktiviere Github-Anmeldung',
       clientId: 'Client ID',
-      clientIdDescribe: 'Für die Github OAuth-Anwendung ist eine clientId erforderlich',
+      clientIdDescription: 'Für die Github OAuth-Anwendung ist eine clientId erforderlich',
       clientSecret: 'Client Secret',
-      clientSecretDescribe: 'Für die Github OAuth-Anwendung ist ein clientSecret erforderlich'
+      clientSecretDescription: 'Für die Github OAuth-Anwendung ist ein clientSecret erforderlich'
     },
     google: {
       enable: 'Google-Anmeldung aktivieren',
       clientId: 'Client ID',
-      clientIdDescribe: 'Für die Google OAuth-Anwendung ist die Client-ID erforderlich',
+      clientIdDescription: 'Für die Google OAuth-Anwendung ist die Client-ID erforderlich',
       clientSecret: 'Geheimnis des Kunden',
-      clientSecretDescribe: 'Für die Google OAuth-Anwendung ist ein clientSecret erforderlich'
+      clientSecretDescription: 'Für die Google OAuth-Anwendung ist ein clientSecret erforderlich'
     },
     apple: {
       enable: 'Anmeldung mit Apple aktivieren',
       teamId: 'Team-ID',
-      teamIdDescribe: 'Für die Apple OAuth-Anwendung ist eine Team-ID erforderlich',
+      teamIdDescription: 'Für die Apple OAuth-Anwendung ist eine Team-ID erforderlich',
       serviceId: 'Service-ID',
-      serviceIdDescribe: 'Für die Apple OAuth-Anwendung ist eine Dienst-ID erforderlich',
+      serviceIdDescription: 'Für die Apple OAuth-Anwendung ist eine Dienst-ID erforderlich',
       keyId: 'Schlüssel-ID',
-      keyIdDescribe: 'Für Apple OAuth ist eine Anwendungsschlüssel-ID erforderlich',
+      keyIdDescription: 'Für Apple OAuth ist eine Anwendungsschlüssel-ID erforderlich',
       authKey: 'Auth Schlüssel',
-      authKeyDescribe: 'Authentifizierungsschlüssel für Apple OAuth-Anwendung erforderlich'
+      authKeyDescription: 'Authentifizierungsschlüssel für Apple OAuth-Anwendung erforderlich',
+      bundleId: 'Bundle-ID',
+      bundleIdDescription: 'Die Apple OAuth Anwendungs-Bundle-ID ist erforderlich'
     },
     oauth: 'Drittanbieter-Anmeldung'
   },