feat(FE): Add PDF helper components for badges and typography

src/components/helper/pdf/badge/PdfStatusBadge.tsx

@@ -0,0 +1,47 @@
+import { Text, View, StyleSheet } from '@react-pdf/renderer';
+
+type PdfStatusBadgeProps = {
+  children: React.ReactNode;
+  backgroundColor?: string;
+  textColor?: string;
+  borderColor?: string;
+};
+
+const styles = StyleSheet.create({
+  statusBadge: {
+    paddingVertical: 2,
+    paddingHorizontal: 4,
+    borderRadius: 12,
+    fontSize: 7,
+    fontWeight: 'bold',
+    borderWidth: 1,
+    borderStyle: 'solid',
+  },
+  statusBadgeText: {
+    fontSize: 7,
+    fontWeight: 'bold',
+  },
+});
+
+export const PdfStatusBadge = ({
+  children,
+  backgroundColor = '#F5F5F5',
+  textColor = '#333333',
+  borderColor = '#E5E7EB',
+}: PdfStatusBadgeProps) => {
+  return (
+    <View
+      style={[
+        styles.statusBadge,
+        {
+          backgroundColor,
+          borderColor,
+        },
+      ]}
+    >
+      <Text style={[styles.statusBadgeText, { color: textColor }]}>
+        {children}
+      </Text>
+    </View>
+  );
+};