easeul

TypeScript

Add easeful/types to your tsconfig so data-motion is checked against the preset vocabulary instead of accepting any string.

The types are the reason a wrong preset name is cheap. Without them data-motion is just a string attribute and a typo ships silently. With them it is a union of 4 values and tsc rejects anything else.

Activate

json
{
  "compilerOptions": {
    "types": ["easeful/types"]
  }
}

What you get

The preset union, plus space-separated composition typed as a pair so "fade slide-up" checks and "fade nonsense" does not. Both attributes come from the manifest's own attribute list, which the reference prints in full.

ts
type MotionPreset = "fade" | "scale-fade" | "slide-up" | "collapse";

type MotionValue = MotionPreset | `${MotionPreset} ${MotionPreset}`;

Why this matters more for agents than for you

You would notice a dialog that did not animate. A coding agent often would not, and will confidently invent a preset name that sounds right. A typecheck failure on a hallucinated name is the tightest correction loop available, which is why the types are generated from the same manifest as the CSS rather than written by hand beside it.