mirror of
https://github.com/arsvendg/Stirling-PDF.git
synced 2026-07-16 11:23:10 +02:00
Add onboarding flow using Reactour (#4635)
# Description of Changes Add onboarding flow
This commit is contained in:
@@ -93,6 +93,19 @@ const CropSettings = ({ parameters, disabled = false }: CropSettingsProps) => {
|
||||
loadPDFDimensions();
|
||||
}, [selectedStub, selectedFile, parameters]);
|
||||
|
||||
// Listen for tour events to set crop area
|
||||
useEffect(() => {
|
||||
const handleSetCropArea = (event: Event) => {
|
||||
const customEvent = event as CustomEvent<Rectangle>;
|
||||
if (customEvent.detail && pdfBounds) {
|
||||
parameters.setCropArea(customEvent.detail, pdfBounds);
|
||||
}
|
||||
};
|
||||
|
||||
window.addEventListener('tour:setCropArea', handleSetCropArea);
|
||||
return () => window.removeEventListener('tour:setCropArea', handleSetCropArea);
|
||||
}, [parameters, pdfBounds]);
|
||||
|
||||
// Current crop area
|
||||
const cropArea = parameters.getCropArea();
|
||||
|
||||
@@ -137,7 +150,7 @@ const CropSettings = ({ parameters, disabled = false }: CropSettingsProps) => {
|
||||
const isFullCrop = parameters.isFullPDFCrop(pdfBounds);
|
||||
|
||||
return (
|
||||
<Stack gap="md">
|
||||
<Stack gap="md" data-tour="crop-settings">
|
||||
{/* PDF Preview with Crop Selector */}
|
||||
<Stack gap="xs">
|
||||
<Group justify="space-between" align="center">
|
||||
|
||||
Reference in New Issue
Block a user