https://zopia.ai/_next/static/chunks/982.ebc1ba0e66caa37d.js

1!function(){try{var e="undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self?self:{},t=(new e.Error).stack;t&&(e._sentryDebugIds=e._sentryDebugIds||{},e._sentryDebugIds[t]="82d8e708-1ad6-4885-adf6-202f9aca5cf3",e._sentryDebugIdIdentifier="sentry-dbid-82d8e708-1ad6-4885-adf6-202f9aca5cf3")}catch(e){}}();"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[982],{10982:function(e,t,a){a.r(t),a.d(t,{BaseTablesTldrawCanvasInner:function(){return ec},clearPendingMediaDrop:function(){return ei},default:function(){return eu},pendingMediaDrop:function(){return eo}});var r=a(85893),n=a(67294),o=a(70589),i=a(47276),l=a(36970),s=a(78419),d=a(45077),c=a(36316),u=a(37871),p=a(38921),h=a(64712),m=a(11163),f=a(33920),g=a(22198);let v=e=>{let{shape:t}=e,{t:a}=(0,u.$G)("base"),i=(0,o.jE2)(),v=(0,m.useRouter)(),{settings:x}=(0,g.Y)(),{parentNodeId:y,storyboardTableId:w,storyboardName:b,videoUrls:j,status:E}=t.meta,[S,N]=(0,n.useState)(j),[T,C]=(0,n.useState)(!1),[D,k]=(0,n.useState)(!1),[F,P]=(0,n.useState)(null),_=(0,n.useRef)(!1);(0,n.useEffect)(()=>{if(!w)return;let e=l.h6.on("Socket::Record::Created",e=>{e.tableId===w&&(console.log("\uD83D\uDCDD Storyboard record created, refreshing videos...",e.record.id),I(w))}),t=l.h6.on("Socket::Record::Updated",e=>{e.tableId===w&&(console.log("✏️ Storyboard record updated, refreshing videos...",e.record.id),I(w))}),a=l.h6.on("Socket::Record::Deleted",e=>{e.tableId===w&&(console.log("\uD83D\uDDD1️ Storyboard record deleted, refreshing videos...",e.recordId),I(w))});return()=>{e(),t(),a()}},[w]),(0,n.useEffect)(()=>{N(j)},[j]),(0,n.useEffect)(()=>{C(!0)},[]),(0,n.useEffect)(()=>{"pending"===E&&w&&I(w)},[E,w]),(0,n.useEffect)(()=>{if(!i||_.current||D)return;let e=(null==x?void 0:x.aspect_ratio)||"16:9";i.updateShapes([{id:t.id,type:"video_node",props:{w:400,h:400/("9:16"===e?9/16:16/9)+48+16}}]),_.current=!0},[i,D,t.id,null==x?void 0:x.aspect_ratio]);let I=async e=>{try{let t=await fetch("/api/base/records?table_id=".concat(e,"&start=0&size=100")),a=await t.json();if(a.data){let e=[];a.data.forEach(t=>{let a=t.data||{},r=a.videos||[];(null==r?void 0:r.length)&&r[0].url&&e.push(r[0].url)}),e.length!==S.length&&(_.current=!1),N(e)}}catch(e){console.error("Failed to fetch videos from storyboard:",e)}},M=()=>{let e=v.query.baseId||v.query.base_id;e?v.push({pathname:"/base/".concat(e),query:{tableId:w,viewMode:"timeline"}}):h.Am.error("Unable to navigate: base ID not found")};return(0,r.jsx)(r.Fragment,{children:(0,r.jsx)(o.G7H,{id:t.id,className:"pointer-events-auto",style:{width:t.props.w,height:t.props.h,pointerEvents:"all"},children:(0,r.jsxs)("div",{className:"relative flex h-full w-full flex-col overflow-hidden rounded-2xl bg-[#1B1D1F] shadow-lg",children:[(0,r.jsxs)("div",{className:"flex items-center gap-2 border-b border-gray-700 bg-[#252729] px-4 py-3",children:[(0,r.jsx)(s.Z,{className:"h-4 w-4 text-primary"}),(0,r.jsx)("span",{className:"flex-1 truncate text-sm font-semibold text-white",children:b||a("videoNode.untitled")}),(0,r.jsxs)(p.z,{size:"sm",variant:"default",className:"gap-1.5",onClick:e=>{e.stopPropagation(),M()},onPointerDown:e=>e.stopPropagation(),children:[(0,r.jsx)(d.Z,{className:"h-3.5 w-3.5"}),a("videoNode.editInTimeline")]})]}),(0,r.jsxs)("div",{className:"relative flex flex-1 flex-col p-2",children:[D&&(0,r.jsx)("div",{className:"flex h-full w-full items-center justify-center rounded-xl bg-black/20",children:(0,r.jsxs)("div",{className:"flex flex-col items-center gap-2",children:[(0,r.jsx)(c.Z,{className:"h-8 w-8 animate-spin text-primary"}),(0,r.jsx)("span",{className:"text-xs text-gray-400",children:a("videoNode.loadingMetadata")})]})}),!D&&F&&(0,r.jsx)("div",{className:"flex h-full w-full items-center justify-center rounded-xl bg-black/20",children:(0,r.jsx)("span",{className:"text-xs text-red-400",children:F})}),!D&&!F&&S.length>0&&(0,r.jsxs)("div",{className:"group relative flex h-full w-full cursor-pointer items-center justify-center overflow-hidden rounded-xl bg-black",onClick:e=>{e.stopPropagation(),l.h6.emit("VideoPlayer::Open",{storyboardName:b||a("videoNode.untitled"),docuFileId:w})},onPointerDown:e=>e.stopPropagation(),children:[(0,r.jsx)("video",{src:S[0]||"",className:"h-full w-full object-contain",preload:"metadata",muted:!0,playsInl

1ine:!0,onLoadedMetadata:e=>{e.currentTarget.currentTime=1.5}}),(0,r.jsx)("div",{className:"absolute inset-0 flex items-center justify-center bg-black/30 transition-all group-hover:bg-black/50",children:(0,r.jsx)(f.Z,{size:"lg",className:"pointer-events-auto transition-transform group-hover:scale-125"})})]}),!D&&!F&&0===S.length&&(0,r.jsx)("div",{className:"flex h-full w-full items-center justify-center rounded-xl bg-black/20",children:(0,r.jsx)("span",{className:"text-xs text-gray-400",children:a("videoNode.noVideos")})})]})]})})})};class x extends o.EeJ{getDefaultProps(){return{w:400,h:300}}getGeometry(e){return new o.zc7({width:e.props.w,height:e.props.h,isFilled:!0})}component(e){return(0,r.jsx)(v,{shape:e})}onResize(e,t){return(0,o.$eB)(e,t)}indicator(e){return(0,r.jsx)("rect",{width:e.props.w,height:e.props.h,rx:12,ry:12})}constructor(...e){super(...e),this.isAspectRatioLocked=()=>!0,this.canResize=()=>!0}}x.type="video_node",x.props={w:o.T.number,h:o.T.number};let y=e=>{let{shape:t}=e,a=(0,o.jE2)(),{startX:i,startY:l,endX:s,endY:d}=t.props,{startShapeId:c,endShapeId:u,startAnchor:p,endAnchor:h}=t.meta;(0,n.useEffect)(()=>{if(!a||!c||!u)return;let e=()=>{var e,r,n,i;let l=a.getShape(c),s=a.getShape(u);if(!l||!s)return;let d=a.getShapePageBounds(c),m=a.getShapePageBounds(u);if(!d||!m)return;let f=null!==(n=null===(e=a.getShapePageTransform(c))||void 0===e?void 0:e.rotation())&&void 0!==n?n:0,g=null!==(i=null===(r=a.getShapePageTransform(u))||void 0===r?void 0:r.rotation())&&void 0!==i?i:0,v=o.B08.Add(d.point,o.B08.MulV(d.size,o.B08.Rot(o.B08.From(null!=p?p:{x:.5,y:.5}),f))),x=o.B08.Add(m.point,o.B08.MulV(m.size,o.B08.Rot(o.B08.From(null!=h?h:{x:.5,y:.5}),g))),y=Math.min(v.x,x.x),w=Math.min(v.y,x.y),b=v.x-y,j=v.y-w,E=x.x-y,S=x.y-w;(Math.abs(t.x-y)>.1||Math.abs(t.y-w)>.1||Math.abs(t.props.startX-b)>.1||Math.abs(t.props.startY-j)>.1||Math.abs(t.props.endX-E)>.1||Math.abs(t.props.endY-S)>

1.1)&&a.updateShape({id:t.id,type:"electric_connection",x:y,y:w,props:{startX:b,startY:j,endX:E,endY:S}})},r=a.store.listen(t=>{if(t.changes.updated){let a=Object.keys(t.changes.updated);(a.includes(c)||a.includes(u))&&e()}},{scope:"document"});return()=>{r()}},[a,c,u,p,h,t.id,t.x,t.y,t.props]);let m=s-i,f=d-l,g=.4*Math.sqrt(m*m+f*f),v=i+g,x=s-g,y="M ".concat(i," ").concat(l," C ").concat(v," ").concat(l,", ").concat(x," ").concat(d,", ").concat(s," ").concat(d);return(0,r.jsxs)(o.gkc,{style:{pointerEvents:"none"},children:[(0,r.jsxs)("defs",{children:[(0,r.jsxs)("linearGradient",{id:"gradient-".concat(t.id),x1:"0%",y1:"0%",x2:"100%",y2:"0%",children:[(0,r.jsx)("stop",{offset:"0%",stopColor:"#FFFF9C",stopOpacity:"0.7"}),(0,r.jsx)("stop",{offset:"50%",stopColor:"#FFFFCC",stopOpacity:"1"}),(0,r.jsx)("stop",{offset:"100%",stopColor:"#FFFF9C",stopOpacity:"0.7"})]}),(0,r.jsxs)("filter",{id:"glow-".concat(t.id),x:"-100%",y:"-100%",width:"300%",height:"300%",children:[(0,r.jsx)("feGaussianBlur",{stdDeviation:"4",result:"coloredBlur"}),(0,r.jsxs)("feMerge",{children:[(0,r.jsx)("feMergeNode",{in:"coloredBlur"}),(0,r.jsx)("feMergeNode",{in:"SourceGraphic"})]})]}),(0,r.jsxs)("filter",{id:"circle-outer-glow-".concat(t.id),x:"-200%",y:"-200%",width:"500%",height:"500%",children:[(0,r.jsx)("feGaussianBlur",{stdDeviation:"2.5",result:"coloredBlur"}),(0,r.jsxs)("feMerge",{children:[(0,r.jsx)("feMergeNode",{in:"coloredBlur"}),(0,r.jsx)("feMergeNode",{in:"SourceGraphic"})]})]}),(0,r.jsx)("filter",{id:"circle-backdrop-blur-".concat(t.id),x:"-50%",y:"-50%",width:"200%",height:"200%",children:(0,r.jsx)("feGaussianBlur",{stdDeviation:"3",in:"SourceGraphic"})}),(0,r.jsxs)("linearGradient",{id:"flow-gradient-".concat(t.id),x1:"0%",y1:"0%",x2:"100%",y2:"0%",children:[(0,r.jsx)("stop",{offset:"0%",stopColor:"#FFFFCC",stopOpacity:"0",children:(0,r.jsx)("animate",{attributeName:"offset",values:"-0.3;1.3",dur:"1.5s",repeatCount:"indefinite"})}),(0,r.jsx)("stop",{offset:"30%",stopColor:"#FFFFFF",stopOpacity:"1",children:(0,r.jsx)("animate",{attributeName:"offset",values:"0;1.6",dur:"1.5s",repeatCount:"indefinite"})}),(0,r.jsx)("stop",{offset:"50%",stopColor:"#FFFFCC",stopOpacity:"0.5",children:(0,r.jsx)("animate",{attributeName:"offset",values:"0.2;1.8",dur:"1.5s",repeatCount:"indefinite"})})]}),(0,r.jsxs)("linearGradient",{id:"flow-gradient-2-".concat(t.id),x1:"0%",y1:"0%",x2:"100%",y2:"0%",children:[(0,r.jsx)("stop",{offset:"0%",stopColor:"#FFFFCC",stopOpacity:"0",children:(0,r.jsx)("animate",{attributeName:"offset",values:"-0.5;1.5",dur:"2s",repeatCount:"indefinite",begin:"0.5s"})}),(0,r.jsx)("stop",{offset:"20%",stopColor:"#FFFFFF",stopOpacity:"0.8",children:(0,r.jsx)("animate",{attributeName:"offset",values:"-0.3;1.7",dur:"2s",repeatCount:"indefinite",begin:"0.5s"})})]}),(0,r.jsxs)("radialGradient",{id:"circle-fill-".concat(t.id),children:[(0,r.jsx)("stop",{offset:"0%",stopColor:"#FFFFCC",stopOpacity:"1"}),(0,r.jsx)("stop",{offset:"100%",stopColor:"#FFFF9C",stopOpacity:"1"})]})]}),(0,r.jsx)("path",{d:y,fill:"none",stroke:"url(#gradient-".concat(t.id,")"),strokeWidth:"3.5",strokeLinecap:"round"}),(0,r.jsx)("path",{d:y,fill:"none",stroke:"url(#flow-gradient-".concat(t.id,")"),strokeWidth:"4",strokeLinecap:"round",opacity:"0.9"}),(0,r.jsx)("path",{d:y,fill:"none",stroke:"url(#flow-gradient-2-".concat(t.id,")"),strokeWidth:"3",strokeLinecap:"round",opacity:"0.7"}),(0,r.jsx)("circle",{cx:i,cy:l,r:6,fill:"#FFFF9C",opacity:"0.5",filter:"url(#circle-outer-glow-".concat(t.id,")")}),(0,r.jsx)("circle",{cx:i,cy:l,r:6,fill:"url(#circle-fill-".concat(t.id,")")}),(0,r.jsx)("circle",{cx:i,cy:l,r:5,fill:"none",stroke:"#FFFFFF",strokeWidth:"1",opacity:"0.8",style:{filter:"blur(1px)"}}),(0,r.jsx)("circle",{cx:s,cy:d,r:6,fill:"#FFFF9C",opacity:"0.5",filter:"url(#circle-outer-glow-".concat(t.id,")")}),(0,r.jsx)("circle",{cx:s,cy:d,r:6,fill:"url(#circle-fill-".concat(t.id,")")}),(0,r.jsx)("circle",{cx:s,cy:d,r:5,fill:"none",stroke:"#FFFFFF",strokeWidth:"1",opacity:"0.8",style:{filter:"blur(1px)"}})]})};class w extends o.EeJ{getDefaultProps(){return{startX:0,startY:0,endX:100,endY:100}}getGeometry(e){return new o.zc7({x:0,y:0,width:0,height:0,isFilled:!1})}component(e){return(0,r.jsx)(y,{shape:e})}indicator(e){return null}constructor(...e){super(...e),this.isAspectRatioLocked=()=>!1,this.canResize=()=>!1,this.canBind=()=>!1,this.canEdit=()=>!1,this.canScroll=()=>

1!1,this.hideSelectionBoundsFg=()=>!0,this.hideSelectionBoundsBg=()=>!0,this.hideRotateHandle=()=>!0,this.canSnap=()=>!1}}w.type="electric_connection",w.props={startX:o.T.number,startY:o.T.number,endX:o.T.number,endY:o.T.number};var b=a(77832),j=a(73510),E=a(21769),S=a(79840);let N=0,T=e=>{let{type:t}=e;return(0,r.jsx)("div",{className:"group/placeholder w-full h-full flex items-center justify-center bg-[#30363D] border border-dashed border-white/10 rounded-md transition-all duration-300",children:"image"===t?(0,r.jsx)(S.XB,{className:"w-full h-full text-muted-foreground/30 group-hover/placeholder:brightness-200 transition-all duration-200",strokeWidth:1.5}):(0,r.jsx)(S.Od,{className:"w-full h-full text-muted-foreground/30 group-hover/placeholder:brightness-200 transition-all duration-200",strokeWidth:1.5})})},C=e=>{let{progress:t=0,message:a,type:n}=e;return(0,r.jsx)("div",{className:"w-full h-full relative rounded-lg overflow-hidden",children:(0,r.jsx)(E.B,{className:"w-full h-full rounded-lg",duration:1.5,animate:!0})})},D=e=>{let{error:t="Generation failed",retryable:a=!0,shapeId:n}=e;return(0,r.jsxs)("div",{className:"w-full h-full flex flex-col items-center justify-center bg-red-950/20 border border-red-500/30 rounded-md p-4 relative",children:[(0,r.jsx)(j.Z,{className:"w-20 h-20 text-red-400 mb-3",strokeWidth:1.5}),(0,r.jsx)("div",{className:"text-red-200 text-xl text-center mb-4 max-w-[90%] break-words",children:t})]})},k=e=>{let{type:t,mediaUrl:a,width:o,height:i}=e,[l,s]=n.useState(!0),[d,c]=n.useState(!1),[u,p]=n.useState(!1),h=n.useRef(null);return"image"===t?(0,r.jsxs)("div",{className:"w-full h-full relative rounded-lg overflow-hidden bg-black",children:[l&&(0,r.jsx)("div",{className:"absolute inset-0 flex items-center justify-center bg-gray-900",children:(0,r.jsx)("div",{className:"text-white text-sm",children:"Loading..."})}),d?(0,r.jsx)("div",{className:"absolute inset-0 flex items-center justify-center bg-gray-900",children:(0,r.jsx)("div",{className:"text-red-400 text-sm",children:"Failed to load image"})}):(0,r.jsx)("img",{src:a,alt:"Generated content",className:"w-full h-full object-contain",onLoad:()=>s(!1),onError:()=>{s(!1),c(!0)},style:{width:o,height:i,pointerEvents:"none",userSelect:"none"},draggable:!1})]}):(0,r.jsx)("div",{className:"w-full h-full relative rounded-lg overflow-hidden bg-black",children:d?(0,r.jsx)("div",{className:"absolute inset-0 flex items-center justify-center bg-gray-900",children:(0,r.jsx)("div",{className:"text-red-400 text-sm",children:"Failed to load video"})}):(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)("video",{ref:h,src:a,className:"w-full h-full object-contain cursor-pointer",controls:!0,onLoadedData:()=>s(!1),onError:()=>{s(!1),c(!0)},onPlay:()=>p(!0),onPause:()=>p(!1),onEnded:()=>p(!1),onClick:e=>{e.stopPropagation(),e.preventDefault(),u&&h.current&&h.current.pause()},style:{width:o,height:i},draggable:!1,children:"Your browser does not support the video tag."}),!u&&(0,r.jsx)("div",{className:"absolute inset-0 flex items-center justify-center pointer-events-none",children:(0,r.jsx)("div",{className:"w-24 h-24 rounded-full bg-black/60 flex items-center justify-center hover:bg-black/80 transition-all duration-200 hover:scale-110 shadow-xl cursor-pointer pointer-events-auto",onClick:e=>{e.stopPropagation(),e.preventDefault(),h.current&&(u?h.current.pause():h.current.play(),p(!u))},onPointerDown:e=>e.stopPropagation(),children:(0,r.jsx)("svg",{className:"w-12 h-12 text-white ml-1.5",fill:"currentColor",viewBox:"0 0 24 24",children:(0,r.jsx)("path",{d:"M8 5v14l11-7z"})})})})]})})},F=e=>{let t,{shape:a}=e,{state:i,type:l,progress:s,message:d,error:c,retryable:u,mediaUrl:p}=a.meta,[h,m]=n.useState(!1);switch(n.useEffect(()=>{let e=e=>{let{shapeIds:t}=e.detail;t.includes(a.id)&&m(!0)},t=()=>{m(!1)};return window.addEventListener("tldraw:media:enter-drop-target",e),window.addEventListener("tldraw:media:leave-drop-target",t),()=>{window.removeEventListener("tldraw:media:enter-drop-target",e),window.removeEventListener("tldraw:media:leave-drop-target",t)}},[a.id]),i){case"placeholder":t=(0,r.jsx)(T,{type:l});break;case"generating":t=(0,r.jsx)(C,{progress:s,message:d,type:l});break;case"error":t=(0,r.jsx)(D,{error:c,retryable:u,shapeId:a.id});break;case"complete":t=p?(0,r.jsx)(k,{type:l,mediaUrl:p,width:a.props.w,height:a.props.h}):null;break;default:t=null}return(0,r.jsx)(o.G7H,{id:a.id,style:{width:a.props.w,height:a.props.h,pointerEvents:"all"},children:(0,r.jsx)("div",{style:{width:"100%",height:"100%",transition:"transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.3s ease, border-radius 0.3s ease",transform:h?"scale(0.3)":"scale(1)",boxShadow:h?"0 0 0 3px rgba(59, 130, 246, 0.6), 0 20px 60px rgba(0, 0, 0, 0.5), 0 0 40px rgba(59, 130, 246, 0.2)":"none",borderRadius:h?"12px":"0px",overflow:"hidden"},children:t})})};class P extends o.EeJ{getDefaultProps(){return{w:240,h:240}}getGeometry(e){return new o.zc7({width:e.props.w,height:e.props.h,isFilled:!0})}component(e){return(0,r.jsx)(F,{shape:e})}indicator(e){return(0,r.jsx)("rect",{width:e.props.w,height:e.props.h,rx:8,ry:8})}onTranslate(e,t){if(!eo||"complete"!==t.meta.state)return;let a=Date.now();if(a-N<60)return;N=a;let{editor:r}=this,n=document.querySelector(".tl-container");if(!n)return;let o=n.getBoundingClientRect(),i=r.inputs.currentScreenPoint,l=o.left+i.x,s=o.top+i.y,d=document.elementsFromPoint(l,s),c=null;for(let e of d){let t=e.closest("[data-entity-card-id]");if(t){c=t.getAttribute("data-entity-card-id");break}let a=e.closest("[data-storyboard-row-id]");if(a){c=a.getAttribute("data-storyboard-row-id");break}}c?window.dispatchEvent(new CustomEvent("tldraw:media:drag-hover",{detail:{tableId:eo.tableId,recordId:c}})):window.dispatchEvent(new CustomEvent("tldraw:media:drag-clear"))}onTranslateEnd(e){if(!eo||"complete"!==e.meta.state||!e.meta.mediaUrl)return;let{editor:t}=this,a=e.meta.mediaUrl,r=e.meta.type;console.log("\uD83C\uDFAF onTranslateEnd: shape dropped while over drop target");let n=document.querySelector(".tl-container");if(!n)return;let o=n.getBoundingClientRect(),i=t.inputs.currentScreenPoint,l=o.left+i.x,s=o.top+i.y,d=document.elementsFromPoint(l,s),c=null,u=null;for(let e of d){if(!c){let t=e.closest("[data-entity-card-id]");t&&(c=t)}if(!u){let t=e.closest("[data-storyboard-row-id]");t&&(u=t)}if(c||u)break}let p=!1;if(c&&"image"===r){let e=c.getAttribute("data-entity-card-id");console.log("✅ Adding image to EntityCard:",e),window.dispatchEvent(new CustomEvent("entity:add-image-from-tldraw",{detail:{recordId:e,imageUrl:a}})),p=!0}else if(u){let e=u.getAttribute("data-storyboard-row-id");console.log("✅ Adding ".concat(r," to StoryboardRow:"),e),window.dispatchEvent(new CustomEvent("storyboard:add-media-from-tldraw",{detail:{recordId:e,mediaUrl:a,mediaType:r}})),p=!0}else console.log("❌ No drop target found at position");p&&setTimeout(()=>{t.deleteShapes([e.id])},100),ei(),window.dispatchEvent(new CustomEvent("tldraw:media:drag-clear")),window.dispatchEvent(new CustomEvent("tldraw:media:leave-drop-target"))}constructor(...e){super(...e),this.isAspectRatioLocked=()=>!1,this.canResize=()=>!1}}function _(e){let t={};for(let a in e)void 0!==e[a]&&("object"!=typeof e[a]||null===e[a]||Array.isArray(e[a])?t[a]=e[a]:t[a]=_(e[a]));return t}function I(e,t){let a=arguments.length>2&&void 0!==arguments[2]?arguments[2]:240;return t<=a?{width:e,height:t}:{width:Math.round(e*(a/t)),height:a}}function M(){let e=(0,o.jE2)();return{createMediaShape:t=>{let{x:a,y:r,type:n,width:i,height:l,generationParams:s,mediaUrl:d}=t,c=(0,o.F17)(),u={type:n,state:d?"complete":"placeholder"};if(void 0!==s&&(u.generationParams=s),d&&(u.mediaUrl=d),e.createShape({id:c,type:"media_base",x:a,y:r,props:{w:null!=i?i:240,h:null!=l?l:240},meta:_(u)}),e.select(c),d&&void 0===i&&void 0===l){if("image"===n){let t=new Image;t.onload=()=>

1{let a=I(t.naturalWidth,t.naturalHeight);e.updateShape({id:c,type:"media_base",props:{w:a.width,h:a.height}})},t.src=d}else if("video"===n){let t=document.createElement("video");t.onloadedmetadata=()=>{let a=I(t.videoWidth,t.videoHeight);e.updateShape({id:c,type:"media_base",props:{w:a.width,h:a.height}}),t.src=""},t.src=d}}return c},startGenerating:(t,a,r)=>{let n=e.getShape(t);if(!n){console.warn("Shape ".concat(t," not found for startGenerating"));return}let o={...n.meta,state:"generating",progress:0};void 0!==a&&(o.taskId=a),void 0!==r&&(o.generationParams=r),e.updateShape({id:t,type:"media_base",meta:_(o)})},updateProgress:(t,a,r)=>{let n=e.getShape(t);if(!n||"media_base"!==n.type)return;let o={...n.meta,progress:a};void 0!==r&&(o.message=r),e.updateShape({id:t,type:"media_base",meta:_(o)})},replaceWithMedia:t=>{let{shapeId:a,mediaUrl:r,type:n,width:o,height:i,metadata:l}=t;console.log("\uD83D\uDDBC️ replaceWithMedia called:",{shapeId:a,mediaUrl:r,type:n,width:o,height:i});let s=e.getShape(a);if(!s){console.warn("Shape ".concat(a," not found for replaceWithMedia"));return}console.log("\uD83D\uDCCD Current shape position:",{x:s.x,y:s.y,type:s.type});let d=I(o,i),c=d.width,u=d.height;console.log("\uD83D\uDCD0 Dimensions:",{original:{width:o,height:i},constrained:{width:c,height:u}});let p={...s.meta,state:"complete",mediaUrl:r,metadata:l,progress:void 0,message:void 0,taskId:void 0};e.updateShape({id:a,type:"media_base",props:{w:c,h:u},meta:_(p)}),console.log("✅ Updated to complete state")},showError:function(t,a){let r=!(arguments.length>2)||void 0===arguments[2]||arguments[2],n=e.getShape(t);if(!n){console.warn("Shape ".concat(t," not found for showError"));return}let o={...n.meta,state:"error",error:a,retryable:r};e.updateShape({id:t,type:"media_base",meta:_(o)})},retryGeneration:t=>{let a=e.getShape(t);if(!a){console.warn("Shape ".concat(t," not found for retryGeneration"));return}let r={...a.meta,state:"placeholder",error:void 0,progress:void 0,message:void 0,taskId:void 0};e.updateShape({id:t,type:"media_base",meta:_(r)}),e.select(t)},deleteShape:t=>{e.deleteShape(t)}}}P.type="media_base",P.props={w:o.T.number,h:o.T.number};var R=a(71657);function L(e){let t=(0,o.jE2)(),a=M(),r=(0,R.H)();return(0,n.useEffect)(()=>{if(!t)return;let e=l.h6.on("Socket::Tldraw::Media::Progress",e=>{a.updateProgress(e.shapeId,e.progress,e.message)}),r=l.h6.on("Socket::Tldraw::Media::Complete",e=>{console.log("\uD83C\uDF89 Received complete event in useTldrawMediaGeneration:",e),a.replaceWithMedia({shapeId:e.shapeId,mediaUrl:e.mediaUrl,type:e.type,width:e.width,height:e.height,metadata:e.metadata})}),n=l.h6.on("Socket::Tldraw::Media::Error",e=>{a.showError(e.shapeId,e.error,e.retryable)});return()=>{e(),r(),n()}},[t,a]),{generateMedia:n=>{let{shapeId:o,type:i,width:l,height:s,generationParams:d}=n;a.startGenerating(o,void 0,d);let c={baseId:e,shapeId:o,type:i,width:l,height:s,generationParams:d};console.log("\uD83D\uDE80 Emitting tldraw:media:generate event:",c),r.emit("tldraw:media:generate",c,e=>{if(null==e?void 0:e.taskId){console.log("\uD83D\uDCCB Received taskId ".concat(e.taskId," for shape ").concat(o));let a=t.getShape(o);a&&"media_base"===a.type&&t.updateShape({id:o,type:"media_base",meta:{...a.meta,taskId:e.taskId}})}else(null==e?void 0:e.error)&&console.warn("⚠️ Generate event ack returned error: ".concat(e.error))})},cancelGeneration:t=>{r.emit("tldraw:media:cancel",{baseId:e,shapeId:t}),a.deleteShape(t)}}}var B=a(20062),z=a(73935),A=a(90112);function O(e){var t,a;let{baseId:i}=e,{t:l}=(0,u.$G)("base"),s=(0,o.jE2)(),[d,c]=(0,n.useState)(null),p=L(i),m=(0,n.useRef)(null),{settings:f}=(0,g.Y)(),v=(0,o.HgN)("selected shape ids",()=>s.getSelectedShapeIds(),[s]),x=v.map(e=>s.getShape(e)).filter(e=>!!e&&"media_base"===e.type),y=1===x.length?x[0]:null,w=(0,o.HgN)("shape position",()=>{if(!y)return null;let e=s.getShapePageBounds(y.id);if(!e)return null;let t=s.pageToScreen({x:e.x,y:e.y}),a=s.pageToScreen({x:e.x+e.w,y:e.y+e.h});return{x:t.x,y:t.y,width:a.x-t.x,height:a.y-t.y,centerX:(t.x+a.x)/2}},[s,y]);(0,n.useEffect)(()=>{let e=document.querySelector(".tl-container");if(e){let t=e.querySelector("#media-placeholder-editor-portal");t||((t=document.createElement("div")).id="media-placeholder-editor-portal",t.style.position="absolute",t.style.top="0",t.style.left="0",t.style.width="100%",t.style.height="100%",t.style.pointerEvents="none",e.appendChild(t)),c(t)}},[]);let b=(0,n.useRef)(null),j=(0,n.useRef)("image"),E=(0,n.useRef)(0),S=(0,n.useRef)(null);(0,n.useEffect)(()=>

1{if(y){var e;b.current=y.id,j.current=(null===(e=y.meta)||void 0===e?void 0:e.type)||"image"}},[y]);let N=async e=>{let t=Date.now();if(t-E.current<3e3){h.Am.error(l("generation.rateLimitTooFrequent"));return}let a=JSON.stringify(e);if(S.current===a){let e=window.confirm(l("generation.sameParamsConfirm"));if(!e)return}E.current=t,S.current=a;let r=b.current,n=j.current;if(!r)return;let{width:o,height:i}=T(e.size,e.aspect_ratio);console.log("\uD83D\uDCDD MediaPlaceholderEditor handleGenerate:",{shapeId:r,type:n,width:o,height:i,generationParams:e}),p.generateMedia({shapeId:r,type:n,width:o,height:i,generationParams:e})},T=(e,t)=>{let a=512,r=512;if(e&&e.includes("x")){let[t,n]=e.split("x").map(Number);if(!isNaN(t)&&!isNaN(n))return{width:a=t,height:r=n}}if(t){let[e,n]=t.split(":").map(Number);isNaN(e)||isNaN(n)||(e>n?(a=1024,r=Math.round(1024*n/e)):(r=1024,a=Math.round(1024*e/n)))}return{width:a,height:r}},[C]=(0,n.useState)("image"),D=y?(null===(t=y.meta)||void 0===t?void 0:t.type)||"image":C,k=y?null===(a=y.meta)||void 0===a?void 0:a.generationParams:void 0,F=()=>({prompt:"",model_id:"video"===D?"generate_video_by_seedance_15":(0,A.I0)(f,"storyboard")}),[P,_]=(0,n.useState)(()=>null!=k?k:F()),[I,M]=(0,n.useState)(null),R=(0,n.useCallback)(e=>{_(t=>{let a="function"==typeof e?e(t):e,r=JSON.parse(JSON.stringify(a)),n=null==y?void 0:y.id;if(n){let e=s.getShape(n);if(e&&"media_base"===e.type){let t={...e.meta,generationParams:r};s.updateShape({id:n,type:"media_base",meta:t})}}return r})},[s,null==y?void 0:y.id]);(0,n.useEffect)(()=>{if(y){var e;let t=null===(e=y.meta)||void 0===e?void 0:e.generationParams;_(null!=t?t:F()),M(y.id)}else M(null)},[null==y?void 0:y.id]),(0,n.useEffect)(()=>{if(y){var e;console.log("\uD83C\uDFA8 MediaPlaceholderEditor - Selected shape:",{id:y.id,type:y.type,state:null===(e=y.meta)||void 0===e?void 0:e.state,mediaType:D,meta:y.meta,existingParams:k})}},[null==y?void 0:y.id]);let O=(0,o.HgN)("is translating",()=>s.getPath().includes("translating"),[s]);if(!d)return null;let G=!!y&&!!w&&!O,Y=!!y&&!!I&&I===y.id,$={position:"absolute",left:w?"".concat(w.centerX-300,"px"):"0px",top:w?"".concat(w.y+w.height-40,"px"):"0px",width:"".concat(600,"px"),pointerEvents:G?"auto":"none",visibility:G?"visible":"hidden"};return(0,z.createPortal)((0,r.jsxs)("div",{style:$,className:"tldraw-media-editor-wrapper",children:[(0,r.jsx)("div",{className:"bg-background rounded-2xl shadow-2xl border border-border/50",children:Y&&y&&(0,r.jsx)(B.Z,{ref:m,handleGenerate:N,generationParams:P,setGenerationParams:R,previewType:D},y.id)}),(0,r.jsx)("style",{children:"\n        /* Ensure dropdowns and popovers from this editor appear above tldraw canvas */\n        body:has(.tldraw-media-editor-wrapper) [data-radix-popper-content-wrapper] {\n          z-index: 10000 !important;\n        }\n      "})]}),d)}var G=a(75283),Y=a(66784),$=a(6175);function U(e){let{position:t,onSelect:a,onClose:o}=e,{t:i}=(0,u.$G)(),[l,s]=n.useState(null);n.useEffect(()=>{s(document.querySelector(".tl-container"))},[]),n.useEffect(()=>{let e=e=>{let t=e.target;t.closest(".media-type-menu")||o()},t=setTimeout(()=>{document.addEventListener("mousedown",e)},100);return()=>{clearTimeout(t),document.removeEventListener("mousedown",e)}},[o]),n.useEffect(()=>{let e=e=>{"Escape"===e.key&&o()};return document.addEventListener("keydown",e),()=>{document.removeEventListener("keydown",e)}},[o]);let d={position:"absolute",left:"".concat(t.x,"px"),top:"".concat(t.y-$.R,"px"),pointerEvents:"auto",zIndex:1e4},c=e=>{a(e),o()};return l?(0,z.createPortal)((0,r.jsx)("div",{style:d,className:"media-type-menu",children:(0,r.jsxs)("div",{className:"bg-background rounded-lg shadow-2xl border border-border/50 overflow-hidden min-w-[180px]",children:[(0,r.jsxs)("button",{className:"w-full flex items-center gap-3 px-4 py-3 hover:bg-accent transition-colors text-left",onClick:()=>c("image"),children:[(0,r.jsx)(G.Z,{className:"w-5 h-5 text-primary",strokeWidth:1.5}),(0,r.jsx)("span",{className:"text-sm font-medium",children:i("base:mediaTypeMenu.generateImage")})]}),(0,r.jsx)("div",{className:"h-px bg-border/50"}),(0,r.jsxs)("button",{className:"w-full flex items-center gap-3 px-4 py-3 hover:bg-accent transition-colors text-left",onClick:()=>c("video"),children:[(0,r.jsx)(Y.Z,{className:"w-5 h-5 text-primary",strokeWidth:1.5}),(0,r.jsx)("span",{className:"text-sm font-medium",children:i("base:mediaTypeMenu.generateVideo")})]})]})}),l):null}function X(e){let{baseId:t}=e,a=(0,o.jE2)(),i=M(),l=L(t);!function(){let e=(0,o.jE2)(),t=M(),a=(0,n.useRef)(new Set),r=(0,n.useRef)(null),i=(0,n.useCallback)(async e=>{try{let t=await fetch("/api/task/".concat(e));if(!t.ok)return 404===t.status&&console.warn("⚠️ Task ".concat(e," not found or unauthorized")),null;return await t.json()}catch(t){return console.warn("⚠️ Failed to fetch task status for ".concat(e,":"),t),null}},[]),l=(0,n.useCallback)(async(a,r)=>{let n=await i(r);if(!n)return!0;

1if("succeeded"===n.status){var o,l,s,d;let i=null===(l=n.result)||void 0===l?void 0:null===(o=l[0])||void 0===o?void 0:o.url;if(!i)return t.showError(a,"No media URL in completed task",!0),!0;let c=e.getShape(a),u=null===(s=null==c?void 0:c.meta)||void 0===s?void 0:s.generationParams,p=(null===(d=null==c?void 0:c.meta)||void 0===d?void 0:d.type)||"image",{width:h,height:m}=function(e,t){let a=512,r=512;if(e&&e.includes("x")){let[t,a]=e.split("x").map(Number);if(!isNaN(t)&&!isNaN(a))return{width:t,height:a}}if(t){let[e,n]=t.split(":").map(Number);isNaN(e)||isNaN(n)||(e>n?(a=1024,r=Math.round(1024*n/e)):(r=1024,a=Math.round(1024*e/n)))}return{width:a,height:r}}(null==u?void 0:u.size,null==u?void 0:u.aspect_ratio);return console.log("\uD83D\uDD04 Recovering shape ".concat(a,": task ").concat(r," succeeded")),t.replaceWithMedia({shapeId:a,mediaUrl:i,type:p,width:h,height:m}),!0}if("failed"===n.status||"cancelled"===n.status){let e=n.error||"Generation failed";return console.log("\uD83D\uDD04 Recovering shape ".concat(a,": task ").concat(r," ").concat(n.status)),t.showError(a,e,"failed"===n.status),!0}return!1},[e,t,i]),s=(0,n.useCallback)(async()=>{let t=e.getCurrentPageShapes(),r=t.filter(e=>{if("media_base"!==e.type)return!1;let t=e.meta;return(null==t?void 0:t.state)==="generating"&&(null==t?void 0:t.taskId)});if(0===r.length){a.current.clear();return}for(let e of r){let t=e.meta.taskId;if(a.current.has(t))continue;a.current.add(t);let r=await l(e.id,t);r&&a.current.delete(t)}},[e,l]);(0,n.useEffect)(()=>{let e=setTimeout(()=>{s()},2e3);return r.current=setInterval(()=>{s()},1e4),()=>{clearTimeout(e),r.current&&clearInterval(r.current),a.current.clear()}},[s])}();let[s,d]=(0,n.useState)(null);return(0,n.useEffect)(()=>{let e=a.getStateDescendant("select.idle");if(!e)return;let t=e.handleDoubleClickOnCanvas;e.handleDoubleClickOnCanvas=function(e){let t=a.screenToPage({x:0,y:0});d({visible:!0,position:{x:0,y:0},pagePosition:{x:t.x,y:t.y}})};let r=e=>{d(t=>{if((null==t?void 0:t.visible)&&0===t.position.x){let t=a.screenToPage({x:e.clientX,y:e.clientY});return{visible:!0,position:{x:e.clientX,y:e.clientY},pagePosition:{x:t.x,y:t.y}}}return t})},n=document.querySelector(".tl-container");return null==n||n.addEventListener("dblclick",r),()=>{e.handleDoubleClickOnCanvas=t,null==n||n.removeEventListener("dblclick",r)}},[a]),(0,n.useEffect)(()=>{let e=e=>{let{shapeId:t,prompt:a,type:r}=e.detail;console.warn("Deprecated event handler: tldraw:media:submit")},t=e=>{let{shapeId:t}=e.detail;i.deleteShape(t)},a=e=>{let{shapeId:t}=e.detail;l.cancelGeneration(t)},r=e=>{let{shapeId:t}=e.detail;i.retryGeneration(t)},n=e=>{let{shapeId:t}=e.detail;i.deleteShape(t)};return window.addEventListener("tldraw:media:submit",e),window.addEventListener("tldraw:media:cancel-placeholder",t),window.addEventListener("tldraw:media:cancel-generation",a),window.addEventListener("tldraw:media:retry",r),window.addEventListener("tldraw:media:delete-error",n),()=>{window.removeEventListener("tldraw:media:submit",e),window.removeEventListener("tldraw:media:cancel-placeholder",t),window.removeEventListener("tldraw:media:cancel-generation",a),window.removeEventListener("tldraw:media:retry",r),window.removeEventListener("tldraw:media:delete-error",n)}},[l,i]),(0,n.useEffect)(()=>{let e=document.querySelector(".tl-container");if(!e)return;let t="application/x-tldraw-media",r=e=>{e.dataTransfer&&e.dataTransfer.types.includes(t)&&(e.preventDefault(),e.stopPropagation(),e.dataTransfer.dropEffect="copy")},n=e=>{if(!e.dataTransfer||!e.dataTransfer.types.includes(t))return;e.preventDefault(),e.stopPropagation();let r=e.dataTransfer.getData(t);if(r)try{let t=JSON.parse(r);if(!t.mediaUrl)return;let n=a.screenToPage({x:e.clientX,y:e.clientY}),o=i.createMediaShape({x:n.x-120,y:n.y-120,type:t.mediaType,mediaUrl:t.mediaUrl,generationParams:t.generationParams});if("image"===t.mediaType){let e=new Image;e.onload=()=>{let{width:t,height:r}=I(e.naturalWidth,e.naturalHeight);a.updateShape({id:o,type:"media_base",props:{w:t,h:r}})},e.src=t.mediaUrl}else{let e=document.createElement("video");e.onloadedmetadata=()=>{let{width:t,height:r}=I(e.videoWidth,e.videoHeight);a.updateShape({id:o,type:"media_base",props:{w:t,h:r}})},e.src=t.mediaUrl}}catch(e){console.error("Failed to parse tldraw media drop data:",e)}};return e.addEventListener("dragover",r,!0),e.addEventListener("drop",n,!0),()=>{e.removeEventListener("dragover",r,!0),e.removeEventListener("drop",n,!0)}},[a,i]),(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(O,{baseId:t}),(null==s?void 0:s.visible)&&(0,r.jsx)(U,{position:s.position,onSelect:e=>{s&&(i.createMediaShape({x:s.pagePosition.x,y:s.pagePosition.y,type:e}),d(null))},onClose:()=>{d(null)}})]})}var W=a(62993),Z=a(2043),q=a(86504),H=a(33299),J=a(72741),V=a(7314),K=a(31012),Q=a(15662),ee=a(44178);let et=e=>{let{editor:t}

1=e,[a,o]=(0,n.useState)(100),[i,l]=(0,n.useState)("select");(0,n.useEffect)(()=>{if(!t)return;let e=()=>{let e=t.getZoomLevel();o(Math.round(100*e))},a=()=>{let e=t.getCurrentToolId();l(e)};e(),a();let r=t.store.listen(()=>{e(),a()});return r},[t]);let s=(0,n.useCallback)(()=>{if(!t)return;let e=t.getZoomLevel();t.setCamera({...t.getCamera(),z:1.2*e},{animation:{duration:200}})},[t]),d=(0,n.useCallback)(()=>{if(!t)return;let e=t.getZoomLevel();t.setCamera({...t.getCamera(),z:e/1.2},{animation:{duration:200}})},[t]),c=(0,n.useCallback)(()=>{t&&t.zoomToFit({animation:{duration:400}})},[t]),u=(0,n.useCallback)(()=>{t&&t.setCurrentTool("select")},[t]),h=(0,n.useCallback)(()=>{t&&t.setCurrentTool("hand")},[t]);return(0,r.jsxs)("div",{className:"absolute bottom-4 left-4 flex items-center gap-2 z-10",children:[(0,r.jsxs)("div",{className:"flex items-center gap-1 bg-background-secondary rounded-lg p-1",children:[(0,r.jsx)(p.z,{variant:"ghost",size:"icon",className:"p-1 hover:bg-accent",onClick:d,disabled:!t,title:"缩小 (Zoom Out)",children:(0,r.jsx)(V.Z,{className:"h-5 w-5 text-white/70"})}),(0,r.jsxs)("button",{className:"min-w-[30px] h-full p-1 text-sm font-heading text-white/80 font-medium hover:bg-accent rounded transition-colors",onClick:c,disabled:!t,title:"适配所有元素 (Fit to Screen)",children:[a,"%"]}),(0,r.jsx)(p.z,{variant:"ghost",size:"icon",className:"p-1 hover:bg-accent",onClick:s,disabled:!t,title:"放大 (Zoom In)",children:(0,r.jsx)(K.Z,{className:"h-5 w-5 text-white/70"})})]}),(0,r.jsxs)("div",{className:"flex items-center gap-1 bg-background-secondary rounded-lg p-1",children:[(0,r.jsx)("button",{className:(0,J.cn)("p-1.5 rounded transition-colors","select"===i?"bg-accent text-white":"text-white/70 hover:bg-accent hover:text-white"),onClick:u,disabled:!t,title:"选择工具 (Select)",children:(0,r.jsx)(Q.Z,{className:"h-4 w-4"})}),(0,r.jsx)("button",{className:(0,J.cn)("p-1.5 rounded transition-colors","hand"===i?"bg-accent text-white":"text-white/70 hover:bg-accent hover:text-white"),onClick:h,disabled:!t,title:"手型工具 (Hand)",children:(0,r.jsx)(ee.Z,{className:"h-4 w-4"})})]})]})};var ea=a(80496);let er=e=>{let{shape:t}=e,{table:a}=t.meta,l=(0,m.useRouter)(),{t:s}=(0,u.$G)(["common","base"]),d=(0,o.jE2)(),c=(0,o.HgN)("selected shape ids",()=>d.getSelectedShapeIds(),[d]),h=(0,n.useRef)(null),[f,g]=(0,n.useState)(!1),v=c.includes(t.id);return(0,n.useEffect)(()=>{let e=h.current;if(!e)return;let t=e=>{if(e.ctrlKey||e.metaKey){e.preventDefault();return}f&&e.stopPropagation()},a=e=>{f&&(e.preventDefault(),e.stopPropagation())};return e.addEventListener("wheel",t,{capture:!0,passive:!1}),e.addEventListener("gesturestart",a,{capture:!0}),e.addEventListener("gesturechange",a,{capture:!0}),e.addEventListener("gestureend",a,{capture:!0}),()=>{e.removeEventListener("wheel",t,{capture:!0}),e.removeEventListener("gesturestart",a,{capture:!0}),e.removeEventListener("gesturechange",a,{capture:!0}),e.removeEventListener("gestureend",a,{capture:!0})}},[f]),(0,r.jsx)(o.G7H,{id:t.id,className:"pointer-events-auto",style:{width:t.props.w,height:t.props.h,pointerEvents:"all",userSelect:v?"auto":"none"},children:(0,r.jsxs)("div",{className:"flex flex-col w-full h-full",onPointerDown:e=>{let t=e.target;if(t.closest("[data-drag-handle]")||(d.selectNone(),t.closest("[data-interactive]")||t.closest("button")||t.closest("input")||t.closest("textarea")||"BUTTON"===t.tagName||"INPUT"===t.tagName||"TEXTAREA"===t.tagName)){e.stopPropagation();return}},children:[(a.docu_type===i.T$.TEXT||a.docu_type===i.T$.ENTITY||a.docu_type===i.T$.STORYBOARD)&&(0,r.jsxs)("div",{className:"flex items-center gap-2 mb-2 shrink-0",children:[(0,r.jsx)("div",{className:"h-8 cursor-default bg-primary/5 text-primary border border-primary/20 px-4 rounded-full flex items-center",children:s(a.docu_type===i.T$.TEXT?"common:script":a.docu_type===i.T$.ENTITY?"common:entityView.character":"base:storyboard")}),(0,r.jsx)(p.z,{variant:"outline",size:"icon",className:"h-8 w-8 pointer-events-autorounded-full bg-primary/5 text-primary border-primary/20 rounded-full",onClick:()=>{l.push({pathname:l.pathname,query:{...l.query,tableId:a.id}},void 0,{shallow:!0})},children:(0,r.jsx)(S.bJ,{className:"h-[18px] w-[18px]"})})]}),(0,r.jsx)("div",{ref:h,className:(0,J.cn)("w-full overflow-hidden rounded-xl",a.docu_type===i.T$.TEXT||a.docu_type===i.T$.ENTITY||a.docu_type===i.T$.STORYBOARD?"flex-1":"h-full"),style:{touchAction:v?"pan-y pan-x":"none",backgroundColor:"#0F1113"},onContextMenu:e=>{v&&e.stopPropagation()},onMouseEnter:()=>g(!0),onMouseLeave:()=>g(!1),children:a.docu_type===i.T$.TEXT?(0,r.jsx)(b.M,{table:a,isSelected:v,isCanvasMode:!0}):a.docu_type===i.T$.ENTITY?(0,r.jsx)(W.X,{tableId:a.id,isCanvasMode:!0}):a.docu_type===i.T$.STORYBOARD?(0,r.jsx)(Z.Z,{tableId:a.id,isCanvasMode:!0}):null})]})})},en=function(e,t,a,r){var n,i,l,s,d,c;let u=arguments.length>4&&void 0!==arguments[4]?arguments[4]:{};if(e.getShape(t))return t;let{parentId:p,start:h={},end:m={}}=u,f=e.getShapePageBounds(a),g=e.getShapePageBounds(r);if(!(f&&g))return;let v=null!==(l=null===(n=e.getShapePageTransform(a))||void 0===n?void 0:n.rotation())&&void 0!==l?l:0,x=null!==(s=null===(i=e.getShapePageTransform(r))||void 0===i?void 0:i.rotation())&&void 0!==s?s:0,y=null!==(d=h.normalizedAnchor)&&void 0!==d?d:{x:.5,y:.5},w=null!==(c=m.normalizedAnchor)&&void 0!==c?c:{x:.5,y:.5},b=o.B08.Add(f.point,o.B08.MulV(f.size,o.B08.Rot(o.B08.From(y),v))),j=o.B08.Add(g.point,o.B08.MulV(g.size,o.B08.Rot(o.B08.From(w),x))),E=Math.min(b.x,j.x),S=Math.min(b.y,j.y);return e.run(()=>{e.createShape({id:t,type:"electric_connection",parentId:null!=p?p:e.getCurrentPageId(),x:E,y:S,props:{startX:b.x-E,startY:b.y-S,endX:j.x-E,endY:j.y-S},meta:{startShapeId:a,endShapeId:r,startAnchor:{x:y.x,y:y.y},endAnchor:{x:w.x,y:w.y}}})}),t},eo=null;function ei(){eo=null}class el extends o.EeJ{getDefaultProps(){return{w:1170,h:900}}getGeometry(e){return new o.zc7({width:e.props.w,height:e.props.h,isFilled:!0})}component(e){return(0,r.jsx)(er,{shape:e})}onResize(e,t){return(0,o.$eB)(e,t)}indicator(e){return(0,r.jsx)("rect",{width:e.props.w,height:e.props.h,rx:12,ry:12})}onDragShapesIn(e,t){let a=e.meta.table;if(a.docu_type!==i.T$.ENTITY&&a.docu_type!==i.T$.STORYBOARD)return;let r=t.filter(e=>{var t,a;

1return"media_base"===e.type&&(null===(t=e.meta)||void 0===t?void 0:t.state)==="complete"&&(null===(a=e.meta)||void 0===a?void 0:a.mediaUrl)});0!==r.length&&(console.log("\uD83C\uDFAF onDragShapesIn: media entered drop target",a.id,a.docu_type),eo={tableId:a.id},window.dispatchEvent(new CustomEvent("tldraw:media:enter-drop-target",{detail:{shapeIds:r.map(e=>e.id)}})))}onDragShapesOut(e){let t=e.meta.table;(t.docu_type===i.T$.ENTITY||t.docu_type===i.T$.STORYBOARD)&&(console.log("\uD83D\uDEAB onDragShapesOut: media left drop target"),ei(),window.dispatchEvent(new CustomEvent("tldraw:media:drag-clear")),window.dispatchEvent(new CustomEvent("tldraw:media:leave-drop-target")))}constructor(...e){super(...e),this.isAspectRatioLocked=()=>!1,this.canResize=()=>!0}}function es(){return null}function ed(e){return"zh"===e?"zh-cn":"ja"===e?"ja":"en"}el.type="base_table",el.props={w:o.T.number,h:o.T.number};let ec=e=>{var t;let{tables:a,baseId:s}=e,[d,c]=(0,n.useState)(null),[p,h]=(0,n.useState)(a),[f,g]=(0,n.useState)({status:"loading"}),v=(0,n.useRef)(!1),y=(0,n.useRef)(null),{isReadOnly:b,baseOwnerId:j}=(0,q.E)(),E=(0,m.useRouter)(),{data:S}=(0,H.useSession)(),{t:N}=(0,u.$G)("base"),T=(null==S?void 0:null===(t=S.user)||void 0===t?void 0:t.id)!=null&&S.user.id===j;(0,n.useEffect)(()=>{h(a)},[a]),(0,n.useEffect)(()=>{let e=!1;return async function(){try{let t=await fetch("/api/base/canvas/".concat(s));if(!t.ok)throw Error("Failed to load canvas snapshot");let a=await t.json();if(e)return;let r=(0,o.jx$)({shapeUtils:[...o.ExC,el,x,w,P]});a.snapshot?(console.log("\uD83D\uDCE5 Loading canvas snapshot from database"),(0,o.wd6)(r,a.snapshot)):console.log("\uD83D\uDCC4 No existing canvas snapshot, starting fresh"),g({store:r,status:"synced-local"})}catch(t){if(console.error("Error loading canvas snapshot:",t),!e){let e=(0,o.jx$)({shapeUtils:[...o.ExC,el,x,w,P]});g({store:e,status:"synced-local"})}}}(),()=>{e=!0}},[s]),(0,n.useEffect)(()=>{let e=l.h6.on("Socket::Document::Created",e=>{console.log("\uD83D\uDCC4 New document created, adding to canvas:",e.document),h(t=>{let a=t.some(t=>t.id===e.document.id);return a?(console.log("Document already exists, skipping:",e.document.id),t):[...t,e.document]})});return e},[]);let C=(0,n.useMemo)(()=>[...o.ExC,el,x,w,P],[]),D=(0,n.useCallback)(e=>{let t=e.getCurrentPageShapes(),a=t.filter(e=>{var t,a;return"base_table"===e.type&&(null===(a=e.meta)||void 0===a?void 0:null===(t=a.table)||void 0===t?void 0:t.docu_type)===i.T$.STORYBOARD});a.forEach(t=>{let a=t.meta.table.id,r=(0,o.F17)("video_".concat(a)),n=(0,o.F17)("arrow_".concat(a,"_to_video")),i=(0,o.F17)("electric_".concat(a,"_to_video")),l=e.getShape(n);l&&e.deleteShapes([n]);let s=e.getShape(i),d=e.getShape(r);d&&!s&&en(e,i,t.id,r,{parentId:e.getCurrentPageId(),start:{normalizedAnchor:{x:1,y:.5},isPrecise:!0},end:{normalizedAnchor:{x:0,y:.5},isPrecise:!0}})})},[]),k=(0,n.useCallback)(async e=>{try{let t=(0,o.vMv)(e.store);console.log("\uD83D\uDCBE Saving canvas snapshot to database...");let a=await fetch("/api/base/canvas/".concat(s),{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({snapshot:t})});if(!a.ok)throw Error("Failed to save canvas snapshot");console.log("✅ Canvas snapshot saved successfully")}catch(e){console.error("❌ Error saving canvas snapshot:",e)}},[s]);(0,n.useEffect)(()=>{if(!d||!T)return;let e=d.store.listen(()=>{y.current&&clearTimeout(y.current),y.current=setTimeout(()=>{k(d)},2e3)},{scope:"document",source:"all"});return()=>{e(),y.current&&clearTimeout(y.current)}},[d,k,T]);let F=(0,n.useMemo)(()=>({StylePanel:es,PageMenu:null,MainMenu:null,QuickActions:null,ActionsMenu:null,NavigationPanel:null,HelperButtons:null,Toolbar:null}),[]);return(0,n.useEffect)(()=>{if(!d)return;let e=100,t=p.map(t=>{let a=t.docu_type===i.T$.ENTITY,r=a?1100:900,n={id:(0,o.F17)("".concat(t.id)),table:t,x:100,y:e,props:{w:1170,h:r}};return e+=r+90,n}),a=new Set(t.map(e=>e.id)),r=d.getCurrentPageShapes().filter(e=>"base_table"===e.type),n=r.map(e=>e.id).filter(e=>!a.has(e));if(n.length>0){let e=[];for(let t of n){var l;let a=d.getShape(t);if(null==a?void 0:null===(l=a.meta)||void 0===l?void 0:l.table){let t=a.meta.table.id,r=(0,o.F17)("video_".concat(t)),n=(0,o.F17)("electric_".concat(t,"_to_video"));d.getShape(r)&&e.push(r),d.getShape(n)&&e.push(n)}}d.deleteShapes([...n,...e])}let s=d.getCurrentPageId(),c=null;

1if(t.forEach(e=>{let{id:t,table:a,x:r,props:n}=e,l=d.getShape(t),u={table:a};if(l){let e=a.docu_type===i.T$.ENTITY,r=e?1100:l.props.h;d.updateShapes([{id:t,type:"base_table",meta:u,props:{...l.props,h:r}}])}else{c=t;let e=d.getCurrentPageShapes().filter(e=>"base_table"===e.type),l=e.length>0?Math.max(...e.map(e=>e.y+e.props.h))+90:100;if(d.createShapes([{id:t,type:"base_table",parentId:s,x:r,y:l,props:n,meta:u}]),a.docu_type===i.T$.STORYBOARD){let e=(0,o.F17)("video_".concat(a.id)),i=(0,o.F17)("electric_".concat(a.id,"_to_video")),c=r+n.w+100;d.createShapes([{id:e,type:"video_node",parentId:s,x:c,y:l,props:{w:400,h:300},meta:{parentNodeId:t,storyboardTableId:a.id,storyboardName:a.name&&"Untitled"!==a.name?a.name:N("untitled"),videoUrls:[],status:"pending"}}]),setTimeout(()=>{let r=d.getShape(t),n=d.getShape(e);r&&n&&(en(d,i,t,e,{parentId:s,start:{normalizedAnchor:{x:1,y:.5},isPrecise:!0},end:{normalizedAnchor:{x:0,y:.5},isPrecise:!0}}),console.log("✅ Created video node and electric connection for storyboard: ".concat(a.id)))},100)}}}),c){let e=c;setTimeout(()=>{let t=d.getShape(e);t&&(d.select(e),d.zoomToSelection({animation:{duration:400}}))},100)}else!v.current&&t.length>0&&(d.zoomToFit({animation:{duration:400}}),v.current=!0);setTimeout(()=>{D(d)},200)},[d,p,D]),(0,n.useEffect)(()=>()=>(0,ea.r)(null),[]),(0,n.useEffect)(()=>{d&&d.updateInstanceState({isReadonly:b})},[d,b]),(0,n.useEffect)(()=>{d&&d.user.updateUserPreferences({locale:ed(E.locale)})},[d,E.locale]),(0,n.useEffect)(()=>{let e="application/x-tldraw-media",t=t=>{var a;(null===(a=t.dataTransfer)||void 0===a||!a.types.includes(e))&&(t.preventDefault(),t.dataTransfer&&(t.dataTransfer.dropEffect="none"))},a=t=>{var a;null!==(a=t.dataTransfer)&&void 0!==a&&a.types.includes(e)||t.preventDefault()},r=document.querySelector(".tl-container");if(r)return r.addEventListener("dragover",t),r.addEventListener("drop",a),()=>{r.removeEventListener("dragover",t),r.removeEventListener("drop",a)}},[d]),(0,r.jsxs)("div",{className:"relative h-full w-full",children:[(0,r.jsx)(o.DrV,{licenseKey:"tldraw-2026-10-03/WyJkWExXSTg4NiIsWyIqIl0sMTYsIjIwMjYtMTAtMDMiXQ.UiAoNd/mFIt0bFflkhKffkwkBV6imPDDoS70mNmqLEEwLduQ2P4hdEMzA2ag/L+99uOhHnZDCH4au0NmsCmg0Q",store:f,shapeUtils:C,components:F,overrides:{tools:(e,t)=>{let{select:a,hand:r}=t;return{select:a,hand:r}}},onMount:e=>{c(e),(0,ea.r)(e),e.user.updateUserPreferences({colorScheme:"dark",locale:ed(E.locale)}),b&&e.updateInstanceState({isReadonly:!0})},children:(0,r.jsx)(X,{baseId:s})}),(0,r.jsx)(et,{editor:d})]})};var eu=ec}}]);