@tanstack/create 0.49.1

package/dist/frameworks/react/examples/events/assets/src/routes/api.remy-chat.js

@@ -0,0 +1,103 @@
+import { createFileRoute } from '@tanstack/react-router';
+import { chat, maxIterations, toServerSentEventsResponse } from '@tanstack/ai';
+import { anthropicText } from '@tanstack/ai-anthropic';
+import { openaiText } from '@tanstack/ai-openai';
+import { geminiText } from '@tanstack/ai-gemini';
+import { ollamaText } from '@tanstack/ai-ollama';
+import { getSpeakerBySlug, getTalkBySlug, getAllSpeakers, getAllTalks, searchConference, } from '@/lib/conference-tools';
+export const Route = createFileRoute('/api/remy-chat')({
+    server: {
+        handlers: {
+            POST: async ({ request }) => {
+                const requestSignal = request.signal;
+                if (requestSignal.aborted) {
+                    return new Response(null, { status: 499 });
+                }
+                const abortController = new AbortController();
+                try {
+                    const body = await request.json();
+                    const { messages, speakerSlug, talkSlug } = body;
+                    const data = body.data || {};
+                    const SYSTEM_PROMPT = `You are Remy, a charming and knowledgeable culinary assistant for the Haute Pâtisserie 2026 conference in Paris. You have a warm, enthusiastic personality and deep appreciation for the art of pastry and baking.
+
+PERSONALITY:
+- Speak with warmth and a touch of French flair (occasional "magnifique!", "c'est parfait!", etc.)
+- Be genuinely passionate about pastry, bread, and culinary arts
+- Knowledgeable about techniques, ingredients, and the history of baking
+- Helpful and encouraging to both novices and professionals
+
+CAPABILITIES:
+1. Use getSpeakerBySlug to get detailed information about a specific speaker
+2. Use getTalkBySlug to get detailed information about a specific session
+3. Use getAllSpeakers to see the complete speaker lineup
+4. Use getAllTalks to see all available sessions
+5. Use searchConference to find speakers or sessions matching a topic or keyword
+
+INSTRUCTIONS:
+- When asked about the conference, speakers, or sessions, use your tools to provide accurate information
+- Help attendees find sessions that match their interests
+- Share enthusiasm about the speakers and their expertise
+- If asked about pastry techniques, you can provide general knowledge while recommending relevant sessions
+- Keep responses conversational but informative
+- When recommending sessions, explain why they might be interesting based on the user's query
+
+${speakerSlug ? `CONTEXT: The user is viewing the profile of the speaker with slug "${speakerSlug}".` : ''}
+${talkSlug ? `CONTEXT: The user is viewing the session with slug "${talkSlug}".` : ''}
+
+Remember: You are the friendly face of Haute Pâtisserie 2026. Make every attendee feel welcome and excited about the culinary journey ahead!`;
+                    // Determine the best available provider
+                    let provider = 'ollama';
+                    let model = 'mistral:7b';
+                    if (process.env.ANTHROPIC_API_KEY) {
+                        provider = 'anthropic';
+                        model = 'claude-haiku-4-5';
+                    }
+                    else if (process.env.OPENAI_API_KEY) {
+                        provider = 'openai';
+                        model = 'gpt-4o';
+                    }
+                    else if (process.env.GEMINI_API_KEY) {
+                        provider = 'gemini';
+                        model = 'gemini-2.0-flash-exp';
+                    }
+                    // Adapter factory pattern for multi-vendor support
+                    const adapterConfig = {
+                        anthropic: () => anthropicText((model || 'claude-haiku-4-5')),
+                        openai: () => openaiText((model || 'gpt-4o')),
+                        gemini: () => geminiText((model || 'gemini-2.0-flash-exp')),
+                        ollama: () => ollamaText((model || 'mistral:7b')),
+                    };
+                    const adapter = adapterConfig[provider]();
+                    const stream = chat({
+                        adapter,
+                        tools: [
+                            getSpeakerBySlug,
+                            getTalkBySlug,
+                            getAllSpeakers,
+                            getAllTalks,
+                            searchConference,
+                        ],
+                        systemPrompts: [SYSTEM_PROMPT],
+                        agentLoopStrategy: maxIterations(5),
+                        messages,
+                        abortController,
+                    });
+                    return toServerSentEventsResponse(stream, { abortController });
+                }
+                catch (error) {
+                    console.error('Remy chat error:', error);
+                    if (error.name === 'AbortError' || abortController.signal.aborted) {
+                        return new Response(null, { status: 499 });
+                    }
+                    return new Response(JSON.stringify({
+                        error: 'Failed to process chat request',
+                        message: error.message,
+                    }), {
+                        status: 500,
+                        headers: { 'Content-Type': 'application/json' },
+                    });
+                }
+            },
+        },
+    },
+});

package/dist/frameworks/react/examples/events/assets/src/routes/index.tsx

@@ -0,0 +1,192 @@
+import { createFileRoute, Link } from '@tanstack/react-router'
+import { ArrowRight, Calendar, MapPin, Users } from 'lucide-react'
+
+import { allSpeakers, allTalks } from 'content-collections'
+
+import SpeakerCard from '@/components/SpeakerCard'
+import TalkCard from '@/components/TalkCard'
+import RemyAssistant from '@/components/RemyAssistant'
+import HeroCarousel from '@/components/HeroCarousel'
+
+export const Route = createFileRoute('/')({
+  component: HomePage,
+})
+
+function HomePage() {
+  const featuredSpeakers = allSpeakers.slice(0, 3)
+  const featuredTalks = allTalks.slice(0, 4)
+
+  return (
+    <>
+      <RemyAssistant />
+      
+      {/* Hero Section */}
+      <section className="relative min-h-[90vh] flex items-center justify-center px-6 overflow-hidden">
+        {/* Background carousel */}
+        <HeroCarousel />
+
+        <div className="relative max-w-5xl mx-auto text-center z-10">
+          {/* Event date badge */}
+          <div className="inline-flex items-center gap-2 px-4 py-2 mb-8 rounded-full bg-copper/10 border border-copper/30 text-copper-light text-sm font-medium">
+            <Calendar className="w-4 h-4" />
+            <span>March 15-17, 2026</span>
+            <span className="mx-2 text-copper/40">•</span>
+            <MapPin className="w-4 h-4" />
+            <span>Paris, France</span>
+          </div>
+
+          {/* Main title */}
+          <h1 className="font-display text-6xl md:text-8xl font-bold text-cream mb-6 leading-tight">
+            Haute
+            <span className="block text-gold italic">Pâtisserie</span>
+          </h1>
+
+          <p className="text-xl md:text-2xl text-cream/70 font-body max-w-3xl mx-auto mb-10 leading-relaxed">
+            Join the world's most celebrated pastry chefs and master bakers for three extraordinary days of masterclasses, demonstrations, and culinary inspiration.
+          </p>
+
+          {/* Stats */}
+          <div className="flex flex-wrap justify-center gap-8 mb-12">
+            <div className="text-center">
+              <div className="text-4xl font-display font-bold text-gold">{allSpeakers.length}</div>
+              <div className="text-cream/50 text-sm uppercase tracking-wider">Master Chefs</div>
+            </div>
+            <div className="text-center">
+              <div className="text-4xl font-display font-bold text-gold">{allTalks.length}</div>
+              <div className="text-cream/50 text-sm uppercase tracking-wider">Sessions</div>
+            </div>
+            <div className="text-center">
+              <div className="text-4xl font-display font-bold text-gold">3</div>
+              <div className="text-cream/50 text-sm uppercase tracking-wider">Days</div>
+            </div>
+          </div>
+
+          {/* CTA buttons */}
+          <div className="flex flex-wrap justify-center gap-4">
+            <Link
+              to="/speakers"
+              className="inline-flex items-center gap-2 px-8 py-4 rounded-full bg-gradient-to-r from-copper to-copper-dark text-charcoal font-semibold text-lg transition-all hover:shadow-lg hover:shadow-copper/30 hover:scale-[1.02]"
+            >
+              <Users className="w-5 h-5" />
+              Meet Our Speakers
+            </Link>
+            <Link
+              to="/talks"
+              className="inline-flex items-center gap-2 px-8 py-4 rounded-full border-2 border-gold/50 text-gold font-semibold text-lg transition-all hover:bg-gold/10 hover:border-gold"
+            >
+              View Sessions
+              <ArrowRight className="w-5 h-5" />
+            </Link>
+          </div>
+        </div>
+      </section>
+
+      {/* Featured Speakers Section */}
+      <section className="py-20 px-6">
+        <div className="max-w-7xl mx-auto">
+          <div className="flex items-end justify-between mb-12">
+            <div>
+              <h2 className="font-display text-4xl md:text-5xl font-bold text-cream mb-3">
+                Featured <span className="text-gold italic">Speakers</span>
+              </h2>
+              <p className="text-cream/60 text-lg font-body">
+                Learn from award-winning pastry chefs and master bakers
+              </p>
+            </div>
+            <Link 
+              to="/speakers"
+              className="hidden md:inline-flex items-center gap-2 text-gold hover:text-gold/80 transition-colors font-medium"
+            >
+              View all speakers
+              <ArrowRight className="w-4 h-4" />
+            </Link>
+          </div>
+
+          <div className="grid grid-cols-1 md:grid-cols-3 gap-8">
+            {featuredSpeakers.map((speaker) => (
+              <SpeakerCard key={speaker.slug} speaker={speaker} featured />
+            ))}
+          </div>
+
+          <div className="md:hidden mt-8 text-center">
+            <Link 
+              to="/speakers"
+              className="inline-flex items-center gap-2 text-gold hover:text-gold/80 transition-colors font-medium"
+            >
+              View all speakers
+              <ArrowRight className="w-4 h-4" />
+            </Link>
+          </div>
+        </div>
+      </section>
+
+      {/* Divider */}
+      <div className="max-w-7xl mx-auto px-6">
+        <div className="h-px bg-gradient-to-r from-transparent via-border to-transparent" />
+      </div>
+
+      {/* Featured Sessions Section */}
+      <section className="py-20 px-6">
+        <div className="max-w-7xl mx-auto">
+          <div className="flex items-end justify-between mb-12">
+            <div>
+              <h2 className="font-display text-4xl md:text-5xl font-bold text-cream mb-3">
+                Featured <span className="text-gold italic">Sessions</span>
+              </h2>
+              <p className="text-cream/60 text-lg font-body">
+                Masterclasses and demonstrations to elevate your craft
+              </p>
+            </div>
+            <Link 
+              to="/talks"
+              className="hidden md:inline-flex items-center gap-2 text-gold hover:text-gold/80 transition-colors font-medium"
+            >
+              View all sessions
+              <ArrowRight className="w-4 h-4" />
+            </Link>
+          </div>
+
+          <div className="grid grid-cols-1 md:grid-cols-2 gap-8">
+            {featuredTalks.map((talk) => (
+              <TalkCard key={talk.slug} talk={talk} featured />
+            ))}
+          </div>
+
+          <div className="md:hidden mt-8 text-center">
+            <Link 
+              to="/talks"
+              className="inline-flex items-center gap-2 text-gold hover:text-gold/80 transition-colors font-medium"
+            >
+              View all sessions
+              <ArrowRight className="w-4 h-4" />
+            </Link>
+          </div>
+        </div>
+      </section>
+
+      {/* CTA Section */}
+      <section className="py-20 px-6">
+        <div className="max-w-4xl mx-auto text-center">
+          <div className="relative p-12 rounded-3xl bg-gradient-to-br from-card to-charcoal border border-border/50 overflow-hidden">
+            {/* Decorative elements */}
+            <div className="absolute top-0 right-0 w-64 h-64 bg-copper/5 rounded-full blur-3xl" />
+            <div className="absolute bottom-0 left-0 w-48 h-48 bg-gold/5 rounded-full blur-3xl" />
+            
+            <div className="relative">
+              <h2 className="font-display text-3xl md:text-4xl font-bold text-cream mb-4">
+                Ready to Elevate Your Craft?
+              </h2>
+              <p className="text-cream/60 text-lg font-body mb-8 max-w-2xl mx-auto">
+                Join us in Paris for an unforgettable experience with the world's finest pastry artisans.
+              </p>
+              <div className="inline-flex items-center gap-2 px-4 py-2 rounded-full bg-gold/10 border border-gold/30 text-gold text-sm font-medium">
+                <span>🥐</span>
+                <span>Registration opens January 2026</span>
+              </div>
+            </div>
+          </div>
+        </div>
+      </section>
+    </>
+  )
+}

package/dist/frameworks/react/examples/events/assets/src/routes/schedule.index.tsx

@@ -0,0 +1,274 @@
+import { createFileRoute, Link } from '@tanstack/react-router'
+import { Clock, Calendar, MapPin, ChevronRight } from 'lucide-react'
+import { useState } from 'react'
+
+import { allTalks, allSpeakers } from 'content-collections'
+
+import RemyAssistant from '@/components/RemyAssistant'
+
+export const Route = createFileRoute('/schedule/')({
+  component: SchedulePage,
+})
+
+// Helper to get speaker data by name
+function getSpeakerByName(name: string) {
+  return allSpeakers.find(
+    (s) => s.name.toLowerCase() === name.toLowerCase()
+  )
+}
+
+// Define the conference schedule with time slots
+const scheduleData = [
+  {
+    day: 1,
+    date: 'March 15, 2026',
+    dayName: 'Day One',
+    theme: 'French Foundations',
+    sessions: [
+      { time: '9:00 AM', talkSlug: 'french-macaron-mastery' },
+      { time: '11:30 AM', talkSlug: 'croissant-lamination-secrets' },
+      { time: '3:00 PM', talkSlug: 'the-science-of-sugar' },
+    ],
+  },
+  {
+    day: 2,
+    date: 'March 16, 2026',
+    dayName: 'Day Two',
+    theme: 'Global Traditions',
+    sessions: [
+      { time: '9:00 AM', talkSlug: 'sourdough-from-starter-to-masterpiece' },
+      { time: '11:30 AM', talkSlug: 'umami-in-pastry-east-meets-west' },
+      { time: '2:30 PM', talkSlug: 'savory-breads-of-the-mediterranean' },
+    ],
+  },
+  {
+    day: 3,
+    date: 'March 17, 2026',
+    dayName: 'Day Three',
+    theme: 'Artisan Mastery',
+    sessions: [
+      { time: '9:00 AM', talkSlug: 'the-art-of-the-perfect-tart' },
+      { time: '11:00 AM', talkSlug: 'neapolitan-pizza-tradition-meets-innovation' },
+    ],
+  },
+]
+
+function SchedulePage() {
+  const [selectedDay, setSelectedDay] = useState(1)
+
+  const currentDayData = scheduleData.find((d) => d.day === selectedDay)!
+
+  return (
+    <>
+      <RemyAssistant />
+      <div className="min-h-screen">
+        {/* Hero section */}
+        <div className="relative py-16 px-6">
+          <div className="max-w-7xl mx-auto text-center">
+            <div className="inline-flex items-center gap-2 px-4 py-2 mb-6 rounded-full bg-copper/10 border border-copper/30 text-copper-light text-sm font-medium">
+              <Calendar className="w-4 h-4" />
+              <span>March 15-17, 2026</span>
+              <span className="mx-2 text-copper/40">•</span>
+              <MapPin className="w-4 h-4" />
+              <span>Paris, France</span>
+            </div>
+            <h1 className="font-display text-5xl md:text-6xl font-bold text-cream mb-4">
+              Conference <span className="text-gold italic">Schedule</span>
+            </h1>
+            <p className="text-xl text-cream/70 max-w-2xl mx-auto font-body">
+              Three days of masterclasses, demonstrations, and culinary inspiration from the world's finest pastry artisans.
+            </p>
+          </div>
+        </div>
+
+        {/* Day selector tabs */}
+        <div className="max-w-7xl mx-auto px-6 mb-12">
+          <div className="flex justify-center">
+            <div className="inline-flex bg-card/50 rounded-2xl p-2 border border-border/50">
+              {scheduleData.map((day) => (
+                <button
+                  key={day.day}
+                  onClick={() => setSelectedDay(day.day)}
+                  className={`relative px-8 py-4 rounded-xl font-display font-semibold transition-all duration-300 ${
+                    selectedDay === day.day
+                      ? 'bg-gradient-to-br from-copper to-copper-dark text-charcoal shadow-lg shadow-copper/20'
+                      : 'text-cream/70 hover:text-cream hover:bg-card'
+                  }`}
+                >
+                  <span className="block text-xs uppercase tracking-wider opacity-75">
+                    {day.dayName}
+                  </span>
+                  <span className="block text-lg">{day.date.split(',')[0].split(' ').slice(0, 2).join(' ')}</span>
+                </button>
+              ))}
+            </div>
+          </div>
+        </div>
+
+        {/* Day theme header */}
+        <div className="max-w-7xl mx-auto px-6 mb-8">
+          <div className="text-center">
+            <h2 className="font-display text-3xl font-bold text-cream mb-2">
+              {currentDayData.dayName}: <span className="text-gold italic">{currentDayData.theme}</span>
+            </h2>
+            <p className="text-cream/50 font-body">{currentDayData.date}</p>
+          </div>
+        </div>
+
+        {/* Schedule timeline */}
+        <div className="max-w-5xl mx-auto px-6 pb-20">
+          <div className="relative">
+            {/* Timeline line */}
+            <div className="absolute left-8 md:left-12 top-0 bottom-0 w-px bg-gradient-to-b from-copper via-gold to-copper/30" />
+
+            {/* Sessions */}
+            <div className="space-y-8">
+              {currentDayData.sessions.map((session, index) => {
+                const talk = allTalks.find((t) => t.slug === session.talkSlug)
+                if (!talk) return null
+
+                const speaker = getSpeakerByName(talk.speaker)
+
+                return (
+                  <Link
+                    key={session.talkSlug}
+                    to={`/talks/${talk.slug}`}
+                    className="group block"
+                  >
+                    <div className="relative flex gap-6 md:gap-10">
+                      {/* Time marker */}
+                      <div className="flex-shrink-0 w-16 md:w-24 pt-6">
+                        <div className="relative">
+                          {/* Timeline dot */}
+                          <div className="absolute -right-[13px] md:-right-[17px] top-0 w-6 h-6 rounded-full bg-charcoal border-2 border-gold flex items-center justify-center group-hover:border-copper group-hover:scale-110 transition-all">
+                            <div className="w-2 h-2 rounded-full bg-gold group-hover:bg-copper transition-colors" />
+                          </div>
+                          <span className="block text-right text-sm md:text-base font-display font-semibold text-copper-light">
+                            {session.time}
+                          </span>
+                        </div>
+                      </div>
+
+                      {/* Session card */}
+                      <div
+                        className="flex-1 relative overflow-hidden rounded-2xl bg-card border border-border/50 
+                          group-hover:border-gold/50 transition-all duration-300 group-hover:shadow-xl group-hover:shadow-gold/5
+                          group-hover:-translate-y-1"
+                        style={{
+                          animationDelay: `${index * 100}ms`,
+                        }}
+                      >
+                        {/* Background image with overlay */}
+                        <div className="absolute inset-0">
+                          <img
+                            src={`/${talk.image}`}
+                            alt={talk.title}
+                            className="w-full h-full object-cover opacity-30 group-hover:opacity-40 group-hover:scale-105 transition-all duration-500"
+                          />
+                          <div className="absolute inset-0 bg-gradient-to-r from-charcoal via-charcoal/95 to-charcoal/80" />
+                        </div>
+
+                        {/* Content */}
+                        <div className="relative p-6 md:p-8 flex flex-col md:flex-row gap-6 items-start">
+                          {/* Speaker image */}
+                          {speaker && (
+                            <div className="flex-shrink-0">
+                              <div className="relative w-20 h-20 md:w-24 md:h-24 rounded-xl overflow-hidden border-2 border-gold/30 group-hover:border-gold/60 transition-colors shadow-lg">
+                                <img
+                                  src={`/${speaker.headshot}`}
+                                  alt={speaker.name}
+                                  className="w-full h-full object-cover"
+                                />
+                                <div className="absolute inset-0 bg-gradient-to-t from-charcoal/40 to-transparent" />
+                              </div>
+                            </div>
+                          )}
+
+                          {/* Talk info */}
+                          <div className="flex-1 min-w-0">
+                            {/* Topics */}
+                            <div className="flex flex-wrap gap-2 mb-3">
+                              {talk.topics.slice(0, 3).map((topic) => (
+                                <span
+                                  key={topic}
+                                  className="px-2.5 py-0.5 text-xs font-medium tracking-wide uppercase bg-gold/10 text-gold border border-gold/20 rounded-full"
+                                >
+                                  {topic}
+                                </span>
+                              ))}
+                            </div>
+
+                            {/* Title */}
+                            <h3 className="font-display text-xl md:text-2xl font-semibold text-cream group-hover:text-gold transition-colors mb-2 leading-tight">
+                              {talk.title}
+                            </h3>
+
+                            {/* Speaker & Duration */}
+                            <div className="flex flex-wrap items-center gap-4 text-cream/60 text-sm mb-3">
+                              <span className="font-medium text-copper-light">
+                                {talk.speaker}
+                              </span>
+                              <div className="flex items-center gap-1.5">
+                                <Clock className="w-3.5 h-3.5" />
+                                <span>{talk.duration}</span>
+                              </div>
+                            </div>
+
+                            {/* Speaker title if available */}
+                            {speaker && (
+                              <p className="text-cream/50 text-sm font-body">
+                                {speaker.title} at {speaker.restaurant}
+                              </p>
+                            )}
+                          </div>
+
+                          {/* Arrow indicator */}
+                          <div className="flex-shrink-0 self-center">
+                            <div className="w-10 h-10 rounded-full bg-gold/10 border border-gold/20 flex items-center justify-center group-hover:bg-gold/20 group-hover:border-gold/40 transition-all">
+                              <ChevronRight className="w-5 h-5 text-gold group-hover:translate-x-0.5 transition-transform" />
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </Link>
+                )
+              })}
+            </div>
+          </div>
+        </div>
+
+        {/* Bottom CTA */}
+        <div className="max-w-4xl mx-auto px-6 pb-20">
+          <div className="relative p-8 md:p-12 rounded-3xl bg-gradient-to-br from-card to-charcoal border border-border/50 overflow-hidden text-center">
+            <div className="absolute top-0 right-0 w-64 h-64 bg-copper/5 rounded-full blur-3xl" />
+            <div className="absolute bottom-0 left-0 w-48 h-48 bg-gold/5 rounded-full blur-3xl" />
+            
+            <div className="relative">
+              <h3 className="font-display text-2xl md:text-3xl font-bold text-cream mb-3">
+                Don't Miss a Single Session
+              </h3>
+              <p className="text-cream/60 font-body mb-6 max-w-xl mx-auto">
+                Each masterclass offers hands-on learning from the world's finest pastry artisans.
+              </p>
+              <div className="flex flex-wrap justify-center gap-4">
+                <Link
+                  to="/talks"
+                  className="inline-flex items-center gap-2 px-6 py-3 rounded-full bg-gradient-to-r from-copper to-copper-dark text-charcoal font-semibold transition-all hover:shadow-lg hover:shadow-copper/30 hover:scale-[1.02]"
+                >
+                  Browse All Sessions
+                </Link>
+                <Link
+                  to="/speakers"
+                  className="inline-flex items-center gap-2 px-6 py-3 rounded-full border-2 border-gold/50 text-gold font-semibold transition-all hover:bg-gold/10 hover:border-gold"
+                >
+                  Meet the Speakers
+                </Link>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </>
+  )
+}