+ {/* Signature Type Selection */}
+
+
+ {t('sign.type.title', 'Signature Type')}
+
+ onParameterChange('signatureType', value as 'image' | 'text' | 'draw')}
+ options={[
+ {
+ value: 'draw',
+ label: t('sign.type.draw', 'Draw'),
+ },
+ {
+ value: 'image',
+ label: t('sign.type.image', 'Image'),
+ },
+ {
+ value: 'text',
+ label: t('sign.type.text', 'Text'),
+ },
+ ]}
+ disabled={disabled}
+ />
+
+
+ {/* Signature Creation based on type */}
+ {parameters.signatureType === 'draw' && (
+
+
+
+ {t('sign.draw.title', 'Draw your signature')}
+
+
+
+
+ {t('sign.draw.hint', 'Click and drag to draw your signature')}
+
+
+
+ )}
+
+ {parameters.signatureType === 'image' && (
+
+ {
+ console.log('FileInput onChange triggered with file:', file);
+ handleSignatureImageChange(file);
+ }}
+ disabled={disabled}
+ />
+
+ {t('sign.image.hint', 'Upload a PNG or JPG image of your signature')}
+
+
+ )}
+
+ {parameters.signatureType === 'text' && (
+
+ onParameterChange('signerName', e.target.value)}
+ disabled={disabled}
+ required
+ />
+
+ )}
+
+
+ {/* Instructions for placing signature */}
+
+
+ {parameters.signatureType === 'draw' && t('sign.instructions.draw', 'Draw your signature above, then click "Draw Directly on PDF" to draw live, or "Place Canvas Signature" to place your drawn signature.')}
+ {parameters.signatureType === 'image' && t('sign.instructions.image', 'Upload your signature image above, then click "Activate Image Placement" to place it on the PDF.')}
+ {parameters.signatureType === 'text' && t('sign.instructions.text', 'Enter your name above, then click "Activate Text Signature" to place it on the PDF.')}
+
+
+
+ {/* Universal activation button */}
+ {((parameters.signatureType === 'draw' && parameters.signatureData) ||
+ (parameters.signatureType === 'image' && parameters.signatureData) ||
+ (parameters.signatureType === 'text' && parameters.signerName)) && (
+
+ )}
+
+ {/* Draw directly mode for draw type */}
+ {parameters.signatureType === 'draw' && (
+
+ )}
+
+ {/* Universal deactivate button */}
+
+
+
+
+
+ );
+};
+
+export default SignSettings;
diff --git a/frontend/src/components/viewer/EmbedPdfViewer.tsx b/frontend/src/components/viewer/EmbedPdfViewer.tsx
index ac61bca5b..0d1a7f037 100644
--- a/frontend/src/components/viewer/EmbedPdfViewer.tsx
+++ b/frontend/src/components/viewer/EmbedPdfViewer.tsx
@@ -9,6 +9,8 @@ import { useViewer } from "../../contexts/ViewerContext";
import { LocalEmbedPDF } from './LocalEmbedPDF';
import { PdfViewerToolbar } from './PdfViewerToolbar';
import { ThumbnailSidebar } from './ThumbnailSidebar';
+import { useNavigationState } from '../../contexts/NavigationContext';
+import { useSignature } from '../../contexts/SignatureContext';
export interface EmbedPdfViewerProps {
sidebarsVisible: boolean;
@@ -33,6 +35,13 @@ const EmbedPdfViewerContent = ({
const zoomState = getZoomState();
const spreadState = getSpreadState();
+ // Check if we're in signature mode
+ const { selectedTool } = useNavigationState();
+ const isSignatureMode = selectedTool === 'sign';
+
+ // Get signature context
+ const { signatureApiRef } = useSignature();
+
// Get current file from FileContext
const { selectors } = useFileState();
@@ -178,6 +187,12 @@ const EmbedPdfViewerContent = ({