@nutui/nutui-react-taro 1.3.6 → 1.3.7

package/CHANGELOG.md

@@ -1,3 +1,10 @@
+# v1.3.7
+`2022-10-19`
+* :sparkles: feat: 优化 menu 组件的弹出动画效果 (#341) @oasis-cloud
+* :sparkles: chore: add issue template (#334) @oasis-cloud
+* :bug: fix: feat: Audio 组件 Demo 变量名修改 (#340) @libin0824
+* :bug: fix: Collapse 改变变量的名字 (#336) @zhenyulei
+
 # v1.3.6
 `2022-10-12`
 * :sparkles: feat: Swipe 组件适配小程序，Searchbar 增加 onCancel 回调函数 (#311) @Ymm0008

package/dist/esm/Menu.js

@@ -1,5 +1,5 @@
-import { M as Menu } from './menu.taro-9345dcfd.js';
-export { M as default } from './menu.taro-9345dcfd.js';
+import { M as Menu } from './menu.taro-f8ca86db.js';
+export { M as default } from './menu.taro-f8ca86db.js';
 import 'react';
 import 'classnames';
 import './icon.taro-1d0d4fb7.js';

package/dist/esm/MenuItem.js

@@ -1,5 +1,5 @@
-import { M as MenuItem } from './menuitem.taro-fc0961b7.js';
-export { M as default } from './menuitem.taro-fc0961b7.js';
+import { M as MenuItem } from './menuitem.taro-7bf564c9.js';
+export { M as default } from './menuitem.taro-7bf564c9.js';
 import 'react';
 import 'classnames';
 import 'react-transition-group';

package/dist/esm/{menu.taro-9345dcfd.js → menu.taro-f8ca86db.js}

@@ -88,6 +88,8 @@ var Menu = function Menu(props) {
   }, rest), {}, {
     ref: parentRef
   }), React__default.createElement("div", {
+    className: "nut-menu-relative"
+  }, React__default.createElement("div", {
     className: "nut-menu__bar ".concat(itemShow.includes(true) ? 'opened' : '', " ").concat(className)
   }, React__default.Children.toArray(children).map(function (child, index) {
     if (!child) return null;
@@ -132,7 +134,7 @@ var Menu = function Menu(props) {
       size: "10",
       name: titleIcon || (direction === 'up' ? 'arrow-up' : 'down-arrow')
     })));
-  })), cloneChildren());
+  })), cloneChildren()));
 };
 Menu.defaultProps = defaultProps;
 Menu.displayName = 'NutMenu';

package/dist/esm/{menuitem.taro-fc0961b7.js → menuitem.taro-7bf564c9.js}

@@ -150,12 +150,12 @@ var MenuItem = function MenuItem(props) {
       parent.closeOnClickOverlay && parent.toggleItemShow(orderKey);
     }
   }), React__default.createElement("div", {
-    className: "nut-menu-item__wrap",
-    style: _objectSpread(_objectSpread({}, getPosition()), isShow())
+    className: direction === 'down' ? 'nut-menu-item__wrap' : 'nut-menu-item__wrap-up',
+    style: _objectSpread({}, isShow())
   }, React__default.createElement(CSSTransition, {
     "in": _showPopup,
     timeout: 100,
-    classNames: "menu-item"
+    classNames: direction === 'down' ? 'menu-item' : 'menu-item-up'
   }, React__default.createElement("div", {
     className: "nut-menu-item__content"
   }, options === null || options === void 0 ? void 0 : options.map(function (item, index) {

package/dist/esm/nutui-react.es.js

@@ -24,8 +24,8 @@ export { I as Indicator } from './indicator.taro-183ea169.js';
 export { S as SideNavBar } from './sidenavbar.taro-87f056cd.js';
 export { S as SubSideNavBar } from './subsidenavbar.taro-2c1fcf16.js';
 export { S as SideNavBarItem } from './sidenavbaritem.taro-77e077f4.js';
-export { M as Menu } from './menu.taro-9345dcfd.js';
-export { M as MenuItem } from './menuitem.taro-fc0961b7.js';
+export { M as Menu } from './menu.taro-f8ca86db.js';
+export { M as MenuItem } from './menuitem.taro-7bf564c9.js';
 export { R as Range } from './range.taro-fc7c0b6a.js';
 export { C as Calendar } from './calendar.taro-533b3219.js';
 export { C as Checkbox } from './checkbox.taro-104557c1.js';

package/dist/locales/base.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui-react-taro v1.3.6 Wed Oct 12 2022 18:14:47 GMT+0800 (中国标准时间)
+* @nutui/nutui-react-taro v1.3.7 Wed Oct 19 2022 16:59:53 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */

package/dist/locales/en-US.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui-react-taro v1.3.6 Wed Oct 12 2022 18:14:47 GMT+0800 (中国标准时间)
+* @nutui/nutui-react-taro v1.3.7 Wed Oct 19 2022 16:59:53 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */

package/dist/locales/id-ID.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui-react-taro v1.3.6 Wed Oct 12 2022 18:14:47 GMT+0800 (中国标准时间)
+* @nutui/nutui-react-taro v1.3.7 Wed Oct 19 2022 16:59:53 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */

package/dist/locales/zh-CN.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui-react-taro v1.3.6 Wed Oct 12 2022 18:14:47 GMT+0800 (中国标准时间)
+* @nutui/nutui-react-taro v1.3.7 Wed Oct 19 2022 16:59:53 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */

package/dist/locales/zh-TW.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui-react-taro v1.3.6 Wed Oct 12 2022 18:14:47 GMT+0800 (中国标准时间)
+* @nutui/nutui-react-taro v1.3.7 Wed Oct 19 2022 16:59:53 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */

package/dist/nutui.react.es.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui-react-taro v1.3.6 Wed Oct 12 2022 18:14:05 GMT+0800 (中国标准时间)
+* @nutui/nutui-react-taro v1.3.7 Wed Oct 19 2022 16:59:16 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */
@@ -3938,6 +3938,8 @@ const Menu = (props) => {
     className: `nut-menu ${className}`,
     ...rest,
     ref: parentRef
+  }, /* @__PURE__ */ React__default.createElement("div", {
+    className: "nut-menu-relative"
   }, /* @__PURE__ */ React__default.createElement("div", {
     className: `nut-menu__bar ${itemShow.includes(true) ? "opened" : ""} ${className}`
   }, React__default.Children.toArray(children).map((child, index) => {
@@ -3980,7 +3982,7 @@ const Menu = (props) => {
       size: "10",
       name: titleIcon || (direction === "up" ? "arrow-up" : "down-arrow")
     })));
-  })), cloneChildren());
+  })), cloneChildren()));
 };
 Menu.defaultProps = defaultProps$10;
 Menu.displayName = "NutMenu";
@@ -4098,15 +4100,14 @@ const MenuItem = (props) => {
       parent.closeOnClickOverlay && parent.toggleItemShow(orderKey);
     }
   }), /* @__PURE__ */ React__default.createElement("div", {
-    className: "nut-menu-item__wrap",
+    className: direction === "down" ? "nut-menu-item__wrap" : "nut-menu-item__wrap-up",
     style: {
-      ...getPosition(),
       ...isShow()
     }
   }, /* @__PURE__ */ React__default.createElement(CSSTransition$1, {
     in: _showPopup,
     timeout: 100,
-    classNames: "menu-item"
+    classNames: direction === "down" ? "menu-item" : "menu-item-up"
   }, /* @__PURE__ */ React__default.createElement("div", {
     className: "nut-menu-item__content"
   }, options == null ? void 0 : options.map((item, index) => {

package/dist/nutui.react.umd.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui-react-taro v1.3.6 Wed Oct 12 2022 18:14:05 GMT+0800 (中国标准时间)
+* @nutui/nutui-react-taro v1.3.7 Wed Oct 19 2022 16:59:16 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */
@@ -3965,6 +3965,8 @@
       className: `nut-menu ${className}`,
       ...rest,
       ref: parentRef
+    }, /* @__PURE__ */ React__default["default"].createElement("div", {
+      className: "nut-menu-relative"
     }, /* @__PURE__ */ React__default["default"].createElement("div", {
       className: `nut-menu__bar ${itemShow.includes(true) ? "opened" : ""} ${className}`
     }, React__default["default"].Children.toArray(children).map((child, index) => {
@@ -4007,7 +4009,7 @@
         size: "10",
         name: titleIcon || (direction === "up" ? "arrow-up" : "down-arrow")
       })));
-    })), cloneChildren());
+    })), cloneChildren()));
   };
   Menu.defaultProps = defaultProps$10;
   Menu.displayName = "NutMenu";
@@ -4125,15 +4127,14 @@
         parent.closeOnClickOverlay && parent.toggleItemShow(orderKey);
       }
     }), /* @__PURE__ */ React__default["default"].createElement("div", {
-      className: "nut-menu-item__wrap",
+      className: direction === "down" ? "nut-menu-item__wrap" : "nut-menu-item__wrap-up",
       style: {
-        ...getPosition(),
         ...isShow()
       }
     }, /* @__PURE__ */ React__default["default"].createElement(CSSTransition$1, {
       in: _showPopup,
       timeout: 100,
-      classNames: "menu-item"
+      classNames: direction === "down" ? "menu-item" : "menu-item-up"
     }, /* @__PURE__ */ React__default["default"].createElement("div", {
       className: "nut-menu-item__content"
     }, options == null ? void 0 : options.map((item, index) => {

package/dist/packages/menu/menu.scss

@@ -20,6 +20,10 @@
     width: 100%;
   }
 
+  .nut-menu-relative {
+    position: relative;
+  }
+
   .nut-menu__bar {
     position: relative;
     display: flex;

package/dist/packages/menuitem/menuitem.scss

@@ -40,12 +40,16 @@
   }
 }
 
-.nut-menu-item__wrap {
-  position: fixed;
+.nut-menu-item__wrap,
+.nut-menu-item__wrap-up {
+  position: absolute;
   width: 100%;
   z-index: 2052;
   overflow: hidden;
 }
+.nut-menu-item__wrap-up {
+  bottom: $menu-bar-line-height;
+}
 
 .overlay-fade-enter-active.nut-menu__overlay {
   top: auto;
@@ -72,10 +76,12 @@
 
 .menu-item-enter {
   opacity: 0;
+  transform: translate(0, -30px);
 }
 
 .menu-item-enter-done {
   opacity: 1;
+  transform: translate(0, 0);
   transition: all 100ms;
 }
 
@@ -88,3 +94,22 @@
   opacity: 0;
   transition: all 100ms;
 }
+
+.menu-item-up-enter {
+  opacity: 0;
+  transform: translate(0, 30px);
+}
+.menu-item-up-enter-done {
+  opacity: 1;
+  transform: translate(0, 0);
+  transition: all 100ms;
+}
+.menu-item-up-exit {
+  opacity: 1;
+  transition: all 100ms;
+}
+
+.menu-item-up-exit-done {
+  opacity: 0;
+  transition: all 100ms;
+}