4e:I[707087,["/_next/static/immutable/chunks/2985g-hklwiee.js","/_next/static/immutable/chunks/0qkc3dps_9x_i.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3thksmxn95rly.js","/_next/static/immutable/chunks/15bpbjna9-vr3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/0agonoz1szsjm.js","/_next/static/immutable/chunks/1ynd3dcge2kn1.js","/_next/static/immutable/chunks/0krdn-21gkgjt.js","/_next/static/immutable/chunks/0n9w9riw96l80.js","/_next/static/immutable/chunks/0w75qangey2ys.js","/_next/static/immutable/chunks/1tge7vcvsb70s.js","/_next/static/immutable/chunks/35ju_ac0ysz07.js"],"RegistryDependencies"] 4f:I[512940,["/_next/static/immutable/chunks/2985g-hklwiee.js","/_next/static/immutable/chunks/0qkc3dps_9x_i.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3thksmxn95rly.js","/_next/static/immutable/chunks/15bpbjna9-vr3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/0agonoz1szsjm.js","/_next/static/immutable/chunks/1ynd3dcge2kn1.js","/_next/static/immutable/chunks/0krdn-21gkgjt.js","/_next/static/immutable/chunks/0n9w9riw96l80.js","/_next/static/immutable/chunks/0w75qangey2ys.js","/_next/static/immutable/chunks/1tge7vcvsb70s.js","/_next/static/immutable/chunks/35ju_ac0ysz07.js"],"Installation"] 50:I[314491,["/_next/static/immutable/chunks/2985g-hklwiee.js","/_next/static/immutable/chunks/0qkc3dps_9x_i.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3thksmxn95rly.js","/_next/static/immutable/chunks/15bpbjna9-vr3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/0agonoz1szsjm.js","/_next/static/immutable/chunks/1ynd3dcge2kn1.js","/_next/static/immutable/chunks/0krdn-21gkgjt.js","/_next/static/immutable/chunks/0n9w9riw96l80.js","/_next/static/immutable/chunks/0w75qangey2ys.js","/_next/static/immutable/chunks/1tge7vcvsb70s.js","/_next/static/immutable/chunks/35ju_ac0ysz07.js"],"FilesView"] 51:T2297,"use client"; import { useRef, type ReactNode } from "react"; import { AnimatePresence, motion, useInView, useReducedMotion } from "motion/react"; import { motionStagger, motionViewport } from "@/lib/motion-tokens"; import { cn } from "@/lib/utils"; const spring = { type: "spring" as const, duration: 0.3, bounce: 0 }; export function useSeraItemVariants() { const reduceMotion = useReducedMotion(); return reduceMotion ? { hidden: { opacity: 1 }, visible: { opacity: 1 } } : { hidden: { opacity: 0, filter: "blur(4px)", y: 12 }, visible: { opacity: 1, filter: "blur(0px)", y: 0, transition: spring, }, }; } export function SeraStagger({ children, className, }: { children: ReactNode; className?: string; }) { const ref = useRef(null); const inView = useInView(ref, motionViewport); return ( {children} ); } export function SeraStaggerItem({ children, className, }: { children: ReactNode; className?: string; }) { const itemVariants = useSeraItemVariants(); return ( {children} ); } /** Word reveal — signature text motion for Sera hero/headlines. */ export function SeraRevealWord({ word, index, className, }: { word: string; index: number; className?: string; }) { const reduceMotion = useReducedMotion(); return ( {word} ); } export function SeraWordReveal({ text, className, }: { text: string; className?: string; }) { const words = text.split(" "); return ( {words.map((word, index) => ( ))} ); } /** Subtle ledger cell lift on hover. */ export function SeraHoverLift({ children, className, }: { children: ReactNode; className?: string; }) { const reduceMotion = useReducedMotion(); return ( {children} ); } /** Monochrome infinite marquee — quotes, wordmarks, rows. */ export function SeraMarquee({ children, className, duration = 42, }: { children: ReactNode; className?: string; duration?: number; }) { const reduceMotion = useReducedMotion(); return (

{children} {children}

); } /** Blur settle reveal for inverse strips and panels. */ export function SeraBlurReveal({ children, className, }: { children: ReactNode; className?: string; }) { const ref = useRef(null); const inView = useInView(ref, motionViewport); const reduceMotion = useReducedMotion(); return ( {children} ); } /** Hairline rule draws in from the left. */ export function SeraMaskRule({ className }: { className?: string }) { const ref = useRef(null); const inView = useInView(ref, motionViewport); const reduceMotion = useReducedMotion(); return ( ); } /** Sharp-corner billing toggle for Sera pricing. */ export function SeraBillingToggle({ period, onChange, layoutId = "sera-billing-pill", }: { period: "monthly" | "annual"; onChange: (period: "monthly" | "annual") => void; layoutId?: string; }) { const reduceMotion = useReducedMotion(); return (

{(["monthly", "annual"] as const).map((option) => { const isActive = period === option; return ( ); })}

); } /** Cross-fade price when billing period changes. */ export function SeraPriceReveal({ amount, className, }: { amount: string; className?: string; }) { const reduceMotion = useReducedMotion(); return ( {amount} ); } /** Menu / close icon cross-fade for Sera header mobile toggle. */ export function SeraIconToggle({ open, children, }: { open: boolean; children: [ReactNode, ReactNode]; }) { const reduceMotion = useReducedMotion(); const transition = reduceMotion ? { duration: 0 } : spring; return ( {children[0]} {children[1]} ); } /** Stagger children when mobile drawer opens. */ export function SeraDrawerStagger({ open, children, className, }: { open: boolean; children: ReactNode; className?: string; }) { const reduceMotion = useReducedMotion(); return ( {children} ); } export function SeraDrawerItem({ children, className, }: { children: ReactNode; className?: string; }) { const reduceMotion = useReducedMotion(); return ( {children} ); } 52:Te0f,"use client"; import { SectionShell, ContentRail } from "@/components/layout-contract"; import { SeraMarquee, SeraStagger, SeraStaggerItem } from "../../sera/sera-motion"; type Testimonial = { quote: string; name: string; role: string; monogram: string; }; const featuredQuote = "We rolled Sera out to four hundred people in a day. The system is so plain and precise that nobody needed training — they just started working."; const testimonials: Testimonial[] = [ { quote: "Sera replaced three tools the first week. Docs, decisions, and delivery live in one ledger, and nothing drifts out of date.", name: "Mara Ellison", role: "Head of Operations, Northwind", monogram: "ME", }, { quote: "The workspace is fast enough that we stopped thinking about it. Search returns the right record before I finish typing.", name: "Jonas Reed", role: "Engineering Lead, Aperture", monogram: "JR", }, { quote: "Every review now starts from the same source of truth. Sera turned our weekly sync from an hour into eleven minutes.", name: "Priya Anand", role: "Product Director, Meridian", monogram: "PA", }, ]; function MarqueeCard({ testimonial }: { testimonial: Testimonial }) { return (

“{testimonial.quote}”

{testimonial.monogram}

{testimonial.name}

{testimonial.role}

); } export function TestimonialsSeraSection() { const marqueeItems = [...testimonials, ...testimonials]; return (

Proof

“{featuredQuote}”

LK

Lena Kovach

Chief of Staff, Halcyon

{marqueeItems.map((testimonial, index) => ( ))}

); } 4a:["$","div",null,{"className":"flex flex-col gap-12","children":[["$","div",null,{"className":"pt-10 flex flex-col gap-4","children":[["$","ul",null,{"className":"flex gap-2 flex-wrap","children":[]}],["$","$L4e",null,{"registryDependencies":["@nusaiba/foundation","@nusaiba/theme-sera"]}]]}],["$","$L4f",null,{"sourceUrl":"https://nusaiba.dev/r/base-nova/testimonials-11.json","proxyUrl":"https://shadcnregistry.com/r/nusaiba/testimonials-11","itemId":"@nusaiba/testimonials-11"}],["$","section",null,{"className":"flex flex-col gap-4","id":"files","children":[["$","h2",null,{"className":"text-lg md:text-2xl font-bold font-mono","children":"Files"}],["$","$L50",null,{"files":[{"path":"registry/blocks/sera/sera-motion.tsx","content":"$51","type":"registry:lib"},{"path":"registry/blocks/testimonials/11/testimonials-section.tsx","content":"$52","type":"registry:component"}]}]]}],"$L53"]}]

Testimonials 11

Installation

Files

lib

components

Styles