UNPKG

@eventcatalogtest/studio

Version:

A drag and drop UI for distributed systems that keeps your diagrams where they belong – in your repo

1 lines 103 kB
"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[2517],{30771:(e,t,s)=>{s.d(t,{P:()=>l});var a=s(88936),r=s(16714);let l=(0,a.v)()((0,r.Zr)(e=>({isOpen:!0,activeTab:"components",showMinimap:!0,showComments:!0,showFeedbackPanel:!1,dontWarnOnDelete:!1,floatingPanels:{components:!1,canvas:!1,catalog:!1},selectedComponent:null,toggleSidebar:()=>e(e=>({isOpen:!e.isOpen})),setSidebarOpen:t=>e({isOpen:t}),setActiveTab:t=>e({activeTab:t}),toggleMinimap:()=>e(e=>({showMinimap:!e.showMinimap})),setMinimapOpen:t=>e({showMinimap:t}),toggleComments:()=>e(e=>({showComments:!e.showComments})),setCommentsVisible:t=>e({showComments:t}),toggleFeedbackPanel:()=>e(e=>({showFeedbackPanel:!e.showFeedbackPanel})),setFeedbackPanelOpen:t=>e({showFeedbackPanel:t}),setDontWarnOnDelete:t=>e({dontWarnOnDelete:t}),toggleFloatingPanel:t=>e(e=>e.floatingPanels[t]?{floatingPanels:{...e.floatingPanels,[t]:!1}}:{floatingPanels:{components:!1,canvas:!1,catalog:!1,[t]:!0}}),setFloatingPanelOpen:(t,s)=>e(e=>s?{floatingPanels:{components:!1,canvas:!1,catalog:!1,[t]:!0}}:{floatingPanels:{...e.floatingPanels,[t]:!1}}),setSelectedComponent:t=>e({selectedComponent:t})}),{name:"sidebar-storage",storage:(0,r.KU)(()=>localStorage)}))},31503:(e,t,s)=>{s.d(t,{A:()=>i});var a=s(69644),r=s(49568),l=s(91403),n=s(3983);let o=e=>{let{notification:t,onDismiss:s}=e,[l,o]=(0,r.useState)(!1);(0,r.useEffect)(()=>{let e=setTimeout(()=>o(!0),50),s=setTimeout(()=>{o(!1)},t.duration);return()=>{clearTimeout(e),clearTimeout(s)}},[t.duration]),(0,r.useEffect)(()=>{if(!l){let e=setTimeout(()=>{l||s(t.id)},500);return()=>clearTimeout(e)}},[l,t.id,s]);let i="bg-blue-500",c="border-blue-700",d="text-white";return"error"===t.type?(i="bg-red-500",c="border-red-700"):"warning"===t.type&&(i="bg-yellow-500",c="border-yellow-700",d="text-gray-800"),(0,a.jsxs)("div",{className:"p-4 rounded shadow-lg border-l-4 ".concat(c," ").concat(i," ").concat(d," flex items-start justify-between transform transition-all duration-500 ease-in-out ").concat(l?"opacity-100 translate-x-0":"opacity-0 translate-x-full"),role:"alert",children:[(0,a.jsx)("p",{className:"flex-grow mr-2",children:t.message}),(0,a.jsx)("button",{onClick:()=>o(!1),className:"ml-2 -mr-1 -mt-1 p-1 rounded hover:bg-opacity-25 hover:bg-black focus:outline-none focus:ring-2 focus:ring-white flex-shrink-0","aria-label":"Dismiss",children:(0,a.jsx)(n.A,{size:18})})]})},i=()=>{let{notifications:e,dismissNotification:t}=(0,l.t)();return(0,a.jsx)("div",{className:"fixed bottom-4 right-4 z-[100] space-y-2 w-80",children:e.map(e=>(0,a.jsx)(o,{notification:e,onDismiss:t},e.id))})}},42018:(e,t,s)=>{s.d(t,{A:()=>S});var a=s(69644),r=s(49568),l=s(71326),n=s(13312),o=s(49972),i=s(33951),c=s(50654),d=s(40461),x=s(87287),u=s(23915),m=s(30771),g=s(3983),h=s(66917);let p=JSON.parse('{"rE":"0.1.12","h_":"A drag and drop UI for distributed systems that keeps your diagrams where they belong – in your repo","Jk":{"O":"https://github.com/event-catalog/studio.git"}}'),f=e=>{let{isOpen:t,onClose:s}=e;return(0,a.jsx)(n.bL,{open:t,onOpenChange:s,children:(0,a.jsxs)(n.ZL,{children:[(0,a.jsx)(n.hJ,{className:"fixed inset-0 bg-black/60 backdrop-blur-sm z-50"}),(0,a.jsxs)(n.UC,{className:"fixed left-1/2 top-1/2 w-full max-w-md -translate-x-1/2 -translate-y-1/2 transform rounded-xl bg-white shadow-2xl z-50 border border-gray-200 overflow-hidden",children:[(0,a.jsx)("div",{className:"bg-gradient-to-r from-blue-600 to-purple-600 px-6 py-4 text-white",children:(0,a.jsxs)("div",{className:"flex items-center justify-between",children:[(0,a.jsxs)("div",{className:"flex items-center space-x-3",children:[(0,a.jsx)("div",{className:"w-10 h-10 bg-white/20 rounded-lg flex items-center justify-center backdrop-blur-sm",children:(0,a.jsx)(o.A,{className:"w-5 h-5 text-white"})}),(0,a.jsxs)("div",{children:[(0,a.jsx)(n.hE,{className:"text-lg font-semibold",children:"EventCatalog Studio"}),(0,a.jsxs)("p",{className:"text-sm text-blue-100",children:["Version ",p.rE]})]})]}),(0,a.jsx)(n.bm,{asChild:!0,children:(0,a.jsx)("button",{className:"rounded-full p-1 hover:bg-white/20 transition-colors",onClick:s,children:(0,a.jsx)(g.A,{className:"h-4 w-4 text-white"})})})]})}),(0,a.jsxs)("div",{className:"p-6 space-y-5",children:[(0,a.jsxs)("div",{className:"flex items-center justify-between p-3 bg-gray-50 rounded-lg",children:[(0,a.jsxs)("div",{children:[(0,a.jsx)("p",{className:"text-sm font-medium text-gray-900",children:"Community Edition"}),(0,a.jsx)("p",{className:"text-xs text-gray-500",children:"Free for personal use"})]}),(0,a.jsxs)("a",{href:"https://eventcatalog.dev/pricing",target:"_blank",rel:"noopener noreferrer",className:"inline-flex items-center space-x-1 text-xs bg-gradient-to-r from-blue-600 to-purple-600 text-white px-3 py-1.5 rounded-full hover:shadow-lg transition-all transform hover:scale-105",children:[(0,a.jsx)("span",{children:"Upgrade"}),(0,a.jsx)(h.A,{className:"w-3 h-3"})]})]}),(0,a.jsx)("div",{children:(0,a.jsx)("p",{className:"text-sm text-gray-600 leading-relaxed",children:p.h_})})]}),(0,a.jsx)("div",{className:"px-6 py-4 bg-gray-50 border-t border-gray-200",children:(0,a.jsxs)("div",{className:"flex items-center justify-between",children:[(0,a.jsxs)("p",{className:"text-xs text-gray-500",children:["\xa9 ",new Date().getFullYear()," EventCatalog"]}),(0,a.jsxs)("div",{className:"flex space-x-3",children:[(0,a.jsxs)("a",{href:p.Jk.O,target:"_blank",rel:"noopener noreferrer",className:"inline-flex items-center space-x-1 text-xs text-gray-500 hover:text-blue-600 transition-colors",children:[(0,a.jsx)("span",{children:"GitHub"}),(0,a.jsx)(h.A,{className:"w-3 h-3"})]}),(0,a.jsx)("button",{onClick:s,className:"text-xs bg-gray-900 text-white px-3 py-1.5 rounded-md hover:bg-gray-800 transition-colors",children:"Close"})]})]})})]})]})})};var y=s(7715),b=s(20416),j=s(17034);let v=e=>{let{isOpen:t,onClose:s,prompt:l,title:o="Architecture Prompt"}=e,[i,c]=(0,r.useState)(!1),d=async()=>{try{await navigator.clipboard.writeText(l),c(!0),setTimeout(()=>c(!1),2e3)}catch(t){console.error("Failed to copy to clipboard:",t);let e=document.createElement("textarea");e.value=l,document.body.appendChild(e),e.select(),document.execCommand("copy"),document.body.removeChild(e),c(!0),setTimeout(()=>c(!1),2e3)}};return(0,a.jsx)(n.bL,{open:t,onOpenChange:s,children:(0,a.jsxs)(n.ZL,{children:[(0,a.jsx)(n.hJ,{className:"fixed inset-0 bg-black/50 z-50"}),(0,a.jsxs)(n.UC,{className:"fixed left-1/2 top-1/2 w-[90vw] max-w-4xl h-[80vh] -translate-x-1/2 -translate-y-1/2 transform rounded-lg bg-white shadow-xl z-50 flex flex-col",children:[(0,a.jsx)("div",{className:"p-6 border-b border-gray-200",children:(0,a.jsxs)("div",{className:"flex items-start justify-between mb-3",children:[(0,a.jsxs)("div",{className:"flex-1 pr-4",children:[(0,a.jsx)(n.hE,{className:"text-xl font-semibold text-gray-900 mb-2",children:o}),(0,a.jsx)("p",{className:"text-sm text-gray-600 leading-relaxed",children:"Copy this prompt and paste it into any LLM (ChatGPT, Claude, etc.) to get architecture analysis, code generation, and implementation guidance."})]}),(0,a.jsxs)("div",{className:"flex items-center space-x-2 flex-shrink-0",children:[(0,a.jsx)("button",{onClick:d,className:"flex items-center px-4 py-2 text-sm font-medium rounded-md transition-colors ".concat(i?"bg-green-100 text-green-700 hover:bg-green-200":"bg-blue-100 text-blue-700 hover:bg-blue-200"),children:i?(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(y.A,{className:"h-4 w-4 mr-2"}),"Copied!"]}):(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(b.A,{className:"h-4 w-4 mr-2"}),"Copy Prompt"]})}),(0,a.jsx)(n.bm,{asChild:!0,children:(0,a.jsx)("button",{className:"p-2 rounded-md hover:bg-gray-100 transition-colors","aria-label":"Close",children:(0,a.jsx)(g.A,{className:"h-5 w-5 text-gray-500"})})})]})]})}),(0,a.jsx)("div",{className:"flex-1 p-4",children:(0,a.jsx)("div",{className:"h-full border border-gray-200 rounded-md overflow-hidden",children:(0,a.jsx)(j.Ay,{height:"100%",defaultLanguage:"markdown",value:l,options:{readOnly:!0,minimap:{enabled:!1},scrollBeyondLastLine:!1,wordWrap:"on",lineNumbers:"on",folding:!1,glyphMargin:!1,lineDecorationsWidth:8,lineNumbersMinChars:3,renderLineHighlight:"none",padding:{top:16,bottom:16},scrollbar:{vertical:"auto",horizontal:"auto",useShadows:!1,verticalHasArrows:!1,horizontalHasArrows:!1,verticalScrollbarSize:10,horizontalScrollbarSize:10},fontSize:14,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Monaco, Menlo, Consolas, "Liberation Mono", "Courier New", monospace',theme:"vs-dark"},loading:(0,a.jsx)("div",{className:"flex items-center justify-center h-full",children:(0,a.jsx)("div",{className:"text-sm text-gray-500",children:"Loading editor..."})})})})}),(0,a.jsxs)("div",{className:"flex items-center justify-between p-4 border-t border-gray-200 bg-gray-50",children:[(0,a.jsx)("div",{className:"text-sm text-gray-600",children:"This prompt contains your architecture diagram and component details"}),(0,a.jsx)("button",{onClick:s,className:"px-4 py-2 text-sm font-medium text-gray-700 bg-white border border-gray-300 rounded-md hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 transition-colors",children:"Close"})]})]})]})})};var w=s(93546),N=s(78644);let C=e=>{let{isOpen:t,onClose:s,onSave:l}=e,[o,i]=(0,r.useState)(""),[c,d]=(0,r.useState)(""),[x,u]=(0,r.useState)(""),[m,h]=(0,r.useState)([]),[p,f]=(0,r.useState)({}),y=()=>{let e=x.trim();e&&!m.includes(e)&&(h([...m,e]),u(""))},b=()=>{i(""),d(""),u(""),h([]),f({}),s()};return(0,a.jsx)(n.bL,{open:t,onOpenChange:b,children:(0,a.jsxs)(n.ZL,{children:[(0,a.jsx)(n.hJ,{className:"fixed inset-0 bg-black/50 z-50"}),(0,a.jsxs)(n.UC,{className:"fixed left-1/2 top-1/2 w-full max-w-lg -translate-x-1/2 -translate-y-1/2 transform rounded-lg bg-white shadow-xl z-50",children:[(0,a.jsx)("div",{className:"p-6 border-b border-gray-200",children:(0,a.jsxs)("div",{className:"flex items-start justify-between",children:[(0,a.jsxs)("div",{children:[(0,a.jsx)(n.hE,{className:"text-xl font-semibold text-gray-900 mb-2",children:"Save as Template"}),(0,a.jsx)("p",{className:"text-sm text-gray-600",children:"Create a reusable template from your current design"})]}),(0,a.jsx)(n.bm,{asChild:!0,children:(0,a.jsx)("button",{className:"p-2 rounded-md hover:bg-gray-100 transition-colors","aria-label":"Close",children:(0,a.jsx)(g.A,{className:"h-5 w-5 text-gray-500"})})})]})}),(0,a.jsxs)("div",{className:"p-6 space-y-4",children:[(0,a.jsxs)("div",{children:[(0,a.jsx)("label",{htmlFor:"title",className:"block text-sm font-medium text-gray-700 mb-1",children:"Title *"}),(0,a.jsx)("input",{id:"title",type:"text",value:o,onChange:e=>i(e.target.value),placeholder:"e.g., E-commerce Order Flow",className:"w-full px-3 py-2 border rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent ".concat(p.title?"border-red-300":"border-gray-300")}),p.title&&(0,a.jsxs)("div",{className:"flex items-center mt-1 text-sm text-red-600",children:[(0,a.jsx)(w.A,{className:"h-4 w-4 mr-1"}),p.title]})]}),(0,a.jsxs)("div",{children:[(0,a.jsx)("label",{htmlFor:"description",className:"block text-sm font-medium text-gray-700 mb-1",children:"Description *"}),(0,a.jsx)("textarea",{id:"description",value:c,onChange:e=>d(e.target.value),placeholder:"Describe what this template demonstrates and when to use it...",rows:3,className:"w-full px-3 py-2 border rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent resize-none ".concat(p.description?"border-red-300":"border-gray-300")}),p.description&&(0,a.jsxs)("div",{className:"flex items-center mt-1 text-sm text-red-600",children:[(0,a.jsx)(w.A,{className:"h-4 w-4 mr-1"}),p.description]})]}),(0,a.jsxs)("div",{children:[(0,a.jsx)("label",{htmlFor:"tags",className:"block text-sm font-medium text-gray-700 mb-1",children:"Tags"}),(0,a.jsxs)("div",{className:"space-y-2",children:[(0,a.jsxs)("div",{className:"flex",children:[(0,a.jsx)("input",{id:"tags",type:"text",value:x,onChange:e=>u(e.target.value),onKeyPress:e=>{"Enter"===e.key&&(e.preventDefault(),y())},placeholder:"Add a tag...",className:"flex-1 px-3 py-2 border border-gray-300 rounded-l-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent"}),(0,a.jsx)("button",{type:"button",onClick:y,disabled:!x.trim(),className:"px-4 py-2 bg-blue-600 text-white rounded-r-md hover:bg-blue-700 disabled:bg-gray-300 disabled:cursor-not-allowed transition-colors",children:"Add"})]}),m.length>0&&(0,a.jsx)("div",{className:"flex flex-wrap gap-2",children:m.map(e=>(0,a.jsxs)("span",{className:"inline-flex items-center px-2 py-1 bg-blue-100 text-blue-800 text-xs font-medium rounded-full",children:[e,(0,a.jsx)("button",{type:"button",onClick:()=>{h(m.filter(t=>t!==e))},className:"ml-1 hover:text-blue-600",children:"\xd7"})]},e))})]})]})]}),(0,a.jsxs)("div",{className:"flex items-center justify-end space-x-3 p-6 border-t border-gray-200 bg-gray-50",children:[(0,a.jsx)("button",{onClick:b,className:"px-4 py-2 text-sm font-medium text-gray-700 bg-white border border-gray-300 rounded-md hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 transition-colors",children:"Cancel"}),(0,a.jsxs)("button",{onClick:()=>{(()=>{let e={};return o.trim()||(e.title="Title is required"),c.trim()||(e.description="Description is required"),f(e),0===Object.keys(e).length})()&&(l({title:o.trim(),description:c.trim(),tags:m}),b())},className:"flex items-center px-4 py-2 text-sm font-medium text-white bg-blue-600 border border-transparent rounded-md hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 transition-colors",children:[(0,a.jsx)(N.A,{className:"h-4 w-4 mr-2"}),"Save Template"]})]})]})]})})},k=e=>{if(!(null==e?void 0:e.nodes)||0===e.nodes.length)return"flowchart TD\n A[No nodes available]";let{nodes:t,edges:s}=e,a="flowchart TD\n",r={};return t.forEach(e=>{let t=(e=>{var t,s,a,r,l,n,o,i,c,d,x;return(null==(s=e.data)||null==(t=s.message)?void 0:t.name)||(null==(r=e.data)||null==(a=r.service)?void 0:a.name)||(null==(n=e.data)||null==(l=n.query)?void 0:l.name)||(null==(i=e.data)||null==(o=i.command)?void 0:o.name)||(null==(d=e.data)||null==(c=d.data)?void 0:c.name)||(null==(x=e.data)?void 0:x.name)||"".concat(e.type||"unknown","_").concat(e.id.slice(-4))})(e).replace(/[^a-zA-Z0-9]/g,"_");r[e.id]=t,a+=" ".concat(((e,t)=>{switch(e){case"service":case"channel":case"view":case"actor":default:return"".concat(t,"[").concat(t,"]");case"event":return"".concat(t,"((").concat(t,"))");case"command":return"".concat(t,">").concat(t,"]");case"query":return"".concat(t,"{").concat(t,"}");case"domain":return"".concat(t,"[/").concat(t,"/]");case"external-system":return"".concat(t,"[[").concat(t,"]]");case"data":return"".concat(t,"[(").concat(t,")]")}})(e.type||"unknown",t),"\n")}),s.forEach(e=>{var t;let s=r[e.source],l=r[e.target],n=e.data,o=(null==n||null==(t=n.message)?void 0:t.collection)||e.label||"";s&&l&&(o?a+=" ".concat(s," --\x3e|").concat(o,"| ").concat(l,"\n"):a+=" ".concat(s," --\x3e ").concat(l,"\n"))}),a+="\n %% Styling\n",a+=" classDef service fill:#ff9999\n",a+=" classDef event fill:#99ccff\n",a+=" classDef command fill:#99ff99\n",a+=" classDef query fill:#ffcc99\n",a+=" classDef domain fill:#e6ccff\n",a+=" classDef external fill:#ffff99\n",a+=" classDef data fill:#ccffcc\n",t.forEach(e=>{let t=r[e.id];if(t)switch(e.type){case"service":a+=" class ".concat(t," service\n");break;case"event":a+=" class ".concat(t," event\n");break;case"command":a+=" class ".concat(t," command\n");break;case"query":a+=" class ".concat(t," query\n");break;case"domain":a+=" class ".concat(t," domain\n");break;case"external-system":a+=" class ".concat(t," external\n");break;case"data":a+=" class ".concat(t," data\n")}}),a},S=()=>{let[e,t]=(0,r.useState)(!1),[s,g]=(0,r.useState)(""),[h,p]=(0,r.useState)(!1),[y,b]=(0,r.useState)(!1),[j,w]=(0,r.useState)(!1),[N,S]=(0,r.useState)(!1),[A,L]=(0,r.useState)(""),D=(0,r.useRef)(null),{reset:O,exportFlow:E,importFlow:M,autoLayout:z,undo:T,redo:U,canUndo:I,canRedo:P,onNodesChange:F}=(0,d.useFlowStoreActions)(),{setShowTemplateSelector:q,hasTemplates:Z}=(0,x.H)(),{currentDesign:R,updateDesignName:H,createNewDesign:J,setCurrentDesign:V}=(0,u.useDesignStore)(),{showMinimap:B,toggleMinimap:W,showComments:Y,toggleComments:_,toggleFeedbackPanel:G}=(0,m.P)(),{nodes:K}=(0,d.default)(),X=()=>{R&&s.trim()&&s!==R.name&&H(R.id,s.trim()),t(!1)};return(0,r.useEffect)(()=>{e&&D.current&&(D.current.focus(),D.current.select())},[e]),(0,a.jsxs)("div",{className:"bg-white px-3 py-2 flex items-center justify-between w-full border-b border-gray-200",children:[(0,a.jsxs)("div",{className:"flex items-center",children:[(0,a.jsx)(o.A,{className:"h-5 w-5 text-gray-700 flex-shrink-0 mr-1"}),(0,a.jsxs)(l.bL,{children:[(0,a.jsx)(l.l9,{asChild:!0,children:(0,a.jsx)("button",{className:"p-1 rounded hover:bg-gray-100 transition-colors flex-shrink-0",children:(0,a.jsx)(i.A,{className:"h-5 w-5 text-gray-700"})})}),(0,a.jsx)(l.ZL,{children:(0,a.jsxs)(l.UC,{className:"bg-white rounded-lg shadow-lg border border-gray-200 p-1 w-48 z-50 ml-12",align:"end",sideOffset:5,children:[(0,a.jsxs)(l.q7,{onClick:()=>{if(Z())q(!0);else{let e={id:Math.random().toString(36).substring(2,15),type:"design",name:"Untitled Design",description:"",data:{nodes:[],edges:[],viewport:{x:0,y:0,zoom:1}},createdAt:new Date,updatedAt:new Date,lastModified:"now"};J(e),V(e)}},className:"flex items-center justify-between px-3 py-2 text-sm rounded hover:bg-gray-100 cursor-default outline-none",children:[(0,a.jsx)("span",{children:"New Design"}),(0,a.jsx)("span",{className:"text-xs text-gray-500",children:"^ N"})]}),(0,a.jsxs)(l.q7,{onClick:()=>(()=>{let e=document.createElement("input");e.type="file",e.accept=".ecstudio",e.onchange=e=>{var t;let s=e.target,a=null==s||null==(t=s.files)?void 0:t[0];if(a){let e=new FileReader;e.onload=e=>{try{var t,s;let r=JSON.parse(null==(t=e.target)?void 0:t.result);M(r);let l=r.name||(null==(s=r.metadata)?void 0:s.name)||a.name.replace(".ecstudio","");(null==R?void 0:R.id)&&H(R.id,l)}catch(e){console.error("Error parsing file:",e),alert("Error: Invalid file format. Please select a valid .ecstudio file.")}},e.readAsText(a)}},e.click()})(),className:"flex items-center justify-between px-3 py-2 text-sm rounded hover:bg-gray-100 cursor-default outline-none",children:[(0,a.jsx)("span",{children:"Open"}),(0,a.jsx)("span",{className:"text-xs text-gray-500",children:"⌘ O"})]}),(0,a.jsxs)(l.q7,{onClick:()=>(()=>{let e=E();if("showSaveFilePicker"in window)(async()=>{try{let t=await window.showSaveFilePicker({suggestedName:"".concat((null==R?void 0:R.name)||"design",".ecstudio"),types:[{description:"EventCatalog Studio files",accept:{"application/json":[".ecstudio"]}}]}),s=await t.createWritable();await s.write(JSON.stringify(e,null,2)),await s.close()}catch(e){e instanceof Error&&"AbortError"!==e.name&&console.error("Error saving file:",e)}})();else{let t=new Blob([JSON.stringify(e,null,2)],{type:"application/json"}),s=URL.createObjectURL(t),a=document.createElement("a");a.href=s,a.download="".concat((null==R?void 0:R.name)||"design",".ecstudio"),a.click(),URL.revokeObjectURL(s)}})(),className:"flex items-center justify-between px-3 py-2 text-sm rounded hover:bg-gray-100 cursor-default outline-none",children:[(0,a.jsx)("span",{children:"Save"}),(0,a.jsx)("span",{className:"text-xs text-gray-500",children:"⌘ S"})]}),(0,a.jsx)(l.wv,{className:"h-px bg-gray-200 my-1"}),(0,a.jsxs)(l.Pb,{children:[(0,a.jsxs)(l.ZP,{className:"flex items-center justify-between px-3 py-2 text-sm rounded hover:bg-gray-100 cursor-default outline-none",children:[(0,a.jsx)("span",{children:"Export"}),(0,a.jsx)("span",{className:"text-xs text-gray-500",children:"›"})]}),(0,a.jsx)(l.ZL,{children:(0,a.jsxs)(l.G5,{className:"bg-white rounded-lg shadow-lg border border-gray-200 p-1 w-56 z-50",sideOffset:5,children:[(0,a.jsx)(l.q7,{onClick:()=>{try{let e=(()=>{let e=E(),t=(null==R?void 0:R.name)||"Untitled Design";if(!e)throw Error("Unable to export flow data");return(e=>{let{flowData:t,designName:s}=e;if(!(null==t?void 0:t.nodes)||0===t.nodes.length)throw Error("No design data available. Please add some nodes to your canvas first.");let{nodes:a}=t,r=k(t),l="\n## Components\n\n";return a.forEach(e=>{var t,s,a,r,n,o,i,c,d;let x=(e=>{var t,s,a,r,l,n,o,i,c,d,x;return(null==(s=e.data)||null==(t=s.message)?void 0:t.name)||(null==(r=e.data)||null==(a=r.service)?void 0:a.name)||(null==(n=e.data)||null==(l=n.query)?void 0:l.name)||(null==(i=e.data)||null==(o=i.command)?void 0:o.name)||(null==(d=e.data)||null==(c=d.data)?void 0:c.name)||(null==(x=e.data)?void 0:x.name)||"".concat(e.type||"unknown","_").concat(e.id.slice(-4))})(e),u=e.data,m=(null==u||null==(t=u.message)?void 0:t.summary)||(null==u||null==(s=u.service)?void 0:s.summary)||(null==u||null==(a=u.query)?void 0:a.summary)||(null==u||null==(r=u.command)?void 0:r.summary)||(null==u||null==(n=u.data)?void 0:n.summary)||(null==u?void 0:u.summary)||"",g=(null==u||null==(o=u.message)?void 0:o.version)||(null==u||null==(i=u.service)?void 0:i.version)||(null==u||null==(c=u.query)?void 0:c.version)||(null==u||null==(d=u.command)?void 0:d.version)||(null==u?void 0:u.version)||"";l+="### ".concat(x," (").concat(e.type||"unknown",")\n"),g&&(l+="**Version:** ".concat(g,"\n\n")),m&&(l+="**Description:** ".concat(m,"\n\n")),l+="---\n\n"}),"# Architecture Design: ".concat(s,"\n\nThis is a design created using EventCatalog Studio.\n\n## Architecture Diagram\n\n```mermaid\n").concat(r,"\n```\n\n").concat(l)})({flowData:e,designName:t})})();e&&(L(e),w(!0))}catch(e){console.error("Error generating prompt:",e),alert(e instanceof Error?e.message:"Error generating prompt. Please try again.")}},className:"flex items-center px-3 py-2 text-sm rounded hover:bg-gray-100 cursor-default outline-none whitespace-nowrap",children:(0,a.jsx)("span",{children:"as LLM prompt"})}),(0,a.jsx)(l.q7,{onClick:()=>S(!0),className:"flex items-center px-3 py-2 text-sm rounded hover:bg-gray-100 cursor-default outline-none whitespace-nowrap",children:(0,a.jsx)("span",{children:"as Template"})})]})})]}),(0,a.jsx)(l.wv,{className:"h-px bg-gray-200 my-1"}),(0,a.jsxs)(l.q7,{onClick:T,disabled:!I(),className:"flex items-center justify-between px-3 py-2 text-sm rounded outline-none cursor-default ".concat(I()?"hover:bg-gray-100":"text-gray-400 cursor-not-allowed"),children:[(0,a.jsx)("span",{children:"Undo"}),(0,a.jsx)("span",{className:"text-xs text-gray-500",children:"⌘Z"})]}),(0,a.jsxs)(l.q7,{onClick:U,disabled:!P(),className:"flex items-center justify-between px-3 py-2 text-sm rounded outline-none cursor-default ".concat(P()?"hover:bg-gray-100":"text-gray-400 cursor-not-allowed"),children:[(0,a.jsx)("span",{children:"Redo"}),(0,a.jsx)("span",{className:"text-xs text-gray-500",children:"⇧⌘Z"})]}),(0,a.jsxs)(l.q7,{onClick:()=>{F(K.map(e=>({id:e.id,type:"select",selected:!0})))},className:"flex items-center justify-between px-3 py-2 text-sm rounded hover:bg-gray-100 cursor-default outline-none",children:[(0,a.jsx)("span",{children:"Select All"}),(0,a.jsx)("span",{className:"text-xs text-gray-500",children:"⌘A"})]}),(0,a.jsx)(l.wv,{className:"h-px bg-gray-200 my-1"}),(0,a.jsxs)(l.H_,{checked:B,onCheckedChange:W,className:"flex items-center justify-between px-3 py-2 text-sm rounded hover:bg-gray-100 cursor-default outline-none",children:[(0,a.jsx)("span",{children:"Show Minimap"}),B&&(0,a.jsx)("span",{className:"text-blue-600",children:"✓"})]}),(0,a.jsxs)(l.H_,{checked:Y,onCheckedChange:_,className:"flex items-center justify-between px-3 py-2 text-sm rounded hover:bg-gray-100 cursor-default outline-none",children:[(0,a.jsx)("span",{children:"Show Comments"}),Y&&(0,a.jsx)("span",{className:"text-blue-600",children:"✓"})]}),(0,a.jsx)(l.q7,{onClick:z,className:"flex items-center px-3 py-2 text-sm rounded hover:bg-gray-100 cursor-default outline-none",children:"Auto Layout"}),(0,a.jsx)(l.wv,{className:"h-px bg-gray-200 my-1"}),(0,a.jsx)(l.q7,{onClick:()=>b(!0),className:"flex items-center px-3 py-2 text-sm rounded hover:bg-gray-100 cursor-default outline-none",children:"About Studio"}),(0,a.jsx)(l.wv,{className:"h-px bg-gray-200 my-1"}),(0,a.jsx)(l.q7,{onClick:()=>{p(!0)},className:"px-3 py-2 text-sm rounded hover:bg-gray-100 cursor-default outline-none text-red-600",children:"Reset Canvas"})]})})]})]}),(0,a.jsx)("div",{className:"flex-1 flex justify-center",children:e?(0,a.jsx)("input",{ref:D,type:"text",value:s,onChange:e=>g(e.target.value),onBlur:X,onKeyDown:e=>{"Enter"===e.key?X():"Escape"===e.key&&(g(""),t(!1))},className:"font-medium text-gray-800 bg-transparent border-0 text-center focus:outline-none focus:ring-0 text-sm max-w-xs"}):(0,a.jsx)("button",{onClick:()=>{g((null==R?void 0:R.name)||""),t(!0)},className:"font-medium text-gray-800 hover:text-gray-600 transition-colors text-sm",title:"Click to edit design name",children:(null==R?void 0:R.name)||"Untitled Design"})}),(0,a.jsx)("div",{className:"flex items-center gap-2",children:(0,a.jsx)("button",{className:"px-3 py-1 text-sm border border-gray-300 rounded hover:bg-gray-100 text-gray-700",children:"Sign In"})}),(0,a.jsx)(f,{isOpen:y,onClose:()=>b(!1)}),(0,a.jsx)(v,{isOpen:j,onClose:()=>w(!1),prompt:A,title:"Architecture Prompt: ".concat((null==R?void 0:R.name)||"Untitled Design")}),(0,a.jsx)(C,{isOpen:N,onClose:()=>S(!1),onSave:e=>{let t=E();if(!t)return void alert("Unable to export flow data. Please try again.");let s=k(t),a=new Blob([JSON.stringify({title:e.title,description:e.description,type:"custom",data:t,usecase:e.description,mermaid:s,tags:e.tags},null,2)],{type:"application/json"}),r=URL.createObjectURL(a),l=document.createElement("a");l.href=r,l.download="".concat(e.title.toLowerCase().replace(/[^a-z0-9]/g,"-"),".ectemplate"),l.click(),URL.revokeObjectURL(r)}}),(0,a.jsx)(n.bL,{open:h,onOpenChange:p,children:(0,a.jsxs)(n.ZL,{children:[(0,a.jsx)(n.hJ,{className:"fixed inset-0 bg-black/30 z-50"}),(0,a.jsx)(n.UC,{className:"fixed left-1/2 top-1/2 w-full max-w-md -translate-x-1/2 -translate-y-1/2 transform rounded-lg bg-white p-6 shadow-xl z-50",children:(0,a.jsxs)("div",{className:"flex items-start space-x-3",children:[(0,a.jsx)("div",{className:"flex-shrink-0",children:(0,a.jsx)(c.A,{className:"h-6 w-6 text-red-500"})}),(0,a.jsxs)("div",{className:"flex-1",children:[(0,a.jsx)(n.hE,{className:"text-lg font-semibold text-gray-900 mb-2",children:"Reset Canvas"}),(0,a.jsx)(n.VY,{className:"text-sm text-gray-600 mb-4",children:"This will remove all nodes and connections from the canvas. This action cannot be undone."}),(0,a.jsxs)("div",{className:"flex justify-end space-x-3",children:[(0,a.jsx)("button",{onClick:()=>{p(!1)},className:"px-4 py-2 text-sm font-medium text-gray-700 bg-white border border-gray-300 rounded-md hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 transition-colors",children:"Cancel"}),(0,a.jsx)("button",{onClick:()=>{O(),p(!1)},className:"px-4 py-2 text-sm font-medium text-white bg-red-600 border border-transparent rounded-md hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-red-500 focus:ring-offset-2 transition-colors",children:"Reset Canvas"})]})]})]})})]})})]})}},43944:(e,t,s)=>{s.d(t,{A:()=>N});var a=s(69644),r=s(49568),l=s(37150),n=s(47301),o=s(6366),i=s(47474),c=s(40461),d=s(69715),x=s(57143),u=s(94314),m=s(30771);let g=r.memo(e=>{let{searchTerm:t}=e,{studioFilesFromEventCatalogDirectory:s}=(0,i.h)(),l=(0,u.useRouter)(),{setFloatingPanelOpen:n}=(0,m.P)(),o=(0,r.useMemo)(()=>s&&Array.isArray(s)?s.filter(e=>e.id.toLowerCase().includes(t.toLowerCase())).sort((e,t)=>new Date(t.creationDate).getTime()-new Date(e.creationDate).getTime()):[],[s,t]),c=(0,r.useCallback)(e=>{try{return new Date(e).toLocaleDateString("en-US",{year:"numeric",month:"short",day:"numeric",hour:"2-digit",minute:"2-digit"})}catch(e){return"Unknown date"}},[]),g=(0,r.useCallback)(e=>{l.push("/design/catalog/".concat(e)),n("catalog",!1)},[l]);return 0===o.length?(0,a.jsx)("div",{className:"p-4 text-center text-gray-500",children:""!==t.trim()?"No designs found.":"No designs available."}):(0,a.jsx)("div",{className:"space-y-1.5",children:o.map((e,t)=>(0,a.jsx)("div",{onClick:()=>g(e.id),className:"flex items-center justify-between px-2.5 py-2 rounded-md border bg-gray-50 border-gray-200 hover:bg-gray-100 cursor-pointer transition-all",children:(0,a.jsxs)("div",{className:"flex items-center space-x-2 flex-grow min-w-0",children:[(0,a.jsx)(d.A,{size:16,className:"text-blue-600 flex-shrink-0"}),(0,a.jsxs)("div",{className:"flex flex-col min-w-0 flex-grow",children:[(0,a.jsx)("span",{className:"text-xs font-medium text-gray-700 truncate",children:e.id}),(0,a.jsxs)("div",{className:"flex items-center space-x-1 text-[10px] text-gray-500",children:[(0,a.jsx)(x.A,{size:10}),(0,a.jsx)("span",{children:c(e.creationDate)})]})]})]})},"design-".concat(e.id,"-").concat(t)))})});g.displayName="DesignList";var h=s(30311),p=s(67287),f=s(87024),y=s(86962),b=s(25073),j=s(36506);let v=r.memo(e=>{let{resource:t,isHovered:s,onItemDragStart:r,onItemMouseEnter:l,onItemMouseLeave:n,onItemAdd:o}=e,i="events"===t.collection,c="services"===t.collection,d="commands"===t.collection,x="queries"===t.collection,u={label:t.data.name,resourceId:t.data.id,collection:t.collection,mode:"full",...(i||d||x)&&{message:{version:t.data.version,name:t.data.name,summary:t.data.summary||"",owners:[],producers:[],consumers:[]}},...c&&{service:{version:t.data.version,name:t.data.name,summary:t.data.summary||"",owners:[],sends:[],receives:[]}}},m=i?f.A:y.A,g=i?"event":d?"command":x?"query":"service";return(0,a.jsxs)("div",{className:"group/item flex items-center justify-between px-2.5 py-2 rounded-md cursor-pointer relative border transition-all ".concat("bg-gray-50 border-gray-200 hover:bg-gray-100"),draggable:!0,onDragStart:e=>r(e,g,t.data.name,u),onMouseEnter:l,onMouseLeave:n,children:[(0,a.jsxs)("div",{className:"flex items-center space-x-2 flex-grow min-w-0",children:[(0,a.jsx)(m,{size:16,className:"".concat(i?"text-orange-600":d?"text-blue-600":x?"text-green-600":"text-pink-600"," flex-shrink-0")}),(0,a.jsx)("span",{className:"text-xs font-medium text-gray-700 truncate",children:t.data.name})]}),(0,a.jsxs)("div",{className:"flex items-center space-x-1",children:[(0,a.jsx)("button",{onClick:e=>{e.stopPropagation(),o(g,t.data.name,u)},className:"p-1 hover:bg-gray-200 rounded text-gray-500 hover:text-blue-500 transition-all ".concat(s?"opacity-100":"opacity-0"),title:"Add ".concat(t.data.name),children:(0,a.jsx)(b.A,{size:12})}),(0,a.jsx)(j.A,{size:14,className:"text-gray-400 hover:text-gray-600 flex-shrink-0"})]})]})});v.displayName="DraggableCatalogItem";let w=r.memo(e=>{let{searchTerm:t,resources:s,hoveredItemId:l,onDragStart:n,onItemMouseEnter:o,onItemMouseLeave:i,onItemAdd:c}=e,d=(0,r.useMemo)(()=>{if(!s||!Array.isArray(s))return{events:[],services:[],commands:[],queries:[]};let e=s.filter(e=>e.data.name.toLowerCase().includes(t.toLowerCase())||e.data.summary&&e.data.summary.toLowerCase().includes(t.toLowerCase()));return{events:e.filter(e=>"events"===e.collection),services:e.filter(e=>"services"===e.collection),commands:e.filter(e=>"commands"===e.collection),queries:e.filter(e=>"queries"===e.collection)}},[s,t]);return s&&0!==s.length?(0,a.jsxs)(h.bL,{type:"multiple",defaultValue:["services","events"],className:"space-y-1",children:[d.services.length>0&&(0,a.jsxs)(h.q7,{value:"services",className:"border-0",children:[(0,a.jsx)(h.Y9,{children:(0,a.jsxs)(h.l9,{className:"flex items-center w-full py-4 pb-2 text-left group text-xs font-medium text-gray-900 focus:outline-none",children:[(0,a.jsx)("span",{className:"flex-1",children:"Services"}),(0,a.jsx)(p.A,{className:"h-4 w-4 text-gray-500 transition-transform duration-200 group-data-[state=open]:rotate-180","aria-hidden":!0})]})}),(0,a.jsx)(h.UC,{className:"overflow-hidden text-sm transition-all data-[state=open]:animate-accordion-down data-[state=closed]:animate-accordion-up",children:(0,a.jsx)("div",{className:"pt-1 pb-2 space-y-1.5",children:d.services.map((e,t)=>{var s;let r="service-".concat(e.id,"-").concat(e.collection,"-").concat((null==(s=e.filePath)?void 0:s.split("/").pop())||t,"-").concat(t);return(0,a.jsx)(v,{resource:e,isHovered:l===r,onItemDragStart:n,onItemMouseEnter:()=>o(r),onItemMouseLeave:i,onItemAdd:c},r)})})})]}),d.events.length>0&&(0,a.jsxs)(h.q7,{value:"events",className:"border-0",children:[(0,a.jsx)(h.Y9,{children:(0,a.jsxs)(h.l9,{className:"flex items-center w-full py-4 pb-2 text-left group text-xs font-medium text-gray-900 focus:outline-none",children:[(0,a.jsx)("span",{className:"flex-1",children:"Events"}),(0,a.jsx)(p.A,{className:"h-4 w-4 text-gray-500 transition-transform duration-200 group-data-[state=open]:rotate-180","aria-hidden":!0})]})}),(0,a.jsx)(h.UC,{className:"overflow-hidden text-sm transition-all data-[state=open]:animate-accordion-down data-[state=closed]:animate-accordion-up",children:(0,a.jsx)("div",{className:"pt-1 pb-2 space-y-1.5",children:d.events.map((e,t)=>{var s;let r="event-".concat(e.id,"-").concat(e.collection,"-").concat((null==(s=e.filePath)?void 0:s.split("/").pop())||t,"-").concat(t);return(0,a.jsx)(v,{resource:e,isHovered:l===r,onItemDragStart:n,onItemMouseEnter:()=>o(r),onItemMouseLeave:i,onItemAdd:c},r)})})})]}),d.commands.length>0&&(0,a.jsxs)(h.q7,{value:"commands",className:"border-0",children:[(0,a.jsx)(h.Y9,{children:(0,a.jsxs)(h.l9,{className:"flex items-center w-full py-4 pb-2 text-left group text-xs font-medium text-gray-900 focus:outline-none",children:[(0,a.jsx)("span",{className:"flex-1",children:"Commands"}),(0,a.jsx)(p.A,{className:"h-4 w-4 text-gray-500 transition-transform duration-200 group-data-[state=open]:rotate-180","aria-hidden":!0})]})}),(0,a.jsx)(h.UC,{className:"overflow-hidden text-sm transition-all data-[state=open]:animate-accordion-down data-[state=closed]:animate-accordion-up",children:(0,a.jsx)("div",{className:"pt-1 pb-2 space-y-1.5",children:d.commands.map((e,t)=>{var s;let r="command-".concat(e.id,"-").concat(e.collection,"-").concat((null==(s=e.filePath)?void 0:s.split("/").pop())||t,"-").concat(t);return(0,a.jsx)(v,{resource:e,isHovered:l===r,onItemDragStart:n,onItemMouseEnter:()=>o(r),onItemMouseLeave:i,onItemAdd:c},r)})})})]}),d.queries.length>0&&(0,a.jsxs)(h.q7,{value:"queries",className:"border-0",children:[(0,a.jsx)(h.Y9,{children:(0,a.jsxs)(h.l9,{className:"flex items-center w-full py-4 pb-2 text-left group text-xs font-medium text-gray-900 focus:outline-none",children:[(0,a.jsx)("span",{className:"flex-1",children:"Queries"}),(0,a.jsx)(p.A,{className:"h-4 w-4 text-gray-500 transition-transform duration-200 group-data-[state=open]:rotate-180","aria-hidden":!0})]})}),(0,a.jsx)(h.UC,{className:"overflow-hidden text-sm transition-all data-[state=open]:animate-accordion-down data-[state=closed]:animate-accordion-up",children:(0,a.jsx)("div",{className:"pt-1 pb-2 space-y-1.5",children:d.queries.map((e,t)=>{var s;let r="query-".concat(e.id,"-").concat(e.collection,"-").concat((null==(s=e.filePath)?void 0:s.split("/").pop())||t,"-").concat(t);return(0,a.jsx)(v,{resource:e,isHovered:l===r,onItemDragStart:n,onItemMouseEnter:()=>o(r),onItemMouseLeave:i,onItemAdd:c},r)})})})]}),0===d.events.length&&0===d.services.length&&""!==t.trim()&&(0,a.jsx)("p",{className:"p-4 text-center text-gray-500",children:"No results found."})]}):(0,a.jsx)("div",{className:"text-center text-gray-500 mt-8",children:(0,a.jsxs)("div",{className:"text-sm text-gray-600 space-y-4 max-w-xs mx-auto",children:[(0,a.jsx)("p",{children:"Users can use resources documented from EventCatalog in their diagrams."}),(0,a.jsx)("p",{children:"Open and run the Studio within your catalog directory and Studio will automatically pull these resources in for your diagrams."})]})})});w.displayName="ResourcesTabContent";let N=()=>{let[e,t]=(0,r.useState)(""),[s,d]=(0,r.useState)(null),{resources:x,studioFilesFromEventCatalogDirectory:u}=(0,i.h)(),{addNode:m}=(0,c.useFlowStoreActions)(),h=(0,r.useCallback)((e,t,s,a)=>{e.dataTransfer.setData("application/reactflow",JSON.stringify({nodeType:t,label:s,data:a})),e.dataTransfer.effectAllowed="move"},[]),p=(0,r.useCallback)((e,t,s)=>{m({id:(0,o.Y)(e),type:e,position:{x:400*Math.random(),y:400*Math.random()},data:{...s,label:t}})},[m]),f=(0,r.useCallback)(e=>{d(e)},[]),y=(0,r.useCallback)(()=>{d(null)},[]),b=u&&u.length>0;return x&&0!==x.length||b?b?(0,a.jsx)("div",{className:"bg-white text-gray-800 w-full h-full flex flex-col",children:(0,a.jsxs)(l.bL,{defaultValue:"resources",className:"flex flex-col h-full",children:[(0,a.jsxs)("div",{className:"px-3 py-2 border-b border-gray-200 space-y-2",children:[(0,a.jsxs)("div",{className:"relative",children:[(0,a.jsx)(n.A,{className:"absolute left-3 top-1/2 transform -translate-y-1/2 text-gray-400",size:14}),(0,a.jsx)("input",{type:"text",placeholder:"Search",className:"pl-8 pr-3 py-1.5 w-full border border-gray-300 rounded text-xs bg-gray-50 focus:outline-none focus:ring-1 focus:ring-blue-500 focus:border-blue-500",onChange:e=>t(e.target.value),value:e})]}),(0,a.jsxs)(l.B8,{className:"flex w-full bg-gray-100 rounded-md p-1",children:[(0,a.jsx)(l.l9,{value:"resources",className:"flex-1 px-2 py-1 text-xs font-medium rounded-sm transition-all duration-200 data-[state=active]:bg-white data-[state=active]:text-gray-900 data-[state=active]:shadow-sm text-gray-600 hover:text-gray-800",children:"Resources"}),(0,a.jsx)(l.l9,{value:"designs",className:"flex-1 px-2 py-1 text-xs font-medium rounded-sm transition-all duration-200 data-[state=active]:bg-white data-[state=active]:text-gray-900 data-[state=active]:shadow-sm text-gray-600 hover:text-gray-800",children:"Designs"})]})]}),(0,a.jsxs)("div",{className:"flex-grow overflow-y-auto",children:[(0,a.jsx)(l.UC,{value:"resources",className:"px-3 pb-3 h-full",children:(0,a.jsx)(w,{searchTerm:e,resources:x,hoveredItemId:s,onDragStart:h,onItemMouseEnter:f,onItemMouseLeave:y,onItemAdd:p})}),(0,a.jsx)(l.UC,{value:"designs",className:"px-3 pb-3 h-full mt-4",children:(0,a.jsx)(g,{searchTerm:e})})]})]})}):(0,a.jsxs)("div",{className:"bg-white text-gray-800 w-full h-full flex flex-col",children:[(0,a.jsx)("div",{className:"px-3 py-2 border-b border-gray-200",children:(0,a.jsxs)("div",{className:"relative",children:[(0,a.jsx)(n.A,{className:"absolute left-3 top-1/2 transform -translate-y-1/2 text-gray-400",size:14}),(0,a.jsx)("input",{type:"text",placeholder:"Search",className:"pl-8 pr-3 py-1.5 w-full border border-gray-300 rounded text-xs bg-gray-50 focus:outline-none focus:ring-1 focus:ring-blue-500 focus:border-blue-500",onChange:e=>t(e.target.value),value:e})]})}),(0,a.jsx)("div",{className:"flex-grow overflow-y-auto px-3 pb-3",children:(0,a.jsx)(w,{searchTerm:e,resources:x,hoveredItemId:s,onDragStart:h,onItemMouseEnter:f,onItemMouseLeave:y,onItemAdd:p})})]}):(0,a.jsxs)("div",{className:"bg-white text-gray-800 w-full h-full flex flex-col",children:[(0,a.jsx)("div",{className:"px-3 py-2 border-b border-gray-200",children:(0,a.jsxs)("div",{className:"relative",children:[(0,a.jsx)(n.A,{className:"absolute left-3 top-1/2 transform -translate-y-1/2 text-gray-400",size:14}),(0,a.jsx)("input",{type:"text",placeholder:"Search",className:"pl-8 pr-3 py-1.5 w-full border border-gray-300 rounded text-xs bg-gray-50 focus:outline-none focus:ring-1 focus:ring-blue-500 focus:border-blue-500",disabled:!0})]})}),(0,a.jsx)("div",{className:"flex-grow overflow-y-auto p-4",children:(0,a.jsx)("div",{className:"text-center text-gray-500 mt-8",children:(0,a.jsxs)("div",{className:"text-sm text-gray-600 space-y-4 max-w-xs mx-auto",children:[(0,a.jsx)("p",{children:"Users can use resources documented from EventCatalog in their diagrams."}),(0,a.jsx)("p",{children:"Open and run the Studio within your catalog directory and Studio will automatically pull these resources in for your diagrams."})]})})})]})}},44016:(e,t,s)=>{s.d(t,{A:()=>j});var a=s(69644);s(49568);var r=s(25073),l=s(25700),n=s(95327),o=s(83686),i=s(49972),c=s(59126),d=s(3812),x=s(70379),u=s(99516),m=s(52300),g=s(87287),h=s(40461),p=s(23915),f=s(30771),y=s(88868),b=s(84768);let j=()=>{let{setShowTemplateSelector:e}=(0,g.H)(),{importFlow:t}=(0,h.useFlowStoreActions)(),{currentDesign:s,updateDesignName:j}=(0,p.useDesignStore)(),{toggleFloatingPanel:v,floatingPanels:w}=(0,f.P)(),{toggleModal:N}=(0,y.C)(),{isDocumentPanelOpen:C,toggleDocumentPanel:k}=(0,b.useDocumentStore)(),S=e=>{window.open(e,"_blank","noopener,noreferrer")};return(0,a.jsx)(m.Kq,{delayDuration:300,children:(0,a.jsxs)("div",{className:"w-12 bg-white border-r border-gray-200 flex flex-col items-center py-4 flex-shrink-0",children:[(0,a.jsxs)("div",{className:"flex flex-col space-y-3",children:[(0,a.jsxs)(m.bL,{children:[(0,a.jsx)(m.l9,{asChild:!0,children:(0,a.jsx)("button",{onClick:()=>{e(!0)},className:"w-8 h-8 rounded hover:bg-gray-100 flex items-center justify-center transition-colors group",children:(0,a.jsx)(r.A,{className:"h-4 w-4 text-gray-700"})})}),(0,a.jsx)(m.ZL,{children:(0,a.jsxs)(m.UC,{className:"bg-gray-900 text-white px-2 py-1 rounded text-xs",side:"right",sideOffset:8,children:["Create Diagram",(0,a.jsx)(m.i3,{className:"fill-gray-900"})]})})]}),(0,a.jsxs)(m.bL,{children:[(0,a.jsx)(m.l9,{asChild:!0,children:(0,a.jsx)("button",{onClick:()=>{let e=document.createElement("input");e.type="file",e.accept=".ecstudio",e.onchange=e=>{var a;let r=e.target,l=null==r||null==(a=r.files)?void 0:a[0];if(l){let e=new FileReader;e.onload=e=>{try{var a,r;let n=JSON.parse(null==(a=e.target)?void 0:a.result);t(n);let o=n.name||(null==(r=n.metadata)?void 0:r.name)||l.name.replace(".ecstudio","");(null==s?void 0:s.id)&&j(s.id,o)}catch(e){console.error("Error parsing file:",e),alert("Error: Invalid file format. Please select a valid .ecstudio file.")}},e.readAsText(l)}},e.click()},className:"w-8 h-8 rounded hover:bg-gray-100 flex items-center justify-center transition-colors",children:(0,a.jsx)(l.A,{className:"h-4 w-4 text-gray-700"})})}),(0,a.jsx)(m.ZL,{children:(0,a.jsxs)(m.UC,{className:"bg-gray-900 text-white px-2 py-1 rounded text-xs",side:"right",sideOffset:8,children:["Open Diagram",(0,a.jsx)(m.i3,{className:"fill-gray-900"})]})})]}),(0,a.jsx)("div",{className:"w-6 h-px bg-gray-300 mx-auto my-2"}),(0,a.jsxs)(m.bL,{children:[(0,a.jsx)(m.l9,{asChild:!0,children:(0,a.jsx)("button",{onClick:()=>v("components"),className:"w-8 h-8 rounded flex items-center justify-center transition-colors ".concat(w.components?"bg-blue-100 text-blue-600":"hover:bg-gray-100 text-gray-700"),children:(0,a.jsx)(n.A,{className:"h-4 w-4"})})}),(0,a.jsx)(m.ZL,{children:(0,a.jsxs)(m.UC,{className:"bg-gray-900 text-white px-2 py-1 rounded text-xs",side:"right",sideOffset:8,children:["Components",(0,a.jsx)(m.i3,{className:"fill-gray-900"})]})})]}),(0,a.jsxs)(m.bL,{children:[(0,a.jsx)(m.l9,{asChild:!0,children:(0,a.jsx)("button",{onClick:()=>v("canvas"),className:"w-8 h-8 rounded flex items-center justify-center transition-colors ".concat(w.canvas?"bg-blue-100 text-blue-600":"hover:bg-gray-100 text-gray-700"),children:(0,a.jsx)(o.A,{className:"h-4 w-4"})})}),(0,a.jsx)(m.ZL,{children:(0,a.jsxs)(m.UC,{className:"bg-gray-900 text-white px-2 py-1 rounded text-xs",side:"right",sideOffset:8,children:["Canvas",(0,a.jsx)(m.i3,{className:"fill-gray-900"})]})})]}),(0,a.jsxs)(m.bL,{children:[(0,a.jsx)(m.l9,{asChild:!0,children:(0,a.jsx)("button",{onClick:()=>v("catalog"),className:"w-8 h-8 rounded flex items-center justify-center transition-colors ".concat(w.catalog?"bg-blue-100 text-blue-600":"hover:bg-gray-100 text-gray-700"),children:(0,a.jsx)(i.A,{className:"h-4 w-4"})})}),(0,a.jsx)(m.ZL,{children:(0,a.jsxs)(m.UC,{className:"bg-gray-900 text-white px-2 py-1 rounded text-xs",side:"right",sideOffset:8,children:["EventCatalog Resources",(0,a.jsx)(m.i3,{className:"fill-gray-900"})]})})]}),(0,a.jsx)("div",{className:"w-6 h-px bg-gray-300 mx-auto my-2"}),(0,a.jsxs)(m.bL,{children:[(0,a.jsx)(m.l9,{asChild:!0,children:(0,a.jsx)("button",{onClick:k,className:"w-8 h-8 rounded flex items-center justify-center transition-colors ".concat(C?"bg-blue-100 text-blue-600":"hover:bg-gray-100 text-gray-700"),children:(0,a.jsx)(c.A,{className:"h-4 w-4"})})}),(0,a.jsx)(m.ZL,{children:(0,a.jsxs)(m.UC,{className:"bg-gray-900 text-white px-2 py-1 rounded text-xs",side:"right",sideOffset:8,children:[C?"Hide Document":"Show Document",(0,a.jsx)(m.i3,{className:"fill-gray-900"})]})})]})]}),(0,a.jsx)("div",{className:"flex-1"}),(0,a.jsxs)("div",{className:"flex flex-col space-y-3",children:[(0,a.jsxs)(m.bL,{children:[(0,a.jsx)(m.l9,{asChild:!0,children:(0,a.jsx)("button",{onClick:()=>S("https://discord.gg/3rjaZMmrAm"),className:"w-8 h-8 rounded hover:bg-gray-100 flex items-center justify-center transition-colors",children:(0,a.jsxs)("svg",{className:"h-4 w-4 text-gray-600 fill-gray-900",viewBox:"0 -28.5 256 256",version:"1.1",xmlns:"http://www.w3.org/2000/svg",preserveAspectRatio:"xMidYMid",fill:"currentColor",children:[(0,a.jsx)("g",{id:"SVGRepo_bgCarrier",strokeWidth:"0"}),(0,a.jsx)("g",{id:"SVGRepo_tracerCarrier",strokeLinecap:"round",strokeLinejoin:"round"}),(0,a.jsxs)("g",{id:"SVGRepo_iconCarrier",children:[" ",(0,a.jsxs)("g",{children:[" ",(0,a.jsx)("path",{d:"M216.856339,16.5966031 C200.285002,8.84328665 182.566144,3.2084988 164.041564,0 C161.766523,4.11318106 159.108624,9.64549908 157.276099,14.0464379 C137.583995,11.0849896 118.072967,11.0849896 98.7430163,14.0464379 C96.9108417,9.64549908 94.1925838,4.11318106 91.8971895,0 C73.3526068,3.2084988 55.6133949,8.86399117 39.0420583,16.6376612 C5.61752293,67.146514 -3.4433191,116.400813 1.08711069,164.955721 C23.2560196,181.510915 44.7403634,191.567697 65.8621325,198.148576 C71.0772151,190.971126 75.7283628,183.341335 79.7352139,175.300261 C72.104019,172.400575 64.7949724,168.822202 57.8887866,164.667963 C59.7209612,163.310589 61.5131304,161.891452 63.2445898,160.431257 C105.36741,180.133187 151.134928,180.133187 192.754523,160.431257 C194.506336,161.891452 196.298154,163.310589 198.110326,164.667963 C191.183787,168.842556 183.854737,172.420929 176.223542,175.320965 C180.230393,183.341335 184.861538,190.991831 190.096624,198.16893 C211.238746,191.588051 232.743023,181.531619 254.911949,164.955721 C260.227747,108.668201 245.831087,59.8662432 216.856339,16.5966031 Z M85.4738752,135.09489 C72.8290281,135.09489 62.4592217,123.290155 62.4592217,108.914901 C62.4592217,94.5396472 72.607595,82.7145587 85.4738752,82.7145587 C98.3405064,82.7145587 108.709962,94.5189427 108.488529,108.914901 C108.508531,123.290155 98.3405064,135.09489 85.4738752,135.09489 Z M170.525237,135.09489 C157.88039,135.09489 147.510584,123.290155 147.510584,108.914901 C147.510584,94.5396472 157.658606,82.7145587 170.525237,82.7145587 C183.391518,82.7145587 193.761324,94.5189427 193.539891,108.914901 C193.539891,123.290155 183.391518,135.09489 170.525237,135.09489 Z",fill:"currentColor",fillRule:"nonzero",children:" "})," "]})," "]})]})})}),(0,a.jsx)(m.ZL,{children:(0,a.jsxs)(m.UC,{className:"bg-gray-900 text-white px-2 py-1 rounded text-xs",side:"right",sideOffset:8,children:["Discord",(0,a.jsx)(m.i3,{className:"fill-gray-900"})]})})]}),(0,a.jsxs)(m.bL,{children:[(0,a.jsx)(m.l9,{asChild:!0,children:(0,a.jsx)("button",{onClick:()=>S("https://twitter.com/event_catalog"),className:"w-8 h-8 rounded hover:bg-gray-100 flex items-center justify-center transition-colors",children:(0,a.jsx)(d.A,{className:"h-4 w-4 text-gray-600"})})}),(0,a.jsx)(m.ZL,{children:(0,a.jsxs)(m.UC,{className:"bg-gray-900 text-white px-2 py-1 rounded text-xs",side:"right",sideOffset:8,children:["Twitter (X)",(0,a.jsx)(m.i3,{className:"fill-gray-900"})]})})]}),(0,a.jsx)("div",{className:"w-6 h-px bg-gray-300 mx-auto my-2"}),(0,a.jsxs)(m.bL,{children:[(0,a.jsx)(m.l9,{asChild:!0,children:(0,a.jsx)("button",{onClick:()=>S("https://docs.eventcatalog.dev"),className:"w-8 h-8 rounded hover:bg-gray-100 flex items-center justify-center transition-colors",children:(0,a.jsx)(x.A,{className:"h-4 w-4 text-gray-600"})})}),(0,a.jsx)(m.ZL,{children:(0,a.jsxs)(m.UC,{className:"bg-gray-900 text-white px-2 py-1 rounded text-xs",side:"right",sideOffset:8,children:["Documentation",(0,a.jsx)(m.i3,{className:"fill-gray-900"})]})})]}),(0,a.jsxs)(m.bL,{children:[(0,a.jsx)(m.l9,{asChild:!0,children:(0,a.jsx)("button",{onClick:N,className:"w-8 h-8 rounded hover:bg-gray-100 flex items-center justify-center transition-colors",children:(0,a.jsx)(u.A,{className:"h-4 w-4 text-gray-600"})})}),(0,a.jsx)(m.ZL,{children:(0,a.jsxs)(m.UC,{className:"bg-gray-900 text-white px-2 py-1 rounded text-xs",side:"right",sideOffset:8,children:["Settings",(0,a.jsx)(m.i3,{className:"fill-gray-900"})]})})]})]})]})})}},47474:(e,t,s)=>{s.d(t,{h:()=>a});let a=(0,s(88936).v)((e,t)=>({resources:[],setResources:t=>e({resources:t}),getResources:()=>t().resources,studioFilesFromEventCatalogDirectory:[],setStudioFilesFromEventCatalogDirectory:t=>e({studioFilesFromEventCatalogDirectory:t}),getStudioFilesFromEventCatalogDirectory:()=>t().studioFilesFromEventCatalogDirectory,templates:[],setTemplates:t=>e({templates:t}),getTemplates:()=>t().templates}))},50798:(e,t,s)=>{s.d(t,{A:()=>p});var a=s(69644),r=s(49568),l=s(17684),n=s(3983),o=s(40461),i=s(57962),c=s(75835),d=s(17098);let x=e=>{let{id:t,value:s,onChange:r,disabled:l,placeholder:n,label:o,required:i}=e;return(0,a.jsx)("input",{id:t,type:"text",value:s||"",onChange:e=>r(e.target.value),disabled:l,required:i,placeholder:n||"Enter ".concat(null==o?void 0:o.toLowerCase()),className:" w-full px-3 py-2 bg-white border-2 border-gray-200 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-indigo-500/20 focus:border-indigo-500 disabled:bg-gray-50 disabled:cursor-not-allowed placeholder:text-gray-400 text-gray-900 transition-colors duration-200 "})},u=e=>{let{id:t,value:s,onChange:r,disabled:l,placeholder:n,label: