@arcblock/ux 2.9.14 → 2.9.16

package/es/Locale/selector.js

@@ -3,8 +3,8 @@ import { useState, useContext, useRef, useMemo } from 'react';
 import PropTypes from 'prop-types';
 import { Button, Typography, IconButton, Popper, MenuItem, MenuList, Box, ClickAwayListener } from '@mui/material';
 import { Icon as IconifyIcon } from '@iconify/react';
-import LanguageIcon from '@iconify-icons/material-symbols/language';
 import CheckIcon from '@iconify-icons/material-symbols/check';
+import LanguageIcon from 'iconify-icons-material-symbols-400/language';
 import noop from 'lodash/noop';
 import { getColor, getBackground } from '../Util';
 import { temp as colors } from '../Colors';

package/es/SessionBlocklet/index.js

@@ -2,7 +2,7 @@ import { useRef } from 'react';
 import PropTypes from 'prop-types';
 import { Box, ClickAwayListener, Fade, IconButton, List, ListItem, ListItemButton, Paper, Popper, Typography } from '@mui/material';
 import { Icon } from '@iconify/react';
-import DashboardOutlineRoundedIcon from '@iconify-icons/material-symbols/dashboard-outline-rounded';
+import DashboardOutlineRoundedIcon from 'iconify-icons-material-symbols-400/dashboard-outline-rounded';
 import WidgetsOutlineRoundedIcon from '@iconify-icons/material-symbols/widgets-outline-rounded';
 import { useMemoizedFn, useReactive } from 'ahooks';
 import Button from '../Button';

package/es/SessionUser/components/un-login.js

@@ -1,7 +1,7 @@
 import PropTypes from 'prop-types';
 import { Box, CircularProgress, IconButton } from '@mui/material';
 import { Icon } from '@iconify/react';
-import PersonOutlineRoundedIcon from '@iconify-icons/material-symbols/person-outline-rounded';
+import PersonOutlineRoundedIcon from 'iconify-icons-material-symbols-400/person-outline-rounded';
 import { useRef } from 'react';
 import { useMemoizedFn } from 'ahooks';
 import noop from 'lodash/noop';

package/es/Theme/theme.js

@@ -1,7 +1,16 @@
 // https://app.zeplin.io/styleguide/5d1436f1e97c2156f49c0725/colors
 import { createTheme as _createTheme, responsiveFontSizes } from '@mui/material/styles';
-import '@fontsource/lato/400.css';
-import '@fontsource/lato/700.css';
+// 为了避免加载全量的字体导致打包后体积太大，目前只选择了 latin 语系的字体
+import '@fontsource/inter/latin-400.css';
+import '@fontsource/inter/latin-500.css';
+import '@fontsource/inter/latin-600.css';
+import '@fontsource/inter/latin-700.css';
+import '@fontsource/inter/latin-900.css';
+import '@fontsource/inter/latin-ext-400.css';
+import '@fontsource/inter/latin-ext-500.css';
+import '@fontsource/inter/latin-ext-600.css';
+import '@fontsource/inter/latin-ext-700.css';
+import '@fontsource/inter/latin-ext-900.css';
 import colors from '../Colors';
 const muiDarkTheme = _createTheme({
   palette: {
@@ -50,7 +59,7 @@ export const create = ({
         main: mode === 'light' ? '#222222' : colors.common.white,
         gray: mode === 'light' ? colors.grey[500] : colors.grey[300]
       },
-      fontFamily: ['Lato', 'Avenir', '-apple-system', 'BlinkMacSystemFont', '"Segoe UI"', 'Roboto', '"Helvetica Neue"', 'Arial', 'sans-serif', '"Apple Color Emoji"', '"Segoe UI Emoji"', '"Segoe UI Symbol"'].join(','),
+      fontFamily: ['Inter', 'Avenir', '-apple-system', 'BlinkMacSystemFont', '"Segoe UI"', 'Roboto', '"Helvetica Neue"', 'Arial', 'sans-serif', '"Apple Color Emoji"', '"Segoe UI Emoji"', '"Segoe UI Symbol"'].join(','),
       // 按最新设计规范, 只使用 400/700
       fontWeightLight: 400,
       fontWeightRegular: 400,

package/lib/Locale/selector.js

@@ -8,8 +8,8 @@ var _react = require("react");
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _material = require("@mui/material");
 var _react2 = require("@iconify/react");
-var _language = _interopRequireDefault(require("@iconify-icons/material-symbols/language"));
 var _check = _interopRequireDefault(require("@iconify-icons/material-symbols/check"));
+var _language = _interopRequireDefault(require("iconify-icons-material-symbols-400/language"));
 var _noop = _interopRequireDefault(require("lodash/noop"));
 var _Util = require("../Util");
 var _Colors = require("../Colors");

package/lib/SessionBlocklet/index.js

@@ -8,7 +8,7 @@ var _react = require("react");
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _material = require("@mui/material");
 var _react2 = require("@iconify/react");
-var _dashboardOutlineRounded = _interopRequireDefault(require("@iconify-icons/material-symbols/dashboard-outline-rounded"));
+var _dashboardOutlineRounded = _interopRequireDefault(require("iconify-icons-material-symbols-400/dashboard-outline-rounded"));
 var _widgetsOutlineRounded = _interopRequireDefault(require("@iconify-icons/material-symbols/widgets-outline-rounded"));
 var _ahooks = require("ahooks");
 var _Button = _interopRequireDefault(require("../Button"));

package/lib/SessionUser/components/un-login.js

@@ -7,7 +7,7 @@ exports.default = UnLogin;
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _material = require("@mui/material");
 var _react = require("@iconify/react");
-var _personOutlineRounded = _interopRequireDefault(require("@iconify-icons/material-symbols/person-outline-rounded"));
+var _personOutlineRounded = _interopRequireDefault(require("iconify-icons-material-symbols-400/person-outline-rounded"));
 var _react2 = require("react");
 var _ahooks = require("ahooks");
 var _noop = _interopRequireDefault(require("lodash/noop"));

package/lib/Theme/theme.js

@@ -5,10 +5,19 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.createTheme = exports.create = void 0;
 var _styles = require("@mui/material/styles");
-require("@fontsource/lato/400.css");
-require("@fontsource/lato/700.css");
+require("@fontsource/inter/latin-400.css");
+require("@fontsource/inter/latin-500.css");
+require("@fontsource/inter/latin-600.css");
+require("@fontsource/inter/latin-700.css");
+require("@fontsource/inter/latin-900.css");
+require("@fontsource/inter/latin-ext-400.css");
+require("@fontsource/inter/latin-ext-500.css");
+require("@fontsource/inter/latin-ext-600.css");
+require("@fontsource/inter/latin-ext-700.css");
+require("@fontsource/inter/latin-ext-900.css");
 var _Colors = _interopRequireDefault(require("../Colors"));
 const _excluded = ["mode", "pageWidth", "palette", "typography", "overrides"]; // https://app.zeplin.io/styleguide/5d1436f1e97c2156f49c0725/colors
+// 为了避免加载全量的字体导致打包后体积太大，目前只选择了 latin 语系的字体
 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; }
@@ -64,7 +73,7 @@ const create = exports.create = function create() {
         main: mode === 'light' ? '#222222' : _Colors.default.common.white,
         gray: mode === 'light' ? _Colors.default.grey[500] : _Colors.default.grey[300]
       },
-      fontFamily: ['Lato', 'Avenir', '-apple-system', 'BlinkMacSystemFont', '"Segoe UI"', 'Roboto', '"Helvetica Neue"', 'Arial', 'sans-serif', '"Apple Color Emoji"', '"Segoe UI Emoji"', '"Segoe UI Symbol"'].join(','),
+      fontFamily: ['Inter', 'Avenir', '-apple-system', 'BlinkMacSystemFont', '"Segoe UI"', 'Roboto', '"Helvetica Neue"', 'Arial', 'sans-serif', '"Apple Color Emoji"', '"Segoe UI Emoji"', '"Segoe UI Symbol"'].join(','),
       // 按最新设计规范, 只使用 400/700
       fontWeightLight: 400,
       fontWeightRegular: 400,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@arcblock/ux",
-  "version": "2.9.14",
+  "version": "2.9.16",
   "description": "Common used react components for arcblock products",
   "keywords": [
     "react",
@@ -344,17 +344,17 @@
   "peerDependencies": {
     "react": ">=18.1.0"
   },
-  "gitHead": "7570827021dde66a0099a84256dfceaec07fd6b3",
+  "gitHead": "d970601a888adbd27f76ee9ce490bc8f93f11833",
   "dependencies": {
     "@arcblock/did-motif": "^1.1.13",
-    "@arcblock/icons": "^2.9.14",
-    "@arcblock/nft-display": "^2.9.14",
-    "@arcblock/react-hooks": "^2.9.14",
+    "@arcblock/icons": "^2.9.16",
+    "@arcblock/nft-display": "^2.9.16",
+    "@arcblock/react-hooks": "^2.9.16",
     "@babel/plugin-syntax-dynamic-import": "^7.8.3",
     "@emotion/react": "^11.10.4",
     "@emotion/styled": "^11.10.4",
-    "@fontsource/lato": "^4.5.10",
-    "@fontsource/ubuntu-mono": "^4.5.11",
+    "@fontsource/inter": "^5.0.16",
+    "@fontsource/ubuntu-mono": "^5.0.18",
     "@iconify-icons/logos": "^1.2.36",
     "@iconify-icons/material-symbols": "^1.2.58",
     "@iconify-icons/mdi": "^1.2.48",
@@ -373,6 +373,7 @@
     "devices.css": "^0.1.15",
     "highlight.js": "^11.6.0",
     "iconify-icon": "^1.0.8",
+    "iconify-icons-material-symbols-400": "^0.0.1",
     "is-svg": "^4.3.2",
     "js-cookie": "^2.2.1",
     "lodash": "^4.17.21",

package/src/Locale/selector.jsx

@@ -3,8 +3,8 @@ import { useState, useContext, useRef, useMemo } from 'react';
 import PropTypes from 'prop-types';
 import { Button, Typography, IconButton, Popper, MenuItem, MenuList, Box, ClickAwayListener } from '@mui/material';
 import { Icon as IconifyIcon } from '@iconify/react';
-import LanguageIcon from '@iconify-icons/material-symbols/language';
 import CheckIcon from '@iconify-icons/material-symbols/check';
+import LanguageIcon from 'iconify-icons-material-symbols-400/language';
 import noop from 'lodash/noop';
 
 import { getColor, getBackground } from '../Util';

package/src/SessionBlocklet/index.jsx

@@ -13,7 +13,7 @@ import {
   Typography,
 } from '@mui/material';
 import { Icon } from '@iconify/react';
-import DashboardOutlineRoundedIcon from '@iconify-icons/material-symbols/dashboard-outline-rounded';
+import DashboardOutlineRoundedIcon from 'iconify-icons-material-symbols-400/dashboard-outline-rounded';
 import WidgetsOutlineRoundedIcon from '@iconify-icons/material-symbols/widgets-outline-rounded';
 import { useMemoizedFn, useReactive } from 'ahooks';
 

package/src/SessionUser/components/un-login.jsx

@@ -1,7 +1,7 @@
 import PropTypes from 'prop-types';
 import { Box, CircularProgress, IconButton } from '@mui/material';
 import { Icon } from '@iconify/react';
-import PersonOutlineRoundedIcon from '@iconify-icons/material-symbols/person-outline-rounded';
+import PersonOutlineRoundedIcon from 'iconify-icons-material-symbols-400/person-outline-rounded';
 import { useRef } from 'react';
 import { useMemoizedFn } from 'ahooks';
 import noop from 'lodash/noop';

package/src/Theme/theme.js

@@ -1,7 +1,17 @@
 // https://app.zeplin.io/styleguide/5d1436f1e97c2156f49c0725/colors
 import { createTheme as _createTheme, responsiveFontSizes } from '@mui/material/styles';
-import '@fontsource/lato/400.css';
-import '@fontsource/lato/700.css';
+// 为了避免加载全量的字体导致打包后体积太大，目前只选择了 latin 语系的字体
+import '@fontsource/inter/latin-400.css';
+import '@fontsource/inter/latin-500.css';
+import '@fontsource/inter/latin-600.css';
+import '@fontsource/inter/latin-700.css';
+import '@fontsource/inter/latin-900.css';
+import '@fontsource/inter/latin-ext-400.css';
+import '@fontsource/inter/latin-ext-500.css';
+import '@fontsource/inter/latin-ext-600.css';
+import '@fontsource/inter/latin-ext-700.css';
+import '@fontsource/inter/latin-ext-900.css';
+
 import colors from '../Colors';
 
 const muiDarkTheme = _createTheme({ palette: { mode: 'dark' } });
@@ -52,7 +62,7 @@ export const create = ({ mode = 'light', pageWidth = 'md', palette, typography,
           gray: mode === 'light' ? colors.grey[500] : colors.grey[300],
         },
         fontFamily: [
-          'Lato',
+          'Inter',
           'Avenir',
           '-apple-system',
           'BlinkMacSystemFont',