@abtnode/ux 1.8.26 → 1.8.27

package/lib/logs/clock.js

@@ -0,0 +1,25 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = require("react");
+
+var _useInterval = _interopRequireDefault(require("react-use/lib/useInterval"));
+
+var _util = require("../util");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function Clock() {
+  const [currentTime, setCurrentTime] = (0, _react.useState)(+new Date());
+  (0, _useInterval.default)(() => {
+    setCurrentTime(+new Date());
+  }, 1000);
+  return (0, _util.formatTime)(currentTime, 'MMMM Do YYYY, h:mm:ss a');
+}
+
+var _default = Clock;
+exports.default = _default;

package/lib/logs/log-terminal.js

@@ -0,0 +1,198 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.LogTerminal = void 0;
+exports.LogTerminalGroup = LogTerminalGroup;
+
+var _react = require("react");
+
+var _styled = _interopRequireDefault(require("@emotion/styled"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _Button = _interopRequireDefault(require("@mui/material/Button"));
+
+var _ButtonGroup = _interopRequireDefault(require("@mui/material/ButtonGroup"));
+
+var _useMediaQuery = _interopRequireDefault(require("@mui/material/useMediaQuery"));
+
+var _Terminal = _interopRequireDefault(require("@arcblock/terminal/lib/Terminal"));
+
+var _clock = _interopRequireDefault(require("./clock"));
+
+var _node = require("../contexts/node");
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+var _templateObject, _templateObject2;
+
+const _excluded = ["name", "logId", "types", "initialData", "prepend"],
+      _excluded2 = ["logFile"];
+
+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 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) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+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; }
+
+/**
+ * 按 level/destination 分类的一组 terminal
+ */
+function LogTerminalGroup(_ref) {
+  let {
+    name,
+    logId,
+    types,
+    initialData,
+    prepend
+  } = _ref,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
+  const {
+    ws: {
+      useSubscription
+    }
+  } = (0, _node.useNodeContext)();
+  const logTypeLabels = {
+    info: 'Info',
+    error: 'Error',
+    access: 'Access',
+    stdout: 'stdout',
+    stderr: 'stderr'
+  };
+  const isMobile = (0, _useMediaQuery.default)(theme => theme.breakpoints.down('md'));
+  const [currentType, setCurrentType] = (0, _react.useState)(types[0]);
+  const [logFiles, setLogFiles] = (0, _react.useState)();
+  const terminalRefs = (0, _react.useRef)({}); // 组件挂载时, 写入初始数据
+
+  (0, _react.useEffect)(() => {
+    types.forEach(type => {
+      const terminal = terminalRefs.current[type];
+
+      if (terminal) {
+        terminal.write("Collecting ".concat(type, " logs for ").concat(name, "..."));
+        terminal.write('\r\n\r\n');
+        initialData.forEach(item => terminal.write(item));
+      }
+    }); // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []); // 监听 log 数据, 写入 terminal
+
+  useSubscription("log.".concat(logId), log => {
+    if (!logFiles) {
+      setLogFiles(log.logFiles || {});
+    }
+
+    const terminal = terminalRefs.current[log.level];
+
+    if (terminal) {
+      terminal.write(log.data.replace(/.\n/g, p => p === '\r\n' ? p : "".concat(p[0], "\r\n\r\n")));
+      terminal.write('\r\n\r\n');
+    }
+  }, []);
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(LogTerminalGroupRoot, _objectSpread(_objectSpread({}, rest), {}, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: "log-terminal-group-head",
+      children: [prepend, /*#__PURE__*/(0, _jsxRuntime.jsx)(_ButtonGroup.default, {
+        variant: "outlined",
+        size: isMobile ? 'small' : 'medium',
+        children: types.map(type => {
+          const props = type === currentType ? {
+            variant: 'contained'
+          } : {};
+          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.default, _objectSpread(_objectSpread({}, props), {}, {
+            onClick: () => setCurrentType(type),
+            children: logTypeLabels[type]
+          }), type);
+        })
+      })]
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: "log-terminal-group-terminals",
+      children: types.map(type => {
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(LogTerminal, {
+          ref: _ref2 => {
+            terminalRefs.current[type] = _ref2;
+          },
+          logFile: logFiles === null || logFiles === void 0 ? void 0 : logFiles[type],
+          style: {
+            visibility: type === currentType ? 'visible' : 'hidden'
+          }
+        }, type);
+      })
+    })]
+  }));
+}
+
+LogTerminalGroup.propTypes = {
+  // log name, 比如: blocklet display name
+  name: _propTypes.default.string.isRequired,
+  // 比如: abtnode | blocklet-services | blocklet-<did>
+  logId: _propTypes.default.string.isRequired,
+  // 日志类型, info/error 或 stdin/stdout/access
+  types: _propTypes.default.arrayOf(_propTypes.default.string),
+  // 写入 terminal 的初始数据
+  initialData: _propTypes.default.arrayOf(_propTypes.default.string),
+  prepend: _propTypes.default.node
+};
+LogTerminalGroup.defaultProps = {
+  types: ['error', 'info', 'access', 'stdout', 'stderr'],
+  initialData: [],
+  prepend: null
+};
+
+const LogTerminalGroupRoot = _styled.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  .log-terminal-group-head {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n    gap: 16px;\n    padding-bottom: 16px;\n\n    ", " {\n      flex-direction: column;\n      align-items: start;\n    }\n  }\n  .log-terminal-group-terminals {\n    flex: 1;\n    position: relative;\n    overflow: hidden;\n    > * {\n      position: absolute;\n      top: 0;\n      bottom: 0;\n      left: 0;\n      right: 0;\n    }\n  }\n"])), props => props.theme.breakpoints.down('md'));
+
+const LogTerminal = /*#__PURE__*/(0, _react.forwardRef)((_ref3, ref) => {
+  let {
+    logFile
+  } = _ref3,
+      rest = _objectWithoutProperties(_ref3, _excluded2);
+
+  const terminalStyle = {
+    width: '100%',
+    boxSizing: 'border-box',
+    height: '100%'
+  };
+  const terminalOptions = {
+    theme: {
+      background: '#2C313C',
+      foreground: '#EEEEEE'
+    }
+  };
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(LogTerminalRoot, _objectSpread(_objectSpread({}, rest), {}, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: "log-terminal-top",
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_clock.default, {}), logFile && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        children: logFile
+      })]
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: "log-terminal-container",
+      style: {
+        position: 'relative'
+      },
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Terminal.default, {
+        ref: ref,
+        style: terminalStyle,
+        options: terminalOptions
+      })
+    })]
+  }));
+});
+exports.LogTerminal = LogTerminal;
+LogTerminal.propTypes = {
+  logFile: _propTypes.default.string
+};
+LogTerminal.defaultProps = {
+  logFile: ''
+};
+
+const LogTerminalRoot = _styled.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  .log-terminal-top {\n    flex: 0 0 auto;\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    flex-wrap: wrap;\n    padding: 8px;\n    font-size: 14px;\n    color: aquamarine;\n    background: darkgray;\n    word-break: break-word;\n  }\n  .log-terminal-container {\n    flex: 1;\n    height: 100%;\n    padding: 8px;\n    overflow: hidden;\n    background: #2c313c;\n  }\n\n  .xterm-viewport::-webkit-scrollbar {\n    width: 10px;\n  }\n  .xterm-viewport::-webkit-scrollbar-track {\n    opacity: 0;\n  }\n  .xterm-viewport::-webkit-scrollbar-thumb {\n    min-height: 20px;\n    background-color: #ffffff20;\n  }\n"])));

package/lib/passport-tag.js

@@ -0,0 +1,58 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = PassportTag;
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _styled = _interopRequireDefault(require("@emotion/styled"));
+
+var _Close = _interopRequireDefault(require("@mui/icons-material/Close"));
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+var _templateObject;
+
+const _excluded = ["passport", "onDelete"];
+
+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 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) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+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 PassportTag(props) {
+  const {
+    passport,
+    onDelete
+  } = props,
+        rest = _objectWithoutProperties(props, _excluded);
+
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(Tag, _objectSpread(_objectSpread({}, rest), {}, {
+    children: [passport.title || passport.name, ' ', !!onDelete && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Close.default, {
+      "data-cy": "delete-issuance",
+      className: "delete",
+      onClick: onDelete
+    })]
+  }));
+}
+
+PassportTag.propTypes = {
+  passport: _propTypes.default.object.isRequired,
+  onDelete: _propTypes.default.func
+};
+PassportTag.defaultProps = {
+  onDelete: null
+};
+
+const Tag = _styled.default.span(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: inline-flex;\n  padding: 2px 8px;\n  background: ", ";\n  border-radius: 100vw;\n  font-weight: 400;\n  font-size: 12px;\n  line-height: 22px;\n  color: #fff;\n  align-items: center;\n  .delete {\n    font-size: 1em;\n    margin-left: 6px;\n    cursor: pointer;\n  }\n"])), props => props.theme.palette.primary.main);

package/lib/permission.js

@@ -0,0 +1,84 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = Permission;
+exports.withPermission = withPermission;
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _session = require("./contexts/session");
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+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) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+function Permission(_ref) {
+  let {
+    permission,
+    role,
+    component,
+    children
+  } = _ref;
+  const {
+    session
+  } = (0, _session.useSessionContext)();
+  let can = true;
+  const permissions = [].concat(permission).filter(Boolean);
+  const roles = [].concat(role).filter(Boolean);
+
+  if (permissions.length) {
+    const userPermissions = session.user && session.user.permissions || [];
+    can = permissions.some(p => userPermissions.includes(p));
+  }
+
+  if (can && roles.length) {
+    can = roles.includes(session.user.role);
+  }
+
+  if (typeof component === 'function') {
+    return component(can);
+  }
+
+  if (typeof children === 'function') {
+    return children(can);
+  }
+
+  if (can) {
+    return component || children || null;
+  }
+
+  return null;
+}
+
+function withPermission(Component, permissionName, role) {
+  return function WithPermission(props) {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(Permission, {
+      permission: permissionName,
+      role: role,
+      children: hasPermission => /*#__PURE__*/(0, _jsxRuntime.jsx)(Component, _objectSpread(_objectSpread({}, props), {}, {
+        hasPermission: hasPermission
+      }))
+    });
+  };
+}
+
+Permission.propTypes = {
+  permission: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.arrayOf(_propTypes.default.string)]),
+  role: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.arrayOf(_propTypes.default.string)]),
+  component: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.element]),
+  children: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.element])
+};
+Permission.defaultProps = {
+  permission: '',
+  role: '',
+  component: null,
+  children: null
+};

package/lib/relative-time.js

@@ -0,0 +1,74 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = RelativeTime;
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _prettyMsI18n = _interopRequireDefault(require("pretty-ms-i18n"));
+
+var _Tooltip = _interopRequireDefault(require("@mui/material/Tooltip"));
+
+var _context = require("@arcblock/ux/lib/Locale/context");
+
+var _util = require("./util");
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function RelativeTime(_ref) {
+  let {
+    value
+  } = _ref;
+  const {
+    t,
+    locale
+  } = (0, _context.useLocaleContext)();
+
+  if (!value) {
+    return '-';
+  }
+
+  const prettyOption = {
+    locale: locale === 'zh' ? 'zh_CN' : 'zh_US',
+    compact: true
+  };
+  const valTime = new Date(value).getTime();
+  const now = Date.now();
+
+  if (valTime > now) {
+    const time = (0, _prettyMsI18n.default)(valTime - now, prettyOption);
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Tooltip.default, {
+      title: (0, _util.formatToDatetime)(value),
+      placement: "top-end",
+      enterTouchDelay: 0,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        children: t('common.afterTime', {
+          time
+        })
+      })
+    });
+  }
+
+  const time = (0, _prettyMsI18n.default)(now - valTime, prettyOption);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Tooltip.default, {
+    title: (0, _util.formatToDatetime)(value),
+    placement: "top-end",
+    enterTouchDelay: 0,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+      children: t('common.timeAgo', {
+        time
+      })
+    })
+  });
+}
+
+RelativeTime.propTypes = {
+  value: _propTypes.default.any
+};
+RelativeTime.defaultProps = {
+  value: ''
+};

package/lib/table-icons.js

@@ -0,0 +1,59 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _Add = _interopRequireDefault(require("@mui/icons-material/Add"));
+
+var _Check = _interopRequireDefault(require("@mui/icons-material/Check"));
+
+var _Delete = _interopRequireDefault(require("@mui/icons-material/Delete"));
+
+var _Clear = _interopRequireDefault(require("@mui/icons-material/Clear"));
+
+var _SaveAlt = _interopRequireDefault(require("@mui/icons-material/SaveAlt"));
+
+var _Edit = _interopRequireDefault(require("@mui/icons-material/Edit"));
+
+var _Filter = _interopRequireDefault(require("@mui/icons-material/Filter"));
+
+var _FirstPage = _interopRequireDefault(require("@mui/icons-material/FirstPage"));
+
+var _LastPage = _interopRequireDefault(require("@mui/icons-material/LastPage"));
+
+var _ChevronRight = _interopRequireDefault(require("@mui/icons-material/ChevronRight"));
+
+var _ChevronLeft = _interopRequireDefault(require("@mui/icons-material/ChevronLeft"));
+
+var _Search = _interopRequireDefault(require("@mui/icons-material/Search"));
+
+var _ArrowDropDown = _interopRequireDefault(require("@mui/icons-material/ArrowDropDown"));
+
+var _Remove = _interopRequireDefault(require("@mui/icons-material/Remove"));
+
+var _ViewColumn = _interopRequireDefault(require("@mui/icons-material/ViewColumn"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var _default = {
+  Add: _Add.default,
+  Check: _Check.default,
+  Delete: _Delete.default,
+  Edit: _Edit.default,
+  Clear: _Clear.default,
+  DetailPanel: _ChevronRight.default,
+  Filter: _Filter.default,
+  FirstPage: _FirstPage.default,
+  LastPage: _LastPage.default,
+  NextPage: _ChevronRight.default,
+  PreviousPage: _ChevronLeft.default,
+  Search: _Search.default,
+  ResetSearch: _Clear.default,
+  SortArrow: _ArrowDropDown.default,
+  Export: _SaveAlt.default,
+  ThirdStateCheck: _Remove.default,
+  ViewColumn: _ViewColumn.default
+};
+exports.default = _default;

package/lib/table.js

@@ -0,0 +1,19 @@
+"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 TableStyle = _styled.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  .MuiPaper-root {\n    box-shadow: none !important;\n    border: none !important;\n    border-radius: 0 !important;\n    background: transparent;\n  }\n  .MuiToolbar-root {\n    background: transparent;\n    padding-left: 0;\n    display: none;\n  }\n\n  &.show-pagination {\n    .MuiTablePagination-toolbar {\n      display: flex;\n    }\n  }\n\n  .MuiTableHead-root th {\n    min-width: 100px;\n    background: transparent;\n  }\n\n  .MuiTable-root {\n    overflow-y: hidden;\n  }\n  .MuiTableRow-root {\n    border: none !important;\n  }\n\n  .MuiTableCell-root {\n    padding-right: 16px;\n    &:last-of-type {\n      padding-right: 0;\n    }\n  }\n\n  /* @material-table/core@next \u517C\u5BB9 mui v5, \u4F46 pagination \u6837\u5F0F\u4F3C\u4E4E\u6709\u4E9B\u95EE\u9898, \u6682\u5730\u5B9A\u5236\u4E0B\u9762\u7684\u6837\u5F0F\u4FEE\u590D, \u540E\u9762\u8003\u8651\u5F03\u7528 material-table  */\n  .MuiTablePagination-selectLabel,\n  .MuiTablePagination-displayedRows {\n    display: none;\n  }\n  .MuiTypography-caption {\n    display: inline-block;\n  }\n  .MuiTablePagination-selectLabel + .MuiInputBase-root {\n    margin-right: 8px;\n  }\n"])));
+
+var _default = TableStyle;
+exports.default = _default;

package/lib/tag.js

@@ -0,0 +1,48 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = Wrapped;
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _Tag = _interopRequireDefault(require("@arcblock/ux/lib/Tag"));
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+const _excluded = ["children", "style"];
+
+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) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+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 Wrapped(_ref) {
+  let {
+    children,
+    style
+  } = _ref,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Tag.default, _objectSpread(_objectSpread({
+    style: style
+  }, rest), {}, {
+    children: children
+  }));
+}
+
+Wrapped.propTypes = {
+  children: _propTypes.default.any.isRequired,
+  style: _propTypes.default.object
+};
+Wrapped.defaultProps = {
+  style: {}
+};