VexellDocs · v1.5

AI primitive

RateLimitIndicator

Small status pill showing remaining requests per window with countdown to reset. Drop into headers or composer toolbars.

Usage

Pick your edition with the tabs. Selection syncs across all docs.

tsx
import { RateLimitIndicator } from '@/components/molecules'

<RateLimitIndicator remaining={87} max={100} resetIn={720} />

Props

Same surface in both editions; HTML version exposes equivalents through Alpine x-data.

PropTypeDefaultDescription
remainingnumber—Requests remaining in the current window.
maxnumber—Maximum requests per window.
resetInnumber—Seconds until reset.
compactbooleanfalseHide the reset countdown.

Accessibility

  • role

    aria-label includes 'remaining of max', refreshed each render.

  • contrast

    Color dot has redundant icon for color-blind users.

Read next