react-native-hold-menu-actions 0.1.17 → 0.1.19

package/lib/commonjs/components/backdrop/Backdrop.js

@@ -88,7 +88,6 @@ const BackdropComponent = () => {
   }, /*#__PURE__*/_react.default.createElement(AnimatedBlurView // @ts-ignore
   , {
     tint: "default",
-    blurType: 'dark',
     animatedProps: animatedContainerProps,
     style: [_styles.styles.container, animatedContainerStyle]
   }, /*#__PURE__*/_react.default.createElement(_reactNativeReanimated.default.View, {

package/lib/commonjs/components/backdrop/Backdrop.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Backdrop.tsx"],"names":["AnimatedBlurView","IS_IOS","Animated","createAnimatedComponent","BlurView","View","BackdropComponent","state","theme","tapGestureEvent","onStart","event","context","startPosition","x","y","onCancel","value","CONTEXT_MENU_STATE","END","onEnd","distance","Math","hypot","shouldClose","isStateActive","ACTIVE","animatedContainerStyle","topValueAnimation","HOLD_ITEM_TRANSFORM_DURATION","WINDOW_HEIGHT","duration","opacityValueAnimation","top","opacity","animatedContainerProps","blurAmount","animatedInnerContainerStyle","backgroundColor","BACKDROP_LIGHT_BACKGROUND_COLOR","BACKDROP_DARK_BACKGROUND_COLOR","styles","container","StyleSheet","absoluteFillObject","Backdrop"],"mappings":"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","sourcesContent":["import React, { memo } from 'react';\nimport { StyleSheet } from 'react-native';\nimport Animated, {\n  useAnimatedGestureHandler,\n  useAnimatedProps,\n  useAnimatedStyle,\n  withDelay,\n  withTiming,\n} from 'react-native-reanimated';\nimport {\n  TapGestureHandler,\n  TapGestureHandlerGestureEvent,\n} from 'react-native-gesture-handler';\n\n// Components\nimport { BlurView } from '@react-native-community/blur';\n\n// Utils\nimport { styles } from './styles';\nimport {\n  CONTEXT_MENU_STATE,\n  HOLD_ITEM_TRANSFORM_DURATION,\n  IS_IOS,\n  WINDOW_HEIGHT,\n} from '../../constants';\nimport {\n  BACKDROP_LIGHT_BACKGROUND_COLOR,\n  BACKDROP_DARK_BACKGROUND_COLOR,\n} from './constants';\nimport { useInternal } from '../../hooks';\n\nconst AnimatedBlurView = IS_IOS\n  ? Animated.createAnimatedComponent(BlurView)\n  : Animated.View;\n\ntype Context = {\n  startPosition: {\n    x: number;\n    y: number;\n  };\n};\n\nconst BackdropComponent = () => {\n  const { state, theme } = useInternal();\n\n  const tapGestureEvent = useAnimatedGestureHandler<\n    TapGestureHandlerGestureEvent,\n    Context\n  >(\n    {\n      onStart: (event, context) => {\n        context.startPosition = { x: event.x, y: event.y };\n      },\n      onCancel: () => {\n        state.value = CONTEXT_MENU_STATE.END;\n      },\n      onEnd: (event, context) => {\n        const distance = Math.hypot(\n          event.x - context.startPosition.x,\n          event.y - context.startPosition.y\n        );\n        const shouldClose = distance < 10;\n        const isStateActive = state.value === CONTEXT_MENU_STATE.ACTIVE;\n\n        if (shouldClose && isStateActive) {\n          state.value = CONTEXT_MENU_STATE.END;\n        }\n      },\n    },\n    [state]\n  );\n\n  const animatedContainerStyle = useAnimatedStyle(() => {\n    const topValueAnimation = () =>\n      state.value === CONTEXT_MENU_STATE.ACTIVE\n        ? 0\n        : withDelay(\n            HOLD_ITEM_TRANSFORM_DURATION,\n            withTiming(WINDOW_HEIGHT, {\n              duration: 0,\n            })\n          );\n\n    const opacityValueAnimation = () =>\n      withTiming(state.value === CONTEXT_MENU_STATE.ACTIVE ? 1 : 0, {\n        duration: HOLD_ITEM_TRANSFORM_DURATION,\n      });\n\n    return {\n      top: topValueAnimation(),\n      opacity: opacityValueAnimation(),\n    };\n  });\n\n  const animatedContainerProps = useAnimatedProps(() => {\n    return {\n      blurAmount: withTiming(\n        state.value === CONTEXT_MENU_STATE.ACTIVE ? 100 : 0,\n        {\n          duration: HOLD_ITEM_TRANSFORM_DURATION,\n        }\n      ),\n    };\n  });\n\n  const animatedInnerContainerStyle = useAnimatedStyle(() => {\n    const backgroundColor =\n      theme.value === 'light'\n        ? BACKDROP_LIGHT_BACKGROUND_COLOR\n        : BACKDROP_DARK_BACKGROUND_COLOR;\n\n    return { backgroundColor };\n  }, [theme]);\n\n  return (\n    <TapGestureHandler onHandlerStateChange={tapGestureEvent}>\n      <AnimatedBlurView\n        // @ts-ignore\n        tint=\"default\"\n        blurType={'dark'}\n        animatedProps={animatedContainerProps}\n        style={[styles.container, animatedContainerStyle]}\n      >\n        <Animated.View\n          style={[\n            { ...StyleSheet.absoluteFillObject },\n            animatedInnerContainerStyle,\n          ]}\n        />\n      </AnimatedBlurView>\n    </TapGestureHandler>\n  );\n};\n\nconst Backdrop = memo(BackdropComponent);\n\nexport default Backdrop;\n"]}
+{"version":3,"sources":["Backdrop.tsx"],"names":["AnimatedBlurView","IS_IOS","Animated","createAnimatedComponent","BlurView","View","BackdropComponent","state","theme","tapGestureEvent","onStart","event","context","startPosition","x","y","onCancel","value","CONTEXT_MENU_STATE","END","onEnd","distance","Math","hypot","shouldClose","isStateActive","ACTIVE","animatedContainerStyle","topValueAnimation","HOLD_ITEM_TRANSFORM_DURATION","WINDOW_HEIGHT","duration","opacityValueAnimation","top","opacity","animatedContainerProps","blurAmount","animatedInnerContainerStyle","backgroundColor","BACKDROP_LIGHT_BACKGROUND_COLOR","BACKDROP_DARK_BACKGROUND_COLOR","styles","container","StyleSheet","absoluteFillObject","Backdrop"],"mappings":"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","sourcesContent":["import React, { memo } from 'react';\nimport { StyleSheet } from 'react-native';\nimport Animated, {\n  useAnimatedGestureHandler,\n  useAnimatedProps,\n  useAnimatedStyle,\n  withDelay,\n  withTiming,\n} from 'react-native-reanimated';\nimport {\n  TapGestureHandler,\n  TapGestureHandlerGestureEvent,\n} from 'react-native-gesture-handler';\n\n// Components\nimport { BlurView } from '@react-native-community/blur';\n\n// Utils\nimport { styles } from './styles';\nimport {\n  CONTEXT_MENU_STATE,\n  HOLD_ITEM_TRANSFORM_DURATION,\n  IS_IOS,\n  WINDOW_HEIGHT,\n} from '../../constants';\nimport {\n  BACKDROP_LIGHT_BACKGROUND_COLOR,\n  BACKDROP_DARK_BACKGROUND_COLOR,\n} from './constants';\nimport { useInternal } from '../../hooks';\n\nconst AnimatedBlurView = IS_IOS\n  ? Animated.createAnimatedComponent(BlurView)\n  : Animated.View;\n\ntype Context = {\n  startPosition: {\n    x: number;\n    y: number;\n  };\n};\n\nconst BackdropComponent = () => {\n  const { state, theme } = useInternal();\n\n  const tapGestureEvent = useAnimatedGestureHandler<\n    TapGestureHandlerGestureEvent,\n    Context\n  >(\n    {\n      onStart: (event, context) => {\n        context.startPosition = { x: event.x, y: event.y };\n      },\n      onCancel: () => {\n        state.value = CONTEXT_MENU_STATE.END;\n      },\n      onEnd: (event, context) => {\n        const distance = Math.hypot(\n          event.x - context.startPosition.x,\n          event.y - context.startPosition.y\n        );\n        const shouldClose = distance < 10;\n        const isStateActive = state.value === CONTEXT_MENU_STATE.ACTIVE;\n\n        if (shouldClose && isStateActive) {\n          state.value = CONTEXT_MENU_STATE.END;\n        }\n      },\n    },\n    [state]\n  );\n\n  const animatedContainerStyle = useAnimatedStyle(() => {\n    const topValueAnimation = () =>\n      state.value === CONTEXT_MENU_STATE.ACTIVE\n        ? 0\n        : withDelay(\n            HOLD_ITEM_TRANSFORM_DURATION,\n            withTiming(WINDOW_HEIGHT, {\n              duration: 0,\n            })\n          );\n\n    const opacityValueAnimation = () =>\n      withTiming(state.value === CONTEXT_MENU_STATE.ACTIVE ? 1 : 0, {\n        duration: HOLD_ITEM_TRANSFORM_DURATION,\n      });\n\n    return {\n      top: topValueAnimation(),\n      opacity: opacityValueAnimation(),\n    };\n  });\n\n  const animatedContainerProps = useAnimatedProps(() => {\n    return {\n      blurAmount: withTiming(\n        state.value === CONTEXT_MENU_STATE.ACTIVE ? 100 : 0,\n        {\n          duration: HOLD_ITEM_TRANSFORM_DURATION,\n        }\n      ),\n    };\n  });\n\n  const animatedInnerContainerStyle = useAnimatedStyle(() => {\n    const backgroundColor =\n      theme.value === 'light'\n        ? BACKDROP_LIGHT_BACKGROUND_COLOR\n        : BACKDROP_DARK_BACKGROUND_COLOR;\n\n    return { backgroundColor };\n  }, [theme]);\n\n  return (\n    <TapGestureHandler onHandlerStateChange={tapGestureEvent}>\n      <AnimatedBlurView\n        // @ts-ignore\n        tint=\"default\"\n        animatedProps={animatedContainerProps}\n        style={[styles.container, animatedContainerStyle]}\n      >\n        <Animated.View\n          style={[\n            { ...StyleSheet.absoluteFillObject },\n            animatedInnerContainerStyle,\n          ]}\n        />\n      </AnimatedBlurView>\n    </TapGestureHandler>\n  );\n};\n\nconst Backdrop = memo(BackdropComponent);\n\nexport default Backdrop;\n"]}

package/lib/commonjs/components/customView/CustomView.js

@@ -15,24 +15,19 @@ var _hooks = require("../../hooks");
 
 var _constants = require("../../constants");
 
-var _calculations = require("../../utils/calculations");
-
 function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
 
 function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (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; }
 
-const SCREEN_PADDING = 16;
-
 const CustomViewComponent = () => {
   const {
     state,
     menuProps,
-    customViewRef,
-    safeAreaInsets
+    customViewRef
   } = (0, _hooks.useInternal)();
   const [renderFn, setRenderFn] = (0, _react.useState)(null);
-  const cvHeight = (0, _reactNativeReanimated.useSharedValue)(0);
-  const cvWidth = (0, _reactNativeReanimated.useSharedValue)(0);
+  const [customViewHeight, setCustomViewHeight] = (0, _react.useState)(0);
+  const [customViewWidth, setCustomViewWidth] = (0, _react.useState)(0);
   const closeMenu = (0, _react.useCallback)(() => {
     state.value = _constants.CONTEXT_MENU_STATE.END;
   }, [state]);
@@ -41,22 +36,16 @@ const CustomViewComponent = () => {
       height,
       width
     } = event.nativeEvent.layout;
-    cvHeight.value = height;
-    cvWidth.value = width;
-    menuProps.value = { ...menuProps.value,
-      customViewHeight: height
-    };
-  }, [menuProps, cvHeight, cvWidth]);
+    setCustomViewHeight(height);
+    setCustomViewWidth(width);
+  }, []);
   const clearRenderFn = (0, _react.useCallback)(() => {
     setRenderFn(null);
-    cvHeight.value = 0;
-    cvWidth.value = 0;
-    menuProps.value = { ...menuProps.value,
-      customViewHeight: 0
-    };
-  }, [menuProps, cvHeight, cvWidth]);
-  const updateRenderFn = (0, _react.useCallback)(shouldShow => {
-    if (shouldShow && customViewRef.current) {
+    setCustomViewHeight(0);
+    setCustomViewWidth(0);
+  }, []);
+  const updateRenderFn = (0, _react.useCallback)(hasCustomView => {
+    if (hasCustomView && customViewRef.current) {
       setRenderFn(() => customViewRef.current);
     } else {
       setTimeout(clearRenderFn, _constants.HOLD_ITEM_TRANSFORM_DURATION);
@@ -75,65 +64,74 @@ const CustomViewComponent = () => {
       (0, _reactNativeReanimated.runOnJS)(updateRenderFn)(false);
     }
   }, [state, menuProps]);
-  const visibilityStyles = (0, _reactNativeReanimated.useAnimatedStyle)(() => {
-    const active = state.value === _constants.CONTEXT_MENU_STATE.ACTIVE && menuProps.value.hasCustomView;
-    return {
-      opacity: (0, _reactNativeReanimated.withTiming)(active ? 1 : 0, {
-        duration: _constants.HOLD_ITEM_TRANSFORM_DURATION
-      }),
-      transform: [{
-        scale: active ? (0, _reactNativeReanimated.withSpring)(1, _constants.SPRING_CONFIGURATION_MENU) : (0, _reactNativeReanimated.withTiming)(0, {
-          duration: _constants.HOLD_ITEM_TRANSFORM_DURATION
-        })
-      }]
-    };
-  });
   const wrapperStyles = (0, _reactNativeReanimated.useAnimatedStyle)(() => {
     const anchorPositionVertical = menuProps.value.anchorPosition.split('-')[0];
-    const isAbove = anchorPositionVertical === 'top';
+    const isAbove = anchorPositionVertical === 'top'; // Fixed anchor point: top of the item
+
     const top = menuProps.value.itemY;
-    const MAX_WIDTH = _constants.WINDOW_WIDTH - SCREEN_PADDING * 2;
-    let left = menuProps.value.itemX;
-    const w = cvWidth.value;
+    const SCREEN_PADDING = 16;
+    const MAX_WIDTH = _constants.WINDOW_WIDTH - SCREEN_PADDING * 2; // Start at item's left edge
 
-    if (w > 0 && left + w > _constants.WINDOW_WIDTH - SCREEN_PADDING) {
-      left = Math.max(SCREEN_PADDING, _constants.WINDOW_WIDTH - w - SCREEN_PADDING);
+    let left = menuProps.value.itemX; // If the view overflows the right edge, shift left
+
+    if (customViewWidth > 0 && left + customViewWidth > _constants.WINDOW_WIDTH - SCREEN_PADDING) {
+      left = Math.max(SCREEN_PADDING, _constants.WINDOW_WIDTH - customViewWidth - SCREEN_PADDING);
     }
 
     if (left < SCREEN_PADDING) {
       left = SCREEN_PADDING;
     }
 
-    const h = cvHeight.value;
-    const tY = (0, _calculations.calculateDynamicTransformValue)(menuProps.value.itemY, menuProps.value.itemHeight, menuProps.value.menuHeight, h, menuProps.value.anchorPosition, _constants.WINDOW_HEIGHT, (safeAreaInsets === null || safeAreaInsets === void 0 ? void 0 : safeAreaInsets.top) || 0, (safeAreaInsets === null || safeAreaInsets === void 0 ? void 0 : safeAreaInsets.bottom) || 0);
-    const positionOffsetY = isAbove ? -(h + 8) : menuProps.value.itemHeight + 8;
+    const tY = menuProps.value.transformValue; // Positional offset via translateY:
+    // above item: shift up by customViewHeight + gap
+    // below item: shift down by itemHeight + gap
+
+    const positionOffsetY = isAbove ? -(customViewHeight + 8) : menuProps.value.itemHeight + 8;
+    const scaleAnimation = state.value === _constants.CONTEXT_MENU_STATE.ACTIVE ? (0, _reactNativeReanimated.withDelay)(150, (0, _reactNativeReanimated.withSpring)(1, _constants.SPRING_CONFIGURATION_MENU)) : (0, _reactNativeReanimated.withTiming)(0, {
+      duration: _constants.HOLD_ITEM_TRANSFORM_DURATION
+    });
+    const opacityAnimation = (0, _reactNativeReanimated.withDelay)(150, (0, _reactNativeReanimated.withTiming)(state.value === _constants.CONTEXT_MENU_STATE.ACTIVE ? 1 : 0, {
+      duration: _constants.HOLD_ITEM_TRANSFORM_DURATION
+    })); // Scale anchor: scale from the edge closest to the item
+
+    const scaleAnchorOffset = isAbove ? customViewHeight / 2 : -(customViewHeight / 2);
     return {
       top,
       left,
       maxWidth: MAX_WIDTH,
-      transform: [{
-        translateY: (0, _reactNativeReanimated.withSpring)(tY, _constants.SPRING_CONFIGURATION)
-      }, {
+      opacity: opacityAnimation,
+      transform: [// 1. Transform value (screen boundary compensation)
+      {
+        translateY: state.value === _constants.CONTEXT_MENU_STATE.ACTIVE ? (0, _reactNativeReanimated.withSpring)(tY, _constants.SPRING_CONFIGURATION) : (0, _reactNativeReanimated.withTiming)(0, {
+          duration: _constants.HOLD_ITEM_TRANSFORM_DURATION
+        })
+      }, // 2. Position offset (animated when customViewHeight changes)
+      {
         translateY: (0, _reactNativeReanimated.withSpring)(positionOffsetY, _constants.SPRING_CONFIGURATION_MENU)
+      }, // 3. Scale anchor: move to edge -> scale -> move back
+      {
+        translateY: scaleAnchorOffset
+      }, {
+        scale: scaleAnimation
+      }, {
+        translateY: -scaleAnchorOffset
       }]
     };
-  });
+  }, [menuProps, customViewHeight, customViewWidth]);
+  if (!renderFn) return null;
   return /*#__PURE__*/_react.default.createElement(_reactNativeReanimated.default.View, {
     style: [styles.customViewWrapper, wrapperStyles]
-  }, /*#__PURE__*/_react.default.createElement(_reactNativeReanimated.default.View, {
-    style: visibilityStyles
   }, /*#__PURE__*/_react.default.createElement(_reactNativeReanimated.default.View, {
     onLayout: onLayout
-  }, renderFn === null || renderFn === void 0 ? void 0 : renderFn({
+  }, renderFn({
     closeMenu
-  }))));
+  })));
 };
 
 const styles = _reactNative.StyleSheet.create({
   customViewWrapper: {
     position: 'absolute',
-    zIndex: 20,
-    pointerEvents: 'box-none'
+    zIndex: 20
   }
 });
 

package/lib/commonjs/components/customView/CustomView.js.map

@@ -1 +1 @@
-{"version":3,"sources":["CustomView.tsx"],"names":["SCREEN_PADDING","CustomViewComponent","state","menuProps","customViewRef","safeAreaInsets","renderFn","setRenderFn","cvHeight","cvWidth","closeMenu","value","CONTEXT_MENU_STATE","END","onLayout","event","height","width","nativeEvent","layout","customViewHeight","clearRenderFn","updateRenderFn","shouldShow","current","setTimeout","HOLD_ITEM_TRANSFORM_DURATION","currentState","hasCustomView","ACTIVE","visibilityStyles","active","opacity","duration","transform","scale","SPRING_CONFIGURATION_MENU","wrapperStyles","anchorPositionVertical","anchorPosition","split","isAbove","top","itemY","MAX_WIDTH","WINDOW_WIDTH","left","itemX","w","Math","max","h","tY","itemHeight","menuHeight","WINDOW_HEIGHT","bottom","positionOffsetY","maxWidth","translateY","SPRING_CONFIGURATION","styles","customViewWrapper","StyleSheet","create","position","zIndex","pointerEvents","CustomView","React","memo"],"mappings":"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","sourcesContent":["import React, { useCallback, useState } from 'react';\nimport { LayoutChangeEvent, StyleSheet } from 'react-native';\n\nimport Animated, {\n  runOnJS,\n  useAnimatedReaction,\n  useAnimatedStyle,\n  useSharedValue,\n  withSpring,\n  withTiming,\n} from 'react-native-reanimated';\n\nimport { useInternal } from '../../hooks';\nimport {\n  HOLD_ITEM_TRANSFORM_DURATION,\n  CONTEXT_MENU_STATE,\n  SPRING_CONFIGURATION,\n  SPRING_CONFIGURATION_MENU,\n  WINDOW_WIDTH,\n  WINDOW_HEIGHT,\n} from '../../constants';\nimport { RenderCustomView } from '../menu/types';\nimport { calculateDynamicTransformValue } from '../../utils/calculations';\n\nconst SCREEN_PADDING = 16;\n\nconst CustomViewComponent = () => {\n  const { state, menuProps, customViewRef, safeAreaInsets } = useInternal();\n\n  const [renderFn, setRenderFn] = useState<RenderCustomView | null>(null);\n\n  const cvHeight = useSharedValue(0);\n  const cvWidth = useSharedValue(0);\n\n  const closeMenu = useCallback(() => {\n    state.value = CONTEXT_MENU_STATE.END;\n  }, [state]);\n\n  const onLayout = useCallback(\n    (event: LayoutChangeEvent) => {\n      const { height, width } = event.nativeEvent.layout;\n      cvHeight.value = height;\n      cvWidth.value = width;\n      menuProps.value = { ...menuProps.value, customViewHeight: height };\n    },\n    [menuProps, cvHeight, cvWidth]\n  );\n\n  const clearRenderFn = useCallback(() => {\n    setRenderFn(null);\n    cvHeight.value = 0;\n    cvWidth.value = 0;\n    menuProps.value = { ...menuProps.value, customViewHeight: 0 };\n  }, [menuProps, cvHeight, cvWidth]);\n\n  const updateRenderFn = useCallback(\n    (shouldShow: boolean) => {\n      if (shouldShow && customViewRef.current) {\n        setRenderFn(() => customViewRef.current);\n      } else {\n        setTimeout(clearRenderFn, HOLD_ITEM_TRANSFORM_DURATION);\n      }\n    },\n    [customViewRef, clearRenderFn]\n  );\n\n  useAnimatedReaction(\n    () => ({\n      currentState: state.value,\n      hasCustomView: menuProps.value.hasCustomView,\n    }),\n    ({ currentState, hasCustomView }) => {\n      if (currentState === CONTEXT_MENU_STATE.ACTIVE && hasCustomView) {\n        runOnJS(updateRenderFn)(true);\n      } else if (currentState === CONTEXT_MENU_STATE.END) {\n        runOnJS(updateRenderFn)(false);\n      }\n    },\n    [state, menuProps]\n  );\n\n  const visibilityStyles = useAnimatedStyle(() => {\n    const active =\n      state.value === CONTEXT_MENU_STATE.ACTIVE &&\n      menuProps.value.hasCustomView;\n    return {\n      opacity: withTiming(active ? 1 : 0, {\n        duration: HOLD_ITEM_TRANSFORM_DURATION,\n      }),\n      transform: [\n        {\n          scale: active\n            ? withSpring(1, SPRING_CONFIGURATION_MENU)\n            : withTiming(0, { duration: HOLD_ITEM_TRANSFORM_DURATION }),\n        },\n      ],\n    };\n  });\n\n  const wrapperStyles = useAnimatedStyle(() => {\n    const anchorPositionVertical = menuProps.value.anchorPosition.split('-')[0];\n    const isAbove = anchorPositionVertical === 'top';\n\n    const top = menuProps.value.itemY;\n    const MAX_WIDTH = WINDOW_WIDTH - SCREEN_PADDING * 2;\n\n    let left = menuProps.value.itemX;\n    const w = cvWidth.value;\n    if (w > 0 && left + w > WINDOW_WIDTH - SCREEN_PADDING) {\n      left = Math.max(SCREEN_PADDING, WINDOW_WIDTH - w - SCREEN_PADDING);\n    }\n    if (left < SCREEN_PADDING) {\n      left = SCREEN_PADDING;\n    }\n\n    const h = cvHeight.value;\n    const tY = calculateDynamicTransformValue(\n      menuProps.value.itemY,\n      menuProps.value.itemHeight,\n      menuProps.value.menuHeight,\n      h,\n      menuProps.value.anchorPosition,\n      WINDOW_HEIGHT,\n      safeAreaInsets?.top || 0,\n      safeAreaInsets?.bottom || 0\n    );\n\n    const positionOffsetY = isAbove ? -(h + 8) : menuProps.value.itemHeight + 8;\n\n    return {\n      top,\n      left,\n      maxWidth: MAX_WIDTH,\n      transform: [\n        { translateY: withSpring(tY, SPRING_CONFIGURATION) },\n        { translateY: withSpring(positionOffsetY, SPRING_CONFIGURATION_MENU) },\n      ],\n    };\n  });\n\n  return (\n    <Animated.View style={[styles.customViewWrapper, wrapperStyles]}>\n      <Animated.View style={visibilityStyles}>\n        <Animated.View onLayout={onLayout}>\n          {renderFn?.({ closeMenu })}\n        </Animated.View>\n      </Animated.View>\n    </Animated.View>\n  );\n};\n\nconst styles = StyleSheet.create({\n  customViewWrapper: {\n    position: 'absolute',\n    zIndex: 20,\n    pointerEvents: 'box-none',\n  },\n});\n\nconst CustomView = React.memo(CustomViewComponent);\n\nexport default CustomView;\n"]}
+{"version":3,"sources":["CustomView.tsx"],"names":["CustomViewComponent","state","menuProps","customViewRef","renderFn","setRenderFn","customViewHeight","setCustomViewHeight","customViewWidth","setCustomViewWidth","closeMenu","value","CONTEXT_MENU_STATE","END","onLayout","event","height","width","nativeEvent","layout","clearRenderFn","updateRenderFn","hasCustomView","current","setTimeout","HOLD_ITEM_TRANSFORM_DURATION","currentState","ACTIVE","wrapperStyles","anchorPositionVertical","anchorPosition","split","isAbove","top","itemY","SCREEN_PADDING","MAX_WIDTH","WINDOW_WIDTH","left","itemX","Math","max","tY","transformValue","positionOffsetY","itemHeight","scaleAnimation","SPRING_CONFIGURATION_MENU","duration","opacityAnimation","scaleAnchorOffset","maxWidth","opacity","transform","translateY","SPRING_CONFIGURATION","scale","styles","customViewWrapper","StyleSheet","create","position","zIndex","CustomView","React","memo"],"mappings":"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","sourcesContent":["import React, { useCallback, useState } from 'react';\nimport { LayoutChangeEvent, StyleSheet } from 'react-native';\n\nimport Animated, {\n  runOnJS,\n  useAnimatedReaction,\n  useAnimatedStyle,\n  withDelay,\n  withSpring,\n  withTiming,\n} from 'react-native-reanimated';\n\nimport { useInternal } from '../../hooks';\nimport {\n  HOLD_ITEM_TRANSFORM_DURATION,\n  CONTEXT_MENU_STATE,\n  SPRING_CONFIGURATION,\n  SPRING_CONFIGURATION_MENU,\n  WINDOW_WIDTH,\n} from '../../constants';\nimport { RenderCustomView } from '../menu/types';\n\nconst CustomViewComponent = () => {\n  const { state, menuProps, customViewRef } = useInternal();\n\n  const [renderFn, setRenderFn] = useState<RenderCustomView | null>(null);\n  const [customViewHeight, setCustomViewHeight] = useState(0);\n  const [customViewWidth, setCustomViewWidth] = useState(0);\n\n  const closeMenu = useCallback(() => {\n    state.value = CONTEXT_MENU_STATE.END;\n  }, [state]);\n\n  const onLayout = useCallback((event: LayoutChangeEvent) => {\n    const { height, width } = event.nativeEvent.layout;\n    setCustomViewHeight(height);\n    setCustomViewWidth(width);\n  }, []);\n\n  const clearRenderFn = useCallback(() => {\n    setRenderFn(null);\n    setCustomViewHeight(0);\n    setCustomViewWidth(0);\n  }, []);\n\n  const updateRenderFn = useCallback(\n    (hasCustomView: boolean) => {\n      if (hasCustomView && customViewRef.current) {\n        setRenderFn(() => customViewRef.current);\n      } else {\n        setTimeout(clearRenderFn, HOLD_ITEM_TRANSFORM_DURATION);\n      }\n    },\n    [customViewRef, clearRenderFn]\n  );\n\n  useAnimatedReaction(\n    () => ({\n      currentState: state.value,\n      hasCustomView: menuProps.value.hasCustomView,\n    }),\n    ({ currentState, hasCustomView }) => {\n      if (currentState === CONTEXT_MENU_STATE.ACTIVE && hasCustomView) {\n        runOnJS(updateRenderFn)(true);\n      } else if (currentState === CONTEXT_MENU_STATE.END) {\n        runOnJS(updateRenderFn)(false);\n      }\n    },\n    [state, menuProps]\n  );\n\n  const wrapperStyles = useAnimatedStyle(() => {\n    const anchorPositionVertical = menuProps.value.anchorPosition.split('-')[0];\n    const isAbove = anchorPositionVertical === 'top';\n\n    // Fixed anchor point: top of the item\n    const top = menuProps.value.itemY;\n\n    const SCREEN_PADDING = 16;\n    const MAX_WIDTH = WINDOW_WIDTH - SCREEN_PADDING * 2;\n\n    // Start at item's left edge\n    let left = menuProps.value.itemX;\n\n    // If the view overflows the right edge, shift left\n    if (\n      customViewWidth > 0 &&\n      left + customViewWidth > WINDOW_WIDTH - SCREEN_PADDING\n    ) {\n      left = Math.max(\n        SCREEN_PADDING,\n        WINDOW_WIDTH - customViewWidth - SCREEN_PADDING\n      );\n    }\n    if (left < SCREEN_PADDING) {\n      left = SCREEN_PADDING;\n    }\n    const tY = menuProps.value.transformValue;\n\n    // Positional offset via translateY:\n    // above item: shift up by customViewHeight + gap\n    // below item: shift down by itemHeight + gap\n    const positionOffsetY = isAbove\n      ? -(customViewHeight + 8)\n      : menuProps.value.itemHeight + 8;\n\n    const scaleAnimation =\n      state.value === CONTEXT_MENU_STATE.ACTIVE\n        ? withDelay(150, withSpring(1, SPRING_CONFIGURATION_MENU))\n        : withTiming(0, { duration: HOLD_ITEM_TRANSFORM_DURATION });\n\n    const opacityAnimation = withDelay(\n      150,\n      withTiming(state.value === CONTEXT_MENU_STATE.ACTIVE ? 1 : 0, {\n        duration: HOLD_ITEM_TRANSFORM_DURATION,\n      })\n    );\n\n    // Scale anchor: scale from the edge closest to the item\n    const scaleAnchorOffset = isAbove\n      ? customViewHeight / 2\n      : -(customViewHeight / 2);\n\n    return {\n      top,\n      left,\n      maxWidth: MAX_WIDTH,\n      opacity: opacityAnimation,\n      transform: [\n        // 1. Transform value (screen boundary compensation)\n        {\n          translateY:\n            state.value === CONTEXT_MENU_STATE.ACTIVE\n              ? withSpring(tY, SPRING_CONFIGURATION)\n              : withTiming(0, { duration: HOLD_ITEM_TRANSFORM_DURATION }),\n        },\n        // 2. Position offset (animated when customViewHeight changes)\n        { translateY: withSpring(positionOffsetY, SPRING_CONFIGURATION_MENU) },\n        // 3. Scale anchor: move to edge -> scale -> move back\n        { translateY: scaleAnchorOffset },\n        { scale: scaleAnimation },\n        { translateY: -scaleAnchorOffset },\n      ],\n    };\n  }, [menuProps, customViewHeight, customViewWidth]);\n\n  if (!renderFn) return null;\n\n  return (\n    <Animated.View style={[styles.customViewWrapper, wrapperStyles]}>\n      <Animated.View onLayout={onLayout}>\n        {renderFn({ closeMenu })}\n      </Animated.View>\n    </Animated.View>\n  );\n};\n\nconst styles = StyleSheet.create({\n  customViewWrapper: {\n    position: 'absolute',\n    zIndex: 20,\n  },\n});\n\nconst CustomView = React.memo(CustomViewComponent);\n\nexport default CustomView;\n"]}

package/lib/commonjs/components/holdItem/HoldItem.js

@@ -129,14 +129,22 @@ const HoldItemComponent = ({
   const calculateTransformValue = () => {
     'worklet';
 
-    const height = deviceOrientation === 'portrait' ? _constants.WINDOW_HEIGHT : _constants.WINDOW_WIDTH;
+    const screenH = deviceOrientation === 'portrait' ? _constants.WINDOW_HEIGHT : _constants.WINDOW_WIDTH;
+    const hasCustomView = !!renderCustomView; // If custom view exists, center item on screen
+
+    if (hasCustomView && !disableMove) {
+      const itemCenterY = itemRectY.value + itemRectHeight.value / 2;
+      const screenCenterY = screenH / 2;
+      return screenCenterY - itemCenterY;
+    }
+
     const isAnchorPointTop = transformOrigin.value.includes('top');
     let tY = 0;
 
     if (!disableMove) {
       if (isAnchorPointTop) {
         const topTransform = itemRectY.value + itemRectHeight.value + menuHeight + _styleGuide.default.spacing + ((safeAreaInsets === null || safeAreaInsets === void 0 ? void 0 : safeAreaInsets.bottom) || 0);
-        tY = topTransform > height ? height - topTransform : 0;
+        tY = topTransform > screenH ? screenH - topTransform : 0;
       } else {
         const bottomTransform = itemRectY.value - menuHeight - ((safeAreaInsets === null || safeAreaInsets === void 0 ? void 0 : safeAreaInsets.top) || 0);
         tY = bottomTransform < 0 ? -bottomTransform + _styleGuide.default.spacing * 2 : 0;
@@ -163,7 +171,6 @@ const HoldItemComponent = ({
       menuHeight: menuHeight,
       items: items || [],
       transformValue: transformValue.value,
-      customViewHeight: 0,
       actionParams: actionParams || {},
       hasCustomView: !!renderCustomView
     };
@@ -286,8 +293,7 @@ const HoldItemComponent = ({
       duration: 0
     }));
 
-    const screenH = deviceOrientation === 'portrait' ? _constants.WINDOW_HEIGHT : _constants.WINDOW_WIDTH;
-    let tY = (0, _calculations.calculateDynamicTransformValue)(itemRectY.value, itemRectHeight.value, menuHeight, menuProps.value.customViewHeight, transformOrigin.value, screenH, (safeAreaInsets === null || safeAreaInsets === void 0 ? void 0 : safeAreaInsets.top) || 0, (safeAreaInsets === null || safeAreaInsets === void 0 ? void 0 : safeAreaInsets.bottom) || 0);
+    let tY = calculateTransformValue();
 
     const transformAnimation = () => disableMove ? 0 : isActive.value ? (0, _reactNativeReanimated.withSpring)(tY, _constants.SPRING_CONFIGURATION) : (0, _reactNativeReanimated.withTiming)(-0.1, {
       duration: _constants.HOLD_ITEM_TRANSFORM_DURATION

package/lib/commonjs/components/holdItem/HoldItem.js.map

@@ -1 +1 @@
-{"version":3,"sources":["HoldItem.tsx"],"names":["HoldItemComponent","items","renderCustomView","bottom","containerStyles","disableMove","menuAnchorPosition","activateOn","hapticFeedback","actionParams","closeOnTap","longPressMinDurationMs","children","state","menuProps","customViewRef","safeAreaInsets","deviceOrientation","isActive","isAnimationStarted","itemRectY","itemRectX","itemRectWidth","itemRectHeight","itemScale","transformValue","transformOrigin","key","menuHeight","length","itemsWithSeparator","filter","item","withSeparator","isHold","containerRef","hapticResponse","style","Haptics","selectionAsync","impactAsync","ImpactFeedbackStyle","notificationAsync","NotificationFeedbackType","activateAnimation","ctx","didMeasureLayout","measured","value","pageY","pageX","height","width","position","WINDOW_WIDTH","WINDOW_HEIGHT","calculateTransformValue","isAnchorPointTop","includes","tY","topTransform","styleGuide","spacing","bottomTransform","top","updateCustomViewRef","current","setMenuProps","itemHeight","itemWidth","itemY","itemX","anchorPosition","customViewHeight","hasCustomView","scaleBack","duration","HOLD_ITEM_TRANSFORM_DURATION","onCompletion","isFinised","hasItems","CONTEXT_MENU_STATE","ACTIVE","scaleHold","HOLD_ITEM_SCALE_DOWN_VALUE","HOLD_ITEM_SCALE_DOWN_DURATION","scaleTap","canCallActivateFunctions","willActivateWithTap","gestureEvent","onActive","_","context","onFinish","overlayGestureEvent","END","animatedContainerStyle","animateOpacity","opacity","transform","scale","containerStyle","React","useMemo","animatedPortalStyle","screenH","transformAnimation","SPRING_CONFIGURATION","zIndex","left","translateY","portalContainerStyle","styles","holdItem","animatedPortalProps","pointerEvents","_state","GestureHandler","handlerChildren","PortalOverlay","portalOverlay","HoldItem"],"mappings":"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","sourcesContent":["import React, { memo, useMemo } from 'react';\nimport { ViewProps } from 'react-native';\n\n//#region reanimated & gesture handler\nimport {\n  TapGestureHandler,\n  LongPressGestureHandler,\n  TapGestureHandlerGestureEvent,\n  LongPressGestureHandlerGestureEvent,\n} from 'react-native-gesture-handler';\nimport Animated, {\n  measure,\n  runOnJS,\n  useAnimatedGestureHandler,\n  useAnimatedProps,\n  useAnimatedRef,\n  useAnimatedStyle,\n  useSharedValue,\n  withDelay,\n  withTiming,\n  withSequence,\n  withSpring,\n  useAnimatedReaction,\n} from 'react-native-reanimated';\n//#endregion\n\n//#region dependencies\nimport { Portal } from '@gorhom/portal';\nimport { nanoid } from 'nanoid/non-secure';\nimport * as Haptics from 'expo-haptics';\n//#endregion\n\n//#region utils & types\nimport {\n  TransformOriginAnchorPosition,\n  getTransformOrigin,\n  calculateMenuHeight,\n  calculateDynamicTransformValue,\n} from '../../utils/calculations';\nimport {\n  HOLD_ITEM_TRANSFORM_DURATION,\n  HOLD_ITEM_SCALE_DOWN_DURATION,\n  HOLD_ITEM_SCALE_DOWN_VALUE,\n  SPRING_CONFIGURATION,\n  WINDOW_HEIGHT,\n  WINDOW_WIDTH,\n  CONTEXT_MENU_STATE,\n} from '../../constants';\nimport { useDeviceOrientation } from '../../hooks';\nimport styles from './styles';\n\nimport type { HoldItemProps, GestureHandlerProps } from './types';\nimport styleGuide from '../../styleGuide';\nimport { useInternal } from '../../hooks';\n//#endregion\n\ntype Context = { didMeasureLayout: boolean };\n\nconst HoldItemComponent = ({\n  items,\n  renderCustomView,\n  bottom,\n  containerStyles,\n  disableMove,\n  menuAnchorPosition,\n  activateOn,\n  hapticFeedback,\n  actionParams,\n  closeOnTap,\n  longPressMinDurationMs = 150,\n  children,\n}: HoldItemProps) => {\n  //#region hooks\n  const { state, menuProps, customViewRef, safeAreaInsets } = useInternal();\n  const deviceOrientation = useDeviceOrientation();\n  //#endregion\n\n  //#region variables\n  const isActive = useSharedValue(false);\n  const isAnimationStarted = useSharedValue(false);\n\n  const itemRectY = useSharedValue<number>(0);\n  const itemRectX = useSharedValue<number>(0);\n  const itemRectWidth = useSharedValue<number>(0);\n  const itemRectHeight = useSharedValue<number>(0);\n  const itemScale = useSharedValue<number>(1);\n  const transformValue = useSharedValue<number>(0);\n\n  const transformOrigin = useSharedValue<TransformOriginAnchorPosition>(\n    menuAnchorPosition || 'top-right'\n  );\n\n  const key = useMemo(() => `hold-item-${nanoid()}`, []);\n  const menuHeight = useMemo(() => {\n    if (!items || items.length === 0) return 0;\n    const itemsWithSeparator = items.filter(item => item.withSeparator);\n    return calculateMenuHeight(items.length, itemsWithSeparator.length);\n  }, [items]);\n\n  const isHold = !activateOn || activateOn === 'hold';\n  //#endregion\n\n  //#region refs\n  const containerRef = useAnimatedRef<Animated.View>();\n  //#endregion\n\n  //#region functions\n  const hapticResponse = () => {\n    const style = !hapticFeedback ? 'Medium' : hapticFeedback;\n    switch (style) {\n      case `Selection`:\n        Haptics.selectionAsync();\n        break;\n      case `Light`:\n      case `Medium`:\n      case `Heavy`:\n        Haptics.impactAsync(Haptics.ImpactFeedbackStyle[style]);\n        break;\n      case `Success`:\n      case `Warning`:\n      case `Error`:\n        Haptics.notificationAsync(Haptics.NotificationFeedbackType[style]);\n        break;\n      default:\n    }\n  };\n  //#endregion\n\n  //#region worklet functions\n  const activateAnimation = (ctx: any) => {\n    'worklet';\n    if (!ctx.didMeasureLayout) {\n      const measured = measure(containerRef);\n\n      itemRectY.value = measured.pageY;\n      itemRectX.value = measured.pageX;\n      itemRectHeight.value = measured.height;\n      itemRectWidth.value = measured.width;\n\n      if (!menuAnchorPosition) {\n        const position = getTransformOrigin(\n          measured.pageX,\n          itemRectWidth.value,\n          deviceOrientation === 'portrait' ? WINDOW_WIDTH : WINDOW_HEIGHT,\n          bottom\n        );\n        transformOrigin.value = position;\n      }\n    }\n  };\n\n  const calculateTransformValue = () => {\n    'worklet';\n\n    const height =\n      deviceOrientation === 'portrait' ? WINDOW_HEIGHT : WINDOW_WIDTH;\n\n    const isAnchorPointTop = transformOrigin.value.includes('top');\n\n    let tY = 0;\n    if (!disableMove) {\n      if (isAnchorPointTop) {\n        const topTransform =\n          itemRectY.value +\n          itemRectHeight.value +\n          menuHeight +\n          styleGuide.spacing +\n          (safeAreaInsets?.bottom || 0);\n\n        tY = topTransform > height ? height - topTransform : 0;\n      } else {\n        const bottomTransform =\n          itemRectY.value - menuHeight - (safeAreaInsets?.top || 0);\n        tY =\n          bottomTransform < 0 ? -bottomTransform + styleGuide.spacing * 2 : 0;\n      }\n    }\n    return tY;\n  };\n\n  const updateCustomViewRef = () => {\n    customViewRef.current = renderCustomView || null;\n  };\n\n  const setMenuProps = () => {\n    'worklet';\n\n    runOnJS(updateCustomViewRef)();\n\n    menuProps.value = {\n      itemHeight: itemRectHeight.value,\n      itemWidth: itemRectWidth.value,\n      itemY: itemRectY.value,\n      itemX: itemRectX.value,\n      anchorPosition: transformOrigin.value,\n      menuHeight: menuHeight,\n      items: items || [],\n      transformValue: transformValue.value,\n      customViewHeight: 0,\n      actionParams: actionParams || {},\n      hasCustomView: !!renderCustomView,\n    };\n  };\n\n  const scaleBack = () => {\n    'worklet';\n    itemScale.value = withTiming(1, {\n      duration: HOLD_ITEM_TRANSFORM_DURATION / 2,\n    });\n  };\n\n  const onCompletion = (isFinised?: boolean) => {\n    'worklet';\n    const hasItems = items && items.length > 0;\n    const hasCustomView = !!renderCustomView;\n    if (isFinised && (hasItems || hasCustomView)) {\n      state.value = CONTEXT_MENU_STATE.ACTIVE;\n      isActive.value = true;\n      scaleBack();\n      if (hapticFeedback !== 'None') {\n        runOnJS(hapticResponse)();\n      }\n    }\n\n    isAnimationStarted.value = false;\n  };\n\n  const scaleHold = () => {\n    'worklet';\n    itemScale.value = withTiming(\n      HOLD_ITEM_SCALE_DOWN_VALUE,\n      { duration: HOLD_ITEM_SCALE_DOWN_DURATION },\n      onCompletion\n    );\n  };\n\n  const scaleTap = () => {\n    'worklet';\n    isAnimationStarted.value = true;\n\n    itemScale.value = withSequence(\n      withTiming(HOLD_ITEM_SCALE_DOWN_VALUE, {\n        duration: HOLD_ITEM_SCALE_DOWN_DURATION,\n      }),\n      withTiming(\n        1,\n        {\n          duration: HOLD_ITEM_TRANSFORM_DURATION / 2,\n        },\n        onCompletion\n      )\n    );\n  };\n\n  /**\n   * When use tap activation (\"tap\") and trying to tap multiple times,\n   * scale animation is called again despite it is started. This causes a bug.\n   * To prevent this, it is better to check is animation already started.\n   */\n  const canCallActivateFunctions = () => {\n    'worklet';\n    const willActivateWithTap =\n      activateOn === 'double-tap' || activateOn === 'tap';\n\n    return (\n      (willActivateWithTap && !isAnimationStarted.value) || !willActivateWithTap\n    );\n  };\n  //#endregion\n\n  //#region gesture events\n  const gestureEvent = useAnimatedGestureHandler<\n    LongPressGestureHandlerGestureEvent | TapGestureHandlerGestureEvent,\n    Context\n  >({\n    onActive: (_, context) => {\n      if (canCallActivateFunctions()) {\n        if (!context.didMeasureLayout) {\n          activateAnimation(context);\n          transformValue.value = calculateTransformValue();\n          setMenuProps();\n          context.didMeasureLayout = true;\n        }\n\n        if (!isActive.value) {\n          if (isHold) {\n            scaleHold();\n          } else {\n            scaleTap();\n          }\n        }\n      }\n    },\n    onFinish: (_, context) => {\n      context.didMeasureLayout = false;\n      if (isHold) {\n        scaleBack();\n      }\n    },\n  });\n\n  const overlayGestureEvent = useAnimatedGestureHandler<\n    TapGestureHandlerGestureEvent,\n    Context\n  >({\n    onActive: _ => {\n      if (closeOnTap) state.value = CONTEXT_MENU_STATE.END;\n    },\n  });\n  //#endregion\n\n  //#region animated styles & props\n  const animatedContainerStyle = useAnimatedStyle(() => {\n    const animateOpacity = () =>\n      withDelay(HOLD_ITEM_TRANSFORM_DURATION, withTiming(1, { duration: 0 }));\n\n    return {\n      opacity: isActive.value ? 0 : animateOpacity(),\n      transform: [\n        {\n          scale: isActive.value\n            ? withTiming(1, { duration: HOLD_ITEM_TRANSFORM_DURATION })\n            : itemScale.value,\n        },\n      ],\n    };\n  });\n  const containerStyle = React.useMemo(\n    () => [containerStyles, animatedContainerStyle],\n    [containerStyles, animatedContainerStyle]\n  );\n\n  const animatedPortalStyle = useAnimatedStyle(() => {\n    const animateOpacity = () =>\n      withDelay(HOLD_ITEM_TRANSFORM_DURATION, withTiming(0, { duration: 0 }));\n\n    const screenH =\n      deviceOrientation === 'portrait' ? WINDOW_HEIGHT : WINDOW_WIDTH;\n    let tY = calculateDynamicTransformValue(\n      itemRectY.value,\n      itemRectHeight.value,\n      menuHeight,\n      menuProps.value.customViewHeight,\n      transformOrigin.value,\n      screenH,\n      safeAreaInsets?.top || 0,\n      safeAreaInsets?.bottom || 0\n    );\n    const transformAnimation = () =>\n      disableMove\n        ? 0\n        : isActive.value\n        ? withSpring(tY, SPRING_CONFIGURATION)\n        : withTiming(-0.1, { duration: HOLD_ITEM_TRANSFORM_DURATION });\n\n    return {\n      zIndex: 10,\n      position: 'absolute',\n      top: itemRectY.value,\n      left: itemRectX.value,\n      width: itemRectWidth.value,\n      height: itemRectHeight.value,\n      opacity: isActive.value ? 1 : animateOpacity(),\n      transform: [\n        {\n          translateY: transformAnimation(),\n        },\n        {\n          scale: isActive.value\n            ? withTiming(1, { duration: HOLD_ITEM_TRANSFORM_DURATION })\n            : itemScale.value,\n        },\n      ],\n    };\n  });\n  const portalContainerStyle = useMemo(\n    () => [styles.holdItem, animatedPortalStyle],\n    [animatedPortalStyle]\n  );\n\n  const animatedPortalProps = useAnimatedProps<ViewProps>(() => ({\n    pointerEvents: isActive.value ? 'auto' : 'none',\n  }));\n  //#endregion\n\n  //#region animated effects\n  useAnimatedReaction(\n    () => state.value,\n    _state => {\n      if (_state === CONTEXT_MENU_STATE.END) {\n        isActive.value = false;\n      }\n    }\n  );\n  //#endregion\n\n  //#region components\n  const GestureHandler = useMemo(() => {\n    switch (activateOn) {\n      case `double-tap`:\n        return ({ children: handlerChildren }: GestureHandlerProps) => (\n          <TapGestureHandler\n            numberOfTaps={2}\n            onHandlerStateChange={gestureEvent}\n          >\n            {handlerChildren}\n          </TapGestureHandler>\n        );\n      case `tap`:\n        return ({ children: handlerChildren }: GestureHandlerProps) => (\n          <TapGestureHandler\n            numberOfTaps={1}\n            onHandlerStateChange={gestureEvent}\n          >\n            {handlerChildren}\n          </TapGestureHandler>\n        );\n      // default is hold\n      default:\n        return ({ children: handlerChildren }: GestureHandlerProps) => (\n          <LongPressGestureHandler\n            minDurationMs={longPressMinDurationMs}\n            onHandlerStateChange={gestureEvent}\n          >\n            {handlerChildren}\n          </LongPressGestureHandler>\n        );\n    }\n  }, [activateOn, gestureEvent]);\n\n  const PortalOverlay = useMemo(() => {\n    return () => (\n      <TapGestureHandler\n        numberOfTaps={1}\n        onHandlerStateChange={overlayGestureEvent}\n      >\n        <Animated.View style={styles.portalOverlay} />\n      </TapGestureHandler>\n    );\n  }, [overlayGestureEvent]);\n  //#endregion\n\n  //#region render\n  return (\n    <>\n      <GestureHandler>\n        <Animated.View ref={containerRef} style={containerStyle}>\n          {children}\n        </Animated.View>\n      </GestureHandler>\n\n      <Portal key={key} name={key}>\n        <Animated.View\n          key={key}\n          style={portalContainerStyle}\n          animatedProps={animatedPortalProps}\n        >\n          <PortalOverlay />\n          {children}\n        </Animated.View>\n      </Portal>\n    </>\n  );\n  //#endregion\n};\n\nconst HoldItem = memo(HoldItemComponent);\n\nexport default HoldItem;\n"]}
+{"version":3,"sources":["HoldItem.tsx"],"names":["HoldItemComponent","items","renderCustomView","bottom","containerStyles","disableMove","menuAnchorPosition","activateOn","hapticFeedback","actionParams","closeOnTap","longPressMinDurationMs","children","state","menuProps","customViewRef","safeAreaInsets","deviceOrientation","isActive","isAnimationStarted","itemRectY","itemRectX","itemRectWidth","itemRectHeight","itemScale","transformValue","transformOrigin","key","menuHeight","length","itemsWithSeparator","filter","item","withSeparator","isHold","containerRef","hapticResponse","style","Haptics","selectionAsync","impactAsync","ImpactFeedbackStyle","notificationAsync","NotificationFeedbackType","activateAnimation","ctx","didMeasureLayout","measured","value","pageY","pageX","height","width","position","WINDOW_WIDTH","WINDOW_HEIGHT","calculateTransformValue","screenH","hasCustomView","itemCenterY","screenCenterY","isAnchorPointTop","includes","tY","topTransform","styleGuide","spacing","bottomTransform","top","updateCustomViewRef","current","setMenuProps","itemHeight","itemWidth","itemY","itemX","anchorPosition","scaleBack","duration","HOLD_ITEM_TRANSFORM_DURATION","onCompletion","isFinised","hasItems","CONTEXT_MENU_STATE","ACTIVE","scaleHold","HOLD_ITEM_SCALE_DOWN_VALUE","HOLD_ITEM_SCALE_DOWN_DURATION","scaleTap","canCallActivateFunctions","willActivateWithTap","gestureEvent","onActive","_","context","onFinish","overlayGestureEvent","END","animatedContainerStyle","animateOpacity","opacity","transform","scale","containerStyle","React","useMemo","animatedPortalStyle","transformAnimation","SPRING_CONFIGURATION","zIndex","left","translateY","portalContainerStyle","styles","holdItem","animatedPortalProps","pointerEvents","_state","GestureHandler","handlerChildren","PortalOverlay","portalOverlay","HoldItem"],"mappings":";;;;;;;AAAA;;AAIA;;AAMA;;AAiBA;;AACA;;AACA;;AAIA;;AAKA;;AASA;;AACA;;AAGA;;;;;;;;AAhDA;AAqBA;AAEA;AAIA;AAEA;AAyBA,MAAMA,iBAAiB,GAAG,CAAC;AACzBC,EAAAA,KADyB;AAEzBC,EAAAA,gBAFyB;AAGzBC,EAAAA,MAHyB;AAIzBC,EAAAA,eAJyB;AAKzBC,EAAAA,WALyB;AAMzBC,EAAAA,kBANyB;AAOzBC,EAAAA,UAPyB;AAQzBC,EAAAA,cARyB;AASzBC,EAAAA,YATyB;AAUzBC,EAAAA,UAVyB;AAWzBC,EAAAA,sBAAsB,GAAG,GAXA;AAYzBC,EAAAA;AAZyB,CAAD,KAaL;AACnB;AACA,QAAM;AAAEC,IAAAA,KAAF;AAASC,IAAAA,SAAT;AAAoBC,IAAAA,aAApB;AAAmCC,IAAAA;AAAnC,MAAsD,yBAA5D;AACA,QAAMC,iBAAiB,GAAG,kCAA1B,CAHmB,CAInB;AAEA;;AACA,QAAMC,QAAQ,GAAG,2CAAe,KAAf,CAAjB;AACA,QAAMC,kBAAkB,GAAG,2CAAe,KAAf,CAA3B;AAEA,QAAMC,SAAS,GAAG,2CAAuB,CAAvB,CAAlB;AACA,QAAMC,SAAS,GAAG,2CAAuB,CAAvB,CAAlB;AACA,QAAMC,aAAa,GAAG,2CAAuB,CAAvB,CAAtB;AACA,QAAMC,cAAc,GAAG,2CAAuB,CAAvB,CAAvB;AACA,QAAMC,SAAS,GAAG,2CAAuB,CAAvB,CAAlB;AACA,QAAMC,cAAc,GAAG,2CAAuB,CAAvB,CAAvB;AAEA,QAAMC,eAAe,GAAG,2CACtBpB,kBAAkB,IAAI,WADA,CAAxB;AAIA,QAAMqB,GAAG,GAAG,oBAAQ,MAAO,aAAY,wBAAS,EAApC,EAAuC,EAAvC,CAAZ;AACA,QAAMC,UAAU,GAAG,oBAAQ,MAAM;AAC/B,QAAI,CAAC3B,KAAD,IAAUA,KAAK,CAAC4B,MAAN,KAAiB,CAA/B,EAAkC,OAAO,CAAP;AAClC,UAAMC,kBAAkB,GAAG7B,KAAK,CAAC8B,MAAN,CAAaC,IAAI,IAAIA,IAAI,CAACC,aAA1B,CAA3B;AACA,WAAO,uCAAoBhC,KAAK,CAAC4B,MAA1B,EAAkCC,kBAAkB,CAACD,MAArD,CAAP;AACD,GAJkB,EAIhB,CAAC5B,KAAD,CAJgB,CAAnB;AAMA,QAAMiC,MAAM,GAAG,CAAC3B,UAAD,IAAeA,UAAU,KAAK,MAA7C,CA5BmB,CA6BnB;AAEA;;AACA,QAAM4B,YAAY,GAAG,4CAArB,CAhCmB,CAiCnB;AAEA;;AACA,QAAMC,cAAc,GAAG,MAAM;AAC3B,UAAMC,KAAK,GAAG,CAAC7B,cAAD,GAAkB,QAAlB,GAA6BA,cAA3C;;AACA,YAAQ6B,KAAR;AACE,WAAM,WAAN;AACEC,QAAAA,OAAO,CAACC,cAAR;AACA;;AACF,WAAM,OAAN;AACA,WAAM,QAAN;AACA,WAAM,OAAN;AACED,QAAAA,OAAO,CAACE,WAAR,CAAoBF,OAAO,CAACG,mBAAR,CAA4BJ,KAA5B,CAApB;AACA;;AACF,WAAM,SAAN;AACA,WAAM,SAAN;AACA,WAAM,OAAN;AACEC,QAAAA,OAAO,CAACI,iBAAR,CAA0BJ,OAAO,CAACK,wBAAR,CAAiCN,KAAjC,CAA1B;AACA;;AACF;AAdF;AAgBD,GAlBD,CApCmB,CAuDnB;AAEA;;;AACA,QAAMO,iBAAiB,GAAIC,GAAD,IAAc;AACtC;;AACA,QAAI,CAACA,GAAG,CAACC,gBAAT,EAA2B;AACzB,YAAMC,QAAQ,GAAG,oCAAQZ,YAAR,CAAjB;AAEAf,MAAAA,SAAS,CAAC4B,KAAV,GAAkBD,QAAQ,CAACE,KAA3B;AACA5B,MAAAA,SAAS,CAAC2B,KAAV,GAAkBD,QAAQ,CAACG,KAA3B;AACA3B,MAAAA,cAAc,CAACyB,KAAf,GAAuBD,QAAQ,CAACI,MAAhC;AACA7B,MAAAA,aAAa,CAAC0B,KAAd,GAAsBD,QAAQ,CAACK,KAA/B;;AAEA,UAAI,CAAC9C,kBAAL,EAAyB;AACvB,cAAM+C,QAAQ,GAAG,sCACfN,QAAQ,CAACG,KADM,EAEf5B,aAAa,CAAC0B,KAFC,EAGf/B,iBAAiB,KAAK,UAAtB,GAAmCqC,uBAAnC,GAAkDC,wBAHnC,EAIfpD,MAJe,CAAjB;AAMAuB,QAAAA,eAAe,CAACsB,KAAhB,GAAwBK,QAAxB;AACD;AACF;AACF,GApBD;;AAsBA,QAAMG,uBAAuB,GAAG,MAAM;AACpC;;AAEA,UAAMC,OAAO,GACXxC,iBAAiB,KAAK,UAAtB,GAAmCsC,wBAAnC,GAAmDD,uBADrD;AAGA,UAAMI,aAAa,GAAG,CAAC,CAACxD,gBAAxB,CANoC,CAQpC;;AACA,QAAIwD,aAAa,IAAI,CAACrD,WAAtB,EAAmC;AACjC,YAAMsD,WAAW,GAAGvC,SAAS,CAAC4B,KAAV,GAAkBzB,cAAc,CAACyB,KAAf,GAAuB,CAA7D;AACA,YAAMY,aAAa,GAAGH,OAAO,GAAG,CAAhC;AACA,aAAOG,aAAa,GAAGD,WAAvB;AACD;;AAED,UAAME,gBAAgB,GAAGnC,eAAe,CAACsB,KAAhB,CAAsBc,QAAtB,CAA+B,KAA/B,CAAzB;AAEA,QAAIC,EAAE,GAAG,CAAT;;AACA,QAAI,CAAC1D,WAAL,EAAkB;AAChB,UAAIwD,gBAAJ,EAAsB;AACpB,cAAMG,YAAY,GAChB5C,SAAS,CAAC4B,KAAV,GACAzB,cAAc,CAACyB,KADf,GAEApB,UAFA,GAGAqC,oBAAWC,OAHX,IAIC,CAAAlD,cAAc,SAAd,IAAAA,cAAc,WAAd,YAAAA,cAAc,CAAEb,MAAhB,KAA0B,CAJ3B,CADF;AAOA4D,QAAAA,EAAE,GAAGC,YAAY,GAAGP,OAAf,GAAyBA,OAAO,GAAGO,YAAnC,GAAkD,CAAvD;AACD,OATD,MASO;AACL,cAAMG,eAAe,GACnB/C,SAAS,CAAC4B,KAAV,GAAkBpB,UAAlB,IAAgC,CAAAZ,cAAc,SAAd,IAAAA,cAAc,WAAd,YAAAA,cAAc,CAAEoD,GAAhB,KAAuB,CAAvD,CADF;AAEAL,QAAAA,EAAE,GACAI,eAAe,GAAG,CAAlB,GAAsB,CAACA,eAAD,GAAmBF,oBAAWC,OAAX,GAAqB,CAA9D,GAAkE,CADpE;AAED;AACF;;AACD,WAAOH,EAAP;AACD,GApCD;;AAsCA,QAAMM,mBAAmB,GAAG,MAAM;AAChCtD,IAAAA,aAAa,CAACuD,OAAd,GAAwBpE,gBAAgB,IAAI,IAA5C;AACD,GAFD;;AAIA,QAAMqE,YAAY,GAAG,MAAM;AACzB;;AAEA,wCAAQF,mBAAR;AAEAvD,IAAAA,SAAS,CAACkC,KAAV,GAAkB;AAChBwB,MAAAA,UAAU,EAAEjD,cAAc,CAACyB,KADX;AAEhByB,MAAAA,SAAS,EAAEnD,aAAa,CAAC0B,KAFT;AAGhB0B,MAAAA,KAAK,EAAEtD,SAAS,CAAC4B,KAHD;AAIhB2B,MAAAA,KAAK,EAAEtD,SAAS,CAAC2B,KAJD;AAKhB4B,MAAAA,cAAc,EAAElD,eAAe,CAACsB,KALhB;AAMhBpB,MAAAA,UAAU,EAAEA,UANI;AAOhB3B,MAAAA,KAAK,EAAEA,KAAK,IAAI,EAPA;AAQhBwB,MAAAA,cAAc,EAAEA,cAAc,CAACuB,KARf;AAShBvC,MAAAA,YAAY,EAAEA,YAAY,IAAI,EATd;AAUhBiD,MAAAA,aAAa,EAAE,CAAC,CAACxD;AAVD,KAAlB;AAYD,GAjBD;;AAmBA,QAAM2E,SAAS,GAAG,MAAM;AACtB;;AACArD,IAAAA,SAAS,CAACwB,KAAV,GAAkB,uCAAW,CAAX,EAAc;AAC9B8B,MAAAA,QAAQ,EAAEC,0CAA+B;AADX,KAAd,CAAlB;AAGD,GALD;;AAOA,QAAMC,YAAY,GAAIC,SAAD,IAAyB;AAC5C;;AACA,UAAMC,QAAQ,GAAGjF,KAAK,IAAIA,KAAK,CAAC4B,MAAN,GAAe,CAAzC;AACA,UAAM6B,aAAa,GAAG,CAAC,CAACxD,gBAAxB;;AACA,QAAI+E,SAAS,KAAKC,QAAQ,IAAIxB,aAAjB,CAAb,EAA8C;AAC5C7C,MAAAA,KAAK,CAACmC,KAAN,GAAcmC,8BAAmBC,MAAjC;AACAlE,MAAAA,QAAQ,CAAC8B,KAAT,GAAiB,IAAjB;AACA6B,MAAAA,SAAS;;AACT,UAAIrE,cAAc,KAAK,MAAvB,EAA+B;AAC7B,4CAAQ4B,cAAR;AACD;AACF;;AAEDjB,IAAAA,kBAAkB,CAAC6B,KAAnB,GAA2B,KAA3B;AACD,GAdD;;AAgBA,QAAMqC,SAAS,GAAG,MAAM;AACtB;;AACA7D,IAAAA,SAAS,CAACwB,KAAV,GAAkB,uCAChBsC,qCADgB,EAEhB;AAAER,MAAAA,QAAQ,EAAES;AAAZ,KAFgB,EAGhBP,YAHgB,CAAlB;AAKD,GAPD;;AASA,QAAMQ,QAAQ,GAAG,MAAM;AACrB;;AACArE,IAAAA,kBAAkB,CAAC6B,KAAnB,GAA2B,IAA3B;AAEAxB,IAAAA,SAAS,CAACwB,KAAV,GAAkB,yCAChB,uCAAWsC,qCAAX,EAAuC;AACrCR,MAAAA,QAAQ,EAAES;AAD2B,KAAvC,CADgB,EAIhB,uCACE,CADF,EAEE;AACET,MAAAA,QAAQ,EAAEC,0CAA+B;AAD3C,KAFF,EAKEC,YALF,CAJgB,CAAlB;AAYD,GAhBD;AAkBA;AACF;AACA;AACA;AACA;;;AACE,QAAMS,wBAAwB,GAAG,MAAM;AACrC;;AACA,UAAMC,mBAAmB,GACvBnF,UAAU,KAAK,YAAf,IAA+BA,UAAU,KAAK,KADhD;AAGA,WACGmF,mBAAmB,IAAI,CAACvE,kBAAkB,CAAC6B,KAA5C,IAAsD,CAAC0C,mBADzD;AAGD,GARD,CApMmB,CA6MnB;AAEA;;;AACA,QAAMC,YAAY,GAAG,sDAGnB;AACAC,IAAAA,QAAQ,EAAE,CAACC,CAAD,EAAIC,OAAJ,KAAgB;AACxB,UAAIL,wBAAwB,EAA5B,EAAgC;AAC9B,YAAI,CAACK,OAAO,CAAChD,gBAAb,EAA+B;AAC7BF,UAAAA,iBAAiB,CAACkD,OAAD,CAAjB;AACArE,UAAAA,cAAc,CAACuB,KAAf,GAAuBQ,uBAAuB,EAA9C;AACAe,UAAAA,YAAY;AACZuB,UAAAA,OAAO,CAAChD,gBAAR,GAA2B,IAA3B;AACD;;AAED,YAAI,CAAC5B,QAAQ,CAAC8B,KAAd,EAAqB;AACnB,cAAId,MAAJ,EAAY;AACVmD,YAAAA,SAAS;AACV,WAFD,MAEO;AACLG,YAAAA,QAAQ;AACT;AACF;AACF;AACF,KAlBD;AAmBAO,IAAAA,QAAQ,EAAE,CAACF,CAAD,EAAIC,OAAJ,KAAgB;AACxBA,MAAAA,OAAO,CAAChD,gBAAR,GAA2B,KAA3B;;AACA,UAAIZ,MAAJ,EAAY;AACV2C,QAAAA,SAAS;AACV;AACF;AAxBD,GAHmB,CAArB;AA8BA,QAAMmB,mBAAmB,GAAG,sDAG1B;AACAJ,IAAAA,QAAQ,EAAEC,CAAC,IAAI;AACb,UAAInF,UAAJ,EAAgBG,KAAK,CAACmC,KAAN,GAAcmC,8BAAmBc,GAAjC;AACjB;AAHD,GAH0B,CAA5B,CA9OmB,CAsPnB;AAEA;;AACA,QAAMC,sBAAsB,GAAG,6CAAiB,MAAM;AACpD,UAAMC,cAAc,GAAG,MACrB,sCAAUpB,uCAAV,EAAwC,uCAAW,CAAX,EAAc;AAAED,MAAAA,QAAQ,EAAE;AAAZ,KAAd,CAAxC,CADF;;AAGA,WAAO;AACLsB,MAAAA,OAAO,EAAElF,QAAQ,CAAC8B,KAAT,GAAiB,CAAjB,GAAqBmD,cAAc,EADvC;AAELE,MAAAA,SAAS,EAAE,CACT;AACEC,QAAAA,KAAK,EAAEpF,QAAQ,CAAC8B,KAAT,GACH,uCAAW,CAAX,EAAc;AAAE8B,UAAAA,QAAQ,EAAEC;AAAZ,SAAd,CADG,GAEHvD,SAAS,CAACwB;AAHhB,OADS;AAFN,KAAP;AAUD,GAd8B,CAA/B;;AAeA,QAAMuD,cAAc,GAAGC,eAAMC,OAAN,CACrB,MAAM,CAACrG,eAAD,EAAkB8F,sBAAlB,CADe,EAErB,CAAC9F,eAAD,EAAkB8F,sBAAlB,CAFqB,CAAvB;;AAKA,QAAMQ,mBAAmB,GAAG,6CAAiB,MAAM;AACjD,UAAMP,cAAc,GAAG,MACrB,sCAAUpB,uCAAV,EAAwC,uCAAW,CAAX,EAAc;AAAED,MAAAA,QAAQ,EAAE;AAAZ,KAAd,CAAxC,CADF;;AAGA,QAAIf,EAAE,GAAGP,uBAAuB,EAAhC;;AACA,UAAMmD,kBAAkB,GAAG,MACzBtG,WAAW,GACP,CADO,GAEPa,QAAQ,CAAC8B,KAAT,GACA,uCAAWe,EAAX,EAAe6C,+BAAf,CADA,GAEA,uCAAW,CAAC,GAAZ,EAAiB;AAAE9B,MAAAA,QAAQ,EAAEC;AAAZ,KAAjB,CALN;;AAOA,WAAO;AACL8B,MAAAA,MAAM,EAAE,EADH;AAELxD,MAAAA,QAAQ,EAAE,UAFL;AAGLe,MAAAA,GAAG,EAAEhD,SAAS,CAAC4B,KAHV;AAIL8D,MAAAA,IAAI,EAAEzF,SAAS,CAAC2B,KAJX;AAKLI,MAAAA,KAAK,EAAE9B,aAAa,CAAC0B,KALhB;AAMLG,MAAAA,MAAM,EAAE5B,cAAc,CAACyB,KANlB;AAOLoD,MAAAA,OAAO,EAAElF,QAAQ,CAAC8B,KAAT,GAAiB,CAAjB,GAAqBmD,cAAc,EAPvC;AAQLE,MAAAA,SAAS,EAAE,CACT;AACEU,QAAAA,UAAU,EAAEJ,kBAAkB;AADhC,OADS,EAIT;AACEL,QAAAA,KAAK,EAAEpF,QAAQ,CAAC8B,KAAT,GACH,uCAAW,CAAX,EAAc;AAAE8B,UAAAA,QAAQ,EAAEC;AAAZ,SAAd,CADG,GAEHvD,SAAS,CAACwB;AAHhB,OAJS;AARN,KAAP;AAmBD,GA/B2B,CAA5B;AAgCA,QAAMgE,oBAAoB,GAAG,oBAC3B,MAAM,CAACC,gBAAOC,QAAR,EAAkBR,mBAAlB,CADqB,EAE3B,CAACA,mBAAD,CAF2B,CAA7B;AAKA,QAAMS,mBAAmB,GAAG,6CAA4B,OAAO;AAC7DC,IAAAA,aAAa,EAAElG,QAAQ,CAAC8B,KAAT,GAAiB,MAAjB,GAA0B;AADoB,GAAP,CAA5B,CAA5B,CAlTmB,CAqTnB;AAEA;;AACA,kDACE,MAAMnC,KAAK,CAACmC,KADd,EAEEqE,MAAM,IAAI;AACR,QAAIA,MAAM,KAAKlC,8BAAmBc,GAAlC,EAAuC;AACrC/E,MAAAA,QAAQ,CAAC8B,KAAT,GAAiB,KAAjB;AACD;AACF,GANH,EAxTmB,CAgUnB;AAEA;;AACA,QAAMsE,cAAc,GAAG,oBAAQ,MAAM;AACnC,YAAQ/G,UAAR;AACE,WAAM,YAAN;AACE,eAAO,CAAC;AAAEK,UAAAA,QAAQ,EAAE2G;AAAZ,SAAD,kBACL,6BAAC,4CAAD;AACE,UAAA,YAAY,EAAE,CADhB;AAEE,UAAA,oBAAoB,EAAE5B;AAFxB,WAIG4B,eAJH,CADF;;AAQF,WAAM,KAAN;AACE,eAAO,CAAC;AAAE3G,UAAAA,QAAQ,EAAE2G;AAAZ,SAAD,kBACL,6BAAC,4CAAD;AACE,UAAA,YAAY,EAAE,CADhB;AAEE,UAAA,oBAAoB,EAAE5B;AAFxB,WAIG4B,eAJH,CADF;AAQF;;AACA;AACE,eAAO,CAAC;AAAE3G,UAAAA,QAAQ,EAAE2G;AAAZ,SAAD,kBACL,6BAAC,kDAAD;AACE,UAAA,aAAa,EAAE5G,sBADjB;AAEE,UAAA,oBAAoB,EAAEgF;AAFxB,WAIG4B,eAJH,CADF;AArBJ;AA8BD,GA/BsB,EA+BpB,CAAChH,UAAD,EAAaoF,YAAb,CA/BoB,CAAvB;AAiCA,QAAM6B,aAAa,GAAG,oBAAQ,MAAM;AAClC,WAAO,mBACL,6BAAC,4CAAD;AACE,MAAA,YAAY,EAAE,CADhB;AAEE,MAAA,oBAAoB,EAAExB;AAFxB,oBAIE,6BAAC,8BAAD,CAAU,IAAV;AAAe,MAAA,KAAK,EAAEiB,gBAAOQ;AAA7B,MAJF,CADF;AAQD,GATqB,EASnB,CAACzB,mBAAD,CATmB,CAAtB,CApWmB,CA8WnB;AAEA;;AACA,sBACE,yEACE,6BAAC,cAAD,qBACE,6BAAC,8BAAD,CAAU,IAAV;AAAe,IAAA,GAAG,EAAE7D,YAApB;AAAkC,IAAA,KAAK,EAAEoE;AAAzC,KACG3F,QADH,CADF,CADF,eAOE,6BAAC,cAAD;AAAQ,IAAA,GAAG,EAAEe,GAAb;AAAkB,IAAA,IAAI,EAAEA;AAAxB,kBACE,6BAAC,8BAAD,CAAU,IAAV;AACE,IAAA,GAAG,EAAEA,GADP;AAEE,IAAA,KAAK,EAAEqF,oBAFT;AAGE,IAAA,aAAa,EAAEG;AAHjB,kBAKE,6BAAC,aAAD,OALF,EAMGvG,QANH,CADF,CAPF,CADF,CAjXmB,CAqYnB;AACD,CAnZD;;AAqZA,MAAM8G,QAAQ,gBAAG,iBAAK1H,iBAAL,CAAjB;eAEe0H,Q","sourcesContent":["import React, { memo, useMemo } from 'react';\nimport { ViewProps } from 'react-native';\n\n//#region reanimated & gesture handler\nimport {\n  TapGestureHandler,\n  LongPressGestureHandler,\n  TapGestureHandlerGestureEvent,\n  LongPressGestureHandlerGestureEvent,\n} from 'react-native-gesture-handler';\nimport Animated, {\n  measure,\n  runOnJS,\n  useAnimatedGestureHandler,\n  useAnimatedProps,\n  useAnimatedRef,\n  useAnimatedStyle,\n  useSharedValue,\n  withDelay,\n  withTiming,\n  withSequence,\n  withSpring,\n  useAnimatedReaction,\n} from 'react-native-reanimated';\n//#endregion\n\n//#region dependencies\nimport { Portal } from '@gorhom/portal';\nimport { nanoid } from 'nanoid/non-secure';\nimport * as Haptics from 'expo-haptics';\n//#endregion\n\n//#region utils & types\nimport {\n  TransformOriginAnchorPosition,\n  getTransformOrigin,\n  calculateMenuHeight,\n} from '../../utils/calculations';\nimport {\n  HOLD_ITEM_TRANSFORM_DURATION,\n  HOLD_ITEM_SCALE_DOWN_DURATION,\n  HOLD_ITEM_SCALE_DOWN_VALUE,\n  SPRING_CONFIGURATION,\n  WINDOW_HEIGHT,\n  WINDOW_WIDTH,\n  CONTEXT_MENU_STATE,\n} from '../../constants';\nimport { useDeviceOrientation } from '../../hooks';\nimport styles from './styles';\n\nimport type { HoldItemProps, GestureHandlerProps } from './types';\nimport styleGuide from '../../styleGuide';\nimport { useInternal } from '../../hooks';\n//#endregion\n\ntype Context = { didMeasureLayout: boolean };\n\nconst HoldItemComponent = ({\n  items,\n  renderCustomView,\n  bottom,\n  containerStyles,\n  disableMove,\n  menuAnchorPosition,\n  activateOn,\n  hapticFeedback,\n  actionParams,\n  closeOnTap,\n  longPressMinDurationMs = 150,\n  children,\n}: HoldItemProps) => {\n  //#region hooks\n  const { state, menuProps, customViewRef, safeAreaInsets } = useInternal();\n  const deviceOrientation = useDeviceOrientation();\n  //#endregion\n\n  //#region variables\n  const isActive = useSharedValue(false);\n  const isAnimationStarted = useSharedValue(false);\n\n  const itemRectY = useSharedValue<number>(0);\n  const itemRectX = useSharedValue<number>(0);\n  const itemRectWidth = useSharedValue<number>(0);\n  const itemRectHeight = useSharedValue<number>(0);\n  const itemScale = useSharedValue<number>(1);\n  const transformValue = useSharedValue<number>(0);\n\n  const transformOrigin = useSharedValue<TransformOriginAnchorPosition>(\n    menuAnchorPosition || 'top-right'\n  );\n\n  const key = useMemo(() => `hold-item-${nanoid()}`, []);\n  const menuHeight = useMemo(() => {\n    if (!items || items.length === 0) return 0;\n    const itemsWithSeparator = items.filter(item => item.withSeparator);\n    return calculateMenuHeight(items.length, itemsWithSeparator.length);\n  }, [items]);\n\n  const isHold = !activateOn || activateOn === 'hold';\n  //#endregion\n\n  //#region refs\n  const containerRef = useAnimatedRef<Animated.View>();\n  //#endregion\n\n  //#region functions\n  const hapticResponse = () => {\n    const style = !hapticFeedback ? 'Medium' : hapticFeedback;\n    switch (style) {\n      case `Selection`:\n        Haptics.selectionAsync();\n        break;\n      case `Light`:\n      case `Medium`:\n      case `Heavy`:\n        Haptics.impactAsync(Haptics.ImpactFeedbackStyle[style]);\n        break;\n      case `Success`:\n      case `Warning`:\n      case `Error`:\n        Haptics.notificationAsync(Haptics.NotificationFeedbackType[style]);\n        break;\n      default:\n    }\n  };\n  //#endregion\n\n  //#region worklet functions\n  const activateAnimation = (ctx: any) => {\n    'worklet';\n    if (!ctx.didMeasureLayout) {\n      const measured = measure(containerRef);\n\n      itemRectY.value = measured.pageY;\n      itemRectX.value = measured.pageX;\n      itemRectHeight.value = measured.height;\n      itemRectWidth.value = measured.width;\n\n      if (!menuAnchorPosition) {\n        const position = getTransformOrigin(\n          measured.pageX,\n          itemRectWidth.value,\n          deviceOrientation === 'portrait' ? WINDOW_WIDTH : WINDOW_HEIGHT,\n          bottom\n        );\n        transformOrigin.value = position;\n      }\n    }\n  };\n\n  const calculateTransformValue = () => {\n    'worklet';\n\n    const screenH =\n      deviceOrientation === 'portrait' ? WINDOW_HEIGHT : WINDOW_WIDTH;\n\n    const hasCustomView = !!renderCustomView;\n\n    // If custom view exists, center item on screen\n    if (hasCustomView && !disableMove) {\n      const itemCenterY = itemRectY.value + itemRectHeight.value / 2;\n      const screenCenterY = screenH / 2;\n      return screenCenterY - itemCenterY;\n    }\n\n    const isAnchorPointTop = transformOrigin.value.includes('top');\n\n    let tY = 0;\n    if (!disableMove) {\n      if (isAnchorPointTop) {\n        const topTransform =\n          itemRectY.value +\n          itemRectHeight.value +\n          menuHeight +\n          styleGuide.spacing +\n          (safeAreaInsets?.bottom || 0);\n\n        tY = topTransform > screenH ? screenH - topTransform : 0;\n      } else {\n        const bottomTransform =\n          itemRectY.value - menuHeight - (safeAreaInsets?.top || 0);\n        tY =\n          bottomTransform < 0 ? -bottomTransform + styleGuide.spacing * 2 : 0;\n      }\n    }\n    return tY;\n  };\n\n  const updateCustomViewRef = () => {\n    customViewRef.current = renderCustomView || null;\n  };\n\n  const setMenuProps = () => {\n    'worklet';\n\n    runOnJS(updateCustomViewRef)();\n\n    menuProps.value = {\n      itemHeight: itemRectHeight.value,\n      itemWidth: itemRectWidth.value,\n      itemY: itemRectY.value,\n      itemX: itemRectX.value,\n      anchorPosition: transformOrigin.value,\n      menuHeight: menuHeight,\n      items: items || [],\n      transformValue: transformValue.value,\n      actionParams: actionParams || {},\n      hasCustomView: !!renderCustomView,\n    };\n  };\n\n  const scaleBack = () => {\n    'worklet';\n    itemScale.value = withTiming(1, {\n      duration: HOLD_ITEM_TRANSFORM_DURATION / 2,\n    });\n  };\n\n  const onCompletion = (isFinised?: boolean) => {\n    'worklet';\n    const hasItems = items && items.length > 0;\n    const hasCustomView = !!renderCustomView;\n    if (isFinised && (hasItems || hasCustomView)) {\n      state.value = CONTEXT_MENU_STATE.ACTIVE;\n      isActive.value = true;\n      scaleBack();\n      if (hapticFeedback !== 'None') {\n        runOnJS(hapticResponse)();\n      }\n    }\n\n    isAnimationStarted.value = false;\n  };\n\n  const scaleHold = () => {\n    'worklet';\n    itemScale.value = withTiming(\n      HOLD_ITEM_SCALE_DOWN_VALUE,\n      { duration: HOLD_ITEM_SCALE_DOWN_DURATION },\n      onCompletion\n    );\n  };\n\n  const scaleTap = () => {\n    'worklet';\n    isAnimationStarted.value = true;\n\n    itemScale.value = withSequence(\n      withTiming(HOLD_ITEM_SCALE_DOWN_VALUE, {\n        duration: HOLD_ITEM_SCALE_DOWN_DURATION,\n      }),\n      withTiming(\n        1,\n        {\n          duration: HOLD_ITEM_TRANSFORM_DURATION / 2,\n        },\n        onCompletion\n      )\n    );\n  };\n\n  /**\n   * When use tap activation (\"tap\") and trying to tap multiple times,\n   * scale animation is called again despite it is started. This causes a bug.\n   * To prevent this, it is better to check is animation already started.\n   */\n  const canCallActivateFunctions = () => {\n    'worklet';\n    const willActivateWithTap =\n      activateOn === 'double-tap' || activateOn === 'tap';\n\n    return (\n      (willActivateWithTap && !isAnimationStarted.value) || !willActivateWithTap\n    );\n  };\n  //#endregion\n\n  //#region gesture events\n  const gestureEvent = useAnimatedGestureHandler<\n    LongPressGestureHandlerGestureEvent | TapGestureHandlerGestureEvent,\n    Context\n  >({\n    onActive: (_, context) => {\n      if (canCallActivateFunctions()) {\n        if (!context.didMeasureLayout) {\n          activateAnimation(context);\n          transformValue.value = calculateTransformValue();\n          setMenuProps();\n          context.didMeasureLayout = true;\n        }\n\n        if (!isActive.value) {\n          if (isHold) {\n            scaleHold();\n          } else {\n            scaleTap();\n          }\n        }\n      }\n    },\n    onFinish: (_, context) => {\n      context.didMeasureLayout = false;\n      if (isHold) {\n        scaleBack();\n      }\n    },\n  });\n\n  const overlayGestureEvent = useAnimatedGestureHandler<\n    TapGestureHandlerGestureEvent,\n    Context\n  >({\n    onActive: _ => {\n      if (closeOnTap) state.value = CONTEXT_MENU_STATE.END;\n    },\n  });\n  //#endregion\n\n  //#region animated styles & props\n  const animatedContainerStyle = useAnimatedStyle(() => {\n    const animateOpacity = () =>\n      withDelay(HOLD_ITEM_TRANSFORM_DURATION, withTiming(1, { duration: 0 }));\n\n    return {\n      opacity: isActive.value ? 0 : animateOpacity(),\n      transform: [\n        {\n          scale: isActive.value\n            ? withTiming(1, { duration: HOLD_ITEM_TRANSFORM_DURATION })\n            : itemScale.value,\n        },\n      ],\n    };\n  });\n  const containerStyle = React.useMemo(\n    () => [containerStyles, animatedContainerStyle],\n    [containerStyles, animatedContainerStyle]\n  );\n\n  const animatedPortalStyle = useAnimatedStyle(() => {\n    const animateOpacity = () =>\n      withDelay(HOLD_ITEM_TRANSFORM_DURATION, withTiming(0, { duration: 0 }));\n\n    let tY = calculateTransformValue();\n    const transformAnimation = () =>\n      disableMove\n        ? 0\n        : isActive.value\n        ? withSpring(tY, SPRING_CONFIGURATION)\n        : withTiming(-0.1, { duration: HOLD_ITEM_TRANSFORM_DURATION });\n\n    return {\n      zIndex: 10,\n      position: 'absolute',\n      top: itemRectY.value,\n      left: itemRectX.value,\n      width: itemRectWidth.value,\n      height: itemRectHeight.value,\n      opacity: isActive.value ? 1 : animateOpacity(),\n      transform: [\n        {\n          translateY: transformAnimation(),\n        },\n        {\n          scale: isActive.value\n            ? withTiming(1, { duration: HOLD_ITEM_TRANSFORM_DURATION })\n            : itemScale.value,\n        },\n      ],\n    };\n  });\n  const portalContainerStyle = useMemo(\n    () => [styles.holdItem, animatedPortalStyle],\n    [animatedPortalStyle]\n  );\n\n  const animatedPortalProps = useAnimatedProps<ViewProps>(() => ({\n    pointerEvents: isActive.value ? 'auto' : 'none',\n  }));\n  //#endregion\n\n  //#region animated effects\n  useAnimatedReaction(\n    () => state.value,\n    _state => {\n      if (_state === CONTEXT_MENU_STATE.END) {\n        isActive.value = false;\n      }\n    }\n  );\n  //#endregion\n\n  //#region components\n  const GestureHandler = useMemo(() => {\n    switch (activateOn) {\n      case `double-tap`:\n        return ({ children: handlerChildren }: GestureHandlerProps) => (\n          <TapGestureHandler\n            numberOfTaps={2}\n            onHandlerStateChange={gestureEvent}\n          >\n            {handlerChildren}\n          </TapGestureHandler>\n        );\n      case `tap`:\n        return ({ children: handlerChildren }: GestureHandlerProps) => (\n          <TapGestureHandler\n            numberOfTaps={1}\n            onHandlerStateChange={gestureEvent}\n          >\n            {handlerChildren}\n          </TapGestureHandler>\n        );\n      // default is hold\n      default:\n        return ({ children: handlerChildren }: GestureHandlerProps) => (\n          <LongPressGestureHandler\n            minDurationMs={longPressMinDurationMs}\n            onHandlerStateChange={gestureEvent}\n          >\n            {handlerChildren}\n          </LongPressGestureHandler>\n        );\n    }\n  }, [activateOn, gestureEvent]);\n\n  const PortalOverlay = useMemo(() => {\n    return () => (\n      <TapGestureHandler\n        numberOfTaps={1}\n        onHandlerStateChange={overlayGestureEvent}\n      >\n        <Animated.View style={styles.portalOverlay} />\n      </TapGestureHandler>\n    );\n  }, [overlayGestureEvent]);\n  //#endregion\n\n  //#region render\n  return (\n    <>\n      <GestureHandler>\n        <Animated.View ref={containerRef} style={containerStyle}>\n          {children}\n        </Animated.View>\n      </GestureHandler>\n\n      <Portal key={key} name={key}>\n        <Animated.View\n          key={key}\n          style={portalContainerStyle}\n          animatedProps={animatedPortalProps}\n        >\n          <PortalOverlay />\n          {children}\n        </Animated.View>\n      </Portal>\n    </>\n  );\n  //#endregion\n};\n\nconst HoldItem = memo(HoldItemComponent);\n\nexport default HoldItem;\n"]}

package/lib/commonjs/components/menu/Menu.js

@@ -17,8 +17,6 @@ var _hooks = require("../../hooks");
 
 var _constants = require("../../constants");
 
-var _calculations = require("../../utils/calculations");
-
 function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
 
 function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (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; }
@@ -28,15 +26,14 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 const MenuComponent = () => {
   const {
     state,
-    menuProps,
-    safeAreaInsets
+    menuProps
   } = (0, _hooks.useInternal)();
   const wrapperStyles = (0, _reactNativeReanimated.useAnimatedStyle)(() => {
     const anchorPositionVertical = menuProps.value.anchorPosition.split('-')[0];
     const top = anchorPositionVertical === 'top' ? menuProps.value.itemHeight + menuProps.value.itemY + 8 : menuProps.value.itemY - 8;
     const left = menuProps.value.itemX;
     const width = menuProps.value.itemWidth;
-    const tY = (0, _calculations.calculateDynamicTransformValue)(menuProps.value.itemY, menuProps.value.itemHeight, menuProps.value.menuHeight, menuProps.value.customViewHeight, menuProps.value.anchorPosition, _constants.WINDOW_HEIGHT, (safeAreaInsets === null || safeAreaInsets === void 0 ? void 0 : safeAreaInsets.top) || 0, (safeAreaInsets === null || safeAreaInsets === void 0 ? void 0 : safeAreaInsets.bottom) || 0);
+    const tY = menuProps.value.transformValue;
     return {
       top,
       left,

package/lib/commonjs/components/menu/Menu.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Menu.tsx"],"names":["MenuComponent","state","menuProps","safeAreaInsets","wrapperStyles","anchorPositionVertical","value","anchorPosition","split","top","itemHeight","itemY","left","itemX","width","itemWidth","tY","menuHeight","customViewHeight","WINDOW_HEIGHT","bottom","transform","translateY","CONTEXT_MENU_STATE","ACTIVE","SPRING_CONFIGURATION","duration","HOLD_ITEM_TRANSFORM_DURATION","styles","menuWrapper","Menu","React","memo"],"mappings":";;;;;;;AAAA;;AAEA;;AAMA;;AAEA;;AACA;;AACA;;AAMA;;;;;;;;AAEA,MAAMA,aAAa,GAAG,MAAM;AAC1B,QAAM;AAAEC,IAAAA,KAAF;AAASC,IAAAA,SAAT;AAAoBC,IAAAA;AAApB,MAAuC,yBAA7C;AAEA,QAAMC,aAAa,GAAG,6CAAiB,MAAM;AAC3C,UAAMC,sBAAsB,GAAGH,SAAS,CAACI,KAAV,CAAgBC,cAAhB,CAA+BC,KAA/B,CAAqC,GAArC,EAA0C,CAA1C,CAA/B;AAEA,UAAMC,GAAG,GACPJ,sBAAsB,KAAK,KAA3B,GACIH,SAAS,CAACI,KAAV,CAAgBI,UAAhB,GAA6BR,SAAS,CAACI,KAAV,CAAgBK,KAA7C,GAAqD,CADzD,GAEIT,SAAS,CAACI,KAAV,CAAgBK,KAAhB,GAAwB,CAH9B;AAIA,UAAMC,IAAI,GAAGV,SAAS,CAACI,KAAV,CAAgBO,KAA7B;AACA,UAAMC,KAAK,GAAGZ,SAAS,CAACI,KAAV,CAAgBS,SAA9B;AACA,UAAMC,EAAE,GAAG,kDACTd,SAAS,CAACI,KAAV,CAAgBK,KADP,EAETT,SAAS,CAACI,KAAV,CAAgBI,UAFP,EAGTR,SAAS,CAACI,KAAV,CAAgBW,UAHP,EAITf,SAAS,CAACI,KAAV,CAAgBY,gBAJP,EAKThB,SAAS,CAACI,KAAV,CAAgBC,cALP,EAMTY,wBANS,EAOT,CAAAhB,cAAc,SAAd,IAAAA,cAAc,WAAd,YAAAA,cAAc,CAAEM,GAAhB,KAAuB,CAPd,EAQT,CAAAN,cAAc,SAAd,IAAAA,cAAc,WAAd,YAAAA,cAAc,CAAEiB,MAAhB,KAA0B,CARjB,CAAX;AAWA,WAAO;AACLX,MAAAA,GADK;AAELG,MAAAA,IAFK;AAGLE,MAAAA,KAHK;AAILO,MAAAA,SAAS,EAAE,CACT;AACEC,QAAAA,UAAU,EACRrB,KAAK,CAACK,KAAN,KAAgBiB,8BAAmBC,MAAnC,GACI,uCAAWR,EAAX,EAAeS,+BAAf,CADJ,GAEI,uCAAW,CAAX,EAAc;AAAEC,UAAAA,QAAQ,EAAEC;AAAZ,SAAd;AAJR,OADS;AAJN,KAAP;AAaD,GAjCqB,EAiCnB,CAACzB,SAAD,CAjCmB,CAAtB;AAmCA,sBACE,6BAAC,8BAAD,CAAU,IAAV;AAAe,IAAA,KAAK,EAAE,CAAC0B,gBAAOC,WAAR,EAAqBzB,aAArB;AAAtB,kBACE,6BAAC,iBAAD,OADF,CADF;AAKD,CA3CD;;AA6CA,MAAM0B,IAAI,gBAAGC,eAAMC,IAAN,CAAWhC,aAAX,CAAb;;eAEe8B,I","sourcesContent":["import React from 'react';\n\nimport Animated, {\n  useAnimatedStyle,\n  withSpring,\n  withTiming,\n} from 'react-native-reanimated';\n\nimport MenuList from './MenuList';\n\nimport styles from './styles';\nimport { useInternal } from '../../hooks';\nimport {\n  HOLD_ITEM_TRANSFORM_DURATION,\n  CONTEXT_MENU_STATE,\n  SPRING_CONFIGURATION,\n  WINDOW_HEIGHT,\n} from '../../constants';\nimport { calculateDynamicTransformValue } from '../../utils/calculations';\n\nconst MenuComponent = () => {\n  const { state, menuProps, safeAreaInsets } = useInternal();\n\n  const wrapperStyles = useAnimatedStyle(() => {\n    const anchorPositionVertical = menuProps.value.anchorPosition.split('-')[0];\n\n    const top =\n      anchorPositionVertical === 'top'\n        ? menuProps.value.itemHeight + menuProps.value.itemY + 8\n        : menuProps.value.itemY - 8;\n    const left = menuProps.value.itemX;\n    const width = menuProps.value.itemWidth;\n    const tY = calculateDynamicTransformValue(\n      menuProps.value.itemY,\n      menuProps.value.itemHeight,\n      menuProps.value.menuHeight,\n      menuProps.value.customViewHeight,\n      menuProps.value.anchorPosition,\n      WINDOW_HEIGHT,\n      safeAreaInsets?.top || 0,\n      safeAreaInsets?.bottom || 0\n    );\n\n    return {\n      top,\n      left,\n      width,\n      transform: [\n        {\n          translateY:\n            state.value === CONTEXT_MENU_STATE.ACTIVE\n              ? withSpring(tY, SPRING_CONFIGURATION)\n              : withTiming(0, { duration: HOLD_ITEM_TRANSFORM_DURATION }),\n        },\n      ],\n    };\n  }, [menuProps]);\n\n  return (\n    <Animated.View style={[styles.menuWrapper, wrapperStyles]}>\n      <MenuList />\n    </Animated.View>\n  );\n};\n\nconst Menu = React.memo(MenuComponent);\n\nexport default Menu;\n"]}
+{"version":3,"sources":["Menu.tsx"],"names":["MenuComponent","state","menuProps","wrapperStyles","anchorPositionVertical","value","anchorPosition","split","top","itemHeight","itemY","left","itemX","width","itemWidth","tY","transformValue","transform","translateY","CONTEXT_MENU_STATE","ACTIVE","SPRING_CONFIGURATION","duration","HOLD_ITEM_TRANSFORM_DURATION","styles","menuWrapper","Menu","React","memo"],"mappings":";;;;;;;AAAA;;AAEA;;AAMA;;AAEA;;AACA;;AACA;;;;;;;;AAMA,MAAMA,aAAa,GAAG,MAAM;AAC1B,QAAM;AAAEC,IAAAA,KAAF;AAASC,IAAAA;AAAT,MAAuB,yBAA7B;AAEA,QAAMC,aAAa,GAAG,6CAAiB,MAAM;AAC3C,UAAMC,sBAAsB,GAAGF,SAAS,CAACG,KAAV,CAAgBC,cAAhB,CAA+BC,KAA/B,CAAqC,GAArC,EAA0C,CAA1C,CAA/B;AAEA,UAAMC,GAAG,GACPJ,sBAAsB,KAAK,KAA3B,GACIF,SAAS,CAACG,KAAV,CAAgBI,UAAhB,GAA6BP,SAAS,CAACG,KAAV,CAAgBK,KAA7C,GAAqD,CADzD,GAEIR,SAAS,CAACG,KAAV,CAAgBK,KAAhB,GAAwB,CAH9B;AAIA,UAAMC,IAAI,GAAGT,SAAS,CAACG,KAAV,CAAgBO,KAA7B;AACA,UAAMC,KAAK,GAAGX,SAAS,CAACG,KAAV,CAAgBS,SAA9B;AACA,UAAMC,EAAE,GAAGb,SAAS,CAACG,KAAV,CAAgBW,cAA3B;AAEA,WAAO;AACLR,MAAAA,GADK;AAELG,MAAAA,IAFK;AAGLE,MAAAA,KAHK;AAILI,MAAAA,SAAS,EAAE,CACT;AACEC,QAAAA,UAAU,EACRjB,KAAK,CAACI,KAAN,KAAgBc,8BAAmBC,MAAnC,GACI,uCAAWL,EAAX,EAAeM,+BAAf,CADJ,GAEI,uCAAW,CAAX,EAAc;AAAEC,UAAAA,QAAQ,EAAEC;AAAZ,SAAd;AAJR,OADS;AAJN,KAAP;AAaD,GAxBqB,EAwBnB,CAACrB,SAAD,CAxBmB,CAAtB;AA0BA,sBACE,6BAAC,8BAAD,CAAU,IAAV;AAAe,IAAA,KAAK,EAAE,CAACsB,gBAAOC,WAAR,EAAqBtB,aAArB;AAAtB,kBACE,6BAAC,iBAAD,OADF,CADF;AAKD,CAlCD;;AAoCA,MAAMuB,IAAI,gBAAGC,eAAMC,IAAN,CAAW5B,aAAX,CAAb;;eAEe0B,I","sourcesContent":["import React from 'react';\n\nimport Animated, {\n  useAnimatedStyle,\n  withSpring,\n  withTiming,\n} from 'react-native-reanimated';\n\nimport MenuList from './MenuList';\n\nimport styles from './styles';\nimport { useInternal } from '../../hooks';\nimport {\n  HOLD_ITEM_TRANSFORM_DURATION,\n  CONTEXT_MENU_STATE,\n  SPRING_CONFIGURATION,\n} from '../../constants';\n\nconst MenuComponent = () => {\n  const { state, menuProps } = useInternal();\n\n  const wrapperStyles = useAnimatedStyle(() => {\n    const anchorPositionVertical = menuProps.value.anchorPosition.split('-')[0];\n\n    const top =\n      anchorPositionVertical === 'top'\n        ? menuProps.value.itemHeight + menuProps.value.itemY + 8\n        : menuProps.value.itemY - 8;\n    const left = menuProps.value.itemX;\n    const width = menuProps.value.itemWidth;\n    const tY = menuProps.value.transformValue;\n\n    return {\n      top,\n      left,\n      width,\n      transform: [\n        {\n          translateY:\n            state.value === CONTEXT_MENU_STATE.ACTIVE\n              ? withSpring(tY, SPRING_CONFIGURATION)\n              : withTiming(0, { duration: HOLD_ITEM_TRANSFORM_DURATION }),\n        },\n      ],\n    };\n  }, [menuProps]);\n\n  return (\n    <Animated.View style={[styles.menuWrapper, wrapperStyles]}>\n      <MenuList />\n    </Animated.View>\n  );\n};\n\nconst Menu = React.memo(MenuComponent);\n\nexport default Menu;\n"]}

package/lib/commonjs/components/provider/Provider.js

@@ -54,7 +54,6 @@ const ProviderComponent = ({
     anchorPosition: 'top-center',
     menuHeight: 0,
     transformValue: 0,
-    customViewHeight: 0,
     actionParams: {},
     hasCustomView: false
   });

package/lib/commonjs/components/provider/Provider.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Provider.tsx"],"names":["AnimatedIcon","ProviderComponent","children","theme","selectedTheme","iconComponent","safeAreaInsets","onOpen","onClose","Animated","createAnimatedComponent","state","CONTEXT_MENU_STATE","UNDETERMINED","menuProps","itemHeight","itemWidth","itemX","itemY","items","anchorPosition","menuHeight","transformValue","customViewHeight","actionParams","hasCustomView","customViewRef","value","ACTIVE","END","internalContextVariables","top","bottom","left","right","flex","Provider"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AAKA;;AAGA;;AAGA;;AAGA;;AAEA;;AACA;;;;;;;;AAVA;AAGA;AAeO,IAAIA,YAAJ;;;AAEP,MAAMC,iBAAiB,GAAG,CAAC;AACzBC,EAAAA,QADyB;AAEzBC,EAAAA,KAAK,EAAEC,aAFkB;AAGzBC,EAAAA,aAHyB;AAIzBC,EAAAA,cAJyB;AAKzBC,EAAAA,MALyB;AAMzBC,EAAAA;AANyB,CAAD,KAOG;AAC3B,MAAIH,aAAJ,EACE,uBAAAL,YAAY,GAAGS,+BAASC,uBAAT,CAAiCL,aAAjC,CAAf;AAEF,QAAMM,KAAK,GAAG,2CACZC,8BAAmBC,YADP,CAAd;AAGA,QAAMV,KAAK,GAAG,2CAAiCC,aAAa,IAAI,OAAlD,CAAd;AACA,QAAMU,SAAS,GAAG,2CAAkC;AAClDC,IAAAA,UAAU,EAAE,CADsC;AAElDC,IAAAA,SAAS,EAAE,CAFuC;AAGlDC,IAAAA,KAAK,EAAE,CAH2C;AAIlDC,IAAAA,KAAK,EAAE,CAJ2C;AAKlDC,IAAAA,KAAK,EAAE,EAL2C;AAMlDC,IAAAA,cAAc,EAAE,YANkC;AAOlDC,IAAAA,UAAU,EAAE,CAPsC;AAQlDC,IAAAA,cAAc,EAAE,CARkC;AASlDC,IAAAA,gBAAgB,EAAE,CATgC;AAUlDC,IAAAA,YAAY,EAAE,EAVoC;AAWlDC,IAAAA,aAAa,EAAE;AAXmC,GAAlC,CAAlB;AAaA,QAAMC,aAAa,GAAG,mBAAgC,IAAhC,CAAtB;AAEA,wBAAU,MAAM;AACdvB,IAAAA,KAAK,CAACwB,KAAN,GAAcvB,aAAa,IAAI,OAA/B,CADc,CAEd;AACD,GAHD,EAGG,CAACA,aAAD,CAHH;AAKA,kDACE,MAAMO,KAAK,CAACgB,KADd,EAEEhB,KAAK,IAAI;AACP,YAAQA,KAAR;AACE,WAAKC,8BAAmBgB,MAAxB;AAAgC;AAC9B,cAAIrB,MAAJ,EAAY,oCAAQA,MAAR;AACZ;AACD;;AACD,WAAKK,8BAAmBiB,GAAxB;AAA6B;AAC3B,cAAIrB,OAAJ,EAAa,oCAAQA,OAAR;AACb;AACD;AARH;AAUD,GAbH,EAcE,CAACG,KAAD,CAdF;AAiBA,QAAMmB,wBAAwB,GAAG,oBAC/B,OAAO;AACLnB,IAAAA,KADK;AAELR,IAAAA,KAFK;AAGLW,IAAAA,SAHK;AAILY,IAAAA,aAJK;AAKLpB,IAAAA,cAAc,EAAEA,cAAc,IAAI;AAChCyB,MAAAA,GAAG,EAAE,CAD2B;AAEhCC,MAAAA,MAAM,EAAE,CAFwB;AAGhCC,MAAAA,IAAI,EAAE,CAH0B;AAIhCC,MAAAA,KAAK,EAAE;AAJyB;AAL7B,GAAP,CAD+B,EAa/B,CAACvB,KAAD,EAAQR,KAAR,EAAeW,SAAf,EAA0BR,cAA1B,CAb+B,CAAjC;AAgBA,sBACE,6BAAC,iDAAD;AAAwB,IAAA,KAAK,EAAE;AAAE6B,MAAAA,IAAI,EAAE;AAAR;AAA/B,kBACE,6BAAC,yBAAD,CAAiB,QAAjB;AAA0B,IAAA,KAAK,EAAEL;AAAjC,kBACE,6BAAC,sBAAD,QACG5B,QADH,eAEE,6BAAC,kBAAD,OAFF,eAGE,6BAAC,aAAD,OAHF,eAIE,6BAAC,mBAAD,OAJF,CADF,CADF,CADF;AAYD,CAhFD;;AAkFA,MAAMkC,QAAQ,gBAAG,iBAAKnC,iBAAL,CAAjB;eAEemC,Q","sourcesContent":["import React, { memo, useEffect, useMemo, useRef } from 'react';\nimport { PortalProvider } from '@gorhom/portal';\nimport Animated, {\n  useSharedValue,\n  useAnimatedReaction,\n  runOnJS,\n} from 'react-native-reanimated';\nimport { GestureHandlerRootView } from 'react-native-gesture-handler';\n\n// Components\nimport { Backdrop } from '../backdrop';\n\n// Utils\nimport { InternalContext } from '../../context/internal';\nimport { HoldMenuProviderProps } from './types';\nimport { StateProps, Action } from './reducer';\nimport { CONTEXT_MENU_STATE } from '../../constants';\nimport { MenuInternalProps } from '../menu/types';\nimport Menu from '../menu';\nimport CustomView from '../customView/CustomView';\nimport { RenderCustomView } from '../menu/types';\n\nexport interface Store {\n  state: StateProps;\n  dispatch?: React.Dispatch<Action>;\n}\n\nexport let AnimatedIcon: any;\n\nconst ProviderComponent = ({\n  children,\n  theme: selectedTheme,\n  iconComponent,\n  safeAreaInsets,\n  onOpen,\n  onClose,\n}: HoldMenuProviderProps) => {\n  if (iconComponent)\n    AnimatedIcon = Animated.createAnimatedComponent(iconComponent);\n\n  const state = useSharedValue<CONTEXT_MENU_STATE>(\n    CONTEXT_MENU_STATE.UNDETERMINED\n  );\n  const theme = useSharedValue<'light' | 'dark'>(selectedTheme || 'light');\n  const menuProps = useSharedValue<MenuInternalProps>({\n    itemHeight: 0,\n    itemWidth: 0,\n    itemX: 0,\n    itemY: 0,\n    items: [],\n    anchorPosition: 'top-center',\n    menuHeight: 0,\n    transformValue: 0,\n    customViewHeight: 0,\n    actionParams: {},\n    hasCustomView: false,\n  });\n  const customViewRef = useRef<RenderCustomView | null>(null);\n\n  useEffect(() => {\n    theme.value = selectedTheme || 'light';\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [selectedTheme]);\n\n  useAnimatedReaction(\n    () => state.value,\n    state => {\n      switch (state) {\n        case CONTEXT_MENU_STATE.ACTIVE: {\n          if (onOpen) runOnJS(onOpen)();\n          break;\n        }\n        case CONTEXT_MENU_STATE.END: {\n          if (onClose) runOnJS(onClose)();\n          break;\n        }\n      }\n    },\n    [state]\n  );\n\n  const internalContextVariables = useMemo(\n    () => ({\n      state,\n      theme,\n      menuProps,\n      customViewRef,\n      safeAreaInsets: safeAreaInsets || {\n        top: 0,\n        bottom: 0,\n        left: 0,\n        right: 0,\n      },\n    }),\n    [state, theme, menuProps, safeAreaInsets]\n  );\n\n  return (\n    <GestureHandlerRootView style={{ flex: 1 }}>\n      <InternalContext.Provider value={internalContextVariables}>\n        <PortalProvider>\n          {children}\n          <Backdrop />\n          <Menu />\n          <CustomView />\n        </PortalProvider>\n      </InternalContext.Provider>\n    </GestureHandlerRootView>\n  );\n};\n\nconst Provider = memo(ProviderComponent);\n\nexport default Provider;\n"]}
+{"version":3,"sources":["Provider.tsx"],"names":["AnimatedIcon","ProviderComponent","children","theme","selectedTheme","iconComponent","safeAreaInsets","onOpen","onClose","Animated","createAnimatedComponent","state","CONTEXT_MENU_STATE","UNDETERMINED","menuProps","itemHeight","itemWidth","itemX","itemY","items","anchorPosition","menuHeight","transformValue","actionParams","hasCustomView","customViewRef","value","ACTIVE","END","internalContextVariables","top","bottom","left","right","flex","Provider"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;AAGA;;AAGA;;AAGA;;AAEA;;AACA;;;;;;;;AAVA;AAGA;AAeO,IAAIA,YAAJ;;;AAEP,MAAMC,iBAAiB,GAAG,CAAC;AACzBC,EAAAA,QADyB;AAEzBC,EAAAA,KAAK,EAAEC,aAFkB;AAGzBC,EAAAA,aAHyB;AAIzBC,EAAAA,cAJyB;AAKzBC,EAAAA,MALyB;AAMzBC,EAAAA;AANyB,CAAD,KAOG;AAC3B,MAAIH,aAAJ,EACE,uBAAAL,YAAY,GAAGS,+BAASC,uBAAT,CAAiCL,aAAjC,CAAf;AAEF,QAAMM,KAAK,GAAG,2CACZC,8BAAmBC,YADP,CAAd;AAGA,QAAMV,KAAK,GAAG,2CAAiCC,aAAa,IAAI,OAAlD,CAAd;AACA,QAAMU,SAAS,GAAG,2CAAkC;AAClDC,IAAAA,UAAU,EAAE,CADsC;AAElDC,IAAAA,SAAS,EAAE,CAFuC;AAGlDC,IAAAA,KAAK,EAAE,CAH2C;AAIlDC,IAAAA,KAAK,EAAE,CAJ2C;AAKlDC,IAAAA,KAAK,EAAE,EAL2C;AAMlDC,IAAAA,cAAc,EAAE,YANkC;AAOlDC,IAAAA,UAAU,EAAE,CAPsC;AAQlDC,IAAAA,cAAc,EAAE,CARkC;AASlDC,IAAAA,YAAY,EAAE,EAToC;AAUlDC,IAAAA,aAAa,EAAE;AAVmC,GAAlC,CAAlB;AAYA,QAAMC,aAAa,GAAG,mBAAgC,IAAhC,CAAtB;AAEA,wBAAU,MAAM;AACdtB,IAAAA,KAAK,CAACuB,KAAN,GAActB,aAAa,IAAI,OAA/B,CADc,CAEd;AACD,GAHD,EAGG,CAACA,aAAD,CAHH;AAKA,kDACE,MAAMO,KAAK,CAACe,KADd,EAEEf,KAAK,IAAI;AACP,YAAQA,KAAR;AACE,WAAKC,8BAAmBe,MAAxB;AAAgC;AAC9B,cAAIpB,MAAJ,EACE,oCAAQA,MAAR;AACF;AACD;;AACD,WAAKK,8BAAmBgB,GAAxB;AAA6B;AAC3B,cAAIpB,OAAJ,EACE,oCAAQA,OAAR;AACF;AACD;AAVH;AAYD,GAfH,EAgBE,CAACG,KAAD,CAhBF;AAmBA,QAAMkB,wBAAwB,GAAG,oBAC/B,OAAO;AACLlB,IAAAA,KADK;AAELR,IAAAA,KAFK;AAGLW,IAAAA,SAHK;AAILW,IAAAA,aAJK;AAKLnB,IAAAA,cAAc,EAAEA,cAAc,IAAI;AAChCwB,MAAAA,GAAG,EAAE,CAD2B;AAEhCC,MAAAA,MAAM,EAAE,CAFwB;AAGhCC,MAAAA,IAAI,EAAE,CAH0B;AAIhCC,MAAAA,KAAK,EAAE;AAJyB;AAL7B,GAAP,CAD+B,EAa/B,CAACtB,KAAD,EAAQR,KAAR,EAAeW,SAAf,EAA0BR,cAA1B,CAb+B,CAAjC;AAgBA,sBACE,6BAAC,iDAAD;AAAwB,IAAA,KAAK,EAAE;AAAE4B,MAAAA,IAAI,EAAE;AAAR;AAA/B,kBACE,6BAAC,yBAAD,CAAiB,QAAjB;AAA0B,IAAA,KAAK,EAAEL;AAAjC,kBACE,6BAAC,sBAAD,QACG3B,QADH,eAEE,6BAAC,kBAAD,OAFF,eAGE,6BAAC,aAAD,OAHF,eAIE,6BAAC,mBAAD,OAJF,CADF,CADF,CADF;AAYD,CAjFD;;AAmFA,MAAMiC,QAAQ,gBAAG,iBAAKlC,iBAAL,CAAjB;eAEekC,Q","sourcesContent":["import React, { memo, useEffect, useMemo, useRef } from 'react';\nimport { PortalProvider } from '@gorhom/portal';\nimport Animated, { useSharedValue, useAnimatedReaction, runOnJS } from 'react-native-reanimated';\nimport { GestureHandlerRootView } from 'react-native-gesture-handler';\n\n// Components\nimport { Backdrop } from '../backdrop';\n\n// Utils\nimport { InternalContext } from '../../context/internal';\nimport { HoldMenuProviderProps } from './types';\nimport { StateProps, Action } from './reducer';\nimport { CONTEXT_MENU_STATE } from '../../constants';\nimport { MenuInternalProps } from '../menu/types';\nimport Menu from '../menu';\nimport CustomView from '../customView/CustomView';\nimport { RenderCustomView } from '../menu/types';\n\nexport interface Store {\n  state: StateProps;\n  dispatch?: React.Dispatch<Action>;\n}\n\nexport let AnimatedIcon: any;\n\nconst ProviderComponent = ({\n  children,\n  theme: selectedTheme,\n  iconComponent,\n  safeAreaInsets,\n  onOpen,\n  onClose,\n}: HoldMenuProviderProps) => {\n  if (iconComponent)\n    AnimatedIcon = Animated.createAnimatedComponent(iconComponent);\n\n  const state = useSharedValue<CONTEXT_MENU_STATE>(\n    CONTEXT_MENU_STATE.UNDETERMINED\n  );\n  const theme = useSharedValue<'light' | 'dark'>(selectedTheme || 'light');\n  const menuProps = useSharedValue<MenuInternalProps>({\n    itemHeight: 0,\n    itemWidth: 0,\n    itemX: 0,\n    itemY: 0,\n    items: [],\n    anchorPosition: 'top-center',\n    menuHeight: 0,\n    transformValue: 0,\n    actionParams: {},\n    hasCustomView: false,\n  });\n  const customViewRef = useRef<RenderCustomView | null>(null);\n\n  useEffect(() => {\n    theme.value = selectedTheme || 'light';\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [selectedTheme]);\n\n  useAnimatedReaction(\n    () => state.value,\n    state => {\n      switch (state) {\n        case CONTEXT_MENU_STATE.ACTIVE: {\n          if (onOpen)\n            runOnJS(onOpen)();\n          break\n        }\n        case CONTEXT_MENU_STATE.END: {\n          if (onClose)\n            runOnJS(onClose)();\n          break\n        }\n      }\n    },\n    [state]\n  );\n\n  const internalContextVariables = useMemo(\n    () => ({\n      state,\n      theme,\n      menuProps,\n      customViewRef,\n      safeAreaInsets: safeAreaInsets || {\n        top: 0,\n        bottom: 0,\n        left: 0,\n        right: 0,\n      },\n    }),\n    [state, theme, menuProps, safeAreaInsets]\n  );\n\n  return (\n    <GestureHandlerRootView style={{ flex: 1 }}>\n      <InternalContext.Provider value={internalContextVariables}>\n        <PortalProvider>\n          {children}\n          <Backdrop />\n          <Menu />\n          <CustomView />\n        </PortalProvider>\n      </InternalContext.Provider>\n    </GestureHandlerRootView>\n  );\n};\n\nconst Provider = memo(ProviderComponent);\n\nexport default Provider;\n"]}

package/lib/commonjs/utils/calculations.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.getTransformOrigin = exports.calculateDynamicTransformValue = exports.menuAnimationAnchor = exports.calculateMenuHeight = exports.MenuItemHeight = void 0;
+exports.getTransformOrigin = exports.menuAnimationAnchor = exports.calculateMenuHeight = exports.MenuItemHeight = void 0;
 
 var _styleGuide = _interopRequireDefault(require("../styleGuide"));
 
@@ -52,53 +52,6 @@ const menuAnimationAnchor = (anchorPoint, itemWidth, itemLength, itemsWithSepara
 
 exports.menuAnimationAnchor = menuAnimationAnchor;
 
-const calculateDynamicTransformValue = (itemY, itemHeight, menuHeight, customViewHeight, anchorPosition, screenHeight, safeAreaTop, safeAreaBottom) => {
-  'worklet';
-
-  const GAP = _styleGuide.default.spacing;
-  const isAnchorTop = anchorPosition.includes('top');
-
-  if (isAnchorTop) {
-    // Menu below item, custom view above item
-    // Total space needed below item: itemHeight + gap + menuHeight + safeAreaBottom
-    // Total space needed above item: customViewHeight + gap + safeAreaTop
-    const bottomEdge = itemY + itemHeight + GAP + menuHeight + safeAreaBottom;
-    const topEdge = itemY - GAP - customViewHeight - safeAreaTop;
-    let tY = 0; // If bottom overflows screen
-
-    if (bottomEdge > screenHeight) {
-      tY = screenHeight - bottomEdge;
-    } // After shifting, check if custom view goes above safe area
-
-
-    if (topEdge + tY < 0) {
-      tY = -topEdge;
-    }
-
-    return tY;
-  } else {
-    // Menu above item, custom view below item
-    // Total space needed above item: menuHeight + gap + safeAreaTop
-    // Total space needed below item: itemHeight + gap + customViewHeight + safeAreaBottom
-    const topEdge = itemY - GAP - menuHeight - safeAreaTop;
-    const bottomEdge = itemY + itemHeight + GAP + customViewHeight + safeAreaBottom;
-    let tY = 0; // If top overflows screen (goes above safe area)
-
-    if (topEdge < 0) {
-      tY = -topEdge;
-    } // After shifting, check if custom view goes below screen
-
-
-    if (bottomEdge + tY > screenHeight) {
-      tY = screenHeight - bottomEdge;
-    }
-
-    return tY;
-  }
-};
-
-exports.calculateDynamicTransformValue = calculateDynamicTransformValue;
-
 const getTransformOrigin = (posX, itemWidth, windowWidth, bottom) => {
   'worklet';