File size: 1,914 Bytes
5f40163
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
import { cva, type VariantProps } from "class-variance-authority";
import { cn } from "#/utils/utils";

const preVariants = cva("whitespace-pre-wrap", {
  variants: {
    size: {
      default: "text-sm",
      small: "text-xs",
    },
    font: {
      default: "",
      mono: "font-mono",
    },
    lineHeight: {
      default: "",
      relaxed: "leading-relaxed",
    },
    background: {
      default: "",
      dark: "bg-base",
    },
    textColor: {
      default: "",
      light: "text-[var(--oh-text-tertiary)]",
    },
    padding: {
      default: "",
      medium: "p-3",
      large: "px-5",
    },
    borderRadius: {
      default: "",
      medium: "rounded-md",
    },
    shadow: {
      default: "",
      inner: "shadow-inner",
    },
    maxHeight: {
      default: "",
      small: "max-h-[400px]",
      large: "max-h-[60vh]",
    },
    overflow: {
      default: "",
      auto: "overflow-auto",
    },
  },
  defaultVariants: {
    size: "default",
    font: "default",
    lineHeight: "default",
    background: "default",
    textColor: "default",
    padding: "default",
    borderRadius: "default",
    shadow: "default",
    maxHeight: "default",
    overflow: "default",
  },
});

interface PreProps extends VariantProps<typeof preVariants> {
  className?: string;
  testId?: string;
  children: React.ReactNode;
}

export function Pre({
  size,
  font,
  lineHeight,
  background,
  textColor,
  padding,
  borderRadius,
  shadow,
  maxHeight,
  overflow,
  className,
  testId,
  children,
}: PreProps) {
  return (
    <pre
      data-testid={testId}
      className={cn(
        preVariants({
          size,
          font,
          lineHeight,
          background,
          textColor,
          padding,
          borderRadius,
          shadow,
          maxHeight,
          overflow,
        }),
        className,
      )}
    >
      {children}
    </pre>
  );
}