@arco-design/mobile-react 2.24.1 → 2.25.0

package/cjs/sticky/index.js

@@ -1,26 +1,16 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 exports.__esModule = true;
 exports.default = void 0;
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _mobileUtils = require("@arco-design/mobile-utils");
-
 var _contextProvider = require("../context-provider");
-
 var _helpers = require("../_helpers");
-
 var _portal = _interopRequireDefault(require("../portal"));
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
 /**
  * 粘性布局组件，元素相对于窗口或指定容器的吸顶效果。
  * @en Sticky layout component, The sticky-to-top effect of the element relative to the window or specified container
@@ -31,43 +21,39 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
  */
 var Sticky = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var _props$position = props.position,
-      position = _props$position === void 0 ? 'top' : _props$position,
-      _props$topOffset = props.topOffset,
-      topOffset = _props$topOffset === void 0 ? 0 : _props$topOffset,
-      _props$bottomOffset = props.bottomOffset,
-      bottomOffset = _props$bottomOffset === void 0 ? 0 : _props$bottomOffset,
-      _props$followOffset = props.followOffset,
-      followOffset = _props$followOffset === void 0 ? 0 : _props$followOffset,
-      children = props.children,
-      className = props.className,
-      style = props.style,
-      _props$zIndex = props.zIndex,
-      zIndex = _props$zIndex === void 0 ? 100 : _props$zIndex,
-      _props$portalWhenStic = props.portalWhenSticky,
-      portalWhenSticky = _props$portalWhenStic === void 0 ? false : _props$portalWhenStic,
-      _props$stickyStyle = props.stickyStyle,
-      stickyStyle = _props$stickyStyle === void 0 ? 'fixed' : _props$stickyStyle,
-      userSetStickyCssStyle = props.stickyCssStyle,
-      getPortalContainer = props.getPortalContainer,
-      getContainer = props.getContainer,
-      getScrollContainer = props.getScrollContainer,
-      onStickyStateChange = props.onStickyStateChange,
-      onTopChange = props.onTopChange;
-
+    position = _props$position === void 0 ? 'top' : _props$position,
+    _props$topOffset = props.topOffset,
+    topOffset = _props$topOffset === void 0 ? 0 : _props$topOffset,
+    _props$bottomOffset = props.bottomOffset,
+    bottomOffset = _props$bottomOffset === void 0 ? 0 : _props$bottomOffset,
+    _props$followOffset = props.followOffset,
+    followOffset = _props$followOffset === void 0 ? 0 : _props$followOffset,
+    children = props.children,
+    className = props.className,
+    style = props.style,
+    _props$zIndex = props.zIndex,
+    zIndex = _props$zIndex === void 0 ? 100 : _props$zIndex,
+    _props$portalWhenStic = props.portalWhenSticky,
+    portalWhenSticky = _props$portalWhenStic === void 0 ? false : _props$portalWhenStic,
+    _props$stickyStyle = props.stickyStyle,
+    stickyStyle = _props$stickyStyle === void 0 ? 'fixed' : _props$stickyStyle,
+    userSetStickyCssStyle = props.stickyCssStyle,
+    getPortalContainer = props.getPortalContainer,
+    getContainer = props.getContainer,
+    getScrollContainer = props.getScrollContainer,
+    onStickyStateChange = props.onStickyStateChange,
+    onTopChange = props.onTopChange;
   var _useRefState = (0, _helpers.useRefState)(false),
-      isSticky = _useRefState[0],
-      isStickyRef = _useRefState[1],
-      setIsSticky = _useRefState[2];
-
+    isSticky = _useRefState[0],
+    isStickyRef = _useRefState[1],
+    setIsSticky = _useRefState[2];
   var _useRefState2 = (0, _helpers.useRefState)(false),
-      wasSticky = _useRefState2[0],
-      wasStickyRef = _useRefState2[1],
-      setWasSticky = _useRefState2[2];
-
+    wasSticky = _useRefState2[0],
+    wasStickyRef = _useRefState2[1],
+    setWasSticky = _useRefState2[2];
   var _useState = (0, _react.useState)({}),
-      stickyStateStyle = _useState[0],
-      setStickyStateStyle = _useState[1];
-
+    stickyStateStyle = _useState[0],
+    setStickyStateStyle = _useState[1];
   var contentRef = (0, _react.useRef)(null);
   var placeholderRef = (0, _react.useRef)(null);
   var contentCalculateHeightRef = (0, _react.useRef)(0);
@@ -76,25 +62,21 @@ var Sticky = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var framePendingRef = (0, _react.useRef)(false);
   var containerEventHandler = (0, _react.useCallback)(function (_ref) {
     var followTop = _ref.followTop,
-        followBottom = _ref.followBottom;
-
+      followBottom = _ref.followBottom;
     if (!contentRef.current) {
       return;
     }
-
     var needTop = position === 'top' || position === 'both';
     var needBottom = position === 'bottom' || position === 'both';
     var placeholderClientRect = placeholderRef.current.getBoundingClientRect();
     var contentClientRect = contentRef.current.getBoundingClientRect();
     var calculatedHeight = contentClientRect.height;
     contentCalculateHeightRef.current = contentClientRect.height;
-
     var _getScrollContainerRe = (0, _mobileUtils.getScrollContainerRect)(scrollContainerRef.current),
-        containerRect = _getScrollContainerRe.containerRect;
-
+      containerRect = _getScrollContainerRe.containerRect;
     var containerTop = containerRect.top,
-        containerBottom = containerRect.bottom,
-        containerHeight = containerRect.height;
+      containerBottom = containerRect.bottom,
+      containerHeight = containerRect.height;
     var disFromTop = placeholderClientRect.top - containerTop;
     var disFromBottom = placeholderClientRect.top + calculatedHeight - containerBottom;
     var topFollowDifference = followBottom - followOffset - calculatedHeight - topOffset - containerTop;
@@ -106,7 +88,6 @@ var Sticky = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     var cssTop = (stickyStyle === 'absolute' ? 0 : containerTop) + topOffset;
     var cssBottom = (stickyStyle === 'absolute' ? 0 : window.innerHeight - containerBottom) + bottomOffset;
     var stickyCssStyle = {};
-
     if (newStickyState) {
       stickyCssStyle = (0, _extends2.default)({
         transform: 'translateZ(0)',
@@ -122,11 +103,9 @@ var Sticky = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
         width: placeholderClientRect.width
       }, userSetStickyCssStyle || {});
     }
-
     onTopChange == null ? void 0 : onTopChange(Math.max(0, contentClientRect.top - containerTop - topOffset));
     setIsSticky(newStickyState);
     setStickyStateStyle(stickyCssStyle);
-
     if (newStickyState !== wasStickyRef.current) {
       onStickyStateChange && onStickyStateChange({
         isTopSticky: isTopSticky,
@@ -135,20 +114,17 @@ var Sticky = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
         wasSticky: wasStickyRef.current
       });
     }
-  }, [position, topOffset, bottomOffset, followOffset, zIndex, stickyStyle, onStickyStateChange, onTopChange]);
+  }, [position, topOffset, bottomOffset, followOffset, zIndex, stickyStyle, onStickyStateChange, onTopChange, userSetStickyCssStyle]);
   var recalculatePosition = (0, _react.useCallback)(function () {
     if (framePendingRef.current) {
       return;
     }
-
     (0, _mobileUtils.execRAF)(function () {
       framePendingRef.current = false;
-
       if (containerRef.current) {
         var _containerRef$current = containerRef.current.getBoundingClientRect(),
-            _top = _containerRef$current.top,
-            bottom = _containerRef$current.bottom;
-
+          _top = _containerRef$current.top,
+          bottom = _containerRef$current.bottom;
         containerEventHandler({
           followTop: _top,
           followBottom: bottom
@@ -163,15 +139,12 @@ var Sticky = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     var eventTarget = getScrollContainer ? (0, _mobileUtils.getActualContainer)(getScrollContainer) : window;
     if (!eventTarget) return;
     scrollContainerRef.current = eventTarget;
-
     var attachEventListeners = function attachEventListeners(target) {
       target.addEventListener('scroll', recalculatePosition);
     };
-
     var removeEventListeners = function removeEventListeners(target) {
       target.removeEventListener('scroll', recalculatePosition);
     };
-
     attachEventListeners(eventTarget);
     recalculatePosition();
     return function () {
@@ -194,7 +167,6 @@ var Sticky = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var computedStyle = (0, _react.useMemo)(function () {
     return (0, _extends2.default)({}, style || {}, stickyStateStyle);
   }, [stickyStateStyle, style]);
-
   function renderSticky(prefixCls) {
     return /*#__PURE__*/_react.default.createElement("div", {
       className: (0, _mobileUtils.cls)(prefixCls + "-sticky", className),
@@ -202,7 +174,6 @@ var Sticky = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
       style: computedStyle
     }, children);
   }
-
   return /*#__PURE__*/_react.default.createElement(_contextProvider.ContextLayout, null, function (_ref2) {
     var prefixCls = _ref2.prefixCls;
     return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("div", {

package/cjs/sticky/style/css/index.js

@@ -1,5 +1,4 @@
 "use strict";
 
 require("../../../../style/css/public.css");
-
 require("./index.css");

package/cjs/sticky/style/index.js

@@ -1,5 +1,4 @@
 "use strict";
 
 require("../../../style/public.less");
-
 require("./index.less");

package/cjs/style.d.ts

@@ -19,12 +19,17 @@ import './date-picker/style';
 import './dropdown/style';
 import './dropdown-menu/style';
 import './ellipsis/style';
+import './form/style';
+import './input/style';
+import './textarea/style';
+import './radio/style';
+import './image-picker/style';
+import './rate/style';
+import './slider/style';
 import './grid/style';
 import './image/style';
 import './show-monitor/style';
-import './image-picker/style';
 import './image-preview/style';
-import './input/style';
 import './load-more/style';
 import './masking/style';
 import './nav-bar/style';
@@ -39,9 +44,6 @@ import './popup-swiper/style';
 import './portal/style';
 import './progress/style';
 import './pull-refresh/style';
-import './radio/style';
-import './rate/style';
-import './slider/style';
 import './search-bar/style';
 import './stepper/style';
 import './steps/style';
@@ -50,5 +52,4 @@ import './swipe-action/style';
 import './swipe-load/style';
 import './tab-bar/style';
 import './tag/style';
-import './textarea/style';
 import './transition/style';

package/cjs/style.js

@@ -1,109 +1,57 @@
 "use strict";
 
 require("../style/public.less");
-
 require("./action-sheet/style");
-
 require("./cell/style");
-
 require("./loading/style");
-
 require("./badge/style");
-
 require("./avatar/style");
-
 require("./button/style");
-
 require("./carousel/style");
-
 require("./toast/style");
-
 require("./switch/style");
-
 require("./checkbox/style");
-
 require("./circle-progress/style");
-
 require("./collapse/style");
-
 require("./tabs/style");
-
 require("./context-provider/style");
-
 require("./dialog/style");
-
 require("./count-down/style");
-
 require("./date-picker/style");
-
 require("./dropdown/style");
-
 require("./dropdown-menu/style");
-
 require("./ellipsis/style");
-
+require("./form/style");
+require("./input/style");
+require("./textarea/style");
+require("./radio/style");
+require("./image-picker/style");
+require("./rate/style");
+require("./slider/style");
 require("./grid/style");
-
 require("./image/style");
-
 require("./show-monitor/style");
-
-require("./image-picker/style");
-
 require("./image-preview/style");
-
-require("./input/style");
-
 require("./load-more/style");
-
 require("./masking/style");
-
 require("./nav-bar/style");
-
 require("./notice-bar/style");
-
 require("./notify/style");
-
 require("./pagination/style");
-
 require("./picker/style");
-
 require("./picker-view/style");
-
 require("./popover/style");
-
 require("./popup/style");
-
 require("./popup-swiper/style");
-
 require("./portal/style");
-
 require("./progress/style");
-
 require("./pull-refresh/style");
-
-require("./radio/style");
-
-require("./rate/style");
-
-require("./slider/style");
-
 require("./search-bar/style");
-
 require("./stepper/style");
-
 require("./steps/style");
-
 require("./sticky/style");
-
 require("./swipe-action/style");
-
 require("./swipe-load/style");
-
 require("./tab-bar/style");
-
 require("./tag/style");
-
-require("./textarea/style");
-
 require("./transition/style");