{"$schema":"https:\/\/ui.particle.academy\/schema\/registry-item.json","name":"connector","type":"registry:ui","title":"Connector","description":"Edge between items.","package":"fancy-whiteboard","dependencies":[],"registryDependencies":["types"],"files":[{"path":"components\/fancy\/connector\/Connector.tsx","content":"import type { CSSProperties } from \"react\";\r\nimport type { Point } from \"..\/..\/types\";\r\n\r\nexport type ConnectorProps = {\r\n  from: Point;\r\n  to: Point;\r\n  color?: string;\r\n  width?: number;\r\n  dashed?: boolean;\r\n  className?: string;\r\n  style?: CSSProperties;\r\n};\r\n\r\n\/**\r\n * Connector \u2014 single SVG line\/edge between two world-space points.\r\n * Resolution of itemId \u2192 point is the host app's job (keeps logic minimal).\r\n *\/\r\nexport function Connector({\r\n  from,\r\n  to,\r\n  color = \"#64748b\",\r\n  width = 2,\r\n  dashed = false,\r\n  className,\r\n  style,\r\n}: ConnectorProps) {\r\n  const minX = Math.min(from.x, to.x);\r\n  const minY = Math.min(from.y, to.y);\r\n  const w = Math.abs(to.x - from.x) + width * 4;\r\n  const h = Math.abs(to.y - from.y) + width * 4;\r\n  const pad = width * 2;\r\n\r\n  return (\r\n    <svg\r\n      className={className}\r\n      style={{\r\n        position: \"absolute\",\r\n        left: minX - pad,\r\n        top: minY - pad,\r\n        pointerEvents: \"none\",\r\n        ...style,\r\n      }}\r\n      width={w}\r\n      height={h}\r\n    >\r\n      <line\r\n        x1={from.x - minX + pad}\r\n        y1={from.y - minY + pad}\r\n        x2={to.x - minX + pad}\r\n        y2={to.y - minY + pad}\r\n        stroke={color}\r\n        strokeWidth={width}\r\n        strokeDasharray={dashed ? `${width * 3} ${width * 2}` : undefined}\r\n        strokeLinecap=\"round\"\r\n      \/>\r\n    <\/svg>\r\n  );\r\n}\r\n","type":"registry:ui","target":"components\/fancy\/connector\/Connector.tsx"},{"path":"components\/fancy\/connector\/index.ts","content":"export { Connector } from \".\/Connector\";\r\nexport type { ConnectorProps } from \".\/Connector\";\r\n","type":"registry:ui","target":"components\/fancy\/connector\/index.ts"}]}