// Metro module 14075 (f14076).
import { useEffect } from "react";
import { StyleSheet } from "react-native";
import Module712 from "../../../../_bundle/Module712";
import ReanimatedRexport, { useSharedValue, useAnimatedStyle } from "../../../reanimated/ReanimatedRexport";
import { withTiming } from "../../../../design/animation/reanimated/timing/timing";
import { timingSlow } from "../../../../design/animation/reanimated/timing/timingPresets";
import Module4611 from "../../../../_bundle/Module4611";
const BRAND_500 = Module712.unsafe_rawColors.BRAND_500;
const __initData = {
  code: "function BountiesAutoScrollOverlayNuxGradientTsx1(){const{opacity}=this.__closure;return{opacity:opacity.get()};}"
};
export default function BountiesAutoScrollOverlayNuxGradient(props) {
  const active = props.active;
  const sharedValue = useSharedValue(0);
  useEffect(() => {
    sharedValue.set(withTiming(active ? 1 : 0, timingSlow));
  }, [active, sharedValue]);
  const _ = () => ({
    opacity: sharedValue.get()
  });
  _.__closure = {
    opacity: sharedValue
  };
  _.__workletHash = 17406907036861;
  _.__initData = __initData;
  return <ReanimatedRexport.View style={[StyleSheet.absoluteFillObject, useAnimatedStyle(_)]} pointerEvents="none">
    <Module4611 style={StyleSheet.absoluteFillObject} colors={[`${BRAND_500}80`, `${BRAND_500}00`]} locations={[0, 1]} start={{
      x: 0.5,
      y: 1
    }} end={{
      x: 0.5,
      y: 0
    }} />
    <Module4611 style={StyleSheet.absoluteFillObject} colors={["rgba(0,0,0,0.4)", "rgba(0,0,0,0)"]} locations={[0, 0.5]} start={{
      x: 0.5,
      y: 1
    }} end={{
      x: 0.5,
      y: 0
    }} />
  </ReanimatedRexport.View>;
};