// Metro module 14062 (f14063).
import { useState } from "react";
import { StyleSheet, View } from "react-native";
import { createStyles } from "../../../../design/components/Styles/native/createStyles";
import Module712 from "../../../../_bundle/Module712";
import ReanimatedRexport, { useAnimatedStyle } from "../../../reanimated/ReanimatedRexport";
import * as _timing from "../../../../design/animation/reanimated/timing/timing";
import * as _timingPresets from "../../../../design/animation/reanimated/timing/timingPresets";
let __initData, __initData2;
const useStyles = createStyles(() => ({
  progressContainer: {
    height: 4
  },
  progressTrack: {
    ...StyleSheet.absoluteFillObject,
    borderRadius: Module712.radii.round,
    backgroundColor: Module712.colors.CONTROL_OVERLAY_SECONDARY_BACKGROUND_DEFAULT,
    opacity: 0.54
  },
  progressBar: {
    position: "absolute",
    height: "100%",
    left: 0,
    bottom: 0,
    borderRadius: Module712.radii.round,
    backgroundColor: Module712.unsafe_rawColors.GREEN_300,
    shadowOffset: {
      width: 0,
      height: 0
    },
    shadowRadius: 8,
    shadowOpacity: 1,
    elevation: 4,
    shadowColor: "#30C773"
  },
  progressBarGlowLayer: {
    position: "absolute",
    height: "100%",
    left: 0,
    bottom: 0,
    borderRadius: Module712.radii.round,
    backgroundColor: Module712.unsafe_rawColors.GREEN_300,
    shadowOffset: {
      width: 0,
      height: 0
    },
    shadowRadius: 12,
    shadowOpacity: 1,
    elevation: 8,
    shadowColor: Module712.unsafe_rawColors.GREEN_300
  }
}));
__initData = {
  code: "function BountiesModalProgressTsx1(){const{withTiming,visible,timingFast}=this.__closure;return{opacity:withTiming(visible?1:0,timingFast)};}"
};
__initData2 = {
  code: "function BountiesModalProgressTsx2(){const{withTiming,progress,shouldSkipAnimation,timingNone,timingFast}=this.__closure;return{width:withTiming(progress*100+\"%\",shouldSkipAnimation?timingNone:timingFast,'animate-always')};}"
};
export default function BountiesModalProgress(props) {
  const { progress, visible, style } = props;
  const styles = useStyles();
  const [state, setState] = useState(false);
  const [state2, setState2] = useState(progress);
  if (progress !== state2) {
    setState2(progress);
    setState(progress < state2);
  }
  const O = () => ({
    opacity: _timing.withTiming(visible ? 1 : 0, _timingPresets.timingFast)
  });
  O.__closure = {
    withTiming: _timing.withTiming,
    visible,
    timingFast: _timingPresets.timingFast
  };
  O.__workletHash = 5158131592262;
  O.__initData = __initData;
  const animatedStyle = useAnimatedStyle(O);
  const B = () => ({
    width: _timing.withTiming(100 * progress + "%", state ? _timingPresets.timingNone : _timingPresets.timingFast, "animate-always")
  });
  B.__closure = {
    withTiming: _timing.withTiming,
    progress,
    shouldSkipAnimation: state,
    timingNone: _timingPresets.timingNone,
    timingFast: _timingPresets.timingFast
  };
  B.__workletHash = 15586067343237;
  B.__initData = __initData2;
  const animatedStyle2 = useAnimatedStyle(B);
  return <ReanimatedRexport.View style={[styles.progressContainer, style, animatedStyle]}>
    <View style={styles.progressTrack} />
    <ReanimatedRexport.View style={[styles.progressBarGlowLayer, animatedStyle2]} />
    <ReanimatedRexport.View style={[styles.progressBar, animatedStyle2]} />
  </ReanimatedRexport.View>;
};
export const PROGRESS_BAR_HEIGHT = 4;