@arcblock/ux 2.1.33 → 2.1.36

package/lib/Locale/selector.js

@@ -183,4 +183,4 @@ exports.default = _default;
 const Div = _styledComponents.default.div.withConfig({
   displayName: "selector__Div",
   componentId: "sc-wfz3sf-0"
-})([".trigger{display:flex;flex-direction:column;justify-content:center;font-size:14px;.trigger-image{width:", "px;height:", "px;}.trigger-text{margin-left:5px;font-size:14px;color:", ";}}.locales{background:", ";}.locale-item{font-size:16px;font-style:normal;font-stretch:normal;line-height:normal;letter-spacing:2px;text-align:center;color:", ";cursor:pointer;display:flex;padding:16px;align-items:center;.check-icon{visibility:hidden;margin-right:4px;}.check-icon-visible{visibility:visible;}}"], props => props.size, props => props.size, props => (0, _Util.getColor)(props), props => (0, _Util.getBackground)(props), props => (0, _Util.getColor)(props));
+})(["display:inline-block;.trigger{display:flex;flex-direction:column;justify-content:center;font-size:14px;.trigger-image{width:", "px;height:", "px;}.trigger-text{margin-left:5px;font-size:14px;color:", ";}}.locales{background:", ";}.locale-item{font-size:16px;font-style:normal;font-stretch:normal;line-height:normal;letter-spacing:2px;text-align:center;color:", ";cursor:pointer;display:flex;padding:16px;align-items:center;.check-icon{visibility:hidden;margin-right:4px;}.check-icon-visible{visibility:visible;}}"], props => props.size, props => props.size, props => (0, _Util.getColor)(props), props => (0, _Util.getBackground)(props), props => (0, _Util.getColor)(props));

package/lib/NavMenu/nav-menu.js

@@ -104,10 +104,14 @@ function NavMenu(_ref) {
     });
   }, [state, mode, activate, open, close]);
   (0, _react.useEffect)(() => {
-    if (activeId) {
-      activate(activeId);
+    // NavMenu#activeId 和 Item#active prop 都可以用来控制激活状态 (一般不会混用这两种方式)
+    // 如果未传入 NavMenu#activeId, 应该避免设置一个空值的 activeId 状态 (会与 Item#active 冲突)
+    if (activeId !== undefined && activeId !== null) {
+      setState(prev => _objectSpread(_objectSpread({}, prev), {}, {
+        activeId
+      }));
     }
-  }, [activate, activeId]);
+  }, [activeId]);
   const classes = (0, _clsx.default)('navmenu', "navmenu--".concat(mode), rest.className);
 
   const renderItem = (item, index) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@arcblock/ux",
-  "version": "2.1.33",
+  "version": "2.1.36",
   "description": "Common used react components for arcblock products",
   "keywords": [
     "react",
@@ -52,10 +52,10 @@
     "react": ">=18.1.0",
     "react-ga": "^2.7.0"
   },
-  "gitHead": "616c11e20c48d33f153258bcf00eba030dabf648",
+  "gitHead": "fc0e64437926f532b89f8e027da4df083a705fec",
   "dependencies": {
-    "@arcblock/icons": "^2.1.33",
-    "@arcblock/react-hooks": "^2.1.33",
+    "@arcblock/icons": "^2.1.36",
+    "@arcblock/react-hooks": "^2.1.36",
     "@babel/plugin-syntax-dynamic-import": "^7.8.3",
     "@emotion/react": "^11.9.0",
     "@emotion/styled": "^11.8.1",

package/src/Locale/selector.js

@@ -125,6 +125,7 @@ LocaleSelector.defaultProps = {
 export default LocaleSelector;
 
 const Div = styled.div`
+  display: inline-block;
   .trigger {
     display: flex;
     flex-direction: column;

package/src/NavMenu/nav-menu.js

@@ -54,10 +54,12 @@ function NavMenu({ items, mode, children, activeId, textColor, activeTextColor,
   }, [state, mode, activate, open, close]);
 
   useEffect(() => {
-    if (activeId) {
-      activate(activeId);
+    // NavMenu#activeId 和 Item#active prop 都可以用来控制激活状态 (一般不会混用这两种方式)
+    // 如果未传入 NavMenu#activeId, 应该避免设置一个空值的 activeId 状态 (会与 Item#active 冲突)
+    if (activeId !== undefined && activeId !== null) {
+      setState((prev) => ({ ...prev, activeId }));
     }
-  }, [activate, activeId]);
+  }, [activeId]);
 
   const classes = clsx('navmenu', `navmenu--${mode}`, rest.className);
   const renderItem = (item, index) => {