@stackshift-ui/testimonial 6.0.13 → 7.0.0-beta.0

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.
Files changed (6) hide show
  1. package/package.json +16 -16
  2. package/src/testimonial.test.tsx +2 -2
  3. package/src/testimonial_a.tsx +8 -6
  4. package/src/testimonial_b.tsx +12 -10
  5. package/src/testimonial_c.tsx +4 -4
  6. package/src/testimonial_d.tsx +5 -5
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@stackshift-ui/testimonial",
3
3
  "description": "",
4
- "version": "6.0.13",
4
+ "version": "7.0.0-beta.0",
5
5
  "private": false,
6
6
  "sideEffects": false,
7
7
  "main": "./dist/index.js",
@@ -29,30 +29,30 @@
29
29
  "typescript": "^5.6.2",
30
30
  "vite-tsconfig-paths": "^5.0.1",
31
31
  "vitest": "^2.1.1",
32
- "@stackshift-ui/eslint-config": "6.0.10",
33
- "@stackshift-ui/typescript-config": "6.0.10"
32
+ "@stackshift-ui/typescript-config": "6.0.10",
33
+ "@stackshift-ui/eslint-config": "6.0.10"
34
34
  },
35
35
  "dependencies": {
36
36
  "classnames": "^2.5.1",
37
- "@stackshift-ui/scripts": "6.0.10",
38
- "@stackshift-ui/system": "6.0.11",
39
- "@stackshift-ui/avatar": "6.0.13",
40
- "@stackshift-ui/card": "6.0.11",
41
- "@stackshift-ui/text": "6.0.11",
42
- "@stackshift-ui/heading": "6.0.11",
43
- "@stackshift-ui/image": "6.0.11",
44
- "@stackshift-ui/swiper-button": "6.0.11",
45
- "@stackshift-ui/swiper-pagination": "6.0.11",
46
- "@stackshift-ui/section": "6.0.11",
47
- "@stackshift-ui/container": "6.0.11",
48
- "@stackshift-ui/flex": "6.0.11"
37
+ "@stackshift-ui/scripts": "6.1.0-beta.0",
38
+ "@stackshift-ui/card": "7.0.0-beta.0",
39
+ "@stackshift-ui/text": "7.0.0-beta.0",
40
+ "@stackshift-ui/image": "6.1.0-beta.0",
41
+ "@stackshift-ui/heading": "7.0.0-beta.0",
42
+ "@stackshift-ui/system": "6.1.0-beta.0",
43
+ "@stackshift-ui/swiper-pagination": "7.0.0-beta.0",
44
+ "@stackshift-ui/container": "7.0.0-beta.0",
45
+ "@stackshift-ui/section": "7.0.0-beta.0",
46
+ "@stackshift-ui/flex": "7.0.0-beta.0",
47
+ "@stackshift-ui/avatar": "7.0.0-beta.0",
48
+ "@stackshift-ui/swiper-button": "7.0.0-beta.0"
49
49
  },
50
50
  "peerDependencies": {
51
51
  "@types/react": "16.8 - 19",
52
52
  "next": "10 - 14",
53
53
  "react": "16.8 - 19",
54
54
  "react-dom": "16.8 - 19",
55
- "@stackshift-ui/system": ">=6.0.11"
55
+ "@stackshift-ui/system": ">=6.1.0-beta.0"
56
56
  },
57
57
  "peerDependenciesMeta": {
58
58
  "next": {
package/src/testimonial.test.tsx CHANGED
@@ -7,7 +7,7 @@ describe.concurrent("testimonial", () => {
7
7
 
8
8
  test.skip("Dummy test - test if renders without errors", ({ expect }) => {
9
9
  const clx = "my-class";
10
- render(<Testimonial />);
11
- expect(screen.getByTestId("{ kebabCase name }}").classList).toContain(clx);
10
+ render(<Testimonial data-testid="testimonial" />);
11
+ expect(screen.getByTestId("testimonial").classList).toContain(clx);
12
12
  });
13
13
  });
package/src/testimonial_a.tsx CHANGED
@@ -1,4 +1,4 @@
1
- import { Card } from "@stackshift-ui/card";
1
+ import { Card, CardContent } from "@stackshift-ui/card";
2
2
  import { Container } from "@stackshift-ui/container";
3
3
  import { Flex } from "@stackshift-ui/flex";
4
4
  import { Heading } from "@stackshift-ui/heading";
@@ -20,11 +20,13 @@ export default function Testimonial_A({ testimonials }: TestimonialProps) {
20
20
  return (
21
21
  <Section className="py-20 bg-background">
22
22
  <Container maxWidth={1280}>
23
- <Card className="py-10" borderRadius="md">
24
- <Flex wrap align="center" justify="center" className="max-w-5xl p-4">
25
- <AvatarSection testimonials={testimonials} testimony={testimony} />
26
- <TestimonyContent testimonials={testimonials} testimony={testimony} slider={slider} />
27
- </Flex>
23
+ <Card className="py-10 rounded-md">
24
+ <CardContent className="p-0 w-full h-full">
25
+ <Flex wrap align="center" justify="center" className="max-w-5xl p-4">
26
+ <AvatarSection testimonials={testimonials} testimony={testimony} />
27
+ <TestimonyContent testimonials={testimonials} testimony={testimony} slider={slider} />
28
+ </Flex>
29
+ </CardContent>
28
30
  </Card>
29
31
  </Container>
30
32
  </Section>
package/src/testimonial_b.tsx CHANGED
@@ -1,4 +1,4 @@
1
- import { Card } from "@stackshift-ui/card";
1
+ import { Card, CardContent } from "@stackshift-ui/card";
2
2
  import { Container } from "@stackshift-ui/container";
3
3
  import { Flex } from "@stackshift-ui/flex";
4
4
  import { Heading } from "@stackshift-ui/heading";
@@ -78,7 +78,7 @@ function SwiperControl({
78
78
  {testimony?.length >= 4 && (
79
79
  <SwiperButton
80
80
  type="left"
81
- className="p-4 bg-white"
81
+ className="p-4 bg-white w-12 h-12 flex items-center justify-center"
82
82
  onClick={() => slider("prev")}
83
83
  ariaLabel="Show previous testimonial"
84
84
  />
@@ -88,7 +88,7 @@ function SwiperControl({
88
88
  {testimony?.length >= 4 && (
89
89
  <SwiperButton
90
90
  type="right"
91
- className="p-4 bg-white"
91
+ className="p-4 bg-white w-12 h-12 flex items-center justify-center"
92
92
  onClick={() => slider("next")}
93
93
  ariaLabel="Show next testimonial"
94
94
  />
@@ -124,13 +124,15 @@ function TestimonialItem({
124
124
 
125
125
  return (
126
126
  <div className="flex-1 mb-4 px-3 w-full lg:w-1/3">
127
- <Card className="p-5 h-full" borderRadius="md">
128
- <QuoteIcon />
129
- <Text className="mb-4 leading-loose" muted>
130
- {testimony}
131
- </Text>
132
- <Text weight="bold">{name}</Text>
133
- <Text muted>{jobTitle}</Text>
127
+ <Card className="p-5 h-full rounded-md">
128
+ <CardContent className="p-0 w-full h-full">
129
+ <QuoteIcon />
130
+ <Text className="mb-4 leading-loose" muted>
131
+ {testimony}
132
+ </Text>
133
+ <Text weight="bold">{name}</Text>
134
+ <Text muted>{jobTitle}</Text>
135
+ </CardContent>
134
136
  </Card>
135
137
  </div>
136
138
  );
package/src/testimonial_c.tsx CHANGED
@@ -72,11 +72,11 @@ function TestimonialSwiper({
72
72
  if (!testimony) return null;
73
73
 
74
74
  return (
75
- <div className="w-full lg:w-1/5">
75
+ <div className="w-full lg:w-1/5 flex items-center gap-4">
76
76
  {testimony && testimony?.length >= 4 && (
77
77
  <SwiperButton
78
78
  type="left"
79
- className="order-last p-5 mr-4 bg-white lg:order-first"
79
+ className="order-last p-5 mr-4 bg-white lg:order-first w-12 h-12 flex items-center justify-center"
80
80
  onClick={() => slider("prev")}
81
81
  ariaLabel="Show previous testimonial"
82
82
  />
@@ -84,7 +84,7 @@ function TestimonialSwiper({
84
84
  {testimony && testimony?.length >= 4 && (
85
85
  <SwiperButton
86
86
  type="right"
87
- className="order-last p-5 bg-white"
87
+ className="order-last p-5 bg-white w-12 h-12 flex items-center justify-center"
88
88
  onClick={() => slider("next")}
89
89
  ariaLabel="Show next testimonial"
90
90
  />
@@ -114,7 +114,7 @@ function TestimonialItem({ item, index }: { item?: iTestimonial; index: number }
114
114
 
115
115
  return (
116
116
  <div className="flex-1 w-full px-3 mb-4 lg:w-1/3" key={index}>
117
- <Card className="p-8 text-center h-full items-center" borderRadius="md">
117
+ <Card className="p-8 text-center h-full items-center rounded-md">
118
118
  <Text className="mb-8 leading-loose" muted>
119
119
  {item?.testimony}
120
120
  </Text>
package/src/testimonial_d.tsx CHANGED
@@ -38,7 +38,7 @@ export default function Testimonial_D({ testimonials }: TestimonialProps) {
38
38
  {testimonials && testimonials?.length > 1 && (
39
39
  <SwiperButton
40
40
  type="left"
41
- className="p-4 mr-6 bg-white lg:order-first lg:mr-0"
41
+ className="p-4 mr-6 bg-white lg:order-first lg:mr-0 w-12 h-12 flex items-center justify-center"
42
42
  onClick={() => handleSlider("prev")}
43
43
  ariaLabel="Show previous testimonial"
44
44
  />
@@ -46,7 +46,7 @@ export default function Testimonial_D({ testimonials }: TestimonialProps) {
46
46
  {testimonials && testimonials?.length > 1 && (
47
47
  <SwiperButton
48
48
  type="right"
49
- className="p-4 mr-6 bg-white lg:order-first lg:mr-0"
49
+ className="p-4 mr-6 bg-white lg:order-first lg:mr-0 w-12 h-12 flex items-center justify-center"
50
50
  onClick={() => handleSlider("next")}
51
51
  ariaLabel="Show next testimonial"
52
52
  />
@@ -55,13 +55,13 @@ export default function Testimonial_D({ testimonials }: TestimonialProps) {
55
55
  {testimonials && testimonials?.length > 1 && (
56
56
  <SwiperButton
57
57
  type="left"
58
- className="hidden p-4 mr-6 bg-white lg:block lg:order-first lg:mr-0"
58
+ className="hidden p-4 mr-6 bg-white lg:flex lg:order-first lg:mr-0 w-12 h-12 items-center justify-center"
59
59
  onClick={() => handleSlider("prev")}
60
60
  ariaLabel="Show previous testimonial"
61
61
  />
62
62
  )}
63
63
  {testimonials?.[currentIndex] && (
64
- <Card className="flex flex-wrap w-full" borderRadius="md">
64
+ <Card className="flex flex-wrap w-full rounded-md">
65
65
  {testimonials?.[currentIndex]?.rating && (
66
66
  <div className="w-full py-10 text-center border-b lg:border-r lg:border-b-0 lg:w-1/3">
67
67
  <span className="text-5xl font-bold lg:text-6xl">
@@ -104,7 +104,7 @@ export default function Testimonial_D({ testimonials }: TestimonialProps) {
104
104
  {testimonials && testimonials?.length > 1 && (
105
105
  <SwiperButton
106
106
  type="right"
107
- className="hidden bg-white lg:block p-4 mr-6 lg:mr-0"
107
+ className="hidden bg-white lg:flex p-4 mr-6 lg:mr-0 w-12 h-12 items-center justify-center"
108
108
  onClick={() => handleSlider("next")}
109
109
  ariaLabel="Show next testimonial"
110
110
  />