@nutui/nutui-react 2.1.0-beta.0 → 2.1.0

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

@@ -12,181 +12,187 @@ import { default as default12 } from "./Layout.js";
 import { default as default13 } from "./Row.js";
 import { default as default14 } from "./Space.js";
 import { default as default15 } from "./Sticky.js";
-import { default as default16 } from "./BackTop.js";
-import { default as default17 } from "./Elevator.js";
-import { default as default18 } from "./FixedNav.js";
-import { default as default19 } from "./NavBar.js";
-import { default as default20 } from "./SideNavBar.js";
-import { default as default21 } from "./SideNavBarItem.js";
-import { default as default22 } from "./SubSideNavBar.js";
-import { default as default23 } from "./Tabbar.js";
-import { default as default24 } from "./TabbarItem.js";
-import { default as default25 } from "./TabPane.js";
-import { default as default26 } from "./Tabs.js";
-import { default as default27 } from "./Address.js";
-import { default as default28 } from "./Calendar.js";
-import { default as default29 } from "./CalendarItem.js";
-import { default as default30 } from "./Cascader.js";
-import { default as default31 } from "./Checkbox.js";
-import { default as default32 } from "./CheckboxGroup.js";
-import { default as default33 } from "./DatePicker.js";
-import { default as default34 } from "./Form.js";
-import { default as default35 } from "./FormItem.js";
-import { default as default36 } from "./Input.js";
-import { default as default37 } from "./InputNumber.js";
-import { default as default38 } from "./Menu.js";
-import { default as default39 } from "./MenuItem.js";
-import { default as default40 } from "./NumberKeyboard.js";
-import { default as default41 } from "./Picker.js";
-import { default as default42 } from "./Radio.js";
-import { default as default43 } from "./RadioGroup.js";
-import { default as default44 } from "./Range.js";
-import { default as default45 } from "./Rate.js";
-import { default as default46 } from "./SearchBar.js";
-import { default as default47 } from "./ShortPassword.js";
-import { default as default48 } from "./Signature.js";
-import { default as default49 } from "./Switch.js";
-import { default as default50 } from "./TextArea.js";
-import { default as default51 } from "./Uploader.js";
-import { default as default52 } from "./ActionSheet.js";
-import { default as default53 } from "./Badge.js";
-import { default as default54 } from "./Dialog.js";
-import { default as default55 } from "./Drag.js";
-import { default as default56 } from "./Empty.js";
-import { default as default57 } from "./InfiniteLoading.js";
-import { default as default58 } from "./Loading.js";
-import { default as default59 } from "./NoticeBar.js";
-import { default as default60 } from "./Notify.js";
-import { default as default61 } from "./Popover.js";
-import { default as default62 } from "./Popup.js";
-import { default as default63 } from "./PullToRefresh.js";
-import { default as default64 } from "./Skeleton.js";
-import { default as default65 } from "./Swipe.js";
-import { default as default66 } from "./Toast.js";
-import { default as default67 } from "./Animate.js";
-import { default as default68 } from "./AnimatingNumbers.js";
-import { default as default69 } from "./Audio.js";
-import { default as default70 } from "./Avatar.js";
-import { default as default71 } from "./AvatarGroup.js";
-import { default as default72 } from "./CircleProgress.js";
-import { default as default73 } from "./Collapse.js";
-import { default as default74 } from "./CollapseItem.js";
-import { default as default75 } from "./CountDown.js";
-import { default as default76 } from "./Ellipsis.js";
-import { default as default77 } from "./ImagePreview.js";
-import { default as default78 } from "./Indicator.js";
-import { default as default79 } from "./Pagination.js";
-import { default as default80 } from "./Price.js";
-import { default as default81 } from "./Progress.js";
-import { default as default82 } from "./Step.js";
-import { default as default83 } from "./Steps.js";
-import { default as default84 } from "./Swiper.js";
-import { default as default85 } from "./SwiperItem.js";
-import { default as default86 } from "./Table.js";
-import { default as default87 } from "./Tag.js";
-import { default as default88 } from "./Tour.js";
-import { default as default89 } from "./Video.js";
-import { default as default90 } from "./VirtualList.js";
-import { default as default91 } from "./Barrage.js";
-import { default as default92 } from "./Card.js";
-import { default as default93 } from "./TimeDetail.js";
-import { default as default94 } from "./TimeSelect.js";
-import { default as default95 } from "./TrendArrow.js";
-import { default as default96 } from "./WaterMark.js";
+import { default as default16 } from "./SafeArea.js";
+import { default as default17 } from "./BackTop.js";
+import { default as default18 } from "./Elevator.js";
+import { default as default19 } from "./FixedNav.js";
+import { default as default20 } from "./NavBar.js";
+import { default as default21 } from "./SideNavBar.js";
+import { default as default22 } from "./SideNavBarItem.js";
+import { default as default23 } from "./SubSideNavBar.js";
+import { default as default24 } from "./Tabbar.js";
+import { default as default25 } from "./TabbarItem.js";
+import { default as default26 } from "./TabPane.js";
+import { default as default27 } from "./Tabs.js";
+import { default as default28 } from "./Address.js";
+import { default as default29 } from "./Calendar.js";
+import { default as default30 } from "./CalendarItem.js";
+import { default as default31 } from "./CalendarCard.js";
+import { default as default32 } from "./Cascader.js";
+import { default as default33 } from "./Checkbox.js";
+import { default as default34 } from "./CheckboxGroup.js";
+import { default as default35 } from "./DatePicker.js";
+import { default as default36 } from "./Form.js";
+import { default as default37 } from "./FormItem.js";
+import { default as default38 } from "./Input.js";
+import { default as default39 } from "./InputNumber.js";
+import { default as default40 } from "./Menu.js";
+import { default as default41 } from "./MenuItem.js";
+import { default as default42 } from "./NumberKeyboard.js";
+import { default as default43 } from "./Picker.js";
+import { default as default44 } from "./Radio.js";
+import { default as default45 } from "./RadioGroup.js";
+import { default as default46 } from "./Range.js";
+import { default as default47 } from "./Rate.js";
+import { default as default48 } from "./SearchBar.js";
+import { default as default49 } from "./ShortPassword.js";
+import { default as default50 } from "./Signature.js";
+import { default as default51 } from "./Switch.js";
+import { default as default52 } from "./TextArea.js";
+import { default as default53 } from "./Uploader.js";
+import { default as default54 } from "./ActionSheet.js";
+import { default as default55 } from "./Badge.js";
+import { default as default56 } from "./Dialog.js";
+import { default as default57 } from "./Drag.js";
+import { default as default58 } from "./Empty.js";
+import { default as default59 } from "./InfiniteLoading.js";
+import { default as default60 } from "./Loading.js";
+import { default as default61 } from "./NoticeBar.js";
+import { default as default62 } from "./Notify.js";
+import { default as default63 } from "./Popover.js";
+import { default as default64 } from "./Popup.js";
+import { default as default65 } from "./PullToRefresh.js";
+import { default as default66 } from "./Skeleton.js";
+import { default as default67 } from "./Swipe.js";
+import { default as default68 } from "./Toast.js";
+import { default as default69 } from "./Animate.js";
+import { default as default70 } from "./AnimatingNumbers.js";
+import { default as default71 } from "./Audio.js";
+import { default as default72 } from "./Avatar.js";
+import { default as default73 } from "./AvatarGroup.js";
+import { default as default74 } from "./CircleProgress.js";
+import { default as default75 } from "./Collapse.js";
+import { default as default76 } from "./CollapseItem.js";
+import { default as default77 } from "./CountDown.js";
+import { default as default78 } from "./Ellipsis.js";
+import { default as default79 } from "./ImagePreview.js";
+import { default as default80 } from "./Indicator.js";
+import { default as default81 } from "./Pagination.js";
+import { default as default82 } from "./Price.js";
+import { default as default83 } from "./Progress.js";
+import { default as default84 } from "./Step.js";
+import { default as default85 } from "./Steps.js";
+import { default as default86 } from "./Swiper.js";
+import { default as default87 } from "./SwiperItem.js";
+import { default as default88 } from "./Table.js";
+import { default as default89 } from "./Tag.js";
+import { default as default90 } from "./Tour.js";
+import { default as default91 } from "./Video.js";
+import { default as default92 } from "./VirtualList.js";
+import { default as default93 } from "./Barrage.js";
+import { default as default94 } from "./Card.js";
+import { default as default95 } from "./TimeDetail.js";
+import { default as default96 } from "./TimeSelect.js";
+import { default as default97 } from "./TrendArrow.js";
+import { default as default98 } from "./WaterMark.js";
+import { default as default99 } from "./AvatarCropper.js";
 export {
-  default52 as ActionSheet,
-  default27 as Address,
-  default67 as Animate,
-  default68 as AnimatingNumbers,
-  default69 as Audio,
-  default70 as Avatar,
-  default71 as AvatarGroup,
-  default16 as BackTop,
-  default53 as Badge,
-  default91 as Barrage,
+  default54 as ActionSheet,
+  default28 as Address,
+  default69 as Animate,
+  default70 as AnimatingNumbers,
+  default71 as Audio,
+  default72 as Avatar,
+  default99 as AvatarCropper,
+  default73 as AvatarGroup,
+  default17 as BackTop,
+  default55 as Badge,
+  default93 as Barrage,
   default2 as Button,
-  default28 as Calendar,
-  default29 as CalendarItem,
-  default92 as Card,
-  default30 as Cascader,
+  default29 as Calendar,
+  default31 as CalendarCard,
+  default30 as CalendarItem,
+  default94 as Card,
+  default32 as Cascader,
   default3 as Cell,
   default4 as CellGroup,
-  default31 as Checkbox,
-  default32 as CheckboxGroup,
-  default72 as CircleProgress,
+  default33 as Checkbox,
+  default34 as CheckboxGroup,
+  default74 as CircleProgress,
   default8 as Col,
-  default73 as Collapse,
-  default74 as CollapseItem,
+  default75 as Collapse,
+  default76 as CollapseItem,
   default5 as ConfigProvider,
-  default75 as CountDown,
-  default33 as DatePicker,
-  default54 as Dialog,
+  default77 as CountDown,
+  default35 as DatePicker,
+  default56 as Dialog,
   default9 as Divider,
-  default55 as Drag,
-  default17 as Elevator,
-  default76 as Ellipsis,
-  default56 as Empty,
-  default18 as FixedNav,
-  default34 as Form,
-  default35 as FormItem,
+  default57 as Drag,
+  default18 as Elevator,
+  default78 as Ellipsis,
+  default58 as Empty,
+  default19 as FixedNav,
+  default36 as Form,
+  default37 as FormItem,
   default10 as Grid,
   default11 as GridItem,
   default6 as Image,
-  default77 as ImagePreview,
-  default78 as Indicator,
-  default57 as InfiniteLoading,
-  default36 as Input,
-  default37 as InputNumber,
+  default79 as ImagePreview,
+  default80 as Indicator,
+  default59 as InfiniteLoading,
+  default38 as Input,
+  default39 as InputNumber,
   default12 as Layout,
-  default58 as Loading,
-  default38 as Menu,
-  default39 as MenuItem,
-  default19 as NavBar,
-  default59 as NoticeBar,
-  default60 as Notify,
-  default40 as NumberKeyboard,
+  default60 as Loading,
+  default40 as Menu,
+  default41 as MenuItem,
+  default20 as NavBar,
+  default61 as NoticeBar,
+  default62 as Notify,
+  default42 as NumberKeyboard,
   default7 as Overlay,
-  default79 as Pagination,
-  default41 as Picker,
-  default61 as Popover,
-  default62 as Popup,
-  default80 as Price,
-  default81 as Progress,
-  default63 as PullToRefresh,
-  default42 as Radio,
-  default43 as RadioGroup,
-  default44 as Range,
-  default45 as Rate,
+  default81 as Pagination,
+  default43 as Picker,
+  default63 as Popover,
+  default64 as Popup,
+  default82 as Price,
+  default83 as Progress,
+  default65 as PullToRefresh,
+  default44 as Radio,
+  default45 as RadioGroup,
+  default46 as Range,
+  default47 as Rate,
   default13 as Row,
-  default46 as SearchBar,
-  default47 as ShortPassword,
-  default20 as SideNavBar,
-  default21 as SideNavBarItem,
-  default48 as Signature,
-  default64 as Skeleton,
+  default16 as SafeArea,
+  default48 as SearchBar,
+  default49 as ShortPassword,
+  default21 as SideNavBar,
+  default22 as SideNavBarItem,
+  default50 as Signature,
+  default66 as Skeleton,
   default14 as Space,
-  default82 as Step,
-  default83 as Steps,
+  default84 as Step,
+  default85 as Steps,
   default15 as Sticky,
-  default22 as SubSideNavBar,
-  default65 as Swipe,
-  default84 as Swiper,
-  default85 as SwiperItem,
-  default49 as Switch,
-  default25 as TabPane,
-  default23 as Tabbar,
-  default24 as TabbarItem,
-  default86 as Table,
-  default26 as Tabs,
-  default87 as Tag,
-  default50 as TextArea,
-  default93 as TimeDetail,
-  default94 as TimeSelect,
-  default66 as Toast,
-  default88 as Tour,
-  default95 as TrendArrow,
-  default51 as Uploader,
-  default89 as Video,
-  default90 as VirtualList,
-  default96 as WaterMark
+  default23 as SubSideNavBar,
+  default67 as Swipe,
+  default86 as Swiper,
+  default87 as SwiperItem,
+  default51 as Switch,
+  default26 as TabPane,
+  default24 as Tabbar,
+  default25 as TabbarItem,
+  default88 as Table,
+  default27 as Tabs,
+  default89 as Tag,
+  default52 as TextArea,
+  default95 as TimeDetail,
+  default96 as TimeSelect,
+  default68 as Toast,
+  default90 as Tour,
+  default97 as TrendArrow,
+  default53 as Uploader,
+  default91 as Video,
+  default92 as VirtualList,
+  default98 as WaterMark
 };

package/dist/esm/overlay2.js

@@ -2,31 +2,103 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 var _excluded = ["children", "zIndex", "duration", "className", "closeOnOverlayClick", "visible", "lockScroll", "style", "afterShow", "afterClose", "onClick"];
-function ownKeys(object, enumerableOnly) {
-  var keys = Object.keys(object);
+function ownKeys(e, r) {
+  var t = Object.keys(e);
   if (Object.getOwnPropertySymbols) {
-    var symbols = Object.getOwnPropertySymbols(object);
-    enumerableOnly && (symbols = symbols.filter(function(sym) {
-      return Object.getOwnPropertyDescriptor(object, sym).enumerable;
-    })), keys.push.apply(keys, symbols);
+    var o = Object.getOwnPropertySymbols(e);
+    r && (o = o.filter(function(r2) {
+      return Object.getOwnPropertyDescriptor(e, r2).enumerable;
+    })), t.push.apply(t, o);
   }
-  return keys;
+  return t;
 }
-function _objectSpread(target) {
-  for (var i = 1; i < arguments.length; i++) {
-    var source = null != arguments[i] ? arguments[i] : {};
-    i % 2 ? ownKeys(Object(source), true).forEach(function(key) {
-      _defineProperty(target, key, source[key]);
-    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function(key) {
-      Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+function _objectSpread(e) {
+  for (var r = 1; r < arguments.length; r++) {
+    var t = null != arguments[r] ? arguments[r] : {};
+    r % 2 ? ownKeys(Object(t), true).forEach(function(r2) {
+      _defineProperty(e, r2, t[r2]);
+    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function(r2) {
+      Object.defineProperty(e, r2, Object.getOwnPropertyDescriptor(t, r2));
     });
   }
-  return target;
+  return e;
 }
-import React__default, { useState, useRef, useEffect } from "react";
+import React__default, { useEffect, useState, useRef } from "react";
 import { CSSTransition } from "react-transition-group";
 import classNames from "classnames";
 import { C as ComponentDefaults } from "./typings.js";
+import { u as useTouch } from "./use-touch.js";
+import { g as getScrollParent } from "./get-scroll-parent.js";
+import { p as passiveSupported } from "./supports-passive.js";
+var totalLockCount = 0;
+var BODY_LOCK_CLASS = "nut-overflow-hidden";
+function getScrollableElement(el) {
+  var current = el === null || el === void 0 ? void 0 : el.parentElement;
+  while (current) {
+    if (current.clientHeight < current.scrollHeight) {
+      return current;
+    }
+    current = current.parentElement;
+  }
+  return null;
+}
+function useLockScroll(rootRef, shouldLock) {
+  var touch = useTouch();
+  var onTouchMove = function onTouchMove2(event) {
+    touch.move(event);
+    var direction = touch.deltaY.current > 0 ? "10" : "01";
+    var el = getScrollParent(event.target, rootRef.current);
+    if (!el)
+      return;
+    if (shouldLock === "strict") {
+      var scrollableParent = getScrollableElement(event.target);
+      if (scrollableParent === document.body || scrollableParent === document.documentElement) {
+        event.preventDefault();
+        return;
+      }
+    }
+    var scrollHeight = el.scrollHeight, offsetHeight = el.offsetHeight, scrollTop = el.scrollTop;
+    var status = "11";
+    if (scrollTop === 0) {
+      status = offsetHeight >= scrollHeight ? "00" : "01";
+    } else if (scrollTop + offsetHeight >= scrollHeight) {
+      status = "10";
+    }
+    if (status !== "11" && touch.isVertical() && !(parseInt(status, 2) & parseInt(direction, 2))) {
+      if (event.cancelable) {
+        event.preventDefault();
+      }
+    }
+  };
+  var lock = function lock2() {
+    document.addEventListener("touchstart", touch.start);
+    document.addEventListener("touchmove", onTouchMove, passiveSupported ? {
+      passive: false
+    } : false);
+    if (!totalLockCount) {
+      document.body.classList.add(BODY_LOCK_CLASS);
+    }
+    totalLockCount++;
+  };
+  var unlock = function unlock2() {
+    if (totalLockCount) {
+      document.removeEventListener("touchstart", touch.start);
+      document.removeEventListener("touchmove", onTouchMove);
+      totalLockCount--;
+      if (!totalLockCount) {
+        document.body.classList.remove(BODY_LOCK_CLASS);
+      }
+    }
+  };
+  useEffect(function() {
+    if (shouldLock) {
+      lock();
+      return function() {
+        unlock();
+      };
+    }
+  }, [shouldLock]);
+}
 var defaultOverlayProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
   zIndex: 1e3,
   duration: 300,
@@ -38,10 +110,8 @@ var defaultOverlayProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}
 });
 var Overlay = function Overlay2(props) {
   var _defaultOverlayProps$ = _objectSpread(_objectSpread({}, defaultOverlayProps), props), children = _defaultOverlayProps$.children, zIndex = _defaultOverlayProps$.zIndex, duration = _defaultOverlayProps$.duration, className = _defaultOverlayProps$.className, closeOnOverlayClick = _defaultOverlayProps$.closeOnOverlayClick, visible = _defaultOverlayProps$.visible, lockScroll = _defaultOverlayProps$.lockScroll, style = _defaultOverlayProps$.style, afterShow = _defaultOverlayProps$.afterShow, afterClose = _defaultOverlayProps$.afterClose, onClick2 = _defaultOverlayProps$.onClick, rest = _objectWithoutProperties(_defaultOverlayProps$, _excluded);
-  var classPrefix = "nut-overlay";
-  var classes = classNames(className, classPrefix);
-  var styles = _objectSpread({}, style);
   var _useState = useState(visible), _useState2 = _slicedToArray(_useState, 2), innerVisible = _useState2[0], setInnerVisible = _useState2[1];
+  var classPrefix = "nut-overlay";
   var nodeRef = useRef(null);
   useEffect(function() {
     if (visible) {
@@ -49,20 +119,10 @@ var Overlay = function Overlay2(props) {
     } else {
       setInnerVisible(false);
     }
-    lock();
   }, [visible]);
-  useEffect(function() {
-    return function() {
-      document.body.classList.remove("nut-overflow-hidden");
-    };
-  }, []);
-  var lock = function lock2() {
-    if (lockScroll && visible) {
-      document.body.classList.add("nut-overflow-hidden");
-    } else {
-      document.body.classList.remove("nut-overflow-hidden");
-    }
-  };
+  useLockScroll(nodeRef, !!props.lockScroll && innerVisible);
+  var classes = classNames(classPrefix, className);
+  var styles = _objectSpread({}, style);
   var handleClick = function handleClick2(e) {
     if (closeOnOverlayClick) {
       onClick2 && onClick2(e);
@@ -94,5 +154,6 @@ Overlay.defaultProps = defaultOverlayProps;
 Overlay.displayName = "NutOverlay";
 export {
   Overlay as O,
-  defaultOverlayProps as d
+  defaultOverlayProps as d,
+  useLockScroll as u
 };