LoadingOverlay
LoadingOverlay covers content with a loading indicator while work is in progress.
Source
LLM docs
Package
Examples
1
Properties
35
Playground
Basics
Locks a simple form while background work finishes and keeps the loader aligned with the card container.
Loading demo…
import { useState } from 'react';
import { Block, Card, Input, LoadingOverlay, Switch } from '@plocks/ui';
export function Demo() {
const [visible, setVisible] = useState(true);
return (
<Block fullWidth maw={480}>
<Card>
<Block>
<Input label="Name" placeholder="Jane Doe" disabled={visible} />
<Input label="Email" placeholder="jane@example.com" disabled={visible} />
</Block>
<LoadingOverlay visible={visible} overlayProps={{ radius: 'md' }} />
</Card>
<Switch label="Loading" checked={visible} onChange={setVisible} />
</Block>
);
}React Native design for iOS, Android, and Web.
Quick Links
Resources