@arcblock/ux 2.9.43 → 2.9.45

package/es/Layout/dashboard/index.js

@@ -123,7 +123,7 @@ function Dashboard({
       children: [/*#__PURE__*/_jsx(Hidden, {
         mdDown: true,
         children: !!links?.length && sidebarVisible && /*#__PURE__*/_jsx(Box, {
-          className: "dashboard-sidebar",
+          className: ['dashboard-sidebar', _dense ? '' : 'dashboard-sidebar-padding'].join(' '),
           children: /*#__PURE__*/_jsx(Sidebar, {
             links: links,
             dense: _dense
@@ -208,6 +208,12 @@ const Wrapper = styled('div', {
       overflow-y: auto;
     }
   }
+  .dashboard-sidebar-padding {
+    &:hover {
+      padding-left: 15px;
+      overflow-y: auto;
+    }
+  }
   .dashboard-main {
     display: flex;
     flex-direction: column;

package/es/Locale/selector.js

@@ -63,12 +63,11 @@ export default function LocaleSelector(props) {
     return /*#__PURE__*/_jsx(IconifyIcon, {
       icon: LanguageIcon,
       fontSize: size,
-      color: theme.palette.text.secondary,
       style: {
         transform: 'scale(1.10)'
       }
     });
-  }, [Icon, theme?.palette?.text?.secondary, size]);
+  }, [Icon, size]);
   return /*#__PURE__*/_jsxs(Div, {
     component: "div",
     dark: dark,

package/lib/Layout/dashboard/index.js

@@ -142,7 +142,7 @@ function Dashboard(_ref2) {
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Hidden.default, {
         mdDown: true,
         children: !!(links !== null && links !== void 0 && links.length) && sidebarVisible && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
-          className: "dashboard-sidebar",
+          className: ['dashboard-sidebar', _dense ? '' : 'dashboard-sidebar-padding'].join(' '),
           children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_sidebar.default, {
             links: links,
             dense: _dense
@@ -206,7 +206,7 @@ Dashboard.defaultProps = {
 };
 const Wrapper = (0, _Theme.styled)('div', {
   shouldForwardProp: prop => prop !== 'sidebarWidth'
-})(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  &.dashboard {\n    display: flex;\n    flex-direction: column;\n    height: 100vh;\n  }\n  .dashboard-body {\n    overflow: hidden;\n    flex: 1;\n  }\n  .dashboard-sidebar {\n    box-sizing: border-box;\n    flex: 0 0 auto;\n    width: ", "px;\n    overflow: hidden;\n    &:hover {\n      overflow-y: auto;\n    }\n  }\n  .dashboard-main {\n    display: flex;\n    flex-direction: column;\n    overflow: auto;\n    flex: 1;\n    position: relative;\n  }\n  .dashboard-content {\n    flex: 1;\n  }\n  &.dashboard-dense {\n    .dashboard-header {\n      border-bottom: 1px solid #eee;\n    }\n    .dashboard-sidebar {\n      width: 256px;\n      border-right: 1px solid #eee;\n    }\n  }\n  ", " {\n    .header-logo {\n      display: flex;\n      justify-content: center;\n      /* logo \u4E0E sidebar \u4E2D\u7684 icon \u5782\u76F4\u5BF9\u9F50, sidebarWidth - 24 * 2 */\n      min-width: ", "px;\n    }\n    &.dashboard-dense {\n      .header-logo {\n        /* dense = true \u65F6 logo \u4E0E sidenav icons \u4E0D\u9700\u8981\u5BF9\u9F50 */\n        width: auto;\n      }\n    }\n  }\n"])), props => props.sidebarWidth, props => props.theme.breakpoints.up('md'), props => props.sidebarWidth - 24 * 2);
+})(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  &.dashboard {\n    display: flex;\n    flex-direction: column;\n    height: 100vh;\n  }\n  .dashboard-body {\n    overflow: hidden;\n    flex: 1;\n  }\n  .dashboard-sidebar {\n    box-sizing: border-box;\n    flex: 0 0 auto;\n    width: ", "px;\n    overflow: hidden;\n    &:hover {\n      overflow-y: auto;\n    }\n  }\n  .dashboard-sidebar-padding {\n    &:hover {\n      padding-left: 15px;\n      overflow-y: auto;\n    }\n  }\n  .dashboard-main {\n    display: flex;\n    flex-direction: column;\n    overflow: auto;\n    flex: 1;\n    position: relative;\n  }\n  .dashboard-content {\n    flex: 1;\n  }\n  &.dashboard-dense {\n    .dashboard-header {\n      border-bottom: 1px solid #eee;\n    }\n    .dashboard-sidebar {\n      width: 256px;\n      border-right: 1px solid #eee;\n    }\n  }\n  ", " {\n    .header-logo {\n      display: flex;\n      justify-content: center;\n      /* logo \u4E0E sidebar \u4E2D\u7684 icon \u5782\u76F4\u5BF9\u9F50, sidebarWidth - 24 * 2 */\n      min-width: ", "px;\n    }\n    &.dashboard-dense {\n      .header-logo {\n        /* dense = true \u65F6 logo \u4E0E sidenav icons \u4E0D\u9700\u8981\u5BF9\u9F50 */\n        width: auto;\n      }\n    }\n  }\n"])), props => props.sidebarWidth, props => props.theme.breakpoints.up('md'), props => props.sidebarWidth - 24 * 2);
 const StyledUxHeader = (0, _Theme.styled)(_Header.ResponsiveHeader)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  .header-container {\n    max-width: 100%;\n  }\n"])));
 
 // 兼容旧版 dashboard

package/lib/Locale/selector.js

@@ -29,7 +29,7 @@ function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e =
 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 LocaleSelector(props) {
-  var _theme$palette, _theme$palette2, _theme$palette2$text;
+  var _theme$palette;
   const {
       showText,
       popperProps,
@@ -81,12 +81,11 @@ function LocaleSelector(props) {
     return /*#__PURE__*/(0, _jsxRuntime.jsx)(_react2.Icon, {
       icon: _language.default,
       fontSize: size,
-      color: theme.palette.text.secondary,
       style: {
         transform: 'scale(1.10)'
       }
     });
-  }, [Icon, theme === null || theme === void 0 ? void 0 : (_theme$palette2 = theme.palette) === null || _theme$palette2 === void 0 ? void 0 : (_theme$palette2$text = _theme$palette2.text) === null || _theme$palette2$text === void 0 ? void 0 : _theme$palette2$text.secondary, size]);
+  }, [Icon, size]);
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(Div, _objectSpread(_objectSpread(_objectSpread({
     component: "div",
     dark: dark,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@arcblock/ux",
-  "version": "2.9.43",
+  "version": "2.9.45",
   "description": "Common used react components for arcblock products",
   "keywords": [
     "react",
@@ -354,12 +354,12 @@
     "@mui/material": "^5.15.0",
     "react": ">=18.2.0"
   },
-  "gitHead": "2299d749c24452b4cebe4c094d682f9af1f3d9bf",
+  "gitHead": "8b32fcb561bce3aafb464458b0e0123668ef6f6f",
   "dependencies": {
     "@arcblock/did-motif": "^1.1.13",
-    "@arcblock/icons": "^2.9.43",
-    "@arcblock/nft-display": "^2.9.43",
-    "@arcblock/react-hooks": "^2.9.43",
+    "@arcblock/icons": "^2.9.45",
+    "@arcblock/nft-display": "^2.9.45",
+    "@arcblock/react-hooks": "^2.9.45",
     "@babel/plugin-syntax-dynamic-import": "^7.8.3",
     "@emotion/react": "^11.10.4",
     "@emotion/styled": "^11.10.4",

package/src/Layout/dashboard/index.js

@@ -94,7 +94,7 @@ function Dashboard({ children, title, headerProps, links = [], fullWidth, dense,
       <Box display="flex" className="dashboard-body">
         <Hidden mdDown>
           {!!links?.length && sidebarVisible && (
-            <Box className="dashboard-sidebar">
+            <Box className={['dashboard-sidebar', _dense ? '' : 'dashboard-sidebar-padding'].join(' ')}>
               <Sidebar links={links} dense={_dense} />
             </Box>
           )}
@@ -175,6 +175,12 @@ const Wrapper = styled('div', {
       overflow-y: auto;
     }
   }
+  .dashboard-sidebar-padding {
+    &:hover {
+      padding-left: 15px;
+      overflow-y: auto;
+    }
+  }
   .dashboard-main {
     display: flex;
     flex-direction: column;

package/src/Locale/selector.jsx

@@ -58,15 +58,8 @@ export default function LocaleSelector(props) {
       return <Icon />;
     }
 
-    return (
-      <IconifyIcon
-        icon={LanguageIcon}
-        fontSize={size}
-        color={theme.palette.text.secondary}
-        style={{ transform: 'scale(1.10)' }}
-      />
-    );
-  }, [Icon, theme?.palette?.text?.secondary, size]);
+    return <IconifyIcon icon={LanguageIcon} fontSize={size} style={{ transform: 'scale(1.10)' }} />;
+  }, [Icon, size]);
 
   return (
     <Div component="div" dark={dark} theme={theme} {...rest} {...handleEventProps}>