https://app.apatero.ai/assets/AP_visual_novel-Biht_ocQ.js

1import{j as e}from"./ui-DaFuZ01i.js";import{r}from"./react-Cpv6i7A2.js";import{aj as V,g as j,j as v}from"./index-KuEB_Bhl.js";import{P as B,a as I,S as b,b as N,E as k}from"./AP_page_shell-jBRPy-Es.js";import{I as M}from"./AP_image_lightbox-DxEa57rN.js";import"./charts-BuNFTP41.js";import"./router-CMEZEjyI.js";const U=({className:t})=>e.jsx("svg",{className:t,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round",children:e.jsx("path",{d:"M3 16.5v2.25A2.25 2.25 0 0 0 5.25 21h13.5A2.25 2.25 0 0 0 21 18.75V16.5M16.5 12 12 16.5m0 0L7.5 12m4.5 4.5V3"})}),S=({className:t})=>e.jsx("svg",{className:t,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.6",strokeLinecap:"round",strokeLinejoin:"round",children:e.jsx("path",{d:"M12 6.5C10.5 5 8 4.5 4 5v13c4-.5 6.5 0 8 1.5M12 6.5C13.5 5 16 4.5 20 5v13c-4-.5-6.5 0-8 1.5M12 6.5V20"})});function H(){const[t,o]=r.useState(null),[l,c]=r.useState(""),[x,u]=r.useState("storybook"),[h,m]=r.useState(null),[n,g]=r.useState(!1),[p,f]=r.useState(!1),s=r.useRef(null),{data:a}=V({queryKey:["vn","config"],queryFn:()=>j.getVisualNovelConfig(),staleTime:5*60*1e3}),C=a?.styles??[{slug:"storybook",label:"Storybook"}],P=a?.credits_cost??54,w=a?.scene_count??6,_=r.useCallback(async i=>{g(!0);try{const d=await j.uploadFile(i,"image");m({id:d.id,url:d.image_url??d.url??""})}catch(d){v.error(d instanceof Error?d.message:"Upload failed")}finally{g(!1)}},[]),E=r.useCallback(async()=>{if(!(!h||l.trim().length<4)){f(!0);try{const i=await j.createVisualNovel({premise:l.trim(),style:x,protagonist_image_id:h.id});o(i)}catch(i){v.error(i instanceof Error?i.message:"Failed to start")}finally{f(!1)}}},[h,l,x]);r.useEffect(()=>{if(!t||t.status==="ready"||t.status==="failed")return;const i=setInterval(async()=>{try{o(await j.getVisualNovel(t.id))}catch{}},3e3);return()=>clearInterval(i)},[t]);const A=()=>{o(null),m(null),c("")},L=!!h&&l.trim().length>=4&&!p;return e.jsxs(B,{children:[e.jsx(I,{description:"Write a premise, pick a style, add a face. Apatero writes a branching story and renders every scene, then you play it: click choices, reach one of three endings.",action:t?e.jsx(b,{onClick:A,children:"New Story"}):void 0}),t?t.status==="failed"?e.jsx(k,{icon:e.jsx(S,{className:"h-7 w-7"}),title:"Story failed",description:t.error_message||"Something went wrong. Start a new story to try again."}):t.status!=="ready"?e.jsx(W,{novel:t,sceneCount:w}):e.jsx(F,{novel:t}):e.jsxs("div",{className:"space-y-8",children:[e.jsxs("section",{children:[e.jsx(y,{n:1,title:"Your Story Idea"}),e.jsx("textarea",{value:l,onChange:i=>c(i.target.value),rows:3,placeholder:"e.g. A lighthouse keeper discovers a door in the sea that only opens at midnight.",className:"w-full resize-none rounded-2xl border border-white/10 bg-white/5 px-4 py-3 text-sm text-white placeholder-white/30 outline-none transition-colors focus:border-lime-500/40"})]}),e.jsxs("section",{children:[e.jsx(y,{n:2,title:"Pick an Art Style"}),e.jsx("div",{className:"flex flex-wrap gap-1.5",children:C.map(i=>e.jsx("button",{onClick:()=>u(i.slug),className:"inline-flex min-h-[44px] items-center rounded-full px-4 py-1.5 text-sm font-medium transition-all sm:min-h-0 "+(x===i.slug?"bg-white text-black":"bg-white/5 text-white/60 hover:bg-white/10 hover:text-white"),children:i.label},i.slug))})]}),e.jsxs("section",{children:[e.jsx(y,{n:3,title:"Your Protagonist"}

1),h?e.jsxs("div",{className:"flex items-center gap-4 rounded-2xl border border-lime-500/30 bg-lime-500/5 p-4",children:[e.jsx("img",{src:h.url,alt:"Protagonist",className:"h-20 w-20 rounded-xl object-cover"}),e.jsxs("div",{className:"flex-1",children:[e.jsx("div",{className:"text-sm font-semibold text-white",children:"Face locked in"}),e.jsx("div",{className:"mt-0.5 text-xs text-white/50",children:"This person is the hero of every scene."})]}),e.jsx(b,{onClick:()=>m(null),className:"px-4 py-2",children:"Change"})]}):e.jsx("button",{onClick:()=>s.current?.click(),disabled:n,className:"flex h-40 w-full items-center justify-center rounded-2xl border-2 border-dashed border-white/10 bg-white/5 transition-all hover:border-lime-500/30 hover:bg-white/10",children:e.jsxs("div",{className:"text-center",children:[e.jsx(U,{className:"mx-auto mb-2 h-8 w-8 text-white/30"}),e.jsx("div",{className:"text-sm font-semibold text-white",children:n?"Uploading…":"Upload the hero’s photo"}),e.jsx("div",{className:"mt-0.5 text-xs text-white/40",children:"A clear, front-facing face works best."})]})})]}),e.jsxs("section",{className:"pt-2",children:[e.jsx(N,{onClick:E,disabled:!L,className:"w-full px-6 py-4 text-base shadow-lg shadow-lime-400/20",children:p?"Starting…":`Write My Story (${P} tokens)`}),e.jsxs("p",{className:"mt-2 text-center text-xs text-white/40",children:[w," scenes, 2 choices, 3 endings."]})]}),e.jsx("input",{ref:s,type:"file",accept:"image/*",className:"hidden",onChange:i=>{const d=i.target.files?.[0];d&&_(d),i.target.value=""}})]})]})}function W({novel:t,sceneCount:o}){const l=t.nodes.filter(x=>x.status==="completed").length,c=t.status==="drafting"||t.nodes.length===0;return e.jsxs("div",{className:"flex flex-col items-center justify-center gap-4 roun

1ded-2xl border border-white/10 bg-white/5 py-16 text-center",children:[e.jsx("div",{className:"h-8 w-8 animate-spin rounded-full border-2 border-white/20 border-t-lime-400"}),e.jsx("div",{className:"text-sm font-semibold text-white",children:c?"Writing your branching story…":`Rendering scenes ${l}/${o}…`}),e.jsx("div",{className:"max-w-sm text-xs text-white/40",children:c?"Apatero is plotting the paths and the three endings.":"Each scene keeps your protagonist consistent. This takes a minute."}),t.title&&e.jsx("div",{className:"mt-2 text-xs uppercase tracking-wider text-lime-400/80",children:t.title})]})}function F({novel:t}){const o=r.useMemo(()=>{const s={};for(const a of t.nodes)s[a.key]=a;return s},[t.nodes]),[l,c]=r.useState("start"),[x,u]=r.useState([]),[h,m]=r.useState(null),n=o[l]??t.nodes[0];if(!n)return e.jsx(k,{icon:e.jsx(S,{className:"h-7 w-7"}),title:"Empty story",description:"No scenes were produced."});const g=s=>{u(a=>[...a,l]),c(s)},p=()=>{u(s=>{if(s.length===0)return s;const a=s[s.length-1];return c(a),s.slice(0,-1)})},f=()=>{u([]),c("start")};return e.jsxs("div",{className:"mx-auto max-w-3xl space-y-5",children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx("span",{className:"text-sm font-semibold text-white",children:t.title}),x.length>0&&e.jsx(b,{onClick:p,className:"ml-auto px-3 py-1.5 text-xs",children:"Back"})]}),e.jsx("div",{className:"overflow-hidden rounded-2xl border border-white/10 bg-black/40",children:n.image?e.jsx("img",{src:n.image,alt:"",onClick:()=>m(n.image),className:"max-h-[52vh] w-full cursor-zoom-in object-cover"}):e.jsx("div",{className:"flex aspect-video w-full items-center justify-center text-white/30",children:"Scene image unavailable"})}),e.jsx(M,{src:h,onClose:()=>m(null)}),e.jsx("p",{className:"whitespace-pre-line text-[15px] leading-relaxed text-white/85",children:n.narration}),n.is_ending?e.jsxs("div",{className:"space-y-4 rounded-2xl border border-lime-500/30 bg-lime-500/5 p-5 text-center",children:[e.jsx("div",{className:"text-[11px] font-semibold uppercase tracking-widest text-lime-400/80",children:"Ending"}),n.ending_label&&e.jsx("div",{className:"text-lg font-bold text-white",children:n.ending_label}),e.jsxs("div",{className:"flex flex-wrap justify-center gap-2",children:[e.jsx(N,{onClick:f,className:"px-5 py-2.5 text-sm",children:"Play Again"}),x.length>0&&e.jsx(b,{onClick:p,className:"px-5 py-2.5 text-sm",children:"Try the Other Path"})]})]}):e.jsxs("div",{className:"space-y-2",children:[e.jsx("div",{className:"text-[11px] font-semibold uppercase tracking-wider text-white/40",children:"What do you do?"}),e.jsx("div",{className:"grid gap-2",children:n.choices.slice().sort((s,a)=>s.order-a.order).map(s=>e.jsx("button",{onClick:()=>g(s.to_key),className:"rounded-2xl border border-white/10 bg-white/5 px-4 py-3 text-left text-sm text-white transition-all hover:border-lime-500/40 hover:bg-white/10",children:s.label},s.to_key))})]})]})}function y({n:t,title:o}){return e.jsxs("div",{className:"mb-3 flex items-center gap-2",children:[e.jsxs("span",{className:"text-[11px] font-semibold uppercase tracking-wider text-white/40",children:["Step ",t]}),e.jsx("span",{className:"h-px flex-1 bg-white/10"}),e.jsx("h2",{className:"text-sm font-semibold text-white",children:o})]})}export{H as default};