293b10866b015222.js

js claron.dev collected 2026-10-02 01:52:40 UTC 109,524 bytes, 6 lines download raw bytes

1(globalThis.TURBOPACK||(globalThis.TURBOPACK=[])).push(["object"==typeof document?document.currentScript:void 0,790510,e=>{"use strict";var t=e.i(843476),r=e.i(271645),a=e.i(289309);function s(){let{setLoaded:e}=(0,a.useLoading)();return(0,r.useEffect)(()=>{e(!0)},[e]),(0,t.jsx)("div",{"aria-hidden":!0,className:"landing-entrance-line"})}e.s(["Preloader",()=>s])},387652,e=>{"use strict";var t=e.i(271645),r=e.i(749652);let a={some:0,all:1};function s(e,{root:n,margin:i,amount:o,once:l=!1,initial:c=!1}={}){let[d,x]=(0,t.useState)(c);return(0,t.useEffect)(()=>{if(!e.current||l&&d)return;let t={root:n&&n.current||void 0,margin:i,amount:o};return function(e,t,{root:s,margin:n,amount:i="some"}={}){let o=(0,r.resolveElements)(e),l=new WeakMap,c=new IntersectionObserver(e=>{e.forEach(e=>{let r=l.get(e.target);if(!!r!==e.isIntersecting)if(e.isIntersecting){let r=t(e.target,e);"function"==typeof r?l.set(e.target,r):c.unobserve(e.target)}else"function"==typeof r&&(r(e),l.delete(e.target))})},{root:s,rootMargin:n,threshold:"number"==typeof i?i:a[i]});return o.forEach(e=>c.observe(e)),()=>c.disconnect()}(e.current,()=>(x(!0),l?void 0:()=>x(!1)),t)},[n,e,i,l,o]),d}e.s(["useInView",()=>s],387652)},228525,e=>{"use strict";var t=e.i(843476),r=e.i(271645),a=e.i(770703),s=e.i(846932),n=e.i(887652),i=e.i(387652),o=e.i(310542),l=e.i(895420),c=e.i(772328),d=e.i(972520);let x=(0,e.i(475254).default)("arrow-down",[["path",{d:"M12 5v14",key:"s699le"}],["path",{d:"m19 12-7 7-7-7",key:"1idqje"}]]);var m=e.i(604756),u=e.i(778790),p=e.i(279151);let h=(0,a.default)(()=>e.A(636881),{loadableGenerated:{modules:[888795]},ssr:!1}),f=(0,a.default)(()=>e.A(424798),{loadableGenerated:{modules:[642096]},ssr:!1}),b=(0,a.default)(()=>e.A(125859),{loadableGenerated:{modules:[777815]},ssr:!1}),g=e=>{let t=window.matchMedia("(min-width: 768px)");return t.addEventListener("change",e),()=>t.removeEventListener("change",e)},v=()=>window.matchMedia("(min-width: 768px)").matches,j=()=>!1,y=[.22,1,.36,1];function w(){let e=(0,r.useRef)(null),a=(0,r.useRef)(null),w=(0,r.useRef)(null),N=(0,r.useRef)(null),k=(0,r.useSyncExternalStore)(g,v,j),C=(0,c.useReducedMotion)(),z=(0,i.useInView)(e,{margin:"400px 0px"}),[S,_]=(0,r.useState)(-.06),[M,E]=(0,r.useState)(!1),[A,R]=(0,r.useState)(!1),F=(0,n.useMotionValue)(.5),B=(0,n.useMotionValue)(.5),{scrollYProgress:T}=(0,o.useScroll)({target:e,offset:["start start","end start"]}),L=(0,l.useTransform)(T,[0,1],[0,-35]);return(0,r.useEffect)(()=>{let e=N.current;if(!k||!e||M)return;let t=new IntersectionObserver(([e])=>{e?.isIntersecting&&(E(!0),t.disconnect())},{threshold:.01});return t.observe(e),()=>t.disconnect()},[k,M]),(0,r.useEffect)(()=>{let t=()=>{let t=w.current||a.current;if(!e.current||!t)return;let r=e.current.getBoundingClientRect(),s=t.getBoundingClientRect();0===r.height||_(.5-(s.top-r.top)/r.height)};t(),window.addEventListener("resize",t);let r=new ResizeObserver(t);e.current&&r.observe(e.current);let s=w.current||a.current;return s&&r.observe(s),()=>{window.removeEventListener("resize",t),r.disconnect()}},[]),(0,t.jsxs)("div",{className:"landing-hero","data-landing-section-active":z?"true":"false",children:[(0,t.jsxs)("section",{ref:e,className:"landing-hero-scene min-h-[calc(100svh-64px)] sm:min-h-[calc(100svh-72px)] flex flex-col justify-between relative overflow-hidden",onPointerEnter:()=>{k&&!C&&R(!0)},onPointerMove:e=>{if(C||"mouse"!==e.pointerType)return;k&&!A&&R(!0);let t=e.currentTarget.getBoundingClientRect();F.set((e.clientX-t.left)/t.width),B.set((e.clientY-t.top)/t.height)},onPointerLeave:()=>{F.set(.5),B.set(.5)},children:[(0,t.jsx)("div",{"aria-hidden":!0,className:"landing-laser-bg",children:(0,t.jsx)(h,{color:"#008cb4",backgroundColor:"#030508",horizontalBeamOffset:.16*!!k,verticalBeamOffset:S,horizontalSizing:k?.72:1.4,verticalSizing:k?2:2.4,wispDensity:k?1:1.2,wispSpeed:k?20:40,wispIntensity:3.5,flowSpeed:k?.5:1.2,flowStrength:k?.2:.3,fogIntensity:k?.18:.22,fogScale:.51,fogFallSpeed:k?.35:.6,decay:1.3,falloffStart:k?1.15:1.35,containerRef:e,beamDuration:k?1.3:.85})}),k&&A&&(0,t.jsx)(f,{color:"#00a9d8",brightness:.35,trailLength:24,inertia:.4,bloomStrength:.05,bloomRadius:.6,bloomThreshold:.05,grainIntensity:.02,maxDevicePixelRatio:.5,targetPixels:5e5,fadeDelayMs:700,fadeDurationMs:1e3,mixBlendMode:"screen",edgeIntensity:.4,zIndex:1}),(0,t.jsx)("div",{className:"relative z-10 w-full max-w-[1400px] mx-auto px-4 sm:px-6 pt-6 sm:pt-10 pb-3 sm:pb-4",children:(0,t.jsxs)(s.motion.div,{className:"w-full max-w-[720px] pointer-events-auto",style:C?void 0:{y:L},children:[(0,t.jsxs)("h1",{className:"landing-headline mb-4 sm:mb-8",children:[(0,t.jsx)(s.motion.span,{initial:!C&&{opacity:0,y:26},animate:!C&&{opacity:1,y:0},transition:{duration:.9,delay:2.5,ease:y},className:"block",children:"Everything"}),(0,t.jsxs)(s.motion.span,{initial:!C&&{opacity:0,y:26},animate:!C&&{opacity:1,y:0},transition:{duration:.9,delay:2.75,ease:y},className:"landing-headline-last block",children:["clicks",(0,t.jsx)(s.motion.span,{initial:!C&&{opacity:0,scale:.4},animate:!C&&{opacity:1,scale:1},transition:{duration:.7,delay:2.95,ease:y},className:"inline-block text-[#00a9d8] drop-shadow-[0_0_16px_rgba(0,169,216,0.5)]",children:"."})]})]}),(0,t.jsxs)("div",{children:[(0,t.jsxs)(s.motion.p,{initial:!C&&{opacity:0,y:18},animate:!C&&{opacity:1,y:0},transition:{duration:.85,delay:3.15,ease:y},className:"landing-hero-description text-ui-md sm:text-ui-lg leading-relaxed max-w-[540px]",children:["The bug. The context. The fix.",(0,t.jsx)("br",{className:"hidden sm:inline"})," ",(0,t.jsx)("span",{className:"text-stone-400 block sm:inline",children:"Finally, in the same place."})]}),(0,t.jsxs)(s.motion.div,{initial:!C&&{opacity:0,y:18},animate:!C&&{opacity:1,y:0},transition:{duration:.85,delay:3.35,ease:y},className:"landing-hero-actions flex flex-col sm:flex-row items-stretch sm:items-center gap-2.5 sm:gap-3 mt-6 sm:mt-8",children:[(0,t.jsx)(m.Button,{as:"a",href:"/signup",variant:"primary",size:"default",glow:!0,className:"w-full sm:w-auto justify-center !text-ui-sm sm:!text-ui-md h-11 px-6 font-medium rounded-lg",rightIcon:(0,t.jsx)(d.ArrowRight,{size:16}),children:"Start building for free"}),(0,t.jsx)(m.Button,{as:"a",href:"#story",variant:"ghost",size:"default",className:"w-full sm:w-auto justify-center !text-ui-sm sm:!text-ui-md h-11 px-4 font-medium text-text-secondary hover:text-foreground",rightIcon:(0,t.jsx)(x,{size:16}

1),children:"See how it all connects"})]}),(0,t.jsx)(s.motion.p,{initial:!C&&{opacity:0,y:14},animate:!C&&{opacity:1,y:0},transition:{duration:.8,delay:3.55,ease:y},className:"landing-hero-note text-ui-xs sm:text-ui-md text-text-muted mt-4 sm:mt-6",children:"Free to start. Made for your whole team."})]})]})}),(0,t.jsx)("div",{ref:w,className:"relative z-10 w-full max-w-[1400px] mx-auto px-4 sm:px-6",children:(0,t.jsx)(s.motion.div,{initial:!C&&{opacity:0,y:36},animate:!C&&{opacity:1,y:0},transition:{duration:.95,delay:1.3,ease:y},style:{willChange:"transform, opacity"},children:(0,t.jsxs)(p.Card,{ref:a,radius:"3xl",animated:!1,className:"relative w-full rounded-t-[24px] sm:rounded-t-[32px] rounded-b-none border-b-0 bg-gradient-to-b from-[#031826]/95 via-[#020f1a]/92 to-[#010810]/98 backdrop-blur-[24px] shadow-[0_-12px_40px_-10px_rgba(0,169,216,0.2),inset_0_1px_1px_rgba(255,255,255,0.15),inset_0_40px_80px_-40px_rgba(0,169,216,0.12)] transition-all duration-500 overflow-hidden",children:[(0,t.jsx)(s.motion.div,{initial:!C&&{opacity:0},animate:!C&&{opacity:1},transition:{duration:.85,delay:1.45,ease:y},className:"absolute inset-0 rounded-t-[24px] sm:rounded-t-[32px] pointer-events-none z-10",style:{padding:"1px",paddingBottom:"0",background:`radial-gradient(100% 100% at ${k?"calc(50% + min(100vw, 1600px) * 0.16)":"50%"} 0%, rgba(0,169,216,0.5) 0%, rgba(0,169,216,0.2) 25%, rgba(0,169,216,0.12) 100%)`,WebkitMask:"linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0)",WebkitMaskComposite:"xor",maskComposite:"exclude"}}),(0,t.jsx)(s.motion.div,{initial:!C&&{opacity:0,scaleX:.7},animate:!C&&{opacity:1,scaleX:1},transition:{duration:.8,delay:1.55,ease:y},className:"absolute inset-0 rounded-t-[24px] sm:rounded-t-[32px] pointer-events-none z-[21] origin-center",style:{padding:"1.5px",paddingBottom:"0",background:`radial-gradient(${k?"220px":"320px"} 100% at ${k?"calc(50% + min(100vw, 1600px) * 0.16)":"50%"} 0%, rgba(180,240,255,0.65) 0%, rgba(0,169,216,0.35) 45%, transparent 100%)`,WebkitMask:"linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0)",WebkitMaskComposite:"xor",maskComposite:"exclude",filter:"drop-shadow(0 0 6px rgba(0,169,216,0.35))"}}),(0,t.jsx)("div",{className:"absolute inset-0 z-0 opacity-[0.03] pointer-events-none mix-blend-screen rounded-t-[24px] sm:rounded-t-[32px] overflow-hidden",style:{backgroundImage:'url("data:image/svg+xml,%3Csvg viewBox=%220 0 200 200%22 xmlns=%22http://www.w3.org/2000/svg%22%3E%3Cfilter id=%22noise%22%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.8%22 numOctaves=%223%22 stitchTiles=%22stitch%22/%3E%3C/filter%3E%3Crect width=%22100%25%22 height=%22100%25%22 filter=%22url(%23noise)%22/%3E%3C/svg%3E")'}}),(0,t.jsx)("div",{className:"absolute inset-0 z-0 pointer-events-none opacity-[0.2] rounded-t-[24px] sm:rounded-t-[32px] overflow-hidden",style:{backgroundImage:"radial-gradient(rgba(0,169,216,0.3) 1px, transparent 1px)",backgroundSize:"24px 24px",backgroundPosition:"50% 0%"}}),(0,t.jsx)(s.motion.div,{initial:!C&&{opacity:0,scale:.7},animate:!C&&{opacity:1,scale:1},transition:{duration:.75,delay:1.6,ease:y},className:`absolute top-0 pointer-events-none -translate-x-1/2 -translate-y-1/2 ${k?"w-[200px]":"w-[280px]"} h-[36px] bg-[radial-gradient(ellipse_50%_50%_at_50%_50%,rgba(0,169,216,0.25)_0%,transparent_70%)] blur-[10px] z-20 origin-center`,style:{left:k?"calc(50% + min(100vw, 1600px) * 0.16)":"50%"}}),(0,t.jsx)("div",{className:"relative z-30 pointer-events-auto grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 divide-y sm:divide-y-0 sm:divide-x divide-[#00a9d8]/15 w-full px-2 lg:px-4 py-3 sm:py-6",children:[{number:"01",title:"Capture",detail:"Tester marks bug directly on preview.",sub:"DOM, console, network auto-saved"},{number:"02",title:"Understand",detail:"Spotlight replay guides developer live.",sub:"Zero lost context or guesswork"},{number:"03",title:"Resolve",detail:"AI maps bug to source & opens PR.",sub:"Linear & Jira fully two-way synced"},{number:"04",title:"Verify",detail:"Auto-rebuilds and diffs pixel-perfect.",sub:"Before/after verified before merge"}].map((e,r)=>(0,t.jsxs)(s.motion.div,{initial:!C&&{opacity:0,y:18},animate:!C&&{opacity:1,y:0},transition:{duration:.75,delay:C?0:1.75+.2*r,ease:y},className:"p-3 sm:p-5 flex flex-col justify-between",children:[(0,t.jsxs)("div",{children:[(0,t.jsx)("div",{className:"mb-1.5 sm:mb-3",children:(0,t.jsxs)(u.Badge,{variant:"primary",size:"sm",radiu

1s:"md",className:"font-mono text-[10px] sm:text-[11px] tracking-wider",children:[e.number," / WORKFLOW"]})}),(0,t.jsx)("h3",{className:"text-ui-sm sm:text-ui-md font-semibold text-foreground mb-0.5 sm:mb-1",children:e.title}),(0,t.jsx)("p",{className:"text-ui-xs sm:text-ui-md text-text-secondary leading-relaxed",children:e.detail})]}),(0,t.jsx)("span",{className:"text-[11px] sm:text-ui-sm text-text-muted mt-2 sm:mt-4 block font-mono",children:e.sub})]},e.number))})]})})})]}),(0,t.jsx)("div",{ref:N,className:"landing-signature",children:k&&M&&(0,t.jsx)("div",{className:"w-full h-full landing-webgl-shell overflow-hidden rounded-xl",children:(0,t.jsx)(b,{brushSize:140,strength:.22,swirl:.8,rings:4,spread:5,fade:2.5,spacing:14,tintAmount:0,grayscale:!1,highlightColor:"#ffffff",trigger:"hover",logoSrc:"/logo-transparent.webp",revealText:"SQUASH BUGS"})})})]})}e.s(["HeroSection",()=>w],228525)},839310,e=>{"use strict";var t=e.i(843476),r=e.i(846932),a=e.i(486427),s=e.i(387652),n=e.i(310542),i=e.i(895420),o=e.i(271645),l=e.i(101593),c=e.i(127615);let d={primary:{border:"border-claron-primary/20 dark:border-claron-primary/12",glowLine:"from-transparent via-claron-primary/50 to-transparent",glowBg:"var(--claron-primary-glow)",numberColor:"text-claron-primary/5 dark:text-claron-primary/5",numberBorder:"border-claron-primary",numberText:"text-claron-primary",numberShadow:"shadow-[0_0_15px_var(--color-claron-primary-glow)]",contentBorder:"border-claron-primary/20 dark:border-claron-primary/10",contentBg:"bg-claron-primary-bg/40 dark:bg-claron-primary-bg/20"},node:{border:"border-claron-node/20 dark:border-claron-node/12",glowLine:"from-transparent via-claron-node/50 to-transparent",glowBg:"var(--claron-node-glow)",numberColor:"text-claron-node/5 dark:text-claron-node/5",numberBorder:"border-claron-node",numberText:"text-claron-node",numberShadow:"shadow-[0_0_15px_var(--color-claron-node-glow)]",contentBorder:"border-claron-node/20 dark:border-claron-node/10",contentBg:"bg-claron-node-bg/40 dark:bg-claron-node-bg/20"},ai:{border:"border-claron-ai/20 dark:border-claron-ai/12",glowLine:"from-transparent via-claron-ai/50 to-transparent",glowBg:"var(--claron-ai-glow)",numberColor:"text-claron-ai/5 dark:text-claron-ai/5",numberBorder:"border-claron-ai",numberText:"text-claron-ai",numberShadow:"shadow-[0_0_15px_var(--color-claron-ai-glow)]",contentBorder:"border-claron-ai/20 dark:border-claron-ai/10",contentBg:"bg-claron-ai-bg/50 dark:bg-claron-ai-bg/20"},rose:{border:"border-claron-rose/20 dark:border-claron-rose/12",glowLine:"from-transparent via-claron-rose/50 to-transparent",glowBg:"var(--claron-rose-glow)",numberColor:"text-claron-rose/4 dark:text-claron-rose/4",numberBorder:"border-claron-rose",numberText:"text-claron-rose",numberShadow:"shadow-[0_0_15px_var(--color-claron-rose-glow)]",contentBorder:"border-claron-rose/20 dark:border-claron-rose/10",contentBg:"bg-claron-rose-bg/40 dark:bg-claron-rose-bg/20"}},x=(0,a.motionValue)(0),m=(0,o.createContext)(x),u=(0,o.createContext)(!0),p=new Set,h=null,f=null,b=!1;function g(){if(h=null,document.hidden)return;let e=window.scrollY||document.documentElement.scrollTop||0,t=e+window.innerHeight;for(let r of p){let a=r.top,s=a+r.height>e-r.retentionMargin&&a<t+r.preloadMargin;!r.entered&&a<t+180&&(r.entered=!0,r.setEntered(!0)),s!==r.active&&(r.active=s,r.element.dataset.storyActive=s?"true":"false",r.setActive(s))}}function v(e){let t=0,r=e;for(;r;)t+=r.offsetTop,r=r.offsetParent;return t}function j(){null===f&&(f=window.requestAnimationFrame(()=>{if(f=null,0!==p.size){for(let e of p)e.top=v(e.element),e.height=e.element.offsetHeight;y()}}))}function y(){null===h&&(h=window.requestAnimationFrame(g))}function w({children:e}){let{scrollYProgress:r}

1=(0,n.useScroll)(),a=(0,i.useTransform)(r,[0,1],[0,-400]);return(0,t.jsx)(m.Provider,{value:a,children:e})}function N(){return(0,o.useContext)(u)}function k({number:e,accent:a,icon:n,badge:i,headline:x,description:h,children:f,reverse:g=!1,zIndex:w=10,stickyTop:N=16,className:k}){let C=(0,l.useIsMobile)(),z=(0,o.useRef)(null),S=(0,o.useRef)(null),_=(0,s.useInView)(S,{once:!0,margin:"800px 0px"}),{active:M,entered:E}=function(e,t=300,r=80){let[a,s]=(0,o.useState)(!1),[n,i]=(0,o.useState)(!1);return(0,o.useEffect)(()=>{let a=e.current;if(!a)return;b||(b=!0,window.addEventListener("scroll",y,{passive:!0}),window.addEventListener("resize",j,{passive:!0}),document.addEventListener("visibilitychange",y),document.fonts?.ready.then(j));let n={element:a,setActive:s,active:!1,entered:!1,setEntered:i,retentionMargin:t,preloadMargin:r,top:v(a),height:a.offsetHeight};return p.add(n),j(),()=>{p.delete(n)}},[r,e,t]),{active:a,entered:n}}(z,300,80),A=(0,o.useContext)(m),R=d[a];return(0,t.jsx)("div",{ref:z,"data-story-active":M?"true":"false","data-story-entered":E?"true":"false",className:(0,c.cn)("relative lg:sticky w-[92vw] lg:w-[90vw] mx-auto","min-h-0 lg:h-[80vh] flex flex-col justify-center overflow-hidden","mb-6 lg:mb-[30vh]",k),style:{zIndex:w,top:C?void 0:N,"--story-enter-delay":`${Math.min(180,Math.max(0,(Number(e)-1)*20))}ms`},children:(0,t.jsxs)("div",{className:(0,c.cn)("feature-panel w-full h-full min-h-0 lg:h-[80vh]","bg-background/80 dark:bg-background/90 backdrop-blur-xl","border rounded-2xl overflow-hidden relative","flex flex-col justify-center","shadow-[0_8px_40px_color-mix(in_srgb,var(--foreground)_8%,transparent)]","dark:shadow-[0_8px_60px_color-mix(in_srgb,var(--background)_50%,transparent)]",R.border),children:[(0,t.jsx)("div",{className:(0,c.cn)("absolute top-0 inset-x-0 h-px bg-linear-to-r rounded-t-2xl",R.glowLine)}),(0,t.jsx)("div",{className:"absolute top-0 inset-x-0 h-48 pointer-events-none",style:{background:`radial-gradient(ellipse at 50% 0%, ${R.glowBg} 0%, transparent 70%)`,opacity:.5}}),(0,t.jsx)(r.motion.div,{style:C||!M?void 0:{y:A},className:(0,c.cn)("absolute text-ui-display scale-[6] lg:scale-[10] font-black leading-none select-none pointer-events-none tracking-tighter z-0",g?"top-0 lg:top-10 right-0 lg:right-20 origin-top-right":"top-0 lg:top-10 left-0 lg:left-20 origin-top-left",R.numberColor),children:e}),(0,t.jsxs)("div",{className:(0,c.cn)("w-full max-w-[1600px] mx-auto grid grid-cols-1 lg:h-full lg:max-h-full min-h-0 relative z-10 lg:items-stretch",g?"lg:grid-cols-[1fr_1.1fr]":"lg:grid-cols-[1.1fr_1fr]"),children:[(0,t.jsxs)("div",{className:(0,c.cn)("p-4 sm:p-6 lg:p-10 flex items-center justify-center relative backdrop-blur-sm min-w-0 lg:h-full lg:max-h-full overflow-hidden",g?"order-2 border-t lg:border-t-0 lg:border-l":"order-2 lg:order-1 border-t lg:border-t-0 lg:border-r",R.contentBorder,R.contentBg),children:[(0,t.jsx)("div",{className:"absolute inset-0 pointer-events-none",style:{background:`radial-gradient(ellipse at center, ${R.glowBg} 0%, transparent 70%)`}}),(0,t.jsx)(u.Provider,{value:M,children:(0,t.jsx)("div",{ref:S,className:"feature-mockup-shell w-full max-w-[640px] lg:h-full lg:max-h-full flex items-center justify-center relative z-20",children:_?f:(0,t.jsx)("div",{"aria-hidden":!0,className:"landing-demo-placeholder w-full h-[400px] lg:h-full rounded-lg border border-claron-border bg-background/40"})})})]}),(0,t.jsxs)("div",{className:(0,c.cn)("p-6 sm:p-8 lg:p-10 xl:p-12 flex flex-col justify-center relative z-10 lg:h-full lg:max-h-full overflow-hidden",g?"order-1":"order-1 lg:order-2"),children:[(0,t.jsxs)("div",{className:"flex items-center gap-3 mb-4 lg:mb-5",children:[(0,t.jsx)("div",{className:(0,c.cn)("w-12 h-12 rounded-xl flex items-center justify-center","primary"===a&&"bg-claron-primary/10 border border-claron-primary/30","node"===a&&"bg-claron-node/10 border border-claron-node/30","ai"===a&&"bg-claron-ai/10 border border-claron-ai/30","rose"===a&&"bg-claron-rose/10 border border-claron-rose/30"),children:n}),(0,t.jsx)("span",{className:(0,c.cn)("font-mono text-ui-sm font-bold border px-3 py-1.5 uppercase tracking-widest rounded-md","primary"===a&&"text-claron-primary dark:text-claron-primary/90 border-claron-primary/30 bg-claron-primary-bg dark:bg-claron-primary/5","node"===a&&"text-claron-node dark:text-claron-node/90 border-claron-node/30 bg-claron-node-bg dark:bg-claron-node/5","ai"===a&&"text-claron-ai dark:text-claron-ai/90 border-claron-ai/30 bg-claron-ai-bg dark:bg-claron-ai/5","rose"===a&&"text-claron-rose dark:text-claron-rose/90 border-claron-rose/30 bg-claron-rose-bg dark:bg-claron-rose/5"),children:i})]}),(0,t.jsx)("h3",{className:"text-ui-display font-extrabold tracking-tight text-foreground leading-[1.05] mb-4 lg:mb-5",children:x}),(0,t.jsx)("p",{className:"text-ui-lg text-text-secondary leading-[1.6] max-w-[500px]",children:h})]})]})]})})}e.s(["StoryChapter",()=>k,"StoryScrollProvider",()=>

1w,"useStoryChapterActive",()=>N])},516015,(e,t,r)=>{},898547,(e,t,r)=>{var a=e.i(247167);e.r(516015);var s=e.r(271645),n=s&&"object"==typeof s&&"default"in s?s:{default:s},i=void 0!==a.default&&a.default.env&&!0,o=function(e){return"[object String]"===Object.prototype.toString.call(e)},l=function(){function e(e){var t=void 0===e?{}:e,r=t.name,a=void 0===r?"stylesheet":r,s=t.optimizeForSpeed,n=void 0===s?i:s;c(o(a),"`name` must be a string"),this._name=a,this._deletedRulePlaceholder="#"+a+"-deleted-rule____{}",c("boolean"==typeof n,"`optimizeForSpeed` must be a boolean"),this._optimizeForSpeed=n,this._serverSheet=void 0,this._tags=[],this._injected=!1,this._rulesCount=0;var l="u">typeof window&&document.querySelector('meta[property="csp-nonce"]');this._nonce=l?l.getAttribute("content"):null}var t,r=e.prototype;return r.setOptimizeForSpeed=function(e){c("boolean"==typeof e,"`setOptimizeForSpeed` accepts a boolean"),c(0===this._rulesCount,"optimizeForSpeed cannot be when rules have already been inserted"),this.flush(),this._optimizeForSpeed=e,this.inject()},r.isOptimizeForSpeed=function(){return this._optimizeForSpeed},r.inject=function(){var e=this;if(c(!this._injected,"sheet already injected"),this._injected=!0,"u">typeof window&&this._optimizeForSpeed){this._tags[0]=this.makeStyleTag(this._name),this._optimizeForSpeed="insertRule"in this.getSheet(),this._optimizeForSpeed||(i||console.warn("StyleSheet: optimizeForSpeed mode not supported falling back to standard mode."),this.flush(),this._injected=!0);return}this._serverSheet={cssRules:[],insertRule:function(t,r){return"number"==typeof r?e._serverSheet.cssRules[r]={cssText:t}:e._serverSheet.cssRules.push({cssText:t}),r},deleteRule:function(t){e._serverSheet.cssRules[t]=null}}},r.getSheetForTag=function(e){if(e.sheet)return e.sheet;for(var t=0;t<document.styleSheets.length;t++)if(document.styleSheets[t].ownerNode===e)return document.styleSheets[t]},r.getSheet=function(){return this.getSheetForTag(this._tags[this._tags.length-1])},r.insertRule=function(e,t){if(c(o(e),"`insertRule` accepts only strings"),"u"<typeof window)return"number"!=typeof t&&(t=this._serverSheet.cssRules.length),this._serverSheet.insertRule(e,t),this._rulesCount++;if(this._optimizeForSpeed){var r=this.getSheet();"number"!=typeof t&&(t=r.cssRules.length);try{r.insertRule(e,t)}catch(t){return i||console.warn("StyleSheet: illegal rule: \n\n"+e+"\n\nSee https://stackoverflow.com/q/20007992 for more info"),-1}}else{var a=this._tags[t];this._tags.push(this.makeStyleTag(this._name,e,a))}return this._rulesCount++},r.replaceRule=function(e,t){if(this._optimizeForSpeed||"u"<typeof window){var r="u">typeof window?this.getSheet():this._serverSheet;if(t.trim()||(t=this._deletedRulePlaceholder),!r.cssRules[e])return e;r.deleteRule(e);try{r.insertRule(t,e)}catch(a){i||console.warn("StyleSheet: illegal rule: \n\n"+t+"\n\nSee https://stackoverflow.com/q/20007992 for more info"),r.insertRule(this._deletedRulePlaceholder,e)}}else{var a=this._tags[e];c(a,"old rule at index `"+e+"` not found"),a.textContent=t}return e},r.deleteRule=function(e){if("u"<typeof window)return void this._serverSheet.deleteRule(e);if(this._optimizeForSpeed)this.replaceRule(e,"");else{var t=this._tags[e];c(t,"rule at index `"+e+"` not found"),t.parentNode.removeChild(t),this._tags[e]=null}},r.flush=function(){this._injected=!1,this._rulesCount=0,"u">

1typeof window?(this._tags.forEach(function(e){return e&&e.parentNode.removeChild(e)}),this._tags=[]):this._serverSheet.cssRules=[]},r.cssRules=function(){var e=this;return"u"<typeof window?this._serverSheet.cssRules:this._tags.reduce(function(t,r){return r?t=t.concat(Array.prototype.map.call(e.getSheetForTag(r).cssRules,function(t){return t.cssText===e._deletedRulePlaceholder?null:t})):t.push(null),t},[])},r.makeStyleTag=function(e,t,r){t&&c(o(t),"makeStyleTag accepts only strings as second parameter");var a=document.createElement("style");this._nonce&&a.setAttribute("nonce",this._nonce),a.type="text/css",a.setAttribute("data-"+e,""),t&&a.appendChild(document.createTextNode(t));var s=document.head||document.getElementsByTagName("head")[0];return r?s.insertBefore(a,r):s.appendChild(a),a},t=[{key:"length",get:function(){return this._rulesCount}}],function(e,t){for(var r=0;r<t.length;r++){var a=t[r];a.enumerable=a.enumerable||!1,a.configurable=!0,"value"in a&&(a.writable=!0),Object.defineProperty(e,a.key,a)}}(e.prototype,t),e}();function c(e,t){if(!e)throw Error("StyleSheet: "+t+".")}var d=function(e){for(var t=5381,r=e.length;r;)t=33*t^e.charCodeAt(--r);return t>>>0},x={};function m(e,t){if(!t)return"jsx-"+e;var r=String(t),a=e+r;return x[a]||(x[a]="jsx-"+d(e+"-"+r)),x[a]}function u(e,t){"u"<typeof window&&(t=t.replace(/\/style/gi,"\\/style"));var r=e+t;return x[r]||(x[r]=t.replace(/__jsx-style-dynamic-selector/g,e)),x[r]}var p=function(){function e(e){var t=void 0===e?{}:e,r=t.styleSheet,a=void 0===r?null:r,s=t.optimizeForSpeed,n=void 0!==s&&s;this._sheet=a||new l({name:"styled-jsx",optimizeForSpeed:n}),this._sheet.inject(),a&&"boolean"==typeof n&&(this._sheet.setOptimizeForSpeed(n),this._optimizeForSpeed=this._sheet.isOptimizeForSpeed()),this._fromServer=void 0,this._indices={},this._instancesCounts={}}var t=e.prototype;return t.add=function(e){var t=this;void 0===this._optimizeForSpeed&&(this._optimizeForSpeed=Array.isArray(e.children),this._sheet.setOptimizeForSpeed(this._optimizeForSpeed),this._optimizeForSpeed=this._sheet.isOptimizeForSpeed()),"u">typeof window&&!this._fromServer&&(this._fromServer=this.selectFromServer(),this._instancesCounts=Object.keys(this._fromServer).reduce(function(e,t){return e[t]=0,e},{}));var r=this.getIdAndRules(e),a=r.styleId,s=r.rules;if(a in this._instancesCounts){this._instancesCounts[a]+=1;return}var n=s.map(function(e){return t._sheet.insertRule(e)}).filter(function(e){return -1!==e});this._indices[a]=n,this._instancesCounts[a]=1},t.remove=function(e){var t=this,r=this.getIdAndRules(e).styleId;if(function(e,t){if(!e)throw Error("StyleSheetRegistry: "+t+".")}(r in this._instancesCounts,"styleId: `"+r+"` not found"),this._instancesCounts[r]-=1,this._instancesCounts[r]<1){var a=this._fromServer&&this._fromServer[r];a?(a.parentNode.removeChild(a),delete this._fromServer[r]):(this._indices[r].forEach(function(e){return t._sheet.deleteRule(e)}),delete this._indices[r]),delete this._instancesCounts[r]}},t.update=function(e,t){this.add(t),this.remove(e)},t.flush=function(){this._sheet.flush(),this._sheet.inject(),this._fromServer=void 0,this._indices={},this._instancesCounts={}},t.cssRules=function(){var e=this,t=this._fromServer?Object.keys(this._fromServer).map(function(t){return[t,e._fromServer[t]]}):[],r=this._sheet.cssRules();return t.concat(Object.keys(this._indices).map(function(t){return[t,e._indices[t].map(function(e){return r[e].cssText}).join(e._optimizeForSpeed?"":"\n")]}).filter(function(e){return!!e[1]}))},t.styles=function(e){var t,r;return t=this.cssRules(),void 0===(r=e)&&(r={}),t.map(function(e){var t=e[0],a=e[1];return n.default.createElement("style",{id:"__"+t,key:"__"+t,nonce:r.nonce?r.nonce:void 0,dangerouslySetInnerHTML:{__html:a}})})},t.getIdAndRules=function(e){var t=e.children,r=e.dynamic,a=e.id;if(r){var s=m(a,r);return{styleId:s,rules:Array.isArray(t)?t.map(function(e){return u(s,e)}):[u(s,t)]}}return{styleId:m(a),rules:Array.isArray(t)?t:[t]}},t.selectFromServer=function(){return Array.prototype.slice.call(document.querySelectorAll('[id^="__jsx-"]')).reduce(function(e,t){return e[t.id.slice(2)]=t,e},{})},e}(),h=s.createContext(null);function f(){return new p}function b(){return s.useContext(h)}h.displayName="StyleSheetContext";var g=n.default.useInsertionEffect||n.default.useLayoutEffect,v="u">typeof window?f():void 0;function j(e){var t=v||b();return t&&("u"<typeof window?t.add(e):g(function(){return t.add(e),function(){t.remove(e)}},[e.id,String(e.dynamic)])),null}j.dynamic=function(e){return e.map(function(e){return m(e[0],e[1])}).join(" ")},r.StyleRegistry=function(e){var t=e.registry,r=e.children,a=s.useContext(h),i=s.useState(function(){return a||t||f()})[0];return n.default.createElement(h.Provider,{value:i},r)},r.createStyleRegistry=f,r.style=j,r.useStyleRegistry=b},437902,(e,t,r)=>{t.exports=e.r(898547).style},157575,e=>{"use strict";var t=e.i(843476),r=e.i(437902),a=e.i(271645),s=e.i(174080),n=e.i(975),i=e.i(778917),o=e.i(492161),l=e.i(463059);let c=(0,e.i(475254).default)("shopping-cart",[["circle",{cx:"8",cy:"21",r:"1",key:"jimo8o"}

1],["circle",{cx:"19",cy:"21",r:"1",key:"13723u"}],["path",{d:"M2.05 2.05h2l2.66 12.42a2 2 0 0 0 2 1.58h9.78a2 2 0 0 0 1.95-1.57l1.65-7.43H5.12",key:"9zh506"}]]);var d=e.i(761911),x=e.i(239616),m=e.i(561659),u=e.i(346897),p=e.i(846932),h=e.i(88653),f=e.i(387652),b=e.i(839310),g=e.i(604756),v=e.i(279151);function j({rect:e}){let r=e.top-8,a=e.left-8,s=e.width+16,n=e.height+16,i="linear-gradient(#000 0 0), linear-gradient(#000 0 0)",o=`100% 100%, ${Math.max(0,s)}px ${Math.max(0,n)}px`,l=`0 0, ${Math.max(0,a)}px ${Math.max(0,r)}px`,c=e=>({position:"fixed",pointerEvents:"auto",...e});return(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)("div",{"aria-hidden":!0,style:{position:"fixed",inset:0,pointerEvents:"none",background:"rgba(3,10,20,0.74)",backdropFilter:"blur(3px) saturate(84%)",WebkitBackdropFilter:"blur(3px) saturate(84%)",maskImage:i,WebkitMaskImage:i,maskSize:o,WebkitMaskSize:o,maskPosition:l,WebkitMaskPosition:l,maskRepeat:"no-repeat",WebkitMaskRepeat:"no-repeat",maskComposite:"exclude",WebkitMaskComposite:"xor",transition:"mask-position 240ms cubic-bezier(0.22,1,0.36,1), mask-size 240ms cubic-bezier(0.22,1,0.36,1), -webkit-mask-position 240ms cubic-bezier(0.22,1,0.36,1), -webkit-mask-size 240ms cubic-bezier(0.22,1,0.36,1)"}}),(0,t.jsx)("div",{style:c({top:0,left:0,right:0,height:Math.max(0,r)})}),(0,t.jsx)("div",{style:c({top:Math.max(0,r+n),left:0,right:0,bottom:0})}),(0,t.jsx)("div",{style:c({top:Math.max(0,r),left:0,width:Math.max(0,a),height:Math.max(0,n)})}),(0,t.jsx)("div",{style:c({top:Math.max(0,r),left:Math.max(0,a+s),right:0,height:Math.max(0,n)})})]})}function y({rect:e,onHover:r,onHoverEnd:a,onClick:s,hoverProgress:n,isHovering:i}){let o=e.top-8,l=e.left-8,c=e.width+16,d=e.height+16;return(0,t.jsxs)("div",{className:"fixed pointer-events-auto",onMouseEnter:r,onMouseLeave:a,onClick:s,style:{top:o,left:l,width:c,height:d,borderRadius:10,border:"1.5px solid var(--claron-primary-border)",boxSizing:"border-box",zIndex:1e3,cursor:"pointer",transition:"top 0.24s cubic-bezier(0.22,1,0.36,1), left 0.24s cubic-bezier(0.22,1,0.36,1), width 0.22s cubic-bezier(0.22,1,0.36,1), height 0.22s cubic-bezier(0.22,1,0.36,1), box-shadow 0.24s ease",animation:"claronChPulse 1.9s ease-in-out infinite, claronChEnter 180ms cubic-bezier(0.22,1,0.36,1)",boxShadow:"0 0 0 1px color-mix(in srgb, var(--claron-primary) 18%, transparent), 0 0 30px var(--claron-primary-glow), 0 18px 50px var(--claron-primary-glow), 0 8px 22px rgba(0,0,0,0.42)"},children:[(0,t.jsx)("div",{style:{position:"absolute",inset:-7,borderRadius:14,border:"1px solid var(--claron-primary-border)",boxShadow:"0 0 0 1px color-mix(in srgb, var(--claron-primary) 18%, transparent), 0 0 30px var(--claron-primary-glow)",pointerEvents:"none",animation:"claronChHalo 1.6s cubic-bezier(0.22,1,0.36,1) infinite"}}),(0,t.jsx)("div",{style:{position:"absolute",inset:-14,borderRadius:18,border:"1px solid color-mix(in srgb, var(--claron-primary) 26%, transparent)",boxShadow:"0 0 40px var(--claron-primary-glow), 0 0 70px var(--claron-primary-glow)",pointerEvents:"none",animation:"claronChBurst 260ms cubic-bezier(0.16,1,0.3,1) both"}}),i&&null!=n&&(0,t.jsx)("div",{style:{position:"absolute",inset:-3,borderRadius:12,border:"2px solid var(--claron-primary)",opacity:n,boxShadow:`0 0 ${12+30*n}px var(--claron-primary-glow), 0 0 ${4+16*n}px var(--claron-primary-glow)`,pointerEvents:"none",transition:"opacity 30ms linear, box-shadow 30ms linear"}})]})}function w({badge:e,action:r,rect:a}){let s=a.top-8,n=a.height+16,i=window.innerWidth,o=window.innerHeight,l=s+n+18;l+72>o-12&&(l=s-72-18)<12&&(l=o-72-16);let c=Math.max(8,Math.min(a.left+a.width/2-140,i-288));

1return(0,t.jsx)("div",{className:"fixed",style:{top:l,left:c,zIndex:10001,pointerEvents:"none",animation:"claronChTooltipIn 300ms cubic-bezier(0.16,1,0.3,1) both"},children:(0,t.jsxs)("div",{style:{overflow:"hidden",borderRadius:12,border:"1px solid var(--claron-primary-border)",boxShadow:"inset 0 1px rgba(255,255,255,0.06), inset 0 -1px rgba(0,0,0,0.5), 0 4px 12px -4px var(--claron-primary-glow), 0 8px 32px rgba(0,0,0,0.55)",position:"relative",maxWidth:300,minWidth:200,textAlign:"center"},children:[(0,t.jsx)("div",{style:{position:"absolute",inset:0,background:"rgba(12,12,14,0.94)",backdropFilter:"blur(24px) saturate(160%)"}}),(0,t.jsx)("div",{style:{position:"absolute",top:0,left:"25%",right:"25%",height:1,zIndex:2,background:"linear-gradient(90deg, transparent, var(--claron-primary), transparent)"}}),(0,t.jsxs)("div",{style:{position:"relative",zIndex:1,padding:"13px 20px 12px",backgroundImage:"linear-gradient(color-mix(in srgb, var(--claron-primary) 4%, transparent) 1px, transparent 1px), linear-gradient(90deg, color-mix(in srgb, var(--claron-primary) 4%, transparent) 1px, transparent 1px)",backgroundSize:"4px 4px"},children:[(0,t.jsx)("div",{style:{display:"inline-block",marginBottom:6,fontSize:10,fontWeight:700,letterSpacing:"0.06em",textTransform:"uppercase",color:"var(--claron-primary)",background:"color-mix(in srgb, var(--claron-primary) 10%, transparent)",border:"1px solid color-mix(in srgb, var(--claron-primary) 22%, transparent)",borderRadius:6,padding:"2px 8px",lineHeight:1.5},children:e}),(0,t.jsx)("div",{style:{fontSize:13,fontWeight:500,lineHeight:1.5,color:"#cbd5e1",letterSpacing:"0.01em"},children:r})]})]})})}function N(){let[e,N]=(0,a.useState)("idle"),[k,C]=(0,a.useState)(!1),[z,S]=(0,a.useState)(!1),[_,M]=(0,a.useState)("checkout"),[E,A]=(0,a.useState)(!1),[R,F]=(0,a.useState)(0),[B,T]=(0,a.useState)(!1),L=(0,a.useRef)(null),I=(0,a.useRef)(null),P=(0,a.useRef)(null),H=(0,a.useRef)(null),V=(0,a.useRef)(null),O=(0,a.useRef)(null),D=(0,a.useRef)(null),Z=(0,a.useRef)(null),W=(0,a.useRef)(null),$=(0,f.useInView)(W,{once:!0,amount:.5}),q=(0,b.useStoryChapterActive)();(0,a.useEffect)(()=>{if(q&&$&&"idle"===e){let e=requestAnimationFrame(()=>N("intro"));return()=>cancelAnimationFrame(e)}},[q,$,e]);let[U,G]=(0,a.useState)(null),K=(0,a.useCallback)(()=>{switch(e){case"intro":return I.current;case"step-hamburger":return P.current;case"step-submenu":return H.current;case"step-menuitem":return V.current;case"step-final":return O.current;default:return null}},[e]),Y=(0,a.useCallback)(()=>{let e=K();if(e){let t=e.getBoundingClientRect(),r={top:t.top,left:t.left,width:t.width,height:t.height};G(e=>e&&.5>Math.abs(e.top-r.top)&&.5>Math.abs(e.left-r.left)&&.5>Math.abs(e.width-r.width)&&.5>Math.abs(e.height-r.height)?e:r)}else G(e=>null===e?e:null)},[K]);(0,a.useEffect)(()=>{if(!q||"idle"===e||"page-transition"===e||"done"===e){let e=requestAnimationFrame(()=>G(null));return()=>cancelAnimationFrame(e)}let t=0,r=()=>{t||(t=requestAnimationFrame(()=>{t=0,Y()}))};return r(),window.addEventListener("scroll",r,{passive:!0}),window.addEventListener("resize",r,{passive:!0}),()=>{window.removeEventListener("scroll",r),window.removeEventListener("resize",r),t&&cancelAnimationFrame(t)}},[q,e,Y]);let X=()=>{N("step-hamburger")},J=()=>{C(!0),setTimeout(()=>N("step-submenu"),350)},Q=()=>{S(!0),setTimeout(()=>N("step-menuitem"),350)},ee=()=>{N("page-transition"),C(!1),S(!1),setTimeout(()=>{M("payment"),A(!0),setTimeout(()=>{A(!1),N("step-final")},1400)},600)},et=(0,a.useCallback)(()=>{if("step-final"!==e)return;T(!0),F(0);let t=Date.now();Z.current=setInterval(()=>{F(Math.min(1,(Date.now()-t)/1e3))},30),D.current=setTimeout(()=>{Z.current&&clearInterval(Z.current),T(!1),N("done")},1e3)},[e]),er=(0,a.useCallback)(()=>{D.current&&clearTimeout(D.current),Z.current&&clearInterval(Z.current),D.current=null,Z.current=null,T(!1),F(0)},[]);(0,a.useEffect)(()=>()=>{D.current&&clearTimeout(D.current),Z.current&&clearInterval(Z.current)},[]);let ea=q&&null!==U&&"idle"!==e&&"page-transition"!==e&&"done"!==e,es=(()=>{switch(e){case"intro":return{badge:"Claron It!",action:(0,t.jsxs)(t.Fragment,{children:["Click ",(0,t.jsx)("strong",{style:{color:"#e2e8f0"},children:"âClaron it!â"})," to start the guided replay"]})};case"step-hamburger":return{badge:"Step 1 of 3",action:(0,t.jsxs)(t.Fragment,{children:["Click ",(0,t.jsx)("strong",{style:{color:"#e2e8f0"},children:"the menu button"})," to continue"]})};case"step-submenu":return{badge:"Step 2 of 3",action:(0,t.jsxs)(t.Fragment,{children:["Click ",(0,t.jsx)("strong",{style:{color:"#e2e8f0"},children:"Account"})," to continue"]})};case"step-menuitem":return{badge:"Step 3 of 3",action:(0,t.jsxs)(t.Fragment,{children:["Click ",(0,t.jsx)("strong",{style:{color:"#e2e8f0"},children:"Payment Methods"})," to navigate"]})};case"step-final":return{badge:"Done",action:(0,t.jsxs)(t.Fragment,{children:["Hover over ",(0,t.jsx)("strong",{style:{color:"#e2e8f0"},children:"the broken card"})," to dismiss",B&&(0,t.jsxs)("span",{style:{color:"var(--claron-primary)",fontWeight:700,marginLeft:4},children:["(",Math.max(0,1-R).toFixed(1),"s)"]})]})};default:return{badge:"",action:""}}})();return(0,t.jsxs)("div",{ref:W,className:"jsx-72ce0f9cc0022da8 w-full flex flex-col gap-3 text-left font-sans h-auto max-h-full",children:["u">typeof document&&(0,s.createPortal)((0,t.jsx)(h.AnimatePresence,{children:ea&&U&&(0,t.jsxs)(p.motion.div,{initial:{opacity:0}

1,animate:{opacity:1},exit:{opacity:0},transition:{duration:.3},className:"landing-story-spotlight fixed inset-0 pointer-events-none",style:{zIndex:9999},children:[(0,t.jsx)(j,{rect:U}),(0,t.jsx)(y,{rect:U,onClick:"intro"===e?X:"step-hamburger"===e?J:"step-submenu"===e?Q:"step-menuitem"===e?ee:void 0,onHover:"step-final"===e?et:void 0,onHoverEnd:"step-final"===e?er:void 0,hoverProgress:R,isHovering:B}),(0,t.jsx)(w,{badge:es.badge,action:es.action,rect:U})]},`spotlight-${e}`)}),document.body),(0,t.jsxs)(v.Card,{variant:"default",className:"w-full flex flex-col min-h-0 overflow-hidden relative",style:{boxShadow:"0 0 80px -15px color-mix(in srgb, var(--claron-primary) 12%, transparent), 0 20px 60px -15px rgba(0,0,0,0.5)"},children:[(0,t.jsxs)("div",{style:{borderBottom:"1px solid var(--claron-border)",backgroundColor:"var(--background)"},className:"jsx-72ce0f9cc0022da8 flex items-center justify-between h-10 px-4 shrink-0",children:[(0,t.jsxs)("div",{className:"jsx-72ce0f9cc0022da8 flex items-center gap-2",children:[(0,t.jsx)("div",{style:{border:"2px solid var(--claron-rose)"},className:"jsx-72ce0f9cc0022da8 w-3 h-3 rounded-full"}),(0,t.jsx)("span",{style:{color:"var(--text-muted)"},className:"jsx-72ce0f9cc0022da8 font-mono text-ui-xs font-semibold",children:"bug"}),(0,t.jsx)("div",{style:{backgroundColor:"var(--claron-border)"},className:"jsx-72ce0f9cc0022da8 w-px h-4"}),(0,t.jsx)("span",{style:{backgroundColor:"var(--claron-rose-bg)",color:"var(--claron-rose)",border:"1px solid var(--claron-rose-border)"},className:"jsx-72ce0f9cc0022da8 text-ui-xs px-2 py-0.5 font-bold rounded-sm uppercase tracking-wider",children:"critical"}),(0,t.jsx)("div",{style:{backgroundColor:"var(--claron-border)"},className:"jsx-72ce0f9cc0022da8 w-px h-4"}),(0,t.jsx)("span",{style:{color:"var(--text-muted)"},className:"jsx-72ce0f9cc0022da8 font-mono text-ui-xs",children:"/checkout"})]}),(0,t.jsx)(i.ExternalLink,{className:"w-4 h-4",style:{color:"var(--text-muted)"}})]}),(0,t.jsxs)("div",{style:{borderBottom:"1px solid var(--claron-border)"},className:"jsx-72ce0f9cc0022da8 px-4 py-3 shrink-0",children:[(0,t.jsx)("p",{style:{color:"var(--foreground)"},className:"jsx-72ce0f9cc0022da8 text-ui-md font-semibold leading-snug",children:"Payment card throws TypeError on mobile viewport"}),(0,t.jsx)("p",{style:{color:"var(--text-muted)"},className:"jsx-72ce0f9cc0022da8 text-ui-sm mt-1",children:"full context: screenshot, logs, network, source â all auto-captured"})]}),(0,t.jsx)("div",{style:{borderBottom:"1px solid var(--claron-border)",backgroundColor:"var(--background)"},className:"jsx-72ce0f9cc0022da8 px-4 py-3 shrink-0",children:(0,t.jsx)(g.Button,{ref:I,variant:"node",size:"default",className:"w-full text-ui-sm h-9",rightIcon:(0,t.jsx)(i.ExternalLink,{className:"w-4 h-4"}),id:"chapter-claron-it-cta",onClick:"intro"===e?X:void 0,children:"Claron it!"})}),(0,t.jsxs)("div",{ref:L,style:{background:"var(--background)"},className:"jsx-72ce0f9cc0022da8 relative flex-1 min-h-[340px] overflow-hidden",children:[(0,t.jsx)(h.AnimatePresence,{children:"page-transition"===e&&(0,t.jsx)(p.motion.div,{initial:{opacity:0}

1,animate:{opacity:1},exit:{opacity:0},className:"absolute inset-0 z-[800] flex items-center justify-center",style:{background:"rgba(3,10,20,0.85)"},children:(0,t.jsxs)("div",{className:"jsx-72ce0f9cc0022da8 flex items-center gap-2",children:[(0,t.jsx)("div",{className:"jsx-72ce0f9cc0022da8 w-4 h-4 border-2 border-claron-primary border-t-transparent rounded-full animate-spin"}),(0,t.jsx)("span",{className:"jsx-72ce0f9cc0022da8 text-ui-xs text-claron-primary font-mono font-bold uppercase tracking-wider",children:"Navigating to /account/paymentsâ¦"})]})})}),(0,t.jsx)(h.AnimatePresence,{children:"done"===e&&(0,t.jsx)(p.motion.div,{initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},className:"absolute inset-0 z-[800] flex items-center justify-center",style:{background:"rgba(3,10,20,0.6)",backdropFilter:"blur(2px)"},children:(0,t.jsxs)("button",{onClick:()=>{C(!1),S(!1),M("checkout"),A(!1),F(0),T(!1),N("intro")},className:"jsx-72ce0f9cc0022da8 flex items-center gap-2 py-2 px-5 bg-zinc-800 hover:bg-zinc-700 text-white font-semibold rounded-full shadow-xl transition-all active:scale-[0.98] border border-zinc-600 cursor-pointer",children:[(0,t.jsx)(n.Crosshair,{className:"w-4 h-4"}),"Replay Guide"]})})}),(0,t.jsx)(p.motion.div,{className:"p-4 space-y-3 select-none",animate:E?{y:-160}:{y:0},transition:E?{duration:1.2,ease:"easeInOut"}:{duration:.4},children:"checkout"===_?(0,t.jsxs)(t.Fragment,{children:[(0,t.jsxs)("div",{className:"jsx-72ce0f9cc0022da8 flex justify-between items-center border-b border-zinc-200 dark:border-zinc-800 pb-2",children:[(0,t.jsx)("span",{className:"jsx-72ce0f9cc0022da8 font-extrabold text-ui-sm text-zinc-900 dark:text-zinc-100",children:"ACME STORE"}),(0,t.jsx)("button",{ref:P,onClick:"step-hamburger"===e?J:void 0,className:"jsx-72ce0f9cc0022da8 w-8 h-8 flex items-center justify-center rounded border border-zinc-200 dark:border-zinc-700 hover:bg-zinc-100 dark:hover:bg-zinc-800 transition-colors",children:(0,t.jsx)(o.Menu,{className:"w-4 h-4 text-zinc-600 dark:text-zinc-300"})})]}),(0,t.jsx)(h.AnimatePresence,{children:k&&(0,t.jsxs)(p.motion.div,{initial:{opacity:0,y:-8,scaleY:.95},animate:{opacity:1,y:0,scaleY:1},exit:{opacity:0,y:-8,scaleY:.95},transition:{duration:.2},className:"border border-zinc-200 dark:border-zinc-700 rounded-lg overflow-hidden shadow-xl",style:{background:"var(--surface)",transformOrigin:"top"},children:[(0,t.jsxs)("div",{className:"jsx-72ce0f9cc0022da8 flex items-center gap-2 px-3 py-2.5 border-b border-zinc-200 dark:border-zinc-800 hover:bg-zinc-100 dark:hover:bg-zinc-800 transition-colors",children:[(0,t.jsx)(c,{className:"w-3.5 h-3.5 text-zinc-400"}),(0,t.jsx)("span",{className:"jsx-72ce0f9cc0022da8 text-ui-xs text-zinc-600 dark:text-zinc-300 font-medium",children:"Cart"})]}),(0,t.jsxs)("div",{ref:H,onClick:"step-submenu"===e?Q:void 0,className:"jsx-72ce0f9cc0022da8 flex items-center justify-between px-3 py-2.5 border-b border-zinc-200 dark:border-zinc-800 hover:bg-zinc-100 dark:hover:bg-zinc-800 transition-colors cursor-pointer",children:[(0,t.jsxs)("div",{className:"jsx-72ce0f9cc0022da8 flex items-center gap-2",children:[(0,t.jsx)(d.Users,{className:"w-3.5 h-3.5 text-zinc-400"}),(0,t.jsx)("span",{className:"jsx-72ce0f9cc0022da8 text-ui-xs text-zinc-600 dark:text-zinc-300 font-medium",children:"Account"})]}),(0,t.jsx)(l.ChevronRight,{className:"w-3 h-3 text-zinc-400"})]}),(0,t.jsx)(h.AnimatePresence,{children:z&&(0,t.jsxs)(p.motion.div,{initial:{opacity:0,height:0},animate:{opacity:1,height:"auto"},exit:{opacity:0,height:0},className:"overflow-hidden",children:[(0,t.jsx)("div",{className:"jsx-72ce0f9cc0022da8 pl-8 pr-3 py-2 border-b border-zinc-200 dark:border-zinc-800 hover:bg-zinc-100 dark:hover:bg-zinc-800 transition-colors",children:(0,t.jsxs)("div",{className:"jsx-72ce0f9cc0022da8 flex items-center gap-2",children:[(0,t.jsx)(x.Settings,{className:"w-3 h-3 text-zinc-400"}),(0,t.jsx)("span",{className:"jsx-72ce0f9cc0022da8 text-[11px] text-zinc-500 dark:text-zinc-400",children:"Settings"})]})}),(0,t.jsx)("div",{ref:V,onClick:"step-menuitem"===e?ee:void 0,className:"jsx-72ce0f9cc0022da8 pl-8 pr-3 py-2 border-b border-zinc-200 dark:border-zinc-800 hover:bg-zinc-100 dark:hover:bg-zinc-800 transition-colors cursor-pointer",children:(0,t.jsxs)("div",{className:"jsx-72ce0f9cc0022da8 flex items-center gap-2",children:[(0,t.jsx)(m.Credit

1Card,{className:"w-3 h-3 text-zinc-400"}),(0,t.jsx)("span",{className:"jsx-72ce0f9cc0022da8 text-[11px] text-zinc-500 dark:text-zinc-400",children:"Payment Methods"})]})}),(0,t.jsx)("div",{className:"jsx-72ce0f9cc0022da8 pl-8 pr-3 py-2 hover:bg-zinc-100 dark:hover:bg-zinc-800 transition-colors",children:(0,t.jsxs)("div",{className:"jsx-72ce0f9cc0022da8 flex items-center gap-2",children:[(0,t.jsx)(u.MapPin,{className:"w-3 h-3 text-zinc-400"}),(0,t.jsx)("span",{className:"jsx-72ce0f9cc0022da8 text-[11px] text-zinc-500 dark:text-zinc-400",children:"Addresses"})]})})]})}),(0,t.jsxs)("div",{className:"jsx-72ce0f9cc0022da8 flex items-center gap-2 px-3 py-2.5 hover:bg-zinc-100 dark:hover:bg-zinc-800 transition-colors",children:[(0,t.jsx)(x.Settings,{className:"w-3.5 h-3.5 text-zinc-400"}),(0,t.jsx)("span",{className:"jsx-72ce0f9cc0022da8 text-ui-xs text-zinc-600 dark:text-zinc-300 font-medium",children:"Settings"})]})]})}),(0,t.jsxs)("div",{className:"jsx-72ce0f9cc0022da8 space-y-1 pt-1",children:[(0,t.jsx)("h2",{className:"jsx-72ce0f9cc0022da8 text-ui-md font-bold text-zinc-800 dark:text-zinc-200",children:"Secure Checkout"}),(0,t.jsx)("p",{className:"jsx-72ce0f9cc0022da8 text-ui-xs text-text-muted",children:"Complete your order below."})]}),(0,t.jsxs)("div",{className:"jsx-72ce0f9cc0022da8 border border-zinc-200 dark:border-zinc-800 p-3 rounded-lg space-y-2 bg-zinc-100/40 dark:bg-zinc-900/40",children:[(0,t.jsx)("span",{className:"jsx-72ce0f9cc0022da8 text-[10px] font-mono text-zinc-400 uppercase tracking-wider font-semibold",children:"Order Summary"}),(0,t.jsxs)("div",{className:"jsx-72ce0f9cc0022da8 space-y-1",children:[(0,t.jsx)("div",{className:"jsx-72ce0f9cc0022da8 h-2 w-3/4 rounded bg-foreground

1/10"}),(0,t.jsx)("div",{className:"jsx-72ce0f9cc0022da8 h-2 w-1/2 rounded bg-foreground/10"}),(0,t.jsx)("div",{className:"jsx-72ce0f9cc0022da8 h-2 w-2/3 rounded bg-foreground/10"})]})]}),(0,t.jsx)("div",{className:"jsx-72ce0f9cc0022da8 h-16"})]}):(0,t.jsxs)(t.Fragment,{children:[(0,t.jsxs)("div",{className:"jsx-72ce0f9cc0022da8 flex justify-between items-center border-b border-zinc-200 dark:border-zinc-800 pb-2",children:[(0,t.jsx)("span",{className:"jsx-72ce0f9cc0022da8 font-extrabold text-ui-sm text-zinc-900 dark:text-zinc-100",children:"ACME STORE"}),(0,t.jsx)("span",{className:"jsx-72ce0f9cc0022da8 text-[10px] font-mono text-claron-primary font-bold",children:"/account/payments"})]}),(0,t.jsxs)("div",{className:"jsx-72ce0f9cc0022da8 space-y-1",children:[(0,t.jsx)("h2",{className:"jsx-72ce0f9cc0022da8 text-ui-md font-bold text-zinc-800 dark:text-zinc-200",children:"Payment Methods"}),(0,t.jsx)("p",{className:"jsx-72ce0f9cc0022da8 text-ui-xs text-text-muted",children:"Manage your saved payment methods."})]}),(0,t.jsx)("div",{className:"jsx-72ce0f9cc0022da8 border border-zinc-200 dark:border-zinc-800 p-3 rounded-lg bg-zinc-100/40 dark:bg-zinc-900/40",children:(0,t.jsxs)("div",{className:"jsx-72ce0f9cc0022da8 flex items-center justify-between",children:[(0,t.jsxs)("div",{className:"jsx-72ce0f9cc0022da8 flex items-center gap-2",children:[(0,t.jsx)(m.CreditCard,{className:"w-3.5 h-3.5 text-zinc-400"}),(0,t.jsx)("span",{className:"jsx-72ce0f9cc0022da8 text-ui-xs text-zinc-600 dark:text-zinc-300 font-medium",children:"Visa â¢â¢â¢â¢ 4242"})]}),(0,t.jsx)("span",{className:"jsx-72ce0f9cc0022da8 text-[9px] font-mono text-claron-node font-bold uppercase",children:"Default"})]})}),(0,t.jsxs)("div",{ref:O,className:"jsx-72ce0f9cc0022da8 border border-claron-rose/30 p-3 rounded-lg bg-claron-rose/5 relative overflow-hidden",children:[(0,t.jsx)("div",{style:{background:"var(--claron-rose)",boxShadow:"0 0 8px var(--claron-rose-glow)"},className:"jsx-72ce0f9cc0022da8 absolute top-0 left-0 right-0 h-[2px]"}),(0,t.jsxs)("div",{className:"jsx-72ce0f9cc0022da8 flex items-center justify-between",children:[(0,t.jsxs)("div",{className:"jsx-72ce0f9cc0022da8 flex items-center gap-2",children:[(0,t.jsx)(m.CreditCard,{className:"w-3.5 h-3.5 text-claron-rose"}),(0,t.jsx)("span",{className:"jsx-72ce0f9cc0022da8 text-ui-xs text-claron-rose font-medium",children:"Mastercard â¢â¢â¢â¢ 8910"})]}),(0,t.jsx)("span",{className:"jsx-72ce0f9cc0022da8 text-[9px] font-mono text-claron-rose font-bold uppercase",children:"Error"})]}),(0,t.jsx)("p",{className:"jsx-72ce0f9cc0022da8 text-[10px] text-claron-rose/70 mt-1 font-mono",children:"TypeError: Cannot read properties of null (reading 'style')"})]}),(0,t.jsx)("div",{className:"jsx-72ce0f9cc0022da8 border border-zinc-200 dark:border-zinc-800 p-3 rounded-lg bg-zinc-100/40 dark:bg-zinc-900/40",children:(0,t.jsxs)("div",{className:"jsx-72ce0f9cc0022da8 flex items-center justify-between",children:[(0,t.jsxs)("div",{className:"jsx-72ce0f9cc0022da8 flex items-center gap-2",children:[(0,t.jsx)(m.CreditCard,{className:"w-3.5 h-3.5 text-zinc-400"}),(0,t.jsx)("span",{className:"jsx-72ce0f9cc0022da8 text-ui-xs text-zinc-600 dark:text-zinc-300 font-medium",children:"Amex â¢â¢â¢â¢ 3456"})]}),(0,t.jsx)("span",{className:"jsx-72ce0f9cc0022da8 text-[9px] font-mono text-zinc-500 font-bold uppercase",children:"Expired"})]})}),(0,t.jsx)("div",{className:"jsx-72ce0f9cc0022da8 h-16"})]})})]}),(0,t.jsxs)("div",{style:{borderTop:"1px solid var(--claron-border)"},className:"jsx-72ce0f9cc0022da8 px-4 py-2.5 flex items-center gap-3 shrink-0",children:[(0,t.jsx)("div",{style:{backgroundColor:"var(--claron-node-bg)",color:"var(--claron-node)",border:"1px solid var(--claron-node-border)"},className:"jsx-72ce0f9cc0022da8 w-6 h-6 rounded-full text-ui-xs font-bold flex items-center justify-center shrink-0",children:"S"}),(0,t.jsxs)("div",{style:{color:"var(--foreground)"},className:"jsx-72ce0f9cc0022da8 text-ui-sm font-medium",children:["Sarah Chen ",(0,t.jsx)("span",{style:{color:"var(--text-muted)"},className:"jsx-72ce0f9cc0022da8",children:"Â· Guest Â· 375Ã667"})]})]})]}),(0,t.jsx)(r.default,{id:"72ce0f9cc0022da8",children:"@keyframes claronChPulse{0%,to{filter:drop-shadow(0 0 10px var(--claron-primary-glow));transform:translateZ(0)scale(1)}50%{filter:drop-shadow(0 0 18px var(--claron-primary-glow));transform:translateZ(0)scale(1.014)}}@keyframes claronChEnter{0%{opacity:0;transform:translateZ(0)scale(.975)}to{opacity:1;transform:translateZ(0)scale(1)}}@keyframes claronChHalo{0%,to{opacity:.22;transform:translateZ(0)scale(1)}55%{opacity:.56;transform:translateZ(0)scale(1.028)}}@keyframes claronChBurst{0%{opacity:0;filter:blur(12px);transform:translateZ(0)scale(.96)}to{opacity:.42;filter:blur();transform:translateZ(0)scale(1)}}@keyframes claronChTooltipIn{0%{opacity:0;transform:translateY(-8px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}"})]})}function k(){return(0,t.jsx)(b.StoryChapter,{number:"03",accent:"primary",icon:(0,t.jsx)(n.Crosshair,{className:"w-6 h-6 text-claron-primary"}),badge:"Take Me There",headline:(0,t.jsxs)(t.Fragment,{children:["Claron It!",(0,t.jsx)("br",{}),"See The Bug, Live."]}),description:(0,t.jsxs)(t.Fragment,{children:["Every Claron bug report has a"," ",(0,t.jsx)("strong",{className:"text-claron-node",children:"âClaron It!â"})," button. Click it, and a ",(0,t.jsx)("strong",{className:"text-white",children:"spotlight overlay"})," guides you step-by-step through the exact navigation path the tester took â menus they opened, buttons they clicked, pages they visited â until you land on the ",(0,t.jsx)("strong",{className:"text-claron-rose",children:"exact element"})," that triggered the bug. No guessing. No âcannot reproduce.â"," ",(0,t.jsx)("strong",{className:"text-claron-primary",children:"Try the live demo below."})]}),reverse:!1,zIndex:25,stickyTop:48,children:(0,t.jsx)(N,{})})}e.s(["ChapterClaronIt",()=>k,"ClaronItDemo",()=>N],157575)},381149,e=>{"use strict";var t=e.i(843476),r=e.i(283086),a=e.i(839310),s=e.i(271645),n=e.i(962126);

1function i(){let[e,r]=(0,s.useState)("idle"),[a,i]=(0,s.useState)("idle"),[o,l]=(0,s.useState)(!1);return(0,t.jsx)("div",{className:"w-full flex flex-col justify-center h-auto shadow-[0_0_80px_var(--color-claron-ai-glow)] relative z-10 text-left",children:(0,t.jsx)(n.AIFixPanel,{issueTitle:"Submit button missing padding on mobile",explanation:"The px-4 class is overridden by a media query. Appending sm:px-6 resolves spacing.",confidence:94,model:"Claron AI Fixer",annotationId:"ann_8f4a2c",diffGroups:[{title:"src/components/Button.tsx",language:"typescript",lines:[{type:"unchanged",content:"  return ("},{type:"removed",content:'    <button className="bg-blue-500 py-2">'},{type:"added",content:'    <button className="bg-blue-500 py-2 px-4 sm:px-6">'},{type:"unchanged",content:"  );"}]}],applyState:e,prState:a,raisingPr:o,onApply:()=>{r("opening"),setTimeout(()=>{r("sent")},1500)},onRaisePr:()=>{l(!0),setTimeout(()=>{l(!1),i("created")},1500)}})})}function o(){return(0,t.jsx)(a.StoryChapter,{number:"06",accent:"ai",icon:(0,t.jsx)(r.Sparkles,{className:"w-6 h-6 text-claron-ai"}),badge:"AI Fix",headline:(0,t.jsxs)(t.Fragment,{children:["Don't find the line.",(0,t.jsx)("br",{}),"We handle that."]}),description:(0,t.jsx)(t.Fragment,{children:"Tired of hunting for the code you need to change? Our AI maps the bug to your source code and generates the exact fix. Use the CLI to apply it locally, or open a PR with one click."}),reverse:!1,zIndex:50,stickyTop:88,children:(0,t.jsx)(i,{})})}e.s(["ChapterAiFix",()=>o])},60636,e=>{"use strict";var t=e.i(843476),r=e.i(271645);let a=(0,e.i(475254).default)("git-compare",[["circle",{cx:"18",cy:"18",r:"3",key:"1xkwt0"}],["circle",{cx:"6",cy:"6",r:"3",key:"1lh9wr"}],["path",{d:"M13 6h3a2 2 0 0 1 2 2v7",key:"1yeb86"}],["path",{d:"M11 18H8a2 2 0 0 1-2-2V9",key:"19pyzm"}]]);var s=e.i(643531),n=e.i(473708),i=e.i(839310),o=e.i(821780),l=e.i(657595);function c(){let[e,i]=(0,r.useState)("element");return(0,t.jsxs)("div",{className:"w-full flex flex-col gap-3 h-auto max-h-full select-none",children:[(0,t.jsx)(o.BuildLogViewer,{title:"rebuild Â· fix/ann-8f4a2c",status:"done",maxHeight:"999px",className:"w-full overflow-hidden rounded-lg",lines:[{level:"dim",message:"Webhook received: push to claron/fix-ann-8f4a2c",timestamp:"00:00"},{level:"info",message:"Pulling latest changesâ¦",timestamp:"00:01"},{level:"info",message:"Changed file: src/components/Button.tsx",timestamp:"00:02"},{level:"info",message:"AI check: file relevant to annotation #ann_8f4a2c â",timestamp:"00:03"},{level:"success",message:"Rebuild complete â 1.8s",timestamp:"00:05"},{level:"success",message:"Taking after screenshotâ¦",timestamp:"00:06"},{level:"success",message:"â Pixel diff generated (element + page)",timestamp:"00:07"}]}),(0,t.jsxs)("div",{className:"border border-claron-primary/30 bg-claron-surface-deep rounded-lg overflow-hidden flex flex-col",children:[(0,t.jsxs)("div",{className:"flex items-center justify-between px-4 py-2.5 border-b border-claron-border shrink-0",children:[(0,t.jsxs)("div",{className:"flex items-center gap-2",children:[(0,t.jsx)(n.Image,{className:"w-4 h-4 text-claron-primary"}),(0,t.jsx)("span",{className:"text-ui-sm font-extrabold text-foreground",children:"Visual Comparison"})]}),(0,t.jsxs)("div",{className:"flex items-center gap-1.5",children:[(0,t.jsx)("button",{onClick:()=>i("element"),className:`text-[10px] font-mono font-bold uppercase tracking-wider px-2 py-0.5 rounded border transition-colors cursor-pointer ${"element"===e?"bg-claron-primary/10 border-claron-primary text-claron-primary":"bg-transparent border-claron-border text-text-muted hover:text-foreground"}`,children:"Element"}),(0,t.jsx)("button",{onClick:()=>i("page"),className:`text-[10px] font-mono font-bold uppercase tracking-wider px-2 py-0.5 rounded border transition-colors cursor-pointer ${"page"===e?"bg-claron-primary/10 border-claron-primary text-claron-primary":"bg-transparent border-claron-border text-text-muted hover:text-foreground"}`,children:"Page"})]})]}),(0,t.jsx)(l.ImageComparison,{beforeSrc:"element"===e?"/visual_diff_before.png":"/visual_diff_page_before.png",afterSrc:"element"===e?"/visual_diff_after.png":"/visual_diff_page_after.png",beforeLabel:"Before",afterLabel:"After",initialPosition:50,className:"w-full aspect-[16/9] border-0 rounded-none shrink-0"}),(0,t.jsxs)("div",{className:"px-4 py-3 border-t border-claron-border flex items-center justify-between shrink-0",children:[(0,t.jsxs)("div",{className:"flex items-center gap-2",children:[(0,t.jsx)(a,{className:"w-4 h-4 text-claron-node"}),(0,t.jsx)("span",{className:"text-ui-sm font-semibold text-foreground",children:"Pixel diff: 3.2% changed"})]}),(0,t.jsxs)("div",{className:"flex items-center gap-2",children:[(0,t.jsx)(s.Check,{className:"w-4 h-4 text-claron-node"}),(0,t.jsx)("span",{className:"text-ui-xs font-mono text-claron-node font-bold",children:"Visual fix verified"})]})]})]})]})}function d(){return(0,t.jsx)(i.StoryChapter,{number:"08",accent:"primary",icon:(0,t.jsx)(a,{className:"w-6 h-6 text-claron-primary"}),badge:"Auto-Rebuild",headline:(0,t.jsxs)(t.Fragment,{children:["Fixed? We",(0,t.jsx)("br",{}),"auto-rebuild."]}),description:(0,t.jsx)(t.Fragment,{children:"The developer pushed the fix. We auto-rebuild, pull the latest, and take an after screenshot â but only if the changed file is relevant to the annotation. AI helps us figure that out. Before screenshot. After screenshot. And the pixel diff between them. For both the element and the full page."}),reverse:!0,zIndex:70,stickyTop:120,children:(0,t.jsx)(c,{})})}e.s(["ChapterAutoRebuild",()=>d],60636)},179309,e=>{"use strict";var t=e.i(843476),r=e.i(248256),a=e.i(643531),s=e.i(37727),n=e.i(107233),i=e.i(839310),o=e.i(40139),l=e.i(554743);let c=[{id:"1",title:"Claron extension active",description:"Detects your SDK instrumentation securely.",status:"done",timestamp:"00:00"},{id:"2",title:"Navigate to production URL",description:"Use your own authenticated session.",status:"done",timestamp:"00:12"},{id:"3",title:"Overlay injected",description:"Same annotation layer as hosted preview.",status:"done",timestamp:"00:13"}

1,{id:"4",title:"Annotate in harmony",description:"Extension captures UI, SDK maps to original sources.",status:"active",timestamp:"00:14"}];function d(){return(0,t.jsxs)("div",{className:"w-full flex flex-col gap-3.5 h-[450px] lg:h-[62vh] xl:h-[66vh] max-h-[580px] overflow-y-auto select-none pr-1.5 scrollbar-thin scrollbar-thumb-white/10 scrollbar-track-transparent",children:[(0,t.jsxs)("div",{className:"flex flex-col bg-claron-surface-deep/30 rounded-xl border border-claron-rose-border/20 p-1",children:[(0,t.jsx)("div",{className:"rounded-lg border border-claron-rose-border/30 overflow-hidden bg-claron-surface-deep",children:(0,t.jsx)(o.CodeBlock,{language:"bash",filename:"production-build",windowStyle:"terminal",variant:"rose",code:`$ npm link claron-sdk
2â SDK linked successfully
3â Hashed sourcemaps uploaded
4
5$ npm run build
6â Production build instrumented`,className:"text-ui-md border-0 bg-transparent",showLineNumbers:!1})}),(0,t.jsxs)("div",{className:"flex items-center gap-3 px-3 py-2.5",children:[(0,t.jsx)("div",{className:"h-px flex-1 bg-claron-rose-border/20"}),(0,t.jsxs)("div",{className:"flex items-center gap-1.5 px-2.5 py-1 rounded-full bg-claron-rose-border/10 border border-claron-rose-border/20 shadow-[0_0_10px_rgba(244,63,94,0.1)]",children:[(0,t.jsx)(n.Plus,{className:"w-3 h-3 text-claron-rose"}),(0,t.jsx)("span",{className:"text-[10px] font-mono text-claron-rose uppercase tracking-widest font-bold",children:"Extension"})]}),(0,t.jsx)("div",{className:"h-px flex-1 bg-claron-rose-border/20"})]}),(0,t.jsx)("div",{className:"bg-claron-surface-deep/50 rounded-lg p-3",children:(0,t.jsx)(l.Timeline,{steps:c,variant:"rose",className:"w-full"})})]}),(0,t.jsxs)("div",{className:"border border-claron-rose-border/30 bg-claron-surface-deep rounded-lg overflow-hidden shrink-0 shadow-[0_4px_20px_rgba(244,63,94,0.02)]",children:[(0,t.jsxs)("div",{className:"px-4 py-2.5 border-b border-claron-rose-border/20 bg-claron-rose-bg/10 flex items-center gap-2",children:[(0,t.jsx)(r.Globe,{className:"w-4 h-4 text-claron-rose"}),(0,t.jsx)("span",{className:"text-ui-sm font-extrabold text-foreground",children:"Hosted vs Production Features"})]}),(0,t.jsxs)("div",{className:"divide-y divide-claron-border/30",children:[(0,t.jsxs)("div",{className:"grid grid-cols-[1fr_85px_85px] px-4 py-2.5 text-[9px] font-extrabold uppercase tracking-wider bg-claron-surface-deep/50 text-text-muted",children:[(0,t.jsx)("span",{children:"Feature"}),(0,t.jsx)("span",{className:"text-center",children:"Hosted"}),(0,t.jsx)("span",{className:"text-center",children:"Prod"})]}),[{feature:"Annotations",hosted:!0,prod:!0},{feature:"Screenshot",hosted:!0,prod:!0},{feature:"Console Logs",hosted:!0,prod:!0},{feature:"Network Logs",hosted:!0,prod:!0},{feature:"AI Fix",hosted:!0,prod:!0},{feature:"Session Replay",hosted:!0,prod:!0},{feature:"After Screenshot",hosted:!0,prod:!1},{feature:"Pixel Diff",hosted:!0,prod:!1}].map(({feature:e,hosted:r,prod:n})=>(0,t.jsxs)("div",{className:"grid grid-cols-[1fr_85px_85px] px-4 py-2 text-ui-xs hover:bg-foreground

6/[0.01] transition-colors items-center",children:[(0,t.jsx)("span",{className:"text-foreground/90 font-medium",children:e}),(0,t.jsx)("span",{className:"text-center",children:r?(0,t.jsx)(a.Check,{className:"w-3.5 h-3.5 text-emerald-500 mx-auto drop-shadow-[0_0_4px_rgba(16,185,129,0.2)]"}):(0,t.jsx)(s.X,{className:"w-3.5 h-3.5 text-rose-500/50 mx-auto"})}),(0,t.jsx)("span",{className:"text-center",children:n?(0,t.jsx)(a.Check,{className:"w-3.5 h-3.5 text-emerald-500 mx-auto drop-shadow-[0_0_4px_rgba(16,185,129,0.2)]"}):(0,t.jsx)(s.X,{className:"w-3.5 h-3.5 text-rose-500/50 mx-auto"})})]},e))]})]})]})}function x(){return(0,t.jsx)(i.StoryChapter,{number:"10",accent:"rose",icon:(0,t.jsx)(r.Globe,{className:"w-6 h-6 text-claron-rose"}),badge:"Production",headline:(0,t.jsxs)(t.Fragment,{children:["Production bug?",(0,t.jsx)("br",{}),"We've got you."]}),description:(0,t.jsxs)(t.Fragment,{children:["Use our SDK to build â we auto-upload hashed sourcemaps for you. Just ",(0,t.jsx)("code",{className:"font-mono text-claron-rose",children:"npm link claron-sdk"}),". Then use our extension to annotate. The extension captures the UI, and the SDK maps the production code back to your original sources in harmony. The only things you miss: pixel diff and after screenshots."]}),reverse:!0,zIndex:90,stickyTop:152,children:(0,t.jsx)(d,{})})}e.s(["ChapterProduction",()=>x])},845821,e=>{"use strict";var t=e.i(843476),r=e.i(629796),a=e.i(286536),s=e.i(296112),n=e.i(752044),i=e.i(72664),o=e.i(287181),l=e.i(39312),c=e.i(710289),d=e.i(761911),x=e.i(168312),m=e.i(662031),u=e.i(974875),p=e.i(440160),h=e.i(493886),f=e.i(292270),b=e.i(951445),g=e.i(826707),v=e.i(453136),j=e.i(758472),y=e.i(868054),w=e.i(78094),N=e.i(503116),k=e.i(271645),C=e.i(387652),z=e.i(16195),S=e.i(127615),_=e.i(778790),M=e.i(909701),E=e.i(821780),A=e.i(846932),R=e.i(778917),F=e.i(878894),B=e.i(686311),T=e.i(279151),L=e.i(604756);let I={bug:{icon:c.Bug,color:"text-rose-400"},feature:{icon:R.ExternalLink,color:"text-cyan-400"},task:{icon:B.MessageSquare,color:"text-zinc-500 dark:text-zinc-400"},question:{icon:F.AlertTriangle,color:"text-amber-400"}},P={critical:"rose",high:"amber",medium:"default",low:"emerald"};function H({id:e,title:r,type:a,priority:s,status:n,href:i,source:o="linear",disableInViewBlur:l=!1,disableInViewAnimation:c=!1,viewportMargin:d="0px 0px -40px 0px",className:x,...m}){let u=I[a],p=u.icon;return(0,t.jsx)(A.motion.div,{initial:!c&&(l?{opacity:0,scale:.97,y:12}:{opacity:0,scale:.96,filter:"blur(12px)",y:12}),whileInView:c?void 0:l?{opacity:1,scale:1,y:0}:{opacity:1,scale:1,filter:"blur(0px)",y:0},viewport:c?void 0:{once:!0,amount:.01,margin:d},transition:c?void 0:{duration:.4,ease:[.16,1,.3,1]},className:(0,S.cn)("group",x),...m,children:(0,t.jsxs)(T.Card,{variant:"default",className:(0,S.cn)("relative flex items-center gap-3 p-3 cursor-pointer","hover:border-zinc-300 dark:hover:border-white/12 hover:shadow-md dark:hover:shadow-black/30"),children:[(0,t.jsx)(p,{className:(0,S.cn)("h-4 w-4 shrink-0",u.color)}),(0,t.jsxs)("div",{className:"flex-1 min-w-0",children:[(0,t.jsx)("p",{className:"text-ui-sm font-medium text-zinc-900 dark:text-zinc-100 truncate",children:r}),(0,t.jsxs)("p",{className:"text-ui-sm text-zinc-400 dark:text-zinc-500 mt-0.5",children:[o.toUpperCase(),"-",e]})]}),(0,t.jsxs)("div",{className:"flex items-center gap-2 shrink-0",children:[(0,t.jsx)(_.Badge,{variant:P[s],className:"text-ui-sm capitalize",children:s}),(0,t.jsx)("span",{className:"text-ui-sm text-zinc-400 dark:text-zinc-500",children:n}),i&&(0,t.jsx)(L.Button,{variant:"ghost",size:"icon",glow:!1,as:"a",href:i,target:"_blank",rel:"noopener noreferrer",leftIcon:(0,t.jsx)(R.ExternalLink,{className:"h-3 w-3"}),className:"h-7 w-7 shadow-none border-none rounded-lg"})]})]})})}var V=e.i(962126),O=e.i(371367);let D=k.forwardRef(({children:e,className:r,...a},s)=>(0,t.jsx)(A.motion.div,{ref:s,"data-landing-enter":!0,className:(0,S.cn)(r),...a,children:e}));function Z(){let e=[{label:"Browse",icon:a.Eye,active:!1},{label:"Point",icon:s.MousePointer,active:!0},{label:"Area",icon:n.Square,active:!1},{label:"Element",icon:i.Box,active:!1},{label:"Marker",icon:o.Pen,active:!1},{label:"Spotlight",icon:l.Zap,active:!1}];return(0,t.jsxs)("div",{className:"w-full bg-claron-surface-deep border border-claron-border flex flex-col select-none",children:[(0,t.jsxs)("div",{className:"flex items-stretch h-10 overflow-hidden",children:[(0,t.jsxs)("div",{className:"flex items-center px-2.5 gap-0 border-r border-claron-border shrink-0",children:[(0,t.jsx)(O.ClaronLogo,{variant:"icon",size:"xs"}),(0,t.jsx)("div",{className:"w-px h-4 bg-claron-border mx-2"}),(0,t.jsx)("span",{className:"font-mono text-[10px] text-foreground truncate max-w-[80px]",children:"acme-web"})]}),(0,t.jsx)("div",{className:"flex items-stretch",children:e.map(e=>{let r=e.icon;return(0,t.jsxs)("div",{className:`flex items-center gap-1.5 h-full px-2.5 border-r border-claron-border font-mono text-[10px] font-semibold transition-colors ${e.active?"bg-claron-primary/8 text-claron-primary shadow-[inset_0_-2px_0_0_var(--claron-primary)]":"text-text-muted"}`,children:[(0,t.jsx)(r,{className:"w-3 h-3 shrink-0"}),(0,t.jsx)("span",{className:"hidden sm:inline",children:e.label}),e.active&&(0,t.jsx)("span",{className:"text-[8px] px-1 py-0 bg-claron-primary/20 text-claron-primary border border-claron-primary/30 font-bold",children:"on"})]},e.label)})}),(0,t.jsx)("div",{className:"flex-1 border-r border-claron-border min-w-[4px]"}),(0,t.jsx)("div",{className:"flex items-stretch",children:[x.LayoutList,m.Share2,u.HelpCircle].map((e,r)=>(0,t.jsx)("div",{className:"flex items-center justify-center h-full w-8 border-r border-claron-border text-text-muted",children:(0,t.jsx)(e,{className:"w-3 h-3"})},r))}),(0,t.jsx)("div",{className:"flex items-stretch",children:[p.Download,h.Film].map((e,r)=>(0,t.jsx)("div",{className:"flex items-center justify-center h-full w-8 border-r border-claron-border text-text-muted",children:(0,t.jsx)(e,{className:"w-3 h-3"})},r))}),(0,t.jsxs)("div",{className:"flex items-center px-2.5 gap-3 border-r border-claron-border shrink-0",children:[(0,t.jsxs)("div",{className:"flex items-center gap-1",children:[(0,t.jsx)(c.Bug,{className:"w-3 h-3 text-text-muted"}),(0,t.jsx)("span",{className:"font-mono text-[10px] text-text-secondary",children:"3"})]}),(0,t.jsxs)("div",{className:"flex items-center gap-1",children:[(0,t.jsx)(M.StatusDot,{status:"active",size:"sm",pulse:!0}),(0,t.jsx)("span",{className:"font-mono text-[10px] text-text-secondary",children:"2"}),(0,t.jsx)(d.Users,{className:"w-3 h-3 text-text-muted"})]})]}),(0,t.jsxs)("div",{className:"flex items-center gap-1 px-3 text-claron-rose font-mono text-[10px] font-semibold shadow-[inset_0_-2px_0_0_var(--claron-rose-border)] shrink-0",children:[(0,t.jsx)(f.LogOut,{className:"w-3 h-3"}),(0,t.jsx)("span",{className:"hidden sm:inline",children:"End"})]})]}),(0,t.jsxs)("div",{className:"flex items-stretch h-8 border-t border-claron-border",children:[(0,t.jsx)("div",{className:"px-2.5 flex items-center",children:(0,t.jsx)("span",{className:"font-mono text-[10px] font-semibold text-text-muted",children:"Viewport"})}),(0,t.jsx)("div",{className:"flex items-stretch border-l border-claron-border",children:[{icon:g.Smartphone,label:"Mobile"},{icon:v.Tablet,label:"Tablet"},{icon:b.Monitor,label:"Desktop",active:!0}].map(({icon:e,label:r,active:a})=>(0,t.jsxs)("div",{className:`flex items-center gap-1.5 h-full px-2.5 border-r border-claron-border font-mono text-[10px] font-semibold ${a?"text-claron-primary bg-claron-primary/6":"text-text-muted"}`,children:[(0,t.jsx)(e,{className:"w-3 h-3"}),(0,t.jsx)("span",{className:"hidden md:inline",children:r})]},r))}),(0,t.jsx)("div",{className:"flex-1"}),(0,t.jsx)("div",{className:"flex items-center px-2.5 border-l border-claron-border",children:(0,t.jsx)("span",{className:"text-[8px] px-1.5 py-0.5 bg-claron-primary/10 text-claron-primary border border-claron-primary/20 font-bold font-mono",children:"Host"})})]})]})}function W({className:e}){return(0,t.jsxs)("div",{className:(0,S.cn)("w-full bg-claron-surface-deep border border-claron-border flex flex-col select-none overflow-hidden",e),children:[(0,t.jsxs)("div",{className:"flex items-center justify-between h-10 px-3 border-b border-claron-border bg-claron-surface-deep shrink-0",children:[(0,t.jsxs)("div",{className:"flex items-center gap-2",children:[(0,t.jsx)(s.MousePointer,{className:"w-3 h-3 text-text-muted"}),(0,t.jsx)("span",{className:"font-mono text-[10px] font-semibold text-text-secondary",children:"Point"}),(0,t.jsx)("div",{className:"w-px h-3 bg-claron-border"}),(0,t.jsx)("span",{className:"text-[8px] px-1.5 py-0.5 bg-claron-rose/10 text-claron-rose border border-claron-rose/20 font-bold uppercase tracking-wider",children:"Critical"})]}),(0,t.jsx)("span",{className:"font-mono text-[10px] text-text-muted",children:"#ann_8f4a2c"})]}),(0,t.jsxs)("div",{className:"border-b border-claron-border px-3 py-2.5",children:[(0,t.jsx)("div",{className:"text-[11px] font-semibold text-foreground mb-1.5",children:"Submit button broken on mobile"}),(0,t.jsx)("div",{className:"text-[10px] text-text-muted leading-relaxed",children:"The submit button text is invisible on dark mode â white text on white background."})]}),(0,t.jsxs)("div",{className:"border-b border-claron-border px-3 py-2",children:[(0,t.jsxs)("div",{className:"flex items-center gap-1.5 mb-1.5",children:[(0,t.jsx)(j.Code,{className:"w-3 h-3 text-claron-primary"}),(0,t.jsx)("span",{className:"text-[9px] font-semibold text-text-muted uppercase tracking-wider",children:"DOM Selector"})]}),(0,t.jsx)("code",{className:"text-[10px] text-claron-primary font-mono bg-claron-primary/6 border border-claron-primary/10 px-2 py-1 block truncate",children:'form#checkout > div.actions > button[type="submit"]'})]}),(0,t.jsxs)("div",{className:"border-b border-claron-border px-3 py-2",children:[(0,t.jsxs)("div",{className:"flex items-center gap-1.5 mb-1.5",children:[(0,t.jsx)(b.Monitor,{className:"w-3 h-3 text-text-muted"}),(0,t.jsx)("span",{className:"text-[9px] font-semibold text-text-muted uppercase tracking-wider",children:"Screenshot"}),(0,t.jsx)("span",{className:"text-[9px] text-text-muted ml-auto",children:"1024Ã768"})]}),(0,t.jsx)("div",{className:"w-full h-20 bg-claron-surface/30 border border-claron-border relative overflow-hidden flex items-center justify-center",children:(0,t.jsxs)("div",{className:"w-[120px] bg-white rounded shadow-lg overflow-hidden flex flex-col border border-gray-200 scale-75",children:[(0,t.jsx)("div",{className:"h-4 bg-gray-50 border-b border-gray-200 flex items-center px-2",children:(0,t.jsxs)("div",{className:"flex gap-0.5",children:[(0,t.jsx)("div",{className:"w-1.5 h-1.5 rounded-full bg-claron-rose"}),(0,t.jsx)("div",{className:"w-1.5 h-1.5 rounded-full bg-claron-ai"}),(0,t.jsx)("div",{className:"w-1.5 h-1.5 rounded-full bg-claron-node"})]})}),(0,t.jsxs)("div",{className:"p-3 bg-white relative h-14 flex items-center justify-center",children:[(0,t.jsx)("div",{className:"w-16 h-5 bg-blue-600 rounded flex items-center justify-center text-[7px] text-white font-medium ring-2 ring-claron-node ring-offset-1 ring-offset-white",children:"Submit"}),(0,t.jsx)("div",{className:"absolute -top-1 right-5 w-4 h-4 rounded-full text-white flex items-center justify-center text-[7px] font-bold shadow-lg z-20 bg-claron-node",children:"1"})]})]})})]}),(0,t.jsxs)("div",{className:"flex min-h-0 flex-1",children:[(0,t.jsxs)("div",{className:"flex-1 border-r border-claron-border px-3 py-2",children:[(0,t.jsxs)("div",{className:"flex items-center gap-1.5 mb-1.5",children:[(0,t.jsx)(y.Terminal,{className:"w-3 h-3 text-claron-rose"}),(0,t.jsx)("span",{className:"text-[9px] font-semibold text-text-muted uppercase tracking-wider",children:"Console"}),(0,t.jsx)("span",{className:"text-[8px] px-1 bg-claron-rose/10 text-claron-rose border border-claron-rose/20 ml-auto",children:"2"})]}),(0,t.jsx)("div",{className:"text-[9px] font-mono text-claron-rose bg-claron-rose/6 border border-claron-rose/10 p-1.5 truncate mb-1",children:"TypeError: null is not an object"}),(0,t.jsx)("div",{className:"text-[9px] font-mono text-claron-ai bg-claron-ai/6 border border-claron-ai/10 p-1.5 truncate",children:"Warning: Each child should have a unique key"})]}),(0,t.jsxs)("div",{className:"flex-1 px-3 py-2",children:[(0,t.jsxs)("div",{className:"flex items-center gap-1.5 mb-1.5",children:[(0,t.jsx)(w.Network,{className:"w-3 h-3 text-claron-ai"}),(0,t.jsx)("span",{className:"text-[9px] font-semibold text-text-muted uppercase tracking-wider",children:"Network"}),(0,t.jsx)("span",{className:"text-[8px] px-1 bg-claron-ai/10 text-claron-ai border border-claron-ai/20 ml-auto",children:"1"})]}),(0,t.jsxs)("div",{className:"flex items-center justify-between text-[9px] font-mono p-1.5 border border-claron-border bg-claron-surface/30",children:[(0,t.jsx)("span",{className:"text-text-secondary truncate",children:"GET /api/user"}),(0,t.jsx)("span",{className:"text-claron-rose font-bold ml-2",children:"404"})]})]})]}),(0,t.jsxs)("div",{className:"border-t border-claron-border px-3 py-2 flex items-center gap-2",children:[(0,t.jsx)("div",{className:"w-5 h-5 rounded-full bg-claron-node/20 text-claron-node text-[8px] font-bold flex items-center justify-center border border-claron-node/30",children:"S"}),(0,t.jsxs)("div",{children:[(0,t.jsx)("div",{className:"text-[10px] font-medium text-foreground",children:"Sarah (client)"}),(0,t.jsxs)("div",{className:"text-[9px] text-text-muted flex items-center gap-1",children:[(0,t.jsx)(N.Clock,{className:"w-2.5 h-2.5"})," just now"]})]}),(0,t.jsx)("div",{className:"ml-auto flex items-center gap-1",children:(0,t.jsx)("span",{className:"text-[8px] px-1.5 py-0.5 bg-claron-node/10 text-claron-node border border-claron-node/20 font-mono font-bold",children:"Guest"})})]})]})}function $(){return(0,t.jsxs)("div",{className:"w-full flex flex-col bg-claron-surface-deep border border-claron-border overflow-hidden shadow-[0_0_60px_rgba(0,0,0,0.5)]",children:[(0,t.jsx)(Z,{}),(0,t.jsxs)("div",{className:"flex min-h-0",style:{height:420},children:[(0,t.jsxs)("div",{className:"flex-1 bg-white dark:bg-zinc-900 relative overflow-hidden",children:[(0,t.jsxs)("div",{className:"h-8 border-b border-zinc-200 dark:border-zinc-700 flex items-center px-3 gap-2 bg-zinc-50 dark:bg-zinc-800",children:[(0,t.jsx)("div",{className:"w-4 h-4 rounded bg-blue-500/20 border border-blue-500/30"}),(0,t.jsx)("div",{className:"w-12 h-1.5 rounded-full bg-zinc-300 dark:bg-zinc-600"}),(0,t.jsx)("div",{className:"flex-1"}),(0,t.jsx)("div",{className:"w-8 h-1.5 rounded-full bg-zinc-300 dark:bg-zinc-600"}),(0,t.jsx)("div",{className:"w-8 h-1.5 rounded-full bg-zinc-300 dark:bg-zinc-600"})]}),(0,t.jsxs)("div",{className:"p-6",children:[(0,t.jsx)("div",{className:"w-32 h-2 rounded-full bg-zinc-200 dark:bg-zinc-700 mb-2"}),(0,t.jsx)("div",{className:"w-48 h-3 rounded-full bg-zinc-300 dark:bg-zinc-600 mb-2"}),(0,t.jsx)("div",{className:"w-40 h-3 rounded-full bg-zinc-300 dark:bg-zinc-600 mb-5"}),(0,t.jsxs)("div",{className:"flex gap-3 mb-6",children:[(0,t.jsxs)("div",{className:"relative",children:[(0,t.jsx)("div",{className:"w-20 h-7 bg-blue-600 rounded flex items-center justify-center text-[9px] text-white font-medium",children:"Submit"}),(0,t.jsx)("div",{className:"absolute -inset-1 border-2 rounded pointer-events-none animate-pulse",style:{borderColor:"var(--claron-node)"}}),(0,t.jsx)("div",{className:"absolute -top-2 -right-2 w-5 h-5 rounded-full text-white flex items-center justify-center text-[8px] font-bold shadow-lg z-20",style:{backgroundColor:"var(--claron-node)"},children:"1"})]}),(0,t.jsx)("div",{className:"w-20 h-7 rounded border border-zinc-300 dark:border-zinc-600 bg-zinc-100 dark:bg-zinc-800"})]}),(0,t.jsx)("div",{className:"grid grid-cols-3 gap-2",children:[1,2,3].map(e=>

6(0,t.jsxs)("div",{className:"h-14 rounded border border-zinc-200 dark:border-zinc-700 bg-zinc-50 dark:bg-zinc-800 p-2",children:[(0,t.jsx)("div",{className:"w-8 h-1.5 rounded-full bg-zinc-300 dark:bg-zinc-600 mb-1.5"}),(0,t.jsx)("div",{className:"w-full h-1.5 rounded-full bg-zinc-200 dark:bg-zinc-700 mb-1"}),(0,t.jsx)("div",{className:"w-3/4 h-1.5 rounded-full bg-zinc-200 dark:bg-zinc-700"})]},e))})]}),(0,t.jsxs)("div",{className:"absolute bottom-0 inset-x-0 h-8 border-t flex items-center justify-between px-3 backdrop-blur-xl",style:{backgroundColor:"color-mix(in srgb, var(--claron-node) 10%, var(--claron-surface-deep))",borderColor:"var(--claron-node-border)"},children:[(0,t.jsxs)("div",{className:"flex items-center gap-1.5",children:[(0,t.jsx)("div",{className:"w-1.5 h-1.5 rounded-full animate-pulse",style:{backgroundColor:"var(--claron-node)"}}),(0,t.jsx)("span",{className:"text-[9px] font-semibold uppercase tracking-wider",style:{color:"var(--claron-node)"},children:"Claron Overlay"})]}),(0,t.jsx)("span",{className:"text-[8px] text-text-muted font-mono",children:"Click any element"})]})]}),(0,t.jsx)("div",{className:"w-[260px] lg:w-[300px] shrink-0 border-l border-claron-border",children:(0,t.jsx)(W,{})})]})]})}function q(){let e=(0,k.useRef)(null),a=(0,C.useInView)(e,{amount:.01,margin:"300px 0px"});return(0,t.jsxs)("div",{ref:e,"data-landing-section-active":a?"true":"false",className:"flex-1 relative flex flex-col items-stretch overflow-visible",children:[(0,t.jsx)("div",{className:"w-full border-b border-claron-border bg-claron-surface/30 relative z-10",children:(0,t.jsxs)("div",{className:"max-w-[1400px] mx-auto px-6 lg:px-12 py-8 lg:py-10 flex flex-col lg:flex-row items-start lg:items-center justify-between gap-4",children:[(0,t.jsxs)("div",{className:"flex items-center gap-3",children:[(0,t.jsx)(_.Badge,{variant:"emerald",dot:!0,pulse:!0,children:"Beta â Free to start"}),(0,t.jsx)(M.StatusDot,{status:"live",size:"sm",label:"Preview live"})]}),(0,t.jsx)("p",{className:"text-ui-sm font-semibold uppercase tracking-[0.2em] text-claron-dark",children:"How it works"})]})}),(0,t.jsx)(D,{className:"w-full max-w-[1400px] mx-auto",children:(0,t.jsxs)("div",{className:"flex flex-col lg:flex-row items-stretch w-full min-h-0",children:[(0,t.jsxs)("div",{"data-landing-child":!0,className:"flex-1 flex flex-col border-b lg:border-b-0 lg:border-r border-claron-border pl-16 lg:pl-8 pr-6 lg:pr-8 py-8 lg:p-8 relative overflow-visible",children:[(0,t.jsx)("div",{className:"hidden lg:block absolute top-[52px] left-1/2 w-full z-20 pointer-events-none",children:(0,t.jsx)(z.AnimatedConnector,{variant:"primary",cssAnimation:!0,className:"mt-0 w-full"})}),(0,t.jsx)("div",{className:"hidden lg:block absolute top-[52px] left-[158%] w-full z-20 pointer-events-none",children:(0,t.jsx)(z.AnimatedConnector,{variant:"node",cssAnimation:!0,className:"mt-0 w-full"})}),(0,t.jsx)("div",{className:"block lg:hidden absolute left-[32px] top-[52px] bottom-[-52px] z-0 pointer-events-none",children:(0,t.jsx)(z.AnimatedConnector,{variant:"primary",orientation:"vertical",cssAnimation:!0})}),(0,t.jsxs)("div",{className:"flex flex-col items-start lg:items-center text-left lg:text-center mb-8 relative z-30",children:[(0,t.jsx)("div",{className:"lg:static absolute left-[-48px] top-0 h-10 w-10 rounded-full border-2 border-claron-primary bg-background flex items-center justify-center shadow-[0_0_15px_var(--color-claron-primary-glow)] shrink-0 lg:mb-4",children:(0,t.jsx)("span",{className:"text-ui-sm font-bold text-claron-primary",children:"01"})}),(0,t.jsx)("h3",{className:"text-ui-md font-semibold text-foreground",children:"Connect your repo"}),(0,t.jsx)("p",{className:"text-ui-sm text-text-muted",children:"Push code. Preview is live in seconds."})]}),(0,t.jsx)(E.BuildLogViewer,{title:"preview Â· main",status:"done",maxHeight:"999px",className:"w-full flex-1 min-h-0 overflow-hidden",lines:[{level:"dim",message:"Cloning github.com/acme/webâ¦",timestamp:"00:01"},{level:"info",message:"Detected framework: Next.js 14.2",timestamp:"00:03"},{level:"info",message:"npm install â 847 packages",timestamp:"00:08"},{level:"success",message:"Build complete â 2.1s",timestamp:"00:12"},{level:"success",message:"Injecting Claron overlayâ¦",timestamp:"00:13"},{level:"success",message:"â Preview live at acme-web.claron.dev",timestamp:"00:14"}]})]}),(0,t.jsxs)("div",{"data-landing-child":!0,className:"flex-1 flex flex-col border-b lg:border-b-0 lg:border-r border-claron-border pl-16 lg:pl-8 pr-6 lg:pr-8 py-8 lg:p-8 relative overflow-visible",children:[(0,t.jsx)("div",{className:"block lg:hidden absolute left-[32px] top-[52px] bottom-[-52px] z-0 pointer-events-none",children:(0,t.jsx)(z.AnimatedConnector,{variant:"node",orientation:"vertical",cssAnimation:!0})}),(0,t.jsxs)("div",{className:"flex flex-col items-start lg:items-center text-left lg:text-center mb-8 relative z-30",children:[(0,t.jsx)("div",{className:"lg:static absolute left-[-48px] top-0 h-10 w-10 rounded-full border-2 border-claron-node bg-background flex items-center justify-center shadow-[0_0_15px_var(--color-claron-node-glow)] shrink-0 lg:mb-4",children:(0,t.jsx)("span",{className:"text-ui-sm font-bold text-claron-node",children:"02"})}),(0,t.jsx)("h3",{className:"text-ui-md font-semibold text-foreground",children:"Client clicks the bug"}),(0,t.jsx)("p",{className:"text-ui-sm text-text-muted",children:"No account needed. No script tags."})]}),(0,t.jsx)("div",{className:"flex-1 flex flex-col min-h-0",children:(0,t.jsx)(W,{className:"flex-1"})})]}),(0,t.jsxs)("div",{"data-landing-child":!0,className:"flex-1 flex flex-col pl-16 lg:pl-8 pr-6 lg:pr-8 py-8 lg:p-8 relative",children:[(0,t.jsxs)("div",{className:"flex flex-col items-start lg:items-center text-left lg:text-center mb-8 relative z-30",children:[(0,t.jsx)("div",{className:"lg:static absolute left-[-48px] top-0 h-10 w-10 rounded-full border-2 border-claron-ai bg-background flex items-center justify-center shadow-[0_0_15px_var(--color-claron-ai-glow)] shrink-0 lg:mb-4",children:(0,t.jsx)("span",{className:"text-ui-sm font-bold text-claron-ai",children:"03"})}),(0,t.jsx)("h3",{className:"text-ui-md font-semibold text-foreground",children:"One-click PR opened"}),(0,t.jsx)("p",{className:"text-ui-sm text-text-muted",children:"Ticket, branch, commit, and PR stay linked."})]}),(0,t.jsxs)("div",{className:"flex flex-col gap-3 flex-1",children:[(0,t.jsx)(V.AIFixPanel,{issueTitle:"Submit button missing padding on mobile",explanation:"The `px-4` class is overridden by a media query. Appending `sm:px-6` resolves spacing.",diff:[{type:"removed",content:'  <button className="bg-blue-500 py-2">',lineNum:{old:42}},{type:"added",content:'  <button className="bg-blue-500 py-2 px-4 sm:px-6">',lineNum:{new:42}}],confidence:94,model:"A.I.",className:"w-full"}),(0,t.jsx)(H,{id:"842",title:"Submit button broken on mobile",type:"bug",priority:"high",status:"Open",source:"linear",disableInViewAnimation:!0}),(0,t.jsxs)("div",{className:"border border-claron-primary/30 bg-claron-primary-bg/70 p-3 flex items-center justify-between gap-3",children:[(0,t.jsxs)("div",{className:"flex items-center gap-2 min-w-0",children:[(0,t.jsx)(r.GitPullRequest,{className:"w-4 h-4 text-claron-primary shrink-0"}),(0,t.jsxs)("div",{className:"min-w-0",children:[(0,t.jsx)("p",{className:"text-ui-sm font-extrabold text-foreground truncate",children:"PR #128 Â· fix mobile submit padding"}),(0,t.jsx)("p",{className:"text-ui-xs font-mono text-text-muted truncate",children:"claron/fix-ann-8f4a2c Â· checks passed"})]})]}),(0,t.jsx)("span",{className:"text-ui-xs font-mono font-bold text-claron-primary border border-claron-primary/30 bg-background/40 px-2 py-1 shrink-0",children:"open"})]})]})]})]})})]})}D.displayName="LandingStaggerGroup",e.s(["FormDrawerMockup",()=>W,"HowItWorksSection",()=>q,"ReviewSessionMockup",()=>$,"ToolbarMockup",()=>Z],845821)},587357,e=>{"use strict";var t=e.i(843476),r=e.i(271645),a=e.i(387652),s=e.i(475254);let n=(0,s.default)("ticket",[["path",{d:"M2 9a3 3 0 0 1 0 6v2a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-2a3 3 0 0 1 0-6V7a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2Z",key:"qn84l0"}],["path",{d:"M13 5v2",key:"dyzc3o"}],["path",{d:"M13 17v2",key:"1ont0d"}],["path",{d:"M13 11v2",key:"1wjjxi"}]]),i=(0,s.default)("panels-top-left",[["rect",{width:"18",height:"18",x:"3",y:"3",rx:"2",key:"afitv7"}],["path",{d:"M3 9h18",key:"1pudct"}],["path",{d:"M9 21V9",key:"1oto5p"}]]);var o=e.i(245423),l=e.i(39312),c=e.i(846932),d=e.i(225913),x=e.i(848692),m=e.i(778790),u=e.i(239616);let p=(0,s.default)("wifi",[["path",{d:"M12 20h.01",key:"zekei9"}

6],["path",{d:"M2 8.82a15 15 0 0 1 20 0",key:"dnpr2z"}],["path",{d:"M5 12.859a10 10 0 0 1 14 0",key:"1x1e6c"}],["path",{d:"M8.5 16.429a5 5 0 0 1 7 0",key:"1bycff"}]]),h=(0,s.default)("wifi-off",[["path",{d:"M12 20h.01",key:"zekei9"}],["path",{d:"M8.5 16.429a5 5 0 0 1 7 0",key:"1bycff"}],["path",{d:"M5 12.859a10 10 0 0 1 5.17-2.69",key:"1dl1wf"}],["path",{d:"M19 12.859a10 10 0 0 0-2.007-1.523",key:"4k23kn"}],["path",{d:"M2 8.82a15 15 0 0 1 4.177-2.643",key:"1grhjp"}],["path",{d:"M22 8.82a15 15 0 0 0-11.288-3.764",key:"z3jwby"}],["path",{d:"m2 2 20 20",key:"1ooewy"}]]);var f=e.i(503116),b=e.i(127615),g=e.i(604756);let v=(0,d.cva)("group relative flex items-center gap-4 transition-all duration-200 overflow-hidden",{variants:{variant:{feature:["p-4 rounded-none","bg-cyan-50/50 dark:bg-cyan-500/[0.03] border border-cyan-100 dark:border-white/[0.06]","hover:bg-cyan-50 dark:hover:bg-cyan-500/[0.07] hover:border-cyan-200 dark:hover:border-white/[0.10]"],glass:["p-4 rounded-xl","bg-white/70 dark:bg-white/[0.04] border border-gray-200 dark:border-white/[0.08] backdrop-blur-xl","hover:bg-white dark:hover:bg-white/[0.07] hover:border-gray-300 dark:hover:border-white/[0.14]","shadow-sm dark:shadow-[0_1px_0_0_rgba(255,255,255,0.04)_inset]"],dark:["p-4 rounded-xl","bg-gray-100 dark:bg-zinc-900/80 border border-gray-200 dark:border-white/[0.06]","hover:bg-gray-200 dark:hover:bg-zinc-900 hover:border-gray-300 dark:hover:border-white/[0.12]","shadow-sm dark:shadow-[0_2px_8px_rgba(0,0,0,0.4)]"]}},defaultVariants:{variant:"feature"}}),j={connected:{icon:(0,t.jsx)(p,{className:"h-3 w-3"}),color:"text-emerald-400",label:"Connected"},error:{icon:(0,t.jsx)(h,{className:"h-3 w-3"}),color:"text-rose-400",label:"Error"},pending:{icon:(0,t.jsx)(f.Clock,{className:"h-3 w-3"}),color:"text-amber-400",label:"Pending"}},y=r.memo(function({id:e,name:r,description:a,icon:s,enabled:n,onToggle:i,configHref:o,status:l="connected",badge:d,variant:p="feature",className:h,showStatusLabel:f=!1,disableInViewBlur:y=!1,disableInViewAnimation:w=!1,viewportMargin:N="0px 0px -40px 0px"}){let k=j[l];return(0,t.jsxs)(c.motion.div,{...w?{initial:!1}:{initial:y?{opacity:0,scale:.97,y:12}:{opacity:0,scale:.96,filter:"blur(12px)",y:12},whileInView:y?{opacity:1,scale:1,y:0}:{opacity:1,scale:1,filter:"blur(0px)",y:0},viewport:{once:!0,amount:.01,margin:N},transition:{duration:.4,ease:[.16,1,.3,1]}},className:(0,b.cn)(v({variant:p}),h),children:[(0,t.jsx)("div",{className:"absolute inset-0 pointer-events-none",style:{background:"radial-gradient(ellipse at 0% 50%, rgba(6,182,212,0.06), transparent 70%)",opacity:+!!n,transition:"opacity 350ms ease"}}),(0,t.jsx)("div",{className:"absolute left-0 top-0 bottom-0 w-0.5 pointer-events-none",style:{background:"linear-gradient(to bottom, transparent, #06b6d4, transparent)",opacity:+!!n,transition:"opacity 350ms ease"}}),(0,t.jsx)("div",{className:"relative shrink-0",children:(0,t.jsx)("div",{className:"h-10 w-10 flex items-center justify-center",style:{background:"rgba(255,255,255,0.04)",border:"1px solid rgba(255,255,255,0.08)",boxShadow:n?"0 0 16px rgba(6,182,212,0.20), 0 0 4px rgba(6,182,212,0.10)":"none",borderColor:n?"rgba(6,182,212,0.25)":"rgba(255,255,255,0.08)",transition:"box-shadow 350ms ease, border-color 350ms ease"},children:(0,t.jsx)("span",{className:"text-gray-700 dark:text-white/80 [&_svg]:h-5 [&_svg]:w-5",children:s})})}),(0,t.jsxs)("div",{className:"flex-1 min-w-0 relative z-10",children:[(0,t.jsxs)("div",{className:"flex items-center gap-2 mb-0.5",children:[(0,t.jsx)("p",{className:"text-ui-sm font-semibold text-gray-900 dark:text-white/90 truncate leading-snug",children:r}),d&&(0,t.jsx)(m.Badge,{variant:"default",className:"text-ui-sm px-1.5 py-0 shrink-0",children:d}),"error"===l&&(0,t.jsx)(m.Badge,{variant:"rose",className:"text-ui-sm px-1.5 py-0 shrink-0",children:"Error"}),"pending"===l&&(0,t.jsx)(m.Badge,{variant:"amber",className:"text-ui-sm px-1.5 py-0 shrink-0",children:"Pending"})]}),(0,t.jsxs)("div",{className:"flex items-center gap-1.5",children:[(0,t.jsx)("span",{className:(0,b.cn)("shrink-0",k.color),children:k.icon}),f&&(0,t.jsxs)("span",{className:(0,b.cn)("text-ui-sm font-medium shrink-0",k.color),children:[k.label," Â·"," "]}),(0,t.jsx)("p",{className:"text-ui-sm text-gray-500 dark:text-white/40 truncate leading-snug",children:a})]})]}),(0,t.jsxs)("div",{className:"flex items-center gap-2 shrink-0 relative z-10",children:[o&&(0,t.jsx)(g.Button,{variant:"ghost",size:"icon",glow:!1,as:"a",href:o,target:"_blank",rel:"noopener noreferrer",leftIcon:(0,t.jsx)(u.Settings,{className:"h-3.5 w-3.5"}),className:"h-7 w-7 shadow-none border-none rounded-lg","aria-label":`Configure ${r}`}),(0,t.jsx)(x.Switch,{id:`integration-${e}`,checked:n,onCheckedChange:i,animated:!w,variant:n?"primary":"dark",size:"sm"})]})]})});y.displayName="IntegrationConfigCard";var w=e.i(279151);let N=[{id:"ticket-trackers",label:"Ticket Trackers",icon:(0,t.jsx)(n,{className:"w-[16px] h-[16px] text-cyan-400"}),badge:"CORE",badgeVariant:"cyan",description:"Connect issue trackers per project so annotation work can be routed into the tools your team already uses.",integrations:[{id:"linear",name:"Linear",description:"File issues directly to your Linear workspace with priority and assignee pre-filled.",icon:(0,t.jsx)(function({className:e}){return(0,t.jsx)("svg",{className:e,viewBox:"0 0 100 100",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:(0,t.jsx)("path",{d:"M1.22541 61.5228c-.2225-.9485.90748-1.5459 1.59638-.857L37.3342 99.1782c.6889.6889.0915 1.8189-.857 1.5964C16.3109 95.8221 5.1131 84.6243.5443 63.0272l.68111-1.5044zM.00189135 46.8891c-.01764375-1.0137 1.2201-1.5133 1.94375-.7927L52.2169 96.7492c.7206.7206.2209 1.9594-.7927 1.9418-3.505-.0612-6.3892-.2395-8.9881-.6194L.575999 49.2902c-.379552-2.5989-.557753-5.4831-.574109-8.9929L0 46.8891zM4.49365 32.2078c-.8251-.4648-1.1765-1.5501-.6934-2.3986C9.05258 21.1357 16.5428 12.5649 26.285 6.10386c9.6915-6.41755 21.3994-9.44666 35.5925-9.44666 1.0128 0 1.5 1.2201.7927 1.9274L4.49365 32.2078zM22.7473 5.43688c-.6918-.68963-1.8267-.10002-1.5955.83947C27.2213 30.6198 43.4382 54.5271 70.1274 81.2163c8.8232 8.8232 18.0174 15.8724 27.2085 20.9424.8487.472 1.5501-.3748.857-1.5955L22.7473 5.43688z",fill:"

6currentColor"})})},{className:"h-5 w-5 text-violet-400"}),status:"connected",badge:"Native"},{id:"jira",name:"Jira",description:"Create Jira issues in any project. Supports epics, sprints, and custom fields.",icon:(0,t.jsx)(function({className:e}){return(0,t.jsxs)("svg",{className:e,viewBox:"0 0 32 32",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[(0,t.jsx)("path",{d:"M15.9842 2.00293L8.16895 9.81836L12.0303 13.6797L15.9842 9.72559L19.9385 13.6797L23.7998 9.81836L15.9842 2.00293Z",fill:"#2684FF"}),(0,t.jsx)("path",{d:"M15.9842 18.3203L12.0303 22.2744L15.9842 26.2285L19.9385 22.2744L15.9842 18.3203Z",fill:"#2684FF"}),(0,t.jsx)("path",{d:"M12.0303 13.6797L8.16895 9.81836L4.20508 13.7822L8.06934 17.6436L12.0303 13.6797Z",fill:"#0052CC"}),(0,t.jsx)("path",{d:"M12.0303 13.6797L8.06934 17.6436L12.0303 21.6074L15.9842 17.6436L12.0303 13.6797Z",fill:"#2684FF"}),(0,t.jsx)("path",{d:"M19.9385 13.6797L15.9842 17.6436L19.9385 21.6074L23.9023 17.6436L19.9385 13.6797Z",fill:"#2684FF"}),(0,t.jsx)("path",{d:"M19.9385 13.6797L23.9023 17.6436L27.7666 13.7822L23.7998 9.81836L19.9385 13.6797Z",fill:"#0052CC"})]})},{className:"h-5 w-5"}),status:"connected"},{id:"trello",name:"Trello",description:"Add cards to any Trello board and list. Attachments are included automatically.",icon:(0,t.jsx)(function({className:e}){return(0,t.jsxs)("svg",{className:e,viewBox:"0 0 32 32",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[(0,t.jsx)("rect",{x:"2",y:"2",width:"28",height:"28",rx:"4",fill:"#0079BF"}),(0,t.jsx)("rect",{x:"6",y:"6",width:"8",height:"18",rx:"2",fill:"white"}),(0,t.jsx)("rect",{x:"18",y:"6",width:"8",height:"12",rx:"2",fill:"white"})]})},{className:"h-5 w-5"}),status:"pending"},{id:"asana",name:"Asana",description:"Create tasks in Asana projects with full annotation detail and screenshots.",icon:(0,t.jsx)(function({className:e}){return(0,t.jsxs)("svg",{className:e,viewBox:"0 0 32 32",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[(0,t.jsx)("circle",{cx:"16",cy:"9",r:"5",fill:"#F06A6A"}),(0,t.jsx)("circle",{cx:"7",cy:"22",r:"5",fill:"#F06A6A"}),(0,t.jsx)("circle",{cx:"25",cy:"22",r:"5",fill:"#F06A6A"})]})},{className:"h-5 w-5"}),status:"connected"},{id:"clickup",name:"ClickUp",description:"Push tasks to any ClickUp Space, Folder, or List with custom field mapping.",icon:(0,t.jsx)(function({className:e}){return(0,t.jsxs)("svg",{className:e,viewBox:"0 0 32 32",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[(0,t.jsx)("path",{d:"M4 22L9.46 15.62C11.01 13.74 12.76 12 16 12C19.24 12 20.99 13.74 22.54 15.62L28 22",stroke:"#7B68EE",strokeWidth:"3",strokeLinecap:"round",strokeLinejoin:"round"}),(0,t.jsx)("path",{d:"M4 22L9.46 15.62C11.01 13.74 12.76 12 16 12",stroke:"#00C2E0",strokeWidth:"3",strokeLinecap:"round"})]})},{className:"h-5 w-5"}),status:"connected"},{id:"shortcut",name:"Shortcut",description:"Create stories in Shortcut with workflow state and iteration support.",icon:(0,t.jsx)(function({className:e}){return(0,t.jsxs)("svg",{className:e,viewBox:"0 0 32 32",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[(0,t.jsx)("circle",{cx:"16",cy:"16",r:"14",fill:"#45C886"}),(0,t.jsx)("path",{d:"M9 16C9 12.134 12.134 9 16 9V9C19.866 9 23 12.134 23 16V19C23 21.209 21.209 23 19 23H16C12.134 23 9 19.866 9 16Z",fill:"white"}),(0,t.jsx)("circle",{cx:"16",cy:"16",r:"3",fill:"#45C886"})]})},{className:"h-5 w-5"}),status:"connected"}]},{id:"project-tools",label:"Project Tools",icon:(0,t.jsx)(i,{className:"w-[16px] h-[16px] text-emerald-400"}),badge:"PM",badgeVariant:"emerald",description:"Configure board-style destinations from the same integrations screen used for ticket and notification providers.",integrations:[{id:"notion",name:"Notion",description:"Create database entries in any Notion page. Tags and statuses are auto-mapped.",icon:(0,t.jsx)(function({className:e}){return(0,t.jsxs)("svg",{className:e,viewBox:"0 0 32 32",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[(0,t.jsx)("rect",{x:"2",y:"2",width:"28",height:"28",rx:"4",fill:"white"}),(0,t.jsx)("path",{d:"M10.5 8H21.5C22.328 8 23 8.672 23 9.5V22.5C23 23.328 22.328 24 21.5 24H10.5C9.672 24 9 23.328 9 22.5V9.5C9 8.672 9.672 8 10.5 8Z",fill:"white",stroke:"#1a1a1a",strokeWidth:"1.5"}),(0,t.jsx)("path",{d:"M12 12H20M12 16H18M12 20H16",stroke:"#1a1a1a",strokeWidth:"1.5",strokeLinecap:"round"})]})},{className:"h-5 w-5"}),status:"connected",badge:"Beta"},{id:"monday",name:"Monday.com",description:"Add items to Monday boards with status columns and annotation metadata.",icon:(0,t.jsx)(function({className:e}){return(0,t.jsxs)("svg",{className:e,viewBox:"0 0 32 32",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[(0,t.jsx)("circle",{cx:"8",cy:"20",r:"4.5",fill:"#FF3D57"}),(0,t.jsx)("circle",{cx:"16",cy:"20",r:"4.5",fill:"#FFCB00"}),(0,t.jsx)("circle",{cx:"24",cy:"20",r:"4.5",fill:"#00CA72"})]})},{className:"h-5 w-5"}),status:"pending"}]},{id:"notifications",label:"Notifications",icon:(0,t.jsx)(o.Bell,{className:"w-[16px] h-[16px] text-amber-400"}),badge:"ALERTS",badgeVariant:"amber",description:"Send annotation and build activity into chat tools your team already watches.",integrations:[{id:"slack",

6name:"Slack",description:"Send rich notifications to any channel when a bug is reported or fixed.",icon:(0,t.jsx)(function({className:e}){return(0,t.jsxs)("svg",{className:e,viewBox:"0 0 32 32",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[(0,t.jsx)("path",{d:"M8.5 19.5C8.5 20.881 7.381 22 6 22C4.619 22 3.5 20.881 3.5 19.5C3.5 18.119 4.619 17 6 17H8.5V19.5Z",fill:"#E01E5A"}),(0,t.jsx)("path",{d:"M9.75 19.5C9.75 18.119 10.869 17 12.25 17C13.631 17 14.75 18.119 14.75 19.5V26C14.75 27.381 13.631 28.5 12.25 28.5C10.869 28.5 9.75 27.381 9.75 26V19.5Z",fill:"#E01E5A"}),(0,t.jsx)("path",{d:"M12.25 8.5C10.869 8.5 9.75 7.381 9.75 6C9.75 4.619 10.869 3.5 12.25 3.5C13.631 3.5 14.75 4.619 14.75 6V8.5H12.25Z",fill:"#36C5F0"}),(0,t.jsx)("path",{d:"M12.25 9.75C13.631 9.75 14.75 10.869 14.75 12.25C14.75 13.631 13.631 14.75 12.25 14.75H6C4.619 14.75 3.5 13.631 3.5 12.25C3.5 10.869 4.619 9.75 6 9.75H12.25Z",fill:"#36C5F0"}),(0,t.jsx)("path",{d:"M23.5 12.25C23.5 10.869 24.619 9.75 26 9.75C27.381 9.75 28.5 10.869 28.5 12.25C28.5 13.631 27.381 14.75 26 14.75H23.5V12.25Z",fill:"#2EB67D"}),(0,t.jsx)("path",{d:"M22.25 12.25C22.25 13.631 21.131 14.75 19.75 14.75C18.369 14.75 17.25 13.631 17.25 12.25V6C17.25 4.619 18.369 3.5 19.75 3.5C21.131 3.5 22.25 4.619 22.25 6V12.25Z",fill:"#2EB67D"}),(0,t.jsx)("path",{d:"M19.75 23.5C21.131 23.5 22.25 24.619 22.25 26C22.25 27.381 21.131 28.5 19.75 28.5C18.369 28.5 17.25 27.381 17.25 26V23.5H19.75Z",fill:"#ECB22E"}),(0,t.jsx)("path",{d:"M19.75 22.25C18.369 22.25 17.25 21.131 17.25 19.75C17.25 18.369 18.369 17.25 19.75 17.25H26C27.381 17.25 28.5 18.369 28.5 19.75C28.5 21.131 27.381 22.25 26 22.25H19.75Z",fill:"#ECB22E"})]})},{className:"h-5 w-5"}),status:"connected",badge:"Popular"},{id:"teams",name:"Microsoft Teams",description:"Post adaptive cards to Teams channels with one-click actions to review or close.",icon:(0,t.jsx)(function({className:e}){return(0,t.jsxs)("svg",{className:e,viewBox:"0 0 32 32",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[(0,t.jsx)("path",{d:"M20.5 13C22.433 13 24 11.433 24 9.5C24 7.567 22.433 6 20.5 6C18.567 6 17 7.567 17 9.5C17 11.433 18.567 13 20.5 13Z",fill:"#5059C9"}),(0,t.jsx)("path",{d:"M22 14H16C14.343 14 13 15.343 13 17V24C13 25.657 14.343 27 16 27H22C23.657 27 25 25.657 25 24V17C25 15.343 23.657 14 22 14Z",fill:"#5059C9"}),(0,t.jsx)("path",{d:"M13 10C14.657 10 16 8.657 16 7C16 5.343 14.657 4 13 4C11.343 4 10 5.343 10 7C10 8.657 11.343 10 13 10Z",fill:"#7B83EB"}),(0,t.jsx)("path",{d:"M17 11H9C7.343 11 6 12.343 6 14V22C6 23.657 7.343 25 9 25H13C14.657 25 17 23.657 17 22V14C17 12.343 15.657 11 13 11H17Z",fill:"#7B83EB"})]})},{className:"h-5 w-5"}),status:"connected"}

6,{id:"discord",name:"Discord",description:"Route annotation events to Discord channels with embedded previews.",icon:(0,t.jsx)(function({className:e}){return(0,t.jsx)("svg",{className:e,viewBox:"0 0 32 32",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:(0,t.jsx)("path",{d:"M26.12 6.02A25.44 25.44 0 0 0 20.21 4c-.27.49-.56 1.14-.77 1.66a23.59 23.59 0 0 0-7.07 0C12.16 5.14 11.84 4.49 11.57 4a25.32 25.32 0 0 0-5.91 2.02A26.88 26.88 0 0 0 2 22.66a25.6 25.6 0 0 0 7.82 3.96 18.26 18.26 0 0 0 1.58-2.59 16.8 16.8 0 0 1-2.49-1.19c.21-.15.41-.31.6-.47a18.25 18.25 0 0 0 15.78 0c.2.16.4.32.6.47a16.62 16.62 0 0 1-2.51 1.2 18.35 18.35 0 0 0 1.58 2.58 25.52 25.52 0 0 0 7.82-3.96 26.85 26.85 0 0 0-4.66-16.64zm-16.24 13.3a3 3 0 0 1-2.82-3.14 2.97 2.97 0 0 1 2.82-3.14 2.98 2.98 0 0 1 2.82 3.14 2.97 2.97 0 0 1-2.82 3.14zm10.24 0a3 3 0 0 1-2.82-3.14 2.97 2.97 0 0 1 2.82-3.14 2.98 2.98 0 0 1 2.82 3.14 2.97 2.97 0 0 1-2.82 3.14z",fill:"#5865F2"})})},{className:"h-5 w-5"}),status:"pending"}]}],k={cyan:{bar:"linear-gradient(90deg, transparent, #06b6d4, transparent)",glow:"rgba(6,182,212,0.6)",shadow:"0 0 12px rgba(6,182,212,0.5)"},emerald:{bar:"linear-gradient(90deg, transparent, #10b981, transparent)",glow:"rgba(16,185,129,0.6)",shadow:"0 0 12px rgba(16,185,129,0.5)"},amber:{bar:"linear-gradient(90deg, transparent, #f59e0b, transparent)",glow:"rgba(245,158,11,0.6)",shadow:"0 0 12px rgba(245,158,11,0.5)"}};function C({category:e}){let[a,s]=(0,r.useState)(()=>Object.fromEntries(e.integrations.map(e=>[e.id,"connected"===e.status]))),n=(0,r.useMemo)(()=>Object.values(a).filter(Boolean).length,[a]),i=k[e.badgeVariant],o=(0,r.useCallback)((e,t)=>{s(r=>({...r,[e]:t}))},[]),l=(0,r.useMemo)(()=>Object.fromEntries(e.integrations.map(e=>[e.id,t=>o(e.id,t)])),[e.integrations,o]);return(0,t.jsx)("div",{className:"flex","data-landing-child":!0,children:(0,t.jsxs)(w.Card,{variant:"outline",animated:!1,className:"rounded-none flex-1 flex flex-col bg-background dark:bg-black/90 hover:bg-gray-50/50 dark:hover:bg-black/70 transition-colors duration-200",children:[(0,t.jsx)("div",{className:"absolute top-0 left-0 w-full h-0.5 z-10",style:{background:i.bar,boxShadow:i.shadow}}),(0,t.jsxs)(w.CardHeader,{className:"p-8 pb-6 border-b border-gray-100 dark:border-white/6",children:[(0,t.jsxs)("div",{className:"flex items-start justify-between mb-4",children:[(0,t.jsxs)("div",{className:"flex items-center gap-3",children:[(0,t.jsx)("div",{className:"w-8 h-8 flex items-center justify-center shrink-0 border border-gray-200 dark:border-white/10",style:{background:`radial-gradient(ellipse at 50% 0%, ${i.glow.replace("0.6","0.12")}, transparent 80%)`},children:e.icon}),(0,t.jsx)(w.CardTitle,{className:"font-extrabold text-ui-lg text-gray-900 dark:text-white",children:e.label})]}),(0,t.jsxs)("div",{className:"flex items-center gap-2 shrink-0",children:[(0,t.jsxs)("span",{className:"font-mono text-ui-sm text-gray-500 dark:text-white/40 border border-gray-200 dark:border-white/10 px-2 py-1 bg-background dark:bg-white/5",children:[n,"/",e.integrations.length," ON"]}),(0,t.jsx)(m.Badge,{variant:e.badgeVariant,className:"text-ui-sm",children:e.badge})]})]}),(0,t.jsx)("p",{className:"font-medium text-ui-sm text-gray-600 dark:text-white/60 leading-[1.6]",children:e.description})]}),(0,t.jsx)(w.CardContent,{className:"p-6 pt-6 flex flex-col gap-2",children:e.integrations.map(e=>(0,t.jsx)(y,{...e,enabled:a[e.id],onToggle:l[e.id],disableInViewBlur:!0,disableInViewAnimation:!0,viewportMargin:"0px 0px 18% 0px",className:"bg-background/20 dark:bg-white/3 border-gray-200 dark:border-white/6 hover:bg-background/40 dark:hover:bg-white/6"},e.id))})]})})}function z(){let e=(0,r.useRef)(null),s=(0,a.useInView)(e,{amount:.01,margin:"300px 0px"});return(0,t.jsxs)("section",{ref:e,"data-landing-section-active":s?"true":"false",className:"w-full relative pt-30 flex flex-col items-center",children:[(0,t.jsxs)("div",{className:"w-full px-6 lg:px-12 flex flex-col xl:flex-row items-start xl:items-end justify-between mb-16 relative z-10 gap-8 pb-10",children:[(0,t.jsxs)("div",{className:"flex flex-col gap-6 max-w-[800px]",children:[(0,t.jsxs)("div",{className:"flex items-center gap-3",children:[(0,t.jsx)("div",{className:"w-8 h-8 bg-violet-500/10 border border-violet-500/20 flex items-center justify-center",children:(0,t.jsx)(l.Zap,{className:"w-3.5 h-3.5 text-violet-500 dark:text-violet-400"})}),(0,t.jsx)("span",{className:"font-mono text-ui-sm text-gray-400 dark:text-white/40 tracking-widest uppercase",children:"Integrations"})]}),(0,t.jsxs)("h2",{className:"font-extrabold text-ui-display tracking-tight text-foreground dark:text-white leading-[1.1]",children:["Plug into your stack.",(0,t.jsx)("br",{}),(0,t.jsx)("span",{className:"text-text-muted dark:text-white/40",children:"Not the other way around."})]})]}),(0,t.jsx)("div",{className:"max-w-[480px] xl:text-right border-l-2 border-violet-500/30 pl-6 xl:border-l-0 xl:border-r-2 xl:pr-6 xl:pl-0

6shrink-0",children:(0,t.jsxs)("p",{className:"font-medium text-ui-sm text-text-secondary dark:text-white/60 leading-[1.6]",children:["Keep your tools. Lose the handoffs. Bring rich bug reports into your issue tracker and keep the whole team in the loop.",(0,t.jsx)("span",{className:"text-text-muted block mt-3 text-ui-xs",children:"Interactive preview â try the switches below."})]})})]}),(0,t.jsxs)("div",{className:"w-full relative z-10",children:[(0,t.jsxs)("div",{className:"w-full h-px bg-claron-border relative",children:[(0,t.jsx)("div",{className:"absolute left-[-4px] top-[-4px] text-text-muted text-ui-sm leading-none",children:"+"}),(0,t.jsx)("div",{className:"absolute right-[-4px] top-[-4px] text-text-muted text-ui-sm leading-none",children:"+"})]}),(0,t.jsx)("div",{className:"grid grid-cols-1 lg:grid-cols-3 gap-px bg-claron-border border-l border-r border-claron-border",children:N.map(e=>(0,t.jsx)(C,{category:e},e.id))}),(0,t.jsxs)("div",{className:"w-full h-px bg-claron-border relative",children:[(0,t.jsx)("div",{className:"absolute left-[-4px] bottom-[-4px] text-text-muted text-ui-sm leading-none",children:"+"}),(0,t.jsx)("div",{className:"absolute right-[-4px] bottom-[-4px] text-text-muted text-ui-sm leading-none",children:"+"})]})]})]})}e.s(["IntegrationsSection",()=>z],587357)},136078,e=>{"use strict";var t=e.i(843476),r=e.i(271645),a=e.i(753034),s=e.i(737806),n=e.i(798125),i=e.i(947414);function o({children:e,isValidProp:o,...l}){o&&(0,n.loadExternalIsValidProp)(o);let c=(0,r.useContext)(s.MotionConfigContext);(l={...c,...l}).transition=(0,a.resolveTransition)(l.transition,c.transition),l.isStatic=(0,i.useConstant)(()=>l.isStatic);let d=(0,r.useMemo)(()=>l,[JSON.stringify(l.transition),l.transformPagePoint,l.reducedMotion,l.skipAnimations]);return(0,t.jsx)(s.MotionConfigContext.Provider,{value:d,children:e})}var l=e.i(941351);function c({children:e}){return(0,r.useEffect)(()=>{let e=Array.from(document.querySelectorAll("[data-landing-enter]"));if(0===e.length)return;if(window.matchMedia("(prefers-reduced-motion: reduce)").matches||!("IntersectionObserver"in window))return void e.forEach(e=>{e.dataset.landingEntered="true"});let t=new Set(e),r=e=>{t.delete(e)&&(e.dataset.landingEntered="true",a.unobserve(e))},a=new IntersectionObserver(e=>{for(let t of e)t.isIntersecting&&r(t.target)},{rootMargin:"0px 0px -12% 0px",threshold:.01});e.forEach(e=>a.observe(e));let s=null,n=()=>{s=null;let e=window.innerHeight;for(let a of t)a.getBoundingClientRect().top<e+180&&r(a)},i=()=>{null===s&&(s=requestAnimationFrame(n))};return window.addEventListener("scroll",i,{passive:!0}),requestAnimationFrame(n),()=>{a.disconnect(),window.removeEventListener("scroll",i),null!==s&&cancelAnimationFrame(s)}},[]),(0,t.jsx)(o,{reducedMotion:"user",children:(0,t.jsx)(l.LenisProvider,{children:e})})}e.s(["LandingClientShell",()=>c],136078)},642172,e=>{"use strict";var t=e.i(843476),r=e.i(846932),a=e.i(387652),s=e.i(972520),n=e.i(115057),i=e.i(271645),o=e.i(604756),l=e.i(279151);function c(){let e=(0,i.useRef)(null),c=(0,a.useInView)(e,{margin:"400px 0px"});return(0,t.jsx)(r.motion.section,{ref:e,"data-motion-burst":!0,"data-landing-enter":!0,className:"landing-closing","data-landing-section-active":c?"true":"false",children:(0,t.jsxs)(l.Card,{variant:"default",radius:"2xl",grid:!1,className:"landing-closing-card",children:[(0,t.jsx)("div",{"aria-hidden":!0,className:"landing-closing-orbit"}),(0,t.jsx)("p",{className:"landing-section-kicker",children:"THE NEXT BUG DESERVES A BETTER ENDING."}),(0,t.jsxs)("h2",{children:["Make the next fix",(0,t.jsx)("br",{}),(0,t.jsx)("span",{className:"landing-accent-text",children:"feel inevitable."})]}),(0,t.jsxs)("p",{children:["Bring your team, your code, and your tools.",(0,t.jsx)("br",{}),"Claron connects the rest."]}),(0,t.jsxs)("div",{className:"landing-hero-actions",children:[(0,t.jsx)(o.Button,{as:"a",href:"/signup",variant:"primary",size:"lg",glow:!0,rightIcon:(0,t.jsx)(s.ArrowRight,{size:16}),children:"Get started for free"}),(0,t.jsx)(o.Button,{as:"a",href:"/docs",variant:"ghost",size:"lg",rightIcon:(0,t.jsx)(n.ArrowUpRight,{size:16}),children:"Read the docs"})]})]})})}e.s(["LandingClosing",()=>c])}]);

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.