@arcblock/ux 2.9.69 → 2.9.71

package/es/SessionUser/components/logged-in.js

@@ -124,6 +124,11 @@ export default function LoggedIn({
               onSwitchAccount: handleSwitchAccount,
               onSwitchProfile: handleSwitchProfile,
               onBindWallet: handleBindWallet
+            }), /*#__PURE__*/_jsx(Divider, {
+              sx: {
+                m: '0!important',
+                borderColor: colors.strokeSep
+              }
             }), /*#__PURE__*/_jsxs(MenuList, {
               sx: {
                 p: 0
@@ -155,7 +160,7 @@ export default function LoggedIn({
                 }), /*#__PURE__*/_jsx(Divider, {
                   sx: {
                     m: '0!important',
-                    borderColor: colors.lineStep
+                    borderColor: colors.strokeSep
                   }
                 })]
               }) : null, /*#__PURE__*/_jsx(SessionMenuItem, {

package/es/SessionUser/components/session-user-switch.js

@@ -79,7 +79,6 @@ export default function SessionUserSwitch({
         color: colors.textMuted
       }),
       sx: {
-        border: `1px solid ${colors.borderBase}`,
         borderRadius: 2,
         cursor: 'pointer',
         py: 1.25,
@@ -93,16 +92,26 @@ export default function SessionUserSwitch({
   return /*#__PURE__*/_jsxs(_Fragment, {
     children: [/*#__PURE__*/_jsx(SessionUserItem, {
       sessionItem: currentSession,
-      statusContent: /*#__PURE__*/_jsx(Icon, {
+      statusContent: /*#__PURE__*/_jsx(Box, {
+        component: Icon,
         icon: ExpandMoreRoundedIcon,
-        color: colors.textMuted
+        className: "session-user-switch-icon",
+        sx: {
+          transform: 'scale(1.5) rotate(-90deg)',
+          transition: 'transform 0.2s ease'
+        }
       }),
       sx: {
-        border: `1px solid ${colors.borderBase}`,
         borderRadius: 2,
         cursor: 'pointer',
         py: 1.25,
-        px: 1.5
+        px: 2,
+        '&:hover': {
+          backgroundColor: `${colors.surfacePrimarySubtitle} !important`,
+          '.session-user-switch-icon': {
+            transform: 'scale(1.5)'
+          }
+        }
       },
       onClick: () => onTogglePopper(),
       ref: popperAnchorRef

package/es/SessionUser/components/user-info.js

@@ -33,7 +33,8 @@ export default function UserInfo({
   }, [session?.user]);
   return /*#__PURE__*/_jsxs(Box, {
     sx: {
-      p: 2,
+      py: 2,
+      px: 0.5,
       pb: 1,
       display: 'flex',
       flexDirection: 'column',
@@ -44,7 +45,8 @@ export default function UserInfo({
         display: 'flex',
         justifyContent: 'space-between',
         alignItems: 'center',
-        gap: 1
+        gap: 1,
+        px: 2
       },
       children: [/*#__PURE__*/_jsxs(Box, {
         sx: {

package/lib/SessionUser/components/logged-in.js

@@ -143,6 +143,11 @@ function LoggedIn(_ref) {
                 onSwitchAccount: handleSwitchAccount,
                 onSwitchProfile: handleSwitchProfile,
                 onBindWallet: handleBindWallet
+              }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Divider, {
+                sx: {
+                  m: '0!important',
+                  borderColor: _Colors.temp.strokeSep
+                }
               }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.MenuList, {
                 sx: {
                   p: 0
@@ -174,7 +179,7 @@ function LoggedIn(_ref) {
                   }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Divider, {
                     sx: {
                       m: '0!important',
-                      borderColor: _Colors.temp.lineStep
+                      borderColor: _Colors.temp.strokeSep
                     }
                   })]
                 }) : null, /*#__PURE__*/(0, _jsxRuntime.jsx)(SessionMenuItem, {

package/lib/SessionUser/components/session-user-switch.js

@@ -96,7 +96,6 @@ function SessionUserSwitch(_ref) {
         color: _Colors.temp.textMuted
       }),
       sx: {
-        border: "1px solid ".concat(_Colors.temp.borderBase),
         borderRadius: 2,
         cursor: 'pointer',
         py: 1.25,
@@ -110,16 +109,26 @@ function SessionUserSwitch(_ref) {
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_sessionUserItem.default, {
       sessionItem: currentSession,
-      statusContent: /*#__PURE__*/(0, _jsxRuntime.jsx)(_react2.Icon, {
+      statusContent: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
+        component: _react2.Icon,
         icon: _expandMoreRounded.default,
-        color: _Colors.temp.textMuted
+        className: "session-user-switch-icon",
+        sx: {
+          transform: 'scale(1.5) rotate(-90deg)',
+          transition: 'transform 0.2s ease'
+        }
       }),
       sx: {
-        border: "1px solid ".concat(_Colors.temp.borderBase),
         borderRadius: 2,
         cursor: 'pointer',
         py: 1.25,
-        px: 1.5
+        px: 2,
+        '&:hover': {
+          backgroundColor: "".concat(_Colors.temp.surfacePrimarySubtitle, " !important"),
+          '.session-user-switch-icon': {
+            transform: 'scale(1.5)'
+          }
+        }
       },
       onClick: () => onTogglePopper(),
       ref: popperAnchorRef

package/lib/SessionUser/components/user-info.js

@@ -45,7 +45,8 @@ function UserInfo(_ref) {
   }, [session === null || session === void 0 ? void 0 : session.user]);
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
     sx: {
-      p: 2,
+      py: 2,
+      px: 0.5,
       pb: 1,
       display: 'flex',
       flexDirection: 'column',
@@ -56,7 +57,8 @@ function UserInfo(_ref) {
         display: 'flex',
         justifyContent: 'space-between',
         alignItems: 'center',
-        gap: 1
+        gap: 1,
+        px: 2
       },
       children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
         sx: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@arcblock/ux",
-  "version": "2.9.69",
+  "version": "2.9.71",
   "description": "Common used react components for arcblock products",
   "keywords": [
     "react",
@@ -359,12 +359,12 @@
     "react": ">=18.2.0",
     "react-router-dom": ">=6.22.3"
   },
-  "gitHead": "375716410d5c6dc796fbd8dcd3240b846a5e1b33",
+  "gitHead": "472ec48604515c1dd0d6ea46665d597091fe6d14",
   "dependencies": {
     "@arcblock/did-motif": "^1.1.13",
-    "@arcblock/icons": "^2.9.69",
-    "@arcblock/nft-display": "^2.9.69",
-    "@arcblock/react-hooks": "^2.9.69",
+    "@arcblock/icons": "^2.9.71",
+    "@arcblock/nft-display": "^2.9.71",
+    "@arcblock/react-hooks": "^2.9.71",
     "@babel/plugin-syntax-dynamic-import": "^7.8.3",
     "@emotion/react": "^11.10.4",
     "@emotion/styled": "^11.10.4",

package/src/SessionUser/components/logged-in.jsx

@@ -112,6 +112,7 @@ export default function LoggedIn({ session, dark, onBindWallet, isBlocklet, loca
                   onSwitchProfile={handleSwitchProfile}
                   onBindWallet={handleBindWallet}
                 />
+                <Divider sx={{ m: '0!important', borderColor: colors.strokeSep }} />
                 <MenuList sx={{ p: 0 }}>
                   {isBlocklet ? (
                     <>
@@ -131,7 +132,7 @@ export default function LoggedIn({ session, dark, onBindWallet, isBlocklet, loca
                         href={PROFILE_URL}
                         sx={{ display: 'block', textDecoration: 'none', color: 'inherit' }}
                       />
-                      <Divider sx={{ m: '0!important', borderColor: colors.lineStep }} />
+                      <Divider sx={{ m: '0!important', borderColor: colors.strokeSep }} />
                     </>
                   ) : null}
                   <SessionMenuItem

package/src/SessionUser/components/session-user-switch.jsx

@@ -95,7 +95,6 @@ export default function SessionUserSwitch({ session, onSwitch, isBlocklet, local
         sessionItem={currentSession}
         statusContent={<Icon icon={SwapHorizRoundedIcon} color={colors.textMuted} />}
         sx={{
-          border: `1px solid ${colors.borderBase}`,
           borderRadius: 2,
           cursor: 'pointer',
           py: 1.25,
@@ -111,13 +110,28 @@ export default function SessionUserSwitch({ session, onSwitch, isBlocklet, local
     <>
       <SessionUserItem
         sessionItem={currentSession}
-        statusContent={<Icon icon={ExpandMoreRoundedIcon} color={colors.textMuted} />}
+        statusContent={
+          <Box
+            component={Icon}
+            icon={ExpandMoreRoundedIcon}
+            className="session-user-switch-icon"
+            sx={{
+              transform: 'scale(1.5) rotate(-90deg)',
+              transition: 'transform 0.2s ease',
+            }}
+          />
+        }
         sx={{
-          border: `1px solid ${colors.borderBase}`,
           borderRadius: 2,
           cursor: 'pointer',
           py: 1.25,
-          px: 1.5,
+          px: 2,
+          '&:hover': {
+            backgroundColor: `${colors.surfacePrimarySubtitle} !important`,
+            '.session-user-switch-icon': {
+              transform: 'scale(1.5)',
+            },
+          },
         }}
         onClick={() => onTogglePopper()}
         ref={popperAnchorRef}

package/src/SessionUser/components/user-info.jsx

@@ -39,7 +39,8 @@ export default function UserInfo({
   return (
     <Box
       sx={{
-        p: 2,
+        py: 2,
+        px: 0.5,
         pb: 1,
         display: 'flex',
         flexDirection: 'column',
@@ -51,6 +52,7 @@ export default function UserInfo({
           justifyContent: 'space-between',
           alignItems: 'center',
           gap: 1,
+          px: 2,
         }}>
         <Box
           sx={{