https://repsshield.com/assets/file-preview-demo-MxgUIuqc.js

1import{j as e,C as p,d as u,W as w,h as c,ao as A,aI as o,F as N,bb as I,aZ as F,a_ as P,b0 as D,m as z,B as n,D as f,X as M,b6 as B,b2 as j,af as T,aa as b,e as U}from"./index-Byg2HWAE.js";import{r as x}from"./vendor-Qgthw7N1.js";import{F as R}from"./file-image-Er1ZOYVg.js";import{H as W}from"./hard-drive-436CTEuo.js";import{S as E}from"./share-2-BwzmsqEz.js";import{M as H}from"./maximize-2-D7IQEluU.js";const y=[{id:1,name:"Property_Inspection_Report.pdf",type:"application/pdf",size:"2.4 MB",date:"2024-01-15",previewUrl:"https://images.unsplash.com/photo-1554469384-e58fac16e23a?w=800",aiSummary:`**Document Type & Purpose**
2Property inspection report for 123 Oak Street residential property.
3
4**Key Details**
5- Inspection Date: January 15, 2024
6- Property Type: Single-family home
7- Square Footage: 2,450 sq ft
8- Year Built: 1998
9
10**Findings Summary**
11- Roof: Good condition, estimated 5-7 years remaining
12- HVAC: Functioning properly, filter replacement recommended
13- Foundation: No visible cracks or settling
14- Electrical: Up to code, minor outlet repairs needed
15
16**Action Items**
17- Schedule HVAC maintenance within 30 days
18- Replace two non-functioning GFCI outlets
19- Clean gutters before rainy season`,aiStatus:"completed"},{id:2,name:"Listing_Photos_Front.jpg",type:"image/jpeg",size:"4.1 MB",date:"2024-01-20",previewUrl:"https://images.unsplash.com/photo-1600596542815-ffad4c1539a9?w=800",aiSummary:`**Image Analysis**
20High-quality exterior photograph of residential property.
21
22**Visual Elements Detected**
23- Two-story colonial style home
24- Well-maintained front lawn
25- Attached two-car garage
26- Mature landscaping
27
28**Quality Assessment**
29- Resolution: High (4032 x 3024)
30- Lighting: Excellent (golden hour)
31- Composition: Professional quality
32- Suitable for MLS listing`,aiStatus:"completed"},{id:3,name:"Purchase_Agreement.pdf",type:"application/pdf",size:"856 KB",date:"2024-01-22",previewUrl:"https://images.unsplash.com/photo-1450101499163-c8848c66ca85?w=800",aiSummary:null,aiStatus:"pending"}],v=(l,r)=>l.startsWith("image/")?e.jsx(R,{className:o("text-emerald-500",r)}):l==="application/pdf"?e.jsx(N,{className:o("text-red-500",r)}):e.jsx(I,{className:o("text-gray-500",r)}),O=({file:l,isActive:r,onClick:i})=>e.jsxs("button",{onClick:i,className:o("relative flex-shrink-0 w-16 h-16 rounded-lg overflow-hidden transition-all duration-200","hover:ring-2 hover:ring-emerald-400/50","focus:outline-none focus:ring-2 focus:ring-emerald-500",r&&"ring-2 ring-emerald-500 ring-offset-2 ring-offset-white dark:ring-offset-gray-900"),children:[e.jsx("img",{src:l.previewUrl,alt:l.name,className:"w-full h-full object-cover"}),e.jsx("div",{className:"absolute inset-0 bg-black/0 hover:bg-black/10 transition-colors"})]}),_=({summary:l,status:r})=>{const i=m=>m.split(`
33`).map((t,s)=>t.startsWith("**")&&t.endsWith("**")?e.jsx("h4",{className:"font-semibold text-gray-900 dark:text-white mt-5 mb-2 first:mt-0 text-sm",children:t.replace(/\*\*/g,"")},s):t.startsWith("- ")?e.jsx("li",{className:"text-gray-600 dark:text-gray-300 ml-4 text-sm leading-relaxed",children:t.substring(2)},s):t.trim()?e.jsx("p",{className:"text-gray-600 dark:text-gray-300 text-sm leading-relaxed mb-2",children:t},s):null);return r==="pending"?e.jsxs("div",{className:"flex flex-col items-center justify-center h-full text-center px-6",children:[e.jsx("div",{className:"w-16 h-16 rounded-full bg-emerald-50 dark:bg-emerald-900/20 flex items-center justify-center mb-4",children:e.jsx(w,{className:"h-8 w-8 text-emerald-500 animate-pulse"})}),e.jsx("h4",{className:"font-medium text-gray-900 dark:text-white mb-2",children:"Analysis in Progress"}),e.jsx("p",{className:"text-sm text-gray-500 dark:text-gray-400 max-w-[200px]",children:"Our AI is reviewing this document. This usually takes 1-2 minutes."})]}):l?e.jsxs("div",{className:"p-6",children:[e.jsx("div",{className:"flex items-center gap-2 mb-4",children:e.jsxs(U,{className:"bg-emerald-100 text-emerald-700 dark:bg-emerald-900/30 dark:text-emerald-400 gap-1",children:[e.jsx(c,{className:"h-3 w-3"}),"Analysis Complete"]})}),e.jsx("div",{className:"prose prose-sm dark:prose-invert max-w-none",children:i(l)})]}):e.jsxs("div",{className:"flex flex-col items-center justify-center h-full text-center px-6",children:[e.jsx("div",{className:"w-16 h-16 rounded-full bg-gray-100 dark:bg-gray-800 flex items-center justify-center mb-4",children:e.jsx(b,{className:"h-8 w-8 text-gray-400"})}),e.jsx("h4",{className:"font-medium text-gray-900 dark:text-white mb-2",children:"No Analysis Available"}),e.jsx("p",{className:"text-sm text-gray-500 dark:text-gray-400 max-w-[200px]",children:"AI analysis hasn't been run on this file yet."})]})},q=({isOpen:l,onClose:r,files:i,initialIndex:m=0})=>{var h;const[t,s]=x.useState(m),a=i[t],k=i.length>1,C=()=>s(d=>Math.max(0,d-1)),S=()=>s(d=>Math.min(i.length-1,d+1));return e.jsx(F,{open:l,onOpenChange:r,children:e.jsxs(P,{className:"!max-w-[90vw] !w-[90vw] !h-[90vh] !max-h-[90vh] !p-0 !gap-0 overflow-hidden bg-white dark:bg-gray-900 !rounded-2xl",children:[e.jsxs(D,{className:"sr-only",children:[a.name," - Preview"]}),e.jsxs("div",{className:"flex items-center justify-between px-6 py-4 border-b border-gray-100 dark:border-gray-800",children:[e.jsxs("div",{className:"flex items-center gap-3 min-w-0",children:[e.jsx("div",{className:"flex-shrink-0 w-10 h-10 rounded-lg bg-gray-100 dark:bg-gray-800 flex items-center justify-center",children:v(a.type,"h-5 w-5")}),e.jsxs("div",{className:"min-w-0",children:[e.jsx("h3",{className:"font-medium text-gray-900 dark:text-white truncate text-sm",children:a.name}),e.jsxs("div",{className:"flex items-center gap-3 text-xs text-gray-500 dark:text-gray-400",children:[e.jsxs("span",{className:"flex items-center gap-1",children:[e.jsx(W,{className:"h-3 w-3"}),a.size]}),e.jsxs("span",{className:"flex items-center gap-1",children:[e.jsx(z,{className:"h-3 w-3"}),a.date]})]})]})]}),e.jsxs("div",{className:"flex items-center gap-1",children:[e.jsx(n,{variant:"ghost",size:"icon",className:"h-9 w-9 text-gray-500 hover:text-gray-900 dark:hover:text-white",children:e.jsx(E,{className:"h-4 w-4"})}),e.jsx(n,{variant:"ghost",size:"icon",className:"h-9 w-9 text-gray-500 hover:text-gray-900 dark:hover:text-white",children:e.jsx(f,{className:"h-4 w-4"})}),e.jsx(n,{variant:"ghost",size:"icon",className:"h-9 w-9 text-gray-500 hover:text-gray-900 dark:hover:text-white",children:e.jsx(H,{className:"h-4 w-4"})}),e.jsx("div",{className:"w-px h-6 bg-gray-200 dark:bg-gray-700 mx-1"}),e.jsx(n,{variant:"ghost",size:"icon",className:"h-9 w-9 text-gray-500 hover:text-red-600",onClick:r,children:e.jsx(M,{className:"h-4 w-4"})})]})]}),k&&e.jsxs("div",{className:"flex items-center gap-4 px-6 py-3 border-b border-gray-100 dark:border-gray-800 bg-gray-50/50 dark:bg-gray-800/50",children:[e.jsx(n,{variant:"outline",size:"icon",className:"h-8 w-8 flex-shrink-0",onClick:C,disabled:t===0,children:e.jsx(B,{className:"h-4 w-4"})}),e.jsx(j,{className:"flex-1",children:e.jsx("div",{className:"flex items-center gap-2 pb-1",children:i.map((d,g)=>e.jsx(O,{file:d,isActive:g===t,onClick:()=>s(g)},d.id))})}),e.jsxs("div",{className:"flex items-center gap-2 flex-shrink-0",children:[e.jsxs("span",{className:"text-sm text-gray-500 dark:text-gray-400 min-w-[60px] text-center",children:[t+1," / ",i.length]}),e.jsx(n,{variant:"outline",size:"icon",className:"h-8 w-8",onClick:S,disabled:t===i.length-1,children:e.jsx(T,{className:"h-4 w-4"})})]})]}),e.jsxs("div",{className:"flex-1 flex min-h-0",children:[e.jsx("div",{className:"w-[60%] flex flex-col min-w-0 bg-gray-50 dark:bg-gray-800",children:e.jsx("div",{className:"flex-1 flex items-center justify-center p-4",children:e.jsx("div",{className:"relative w-full h-full flex items-center justify-center",children:a.type.startsWith("image/")?e.jsx("img",{src:a.previewUrl,alt:a.name,className:"max-w-full max-h-full object-contain rounded-lg shadow-lg"}):a.type==="application/pdf"?e.jsx("iframe",{src:a.previewUrl,title:a.name,className:"w-full h-full rounded-lg border-0"}):e.jsxs("div",{className:"flex flex-col items-center justify-center text-center p-8",children:[e.jsx("div",{className:"w-20 h-20 rounded-2xl bg-gray-200 dark:bg-gray-700 flex items-center justify-center mb-4",children:e.jsx(N,{className:"h-10 w-10 text-gray-400"})}),e.jsx("h4",{className:"font-medium text-gray-900 dark:text-white mb-2",children:a.name}),e.jsx("p",{className:"text-sm text-gray-500 dark:text-gray-400 mb-4",children:"Preview not available for this file type"}),e.jsxs(n,{variant:"outline",size:"sm",children:[e.jsx(f,{className:"h-4 w-4 mr-2"}

33),"Download to View"]})]})})})}),e.jsxs("div",{className:"w-[40%] flex-shrink-0 border-l border-gray-100 dark:border-gray-800 flex flex-col bg-white dark:bg-gray-900",children:[e.jsxs("div",{className:"flex items-center gap-2 px-6 py-4 border-b border-gray-100 dark:border-gray-800",children:[e.jsx(b,{className:"h-4 w-4 text-emerald-500"}),e.jsx("span",{className:"font-medium text-sm text-gray-900 dark:text-white",children:"AI Analysis"})]}),e.jsx(j,{className:"flex-1",children:e.jsx(_,{summary:a.aiSummary,status:a.aiStatus})}),e.jsx("div",{className:"px-6 py-3 border-t border-gray-100 dark:border-gray-800 bg-gray-50/50 dark:bg-gray-800/30",children:e.jsxs("div",{className:"flex items-center justify-between text-xs text-gray-500 dark:text-gray-400",children:[e.jsx("span",{children:(h=a.type.split("/")[1])==null?void 0:h.toUpperCase()}),e.jsx("span",{children:a.size})]})})]})]})]})})};function X(){const[l,r]=x.useState(!1),[i,m]=x.useState(0),t=s=>{m(s),r(!0)};return e.jsx("div",{className:"min-h-screen bg-gradient-to-br from-gray-50 to-gray-100 dark:from-gray-900 dark:to-gray-950 p-8",children:e.jsxs("div",{className:"max-w-4xl mx-auto",children:[e.jsxs("div",{className:"text-center mb-12",children:[e.jsx("h1",{className:"text-3xl font-bold text-gray-900 dark:text-white mb-3",children:"File Preview Modal Demo"}),e.jsx("p",{className:"text-gray-600 dark:text-gray-400 max-w-xl mx-auto",children:"A redesigned file preview experience with proper spacing, visual hierarchy, and breathing room."})]}),e.jsx(p,{className:"mb-8 border-emerald-200 dark:border-emerald-800 bg-emerald-50/50 dark:bg-emerald-900/20",children:e.jsxs(u,{className:"p-6",children:[e.jsxs("h3",{className:"font-semibold text-emerald-900 dark:text-emerald-100 mb-3 flex items-center gap-2",children:[e.jsx(w,{className:"h-4 w-4"}),"Design Improvements"]}),e.jsxs("ul",{className:"grid grid-cols-2 gap-2 text-sm text-emerald-800 dark:text-emerald-200",children:[e.jsxs("li",{className:"flex items-center gap-2",children:[e.jsx(c,{className:"h-4 w-4 text-emerald-500"}),"24px padding throughout"]}),e.jsxs("li",{className:"flex items-center gap-2",children:[e.jsx(c,{className:"h-4 w-4 text-emerald-500"}),"Rounded corners (16px)"]}),e.jsxs("li",{className:"flex items-center gap-2",children:[e.jsx(c,{className:"h-4 w-4 text-emerald-500"}),"Clear visual hierarchy"]}),e.jsxs("li",{className:"flex items-center gap-2",children:[e.jsx(c,{className:"h-4 w-4 text-emerald-500"}),"Distinct header/content/footer"]}),e.jsxs("li",{className:"flex items-center gap-2",children:[e.jsx(c,{className:"h-4 w-4 text-emerald-500"}),"100vw × 95vh (full width)"]}),e.jsxs("li",{className:"flex items-center gap-2",children:[e.jsx(c,{className:"h-4 w-4 text-emerald-500"}),"Subtle background contrast"]})]})]})}),e.jsx("h2",{className:"text-lg font-semibold text-gray-900 dark:text-white mb-4",children:"Click a file to preview"}),e.jsx("div",{className:"grid grid-cols-1 md:grid-cols-3 gap-4",children:y.map((s,a)=>e.jsx(p,{className:"cursor-pointer hover:shadow-lg transition-shadow group",onClick:()=>t(a),children:e.jsxs(u,{className:"p-0",children:[e.jsxs("div",{className:"aspect-video relative overflow-hidden rounded-t-lg bg-gray-100 dark:bg-gray-800",children:[e.jsx("img",{src:s.previewUrl,alt:s.name,className:"w-full h-full object-cover group-hover:scale-105 transition-transform duration-300"}),e.jsx("div",{className:"absolute inset-0 bg-black/0 group-hover:bg-black/10 transition-colors flex items-center justify-center",children:e.jsx("div",{className:"opacity-0 group-hover:opacity-100 transition-opacity",children:e.jsx("div",{className:"w-12 h-12 rounded-full bg-white/90 flex items-center justify-center shadow-lg",children:e.jsx(A,{className:"h-5 w-5 text-gray-700"})})})})]}),e.jsxs("div",{className:"p-4",children:[e.jsxs("div",{className:"flex items-center gap-2 mb-1",children:[v(s.type,"h-4 w-4"),e.jsx("span",{className:"font-medium text-sm text-gray-900 dark:text-white truncate",children:s.name})]}),e.jsxs("div",{className:"flex items-center gap-2 text-xs text-gray-500",children:[e.jsx("span",{children:s.size}),e.jsx("span",{children:"•"}),e.jsx("span",{children:s.date})]})]})]})},s.id))}),e.jsx(q,{isOpen:l,onClose:()=>r(!1),files:y,initialIndex:i})]})})}export{X as default};