@nutui/nutui-react-taro 3.0.19-cpp.26-beta.1 → 3.0.19-cpp.26-beta.2

package/dist/cjs/packages/imagepreview/style/style.harmony.css

@@ -251,6 +251,9 @@
   }
 }
 @keyframes popup-slide-top-exit {
+  from {
+    transform: translate3d(0, 0%, 0);
+  }
   to {
     transform: translate3d(0, -100%, 0);
   }
@@ -275,6 +278,9 @@
   }
 }
 @keyframes popup-slide-right-exit {
+  from {
+    transform: translate3d(0%, 0, 0);
+  }
   to {
     transform: translate3d(100%, 0, 0);
   }
@@ -285,7 +291,7 @@
   animation-name: popup-slide-right-enter;
   animation-duration: var(--nutui-popup-animation-duration, 0.3s);
 }
-.nut-popup-slide-right-exit {
+.nut-popup-slide-right-exit-active {
   animation-fill-mode: both;
   animation-name: popup-slide-right-exit;
   animation-duration: var(--nutui-popup-animation-duration, 0.3s);
@@ -298,20 +304,23 @@
     transform: translate3d(0, 0%, 0);
   }
 }
-@keyframes slide-bottom-exit {
+@keyframes popup-slide-bottom-exit {
+  from {
+    transform: translate3d(0, 0%, 0);
+  }
   to {
     transform: translate3d(0, 100%, 0);
   }
 }
 .nut-popup-slide-bottom-enter-active, .nut-popup-slide-bottom-appear-active {
-  transform: translate(0, 0);
+  transform: translate3d(0, 0, 0);
   animation-fill-mode: both;
   animation-name: popup-slide-bottom-enter;
   animation-duration: var(--nutui-popup-animation-duration, 0.3s);
 }
-.nut-popup-slide-bottom-exit {
+.nut-popup-slide-bottom-exit-active {
   animation-fill-mode: both;
-  animation-name: slide-bottom-exit;
+  animation-name: popup-slide-bottom-exit;
   animation-duration: var(--nutui-popup-animation-duration, 0.3s);
 }
 @keyframes popup-slide-left-enter {
@@ -323,17 +332,20 @@
   }
 }
 @keyframes popup-slide-left-exit {
+  from {
+    transform: translate3d(0%, 0, 0);
+  }
   to {
     transform: translate3d(-100%, 0, 0);
   }
 }
 .nut-popup-slide-left-enter-active, .nut-popup-slide-left-appear-active {
-  transform: translate(0, 0);
+  transform: translate3d(0, 0, 0);
   animation-fill-mode: both;
   animation-name: popup-slide-left-enter;
   animation-duration: var(--nutui-popup-animation-duration, 0.3s);
 }
-.nut-popup-slide-left-exit-active, .nut-popup-slide-left-exit-done {
+.nut-popup-slide-left-exit-active {
   animation-fill-mode: both;
   animation-name: popup-slide-left-exit;
   animation-duration: var(--nutui-popup-animation-duration, 0.3s);

package/dist/cjs/packages/numberkeyboard/style/style.harmony.css

@@ -251,6 +251,9 @@
   }
 }
 @keyframes popup-slide-top-exit {
+  from {
+    transform: translate3d(0, 0%, 0);
+  }
   to {
     transform: translate3d(0, -100%, 0);
   }
@@ -275,6 +278,9 @@
   }
 }
 @keyframes popup-slide-right-exit {
+  from {
+    transform: translate3d(0%, 0, 0);
+  }
   to {
     transform: translate3d(100%, 0, 0);
   }
@@ -285,7 +291,7 @@
   animation-name: popup-slide-right-enter;
   animation-duration: var(--nutui-popup-animation-duration, 0.3s);
 }
-.nut-popup-slide-right-exit {
+.nut-popup-slide-right-exit-active {
   animation-fill-mode: both;
   animation-name: popup-slide-right-exit;
   animation-duration: var(--nutui-popup-animation-duration, 0.3s);
@@ -298,20 +304,23 @@
     transform: translate3d(0, 0%, 0);
   }
 }
-@keyframes slide-bottom-exit {
+@keyframes popup-slide-bottom-exit {
+  from {
+    transform: translate3d(0, 0%, 0);
+  }
   to {
     transform: translate3d(0, 100%, 0);
   }
 }
 .nut-popup-slide-bottom-enter-active, .nut-popup-slide-bottom-appear-active {
-  transform: translate(0, 0);
+  transform: translate3d(0, 0, 0);
   animation-fill-mode: both;
   animation-name: popup-slide-bottom-enter;
   animation-duration: var(--nutui-popup-animation-duration, 0.3s);
 }
-.nut-popup-slide-bottom-exit {
+.nut-popup-slide-bottom-exit-active {
   animation-fill-mode: both;
-  animation-name: slide-bottom-exit;
+  animation-name: popup-slide-bottom-exit;
   animation-duration: var(--nutui-popup-animation-duration, 0.3s);
 }
 @keyframes popup-slide-left-enter {
@@ -323,17 +332,20 @@
   }
 }
 @keyframes popup-slide-left-exit {
+  from {
+    transform: translate3d(0%, 0, 0);
+  }
   to {
     transform: translate3d(-100%, 0, 0);
   }
 }
 .nut-popup-slide-left-enter-active, .nut-popup-slide-left-appear-active {
-  transform: translate(0, 0);
+  transform: translate3d(0, 0, 0);
   animation-fill-mode: both;
   animation-name: popup-slide-left-enter;
   animation-duration: var(--nutui-popup-animation-duration, 0.3s);
 }
-.nut-popup-slide-left-exit-active, .nut-popup-slide-left-exit-done {
+.nut-popup-slide-left-exit-active {
   animation-fill-mode: both;
   animation-name: popup-slide-left-exit;
   animation-duration: var(--nutui-popup-animation-duration, 0.3s);

package/dist/cjs/packages/nutui.react.build.d.ts

@@ -192,6 +192,8 @@ import Video from "./video/index";
 export * from "./video/index";
 import VirtualList from "./virtuallist/index";
 export * from "./virtuallist/index";
+import QuickEnter from "./quickenter/index";
+export * from "./quickenter/index";
 import AvatarCropper from "./avatarcropper/index";
 export * from "./avatarcropper/index";
 import Barrage from "./barrage/index";
@@ -209,4 +211,4 @@ export * from "./watermark/index";
 export * from "../types";
 export * from "../utils/index";
 export * from "../hooks/index";
-export { Button, Cell, CellGroup, ConfigProvider, Image, Overlay, Divider, Grid, GridItem, Layout, Col, Row, SafeArea, Space, Sticky, BackTop, Elevator, FixedNav, HoverButton, HoverButtonItem, NavBar, SideBar, SideBarItem, Tabbar, TabbarItem, TabPane, Tabs, Address, Calendar, CalendarItem, CalendarCard, Cascader, Checkbox, CheckboxGroup, DatePicker, DatePickerView, Form, FormItem, Input, InputNumber, Menu, MenuItem, NumberKeyboard, Picker, PickerView, Radio, RadioGroup, Range, Rate, SearchBar, ShortPassword, Signature, Switch, TextArea, Uploader, ActionSheet, Badge, Dialog, Drag, Empty, InfiniteLoading, Loading, NoticeBar, Notify, Popover, Popup, PullToRefresh, ResultPage, Skeleton, Swipe, Toast, Animate, AnimatingNumbers, Audio, Avatar, AvatarGroup, CircleProgress, Collapse, CollapseItem, CountDown, Ellipsis, ImagePreview, Indicator, Lottie, Pagination, Price, Progress, Segmented, Step, Steps, Swiper, SwiperItem, Table, Tag, Tour, Video, VirtualList, AvatarCropper, Barrage, Card, TimeDetail, TimeSelect, TrendArrow, WaterMark };
+export { Button, Cell, CellGroup, ConfigProvider, Image, Overlay, Divider, Grid, GridItem, Layout, Col, Row, SafeArea, Space, Sticky, BackTop, Elevator, FixedNav, HoverButton, HoverButtonItem, NavBar, SideBar, SideBarItem, Tabbar, TabbarItem, TabPane, Tabs, Address, Calendar, CalendarItem, CalendarCard, Cascader, Checkbox, CheckboxGroup, DatePicker, DatePickerView, Form, FormItem, Input, InputNumber, Menu, MenuItem, NumberKeyboard, Picker, PickerView, Radio, RadioGroup, Range, Rate, SearchBar, ShortPassword, Signature, Switch, TextArea, Uploader, ActionSheet, Badge, Dialog, Drag, Empty, InfiniteLoading, Loading, NoticeBar, Notify, Popover, Popup, PullToRefresh, ResultPage, Skeleton, Swipe, Toast, Animate, AnimatingNumbers, Audio, Avatar, AvatarGroup, CircleProgress, Collapse, CollapseItem, CountDown, Ellipsis, ImagePreview, Indicator, Lottie, Pagination, Price, Progress, Segmented, Step, Steps, Swiper, SwiperItem, Table, Tag, Tour, Video, VirtualList, QuickEnter, AvatarCropper, Barrage, Card, TimeDetail, TimeSelect, TrendArrow, WaterMark };

package/dist/cjs/packages/nutui.react.build.js

@@ -28,7 +28,7 @@ _export(exports, {
         return _index74.default;
     },
     get AvatarCropper () {
-        return _index97.default;
+        return _index98.default;
     },
     get AvatarGroup () {
         return _index75.default;
@@ -40,7 +40,7 @@ _export(exports, {
         return _index56.default;
     },
     get Barrage () {
-        return _index98.default;
+        return _index99.default;
     },
     get Button () {
         return _index.default;
@@ -55,7 +55,7 @@ _export(exports, {
         return _index29.default;
     },
     get Card () {
-        return _index99.default;
+        return _index100.default;
     },
     get Cascader () {
         return _index31.default;
@@ -207,6 +207,9 @@ _export(exports, {
     get PullToRefresh () {
         return _index66.default;
     },
+    get QuickEnter () {
+        return _index97.default;
+    },
     get Radio () {
         return _index45.default;
     },
@@ -295,10 +298,10 @@ _export(exports, {
         return _index53.default;
     },
     get TimeDetail () {
-        return _index100.default;
+        return _index101.default;
     },
     get TimeSelect () {
-        return _index101.default;
+        return _index102.default;
     },
     get Toast () {
         return _index70.default;
@@ -307,7 +310,7 @@ _export(exports, {
         return _index94.default;
     },
     get TrendArrow () {
-        return _index102.default;
+        return _index103.default;
     },
     get Uploader () {
         return _index54.default;
@@ -319,7 +322,7 @@ _export(exports, {
         return _index96.default;
     },
     get WaterMark () {
-        return _index103.default;
+        return _index104.default;
     }
 });
 var _export_star = require("@swc/helpers/_/_export_star");
@@ -421,13 +424,14 @@ var _index93 = /*#__PURE__*/ _interop_require_default._(_export_star._(require("
 var _index94 = /*#__PURE__*/ _interop_require_default._(_export_star._(require("./tour/index"), exports));
 var _index95 = /*#__PURE__*/ _interop_require_default._(_export_star._(require("./video/index"), exports));
 var _index96 = /*#__PURE__*/ _interop_require_default._(_export_star._(require("./virtuallist/index"), exports));
-var _index97 = /*#__PURE__*/ _interop_require_default._(_export_star._(require("./avatarcropper/index"), exports));
-var _index98 = /*#__PURE__*/ _interop_require_default._(_export_star._(require("./barrage/index"), exports));
-var _index99 = /*#__PURE__*/ _interop_require_default._(_export_star._(require("./card/index"), exports));
-var _index100 = /*#__PURE__*/ _interop_require_default._(_export_star._(require("./timedetail/index"), exports));
-var _index101 = /*#__PURE__*/ _interop_require_default._(_export_star._(require("./timeselect/index"), exports));
-var _index102 = /*#__PURE__*/ _interop_require_default._(_export_star._(require("./trendarrow/index"), exports));
-var _index103 = /*#__PURE__*/ _interop_require_default._(_export_star._(require("./watermark/index"), exports));
+var _index97 = /*#__PURE__*/ _interop_require_default._(_export_star._(require("./quickenter/index"), exports));
+var _index98 = /*#__PURE__*/ _interop_require_default._(_export_star._(require("./avatarcropper/index"), exports));
+var _index99 = /*#__PURE__*/ _interop_require_default._(_export_star._(require("./barrage/index"), exports));
+var _index100 = /*#__PURE__*/ _interop_require_default._(_export_star._(require("./card/index"), exports));
+var _index101 = /*#__PURE__*/ _interop_require_default._(_export_star._(require("./timedetail/index"), exports));
+var _index102 = /*#__PURE__*/ _interop_require_default._(_export_star._(require("./timeselect/index"), exports));
+var _index103 = /*#__PURE__*/ _interop_require_default._(_export_star._(require("./trendarrow/index"), exports));
+var _index104 = /*#__PURE__*/ _interop_require_default._(_export_star._(require("./watermark/index"), exports));
 _export_star._(require("../types"), exports);
 _export_star._(require("../utils/index"), exports);
 _export_star._(require("../hooks/index"), exports);

package/dist/cjs/packages/nutui.react.d.ts

@@ -192,6 +192,8 @@ import Video from "./video/index";
 export * from "./video/index";
 import VirtualList from "./virtuallist/index";
 export * from "./virtuallist/index";
+import QuickEnter from "./quickenter/index";
+export * from "./quickenter/index";
 import AvatarCropper from "./avatarcropper/index";
 export * from "./avatarcropper/index";
 import Barrage from "./barrage/index";
@@ -303,6 +305,7 @@ import "./tag/tag.scss";
 import "./tour/tour.scss";
 import "./video/video.scss";
 import "./virtuallist/virtuallist.scss";
+import "./quickenter/quickenter.scss";
 import "./avatarcropper/avatarcropper.scss";
 import "./barrage/barrage.scss";
 import "./card/card.scss";
@@ -313,4 +316,4 @@ import "./watermark/watermark.scss";
 export * from "../types";
 export * from "../utils/index";
 export * from "../hooks/index";
-export { Button, Cell, CellGroup, ConfigProvider, Image, Overlay, Divider, Grid, GridItem, Layout, Col, Row, SafeArea, Space, Sticky, BackTop, Elevator, FixedNav, HoverButton, HoverButtonItem, NavBar, SideBar, SideBarItem, Tabbar, TabbarItem, TabPane, Tabs, Address, Calendar, CalendarItem, CalendarCard, Cascader, Checkbox, CheckboxGroup, DatePicker, DatePickerView, Form, FormItem, Input, InputNumber, Menu, MenuItem, NumberKeyboard, Picker, PickerView, Radio, RadioGroup, Range, Rate, SearchBar, ShortPassword, Signature, Switch, TextArea, Uploader, ActionSheet, Badge, Dialog, Drag, Empty, InfiniteLoading, Loading, NoticeBar, Notify, Popover, Popup, PullToRefresh, ResultPage, Skeleton, Swipe, Toast, Animate, AnimatingNumbers, Audio, Avatar, AvatarGroup, CircleProgress, Collapse, CollapseItem, CountDown, Ellipsis, ImagePreview, Indicator, Lottie, Pagination, Price, Progress, Segmented, Step, Steps, Swiper, SwiperItem, Table, Tag, Tour, Video, VirtualList, AvatarCropper, Barrage, Card, TimeDetail, TimeSelect, TrendArrow, WaterMark };
+export { Button, Cell, CellGroup, ConfigProvider, Image, Overlay, Divider, Grid, GridItem, Layout, Col, Row, SafeArea, Space, Sticky, BackTop, Elevator, FixedNav, HoverButton, HoverButtonItem, NavBar, SideBar, SideBarItem, Tabbar, TabbarItem, TabPane, Tabs, Address, Calendar, CalendarItem, CalendarCard, Cascader, Checkbox, CheckboxGroup, DatePicker, DatePickerView, Form, FormItem, Input, InputNumber, Menu, MenuItem, NumberKeyboard, Picker, PickerView, Radio, RadioGroup, Range, Rate, SearchBar, ShortPassword, Signature, Switch, TextArea, Uploader, ActionSheet, Badge, Dialog, Drag, Empty, InfiniteLoading, Loading, NoticeBar, Notify, Popover, Popup, PullToRefresh, ResultPage, Skeleton, Swipe, Toast, Animate, AnimatingNumbers, Audio, Avatar, AvatarGroup, CircleProgress, Collapse, CollapseItem, CountDown, Ellipsis, ImagePreview, Indicator, Lottie, Pagination, Price, Progress, Segmented, Step, Steps, Swiper, SwiperItem, Table, Tag, Tour, Video, VirtualList, QuickEnter, AvatarCropper, Barrage, Card, TimeDetail, TimeSelect, TrendArrow, WaterMark };

package/dist/cjs/packages/nutui.react.js

@@ -28,7 +28,7 @@ _export(exports, {
         return _index74.default;
     },
     get AvatarCropper () {
-        return _index97.default;
+        return _index98.default;
     },
     get AvatarGroup () {
         return _index75.default;
@@ -40,7 +40,7 @@ _export(exports, {
         return _index56.default;
     },
     get Barrage () {
-        return _index98.default;
+        return _index99.default;
     },
     get Button () {
         return _index.default;
@@ -55,7 +55,7 @@ _export(exports, {
         return _index29.default;
     },
     get Card () {
-        return _index99.default;
+        return _index100.default;
     },
     get Cascader () {
         return _index31.default;
@@ -207,6 +207,9 @@ _export(exports, {
     get PullToRefresh () {
         return _index66.default;
     },
+    get QuickEnter () {
+        return _index97.default;
+    },
     get Radio () {
         return _index45.default;
     },
@@ -295,10 +298,10 @@ _export(exports, {
         return _index53.default;
     },
     get TimeDetail () {
-        return _index100.default;
+        return _index101.default;
     },
     get TimeSelect () {
-        return _index101.default;
+        return _index102.default;
     },
     get Toast () {
         return _index70.default;
@@ -307,7 +310,7 @@ _export(exports, {
         return _index94.default;
     },
     get TrendArrow () {
-        return _index102.default;
+        return _index103.default;
     },
     get Uploader () {
         return _index54.default;
@@ -319,7 +322,7 @@ _export(exports, {
         return _index96.default;
     },
     get WaterMark () {
-        return _index103.default;
+        return _index104.default;
     }
 });
 var _export_star = require("@swc/helpers/_/_export_star");
@@ -421,13 +424,14 @@ var _index93 = /*#__PURE__*/ _interop_require_default._(_export_star._(require("
 var _index94 = /*#__PURE__*/ _interop_require_default._(_export_star._(require("./tour/index"), exports));
 var _index95 = /*#__PURE__*/ _interop_require_default._(_export_star._(require("./video/index"), exports));
 var _index96 = /*#__PURE__*/ _interop_require_default._(_export_star._(require("./virtuallist/index"), exports));
-var _index97 = /*#__PURE__*/ _interop_require_default._(_export_star._(require("./avatarcropper/index"), exports));
-var _index98 = /*#__PURE__*/ _interop_require_default._(_export_star._(require("./barrage/index"), exports));
-var _index99 = /*#__PURE__*/ _interop_require_default._(_export_star._(require("./card/index"), exports));
-var _index100 = /*#__PURE__*/ _interop_require_default._(_export_star._(require("./timedetail/index"), exports));
-var _index101 = /*#__PURE__*/ _interop_require_default._(_export_star._(require("./timeselect/index"), exports));
-var _index102 = /*#__PURE__*/ _interop_require_default._(_export_star._(require("./trendarrow/index"), exports));
-var _index103 = /*#__PURE__*/ _interop_require_default._(_export_star._(require("./watermark/index"), exports));
+var _index97 = /*#__PURE__*/ _interop_require_default._(_export_star._(require("./quickenter/index"), exports));
+var _index98 = /*#__PURE__*/ _interop_require_default._(_export_star._(require("./avatarcropper/index"), exports));
+var _index99 = /*#__PURE__*/ _interop_require_default._(_export_star._(require("./barrage/index"), exports));
+var _index100 = /*#__PURE__*/ _interop_require_default._(_export_star._(require("./card/index"), exports));
+var _index101 = /*#__PURE__*/ _interop_require_default._(_export_star._(require("./timedetail/index"), exports));
+var _index102 = /*#__PURE__*/ _interop_require_default._(_export_star._(require("./timeselect/index"), exports));
+var _index103 = /*#__PURE__*/ _interop_require_default._(_export_star._(require("./trendarrow/index"), exports));
+var _index104 = /*#__PURE__*/ _interop_require_default._(_export_star._(require("./watermark/index"), exports));
 require("./button/button.scss");
 require("./cell/cell.scss");
 require("./cellgroup/cellgroup.scss");
@@ -525,6 +529,7 @@ require("./tag/tag.scss");
 require("./tour/tour.scss");
 require("./video/video.scss");
 require("./virtuallist/virtuallist.scss");
+require("./quickenter/quickenter.scss");
 require("./avatarcropper/avatarcropper.scss");
 require("./barrage/barrage.scss");
 require("./card/card.scss");

package/dist/cjs/packages/nutui.react.scss.d.ts

@@ -95,6 +95,7 @@ import "./tag/tag.scss";
 import "./tour/tour.scss";
 import "./video/video.scss";
 import "./virtuallist/virtuallist.scss";
+import "./quickenter/quickenter.scss";
 import "./avatarcropper/avatarcropper.scss";
 import "./barrage/barrage.scss";
 import "./card/card.scss";

package/dist/cjs/packages/nutui.react.scss.js

@@ -105,6 +105,7 @@ require("./tag/tag.scss");
 require("./tour/tour.scss");
 require("./video/video.scss");
 require("./virtuallist/virtuallist.scss");
+require("./quickenter/quickenter.scss");
 require("./avatarcropper/avatarcropper.scss");
 require("./barrage/barrage.scss");
 require("./card/card.scss");

package/dist/cjs/packages/overlay/overlay.js

@@ -27,6 +27,7 @@ var _classnames = /*#__PURE__*/ _interop_require_default._(require("classnames")
 var _components = require("@tarojs/components");
 var _typings = require("../../utils/typings");
 var _uselockscoll = require("../../hooks/taro/use-lock-scoll");
+var _ConfigurableCSSTransition = /*#__PURE__*/ _interop_require_default._(require("../../utils/taro/ConfigurableCSSTransition"));
 var defaultOverlayProps = (0, _object_spread_props._)((0, _object_spread._)({}, _typings.ComponentDefaults), {
     zIndex: 1000,
     duration: 300,
@@ -72,27 +73,20 @@ var Overlay = function Overlay(props) {
         return /*#__PURE__*/ _react.default.createElement(_components.View, (0, _object_spread_props._)((0, _object_spread._)({
             ref: nodeRef,
             className: classes,
-            style: (0, _object_spread_props._)((0, _object_spread._)({}, styles), {
-                display: innerVisible ? 'block' : 'none'
-            })
+            style: styles
         }, rest), {
             catchMove: lockScroll,
             onClick: handleClick
         }), children);
     };
-    return /*#__PURE__*/ _react.default.createElement(_react.default.Fragment, null, renderOverlay());
-// return (
-//   <CSSTransition
-//     nodeRef={nodeRef}
-//     classNames={`${classPrefix}-slide`}
-//     unmountOnExit
-//     timeout={duration}
-//     in={innerVisible}
-//     onEntered={afterShow}
-//     onExited={afterClose}
-//   >
-//     {renderOverlay()}
-//   </CSSTransition>
-// )
+    return /*#__PURE__*/ _react.default.createElement(_ConfigurableCSSTransition.default, {
+        nodeRef: nodeRef,
+        classNames: "".concat(classPrefix, "-slide"),
+        unmountOnExit: true,
+        timeout: Number(duration),
+        in: innerVisible,
+        onEntered: afterShow,
+        onExited: afterClose
+    }, renderOverlay());
 };
 Overlay.displayName = 'NutOverlay';

package/dist/cjs/packages/picker/style/style.harmony.css

@@ -251,6 +251,9 @@
   }
 }
 @keyframes popup-slide-top-exit {
+  from {
+    transform: translate3d(0, 0%, 0);
+  }
   to {
     transform: translate3d(0, -100%, 0);
   }
@@ -275,6 +278,9 @@
   }
 }
 @keyframes popup-slide-right-exit {
+  from {
+    transform: translate3d(0%, 0, 0);
+  }
   to {
     transform: translate3d(100%, 0, 0);
   }
@@ -285,7 +291,7 @@
   animation-name: popup-slide-right-enter;
   animation-duration: var(--nutui-popup-animation-duration, 0.3s);
 }
-.nut-popup-slide-right-exit {
+.nut-popup-slide-right-exit-active {
   animation-fill-mode: both;
   animation-name: popup-slide-right-exit;
   animation-duration: var(--nutui-popup-animation-duration, 0.3s);
@@ -298,20 +304,23 @@
     transform: translate3d(0, 0%, 0);
   }
 }
-@keyframes slide-bottom-exit {
+@keyframes popup-slide-bottom-exit {
+  from {
+    transform: translate3d(0, 0%, 0);
+  }
   to {
     transform: translate3d(0, 100%, 0);
   }
 }
 .nut-popup-slide-bottom-enter-active, .nut-popup-slide-bottom-appear-active {
-  transform: translate(0, 0);
+  transform: translate3d(0, 0, 0);
   animation-fill-mode: both;
   animation-name: popup-slide-bottom-enter;
   animation-duration: var(--nutui-popup-animation-duration, 0.3s);
 }
-.nut-popup-slide-bottom-exit {
+.nut-popup-slide-bottom-exit-active {
   animation-fill-mode: both;
-  animation-name: slide-bottom-exit;
+  animation-name: popup-slide-bottom-exit;
   animation-duration: var(--nutui-popup-animation-duration, 0.3s);
 }
 @keyframes popup-slide-left-enter {
@@ -323,17 +332,20 @@
   }
 }
 @keyframes popup-slide-left-exit {
+  from {
+    transform: translate3d(0%, 0, 0);
+  }
   to {
     transform: translate3d(-100%, 0, 0);
   }
 }
 .nut-popup-slide-left-enter-active, .nut-popup-slide-left-appear-active {
-  transform: translate(0, 0);
+  transform: translate3d(0, 0, 0);
   animation-fill-mode: both;
   animation-name: popup-slide-left-enter;
   animation-duration: var(--nutui-popup-animation-duration, 0.3s);
 }
-.nut-popup-slide-left-exit-active, .nut-popup-slide-left-exit-done {
+.nut-popup-slide-left-exit-active {
   animation-fill-mode: both;
   animation-name: popup-slide-left-exit;
   animation-duration: var(--nutui-popup-animation-duration, 0.3s);

package/dist/cjs/packages/popover/style/style.harmony.css

@@ -251,6 +251,9 @@
   }
 }
 @keyframes popup-slide-top-exit {
+  from {
+    transform: translate3d(0, 0%, 0);
+  }
   to {
     transform: translate3d(0, -100%, 0);
   }
@@ -275,6 +278,9 @@
   }
 }
 @keyframes popup-slide-right-exit {
+  from {
+    transform: translate3d(0%, 0, 0);
+  }
   to {
     transform: translate3d(100%, 0, 0);
   }
@@ -285,7 +291,7 @@
   animation-name: popup-slide-right-enter;
   animation-duration: var(--nutui-popup-animation-duration, 0.3s);
 }
-.nut-popup-slide-right-exit {
+.nut-popup-slide-right-exit-active {
   animation-fill-mode: both;
   animation-name: popup-slide-right-exit;
   animation-duration: var(--nutui-popup-animation-duration, 0.3s);
@@ -298,20 +304,23 @@
     transform: translate3d(0, 0%, 0);
   }
 }
-@keyframes slide-bottom-exit {
+@keyframes popup-slide-bottom-exit {
+  from {
+    transform: translate3d(0, 0%, 0);
+  }
   to {
     transform: translate3d(0, 100%, 0);
   }
 }
 .nut-popup-slide-bottom-enter-active, .nut-popup-slide-bottom-appear-active {
-  transform: translate(0, 0);
+  transform: translate3d(0, 0, 0);
   animation-fill-mode: both;
   animation-name: popup-slide-bottom-enter;
   animation-duration: var(--nutui-popup-animation-duration, 0.3s);
 }
-.nut-popup-slide-bottom-exit {
+.nut-popup-slide-bottom-exit-active {
   animation-fill-mode: both;
-  animation-name: slide-bottom-exit;
+  animation-name: popup-slide-bottom-exit;
   animation-duration: var(--nutui-popup-animation-duration, 0.3s);
 }
 @keyframes popup-slide-left-enter {
@@ -323,17 +332,20 @@
   }
 }
 @keyframes popup-slide-left-exit {
+  from {
+    transform: translate3d(0%, 0, 0);
+  }
   to {
     transform: translate3d(-100%, 0, 0);
   }
 }
 .nut-popup-slide-left-enter-active, .nut-popup-slide-left-appear-active {
-  transform: translate(0, 0);
+  transform: translate3d(0, 0, 0);
   animation-fill-mode: both;
   animation-name: popup-slide-left-enter;
   animation-duration: var(--nutui-popup-animation-duration, 0.3s);
 }
-.nut-popup-slide-left-exit-active, .nut-popup-slide-left-exit-done {
+.nut-popup-slide-left-exit-active {
   animation-fill-mode: both;
   animation-name: popup-slide-left-exit;
   animation-duration: var(--nutui-popup-animation-duration, 0.3s);