https://boombam.app/assets/instagram-post-mockup-CF3rT3Dh.js

1import{j as t,B as x,a4 as j,cq as y,aP as u,cV as v,x as N,aL as b,ap as k,aF as m,s as i}from"./index-CuSEeJFb.js";import{E as f}from"./ellipsis-DL2QQYI6.js";import{U as w}from"./upload-rep3KVPL.js";function A({register:c,setValue:C,watch:s,businessProfile:a,isGeneratingField:e,onGenerateField:r}){var d;const n=s("platformContent.primaryText")||"",o=s("platformContent.description")||"";s("platformContent.headline");const l=s("mediaUrl")||s("platformContent.imageUrl")||"",h=s("destinationUrl")||"",p=!1,g=()=>{};return t.jsxs("div",{className:"max-w-sm mx-auto bg-white dark:bg-gray-800 border rounded-lg overflow-hidden shadow-sm",children:[t.jsxs("div",{className:"flex items-center justify-between p-3 border-b",children:[t.jsxs("div",{className:"flex items-center gap-3",children:[t.jsx("div",{className:"w-8 h-8 bg-gradient-to-r from-purple-500 to-pink-500 rounded-full flex items-center justify-center text-white text-sm font-medium",children:((d=a==null?void 0:a.companyName)==null?void 0:d.charAt(0))||"B"}),t.jsxs("div",{children:[t.jsx("div",{className:"font-semibold text-sm text-gray-900 dark:text-gray-100",children:((a==null?void 0:a.companyName)||"yourbusiness").toLowerCase().replace(/\s+/g,"")}),t.jsx("div",{className:"text-xs text-gray-500",children:(a==null?void 0:a.city)||"Your Location"})]})]}),t.jsx(f,{className:"w-6 h-6 text-gray-900 dark:text-gray-100"})]}),t.jsxs("div",{className:"relative bg-gray-100 dark:bg-gray-700 aspect-square flex items-center justify-center",children:[l?t.jsx("img",{src:l,alt:"Instagram post",className:"w-full h-full object-cover"}):t.jsxs("div",{className:"text-center text-gray-500",children:[t.jsx("div",{className:"w-20 h-20 bg-gray-300 dark:bg-gray-600 rounded-lg mx-auto mb-3 flex items-center justify-center text-2xl",children:"📸"}),t.jsx("div",{className:"text-sm",children:"Add your visual content"}),t.jsx("div",{className:"text-xs text-gray-400 mt-1",children:"Photo, video, or carousel"})]}),t.jsxs("div",{className:"absolute top-2 right-2 flex gap-2",children:[t.jsx(x,{type:"button",variant:"default",size:"sm",className:"bg-green-600 hover:bg-green-700 text-white text-xs px-3 py-1",onClick:()=>g(),disabled:p,"data-testid":"button-upload-image",children:t.jsxs(t.Fragment,{children:[t.jsx(w,{className:"w-3 h-3 mr-1"}),"Upload"]})}),r&&t.jsx(x,{type:"button",variant:"default",size:"sm",className:"bg-purple-600 hover:bg-purple-700 text-white text-xs px-3 py-1",onClick:()=>r("imageUrl"),disabled:e==null?void 0:e("imageUrl"),"data-testid":"button-ai-generate-image",children:e!=null&&e("imageUrl")?t.jsxs(t.Fragment,{children:[t.jsx(j,{className:"w-3 h-3 mr-1 animate-spin"}),"Generating..."]}):t.jsxs(t.Fragment,{children:[t.jsx(y,{className:"w-3 h-3 mr-1"}),"AI Image"]})})]})]}),t.jsxs("div",{className:"flex items-center justify-between p-3",children:[t.jsxs("div",{className:"flex items-center gap-4",children:[t.jsx(u,{className:"w-6 h-6 text-gray-900 dark:text-gray-100"}),t.jsx(v,{className:"w-6 h-6 text-gray-900 dark:text-gray-100"}),t.jsx(N,{className:"w-6 h-6 text-gray-900 dark:text-gray-100"})]}),t.jsx(b,{className:"w-6 h-6 text-gray-900 dark:text-gray-100"})]}),t.jsx("div",{className:"px-3 pb-2",children:t.jsx("div",{className:"text-sm font-semibold text-gray-900 dark:text-gray-100",children:"247 likes"})}),t.jsxs("div",{className:"px-3 pb-3",children:[t.jsx("div",{className:"relative",children:t.jsxs("div",{className:"flex items-start gap-2",children:[t.jsx("span",{className:"font-semibold text-sm text-gray-900 dark:text-gray-100",children:((a==null?void 0:a.companyName)||"yourbusiness").toLowerCase().replace(/\s+/g,"")}),t.jsxs("div",{className:"flex-1",children:[t.jsx(k,{...c("platformContent.primaryText"),placeholder:"Write a caption...",className:"border-0 p-0 resize-none text-sm leading-relaxed focus:ring-0 focus:outline-none bg-transparent min-h-[60px]",maxLength:2200,"data-testid":"input-caption"}),r&&t.jsx(x,{type:"button",variant:"ghost",size:"sm",className:"absolute top-0 right-0 h-6 px-2 text-xs",onClick:()=>r("primaryText"),disabled:e==null?void 0:e("primaryText"),"data-testid":"button-ai-caption",children:"AI"})]})]})}),t.jsxs("div",{className:"mt-2 relative",children:[t.jsx(m,{...c("platformContent.description"),placeholder:"Add hashtags... #business #marketing #success",className:"border-0 p-0 text-sm text-blue-600 dar

1k:text-blue-400 focus:ring-0 focus:outline-none bg-transparent",maxLength:500,"data-testid":"input-hashtags"}),r&&t.jsx(x,{type:"button",variant:"ghost",size:"sm",className:"absolute top-0 right-0 h-6 px-2 text-xs",onClick:()=>r("description"),disabled:e==null?void 0:e("description"),"data-testid":"button-ai-hashtags",children:"AI"})]}),t.jsxs("div",{className:"flex justify-between mt-2",children:[t.jsxs(i,{variant:"outline",className:"text-xs",children:["Caption: ",n.length,"/2200"]}),t.jsxs(i,{variant:"outline",className:"text-xs",children:["Hashtags: ",o.length,"/500"]})]}),t.jsxs("div",{className:"mt-3 relative",children:[t.jsx(m,{...c("destinationUrl"),placeholder:"https://your-website.com/landing-page",className:"border border-gray-200 dark:border-gray-600 text-xs text-gray-600 dark:text-gray-400 bg-white dark:bg-gray-800 rounded px-2 py-1","data-testid":"input-destination-url"}),t.jsxs("div",{className:"flex justify-between items-center mt-1",children:[t.jsx("div",{className:"text-xs text-gray-500",children:"Landing Page URL (Link in Bio)"}),t.jsx("div",{className:"text-xs text-green-600",children:h?"✓ Set":"⚠ Optional"})]})]})]}),t.jsxs("div",{className:"px-3 pb-3 text-sm text-gray-500",children:[t.jsx("div",{className:"mb-1",children:"View all 15 comments"}),t.jsx("div",{className:"text-xs text-gray-400",children:"2 hours ago"})]}),t.jsx("div",{className:"p-3 border-t bg-gray-50 dark:bg-gray-900",children:t.jsxs("div",{className:"text-xs text-gray-600 dark:text-gray-400 space-y-1",children:[t.jsxs("div",{children:["📱 ",t.jsx("strong",{children:"Instagram Best Practices:"})]}),t.jsx("div",{children:"• Use high-quality square images (1080x1080)"}),t.jsx("div",{children:"• Mix 5-10 relevant hashtags naturally"}),t.jsx("div",{children:"• Ask questions to encourage comments"}),t.jsx("div",{children:"• Post consistently at optimal times"})]})})]})}export{A as InstagramPostMockup};