1"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[68386],{68386:function(e,t,a){a.r(t),a.d(t,{default:function(){return M}});var i=a(57437),n=a(48736),o=a(53113),s=a(68919),r=a(50598),l=a(30401),c=a(51817),d=a(92735),m=a(82023),p=a(78867),x=a(17689),u=a(33276),h=a(2265),g=a(14438),f=a(24319),b=a(67044),w=a(9678),y=a(93448),v=a(70283);let j="A creator turns one awkward office moment into a funny vertical comic for Instagram, TikTok, and LinkedIn.",N=[{label:"Soft manga layout",url:"https://cdn.llamagen.ai/u/llamagen_system/ai-manga-generator/2026/05/ai-manga-generator-hero-wide-1779294647293-f9c836f7.webp"},{label:"Expressive character",url:"https://cdn.llamagen.ai/u/llamagen_system/ai-manga-generator/2026/05/ai-manga-generator-hero-portrait-1779294638302-8e3ee103.webp"},{label:"Panel flow",url:"https://cdn.llamagen.ai/u/llamagen_system/ai-manga-generator/2026/05/ai-manga-generator-story-flow-1779294794639-b3ef8a18.webp"},{label:"Creator studio",url:"https://cdn.llamagen.ai/web_public/media/thumbnails/next-generation-comic-studio-with-ai-superpowers-w1200-w640.webp"}],C=[{title:"Launch day, as a comic",platform:"LinkedIn carousel + X post",imageUrl:N[0].url,imageAlt:"A soft manga page layout used as a launch day comic example",idea:"A founder announces a product launch while tiny error bubbles keep trying to steal the spotlight.",outcome:"A relatable launch story with one clean punchline and a final frame that invites comments.",panels:["The founder hovers over the launch button with coffee in hand, looking excited and slightly nervous.","The product page goes live, but small error bubbles pop up around the screen like party confetti.","The team chat fills with fast fixes, calm checkmarks, and one message that says, 'Ship the story too.'","The founder turns the chaos into a comic post: 'Launch day is just user research with fireworks.'"],motionPrompt:"Slow push-in on the launch button, subtle bounce on the error bubbles, quick swipe-style pacing, keep the final caption readable.",referenceImage:N[0].url},{title:"Behind-the-scenes reveal",platform:"Instagram Reels + TikTok",imageUrl:N[1].url,imageAlt:"An expressive manga character used as a creator behind the scenes example",idea:"A creator asks for one simple thumbnail idea and accidentally discovers the perfect mini story for their next post.",outcome:"A light creator-process comic that feels personal without needing a long caption.",panels:["A creator opens a blank post draft and writes, 'Just need one thumbnail idea.'","The sketchbook fills itself with dramatic poses, reaction faces, and social captions.","The creator laughs, circles the simplest frame, and realizes it explains the whole video.","The final panel becomes the post: 'Sometimes the thumbnail is the script.'"],motionPrompt:"Animate paper sketches sliding into place, add gentle camera drift, keep the creator expression clear, finish with a crisp end card.",referenceImage:N[1].url},{title:"Explain it in panels",platform:"YouTube Shorts + Reels",imageUrl:N[2].url,imageAlt:"A comic panel flow used as an educational social media comic example",idea:"A teacher explains a confusing topic by turning each step into a tiny comic panel with a friendly visual metaphor.",outcome:"A short educational comic that can become a carousel, a short video, or a lesson recap.",panels:["A student stares at a complicated diagram and says, 'This looks impossible.'","The teacher folds the diagram into four simple comic panels, each showing one idea at a time.","Each panel adds a visual clue: setup, conflict, pattern, and result.","The student points at the final panel and says, 'Oh. I can repost this to remember it.'"],motionPrompt:"Use smooth panel-by-panel reveals, light zoom on each key idea, calm educational pacing, preserve all readable captions.",referenceImage:N[2].url},{title:"Community update, but fun",platform:"Discord + TikTok + Instagram",imageUrl:N[3].url,imageAlt:"A creator studio scene used as a community update comic example",idea:"A brand turns a routine community update into a playful comic about missing the content calendar and finding it in plain sight.",outcome:"A friendly update format that can announce launches, events, polls, or weekly recaps.",panels:["The community manager looks at an empty calendar and whispers, 'We had a plan yesterday.'","Post-it notes, comments, and member requests swirl into a messy but useful idea board.","The team groups the chaos into three updates: what shipped, what is next, and what to vote on.","The final comic frame says, 'Your comments wrote this week's roadmap.'"],motionPrompt:"Animate notes gathering into neat groups, add upbeat camera movement, hold on the final roadmap caption for easy reading.",referenceImage:N[3].url}],A=[{value:"gemini-3.1-flash-image-preview",label:"Balanced comic image",description:"Best default for readable panels, captions, and clean social posts.",modelType:"pro-fast",keyword:"social_media_comics"},{value:"bytedance/seedream-4.5",label:"Anime detail image",description:"Use when you want a sharper anime finish from your references.",modelType:"basic",keyword:"social_media_comics"}],F=[{label:"Portrait 9:16",value:"9:16",width:1080,height:1920},{label:"Square 1:1",value:"1:1",width:1080,height:1080},{label:"Wide 16:9",value:"16:9",width:1920,height:1080}
1],k=[{id:"story",label:"Idea",detail:"Write or paste",icon:n.Z},{id:"artwork",label:"Image",detail:"Generate comic",icon:o.Z},{id:"animation",label:"Animate & share",detail:"Download or post",icon:s.Z}],S={1:"Story ready",2:"Image ready",3:"Ready to share"};function B(e){return e.map((e,t)=>"Panel ".concat(t+1,": ").concat(e)).join("\n\n")}function E(e){let t=e.trim()||"Social media comic";return t.length>72?"".concat(t.slice(0,69),"..."):t}function T(e){let{motionPrompt:t,videoAspectRatio:a,videoLength:i,videoResolution:n}=e,o=F.find(e=>e.value===a)||F[0];return{prompt:t,aspectRatio:o.value,duration:i,resolution:n,width:o.width,height:o.height}}function _(e){let{activeStep:t,completedSteps:a}=e;return(0,i.jsx)("div",{className:"rounded-[24px] bg-[#F0F2F7] px-3 py-4 shadow-[0_18px_48px_rgba(32,35,52,0.08)] sm:rounded-[32px] sm:px-4 sm:py-5 lg:px-7",children:(0,i.jsx)("div",{className:"grid gap-3 sm:grid-cols-3 sm:gap-5",children:k.map((e,n)=>{let o=n+1,s=e.icon,r=a>=o;return(0,i.jsxs)("div",{className:"relative flex min-w-0 items-center gap-3",children:[n>0?(0,i.jsx)("div",{className:"absolute right-[calc(100%+0.25rem)] top-1/2 hidden h-[3px] w-8 -translate-y-1/2 rounded-full bg-[#FCAF1B] sm:block"}):null,(0,i.jsx)("div",{className:(0,y.cn)("flex h-12 w-12 shrink-0 items-center justify-center rounded-[18px] bg-white text-[18px] font-black text-[#FCAF1B] sm:h-[70px] sm:w-[70px] sm:rounded-[28px] sm:text-[24px]",t===o&&"ring-4 ring-[#FCAF1B]/25"),children:r?(0,i.jsx)(l.Z,{className:"h-6 w-6 sm:h-8 sm:w-8"}):String(o).padStart(2,"0")}),(0,i.jsxs)("div",{className:"min-w-0",children:[(0,i.jsxs)("div",{className:"flex items-center gap-2",children:[(0,i.jsx)(s,{className:"h-4 w-4 shrink-0 text-[#FCAF1B]"}),(0,i.jsx)("p",{className:"text-[15px] font-bold leading-6 text-[#2C1800] sm:text-[16px]",children:e.label})]}),(0,i.jsx)("p",{className:"text-[13px] leading-5 text-[#6B7085] sm:mt-1 sm:text-[14px]",children:r?S[o]:e.detail})]})]},e.id)})})})}function U(e){let{children:t,onClick:a,disabled:n,loading:o,variant:s="primary"}=e;return(0,i.jsxs)("button",{type:"button",onClick:a,disabled:n||o,className:(0,y.cn)("inline-flex min-h-[48px] w-full items-center justify-center gap-2 rounded-[16px] px-5 text-[16px] font-bold leading-6 transition disabled:cursor-not-allowed disabled:opacity-55 sm:w-auto","primary"===s&&"bg-[#1A1A1A] text-white hover:bg-[#2C1800]","secondary"===s&&"bg-[#FCAF1B] text-[#2C1800] hover:bg-[#FEDA62]","ghost"===s&&"border border-[#B0B5C4] bg-white text-[#2C1800] hover:border-[#FCAF1B]"),children:[o?(0,i.jsx)(c.Z,{className:"h-5 w-5 animate-spin"}):null,t]})}function I(e){let{artifact:t,onDownload:a,onShare:n}=e;return(0,i.jsxs)("div",{className:"mt-4 flex flex-wrap items-center gap-2",children:[(0,i.jsxs)("button",{type:"button",onClick:()=>a(t),disabled:!t.ready,className:"inline-flex h-11 flex-1 items-center justify-center gap-2 rounded-[12px] border border-[#B0B5C4] bg-white px-3 text-[14px] font-bold text-[#2C1800] transition hover:border-[#FCAF1B] disabled:cursor-not-allowed disabled:opacity-50 sm:h-10 sm:flex-none",children:[(0,i.jsx)(d.Z,{className:"h-4 w-4"}),"Download"]}),(0,i.jsxs)("button",{type:"button",onClick:()=>n(t),disabled:!t.ready,className:"inline-flex h-11 flex-1 items-center justify-center gap-2 rounded-[12px] border border-[#B0B5C4] bg-white px-3 text-[14px] font-bold text-[#2C1800] transition hover:border-[#FCAF1B] disabled:cursor-not-allowed disabled:opacity-50 sm:h-10 sm:flex-none",children:[(0,i.jsx)(s.Z,{className:"h-4 w-4"}),"Share"]}),t.ready?(function(e){let t=e.url&&!e.url.startsWith("blob:")?e.url:window.location.href,a="".concat(e.title," made with LlamaGen Social Media Comics");return[{label:"X",href:"https://twitter.com/intent/tweet?url=".concat(encodeURIComponent(t),"&text=").concat(encodeURIComponent(a)),icon:(0,i.jsx)(f.Zm,{className:"h-4 w-4 text-[#111111]"})},{label:"Facebook",href:"https://www.facebook.com/sharer/sharer.php?u=".concat(encodeURIComponent(t)),icon:(0,i.jsx)(f.Vq,{className:"h-4 w-4 text-[#4267B2]"})},{label:"LinkedIn",href:"https://www.linkedin.com/shareArticle?mini=true&url=".concat(encodeURIComponent(t),"&text=").concat(encodeURIComponent(a)),icon:(0,i.jsx)(r.Z,{className:"h-4 w-4 text-[#0A66C2]"})}]})(t).map(e=>(0,i.jsx)("a",{href:e.href,target:"_blank",rel:"noreferrer","aria-label":"Share ".concat(t.title," on ").concat(e.label),className:"inline-flex h-11 w-11 items-center justify-center rounded-[12px] border border-[#B0B5C4] bg-white transition hover:border-[#FCAF1B] sm:h-10 sm:w-10",children:e.icon},e.label)):null]})}function R(e){let{artifact:t,onDownload:a,onShare:n}=e;return(0,i.jsxs)("section",{className:"rounded-[16px] border border-[#
1E1E5EF] bg-white p-4 shadow-[0_12px_36px_rgba(32,35,52,0.06)]",children:[(0,i.jsxs)("div",{className:"flex flex-col gap-3 sm:flex-row sm:items-start sm:justify-between",children:[(0,i.jsxs)("div",{className:"min-w-0",children:[(0,i.jsx)("h3",{className:"text-[16px] font-bold leading-6 text-[#2C1800]",children:t.title}),(0,i.jsx)("p",{className:"mt-1 text-[14px] leading-6 text-[#6B7085]",children:t.description})]}),(0,i.jsx)("span",{className:(0,y.cn)("inline-flex h-8 w-fit shrink-0 items-center rounded-full px-3 text-[12px] font-bold",t.ready?"bg-[#E9FAF5] text-[#006C4A]":t.loading?"bg-[#FFF3D7] text-[#9A6400]":"bg-[#F0F2F7] text-[#6B7085]"),children:t.loading?"Working":t.ready?"Ready":"Waiting"})]}),t.url&&"artwork"===t.kind?(0,i.jsx)("div",{className:"mt-4 overflow-hidden rounded-[14px] border border-[#B0B5C4] bg-[#F8FAFC]",children:(0,i.jsx)("img",{src:t.url,alt:t.title,width:720,height:960,className:"h-auto w-full object-contain",loading:"lazy",decoding:"async"})}):null,t.url&&"animation"===t.kind?(0,i.jsx)("video",{className:"mt-4 aspect-[9/16] w-full rounded-[14px] border border-[#B0B5C4] bg-[#1A1A1A] object-contain",src:t.url,controls:!0,playsInline:!0}):null,t.text?(0,i.jsx)("pre",{className:"mt-4 max-h-[220px] overflow-auto whitespace-pre-wrap rounded-[14px] border border-[#E1E5EF] bg-[#F8FAFC] p-4 text-[14px] leading-6 text-[#2C1800]",children:t.text}):null,(0,i.jsx)(I,{artifact:t,onDownload:a,onShare:n})]})}function M(e){let{locale:t,embedded:a=!1}=e,{onOpen:n}=(0,v.n)(),[s,r]=(0,h.useState)(""),[l,d]=(0,h.useState)([]),[f,N]=(0,h.useState)(!1),[k,S]=(0,h.useState)(j),[I,M]=(0,h.useState)([]),[P,O]=(0,h.useState)(""),[L,Z]=(0,h.useState)([]),[D,W]=(0,h.useState)(A[0].value),[z,J]=(0,h.useState)(""),[Y,q]=(0,h.useState)(""),[G,K]=(0,h.useState)(""),[V,X]=(0,h.useState)(""),[H,Q]=(0,h.useState)(""),[$,ee]=(0,h.useState)("9:16"),[et,ea]=(0,h.useState)(5),[ei,en]=(0,h.useState)("720p"),[eo,es]=(0,h.useState)(1),[er,el]=(0,h.useState)(0),[ec,ed]=(0,h.useState)(null),[em,ep]=(0,h.useState)("Write a simple idea. We make the image, then animate it."),ex=A.find(e=>e.value===D)||A[0],eu=T({motionPrompt:H,videoAspectRatio:$,videoLength:et,videoResolution:ei}),eh=function(){var e,t,a,i,n,o,r,l,c,d,m,p,x;let u=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},h=null!==(t=u.script)&&void 0!==t?t:P,g=null!==(a=u.panels)&&void 0!==a?a:I,f=null!==(i=u.completedSteps)&&void 0!==i?i:er,b=null!==(n=u.activeStep)&&void 0!==n?n:eo;return{id:s||void 0,title:E(null!==(o=u.idea)&&void 0!==o?o:k),idea:null!==(r=u.idea)&&void 0!==r?r:k,panels:g,script:h,referenceImages:null!==(l=u.referenceImages)&&void 0!==l?l:L,imageModel:null!==(c=u.imageModel)&&void 0!==c?c:D,imageModelLabel:(null===(e=A.find(e=>{var t;
1return e.value===(null!==(t=u.imageModel)&&void 0!==t?t:D)}))||void 0===e?void 0:e.label)||A[0].label,artworkUrl:null!==(d=u.artworkUrl)&&void 0!==d?d:z,animationUrl:null!==(m=u.animationUrl)&&void 0!==m?m:Y,animeArtworkId:null!==(p=u.animeArtworkId)&&void 0!==p?p:G,predictionId:null!==(x=u.predictionId)&&void 0!==x?x:V,videoSettings:{...eu,...u.videoSettings||{}},completedSteps:f,activeStep:b}},eg=async()=>{N(!0);try{let e=await (0,b.h)("/api/social-media-comics?limit=8");if(!e.ok)return;let t=await e.json();d(t.items||[])}catch(e){d([])}finally{N(!1)}},ef=async function(){let e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},t=eh(e);try{var a;let e=await (0,b.h)("/api/social-media-comics",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({id:s||t.id,workflow:t})});if(!e.ok)return;let i=await e.json(),n=null===(a=i.artwork)||void 0===a?void 0:a.id;return n&&(r(n),eg()),n}catch(e){return}},eb=e=>{var t;let a=e.workflow||{},i=(null===(t=a.referenceImages)||void 0===t?void 0:t.length)?a.referenceImages:[],n=a.videoSettings||{},o=Math.min(a.completedSteps||(a.animationUrl?3:a.artworkUrl?2:a.script?1:0),3);r(e.id),S(a.idea||e.description||j),M(a.panels||[]),O(a.script||B(a.panels||[])),Z(i),W(A.some(e=>e.value===a.imageModel)?a.imageModel:A[0].value),J(a.artworkUrl||e.imageUrl||""),q(a.animationUrl||""),K(a.animeArtworkId||""),X(a.predictionId||""),Q(n.prompt||""),ee(n.aspectRatio||"9:16"),ea(Number(n.duration||5)),en(n.resolution||"720p"),el(o),es(Math.min(a.activeStep||o+1,3)),ep("Project opened. Continue from the next unfinished step.")},ew=async e=>{N(!0);try{let t=await (0,b.h)("/api/social-media-comics/".concat(encodeURIComponent(e)));if(!t.ok)throw Error("Could not open this project.");let a=await t.json();a.artwork&&(eb(a.artwork),g.Am.success("Project opened."))}catch(e){g.Am.error(e instanceof Error?e.message:"Could not open this project.")}finally{N(!1)}},ey=(0,w.k)({allowedTypes:["image/jpeg","image/png","image/webp","image/gif"],maxSize:16777216,prodFileUploadPath:e=>{var t;return t="references","u/".concat(e||"anonymous","/social-media-comics/").concat(t)},syncToUploadsOnSuccess:!0,syncToUploadsOptions:{tags:["social_media_comics","reference_image"],uploadType:"social_media_comics_reference"},onUploadSuccess:e=>{let t=[e];Z(t),ef({referenceImages:t}),g.Am.success("Reference image uploaded.")},onUploadError:e=>g.Am.error(e),onValidationError:e=>g.Am.warning(e)}),ev=(0,h.useMemo)(()=>[{kind:"script",title:"Story draft",description:"Your editable comic panels.",text:P,fileName:"social-media-comic-story.txt",mimeType:"text/plain",ready:!!P,loading:1===ec},{kind:"artwork",title:"Comic image",description:"Your generated comic image.",url:z,fileName:"social-media-comic-image.png",mimeType:"image/png",ready:!!z,loading:2===ec},{kind:"animation",title:"Animated clip",description:"Download or post this animated result.",url:Y,fileName:"social-media-comic-animation.mp4",mimeType:"video/mp4",ready:!!Y,loading:3===ec}],[Y,z,ec,P]);(0,h.useEffect)(()=>{let e=new URLSearchParams(window.location.search).get("id");eg(),e&&ew(e)},[]);let ej=()=>["Create a polished social media comic image for a short vertical post.","Readable panel flow, expressive character acting, strong hook, clean space for captions.","Make it audience-friendly, colorful, and suitable for social platforms.",L.length?"Use the selected references as style and composition guidance, without copying text.":"Create a clean vertical comic style from the script.",P||B(I)||k].join("\n"),eN=()=>H.trim()||["Turn this comic image into a short animated social post.","Use gentle camera motion, readable pacing, subtle parallax, and clear character emotion.","Keep the story meaning intact.",P||k].join("\n"),eC=async()=>{let e=k.trim();if(!e){g.Am.warning("Write a comic idea first.");return}es(1),ed(1),ep("Writing your comic beats...");try{let t=await (0,b.h)("/api/ai/storybook-write",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({prompt:"".concat(e,"\n\nWrite 4 to 6 concise comic panels for a social media comic. Include visual action, caption or dialogue intent, and a strong ending beat."),agent:"generate_sequential_story_panels"})}),a=await t.json().catch(()=>({}));if(402===t.status||(null==a?void 0:a.code)===402){let e=a.message||"Not enough credits. Add credits or upgrade to continue.";g.Am.warning(e),n("","Add credits",e),ep(e);return}if(!t.ok)throw Error(401===t.status?"Please sign in to write the story.":"Story generation failed.");let i=Array.isArray(a.panels)&&a.panels.length?a.panels.map(e=>
1e.trim()).filter(Boolean).slice(0,6):(a.story||a.text||a.message||e).split(/\n{2,}|:::PANEL_BREAK:::/).map(e=>e.trim()).filter(Boolean).slice(0,6),o=B(i);M(i),O(o),el(e=>Math.max(e,1)),es(2),ep("Story ready. Generate the image next."),ef({idea:e,panels:i,script:o,completedSteps:1,activeStep:2}),g.Am.success("Story ready.")}catch(e){g.Am.error(e instanceof Error?e.message:"Story generation failed."),ep("Story generation failed. Try a more specific idea.")}finally{ed(null)}},eA=async()=>{let e=P.trim();if(!e){g.Am.warning("Confirm the story first.");return}es(2),ed(2),ep("Creating the comic image...");try{let t=new FormData;t.set("prompt",ej()),t.set("aspect_ratio","9:16"),t.set("modelType",ex.modelType),t.set("model",ex.value),t.set("keyword",ex.keyword),t.set("tags",JSON.stringify(["social_media_comics","comic_image","social_post"])),t.set("num_outputs","1"),L.length&&t.set("refImageUrl",L.join(","));let a=await (0,b.h)("/api/arts/img-to-img-v4",{method:"POST",body:t}),i=await a.json().catch(()=>({}));if(402===a.status||(null==i?void 0:i.code)===402){let e=i.message||"Not enough credits. Add credits or upgrade to continue.";g.Am.warning(e),n("","Add credits",e),ep(e);return}if(!a.ok||void 0!==i.code&&200!==i.code)throw Error(401===a.status?"Please sign in to create the image.":i.message||"Image generation failed.");if(!i.imageUrl)throw Error(i.message||"No image URL returned.");J(i.imageUrl),el(e=>Math.max(e,2)),es(3),ep("Image ready. Animate it next."),ef({script:e,referenceImages:L,imageModel:D,artworkUrl:i.imageUrl,completedSteps:2,activeStep:3}),g.Am.success("Comic image ready.")}catch(e){g.Am.error(e instanceof Error?e.message:"Image generation failed."),ep("Image generation failed. Try fewer references or a clearer story.")}finally{ed(null)}},eF=async e=>{for(let t=0;t<90;t+=1){let a=await (0,b.h)("/api/ai/predictions/".concat(encodeURIComponent(e)));if(!a.ok){await new Promise(e=>setTimeout(e,2500));continue}let i=await a.json();if("succeeded"===i.status)return i;if("failed"===i.status||"canceled"===i.status)throw Error(i.error||"Motion generation failed.");ep("Adding motion... ".concat(t+1,"/90")),await new Promise(e=>setTimeout(e,2500))}throw Error("The motion clip is still running. Open this project again later.")},ek=async()=>{if(!z){g.Am.warning("Create the comic image first.");return}let e=T({motionPrompt:eN(),videoAspectRatio:$,videoLength:et,videoResolution:ei});es(3),ed(3),ep("Adding motion to the comic image...");try{var t,a,i,o;let s=await (0,b.h)("/api/anime2",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({name:"Social Media Comic motion clip",preset:"social_media_comics",prompt:e.prompt,generationType:"image-to-video",uploadedImage:z,videoLength:e.duration,videoResolution:e.resolution,aspectRatio:e.aspectRatio,toolId:"image_to_video",selectedStyle:{label:"Social media comic",preset:"ANIME"},outputCount:1,model:"seedance-2-fast",platform:"replicate"})}),r=await s.json().catch(()=>({}));if(402===s.status||(null==r?void 0:r.code)===402){let e=r.message||"Not enough credits. Add credits or upgrade to continue.";g.Am.warning(e),n("","Add credits",e),ep(e);return}if(!s.ok)throw Error(401===s.status?"Please sign in to add motion.":"Motion generation failed.");let l=(null===(t=r.artwork)||void 0===t?void 0:t.id)||"",c=(null===(a=r.prediction)||void 0===a?void 0:a.id)||"";l&&K(l),c&&X(c);let d=function(e){if("string"==typeof e)return e;if(Array.isArray(e)){let t=e.find(e=>"string"==typeof e);return"string"==typeof t?t:void 0}if(e&&"object"==typeof e){let t=[e.video,e.url,e.output,e.file].find(e=>"string"==typeof e);return"string"==typeof t?t:void 0}}(null===(i=r.prediction)||void 0===i?void 0:i.output);if((null===(o=r.prediction)||void 0===o?void 0:o.status)==="succeeded"&&d&&q(d),!l||!c)throw Error(r.message||"The motion job was not created.");await eF(c);let m=await (0,b.h)("/api/anime2/".concat(l,"/finish"),{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({predictionId:c})}),p=await m.json();if(!m.ok)throw Error(p.error||"Motion post-processing failed.");let x=function(e,t){var a,i,n,o,s,r;let l=null===(a=e.processedFiles)||void 0===a?void 0:a.find(Boolean);if(l)return l;let c=(null===(i=e.updatedArtwork)||void 0===i?void 0:i.comicData)||(null==t?void 0:null===(n=t.artwork)||void 0===n?void 0:n.comicData)||"";if(c)try{let e=JSON.parse(c),t=Array.isArray(e)?null===(r=e.find(e=>null==e?void 0:e.videoUrl))||void 0===r?void 0:r.videoUrl:null==e?void 0:e.videoUrl;if("string"==typeof t&&t)return t}catch(e){return}return(null===(o=e.updatedArtwork)||void 0===o?void 0:o.imageUrl)||(null==t?void 0:null===(s=t.artwork)||void 0===s?void 0:s.imageUrl)||void 0}(p,r)||d;if(!x)throw Error("Motion completed but no video URL was returned.");q(x),el(e=>Math.max(e,3)),es(3),ep("Animation ready. Download or share it from Results."),ef({animationUrl:x,animeArtworkId:l,predictionId:c,videoSettings:e,completedSteps:3,activeStep:3}),g.Am.success("Motion clip ready.")}catch(e){g.Am.error(e instanceof Error?e.message:"Motion generation failed."),ep("Motion generation failed. You can adjust the settings and try again.")}finally{ed(null)}},eS=e=>{let t=null==e?void 0:e[0];t&&ey.handleUpload([t])},eB=async e=>{if(e.ready)try{let t=e.text?new Blob([e.text],{type:e.mimeType}):e.url?await (0,b.h)(e.url).then(e=>e.blob()):null;if(!t)return;let a=URL.createObjectURL(t),i=document.createElement("a");i.href=a,i.download=e.fileName,document.body.appendChild(i),i.click(),document.body.removeChild(i),URL.revokeObjectURL(a)}catch(t){e.url?window.open(e.url,"_blank","noopener,noreferrer"):g.Am.error("Download failed.")}},eE=async e=>{if(!e.ready)return;let t=e.url&&!e.url.startsWith("blob:")?e.url:window.location.href,a=e.text?e.text.slice(0,240):"".concat(e.title," from LlamaGen Social Media Comics");try{navigator.share?await navigator.share({title:e.title,text:a,url:t}):(await navigator.clipboard.writeText("".concat(e.title,"\n").concat(a,"\n").concat(t)),g.Am.success("Share text copied."))}catch(i){await navigator.clipboard.writeText("".concat(e.title,"\n").concat(a,"\n").concat(t)),g.Am.success("Share text copied.")}},eT=async()=>{P&&(await navigator.clipboard.writeText(P),g.Am.success("Story copied."))},e_=e=>{let t=B(e.panels),a={...eu,prompt:e.motionPrompt};r(""),S(e.idea),M(e.panels),O(t),Z([e.referenceImage]),W(A[0].value),J(""),q(""),K(""),X(""),Q(e.motionPrompt),el(1),es(2),ep("Example loaded. Edit the story or create the comic image."),(0,b.h)("/api/social-media-comics",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({workflow:{title:E(e.idea),idea:e.idea,panels:e.panels,script:t,referenceImages:[e.referenceImage],imageModel:A[0].value,imageModelLabel:A[0].label,videoSettings:a,completedSteps:1,activeStep:2}})}).then(async e=>{var t;if(!e.ok)return;let a=await e.json();(null===(t=a.artwork)||void 0===t?void 0:t.id)&&(r(a.artwork.id),eg())}).catch(()=>void 0),g.Am.success("Example loaded.")},eU=e=>{if(!e)return"";try{return new Intl.DateTimeFormat(t||"en",{month:"short",day:"numeric",hour:"2-digit",minute:"2-digit"}).format(new Date(e))}catch(e){return""}};return(0,i.jsx)("main",{className:(0,y.cn)("bg-white font-redhatText text-[#2C1800]",!a&&"min-h-screen"),children:(0,i.jsx)("section",{className:(0,y.cn)("mx-auto w-full max-w-[1280px]",a?"px-0 py-0":"px-3 py-5 sm:px-8 sm:py-8 lg:py-10"),children:(0,i.jsxs)("div",{className:(0,y.cn)(a?"space-y-5":"space-y-6 sm:space-y-8"),children:[a?null:(0,i.jsxs)("div",{className:"max-w-[920px]",children:[(0,i.jsx)("p",{className:"text-[14px] font-bold uppercase text-[#FCAF1B]",children:"Social Media Comics"}),(0,i.jsx)("h1",{className:"mt-2 max-w-4xl text-[34px] font-black leading-[1.08] text-[#2C1800] sm:mt-3 sm:text-[58px] lg:text-[70px]",children:"Turn one idea into a comic post people can share."}),(0,i.jsx)("p",{className:"mt-4 max-w-3xl text-[16px] leading-7 text-[#4A3A29] sm:mt-5 sm:text-[18px] sm:leading-8",children:"Write a simple idea, generate a comic image, then turn that image into an animated post for TikTok, Instagram, YouTube, or LinkedIn."})]}),(0,i.jsx)(_,{activeStep:eo,completedSteps:er}),a?null:(0,i.jsxs)("section",{className:"overflow-hidden rounded-[24px] border border-[#B0B5C4] bg-white shadow-[0_24px_80px_rgba(32,35,52,0.08)] sm:rou
1nded-[32px]",children:[(0,i.jsx)("div",{className:"border-b border-[#E1E5EF] bg-[#F0F2F7] px-4 py-4 sm:px-7 sm:py-5",children:(0,i.jsxs)("div",{className:"flex flex-col gap-3 sm:flex-row sm:flex-wrap sm:items-end sm:justify-between sm:gap-4",children:[(0,i.jsxs)("div",{className:"max-w-2xl",children:[(0,i.jsx)("h2",{className:"text-[20px] font-black leading-7 text-[#2C1800] sm:text-[24px] sm:leading-8",children:"Simple examples to remix"}),(0,i.jsx)("p",{className:"mt-2 text-[15px] leading-6 text-[#6B7085]",children:"Pick one, edit the idea, then generate."})]}),(0,i.jsx)("p",{className:"w-fit rounded-full border border-[#B0B5C4] bg-white px-4 py-2 text-[13px] font-bold leading-5 text-[#6B7085]",children:"Click to load"})]})}),(0,i.jsx)("div",{className:"flex gap-4 overflow-x-auto p-4 sm:grid sm:grid-cols-2 sm:overflow-visible sm:p-7 xl:grid-cols-4",children:C.map(e=>(0,i.jsxs)("article",{className:"flex min-h-full min-w-[270px] max-w-[310px] flex-col overflow-hidden rounded-[20px] border border-[#E1E5EF] bg-white shadow-[0_12px_36px_rgba(32,35,52,0.05)] sm:min-w-0 sm:max-w-none sm:rounded-[24px]",children:[(0,i.jsx)("div",{className:"relative aspect-[4/3] bg-[#F8FAFC]",children:(0,i.jsx)("img",{src:e.imageUrl,alt:e.imageAlt,className:"h-full w-full object-cover",loading:"lazy",decoding:"async"})}),(0,i.jsxs)("div",{className:"flex flex-1 flex-col p-4",children:[(0,i.jsx)("p",{className:"text-[12px] font-bold uppercase leading-5 text-[#6B7085]",children:e.platform}),(0,i.jsx)("h3",{className:"mt-2 text-[18px] font-black leading-6 text-[#2C1800]",children:e.title}),(0,i.jsx)("p",{className:"mt-3 line-clamp-3 text-[14px] leading-6 text-[#6B7085] sm:line-clamp-none",children:e.idea}),(0,i.jsx)("p",{className:"mt-3 line-clamp-3 rounded-[14px] border border-[#E1E5EF] bg-[#F8FAFC] p-3 text-[13px] font-medium leading-5 text-[#2C1800] sm:line-clamp-none",children:e.outcome}),(0,i.jsxs)("button",{type:"button",onClick:()=>e_(e),className:"mt-4 inline-flex min-h-[44px] w-full items-center justify-center gap-2 rounded-[14px] border border-[#B0B5C4] bg-white px-4 text-[14px] font-bold text-[#2C1800] transition hover:border-[#FCAF1B] hover:text-[#2C1800]",children:[(0,i.jsx)(m.Z,{className:"h-4 w-4 text-[#FCAF1B]"}),"Use this case"]})]})]},e.title))})]}),(0,i.jsxs)("div",{className:"grid gap-6 xl:grid-cols-[minmax(0,1.05fr)_minmax(420px,0.95fr)] xl:gap-8",children:[(0,i.jsx)("div",{className:"space-y-6 sm:space-y-8",children:(0,i.jsxs)("section",{className:"rounded-[24px] border border-[#B0B5C4] bg-white shadow-[0_24px_80px_rgba(32,35,52,0.08)] sm:rounded-[32px]",children:[(0,i.jsxs)("div",{className:"border-b border-[#E1E5EF] bg-[#F0F2F7] px-4 py-4 sm:px-7",children:[(0,i.jsx)("h2",{className:"text-[20px] font-bold leading-7 text-[#2C1800]",children:"Create your comic post"}),(0,i.jsx)("p",{className:"mt-1 text-[14px] leading-6 text-[#6B7085]",children:em})]}),(0,i.jsxs)("div",{className:"space-y-7 p-4 sm:space-y-8 sm:p-7",children:[(0,i.jsxs)("section",{className:"space-y-4",children:[(0,i.jsxs)("div",{className:"flex flex-col gap-3 sm:flex-row sm:flex-wrap sm:items-end sm:justify-between",children:[(0,i.jsxs)("div",{className:"min-w-0",children:[(0,i.jsx)("h3",{className:"text-[16px] font-bold leading-6",children:"1. Your idea"}),(0,i.jsx)("p",{className:"text-[14px] leading-6 text-[#6B7085]",children:"Type a moment, joke, lesson, or post idea."})]}),(0,i.jsxs)(U,{onClick:eC,loading:1===ec,children:[(0,i.jsx)(m.Z,{className:"h-5 w-5"}),"Make story"]})]}),(0,i.jsx)("textarea",{value:k,onChange:e=>S(e.target.value),className:"min-h-[132px] w-full resize-y rounded-[16px] border border-[#B0B5C4] bg-white p-4 text-[16px] leading-7 text-[#2C1800] outline-none transition focus:border-[#FCAF1B] focus:ring-4 focus:ring-[#FCAF1B]/20 sm:min-h-[140px]",placeholder:"Example: A creator tries to make one quick post, but the idea keeps growing."}),P?(0,i.jsxs)("div",{className:"space-y-3",children:[(0,i.jsxs)("div",{className:"flex items-center justify-between gap-3",children:[(0,i.jsx)("p",{className:"text-[14px] font-bold text-[#2C1800]",children:"Story"}),(0,i.jsxs)("button",{type:"button",onClick:eT,className:"inline-flex h-9 items-center gap-2 rounded-[12px] border border-[#B0B5C4] bg-white px-3 text-[14px] font-bold text-[#2C1800] hover:border-[#FCAF1B]",children:[(0,i.jsx)(p.Z,{className:"h-4 w-4"}),"Copy"]})]}),(0,i.jsx)("textarea",{value:P,onChange:e=>{O(e.target.value),ef({script:e.target.value})},className:"min-h-[180px] w-full resize-y rounded-[16px] border border-[#B0B5C4] bg-white p-4 text-[16px] leading-7 text-[#2C1800] outline-none transition focus:border-[#FCAF1B] focus:ring-4 focus:ring-[#FCAF1B]/20 sm:min-h-[220px]"})]}):null]}
1),(0,i.jsxs)("section",{className:"space-y-4 border-t border-[#E1E5EF] pt-7 sm:pt-8",children:[(0,i.jsxs)("div",{className:"flex flex-col gap-3 sm:flex-row sm:flex-wrap sm:items-end sm:justify-between",children:[(0,i.jsxs)("div",{className:"min-w-0",children:[(0,i.jsx)("h3",{className:"text-[16px] font-bold leading-6",children:"2. Generate image"}),(0,i.jsx)("p",{className:"text-[14px] leading-6 text-[#6B7085]",children:"Turn the story into one comic image."})]}),(0,i.jsxs)(U,{onClick:eA,loading:2===ec,disabled:!P,variant:"secondary",children:[(0,i.jsx)(o.Z,{className:"h-5 w-5"}),"Generate image"]})]}),(0,i.jsxs)("div",{className:"rounded-[16px] border border-[#E1E5EF] bg-[#F8FAFC] p-4",children:[(0,i.jsxs)("div",{className:"flex flex-col gap-3 sm:flex-row sm:flex-wrap sm:items-center sm:justify-between",children:[(0,i.jsxs)("div",{className:"min-w-0",children:[(0,i.jsx)("p",{className:"text-[14px] font-bold text-[#2C1800]",children:"Reference image"}),(0,i.jsx)("p",{className:"text-[13px] leading-5 text-[#6B7085]",children:"Optional. Add one image for style guidance."})]}),(0,i.jsxs)("label",{className:"inline-flex min-h-[44px] w-full cursor-pointer items-center justify-center gap-2 rounded-[14px] border border-[#B0B5C4] bg-white px-4 text-[14px] font-bold text-[#2C1800] transition hover:border-[#FCAF1B] sm:w-auto",children:[ey.isUploading?(0,i.jsx)(c.Z,{className:"h-4 w-4 animate-spin text-[#FCAF1B]"}):(0,i.jsx)(x.Z,{className:"h-4 w-4 text-[#FCAF1B]"}),"Add image",(0,i.jsx)("input",{type:"file",accept:"image/jpeg,image/png,image/webp,image/gif",className:"sr-only",onChange:e=>eS(e.target.files)})]})]}),L[0]?(0,i.jsxs)("div",{className:"mt-4 flex items-center gap-3 rounded-[14px] border border-[#E1E5EF] bg-white p-3",children:[(0,i.jsx)("span",{className:"relative h-16 w-16 shrink-0 overflow-hidden rounded-[12px] bg-[#F0F2F7]",children:(0,i.jsx)("img",{src:L[0],alt:"Selected reference",className:"h-full w-full object-cover",loading:"lazy",decoding:"async"})}),(0,i.jsx)("span",{className:"text-[14px] font-bold text-[#2C1800]",children:"Reference added"})]}):null]})]}),(0,i.jsxs)("section",{className:"space-y-4 border-t border-[#E1E5EF] pt-7 sm:pt-8",children:[(0,i.jsxs)("div",{className:"flex flex-col gap-3 sm:flex-row sm:flex-wrap sm:items-end sm:justify-between",children:[(0,i.jsxs)("div",{className:"min-w-0",children:[(0,i.jsx)("h3",{className:"text-[16px] font-bold leading-6",children:"3. Animate & share"}),(0,i.jsx)("p",{className:"text-[14px] leading-6 text-[#6B7085]",children:"Make the image move, then download or post it."})]}),(0,i.jsxs)(U,{onClick:ek,loading:3===ec,disabled:!z,variant:"ghost",children:[(0,i.jsx)(u.Z,{className:"h-5 w-5"}),"Animate image"]})]}),(0,i.jsxs)("div",{className:"grid gap-3 md:grid-cols-[minmax(0,1fr)_220px]",children:[(0,i.jsxs)("label",{className:"space-y-2",children:[(0,i.jsx)("span",{className:"text-[14px] font-bold text-[#2C1800]",children:"Motion note"}),(0,i.jsx)("textarea",{value:H,onChange:e=>{Q(e.target.value),ef({videoSettings:{...eu,prompt:e.target.value}})},className:"min-h-[96px] w-full resize-y rounded-[16px] border border-[#B0B5C4] bg-white p-4 text-[16px] leading-7 text-[#2C1800] outline-none transition focus:border-[#FCAF1B] focus:ring-4 focus:ring-[#FCAF1B]/20",placeholder:"Optional. Leave blank for simple motion."})]}),(0,i.jsxs)("label",{className:"space-y-2",children:[(0,i.jsx)("span",{className:"text-[14px] font-bold text-[#2C1800]",children:"Display ratio"}),(0,i.jsx)("select",{value:$,onChange:e=>{ee(e.target.value),ef({videoSettings:T({motionPrompt:H,videoAspectRatio:e.target.value,videoLength:et,videoResolution:ei})})},className:"h-12 w-full rounded-[16px] border border-[#B0B5C4] bg-white px-4 text-[16px] font-bold text-[#2C1800] outline-none focus:border-[#FCAF1B] focus:ring-4 focus:ring-[#FCAF1B]/20",children:F.map(e=>(0,i.jsx)("option",{value:e.value,children:e.label},e.value))})]})]})]})]})]})}),(0,i.jsxs)("aside",{className:"space-y-5 xl:self-start",children:[(0,i.jsxs)("section",{className:"rounded-[24px] border border-[#B0B5C4] bg-white shadow-[0_24px_80px_rgba(32,35,52,0.08)] sm:rou
1nded-[32px]",children:[(0,i.jsxs)("div",{className:"border-b border-[#E1E5EF] bg-[#F0F2F7] px-4 py-4 sm:px-7",children:[(0,i.jsx)("h2",{className:"text-[20px] font-bold leading-7 text-[#2C1800]",children:"Recent projects"}),(0,i.jsx)("p",{className:"mt-1 text-[14px] leading-6 text-[#6B7085]",children:"Open a saved comic."})]}),(0,i.jsxs)("div",{className:"space-y-3 p-4 sm:p-7",children:[f&&!l.length?(0,i.jsxs)("div",{className:"flex items-center gap-2 text-[14px] font-bold text-[#6B7085]",children:[(0,i.jsx)(c.Z,{className:"h-4 w-4 animate-spin"}),"Loading projects"]}):null,f||l.length?null:(0,i.jsx)("p",{className:"rounded-[16px] bg-[#F8FAFC] p-4 text-[14px] leading-6 text-[#6B7085]",children:"Your saved comic projects will appear here after the first step."}),l.map((e,t)=>{var a;return(0,i.jsxs)("button",{type:"button",onClick:()=>ew(e.id),className:(0,y.cn)("flex w-full items-center gap-3 rounded-[16px] border p-3 text-left transition hover:border-[#FCAF1B]",s===e.id?"border-[#FCAF1B] bg-[#F8FAFC]":"border-[#E1E5EF] bg-white"),children:[(0,i.jsx)("span",{className:"relative h-16 w-16 shrink-0 overflow-hidden rounded-[14px] bg-[#F0F2F7]",children:e.imageUrl?(0,i.jsx)("img",{src:e.imageUrl,alt:e.name||"Saved comic project",className:"h-full w-full object-cover",loading:"lazy",decoding:"async"}):(0,i.jsx)(m.Z,{className:"absolute left-1/2 top-1/2 h-6 w-6 -translate-x-1/2 -translate-y-1/2 text-[#FCAF1B]"})}),(0,i.jsxs)("span",{className:"min-w-0 flex-1",children:[(0,i.jsxs)("span",{className:"line-clamp-2 text-[14px] font-bold leading-5 text-[#2C1800]",children:[0===t?"Last project: ":"",(null===(a=e.workflow)||void 0===a?void 0:a.title)||e.name||"Social media comic"]}),(0,i.jsx)("span",{className:"mt-1 block text-[12px] leading-5 text-[#6B7085]",children:eU(e.updatedAt)})]})]},e.id)})]})]}),(0,i.jsxs)("section",{className:"overflow-hidden rounded-[24px] border border-[#B0B5C4] bg-white shadow-[0_24px_80px_rgba(32,35,52,0.08)] sm:rounded-[32px]",children:[(0,i.jsxs)("div",{className:"border-b border-[#E1E5EF] bg-[#F0F2F7] px-4 py-4 sm:px-7",children:[(0,i.jsx)("h2",{className:"text-[20px] font-bold leading-7 text-[#2C1800]",children:"Share"}),(0,i.jsx)("p",{className:"mt-1 text-[14px] leading-6 text-[#6B7085]",children:"Download or post your image and animation."})]}),(0,i.jsx)("div",{className:"space-y-4 p-4 sm:p-7",children:ev.map(e=>(0,i.jsx)(R,{artifact:e,onDownload:eB,onShare:eE},e.kind))})]})]})]})]})})})}}}]);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.