https://buildingsolo.ai/assets/IndexPageClient-n5mfiEmB.js

1import{j as e,r as c,a2 as I}from"./index-tq9olAXh.js";import{H as F}from"./Header-tXKi6gCp.js";import{L as M,S as A}from"./SocratifyFooter-ClD3i5I9.js";import{g as E}from"./nav-BhdAQ4OW.js";import{C as P}from"./media-DM1J2RoJ.js";import{b as f,n as B}from"./index-ChzI8hAA.js";import{u as U}from"./navigation-D14t6rRc.js";import{c as o}from"./cn-CDN07tui.js";import{S as w}from"./search-BmdHa2lU.js";import{X as H}from"./x-BJXtGVgX.js";import{c as v}from"./createLucideIcon-C6o_Ardj.js";import{c as N,a as k,I as j}from"./constants-CcoeshOP.js";import{A as R}from"./arrow-right-DPQL2S5I.js";import{m as u}from"./proxy-c4hv2G--.js";import{A as z}from"./index-CyNjiJtc.js";import"./menu-DzzFSFlv.js";import"./base-B2Km_2Nq.js";import"./resolve-elements-juiWZL7b.js";const O=v("ChevronLeft",[["path",{d:"m15 18-6-6 6-6",key:"1wnfg3"}]]);const q=v("ChevronRight",[["path",{d:"m9 18 6-6-6-6",key:"mthhwq"}]]);function T(){return e.jsx("section",{className:"border-border border-b px-6 py-16",children:e.jsxs("div",{className:"mx-auto max-w-5xl",children:[e.jsxs("div",{className:"mb-6 flex items-center justify-center gap-2",children:[e.jsx("span",{className:"text-muted-foreground text-sm",children:"Sponsored by"}),e.jsx(P,{src:M.socratify,alt:"Socratify",width:20,height:20,className:"object-contain"}),e.jsx("span",{className:"text-foreground/80 text-sm font-medium",children:"Socratify"})]}),e.jsxs("h1",{className:"text-foreground font-display mb-4 text-center text-4xl font-bold tracking-tight md:text-5xl",children:["A Pattern Language",e.jsx("br",{}),e.jsx("span",{style:{color:f.orange},children:"for AI Agents"})]}),e.jsx("p",{className:"text-muted-foreground mx-auto max-w-2xl text-center text-lg",children:"Inspired by Christopher Alexander's timeless 

1work—proven patterns for building effective, reliable, and elegant AI agent systems."})]})})}function X({value:t,onChange:s,resultCount:r,showClear:n=!0,placeholder:a="Search...",className:l,containerClassName:p,...d}){const g=t&&typeof r=="number";return e.jsxs("div",{className:o("border-border bg-muted focus-within:border-ring focus-within:ring-ring/30 flex items-center gap-2 rounded-lg border px-3 py-2 transition-colors focus-within:ring-2",p),children:[e.jsx(w,{size:16,className:"text-muted-foreground shrink-0","aria-hidden":"true"}),e.jsx("input",{type:"search",value:t,onChange:x=>s(x.target.value),placeholder:a,className:o("text-foreground placeholder:text-muted-foreground min-w-0 flex-1 bg-transparent text-sm outline-none",l),...d}),g?e.jsxs("span",{className:"text-muted-foreground shrink-0 text-[10px] tabular-nums",children:[r," result",r===1?"":"s"]}):null,n&&t?e.jsx("button",{type:"button",onClick:()=>s(""),className:"hover:bg-background/80 text-muted-foreground inline-flex h-5 w-5 shrink-0 items-center justify-center rounded transition-colors","aria-label":"Clear search",children:e.jsx(H,{size:12,"aria-hidden":"true"})}):null]})}const _=[{value:null,label:"All",icon:null},{value:2,label:"Invariant",icon:"★★"},{value:1,label:"Emerging",icon:"★"},{value:0,label:"Tentative",icon:"○"}];function D({activeFilter:t,onChange:s}){return e.jsx("div",{className:"bg-muted flex items-center gap-1 rounded-xl p-1",children:_.map(({value:r,label:n,icon:a})=>e.jsxs("button",{type:"button",onClick:()=>s(r),className:o("rounded-lg px-3 py-1.5 text-xs font-medium transition-all duration-200","flex items-center gap-1.5",t===r?"bg-background text-foreground":"text-muted-foreground bg-transparent"),children:[a&&e.jsx("span",{style:{color:f.orange},children:a}),e.jsx("span",{children:n})]},n))})}function G({currentPage:t,totalPages:s,onPageChange:r}){return s<=1?null:e.jsxs("div",{className:"flex items-center justify-center gap-2",children:[e.jsx("button",{type:"button",onClick:()=>r(t-1),disabled:t===1,className:o("text-muted-foreground rounded-lg p-2 transition-all duration-200",t===1?"cursor-not-allowed opacity-40":"hover:bg-muted"),"aria-label":"Previous page",children:e.jsx(O,{className:"h-5 w-5"})}),e.jsx("div",{className:"flex items-center gap-1",children:Array.from({length:s},(n,a)=>a+1).map(n=>e.jsx("button",{type:"button",onClick:()=>r(n),className:o("h-9 w-9 rounded-lg text-sm font-medium transition-all duration-200",t===n?"text-white":"text-muted-foreground bg-transparent"),style:t===n?{backgroundColor:f.orange}:void 0,"aria-label":`Page ${n}`,"aria-current":t===n?"page":void 0,children:n},n))}),e.jsx("button",{type:"button",onClick:()=>r(t+1),disabled:t===s,className:o("text-muted-foreground rounded-lg p-2 transition-all duration-200",t===s?"cursor-not-allowed opacity-40":"hover:bg-muted"),"aria-label":"Next page",children:e.jsx(q,{className:"h-5 w-5"})})]})}const Q=t=>e.jsxs("svg",{viewBox:"0 0 200 200",className:"h-full w-full",children:[e.jsx("defs",{children:e.jsx("pattern",{id:"grid-ctx",width:"20",height:"20",patternUnits:"userSpaceOnUse",children:e.jsx("path",{d:"M 20 0 L 0 0 0 20",fill:"none",stroke:`${t}15`,strokeWidth:"0.5"})})}),e.jsx("rect",{width:"200",height:"200",fill:`${t}08`}),e.jsx("rect",{width:"200",height:"200",fill:"url(#grid-ctx)"}),[0,1,2,3].map(s=>e.jsxs("g",{children:[e.jsx("rect",{x:50,y:35+s*35,width:100,height:28,rx:4,fill:s===0?`${t}30`:`${t}15`,stroke:t,strokeWidth:s===0?2:1,strokeDasharray:s>1?"4 2":void 0}),e.jsx("line",{x1:35,y1:49+s*35,x2:50,y2:49+s*35,stroke:t,strokeWidth:1})]},s)),e.jsx("path",{d:"M170 100 L180 100 M175 95 L180 100 L175 105",stroke:t,strokeWidth:2,fill:"none"})]}),V=t=>e.jsxs("svg",{viewBox:"0 0 200 200",className:"h-full w-full",children:[e.jsx("defs",{children:e.jsx("pattern",{id:"grid-flow",width:"20",height:"20",patternUnits:"userSpaceOnUse",children:e.jsx("path",{d:"M 20 0 L 0 0 0 20",fill:"none",stroke:`${t}15`,strokeWidth:"0.5"})})}),e.jsx("rect",{width:"200",height:"200",fill:`${t}08`}),e.jsx("rect",{width:"200",height:"200",fill:"url(#grid-flow)"}),e.jsx("circle",{cx:100,cy:100,r:55,fill:"none",stroke:`${t}30`,strokeWidth:2,strokeDasharray:"8 4"}),e.jsx("circle",{cx:100,cy:45,r:16,fill:`${t}20`,stroke:t,strokeWidth:2}),e.jsx("circle",{cx:155,cy:100,r:16,fill:`${t}20`,stroke:t,strokeWidth:2}),e.jsx("circle",{cx:100,cy:155,r:16,fill:`${t}20`,stroke:t,strokeWidth:2}),e.jsx("circle",{cx:45,cy:100,r:16,fill:`${t}20`,stroke:t,strokeWidth:2}),e.jsx("path",{d:"M120 55 L125 50 L130 55",stroke:t,strokeWidth:2,fill:"none"}),e.jsx("path",{d:"M145 120 L150 125 L145 130",stroke:t,strokeWidth:2,fill:"none"}),e.jsx("path",{d:"M80 145 L75 150 L70 145",stroke:t,strokeWidth:2,fill:"none"}),e.jsx("path",{d:"M55 80 L50 75 L55 70",stroke:t,strokeWidth:2,fill:"none"})]}),J=t=>e.jsxs("svg",{viewBox:"0 0 200 200",className:"h-full w-full",children:[e.jsx("defs",{children:e.jsx("pattern",{id:"grid-prompt",width:"20",height:"20",patternUnits:"userSpaceOnUse",children:e.jsx("path",{d:"M 20 0 L 0 0 0 20",fill:"none",stroke:`${t}15`,strokeWidth:"0.5"})})}),e.jsx("rect",{width:"200",height:"200",fill:`${t}08`}),e.jsx("rect",{width:"200",height:"200",fill:"url(#grid-prompt)"}),e.jsx("rect",{x:45,y:30,width:110,height:140,rx:6,fill:`${t}15`,stroke:t,strokeWidth:2}),e.jsx("rect",{x:60,y:48,width:80,height:8,rx:2,fill:t}),[0,1,2,3,4].map(s=>e.jsx("rect",{x:60,y:70+s*18,width:70-s%2*15,height:4,rx:2,fill:`${t}50`},s)),e.jsx("rect",{x:60,y:155,width:2,height:10,fill:t,children:e.jsx("animate",{attributeName:"opacity",values:"1;0;

11",dur:"1s",repeatCount:"indefinite"})})]}),K=t=>e.jsxs("svg",{viewBox:"0 0 200 200",className:"h-full w-full",children:[e.jsx("defs",{children:e.jsx("pattern",{id:"grid-tool",width:"20",height:"20",patternUnits:"userSpaceOnUse",children:e.jsx("path",{d:"M 20 0 L 0 0 0 20",fill:"none",stroke:`${t}15`,strokeWidth:"0.5"})})}),e.jsx("rect",{width:"200",height:"200",fill:`${t}08`}),e.jsx("rect",{width:"200",height:"200",fill:"url(#grid-tool)"}),e.jsx("rect",{x:35,y:40,width:130,height:120,rx:8,fill:"#18181b",stroke:t,strokeWidth:2}),e.jsx("rect",{x:35,y:40,width:130,height:24,rx:8,fill:`${t}30`}),e.jsx("circle",{cx:50,cy:52,r:4,fill:"#EF4444"}),e.jsx("circle",{cx:64,cy:52,r:4,fill:"#F59E0B"}),e.jsx("circle",{cx:78,cy:52,r:4,fill:"#10B981"}),e.jsx("text",{x:45,y:82,fill:t,fontSize:10,fontFamily:"monospace",children:"$ agent run"}),e.jsx("text",{x:45,y:100,fill:`${t}70`,fontSize:10,fontFamily:"monospace",children:"→ executing..."}),e.jsx("text",{x:45,y:118,fill:"#10B981",fontSize:10,fontFamily:"monospace",children:"✓ complete"}),e.jsx("rect",{x:45,y:130,width:6,height:12,fill:t,children:e.jsx("animate",{attributeName:"opacity",values:"1;0;1",dur:"0.8s",repeatCount:"indefinite"})})]}),Y={ctx:Q,flow:V,prompt:J,tool:K};function Z({pattern:t,onClick:s}){const r=N[t.category],[n,a]=c.useState(!1),l=Y[t.category];return e.jsxs(u.article,{onClick:s,onMouseEnter:()=>a(!0),onMouseLeave:()=>a(!1),className:o("group bg-muted border-border relative cursor-pointer overflow-hidden rounded-2xl border","transition-all duration-300 ease-out"),style:{borderColor:n?r:void 0,boxShadow:n?`0 20px 40px -12px rgba(0,0,0,0.5), 0 0 0 1px ${r}40`:"0 1px 3px rgba(0,0,0,0.1)"},layout:!0,initial:{opacity:0,y:20},animate:{opacity:1,y:0},exit:{opacity:0,y:-20},whileHover:{y:-6},transition:{duration:.3},children:[e.jsxs("div",{className:"relative aspect-square overflow-hidden",children:[l&&l(r),e.jsx("div",{className:"from-muted absolute inset-x-0 bottom-0 h-20 bg-gradient-to-t to-transparent"}),e.jsx("div",{className:"absolute top-3 left-3",children:e.jsx("span",{className:"bg-background/90 rounded-md px-2.5 py-1 font-mono text-xs font-bold tracking-wider",style:{color:r,border:`1px solid ${r}40`},children:t.number})}),e.jsx("div",{className:"absolute top-3 right-3",children:e.jsxs("span",{className:"text-base tracking-tight",style:{color:f.orange},children:[t.confidence>=1?"★":"☆",t.confidence>=2?"★":"☆"]})})]}),e.jsxs("div",{className:"relative -mt-6 p-4 pt-0",children:[e.jsxs("div",{className:"mb-2 flex items-center gap-2",children:[e.jsx("span",{className:"text-muted-foreground font-mono text-[10px] tracking-widest uppercase",children:k[t.category]}),t.containsCount>0&&e.jsxs(e.Fragment,{children:[e.jsx("span",{className:"text-muted-foreground/40",children:"•"}),e.jsxs("span",{className:"text-muted-foreground text-[10px]",children:[t.containsCount," sub-pattern",t.containsCount!==1?"s":""]})]})]}),e.jsx("h3",{className:"font-display text-foreground mb-3 line-clamp-2 text-base leading-snug font-semibold",children:t.title}),e.jsxs(u.div,{className:"flex items-center gap-1.5 text-sm font-medium",style:{color:r},initial:{opacity:0,x:-10},animate:{opacity:n?1:0,x:n?0:-10},transition:{duration:.2},children:[e.jsx("span",{children:"View pattern"}),e.jsx(R,{className:"h-4 w-4"})]})]}),e.jsx(u.div,{className:"absolute right-0 bottom-0 left-0 h-1",style:{backgroundColor:r},initial:{scaleX:0},animate:{scaleX:n?1:0},transition:{duration:.3}})]})}function ee({category:t,count:s,isActive:r,onClick:n}){const a=t==="all"?B[500]:N[t],l=t==="all"?"All":k[t];return e.jsxs("button",{type:"button",onClick:n,className:o("flex items-center gap-2 rounded-xl px-4 py-2.5 text-sm font-medium","transition-all duration-200",r?"scale-105":"text-muted-foreground bg-muted border-border border hover:-translate-y-0.5 hover:scale-[1.04] hover:shadow-md"),style:r?{color:a,backgroundColor:`${a}15`,border:`1px solid ${a}40`,boxShadow:`0 4px 12px ${a}20`}:void 0,children:[e.jsx("span",{children:l}),e.jsx("span",{className:o("rounded-md px-2 py-0.5 font-mono text-xs",!r&&"bg-muted"),style:r?{backgroundColor:`${a}25`}:void 0,children:s})]})}function te({patterns:t,categoryCounts:s}){const r=U(),[n,a]=c.useState("all"),[l,p]=c.useState(null),[d,g]=c.useState(""),[x,m]=c.useState(1),h=c.useMemo(()=>t.filter(i=>{if(n!=="all"&&i.category!==n||l!==null&&i.confidence!==l)return!1;if(d){const y=d.toLowerCase();return i.title.toLowerCase().includes(y)||i.number.toLowerCase().includes(y)}return!0}),[t,n,l,d]),b=Math.ceil(h.length/j),C=h.slice((x-1)*j,x*j),L=i=>{a(i),m(1)},S=i=>{p(i),m(1)},$=i=>{g(i),m(1)},W=i=>{r.push(`/pattern/${i.toLowerCase()}`)};return e.jsxs(e.Fragment,{children:[e.jsx("section",{className:"border-border border-b px-6 py-6",children:e.jsx("div",{className:"mx-auto flex max-w-5xl flex-wrap items-center justify-center gap-3",children:["all","ctx","flow","prompt","tool"].map(i=>e.jsx(ee,{category:i,count:s[i],isActive:n===i,onClick:()=>L(i)},i))})}),e.jsx("main",{className:"flex-1 px-6 py-10",children:e.jsxs("div",{className:"mx-auto max-w-6xl",children:[e.jsxs("div",{className:"mb-8 flex flex-wrap items-center justify-between gap-4",children:[e.jsxs("div",{className:"flex flex-wrap items-center gap-4",children:[e.jsx(D,{activeFilter:l,onChange:S}),e.jsx("div",{className:"w-64",children:e.jsx(X,{value:d,onChange:$,placeholder:"Search patterns...",showClear:!1,containerClassName:"rounded-xl px-4 py-3"})})]}),e.jsxs("span",{className:"text-muted-foreground font-mono text-sm",children:[h.length," pattern",h.length!==1?"s":"",d&&` matching "${d}"`]})]}),e.jsx(u.div,{className:"grid grid-cols-1 gap-5 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4",layout:!0,children:e.jsx(z,{mode:"popLayout",initial:!1,children:C.map(i=>e.jsx(Z,{pattern:i,onClick:()=>W(i.number)},i.number))})}),h.length===0&&e.jsxs("div",{className:"py-20 text-center",children:[e.jsx("div",{className:"bg-muted mb-4 inline-flex h-16 w-16 items-center justify-center rounded-full",children:e.jsx(w,{className:"text-muted-foreground h-8 w-8"})}

1),e.jsx("p",{className:"text-foreground/80 text-lg font-medium",children:"No patterns found"})]}),b>1&&e.jsx("div",{className:"mt-10",children:e.jsx(G,{currentPage:x,totalPages:b,onPageChange:m})})]})})]})}function ye({patterns:t,categoryCounts:s}){const r=I();return e.jsxs("div",{className:"flex min-h-screen flex-col bg-[var(--color-surface-page,#f2f3f5)]",children:[e.jsx(F,{links:E(r),currentPath:"/"}),e.jsx(T,{}),e.jsx(te,{patterns:t,categoryCounts:s}),e.jsx(A,{variant:"compact",appName:"Agentic Pattern Language"})]})}export{ye as IndexPageClient,ye as default};