react-crud-mobile 1.0.648 → 1.0.650

package/dist/hooks/useIsVisible.d.ts

@@ -0,0 +1 @@
+export declare function useIsVisible(ref: any): boolean;

package/dist/react-crud-mobile.cjs.development.js

@@ -670,6 +670,36 @@ var styles$6 = /*#__PURE__*/reactNative.StyleSheet.create({
   }
 });
 
+function useIsVisible(ref) {
+  var _useState = React.useState(false),
+    isVisible = _useState[0],
+    setIsVisible = _useState[1];
+  React.useEffect(function () {
+    var checkVisibility = function checkVisibility() {
+      if (!ref.current) return;
+      if (reactNative.Platform.OS === 'web') {
+        var rect = ref.current.getBoundingClientRect == null ? void 0 : ref.current.getBoundingClientRect();
+        if (rect && typeof window !== 'undefined') {
+          var windowHeight = window.innerHeight;
+          var visible = rect.top < windowHeight && rect.bottom > 0;
+          setIsVisible(visible);
+        }
+      } else {
+        ref.current.measureInWindow == null || ref.current.measureInWindow(function (x, y, width, height) {
+          var windowHeight = reactNative.Dimensions.get('window').height;
+          var visible = y < windowHeight && y + height > 0;
+          setIsVisible(visible);
+        });
+      }
+    };
+    var interval = setInterval(checkVisibility, 300); // roda a cada 300ms
+    return function () {
+      return clearInterval(interval);
+    };
+  }, [ref]);
+  return isVisible;
+}
+
 function UIListRow(props) {
   var _repeat$list;
   var scope = props.scope;
@@ -692,27 +722,8 @@ function UIListRow(props) {
       data: item
     }))),
     row = _useState[0];
-  var main = reactCrudUtils.ViewUtils.getCrud();
   var targetRef = React.useRef(null);
-  var _useState2 = React.useState(false),
-    visivel = _useState2[0],
-    setVisivel = _useState2[1];
-  var onScroll = function onScroll() {
-    console.log(visivel);
-    if (!visivel) {
-      var handle = reactNative.findNodeHandle(targetRef.current);
-      if (handle) {
-        reactNative.UIManager.measure(handle, function (x, y, width, height, pageX, pageY) {
-          var windowHeight = reactNative.Dimensions.get('window').height;
-          var topoVisivel = pageY >= 0 && pageY < windowHeight;
-          var fundoVisivel = pageY + height > 0 && pageY + height < windowHeight;
-          setVisivel(topoVisivel || fundoVisivel);
-        });
-      }
-    }
-  };
-  row.onScroll = onScroll;
-  main.scroll[row.getName()] = row;
+  var isVisible = useIsVisible(targetRef);
   var onClick = function onClick(item) {
     row.call('click', {
       value: item,
@@ -722,7 +733,7 @@ function UIListRow(props) {
     });
   };
   var Child = function Child() {
-    if (!visivel) {
+    if (!isVisible) {
       return /*#__PURE__*/jsxRuntime.jsx(jsxRuntime.Fragment, {});
     }
     return /*#__PURE__*/jsxRuntime.jsx(jsxRuntime.Fragment, {
@@ -734,9 +745,9 @@ function UIListRow(props) {
     });
   };
   var ListItem = function ListItem() {
-    var _useState3 = React.useState(0),
-      updateIndex = _useState3[0],
-      setUpdateIndex = _useState3[1];
+    var _useState2 = React.useState(0),
+      updateIndex = _useState2[0],
+      setUpdateIndex = _useState2[1];
     var key = scope.key('item');
     var getRowStyle = function getRowStyle() {
       var css = row.getStyle('row', _extends({}, styles.row));
@@ -753,7 +764,6 @@ function UIListRow(props) {
       return /*#__PURE__*/jsxRuntime.jsx(reactNative.View, {
         style: getRowStyle(),
         ref: targetRef,
-        onLayout: onScroll,
         children: /*#__PURE__*/jsxRuntime.jsx(Child, {})
       }, key);
     }
@@ -761,7 +771,6 @@ function UIListRow(props) {
       style: getRowStyle(),
       underlayColor: 'transparent',
       ref: targetRef,
-      onLayout: onScroll,
       onPress: function onPress(e) {
         e.stopPropagation();
         onClick(item);