Component
AveragePosition
It records three locations on a track, calculates their arithmetic mean, and parks the content there until someone resets the exercise.
01 / Preview
Try it yourself.
Place this carefully
Click three locations. The label will settle at their average, which is apparently a destination.
Mechanism
- 1
- Mark three different points on the track.
- 2
- Watch every mark remain visible.
- 3
- The label moves to the arithmetic average.
- 4
- Reset it when the average has served its purpose.
02 / Usage
Put it somewhere.
example.tsxTSX
import { AveragePosition } from "gra-ui";
import "gra-ui/styles.css";
export function SettledLabel() {
return <AveragePosition>Place this carefully</AveragePosition>;
}03 / API
Small surface area.
PropTypeDescription
childrenReactNodeThe content parked at the average of three marked positions.