import { Stack, Text } from "@mantine/core";

/** A single read-only registration value rendered as a label/value pair. */
export function ReadOnlyField({
  label,
  value,
}: {
  label: string;
  value?: string;
}) {
  return (
    <Stack gap={2}>
      <Text size="xs" c="dimmed">
        {label}
      </Text>
      <Text size="sm" c="edr-text" fw={500}>
        {value && value.trim() ? value : "—"}
      </Text>
    </Stack>
  );
}

export default ReadOnlyField;
