PageSourceSearch

https://mstudio.ai/build/assets/FrameDesigner.o8TBrq-c.js

js mstudio.ai collected 2026-10-05 12:18:43 UTC 46,953 bytes, 2 lines download raw bytes

1const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["assets/FabricAnnotationCanvas.CsYLZhAG.js","assets/entry-client.DX3aUoe5.js","assets/inertia.BE4YqsTM.js","assets/http.DWpeO7Ui.js","assets/rolldown-runtime.C1f3BsDW.js","assets/icons.ChOq_Y4q.js","assets/utils.CgzVjNgC.js","assets/react-core.CAMe6Z4j.js","assets/state.L8kQliOB.js","assets/app.BpxBHA-A.css","assets/fabric.7TGb0lwi.js","assets/input.GzdAc1Aj.js","assets/colors.BuVhGii5.js","assets/AnnotationToolbar.BNXkK-6z.js","assets/dist.D4237Rk6.js","assets/dist.CoNAZqlp.js","assets/dist.DxccqHSW.js","assets/dist.BhzTvz6X.js","assets/dist.C1cc-Zbw.js","assets/dropdown-menu.D1MnQ7U0.js","assets/es2015.Cr2X04_P.js","assets/dist.B-JETxGF.js","assets/dist.zmknLG-d.js","assets/Tooltip.D5vWPvw2.js","assets/CharacterModal.CEeDdccH.js","assets/dist.DbqQa_sy.js","assets/CharacterModal.ehp1Mvsj.js","assets/PromptReferencesRow.Dil-fpz5.js","assets/section-label.Cq6cQeLu.js","assets/BestPracticeTip.vi3UQdmd.js","assets/dialog.Bb7MGeDP.js","assets/segmented.DHcH2lTJ.js","assets/bestPractices.CtL0Jx0E.js","assets/characterMention.DcxgzALo.js"])))=>i.map(i=>d[i]);
2import{r as Pe}from"./rolldown-runtime.C1f3BsDW.js";import"./inertia.BE4YqsTM.js";import"./http.DWpeO7Ui.js";import{Gr as ot,Hr as we,I as ye,Qr as it,S as Ie,Xt as te,_ as Ee,ct as lt,ft as De,gn as ct,hr as dt,i as mt,it as ut,m as ht,pn as ze,wr as le,xr as pt,y as gt,yr as ft}from"./icons.ChOq_Y4q.js";import{t as xt}from"./react-core.CAMe6Z4j.js";import"./utils.CgzVjNgC.js";import{i as bt}from"./state.L8kQliOB.js";import{$ as vt,A as Fe,Ct as wt,M as yt,N as jt,P as Ct,Tt as ee,Z as oe,jt as se,k as y,wt as de,z as Nt}from"./entry-client.DX3aUoe5.js";import"./segmented.DHcH2lTJ.js";import"./input.GzdAc1Aj.js";import"./dist.CoNAZqlp.js";import"./dist.DxccqHSW.js";import"./dist.D4237Rk6.js";import"./dist.BhzTvz6X.js";import"./dist.B-JETxGF.js";import"./dist.zmknLG-d.js";import{r as ne}from"./Tooltip.D5vWPvw2.js";import"./es2015.Cr2X04_P.js";import"./dist.DbqQa_sy.js";import"./dialog.Bb7MGeDP.js";import"./dist.D4LCotyC.js";import"./dist.C1cc-Zbw.js";import"./select.vYEvBl4E.js";import{c as xe,i as je,l as ce,n as Le,o as kt,r as St}from"./characterMention.DcxgzALo.js";import{t as Ce}from"./AssetGalleryModal.DteaM05Z.js";import"./imageValidation.BrtKjMLv.js";import{n as _t}from"./useFreeTierGate.CwupVhTY.js";import{t as Rt}from"./badge.CK53iWwP.js";import"./switch.D3Vh3rjF.js";import{a as Tt,i as Ne,n as At,o as Mt,s as Pt,t as It}from"./dropdown-menu.D1MnQ7U0.js";import{n as Et,r as Dt,t as zt}from"./PromptReferencesRow.Dil-fpz5.js";import{t as Ft}from"./section-label.Cq6cQeLu.js";import"./locationStore.DwRNJtUf.js";import"./usePolling.mKMvMVRm.js";import"./useLocationActions.DjW0qbmO.js";import{t as fe}from"./projectStore.B74RetxK.js";import{t as Lt}from"./MentionTextarea.BoOwGw9M.js";import{f as Gt,m as Ot}from"./shotMedium.DYKLpru1.js";import{a as Ht}from"./AnimationShotParts.B3fNwJfT.js";import{t as Bt}from"./useLocationMentions.Ch75-YXw.js";import{t as Vt}from"./kbd.F_PH3ELp.js";import{i as $t,r as Ut,t as Wt}from"./ShotNavigator.Bf6k38ex.js";import"./MentionText.Do-0ghUN.js";import"./ReviewShotsDialog.B0UjM6nz.js";import{i as Jt,n as Kt}from"./DeletedMediaNote.4QDTVou1.js";import"./useAIProviders.DpznsHqJ.js";import{t as qt}from"./GenerationTimingLabel.K5WCvCRk.js";import{t as Qt}from"./FrameVersionHistory.B9DWBof-.js";import{t as Yt}from"./savedDraft.D7Sdk2MK.js";import{i as Xt,n as Zt,r as es,t as ts}from"./AddLocationButton.6fxYeEMu.js";import{n as ss,t as rs}from"./ModelPicker.B9qrijHK.js";import{t as as}from"./useGenerationJobPoller.BUhANv0M.js";import{t as ns}from"./usePreparePrompts.OtIhvjD2.js";import"./filmLookStore.CfGPY-XO.js";import{t as os}from"./DemoTutorialModal.n7nzQPTB.js";import{n as ke}from"./filmProgress.BMWLABZx.js";var s=Pe(it(),1);function is(t,n){return new Promise((l,r)=>{const d=new Image;d.onload=()=>{let{width:f,height:h}=d;if(f>n||h>n){const m=n/Math.max(f,h);f=Math.round(f*m),h=Math.round(h*m)}const g=document.createElement("canvas");g.width=f,g.height=h;const c=g.getContext("2d");if(!c)return r(new Error("Canvas context failed"));c.drawImage(d,0,0,f,h),g.toBlob(m=>m?l(m):r(new Error("toBlob failed")),"image/png")},d.onerror=()=>r(new Error("Image load failed")),d.src=t})}function Se(t,n){const l=t.active_version?.data;return(n==="end"?l?.end_frame_image_prompt:l?.image_prompt)??""}
2function ls({frame:t,whichFrame:n,projectUuid:l,currentImageUrl:r,providerSlug:d,onAccept:f,currentStep:h,onNavigateToStep:g,beforeGenerate:c}){const[m,i]=(0,s.useState)(r),[b,v]=(0,s.useState)("pan"),[S,E]=(0,s.useState)("hsl(0 0% 100%)"),[D,J]=(0,s.useState)(4),w=(0,s.useRef)(null),[C,T]=(0,s.useState)(()=>Se(t,n)),A=(0,s.useRef)(null),[L,_]=(0,s.useState)(null),[V,M]=(0,s.useState)([]);(0,s.useEffect)(()=>{_(null),M([])},[C]);const R=(0,s.useRef)(!1),[j,G]=(0,s.useState)(!1);(0,s.useEffect)(()=>G(!1),[t.id,n]);const[N,z]=(0,s.useState)(null),[I,O]=(0,s.useState)(!1),[$,H]=(0,s.useState)(0),[K,U]=(0,s.useState)(null),[re,q]=(0,s.useState)(null),[B,F]=(0,s.useState)(null),[u,a]=(0,s.useState)(!1),[p,P]=(0,s.useState)(null),[Y,X]=(0,s.useState)(null),me=(0,s.useRef)(null),$e=(0,s.useRef)(null),[Ue,Q]=(0,s.useState)(null),[We,Z]=(0,s.useState)(null);(0,s.useEffect)(()=>{if(t?.active_generation_job){const o=t.active_generation_job;(o.status==="pending"||o.status==="processing")&&o.type==="image"&&(U(o.id),X(o.status),O(!0),H(o.progress??0),q({startedAt:o.created_at,providerSlug:o.provider_slug??null}))}},[t?.active_generation_job]),(0,s.useEffect)(()=>{i(r),z(o=>o===r?o:null)},[r]);const ue=(0,s.useRef)(C);(0,s.useEffect)(()=>{const o=Se(t,n),x=ue.current;T(k=>Yt(k,x,o)),ue.current=o},[t.active_version?.id,n]);const Je=(0,s.useCallback)(o=>{ue.current=o,T(o)},[]);as(K,{onStatus:X,onProgress:H,onCompleted:o=>{O(!1),z(null),U(null),X(null),me.current=t.active_version?.id??null,H(0),P(null),o.result_url&&F({url:o.result_url,prompt:C})},onFailed:o=>{O(!1),U(null),X(null),H(0),P(null),Z(o.user_error??null),Q(o.user_error?.message??"Could not draw the storyboard picture. Try again.")},onCancelled:()=>{O(!1),U(null),X(null),H(0),P(null)}});const ae=(0,s.useCallback)(async()=>{if(!C.trim()||I||c&&!await c({prompt:C}))return;let o;if(w.current&&w.current.getAnnotationCount()>0){P("Uploading your drawing…");try{const x=await w.current.exportAsImage(!0);if(x){const k=await is(x,1024),W=new File([k],"annotation.png",{type:"image/png"});o=(await Nt.create(l,{file:W,category:"image"})).data?.data?.s3_url}}catch(x){console.warn("Failed to upload annotation image:",x)}if(!o){P(null),Q("Your drawing could not be uploaded, so nothing was generated. Try again.");return}}O(!0),H(0),F(null),Q(null),Z(null),X(null),_(null),M([]);try{const x=await oe.generateImageWithReferences(t.id,{prompt:C,...o?{annotation_image_url:o}:{},...N&&N===m?{source_image_url:N}:j&&m?{source_image_url:m}:{},...d?{provider:d}:{},...R.current?{without_cast:!0}:{},target:n});if(x.data?.success){q(null),U(x.data.job_id);try{await fe.getState().fetchFrames(l)}catch(k){console.warn("Failed to fetch frames:",k)}}else throw new Error(x.data?.message||"Failed to start generation")}catch(x){O(!1),P(null);const k=Et(x);if(k){_(k),M(x.response?.data?.cast_not_in_prompt??[]);return}const W=x.response?.data;let ge=W?.user_error?.message||W?.message||"Could not draw the storyboard picture. Try again.";if(W?.errors){const ve=Object.values(W.errors).flat();ve.length>0&&(ge=ve.join(". "))}Z(null),Q(ge),ee.error(ge)}},[C,I,t.id,N,j,m,n,d,l,c]),Ke=(0,s.useCallback)(async()=>{R.current=!0;try{await ae()}finally{R.current=!1}},[ae]),qe=(0,s.useCallback)(()=>G(!0),[]),Qe=(0,s.useCallback)(()=>{G(!1),z(null)},[]),he=(0,s.useCallback)(async()=>{const o=B?.url||m;if(o){try{await oe.update(t.id,{data:{generated_image_url:o,image_accepted:!0},has_image:!0,status:t.status==="video_generated"?"video_generated":"image_generated"}),await fe.getState().fetchFrames(l)}catch(x){console.error("Failed to mark image as accepted:",x)}i(o),await f(o),F(null),ee.success("Storyboard saved.")}},[B,m,f,t.id,t.status,l]),Ye=(0,s.useCallback)(async()=>{await he(),await new Promise(o=>setTimeout(o,300)),h===1&&g&&g(2)},[he,g,h]),Xe=h===1?"video clip":void 0,Ze=!!g&&!!h&&h<2,be=(0,s.useCallback)(async()=>{const o=me.current;if(F(null),!!o)try{await oe.revertToVersion(t.id,o),await fe.getState().fetchFrames(l),me.current=null,ee.success("Earlier storyboard picture restored.")}catch{ee.error("Could not undo. Use History to restore it.")}},[t.id,l]);$e.current=be;const et=(0,s.useCallback)(()=>{B&&(i(B.url),z(B.url),F(null))},[B]),tt=(0,s.useCallback)(()=>{F(null),ae()},[ae]),st=(0,s.useCallback)(o=>{A.current=o.currentTarget.selectionStart}
2,[]),pe=(0,s.useCallback)(o=>{let x={text:C,caret:A.current??C.length};for(const k of o)x=kt(x.text,k,x.caret);A.current=x.caret,T(x.text)},[C]),rt=(0,s.useCallback)(o=>pe(o.flatMap(x=>x.mention||x.short_id?[Le(x)]:[])),[pe]),at=(0,s.useCallback)(async o=>{if(!(!o.s3_url||u||I)){a(!0),P("Setting the picture…"),Q(null),Z(null);try{await oe.setDirectImage(t.id,{asset_id:o.id}),i(o.s3_url),F(null),await f(o.s3_url),ee.success("Storyboard picture set from My files.")}catch(x){const k=x,W=k.response?.data?.user_error?.message||k.response?.data?.message||"Could not set the picture. Try again.";Z(null),Q(W),ee.error(W)}finally{P(null),a(!1)}}},[u,I,t.id,f]),nt=(0,s.useCallback)(o=>{T(x=>{const k=x.trimEnd();return k?/[.!?:;,]$/.test(k)?`${k} ${o}`:`${k}. ${o}`:o})},[]);return{canvasImageUrl:m,activeVersionId:t.active_version?.id??null,annotationTool:b,setAnnotationTool:v,annotationColor:S,setAnnotationColor:E,annotationSize:D,setAnnotationSize:J,annotationCanvasRef:w,prompt:C,setPrompt:T,showSavedPrompt:Je,isGenerating:I,progress:$,restoredJob:re,generationResult:B,statusMessage:p??(I?ss({kind:"image",hasJob:K!==null,jobStatus:Y,progress:$}):null),errorMessage:Ue,setErrorMessage:Q,generationError:We,setGenerationError:Z,promptIssues:L,castNotInPrompt:V,handlePromptSelect:st,insertTokens:pe,isSettingDirectImage:u,whichFrame:n,handleGenerate:ae,handleGenerateWithoutCast:Ke,isChangingStoryboard:j,startChangingStoryboard:qe,stopChangingStoryboard:Qe,handleAcceptResult:he,handleAcceptAndNext:Ye,handleUndoResult:be,handleRefineResult:et,handleRegenerateResult:tt,handleAddReferencesFromAssets:rt,handleSetFrameImageFromAsset:at,handleQuickPrompt:nt,nextStepLabel:Xe,showAcceptAndNext:Ze}}const _e=bt((t,n)=>({dismissed:{},isDismissed:l=>n().dismissed[l]===!0,dismiss:l=>t(r=>({dismissed:{...r.dismissed,[l]:!0}}))}));function cs({projectCharacters:t,prompt:n,cast:l}){const r=t.filter(g=>g.is_active),d=n??"",f=new Map;for(const g of r){const c=Re(g.name);if(c){const m=c.toLowerCase();f.set(m,(f.get(m)??0)+1)}}const h=r.filter(g=>{if(xe(d,g))return!0;if(l===void 0)return!1;const c=(g.name??"").trim(),m=Re(c),i=l.length>0;return(i||m!==c)&&Te(d,c)||i&&!!m&&!ds.has(m.replace(/\.$/u,"").toLowerCase())&&m!==c&&f.get(m.toLowerCase())===1&&Te(d,m)});return{hasAny:h.length>0,used:h,projectHasCharacters:r.length>0}}var ds=new Set(["mr","mrs","ms","miss","mx","dr","doctor","prof","professor","sir","lady","lord","the","a","an","old","young","little","big","uncle","aunt","auntie","grandma","grandpa","father","mother","brother","sister","officer","judge","commander","detective","agent","captain","sergeant","sgt","lieutenant","lt","chief","coach","nurse","king","queen","prince","princess"]);function Re(t){return(t??"").trim().split(/\s+/u)[0]??""}function Te(t,n){if(!n)return!1;const l=n.replace(/[.*+?^${}()|[\]\\]/g,"\\$&");return new RegExp(`(?<![\\p{L}\\p{N}_])${l}(?![\\p{L}\\p{N}_])`,"u").test(t)}function ms({frameId:t,kind:n,onAddCharacter:l}){const{confirm:r}=jt(),d=_e(c=>c.isDismissed),f=_e(c=>c.dismiss),h=(0,s.useRef)(r);h.current=r;const g=(0,s.useRef)(l);return g.current=l,{ensureCharacters:(0,s.useCallback)(async c=>{const m=cs(c);if(m.hasAny)return!0;const i=`${t}:${n}`;return d(i)?!0:(m.projectHasCharacters?await h.current({title:"No character in this shot",description:`This project has ${c.projectCharacters.filter(b=>b.is_active).length} character(s), but none is in this prompt. Add one with Add Character, or type @ in the prompt, so the same face carries across your shots.`,confirmText:"Generate anyway",cancelText:"Pick a character"}):await h.current({title:"No characters in this project",description:"Characters keep the same face across every shot. Without one, each generation invents a new person. You can add a character now, or generate anyway.",confirmText:"Generate anyway",cancelText:"Add a character"}))?(f(i),!0):(g.current?.(),!1)},[t,n,d,f])}}var e=Pe(xt(),1);const Ge=(0,s.memo)(({resultUrl:t,onRefine:n,onUndo:l,onMakeVideo:r})=>(0,e.jsx)("div",{className:"absolute inset-x-0 top-0 z-20 border-b border-border bg-background/95 px-2 py-2.5 backdrop-blur-sm sm:px-4",children:(0,e.jsxs)("div",{className:"flex flex-col gap-2 sm:flex-row sm:items-center sm:justify-between",children:[(0,e.jsxs)("div",{className:"flex min-w-0 items-center gap-2 sm:gap-3",children:[(0,e.jsx)("img",{src:t,alt:"New storyboard",className:"h-9 w-9 rounded-md border border-border-strong object-cover sm:h-10 sm:w-10"}),(0,e.jsx)("span",{className:"text-[11px] font-medium leading-relaxed text-secondary-foreground sm:text-xs",children:"Storyboard ready."})]}),(0,e.jsxs)("div",{className:"flex w-full items-center flex-wrap gap-1.5 pb-0.5 sm:w-auto 
2sm:justify-end sm:overflow-visible sm:pb-0",children:[(0,e.jsxs)(y,{variant:"ghost",size:"sm",onClick:l,className:"shrink-0 px-2.5 text-xs text-muted-foreground hover:text-foreground","aria-label":"Undo this storyboard",children:[(0,e.jsx)(mt,{className:"h-3.5 w-3.5"}),"Undo"]}),(0,e.jsxs)(y,{variant:"ghost",size:"sm",onClick:n,className:"shrink-0 px-2.5 text-xs text-muted-foreground hover:text-foreground","aria-label":"Annotate and refine",children:[(0,e.jsx)(De,{className:"h-3.5 w-3.5"}),"Annotate and refine"]}),r&&(0,e.jsxs)(y,{size:"sm",onClick:r,className:"shrink-0 text-xs",children:["Make video clip",(0,e.jsx)(pt,{className:"h-3.5 w-3.5"})]})]})]})}));Ge.displayName="GenerationResultOverlay";var us=(0,s.lazy)(()=>de(()=>import("./FabricAnnotationCanvas.CsYLZhAG.js"),__vite__mapDeps([0,1,2,3,4,5,6,7,8,9,10,11,12])).then(t=>({default:t.default})));const Oe=(0,s.memo)(({state:t,onHistoryChange:n,shotNumber:l,deletedStill:r,hasSavedPicture:d,clipLabel:f="Make video clip",onNextStep:h,onMakeVideo:g,onNextShot:c})=>{const{canvasImageUrl:m,isGenerating:i,progress:b,generationResult:v,statusMessage:S,errorMessage:E,generationError:D,annotationTool:J,annotationColor:w,annotationSize:C,annotationCanvasRef:T}=t,A=(0,s.useRef)(null),[L,_]=(0,s.useState)({width:0,height:0});return(0,s.useEffect)(()=>{const V=A.current;if(!V)return;const M=()=>{const{width:j,height:G}=V.getBoundingClientRect();_(N=>N.width===Math.floor(j)&&N.height===Math.floor(G)?N:{width:Math.floor(j),height:Math.floor(G)})};M();const R=new ResizeObserver(M);return R.observe(V),()=>R.disconnect()},[]),(0,e.jsxs)("div",{className:"relative flex flex-1 flex-col overflow-hidden bg-background",children:[v&&(0,e.jsx)(Ge,{resultUrl:v.url,onRefine:t.handleRefineResult,onUndo:()=>void t.handleUndoResult(),onMakeVideo:t.showAcceptAndNext?g??(()=>void t.handleAcceptAndNext()):void 0}),S&&!v&&(0,e.jsxs)("div",{className:"flex items-center gap-2 border-b border-border bg-card/80 px-4 py-2",children:[(0,e.jsx)(te,{className:"h-3.5 w-3.5 animate-spin text-primary"}),(0,e.jsx)("span",{className:"text-xs text-secondary-foreground",children:S}),b>0&&(0,e.jsx)("div",{className:"h-1 w-24 overflow-hidden rounded-full bg-secondary",children:(0,e.jsx)("div",{className:"h-full rounded-full bg-primary transition-all",style:{width:`${b}%`}})})]}),d&&!v&&!i&&!S&&(h||c)&&(0,e.jsxs)("div",{className:"flex flex-wrap items-center gap-2 border-b border-border bg-card/80 px-4 py-2",children:[(0,e.jsx)(le,{className:"h-4 w-4 text-success","aria-hidden":"true"}),(0,e.jsx)("span",{className:"mr-auto text-xs font-medium text-foreground",children:"Storyboard ready."}),h&&(0,e.jsxs)(y,{size:"sm",onClick:h,children:[f,(0,e.jsx)(we,{className:"h-3.5 w-3.5","aria-hidden":"true"})]}),c&&(0,e.jsxs)(y,{variant:"outline",size:"sm",onClick:c,children:["Next shot",(0,e.jsx)(we,{className:"h-3.5 w-3.5","aria-hidden":"true"})]})]}),E&&!i&&(0,e.jsxs)("div",{className:"flex items-start gap-2 border-b border-destructive/30 bg-destructive/10 px-4 py-2",children:[(0,e.jsx)(ft,{className:"mt-0.5 h-3.5 w-3.5 shrink-0 text-destructive"}),(0,e.jsxs)("div",{className:"flex-1",children:[D?.title&&(0,e.jsx)("p",{className:"text-xs font-medium text-destructive",children:D.title}),(0,e.jsx)("p",{className:"text-xs text-destructive",children:E}),D&&!D.retryable&&D.action_label&&(0,e.jsxs)("p",{className:"mt-1 text-[11px] text-destructive/90",children:["Retrying as-is will fail the same way —"," ",D.action_label.toLowerCase()," to continue."]})]}),(0,e.jsx)(Fe,{onClick:()=>{t.setErrorMessage(null),t.setGenerationError(null)},className:"-my-1 text-destructive hover:bg-destructive/10 hover:text-destructive","aria-label":"Dismiss error"})]}),(0,e.jsxs)("div",{ref:A,className:"relative flex-1 overflow-hidden",children:[i&&(0,e.jsxs)("div",{className:"absolute inset-0 z-10 flex flex-col items-center justify-center bg-background/80 backdrop-blur-sm",children:[(0,e.jsx)(te,{className:"h-10 w-10 animate-spin text-primary"}),(0,e.jsx)("p",{className:"mt-3 text-sm text-secondary-foreground",children:S||"Generating the storyboard…"}),b>0&&(0,e.jsx)("div",{className:"mt-2 h-1.5 w-48 overflow-hidden rounded-full bg-secondary",children:(0,e.jsx)("div",{className:"h-full rounded-full bg-primary transition-all",style:{width:`${b}%`}})})]}),v&&!i&&(0,e.jsx)("div",{className:"flex h-full w-full items-center justify-center",children:(0,e.jsx)("img",{src:v.url,alt:"Generated result",className:"max-h-full max-w-full rounded object-contain",draggable:!1})}),!m&&!v&&!i&&(0,e.jsxs)("div",{className:"pointer-events-none absolute inset-0 z-[1] flex flex-col items-center justify-center gap-1 px-6 text-center",children:[r&&(0,e.jsx)("p",{className:"text-sm text-warning",children:Jt("still",r)}),(0,e.jsxs)("p",{className:"text-sm text-muted-foreground",children:["The storyboard for"," ",l?`Shot ${l}`:"this shot"," shows here."]}),(0,e.jsx)("p",{className:"text-xs text-muted-foreground",children:"Check the shot description below, then click Draw storyboard."})]}),!v&&L.width>0&&(0,e.jsx)(s.Suspense,{fallback:null,children:(0,e.jsx)(us,{ref:T,imageUrl:m,width:L.width,height:L.height,tool:J,brushColor:w,brushSize:C,onToolChange:t.setAnnotationTool,onAnnotationsChange:()=>{},onHistoryChange:n})})]})]})});Oe.displayName="FrameDesignerCanvas";var Ae=(0,s.lazy)(()=>de(()=>import("./AnnotationToolbar.BNXkK-6z.js"),__vite__mapDeps([13,1,2,3,4,5,6,7,8,9,14,15,16,17,18,19,20,21,22,23,11])).then(t=>({default:t.AnnotationToolbar}))),Me=["select","pan","freehand","rect","circle","line","text","highlight"];const He=(0,s.memo)(({state:t,historyVersion:n})=>(0,e.jsxs)("div",{className:"relative shrink-0 border-b border-border bg-card/50 lg:border-b-0 lg:border-r",children:[(0,e.jsx)("div",{className:"overflow-x-auto lg:hidden",children:(0,e.jsx)("div",{className:"min-w-max",style:{overflow:"visible"},children:(0,e.jsx)(s.Suspense,{fallback:null,children:(0,e.jsx)(Ae,{currentTool:t.annotationTool,onToolChange:t.setAnnotationTool,brushColor:t.annotationColor,onColorChange:t.setAnnotationColor,brushSize:t.annotationSize,onSizeChange:t.setAnnotationSize,canvasRef:t.annotationCanvasRef,variant:"horizontal",className:"p-1",allowedTools:Me,historyVersion:n})})})}),(0,e.jsx)("div",{className:"hidden h-full overflow-y-auto lg:block",children:(0,e.jsx)("div",{className:"flex-1",style:{overflow:"visible"},children:(0,e.jsx)(s.Suspense,{fallback:null,children:(0,e.jsx)(Ae,{currentTool:t.annotationTool,onToolChange:t.setAnnotationTool,brushColor:t.annotationColor,onColorChange:t.setAnnotationColor,brushSize:t.annotationSize,onSizeChange:t.setAnnotationSize,canvasRef:t.annotationCanvasRef,variant:"vertical",className:"p-1",allowedTools:Me,historyVersion:n})})})})]}));He.displayName="FrameDesignerToolbar";const ie={quick:{title:"Quick edits",templates:[{label:"Fix lighting",prompt:"Improve the lighting, make it more natural and cinematic"},{label:"Add depth",prompt:"Add more depth and atmosphere to the scene"},{label:"Enhance details",prompt:"Enhance details and textures, make image more crisp"},{label:"Fix composition",prompt:"Improve the composition following rule of thirds"}]},shots:{title:"Shot types",templates:[{label:"Wide/establishing",prompt:"Wide establishing shot showing the full environment and setting the scene, cinematic composition"},{label:"Medium shot",prompt:"Medium shot framing the subject from waist up, showing body language and environment c
2ontext"},{label:"Close-up",prompt:"Close-up shot focusing on the face/subject, capturing emotion and detail, shallow depth of field"},{label:"Extreme close-up",prompt:"Extreme close-up on eyes/details, dramatic and intimate, very shallow depth of field"},{label:"Over-the-shoulder",prompt:"Over-the-shoulder shot, one character in soft focus foreground looking at another, cinematic framing"},{label:"POV shot",prompt:"First-person point of view shot, showing what the character sees, immersive perspective"},{label:"Two-shot",prompt:"Two-shot framing both characters in the same frame, balanced composition showing their relationship"},{label:"Insert/detail",prompt:"Insert shot focusing on an important object or detail, sharp focus, contextual lighting"}]},lighting:{title:"Lighting",templates:[{label:"Golden hour",prompt:"Warm golden hour lighting with long shadows, soft orange and yellow tones, magical atmosphere"},{label:"Blue hour",prompt:"Cool blue hour lighting, twilight atmosphere, deep blue tones with subtle warm accents"},{label:"High key",prompt:"High key lighting, bright and even, minimal shadows, clean and optimistic feel"},{label:"Low key",prompt:"Low key dramatic lighting with deep shadows, film noir style, mysterious atmosphere"},{label:"Rim light",prompt:"Strong rim/back lighting creating a halo effect around the subject, dramatic silhouette edges"},{label:"Neon/cyberpunk",prompt:"Neon lighting with pink, blue, and purple tones, cyberpunk aesthetic, reflective surfaces"},{label:"Natural window",prompt:"Soft natural window light, diffused and flattering, realistic indoor lighting"},{label:"Candlelight",prompt:"Warm candlelight or firelight, flickering orange glow, intimate and cozy atmosphere"}]},camera:{title:"Camera angles",templates:[{label:"Eye level",prompt:"Eye level angle, neutral and natural perspective, viewer feels equal to subject"},{label:"Low angle",prompt:"Low angle shot looking up at the subject, making them appear powerful and dominant"},{label:"High angle",prompt:"High angle shot looking down at the subject, making them appear vulnerable or small"},{label:"Dutch angle",prompt:"Dutch/tilted angle creating unease and tension, dynamic diagonal composition"},{label:"Bird's-eye",prompt:"Birds eye view from directly above, showing spatial relationships and patterns"},{label:"Worm's-eye",prompt:"Extreme low angle from ground level, dramatic and imposing perspective"}]},mood:{title:"Mood and atmosphere",templates:[{label:"Tense/suspense",prompt:"Tense and suspenseful atmosphere, dramatic shadows, tight framing, unsettling mood"},{label:"Romantic",prompt:"Romantic and dreamy atmosphere, soft focus, warm colors, intimate and gentle lighting"},{label:"Melancholic",prompt:"Melancholic and somber mood, muted colors, overcast lighting, emotional depth"},{label:"Hopeful",prompt:"Hopeful and uplifting atmosphere, bright lighting, warm tones, open composition"},{label:"Mysterious",prompt:"Mysterious and enigmatic mood, fog/haze, obscured elements, intriguing shadows"},{label:"Energetic",prompt:"Dynamic and energetic feel, bold colors, strong contrast, sense of motion"},{label:"Peaceful",prompt:"Calm and peaceful atmosphere, soft natural light, harmonious colors, serene composition"},{label:"Eerie",prompt:"Eerie and unsettling mood, unnatural colors, distorted perspective, creepy atmosphere"}]}},Cr=ie.quick.templates;var hs=(0,s.lazy)(()=>de(()=>import("./CharacterModal.CEeDdccH.js"),__vite__mapDeps([24,14,2,3,4,5,15,16,7,17,25,20,21,22,6,8,26,1,9,27,28,29,23,30,11,31,32,33])).then(t=>({default:t.CharacterModal})));const Be=(0,s.memo)(({state:t,projectUuid:n,frameId:l,characters:r,provider:d,onKeyDown:f})=>{const h=Ct(a=>a.characters),g=r.projectCharacters||h,{prompt:c,setPrompt:m,isGenerating:i,progress:b,isSettingDirectImage:v,handleQuickPrompt:S,handleSetFrameImageFromAsset:E,promptIssues:D,castNotInPrompt:J}=t,w=Dt({frameId:l,prompt:c,provider:d.effectiveSlug,mode:"image",savedVersionId:t.activeVersionId,target:t.whichFrame}),C=J.length?J:w.result?.cast_not_in_prompt??[],{prepare:T,isPreparing:A}
2=ns(n),L=t.whichFrame==="start",_=(0,s.useRef)(t.whichFrame);_.current=t.whichFrame;const{rewrite:V,isRewriting:M}=es(n,l),R=(A||M)&&L,j=Bt(n,{withLook:!0}),G=a=>{m(ce(c,a));const p=r.characterForTag(a);p&&r.unassignCharacter(p.id,{stripMention:!1})},N=M?"The AI is rewriting this frame. Generate when it is done.":c.trim()?null:"Write a prompt first.",[z,I]=(0,s.useState)(null),O=Zt(n,{characterForTag:r.characterForTag,onEditCharacter:I}),[$,H]=(0,s.useState)(null),[K,U]=(0,s.useState)(!1),[re,q]=(0,s.useState)(!1),[B,F]=(0,s.useState)(!1),u=(0,s.useCallback)(a=>{S(a),U(!1)},[S]);return(0,e.jsxs)("div",{className:"flex min-h-[220px] flex-1 flex-col p-3 sm:p-4",children:[(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)("div",{className:"mb-2 flex gap-1.5 overflow-x-auto pb-1",children:Object.keys(ie).map(a=>(0,e.jsx)(y,{variant:"outline",size:"xs",onClick:()=>{H(a),U(!K||$!==a)},"aria-pressed":$===a&&K,className:"h-6 px-2 text-[10px] text-muted-foreground hover:text-foreground",children:ie[a].title},a))}),K&&$&&(0,e.jsx)("div",{className:"mb-2 flex flex-wrap gap-1.5 rounded-lg border border-border bg-card/50 p-2",children:ie[$].templates.map((a,p)=>(0,e.jsx)(y,{variant:"outline",size:"xs",onClick:()=>u(a.prompt),className:"h-6 rounded-md px-2 text-[10px] font-normal",children:a.label},p))})]}),(0,e.jsxs)("div",{className:"mb-2 flex flex-wrap items-center gap-2",children:[(0,e.jsxs)(It,{children:[(0,e.jsx)(Pt,{asChild:!0,children:(0,e.jsxs)(y,{type:"button",variant:"dashed",size:"sm",className:"px-2.5 text-xs font-normal",title:"Add or select character for this shot",children:[(0,e.jsx)(Ee,{className:"h-3.5 w-3.5"}),"Add character"]})}),(0,e.jsxs)(At,{align:"start",className:"z-[70] w-56",children:[(0,e.jsx)(Tt,{className:"text-2xs font-semibold uppercase tracking-[0.08em] text-muted-foreground",children:"Film characters"}),g.filter(a=>a.is_active).length===0?(0,e.jsx)("div",{className:"px-2 py-2 text-xs text-muted-foreground italic",children:"No characters yet"}):g.filter(a=>a.is_active).map(a=>{const p=xe(c,a);return(0,e.jsxs)(Ne,{onSelect:P=>{P.preventDefault(),p?r.unassignCharacter(a.id):r.attachCharacter(a.id)},className:"flex items-center gap-2 px-2 py-1.5 text-xs cursor-pointer",children:[a.primary_reference?.s3_url?(0,e.jsx)("img",{src:a.primary_reference.s3_url,alt:a.name,className:"h-6 w-6 rounded-full object-cover border border-border-strong shrink-0"}):(0,e.jsx)("div",{className:"h-6 w-6 rounded-full bg-secondary border border-border-strong flex items-center justify-center text-[10px] text-muted-foreground font-semibold shrink-0",children:a.name[0]}),(0,e.jsxs)("div",{className:"flex flex-col min-w-0 flex-1",children:[(0,e.jsx)("span",{className:"truncate font-medium text-foreground",children:a.name}),a.role&&(0,e.jsx)("span",{className:"truncate text-[10px] text-muted-foreground",children:a.role})]}),p&&(0,e.jsx)(le,{className:"h-3.5 w-3.5 text-primary shrink-0"})]},a.id)}),(0,e.jsx)(Mt,{}),(0,e.jsxs)(Ne,{onSelect:a=>{a.preventDefault(),I("new")},className:"flex items-center gap-2 px-2 py-1.5 text-xs font-medium text-primary data-[highlighted]:bg-primary/10 data-[highlighted]:text-primary cursor-pointer",children:[(0,e.jsx)(lt,{className:"h-4 w-4"}),"New character"]})]})]}),(0,e.jsx)(ts,{projectUuid:n,prompt:c,onAdd:a=>t.insertTokens([a]),onRemove:a=>m(ce(c,a)),className:se(yt({variant:"dashed",size:"sm"}),"px-2.5 text-xs font-normal")}),r.charactersMissingRefs.length>0&&(0,e.jsxs)("span",{className:"text-xs text-warning font-medium flex items-center gap-1",children:[(0,e.jsx)(Ie,{className:"h-3 w-3 shrink-0"}),(0,e.jsxs)("span",{children:["Missing ref:"," ",r.charactersMissingRefs.map((a,p)=>(0,e.jsxs)("span",{children:[p>0&&", ",(0,e.jsx)("button",{type:"button",onClick:()=>I(a),className:"rounded-sm underline underline-offset-2 hover:text-warning/80 cursor-pointer outline-none focus-visible:ring-[3px] focus-visible:ring-ring/50",children:a.name})]},a.id))]})]}),(0,e.jsxs)(y,{type:"button",variant:"dashed",size:"sm",onClick:()=>q(!0),className:"px-2.5 text-xs font-normal",title:"Pick a picture from your files. Its mention goes into the prompt.",children:[(0,e.jsx)(ze,{className:"h-3.5 w-3.5"}),"Add reference"]}),L&&(0,e.jsxs)(y,{variant:"outline",size:"sm",disabled:M||A||i,onClick:()=>{const a=_.current;V(l,p=>{_.current===a&&t.showSavedPrompt(p.image_prompt??"")},{field:a==="start"?"image_prompt":"end_frame_image_prompt",text:c})},className:"px-2.5 text-xs text-secondary-foreground hover:text-foreground",title:"Write this shot's picture prompt, video prompt and panels again from its script",children:[M?(0,e.jsx)(te,{className:"h-3.5 w-3.5 animate-spin"}):(0,e.jsx)(ut,{className:"h-3.5 w-3.5"}),M?"Regenerating frame…":"Regenerate frame from script"]}),(0,e.jsx)("div",{className:"ml-auto flex items-center gap-2",children:(0,e.jsx)(rs,{providers:d.providers,selectedSlug:d.selectedSlug,onSelect:d.setSelectedSlug,isLoading:d.isLoading,label:"Model",compact:!0})})]}),z&&(0,e.jsx)(s.Suspense,{fallback:null,children:(0,e.jsx)(hs,{open:!!z,onOpenChange:a=>{a||I(null)},projectUuid:n,character:z==="new"?null:z})}),O.dialogs,(0,e.jsx)(Ce,{projectUuid:n,isOpen:re,onClose:()=>q(!1),multiSelect:!0,onAssetsSelect:a=>{t.handleAddReferencesFromAssets(a),a.forEach(p=>r.onMentionInserted({tag:Le(p),label:"",imageUrl:""})),q(!1)},categoryFilter:"image"}),(0,e.jsx)(Ce,{projectUuid:n,isOpen:B,onClose:()=>F(!1),categoryFilter:"image",onAssetSelect:a=>{F(!1),E(a)}}),(0,e.jsxs)("div",{className:"flex min-h-0 flex-1 flex-col gap-3 lg:flex-row",children:[(0,e.jsxs)("div",{className:"flex min-h-0 min-w-0 flex-1 flex-col gap-2",children:[(0,e.jsxs)("div",{className:"flex items-center justify-between gap-2",children:[(0,e.jsxs)(Ft,{as:"label",htmlFor:"frame-shot-description",children:["Prompt"," ",(0,e.jsx)("span",{className:"font-medium normal-case tracking-normal text-muted-foreground
2/70",children:R?"· the AI is rewriting it. It is locked until then":"· sent to the model exactly as written"})]}),L&&(0,e.jsxs)(y,{type:"button",variant:"ghost",size:"xs",onClick:()=>{const a=_.current;T([l],"image_prompt",c,{onRewritten:p=>{_.current===a&&t.showSavedPrompt(p)}})},disabled:A||M||i,className:"h-6 gap-1 rounded-md px-1.5 text-[10px] font-normal text-muted-foreground hover:text-foreground",children:[A?(0,e.jsx)(te,{className:"h-3 w-3 animate-spin"}):(0,e.jsx)(ye,{className:"h-3 w-3 text-violet-400"}),A?"Writing prompt…":"Rewrite this prompt with AI"]})]}),(0,e.jsx)(Lt,{id:"frame-shot-description",value:c,onChange:R?()=>{}:m,readOnly:R,"aria-busy":R,onSelect:t.handlePromptSelect,mentions:[...r.mentionItems,...j,...(w.result?.references??[]).filter(a=>a.kind==="asset").map(a=>({tag:a.token,label:a.name,imageUrl:a.url}))],onMentionInserted:r.onMentionInserted,onMentionRemoved:a=>{const p=r.characterForTag(a.tag);p&&r.unassignCharacter(p.id,{stripMention:!1})},onKeyDown:R?void 0:f,canEditMention:O.canEditMention,onEditMention:O.onEditMention,mentionClassName:"bg-primary/20 text-primary font-medium ring-2 ring-card",overlayBgClassName:"bg-card",placeholder:"Describe the shot. Type @ to add a character, a film set or a picture.",className:se("min-h-[144px] rounded-lg border border-border bg-card px-3 py-2 text-sm text-foreground shadow-field placeholder:text-muted-foreground/70 outline-none hover:border-border-strong focus-visible:border-ring/60 focus-visible:ring-[3px] focus-visible:ring-ring/15",R&&"cursor-progress opacity-60"),minHeight:"144px",fillHeight:!0}),(0,e.jsx)(zt,{...w,refusedIssues:D,onRemoveToken:G}),C.length>0&&!i&&(0,e.jsx)(y,{variant:"secondary",size:"sm",onClick:t.handleGenerateWithoutCast,className:"self-start",children:"Draw it without them"})]}),(0,e.jsxs)("div",{className:"flex flex-col gap-2 shrink-0 justify-end items-stretch lg:w-[160px]",children:[(0,e.jsx)(y,{variant:"secondary",onClick:()=>F(!0),disabled:i||v,isLoading:v,className:"w-full",leftIcon:v?void 0:(0,e.jsx)(gt,{className:"h-4 w-4"}),children:v?"Setting…":"Upload"}),(0,e.jsxs)(y,{onClick:t.handleGenerate,disabled:i||!!N,title:N??void 0,"aria-describedby":N?"frame-generate-blocked":void 0,className:"w-full",children:[i?(0,e.jsx)(te,{className:"h-4 w-4 animate-spin"}):(0,e.jsx)(ye,{className:"h-4 w-4"}),i?(0,e.jsx)(qt,{kind:{type:"image",providerSlug:t.restoredJob?.providerSlug??d.effectiveSlug},startedAt:t.restoredJob?.startedAt,serverProgress:b}):t.isChangingStoryboard&&t.canvasImageUrl?"Change storyboard":t.canvasImageUrl||t.generationResult?"Generate again":"Draw storyboard"]}),t.canvasImageUrl&&!i&&(t.isChangingStoryboard?(0,e.jsxs)("div",{className:"flex flex-col gap-1",children:[(0,e.jsx)("p",{className:"text-[11px] leading-snug text-muted-foreground",children:"Your words will change this storyboard. The rest stays."}),(0,e.jsx)(y,{variant:"ghost",size:"sm",onClick:t.stopChangingStoryboard,
2className:"h-auto w-full whitespace-normal py-1.5",children:"Draw a new one instead"})]}):(0,e.jsx)(y,{variant:"ghost",size:"sm",onClick:t.startChangingStoryboard,className:"h-auto w-full whitespace-normal py-1.5",leftIcon:(0,e.jsx)(De,{className:"h-3.5 w-3.5"}),children:"Change this storyboard"})),N&&!i&&(0,e.jsx)("p",{id:"frame-generate-blocked",className:"text-[11px] leading-snug text-muted-foreground",children:N})]})]}),(0,e.jsxs)("div",{className:"mt-1.5 flex shrink-0 items-center justify-between",children:[(0,e.jsxs)("p",{className:"text-[10px] text-muted-foreground/70",children:[(0,e.jsxs)(Vt,{children:[navigator.platform.includes("Mac")?"Cmd":"Ctrl","+Enter"]})," ","to generate"]}),(0,e.jsxs)("p",{className:"text-[10px] tabular-nums text-muted-foreground/70",children:[c.length.toLocaleString()," characters"]})]})]})});Be.displayName="FrameDesignerPromptPanel";function ps(t,n=!0){const[l,r]=(0,s.useState)(null),[d,f]=(0,s.useState)(null),[h,g]=(0,s.useState)(null),[c,m]=(0,s.useState)(!1),i=t?JSON.stringify(t):null;return(0,s.useEffect)(()=>{if(!n||!i){r(null),f(null);return}let b=!0;m(!0);const v=setTimeout(()=>{vt.quote(JSON.parse(i)).then(S=>{if(!b)return;const E=S.data?.data;r(E?.price??null),f(E?.funding_source??null),g(E?.allowance??null)}).catch(()=>{b&&(r(null),f(null))}).finally(()=>{b&&m(!1)})},250);return()=>{b=!1,clearTimeout(v)}},[i,n]),{quote:l,fundingSource:d,allowance:h,isLoading:c}}var gs=(0,s.lazy)(()=>de(()=>import("./CharacterModal.CEeDdccH.js"),__vite__mapDeps([24,14,2,3,4,5,15,16,7,17,25,20,21,22,6,8,26,1,9,27,28,29,23,30,11,31,32,33])).then(t=>({default:t.CharacterModal})));const Ve=(0,s.memo)(({state:t,projectUuid:n,prompt:l})=>{const{sidebarTab:r,setSidebarTab:d}=t;return r?(0,e.jsx)("div",{className:"w-full overflow-y-auto border-t border-border bg-card/50 lg:w-72 lg:shrink-0 lg:border-l lg:border-t-0 lg:max-h-none max-h-[42dvh]",children:(0,e.jsxs)("div",{className:"p-4",children:[(0,e.jsxs)("div",{className:"mb-3 flex items-center justify-between",children:[(0,e.jsxs)("h3",{className:"text-sm font-medium text-foreground",children:[r==="history"&&"Version history",r==="characters"&&"Characters",r==="options"&&"Options"]}),(0,e.jsx)(Fe,{onClick:()=>d(null),"aria-label":"Close sidebar"})]}),r==="history"&&(0,e.jsx)(fs,{state:t}),r==="characters"&&(0,e.jsx)(bs,{state:t,projectUuid:n,prompt:l}),r==="options"&&(0,e.jsx)(xs,{state:t})]})}):null});Ve.displayName="ShotDesignerSidebar";var fs=({state:t})=>{const{frameVersions:n,isLoadingVersions:l,revertingVersionId:r,handleRevertToVersion:d}=t;return(0,e.jsx)(Qt,{versions:n,isLoading:l,revertingVersionId:r,onRevert:d,mode:"inline",mediaFocus:"image",promptField:"image_prompt",thumbnailSize:"large",className:""})},xs=({state:t})=>{const{provider:n}=t,{showUpgrade:l}=wt(),{quote:r,fundingSource:d}=ps({service_type:"image",provider_slug:n.effectiveSlug,amount:1});return(0,e.jsxs)("div",{className:"space-y-4",children:[r&&r.cents>0&&d==="wallet"&&(0,e.jsxs)("div",{className:"rounded-md border border-border bg-card/60 px-3 py-2.5",children:[(0,e.jsx)("p",{className:"text-[10px] leading-relaxed text-warning",children:"This is more than your plan allows this month."}),(0,e.jsx)(y,{variant:"outline",size:"xs",className:"mt-2",onClick:()=>l({feature:"generate-image"}),children:"See plans"})]}),(0,e.jsx)("p",{className:"text-[10px] leading-relaxed text-muted-foreground/70",children:"Switch models from the toolbar below the preview, next to Add character."})]})},bs=({state:t,projectUuid:n,prompt:l})=>{const{characters:r}=t,{projectCharacters:d,charactersMissingRefs:f,isLoadingCharacters:h}=r,[g,c]=(0,s.useState)(null);if(h)return(0,e.jsx)("div",{className:"flex items-center justify-center py-8",children:(0,e.jsx)(te,{className:"h-5 w-5 animate-spin text-muted-foreground"})});if(d.length===0)return(0,e.jsxs)("div",{className:"flex flex-col items-center gap-3 py-8 text-center",children:[(0,e.jsx)(Ee,{className:"h-8 w-8 text-muted-foreground/40"}),(0,e.jsxs)("div",{children:[(0,e.jsx)("p",{className:"text-xs text-muted-foreground",children:"No characters yet"}),(0,e.jsx)("p",{className:"mt-1 text-[10px] text-muted-foreground
2/70",children:"Add characters to your film to keep them looking the same across shots."})]})]});const m=new Set(f.map(i=>i.id));return(0,e.jsxs)("div",{className:"space-y-2",children:[d.filter(i=>i.is_active).map(i=>{const b=xe(l,i),v=b&&m.has(i.id);return(0,e.jsxs)("button",{type:"button",onClick:()=>{b?r.unassignCharacter(i.id):r.attachCharacter(i.id)},className:se("flex w-full items-center gap-3 rounded-lg border p-2.5 text-left transition-colors outline-none focus-visible:ring-[3px] focus-visible:ring-ring/50",b?"border-primary/30 bg-primary/5":"border-border bg-card/50 hover:border-border-strong hover:bg-surface-hover"),children:[(0,e.jsxs)("div",{className:"relative h-9 w-9 shrink-0 overflow-hidden rounded-md bg-secondary",children:[i.primary_reference?.s3_url?(0,e.jsx)("img",{src:i.primary_reference.s3_url,alt:i.name,className:"h-full w-full object-cover"}):(0,e.jsx)("div",{className:"flex h-full w-full items-center justify-center text-xs text-muted-foreground/70",children:i.name.charAt(0).toUpperCase()}),v&&(0,e.jsx)("div",{className:"absolute -right-0.5 -top-0.5 rounded-full bg-background p-0.5",children:(0,e.jsx)(Ie,{className:"h-2.5 w-2.5 text-primary"})})]}),(0,e.jsxs)("div",{className:"min-w-0 flex-1",children:[(0,e.jsxs)("div",{className:"flex items-center gap-2",children:[(0,e.jsx)("span",{className:"truncate text-xs font-medium text-foreground",children:i.name}),i.role&&(0,e.jsx)(Rt,{className:"h-4 px-1 text-[9px]",children:i.role})]}),v&&(0,e.jsxs)("button",{type:"button",onClick:S=>{S.stopPropagation(),c(i)},className:"mt-1 flex items-center gap-1 rounded-md border border-primary/30 bg-primary/10 px-2 py-0.5 text-[9px] font-medium text-primary transition-colors hover:bg-primary/20 outline-none focus-visible:ring-[3px] focus-visible:ring-ring/50",children:[(0,e.jsx)(ze,{className:"h-2.5 w-2.5"}),"Add reference picture"]})]}),(0,e.jsx)("div",{className:se("h-4 w-4 shrink-0 rounded-md border-2 transition-colors",b?"border-primary bg-primary":"border-border-strong"),children:b&&(0,e.jsx)("svg",{viewBox:"0 0 16 16",fill:"none",className:"h-full w-full",children:(0,e.jsx)("path",{d:"M4 8l3 3 5-6",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:"text-background"})})})]},i.id)}),g&&n&&(0,e.jsx)(s.Suspense,{fallback:null,children:(0,e.jsx)(gs,{open:!!g,onOpenChange:i=>{i||c(null)},projectUuid:n,character:g})})]})};const vs=(0,s.memo)(({frame:t,whichFrame:n,projectUuid:l,shotState:r,onClose:d,onAccept:f,currentStep:h,completedSteps:g=[],onNavigateToStep:c,onSwitchFrame:m})=>{const[i,b]=(0,s.useState)(!1),v=n==="start"?r.startFrameUrl:r.endFrameUrl,{ensureCharacters:S}=ms({frameId:t.id,kind:"image",onAddCharacter:()=>r.setSidebarTab("characters")}),{blockIfFree:E}=_t(),D=(0,s.useMemo)(()=>t.active_version?.data?.cast??[],[t.active_version?.data]),J=(0,s.useCallback)(async({prompt:u})=>!E("generate-image")&&S({prompt:u,projectCharacters:r.characters.projectCharacters,cast:D}),[E,S,r.characters.projectCharacters,D]),w=ls({frame:t,whichFrame:n,projectUuid:l,currentImageUrl:v,providerSlug:r.safeProviderSlug,onAccept:f,currentStep:h,onNavigateToStep:c,beforeGenerate:J}),{handleGenerate:C,isGenerating:T}=w,{insertTokens:A,setPrompt:L,prompt:_}=w,V=(0,s.useMemo)(()=>({...r.characters,attachCharacter:async u=>{A([je(u)]),await r.characters.attachCharacter(u)},unassignCharacter:async(u,a)=>{const p=r.characters.projectCharacters.find(P=>P.id===u);p&&a?.stripMention!==!1&&L(ce(ce(_,je(u)),St(p.slug))),await r.characters.unassignCharacter(u)}}),[r.characters,A,L,_]),M={...r,characters:V},R=t.active_version?.data,j=Ut(t.id,n==="start"?"image_prompt":"end_frame_image_prompt",_,(n==="start"?R?.image_prompt:R?.end_frame_image_prompt)??""),G=(0,s.useCallback)(()=>j(d),[j,d]),N=(0,s.useMemo)(()=>m&&(u=>j(()=>m(u))),[j,m]),z=(0,s.useMemo)(()=>c&&(u=>j(()=>c(u))),[j,c]),I=(0,s.useCallback)(u=>{u.key==="Enter"&&(u.metaKey||u.ctrlKey)&&(u.preventDefault(),C()),u.key==="Escape"&&!T&&(u.preventDefault(),G())},[C,T,G]),{shotNumber:O,nextShotId:$}=$t(t.id),H=!!v,K=h===1&&!!c,U=(0,s.useCallback)(async()=>{w.generationResult&&!T&&await w.handleAcceptResult(),await j(d)},[w,T,j,d]);(0,s.useCallback)(()=>{r.setIsMinimized(!0),d()}
2,[r,d]);const[re,q]=(0,s.useState)(0),B=Ot(),F=(0,s.useCallback)((u,a)=>{q(p=>p+1)},[]);return(0,e.jsxs)("div",{className:"fixed inset-0 z-[60] flex flex-col overflow-y-auto bg-background lg:overflow-hidden",onKeyDown:I,tabIndex:-1,role:"dialog","aria-label":"Shot storyboard",children:[(0,e.jsxs)("div",{className:"flex flex-wrap items-center justify-between gap-2 border-b border-border px-2 py-2.5 sm:px-4",children:[(0,e.jsxs)("div",{className:"flex min-w-0 flex-wrap items-center gap-2 sm:gap-3",children:[(0,e.jsxs)(y,{variant:"ghost",size:"sm",onClick:G,"aria-label":"Back",className:"text-muted-foreground hover:text-foreground",children:[(0,e.jsx)(ot,{className:"h-4 w-4"}),(0,e.jsx)("span",{className:"text-xs font-medium",children:"Back"})]}),(0,e.jsx)("h2",{className:"whitespace-nowrap text-sm font-semibold text-foreground",children:"Shot storyboard"}),(0,e.jsx)(Wt,{frameId:t.id,onSwitchFrame:N}),B&&(0,e.jsx)(Ht,{compact:!0,value:"footage",onChange:u=>void j(()=>void Gt(t.id,u)),disabled:T||!!t.generating_image||!!t.generating_video,disabledReason:"You can change this once the picture or clip for this shot has finished."}),h&&z&&(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)("div",{className:"hidden h-4 w-px bg-border lg:block"}),(0,e.jsx)("nav",{className:"flex items-center gap-1.5","aria-label":"Workflow steps",children:[1,2].map(u=>{const a=g.includes(u),p=u===h,P={1:"Storyboard",2:"Video clip"},Y=u===2&&!H&&!ke(t);return(0,e.jsx)(ne,{content:Y?"Draw the storyboard first":`Step ${u}: ${P[u]}`,side:"bottom",children:(0,e.jsxs)("button",{type:"button","aria-disabled":Y||void 0,"aria-current":p?"step":void 0,onClick:()=>!Y&&z(u),className:se("flex items-center gap-1.5 rounded-md px-2 py-1 text-xs font-medium transition-colors cursor-pointer outline-none focus-visible:ring-[3px] focus-visible:ring-ring/50",Y&&"cursor-not-allowed opacity-50",p&&"bg-primary/20 text-primary",!p&&a&&"text-success hover:bg-surface-hover",!p&&!a&&"text-muted-foreground hover:bg-surface-hover"),children:[(0,e.jsx)("span",{className:se("flex h-5 w-5 items-center justify-center rounded-full text-[10px] font-semibold",p&&"bg-primary text-primary-foreground",!p&&a&&"bg-success/20",!p&&!a&&"bg-secondary"),children:a?(0,e.jsx)(le,{className:"h-3 w-3"}):u}),(0,e.jsx)("span",{children:P[u]})]})},u)})}),(0,e.jsx)("div",{className:"hidden h-4 w-px bg-border lg:block"})]}),(0,e.jsx)(ne,{content:"Watch a short video on how this screen works",side:"bottom",children:(0,e.jsxs)(y,{variant:"outline",size:"xs",onClick:()=>b(!0),className:"border-primary/40 bg-primary/10 text-primary hover:border-primary/60 hover:bg-primary/20",children:[(0,e.jsx)(dt,{className:"h-3.5 w-3.5"}),(0,e.jsx)("span",{children:"Demo"})]})})]}),(0,e.jsxs)("div",{className:"ml-auto flex items-center gap-1",children:[(0,e.jsx)(ne,{content:"History",side:"bottom",children:(0,e.jsxs)(y,{variant:"ghost",size:"xs",onClick:()=>{r.sidebarTab==="history"?r.setSidebarTab(null):r.handleShowHistory()},"aria-pressed":r.sidebarTab==="history",className:"px-2 text-muted-foreground hover:text-foreground",children:[(0,e.jsx)(ct,{className:"h-3.5 w-3.5"}),(0,e.jsx)("span",{children:"History"})]})}),(0,e.jsx)(ne,{content:"Characters",side:"bottom",children:(0,e.jsxs)(y,{variant:"ghost",size:"xs",onClick:()=>{r.sidebarTab==="characters"?r.setSidebarTab(null):r.setSidebarTab("characters")},"aria-pressed":r.sidebarTab==="characters",className:"px-2 text-muted-foreground hover:text-foreground",children:[(0,e.jsx)(ht,{className:"h-3.5 w-3.5"}),(0,e.jsx)("span",{children:"Characters"})]})}),(0,e.jsx)(ne,{content:"Save and go back to the board",side:"bottom",children:(0,e.jsxs)(y,{size:"xs",onClick:()=>void U(),children:[(0,e.jsx)(le,{className:"h-3.5 w-3.5"}),(0,e.jsx)("span",{children:"Done"})]})})]})]}),(0,e.jsxs)("div",{className:"relative flex min-h-[50dvh] flex-1 flex-col overflow-hidden lg:min-h-0 lg:flex-row",children:[(w.canvasImageUrl||w.generationResult)&&(0,e.jsx)(He,{state:w,historyVersion:re}),(0,e.jsxs)("div",{className:"flex min-h-0 flex-1 flex-col overflow-hidden lg:flex-row",children:[(0,e.jsx)(Oe,{state:w,onHistoryChange:F,shotNumber:O,hasSavedPicture:H,deletedStill:Kt(t.active_version?.data,"still"),clipLabel:ke(t)?"Go to the video clip":"Make video clip",onNextStep:K?()=>z?.(2):void 0,onMakeVideo:()=>j(()=>void w.handleAcceptAndNext()),onNextShot:N&&$!==null?()=>N($):void 0}),(0,e.jsx)(Ve,{state:M,projectUuid:l,prompt:_})]})]}),(0,e.jsx)(Xt,{storageKey:"frame-designer-prompt-height",minHeight:180,maxHeight:850,className:"border-t border-border",children:(0,e.jsx)(Be,{state:w,projectUuid:l,frameId:t.id,characters:V,provider:r.provider,onKeyDown:I})}),(0,e.jsx)(os,{isOpen:i,onClose:()=>b(!1),videoKey:"part-4"})]})});vs.displayName="FrameDesigner";export{vs as FrameDesigner};

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.