import { MotiView } from "moti";
import { INTERACTION_CONTAINER_ID, MotiPressableContext } from "moti/build/interactions/pressable/context";
import { Hoverable } from "moti/build/interactions/pressable/hoverable";
import { useMotiPressableContext } from "moti/interactions";
import React, { useMemo, forwardRef } from "react";
import { Pressable } from "react-native";
import { useSharedValue, runOnJS, useDerivedValue } from "react-native-reanimated";
export const MotiPressable = /*#__PURE__*/forwardRef(function MotiPressable(props, ref) {
  const {
    animate,
    from,
    exit,
    children,
    exitTransition,
    transition: transitionProp,
    style,
    onPressOut,
    onPressIn,
    onHoverIn,
    onHoverOut,
    onKeyDown,
    onKeyUp,
    onPress,
    onLongPress,
    hitSlop,
    disabled,
    containerStyle,
    dangerouslySilenceDuplicateIdsWarning = false,
    id,
    hoveredValue,
    pressedValue,
    onLayout,
    onContainerLayout,
    accessibilityActions,
    accessibilityElementsHidden,
    accessibilityHint,
    accessibilityIgnoresInvertColors,
    accessibilityLabel,
    accessibilityLiveRegion,
    accessibilityRole,
    accessibilityState,
    accessibilityValue,
    accessibilityViewIsModal,
    accessible,
    onAccessibilityTap,
    onAccessibilityAction,
    onAccessibilityEscape,
    importantForAccessibility,
    onFocus,
    onBlur,
    href,
    testID
  } = props;
  const _hovered = useSharedValue(false);
  const _pressed = useSharedValue(false);
  const hovered = hoveredValue || _hovered;
  const pressed = pressedValue || _pressed;
  const interaction = useDerivedValue(() => ({
    hovered: hovered.value,
    pressed: pressed.value
  }), [hovered, pressed]);
  const transition = useDerivedValue(() => {
    if (typeof transitionProp === "function") {
      return transitionProp(interaction.value);
    }
    return transitionProp || {};
  }, [transitionProp, interaction]);
  const __state = useDerivedValue(() => {
    if (typeof animate === "function") {
      return animate(interaction.value);
    }
    return animate;
  }, [animate, interaction]);
  const state = useMemo(() => ({
    __state
  }), [__state]);
  const updateInteraction = (event, enabled, callback) => () => {
    "worklet";

    if (event === "hovered") {
      hovered.value = enabled;
    } else if (event === "pressed") {
      pressed.value = enabled;
    }
    if (callback) {
      runOnJS(callback)();
    }
  };
  const child = /*#__PURE__*/React.createElement(MotiView, {
    from: from,
    exit: exit,
    transition: transition,
    exitTransition: exitTransition,
    state: state,
    style: style,
    onLayout: onLayout
  }, typeof children == "function" ? children(interaction) : children);
  let node;
  // if (Platform.OS === 'web' || Platform.OS === 'android') {
  node = /*#__PURE__*/React.createElement(Hoverable, {
    onHoverIn: updateInteraction("hovered", true, onHoverIn),
    onHoverOut: updateInteraction("hovered", false, onHoverOut),
    childRef: ref
  }, /*#__PURE__*/React.createElement(Pressable, {
    onLongPress: onLongPress,
    hitSlop: hitSlop,
    disabled: disabled,
    style: containerStyle,
    onPress: onPress,
    onPressIn: updateInteraction("pressed", true, onPressIn),
    onPressOut: updateInteraction("pressed", false, onPressOut),
    ref: ref,
    onLayout: onContainerLayout,
    accessibilityActions: accessibilityActions,
    accessibilityElementsHidden: accessibilityElementsHidden,
    accessibilityHint: accessibilityHint,
    accessibilityIgnoresInvertColors: accessibilityIgnoresInvertColors,
    accessibilityLabel: accessibilityLabel,
    accessibilityLiveRegion: accessibilityLiveRegion,
    accessibilityRole: accessibilityRole,
    accessibilityState: accessibilityState,
    accessibilityValue: accessibilityValue,
    accessibilityViewIsModal: accessibilityViewIsModal,
    accessible: accessible,
    onAccessibilityTap: onAccessibilityTap,
    onAccessibilityAction: onAccessibilityAction,
    onAccessibilityEscape: onAccessibilityEscape,
    importantForAccessibility: importantForAccessibility,
    testID: testID
    // @ts-expect-error RNW types
    ,
    onKeyDown: onKeyDown,
    onKeyUp: onKeyUp,
    onFocus: onFocus,
    onBlur: onBlur,
    href: href
  }, child));
  const context = useMotiPressableContext();
  if (!dangerouslySilenceDuplicateIdsWarning && id && context?.containers && id in context.containers) {
    console.error(`[MotiPressable] Duplicate id ${id} used. This means that you incorrectly placed a <MotiPressable id="${id}" /> component inside another one with the same id.

To silence this warning without solving the actual issue, you can use the dangerouslySilenceDuplicateIdsWarning prop. But you should probably refactor your code instead.`);
  }
  return /*#__PURE__*/React.createElement(MotiPressableContext.Provider, {
    value: useMemo(() => {
      const interactions = {
        containers: {
          ...context?.containers,
          [INTERACTION_CONTAINER_ID]: interaction
        }
      };
      if (id) {
        interactions.containers[id] = interaction;
      }
      return interactions;
    }, [context?.containers, id, interaction])
  }, node);
});
//# sourceMappingURL=moti-pressable.js.map