# Beam and lock

The beam and the lock are how a `ScanGrid` finds something. A line of light crosses the grid, colouring each column as it passes, overshoots, comes back, and stops. A band lights the row and a reticle closes in on one cell.

> Live preview: see it play at https://bettertyped.github.io/react-cards-opening/docs/effects/beam-and-lock/
>
> Press Scan. The first pass reads the whole grid; later ones go straight for the cell.

## When it plays

It belongs to the scan, so it plays in a `ScanGrid` and a `CardHunt`, for every tier.

## How it is built

The first pass on a blank grid goes edge to edge in 1.7 seconds and takes the veil off: every column it crosses shows its real colours. Later passes overshoot the target by 6 to 12 columns and come back, which reads as searching.

The beam is moved with a quick setter, not a tween a frame. Each column it enters flares to 1.9 times its brightness and settles in 0.55 seconds. Tiles never change size, so they never spill over their neighbours.

The lock is a band that grows along the row in 0.35 seconds and a square that shrinks from three times its size, turning 45 degrees, in 0.45. Then it ticks twice.

## What changes it

- `rows` and `levels` shape the grid. Seven rows makes a year of weeks.
- `veiled` and `onUnveil` control the blank state.
- `theme.levels[4]` colours the beam's glow; the reticle wears the hunted card's tier.

## Related

- [Sparkles](https://bettertyped.github.io/react-cards-opening/docs/effects/sparkles/)
- [Crack](https://bettertyped.github.io/react-cards-opening/docs/effects/crack/)
- [Flip](https://bettertyped.github.io/react-cards-opening/docs/effects/flip/)
- [Effects](https://bettertyped.github.io/react-cards-opening/docs/effects/)
- [Rarity tiers](https://bettertyped.github.io/react-cards-opening/docs/rarity-tiers/)

Source: https://bettertyped.github.io/react-cards-opening/docs/effects/beam-and-lock/