{
  "$schema": "https://pdfx.akashpise.dev/schema/registry-item.json",
  "name": "signature",
  "type": "registry:ui",
  "title": "Signature",
  "description": "Signature block with single, double, and inline variants",
  "files": [
    {
      "path": "components/pdfx/signature/pdfx-signature.tsx",
      "content": "import { Text as PDFText, StyleSheet, View } from '@react-pdf/renderer';\nimport type { Style } from '@react-pdf/types';\nimport { usePdfxTheme, useSafeMemo } from '../lib/pdfx-theme-context';\ntype PdfxTheme = ReturnType<typeof usePdfxTheme>;\n\nexport type SignatureVariant = 'single' | 'double' | 'inline';\n\n/**\n * Signature signer properties.\n * Props - `label` | `name` | `title` | `date`\n * @see {@link SignatureSigner}\n */\nexport interface SignatureSigner {\n  label?: string;\n  name?: string;\n  title?: string;\n  date?: string;\n}\n\n/**\n * Signature block properties.\n * Props - `variant` | `label` | `name` | `title` | `date` | `signers` | `style`\n * @see {@link PdfSignatureBlockProps}\n */\nexport interface PdfSignatureBlockProps {\n  /**\n   * Layout variant: [single, double, inline]\n   * @default 'single'\n   */\n  variant?: SignatureVariant;\n  label?: string;\n  name?: string;\n  title?: string;\n  date?: string;\n  signers?: [SignatureSigner, SignatureSigner];\n  style?: Style;\n}\n\nfunction createSignatureStyles(t: PdfxTheme) {\n  const { spacing, fontWeights, typography } = t.primitives;\n  return StyleSheet.create({\n    container: { marginTop: t.spacing.sectionGap, marginBottom: t.spacing.componentGap },\n    block: { flex: 1, minWidth: 140 },\n    label: {\n      fontFamily: t.typography.body.fontFamily,\n      fontSize: typography.sm,\n      color: t.colors.mutedForeground,\n      marginBottom: spacing[1],\n    },\n    line: {\n      borderBottomWidth: 1,\n      borderBottomColor: t.colors.foreground,\n      borderBottomStyle: 'solid',\n      minHeight: spacing[6],\n      marginBottom: spacing[1],\n    },\n    name: {\n      fontFamily: t.typography.body.fontFamily,\n      fontSize: t.typography.body.fontSize,\n      color: t.colors.foreground,\n      fontWeight: fontWeights.semibold,\n    },\n    titleText: {\n      fontFamily: t.typography.body.fontFamily,\n      fontSize: typography.sm,\n      color: t.colors.mutedForeground,\n    },\n    dateText: {\n      fontFamily: t.typography.body.fontFamily,\n      fontSize: typography.xs,\n      color: t.colors.mutedForeground,\n      marginTop: 1,\n    },\n    doubleRow: { flexDirection: 'row', justifyContent: 'space-between', gap: spacing[8] },\n    inlineRow: { flexDirection: 'row', alignItems: 'center', gap: spacing[3], flexWrap: 'wrap' },\n    inlineLabel: {\n      fontFamily: t.typography.body.fontFamily,\n      fontSize: typography.sm,\n      color: t.colors.mutedForeground,\n    },\n    inlineLine: {\n      borderBottomWidth: 1,\n      borderBottomColor: t.colors.foreground,\n      borderBottomStyle: 'solid',\n      minWidth: 120,\n      height: spacing[5],\n      paddingHorizontal: spacing[2],\n    },\n    inlineName: {\n      fontFamily: t.typography.body.fontFamily,\n      fontSize: t.typography.body.fontSize,\n      color: t.colors.foreground,\n    },\n  });\n}\n\nfunction renderSignerBlock(\n  signer: SignatureSigner,\n  styles: ReturnType<typeof createSignatureStyles>\n) {\n  return (\n    <View style={styles.block}>\n      {signer.label ? <PDFText style={styles.label}>{signer.label}</PDFText> : null}\n      <View style={styles.line} />\n      {signer.name ? <PDFText style={styles.name}>{signer.name}</PDFText> : null}\n      {signer.title ? <PDFText style={styles.titleText}>{signer.title}</PDFText> : null}\n      {signer.date ? <PDFText style={styles.dateText}>{signer.date}</PDFText> : null}\n    </View>\n  );\n}\n\nexport function PdfSignatureBlock({\n  variant = 'single',\n  label = 'Signature',\n  name,\n  title,\n  date,\n  signers,\n  style,\n}: PdfSignatureBlockProps) {\n  const theme = usePdfxTheme();\n  const styles = useSafeMemo(() => createSignatureStyles(theme), [theme]);\n  const containerStyles: Style[] = [styles.container];\n  if (style) containerStyles.push(style);\n\n  if (variant === 'inline') {\n    return (\n      <View wrap={false} style={containerStyles}>\n        <View style={styles.inlineRow}>\n          <PDFText style={styles.inlineLabel}>{`${label}:`}</PDFText>\n          <View style={styles.inlineLine} />\n          {name ? <PDFText style={styles.inlineName}>{name}</PDFText> : null}\n        </View>\n      </View>\n    );\n  }\n\n  if (variant === 'double') {\n    const [first, second] = signers ?? [\n      { label: 'Authorized by', name: '', title: '', date: '' },\n      { label: 'Approved by', name: '', title: '', date: '' },\n    ];\n    return (\n      <View wrap={false} style={containerStyles}>\n        <View style={styles.doubleRow}>\n          {renderSignerBlock(first, styles)}\n          {renderSignerBlock(second, styles)}\n        </View>\n      </View>\n    );\n  }\n\n  return (\n    <View wrap={false} style={containerStyles}>\n      {renderSignerBlock({ label, name, title, date }, styles)}\n    </View>\n  );\n}\n",
      "type": "registry:component"
    }
  ],
  "dependencies": [
    "@react-pdf/renderer"
  ],
  "registryDependencies": [
    "theme"
  ]
}