@droppxdev/productcardrn
Version:
###### **Installation**
76 lines (31 loc) • 1.63 kB
Markdown
#### **Product card RN**
###### **Installation**
`npm install @droppxdev/productcardrn`
###### **Usage**
`import ProductCard from '@droppxdev/productcardrn';`
`<ProductCard item={Name: ''ProductName', Description: 'Loren ipsum'} />`
###### **Purpose**
This component is for showcasing products on the mobile front-end in the form of cards.
###### **Type of props**
**`Name`**
Accepts a string containing the name of the product.
**`Description`**
Accepts a string with short description of the product.
**`Price`**
Accepts an integer specifying the numerical price of the product.
**`Discounted_Price`**
Accepts an integer that might be optionally available from data that specifies a lower numerical price of the product. if available, it will be shown instead of normal price.
**`Ratings`**
Accepts a numerical value from 1 - 5 specifying the rating of a product by a user. Contains an onClick named onStartRating that invokes a prop function which calculates the rating when clicked.
**`Favourite`**
Accepts a boolean that specifies if a product is marked as a favourite or not. If returns true, a red heart icon is shown, if returns false, a white heart icon is shown.
**`image`**
Accepts URL
**`Methods as props`**
1. `::userFavourited`
Executes logic for favorite and un-favorite
2. `::userRating`
Executes logic for rating a product
3. `::onClickCard`
Executes logic for when the product title is clicked
Sample : https://firebasestorage.googleapis.com/v0/b/droppx-45ac7.appspot.com/o/droppx%2FProductcard.png?alt=media&token=e1356a09-47fc-4804-a9d3-34fa5064d06b