V2 results flow (#4196)

Better tool flow for reusability Pinning Styling of tool flow consumption of files after tooling --------- Co-authored-by: Connor Yoh <connor@stirlingpdf.com> Co-authored-by: James Brunton <jbrunton96@gmail.com>
2025-08-15 14:43:30 +01:00
parent 1468df3e21
commit 4c17c520d7
40 changed files with 1474 additions and 1274 deletions
@@ -0,0 +1,65 @@
+import React from 'react';
+import { Box } from '@mantine/core';
+
+export interface DocumentStackProps {
+  totalFiles: number;
+  children: React.ReactNode;
+}
+
+const DocumentStack: React.FC<DocumentStackProps> = ({
+  totalFiles,
+  children
+}) => {
+  const stackDocumentBaseStyle = {
+    position: 'absolute' as const,
+    width: '100%',
+    height: '100%'
+  };
+
+  const stackDocumentShadows = {
+    back: '0 2px 8px rgba(0, 0, 0, 0.1)',
+    middle: '0 3px 10px rgba(0, 0, 0, 0.12)'
+  };
+
+  return (
+    <Box style={{ position: 'relative', width: '100%', height: '100%' }}>
+      {/* Background documents (stack effect) */}
+      {totalFiles >= 3 && (
+        <Box
+          style={{
+            ...stackDocumentBaseStyle,
+            backgroundColor: 'var(--mantine-color-gray-3)',
+            boxShadow: stackDocumentShadows.back,
+            transform: 'translate(0.75rem, 0.75rem) rotate(2deg)',
+            zIndex: 1
+          }}
+        />
+      )}
+      
+      {totalFiles >= 2 && (
+        <Box
+          style={{
+            ...stackDocumentBaseStyle,
+            backgroundColor: 'var(--mantine-color-gray-2)',
+            boxShadow: stackDocumentShadows.middle,
+            transform: 'translate(0.375rem, 0.375rem) rotate(1deg)',
+            zIndex: 2
+          }}
+        />
+      )}
+
+      {/* Main document container */}
+      <Box style={{ 
+        position: 'relative',
+        width: '100%',
+        height: '100%',
+        zIndex: 3,
+        boxShadow: '0 6px 16px rgba(0, 0, 0, 0.2)'
+      }}>
+        {children}
+      </Box>
+    </Box>
+  );
+};
+
+export default DocumentStack;