amal
ff0413be5a
Deskripsi - form pencarian - detail data pengajuan - api - belom selesai submit NO Issues
39 lines
850 B
TypeScript
39 lines
850 B
TypeScript
import { Center, Loader, Overlay, Stack, Text } from "@mantine/core";
|
|
|
|
type FullScreenLoadingProps = {
|
|
visible: boolean;
|
|
text?: string;
|
|
};
|
|
|
|
export default function FullScreenLoading({
|
|
visible,
|
|
text = "Memproses data...",
|
|
}: FullScreenLoadingProps) {
|
|
if (!visible) return null;
|
|
|
|
return (
|
|
<Overlay fixed blur={6} backgroundOpacity={0.3} zIndex={10000}>
|
|
<Center h="100%">
|
|
<Stack align="center" justify="center">
|
|
<Loader size="lg" />
|
|
<Text size="sm" c="dimmed">
|
|
{text}
|
|
</Text>
|
|
</Stack>
|
|
</Center>
|
|
</Overlay>
|
|
);
|
|
}
|
|
|
|
const overlayStyle: React.CSSProperties = {
|
|
position: "fixed",
|
|
inset: 0,
|
|
zIndex: 9999,
|
|
backdropFilter: "blur(6px)",
|
|
backgroundColor: "rgba(255, 255, 255, 0.6)",
|
|
};
|
|
|
|
const contentStyle: React.CSSProperties = {
|
|
flexDirection: "column",
|
|
};
|