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
remainingnumberRequests remaining in the current window.
maxnumberMaximum requests per window.
resetInnumberSeconds 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