0.19.5 • Published 1 month ago

@bolttech/atoms-testimonial-card v0.19.5

Weekly downloads
-
License
-
Repository
-
Last release
1 month ago

Testimonial Card Component

The TestimonialCard component is a versatile React component designed to display user testimonials or reviews with customizable content.

Table of Contents

Installation

To use the TestimonialCard component in your React application, follow these steps:

Installation

npm install @bolttech/frontend-foundations @bolttech/atoms-testimonial-card

or

yarn add @bolttech/frontend-foundations @bolttech/atoms-testimonial-card

Once you have the required dependencies installed, you can start using the TestimonialCard component in your React application.

Usage

The TestimonialCard component provides a flexible and customizable way to display user testimonials or reviews with various content elements.

To use the component, import it and include it in your JSX:

import React from 'react';
import {TestimonialCard} from '@bolttech/atoms-testimonial-card';
import {bolttechTheme, BolttechThemeProvider} from "@bolttech/frontend-foundations"; // You can import your TestimonialCard component here

function App() {
  return (
    <BolttechThemeProvider theme={bolttechTheme}>
      <TestimonialCard
        title="Great Product"
        description="I am amazed by the quality and features of this product. Highly recommended!"
        userName="John Doe"
        userLocation="New York, USA"
        dataTestId="testimonial-card"
      />
    </BolttechThemeProvider>
  );
}

export default App;

Props

The TestimonialCard component accepts the following props:

PropTypeDescription
titlestringThe title of the testimonial.
descriptionstringThe main content of the testimonial.
imageReactNodeAn optional image or avatar associated with the testimonial.
userNamestringThe name of the user providing the testimonial.
userLocationstringThe location of the user providing the testimonial.
idstringThe id attribute for the testimonial card container.
dataTestIdstringThe data-testid attribute for testing purposes.

Example

Here's an example of using the TestimonialCard component:

<TestimonialCard
  title="Great Product"
  description="I am amazed by the quality and features of this product. Highly recommended!"
  userName="John Doe"
  userLocation="New York, USA"
  dataTestId="testimonial-card"
/>

This will render a testimonial card with the provided title, description, user information, and optional image or avatar.

Contributing

Contributions to the TestimonialCard component are welcome. If you find any issues or have suggestions for improvements, please feel free to open an issue or submit a pull request on the project's Bitbucket repository.

0.19.5

1 month ago

0.19.4

2 months ago

0.19.3

4 months ago

0.19.1

6 months ago

0.19.2

6 months ago

0.19.0

6 months ago

0.18.1

6 months ago

0.11.0

9 months ago

0.12.0

9 months ago

0.13.0

9 months ago

0.14.0

9 months ago

0.15.0

8 months ago

0.16.0

8 months ago

0.17.0

7 months ago

0.18.0

6 months ago

0.10.0

10 months ago

0.0.1

10 months ago

0.8.0

10 months ago

0.5.3

10 months ago

0.7.0

10 months ago

0.6.0

10 months ago

0.5.2

11 months ago

0.5.0

11 months ago

0.4.1

11 months ago

0.3.2

12 months ago

0.4.0

11 months ago

0.5.1

11 months ago

0.3.0

1 year ago

0.2.1

1 year ago

0.2.0

1 year ago

0.3.1

1 year ago

0.1.6

1 year ago

0.1.5

1 year ago

0.1.4

1 year ago

0.1.3

1 year ago

0.1.2

1 year ago

0.1.1

1 year ago

0.1.0

1 year ago