4f:I[707087,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"RegistryDependencies"] 50:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 51:T15cc,import { useState } from 'react' import { Avatar } from '../avatar' import { IconButton } from '../Button' import { Icon } from '../Icon' import { Grid, Row, Stack } from '../layout' import { Badge, Blob } from '../media' import { Segmented } from '../Segmented' import { Card } from '../surface' import { Eyebrow, Heading, Text } from '../text' interface Story { id: string group: 'Design' | 'Engineering' | 'Founders' quote: string name: string role: string result: string tone: 'purple' | 'pink' | 'blue' | 'mint' } const STORIES: Story[] = [ { id: 'ada', group: 'Design', quote: 'The depth system gave every interaction a physical answer. Our prototypes finally felt like the product.', name: 'Ada L.', role: 'Design director, Looma', result: '2× faster prototyping', tone: 'purple', }, { id: 'grace', group: 'Engineering', quote: 'Closed variants stopped one-off styling at the source. The team ships changes without a cleanup week afterward.', name: 'Grace H.', role: 'Staff engineer, Relay', result: '41% less UI churn', tone: 'blue', }, { id: 'maya', group: 'Founders', quote: 'We launched with a real personality instead of another grey dashboard. Customers remembered us.', name: 'Maya B.', role: 'Founder, Pollen', result: '18% higher activation', tone: 'pink', }, { id: 'alan', group: 'Engineering', quote: 'The components are strict in the useful places and editable everywhere else. That balance is rare.', name: 'Alan T.', role: 'Engineering lead, Tally', result: '6 routes in 9 days', tone: 'mint', }, ] const FILTERS = ['All', 'Design', 'Engineering', 'Founders'] as const type Filter = (typeof FILTERS)[number] /** A filterable testimonial section with keyboard-friendly carousel controls. */ export function TestimonialsBlock() { const [filter, setFilter] = useState('All') const [index, setIndex] = useState(0) const shown = filter === 'All' ? STORIES : STORIES.filter((story) => story.group === filter) const story = shown[index % shown.length]! const changeFilter = (next: Filter) => { setFilter(next) setIndex(0) } const move = (direction: 1 | -1) => { setIndex((current) => (current + direction + shown.length) % shown.length) } return (

Customer stories Loved by teams with taste. 4.9 average rating ({ value, label: value }))} />

{story.group}

{story.quote}

{story.name} {story.role} } label="Previous story" onClick={() => move(-1)} /> } label="Next story" onClick={() => move(1)} />

Reported outcome {story.result} Story {index % shown.length + 1} of {shown.length} {shown.map((item, itemIndex) => (

) } 4e:["$","div",null,{"className":"mt-3 flex min-h-0 min-w-0 flex-1 flex-col gap-3","children":[["$","div",null,{"className":"flex shrink-0 items-start gap-3","children":[["$","div",null,{"className":"flex max-h-28 min-w-0 flex-1 flex-wrap items-center gap-2 overflow-y-auto","children":[null,["$","$L4f",null,{"namespace":"@1st-pouf","registryDependencies":["https://1st-pouf.worksonmy.dev/r/avatar.json","https://1st-pouf.worksonmy.dev/r/base.json","https://1st-pouf.worksonmy.dev/r/button.json","https://1st-pouf.worksonmy.dev/r/icon.json","https://1st-pouf.worksonmy.dev/r/layout.json","https://1st-pouf.worksonmy.dev/r/media.json","https://1st-pouf.worksonmy.dev/r/segmented.json","https://1st-pouf.worksonmy.dev/r/surface.json","https://1st-pouf.worksonmy.dev/r/text.json"]}]]}],null]}],["$","$L50",null,{"files":[{"path":"registry/pouf/blocks/testimonials.tsx","content":"$51","type":"registry:block","target":"components/pouf/blocks/testimonials.tsx"}],"className":"h-[70svh] min-h-80"}]]}]