Primitives
Loader
Loading indicators for async states.
import { SpinLoader, StripeLoader } from "@pipecat-ai/voice-ui-kit";
<div className="flex flex-row gap-6 items-center">
<SpinLoader />
<StripeLoader />
</div>
Prop | Type | Default |
---|---|---|
SpinLoader? | { size?: number } | { size: 32 } |
StripeLoader? | { className?: string } | {} |
Usage
Spin Loader
import { SpinLoader } from "@pipecat-ai/voice-ui-kit";
<div className="flex flex-row gap-6 items-center">
<SpinLoader size={16} />
<SpinLoader />
<SpinLoader size={48} />
</div>
Stripe Loader
import { StripeLoader } from "@pipecat-ai/voice-ui-kit";
<div className="flex flex-col gap-4">
<StripeLoader />
<StripeLoader className="text-destructive" />
<StripeLoader className="w-60 h-6" />
</div>