@abtnode/ux 1.16.27-beta-c450492a → 1.16.27-beta-d1555a79

package/lib/actions.js

@@ -1,45 +1,26 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = Actions;
-var _react = require("react");
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _styled = _interopRequireDefault(require("@emotion/styled"));
-var _IconButton = _interopRequireDefault(require("@mui/material/IconButton"));
-var _Menu = _interopRequireDefault(require("@mui/material/Menu"));
-var _MenuItem = _interopRequireDefault(require("@mui/material/MenuItem"));
-var _MoreHoriz = _interopRequireDefault(require("@mui/icons-material/MoreHoriz"));
-var _ListItemIcon = _interopRequireDefault(require("@mui/material/ListItemIcon"));
-var _ListItemText = _interopRequireDefault(require("@mui/material/ListItemText"));
-var _jsxRuntime = require("react/jsx-runtime");
-var _templateObject;
-const _excluded = ["actions", "size"],
-  _excluded2 = ["icon", "text", "onClick", "disabled"];
-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(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; }
-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(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
-function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-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 = {}; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } } return target; }
-function Actions(_ref) {
-  let {
-      actions,
-      size
-    } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded);
-  const [anchorEl, setAnchorEl] = (0, _react.useState)(null);
+import { useState, createElement as _createElement } from 'react';
+import PropTypes from 'prop-types';
+import styled from '@emotion/styled';
+import IconButton from '@mui/material/IconButton';
+import Menu from '@mui/material/Menu';
+import MenuItem from '@mui/material/MenuItem';
+import MoreHorizIcon from '@mui/icons-material/MoreHoriz';
+import ListItemIcon from '@mui/material/ListItemIcon';
+import ListItemText from '@mui/material/ListItemText';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export default function Actions({
+  actions,
+  size,
+  ...props
+}) {
+  const [anchorEl, setAnchorEl] = useState(null);
   const open = Boolean(anchorEl);
   const onOpen = e => {
     try {
       e.stopPropagation();
       e.preventDefault();
       // eslint-disable-next-line no-empty
-    } catch (_unused) {}
+    } catch {}
     setAnchorEl(e.currentTarget);
   };
   const onClose = e => {
@@ -47,19 +28,20 @@ function Actions(_ref) {
       e.stopPropagation();
       e.preventDefault();
       // eslint-disable-next-line no-empty
-    } catch (_unused2) {}
+    } catch {}
     setAnchorEl(null);
   };
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(Div, _objectSpread(_objectSpread({}, props), {}, {
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_IconButton.default, {
+  return /*#__PURE__*/_jsxs(Div, {
+    ...props,
+    children: [/*#__PURE__*/_jsx(IconButton, {
       "aria-label": "more",
       "aria-controls": "actions-menu",
       "aria-haspopup": "true",
       "data-cy": "actions-menu-icon",
       onClick: onOpen,
       size: size,
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_MoreHoriz.default, {})
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Menu.default, {
+      children: /*#__PURE__*/_jsx(MoreHorizIcon, {})
+    }), /*#__PURE__*/_jsx(Menu, {
       id: "actions-menu",
       "data-cy": "actions-menu",
       anchorEl: anchorEl,
@@ -76,42 +58,43 @@ function Actions(_ref) {
           });
         }
         const {
-            icon,
-            text,
-            onClick: _onClick,
-            disabled = false
-          } = action,
-          opts = _objectWithoutProperties(action, _excluded2);
-        return /*#__PURE__*/(0, _react.createElement)(_MenuItem.default, _objectSpread(_objectSpread({}, opts), {}, {
+          icon,
+          text,
+          onClick,
+          disabled = false,
+          ...opts
+        } = action;
+        return /*#__PURE__*/_createElement(MenuItem, {
+          ...opts,
           disabled: disabled,
           dense: true,
           onClick: async e => {
-            await _onClick(e);
+            await onClick(e);
             onClose();
           }
           // eslint-disable-next-line react/no-array-index-key
           ,
           key: index,
-          "data-cy": "actions-menu-".concat(index)
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ListItemIcon.default, {
+          "data-cy": `actions-menu-${index}`
+        }, /*#__PURE__*/_jsx(ListItemIcon, {
           style: {
             minWidth: 24,
             marginRight: 8
           },
           children: icon
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ListItemText.default, {
+        }), /*#__PURE__*/_jsx(ListItemText, {
           primary: text
         }));
       })
     })]
-  }));
+  });
 }
 Actions.propTypes = {
-  actions: _propTypes.default.array,
-  size: _propTypes.default.oneOf(['small', 'medium', 'large'])
+  actions: PropTypes.array,
+  size: PropTypes.oneOf(['small', 'medium', 'large'])
 };
 Actions.defaultProps = {
   actions: [],
   size: 'small'
 };
-const Div = _styled.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral([""])));
+const Div = styled.div``;

package/lib/analytics/card.js

@@ -1,47 +1,34 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = InsightCard;
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _styled = _interopRequireDefault(require("@emotion/styled"));
-var _Card = _interopRequireDefault(require("@mui/material/Card"));
-var _CardContent = _interopRequireDefault(require("@mui/material/CardContent"));
-var _Typography = _interopRequireDefault(require("@mui/material/Typography"));
-var _Box = _interopRequireDefault(require("@mui/material/Box"));
-var _jsxRuntime = require("react/jsx-runtime");
-var _templateObject;
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-function 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; }
-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(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
-function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-function InsightCard(_ref) {
-  let {
-    style,
-    title,
-    value,
-    graph,
-    description
-  } = _ref;
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledCard, {
-    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_CardContent.default, {
-      style: _objectSpread({}, style),
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
+import PropTypes from 'prop-types';
+import styled from '@emotion/styled';
+import Card from '@mui/material/Card';
+import CardContent from '@mui/material/CardContent';
+import Typography from '@mui/material/Typography';
+import Box from '@mui/material/Box';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export default function InsightCard({
+  style,
+  title,
+  value,
+  graph,
+  description
+}) {
+  return /*#__PURE__*/_jsx(StyledCard, {
+    children: /*#__PURE__*/_jsxs(CardContent, {
+      style: {
+        ...style
+      },
+      children: [/*#__PURE__*/_jsx(Typography, {
         sx: {
           fontSize: 14
         },
         color: "text.secondary",
         children: title
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
+      }), /*#__PURE__*/_jsx(Typography, {
         variant: "h5",
         component: "div",
         mt: 1,
         children: value
-      }), graph, !!description && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
+      }), graph, !!description && /*#__PURE__*/_jsx(Box, {
         display: "flex",
         sx: {
           fontSize: 12,
@@ -54,11 +41,11 @@ function InsightCard(_ref) {
   });
 }
 InsightCard.propTypes = {
-  style: _propTypes.default.object,
-  title: _propTypes.default.node,
-  value: _propTypes.default.node,
-  graph: _propTypes.default.node,
-  description: _propTypes.default.any
+  style: PropTypes.object,
+  title: PropTypes.node,
+  value: PropTypes.node,
+  graph: PropTypes.node,
+  description: PropTypes.any
 };
 InsightCard.defaultProps = {
   style: {},
@@ -67,4 +54,38 @@ InsightCard.defaultProps = {
   graph: null,
   description: null
 };
-const StyledCard = (0, _styled.default)(_Card.default)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  .card-content {\n    height: 150px;\n  }\n\n  .card-sparkline {\n    flex: 2;\n    display: flex;\n    position: relative;\n    *[hidden] {\n      display: none;\n    }\n  }\n  .sparkline {\n    stroke: ", ";\n    fill: ", "1A;\n  }\n  .tooltip {\n    position: absolute;\n    background: rgba(0, 0, 0, 0.7);\n    color: #fff;\n    padding: 2px 5px;\n    font-size: 12px;\n    white-space: nowrap;\n    z-index: 9999;\n  }\n  .sparkline--cursor {\n    stroke: orange;\n  }\n\n  .sparkline--spot {\n    fill: red;\n    stroke: red;\n  }\n"])), props => props.theme.palette.primary.main, props => props.theme.palette.primary.main);
+const StyledCard = styled(Card)`
+  .card-content {
+    height: 150px;
+  }
+
+  .card-sparkline {
+    flex: 2;
+    display: flex;
+    position: relative;
+    *[hidden] {
+      display: none;
+    }
+  }
+  .sparkline {
+    stroke: ${props => props.theme.palette.primary.main};
+    fill: ${props => props.theme.palette.primary.main}1A;
+  }
+  .tooltip {
+    position: absolute;
+    background: rgba(0, 0, 0, 0.7);
+    color: #fff;
+    padding: 2px 5px;
+    font-size: 12px;
+    white-space: nowrap;
+    z-index: 9999;
+  }
+  .sparkline--cursor {
+    stroke: orange;
+  }
+
+  .sparkline--spot {
+    fill: red;
+    stroke: red;
+  }
+`;

package/lib/analytics/chart.js

@@ -1,36 +1,21 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = InsightChart;
-var _react = _interopRequireWildcard(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _ahooks = require("ahooks");
-var _Sparkline = _interopRequireDefault(require("@arcblock/ux/lib/Sparkline"));
-var _card = _interopRequireDefault(require("./card"));
-var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-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 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; }
-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(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
-function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-function InsightChart(_ref) {
-  let {
-    id,
-    title,
-    current,
-    description,
-    data,
-    dateFn,
-    valueFn
-  } = _ref;
-  const svgRef = (0, _react.useRef)(null);
-  const tooltipRef = (0, _react.useRef)(null);
-  const tooltipState = (0, _ahooks.useReactive)({
+import React, { useEffect, useState, useRef } from 'react';
+import PropTypes from 'prop-types';
+import { useSize, useReactive } from 'ahooks';
+import Sparkline from '@arcblock/ux/lib/Sparkline';
+import Card from './card';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export default function InsightChart({
+  id,
+  title,
+  current,
+  description,
+  data,
+  dateFn,
+  valueFn
+}) {
+  const svgRef = useRef(null);
+  const tooltipRef = useRef(null);
+  const tooltipState = useReactive({
     style: {
       top: 0,
       left: 0
@@ -38,15 +23,15 @@ function InsightChart(_ref) {
     hidden: true,
     textContent: ''
   });
-  const [container, setContainer] = (0, _react.useState)(null);
-  const size = (0, _ahooks.useSize)(container);
+  const [container, setContainer] = useState(null);
+  const size = useSize(container);
   const sparklineOptions = {
     onmousemove(e, dataPoint) {
       const {
         date,
         value
       } = dataPoint;
-      tooltipState.textContent = "".concat(dateFn(date), ": ").concat(valueFn(value));
+      tooltipState.textContent = `${dateFn(date)}: ${valueFn(value)}`;
       tooltipState.style.top = -30;
       tooltipState.style.left = 80;
       tooltipState.hidden = false;
@@ -55,36 +40,38 @@ function InsightChart(_ref) {
       tooltipState.hidden = true;
     }
   };
-  (0, _react.useEffect)(() => {
+  useEffect(() => {
     setTimeout(() => {
-      setContainer(document.querySelector(".".concat(id)));
+      setContainer(document.querySelector(`.${id}`));
       setTimeout(() => {
         if (svgRef.current) {
-          (0, _Sparkline.default)(svgRef.current, data || [], sparklineOptions);
+          Sparkline(svgRef.current, data || [], sparklineOptions);
         }
       }, 400);
     });
   }, [data]); // eslint-disable-line react-hooks/exhaustive-deps
 
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_card.default, {
+  return /*#__PURE__*/_jsx(Card, {
     title: title,
     value: current,
-    graph: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-      className: "card-sparkline ".concat(id),
+    graph: /*#__PURE__*/_jsxs("div", {
+      className: `card-sparkline ${id}`,
       style: {
         marginTop: 16
       },
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("svg", {
+      children: [/*#__PURE__*/_jsx("svg", {
         ref: svgRef,
         className: "sparkline",
-        width: (size === null || size === void 0 ? void 0 : size.width) || 100,
+        width: size?.width || 100,
         height: 30,
         strokeWidth: "2"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+      }), /*#__PURE__*/_jsx("span", {
         className: "tooltip",
         ref: tooltipRef,
         hidden: tooltipState.hidden,
-        style: _objectSpread({}, tooltipState.style),
+        style: {
+          ...tooltipState.style
+        },
         children: tooltipState.textContent
       })]
     }),
@@ -92,13 +79,13 @@ function InsightChart(_ref) {
   });
 }
 InsightChart.propTypes = {
-  id: _propTypes.default.string.isRequired,
-  title: _propTypes.default.string.isRequired,
-  current: _propTypes.default.any.isRequired,
-  description: _propTypes.default.any,
-  data: _propTypes.default.array,
-  dateFn: _propTypes.default.func,
-  valueFn: _propTypes.default.func
+  id: PropTypes.string.isRequired,
+  title: PropTypes.string.isRequired,
+  current: PropTypes.any.isRequired,
+  description: PropTypes.any,
+  data: PropTypes.array,
+  dateFn: PropTypes.func,
+  valueFn: PropTypes.func
 };
 InsightChart.defaultProps = {
   description: null,

package/lib/analytics/cpu.js

@@ -1,41 +1,33 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = CpuMonitor;
-var _react = require("react");
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _context = require("@arcblock/ux/lib/Locale/context");
-var _chart = _interopRequireDefault(require("./chart"));
-var _util = require("../util");
-var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-const formatNumber = x => "".concat(x, "%");
-function CpuMonitor(_ref) {
-  let {
-    cpus,
-    currentLoad,
-    history
-  } = _ref;
+import { useContext } from 'react';
+import PropTypes from 'prop-types';
+import { LocaleContext } from '@arcblock/ux/lib/Locale/context';
+import Chart from './chart';
+import { formatTime } from '../util';
+import { jsx as _jsx } from "react/jsx-runtime";
+const formatNumber = x => `${x}%`;
+export default function CpuMonitor({
+  cpus,
+  currentLoad,
+  history
+}) {
   const {
     t,
     locale
-  } = (0, _react.useContext)(_context.LocaleContext);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_chart.default, {
+  } = useContext(LocaleContext);
+  return /*#__PURE__*/_jsx(Chart, {
     id: "cpu-sparkline",
     title: t('common.cpu'),
-    current: "".concat(Math.floor(currentLoad || 0), "%"),
+    current: `${Math.floor(currentLoad || 0)}%`,
     data: history,
-    description: "".concat(t('system.cores'), ": ").concat((cpus === null || cpus === void 0 ? void 0 : cpus.length) || 0),
-    dateFn: v => (0, _util.formatTime)(v, 'HH:mm:ss', locale),
+    description: `${t('system.cores')}: ${cpus?.length || 0}`,
+    dateFn: v => formatTime(v, 'HH:mm:ss', locale),
     valueFn: formatNumber
   });
 }
 CpuMonitor.propTypes = {
-  cpus: _propTypes.default.array,
-  currentLoad: _propTypes.default.number,
-  history: _propTypes.default.array
+  cpus: PropTypes.array,
+  currentLoad: PropTypes.number,
+  history: PropTypes.array
 };
 CpuMonitor.defaultProps = {
   cpus: [],

package/lib/analytics/disk.js

@@ -1,26 +1,14 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = DiskMonitor;
-var _react = require("react");
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _styles = require("@mui/styles");
-var _Typography = _interopRequireDefault(require("@mui/material/Typography"));
-var _LinearProgress = _interopRequireDefault(require("@mui/material/LinearProgress"));
-var _Box = _interopRequireDefault(require("@mui/material/Box"));
-var _context = require("@arcblock/ux/lib/Locale/context");
-var _card = _interopRequireDefault(require("./card"));
-var _index = require("../util/index");
-var _jsxRuntime = require("react/jsx-runtime");
-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; }
-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(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
-function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-const BorderLinearProgress = (0, _styles.withStyles)(theme => ({
+import { useContext } from 'react';
+import PropTypes from 'prop-types';
+import { withStyles } from '@mui/styles';
+import Typography from '@mui/material/Typography';
+import LinearProgress from '@mui/material/LinearProgress';
+import Box from '@mui/material/Box';
+import { LocaleContext } from '@arcblock/ux/lib/Locale/context';
+import Card from './card';
+import { filesize } from '../util/index';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const BorderLinearProgress = withStyles(theme => ({
   root: {
     height: 10
   },
@@ -30,70 +18,70 @@ const BorderLinearProgress = (0, _styles.withStyles)(theme => ({
   bar: {
     backgroundColor: theme.palette.secondary.main
   }
-}))(_LinearProgress.default);
+}))(LinearProgress);
 function LinearProgressWithLabel(props) {
   const {
     value
   } = props;
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
+  return /*#__PURE__*/_jsxs(Box, {
     display: "flex",
     alignItems: "center",
     mt: 2,
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
+    children: [/*#__PURE__*/_jsx(Box, {
       width: "100%",
       style: {
         overflow: 'hidden'
       },
       mr: 1,
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(BorderLinearProgress, _objectSpread({
-        variant: "determinate"
-      }, props))
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
+      children: /*#__PURE__*/_jsx(BorderLinearProgress, {
+        variant: "determinate",
+        ...props
+      })
+    }), /*#__PURE__*/_jsx(Box, {
       minWidth: 35,
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
+      children: /*#__PURE__*/_jsx(Typography, {
         variant: "body2",
         color: "textSecondary",
-        children: "".concat(Math.round(value), "%")
+        children: `${Math.round(value)}%`
       })
     })]
   });
 }
 LinearProgressWithLabel.propTypes = {
-  value: _propTypes.default.number.isRequired
+  value: PropTypes.number.isRequired
 };
-function DiskMonitor(_ref) {
-  let {
-    disk
-  } = _ref;
+export default function DiskMonitor({
+  disk
+}) {
   const {
     t
-  } = (0, _react.useContext)(_context.LocaleContext);
+  } = useContext(LocaleContext);
   const metrics = [{
     id: 1,
     className: 'used',
     title: t('system.used'),
-    metric: (0, _index.filesize)(disk.used)
+    metric: filesize(disk.used)
   }, {
     id: 2,
     className: 'free',
     title: t('system.free'),
-    metric: (0, _index.filesize)(disk.free)
+    metric: filesize(disk.free)
   }, {
     id: 3,
     className: 'total',
     title: t('system.total'),
-    metric: (0, _index.filesize)(disk.total)
+    metric: filesize(disk.total)
   }];
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_card.default, {
-    title: "".concat(t('common.disk'), " (").concat(disk.device, ")"),
-    value: (0, _index.filesize)(disk.used),
-    graph: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
+  return /*#__PURE__*/_jsx(Card, {
+    title: `${t('common.disk')} (${disk.device})`,
+    value: filesize(disk.used),
+    graph: /*#__PURE__*/_jsx(Box, {
       mt: 3,
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(LinearProgressWithLabel, {
+      children: /*#__PURE__*/_jsx(LinearProgressWithLabel, {
         value: disk.used / disk.total * 100
       })
     }),
-    description: metrics.map((x, index) => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
+    description: metrics.map((x, index) => /*#__PURE__*/_jsxs(Box, {
       sx: {
         marginLeft: index === 0 ? 0 : 2
       },
@@ -102,11 +90,11 @@ function DiskMonitor(_ref) {
   });
 }
 DiskMonitor.propTypes = {
-  disk: _propTypes.default.shape({
-    used: _propTypes.default.number,
-    free: _propTypes.default.number,
-    total: _propTypes.default.number,
-    device: _propTypes.default.string
+  disk: PropTypes.shape({
+    used: PropTypes.number,
+    free: PropTypes.number,
+    total: PropTypes.number,
+    device: PropTypes.string
   })
 };
 DiskMonitor.defaultProps = {