34 lines
703 B
TypeScript
34 lines
703 B
TypeScript
import React, { ReactNode } from 'react';
|
|
import { Stack } from './Stack';
|
|
import { Text } from './Text';
|
|
|
|
interface FormSectionProps {
|
|
children: ReactNode;
|
|
title?: string;
|
|
}
|
|
|
|
/**
|
|
* FormSection
|
|
*
|
|
* Groups related form fields with an optional title.
|
|
*/
|
|
export function FormSection({ children, title }: FormSectionProps) {
|
|
return (
|
|
<Stack gap={4} fullWidth>
|
|
{title && (
|
|
<Text
|
|
size="xs"
|
|
weight="bold"
|
|
color="text-gray-500"
|
|
className="uppercase tracking-widest border-b border-border-gray pb-1"
|
|
>
|
|
{title}
|
|
</Text>
|
|
)}
|
|
<Stack gap={4} fullWidth>
|
|
{children}
|
|
</Stack>
|
|
</Stack>
|
|
);
|
|
}
|