react-native-anchored-menu 0.0.13 → 0.0.14

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-anchored-menu",
-  "version": "0.0.13",
+  "version": "0.0.14",
   "description": "Headless anchored context menu / popover for React Native (iOS/Android) with stable measurement (default view host).",
   "repository": {
     "type": "git",

package/src/core/provider.tsx

@@ -49,11 +49,11 @@ export function AnchoredMenuProvider({
     };
     storeRef.current = {
       getSnapshot: () => snapshot,
-      subscribe: (listener) => {
+      subscribe: (listener: () => void) => {
         listeners.add(listener);
         return () => listeners.delete(listener);
       },
-      _setSnapshot: (next) => {
+      _setSnapshot: (next: MenuState) => {
         snapshot = next;
         listeners.forEach((l) => l());
       },

package/src/hooks/useAnchoredMenuState.ts

@@ -9,7 +9,7 @@ import type { MenuState } from "../types";
  *   const isOpen = useAnchoredMenuState(s => s.isOpen)
  */
 export function useAnchoredMenuState<T = MenuState>(
-  selector: (state: MenuState) => T = ((s) => s) as any
+  selector: (state: MenuState) => T = ((s: MenuState) => s) as (state: MenuState) => T
 ): T {
   const store = useContext(AnchoredMenuStateContext);
   if (!store) throw new Error("AnchoredMenuProvider is missing");

package/src/hosts/ModalHost.tsx

@@ -1,5 +1,5 @@
 import React, { useContext, useEffect, useMemo, useRef, useState } from "react";
-import { Keyboard, Modal, Platform, Pressable, View } from "react-native";
+import { Keyboard, Modal, Platform, Pressable, View, LayoutChangeEvent } from "react-native";
 import {
   AnchoredMenuActionsContext,
   AnchoredMenuStateContext,
@@ -44,7 +44,7 @@ export function ModalHost() {
   const [menuSize, setMenuSize] = useState<MenuSize>({ width: 0, height: 0 });
   const [keyboardHeight, setKeyboardHeight] = useState(0);
   const measureCacheRef = useRef(new Map<string, MeasureCache>());
-  const remeasureTimeoutRef = useRef<NodeJS.Timeout | null>(null);
+  const remeasureTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);
 
   useEffect(() => {
     if (!req) {
@@ -235,7 +235,7 @@ export function ModalHost() {
         ref={hostRef}
         collapsable={false}
         style={{ flex: 1 }}
-        onLayout={(e) => {
+        onLayout={(e: LayoutChangeEvent) => {
           const { width, height } = e.nativeEvent.layout;
           if (width !== hostSize.width || height !== hostSize.height) {
             setHostSize({ width, height });
@@ -255,7 +255,7 @@ export function ModalHost() {
               }}
               pointerEvents={needsInitialMeasure ? "none" : "auto"}
               onStartShouldSetResponder={() => true}
-              onLayout={(e) => {
+              onLayout={(e: LayoutChangeEvent) => {
                 const { width, height } = e.nativeEvent.layout;
                 if (width !== menuSize.width || height !== menuSize.height) {
                   setMenuSize({ width, height });

package/src/hosts/ViewHost.tsx

@@ -1,5 +1,5 @@
 import React, { useContext, useEffect, useMemo, useRef, useState } from "react";
-import { Keyboard, Pressable, View } from "react-native";
+import { Keyboard, Pressable, View, LayoutChangeEvent } from "react-native";
 import {
   AnchoredMenuActionsContext,
   AnchoredMenuStateContext,
@@ -51,7 +51,7 @@ export function ViewHost() {
   const [menuSize, setMenuSize] = useState<MenuSize>({ width: 0, height: 0 });
   const [keyboardHeight, setKeyboardHeight] = useState(0);
   const measureCacheRef = useRef(new Map<string, MeasureCache>());
-  const remeasureTimeoutRef = useRef<NodeJS.Timeout | null>(null);
+  const remeasureTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);
 
   useEffect(() => {
     if (!req) {
@@ -238,12 +238,12 @@ export function ViewHost() {
         elevation: 9999,
       }}
       pointerEvents="box-none"
-      onLayout={(e) => {
-        const { width, height } = e.nativeEvent.layout;
-        if (width !== hostSize.width || height !== hostSize.height) {
-          setHostSize({ width, height });
-        }
-      }}
+            onLayout={(e: LayoutChangeEvent) => {
+              const { width, height } = e.nativeEvent.layout;
+              if (width !== hostSize.width || height !== hostSize.height) {
+                setHostSize({ width, height });
+              }
+            }}
     >
       {/* Tap outside to dismiss */}
       <Pressable style={{ flex: 1 }} onPress={actions.close}>
@@ -260,7 +260,7 @@ export function ViewHost() {
             }}
             pointerEvents={needsInitialMeasure ? "none" : "auto"}
             onStartShouldSetResponder={() => true}
-            onLayout={(e) => {
+            onLayout={(e: LayoutChangeEvent) => {
               const { width, height } = e.nativeEvent.layout;
               if (width !== menuSize.width || height !== menuSize.height) {
                 setMenuSize({ width, height });

package/src/utils/measure.ts

@@ -1,5 +1,5 @@
 import { InteractionManager, UIManager, findNodeHandle } from "react-native";
-import type { AnchorMeasurement, AnchorMargins, AnchorRefObject } from "../types";
+import type { AnchorMeasurement, AnchorRefObject } from "../types";
 
 const raf = (): Promise<number> => new Promise((r) => requestAnimationFrame(r));
 
@@ -10,8 +10,10 @@ async function measureInWindowOnce(
     (target as { current?: number | null })?.current ?? target
   );
   if (!node) return null;
-  return await new Promise((resolve) => {
-    UIManager.measureInWindow(node, (x, y, width, height) => {
+  return await new Promise<AnchorMeasurement>((resolve) => {
+    // UIManager.measureInWindow callback signature varies by RN version
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    (UIManager.measureInWindow as any)(node, (x: number, y: number, width: number, height: number) => {
       resolve({ pageX: x, pageY: y, width, height });
     });
   });