@opensite/ui 2.8.4 → 2.8.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/registry.cjs +169 -98
- package/dist/registry.js +169 -98
- package/dist/testimonials-scrolling-columns.cjs +21 -16
- package/dist/testimonials-scrolling-columns.d.cts +5 -1
- package/dist/testimonials-scrolling-columns.d.ts +5 -1
- package/dist/testimonials-scrolling-columns.js +21 -16
- package/dist/testimonials-simple-grid.cjs +61 -47
- package/dist/testimonials-simple-grid.d.cts +5 -1
- package/dist/testimonials-simple-grid.d.ts +5 -1
- package/dist/testimonials-simple-grid.js +61 -47
- package/dist/testimonials-slider-minimal.cjs +22 -7
- package/dist/testimonials-slider-minimal.d.cts +5 -1
- package/dist/testimonials-slider-minimal.d.ts +5 -1
- package/dist/testimonials-slider-minimal.js +22 -7
- package/dist/testimonials-split-image.cjs +16 -3
- package/dist/testimonials-split-image.d.cts +5 -1
- package/dist/testimonials-split-image.d.ts +5 -1
- package/dist/testimonials-split-image.js +16 -3
- package/dist/testimonials-stats-header.cjs +20 -5
- package/dist/testimonials-stats-header.d.cts +5 -1
- package/dist/testimonials-stats-header.d.ts +5 -1
- package/dist/testimonials-stats-header.js +20 -5
- package/dist/testimonials-wall-compact.cjs +29 -20
- package/dist/testimonials-wall-compact.d.cts +5 -1
- package/dist/testimonials-wall-compact.d.ts +5 -1
- package/dist/testimonials-wall-compact.js +29 -20
- package/package.json +1 -1
|
@@ -493,7 +493,8 @@ function TestimonialsSimpleGrid({
|
|
|
493
493
|
quoteClassName,
|
|
494
494
|
authorClassName,
|
|
495
495
|
background,
|
|
496
|
-
|
|
496
|
+
containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
|
|
497
|
+
spacing = "xl",
|
|
497
498
|
pattern,
|
|
498
499
|
patternOpacity
|
|
499
500
|
}) {
|
|
@@ -507,49 +508,70 @@ function TestimonialsSimpleGrid({
|
|
|
507
508
|
if (typeof testimonial.author === "string") return testimonial.author;
|
|
508
509
|
return "";
|
|
509
510
|
}, []);
|
|
510
|
-
const getAvatarSrc = React.useCallback(
|
|
511
|
-
|
|
512
|
-
|
|
511
|
+
const getAvatarSrc = React.useCallback(
|
|
512
|
+
(testimonial) => {
|
|
513
|
+
return testimonial.avatarSrc || testimonial.avatar?.src;
|
|
514
|
+
},
|
|
515
|
+
[]
|
|
516
|
+
);
|
|
513
517
|
const getInitials = React.useCallback((name) => {
|
|
514
518
|
return name.split(" ").map((n) => n[0]).join("");
|
|
515
519
|
}, []);
|
|
516
520
|
const renderedTestimonials = React.useMemo(() => {
|
|
517
521
|
if (testimonialsSlot) return testimonialsSlot;
|
|
518
522
|
if (!testimonials || testimonials.length === 0) return null;
|
|
519
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
520
|
-
|
|
521
|
-
|
|
522
|
-
|
|
523
|
-
|
|
524
|
-
|
|
525
|
-
|
|
526
|
-
|
|
527
|
-
|
|
528
|
-
|
|
529
|
-
|
|
530
|
-
|
|
531
|
-
|
|
532
|
-
|
|
533
|
-
|
|
534
|
-
|
|
535
|
-
|
|
536
|
-
|
|
537
|
-
|
|
538
|
-
|
|
539
|
-
|
|
540
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
541
|
-
|
|
542
|
-
|
|
543
|
-
|
|
544
|
-
|
|
545
|
-
|
|
546
|
-
|
|
523
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
524
|
+
"div",
|
|
525
|
+
{
|
|
526
|
+
className: cn("grid gap-6", gridCols[effectiveColumns], gridClassName),
|
|
527
|
+
children: testimonials.map((testimonial, index) => {
|
|
528
|
+
const authorName = getAuthorName(testimonial);
|
|
529
|
+
const avatarSrc = getAvatarSrc(testimonial);
|
|
530
|
+
return /* @__PURE__ */ jsxRuntime.jsx(Card, { className: cardClassName, children: /* @__PURE__ */ jsxRuntime.jsxs(CardContent, { className: "p-6", children: [
|
|
531
|
+
testimonial.quote && (typeof testimonial.quote === "string" ? /* @__PURE__ */ jsxRuntime.jsxs(
|
|
532
|
+
"p",
|
|
533
|
+
{
|
|
534
|
+
className: cn(
|
|
535
|
+
"mb-6 text-sm leading-relaxed ",
|
|
536
|
+
quoteClassName
|
|
537
|
+
),
|
|
538
|
+
children: [
|
|
539
|
+
"\u201C",
|
|
540
|
+
testimonial.quote,
|
|
541
|
+
"\u201D"
|
|
542
|
+
]
|
|
543
|
+
}
|
|
544
|
+
) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mb-6", quoteClassName), children: testimonial.quote })),
|
|
545
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex items-center gap-3", authorClassName), children: [
|
|
546
|
+
/* @__PURE__ */ jsxRuntime.jsxs(Avatar, { className: "size-10", children: [
|
|
547
|
+
/* @__PURE__ */ jsxRuntime.jsx(AvatarImage, { src: avatarSrc, alt: authorName }),
|
|
548
|
+
/* @__PURE__ */ jsxRuntime.jsx(AvatarFallback, { children: getInitials(authorName) })
|
|
549
|
+
] }),
|
|
550
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
551
|
+
testimonial.author && (typeof testimonial.author === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium", children: testimonial.author }) : testimonial.author),
|
|
552
|
+
/* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-xs ", children: [
|
|
553
|
+
testimonial.role && (typeof testimonial.role === "string" ? testimonial.role : null),
|
|
554
|
+
testimonial.company && (typeof testimonial.company === "string" ? `, ${testimonial.company}` : null)
|
|
555
|
+
] })
|
|
556
|
+
] })
|
|
547
557
|
] })
|
|
548
|
-
] })
|
|
549
|
-
|
|
550
|
-
|
|
551
|
-
|
|
552
|
-
}, [
|
|
558
|
+
] }) }, index);
|
|
559
|
+
})
|
|
560
|
+
}
|
|
561
|
+
);
|
|
562
|
+
}, [
|
|
563
|
+
testimonialsSlot,
|
|
564
|
+
gridCols,
|
|
565
|
+
effectiveColumns,
|
|
566
|
+
gridClassName,
|
|
567
|
+
testimonials,
|
|
568
|
+
cardClassName,
|
|
569
|
+
quoteClassName,
|
|
570
|
+
authorClassName,
|
|
571
|
+
getAuthorName,
|
|
572
|
+
getAvatarSrc,
|
|
573
|
+
getInitials
|
|
574
|
+
]);
|
|
553
575
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
554
576
|
Section,
|
|
555
577
|
{
|
|
@@ -558,6 +580,7 @@ function TestimonialsSimpleGrid({
|
|
|
558
580
|
pattern,
|
|
559
581
|
patternOpacity,
|
|
560
582
|
className,
|
|
583
|
+
containerClassName,
|
|
561
584
|
children: [
|
|
562
585
|
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
563
586
|
"div",
|
|
@@ -574,16 +597,7 @@ function TestimonialsSimpleGrid({
|
|
|
574
597
|
children: heading
|
|
575
598
|
}
|
|
576
599
|
) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: headingClassName, children: heading })),
|
|
577
|
-
description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
578
|
-
"p",
|
|
579
|
-
{
|
|
580
|
-
className: cn(
|
|
581
|
-
"mt-4 text-lg text-muted-foreground",
|
|
582
|
-
descriptionClassName
|
|
583
|
-
),
|
|
584
|
-
children: description
|
|
585
|
-
}
|
|
586
|
-
) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mt-4", descriptionClassName), children: description }))
|
|
600
|
+
description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("mt-4 text-lg ", descriptionClassName), children: description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mt-4", descriptionClassName), children: description }))
|
|
587
601
|
]
|
|
588
602
|
}
|
|
589
603
|
),
|
|
@@ -76,6 +76,10 @@ interface TestimonialsSimpleGridProps {
|
|
|
76
76
|
* Pattern overlay opacity (0-1)
|
|
77
77
|
*/
|
|
78
78
|
patternOpacity?: number;
|
|
79
|
+
/**
|
|
80
|
+
* Additional CSS classes for the container
|
|
81
|
+
*/
|
|
82
|
+
containerClassName?: string;
|
|
79
83
|
}
|
|
80
84
|
/**
|
|
81
85
|
* TestimonialsSimpleGrid - A clean, straightforward grid of testimonial cards with
|
|
@@ -104,6 +108,6 @@ interface TestimonialsSimpleGridProps {
|
|
|
104
108
|
* />
|
|
105
109
|
* ```
|
|
106
110
|
*/
|
|
107
|
-
declare function TestimonialsSimpleGrid({ testimonials, testimonialsSlot, heading, description, columns, className, headerClassName, headingClassName, descriptionClassName, gridClassName, cardClassName, quoteClassName, authorClassName, background, spacing, pattern, patternOpacity, }: TestimonialsSimpleGridProps): React.JSX.Element;
|
|
111
|
+
declare function TestimonialsSimpleGrid({ testimonials, testimonialsSlot, heading, description, columns, className, headerClassName, headingClassName, descriptionClassName, gridClassName, cardClassName, quoteClassName, authorClassName, background, containerClassName, spacing, pattern, patternOpacity, }: TestimonialsSimpleGridProps): React.JSX.Element;
|
|
108
112
|
|
|
109
113
|
export { TestimonialsSimpleGrid, type TestimonialsSimpleGridProps };
|
|
@@ -76,6 +76,10 @@ interface TestimonialsSimpleGridProps {
|
|
|
76
76
|
* Pattern overlay opacity (0-1)
|
|
77
77
|
*/
|
|
78
78
|
patternOpacity?: number;
|
|
79
|
+
/**
|
|
80
|
+
* Additional CSS classes for the container
|
|
81
|
+
*/
|
|
82
|
+
containerClassName?: string;
|
|
79
83
|
}
|
|
80
84
|
/**
|
|
81
85
|
* TestimonialsSimpleGrid - A clean, straightforward grid of testimonial cards with
|
|
@@ -104,6 +108,6 @@ interface TestimonialsSimpleGridProps {
|
|
|
104
108
|
* />
|
|
105
109
|
* ```
|
|
106
110
|
*/
|
|
107
|
-
declare function TestimonialsSimpleGrid({ testimonials, testimonialsSlot, heading, description, columns, className, headerClassName, headingClassName, descriptionClassName, gridClassName, cardClassName, quoteClassName, authorClassName, background, spacing, pattern, patternOpacity, }: TestimonialsSimpleGridProps): React.JSX.Element;
|
|
111
|
+
declare function TestimonialsSimpleGrid({ testimonials, testimonialsSlot, heading, description, columns, className, headerClassName, headingClassName, descriptionClassName, gridClassName, cardClassName, quoteClassName, authorClassName, background, containerClassName, spacing, pattern, patternOpacity, }: TestimonialsSimpleGridProps): React.JSX.Element;
|
|
108
112
|
|
|
109
113
|
export { TestimonialsSimpleGrid, type TestimonialsSimpleGridProps };
|
|
@@ -468,7 +468,8 @@ function TestimonialsSimpleGrid({
|
|
|
468
468
|
quoteClassName,
|
|
469
469
|
authorClassName,
|
|
470
470
|
background,
|
|
471
|
-
|
|
471
|
+
containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
|
|
472
|
+
spacing = "xl",
|
|
472
473
|
pattern,
|
|
473
474
|
patternOpacity
|
|
474
475
|
}) {
|
|
@@ -482,49 +483,70 @@ function TestimonialsSimpleGrid({
|
|
|
482
483
|
if (typeof testimonial.author === "string") return testimonial.author;
|
|
483
484
|
return "";
|
|
484
485
|
}, []);
|
|
485
|
-
const getAvatarSrc = useCallback(
|
|
486
|
-
|
|
487
|
-
|
|
486
|
+
const getAvatarSrc = useCallback(
|
|
487
|
+
(testimonial) => {
|
|
488
|
+
return testimonial.avatarSrc || testimonial.avatar?.src;
|
|
489
|
+
},
|
|
490
|
+
[]
|
|
491
|
+
);
|
|
488
492
|
const getInitials = useCallback((name) => {
|
|
489
493
|
return name.split(" ").map((n) => n[0]).join("");
|
|
490
494
|
}, []);
|
|
491
495
|
const renderedTestimonials = useMemo(() => {
|
|
492
496
|
if (testimonialsSlot) return testimonialsSlot;
|
|
493
497
|
if (!testimonials || testimonials.length === 0) return null;
|
|
494
|
-
return /* @__PURE__ */ jsx(
|
|
495
|
-
|
|
496
|
-
|
|
497
|
-
|
|
498
|
-
|
|
499
|
-
|
|
500
|
-
|
|
501
|
-
|
|
502
|
-
|
|
503
|
-
|
|
504
|
-
|
|
505
|
-
|
|
506
|
-
|
|
507
|
-
|
|
508
|
-
|
|
509
|
-
|
|
510
|
-
|
|
511
|
-
|
|
512
|
-
|
|
513
|
-
|
|
514
|
-
|
|
515
|
-
/* @__PURE__ */ jsx(
|
|
516
|
-
|
|
517
|
-
|
|
518
|
-
|
|
519
|
-
|
|
520
|
-
|
|
521
|
-
|
|
498
|
+
return /* @__PURE__ */ jsx(
|
|
499
|
+
"div",
|
|
500
|
+
{
|
|
501
|
+
className: cn("grid gap-6", gridCols[effectiveColumns], gridClassName),
|
|
502
|
+
children: testimonials.map((testimonial, index) => {
|
|
503
|
+
const authorName = getAuthorName(testimonial);
|
|
504
|
+
const avatarSrc = getAvatarSrc(testimonial);
|
|
505
|
+
return /* @__PURE__ */ jsx(Card, { className: cardClassName, children: /* @__PURE__ */ jsxs(CardContent, { className: "p-6", children: [
|
|
506
|
+
testimonial.quote && (typeof testimonial.quote === "string" ? /* @__PURE__ */ jsxs(
|
|
507
|
+
"p",
|
|
508
|
+
{
|
|
509
|
+
className: cn(
|
|
510
|
+
"mb-6 text-sm leading-relaxed ",
|
|
511
|
+
quoteClassName
|
|
512
|
+
),
|
|
513
|
+
children: [
|
|
514
|
+
"\u201C",
|
|
515
|
+
testimonial.quote,
|
|
516
|
+
"\u201D"
|
|
517
|
+
]
|
|
518
|
+
}
|
|
519
|
+
) : /* @__PURE__ */ jsx("div", { className: cn("mb-6", quoteClassName), children: testimonial.quote })),
|
|
520
|
+
/* @__PURE__ */ jsxs("div", { className: cn("flex items-center gap-3", authorClassName), children: [
|
|
521
|
+
/* @__PURE__ */ jsxs(Avatar, { className: "size-10", children: [
|
|
522
|
+
/* @__PURE__ */ jsx(AvatarImage, { src: avatarSrc, alt: authorName }),
|
|
523
|
+
/* @__PURE__ */ jsx(AvatarFallback, { children: getInitials(authorName) })
|
|
524
|
+
] }),
|
|
525
|
+
/* @__PURE__ */ jsxs("div", { children: [
|
|
526
|
+
testimonial.author && (typeof testimonial.author === "string" ? /* @__PURE__ */ jsx("p", { className: "text-sm font-medium", children: testimonial.author }) : testimonial.author),
|
|
527
|
+
/* @__PURE__ */ jsxs("p", { className: "text-xs ", children: [
|
|
528
|
+
testimonial.role && (typeof testimonial.role === "string" ? testimonial.role : null),
|
|
529
|
+
testimonial.company && (typeof testimonial.company === "string" ? `, ${testimonial.company}` : null)
|
|
530
|
+
] })
|
|
531
|
+
] })
|
|
522
532
|
] })
|
|
523
|
-
] })
|
|
524
|
-
|
|
525
|
-
|
|
526
|
-
|
|
527
|
-
}, [
|
|
533
|
+
] }) }, index);
|
|
534
|
+
})
|
|
535
|
+
}
|
|
536
|
+
);
|
|
537
|
+
}, [
|
|
538
|
+
testimonialsSlot,
|
|
539
|
+
gridCols,
|
|
540
|
+
effectiveColumns,
|
|
541
|
+
gridClassName,
|
|
542
|
+
testimonials,
|
|
543
|
+
cardClassName,
|
|
544
|
+
quoteClassName,
|
|
545
|
+
authorClassName,
|
|
546
|
+
getAuthorName,
|
|
547
|
+
getAvatarSrc,
|
|
548
|
+
getInitials
|
|
549
|
+
]);
|
|
528
550
|
return /* @__PURE__ */ jsxs(
|
|
529
551
|
Section,
|
|
530
552
|
{
|
|
@@ -533,6 +555,7 @@ function TestimonialsSimpleGrid({
|
|
|
533
555
|
pattern,
|
|
534
556
|
patternOpacity,
|
|
535
557
|
className,
|
|
558
|
+
containerClassName,
|
|
536
559
|
children: [
|
|
537
560
|
/* @__PURE__ */ jsxs(
|
|
538
561
|
"div",
|
|
@@ -549,16 +572,7 @@ function TestimonialsSimpleGrid({
|
|
|
549
572
|
children: heading
|
|
550
573
|
}
|
|
551
574
|
) : /* @__PURE__ */ jsx("div", { className: headingClassName, children: heading })),
|
|
552
|
-
description && (typeof description === "string" ? /* @__PURE__ */ jsx(
|
|
553
|
-
"p",
|
|
554
|
-
{
|
|
555
|
-
className: cn(
|
|
556
|
-
"mt-4 text-lg text-muted-foreground",
|
|
557
|
-
descriptionClassName
|
|
558
|
-
),
|
|
559
|
-
children: description
|
|
560
|
-
}
|
|
561
|
-
) : /* @__PURE__ */ jsx("div", { className: cn("mt-4", descriptionClassName), children: description }))
|
|
575
|
+
description && (typeof description === "string" ? /* @__PURE__ */ jsx("p", { className: cn("mt-4 text-lg ", descriptionClassName), children: description }) : /* @__PURE__ */ jsx("div", { className: cn("mt-4", descriptionClassName), children: description }))
|
|
562
576
|
]
|
|
563
577
|
}
|
|
564
578
|
),
|
|
@@ -466,7 +466,8 @@ function TestimonialsSliderMinimal({
|
|
|
466
466
|
avatarClassName,
|
|
467
467
|
dotsClassName,
|
|
468
468
|
background,
|
|
469
|
-
|
|
469
|
+
containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
|
|
470
|
+
spacing = "xl",
|
|
470
471
|
pattern,
|
|
471
472
|
patternOpacity
|
|
472
473
|
}) {
|
|
@@ -498,9 +499,12 @@ function TestimonialsSliderMinimal({
|
|
|
498
499
|
if (typeof testimonial.author === "string") return testimonial.author;
|
|
499
500
|
return "";
|
|
500
501
|
}, []);
|
|
501
|
-
const getAvatarSrc = React.useCallback(
|
|
502
|
-
|
|
503
|
-
|
|
502
|
+
const getAvatarSrc = React.useCallback(
|
|
503
|
+
(testimonial) => {
|
|
504
|
+
return testimonial.avatarSrc || testimonial.avatar?.src;
|
|
505
|
+
},
|
|
506
|
+
[]
|
|
507
|
+
);
|
|
504
508
|
const getInitials = React.useCallback((name) => {
|
|
505
509
|
return name.split(" ").map((n) => n[0]).join("");
|
|
506
510
|
}, []);
|
|
@@ -545,7 +549,7 @@ function TestimonialsSliderMinimal({
|
|
|
545
549
|
] }),
|
|
546
550
|
/* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
547
551
|
current.author && (typeof current.author === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "font-semibold", children: current.author }) : current.author),
|
|
548
|
-
current.role && (typeof current.role === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm
|
|
552
|
+
current.role && (typeof current.role === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm ", children: current.role }) : current.role)
|
|
549
553
|
] })
|
|
550
554
|
]
|
|
551
555
|
}
|
|
@@ -553,7 +557,17 @@ function TestimonialsSliderMinimal({
|
|
|
553
557
|
]
|
|
554
558
|
}
|
|
555
559
|
);
|
|
556
|
-
}, [
|
|
560
|
+
}, [
|
|
561
|
+
testimonialsSlot,
|
|
562
|
+
isTransitioning,
|
|
563
|
+
current,
|
|
564
|
+
quoteClassName,
|
|
565
|
+
authorClassName,
|
|
566
|
+
avatarClassName,
|
|
567
|
+
getAuthorName,
|
|
568
|
+
getAvatarSrc,
|
|
569
|
+
getInitials
|
|
570
|
+
]);
|
|
557
571
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
558
572
|
Section,
|
|
559
573
|
{
|
|
@@ -562,6 +576,7 @@ function TestimonialsSliderMinimal({
|
|
|
562
576
|
pattern,
|
|
563
577
|
patternOpacity,
|
|
564
578
|
className,
|
|
579
|
+
containerClassName,
|
|
565
580
|
children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("mx-auto max-w-3xl text-center", contentClassName), children: [
|
|
566
581
|
renderedTestimonial,
|
|
567
582
|
testimonials && testimonials.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mt-8 flex justify-center gap-2", dotsClassName), children: testimonials.map((_, index) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -570,7 +585,7 @@ function TestimonialsSliderMinimal({
|
|
|
570
585
|
onClick: () => goToSlide(index),
|
|
571
586
|
className: cn(
|
|
572
587
|
"size-2 rounded-full transition-all",
|
|
573
|
-
index === currentIndex ? "w-6 bg-primary
|
|
588
|
+
index === currentIndex ? "w-6 bg-primary text-primary-foreground" : ""
|
|
574
589
|
),
|
|
575
590
|
"aria-label": `Go to testimonial ${index + 1}`
|
|
576
591
|
},
|
|
@@ -60,6 +60,10 @@ interface TestimonialsSliderMinimalProps {
|
|
|
60
60
|
* Pattern overlay opacity (0-1)
|
|
61
61
|
*/
|
|
62
62
|
patternOpacity?: number;
|
|
63
|
+
/**
|
|
64
|
+
* Additional CSS classes for the container
|
|
65
|
+
*/
|
|
66
|
+
containerClassName?: string;
|
|
63
67
|
}
|
|
64
68
|
/**
|
|
65
69
|
* TestimonialsSliderMinimal - A clean, auto-rotating testimonial slider with minimal
|
|
@@ -85,6 +89,6 @@ interface TestimonialsSliderMinimalProps {
|
|
|
85
89
|
* />
|
|
86
90
|
* ```
|
|
87
91
|
*/
|
|
88
|
-
declare function TestimonialsSliderMinimal({ testimonials, testimonialsSlot, autoPlayInterval, className, contentClassName, quoteClassName, authorClassName, avatarClassName, dotsClassName, background, spacing, pattern, patternOpacity, }: TestimonialsSliderMinimalProps): React.JSX.Element;
|
|
92
|
+
declare function TestimonialsSliderMinimal({ testimonials, testimonialsSlot, autoPlayInterval, className, contentClassName, quoteClassName, authorClassName, avatarClassName, dotsClassName, background, containerClassName, spacing, pattern, patternOpacity, }: TestimonialsSliderMinimalProps): React.JSX.Element;
|
|
89
93
|
|
|
90
94
|
export { TestimonialsSliderMinimal, type TestimonialsSliderMinimalProps };
|
|
@@ -60,6 +60,10 @@ interface TestimonialsSliderMinimalProps {
|
|
|
60
60
|
* Pattern overlay opacity (0-1)
|
|
61
61
|
*/
|
|
62
62
|
patternOpacity?: number;
|
|
63
|
+
/**
|
|
64
|
+
* Additional CSS classes for the container
|
|
65
|
+
*/
|
|
66
|
+
containerClassName?: string;
|
|
63
67
|
}
|
|
64
68
|
/**
|
|
65
69
|
* TestimonialsSliderMinimal - A clean, auto-rotating testimonial slider with minimal
|
|
@@ -85,6 +89,6 @@ interface TestimonialsSliderMinimalProps {
|
|
|
85
89
|
* />
|
|
86
90
|
* ```
|
|
87
91
|
*/
|
|
88
|
-
declare function TestimonialsSliderMinimal({ testimonials, testimonialsSlot, autoPlayInterval, className, contentClassName, quoteClassName, authorClassName, avatarClassName, dotsClassName, background, spacing, pattern, patternOpacity, }: TestimonialsSliderMinimalProps): React.JSX.Element;
|
|
92
|
+
declare function TestimonialsSliderMinimal({ testimonials, testimonialsSlot, autoPlayInterval, className, contentClassName, quoteClassName, authorClassName, avatarClassName, dotsClassName, background, containerClassName, spacing, pattern, patternOpacity, }: TestimonialsSliderMinimalProps): React.JSX.Element;
|
|
89
93
|
|
|
90
94
|
export { TestimonialsSliderMinimal, type TestimonialsSliderMinimalProps };
|
|
@@ -441,7 +441,8 @@ function TestimonialsSliderMinimal({
|
|
|
441
441
|
avatarClassName,
|
|
442
442
|
dotsClassName,
|
|
443
443
|
background,
|
|
444
|
-
|
|
444
|
+
containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
|
|
445
|
+
spacing = "xl",
|
|
445
446
|
pattern,
|
|
446
447
|
patternOpacity
|
|
447
448
|
}) {
|
|
@@ -473,9 +474,12 @@ function TestimonialsSliderMinimal({
|
|
|
473
474
|
if (typeof testimonial.author === "string") return testimonial.author;
|
|
474
475
|
return "";
|
|
475
476
|
}, []);
|
|
476
|
-
const getAvatarSrc = useCallback(
|
|
477
|
-
|
|
478
|
-
|
|
477
|
+
const getAvatarSrc = useCallback(
|
|
478
|
+
(testimonial) => {
|
|
479
|
+
return testimonial.avatarSrc || testimonial.avatar?.src;
|
|
480
|
+
},
|
|
481
|
+
[]
|
|
482
|
+
);
|
|
479
483
|
const getInitials = useCallback((name) => {
|
|
480
484
|
return name.split(" ").map((n) => n[0]).join("");
|
|
481
485
|
}, []);
|
|
@@ -520,7 +524,7 @@ function TestimonialsSliderMinimal({
|
|
|
520
524
|
] }),
|
|
521
525
|
/* @__PURE__ */ jsxs("div", { children: [
|
|
522
526
|
current.author && (typeof current.author === "string" ? /* @__PURE__ */ jsx("p", { className: "font-semibold", children: current.author }) : current.author),
|
|
523
|
-
current.role && (typeof current.role === "string" ? /* @__PURE__ */ jsx("p", { className: "text-sm
|
|
527
|
+
current.role && (typeof current.role === "string" ? /* @__PURE__ */ jsx("p", { className: "text-sm ", children: current.role }) : current.role)
|
|
524
528
|
] })
|
|
525
529
|
]
|
|
526
530
|
}
|
|
@@ -528,7 +532,17 @@ function TestimonialsSliderMinimal({
|
|
|
528
532
|
]
|
|
529
533
|
}
|
|
530
534
|
);
|
|
531
|
-
}, [
|
|
535
|
+
}, [
|
|
536
|
+
testimonialsSlot,
|
|
537
|
+
isTransitioning,
|
|
538
|
+
current,
|
|
539
|
+
quoteClassName,
|
|
540
|
+
authorClassName,
|
|
541
|
+
avatarClassName,
|
|
542
|
+
getAuthorName,
|
|
543
|
+
getAvatarSrc,
|
|
544
|
+
getInitials
|
|
545
|
+
]);
|
|
532
546
|
return /* @__PURE__ */ jsx(
|
|
533
547
|
Section,
|
|
534
548
|
{
|
|
@@ -537,6 +551,7 @@ function TestimonialsSliderMinimal({
|
|
|
537
551
|
pattern,
|
|
538
552
|
patternOpacity,
|
|
539
553
|
className,
|
|
554
|
+
containerClassName,
|
|
540
555
|
children: /* @__PURE__ */ jsxs("div", { className: cn("mx-auto max-w-3xl text-center", contentClassName), children: [
|
|
541
556
|
renderedTestimonial,
|
|
542
557
|
testimonials && testimonials.length > 0 && /* @__PURE__ */ jsx("div", { className: cn("mt-8 flex justify-center gap-2", dotsClassName), children: testimonials.map((_, index) => /* @__PURE__ */ jsx(
|
|
@@ -545,7 +560,7 @@ function TestimonialsSliderMinimal({
|
|
|
545
560
|
onClick: () => goToSlide(index),
|
|
546
561
|
className: cn(
|
|
547
562
|
"size-2 rounded-full transition-all",
|
|
548
|
-
index === currentIndex ? "w-6 bg-primary
|
|
563
|
+
index === currentIndex ? "w-6 bg-primary text-primary-foreground" : ""
|
|
549
564
|
),
|
|
550
565
|
"aria-label": `Go to testimonial ${index + 1}`
|
|
551
566
|
},
|
|
@@ -477,7 +477,8 @@ function TestimonialsSplitImage({
|
|
|
477
477
|
quoteClassName,
|
|
478
478
|
authorClassName,
|
|
479
479
|
background,
|
|
480
|
-
|
|
480
|
+
containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
|
|
481
|
+
spacing = "xl",
|
|
481
482
|
pattern,
|
|
482
483
|
patternOpacity,
|
|
483
484
|
optixFlowConfig
|
|
@@ -532,7 +533,7 @@ function TestimonialsSplitImage({
|
|
|
532
533
|
] }),
|
|
533
534
|
/* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
534
535
|
testimonial.author && (typeof testimonial.author === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "font-semibold", children: testimonial.author }) : testimonial.author),
|
|
535
|
-
(testimonial.role || testimonial.company) && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-sm
|
|
536
|
+
(testimonial.role || testimonial.company) && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-sm ", children: [
|
|
536
537
|
testimonial.role && (typeof testimonial.role === "string" ? testimonial.role : testimonial.role),
|
|
537
538
|
testimonial.company && (typeof testimonial.company === "string" ? ` at ${testimonial.company}` : testimonial.company)
|
|
538
539
|
] })
|
|
@@ -541,7 +542,18 @@ function TestimonialsSplitImage({
|
|
|
541
542
|
]
|
|
542
543
|
}
|
|
543
544
|
);
|
|
544
|
-
}, [
|
|
545
|
+
}, [
|
|
546
|
+
testimonialSlot,
|
|
547
|
+
effectiveImagePosition,
|
|
548
|
+
contentClassName,
|
|
549
|
+
quoteIconClassName,
|
|
550
|
+
testimonial,
|
|
551
|
+
quoteClassName,
|
|
552
|
+
authorClassName,
|
|
553
|
+
getAuthorName,
|
|
554
|
+
getAvatarSrc,
|
|
555
|
+
getInitials
|
|
556
|
+
]);
|
|
545
557
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
546
558
|
Section,
|
|
547
559
|
{
|
|
@@ -550,6 +562,7 @@ function TestimonialsSplitImage({
|
|
|
550
562
|
pattern,
|
|
551
563
|
patternOpacity,
|
|
552
564
|
className,
|
|
565
|
+
containerClassName,
|
|
553
566
|
children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
554
567
|
"div",
|
|
555
568
|
{
|
|
@@ -76,6 +76,10 @@ interface TestimonialsSplitImageProps {
|
|
|
76
76
|
* OptixFlow image optimization configuration
|
|
77
77
|
*/
|
|
78
78
|
optixFlowConfig?: OptixFlowConfig;
|
|
79
|
+
/**
|
|
80
|
+
* Additional CSS classes for the container
|
|
81
|
+
*/
|
|
82
|
+
containerClassName?: string;
|
|
79
83
|
}
|
|
80
84
|
/**
|
|
81
85
|
* TestimonialsSplitImage - A two-column split layout testimonial featuring a large
|
|
@@ -101,6 +105,6 @@ interface TestimonialsSplitImageProps {
|
|
|
101
105
|
* />
|
|
102
106
|
* ```
|
|
103
107
|
*/
|
|
104
|
-
declare function TestimonialsSplitImage({ testimonial, testimonialSlot, imageSrc, imageAlt, imagePosition, className, gridClassName, imageClassName, contentClassName, quoteIconClassName, quoteClassName, authorClassName, background, spacing, pattern, patternOpacity, optixFlowConfig, }: TestimonialsSplitImageProps): React.JSX.Element;
|
|
108
|
+
declare function TestimonialsSplitImage({ testimonial, testimonialSlot, imageSrc, imageAlt, imagePosition, className, gridClassName, imageClassName, contentClassName, quoteIconClassName, quoteClassName, authorClassName, background, containerClassName, spacing, pattern, patternOpacity, optixFlowConfig, }: TestimonialsSplitImageProps): React.JSX.Element;
|
|
105
109
|
|
|
106
110
|
export { TestimonialsSplitImage, type TestimonialsSplitImageProps };
|
|
@@ -76,6 +76,10 @@ interface TestimonialsSplitImageProps {
|
|
|
76
76
|
* OptixFlow image optimization configuration
|
|
77
77
|
*/
|
|
78
78
|
optixFlowConfig?: OptixFlowConfig;
|
|
79
|
+
/**
|
|
80
|
+
* Additional CSS classes for the container
|
|
81
|
+
*/
|
|
82
|
+
containerClassName?: string;
|
|
79
83
|
}
|
|
80
84
|
/**
|
|
81
85
|
* TestimonialsSplitImage - A two-column split layout testimonial featuring a large
|
|
@@ -101,6 +105,6 @@ interface TestimonialsSplitImageProps {
|
|
|
101
105
|
* />
|
|
102
106
|
* ```
|
|
103
107
|
*/
|
|
104
|
-
declare function TestimonialsSplitImage({ testimonial, testimonialSlot, imageSrc, imageAlt, imagePosition, className, gridClassName, imageClassName, contentClassName, quoteIconClassName, quoteClassName, authorClassName, background, spacing, pattern, patternOpacity, optixFlowConfig, }: TestimonialsSplitImageProps): React.JSX.Element;
|
|
108
|
+
declare function TestimonialsSplitImage({ testimonial, testimonialSlot, imageSrc, imageAlt, imagePosition, className, gridClassName, imageClassName, contentClassName, quoteIconClassName, quoteClassName, authorClassName, background, containerClassName, spacing, pattern, patternOpacity, optixFlowConfig, }: TestimonialsSplitImageProps): React.JSX.Element;
|
|
105
109
|
|
|
106
110
|
export { TestimonialsSplitImage, type TestimonialsSplitImageProps };
|
|
@@ -455,7 +455,8 @@ function TestimonialsSplitImage({
|
|
|
455
455
|
quoteClassName,
|
|
456
456
|
authorClassName,
|
|
457
457
|
background,
|
|
458
|
-
|
|
458
|
+
containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
|
|
459
|
+
spacing = "xl",
|
|
459
460
|
pattern,
|
|
460
461
|
patternOpacity,
|
|
461
462
|
optixFlowConfig
|
|
@@ -510,7 +511,7 @@ function TestimonialsSplitImage({
|
|
|
510
511
|
] }),
|
|
511
512
|
/* @__PURE__ */ jsxs("div", { children: [
|
|
512
513
|
testimonial.author && (typeof testimonial.author === "string" ? /* @__PURE__ */ jsx("p", { className: "font-semibold", children: testimonial.author }) : testimonial.author),
|
|
513
|
-
(testimonial.role || testimonial.company) && /* @__PURE__ */ jsxs("p", { className: "text-sm
|
|
514
|
+
(testimonial.role || testimonial.company) && /* @__PURE__ */ jsxs("p", { className: "text-sm ", children: [
|
|
514
515
|
testimonial.role && (typeof testimonial.role === "string" ? testimonial.role : testimonial.role),
|
|
515
516
|
testimonial.company && (typeof testimonial.company === "string" ? ` at ${testimonial.company}` : testimonial.company)
|
|
516
517
|
] })
|
|
@@ -519,7 +520,18 @@ function TestimonialsSplitImage({
|
|
|
519
520
|
]
|
|
520
521
|
}
|
|
521
522
|
);
|
|
522
|
-
}, [
|
|
523
|
+
}, [
|
|
524
|
+
testimonialSlot,
|
|
525
|
+
effectiveImagePosition,
|
|
526
|
+
contentClassName,
|
|
527
|
+
quoteIconClassName,
|
|
528
|
+
testimonial,
|
|
529
|
+
quoteClassName,
|
|
530
|
+
authorClassName,
|
|
531
|
+
getAuthorName,
|
|
532
|
+
getAvatarSrc,
|
|
533
|
+
getInitials
|
|
534
|
+
]);
|
|
523
535
|
return /* @__PURE__ */ jsx(
|
|
524
536
|
Section,
|
|
525
537
|
{
|
|
@@ -528,6 +540,7 @@ function TestimonialsSplitImage({
|
|
|
528
540
|
pattern,
|
|
529
541
|
patternOpacity,
|
|
530
542
|
className,
|
|
543
|
+
containerClassName,
|
|
531
544
|
children: /* @__PURE__ */ jsxs(
|
|
532
545
|
"div",
|
|
533
546
|
{
|