Getting Started
Templates
Components
Blocks
TestimonialsSplitTabs| Prop | Type | Default | Description |
|---|---|---|---|
items | TestimonialSplitTabItem[] | — | Testimonial items to display |
defaultActive | number | 0 | Default active tab index |
hoverToActivate | boolean | true | If true, hovering changes the active tab (desktop). Clicking always works. |
showGrid | boolean | true | Show subtle background grid |
label | string | "Testimonials" | Header label for the component |
desktopHeightClass | string | "md:h-[520px]" | Height class on desktop |
mobileCollapsedHeightClass | string | "h-[110px]" | Collapsed height class on mobile |
mobileExpandedHeightClass | string | "h-[420px]" | Expanded height class on mobile |
expandedFlexClass | string | "md:flex-[7]" | Flex width for expanded tab on desktop |
collapsedFlexClass | string | "md:flex-[1.15]" | Flex width for collapsed tabs on desktop |
onActiveChange | (index: number) => void | undefined | Callback when active tab changes |
TestimonialSplitTabItem| Prop | Type | Default | Description |
|---|---|---|---|
id | string | number | — | Unique id for the testimonial |
image | string | — | Image URL shown in collapsed and expanded states |
alt | string | undefined | Alt text for the image |
eyebrow | string | undefined | Small label shown in the expanded content panel |
quote | string | — | Quote text (shown only when expanded) |
author | string | — | Author name |
role | string | undefined | Author role |
company | string | undefined | Author company |