TS · maintainability

←Previous Next→

no-hand-rolled-spinner

Disallow intrinsic elements styled as Tailwind border-ring spinners outside the design-system implementation.

handRolledSpinner Rule source Tests Catalog JSON

Why

One-off loading indicators duplicate a shared primitive and let accessibility and styling diverge.

Fix

Render the design-system Spinner component instead.

Examples

Before — flagged Do not rebuild a spinner

src/loading-state.tsx

<div className="size-4 animate-spin rounded-full border-2 border-t-transparent" />;

After — preferred Use the shared spinner

src/loading-state.tsx

<Spinner className="size-4" />;