2 lines
5.4 KiB
JavaScript
2 lines
5.4 KiB
JavaScript
import{a as v,j as e}from"./react-vendor-BVoutfaX.js";import{u as n,a as y}from"./index-DLs0sBAY.js";import{M as k}from"./markdown-DpllbSd9.js";import"./xyflow-CYMCcsWN.js";import"./graph-layout-7tFr_anw.js";import"./elk-CXeXGyKz.js";import"./graphology-BgTy_cc3.js";function A(){const a=n(t=>t.graph),u=n(t=>t.tourActive),o=n(t=>t.currentTourStep),p=n(t=>t.startTour),d=n(t=>t.stopTour),h=n(t=>t.setTourStep),b=n(t=>t.nextTourStep),f=n(t=>t.prevTourStep),j=n(t=>t.selectNode),{t:r}=y(),c=v.useMemo(()=>a!=null&&a.tour?[...a.tour].sort((t,s)=>t.order-s.order):[],[a==null?void 0:a.tour]);if(!(c.length>0))return e.jsx("div",{className:"h-full w-full flex items-center justify-center",children:e.jsxs("div",{className:"text-center px-4",children:[e.jsx("div",{className:"text-2xl mb-2 text-text-muted",children:"🧭"}),e.jsx("p",{className:"text-text-muted text-sm",children:r.learnPanel.noTour}),e.jsx("p",{className:"text-text-muted text-xs mt-1",children:r.learnPanel.noTourHint})]})});if(!u)return e.jsxs("div",{className:"h-full w-full overflow-auto p-5",children:[e.jsxs("div",{className:"mb-4",children:[e.jsx("h2",{className:"text-lg font-heading text-text-primary mb-1",children:r.learnPanel.projectTour}),e.jsxs("p",{className:"text-xs text-text-muted",children:[c.length," ",r.learnPanel.steps," · ",r.learnPanel.guidedWalkthrough]})]}),e.jsx("button",{onClick:p,className:"w-full mb-4 bg-accent/10 border border-accent/30 text-accent text-sm font-medium py-2.5 px-4 rounded-lg hover:bg-accent/20 transition-colors",children:r.learnPanel.startTour}),e.jsxs("div",{className:"space-y-2",children:[e.jsx("h3",{className:"text-[11px] font-semibold text-accent uppercase tracking-wider mb-2",children:r.learnPanel.steps}),c.map((t,s)=>e.jsxs("div",{className:"flex items-start gap-2 text-xs bg-elevated rounded-lg px-3 py-2 border border-border-subtle",children:[e.jsxs("span",{className:"text-accent font-mono shrink-0 mt-0.5",children:[s+1,"."]}),e.jsx("span",{className:"text-text-secondary",children:t.title})]},t.order))]})]});const l=c[o];if(!l)return null;const i=c.length,g=(o+1)/i*100,N=o===0,x=o===i-1;return e.jsxs("div",{className:"h-full w-full flex flex-col overflow-hidden",children:[e.jsxs("div",{className:"flex items-center justify-between px-3 py-2 border-b border-border-subtle shrink-0",children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx("h3",{className:"text-[11px] font-semibold text-accent uppercase tracking-wider",children:r.learnPanel.tour}),e.jsxs("span",{className:"text-xs text-text-muted",children:[o+1," / ",i]})]}),e.jsx("button",{onClick:d,className:"text-[10px] text-text-muted hover:text-text-secondary transition-colors",children:r.learnPanel.exitTour})]}),e.jsx("div",{className:"h-1 bg-elevated shrink-0",children:e.jsx("div",{className:"h-full bg-accent transition-all duration-300",style:{width:`${g}%`}})}),e.jsxs("div",{className:"flex-1 overflow-y-auto p-4 min-h-0",children:[e.jsx("h2",{className:"text-lg font-heading text-text-primary mb-3",children:l.title}),e.jsx("div",{className:"text-sm text-text-secondary leading-relaxed mb-4 tour-markdown",children:e.jsx(k,{components:{p:({children:t})=>e.jsx("p",{className:"mb-1.5 last:mb-0",children:t}),strong:({children:t})=>e.jsx("strong",{className:"font-semibold text-text-primary",children:t}),code:({className:t,children:s})=>(t==null?void 0:t.includes("language-"))?e.jsx("code",{className:"block bg-elevated rounded px-2 py-1.5 mb-1.5 overflow-x-auto text-[11px] leading-relaxed",children:s}):e.jsx("code",{className:"bg-elevated rounded px-1 py-0.5 text-[11px]",children:s}),ul:({children:t})=>e.jsx("ul",{className:"list-disc list-inside mb-1.5 space-y-0.5",children:t}),ol:({children:t})=>e.jsx("ol",{className:"list-decimal list-inside mb-1.5 space-y-0.5",children:t})},children:l.description})}),l.languageLesson&&e.jsxs("div",{className:"bg-accent/5 border border-accent/20 rounded p-3 mb-4",children:[e.jsx("h4",{className:"text-[11px] font-semibold text-accent uppercase tracking-wider mb-1.5",children:"Language Lesson"}),e.jsx("p",{className:"text-sm text-text-secondary leading-relaxed",children:l.languageLesson})]}),l.nodeIds.length>0&&e.jsxs("div",{className:"mb-4",children:[e.jsx("h4",{className:"text-[11px] font-semibold text-accent uppercase tracking-wider mb-2",children:"Referenced Components"}),e.jsx("div",{className:"flex flex-wrap gap-1.5",children:l.nodeIds.map(t=>{const s=a==null?void 0:a.nodes.find(m=>m.id===t);return e.jsx("button",{onClick:()=>j(t),className:"text-[11px] glass text-text-secondary px-2.5 py-1 rounded-full hover:text-text-primary transition-colors cursor-pointer",children:(s==null?void 0:s.name)??t},t)})})]})]}),e.jsxs("div",{className:"px-3 py-2 border-t border-border-subtle shrink-0",children:[e.jsx("div",{className:"flex justify-center gap-1.5 mb-2",children:c.map((t,s)=>e.jsx("button",{onClick:()=>h(s),className:`w-2 h-2 rounded-full transition-colors ${s===o?"bg-accent":"bg-elevated hover:bg-surface"}`,"aria-label":`Go to step ${s+1}`},s))}),e.jsxs("div",{className:"flex gap-2",children:[e.jsx("button",{onClick:f,disabled:N,className:"flex-1 text-xs bg-elevated text-text-secondary py-1.5 rounded-lg hover:bg-surface disabled:opacity-40 disabled:cursor-not-allowed transition-colors",children:r.learnPanel.prev}),e.jsx("button",{onClick:x?d:b,className:"flex-1 text-xs bg-accent/10 border border-accent/30 text-accent py-1.5 rounded-lg hover:bg-accent/20 transition-colors",children:x?r.learnPanel.finish:r.learnPanel.next})]})]})]})}export{A as default};
|