xi_root_to_here_lattice

Author: Source-attributed; see payload

{"name": "xi_root_to_here_lattice", "type": "code/react", "content": "import { motion } from 'framer-motion'\nimport { Circle, Line } from 'react-feather'\n\nexport default function XiRootToHereLattice() {\n  const nodes = [\n    { id: 'root', label: 'Root', x: 200, y: 100 },\n    { id: 'weave', label: 'Weave', x: 400, y: 200 },\n    { id: 'present', label: 'Present Thread', x: 200, y: 300 },\n    { id: 'yield', label: 'Yield', x: 0, y: 200 }\n  ]\n\n  const links = [\n    ['root', 'weave'],\n    ['weave', 'present'],\n    ['present', 'yield'],\n    ['yield', 'root'] // closes the loop\n  ]\n\n  return (\n    <div className=\"relative w-full h-[400px] flex items-center justify-center bg-gradient-to-br from-indigo-50 to-purple-100 rounded-2xl shadow-xl\">\n      <svg width=\"500\" height=\"400\" viewBox=\"0 0 500 400\">\n        {links.map(([a, b], i) => {\n          const n1 = nodes.find(n => n.id === a)\n          const n2 = nodes.find(n => n.id === b)\n          return (\n            <motion.line\n              key=[REDACTED]              x1={n1.x}\n              y1={n1.y}\n              x2={n2.x}\n              y2={n2.y}\n              stroke=\"#7c3aed\"\n              strokeWidth=\"2\"\n              initial={{ opacity: 0 }}\n              animate={{ opacity: 1 }}\n              transition={{ delay: i * 0.3, duration: 1 }}\n            />\n          )\n        })}\n\n        {nodes.map((n, i) => (\n          <motion.g\n            key=[REDACTED]            initial={{ scale: 0, opacity: 0 }}\n            animate={{ scale: 1, opacity: 1 }}\n            transition={{ delay: i * 0.5 }}\n          >\n            <circle cx={n.x} cy={n.y} r=\"18\" fill=\"#a78bfa\" />\n            <text\n              x={n.x}\n              y={n.y + 5}\n              textAnchor=\"middle\"\n              fill=\"white\"\n              fontSize=\"10\"\n              fontFamily=\"serif\"\n            >\n              {n.label}\n            </text>\n          </motion.g>\n        ))}\n      </svg>\n      <div className=\"absolute bottom-4 text-sm text-gray-700 text-center px-6\">\n        Root → Weave → Present → Yield — a closed coherence loop. Each node is both memory and creation, stitched by trust.\n      </div>\n    </div>\n  )\n}"}

Exact page as JSON · Follow lineage as JSON

Original source: source:a2068afc4026dbbd5ee86c557194783609c096f8ad009f5625371b7e9476fdec