sequence

import { Box, Button, VStack, keyframes, motion, repeat, sequence, spring, timing } from 'kuito';

export function Pulse() {
  const scale = motion(1);

  return (
    <VStack gap={12}>
      <Box scale={scale} width={80} height={80} backgroundColor="#f97316" />
      <Button onPress={() => (scale.value = sequence(timing(120).to(1.2), spring().to(1)))}>
        Bump
      </Button>
      <Button onPress={() => (scale.value = repeat(keyframes({ 0: 1, 50: 1.1, 100: 1 }, 600)))}>
        Breathe
      </Button>
    </VStack>
  );
}