27 lines
745 B
TypeScript
27 lines
745 B
TypeScript
import React, { ReactNode } from 'react';
|
|
import { Box } from './Box';
|
|
import { Text } from './Text';
|
|
import { Heading } from './Heading';
|
|
import { Card } from './Card';
|
|
|
|
interface DangerZoneProps {
|
|
title: string;
|
|
description: string;
|
|
children: ReactNode;
|
|
}
|
|
|
|
export function DangerZone({ title, description, children }: DangerZoneProps) {
|
|
return (
|
|
<Card>
|
|
<Heading level={3} mb={4}>Danger Zone</Heading>
|
|
<Box p={4} rounded="lg" bg="bg-red-900/10" border={true} borderColor="border-red-900/30">
|
|
<Text color="text-white" weight="medium" block mb={2}>{title}</Text>
|
|
<Text size="sm" color="text-gray-400" block mb={4}>
|
|
{description}
|
|
</Text>
|
|
{children}
|
|
</Box>
|
|
</Card>
|
|
);
|
|
}
|