feat(web): Sprint 4 — animations, live interactions, and world-class UX polish#11
Draft
konjoinfinity wants to merge 69 commits into
Draft
feat(web): Sprint 4 — animations, live interactions, and world-class UX polish#11konjoinfinity wants to merge 69 commits into
konjoinfinity wants to merge 69 commits into
Conversation
… next/link - not-found.tsx: branded 404 with gradient "404", constellation copy, and links back to home/products - products/[slug]/loading.tsx: pulse-skeleton matching the product page layout (breadcrumb, metric strip, hero, features) - PhilosophySection: 2×2 animated card grid for the four Konjo values (ቆንጆ/根性/康宙/건조) with per-card hover glow in the value's accent color; placed between ConstellationMap and DesignPreview on the homepage - next/link migration: ProjectGrid, RelatedProducts, LiveTicker, Breadcrumbs, Footer — all internal links now use <Link> for client-side navigation with prefetch; external URLs kept as <a> https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
…e status countdown - error.tsx: branded error boundary with warm gradient, digest display, try-again CTA - Hero: Typewriter component cycles through 4 Konjo phrases with cursor blink (SSR-safe) - ActivityFeed: live simulated event stream from all 9 products using AnimatePresence - LastUpdated: client-side live counter replacing static ISO timestamp on /status - page.tsx: ActivityFeed placed between ConstellationMap and PhilosophySection https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
…dSection id prop - ProjectGrid: status filter tabs (All/Operational/Degraded/Research) with AnimatePresence popLayout for smooth card enter/exit; filter counts displayed as zero-padded badges - ProductSectionNav: fixed left-rail scroll-spy navigator (lg+ only) using IntersectionObserver; slides in after 320 px scroll, highlights active chapter with expanding dash indicator - AnimatedSection: added optional id prop for scroll-spy anchor targets - products/[slug]/page.tsx: wire section IDs (overview/features/dashboard/related) and render ProductSectionNav above the main content https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
- DesignPreview: convert vertical scroll to ARIA tabbed interface; tabs switch sections with AnimatePresence mode="wait" fade; active tab highlights with brand tint + live dot - ConstellationMap: add center hub showing "KonjoAI · 9 products" at rest; on node hover transitions to display product glyph, metric value/unit, and metric label https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
- PhilosophySection: extract PillarCard component; large CJK word shifts via inner parallax on mouse move (useMotionValue + useSpring x/y) while the card stays fixed, creating a tactile depth effect distinct from ProjectCard's full-card tilt - ProductStatusList: new "use client" component with staggered slide-in animation for status page product rows; migrates <a> to next/link for internal navigation - status/page.tsx: replace static product list with <ProductStatusList />, removing now-unused MiniSparkline and StatusBadge imports at the page level https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
- Footer: CSS-only hover tooltip on each product health chip showing name,
metric value/unit/label, and status in brand color — server-safe, no JS
- ProjectGrid: subtitle counter updates live as filter changes ("02 / 09 projects")
with aria-live="polite" for screen reader announcements
https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
- ProductMetricStrip: when metric.min/max defined, renders an animated progress bar showing where the value sits in its range with percentage, ARIA meter role, and labeled endpoints — visible on squish (tok/s) and kairu (latency) pages - RecentEvents: convert to "use client", add staggered whileInView slide-in animation (delay: i * 0.06) for each event row in the portfolio event log https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
- SiteNav: compute degraded/outage count at module init from PRODUCTS; when count > 0 show a pulsing amber "X degraded" pill in the nav actions that links to /status — currently shows 1 (toki is degraded) https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
- FloatingDock: fixed bottom-right pill buttons that appear after 400px scroll; ⌘ dispatches konjo:open-palette, ↑ smooth-scrolls to top (instant if reduced motion); both buttons have glow hover and visible focus ring; AnimatePresence slide-in/out https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
Keyboard navigation now shows a consistent konjo-accent ring on all buttons, tabs, SVG links, and section nav buttons across every page. https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
TerminalSection types out three product commands (squish, kyro, vectro) character-by-character in a macOS-style terminal window, then loops. Pairs with a feature list (streaming, composable, metrics, auth). FloatingGlyphs now tracks normalized mouse position and each glyph gets its own depth value so they shift at different parallax rates on hover, creating a real sense of 3-D depth in the hero. https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
BenchmarkSection shows four Konjo products vs industry baselines with dual animated bars (Konjo + baseline) that expand on scroll into view. Positioned between TerminalSection and DesignPreview for a capability → performance → aesthetics narrative arc. Animated 404 page replaces the static version with staggered entrance animations matching the error.tsx style. CommandPalette now auto-scrolls the active item into view during keyboard navigation (ArrowDown/ArrowUp). https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
… pages Each product page now shows a Python quick-start snippet with lightweight inline syntax highlighting (keywords, strings, comments, function calls). Includes a macOS-style file bar with traffic lights and a clipboard copy button showing "Copied ✓" feedback. Placed between the feature grid and live dashboard for a capability → usage → live-data narrative arc. https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
template.tsx gives every route a subtle fade+scale entrance (opacity 0→1, y 6→0, scale 0.995→1) that fires on each navigation — persists between sessions since SiteNav and FloatingDock live outside the template. UptimeCalendar is a GitHub-contribution-style grid of 90 coloured squares (green/amber/red) reflecting deterministic uptime history including the toki incident window. Squares stagger in on scroll, scale up on hover, and show a tooltip with date + uptime %. https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
Press ? to open a keyboard shortcuts modal listing all hotkeys. Press g then h/s to jump to Home/Status respectively (Linear/GitHub style). A subtle g-mode indicator appears near the bottom when waiting for the second key, then fades out after 1 s. KeyboardHelp is mounted in layout.tsx alongside CommandPalette so it is available on every page without re-initializing. https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
…button to FloatingDock ProjectGrid now has a text search input that filters by product name and tagline, working in combination with the status filter. An empty-state message appears when no products match. The input expands on focus. FloatingDock adds a dice button (⚄) between ⌘ and ↑ that navigates to a random product page — a fun "surprise me" shortcut for exploring the portfolio. https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
konjoinfinity
changed the title
ActivityFeed events are now Links to their product pages. A → arrow fades in on hover. focus-visible ring added to each item. Hero content now shifts -60px on 500px of scroll via useScroll + useTransform, giving the headline a subtle depth parallax relative to the static aurora background. Wrapped in a single motion.div so individual animate animations are unaffected. https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
Shows up to 5 recently visited products at the top of the palette when opened with no search query, separated from the full product list by a divider. Keyboard navigation indexes across both sections seamlessly. https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
- ToastProvider: global slide-in notification system using konjo:toast custom DOM events; max 3 visible, auto-dismiss after 3.2 s - FloatingDock: tooltip labels on hover (Command palette, Surprise me, Back to top) using group-hover pattern - ProjectGrid: press / to focus the search input from anywhere on page; placeholder hint shows the shortcut - ProductCodeSnippet: copy button now fires a "Copied to clipboard" toast - KeyboardHelp: added / → Focus search shortcut entry https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
- ShareButton: copies product URL to clipboard and fires success toast; displayed as a third action in the product hero - ProductCodeSnippet: added id="product-code" so the section nav can track it - ProductSectionNav: added "Code" entry between Features and Dashboard - RelatedProducts: converted to client component with staggered scroll entrance and hover lift; glyph scales up on hover - ProductMetricStrip: added a "Live" pulse badge aligned to the metric value so visitors know the stat is streaming https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
- Each node shows a soft pulsing ring when idle (radius 22→27→22, staggered by index) — gives the map a living, breathing quality - Active (lit) edges animate a flowing dashed stroke via konjo-edge-flow keyframes so data visually travels between the hovered node and its neighbors - Both effects respect prefers-reduced-motion https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
- ActivityFeed: tracks a session event counter that increments on each new event; displayed as "N events" beside the STREAM badge - CommandPalette: shows a filtered result count (e.g. "3") in the search bar while the user is typing a query - ProjectGrid cards: each headline metric now has a pulsing dot (same color as the metric value) to signal live data https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
Adds a fixed-position radial gradient that follows the pointer with a spring-damped lag (stiffness 55, damping 22), giving the background a subtle sense of depth and presence site-wide. The glow is 640 × 640 px at 7% brand purple opacity — prominent enough to notice on dark surfaces, invisible on any content. Respects prefers-reduced-motion and hides off screen when the cursor leaves the window. https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
- PageTitleEffect: cycles "Still here 👋", "9 products building...", "Come back!" in the browser tab while the user is away; restores the original title on return - BenchmarkSection: gain badges now count up from 0 when the section enters the viewport (1.0 s ease-out, staggered by row index); the ROWS data is restructured to store gainValue/gainPrefix/gainSuffix for clean animated formatting https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
On any product page, pressing [ navigates to the previous product and ] navigates to the next product in the PRODUCTS array (wrapping around). Each jump fires an info toast showing the destination's glyph and name. Added [ Previous product ] and [ Next product ] entries to the keyboard shortcuts help modal so users can discover the shortcut. https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
- sitemap.ts: generates XML sitemap with home (priority 1.0), status (priority 0.9, hourly), and all nine product pages (priority 0.8) - robots.ts: allows all crawlers, links to /sitemap.xml - DesignPreview: tabs now support full ARIA keyboard navigation — ArrowLeft/ArrowRight cycles tabs, Home/End jumps to first/last; tab focus follows the active tab (tabIndex -1 for inactive tabs) https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
- /opengraph-image: dark-themed homepage card with KonjoAI title, tagline, floating glyphs, and stats strip (14 components, 9 products, 79 tests, v0.2) - /products/[slug]/opengraph-image: per-product card featuring the product glyph, name, tagline, and live headline metric with severity-colored value; rendered at edge runtime Both use Next.js ImageResponse / satori for server-side PNG generation. https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
- Footer: added focus-visible rings to all product health dot links and navigation links (were missing keyboard focus indicators) - ProjectGrid: fixed double-space in search placeholder (was "Search… /", now "Search… /") - ConstellationMap: center hub gets a slow rotating dashed ring (24 s revolution) that gives the hub a living orbital quality at rest; respects prefers-reduced-motion https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
konjoinfinity
changed the title
- CommandPalette: each product entry now shows its live metric value (e.g. "42 tok/s") in the accent color alongside the status badge - DesignPreview: spring-smoothed radial cursor spotlight follows the mouse inside the glass panel, matching the ProjectCard interaction pattern
- TerminalSection: ColoredOutput colorizes "▶" in brand color, numbers+units in accent, [brackets] in violet, quoted strings in warm — output lines look like real ANSI terminals - FloatingDock: macOS-dock-style magnification — hovered button scales to 1.45×, adjacent button to 1.22×; spring physics via motion.button; glow ring on active button - Remove unused END_MS constant from TerminalSection
- ActivityFeed: colored left-border accent on each event row using the event's dot color — adds visual rhythm and quick product identification at a glance - ConstellationMap: hub content now uses AnimatePresence with foreignObject for smooth y-slide crossfade between products during auto-cycle and user hover
Adds a fully interactive AI streaming demo to the homepage — users type a prompt (or pick an example chip), press Run, and watch tokens stream at ~35 tok/s with live throughput, TTFT, and token-count metrics. Canned responses cover squish/inference, kyro/RAG, and the full KonjoAI stack. Status badge transitions through Awaiting → Streaming → Complete via AnimatePresence. Wires the section into page.tsx and adds "demo" to the SectionDots nav. https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
ProductMarquee: dual-row CSS-animated strip (no JS at runtime) — one row scrolls left with glyph+metric, one scrolls right with glyph+label. Placed between ActivityFeed and PhilosophySection as visual rhythm. CTASection: aurora-backed pre-footer with ScrambleText headline, two CTAs, and an animated product glyph roll that stagger-reveals on scroll. Placed between ProjectGrid and Footer for a strong close. Also adds konjo-marquee-ltr/rtl keyframes to globals.css with reduced-motion fallback. https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
Nine animated sine-wave channels (one per product) styled as a hardware oscilloscope — pure SVG-native animateTransform so the loop is always pixel-exact regardless of rendered width. Wave frequency encodes throughput density; amplitude encodes output variance. Hover any row to isolate that channel; all others dim to 0.22 opacity. Wired into page.tsx between BenchmarkSection and DesignPreview, and added "signals" to SectionDots nav. https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
ScrollProgressBar: add useSpring smooth (stiffness 200, damping 30), three-stop gradient through brand→violet→accent, and a brand-glow box-shadow; reduced-motion falls back to raw scrollYProgress. Status page: replace Stat with AnimatedStatusStat client component (count-up on viewport entry, reduced-motion safe), and use ScrambleText for the overall status heading. https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
Adds a row of product-chip filter buttons above the live feed so users can isolate events by product (slug + glyph). Clicking an active chip clears the filter. Filtered state is shown in the header line next to the paused indicator. https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
Large (~28rem) faint glyph cycles through the four Konjo values in the section background — auto-advances every 3.2s, jumps to the hovered card's glyph on mouseenter. AnimatePresence crossfade with scale + opacity; reduced-motion: watermark omitted entirely. https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
After streaming completes a fade-in 'Copy response' button appears with a konjo:toast success notification and 2s visual confirmation. Response history (last 3) slides in below the active response — shows prompt + first 60 chars of response as breadcrumbs. History panel animates height:auto in/out with AnimatePresence. https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
CSS mask-image gradient creates smooth left/right fade on both scrolling strips — standard premium marquee treatment. Uses WebkitMaskImage for Safari compatibility. https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
ProjectGrid: card hover glow and top shimmer now use color-mix with the product's metric severity color instead of a fixed brand purple — each of the 9 cards has its own distinct glow fingerprint. RecentEvents (status page): add 2px left-border accent in severity color (55% opacity), matching the ActivityFeed's visual language for consistent incident-level color coding across pages. https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
- SignalMonitor: hovering a row adds a blurred glow halo path (blur 3px, opacity 0.1) and brightens stroke (1.8 width, 0.88 opacity) vs idle (1.2, 0.5) - Footer: subtle radial violet aurora orb behind footer content for visual continuity https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
- ConstellationMap: active-node color now drives edge stroke color (was hardcoded purple); three SVG <animateMotion> particles race along each lit edge at staggered offsets - InferenceHeatmap: new 9×24 grid section showing request density per product per hour; cells fluctuate live every 2s; hover shows product + hour + % load; fully reduced-motion aware - page.tsx: InferenceHeatmap slotted between BenchmarkSection and SignalMonitor - SectionDots: added "Inference grid" dot https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
- BenchmarkSection: interactive "vs CPU / vs GPT-4o" toggle; bars animate to new widths, gain badges count-up to new values with per-badge flip animation via AnimatePresence - TokenVelocity: new section with 9 flip-digit cards (per-digit AnimatePresence vertical morph) showing live tok/s per product; jitters every 1.8s; aggregate counter in header; mini velocity bar per card - SectionDots: added "Token velocity" dot https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
- ProductLeaderboard: 9-product real-time ranking using motion layout animations; composite scores jitter every 2.2s causing visible rank changes; movement indicators (↑↓) appear on change; rank-1 gets a glow underline in product color; each row links to the product detail page - SectionDots: added "Leaderboard" dot https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
- TokenPalette: interactive swatch grid organized by category (Brand, Status, Foreground, Surface); click any swatch to copy its CSS variable name via clipboard; fires konjo:toast on copy; hover scales swatch and shows accent ring - DesignPreview: added "Design Tokens" as 6th tab; updated eyebrow to "6 sections" https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
…ples
- Add 4 selectable models: squish (42 tok/s, brand), kyro (18 tok/s, accent),
miru (29 tok/s, violet), lopi (33 tok/s, warm)
- Each model has own examples, response content, tok/s rate (drives actual stream delay),
TTFT, and color theming (model selector chip, run button, cursor, metrics)
- Stream speed now truly varies per-model: delay = 1000ms / tokPerSec
- Switching model resets state; footer link updates to /products/{model}
- History entries retain model glyph and color for context
https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
…mandPalette Adds four new global actions so users can jump directly to new live-data sections via ⌘K: Inference heatmap, Token velocity, Live leaderboard, Signal monitor https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
KonamiKonjo: listens for ↑↑↓↓←→←→ba sequence on window keydown (ignores events while focus is in form fields); triggers a full-screen glyph burst (8 product glyphs radiate outward via animateMotion) and a glass card showing 根性 (fighting spirit) with a 3.2s auto-dismiss; fully reduced-motion aware https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
Adds "Easter egg" group to the keyboard shortcuts panel showing the ↑↑↓↓←→←→ba sequence with 根性 label so curious users can discover it https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
Adds a ⊞/☰ toggle that switches the nine-product card grid into a compact sortable table (product number, name+tagline, StatusBadge, metric value, Details link); AnimatePresence fades between the two views; view mode resets to grid when filter/search changes https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
…erminal demo - KeyboardHelp: implement 1-9 (go to product by #), [ / ] (prev/next product) shortcuts that were documented but not wired up - TerminalSection: expand from 3 to 6 products (squish, kyro, vectro, kairu, kohaku, lopi); each command prompt renders in its product color; speed toggle (1× / ⚡) lets users fast-forward remaining typing without replaying; product progress strip shows completion state per product - SystemPulse: new compact live-metrics strip between hero and ticker — five aggregate KPIs (throughput, p99 latency, recalls/min, agents live, attn coverage) that jitter every 2.2 s with AnimatePresence flip transitions; honors prefers-reduced-motion https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
… products Shows a single user query routing through squish → kyro → kohaku → squish → vectro with per-stage timing, live output snippets, running/done state animations, and a total round-trip counter. Plays automatically on scroll-into-view; replay button restarts. Added 'Pipeline trace' to CommandPalette and SectionDots navigation. https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
8 chronological entries covering squish/kyro/lopi/vectro/kohaku/kairu/toki/drex; expandable detail on each entry; "Show more" reveals hidden entries; conventional commit type badges (feat/perf/fix); per-product glyph + color; glass card container. Added changelog to SectionDots and CommandPalette navigation. https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
…ard handlers - HeroParticles: draw faint connection lines between particles within 100px of each other; opacity falls off linearly with distance creating a neural-net / constellation effect behind the hero headline - KeyboardHelp: fix duplicate navigation on product pages — [ / ] now defers to ProductKeyboardNav (which adds a toast) when already on a product page; on non-product pages [ goes to last product, ] goes to first product https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
… context badges 3-turn scripted chat showing squish inference composed with kohaku memory and kyro retrieval. Each assistant response shows context badges revealing which product contributed (❖ memory / ✸ retrieval). Streams character-by-character; auto-scrolls; replay button appears on completion; honoring prefers-reduced-motion throughout. Added chat demo to SectionDots and CommandPalette navigation. https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
847 tok/s / 91.4% NDCG / 89% memory recall / 94% agent success — each counter counts up from 0 on scroll-in then pulses with jitter every 3 s using animate(). Purple radial glow backdrop. Placed before CTASection as a high-impact prelude. https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
AgentFlow.tsx shows lopi decomposing a task into parallel sub-agents (kyro retrieval, vectro compression, kohaku recall) then routing assembled context to squish for streaming generation. Animated phase state machine — auto-plays on scroll, replay on completion. ProductLeaderboard gains a hover-revealed ↑ endorse button per row: click boosts the product's score by +5 and shows a "+5" float badge that fades upward while the ranking re-sorts live. Both components added to SectionDots, CommandPalette, and page.tsx. https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
Records product slug visits in localStorage so CommandPalette can surface recently viewed products at the top of the list. https://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Sprint 4 — 40+ additions across the homepage, product pages, status page, and global layout. Every section now shows live data; the page is interactive end-to-end.
New sections (homepage)
layoutanimations; ↑↓ movement indicatorsEnhanced sections (homepage)
<animateMotion>SVG particles race along each lit edge at staggered offsetsGlobal features
Prior work (Sprint 4 early)
WelcomeBack · SectionDots · HeroParticles · CursorGlow · ToastProvider · PageTitleEffect · MagneticButton · CommandPalette global actions · FloatingDock · KeyboardHelp g-sequences · ProductCodeSnippet · ShareButton · ProductKeyboardNav · AnimatedFeatureGrid · OG images · sitemap · robots
Test plan
npm run typecheck— 0 errorsnpm test— 79/79 passnpm run build— 16 routes, no errors?→ shortcuts modal shows Easter egg groupprefers-reduced-motion→ all animations disabled, static fallbackshttps://claude.ai/code/session_01D2raHvxTxUpokiB7nLZnP9