// Metro module 9350 (f9351).
import { useRef, useEffect } from "react";
import { Pressable } from "react-native";
import AccessibilityStore from "../../a11y/AccessibilityStore";
import { ContentDismissActionType } from "../../dismissible_content/DismissibleContentConstants";
import ReanimatedRexport, { Easing, useSharedValue, useAnimatedStyle } from "../../reanimated/ReanimatedRexport";
import { useStateFromStores } from "../../../_bundle/Module589";
import { useToken } from "../../../design/tokens/native/useToken";
import Module712 from "../../../_bundle/Module712";
import { withTiming } from "../../../design/animation/reanimated/timing/timing";
import { withSpring } from "../../../design/animation/reanimated/spring/spring";
import { createStyles } from "../../../design/components/Styles/native/createStyles";
import useBurstToggleCoachmark from "./useBurstToggleCoachmark";
import { intl, t } from "../../../intl/index.native";
import { SuperReactionIcon } from "../../../design/components/Icon/native/redesign/generated/SuperReactionIcon";
let c6160_8 = {
  duration: 100,
  easing: Easing.out(Easing.quad)
};
let c6160_9 = {
  stiffness: 750,
  mass: 2.5,
  damping: 70
};
const __initData = {
  code: "function BurstReactionToggleTsx1(){const{reducedMotion,targetBackgroundColor,backgroundColor,rotation}=this.__closure;const _backgroundColor=reducedMotion?targetBackgroundColor:backgroundColor.get();const _rotation=reducedMotion?0:rotation.get();return{backgroundColor:_backgroundColor,transform:[{rotate:_rotation+\"deg\"}]};}"
};
const useStyles = createStyles({
  container: {
    borderRadius: Module712.modules.button.BORDER_RADIUS,
    padding: 8,
    marginLeft: 8,
    width: 40,
    height: 40
  }
});
export default function BurstReactionToggle(props) {
  const { onPress: onPress2, isActive } = props;
  const styles = useStyles();
  const color = isActive ? Module712.colors.WHITE : Module712.colors.INTERACTIVE_TEXT_DEFAULT;
  let backgroundColor, c17169_2, sharedValue, sharedValue2;
  const ref = useRef(null);
  let c17168_1 = useBurstToggleCoachmark(ref);
  backgroundColor = void 0;
  c17169_2 = void 0;
  sharedValue = void 0;
  sharedValue2 = void 0;
  const stateFromStores = useStateFromStores([AccessibilityStore], () => AccessibilityStore.useReducedMotion);
  let r48 = useToken(isActive ? Module712.colors.BACKGROUND_BRAND : Module712.colors.INPUT_BACKGROUND_DEFAULT);
  if (r48 == null) {
    r48 = "";
  }
  backgroundColor = r48;
  const r0 = isActive ? 360 : 0;
  c17169_2 = r0;
  sharedValue = useSharedValue(backgroundColor);
  sharedValue2 = useSharedValue(r0);
  const r60 = function() {
    return {
      backgroundColor: stateFromStores ? backgroundColor : sharedValue.get(),
      transform: [{
        rotate: `${stateFromStores ? 0 : sharedValue2.get()}deg`
      }]
    };
  };
  r60.__closure = {
    reducedMotion: stateFromStores,
    targetBackgroundColor: backgroundColor,
    backgroundColor: sharedValue,
    rotation: sharedValue2
  };
  r60.__workletHash = 1525758595013;
  r60.__initData = __initData;
  const animatedStyle = useAnimatedStyle(r60);
  useEffect(() => {
    sharedValue.set(withTiming(backgroundColor, c6160_8));
    sharedValue2.set(withSpring(c17169_2, c6160_9));
  }, [sharedValue, backgroundColor, sharedValue2, r0]);
  return <Pressable onPress={function onPress() {
    c17168_1(ContentDismissActionType.AUTO);
    onPress2();
  }} accessible accessibilityLabel={isActive ? intl.string(t["5cRA/b"]) : intl.string(t.buV4av)} accessibilityRole="switch" accessibilityState={{
    checked: isActive
  }}>
    <ReanimatedRexport.View style={[styles.container, animatedStyle]} ref={ref}>
      <SuperReactionIcon color={color} />
    </ReanimatedRexport.View>
  </Pressable>;
};