@abtnode/ux 1.16.27-beta-725ce3a6 → 1.16.27-beta-d1555a79

package/lib/blocklet/access/index.js

@@ -1,103 +1,90 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = BlockletAccess;
-var _react = require("react");
-var _styled = _interopRequireDefault(require("@emotion/styled"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _useTheme = _interopRequireDefault(require("@mui/material/styles/useTheme"));
-var _Box = _interopRequireDefault(require("@mui/material/Box"));
-var _Tooltip = _interopRequireDefault(require("@mui/material/Tooltip"));
-var _IconButton = _interopRequireDefault(require("@mui/material/IconButton"));
-var _ExpandMore = _interopRequireDefault(require("@mui/icons-material/ExpandMore"));
-var _ChevronRight = _interopRequireDefault(require("@mui/icons-material/ChevronRight"));
-var _Collapse = _interopRequireDefault(require("@mui/material/Collapse"));
-var _Launch = _interopRequireDefault(require("@mui/icons-material/Launch"));
-var _EditIcon = _interopRequireDefault(require("@arcblock/icons/lib/EditIcon"));
-var _util = require("@blocklet/meta/lib/util");
-var _context = require("@arcblock/ux/lib/Locale/context");
-var _Empty = _interopRequireDefault(require("@arcblock/ux/lib/Empty"));
-var _blocklet = require("../../contexts/blocklet");
-var _team = require("../../contexts/team");
-var _util2 = require("../../util");
-var _line = _interopRequireDefault(require("../component/line"));
-var _bundleAvatar = _interopRequireDefault(require("../bundle-avatar"));
-var _configAccess = _interopRequireWildcard(require("./config-access"));
-var _config = _interopRequireDefault(require("../../who-can-access/config"));
-var _jsxRuntime = require("react/jsx-runtime");
-var _templateObject;
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-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 ComponentItem(_ref) {
-  var _blocklet$children;
-  let {
-    blocklet,
-    ancestors,
-    depth
-  } = _ref;
-  const theme = (0, _useTheme.default)();
+import { useState } from 'react';
+import styled from '@emotion/styled';
+import PropTypes from 'prop-types';
+import useTheme from '@mui/material/styles/useTheme';
+import Box from '@mui/material/Box';
+import Tooltip from '@mui/material/Tooltip';
+import IconButton from '@mui/material/IconButton';
+import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
+import ChevronRightIcon from '@mui/icons-material/ChevronRight';
+import Collapse from '@mui/material/Collapse';
+import LaunchIcon from '@mui/icons-material/Launch';
+import EditIcon from '@arcblock/icons/lib/EditIcon';
+import { getDisplayName } from '@blocklet/meta/lib/util';
+import { useLocaleContext } from '@arcblock/ux/lib/Locale/context';
+import Empty from '@arcblock/ux/lib/Empty';
+import { useBlockletContext } from '../../contexts/blocklet';
+import { useTeamContext } from '../../contexts/team';
+import { getBlockletUrl, getBlockletUrlParams } from '../../util';
+import Line from '../component/line';
+import BlockletBundleAvatar from '../bundle-avatar';
+import ConfigAccess, { getComponentWhoCanAccess } from './config-access';
+import AccessConfig from '../../who-can-access/config';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+function ComponentItem({
+  blocklet,
+  ancestors,
+  depth
+}) {
+  const theme = useTheme();
   const {
     t,
     locale
-  } = (0, _context.useLocaleContext)();
+  } = useLocaleContext();
   const {
     roles: roleList
-  } = (0, _team.useTeamContext)();
-  const [expand, setExpand] = (0, _react.useState)(true);
+  } = useTeamContext();
+  const [expand, setExpand] = useState(true);
   const {
     recommendedDomain: domain
-  } = (0, _blocklet.useBlockletContext)();
+  } = useBlockletContext();
   const app = ancestors[0] || blocklet;
-  const mountPoint = "/".concat(ancestors.map(x => x.mountPoint || '/').join('/'), "/").concat(blocklet.mountPoint || '/').replace(/\/+/g, '/');
-  const href = (0, _util2.getBlockletUrl)({
+  const mountPoint = `/${ancestors.map(x => x.mountPoint || '/').join('/')}/${blocklet.mountPoint || '/'}`.replace(/\/+/g, '/');
+  const href = getBlockletUrl({
     blocklet: app,
     domain: {
       value: domain
     },
     mountPoint,
-    params: (0, _util2.getBlockletUrlParams)(app, locale)
+    params: getBlockletUrlParams(app, locale)
   });
   const iconStyle = {
     fill: theme.palette.text.secondary
   };
   const canExpand = depth > 0 && blocklet.children.length > 0;
-  const expandIcon = /*#__PURE__*/(0, _jsxRuntime.jsx)(_IconButton.default, {
+  const expandIcon = /*#__PURE__*/_jsx(IconButton, {
     size: "small",
-    children: expand ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_ExpandMore.default, {
+    children: expand ? /*#__PURE__*/_jsx(ExpandMoreIcon, {
       fontSize: "inherit"
-    }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChevronRight.default, {
+    }) : /*#__PURE__*/_jsx(ChevronRightIcon, {
       fontSize: "inherit"
     })
   });
   const {
     access: whoCanAccess,
     roles
-  } = (0, _configAccess.getComponentWhoCanAccess)(blocklet, app, {
+  } = getComponentWhoCanAccess(blocklet, app, {
     roles: roleList
   });
   let accessConfig;
   if (whoCanAccess !== 'roles') {
-    accessConfig = _config.default.find(x => x.value === whoCanAccess) || _config.default[2];
+    accessConfig = AccessConfig.find(x => x.value === whoCanAccess) || AccessConfig[2];
   } else {
     const str = roles.map(x => x.title).join('/');
     accessConfig = {
       title: {
-        zh: "\u53EA\u6709 ".concat(str, " \u53EF\u4EE5\u8BBF\u95EE"),
-        en: "Only ".concat(str, " can access")
+        zh: `只有 ${str} 可以访问`,
+        en: `Only ${str} can access`
       }
     };
   }
-  return [(depth > 0 || blocklet.meta.group !== 'gateway') && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
+  return [(depth > 0 || blocklet.meta.group !== 'gateway') && /*#__PURE__*/_jsxs(Box, {
     display: "flex",
     py: 2,
     className: "component-item",
     justifyContent: "space-between",
     alignItems: "center",
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
+    children: [/*#__PURE__*/_jsxs(Box, {
       pl: Math.max((depth - 1) * 2, 0),
       width: {
         xs: 300,
@@ -109,95 +96,92 @@ function ComponentItem(_ref) {
         cursor: canExpand ? 'pointer' : 'cursor'
       },
       onClick: () => canExpand && setExpand(!expand),
-      children: [canExpand ? expandIcon : /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
+      children: [canExpand ? expandIcon : /*#__PURE__*/_jsx(Box, {
         width: 28
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_bundleAvatar.default, {
+      }), /*#__PURE__*/_jsx(BlockletBundleAvatar, {
         blocklet: blocklet,
         ancestors: ancestors
-      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
+      }), /*#__PURE__*/_jsxs(Box, {
         ml: "16px",
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
+        children: [/*#__PURE__*/_jsx(Box, {
           style: {
             color: '#222',
             fontSize: 18
           },
-          children: (0, _util.getDisplayName)(blocklet, true)
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
+          children: getDisplayName(blocklet, true)
+        }), /*#__PURE__*/_jsx(Box, {
           display: "flex",
           alignItems: "center",
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
+          children: /*#__PURE__*/_jsx(Box, {
             color: "text.secondary",
             children: accessConfig.title[locale]
           })
         })]
       })]
-    }, blocklet), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Tooltip.default, {
+    }, blocklet), /*#__PURE__*/_jsxs(Box, {
+      children: [/*#__PURE__*/_jsx(Tooltip, {
         title: t('common.visit'),
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("a", {
+        children: /*#__PURE__*/_jsx("a", {
           target: "_blank",
           href: href,
           rel: "noopener noreferrer",
           title: href,
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_IconButton.default, {
-            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Launch.default, {})
+          children: /*#__PURE__*/_jsx(IconButton, {
+            children: /*#__PURE__*/_jsx(LaunchIcon, {})
           })
         })
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_configAccess.default, {
+      }), /*#__PURE__*/_jsx(ConfigAccess, {
         blocklet: blocklet,
         ancestors: ancestors,
-        children: _ref2 => {
-          let {
-            open
-          } = _ref2;
-          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Tooltip.default, {
-            title: t('common.edit'),
-            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_IconButton.default, {
-              onClick: open,
-              "data-cy": "btn-edit-".concat(blocklet.meta.did),
-              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_EditIcon.default, {
-                style: iconStyle
-              })
+        children: ({
+          open
+        }) => /*#__PURE__*/_jsx(Tooltip, {
+          title: t('common.edit'),
+          children: /*#__PURE__*/_jsx(IconButton, {
+            onClick: open,
+            "data-cy": `btn-edit-${blocklet.meta.did}`,
+            children: /*#__PURE__*/_jsx(EditIcon, {
+              style: iconStyle
             })
-          });
-        }
+          })
+        })
       })]
     }, "actions")]
-  }, "group-not-gateway-box"), /*#__PURE__*/(0, _jsxRuntime.jsx)(_line.default, {
+  }, "group-not-gateway-box"), /*#__PURE__*/_jsx(Line, {
     depth: depth
-  }, "line"), (_blocklet$children = blocklet.children) !== null && _blocklet$children !== void 0 && _blocklet$children.length ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Collapse.default, {
+  }, "line"), blocklet.children?.length ? /*#__PURE__*/_jsx(Collapse, {
     in: expand,
-    children: blocklet.children.map(x => /*#__PURE__*/(0, _jsxRuntime.jsx)(ComponentItem, {
+    children: blocklet.children.map(x => /*#__PURE__*/_jsx(ComponentItem, {
       blocklet: x,
       ancestors: [...ancestors, blocklet],
       depth: depth + 1
-    }, "".concat(depth + 1, "-").concat(x.meta.did)))
+    }, `${depth + 1}-${x.meta.did}`))
   }, "blocklet-collapse") : null];
 }
 ComponentItem.propTypes = {
-  blocklet: _propTypes.default.object.isRequired,
-  ancestors: _propTypes.default.array,
-  depth: _propTypes.default.number
+  blocklet: PropTypes.object.isRequired,
+  ancestors: PropTypes.array,
+  depth: PropTypes.number
 };
 ComponentItem.defaultProps = {
   ancestors: [],
   depth: 0
 };
-function BlockletAccess() {
+export default function BlockletAccess() {
   const {
     t
-  } = (0, _context.useLocaleContext)();
+  } = useLocaleContext();
   const {
     blocklet
-  } = (0, _blocklet.useBlockletContext)();
+  } = useBlockletContext();
   const components = [...blocklet.children] || [];
   if (blocklet.meta.group !== 'gateway') {
     // add root blocklet to table list
     components.unshift(blocklet);
   }
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Div, {
+  return /*#__PURE__*/_jsx(Div, {
     component: "div",
-    children: components && components.length ? [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
+    children: components && components.length ? [/*#__PURE__*/_jsx(Box, {
       mt: 2,
       ml: {
         xs: '-12px',
@@ -206,16 +190,26 @@ function BlockletAccess() {
       style: {
         maxWidth: 1080
       },
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(ComponentItem, {
+      children: /*#__PURE__*/_jsx(ComponentItem, {
         blocklet: blocklet
-      }, "0-".concat(blocklet.meta.did))
-    }, "top-blocklet-".concat(blocklet.meta.did))] : /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
+      }, `0-${blocklet.meta.did}`)
+    }, `top-blocklet-${blocklet.meta.did}`)] : /*#__PURE__*/_jsx(Box, {
       mt: 8,
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Empty.default, {
+      children: /*#__PURE__*/_jsx(Empty, {
         children: t('blocklet.component.noComponent')
       })
     })
   });
 }
 BlockletAccess.propTypes = {};
-const Div = (0, _styled.default)(_Box.default)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  .title {\n    font-size: 1.2rem;\n    font-weight: bold;\n    margin-top: ", ";\n    margin-bottom: ", ";\n    &.first {\n      margin-top: 0;\n    }\n  }\n"])), props => props.theme.spacing(5), props => props.theme.spacing(3));
+const Div = styled(Box)`
+  .title {
+    font-size: 1.2rem;
+    font-weight: bold;
+    margin-top: ${props => props.theme.spacing(5)};
+    margin-bottom: ${props => props.theme.spacing(3)};
+    &.first {
+      margin-top: 0;
+    }
+  }
+`;