CubicBezier — Kuito Documentation

Usage

Ease a panel into place over a fixed duration.

This type is used by easing

tsx

// Ease a panel into place over a fixed duration.
import { Box, Button, VStack, easing, motion, timing } from 'kuito';

export function Panel() {
  const x = motion(0);
  return (
    <VStack>
      <Button onPress={() => (x.value = timing({ duration: 250, easing: easing.out }).to(120))}>
        Move
      </Button>
      <Box translateX={x} width={80} height={80} backgroundColor="#2563eb" />
    </VStack>
  );
}

Type declaration

export type CubicBezier = readonly [number, number, number, number];

Members 5

Name	Type	Required	Description
`0`	`number`	Yes	—
`1`	`number`	Yes	—
`2`	`number`	Yes	—
`3`	`number`	Yes	—
`length`	`4`	Yes	—

Generated from the public TypeScript declarations: signatures, props and defaults come from the checked source, descriptions from its JSDoc. No defaults are invented.