@filekit-studio/sketch 0.0.0-stage → 1.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -0
- package/README.md +193 -2
- package/dist/export.d.mts +1 -0
- package/dist/export.d.ts +1 -0
- package/dist/export.js +91 -0
- package/dist/export.mjs +91 -0
- package/dist/index-DNRZSQHn.d.mts +192 -0
- package/dist/index-DNRZSQHn.d.ts +192 -0
- package/dist/index.d.mts +577 -0
- package/dist/index.d.ts +577 -0
- package/dist/index.js +133 -0
- package/dist/index.mjs +133 -0
- package/dist/styles.css +429 -0
- package/package.json +70 -4
package/dist/index.js
ADDED
|
@@ -0,0 +1,133 @@
|
|
|
1
|
+
'use strict';var Ln=require('react'),iconsReact=require('@tabler/icons-react'),jsxRuntime=require('react/jsx-runtime'),pdfLib=require('pdf-lib'),lucideReact=require('lucide-react');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}var Ln__default=/*#__PURE__*/_interopDefault(Ln);var $o=Ln.createContext({theme:"system",resolvedTheme:"light",isDark:false,panelVariant:"classic"});function no(){return Ln.useContext($o)}function Vn(){if(typeof window>"u"||typeof document>"u")return false;let e=document.documentElement,t=document.body;return e.classList.contains("dark")||t?.classList.contains("dark")||e.getAttribute("data-theme")==="dark"||t?.getAttribute("data-theme")==="dark"?true:window.matchMedia("(prefers-color-scheme: dark)").matches}function Vt(e){let t=Ln.useContext($o),r=e!==void 0?e:t.theme,[o,p]=Ln.useState(()=>r==="dark"?"dark":r==="light"?"light":Vn()?"dark":"light");return Ln.useEffect(()=>{if(typeof window>"u"||typeof document>"u")return;if(r==="dark"){p("dark");return}if(r==="light"){p("light");return}let c=()=>{p(Vn()?"dark":"light");};c();let l=new MutationObserver(()=>{c();});l.observe(document.documentElement,{attributes:true,attributeFilter:["class","data-theme"]}),document.body&&l.observe(document.body,{attributes:true,attributeFilter:["class","data-theme"]});let s=window.matchMedia("(prefers-color-scheme: dark)"),n=()=>{c();};return s.addEventListener("change",n),()=>{l.disconnect(),s.removeEventListener("change",n);}},[r]),{theme:r,resolvedTheme:o,isDark:o==="dark",panelVariant:t.panelVariant}}var Ti=()=>()=>{};function ao(){return Ln.useSyncExternalStore(Ti,()=>true,()=>false)}var lo=[{key:"q",name:"Transparent",stroke:{light:"transparent",dark:"transparent"},fill:{light:"transparent",dark:"transparent"}},{key:"w",name:"White",stroke:{light:"#ffffff",dark:"#ffffff"},fill:{light:"#ffffff",dark:"#ffffff"}},{key:"e",name:"Grey",stroke:{light:"#343a40",dark:"#ced4da"},fill:{light:"#e9ecef",dark:"#2e3238"}},{key:"r",name:"Black / Off-white",stroke:{light:"#1e1e24",dark:"#f8f9fa"},fill:{light:"#1e1e24",dark:"#1e1e24"}},{key:"t",name:"Warm Taupe",stroke:{light:"#865e3c",dark:"#d8c2b0"},fill:{light:"#f4ece4",dark:"#362b28"}},{key:"a",name:"Teal Cyan",stroke:{light:"#0c8599",dark:"#22b8cf"},fill:{light:"#c5f6fa",dark:"#0c383e"}},{key:"s",name:"Sky Blue",stroke:{light:"#1971c2",dark:"#4dabf7"},fill:{light:"#a5d8ff",dark:"#182a4d"}},{key:"d",name:"Royal Purple",stroke:{light:"#6741d9",dark:"#b197fc"},fill:{light:"#d0bfff",dark:"#2b1e4a"}},{key:"f",name:"Violet Magenta",stroke:{light:"#ae3ec9",dark:"#e599f7"},fill:{light:"#eebefa",dark:"#381e3d"}},{key:"g",name:"Crimson Berry",stroke:{light:"#c2255c",dark:"#f783ac"},fill:{light:"#fcc2d7",dark:"#3e1828"}},{key:"z",name:"Green",stroke:{light:"#2f9e44",dark:"#51cf66"},fill:{light:"#b2f2bb",dark:"#143823"}},{key:"x",name:"Mint Emerald",stroke:{light:"#087f5b",dark:"#38d9a9"},fill:{light:"#96f2d7",dark:"#123d33"}},{key:"c",name:"Amber Yellow",stroke:{light:"#f59f00",dark:"#ffd43b"},fill:{light:"#ffec99",dark:"#3d2e14"}},{key:"v",name:"Vivid Orange",stroke:{light:"#f76707",dark:"#ffa94d"},fill:{light:"#ffd8a8",dark:"#3d2014"}},{key:"b",name:"Coral Red",stroke:{light:"#e03131",dark:"#ff8787"},fill:{light:"#ffc9c9",dark:"#2e1418"}}];var ta=[{name:"Crimson Red",hex:"#ef4444",glow:"rgba(239, 68, 68, 0.7)"},{name:"Emerald Green",hex:"#10b981",glow:"rgba(16, 185, 129, 0.7)"},{name:"Electric Blue",hex:"#3b82f6",glow:"rgba(59, 130, 246, 0.7)"},{name:"Neon Purple",hex:"#a855f7",glow:"rgba(168, 85, 247, 0.7)"},{name:"Radiant Gold",hex:"#f59e0b",glow:"rgba(245, 158, 11, 0.7)"}],zo=lo.map(e=>({name:e.name,hex:e.stroke.light,shortcut:e.key}));lo.map(e=>({name:e.name,hex:e.fill.light}));var Zn={"#fef08a":{bg:"#fef08a",backSheetBg:"#fefce8",backSheetBorder:"#fde047",mainBorder:"rgba(234, 179, 8, 0.45)",tapeBg:"rgba(254, 249, 195, 0.95)",tapeBorder:"rgba(202, 138, 4, 0.35)",text:"#713f12",sheen:"rgba(255, 255, 255, 0.8)"},"#fde68a":{bg:"#fde68a",backSheetBg:"#fef9d9",backSheetBorder:"#fcd34d",mainBorder:"rgba(245, 158, 11, 0.4)",tapeBg:"rgba(255, 250, 224, 0.95)",tapeBorder:"rgba(217, 119, 6, 0.35)",text:"#78350f",sheen:"rgba(255, 255, 255, 0.8)"},"#bbf7d0":{bg:"#bbf7d0",backSheetBg:"#f0fdf4",backSheetBorder:"#86efac",mainBorder:"rgba(74, 222, 128, 0.45)",tapeBg:"rgba(240, 253, 244, 0.95)",tapeBorder:"rgba(22, 163, 74, 0.35)",text:"#14532d",sheen:"rgba(255, 255, 255, 0.8)"},"#bae6fd":{bg:"#bae6fd",backSheetBg:"#f0f9ff",backSheetBorder:"#7dd3fc",mainBorder:"rgba(56, 189, 248, 0.45)",tapeBg:"rgba(240, 249, 255, 0.95)",tapeBorder:"rgba(2, 132, 199, 0.35)",text:"#0c4a6e",sheen:"rgba(255, 255, 255, 0.8)"},"#fed7aa":{bg:"#fed7aa",backSheetBg:"#fff7ed",backSheetBorder:"#fdba74",mainBorder:"rgba(251, 146, 60, 0.45)",tapeBg:"rgba(255, 247, 237, 0.95)",tapeBorder:"rgba(234, 88, 12, 0.35)",text:"#7c2d12",sheen:"rgba(255, 255, 255, 0.8)"},"#e9d5ff":{bg:"#e9d5ff",backSheetBg:"#faf5ff",backSheetBorder:"#d8b4fe",mainBorder:"rgba(192, 132, 252, 0.45)",tapeBg:"rgba(250, 245, 255, 0.95)",tapeBorder:"rgba(147, 51, 234, 0.35)",text:"#581c87",sheen:"rgba(255, 255, 255, 0.8)"},"#fecdd3":{bg:"#fecdd3",backSheetBg:"#fff1f2",backSheetBorder:"#fda4af",mainBorder:"rgba(251, 113, 133, 0.45)",tapeBg:"rgba(255, 241, 242, 0.95)",tapeBorder:"rgba(225, 29, 72, 0.35)",text:"#881337",sheen:"rgba(255, 255, 255, 0.8)"}},Jn={"#fef08a":{bg:"#2b230d",backSheetBg:"#1c1608",backSheetBorder:"#4a3c18",mainBorder:"rgba(250, 204, 21, 0.5)",tapeBg:"rgba(254, 240, 138, 0.18)",tapeBorder:"rgba(250, 204, 21, 0.45)",text:"#fef08a",sheen:"rgba(254, 240, 138, 0.15)"},"#fde68a":{bg:"#2b230d",backSheetBg:"#1c1608",backSheetBorder:"#4a3c18",mainBorder:"rgba(250, 204, 21, 0.5)",tapeBg:"rgba(254, 240, 138, 0.18)",tapeBorder:"rgba(250, 204, 21, 0.45)",text:"#fde68a",sheen:"rgba(254, 240, 138, 0.15)"},"#bbf7d0":{bg:"#10281b",backSheetBg:"#091b11",backSheetBorder:"#1e4730",mainBorder:"rgba(74, 222, 128, 0.5)",tapeBg:"rgba(187, 247, 208, 0.18)",tapeBorder:"rgba(74, 222, 128, 0.45)",text:"#bbf7d0",sheen:"rgba(187, 247, 208, 0.15)"},"#bae6fd":{bg:"#102436",backSheetBg:"#091724",backSheetBorder:"#1d4160",mainBorder:"rgba(56, 189, 248, 0.5)",tapeBg:"rgba(186, 230, 253, 0.18)",tapeBorder:"rgba(56, 189, 248, 0.45)",text:"#bae6fd",sheen:"rgba(186, 230, 253, 0.15)"},"#fed7aa":{bg:"#321d10",backSheetBg:"#201107",backSheetBorder:"#56321c",mainBorder:"rgba(251, 146, 60, 0.5)",tapeBg:"rgba(254, 215, 170, 0.18)",tapeBorder:"rgba(251, 146, 60, 0.45)",text:"#fed7aa",sheen:"rgba(254, 215, 170, 0.15)"},"#e9d5ff":{bg:"#271638",backSheetBg:"#190d24",backSheetBorder:"#462865",mainBorder:"rgba(192, 132, 252, 0.5)",tapeBg:"rgba(233, 213, 255, 0.18)",tapeBorder:"rgba(192, 132, 252, 0.45)",text:"#e9d5ff",sheen:"rgba(233, 213, 255, 0.15)"},"#fecdd3":{bg:"#321319",backSheetBg:"#210b10",backSheetBorder:"#56222b",mainBorder:"rgba(251, 113, 133, 0.5)",tapeBg:"rgba(254, 205, 211, 0.18)",tapeBorder:"rgba(251, 113, 133, 0.45)",text:"#fecdd3",sheen:"rgba(254, 205, 211, 0.15)"}};function Qn(e){let t=e.replace("#","").trim();if(t.length===3&&(t=t[0]+t[0]+t[1]+t[1]+t[2]+t[2]),t.length===6){let r=parseInt(t,16);if(!isNaN(r))return {r:r>>16&255,g:r>>8&255,b:r&255}}return {r:254,g:240,b:138}}function ea(e,t,r){e/=255,t/=255,r/=255;let o=Math.max(e,t,r),p=Math.min(e,t,r),c=0,l=0,s=(o+p)/2;if(o!==p){let n=o-p;switch(l=s>.5?n/(2-o-p):n/(o+p),o){case e:c=(t-r)/n+(t<r?6:0);break;case t:c=(r-e)/n+2;break;case r:c=(e-t)/n+4;break}c/=6;}return {h:Math.round(c*360),s:Math.round(l*100),l:Math.round(s*100)}}function vr(e,t=false){let r=(e||"#fde68a").toLowerCase();if(t){if(Jn[r])return Jn[r];let{r:u,g:i,b:d}=Qn(r),{h,s:a}=ea(u,i,d),x=Math.max(35,a);return {bg:`hsl(${h}, ${Math.round(x*.45)}%, 16%)`,backSheetBg:`hsl(${h}, ${Math.round(x*.5)}%, 10%)`,backSheetBorder:`hsl(${h}, ${Math.round(x*.6)}%, 28%)`,mainBorder:`hsla(${h}, ${Math.round(x*.9)}%, 65%, 0.5)`,tapeBg:`hsla(${h}, ${Math.round(x*.8)}%, 80%, 0.18)`,tapeBorder:`hsla(${h}, ${Math.round(x*.9)}%, 70%, 0.45)`,text:`hsl(${h}, ${Math.round(x*.95)}%, 88%)`,sheen:`hsla(${h}, ${Math.round(x*.8)}%, 85%, 0.15)`}}if(Zn[r])return Zn[r];let{r:o,g:p,b:c}=Qn(r),{h:l,s}=ea(o,p,c),n=Math.max(30,s);return {bg:e||"#fde68a",backSheetBg:`hsl(${l}, ${Math.round(n*.75)}%, 94%)`,backSheetBorder:`hsl(${l}, ${Math.round(n*.85)}%, 72%)`,mainBorder:`hsl(${l}, ${Math.round(n*.95)}%, 42%)`,tapeBg:`hsla(${l}, ${Math.round(n*.6)}%, 96%, 0.95)`,tapeBorder:`hsla(${l}, ${Math.round(n*.9)}%, 42%, 0.38)`,text:`hsl(${l}, ${Math.round(n*.95)}%, 16%)`,sheen:"rgba(255, 255, 255, 0.8)"}}var ra=[{name:"Canary Yellow",bg:"#fde68a",border:"#facc15",text:"#78350f"},{name:"Mint Green",bg:"#bbf7d0",border:"#86efac",text:"#14532d"},{name:"Sky Blue",bg:"#bae6fd",border:"#7dd3fc",text:"#0c4a6e"},{name:"Soft Coral",bg:"#fed7aa",border:"#fdba74",text:"#7c2d12"},{name:"Lavender",bg:"#e9d5ff",border:"#d8b4fe",text:"#581c87"},{name:"Soft Rose",bg:"#fecdd3",border:"#fda4af",text:"#881337"}],oa=[{value:"transparent",label:"Empty",icon:"square"},{value:"solid",label:"Solid",icon:"square-filled"},{value:"hachure",label:"Slash (\\)",icon:"slash"},{value:"hachure-right",label:"Backslash (/)",icon:"backslash"},{value:"cross-hatch",label:"Grid Net",icon:"grid"},{value:"dots",label:"Dots",icon:"dots"}],Bo=[{label:"Fine",value:1.8},{label:"Medium",value:3.2},{label:"Bold",value:5.2}],co=[{value:"none",label:"None",shortcut:"q",category:"standard"},{value:"arrow",label:"Open Arrow",shortcut:"w",category:"standard"},{value:"triangle",label:"Triangle",shortcut:"e",category:"standard"},{value:"barbed",label:"Barbed Arrow",shortcut:"r",category:"standard"},{value:"dot",label:"Filled Dot",shortcut:"a",category:"more"},{value:"circle",label:"Hollow Circle",shortcut:"s",category:"more"},{value:"diamond",label:"Filled Diamond",shortcut:"d",category:"more"},{value:"diamond_outline",label:"Hollow Diamond",shortcut:"f",category:"more"},{value:"bar",label:"Tee / Bar",shortcut:"z",category:"more"},{value:"crowfoot_one",label:"One",shortcut:"x",category:"cardinality"},{value:"crowfoot_many",label:"Many",shortcut:"c",category:"cardinality"},{value:"crowfoot_one_many",label:"One or Many",shortcut:"v",category:"cardinality"},{value:"crowfoot_strictly_one",label:"Strictly One",shortcut:"",category:"cardinality"},{value:"crowfoot_zero_one",label:"Zero or One",shortcut:"",category:"cardinality"},{value:"crowfoot_zero_many",label:"Zero or Many",shortcut:"",category:"cardinality"}];function ar(e,t="none"){return e===true?"arrow":e===false||e===null||e===void 0?t:e}var io=[{hex:"#ffffff",name:"Pure White"},{hex:"#f0f4f8",name:"Sky Slate"},{hex:"#fffbeb",name:"Sand Cream"},{hex:"#faf5f0",name:"Blush Peach"},{hex:"#f0fdf4",name:"Mint Mist"}],so=[{hex:"#121212",name:"Pure Dark"},{hex:"#1a1d24",name:"Midnight Slate"},{hex:"#1f1e1b",name:"Warm Olive"},{hex:"#201a1a",name:"Plum Dark"},{hex:"#141f18",name:"Forest Dark"}];function na(e,t){if(!e||e==="default")return t?"#1a1d24":"#f0f4f8";let r=e.toLowerCase(),o=io.findIndex(c=>c.hex.toLowerCase()===r);if(o!==-1)return t?so[o].hex:io[o].hex;let p=so.findIndex(c=>c.hex.toLowerCase()===r);return p!==-1?t?so[p].hex:io[p].hex:e}var aa=[{value:"solid",label:"Solid"},{value:"dashed",label:"Dashed"},{value:"dotted",label:"Dotted"}],hr=[{value:"fuzzy",label:"Handwritten",cssFont:"'Fuzzy Bubbles', cursive, sans-serif"},{value:"comic",label:"Playful",cssFont:"'Comic Neue', cursive, sans-serif"},{value:"patrick",label:"Calm",cssFont:"'Patrick Hand SC', sans-serif"},{value:"sans",label:"Formal",cssFont:"'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif"},{value:"mono",label:"Code",cssFont:"'JetBrains Mono', 'Geist Mono', 'Courier New', Consolas, monospace"}];function qt(e){return e==="fuzzy"||e==="edusa"||e==="playpen"||e==="caveat"?hr[0]:e==="comic"||e==="handlee"?hr[1]:e==="serif"||e==="patrick"?hr[2]:e==="sans"?hr[3]:e==="mono"?hr[4]:hr.find(t=>t.value===e)||hr[0]}var ia=[{label:"S",value:16,title:"Small (S - 16px)"},{label:"M",value:22,title:"Medium (M - 22px)"},{label:"L",value:28,title:"Large (L - 28px)"},{label:"XL",value:36,title:"Extra Large (XL - 36px)"}];var nn={type:"rectangle",strokeColor:"#1e1e24",strokeWidth:2.5,strokeStyle:"solid",fillColor:"#ffc9c9",fillStyle:"hachure",opacity:1,zIndex:1,edgeStyle:"round",roughStyle:"clean",roughness:0,fontSize:20,fontFamily:"fuzzy",textAlign:"center",stickyColor:"#fef08a",startArrowhead:"none",endArrowhead:"arrow"};function vt(e,t){if(!e||e==="transparent")return e||"transparent";let r=e.trim().toLowerCase();if(t){if(["#000000","#020617","#0f172a","#111827","#18181b","#1e1e24","#1e293b","#27272a","#334155","#343a40","#3f3f46","#475569","#52525b","#1f2937","#242731"].includes(r))return "#f8f9fa";if(["#e2e8f0","#e5e7eb","#cbd5e1","#ced4da"].includes(r))return "#374151";if(["#64748b","#71717a","#78716c","#868e96"].includes(r))return "#ced4da";if(["#94a3b8"].includes(r))return "#64748b";if(["#713f12","#865e3c","#a89984","#78350f","#451a03"].includes(r))return "#ffd43b";if(["#042f2e","#134e4a","#115e59","#0f766e","#0d9488","#0891b2","#0c8599","#14b8a6","#2dd4bf","#164e63","#155e75","#0e7490"].includes(r))return "#22b8cf";if(["#172554","#1e3a8a","#1e40af","#1d4ed8","#2563eb","#1971c2","#0b6eff","#3b82f6","#182a4d","#0c4a6e","#075985","#0369a1","#0284c7"].includes(r))return "#4dabf7";if(["#3b0764","#581c87","#6b21a8","#7e22ce","#9333ea","#a855f7","#2e1065","#4c1d95","#5b21b6","#6741d9","#6965db","#7c3aed","#2b1e4a","#1e1b4b","#312e81","#3730a3","#4338ca","#4f46e5"].includes(r))return "#b197fc";if(["#ae3ec9","#9c36b5","#be185d","#381e3d","#86198f","#701a75"].includes(r))return "#e599f7";if(["#4c0519","#881337","#9f1239","#c2255c","#db2777","#e11d48","#f43f5e","#f472b6","#3e1828","#831843","#9d174d"].includes(r))return "#f783ac";if(["#052e16","#14532d","#166534","#15803d","#16a34a","#2f9e44","#22c55e","#143823"].includes(r))return "#51cf66";if(["#064e3b","#065f46","#047857","#087f5b","#059669","#10b981","#123d33","#022c22"].includes(r))return "#38d9a9";if(["#713f12","#854d0e","#a16207","#ca8a04","#eab308","#f59f00","#d97706","#b45309","#3d2e14","#78350f","#451a03"].includes(r))return "#ffd43b";if(["#451a03","#7c2d12","#9a3412","#c2410c","#ea580c","#f76707","#f97316","#3d2014"].includes(r))return "#ffa94d";if(["#450a0a","#7f1d1d","#991b1b","#b91c1c","#dc2626","#e03131","#ef4444","#2e1418"].includes(r))return "#ff8787";if(["#ffffff","#fff"].includes(r))return "#ffffff"}else {if(["#f8f9fa","#f8fafc","#f3f4f6","#ffffff","#fff"].includes(r))return "#111827";if(["#374151","#475569","#64748b","#ced4da"].includes(r))return "#e2e8f0";if(["#d8c2b0"].includes(r))return "#865e3c";if(["#22b8cf","#5eead4","#2dd4bf"].includes(r))return "#0c8599";if(["#4dabf7","#60a5fa","#74c0fc"].includes(r))return "#1971c2";if(["#b197fc","#a5b4fc","#c4b5fd"].includes(r))return "#6741d9";if(["#e599f7","#c084fc"].includes(r))return "#ae3ec9";if(["#f783ac","#fb7185","#f472b6"].includes(r))return "#c2255c";if(["#51cf66","#4ade80"].includes(r))return "#2f9e44";if(["#38d9a9","#34d399"].includes(r))return "#087f5b";if(["#ffd43b","#fde047","#facc15"].includes(r))return "#f59f00";if(["#ffa94d","#fb923c"].includes(r))return "#f76707";if(["#ff8787","#f87171"].includes(r))return "#e03131"}return e}function _r(e,t,r){if(!e||e==="transparent")return "transparent";let o=e.trim().toLowerCase();if(["#ffffff","#fff"].includes(o))return "#ffffff";if(["#000000","#1e1e24","#111827","#121212","#18181b"].includes(o))return o==="#000000"?"#000000":"#1e1e24";if(["#f8f9fa","#f8fafc","#f1f5f9","#f3f4f6"].includes(o))return "#f8f9fa";if(r){if(["#e5e7eb","#e2e8f0"].includes(o)||["#1f2937","#242731","#16171b","#1e2029","#0f172a","#1e293b","#374151"].includes(o))return "#242731";if(["#e9ecef","#dee2e6","#ced4da","#2e3238","#212529","#343a40"].includes(o))return "#2e3238";if(["#f4ece4","#f5f0eb","#a89984","#e2d9cc","#362b28"].includes(o))return "#362b28";if(["#c5f6fa","#ccfbf1","#99f6e4","#5eead4","#2dd4bf","#14b8a6","#0d9488","#cffafe","#0c383e"].includes(o))return "#0c383e";if(["#a5d8ff","#d0ebff","#e0f2fe","#bae6fd","#dbeafe","#bfdbfe","#93c5fd","#60a5fa","#182a4d"].includes(o))return "#182a4d";if(["#d0bfff","#e5dbff","#ede9fe","#e0e7ff","#c7d2fe","#a5b4fc","#818cf8","#1e1b4b","#2b1e4a"].includes(o))return "#1e1b4b";if(["#eebefa","#f5d0fe","#e9d5ff","#d8b4fe","#c084fc","#381e3d"].includes(o))return "#381e3d";if(["#fcc2d7","#f8d7da","#3e1828"].includes(o))return "#3e1828";if(["#ffc9c9","#ffe3e3","#ffe4e6","#fecdd3","#fce7f3","#fbcfe8","#fda4af","#fb7185","#2e1418"].includes(o))return "#2e1418";if(["#b2f2bb","#d3f9d8","#dcfce7","#bbf7d0","#d1fae5","#a7f3d0","#143823"].includes(o))return "#143823";if(["#96f2d7","#c3fae8","#123d33"].includes(o))return "#123d33";if(["#ffec99","#fff3bf","#fef9c3","#fef08a","#fde047","#3d2e14"].includes(o))return "#3d2e14";if(["#ffd8a8","#ffe8cc","#ffedd5","#fed7aa","#3d2014"].includes(o))return "#3d2014";if(["#fee2e2","#fca5a5","#f87171","#2e1418"].includes(o))return "#2e1418"}else {if(["#1f2937","#242731","#16171b","#1e2029","#0f172a","#1e293b","#374151"].includes(o))return "#ffffff";if(["#ced4da","#e9ecef","#dee2e6","#e2e8f0","#cbd5e1","#2e3238","#212529","#343a40"].includes(o))return "#e9ecef";if(["#362b28"].includes(o))return "#f4ece4";if(["#0c383e","#042f2e"].includes(o))return "#c5f6fa";if(["#182a4d","#172554"].includes(o))return "#a5d8ff";if(["#2b1e4a","#1e1b4b","#3b0764"].includes(o))return "#d0bfff";if(["#381e3d"].includes(o))return "#eebefa";if(["#3e1828"].includes(o))return "#fcc2d7";if(["#2e1418","#4c0519","#450a0a"].includes(o))return "#ffc9c9";if(["#143823","#052e16"].includes(o))return "#b2f2bb";if(["#123d33"].includes(o))return "#96f2d7";if(["#3d2e14","#422006"].includes(o))return "#ffec99";if(["#3d2014","#431407"].includes(o))return "#ffd8a8"}return e}function sa(e){return e?e.startsWith("top")?{dx:0,dy:-1}:e.startsWith("bottom")?{dx:0,dy:1}:e.startsWith("left")?{dx:-1,dy:0}:e.startsWith("right")?{dx:1,dy:0}:{dx:0,dy:0}:{dx:0,dy:0}}function Tr(e){let t={x:e.x,y:e.y},r={x:e.x+e.width,y:e.y+e.height},o=e.arrowType||"straight";if(o==="straight"){let i=Math.atan2(r.y-t.y,r.x-t.x);return {type:"straight",points:[t,r],departureAngle:i,arrivalAngle:i}}if(o==="curved"){let i=e.controlPoint;if(!i){let a=(t.x+r.x)/2,x=(t.y+r.y)/2,b=r.x-t.x,k=r.y-t.y,y=Math.hypot(b,k),_=Math.min(45,Math.max(15,y*.2)),S=y>0?-k/y*_:0,P=y>0?b/y*_:0;i={x:a+S,y:x+P};}let d=Math.atan2(i.y-t.y,i.x-t.x),h=Math.atan2(r.y-i.y,r.x-i.x);return {type:"curved",points:[t,r],controlPoint:i,departureAngle:d,arrivalAngle:h}}let p=r.x-t.x,c=r.y-t.y,l=e.controlPoint1,s=e.controlPoint2;if(!l||!s){let i=e.startBinding?.anchor,d=e.endBinding?.anchor,h=sa(i),a=sa(d);if(i&&d&&(h.dx!==0||h.dy!==0||a.dx!==0||a.dy!==0)){let x=Math.max(35,Math.hypot(p,c)*.35);l=l||{x:t.x+h.dx*x,y:t.y+h.dy*x},s=s||{x:r.x+a.dx*x,y:r.y+a.dy*x};}else l=l||{x:t.x+p*.4,y:t.y},s=s||{x:t.x+p*.6,y:r.y};}let n=Math.atan2(l.y-t.y,l.x-t.x),u=Math.atan2(r.y-s.y,r.x-s.x);return {type:"elbow",points:[t,r],controlPoint1:l,controlPoint2:s,departureAngle:n,arrivalAngle:u}}function la(e){let t=Tr(e),r={x:e.x,y:e.y},o={x:e.x+e.width,y:e.y+e.height};if(t.type==="curved"&&t.controlPoint){let p=t.controlPoint;return {x:(r.x+2*p.x+o.x)/4,y:(r.y+2*p.y+o.y)/4}}if(t.type==="elbow"&&t.points.length>2){let p=t.points,c=Math.floor(p.length/2);return p.length%2===1?p[c]:{x:(p[c-1].x+p[c].x)/2,y:(p[c-1].y+p[c].y)/2}}return {x:(r.x+o.x)/2,y:(r.y+o.y)/2}}function da(e,t,r=12){if(t.length<2)return;if(t.length===2){e.moveTo(t[0].x,t[0].y),e.lineTo(t[1].x,t[1].y);return}e.moveTo(t[0].x,t[0].y);for(let p=1;p<t.length-1;p++){let c=t[p-1],l=t[p],s=t[p+1],n=Math.hypot(l.x-c.x,l.y-c.y),u=Math.hypot(s.x-l.x,s.y-l.y),i=Math.min(r,n/2,u/2);e.arcTo(l.x,l.y,s.x,s.y,i);}let o=t[t.length-1];e.lineTo(o.x,o.y);}var an=new Map;function _t(e,t,r,o=1){if(t==="solid"||!t)return r;if(t==="transparent"||r==="transparent")return "transparent";let p=`${t}-${r}-${Math.round(o*10)/10}`;if(an.has(p)){let i=an.get(p);if(i)return i}if(typeof document>"u")return r;let l=t==="dots"?Math.max(8,Math.round(10*o)):Math.max(10,Math.round(14*o)),s=document.createElement("canvas");s.width=l,s.height=l;let n=s.getContext("2d");if(!n)return r;if(n.strokeStyle=r,n.fillStyle=r,n.lineWidth=Math.max(1.2,1.8*o),n.lineCap="round",t==="hachure")n.beginPath(),n.moveTo(0,l),n.lineTo(l,0),n.moveTo(-l/2,l/2),n.lineTo(l/2,-l/2),n.moveTo(l/2,l*1.5),n.lineTo(l*1.5,l/2),n.stroke();else if(t==="hachure-right")n.beginPath(),n.moveTo(0,0),n.lineTo(l,l),n.moveTo(l/2,-l/2),n.lineTo(l*1.5,l/2),n.moveTo(-l/2,l/2),n.lineTo(l/2,l*1.5),n.stroke();else if(t==="cross-hatch")n.beginPath(),n.moveTo(0,l),n.lineTo(l,0),n.moveTo(-l/2,l/2),n.lineTo(l/2,-l/2),n.moveTo(l/2,l*1.5),n.lineTo(l*1.5,l/2),n.moveTo(0,0),n.lineTo(l,l),n.moveTo(l/2,-l/2),n.lineTo(l*1.5,l/2),n.moveTo(-l/2,l/2),n.lineTo(l/2,l*1.5),n.stroke();else if(t==="dots"){let i=Math.max(.8,1.3*o);n.beginPath(),n.arc(l/2,l/2,i,0,Math.PI*2),n.fill();}let u=e.createPattern(s,"repeat");return u?(an.set(p,u),u):r}function ir(e){let t=0;for(let r=0;r<e.length;r++)t=(t<<5)-t+e.charCodeAt(r),t|=0;return Math.abs(t)||12345}var Xt=class{state;constructor(t){this.state=t%2147483647,this.state<=0&&(this.state+=2147483646);}next(){return this.state=this.state*16807%2147483647,(this.state-1)/2147483646}offset(t){return (this.next()*2-1)*t}};function Sr(e,t,r,o,p,c,l={}){let s=l.roughness??1.5,n=l.bowing??1.8,u=l.overshoot??2.8,i=o-t,d=p-r,h=Math.hypot(i,d);if(h<1)return;let a=-d/h,x=i/h,b=c.offset(n*Math.min(6,s*1.4)),k=(t+o)/2+a*b,y=(r+p)/2+x*b,_=c.offset(u*s*.9),S=t-i/h*_,P=r-d/h*_,R=o+i/h*_,I=p+d/h*_;e.beginPath(),e.moveTo(S+c.offset(.8*s),P+c.offset(.8*s)),e.quadraticCurveTo(k,y,R+c.offset(.8*s),I+c.offset(.8*s)),e.stroke();let z=c.offset(n*Math.min(6,s*1.1)),$=(t+o)/2+a*z,w=(r+p)/2+x*z,f=c.offset(u*s*.7),v=t-i/h*f,C=r-d/h*f,T=o+i/h*f,W=p+d/h*f;e.beginPath(),e.moveTo(v+c.offset(1*s),C+c.offset(1*s)),e.quadraticCurveTo($,w,T+c.offset(1*s),W+c.offset(1*s)),e.stroke();}function Cr(e,t,r,o=1.2){if(t.length<3)return;e.beginPath();let p=t[0];e.moveTo(p.x+r.offset(.8*o),p.y+r.offset(.8*o));for(let c=0;c<t.length;c++){let l=t[c],s=t[(c+1)%t.length],n=(l.x+s.x)/2+r.offset(1.2*o),u=(l.y+s.y)/2+r.offset(1.2*o),i=s.x+r.offset(.8*o),d=s.y+r.offset(.8*o);e.quadraticCurveTo(n,u,i,d);}e.closePath();}function $r(e,t,r,o={}){for(let p=0;p<t.length;p++){let c=t[p],l=t[(p+1)%t.length];Sr(e,c.x,c.y,l.x,l.y,r,o);}}function ca(e,t,r,o,p,c,l=false,s=true,n={}){let u=new Xt(ir(c)),i=n.roughness??1.2,d=[{x:t,y:r},{x:t+o,y:r},{x:t+o,y:r+p},{x:t,y:r+p}];l&&(Cr(e,d,u,i),e.fill()),s&&$r(e,d,u,n);}function pa(e,t,r,o,p,c,l,s=false,n=true,u={}){let i=new Xt(ir(l)),d=u.roughness??1.2,h=Math.min(c,Math.abs(o)/2,Math.abs(p)/2),a={x:t+h,y:r},x={x:t+o-h,y:r},b={x:t+o,y:r+h},k={x:t+o,y:r+p-h},y={x:t+o-h,y:r+p},_={x:t+h,y:r+p},S={x:t,y:r+p-h},P={x:t,y:r+h};if(s&&(e.beginPath(),e.moveTo(a.x,a.y),e.lineTo(x.x,x.y),e.arcTo(t+o,r,t+o,r+h,h),e.lineTo(k.x,k.y),e.arcTo(t+o,r+p,t+o-h,r+p,h),e.lineTo(_.x,_.y),e.arcTo(t,r+p,t,r+p-h,h),e.lineTo(P.x,P.y),e.arcTo(t,r,t+h,r,h),e.closePath(),e.fill()),n){Sr(e,a.x,a.y,x.x,x.y,i,u),Sr(e,b.x,b.y,k.x,k.y,i,u),Sr(e,y.x,y.y,_.x,_.y,i,u),Sr(e,S.x,S.y,P.x,P.y,i,u);let R=[{cx:t+o-h,cy:r+h,sa:-Math.PI/2,ea:0},{cx:t+o-h,cy:r+p-h,sa:0,ea:Math.PI/2},{cx:t+h,cy:r+p-h,sa:Math.PI/2,ea:Math.PI},{cx:t+h,cy:r+h,sa:Math.PI,ea:Math.PI*3/2}];for(let I of R)for(let z=0;z<2;z++){e.beginPath();let $=i.offset(.8*d);e.arc(I.cx,I.cy,Math.max(1,h+$),I.sa,I.ea),e.stroke();}}}function Io(e,t,r,o,p,c,l=false,s=true,n={}){let u=new Xt(ir(c)),i=n.roughness??1.2;if(l){e.beginPath();let d=8;for(let h=0;h<d;h++){let a=h/d*Math.PI*2,x=1+u.offset(.04*i),b=t+Math.cos(a)*o*x,k=r+Math.sin(a)*p*x;h===0?e.moveTo(b,k):e.lineTo(b,k);}e.closePath(),e.fill();}if(s){e.beginPath();let d=12;for(let x=0;x<=d+1;x++){let b=x/d*Math.PI*2,k=u.offset(1.2*i),y=u.offset(1.2*i),_=t+Math.cos(b)*(o+k),S=r+Math.sin(b)*(p+y);x===0?e.moveTo(_,S):e.lineTo(_,S);}e.stroke(),e.beginPath();let h=10,a=u.offset(.3);for(let x=0;x<=h+1;x++){let b=a+x/h*Math.PI*2,k=u.offset(1*i),y=u.offset(1*i),_=t+Math.cos(b)*(o+k),S=r+Math.sin(b)*(p+y);x===0?e.moveTo(_,S):e.lineTo(_,S);}e.stroke();}}var ua=new Map;function Fr(e,t,r){let o=[],p=t.split(`
|
|
2
|
+
`);for(let c of p){if(!c){o.push("");continue}let l=c.split(" "),s="";for(let n=0;n<l.length;n++){let u=l[n];if(e.measureText(u).width>r){s&&(o.push(s),s="");let h="";for(let a of u)e.measureText(h+a).width>r&&h?(o.push(h),h=a):h+=a;s=h;continue}let i=s?`${s} ${u}`:u;e.measureText(i).width>r&&s?(o.push(s),s=u):s=i;}s&&o.push(s);}return o}function zr(e){let t=Math.max(1,e.rows||3),r=Math.max(1,e.cols||3),o=Math.max(60,Math.abs(e.width)),p=Math.max(40,Math.abs(e.height)),c=e.colWidths&&e.colWidths.length===r?[...e.colWidths]:Array.from({length:r},()=>o/r),l=e.rowHeights&&e.rowHeights.length===t?[...e.rowHeights]:Array.from({length:t},()=>p/t);c=c.map(x=>Math.max(30,isNaN(x)||x<=0?o/r:x)),l=l.map(x=>Math.max(22,isNaN(x)||x<=0?p/t:x));let s=[0];for(let x=0;x<r;x++)s.push(s[x]+c[x]);let n=[0];for(let x=0;x<t;x++)n.push(n[x]+l[x]);let u=s[r],i=n[t],d=Math.min(e.x,e.x+e.width),h=Math.min(e.y,e.y+e.height);return {rows:t,cols:r,colWidths:c,rowHeights:l,colOffsets:s,rowOffsets:n,totalWidth:u,totalHeight:i,getCellBounds:(x,b)=>{let k=Math.max(0,Math.min(t-1,x)),y=Math.max(0,Math.min(r-1,b));return {x:d+s[y],y:h+n[k],width:c[y],height:l[k]}}}}function Ao(e){let{x:t,y:r,width:o,height:p}=e,c=Math.abs(o),l=Math.abs(p),s=t+o/2,n=r+p/2;switch(e.type){case "table":{let u=zr(e),i=e.editingCell?e.editingCell.row:0,d=e.editingCell?e.editingCell.col:0,h=u.getCellBounds(i,d),a=6,x=4,b=Math.max(16,h.width-a*2),k=Math.max(16,h.height-x*2);return {boxX:h.x+a,boxY:h.y+x,boxW:b,boxH:k,centerX:h.x+h.width/2,centerY:h.y+h.height/2}}case "rectangle":{let u=(e.edgeStyle||"round")==="round",i=u?Math.max(12,c*.08):8,d=u?Math.max(10,l*.08):6,h=Math.max(16,c-i*2),a=Math.max(16,l-d*2);return {boxX:t+i,boxY:r+d,boxW:h,boxH:a,centerX:s,centerY:n}}case "sticky":{let h=Math.max(16,c-28),a=Math.max(16,l-34);return {boxX:t+14,boxY:r+20,boxW:h,boxH:a,centerX:s,centerY:r+20+a/2}}case "ellipse":{let u=Math.max(16,c*.68),i=Math.max(16,l*.68);return {boxX:s-u/2,boxY:n-i/2,boxW:u,boxH:i,centerX:s,centerY:n}}case "diamond":{let u=Math.max(16,c*.48),i=Math.max(16,l*.48);return {boxX:s-u/2,boxY:n-i/2,boxW:u,boxH:i,centerX:s,centerY:n}}case "triangle":{let u=Math.max(16,c*.5),i=Math.max(16,l*.42),d=r+l*.62;return {boxX:s-u/2,boxY:d-i/2,boxW:u,boxH:i,centerX:s,centerY:d}}case "capsule":{let u=Math.min(c,l),i=c>=l,d=Math.max(16,i?c-u*.72:c-16),h=Math.max(16,i?l-16:l-u*.72);return {boxX:s-d/2,boxY:n-h/2,boxW:d,boxH:h,centerX:s,centerY:n}}case "trapezoid":{let u=Math.min(c*.2,40),i=Math.max(16,c-u*2.2),d=Math.max(16,l-18);return {boxX:s-i/2,boxY:n-d/2+2,boxW:i,boxH:d,centerX:s,centerY:n+2}}case "hexagon":{let u=Math.min(c*.22,45),i=Math.max(16,c-u*2.1),d=Math.max(16,l-16);return {boxX:s-i/2,boxY:n-d/2,boxW:i,boxH:d,centerX:s,centerY:n}}case "parallelogram":{let u=Math.min(36,c*.22),i=Math.max(16,c-u*2.2),d=Math.max(16,l-16);return {boxX:s-i/2,boxY:n-d/2,boxW:i,boxH:d,centerX:s,centerY:n}}case "cylinder":{let u=Math.min(24,l*.2),i=Math.max(16,c-20),d=Math.max(16,l-u*2.4),h=n+u*.4;return {boxX:s-i/2,boxY:h-d/2,boxW:i,boxH:d,centerX:s,centerY:h}}case "cloud":{let u=Math.max(16,c*.6),i=Math.max(16,l*.5);return {boxX:s-u/2,boxY:n-i/2,boxW:u,boxH:i,centerX:s,centerY:n}}case "star":{let u=Math.max(16,c*.4),i=Math.max(16,l*.4);return {boxX:s-u/2,boxY:n-i/2,boxW:u,boxH:i,centerX:s,centerY:n}}default:return {boxX:t+4,boxY:r+2,boxW:Math.max(16,c-8),boxH:Math.max(16,l-4),centerX:s,centerY:n}}}function Lo(e,t,r,o,p,c=0){if(e.beginPath(),c>0)if(typeof e.roundRect=="function")e.roundRect(t,r,o,p,c);else {let l=Math.min(c,Math.abs(o)/2,Math.abs(p)/2);e.moveTo(t+l,r),e.arcTo(t+o,r,t+o,r+p,l),e.arcTo(t+o,r+p,t,r+p,l),e.arcTo(t,r+p,t,r,l),e.arcTo(t,r,t+o,r,l),e.closePath();}else e.rect(t,r,o,p);}function qr(e,t=22,r){if(typeof window>"u"||!e)return {width:140,height:36};let o=qt(r),p=o.value==="patrick",c=o.value==="comic"||o.value==="handlee",l=o.value==="fuzzy"||o.value==="edusa",s=p||c||l?"400":"500",u=document.createElement("canvas").getContext("2d");if(!u){let a=e.split(`
|
|
3
|
+
`);return {width:Math.max(60,e.length*12),height:Math.max(36,a.length*28)}}u.font=`normal ${s} ${t}px ${o.cssFont}`;let i=t*1.35,d=e.split(`
|
|
4
|
+
`),h=0;for(let a of d){let x=u.measureText(a||" ").width;x>h&&(h=x);}return {width:Math.max(60,Math.ceil(h+16)),height:Math.max(Math.ceil(i),Math.ceil(d.length*i))}}function Zt(e,t,r=1,o=false,p=false){if(!t.text||o)return;let{x:c,y:l,width:s,height:n}=t,u=Math.abs(s),i=Math.abs(n),d=c+s/2,h=l+n/2,a=qt(t.fontFamily),x=Ao(t),b=t.type==="text"?1/0:x.boxW*r,k=t.type==="text"?1/0:x.boxH*r,y=(t.fontSize||(t.type==="sticky"?20:22))*r,_=8*r,S=a.value==="fuzzy"||a.value==="edusa",P=a.value==="patrick"||a.value==="comic"||a.value==="handlee"?"400":S?t.type==="sticky"||t.type!=="text"?"700":"400":t.type==="sticky"||t.type!=="text"?"600":"500";e.font=`normal ${P} ${y}px ${a.cssFont}`;let R=t.type==="text"?t.text.split(`
|
|
5
|
+
`):Fr(e,t.text,b),I=y*1.35;if(t.type!=="text")for(;(R.length*I>k||R.some(C=>e.measureText(C).width>b))&&y>_;)y-=.75*r,e.font=`normal ${P} ${y}px ${a.cssFont}`,R=Fr(e,t.text,b),I=y*1.35;let z=R.length*I,$=(I-y)/2,w=t.type==="text"?(l+Math.max(0,(n-z/r)/2))*r+$:x.centerY*r-z/2+$,f=t.textAlign||(t.type==="text"?"left":"center");e.textAlign=f,e.textBaseline="top";let v=f==="center"?t.type==="text"?(c+s/2)*r:x.centerX*r:f==="right"?t.type==="text"?(c+s-4)*r:(x.boxX+x.boxW)*r-4*r:t.type==="text"?(c+4)*r:x.boxX*r+4*r;if(t.type==="sticky"){let C=vr(t.stickyColor||t.fillColor,p);e.fillStyle=t.strokeColor&&t.strokeColor!=="transparent"?vt(t.strokeColor,p):C.text;}else e.fillStyle=vt(t.strokeColor||"#1e1e24",p);if(t.type!=="text"){if(e.save(),e.beginPath(),t.type==="rectangle"||t.type==="sticky"){let C=t.type==="sticky",T=(t.edgeStyle||"round")==="round"||C,W=C?Math.min(22*r,u*.16,i*.16):T?Math.min(16*r,u*.2,i*.2):0;W>0&&typeof e.roundRect=="function"?e.roundRect(c+2,l+2,s-4,n-4,W):e.rect(c+2,l+2,s-4,n-4);}else if(t.type==="ellipse")e.ellipse(d,h,Math.max(1,u/2-2),Math.max(1,i/2-2),0,0,Math.PI*2);else if(t.type==="diamond")e.moveTo(d,l+2),e.lineTo(c+s-2,h),e.lineTo(d,l+n-2),e.lineTo(c+2,h),e.closePath();else if(t.type==="triangle")e.moveTo(d,l+2),e.lineTo(c+s-2,l+n-2),e.lineTo(c+2,l+n-2),e.closePath();else if(t.type==="capsule"){let C=Math.min(u,i)/2-2;u>=i?(e.arc(c+C+2,l+C+2,C,Math.PI/2,Math.PI*3/2),e.lineTo(c+s-C-2,l+2),e.arc(c+s-C-2,l+C+2,C,Math.PI*3/2,Math.PI/2),e.lineTo(c+C+2,l+n-2)):(e.arc(c+C+2,l+C+2,C,Math.PI,0),e.lineTo(c+s-2,l+n-C-2),e.arc(c+C+2,l+n-C-2,C,0,Math.PI),e.lineTo(c+2,l+C+2)),e.closePath();}else if(t.type==="trapezoid"){let C=Math.min(u*.2,40*r);e.moveTo(c+C+2,l+2),e.lineTo(c+s-C-2,l+2),e.lineTo(c+s-2,l+n-2),e.lineTo(c+2,l+n-2),e.closePath();}else if(t.type==="hexagon"){let C=Math.min(u*.22,45*r);e.moveTo(c+C+2,l+2),e.lineTo(c+s-C-2,l+2),e.lineTo(c+s-2,h),e.lineTo(c+s-C-2,l+n-2),e.lineTo(c+C+2,l+n-2),e.lineTo(c+2,h),e.closePath();}else if(t.type==="parallelogram"){let C=Math.min(36*r,u*.22);e.moveTo(c+C+2,l+2),e.lineTo(c+s-2,l+2),e.lineTo(c+s-C-2,l+n-2),e.lineTo(c+2,l+n-2),e.closePath();}else if(t.type==="cylinder"){let C=Math.abs(s/2)-2,T=Math.min(24*r,i*.2);e.ellipse(d,l+T,C,T,0,Math.PI,0),e.lineTo(c+s-2,l+n-T),e.ellipse(d,l+n-T,C,T,0,0,Math.PI),e.lineTo(c+2,l+T),e.closePath();}else e.rect(c+2,l+2,s-4,n-4);e.clip();}R.forEach((C,T)=>{e.fillText(C,v,w+T*I);}),t.type!=="text"&&e.restore();}function ha(e,t,r,o,p,c,l,s=1,n=false){if(!p||p==="none")return;let u=p===true?"arrow":p;e.save(),e.translate(t,r),e.rotate(o),e.strokeStyle=c,e.fillStyle=c,e.lineWidth=Math.max(1,l*s),e.lineCap="round",e.lineJoin="round";let i=Math.max(1.5,l*s);switch(u){case "arrow":{let d=Math.max(12*s,i*4.5),h=d*.55;e.beginPath(),e.moveTo(-d,-h),e.lineTo(0,0),e.lineTo(-d,h),e.stroke();break}case "triangle":{let d=Math.max(14*s,i*4.8),h=d*.55;e.beginPath(),e.moveTo(0,0),e.lineTo(-d,-h),e.lineTo(-d,h),e.closePath(),e.fill(),e.stroke();break}case "barbed":{let d=Math.max(16*s,i*5.2),h=d*.55,a=d*.35;e.beginPath(),e.moveTo(0,0),e.lineTo(-d,-h),e.lineTo(-d+a,0),e.lineTo(-d,h),e.closePath(),e.fill(),e.stroke();break}case "dot":{let d=Math.max(4.5*s,i*1.8);e.beginPath(),e.arc(-d,0,d,0,Math.PI*2),e.fill();break}case "circle":{let d=Math.max(4.5*s,i*1.8);e.beginPath(),e.arc(-d,0,d,0,Math.PI*2),e.fillStyle=n?"#181818":"#ffffff",e.fill(),e.stroke();break}case "diamond":{let d=Math.max(13*s,i*4.2),h=d*.5;e.beginPath(),e.moveTo(0,0),e.lineTo(-d/2,-h),e.lineTo(-d,0),e.lineTo(-d/2,h),e.closePath(),e.fill(),e.stroke();break}case "diamond_outline":{let d=Math.max(13*s,i*4.2),h=d*.5;e.beginPath(),e.moveTo(0,0),e.lineTo(-d/2,-h),e.lineTo(-d,0),e.lineTo(-d/2,h),e.closePath(),e.fillStyle=n?"#181818":"#ffffff",e.fill(),e.stroke();break}case "bar":case "crowfoot_one":{let d=Math.max(12*s,i*4.5);e.beginPath(),e.moveTo(0,-d/2),e.lineTo(0,d/2),e.stroke();break}case "crowfoot_many":{let d=Math.max(12*s,i*4),h=d*.7;e.beginPath(),e.moveTo(-d,-h),e.lineTo(0,0),e.lineTo(-d,h),e.moveTo(-d,0),e.lineTo(0,0),e.stroke();break}case "crowfoot_one_many":{let d=Math.max(14*s,i*4.5),h=d*.65;e.beginPath(),e.moveTo(-d,-h),e.lineTo(0,0),e.lineTo(-d,h),e.moveTo(-d,0),e.lineTo(0,0),e.moveTo(-d*.45,-h),e.lineTo(-d*.45,h),e.stroke();break}case "crowfoot_strictly_one":{let d=Math.max(12*s,i*4.5),h=Math.max(5*s,i*2);e.beginPath(),e.moveTo(0,-d/2),e.lineTo(0,d/2),e.moveTo(-h,-d/2),e.lineTo(-h,d/2),e.stroke();break}case "crowfoot_zero_one":{let d=Math.max(12*s,i*4.5),h=Math.max(4*s,i*1.5);e.beginPath(),e.arc(-h*2-2*s,0,h,0,Math.PI*2),e.fillStyle=n?"#181818":"#ffffff",e.fill(),e.stroke(),e.beginPath(),e.moveTo(0,-d/2),e.lineTo(0,d/2),e.stroke();break}case "crowfoot_zero_many":{let d=Math.max(12*s,i*4),h=d*.65,a=Math.max(4*s,i*1.5);e.beginPath(),e.moveTo(-d,-h),e.lineTo(0,0),e.lineTo(-d,h),e.moveTo(-d,0),e.lineTo(0,0),e.stroke(),e.beginPath(),e.arc(-d-a-2*s,0,a,0,Math.PI*2),e.fillStyle=n?"#181818":"#ffffff",e.fill(),e.stroke();break}}e.restore();}function Hr(e,t,r=1,o=false,p=false,c=false){e.save(),e.globalAlpha=t.opacity??1;let l=t.x+t.width/2,s=t.y+t.height/2;t.rotation&&(e.translate(l,s),e.rotate(t.rotation),e.translate(-l,-s)),c&&t.type!=="frame"?(e.shadowColor=p?"rgba(0, 0, 0, 0.45)":"rgba(15, 23, 42, 0.08)",e.shadowBlur=Math.round((p?12:10)*r),e.shadowOffsetX=0,e.shadowOffsetY=Math.round((p?4:3)*r)):e.shadowColor="transparent";let n=vt(t.strokeColor,p),u=_r(t.fillColor,t.fillStyle,p);e.strokeStyle=n,e.lineWidth=Math.max(1,t.strokeWidth*r),e.lineCap="round",e.lineJoin="round",t.strokeStyle==="dashed"?e.setLineDash([Math.max(6,t.strokeWidth*2.5*r),Math.max(4,t.strokeWidth*1.8*r)]):t.strokeStyle==="dotted"?e.setLineDash([Math.max(1.5,t.strokeWidth*.8*r),Math.max(4,t.strokeWidth*1.8*r)]):e.setLineDash([]);let{x:i,y:d,width:h,height:a}=t,x=t.roughStyle==="rough"||t.roughness!==void 0&&t.roughness>0,b={roughness:t.roughness||1.2};switch(t.type){case "rectangle":{let y=(t.edgeStyle||"round")==="round"?Math.min(16,Math.min(Math.abs(h),Math.abs(a))*.25):0;u&&u!=="transparent"&&(e.fillStyle=_t(e,t.fillStyle||"solid",u,r)),x?y>0?pa(e,i,d,h,a,y,t.id,!!(u&&u!=="transparent"),t.strokeWidth>0&&n!=="transparent",b):ca(e,i,d,h,a,t.id,!!(u&&u!=="transparent"),t.strokeWidth>0&&n!=="transparent",b):(u&&u!=="transparent"&&(y>0?(Lo(e,i,d,h,a,y),e.fill()):e.fillRect(i,d,h,a)),t.strokeWidth>0&&n!=="transparent"&&(y>0?(Lo(e,i,d,h,a,y),e.stroke()):e.strokeRect(i,d,h,a))),Zt(e,t,r,o,p);break}case "ellipse":{let k=Math.abs(h/2),y=Math.abs(a/2);u&&u!=="transparent"&&(e.fillStyle=_t(e,t.fillStyle||"solid",u,r)),x?Io(e,l,s,k,y,t.id,!!(u&&u!=="transparent"),t.strokeWidth>0&&n!=="transparent",b):(e.beginPath(),e.ellipse(l,s,k,y,0,0,Math.PI*2),u&&u!=="transparent"&&e.fill(),t.strokeWidth>0&&n!=="transparent"&&e.stroke()),Zt(e,t,r,o,p);break}case "diamond":{if(x){let k=new Xt(ir(t.id)),y=[{x:l,y:d},{x:i+h,y:s},{x:l,y:d+a},{x:i,y:s}];u&&u!=="transparent"&&(Cr(e,y,k,b.roughness),e.fillStyle=_t(e,t.fillStyle||"solid",u,r),e.fill()),t.strokeWidth>0&&n!=="transparent"&&$r(e,y,k,b);}else e.beginPath(),e.moveTo(l,d),e.lineTo(i+h,s),e.lineTo(l,d+a),e.lineTo(i,s),e.closePath(),u&&u!=="transparent"&&(e.fillStyle=_t(e,t.fillStyle||"solid",u,r),e.fill()),t.strokeWidth>0&&n!=="transparent"&&e.stroke();Zt(e,t,r,o,p);break}case "table":{let k=zr(t),_=(t.edgeStyle||"round")==="round"?Math.min(10,Math.min(k.totalWidth,k.totalHeight)*.05):0;Lo(e,i,d,k.totalWidth,k.totalHeight,_);let S=u&&u!=="transparent"?u:p?"rgba(24, 24, 28, 0.95)":"rgba(255, 255, 255, 0.95)";e.fillStyle=S,e.fill();let P=t.cells||{},R=t.hasHeaderRow??true,I=t.hasHeaderCol??false;for(let C=0;C<k.rows;C++)for(let T=0;T<k.cols;T++){let W=`${C}_${T}`,le=P[W],L=k.getCellBounds(C,T),A=null;le?.fill?A=le.fill:t.tableStyle==="swot"?C===0&&T===0?A=p?"rgba(16, 185, 129, 0.18)":"rgba(16, 185, 129, 0.12)":C===0&&T===1?A=p?"rgba(245, 158, 11, 0.18)":"rgba(245, 158, 11, 0.12)":C===1&&T===0?A=p?"rgba(59, 130, 246, 0.18)":"rgba(59, 130, 246, 0.12)":C===1&&T===1&&(A=p?"rgba(239, 68, 68, 0.18)":"rgba(239, 68, 68, 0.12)"):t.tableStyle==="kanban"&&C===0?T===0?A=p?"rgba(107, 114, 128, 0.22)":"rgba(107, 114, 128, 0.12)":T===1?A=p?"rgba(99, 102, 241, 0.22)":"rgba(99, 102, 241, 0.12)":T===2&&(A=p?"rgba(16, 185, 129, 0.22)":"rgba(16, 185, 129, 0.12)"):R&&C===0?A=p?"rgba(99, 102, 241, 0.22)":"rgba(99, 102, 241, 0.10)":I&&T===0?A=p?"rgba(99, 102, 241, 0.14)":"rgba(99, 102, 241, 0.06)":t.tableStyle==="zebra"&&C%2===1&&(A=p?"rgba(255, 255, 255, 0.03)":"rgba(0, 0, 0, 0.025)"),A&&(e.fillStyle=A,e.fillRect(L.x,L.y,L.width,L.height));}let z=Math.max(1,t.strokeWidth||1.5),$=n;e.strokeStyle=$,e.lineWidth=z;for(let C=1;C<k.cols;C++){let T=i+k.colOffsets[C];e.beginPath(),e.moveTo(T,d),e.lineTo(T,d+k.totalHeight),e.stroke();}for(let C=1;C<k.rows;C++){let T=d+k.rowOffsets[C];e.beginPath(),e.moveTo(i,T),e.lineTo(i+k.totalWidth,T),e.stroke();}t.strokeWidth>0&&n!=="transparent"&&(Lo(e,i,d,k.totalWidth,k.totalHeight,_),e.stroke());let w=Math.max(10,t.fontSize||13),f=qt(t.fontFamily),v=f.cssFont;for(let C=0;C<k.rows;C++)for(let T=0;T<k.cols;T++){if(o&&t.editingCell&&t.editingCell.row===C&&t.editingCell.col===T)continue;let le=`${C}_${T}`,L=P[le],A=L?.text??"";if(!A)continue;let F=k.getCellBounds(C,T),Z=R&&C===0||I&&T===0||L?.bold,be=L?.align||(Z?"center":"left");e.save(),e.beginPath(),e.rect(F.x+2,F.y+2,F.width-4,F.height-4),e.clip();let U=f.value==="fuzzy"||f.value==="edusa",E=f.value==="patrick"||f.value==="comic"||f.value==="handlee"?"400":U?Z?"700":"400":Z?"600":"400";e.font=`${E} ${w}px ${v}`,e.fillStyle=L?.color||(Z&&R&&C===0?p?"#ffffff":"#1e1b4b":n),e.textBaseline="middle";let ee=Fr(e,A,F.width-16),te=w*1.35,ie=ee.length*te,Se=F.y+(F.height-ie)/2+te/2;ee.forEach((Ke,X)=>{let Oe=Se+X*te,je=F.x+8;be==="center"?(e.textAlign="center",je=F.x+F.width/2):be==="right"?(e.textAlign="right",je=F.x+F.width-8):(e.textAlign="left",je=F.x+8),e.fillText(Ke,je,Oe);}),e.restore();}break}case "cylinder":{let k=Math.abs(h/2),y=Math.min(24*r,Math.abs(a)*.2),_=d+y,S=d+a-y;if(x){let P=new Xt(ir(t.id)),R=[{x:i,y:_},{x:i+h,y:_},{x:i+h,y:S},{x:i,y:S}];u&&u!=="transparent"&&(Cr(e,R,P,b.roughness),e.fillStyle=_t(e,t.fillStyle||"solid",u,r),e.fill()),t.strokeWidth>0&&n!=="transparent"&&(Sr(e,i,_,i,S,P,b),Sr(e,i+h,_,i+h,S,P,b),Io(e,l,S,k,y,t.id+"_b",false,true,b)),u&&u!=="transparent"&&(e.fillStyle=_t(e,t.fillStyle||"solid",u,r)),Io(e,l,_,k,y,t.id+"_t",!!(u&&u!=="transparent"),t.strokeWidth>0&&n!=="transparent",b);}else e.beginPath(),e.ellipse(l,_,k,y,0,Math.PI,0),e.lineTo(i+h,S),e.ellipse(l,S,k,y,0,0,Math.PI),e.lineTo(i,_),e.closePath(),u&&u!=="transparent"&&(e.fillStyle=_t(e,t.fillStyle||"solid",u,r),e.fill()),t.strokeWidth>0&&n!=="transparent"&&(e.beginPath(),e.moveTo(i,_),e.lineTo(i,S),e.ellipse(l,S,k,y,0,Math.PI,0,true),e.lineTo(i+h,_),e.stroke()),e.beginPath(),e.ellipse(l,_,k,y,0,0,Math.PI*2),u&&u!=="transparent"&&(e.fillStyle=_t(e,t.fillStyle||"solid",u,r),e.fill()),t.strokeWidth>0&&n!=="transparent"&&e.stroke();Zt(e,t,r,o,p);break}case "parallelogram":{let k=Math.min(36*r,Math.abs(h)*.22),y=[{x:i+k,y:d},{x:i+h,y:d},{x:i+h-k,y:d+a},{x:i,y:d+a}];if(x){let _=new Xt(ir(t.id));u&&u!=="transparent"&&(Cr(e,y,_,b.roughness),e.fillStyle=_t(e,t.fillStyle||"solid",u,r),e.fill()),t.strokeWidth>0&&n!=="transparent"&&$r(e,y,_,b);}else e.beginPath(),e.moveTo(y[0].x,y[0].y),e.lineTo(y[1].x,y[1].y),e.lineTo(y[2].x,y[2].y),e.lineTo(y[3].x,y[3].y),e.closePath(),u&&u!=="transparent"&&(e.fillStyle=_t(e,t.fillStyle||"solid",u,r),e.fill()),t.strokeWidth>0&&n!=="transparent"&&e.stroke();Zt(e,t,r,o,p);break}case "cloud":{let k=Math.abs(h),y=Math.abs(a);e.beginPath(),e.moveTo(i+k*.2,d+y*.7),e.bezierCurveTo(i+k*.1,d+y*.85,i+k*.35,d+y*.95,i+k*.5,d+y*.85),e.bezierCurveTo(i+k*.65,d+y*.95,i+k*.9,d+y*.85,i+k*.85,d+y*.65),e.bezierCurveTo(i+k*1.02,d+y*.5,i+k*.98,d+y*.25,i+k*.8,d+y*.25),e.bezierCurveTo(i+k*.78,d+y*.05,i+k*.52,d+y*.05,i+k*.45,d+y*.2),e.bezierCurveTo(i+k*.35,d+y*.08,i+k*.12,d+y*.15,i+k*.15,d+y*.4),e.bezierCurveTo(i-k*.02,d+y*.45,i-k*.01,d+y*.68,i+k*.2,d+y*.7),e.closePath(),u&&u!=="transparent"&&(e.fillStyle=_t(e,t.fillStyle||"solid",u,r),e.fill()),t.strokeWidth>0&&n!=="transparent"&&(e.stroke(),x&&e.stroke()),Zt(e,t,r,o,p);break}case "star":{let y=Math.min(Math.abs(h),Math.abs(a))/2,_=y*.45,S=Math.PI/2*3,P=Math.PI/5,R=[];for(let I=0;I<5;I++)R.push({x:l+Math.cos(S)*y,y:s+Math.sin(S)*y}),S+=P,R.push({x:l+Math.cos(S)*_,y:s+Math.sin(S)*_}),S+=P;if(x){let I=new Xt(ir(t.id));u&&u!=="transparent"&&(Cr(e,R,I,b.roughness),e.fillStyle=_t(e,t.fillStyle||"solid",u,r),e.fill()),t.strokeWidth>0&&n!=="transparent"&&$r(e,R,I,b);}else {e.beginPath(),e.moveTo(R[0].x,R[0].y);for(let I=1;I<R.length;I++)e.lineTo(R[I].x,R[I].y);e.closePath(),u&&u!=="transparent"&&(e.fillStyle=_t(e,t.fillStyle||"solid",u,r),e.fill()),c&&(e.shadowColor="transparent"),t.strokeWidth>0&&n!=="transparent"&&e.stroke();}Zt(e,t,r,o,p);break}case "triangle":{let k=(t.edgeStyle||"round")==="round",y={x:i+h/2,y:d},_={x:i+h,y:d+a},S={x:i,y:d+a},P=[y,_,S];if(x){let R=new Xt(ir(t.id));u&&u!=="transparent"&&(Cr(e,P,R,b.roughness),e.fillStyle=_t(e,t.fillStyle||"solid",u,r),e.fill()),t.strokeWidth>0&&n!=="transparent"&&$r(e,P,R,b);}else {if(e.beginPath(),k){let R=Math.min(12,Math.min(Math.abs(h),Math.abs(a))*.15);e.moveTo((y.x+_.x)/2,(y.y+_.y)/2),e.arcTo(_.x,_.y,S.x,S.y,R),e.arcTo(S.x,S.y,y.x,y.y,R),e.arcTo(y.x,y.y,_.x,_.y,R),e.closePath();}else e.moveTo(y.x,y.y),e.lineTo(_.x,_.y),e.lineTo(S.x,S.y),e.closePath();u&&u!=="transparent"&&(e.fillStyle=_t(e,t.fillStyle||"solid",u,r),e.fill()),c&&(e.shadowColor="transparent"),t.strokeWidth>0&&n!=="transparent"&&e.stroke();}Zt(e,t,r,o,p);break}case "trapezoid":{let k=(t.edgeStyle||"round")==="round",y=Math.min(Math.abs(h)*.2,40*r),_={x:i+y,y:d},S={x:i+h-y,y:d},P={x:i+h,y:d+a},R={x:i,y:d+a},I=[_,S,P,R];if(x){let z=new Xt(ir(t.id));u&&u!=="transparent"&&(Cr(e,I,z,b.roughness),e.fillStyle=_t(e,t.fillStyle||"solid",u,r),e.fill()),t.strokeWidth>0&&n!=="transparent"&&$r(e,I,z,b);}else {if(e.beginPath(),k){let z=Math.min(10,Math.min(Math.abs(h),Math.abs(a))*.15);e.moveTo((_.x+S.x)/2,_.y),e.arcTo(S.x,S.y,P.x,P.y,z),e.arcTo(P.x,P.y,R.x,R.y,z),e.arcTo(R.x,R.y,_.x,_.y,z),e.arcTo(_.x,_.y,S.x,S.y,z),e.closePath();}else e.moveTo(_.x,_.y),e.lineTo(S.x,S.y),e.lineTo(P.x,P.y),e.lineTo(R.x,R.y),e.closePath();u&&u!=="transparent"&&(e.fillStyle=_t(e,t.fillStyle||"solid",u,r),e.fill()),c&&(e.shadowColor="transparent"),t.strokeWidth>0&&n!=="transparent"&&e.stroke();}Zt(e,t,r,o,p);break}case "hexagon":{let k=(t.edgeStyle||"round")==="round",y=Math.min(Math.abs(h)*.22,45*r),_={x:i+y,y:d},S={x:i+h-y,y:d},P={x:i+h,y:d+a/2},R={x:i+h-y,y:d+a},I={x:i+y,y:d+a},z={x:i,y:d+a/2},$=[_,S,P,R,I,z];if(x){let w=new Xt(ir(t.id));u&&u!=="transparent"&&(Cr(e,$,w,b.roughness),e.fillStyle=_t(e,t.fillStyle||"solid",u,r),e.fill()),t.strokeWidth>0&&n!=="transparent"&&$r(e,$,w,b);}else {if(e.beginPath(),k){let w=Math.min(10,Math.min(Math.abs(h),Math.abs(a))*.12);e.moveTo((_.x+S.x)/2,_.y),e.arcTo(S.x,S.y,P.x,P.y,w),e.arcTo(P.x,P.y,R.x,R.y,w),e.arcTo(R.x,R.y,I.x,I.y,w),e.arcTo(I.x,I.y,z.x,z.y,w),e.arcTo(z.x,z.y,_.x,_.y,w),e.arcTo(_.x,_.y,S.x,S.y,w),e.closePath();}else e.moveTo(_.x,_.y),e.lineTo(S.x,S.y),e.lineTo(P.x,P.y),e.lineTo(R.x,R.y),e.lineTo(I.x,I.y),e.lineTo(z.x,z.y),e.closePath();u&&u!=="transparent"&&(e.fillStyle=_t(e,t.fillStyle||"solid",u,r),e.fill()),c&&(e.shadowColor="transparent"),t.strokeWidth>0&&n!=="transparent"&&e.stroke();}Zt(e,t,r,o,p);break}case "capsule":{let k=Math.abs(h),y=Math.abs(a),_=Math.min(k,y)/2;e.beginPath(),k>=y?(e.arc(i+_,d+_,_,Math.PI/2,Math.PI*3/2),e.lineTo(i+h-_,d),e.arc(i+h-_,d+_,_,Math.PI*3/2,Math.PI/2),e.lineTo(i+_,d+a)):(e.arc(i+_,d+_,_,Math.PI,0),e.lineTo(i+h-_,d+a-_),e.arc(i+_,d+a-_,_,0,Math.PI),e.lineTo(i,d+_)),e.closePath(),u&&u!=="transparent"&&(e.fillStyle=_t(e,t.fillStyle||"solid",u,r),e.fill()),c&&(e.shadowColor="transparent"),t.strokeWidth>0&&n!=="transparent"&&(e.stroke(),x&&e.stroke()),Zt(e,t,r,o,p);break}case "arrow":case "line":{let k=Tr(t),y={x:i+h,y:d+a};if(x&&k.type==="straight"){let S=new Xt(ir(t.id));Sr(e,i,d,y.x,y.y,S,b);}else e.beginPath(),k.type==="straight"?(e.moveTo(i,d),e.lineTo(y.x,y.y)):k.type==="curved"&&k.controlPoint?(e.moveTo(i,d),e.quadraticCurveTo(k.controlPoint.x,k.controlPoint.y,y.x,y.y)):k.type==="elbow"&&k.controlPoint1&&k.controlPoint2?(e.moveTo(i,d),e.bezierCurveTo(k.controlPoint1.x,k.controlPoint1.y,k.controlPoint2.x,k.controlPoint2.y,y.x,y.y)):da(e,k.points,Math.max(8,12*r)),e.stroke(),x&&e.stroke();t.startArrowhead&&t.startArrowhead!=="none"&&ha(e,i,d,k.departureAngle+Math.PI,t.startArrowhead,n,t.strokeWidth,r,p);let _=t.endArrowhead!==void 0?t.endArrowhead:t.type==="arrow"?"arrow":"none";_&&_!=="none"&&ha(e,y.x,y.y,k.arrivalAngle,_,n,t.strokeWidth,r,p);break}case "pen":{let k=t.points;if(!k||k.length<2)break;e.beginPath(),e.moveTo(k[0].x,k[0].y);for(let _=1;_<k.length-1;_++){let S=(k[_].x+k[_+1].x)/2,P=(k[_].y+k[_+1].y)/2;e.quadraticCurveTo(k[_].x,k[_].y,S,P);}let y=k[k.length-1];e.lineTo(y.x,y.y),e.stroke();break}case "text":{Zt(e,t,r,o,p);break}case "sticky":{let k=vr(t.stickyColor||t.fillColor,p),y=Math.abs(h),_=Math.abs(a),S=Math.min(22*r,Math.min(y,_)*.16),P=Math.min(13*r,y*.08),R=Math.min(13*r,_*.08);e.fillStyle=k.backSheetBg,e.strokeStyle=k.backSheetBorder,e.lineWidth=1.5*r,e.beginPath(),typeof e.roundRect=="function"?e.roundRect(i+P,d+R,h,a,S):e.rect(i+P,d+R,h,a),e.fill(),e.stroke(),e.save(),e.shadowColor="rgba(0, 0, 0, 0.08)",e.shadowBlur=8*r,e.shadowOffsetX=1*r,e.shadowOffsetY=3*r,e.fillStyle=k.bg,e.beginPath(),typeof e.roundRect=="function"?e.roundRect(i,d,h,a,S):e.rect(i,d,h,a),e.fill(),e.restore(),e.strokeStyle=k.mainBorder,e.lineWidth=1.5*r,e.beginPath(),typeof e.roundRect=="function"?e.roundRect(i,d,h,a,S):e.rect(i,d,h,a),e.stroke(),e.save(),e.strokeStyle=k.sheen,e.lineWidth=1.5*r,e.beginPath();let I=2*r,z=Math.max(2,S-I);typeof e.roundRect=="function"&&e.roundRect(i+I,d+I,h-I*2,a-I*2,z),e.stroke(),e.restore();let $=Math.min(64*r,Math.max(30*r,y*.28)),w=Math.min(18*r,Math.max(10*r,_*.09)),f=i+(h-$)/2,v=d-w*.42,C=4*r;e.save(),e.shadowColor="rgba(0, 0, 0, 0.06)",e.shadowBlur=4*r,e.shadowOffsetY=1*r,e.fillStyle=k.tapeBg,e.beginPath(),typeof e.roundRect=="function"?e.roundRect(f,v,$,w,C):e.rect(f,v,$,w),e.fill(),e.restore(),e.strokeStyle=k.tapeBorder,e.lineWidth=1*r,e.beginPath(),typeof e.roundRect=="function"?e.roundRect(f,v,$,w,C):e.rect(f,v,$,w),e.stroke(),Zt(e,t,r,o,p);break}case "image":{if(t.dataUrl){let k=ua.get(t.dataUrl);if(k||(k=new Image,k.crossOrigin="anonymous",k.onload=()=>{typeof window<"u"&&window.dispatchEvent(new CustomEvent("sketch-redraw-canvas"));},k.src=t.dataUrl,ua.set(t.dataUrl,k)),k.complete&&k.naturalWidth>0)if(t.edgeStyle==="round"){let y=Math.min(10*r,Math.abs(h)/4,Math.abs(a)/4);e.save(),e.beginPath(),typeof e.roundRect=="function"?e.roundRect(i,d,h,a,y):e.rect(i,d,h,a),e.clip(),e.drawImage(k,i,d,h,a),e.restore();}else e.drawImage(k,i,d,h,a);}break}case "frame":{let k=h<0?i+h:i,y=a<0?d+a:d,_=Math.abs(h),S=Math.abs(a);if(t.fillColor&&t.fillColor!=="transparent"?(e.fillStyle=_r(t.fillColor,t.fillStyle||"solid",p),e.fillRect(k,y,_,S)):(e.fillStyle=p?"rgba(255, 255, 255, 0.02)":"rgba(255, 255, 255, 0.85)",e.fillRect(k,y,_,S)),t.strokeColor!=="transparent"){e.save();let P=t.strokeColor&&t.strokeColor!=="transparent"?vt(t.strokeColor,p):p?"#818cf8":"#6366f1";e.strokeStyle=P,e.lineWidth=Math.max(1,(t.strokeWidth||1.5)*r),t.strokeStyle==="dashed"?e.setLineDash([6*r,6*r]):t.strokeStyle==="dotted"?e.setLineDash([2*r,4*r]):e.setLineDash([]),e.strokeRect(k,y,_,S),e.restore();}if(!o){let P=t.frameLabel||"Frame",R=Math.max(11,12*r);e.save(),e.font=`600 ${R}px Inter, -apple-system, sans-serif`;let I=e.measureText(P),z=8*r,$=R+8*r,w=I.width+z*2,f=k+_-w,v=y-$-3*r;e.fillStyle=p?"#27272a":"#e4e4e7",typeof e.roundRect=="function"?(e.beginPath(),e.roundRect(f,v,w,$,4*r),e.fill()):e.fillRect(f,v,w,$),e.fillStyle=p?"#f4f4f5":"#18181b",e.textAlign="left",e.textBaseline="middle",e.fillText(P,f+z,v+$/2),e.restore();}break}}e.restore();}function Ir(e,t,r){let o=Math.cos(r),p=Math.sin(r),c=e.x-t.x,l=e.y-t.y;return {x:t.x+c*o-l*p,y:t.y+c*p+l*o}}function Br(e,t,r){let o=r.x-t.x,p=r.y-t.y,c=o*o+p*p;if(c===0)return Math.hypot(e.x-t.x,e.y-t.y);let l=((e.x-t.x)*o+(e.y-t.y)*p)/c;l=Math.max(0,Math.min(1,l));let s=t.x+l*o,n=t.y+l*p;return Math.hypot(e.x-s,e.y-n)}function it(e){let t=Math.min(e.x,e.x+e.width),r=Math.min(e.y,e.y+e.height),o=Math.abs(e.width),p=Math.abs(e.height);return {x:t,y:r,width:o,height:p}}function $i(e,t,r=8){let o=t.x+t.width/2,p=t.y+t.height/2,c=t.rotation?Ir(e,{x:o,y:p},-t.rotation):e,l=it(t),{x:s,y:n,width:u,height:i}=l;switch(t.type){case "rectangle":case "text":case "image":return c.x>=s-r&&c.x<=s+u+r&&c.y>=n-r&&c.y<=n+i+r;case "frame":{let d=c.x>=s-r&&c.x<=s+u+r&&c.y>=n-r&&c.y<=n+i+r,h=c.x>=s+u-Math.min(u,260)-r&&c.x<=s+u+r&&c.y>=n-32-r&&c.y<=n+r;return d||h}case "sticky":{let d=Math.min(13,u*.08),h=Math.min(13,i*.08),a=Math.min(18,i*.09)*.42;return c.x>=s-r&&c.x<=s+u+d+r&&c.y>=n-a-r&&c.y<=n+i+h+r}case "ellipse":{let d=u/2+r,h=i/2+r;if(d<=0||h<=0)return false;let a=s+u/2,x=n+i/2,b=c.x-a,k=c.y-x;return b*b/(d*d)+k*k/(h*h)<=1}case "diamond":{let d=u/2+r,h=i/2+r;if(d<=0||h<=0)return false;let a=s+u/2,x=n+i/2,b=Math.abs(c.x-a),k=Math.abs(c.y-x);return b/d+k/h<=1}case "cylinder":case "table":return c.x>=s-r&&c.x<=s+u+r&&c.y>=n-r&&c.y<=n+i+r;case "cloud":case "star":case "trapezoid":case "hexagon":case "capsule":return c.x>=s-r&&c.x<=s+u+r&&c.y>=n-r&&c.y<=n+i+r;case "triangle":{if(c.x<s-r||c.x>s+u+r||c.y<n-r||c.y>n+i+r)return false;let d=i===0?0:Math.max(0,Math.min(1,(c.y-n)/i)),h=u/2*d,a=s+u/2-h,x=s+u/2+h;return c.x>=a-r&&c.x<=x+r}case "parallelogram":{if(c.y<n-r||c.y>n+i+r)return false;let d=Math.min(36,u*.22),h=i===0?0:Math.max(0,Math.min(1,(c.y-n)/i)),a=s+d*(1-h),x=s+u-d*h;return c.x>=a-r&&c.x<=x+r}case "line":case "arrow":{let d=Tr(t),h=Math.max(r,(t.strokeWidth||2)+4);if(d.type==="straight")return Br(c,d.points[0],d.points[1])<=h;if(d.type==="curved"&&d.controlPoint){let a={x:(d.points[0].x+d.controlPoint.x*2+d.points[1].x)/4,y:(d.points[0].y+d.controlPoint.y*2+d.points[1].y)/4};return Br(c,d.points[0],a)<=h||Br(c,a,d.points[1])<=h}if(d.type==="elbow"&&d.controlPoint1&&d.controlPoint2){let a=d.points[0],x=d.points[1],b=d.controlPoint1,k=d.controlPoint2;return Br(c,a,b)<=h||Br(c,b,k)<=h||Br(c,k,x)<=h}for(let a=0;a<d.points.length-1;a++){let x=d.points[a],b=d.points[a+1];if(Br(c,x,b)<=h)return true}return false}case "pen":{if(!t.points||t.points.length<2)return false;let d=Math.max(r,(t.strokeWidth||2)+4);for(let h=0;h<t.points.length-1;h++){let a=t.points[h],x=t.points[h+1];if(Br(c,a,x)<=d)return true}return false}default:return false}}function po(e){if(e.type==="arrow"||e.type==="line"){let u=e.arrowType||"straight";if(u==="straight")return [{type:"start",x:e.x,y:e.y,cursor:"crosshair"},{type:"end",x:e.x+e.width,y:e.y+e.height,cursor:"crosshair"}];if(u==="curved"){let i=la(e);return [{type:"start",x:e.x,y:e.y,cursor:"crosshair"},{type:"middle",x:i.x,y:i.y,cursor:"grab"},{type:"end",x:e.x+e.width,y:e.y+e.height,cursor:"crosshair"}]}if(u==="elbow"){let i=Tr(e),d=i.controlPoint1||{x:e.x+e.width*.4,y:e.y},h=i.controlPoint2||{x:e.x+e.width*.6,y:e.y+e.height};return [{type:"start",x:e.x,y:e.y,cursor:"crosshair"},{type:"control1",x:d.x,y:d.y,cursor:"grab"},{type:"control2",x:h.x,y:h.y,cursor:"grab"},{type:"end",x:e.x+e.width,y:e.y+e.height,cursor:"crosshair"}]}}let t=it(e),{x:r,y:o,width:p,height:c}=t,l=r+p/2,s=o+c/2,n=[{type:"nw",x:r,y:o,cursor:"nwse-resize"},{type:"n",x:l,y:o,cursor:"ns-resize"},{type:"ne",x:r+p,y:o,cursor:"nesw-resize"},{type:"e",x:r+p,y:s,cursor:"ew-resize"},{type:"se",x:r+p,y:o+c,cursor:"nwse-resize"},{type:"s",x:l,y:o+c,cursor:"ns-resize"},{type:"sw",x:r,y:o+c,cursor:"nesw-resize"},{type:"w",x:r,y:s,cursor:"ew-resize"},{type:"rotate",x:l,y:o-24,cursor:"grab"}];return e.rotation?n.map(u=>{let i=Ir({x:u.x,y:u.y},{x:l,y:s},e.rotation||0);return {...u,x:i.x,y:i.y}}):n}function uo(e,t,r=8){for(let o of t)if(Math.hypot(e.x-o.x,e.y-o.y)<=r)return o;return null}function Lr(e,t,r=8){let o=[...t].sort((p,c)=>(c.zIndex??0)-(p.zIndex??0));for(let p of o)if($i(e,p,r))return p;return null}function xa(e,t){let r=Math.min(e.startX,e.currentX),o=Math.max(e.startX,e.currentX),p=Math.min(e.startY,e.currentY),c=Math.max(e.startY,e.currentY);return t.filter(l=>{let s=it(l),n=s.x,u=s.x+s.width,i=s.y,d=s.y+s.height;return !(u<r||n>o||d<p||i>c)})}function Yr(e,t=0){if(e.length===0)return null;let r=1/0,o=1/0,p=-1/0,c=-1/0;for(let l of e){let s=it(l);s.x<r&&(r=s.x),s.y<o&&(o=s.y),s.x+s.width>p&&(p=s.x+s.width),s.y+s.height>c&&(c=s.y+s.height);}return r===1/0?null:{x:r-t,y:o-t,width:Math.max(1,p-r+t*2),height:Math.max(1,c-o+t*2)}}function ho(e){let{x:t,y:r,width:o,height:p}=e,c=t+o/2,l=r+p/2;return [{type:"nw",x:t,y:r,cursor:"nwse-resize"},{type:"n",x:c,y:r,cursor:"ns-resize"},{type:"ne",x:t+o,y:r,cursor:"nesw-resize"},{type:"e",x:t+o,y:l,cursor:"ew-resize"},{type:"se",x:t+o,y:r+p,cursor:"nwse-resize"},{type:"s",x:c,y:r+p,cursor:"ns-resize"},{type:"sw",x:t,y:r+p,cursor:"nesw-resize"},{type:"w",x:t,y:l,cursor:"ew-resize"},{type:"rotate",x:c,y:r-24,cursor:"grab"}]}function fa(e,t,r=6){if(e.type!=="table")return {type:"none"};let o=Math.min(e.x,e.x+e.width),p=Math.min(e.y,e.y+e.height),c=zr(e),l=e.rotation?Ir(t,{x:o+c.totalWidth/2,y:p+c.totalHeight/2},-e.rotation):t;for(let s=1;s<c.cols;s++){let n=o+c.colOffsets[s];if(Math.abs(l.x-n)<=r&&l.y>=p-r&&l.y<=p+c.totalHeight+r)return {type:"col-divider",colIndex:s,x:n,minY:p,maxY:p+c.totalHeight}}for(let s=1;s<c.rows;s++){let n=p+c.rowOffsets[s];if(Math.abs(l.y-n)<=r&&l.x>=o-r&&l.x<=o+c.totalWidth+r)return {type:"row-divider",rowIndex:s,y:n,minX:o,maxX:o+c.totalWidth}}for(let s=0;s<c.rows;s++)for(let n=0;n<c.cols;n++){let u=c.getCellBounds(s,n);if(l.x>=u.x&&l.x<=u.x+u.width&&l.y>=u.y&&l.y<=u.y+u.height)return {type:"cell",row:s,col:n,bounds:u}}return {type:"none"}}var zi=["rectangle","ellipse","diamond","triangle","capsule","parallelogram","trapezoid","hexagon","cylinder","cloud","star","table","sticky","text","image","frame"];function Ro(e){let t=Math.min(e.x,e.x+e.width),r=Math.max(e.x,e.x+e.width),o=Math.min(e.y,e.y+e.height),p=Math.max(e.y,e.y+e.height),c=r-t,l=p-o,s=t+c/2,n=o+l/2,u;if(e.type==="ellipse"){let i=c/2,d=l/2,h=Math.cos(Math.PI/6),a=Math.sin(Math.PI/6),x=Math.cos(Math.PI/3),b=Math.sin(Math.PI/3);u={"top-left":{x:s-i*x,y:n-d*b},top:{x:s,y:n-d},"top-right":{x:s+i*x,y:n-d*b},"right-top":{x:s+i*h,y:n-d*a},right:{x:s+i,y:n},"right-bottom":{x:s+i*h,y:n+d*a},"bottom-right":{x:s+i*x,y:n+d*b},bottom:{x:s,y:n+d},"bottom-left":{x:s-i*x,y:n+d*b},"left-bottom":{x:s-i*h,y:n+d*a},left:{x:s-i,y:n},"left-top":{x:s-i*h,y:n-d*a},center:{x:s,y:n}};}else if(e.type==="diamond")u={"top-left":{x:t+(s-t)*.5,y:n-(n-o)*.5},top:{x:s,y:o},"top-right":{x:s+(r-s)*.5,y:o+(n-o)*.5},"right-top":{x:s+(r-s)*.75,y:o+(n-o)*.75},right:{x:r,y:n},"right-bottom":{x:r-(r-s)*.25,y:n+(p-n)*.25},"bottom-right":{x:s+(r-s)*.5,y:n+(p-n)*.5},bottom:{x:s,y:p},"bottom-left":{x:t+(s-t)*.5,y:n+(p-n)*.5},"left-bottom":{x:t+(s-t)*.25,y:n+(p-n)*.25},left:{x:t,y:n},"left-top":{x:t+(s-t)*.25,y:n-(n-o)*.25},center:{x:s,y:n}};else if(e.type==="triangle")u={top:{x:s,y:o},"top-left":{x:s+(t-s)*.33,y:o+l*.33},"left-top":{x:s+(t-s)*.5,y:o+l*.5},left:{x:s+(t-s)*.67,y:o+l*.67},"left-bottom":{x:s+(t-s)*.85,y:o+l*.85},"top-right":{x:s+(r-s)*.33,y:o+l*.33},"right-top":{x:s+(r-s)*.5,y:o+l*.5},right:{x:s+(r-s)*.67,y:o+l*.67},"right-bottom":{x:s+(r-s)*.85,y:o+l*.85},"bottom-left":{x:t+c*.25,y:p},bottom:{x:s,y:p},"bottom-right":{x:t+c*.75,y:p},center:{x:s,y:o+l*.62}};else if(e.type==="parallelogram"){let i=Math.min(36,c*.22);u={"top-left":{x:t+i+(c-i)*.25,y:o},top:{x:t+i+(c-i)*.5,y:o},"top-right":{x:t+i+(c-i)*.75,y:o},"right-top":{x:r-i*.25,y:o+l*.25},right:{x:r-i*.5,y:n},"right-bottom":{x:r-i*.75,y:o+l*.75},"bottom-right":{x:t+(c-i)*.75,y:p},bottom:{x:t+(c-i)*.5,y:p},"bottom-left":{x:t+(c-i)*.25,y:p},"left-bottom":{x:t+i*.25,y:o+l*.75},left:{x:t+i*.5,y:n},"left-top":{x:t+i*.75,y:o+l*.25},center:{x:s,y:n}};}else if(e.type==="trapezoid"){let i=Math.min(c*.2,40);u={"top-left":{x:t+i+(c-2*i)*.25,y:o},top:{x:s,y:o},"top-right":{x:t+i+(c-2*i)*.75,y:o},"right-top":{x:r-i+i*.25,y:o+l*.25},right:{x:r-i*.5,y:n},"right-bottom":{x:r-i+i*.75,y:o+l*.75},"bottom-right":{x:t+c*.75,y:p},bottom:{x:s,y:p},"bottom-left":{x:t+c*.25,y:p},"left-bottom":{x:t+i*.25,y:o+l*.75},left:{x:t+i*.5,y:n},"left-top":{x:t+i*.75,y:o+l*.25},center:{x:s,y:n}};}else if(e.type==="hexagon"){let i=Math.min(c*.22,45);u={"top-left":{x:t+i+(c-2*i)*.25,y:o},top:{x:s,y:o},"top-right":{x:t+i+(c-2*i)*.75,y:o},"right-top":{x:r-i*.5,y:o+l*.25},right:{x:r,y:n},"right-bottom":{x:r-i*.5,y:o+l*.75},"bottom-right":{x:t+i+(c-2*i)*.75,y:p},bottom:{x:s,y:p},"bottom-left":{x:t+i+(c-2*i)*.25,y:p},"left-bottom":{x:t+i*.5,y:o+l*.75},left:{x:t,y:n},"left-top":{x:t+i*.5,y:o+l*.25},center:{x:s,y:n}};}else if(e.type==="capsule"){let i=c>=l,d=Math.min(c,l)/2;if(i){let h=Math.SQRT1_2;u={"top-left":{x:t+d+(c-2*d)*.25,y:o},top:{x:s,y:o},"top-right":{x:t+d+(c-2*d)*.75,y:o},"right-top":{x:r-d+d*h,y:n-d*h},right:{x:r,y:n},"right-bottom":{x:r-d+d*h,y:n+d*h},"bottom-right":{x:t+d+(c-2*d)*.75,y:p},bottom:{x:s,y:p},"bottom-left":{x:t+d+(c-2*d)*.25,y:p},"left-bottom":{x:t+d-d*h,y:n+d*h},left:{x:t,y:n},"left-top":{x:t+d-d*h,y:n-d*h},center:{x:s,y:n}};}else {let h=Math.SQRT1_2;u={"top-left":{x:s-d*h,y:o+d-d*h},top:{x:s,y:o},"top-right":{x:s+d*h,y:o+d-d*h},"right-top":{x:r,y:o+d+(l-2*d)*.25},right:{x:r,y:n},"right-bottom":{x:r,y:o+d+(l-2*d)*.75},"bottom-right":{x:s+d*h,y:p-d+d*h},bottom:{x:s,y:p},"bottom-left":{x:s-d*h,y:p-d+d*h},"left-bottom":{x:t,y:o+d+(l-2*d)*.75},left:{x:t,y:n},"left-top":{x:t,y:o+d+(l-2*d)*.25},center:{x:s,y:n}};}}else if(e.type==="cylinder"){let i=Math.min(24,l*.2);u={"top-left":{x:s-c/2*.7,y:o+i-i*.7},top:{x:s,y:o},"top-right":{x:s+c/2*.7,y:o+i-i*.7},"right-top":{x:r,y:o+i+(l-2*i)*.25},right:{x:r,y:n},"right-bottom":{x:r,y:o+i+(l-2*i)*.75},"bottom-right":{x:s+c/2*.7,y:p-i+i*.7},bottom:{x:s,y:p},"bottom-left":{x:s-c/2*.7,y:p-i+i*.7},"left-bottom":{x:t,y:o+i+(l-2*i)*.75},left:{x:t,y:n},"left-top":{x:t,y:o+i+(l-2*i)*.25},center:{x:s,y:n}};}else if(e.type==="star"){let i=Math.min(c,l)/2,d=i*.45,h=Math.cos,a=Math.sin,x=Math.PI;u={top:{x:s,y:n-i},"top-right":{x:s+d*h(-x/2+x/5),y:n+d*a(-x/2+x/5)},"right-top":{x:s+i*h(-x/10),y:n+i*a(-x/10)},right:{x:s+(i*h(-x/10)+d*h(x/10))/2,y:n},"right-bottom":{x:s+i*h(3*x/10),y:n+i*a(3*x/10)},"bottom-right":{x:s+d*h(x/10),y:n+d*a(x/10)},bottom:{x:s,y:n+d},"bottom-left":{x:s+d*h(9*x/10),y:n+d*a(9*x/10)},"left-bottom":{x:s+i*h(7*x/10),y:n+i*a(7*x/10)},left:{x:s+(i*h(11*x/10)+d*h(9*x/10))/2,y:n},"left-top":{x:s+i*h(11*x/10),y:n+i*a(11*x/10)},"top-left":{x:s+d*h(-x/2-x/5),y:n+d*a(-x/2-x/5)},center:{x:s,y:n}};}else e.type==="cloud"?u={"top-left":{x:t+c*.28,y:o+l*.08},top:{x:s,y:o+l*.05},"top-right":{x:t+c*.72,y:o+l*.08},"right-top":{x:r-c*.04,y:o+l*.28},right:{x:r,y:n},"right-bottom":{x:r-c*.06,y:o+l*.72},"bottom-right":{x:t+c*.72,y:p-l*.05},bottom:{x:s,y:p},"bottom-left":{x:t+c*.28,y:p-l*.05},"left-bottom":{x:t+c*.04,y:o+l*.72},left:{x:t,y:n},"left-top":{x:t+c*.04,y:o+l*.28},center:{x:s,y:n}}:u={"top-left":{x:t+c*.25,y:o},top:{x:s,y:o},"top-right":{x:t+c*.75,y:o},"right-top":{x:r,y:o+l*.25},right:{x:r,y:n},"right-bottom":{x:r,y:o+l*.75},"bottom-left":{x:t+c*.25,y:p},bottom:{x:s,y:p},"bottom-right":{x:t+c*.75,y:p},"left-top":{x:t,y:o+l*.25},left:{x:t,y:n},"left-bottom":{x:t,y:o+l*.75},center:{x:s,y:n}};if(e.rotation){let i={x:s,y:n},d={};for(let[h,a]of Object.entries(u))d[h]=h==="center"?a:Ir(a,i,e.rotation);return d}return u}function ga(e,t){let r=Ro(e);return r[t]||r.center}function Zr(e,t,r,o=28){let p=null,c=o;for(let l of t){if(l.id===r||!zi.includes(l.type))continue;let s=Ro(l);for(let[n,u]of Object.entries(s)){let i=Math.hypot(e.x-u.x,e.y-u.y);i<c&&(c=i,p={element:l,anchor:n,point:u,distance:i});}}return p}function bt(e){let t=new Map;for(let r of e)t.set(r.id,r);return e.map(r=>{if(r.type!=="arrow"&&r.type!=="line"||!r.startBinding&&!r.endBinding)return r;let o={x:r.x,y:r.y},p={x:r.x+r.width,y:r.y+r.height},c=r.startBinding,l=r.endBinding;if(r.startBinding){let x=t.get(r.startBinding.elementId);x?o=ga(x,r.startBinding.anchor):c=null;}if(r.endBinding){let x=t.get(r.endBinding.elementId);x?p=ga(x,r.endBinding.anchor):l=null;}let s=o.x-r.x,n=o.y-r.y,u=p.x-(r.x+r.width),i=p.y-(r.y+r.height),d=r.controlPoint;d&&(d={x:d.x+(s+u)/2,y:d.y+(n+i)/2});let h=r.controlPoint1;h&&(h={x:h.x+s*.7+u*.3,y:h.y+n*.7+i*.3});let a=r.controlPoint2;return a&&(a={x:a.x+s*.3+u*.7,y:a.y+n*.3+i*.7}),{...r,x:o.x,y:o.y,width:p.x-o.x,height:p.y-o.y,controlPoint:d,controlPoint1:h,controlPoint2:a,startBinding:c,endBinding:l}})}function Mr(e,t={}){let{deltaX:r=24,deltaY:o=24,highestZ:p=0}=t,c=new Map,l=new Map,s=[];return e.forEach((u,i)=>{let d=`el_${Date.now()}_${i}_${Math.random().toString(36).substring(2,7)}`;c.set(u.id,d),s.push(d),u.groupIds&&u.groupIds.length>0&&u.groupIds.forEach(h=>{l.has(h)||l.set(h,`grp_${Date.now()}_${i}_${Math.random().toString(36).substring(2,7)}`);});}),{clonedElements:e.map((u,i)=>{let d=c.get(u.id),h;u.groupIds&&u.groupIds.length>0&&(h=u.groupIds.map(S=>l.get(S)));let a=u.startBinding;u.startBinding&&(c.has(u.startBinding.elementId)?a={...u.startBinding,elementId:c.get(u.startBinding.elementId)}:a=null);let x=u.endBinding;u.endBinding&&(c.has(u.endBinding.elementId)?x={...u.endBinding,elementId:c.get(u.endBinding.elementId)}:x=null);let b=u.controlPoint;b&&(b={x:b.x+r,y:b.y+o});let k=u.controlPoint1;k&&(k={x:k.x+r,y:k.y+o});let y=u.controlPoint2;y&&(y={x:y.x+r,y:y.y+o});let _=u.points;return _&&_.length>0&&(_=_.map(S=>({x:S.x+r,y:S.y+o}))),{...u,id:d,x:u.x+r,y:u.y+o,zIndex:p+i+1,groupIds:h,startBinding:a,endBinding:x,controlPoint:b,controlPoint1:k,controlPoint2:y,points:_}}),newSelectedIds:s}}function Xr(e,t){if(!t||t.length===0)return e;let r=new Set(t),o=new Set;for(let c of e)r.has(c.id)&&c.type!=="arrow"&&c.type!=="line"&&o.add(c.id);let p=e.filter(c=>{if(r.has(c.id))return false;if(c.type==="arrow"||c.type==="line"){let l=c.startBinding&&o.has(c.startBinding.elementId),s=c.endBinding&&o.has(c.endBinding.elementId);if(l||s)return false}return true});return bt(p)}function ba({dragInitialBounds:e,rawDx:t,rawDy:r,allElements:o,selectedIds:p,snapThreshold:c=8}){let l={id:"dragging",minX:e.x+t,maxX:e.x+t+e.width,centerX:e.x+t+e.width/2,minY:e.y+r,maxY:e.y+r+e.height,centerY:e.y+r+e.height/2,width:e.width,height:e.height},s=[];for(let y of o){if(p.includes(y.id)||y.type==="pen"||y.type==="arrow"||y.type==="line")continue;let _=it(y);_.width<5||_.height<5||s.push({id:y.id,minX:_.x,maxX:_.x+_.width,centerX:_.x+_.width/2,minY:_.y,maxY:_.y+_.height,centerY:_.y+_.height/2,width:_.width,height:_.height});}if(s.length===0)return {snappedDx:t,snappedDy:r,alignmentGuides:[],spacingGuides:[]};let n=null,u=null;for(let y of s){let _=[{dragVal:l.minX,targetVal:y.minX,type:"edge",snapDelta:y.minX-l.minX},{dragVal:l.minX,targetVal:y.maxX,type:"edge",snapDelta:y.maxX-l.minX},{dragVal:l.centerX,targetVal:y.centerX,type:"center",snapDelta:y.centerX-l.centerX},{dragVal:l.maxX,targetVal:y.minX,type:"edge",snapDelta:y.minX-l.maxX},{dragVal:l.maxX,targetVal:y.maxX,type:"edge",snapDelta:y.maxX-l.maxX}];for(let P of _){let R=Math.abs(P.snapDelta);if(R<=c&&(!n||R<Math.abs(n.diff))){let I=Math.min(l.minY,y.minY)-16,z=Math.max(l.maxY,y.maxY)+16;n={diff:P.snapDelta,guide:{orientation:"vertical",position:P.targetVal,from:I,to:z,type:P.type}};}}let S=[{dragVal:l.minY,targetVal:y.minY,type:"edge",snapDelta:y.minY-l.minY},{dragVal:l.minY,targetVal:y.maxY,type:"edge",snapDelta:y.maxY-l.minY},{dragVal:l.centerY,targetVal:y.centerY,type:"center",snapDelta:y.centerY-l.centerY},{dragVal:l.maxY,targetVal:y.minY,type:"edge",snapDelta:y.minY-l.maxY},{dragVal:l.maxY,targetVal:y.maxY,type:"edge",snapDelta:y.maxY-l.maxY}];for(let P of S){let R=Math.abs(P.snapDelta);if(R<=c&&(!u||R<Math.abs(u.diff))){let I=Math.min(l.minX,y.minX)-16,z=Math.max(l.maxX,y.maxX)+16;u={diff:P.snapDelta,guide:{orientation:"horizontal",position:P.targetVal,from:I,to:z,type:P.type}};}}}let i=t+(n?n.diff:0),d=r+(u?u.diff:0),h=[];n&&h.push(n.guide),u&&h.push(u.guide);let a=[],x={...l,minX:e.x+i,maxX:e.x+i+e.width,centerX:e.x+i+e.width/2,minY:e.y+d,maxY:e.y+d+e.height,centerY:e.y+d+e.height/2},b=s.filter(y=>Math.max(y.minY,x.minY)<Math.min(y.maxY,x.maxY)).sort((y,_)=>y.minX-_.minX);if(b.length>=2){let y=false;for(let _=0;_<b.length-1;_++){let S=b[_],P=b[_+1];if(S.maxX<x.minX&&x.maxX<P.minX){let R=x.minX-S.maxX,I=P.minX-x.maxX,$=(P.minX-S.maxX-x.width)/2;if($>5&&Math.abs(R-I)<=c*2){let w=S.maxX+$-x.minX;if(Math.abs(w)<=c){i+=w,x.minX+=w,x.maxX+=w;let f=Math.round($),v=x.centerY;a.push({orientation:"horizontal",gap:f,lineStart:{x:S.maxX,y:v},lineEnd:{x:x.minX,y:v},badgePos:{x:(S.maxX+x.minX)/2,y:v}}),a.push({orientation:"horizontal",gap:f,lineStart:{x:x.maxX,y:v},lineEnd:{x:P.minX,y:v},badgePos:{x:(x.maxX+P.minX)/2,y:v}}),y=true;break}}}}if(!y)for(let _=0;_<b.length-1;_++){let S=b[_],P=b[_+1],R=P.minX-S.maxX;if(R>5){if(x.minX>=P.maxX){let I=x.minX-P.maxX,z=R-I;if(Math.abs(z)<=c){i+=z,x.minX+=z,x.maxX+=z;let $=Math.round(R),w=x.centerY;a.push({orientation:"horizontal",gap:$,lineStart:{x:S.maxX,y:w},lineEnd:{x:P.minX,y:w},badgePos:{x:(S.maxX+P.minX)/2,y:w}}),a.push({orientation:"horizontal",gap:$,lineStart:{x:P.maxX,y:w},lineEnd:{x:x.minX,y:w},badgePos:{x:(P.maxX+x.minX)/2,y:w}});break}}if(x.maxX<=S.minX){let z=S.minX-x.maxX-R;if(Math.abs(z)<=c){i+=z,x.minX+=z,x.maxX+=z;let $=Math.round(R),w=x.centerY;a.push({orientation:"horizontal",gap:$,lineStart:{x:x.maxX,y:w},lineEnd:{x:S.minX,y:w},badgePos:{x:(x.maxX+S.minX)/2,y:w}}),a.push({orientation:"horizontal",gap:$,lineStart:{x:S.maxX,y:w},lineEnd:{x:P.minX,y:w},badgePos:{x:(S.maxX+P.minX)/2,y:w}});break}}}}}let k=s.filter(y=>Math.max(y.minX,x.minX)<Math.min(y.maxX,x.maxX)).sort((y,_)=>y.minY-_.minY);if(k.length>=2){let y=false;for(let _=0;_<k.length-1;_++){let S=k[_],P=k[_+1];if(S.maxY<x.minY&&x.maxY<P.minY){let R=x.minY-S.maxY,I=P.minY-x.maxY,$=(P.minY-S.maxY-x.height)/2;if($>5&&Math.abs(R-I)<=c*2){let w=S.maxY+$-x.minY;if(Math.abs(w)<=c){d+=w,x.minY+=w,x.maxY+=w;let f=Math.round($),v=x.centerX;a.push({orientation:"vertical",gap:f,lineStart:{x:v,y:S.maxY},lineEnd:{x:v,y:x.minY},badgePos:{x:v,y:(S.maxY+x.minY)/2}}),a.push({orientation:"vertical",gap:f,lineStart:{x:v,y:x.maxY},lineEnd:{x:v,y:P.minY},badgePos:{x:v,y:(x.maxY+P.minY)/2}}),y=true;break}}}}if(!y)for(let _=0;_<k.length-1;_++){let S=k[_],P=k[_+1],R=P.minY-S.maxY;if(R>5){if(x.minY>=P.maxY){let I=x.minY-P.maxY,z=R-I;if(Math.abs(z)<=c){d+=z,x.minY+=z,x.maxY+=z;let $=Math.round(R),w=x.centerX;a.push({orientation:"vertical",gap:$,lineStart:{x:w,y:S.maxY},lineEnd:{x:w,y:P.minY},badgePos:{x:w,y:(S.maxY+P.minY)/2}}),a.push({orientation:"vertical",gap:$,lineStart:{x:w,y:P.maxY},lineEnd:{x:w,y:x.minY},badgePos:{x:w,y:(P.maxY+x.minY)/2}});break}}if(x.maxY<=S.minY){let z=S.minY-x.maxY-R;if(Math.abs(z)<=c){d+=z,x.minY+=z,x.maxY+=z;let $=Math.round(R),w=x.centerX;a.push({orientation:"vertical",gap:$,lineStart:{x:w,y:x.maxY},lineEnd:{x:w,y:S.minY},badgePos:{x:w,y:(x.maxY+S.minY)/2}}),a.push({orientation:"vertical",gap:$,lineStart:{x:w,y:S.maxY},lineEnd:{x:w,y:P.minY},badgePos:{x:w,y:(S.maxY+P.minY)/2}});break}}}}}return {snappedDx:i,snappedDy:d,alignmentGuides:h,spacingGuides:a}}function ya({tool:e,setTool:t,isToolLocked:r=false,camera:o,screenToWorld:p,panBy:c,elements:l,setElements:s,selectedIds:n,selectElement:u,selectElements:i,clearSelection:d,addElement:h,deleteSelectedElements:a,duplicateSelectedElements:x,groupSelectedElements:b,ungroupSelectedElements:k,pushHistory:y,undo:_,redo:S,defaultStyles:P,onEditText:R,onLaserDrawStart:I,onLaserDrawMove:z,onLaserDrawEnd:$,onLaserHover:w}){let f=Ln.useRef(l),v=Ln.useRef(n);Ln.useEffect(()=>{f.current=l,v.current=n;},[l,n]);let[C,T]=Ln.useState(false),[W,le]=Ln.useState(null),[L,A]=Ln.useState(null),F=Ln.useMemo(()=>C||e==="hand"?"grab":e==="select"?"default":e==="laser"?"none":e==="eraser"?"crosshair":e==="text"?"text":"crosshair",[e,C]),[Z,be]=Ln.useState(null),U=Z||F,[E,ee]=Ln.useState(null),[te,ie]=Ln.useState([]),[Se,Ke]=Ln.useState([]),X=Ln.useRef({mode:"none",startScreenPt:{x:0,y:0},startWorldPt:{x:0,y:0}});Ln.useEffect(()=>{let _e=he=>{if(!(he.target instanceof HTMLInputElement||he.target instanceof HTMLTextAreaElement||he.target.isContentEditable)){if(he.code==="Space"&&!he.repeat)he.preventDefault(),T(true);else if(he.key==="Delete"||he.key==="Backspace")a();else if((he.ctrlKey||he.metaKey)&&he.key.toLowerCase()==="z")he.preventDefault(),he.shiftKey?S():_();else if((he.ctrlKey||he.metaKey)&&he.key.toLowerCase()==="y")he.preventDefault(),S();else if((he.ctrlKey||he.metaKey)&&he.key.toLowerCase()==="d")he.preventDefault(),x();else if((he.ctrlKey||he.metaKey)&&he.key.toLowerCase()==="a")he.preventDefault(),f.current.length>0&&(i(f.current.map(ve=>ve.id)),t("select"));else if((he.ctrlKey||he.metaKey)&&he.key.toLowerCase()==="g")he.preventDefault(),he.shiftKey?k?.():b?.();else if(!he.ctrlKey&&!he.metaKey&&(he.key==="ArrowUp"||he.key==="ArrowDown"||he.key==="ArrowLeft"||he.key==="ArrowRight")&&v.current.length>0){he.preventDefault();let ve=he.shiftKey?10:2,ue=he.key==="ArrowLeft"?-ve:he.key==="ArrowRight"?ve:0,K=he.key==="ArrowUp"?-ve:he.key==="ArrowDown"?ve:0,Y=v.current;s(Q=>{let M=Q.map(g=>Y.includes(g.id)?{...g,x:g.x+ue,y:g.y+K,points:g.points?.map(D=>({x:D.x+ue,y:D.y+K})),controlPoint:g.controlPoint?{x:g.controlPoint.x+ue,y:g.controlPoint.y+K}:g.controlPoint,controlPoint1:g.controlPoint1?{x:g.controlPoint1.x+ue,y:g.controlPoint1.y+K}:g.controlPoint1,controlPoint2:g.controlPoint2?{x:g.controlPoint2.x+ue,y:g.controlPoint2.y+K}:g.controlPoint2}:g),pe=bt(M);return y(pe),pe});}}},Pe=he=>{he.code==="Space"&&T(false);};return window.addEventListener("keydown",_e),window.addEventListener("keyup",Pe),()=>{window.removeEventListener("keydown",_e),window.removeEventListener("keyup",Pe);}},[a,x,b,k,_,S,i,t,s,y]);let Oe=Ln.useCallback(_e=>{if(_e.button===1||C||e==="hand"){X.current={mode:"pan",startScreenPt:{x:_e.clientX,y:_e.clientY},startWorldPt:p({x:_e.clientX,y:_e.clientY})},be("grabbing");return}if(_e.button!==0)return;let Pe=_e.currentTarget.getBoundingClientRect(),he={x:_e.clientX-Pe.left,y:_e.clientY-Pe.top},ve=p(he);if(e==="laser"){d(),I?.(ve),X.current={mode:"laser",startScreenPt:he,startWorldPt:ve};return}if(n.length===1){let Y=l.find(Q=>Q.id===n[0]);if(Y){let Q=po(Y),M=uo(ve,Q,12/o.zoom);if(M){let pe=new Map;if(pe.set(Y.id,{...Y}),M.type==="start"||M.type==="end"){X.current={mode:"arrow-endpoint",startScreenPt:he,startWorldPt:ve,activeElementId:Y.id,initialElementSnapshots:pe,arrowHandleType:M.type};return}if(M.type==="middle"){X.current={mode:"arrow-control",startScreenPt:he,startWorldPt:ve,activeElementId:Y.id,initialElementSnapshots:pe,arrowHandleType:"middle"};return}if(M.type==="control1"||M.type==="control2"){X.current={mode:M.type==="control1"?"arrow-control1":"arrow-control2",startScreenPt:he,startWorldPt:ve,activeElementId:Y.id,initialElementSnapshots:pe,arrowHandleType:M.type};return}if(M.type==="rotate"){let g=Y.x+Y.width/2,D=Y.y+Y.height/2,N=Math.atan2(ve.y-D,ve.x-g);X.current={mode:"rotate",startScreenPt:he,startWorldPt:ve,activeElementId:Y.id,initialElementSnapshots:pe,initialAngle:N,initialRotation:Y.rotation||0};}else X.current={mode:"resize",startScreenPt:he,startWorldPt:ve,activeElementId:Y.id,initialElementSnapshots:pe,activeHandle:M};return}}}else if(n.length>1){let Y=l.filter(M=>n.includes(M.id)),Q=Yr(Y,6);if(Q){let M=ho(Q),pe=uo(ve,M,12/o.zoom);if(pe){let g=new Map;if(Y.forEach(D=>g.set(D.id,{...D})),pe.type==="rotate"){let D=Q.x+Q.width/2,N=Q.y+Q.height/2,se=Math.atan2(ve.y-N,ve.x-D);X.current={mode:"rotate",startScreenPt:he,startWorldPt:ve,initialElementSnapshots:g,initialGroupBounds:Q,initialAngle:se,initialRotation:0};}else X.current={mode:"resize",startScreenPt:he,startWorldPt:ve,initialElementSnapshots:g,initialGroupBounds:Q,activeHandle:pe};return}}}if(e==="select"){let Y=Lr(ve,l,8/o.zoom),Q=false;if(!Y&&n.length>1&&!_e.shiftKey){let M=l.filter(g=>n.includes(g.id)),pe=Yr(M,8);pe&&ve.x>=pe.x&&ve.x<=pe.x+pe.width&&ve.y>=pe.y&&ve.y<=pe.y+pe.height&&(Q=true);}if(Y||Q){let M=_e.shiftKey,pe=_e.ctrlKey||_e.metaKey,g=n,D=[];if(Y){D=[Y.id];let se=n.length===1&&n[0]===Y.id;if(Y.groupIds&&Y.groupIds.length>0&&!pe&&!se){let O=Y.groupIds[Y.groupIds.length-1];D=l.filter(re=>re.groupIds&&re.groupIds.includes(O)).map(re=>re.id);}let de=D.every(O=>n.includes(O)),oe=n.includes(Y.id);M?(de?g=n.filter(O=>!D.includes(O)):g=Array.from(new Set([...n,...D])),i(g)):oe||(g=D,i(g));}let N=new Map;if(_e.altKey){let se=l.filter(re=>g.includes(re.id)),de=l.reduce((re,ge)=>Math.max(re,ge.zIndex??0),0),{clonedElements:oe,newSelectedIds:O}=Mr(se,{deltaX:0,deltaY:0,highestZ:de});if(oe.length>0){oe.forEach(ge=>{N.set(ge.id,{...ge});});let re=bt([...l,...oe]);s(re),i(O);}}else {let se=l.filter(oe=>g.includes(oe.id));se.forEach(oe=>{N.set(oe.id,{...oe});});let de=se.filter(oe=>oe.type==="frame");if(de.length>0){let oe=O=>({x:O.width<0?O.x+O.width:O.x,y:O.height<0?O.y+O.height:O.y,width:Math.abs(O.width),height:Math.abs(O.height)});l.forEach(O=>{if(O.type==="frame"||N.has(O.id))return;let re=oe(O),ge=re.x+re.width/2,Ce=re.y+re.height/2;de.some(Rt=>{let nt=oe(Rt);return ge>=nt.x&&ge<=nt.x+nt.width&&Ce>=nt.y&&Ce<=nt.y+nt.height})&&N.set(O.id,{...O});});}}X.current={mode:"move",startScreenPt:he,startWorldPt:ve,initialElementSnapshots:N,pendingSingleClickTarget:Y&&!M&&n.includes(Y.id)&&n.length>1?D:void 0,dragMoved:false};}else _e.shiftKey||d(),le({startX:ve.x,startY:ve.y,currentX:ve.x,currentY:ve.y}),X.current={mode:"marquee",startScreenPt:he,startWorldPt:ve};return}if(e==="eraser"){let Y=Lr(ve,l,12/o.zoom);if(Y){let Q=Xr(l,[Y.id]);s(Q),y(Q);}X.current={mode:"erase",startScreenPt:he,startWorldPt:ve};return}if(e==="text"||e==="sticky"){let Y=Lr(ve,l,8/o.zoom);if(Y&&["text","sticky","rectangle","ellipse","diamond","triangle","capsule","parallelogram","trapezoid","hexagon","cylinder","cloud","star"].includes(Y.type)){u(Y.id),r||t("select"),R?.(Y);return}}let ue=`el_${Date.now()}_${Math.random().toString(36).substring(2,7)}`,K=l.reduce((Y,Q)=>Math.max(Y,Q.zIndex??0),0);if(e==="arrow"||e==="line"){let Y=Zr(ve,l),Q=Y?Y.point:ve,M=Y?{elementId:Y.element.id,anchor:Y.anchor}:null,pe={...P,id:ue,type:e,x:Q.x,y:Q.y,width:1,height:1,arrowType:P.arrowType||"straight",startArrowhead:e==="arrow"&&P.startArrowhead||"none",endArrowhead:e==="arrow"?P.endArrowhead||"arrow":"none",strokeStyle:P.strokeStyle||"solid",startBinding:M,endBinding:null,zIndex:K+1};h(pe),X.current={mode:"draw",startScreenPt:he,startWorldPt:Q,activeElementId:ue};}else if(e==="pen"){let Y={...P,id:ue,type:"pen",x:ve.x,y:ve.y,width:0,height:0,points:[ve],zIndex:K+1};h(Y),X.current={mode:"draw",startScreenPt:he,startWorldPt:ve,activeElementId:ue};}else if(e==="text"){let Y={...P,id:ue,type:"text",x:ve.x,y:ve.y,width:140,height:36,text:"",zIndex:K+1};h(Y),r?d():(u(ue),t("select")),R&&R(Y),y([...l,Y]);}else if(e==="sticky"){let Y={...P,id:ue,type:"sticky",x:ve.x,y:ve.y,width:180,height:180,text:"",zIndex:K+1,fillColor:P.stickyColor||"#fef08a",stickyColor:P.stickyColor||"#fef08a"};h(Y),r?d():(u(ue),t("select")),R&&R(Y),y([...l,Y]);}else if(e==="frame"){let Y=l.filter(M=>M.type==="frame").length,Q={...P,id:ue,type:"frame",x:ve.x,y:ve.y,width:1,height:1,frameLabel:`Slide ${Y+1}`,strokeColor:"#0b6eff",strokeWidth:1.5,strokeStyle:"solid",fillColor:"transparent",zIndex:0};h(Q),X.current={mode:"draw",startScreenPt:he,startWorldPt:ve,activeElementId:ue};}else if(e==="table"){let N={...P,id:ue,type:"table",x:ve.x,y:ve.y,width:420,height:126,rows:3,cols:3,colWidths:[140,140,140],rowHeights:[42,42,42],hasHeaderRow:true,hasHeaderCol:false,tableStyle:"header-accent",cells:{"0_0":{text:"Header 1",bold:true,align:"center"},"0_1":{text:"Header 2",bold:true,align:"center"},"0_2":{text:"Header 3",bold:true,align:"center"},"1_0":{text:"Item 1",align:"left"},"1_1":{text:"",align:"left"},"1_2":{text:"",align:"left"},"2_0":{text:"Item 2",align:"left"},"2_1":{text:"",align:"left"},"2_2":{text:"",align:"left"}},zIndex:K+1};h(N),X.current={mode:"draw",startScreenPt:he,startWorldPt:ve,activeElementId:ue};}else {let Y={...P,id:ue,type:e,x:ve.x,y:ve.y,width:1,height:1,zIndex:K+1};h(Y),X.current={mode:"draw",startScreenPt:he,startWorldPt:ve,activeElementId:ue};}},[C,e,p,n,l,o.zoom,u,d,P,h,t,R,y,s,I,r,i]),je=Ln.useCallback(_e=>{let Pe=X.current.mode,he=_e.currentTarget.getBoundingClientRect(),ve={x:_e.clientX-he.left,y:_e.clientY-he.top},ue=p(ve);if(e==="laser"){w?.(ue),Pe==="laser"&&z?.(ue);return}if(Pe==="none"){if(e==="arrow"||e==="line"){let K=Zr(ue,l);ee(K?{elementId:K.element.id,anchor:K.anchor,point:K.point}:null);}else ee(null);if(e==="select"){if(n.length===1){let K=l.find(Y=>Y.id===n[0]);if(K){let Y=po(K),Q=uo(ue,Y,10/o.zoom);if(Q){be(Q.cursor),A(Q);return}}}else if(n.length>1){let K=l.filter(Q=>n.includes(Q.id)),Y=Yr(K,6);if(Y){let Q=ho(Y),M=uo(ue,Q,10/o.zoom);if(M){be(M.cursor),A(M);return}}}}if(A(null),C||e==="hand")be("grab");else if(e==="select"){let Y=!!Lr(ue,l,8/o.zoom);if(!Y&&n.length>1){let Q=l.filter(pe=>n.includes(pe.id)),M=Yr(Q,8);M&&ue.x>=M.x&&ue.x<=M.x+M.width&&ue.y>=M.y&&ue.y<=M.y+M.height&&(Y=true);}be(Y?"move":null);}return}if(Pe==="pan"){let K=(_e.clientX-X.current.startScreenPt.x)/o.zoom,Y=(_e.clientY-X.current.startScreenPt.y)/o.zoom;c(K,Y),X.current.startScreenPt={x:_e.clientX,y:_e.clientY};return}if(Pe==="erase"){let K=Lr(ue,l,12/o.zoom);K&&s(Y=>Xr(Y,[K.id]));return}if(Pe==="draw"&&X.current.activeElementId){let K=X.current.activeElementId,Y=X.current.startWorldPt,Q=ue,M=null;if(e==="arrow"||e==="line"){let pe=l.find(D=>D.id===K),g=Zr(ue,l,pe?.startBinding?.elementId);g?(Q=g.point,M={elementId:g.element.id,anchor:g.anchor},ee({elementId:g.element.id,anchor:g.anchor,point:g.point})):ee(null);}s(pe=>pe.map(g=>{if(g.id!==K)return g;if(g.type==="pen"){let oe=g.points||[];return {...g,points:[...oe,ue]}}if(g.type==="arrow"||g.type==="line")return {...g,width:Q.x-g.x,height:Q.y-g.y,endBinding:M};if(g.type==="table"){let oe=Math.min(Y.x,ue.x),O=Math.min(Y.y,ue.y),re=Math.max(90,Math.abs(ue.x-Y.x)),ge=Math.max(60,Math.abs(ue.y-Y.y)),Ce=g.cols||3,Ie=g.rows||3;return {...g,x:oe,y:O,width:re,height:ge,colWidths:Array.from({length:Ce},()=>re/Ce),rowHeights:Array.from({length:Ie},()=>ge/Ie)}}let D=Math.min(Y.x,ue.x),N=Math.min(Y.y,ue.y),se=Math.abs(ue.x-Y.x),de=Math.abs(ue.y-Y.y);return {...g,x:D,y:N,width:Math.max(10,se),height:Math.max(10,de)}}));return}if(Pe==="move"&&X.current.initialElementSnapshots){let K=ue.x-X.current.startWorldPt.x,Y=ue.y-X.current.startWorldPt.y,Q=X.current.initialElementSnapshots;Math.hypot(K,Y)>2&&(X.current.dragMoved=true);let M=1/0,pe=1/0,g=-1/0,D=-1/0;Q.forEach(O=>{let re=it(O);M=Math.min(M,re.x),pe=Math.min(pe,re.y),g=Math.max(g,re.x+re.width),D=Math.max(D,re.y+re.height);});let N={x:M,y:pe,width:g-M,height:D-pe},se=ba({dragInitialBounds:N,rawDx:K,rawDy:Y,allElements:f.current,selectedIds:Array.from(Q.keys()),snapThreshold:7/o.zoom}),de=se.snappedDx,oe=se.snappedDy;ie(se.alignmentGuides),Ke(se.spacingGuides),s(O=>{let re=O.map(ge=>{let Ce=Q.get(ge.id);return Ce?{...ge,x:Ce.x+de,y:Ce.y+oe,points:Ce.points?.map(Ie=>({x:Ie.x+de,y:Ie.y+oe})),controlPoint:Ce.controlPoint?{x:Ce.controlPoint.x+de,y:Ce.controlPoint.y+oe}:void 0,controlPoint1:Ce.controlPoint1?{x:Ce.controlPoint1.x+de,y:Ce.controlPoint1.y+oe}:void 0,controlPoint2:Ce.controlPoint2?{x:Ce.controlPoint2.x+de,y:Ce.controlPoint2.y+oe}:void 0}:ge});return bt(re)});return}if(Pe==="arrow-endpoint"&&X.current.activeElementId&&X.current.arrowHandleType){let K=X.current.activeElementId,Y=X.current.arrowHandleType,Q=f.current,M=Q.find(D=>D.id===K);if(!M)return;let pe=ue,g=null;if(Y==="start"){let D=Zr(ue,Q,M.endBinding?.elementId);D?(pe=D.point,g={elementId:D.element.id,anchor:D.anchor},ee({elementId:D.element.id,anchor:D.anchor,point:D.point})):ee(null);}else {let D=Zr(ue,Q,M.startBinding?.elementId);D?(pe=D.point,g={elementId:D.element.id,anchor:D.anchor},ee({elementId:D.element.id,anchor:D.anchor,point:D.point})):ee(null);}s(D=>D.map(N=>{if(N.id!==K)return N;if(Y==="start"){let se={x:N.x+N.width,y:N.y+N.height};return {...N,x:pe.x,y:pe.y,width:se.x-pe.x,height:se.y-pe.y,startBinding:g}}else return {...N,width:pe.x-N.x,height:pe.y-N.y,endBinding:g}}));return}if(Pe==="arrow-control"&&X.current.activeElementId){let K=X.current.activeElementId;s(Y=>Y.map(Q=>{if(Q.id!==K)return Q;let M={x:Q.x,y:Q.y},pe={x:Q.x+Q.width,y:Q.y+Q.height},g={x:2*ue.x-.5*M.x-.5*pe.x,y:2*ue.y-.5*M.y-.5*pe.y};return {...Q,arrowType:"curved",controlPoint:g}}));return}if(Pe==="arrow-control1"&&X.current.activeElementId){let K=X.current.activeElementId;s(Y=>Y.map(Q=>Q.id!==K?Q:{...Q,arrowType:"elbow",controlPoint1:ue}));return}if(Pe==="arrow-control2"&&X.current.activeElementId){let K=X.current.activeElementId;s(Y=>Y.map(Q=>Q.id!==K?Q:{...Q,arrowType:"elbow",controlPoint2:ue}));return}if(Pe==="resize"&&X.current.initialElementSnapshots&&X.current.activeHandle){let K=X.current.activeHandle,Y=ue.x-X.current.startWorldPt.x,Q=ue.y-X.current.startWorldPt.y;if(X.current.activeElementId){let M=X.current.initialElementSnapshots.get(X.current.activeElementId);if(!M)return;if(M.type==="text"){let de=M.fontSize||20,oe=1;K.type==="e"||K.type==="se"||K.type==="ne"?oe=Math.max(.2,(M.width+Y)/M.width):K.type==="w"||K.type==="sw"||K.type==="nw"?oe=Math.max(.2,(M.width-Y)/M.width):K.type==="s"?oe=Math.max(.2,(M.height+Q)/M.height):K.type==="n"&&(oe=Math.max(.2,(M.height-Q)/M.height));let O=Math.max(8,Math.min(180,Math.round(de*oe))),re=qt(M.fontFamily),ge=Math.max(30,Math.round(M.width*(O/de))),Ce=Math.max(20,Math.round(M.height*(O/de)));if(typeof window<"u"){let lt=document.createElement("canvas").getContext("2d");if(lt){let Nt=re.value==="patrick",Kt=re.value==="comic"||re.value==="handlee",zt=re.value==="fuzzy"||re.value==="edusa",Dt=Nt||Kt||zt?"400":"500";lt.font=`normal ${Dt} ${O}px ${re.cssFont}`;let fr=(M.text||"").split(`
|
|
6
|
+
`),pr=0;for(let kt of fr){let qe=lt.measureText(kt||" ").width;qe>pr&&(pr=qe);}let gr=O*1.35;ge=Math.max(30,Math.ceil(pr+16)),Ce=Math.max(Math.ceil(gr+4),Math.ceil(fr.length*gr+4));}}let Ie=M.x,Rt=M.y;K.type.includes("w")&&(Ie=M.x+(M.width-ge)),K.type.includes("n")&&(Rt=M.y+(M.height-Ce)),s(nt=>{let lt=nt.map(Nt=>Nt.id===M.id?{...Nt,x:Ie,y:Rt,width:ge,height:Ce,fontSize:O}:Nt);return bt(lt)});return}let pe=M.x,g=M.y,D=M.width,N=M.height;if((M.aspectRatioLocked||M.type==="image"||_e.shiftKey)&&M.width>0&&M.height>0){let de=M.naturalWidth&&M.naturalHeight?M.naturalWidth/M.naturalHeight:M.width/M.height;K.type==="se"?(D=Math.max(20,M.width+Y),N=Math.round(D/de)):K.type==="sw"?(D=Math.max(20,M.width-Y),N=Math.round(D/de),pe=M.x+(M.width-D)):K.type==="ne"?(D=Math.max(20,M.width+Y),N=Math.round(D/de),g=M.y+(M.height-N)):K.type==="nw"?(D=Math.max(20,M.width-Y),N=Math.round(D/de),pe=M.x+(M.width-D),g=M.y+(M.height-N)):K.type==="e"||K.type==="w"?(D=Math.max(20,K.type==="e"?M.width+Y:M.width-Y),N=Math.round(D/de),K.type==="w"&&(pe=M.x+(M.width-D)),g=M.y+(M.height-N)/2):(K.type==="n"||K.type==="s")&&(N=Math.max(20,K.type==="s"?M.height+Q:M.height-Q),D=Math.round(N*de),K.type==="n"&&(g=M.y+(M.height-N)),pe=M.x+(M.width-D)/2);}else {if(K.type.includes("e")&&(D=Math.max(15,M.width+Y)),K.type.includes("s")&&(N=Math.max(15,M.height+Q)),K.type.includes("w")){let de=M.width-15,oe=Math.min(Y,de);pe=M.x+oe,D=M.width-oe;}if(K.type.includes("n")){let de=M.height-15,oe=Math.min(Q,de);g=M.y+oe,N=M.height-oe;}}s(de=>{let oe=de.map(O=>{if(O.id!==M.id)return O;let re=O.points;if(O.points&&O.points.length>0){let ge=D/(M.width||1),Ce=N/(M.height||1);re=O.points.map(Ie=>({x:pe+(Ie.x-M.x)*ge,y:g+(Ie.y-M.y)*Ce}));}if(O.type==="table"){let ge=O.cols||3,Ce=O.rows||3,Ie=D/Math.max(1,M.width),Rt=N/Math.max(1,M.height),nt=M.colWidths&&M.colWidths.length===ge?M.colWidths:Array.from({length:ge},()=>M.width/ge),lt=M.rowHeights&&M.rowHeights.length===Ce?M.rowHeights:Array.from({length:Ce},()=>M.height/Ce),Nt=nt.map(zt=>Math.max(24,Math.round(zt*Ie))),Kt=lt.map(zt=>Math.max(20,Math.round(zt*Rt)));return {...O,x:pe,y:g,width:Nt.reduce((zt,Dt)=>zt+Dt,0),height:Kt.reduce((zt,Dt)=>zt+Dt,0),colWidths:Nt,rowHeights:Kt}}return {...O,x:pe,y:g,width:D,height:N,points:re}});return bt(oe)});return}if(X.current.initialGroupBounds){let M=X.current.initialGroupBounds,pe=X.current.initialElementSnapshots,g=M.x,D=M.y,N=M.width,se=M.height;if(_e.shiftKey&&M.width>0&&M.height>0){let re=M.width/M.height;K.type==="se"?(N=Math.max(30,M.width+Y),se=Math.round(N/re)):K.type==="sw"?(N=Math.max(30,M.width-Y),se=Math.round(N/re),g=M.x+(M.width-N)):K.type==="ne"?(N=Math.max(30,M.width+Y),se=Math.round(N/re),D=M.y+(M.height-se)):K.type==="nw"?(N=Math.max(30,M.width-Y),se=Math.round(N/re),g=M.x+(M.width-N),D=M.y+(M.height-se)):K.type==="e"||K.type==="w"?(N=Math.max(30,K.type==="e"?M.width+Y:M.width-Y),se=Math.round(N/re),K.type==="w"&&(g=M.x+(M.width-N)),D=M.y+(M.height-se)/2):(K.type==="n"||K.type==="s")&&(se=Math.max(30,K.type==="s"?M.height+Q:M.height-Q),N=Math.round(se*re),K.type==="n"&&(D=M.y+(M.height-se)),g=M.x+(M.width-N)/2);}else {if(K.type.includes("e")&&(N=Math.max(30,M.width+Y)),K.type.includes("s")&&(se=Math.max(30,M.height+Q)),K.type.includes("w")){let re=Math.min(Y,M.width-30);g=M.x+re,N=M.width-re;}if(K.type.includes("n")){let re=Math.min(Q,M.height-30);D=M.y+re,se=M.height-re;}}let oe=N/(M.width||1),O=se/(M.height||1);s(re=>{let ge=re.map(Ce=>{let Ie=pe.get(Ce.id);if(!Ie)return Ce;let Rt=(Ie.x-M.x)/M.width,nt=(Ie.y-M.y)/M.height,lt=g+Rt*N,Nt=D+nt*se,Kt=Math.max(5,Ie.width*oe),zt=Math.max(5,Ie.height*O),Dt=Ie.fontSize;if(Ie.fontSize){let qe=Math.min(oe,O);Dt=Math.max(8,Math.min(180,Math.round(Ie.fontSize*qe)));}let fr=Ie.points;Ie.points&&Ie.points.length>0&&(fr=Ie.points.map(qe=>({x:g+(qe.x-M.x)/M.width*N,y:D+(qe.y-M.y)/M.height*se})));let pr=Ie.controlPoint;Ie.controlPoint&&(pr={x:g+(Ie.controlPoint.x-M.x)/M.width*N,y:D+(Ie.controlPoint.y-M.y)/M.height*se});let gr=Ie.controlPoint1;Ie.controlPoint1&&(gr={x:g+(Ie.controlPoint1.x-M.x)/M.width*N,y:D+(Ie.controlPoint1.y-M.y)/M.height*se});let kt=Ie.controlPoint2;return Ie.controlPoint2&&(kt={x:g+(Ie.controlPoint2.x-M.x)/M.width*N,y:D+(Ie.controlPoint2.y-M.y)/M.height*se}),{...Ce,x:lt,y:Nt,width:Kt,height:zt,fontSize:Dt,points:fr,controlPoint:pr,controlPoint1:gr,controlPoint2:kt}});return bt(ge)});return}}if(Pe==="rotate"&&X.current.initialElementSnapshots&&X.current.initialAngle!==void 0){if(X.current.initialGroupBounds){let K=X.current.initialGroupBounds,Y=K.x+K.width/2,Q=K.y+K.height/2,pe=Math.atan2(ue.y-Q,ue.x-Y)-X.current.initialAngle;if(_e.shiftKey){let D=Math.PI/4;pe=Math.round(pe/D)*D;}let g=X.current.initialElementSnapshots;s(D=>{let N=D.map(se=>{let de=g.get(se.id);if(!de)return se;let oe={x:de.x+de.width/2,y:de.y+de.height/2},O=Ir(oe,{x:Y,y:Q},pe),re=((de.rotation||0)+pe)%(Math.PI*2),ge=de.points;return de.points&&de.points.length>0&&(ge=de.points.map(Ce=>Ir(Ce,{x:Y,y:Q},pe))),{...se,x:O.x-de.width/2,y:O.y-de.height/2,rotation:re,points:ge}});return bt(N)});return}if(X.current.activeElementId&&X.current.initialRotation!==void 0){let K=X.current.initialElementSnapshots.get(X.current.activeElementId);if(!K)return;let Y=K.x+K.width/2,Q=K.y+K.height/2,pe=Math.atan2(ue.y-Q,ue.x-Y)-X.current.initialAngle,g=(X.current.initialRotation+pe)%(Math.PI*2);if(_e.shiftKey){let D=Math.PI/4;g=Math.round(g/D)*D;}s(D=>{let N=D.map(se=>se.id===K.id?{...se,rotation:g}:se);return bt(N)});return}}if(Pe==="marquee"&&W){le(Y=>Y?{...Y,currentX:ue.x,currentY:ue.y}:null);let K=xa({...W,currentX:ue.x,currentY:ue.y},l);i(K.map(Y=>Y.id));}},[e,n,l,o.zoom,C,c,p,W,i,s,w,z]),Ne=Ln.useCallback(()=>{let _e=X.current.mode;if(ee(null),_e==="pan")be(null);else if(_e==="draw"){if(X.current.activeElementId){let Pe=X.current.activeElementId,he=f.current,ve=he.find(K=>K.id===Pe),ue=f.current;ve?.type==="frame"&&(Math.abs(ve.width)<40||Math.abs(ve.height)<40)&&(ue=he.map(Q=>Q.id===Pe?{...Q,x:Math.round(X.current.startWorldPt.x-800/2),y:Math.round(X.current.startWorldPt.y-450/2),width:800,height:450}:Q),s(ue)),r?d():(u(X.current.activeElementId),e!=="pen"&&t("select")),y(ue);}}else _e==="move"||_e==="resize"||_e==="rotate"||_e==="erase"||_e==="arrow-endpoint"||_e==="arrow-control"||_e==="arrow-control1"||_e==="arrow-control2"?_e==="move"?!X.current.dragMoved&&X.current.pendingSingleClickTarget?i(X.current.pendingSingleClickTarget):X.current.dragMoved&&y(f.current):y(f.current):_e==="laser"&&$?.();X.current={mode:"none",startScreenPt:{x:0,y:0},startWorldPt:{x:0,y:0}},le(null),ie([]),Ke([]);},[e,u,i,t,y,$,d,r,s]);return {onPointerDown:Oe,onPointerMove:je,onPointerUp:Ne,cursor:U,marquee:W,activeHandle:L,hoveredAnchor:E,alignmentGuides:te,spacingGuides:Se}}function Ai(e,t,r,o){e.save();for(let p of t)if(!(!p.points||p.points.length===0))if(p.mode==="persistent"){if(p.points.length===1){let l=p.points[0];e.beginPath(),e.arc(l.x,l.y,3/r.zoom,0,Math.PI*2),e.fillStyle=p.color,e.shadowColor=p.color,e.shadowBlur=10/r.zoom,e.fill();continue}e.save(),e.lineCap="round",e.lineJoin="round",e.beginPath(),e.moveTo(p.points[0].x,p.points[0].y);for(let l=1;l<p.points.length;l++){let s=p.points[l-1],n=p.points[l],u=(s.x+n.x)/2,i=(s.y+n.y)/2;e.quadraticCurveTo(s.x,s.y,u,i);}let c=p.points[p.points.length-1];e.lineTo(c.x,c.y),e.strokeStyle=p.color,e.lineWidth=5.5/r.zoom,e.shadowColor=p.color,e.shadowBlur=12/r.zoom,e.globalAlpha=.85,e.stroke(),e.strokeStyle="#ffffff",e.lineWidth=2.2/r.zoom,e.shadowBlur=3/r.zoom,e.globalAlpha=.95,e.stroke(),e.restore();}else {let l=[];for(let s=0;s<p.points.length;s++){let n=p.points[s],u=o-n.timestamp;if(u<1e3){let i=u/1e3,d=Math.max(0,1-i),h=Math.max(.4,1-i*.6);l.push({x:n.x,y:n.y,alpha:d,widthMultiplier:h});}}if(l.length===0)continue;if(l.length===1){let s=l[0];e.save(),e.beginPath(),e.arc(s.x,s.y,3*s.widthMultiplier/r.zoom,0,Math.PI*2),e.fillStyle=p.color,e.shadowColor=p.color,e.shadowBlur=12/r.zoom,e.globalAlpha=s.alpha,e.fill(),e.restore();continue}e.save(),e.lineCap="round",e.lineJoin="round";for(let s=1;s<l.length;s++){let n=l[s-1],u=l[s],i=(n.alpha+u.alpha)/2,d=(n.widthMultiplier+u.widthMultiplier)/2;e.beginPath(),e.moveTo(n.x,n.y),e.lineTo(u.x,u.y),e.strokeStyle=p.color,e.lineWidth=6*d/r.zoom,e.shadowColor=p.color,e.shadowBlur=12/r.zoom,e.globalAlpha=i*.85,e.stroke(),e.beginPath(),e.moveTo(n.x,n.y),e.lineTo(u.x,u.y),e.strokeStyle="#ffffff",e.lineWidth=2.2*d/r.zoom,e.shadowBlur=3/r.zoom,e.globalAlpha=i*.95,e.stroke();}e.restore();}e.restore();}function Ri(e,t,r,o){e.save();let{x:p,y:c}=t;e.beginPath(),e.arc(p,c,9/o.zoom,0,Math.PI*2),e.fillStyle=r,e.shadowColor=r,e.shadowBlur=16/o.zoom,e.globalAlpha=.35,e.fill(),e.beginPath(),e.arc(p,c,4.5/o.zoom,0,Math.PI*2),e.fillStyle=r,e.shadowColor=r,e.shadowBlur=8/o.zoom,e.globalAlpha=.9,e.fill(),e.beginPath(),e.arc(p,c,2/o.zoom,0,Math.PI*2),e.fillStyle="#ffffff",e.shadowColor="#ffffff",e.shadowBlur=3/o.zoom,e.globalAlpha=1,e.fill(),e.restore();}function Di(e,t,r){if(t.length!==0){e.save(),e.strokeStyle="#ec4899",e.lineWidth=1.2/r.zoom,e.setLineDash([4/r.zoom,3/r.zoom]);for(let o of t)e.beginPath(),o.orientation==="vertical"?(e.moveTo(o.position,o.from),e.lineTo(o.position,o.to)):(e.moveTo(o.from,o.position),e.lineTo(o.to,o.position)),e.stroke(),e.beginPath(),o.orientation==="vertical"?(e.moveTo(o.position-4/r.zoom,o.from),e.lineTo(o.position+4/r.zoom,o.from),e.moveTo(o.position-4/r.zoom,o.to),e.lineTo(o.position+4/r.zoom,o.to)):(e.moveTo(o.from,o.position-4/r.zoom),e.lineTo(o.from,o.position+4/r.zoom),e.moveTo(o.to,o.position-4/r.zoom),e.lineTo(o.to,o.position+4/r.zoom)),e.stroke();e.restore();}}function Wi(e,t,r){if(t.length!==0){e.save();for(let o of t){e.strokeStyle="#ec4899",e.lineWidth=1.5/r.zoom,e.setLineDash([]),e.beginPath(),e.moveTo(o.lineStart.x,o.lineStart.y),e.lineTo(o.lineEnd.x,o.lineEnd.y),e.stroke();let p=4/r.zoom;e.beginPath(),o.orientation==="horizontal"?(e.moveTo(o.lineStart.x,o.lineStart.y-p),e.lineTo(o.lineStart.x,o.lineStart.y+p),e.moveTo(o.lineEnd.x,o.lineEnd.y-p),e.lineTo(o.lineEnd.x,o.lineEnd.y+p)):(e.moveTo(o.lineStart.x-p,o.lineStart.y),e.lineTo(o.lineStart.x+p,o.lineStart.y),e.moveTo(o.lineEnd.x-p,o.lineEnd.y),e.lineTo(o.lineEnd.x+p,o.lineEnd.y)),e.stroke();let c=`${o.gap}`,l=11/r.zoom;e.font=`bold ${l}px -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif`;let s=e.measureText(c).width,n=6/r.zoom,u=s+n*2,i=16/r.zoom,d=o.badgePos.x-u/2,h=o.badgePos.y-i/2;e.fillStyle="#ec4899",typeof e.roundRect=="function"?(e.beginPath(),e.roundRect(d,h,u,i,4/r.zoom),e.fill()):e.fillRect(d,h,u,i),e.fillStyle="#ffffff",e.textAlign="center",e.textBaseline="middle",e.fillText(c,o.badgePos.x,o.badgePos.y);}e.restore();}}function dn({elements:e,setElements:t,selectedIds:r,selectElement:o,selectElements:p,clearSelection:c,addElement:l,updateElement:s,deleteSelectedElements:n,duplicateSelectedElements:u,groupSelectedElements:i,ungroupSelectedElements:d,pushHistory:h,undo:a,redo:x,camera:b,screenToWorld:k,worldToScreen:y,panBy:_,zoomAtPoint:S,tool:P,setTool:R,isToolLocked:I=false,setIsToolLocked:z,gridStyle:$,defaultStyles:w,editingElementId:f,setEditingElementId:v,canvasBackground:C,isPresentationOpen:T=false,laserColor:W="#ef4444",laserMode:le="fading",laserStrokes:L=[],setLaserStrokes:A,laserPointerPos:F=null,setLaserPointerPos:Z}){let be=Ln.useRef(null),U=Ln.useRef(null),{resolvedTheme:E}=Vt(),ee=ao(),te=ee&&E==="dark",ie=na(C,te),[Se,Ke]=Ln.useState(null),X=f!==void 0?f:Se,Oe=Ln.useCallback(H=>{Ke(H),v?.(H);},[v]);function je(H,m,j,ne,G,ce){return ne==="text"?qr(H,m,ce):{width:G,height:0}}let[Ne,_e]=Ln.useState(""),Pe=Ln.useRef(null),he=Ln.useRef(null),ve=Ln.useRef(null),[ue,K]=Ln.useState(null),[Y,Q]=Ln.useState(null),M=Ln.useCallback((H,m)=>{let j=H.type==="table",ne=H.frameLabel||H.text||"";if(j){let G=m||H.editingCell||{row:0,col:0};H.editingCell=G;let ce=`${G.row}_${G.col}`;ne=H.cells?.[ce]?.text||"";}Oe(H.id),_e(ne),setTimeout(()=>{H.type==="frame"?he.current&&(he.current.focus(),he.current.select()):Pe.current&&(Pe.current.focus(),H.type!=="text"&&(Pe.current.style.height="auto",Pe.current.style.height=`${Pe.current.scrollHeight}px`),ne&&Pe.current.select());},50);},[Oe]);Ln.useEffect(()=>{if(X&&X!==ve.current){let H=e.find(m=>m.id===X);if(H){let m=H.frameLabel||H.text||"";if(H.type==="table"){let ne=H.editingCell||{row:0,col:0},G=`${ne.row}_${ne.col}`;m=H.cells?.[G]?.text||"";}let j=setTimeout(()=>{_e(ne=>ne!==m?m:ne),H.type==="frame"?he.current&&(he.current.focus(),he.current.select()):Pe.current&&(Pe.current.focus(),H.type!=="text"&&(Pe.current.style.height="auto",Pe.current.style.height=`${Pe.current.scrollHeight}px`),m&&Pe.current.select());},50);return ve.current=X,()=>clearTimeout(j)}}ve.current=X;},[X,e]),Ln.useLayoutEffect(()=>{if(Pe.current&&X){let H=e.find(m=>m.id===X);if(H&&H.type!=="text"){let m=Pe.current;m.style.height="auto",m.style.height=`${m.scrollHeight}px`;}}},[Ne,X,e,b.zoom]);let pe=Ln.useCallback(H=>{if(!X)return;let m=e.find(ce=>ce.id===X);if(!m){Oe(null);return}if(m.type==="text"&&!Ne.trim()){t(ce=>ce.filter(Be=>Be.id!==X)),Oe(null);return}let j=qt(m.fontFamily),ne=m.fontSize||(m.type==="sticky"?20:22),G={};if(m.type==="table"){let ce=zr(m),Be=m.editingCell?m.editingCell.row:0,Le=m.editingCell?m.editingCell.col:0,He=`${Be}_${Le}`,Re={...m.cells||{}};Re[He]={...Re[He]||{},text:Ne},G.cells=Re;let rt=ce.getCellBounds(Be,Le),V=j.cssFont,xe=m.fontSize||13,Ze=document.createElement("canvas").getContext("2d");if(Ze){Ze.font=`400 ${xe}px ${V}`;let De=Fr(Ze,Ne,rt.width-16),we=Math.max(28,Math.ceil(De.length*(xe*1.35)+12));if(we>ce.rowHeights[Be]){let Ue=[...ce.rowHeights];Ue[Be]=we,G.rowHeights=Ue,G.height=Ue.reduce((Ee,ht)=>Ee+ht,0);}}if(H==="next"){let De=Be,we=Le+1;if(we>=ce.cols&&(we=0,De=Be+1),De>=ce.rows){let ht=[...G.rowHeights||ce.rowHeights,38];G.rows=ce.rows+1,G.rowHeights=ht,G.height=ht.reduce((xt,rr)=>xt+rr,0);}G.editingCell={row:De,col:we};let Ue=`${De}_${we}`,Ee=Re[Ue]?.text||"";s(X,G),_e(Ee),setTimeout(()=>{Pe.current&&(Pe.current.focus(),Pe.current.select());},30);return}else if(H==="prev"){let De=Be,we=Le-1;if(we<0&&(we=ce.cols-1,De=Be-1),De>=0){G.editingCell={row:De,col:we};let Ue=`${De}_${we}`,Ee=Re[Ue]?.text||"";s(X,G),_e(Ee),setTimeout(()=>{Pe.current&&(Pe.current.focus(),Pe.current.select());},30);return}}G.editingCell=void 0;}else if(m.type==="frame")G.frameLabel=Ne.trim()||m.frameLabel||"Frame",G.text=void 0;else if(m.type==="text"){G.text=Ne;let ce=qr(Ne,ne,m.fontFamily),Be=m.width;G.width=ce.width,G.height=ce.height,m.textAlign==="center"?G.x=Math.round(m.x+Be/2-ce.width/2):m.textAlign==="right"&&(G.x=Math.round(m.x+Be-ce.width));}else if(m.type==="sticky"){G.text=Ne;let ce=36,Be=Math.max(10,Math.floor((m.width-32)/(ne*.55))),Le=Ne.split(`
|
|
7
|
+
`),He=0;for(let rt of Le)He+=Math.max(1,Math.ceil(rt.length/Be));let Re=He*(ne*1.35)+ce;Re>m.height&&(G.height=Math.round(Re));}else G.text=Ne;s(X,G),h(e.map(ce=>ce.id===X?{...ce,...G}:ce)),Oe(null);},[X,Ne,s,h,e,t,Oe]),g=Ln.useRef(null),D=Ln.useCallback(H=>{let m=`ls_${Date.now()}_${Math.random().toString(36).substring(2,6)}`;g.current=m;let j={id:m,color:W,mode:le,points:[{x:H.x,y:H.y,timestamp:Date.now()}]};A?.(ne=>[...ne,j]);},[W,le,A]),N=Ln.useCallback(H=>{let m=g.current;if(!m)return;let j={x:H.x,y:H.y,timestamp:Date.now()};A?.(ne=>ne.map(G=>G.id===m?{...G,points:[...G.points,j]}:G));},[A]),se=Ln.useCallback(()=>{g.current=null;},[]),de=Ln.useCallback(H=>{Z?.(H);},[Z]),[oe,O]=Ln.useState(0);Ln.useEffect(()=>{if(!L.some(ne=>ne.mode==="fading"&&ne.points.length>0)&&P!=="laser")return;let m,j=()=>{O(ne=>(ne+1)%1e6),m=requestAnimationFrame(j);};return m=requestAnimationFrame(j),()=>cancelAnimationFrame(m)},[L,P]),Ln.useEffect(()=>{if(!L.some(j=>j.mode==="fading"))return;let m=setInterval(()=>{let j=Date.now();A?.(ne=>ne.filter(G=>G.mode==="persistent"?true:G.points.some(ce=>j-ce.timestamp<1200)));},400);return ()=>clearInterval(m)},[L,A]);let re=ya({tool:P,setTool:R,isToolLocked:I,camera:b,screenToWorld:k,panBy:_,elements:e,setElements:t,selectedIds:r,selectElement:o,selectElements:p,clearSelection:c,addElement:l,deleteSelectedElements:n,duplicateSelectedElements:u,groupSelectedElements:i,ungroupSelectedElements:d,pushHistory:h,undo:a,redo:x,defaultStyles:w,onEditText:M,onLaserDrawStart:D,onLaserDrawMove:N,onLaserDrawEnd:se,onLaserHover:de}),ge=Ln.useRef({x:0,y:0}),Ce=Ln.useCallback(H=>{if(!U.current)return;let m=U.current.getBoundingClientRect(),j={x:H.clientX-m.left,y:H.clientY-m.top},ne=k(j);ge.current=ne;let G=r.length===1&&e.find(Le=>Le.id===r[0])||null,ce=!!(G&&["rectangle","ellipse","diamond","sticky","triangle","capsule","parallelogram","trapezoid","hexagon","cylinder","cloud","star","table","frame"].includes(G.type)),Be=!!re.activeHandle||re.cursor.includes("resize")||re.cursor.includes("grab")||re.cursor==="grabbing"||!!re.marquee;if(Be){Y!==null&&Q(null),ue!==null&&K(null);return}if(G&&ce&&P==="select"&&!X&&!Be){let Le=it(G),{x:He,y:Re,width:rt,height:V}=Le,xe=ne.x,Te=ne.y,Ze=Math.min(36,Math.min(rt,V)*.45),De=42/b.zoom,we=82/b.zoom;if(xe>=He-De&&xe<=He+rt+De&&Te>=Re-we&&Te<=Re+V+De){let Ee=Math.abs(xe-He),ht=Math.abs(xe-(He+rt)),xt=Math.abs(Te-Re),rr=Math.abs(Te-(Re+V)),ur=Math.min(Ee,ht,xt,rr);ur<=Ze+we?ur===ht?Q("right"):ur===rr?Q("bottom"):ur===Ee?Q("left"):ur===xt&&Q("top"):ue||Q(null);}else ue||Q(null);}else Y!==null&&Q(null);},[k,r,e,P,X,b.zoom,ue,Y,re.activeHandle,re.cursor,re.marquee]);Ln.useEffect(()=>(window.addEventListener("mousemove",Ce),()=>window.removeEventListener("mousemove",Ce)),[Ce]),Ln.useEffect(()=>{let H=U.current;if(!H)return;let m=j=>{j.preventDefault();let ne=H.getBoundingClientRect(),G={x:j.clientX-ne.left,y:j.clientY-ne.top};if(j.ctrlKey||j.metaKey){let ce=-j.deltaY*.002,Be=b.zoom*(1+ce);S(Be,G);}else _(-j.deltaX,-j.deltaY);};return H.addEventListener("wheel",m,{passive:false}),()=>{H.removeEventListener("wheel",m);}},[b.zoom,S,_]),Ln.useEffect(()=>{let H=m=>{(m.ctrlKey||m.metaKey)&&m.preventDefault();};return window.addEventListener("wheel",H,{passive:false}),()=>{window.removeEventListener("wheel",H);}},[]);let Ie=Ln.useCallback((H,m)=>{let j=new Image;j.crossOrigin="anonymous",j.onload=()=>{let ne=j.naturalWidth||400,G=j.naturalHeight||300,ce=ne,Be=G,Le=600;(ce>Le||Be>Le)&&(ce>=Be?(Be=Math.round(Be/ce*Le),ce=Le):(ce=Math.round(ce/Be*Le),Be=Le));let He=m;if(!He)if(U.current){let xe=U.current.getBoundingClientRect();He=k({x:xe.width/2,y:xe.height/2});}else He={x:0,y:0};let Re=`el_${Date.now()}_${Math.random().toString(36).substring(2,7)}`,rt=e.reduce((xe,Te)=>Math.max(xe,Te.zIndex??0),0),V={...w,id:Re,type:"image",x:Math.round(He.x-ce/2),y:Math.round(He.y-Be/2),width:ce,height:Be,dataUrl:H,naturalWidth:ne,naturalHeight:G,aspectRatioLocked:true,opacity:1,zIndex:rt+1};l(V),p([Re]),R("select"),h([...e,V]);},j.src=H;},[w,e,l,p,R,h,k]),Rt=Ln.useRef([]);Ln.useEffect(()=>{let H=m=>{if(!(m.target instanceof HTMLInputElement||m.target instanceof HTMLTextAreaElement||m.target.isContentEditable)&&r.length>0){let j=e.filter(ne=>r.includes(ne.id));if(j.length>0){Rt.current=j;try{let ne=JSON.stringify({filekitSketchBoardElements:!0,elements:j});m.clipboardData?.setData("text/plain",ne),m.preventDefault();}catch(ne){console.warn("Could not copy elements to clipboard:",ne);}}}};return window.addEventListener("copy",H),()=>window.removeEventListener("copy",H)},[e,r]),Ln.useEffect(()=>{let H=m=>{if(m.target instanceof HTMLInputElement||m.target instanceof HTMLTextAreaElement||m.target.isContentEditable)return;let j=m.clipboardData;if(!j)return;let ne=j.getData("text/plain"),G=null;if(ne)try{let Le=JSON.parse(ne);Le&&Le.filekitSketchBoardElements&&Array.isArray(Le.elements)&&(G=Le.elements);}catch{}if(!G&&Rt.current.length>0&&(G=Rt.current),G&&G.length>0){m.preventDefault();let Le=e.reduce((Ze,De)=>Math.max(Ze,De.zIndex??0),0),He=ge.current,Re=24,rt=24;if(He){let Ze=Math.min(...G.map(xt=>xt.x)),De=Math.min(...G.map(xt=>xt.y)),we=Math.max(...G.map(xt=>xt.x+xt.width)),Ue=Math.max(...G.map(xt=>xt.y+xt.height)),Ee=(Ze+we)/2,ht=(De+Ue)/2;Re=Math.round(He.x-Ee),rt=Math.round(He.y-ht);}let{clonedElements:V,newSelectedIds:xe}=Mr(G,{deltaX:Re,deltaY:rt,highestZ:Le}),Te=bt([...e,...V]);t(Te),p(xe),R("select"),h(Te);return}let Be=Array.from(j.items).find(Le=>Le.type.startsWith("image/"));if(Be){m.preventDefault();let Le=Be.getAsFile();if(Le){let He=new FileReader;He.onload=Re=>{let rt=Re.target?.result;rt&&Ie(rt,ge.current);},He.readAsDataURL(Le);}}};return window.addEventListener("paste",H),()=>window.removeEventListener("paste",H)},[e,Ie,h,p,t,R]);let[nt,lt]=Ln.useState(false),Nt=H=>{H.preventDefault(),H.stopPropagation(),H.dataTransfer.types.includes("Files")&&!nt&<(true);},Kt=H=>{H.preventDefault(),H.stopPropagation(),H.dataTransfer.types.includes("Files")&<(true);},zt=H=>{H.preventDefault(),H.stopPropagation(),(H.currentTarget===H.target||!H.currentTarget.contains(H.relatedTarget))&<(false);},Dt=H=>{H.preventDefault(),H.stopPropagation(),lt(false);let m=Array.from(H.dataTransfer.files);if(m.length===0)return;let j=H.currentTarget.getBoundingClientRect(),ne=k({x:H.clientX-j.left,y:H.clientY-j.top});m.forEach((G,ce)=>{if(G.type.startsWith("image/")||/\.(png|jpe?g|svg|webp|gif)$/i.test(G.name)){let Le=new FileReader;Le.onload=He=>{let Re=He.target?.result;if(Re){let rt={x:ne.x+ce*24,y:ne.y+ce*24};Ie(Re,rt);}},Le.readAsDataURL(G);}});},fr=H=>{let m=H.currentTarget.getBoundingClientRect(),j={x:H.clientX-m.left,y:H.clientY-m.top},ne=k(j),G=Lr(ne,e,10/b.zoom);if(G){let ce=!!(G.groupIds&&G.groupIds.length>0),Be=r.length===1&&r[0]===G.id;if(ce&&!Be){p([G.id]);return}if(p([G.id]),G.type==="table"){let Le=fa(G,ne);Le.type==="cell"?M(G,{row:Le.row,col:Le.col}):M(G,{row:0,col:0});}else ["rectangle","ellipse","diamond","triangle","capsule","parallelogram","trapezoid","hexagon","cylinder","cloud","star","sticky","text","frame"].includes(G.type)&&M(G);}};Ln.useEffect(()=>{let H=()=>{if(!be.current||!U.current)return;let{clientWidth:m,clientHeight:j}=be.current,ne=window.devicePixelRatio||1;U.current.width=m*ne,U.current.height=j*ne,U.current.style.width=`${m}px`,U.current.style.height=`${j}px`;};return H(),window.addEventListener("resize",H),()=>window.removeEventListener("resize",H)},[]);let[pr,gr]=Ln.useState(0);Ln.useEffect(()=>{let H=()=>gr(m=>(m+1)%1e4);return window.addEventListener("sketch-redraw-canvas",H),()=>window.removeEventListener("sketch-redraw-canvas",H)},[]),Ln.useEffect(()=>{if(typeof document>"u"||!document.fonts)return;let H=['400 16px "Fuzzy Bubbles"','700 16px "Fuzzy Bubbles"','400 16px "Comic Neue"','700 16px "Comic Neue"','400 16px "Patrick Hand SC"'],m=()=>{gr(j=>(j+1)%1e4),t(j=>{let ne=false,G=j.map(ce=>{if(ce.type==="text"&&ce.text){let Be=qr(ce.text,ce.fontSize||22,ce.fontFamily);if(Math.abs(Be.width-ce.width)>3||Math.abs(Be.height-ce.height)>2){ne=true;let Le=ce.width,He={...ce,width:Be.width,height:Be.height};return ce.textAlign==="center"?He.x=Math.round(ce.x+Le/2-Be.width/2):ce.textAlign==="right"&&(He.x=Math.round(ce.x+Le-Be.width)),He}}return ce});return ne?G:j});};return Promise.allSettled(H.map(j=>document.fonts.load(j))).then(()=>{m();}),document.fonts.ready.then(m),document.fonts.addEventListener?.("loadingdone",m),()=>{document.fonts.removeEventListener?.("loadingdone",m);}},[]),Ln.useEffect(()=>{let H=U.current;if(!H)return;let m=H.getContext("2d");if(!m)return;let j=window.devicePixelRatio||1,ne=H.width/j,G=H.height/j;if(m.save(),m.scale(j,j),m.clearRect(0,0,ne,G),ie&&ie!=="transparent"&&(m.fillStyle=ie,m.fillRect(0,0,ne,G)),$==="dots"){let V=24;for(;V*b.zoom<16;)V*=2;for(;V*b.zoom>64;)V/=2;let xe=V*b.zoom,Te=(b.x%xe+xe)%xe,Ze=(b.y%xe+xe)%xe,De=Math.max(.75,Math.min(1.4,1.05*Math.sqrt(Math.max(.2,b.zoom))));m.fillStyle=te?"rgba(255, 255, 255, 0.13)":"rgba(0, 0, 0, 0.12)",m.beginPath();for(let we=Te;we<ne;we+=xe)for(let Ue=Ze;Ue<G;Ue+=xe)m.moveTo(we+De,Ue),m.arc(we,Ue,De,0,Math.PI*2);m.fill();}else if($==="grid"){let V=20;for(;V*b.zoom<14;)V*=2;for(;V*b.zoom>56;)V/=2;let xe=V*b.zoom,Te=xe*5,Ze=(b.x%xe+xe)%xe,De=(b.y%xe+xe)%xe;m.strokeStyle=te?"rgba(255, 255, 255, 0.075)":"rgba(0, 0, 0, 0.08)",m.lineWidth=1,m.setLineDash([1.5,3.5]),m.beginPath();for(let Ee=Ze;Ee<ne;Ee+=xe)m.moveTo(Ee,0),m.lineTo(Ee,G);for(let Ee=De;Ee<G;Ee+=xe)m.moveTo(0,Ee),m.lineTo(ne,Ee);m.stroke();let we=(b.x%Te+Te)%Te,Ue=(b.y%Te+Te)%Te;m.strokeStyle=te?"rgba(255, 255, 255, 0.04)":"rgba(0, 0, 0, 0.04)",m.setLineDash([]),m.beginPath();for(let Ee=we;Ee<ne;Ee+=Te)m.moveTo(Ee,0),m.lineTo(Ee,G);for(let Ee=Ue;Ee<G;Ee+=Te)m.moveTo(0,Ee),m.lineTo(ne,Ee);m.stroke();}else if($==="cross"){let V=32;for(;V*b.zoom<20;)V*=2;for(;V*b.zoom>80;)V/=2;let xe=V*b.zoom,Te=(b.x%xe+xe)%xe,Ze=(b.y%xe+xe)%xe;m.strokeStyle=te?"rgba(255, 255, 255, 0.11)":"rgba(0, 0, 0, 0.09)",m.lineWidth=1,m.setLineDash([]),m.beginPath();for(let De=Te;De<ne;De+=xe)for(let we=Ze;we<G;we+=xe)m.moveTo(De-3,we),m.lineTo(De+3,we),m.moveTo(De,we-3),m.lineTo(De,we+3);m.stroke();}m.save(),m.translate(b.x,b.y),m.scale(b.zoom,b.zoom);let ce=-b.x/b.zoom,Be=-b.y/b.zoom,Le=(ne-b.x)/b.zoom,He=(G-b.y)/b.zoom,Re=100,rt=[...e].sort((V,xe)=>(V.zIndex??0)-(xe.zIndex??0));for(let V of rt){let xe=Math.min(V.x,V.x+V.width),Te=Math.max(V.x,V.x+V.width),Ze=Math.min(V.y,V.y+V.height),De=Math.max(V.y,V.y+V.height);Te<ce-Re||xe>Le+Re||De<Be-Re||Ze>He+Re||Hr(m,V,1,V.id===X,te);}if(!T){for(let V of r){if(V===X)continue;let xe=e.find(we=>we.id===V);if(!xe)continue;let Te=it(xe),Ze=Te.x+Te.width/2,De=Te.y+Te.height/2;if(m.save(),xe.rotation&&(m.translate(Ze,De),m.rotate(xe.rotation),m.translate(-Ze,-De)),r.length===1){m.strokeStyle="#0b6eff",m.lineWidth=1.5/b.zoom,m.setLineDash([4/b.zoom,4/b.zoom]),m.strokeRect(Te.x-4,Te.y-4,Te.width+8,Te.height+8),m.setLineDash([]);let we=3.25/b.zoom,Ue=po({...xe,rotation:0});for(let Ee of Ue)Ee.type==="start"||Ee.type==="end"||Ee.type==="middle"||Ee.type==="control1"||Ee.type==="control2"?(m.beginPath(),m.arc(Ee.x,Ee.y,we*1.3,0,Math.PI*2),m.fillStyle="#ffffff",m.fill(),m.strokeStyle="#0b6eff",m.lineWidth=1.5/b.zoom,m.stroke(),m.beginPath(),m.arc(Ee.x,Ee.y,we*.5,0,Math.PI*2),m.fillStyle="#0b6eff",m.fill()):Ee.type==="rotate"?(m.beginPath(),m.moveTo(Ze,Te.y-4),m.lineTo(Ze,Te.y-20),m.strokeStyle="#0b6eff",m.lineWidth=1.1/b.zoom,m.stroke(),m.beginPath(),m.arc(Ze,Te.y-20,we*1.1,0,Math.PI*2),m.fillStyle="#ffffff",m.fill(),m.strokeStyle="#0b6eff",m.lineWidth=1.5/b.zoom,m.stroke()):(m.fillStyle="#ffffff",m.fillRect(Ee.x-we,Ee.y-we,we*2,we*2),m.strokeStyle="#0b6eff",m.lineWidth=1.2/b.zoom,m.strokeRect(Ee.x-we,Ee.y-we,we*2,we*2));}else m.strokeStyle="rgba(105, 101, 219, 0.45)",m.lineWidth=1/b.zoom,m.setLineDash([3/b.zoom,3/b.zoom]),m.strokeRect(Te.x-3,Te.y-3,Te.width+6,Te.height+6),m.setLineDash([]);m.restore();}if(r.length>1){let V=e.filter(Te=>r.includes(Te.id)),xe=Yr(V,8);if(xe){m.save(),m.fillStyle=te?"rgba(105, 101, 219, 0.05)":"rgba(105, 101, 219, 0.035)",m.fillRect(xe.x,xe.y,xe.width,xe.height),m.strokeStyle="#0b6eff",m.lineWidth=1.8/b.zoom,m.setLineDash([6/b.zoom,4/b.zoom]),m.strokeRect(xe.x,xe.y,xe.width,xe.height),m.setLineDash([]);let Te=V.length>0&&V[0].groupIds&&V[0].groupIds.length>0?V[0].groupIds[V[0].groupIds.length-1]:null,De=Te!==null&&V.every(Ut=>Ut.groupIds&&Ut.groupIds.includes(Te))?"Group":"Selection",we=Math.max(9,Math.min(13,10.5/b.zoom));m.font=`600 ${we}px -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif`;let Ue=m.measureText(De).width,Ee=6/b.zoom,ht=Ue+Ee*2,xt=16/b.zoom,rr=xe.x,ur=xe.y-xt-3/b.zoom;m.fillStyle="#0b6eff",typeof m.roundRect=="function"?(m.beginPath(),m.roundRect(rr,ur,ht,xt,4/b.zoom),m.fill()):m.fillRect(rr,ur,ht,xt),m.fillStyle="#ffffff",m.textAlign="center",m.textBaseline="middle",m.fillText(De,rr+ht/2,ur+xt/2);let Zo=ho(xe),Yt=3.25/b.zoom;for(let Ut of Zo)if(Ut.type==="rotate"){let Pr=xe.x+xe.width/2;m.beginPath(),m.moveTo(Pr,xe.y),m.lineTo(Pr,xe.y-20/b.zoom),m.strokeStyle="#0b6eff",m.lineWidth=1.1/b.zoom,m.stroke(),m.beginPath(),m.arc(Pr,xe.y-20/b.zoom,Yt*1.1,0,Math.PI*2),m.fillStyle="#ffffff",m.fill(),m.strokeStyle="#0b6eff",m.lineWidth=1.5/b.zoom,m.stroke();}else m.fillStyle="#ffffff",m.fillRect(Ut.x-Yt,Ut.y-Yt,Yt*2,Yt*2),m.strokeStyle="#0b6eff",m.lineWidth=1.2/b.zoom,m.strokeRect(Ut.x-Yt,Ut.y-Yt,Yt*2,Yt*2);m.restore();}}}if(re.hoveredAnchor){let{elementId:V,point:xe}=re.hoveredAnchor,Te=e.find(Ze=>Ze.id===V);if(Te){m.save();let Ze=Ro(Te);for(let[De,we]of Object.entries(Ze)){if(De==="center")continue;let Ue=Math.abs(we.x-xe.x)<.1&&Math.abs(we.y-xe.y)<.1,Ee=(Ue?5:3)/b.zoom;m.beginPath(),m.arc(we.x,we.y,Ee,0,Math.PI*2),m.fillStyle=Ue?"#6366f1":te?"rgba(255, 255, 255, 0.45)":"rgba(99, 102, 241, 0.35)",m.fill(),m.strokeStyle=Ue?"#ffffff":te?"rgba(255, 255, 255, 0.65)":"rgba(79, 70, 229, 0.55)",m.lineWidth=(Ue?1.5:1)/b.zoom,m.stroke(),Ue&&(m.beginPath(),m.arc(we.x,we.y,(Ee+4)/b.zoom,0,Math.PI*2),m.strokeStyle="rgba(99, 102, 241, 0.45)",m.lineWidth=2/b.zoom,m.stroke());}m.restore();}}if(re.marquee){let{startX:V,startY:xe,currentX:Te,currentY:Ze}=re.marquee,De=Math.min(V,Te),we=Math.min(xe,Ze),Ue=Math.abs(Te-V),Ee=Math.abs(Ze-xe);m.fillStyle="rgba(11, 110, 255, 0.12)",m.fillRect(De,we,Ue,Ee),m.strokeStyle="#0b6eff",m.lineWidth=1/b.zoom,m.setLineDash([3/b.zoom,3/b.zoom]),m.strokeRect(De,we,Ue,Ee),m.setLineDash([]);}re.alignmentGuides&&re.alignmentGuides.length>0&&Di(m,re.alignmentGuides,b),re.spacingGuides&&re.spacingGuides.length>0&&Wi(m,re.spacingGuides,b),L&&L.length>0&&Ai(m,L,b,Date.now()),P==="laser"&&F&&Ri(m,F,W,b),m.restore(),m.restore();},[e,b,r,$,ie,E,ee,re.marquee,re.hoveredAnchor,re.alignmentGuides,re.spacingGuides,L,F,W,P,T,oe,pr]);let kt=r.length===1&&e.find(H=>H.id===r[0])||null,qe=!!(kt&&["rectangle","ellipse","diamond","triangle","capsule","parallelogram","trapezoid","hexagon","cylinder","cloud","star","table","sticky","frame"].includes(kt.type)),Bt=Ln.useCallback(H=>{if(!kt||!qe)return;let m=kt,j=it(m),ne=80,G=j.x,ce=j.y,Be="right",Le="left",He={x:j.x+j.width,y:j.y+j.height/2},Re={x:j.x+j.width+ne,y:j.y+j.height/2};H==="right"?(G=j.x+j.width+ne,ce=j.y,Be="right",Le="left",He={x:j.x+j.width,y:j.y+j.height/2},Re={x:G,y:ce+j.height/2}):H==="bottom"?(G=j.x,ce=j.y+j.height+ne,Be="bottom",Le="top",He={x:j.x+j.width/2,y:j.y+j.height},Re={x:G+j.width/2,y:ce}):H==="left"?(G=j.x-j.width-ne,ce=j.y,Be="left",Le="right",He={x:j.x,y:j.y+j.height/2},Re={x:G+j.width,y:ce+j.height/2}):H==="top"&&(G=j.x,ce=j.y-j.height-ne,Be="top",Le="bottom",He={x:j.x+j.width/2,y:j.y},Re={x:G+j.width/2,y:ce+j.height});let rt=`el_${Date.now()}_${Math.random().toString(36).substring(2,7)}`,V=`el_${Date.now()+1}_${Math.random().toString(36).substring(2,7)}`,xe=e.reduce((Ue,Ee)=>Math.max(Ue,Ee.zIndex??0),0),Te=m.type==="frame",Ze={...m,id:rt,x:G,y:ce,zIndex:xe+2,text:"",frameLabel:Te?`Frame ${e.filter(Ue=>Ue.type==="frame").length+1}`:m.frameLabel},De={id:V,type:"arrow",x:He.x,y:He.y,width:Re.x-He.x,height:Re.y-He.y,strokeColor:m.strokeColor||"#1e1e24",strokeWidth:2,strokeStyle:"solid",fillColor:"transparent",fillStyle:"transparent",opacity:1,zIndex:xe+1,arrowType:"straight",endArrowhead:true,startBinding:{elementId:m.id,anchor:Be},endBinding:{elementId:rt,anchor:Le}},we=[...e,De,Ze];t(we),h(we),o(rt);},[kt,qe,e,t,h,o]);Ln.useEffect(()=>{let H=m=>{X||["INPUT","TEXTAREA"].includes(m.target?.tagName)||(m.ctrlKey||m.metaKey)&&(m.key==="ArrowRight"?(m.preventDefault(),Bt("right")):m.key==="ArrowDown"?(m.preventDefault(),Bt("bottom")):m.key==="ArrowLeft"?(m.preventDefault(),Bt("left")):m.key==="ArrowUp"&&(m.preventDefault(),Bt("top")));};return window.addEventListener("keydown",H),()=>window.removeEventListener("keydown",H)},[X,Bt]);let Fe=e.find(H=>H.id===X),er=Fe?y({x:Fe.width<0?Fe.x+Fe.width:Fe.x,y:Fe.height<0?Fe.y+Fe.height:Fe.y}):null,pt=Fe?qt(Fe.fontFamily):hr[0],Wr=Ln.useMemo(()=>{if(!Fe)return 22;let H=Fe.fontSize||(Fe.type==="sticky"?20:22);if(Fe.type==="text"||Fe.type==="frame"||typeof window>"u")return H;let j=document.createElement("canvas").getContext("2d");if(!j)return H;let ne=Ao(Fe),G=H,ce=9,Be=pt.value==="fuzzy"||pt.value==="edusa",He=pt.value==="patrick"||pt.value==="comic"||pt.value==="handlee"?"400":Be?"700":"600",Re=Ne||Fe.text||"";j.font=`normal ${He} ${G}px ${pt.cssFont}`;let rt=Fr(j,Re,ne.boxW),V=G*1.35;for(;(rt.length*V>ne.boxH||rt.some(xe=>j.measureText(xe).width>ne.boxW))&&G>ce;)G-=.75,j.font=`normal ${He} ${G}px ${pt.cssFont}`,rt=Fr(j,Re,ne.boxW),V=G*1.35;return G},[Fe,Ne,pt.cssFont,pt.value]),tr=Fe?je(Ne||" ",Wr,pt.cssFont,Fe.type,Fe.width,Fe.fontFamily):{width:140,height:36};return jsxRuntime.jsxs("div",{ref:be,onDragOver:Nt,onDragEnter:Kt,onDragLeave:zt,onDrop:Dt,className:"relative w-full h-full overflow-hidden select-none",style:{backgroundColor:ie,cursor:re.cursor},children:[nt&&jsxRuntime.jsx("div",{className:"absolute inset-0 z-50 pointer-events-none flex flex-col items-center justify-center bg-primary/10 dark:bg-primary/15 backdrop-blur-[2px] border-4 border-dashed border-primary/60 dark:border-primary/70 transition-all duration-200",children:jsxRuntime.jsxs("div",{className:"flex flex-col items-center gap-3 px-8 py-6 rounded-2xl bg-white/95 dark:bg-neutral-900/95 shadow-2xl border border-primary/30",children:[jsxRuntime.jsx("div",{className:"w-16 h-16 rounded-full bg-primary/15 dark:bg-primary/25 flex items-center justify-center text-primary animate-bounce",children:jsxRuntime.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",className:"w-8 h-8",viewBox:"0 0 24 24",strokeWidth:"2",stroke:"currentColor",fill:"none",strokeLinecap:"round",strokeLinejoin:"round",children:[jsxRuntime.jsx("path",{stroke:"none",d:"M0 0h24v24H0z",fill:"none"}),jsxRuntime.jsx("path",{d:"M15 8h.01"}),jsxRuntime.jsx("path",{d:"M3 6a3 3 0 0 1 3 -3h12a3 3 0 0 1 3 3v12a3 3 0 0 1 -3 3h-12a3 3 0 0 1 -3 -3v-12z"}),jsxRuntime.jsx("path",{d:"M3 16l5 -5c.928 -.893 2.072 -.893 3 0l5 5"}),jsxRuntime.jsx("path",{d:"M14 14l1 -1c.928 -.893 2.072 -.893 3 0l3 3"})]})}),jsxRuntime.jsx("p",{className:"text-base font-bold text-neutral-800 dark:text-neutral-100",children:"Drop image to add onto canvas"}),jsxRuntime.jsx("p",{className:"text-xs text-neutral-500 dark:text-neutral-400",children:"Supports PNG, JPG, SVG, WebP, GIF"})]})}),jsxRuntime.jsx("canvas",{ref:U,onPointerDown:re.onPointerDown,onPointerMove:re.onPointerMove,onPointerUp:re.onPointerUp,onDoubleClick:fr,className:"block touch-none"}),Fe&&er&&(Fe.type==="frame"?jsxRuntime.jsx("div",{className:"absolute z-30 pointer-events-auto flex items-center justify-end",style:{left:`${er.x+Math.abs(Fe.width)*b.zoom-160}px`,top:`${er.y-28*b.zoom-4}px`,width:"160px",height:`${28*b.zoom}px`},children:jsxRuntime.jsx("input",{ref:he,type:"text",value:Ne,placeholder:"Frame title...",onChange:H=>_e(H.target.value),onBlur:()=>pe(),onPointerDown:H=>H.stopPropagation(),onKeyDown:H=>{H.stopPropagation(),(H.key==="Enter"||H.key==="Escape")&&pe();},onKeyUp:H=>H.stopPropagation(),className:"w-full px-2.5 py-1 rounded-[6px] text-xs font-semibold bg-white dark:bg-[#181818] text-neutral-900 dark:text-neutral-100 border-2 border-primary shadow-lg outline-none cursor-text select-text",style:{fontSize:`${Math.max(11,12*b.zoom)}px`,height:`${28*b.zoom}px`}})}):Fe.type==="text"?jsxRuntime.jsx("div",{className:"absolute z-30 pointer-events-auto",style:{left:`${er.x}px`,top:`${er.y}px`,width:`${tr.width*b.zoom}px`,height:`${tr.height*b.zoom}px`,transform:Fe.rotation?`rotate(${Fe.rotation}rad)`:void 0,transformOrigin:"top left",boxSizing:"border-box"},children:jsxRuntime.jsx("textarea",{ref:Pe,value:Ne,onChange:H=>_e(H.target.value),onBlur:()=>pe(),onKeyDown:H=>{H.key==="Enter"&&(H.metaKey||H.ctrlKey)&&pe(),H.key==="Escape"&&pe();},className:"w-full h-full bg-transparent border-0 outline-none shadow-none resize-none select-text cursor-text focus:ring-0",style:{fontFamily:pt.cssFont,fontSize:`${Wr*b.zoom}px`,lineHeight:1.35,textAlign:Fe.textAlign||"left",color:vt(Fe.strokeColor||"#1e1e24",te),caretColor:vt(Fe.strokeColor||"#0b6eff",te),fontWeight:pt.value==="patrick"||pt.value==="comic"||pt.value==="handlee"||pt.value==="fuzzy"||pt.value==="edusa"?400:500,padding:`0px ${4*b.zoom}px`,margin:"0px",boxSizing:"border-box",whiteSpace:"pre",overflow:"hidden"}})}):(()=>{let H=Ao(Fe),m=y({x:H.boxX,y:H.boxY}),j=Fe.type==="sticky",ne=j?Fe.strokeColor&&Fe.strokeColor!=="transparent"?vt(Fe.strokeColor,te):vr(Fe.stickyColor||Fe.fillColor,te).text:vt(Fe.strokeColor||"#1e1e24",te),G=j?ne:vt(Fe.strokeColor||"#0b6eff",te);return jsxRuntime.jsx("div",{className:"absolute z-30 pointer-events-auto",style:{left:`${m.x}px`,top:`${m.y}px`,width:`${H.boxW*b.zoom}px`,height:`${H.boxH*b.zoom}px`,transform:Fe.rotation?`rotate(${Fe.rotation}rad)`:void 0,transformOrigin:"center center",boxSizing:"border-box",display:"flex",alignItems:"center",justifyContent:"center",overflow:"hidden"},children:jsxRuntime.jsx("textarea",{ref:Pe,value:Ne,placeholder:j?"Type a note...":"Type text...",onChange:ce=>{_e(ce.target.value),Pe.current&&(Pe.current.style.height="auto",Pe.current.style.height=`${Pe.current.scrollHeight}px`);},onBlur:()=>pe(),onKeyDown:ce=>{if(Fe.type==="table"&&ce.key==="Tab"){ce.preventDefault(),ce.shiftKey?pe("prev"):pe("next");return}ce.key==="Enter"&&(ce.metaKey||ce.ctrlKey)&&pe(),ce.key==="Escape"&&pe();},className:"w-full bg-transparent border-0 outline-none shadow-none resize-none select-text cursor-text focus:ring-0",style:{fontFamily:pt.cssFont,fontSize:`${Wr*b.zoom}px`,lineHeight:1.35,textAlign:Fe.textAlign||"center",color:ne,caretColor:G,fontWeight:pt.value==="patrick"||pt.value==="comic"||pt.value==="handlee"?400:pt.value==="fuzzy"||pt.value==="edusa"?700:600,padding:"0px",margin:"0px",boxSizing:"border-box",whiteSpace:"pre-wrap",wordBreak:"break-word",overflowWrap:"break-word",overflow:"hidden",maxHeight:"100%"}})})})()),!T&&qe&&kt&&!X&&P==="select"&&!re.activeHandle&&!re.cursor.includes("resize")&&!re.cursor.includes("grab")&&!re.cursor.includes("grabbing")&&!re.marquee&&(()=>{let H=it(kt),m=y({x:H.x,y:H.y}),j=H.width*b.zoom,ne=H.height*b.zoom,G=80*b.zoom,ce=kt.type==="sticky",Be=kt.type==="ellipse",Le=kt.type==="diamond",He=kt.type==="parallelogram";kt.type==="star";let rt=V=>Le?jsxRuntime.jsxs("div",{className:"relative w-full h-full flex items-center justify-center",children:[jsxRuntime.jsx("svg",{className:"absolute inset-0 w-full h-full pointer-events-none overflow-visible",viewBox:"0 0 100 100",preserveAspectRatio:"none",children:jsxRuntime.jsx("polygon",{points:"50,1 99,50 50,99 1,50",className:"fill-neutral-500/10 dark:fill-white/[0.04] stroke-neutral-400/50 dark:stroke-neutral-600/60",strokeWidth:"2",strokeDasharray:"5 4",vectorEffect:"non-scaling-stroke"})}),jsxRuntime.jsxs("div",{className:"relative z-10 flex items-center gap-1.5 px-2 py-1 rounded-[6px] bg-neutral-900/85 dark:bg-neutral-950/90 text-white text-[11px] font-semibold tracking-wide shadow-md border border-white/15",children:[jsxRuntime.jsx("span",{children:V[0]}),jsxRuntime.jsx("span",{className:"text-[12px] leading-none",children:V[1]})]})]}):He?jsxRuntime.jsxs("div",{className:"relative w-full h-full flex items-center justify-center",children:[jsxRuntime.jsx("svg",{className:"absolute inset-0 w-full h-full pointer-events-none overflow-visible",viewBox:"0 0 100 100",preserveAspectRatio:"none",children:jsxRuntime.jsx("polygon",{points:"20,0 100,0 80,100 0,100",className:"fill-neutral-500/10 dark:fill-white/[0.04] stroke-neutral-400/50 dark:stroke-neutral-600/60",strokeWidth:"2",strokeDasharray:"5 4",vectorEffect:"non-scaling-stroke"})}),jsxRuntime.jsxs("div",{className:"relative z-10 flex items-center gap-1.5 px-2 py-1 rounded-[6px] bg-neutral-900/85 dark:bg-neutral-950/90 text-white text-[11px] font-semibold tracking-wide shadow-md border border-white/15",children:[jsxRuntime.jsx("span",{children:V[0]}),jsxRuntime.jsx("span",{className:"text-[12px] leading-none",children:V[1]})]})]}):jsxRuntime.jsx("div",{className:`w-full h-full flex items-center justify-center border-2 border-dashed transition-all ${ce?"rounded-[6px] bg-amber-400/10 dark:bg-amber-400/5 border-amber-400/40 shadow-xs":Be?"rounded-full bg-neutral-500/10 dark:bg-white/[0.04] border-neutral-400/40 dark:border-neutral-600/50 shadow-xs":"rounded-[10px] bg-neutral-500/10 dark:bg-white/[0.04] border-neutral-400/40 dark:border-neutral-600/50 shadow-xs"}`,children:jsxRuntime.jsxs("div",{className:"flex items-center gap-1.5 px-2 py-1 rounded-[6px] bg-neutral-900/85 dark:bg-neutral-950/90 text-white text-[11px] font-semibold tracking-wide shadow-md border border-white/15",children:[jsxRuntime.jsx("span",{children:V[0]}),jsxRuntime.jsx("span",{className:"text-[12px] leading-none",children:V[1]})]})});return jsxRuntime.jsxs("div",{className:"absolute pointer-events-none z-20",style:{left:m.x,top:m.y,width:j,height:ne,transform:kt.rotation?`rotate(${kt.rotation}rad)`:void 0,transformOrigin:"center center"},children:[(Y==="right"||ue==="right")&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("button",{type:"button",onClick:V=>{V.stopPropagation(),Bt("right");},onPointerDown:V=>V.stopPropagation(),onMouseDown:V=>V.stopPropagation(),onMouseEnter:()=>K("right"),onMouseLeave:()=>K(null),title:"Add connected shape to the right (Ctrl + \u2192)",className:"absolute -translate-x-1/2 -translate-y-1/2 z-20 pointer-events-auto w-6 h-6 rounded-full bg-white dark:bg-[#1e1e24] shadow-md border border-neutral-300 dark:border-neutral-600 text-neutral-700 dark:text-neutral-200 hover:bg-primary hover:border-primary hover:text-white dark:hover:text-white flex items-center justify-center hover:scale-115 transition-all duration-150 cursor-pointer animate-in fade-in zoom-in-90",style:{left:j+28,top:ne/2},children:jsxRuntime.jsx(iconsReact.IconPlus,{size:13,stroke:2.6})}),ue==="right"&&jsxRuntime.jsxs("div",{className:"absolute z-10 pointer-events-auto cursor-pointer animate-in fade-in duration-100",style:{left:j+16,top:0,width:Math.max(0,G+j-16),height:ne},onClick:V=>{V.stopPropagation(),Bt("right");},onPointerDown:V=>V.stopPropagation(),onMouseDown:V=>V.stopPropagation(),onMouseEnter:()=>K("right"),onMouseLeave:()=>K(null),children:[jsxRuntime.jsxs("svg",{className:"absolute overflow-visible pointer-events-none",style:{left:-16,top:ne/2-8,width:G,height:16},children:[jsxRuntime.jsx("line",{x1:0,y1:8,x2:G-3,y2:8,stroke:te?"rgba(255,255,255,0.4)":"rgba(0,0,0,0.35)",strokeWidth:1.5}),jsxRuntime.jsx("polyline",{points:`${G-7},4 ${G-1},8 ${G-7},12`,fill:"none",stroke:te?"rgba(255,255,255,0.4)":"rgba(0,0,0,0.35)",strokeWidth:1.5})]}),jsxRuntime.jsx("div",{className:"absolute",style:{left:G-16,top:0,width:j,height:ne},children:rt(["Ctrl","\u2192"])})]})]}),(Y==="bottom"||ue==="bottom")&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("button",{type:"button",onClick:V=>{V.stopPropagation(),Bt("bottom");},onPointerDown:V=>V.stopPropagation(),onMouseDown:V=>V.stopPropagation(),onMouseEnter:()=>K("bottom"),onMouseLeave:()=>K(null),title:"Add connected shape below (Ctrl + \u2193)",className:"absolute -translate-x-1/2 -translate-y-1/2 z-20 pointer-events-auto w-6 h-6 rounded-full bg-white dark:bg-[#1e1e24] shadow-md border border-neutral-300 dark:border-neutral-600 text-neutral-700 dark:text-neutral-200 hover:bg-primary hover:border-primary hover:text-white dark:hover:text-white flex items-center justify-center hover:scale-115 transition-all duration-150 cursor-pointer animate-in fade-in zoom-in-90",style:{left:j/2,top:ne+28},children:jsxRuntime.jsx(iconsReact.IconPlus,{size:13,stroke:2.6})}),ue==="bottom"&&jsxRuntime.jsxs("div",{className:"absolute z-10 pointer-events-auto cursor-pointer animate-in fade-in duration-100",style:{left:0,top:ne+16,width:j,height:Math.max(0,G+ne-16)},onClick:V=>{V.stopPropagation(),Bt("bottom");},onPointerDown:V=>V.stopPropagation(),onMouseDown:V=>V.stopPropagation(),onMouseEnter:()=>K("bottom"),onMouseLeave:()=>K(null),children:[jsxRuntime.jsxs("svg",{className:"absolute overflow-visible pointer-events-none",style:{left:j/2-8,top:-16,width:16,height:G},children:[jsxRuntime.jsx("line",{x1:8,y1:0,x2:8,y2:G-3,stroke:te?"rgba(255,255,255,0.4)":"rgba(0,0,0,0.35)",strokeWidth:1.5}),jsxRuntime.jsx("polyline",{points:`4,${G-7} 8,${G-1} 12,${G-7}`,fill:"none",stroke:te?"rgba(255,255,255,0.4)":"rgba(0,0,0,0.35)",strokeWidth:1.5})]}),jsxRuntime.jsx("div",{className:"absolute",style:{left:0,top:G-16,width:j,height:ne},children:rt(["Ctrl","\u2193"])})]})]}),(Y==="left"||ue==="left")&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("button",{type:"button",onClick:V=>{V.stopPropagation(),Bt("left");},onPointerDown:V=>V.stopPropagation(),onMouseDown:V=>V.stopPropagation(),onMouseEnter:()=>K("left"),onMouseLeave:()=>K(null),title:"Add connected shape to the left (Ctrl + \u2190)",className:"absolute -translate-x-1/2 -translate-y-1/2 z-20 pointer-events-auto w-6 h-6 rounded-full bg-white dark:bg-[#1e1e24] shadow-md border border-neutral-300 dark:border-neutral-600 text-neutral-700 dark:text-neutral-200 hover:bg-primary hover:border-primary hover:text-white dark:hover:text-white flex items-center justify-center hover:scale-115 transition-all duration-150 cursor-pointer animate-in fade-in zoom-in-90",style:{left:-28,top:ne/2},children:jsxRuntime.jsx(iconsReact.IconPlus,{size:13,stroke:2.6})}),ue==="left"&&jsxRuntime.jsxs("div",{className:"absolute z-10 pointer-events-auto cursor-pointer animate-in fade-in duration-100",style:{left:-G-j,top:0,width:Math.max(0,G+j-16),height:ne},onClick:V=>{V.stopPropagation(),Bt("left");},onPointerDown:V=>V.stopPropagation(),onMouseDown:V=>V.stopPropagation(),onMouseEnter:()=>K("left"),onMouseLeave:()=>K(null),children:[jsxRuntime.jsxs("svg",{className:"absolute overflow-visible pointer-events-none",style:{right:-16,top:ne/2-8,width:G,height:16},children:[jsxRuntime.jsx("line",{x1:G,y1:8,x2:3,y2:8,stroke:te?"rgba(255,255,255,0.4)":"rgba(0,0,0,0.35)",strokeWidth:1.5}),jsxRuntime.jsx("polyline",{points:"7,4 1,8 7,12",fill:"none",stroke:te?"rgba(255,255,255,0.4)":"rgba(0,0,0,0.35)",strokeWidth:1.5})]}),jsxRuntime.jsx("div",{className:"absolute",style:{left:0,top:0,width:j,height:ne},children:rt(["Ctrl","\u2190"])})]})]}),(Y==="top"||ue==="top")&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("button",{type:"button",onClick:V=>{V.stopPropagation(),Bt("top");},onPointerDown:V=>V.stopPropagation(),onMouseDown:V=>V.stopPropagation(),onMouseEnter:()=>K("top"),onMouseLeave:()=>K(null),title:"Add connected shape above (Ctrl + \u2191)",className:"absolute -translate-x-1/2 -translate-y-1/2 z-20 pointer-events-auto w-6 h-6 rounded-full bg-white dark:bg-[#1e1e24] shadow-md border border-neutral-300 dark:border-neutral-600 text-neutral-700 dark:text-neutral-200 hover:bg-primary hover:border-primary hover:text-white dark:hover:text-white flex items-center justify-center hover:scale-115 transition-all duration-150 cursor-pointer animate-in fade-in zoom-in-90",style:{left:j/2,top:-64},children:jsxRuntime.jsx(iconsReact.IconPlus,{size:13,stroke:2.6})}),ue==="top"&&jsxRuntime.jsxs("div",{className:"absolute z-10 pointer-events-auto cursor-pointer animate-in fade-in duration-100",style:{left:0,top:-G-ne,width:j,height:Math.max(0,G+ne-16)},onClick:V=>{V.stopPropagation(),Bt("top");},onPointerDown:V=>V.stopPropagation(),onMouseDown:V=>V.stopPropagation(),onMouseEnter:()=>K("top"),onMouseLeave:()=>K(null),children:[jsxRuntime.jsxs("svg",{className:"absolute overflow-visible pointer-events-none",style:{left:j/2-8,bottom:-16,width:16,height:G},children:[jsxRuntime.jsx("line",{x1:8,y1:G,x2:8,y2:3,stroke:te?"rgba(255,255,255,0.4)":"rgba(0,0,0,0.35)",strokeWidth:1.5}),jsxRuntime.jsx("polyline",{points:"4,7 8,1 12,7",fill:"none",stroke:te?"rgba(255,255,255,0.4)":"rgba(0,0,0,0.35)",strokeWidth:1.5})]}),jsxRuntime.jsx("div",{className:"absolute",style:{left:0,top:0,width:j,height:ne},children:rt(["Ctrl","\u2191"])})]})]})]})})()]})}async function Gr(e,t,r){if(typeof window>"u")return;let o=typeof r=="string"?r:r?.mimeType||"application/octet-stream";if(typeof e=="string"&&e.startsWith("data:")){let s=document.createElement("a");s.href=e,s.download=t,s.style.display="none",document.body.appendChild(s),s.click(),document.body.removeChild(s);return}let p=e instanceof Blob?e:new Blob([e],{type:o}),c=URL.createObjectURL(p),l=document.createElement("a");l.href=c,l.download=t,l.style.display="none",document.body.appendChild(l),l.click(),document.body.removeChild(l),setTimeout(()=>{URL.revokeObjectURL(c);},1e3);}function Ot(e){return e.replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">").replace(/"/g,""").replace(/'/g,"'")}function xo(e){if(!e||e==="transparent")return false;if(e.startsWith("#")){let t=e.replace("#","");if(t.length===3){let r=parseInt(t[0]+t[0],16),o=parseInt(t[1]+t[1],16),p=parseInt(t[2]+t[2],16);return r*.299+o*.587+p*.114<128}if(t.length===6){let r=parseInt(t.substring(0,2),16),o=parseInt(t.substring(2,4),16),p=parseInt(t.substring(4,6),16);return r*.299+o*.587+p*.114<128}}return false}function ka(e,t,r,o,p,c,l){if(!o||o==="none")return "";let s=o===true?"arrow":o,n=Math.max(1.5,c),u=`transform="translate(${e}, ${t}) rotate(${r*180/Math.PI})"`;switch(s){case "arrow":{let i=Math.max(12,n*4.5),d=i*.55;return `<path d="M ${-i} ${-d} L 0 0 L ${-i} ${d}" fill="none" stroke="${p}" stroke-width="${n}" stroke-linecap="round" stroke-linejoin="round" opacity="${l}" ${u} />
|
|
8
|
+
`}case "triangle":{let i=Math.max(14,n*4.8),d=i*.55;return `<polygon points="0,0 ${-i},${-d} ${-i},${d}" fill="${p}" stroke="${p}" stroke-width="${n}" stroke-linejoin="round" opacity="${l}" ${u} />
|
|
9
|
+
`}case "barbed":{let i=Math.max(16,n*5.2),d=i*.55,h=i*.35;return `<polygon points="0,0 ${-i},${-d} ${-i+h},0 ${-i},${d}" fill="${p}" stroke="${p}" stroke-width="${n}" stroke-linejoin="round" opacity="${l}" ${u} />
|
|
10
|
+
`}case "dot":{let i=Math.max(4.5,n*1.8);return `<circle cx="${-i}" cy="0" r="${i}" fill="${p}" opacity="${l}" ${u} />
|
|
11
|
+
`}case "circle":{let i=Math.max(4.5,n*1.8);return `<circle cx="${-i}" cy="0" r="${i}" fill="white" stroke="${p}" stroke-width="${n}" opacity="${l}" ${u} />
|
|
12
|
+
`}case "diamond":{let i=Math.max(13,n*4.2),d=i*.5;return `<polygon points="0,0 ${-i/2},${-d} ${-i},0 ${-i/2},${d}" fill="${p}" stroke="${p}" stroke-width="${n}" stroke-linejoin="round" opacity="${l}" ${u} />
|
|
13
|
+
`}case "diamond_outline":{let i=Math.max(13,n*4.2),d=i*.5;return `<polygon points="0,0 ${-i/2},${-d} ${-i},0 ${-i/2},${d}" fill="white" stroke="${p}" stroke-width="${n}" stroke-linejoin="round" opacity="${l}" ${u} />
|
|
14
|
+
`}case "bar":case "crowfoot_one":{let i=Math.max(12,n*4.5);return `<line x1="0" y1="${-i/2}" x2="0" y2="${i/2}" stroke="${p}" stroke-width="${n}" stroke-linecap="round" opacity="${l}" ${u} />
|
|
15
|
+
`}case "crowfoot_many":{let i=Math.max(12,n*4),d=i*.7;return `<path d="M ${-i} ${-d} L 0 0 L ${-i} ${d} M ${-i} 0 L 0 0" fill="none" stroke="${p}" stroke-width="${n}" stroke-linecap="round" opacity="${l}" ${u} />
|
|
16
|
+
`}case "crowfoot_one_many":{let i=Math.max(14,n*4.5),d=i*.65;return `<path d="M ${-i} ${-d} L 0 0 L ${-i} ${d} M ${-i} 0 L 0 0 M ${-i*.45} ${-d} L ${-i*.45} ${d}" fill="none" stroke="${p}" stroke-width="${n}" stroke-linecap="round" opacity="${l}" ${u} />
|
|
17
|
+
`}case "crowfoot_strictly_one":{let i=Math.max(12,n*4.5),d=Math.max(5,n*2);return `<path d="M 0 ${-i/2} L 0 ${i/2} M ${-d} ${-i/2} L ${-d} ${i/2}" fill="none" stroke="${p}" stroke-width="${n}" stroke-linecap="round" opacity="${l}" ${u} />
|
|
18
|
+
`}case "crowfoot_zero_one":{let i=Math.max(12,n*4.5),d=Math.max(4,n*1.5);return `<circle cx="${-d*2-2}" cy="0" r="${d}" fill="white" stroke="${p}" stroke-width="${n}" opacity="${l}" ${u} /><line x1="0" y1="${-i/2}" x2="0" y2="${i/2}" stroke="${p}" stroke-width="${n}" stroke-linecap="round" opacity="${l}" ${u} />
|
|
19
|
+
`}case "crowfoot_zero_many":{let i=Math.max(12,n*4),d=i*.65,h=Math.max(4,n*1.5);return `<path d="M ${-i} ${-d} L 0 0 L ${-i} ${d} M ${-i} 0 L 0 0" fill="none" stroke="${p}" stroke-width="${n}" stroke-linecap="round" opacity="${l}" ${u} /><circle cx="${-i-h-2}" cy="0" r="${h}" fill="white" stroke="${p}" stroke-width="${n}" opacity="${l}" ${u} />
|
|
20
|
+
`}default:return ""}}function jt(e,t=40){if(e.length===0)return {minX:0,minY:0,maxX:800,maxY:600,width:800,height:600};let r=1/0,o=1/0,p=-1/0,c=-1/0;for(let l of e){let s=it(l);if(r=Math.min(r,s.x),o=Math.min(o,s.y),p=Math.max(p,s.x+s.width),c=Math.max(c,s.y+s.height),l.points&&l.points.length>0)for(let n of l.points)r=Math.min(r,n.x),o=Math.min(o,n.y),p=Math.max(p,n.x),c=Math.max(c,n.y);}return r-=t,o-=t,p+=t,c+=t,{minX:r,minY:o,maxX:p,maxY:c,width:Math.max(100,p-r),height:Math.max(100,c-o)}}async function Jr(e,t={}){let{scale:r=2,backgroundColor:o="#ffffff",gridStyle:p="none",padding:c=40}=t,l=jt(e,c),s=document.createElement("canvas");s.width=l.width*r,s.height=l.height*r;let n=s.getContext("2d");if(!n)throw new Error("Could not create canvas 2d context");let u=t.isDark??(xo(o)||o==="transparent"&&typeof document<"u"&&document.documentElement.classList.contains("dark"));if(o&&o!=="transparent"&&(n.fillStyle=o,n.fillRect(0,0,s.width,s.height)),p&&p!=="none"){if(p==="dots"){let h=24*r,a=Math.max(.8*r,1.05*r);n.fillStyle=u?"rgba(255, 255, 255, 0.14)":"rgba(0, 0, 0, 0.12)";for(let x=0;x<s.width;x+=h)for(let b=0;b<s.height;b+=h)n.beginPath(),n.arc(x,b,a,0,Math.PI*2),n.fill();}else if(p==="grid"){let h=20*r;n.strokeStyle=u?"rgba(255, 255, 255, 0.08)":"rgba(0, 0, 0, 0.08)",n.lineWidth=1*r,n.setLineDash([1.5*r,3.5*r]),n.beginPath();for(let a=0;a<s.width;a+=h)n.moveTo(a,0),n.lineTo(a,s.height);for(let a=0;a<s.height;a+=h)n.moveTo(0,a),n.lineTo(s.width,a);n.stroke(),n.setLineDash([]);}else if(p==="cross"){let h=32*r;n.strokeStyle=u?"rgba(255, 255, 255, 0.12)":"rgba(0, 0, 0, 0.10)",n.lineWidth=1*r,n.beginPath();for(let a=0;a<s.width;a+=h)for(let x=0;x<s.height;x+=h)n.moveTo(a-3*r,x),n.lineTo(a+3*r,x),n.moveTo(a,x-3*r),n.lineTo(a,x+3*r);n.stroke();}}n.save(),n.scale(r,r),n.translate(-l.minX,-l.minY);let i=e.filter(h=>h.type==="image"&&h.dataUrl);i.length>0&&await Promise.all(i.map(h=>new Promise(a=>{let x=new Image;x.crossOrigin="anonymous",x.onload=()=>a(),x.onerror=()=>a(),x.src=h.dataUrl;})));let d=[...e].sort((h,a)=>(h.zIndex??0)-(a.zIndex??0));for(let h of d)Hr(n,h,1,false,u);return n.restore(),s.toDataURL("image/png")}function fo(e,t={}){let{backgroundColor:r="#ffffff",gridStyle:o="none",padding:p=40}=t,c=jt(e,p),l=t.isDark??(xo(r)||r==="transparent"&&typeof document<"u"&&document.documentElement.classList.contains("dark")),s=[...e].sort((a,x)=>(a.zIndex??0)-(x.zIndex??0)),n="";for(let a of s){let x=a.opacity??1,b=vt(a.strokeColor??"#000",l),k=a.strokeWidth??2,y=_r(a.fillColor,a.fillStyle,l),_=!y||y==="transparent"?"none":y,S=a.strokeStyle==="dashed"?"8,6":a.strokeStyle==="dotted"?"3,4":"none",P=qt(a.fontFamily),R=P.cssFont.replace(/"/g,"""),I=P.value==="fuzzy"||P.value==="edusa",z=P.value==="patrick"||P.value==="comic"||P.value==="handlee"?"400":I?a.type==="sticky"||a.type!=="text"?"700":"400":"600",$=w=>w;switch(a.type){case "rectangle":{let f=(a.edgeStyle||"round")==="round"?Math.min(16,Math.min(Math.abs(a.width),Math.abs(a.height))*.25):0,v=f>0?` rx="${f}"`:"";if(n+=`<rect x="${a.x}" y="${a.y}" width="${a.width}" height="${a.height}"${v} fill="${_}" stroke="${b}" stroke-width="${k}" stroke-dasharray="${S}" opacity="${x}" />
|
|
21
|
+
`,a.text){let C=a.x+a.width/2,T=a.y+a.height/2,W=a.fontSize||20,le=a.text.split(`
|
|
22
|
+
`),L=W*1.35,A=T-le.length*L/2+W*.8;le.forEach((F,Z)=>{n+=`<text x="${C}" y="${A+Z*L}" font-family="${R}" font-size="${W}" fill="${b}" text-anchor="middle" font-weight="${z}">${Ot($(F))}</text>
|
|
23
|
+
`;});}break}case "ellipse":{let w=a.x+a.width/2,f=a.y+a.height/2,v=Math.abs(a.width/2),C=Math.abs(a.height/2);if(n+=`<ellipse cx="${w}" cy="${f}" rx="${v}" ry="${C}" fill="${_}" stroke="${b}" stroke-width="${k}" stroke-dasharray="${S}" opacity="${x}" />
|
|
24
|
+
`,a.text){let T=a.fontSize||20,W=a.text.split(`
|
|
25
|
+
`),le=T*1.35,L=f-W.length*le/2+T*.8;W.forEach((A,F)=>{n+=`<text x="${w}" y="${L+F*le}" font-family="${R}" font-size="${T}" fill="${b}" text-anchor="middle" font-weight="${z}">${Ot($(A))}</text>
|
|
26
|
+
`;});}break}case "diamond":{let w=a.x+a.width/2,f=a.y+a.height/2,v=`${w},${a.y} ${a.x+a.width},${f} ${w},${a.y+a.height} ${a.x},${f}`;if(n+=`<polygon points="${v}" fill="${_}" stroke="${b}" stroke-width="${k}" stroke-dasharray="${S}" opacity="${x}" />
|
|
27
|
+
`,a.text){let C=a.fontSize||20,T=a.text.split(`
|
|
28
|
+
`),W=C*1.35,le=f-T.length*W/2+C*.8;T.forEach((L,A)=>{n+=`<text x="${w}" y="${le+A*W}" font-family="${R}" font-size="${C}" fill="${b}" text-anchor="middle" font-weight="${z}">${Ot($(L))}</text>
|
|
29
|
+
`;});}break}case "cylinder":{let w=a.x+a.width/2,f=a.y+a.height/2,v=Math.abs(a.width/2),C=Math.min(24,Math.abs(a.height)*.2),T=a.y+C,W=a.y+a.height-C,le=`M ${a.x} ${T} A ${v} ${C} 0 0 1 ${a.x+a.width} ${T} L ${a.x+a.width} ${W} A ${v} ${C} 0 0 1 ${a.x} ${W} Z`;if(n+=`<path d="${le}" fill="${_}" stroke="${b}" stroke-width="${k}" stroke-dasharray="${S}" opacity="${x}" />
|
|
30
|
+
`,n+=`<ellipse cx="${w}" cy="${T}" rx="${v}" ry="${C}" fill="${_}" stroke="${b}" stroke-width="${k}" stroke-dasharray="${S}" opacity="${x}" />
|
|
31
|
+
`,a.text){let L=a.fontSize||20,A=a.text.split(`
|
|
32
|
+
`),F=L*1.35,Z=f-A.length*F/2+L*.8;A.forEach((be,U)=>{n+=`<text x="${w}" y="${Z+U*F}" font-family="${R}" font-size="${L}" fill="${b}" text-anchor="middle" font-weight="${z}">${Ot($(be))}</text>
|
|
33
|
+
`;});}break}case "table":{let w=zr(a),v=(a.edgeStyle||"round")==="round"?6:0;n+=`<rect x="${a.x}" y="${a.y}" width="${w.totalWidth}" height="${w.totalHeight}" rx="${v}" fill="${_}" stroke="${b}" stroke-width="${k}" stroke-dasharray="${S}" opacity="${x}" />
|
|
34
|
+
`;for(let W=1;W<w.cols;W++){let le=a.x+w.colOffsets[W];n+=`<line x1="${le}" y1="${a.y}" x2="${le}" y2="${a.y+w.totalHeight}" stroke="${b}" stroke-width="${k}" stroke-dasharray="${S}" />
|
|
35
|
+
`;}for(let W=1;W<w.rows;W++){let le=a.y+w.rowOffsets[W];n+=`<line x1="${a.x}" y1="${le}" x2="${a.x+w.totalWidth}" y2="${le}" stroke="${b}" stroke-width="${k}" stroke-dasharray="${S}" />
|
|
36
|
+
`;}let C=a.cells||{},T=a.fontSize||13;for(let W=0;W<w.rows;W++)for(let le=0;le<w.cols;le++){let L=`${W}_${le}`,A=C[L];if(!A?.text)continue;let F=w.getCellBounds(W,le),Z=a.hasHeaderRow&&W===0||A.bold,be=F.y+F.height/2+T*.35,U=F.x+8;n+=`<text x="${U}" y="${be}" font-family="${R}" font-size="${T}" fill="${b}" font-weight="${I?Z?"700":"400":Z?"600":"400"}">${Ot(A.text)}</text>
|
|
37
|
+
`;}break}case "parallelogram":{let w=a.x+a.width/2,f=a.y+a.height/2,v=Math.min(36,a.width*.22),C=`${a.x+v},${a.y} ${a.x+a.width},${a.y} ${a.x+a.width-v},${a.y+a.height} ${a.x},${a.y+a.height}`;if(n+=`<polygon points="${C}" fill="${_}" stroke="${b}" stroke-width="${k}" stroke-dasharray="${S}" opacity="${x}" />
|
|
38
|
+
`,a.text){let T=a.fontSize||20,W=a.text.split(`
|
|
39
|
+
`),le=T*1.35,L=f-W.length*le/2+T*.8;W.forEach((A,F)=>{n+=`<text x="${w}" y="${L+F*le}" font-family="${R}" font-size="${T}" fill="${b}" text-anchor="middle" font-weight="${z}">${Ot(A)}</text>
|
|
40
|
+
`;});}break}case "cloud":{let w=a.x+a.width/2,f=a.y+a.height/2,v=Math.abs(a.width),C=Math.abs(a.height),T=a.x,W=a.y,le=`M ${T+v*.2} ${W+C*.7} C ${T+v*.1} ${W+C*.85}, ${T+v*.35} ${W+C*.95}, ${T+v*.5} ${W+C*.85} C ${T+v*.65} ${W+C*.95}, ${T+v*.9} ${W+C*.85}, ${T+v*.85} ${W+C*.65} C ${T+v*1.02} ${W+C*.5}, ${T+v*.98} ${W+C*.25}, ${T+v*.8} ${W+C*.25} C ${T+v*.78} ${W+C*.05}, ${T+v*.52} ${W+C*.05}, ${T+v*.45} ${W+C*.2} C ${T+v*.35} ${W+C*.08}, ${T+v*.12} ${W+C*.15}, ${T+v*.15} ${W+C*.4} C ${T-v*.02} ${W+C*.45}, ${T-v*.01} ${W+C*.68}, ${T+v*.2} ${W+C*.7} Z`;if(n+=`<path d="${le}" fill="${_}" stroke="${b}" stroke-width="${k}" stroke-dasharray="${S}" opacity="${x}" />
|
|
41
|
+
`,a.text){let L=a.fontSize||20,A=a.text.split(`
|
|
42
|
+
`),F=L*1.35,Z=f-A.length*F/2+L*.8;A.forEach((be,U)=>{n+=`<text x="${w}" y="${Z+U*F}" font-family="${R}" font-size="${L}" fill="${b}" text-anchor="middle" font-weight="${z}">${Ot(be)}</text>
|
|
43
|
+
`;});}break}case "star":{let w=a.x+a.width/2,f=a.y+a.height/2,v=5,C=Math.min(Math.abs(a.width),Math.abs(a.height))/2,T=C*.45,W=Math.PI/2*3,le=Math.PI/v,L=[];for(let A=0;A<v;A++){let F=w+Math.cos(W)*C,Z=f+Math.sin(W)*C;L.push(`${F},${Z}`),W+=le;let be=w+Math.cos(W)*T,U=f+Math.sin(W)*T;L.push(`${be},${U}`),W+=le;}if(n+=`<polygon points="${L.join(" ")}" fill="${_}" stroke="${b}" stroke-width="${k}" stroke-dasharray="${S}" opacity="${x}" />
|
|
44
|
+
`,a.text){let A=a.fontSize||20,F=a.text.split(`
|
|
45
|
+
`),Z=A*1.35,be=f-F.length*Z/2+A*.8;F.forEach((U,E)=>{n+=`<text x="${w}" y="${be+E*Z}" font-family="${R}" font-size="${A}" fill="${b}" text-anchor="middle" font-weight="${z}">${Ot(U)}</text>
|
|
46
|
+
`;});}break}case "triangle":{let w=a.x+a.width/2,f=a.y+a.height/2,v=`${w},${a.y} ${a.x+a.width},${a.y+a.height} ${a.x},${a.y+a.height}`;if(n+=`<polygon points="${v}" fill="${_}" stroke="${b}" stroke-width="${k}" stroke-dasharray="${S}" opacity="${x}" />
|
|
47
|
+
`,a.text){let C=a.fontSize||20,T=a.text.split(`
|
|
48
|
+
`),W=C*1.35,le=f-T.length*W/2+C*.8+a.height*.1;T.forEach((L,A)=>{n+=`<text x="${w}" y="${le+A*W}" font-family="${R}" font-size="${C}" fill="${b}" text-anchor="middle" font-weight="${z}">${Ot(L)}</text>
|
|
49
|
+
`;});}break}case "trapezoid":{let w=a.x+a.width/2,f=a.y+a.height/2,v=Math.min(Math.abs(a.width)*.2,40),C=`${a.x+v},${a.y} ${a.x+a.width-v},${a.y} ${a.x+a.width},${a.y+a.height} ${a.x},${a.y+a.height}`;if(n+=`<polygon points="${C}" fill="${_}" stroke="${b}" stroke-width="${k}" stroke-dasharray="${S}" opacity="${x}" />
|
|
50
|
+
`,a.text){let T=a.fontSize||20,W=a.text.split(`
|
|
51
|
+
`),le=T*1.35,L=f-W.length*le/2+T*.8;W.forEach((A,F)=>{n+=`<text x="${w}" y="${L+F*le}" font-family="${R}" font-size="${T}" fill="${b}" text-anchor="middle" font-weight="${z}">${Ot(A)}</text>
|
|
52
|
+
`;});}break}case "hexagon":{let w=a.x+a.width/2,f=a.y+a.height/2,v=Math.min(Math.abs(a.width)*.22,45),C=`${a.x+v},${a.y} ${a.x+a.width-v},${a.y} ${a.x+a.width},${f} ${a.x+a.width-v},${a.y+a.height} ${a.x+v},${a.y+a.height} ${a.x},${f}`;if(n+=`<polygon points="${C}" fill="${_}" stroke="${b}" stroke-width="${k}" stroke-dasharray="${S}" opacity="${x}" />
|
|
53
|
+
`,a.text){let T=a.fontSize||20,W=a.text.split(`
|
|
54
|
+
`),le=T*1.35,L=f-W.length*le/2+T*.8;W.forEach((A,F)=>{n+=`<text x="${w}" y="${L+F*le}" font-family="${R}" font-size="${T}" fill="${b}" text-anchor="middle" font-weight="${z}">${Ot(A)}</text>
|
|
55
|
+
`;});}break}case "capsule":{let w=a.x+a.width/2,f=a.y+a.height/2,v=Math.abs(a.width),C=Math.abs(a.height),T=Math.min(v,C)/2;if(n+=`<rect x="${a.x}" y="${a.y}" width="${a.width}" height="${a.height}" rx="${T}" fill="${_}" stroke="${b}" stroke-width="${k}" stroke-dasharray="${S}" opacity="${x}" />
|
|
56
|
+
`,a.text){let W=a.fontSize||20,le=a.text.split(`
|
|
57
|
+
`),L=W*1.35,A=f-le.length*L/2+W*.8;le.forEach((F,Z)=>{n+=`<text x="${w}" y="${A+Z*L}" font-family="${R}" font-size="${W}" fill="${b}" text-anchor="middle" font-weight="${z}">${Ot(F)}</text>
|
|
58
|
+
`;});}break}case "line":case "arrow":{let w=Tr(a),f=a.x+a.width,v=a.y+a.height;if(w.type==="straight")n+=`<line x1="${a.x}" y1="${a.y}" x2="${f}" y2="${v}" stroke="${b}" stroke-width="${k}" stroke-dasharray="${S}" opacity="${x}" stroke-linecap="round" />
|
|
59
|
+
`;else if(w.type==="curved"&&w.controlPoint){let T=`M ${a.x} ${a.y} Q ${w.controlPoint.x} ${w.controlPoint.y} ${f} ${v}`;n+=`<path d="${T}" fill="none" stroke="${b}" stroke-width="${k}" stroke-dasharray="${S}" opacity="${x}" stroke-linecap="round" />
|
|
60
|
+
`;}else if(w.type==="elbow"&&w.controlPoint1&&w.controlPoint2){let T=`M ${a.x} ${a.y} C ${w.controlPoint1.x} ${w.controlPoint1.y}, ${w.controlPoint2.x} ${w.controlPoint2.y}, ${f} ${v}`;n+=`<path d="${T}" fill="none" stroke="${b}" stroke-width="${k}" stroke-dasharray="${S}" opacity="${x}" stroke-linecap="round" />
|
|
61
|
+
`;}else {let T=w.points.map((W,le)=>`${le===0?"M":"L"} ${W.x} ${W.y}`).join(" ");n+=`<path d="${T}" fill="none" stroke="${b}" stroke-width="${k}" stroke-dasharray="${S}" opacity="${x}" stroke-linecap="round" stroke-linejoin="round" />
|
|
62
|
+
`;}a.startArrowhead&&a.startArrowhead!=="none"&&(n+=ka(a.x,a.y,w.departureAngle+Math.PI,a.startArrowhead,b,k,x));let C=a.endArrowhead!==void 0?a.endArrowhead:a.type==="arrow"?"arrow":"none";C&&C!=="none"&&(n+=ka(f,v,w.arrivalAngle,C,b,k,x));break}case "pen":{if(a.points&&a.points.length>1){let w=a.points.map((f,v)=>`${v===0?"M":"L"} ${f.x} ${f.y}`).join(" ");n+=`<path d="${w}" fill="none" stroke="${b}" stroke-width="${k}" stroke-linecap="round" stroke-linejoin="round" opacity="${x}" />
|
|
63
|
+
`;}break}case "text":{if(a.text){let w=a.text.split(`
|
|
64
|
+
`),f=a.fontSize||22,v=f*1.35,C=(v-f)/2,T=a.textAlign||"left",W=T==="center"?"middle":T==="right"?"end":"start",le=T==="center"?a.x+a.width/2:T==="right"?a.x+a.width-4:a.x+4;w.forEach((L,A)=>{n+=`<text x="${le}" y="${a.y+C+f+A*v}" text-anchor="${W}" font-size="${f}" font-weight="${z}" fill="${b}" font-family="${R}" opacity="${x}">${Ot($(L))}</text>
|
|
65
|
+
`;});}break}case "sticky":{let w=vr(a.stickyColor||a.fillColor),f=Math.abs(a.width),v=Math.abs(a.height),C=Math.min(22,Math.min(f,v)*.16),T=Math.min(13,f*.08),W=Math.min(13,v*.08);n+=`<rect x="${a.x+T}" y="${a.y+W}" width="${a.width}" height="${a.height}" rx="${C}" fill="${w.backSheetBg}" stroke="${w.backSheetBorder}" stroke-width="1.5" opacity="${x}" />
|
|
66
|
+
`,n+=`<rect x="${a.x}" y="${a.y}" width="${a.width}" height="${a.height}" rx="${C}" fill="${w.bg}" stroke="${w.mainBorder}" stroke-width="1.5" opacity="${x}" />
|
|
67
|
+
`,n+=`<rect x="${a.x+2}" y="${a.y+2}" width="${a.width-4}" height="${a.height-4}" rx="${Math.max(2,C-2)}" fill="none" stroke="${w.sheen}" stroke-width="1.5" opacity="${x}" />
|
|
68
|
+
`;let le=Math.min(64,Math.max(30,f*.28)),L=Math.min(18,Math.max(10,v*.09)),A=a.x+(a.width-le)/2,F=a.y-L*.42;if(n+=`<rect x="${A}" y="${F}" width="${le}" height="${L}" rx="4" fill="${w.tapeBg}" stroke="${w.tapeBorder}" stroke-width="1" opacity="${x}" />
|
|
69
|
+
`,a.text){let Z=a.text.split(`
|
|
70
|
+
`),be=a.fontSize||20,U=a.strokeColor&&a.strokeColor!=="transparent"?vt(a.strokeColor,l):w.text;Z.forEach((E,ee)=>{n+=`<text x="${a.x+a.width/2}" y="${a.y+32+ee*(be*1.3)}" font-size="${be}" font-weight="${z}" text-anchor="middle" fill="${U}" font-family="${R}" opacity="${x}">${Ot($(E))}</text>
|
|
71
|
+
`;});}break}case "image":{if(a.dataUrl){let w=a.edgeStyle==="round"?10:0,f=a.rotation?` transform="rotate(${a.rotation*180/Math.PI} ${a.x+a.width/2} ${a.y+a.height/2})"`:"";if(w>0){let v=`img-clip-${a.id.replace(/[^a-zA-Z0-9_-]/g,"")}`;n+=`<defs><clipPath id="${v}"><rect x="${a.x}" y="${a.y}" width="${a.width}" height="${a.height}" rx="${w}" /></clipPath></defs>
|
|
72
|
+
`,n+=`<image href="${a.dataUrl}" x="${a.x}" y="${a.y}" width="${a.width}" height="${a.height}" opacity="${x}" clip-path="url(#${v})"${f} />
|
|
73
|
+
`;}else n+=`<image href="${a.dataUrl}" x="${a.x}" y="${a.y}" width="${a.width}" height="${a.height}" opacity="${x}"${f} />
|
|
74
|
+
`;}break}}}let u=`
|
|
75
|
+
<style>
|
|
76
|
+
@import url('https://fonts.googleapis.com/css2?family=Fuzzy+Bubbles:wght@400;700&family=Comic+Neue:wght@400;700&family=Patrick+Hand+SC&display=swap');
|
|
77
|
+
</style>`,i="",d="";o==="dots"?(i=`
|
|
78
|
+
<pattern id="tp-dot-pattern" width="24" height="24" patternUnits="userSpaceOnUse">
|
|
79
|
+
<circle cx="12" cy="12" r="1.1" fill="${l?"rgba(255,255,255,0.15)":"rgba(0,0,0,0.13)"}" />
|
|
80
|
+
</pattern>`,d=`<rect x="${c.minX}" y="${c.minY}" width="${c.width}" height="${c.height}" fill="url(#tp-dot-pattern)" />
|
|
81
|
+
`):o==="grid"?(i=`
|
|
82
|
+
<pattern id="tp-grid-pattern" width="20" height="20" patternUnits="userSpaceOnUse">
|
|
83
|
+
<path d="M 20 0 L 0 0 0 20" fill="none" stroke="${l?"rgba(255,255,255,0.08)":"rgba(0,0,0,0.08)"}" stroke-width="1" stroke-dasharray="1.5 3.5" />
|
|
84
|
+
</pattern>`,d=`<rect x="${c.minX}" y="${c.minY}" width="${c.width}" height="${c.height}" fill="url(#tp-grid-pattern)" />
|
|
85
|
+
`):o==="cross"&&(i=`
|
|
86
|
+
<pattern id="tp-cross-pattern" width="32" height="32" patternUnits="userSpaceOnUse">
|
|
87
|
+
<path d="M 13 16 L 19 16 M 16 13 L 16 19" fill="none" stroke="${l?"rgba(255,255,255,0.12)":"rgba(0,0,0,0.10)"}" stroke-width="1" />
|
|
88
|
+
</pattern>`,d=`<rect x="${c.minX}" y="${c.minY}" width="${c.width}" height="${c.height}" fill="url(#tp-cross-pattern)" />
|
|
89
|
+
`);let h=`<defs>${u}${i}
|
|
90
|
+
</defs>`;return `<svg xmlns="http://www.w3.org/2000/svg" viewBox="${c.minX} ${c.minY} ${c.width} ${c.height}" width="${c.width}" height="${c.height}">
|
|
91
|
+
${h}
|
|
92
|
+
${r!=="transparent"?`<rect x="${c.minX}" y="${c.minY}" width="${c.width}" height="${c.height}" fill="${r}" />`:""}
|
|
93
|
+
${d}
|
|
94
|
+
${n}
|
|
95
|
+
</svg>`}function yr(e,t,r){Gr(e,t,{mimeType:r});}function Fi(e){let t=e.split(";base64,"),r=t[0].split(":")[1],o=window.atob(t[1]),p=o.length,c=new Uint8Array(p);for(let l=0;l<p;++l)c[l]=o.charCodeAt(l);return new Blob([c],{type:r})}async function go(e,t={}){try{let r=await Jr(e,t),o=Fi(r);return await navigator.clipboard.write([new ClipboardItem({"image/png":o})]),!0}catch(r){return console.warn("Clipboard copy failed:",r),false}}function Rr(e,t){let r=it(e);return t.filter(o=>{if(o.id===e.id)return false;let p=it(o),c=p.x+p.width/2,l=p.y+p.height/2;return c>=r.x&&c<=r.x+r.width&&l>=r.y&&l<=r.y+r.height})}async function bo(e,t,r={}){let{scale:o=2,backgroundColor:p=e.fillColor&&e.fillColor!=="transparent"?e.fillColor:"#ffffff",padding:c=0}=r,l=it(e),s=document.createElement("canvas");s.width=Math.max(10,(l.width+c*2)*o),s.height=Math.max(10,(l.height+c*2)*o);let n=s.getContext("2d");if(!n)throw new Error("Could not create canvas context");let u=r.isDark??(xo(p)||p==="transparent"&&typeof document<"u"&&document.documentElement.classList.contains("dark"));p&&p!=="transparent"&&(n.fillStyle=p,n.fillRect(0,0,s.width,s.height)),n.save(),n.scale(o,o),n.translate(-l.x+c,-l.y+c),n.beginPath(),n.rect(l.x,l.y,l.width,l.height),n.clip();let i=Rr(e,t),d=i.filter(a=>a.type==="image"&&a.dataUrl);d.length>0&&await Promise.all(d.map(a=>new Promise(x=>{let b=new Image;b.crossOrigin="anonymous",b.onload=()=>x(),b.onerror=()=>x(),b.src=a.dataUrl;})));let h=[...i].sort((a,x)=>(a.zIndex??0)-(x.zIndex??0));for(let a of h)Hr(n,a,1,false,u);return n.restore(),s.toDataURL("image/png")}var wa=595.28,va=841.89,Fo=24,Hi=.75;function Yi(e,t=Fo){let r=e==="landscape",o=r?va:wa,p=r?wa:va;return {pageWidth:o,pageHeight:p,margin:t,printableWidth:Math.max(100,o-t*2),printableHeight:Math.max(100,p-t*2)}}var cn=class{parent=new Map;find(t){if(!this.parent.has(t))return this.parent.set(t,t),t;let r=this.parent.get(t);if(r===t)return t;let o=this.find(r);return this.parent.set(t,o),o}union(t,r){let o=this.find(t),p=this.find(r);o!==p&&this.parent.set(o,p);}};function Xi(e){if(e.length===0)return [];let t=new cn,r=new Map;for(let u of e)r.set(u.id,u);let o=new Map;for(let u of e)if(u.groupIds&&u.groupIds.length>0)for(let i of u.groupIds){let d=o.get(i)||[];d.push(u.id),o.set(i,d);}for(let u of o.values())for(let i=1;i<u.length;i++)t.union(u[0],u[i]);let p=e.filter(u=>u.type==="frame");for(let u of p){let i=Rr(u,e);for(let d of i)t.union(u.id,d.id);}for(let u of e)u.frameId&&r.has(u.frameId)&&t.union(u.id,u.frameId);for(let u of e)(u.type==="arrow"||u.type==="line")&&(u.startBinding?.elementId&&r.has(u.startBinding.elementId)&&t.union(u.id,u.startBinding.elementId),u.endBinding?.elementId&&r.has(u.endBinding.elementId)&&t.union(u.id,u.endBinding.elementId));let c=e.filter(u=>(!u.groupIds||u.groupIds.length===0)&&!u.frameId&&u.type!=="frame"),l=12;for(let u=0;u<c.length;u++){let i=c[u],d=it(i);for(let h=u+1;h<c.length;h++){let a=c[h],x=it(a),b=Math.max(0,Math.max(d.x,x.x)-Math.min(d.x+d.width,x.x+x.width)),k=Math.max(0,Math.max(d.y,x.y)-Math.min(d.y+d.height,x.y+x.height));b<=l&&k<=l&&(i.type==="text"||a.type==="text"||i.type==="sticky"||a.type==="sticky"||b===0&&k===0)&&t.union(i.id,a.id);}}let s=new Map;for(let u of e){let i=t.find(u.id),d=s.get(i)||[];d.push(u),s.set(i,d);}let n=[];for(let[u,i]of s.entries()){let d=jt(i,4);n.push({id:u,elements:i,bbox:d});}return n}function _a(e,t){let{orientation:r,margin:o=Fo,baseScale:p=Hi}=t,c=Yi(r,o),{printableWidth:l,printableHeight:s}=c;if(e.length===0)return {pageGeometry:c,pages:[{pageIndex:0,slices:[]}],uniformScale:p};let u=jt(e,20),i=u.width>0?Math.min(p,l/u.width):p,d=u.width*i,h=u.height*i,a=Math.max(0,(l-d)/2);if(h<=s){let S=Math.max(0,(s-h)/2);return {pageGeometry:c,pages:[{pageIndex:0,slices:[{elements:e,sourceBounds:{minX:u.minX,minY:u.minY,width:u.width,height:u.height},destRect:{x:a,y:S,width:d,height:h}}]}],uniformScale:i}}let x=Xi(e),b=s/i,k=[],y=u.minY,_=0;for(;y<u.maxY;){let S=u.maxY-y;if(S<=b){let f=S,v=f*i,C=e.filter(T=>{let W=it(T);return W.y+W.height>=y&&W.y<=u.maxY});k.push({pageIndex:_,slices:[{elements:C.length>0?C:e,sourceBounds:{minX:u.minX,minY:y,width:u.width,height:f},destRect:{x:a,y:0,width:d,height:v}}]});break}let P=y+b,R=P,I=x.filter(f=>f.bbox.minY<P&&f.bbox.maxY>P);if(I.length>0){let f=Math.min(...I.map(C=>C.bbox.minY)),v=b*.55;f-y>=v?R=f:R=P;}let z=R-y,$=z*i,w=e.filter(f=>{let v=it(f);return v.y+v.height>=y&&v.y<=R});k.push({pageIndex:_,slices:[{elements:w.length>0?w:e,sourceBounds:{minX:u.minX,minY:y,width:u.width,height:z},destRect:{x:a,y:0,width:d,height:$}}]}),y=R,_++;}return {pageGeometry:c,pages:k,uniformScale:i}}var ji=2.5,Sa=4096;function Gi(e){if(!e||e==="transparent")return pdfLib.rgb(1,1,1);let t=e.replace("#","").trim();if(t.length===3&&(t=t.split("").map(c=>c+c).join("")),t.length!==6)return pdfLib.rgb(1,1,1);let r=parseInt(t.substring(0,2),16)/255,o=parseInt(t.substring(2,4),16)/255,p=parseInt(t.substring(4,6),16)/255;return pdfLib.rgb(Number.isFinite(r)?r:1,Number.isFinite(o)?o:1,Number.isFinite(p)?p:1)}async function Ki(e){let t=e.filter(r=>r.type==="image"&&r.dataUrl);t.length!==0&&await Promise.all(t.map(r=>new Promise(o=>{let p=new Image;p.crossOrigin="anonymous",p.onload=()=>o(),p.onerror=()=>o(),p.src=r.dataUrl;})));}async function Ui(e,t,r){let{sourceBounds:o,elements:p}=e;if(o.width<=0||o.height<=0)return null;let c=ji,l=Math.max(o.width,o.height);l*c>Sa&&(c=Math.max(1,Sa/l));let s=Math.max(2,Math.round(o.width*c)),n=Math.max(2,Math.round(o.height*c)),u=document.createElement("canvas");u.width=s,u.height=n;let i=u.getContext("2d");if(!i)return null;r&&r!=="transparent"&&(i.fillStyle=r,i.fillRect(0,0,s,n)),i.save(),i.scale(c,c),i.translate(-o.minX,-o.minY);let d=[...p].sort((x,b)=>(x.zIndex??0)-(b.zIndex??0));for(let x of d)Hr(i,x,1,false,t);i.restore();let h=await new Promise(x=>{u.toBlob(x,"image/png");});if(u.width=0,u.height=0,!h)return null;let a=await h.arrayBuffer();return new Uint8Array(a)}async function mo(e,t={}){let{orientation:r="portrait",appearance:o="original",margin:p=Fo,boardName:c="whiteboard",canvasBackground:l="#ffffff",isSelection:s=false,onProgress:n}=t;if(e.length===0)throw new Error("No elements to export");await Ki(e);let u=false,i="#ffffff",d=pdfLib.rgb(1,1,1);o==="dark"?(u=true,i="#121212",d=pdfLib.rgb(.07,.07,.07)):o==="light"?(u=false,i="#ffffff",d=pdfLib.rgb(1,1,1)):(u=t.isDark??xo(l),i=l||"#ffffff",d=Gi(i));let{pageGeometry:h,pages:a}=_a(e,{orientation:r,margin:p}),x=await pdfLib.PDFDocument.create(),b=a.length,k=0;for(let P=0;P<a.length;P++){let R=a[P],I=x.addPage([h.pageWidth,h.pageHeight]);I.drawRectangle({x:0,y:0,width:h.pageWidth,height:h.pageHeight,color:d});for(let z of R.slices){let $=await Ui(z,u,i);if(!$)continue;let w=await x.embedPng($),f=h.margin+z.destRect.x,v=h.pageHeight-h.margin-z.destRect.y-z.destRect.height;I.drawImage(w,{x:f,y:v,width:z.destRect.width,height:z.destRect.height});}k++,n?.(k,b);}let y=await x.save(),S=`${(c||"whiteboard").toLowerCase().replace(/[^a-z0-9_-]/g,"-")||"whiteboard"}${s?"-selection":""}.pdf`;return await Gr(y,S,{mimeType:"application/pdf",filters:[{name:"PDF Document",extensions:["pdf"]}],showToast:true}),{success:true,pageCount:b,filename:S}}function hn({elements:e,selectedIds:t=[],boardName:r,onManualSave:o,onClearBoard:p,gridStyle:c,setGridStyle:l,resetCamera:s,canvasBackground:n="#ffffff"}){let{resolvedTheme:u}=Vt(),d=Ln.useSyncExternalStore(()=>()=>{},()=>true,()=>false)&&u==="dark",[h,a]=Ln.useState(false),[x,b]=Ln.useState({x:0,y:0}),[k,y]=Ln.useState("none"),[_,S]=Ln.useState(false),[P,R]=Ln.useState("portrait"),[I,z]=Ln.useState("original"),[$,w]=Ln.useState(d?"dark":"light"),[f,v]=Ln.useState(2),[C,T]=Ln.useState(null),W=Ln.useRef(null),le=Ln.useRef(e),L=Ln.useRef(t);Ln.useEffect(()=>{le.current=e,L.current=t;},[e,t]);let A=te=>{T(te),setTimeout(()=>{T(null),a(false);},1e3);};Ln.useEffect(()=>{let te=Se=>{if(["INPUT","TEXTAREA"].includes(Se.target?.tagName)||Se.target?.isContentEditable)return;Se.preventDefault();let Ke=240,X=320,Oe=Math.min(window.innerWidth-Ke-16,Math.max(12,Se.clientX)),je=Math.min(window.innerHeight-X-16,Math.max(12,Se.clientY)),Ne=le.current.filter(_e=>L.current.includes(_e.id));if(Ne.length>0){let _e=jt(Ne,0);R(_e.width>_e.height*1.1?"landscape":"portrait");}b({x:Oe,y:je}),y("none"),a(true);},ie=Se=>{if(Se instanceof KeyboardEvent&&Se.key==="Escape"){a(false);return}Se instanceof MouseEvent&&W.current&&!W.current.contains(Se.target)&&a(false);};return window.addEventListener("contextmenu",te),window.addEventListener("mousedown",ie),window.addEventListener("keydown",ie),window.addEventListener("wheel",()=>a(false),{passive:true}),()=>{window.removeEventListener("contextmenu",te),window.removeEventListener("mousedown",ie),window.removeEventListener("keydown",ie);}},[]);let F=async()=>{try{let ie=await Jr(e,{scale:f,backgroundColor:$==="dark"?"#121212":$==="light"?"#ffffff":"transparent"}),Se=`${r.toLowerCase().replace(/[^a-z0-9]/g,"-")||"whiteboard"}-${f}x.png`;yr(ie,Se,"image/png"),A(`Downloaded PNG (${f}x)`);}catch{A("Failed to download image");}},Z=async()=>{try{let ie=await go(e,{scale:f,backgroundColor:$==="dark"?"#121212":$==="light"?"#ffffff":"transparent"});A(ie?"Copied image to clipboard! \u{1F4CB}":"Clipboard write failed");}catch{A("Clipboard write failed");}},be=()=>{try{let ie=fo(e,{backgroundColor:$==="dark"?"#121212":$==="light"?"#ffffff":"transparent"}),Se=`${r.toLowerCase().replace(/[^a-z0-9]/g,"-")||"whiteboard"}.svg`;yr(ie,Se,"image/svg+xml"),A("Downloaded SVG Vector");}catch{A("Failed to download SVG");}},U=()=>{try{let te=JSON.stringify(e,null,2),ie=`${r.toLowerCase().replace(/[^a-z0-9]/g,"-")||"whiteboard"}.json`;yr(te,ie,"application/json"),A("Downloaded JSON file");}catch{A("Failed to download JSON");}},E=async()=>{try{let te=JSON.stringify(e,null,2);await navigator.clipboard.writeText(te),A("Copied JSON to clipboard! \u{1F4CB}");}catch{A("Could not copy JSON");}},ee=async()=>{if(!(_||t.length===0))try{S(!0),A("Preparing PDF\u2026");let te=e.filter(ie=>t.includes(ie.id));if(te.length===0)return;await mo(te,{orientation:P,appearance:I,margin:24,boardName:r,canvasBackground:n,isDark:d,isSelection:!0}),A(`Downloaded PDF (${P==="landscape"?"Landscape":"Portrait"}) \u2713`);}catch(te){console.error("Failed to export selection as PDF:",te),A("Export failed");}finally{S(false);}};return h?jsxRuntime.jsx("div",{ref:W,className:"fixed z-50 select-none animate-in fade-in-0 zoom-in-95 duration-100",style:{left:`${x.x}px`,top:`${x.y}px`},children:jsxRuntime.jsxs("div",{className:"relative w-56 rounded-2xl bg-white/95 dark:bg-[#18181b]/95 backdrop-blur-md shadow-sm dark:shadow-md border border-neutral-200/90 dark:border-neutral-800 p-1.5 text-xs text-neutral-800 dark:text-neutral-200 font-medium space-y-0.5",children:[C&&jsxRuntime.jsx("div",{className:"mb-1.5 px-2.5 py-1.5 rounded-2xl bg-emerald-500/15 border border-emerald-500/30 text-emerald-600 dark:text-emerald-400 text-center font-semibold text-[11px] animate-in fade-in",children:C}),t.length>0&&jsxRuntime.jsxs("div",{className:"relative",onMouseEnter:()=>y("pdf"),children:[jsxRuntime.jsxs("button",{type:"button",disabled:_,onClick:ee,className:"w-full flex items-center justify-between px-2.5 py-1.5 rounded-2xl bg-primary/10 hover:bg-primary/20 text-primary dark:text-foreground transition-colors cursor-pointer group font-semibold",children:[jsxRuntime.jsxs("div",{className:"flex items-center gap-2",children:[jsxRuntime.jsx(iconsReact.IconFileTypePdf,{size:14,className:"text-primary shrink-0"}),jsxRuntime.jsx("span",{children:_?"Preparing\u2026":"Export Selection as PDF"})]}),jsxRuntime.jsx("div",{className:"flex items-center gap-1",children:jsxRuntime.jsx(iconsReact.IconArrowRight,{size:12,className:"opacity-70"})})]}),k==="pdf"&&jsxRuntime.jsxs("div",{className:"absolute left-full top-0 ml-1.5 w-60 rounded-2xl bg-white/95 dark:bg-[#18181b]/95 backdrop-blur-md shadow-2xl border border-neutral-200/90 dark:border-neutral-800 p-2 text-xs space-y-2 animate-in fade-in-0 zoom-in-95 duration-100",style:{top:x.y+200>window.innerHeight?"-60px":"0px"},children:[jsxRuntime.jsxs("div",{children:[jsxRuntime.jsx("span",{className:"text-[10px] font-semibold text-neutral-400 uppercase tracking-wider block mb-1",children:"Orientation"}),jsxRuntime.jsxs("div",{className:"grid grid-cols-2 gap-1 bg-neutral-100 dark:bg-neutral-900/60 p-1 rounded-2xl border border-neutral-200/70 dark:border-neutral-800",children:[jsxRuntime.jsx("button",{type:"button",onClick:()=>R("portrait"),className:`px-1.5 py-1 rounded-2xl text-[11px] font-medium transition-all ${P==="portrait"?"bg-primary text-white shadow-xs":"text-neutral-500 hover:text-neutral-800 dark:hover:text-neutral-200"}`,children:"Portrait"}),jsxRuntime.jsx("button",{type:"button",onClick:()=>R("landscape"),className:`px-1.5 py-1 rounded-2xl text-[11px] font-medium transition-all ${P==="landscape"?"bg-primary text-white shadow-xs":"text-neutral-500 hover:text-neutral-800 dark:hover:text-neutral-200"}`,children:"Landscape"})]})]}),jsxRuntime.jsxs("div",{children:[jsxRuntime.jsx("span",{className:"text-[10px] font-semibold text-neutral-400 uppercase tracking-wider block mb-1",children:"Appearance"}),jsxRuntime.jsxs("div",{className:"grid grid-cols-3 gap-1 bg-neutral-100 dark:bg-neutral-900/60 p-1 rounded-2xl border border-neutral-200/70 dark:border-neutral-800",children:[jsxRuntime.jsx("button",{type:"button",onClick:()=>z("original"),className:`px-1 py-1 rounded-2xl text-[10px] font-medium transition-all ${I==="original"?"bg-primary text-white shadow-xs":"text-neutral-500 hover:text-neutral-800 dark:hover:text-neutral-200"}`,children:"Original"}),jsxRuntime.jsx("button",{type:"button",onClick:()=>z("light"),className:`px-1 py-1 rounded-2xl text-[10px] font-medium transition-all ${I==="light"?"bg-primary text-white shadow-xs":"text-neutral-500 hover:text-neutral-800 dark:hover:text-neutral-200"}`,children:"Light"}),jsxRuntime.jsx("button",{type:"button",onClick:()=>z("dark"),className:`px-1 py-1 rounded-2xl text-[10px] font-medium transition-all ${I==="dark"?"bg-primary text-white shadow-xs":"text-neutral-500 hover:text-neutral-800 dark:hover:text-neutral-200"}`,children:"Dark"})]})]}),jsxRuntime.jsxs("div",{className:"flex items-center justify-between text-[10px] text-neutral-400 px-1",children:[jsxRuntime.jsx("span",{children:"Margins"}),jsxRuntime.jsx("span",{className:"font-mono",children:"24 pt"})]}),jsxRuntime.jsx("div",{className:"h-[1px] bg-neutral-200/80 dark:bg-neutral-800"}),jsxRuntime.jsxs("button",{type:"button",disabled:_,onClick:ee,className:"w-full flex items-center justify-between px-2 py-1.5 rounded-2xl bg-primary text-white hover:bg-primary/90 transition-colors cursor-pointer font-medium",children:[jsxRuntime.jsxs("div",{className:"flex items-center gap-1.5",children:[jsxRuntime.jsx(iconsReact.IconDownload,{size:13}),jsxRuntime.jsx("span",{children:_?"Generating\u2026":"Download PDF"})]}),jsxRuntime.jsx("span",{className:"text-[10px] opacity-75 capitalize",children:P})]})]}),jsxRuntime.jsx("div",{className:"h-[1px] bg-neutral-200/80 dark:bg-neutral-800 my-1"})]}),jsxRuntime.jsxs("button",{type:"button",onClick:()=>{o(),A("Saved to storage \u2713");},className:"w-full flex items-center justify-between px-2.5 py-1.5 rounded-2xl hover:bg-neutral-100 dark:hover:bg-neutral-800 transition-colors cursor-pointer group",children:[jsxRuntime.jsxs("div",{className:"flex items-center gap-2 text-neutral-700 dark:text-neutral-200 group-hover:text-primary",children:[jsxRuntime.jsx(iconsReact.IconDeviceFloppy,{size:14,className:"text-primary"}),jsxRuntime.jsx("span",{children:"Save Board"})]}),jsxRuntime.jsx("kbd",{className:"text-[10px] font-mono text-neutral-400 bg-neutral-100 dark:bg-neutral-800/80 px-1.5 py-0.5 rounded-2xl border border-neutral-200 dark:border-neutral-700",children:"Ctrl+S"})]}),jsxRuntime.jsx("div",{className:"h-[1px] bg-neutral-200/80 dark:bg-neutral-800 my-1"}),jsxRuntime.jsxs("div",{className:"relative",onMouseEnter:()=>y("image"),children:[jsxRuntime.jsxs("button",{type:"button",className:"w-full flex items-center justify-between px-2.5 py-1.5 rounded-2xl hover:bg-neutral-100 dark:hover:bg-neutral-800 transition-colors cursor-pointer group",children:[jsxRuntime.jsxs("div",{className:"flex items-center gap-2 text-neutral-700 dark:text-neutral-200 group-hover:text-primary",children:[jsxRuntime.jsx(iconsReact.IconPhoto,{size:14,className:"text-purple-500"}),jsxRuntime.jsx("span",{children:"Export Image"})]}),jsxRuntime.jsx(iconsReact.IconArrowRight,{size:12,className:"text-neutral-400"})]}),k==="image"&&jsxRuntime.jsxs("div",{className:"absolute left-full top-0 ml-1.5 w-60 rounded-2xl bg-white/95 dark:bg-[#18181b]/95 backdrop-blur-md shadow-2xl border border-neutral-200/90 dark:border-neutral-800 p-2 text-xs space-y-2 animate-in fade-in-0 zoom-in-95 duration-100",style:{top:x.y+260>window.innerHeight?"-120px":"0px"},children:[jsxRuntime.jsxs("div",{children:[jsxRuntime.jsx("span",{className:"text-[10px] font-semibold text-neutral-400 uppercase tracking-wider block mb-1",children:"Background"}),jsxRuntime.jsxs("div",{className:"grid grid-cols-3 gap-1 bg-neutral-100 dark:bg-neutral-900/60 p-1 rounded-2xl border border-neutral-200/70 dark:border-neutral-800",children:[jsxRuntime.jsx("button",{type:"button",onClick:()=>w("dark"),className:`px-1.5 py-1 rounded-2xl text-[11px] font-medium transition-all ${$==="dark"?"bg-[#181818] text-white shadow-xs":"text-neutral-500 hover:text-neutral-800 dark:hover:text-neutral-200"}`,children:"Dark"}),jsxRuntime.jsx("button",{type:"button",onClick:()=>w("light"),className:`px-1.5 py-1 rounded-2xl text-[11px] font-medium transition-all ${$==="light"?"bg-white text-neutral-900 shadow-xs border border-neutral-200":"text-neutral-500 hover:text-neutral-800 dark:hover:text-neutral-200"}`,children:"White"}),jsxRuntime.jsx("button",{type:"button",onClick:()=>w("transparent"),className:`px-1.5 py-1 rounded-2xl text-[11px] font-medium transition-all ${$==="transparent"?"bg-primary text-white shadow-xs":"text-neutral-500 hover:text-neutral-800 dark:hover:text-neutral-200"}`,children:"Clear"})]})]}),jsxRuntime.jsxs("div",{children:[jsxRuntime.jsx("span",{className:"text-[10px] font-semibold text-neutral-400 uppercase tracking-wider block mb-1",children:"Scale"}),jsxRuntime.jsx("div",{className:"grid grid-cols-3 gap-1 bg-neutral-100 dark:bg-neutral-900/60 p-1 rounded-2xl border border-neutral-200/70 dark:border-neutral-800",children:[1,2,3].map(te=>jsxRuntime.jsxs("button",{type:"button",onClick:()=>v(te),className:`px-1.5 py-1 rounded-2xl text-[11px] font-medium transition-all ${f===te?"bg-primary text-white shadow-xs":"text-neutral-500 hover:text-neutral-800 dark:hover:text-neutral-200"}`,children:[te,"x"]},te))})]}),jsxRuntime.jsx("div",{className:"h-[1px] bg-neutral-200/80 dark:bg-neutral-800"}),jsxRuntime.jsxs("div",{className:"space-y-1",children:[jsxRuntime.jsxs("button",{type:"button",onClick:F,className:"w-full flex items-center justify-between px-2 py-1.5 rounded-2xl bg-neutral-100 dark:bg-neutral-800/80 hover:bg-primary hover:text-white dark:hover:bg-primary dark:hover:text-white transition-colors cursor-pointer",children:[jsxRuntime.jsxs("div",{className:"flex items-center gap-1.5",children:[jsxRuntime.jsx(iconsReact.IconDownload,{size:13}),jsxRuntime.jsx("span",{children:"Download PNG"})]}),jsxRuntime.jsxs("span",{className:"text-[10px] opacity-75",children:[f,"x"]})]}),jsxRuntime.jsxs("button",{type:"button",onClick:Z,className:"w-full flex items-center gap-1.5 px-2 py-1.5 rounded-2xl hover:bg-neutral-100 dark:hover:bg-neutral-800 transition-colors cursor-pointer text-neutral-700 dark:text-neutral-300",children:[jsxRuntime.jsx(iconsReact.IconCopy,{size:13}),jsxRuntime.jsx("span",{children:"Copy PNG to Clipboard"})]}),jsxRuntime.jsxs("button",{type:"button",onClick:be,className:"w-full flex items-center gap-1.5 px-2 py-1.5 rounded-2xl hover:bg-neutral-100 dark:hover:bg-neutral-800 transition-colors cursor-pointer text-neutral-700 dark:text-neutral-300",children:[jsxRuntime.jsx(iconsReact.IconCode,{size:13}),jsxRuntime.jsx("span",{children:"Download SVG Vector"})]})]})]})]}),jsxRuntime.jsxs("div",{className:"relative",onMouseEnter:()=>y("json"),children:[jsxRuntime.jsxs("button",{type:"button",className:"w-full flex items-center justify-between px-2.5 py-1.5 rounded-2xl hover:bg-neutral-100 dark:hover:bg-neutral-800 transition-colors cursor-pointer group",children:[jsxRuntime.jsxs("div",{className:"flex items-center gap-2 text-neutral-700 dark:text-neutral-200 group-hover:text-primary",children:[jsxRuntime.jsx(iconsReact.IconCode,{size:14,className:"text-emerald-500"}),jsxRuntime.jsx("span",{children:"Current JSON"})]}),jsxRuntime.jsx(iconsReact.IconArrowRight,{size:12,className:"text-neutral-400"})]}),k==="json"&&jsxRuntime.jsxs("div",{className:"absolute left-full top-0 ml-1.5 w-48 rounded-xl bg-white/95 dark:bg-[#18181b]/95 backdrop-blur-md shadow-2xl border border-neutral-200/90 dark:border-neutral-800 p-1.5 text-xs space-y-1 animate-in fade-in-0 zoom-in-95 duration-100",children:[jsxRuntime.jsxs("button",{type:"button",onClick:U,className:"w-full flex items-center gap-2 px-2 py-1.5 rounded-2xl hover:bg-neutral-100 dark:hover:bg-neutral-800 transition-colors cursor-pointer text-neutral-700 dark:text-neutral-300",children:[jsxRuntime.jsx(iconsReact.IconDownload,{size:13}),jsxRuntime.jsx("span",{children:"Download .json file"})]}),jsxRuntime.jsxs("button",{type:"button",onClick:E,className:"w-full flex items-center gap-2 px-2 py-1.5 rounded-2xl hover:bg-neutral-100 dark:hover:bg-neutral-800 transition-colors cursor-pointer text-neutral-700 dark:text-neutral-300",children:[jsxRuntime.jsx(iconsReact.IconCopy,{size:13}),jsxRuntime.jsx("span",{children:"Copy JSON to Clipboard"})]})]})]}),jsxRuntime.jsxs("div",{className:"relative",onMouseEnter:()=>y("grid"),children:[jsxRuntime.jsxs("button",{type:"button",className:"w-full flex items-center justify-between px-2.5 py-1.5 rounded-2xl hover:bg-neutral-100 dark:hover:bg-neutral-800 transition-colors cursor-pointer group",children:[jsxRuntime.jsxs("div",{className:"flex items-center gap-2 text-neutral-700 dark:text-neutral-200 group-hover:text-primary",children:[jsxRuntime.jsx(iconsReact.IconGridPattern,{size:14,className:"text-blue-500"}),jsxRuntime.jsx("span",{children:"Grid Pattern"})]}),jsxRuntime.jsx(iconsReact.IconArrowRight,{size:12,className:"text-neutral-400"})]}),k==="grid"&&jsxRuntime.jsx("div",{className:"absolute left-full top-0 ml-1.5 w-44 rounded-xl bg-white/95 dark:bg-[#18181b]/95 backdrop-blur-md shadow-2xl border border-neutral-200/90 dark:border-neutral-800 p-1.5 text-xs space-y-0.5 animate-in fade-in-0 zoom-in-95 duration-100",children:[{id:"grid",label:"Mesh Grid (Default)"},{id:"dots",label:"Dots Grid"},{id:"cross",label:"Crosshairs"},{id:"none",label:"Clean Canvas"}].map(te=>jsxRuntime.jsxs("button",{type:"button",onClick:()=>{l(te.id),A(`Grid: ${te.label}`);},className:`w-full flex items-center justify-between px-2 py-1.5 rounded-2xl transition-colors cursor-pointer ${c===te.id?"bg-primary/10 text-primary font-semibold":"hover:bg-neutral-100 dark:hover:bg-neutral-800 text-neutral-700 dark:text-neutral-300"}`,children:[jsxRuntime.jsx("span",{children:te.label}),c===te.id&&jsxRuntime.jsx(iconsReact.IconCheck,{size:13,stroke:2.5})]},te.id))})]}),jsxRuntime.jsx("div",{className:"h-[1px] bg-neutral-200/80 dark:bg-neutral-800 my-1"}),jsxRuntime.jsxs("button",{type:"button",onClick:()=>{s(),a(false);},className:"w-full flex items-center gap-2 px-2.5 py-1.5 rounded-2xl hover:bg-neutral-100 dark:hover:bg-neutral-800 transition-colors cursor-pointer text-neutral-700 dark:text-neutral-300",children:[jsxRuntime.jsx(iconsReact.IconFocusCentered,{size:14}),jsxRuntime.jsx("span",{children:"Reset Zoom (100%)"})]}),jsxRuntime.jsxs("button",{type:"button",onClick:()=>{a(false),p();},className:"w-full flex items-center gap-2 px-2.5 py-1.5 rounded-2xl hover:bg-red-50 dark:hover:bg-red-950/40 text-red-600 dark:text-red-400 transition-colors cursor-pointer",children:[jsxRuntime.jsx(iconsReact.IconTrash,{size:14}),jsxRuntime.jsx("span",{children:"Clear Whiteboard..."})]})]})}):null}function xn({isOpen:e,onClose:t,elements:r,selectedIds:o=[],onImportElements:p,boardName:c,canvasBackground:l="#ffffff",gridStyle:s="grid"}){let[n,u]=Ln.useState("pdf"),[i,d]=Ln.useState("portrait"),[h,a]=Ln.useState("original"),[x,b]=Ln.useState(false),[k,y]=Ln.useState(null),[_,S]=Ln.useState(2),[P,R]=Ln.useState(l),[I,z]=Ln.useState("none"),[$,w]=Ln.useState("all"),[f,v]=Ln.useState(false),C=Ln.useRef(null),T=r.filter(E=>E.type==="frame"),[W,le]=Ln.useState(false);if(e!==W&&(le(e),e))if(R(l),z(s),y(null),o.length>0){let E=T.find(ee=>o.includes(ee.id));w(E?`frame:${E.id}`:"selection");}else w("all");if(!e)return null;let L=()=>{if($==="selection"&&o.length>0)return {targets:r.filter(E=>o.includes(E.id)),isSelection:true};if($.startsWith("frame:")){let E=$.replace("frame:",""),ee=T.find(te=>te.id===E);if(ee)return {targets:[ee,...Rr(ee,r)],isSelection:false}}return {targets:r,isSelection:false}},A=async()=>{if(!(x||r.length===0))try{b(!0);let{targets:E,isSelection:ee}=L();if(E.length===0)return;await mo(E,{orientation:i,appearance:h,margin:24,boardName:c,canvasBackground:l,isDark:typeof document<"u"&&document.documentElement.classList.contains("dark"),isSelection:ee,onProgress:(te,ie)=>{y({current:te,total:ie});}}),t();}catch(E){console.error("Failed to export PDF:",E);}finally{b(false),y(null);}},F=async()=>{try{if(v(!0),$.startsWith("frame:")){let ie=$.replace("frame:",""),Se=T.find(Ke=>Ke.id===ie);if(Se){let Ke=await bo(Se,r,{scale:_,backgroundColor:P}),X=(Se.frameLabel||"frame").toLowerCase().replace(/\s+/g,"-"),Oe=`${c.toLowerCase().replace(/\s+/g,"-")||"sketch"}-${X}.png`;yr(Ke,Oe,"image/png"),t();return}}let{targets:E}=L(),ee=await Jr(E,{scale:_,backgroundColor:P,gridStyle:I}),te=`${c.toLowerCase().replace(/\s+/g,"-")||"sketch"}.png`;yr(ee,te,"image/png"),t();}catch(E){console.error("Failed to export PNG:",E);}finally{v(false);}},Z=()=>{try{let{targets:E}=L(),ee=fo(E,{backgroundColor:P,gridStyle:I}),te=`${c.toLowerCase().replace(/\s+/g,"-")||"sketch"}.svg`;yr(ee,te,"image/svg+xml"),t();}catch(E){console.error("Failed to export SVG:",E);}},be=()=>{let E=JSON.stringify(r,null,2),ee=`${c.toLowerCase().replace(/\s+/g,"-")||"sketch"}.json`;yr(E,ee,"application/json"),t();},U=E=>{let ee=E.target.files?.[0];if(!ee)return;let te=new FileReader;te.onload=ie=>{try{let Se=JSON.parse(ie.target?.result);Array.isArray(Se)?(p(Se),t()):alert("Invalid file format. Expected an array of Sketch elements.");}catch{alert("Failed to parse JSON file.");}},te.readAsText(ee);};return jsxRuntime.jsx("div",{className:"fixed inset-0 z-50 flex items-center justify-center p-4 bg-black/50 backdrop-blur-xs animate-in fade-in duration-150",children:jsxRuntime.jsxs("div",{className:"w-full max-w-md bg-white dark:bg-neutral-900 rounded-[22px] shadow-2xl border-2 border-neutral-200/90 dark:border-neutral-800 overflow-hidden",children:[jsxRuntime.jsxs("div",{className:"flex items-center justify-between px-5 py-4 border-b border-neutral-200 dark:border-neutral-800",children:[jsxRuntime.jsxs("h2",{className:"text-base font-bold text-neutral-900 dark:text-neutral-100 flex items-center gap-2",children:[jsxRuntime.jsx(iconsReact.IconDownload,{size:18,className:"text-primary"}),"Export & Save"]}),jsxRuntime.jsx("button",{type:"button",onClick:t,className:"p-1 rounded-[8px] text-neutral-400 hover:text-neutral-700 dark:hover:text-neutral-200 hover:bg-neutral-100 dark:hover:bg-neutral-800 transition-colors cursor-pointer",children:jsxRuntime.jsx(iconsReact.IconX,{size:18})})]}),jsxRuntime.jsxs("div",{className:"flex border-b border-neutral-200 dark:border-neutral-800 bg-neutral-50 dark:bg-neutral-950/40 p-1.5 gap-1.5",children:[jsxRuntime.jsxs("button",{type:"button",onClick:()=>u("pdf"),className:`flex-1 flex items-center justify-center gap-1.5 py-2 rounded-[12px] text-xs font-semibold transition-colors cursor-pointer ${n==="pdf"?"bg-white dark:bg-neutral-800 text-primary shadow-xs border border-neutral-200 dark:border-neutral-700":"text-neutral-600 dark:text-neutral-400 hover:text-neutral-900 dark:hover:text-white"}`,children:[jsxRuntime.jsx(iconsReact.IconFileTypePdf,{size:16}),"PDF (A4)"]}),jsxRuntime.jsxs("button",{type:"button",onClick:()=>u("image"),className:`flex-1 flex items-center justify-center gap-1.5 py-2 rounded-[12px] text-xs font-semibold transition-colors cursor-pointer ${n==="image"?"bg-white dark:bg-neutral-800 text-primary shadow-xs border border-neutral-200 dark:border-neutral-700":"text-neutral-600 dark:text-neutral-400 hover:text-neutral-900 dark:hover:text-white"}`,children:[jsxRuntime.jsx(iconsReact.IconFileTypePng,{size:16}),"Image (PNG/SVG)"]}),jsxRuntime.jsxs("button",{type:"button",onClick:()=>u("json"),className:`flex-1 flex items-center justify-center gap-1.5 py-2 rounded-[12px] text-xs font-semibold transition-colors cursor-pointer ${n==="json"?"bg-white dark:bg-neutral-800 text-primary shadow-xs border border-neutral-200 dark:border-neutral-700":"text-neutral-600 dark:text-neutral-400 hover:text-neutral-900 dark:hover:text-white"}`,children:[jsxRuntime.jsx(iconsReact.IconFileCode,{size:16}),"JSON"]})]}),jsxRuntime.jsxs("div",{className:"p-5 space-y-4",children:[n!=="json"&&jsxRuntime.jsxs("div",{children:[jsxRuntime.jsxs("label",{className:"text-xs font-semibold text-neutral-600 dark:text-neutral-400 block mb-1.5 flex items-center justify-between",children:[jsxRuntime.jsx("span",{children:"Export Scope"}),T.length>0&&jsxRuntime.jsxs("span",{className:"text-[10px] text-primary font-medium flex items-center gap-1",children:[jsxRuntime.jsx(iconsReact.IconLayout,{size:12}),T.length," frame",T.length>1?"s":""," detected"]})]}),jsxRuntime.jsxs("div",{className:"relative",children:[jsxRuntime.jsxs("select",{value:$,onChange:E=>w(E.target.value),className:"w-full py-2 px-3 rounded-[10px] border border-neutral-200 dark:border-neutral-800 bg-neutral-50 dark:bg-neutral-800 text-xs font-medium text-neutral-800 dark:text-neutral-200 focus:outline-none focus:ring-2 focus:ring-primary/40 appearance-none cursor-pointer",children:[jsxRuntime.jsx("option",{value:"all",children:"Entire Canvas (All Elements)"}),o.length>0&&jsxRuntime.jsxs("option",{value:"selection",children:["Selected Elements (",o.length," item",o.length>1?"s":"",")"]}),T.length>0&&jsxRuntime.jsx("optgroup",{label:"Frames / Artboards",children:T.map((E,ee)=>jsxRuntime.jsxs("option",{value:`frame:${E.id}`,children:["\u{1F5BC}\uFE0F ",E.frameLabel||`Frame ${ee+1}`," (",Math.round(E.width),"\xD7",Math.round(E.height),")"]},E.id))})]}),jsxRuntime.jsx("div",{className:"absolute right-3 top-1/2 -translate-y-1/2 pointer-events-none text-neutral-400 text-xs",children:"\u25BC"})]})]}),n==="pdf"?jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsxs("div",{className:"flex items-center justify-between px-3 py-2 rounded-[10px] bg-neutral-100 dark:bg-neutral-800/60 border border-neutral-200/80 dark:border-neutral-800 text-xs",children:[jsxRuntime.jsx("span",{className:"text-neutral-600 dark:text-neutral-400 font-medium",children:"Paper Size"}),jsxRuntime.jsxs("span",{className:"font-semibold text-neutral-900 dark:text-neutral-100 flex items-center gap-1.5",children:[jsxRuntime.jsx("span",{className:"px-1.5 py-0.5 rounded bg-primary/10 text-primary text-[10px] font-bold",children:"A4"}),jsxRuntime.jsx("span",{children:"210 \xD7 297 mm"})]})]}),jsxRuntime.jsxs("div",{children:[jsxRuntime.jsx("label",{className:"text-xs font-semibold text-neutral-600 dark:text-neutral-400 block mb-1.5",children:"Orientation"}),jsxRuntime.jsxs("div",{className:"grid grid-cols-2 gap-2 text-xs",children:[jsxRuntime.jsxs("button",{type:"button",onClick:()=>d("portrait"),className:`py-2 px-3 rounded-[10px] border font-medium flex items-center justify-center gap-2 transition-colors cursor-pointer ${i==="portrait"?"bg-primary/10 border-primary text-primary font-bold shadow-2xs":"border-neutral-200 dark:border-neutral-800 text-neutral-700 dark:text-neutral-300 hover:bg-neutral-50 dark:hover:bg-neutral-800"}`,children:[jsxRuntime.jsx("svg",{width:"14",height:"18",viewBox:"0 0 14 18",fill:"none",className:"shrink-0",children:jsxRuntime.jsx("rect",{x:"1",y:"1",width:"12",height:"16",rx:"2",stroke:"currentColor",strokeWidth:"1.5"})}),jsxRuntime.jsx("span",{children:"Portrait"})]}),jsxRuntime.jsxs("button",{type:"button",onClick:()=>d("landscape"),className:`py-2 px-3 rounded-[10px] border font-medium flex items-center justify-center gap-2 transition-colors cursor-pointer ${i==="landscape"?"bg-primary/10 border-primary text-primary font-bold shadow-2xs":"border-neutral-200 dark:border-neutral-800 text-neutral-700 dark:text-neutral-300 hover:bg-neutral-50 dark:hover:bg-neutral-800"}`,children:[jsxRuntime.jsx("svg",{width:"18",height:"14",viewBox:"0 0 18 14",fill:"none",className:"shrink-0",children:jsxRuntime.jsx("rect",{x:"1",y:"1",width:"16",height:"12",rx:"2",stroke:"currentColor",strokeWidth:"1.5"})}),jsxRuntime.jsx("span",{children:"Landscape"})]})]})]}),jsxRuntime.jsxs("div",{children:[jsxRuntime.jsx("label",{className:"text-xs font-semibold text-neutral-600 dark:text-neutral-400 block mb-1.5",children:"Appearance"}),jsxRuntime.jsxs("div",{className:"grid grid-cols-3 gap-2 text-xs",children:[jsxRuntime.jsxs("button",{type:"button",onClick:()=>a("original"),className:`py-2 px-2 rounded-[10px] border font-medium flex items-center justify-center gap-1.5 transition-colors cursor-pointer ${h==="original"?"bg-primary/10 border-primary text-primary font-bold shadow-2xs":"border-neutral-200 dark:border-neutral-800 text-neutral-700 dark:text-neutral-300 hover:bg-neutral-50 dark:hover:bg-neutral-800"}`,children:[jsxRuntime.jsx("span",{className:"w-2.5 h-2.5 rounded-full border border-black/10 dark:border-white/10 shrink-0",style:{backgroundColor:l}}),jsxRuntime.jsx("span",{children:"Original"})]}),jsxRuntime.jsxs("button",{type:"button",onClick:()=>a("light"),className:`py-2 px-2 rounded-[10px] border font-medium flex items-center justify-center gap-1.5 transition-colors cursor-pointer ${h==="light"?"bg-primary/10 border-primary text-primary font-bold shadow-2xs":"border-neutral-200 dark:border-neutral-800 text-neutral-700 dark:text-neutral-300 hover:bg-neutral-50 dark:hover:bg-neutral-800"}`,children:[jsxRuntime.jsx(iconsReact.IconSun,{size:13,className:"text-amber-500"}),jsxRuntime.jsx("span",{children:"Light"})]}),jsxRuntime.jsxs("button",{type:"button",onClick:()=>a("dark"),className:`py-2 px-2 rounded-[10px] border font-medium flex items-center justify-center gap-1.5 transition-colors cursor-pointer ${h==="dark"?"bg-primary/10 border-primary text-primary font-bold shadow-2xs":"border-neutral-200 dark:border-neutral-800 text-neutral-700 dark:text-neutral-300 hover:bg-neutral-50 dark:hover:bg-neutral-800"}`,children:[jsxRuntime.jsx(iconsReact.IconMoon,{size:13,className:"text-primary"}),jsxRuntime.jsx("span",{children:"Dark"})]})]})]}),jsxRuntime.jsxs("div",{className:"flex items-center justify-between text-[11px] text-neutral-500 dark:text-neutral-400 px-1 pt-1",children:[jsxRuntime.jsx("span",{children:"Page Margins"}),jsxRuntime.jsx("span",{className:"font-mono",children:"24 pt"})]}),jsxRuntime.jsx("div",{className:"pt-2",children:jsxRuntime.jsxs("button",{type:"button",onClick:A,disabled:x||r.length===0,className:"w-full flex items-center justify-center gap-2 py-2.5 px-4 rounded-[12px] bg-primary hover:bg-primary/90 text-primary-foreground text-xs font-semibold shadow-md shadow-primary/25 disabled:opacity-50 transition-colors cursor-pointer",children:[jsxRuntime.jsx(iconsReact.IconFileTypePdf,{size:16}),jsxRuntime.jsx("span",{children:x?k?`Generating PDF (Page ${k.current} of ${k.total})\u2026`:"Preparing PDF\u2026":"Download PDF"})]})})]}):n==="image"?jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsxs("div",{children:[jsxRuntime.jsxs("div",{className:"flex items-center justify-between mb-1.5",children:[jsxRuntime.jsx("label",{className:"text-xs font-semibold text-neutral-600 dark:text-neutral-400",children:"Background Color"}),P!=="transparent"&&jsxRuntime.jsx("span",{className:"text-[10px] font-mono text-neutral-400",children:P})]}),jsxRuntime.jsx("div",{className:"grid grid-cols-4 gap-2 text-xs",children:[{label:"Canvas",val:l},{label:"White",val:"#ffffff"},{label:"Dark",val:"#121212"},{label:"Transparent",val:"transparent"}].map(E=>{let ee=P===E.val;return jsxRuntime.jsxs("button",{type:"button",onClick:()=>R(E.val),className:`py-2 px-1 rounded-[10px] border font-medium flex items-center justify-center gap-1.5 transition-colors cursor-pointer ${ee?"bg-primary/10 border-primary text-primary font-bold shadow-2xs":"border-neutral-200 dark:border-neutral-800 text-neutral-700 dark:text-neutral-300 hover:bg-neutral-50 dark:hover:bg-neutral-800"}`,children:[E.val!=="transparent"&&jsxRuntime.jsx("span",{className:"w-3 h-3 rounded-full border border-black/10 dark:border-white/10 shrink-0",style:{backgroundColor:E.val}}),jsxRuntime.jsx("span",{className:"truncate",children:E.label})]},E.label)})})]}),jsxRuntime.jsxs("div",{children:[jsxRuntime.jsx("label",{className:"text-xs font-semibold text-neutral-600 dark:text-neutral-400 block mb-1.5",children:"Grid Pattern"}),jsxRuntime.jsx("div",{className:"grid grid-cols-4 gap-2 text-xs",children:[{label:"Mesh Grid",val:"grid"},{label:"Dots",val:"dots"},{label:"Cross",val:"cross"},{label:"None",val:"none"}].map(E=>jsxRuntime.jsx("button",{type:"button",onClick:()=>z(E.val),className:`py-2 rounded-[10px] border font-medium transition-colors cursor-pointer ${I===E.val?"bg-primary/10 border-primary text-primary font-bold":"border-neutral-200 dark:border-neutral-800 text-neutral-700 dark:text-neutral-300 hover:bg-neutral-50 dark:hover:bg-neutral-800"}`,children:E.label},E.val))})]}),jsxRuntime.jsxs("div",{children:[jsxRuntime.jsx("label",{className:"text-xs font-semibold text-neutral-600 dark:text-neutral-400 block mb-1.5",children:"Scale / Resolution"}),jsxRuntime.jsx("div",{className:"grid grid-cols-3 gap-2 text-xs",children:[{label:"1x (Standard)",val:1},{label:"2x (HD Crisp)",val:2},{label:"3x (Ultra HD)",val:3}].map(E=>jsxRuntime.jsx("button",{type:"button",onClick:()=>S(E.val),className:`py-2 rounded-[10px] border font-medium transition-colors cursor-pointer ${_===E.val?"bg-primary/10 border-primary text-primary font-bold":"border-neutral-200 dark:border-neutral-800 text-neutral-700 dark:text-neutral-300 hover:bg-neutral-50 dark:hover:bg-neutral-800"}`,children:E.label},E.val))})]}),jsxRuntime.jsxs("div",{className:"grid grid-cols-2 gap-3 pt-2",children:[jsxRuntime.jsxs("button",{type:"button",onClick:F,disabled:f||r.length===0,className:"flex items-center justify-center gap-2 py-2.5 px-4 rounded-[12px] bg-primary hover:bg-primary/90 text-primary-foreground text-xs font-semibold shadow-md shadow-primary/25 disabled:opacity-50 transition-colors cursor-pointer",children:[jsxRuntime.jsx(iconsReact.IconFileTypePng,{size:16}),f?"Rendering...":"Export PNG"]}),jsxRuntime.jsxs("button",{type:"button",onClick:Z,disabled:r.length===0,className:"flex items-center justify-center gap-2 py-2.5 px-4 rounded-[12px] border-2 border-neutral-300 dark:border-neutral-700 hover:bg-neutral-100 dark:hover:bg-neutral-800 text-neutral-800 dark:text-neutral-200 text-xs font-semibold disabled:opacity-50 transition-colors cursor-pointer",children:[jsxRuntime.jsx(iconsReact.IconFileTypeSvg,{size:16}),"Export SVG"]})]})]}):jsxRuntime.jsxs("div",{className:"space-y-4",children:[jsxRuntime.jsx("p",{className:"text-xs text-neutral-500 dark:text-neutral-400 leading-relaxed",children:"Save your complete workspace as a lightweight JSON file so you can reopen, share, or edit it at any time."}),jsxRuntime.jsxs("button",{type:"button",onClick:be,disabled:r.length===0,className:"w-full flex items-center justify-center gap-2 py-2.5 px-4 rounded-[12px] bg-primary hover:bg-primary/90 text-primary-foreground text-xs font-semibold shadow-md shadow-primary/25 disabled:opacity-50 transition-colors cursor-pointer",children:[jsxRuntime.jsx(iconsReact.IconDownload,{size:16}),"Download Project (.json)"]}),jsxRuntime.jsxs("div",{className:"relative flex items-center justify-center",children:[jsxRuntime.jsx("div",{className:"w-full border-t border-neutral-200 dark:border-neutral-800"}),jsxRuntime.jsx("span",{className:"absolute px-2 bg-white dark:bg-neutral-900 text-[11px] text-neutral-400",children:"or"})]}),jsxRuntime.jsx("input",{ref:C,type:"file",accept:".json",onChange:U,className:"hidden"}),jsxRuntime.jsxs("button",{type:"button",onClick:()=>C.current?.click(),className:"w-full flex items-center justify-center gap-2 py-2.5 px-4 rounded-[12px] border-2 border-neutral-300 dark:border-neutral-700 hover:bg-neutral-100 dark:hover:bg-neutral-800 text-neutral-800 dark:text-neutral-200 text-xs font-semibold transition-colors cursor-pointer",children:[jsxRuntime.jsx(iconsReact.IconUpload,{size:16}),"Open Existing Project (.json)"]})]})]})]})})}function Kr({value:e,side:t,className:r="w-6 h-4",strokeWidth:o=1.6}){return jsxRuntime.jsx("svg",{viewBox:"0 0 28 20",className:r,fill:"none",xmlns:"http://www.w3.org/2000/svg",children:t==="start"?jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[e==="none"&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("line",{x1:"10",y1:"10",x2:"24",y2:"10",stroke:"currentColor",strokeWidth:o,strokeLinecap:"round"}),jsxRuntime.jsx("line",{x1:"4",y1:"7",x2:"8",y2:"13",stroke:"currentColor",strokeWidth:1.4,strokeLinecap:"round"}),jsxRuntime.jsx("line",{x1:"8",y1:"7",x2:"4",y2:"13",stroke:"currentColor",strokeWidth:1.4,strokeLinecap:"round"})]}),e==="arrow"&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("line",{x1:"6",y1:"10",x2:"24",y2:"10",stroke:"currentColor",strokeWidth:o,strokeLinecap:"round"}),jsxRuntime.jsx("path",{d:"M 12 5.5 L 6 10 L 12 14.5",stroke:"currentColor",strokeWidth:o,strokeLinecap:"round",strokeLinejoin:"round"})]}),e==="triangle"&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("line",{x1:"12",y1:"10",x2:"24",y2:"10",stroke:"currentColor",strokeWidth:o,strokeLinecap:"round"}),jsxRuntime.jsx("polygon",{points:"12,5 4.5,10 12,15",fill:"currentColor"})]}),e==="barbed"&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("line",{x1:"10",y1:"10",x2:"24",y2:"10",stroke:"currentColor",strokeWidth:o,strokeLinecap:"round"}),jsxRuntime.jsx("polygon",{points:"13,5 4.5,10 13,15 10,10",fill:"currentColor"})]}),e==="dot"&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("line",{x1:"10",y1:"10",x2:"24",y2:"10",stroke:"currentColor",strokeWidth:o,strokeLinecap:"round"}),jsxRuntime.jsx("circle",{cx:"7",cy:"10",r:"3.5",fill:"currentColor"})]}),e==="circle"&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("line",{x1:"11",y1:"10",x2:"24",y2:"10",stroke:"currentColor",strokeWidth:o,strokeLinecap:"round"}),jsxRuntime.jsx("circle",{cx:"7",cy:"10",r:"3.5",stroke:"currentColor",strokeWidth:o,fill:"none"})]}),e==="diamond"&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("line",{x1:"14",y1:"10",x2:"24",y2:"10",stroke:"currentColor",strokeWidth:o,strokeLinecap:"round"}),jsxRuntime.jsx("polygon",{points:"5,10 9.5,5.5 14,10 9.5,14.5",fill:"currentColor"})]}),e==="diamond_outline"&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("line",{x1:"14",y1:"10",x2:"24",y2:"10",stroke:"currentColor",strokeWidth:o,strokeLinecap:"round"}),jsxRuntime.jsx("polygon",{points:"5,10 9.5,5.5 14,10 9.5,14.5",stroke:"currentColor",strokeWidth:o,fill:"none",strokeLinejoin:"round"})]}),e==="bar"&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("line",{x1:"6",y1:"10",x2:"24",y2:"10",stroke:"currentColor",strokeWidth:o,strokeLinecap:"round"}),jsxRuntime.jsx("line",{x1:"6",y1:"5",x2:"6",y2:"15",stroke:"currentColor",strokeWidth:1.8,strokeLinecap:"round"})]}),e==="crowfoot_one"&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("line",{x1:"4",y1:"10",x2:"24",y2:"10",stroke:"currentColor",strokeWidth:o,strokeLinecap:"round"}),jsxRuntime.jsx("line",{x1:"8",y1:"5",x2:"8",y2:"15",stroke:"currentColor",strokeWidth:1.8,strokeLinecap:"round"})]}),e==="crowfoot_many"&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("line",{x1:"4",y1:"10",x2:"24",y2:"10",stroke:"currentColor",strokeWidth:o,strokeLinecap:"round"}),jsxRuntime.jsx("path",{d:"M 12 5.5 L 4 10 L 12 14.5",stroke:"currentColor",strokeWidth:o,strokeLinecap:"round",strokeLinejoin:"round"})]}),e==="crowfoot_one_many"&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("line",{x1:"4",y1:"10",x2:"24",y2:"10",stroke:"currentColor",strokeWidth:o,strokeLinecap:"round"}),jsxRuntime.jsx("path",{d:"M 11 5.5 L 4 10 L 11 14.5",stroke:"currentColor",strokeWidth:o,strokeLinecap:"round",strokeLinejoin:"round"}),jsxRuntime.jsx("line",{x1:"15",y1:"5",x2:"15",y2:"15",stroke:"currentColor",strokeWidth:1.8,strokeLinecap:"round"})]}),e==="crowfoot_strictly_one"&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("line",{x1:"4",y1:"10",x2:"24",y2:"10",stroke:"currentColor",strokeWidth:o,strokeLinecap:"round"}),jsxRuntime.jsx("line",{x1:"7",y1:"5",x2:"7",y2:"15",stroke:"currentColor",strokeWidth:1.8,strokeLinecap:"round"}),jsxRuntime.jsx("line",{x1:"12",y1:"5",x2:"12",y2:"15",stroke:"currentColor",strokeWidth:1.8,strokeLinecap:"round"})]}),e==="crowfoot_zero_one"&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("line",{x1:"4",y1:"10",x2:"24",y2:"10",stroke:"currentColor",strokeWidth:o,strokeLinecap:"round"}),jsxRuntime.jsx("line",{x1:"6",y1:"5",x2:"6",y2:"15",stroke:"currentColor",strokeWidth:1.8,strokeLinecap:"round"}),jsxRuntime.jsx("circle",{cx:"13",cy:"10",r:"3",stroke:"currentColor",strokeWidth:o,fill:"none"})]}),e==="crowfoot_zero_many"&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("line",{x1:"4",y1:"10",x2:"24",y2:"10",stroke:"currentColor",strokeWidth:o,strokeLinecap:"round"}),jsxRuntime.jsx("path",{d:"M 11 5.5 L 4 10 L 11 14.5",stroke:"currentColor",strokeWidth:o,strokeLinecap:"round",strokeLinejoin:"round"}),jsxRuntime.jsx("circle",{cx:"16",cy:"10",r:"3",stroke:"currentColor",strokeWidth:o,fill:"none"})]})]}):jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[e==="none"&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("line",{x1:"4",y1:"10",x2:"18",y2:"10",stroke:"currentColor",strokeWidth:o,strokeLinecap:"round"}),jsxRuntime.jsx("line",{x1:"20",y1:"7",x2:"24",y2:"13",stroke:"currentColor",strokeWidth:1.4,strokeLinecap:"round"}),jsxRuntime.jsx("line",{x1:"24",y1:"7",x2:"20",y2:"13",stroke:"currentColor",strokeWidth:1.4,strokeLinecap:"round"})]}),e==="arrow"&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("line",{x1:"4",y1:"10",x2:"22",y2:"10",stroke:"currentColor",strokeWidth:o,strokeLinecap:"round"}),jsxRuntime.jsx("path",{d:"M 16 5.5 L 22 10 L 16 14.5",stroke:"currentColor",strokeWidth:o,strokeLinecap:"round",strokeLinejoin:"round"})]}),e==="triangle"&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("line",{x1:"4",y1:"10",x2:"16",y2:"10",stroke:"currentColor",strokeWidth:o,strokeLinecap:"round"}),jsxRuntime.jsx("polygon",{points:"16,5 23.5,10 16,15",fill:"currentColor"})]}),e==="barbed"&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("line",{x1:"4",y1:"10",x2:"18",y2:"10",stroke:"currentColor",strokeWidth:o,strokeLinecap:"round"}),jsxRuntime.jsx("polygon",{points:"15,5 23.5,10 15,15 18,10",fill:"currentColor"})]}),e==="dot"&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("line",{x1:"4",y1:"10",x2:"18",y2:"10",stroke:"currentColor",strokeWidth:o,strokeLinecap:"round"}),jsxRuntime.jsx("circle",{cx:"21",cy:"10",r:"3.5",fill:"currentColor"})]}),e==="circle"&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("line",{x1:"4",y1:"10",x2:"17",y2:"10",stroke:"currentColor",strokeWidth:o,strokeLinecap:"round"}),jsxRuntime.jsx("circle",{cx:"21",cy:"10",r:"3.5",stroke:"currentColor",strokeWidth:o,fill:"none"})]}),e==="diamond"&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("line",{x1:"4",y1:"10",x2:"14",y2:"10",stroke:"currentColor",strokeWidth:o,strokeLinecap:"round"}),jsxRuntime.jsx("polygon",{points:"23,10 18.5,5.5 14,10 18.5,14.5",fill:"currentColor"})]}),e==="diamond_outline"&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("line",{x1:"4",y1:"10",x2:"14",y2:"10",stroke:"currentColor",strokeWidth:o,strokeLinecap:"round"}),jsxRuntime.jsx("polygon",{points:"23,10 18.5,5.5 14,10 18.5,14.5",stroke:"currentColor",strokeWidth:o,fill:"none",strokeLinejoin:"round"})]}),e==="bar"&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("line",{x1:"4",y1:"10",x2:"22",y2:"10",stroke:"currentColor",strokeWidth:o,strokeLinecap:"round"}),jsxRuntime.jsx("line",{x1:"22",y1:"5",x2:"22",y2:"15",stroke:"currentColor",strokeWidth:1.8,strokeLinecap:"round"})]}),e==="crowfoot_one"&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("line",{x1:"4",y1:"10",x2:"24",y2:"10",stroke:"currentColor",strokeWidth:o,strokeLinecap:"round"}),jsxRuntime.jsx("line",{x1:"20",y1:"5",x2:"20",y2:"15",stroke:"currentColor",strokeWidth:1.8,strokeLinecap:"round"})]}),e==="crowfoot_many"&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("line",{x1:"4",y1:"10",x2:"24",y2:"10",stroke:"currentColor",strokeWidth:o,strokeLinecap:"round"}),jsxRuntime.jsx("path",{d:"M 16 5.5 L 24 10 L 16 14.5",stroke:"currentColor",strokeWidth:o,strokeLinecap:"round",strokeLinejoin:"round"})]}),e==="crowfoot_one_many"&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("line",{x1:"4",y1:"10",x2:"24",y2:"10",stroke:"currentColor",strokeWidth:o,strokeLinecap:"round"}),jsxRuntime.jsx("path",{d:"M 17 5.5 L 24 10 L 17 14.5",stroke:"currentColor",strokeWidth:o,strokeLinecap:"round",strokeLinejoin:"round"}),jsxRuntime.jsx("line",{x1:"13",y1:"5",x2:"13",y2:"15",stroke:"currentColor",strokeWidth:1.8,strokeLinecap:"round"})]}),e==="crowfoot_strictly_one"&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("line",{x1:"4",y1:"10",x2:"24",y2:"10",stroke:"currentColor",strokeWidth:o,strokeLinecap:"round"}),jsxRuntime.jsx("line",{x1:"21",y1:"5",x2:"21",y2:"15",stroke:"currentColor",strokeWidth:1.8,strokeLinecap:"round"}),jsxRuntime.jsx("line",{x1:"16",y1:"5",x2:"16",y2:"15",stroke:"currentColor",strokeWidth:1.8,strokeLinecap:"round"})]}),e==="crowfoot_zero_one"&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("line",{x1:"4",y1:"10",x2:"24",y2:"10",stroke:"currentColor",strokeWidth:o,strokeLinecap:"round"}),jsxRuntime.jsx("line",{x1:"22",y1:"5",x2:"22",y2:"15",stroke:"currentColor",strokeWidth:1.8,strokeLinecap:"round"}),jsxRuntime.jsx("circle",{cx:"15",cy:"10",r:"3",stroke:"currentColor",strokeWidth:o,fill:"none"})]}),e==="crowfoot_zero_many"&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("line",{x1:"4",y1:"10",x2:"24",y2:"10",stroke:"currentColor",strokeWidth:o,strokeLinecap:"round"}),jsxRuntime.jsx("path",{d:"M 17 5.5 L 24 10 L 17 14.5",stroke:"currentColor",strokeWidth:o,strokeLinecap:"round",strokeLinejoin:"round"}),jsxRuntime.jsx("circle",{cx:"12",cy:"10",r:"3",stroke:"currentColor",strokeWidth:o,fill:"none"})]})]})})}function Yo({side:e,currentValue:t,onChange:r,onClose:o,className:p="",style:c}){let[l,s]=Ln.useState(false);Ln.useEffect(()=>{let h=a=>{let x=document.activeElement;if(x&&(x.tagName==="INPUT"||x.tagName==="TEXTAREA"))return;if(a.key==="Escape"){o();return}let b=a.key.toLowerCase(),k=co.find(y=>y.shortcut===b);k&&(a.preventDefault(),r(k.value),o());};return window.addEventListener("keydown",h),()=>window.removeEventListener("keydown",h)},[r,o]);let n=co.filter(h=>h.category==="standard"),u=co.filter(h=>h.category==="more"),i=co.filter(h=>h.category==="cardinality"),d=h=>{let a=t===h.value;return jsxRuntime.jsxs("button",{type:"button",onClick:()=>{r(h.value),o();},title:`${h.label}${h.shortcut?` (${h.shortcut})`:""}`,className:`relative w-8 h-8 rounded-[8px] flex items-center justify-center transition-all cursor-pointer ${a?"bg-primary/15 border border-primary text-primary shadow-2xs font-semibold":"border border-neutral-200/70 dark:border-neutral-800 text-neutral-700 dark:text-neutral-300 hover:bg-neutral-100 dark:hover:bg-neutral-800"}`,children:[jsxRuntime.jsx(Kr,{value:h.value,side:e,className:"w-5 h-3.5"}),h.shortcut&&jsxRuntime.jsx("span",{className:"absolute right-1 bottom-0.5 text-[8px] font-mono leading-none text-neutral-400 dark:text-neutral-500 pointer-events-none",children:h.shortcut})]},h.value)};return jsxRuntime.jsxs("div",{style:c,className:`z-50 bg-white/95 dark:bg-[#181818]/95 backdrop-blur-md rounded-[14px] shadow-lg border border-neutral-200/90 dark:border-neutral-800 p-2.5 space-y-2.5 select-none animate-in fade-in zoom-in-95 duration-100 ${p}`,children:[jsxRuntime.jsx("div",{className:"grid grid-cols-4 gap-1.5",children:n.map(d)}),jsxRuntime.jsxs("div",{className:"pt-0.5",children:[jsxRuntime.jsxs("button",{type:"button",onClick:()=>s(!l),className:"flex items-center justify-between w-full py-1 px-1 text-[11px] font-medium text-neutral-600 dark:text-neutral-400 hover:text-neutral-900 dark:hover:text-neutral-200 transition-colors",children:[jsxRuntime.jsx("span",{children:"More options"}),l?jsxRuntime.jsx(iconsReact.IconChevronUp,{size:14}):jsxRuntime.jsx(iconsReact.IconChevronDown,{size:14})]}),l&&jsxRuntime.jsxs("div",{className:"pt-1.5 space-y-2.5 animate-in fade-in duration-100",children:[jsxRuntime.jsx("div",{className:"grid grid-cols-4 gap-1.5",children:u.map(d)}),jsxRuntime.jsxs("div",{children:[jsxRuntime.jsx("span",{className:"text-[10px] font-semibold text-neutral-500 dark:text-neutral-400 uppercase tracking-wider block mb-1 px-1",children:"Cardinality"}),jsxRuntime.jsx("div",{className:"grid grid-cols-4 gap-1.5",children:i.map(d)})]})]})]})]})}function fn({selectedElements:e,updateSelectedElements:t,deleteSelectedElements:r,duplicateSelectedElements:o,groupSelectedElements:p,ungroupSelectedElements:c,alignSelectedElements:l,distributeSelectedElements:s,copySelectedImage:n,bringToFront:u,sendToBack:i,camera:d,worldToScreen:h,onEditText:a,onToggleSpotlight:x}){let{resolvedTheme:b}=Vt(),[k,y]=Ln.useState(false);Ln.useEffect(()=>{y(true);},[]);let _=k&&b==="dark",[S,P]=Ln.useState("none"),R=Ln.useRef(null),I=Ln.useRef(null),z=Ln.useRef(null),$=Ln.useRef(null),w=Ln.useRef(null),f=e[0],v=e.length===1,C=v&&!!(f&&f.type==="frame"),T=v&&!!(f&&f.type==="table"),W=v&&!!(f&&(f.type==="arrow"||f.type==="line")),le=v&&!!(f&&["text","sticky","rectangle","ellipse","diamond","triangle","capsule","parallelogram","trapezoid","hexagon","cylinder","cloud","star","frame","table"].includes(f.type)),L=v&&!!(f&&(f.type==="text"||f.type==="sticky")),A=v&&!!(f&&f.type==="sticky"),F=v&&!!(f&&f.type==="text"),Z=v&&!!(f&&f.type==="image"),be=v&&!!(f&&["rectangle","ellipse","diamond","triangle","capsule","parallelogram","trapezoid","hexagon","cylinder","cloud","star","table","arrow","line","pen"].includes(f.type));if(Ln.useEffect(()=>{let N=de=>{let oe=de.target;R.current&&R.current.contains(oe)||I.current&&I.current.contains(oe)||z.current&&z.current.contains(oe)||$.current&&$.current.contains(oe)||w.current&&w.current.contains(oe)||P("none");},se=de=>{if(!f||de.target instanceof HTMLInputElement||de.target instanceof HTMLTextAreaElement||de.target.isContentEditable||de.ctrlKey||de.metaKey||de.altKey||de.shiftKey)return;if(de.key==="Escape"){P("none");return}let oe=zo.find(O=>O.shortcut===de.key.toLowerCase());oe&&(de.preventDefault(),S==="textColor"?t({strokeColor:oe.hex}):S==="color"&&t(A?{fillColor:oe.hex,stickyColor:oe.hex}:{strokeColor:oe.hex}),P("none"));};return S!=="none"&&(document.addEventListener("mousedown",N),window.addEventListener("keydown",se)),()=>{document.removeEventListener("mousedown",N),window.removeEventListener("keydown",se);}},[S,f,A,t]),!f||e.length===0)return null;let U=()=>{if(!f||f.type!=="table")return;let N=Math.max(1,f.rows||3),oe=[...f.rowHeights&&f.rowHeights.length===N?[...f.rowHeights]:Array.from({length:N},()=>Math.abs(f.height)/N),36],O=oe.reduce((re,ge)=>re+ge,0);t({rows:N+1,rowHeights:oe,height:f.height>=0?O:-O});},E=()=>{if(!f||f.type!=="table")return;let N=Math.max(1,f.rows||3);if(N<=1)return;let de=(f.rowHeights&&f.rowHeights.length===N?[...f.rowHeights]:Array.from({length:N},()=>Math.abs(f.height)/N)).slice(0,N-1),oe=de.reduce((ge,Ce)=>ge+Ce,0),O={...f.cells||{}},re=N-1;Object.keys(O).forEach(ge=>{ge.startsWith(`${re}_`)&&delete O[ge];}),t({rows:N-1,rowHeights:de,height:f.height>=0?oe:-oe,cells:O});},ee=()=>{if(!f||f.type!=="table")return;let N=Math.max(1,f.cols||3),oe=[...f.colWidths&&f.colWidths.length===N?[...f.colWidths]:Array.from({length:N},()=>Math.abs(f.width)/N),110],O=oe.reduce((re,ge)=>re+ge,0);t({cols:N+1,colWidths:oe,width:f.width>=0?O:-O});},te=()=>{if(!f||f.type!=="table")return;let N=Math.max(1,f.cols||3);if(N<=1)return;let de=(f.colWidths&&f.colWidths.length===N?[...f.colWidths]:Array.from({length:N},()=>Math.abs(f.width)/N)).slice(0,N-1),oe=de.reduce((ge,Ce)=>ge+Ce,0),O={...f.cells||{}},re=N-1;Object.keys(O).forEach(ge=>{ge.endsWith(`_${re}`)&&delete O[ge];}),t({cols:N-1,colWidths:de,width:f.width>=0?oe:-oe,cells:O});},ie=1/0,Se=1/0,Ke=-1/0,X=-1/0;e.forEach(N=>{let se=it(N);ie=Math.min(ie,se.x),Se=Math.min(Se,se.y),Ke=Math.max(Ke,se.x+se.width),X=Math.max(X,se.y+se.height);});let Oe=h({x:ie,y:Se}),je=h({x:Ke,y:X}),Ne=(Oe.x+je.x)/2,_e=Oe.y,Pe=je.y,he=175,ve=je.x-Oe.x,ue=Oe.x+ve*.4,K=Ne-14,Y=Math.min(ue,K),Q=Y>=he+16,M=_e-70<64,pe,g,D;return Q?(pe=Y,g=M?Pe+18:_e-68,D="-translate-x-full"):(pe=16,g=_e-70>=64?_e-68:Pe+18,D=""),jsxRuntime.jsx("div",{className:`fixed z-40 ${D} pointer-events-auto transition-all duration-75 select-none`,style:{left:`${pe}px`,top:`${g}px`},children:jsxRuntime.jsxs("div",{className:"fk-card relative flex items-center gap-1 p-1 bg-white/95 dark:bg-[#181818]/95 backdrop-blur-md rounded-[12px] border border-black/[0.04] dark:border-white/[0.05] shadow-[0_10px_30px_-4px_rgba(0,0,0,0.08)] dark:shadow-[0_14px_34px_-4px_rgba(0,0,0,0.65)] text-neutral-700 dark:text-neutral-300 animate-in fade-in zoom-in-95 duration-100",children:[le&&a&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("button",{type:"button",onClick:()=>a(f),title:C?"Rename Frame (Double Click)":T?"Edit Table Cells (Double Click)":"Edit Text",className:"p-1.5 rounded-[8px] hover:bg-neutral-100 dark:hover:bg-neutral-800 hover:text-primary transition-colors cursor-pointer",children:jsxRuntime.jsx(iconsReact.IconPencil,{size:15})}),jsxRuntime.jsx("div",{className:"w-[1px] h-4 bg-neutral-200 dark:bg-neutral-800 mx-0.5"})]}),C&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsxs("div",{className:"relative",ref:S==="framePreset"?z:void 0,children:[jsxRuntime.jsxs("button",{type:"button",onClick:()=>P(S==="framePreset"?"none":"framePreset"),title:"Change Frame Preset / Aspect Ratio",className:"flex items-center gap-1 px-2 py-1 rounded-[8px] hover:bg-neutral-100 dark:hover:bg-neutral-800 text-xs font-semibold text-neutral-700 dark:text-neutral-300 transition-colors",children:[jsxRuntime.jsx(iconsReact.IconAspectRatio,{size:14,className:"text-primary"}),jsxRuntime.jsxs("span",{className:"text-[10.5px]",children:[Math.round(Math.abs(f.width||0)),"\xD7",Math.round(Math.abs(f.height||0))]})]}),S==="framePreset"&&jsxRuntime.jsxs("div",{className:"absolute left-1/2 -translate-x-1/2 z-50 p-2 bg-white/95 dark:bg-[#181818]/95 backdrop-blur-md rounded-[14px] shadow-lg border border-neutral-200/90 dark:border-neutral-800 animate-in fade-in zoom-in-95 duration-100 w-44",style:{[M?"top":"bottom"]:"100%",margin:"6px 0"},children:[jsxRuntime.jsx("div",{className:"text-[10px] font-bold text-neutral-400 dark:text-neutral-500 uppercase tracking-wider mb-1.5 px-1",children:"Frame Presets"}),jsxRuntime.jsx("div",{className:"space-y-1",children:[{label:"16:9 Slide",w:800,h:450},{label:"1920\xD71080 FHD",w:1920,h:1080},{label:"Mobile (390\xD7844)",w:390,h:844},{label:"16:10 Laptop",w:1440,h:900},{label:"4:3 Standard",w:1024,h:768},{label:"1:1 Square",w:800,h:800}].map(N=>{let se=Math.round(Math.abs(f.width||0))===N.w&&Math.round(Math.abs(f.height||0))===N.h;return jsxRuntime.jsxs("button",{type:"button",onClick:()=>{t({width:N.w,height:N.h}),P("none");},className:`w-full flex items-center justify-between px-2 py-1.5 rounded-[7px] text-xs transition-colors ${se?"bg-primary text-primary-foreground font-semibold":"hover:bg-neutral-100 dark:hover:bg-neutral-800 text-neutral-700 dark:text-neutral-300"}`,children:[jsxRuntime.jsx("span",{children:N.label}),jsxRuntime.jsxs("span",{className:"text-[9.5px] opacity-70 font-mono font-normal",children:[N.w,"\xD7",N.h]})]},N.label)})})]})]}),jsxRuntime.jsx("button",{type:"button",onClick:()=>t({aspectRatioLocked:!f.aspectRatioLocked}),title:f.aspectRatioLocked?"Unlock Aspect Ratio":"Lock Aspect Ratio",className:`p-1.5 rounded-[8px] transition-colors ${f.aspectRatioLocked?"bg-primary/15 text-primary":"hover:bg-neutral-100 dark:hover:bg-neutral-800 text-neutral-500"}`,children:f.aspectRatioLocked?jsxRuntime.jsx(iconsReact.IconLock,{size:15}):jsxRuntime.jsx(iconsReact.IconLockOpen,{size:15})}),jsxRuntime.jsx("div",{className:"w-[1px] h-4 bg-neutral-200 dark:bg-neutral-800 mx-0.5"})]}),T&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsxs("div",{className:"relative",ref:S==="tablePreset"?$:void 0,children:[jsxRuntime.jsxs("button",{type:"button",onClick:()=>P(S==="tablePreset"?"none":"tablePreset"),title:"Change Table Layout Preset / Style",className:"flex items-center gap-1 px-2 py-1 rounded-[8px] hover:bg-neutral-100 dark:hover:bg-neutral-800 text-xs font-semibold text-neutral-700 dark:text-neutral-300 transition-colors",children:[jsxRuntime.jsxs("svg",{width:"14",height:"14",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:"text-primary",children:[jsxRuntime.jsx("rect",{x:"3",y:"4",width:"18",height:"16",rx:"2"}),jsxRuntime.jsx("line",{x1:"3",y1:"10",x2:"21",y2:"10"}),jsxRuntime.jsx("line",{x1:"10",y1:"4",x2:"10",y2:"20"})]}),jsxRuntime.jsxs("span",{className:"text-[10.5px]",children:[f.rows||3,"\xD7",f.cols||3]})]}),S==="tablePreset"&&jsxRuntime.jsxs("div",{className:"absolute left-1/2 -translate-x-1/2 z-50 p-2 bg-white/95 dark:bg-[#181818]/95 backdrop-blur-md rounded-[14px] shadow-lg border border-neutral-200/90 dark:border-neutral-800 animate-in fade-in zoom-in-95 duration-100 w-48",style:{[M?"top":"bottom"]:"100%",margin:"6px 0"},children:[jsxRuntime.jsx("div",{className:"text-[10px] font-bold text-neutral-400 dark:text-neutral-500 uppercase tracking-wider mb-1.5 px-1",children:"Table Styles"}),jsxRuntime.jsx("div",{className:"space-y-1",children:[{id:"default",label:"Clean / Minimal",desc:"Subtle borders"},{id:"header-accent",label:"Feature Matrix",desc:"Highlighted header row"},{id:"swot",label:"SWOT Matrix",desc:"4 pastel quadrants"},{id:"kanban",label:"Kanban / Sprint",desc:"Column headers"},{id:"zebra",label:"Zebra Striped",desc:"Alternating rows"}].map(N=>{let se=(f.tableStyle||"default")===N.id;return jsxRuntime.jsxs("button",{type:"button",onClick:()=>{t({tableStyle:N.id}),P("none");},className:`w-full flex flex-col text-left px-2 py-1.5 rounded-[7px] text-xs transition-colors ${se?"bg-primary text-primary-foreground font-semibold":"hover:bg-neutral-100 dark:hover:bg-neutral-800 text-neutral-700 dark:text-neutral-300"}`,children:[jsxRuntime.jsxs("div",{className:"flex items-center justify-between w-full",children:[jsxRuntime.jsx("span",{children:N.label}),se&&jsxRuntime.jsx("span",{className:"text-[10px]",children:"\u2713"})]}),jsxRuntime.jsx("span",{className:`text-[9.5px] ${se?"text-primary-foreground/80":"text-neutral-400 dark:text-neutral-500"}`,children:N.desc})]},N.id)})})]})]}),jsxRuntime.jsx("button",{type:"button",onClick:()=>t({hasHeaderRow:!f.hasHeaderRow}),title:f.hasHeaderRow?"Disable Header Row":"Enable Header Row",className:`px-1.5 py-1 rounded-[6px] text-[10.5px] font-medium transition-colors ${f.hasHeaderRow?"bg-primary/15 text-primary font-semibold":"hover:bg-neutral-100 dark:hover:bg-neutral-800 text-neutral-500"}`,children:"Header"}),jsxRuntime.jsxs("div",{className:"flex items-center gap-0.5 bg-neutral-100/80 dark:bg-neutral-800/80 rounded-[7px] p-0.5",children:[jsxRuntime.jsx("button",{type:"button",onClick:E,disabled:(f.rows||3)<=1,title:"Delete Row",className:"w-5 h-5 flex items-center justify-center rounded-[5px] hover:bg-neutral-200 dark:hover:bg-neutral-700 text-neutral-600 dark:text-neutral-300 disabled:opacity-30 disabled:pointer-events-none text-[10px] font-bold",children:"-R"}),jsxRuntime.jsx("button",{type:"button",onClick:U,title:"Add Row Below",className:"w-5 h-5 flex items-center justify-center rounded-[5px] hover:bg-neutral-200 dark:hover:bg-neutral-700 text-neutral-600 dark:text-neutral-300 text-[10px] font-bold",children:"+R"})]}),jsxRuntime.jsxs("div",{className:"flex items-center gap-0.5 bg-neutral-100/80 dark:bg-neutral-800/80 rounded-[7px] p-0.5",children:[jsxRuntime.jsx("button",{type:"button",onClick:te,disabled:(f.cols||3)<=1,title:"Delete Column",className:"w-5 h-5 flex items-center justify-center rounded-[5px] hover:bg-neutral-200 dark:hover:bg-neutral-700 text-neutral-600 dark:text-neutral-300 disabled:opacity-30 disabled:pointer-events-none text-[10px] font-bold",children:"-C"}),jsxRuntime.jsx("button",{type:"button",onClick:ee,title:"Add Column Right",className:"w-5 h-5 flex items-center justify-center rounded-[5px] hover:bg-neutral-200 dark:hover:bg-neutral-700 text-neutral-600 dark:text-neutral-300 text-[10px] font-bold",children:"+C"})]}),jsxRuntime.jsx("div",{className:"w-[1px] h-4 bg-neutral-200 dark:bg-neutral-800 mx-0.5"})]}),!F&&jsxRuntime.jsxs("div",{className:"relative",ref:S==="color"?R:void 0,children:[jsxRuntime.jsx("button",{type:"button",onClick:()=>P(S==="color"?"none":"color"),title:A?"Note Background Color":"Stroke Color",className:"flex items-center justify-center p-1.5 rounded-[8px] hover:bg-neutral-100 dark:hover:bg-neutral-800 transition-colors",children:jsxRuntime.jsx("span",{className:"w-3.5 h-3.5 rounded-[4px] border border-neutral-400/50 shadow-2xs",style:{backgroundColor:A?f.stickyColor||f.fillColor||"#fef08a":f.strokeColor&&f.strokeColor!=="transparent"?vt(f.strokeColor,_):f.fillColor&&f.fillColor!=="transparent"?_r(f.fillColor,"solid",_):"#0b6eff"}})}),S==="color"&&jsxRuntime.jsxs("div",{className:`absolute left-1/2 -translate-x-1/2 z-50 p-2 bg-white/95 dark:bg-[#181818]/95 backdrop-blur-md rounded-[12px] shadow-lg border border-neutral-200/90 dark:border-neutral-800 animate-in fade-in zoom-in-95 duration-100 ${M?"top-full mt-2":"bottom-full mb-2"}`,style:{minWidth:"162px"},children:[jsxRuntime.jsx("div",{className:"text-[10px] font-semibold text-neutral-500 dark:text-neutral-400 mb-1.5 px-0.5 select-none",children:A?"Note Color":"Color"}),jsxRuntime.jsx("div",{className:"grid grid-cols-5 gap-1.5",children:zo.map(N=>{let se=A?f.fillColor===N.hex||f.stickyColor===N.hex:f.strokeColor===N.hex;return jsxRuntime.jsx("button",{type:"button",onClick:()=>{t(A?{fillColor:N.hex,stickyColor:N.hex,strokeColor:void 0}:{strokeColor:N.hex}),P("none");},title:`${N.name}${N.shortcut?` (${N.shortcut})`:""}`,className:`relative w-6 h-6 rounded-[5px] border border-neutral-300/80 dark:border-neutral-700/80 transition-all hover:scale-110 active:scale-95 flex items-end justify-end p-0.5 ${se?"ring-2 ring-primary ring-offset-1 dark:ring-offset-[#181818]":""}`,style:{backgroundColor:vt(N.hex,_)},children:N.shortcut&&jsxRuntime.jsx("span",{className:"text-[8px] font-mono leading-none opacity-40 text-neutral-900 dark:text-white pointer-events-none",children:N.shortcut})},N.name)})})]})]}),L&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[A&&jsxRuntime.jsx("div",{className:"w-[1px] h-4 bg-neutral-200 dark:bg-neutral-800 mx-0.5"}),jsxRuntime.jsxs("div",{className:"relative",ref:S==="textColor"?R:void 0,children:[jsxRuntime.jsxs("button",{type:"button",onClick:()=>P(S==="textColor"?"none":"textColor"),title:"Text Color",className:"flex flex-col items-center justify-center w-7 h-7 rounded-[8px] hover:bg-neutral-100 dark:hover:bg-neutral-800 transition-colors",children:[jsxRuntime.jsx("span",{className:"text-[12px] font-extrabold leading-none",children:"A"}),jsxRuntime.jsx("span",{className:"w-3.5 h-[2.5px] rounded-full mt-0.5",style:{backgroundColor:vt(f.strokeColor||"#713f12",_)}})]}),S==="textColor"&&jsxRuntime.jsxs("div",{className:`absolute left-1/2 -translate-x-1/2 z-50 p-2 bg-white/95 dark:bg-[#181818]/95 backdrop-blur-md rounded-[12px] shadow-lg border border-neutral-200/90 dark:border-neutral-800 animate-in fade-in zoom-in-95 duration-100 ${M?"top-full mt-2":"bottom-full mb-2"}`,style:{minWidth:"162px"},children:[jsxRuntime.jsx("div",{className:"text-[10px] font-semibold text-neutral-500 dark:text-neutral-400 mb-1.5 px-0.5 select-none",children:"Text Color"}),jsxRuntime.jsx("div",{className:"grid grid-cols-5 gap-1.5",children:zo.map(N=>{let se=f.strokeColor===N.hex;return jsxRuntime.jsx("button",{type:"button",onClick:()=>{t({strokeColor:N.hex}),P("none");},title:`${N.name}${N.shortcut?` (${N.shortcut})`:""}`,className:`relative w-6 h-6 rounded-[5px] border border-neutral-300/80 dark:border-neutral-700/80 transition-all hover:scale-110 active:scale-95 flex items-end justify-end p-0.5 ${se?"ring-2 ring-primary ring-offset-1 dark:ring-offset-[#181818]":""}`,style:{backgroundColor:vt(N.hex,_)},children:N.shortcut&&jsxRuntime.jsx("span",{className:"text-[8px] font-mono leading-none opacity-40 text-neutral-900 dark:text-white pointer-events-none",children:N.shortcut})},N.name)})})]})]})]}),W&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsxs("div",{className:"flex items-center gap-0.5 bg-neutral-100/80 dark:bg-neutral-800/80 rounded-[7px] p-0.5",children:[jsxRuntime.jsx("button",{type:"button",onClick:()=>t({arrowType:"straight"}),title:"Straight Line / Arrow",className:`w-6 h-6 flex items-center justify-center rounded-[5px] transition-all cursor-pointer ${(f.arrowType||"straight")==="straight"?"bg-primary text-white shadow-xs font-semibold":"hover:bg-neutral-200 dark:hover:bg-neutral-700 text-neutral-600 dark:text-neutral-300"}`,children:jsxRuntime.jsx("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",children:jsxRuntime.jsx("line",{x1:"4",y1:"20",x2:"20",y2:"4"})})}),jsxRuntime.jsx("button",{type:"button",onClick:()=>t({arrowType:"curved"}),title:"Single Curved (1 Control Handle)",className:`w-6 h-6 flex items-center justify-center rounded-[5px] transition-all cursor-pointer ${f.arrowType==="curved"?"bg-primary text-white shadow-xs font-semibold":"hover:bg-neutral-200 dark:hover:bg-neutral-700 text-neutral-600 dark:text-neutral-300"}`,children:jsxRuntime.jsx("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",children:jsxRuntime.jsx("path",{d:"M4 20 Q 12 4 20 4"})})}),jsxRuntime.jsx("button",{type:"button",onClick:()=>t({arrowType:"elbow"}),title:"Double Curved / S-Curve (2 Control Handles)",className:`w-6 h-6 flex items-center justify-center rounded-[5px] transition-all cursor-pointer ${f.arrowType==="elbow"?"bg-primary text-white shadow-xs font-semibold":"hover:bg-neutral-200 dark:hover:bg-neutral-700 text-neutral-600 dark:text-neutral-300"}`,children:jsxRuntime.jsx("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",children:jsxRuntime.jsx("path",{d:"M4 20 C 8 20, 16 4, 20 4"})})})]}),jsxRuntime.jsxs("div",{className:"flex items-center gap-0.5 bg-neutral-100/80 dark:bg-neutral-800/80 rounded-[7px] p-0.5",children:[jsxRuntime.jsx("button",{type:"button",onClick:()=>t({strokeStyle:"solid"}),title:"Solid Stroke",className:`w-5 h-6 flex items-center justify-center rounded-[5px] transition-all cursor-pointer ${(f.strokeStyle||"solid")==="solid"?"bg-primary text-white shadow-xs":"hover:bg-neutral-200 dark:hover:bg-neutral-700 text-neutral-600 dark:text-neutral-300"}`,children:jsxRuntime.jsx("span",{className:"w-3.5 h-[2px] bg-current rounded-full"})}),jsxRuntime.jsx("button",{type:"button",onClick:()=>t({strokeStyle:"dashed"}),title:"Dashed Stroke",className:`w-5 h-6 flex items-center justify-center rounded-[5px] transition-all cursor-pointer ${f.strokeStyle==="dashed"?"bg-primary text-white shadow-xs":"hover:bg-neutral-200 dark:hover:bg-neutral-700 text-neutral-600 dark:text-neutral-300"}`,children:jsxRuntime.jsx("svg",{width:"14",height:"2",viewBox:"0 0 14 2",fill:"none",children:jsxRuntime.jsx("line",{x1:"0",y1:"1",x2:"14",y2:"1",stroke:"currentColor",strokeWidth:"2",strokeDasharray:"3 2"})})}),jsxRuntime.jsx("button",{type:"button",onClick:()=>t({strokeStyle:"dotted"}),title:"Dotted Stroke",className:`w-5 h-6 flex items-center justify-center rounded-[5px] transition-all cursor-pointer ${f.strokeStyle==="dotted"?"bg-primary text-white shadow-xs":"hover:bg-neutral-200 dark:hover:bg-neutral-700 text-neutral-600 dark:text-neutral-300"}`,children:jsxRuntime.jsx("svg",{width:"14",height:"2",viewBox:"0 0 14 2",fill:"none",children:jsxRuntime.jsx("line",{x1:"0",y1:"1",x2:"14",y2:"1",stroke:"currentColor",strokeWidth:"2",strokeDasharray:"1 2.5",strokeLinecap:"round"})})})]}),jsxRuntime.jsxs("div",{className:"flex items-center gap-1 px-0.5 relative",ref:S==="startArrowhead"||S==="endArrowhead"?I:void 0,children:[jsxRuntime.jsx("button",{type:"button",onClick:()=>P(S==="startArrowhead"?"none":"startArrowhead"),title:`Start Arrowhead (${ar(f.startArrowhead,"none")})`,className:`p-1 rounded-[6px] transition-colors flex items-center justify-center ${S==="startArrowhead"?"bg-primary/15 text-primary":"hover:bg-neutral-100 dark:hover:bg-neutral-800 text-neutral-600 dark:text-neutral-300"}`,children:jsxRuntime.jsx(Kr,{value:ar(f.startArrowhead,"none"),side:"start",className:"w-4 h-3"})}),jsxRuntime.jsx("button",{type:"button",onClick:()=>P(S==="endArrowhead"?"none":"endArrowhead"),title:`End Arrowhead (${ar(f.endArrowhead,f.type==="arrow"?"arrow":"none")})`,className:`p-1 rounded-[6px] transition-colors flex items-center justify-center ${S==="endArrowhead"?"bg-primary/15 text-primary":"hover:bg-neutral-100 dark:hover:bg-neutral-800 text-neutral-600 dark:text-neutral-300"}`,children:jsxRuntime.jsx(Kr,{value:ar(f.endArrowhead,f.type==="arrow"?"arrow":"none"),side:"end",className:"w-4 h-3"})}),(S==="startArrowhead"||S==="endArrowhead")&&jsxRuntime.jsx("div",{className:`absolute left-1/2 -translate-x-1/2 z-50 w-[184px] ${M?"top-full mt-2":"bottom-full mb-2"}`,children:jsxRuntime.jsx(Yo,{side:S==="startArrowhead"?"start":"end",currentValue:S==="startArrowhead"?ar(f.startArrowhead,"none"):ar(f.endArrowhead,f.type==="arrow"?"arrow":"none"),onChange:N=>{t(S==="startArrowhead"?{startArrowhead:N}:{endArrowhead:N}),P("none");},onClose:()=>P("none")})})]}),jsxRuntime.jsx("div",{className:"w-[1px] h-4 bg-neutral-200 dark:bg-neutral-800 mx-0.5"})]}),be&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsxs("div",{className:"relative",ref:S==="strokeWidth"?w:void 0,children:[jsxRuntime.jsx("button",{type:"button",onClick:()=>P(S==="strokeWidth"?"none":"strokeWidth"),title:`Stroke Width (${(f.strokeWidth||2)<=1.5?"Thin":(f.strokeWidth||2)<=3?"Medium":"Bold"})`,className:`w-7 h-7 flex items-center justify-center rounded-[8px] transition-colors cursor-pointer ${S==="strokeWidth"?"bg-primary/15 text-primary":"hover:bg-neutral-100 dark:hover:bg-neutral-800 text-neutral-600 dark:text-neutral-300"}`,children:(f.strokeWidth||2)<=1.5?jsxRuntime.jsx("span",{className:"w-3.5 h-[1.5px] bg-current rounded-full"}):(f.strokeWidth||2)<=3?jsxRuntime.jsx("span",{className:"w-3.5 h-[2.8px] bg-current rounded-full"}):jsxRuntime.jsx("span",{className:"w-3.5 h-[4.5px] bg-current rounded-full"})}),S==="strokeWidth"&&jsxRuntime.jsx("div",{className:`absolute left-1/2 -translate-x-1/2 z-50 p-1.5 bg-white/98 dark:bg-[#181818]/98 backdrop-blur-md rounded-[12px] shadow-lg border border-neutral-200/90 dark:border-neutral-800 flex items-center gap-1 animate-in fade-in zoom-in-95 duration-100 ${M?"top-full mt-2":"bottom-full mb-2"}`,children:Bo.map((N,se)=>{let de=(f.strokeWidth||2)===N.value;return jsxRuntime.jsxs("button",{type:"button",onClick:()=>{t({strokeWidth:N.value}),P("none");},title:`Stroke Width: ${N.label}`,className:`w-8 h-7 flex items-center justify-center rounded-[7px] transition-all cursor-pointer ${de?"bg-primary text-white font-bold shadow-xs scale-105":"hover:bg-neutral-100 dark:hover:bg-neutral-800 text-neutral-600 dark:text-neutral-300"}`,children:[se===0&&jsxRuntime.jsx("span",{className:"w-4 h-[1.5px] bg-current rounded-full"}),se===1&&jsxRuntime.jsx("span",{className:"w-4 h-[2.8px] bg-current rounded-full"}),se===2&&jsxRuntime.jsx("span",{className:"w-4 h-[4.5px] bg-current rounded-full"})]},N.label)})})]}),jsxRuntime.jsx("div",{className:"w-[1px] h-4 bg-neutral-200 dark:bg-neutral-800 mx-0.5"})]}),!C&&!Z&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("button",{type:"button",onClick:()=>{let N=f.roughStyle==="rough"||f.roughness!==void 0&&f.roughness>0;t({roughStyle:N?"clean":"rough",roughness:N?0:1.2});},title:f.roughStyle==="rough"||f.roughness!==void 0&&f.roughness>0?"Style: Rough (Click for Clean)":"Style: Clean (Click for Rough)",className:`w-7 h-7 flex items-center justify-center rounded-[8px] transition-colors cursor-pointer ${f.roughStyle==="rough"||f.roughness!==void 0&&f.roughness>0?"bg-primary/15 text-primary":"hover:bg-neutral-100 dark:hover:bg-neutral-800 text-neutral-600 dark:text-neutral-300"}`,children:f.roughStyle==="rough"||f.roughness!==void 0&&f.roughness>0?jsxRuntime.jsxs("svg",{width:"14",height:"14",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[jsxRuntime.jsx("path",{d:"M4 20h4l10.5 -10.5a2.828 2.828 0 1 0 -4 -4l-10.5 10.5v4"}),jsxRuntime.jsx("path",{d:"M13.5 6.5l4 4"})]}):jsxRuntime.jsx("svg",{width:"13",height:"13",viewBox:"0 0 16 16",fill:"none",children:jsxRuntime.jsx("rect",{x:"2.5",y:"2.5",width:"11",height:"11",rx:"1.5",stroke:"currentColor",strokeWidth:"1.8"})})}),jsxRuntime.jsx("div",{className:"w-[1px] h-4 bg-neutral-200 dark:bg-neutral-800 mx-0.5"})]}),jsxRuntime.jsx("button",{type:"button",onClick:u,title:"Bring to Front",className:"p-1.5 rounded-[8px] hover:bg-neutral-100 dark:hover:bg-neutral-800 transition-colors",children:jsxRuntime.jsx(lucideReact.BringToFront,{size:15})}),jsxRuntime.jsx("div",{className:"w-[1px] h-4 bg-neutral-200 dark:bg-neutral-800 mx-0.5"}),e.length>1&&p&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("button",{type:"button",onClick:p,title:"Group (Ctrl+G)",className:"p-1.5 rounded-[8px] hover:bg-neutral-100 dark:hover:bg-neutral-800 text-neutral-700 dark:text-neutral-300 transition-colors",children:jsxRuntime.jsxs("svg",{width:"15",height:"15",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.8",strokeLinecap:"round",strokeLinejoin:"round",children:[jsxRuntime.jsx("path",{stroke:"none",d:"M0 0h24v24H0z",fill:"none"}),jsxRuntime.jsx("path",{d:"M4 16v-8a2 2 0 0 1 2 -2h8a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-8a2 2 0 0 1 -2 -2z"}),jsxRuntime.jsx("path",{d:"M8 10v-4a2 2 0 0 1 2 -2h6a2 2 0 0 1 2 2v6a2 2 0 0 1 -2 2h-4"})]})}),jsxRuntime.jsx("div",{className:"w-[1px] h-4 bg-neutral-200 dark:bg-neutral-800 mx-0.5"})]}),e.some(N=>N.groupIds&&N.groupIds.length>0)&&c&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("button",{type:"button",onClick:c,title:"Ungroup (Ctrl+Shift+G)",className:"p-1.5 rounded-[8px] hover:bg-neutral-100 dark:hover:bg-neutral-800 text-neutral-700 dark:text-neutral-300 transition-colors",children:jsxRuntime.jsxs("svg",{width:"15",height:"15",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.8",strokeLinecap:"round",strokeLinejoin:"round",children:[jsxRuntime.jsx("path",{stroke:"none",d:"M0 0h24v24H0z",fill:"none"}),jsxRuntime.jsx("path",{d:"M4 8a2 2 0 0 1 2 -2h4a2 2 0 0 1 2 2v4a2 2 0 0 1 -2 2h-4a2 2 0 0 1 -2 -2z"}),jsxRuntime.jsx("path",{d:"M12 16a2 2 0 0 1 2 -2h4a2 2 0 0 1 2 2v4a2 2 0 0 1 -2 2h-4a2 2 0 0 1 -2 -2z"})]})}),jsxRuntime.jsx("div",{className:"w-[1px] h-4 bg-neutral-200 dark:bg-neutral-800 mx-0.5"})]}),e.length>1&&l&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsxs("div",{className:"flex items-center gap-0.5",children:[jsxRuntime.jsx("button",{type:"button",onClick:()=>l("left"),title:"Align Left",className:"p-1.5 rounded-[8px] hover:bg-neutral-100 dark:hover:bg-neutral-800 text-neutral-700 dark:text-neutral-300 transition-colors",children:jsxRuntime.jsxs("svg",{width:"15",height:"15",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[jsxRuntime.jsx("line",{x1:"4",y1:"2",x2:"4",y2:"22"}),jsxRuntime.jsx("rect",{x:"8",y:"5",width:"12",height:"5",rx:"1",fill:"currentColor",fillOpacity:"0.2"}),jsxRuntime.jsx("rect",{x:"8",y:"14",width:"8",height:"5",rx:"1",fill:"currentColor",fillOpacity:"0.2"})]})}),jsxRuntime.jsx("button",{type:"button",onClick:()=>l("center"),title:"Align Center (Horizontal)",className:"p-1.5 rounded-[8px] hover:bg-neutral-100 dark:hover:bg-neutral-800 text-neutral-700 dark:text-neutral-300 transition-colors",children:jsxRuntime.jsxs("svg",{width:"15",height:"15",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[jsxRuntime.jsx("line",{x1:"12",y1:"2",x2:"12",y2:"22"}),jsxRuntime.jsx("rect",{x:"5",y:"5",width:"14",height:"5",rx:"1",fill:"currentColor",fillOpacity:"0.2"}),jsxRuntime.jsx("rect",{x:"7",y:"14",width:"10",height:"5",rx:"1",fill:"currentColor",fillOpacity:"0.2"})]})}),jsxRuntime.jsx("button",{type:"button",onClick:()=>l("middle"),title:"Align Middle (Vertical)",className:"p-1.5 rounded-[8px] hover:bg-neutral-100 dark:hover:bg-neutral-800 text-neutral-700 dark:text-neutral-300 transition-colors",children:jsxRuntime.jsxs("svg",{width:"15",height:"15",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[jsxRuntime.jsx("line",{x1:"2",y1:"12",x2:"22",y2:"12"}),jsxRuntime.jsx("rect",{x:"5",y:"5",width:"5",height:"14",rx:"1",fill:"currentColor",fillOpacity:"0.2"}),jsxRuntime.jsx("rect",{x:"14",y:"7",width:"5",height:"10",rx:"1",fill:"currentColor",fillOpacity:"0.2"})]})})]}),jsxRuntime.jsx("div",{className:"w-[1px] h-4 bg-neutral-200 dark:bg-neutral-800 mx-0.5"})]}),n&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("button",{type:"button",onClick:n,title:"Copy selection as PNG to clipboard (Ctrl+Shift+C)",className:"p-1.5 rounded-[8px] hover:bg-neutral-100 dark:hover:bg-neutral-800 text-neutral-700 dark:text-neutral-300 transition-colors",children:jsxRuntime.jsxs("svg",{width:"15",height:"15",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:"text-primary",children:[jsxRuntime.jsx("rect",{width:"14",height:"14",x:"8",y:"8",rx:"2",ry:"2"}),jsxRuntime.jsx("path",{d:"M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"})]})}),jsxRuntime.jsx("div",{className:"w-[1px] h-4 bg-neutral-200 dark:bg-neutral-800 mx-0.5"})]}),x&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("button",{type:"button",onClick:x,title:"Spotlight / Focus Mode (Alt+S)",className:"p-1.5 rounded-[8px] hover:bg-amber-500/15 text-amber-500 hover:text-amber-600 dark:text-amber-400 transition-colors cursor-pointer",children:jsxRuntime.jsx(iconsReact.IconCurrentLocation,{size:16})}),jsxRuntime.jsx("div",{className:"w-[1px] h-4 bg-neutral-200 dark:bg-neutral-800 mx-0.5"})]}),jsxRuntime.jsx("button",{type:"button",onClick:o,title:"Duplicate (Ctrl+D)",className:"p-1.5 rounded-[8px] hover:bg-neutral-100 dark:hover:bg-neutral-800 transition-colors",children:jsxRuntime.jsx(iconsReact.IconCopy,{size:15})}),jsxRuntime.jsx("button",{type:"button",onClick:r,title:"Delete (Del)",className:"p-1.5 rounded-[8px] text-rose-500 hover:text-rose-600 hover:bg-rose-50 dark:hover:bg-rose-950/40 transition-colors",children:jsxRuntime.jsx(iconsReact.IconTrash,{size:15})})]})})}var Ds=[{name:"16:9 Slide",width:1280,height:720,icon:iconsReact.IconSlideshow,label:"Slide"},{name:"Desktop (1440)",width:1440,height:900,icon:iconsReact.IconDeviceDesktop,label:"Desktop Wireframe"},{name:"Mobile (iPhone)",width:390,height:844,icon:iconsReact.IconDeviceMobile,label:"Mobile Screen"}];function gn({isOpen:e,onClose:t,elements:r,setElements:o,selectedIds:p,selectElements:c,updateElement:l,pushHistory:s,camera:n,setCamera:u,onStartPresentation:i}){let[d,h]=Ln.useState(""),[a,x]=Ln.useState(null),[b,k]=Ln.useState(""),[y,_]=Ln.useState(null),S=Ln.useMemo(()=>r.filter(v=>v.type==="frame").sort((v,C)=>Math.abs(v.y-C.y)>100?v.y-C.y:v.x-C.x),[r]),P=Ln.useMemo(()=>{if(!d.trim())return S;let v=d.toLowerCase();return S.filter((C,T)=>(C.frameLabel||`Frame ${T+1}`).toLowerCase().includes(v)||`slide ${T+1}`.includes(v))},[S,d]),R=Ln.useCallback(v=>{if(typeof window>"u")return;let C=window.innerWidth,T=window.innerHeight,W=100,le=(C-W*2)/Math.max(v.width,100),L=(T-W*2)/Math.max(v.height,100),A=Math.min(Math.max(Math.min(le,L),.15),2.2),F=v.x+v.width/2,Z=v.y+v.height/2,be=C/2-F*A,U=T/2-Z*A,E=n.x,ee=n.y,te=n.zoom,ie=performance.now(),Se=420,Ke=X=>{let Oe=X-ie,je=Math.min(Oe/Se,1),Ne=1-Math.pow(1-je,3);u({x:Math.round(E+(be-E)*Ne),y:Math.round(ee+(U-ee)*Ne),zoom:Number((te+(A-te)*Ne).toFixed(4))}),je<1&&requestAnimationFrame(Ke);};requestAnimationFrame(Ke),c([v.id]);},[n,u,c]),I=v=>{let C=Rr(v,r);C.length>0?c([v.id,...C.map(T=>T.id)]):c([v.id]);},z=v=>{if(typeof window>"u")return;let C=window.innerWidth,T=window.innerHeight,W=(C/2-n.x)/n.zoom,le=(T/2-n.y)/n.zoom,L=S.length,F={id:`frame_${Date.now()}_${Math.random().toString(36).substring(2,6)}`,type:"frame",x:Math.round(W-v.width/2),y:Math.round(le-v.height/2),width:v.width,height:v.height,strokeColor:"#94a3b8",strokeWidth:1.5,strokeStyle:"dashed",fillColor:"transparent",fillStyle:"solid",opacity:1,frameLabel:`${v.label} ${L+1}`,zIndex:1},Z=[...r,F];o(Z),s(Z),R(F);},$=v=>{let C=b.trim();C&&(l(v,{frameLabel:C}),s(r.map(T=>T.id===v?{...T,frameLabel:C}:T))),x(null);},w=(v,C)=>{C.stopPropagation();let T=Xr(r,[v]);o(T),s(T);},f=async(v,C)=>{C.stopPropagation(),_(v.id);try{let T=await bo(v,r,{scale:2}),W=`${v.frameLabel||"Frame"}.png`;Gr(T,W,{mimeType:"image/png",filters:[{name:"PNG Image",extensions:["png"]},{name:"All Files",extensions:["*"]}]});}catch(T){console.error("Frame export failed",T);}finally{_(null);}};return e?jsxRuntime.jsxs("div",{className:"fk-card fixed top-14 left-4 z-40 w-80 max-w-[calc(100vw-2rem)] max-h-[calc(100vh-5rem)] flex flex-col bg-[#eef1f6]/98 dark:bg-[#16171b]/98 backdrop-blur-2xl rounded-[20px] border border-white/80 dark:border-white/[0.06] shadow-[-8px_-8px_20px_rgba(255,255,255,0.9),_10px_10px_24px_rgba(166,175,195,0.45)] dark:shadow-[-4px_-4px_16px_rgba(255,255,255,0.02),_10px_10px_28px_rgba(0,0,0,0.9)] overflow-hidden select-none animate-in fade-in slide-in-from-left-4 duration-200",children:[jsxRuntime.jsxs("div",{className:"p-3.5 pb-2.5 border-b border-black/[0.06] dark:border-white/[0.06] flex items-center justify-between",children:[jsxRuntime.jsxs("div",{className:"flex items-center gap-2",children:[jsxRuntime.jsx("span",{className:"w-7 h-7 rounded-[8px] bg-[#e2e6ee] dark:bg-[#121316] text-primary flex items-center justify-center border border-white/60 dark:border-white/[0.04] shadow-[inset_1px_1px_2.5px_rgba(166,175,195,0.45),_inset_-1px_-1px_2.5px_rgba(255,255,255,0.9)] dark:shadow-[inset_1.5px_1.5px_3px_rgba(0,0,0,0.6)]",children:jsxRuntime.jsx(iconsReact.IconLayoutSidebar,{size:15})}),jsxRuntime.jsxs("div",{children:[jsxRuntime.jsxs("div",{className:"flex items-center gap-1.5",children:[jsxRuntime.jsx("h2",{className:"text-xs font-bold text-neutral-800 dark:text-neutral-100 tracking-tight",children:"Frames Outline"}),jsxRuntime.jsx("span",{className:"px-1.5 py-0.2 bg-primary/10 text-primary rounded-[5px] text-[10px] font-bold",children:S.length})]}),jsxRuntime.jsx("p",{className:"text-[10px] text-neutral-400 dark:text-neutral-500 leading-none mt-0.5",children:"Jump, organize & present sections"})]})]}),jsxRuntime.jsxs("div",{className:"flex items-center gap-1",children:[S.length>0&&i&&jsxRuntime.jsxs("button",{type:"button",onClick:i,title:"Launch Presentation Slideshow (Alt+P)",className:"h-6.5 px-2 rounded-[7px] bg-primary/10 hover:bg-primary/20 text-primary dark:text-foreground border border-primary/20 flex items-center gap-1 text-[10.5px] font-semibold transition-all cursor-pointer",children:[jsxRuntime.jsx(iconsReact.IconPlayerPlay,{size:11,className:"fill-primary/30"}),jsxRuntime.jsx("span",{children:"Present"})]}),jsxRuntime.jsx("button",{type:"button",onClick:t,title:"Close outline drawer",className:"w-6.5 h-6.5 rounded-[7px] bg-[#f0f3f8] dark:bg-[#1c1e24] border border-white/80 dark:border-white/[0.06] text-neutral-400 hover:text-neutral-800 dark:hover:text-neutral-100 flex items-center justify-center transition-all cursor-pointer shadow-[-1px_-1px_2px_rgba(255,255,255,0.9),_1px_1px_2px_rgba(166,175,195,0.3)] dark:shadow-[-1px_-1px_2px_rgba(255,255,255,0.02),_1px_1px_2px_rgba(0,0,0,0.6)]",children:jsxRuntime.jsx(iconsReact.IconX,{size:13})})]})]}),S.length>=3&&jsxRuntime.jsx("div",{className:"px-3 pt-2.5",children:jsxRuntime.jsxs("div",{className:"relative flex items-center",children:[jsxRuntime.jsx(iconsReact.IconSearch,{size:12,className:"absolute left-2.5 text-neutral-400"}),jsxRuntime.jsx("input",{type:"text",placeholder:"Search frames...",value:d,onChange:v=>h(v.target.value),className:"w-full h-7 pl-7 pr-2.5 text-[11px] rounded-[8px] bg-[#e2e6ee] dark:bg-[#111215] text-neutral-800 dark:text-neutral-100 border border-white/60 dark:border-white/[0.04] shadow-[inset_1px_1px_2.5px_rgba(166,175,195,0.45),_inset_-1px_-1px_2.5px_rgba(255,255,255,0.85)] dark:shadow-[inset_1.5px_1.5px_3px_rgba(0,0,0,0.7)] outline-none placeholder:text-neutral-400 dark:placeholder:text-neutral-600"})]})}),jsxRuntime.jsx("div",{className:"flex-1 overflow-y-auto p-3 space-y-2 max-h-[50vh] min-h-[140px] custom-scrollbar",children:P.length>0?P.map((v,C)=>{let T=p.includes(v.id),W=Rr(v,r),le=a===v.id,L=v.frameLabel||`Frame ${C+1}`;return jsxRuntime.jsx("div",{onClick:()=>R(v),className:`group relative p-2.5 rounded-[12px] border transition-all cursor-pointer select-none ${T?"bg-[#f0f3f8] dark:bg-[#1f222b] border-primary/50 dark:border-primary/60 shadow-[-2px_-2px_6px_rgba(255,255,255,0.95),_3px_3px_7px_rgba(105,101,219,0.3)] dark:shadow-[-2px_-2px_5px_rgba(255,255,255,0.03),_3px_3px_8px_rgba(0,0,0,0.85)]":"bg-[#e9edf4]/80 dark:bg-[#131417]/80 hover:bg-[#f0f3f8] dark:hover:bg-[#1b1c21] border-white/60 dark:border-white/[0.04] shadow-[-2px_-2px_4px_rgba(255,255,255,0.85),_2px_2px_5px_rgba(166,175,195,0.35)] dark:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.02),_2px_2px_5px_rgba(0,0,0,0.7)]"}`,children:jsxRuntime.jsxs("div",{className:"flex items-center justify-between",children:[jsxRuntime.jsxs("div",{className:"flex items-center gap-2 flex-1 min-w-0 pr-2",children:[jsxRuntime.jsx("span",{className:`w-5 h-5 rounded-[6px] text-[10px] font-bold flex items-center justify-center shrink-0 ${T?"bg-primary text-white shadow-sm":"bg-[#dce1eb] dark:bg-[#1a1b20] text-neutral-600 dark:text-neutral-400"}`,children:C+1}),le?jsxRuntime.jsxs("div",{className:"flex items-center gap-1 flex-1",onClick:A=>A.stopPropagation(),children:[jsxRuntime.jsx("input",{type:"text",value:b,onChange:A=>k(A.target.value),onKeyDown:A=>{A.key==="Enter"&&$(v.id),A.key==="Escape"&&x(null);},autoFocus:true,className:"h-6 px-1.5 text-xs font-semibold rounded-[5px] bg-[#e0e5ee] dark:bg-[#101114] text-neutral-900 dark:text-neutral-100 border border-primary/40 outline-none w-full"}),jsxRuntime.jsx("button",{type:"button",onClick:()=>$(v.id),className:"p-1 rounded-[5px] text-emerald-600 hover:bg-emerald-500/10 cursor-pointer",children:jsxRuntime.jsx(iconsReact.IconCheck,{size:12,stroke:2.5})})]}):jsxRuntime.jsxs("div",{className:"flex-1 min-w-0",onDoubleClick:A=>{A.stopPropagation(),x(v.id),k(L);},children:[jsxRuntime.jsx("span",{className:`text-xs font-bold block truncate leading-tight ${T?"text-primary dark:text-neutral-100":"text-neutral-700 dark:text-neutral-200"}`,children:L}),jsxRuntime.jsxs("div",{className:"flex items-center gap-1.5 text-[9.5px] text-neutral-400 dark:text-neutral-400 mt-0.5 font-medium",children:[jsxRuntime.jsxs("span",{children:[W.length," ",W.length===1?"element":"elements"]}),jsxRuntime.jsx("span",{children:"\u2022"}),jsxRuntime.jsxs("span",{children:[Math.round(v.width)," \xD7 ",Math.round(v.height)]})]})]})]}),jsxRuntime.jsxs("div",{className:"flex items-center gap-0.5 opacity-80 group-hover:opacity-100 transition-opacity",children:[jsxRuntime.jsx("button",{type:"button",onClick:A=>{A.stopPropagation(),R(v);},title:"Jump & focus camera on this frame",className:"p-1 rounded-[6px] text-neutral-500 dark:text-neutral-300 hover:text-primary dark:hover:text-primary hover:bg-primary/10 dark:hover:bg-primary/20 transition-colors cursor-pointer",children:jsxRuntime.jsx(iconsReact.IconFocusCentered,{size:13})}),jsxRuntime.jsx("button",{type:"button",onClick:A=>{A.stopPropagation(),I(v);},title:"Select all elements inside this frame",className:"p-1 rounded-[6px] text-neutral-500 dark:text-neutral-300 hover:text-primary dark:hover:text-primary hover:bg-primary/10 dark:hover:bg-primary/20 transition-colors cursor-pointer",children:jsxRuntime.jsx(iconsReact.IconSelect,{size:13})}),jsxRuntime.jsx("button",{type:"button",onClick:A=>f(v,A),disabled:y===v.id,title:"Export this frame as PNG image",className:"p-1 rounded-[6px] text-neutral-500 dark:text-neutral-300 hover:text-primary dark:hover:text-primary hover:bg-primary/10 dark:hover:bg-primary/20 transition-colors cursor-pointer",children:jsxRuntime.jsx(iconsReact.IconDownload,{size:13})}),jsxRuntime.jsx("button",{type:"button",onClick:A=>{A.stopPropagation(),x(v.id),k(L);},title:"Rename frame",className:"p-1 rounded-[6px] text-neutral-500 dark:text-neutral-300 hover:text-neutral-900 dark:hover:text-white hover:bg-black/5 dark:hover:bg-white/10 transition-colors cursor-pointer",children:jsxRuntime.jsx(iconsReact.IconEdit,{size:12})}),jsxRuntime.jsx("button",{type:"button",onClick:A=>w(v.id,A),title:"Delete this frame",className:"p-1 rounded-[6px] text-neutral-400 dark:text-neutral-400 hover:text-rose-600 dark:hover:text-rose-400 hover:bg-rose-500/10 dark:hover:bg-rose-500/20 transition-colors cursor-pointer",children:jsxRuntime.jsx(iconsReact.IconTrash,{size:12})})]})]})},v.id)}):jsxRuntime.jsxs("div",{className:"py-4 px-2 text-center flex flex-col items-center justify-center",children:[jsxRuntime.jsx("div",{className:"w-10 h-10 rounded-2xl bg-primary/10 text-primary flex items-center justify-center mb-2 shadow-[inset_1px_1px_2px_rgba(105,101,219,0.2)]",children:jsxRuntime.jsx(iconsReact.IconSparkles,{size:18})}),jsxRuntime.jsx("h3",{className:"text-xs font-bold text-neutral-700 dark:text-neutral-200",children:"No frames on canvas"}),jsxRuntime.jsx("p",{className:"text-[10px] text-neutral-400 dark:text-neutral-500 mt-1 max-w-[210px] leading-relaxed",children:"Frames organize your board into sections, artboards, and presentation slides."})]})}),jsxRuntime.jsxs("div",{className:"p-3 bg-[#e8ecf4]/90 dark:bg-[#121316]/90 border-t border-black/[0.06] dark:border-white/[0.06]",children:[jsxRuntime.jsx("span",{className:"text-[9.5px] font-bold text-neutral-500 dark:text-neutral-400 uppercase tracking-wider block mb-1.5 px-0.5",children:"+ Add New Frame Preset"}),jsxRuntime.jsx("div",{className:"grid grid-cols-3 gap-1.5",children:Ds.map(v=>{let C=v.icon;return jsxRuntime.jsxs("button",{type:"button",onClick:()=>z(v),className:"flex flex-col items-center justify-center p-2 rounded-[10px] bg-[#f0f3f8] dark:bg-[#1c1e24] text-neutral-700 dark:text-neutral-300 hover:text-primary dark:hover:text-primary border border-white/80 dark:border-white/[0.06] shadow-[-2px_-2px_4px_rgba(255,255,255,0.9),_2px_2px_4px_rgba(166,175,195,0.35)] dark:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.02),_2px_2px_5px_rgba(0,0,0,0.7)] hover:shadow-[-2px_-2px_6px_rgba(255,255,255,1),_2px_2px_6px_rgba(166,175,195,0.5)] active:shadow-[inset_1.5px_1.5px_3px_rgba(166,175,195,0.5)] active:scale-95 transition-all cursor-pointer",title:`Insert ${v.name} (${v.width}\xD7${v.height})`,children:[jsxRuntime.jsx(C,{size:14,className:"mb-0.5"}),jsxRuntime.jsx("span",{className:"text-[10px] font-semibold leading-tight",children:v.name}),jsxRuntime.jsxs("span",{className:"text-[8.5px] text-neutral-400 font-mono",children:[v.width,"\xD7",v.height]})]},v.name)})})]})]}):null}function bn({laserColor:e,setLaserColor:t,laserMode:r,setLaserMode:o,onClearLaser:p,laserStrokeCount:c,onExitLaser:l}){return jsxRuntime.jsxs("div",{"aria-label":"Laser Pointer Controls",className:"fixed bottom-5 left-1/2 -translate-x-1/2 z-40 flex items-center gap-2 p-1.5 px-2 bg-[#eef1f6]/95 dark:bg-[#16171b]/95 backdrop-blur-2xl rounded-[16px] border border-white/80 dark:border-white/[0.06] shadow-[-6px_-6px_16px_rgba(255,255,255,0.9),_8px_8px_20px_rgba(166,175,195,0.45)] dark:shadow-[-4px_-4px_14px_rgba(255,255,255,0.03),_10px_10px_26px_rgba(0,0,0,0.85)] select-none animate-in fade-in slide-in-from-bottom-3 duration-150 text-xs",children:[jsxRuntime.jsxs("div",{className:"flex items-center gap-1.5 pl-1 pr-1.5 text-neutral-600 dark:text-neutral-300",children:[jsxRuntime.jsxs("span",{className:"relative flex h-2.5 w-2.5",children:[jsxRuntime.jsx("span",{className:"animate-ping absolute inline-flex h-full w-full rounded-full opacity-75",style:{backgroundColor:e}}),jsxRuntime.jsx("span",{className:"relative inline-flex rounded-full h-2.5 w-2.5 shadow-sm",style:{backgroundColor:e}})]}),jsxRuntime.jsx("span",{className:"text-[11px] font-bold tracking-wide uppercase text-neutral-700 dark:text-neutral-200",children:"Laser"})]}),jsxRuntime.jsx("div",{className:"w-[1px] h-4 bg-black/10 dark:bg-white/10 mx-0.5"}),jsxRuntime.jsx("div",{className:"flex items-center gap-1.5",children:ta.map(s=>{let n=e.toLowerCase()===s.hex.toLowerCase();return jsxRuntime.jsx("button",{type:"button",onClick:()=>t(s.hex),title:s.name,className:`relative w-6 h-6 rounded-[7px] transition-all cursor-pointer flex items-center justify-center ${n?"scale-110 ring-2 ring-primary ring-offset-1 dark:ring-offset-neutral-900 shadow-[-2px_-2px_4px_rgba(255,255,255,0.9),_2px_2px_4px_rgba(0,0,0,0.3)]":"border border-black/15 dark:border-white/15 hover:scale-105 shadow-[-1px_-1px_2px_rgba(255,255,255,0.8),_1px_1px_2px_rgba(0,0,0,0.2)]"}`,style:{backgroundColor:s.hex},children:n&&jsxRuntime.jsx("span",{className:"w-1.5 h-1.5 rounded-full bg-white shadow-xs"})},s.hex)})}),jsxRuntime.jsx("div",{className:"w-[1px] h-4 bg-black/10 dark:bg-white/10 mx-0.5"}),jsxRuntime.jsxs("div",{className:"flex items-center p-0.5 rounded-[9px] bg-[#e4e8ef] dark:bg-[#121316] border border-white/60 dark:border-white/[0.04] shadow-[inset_1.5px_1.5px_3.5px_rgba(166,175,195,0.45),_inset_-1.5px_-1.5px_3.5px_rgba(255,255,255,0.9)] dark:shadow-[inset_2px_2px_4px_rgba(0,0,0,0.6),_inset_-1px_-1px_2px_rgba(255,255,255,0.03)] h-7",children:[jsxRuntime.jsxs("button",{type:"button",onClick:()=>o("fading"),title:"Laser beam smoothly vanishes automatically as you draw",className:`h-full px-2 flex items-center gap-1 rounded-[6px] text-[10.5px] font-medium transition-all cursor-pointer ${r==="fading"?"bg-[#f0f3f8] dark:bg-[#22242b] text-neutral-900 dark:text-neutral-100 font-bold shadow-[-2px_-2px_4px_rgba(255,255,255,1),_2px_2px_4px_rgba(166,175,195,0.55),_0_0_0_1px_rgba(255,255,255,0.8)] dark:shadow-[-2px_-2px_4px_rgba(255,255,255,0.06),_2px_2px_5px_rgba(0,0,0,0.8),_0_0_0_1px_rgba(255,255,255,0.06)]":"text-neutral-500 dark:text-neutral-400 hover:text-neutral-800 dark:hover:text-neutral-200"}`,children:[jsxRuntime.jsx(iconsReact.IconFlame,{size:13,className:"text-amber-500"}),jsxRuntime.jsx("span",{children:"Fading Trail"})]}),jsxRuntime.jsxs("button",{type:"button",onClick:()=>o("persistent"),title:"Laser marks stay visible on screen until cleared",className:`h-full px-2 flex items-center gap-1 rounded-[6px] text-[10.5px] font-medium transition-all cursor-pointer ${r==="persistent"?"bg-[#f0f3f8] dark:bg-[#22242b] text-neutral-900 dark:text-neutral-100 font-bold shadow-[-2px_-2px_4px_rgba(255,255,255,1),_2px_2px_4px_rgba(166,175,195,0.55),_0_0_0_1px_rgba(255,255,255,0.8)] dark:shadow-[-2px_-2px_4px_rgba(255,255,255,0.06),_2px_2px_5px_rgba(0,0,0,0.8),_0_0_0_1px_rgba(255,255,255,0.06)]":"text-neutral-500 dark:text-neutral-400 hover:text-neutral-800 dark:hover:text-neutral-200"}`,children:[jsxRuntime.jsx(iconsReact.IconPin,{size:13,className:"text-sky-500"}),jsxRuntime.jsx("span",{children:"Keep Marks"})]})]}),c>0&&jsxRuntime.jsxs("button",{type:"button",onClick:p,title:"Clear all laser marks on screen",className:"h-7 px-2 flex items-center gap-1 rounded-[8px] bg-[#f0f3f8] dark:bg-[#1c1e24] border border-white/80 dark:border-white/[0.06] shadow-[-2px_-2px_4px_rgba(255,255,255,0.9),_2px_2px_4px_rgba(166,175,195,0.35)] dark:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.03),_2px_2px_5px_rgba(0,0,0,0.6)] text-rose-600 dark:text-rose-400 text-[10.5px] font-medium transition-all hover:scale-[1.03] active:scale-95 cursor-pointer",children:[jsxRuntime.jsx(iconsReact.IconTrash,{size:13}),jsxRuntime.jsxs("span",{children:["Clear (",c,")"]})]}),jsxRuntime.jsx("div",{className:"w-[1px] h-4 bg-black/10 dark:bg-white/10 mx-0.5"}),jsxRuntime.jsx("button",{type:"button",onClick:l,title:"Exit Laser Pointer (Esc or V)",className:"w-6 h-6 flex items-center justify-center rounded-[7px] text-neutral-400 hover:text-neutral-700 dark:hover:text-neutral-200 hover:bg-black/5 dark:hover:bg-white/5 transition-all cursor-pointer",children:jsxRuntime.jsx(iconsReact.IconX,{size:14})})]})}function kn({elements:e,camera:t,setCamera:r}){let[o,p]=Ln.useState(true),c=Ln.useRef(null),l=Ln.useRef(false),[s,n]=Ln.useState(false),[u,i]=Ln.useState(false),d=168,h=118,a=Ln.useRef({miniScale:1,offsetX:0,offsetY:0,viewportRect:{vx:0,vy:0,vw:0,vh:0}});Ln.useEffect(()=>{if(o)return;let _=c.current;if(!_)return;let S=_.getContext("2d");if(!S)return;S.clearRect(0,0,d,h);let P=jt(e,300),R=d/P.width,I=h/P.height,z=Math.min(R,I),$=(d-P.width*z)/2-P.minX*z,w=(h-P.height*z)/2-P.minY*z;S.fillStyle="#0b6eff",e.forEach(U=>{let E=U.x*z+$,ee=U.y*z+w,te=Math.max(3,Math.abs(U.width)*z),ie=Math.max(3,Math.abs(U.height)*z);S.globalAlpha=.55,S.fillRect(E,ee,te,ie);});let f=typeof window<"u"?window.innerWidth:1200,v=typeof window<"u"?window.innerHeight:800,C=f/t.zoom,T=v/t.zoom,W=-t.x/t.zoom,le=-t.y/t.zoom,L=W*z+$,A=le*z+w,F=Math.max(8,C*z),Z=Math.max(6,T*z);a.current={miniScale:z,offsetX:$,offsetY:w,viewportRect:{vx:L,vy:A,vw:F,vh:Z}},S.globalAlpha=u?.22:.12,S.fillStyle="#ef4444",S.fillRect(L,A,F,Z),S.globalAlpha=1,S.strokeStyle="#ef4444",S.lineWidth=u?2:1.5,S.strokeRect(L,A,F,Z);let be=Math.min(4,Math.min(F,Z)/3);S.fillStyle="#ef4444",S.fillRect(L-1,A-1,be,be),S.fillRect(L+F-be+1,A-1,be,be),S.fillRect(L-1,A+Z-be+1,be,be),S.fillRect(L+F-be+1,A+Z-be+1,be,be);},[e,t,o,u]);let x=(_,S)=>{if(!c.current)return;let P=c.current.getBoundingClientRect(),R=_-P.left,I=S-P.top,{miniScale:z,offsetX:$,offsetY:w}=a.current;if(z<=0)return;let f=(R-$)/z,v=(I-w)/z,C=typeof window<"u"?window.innerWidth:1200,T=typeof window<"u"?window.innerHeight:800;r(W=>({...W,x:Math.round(C/2-f*W.zoom),y:Math.round(T/2-v*W.zoom)}));};return jsxRuntime.jsx("div",{className:"fixed bottom-4 right-4 z-30 flex flex-col items-end",children:o?jsxRuntime.jsxs("button",{type:"button",onClick:()=>p(false),title:"Expand Minimap Overview",className:"h-8 px-3 rounded-[12px] bg-[#f0f3f8] dark:bg-[#1c1e24] text-neutral-700 dark:text-neutral-200 border border-white/80 dark:border-white/[0.06] shadow-[-3px_-3px_7px_rgba(255,255,255,0.95),_3px_3px_7px_rgba(166,175,195,0.4)] dark:shadow-[-2px_-2px_5px_rgba(255,255,255,0.03),_3px_3px_7px_rgba(0,0,0,0.65)] hover:shadow-[-4px_-4px_9px_rgba(255,255,255,1),_4px_4px_9px_rgba(166,175,195,0.5)] hover:text-neutral-900 dark:hover:text-white flex items-center gap-2 text-xs font-semibold select-none cursor-pointer transition-all duration-150",children:[jsxRuntime.jsx("span",{className:"w-5 h-5 rounded-[6px] bg-[#e2e6ee] dark:bg-[#121316] text-primary flex items-center justify-center border border-white/60 dark:border-white/[0.04] shadow-[inset_1px_1px_2.5px_rgba(166,175,195,0.45),_inset_-1px_-1px_2.5px_rgba(255,255,255,0.9)] dark:shadow-[inset_1.5px_1.5px_3px_rgba(0,0,0,0.6),_inset_-1px_-1px_2.5px_rgba(255,255,255,0.03)]",children:jsxRuntime.jsx(iconsReact.IconCompass,{size:13})}),jsxRuntime.jsx("span",{className:"font-medium tracking-tight",children:"Overview"}),jsxRuntime.jsx(iconsReact.IconChevronUp,{size:13,className:"text-neutral-400 dark:text-neutral-500"})]}):jsxRuntime.jsxs("div",{className:"bg-[#edf0f5]/98 dark:bg-[#16171b]/98 backdrop-blur-2xl rounded-[18px] border border-white/80 dark:border-white/[0.06] shadow-[-6px_-6px_16px_rgba(255,255,255,0.95),_8px_8px_18px_rgba(166,175,195,0.45)] dark:shadow-[-4px_-4px_12px_rgba(255,255,255,0.03),_8px_8px_20px_rgba(0,0,0,0.85)] p-2.5 overflow-hidden transition-all select-none animate-in fade-in zoom-in-95 duration-150",children:[jsxRuntime.jsxs("div",{className:"flex items-center justify-between px-1 text-xs font-bold text-neutral-700 dark:text-neutral-200",children:[jsxRuntime.jsxs("span",{className:"flex items-center gap-1.5",children:[jsxRuntime.jsx("span",{className:"w-5 h-5 rounded-[6px] bg-[#e4e8ef] dark:bg-[#131417] text-primary flex items-center justify-center border border-white/70 dark:border-white/[0.04] shadow-[inset_1px_1px_2px_rgba(166,175,195,0.4),_inset_-1px_-1px_2px_rgba(255,255,255,0.8)] dark:shadow-[inset_1.5px_1.5px_3px_rgba(0,0,0,0.6)]",children:jsxRuntime.jsx(iconsReact.IconCompass,{size:12})}),jsxRuntime.jsx("span",{className:"text-[11.5px] tracking-tight",children:"Overview"})]}),jsxRuntime.jsx("button",{type:"button",onClick:()=>p(true),className:"w-6 h-6 rounded-[7px] bg-[#f0f3f8] dark:bg-[#1c1e24] border border-white/80 dark:border-white/[0.06] shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.9),_1.5px_1.5px_3px_rgba(166,175,195,0.35)] dark:shadow-[-1px_-1px_2px_rgba(255,255,255,0.03),_1.5px_1.5px_3px_rgba(0,0,0,0.6)] hover:shadow-[-2px_-2px_4px_rgba(255,255,255,1),_2px_2px_4px_rgba(166,175,195,0.45)] active:shadow-[inset_1.5px_1.5px_3px_rgba(166,175,195,0.5)] flex items-center justify-center text-neutral-400 hover:text-neutral-700 dark:hover:text-neutral-200 transition-all cursor-pointer",title:"Collapse Minimap",children:jsxRuntime.jsx(iconsReact.IconChevronDown,{size:13})})]}),jsxRuntime.jsx("div",{className:"relative mt-2 rounded-[12px] overflow-hidden bg-[#e2e6ee] dark:bg-[#101114] border border-white/60 dark:border-white/[0.04] shadow-[inset_2px_2px_5px_rgba(166,175,195,0.45),_inset_-2px_-2px_5px_rgba(255,255,255,0.9)] dark:shadow-[inset_2px_2px_5px_rgba(0,0,0,0.7),_inset_-1px_-1px_2px_rgba(255,255,255,0.03)]",children:jsxRuntime.jsx("canvas",{ref:c,width:d,height:h,onPointerDown:_=>{_.currentTarget.setPointerCapture(_.pointerId),l.current=true,i(true),x(_.clientX,_.clientY);},onPointerMove:_=>{if(l.current)x(_.clientX,_.clientY);else {let S=_.currentTarget.getBoundingClientRect(),P=_.clientX-S.left,R=_.clientY-S.top,{vx:I,vy:z,vw:$,vh:w}=a.current.viewportRect,f=P>=I&&P<=I+$&&R>=z&&R<=z+w;n(f);}},onPointerUp:_=>{l.current=false,i(false);try{_.currentTarget.releasePointerCapture(_.pointerId);}catch{}},className:`block touch-none select-none transition-all ${u?"cursor-grabbing":s?"cursor-grab":"cursor-crosshair"}`,title:"Click or drag viewport box to pan"})})]})})}function wn({isOpen:e,onClose:t,elements:r,selectedIds:o,camera:p,setCamera:c,isSpotlightActive:l,onToggleSpotlight:s}){let[n,u]=Ln.useState(0),[i,d]=Ln.useState(false),[h,a]=Ln.useState(false),[x,b]=Ln.useState(true),[k,y]=Ln.useState(false),_=Ln.useRef(null),S=Ln.useRef(null),P=Ln.useRef([]),R=Ln.useRef(null),I=Ln.useRef({x:0,y:0}),z=Ln.useMemo(()=>{if(o&&o.length>1){let U=r.filter(E=>o.includes(E.id)).sort((E,ee)=>Math.abs(E.y-ee.y)>120?E.y-ee.y:E.x-ee.x);if(U.length>0)return U.map((E,ee)=>{let ie=Math.min(E.x,E.x+E.width)-60,Se=Math.min(E.y,E.y+E.height)-60,Ke=Math.abs(E.width)+120,X=Math.abs(E.height)+120,Oe=E.frameLabel||(E.text?.trim()?E.text.split(`
|
|
96
|
+
`)[0].slice(0,24):`${E.type.charAt(0).toUpperCase()+E.type.slice(1)} ${ee+1}`);return {id:E.id,title:Oe,x:ie,y:Se,width:Math.max(120,Ke),height:Math.max(80,X),isVirtual:true}})}let F=r.filter(U=>U.type==="frame").sort((U,E)=>Math.abs(U.y-E.y)>120?U.y-E.y:U.x-E.x);if(F.length>0)return F.map((U,E)=>({id:U.id,title:U.frameLabel||`Frame ${E+1}`,x:U.x,y:U.y,width:Math.max(100,Math.abs(U.width)),height:Math.max(100,Math.abs(U.height))}));let Z=r.filter(U=>U.type!=="line"&&U.type!=="arrow"&&Math.abs(U.width)>30&&Math.abs(U.height)>20);return Z.length===0?[{id:"default-slide",title:"Overview",x:0,y:0,width:800,height:600,isVirtual:true}]:[...Z].sort((U,E)=>Math.abs(U.y-E.y)>180?U.y-E.y:U.x-E.x).map((U,E)=>{let te=Math.min(U.x,U.x+U.width)-80,ie=Math.min(U.y,U.y+U.height)-80,Se=Math.abs(U.width)+160,Ke=Math.abs(U.height)+160,X=U.text?.trim()?U.text.split(`
|
|
97
|
+
`)[0].slice(0,24):`${U.type.charAt(0).toUpperCase()+U.type.slice(1)} ${E+1}`;return {id:U.id,title:X,x:te,y:ie,width:Se,height:Ke,isVirtual:true}})},[r]),$=Ln.useCallback((F,Z=true)=>{if(typeof window>"u")return;let be=window.innerWidth,U=window.innerHeight,E=70,ee=(be-E*2)/Math.max(F.width,100),te=(U-E*2)/Math.max(F.height,100),ie=Math.min(Math.max(Math.min(ee,te),.1),2.5),Se=F.x+F.width/2,Ke=F.y+F.height/2,X=be/2-Se*ie,Oe=U/2-Ke*ie;if(!Z){c({x:X,y:Oe,zoom:ie});return}let je=p.x,Ne=p.y,_e=p.zoom,Pe=performance.now(),he=480,ve=(X-je)/ie,ue=(Oe-Ne)/ie,K=Math.hypot(ve,ue),Y=Math.min(.18,Math.max(.04,K/3800)),Q=M=>{let pe=M-Pe,g=Math.min(pe/he,1),D=1-Math.pow(1-g,3),N=Math.sin(g*Math.PI)*Y*ie,se=je+(X-je)*D,de=Ne+(Oe-Ne)*D,oe=Math.max(.08,_e+(ie-_e)*D-N);c({x:se,y:de,zoom:oe}),g<1&&requestAnimationFrame(Q);};requestAnimationFrame(Q);},[p,c]);Ln.useEffect(()=>{e&&z.length>0&&(u(0),$(z[0],true));},[e,z.length]);let w=Ln.useCallback(F=>{F<0||F>=z.length||(u(F),$(z[F],true));},[z,$]),f=Ln.useCallback(()=>{n<z.length-1&&w(n+1);},[n,z.length,w]),v=Ln.useCallback(()=>{n>0&&w(n-1);},[n,w]),C=Ln.useCallback(()=>{document.fullscreenElement?document.exitFullscreen().then(()=>{d(false);}).catch(()=>{}):document.documentElement.requestFullscreen().then(()=>{d(true);}).catch(()=>{});},[]);Ln.useEffect(()=>{if(!e)return;let F=Z=>{if(!(document.activeElement?.tagName==="INPUT"||document.activeElement?.tagName==="TEXTAREA"))switch(Z.key){case "ArrowRight":case "PageDown":case " ":case "Enter":Z.preventDefault(),f();break;case "ArrowLeft":case "PageUp":case "Backspace":Z.preventDefault(),v();break;case "Home":Z.preventDefault(),w(0);break;case "End":Z.preventDefault(),w(z.length-1);break;case "Escape":Z.preventDefault(),document.fullscreenElement&&(document.exitFullscreen().catch(()=>{}),d(false)),t();break;case "f":case "F":!Z.ctrlKey&&!Z.metaKey&&!Z.altKey&&(Z.preventDefault(),C());break;case "l":case "L":!Z.ctrlKey&&!Z.metaKey&&!Z.altKey&&(Z.preventDefault(),y(be=>!be));break;case "s":case "S":!Z.ctrlKey&&!Z.metaKey&&s&&(Z.preventDefault(),s());break;case "g":case "G":!Z.ctrlKey&&!Z.metaKey&&!Z.altKey&&(Z.preventDefault(),a(be=>!be));break}};return window.addEventListener("keydown",F),()=>window.removeEventListener("keydown",F)},[e,f,v,w,z.length,t,C,s]);let T=Ln.useCallback(()=>{b(true),_.current&&clearTimeout(_.current),_.current=setTimeout(()=>{h||b(false);},3200);},[h]);if(Ln.useEffect(()=>{if(!e)return;let F=Z=>{I.current={x:Z.clientX,y:Z.clientY},k&&P.current.push({x:Z.clientX,y:Z.clientY,time:performance.now()}),T();};return window.addEventListener("mousemove",F),T(),()=>{window.removeEventListener("mousemove",F),_.current&&clearTimeout(_.current);}},[e,k,T]),Ln.useEffect(()=>{if(!e||!k){R.current&&cancelAnimationFrame(R.current);return}let F=S.current;if(!F)return;let Z=F.getContext("2d");if(!Z)return;let be=()=>{F.width=window.innerWidth,F.height=window.innerHeight;};be(),window.addEventListener("resize",be);let U=()=>{let E=performance.now();Z.clearRect(0,0,F.width,F.height),P.current=P.current.filter(Se=>E-Se.time<450);let ee=P.current;if(ee.length>1)for(let Se=1;Se<ee.length;Se++){let Ke=ee[Se-1],X=ee[Se],Oe=E-X.time,je=Math.max(0,1-Oe/450);Z.beginPath(),Z.moveTo(Ke.x,Ke.y),Z.lineTo(X.x,X.y),Z.strokeStyle=`rgba(239, 68, 68, ${je*.75})`,Z.lineWidth=4*je,Z.lineCap="round",Z.shadowColor="#ef4444",Z.shadowBlur=12*je,Z.stroke();}let{x:te,y:ie}=I.current;te>0&&ie>0&&(Z.beginPath(),Z.arc(te,ie,7,0,Math.PI*2),Z.fillStyle="#ef4444",Z.shadowColor="#ff2222",Z.shadowBlur=18,Z.fill(),Z.beginPath(),Z.arc(te,ie,3,0,Math.PI*2),Z.fillStyle="#ffffff",Z.shadowBlur=4,Z.fill()),R.current=requestAnimationFrame(U);};return R.current=requestAnimationFrame(U),()=>{window.removeEventListener("resize",be),R.current&&cancelAnimationFrame(R.current);}},[e,k]),!e||z.length===0)return null;let W=z[n],le=(n+1)/z.length*100,L=n===0,A=n===z.length-1;return jsxRuntime.jsxs("div",{className:"fixed inset-0 z-40 pointer-events-none select-none",children:[k&&jsxRuntime.jsx("canvas",{ref:S,className:"fixed inset-0 pointer-events-none z-50"}),jsxRuntime.jsx("div",{className:"absolute top-0 left-0 right-0 h-1 bg-black/15 dark:bg-white/10 z-50",children:jsxRuntime.jsx("div",{className:"h-full bg-linear-to-r from-primary via-amber-500 to-primary transition-all duration-300 ease-out shadow-[0_0_8px_rgba(59,130,246,0.6)]",style:{width:`${le}%`}})}),jsxRuntime.jsx("div",{className:`fixed left-4 top-1/2 -translate-y-1/2 z-50 pointer-events-auto transition-all duration-300 ${x&&!L?"opacity-100 translate-x-0":"opacity-0 -translate-x-4 pointer-events-none"}`,children:jsxRuntime.jsx("button",{type:"button",onClick:v,className:"group p-3.5 rounded-full bg-neutral-900/80 dark:bg-[#1c1d22]/90 hover:bg-neutral-900 dark:hover:bg-[#25272e] text-white/90 hover:text-white backdrop-blur-xl border border-white/20 dark:border-white/10 shadow-2xl shadow-black/40 hover:scale-110 active:scale-95 transition-all cursor-pointer flex items-center justify-center",title:"Previous Slide (\u2190 / Backspace)",children:jsxRuntime.jsx(iconsReact.IconChevronLeft,{size:22,className:"group-hover:-translate-x-0.5 transition-transform"})})}),jsxRuntime.jsx("div",{className:`fixed right-4 top-1/2 -translate-y-1/2 z-50 pointer-events-auto transition-all duration-300 ${x&&!A?"opacity-100 translate-x-0":"opacity-0 translate-x-4 pointer-events-none"}`,children:jsxRuntime.jsx("button",{type:"button",onClick:f,className:"group p-3.5 rounded-full bg-neutral-900/80 dark:bg-[#1c1d22]/90 hover:bg-neutral-900 dark:hover:bg-[#25272e] text-white/90 hover:text-white backdrop-blur-xl border border-white/20 dark:border-white/10 shadow-2xl shadow-black/40 hover:scale-110 active:scale-95 transition-all cursor-pointer flex items-center justify-center",title:"Next Slide (\u2192 / Space)",children:jsxRuntime.jsx(iconsReact.IconChevronRight,{size:22,className:"group-hover:translate-x-0.5 transition-transform"})})}),jsxRuntime.jsxs("div",{className:`absolute bottom-6 left-1/2 -translate-x-1/2 z-50 pointer-events-auto transition-all duration-300 ${x?"opacity-100 translate-y-0":"opacity-0 translate-y-4 pointer-events-none"}`,children:[jsxRuntime.jsxs("div",{className:"flex items-center gap-1.5 p-1.5 rounded-[18px] bg-neutral-900/90 dark:bg-[#181818]/95 backdrop-blur-xl border border-white/15 dark:border-neutral-800 text-white shadow-2xl shadow-black/40",children:[jsxRuntime.jsxs("div",{className:"hidden sm:flex items-center gap-1.5 pl-2.5 pr-2 py-1 text-xs font-semibold text-neutral-300 border-r border-white/10",children:[jsxRuntime.jsx(iconsReact.IconSlideshow,{size:16,className:"text-primary"}),jsxRuntime.jsx("span",{className:"max-w-[150px] truncate",children:W?.title||`Slide ${n+1}`})]}),jsxRuntime.jsxs("div",{className:"flex items-center gap-0.5",children:[jsxRuntime.jsx("button",{type:"button",onClick:v,disabled:L,className:"p-2 rounded-[10px] text-neutral-300 hover:text-white hover:bg-white/10 disabled:opacity-30 disabled:hover:bg-transparent transition-colors cursor-pointer",title:"Previous Slide (\u2190 / Backspace)",children:jsxRuntime.jsx(iconsReact.IconChevronLeft,{size:18})}),jsxRuntime.jsxs("span",{className:"px-2.5 py-1 text-xs font-mono font-medium text-neutral-200",children:[jsxRuntime.jsx("span",{className:"font-bold text-white",children:n+1}),jsxRuntime.jsx("span",{className:"text-neutral-500 mx-1",children:"/"}),jsxRuntime.jsx("span",{children:z.length})]}),jsxRuntime.jsx("button",{type:"button",onClick:f,disabled:A,className:"p-2 rounded-[10px] text-neutral-300 hover:text-white hover:bg-white/10 disabled:opacity-30 disabled:hover:bg-transparent transition-colors cursor-pointer",title:"Next Slide (\u2192 / Space)",children:jsxRuntime.jsx(iconsReact.IconChevronRight,{size:18})})]}),jsxRuntime.jsx("div",{className:"w-[1px] h-4 bg-white/15 mx-0.5"}),jsxRuntime.jsx("button",{type:"button",onClick:()=>y(F=>!F),className:`p-2 rounded-[10px] transition-colors cursor-pointer ${k?"bg-rose-500 text-white shadow-[0_0_10px_rgba(239,68,68,0.7)]":"text-neutral-300 hover:text-white hover:bg-white/10"}`,title:"Laser Pointer Trail (L)",children:jsxRuntime.jsx(iconsReact.IconPointer,{size:18,className:k?"animate-pulse":""})}),s&&jsxRuntime.jsx("button",{type:"button",onClick:s,className:`p-2 rounded-[10px] transition-colors cursor-pointer ${l?"bg-amber-500 text-white shadow-[0_0_10px_rgba(245,158,11,0.7)]":"text-neutral-300 hover:text-white hover:bg-white/10"}`,title:"Spotlight Mode (S)",children:jsxRuntime.jsx(iconsReact.IconSparkles,{size:18})}),jsxRuntime.jsx("button",{type:"button",onClick:()=>a(F=>!F),className:`p-2 rounded-[10px] transition-colors cursor-pointer ${h?"bg-primary text-primary-foreground":"text-neutral-300 hover:text-white hover:bg-white/10"}`,title:"All Slides Grid Overview (G)",children:jsxRuntime.jsx(iconsReact.IconList,{size:18})}),jsxRuntime.jsx("button",{type:"button",onClick:C,className:"p-2 rounded-[10px] text-neutral-300 hover:text-white hover:bg-white/10 transition-colors cursor-pointer",title:i?"Exit Fullscreen (F)":"Enter Fullscreen (F)",children:i?jsxRuntime.jsx(iconsReact.IconMinimize,{size:18}):jsxRuntime.jsx(iconsReact.IconMaximize,{size:18})}),jsxRuntime.jsx("button",{type:"button",onClick:()=>{document.fullscreenElement&&document.exitFullscreen().catch(()=>{}),t();},className:"p-2 rounded-[10px] text-rose-400 hover:text-rose-300 hover:bg-rose-500/20 transition-colors cursor-pointer",title:"Exit Presentation Mode (Esc)",children:jsxRuntime.jsx(iconsReact.IconX,{size:18})})]}),h&&jsxRuntime.jsxs("div",{className:"absolute bottom-full left-1/2 -translate-x-1/2 mb-3 w-84 max-h-72 overflow-y-auto bg-neutral-900/95 dark:bg-[#181818]/95 backdrop-blur-xl border border-white/15 dark:border-neutral-800 rounded-[18px] p-2.5 shadow-2xl space-y-1",children:[jsxRuntime.jsxs("div",{className:"px-2 py-1 text-[11px] font-bold uppercase tracking-wider text-neutral-400 border-b border-white/10 mb-1 flex items-center justify-between",children:[jsxRuntime.jsx("span",{children:"Presentation Slides"}),jsxRuntime.jsxs("span",{className:"font-mono text-[10px]",children:[z.length," Total"]})]}),z.map((F,Z)=>jsxRuntime.jsxs("button",{type:"button",onClick:()=>{w(Z),a(false);},className:`w-full flex items-center justify-between px-3 py-2 rounded-[10px] text-xs text-left transition-all ${Z===n?"bg-primary text-primary-foreground font-semibold shadow-xs":"text-neutral-300 hover:bg-white/10 hover:text-white"}`,children:[jsxRuntime.jsxs("div",{className:"flex items-center gap-2.5 truncate",children:[jsxRuntime.jsx("span",{className:"w-5 h-5 rounded-full bg-white/10 flex items-center justify-center text-[10px] font-mono shrink-0",children:Z+1}),jsxRuntime.jsx("span",{className:"truncate",children:F.title})]}),jsxRuntime.jsxs("span",{className:"text-[10px] opacity-60 font-mono shrink-0 ml-2",children:[Math.round(F.width),"\xD7",Math.round(F.height)]})]},F.id))]})]})]})}function bl(e){if(!e||e==="transparent")return "text-neutral-700 dark:text-neutral-300";let t=e.replace("#","");if(t.length!==6)return "text-white";let r=parseInt(t.substring(0,2),16),o=parseInt(t.substring(2,4),16),p=parseInt(t.substring(4,6),16);return (r*299+o*587+p*114)/1e3>=150?"text-neutral-800":"text-white"}function Fa(e,t,r){if(e==="transparent")return r?["#121212","#1e1e24","#334155","#64748b","#cbd5e1"]:["#f8fafc","#e2e8f0","#cbd5e1","#94a3b8","#64748b"];let o=e.replace("#","");if(o.length===3&&(o=o[0]+o[0]+o[1]+o[1]+o[2]+o[2]),o.length!==6)return r?["#121212","#1e1e24","#334155","#64748b","#cbd5e1"]:["#f8fafc","#e2e8f0","#cbd5e1","#94a3b8","#64748b"];let p=parseInt(o.substring(0,2),16)/255,c=parseInt(o.substring(2,4),16)/255,l=parseInt(o.substring(4,6),16)/255,s=Math.max(p,c,l),n=Math.min(p,c,l),u=0,i=0,d=(s+n)/2;if(s!==n){let x=s-n;switch(i=d>.5?x/(2-s-n):x/(s+n),s){case p:u=(c-l)/x+(c<l?6:0);break;case c:u=(l-p)/x+2;break;case l:u=(p-c)/x+4;break}u/=6;}let h=(x,b,k)=>{let y=(I,z,$)=>($<0&&($+=1),$>1&&($-=1),$<.16666666666666666?I+(z-I)*6*$:$<.5?z:$<.6666666666666666?I+(z-I)*(.6666666666666666-$)*6:I),_,S,P;if(b===0)_=S=P=k;else {let I=k<.5?k*(1+b):k+b-k*b,z=2*k-I;_=y(z,I,x+1/3),S=y(z,I,x),P=y(z,I,x-1/3);}let R=I=>{let z=Math.round(Math.max(0,Math.min(1,I))*255).toString(16);return z.length===1?"0"+z:z};return `#${R(_)}${R(S)}${R(P)}`},a=Math.max(i,.45);return t==="stroke"?r?[.2,.35,.5,.65,.82].map(b=>h(u,a,b)):[.93,.78,.62,.48,.35].map(b=>h(u,a,b)):r?[.08,.16,.3,.52,.76].map(b=>h(u,a,b)):[.96,.88,.74,.58,.42].map(b=>h(u,a,b))}function Sn({selectedElements:e,updateSelectedElements:t,deleteSelectedElements:r,duplicateSelectedElements:o,groupSelectedElements:p,ungroupSelectedElements:c,alignSelectedElements:l,distributeSelectedElements:s,bringToFront:n,sendToBack:u,bringForward:i,sendBackward:d,defaultStyles:h,setDefaultStyles:a,canvasBackground:x,setCanvasBackground:b}){let {resolvedTheme:k,isDark:y,panelVariant:_}=Vt(),S=_==="neumorphic";ao();let [R,I]=Ln.useState(false),[z,$]=Ln.useState("none"),[w,f]=Ln.useState(null),[v,C]=Ln.useState("none"),[T,W]=Ln.useState(null),[le,L]=Ln.useState(null),A=Ln.useRef(null),F=Ln.useRef(null),Z=Ln.useRef(null);Ln.useRef(null);let U=e.length>0,E=U?e[0]:h,ee=z==="stroke"?E.strokeColor||"#1e1e24":E.fillColor||"transparent",te=le!==null?le:ee!=="transparent"?ee.replace("#","").toUpperCase():"",ie=g=>{U&&t(g);let D=["strokeColor","strokeWidth","strokeStyle","fillColor","fillStyle","roughStyle","roughness","edgeStyle","opacity","fontFamily","fontSize","textAlign","arrowType","startArrowhead","endArrowhead","stickyColor"],N={},se=false;for(let de of D)g[de]!==void 0&&(N[de]=g[de],se=true);se&&a(de=>({...de,...N}));};Ln.useEffect(()=>{if(e.length===1){let g=e[0];a(D=>{let N={...D};return g.strokeColor!==void 0&&(N.strokeColor=g.strokeColor),g.strokeWidth!==void 0&&(N.strokeWidth=g.strokeWidth),g.strokeStyle!==void 0&&(N.strokeStyle=g.strokeStyle),g.fillColor!==void 0&&g.type!=="arrow"&&g.type!=="line"&&(N.fillColor=g.fillColor),g.fillStyle!==void 0&&g.type!=="arrow"&&g.type!=="line"&&(N.fillStyle=g.fillStyle),g.roughStyle!==void 0&&(N.roughStyle=g.roughStyle),g.roughness!==void 0&&(N.roughness=g.roughness),g.edgeStyle!==void 0&&(N.edgeStyle=g.edgeStyle),g.opacity!==void 0&&(N.opacity=g.opacity),g.fontFamily!==void 0&&(N.fontFamily=g.fontFamily),g.fontSize!==void 0&&(N.fontSize=g.fontSize),g.textAlign!==void 0&&(N.textAlign=g.textAlign),g.arrowType!==void 0&&(N.arrowType=g.arrowType),g.startArrowhead!==void 0&&(N.startArrowhead=g.startArrowhead),g.endArrowhead!==void 0&&(N.endArrowhead=g.endArrowhead),g.stickyColor!==void 0&&(N.stickyColor=g.stickyColor),N});}},[e[0]?.id,a]);let Se=g=>{L(null),z==="stroke"?ie({strokeColor:g}):z==="background"&&ie({fillColor:g});};Ln.useEffect(()=>{let g=D=>{let N=D.target;A.current&&!A.current.contains(N)&&(N.closest("[data-color-trigger]")||($("none"),f(null))),F.current&&!F.current.contains(D.target)&&(N.closest("[data-arrowhead-trigger]")||(C("none"),W(null)));};return (z!=="none"||v!=="none")&&document.addEventListener("mousedown",g),()=>{document.removeEventListener("mousedown",g);}},[z,v]),Ln.useEffect(()=>{if(z==="none")return;let g=D=>{let N=document.activeElement;if(N&&(N.tagName==="INPUT"||N.tagName==="TEXTAREA")||D.ctrlKey||D.metaKey||D.altKey||D.shiftKey)return;let se=D.key.toLowerCase(),de=lo.find(oe=>oe.key===se);if(de){D.preventDefault();let oe=z==="background"?y?de.fill.dark:de.fill.light:y?de.stroke.dark:de.stroke.light;Se(oe);return}if(["1","2","3","4","5"].includes(D.key)){D.preventDefault();let oe=parseInt(D.key,10)-1,O=Fa(ee,z==="stroke"?"stroke":"background",y);O[oe]&&Se(O[oe]);}};return document.addEventListener("keydown",g),()=>{document.removeEventListener("keydown",g);}},[z,ee,y]);let Ke=(g,D)=>{if(C("none"),W(null),z===g){$("none"),f(null);return}let N=D.currentTarget.getBoundingClientRect(),se=N.top+N.height/2,de=310,oe=se-de/2,O=76,re=window.innerHeight-de-16,ge=Math.max(O,Math.min(oe,re)),Ce=Math.max(14,Math.min(se-ge,de-20));f({top:ge,arrowTop:Ce}),$(g);},X=(g,D)=>{if($("none"),f(null),v===g){C("none"),W(null);return}let N=D.currentTarget.getBoundingClientRect(),se=N.top+N.height/2,de=220,oe=se-de/2,O=76,re=window.innerHeight-de-16,ge=Math.max(O,Math.min(oe,re)),Ce=Math.max(14,Math.min(se-ge,de-20));W({top:ge,arrowTop:Ce}),C(g);},Oe=g=>{let D=g.replace("#","").trim();(/^[0-9A-Fa-f]{6}$/.test(D)||/^[0-9A-Fa-f]{3}$/.test(D))&&Se(`#${D}`);},je=U&&E.type==="frame",Ne=U&&E.type==="image",_e=!U||["rectangle","ellipse","diamond","triangle","capsule","parallelogram","trapezoid","hexagon","cylinder","cloud","star","sticky","frame"].includes(E.type),Pe=U&&(E.type==="text"||E.type==="sticky"),he=U&&E.type==="sticky",ve=U&&E.type==="text",ue=U&&(E.type==="line"||E.type==="arrow"),K=e.length>1,Y=Fa(ee,z==="stroke"?"stroke":"background",y),M=(()=>{if(!U)return {icon:iconsReact.IconPencil,title:"Canvas Styles",subtitle:"Default drawing properties"};if(K)return {icon:iconsReact.IconLayersSubtract,title:`Selection (${e.length})`,subtitle:"Multiple items selected"};switch(E.type){case "frame":return {icon:iconsReact.IconSquare,title:E.frameLabel||"Frame",subtitle:"Presentation artboard"};case "sticky":return {icon:iconsReact.IconNote,title:"Sticky Note",subtitle:"Quick idea card"};case "text":return {icon:iconsReact.IconTypography,title:"Text Block",subtitle:"Typography element"};case "arrow":case "line":return {icon:iconsReact.IconArrowUpRight,title:E.type==="arrow"?"Arrow":"Line",subtitle:"Connector line"};case "rectangle":return {icon:iconsReact.IconSquare,title:"Rectangle",subtitle:"Shape element"};case "ellipse":return {icon:iconsReact.IconCircle,title:"Ellipse",subtitle:"Circle shape"};case "triangle":return {icon:iconsReact.IconTriangle,title:"Triangle",subtitle:"3-sided polygon"};case "trapezoid":return {icon:iconsReact.IconSquare,title:"Trapezoid",subtitle:"Trapezium shape"};case "hexagon":return {icon:iconsReact.IconSquare,title:"Hexagon",subtitle:"6-sided polygon"};case "capsule":return {icon:iconsReact.IconCircle,title:"Capsule",subtitle:"Stadium / Pill shape"};case "cylinder":return {icon:iconsReact.IconDatabase,title:"Cylinder",subtitle:"Database shape"};case "cloud":return {icon:iconsReact.IconCloud,title:"Cloud",subtitle:"Network & infra shape"};case "parallelogram":return {icon:iconsReact.IconSquare,title:"Parallelogram",subtitle:"Data input/output shape"};case "star":return {icon:iconsReact.IconSparkles,title:"Star",subtitle:"Highlight & badge shape"};default:return {icon:iconsReact.IconSparkles,title:"Element",subtitle:"Selected item"}}})(),pe=M.icon;return R?jsxRuntime.jsxs("button",{type:"button",onClick:()=>I(false),className:"fixed right-3.5 top-16 z-30 flex items-center gap-1.5 px-2.5 py-1.5 rounded-full bg-white/90 dark:bg-[#16161a]/90 backdrop-blur-xl border border-neutral-200/80 dark:border-neutral-800/80 shadow-lg text-neutral-600 dark:text-neutral-300 hover:text-primary dark:hover:text-primary transition-all duration-150 cursor-pointer",title:"Open Properties Panel",children:[jsxRuntime.jsx(iconsReact.IconChevronLeft,{size:14,stroke:2.2}),jsxRuntime.jsx("span",{className:"text-[11px] font-semibold pr-0.5",children:"Properties"})]}):jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsxs("aside",{"aria-label":"Properties Panel",className:`fk-card fixed right-3.5 top-16 z-30 w-[272px] max-h-[calc(100vh-80px)] flex flex-col rounded-[20px] text-neutral-800 dark:text-neutral-200 select-none overflow-hidden transition-all ${S?"bg-[#eef1f6]/95 dark:bg-[#16171b]/95 backdrop-blur-2xl border border-white/70 dark:border-white/[0.06] shadow-[-6px_-6px_16px_rgba(255,255,255,0.85),_8px_8px_20px_rgba(166,175,195,0.45)] dark:shadow-[-4px_-4px_14px_rgba(255,255,255,0.02),_10px_10px_26px_rgba(0,0,0,0.85)]":"bg-white/95 dark:bg-[#16171b]/95 backdrop-blur-md border border-black/[0.04] dark:border-white/[0.05] shadow-[0_10px_30px_-4px_rgba(0,0,0,0.08),0_4px_12px_-2px_rgba(0,0,0,0.03)] dark:shadow-[0_14px_34px_-4px_rgba(0,0,0,0.65),0_4px_14px_-2px_rgba(0,0,0,0.45)]"}`,children:[jsxRuntime.jsxs("div",{className:"flex items-center justify-between px-3 py-2.5 border-b border-black/[0.04] dark:border-white/[0.04] bg-white/30 dark:bg-black/15",children:[jsxRuntime.jsxs("div",{className:"flex items-center gap-2 min-w-0",children:[jsxRuntime.jsx("div",{className:"w-6 h-6 rounded-[8px] bg-[#f0f3f8] dark:bg-[#1f2128] border border-white/80 dark:border-white/[0.06] shadow-[-1.5px_-1.5px_3.5px_rgba(255,255,255,0.9),_1.5px_1.5px_3.5px_rgba(166,175,195,0.4)] dark:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.04),_1.5px_1.5px_4px_rgba(0,0,0,0.6)] text-primary flex items-center justify-center shrink-0",children:jsxRuntime.jsx(pe,{size:13,stroke:2.2})}),jsxRuntime.jsx("div",{className:"min-w-0",children:jsxRuntime.jsx("h3",{className:"text-xs font-bold text-neutral-900 dark:text-neutral-100 truncate leading-tight",children:M.title})})]}),jsxRuntime.jsxs("div",{className:"flex items-center gap-1 shrink-0",children:[U&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("button",{type:"button",onClick:o,className:"w-6 h-6 rounded-[7px] flex items-center justify-center text-neutral-500 dark:text-neutral-400 hover:text-neutral-900 dark:hover:text-white bg-[#f0f3f8]/70 dark:bg-[#1c1e24]/70 border border-white/60 dark:border-white/[0.04] hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.9),_1.5px_1.5px_3px_rgba(166,175,195,0.35)] dark:hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.03),_1.5px_1.5px_4px_rgba(0,0,0,0.5)] transition-all cursor-pointer",title:"Duplicate (Ctrl+D)",children:jsxRuntime.jsx(iconsReact.IconCopy,{size:13})}),jsxRuntime.jsx("button",{type:"button",onClick:r,className:"w-6 h-6 rounded-[7px] flex items-center justify-center text-neutral-500 hover:text-rose-600 dark:hover:text-rose-400 bg-[#f0f3f8]/70 dark:bg-[#1c1e24]/70 border border-white/60 dark:border-white/[0.04] hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.9),_1.5px_1.5px_3px_rgba(244,63,94,0.3)] dark:hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.03),_1.5px_1.5px_4px_rgba(0,0,0,0.5)] transition-all cursor-pointer",title:"Delete (Del)",children:jsxRuntime.jsx(iconsReact.IconTrash,{size:13})}),jsxRuntime.jsx("div",{className:"w-[1px] h-3 bg-black/10 dark:bg-white/10 mx-0.5"})]}),jsxRuntime.jsx("button",{type:"button",onClick:()=>I(true),className:"w-6 h-6 rounded-[7px] flex items-center justify-center text-neutral-500 dark:text-neutral-400 hover:text-neutral-900 dark:hover:text-white bg-[#f0f3f8]/70 dark:bg-[#1c1e24]/70 border border-white/60 dark:border-white/[0.04] hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.9),_1.5px_1.5px_3px_rgba(166,175,195,0.35)] dark:hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.03),_1.5px_1.5px_4px_rgba(0,0,0,0.5)] transition-all cursor-pointer",title:"Collapse panel",children:jsxRuntime.jsx(iconsReact.IconChevronRight,{size:13,stroke:2.2})})]})]}),jsxRuntime.jsxs("div",{className:"flex-1 overflow-y-auto px-3 py-2.5 space-y-3 text-xs scrollbar-thin scrollbar-thumb-neutral-300 dark:scrollbar-thumb-neutral-700",children:[je&&e[0]&&(()=>{let g=e[0];return jsxRuntime.jsxs("div",{className:"space-y-2.5 pb-2.5 border-b border-black/[0.05] dark:border-white/[0.05]",children:[jsxRuntime.jsxs("div",{children:[jsxRuntime.jsx("div",{className:"text-[10px] font-bold text-neutral-400 dark:text-neutral-500 uppercase tracking-wider mb-1",children:"Frame Title"}),jsxRuntime.jsx("input",{type:"text",value:g.frameLabel||"",placeholder:"e.g. Slide 1, Screen",onKeyDown:D=>D.stopPropagation(),onChange:D=>ie({frameLabel:D.target.value}),className:"w-full h-7 px-2.5 text-xs font-semibold rounded-[8px] bg-[#e2e6ed] dark:bg-[#121316] border border-black/[0.03] dark:border-white/[0.03] shadow-[inset_1.5px_1.5px_3px_rgba(166,175,195,0.45),_inset_-1.5px_-1.5px_3px_rgba(255,255,255,0.9)] dark:shadow-[inset_2px_2px_4px_rgba(0,0,0,0.6),_inset_-1px_-1px_2px_rgba(255,255,255,0.03)] text-neutral-900 dark:text-neutral-100 outline-none focus:shadow-[inset_2px_2px_4px_rgba(99,102,241,0.25),_0_0_0_1.5px_rgba(99,102,241,0.4)] transition-all"})]}),jsxRuntime.jsxs("div",{children:[jsxRuntime.jsx("div",{className:"text-[10px] font-bold text-neutral-400 dark:text-neutral-500 uppercase tracking-wider mb-1",children:"Presets"}),jsxRuntime.jsx("div",{className:"grid grid-cols-3 gap-1.5",children:[{label:"16:9",w:800,h:450},{label:"1080p",w:1920,h:1080},{label:"Mobile",w:390,h:844},{label:"16:10",w:1440,h:900},{label:"4:3",w:1024,h:768},{label:"1:1",w:800,h:800}].map(D=>{let N=Math.round(Math.abs(g.width||0))===D.w&&Math.round(Math.abs(g.height||0))===D.h;return jsxRuntime.jsx("button",{type:"button",onClick:()=>ie({width:D.w,height:D.h}),className:`py-1 rounded-[7px] text-center transition-all cursor-pointer text-[10.5px] ${N?"bg-[#f0f3f8] dark:bg-[#22242b] text-primary border border-primary/40 font-bold shadow-[-2px_-2px_4px_rgba(255,255,255,0.95),_2px_2px_4px_rgba(166,175,195,0.5)] dark:shadow-[-2px_-2px_4px_rgba(255,255,255,0.05),_2px_2px_5px_rgba(0,0,0,0.7)]":"bg-[#e6eaf0] dark:bg-[#18191e] border border-white/60 dark:border-white/[0.04] text-neutral-600 dark:text-neutral-300 shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.8),_1.5px_1.5px_3px_rgba(166,175,195,0.3)] dark:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.02),_1.5px_1.5px_4px_rgba(0,0,0,0.5)] hover:bg-[#f0f3f8] dark:hover:bg-[#1f2128]"}`,children:D.label},D.label)})})]}),jsxRuntime.jsxs("div",{children:[jsxRuntime.jsxs("div",{className:"flex items-center justify-between text-[10px] font-bold text-neutral-400 dark:text-neutral-500 uppercase tracking-wider mb-1",children:[jsxRuntime.jsx("span",{children:"Dimensions"}),jsxRuntime.jsxs("button",{type:"button",onClick:()=>ie({aspectRatioLocked:!g.aspectRatioLocked}),className:`flex items-center gap-1 text-[9px] font-semibold transition-colors cursor-pointer ${g.aspectRatioLocked?"text-primary":"text-neutral-400 hover:text-neutral-600"}`,children:[g.aspectRatioLocked?jsxRuntime.jsx(iconsReact.IconLock,{size:11}):jsxRuntime.jsx(iconsReact.IconLockOpen,{size:11}),jsxRuntime.jsx("span",{children:g.aspectRatioLocked?"Locked":"Unlock"})]})]}),jsxRuntime.jsxs("div",{className:"grid grid-cols-2 gap-1.5",children:[jsxRuntime.jsxs("div",{className:"flex items-center gap-1.5 px-2 h-7 rounded-[8px] bg-[#e2e6ed] dark:bg-[#121316] border border-black/[0.03] dark:border-white/[0.03] shadow-[inset_1.5px_1.5px_3px_rgba(166,175,195,0.45),_inset_-1.5px_-1.5px_3px_rgba(255,255,255,0.9)] dark:shadow-[inset_2px_2px_4px_rgba(0,0,0,0.6),_inset_-1px_-1px_2px_rgba(255,255,255,0.03)]",children:[jsxRuntime.jsx("span",{className:"text-[10px] font-bold text-neutral-400",children:"W"}),jsxRuntime.jsx("input",{type:"number",value:Math.round(Math.abs(g.width||0)),onKeyDown:D=>D.stopPropagation(),onChange:D=>{let N=Math.max(20,parseInt(D.target.value,10)||20);if(g.aspectRatioLocked&&g.width&&g.height){let se=Math.abs(g.width)/Math.abs(g.height);ie({width:N,height:Math.round(N/se)});}else ie({width:N});},className:"w-full bg-transparent text-neutral-900 dark:text-neutral-100 outline-none font-mono text-xs"})]}),jsxRuntime.jsxs("div",{className:"flex items-center gap-1.5 px-2 h-7 rounded-[8px] bg-[#e2e6ed] dark:bg-[#121316] border border-black/[0.03] dark:border-white/[0.03] shadow-[inset_1.5px_1.5px_3px_rgba(166,175,195,0.45),_inset_-1.5px_-1.5px_3px_rgba(255,255,255,0.9)] dark:shadow-[inset_2px_2px_4px_rgba(0,0,0,0.6),_inset_-1px_-1px_2px_rgba(255,255,255,0.03)]",children:[jsxRuntime.jsx("span",{className:"text-[10px] font-bold text-neutral-400",children:"H"}),jsxRuntime.jsx("input",{type:"number",value:Math.round(Math.abs(g.height||0)),onKeyDown:D=>D.stopPropagation(),onChange:D=>{let N=Math.max(20,parseInt(D.target.value,10)||20);if(g.aspectRatioLocked&&g.width&&g.height){let se=Math.abs(g.width)/Math.abs(g.height);ie({height:N,width:Math.round(N*se)});}else ie({height:N});},className:"w-full bg-transparent text-neutral-900 dark:text-neutral-100 outline-none font-mono text-xs"})]})]})]})]})})(),he&&jsxRuntime.jsxs("div",{className:"pb-2.5 border-b border-black/[0.05] dark:border-white/[0.05]",children:[jsxRuntime.jsx("div",{className:"text-[10px] font-bold text-neutral-400 dark:text-neutral-500 uppercase tracking-wider mb-1.5",children:"Note Color"}),jsxRuntime.jsx("div",{className:"flex items-center justify-between",children:ra.map(g=>{let D=(E.stickyColor||E.fillColor)===g.bg,N=y?vr(g.bg,true).bg:g.bg;return jsxRuntime.jsx("button",{type:"button",onClick:()=>ie({stickyColor:g.bg,fillColor:g.bg,strokeColor:void 0}),title:g.name,className:`w-7 h-7 rounded-full transition-all duration-150 cursor-pointer ${D?"ring-2 ring-primary ring-offset-2 dark:ring-offset-neutral-900 scale-110 shadow-[-2px_-2px_5px_rgba(255,255,255,0.9),_2px_2px_5px_rgba(0,0,0,0.3)]":"border border-black/10 dark:border-white/10 hover:scale-105 shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.8),_1.5px_1.5px_3px_rgba(0,0,0,0.15)]"}`,style:{backgroundColor:N}},g.name)})})]}),!he&&!Ne&&jsxRuntime.jsxs("div",{className:"space-y-2 pb-2.5 border-b border-black/[0.05] dark:border-white/[0.05]",children:[jsxRuntime.jsx("div",{className:"text-[10px] font-bold text-neutral-400 dark:text-neutral-500 uppercase tracking-wider",children:"Appearance"}),jsxRuntime.jsxs("div",{className:"grid grid-cols-2 gap-2",children:[jsxRuntime.jsxs("button",{type:"button","data-color-trigger":"stroke",onClick:g=>Ke("stroke",g),className:`flex items-center gap-2 p-1.5 rounded-[11px] transition-all cursor-pointer ${z==="stroke"?"bg-[#e4e8ef] dark:bg-[#131417] border border-primary/40 shadow-[inset_2px_2px_4px_rgba(166,175,195,0.55),_inset_-2px_-2px_4px_rgba(255,255,255,1)] dark:shadow-[inset_2px_2px_4px_rgba(0,0,0,0.7),_inset_-1px_-1px_3px_rgba(255,255,255,0.05)]":"bg-[#f0f3f8] dark:bg-[#1c1e24] border border-white/80 dark:border-white/[0.06] shadow-[-2.5px_-2.5px_6px_rgba(255,255,255,0.95),_2.5px_2.5px_6px_rgba(166,175,195,0.4)] dark:shadow-[-2px_-2px_5px_rgba(255,255,255,0.03),_2.5px_2.5px_6px_rgba(0,0,0,0.6)] hover:shadow-[-3.5px_-3.5px_8px_rgba(255,255,255,1),_3.5px_3.5px_8px_rgba(166,175,195,0.5)]"}`,children:[jsxRuntime.jsx("div",{className:"w-5 h-5 rounded-full border border-black/15 dark:border-white/20 shrink-0 shadow-[-1px_-1px_2px_rgba(255,255,255,0.8),_1px_1px_2px_rgba(0,0,0,0.2)]",style:{backgroundColor:vt(E.strokeColor||"#1e1e24",y)}}),jsxRuntime.jsxs("div",{className:"min-w-0 text-left",children:[jsxRuntime.jsx("div",{className:"text-[9.5px] text-neutral-400 dark:text-neutral-500 leading-none",children:"Stroke"}),jsxRuntime.jsx("div",{className:"text-[11px] font-mono font-semibold text-neutral-800 dark:text-neutral-200 truncate",children:E.strokeColor==="transparent"?"None":(E.strokeColor||"#1E1E24").toUpperCase()})]})]}),_e?jsxRuntime.jsxs("button",{type:"button","data-color-trigger":"background",onClick:g=>Ke("background",g),className:`flex items-center gap-2 p-1.5 rounded-[11px] transition-all cursor-pointer ${z==="background"?"bg-[#e4e8ef] dark:bg-[#131417] border border-primary/40 shadow-[inset_2px_2px_4px_rgba(166,175,195,0.55),_inset_-2px_-2px_4px_rgba(255,255,255,1)] dark:shadow-[inset_2px_2px_4px_rgba(0,0,0,0.7),_inset_-1px_-1px_3px_rgba(255,255,255,0.05)]":"bg-[#f0f3f8] dark:bg-[#1c1e24] border border-white/80 dark:border-white/[0.06] shadow-[-2.5px_-2.5px_6px_rgba(255,255,255,0.95),_2.5px_2.5px_6px_rgba(166,175,195,0.4)] dark:shadow-[-2px_-2px_5px_rgba(255,255,255,0.03),_2.5px_2.5px_6px_rgba(0,0,0,0.6)] hover:shadow-[-3.5px_-3.5px_8px_rgba(255,255,255,1),_3.5px_3.5px_8px_rgba(166,175,195,0.5)]"}`,children:[jsxRuntime.jsx("div",{className:`w-5 h-5 rounded-full border border-black/15 dark:border-white/20 shrink-0 relative overflow-hidden shadow-[-1px_-1px_2px_rgba(255,255,255,0.8),_1px_1px_2px_rgba(0,0,0,0.2)] ${E.fillColor==="transparent"||!E.fillColor?"bg-neutral-200 dark:bg-neutral-800":""}`,style:{backgroundColor:E.fillColor&&E.fillColor!=="transparent"?_r(E.fillColor,E.fillStyle||"solid",y):void 0},children:(!E.fillColor||E.fillColor==="transparent")&&jsxRuntime.jsx("div",{className:"absolute inset-0 flex items-center justify-center text-rose-500 font-bold text-xs",children:"/"})}),jsxRuntime.jsxs("div",{className:"min-w-0 text-left",children:[jsxRuntime.jsx("div",{className:"text-[9.5px] text-neutral-400 dark:text-neutral-500 leading-none",children:"Fill"}),jsxRuntime.jsx("div",{className:"text-[11px] font-mono font-semibold text-neutral-800 dark:text-neutral-200 truncate",children:E.fillColor==="transparent"||!E.fillColor?"None":E.fillColor.toUpperCase()})]})]}):jsxRuntime.jsxs("div",{className:"flex items-center gap-2 p-1.5 rounded-[11px] bg-[#e4e8ef]/60 dark:bg-[#131417]/60 border border-white/40 dark:border-white/[0.02] opacity-40",children:[jsxRuntime.jsx("div",{className:"w-5 h-5 rounded-full border border-dashed border-neutral-400 shrink-0"}),jsxRuntime.jsx("div",{className:"text-[10px] text-neutral-400",children:"No Fill"})]})]}),_e&&E.fillColor&&E.fillColor!=="transparent"&&jsxRuntime.jsx("div",{className:"pt-1",children:jsxRuntime.jsx("div",{className:"grid grid-cols-6 gap-1 p-0.5 rounded-[9px] bg-[#e4e8ef] dark:bg-[#121316] border border-white/60 dark:border-white/[0.04] shadow-[inset_1.5px_1.5px_3.5px_rgba(166,175,195,0.45),_inset_-1.5px_-1.5px_3.5px_rgba(255,255,255,0.9)] dark:shadow-[inset_2px_2px_4px_rgba(0,0,0,0.6),_inset_-1px_-1px_2px_rgba(255,255,255,0.03)] h-8",children:oa.map(g=>{let D=(E.fillStyle||"solid")===g.value;return jsxRuntime.jsxs("button",{type:"button",onClick:()=>ie({fillStyle:g.value}),title:g.label,className:`h-full flex items-center justify-center rounded-[6px] transition-all cursor-pointer ${D?"bg-[#f0f3f8] dark:bg-[#22242b] text-primary font-semibold shadow-[-2px_-2px_4px_rgba(255,255,255,1),_2px_2px_4px_rgba(166,175,195,0.55),_0_0_0_1px_rgba(255,255,255,0.8)] dark:shadow-[-2px_-2px_4px_rgba(255,255,255,0.06),_2px_2px_5px_rgba(0,0,0,0.8),_0_0_0_1px_rgba(255,255,255,0.06)]":"text-neutral-400 dark:text-neutral-500 hover:text-neutral-700 dark:hover:text-neutral-200"}`,children:[g.value==="transparent"&&jsxRuntime.jsxs("svg",{width:"14",height:"14",viewBox:"0 0 16 16",fill:"none",children:[jsxRuntime.jsx("rect",{x:"2",y:"2",width:"12",height:"12",rx:"2",stroke:"currentColor",strokeWidth:"1.4",strokeDasharray:"2 2"}),jsxRuntime.jsx("line",{x1:"3",y1:"13",x2:"13",y2:"3",stroke:"currentColor",strokeWidth:"1.2"})]}),g.value==="solid"&&jsxRuntime.jsx("svg",{width:"14",height:"14",viewBox:"0 0 16 16",fill:"none",children:jsxRuntime.jsx("rect",{x:"2",y:"2",width:"12",height:"12",rx:"2",fill:"currentColor",stroke:"currentColor",strokeWidth:"1.2"})}),g.value==="hachure"&&jsxRuntime.jsxs("svg",{width:"14",height:"14",viewBox:"0 0 16 16",fill:"none",children:[jsxRuntime.jsx("rect",{x:"2",y:"2",width:"12",height:"12",rx:"2",stroke:"currentColor",strokeWidth:"1.3"}),jsxRuntime.jsx("line",{x1:"3.5",y1:"3.5",x2:"12.5",y2:"12.5",stroke:"currentColor",strokeWidth:"1.3",strokeLinecap:"round"}),jsxRuntime.jsx("line",{x1:"3.5",y1:"8",x2:"8",y2:"12.5",stroke:"currentColor",strokeWidth:"1.3",strokeLinecap:"round"}),jsxRuntime.jsx("line",{x1:"8",y1:"3.5",x2:"12.5",y2:"8",stroke:"currentColor",strokeWidth:"1.3",strokeLinecap:"round"})]}),g.value==="hachure-right"&&jsxRuntime.jsxs("svg",{width:"14",height:"14",viewBox:"0 0 16 16",fill:"none",children:[jsxRuntime.jsx("rect",{x:"2",y:"2",width:"12",height:"12",rx:"2",stroke:"currentColor",strokeWidth:"1.3"}),jsxRuntime.jsx("line",{x1:"12.5",y1:"3.5",x2:"3.5",y2:"12.5",stroke:"currentColor",strokeWidth:"1.3",strokeLinecap:"round"}),jsxRuntime.jsx("line",{x1:"8",y1:"3.5",x2:"3.5",y2:"8",stroke:"currentColor",strokeWidth:"1.3",strokeLinecap:"round"}),jsxRuntime.jsx("line",{x1:"12.5",y1:"8",x2:"8",y2:"12.5",stroke:"currentColor",strokeWidth:"1.3",strokeLinecap:"round"})]}),g.value==="cross-hatch"&&jsxRuntime.jsxs("svg",{width:"14",height:"14",viewBox:"0 0 16 16",fill:"none",children:[jsxRuntime.jsx("rect",{x:"2",y:"2",width:"12",height:"12",rx:"2",stroke:"currentColor",strokeWidth:"1.3"}),jsxRuntime.jsx("line",{x1:"6",y1:"2.5",x2:"6",y2:"13.5",stroke:"currentColor",strokeWidth:"1.1"}),jsxRuntime.jsx("line",{x1:"10",y1:"2.5",x2:"10",y2:"13.5",stroke:"currentColor",strokeWidth:"1.1"}),jsxRuntime.jsx("line",{x1:"2.5",y1:"6",x2:"13.5",y2:"6",stroke:"currentColor",strokeWidth:"1.1"}),jsxRuntime.jsx("line",{x1:"2.5",y1:"10",x2:"13.5",y2:"10",stroke:"currentColor",strokeWidth:"1.1"})]}),g.value==="dots"&&jsxRuntime.jsxs("svg",{width:"14",height:"14",viewBox:"0 0 16 16",fill:"none",children:[jsxRuntime.jsx("rect",{x:"2",y:"2",width:"12",height:"12",rx:"2",stroke:"currentColor",strokeWidth:"1.3"}),jsxRuntime.jsx("circle",{cx:"5.5",cy:"5.5",r:"1.1",fill:"currentColor"}),jsxRuntime.jsx("circle",{cx:"10.5",cy:"5.5",r:"1.1",fill:"currentColor"}),jsxRuntime.jsx("circle",{cx:"5.5",cy:"10.5",r:"1.1",fill:"currentColor"}),jsxRuntime.jsx("circle",{cx:"10.5",cy:"10.5",r:"1.1",fill:"currentColor"})]})]},g.value)})})})]}),!he&&!ve&&!Ne&&jsxRuntime.jsxs("div",{className:"space-y-2.5 pb-2.5 border-b border-black/[0.05] dark:border-white/[0.05]",children:[jsxRuntime.jsxs("div",{className:"grid grid-cols-2 gap-2",children:[jsxRuntime.jsxs("div",{children:[jsxRuntime.jsx("div",{className:"text-[10px] font-bold text-neutral-400 dark:text-neutral-500 uppercase tracking-wider mb-1",children:"Stroke Width"}),jsxRuntime.jsx("div",{className:"h-8 flex items-center p-0.5 rounded-[9px] bg-[#e4e8ef] dark:bg-[#121316] border border-white/60 dark:border-white/[0.04] shadow-[inset_1.5px_1.5px_3.5px_rgba(166,175,195,0.45),_inset_-1.5px_-1.5px_3.5px_rgba(255,255,255,0.9)] dark:shadow-[inset_2px_2px_4px_rgba(0,0,0,0.6),_inset_-1px_-1px_2px_rgba(255,255,255,0.03)]",children:Bo.map(g=>{let D=(E.strokeWidth||2)===g.value;return jsxRuntime.jsx("button",{type:"button",onClick:()=>ie({strokeWidth:g.value}),title:g.label,className:`h-full flex-1 flex items-center justify-center rounded-[6px] transition-all cursor-pointer ${D?"bg-[#f0f3f8] dark:bg-[#22242b] text-primary shadow-[-2px_-2px_4px_rgba(255,255,255,1),_2px_2px_4px_rgba(166,175,195,0.55),_0_0_0_1px_rgba(255,255,255,0.8)] dark:shadow-[-2px_-2px_4px_rgba(255,255,255,0.06),_2px_2px_5px_rgba(0,0,0,0.8),_0_0_0_1px_rgba(255,255,255,0.06)]":"text-neutral-400 hover:text-neutral-700"}`,children:jsxRuntime.jsx("div",{className:"w-4 rounded-full bg-current",style:{height:`${Math.max(1.8,g.value*1.05)}px`}})},g.value)})})]}),jsxRuntime.jsxs("div",{children:[jsxRuntime.jsx("div",{className:"text-[10px] font-bold text-neutral-400 dark:text-neutral-500 uppercase tracking-wider mb-1",children:"Stroke Style"}),jsxRuntime.jsx("div",{className:"h-8 flex items-center p-0.5 rounded-[9px] bg-[#e4e8ef] dark:bg-[#121316] border border-white/60 dark:border-white/[0.04] shadow-[inset_1.5px_1.5px_3.5px_rgba(166,175,195,0.45),_inset_-1.5px_-1.5px_3.5px_rgba(255,255,255,0.9)] dark:shadow-[inset_2px_2px_4px_rgba(0,0,0,0.6),_inset_-1px_-1px_2px_rgba(255,255,255,0.03)]",children:aa.map(g=>{let D=(E.strokeStyle||"solid")===g.value;return jsxRuntime.jsxs("button",{type:"button",onClick:()=>ie({strokeStyle:g.value}),title:g.label,className:`h-full flex-1 flex items-center justify-center rounded-[6px] transition-all cursor-pointer ${D?"bg-[#f0f3f8] dark:bg-[#22242b] text-primary shadow-[-2px_-2px_4px_rgba(255,255,255,1),_2px_2px_4px_rgba(166,175,195,0.55),_0_0_0_1px_rgba(255,255,255,0.8)] dark:shadow-[-2px_-2px_4px_rgba(255,255,255,0.06),_2px_2px_5px_rgba(0,0,0,0.8),_0_0_0_1px_rgba(255,255,255,0.06)]":"text-neutral-400 hover:text-neutral-700"}`,children:[g.value==="solid"&&jsxRuntime.jsx("svg",{width:"16",height:"4",viewBox:"0 0 16 4",fill:"none",children:jsxRuntime.jsx("line",{x1:"1",y1:"2",x2:"15",y2:"2",stroke:"currentColor",strokeWidth:"2.2",strokeLinecap:"round"})}),g.value==="dashed"&&jsxRuntime.jsx("svg",{width:"16",height:"4",viewBox:"0 0 16 4",fill:"none",children:jsxRuntime.jsx("line",{x1:"1",y1:"2",x2:"15",y2:"2",stroke:"currentColor",strokeWidth:"2.2",strokeDasharray:"3 2",strokeLinecap:"round"})}),g.value==="dotted"&&jsxRuntime.jsx("svg",{width:"16",height:"4",viewBox:"0 0 16 4",fill:"none",children:jsxRuntime.jsx("line",{x1:"1",y1:"2",x2:"15",y2:"2",stroke:"currentColor",strokeWidth:"2.2",strokeDasharray:"1 2.5",strokeLinecap:"round"})})]},g.value)})})]})]}),(!U||!je&&!Ne)&&jsxRuntime.jsxs("div",{children:[jsxRuntime.jsxs("div",{className:"flex items-center justify-between text-[10px] font-bold text-neutral-400 dark:text-neutral-500 uppercase tracking-wider mb-1",children:[jsxRuntime.jsx("span",{children:"Drawing Style"}),jsxRuntime.jsx("span",{className:"text-[9px] font-normal text-neutral-400 lowercase",children:E.roughStyle==="rough"?`rough (${(E.roughness??1.8)<=1.2?"subtle":(E.roughness??1.8)<=2.6?"medium":"sloppy"})`:"clean"})]}),jsxRuntime.jsxs("div",{className:"flex items-center gap-2",children:[jsxRuntime.jsxs("div",{className:"flex-[0.9] grid grid-cols-2 gap-1 p-0.5 rounded-[9px] bg-[#e4e8ef] dark:bg-[#121316] border border-white/60 dark:border-white/[0.04] shadow-[inset_1.5px_1.5px_3.5px_rgba(166,175,195,0.45),_inset_-1.5px_-1.5px_3.5px_rgba(255,255,255,0.9)] dark:shadow-[inset_2px_2px_4px_rgba(0,0,0,0.6),_inset_-1px_-1px_2px_rgba(255,255,255,0.03)]",children:[jsxRuntime.jsx("button",{type:"button",onClick:()=>ie({roughStyle:"clean",roughness:0}),className:`h-7 text-[11px] font-medium rounded-[6px] flex items-center justify-center transition-all cursor-pointer ${(E.roughStyle||"clean")==="clean"?"bg-[#f0f3f8] dark:bg-[#22242b] text-neutral-900 dark:text-neutral-100 font-bold shadow-[-2px_-2px_4px_rgba(255,255,255,1),_2px_2px_4px_rgba(166,175,195,0.55),_0_0_0_1px_rgba(255,255,255,0.8)] dark:shadow-[-2px_-2px_4px_rgba(255,255,255,0.06),_2px_2px_5px_rgba(0,0,0,0.8),_0_0_0_1px_rgba(255,255,255,0.06)]":"text-neutral-500 dark:text-neutral-400 hover:text-neutral-800"}`,title:"Clean vector style",children:"Clean"}),jsxRuntime.jsx("button",{type:"button",onClick:()=>ie({roughStyle:"rough",roughness:E.roughness&&E.roughness>0?E.roughness:1.8}),className:`h-7 text-[11px] font-medium rounded-[6px] flex items-center justify-center transition-all cursor-pointer ${E.roughStyle==="rough"?"bg-[#f0f3f8] dark:bg-[#22242b] text-neutral-900 dark:text-neutral-100 font-bold shadow-[-2px_-2px_4px_rgba(255,255,255,1),_2px_2px_4px_rgba(166,175,195,0.55),_0_0_0_1px_rgba(255,255,255,0.8)] dark:shadow-[-2px_-2px_4px_rgba(255,255,255,0.06),_2px_2px_5px_rgba(0,0,0,0.8),_0_0_0_1px_rgba(255,255,255,0.06)]":"text-neutral-500 dark:text-neutral-400 hover:text-neutral-800"}`,title:"Hand-drawn rough style",children:"Rough"})]}),jsxRuntime.jsxs("div",{className:"flex-[1.25] grid grid-cols-3 gap-1 p-0.5 rounded-[9px] bg-[#e4e8ef] dark:bg-[#121316] border border-white/60 dark:border-white/[0.04] shadow-[inset_1.5px_1.5px_3.5px_rgba(166,175,195,0.45),_inset_-1.5px_-1.5px_3.5px_rgba(255,255,255,0.9)] dark:shadow-[inset_2px_2px_4px_rgba(0,0,0,0.6),_inset_-1px_-1px_2px_rgba(255,255,255,0.03)]",children:[jsxRuntime.jsx("button",{type:"button",onClick:()=>ie({roughStyle:"rough",roughness:.9}),className:`h-7 text-[10.5px] font-medium rounded-[6px] flex items-center justify-center transition-all cursor-pointer ${E.roughStyle==="rough"&&(E.roughness??1.8)<=1.2?"bg-[#f0f3f8] dark:bg-[#22242b] text-neutral-900 dark:text-neutral-100 font-bold shadow-[-2px_-2px_4px_rgba(255,255,255,1),_2px_2px_4px_rgba(166,175,195,0.55),_0_0_0_1px_rgba(255,255,255,0.8)] dark:shadow-[-2px_-2px_4px_rgba(255,255,255,0.06),_2px_2px_5px_rgba(0,0,0,0.8),_0_0_0_1px_rgba(255,255,255,0.06)]":"text-neutral-500 dark:text-neutral-400 hover:text-neutral-800"}`,title:"Subtle roughness",children:"Subtle"}),jsxRuntime.jsx("button",{type:"button",onClick:()=>ie({roughStyle:"rough",roughness:2}),className:`h-7 text-[10.5px] font-medium rounded-[6px] flex items-center justify-center transition-all cursor-pointer ${E.roughStyle==="rough"&&(E.roughness??1.8)>1.2&&(E.roughness??1.8)<=2.6?"bg-[#f0f3f8] dark:bg-[#22242b] text-neutral-900 dark:text-neutral-100 font-bold shadow-[-2px_-2px_4px_rgba(255,255,255,1),_2px_2px_4px_rgba(166,175,195,0.55),_0_0_0_1px_rgba(255,255,255,0.8)] dark:shadow-[-2px_-2px_4px_rgba(255,255,255,0.06),_2px_2px_5px_rgba(0,0,0,0.8),_0_0_0_1px_rgba(255,255,255,0.06)]":"text-neutral-500 dark:text-neutral-400 hover:text-neutral-800"}`,title:"Medium roughness",children:"Med"}),jsxRuntime.jsx("button",{type:"button",onClick:()=>ie({roughStyle:"rough",roughness:3.5}),className:`h-7 text-[10.5px] font-medium rounded-[6px] flex items-center justify-center transition-all cursor-pointer ${E.roughStyle==="rough"&&(E.roughness??1.8)>2.6?"bg-[#f0f3f8] dark:bg-[#22242b] text-neutral-900 dark:text-neutral-100 font-bold shadow-[-2px_-2px_4px_rgba(255,255,255,1),_2px_2px_4px_rgba(166,175,195,0.55),_0_0_0_1px_rgba(255,255,255,0.8)] dark:shadow-[-2px_-2px_4px_rgba(255,255,255,0.06),_2px_2px_5px_rgba(0,0,0,0.8),_0_0_0_1px_rgba(255,255,255,0.06)]":"text-neutral-500 dark:text-neutral-400 hover:text-neutral-800"}`,title:"Sloppy / extra expressive roughness",children:"Sloppy"})]})]})]}),(!U||E.type==="rectangle")&&jsxRuntime.jsxs("div",{children:[jsxRuntime.jsx("div",{className:"text-[10px] font-bold text-neutral-400 dark:text-neutral-500 uppercase tracking-wider mb-1",children:"Corner Edges"}),jsxRuntime.jsxs("div",{className:"grid grid-cols-2 gap-1 p-0.5 rounded-[9px] bg-[#e4e8ef] dark:bg-[#121316] border border-white/60 dark:border-white/[0.04] shadow-[inset_1.5px_1.5px_3.5px_rgba(166,175,195,0.45),_inset_-1.5px_-1.5px_3.5px_rgba(255,255,255,0.9)] dark:shadow-[inset_2px_2px_4px_rgba(0,0,0,0.6),_inset_-1px_-1px_2px_rgba(255,255,255,0.03)]",children:[jsxRuntime.jsxs("button",{type:"button",onClick:()=>ie({edgeStyle:"sharp"}),className:`py-1 text-[11px] font-medium rounded-[6px] flex items-center justify-center gap-1.5 transition-all cursor-pointer ${E.edgeStyle==="sharp"?"bg-[#f0f3f8] dark:bg-[#22242b] text-neutral-900 dark:text-neutral-100 font-bold shadow-[-2px_-2px_4px_rgba(255,255,255,1),_2px_2px_4px_rgba(166,175,195,0.55),_0_0_0_1px_rgba(255,255,255,0.8)] dark:shadow-[-2px_-2px_4px_rgba(255,255,255,0.06),_2px_2px_5px_rgba(0,0,0,0.8),_0_0_0_1px_rgba(255,255,255,0.06)]":"text-neutral-500 dark:text-neutral-400 hover:text-neutral-800"}`,children:[jsxRuntime.jsx("svg",{width:"12",height:"12",viewBox:"0 0 16 16",fill:"none",children:jsxRuntime.jsx("path",{d:"M 3.5 12.5 V 3.5 H 12.5",stroke:"currentColor",strokeWidth:"1.8",strokeLinecap:"square"})}),jsxRuntime.jsx("span",{children:"Sharp"})]}),jsxRuntime.jsxs("button",{type:"button",onClick:()=>ie({edgeStyle:"round"}),className:`py-1 text-[11px] font-medium rounded-[6px] flex items-center justify-center gap-1.5 transition-all cursor-pointer ${(E.edgeStyle||"round")==="round"?"bg-[#f0f3f8] dark:bg-[#22242b] text-neutral-900 dark:text-neutral-100 font-bold shadow-[-2px_-2px_4px_rgba(255,255,255,1),_2px_2px_4px_rgba(166,175,195,0.55),_0_0_0_1px_rgba(255,255,255,0.8)] dark:shadow-[-2px_-2px_4px_rgba(255,255,255,0.06),_2px_2px_5px_rgba(0,0,0,0.8),_0_0_0_1px_rgba(255,255,255,0.06)]":"text-neutral-500 dark:text-neutral-400 hover:text-neutral-800"}`,children:[jsxRuntime.jsx("svg",{width:"12",height:"12",viewBox:"0 0 16 16",fill:"none",children:jsxRuntime.jsx("path",{d:"M 3.5 12.5 V 7.5 C 3.5 5.2 5.2 3.5 7.5 3.5 H 12.5",stroke:"currentColor",strokeWidth:"1.8",strokeLinecap:"round"})}),jsxRuntime.jsx("span",{children:"Round"})]})]})]})]}),(!U||ue)&&jsxRuntime.jsxs("div",{className:"space-y-2 pb-2.5 border-b border-black/[0.05] dark:border-white/[0.05]",children:[jsxRuntime.jsx("div",{className:"text-[10px] font-bold text-neutral-400 dark:text-neutral-500 uppercase tracking-wider",children:"Connectors"}),jsxRuntime.jsxs("div",{className:"flex items-center gap-1.5",children:[jsxRuntime.jsx("button",{type:"button","data-arrowhead-trigger":"start",onClick:g=>X("start",g),title:"Start Arrowhead",className:`flex-1 h-7 rounded-[8px] flex items-center justify-center transition-all cursor-pointer ${v==="start"?"bg-[#e4e8ef] dark:bg-[#131417] text-primary border border-primary/40 shadow-[inset_2px_2px_4px_rgba(166,175,195,0.55),_inset_-2px_-2px_4px_rgba(255,255,255,1)] dark:shadow-[inset_2px_2px_4px_rgba(0,0,0,0.7),_inset_-1px_-1px_3px_rgba(255,255,255,0.05)]":"bg-[#f0f3f8] dark:bg-[#1c1e24] border border-white/80 dark:border-white/[0.06] shadow-[-2px_-2px_4px_rgba(255,255,255,0.9),_2px_2px_4px_rgba(166,175,195,0.35)] dark:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.03),_2px_2px_5px_rgba(0,0,0,0.6)] hover:shadow-[-3px_-3px_6px_rgba(255,255,255,1),_3px_3px_6px_rgba(166,175,195,0.45)]"}`,children:jsxRuntime.jsx(Kr,{value:ar(E.startArrowhead,"none"),side:"start",className:"w-4 h-3"})}),jsxRuntime.jsxs("div",{className:"flex items-center p-0.5 rounded-[9px] bg-[#e4e8ef] dark:bg-[#121316] border border-white/60 dark:border-white/[0.04] shadow-[inset_1.5px_1.5px_3.5px_rgba(166,175,195,0.45),_inset_-1.5px_-1.5px_3.5px_rgba(255,255,255,0.9)] dark:shadow-[inset_2px_2px_4px_rgba(0,0,0,0.6),_inset_-1px_-1px_2px_rgba(255,255,255,0.03)]",children:[jsxRuntime.jsx("button",{type:"button",onClick:()=>ie({arrowType:"straight"}),title:"Straight",className:`w-6 h-6 flex items-center justify-center rounded-[6px] transition-all cursor-pointer ${(E.arrowType||"straight")==="straight"?"bg-[#f0f3f8] dark:bg-[#22242b] text-primary shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,1),_1.5px_1.5px_3px_rgba(166,175,195,0.55)] dark:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.06),_1.5px_1.5px_4px_rgba(0,0,0,0.8)]":"text-neutral-400 hover:text-neutral-700"}`,children:jsxRuntime.jsx("svg",{width:"12",height:"12",viewBox:"0 0 16 16",fill:"none",children:jsxRuntime.jsx("path",{d:"M 4 12 L 12 4 M 7 4 H 12 V 9",stroke:"currentColor",strokeWidth:"1.6",strokeLinecap:"round",strokeLinejoin:"round"})})}),jsxRuntime.jsx("button",{type:"button",onClick:()=>ie({arrowType:"curved"}),title:"Curved",className:`w-6 h-6 flex items-center justify-center rounded-[6px] transition-all cursor-pointer ${E.arrowType==="curved"?"bg-[#f0f3f8] dark:bg-[#22242b] text-primary shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,1),_1.5px_1.5px_3px_rgba(166,175,195,0.55)] dark:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.06),_1.5px_1.5px_4px_rgba(0,0,0,0.8)]":"text-neutral-400 hover:text-neutral-700"}`,children:jsxRuntime.jsxs("svg",{width:"13",height:"13",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[jsxRuntime.jsx("path",{d:"M16,12L20,9L16,6"}),jsxRuntime.jsx("path",{d:"M6 20c0 -6.075 4.925 -11 11 -11h3"})]})}),jsxRuntime.jsx("button",{type:"button",onClick:()=>ie({arrowType:"elbow"}),title:"Elbow",className:`w-6 h-6 flex items-center justify-center rounded-[6px] transition-all cursor-pointer ${E.arrowType==="elbow"?"bg-[#f0f3f8] dark:bg-[#22242b] text-primary shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,1),_1.5px_1.5px_3px_rgba(166,175,195,0.55)] dark:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.06),_1.5px_1.5px_4px_rgba(0,0,0,0.8)]":"text-neutral-400 hover:text-neutral-700"}`,children:jsxRuntime.jsxs("svg",{width:"13",height:"13",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[jsxRuntime.jsx("path",{d:"M4,19L10,19C11.097,19 12,18.097 12,17L12,9C12,7.903 12.903,7 14,7L21,7"}),jsxRuntime.jsx("path",{d:"M18 4l3 3l-3 3"})]})})]}),jsxRuntime.jsx("button",{type:"button","data-arrowhead-trigger":"end",onClick:g=>X("end",g),title:"End Arrowhead",className:`flex-1 h-7 rounded-[8px] flex items-center justify-center transition-all cursor-pointer ${v==="end"?"bg-[#e4e8ef] dark:bg-[#131417] text-primary border border-primary/40 shadow-[inset_2px_2px_4px_rgba(166,175,195,0.55),_inset_-2px_-2px_4px_rgba(255,255,255,1)] dark:shadow-[inset_2px_2px_4px_rgba(0,0,0,0.7),_inset_-1px_-1px_3px_rgba(255,255,255,0.05)]":"bg-[#f0f3f8] dark:bg-[#1c1e24] border border-white/80 dark:border-white/[0.06] shadow-[-2px_-2px_4px_rgba(255,255,255,0.9),_2px_2px_4px_rgba(166,175,195,0.35)] dark:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.03),_2px_2px_5px_rgba(0,0,0,0.6)] hover:shadow-[-3px_-3px_6px_rgba(255,255,255,1),_3px_3px_6px_rgba(166,175,195,0.45)]"}`,children:jsxRuntime.jsx(Kr,{value:ar(E.endArrowhead,E.type==="arrow"?"arrow":"none"),side:"end",className:"w-4 h-3"})})]})]}),(!U||Pe||!!E.text)&&jsxRuntime.jsxs("div",{className:"space-y-2.5 pb-2.5 border-b border-black/[0.05] dark:border-white/[0.05]",children:[jsxRuntime.jsx("div",{className:"text-[10px] font-bold text-neutral-400 dark:text-neutral-500 uppercase tracking-wider",children:"Typography"}),jsxRuntime.jsx("div",{className:"grid grid-cols-5 gap-1 p-0.5 rounded-[9px] bg-[#e4e8ef] dark:bg-[#121316] border border-white/60 dark:border-white/[0.04] shadow-[inset_1.5px_1.5px_3.5px_rgba(166,175,195,0.45),_inset_-1.5px_-1.5px_3.5px_rgba(255,255,255,0.9)] dark:shadow-[inset_2px_2px_4px_rgba(0,0,0,0.6),_inset_-1px_-1px_2px_rgba(255,255,255,0.03)] h-8 items-center",children:hr.map(g=>{let N=qt(E.fontFamily).value===g.value;return jsxRuntime.jsx("button",{type:"button",onClick:()=>{ie({fontFamily:g.value}),typeof window<"u"&&(window.dispatchEvent(new CustomEvent("sketch-redraw-canvas")),document.fonts&&document.fonts.load(`400 16px ${g.cssFont}`).then(()=>{window.dispatchEvent(new CustomEvent("sketch-redraw-canvas"));}));},title:g.label,"aria-label":g.label,className:`h-full flex items-center justify-center rounded-[6px] transition-all cursor-pointer ${N?"bg-[#f0f3f8] dark:bg-[#22242b] text-primary font-bold shadow-[-2px_-2px_4px_rgba(255,255,255,1),_2px_2px_4px_rgba(166,175,195,0.55),_0_0_0_1px_rgba(255,255,255,0.8)] dark:shadow-[-2px_-2px_4px_rgba(255,255,255,0.06),_2px_2px_5px_rgba(0,0,0,0.8),_0_0_0_1px_rgba(255,255,255,0.06)]":"text-neutral-500 hover:text-neutral-900 dark:hover:text-neutral-100"}`,children:jsxRuntime.jsx("span",{className:"text-xs leading-none",style:{fontFamily:g.cssFont},children:g.value==="fuzzy"||g.value==="edusa"?"Aa":g.value==="comic"||g.value==="handlee"?"Abc":g.value==="patrick"?"ABC":g.value==="sans"?"Ag":"{ }"})},g.value)})}),jsxRuntime.jsxs("div",{className:"grid grid-cols-2 gap-2",children:[jsxRuntime.jsx("div",{className:"h-8 flex items-center p-0.5 rounded-[9px] bg-[#e4e8ef] dark:bg-[#121316] border border-white/60 dark:border-white/[0.04] shadow-[inset_1.5px_1.5px_3.5px_rgba(166,175,195,0.45),_inset_-1.5px_-1.5px_3.5px_rgba(255,255,255,0.9)] dark:shadow-[inset_2px_2px_4px_rgba(0,0,0,0.6),_inset_-1px_-1px_2px_rgba(255,255,255,0.03)]",children:ia.map(g=>{let D=(E.fontSize||22)===g.value;return jsxRuntime.jsx("button",{type:"button",onClick:()=>ie({fontSize:g.value}),title:`${g.label} (${g.value}px)`,className:`h-full flex-1 text-[10.5px] font-medium rounded-[6px] flex items-center justify-center transition-all cursor-pointer ${D?"bg-[#f0f3f8] dark:bg-[#22242b] text-primary dark:text-foreground font-bold shadow-[-2px_-2px_4px_rgba(255,255,255,1),_2px_2px_4px_rgba(166,175,195,0.55)] dark:shadow-[-2px_-2px_4px_rgba(255,255,255,0.06),_2px_2px_5px_rgba(0,0,0,0.8)]":"text-neutral-400 hover:text-neutral-700"}`,children:g.label},g.value)})}),jsxRuntime.jsx("div",{className:"h-8 flex items-center p-0.5 rounded-[9px] bg-[#e4e8ef] dark:bg-[#121316] border border-white/60 dark:border-white/[0.04] shadow-[inset_1.5px_1.5px_3.5px_rgba(166,175,195,0.45),_inset_-1.5px_-1.5px_3.5px_rgba(255,255,255,0.9)] dark:shadow-[inset_2px_2px_4px_rgba(0,0,0,0.6),_inset_-1px_-1px_2px_rgba(255,255,255,0.03)]",children:["left","center","right"].map(g=>{let D=(E.textAlign||(E.type==="text"?"left":"center"))===g;return jsxRuntime.jsxs("button",{type:"button",onClick:()=>ie({textAlign:g}),title:`Align ${g}`,className:`h-full flex-1 flex items-center justify-center rounded-[6px] transition-all cursor-pointer ${D?"bg-[#f0f3f8] dark:bg-[#22242b] text-primary dark:text-foreground shadow-[-2px_-2px_4px_rgba(255,255,255,1),_2px_2px_4px_rgba(166,175,195,0.55)] dark:shadow-[-2px_-2px_4px_rgba(255,255,255,0.06),_2px_2px_5px_rgba(0,0,0,0.8)]":"text-neutral-400 hover:text-neutral-700"}`,children:[g==="left"&&jsxRuntime.jsx(iconsReact.IconAlignLeft,{size:13}),g==="center"&&jsxRuntime.jsx(iconsReact.IconAlignCenter,{size:13}),g==="right"&&jsxRuntime.jsx(iconsReact.IconAlignRight,{size:13})]},g)})})]})]}),jsxRuntime.jsxs("div",{className:"space-y-2.5 pb-2.5 border-b border-black/[0.05] dark:border-white/[0.05]",children:[jsxRuntime.jsxs("div",{children:[jsxRuntime.jsxs("div",{className:"flex items-center justify-between text-[10px] font-bold text-neutral-400 dark:text-neutral-500 uppercase tracking-wider mb-1",children:[jsxRuntime.jsx("span",{children:"Opacity"}),jsxRuntime.jsxs("span",{className:"font-mono text-neutral-600 dark:text-neutral-300",children:[Math.round((E.opacity??1)*100),"%"]})]}),jsxRuntime.jsx("input",{type:"range",min:"0.1",max:"1",step:"0.05",value:E.opacity??1,onChange:g=>ie({opacity:parseFloat(g.target.value)}),className:"w-full h-2 bg-[#e2e6ed] dark:bg-[#121316] rounded-lg appearance-none cursor-pointer accent-primary shadow-[inset_1px_1px_2px_rgba(0,0,0,0.2)]"})]}),U&&jsxRuntime.jsxs("div",{children:[jsxRuntime.jsx("div",{className:"text-[10px] font-bold text-neutral-400 dark:text-neutral-500 uppercase tracking-wider mb-1",children:"Layer"}),jsxRuntime.jsxs("div",{className:"grid grid-cols-4 gap-1 p-0.5 rounded-[9px] bg-[#e4e8ef] dark:bg-[#121316] border border-white/60 dark:border-white/[0.04] shadow-[inset_1.5px_1.5px_3.5px_rgba(166,175,195,0.45),_inset_-1.5px_-1.5px_3.5px_rgba(255,255,255,0.9)] dark:shadow-[inset_2px_2px_4px_rgba(0,0,0,0.6),_inset_-1px_-1px_2px_rgba(255,255,255,0.03)] h-8 items-center",children:[jsxRuntime.jsx("button",{type:"button",onClick:n,title:"Bring to Front",className:"h-full flex items-center justify-center rounded-[6px] text-neutral-600 dark:text-neutral-400 hover:text-neutral-900 dark:hover:text-white hover:bg-[#f0f3f8] dark:hover:bg-[#22242b] hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.9),_1.5px_1.5px_3px_rgba(166,175,195,0.4)] dark:hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.04),_1.5px_1.5px_4px_rgba(0,0,0,0.6)] transition-all cursor-pointer",children:jsxRuntime.jsxs("svg",{width:"15",height:"15",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.6",strokeLinecap:"round",strokeLinejoin:"round",children:[jsxRuntime.jsx("path",{d:"M12 10l0 10"}),jsxRuntime.jsx("path",{d:"M12 10l4 4"}),jsxRuntime.jsx("path",{d:"M12 10l-4 4"}),jsxRuntime.jsx("path",{d:"M4 4l16 0"})]})}),i&&jsxRuntime.jsx("button",{type:"button",onClick:i,title:"Bring Forward",className:"h-full flex items-center justify-center rounded-[6px] text-neutral-600 dark:text-neutral-400 hover:text-neutral-900 dark:hover:text-white hover:bg-[#f0f3f8] dark:hover:bg-[#22242b] hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.9),_1.5px_1.5px_3px_rgba(166,175,195,0.4)] dark:hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.04),_1.5px_1.5px_4px_rgba(0,0,0,0.6)] transition-all cursor-pointer",children:jsxRuntime.jsxs("svg",{width:"15",height:"15",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.6",strokeLinecap:"round",strokeLinejoin:"round",children:[jsxRuntime.jsx("path",{d:"M12 5l0 14"}),jsxRuntime.jsx("path",{d:"M16 9l-4 -4"}),jsxRuntime.jsx("path",{d:"M8 9l4 -4"})]})}),d&&jsxRuntime.jsx("button",{type:"button",onClick:d,title:"Send Backward",className:"h-full flex items-center justify-center rounded-[6px] text-neutral-600 dark:text-neutral-400 hover:text-neutral-900 dark:hover:text-white hover:bg-[#f0f3f8] dark:hover:bg-[#22242b] hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.9),_1.5px_1.5px_3px_rgba(166,175,195,0.4)] dark:hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.04),_1.5px_1.5px_4px_rgba(0,0,0,0.6)] transition-all cursor-pointer",children:jsxRuntime.jsxs("svg",{width:"15",height:"15",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.6",strokeLinecap:"round",strokeLinejoin:"round",style:{transform:"rotate(180deg)"},children:[jsxRuntime.jsx("path",{d:"M12 5l0 14"}),jsxRuntime.jsx("path",{d:"M16 9l-4 -4"}),jsxRuntime.jsx("path",{d:"M8 9l4 -4"})]})}),jsxRuntime.jsx("button",{type:"button",onClick:u,title:"Send to Back",className:"h-full flex items-center justify-center rounded-[6px] text-neutral-600 dark:text-neutral-400 hover:text-neutral-900 dark:hover:text-white hover:bg-[#f0f3f8] dark:hover:bg-[#22242b] hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.9),_1.5px_1.5px_3px_rgba(166,175,195,0.4)] dark:hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.04),_1.5px_1.5px_4px_rgba(0,0,0,0.6)] transition-all cursor-pointer",children:jsxRuntime.jsxs("svg",{width:"15",height:"15",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.6",strokeLinecap:"round",strokeLinejoin:"round",style:{transform:"rotate(180deg)"},children:[jsxRuntime.jsx("path",{d:"M12 10l0 10"}),jsxRuntime.jsx("path",{d:"M12 10l4 4"}),jsxRuntime.jsx("path",{d:"M12 10l-4 4"}),jsxRuntime.jsx("path",{d:"M4 4l16 0"})]})})]})]})]}),K&&jsxRuntime.jsxs("div",{className:"space-y-2 pb-2.5 border-b border-black/[0.05] dark:border-white/[0.05]",children:[jsxRuntime.jsx("div",{className:"text-[10px] font-bold text-neutral-400 dark:text-neutral-500 uppercase tracking-wider",children:"Align & Distribute"}),l&&jsxRuntime.jsxs("div",{className:"grid grid-cols-6 gap-1 p-0.5 rounded-[9px] bg-[#e4e8ef] dark:bg-[#121316] border border-white/60 dark:border-white/[0.04] shadow-[inset_1.5px_1.5px_3.5px_rgba(166,175,195,0.45),_inset_-1.5px_-1.5px_3.5px_rgba(255,255,255,0.9)] dark:shadow-[inset_2px_2px_4px_rgba(0,0,0,0.6),_inset_-1px_-1px_2px_rgba(255,255,255,0.03)]",children:[jsxRuntime.jsx("button",{type:"button",onClick:()=>l("left"),title:"Align Left",className:"py-1 flex items-center justify-center rounded-[6px] text-neutral-600 dark:text-neutral-400 hover:bg-[#f0f3f8] dark:hover:bg-[#22242b] hover:text-primary dark:hover:text-blue-200 hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.9),_1.5px_1.5px_3px_rgba(166,175,195,0.4)] dark:hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.04),_1.5px_1.5px_3px_rgba(0,0,0,0.6)] transition-all cursor-pointer",children:jsxRuntime.jsxs("svg",{width:"13",height:"13",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[jsxRuntime.jsx("line",{x1:"4",y1:"2",x2:"4",y2:"22"}),jsxRuntime.jsx("rect",{x:"8",y:"5",width:"12",height:"5",rx:"1",fill:"currentColor",fillOpacity:"0.2"}),jsxRuntime.jsx("rect",{x:"8",y:"14",width:"8",height:"5",rx:"1",fill:"currentColor",fillOpacity:"0.2"})]})}),jsxRuntime.jsx("button",{type:"button",onClick:()=>l("center"),title:"Align Center H",className:"py-1 flex items-center justify-center rounded-[6px] text-neutral-600 dark:text-neutral-400 hover:bg-[#f0f3f8] dark:hover:bg-[#22242b] hover:text-primary dark:hover:text-blue-200 hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.9),_1.5px_1.5px_3px_rgba(166,175,195,0.4)] dark:hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.04),_1.5px_1.5px_3px_rgba(0,0,0,0.6)] transition-all cursor-pointer",children:jsxRuntime.jsxs("svg",{width:"13",height:"13",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[jsxRuntime.jsx("line",{x1:"12",y1:"2",x2:"12",y2:"22"}),jsxRuntime.jsx("rect",{x:"5",y:"5",width:"14",height:"5",rx:"1",fill:"currentColor",fillOpacity:"0.2"}),jsxRuntime.jsx("rect",{x:"7",y:"14",width:"10",height:"5",rx:"1",fill:"currentColor",fillOpacity:"0.2"})]})}),jsxRuntime.jsx("button",{type:"button",onClick:()=>l("right"),title:"Align Right",className:"py-1 flex items-center justify-center rounded-[6px] text-neutral-600 dark:text-neutral-400 hover:bg-[#f0f3f8] dark:hover:bg-[#22242b] hover:text-primary dark:hover:text-blue-200 hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.9),_1.5px_1.5px_3px_rgba(166,175,195,0.4)] dark:hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.04),_1.5px_1.5px_3px_rgba(0,0,0,0.6)] transition-all cursor-pointer",children:jsxRuntime.jsxs("svg",{width:"13",height:"13",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[jsxRuntime.jsx("line",{x1:"20",y1:"2",x2:"20",y2:"22"}),jsxRuntime.jsx("rect",{x:"2",y:"5",width:"14",height:"5",rx:"1",fill:"currentColor",fillOpacity:"0.2"}),jsxRuntime.jsx("rect",{x:"6",y:"14",width:"10",height:"5",rx:"1",fill:"currentColor",fillOpacity:"0.2"})]})}),jsxRuntime.jsx("button",{type:"button",onClick:()=>l("top"),title:"Align Top",className:"py-1 flex items-center justify-center rounded-[6px] text-neutral-600 dark:text-neutral-400 hover:bg-[#f0f3f8] dark:hover:bg-[#22242b] hover:text-primary dark:hover:text-blue-200 hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.9),_1.5px_1.5px_3px_rgba(166,175,195,0.4)] dark:hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.04),_1.5px_1.5px_3px_rgba(0,0,0,0.6)] transition-all cursor-pointer",children:jsxRuntime.jsxs("svg",{width:"13",height:"13",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[jsxRuntime.jsx("line",{x1:"2",y1:"4",x2:"22",y2:"4"}),jsxRuntime.jsx("rect",{x:"5",y:"8",width:"5",height:"12",rx:"1",fill:"currentColor",fillOpacity:"0.2"}),jsxRuntime.jsx("rect",{x:"14",y:"8",width:"5",height:"8",rx:"1",fill:"currentColor",fillOpacity:"0.2"})]})}),jsxRuntime.jsx("button",{type:"button",onClick:()=>l("middle"),title:"Align Middle V",className:"py-1 flex items-center justify-center rounded-[6px] text-neutral-600 dark:text-neutral-400 hover:bg-[#f0f3f8] dark:hover:bg-[#22242b] hover:text-primary dark:hover:text-blue-200 hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.9),_1.5px_1.5px_3px_rgba(166,175,195,0.4)] dark:hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.04),_1.5px_1.5px_3px_rgba(0,0,0,0.6)] transition-all cursor-pointer",children:jsxRuntime.jsxs("svg",{width:"13",height:"13",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[jsxRuntime.jsx("line",{x1:"2",y1:"12",x2:"22",y2:"12"}),jsxRuntime.jsx("rect",{x:"5",y:"5",width:"5",height:"14",rx:"1",fill:"currentColor",fillOpacity:"0.2"}),jsxRuntime.jsx("rect",{x:"14",y:"7",width:"5",height:"10",rx:"1",fill:"currentColor",fillOpacity:"0.2"})]})}),jsxRuntime.jsx("button",{type:"button",onClick:()=>l("bottom"),title:"Align Bottom",className:"py-1 flex items-center justify-center rounded-[6px] text-neutral-600 dark:text-neutral-400 hover:bg-[#f0f3f8] dark:hover:bg-[#22242b] hover:text-primary dark:hover:text-blue-200 hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.9),_1.5px_1.5px_3px_rgba(166,175,195,0.4)] dark:hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.04),_1.5px_1.5px_3px_rgba(0,0,0,0.6)] transition-all cursor-pointer",children:jsxRuntime.jsxs("svg",{width:"13",height:"13",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[jsxRuntime.jsx("line",{x1:"20",y1:"2",x2:"20",y2:"22"}),jsxRuntime.jsx("rect",{x:"5",y:"4",width:"5",height:"12",rx:"1",fill:"currentColor",fillOpacity:"0.2"}),jsxRuntime.jsx("rect",{x:"14",y:"8",width:"5",height:"8",rx:"1",fill:"currentColor",fillOpacity:"0.2"})]})})]}),jsxRuntime.jsxs("div",{className:"flex items-center gap-1.5",children:[s&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("button",{type:"button",onClick:()=>s("horizontal"),className:"flex-1 py-1 rounded-[7px] bg-[#f0f3f8] dark:bg-[#1c1e24] border border-white/80 dark:border-white/[0.06] shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.9),_1.5px_1.5px_3px_rgba(166,175,195,0.35)] dark:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.03),_1.5px_1.5px_4px_rgba(0,0,0,0.6)] text-[10.5px] font-medium text-neutral-600 dark:text-neutral-300 hover:text-primary dark:hover:text-blue-200 transition-all cursor-pointer",children:"Distribute H"}),jsxRuntime.jsx("button",{type:"button",onClick:()=>s("vertical"),className:"flex-1 py-1 rounded-[7px] bg-[#f0f3f8] dark:bg-[#1c1e24] border border-white/80 dark:border-white/[0.06] shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.9),_1.5px_1.5px_3px_rgba(166,175,195,0.35)] dark:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.03),_1.5px_1.5px_4px_rgba(0,0,0,0.6)] text-[10.5px] font-medium text-neutral-600 dark:text-neutral-300 hover:text-primary dark:hover:text-blue-200 transition-all cursor-pointer",children:"Distribute V"})]}),p&&jsxRuntime.jsx("button",{type:"button",onClick:p,className:"px-2.5 py-1 rounded-[7px] bg-[#f0f3f8] dark:bg-[#1c1e24] border border-primary/30 text-primary text-[10.5px] font-bold shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.9),_1.5px_1.5px_3px_rgba(166,175,195,0.35)] dark:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.03),_1.5px_1.5px_4px_rgba(0,0,0,0.6)] hover:bg-primary hover:text-white transition-all cursor-pointer",children:"Group"}),e.some(g=>g.groupIds&&g.groupIds.length>0)&&c&&jsxRuntime.jsx("button",{type:"button",onClick:c,className:"px-2.5 py-1 rounded-[7px] bg-[#f0f3f8] dark:bg-[#1c1e24] border border-white/80 dark:border-white/[0.06] shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.9),_1.5px_1.5px_3px_rgba(166,175,195,0.35)] dark:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.03),_1.5px_1.5px_4px_rgba(0,0,0,0.6)] text-neutral-700 dark:text-neutral-300 text-[10.5px] font-medium transition-all cursor-pointer",children:"Ungroup"})]})]}),!U&&b&&jsxRuntime.jsxs("div",{className:"space-y-2",children:[jsxRuntime.jsx("div",{className:"text-[10px] font-bold text-neutral-400 dark:text-neutral-500 uppercase tracking-wider",children:"Canvas Background"}),jsxRuntime.jsx("div",{className:"grid grid-cols-5 gap-1.5",children:(y?so:io).map(g=>{let N=(x||(y?"#1a1d24":"#f0f4f8")).toLowerCase()===g.hex.toLowerCase();return jsxRuntime.jsx("button",{type:"button",onClick:()=>b(g.hex),title:g.name,className:`h-7 rounded-[8px] flex items-center justify-center transition-all cursor-pointer ${N?"bg-[#e4e8ef] dark:bg-[#131417] border border-primary/50 shadow-[inset_2px_2px_4px_rgba(166,175,195,0.55),_inset_-2px_-2px_4px_rgba(255,255,255,1)] dark:shadow-[inset_2px_2px_4px_rgba(0,0,0,0.7),_inset_-1px_-1px_3px_rgba(255,255,255,0.05)] ring-1 ring-primary/40":"bg-[#f0f3f8] dark:bg-[#1c1e24] border border-white/80 dark:border-white/[0.06] shadow-[-2px_-2px_4px_rgba(255,255,255,0.9),_2px_2px_4px_rgba(166,175,195,0.35)] dark:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.03),_2px_2px_5px_rgba(0,0,0,0.6)] hover:shadow-[-3px_-3px_6px_rgba(255,255,255,1),_3px_3px_6px_rgba(166,175,195,0.45)] hover:scale-[1.03]"}`,children:jsxRuntime.jsx("div",{className:"w-4 h-4 rounded-[5px] border border-black/15 dark:border-white/20 shadow-2xs",style:{backgroundColor:g.hex}})},g.name)})})]})]})]}),z!=="none"&&w&&jsxRuntime.jsxs("div",{ref:A,className:`fk-card fixed right-[288px] z-50 w-[248px] rounded-[18px] p-3 select-none animate-in fade-in zoom-in-95 duration-150 text-xs ${S?"bg-[#eef1f6]/98 dark:bg-[#16171b]/98 backdrop-blur-2xl border border-white/80 dark:border-white/[0.06] shadow-[-6px_-6px_16px_rgba(255,255,255,0.9),_8px_8px_20px_rgba(166,175,195,0.5)] dark:shadow-[-4px_-4px_14px_rgba(255,255,255,0.03),_10px_10px_26px_rgba(0,0,0,0.85)]":"bg-white/98 dark:bg-[#16171b]/98 backdrop-blur-md border border-black/[0.04] dark:border-white/[0.05] shadow-[0_12px_32px_-4px_rgba(0,0,0,0.12),0_4px_14px_-2px_rgba(0,0,0,0.04)] dark:shadow-[0_14px_34px_-4px_rgba(0,0,0,0.7),0_4px_14px_-2px_rgba(0,0,0,0.5)]"}`,style:{top:w.top},children:[jsxRuntime.jsxs("div",{className:"flex items-center justify-between pb-2 mb-2 border-b border-black/[0.04] dark:border-white/[0.04]",children:[jsxRuntime.jsx("span",{className:"text-[10px] font-bold text-neutral-400 dark:text-neutral-500 uppercase tracking-wider",children:z==="stroke"?"Stroke Color":"Fill Color"}),jsxRuntime.jsx("span",{className:"text-[10px] font-mono text-neutral-400",children:ee==="transparent"?"None":ee.toUpperCase()})]}),jsxRuntime.jsx("div",{className:"grid grid-cols-5 gap-1.5 mb-2.5",children:lo.map(g=>{let D=z==="background"?y?g.fill.dark:g.fill.light:y?g.stroke.dark:g.stroke.light,N=ee.toLowerCase()===D.toLowerCase()||ee.toLowerCase()===g.key||(z==="background"?ee.toLowerCase()===g.fill.light.toLowerCase()||ee.toLowerCase()===g.fill.dark.toLowerCase():ee.toLowerCase()===g.stroke.light.toLowerCase()||ee.toLowerCase()===g.stroke.dark.toLowerCase()),se=z==="background"&&g.key==="r"?"Black / Charcoal":g.name;return jsxRuntime.jsx("button",{type:"button",onClick:()=>Se(D),title:`${se} (${g.key.toUpperCase()})`,className:`relative h-6 rounded-[7px] transition-all cursor-pointer flex items-center justify-center ${N?"ring-2 ring-primary ring-offset-1 dark:ring-offset-neutral-900 scale-105 shadow-[-2px_-2px_4px_rgba(255,255,255,0.9),_2px_2px_4px_rgba(0,0,0,0.3)]":"border border-black/10 dark:border-white/10 hover:scale-105 shadow-[-1px_-1px_2px_rgba(255,255,255,0.8),_1px_1px_2px_rgba(0,0,0,0.15)]"}`,style:{backgroundColor:D==="transparent"?"transparent":D},children:D==="transparent"?jsxRuntime.jsx("span",{className:"text-rose-500 text-xs font-bold leading-none",children:"/"}):jsxRuntime.jsx("span",{className:`text-[8px] font-mono font-bold opacity-0 hover:opacity-100 ${bl(D)}`,children:g.key})},g.key)})}),ee!=="transparent"&&jsxRuntime.jsxs("div",{className:"mb-2.5",children:[jsxRuntime.jsx("div",{className:"text-[9.5px] font-medium text-neutral-400 mb-1",children:"Shades (1-5)"}),jsxRuntime.jsx("div",{className:"grid grid-cols-5 gap-1",children:Y.map((g,D)=>{let N=ee.toLowerCase()===g.toLowerCase();return jsxRuntime.jsx("button",{type:"button",onClick:()=>Se(g),title:`Shade ${D+1}`,className:`h-5 rounded-[6px] transition-all cursor-pointer ${N?"ring-2 ring-primary ring-offset-1 dark:ring-offset-neutral-900 scale-105 shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.9),_1.5px_1.5px_3px_rgba(0,0,0,0.3)]":"border border-black/10 dark:border-white/10 hover:scale-105 shadow-[-1px_-1px_2px_rgba(255,255,255,0.7),_1px_1px_2px_rgba(0,0,0,0.1)]"}`,style:{backgroundColor:g}},D)})})]}),jsxRuntime.jsxs("div",{className:"flex items-center gap-1.5 pt-2 border-t border-black/[0.04] dark:border-white/[0.04]",children:[jsxRuntime.jsxs("div",{className:"relative flex-1",children:[jsxRuntime.jsx("span",{className:"absolute left-2.5 top-1/2 -translate-y-1/2 text-neutral-400 font-mono text-xs",children:"#"}),jsxRuntime.jsx("input",{type:"text",value:te,onChange:g=>L(g.target.value.replace("#","").toUpperCase()),onKeyDown:g=>{g.stopPropagation(),g.key==="Enter"&&Oe(te);},onBlur:()=>Oe(te),placeholder:"HEX CODE",maxLength:6,className:"w-full h-7 pl-6 pr-2 rounded-[7px] text-xs font-mono font-semibold bg-[#e2e6ed] dark:bg-[#121316] border border-black/[0.03] dark:border-white/[0.03] shadow-[inset_1.5px_1.5px_3px_rgba(166,175,195,0.45),_inset_-1.5px_-1.5px_3px_rgba(255,255,255,0.9)] dark:shadow-[inset_2px_2px_4px_rgba(0,0,0,0.6),_inset_-1px_-1px_2px_rgba(255,255,255,0.03)] text-neutral-900 dark:text-neutral-100 outline-none focus:shadow-[inset_2px_2px_4px_rgba(99,102,241,0.25),_0_0_0_1.5px_rgba(99,102,241,0.4)] transition-all"})]}),jsxRuntime.jsx("button",{type:"button",onClick:()=>Z.current?.click(),title:"Native Color Picker",className:"w-7 h-7 rounded-[7px] bg-[#f0f3f8] dark:bg-[#1c1e24] border border-white/80 dark:border-white/[0.06] shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.9),_1.5px_1.5px_3px_rgba(166,175,195,0.35)] dark:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.03),_1.5px_1.5px_4px_rgba(0,0,0,0.6)] flex items-center justify-center hover:shadow-[-2px_-2px_4px_rgba(255,255,255,1),_2px_2px_4px_rgba(166,175,195,0.45)] transition-all cursor-pointer",children:jsxRuntime.jsx("div",{className:"w-4 h-4 rounded-full border border-black/15 shadow-[-1px_-1px_2px_rgba(255,255,255,0.8),_1px_1px_2px_rgba(0,0,0,0.2)]",style:{backgroundColor:ee==="transparent"?"#ffffff":ee}})}),jsxRuntime.jsx("input",{ref:Z,type:"color",value:ee.startsWith("#")?ee:"#4f46e5",onChange:g=>Se(g.target.value),className:"sr-only"})]})]}),v!=="none"&&T&&jsxRuntime.jsx("div",{ref:F,className:`fk-card fixed right-[288px] z-50 rounded-[18px] p-2.5 animate-in fade-in zoom-in-95 duration-150 select-none text-xs ${S?"bg-[#eef1f6]/98 dark:bg-[#16171b]/98 backdrop-blur-2xl border border-white/80 dark:border-white/[0.06] shadow-[-6px_-6px_16px_rgba(255,255,255,0.9),_8px_8px_20px_rgba(166,175,195,0.5)] dark:shadow-[-4px_-4px_14px_rgba(255,255,255,0.03),_10px_10px_26px_rgba(0,0,0,0.85)]":"bg-white/98 dark:bg-[#16171b]/98 backdrop-blur-md border border-black/[0.04] dark:border-white/[0.05] shadow-[0_12px_32px_-4px_rgba(0,0,0,0.12),0_4px_14px_-2px_rgba(0,0,0,0.04)] dark:shadow-[0_14px_34px_-4px_rgba(0,0,0,0.7),0_4px_14px_-2px_rgba(0,0,0,0.5)]"}`,style:{top:T.top},children:jsxRuntime.jsx(Yo,{side:v,currentValue:v==="start"?ar(E.startArrowhead,"none"):ar(E.endArrowhead,E.type==="arrow"?"arrow":"none"),onClose:()=>{C("none"),W(null);},onChange:g=>{ie(v==="start"?{startArrowhead:g}:{endArrowhead:g}),C("none"),W(null);}})})]})}var _l=[{category:"Tools",items:[{key:["V","1"],label:"Select tool"},{key:["H","Space","2"],label:"Hand / Pan canvas"},{key:["R","3"],label:"Rectangle"},{key:["O","4"],label:"Ellipse / Circle"},{key:["D","5"],label:"Diamond"},{key:"Y",label:"Triangle"},{key:"B",label:"Capsule / Stadium"},{key:"G",label:"Parallelogram (Data)"},{key:"Z",label:"Trapezoid (Trapezium)"},{key:"X",label:"Hexagon"},{key:"C",label:"Cylinder (Database)"},{key:"U",label:"Cloud (Infra/Idea)"},{key:"J",label:"Star (Jewel / Milestone)"},{key:["A","6"],label:"Arrow"},{key:["L","7"],label:"Line"},{key:["P","8"],label:"Freehand Pen"},{key:["T","9"],label:"Text tool"},{key:"F",label:"Frame / Artboard"},{key:"N",label:"Table / Matrix Grid"},{key:"I",label:"Insert image from file"},{key:["S","0"],label:"Sticky Note"},{key:"K",label:"Laser pointer tool"},{key:"E",label:"Eraser tool"},{key:"Q",label:"Lock / keep active tool"}]},{category:"Editing & Shapes",items:[{key:"Ctrl + A",label:"Select all elements"},{key:"Ctrl + G",label:"Group selection"},{key:"Ctrl + Shift + G",label:"Ungroup selection"},{key:"\u2191 \u2193 \u2190 \u2192",label:"Nudge selection (Shift = 10px)"},{key:"Tab / Shift+Tab",label:"Next / previous table cell"},{key:"Ctrl + V",label:"Paste image / screenshot"},{key:"Double Click",label:"Write text / Table cell / Rename frame"},{key:"Ctrl + Arrows",label:"Quick branch shape & arrow"},{key:"Ctrl + D",label:"Duplicate selected"},{key:"Del",label:"Delete selected"},{key:"Esc",label:"Clear selection / Cancel"}]},{category:"Canvas & Presentation",items:[{key:"Alt + I",label:"Developer & Cloud Stencils Library"},{key:"Alt + T",label:"Diagram Templates & Starter Kits"},{key:"Alt + F",label:"Toggle Frames Outline drawer"},{key:"Alt + P",label:"Start Presentation / Slideshow"},{key:"\u2190 / \u2192",label:"Next / Previous slide in Presentation"},{key:"L",label:"Toggle Laser Pointer in Presentation"},{key:"G",label:"Toggle Slides Overview in Presentation"},{key:"Alt + S",label:"Spotlight / Focus Mode (Selection / Cursor)"},{key:"Ctrl + Shift + C",label:"Copy image as PNG to clipboard"},{key:"Ctrl + S",label:"Save whiteboard"},{key:"Ctrl + Z",label:"Undo"},{key:"Ctrl + Y",label:"Redo (Ctrl+Shift+Z)"},{key:"Ctrl + Scroll",label:"Zoom in / out"},{key:"Space + Drag",label:"Pan canvas view"}]},{category:"Color Popover",items:[{key:"Q - B",label:"Palette swatch pick"},{key:"1 - 5",label:"Shade level (light/dark)"}]}];function Cn({guideHref:e,onOpenGuide:t}={}){let[r,o]=Ln.useState(false),p=Ln.useRef(null),c=Ln.useRef(null);return Ln.useEffect(()=>{let l=n=>{r&&p.current&&!p.current.contains(n.target)&&c.current&&!c.current.contains(n.target)&&o(false);},s=n=>{n.target instanceof HTMLInputElement||n.target instanceof HTMLTextAreaElement||n.target.isContentEditable||(n.key==="?"||n.shiftKey&&n.key==="/"?(n.preventDefault(),o(u=>!u)):n.key==="Escape"&&r&&o(false));};return document.addEventListener("mousedown",l),window.addEventListener("keydown",s),()=>{document.removeEventListener("mousedown",l),window.removeEventListener("keydown",s);}},[r]),jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsxs("div",{className:"fixed bottom-4 left-4 z-20 pointer-events-auto flex items-center gap-2",children:[jsxRuntime.jsxs("button",{ref:c,type:"button",onClick:()=>o(l=>!l),title:"View Keyboard Shortcuts (?)",className:`h-8 px-3 rounded-[12px] flex items-center gap-2 text-xs font-semibold select-none cursor-pointer transition-all duration-150 ${r?"bg-[#e4e8ef] dark:bg-[#131417] text-primary dark:text-foreground border border-primary/40 shadow-[inset_2px_2px_4px_rgba(166,175,195,0.55),_inset_-2px_-2px_4px_rgba(255,255,255,1)] dark:shadow-[inset_2px_2px_4px_rgba(0,0,0,0.7),_inset_-1px_-1px_3px_rgba(255,255,255,0.05)]":"bg-[#f0f3f8] dark:bg-[#1c1e24] text-neutral-700 dark:text-neutral-200 border border-white/80 dark:border-white/[0.06] shadow-[-3px_-3px_7px_rgba(255,255,255,0.95),_3px_3px_7px_rgba(166,175,195,0.4)] dark:shadow-[-2px_-2px_5px_rgba(255,255,255,0.03),_3px_3px_7px_rgba(0,0,0,0.65)] hover:shadow-[-4px_-4px_9px_rgba(255,255,255,1),_4px_4px_9px_rgba(166,175,195,0.5)] hover:text-neutral-900 dark:hover:text-white"}`,children:[jsxRuntime.jsx("span",{className:`w-5 h-5 rounded-[6px] flex items-center justify-center font-mono font-bold text-[10.5px] transition-all ${r?"bg-primary text-white shadow-[-1px_-1px_2px_rgba(255,255,255,0.4),_1px_1px_3px_rgba(0,0,0,0.3)]":"bg-[#e2e6ee] dark:bg-[#121316] text-neutral-600 dark:text-neutral-300 border border-white/60 dark:border-white/[0.04] shadow-[inset_1px_1px_2.5px_rgba(166,175,195,0.45),_inset_-1px_-1px_2.5px_rgba(255,255,255,0.9)] dark:shadow-[inset_1.5px_1.5px_3px_rgba(0,0,0,0.6),_inset_-1px_-1px_2px_rgba(255,255,255,0.03)]"}`,children:"?"}),jsxRuntime.jsx("span",{className:"font-medium tracking-tight",children:"Shortcuts"})]}),t?jsxRuntime.jsxs("button",{type:"button",onClick:t,title:"Sketch Features & Architecture Guide",className:"h-8 px-3 rounded-[12px] flex items-center gap-1.5 text-xs font-semibold select-none cursor-pointer bg-[#f0f3f8] dark:bg-[#1c1e24] text-neutral-700 dark:text-neutral-200 border border-white/80 dark:border-white/[0.06] shadow-[-3px_-3px_7px_rgba(255,255,255,0.95),_3px_3px_7px_rgba(166,175,195,0.4)] dark:shadow-[-2px_-2px_5px_rgba(255,255,255,0.03),_3px_3px_7px_rgba(0,0,0,0.65)] hover:shadow-[-4px_-4px_9px_rgba(255,255,255,1),_4px_4px_9px_rgba(166,175,195,0.5)] hover:text-primary dark:hover:text-blue-200 active:scale-95 transition-all",children:[jsxRuntime.jsx(iconsReact.IconBook,{size:14,className:"text-primary dark:text-blue-300"}),jsxRuntime.jsx("span",{className:"font-medium tracking-tight",children:"Guide"})]}):e?jsxRuntime.jsxs("a",{href:e,target:"_blank",rel:"noopener noreferrer",title:"Sketch Features & Architecture Guide",className:"h-8 px-3 rounded-[12px] flex items-center gap-1.5 text-xs font-semibold select-none cursor-pointer bg-[#f0f3f8] dark:bg-[#1c1e24] text-neutral-700 dark:text-neutral-200 border border-white/80 dark:border-white/[0.06] shadow-[-3px_-3px_7px_rgba(255,255,255,0.95),_3px_3px_7px_rgba(166,175,195,0.4)] dark:shadow-[-2px_-2px_5px_rgba(255,255,255,0.03),_3px_3px_7px_rgba(0,0,0,0.65)] hover:shadow-[-4px_-4px_9px_rgba(255,255,255,1),_4px_4px_9px_rgba(166,175,195,0.5)] hover:text-primary dark:hover:text-blue-200 active:scale-95 transition-all",children:[jsxRuntime.jsx(iconsReact.IconBook,{size:14,className:"text-primary dark:text-blue-300"}),jsxRuntime.jsx("span",{className:"font-medium tracking-tight",children:"Guide"})]}):null]}),r&&jsxRuntime.jsxs("div",{ref:p,className:"fixed bottom-14 left-4 z-40 w-[340px] sm:w-[380px] max-h-[calc(100vh-120px)] flex flex-col bg-[#edf0f5]/98 dark:bg-[#16171b]/98 backdrop-blur-2xl rounded-[20px] border border-white/80 dark:border-white/[0.06] shadow-[-8px_-8px_20px_rgba(255,255,255,0.95),_10px_10px_24px_rgba(166,175,195,0.45)] dark:shadow-[-4px_-4px_14px_rgba(255,255,255,0.03),_10px_10px_28px_rgba(0,0,0,0.85)] p-3.5 animate-in fade-in zoom-in-95 duration-150 select-none overflow-hidden",children:[jsxRuntime.jsxs("div",{className:"flex items-center justify-between pb-2.5 mb-2.5 border-b border-black/[0.05] dark:border-white/[0.05]",children:[jsxRuntime.jsxs("div",{className:"flex items-center gap-2",children:[jsxRuntime.jsx("div",{className:"w-6 h-6 rounded-[8px] bg-[#e4e8ef] dark:bg-[#131417] flex items-center justify-center text-primary border border-white/70 dark:border-white/[0.04] shadow-[inset_1.5px_1.5px_3px_rgba(166,175,195,0.4),_inset_-1.5px_-1.5px_3px_rgba(255,255,255,0.8)] dark:shadow-[inset_1.5px_1.5px_3px_rgba(0,0,0,0.6)]",children:jsxRuntime.jsx(iconsReact.IconKeyboard,{size:14})}),jsxRuntime.jsx("span",{className:"text-xs font-bold text-neutral-800 dark:text-neutral-100 tracking-tight",children:"Keyboard Shortcuts"})]}),jsxRuntime.jsx("button",{type:"button",onClick:()=>o(false),className:"w-6 h-6 rounded-[8px] bg-[#f0f3f8] dark:bg-[#1c1e24] border border-white/80 dark:border-white/[0.06] shadow-[-2px_-2px_4px_rgba(255,255,255,0.9),_2px_2px_4px_rgba(166,175,195,0.35)] dark:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.03),_2px_2px_4px_rgba(0,0,0,0.6)] hover:shadow-[-2.5px_-2.5px_5px_rgba(255,255,255,1),_2.5px_2.5px_5px_rgba(166,175,195,0.45)] active:shadow-[inset_1.5px_1.5px_3px_rgba(166,175,195,0.5)] flex items-center justify-center text-neutral-400 hover:text-neutral-700 dark:hover:text-neutral-200 transition-all cursor-pointer",title:"Close (Esc)",children:jsxRuntime.jsx(iconsReact.IconX,{size:13})})]}),jsxRuntime.jsx("div",{className:"flex-1 overflow-y-auto space-y-3.5 pr-1 text-xs scrollbar-thin scrollbar-thumb-neutral-300 dark:scrollbar-thumb-neutral-700",children:_l.map(l=>jsxRuntime.jsxs("div",{children:[jsxRuntime.jsx("h4",{className:"text-[10px] font-bold text-neutral-400 dark:text-neutral-500 uppercase tracking-wider mb-1.5 px-1",children:l.category}),jsxRuntime.jsx("div",{className:"space-y-1",children:l.items.map((s,n)=>jsxRuntime.jsxs("div",{className:"flex items-center justify-between py-1.5 px-2 rounded-[9px] hover:bg-white/60 dark:hover:bg-white/[0.03] transition-colors",children:[jsxRuntime.jsx("span",{className:"text-[11.5px] font-medium text-neutral-600 dark:text-neutral-300",children:s.label}),jsxRuntime.jsx("div",{className:"flex items-center gap-1 shrink-0",children:Array.isArray(s.key)?s.key.map((u,i)=>jsxRuntime.jsxs(Ln__default.default.Fragment,{children:[i>0&&jsxRuntime.jsx("span",{className:"text-[10px] text-neutral-400 dark:text-neutral-500 font-medium",children:"or"}),jsxRuntime.jsx("kbd",{className:"px-1.5 py-0.5 text-[10px] font-mono font-bold bg-[#e8ecf3] dark:bg-[#1e2027] text-neutral-800 dark:text-neutral-200 rounded-[6px] border border-white/80 dark:border-white/[0.07] shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.9),_1.5px_1.5px_3px_rgba(166,175,195,0.4)] dark:shadow-[-1px_-1px_2.5px_rgba(255,255,255,0.03),_1.5px_1.5px_3px_rgba(0,0,0,0.6)]",children:u})]},u)):jsxRuntime.jsx("kbd",{className:"px-1.5 py-0.5 text-[10px] font-mono font-bold bg-[#e8ecf3] dark:bg-[#1e2027] text-neutral-800 dark:text-neutral-200 rounded-[6px] border border-white/80 dark:border-white/[0.07] shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.9),_1.5px_1.5px_3px_rgba(166,175,195,0.4)] dark:shadow-[-1px_-1px_2.5px_rgba(255,255,255,0.03),_1.5px_1.5px_3px_rgba(0,0,0,0.6)]",children:s.key})})]},n))})]},l.category))}),jsxRuntime.jsxs("div",{className:"pt-2.5 mt-2.5 border-t border-black/[0.05] dark:border-white/[0.05] flex items-center justify-between text-[10px] text-neutral-400 dark:text-neutral-500 px-1",children:[jsxRuntime.jsxs("span",{children:["Press"," ",jsxRuntime.jsx("kbd",{className:"font-mono font-bold bg-[#e8ecf3] dark:bg-[#1e2027] text-neutral-700 dark:text-neutral-200 px-1 py-0.5 rounded-[5px] border border-white/70 dark:border-white/[0.05] shadow-[-1px_-1px_2px_rgba(255,255,255,0.8),_1px_1px_2px_rgba(0,0,0,0.15)]",children:"?"})," ","to toggle"]}),jsxRuntime.jsx("span",{children:"Click outside or Esc to close"})]})]})]})}function Nn({isActive:e,onClose:t,selectedElements:r,allElements:o,camera:p,worldToScreen:c,screenToWorld:l,onSelectElement:s,isDark:n}){let u=Ln.useRef(null),[i,d]=Ln.useState(r.length>0?"selection":"cursor"),[h,a]=Ln.useState(.9),[x,b]=Ln.useState(180),[k,y]=Ln.useState(24),[_,S]=Ln.useState({x:typeof window<"u"?window.innerWidth/2:500,y:typeof window<"u"?window.innerHeight/2:400}),[P,R]=Ln.useState(false);return Ln.useEffect(()=>{r.length>0;},[r,i]),Ln.useEffect(()=>{if(!e)return;let I=$=>{S({x:$.clientX,y:$.clientY});},z=$=>{if($.key==="Escape"){$.preventDefault(),$.stopPropagation(),t();return}if($.altKey&&$.key.toLowerCase()==="s"){$.preventDefault(),$.stopPropagation(),t();return}};return window.addEventListener("mousemove",I),window.addEventListener("keydown",z,{capture:true}),()=>{window.removeEventListener("mousemove",I),window.removeEventListener("keydown",z,{capture:true});}},[e,t]),Ln.useEffect(()=>{if(!e)return;let I,z=()=>{let $=u.current;if(!$)return;let w=$.getContext("2d");if(!w)return;let f=window.devicePixelRatio||1,v=window.innerWidth,C=window.innerHeight;($.width!==v*f||$.height!==C*f)&&($.width=v*f,$.height=C*f),w.save(),w.scale(f,f),w.clearRect(0,0,v,C);let T=n?`rgba(6, 8, 12, ${h})`:`rgba(15, 23, 42, ${h})`;if(w.fillStyle=T,w.fillRect(0,0,v,C),w.globalCompositeOperation="destination-out",i==="selection"&&r.length>0){let W=1/0,le=1/0,L=-1/0,A=-1/0;r.forEach(Oe=>{let je=it(Oe);W=Math.min(W,je.x),le=Math.min(le,je.y),L=Math.max(L,je.x+je.width),A=Math.max(A,je.y+je.height);});let F=c({x:W,y:le}),Z=c({x:L,y:A}),be=Math.min(F.x,Z.x)-k,U=Math.min(F.y,Z.y)-k,E=Math.abs(Z.x-F.x)+k*2,ee=Math.abs(Z.y-F.y)+k*2,te=Math.min(24,Math.min(E,ee)*.15),ie=be+E/2,Se=U+ee/2,Ke=Math.max(E,ee)*.75;w.beginPath(),typeof w.roundRect=="function"?w.roundRect(be,U,E,ee,te):w.rect(be,U,E,ee),w.fill();let X=w.createRadialGradient(ie,Se,Math.min(E,ee)*.35,ie,Se,Ke+40);X.addColorStop(0,"rgba(0, 0, 0, 1)"),X.addColorStop(.6,"rgba(0, 0, 0, 0.8)"),X.addColorStop(1,"rgba(0, 0, 0, 0)"),w.fillStyle=X,w.fillRect(be-50,U-50,E+100,ee+100),w.globalCompositeOperation="source-over",w.save(),w.strokeStyle="rgba(245, 158, 11, 0.85)",w.lineWidth=2.5,w.shadowColor="rgba(245, 158, 11, 0.6)",w.shadowBlur=18,w.beginPath(),typeof w.roundRect=="function"?w.roundRect(be,U,E,ee,te):w.rect(be,U,E,ee),w.stroke(),w.restore();}else {let{x:W,y:le}=_,L=x,A=w.createRadialGradient(W,le,L*.45,W,le,L);A.addColorStop(0,"rgba(0, 0, 0, 1)"),A.addColorStop(.75,"rgba(0, 0, 0, 0.85)"),A.addColorStop(1,"rgba(0, 0, 0, 0)"),w.fillStyle=A,w.beginPath(),w.arc(W,le,L+40,0,Math.PI*2),w.fill(),w.globalCompositeOperation="source-over",w.save(),w.strokeStyle="rgba(245, 158, 11, 0.75)",w.lineWidth=2,w.shadowColor="rgba(245, 158, 11, 0.6)",w.shadowBlur=16,w.beginPath(),w.arc(W,le,L*.9,0,Math.PI*2),w.stroke(),w.restore();}w.restore(),I=requestAnimationFrame(z);};return I=requestAnimationFrame(z),()=>cancelAnimationFrame(I)},[e,i,r,c,k,h,x,_,n]),e?jsxRuntime.jsxs("div",{className:"fixed inset-0 z-50 pointer-events-none select-none",children:[jsxRuntime.jsx("canvas",{ref:u,className:"absolute inset-0 w-full h-full pointer-events-none"}),jsxRuntime.jsxs("div",{className:"absolute top-4 left-1/2 -translate-x-1/2 pointer-events-auto flex flex-col items-center gap-2 animate-in fade-in slide-in-from-top-4 duration-150",children:[jsxRuntime.jsxs("div",{className:"flex items-center gap-2 px-3.5 py-1.5 bg-neutral-900/95 dark:bg-[#18181b]/95 backdrop-blur-md rounded-full shadow-2xl border border-neutral-700/80 text-white text-xs",children:[jsxRuntime.jsxs("div",{className:"flex items-center gap-1.5 font-semibold text-amber-400",children:[jsxRuntime.jsx(iconsReact.IconCurrentLocation,{size:16,className:"animate-pulse"}),jsxRuntime.jsx("span",{children:"Spotlight Focus"})]}),jsxRuntime.jsx("div",{className:"w-[1px] h-4 bg-neutral-700"}),jsxRuntime.jsxs("div",{className:"flex items-center bg-neutral-800 rounded-full p-0.5 border border-neutral-700",children:[jsxRuntime.jsx("button",{type:"button",onClick:()=>d("selection"),className:`px-2.5 py-1 rounded-full text-[11px] font-medium transition-all ${i==="selection"?"bg-amber-500 text-neutral-950 font-bold shadow-xs":"text-neutral-400 hover:text-white"}`,children:"Selection"}),jsxRuntime.jsx("button",{type:"button",onClick:()=>d("cursor"),className:`px-2.5 py-1 rounded-full text-[11px] font-medium transition-all ${i==="cursor"?"bg-amber-500 text-neutral-950 font-bold shadow-xs":"text-neutral-400 hover:text-white"}`,children:"Follow Cursor"})]}),jsxRuntime.jsx("div",{className:"w-[1px] h-4 bg-neutral-700"}),jsxRuntime.jsx("button",{type:"button",onClick:()=>R(I=>!I),title:"Adjust Spotlight Settings",className:`p-1 rounded-full hover:bg-neutral-800 transition-colors ${P?"text-amber-400":"text-neutral-400"}`,children:jsxRuntime.jsx(iconsReact.IconAdjustments,{size:15})}),jsxRuntime.jsxs("button",{type:"button",onClick:t,title:"Exit Focus Mode (Esc or Alt+S)",className:"flex items-center gap-1 pl-2 pr-1.5 py-0.5 rounded-full hover:bg-rose-500/20 hover:text-rose-400 text-neutral-400 transition-colors cursor-pointer",children:[jsxRuntime.jsx("span",{className:"text-[10px] font-mono opacity-60",children:"Esc"}),jsxRuntime.jsx(iconsReact.IconX,{size:14})]})]}),P&&jsxRuntime.jsxs("div",{className:"flex items-center gap-4 px-4 py-2 bg-neutral-900/95 dark:bg-[#18181b]/95 backdrop-blur-md rounded-2xl shadow-2xl border border-neutral-700/80 text-white text-xs animate-in fade-in zoom-in-95 duration-100",children:[jsxRuntime.jsxs("div",{className:"flex items-center gap-2",children:[jsxRuntime.jsx("span",{className:"text-neutral-400 text-[11px]",children:"Dim:"}),[{label:"60%",val:.6},{label:"75%",val:.76},{label:"90%",val:.9}].map(I=>jsxRuntime.jsx("button",{type:"button",onClick:()=>a(I.val),className:`px-2 py-0.5 rounded-[5px] text-[10.5px] font-semibold transition-all ${h===I.val?"bg-amber-500 text-neutral-950":"bg-neutral-800 text-neutral-400 hover:text-white"}`,children:I.label},I.label))]}),jsxRuntime.jsx("div",{className:"w-[1px] h-4 bg-neutral-700"}),i==="cursor"?jsxRuntime.jsxs("div",{className:"flex items-center gap-2",children:[jsxRuntime.jsx("span",{className:"text-neutral-400 text-[11px]",children:"Radius:"}),[{label:"S",val:130},{label:"M",val:190},{label:"L",val:280}].map(I=>jsxRuntime.jsx("button",{type:"button",onClick:()=>b(I.val),className:`px-2 py-0.5 rounded-[5px] text-[10.5px] font-semibold transition-all ${x===I.val?"bg-amber-500 text-neutral-950":"bg-neutral-800 text-neutral-400 hover:text-white"}`,children:I.label},I.label))]}):jsxRuntime.jsxs("div",{className:"flex items-center gap-2",children:[jsxRuntime.jsx("span",{className:"text-neutral-400 text-[11px]",children:"Padding:"}),[{label:"Tight",val:12},{label:"Med",val:24},{label:"Wide",val:48}].map(I=>jsxRuntime.jsx("button",{type:"button",onClick:()=>y(I.val),className:`px-2 py-0.5 rounded-[5px] text-[10.5px] font-semibold transition-all ${k===I.val?"bg-amber-500 text-neutral-950":"bg-neutral-800 text-neutral-400 hover:text-white"}`,children:I.label},I.label))]})]})]})]}):null}var Pn=[{id:"all",label:"All Stencils"},{id:"frontend",label:"Frontend & UI"},{id:"backend",label:"Backend & Runtimes"},{id:"database",label:"Databases & Storage"},{id:"cloud",label:"Cloud & DevOps"},{id:"tools",label:"AI, Tools & APIs"}],En=[{id:"react",name:"React",category:"frontend",color:"#61DAFB",keywords:["react","reactjs","frontend","ui","framework","jsx"],svg:'<svg viewBox="0 0 24 24" fill="none" stroke="#61DAFB" stroke-width="1.8"><ellipse cx="12" cy="12" rx="10" ry="4"/><ellipse cx="12" cy="12" rx="10" ry="4" transform="rotate(60 12 12)"/><ellipse cx="12" cy="12" rx="10" ry="4" transform="rotate(120 12 12)"/><circle cx="12" cy="12" r="1.8" fill="#61DAFB"/></svg>'},{id:"nextjs",name:"Next.js",category:"frontend",color:"#000000",keywords:["next","nextjs","react","ssr","fullstack","vercel"],svg:'<svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 1 0 10 10A10 10 0 0 0 12 2Zm4.5 13.9-6.3-8.2V7.6h1.5v5.8l5.2 6.8a8.5 8.5 0 0 1-8.9.1l8.5-4.4ZM14.8 7.6h1.5v6.5l-1.5-1.9Z"/></svg>'},{id:"vue",name:"Vue.js",category:"frontend",color:"#4FC08D",keywords:["vue","vuejs","frontend","ui","vite"],svg:'<svg viewBox="0 0 24 24"><path fill="#4FC08D" d="M2 3h3.5L12 14.5 18.5 3H22L12 21 2 3z"/><path fill="#35495E" d="M6.5 3h3.2L12 7.8 14.3 3h3.2L12 12.8 6.5 3z"/></svg>'},{id:"svelte",name:"Svelte",category:"frontend",color:"#FF3E00",keywords:["svelte","sveltekit","ui","compiler"],svg:'<svg viewBox="0 0 24 24" fill="#FF3E00"><path d="M19.4 6.3a6.8 6.8 0 0 0-9.8-.9l-3.8 3.2a6.8 6.8 0 0 0 1.2 10.9 6.8 6.8 0 0 0 9.8.9l3.8-3.2a6.8 6.8 0 0 0-1.2-10.9zm-4.3 8.8-3.8 3.2c-1.8 1.5-4.5.3-5-1.9a3.8 3.8 0 0 1 .7-3.4l3.8-3.2c1.8-1.5 4.5-.3 5 1.9a3.8 3.8 0 0 1-.7 3.4z"/></svg>'},{id:"tailwind",name:"Tailwind CSS",category:"frontend",color:"#06B6D4",keywords:["tailwind","css","styling","utility","ui"],svg:'<svg viewBox="0 0 24 24" fill="#06B6D4"><path d="M12 6c-2.7 0-4.4 1.3-5.1 4 1-1.3 2.2-1.8 3.6-1.5 1 .3 1.8 1 2.6 1.8 1.3 1.3 2.8 2.7 5.9 2.7 2.7 0 4.4-1.3 5.1-4-1 1.3-2.2 1.8-3.6 1.5-1-.3-1.8-1-2.6-1.8-1.3-1.3-2.8-2.7-5.9-2.7zm-7 6c-2.7 0-4.4 1.3-5.1 4 1-1.3 2.2-1.8 3.6-1.5 1 .3 1.8 1 2.6 1.8 1.3 1.3 2.8 2.7 5.9 2.7 2.7 0 4.4-1.3 5.1-4-1 1.3-2.2 1.8-3.6 1.5-1-.3-1.8-1-2.6-1.8-1.3-1.3-2.8-2.7-5.9-2.7z"/></svg>'},{id:"typescript",name:"TypeScript",category:"frontend",color:"#3178C6",keywords:["typescript","ts","javascript","types","code"],svg:'<svg viewBox="0 0 24 24"><rect width="24" height="24" rx="4" fill="#3178C6"/><path fill="#fff" d="M11.5 14.5c-.2.9-.6 1.6-1.3 2.1-.7.5-1.5.7-2.6.7-1.1 0-2-.3-2.7-.9s-1-1.5-1-2.7c0-.8.2-1.5.6-2.1.4-.6.9-1 1.6-1.3.7-.3 1.4-.4 2.3-.4.8 0 1.5.1 2.1.4.6.2 1 .6 1.3 1l-1.4 1.2c-.4-.6-1.1-.9-1.9-.9-.7 0-1.2.2-1.6.6s-.5.9-.5 1.5c0 .7.2 1.2.6 1.6.4.4.9.5 1.6.5.4 0 .8-.1 1.1-.3.3-.2.5-.5.6-.8h-1.8v-1.4h3.7v3.2zm4.3 2.8h-1.9v-7.1h-2.3v-1.6h6.5v1.6h-2.3v7.1z"/></svg>'},{id:"javascript",name:"JavaScript",category:"frontend",color:"#F7DF1E",keywords:["javascript","js","frontend","web","node"],svg:'<svg viewBox="0 0 24 24"><rect width="24" height="24" rx="4" fill="#F7DF1E"/><path fill="#000" d="M7 17.5c.5.8 1.2 1.3 2.2 1.3 1.1 0 1.9-.6 1.9-2v-6.3h2.3v6.3c0 2.5-1.5 3.6-3.9 3.6-1.8 0-3-.8-3.7-2.1l1.2-.8zm8.6-1c.4.7 1 1.1 1.9 1.1.8 0 1.4-.4 1.4-1 0-.7-.5-1-1.6-1.4l-.5-.2c-1.6-.6-2.7-1.4-2.7-3.1 0-1.7 1.3-3 3.3-3 1.5 0 2.5.5 3.2 1.8l-1.6 1c-.3-.6-.7-.9-1.5-.9-.7 0-1.2.4-1.2.9 0 .6.4.9 1.4 1.3l.5.2c1.9.7 2.9 1.5 2.9 3.3 0 1.9-1.5 3.1-3.7 3.1-2.1 0-3.3-1-3.9-2.3l2.1-.9z"/></svg>'},{id:"html5",name:"HTML5",category:"frontend",color:"#E34F26",keywords:["html","html5","web","frontend","markup"],svg:'<svg viewBox="0 0 24 24"><path fill="#E34F26" d="M3 2l1.8 18.2L12 23l7.2-2.8L21 2H3z"/><path fill="#EF652A" d="M12 21.1l5.7-2.2 1.4-15.1H12v17.3z"/><path fill="#EBEBEB" d="M12 8.7H8.3l-.2-2.2H12V4.4H6l.7 6.4h5.3v-2.1zm0 6.6l-3.2-.9-.2-2.3H6.4l.4 4.5 5.2 1.4v-2.7z"/><path fill="#fff" d="M12 8.7h3.7l-.4 3.7-3.3.9v2.2l5.2-1.4.6-7.5H12V4.4h6l-.2 2.1h-5.8v2.2z"/></svg>'},{id:"angular",name:"Angular",category:"frontend",color:"#DD0031",keywords:["angular","google","frontend","typescript","spa"],svg:'<svg viewBox="0 0 24 24"><path fill="#DD0031" d="M12 2L2.5 5.5l1.4 12.2L12 22l8.1-4.3 1.4-12.2L12 2z"/><path fill="#C3002F" d="M12 2v20l8.1-4.3 1.4-12.2L12 2z"/><path fill="#fff" d="M12 5.5L6.6 17.5h2.1l1.1-2.7h4.4l1.1 2.7h2.1L12 5.5zm1.5 7.6h-3L12 8.8l1.5 4.3z"/></svg>'},{id:"vite",name:"Vite",category:"frontend",color:"#646CFF",keywords:["vite","bundler","build","frontend","tooling"],svg:'<svg viewBox="0 0 24 24"><path fill="#646CFF" d="M20.2 3.8L12.7 22l-1.3-3.2L2.3 5.4l9-1.6 8.9 0z"/><path fill="#FFD62E" d="M13.6 2l-6.8 1.4L11 11.2l-2.7.4L15.4 20l-1.2-6.5 3.3-.6L13.6 2z"/></svg>'},{id:"nodejs",name:"Node.js",category:"backend",color:"#339933",keywords:["node","nodejs","backend","javascript","server"],svg:'<svg viewBox="0 0 24 24" fill="#339933"><path d="M12 2.5a2 2 0 0 0-1 .3L3.5 7a2 2 0 0 0-1 1.7v8.6a2 2 0 0 0 1 1.7l7.5 4.3a2 2 0 0 0 2 0l7.5-4.3a2 2 0 0 0 1-1.7V8.7a2 2 0 0 0-1-1.7L13 2.8a2 2 0 0 0-1-.3zm0 3.2l6.2 3.6-6.2 3.6-6.2-3.6 6.2-3.6zm-7.2 5.2l6.2 3.6v7.2L4.8 18.1v-7.2zm14.4 0v7.2l-6.2 3.6v-7.2l6.2-3.6z"/></svg>'},{id:"python",name:"Python",category:"backend",color:"#3776AB",keywords:["python","django","fastapi","flask","ai","backend"],svg:'<svg viewBox="0 0 24 24"><path fill="#3776AB" d="M11.9 2C6.8 2 7.1 4.2 7.1 4.2l.02 2.3h4.9v.7H4.2S2 6.9 2 12c0 5.2 1.9 5 1.9 5l1.8.02V14.5s-.1-2.9 2.9-2.9h4.9s2.8.04 2.8-2.8V4.8S16.9 2 11.9 2zm-2.4 1.7c.6 0 1 .4 1 1s-.4 1-1 1-1-.4-1-1 .4-1 1-1z"/><path fill="#FFD43B" d="M12.1 22c5.1 0 4.8-2.2 4.8-2.2l-.02-2.3h-4.9v-.7h7.8s2.2.3 2.2-4.8c0-5.2-1.9-5-1.9-5l-1.8-.02V9.5s.1 2.9-2.9 2.9H10.5s-2.8-.04-2.8 2.8v4S7.1 22 12.1 22zm2.4-1.7c-.6 0-1-.4-1-1s.4-1 1-1 1 .4 1 1-.4 1-1 1z"/></svg>'},{id:"go",name:"Go (Golang)",category:"backend",color:"#00ADD8",keywords:["go","golang","backend","microservices","concurrency"],svg:'<svg viewBox="0 0 24 24" fill="#00ADD8"><path d="M3 10.5h4.5v1.8H4.8v3.4h2.7v-1.6H6.2v-1.5h3v4.6H3v-6.7zm8 0h2.4a3.3 3.3 0 0 1 3.5 3.3 3.3 3.3 0 0 1-3.5 3.4H11v-6.7zm2.3 5c1 0 1.6-.7 1.6-1.7s-.6-1.6-1.6-1.6h-.6v3.3h.6zm6.2-5h1.7l1.5 4 1.5-4h1.7l-2.4 6.7h-1.6l-2.4-6.7z"/></svg>'},{id:"rust",name:"Rust",category:"backend",color:"#DEA584",keywords:["rust","wasm","backend","systems","memory","safety"],svg:'<svg viewBox="0 0 24 24" fill="#DEA584"><path d="M12 2a10 10 0 1 0 10 10A10 10 0 0 0 12 2zm3.8 14.5h-1.6l-1.4-2.4h-1.5v2.4H9.6V7.5h3.4c1.8 0 2.8.9 2.8 2.4 0 1.1-.6 1.9-1.5 2.2l1.5 2.4zm-2.8-5.3c.7 0 1.2-.4 1.2-1s-.5-1-1.2-1h-1.7v2h1.7z"/></svg>'},{id:"bun",name:"Bun",category:"backend",color:"#FBF0DF",keywords:["bun","javascript","runtime","fast","package","backend"],svg:'<svg viewBox="0 0 24 24" fill="#E8B072"><path d="M12 3a9 9 0 0 0-8.7 6.7c-.5 2 .2 4.1 1.7 5.5l.3.3a8.9 8.9 0 0 0 13.4 0l.3-.3c1.5-1.4 2.2-3.5 1.7-5.5A9 9 0 0 0 12 3zm-2.5 7.5a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3zm5 0a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3z"/></svg>'},{id:"java",name:"Java",category:"backend",color:"#007396",keywords:["java","spring","jvm","backend","enterprise"],svg:'<svg viewBox="0 0 24 24" fill="#007396"><path d="M9 19s-1.8.4-1.2 1.3c.6.9 2.5.8 4.3.5 2.1-.3 4.9-1.2 4.9-1.2s-1.4.6-2.9.9c-2.3.4-4.5.3-5.1-.5zm-.5-3.2s-2.1.6-1.5 1.7c.6 1 3 .9 5.3.5 2.6-.4 5.9-1.5 5.9-1.5s-1.7.8-3.6 1.1c-2.8.5-5.4.4-6.1-.8zm4.2-11.5c.8.9.8 1.9-.3 3.3-1.4 1.8-2.4 2.7-4.3 4.1-.7.5-.9 1.1-.7 1.5.3.8 1.5.8 2.4.6 2.3-.4 4.5-1.5 4.5-1.5s-.8.6-2.1 1.1c-1.9.7-3.9.7-4.8-.4-.8-1-.4-2.2.6-3 1.5-1.4 3.4-3.1 4.7-5.7z"/></svg>'},{id:"fastapi",name:"FastAPI",category:"backend",color:"#059669",keywords:["fastapi","python","api","rest","backend","async"],svg:'<svg viewBox="0 0 24 24" fill="#059669"><circle cx="12" cy="12" r="10"/><path fill="#fff" d="M12.5 5.5l-5 7.5h4l-1 5.5 6-8h-4.5l1.5-5z"/></svg>'},{id:"graphql",name:"GraphQL",category:"backend",color:"#E10098",keywords:["graphql","api","query","schema","backend"],svg:'<svg viewBox="0 0 24 24" fill="#E10098"><path d="M12 2l8.7 5v10L12 22 3.3 17V7L12 2zm0 2.3L4.8 8.4l7.2 4.2 7.2-4.2L12 4.3zm-7.2 5.5v7.4l6.4-3.7-6.4-3.7zm14.4 0l-6.4 3.7 6.4 3.7V9.8z"/></svg>'},{id:"postgresql",name:"PostgreSQL",category:"database",color:"#4169E1",keywords:["postgres","postgresql","sql","relational","database","db"],svg:'<svg viewBox="0 0 24 24" fill="#4169E1"><path d="M12 2a10 10 0 0 0-9.8 8.1c-.8 4.4 1.5 8.8 5.6 10.4 1.3.5 2.7.7 4.2.7s2.9-.2 4.2-.7c4.1-1.6 6.4-6 5.6-10.4A10 10 0 0 0 12 2zm-1.8 14.8c-.8 0-1.5-.7-1.5-1.5s.7-1.5 1.5-1.5 1.5.7 1.5 1.5-.7 1.5-1.5 1.5zm3.6 0c-.8 0-1.5-.7-1.5-1.5s.7-1.5 1.5-1.5 1.5.7 1.5 1.5-.7 1.5-1.5 1.5z"/></svg>'},{id:"mongodb",name:"MongoDB",category:"database",color:"#47A248",keywords:["mongodb","mongo","nosql","document","database","db"],svg:'<svg viewBox="0 0 24 24" fill="#47A248"><path d="M12 2S7 7.5 7 13.5c0 4.2 3.1 7.8 5 8.5 1.9-.7 5-4.3 5-8.5C17 7.5 12 2 12 2zm.3 17.5v-6.3c0-.2.1-.3.3-.3.2 0 .3.1.3.3v6.3c-.2.1-.4.1-.6 0z"/></svg>'},{id:"redis",name:"Redis",category:"database",color:"#DC382D",keywords:["redis","cache","in-memory","nosql","key-value","database"],svg:'<svg viewBox="0 0 24 24" fill="#DC382D"><path d="M21.5 9.5l-9.5-4-9.5 4L12 13.5l9.5-4zm0 5l-9.5 4-9.5-4 1.5-.6 8 3.4 8-3.4 1.5.6zm0 4l-9.5 4-9.5-4 1.5-.6 8 3.4 8-3.4 1.5.6z"/></svg>'},{id:"mysql",name:"MySQL",category:"database",color:"#4479A1",keywords:["mysql","sql","relational","database","db","oracle"],svg:'<svg viewBox="0 0 24 24" fill="#4479A1"><path d="M12 3a9 9 0 0 0-9 9c0 4.5 3.3 8.2 7.7 8.9v-6.3H8.3v-2.6h2.4V10c0-2.4 1.4-3.7 3.6-3.7 1 0 2.1.2 2.1.2v2.3h-1.2c-1.2 0-1.6.7-1.6 1.5v1.7h2.7l-.4 2.6h-2.3v6.3C18.7 20.2 22 16.5 22 12a9 9 0 0 0-9-9z"/></svg>'},{id:"supabase",name:"Supabase",category:"database",color:"#3ECF8E",keywords:["supabase","postgres","baas","auth","realtime","database"],svg:'<svg viewBox="0 0 24 24"><path fill="#3ECF8E" d="M13.4 2.2a1 1 0 0 0-1.4.3L3.3 15.6a1 1 0 0 0 .8 1.5h7.6l-1.3 4.7a1 1 0 0 0 1.6.9l9.3-11.4a1 1 0 0 0-.8-1.6h-8.2l1.7-6.9a1 1 0 0 0-.6-.6z"/></svg>'},{id:"prisma",name:"Prisma ORM",category:"database",color:"#2D3748",keywords:["prisma","orm","database","schema","typescript","postgres"],svg:'<svg viewBox="0 0 24 24" fill="#2D3748"><path d="M12.7 2.3a1 1 0 0 0-1.4 0L2.5 11.1a1 1 0 0 0 0 1.4l8.8 8.8a1 1 0 0 0 1.4 0l8.8-8.8a1 1 0 0 0 0-1.4L12.7 2.3zM12 5.4l5.6 5.6-5.6 5.6-5.6-5.6L12 5.4z"/></svg>'},{id:"firebase",name:"Firebase",category:"database",color:"#FFCA28",keywords:["firebase","google","firestore","nosql","auth","cloud"],svg:'<svg viewBox="0 0 24 24"><path fill="#FFA000" d="M3.9 14.5L6.4 2.8a.7.7 0 0 1 1.3-.2l3.4 6.4-7.2 5.5z"/><path fill="#F57F17" d="M14.5 9.4L12.7 6a.7.7 0 0 0-1.3 0L3.9 14.5l10.6-5.1z"/><path fill="#FFCA28" d="M20.1 14.5l-1.7-10.4a.7.7 0 0 0-1.3-.3l-9.8 15.2 12.8-4.5z"/></svg>'},{id:"docker",name:"Docker",category:"cloud",color:"#2496ED",keywords:["docker","container","devops","kubernetes","cloud"],svg:'<svg viewBox="0 0 24 24" fill="#2496ED"><path d="M22.5 10.5c-.3-.2-1.5-.3-2.3.3-.4-.9-1.2-1.6-2.2-1.8-.2-.7-.7-1.4-1.5-1.7V7h-2.5v2H11V7H8.5v2H6V7H3.5v4.5C2 12 1 13.5 1 15.2c0 3.8 3.5 6.8 9.5 6.8 6.5 0 10.5-3.3 11.5-8 .8-.3 1.5-1.5 1.5-2.5-.3-.5-.7-.8-1-.1zM6 10h2V8H6v2zm3 0h2V8H9v2zm3 0h2V8h-2v2zm3 0h2V8h-2v2z"/></svg>'},{id:"kubernetes",name:"Kubernetes",category:"cloud",color:"#326CE5",keywords:["k8s","kubernetes","cloud","orchestration","docker","devops"],svg:'<svg viewBox="0 0 24 24" fill="#326CE5"><path d="M12 2l9.5 5.5v11L12 22l-9.5-3.5v-11L12 2zm0 2.8L4.5 9.2v7.6L12 19.2l7.5-2.4V9.2L12 4.8zm0 3.2a4 4 0 1 1 0 8 4 4 0 0 1 0-8z"/></svg>'},{id:"aws",name:"AWS",category:"cloud",color:"#FF9900",keywords:["aws","amazon","cloud","ec2","s3","lambda","serverless"],svg:'<svg viewBox="0 0 24 24"><path fill="#FF9900" d="M18.8 15.8c-2.4 1.7-5.7 2.6-8.7 2.6-4.1 0-7.8-1.5-10.6-4.1-.2-.2 0-.5.3-.4 3 1.7 6.6 2.7 10.3 2.7 2.6 0 5.6-.6 8.3-2 .4-.3.8.2.4.6v.6zm1.3-.9c-.3-.4-1.9-.2-2.7-.1-.2 0-.3-.2-.1-.3 1.1-.9 2.9-.6 3.2-.2.3.4-.1 2.3-1.1 3.2-.2.2-.4.1-.3-.1.4-.7 1.2-2.1 1-2.5z"/><path fill="#232F3E" d="M8.2 12.7c0 1.2-.8 1.9-1.9 1.9s-1.8-.7-1.8-1.9c0-1.2.7-1.9 1.8-1.9 1.1 0 1.9.7 1.9 1.9zm5.3-2.3v3.9c0 1-.3 1.8-1 2.3-.7.5-1.7.7-2.9.7-1.5 0-2.8-.4-3.5-1l.7-1.2c.6.5 1.6.8 2.6.8 1.3 0 2-.6 2-1.7v-.4c-.5.6-1.3 1-2.3 1-1.8 0-3.1-1.3-3.1-3.2 0-1.9 1.3-3.3 3.1-3.3 1.1 0 1.9.4 2.4 1.1V8h1.9v2.4h.1z"/></svg>'},{id:"gcp",name:"Google Cloud",category:"cloud",color:"#4285F4",keywords:["gcp","google","cloud","kubernetes","bigquery"],svg:'<svg viewBox="0 0 24 24"><path fill="#EA4335" d="M12 4.5a7.5 7.5 0 0 0-7.2 5.4l2.9 1.1A4.5 4.5 0 0 1 12 7.5c1.4 0 2.6.6 3.4 1.6l2.2-2.2A7.5 7.5 0 0 0 12 4.5z"/><path fill="#4285F4" d="M19.5 12c0-.4 0-.9-.1-1.3H12v3h4.3a3.8 3.8 0 0 1-1.6 2.4l2.4 1.9c1.4-1.3 2.4-3.4 2.4-6z"/><path fill="#FBBC05" d="M7.7 11l-2.9-1.1A7.5 7.5 0 0 0 4.5 12c0 1.4.4 2.7 1.1 3.8l2.6-1.8A4.5 4.5 0 0 1 7.7 11z"/><path fill="#34A853" d="M12 19.5c2.1 0 3.9-.7 5.2-2l-2.4-1.9c-.7.5-1.6.9-2.8.9a4.5 4.5 0 0 1-4.2-3.1L5.2 15.2A7.5 7.5 0 0 0 12 19.5z"/></svg>'},{id:"vercel",name:"Vercel",category:"cloud",color:"#000000",keywords:["vercel","nextjs","deployment","hosting","serverless","cloud"],svg:'<svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2L2 20h20L12 2z"/></svg>'},{id:"cloudflare",name:"Cloudflare",category:"cloud",color:"#F38020",keywords:["cloudflare","cdn","dns","security","workers","edge"],svg:'<svg viewBox="0 0 24 24" fill="#F38020"><path d="M18.2 9.5a5.5 5.5 0 0 0-10.4-1.3A4.5 4.5 0 0 0 4 12.5a4.5 4.5 0 0 0 4.5 4.5h11a3.5 3.5 0 0 0 .7-6.9v-.6z"/></svg>'},{id:"linux",name:"Linux",category:"cloud",color:"#FCC624",keywords:["linux","ubuntu","debian","server","os","kernel"],svg:'<svg viewBox="0 0 24 24"><path fill="#333" d="M12 2a4 4 0 0 0-4 4v4a4 4 0 0 0 8 0V6a4 4 0 0 0-4-4z"/><path fill="#FCC624" d="M12 12c-3.3 0-6 2.7-6 6v2h12v-2c0-3.3-2.7-6-6-6z"/><circle cx="10" cy="6" r="1" fill="#fff"/><circle cx="14" cy="6" r="1" fill="#fff"/><path fill="#FFA500" d="M11 8h2l-1 2-1-2z"/></svg>'},{id:"nginx",name:"NGINX",category:"cloud",color:"#009639",keywords:["nginx","proxy","web-server","load-balancer","cloud"],svg:'<svg viewBox="0 0 24 24" fill="#009639"><path d="M12 2L3 7.2v9.6L12 22l9-5.2V7.2L12 2zm-4.5 6.2h2.2l4.8 7.3v-7.3h2v9.6h-2.2L9.5 10.5v7.3h-2V8.2z"/></svg>'},{id:"terraform",name:"Terraform",category:"cloud",color:"#844FBA",keywords:["terraform","iac","cloud","infrastructure","devops"],svg:'<svg viewBox="0 0 24 24" fill="#844FBA"><path d="M1.5 3.5l6.5 3.8v7.5l-6.5-3.8V3.5zm7.5 4.4l6.5-3.8v7.5l-6.5 3.8V7.9zm0 8.8l6.5-3.8v7.5L9 24.2v-7.5zm7.5-13.2L23 7.3v7.5l-6.5-3.8V3.5z"/></svg>'},{id:"openai",name:"OpenAI / AI",category:"tools",color:"#10A37F",keywords:["openai","chatgpt","ai","llm","gpt","model"],svg:'<svg viewBox="0 0 24 24" fill="#10A37F"><path d="M22.3 10.7a6.2 6.2 0 0 0-.5-4.8 6.3 6.3 0 0 0-6.1-3.1 6.3 6.3 0 0 0-4.6-2 6.3 6.3 0 0 0-5.8 4 6.3 6.3 0 0 0-4 2.8 6.3 6.3 0 0 0 .7 6.8 6.2 6.2 0 0 0 .5 4.8 6.3 6.3 0 0 0 6.1 3.1 6.3 6.3 0 0 0 4.6 2 6.3 6.3 0 0 0 5.8-4 6.3 6.3 0 0 0 4-2.8 6.3 6.3 0 0 0-.7-6.8zm-9.3 10.4a4.8 4.8 0 0 1-3.3-1.3l.1-.1 3.8-2.2a.7.7 0 0 0 .4-.6v-5.2l1.6.9v4.4a4.8 4.8 0 0 1-2.6 4.1zm-7.6-3.4a4.8 4.8 0 0 1-.6-3.5l.1.1 3.8 2.2a.7.7 0 0 0 .7 0l4.5-2.6v1.9l-3.8 2.2a4.8 4.8 0 0 1-4.7-.3zm-1.8-7.9a4.8 4.8 0 0 1 2.7-2.2v4.6a.7.7 0 0 0 .4.6l4.5 2.6-1.6.9-3.8-2.2a4.8 4.8 0 0 1-2.2-4.3zm13.1 2.6l-4.5-2.6 1.6-.9 3.8 2.2a4.8 4.8 0 0 1 2.2 4.3 4.8 4.8 0 0 1-2.7 2.2v-4.6a.7.7 0 0 0-.4-.6zm2.3-3.6a4.8 4.8 0 0 1 .6 3.5l-.1-.1-3.8-2.2a.7.7 0 0 0-.7 0l-4.5 2.6v-1.9l3.8-2.2a4.8 4.8 0 0 1 4.7.3zm-6.8-5.3a4.8 4.8 0 0 1 3.3 1.3l-.1.1-3.8 2.2a.7.7 0 0 0-.4.6v5.2l-1.6-.9V8.5a4.8 4.8 0 0 1 2.6-4.1zm-1.6 7.3l2-1.2 2 1.2v2.3l-2 1.2-2-1.2v-2.3z"/></svg>'},{id:"github",name:"GitHub",category:"tools",color:"#181717",keywords:["github","git","repo","vcs","code","devops"],svg:'<svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2A10 10 0 0 0 2 12c0 4.4 2.9 8.2 6.8 9.5.5.1.7-.2.7-.5v-1.7c-2.8.6-3.4-1.4-3.4-1.4-.4-1.2-1.1-1.5-1.1-1.5-.9-.6.1-.6.1-.6 1 .1 1.6 1.1 1.6 1.1.9 1.6 2.4 1.1 3 .9.1-.7.4-1.1.7-1.4-2.2-.3-4.6-1.1-4.6-5 0-1.1.4-2 1-2.8 0-.3-.4-1.3.1-2.7 0 0 .9-.3 2.8 1.1a10 10 0 0 1 5.2 0c2-1.4 2.8-1.1 2.8-1.1.5 1.4.2 2.4.1 2.7.7.8 1 1.7 1 2.8 0 3.9-2.4 4.7-4.6 5 .4.3.7.9.7 1.9v2.8c0 .3.2.6.7.5A10 10 0 0 0 22 12 10 10 0 0 0 12 2z"/></svg>'},{id:"kafka",name:"Apache Kafka",category:"tools",color:"#231F20",keywords:["kafka","event","streaming","queue","message","pubsub"],svg:'<svg viewBox="0 0 24 24" fill="currentColor"><circle cx="12" cy="12" r="3"/><circle cx="5" cy="8" r="2.5"/><circle cx="5" cy="16" r="2.5"/><circle cx="19" cy="8" r="2.5"/><circle cx="19" cy="16" r="2.5"/><line x1="7.2" y1="9" x2="9.8" y2="10.8" stroke="currentColor" stroke-width="1.8"/><line x1="7.2" y1="15" x2="9.8" y2="13.2" stroke="currentColor" stroke-width="1.8"/><line x1="16.8" y1="9" x2="14.2" y2="10.8" stroke="currentColor" stroke-width="1.8"/><line x1="16.8" y1="15" x2="14.2" y2="13.2" stroke="currentColor" stroke-width="1.8"/></svg>'},{id:"stripe",name:"Stripe",category:"tools",color:"#635BFF",keywords:["stripe","payment","billing","checkout","api"],svg:'<svg viewBox="0 0 24 24" fill="#635BFF"><path d="M13.9 10.4c0-.9-.7-1.3-1.8-1.3-1.6 0-3.6.6-4.9 1.4L6 6.8c1.6-.9 4-1.5 6.4-1.5 4.6 0 7.6 2.3 7.6 6.3 0 6.1-8.4 5.2-8.4 7.8 0 1 .9 1.4 2.2 1.4 1.9 0 4.3-.8 5.7-1.8l1.2 3.6c-1.7 1.1-4.4 1.8-7.1 1.8-4.9 0-8.1-2.4-8.1-6.4-.1-6.4 8.4-5.3 8.4-8z"/></svg>'},{id:"postman",name:"Postman",category:"tools",color:"#FF6C37",keywords:["postman","api","testing","rest","http"],svg:'<svg viewBox="0 0 24 24" fill="#FF6C37"><circle cx="12" cy="12" r="10"/><path fill="#fff" d="M16 11.5c-.8-.8-2-1.3-3.2-1.3H9v4.5h1.5v-1.7h2.1c.8 0 1.5-.3 2-1 .5-.6.6-1.5-.2-2zm-3.2 1.8h-2.3v-1.7h2.3c.7 0 1.1.4 1.1.9s-.4.8-1.1.8z"/></svg>'}];function Xa(e,t){let r=e.svg.trim();r.includes("xmlns=")||(r=r.replace("<svg",'<svg xmlns="http://www.w3.org/2000/svg"')),!r.includes("width=")&&!r.includes("height=")&&(r=r.replace("<svg",'<svg width="128" height="128"'));try{if(typeof window<"u"){let o=new TextEncoder().encode(r),p="";for(let c=0;c<o.length;c++)p+=String.fromCharCode(o[c]);return `data:image/svg+xml;base64,${window.btoa(p)}`}}catch{}return `data:image/svg+xml;charset=utf-8,${encodeURIComponent(r)}`}function $n({isOpen:e,onClose:t,onInsertTechStencil:r}){let[o,p]=Ln.useState(""),[c,l]=Ln.useState("all"),[s,n]=Ln.useState("badge"),u=Ln.useRef(null),i=Ln.useRef(null);if(Ln.useEffect(()=>{if(e){let a=setTimeout(()=>{u.current?.focus();},100);return ()=>clearTimeout(a)}},[e]),Ln.useEffect(()=>{let a=x=>{x.key==="Escape"&&e&&t();};return window.addEventListener("keydown",a),()=>window.removeEventListener("keydown",a)},[e,t]),!e)return null;let d=En.filter(a=>{let x=c==="all"||a.category===c,b=o.toLowerCase().trim();if(!b)return x;let k=a.name.toLowerCase().includes(b),y=a.keywords.some(_=>_.toLowerCase().includes(b));return x&&(k||y)}),h=a=>{let x=Xa(a);r(x,a.name,s),t();};return jsxRuntime.jsx("div",{role:"dialog","aria-modal":"true","aria-labelledby":"tech-stencils-title",className:"fixed inset-0 z-50 flex items-center justify-center p-4 bg-black/40 dark:bg-black/60 backdrop-blur-sm animate-in fade-in duration-150",onClick:a=>{a.target===a.currentTarget&&t();},children:jsxRuntime.jsxs("div",{ref:i,className:"fk-card w-full max-w-2xl bg-[#eef1f6]/98 dark:bg-[#15161a]/98 backdrop-blur-3xl rounded-[22px] border border-white/80 dark:border-white/[0.08] shadow-[-8px_-8px_24px_rgba(255,255,255,0.9),_12px_12px_32px_rgba(166,175,195,0.6)] dark:shadow-[-6px_-6px_20px_rgba(255,255,255,0.03),_12px_12px_36px_rgba(0,0,0,0.95)] overflow-hidden flex flex-col max-h-[85vh] animate-in zoom-in-95 duration-150",children:[jsxRuntime.jsxs("div",{className:"flex items-center justify-between px-6 pt-5 pb-3 border-b border-black/5 dark:border-white/5",children:[jsxRuntime.jsxs("div",{className:"flex items-center gap-2.5",children:[jsxRuntime.jsx("div",{className:"w-8 h-8 rounded-[10px] bg-primary text-white flex items-center justify-center shadow-md",children:jsxRuntime.jsx(iconsReact.IconBracketsContain,{size:18,stroke:2})}),jsxRuntime.jsxs("div",{children:[jsxRuntime.jsxs("h2",{id:"tech-stencils-title",className:"text-base font-bold text-neutral-800 dark:text-neutral-100 flex items-center gap-2",children:["Developer & Cloud Stencils",jsxRuntime.jsx("span",{className:"text-[10px] px-2 py-0.5 rounded-full bg-primary/10 text-primary dark:text-foreground border border-primary/20 font-semibold",children:"30+ Logos"})]}),jsxRuntime.jsx("p",{className:"text-xs text-neutral-500 dark:text-neutral-400",children:"1-click insert official tech icons for system design & architecture diagrams"})]})]}),jsxRuntime.jsx("button",{type:"button",onClick:t,className:"w-7 h-7 rounded-[8px] flex items-center justify-center text-neutral-400 hover:text-neutral-700 dark:hover:text-neutral-200 hover:bg-neutral-200/50 dark:hover:bg-neutral-800/50 transition-colors cursor-pointer",children:jsxRuntime.jsx(iconsReact.IconX,{size:16})})]}),jsxRuntime.jsxs("div",{className:"px-6 pt-3 pb-2 flex flex-col sm:flex-row gap-2.5 items-stretch sm:items-center justify-between",children:[jsxRuntime.jsxs("div",{className:"relative flex-1",children:[jsxRuntime.jsx(iconsReact.IconSearch,{size:16,className:"absolute left-3 top-1/2 -translate-y-1/2 text-neutral-400 dark:text-neutral-500 pointer-events-none"}),jsxRuntime.jsx("input",{ref:u,type:"text",value:o,onChange:a=>p(a.target.value),placeholder:"Search React, Docker, Postgres, AWS, Python...",className:"w-full pl-9 pr-8 py-2 text-xs rounded-[11px] bg-white/80 dark:bg-[#1f2128]/80 border border-neutral-300/80 dark:border-neutral-700/80 text-neutral-900 dark:text-neutral-100 placeholder:text-neutral-400 focus:outline-none focus:ring-2 focus:ring-primary/40 shadow-inner"}),o&&jsxRuntime.jsx("button",{type:"button",onClick:()=>p(""),className:"absolute right-2.5 top-1/2 -translate-y-1/2 text-neutral-400 hover:text-neutral-600 dark:hover:text-neutral-200",children:jsxRuntime.jsx(iconsReact.IconX,{size:13})})]}),jsxRuntime.jsxs("div",{className:"flex items-center gap-1 p-0.5 rounded-[10px] bg-[#e4e8ef] dark:bg-[#121316] border border-white/60 dark:border-white/[0.04] shrink-0",children:[jsxRuntime.jsx("button",{type:"button",onClick:()=>n("badge"),title:"Insert as styled card with label",className:`px-2.5 py-1 text-[11px] font-medium rounded-[8px] transition-all cursor-pointer ${s==="badge"?"bg-[#f0f3f8] dark:bg-[#22242b] text-primary dark:text-foreground font-bold shadow-sm":"text-neutral-500 dark:text-neutral-400 hover:text-neutral-800 dark:hover:text-neutral-200"}`,children:"Badge Card"}),jsxRuntime.jsx("button",{type:"button",onClick:()=>n("standalone"),title:"Insert standalone SVG logo icon",className:`px-2.5 py-1 text-[11px] font-medium rounded-[8px] transition-all cursor-pointer ${s==="standalone"?"bg-[#f0f3f8] dark:bg-[#22242b] text-primary dark:text-foreground font-bold shadow-sm":"text-neutral-500 dark:text-neutral-400 hover:text-neutral-800 dark:hover:text-neutral-200"}`,children:"Pure Logo"})]})]}),jsxRuntime.jsx("div",{className:"px-6 py-2 flex items-center gap-1.5 overflow-x-auto no-scrollbar border-b border-black/5 dark:border-white/5",children:Pn.map(a=>jsxRuntime.jsx("button",{type:"button",onClick:()=>l(a.id),className:`px-2.5 py-1 rounded-full text-[11px] font-medium transition-all whitespace-nowrap cursor-pointer ${c===a.id?"bg-primary text-primary-foreground font-semibold shadow-xs":"bg-neutral-200/60 dark:bg-neutral-800/60 text-neutral-600 dark:text-neutral-300 hover:bg-neutral-300/70 dark:hover:bg-neutral-700/70"}`,children:a.label},a.id))}),jsxRuntime.jsxs("div",{className:"flex-1 overflow-y-auto p-6 grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 gap-3",children:[d.map(a=>jsxRuntime.jsxs("button",{type:"button",onClick:()=>h(a),className:"flex items-center gap-3 p-2.5 rounded-[13px] bg-white/70 dark:bg-[#1a1c22]/70 hover:bg-white dark:hover:bg-[#22242c] border border-neutral-200/80 dark:border-neutral-800/80 hover:border-primary/40 dark:hover:border-primary/40 shadow-xs hover:shadow-md hover:-translate-y-0.5 transition-all group cursor-pointer text-left",children:[jsxRuntime.jsx("div",{className:"w-9 h-9 rounded-[9px] flex items-center justify-center p-1.5 shrink-0 bg-neutral-100 dark:bg-neutral-900 border border-black/5 dark:border-white/5 group-hover:scale-105 transition-transform",dangerouslySetInnerHTML:{__html:a.svg}}),jsxRuntime.jsxs("div",{className:"min-w-0 flex-1",children:[jsxRuntime.jsx("div",{className:"text-xs font-semibold text-neutral-800 dark:text-neutral-200 truncate group-hover:text-primary dark:group-hover:text-blue-200 transition-colors",children:a.name}),jsxRuntime.jsx("div",{className:"text-[9px] text-neutral-400 dark:text-neutral-500 capitalize truncate",children:a.category})]}),jsxRuntime.jsx("div",{className:"opacity-0 group-hover:opacity-100 transition-opacity text-primary shrink-0",children:jsxRuntime.jsx(iconsReact.IconPlus,{size:14,stroke:2.5})})]},a.id)),d.length===0&&jsxRuntime.jsxs("div",{className:"col-span-full py-12 flex flex-col items-center justify-center text-center",children:[jsxRuntime.jsx(iconsReact.IconSparkles,{size:32,className:"text-neutral-300 dark:text-neutral-700 mb-2"}),jsxRuntime.jsxs("p",{className:"text-sm font-semibold text-neutral-600 dark:text-neutral-300",children:["No tech stencils found for \u201C",o,"\u201D"]}),jsxRuntime.jsx("p",{className:"text-xs text-neutral-400 mt-0.5",children:"Try searching for React, Python, Docker, PostgreSQL, AWS..."})]})]}),jsxRuntime.jsxs("div",{className:"px-6 py-3 bg-[#e8ecf3]/70 dark:bg-[#121316]/70 border-t border-black/5 dark:border-white/5 flex items-center justify-between text-[11px] text-neutral-500 dark:text-neutral-400",children:[jsxRuntime.jsx("span",{children:"Clicking an icon places it directly onto your canvas."}),jsxRuntime.jsx("span",{className:"font-mono text-[10px] opacity-70",children:"Esc to close"})]})]})})}var _o=[{id:"mindmap",title:"Mind Map Starter",category:"Brainstorming",description:"Central theme with radiating branches for ideation, strategy, and brainstorming sessions.",tag:"Ideation",tagColor:"bg-purple-100 dark:bg-purple-950/60 text-purple-700 dark:text-purple-300 border-purple-200 dark:border-purple-800",elementsCount:13,previewType:"mindmap"},{id:"flowchart",title:"Flowchart Decision Tree",category:"Diagrams",description:"Standard workflow with start pill, process steps, decision diamonds, and return branches.",tag:"Workflow",tagColor:"bg-emerald-100 dark:bg-emerald-950/60 text-emerald-700 dark:text-emerald-300 border-emerald-200 dark:border-emerald-800",elementsCount:11,previewType:"flowchart"},{id:"erd",title:"Entity-Relationship (ERD) Schema",category:"Engineering",description:"Database table models with primary/foreign keys and Crow's Foot relationship connectors.",tag:"Database",tagColor:"bg-blue-100 dark:bg-blue-950/60 text-blue-700 dark:text-blue-300 border-blue-200 dark:border-blue-800",elementsCount:7,previewType:"erd"},{id:"kanban",title:"Kanban / Retrospective Board",category:"Agile & Planning",description:"Organized columns with structured frames and color-coded sticky notes for sprint tracking.",tag:"Sprint Board",tagColor:"bg-amber-100 dark:bg-amber-950/60 text-amber-700 dark:text-amber-300 border-amber-200 dark:border-amber-800",elementsCount:9,previewType:"kanban"},{id:"user_journey",title:"User Journey Map",category:"Agile & Planning",description:"Step-by-step customer experience map tracking user actions, touchpoints, and pain points.",tag:"UX Design",tagColor:"bg-rose-100 dark:bg-rose-950/60 text-rose-700 dark:text-rose-300 border-rose-200 dark:border-rose-800",elementsCount:12,previewType:"journey"}],Ka=0;function tt(e){return Ka+=1,`tmpl_${e}_${Date.now()}_${Ka}_${Math.random().toString(36).substring(2,6)}`}function Ua(e,t,r=false){let o=[];if(e==="mindmap"){let p=t.x,c=t.y,l=tt("center");o.push({id:l,type:"rectangle",x:p-120,y:c-45,width:240,height:90,strokeColor:"#4f46e5",strokeWidth:2.5,strokeStyle:"solid",fillColor:"#e0e7ff",fillStyle:"solid",edgeStyle:"round",opacity:1,zIndex:10}),o.push({id:tt("center_text"),type:"text",x:p-110,y:c-25,width:220,height:50,text:`\u{1F680} Product Vision
|
|
98
|
+
& Strategy`,fontSize:20,fontFamily:"sans",textAlign:"center",strokeColor:"#312e81",strokeWidth:2,strokeStyle:"solid",fillColor:"transparent",fillStyle:"solid",opacity:1,zIndex:11}),[{title:"\u{1F4A1} Ideation & Research",sub:["User Surveys & Data","Competitive Analysis"],dx:-360,dy:-180,color:"#0284c7",bg:"#e0f2fe"},{title:"\u{1F3A8} Design & UX",sub:["Design System","Interactive Prototype"],dx:360,dy:-180,color:"#d97706",bg:"#fef3c7"},{title:"\u26A1 Core Architecture",sub:["Canvas Engine API","Realtime Sync"],dx:-360,dy:180,color:"#16a34a",bg:"#dcfce7"},{title:"\u{1F4C8} Launch & Growth",sub:["Product Hunt Launch","Docs & Tutorials"],dx:360,dy:180,color:"#e11d48",bg:"#ffe4e6"}].forEach((n,u)=>{let i=p+n.dx,d=c+n.dy,h=tt(`branch_${u}`);o.push({id:h,type:"rectangle",x:i-100,y:d-35,width:200,height:70,strokeColor:n.color,strokeWidth:2,strokeStyle:"solid",fillColor:n.bg,fillStyle:"solid",edgeStyle:"round",opacity:1,zIndex:10}),o.push({id:tt(`branch_text_${u}`),type:"text",x:i-90,y:d-16,width:180,height:32,text:n.title,fontSize:16,fontFamily:"sans",textAlign:"center",strokeColor:n.color,strokeWidth:2,strokeStyle:"solid",fillColor:"transparent",fillStyle:"solid",opacity:1,zIndex:11});let a=n.dx<0?p-120:p+120,x=c,b=n.dx<0?i+100:i-100,k=d;o.push({id:tt(`arrow_${u}`),type:"arrow",arrowType:"curved",x:a,y:x,width:b-a,height:k-x,strokeColor:n.color,strokeWidth:2,strokeStyle:"solid",fillColor:"transparent",fillStyle:"solid",endArrowhead:"arrow",opacity:.85,zIndex:5}),n.sub.forEach((y,_)=>{let S=i+(n.dx<0?-190:190),P=d+(_===0?-40:40);o.push({id:tt(`sub_${u}_${_}`),type:"rectangle",x:S-75,y:P-22,width:150,height:44,strokeColor:"#cbd5e1",strokeWidth:1.5,strokeStyle:"dashed",fillColor:"#ffffff",fillStyle:"solid",edgeStyle:"round",opacity:1,zIndex:8}),o.push({id:tt(`sub_txt_${u}_${_}`),type:"text",x:S-70,y:P-12,width:140,height:24,text:y,fontSize:13,fontFamily:"sans",textAlign:"center",strokeColor:"#334155",strokeWidth:1.5,strokeStyle:"solid",fillColor:"transparent",fillStyle:"solid",opacity:1,zIndex:9});let R=n.dx<0?i-100:i+100,I=n.dx<0?S+75:S-75;o.push({id:tt(`sub_line_${u}_${_}`),type:"line",arrowType:"straight",x:R,y:d,width:I-R,height:P-d,strokeColor:"#cbd5e1",strokeWidth:1.5,strokeStyle:"dotted",fillColor:"transparent",fillStyle:"solid",opacity:.7,zIndex:4});});});}else if(e==="flowchart"){let p=t.x,c=t.y-280;o.push({id:tt("fc_start"),type:"rectangle",x:p-110,y:c,width:220,height:60,strokeColor:"#059669",strokeWidth:2,strokeStyle:"solid",fillColor:"#d1fae5",fillStyle:"solid",edgeStyle:"round",opacity:1,zIndex:10}),o.push({id:tt("fc_start_txt"),type:"text",x:p-100,y:c+18,width:200,height:24,text:"\u{1F7E2} User Submits Form",fontSize:16,fontFamily:"sans",textAlign:"center",strokeColor:"#065f46",strokeWidth:2,strokeStyle:"solid",fillColor:"transparent",fillStyle:"solid",opacity:1,zIndex:11}),o.push({id:tt("fc_arr1"),type:"arrow",x:p,y:c+60,width:0,height:60,strokeColor:"#475569",strokeWidth:2,strokeStyle:"solid",fillColor:"transparent",fillStyle:"solid",endArrowhead:"arrow",opacity:1,zIndex:5});let l=c+120;o.push({id:tt("fc_proc"),type:"rectangle",x:p-120,y:l,width:240,height:70,strokeColor:"#4f46e5",strokeWidth:2,strokeStyle:"solid",fillColor:"#e0e7ff",fillStyle:"solid",opacity:1,zIndex:10}),o.push({id:tt("fc_proc_txt"),type:"text",x:p-110,y:l+22,width:220,height:26,text:"\u2699\uFE0F Validate Request Payload",fontSize:15,fontFamily:"sans",textAlign:"center",strokeColor:"#3730a3",strokeWidth:2,strokeStyle:"solid",fillColor:"transparent",fillStyle:"solid",opacity:1,zIndex:11}),o.push({id:tt("fc_arr2"),type:"arrow",x:p,y:l+70,width:0,height:60,strokeColor:"#475569",strokeWidth:2,strokeStyle:"solid",fillColor:"transparent",fillStyle:"solid",endArrowhead:"arrow",opacity:1,zIndex:5});let s=l+130;o.push({id:tt("fc_diam"),type:"diamond",x:p-90,y:s,width:180,height:120,strokeColor:"#d97706",strokeWidth:2,strokeStyle:"solid",fillColor:"#fef3c7",fillStyle:"solid",opacity:1,zIndex:10}),o.push({id:tt("fc_diam_txt"),type:"text",x:p-75,y:s+45,width:150,height:30,text:"Is Input Valid?",fontSize:15,fontFamily:"sans",textAlign:"center",strokeColor:"#92400e",strokeWidth:2,strokeStyle:"solid",fillColor:"transparent",fillStyle:"solid",opacity:1,zIndex:11});let n=p+220;o.push({id:tt("fc_arr_yes"),type:"arrow",x:p+90,y:s+60,width:130,height:0,strokeColor:"#16a34a",strokeWidth:2,strokeStyle:"solid",fillColor:"transparent",fillStyle:"solid",endArrowhead:"arrow",opacity:1,zIndex:5}),o.push({id:tt("fc_lbl_yes"),type:"text",x:p+120,y:s+36,width:50,height:20,text:"YES",fontSize:12,fontFamily:"sans",textAlign:"center",strokeColor:"#15803d",strokeWidth:2,strokeStyle:"solid",fillColor:"transparent",fillStyle:"solid",opacity:1,zIndex:11}),o.push({id:tt("fc_succ"),type:"rectangle",x:n,y:s+25,width:200,height:70,strokeColor:"#16a34a",strokeWidth:2,strokeStyle:"solid",fillColor:"#dcfce7",fillStyle:"solid",edgeStyle:"round",opacity:1,zIndex:10}),o.push({id:tt("fc_succ_txt"),type:"text",x:n+10,y:s+45,width:180,height:30,text:`\u2728 Generate Auth Token
|
|
99
|
+
& Redirect Dashboard`,fontSize:13,fontFamily:"sans",textAlign:"center",strokeColor:"#166534",strokeWidth:2,strokeStyle:"solid",fillColor:"transparent",fillStyle:"solid",opacity:1,zIndex:11});let u=p-380;o.push({id:tt("fc_arr_no"),type:"arrow",x:p-90,y:s+60,width:-130,height:0,strokeColor:"#dc2626",strokeWidth:2,strokeStyle:"solid",fillColor:"transparent",fillStyle:"solid",endArrowhead:"arrow",opacity:1,zIndex:5}),o.push({id:tt("fc_lbl_no"),type:"text",x:p-170,y:s+36,width:40,height:20,text:"NO",fontSize:12,fontFamily:"sans",textAlign:"center",strokeColor:"#b91c1c",strokeWidth:2,strokeStyle:"solid",fillColor:"transparent",fillStyle:"solid",opacity:1,zIndex:11}),o.push({id:tt("fc_err"),type:"rectangle",x:u,y:s+25,width:160,height:70,strokeColor:"#dc2626",strokeWidth:2,strokeStyle:"solid",fillColor:"#fee2e2",fillStyle:"solid",edgeStyle:"round",opacity:1,zIndex:10}),o.push({id:tt("fc_err_txt"),type:"text",x:u+10,y:s+45,width:140,height:30,text:`\u26A0\uFE0F Show 400 Error
|
|
100
|
+
Highlight Fields`,fontSize:13,fontFamily:"sans",textAlign:"center",strokeColor:"#991b1b",strokeWidth:2,strokeStyle:"solid",fillColor:"transparent",fillStyle:"solid",opacity:1,zIndex:11}),o.push({id:tt("fc_loopback"),type:"arrow",arrowType:"elbow",x:u+80,y:s+25,width:p-110-(u+80),height:c+30-(s+25),strokeColor:"#94a3b8",strokeWidth:1.8,strokeStyle:"dashed",fillColor:"transparent",fillStyle:"solid",endArrowhead:"arrow",opacity:.8,zIndex:4});}else if(e==="erd"){let p=t.x,c=t.y;[{name:"users",x:p-340,y:c-180,headerBg:"#4f46e5",bodyText:`\u{1F511} id: uuid (PK)
|
|
101
|
+
\u{1F464} email: varchar(255)
|
|
102
|
+
\u{1F512} password_hash: text
|
|
103
|
+
\u{1F3F7}\uFE0F name: varchar(100)
|
|
104
|
+
\u{1F4C5} created_at: timestamptz`},{name:"orders",x:p+80,y:c-180,headerBg:"#059669",bodyText:`\u{1F511} id: uuid (PK)
|
|
105
|
+
\u{1F517} user_id: uuid (FK)
|
|
106
|
+
\u{1F4B5} total_amount: decimal
|
|
107
|
+
\u{1F4E6} status: order_status
|
|
108
|
+
\u{1F4C5} placed_at: timestamptz`},{name:"order_items",x:p+80,y:c+120,headerBg:"#d97706",bodyText:`\u{1F511} id: uuid (PK)
|
|
109
|
+
\u{1F517} order_id: uuid (FK)
|
|
110
|
+
\u{1F517} product_id: uuid (FK)
|
|
111
|
+
\u{1F522} quantity: integer
|
|
112
|
+
\u{1F4B2} unit_price: decimal`},{name:"products",x:p-340,y:c+120,headerBg:"#e11d48",bodyText:`\u{1F511} id: uuid (PK)
|
|
113
|
+
\u{1F3F7}\uFE0F title: varchar(200)
|
|
114
|
+
\u{1F516} sku: varchar(50)
|
|
115
|
+
\u{1F4B0} price: decimal
|
|
116
|
+
\u{1F4E6} stock_count: integer`}].forEach(s=>{o.push({id:tt(`erd_${s.name}`),type:"rectangle",x:s.x,y:s.y,width:240,height:180,strokeColor:"#cbd5e1",strokeWidth:2,strokeStyle:"solid",fillColor:"#ffffff",fillStyle:"solid",edgeStyle:"round",opacity:1,zIndex:10}),o.push({id:tt(`erd_hdr_${s.name}`),type:"rectangle",x:s.x,y:s.y,width:240,height:38,strokeColor:s.headerBg,strokeWidth:0,strokeStyle:"solid",fillColor:s.headerBg,fillStyle:"solid",edgeStyle:"round",opacity:1,zIndex:11}),o.push({id:tt(`erd_hdrtxt_${s.name}`),type:"text",x:s.x+12,y:s.y+9,width:216,height:20,text:`\u{1F5C4}\uFE0F ${s.name.toUpperCase()}`,fontSize:14,fontFamily:"mono",textAlign:"left",strokeColor:"#ffffff",strokeWidth:2,strokeStyle:"solid",fillColor:"transparent",fillStyle:"solid",opacity:1,zIndex:12}),o.push({id:tt(`erd_body_${s.name}`),type:"text",x:s.x+14,y:s.y+48,width:212,height:128,text:s.bodyText,fontSize:13,fontFamily:"mono",textAlign:"left",strokeColor:"#334155",strokeWidth:1.5,strokeStyle:"solid",fillColor:"transparent",fillStyle:"solid",opacity:1,zIndex:12});}),o.push({id:tt("erd_rel_users_orders"),type:"arrow",arrowType:"straight",x:p-100,y:c-90,width:180,height:0,strokeColor:"#4f46e5",strokeWidth:2,strokeStyle:"solid",fillColor:"transparent",fillStyle:"solid",startArrowhead:"crowfoot_strictly_one",endArrowhead:"crowfoot_zero_many",opacity:.9,zIndex:6}),o.push({id:tt("erd_rel_orders_items"),type:"arrow",arrowType:"straight",x:p+200,y:c,width:0,height:120,strokeColor:"#059669",strokeWidth:2,strokeStyle:"solid",fillColor:"transparent",fillStyle:"solid",startArrowhead:"crowfoot_strictly_one",endArrowhead:"crowfoot_one_many",opacity:.9,zIndex:6}),o.push({id:tt("erd_rel_products_items"),type:"arrow",arrowType:"straight",x:p-100,y:c+210,width:180,height:0,strokeColor:"#e11d48",strokeWidth:2,strokeStyle:"solid",fillColor:"transparent",fillStyle:"solid",startArrowhead:"crowfoot_strictly_one",endArrowhead:"crowfoot_zero_many",opacity:.9,zIndex:6});}else if(e==="kanban"){let p=t.x,c=t.y;[{title:"\u{1F3AF} To Do (Backlog)",x:p-480,y:c-240,w:300,h:480,stickies:[{text:"Implement WebSocket sync engine for multi-tab collaboration",color:"#fef08a"},{text:"Add SVG icon library preset picker into left tool rail",color:"#e0e7ff"}]},{title:"\u26A1 In Progress",x:p-150,y:c-240,w:300,h:480,stickies:[{text:"Build diagram templates & starter kits with instant preview",color:"#fbcfe8"},{text:"ERD Crow's foot arrow connector endpoint rendering",color:"#cffafe"}]},{title:"\u2705 Done & Shipped",x:p+180,y:c-240,w:300,h:480,stickies:[{text:"Canvas Presentation slideshow mode with frame step navigation",color:"#bbf7d0"},{text:"Copy Image directly to system clipboard (Ctrl+Shift+C)",color:"#fed7aa"}]}].forEach(s=>{o.push({id:tt(`frame_${s.title}`),type:"frame",frameLabel:s.title,x:s.x,y:s.y,width:s.w,height:s.h,strokeColor:"#6366f1",strokeWidth:1.5,strokeStyle:"dashed",fillColor:"rgba(248, 250, 252, 0.5)",fillStyle:"solid",opacity:1,zIndex:2}),s.stickies.forEach((n,u)=>{o.push({id:tt(`sticky_${s.title}_${u}`),type:"sticky",x:s.x+24,y:s.y+40+u*190,width:s.w-48,height:160,text:n.text,fontSize:16,fontFamily:"comic",textAlign:"center",strokeColor:"#1e293b",strokeWidth:1,strokeStyle:"solid",fillColor:n.color,stickyColor:n.color,fillStyle:"solid",opacity:1,zIndex:8});});});}else if(e==="user_journey"){let p=t.x,c=t.y;[{name:"1. Discover \u{1F50D}",action:"Searches for online whiteboard on Google & social",emotion:"\u{1F914} Curious",pain:"Too many complex tools requiring credit cards",opp:"Clear instant demo button with zero signup barrier",x:p-480},{name:"2. Explore \u{1F9ED}",action:"Draws flowcharts, mindmaps & tries sticky notes",emotion:"\u{1F929} Delighted",pain:"Hard to align multiple shapes cleanly",opp:"One-click auto distribute & quick-branch (+) creator",x:p-160},{name:"3. Convert \u{1F4B3}",action:"Exports high-res PNG & presents slides to team",emotion:"\u{1F680} Empowered",pain:"Needs offline backup & copy to clipboard",opp:"Ctrl+Shift+C transparent PNG clipboard copy",x:p+160},{name:"4. Retain \u{1F496}",action:"Uses SketchBoard daily for sprint planning & specs",emotion:"\u{1F3C6} Champion",pain:"Wants reusable starter templates",opp:"Pre-built diagram library & starter kits",x:p+480}].forEach(s=>{let i=c-280;o.push({id:tt(`uj_frame_${s.name}`),type:"frame",frameLabel:s.name,x:s.x-280/2,y:i,width:280,height:560,strokeColor:"#8b5cf6",strokeWidth:1.5,strokeStyle:"dashed",fillColor:"rgba(245, 243, 255, 0.45)",fillStyle:"solid",opacity:1,zIndex:2}),o.push({id:tt(`uj_act_${s.name}`),type:"sticky",x:s.x-115,y:i+30,width:230,height:110,text:`\u{1F3AF} ACTION:
|
|
117
|
+
${s.action}`,fontSize:15,fontFamily:"comic",textAlign:"center",strokeColor:"#1e293b",strokeWidth:1,strokeStyle:"solid",fillColor:"#e0f2fe",stickyColor:"#e0f2fe",fillStyle:"solid",opacity:1,zIndex:6}),o.push({id:tt(`uj_pain_${s.name}`),type:"sticky",x:s.x-115,y:i+160,width:230,height:120,text:`\u26A0\uFE0F PAIN POINT (${s.emotion}):
|
|
118
|
+
${s.pain}`,fontSize:15,fontFamily:"comic",textAlign:"center",strokeColor:"#1e293b",strokeWidth:1,strokeStyle:"solid",fillColor:"#fee2e2",stickyColor:"#fee2e2",fillStyle:"solid",opacity:1,zIndex:6}),o.push({id:tt(`uj_opp_${s.name}`),type:"sticky",x:s.x-115,y:i+300,width:230,height:130,text:`\u{1F4A1} OPPORTUNITY:
|
|
119
|
+
${s.opp}`,fontSize:15,fontFamily:"comic",textAlign:"center",strokeColor:"#1e293b",strokeWidth:1,strokeStyle:"solid",fillColor:"#dcfce7",stickyColor:"#dcfce7",fillStyle:"solid",opacity:1,zIndex:6});});}return o}var Dl=["All","Brainstorming","Diagrams","Engineering","Agile & Planning"];function zn({isOpen:e,onClose:t,onSelectTemplate:r,hasExistingElements:o=false}){let{panelVariant:p}=no(),c=p==="neumorphic",[l,s]=Ln.useState("All"),[n,u]=Ln.useState(""),i=Ln.useRef(null);if(Ln.useEffect(()=>{let a=x=>{x.key==="Escape"&&e&&t();};return window.addEventListener("keydown",a),()=>window.removeEventListener("keydown",a)},[e,t]),Ln.useEffect(()=>{let a=x=>{e&&i.current&&!i.current.contains(x.target)&&t();};return e&&document.addEventListener("mousedown",a),()=>{document.removeEventListener("mousedown",a);}},[e,t]),!e)return null;let d=_o.filter(a=>{let x=l==="All"||a.category===l,b=a.title.toLowerCase().includes(n.toLowerCase())||a.description.toLowerCase().includes(n.toLowerCase())||a.tag.toLowerCase().includes(n.toLowerCase());return x&&b}),h=a=>{switch(a){case "mindmap":return jsxRuntime.jsxs("svg",{className:"w-full h-full",viewBox:"0 0 200 110",fill:"none",children:[jsxRuntime.jsx("rect",{x:"75",y:"38",width:"50",height:"34",rx:"8",fill:"#4f46e5",fillOpacity:"0.15",stroke:"#4f46e5",strokeWidth:"1.5"}),jsxRuntime.jsx("circle",{cx:"100",cy:"55",r:"5",fill:"#4f46e5"}),jsxRuntime.jsx("path",{d:"M75 50 C50 50 45 25 25 25",stroke:"#0284c7",strokeWidth:"1.5",strokeDasharray:"3 3"}),jsxRuntime.jsx("rect",{x:"10",y:"15",width:"30",height:"18",rx:"4",fill:"#e0f2fe",stroke:"#0284c7",strokeWidth:"1"}),jsxRuntime.jsx("path",{d:"M125 50 C150 50 155 25 175 25",stroke:"#d97706",strokeWidth:"1.5",strokeDasharray:"3 3"}),jsxRuntime.jsx("rect",{x:"160",y:"15",width:"30",height:"18",rx:"4",fill:"#fef3c7",stroke:"#d97706",strokeWidth:"1"}),jsxRuntime.jsx("path",{d:"M75 60 C50 60 45 85 25 85",stroke:"#16a34a",strokeWidth:"1.5",strokeDasharray:"3 3"}),jsxRuntime.jsx("rect",{x:"10",y:"75",width:"30",height:"18",rx:"4",fill:"#dcfce7",stroke:"#16a34a",strokeWidth:"1"}),jsxRuntime.jsx("path",{d:"M125 60 C150 60 155 85 175 85",stroke:"#e11d48",strokeWidth:"1.5",strokeDasharray:"3 3"}),jsxRuntime.jsx("rect",{x:"160",y:"75",width:"30",height:"18",rx:"4",fill:"#ffe4e6",stroke:"#e11d48",strokeWidth:"1"})]});case "flowchart":return jsxRuntime.jsxs("svg",{className:"w-full h-full",viewBox:"0 0 200 110",fill:"none",children:[jsxRuntime.jsx("rect",{x:"70",y:"8",width:"60",height:"20",rx:"10",fill:"#d1fae5",stroke:"#059669",strokeWidth:"1.5"}),jsxRuntime.jsx("line",{x1:"100",y1:"28",x2:"100",y2:"40",stroke:"#64748b",strokeWidth:"1.5"}),jsxRuntime.jsx("polygon",{points:"100,42 125,58 100,74 75,58",fill:"#fef3c7",stroke:"#d97706",strokeWidth:"1.5"}),jsxRuntime.jsx("line",{x1:"125",y1:"58",x2:"150",y2:"58",stroke:"#16a34a",strokeWidth:"1.5"}),jsxRuntime.jsx("rect",{x:"150",y:"46",width:"40",height:"24",rx:"4",fill:"#dcfce7",stroke:"#16a34a",strokeWidth:"1.2"}),jsxRuntime.jsx("line",{x1:"75",y1:"58",x2:"50",y2:"58",stroke:"#dc2626",strokeWidth:"1.5"}),jsxRuntime.jsx("rect",{x:"10",y:"46",width:"40",height:"24",rx:"4",fill:"#fee2e2",stroke:"#dc2626",strokeWidth:"1.2"}),jsxRuntime.jsx("line",{x1:"100",y1:"74",x2:"100",y2:"86",stroke:"#64748b",strokeWidth:"1.5"}),jsxRuntime.jsx("rect",{x:"75",y:"86",width:"50",height:"18",rx:"4",fill:"#e0e7ff",stroke:"#4f46e5",strokeWidth:"1.2"})]});case "erd":return jsxRuntime.jsxs("svg",{className:"w-full h-full",viewBox:"0 0 200 110",fill:"none",children:[jsxRuntime.jsx("rect",{x:"12",y:"15",width:"65",height:"42",rx:"4",fill:"#ffffff",stroke:"#4f46e5",strokeWidth:"1.2"}),jsxRuntime.jsx("rect",{x:"12",y:"15",width:"65",height:"14",rx:"4",fill:"#4f46e5"}),jsxRuntime.jsx("line",{x1:"18",y1:"38",x2:"68",y2:"38",stroke:"#cbd5e1",strokeWidth:"1.5"}),jsxRuntime.jsx("line",{x1:"18",y1:"46",x2:"55",y2:"46",stroke:"#e2e8f0",strokeWidth:"1.5"}),jsxRuntime.jsx("rect",{x:"122",y:"15",width:"65",height:"42",rx:"4",fill:"#ffffff",stroke:"#059669",strokeWidth:"1.2"}),jsxRuntime.jsx("rect",{x:"122",y:"15",width:"65",height:"14",rx:"4",fill:"#059669"}),jsxRuntime.jsx("line",{x1:"128",y1:"38",x2:"178",y2:"38",stroke:"#cbd5e1",strokeWidth:"1.5"}),jsxRuntime.jsx("line",{x1:"128",y1:"46",x2:"165",y2:"46",stroke:"#e2e8f0",strokeWidth:"1.5"}),jsxRuntime.jsx("rect",{x:"122",y:"66",width:"65",height:"38",rx:"4",fill:"#ffffff",stroke:"#d97706",strokeWidth:"1.2"}),jsxRuntime.jsx("rect",{x:"122",y:"66",width:"65",height:"12",rx:"4",fill:"#d97706"}),jsxRuntime.jsx("path",{d:"M77 35 L122 35",stroke:"#4f46e5",strokeWidth:"1.5",strokeDasharray:"2 2"}),jsxRuntime.jsx("path",{d:"M155 57 L155 66",stroke:"#059669",strokeWidth:"1.5",strokeDasharray:"2 2"})]});case "kanban":return jsxRuntime.jsxs("svg",{className:"w-full h-full",viewBox:"0 0 200 110",fill:"none",children:[jsxRuntime.jsx("rect",{x:"10",y:"10",width:"55",height:"90",rx:"6",fill:"#f8fafc",stroke:"#cbd5e1",strokeWidth:"1",strokeDasharray:"3 2"}),jsxRuntime.jsx("rect",{x:"16",y:"16",width:"43",height:"8",rx:"2",fill:"#6366f1",fillOpacity:"0.3"}),jsxRuntime.jsx("rect",{x:"15",y:"30",width:"45",height:"24",rx:"3",fill:"#fef08a",stroke:"#ca8a04",strokeWidth:"0.8"}),jsxRuntime.jsx("rect",{x:"15",y:"58",width:"45",height:"24",rx:"3",fill:"#e0e7ff",stroke:"#4f46e5",strokeWidth:"0.8"}),jsxRuntime.jsx("rect",{x:"72",y:"10",width:"55",height:"90",rx:"6",fill:"#f8fafc",stroke:"#cbd5e1",strokeWidth:"1",strokeDasharray:"3 2"}),jsxRuntime.jsx("rect",{x:"78",y:"16",width:"43",height:"8",rx:"2",fill:"#d97706",fillOpacity:"0.3"}),jsxRuntime.jsx("rect",{x:"77",y:"30",width:"45",height:"24",rx:"3",fill:"#fbcfe8",stroke:"#db2777",strokeWidth:"0.8"}),jsxRuntime.jsx("rect",{x:"77",y:"58",width:"45",height:"24",rx:"3",fill:"#cffafe",stroke:"#0891b2",strokeWidth:"0.8"}),jsxRuntime.jsx("rect",{x:"135",y:"10",width:"55",height:"90",rx:"6",fill:"#f8fafc",stroke:"#cbd5e1",strokeWidth:"1",strokeDasharray:"3 2"}),jsxRuntime.jsx("rect",{x:"141",y:"16",width:"43",height:"8",rx:"2",fill:"#16a34a",fillOpacity:"0.3"}),jsxRuntime.jsx("rect",{x:"140",y:"30",width:"45",height:"24",rx:"3",fill:"#bbf7d0",stroke:"#16a34a",strokeWidth:"0.8"})]});case "journey":return jsxRuntime.jsxs("svg",{className:"w-full h-full",viewBox:"0 0 200 110",fill:"none",children:[jsxRuntime.jsx("rect",{x:"8",y:"8",width:"42",height:"94",rx:"4",fill:"#f5f3ff",stroke:"#8b5cf6",strokeWidth:"1",strokeDasharray:"2 2"}),jsxRuntime.jsx("rect",{x:"12",y:"14",width:"34",height:"22",rx:"2",fill:"#e0f2fe",stroke:"#0284c7",strokeWidth:"0.8"}),jsxRuntime.jsx("rect",{x:"12",y:"42",width:"34",height:"24",rx:"2",fill:"#fee2e2",stroke:"#dc2626",strokeWidth:"0.8"}),jsxRuntime.jsx("rect",{x:"12",y:"72",width:"34",height:"24",rx:"2",fill:"#dcfce7",stroke:"#16a34a",strokeWidth:"0.8"}),jsxRuntime.jsx("rect",{x:"55",y:"8",width:"42",height:"94",rx:"4",fill:"#f5f3ff",stroke:"#8b5cf6",strokeWidth:"1",strokeDasharray:"2 2"}),jsxRuntime.jsx("rect",{x:"59",y:"14",width:"34",height:"22",rx:"2",fill:"#e0f2fe",stroke:"#0284c7",strokeWidth:"0.8"}),jsxRuntime.jsx("rect",{x:"59",y:"42",width:"34",height:"24",rx:"2",fill:"#fee2e2",stroke:"#dc2626",strokeWidth:"0.8"}),jsxRuntime.jsx("rect",{x:"59",y:"72",width:"34",height:"24",rx:"2",fill:"#dcfce7",stroke:"#16a34a",strokeWidth:"0.8"}),jsxRuntime.jsx("rect",{x:"103",y:"8",width:"42",height:"94",rx:"4",fill:"#f5f3ff",stroke:"#8b5cf6",strokeWidth:"1",strokeDasharray:"2 2"}),jsxRuntime.jsx("rect",{x:"107",y:"14",width:"34",height:"22",rx:"2",fill:"#e0f2fe",stroke:"#0284c7",strokeWidth:"0.8"}),jsxRuntime.jsx("rect",{x:"107",y:"42",width:"34",height:"24",rx:"2",fill:"#fee2e2",stroke:"#dc2626",strokeWidth:"0.8"}),jsxRuntime.jsx("rect",{x:"107",y:"72",width:"34",height:"24",rx:"2",fill:"#dcfce7",stroke:"#16a34a",strokeWidth:"0.8"}),jsxRuntime.jsx("rect",{x:"150",y:"8",width:"42",height:"94",rx:"4",fill:"#f5f3ff",stroke:"#8b5cf6",strokeWidth:"1",strokeDasharray:"2 2"}),jsxRuntime.jsx("rect",{x:"154",y:"14",width:"34",height:"22",rx:"2",fill:"#e0f2fe",stroke:"#0284c7",strokeWidth:"0.8"}),jsxRuntime.jsx("rect",{x:"154",y:"42",width:"34",height:"24",rx:"2",fill:"#fee2e2",stroke:"#dc2626",strokeWidth:"0.8"}),jsxRuntime.jsx("rect",{x:"154",y:"72",width:"34",height:"24",rx:"2",fill:"#dcfce7",stroke:"#16a34a",strokeWidth:"0.8"})]})}};return jsxRuntime.jsxs("div",{ref:i,className:`fk-card fixed left-13 top-1/2 -translate-y-1/2 z-40 w-[420px] max-w-[calc(100vw-80px)] max-h-[85vh] flex flex-col backdrop-blur-2xl rounded-[20px] animate-in fade-in zoom-in-95 duration-200 select-none overflow-hidden ${c?"bg-[#eef1f6]/98 dark:bg-[#16171b]/98 border border-white/70 dark:border-white/[0.06] shadow-[-6px_-6px_16px_rgba(255,255,255,0.85),_8px_8px_20px_rgba(166,175,195,0.45)] dark:shadow-[-4px_-4px_12px_rgba(255,255,255,0.02),_8px_8px_24px_rgba(0,0,0,0.9)]":"bg-white/95 dark:bg-[#16171b]/95 border border-black/[0.06] dark:border-white/[0.08] shadow-[0_12px_36px_-6px_rgba(0,0,0,0.12),0_6px_16px_-4px_rgba(0,0,0,0.06)] dark:shadow-[0_16px_40px_-6px_rgba(0,0,0,0.7),0_8px_20px_-4px_rgba(0,0,0,0.5)]"}`,children:[jsxRuntime.jsxs("div",{className:`flex items-center justify-between px-4 py-3 border-b border-black/[0.06] dark:border-white/[0.06] ${c?"bg-[#eef1f6]/50 dark:bg-[#16171b]/50":"bg-neutral-50/70 dark:bg-[#131418]/70"}`,children:[jsxRuntime.jsxs("div",{className:"flex items-center gap-2",children:[jsxRuntime.jsx("div",{className:"w-8 h-8 rounded-[10px] bg-primary/10 dark:bg-primary/20 text-primary flex items-center justify-center shadow-[-1px_-1px_3px_rgba(255,255,255,0.8),_1px_1px_3px_rgba(166,175,195,0.4)] dark:shadow-none",children:jsxRuntime.jsx(iconsReact.IconSparkles,{size:16,stroke:2.2})}),jsxRuntime.jsxs("div",{children:[jsxRuntime.jsx("h3",{className:"text-sm font-bold text-neutral-900 dark:text-neutral-100 leading-tight",children:"Diagram Templates"}),jsxRuntime.jsx("p",{className:"text-[10.5px] text-neutral-500 dark:text-neutral-400",children:"Pre-built starter kits with auto-adaptive theme styling"})]})]}),jsxRuntime.jsx("button",{type:"button",onClick:t,className:`w-7 h-7 rounded-[8px] flex items-center justify-center text-neutral-400 hover:text-neutral-700 dark:hover:text-neutral-200 transition-all cursor-pointer ${c?"hover:bg-[#f0f3f8] dark:hover:bg-[#22242b] hover:shadow-[-1px_-1px_2px_rgba(255,255,255,0.8),_1px_1px_2px_rgba(166,175,195,0.3)]":"hover:bg-neutral-100 dark:hover:bg-neutral-800"}`,title:"Close templates flyout (Esc)",children:jsxRuntime.jsx(iconsReact.IconX,{size:14})})]}),jsxRuntime.jsxs("div",{className:"px-4 pt-3 pb-2 space-y-2 border-b border-black/[0.06] dark:border-white/[0.06]",children:[jsxRuntime.jsxs("div",{className:"relative",children:[jsxRuntime.jsx(iconsReact.IconSearch,{size:13,className:"absolute left-2.5 top-1/2 -translate-y-1/2 text-neutral-400"}),jsxRuntime.jsx("input",{type:"text",value:n,onChange:a=>u(a.target.value),placeholder:"Search templates...",className:`w-full h-8 pl-8 pr-3 text-xs rounded-[8px] border text-neutral-900 dark:text-neutral-100 placeholder:text-neutral-400 outline-none focus:border-primary/50 transition-all ${c?"bg-[#e2e7ef] dark:bg-[#111215] shadow-[inset_1.5px_1.5px_3px_rgba(166,175,195,0.45),_inset_-1.5px_-1.5px_3px_rgba(255,255,255,0.9)] dark:shadow-[inset_2px_2px_4px_rgba(0,0,0,0.7),_inset_-1px_-1px_2px_rgba(255,255,255,0.03)] border-neutral-300/80 dark:border-neutral-800":"bg-neutral-100/80 dark:bg-[#111215] border-neutral-200 dark:border-neutral-800 focus:bg-white dark:focus:bg-[#15161b]"}`})]}),jsxRuntime.jsx("div",{className:"flex items-center gap-1 overflow-x-auto scrollbar-none pb-0.5",children:Dl.map(a=>jsxRuntime.jsx("button",{type:"button",onClick:()=>s(a),className:`px-2.5 py-1 rounded-[7px] text-[10.5px] font-semibold transition-all shrink-0 cursor-pointer ${l===a?c?"bg-[#f0f3f8] dark:bg-[#22242b] text-primary dark:text-foreground border border-primary/30 shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,1),_1.5px_1.5px_3px_rgba(166,175,195,0.55)] dark:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.06),_1.5px_1.5px_4px_rgba(0,0,0,0.8)]":"bg-primary/10 dark:bg-primary/25 text-primary dark:text-blue-300 border border-primary/30 font-bold":c?"text-neutral-600 dark:text-neutral-300 hover:bg-[#f0f3f8]/80 dark:hover:bg-[#1c1e24]/80 hover:shadow-[-1px_-1px_2px_rgba(255,255,255,0.8),_1px_1px_2px_rgba(166,175,195,0.3)]":"text-neutral-600 dark:text-neutral-400 hover:text-neutral-900 dark:hover:text-neutral-200 hover:bg-neutral-100 dark:hover:bg-neutral-800/60"}`,children:a},a))})]}),jsxRuntime.jsx("div",{className:"flex-1 overflow-y-auto px-4 py-3 space-y-3 max-h-[55vh]",children:d.length===0?jsxRuntime.jsx("div",{className:"py-8 text-center text-xs text-neutral-400",children:"No templates match your search query."}):d.map(a=>jsxRuntime.jsxs("div",{className:`fk-template-card group relative flex flex-col rounded-[12px] p-3 transition-all duration-200 ${c?"bg-[#eef1f6] dark:bg-[#1a1c22] border border-white/80 dark:border-white/[0.05] shadow-[-2px_-2px_6px_rgba(255,255,255,0.85),_3px_3px_7px_rgba(166,175,195,0.4)] dark:shadow-[-2px_-2px_5px_rgba(255,255,255,0.02),_3px_3px_8px_rgba(0,0,0,0.8)] hover:shadow-[-3px_-3px_8px_rgba(255,255,255,0.95),_4px_4px_10px_rgba(166,175,195,0.5)]":"bg-white dark:bg-[#1a1c22] border border-neutral-200/80 dark:border-neutral-800/80 shadow-xs hover:shadow-md hover:border-primary/40 dark:hover:border-primary/40"}`,children:[jsxRuntime.jsxs("div",{className:"flex items-start gap-3",children:[jsxRuntime.jsx("div",{className:"w-28 h-20 rounded-[8px] bg-neutral-100/80 dark:bg-neutral-950/80 border border-black/[0.06] dark:border-white/[0.06] p-1.5 shrink-0 overflow-hidden flex items-center justify-center transition-transform duration-200 group-hover:scale-[1.02]",children:h(a.previewType)}),jsxRuntime.jsxs("div",{className:"flex-1 min-w-0",children:[jsxRuntime.jsxs("div",{className:"flex items-center gap-1.5 mb-1",children:[jsxRuntime.jsx("span",{className:`text-[9px] font-bold px-1.5 py-0.5 rounded-[4px] border ${a.tagColor}`,children:a.tag}),jsxRuntime.jsxs("span",{className:"text-[9.5px] text-neutral-400 font-mono",children:[a.elementsCount," items"]})]}),jsxRuntime.jsx("h4",{className:"text-xs font-bold text-neutral-900 dark:text-neutral-100 truncate group-hover:text-primary dark:group-hover:text-blue-200 transition-colors",children:a.title}),jsxRuntime.jsx("p",{className:"text-[10.5px] text-neutral-500 dark:text-neutral-400 line-clamp-2 mt-0.5 leading-tight",children:a.description})]})]}),jsxRuntime.jsxs("div",{className:"mt-2.5 pt-2 border-t border-black/[0.06] dark:border-white/[0.06] flex items-center justify-end gap-2",children:[o&&jsxRuntime.jsx("button",{type:"button",onClick:()=>{r(a.id,"replace"),t();},className:"px-2.5 py-1 text-[10.5px] font-semibold text-neutral-500 dark:text-neutral-400 hover:text-rose-600 dark:hover:text-rose-400 hover:bg-rose-50 dark:hover:bg-rose-950/30 rounded-[6px] transition-colors cursor-pointer",title:"Clear canvas and load this template",children:"Replace Canvas"}),jsxRuntime.jsxs("button",{type:"button",onClick:()=>{r(a.id,"append"),t();},className:`flex items-center gap-1 px-3 py-1 text-xs font-bold bg-primary text-primary-foreground rounded-[7px] active:scale-95 transition-all cursor-pointer ${c?"shadow-[-1px_-1px_3px_rgba(255,255,255,0.6),_2px_2px_6px_rgba(99,102,241,0.45)] hover:shadow-[-1px_-1px_4px_rgba(255,255,255,0.7),_2px_2px_8px_rgba(99,102,241,0.6)]":"shadow-xs hover:shadow-sm hover:brightness-105"}`,children:[jsxRuntime.jsx(iconsReact.IconPlus,{size:12,stroke:2.5}),jsxRuntime.jsx("span",{children:"Insert Template"})]})]})]},a.id))}),jsxRuntime.jsxs("div",{className:`px-4 py-2 border-t border-black/[0.06] dark:border-white/[0.06] flex items-center justify-between text-[10.5px] text-neutral-400 ${c?"bg-[#eef1f6]/50 dark:bg-[#16171b]/50":"bg-neutral-50/70 dark:bg-[#131418]/70"}`,children:[jsxRuntime.jsx("span",{children:"\u{1F4A1} Inserted at center of current view"}),jsxRuntime.jsx("span",{className:"font-mono text-[9.5px]",children:"Undo anytime with Ctrl+Z"})]})]})}function Za(e,t){let r=(t?.maxSizeMB??25)*1024*1024;return e.type.startsWith("image/")?e.size>r?(console.warn(`[Sketch] File "${e.name}" exceeds the maximum allowed size of ${t?.maxSizeMB??25} MB.`),[]):[e]:(console.warn(`[Sketch] Invalid file type: "${e.type}". Please select an image file.`),[])}var Jl=({className:e,...t})=>jsxRuntime.jsx(iconsReact.IconSquare,{...t,className:`${e||""} rotate-45 scale-[0.75]`}),Ql=({size:e=17,stroke:t=1.7,className:r})=>jsxRuntime.jsxs("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:t,strokeLinecap:"round",strokeLinejoin:"round",className:r,children:[jsxRuntime.jsx("ellipse",{cx:"12",cy:"6",rx:"8",ry:"3"}),jsxRuntime.jsx("path",{d:"M4 6v12c0 1.657 3.582 3 8 3s8 -1.343 8 -3v-12"})]}),ed=({size:e=17,stroke:t=1.7,className:r})=>jsxRuntime.jsx("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:t,strokeLinecap:"round",strokeLinejoin:"round",className:r,children:jsxRuntime.jsx("path",{d:"M6.657 18c-2.572 0 -4.657 -2.007 -4.657 -4.483c0 -2.135 1.54 -3.906 3.61 -4.382c.394 -3.191 3.197 -5.635 6.447 -5.635c3.275 0 6.096 2.474 6.456 5.694c2.046 .505 3.544 2.261 3.544 4.372c0 2.476 -2.085 4.434 -4.657 4.434z"})}),td=({size:e=17,stroke:t=1.7,className:r})=>jsxRuntime.jsx("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:t,strokeLinecap:"round",strokeLinejoin:"round",className:r,children:jsxRuntime.jsx("polygon",{points:"7,4 21,4 17,20 3,20"})}),rd=({size:e=17,stroke:t=1.7,className:r})=>jsxRuntime.jsx("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:t,strokeLinecap:"round",strokeLinejoin:"round",className:r,children:jsxRuntime.jsx("polygon",{points:"12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"})}),od=({size:e=17,stroke:t=1.7,className:r})=>jsxRuntime.jsxs("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:t,strokeLinecap:"round",strokeLinejoin:"round",className:r,children:[jsxRuntime.jsx("line",{x1:"3",y1:"7",x2:"21",y2:"7"}),jsxRuntime.jsx("line",{x1:"3",y1:"17",x2:"21",y2:"17"}),jsxRuntime.jsx("line",{x1:"7",y1:"3",x2:"7",y2:"21"}),jsxRuntime.jsx("line",{x1:"17",y1:"3",x2:"17",y2:"21"})]}),nd=({size:e=17,stroke:t=1.7,className:r})=>jsxRuntime.jsxs("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:t,strokeLinecap:"round",strokeLinejoin:"round",className:r,children:[jsxRuntime.jsx("path",{d:"M4 20l7 -7"}),jsxRuntime.jsx("path",{d:"M6 18l1.5 -1.5"}),jsxRuntime.jsx("path",{d:"M11 13l2.5 2.5l5.5 -5.5a2.121 2.121 0 0 0 -3 -3l-5 5"}),jsxRuntime.jsx("path",{d:"M18.5 5.5l1.5 -1.5"}),jsxRuntime.jsx("path",{d:"M21 7l1 -1"}),jsxRuntime.jsx("circle",{cx:"19",cy:"4",r:"0.8",fill:"currentColor"})]}),ad=({size:e=17,stroke:t=1.7,className:r})=>jsxRuntime.jsx("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:t,strokeLinecap:"round",strokeLinejoin:"round",className:r,children:jsxRuntime.jsx("polygon",{points:"12 4 21 20 3 20"})}),id=({size:e=17,stroke:t=1.7,className:r})=>jsxRuntime.jsx("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:t,strokeLinecap:"round",strokeLinejoin:"round",className:r,children:jsxRuntime.jsx("polygon",{points:"6 5 18 5 21 19 3 19"})}),sd=({size:e=17,stroke:t=1.7,className:r})=>jsxRuntime.jsx("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:t,strokeLinecap:"round",strokeLinejoin:"round",className:r,children:jsxRuntime.jsx("polygon",{points:"6 4 18 4 22 12 18 20 6 20 2 12"})}),ld=({size:e=17,stroke:t=1.7,className:r})=>jsxRuntime.jsx("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:t,strokeLinecap:"round",strokeLinejoin:"round",className:r,children:jsxRuntime.jsx("rect",{x:"3",y:"6",width:"18",height:"12",rx:"6"})}),dd=({size:e=17,stroke:t=1.7,className:r})=>jsxRuntime.jsxs("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:t,strokeLinecap:"round",strokeLinejoin:"round",className:r,children:[jsxRuntime.jsx("rect",{x:"3",y:"4",width:"18",height:"16",rx:"2.5"}),jsxRuntime.jsx("line",{x1:"3",y1:"10",x2:"21",y2:"10"}),jsxRuntime.jsx("line",{x1:"10",y1:"4",x2:"10",y2:"20"}),jsxRuntime.jsx("line",{x1:"16",y1:"10",x2:"16",y2:"20"})]}),So=[{type:"rectangle",label:"Rectangle (R or 3)",shortLabel:"Rect",icon:iconsReact.IconSquare,shortcut:"R",category:"basic",description:"Standard container & card box"},{type:"ellipse",label:"Ellipse / Circle (O or 4)",shortLabel:"Circle",icon:iconsReact.IconCircle,shortcut:"O",category:"basic",description:"Start/End terminals & circular nodes"},{type:"diamond",label:"Diamond (D or 5)",shortLabel:"Diamond",icon:Jl,shortcut:"D",category:"basic",description:"Flowchart decision / conditional branching"},{type:"triangle",label:"Triangle (Y)",shortLabel:"Triangle",icon:ad,shortcut:"Y",category:"basic",description:"3-sided triangular shape / warning node"},{type:"capsule",label:"Capsule / Stadium (B)",shortLabel:"Capsule",icon:ld,shortcut:"B",category:"basic",description:"Rounded pill / stadium terminal node"},{type:"parallelogram",label:"Parallelogram (G)",shortLabel:"Data",icon:td,shortcut:"G",category:"flowchart",description:"Data input / output flowchart symbol"},{type:"trapezoid",label:"Trapezoid (Z)",shortLabel:"Trapezoid",icon:id,shortcut:"Z",category:"flowchart",description:"Manual operation / trapezoid shape"},{type:"hexagon",label:"Hexagon (X)",shortLabel:"Hexagon",icon:sd,shortcut:"X",category:"flowchart",description:"Preparation / hexagonal process node"},{type:"cylinder",label:"Cylinder (C)",shortLabel:"Cylinder",icon:Ql,shortcut:"C",category:"flowchart",description:"Database, storage & data repositories"},{type:"cloud",label:"Cloud (U)",shortLabel:"Cloud",icon:ed,shortcut:"U",category:"flowchart",description:"Cloud infrastructure, AWS/GCP, ideas"},{type:"star",label:"Star (J)",shortLabel:"Star",icon:rd,shortcut:"J",category:"flowchart",description:"Highlights, rating badges & milestones"}],cd=[{type:"select",label:"Select (V or 1)",shortLabel:"Select",icon:iconsReact.IconPointer,shortcut:"V"},{type:"frame",label:"Frame / Slide (F)",shortLabel:"Frame",icon:od,shortcut:"F"},{type:"sticky",label:"Sticky Note (S or 0)",shortLabel:"Note",icon:iconsReact.IconNote,shortcut:"S"}],pd=[{type:"arrow",label:"Arrow (A or 6)",shortLabel:"Arrow",icon:iconsReact.IconArrowUpRight,shortcut:"A"},{type:"line",label:"Line (L or 7)",shortLabel:"Line",icon:iconsReact.IconLine,shortcut:"L"},{type:"pen",label:"Freehand Pen (P or 8)",shortLabel:"Pen",icon:iconsReact.IconPencil,shortcut:"P"},{type:"text",label:"Text (T or 9)",shortLabel:"Text",icon:iconsReact.IconTypography,shortcut:"T"}],ud=[{type:"eraser",label:"Eraser (E)",shortLabel:"Eraser",icon:iconsReact.IconEraser,shortcut:"E"},{type:"laser",label:"Laser Pointer (K)",shortLabel:"Laser",icon:nd,shortcut:"K"}];function In({tool:e,setTool:t,isToolLocked:r=false,setIsToolLocked:o,onInsertImage:p,onOpenTemplates:c,isTemplatesOpen:l=false,onOpenTechStencils:s,isTechStencilsOpen:n=false,onInsertTablePreset:u}){let{panelVariant:i}=no(),d=i==="neumorphic",h=Ln.useRef(null),[a,x]=Ln.useState("rectangle"),[b,k]=Ln.useState(false),y=Ln.useRef(null),[_,S]=Ln.useState(false),[P,R]=Ln.useState({rows:3,cols:3}),I=Ln.useRef(null),z=()=>{I.current&&(clearTimeout(I.current),I.current=null),S(true);},$=()=>{I.current&&clearTimeout(I.current),I.current=setTimeout(()=>{S(false);},220);},w=()=>{h.current?.click();},f=L=>{let A=L.target.files?.[0];if(A){let F=Za(A,{});if(F.length>0){let Z=new FileReader;Z.onload=be=>{let U=be.target?.result;U&&p&&p(U);},Z.readAsDataURL(F[0]);}}h.current&&(h.current.value="");},v=()=>{y.current&&(clearTimeout(y.current),y.current=null),k(true);},C=()=>{y.current&&clearTimeout(y.current),y.current=setTimeout(()=>{k(false);},220);};Ln.useEffect(()=>{let L=A=>{if(A.target instanceof HTMLInputElement||A.target instanceof HTMLTextAreaElement||A.target.isContentEditable||A.ctrlKey||A.metaKey||A.altKey||A.shiftKey)return;switch(A.key.toLowerCase()){case "1":case "v":t("select");break;case "f":t("frame");break;case "0":case "s":t("sticky");break;case "3":case "r":t("rectangle");break;case "5":case "d":t("diamond");break;case "4":case "o":t("ellipse");break;case "y":t("triangle");break;case "b":t("capsule");break;case "z":t("trapezoid");break;case "x":t("hexagon");break;case "c":t("cylinder");break;case "u":t("cloud");break;case "g":t("parallelogram");break;case "2":case "h":t("hand");break;case "j":t("star");break;case "n":t("table");break;case "6":case "a":t("arrow");break;case "7":case "l":t("line");break;case "8":case "p":t("pen");break;case "9":case "t":t("text");break;case "e":t("eraser");break;case "k":t("laser");break;case "i":w();break;case "q":o?.(Z=>!Z);break;}};return window.addEventListener("keydown",L),()=>window.removeEventListener("keydown",L)},[t,o]);let T=So.find(L=>L.type===a)||So[0],W=T.icon,le=So.some(L=>L.type===e);return jsxRuntime.jsxs("aside",{"aria-label":"Creation Toolbox",className:"fixed left-2.5 top-1/2 -translate-y-1/2 z-30 pointer-events-auto select-none",children:[jsxRuntime.jsx("input",{ref:h,type:"file",accept:"image/png,image/jpeg,image/webp,image/svg+xml,image/gif",className:"hidden",onChange:f}),jsxRuntime.jsxs("div",{className:`fk-card flex flex-col items-center gap-1 p-1 backdrop-blur-2xl rounded-[16px] transition-all ${d?"bg-[#eef1f6]/95 dark:bg-[#16171b]/95 border border-white/70 dark:border-white/[0.06] shadow-[-4px_-4px_12px_rgba(255,255,255,0.85),_6px_6px_16px_rgba(166,175,195,0.45)] dark:shadow-[-3px_-3px_10px_rgba(255,255,255,0.02),_6px_6px_18px_rgba(0,0,0,0.85)]":"bg-white/95 dark:bg-[#16171b]/95 border border-black/[0.04] dark:border-white/[0.05] shadow-[0_10px_30px_-4px_rgba(0,0,0,0.08),0_4px_12px_-2px_rgba(0,0,0,0.03)] dark:shadow-[0_14px_34px_-4px_rgba(0,0,0,0.65),0_4px_14px_-2px_rgba(0,0,0,0.45)]"}`,children:[c&&jsxRuntime.jsx(jsxRuntime.Fragment,{children:jsxRuntime.jsxs("button",{type:"button","data-active":l?"true":void 0,onClick:c,title:"Diagram Templates & Starter Kits",className:`fk-tool-btn relative flex flex-col items-center justify-center w-8 h-8 rounded-[9px] transition-all duration-150 group cursor-pointer ${l?"fk-tool-active bg-primary text-white shadow-[-2px_-2px_4px_rgba(255,255,255,0.9),_2px_2px_5px_rgba(11,110,255,0.4)] scale-[1.05]":"text-primary dark:text-foreground hover:bg-[#f0f3f8]/80 dark:hover:bg-[#1c1e24]/80 hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.85),_1.5px_1.5px_3px_rgba(11,110,255,0.25)] dark:hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.03),_1.5px_1.5px_4px_rgba(0,0,0,0.6)] active:scale-95"}`,children:[jsxRuntime.jsxs("svg",{width:17,height:17,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:l?2:1.7,strokeLinecap:"round",strokeLinejoin:"round",children:[jsxRuntime.jsx("path",{d:"M4 4m0 2a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z"}),jsxRuntime.jsx("path",{d:"M4 9h16"}),jsxRuntime.jsx("path",{d:"M9 4v16"})]}),jsxRuntime.jsx("span",{className:"sr-only",children:"Diagram Templates"}),jsxRuntime.jsx("span",{className:"absolute -top-0.5 -right-0.5 w-1.5 h-1.5 rounded-full bg-primary ring-1 ring-white dark:ring-neutral-900"})]})}),s&&jsxRuntime.jsxs("button",{type:"button","data-active":n?"true":void 0,onClick:s,title:"Developer & Cloud Stencils (React, Node, Docker, AWS, Postgres, etc.)",className:`fk-tool-btn relative flex flex-col items-center justify-center w-8 h-8 rounded-[9px] transition-all duration-150 group cursor-pointer ${n?"fk-tool-active bg-primary text-white shadow-[-2px_-2px_4px_rgba(255,255,255,0.9),_2px_2px_5px_rgba(11,110,255,0.4)] scale-[1.05]":"text-primary dark:text-foreground hover:bg-[#f0f3f8]/80 dark:hover:bg-[#1c1e24]/80 hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.85),_1.5px_1.5px_3px_rgba(11,110,255,0.25)] dark:hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.03),_1.5px_1.5px_4px_rgba(0,0,0,0.6)] active:scale-95"}`,children:[jsxRuntime.jsx(iconsReact.IconBracketsContain,{size:17,stroke:n?2:1.7}),jsxRuntime.jsx("span",{className:"sr-only",children:"Developer Stencils"})]}),(c||s)&&jsxRuntime.jsx("div",{className:"w-5 h-[1px] bg-black/10 dark:bg-white/10 my-0.5"}),cd.map(L=>{let A=L.icon,F=e===L.type;return jsxRuntime.jsxs("button",{type:"button","data-active":F?"true":void 0,onClick:()=>t(L.type),title:L.label,className:`fk-tool-btn relative flex flex-col items-center justify-center w-8 h-8 rounded-[9px] transition-all duration-150 group cursor-pointer ${F?"fk-tool-active bg-[#f0f3f8] dark:bg-[#22242b] text-primary dark:text-foreground border border-primary/30 font-bold shadow-[-2px_-2px_4px_rgba(255,255,255,1),_2px_2px_4px_rgba(166,175,195,0.55),_0_0_0_1px_rgba(255,255,255,0.8)] dark:shadow-[-2px_-2px_4px_rgba(255,255,255,0.06),_2px_2px_5px_rgba(0,0,0,0.8),_0_0_0_1px_rgba(255,255,255,0.06)] scale-[1.05]":"text-neutral-500 dark:text-neutral-400 hover:text-neutral-900 dark:hover:text-white hover:bg-[#f0f3f8]/80 dark:hover:bg-[#1c1e24]/80 hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.85),_1.5px_1.5px_3px_rgba(166,175,195,0.35)] dark:hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.03),_1.5px_1.5px_4px_rgba(0,0,0,0.6)] active:shadow-[inset_1px_1px_2px_rgba(166,175,195,0.5),_inset_-1px_-1px_2px_rgba(255,255,255,0.8)] active:scale-95"}`,children:[jsxRuntime.jsx(A,{size:17,stroke:F?2:1.7}),jsxRuntime.jsx("span",{className:"sr-only",children:L.label}),jsxRuntime.jsx("span",{className:`absolute -bottom-0.5 -right-0.5 text-[6.5px] font-mono px-0.5 rounded-[2px] leading-none pointer-events-none opacity-0 group-hover:opacity-90 transition-opacity ${F?"bg-primary/90 text-primary-foreground":"bg-neutral-200 dark:bg-neutral-700 text-neutral-600 dark:text-neutral-300"}`,children:L.shortcut})]},L.type)}),jsxRuntime.jsxs("div",{className:"relative",onMouseEnter:v,onMouseLeave:C,children:[jsxRuntime.jsxs("button",{type:"button","data-active":le?"true":void 0,onClick:()=>t(a),title:`Shape Tool: ${T.label} (Hover to see all shapes)`,className:`fk-tool-btn relative flex flex-col items-center justify-center w-8 h-8 rounded-[9px] transition-all duration-150 group cursor-pointer ${le?"fk-tool-active bg-[#f0f3f8] dark:bg-[#22242b] text-primary dark:text-foreground border border-primary/30 font-bold shadow-[-2px_-2px_4px_rgba(255,255,255,1),_2px_2px_4px_rgba(166,175,195,0.55),_0_0_0_1px_rgba(255,255,255,0.8)] dark:shadow-[-2px_-2px_4px_rgba(255,255,255,0.06),_2px_2px_5px_rgba(0,0,0,0.8),_0_0_0_1px_rgba(255,255,255,0.06)] scale-[1.05]":"text-neutral-500 dark:text-neutral-400 hover:text-neutral-900 dark:hover:text-white hover:bg-[#f0f3f8]/80 dark:hover:bg-[#1c1e24]/80 hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.85),_1.5px_1.5px_3px_rgba(166,175,195,0.35)] dark:hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.03),_1.5px_1.5px_4px_rgba(0,0,0,0.6)] active:shadow-[inset_1px_1px_2px_rgba(166,175,195,0.5),_inset_-1px_-1px_2px_rgba(255,255,255,0.8)] active:scale-95"}`,children:[jsxRuntime.jsx(W,{size:17,stroke:le?2:1.7}),jsxRuntime.jsx("span",{className:"sr-only",children:"Shapes Menu"}),jsxRuntime.jsx("span",{className:"absolute bottom-0.5 right-0.5 w-1 h-1 rounded-full bg-neutral-400 dark:bg-neutral-500 group-hover:bg-primary transition-colors"}),jsxRuntime.jsx("span",{className:`absolute -bottom-0.5 -right-0.5 text-[6.5px] font-mono px-0.5 rounded-[2px] leading-none pointer-events-none opacity-0 group-hover:opacity-90 transition-opacity ${le?"bg-primary/90 text-primary-foreground":"bg-neutral-200 dark:bg-neutral-700 text-neutral-600 dark:text-neutral-300"}`,children:T.shortcut})]}),b&&jsxRuntime.jsx("div",{className:"absolute left-full top-1/2 -translate-y-1/2 pl-3 z-50 animate-in fade-in zoom-in-95 duration-150",onMouseEnter:v,onMouseLeave:C,children:jsxRuntime.jsxs("div",{className:"w-56 p-2.5 rounded-[14px] bg-[#f7f9fc]/95 dark:bg-[#16171b]/95 backdrop-blur-2xl border border-white/80 dark:border-white/[0.08] shadow-[-6px_-6px_16px_rgba(255,255,255,0.9),_8px_8px_24px_rgba(166,175,195,0.55)] dark:shadow-[-4px_-4px_14px_rgba(255,255,255,0.03),_8px_8px_24px_rgba(0,0,0,0.9)]",children:[jsxRuntime.jsx("div",{className:"text-[10px] font-bold text-neutral-400 dark:text-neutral-500 uppercase tracking-wider px-1.5 mb-1.5",children:"Basic Shapes"}),jsxRuntime.jsx("div",{className:"grid grid-cols-3 gap-1 mb-2.5",children:So.filter(L=>L.category==="basic").map(L=>{let A=L.icon,F=e===L.type;return jsxRuntime.jsxs("button",{type:"button",onClick:()=>{t(L.type),x(L.type),k(false);},title:`${L.label} - ${L.description}`,className:`flex flex-col items-center justify-center p-1.5 rounded-[9px] transition-all cursor-pointer group/item ${F?"bg-primary text-primary-foreground shadow-sm font-semibold scale-[1.02]":"text-neutral-600 dark:text-neutral-300 hover:bg-neutral-200/70 dark:hover:bg-neutral-800/80 hover:text-neutral-900 dark:hover:text-white"}`,children:[jsxRuntime.jsx(A,{size:18,stroke:F?2:1.7}),jsxRuntime.jsx("span",{className:"text-[10px] mt-1 font-medium leading-none",children:L.shortLabel}),jsxRuntime.jsx("span",{className:"text-[8px] opacity-60 font-mono mt-0.5",children:L.shortcut})]},L.type)})}),jsxRuntime.jsx("div",{className:"text-[10px] font-bold text-neutral-400 dark:text-neutral-500 uppercase tracking-wider px-1.5 mb-1.5",children:"Flowchart & Cloud"}),jsxRuntime.jsx("div",{className:"grid grid-cols-2 gap-1.5",children:So.filter(L=>L.category==="flowchart").map(L=>{let A=L.icon,F=e===L.type;return jsxRuntime.jsxs("button",{type:"button",onClick:()=>{t(L.type),x(L.type),k(false);},title:`${L.label} - ${L.description}`,className:`flex items-center gap-2 px-2 py-1.5 rounded-[9px] transition-all cursor-pointer text-left group/item ${F?"bg-primary text-primary-foreground shadow-sm font-semibold scale-[1.02]":"text-neutral-600 dark:text-neutral-300 hover:bg-neutral-200/70 dark:hover:bg-neutral-800/80 hover:text-neutral-900 dark:hover:text-white"}`,children:[jsxRuntime.jsx("div",{className:"w-6 h-6 rounded-[6px] bg-neutral-200/60 dark:bg-neutral-800/60 flex items-center justify-center shrink-0 group-hover/item:scale-105 transition-transform",children:jsxRuntime.jsx(A,{size:15,stroke:F?2:1.7})}),jsxRuntime.jsxs("div",{className:"flex flex-col min-w-0 flex-1",children:[jsxRuntime.jsx("span",{className:"text-[11px] font-medium truncate leading-tight",children:L.shortLabel}),jsxRuntime.jsxs("span",{className:"text-[8px] opacity-60 font-mono",children:["Key: ",L.shortcut]})]})]},L.type)})})]})})]}),jsxRuntime.jsxs("div",{className:"relative",onMouseEnter:z,onMouseLeave:$,children:[jsxRuntime.jsxs("button",{type:"button","data-active":e==="table"?"true":void 0,onClick:()=>t("table"),title:"Table & Grid Tool (N) - Hover for grid size picker & templates",className:`fk-tool-btn relative flex flex-col items-center justify-center w-8 h-8 rounded-[9px] transition-all duration-150 group cursor-pointer ${e==="table"?"fk-tool-active bg-[#f0f3f8] dark:bg-[#22242b] text-primary dark:text-foreground border border-primary/30 font-bold shadow-[-2px_-2px_4px_rgba(255,255,255,1),_2px_2px_4px_rgba(166,175,195,0.55),_0_0_0_1px_rgba(255,255,255,0.8)] dark:shadow-[-2px_-2px_4px_rgba(255,255,255,0.06),_2px_2px_5px_rgba(0,0,0,0.8),_0_0_0_1px_rgba(255,255,255,0.06)] scale-[1.05]":"text-neutral-500 dark:text-neutral-400 hover:text-neutral-900 dark:hover:text-white hover:bg-neutral-100 dark:hover:bg-neutral-800 active:scale-95"}`,children:[jsxRuntime.jsx(dd,{size:17,stroke:e==="table"?2:1.7}),jsxRuntime.jsx("span",{className:"sr-only",children:"Table Tool"}),jsxRuntime.jsx("span",{className:"absolute bottom-0.5 right-0.5 w-1 h-1 rounded-full bg-neutral-400 dark:bg-neutral-500 group-hover:bg-primary transition-colors"}),jsxRuntime.jsx("span",{className:`absolute -bottom-0.5 -right-0.5 text-[6.5px] font-mono px-0.5 rounded-[2px] leading-none pointer-events-none opacity-0 group-hover:opacity-90 transition-opacity ${e==="table"?"bg-primary/90 text-primary-foreground":"bg-neutral-200 dark:bg-neutral-700 text-neutral-600 dark:text-neutral-300"}`,children:"N"})]}),_&&jsxRuntime.jsx("div",{className:"absolute left-full top-1/2 -translate-y-1/2 pl-3 z-50 animate-in fade-in zoom-in-95 duration-150",onMouseEnter:z,onMouseLeave:$,children:jsxRuntime.jsxs("div",{className:"w-56 p-3 rounded-[14px] bg-[#f7f9fc]/95 dark:bg-[#16171b]/95 backdrop-blur-2xl border border-white/80 dark:border-white/[0.08] shadow-[-6px_-6px_16px_rgba(255,255,255,0.9),_8px_8px_24px_rgba(166,175,195,0.55)] dark:shadow-[-4px_-4px_14px_rgba(255,255,255,0.03),_8px_8px_24px_rgba(0,0,0,0.9)]",children:[jsxRuntime.jsxs("div",{className:"flex items-center justify-between px-0.5 mb-2",children:[jsxRuntime.jsx("span",{className:"text-[10px] font-bold text-neutral-400 dark:text-neutral-500 uppercase tracking-wider",children:"Grid Size"}),jsxRuntime.jsxs("span",{className:"text-[11px] font-mono font-semibold text-primary",children:[P.rows," \xD7 ",P.cols]})]}),jsxRuntime.jsx("div",{className:"grid grid-cols-5 gap-1 p-1.5 rounded-[10px] bg-neutral-200/50 dark:bg-neutral-800/50 mb-3",onMouseLeave:()=>R({rows:3,cols:3}),children:Array.from({length:5}).map((L,A)=>Array.from({length:5}).map((F,Z)=>{let be=A+1,U=Z+1,E=be<=P.rows&&U<=P.cols;return jsxRuntime.jsx("button",{type:"button",onMouseEnter:()=>R({rows:be,cols:U}),onClick:()=>{u?u("blank",be,U):t("table"),S(false);},className:`w-7 h-5 rounded-[4px] border transition-all cursor-pointer ${E?"bg-primary/80 border-primary shadow-xs":"bg-white/80 dark:bg-neutral-900/80 border-neutral-300/80 dark:border-neutral-700/80"}`},`${be}_${U}`)}))}),jsxRuntime.jsx("div",{className:"text-[10px] font-bold text-neutral-400 dark:text-neutral-500 uppercase tracking-wider px-0.5 mb-1.5",children:"Templates & Presets"}),jsxRuntime.jsx("div",{className:"flex flex-col gap-1",children:[{id:"blank",label:"Blank Grid (3 \xD7 3)",icon:"\u25A6",desc:"Empty table"},{id:"matrix",label:"Feature Matrix",icon:"\u{1F4CA}",desc:"4\xD73 pricing/features"},{id:"swot",label:"SWOT Matrix",icon:"\u{1F3AF}",desc:"2\xD72 strategic quadrants"},{id:"kanban",label:"Sprint Board",icon:"\u{1F4CB}",desc:"3 columns (To Do, Doing, Done)"}].map(L=>jsxRuntime.jsxs("button",{type:"button",onClick:()=>{let A=L.id==="kanban"?"kanban":L.id==="matrix-2x2"?"matrix":"blank";u?.(A),S(false);},className:"flex items-center gap-2 px-2 py-1.5 rounded-[8px] hover:bg-neutral-200/70 dark:hover:bg-neutral-800/80 text-neutral-700 dark:text-neutral-300 hover:text-neutral-900 dark:hover:text-white transition-colors text-left cursor-pointer group",children:[jsxRuntime.jsx("span",{className:"text-sm",children:L.icon}),jsxRuntime.jsxs("div",{className:"flex flex-col min-w-0 flex-1",children:[jsxRuntime.jsx("span",{className:"text-[11px] font-medium leading-tight",children:L.label}),jsxRuntime.jsx("span",{className:"text-[9px] text-neutral-400 dark:text-neutral-500 leading-tight",children:L.desc})]})]},L.id))})]})})]}),pd.map(L=>{let A=L.icon,F=e===L.type;return jsxRuntime.jsxs("button",{type:"button","data-active":F?"true":void 0,onClick:()=>t(L.type),title:L.label,className:`fk-tool-btn relative flex flex-col items-center justify-center w-8 h-8 rounded-[9px] transition-all duration-150 group cursor-pointer ${F?"fk-tool-active bg-[#f0f3f8] dark:bg-[#22242b] text-primary dark:text-foreground border border-primary/30 font-bold shadow-[-2px_-2px_4px_rgba(255,255,255,1),_2px_2px_4px_rgba(166,175,195,0.55),_0_0_0_1px_rgba(255,255,255,0.8)] dark:shadow-[-2px_-2px_4px_rgba(255,255,255,0.06),_2px_2px_5px_rgba(0,0,0,0.8),_0_0_0_1px_rgba(255,255,255,0.06)] scale-[1.05]":"text-neutral-500 dark:text-neutral-400 hover:text-neutral-900 dark:hover:text-white hover:bg-[#f0f3f8]/80 dark:hover:bg-[#1c1e24]/80 hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.85),_1.5px_1.5px_3px_rgba(166,175,195,0.35)] dark:hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.03),_1.5px_1.5px_4px_rgba(0,0,0,0.6)] active:shadow-[inset_1px_1px_2px_rgba(166,175,195,0.5),_inset_-1px_-1px_2px_rgba(255,255,255,0.8)] active:scale-95"}`,children:[jsxRuntime.jsx(A,{size:17,stroke:F?2:1.7}),jsxRuntime.jsx("span",{className:"sr-only",children:L.label}),jsxRuntime.jsx("span",{className:`absolute -bottom-0.5 -right-0.5 text-[6.5px] font-mono px-0.5 rounded-[2px] leading-none pointer-events-none opacity-0 group-hover:opacity-90 transition-opacity ${F?"bg-primary/90 text-primary-foreground":"bg-neutral-200 dark:bg-neutral-700 text-neutral-600 dark:text-neutral-300"}`,children:L.shortcut})]},L.type)}),jsxRuntime.jsxs("button",{type:"button",onClick:w,title:"Insert Image from file (I)",className:"fk-tool-btn relative flex flex-col items-center justify-center w-8 h-8 rounded-[9px] transition-all duration-150 group text-neutral-500 dark:text-neutral-400 hover:text-neutral-900 dark:hover:text-white hover:bg-[#f0f3f8]/80 dark:hover:bg-[#1c1e24]/80 hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.85),_1.5px_1.5px_3px_rgba(166,175,195,0.35)] dark:hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.03),_1.5px_1.5px_4px_rgba(0,0,0,0.6)] active:shadow-[inset_1px_1px_2px_rgba(166,175,195,0.5),_inset_-1px_-1px_2px_rgba(255,255,255,0.8)] active:scale-95 cursor-pointer",children:[jsxRuntime.jsx(iconsReact.IconPhoto,{size:17,stroke:1.7}),jsxRuntime.jsx("span",{className:"sr-only",children:"Insert Image (I)"}),jsxRuntime.jsx("span",{className:"absolute -bottom-0.5 -right-0.5 text-[6.5px] font-mono px-0.5 rounded-[2px] leading-none pointer-events-none opacity-0 group-hover:opacity-90 transition-opacity bg-neutral-200 dark:bg-neutral-700 text-neutral-600 dark:text-neutral-300",children:"I"})]}),ud.map(L=>{let A=L.icon,F=e===L.type;return jsxRuntime.jsxs("button",{type:"button","data-active":F?"true":void 0,onClick:()=>t(L.type),title:L.label,className:`fk-tool-btn relative flex flex-col items-center justify-center w-8 h-8 rounded-[9px] transition-all duration-150 group cursor-pointer ${F?"fk-tool-active bg-[#f0f3f8] dark:bg-[#22242b] text-primary dark:text-foreground border border-primary/30 font-bold shadow-[-2px_-2px_4px_rgba(255,255,255,1),_2px_2px_4px_rgba(166,175,195,0.55),_0_0_0_1px_rgba(255,255,255,0.8)] dark:shadow-[-2px_-2px_4px_rgba(255,255,255,0.06),_2px_2px_5px_rgba(0,0,0,0.8),_0_0_0_1px_rgba(255,255,255,0.06)] scale-[1.05]":"text-neutral-500 dark:text-neutral-400 hover:text-neutral-900 dark:hover:text-white hover:bg-[#f0f3f8]/80 dark:hover:bg-[#1c1e24]/80 hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.85),_1.5px_1.5px_3px_rgba(166,175,195,0.35)] dark:hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.03),_1.5px_1.5px_4px_rgba(0,0,0,0.6)] active:shadow-[inset_1px_1px_2px_rgba(166,175,195,0.5),_inset_-1px_-1px_2px_rgba(255,255,255,0.8)] active:scale-95"}`,children:[jsxRuntime.jsx(A,{size:17,stroke:F?2:1.7}),jsxRuntime.jsx("span",{className:"sr-only",children:L.label}),jsxRuntime.jsx("span",{className:`absolute -bottom-0.5 -right-0.5 text-[6.5px] font-mono px-0.5 rounded-[2px] leading-none pointer-events-none opacity-0 group-hover:opacity-90 transition-opacity ${F?"bg-primary/90 text-primary-foreground":"bg-neutral-200 dark:bg-neutral-700 text-neutral-600 dark:text-neutral-300"}`,children:L.shortcut})]},L.type)}),jsxRuntime.jsx("div",{className:"w-5 h-[1px] bg-black/10 dark:bg-white/10 my-0.5"}),jsxRuntime.jsxs("button",{type:"button","data-active":r?"true":void 0,onClick:()=>o?.(L=>!L),title:"Keep tool selected after drawing (Q)",className:`fk-tool-btn relative flex items-center justify-center w-8 h-7 rounded-[8px] transition-all duration-150 group cursor-pointer ${r?"fk-tool-active bg-[#f0f3f8] dark:bg-[#22242b] text-primary dark:text-foreground border border-primary/40 shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,1),_1.5px_1.5px_3px_rgba(166,175,195,0.55)] dark:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.06),_1.5px_1.5px_4px_rgba(0,0,0,0.8)]":"text-neutral-400 dark:text-neutral-500 hover:text-neutral-800 dark:hover:text-neutral-200 hover:bg-neutral-100 dark:hover:bg-neutral-800"}`,children:[r?jsxRuntime.jsx(iconsReact.IconLock,{size:15,stroke:2}):jsxRuntime.jsx(iconsReact.IconLockOpen,{size:15,stroke:1.7}),jsxRuntime.jsx("span",{className:"sr-only",children:"Lock Tool (Q)"})]})]})]})}var Nd=[{style:"grid",label:"Mesh Grid (Default)",desc:"Graph paper squares"},{style:"dots",label:"Dots Grid",desc:"Matrix dots pattern"},{style:"cross",label:"Crosshairs",desc:"Architectural markers"},{style:"none",label:"Clean Canvas",desc:"No background grid"}];function Rn({boardName:e,setBoardName:t,onOpenExport:r,onOpenTemplates:o,onCopyImage:p,onClearBoard:c,elementCount:l,zoom:s,zoomIn:n,zoomOut:u,resetCamera:i,canUndo:d,canRedo:h,undo:a,redo:x,tool:b,setTool:k,gridStyle:y,setGridStyle:_,onExit:S,saveStatus:P="saved",onManualSave:R,onStartPresentation:I,hasFrames:z=false,frameCount:$=0,isFramesOutlineOpen:w=false,onToggleFramesOutline:f,onOpenTechStencils:v,isTechStencilsOpen:C=false,isSpotlightActive:T=false,onToggleSpotlight:W}){let{resolvedTheme:le,isDark:L,panelVariant:A}=Vt(),F=A==="neumorphic",[Z,be]=Ln.useState(false),[U,E]=Ln.useState(e),[ee,te]=Ln.useState(false),[ie,Se]=Ln.useState(false),Ke=Ln__default.default.useRef(null),X=Ln__default.default.useRef(null),Oe=()=>{t(U.trim()||"Untitled Whiteboard"),be(false);};Ln__default.default.useEffect(()=>{let Ne=_e=>{Ke.current&&!Ke.current.contains(_e.target)&&te(false),X.current&&!X.current.contains(_e.target)&&Se(false);};return (ee||ie)&&document.addEventListener("mousedown",Ne),()=>{document.removeEventListener("mousedown",Ne);}},[ee,ie]);let je=b==="hand";return jsxRuntime.jsxs("header",{className:"fixed top-0 left-0 right-0 z-40 h-12 pointer-events-none flex items-center justify-between px-2.5 md:px-4",children:[jsxRuntime.jsxs("div",{className:"pointer-events-auto flex items-center gap-1.5",children:[S&&jsxRuntime.jsx("button",{type:"button",onClick:S,className:`fk-btn h-8 w-8 flex items-center justify-center rounded-[9px] backdrop-blur-2xl transition-all cursor-pointer box-border active:scale-95 ${F?"bg-[#eef1f6]/95 dark:bg-[#16171b]/95 border border-white/70 dark:border-white/[0.06] shadow-[-2px_-2px_6px_rgba(255,255,255,0.85),_3px_3px_7px_rgba(166,175,195,0.4)] dark:shadow-[-2px_-2px_5px_rgba(255,255,255,0.02),_3px_3px_8px_rgba(0,0,0,0.8)] text-neutral-700 dark:text-neutral-300 hover:bg-[#f0f3f8] dark:hover:bg-[#20222a] hover:shadow-[-2px_-2px_7px_rgba(255,255,255,0.95),_3px_3px_8px_rgba(166,175,195,0.5)] active:shadow-[inset_1.5px_1.5px_3px_rgba(166,175,195,0.5),_inset_-1.5px_-1.5px_3px_rgba(255,255,255,0.9)] dark:active:shadow-[inset_2px_2px_4px_rgba(0,0,0,0.7),_inset_-1px_-1px_2px_rgba(255,255,255,0.03)]":"bg-white/95 dark:bg-[#16171b]/95 border border-black/[0.04] dark:border-white/[0.05] shadow-[0_1px_3px_rgba(0,0,0,0.06)] dark:shadow-[0_2px_5px_rgba(0,0,0,0.4)] text-neutral-700 dark:text-neutral-300 hover:bg-neutral-50 dark:hover:bg-neutral-800"}`,title:"Exit whiteboard",children:jsxRuntime.jsx(iconsReact.IconArrowLeft,{size:14,stroke:2})}),jsxRuntime.jsxs("div",{className:`fk-card h-8 flex items-center gap-2 px-2.5 backdrop-blur-2xl rounded-[9px] box-border transition-all ${F?"bg-[#eef1f6]/95 dark:bg-[#16171b]/95 border border-white/70 dark:border-white/[0.06] shadow-[-3px_-3px_8px_rgba(255,255,255,0.85),_4px_4px_10px_rgba(166,175,195,0.45)] dark:shadow-[-2px_-2px_6px_rgba(255,255,255,0.02),_4px_4px_12px_rgba(0,0,0,0.8)]":"bg-white/95 dark:bg-[#16171b]/95 border border-black/[0.04] dark:border-white/[0.05] shadow-[0_4px_16px_-2px_rgba(0,0,0,0.06),0_2px_4px_-1px_rgba(0,0,0,0.03)] dark:shadow-[0_4px_16px_-2px_rgba(0,0,0,0.5)]"}`,children:[jsxRuntime.jsxs("div",{title:"Sketch",className:"flex items-center gap-1.5 text-primary font-bold text-xs tracking-tight",children:[jsxRuntime.jsx(iconsReact.IconPencilMinus,{size:15,className:"text-primary"}),jsxRuntime.jsx("span",{className:"hidden min-[1700px]:inline font-semibold text-primary text-xs tracking-wide",children:"Sketch"})]}),jsxRuntime.jsx("div",{className:"hidden min-[1700px]:block w-[1px] h-3 bg-neutral-300 dark:bg-neutral-700/60"}),Z?jsxRuntime.jsxs("div",{className:"flex items-center gap-1",children:[jsxRuntime.jsx("input",{type:"text",value:U,onChange:Ne=>E(Ne.target.value),onBlur:Oe,onKeyDown:Ne=>{Ne.key==="Enter"&&Oe();},autoFocus:true,className:"text-xs font-medium px-2 py-0.5 border border-primary/50 rounded-[5px] bg-[#e2e7ef] dark:bg-[#111215] text-neutral-900 dark:text-neutral-100 shadow-[inset_1px_1px_2.5px_rgba(166,175,195,0.5),_inset_-1px_-1px_2.5px_rgba(255,255,255,0.9)] dark:shadow-[inset_1.5px_1.5px_3px_rgba(0,0,0,0.7),_inset_-1px_-1px_2px_rgba(255,255,255,0.03)] outline-none w-28 md:w-36"}),jsxRuntime.jsx("button",{type:"button",onClick:Oe,className:"p-1 rounded-[5px] text-emerald-600 hover:bg-emerald-50 dark:hover:bg-emerald-950/40",children:jsxRuntime.jsx(iconsReact.IconCheck,{size:12,stroke:2.5})})]}):jsxRuntime.jsxs("button",{type:"button",onClick:()=>{E(e),be(true);},className:"flex items-center gap-1 text-xs font-medium text-neutral-700 dark:text-neutral-300 hover:text-primary dark:hover:text-blue-200 transition-colors group cursor-pointer",title:"Click to rename board",children:[jsxRuntime.jsx("span",{className:"max-w-[90px] sm:max-w-[130px] md:max-w-[160px] truncate",children:e}),jsxRuntime.jsx(iconsReact.IconChevronDown,{size:11,className:"text-neutral-400 group-hover:text-primary dark:group-hover:text-blue-200 transition-colors"})]}),jsxRuntime.jsx("div",{className:"w-[1px] h-3 bg-neutral-300 dark:bg-neutral-700/60"}),P==="saving"?jsxRuntime.jsxs("span",{className:"h-5 flex items-center gap-1 text-[9.5px] font-semibold text-amber-600 dark:text-amber-400 bg-amber-500/10 px-1.5 rounded-[5px] animate-pulse select-none leading-none shadow-[inset_0.5px_0.5px_1.5px_rgba(245,158,11,0.2)]",title:"Saving changes to local storage...",children:[jsxRuntime.jsx(iconsReact.IconDeviceFloppy,{size:10,className:"animate-spin"}),jsxRuntime.jsx("span",{className:"hidden lg:inline",children:"Saving..."})]}):P==="unsaved"?jsxRuntime.jsxs("button",{type:"button",onClick:R,title:"Unsaved changes. Click or press Ctrl+S to save.",className:"h-5 flex items-center gap-1 text-[9.5px] font-semibold text-neutral-600 dark:text-neutral-400 hover:text-primary dark:hover:text-blue-200 bg-neutral-500/10 hover:bg-primary/10 px-1.5 rounded-[5px] transition-colors cursor-pointer leading-none",children:[jsxRuntime.jsx("span",{className:"w-1.5 h-1.5 rounded-full bg-amber-500 shadow-[0_0_4px_rgba(245,158,11,0.6)]"}),jsxRuntime.jsx("span",{className:"hidden lg:inline",children:"Unsaved"})]}):jsxRuntime.jsxs("button",{type:"button",onClick:R,title:"All changes saved to local storage (Ctrl+S to save anytime)",className:"h-5 flex items-center gap-1 text-[9.5px] font-semibold text-emerald-600 dark:text-emerald-400 bg-emerald-500/10 hover:bg-emerald-500/20 px-1.5 rounded-[5px] transition-all cursor-pointer select-none leading-none shadow-[inset_0.5px_0.5px_1.5px_rgba(16,185,129,0.2)]",children:[jsxRuntime.jsx(iconsReact.IconCheck,{size:10,stroke:2.5}),jsxRuntime.jsx("span",{className:"hidden lg:inline",children:"Saved"})]})]})]}),jsxRuntime.jsxs("div",{className:`fk-card pointer-events-auto absolute left-1/2 -translate-x-1/2 h-8 flex items-center gap-0.5 lg:px-1 px-0.5 backdrop-blur-2xl rounded-[9px] text-neutral-700 dark:text-neutral-300 box-border transition-all ${F?"bg-[#eef1f6]/95 dark:bg-[#16171b]/95 border border-white/70 dark:border-white/[0.06] shadow-[-3px_-3px_8px_rgba(255,255,255,0.85),_4px_4px_10px_rgba(166,175,195,0.45)] dark:shadow-[-2px_-2px_6px_rgba(255,255,255,0.02),_4px_4px_12px_rgba(0,0,0,0.8)]":"bg-white/95 dark:bg-[#16171b]/95 border border-neutral-200/90 dark:border-neutral-800 shadow-sm"}`,children:[jsxRuntime.jsx("button",{type:"button",onClick:a,disabled:!d,title:"Undo (Ctrl+Z)",className:"h-6.5 w-5 lg:w-6.5 flex items-center justify-center rounded-[6px] text-neutral-600 dark:text-neutral-300 hover:bg-[#f0f3f8] dark:hover:bg-[#22242b] hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.9),_1.5px_1.5px_3px_rgba(166,175,195,0.35)] dark:hover:shadow-[-1px_-1px_3px_rgba(255,255,255,0.03),_1.5px_1.5px_4px_rgba(0,0,0,0.7)] active:shadow-[inset_1px_1px_2px_rgba(166,175,195,0.5),_inset_-1px_-1px_2px_rgba(255,255,255,0.9)] disabled:opacity-30 disabled:hover:shadow-none disabled:hover:bg-transparent transition-all cursor-pointer",children:jsxRuntime.jsx(iconsReact.IconArrowBackUp,{size:14})}),jsxRuntime.jsx("button",{type:"button",onClick:x,disabled:!h,title:"Redo (Ctrl+Y or Ctrl+Shift+Z)",className:"h-6.5 w-5 lg:w-6.5 flex items-center justify-center rounded-[6px] text-neutral-600 dark:text-neutral-300 hover:bg-[#f0f3f8] dark:hover:bg-[#22242b] hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.9),_1.5px_1.5px_3px_rgba(166,175,195,0.35)] dark:hover:shadow-[-1px_-1px_3px_rgba(255,255,255,0.03),_1.5px_1.5px_4px_rgba(0,0,0,0.7)] active:shadow-[inset_1px_1px_2px_rgba(166,175,195,0.5),_inset_-1px_-1px_2px_rgba(255,255,255,0.9)] disabled:opacity-30 disabled:hover:shadow-none disabled:hover:bg-transparent transition-all cursor-pointer",children:jsxRuntime.jsx(iconsReact.IconArrowForwardUp,{size:14})}),jsxRuntime.jsx("div",{className:"w-[1px] h-3 bg-neutral-300 dark:bg-neutral-700/60 mx-0.5"}),jsxRuntime.jsx("button",{type:"button",onClick:u,title:"Zoom Out",className:"h-6.5 w-5 lg:w-6.5 flex items-center justify-center rounded-[6px] text-neutral-600 dark:text-neutral-300 hover:bg-[#f0f3f8] dark:hover:bg-[#22242b] hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.9),_1.5px_1.5px_3px_rgba(166,175,195,0.35)] dark:hover:shadow-[-1px_-1px_3px_rgba(255,255,255,0.03),_1.5px_1.5px_4px_rgba(0,0,0,0.7)] active:shadow-[inset_1px_1px_2px_rgba(166,175,195,0.5),_inset_-1px_-1px_2px_rgba(255,255,255,0.9)] transition-all cursor-pointer",children:jsxRuntime.jsx(iconsReact.IconMinus,{size:13})}),jsxRuntime.jsxs("button",{type:"button",onClick:i,title:"Click to reset zoom to 100%",className:"h-6.5 px-1.5 flex items-center justify-center text-[11px] font-mono font-bold min-w-[38px] text-center rounded-[6px] text-neutral-700 dark:text-neutral-200 hover:bg-[#f0f3f8] dark:hover:bg-[#22242b] hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.9),_1.5px_1.5px_3px_rgba(166,175,195,0.35)] dark:hover:shadow-[-1px_-1px_3px_rgba(255,255,255,0.03),_1.5px_1.5px_4px_rgba(0,0,0,0.7)] active:shadow-[inset_1px_1px_2px_rgba(166,175,195,0.5),_inset_-1px_-1px_2px_rgba(255,255,255,0.9)] transition-all cursor-pointer",children:[Math.round(s*100),"%"]}),jsxRuntime.jsx("button",{type:"button",onClick:n,title:"Zoom In",className:"h-6.5 w-5 lg:w-6.5 flex items-center justify-center rounded-[6px] text-neutral-600 dark:text-neutral-300 hover:bg-[#f0f3f8] dark:hover:bg-[#22242b] hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.9),_1.5px_1.5px_3px_rgba(166,175,195,0.35)] dark:hover:shadow-[-1px_-1px_3px_rgba(255,255,255,0.03),_1.5px_1.5px_4px_rgba(0,0,0,0.7)] active:shadow-[inset_1px_1px_2px_rgba(166,175,195,0.5),_inset_-1px_-1px_2px_rgba(255,255,255,0.9)] transition-all cursor-pointer",children:jsxRuntime.jsx(iconsReact.IconPlus,{size:13})}),jsxRuntime.jsx("div",{className:"w-[1px] h-3 bg-neutral-300 dark:bg-neutral-700/60 mx-0.5"}),jsxRuntime.jsx("button",{type:"button",onClick:()=>k(je?"select":"hand"),title:je?"Pan Mode Active (H / Space)":"Switch to Hand/Pan Tool (H)",className:`h-6.5 w-5 lg:w-6.5 flex items-center justify-center rounded-[6px] transition-all cursor-pointer ${je?"bg-[#f0f3f8] dark:bg-[#22242b] text-primary dark:text-foreground border border-primary/30 font-bold shadow-[-2px_-2px_4px_rgba(255,255,255,1),_2px_2px_4px_rgba(166,175,195,0.55)] dark:shadow-[-2px_-2px_4px_rgba(255,255,255,0.06),_2px_2px_5px_rgba(0,0,0,0.8)] scale-[1.04]":"text-neutral-600 dark:text-neutral-300 hover:bg-[#f0f3f8] dark:hover:bg-[#22242b] hover:shadow-[-1.5px_-1.5px_3px_rgba(255,255,255,0.9),_1.5px_1.5px_3px_rgba(166,175,195,0.35)] dark:hover:shadow-[-1px_-1px_3px_rgba(255,255,255,0.03),_1.5px_1.5px_4px_rgba(0,0,0,0.7)] active:shadow-[inset_1px_1px_2px_rgba(166,175,195,0.5),_inset_-1px_-1px_2px_rgba(255,255,255,0.9)]"}`,children:jsxRuntime.jsx(iconsReact.IconHandGrab,{size:14})})]}),jsxRuntime.jsxs("div",{className:"pointer-events-auto flex items-center gap-1.5",children:[jsxRuntime.jsxs("div",{className:"relative",ref:Ke,children:[jsxRuntime.jsxs("button",{type:"button",onClick:()=>te(Ne=>!Ne),className:`fk-btn h-8 flex items-center gap-1 px-2 rounded-[9px] backdrop-blur-2xl text-neutral-700 dark:text-neutral-300 active:scale-95 transition-all cursor-pointer box-border ${F?"bg-[#eef1f6]/95 dark:bg-[#16171b]/95 border border-white/70 dark:border-white/[0.06] shadow-[-2px_-2px_6px_rgba(255,255,255,0.85),_3px_3px_7px_rgba(166,175,195,0.4)] dark:shadow-[-2px_-2px_5px_rgba(255,255,255,0.02),_3px_3px_8px_rgba(0,0,0,0.8)] hover:bg-[#f0f3f8] dark:hover:bg-[#20222a] hover:shadow-[-2px_-2px_7px_rgba(255,255,255,0.95),_3px_3px_8px_rgba(166,175,195,0.5)]":"bg-white/95 dark:bg-[#1e2026] border border-black/[0.06] dark:border-white/[0.08] shadow-xs hover:bg-neutral-50 dark:hover:bg-[#272a34]"} ${ee?F?"border-primary/40 bg-[#f0f3f8] dark:bg-[#20222a] shadow-[inset_1.5px_1.5px_3px_rgba(166,175,195,0.5),_inset_-1.5px_-1.5px_3px_rgba(255,255,255,0.9)] dark:shadow-[inset_2px_2px_4px_rgba(0,0,0,0.7),_inset_-1px_-1px_2px_rgba(255,255,255,0.03)]":"border-primary/50 text-primary dark:text-blue-300 bg-primary/10 dark:bg-primary/20":""}`,title:"Choose canvas background grid style",children:[y==="dots"&&jsxRuntime.jsx(iconsReact.IconDots,{size:14,className:"text-primary"}),y==="grid"&&jsxRuntime.jsx(iconsReact.IconGridPattern,{size:14,className:"text-primary"}),y==="cross"&&jsxRuntime.jsx("span",{className:"font-mono text-[11px] font-bold px-0.5 text-primary dark:text-foreground",children:"+"}),y==="none"&&jsxRuntime.jsx("span",{className:"text-[9px] font-medium px-0.5 text-neutral-400",children:"Off"}),jsxRuntime.jsx(iconsReact.IconChevronDown,{size:10,className:`text-neutral-400 transition-transform duration-150 ${ee?"rotate-180":""}`})]}),ee&&jsxRuntime.jsxs("div",{className:`fk-card absolute right-0 top-full mt-2 w-52 backdrop-blur-2xl rounded-[14px] p-2 z-50 animate-in fade-in zoom-in-95 duration-150 select-none ${F?"bg-[#eef1f6]/98 dark:bg-[#16171b]/98 border border-white/70 dark:border-white/[0.06] shadow-[-6px_-6px_16px_rgba(255,255,255,0.85),_8px_8px_20px_rgba(166,175,195,0.45)] dark:shadow-[-4px_-4px_12px_rgba(255,255,255,0.02),_8px_8px_24px_rgba(0,0,0,0.9)]":"bg-white/95 dark:bg-[#16171b]/95 border border-black/[0.06] dark:border-white/[0.08] shadow-[0_12px_30px_-4px_rgba(0,0,0,0.12),0_4px_12px_-2px_rgba(0,0,0,0.06)] dark:shadow-[0_14px_34px_-4px_rgba(0,0,0,0.7),0_4px_14px_-2px_rgba(0,0,0,0.5)]"}`,children:[jsxRuntime.jsxs("div",{className:"px-2 py-1 mb-1 border-b border-black/[0.06] dark:border-white/[0.06] flex items-center justify-between",children:[jsxRuntime.jsx("span",{className:"text-[9.5px] font-bold text-neutral-500 dark:text-neutral-400 uppercase tracking-wider",children:"Grid Background"}),jsxRuntime.jsx("span",{className:"text-[9px] font-mono text-neutral-400 dark:text-neutral-500",children:y==="grid"?"Default":y})]}),jsxRuntime.jsx("div",{className:"flex flex-col gap-1",children:Nd.map(Ne=>{let _e=y===Ne.style;return jsxRuntime.jsxs("button",{type:"button",onClick:()=>{_(Ne.style),te(false);},className:`flex items-center gap-2.5 p-1.5 rounded-[9px] text-left transition-all cursor-pointer ${_e?F?"bg-[#f0f3f8] dark:bg-[#22242b] text-primary dark:text-foreground border border-primary/30 shadow-[-2px_-2px_4px_rgba(255,255,255,1),_2px_2px_4px_rgba(166,175,195,0.55)] dark:shadow-[-2px_-2px_4px_rgba(255,255,255,0.06),_2px_2px_5px_rgba(0,0,0,0.8)] font-semibold":"bg-primary/10 dark:bg-primary/25 text-primary dark:text-blue-300 border border-primary/25 dark:border-primary/30 font-semibold":F?"hover:bg-[#f0f3f8]/80 dark:hover:bg-[#1c1e24]/80 text-neutral-700 dark:text-neutral-300 border border-transparent":"hover:bg-neutral-100 dark:hover:bg-neutral-800/70 text-neutral-700 dark:text-neutral-300 border border-transparent"}`,children:[Ne.style==="dots"&&jsxRuntime.jsx("div",{className:"w-8 h-6 rounded-[5px] border border-neutral-300 dark:border-neutral-700 bg-neutral-100 dark:bg-neutral-900 relative overflow-hidden flex items-center justify-center shrink-0",children:jsxRuntime.jsxs("svg",{className:"w-full h-full text-neutral-600 dark:text-neutral-300",xmlns:"http://www.w3.org/2000/svg",children:[jsxRuntime.jsx("pattern",{id:"grid-dots-preview-btn",width:"5",height:"5",patternUnits:"userSpaceOnUse",children:jsxRuntime.jsx("circle",{cx:"2.5",cy:"2.5",r:"0.8",fill:"currentColor"})}),jsxRuntime.jsx("rect",{width:"100%",height:"100%",fill:"url(#grid-dots-preview-btn)"})]})}),Ne.style==="grid"&&jsxRuntime.jsx("div",{className:"w-8 h-6 rounded-[5px] border border-neutral-300 dark:border-neutral-700 bg-neutral-100 dark:bg-neutral-900 relative overflow-hidden flex items-center justify-center shrink-0",children:jsxRuntime.jsxs("svg",{className:"w-full h-full text-neutral-600 dark:text-neutral-300",xmlns:"http://www.w3.org/2000/svg",children:[jsxRuntime.jsx("pattern",{id:"grid-mesh-preview-btn",width:"6",height:"6",patternUnits:"userSpaceOnUse",children:jsxRuntime.jsx("path",{d:"M 6 0 L 0 0 0 6",fill:"none",stroke:"currentColor",strokeWidth:"0.8"})}),jsxRuntime.jsx("rect",{width:"100%",height:"100%",fill:"url(#grid-mesh-preview-btn)"})]})}),Ne.style==="cross"&&jsxRuntime.jsx("div",{className:"w-8 h-6 rounded-[5px] border border-neutral-300 dark:border-neutral-700 bg-neutral-100 dark:bg-neutral-900 flex items-center justify-center shrink-0",children:jsxRuntime.jsx("span",{className:"font-mono text-[11px] font-bold text-neutral-600 dark:text-neutral-300 leading-none select-none",children:"+"})}),Ne.style==="none"&&jsxRuntime.jsx("div",{className:"w-8 h-6 rounded-[5px] border border-dashed border-neutral-300 dark:border-neutral-700 bg-neutral-50 dark:bg-neutral-900/50 flex items-center justify-center shrink-0",children:jsxRuntime.jsx("span",{className:"text-[8px] font-semibold text-neutral-400 uppercase tracking-wider",children:"Off"})}),jsxRuntime.jsxs("div",{className:"flex-1 min-w-0",children:[jsxRuntime.jsxs("div",{className:"flex items-center justify-between",children:[jsxRuntime.jsx("span",{className:"text-xs leading-tight",children:Ne.label}),_e&&jsxRuntime.jsx(iconsReact.IconCheck,{size:12,className:"text-primary stroke-[2.5]"})]}),jsxRuntime.jsx("span",{className:"text-[9.5px] text-neutral-400 block leading-tight",children:Ne.desc})]})]},Ne.style)})})]})]}),f&&jsxRuntime.jsxs("button",{type:"button",onClick:f,className:`fk-btn h-8 hidden min-[1700px]:flex items-center gap-1.5 px-2.5 rounded-[9px] backdrop-blur-2xl text-xs font-medium text-neutral-700 dark:text-neutral-300 active:scale-95 transition-all cursor-pointer box-border ${F?"bg-[#eef1f6]/95 dark:bg-[#16171b]/95 border border-white/70 dark:border-white/[0.06] shadow-[-2px_-2px_6px_rgba(255,255,255,0.85),_3px_3px_7px_rgba(166,175,195,0.4)] dark:shadow-[-2px_-2px_5px_rgba(255,255,255,0.02),_3px_3px_8px_rgba(0,0,0,0.8)] hover:bg-[#f0f3f8] dark:hover:bg-[#20222a] hover:shadow-[-2px_-2px_7px_rgba(255,255,255,0.95),_3px_3px_8px_rgba(166,175,195,0.5)]":"bg-white/95 dark:bg-[#1e2026] border border-black/[0.06] dark:border-white/[0.08] shadow-xs hover:bg-neutral-50 dark:hover:bg-[#272a34]"}`,title:"Toggle Frames Presentation Outline (Alt+F)",children:[jsxRuntime.jsx(iconsReact.IconLayoutSidebar,{size:14,className:"text-primary"}),jsxRuntime.jsx("span",{children:"Outline"}),$>0&&jsxRuntime.jsx("span",{className:"px-1 py-0.2 rounded-[3px] bg-primary/15 text-[8.5px] font-mono font-bold text-primary dark:text-foreground",children:$})]}),I&&jsxRuntime.jsxs("button",{type:"button",onClick:I,disabled:!z,className:`fk-btn h-8 hidden min-[1700px]:flex items-center gap-1.5 px-2.5 rounded-[9px] backdrop-blur-2xl text-xs font-medium transition-all box-border ${F?"bg-[#eef1f6]/95 dark:bg-[#16171b]/95 border border-white/70 dark:border-white/[0.06] shadow-[-2px_-2px_6px_rgba(255,255,255,0.85),_3px_3px_7px_rgba(166,175,195,0.4)] dark:shadow-[-2px_-2px_5px_rgba(255,255,255,0.02),_3px_3px_8px_rgba(0,0,0,0.8)]":"bg-white/95 dark:bg-[#1e2026] border border-black/[0.06] dark:border-white/[0.08] shadow-xs"} ${z?"text-primary dark:text-foreground hover:bg-neutral-50 dark:hover:bg-neutral-800/80 active:scale-95 cursor-pointer":"opacity-40 text-neutral-400 dark:text-neutral-500 cursor-not-allowed"}`,title:z?"Start Slideshow Presentation (Alt+P)":"Add frame elements to present",children:[jsxRuntime.jsx(iconsReact.IconPlayerPlay,{size:13,className:z?"text-primary":""}),jsxRuntime.jsx("span",{children:"Present"})]}),W&&jsxRuntime.jsx("button",{type:"button",onClick:W,className:`fk-btn h-8 hidden min-[1700px]:flex items-center gap-1.5 px-2.5 rounded-[9px] backdrop-blur-2xl transition-all cursor-pointer box-border active:scale-95 ${T?"bg-amber-500/20 text-amber-600 dark:text-amber-400 border border-amber-500/40 font-semibold shadow-[inset_1.5px_1.5px_3px_rgba(245,158,11,0.3),_inset_-1.5px_-1.5px_3px_rgba(255,255,255,0.9)]":F?"bg-[#eef1f6]/95 dark:bg-[#16171b]/95 border border-white/70 dark:border-white/[0.06] shadow-[-2px_-2px_6px_rgba(255,255,255,0.85),_3px_3px_7px_rgba(166,175,195,0.4)] dark:shadow-[-2px_-2px_5px_rgba(255,255,255,0.02),_3px_3px_8px_rgba(0,0,0,0.8)] text-neutral-700 dark:text-neutral-300 hover:bg-[#f0f3f8] dark:hover:bg-[#20222a] hover:text-amber-500":"bg-white/95 dark:bg-[#1e2026] border border-black/[0.06] dark:border-white/[0.08] shadow-xs text-neutral-700 dark:text-neutral-300 hover:bg-neutral-50 dark:hover:bg-[#272a34] hover:text-amber-500"}`,title:"Spotlight / Focus Mode (Alt+S)",children:jsxRuntime.jsx(iconsReact.IconCurrentLocation,{size:14,className:"text-amber-500"})}),p&&jsxRuntime.jsxs("button",{type:"button",onClick:p,className:`fk-btn h-8 hidden min-[1720px]:flex items-center gap-1.5 px-2.5 rounded-[9px] backdrop-blur-2xl text-xs font-medium text-neutral-700 dark:text-neutral-300 active:scale-95 transition-all cursor-pointer box-border ${F?"bg-[#eef1f6]/95 dark:bg-[#16171b]/95 border border-white/70 dark:border-white/[0.06] shadow-[-2px_-2px_6px_rgba(255,255,255,0.85),_3px_3px_7px_rgba(166,175,195,0.4)] dark:shadow-[-2px_-2px_5px_rgba(255,255,255,0.02),_3px_3px_8px_rgba(0,0,0,0.8)] hover:bg-[#f0f3f8] dark:hover:bg-[#20222a]":"bg-white/95 dark:bg-[#1e2026] border border-black/[0.06] dark:border-white/[0.08] shadow-xs hover:bg-neutral-50 dark:hover:bg-[#272a34]"}`,title:"Quick copy whole drawing or selected elements as image (Ctrl+Shift+C)",children:[jsxRuntime.jsxs("svg",{width:"13",height:"13",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:"text-primary",children:[jsxRuntime.jsx("rect",{width:"14",height:"14",x:"8",y:"8",rx:"2",ry:"2"}),jsxRuntime.jsx("path",{d:"M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"})]}),jsxRuntime.jsx("span",{children:"Copy Image"})]}),l>0&&jsxRuntime.jsxs("button",{type:"button",onClick:c,className:`fk-btn h-8 hidden min-[1700px]:flex items-center gap-1.5 px-2.5 rounded-[9px] backdrop-blur-2xl text-xs font-semibold text-rose-600 dark:text-rose-400 active:scale-95 transition-all cursor-pointer box-border ${F?"bg-[#eef1f6]/95 dark:bg-[#16171b]/95 border border-white/70 dark:border-white/[0.06] shadow-[-2px_-2px_6px_rgba(255,255,255,0.85),_3px_3px_7px_rgba(166,175,195,0.4)] dark:shadow-[-2px_-2px_5px_rgba(255,255,255,0.02),_3px_3px_8px_rgba(0,0,0,0.8)] hover:bg-rose-500/10":"bg-white/95 dark:bg-[#1e2026] border border-black/[0.06] dark:border-white/[0.08] shadow-xs hover:bg-rose-50 dark:hover:bg-rose-950/30"}`,title:"Clear all whiteboard elements",children:[jsxRuntime.jsx(iconsReact.IconEraser,{size:13}),jsxRuntime.jsx("span",{children:"Clear"})]}),o&&jsxRuntime.jsxs("button",{type:"button",onClick:o,className:"fk-btn h-8 hidden min-[1700px]:flex items-center gap-1.5 px-2.5 rounded-[9px] bg-linear-to-r from-primary/15 via-blue-500/15 to-sky-500/15 border border-primary/30 dark:border-primary/40 text-xs font-semibold text-primary dark:text-foreground backdrop-blur-2xl shadow-[-2px_-2px_6px_rgba(255,255,255,0.85),_3px_3px_8px_rgba(11,110,255,0.3)] dark:shadow-[-2px_-2px_5px_rgba(255,255,255,0.02),_3px_3px_8px_rgba(0,0,0,0.8)] hover:shadow-[-2px_-2px_7px_rgba(255,255,255,0.95),_3px_3px_10px_rgba(11,110,255,0.4)] active:scale-95 transition-all cursor-pointer box-border",title:"Diagram Templates & Starter Kits",children:[jsxRuntime.jsxs("svg",{width:"13",height:"13",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:"text-primary",children:[jsxRuntime.jsx("path",{d:"M4 4m0 2a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z"}),jsxRuntime.jsx("path",{d:"M4 9h16"}),jsxRuntime.jsx("path",{d:"M9 4v16"})]}),jsxRuntime.jsx("span",{className:"px-1 py-0.2 rounded-[3px] bg-primary/15 text-[8.5px] font-mono font-bold text-primary dark:text-foreground",children:"5"})]}),jsxRuntime.jsxs("div",{className:"relative flex min-[1700px]:hidden",ref:X,children:[jsxRuntime.jsxs("button",{type:"button",onClick:()=>Se(Ne=>!Ne),className:`h-8 flex items-center justify-center px-2 rounded-[9px] backdrop-blur-2xl text-neutral-700 dark:text-neutral-300 active:scale-95 transition-all cursor-pointer box-border ${F?"bg-[#eef1f6]/95 dark:bg-[#16171b]/95 border border-white/70 dark:border-white/[0.06] shadow-[-2px_-2px_6px_rgba(255,255,255,0.85),_3px_3px_7px_rgba(166,175,195,0.4)] dark:shadow-[-2px_-2px_5px_rgba(255,255,255,0.02),_3px_3px_8px_rgba(0,0,0,0.8)] hover:bg-[#f0f3f8] dark:hover:bg-[#20222a]":"bg-white/95 dark:bg-[#1e2026] border border-black/[0.06] dark:border-white/[0.08] shadow-xs hover:bg-neutral-50 dark:hover:bg-[#272a34]"} ${ie?F?"border-primary/40 bg-[#f0f3f8] dark:bg-[#20222a] text-primary dark:text-foreground":"border-primary/50 text-primary dark:text-blue-300 bg-primary/10 dark:bg-primary/20":""}`,title:"More whiteboard tools and options",children:[jsxRuntime.jsx(iconsReact.IconSettingsBolt,{size:15}),jsxRuntime.jsx(iconsReact.IconChevronDown,{size:10,className:`ml-1 text-neutral-400 transition-transform duration-150 ${ie?"rotate-180":""}`})]}),ie&&jsxRuntime.jsxs("div",{className:`fk-card absolute right-0 top-full mt-2 w-56 backdrop-blur-2xl rounded-[14px] p-2 z-50 animate-in fade-in zoom-in-95 duration-150 select-none ${F?"bg-[#eef1f6]/98 dark:bg-[#16171b]/98 border border-white/70 dark:border-white/[0.06] shadow-[-6px_-6px_16px_rgba(255,255,255,0.85),_8px_8px_20px_rgba(166,175,195,0.45)] dark:shadow-[-4px_-4px_12px_rgba(255,255,255,0.02),_8px_8px_24px_rgba(0,0,0,0.9)]":"bg-white/95 dark:bg-[#16171b]/95 border border-black/[0.06] dark:border-white/[0.08] shadow-[0_12px_30px_-4px_rgba(0,0,0,0.12),0_4px_12px_-2px_rgba(0,0,0,0.06)] dark:shadow-[0_14px_34px_-4px_rgba(0,0,0,0.7),0_4px_14px_-2px_rgba(0,0,0,0.5)]"}`,children:[jsxRuntime.jsx("div",{className:"px-2 py-1 mb-1 border-b border-black/[0.06] dark:border-white/[0.06] flex items-center justify-between",children:jsxRuntime.jsx("span",{className:"text-[9.5px] font-bold text-neutral-500 dark:text-neutral-400 uppercase tracking-wider",children:"Tools & Actions"})}),jsxRuntime.jsxs("div",{className:"flex flex-col gap-0.5",children:[o&&jsxRuntime.jsxs("button",{type:"button",onClick:()=>{o(),Se(false);},className:"flex items-center justify-between p-2 rounded-[9px] text-left hover:bg-[#f0f3f8] dark:hover:bg-[#20222a] text-neutral-700 dark:text-neutral-200 transition-all cursor-pointer group",children:[jsxRuntime.jsxs("div",{className:"flex items-center gap-2",children:[jsxRuntime.jsxs("svg",{width:"15",height:"15",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:"text-primary",children:[jsxRuntime.jsx("path",{d:"M4 4m0 2a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z"}),jsxRuntime.jsx("path",{d:"M4 9h16"}),jsxRuntime.jsx("path",{d:"M9 4v16"})]}),jsxRuntime.jsx("span",{className:"text-xs font-medium",children:"Starter Templates"})]}),jsxRuntime.jsx("span",{className:"px-1.5 py-0.2 rounded-[4px] bg-primary/15 text-[9px] font-mono font-bold text-primary dark:text-foreground",children:"5"})]}),v&&jsxRuntime.jsxs("button",{type:"button",onClick:()=>{v(),Se(false);},className:"flex items-center justify-between p-2 rounded-[9px] text-left hover:bg-[#f0f3f8] dark:hover:bg-[#20222a] text-neutral-700 dark:text-neutral-200 transition-all cursor-pointer group",children:[jsxRuntime.jsxs("div",{className:"flex items-center gap-2",children:[jsxRuntime.jsx(iconsReact.IconBracketsContain,{size:15,className:"text-primary"}),jsxRuntime.jsx("span",{className:"text-xs font-medium",children:"Tech Stencils"})]}),jsxRuntime.jsx("span",{className:"text-[9.5px] font-mono text-neutral-400",children:"Library"})]}),f&&jsxRuntime.jsxs("button",{type:"button",onClick:()=>{f(),Se(false);},className:"flex items-center justify-between p-2 rounded-[9px] text-left hover:bg-[#f0f3f8] dark:hover:bg-[#20222a] text-neutral-700 dark:text-neutral-200 transition-all cursor-pointer group",children:[jsxRuntime.jsxs("div",{className:"flex items-center gap-2",children:[jsxRuntime.jsx(iconsReact.IconLayoutSidebar,{size:15,className:"text-primary"}),jsxRuntime.jsx("span",{className:"text-xs font-medium",children:"Frames Outline"})]}),jsxRuntime.jsx("span",{className:"text-[9.5px] font-mono text-neutral-400",children:$>0?`${$} frame${$>1?"s":""}`:"Alt+F"})]}),I&&jsxRuntime.jsxs("button",{type:"button",onClick:()=>{z&&(I(),Se(false));},disabled:!z,className:`flex items-center justify-between p-2 rounded-[9px] text-left transition-all ${z?"hover:bg-[#f0f3f8] dark:hover:bg-[#20222a] text-primary dark:text-foreground cursor-pointer":"opacity-40 text-neutral-400 dark:text-neutral-500 cursor-not-allowed"}`,children:[jsxRuntime.jsxs("div",{className:"flex items-center gap-2",children:[jsxRuntime.jsx(iconsReact.IconPlayerPlay,{size:15,className:z?"text-primary":""}),jsxRuntime.jsx("span",{className:"text-xs font-medium",children:"Present Slideshow"})]}),jsxRuntime.jsx("span",{className:"text-[9.5px] font-mono text-neutral-400",children:"Alt+P"})]}),W&&jsxRuntime.jsxs("button",{type:"button",onClick:()=>{W(),Se(false);},className:"flex items-center justify-between p-2 rounded-[9px] text-left hover:bg-[#f0f3f8] dark:hover:bg-[#20222a] text-neutral-700 dark:text-neutral-200 transition-all cursor-pointer group",children:[jsxRuntime.jsxs("div",{className:"flex items-center gap-2",children:[jsxRuntime.jsx(iconsReact.IconCurrentLocation,{size:15,className:"text-amber-500"}),jsxRuntime.jsx("span",{className:"text-xs font-medium",children:"Spotlight Focus"})]}),jsxRuntime.jsx("span",{className:"text-[9.5px] font-mono text-neutral-400",children:"Alt+S"})]}),p&&jsxRuntime.jsxs("button",{type:"button",onClick:()=>{p(),Se(false);},className:"flex items-center justify-between p-2 rounded-[9px] text-left hover:bg-[#f0f3f8] dark:hover:bg-[#20222a] text-neutral-700 dark:text-neutral-200 transition-all cursor-pointer group",children:[jsxRuntime.jsxs("div",{className:"flex items-center gap-2",children:[jsxRuntime.jsxs("svg",{width:"14",height:"14",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:"text-primary",children:[jsxRuntime.jsx("rect",{width:"14",height:"14",x:"8",y:"8",rx:"2",ry:"2"}),jsxRuntime.jsx("path",{d:"M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"})]}),jsxRuntime.jsx("span",{className:"text-xs font-medium",children:"Copy as Image"})]}),jsxRuntime.jsx("span",{className:"text-[9.5px] font-mono text-neutral-400",children:"Ctrl+Shift+C"})]}),l>0&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("div",{className:"my-1 border-t border-black/[0.06] dark:border-white/[0.06]"}),jsxRuntime.jsxs("button",{type:"button",onClick:()=>{c(),Se(false);},className:"flex items-center justify-between p-2 rounded-[9px] text-left hover:bg-rose-500/10 text-rose-600 dark:text-rose-400 transition-all cursor-pointer group",children:[jsxRuntime.jsxs("div",{className:"flex items-center gap-2",children:[jsxRuntime.jsx(iconsReact.IconEraser,{size:15}),jsxRuntime.jsx("span",{className:"text-xs font-medium",children:"Clear Canvas"})]}),jsxRuntime.jsx("span",{className:"text-[9.5px] font-mono opacity-80",children:"Reset"})]})]})]})]})]}),jsxRuntime.jsxs("button",{type:"button",onClick:r,className:"h-8 flex items-center gap-1.5 px-3 rounded-[9px] bg-primary text-primary-foreground hover:bg-primary/90 text-xs font-semibold border border-primary/20 active:scale-95 transition-all cursor-pointer box-border shadow-[inset_0_1px_1px_rgba(255,255,255,0.25),_inset_0_-1px_1.5px_rgba(0,0,0,0.25)] active:shadow-[inset_0_2px_4px_rgba(0,0,0,0.3)]",title:"Export drawing as PNG, SVG, JSON, PDF (Ctrl+E)",children:[jsxRuntime.jsx(iconsReact.IconDownload,{size:13,stroke:2.2}),jsxRuntime.jsx("span",{className:"hidden sm:inline",children:"Export"}),jsxRuntime.jsx(iconsReact.IconChevronDown,{size:10,className:"opacity-80",stroke:2.2})]})]})]})}var Co=class{listeners=new Map;on(t,r){this.listeners.has(t)||this.listeners.set(t,new Set);let o=this.listeners.get(t);return o.add(r),()=>{o.delete(r);}}emit(t,r){let o=this.listeners.get(t);o&&o.forEach(p=>{try{p(r);}catch(c){console.error(`[Sketch] Error in event listener for "${t}":`,c);}});}clear(){this.listeners.clear();}};var Dn=1;function Ed(e){let t=Date.now();return {version:Dn,id:e?.id||`doc_${Math.random().toString(36).slice(2,10)}`,name:e?.name||"Untitled Sketch",elements:e?.elements?[...e.elements]:[],canvasBackground:e?.canvasBackground||"#fcfcfd",gridStyle:e?.gridStyle||"grid",createdAt:e?.createdAt||t,updatedAt:t}}function Td(e){return JSON.stringify(e,null,2)}function $d(e){let t=JSON.parse(e);if(!t||typeof t!="object")throw new Error("[Sketch] Failed to parse document: expected an object.");let r=Array.isArray(t.elements)?t.elements:[];return {version:typeof t.version=="number"?t.version:Dn,id:typeof t.id=="string"?t.id:void 0,name:typeof t.name=="string"?t.name:"Untitled Sketch",elements:r,canvasBackground:typeof t.canvasBackground=="string"?t.canvasBackground:"#fcfcfd",gridStyle:t.gridStyle||"grid",createdAt:typeof t.createdAt=="number"?t.createdAt:Date.now(),updatedAt:Date.now()}}function Wn(e){if(!e||typeof e!="object")return false;let t=e;return typeof t.version=="number"&&Array.isArray(t.elements)&&typeof t.name=="string"}var oi=.1,ni=5;function Fn(e={x:0,y:0,zoom:1}){let[t,r]=Ln.useState(e),o=Ln.useCallback(i=>({x:(i.x-t.x)/t.zoom,y:(i.y-t.y)/t.zoom}),[t]),p=Ln.useCallback(i=>({x:i.x*t.zoom+t.x,y:i.y*t.zoom+t.y}),[t]),c=Ln.useCallback((i,d)=>{r(h=>({...h,x:h.x+i,y:h.y+d}));},[]),l=Ln.useCallback((i,d)=>{r(h=>{let a=Math.min(ni,Math.max(oi,i));if(a===h.zoom)return h;let x=a/h.zoom,b=d.x-(d.x-h.x)*x,k=d.y-(d.y-h.y)*x;return {x:b,y:k,zoom:a}});},[]),s=Ln.useCallback(i=>{r(d=>{let h=Math.min(ni,Math.round((d.zoom+.15)*10)/10),a=i||{x:window.innerWidth/2,y:window.innerHeight/2},x=h/d.zoom;return {x:a.x-(a.x-d.x)*x,y:a.y-(a.y-d.y)*x,zoom:h}});},[]),n=Ln.useCallback(i=>{r(d=>{let h=Math.max(oi,Math.round((d.zoom-.15)*10)/10),a=i||{x:window.innerWidth/2,y:window.innerHeight/2},x=h/d.zoom;return {x:a.x-(a.x-d.x)*x,y:a.y-(a.y-d.y)*x,zoom:h}});},[]),u=Ln.useCallback(()=>{r({x:0,y:0,zoom:1});},[]);return {camera:t,setCamera:r,screenToWorld:o,worldToScreen:p,panBy:c,zoomAtPoint:l,zoomIn:s,zoomOut:n,resetCamera:u}}function Mo(e,t,r){if(t.length<2)return e;let o=e.filter(s=>t.includes(s.id));if(o.length<2)return e;let p=o.map(s=>({el:s,bounds:it(s)})),c=new Map;if(r==="left"){let s=Math.min(...p.map(n=>n.bounds.x));p.forEach(({el:n,bounds:u})=>{let i=s-u.x;c.set(n.id,{...n,x:n.x+i,points:n.points?.map(d=>({x:d.x+i,y:d.y}))});});}else if(r==="center"){let s=Math.min(...p.map(i=>i.bounds.x)),n=Math.max(...p.map(i=>i.bounds.x+i.bounds.width)),u=(s+n)/2;p.forEach(({el:i,bounds:d})=>{let h=d.x+d.width/2,a=u-h;c.set(i.id,{...i,x:i.x+a,points:i.points?.map(x=>({x:x.x+a,y:x.y}))});});}else if(r==="right"){let s=Math.max(...p.map(n=>n.bounds.x+n.bounds.width));p.forEach(({el:n,bounds:u})=>{let i=s-(u.x+u.width);c.set(n.id,{...n,x:n.x+i,points:n.points?.map(d=>({x:d.x+i,y:d.y}))});});}else if(r==="top"){let s=Math.min(...p.map(n=>n.bounds.y));p.forEach(({el:n,bounds:u})=>{let i=s-u.y;c.set(n.id,{...n,y:n.y+i,points:n.points?.map(d=>({x:d.x,y:d.y+i}))});});}else if(r==="middle"){let s=Math.min(...p.map(i=>i.bounds.y)),n=Math.max(...p.map(i=>i.bounds.y+i.bounds.height)),u=(s+n)/2;p.forEach(({el:i,bounds:d})=>{let h=d.y+d.height/2,a=u-h;c.set(i.id,{...i,y:i.y+a,points:i.points?.map(x=>({x:x.x,y:x.y+a}))});});}else if(r==="bottom"){let s=Math.max(...p.map(n=>n.bounds.y+n.bounds.height));p.forEach(({el:n,bounds:u})=>{let i=s-(u.y+u.height);c.set(n.id,{...n,y:n.y+i,points:n.points?.map(d=>({x:d.x,y:d.y+i}))});});}let l=e.map(s=>c.get(s.id)||s);return bt(l)}function No(e,t,r){if(t.length<2)return e;let o=e.filter(s=>t.includes(s.id));if(o.length<2)return e;let p=o.map(s=>({el:s,bounds:it(s)})),c=new Map;if(r==="horizontal"){p.sort((x,b)=>x.bounds.x-b.bounds.x);let s=p[0],n=p[p.length-1],u=n.bounds.x+n.bounds.width-s.bounds.x,i=p.reduce((x,b)=>x+b.bounds.width,0),h=Math.max(0,u-i)/(p.length-1),a=s.bounds.x;p.forEach((x,b)=>{if(b===0){a+=x.bounds.width+h;return}if(b===p.length-1)return;let k=a-x.bounds.x;c.set(x.el.id,{...x.el,x:x.el.x+k,points:x.el.points?.map(y=>({x:y.x+k,y:y.y}))}),a+=x.bounds.width+h;});}else if(r==="vertical"){p.sort((x,b)=>x.bounds.y-b.bounds.y);let s=p[0],n=p[p.length-1],u=n.bounds.y+n.bounds.height-s.bounds.y,i=p.reduce((x,b)=>x+b.bounds.height,0),h=Math.max(0,u-i)/(p.length-1),a=s.bounds.y;p.forEach((x,b)=>{if(b===0){a+=x.bounds.height+h;return}if(b===p.length-1)return;let k=a-x.bounds.y;c.set(x.el.id,{...x.el,y:x.el.y+k,points:x.el.points?.map(y=>({x:y.x,y:y.y+k}))}),a+=x.bounds.height+h;});}let l=e.map(s=>c.get(s.id)||s);return bt(l)}function si(e,t){let r={...e,...t};if(r.type==="text"){let o=t.text!==void 0&&t.text!==e.text,p=t.fontFamily!==void 0&&t.fontFamily!==e.fontFamily,c=t.fontSize!==void 0&&t.fontSize!==e.fontSize;if((o||p||c)&&t.width===void 0&&t.height===void 0&&r.text){let l=qr(r.text,r.fontSize||22,r.fontFamily),s=e.width;if(r.width=l.width,r.height=l.height,e.textAlign==="center"){let n=e.x+s/2;r.x=Math.round(n-l.width/2);}else if(e.textAlign==="right"){let n=e.x+s;r.x=Math.round(n-l.width);}}}return r}function Hn(e=[]){let[t,r]=Ln.useState(e),[o,p]=Ln.useState([]),c=Ln.useMemo(()=>t.filter($=>o.includes($.id)),[t,o]),l=Ln.useMemo(()=>c.length===1?c[0]:null,[c]),s=Ln.useCallback($=>{r(w=>[...w,$]);},[]),n=Ln.useCallback(($,w)=>{r(f=>{let v=f.map(C=>C.id===$?si(C,w):C);return bt(v)});},[]),u=Ln.useCallback($=>{r(w=>{let f=w.map(v=>o.includes(v.id)?si(v,$):v);return bt(f)});},[o]),i=Ln.useCallback(()=>{r($=>Xr($,o)),p([]);},[o]),d=Ln.useCallback(()=>{if(o.length===0)return;let $=t.filter(T=>o.includes(T.id));if($.length===0)return;let w=t.reduce((T,W)=>Math.max(T,W.zIndex??0),0),{clonedElements:f,newSelectedIds:v}=Mr($,{deltaX:24,deltaY:24,highestZ:w}),C=bt([...t,...f]);r(C),p(v);},[t,o]),h=Ln.useCallback(()=>{if(o.length<2)return;let $=`grp_${Date.now()}_${Math.random().toString(36).substring(2,7)}`;r(w=>w.map(f=>{if(o.includes(f.id)){let v=f.groupIds||[];return {...f,groupIds:[...v,$]}}return f}));},[o]),a=Ln.useCallback(()=>{o.length!==0&&r($=>{let w=new Set;return $.forEach(f=>{o.includes(f.id)&&f.groupIds&&f.groupIds.length>0&&w.add(f.groupIds[f.groupIds.length-1]);}),w.size===0?$:$.map(f=>{if(f.groupIds&&f.groupIds.length>0){let v=f.groupIds[f.groupIds.length-1];if(w.has(v)){let C=f.groupIds.slice(0,-1);return {...f,groupIds:C.length>0?C:void 0}}}return f})});},[o]),x=Ln.useCallback(()=>{o.length!==0&&r($=>{let w=[...$].sort((T,W)=>(T.zIndex??0)-(W.zIndex??0)),f=w.filter(T=>!o.includes(T.id)),v=w.filter(T=>o.includes(T.id));return [...f,...v].map((T,W)=>({...T,zIndex:W+1}))});},[o]),b=Ln.useCallback(()=>{o.length!==0&&r($=>{let w=[...$].sort((T,W)=>(T.zIndex??0)-(W.zIndex??0)),f=w.filter(T=>o.includes(T.id)),v=w.filter(T=>!o.includes(T.id));return [...f,...v].map((T,W)=>({...T,zIndex:W+1}))});},[o]),k=Ln.useCallback(()=>{o.length!==0&&r($=>{let w=[...$].sort((f,v)=>(f.zIndex??0)-(v.zIndex??0));for(let f=w.length-2;f>=0;f--)if(o.includes(w[f].id)&&!o.includes(w[f+1].id)){let v=w[f];w[f]=w[f+1],w[f+1]=v;}return w.map((f,v)=>({...f,zIndex:v+1}))});},[o]),y=Ln.useCallback(()=>{o.length!==0&&r($=>{let w=[...$].sort((f,v)=>(f.zIndex??0)-(v.zIndex??0));for(let f=1;f<w.length;f++)if(o.includes(w[f].id)&&!o.includes(w[f-1].id)){let v=w[f];w[f]=w[f-1],w[f-1]=v;}return w.map((f,v)=>({...f,zIndex:v+1}))});},[o]),_=Ln.useCallback(($,w=false)=>{p(f=>w?f.includes($)?f.filter(v=>v!==$):[...f,$]:[$]);},[]),S=Ln.useCallback($=>{p($);},[]),P=Ln.useCallback(()=>{p([]);},[]),R=Ln.useCallback($=>{r($);},[]),I=Ln.useCallback($=>{o.length<2||r(w=>Mo(w,o,$));},[o]),z=Ln.useCallback($=>{o.length<2||r(w=>No(w,o,$));},[o]);return {elements:t,setElements:r,setAllElements:R,selectedIds:o,setSelectedIds:p,selectedElements:c,singleSelectedElement:l,addElement:s,updateElement:n,updateSelectedElements:u,deleteSelectedElements:i,duplicateSelectedElements:d,groupSelectedElements:h,ungroupSelectedElements:a,alignSelectedElements:I,distributeSelectedElements:z,bringToFront:x,sendToBack:b,bringForward:k,sendBackward:y,selectElement:_,selectElements:S,clearSelection:P}}var Yn=50;function Xn(e=[]){let[t,r]=Ln.useState([e]),[o,p]=Ln.useState(0),c=Ln.useCallback(u=>{r(i=>{let d=i.slice(0,o+1);return d.push(u),d.length>Yn&&d.shift(),d}),p(i=>{let d=i+1;return d>=Yn?Yn-1:d});},[o]),l=Ln.useCallback(()=>{if(o>0){let u=o-1;return p(u),t[u]}return null},[o,t]),s=Ln.useCallback(()=>{if(o<t.length-1){let u=o+1;return p(u),t[u]}return null},[o,t]),n=Ln.useCallback((u=[])=>{r([u]),p(0);},[]);return {pushState:c,undo:l,redo:s,resetHistory:n,canUndo:o>0,canRedo:o<t.length-1}}var Eo=[{id:"starter-1",type:"rectangle",x:140,y:120,width:200,height:180,strokeColor:"#4f46e5",strokeWidth:2.5,strokeStyle:"solid",fillColor:"#e0e7ff",fillStyle:"hachure",opacity:1,zIndex:1},{id:"starter-1-text",type:"text",x:160,y:165,width:160,height:80,text:`Plan
|
|
120
|
+
Design
|
|
121
|
+
Build \u2728`,fontSize:24,fontFamily:"comic",textAlign:"center",strokeColor:"#4f46e5",strokeWidth:2,strokeStyle:"solid",fillColor:"transparent",fillStyle:"solid",opacity:1,zIndex:2},{id:"starter-2",type:"arrow",x:355,y:200,width:120,height:0,strokeColor:"#1e293b",strokeWidth:2.5,strokeStyle:"solid",fillColor:"transparent",fillStyle:"solid",opacity:1,zIndex:3},{id:"starter-3",type:"diamond",x:490,y:100,width:210,height:200,strokeColor:"#059669",strokeWidth:2.5,strokeStyle:"solid",fillColor:"#dcfce7",fillStyle:"cross-hatch",opacity:1,zIndex:4},{id:"starter-3-text",type:"text",x:520,y:160,width:150,height:80,text:`Create
|
|
122
|
+
Without
|
|
123
|
+
Limits \u{1F4A1}`,fontSize:24,fontFamily:"comic",textAlign:"center",strokeColor:"#059669",strokeWidth:2,strokeStyle:"solid",fillColor:"transparent",fillStyle:"solid",opacity:1,zIndex:5},{id:"starter-4",type:"sticky",x:80,y:350,width:190,height:180,text:`Add your
|
|
124
|
+
ideas here...
|
|
125
|
+
Click any tool to draw! \u{1F3A8}`,fontSize:20,fontFamily:"comic",textAlign:"center",strokeColor:"#713f12",strokeWidth:1,strokeStyle:"solid",fillColor:"#fef08a",fillStyle:"solid",stickyColor:"#fef08a",opacity:1,zIndex:6},{id:"starter-5",type:"text",x:80,y:40,width:260,height:60,text:"Ideas Flow Better Here \u270D\uFE0F",fontSize:28,fontFamily:"comic",textAlign:"left",strokeColor:"#4f46e5",strokeWidth:2,strokeStyle:"solid",fillColor:"transparent",fillStyle:"solid",opacity:1,zIndex:7}];function ci(e,t="My Whiteboard",r="#f0f4f8",o="grid"){return e?Array.isArray(e)?{elements:e,name:t,canvasBackground:r,gridStyle:o}:Wn(e)?{elements:e.elements||[],name:e.name||t,canvasBackground:e.canvasBackground||r,gridStyle:e.gridStyle||o}:{elements:Eo,name:t,canvasBackground:r,gridStyle:o}:{elements:Eo,name:t,canvasBackground:r,gridStyle:o}}var Ad=Ln__default.default.forwardRef(function({value:t,defaultValue:r,onChange:o,onSave:p,storageKey:c="filekit_sketch_document_v1",boardName:l,onBoardNameChange:s,readOnly:n=false,theme:u="system",panelVariant:i="classic",canvasBackground:d="#f0f4f8",gridStyle:h="grid",onExit:a,guideHref:x,onOpenGuide:b,uiConfig:k,controllerRef:y,className:_="",style:S},P){let R=Ln.useMemo(()=>ci(t!==void 0?t:r,l,d,h),[]),[I,z]=Ln.useState(l!==void 0?l:R.name),[$,w]=Ln.useState(R.canvasBackground),[f,v]=Ln.useState(R.gridStyle),[C,T]=Ln.useState("select"),[W,le]=Ln.useState(false),[L,A]=Ln.useState(nn),[F,Z]=Ln.useState(null),[be,U]=Ln.useState(false),[E,ee]=Ln.useState(false),[te,ie]=Ln.useState(false),[Se,Ke]=Ln.useState(false),[X,Oe]=Ln.useState(false),[je,Ne]=Ln.useState(false),[_e,Pe]=Ln.useState(false),[he,ve]=Ln.useState(false),[ue,K]=Ln.useState("#ef4444"),[Y,Q]=Ln.useState("fading"),[M,pe]=Ln.useState([]),[g,D]=Ln.useState(null),[N,se]=Ln.useState(null),de=Ln.useRef(null),oe=Ln.useCallback(q=>{de.current&&clearTimeout(de.current),se(q),de.current=setTimeout(()=>{se(null);},2400);},[]),{elements:O,setElements:re,setAllElements:ge,selectedIds:Ce,selectedElements:Ie,selectElement:Rt,selectElements:nt,clearSelection:lt,addElement:Nt,updateElement:Kt,updateSelectedElements:zt,deleteSelectedElements:Dt,bringToFront:fr,sendToBack:pr,bringForward:gr,sendBackward:kt}=Hn(R.elements),{pushState:qe,undo:Bt,redo:Fe,resetHistory:er,canUndo:pt,canRedo:Wr}=Xn(R.elements),{camera:tr,setCamera:H,screenToWorld:m,worldToScreen:j,panBy:ne,zoomAtPoint:G,zoomIn:ce,zoomOut:Be,resetCamera:Le}=Fn({x:0,y:0,zoom:1}),{resolvedTheme:He,isDark:Re}=Vt(u),rt=Ln.useMemo(()=>$?Re&&($==="#f0f4f8"||$==="#ffffff")?"#121316":!Re&&($==="#121316"||$==="#1a1d24"||$==="#0f0f11")?"#f0f4f8":$:Re?"#121316":"#f0f4f8",[$,Re]),[V,xe]=Ln.useState("saved"),Te=Ln.useRef(false),Ze=Ln.useRef(""),De=Ln.useRef(""),we=Ln.useRef(null),Ue=Ln.useRef(new Co),Ee=Ln.useCallback(q=>{z(q),s?.(q);},[s]);Ln.useEffect(()=>{l!==void 0&&l!==I&&z(l);},[l]),Ln.useEffect(()=>{if(typeof window>"u")return;let q=R.elements,Me=R.name;if(c)try{let yt=localStorage.getItem(c);if(yt){let st=JSON.parse(yt);st&&Array.isArray(st.elements)&&(q=st.elements,st.name&&(Me=st.name),st.canvasBackground&&w(st.canvasBackground),st.gridStyle&&v(st.gridStyle));}}catch(yt){console.warn("[Sketch] Failed to restore from localStorage:",yt);}ge(q),er(q),z(Me),Ze.current=JSON.stringify(q),De.current=Me,Te.current=true;let ze=jt(q.length>0?q:Eo,0),ft=ze.minX+ze.width/2,gt=ze.minY+ze.height/2,ct=window.innerWidth,wt=window.innerHeight;H({x:Math.round(ct/2-ft+60),y:Math.round(wt/2-gt),zoom:1});},[c]),Ln.useEffect(()=>{if(t===void 0||!Te.current)return;let q=JSON.stringify(O),Me=ci(t,I,$,f),ze=JSON.stringify(Me.elements);q!==ze&&(ge(Me.elements),er(Me.elements),Ze.current=ze),Me.name&&Me.name!==I&&z(Me.name);},[t]);let ht=Ln.useCallback((q,Me)=>{let ze={version:1,name:Me,elements:q,canvasBackground:$,gridStyle:f,createdAt:Date.now(),updatedAt:Date.now()};if(c&&typeof window<"u")try{xe("saving"),localStorage.setItem(c,JSON.stringify(ze)),Ze.current=JSON.stringify(q),De.current=Me,setTimeout(()=>xe("saved"),250);}catch(ft){console.warn("[Sketch] Failed to save document to localStorage:",ft),xe("saved");}o?.(ze),Ue.current.emit("change",ze);},[c,$,f,o]);Ln.useEffect(()=>{if(!Te.current)return;let Me=JSON.stringify(O)!==Ze.current,ze=I!==De.current;return (Me||ze)&&(xe("unsaved"),we.current&&clearTimeout(we.current),we.current=setTimeout(()=>{ht(O,I);},800)),()=>{we.current&&clearTimeout(we.current);}},[O,I,ht]);let xt=Ln.useCallback(()=>{we.current&&clearTimeout(we.current),ht(O,I);let q={version:1,name:I,elements:O,canvasBackground:$,gridStyle:f,createdAt:Date.now(),updatedAt:Date.now()};p?.(q),oe("Document saved successfully");},[O,I,$,f,ht,p,oe]);Ln.useEffect(()=>{let q=Me=>{(Me.ctrlKey||Me.metaKey)&&Me.key.toLowerCase()==="s"&&(Me.preventDefault(),xt());};return window.addEventListener("keydown",q),()=>window.removeEventListener("keydown",q)},[xt]);let rr=Ln.useCallback(q=>{n||T(Me=>{let ze=typeof q=="function"?q(Me):q;return (ze==="arrow"||ze!=="select"&&ze!=="hand")&<(),ze});},[n,lt]),ur=Ln.useCallback(()=>pe([]),[]),Zo=Ln.useCallback(()=>T("select"),[]),Yt=Ln.useCallback(()=>{if(n)return;let q=Bt();q&&(ge(q),lt(),Ue.current.emit("undo",q));},[n,Bt,ge,lt]),Ut=Ln.useCallback(()=>{if(n)return;let q=Fe();q&&(ge(q),lt(),Ue.current.emit("redo",q));},[n,Fe,ge,lt]),Pr=Ln.useCallback(()=>{if(typeof window<"u"){let q=jt(O.length>0?O:Eo,0),Me=q.minX+q.width/2,ze=q.minY+q.height/2,ft=window.innerWidth,gt=window.innerHeight;H({x:Math.round(ft/2-Me+60),y:Math.round(gt/2-ze),zoom:1});}else Le();},[O,Le,H]),Jo=Ln.useCallback(()=>{n||(qe([]),ge([]),lt(),we.current&&clearTimeout(we.current),ht([],I),Pe(false),Ue.current.emit("clear",null),oe("Canvas cleared"));},[n,qe,ge,lt,I,ht,oe]),pi=Ln.useCallback(q=>{n||(qe(q),ge(q),lt(),Le(),we.current&&clearTimeout(we.current),ht(q,I),oe(`Imported ${q.length} elements`));},[n,qe,ge,lt,Le,I,ht,oe]),Qo=Ln.useCallback(()=>{if(n||Ce.length===0)return;let q=O.filter(ct=>Ce.includes(ct.id));if(q.length===0)return;let Me=O.reduce((ct,wt)=>Math.max(ct,wt.zIndex??0),0),{clonedElements:ze,newSelectedIds:ft}=Mr(q,{deltaX:24,deltaY:24,highestZ:Me}),gt=bt([...O,...ze]);ge(gt),nt(ft),qe(gt);},[n,O,Ce,ge,nt,qe]),en=Ln.useCallback(()=>{if(n||Ce.length<2)return;let q=`grp_${Date.now()}_${Math.random().toString(36).substring(2,7)}`,Me=O.map(ze=>{if(Ce.includes(ze.id)){let ft=ze.groupIds||[];return {...ze,groupIds:[...ft,q]}}return ze});ge(Me),qe(Me);},[n,O,Ce,ge,qe]),tn=Ln.useCallback(()=>{if(n||Ce.length===0)return;let q=new Set;if(O.forEach(ze=>{Ce.includes(ze.id)&&ze.groupIds&&ze.groupIds.length>0&&q.add(ze.groupIds[ze.groupIds.length-1]);}),q.size===0)return;let Me=O.map(ze=>{if(ze.groupIds&&ze.groupIds.length>0){let ft=ze.groupIds[ze.groupIds.length-1];if(q.has(ft)){let gt=ze.groupIds.slice(0,-1);return {...ze,groupIds:gt.length>0?gt:void 0}}}return ze});ge(Me),qe(Me);},[n,O,Ce,ge,qe]),jn=Ln.useCallback(async()=>{let q=Ie.length>0?Ie:O;if(q.length===0){oe("Canvas is empty");return}let Me=await go(q,{scale:2,backgroundColor:"transparent",padding:30});oe(Me?Ie.length>0?`Copied ${Ie.length} element${Ie.length>1?"s":""} as PNG!`:"Copied canvas image to clipboard as PNG!":"Failed to copy image to clipboard");},[Ie,O,oe]),Gn=Ln.useCallback(q=>{if(n||Ce.length<2)return;let Me=Mo(O,Ce,q);ge(Me),qe(Me);},[n,O,Ce,ge,qe]),Kn=Ln.useCallback(q=>{if(n||Ce.length<2)return;let Me=No(O,Ce,q);ge(Me),qe(Me);},[n,O,Ce,ge,qe]),ui=Ln.useCallback(q=>{if(n)return;let Me=new Image;Me.onload=()=>{let ze=Me.naturalWidth||400,ft=Me.naturalHeight||300,gt=ze,ct=ft,wt=500;(gt>wt||ct>wt)&&(gt>=ct?(ct=Math.round(ct/gt*wt),gt=wt):(gt=Math.round(gt/ct*wt),ct=wt));let yt={x:typeof window<"u"?window.innerWidth/2:500,y:typeof window<"u"?window.innerHeight/2:400},st=m(yt),It=`el_${Date.now()}_${Math.random().toString(36).substring(2,7)}`,Wt=O.reduce((Ht,or)=>Math.max(Ht,or.zIndex??0),0),Ft={...L,id:It,type:"image",x:Math.round(st.x-gt/2),y:Math.round(st.y-ct/2),width:gt,height:ct,dataUrl:q,naturalWidth:ze,naturalHeight:ft,aspectRatioLocked:true,opacity:1,zIndex:Wt+1};Nt(Ft),nt([It]),T("select"),qe([...O,Ft]);},Me.src=q;},[n,L,O,Nt,nt,qe,m]),hi=Ln.useCallback((q,Me,ze)=>{if(n)return;let ft=typeof window<"u"?window.innerWidth:1200,gt=typeof window<"u"?window.innerHeight:800,ct=m({x:ft/2,y:gt/2}),wt=Date.now(),yt=Math.random().toString(36).substring(2,7),st=`group_stencil_${wt}_${yt}`,It=O.reduce((Ht,or)=>Math.max(Ht,or.zIndex??0),0),Wt=[];if(ze==="badge"){let nr=ct.x-80,Er=ct.y-64/2,br={id:`stencil_card_${wt}_${yt}`,type:"rectangle",x:Math.round(nr),y:Math.round(Er),width:160,height:64,edgeStyle:"round",strokeColor:"#e2e8f0",strokeWidth:1.5,strokeStyle:"solid",fillColor:"#ffffff",fillStyle:"solid",opacity:1,zIndex:It+1,groupIds:[st]},Vr={id:`stencil_icon_${wt}_${yt}`,type:"image",x:Math.round(nr+14),y:Math.round(Er+14),width:36,height:36,dataUrl:q,naturalWidth:128,naturalHeight:128,aspectRatioLocked:true,strokeColor:"#000000",strokeWidth:1,strokeStyle:"solid",fillColor:"transparent",fillStyle:"transparent",opacity:1,zIndex:It+2,groupIds:[st]},Lt={id:`stencil_text_${wt}_${yt}`,type:"text",x:Math.round(nr+58),y:Math.round(Er+20),width:90,height:24,text:Me,fontSize:16,fontFamily:"sans",textAlign:"left",strokeColor:"#111827",strokeWidth:1,strokeStyle:"solid",fillColor:"transparent",fillStyle:"transparent",opacity:1,zIndex:It+3,groupIds:[st]};Wt=[br,Vr,Lt];}else Wt=[{id:`stencil_logo_${wt}_${yt}`,type:"image",x:Math.round(ct.x-36),y:Math.round(ct.y-36),width:72,height:72,dataUrl:q,naturalWidth:128,naturalHeight:128,aspectRatioLocked:true,strokeColor:"#000000",strokeWidth:1,strokeStyle:"solid",fillColor:"transparent",fillStyle:"transparent",opacity:1,zIndex:It+1}];let Ft=bt([...O,...Wt]);ge(Ft),nt(Wt.map(Ht=>Ht.id)),qe(Ft),T("select"),oe(`\u2728 Added ${Me} stencil!`);},[n,m,O,ge,nt,qe,oe]),xi=Ln.useCallback((q,Me,ze)=>{if(n)return;let ft=typeof window<"u"?window.innerWidth:1200,gt=typeof window<"u"?window.innerHeight:800,ct=m({x:ft/2,y:gt/2}),wt=O.reduce((Lt,wr)=>Math.max(Lt,wr.zIndex??0),0),yt=`tbl_${Date.now()}_${Math.random().toString(36).substring(2,7)}`,st=Me||3,It=ze||3,Wt=[],Ft=[],Ht={},or=true,nr="header-accent";if(q==="swot")st=2,It=2,Wt=[200,200],Ft=[140,140],or=false,nr="swot",Ht={"0_0":{text:`\u{1F4AA} STRENGTHS
|
|
126
|
+
\u2022 Core competency
|
|
127
|
+
\u2022 Proprietary tech`,bold:true,align:"left"},"0_1":{text:`\u26A0\uFE0F WEAKNESSES
|
|
128
|
+
\u2022 Resource gaps
|
|
129
|
+
\u2022 Low brand recall`,bold:true,align:"left"},"1_0":{text:`\u{1F680} OPPORTUNITIES
|
|
130
|
+
\u2022 New market growth
|
|
131
|
+
\u2022 Partner ecosystem`,bold:true,align:"left"},"1_1":{text:`\u{1F6D1} THREATS
|
|
132
|
+
\u2022 Emerging rivals
|
|
133
|
+
\u2022 Shifting policy`,bold:true,align:"left"}};else if(q==="kanban")st=4,It=3,Wt=[180,180,180],Ft=[44,70,70,70],or=true,nr="kanban",Ht={"0_0":{text:"\u{1F4CB} TO DO",bold:true,align:"center"},"0_1":{text:"\u26A1 IN PROGRESS",bold:true,align:"center"},"0_2":{text:"\u2705 DONE",bold:true,align:"center"},"1_0":{text:"Design system setup",align:"left"},"1_1":{text:"Auth flow endpoints",align:"left"},"1_2":{text:"Project kickoff",align:"left"}};else if(q==="matrix")st=4,It=3,Wt=[160,140,140],Ft=[44,40,40,40],or=true,nr="header-accent",Ht={"0_0":{text:"Feature",bold:true,align:"center"},"0_1":{text:"Starter",bold:true,align:"center"},"0_2":{text:"Enterprise",bold:true,align:"center"},"1_0":{text:"Realtime Collab",align:"left"},"1_1":{text:"Basic",align:"center"},"1_2":{text:"Unlimited",align:"center"},"2_0":{text:"Cloud Stencils",align:"left"},"2_1":{text:"50+",align:"center"},"2_2":{text:"All Included",align:"center"},"3_0":{text:"Vector PDF Export",align:"left"},"3_1":{text:"Yes",align:"center"},"3_2":{text:"Yes",align:"center"}};else {Wt=Array.from({length:It},()=>140),Ft=Array.from({length:st},()=>42);for(let Lt=0;Lt<It;Lt++)Ht[`0_${Lt}`]={text:`Column ${Lt+1}`,bold:true,align:"center"};}let Er=Wt.reduce((Lt,wr)=>Lt+wr,0),br=Ft.reduce((Lt,wr)=>Lt+wr,0),Vr={...L,id:yt,type:"table",x:Math.round(ct.x-Er/2),y:Math.round(ct.y-br/2),width:Er,height:br,rows:st,cols:It,colWidths:Wt,rowHeights:Ft,cells:Ht,hasHeaderRow:or,hasHeaderCol:false,tableStyle:nr,zIndex:wt+1};Nt(Vr),nt([yt]),T("select"),qe([...O,Vr]),oe("Table inserted");},[n,m,O,L,Nt,nt,qe,oe]),fi=Ln.useCallback((q,Me)=>{if(n)return;let ze=typeof window<"u"?window.innerWidth:1200,ft=typeof window<"u"?window.innerHeight:800,gt=m({x:ze/2,y:ft/2}),ct=Ua(q,gt,Re),wt=ct.map(br=>br.id),yt=[];if(Me==="replace")yt=ct,ge(yt),er(yt),nt(wt);else {let br=O.reduce((Lt,wr)=>Math.max(Lt,wr.zIndex??0),0),Vr=ct.map((Lt,wr)=>({...Lt,zIndex:br+1+wr}));yt=bt([...O,...Vr]),ge(yt),nt(wt),qe(yt);}let st=jt(ct,60),It=st.minX+st.width/2,Wt=st.minY+st.height/2,Ft=140,Ht=Math.max(200,ze-Ft*2),or=Math.max(200,ft-Ft*2),nr=Math.max(.35,Math.min(1.15,Math.min(Ht/st.width,or/st.height)));H({x:Math.round(ze/2-It*nr),y:Math.round(ft/2-Wt*nr),zoom:nr}),T("select");let Er=_o.find(br=>br.id===q);oe(`\u2728 ${Me==="replace"?"Loaded":"Inserted"} ${Er?.title||"template"}!`);},[n,m,Re,O,ge,er,nt,qe,H,oe]),gi=Ln.useCallback(()=>{let q=JSON.stringify(O);V==="unsaved"||q!==Ze.current||I!==De.current?ve(true):a?.();},[V,O,I,a]),bi=Ln.useCallback(()=>{we.current&&clearTimeout(we.current),ht(O,I),ve(false),a?.();},[O,I,ht,a]),mi=Ln.useCallback(()=>{we.current&&clearTimeout(we.current),ve(false),a?.();},[a]),To=Ln.useMemo(()=>({loadDocument:q=>{ge(q.elements||[]),er(q.elements||[]),Ee(q.name||"Untitled"),q.canvasBackground&&w(q.canvasBackground),q.gridStyle&&v(q.gridStyle);},getDocument:()=>({version:1,name:I,elements:O,canvasBackground:$,gridStyle:f,createdAt:Date.now(),updatedAt:Date.now()}),clear:()=>Jo(),addElement:q=>{let Me={...L,id:q.id||`el_${Date.now()}_${Math.random().toString(36).slice(2,7)}`,...q};return Nt(Me),qe([...O,Me]),Me},updateElement:(q,Me)=>{Kt(q,Me);},deleteElements:q=>{let Me=new Set(q),ze=O.filter(ft=>!Me.has(ft.id));ge(ze),qe(ze);},getElements:()=>O,getSelectedElements:()=>Ie,setSelection:q=>nt(q),clearSelection:()=>lt(),undo:()=>Yt(),redo:()=>Ut(),canUndo:()=>pt,canRedo:()=>Wr,getCamera:()=>tr,setZoom:q=>H(Me=>({...Me,zoom:q})),panTo:(q,Me)=>H(ze=>({...ze,x:q,y:Me})),zoomToFit:()=>Pr(),resetZoom:()=>H(q=>({...q,zoom:1})),on:(q,Me)=>Ue.current.on(q,Me),destroy:()=>Ue.current.clear()}),[I,O,Ie,$,f,Jo,L,Nt,Kt,Dt,nt,lt,Yt,Ut,pt,Wr,tr,H,Pr,qe,ge,er,Ee]);Ln.useImperativeHandle(P,()=>To,[To]),Ln.useImperativeHandle(y,()=>To,[To]);let yi=k?.showTopBar??true,ki=!n&&(k?.showToolBar??true),wi=!n&&(k?.showPropertiesPanel??true),vi=k?.showMinimap??true,_i=k?.showShortcutsButton??true,Un=k?.showPresentation??true,rn=!n&&(k?.showTechStencils??true),on=!n&&(k?.showTemplates??true),Si=O.some(q=>q.type==="frame"),Ci=O.filter(q=>q.type==="frame").length;return jsxRuntime.jsx($o.Provider,{value:{theme:u,resolvedTheme:He,isDark:Re,panelVariant:i},children:jsxRuntime.jsxs("div",{className:`fk-sketch-root ${Re?"dark":""} fk-panel-${i} relative w-full h-full min-h-[500px] overflow-hidden select-none font-inter touch-none ${Re?"bg-[#121316]":"bg-[#f0f4f8]"} ${_}`,"data-theme":He,"data-panel":i,style:S,children:[jsxRuntime.jsxs("div",{"aria-hidden":"true",className:"fixed -left-[9999px] -top-[9999px] pointer-events-none opacity-0 select-none overflow-hidden h-0 w-0",children:[jsxRuntime.jsx("span",{style:{fontFamily:"'Patrick Hand SC', sans-serif"},children:"THE QUICK BROWN FOX"}),jsxRuntime.jsx("span",{style:{fontFamily:"'Fuzzy Bubbles', cursive, sans-serif",fontWeight:400},children:"The quick brown fox"}),jsxRuntime.jsx("span",{style:{fontFamily:"'Fuzzy Bubbles', cursive, sans-serif",fontWeight:700},children:"The quick brown fox"}),jsxRuntime.jsx("span",{style:{fontFamily:"'Comic Neue', cursive, sans-serif"},children:"The quick brown fox"})]}),yi&&!E&&jsxRuntime.jsx(Rn,{boardName:I,setBoardName:Ee,onOpenExport:()=>U(true),onOpenTemplates:on?()=>Ne(q=>!q):void 0,onCopyImage:jn,onStartPresentation:Un?()=>ee(true):void 0,hasFrames:Si,frameCount:Ci,isFramesOutlineOpen:Se,onToggleFramesOutline:()=>Ke(q=>!q),onOpenTechStencils:rn?()=>Oe(q=>!q):void 0,isTechStencilsOpen:X,onClearBoard:()=>Pe(true),onExit:a?gi:void 0,saveStatus:V,onManualSave:xt,elementCount:O.length,zoom:tr.zoom,zoomIn:ce,zoomOut:Be,resetCamera:Pr,canUndo:pt,canRedo:Wr,undo:Yt,redo:Ut,tool:C,setTool:rr,gridStyle:f,setGridStyle:v,isSpotlightActive:te,onToggleSpotlight:()=>ie(q=>!q)}),ki&&!E&&jsxRuntime.jsx(In,{tool:C,setTool:rr,isToolLocked:W,setIsToolLocked:le,onInsertImage:ui,onOpenTemplates:on?()=>Ne(q=>!q):void 0,isTemplatesOpen:je,onOpenTechStencils:rn?()=>Oe(q=>!q):void 0,isTechStencilsOpen:X,onInsertTablePreset:xi}),wi&&!E&&C!=="laser"&&jsxRuntime.jsx(Sn,{selectedElements:Ie,updateSelectedElements:zt,deleteSelectedElements:Dt,duplicateSelectedElements:Qo,groupSelectedElements:en,ungroupSelectedElements:tn,alignSelectedElements:Gn,distributeSelectedElements:Kn,bringToFront:fr,sendToBack:pr,bringForward:gr,sendBackward:kt,defaultStyles:L,setDefaultStyles:A,canvasBackground:rt,setCanvasBackground:w}),!n&&!E&&!F&&C!=="laser"&&jsxRuntime.jsx(fn,{selectedElements:Ie,updateSelectedElements:zt,deleteSelectedElements:Dt,duplicateSelectedElements:Qo,groupSelectedElements:en,ungroupSelectedElements:tn,alignSelectedElements:Gn,distributeSelectedElements:Kn,copySelectedImage:jn,bringToFront:fr,sendToBack:pr,camera:tr,worldToScreen:j,onEditText:q=>Z(q.id),onToggleSpotlight:()=>ie(q=>!q)}),jsxRuntime.jsx(dn,{elements:O,setElements:re,selectedIds:Ce,selectElement:Rt,selectElements:nt,clearSelection:lt,addElement:Nt,updateElement:Kt,deleteSelectedElements:Dt,duplicateSelectedElements:Qo,groupSelectedElements:en,ungroupSelectedElements:tn,pushHistory:qe,undo:Yt,redo:Ut,camera:tr,setCamera:H,screenToWorld:m,worldToScreen:j,panBy:ne,zoomAtPoint:G,tool:C,setTool:rr,isToolLocked:W,setIsToolLocked:le,gridStyle:f,defaultStyles:L,editingElementId:F,setEditingElementId:Z,canvasBackground:rt,isPresentationOpen:E,laserColor:ue,laserMode:Y,laserStrokes:M,setLaserStrokes:pe,laserPointerPos:g,setLaserPointerPos:D}),!E&&C==="laser"&&jsxRuntime.jsx(bn,{laserColor:ue,setLaserColor:K,laserMode:Y,setLaserMode:Q,onClearLaser:ur,laserStrokeCount:M.filter(q=>q.mode==="persistent").length,onExitLaser:Zo}),_i&&!E&&jsxRuntime.jsx(Cn,{guideHref:x,onOpenGuide:b}),vi&&!E&&jsxRuntime.jsx(kn,{elements:O,camera:tr,setCamera:H}),jsxRuntime.jsx(xn,{isOpen:be,onClose:()=>U(false),elements:O,selectedIds:Ce,onImportElements:pi,boardName:I,canvasBackground:rt,gridStyle:f}),Un&&jsxRuntime.jsx(wn,{isOpen:E,onClose:()=>ee(false),elements:O,selectedIds:Ce,camera:tr,setCamera:H,isSpotlightActive:te,onToggleSpotlight:()=>ie(q=>!q)}),jsxRuntime.jsx(gn,{isOpen:Se,onClose:()=>Ke(false),elements:O,setElements:re,selectedIds:Ce,selectElements:nt,updateElement:Kt,pushHistory:qe,camera:tr,setCamera:H,onStartPresentation:()=>{Ke(false),ee(true);}}),on&&jsxRuntime.jsx(zn,{isOpen:je,onClose:()=>Ne(false),onSelectTemplate:fi,hasExistingElements:O.length>0}),rn&&jsxRuntime.jsx($n,{isOpen:X,onClose:()=>Oe(false),onInsertTechStencil:hi}),jsxRuntime.jsx(Nn,{isActive:te,onClose:()=>ie(false),selectedElements:Ie,allElements:O,camera:tr,worldToScreen:j,screenToWorld:m,onSelectElement:Rt,isDark:Re}),jsxRuntime.jsx(hn,{elements:O,selectedIds:Ce,boardName:I,onManualSave:xt,onClearBoard:()=>Pe(true),gridStyle:f,setGridStyle:v,resetCamera:Pr,canvasBackground:rt}),_e&&jsxRuntime.jsx("div",{className:"fixed inset-0 z-50 flex items-center justify-center p-4 bg-black/40 backdrop-blur-xs animate-in fade-in duration-150",children:jsxRuntime.jsxs("div",{className:"w-full max-w-md rounded-2xl bg-[#f0f3f8] dark:bg-[#1a1d24] border border-white/60 dark:border-white/[0.08] p-6 shadow-2xl",children:[jsxRuntime.jsxs("div",{className:"flex items-start gap-4",children:[jsxRuntime.jsx("div",{className:"w-10 h-10 rounded-xl bg-red-100 dark:bg-red-950/60 text-red-600 dark:text-red-400 flex items-center justify-center shrink-0 border border-red-200 dark:border-red-900/50",children:jsxRuntime.jsx(iconsReact.IconTrash,{size:20,stroke:2})}),jsxRuntime.jsxs("div",{children:[jsxRuntime.jsx("h3",{className:"text-base font-semibold text-neutral-900 dark:text-neutral-100",children:"Clear whiteboard canvas?"}),jsxRuntime.jsxs("p",{className:"text-sm text-neutral-600 dark:text-neutral-400 mt-1.5 leading-relaxed",children:["This will remove all elements on the current board. You can still undo this action using"," ",jsxRuntime.jsx("kbd",{className:"px-1.5 py-0.5 rounded bg-neutral-200 dark:bg-neutral-800 text-neutral-800 dark:text-neutral-200 text-xs font-mono",children:"Ctrl+Z"}),"."]})]})]}),jsxRuntime.jsxs("div",{className:"mt-6 flex items-center justify-end gap-2.5",children:[jsxRuntime.jsx("button",{type:"button",onClick:()=>Pe(false),className:"rounded-lg h-9 px-4 text-sm font-medium border border-neutral-300 dark:border-neutral-700 bg-white dark:bg-neutral-800 text-neutral-800 dark:text-neutral-200 hover:bg-neutral-50 dark:hover:bg-neutral-700 cursor-pointer",children:"Cancel"}),jsxRuntime.jsx("button",{type:"button",onClick:Jo,className:"rounded-lg h-9 px-4 text-sm font-medium bg-red-600 hover:bg-red-700 text-white cursor-pointer shadow-sm",children:"Clear Canvas"})]})]})}),he&&jsxRuntime.jsx("div",{className:"fixed inset-0 z-50 flex items-center justify-center p-4 bg-black/40 backdrop-blur-xs animate-in fade-in duration-150",children:jsxRuntime.jsxs("div",{className:"w-full max-w-md rounded-2xl bg-[#f0f3f8] dark:bg-[#1a1d24] border border-white/60 dark:border-white/[0.08] p-6 shadow-2xl",children:[jsxRuntime.jsxs("div",{className:"flex items-start gap-4",children:[jsxRuntime.jsx("div",{className:"w-10 h-10 rounded-xl bg-amber-100 dark:bg-amber-950/60 text-amber-600 dark:text-amber-400 flex items-center justify-center shrink-0 border border-amber-200 dark:border-amber-900/50",children:jsxRuntime.jsx(iconsReact.IconLogout,{size:20,stroke:2})}),jsxRuntime.jsxs("div",{children:[jsxRuntime.jsx("h3",{className:"text-base font-semibold text-neutral-900 dark:text-neutral-100",children:"Save changes before exiting?"}),jsxRuntime.jsx("p",{className:"text-sm text-neutral-600 dark:text-neutral-400 mt-1.5 leading-relaxed",children:"You have unsaved changes on your board. Would you like to save your work before leaving?"})]})]}),jsxRuntime.jsxs("div",{className:"mt-6 flex items-center justify-end gap-2.5",children:[jsxRuntime.jsx("button",{type:"button",onClick:mi,className:"rounded-lg h-9 px-3.5 text-xs text-neutral-500 hover:text-red-600 dark:text-neutral-400 dark:hover:text-red-400 cursor-pointer",children:"Discard Changes"}),jsxRuntime.jsx("button",{type:"button",onClick:()=>ve(false),className:"rounded-lg h-9 px-4 text-sm font-medium border border-neutral-300 dark:border-neutral-700 bg-white dark:bg-neutral-800 text-neutral-800 dark:text-neutral-200 hover:bg-neutral-50 dark:hover:bg-neutral-700 cursor-pointer",children:"Cancel"}),jsxRuntime.jsx("button",{type:"button",onClick:bi,className:"rounded-lg h-9 px-4 text-sm font-semibold bg-indigo-600 hover:bg-indigo-700 text-white cursor-pointer shadow-sm",children:"Save & Exit"})]})]})}),N&&jsxRuntime.jsx("div",{className:"fixed bottom-6 left-1/2 -translate-x-1/2 z-50 pointer-events-none animate-in fade-in slide-in-from-bottom-3 duration-150",children:jsxRuntime.jsxs("div",{className:"flex items-center gap-2 px-4 py-2.5 rounded-full bg-neutral-900/95 dark:bg-neutral-100/95 text-white dark:text-neutral-900 text-xs font-medium shadow-2xl backdrop-blur-md border border-white/10 dark:border-black/10",children:[jsxRuntime.jsx("svg",{width:"15",height:"15",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round",className:"text-emerald-400 dark:text-emerald-600 shrink-0",children:jsxRuntime.jsx("polyline",{points:"20 6 9 17 4 12"})}),jsxRuntime.jsx("span",{children:N})]})})]})})});exports.DEFAULT_ELEMENT_STYLES=nn;exports.DEFAULT_STARTER_ELEMENTS=Eo;exports.DIAGRAM_TEMPLATES=_o;exports.SKETCH_DOCUMENT_VERSION=Dn;exports.SketchBoardCanvas=dn;exports.SketchBoardContextMenu=hn;exports.SketchBoardExportModal=xn;exports.SketchBoardFloatingDock=fn;exports.SketchBoardFramesOutline=gn;exports.SketchBoardLaserDock=bn;exports.SketchBoardMinimap=kn;exports.SketchBoardPresentationMode=wn;exports.SketchBoardPropertiesPanel=Sn;exports.SketchBoardShortcutsModal=Cn;exports.SketchBoardSpotlightOverlay=Nn;exports.SketchBoardTechStencilsModal=$n;exports.SketchBoardTemplatesFlyout=zn;exports.SketchBoardToolBar=In;exports.SketchBoardTopBar=Rn;exports.SketchEditor=Ad;exports.SketchEventEmitter=Co;exports.TECH_CATEGORIES=Pn;exports.TECH_ICONS=En;exports.alignElements=Mo;exports.cloneSketchBoardElements=Mr;exports.copyImageToClipboard=go;exports.createEmptyDocument=Ed;exports.distributeElements=No;exports.downloadFile=yr;exports.exportFrameToPng=bo;exports.exportToPng=Jr;exports.exportToSvg=fo;exports.exportWhiteboardToPdf=mo;exports.getElementsBoundingBox=jt;exports.isValidSketchDocument=Wn;exports.parseDocument=$d;exports.saveOrDownloadFile=Gr;exports.serializeDocument=Td;exports.updateBoundArrows=bt;exports.useHydrated=ao;exports.useSketchBoardCamera=Fn;exports.useSketchBoardElements=Hn;exports.useSketchBoardHistory=Xn;exports.useSketchTheme=Vt;exports.useSketchThemeContext=no;
|