import React, { useEffect } from "react";
import Animated, { cancelAnimation, useAnimatedStyle, useSharedValue, withRepeat, withSequence, withTiming, } from "react-native-reanimated";
import { useColorScheme } from "nativewind";
import { cn } from "../utils/cn";
export const Skeleton = React.memo(function Skeleton({ className, ...props }) {
    const { colorScheme } = useColorScheme();
    const isDark = colorScheme === "dark";
    const opacity = useSharedValue(0.4);
    useEffect(() => {
        opacity.value = withRepeat(withSequence(withTiming(1, { duration: 750 }), withTiming(0.4, { duration: 750 })), -1);
        // Cancel the infinite repeat on unmount. Without this the worklet
        // keeps running until the shared value is GC'd, which in long
        // FlashList re-cycles (skeleton → loaded item → skeleton) leaves
        // orphan animations alive.
        return () => {
            cancelAnimation(opacity);
        };
    }, [opacity]);
    const animatedStyle = useAnimatedStyle(() => ({
        opacity: opacity.value,
    }));
    return (<Animated.View className={cn("rounded-md", isDark ? "bg-neutral-800" : "bg-neutral-200", className)} style={animatedStyle} {...props}/>);
});
//# sourceMappingURL=skeleton.jsx.map