// Metro module 4610 (f4611).
import { useContext, useState } from "react";
import { useButtonTextColorStyles } from "./ButtonHooks.native";
import Module689 from "../../../../_bundle/Module689";
import { AccessibilityPreferencesContext } from "../../../shared";
import * as _ReanimatedRexport from "../../../../modules/reanimated/ReanimatedRexport";
import ReanimatedRexport, { useAnimatedStyle } from "../../../../modules/reanimated/ReanimatedRexport";
import * as _timing from "../../../animation/reanimated/timing/timing";
import { createStyles } from "../../Styles/native/createStyles";
let __initData;
const useShineEffectStyles = function useShineEffectStyles(state, variant) {
  const backgroundColor = Module689(useButtonTextColorStyles(variant).color).alpha(0.1).hex();
  const enabled = useContext(AccessibilityPreferencesContext).reducedMotion.enabled;
  const r32 = function() {
    let r40;
    if (state == null) {
      r40 = {
        transform: [{
          translateX: -120
        }]
      };
    } else {
      const r4 = {
        transform: null
      };
      const r6 = {
        translateX: null
      };
      if (enabled) {
        r6.translateX = (state - 56) / 2;
        r4.transform = [r6];
        r40 = r4;
      } else {
        r6.translateX = _ReanimatedRexport.withRepeat(_ReanimatedRexport.withSequence(_timing.withTiming(-120, {
          duration: 0
        }, "animate-always"), _ReanimatedRexport.withDelay(750, _timing.withTiming(state + 120, {
          duration: 2000
        }, "animate-always"))), -1);
        r4.transform = [r6];
        r40 = r4;
      }
    }
    return r40;
  };
  r32.__closure = {
    width: state,
    SHINE_OFFSCREEN_OFFSET: 120,
    useReducedMotion: enabled,
    SHINE_WIDTH: 56,
    withRepeat: _ReanimatedRexport.withRepeat,
    withSequence: _ReanimatedRexport.withSequence,
    withTiming: _timing.withTiming,
    withDelay: _ReanimatedRexport.withDelay,
    SHINE_INITIAL_ANIMATION_DELAY: 750,
    SHINE_ANIMATION_DURATION: 2000
  };
  r32.__workletHash = 15814138938406;
  r32.__initData = __initData;
  const animatedStyle = useAnimatedStyle(r32);
  return {
    shineStyles: createStyles({
      shineContainer: {
        width: "100%",
        height: "200%",
        position: "absolute",
        overflow: "hidden"
      },
      shine: {
        width: 56,
        height: "500%",
        transform: [{
          rotate: "30deg"
        }],
        backgroundColor,
        top: "-100%",
        alignItems: "center"
      },
      shineInner: {
        width: 16,
        height: "100%",
        backgroundColor
      }
    })(),
    shineAnimatedStyle: animatedStyle
  };
};
__initData = {
  code: "function ButtonShineNativeTsx1(){const{width,SHINE_OFFSCREEN_OFFSET,useReducedMotion,SHINE_WIDTH,withRepeat,withSequence,withTiming,withDelay,SHINE_INITIAL_ANIMATION_DELAY,SHINE_ANIMATION_DURATION}=this.__closure;if(width==null){return{transform:[{translateX:-SHINE_OFFSCREEN_OFFSET}]};}if(useReducedMotion){const centerOffset=(width-SHINE_WIDTH)/2;return{transform:[{translateX:centerOffset}]};}return{transform:[{translateX:withRepeat(withSequence(withTiming(-SHINE_OFFSCREEN_OFFSET,{duration:0},'animate-always'),withDelay(SHINE_INITIAL_ANIMATION_DELAY,withTiming(width+SHINE_OFFSCREEN_OFFSET,{duration:SHINE_ANIMATION_DURATION},'animate-always'))),-1)}]};}"
};
export { useShineEffectStyles };
export function ButtonShine(props) {
  const variant = props.variant;
  const [state, setState] = useState(null);
  const styles = useShineEffectStyles(state, variant);
  const shineStyles = styles.shineStyles;
  return <ReanimatedRexport.View onLayout={(event) => setState(event.nativeEvent.layout.width)} style={[shineStyles.shineContainer, styles.shineAnimatedStyle]}>
    <ReanimatedRexport.View style={shineStyles.shine}>
      <ReanimatedRexport.View style={shineStyles.shineInner} />
    </ReanimatedRexport.View>
  </ReanimatedRexport.View>;
}