// Metro module 10538 (f10539).
import { useCallback, forwardRef, useState, useRef, useEffect, useMemo, useImperativeHandle } from "react";
import { View } from "react-native";
import { createStyles } from "../../../../design/components/Styles/native/createStyles";
import Module712 from "../../../../_bundle/Module712";
import FormRow from "../../../../design/void/Form/native/FormRow";
import * as _native from "../../../../design/void/native";
import { Icon } from "../../../../design/void/native";
import { FormLabel, FormDivider } from "../../../../design/void/Form/native/index";
import useWindowDimensions_native from "../../../screen/useWindowDimensions.native";
import useSafeAreaInsets_native from "../../../safe_area/useSafeAreaInsets.native";
import Module12 from "../../../../_bundle/Module12";
import * as _ReanimatedRexport from "../../../reanimated/ReanimatedRexport";
import ReanimatedRexport, { useAnimatedStyle } from "../../../reanimated/ReanimatedRexport";
import * as _timing from "../../../../design/animation/reanimated/timing/timing";
import * as _Module4160 from "../../../../_bundle/Module4160";
import { Gesture, GestureDetector } from "../../../../_bundle/Module5273";
let useStyles, __initData, __initData2, __initData3, __initData4;
const PopoutMenuRow = function PopoutMenuRow(props) {
  const { icon, text, onClick, onClose } = props;
  const styles = useStyles();
  return <FormRow leading={icon != null ? <Icon source={icon} /> : null} label={<FormLabel style={styles.popoutMenuRowLabel} text={text} />} style={styles.popoutMenuRow} onPress={useCallback(() => {
    if (onClick != null) {
      onClick();
    }
    if (onClose != null) {
      onClose();
    }
  }, [onClick, onClose])} />;
};
useStyles = createStyles({
  container: {
    position: "absolute",
    backgroundColor: Module712.colors.BACKGROUND_BASE_LOWEST,
    borderRadius: Module712.radii.sm
  },
  popoutMenuRow: {
    flex: 1
  },
  popoutMenuRowLabel: {
    width: "100%"
  }
});
__initData = {
  code: "function PopoutMenuTsx1(){const{withTiming,animateIn,STANDARD_EASING,ANIMATION_DURATION,runOnJS,handleClose,EXTRA_PADDING}=this.__closure;return{opacity:withTiming(animateIn?1:0,{easing:STANDARD_EASING,duration:ANIMATION_DURATION},'respect-motion-settings',function(finished){if(finished){runOnJS(handleClose)();}}),transform:[{translateY:withTiming(animateIn?-EXTRA_PADDING:0,{easing:STANDARD_EASING,duration:ANIMATION_DURATION})}]};}"
};
__initData2 = {
  code: "function PopoutMenuTsx2(finished){const{runOnJS,handleClose}=this.__closure;if(finished){runOnJS(handleClose)();}}"
};
__initData3 = {
  code: "function PopoutMenuTsx3(){const{runOnJS,handleLongPress}=this.__closure;runOnJS(handleLongPress)();}"
};
__initData4 = {
  code: "function PopoutMenuTsx4(){const{runOnJS,_setClose}=this.__closure;runOnJS(_setClose)(true);}"
};
const r48 = forwardRef(function PopoutMenu(props, a1) {
  let memo, c18118_17, callback, callback2, callback3;
  const { disabled, title, trigger, rows, style, onOpen, onClose: onClose2 } = props;
  memo = void 0;
  c18118_17 = void 0;
  callback = void 0;
  callback2 = void 0;
  callback3 = void 0;
  const styles = useStyles();
  const windowDimensions_native = useWindowDimensions_native();
  const { width, height } = windowDimensions_native;
  const bottom = useSafeAreaInsets_native().bottom;
  const [state5, setState] = useState(0);
  const [state, setState2] = useState(false);
  const [state2, setState3] = useState(false);
  const ref = useRef(null);
  const ref2 = useRef(null);
  const [state3, setState4] = useState({
    top: 0,
    left: 0,
    width: 0,
    height: 0
  });
  const [state4, setState5] = useState({
    width: 0,
    height: 0
  });
  useEffect(() => {
    let r3 = state2;
    if (state2) {
      r3 = ref?.current != null;
    }
    if (r3) {
      if (ref != null) {
        const current = ref.current;
        if (current != null) {
          current.measureInWindow((a0, a1, a2, a3) => {
            setState4({
              top: Math.max(a1, 0),
              left: a0,
              width: a2,
              height: a3
            });
          });
        }
      }
      setTimeout(() => {
        if (ref2 != null) {
          const current = ref2.current;
          if (current != null) {
            current.measureInWindow((a0, a1, a2, a3) => {
              setState5({
                width: a2,
                height: a3
              });
            });
          }
        }
      });
    }
  }, [state2]);
  const memo2 = useMemo(() => {
    let top = -state4.height;
    if (state3.top + state3.height + state4.height + 8 + bottom < height) {
      top = state3.height + 16;
    }
    return {
      top,
      left: state3.left + state4.width + 8 > width ? state3.width - state4.width : 0
    };
  }, [state4, bottom, height, width, state3]);
  const { top, left } = memo2;
  useImperativeHandle(a1, () => ({
    close: () => {
      setState2(true);
    }
  }), [setState2]);
  memo = useMemo(() => Module12.debounce((a0) => {
    setState(a0);
  }, 16), [setState]);
  const animateIn = state5 > 0 && !state;
  c18118_17 = animateIn;
  callback = useCallback(() => {
    if (state) {
      onClose2();
      setState3(false);
    }
  }, [state, onClose2]);
  const te = function te() {
    const r1 = c18118_17 ? 1 : 0;
    const r8 = {
      easing: _native.STANDARD_EASING,
      duration: 250
    };
    const r23 = function n(a0) {
      if (a0) {
        _ReanimatedRexport.runOnJS(callback)();
      }
    };
    r23.__closure = {
      runOnJS: _ReanimatedRexport.runOnJS,
      handleClose: callback
    };
    r23.__workletHash = 7805688342878;
    r23.__initData = __initData2;
    return {
      opacity: _timing.withTiming(r1, r8, "respect-motion-settings", r23),
      transform: [{
        translateY: _timing.withTiming(c18118_17 ? -8 : 0, {
          easing: _native.STANDARD_EASING,
          duration: 250
        })
      }]
    };
  };
  te.__closure = {
    withTiming: _timing.withTiming,
    animateIn,
    STANDARD_EASING: _native.STANDARD_EASING,
    ANIMATION_DURATION: 250,
    runOnJS: _ReanimatedRexport.runOnJS,
    handleClose: callback,
    EXTRA_PADDING: 8
  };
  te.__workletHash = 2727321893876;
  te.__initData = __initData;
  const animatedStyle = useAnimatedStyle(te);
  callback2 = useCallback(() => setState2(true), []);
  callback3 = useCallback(() => {
    setState2(false);
    _Module4160.trigger("impactHeavy");
    setState3(true);
    onOpen();
  }, [onOpen]);
  const memo3 = useMemo(() => {
    const r4 = Gesture.LongPress();
    const t = function t() {
      _ReanimatedRexport.runOnJS(setState2)(true);
    };
    t.__closure = {
      runOnJS: _ReanimatedRexport.runOnJS,
      _setClose: setState2
    };
    t.__workletHash = 15929711498886;
    t.__initData = __initData4;
    const r19 = r4.onBegin(t);
    const r21 = function n() {
      _ReanimatedRexport.runOnJS(callback3)();
    };
    r21.__closure = {
      runOnJS: _ReanimatedRexport.runOnJS,
      handleLongPress: callback3
    };
    r21.__workletHash = 1649917173815;
    r21.__initData = __initData3;
    return r19.onStart(r21);
  }, [callback3]);
  let r116 = trigger;
  if (!disabled) {
    const r128 = [<GestureDetector gesture={memo3}>
      <View ref={ref}>{trigger}</View>
    </GestureDetector>, state2 ? <ReanimatedRexport.View ref={ref2} style={[styles.container, style, {
      left,
      top
    }, animatedStyle]} onLayout={(event) => {
      memo(event.nativeEvent.layout.height);
    }}>
      {title != null ? <PopoutMenuRow text={title} /> : null}
      {title != null ? <FormDivider /> : null}
      {rows.map((row, index) => <PopoutMenuRow key={index} {...row} onClose={callback2} />)}
    </ReanimatedRexport.View> : null];
    r116 = <>{r128}</>;
  }
  return r116;
});
export default r48;