"use client"; import React, { useState, useEffect, useCallback } from "react"; import { motion, AnimatePresence } from "framer-motion"; import { Play, Pause, ChevronLeft, ChevronRight, Quote, Verified, Clock, ShieldCheck } from "lucide-react"; const REVIEWS = [ { id: "rev-01", content: "The scalability of this architecture is unprecedented. We integrated the V3 components into our core banking platform and the performance metrics remained stable under massive load.", author: "Dominic Sorel", role: "Chief Architect", company: "Global Finance Corp", avatar: "https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?auto=format&fit=crop&q=80&w=150&h=150", time: "2m ago" }, { id: "rev-02", content: "Design consistency was our biggest bottleneck until we adopted this suite. The clean code quality allowed our design team to finally speak the same language as our developers.", author: "Elena Vance", role: "Design Systems Lead", company: "Aether Systems", avatar: "https://images.unsplash.com/photo-1494790108377-be9c29b29330?auto=format&fit=crop&q=80&w=150&h=150", time: "15m ago" }, { id: "rev-03", content: "Beyond the visual fidelity, the accessibility and semantic structure are world-class. It’s rare to find a library that values inclusive design as much as it values high-end animations.", author: "Marcus Thorne", role: "Senior UX Engineer", company: "Inclusive Web", avatar: "https://images.unsplash.com/photo-1500648767791-00dcc994a43e?auto=format&fit=crop&q=80&w=150&h=150", time: "1h ago" } ]; const AUTO_PLAY_DURATION = 8000; export default function QuantumNarrativePlayer() { const [currentIndex, setCurrentIndex] = useState(0); const [isPaused, setIsPaused] = useState(false); const [isMounted, setIsMounted] = useState(false); useEffect(() => setIsMounted(true), []); const handleNext = useCallback(() => { setCurrentIndex((prev) => (prev + 1) % REVIEWS.length); }, []); const handlePrev = () => { setCurrentIndex((prev) => (prev - 1 + REVIEWS.length) % REVIEWS.length); }; useEffect(() => { if (isPaused) return; const interval = setInterval(handleNext, AUTO_PLAY_DURATION); return () => clearInterval(interval); }, [handleNext, isPaused, currentIndex]); if (!isMounted) return null; const current = REVIEWS[currentIndex]; return (

{/* Dynamic Ambient Background (Adaptive) */}

setIsPaused(true)} onMouseLeave={() => setIsPaused(false)} > {/* Segmented Progress Tracker */}

{REVIEWS.map((_, idx) => (

{idx === currentIndex && ( )} {idx < currentIndex &&

}

))}

{/* Main Content Pane */}

Verified Identity

"{current.content}"

{current.time}

Series V3

{/* Sidebar Pane: Author & Navigation */}

{current.author}

{current.role}

{current.company}

{/* Interaction Cluster */}

{/* Decorative System Footer */}

Architecture V3.0 Hybrid

State Verified Identity

UIX-AUTH: VERIFIED_PAYLOAD

); }