@xhsreds/reds-rn-next 0.8.4-image-optimization202510221852 → 0.8.4-image-optimization202510222117

package/lib/cjs/components/Image/VisibilitySensor.js.map

@@ -1 +1 @@
-{"version":3,"file":"VisibilitySensor.js","sources":["../../../../src/components/Image/VisibilitySensor.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useRef, useState, forwardRef, useImperativeHandle } from \"react\";\nimport { Dimensions, type ScaledSize, View } from \"react-native\";\nimport type { VisibilitySensorRef, VisibilitySensorProps, RectDimensionsState } from \"./interface/visibilitySensor\";\n// function useInterval(callback: () => void, delay: number | null) {\n//   const savedCallback = useRef(callback);\n//   useEffect(() => {\n//     savedCallback.current = callback;\n//   }, [callback]);\n//   useEffect(() => {\n//     if (delay === null || delay === undefined) {\n//       return;\n//     }\n//     const id = setInterval(() => savedCallback.current(), delay);\n//     return () => clearInterval(id);\n//   }, [delay]);\n// }\nconst VisibilitySensor = forwardRef<VisibilitySensorRef, VisibilitySensorProps>((props, ref) => {\n  const { onChange, disabled = false, triggerOnce = false, delay, threshold = {}, children, ...rest } = props;\n  const localRef = useRef<View>(null);\n  const hasMountedRef = useRef(false);\n  useImperativeHandle(ref, () => ({\n    getInnerRef: () => localRef.current,\n  }));\n  const [rectDimensions, setRectDimensions] = useState<RectDimensionsState>({\n    rectTop: 0,\n    rectBottom: 0,\n    rectLeft: 0,\n    rectRight: 0,\n    rectWidth: 0,\n    rectHeight: 0,\n  });\n  const [lastValue, setLastValue] = useState<boolean | undefined>(undefined);\n  const [active, setActive] = useState<boolean>(false);\n  const measureInnerView = () => {\n    if (!active) return;\n    localRef.current?.measure((_x: number, _y: number, width: number, height: number, pageX: number, pageY: number) => {\n      const dimensions = {\n        rectTop: pageY,\n        rectBottom: pageY + height,\n        rectLeft: pageX,\n        rectRight: pageX + width,\n        rectWidth: width,\n        rectHeight: height,\n      };\n      if (\n        rectDimensions.rectTop !== dimensions.rectTop ||\n        rectDimensions.rectBottom !== dimensions.rectBottom ||\n        rectDimensions.rectLeft !== dimensions.rectLeft ||\n        rectDimensions.rectRight !== dimensions.rectRight ||\n        rectDimensions.rectWidth !== dimensions.rectWidth ||\n        rectDimensions.rectHeight !== dimensions.rectHeight\n      ) {\n        setRectDimensions(dimensions);\n      }\n    });\n  };\n  // useInterval(measureInnerView, delay || 100);\n  const startWatching = useCallback(() => {\n    if (!active) setActive(true);\n  }, [active]);\n  const stopWatching = useCallback(() => {\n    if (active) setActive(false);\n  }, [active]);\n  useEffect(() => {\n    if (!disabled) {\n      startWatching();\n    }\n    return () => {\n      stopWatching();\n    };\n  }, [disabled, startWatching, stopWatching]);\n  useEffect(() => {\n    if (!hasMountedRef.current) {\n      hasMountedRef.current = true;\n      return;\n    }\n    const window: ScaledSize = Dimensions.get(\"window\");\n    const isVisible: boolean =\n      rectDimensions.rectTop + (threshold.top || 0) <= window.height && // Top edge is within the bottom of the window\n      rectDimensions.rectBottom - (threshold.bottom || 0) >= 0 && // Bottom edge is within the top of the window\n      rectDimensions.rectLeft + (threshold.left || 0) <= window.width && // Left edge is within the right of the window\n      rectDimensions.rectRight - (threshold.right || 0) >= 0; // Right edge is within the left of the window\n    if (lastValue !== isVisible) {\n      setLastValue(isVisible);\n      onChange(isVisible);\n      if (isVisible && triggerOnce) {\n        stopWatching();\n      }\n    }\n  }, [rectDimensions, lastValue, threshold, onChange, triggerOnce, stopWatching]);\n  return (\n    <View ref={localRef} {...rest} onLayout={() => measureInnerView()}>\n      {children}\n    </View>\n  );\n});\nexport default VisibilitySensor;\n"],"names":["VisibilitySensor","forwardRef","props","ref","onChange","_props$disabled","disabled","_props$triggerOnce","triggerOnce","delay","_props$threshold","threshold","children","rest","_excluded","localRef","useRef","hasMountedRef","useImperativeHandle","getInnerRef","current","_useState","useState","rectTop","rectBottom","rectLeft","rectRight","rectWidth","rectHeight","_useState2","_slicedToArray","rectDimensions","setRectDimensions","_useState3","_useState4","lastValue","setLastValue","_useState5","_useState6","active","setActive","measureInnerView","_localRef$current","measure","_x","_y","width","height","pageX","pageY","dimensions","startWatching","useCallback","stopWatching","useEffect","window","Dimensions","get","isVisible","top","bottom","left","right","React","createElement","View","_objectSpread","onLayout"],"mappings":"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"}
+{"version":3,"file":"VisibilitySensor.js","sources":["../../../../src/components/Image/VisibilitySensor.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useRef, forwardRef, useImperativeHandle } from \"react\";\nimport { Dimensions, View } from \"react-native\";\nimport type { VisibilitySensorRef, VisibilitySensorProps } from \"./interface/visibilitySensor\";\n\nconst VisibilitySensor = forwardRef<VisibilitySensorRef, VisibilitySensorProps>((props, ref) => {\n  const { onChange, disabled = false, triggerOnce = false, delay, threshold = {}, children, ...rest } = props;\n  const localRef = useRef<View>(null);\n  const lastVisibleRef = useRef<boolean | undefined>(undefined);\n  const measuredOnceRef = useRef<boolean>(false);\n\n  useImperativeHandle(ref, () => ({\n    getInnerRef: () => localRef.current,\n  }));\n\n  // Compute visibility once using native measure; avoid react state to prevent layout loops\n  const measureAndNotify = useCallback(() => {\n    if (disabled || measuredOnceRef.current) return;\n    const win = Dimensions.get(\"window\");\n    localRef.current?.measure((_, __, width: number, height: number, pageX: number, pageY: number) => {\n      const isVisible =\n        pageY + (threshold.top || 0) <= win.height &&\n        pageY + height - (threshold.bottom || 0) >= 0 &&\n        pageX + (threshold.left || 0) <= win.width &&\n        pageX + width - (threshold.right || 0) >= 0;\n\n      if (lastVisibleRef.current !== isVisible) {\n        lastVisibleRef.current = isVisible;\n        onChange(isVisible);\n        // Only measure once to match original behavior\n        measuredOnceRef.current = true;\n      }\n    });\n  }, [disabled, onChange, threshold]);\n\n  // Keep active in sync with disabled prop\n  useEffect(() => {\n    // If it becomes enabled and we haven't measured yet, measure once now\n    if (!disabled && !measuredOnceRef.current) {\n      // Defer to allow layout to settle\n      requestAnimationFrame(() => measureAndNotify());\n    }\n  }, [disabled, measureAndNotify]);\n\n  return (\n    <View ref={localRef} {...rest} onLayout={measureAndNotify}>\n      {children}\n    </View>\n  );\n});\n\nexport default VisibilitySensor;\n"],"names":["VisibilitySensor","forwardRef","props","ref","onChange","_props$disabled","disabled","triggerOnce","delay","_props$threshold","threshold","children","rest","_excluded","localRef","useRef","lastVisibleRef","measuredOnceRef","useImperativeHandle","getInnerRef","current","measureAndNotify","useCallback","_localRef$current","win","Dimensions","get","measure","_","__","width","height","pageX","pageY","isVisible","top","bottom","left","right","useEffect","requestAnimationFrame","React","createElement","View","onLayout"],"mappings":"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"}

package/lib/esm/components/Image/VisibilitySensor.js

@@ -1,21 +1,21 @@
-import { i as _objectWithoutProperties, _ as _slicedToArray, a as _objectSpread2 } from '../../_chunks/DpFbw-p-.js';
-import React, { forwardRef, useRef, useImperativeHandle, useState, useCallback, useEffect } from 'react';
+import { i as _objectWithoutProperties, a as _objectSpread2 } from '../../_chunks/DpFbw-p-.js';
+import React, { forwardRef, useRef, useImperativeHandle, useCallback, useEffect } from 'react';
 import { Dimensions, View } from 'react-native';
 
 var _excluded = ["onChange", "disabled", "triggerOnce", "delay", "threshold", "children"];
 var VisibilitySensor = /*#__PURE__*/forwardRef(function (props, ref) {
   var onChange = props.onChange,
     _props$disabled = props.disabled,
-    disabled = _props$disabled === void 0 ? false : _props$disabled,
-    _props$triggerOnce = props.triggerOnce,
-    triggerOnce = _props$triggerOnce === void 0 ? false : _props$triggerOnce;
+    disabled = _props$disabled === void 0 ? false : _props$disabled;
+    props.triggerOnce;
     props.delay;
     var _props$threshold = props.threshold,
     threshold = _props$threshold === void 0 ? {} : _props$threshold,
     children = props.children,
     rest = _objectWithoutProperties(props, _excluded);
   var localRef = useRef(null);
-  var hasMountedRef = useRef(false);
+  var lastVisibleRef = useRef(void 0);
+  var measuredOnceRef = useRef(false);
   useImperativeHandle(ref, function () {
     return {
       getInnerRef: function getInnerRef() {
@@ -23,83 +23,30 @@ var VisibilitySensor = /*#__PURE__*/forwardRef(function (props, ref) {
       }
     };
   });
-  var _useState = useState({
-      rectTop: 0,
-      rectBottom: 0,
-      rectLeft: 0,
-      rectRight: 0,
-      rectWidth: 0,
-      rectHeight: 0
-    }),
-    _useState2 = _slicedToArray(_useState, 2),
-    rectDimensions = _useState2[0],
-    setRectDimensions = _useState2[1];
-  var _useState3 = useState(void 0),
-    _useState4 = _slicedToArray(_useState3, 2),
-    lastValue = _useState4[0],
-    setLastValue = _useState4[1];
-  var _useState5 = useState(false),
-    _useState6 = _slicedToArray(_useState5, 2),
-    active = _useState6[0],
-    setActive = _useState6[1];
-  var measureInnerView = function measureInnerView() {
+  var measureAndNotify = useCallback(function () {
     var _localRef$current;
-    if (!active) return;
-    (_localRef$current = localRef.current) === null || _localRef$current === void 0 || _localRef$current.measure(function (_x, _y, width, height, pageX, pageY) {
-      var dimensions = {
-        rectTop: pageY,
-        rectBottom: pageY + height,
-        rectLeft: pageX,
-        rectRight: pageX + width,
-        rectWidth: width,
-        rectHeight: height
-      };
-      if (rectDimensions.rectTop !== dimensions.rectTop || rectDimensions.rectBottom !== dimensions.rectBottom || rectDimensions.rectLeft !== dimensions.rectLeft || rectDimensions.rectRight !== dimensions.rectRight || rectDimensions.rectWidth !== dimensions.rectWidth || rectDimensions.rectHeight !== dimensions.rectHeight) {
-        setRectDimensions(dimensions);
+    if (disabled || measuredOnceRef.current) return;
+    var win = Dimensions.get("window");
+    (_localRef$current = localRef.current) === null || _localRef$current === void 0 || _localRef$current.measure(function (_, __, width, height, pageX, pageY) {
+      var isVisible = pageY + (threshold.top || 0) <= win.height && pageY + height - (threshold.bottom || 0) >= 0 && pageX + (threshold.left || 0) <= win.width && pageX + width - (threshold.right || 0) >= 0;
+      if (lastVisibleRef.current !== isVisible) {
+        lastVisibleRef.current = isVisible;
+        onChange(isVisible);
+        measuredOnceRef.current = true;
       }
     });
-  };
-  var startWatching = useCallback(function () {
-    if (!active) setActive(true);
-  }, [active]);
-  var stopWatching = useCallback(function () {
-    if (active) setActive(false);
-  }, [active]);
+  }, [disabled, onChange, threshold]);
   useEffect(function () {
-    if (!disabled) {
-      startWatching();
+    if (!disabled && !measuredOnceRef.current) {
+      requestAnimationFrame(function () {
+        return measureAndNotify();
+      });
     }
-    return function () {
-      stopWatching();
-    };
-  }, [disabled, startWatching, stopWatching]);
-  useEffect(function () {
-    if (!hasMountedRef.current) {
-      hasMountedRef.current = true;
-      return;
-    }
-    var window = Dimensions.get("window");
-    var isVisible = rectDimensions.rectTop + (threshold.top || 0) <= window.height &&
-    // Top edge is within the bottom of the window
-    rectDimensions.rectBottom - (threshold.bottom || 0) >= 0 &&
-    // Bottom edge is within the top of the window
-    rectDimensions.rectLeft + (threshold.left || 0) <= window.width &&
-    // Left edge is within the right of the window
-    rectDimensions.rectRight - (threshold.right || 0) >= 0;
-    if (lastValue !== isVisible) {
-      setLastValue(isVisible);
-      onChange(isVisible);
-      if (isVisible && triggerOnce) {
-        stopWatching();
-      }
-    }
-  }, [rectDimensions, lastValue, threshold, onChange, triggerOnce, stopWatching]);
+  }, [disabled, measureAndNotify]);
   return /* @__PURE__ */React.createElement(View, _objectSpread2(_objectSpread2({
     ref: localRef
   }, rest), {}, {
-    onLayout: function onLayout() {
-      return measureInnerView();
-    }
+    onLayout: measureAndNotify
   }), children);
 });
 

package/lib/esm/components/Image/VisibilitySensor.js.map

@@ -1 +1 @@
-{"version":3,"file":"VisibilitySensor.js","sources":["../../../../src/components/Image/VisibilitySensor.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useRef, useState, forwardRef, useImperativeHandle } from \"react\";\nimport { Dimensions, type ScaledSize, View } from \"react-native\";\nimport type { VisibilitySensorRef, VisibilitySensorProps, RectDimensionsState } from \"./interface/visibilitySensor\";\n// function useInterval(callback: () => void, delay: number | null) {\n//   const savedCallback = useRef(callback);\n//   useEffect(() => {\n//     savedCallback.current = callback;\n//   }, [callback]);\n//   useEffect(() => {\n//     if (delay === null || delay === undefined) {\n//       return;\n//     }\n//     const id = setInterval(() => savedCallback.current(), delay);\n//     return () => clearInterval(id);\n//   }, [delay]);\n// }\nconst VisibilitySensor = forwardRef<VisibilitySensorRef, VisibilitySensorProps>((props, ref) => {\n  const { onChange, disabled = false, triggerOnce = false, delay, threshold = {}, children, ...rest } = props;\n  const localRef = useRef<View>(null);\n  const hasMountedRef = useRef(false);\n  useImperativeHandle(ref, () => ({\n    getInnerRef: () => localRef.current,\n  }));\n  const [rectDimensions, setRectDimensions] = useState<RectDimensionsState>({\n    rectTop: 0,\n    rectBottom: 0,\n    rectLeft: 0,\n    rectRight: 0,\n    rectWidth: 0,\n    rectHeight: 0,\n  });\n  const [lastValue, setLastValue] = useState<boolean | undefined>(undefined);\n  const [active, setActive] = useState<boolean>(false);\n  const measureInnerView = () => {\n    if (!active) return;\n    localRef.current?.measure((_x: number, _y: number, width: number, height: number, pageX: number, pageY: number) => {\n      const dimensions = {\n        rectTop: pageY,\n        rectBottom: pageY + height,\n        rectLeft: pageX,\n        rectRight: pageX + width,\n        rectWidth: width,\n        rectHeight: height,\n      };\n      if (\n        rectDimensions.rectTop !== dimensions.rectTop ||\n        rectDimensions.rectBottom !== dimensions.rectBottom ||\n        rectDimensions.rectLeft !== dimensions.rectLeft ||\n        rectDimensions.rectRight !== dimensions.rectRight ||\n        rectDimensions.rectWidth !== dimensions.rectWidth ||\n        rectDimensions.rectHeight !== dimensions.rectHeight\n      ) {\n        setRectDimensions(dimensions);\n      }\n    });\n  };\n  // useInterval(measureInnerView, delay || 100);\n  const startWatching = useCallback(() => {\n    if (!active) setActive(true);\n  }, [active]);\n  const stopWatching = useCallback(() => {\n    if (active) setActive(false);\n  }, [active]);\n  useEffect(() => {\n    if (!disabled) {\n      startWatching();\n    }\n    return () => {\n      stopWatching();\n    };\n  }, [disabled, startWatching, stopWatching]);\n  useEffect(() => {\n    if (!hasMountedRef.current) {\n      hasMountedRef.current = true;\n      return;\n    }\n    const window: ScaledSize = Dimensions.get(\"window\");\n    const isVisible: boolean =\n      rectDimensions.rectTop + (threshold.top || 0) <= window.height && // Top edge is within the bottom of the window\n      rectDimensions.rectBottom - (threshold.bottom || 0) >= 0 && // Bottom edge is within the top of the window\n      rectDimensions.rectLeft + (threshold.left || 0) <= window.width && // Left edge is within the right of the window\n      rectDimensions.rectRight - (threshold.right || 0) >= 0; // Right edge is within the left of the window\n    if (lastValue !== isVisible) {\n      setLastValue(isVisible);\n      onChange(isVisible);\n      if (isVisible && triggerOnce) {\n        stopWatching();\n      }\n    }\n  }, [rectDimensions, lastValue, threshold, onChange, triggerOnce, stopWatching]);\n  return (\n    <View ref={localRef} {...rest} onLayout={() => measureInnerView()}>\n      {children}\n    </View>\n  );\n});\nexport default VisibilitySensor;\n"],"names":["VisibilitySensor","forwardRef","props","ref","onChange","_props$disabled","disabled","_props$triggerOnce","triggerOnce","delay","_props$threshold","threshold","children","rest","_excluded","localRef","useRef","hasMountedRef","useImperativeHandle","getInnerRef","current","_useState","useState","rectTop","rectBottom","rectLeft","rectRight","rectWidth","rectHeight","_useState2","_slicedToArray","rectDimensions","setRectDimensions","_useState3","_useState4","lastValue","setLastValue","_useState5","_useState6","active","setActive","measureInnerView","_localRef$current","measure","_x","_y","width","height","pageX","pageY","dimensions","startWatching","useCallback","stopWatching","useEffect","window","Dimensions","get","isVisible","top","bottom","left","right","React","createElement","View","_objectSpread","onLayout"],"mappings":"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"}
+{"version":3,"file":"VisibilitySensor.js","sources":["../../../../src/components/Image/VisibilitySensor.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useRef, forwardRef, useImperativeHandle } from \"react\";\nimport { Dimensions, View } from \"react-native\";\nimport type { VisibilitySensorRef, VisibilitySensorProps } from \"./interface/visibilitySensor\";\n\nconst VisibilitySensor = forwardRef<VisibilitySensorRef, VisibilitySensorProps>((props, ref) => {\n  const { onChange, disabled = false, triggerOnce = false, delay, threshold = {}, children, ...rest } = props;\n  const localRef = useRef<View>(null);\n  const lastVisibleRef = useRef<boolean | undefined>(undefined);\n  const measuredOnceRef = useRef<boolean>(false);\n\n  useImperativeHandle(ref, () => ({\n    getInnerRef: () => localRef.current,\n  }));\n\n  // Compute visibility once using native measure; avoid react state to prevent layout loops\n  const measureAndNotify = useCallback(() => {\n    if (disabled || measuredOnceRef.current) return;\n    const win = Dimensions.get(\"window\");\n    localRef.current?.measure((_, __, width: number, height: number, pageX: number, pageY: number) => {\n      const isVisible =\n        pageY + (threshold.top || 0) <= win.height &&\n        pageY + height - (threshold.bottom || 0) >= 0 &&\n        pageX + (threshold.left || 0) <= win.width &&\n        pageX + width - (threshold.right || 0) >= 0;\n\n      if (lastVisibleRef.current !== isVisible) {\n        lastVisibleRef.current = isVisible;\n        onChange(isVisible);\n        // Only measure once to match original behavior\n        measuredOnceRef.current = true;\n      }\n    });\n  }, [disabled, onChange, threshold]);\n\n  // Keep active in sync with disabled prop\n  useEffect(() => {\n    // If it becomes enabled and we haven't measured yet, measure once now\n    if (!disabled && !measuredOnceRef.current) {\n      // Defer to allow layout to settle\n      requestAnimationFrame(() => measureAndNotify());\n    }\n  }, [disabled, measureAndNotify]);\n\n  return (\n    <View ref={localRef} {...rest} onLayout={measureAndNotify}>\n      {children}\n    </View>\n  );\n});\n\nexport default VisibilitySensor;\n"],"names":["VisibilitySensor","forwardRef","props","ref","onChange","_props$disabled","disabled","triggerOnce","delay","_props$threshold","threshold","children","rest","_excluded","localRef","useRef","lastVisibleRef","measuredOnceRef","useImperativeHandle","getInnerRef","current","measureAndNotify","useCallback","_localRef$current","win","Dimensions","get","measure","_","__","width","height","pageX","pageY","isVisible","top","bottom","left","right","useEffect","requestAnimationFrame","React","createElement","View","onLayout"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xhsreds/reds-rn-next",
-  "version": "0.8.4-image-optimization202510221852",
+  "version": "0.8.4-image-optimization202510222117",
   "author": "贾斌(呀哈) <jiabin@xiaohongshu.com>",
   "license": "ISC",
   "dependencies": {

package/src/components/Image/VisibilitySensor.tsx

@@ -1,97 +1,51 @@
-import React, { useCallback, useEffect, useRef, useState, forwardRef, useImperativeHandle } from "react";
-import { Dimensions, type ScaledSize, View } from "react-native";
-import type { VisibilitySensorRef, VisibilitySensorProps, RectDimensionsState } from "./interface/visibilitySensor";
-// function useInterval(callback: () => void, delay: number | null) {
-//   const savedCallback = useRef(callback);
-//   useEffect(() => {
-//     savedCallback.current = callback;
-//   }, [callback]);
-//   useEffect(() => {
-//     if (delay === null || delay === undefined) {
-//       return;
-//     }
-//     const id = setInterval(() => savedCallback.current(), delay);
-//     return () => clearInterval(id);
-//   }, [delay]);
-// }
+import React, { useCallback, useEffect, useRef, forwardRef, useImperativeHandle } from "react";
+import { Dimensions, View } from "react-native";
+import type { VisibilitySensorRef, VisibilitySensorProps } from "./interface/visibilitySensor";
+
 const VisibilitySensor = forwardRef<VisibilitySensorRef, VisibilitySensorProps>((props, ref) => {
   const { onChange, disabled = false, triggerOnce = false, delay, threshold = {}, children, ...rest } = props;
   const localRef = useRef<View>(null);
-  const hasMountedRef = useRef(false);
+  const lastVisibleRef = useRef<boolean | undefined>(undefined);
+  const measuredOnceRef = useRef<boolean>(false);
+
   useImperativeHandle(ref, () => ({
     getInnerRef: () => localRef.current,
   }));
-  const [rectDimensions, setRectDimensions] = useState<RectDimensionsState>({
-    rectTop: 0,
-    rectBottom: 0,
-    rectLeft: 0,
-    rectRight: 0,
-    rectWidth: 0,
-    rectHeight: 0,
-  });
-  const [lastValue, setLastValue] = useState<boolean | undefined>(undefined);
-  const [active, setActive] = useState<boolean>(false);
-  const measureInnerView = () => {
-    if (!active) return;
-    localRef.current?.measure((_x: number, _y: number, width: number, height: number, pageX: number, pageY: number) => {
-      const dimensions = {
-        rectTop: pageY,
-        rectBottom: pageY + height,
-        rectLeft: pageX,
-        rectRight: pageX + width,
-        rectWidth: width,
-        rectHeight: height,
-      };
-      if (
-        rectDimensions.rectTop !== dimensions.rectTop ||
-        rectDimensions.rectBottom !== dimensions.rectBottom ||
-        rectDimensions.rectLeft !== dimensions.rectLeft ||
-        rectDimensions.rectRight !== dimensions.rectRight ||
-        rectDimensions.rectWidth !== dimensions.rectWidth ||
-        rectDimensions.rectHeight !== dimensions.rectHeight
-      ) {
-        setRectDimensions(dimensions);
+
+  // Compute visibility once using native measure; avoid react state to prevent layout loops
+  const measureAndNotify = useCallback(() => {
+    if (disabled || measuredOnceRef.current) return;
+    const win = Dimensions.get("window");
+    localRef.current?.measure((_, __, width: number, height: number, pageX: number, pageY: number) => {
+      const isVisible =
+        pageY + (threshold.top || 0) <= win.height &&
+        pageY + height - (threshold.bottom || 0) >= 0 &&
+        pageX + (threshold.left || 0) <= win.width &&
+        pageX + width - (threshold.right || 0) >= 0;
+
+      if (lastVisibleRef.current !== isVisible) {
+        lastVisibleRef.current = isVisible;
+        onChange(isVisible);
+        // Only measure once to match original behavior
+        measuredOnceRef.current = true;
       }
     });
-  };
-  // useInterval(measureInnerView, delay || 100);
-  const startWatching = useCallback(() => {
-    if (!active) setActive(true);
-  }, [active]);
-  const stopWatching = useCallback(() => {
-    if (active) setActive(false);
-  }, [active]);
+  }, [disabled, onChange, threshold]);
+
+  // Keep active in sync with disabled prop
   useEffect(() => {
-    if (!disabled) {
-      startWatching();
+    // If it becomes enabled and we haven't measured yet, measure once now
+    if (!disabled && !measuredOnceRef.current) {
+      // Defer to allow layout to settle
+      requestAnimationFrame(() => measureAndNotify());
     }
-    return () => {
-      stopWatching();
-    };
-  }, [disabled, startWatching, stopWatching]);
-  useEffect(() => {
-    if (!hasMountedRef.current) {
-      hasMountedRef.current = true;
-      return;
-    }
-    const window: ScaledSize = Dimensions.get("window");
-    const isVisible: boolean =
-      rectDimensions.rectTop + (threshold.top || 0) <= window.height && // Top edge is within the bottom of the window
-      rectDimensions.rectBottom - (threshold.bottom || 0) >= 0 && // Bottom edge is within the top of the window
-      rectDimensions.rectLeft + (threshold.left || 0) <= window.width && // Left edge is within the right of the window
-      rectDimensions.rectRight - (threshold.right || 0) >= 0; // Right edge is within the left of the window
-    if (lastValue !== isVisible) {
-      setLastValue(isVisible);
-      onChange(isVisible);
-      if (isVisible && triggerOnce) {
-        stopWatching();
-      }
-    }
-  }, [rectDimensions, lastValue, threshold, onChange, triggerOnce, stopWatching]);
+  }, [disabled, measureAndNotify]);
+
   return (
-    <View ref={localRef} {...rest} onLayout={() => measureInnerView()}>
+    <View ref={localRef} {...rest} onLayout={measureAndNotify}>
       {children}
     </View>
   );
 });
+
 export default VisibilitySensor;

package/src/i18n/@types/resources.d.ts

@@ -1,31 +1,31 @@
 interface Resources {
   componentKey: {
-    sureKey: "确定";
-    satisfyKey: "满意";
-    confirmKey: "确认";
-    uploadingKey: "上传中";
+    sureKey: "確定";
+    satisfyKey: "滿意";
+    confirmKey: "確認";
+    uploadingKey: "上傳中";
     resetKey: "重置";
-    NoDataKey: "暂无数据";
+    NoDataKey: "暫無數據";
     liveStreamingKey: "直播";
     generallyKey: "一般";
-    uploadFailedKey: "上传失败";
+    uploadFailedKey: "上傳失敗";
     submitKey: "提交";
-    requestSuccessfulKey: "请求成功";
+    requestSuccessfulKey: "請求成功";
     cancelKey: "取消";
-    PullDownToRefreshKey: "下拉刷新";
-    selectAllKey: "全选";
-    requestDataKey: "请求数据中";
+    PullDownToRefreshKey: "下拉重繪";
+    selectAllKey: "全選";
+    requestDataKey: "請求數據中";
     closeKey: "收起";
-    veryBadKey: "极差";
-    searchKey: "搜索";
-    expandKey: "展开";
-    IDCardPhotoKey: "身份证人像面";
+    veryBadKey: "極差";
+    searchKey: "蒐索";
+    expandKey: "展開";
+    IDCardPhotoKey: "身份證人像面";
     finishKey: "完成";
-    surpriseKey: "惊喜";
-    releaseRefreshKey: "松开刷新";
+    surpriseKey: "驚喜";
+    releaseRefreshKey: "鬆開重繪";
     nationalEmblemSideOfIDCardKey: "身份证国徽面";
-    buttonKey: "按钮";
-    jumpKey: "跳转";
+    buttonKey: "按鈕";
+    jumpKey: "跳轉";
     disappointmentKey: "失望";
   };
 }

package/src/i18n/index.json

@@ -1,35 +1,4 @@
 {
-  "zh_cn": {
-    "componentKey": {
-      "sureKey": "确定",
-      "satisfyKey": "满意",
-      "confirmKey": "确认",
-      "uploadingKey": "上传中",
-      "resetKey": "重置",
-      "NoDataKey": "暂无数据",
-      "liveStreamingKey": "直播",
-      "generallyKey": "一般",
-      "uploadFailedKey": "上传失败",
-      "submitKey": "提交",
-      "requestSuccessfulKey": "请求成功",
-      "cancelKey": "取消",
-      "PullDownToRefreshKey": "下拉刷新",
-      "selectAllKey": "全选",
-      "requestDataKey": "请求数据中",
-      "closeKey": "收起",
-      "veryBadKey": "极差",
-      "searchKey": "搜索",
-      "expandKey": "展开",
-      "IDCardPhotoKey": "身份证人像面",
-      "finishKey": "完成",
-      "surpriseKey": "惊喜",
-      "releaseRefreshKey": "松开刷新",
-      "nationalEmblemSideOfIDCardKey": "身份证国徽面",
-      "buttonKey": "按钮",
-      "jumpKey": "跳转",
-      "disappointmentKey": "失望"
-    }
-  },
   "zh_tw": {
     "componentKey": {
       "sureKey": "確定",
@@ -91,5 +60,36 @@
       "jumpKey": "Jump",
       "disappointmentKey": "Disappointment"
     }
+  },
+  "zh_cn": {
+    "componentKey": {
+      "sureKey": "确定",
+      "satisfyKey": "满意",
+      "confirmKey": "确认",
+      "uploadingKey": "上传中",
+      "resetKey": "重置",
+      "NoDataKey": "暂无数据",
+      "liveStreamingKey": "直播",
+      "generallyKey": "一般",
+      "uploadFailedKey": "上传失败",
+      "submitKey": "提交",
+      "requestSuccessfulKey": "请求成功",
+      "cancelKey": "取消",
+      "PullDownToRefreshKey": "下拉刷新",
+      "selectAllKey": "全选",
+      "requestDataKey": "请求数据中",
+      "closeKey": "收起",
+      "veryBadKey": "极差",
+      "searchKey": "搜索",
+      "expandKey": "展开",
+      "IDCardPhotoKey": "身份证人像面",
+      "finishKey": "完成",
+      "surpriseKey": "惊喜",
+      "releaseRefreshKey": "松开刷新",
+      "nationalEmblemSideOfIDCardKey": "身份证国徽面",
+      "buttonKey": "按钮",
+      "jumpKey": "跳转",
+      "disappointmentKey": "失望"
+    }
   }
 }