react-native-hold-menu-actions 0.1.11 → 0.1.14

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","actionParams","contentRenderer","value","ACTIVE","END","internalContextVariables","top","bottom","left","right","flex","Provider"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AAKA;;AAGA;;AAGA;;AAGA;;AAEA;;AACA;;;;;;;;AAVA;AAGA;AAcO,IAAIA,YAAJ;;;AAEP,MAAMC,iBAAkD,GAAG,CAAC;AAC1DC,EAAAA,QAD0D;AAE1DC,EAAAA,KAAK,EAAEC,aAFmD;AAG1DC,EAAAA,aAH0D;AAI1DC,EAAAA,cAJ0D;AAK1DC,EAAAA,MAL0D;AAM1DC,EAAAA;AAN0D,CAAD,KAOrD;AACJ,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;AAToC,GAAlC,CAAlB;AAWA,QAAMC,eAAe,GAAG,mBACtB,IADsB,CAAxB;AAIA,wBAAU,MAAM;AACdrB,IAAAA,KAAK,CAACsB,KAAN,GAAcrB,aAAa,IAAI,OAA/B,CADc,CAEd;AACD,GAHD,EAGG,CAACA,aAAD,CAHH;AAKA,kDACE,MAAMO,KAAK,CAACc,KADd,EAEEd,KAAK,IAAI;AACP,YAAQA,KAAR;AACE,WAAKC,8BAAmBc,MAAxB;AAAgC;AAC9B,cAAInB,MAAJ,EAAY,oCAAQA,MAAR;AACZ;AACD;;AACD,WAAKK,8BAAmBe,GAAxB;AAA6B;AAC3B,cAAInB,OAAJ,EAAa,oCAAQA,OAAR;AACb;AACD;AARH;AAUD,GAbH,EAcE,CAACG,KAAD,CAdF;AAiBA,QAAMiB,wBAAwB,GAAG,oBAC/B,OAAO;AACLjB,IAAAA,KADK;AAELR,IAAAA,KAFK;AAGLW,IAAAA,SAHK;AAILU,IAAAA,eAJK;AAKLlB,IAAAA,cAAc,EAAEA,cAAc,IAAI;AAChCuB,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,CAACrB,KAAD,EAAQR,KAAR,EAAeW,SAAf,EAA0BR,cAA1B,CAb+B,CAAjC;AAgBA,sBACE,6BAAC,iDAAD;AAAwB,IAAA,KAAK,EAAE;AAAE2B,MAAAA,IAAI,EAAE;AAAR;AAA/B,kBACE,6BAAC,yBAAD,CAAiB,QAAjB;AAA0B,IAAA,KAAK,EAAEL;AAAjC,kBACE,6BAAC,sBAAD,QACG1B,QADH,eAEE,6BAAC,kBAAD,OAFF,eAGE,6BAAC,aAAD,OAHF,eAIE,6BAAC,gBAAD,OAJF,CADF,CADF,CADF;AAYD,CAhFD;;AAkFA,MAAMgC,QAAQ,gBAAG,iBAAKjC,iBAAL,CAAjB;eAEeiC,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 Content from './Content';\n\nexport interface Store {\n  state: StateProps;\n  dispatch?: React.Dispatch<Action>;\n}\n\nexport let AnimatedIcon: any;\n\nconst ProviderComponent: React.FC<HoldMenuProviderProps> = ({\n  children,\n  theme: selectedTheme,\n  iconComponent,\n  safeAreaInsets,\n  onOpen,\n  onClose,\n}) => {\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  });\n  const contentRenderer = useRef<((params: any) => React.ReactNode) | null>(\n    null\n  );\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      contentRenderer,\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          <Content />\n        </PortalProvider>\n      </InternalContext.Provider>\n    </GestureHandlerRootView>\n  );\n};\n\nconst Provider = memo(ProviderComponent) as React.FC<HoldMenuProviderProps>;\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/context/internal.js.map

@@ -1 +1 @@
-{"version":3,"sources":["internal.ts"],"names":["InternalContext"],"mappings":";;;;;;;AAAA;;AAuBA;AACO,MAAMA,eAAe,gBAAG,2BAAxB","sourcesContent":["import { createContext } from 'react';\nimport type { MutableRefObject } from 'react';\nimport type Animated from 'react-native-reanimated';\nimport type { CONTEXT_MENU_STATE } from '../constants';\nimport { MenuInternalProps } from '../components/menu/types';\n\nexport type ContentRendererRef = MutableRefObject<\n  ((params: any) => React.ReactNode) | null\n>;\n\nexport type InternalContextType = {\n  state: Animated.SharedValue<CONTEXT_MENU_STATE>;\n  theme: Animated.SharedValue<'light' | 'dark'>;\n  menuProps: Animated.SharedValue<MenuInternalProps>;\n  contentRenderer: ContentRendererRef;\n  safeAreaInsets?: {\n    top: number;\n    right: number;\n    bottom: number;\n    left: number;\n  };\n};\n\n// @ts-ignore\nexport const InternalContext = createContext<InternalContextType>();\n"]}
+{"version":3,"sources":["internal.ts"],"names":["InternalContext"],"mappings":";;;;;;;AAAA;;AAkBA;AACO,MAAMA,eAAe,gBAAG,2BAAxB","sourcesContent":["import { createContext, MutableRefObject } from 'react';\nimport type Animated from 'react-native-reanimated';\nimport type { CONTEXT_MENU_STATE } from '../constants';\nimport { MenuInternalProps, RenderCustomView } from '../components/menu/types';\n\nexport type InternalContextType = {\n  state: Animated.SharedValue<CONTEXT_MENU_STATE>;\n  theme: Animated.SharedValue<'light' | 'dark'>;\n  menuProps: Animated.SharedValue<MenuInternalProps>;\n  customViewRef: MutableRefObject<RenderCustomView | null>;\n  safeAreaInsets?: {\n    top: number;\n    right: number;\n    bottom: number;\n    left: number;\n  };\n};\n\n// @ts-ignore\nexport const InternalContext = createContext<InternalContextType>();\n"]}

package/lib/commonjs/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA","sourcesContent":["export { default as HoldItem } from './components/holdItem';\nexport { default as HoldMenuProvider } from './components/provider';\nexport { default as HoldMenuFlatList } from './components/flatList';\nexport { default as HoldMenuIcon } from './components/icon';\n\nexport type { HoldMenuProviderProps } from './components/provider';\nexport type {\n  HoldItemProps,\n  RenderContentParams,\n} from './components/holdItem/types';\n"]}
+{"version":3,"sources":["index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA","sourcesContent":["export { default as HoldItem } from './components/holdItem';\nexport { default as HoldMenuProvider } from './components/provider';\nexport { default as HoldMenuFlatList } from './components/flatList';\nexport { default as HoldMenuIcon } from './components/icon';\n\nexport type { HoldItemProps } from './components/holdItem/types';\nexport type {\n  MenuItemProps,\n  CustomViewProps,\n  RenderCustomView,\n} from './components/menu/types';\n"]}

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

@@ -37,20 +37,17 @@ const BackdropComponent = () => {
     }
   }, [state]);
   const animatedContainerStyle = useAnimatedStyle(() => {
-    const isActive = state.value === CONTEXT_MENU_STATE.ACTIVE;
-
-    const topValueAnimation = () => isActive ? 0 : withDelay(HOLD_ITEM_TRANSFORM_DURATION, withTiming(WINDOW_HEIGHT, {
+    const topValueAnimation = () => state.value === CONTEXT_MENU_STATE.ACTIVE ? 0 : withDelay(HOLD_ITEM_TRANSFORM_DURATION, withTiming(WINDOW_HEIGHT, {
       duration: 0
     }));
 
-    const opacityValueAnimation = () => withTiming(isActive ? 1 : 0, {
+    const opacityValueAnimation = () => withTiming(state.value === CONTEXT_MENU_STATE.ACTIVE ? 1 : 0, {
       duration: HOLD_ITEM_TRANSFORM_DURATION
     });
 
     return {
       top: topValueAnimation(),
-      opacity: opacityValueAnimation(),
-      pointerEvents: isActive ? 'auto' : 'none'
+      opacity: opacityValueAnimation()
     };
   });
   const animatedContainerProps = useAnimatedProps(() => {

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

@@ -1 +1 @@
-{"version":3,"sources":["Backdrop.tsx"],"names":["React","memo","StyleSheet","Animated","useAnimatedGestureHandler","useAnimatedProps","useAnimatedStyle","withDelay","withTiming","TapGestureHandler","BlurView","styles","CONTEXT_MENU_STATE","HOLD_ITEM_TRANSFORM_DURATION","IS_IOS","WINDOW_HEIGHT","BACKDROP_LIGHT_BACKGROUND_COLOR","BACKDROP_DARK_BACKGROUND_COLOR","useInternal","AnimatedBlurView","createAnimatedComponent","View","BackdropComponent","state","theme","tapGestureEvent","onStart","event","context","startPosition","x","y","onCancel","value","END","onEnd","distance","Math","hypot","shouldClose","isStateActive","ACTIVE","animatedContainerStyle","isActive","topValueAnimation","duration","opacityValueAnimation","top","opacity","pointerEvents","animatedContainerProps","blurAmount","animatedInnerContainerStyle","backgroundColor","container","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 isActive = state.value === CONTEXT_MENU_STATE.ACTIVE;\n\n    const topValueAnimation = () =>\n      isActive\n        ? 0\n        : withDelay(\n            HOLD_ITEM_TRANSFORM_DURATION,\n            withTiming(WINDOW_HEIGHT, {\n              duration: 0,\n            })\n          );\n\n    const opacityValueAnimation = () =>\n      withTiming(isActive ? 1 : 0, {\n        duration: HOLD_ITEM_TRANSFORM_DURATION,\n      });\n\n    return {\n      top: topValueAnimation(),\n      opacity: opacityValueAnimation(),\n      pointerEvents: isActive ? 'auto' : 'none',\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"]}
+{"version":3,"sources":["Backdrop.tsx"],"names":["React","memo","StyleSheet","Animated","useAnimatedGestureHandler","useAnimatedProps","useAnimatedStyle","withDelay","withTiming","TapGestureHandler","BlurView","styles","CONTEXT_MENU_STATE","HOLD_ITEM_TRANSFORM_DURATION","IS_IOS","WINDOW_HEIGHT","BACKDROP_LIGHT_BACKGROUND_COLOR","BACKDROP_DARK_BACKGROUND_COLOR","useInternal","AnimatedBlurView","createAnimatedComponent","View","BackdropComponent","state","theme","tapGestureEvent","onStart","event","context","startPosition","x","y","onCancel","value","END","onEnd","distance","Math","hypot","shouldClose","isStateActive","ACTIVE","animatedContainerStyle","topValueAnimation","duration","opacityValueAnimation","top","opacity","animatedContainerProps","blurAmount","animatedInnerContainerStyle","backgroundColor","container","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/module/components/customView/CustomView.js

@@ -0,0 +1,124 @@
+import React, { useCallback, useState } from 'react';
+import { StyleSheet } from 'react-native';
+import Animated, { runOnJS, useAnimatedReaction, useAnimatedStyle, withSpring, withTiming } from 'react-native-reanimated';
+import { useInternal } from '../../hooks';
+import { HOLD_ITEM_TRANSFORM_DURATION, CONTEXT_MENU_STATE, SPRING_CONFIGURATION, SPRING_CONFIGURATION_MENU, WINDOW_WIDTH } from '../../constants';
+
+const CustomViewComponent = () => {
+  const {
+    state,
+    menuProps,
+    customViewRef
+  } = useInternal();
+  const [renderFn, setRenderFn] = useState(null);
+  const [customViewHeight, setCustomViewHeight] = useState(0);
+  const [customViewWidth, setCustomViewWidth] = useState(0);
+  const closeMenu = useCallback(() => {
+    state.value = CONTEXT_MENU_STATE.END;
+  }, [state]);
+  const onLayout = useCallback(event => {
+    const {
+      height,
+      width
+    } = event.nativeEvent.layout;
+    setCustomViewHeight(height);
+    setCustomViewWidth(width);
+  }, []);
+  const clearRenderFn = useCallback(() => {
+    setRenderFn(null);
+    setCustomViewHeight(0);
+    setCustomViewWidth(0);
+  }, []);
+  const updateRenderFn = useCallback(hasCustomView => {
+    if (hasCustomView && customViewRef.current) {
+      setRenderFn(() => customViewRef.current);
+    } else {
+      setTimeout(clearRenderFn, HOLD_ITEM_TRANSFORM_DURATION);
+    }
+  }, [customViewRef, clearRenderFn]);
+  useAnimatedReaction(() => ({
+    currentState: state.value,
+    hasCustomView: menuProps.value.hasCustomView
+  }), ({
+    currentState,
+    hasCustomView
+  }) => {
+    if (currentState === CONTEXT_MENU_STATE.ACTIVE && hasCustomView) {
+      runOnJS(updateRenderFn)(true);
+    } else if (currentState === CONTEXT_MENU_STATE.END) {
+      runOnJS(updateRenderFn)(false);
+    }
+  }, [state, menuProps]);
+  const wrapperStyles = useAnimatedStyle(() => {
+    const anchorPositionVertical = menuProps.value.anchorPosition.split('-')[0];
+    const isAbove = anchorPositionVertical === 'top'; // Fixed anchor point: top of the item
+
+    const top = menuProps.value.itemY;
+    const SCREEN_PADDING = 16;
+    const MAX_WIDTH = WINDOW_WIDTH - SCREEN_PADDING * 2; // Start at item's left edge
+
+    let left = menuProps.value.itemX; // If the view overflows the right edge, shift left
+
+    if (customViewWidth > 0 && left + customViewWidth > WINDOW_WIDTH - SCREEN_PADDING) {
+      left = Math.max(SCREEN_PADDING, WINDOW_WIDTH - customViewWidth - SCREEN_PADDING);
+    }
+
+    if (left < SCREEN_PADDING) {
+      left = SCREEN_PADDING;
+    }
+
+    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 === CONTEXT_MENU_STATE.ACTIVE ? withSpring(1, SPRING_CONFIGURATION_MENU) : withTiming(0, {
+      duration: HOLD_ITEM_TRANSFORM_DURATION
+    });
+    const opacityAnimation = withTiming(state.value === CONTEXT_MENU_STATE.ACTIVE ? 1 : 0, {
+      duration: 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,
+      opacity: opacityAnimation,
+      transform: [// 1. Transform value (screen boundary compensation)
+      {
+        translateY: state.value === CONTEXT_MENU_STATE.ACTIVE ? withSpring(tY, SPRING_CONFIGURATION) : withTiming(0, {
+          duration: HOLD_ITEM_TRANSFORM_DURATION
+        })
+      }, // 2. Position offset (animated when customViewHeight changes)
+      {
+        translateY: withSpring(positionOffsetY, 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.createElement(Animated.View, {
+    style: [styles.customViewWrapper, wrapperStyles]
+  }, /*#__PURE__*/React.createElement(Animated.View, {
+    onLayout: onLayout
+  }, renderFn({
+    closeMenu
+  })));
+};
+
+const styles = StyleSheet.create({
+  customViewWrapper: {
+    position: 'absolute',
+    zIndex: 20
+  }
+});
+const CustomView = /*#__PURE__*/React.memo(CustomViewComponent);
+export default CustomView;
+//# sourceMappingURL=CustomView.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["CustomView.tsx"],"names":["React","useCallback","useState","StyleSheet","Animated","runOnJS","useAnimatedReaction","useAnimatedStyle","withSpring","withTiming","useInternal","HOLD_ITEM_TRANSFORM_DURATION","CONTEXT_MENU_STATE","SPRING_CONFIGURATION","SPRING_CONFIGURATION_MENU","WINDOW_WIDTH","CustomViewComponent","state","menuProps","customViewRef","renderFn","setRenderFn","customViewHeight","setCustomViewHeight","customViewWidth","setCustomViewWidth","closeMenu","value","END","onLayout","event","height","width","nativeEvent","layout","clearRenderFn","updateRenderFn","hasCustomView","current","setTimeout","currentState","ACTIVE","wrapperStyles","anchorPositionVertical","anchorPosition","split","isAbove","top","itemY","SCREEN_PADDING","MAX_WIDTH","left","itemX","Math","max","tY","transformValue","positionOffsetY","itemHeight","scaleAnimation","duration","opacityAnimation","scaleAnchorOffset","maxWidth","opacity","transform","translateY","scale","styles","customViewWrapper","create","position","zIndex","CustomView","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  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        ? withSpring(1, SPRING_CONFIGURATION_MENU)\n        : withTiming(0, { duration: HOLD_ITEM_TRANSFORM_DURATION });\n\n    const opacityAnimation = withTiming(\n      state.value === CONTEXT_MENU_STATE.ACTIVE ? 1 : 0,\n      { duration: HOLD_ITEM_TRANSFORM_DURATION }\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/module/components/holdItem/HoldItem.js

@@ -14,11 +14,11 @@ import { HOLD_ITEM_TRANSFORM_DURATION, HOLD_ITEM_SCALE_DOWN_DURATION, HOLD_ITEM_
 import { useDeviceOrientation } from '../../hooks';
 import styles from './styles';
 import styleGuide from '../../styleGuide';
-import { useInternal } from '../../hooks';
-const defaultItems = [];
+import { useInternal } from '../../hooks'; //#endregion
 
 const HoldItemComponent = ({
-  items = defaultItems,
+  items,
+  renderCustomView,
   bottom,
   containerStyles,
   disableMove,
@@ -28,15 +28,14 @@ const HoldItemComponent = ({
   actionParams,
   closeOnTap,
   longPressMinDurationMs = 150,
-  children,
-  renderContent
+  children
 }) => {
   //#region hooks
   const {
     state,
     menuProps,
-    safeAreaInsets,
-    contentRenderer
+    customViewRef,
+    safeAreaInsets
   } = useInternal();
   const deviceOrientation = useDeviceOrientation(); //#endregion
   //#region variables
@@ -52,6 +51,7 @@ const HoldItemComponent = ({
   const transformOrigin = useSharedValue(menuAnchorPosition || 'top-right');
   const key = useMemo(() => `hold-item-${nanoid()}`, []);
   const menuHeight = useMemo(() => {
+    if (!items || items.length === 0) return 0;
     const itemsWithSeparator = items.filter(item => item.withSeparator);
     return calculateMenuHeight(items.length, itemsWithSeparator.length);
   }, [items]);
@@ -108,7 +108,7 @@ const HoldItemComponent = ({
     'worklet';
 
     const height = deviceOrientation === 'portrait' ? WINDOW_HEIGHT : WINDOW_WIDTH;
-    const isAnchorPointTop = itemRectY.value > WINDOW_HEIGHT / 2;
+    const isAnchorPointTop = transformOrigin.value.includes('top');
     let tY = 0;
 
     if (!disableMove) {
@@ -124,9 +124,14 @@ const HoldItemComponent = ({
     return tY;
   };
 
+  const updateCustomViewRef = () => {
+    customViewRef.current = renderCustomView || null;
+  };
+
   const setMenuProps = () => {
     'worklet';
 
+    runOnJS(updateCustomViewRef)();
     menuProps.value = {
       itemHeight: itemRectHeight.value,
       itemWidth: itemRectWidth.value,
@@ -134,9 +139,10 @@ const HoldItemComponent = ({
       itemX: itemRectX.value,
       anchorPosition: transformOrigin.value,
       menuHeight: menuHeight,
-      items,
+      items: items || [],
       transformValue: transformValue.value,
-      actionParams: actionParams || {}
+      actionParams: actionParams || {},
+      hasCustomView: !!renderCustomView
     };
   };
 
@@ -148,33 +154,23 @@ const HoldItemComponent = ({
     });
   };
 
-  const setContentRenderer = () => {
-    if (renderContent) {
-      contentRenderer.current = params => renderContent({
-        closeMenu: params
-      });
-    } else {
-      contentRenderer.current = null;
-    }
-  };
-
   const onCompletion = isFinised => {
     'worklet';
 
-    const isListValid = true; // items && items.length > 0;
+    const hasItems = items && items.length > 0;
+    const hasCustomView = !!renderCustomView;
 
-    if (isFinised && isListValid) {
+    if (isFinised && (hasItems || hasCustomView)) {
       state.value = CONTEXT_MENU_STATE.ACTIVE;
       isActive.value = true;
       scaleBack();
-      runOnJS(setContentRenderer)();
 
       if (hapticFeedback !== 'None') {
         runOnJS(hapticResponse)();
       }
     }
 
-    isAnimationStarted.value = false; // TODO: Warn user if item list is empty or not given
+    isAnimationStarted.value = false;
   };
 
   const scaleHold = () => {

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

@@ -1 +1 @@
-{"version":3,"sources":["HoldItem.tsx"],"names":["React","memo","useMemo","TapGestureHandler","LongPressGestureHandler","Animated","measure","runOnJS","useAnimatedGestureHandler","useAnimatedProps","useAnimatedRef","useAnimatedStyle","useSharedValue","withDelay","withTiming","withSequence","withSpring","useAnimatedReaction","Portal","nanoid","Haptics","getTransformOrigin","calculateMenuHeight","HOLD_ITEM_TRANSFORM_DURATION","HOLD_ITEM_SCALE_DOWN_DURATION","HOLD_ITEM_SCALE_DOWN_VALUE","SPRING_CONFIGURATION","WINDOW_HEIGHT","WINDOW_WIDTH","CONTEXT_MENU_STATE","useDeviceOrientation","styles","styleGuide","useInternal","defaultItems","HoldItemComponent","items","bottom","containerStyles","disableMove","menuAnchorPosition","activateOn","hapticFeedback","actionParams","closeOnTap","longPressMinDurationMs","children","renderContent","state","menuProps","safeAreaInsets","contentRenderer","deviceOrientation","isActive","isAnimationStarted","itemRectY","itemRectX","itemRectWidth","itemRectHeight","itemScale","transformValue","transformOrigin","key","menuHeight","itemsWithSeparator","filter","item","withSeparator","length","isHold","containerRef","hapticResponse","style","selectionAsync","impactAsync","ImpactFeedbackStyle","notificationAsync","NotificationFeedbackType","activateAnimation","ctx","didMeasureLayout","measured","value","pageY","pageX","height","width","position","calculateTransformValue","isAnchorPointTop","tY","topTransform","spacing","bottomTransform","top","setMenuProps","itemHeight","itemWidth","itemY","itemX","anchorPosition","scaleBack","duration","setContentRenderer","current","params","closeMenu","onCompletion","isFinised","isListValid","ACTIVE","scaleHold","scaleTap","canCallActivateFunctions","willActivateWithTap","gestureEvent","onActive","_","context","onFinish","overlayGestureEvent","END","animatedContainerStyle","animateOpacity","opacity","transform","scale","containerStyle","animatedPortalStyle","transformAnimation","zIndex","left","translateY","portalContainerStyle","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} 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';\nimport { MenuItemProps } from '../menu/types';\n//#endregion\n\ntype Context = { didMeasureLayout: boolean };\nconst defaultItems = [] as MenuItemProps[];\nconst HoldItemComponent: React.FC<HoldItemProps> = ({\n  items = defaultItems,\n  bottom,\n  containerStyles,\n  disableMove,\n  menuAnchorPosition,\n  activateOn,\n  hapticFeedback,\n  actionParams,\n  closeOnTap,\n  longPressMinDurationMs = 150,\n  children,\n  renderContent,\n}) => {\n  //#region hooks\n  const { state, menuProps, safeAreaInsets, contentRenderer } = 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    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 = itemRectY.value > WINDOW_HEIGHT / 2;\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 setMenuProps = () => {\n    'worklet';\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,\n      transformValue: transformValue.value,\n      actionParams: actionParams || {},\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 setContentRenderer = () => {\n    if (renderContent) {\n      contentRenderer.current = (params: any) =>\n        renderContent({ closeMenu: params });\n    } else {\n      contentRenderer.current = null;\n    }\n  };\n\n  const onCompletion = (isFinised?: boolean) => {\n    'worklet';\n    const isListValid = true;\n    // items && items.length > 0;\n    if (isFinised && isListValid) {\n      state.value = CONTEXT_MENU_STATE.ACTIVE;\n      isActive.value = true;\n      scaleBack();\n      runOnJS(setContentRenderer)();\n      if (hapticFeedback !== 'None') {\n        runOnJS(hapticResponse)();\n      }\n    }\n\n    isAnimationStarted.value = false;\n\n    // TODO: Warn user if item list is empty or not given\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) as React.FC<HoldItemProps>;\n\nexport default HoldItem;\n"]}
+{"version":3,"sources":["HoldItem.tsx"],"names":["React","memo","useMemo","TapGestureHandler","LongPressGestureHandler","Animated","measure","runOnJS","useAnimatedGestureHandler","useAnimatedProps","useAnimatedRef","useAnimatedStyle","useSharedValue","withDelay","withTiming","withSequence","withSpring","useAnimatedReaction","Portal","nanoid","Haptics","getTransformOrigin","calculateMenuHeight","HOLD_ITEM_TRANSFORM_DURATION","HOLD_ITEM_SCALE_DOWN_DURATION","HOLD_ITEM_SCALE_DOWN_VALUE","SPRING_CONFIGURATION","WINDOW_HEIGHT","WINDOW_WIDTH","CONTEXT_MENU_STATE","useDeviceOrientation","styles","styleGuide","useInternal","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","selectionAsync","impactAsync","ImpactFeedbackStyle","notificationAsync","NotificationFeedbackType","activateAnimation","ctx","didMeasureLayout","measured","value","pageY","pageX","height","width","position","calculateTransformValue","isAnchorPointTop","includes","tY","topTransform","spacing","bottomTransform","top","updateCustomViewRef","current","setMenuProps","itemHeight","itemWidth","itemY","itemX","anchorPosition","hasCustomView","scaleBack","duration","onCompletion","isFinised","hasItems","ACTIVE","scaleHold","scaleTap","canCallActivateFunctions","willActivateWithTap","gestureEvent","onActive","_","context","onFinish","overlayGestureEvent","END","animatedContainerStyle","animateOpacity","opacity","transform","scale","containerStyle","animatedPortalStyle","transformAnimation","zIndex","left","translateY","portalContainerStyle","holdItem","animatedPortalProps","pointerEvents","_state","GestureHandler","handlerChildren","PortalOverlay","portalOverlay","HoldItem"],"mappings":"AAAA,OAAOA,KAAP,IAAgBC,IAAhB,EAAsBC,OAAtB,QAAqC,OAArC;AAGA;AACA,SACEC,iBADF,EAEEC,uBAFF,QAKO,8BALP;AAMA,OAAOC,QAAP,IACEC,OADF,EAEEC,OAFF,EAGEC,yBAHF,EAIEC,gBAJF,EAKEC,cALF,EAMEC,gBANF,EAOEC,cAPF,EAQEC,SARF,EASEC,UATF,EAUEC,YAVF,EAWEC,UAXF,EAYEC,mBAZF,QAaO,yBAbP,C,CAcA;AAEA;;AACA,SAASC,MAAT,QAAuB,gBAAvB;AACA,SAASC,MAAT,QAAuB,mBAAvB;AACA,OAAO,KAAKC,OAAZ,MAAyB,cAAzB,C,CACA;AAEA;;AACA,SAEEC,kBAFF,EAGEC,mBAHF,QAIO,0BAJP;AAKA,SACEC,4BADF,EAEEC,6BAFF,EAGEC,0BAHF,EAIEC,oBAJF,EAKEC,aALF,EAMEC,YANF,EAOEC,kBAPF,QAQO,iBARP;AASA,SAASC,oBAAT,QAAqC,aAArC;AACA,OAAOC,MAAP,MAAmB,UAAnB;AAGA,OAAOC,UAAP,MAAuB,kBAAvB;AACA,SAASC,WAAT,QAA4B,aAA5B,C,CACA;;AAIA,MAAMC,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,MAAsDjB,WAAW,EAAvE;AACA,QAAMkB,iBAAiB,GAAGrB,oBAAoB,EAA9C,CAHmB,CAInB;AAEA;;AACA,QAAMsB,QAAQ,GAAGxC,cAAc,CAAC,KAAD,CAA/B;AACA,QAAMyC,kBAAkB,GAAGzC,cAAc,CAAC,KAAD,CAAzC;AAEA,QAAM0C,SAAS,GAAG1C,cAAc,CAAS,CAAT,CAAhC;AACA,QAAM2C,SAAS,GAAG3C,cAAc,CAAS,CAAT,CAAhC;AACA,QAAM4C,aAAa,GAAG5C,cAAc,CAAS,CAAT,CAApC;AACA,QAAM6C,cAAc,GAAG7C,cAAc,CAAS,CAAT,CAArC;AACA,QAAM8C,SAAS,GAAG9C,cAAc,CAAS,CAAT,CAAhC;AACA,QAAM+C,cAAc,GAAG/C,cAAc,CAAS,CAAT,CAArC;AAEA,QAAMgD,eAAe,GAAGhD,cAAc,CACpC4B,kBAAkB,IAAI,WADc,CAAtC;AAIA,QAAMqB,GAAG,GAAG3D,OAAO,CAAC,MAAO,aAAYiB,MAAM,EAAG,EAA7B,EAAgC,EAAhC,CAAnB;AACA,QAAM2C,UAAU,GAAG5D,OAAO,CAAC,MAAM;AAC/B,QAAI,CAACiC,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,WAAO7C,mBAAmB,CAACa,KAAK,CAAC4B,MAAP,EAAeC,kBAAkB,CAACD,MAAlC,CAA1B;AACD,GAJyB,EAIvB,CAAC5B,KAAD,CAJuB,CAA1B;AAMA,QAAMiC,MAAM,GAAG,CAAC3B,UAAD,IAAeA,UAAU,KAAK,MAA7C,CA5BmB,CA6BnB;AAEA;;AACA,QAAM4B,YAAY,GAAG3D,cAAc,EAAnC,CAhCmB,CAiCnB;AAEA;;AACA,QAAM4D,cAAc,GAAG,MAAM;AAC3B,UAAMC,KAAK,GAAG,CAAC7B,cAAD,GAAkB,QAAlB,GAA6BA,cAA3C;;AACA,YAAQ6B,KAAR;AACE,WAAM,WAAN;AACEnD,QAAAA,OAAO,CAACoD,cAAR;AACA;;AACF,WAAM,OAAN;AACA,WAAM,QAAN;AACA,WAAM,OAAN;AACEpD,QAAAA,OAAO,CAACqD,WAAR,CAAoBrD,OAAO,CAACsD,mBAAR,CAA4BH,KAA5B,CAApB;AACA;;AACF,WAAM,SAAN;AACA,WAAM,SAAN;AACA,WAAM,OAAN;AACEnD,QAAAA,OAAO,CAACuD,iBAAR,CAA0BvD,OAAO,CAACwD,wBAAR,CAAiCL,KAAjC,CAA1B;AACA;;AACF;AAdF;AAgBD,GAlBD,CApCmB,CAuDnB;AAEA;;;AACA,QAAMM,iBAAiB,GAAIC,GAAD,IAAc;AACtC;;AACA,QAAI,CAACA,GAAG,CAACC,gBAAT,EAA2B;AACzB,YAAMC,QAAQ,GAAG1E,OAAO,CAAC+D,YAAD,CAAxB;AAEAf,MAAAA,SAAS,CAAC2B,KAAV,GAAkBD,QAAQ,CAACE,KAA3B;AACA3B,MAAAA,SAAS,CAAC0B,KAAV,GAAkBD,QAAQ,CAACG,KAA3B;AACA1B,MAAAA,cAAc,CAACwB,KAAf,GAAuBD,QAAQ,CAACI,MAAhC;AACA5B,MAAAA,aAAa,CAACyB,KAAd,GAAsBD,QAAQ,CAACK,KAA/B;;AAEA,UAAI,CAAC7C,kBAAL,EAAyB;AACvB,cAAM8C,QAAQ,GAAGjE,kBAAkB,CACjC2D,QAAQ,CAACG,KADwB,EAEjC3B,aAAa,CAACyB,KAFmB,EAGjC9B,iBAAiB,KAAK,UAAtB,GAAmCvB,YAAnC,GAAkDD,aAHjB,EAIjCU,MAJiC,CAAnC;AAMAuB,QAAAA,eAAe,CAACqB,KAAhB,GAAwBK,QAAxB;AACD;AACF;AACF,GApBD;;AAsBA,QAAMC,uBAAuB,GAAG,MAAM;AACpC;;AAEA,UAAMH,MAAM,GACVjC,iBAAiB,KAAK,UAAtB,GAAmCxB,aAAnC,GAAmDC,YADrD;AAGA,UAAM4D,gBAAgB,GAAG5B,eAAe,CAACqB,KAAhB,CAAsBQ,QAAtB,CAA+B,KAA/B,CAAzB;AAEA,QAAIC,EAAE,GAAG,CAAT;;AACA,QAAI,CAACnD,WAAL,EAAkB;AAChB,UAAIiD,gBAAJ,EAAsB;AACpB,cAAMG,YAAY,GAChBrC,SAAS,CAAC2B,KAAV,GACAxB,cAAc,CAACwB,KADf,GAEAnB,UAFA,GAGA9B,UAAU,CAAC4D,OAHX,IAIC,CAAA1C,cAAc,SAAd,IAAAA,cAAc,WAAd,YAAAA,cAAc,CAAEb,MAAhB,KAA0B,CAJ3B,CADF;AAOAqD,QAAAA,EAAE,GAAGC,YAAY,GAAGP,MAAf,GAAwBA,MAAM,GAAGO,YAAjC,GAAgD,CAArD;AACD,OATD,MASO;AACL,cAAME,eAAe,GACnBvC,SAAS,CAAC2B,KAAV,GAAkBnB,UAAlB,IAAgC,CAAAZ,cAAc,SAAd,IAAAA,cAAc,WAAd,YAAAA,cAAc,CAAE4C,GAAhB,KAAuB,CAAvD,CADF;AAEAJ,QAAAA,EAAE,GACAG,eAAe,GAAG,CAAlB,GAAsB,CAACA,eAAD,GAAmB7D,UAAU,CAAC4D,OAAX,GAAqB,CAA9D,GAAkE,CADpE;AAED;AACF;;AACD,WAAOF,EAAP;AACD,GA3BD;;AA6BA,QAAMK,mBAAmB,GAAG,MAAM;AAChC9C,IAAAA,aAAa,CAAC+C,OAAd,GAAwB5D,gBAAgB,IAAI,IAA5C;AACD,GAFD;;AAIA,QAAM6D,YAAY,GAAG,MAAM;AACzB;;AAEA1F,IAAAA,OAAO,CAACwF,mBAAD,CAAP;AAEA/C,IAAAA,SAAS,CAACiC,KAAV,GAAkB;AAChBiB,MAAAA,UAAU,EAAEzC,cAAc,CAACwB,KADX;AAEhBkB,MAAAA,SAAS,EAAE3C,aAAa,CAACyB,KAFT;AAGhBmB,MAAAA,KAAK,EAAE9C,SAAS,CAAC2B,KAHD;AAIhBoB,MAAAA,KAAK,EAAE9C,SAAS,CAAC0B,KAJD;AAKhBqB,MAAAA,cAAc,EAAE1C,eAAe,CAACqB,KALhB;AAMhBnB,MAAAA,UAAU,EAAEA,UANI;AAOhB3B,MAAAA,KAAK,EAAEA,KAAK,IAAI,EAPA;AAQhBwB,MAAAA,cAAc,EAAEA,cAAc,CAACsB,KARf;AAShBtC,MAAAA,YAAY,EAAEA,YAAY,IAAI,EATd;AAUhB4D,MAAAA,aAAa,EAAE,CAAC,CAACnE;AAVD,KAAlB;AAYD,GAjBD;;AAmBA,QAAMoE,SAAS,GAAG,MAAM;AACtB;;AACA9C,IAAAA,SAAS,CAACuB,KAAV,GAAkBnE,UAAU,CAAC,CAAD,EAAI;AAC9B2F,MAAAA,QAAQ,EAAElF,4BAA4B,GAAG;AADX,KAAJ,CAA5B;AAGD,GALD;;AAOA,QAAMmF,YAAY,GAAIC,SAAD,IAAyB;AAC5C;;AACA,UAAMC,QAAQ,GAAGzE,KAAK,IAAIA,KAAK,CAAC4B,MAAN,GAAe,CAAzC;AACA,UAAMwC,aAAa,GAAG,CAAC,CAACnE,gBAAxB;;AACA,QAAIuE,SAAS,KAAKC,QAAQ,IAAIL,aAAjB,CAAb,EAA8C;AAC5CxD,MAAAA,KAAK,CAACkC,KAAN,GAAcpD,kBAAkB,CAACgF,MAAjC;AACAzD,MAAAA,QAAQ,CAAC6B,KAAT,GAAiB,IAAjB;AACAuB,MAAAA,SAAS;;AACT,UAAI9D,cAAc,KAAK,MAAvB,EAA+B;AAC7BnC,QAAAA,OAAO,CAAC+D,cAAD,CAAP;AACD;AACF;;AAEDjB,IAAAA,kBAAkB,CAAC4B,KAAnB,GAA2B,KAA3B;AACD,GAdD;;AAgBA,QAAM6B,SAAS,GAAG,MAAM;AACtB;;AACApD,IAAAA,SAAS,CAACuB,KAAV,GAAkBnE,UAAU,CAC1BW,0BAD0B,EAE1B;AAAEgF,MAAAA,QAAQ,EAAEjF;AAAZ,KAF0B,EAG1BkF,YAH0B,CAA5B;AAKD,GAPD;;AASA,QAAMK,QAAQ,GAAG,MAAM;AACrB;;AACA1D,IAAAA,kBAAkB,CAAC4B,KAAnB,GAA2B,IAA3B;AAEAvB,IAAAA,SAAS,CAACuB,KAAV,GAAkBlE,YAAY,CAC5BD,UAAU,CAACW,0BAAD,EAA6B;AACrCgF,MAAAA,QAAQ,EAAEjF;AAD2B,KAA7B,CADkB,EAI5BV,UAAU,CACR,CADQ,EAER;AACE2F,MAAAA,QAAQ,EAAElF,4BAA4B,GAAG;AAD3C,KAFQ,EAKRmF,YALQ,CAJkB,CAA9B;AAYD,GAhBD;AAkBA;AACF;AACA;AACA;AACA;;;AACE,QAAMM,wBAAwB,GAAG,MAAM;AACrC;;AACA,UAAMC,mBAAmB,GACvBxE,UAAU,KAAK,YAAf,IAA+BA,UAAU,KAAK,KADhD;AAGA,WACGwE,mBAAmB,IAAI,CAAC5D,kBAAkB,CAAC4B,KAA5C,IAAsD,CAACgC,mBADzD;AAGD,GARD,CA3LmB,CAoMnB;AAEA;;;AACA,QAAMC,YAAY,GAAG1G,yBAAyB,CAG5C;AACA2G,IAAAA,QAAQ,EAAE,CAACC,CAAD,EAAIC,OAAJ,KAAgB;AACxB,UAAIL,wBAAwB,EAA5B,EAAgC;AAC9B,YAAI,CAACK,OAAO,CAACtC,gBAAb,EAA+B;AAC7BF,UAAAA,iBAAiB,CAACwC,OAAD,CAAjB;AACA1D,UAAAA,cAAc,CAACsB,KAAf,GAAuBM,uBAAuB,EAA9C;AACAU,UAAAA,YAAY;AACZoB,UAAAA,OAAO,CAACtC,gBAAR,GAA2B,IAA3B;AACD;;AAED,YAAI,CAAC3B,QAAQ,CAAC6B,KAAd,EAAqB;AACnB,cAAIb,MAAJ,EAAY;AACV0C,YAAAA,SAAS;AACV,WAFD,MAEO;AACLC,YAAAA,QAAQ;AACT;AACF;AACF;AACF,KAlBD;AAmBAO,IAAAA,QAAQ,EAAE,CAACF,CAAD,EAAIC,OAAJ,KAAgB;AACxBA,MAAAA,OAAO,CAACtC,gBAAR,GAA2B,KAA3B;;AACA,UAAIX,MAAJ,EAAY;AACVoC,QAAAA,SAAS;AACV;AACF;AAxBD,GAH4C,CAA9C;AA8BA,QAAMe,mBAAmB,GAAG/G,yBAAyB,CAGnD;AACA2G,IAAAA,QAAQ,EAAEC,CAAC,IAAI;AACb,UAAIxE,UAAJ,EAAgBG,KAAK,CAACkC,KAAN,GAAcpD,kBAAkB,CAAC2F,GAAjC;AACjB;AAHD,GAHmD,CAArD,CArOmB,CA6OnB;AAEA;;AACA,QAAMC,sBAAsB,GAAG9G,gBAAgB,CAAC,MAAM;AACpD,UAAM+G,cAAc,GAAG,MACrB7G,SAAS,CAACU,4BAAD,EAA+BT,UAAU,CAAC,CAAD,EAAI;AAAE2F,MAAAA,QAAQ,EAAE;AAAZ,KAAJ,CAAzC,CADX;;AAGA,WAAO;AACLkB,MAAAA,OAAO,EAAEvE,QAAQ,CAAC6B,KAAT,GAAiB,CAAjB,GAAqByC,cAAc,EADvC;AAELE,MAAAA,SAAS,EAAE,CACT;AACEC,QAAAA,KAAK,EAAEzE,QAAQ,CAAC6B,KAAT,GACHnE,UAAU,CAAC,CAAD,EAAI;AAAE2F,UAAAA,QAAQ,EAAElF;AAAZ,SAAJ,CADP,GAEHmC,SAAS,CAACuB;AAHhB,OADS;AAFN,KAAP;AAUD,GAd8C,CAA/C;AAeA,QAAM6C,cAAc,GAAG9H,KAAK,CAACE,OAAN,CACrB,MAAM,CAACoC,eAAD,EAAkBmF,sBAAlB,CADe,EAErB,CAACnF,eAAD,EAAkBmF,sBAAlB,CAFqB,CAAvB;AAKA,QAAMM,mBAAmB,GAAGpH,gBAAgB,CAAC,MAAM;AACjD,UAAM+G,cAAc,GAAG,MACrB7G,SAAS,CAACU,4BAAD,EAA+BT,UAAU,CAAC,CAAD,EAAI;AAAE2F,MAAAA,QAAQ,EAAE;AAAZ,KAAJ,CAAzC,CADX;;AAGA,QAAIf,EAAE,GAAGH,uBAAuB,EAAhC;;AACA,UAAMyC,kBAAkB,GAAG,MACzBzF,WAAW,GACP,CADO,GAEPa,QAAQ,CAAC6B,KAAT,GACAjE,UAAU,CAAC0E,EAAD,EAAKhE,oBAAL,CADV,GAEAZ,UAAU,CAAC,CAAC,GAAF,EAAO;AAAE2F,MAAAA,QAAQ,EAAElF;AAAZ,KAAP,CALhB;;AAOA,WAAO;AACL0G,MAAAA,MAAM,EAAE,EADH;AAEL3C,MAAAA,QAAQ,EAAE,UAFL;AAGLQ,MAAAA,GAAG,EAAExC,SAAS,CAAC2B,KAHV;AAILiD,MAAAA,IAAI,EAAE3E,SAAS,CAAC0B,KAJX;AAKLI,MAAAA,KAAK,EAAE7B,aAAa,CAACyB,KALhB;AAMLG,MAAAA,MAAM,EAAE3B,cAAc,CAACwB,KANlB;AAOL0C,MAAAA,OAAO,EAAEvE,QAAQ,CAAC6B,KAAT,GAAiB,CAAjB,GAAqByC,cAAc,EAPvC;AAQLE,MAAAA,SAAS,EAAE,CACT;AACEO,QAAAA,UAAU,EAAEH,kBAAkB;AADhC,OADS,EAIT;AACEH,QAAAA,KAAK,EAAEzE,QAAQ,CAAC6B,KAAT,GACHnE,UAAU,CAAC,CAAD,EAAI;AAAE2F,UAAAA,QAAQ,EAAElF;AAAZ,SAAJ,CADP,GAEHmC,SAAS,CAACuB;AAHhB,OAJS;AARN,KAAP;AAmBD,GA/B2C,CAA5C;AAgCA,QAAMmD,oBAAoB,GAAGlI,OAAO,CAClC,MAAM,CAAC6B,MAAM,CAACsG,QAAR,EAAkBN,mBAAlB,CAD4B,EAElC,CAACA,mBAAD,CAFkC,CAApC;AAKA,QAAMO,mBAAmB,GAAG7H,gBAAgB,CAAY,OAAO;AAC7D8H,IAAAA,aAAa,EAAEnF,QAAQ,CAAC6B,KAAT,GAAiB,MAAjB,GAA0B;AADoB,GAAP,CAAZ,CAA5C,CAzSmB,CA4SnB;AAEA;;AACAhE,EAAAA,mBAAmB,CACjB,MAAM8B,KAAK,CAACkC,KADK,EAEjBuD,MAAM,IAAI;AACR,QAAIA,MAAM,KAAK3G,kBAAkB,CAAC2F,GAAlC,EAAuC;AACrCpE,MAAAA,QAAQ,CAAC6B,KAAT,GAAiB,KAAjB;AACD;AACF,GANgB,CAAnB,CA/SmB,CAuTnB;AAEA;;AACA,QAAMwD,cAAc,GAAGvI,OAAO,CAAC,MAAM;AACnC,YAAQuC,UAAR;AACE,WAAM,YAAN;AACE,eAAO,CAAC;AAAEK,UAAAA,QAAQ,EAAE4F;AAAZ,SAAD,kBACL,oBAAC,iBAAD;AACE,UAAA,YAAY,EAAE,CADhB;AAEE,UAAA,oBAAoB,EAAExB;AAFxB,WAIGwB,eAJH,CADF;;AAQF,WAAM,KAAN;AACE,eAAO,CAAC;AAAE5F,UAAAA,QAAQ,EAAE4F;AAAZ,SAAD,kBACL,oBAAC,iBAAD;AACE,UAAA,YAAY,EAAE,CADhB;AAEE,UAAA,oBAAoB,EAAExB;AAFxB,WAIGwB,eAJH,CADF;AAQF;;AACA;AACE,eAAO,CAAC;AAAE5F,UAAAA,QAAQ,EAAE4F;AAAZ,SAAD,kBACL,oBAAC,uBAAD;AACE,UAAA,aAAa,EAAE7F,sBADjB;AAEE,UAAA,oBAAoB,EAAEqE;AAFxB,WAIGwB,eAJH,CADF;AArBJ;AA8BD,GA/B6B,EA+B3B,CAACjG,UAAD,EAAayE,YAAb,CA/B2B,CAA9B;AAiCA,QAAMyB,aAAa,GAAGzI,OAAO,CAAC,MAAM;AAClC,WAAO,mBACL,oBAAC,iBAAD;AACE,MAAA,YAAY,EAAE,CADhB;AAEE,MAAA,oBAAoB,EAAEqH;AAFxB,oBAIE,oBAAC,QAAD,CAAU,IAAV;AAAe,MAAA,KAAK,EAAExF,MAAM,CAAC6G;AAA7B,MAJF,CADF;AAQD,GAT4B,EAS1B,CAACrB,mBAAD,CAT0B,CAA7B,CA3VmB,CAqWnB;AAEA;;AACA,sBACE,uDACE,oBAAC,cAAD,qBACE,oBAAC,QAAD,CAAU,IAAV;AAAe,IAAA,GAAG,EAAElD,YAApB;AAAkC,IAAA,KAAK,EAAEyD;AAAzC,KACGhF,QADH,CADF,CADF,eAOE,oBAAC,MAAD;AAAQ,IAAA,GAAG,EAAEe,GAAb;AAAkB,IAAA,IAAI,EAAEA;AAAxB,kBACE,oBAAC,QAAD,CAAU,IAAV;AACE,IAAA,GAAG,EAAEA,GADP;AAEE,IAAA,KAAK,EAAEuE,oBAFT;AAGE,IAAA,aAAa,EAAEE;AAHjB,kBAKE,oBAAC,aAAD,OALF,EAMGxF,QANH,CADF,CAPF,CADF,CAxWmB,CA4XnB;AACD,CA1YD;;AA4YA,MAAM+F,QAAQ,gBAAG5I,IAAI,CAACiC,iBAAD,CAArB;AAEA,eAAe2G,QAAf","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 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      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/module/components/menu/Menu.js

@@ -16,14 +16,12 @@ const MenuComponent = () => {
     const left = menuProps.value.itemX;
     const width = menuProps.value.itemWidth;
     const tY = menuProps.value.transformValue;
-    const isActive = state.value === CONTEXT_MENU_STATE.ACTIVE;
     return {
       top,
       left,
       width,
-      pointerEvents: isActive ? 'auto' : 'none',
       transform: [{
-        translateY: isActive ? withSpring(tY, SPRING_CONFIGURATION) : withTiming(0, {
+        translateY: state.value === CONTEXT_MENU_STATE.ACTIVE ? withSpring(tY, SPRING_CONFIGURATION) : withTiming(0, {
           duration: HOLD_ITEM_TRANSFORM_DURATION
         })
       }]

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

@@ -1 +1 @@
-{"version":3,"sources":["Menu.tsx"],"names":["React","Animated","useAnimatedStyle","withSpring","withTiming","MenuList","styles","useInternal","HOLD_ITEM_TRANSFORM_DURATION","CONTEXT_MENU_STATE","SPRING_CONFIGURATION","MenuComponent","state","menuProps","wrapperStyles","anchorPositionVertical","value","anchorPosition","split","top","itemHeight","itemY","left","itemX","width","itemWidth","tY","transformValue","isActive","ACTIVE","pointerEvents","transform","translateY","duration","menuWrapper","Menu","memo"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAEA,OAAOC,QAAP,IACEC,gBADF,EAEEC,UAFF,EAGEC,UAHF,QAIO,yBAJP;AAMA,OAAOC,QAAP,MAAqB,YAArB;AAEA,OAAOC,MAAP,MAAmB,UAAnB;AACA,SAASC,WAAT,QAA4B,aAA5B;AACA,SACEC,4BADF,EAEEC,kBAFF,EAGEC,oBAHF,QAIO,iBAJP;;AAMA,MAAMC,aAAa,GAAG,MAAM;AAC1B,QAAM;AAAEC,IAAAA,KAAF;AAASC,IAAAA;AAAT,MAAuBN,WAAW,EAAxC;AAEA,QAAMO,aAAa,GAAGZ,gBAAgB,CAAC,MAAM;AAC3C,UAAMa,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;AACA,UAAMC,QAAQ,GAAGhB,KAAK,CAACI,KAAN,KAAgBP,kBAAkB,CAACoB,MAApD;AAEA,WAAO;AACLV,MAAAA,GADK;AAELG,MAAAA,IAFK;AAGLE,MAAAA,KAHK;AAILM,MAAAA,aAAa,EAAEF,QAAQ,GAAG,MAAH,GAAY,MAJ9B;AAKLG,MAAAA,SAAS,EAAE,CACT;AACEC,QAAAA,UAAU,EAAEJ,QAAQ,GAChBzB,UAAU,CAACuB,EAAD,EAAKhB,oBAAL,CADM,GAEhBN,UAAU,CAAC,CAAD,EAAI;AAAE6B,UAAAA,QAAQ,EAAEzB;AAAZ,SAAJ;AAHhB,OADS;AALN,KAAP;AAaD,GAzBqC,EAyBnC,CAACK,SAAD,CAzBmC,CAAtC;AA2BA,sBACE,oBAAC,QAAD,CAAU,IAAV;AAAe,IAAA,KAAK,EAAE,CAACP,MAAM,CAAC4B,WAAR,EAAqBpB,aAArB;AAAtB,kBACE,oBAAC,QAAD,OADF,CADF;AAKD,CAnCD;;AAqCA,MAAMqB,IAAI,gBAAGnC,KAAK,CAACoC,IAAN,CAAWzB,aAAX,CAAb;AAEA,eAAewB,IAAf","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    const isActive = state.value === CONTEXT_MENU_STATE.ACTIVE;\n\n    return {\n      top,\n      left,\n      width,\n      pointerEvents: isActive ? 'auto' : 'none',\n      transform: [\n        {\n          translateY: isActive\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":["React","Animated","useAnimatedStyle","withSpring","withTiming","MenuList","styles","useInternal","HOLD_ITEM_TRANSFORM_DURATION","CONTEXT_MENU_STATE","SPRING_CONFIGURATION","MenuComponent","state","menuProps","wrapperStyles","anchorPositionVertical","value","anchorPosition","split","top","itemHeight","itemY","left","itemX","width","itemWidth","tY","transformValue","transform","translateY","ACTIVE","duration","menuWrapper","Menu","memo"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAEA,OAAOC,QAAP,IACEC,gBADF,EAEEC,UAFF,EAGEC,UAHF,QAIO,yBAJP;AAMA,OAAOC,QAAP,MAAqB,YAArB;AAEA,OAAOC,MAAP,MAAmB,UAAnB;AACA,SAASC,WAAT,QAA4B,aAA5B;AACA,SACEC,4BADF,EAEEC,kBAFF,EAGEC,oBAHF,QAIO,iBAJP;;AAMA,MAAMC,aAAa,GAAG,MAAM;AAC1B,QAAM;AAAEC,IAAAA,KAAF;AAASC,IAAAA;AAAT,MAAuBN,WAAW,EAAxC;AAEA,QAAMO,aAAa,GAAGZ,gBAAgB,CAAC,MAAM;AAC3C,UAAMa,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,KAAgBP,kBAAkB,CAACqB,MAAnC,GACI3B,UAAU,CAACuB,EAAD,EAAKhB,oBAAL,CADd,GAEIN,UAAU,CAAC,CAAD,EAAI;AAAE2B,UAAAA,QAAQ,EAAEvB;AAAZ,SAAJ;AAJlB,OADS;AAJN,KAAP;AAaD,GAxBqC,EAwBnC,CAACK,SAAD,CAxBmC,CAAtC;AA0BA,sBACE,oBAAC,QAAD,CAAU,IAAV;AAAe,IAAA,KAAK,EAAE,CAACP,MAAM,CAAC0B,WAAR,EAAqBlB,aAArB;AAAtB,kBACE,oBAAC,QAAD,OADF,CADF;AAKD,CAlCD;;AAoCA,MAAMmB,IAAI,gBAAGjC,KAAK,CAACkC,IAAN,CAAWvB,aAAX,CAAb;AAEA,eAAesB,IAAf","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/module/components/menu/MenuList.js

@@ -1,13 +1,15 @@
 import React from 'react';
 import { StyleSheet } from 'react-native';
-import Animated, { runOnJS, useAnimatedReaction, useAnimatedStyle, useDerivedValue, useSharedValue, withSpring, withTiming } from 'react-native-reanimated';
+import Animated, { runOnJS, useAnimatedProps, useAnimatedReaction, useAnimatedStyle, useDerivedValue, useSharedValue, withSpring, withTiming } from 'react-native-reanimated';
 import { calculateMenuHeight, menuAnimationAnchor } from '../../utils/calculations';
+import { BlurView } from '@react-native-community/blur';
 import MenuItems from './MenuItems';
-import { SPRING_CONFIGURATION_MENU, HOLD_ITEM_TRANSFORM_DURATION, CONTEXT_MENU_STATE } from '../../constants';
+import { SPRING_CONFIGURATION_MENU, HOLD_ITEM_TRANSFORM_DURATION, IS_IOS, CONTEXT_MENU_STATE } from '../../constants';
 import styles from './styles';
 import { useInternal } from '../../hooks';
 import { deepEqual } from '../../utils/validations';
 import { leftOrRight } from './calculations';
+const AnimatedView = Animated.createAnimatedComponent(BlurView);
 
 const MenuListComponent = () => {
   const {
@@ -53,9 +55,13 @@ const MenuListComponent = () => {
     };
   });
   const animatedInnerContainerStyle = useAnimatedStyle(() => {
-    const color = theme.value === 'light' ? '#fff' : '#1A1A1A';
     return {
-      backgroundColor: color
+      backgroundColor: theme.value === 'light' ? IS_IOS ? 'rgba(255, 255, 255, .75)' : 'rgba(255, 255, 255, .95)' : IS_IOS ? 'rgba(0,0,0,0.5)' : 'rgba(39, 39, 39, .8)'
+    };
+  }, [theme]);
+  const animatedProps = useAnimatedProps(() => {
+    return {
+      blurType: theme.value
     };
   }, [theme]);
 
@@ -69,7 +75,9 @@ const MenuListComponent = () => {
       runOnJS(setter)(_items);
     }
   }, [menuProps]);
-  return /*#__PURE__*/React.createElement(Animated.View, {
+  return /*#__PURE__*/React.createElement(AnimatedView, {
+    blurAmount: 100,
+    animatedProps: animatedProps,
     style: [styles.menuContainer, messageStyles]
   }, /*#__PURE__*/React.createElement(Animated.View, {
     style: [StyleSheet.absoluteFillObject, styles.menuInnerContainer, animatedInnerContainerStyle]