CoolFace
Apppublic

admin08077/Githubgemini

sourceHugging Faceotherupdated 10mo agoView on Hugging Face
0likes
SchemaDesigner-DAGfu-WA.js8 linesDownload Raw Back to assets
1import{r as i,j as e}from"./react-DKy9e2uO.js";import{l as g,A as x}from"./index-Ck8YGBbR.js";import{d as p}from"./fileUtils-Bw7t6Hrv.js";import"./bottleneck-Cpj98o6Y.js";import"./react-dom-CpxHE_eW.js";import"./scheduler-DYLXRpC5.js";import"./idb-Dob3nYDb.js";import"./@google-D80DdW2m.js";import"./marked-CesSW9Du.js";import"./jszip-s56H2EZ-.js";const h=n=>n.map(l=>{const t=l.columns.map(o=>`  "${o.name}" ${o.type.toUpperCase()}`).join(`,2`);return`CREATE TABLE "${l.name}" (3${t}4);`}).join(`5 6`),M=()=>{const[n,l]=i.useState([{id:1,name:"users",columns:[{id:1,name:"id",type:"INTEGER PRIMARY KEY"},{id:2,name:"username",type:"VARCHAR(255)"}],x:50,y:50},{id:2,name:"posts",columns:[{id:1,name:"id",type:"INTEGER PRIMARY KEY"},{id:2,name:"user_id",type:"INTEGER"},{id:3,name:"content",type:"TEXT"}],x:300,y:100}]),[t,o]=i.useState(null),a=i.useRef(null),u=(s,r)=>{const m=s.currentTarget.getBoundingClientRect();o({id:r,offsetX:s.clientX-m.left,offsetY:s.clientY-m.top})},f=s=>{if(!t||!a.current)return;const r=a.current.getBoundingClientRect();l(n.map(c=>c.id===t.id?{...c,x:s.clientX-t.offsetX-r.left+a.current.scrollLeft,y:s.clientY-t.offsetY-r.top+a.current.scrollTop}:c))},d=()=>o(null);return e.jsxs("div",{className:"h-full flex flex-col p-4 sm:p-6 lg:p-8 text-text-primary",children:[e.jsxs("header",{className:"mb-6",children:[e.jsxs("h1",{className:"text-3xl font-bold flex items-center",children:[e.jsx(g,{}),e.jsx("span",{className:"ml-3",children:"Schema Designer"})]}),e.jsx("p",{className:"text-text-secondary mt-1",children:"Visually design your database schema with drag-and-drop."})]}),e.jsxs("div",{className:"flex-grow flex gap-6 min-h-0",children:[e.jsx("main",{ref:a,className:"flex-grow relative bg-background rounded-lg border-2 border-dashed border-border overflow-auto",onMouseMove:f,onMouseUp:d,onMouseLeave:d,children:n.map(s=>e.jsxs("div",{className:`absolute w-64 bg-surface rounded-lg shadow-xl border cursor-grab active:cursor-grabbing ${(t==null?void 0:t.id)===s.id?"border-primary":"border-border"}`,style:{top:s.y,left:s.x},onMouseDown:r=>u(r,s.id),children:[e.jsx("h3",{className:"font-bold text-primary text-lg p-2 bg-gray-50 rounded-t-lg border-b border-border",children:s.name}),e.jsx("div",{className:"p-2 space-y-1 font-mono text-xs",children:s.columns.map(r=>e.jsxs("div",{className:"flex justify-between items-center",children:[e.jsx("span",{className:"text-text-primary",children:r.name}),e.jsx("span",{className:"text-text-secondary",children:r.type})]},r.id))})]},s.id))}),e.jsxs("aside",{className:"w-80 flex-shrink-0 flex flex-col gap-4",children:[e.jsxs("div",{className:"flex flex-col gap-2",children:[e.jsxs("button",{onClick:()=>p(JSON.stringify(n,null,2),"schema.json","application/json"),className:"flex-1 text-sm py-2 bg-gray-100 border border-border rounded-md flex items-center justify-center gap-2 hover:bg-gray-200",children:[e.jsx(x,{className:"w-4 h-4"})," Download JSON"]}),e.jsxs("button",{onClick:()=>p(h(n),"schema.sql","application/sql"),className:"btn-primary flex-1 text-sm py-2 flex items-center justify-center gap-2",children:[e.jsx(x,{className:"w-4 h-4"})," Download SQL"]})]}),e.jsxs("div",{className:"flex-grow bg-surface border border-border p-4 rounded-lg overflow-y-auto",children:[e.jsx("h3",{className:"font-bold mb-2",children:"Editor"}),e.jsx("p",{className:"text-xs text-text-secondary",children:"Schema editing coming soon!"})]})]})]})]})};export{M as SchemaDesigner};7//# sourceMappingURL=SchemaDesigner-DAGfu-WA.js.map8