### Start Example App Packager

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/CONTRIBUTING.md

Starts the Metro server for the example application. This is necessary to run the example app on devices or simulators.

```sh
bun run example start
```

--------------------------------

### Run Example App on iOS

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/CONTRIBUTING.md

Builds and runs the example application on an iOS simulator or device.

```sh
bun run example ios
```

--------------------------------

### Install Prerequisites

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/getting-started.md

Install the required peer dependencies before installing the library. Use either npm or yarn.

```bash
npm install @shopify/skia react-native-reanimated react-native-worklets
# or
yarn add @shopify/skia react-native-reanimated react-native-worklets
```

--------------------------------

### Run Example App on Android

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/CONTRIBUTING.md

Builds and runs the example application on an Android device or emulator.

```sh
bun run example android
```

--------------------------------

### Install react-native-fast-confetti

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/getting-started.md

Install the main library using npm or yarn.

```bash
npm install react-native-fast-confetti
# or
yarn add react-native-fast-confetti
```

--------------------------------

### Install react-native-fast-confetti

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/README.md

Install the library using Yarn. Ensure react-native-reanimated, @shopify/react-native-skia, and react-native-worklets are installed first.

```sh
yarn add react-native-fast-confetti
```

--------------------------------

### Install Project Dependencies

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/CONTRIBUTING.md

Installs all required dependencies for the monorepo using Bun workspaces. This command must be run in the root directory.

```sh
bun install
```

--------------------------------

### PIConfetti Restart Example

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/types.md

Demonstrates how to use the restart method with dynamic origin options for PIConfetti, including named positions and explicit coordinates.

```typescript
confettiRef.current?.restart({
  origins: [
    { blastPosition: 'center', delay: 0 },
    { blastPosition: { x: 100, y: 200 }, delay: 100 },
  ]
});
```

--------------------------------

### CannonConfetti Restart Example

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/types.md

Illustrates restarting CannonConfetti with dynamic origins and targets, using both explicit coordinates and potentially named positions.

```typescript
cannonRef.current?.restart({
  origins: [
    { x: 50, y: 600 },
    { x: 350, y: 600 },
  ],
  targets: [
    { x: 200, y: 100 },
    { x: 200, y: 100 },
  ]
});
```

--------------------------------

### Basic PIConfetti Usage Example

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/pi-confetti-component.md

Demonstrates how to use the PIConfetti component with basic configuration, including setting gravity, colors, and origins. It also shows how to trigger the 'restart' method using a ref.

```typescript
import { useRef } from 'react';
import { PIConfetti, PIConfettiMethods } from 'react-native-fast-confetti';

export function BurstConfetti() {
  const confettiRef = useRef<PIConfettiMethods>(null);

  return (
    <>
      <PIConfetti
        ref={confettiRef}
        autoplay
        gravity={3.0}
        colors={['#FF5733', '#33FF57', '#3357FF']}
      >
        <PIConfetti.Origin blastPosition="center" count={200}>
          <PIConfetti.Flake size={12} />
        </PIConfetti.Origin>
      </PIConfetti>

      <button onPress={() => confettiRef.current?.restart()}>
        Burst Again
      </button>
    </>
  );
}
```

--------------------------------

### PIConfetti Component Example

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/API-index.md

Create confetti bursts from origin points using PIConfetti. Configure gravity, drag, and origin properties for precise control.

```typescript
<PIConfetti
  ref={ref}
  autoplay={true}
  gravity={3.0}
  drag={3.0}  // or { horizontal: 3, vertical: 3 }
  infinite={false}
  fadeOutOnEnd={false}
  autoStartDelay={0}
  colors={['#FF5733']}
  sprayDuration={undefined}
  initialScale={0.3}
  flipIntensity={0.85}
  flakeStyle="glossy"
  onAnimationStart={() => {}}
  onAnimationEnd={() => {}}
  containerStyle={{}}
  rotation={{ x: {...}, z: {...} }}
  depth={{ min: 1, max: 1.1 }}
  speedVariation={{ min: 0, max: 1 }}
  easing={Easing.linear}
  image={skiaImage}
  svg={skiaSvg}
>
  <PIConfetti.Origin
    blastPosition="center"
    count={200}
    initialSpeed={1}
    spread={2 * Math.PI}
    speedVariation={{ min: 0, max: 1 }}
    colors={['#FF0000']}
    rotation={{ x: {...}, z: {...} }}
    depth={{ min: 1, max: 1.1 }}
    flakeStyle="solid"
    delay={0}
  >
    <PIConfetti.Flake size={12} />
  </PIConfetti.Origin>
</PIConfetti>
```

--------------------------------

### ContinuousConfetti for Snow Simulation

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/continuous-confetti-component.md

Shows how to simulate a snow effect using ContinuousConfetti by providing a custom SVG for the flakes and adjusting gravity and drift. This example requires an SVG file and the Skia library.

```typescript
import { useSVG } from '@shopify/react-native-skia';

export function SnowEffect() {
  const snowflakeSvg = useSVG(require('./snowflake.svg'));

  return (
    <ContinuousConfetti
      autoplay
      count={80}
      gravity={0.3}
      drift={0.5}
      svg={snowflakeSvg}
    >
      <ContinuousConfetti.Flake size={20} />
    </ContinuousConfetti>
  );
}
```

--------------------------------

### ContinuousConfetti Component Example

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/API-index.md

Implement a seamless infinite confetti stream using the ContinuousConfetti component. Customize properties like count, colors, and spacing.

```typescript
<ContinuousConfetti
  ref={ref}
  autoplay={true}
  count={100}
  colors={['#FF5733']}
  gravity={1.0}
  wobble={{ min: 0.03, max: 0.08 }}
  drift={0.7}
  verticalSpacing={200}  // Defaults to 200
  flakeStyle="glossy"
  autoStartDelay={0}
  initialScale={0.3}
  flipIntensity={0.85}
  onAnimationStart={() => {}}
  containerStyle={{}}
  rotation={{ x: {...}, z: {...} }}
  depth={{ min: 0.8, max: 1.0 }}
  easing={Easing.linear}
  image={skiaImage}
  svg={skiaSvg}
>
  <ContinuousConfetti.Flake size={12} />
</ContinuousConfetti>
```

--------------------------------

### Basic Confetti Component Usage

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/README.md

Demonstrates the basic setup for the Confetti component, including how to render different flake sizes. Ensure the Confetti component is imported from 'react-native-fast-confetti'.

```typescript
import { Confetti } from 'react-native-fast-confetti';

function CelebrationScreen() {
  return (
    <Confetti autoplay>
      <Confetti.Flake size={12} radius={6} />
      <Confetti.Flake width={8} height={14} />
    </Confetti>
  );
}
```

--------------------------------

### Basic Animation Control

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/README.md

Control confetti animation playback and timing. Use `autoplay` to start on mount and `infinite` to loop. `autoStartDelay` can be used to postpone the start.

```typescript
<Confetti
  autoplay={true}          // Start on mount
  infinite={false}         // Loop after end
  autoStartDelay={0}       // Delay before start
  onAnimationStart={() => {}}
  onAnimationEnd={() => {}}
/>
```

--------------------------------

### Confetti Component Example

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/API-index.md

Use the Confetti component for falling confetti from the top of the screen. Configure properties like count, colors, and animation behavior.

```typescript
<Confetti
  ref={ref}
  autoplay={true}
  count={200}
  colors={['#FF5733', '#33FF57']}
  gravity={1.0}
  wobble={{ min: 0.03, max: 0.08 }}
  drift={0.7}
  verticalSpacing={70}
  flakeStyle="glossy"
  fadeOutOnEnd={false}
  infinite={false}
  autoStartDelay={0}
  initialScale={0.3}
  flipIntensity={0.85}
  onAnimationStart={() => {}}
  onAnimationEnd={() => {}}
  containerStyle={{}}
  rotation={{ x: {...}, z: {...} }}
  depth={{ min: 0.8, max: 1.0 }}
  easing={Easing.linear}
  image={skiaImage}
  svg={skiaSvg}
>
  <Confetti.Flake size={12} radius={6} />
  <Confetti.Flake width={8} height={14} />
</Confetti>
```

--------------------------------

### CannonConfetti Component Example

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/API-index.md

Utilize CannonConfetti for aimed confetti firing. Define target, spray duration, and origin properties for dynamic effects.

```typescript
<CannonConfetti
  ref={ref}
  autoplay={true}
  gravity={3.0}
  drag={3.0}  // or { horizontal: 3, vertical: 3 }
  infinite={false}
  fadeOutOnEnd={false}
  autoStartDelay={0}
  target="center"  // or { x: 250, y: 300 }
  colors={['#FF5733']}
  sprayDuration={300}
  initialScale={0.3}
  flipIntensity={0.85}
  flakeStyle="glossy"
  onAnimationStart={() => {}}
  onAnimationEnd={() => {}}
  containerStyle={{}}
  rotation={{ x: {...}, z: {...} }}
  depth={{ min: 1, max: 1.1 }}
  speedVariation={{ min: 0.8, max: 1.2 }}
  easing={Easing.linear}
  image={skiaImage}
  svg={skiaSvg}
>
  <CannonConfetti.Origin
    position="bottom-left"
    count={150}
    initialSpeed={2.0}
    spread={Math.PI / 5}
    target="top-right"  // or { x: 250, y: 100 }
    speedVariation={{ min: 0.8, max: 1.2 }}
    colors={['#FF0000']}
    rotation={{ x: {...}, z: {...} }}
    depth={{ min: 1, max: 1.1 }}
    flakeStyle="glossy"
  >
    <CannonConfetti.Flake size={12} />
  </CannonConfetti.Origin>
</CannonConfetti>
```

--------------------------------

### Confetti.Flake Child Component Example

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/API-index.md

Customize individual confetti flakes using the Confetti.Flake component. Define size, dimensions, style, and colors for each flake.

```typescript
<Confetti>
  <Confetti.Flake
    size={12}              // or width + height
    width={8}
    height={14}
    radius={6}
    flakeStyle="glossy"
    colors={['#FF0000']}
    image={skiaImage}
    svg={skiaSvg}
  />
</Confetti>
```

--------------------------------

### CannonConfetti.Origin with Per-Origin Style Customization

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/cannon-confetti-component.md

Shows how to customize the appearance of confetti from a specific origin. This example sets custom colors and flake style ('solid') for the origin.

```typescript
// Per-origin style customization
<CannonConfetti.Origin
  position="bottom-center"
  count={120}
  colors={['#FF0000', '#00FF00']}
  flakeStyle="solid"
>
  <CannonConfetti.Flake size={8} />
</CannonConfetti.Origin>
```

--------------------------------

### CannonConfetti.Origin with Named Position and Target

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/cannon-confetti-component.md

Example of using CannonConfetti.Origin with a named position ('bottom-left') and a named target ('top-right'). Configures count, initial speed, and flake size.

```typescript
// Named position firing at named target
<CannonConfetti.Origin
  position="bottom-left"
  target="top-right"
  count={150}
  initialSpeed={2.5}
>
  <CannonConfetti.Flake size={12} />
</CannonConfetti.Origin>
```

--------------------------------

### Multiple Size Variants

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/README.md

Configure confetti to use multiple flake sizes simultaneously. This example shows how to include `Confetti.Flake` components with different `size` props within a single `Confetti` container.

```typescript
<Confetti>
  <Confetti.Flake size={8} />
  <Confetti.Flake size={12} />
  <Confetti.Flake size={16} />
</Confetti>
```

--------------------------------

### Manage Animation State and Timing

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/hooks-and-utilities.md

Internal hook for managing animation state, progress, and opacity. Use to control animation lifecycle, including starting, pausing, resetting, and resuming.

```typescript
function useAnimationLifecycle(options: {
  duration: number;
  infinite: boolean;
  fadeOutOnEnd: boolean;
  easing: EasingFunction | EasingFunctionFactory;
  onAnimationStart?: () => void;
  onAnimationEnd?: () => void;
  fadeRange?: [number, number];
  onCycleEnd?: () => void;
}): {
  progress: Animated.SharedValue<number>;
  running: Animated.SharedValue<boolean>;
  opacity: Animated.SharedValue<number>;
  pause: () => void;
  reset: () => void;
  resume: () => void;
  runAnimation: (delay: number) => void;
}
```

--------------------------------

### Required Peer Dependencies

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/configuration.md

These are the essential peer dependencies required by react-native-fast-confetti. Ensure these are installed in your project.

```typescript
{
  "@shopify/react-native-skia": "*",
  "react": "*",
  "react-native": "*",
  "react-native-reanimated": "*",
  "react-native-worklets": "*"
}
```

--------------------------------

### Run Kitchen-Sink App on Web

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/CONTRIBUTING.md

Builds and runs the kitchen-sink application in a web browser.

```sh
bun run kitchen-sink web
```

--------------------------------

### Basic ContinuousConfetti Usage

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/continuous-confetti-component.md

Demonstrates how to use the ContinuousConfetti component with basic autoplay, count, and color configurations. It also shows how to include custom Flake components.

```typescript
import { useRef } from 'react';
import { ContinuousConfetti, ConfettiMethods } from 'react-native-fast-confetti';

export function StreamingConfetti() {
  const confettiRef = useRef<ConfettiMethods>(null);

  return (
    <ContinuousConfetti
      ref={confettiRef}
      autoplay
      count={100}
      gravity={0.8}
      colors={['#FF5733', '#33FF57', '#3357FF', '#F5FF33']}
    >
      <ContinuousConfetti.Flake size={12} radius={6} />
      <ContinuousConfetti.Flake width={8} height={14} />
    </ContinuousConfetti>
  );
}
```

--------------------------------

### PIConfettiRestartOptions

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/types.md

Options object for PIConfetti.restart() to dynamically override origin configuration. Allows specifying blast positions and delays for custom restart behavior.

```APIDOC
## PIConfettiRestartOptions

### Description
Options object for `PIConfetti.restart()` to dynamically override origin configuration.

### Properties
- `origins` (Array) - Required - Array of origin definitions with position and optional delay.

### Example
```typescript
confettiRef.current?.restart({
  origins: [
    { blastPosition: 'center', delay: 0 },
    { blastPosition: { x: 100, y: 200 }, delay: 100 },
  ]
});
```
```

--------------------------------

### Lint Project Files

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/CONTRIBUTING.md

Checks the code for style and potential errors using ESLint.

```sh
bun run lint
```

--------------------------------

### Basic Confetti Usage with Ref

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/README.md

Demonstrates basic confetti usage with a ref to control playback. The `useRef` hook is used to access confetti methods like `restart` from a button press.

```typescript
const ref = useRef<ConfettiMethods>(null);

return (
  <>
    <Confetti ref={ref} autoplay={false}>
      <Confetti.Flake size={12} />
    </Confetti>
    <button onPress={() => ref.current?.restart()}>Celebrate!</button>
  </>
);
```

--------------------------------

### Run Unit Tests

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/CONTRIBUTING.md

Executes all unit tests defined in the project using Jest.

```sh
bun run test
```

--------------------------------

### PIConfettiMethods

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/types.md

Control methods exposed via ref for PIConfetti. Supports options for dynamic position override, allowing for more flexible animation control.

```APIDOC
## PIConfettiMethods

### Description
Control methods exposed via ref for `PIConfetti`. Supports options for dynamic position override.

### Methods
- `restart(options?)`: Restart with optional origin override.
- `pause()`: Pause animation at current state.
- `resume()`: Resume from pause.
- `reset()`: Stop and clear animation.
```

--------------------------------

### Publish New Versions

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/CONTRIBUTING.md

Publishes new versions of the package to npm using release-it. This command handles version bumping, tagging, and release creation.

```sh
bun run release
```

--------------------------------

### Type Check Project Files

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/CONTRIBUTING.md

Verifies that all project files adhere to TypeScript type definitions.

```sh
bun run typecheck
```

--------------------------------

### useCannonOrigins

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/hooks-and-utilities.md

Parses `<CannonConfetti.Origin>` children and builds configuration for cannon confetti.

```APIDOC
## useCannonOrigins

### Description
Parses `<CannonConfetti.Origin>` children and builds configuration.

### Parameters
* `options` (object) - Required
  * `children` (React.ReactNode) - Required
  * `rootColors` (string[] | undefined) - Optional
  * `rootRotation` (Rotation | undefined) - Optional
  * `rootDepth` (Range | undefined) - Optional
  * `rootSpeedVariation` (Range | undefined) - Optional
  * `rootTarget` (NamedPosition | Position | undefined) - Optional
  * `rootFlakeStyle` (FlakeStyle) - Required
  * `containerWidth` (number) - Required
  * `containerHeight` (number) - Required
  * `parentTexture` (FlakeTexture) - Required

### Returns
* `cannonsPositions` (Position[])
* `cannonConfigs` (CannonConfig[])
* `allColors` (string[])
* `sizeVariations` (FlakeSize[])
* `colorOverrides` (ColorRange | null[])
* `sizeIsTextured` (boolean[])
* `parentColorCount` (number)
* `totalCount` (number)
```

--------------------------------

### Basic Confetti Usage

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/confetti-component.md

Demonstrates how to use the Confetti component with basic props like count, gravity, and custom colors. Includes usage of Confetti.Flake for defining size variants and controlling the animation via a ref.

```typescript
import { useRef } from 'react';
import { Confetti, ConfettiMethods } from 'react-native-fast-confetti';

export function ConfettiDemo() {
  const confettiRef = useRef<ConfettiMethods>(null);

  return (
    <>
      <Confetti
        ref={confettiRef}
        autoplay
        count={150}
        gravity={1.0}
        colors={['#FF5733', '#33FF57', '#3357FF']}
      >
        <Confetti.Flake size={12} radius={6} />
        <Confetti.Flake width={8} height={14} />
      </Confetti>

      <button onPress={() => confettiRef.current?.restart()}>
        Restart
      </button>
    </>
  );
}
```

--------------------------------

### Snow Simulation Physics

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/configuration.md

Simulate snow by using low 'gravity', moderate 'drift', a narrow 'wobble' range, and increased 'verticalSpacing'.

```typescript
<ContinuousConfetti
  count={50}
  gravity={0.2}
  drift={0.4}
  wobble={{ min: 0.08, max: 0.12 }}
  verticalSpacing={300}
/>
```

--------------------------------

### Controlling Confetti Animation with Refs

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/README.md

Use `useRef` to get a reference to the Confetti component and call methods like `restart`, `pause`, `resume`, and `reset` programmatically. Ensure the ref is correctly typed to `ConfettiMethods`.

```tsx
import { useRef } from 'react';
import { Confetti, ConfettiMethods } from 'react-native-fast-confetti';

const ref = useRef<ConfettiMethods>(null);

<Confetti ref={ref} autoplay={false}>
  <Confetti.Flake size={12} />
</Confetti>;

// Then trigger manually:
ref.current?.restart();
ref.current?.pause();
ref.current?.resume();
ref.current?.reset();
```

--------------------------------

### Appearance Customization

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/README.md

Customize the visual appearance of confetti pieces. `count` sets the number of pieces, `colors` defines the color palette, `flakeStyle` affects the finish (e.g., 'glossy'), `initialScale` adjusts starting size, and `flipIntensity` controls visual flipping.

```typescript
<Confetti
  count={200}
  colors={['#FF5733', '#33FF57']}
  flakeStyle="glossy"
  initialScale={0.3}
  flipIntensity={0.85}
>
  <Confetti.Flake size={12} radius={6} />
</Confetti>
```

--------------------------------

### File Structure of react-native-fast-confetti

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/README.md

This snippet shows the directory and file structure of the library's source code. It helps understand the organization of components, utilities, and type definitions.

```tree
src/
├── Confetti.tsx                 # Falling confetti component
├── ContinuousConfetti.tsx       # Infinite stream wrapper
├── PIConfetti.tsx               # Burst confetti component
├── CannonConfetti.tsx           # Cannon confetti component
├── ConfettiCanvas.tsx           # Skia rendering component
├── FlakeComponent.tsx           # Flake child component
├── PIConfettiComponents.tsx     # PI origin and flake
├── CannonConfettiComponents.tsx # Cannon origin and flake
├── types.ts                     # All type definitions
├── constants.ts                 # Default constants
├── utils.ts                     # Physics and utility functions
├── physics.ts                   # ODE integration
├── index.tsx                    # Entry point exports
└── hooks/
    ├── useAnimationLifecycle.ts
    ├── useContainerDimensions.ts
    ├── useConfettiFlakes.ts
    ├── useConfettiLogic.tsx
    ├── useTextureProps.ts
    ├── usePIOrigins.ts
    └── useCannonOrigins.ts
```

--------------------------------

### integrateTrajectory

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/hooks-and-utilities.md

Integrates physics ODE for confetti trajectory, returning sample points for a lookup table. The physics model couples translational motion with rotational tumble to create realistic wobbling motion with drift.

```APIDOC
## integrateTrajectory

### Description
Integrates physics ODE for confetti trajectory. Returns sample points for lookup table.

The physics model couples translational motion (x, y) with rotational tumble (θ) to create realistic wobbling motion with drift.

### Source
`src/physics.ts`

### Signature
```typescript
export function integrateTrajectory(options: {
  gravity: number;
  wobble: Range;
  drift: number;
  spawnX: number;
  spawnY: number;
  totalTimeSec: number;
  depth: number;
  containerHeight: number;
  containerWidth: number;
}): {
  x: number;
  y: number;
  tumbleAngle: number;
}[];
```

### Parameters
#### Options Object
- **gravity** (number) - Description not provided.
- **wobble** (Range) - Description not provided.
- **drift** (number) - Description not provided.
- **spawnX** (number) - Description not provided.
- **spawnY** (number) - Description not provided.
- **totalTimeSec** (number) - Description not provided.
- **depth** (number) - Description not provided.
- **containerHeight** (number) - Description not provided.
- **containerWidth** (number) - Description not provided.

### Returns
An array of objects, where each object represents a point in the trajectory with `x`, `y` coordinates and `tumbleAngle`.
```

--------------------------------

### Dynamic Positioning with `PIConfettiMethods`

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/README.md

Dynamically update confetti origins using the `restart` method from `PIConfettiMethods`. This allows changing the blast positions and delays at runtime.

```typescript
const ref = useRef<PIConfettiMethods>(null);

ref.current?.restart({
  origins: [
    { blastPosition: { x: 100, y: 200 }, delay: 0 },
    { blastPosition: { x: 300, y: 200 }, delay: 100 },
  ]
});
```

--------------------------------

### PIConfetti Physics (Burst) Duration Estimation

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/physics-model.md

Estimates the total animation duration for PIConfetti, considering the maximum flight time of individual pieces, origin delays, and spray duration.

```plaintext
flightDuration = max(apexTime + fallTime) × 1.2  // Per-origin max
totalDuration = flightDuration + maxOriginDelay + sprayDuration
```

--------------------------------

### Optimizing Confetti Performance with Piece Count

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/getting-started.md

Adjust the 'count' prop to manage the number of confetti pieces for optimal performance. Lower counts (100-300) are recommended for smooth 60fps on modern devices.

```typescript
// Tune for your target device
<Confetti count={150} />  // Conservative
<Confetti count={300} />  // Modern phones
```

--------------------------------

### CannonConfetti.Origin with Explicit Coordinates and Spread

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/cannon-confetti-component.md

Demonstrates using CannonConfetti.Origin with explicit X and Y coordinates for position and target. Includes configuration for count, spread, and initial speed.

```typescript
// Explicit coordinates with spread control
<CannonConfetti.Origin
  position={{ x: 100, y: 500 }}
  target={{ x: 250, y: 250 }}
  count={200}
  spread={Math.PI / 3}
  initialSpeed={3.0}
>
  <CannonConfetti.Flake size={10} />
</CannonConfetti.Origin>
```

--------------------------------

### Image Texture Flake

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/configuration.md

Use an image texture for flakes by providing a Skia bitmap image to the 'image' prop. Ensure the image is loaded using a hook like 'useImage'.

```typescript
const image = useImage(require('./custom.png'));
<Confetti.Flake size={50} image={image} />
```

--------------------------------

### CannonConfettiMethods

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/types.md

Control methods exposed via ref for CannonConfetti. Supports options for dynamic position and target override, providing fine-grained control over cannon behavior.

```APIDOC
## CannonConfettiMethods

### Description
Control methods exposed via ref for `CannonConfetti`. Supports options for dynamic position and target override.

### Methods
- `restart(options?)`: Restart with optional position and target override.
- `pause()`: Pause animation at current state.
- `resume()`: Resume from pause.
- `reset()`: Stop and clear animation.
```

--------------------------------

### Basic Cannon Confetti Usage

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/cannon-confetti-component.md

Demonstrates how to use the CannonConfetti component with autoplay, gravity, target, and custom colors. Includes origins with specific flake sizes and counts. Allows restarting the confetti animation via a button.

```typescript
import { useRef } from 'react';
import { CannonConfetti, CannonConfettiMethods } from 'react-native-fast-confetti';

export function CannonDemo() {
  const cannonRef = useRef<CannonConfettiMethods>(null);

  return (
    <>
      <CannonConfetti
        ref={cannonRef}
        autoplay
        gravity={3}
        target="center"
        colors={['#FF5733', '#33FF57', '#3357FF']}
      >
        <CannonConfetti.Origin position="bottom-left" count={150} initialSpeed={3}>
          <CannonConfetti.Flake size={12} radius={6} />
        </CannonConfetti.Origin>

        <CannonConfetti.Origin position="bottom-right" count={150} initialSpeed={3}>
          <CannonConfetti.Flake size={12} />
        </CannonConfetti.Origin>
      </CannonConfetti>

      <button onPress={() => cannonRef.current?.restart()}>
        Fire Again
      </button>
    </>
  );
}
```

--------------------------------

### Build Skia Rendering Resources

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/hooks-and-utilities.md

Builds Skia rendering resources, including a texture atlas and sprite definitions, based on flake configurations. This hook is central to the confetti physics and rendering.

```typescript
function useConfettiLogic(options: {
  sizeVariations: FlakeSize[];
  colors: string[];
  boxes: Animated.SharedValue<FallingBox[]>;
  sizeColorOverrides: (ColorRange | null)[];
  count: number;
}): {
  texture: SkImage;
  sprites: Record<string, SkRRect>;
}
```

--------------------------------

### <PIConfetti.Origin /> Props

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/README.md

Props for the `<PIConfetti.Origin />` component to define specific burst origins and their properties.

```APIDOC
## `<PIConfetti.Origin />` Props

### Description
Props for the `<PIConfetti.Origin />` component to define specific burst origins and their properties.

### Parameters
#### Props
- **blastPosition** ({ x: number, y: number } | string) - Required - Where the burst originates. Named position or `{ x, y }`.
- **count** (number) - Optional - Number of pieces from this origin.
- **initialSpeed** (number) - Optional - Launch speed.
- **spread** (number) - Optional - Launch cone width (radians).
- **speedVariation** ({ min: number, max: number }) - Optional - Per-piece speed multiplier range.
- **colors** (Array<string>) - Optional - Colors for this origin (overrides root).
- **flakeStyle** (string) - Optional - Style for this origin (overrides root).
- **rotation** (any) - Optional - Rotation for this origin (overrides root).
- **depth** ({ min: number, max: number }) - Optional - Depth for this origin (overrides root).
```

--------------------------------

### Configuring Confetti Container Size and Style

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/getting-started.md

Override the default screen dimensions for confetti with explicit width, height, and background color using containerStyle. Physics calculations will adapt to the specified container size.

```typescript
<Confetti
  autoplay
  containerStyle={{
    width: 300,
    height: 400,
    backgroundColor: '#E8E8E8',
  }}
>
  <Confetti.Flake size={12} />
</Confetti>
```

--------------------------------

### PIConfetti.Origin Component

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/pi-confetti-component.md

Defines a confetti origin point for PI burst animation. It allows customization of blast position, count, speed, spread, colors, flake style, rotation, depth, and children flakes. It also supports a delay before firing.

```APIDOC
## PIConfetti.Origin Component

### Description
Defines a confetti origin point for PI burst animation. It allows customization of blast position, count, speed, spread, colors, flake style, rotation, depth, and children flakes. It also supports a delay before firing.

### Props

- **blastPosition** (NamedPosition | Position) - Required - Where the burst originates. Use named position string or explicit `{x, y}` coordinates.
- **count** (number) - Optional - Default: 100 - Number of pieces from this origin.
- **initialSpeed** (number) - Optional - Default: 1 - Launch speed. Normalized to container height.
- **spread** (number) - Optional - Default: 2π - Launch cone width in radians. Full circle = 2π.
- **speedVariation** (Range) - Optional - Default: `{ min: 0.0, max: 1.0 }` - Per-piece speed multiplier range. Overrides root default.
- **colors** (string[]) - Optional - Default: undefined - Colors for this origin. Overrides root colors if provided.
- **flakeStyle** (FlakeStyle) - Optional - Default: undefined - Flake style for this origin. Overrides root default if provided.
- **rotation** (Rotation) - Optional - Default: undefined - Rotation config for this origin. Overrides root default if provided.
- **depth** (Range) - Optional - Default: `{ min: 1, max: 1.1 }` - Depth range for this origin. Overrides root default if provided.
- **children** (React.ReactNode) - Optional - Default: undefined - `<PIConfetti.Flake>` children defining size variants.
- **delay** (number) - Optional - Default: 0 - Delay in milliseconds before this origin fires (applied after root `autoStartDelay`).

### Named Positions

- `'bottom-left'`
- `'bottom-right'`
- `'bottom-center'`
- `'top-left'`
- `'top-right'`
- `'top-center'`
- `'center-left'`
- `'center-right'`
- `'center'

### Usage Examples

```typescript
// Named position
<PIConfetti.Origin blastPosition="bottom-center" count={150}>
  <PIConfetti.Flake size={12} />
</PIConfetti.Origin>

// Explicit coordinates
<PIConfetti.Origin blastPosition={{ x: 250, y: 500 }} count={100}>
  <PIConfetti.Flake size={10} />
</PIConfetti.Origin>

// Per-origin customization
<PIConfetti.Origin
  blastPosition="center"
  count={200}
  initialSpeed={2.0}
  spread={Math.PI}
  colors={['#FF0000', '#00FF00']}
  delay={200}
>
  <PIConfetti.Flake size={12} colors={['#FF0000', '#00FF00']} />
</PIConfetti.Origin>
```
```

--------------------------------

### PIConfetti.Origin

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/API-index.md

Configures the origin point for PIConfetti effects. Allows customization of blast position, count, speed, spread, colors, flake style, rotation, and depth.

```APIDOC
## PIConfetti.Origin

### Description
Configures the origin point for PIConfetti effects. Allows customization of blast position, count, speed, spread, colors, flake style, rotation, and depth.

### Props

- **blastPosition** (string | { x: number, y: number }) - The position from which confetti will blast. Can be a named position like 'center' or an object with x and y coordinates.
- **count** (number) - The total number of confetti pieces to emit.
- **initialSpeed** (number) - The initial speed of the confetti pieces.
- **spread** (number) - The angle (in radians) over which the confetti will spread.
- **speedVariation** ({ min: number, max: number }) - The variation in speed for individual confetti pieces.
- **colors** (string[]) - An array of colors for the confetti.
- **flakeStyle** (string) - The style of the confetti flakes (e.g., 'glossy').
- **rotation** ({ x?: { min: number, max: number }, z?: { min: number, max: number } }) - The rotation properties for the confetti flakes.
- **depth** ({ min: number, max: number }) - The depth properties for the confetti flakes.
- **delay** (number) - The delay in milliseconds before the confetti starts.

### Children

- **PIConfetti.Flake** - Represents individual confetti flakes with customizable size.
```

--------------------------------

### ContinuousConfetti with Custom Spacing

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/continuous-confetti-component.md

Illustrates using ContinuousConfetti with a denser confetti configuration by adjusting the verticalSpacing prop. This allows for a more concentrated visual effect.

```typescript
<ContinuousConfetti
  autoplay
  count={150}
  verticalSpacing={150} // Denser confetti than default
  colors={['#FF0000', '#00FF00', '#0000FF']}
>
  <ContinuousConfetti.Flake size={10} />
</ContinuousConfetti>
```

--------------------------------

### <PIConfetti /> Props

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/README.md

Props for the main `<PIConfetti />` component to control the overall animation behavior and appearance.

```APIDOC
## `<PIConfetti />` Props

### Description
Props for the main `<PIConfetti />` component to control the overall animation behavior and appearance.

### Parameters
#### Props
- **autoplay** (boolean) - Optional - Play animation on mount.
- **autoStartDelay** (number) - Optional - Delay (ms) before autoplay.
- **infinite** (boolean) - Optional - Loop the animation.
- **gravity** (number) - Optional - Gravity strength.
- **colors** (Array<string>) - Optional - Default colors for all origins.
- **flakeStyle** (string) - Optional - Default 'solid' or 'glossy' for origins.
- **fadeOutOnEnd** (boolean) - Optional - Fade pieces as they exit.
- **image** (any) - Optional - Default Skia image texture for all flakes.
- **svg** (any) - Optional - Default Skia SVG texture for all flakes.
- **onAnimationStart** (function) - Optional - Called when animation starts.
- **onAnimationEnd** (function) - Optional - Called when animation ends.
- **drag** (number | { horizontal: number, vertical: number }) - Optional - Air resistance.
- **sprayDuration** (number) - Optional - Stagger pieces over N ms.
- **speedVariation** ({ min: number, max: number }) - Optional - Default speed variation for origins.
- **easing** (function) - Optional - Custom easing for the animation progress.
- **flipIntensity** (number) - Optional - How dramatically pieces flip (0-1). Lower = flatter.
- **rotation** (any) - Optional - Default rotation config for origins.
- **depth** ({ min: number, max: number }) - Optional - Default depth range for origins.
- **initialScale** (number) - Optional - Scale at spawn before growing.
- **containerStyle** (any) - Optional - Style for the container. Supports any sizing (numeric, %, flex).
```

--------------------------------

### Confetti Physics (Falling) Duration Estimation

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/physics-model.md

Estimates the animation duration for falling confetti based on container height, gravity, and wobble margin. The wobble margin accounts for energy coupling from rotation to translation.

```plaintext
duration = height / (gravity × wobbleMargin)
wobbleMargin = 1.2 + 0.5 × maxWobble
```

--------------------------------

### Available Confetti Methods

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/getting-started.md

Reference for controlling confetti animations: restart, pause, resume, and reset.

```typescript
// Restart from beginning (regenerates random positions)
confettiRef.current?.restart();

// Pause at current animation state
confettiRef.current?.pause();

// Resume from pause
confettiRef.current?.resume();

// Stop and clear animation
confettiRef.current?.reset();
```

--------------------------------

### Import Core Components and Types

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/API-index.md

Import all necessary components and types from the react-native-fast-confetti library.

```typescript
import {
  Confetti,
  ContinuousConfetti,
  PIConfetti,
  CannonConfetti,
  // Types
  ConfettiProps,
  ConfettiMethods,
  PIConfettiProps,
  PIConfettiMethods,
  CannonConfettiProps,
  CannonConfettiMethods,
  ContinuousConfettiProps,
  NamedPosition,
  Position,
  Range,
  Rotation,
  Drag,
  FlakeStyle,
  FlakeProps,
  PIOriginProps,
  CannonOriginProps,
} from 'react-native-fast-confetti';
```

--------------------------------

### CannonConfetti Physics (Ballistic) Duration Estimation

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/physics-model.md

Estimates the total duration for CannonConfetti animations, considering the maximum flight time across all cannons and the spray duration, adjusted for launch delay.

```plaintext
maxFlightTime = max(apexTime + fallTime) over all cannons
duration = maxFlightTime + sprayDuration / (1 - DEFAULT_LAUNCH_DELAY_MAX)
```

--------------------------------

### Tuning Confetti Density with Vertical Spacing

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/getting-started.md

Control the density of the confetti spawn grid using the 'verticalSpacing' prop. Smaller values create a denser grid, while larger values result in sparser distribution.

```typescript
<Confetti verticalSpacing={50} count={300} />   // Dense
<Confetti verticalSpacing={150} count={200} />  // Sparse
```

--------------------------------

### CannonConfetti Methods

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/cannon-confetti-component.md

The CannonConfetti component exposes methods through its ref, allowing programmatic control over the confetti effect, such as restarting the animation.

```APIDOC
## CannonConfetti Methods

### Description

Methods available on the `CannonConfetti` component instance, accessible via a ref, allow for imperative control over the confetti animation.

### Methods

- **restart(options?: RestartOptions)**: Restarts the confetti animation. Accepts an optional `RestartOptions` object to override properties like `origins` and `targets` for the new animation.

### Usage Example

```typescript
const cannonRef = useRef<CannonConfettiMethods>(null);

// To restart the confetti:
cannonRef.current?.restart();

// To restart with custom origins and targets:
cannonRef.current?.restart({
  origins: [
    { x: 50, y: 600 },
    { x: 350, y: 600 },
  ],
  targets: [
    { x: 200, y: 200 },
    { x: 200, y: 200 },
  ]
});
```
```

--------------------------------

### PIConfetti Methods Interface

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/pi-confetti-component.md

Defines the interface for methods available on the PIConfetti component instance via a ref, allowing programmatic control over the animation.

```typescript
interface PIConfettiMethods {
  restart(options?: PIConfettiRestartOptions): void;
  pause(): void;
  resume(): void;
  reset(): void;
}
```

--------------------------------

### PIConfettiRestartOptions Type Definition

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/pi-confetti-component.md

Defines the type for options that can be passed to the restart method, allowing customization of origin points and delays for animation restarts.

```typescript
type PIConfettiRestartOptions = {
  origins?: {
    blastPosition: NamedPosition | Position;
    delay?: number;
  }[];
};
```

--------------------------------

### ConfettiMethods

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/types.md

Control methods exposed via ref for Confetti and ContinuousConfetti components. These methods allow direct manipulation of the animation state.

```APIDOC
## ConfettiMethods

### Description
Control methods exposed via ref for `Confetti` and `ContinuousConfetti`.

### Methods
- `restart()`: Regenerate random positions and start animation.
- `pause()`: Pause animation at current state.
- `resume()`: Resume from pause.
- `reset()`: Stop and clear animation.
```

--------------------------------

### Multiple Origins for PIConfetti

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/README.md

Configure multiple origins for confetti bursts using `PIConfetti`. Each `PIConfetti.Origin` can define its `blastPosition` and `count`, allowing for dispersed confetti effects.

```typescript
<PIConfetti>
  <PIConfetti.Origin blastPosition="top-left" count={100}>
    <PIConfetti.Flake size={10} />
  </PIConfetti.Origin>
  <PIConfetti.Origin blastPosition="top-right" count={100}>
    <PIConfetti.Flake size={10} />
  </PIConfetti.Origin>
</PIConfetti>
```

--------------------------------

### PIConfetti Origin Configuration

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/API-index.md

Configure the origin of confetti blasts for PIConfetti. This snippet shows how to set blast position, count, speed, spread, colors, and flake style.

```typescript
<PIConfetti>
  <PIConfetti.Origin
    blastPosition="center"  // or { x, y }
    count={100}
    initialSpeed={1.0}
    spread={2 * Math.PI}
    speedVariation={{ min: 0, max: 1 }}
    colors={['#FF0000']}
    flakeStyle="glossy"
    rotation={{ x: {...}, z: {...} }}
    depth={{ min: 1, max: 1.1 }}
    delay={0}
  >
    <PIConfetti.Flake size={12} />
  </PIConfetti.Origin>
</PIConfetti>
```

--------------------------------

### Custom Texture with `useImage`

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/README.md

Load a custom image for confetti using the `useImage` hook. The loaded image is then passed to the `image` prop of the `Confetti` component.

```typescript
const image = useImage(require('./star.png'));

<Confetti image={image}>
  <Confetti.Flake size={50} />
</Confetti>
```

--------------------------------

### PIConfetti.Origin with Per-Origin Customization

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/pi-confetti-component.md

Customize individual confetti origins with specific properties like speed, spread, colors, and delay. This allows for varied confetti effects from a single PIConfetti component.

```typescript
<PIConfetti.Origin
  blastPosition="center"
  count={200}
  initialSpeed={2.0}
  spread={Math.PI}
  colors={['#FF0000', '#00FF00']}
  delay={200}>
  <PIConfetti.Flake size={12} colors={['#FF0000', '#00FF00']} />
</PIConfetti.Origin>
```

--------------------------------

### Confetti Flake with Size Shorthand

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/confetti-component.md

Use this snippet to create simple square confetti flakes using the `size` prop for both width and height, and `radius` for rounded corners.

```typescript
<Confetti.Flake size={12} radius={6} />
```

--------------------------------

### PIConfettiMethods Interface

Source: https://github.com/alirezahadjar/react-native-fast-confetti/blob/main/_autodocs/types.md

Defines the control methods for the PIConfetti component. It supports dynamic position overrides for restarting the animation.

```typescript
type PIConfettiMethods = {
  restart(options?: PIConfettiRestartOptions): void;
  pause(): void;
  resume(): void;
  reset(): void;
};
```