@droppxdev/productcardrn
Version:
###### **Installation**
1 lines • 7.48 kB
JavaScript
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _taggedTemplateLiteralLoose2=_interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _react=_interopRequireDefault(require("react"));var _reactNative=require("react-native");var _styledComponents=_interopRequireDefault(require("styled-components"));var _reactNativeRatings=require("react-native-ratings");var _favRed=_interopRequireDefault(require("../../assets/icons/fav-red.png"));var _favWhite=_interopRequireDefault(require("../../assets/icons/fav-white.png"));var _jsxFileName="/Users/olaoluwa/WebstormProjects/productcardrn/components/productcardrn/index.js";function _templateObject12(){var data=(0,_taggedTemplateLiteralLoose2.default)(["\n\tpadding-top: 10px;\n\tfont-weight: 300;\n"]);_templateObject12=function _templateObject12(){return data;};return data;}function _templateObject11(){var data=(0,_taggedTemplateLiteralLoose2.default)(["\ntext-decoration: none;\nfont-size: 20px;\n"]);_templateObject11=function _templateObject11(){return data;};return data;}function _templateObject10(){var data=(0,_taggedTemplateLiteralLoose2.default)(["\ntext-decoration: line-through;\nfont-size: 14px;\nmargin: 0 10px 0 0;\n"]);_templateObject10=function _templateObject10(){return data;};return data;}function _templateObject9(){var data=(0,_taggedTemplateLiteralLoose2.default)(["\n\tcolor: #666666;\n\tfont-size: 15px;\n\tfont-weight: 800;\n\tmargin: 10px 10px 10px 0;\n\tflexDirection: row \n\talignItems: flex-start\n"]);_templateObject9=function _templateObject9(){return data;};return data;}function _templateObject8(){var data=(0,_taggedTemplateLiteralLoose2.default)(["\n\tmargin: 10px 10px 10px 0;\n\tflexDirection: column \n\talignItems: flex-start\n"]);_templateObject8=function _templateObject8(){return data;};return data;}function _templateObject7(){var data=(0,_taggedTemplateLiteralLoose2.default)(["\n\twidth: 15%;\n\theight: 12%\n\tposition: absolute;\n\tzIndex: 99999;\n\tdisplay: flex \n\ttop: 10%;\n\tleft: 10%;\n"]);_templateObject7=function _templateObject7(){return data;};return data;}function _templateObject6(){var data=(0,_taggedTemplateLiteralLoose2.default)(["\n\tcolor : #b8b3c3;\n\tfont-size: 16px;\n\tmargin: 5px 10px 10px 0;\n\ttext-align: left;\n\tmax-width: 90%;\n"]);_templateObject6=function _templateObject6(){return data;};return data;}function _templateObject5(){var data=(0,_taggedTemplateLiteralLoose2.default)(["\n\tcolor: #3c4560;\n\tfont-size: 24px;\n font-weight: 800;\n\tfont-family: 'Arial';\n\tmax-width: 90%;\n"]);_templateObject5=function _templateObject5(){return data;};return data;}function _templateObject4(){var data=(0,_taggedTemplateLiteralLoose2.default)(["\n\tmargin: 20px 0 0 5px;\n\twidth: 100%;\n\theight: 50%;\n"]);_templateObject4=function _templateObject4(){return data;};return data;}function _templateObject3(){var data=(0,_taggedTemplateLiteralLoose2.default)(["\n\twidth: 100%;\n\theight: 100%;\n"]);_templateObject3=function _templateObject3(){return data;};return data;}function _templateObject2(){var data=(0,_taggedTemplateLiteralLoose2.default)(["\n\twidth: 100%;\n\theight: 50%;\n\tborder-top-left-radius: 5px;\n\tborder-top-right-radius: 5px;\n\toverflow: hidden;\n"]);_templateObject2=function _templateObject2(){return data;};return data;}function _templateObject(){var data=(0,_taggedTemplateLiteralLoose2.default)(["\n\tbackground: #fff;\n\theight: 50%;\n\twidth: 60%;\n\tborder-radius: 5px;\n\tmargin: 10px;\n\tfont-size: 100;\n\ttext-align: left;\n"]);_templateObject=function _templateObject(){return data;};return data;}function priceAfterDiscount(price,discountPercentage){return(price-Number(discountPercentage)/100*Number(price)).toFixed(2);}function RenderDiscount(props){return _react.default.createElement(_reactNative.View,{__source:{fileName:_jsxFileName,lineNumber:27}},props.initialPrice?_react.default.createElement(PriceTextStrike,{__source:{fileName:_jsxFileName,lineNumber:28}},props.initialPrice):'',_react.default.createElement(PriceText,{__source:{fileName:_jsxFileName,lineNumber:29}},props.newPrice,"\u20AC"));}var ProductCard=function ProductCard(props){var _props$item=props.item,Name=_props$item.Name,Description=_props$item.Description,Price=_props$item.Price,Discounted_Price=_props$item.Discounted_Price,Ratings=_props$item.Ratings,Favourite=_props$item.Favourite;var userRating=props.userRating,userFavourited=props.userFavourited,image=props.image,onClickCard=props.onClickCard;return _react.default.createElement(_reactNative.SafeAreaView,{__source:{fileName:_jsxFileName,lineNumber:38}},_react.default.createElement(Container,{__source:{fileName:_jsxFileName,lineNumber:39}},_react.default.createElement(Cover,{__source:{fileName:_jsxFileName,lineNumber:40}},_react.default.createElement(_reactNative.TouchableWithoutFeedback,{onPress:userFavourited,__source:{fileName:_jsxFileName,lineNumber:42}},Favourite?_react.default.createElement(Icon,{source:_favRed.default,__source:{fileName:_jsxFileName,lineNumber:42}}):_react.default.createElement(Icon,{source:_favWhite.default,__source:{fileName:_jsxFileName,lineNumber:42}})),_react.default.createElement(Image,{source:image?image:{uri:'https://via.placeholder.com/468x468.png?text=Droppx+Technology+Oy'},__source:{fileName:_jsxFileName,lineNumber:44}})),_react.default.createElement(Content,{__source:{fileName:_jsxFileName,lineNumber:46}},_react.default.createElement(_reactNative.TouchableWithoutFeedback,{onPress:onClickCard,__source:{fileName:_jsxFileName,lineNumber:48}},_react.default.createElement(Title,{__source:{fileName:_jsxFileName,lineNumber:48}},Name.substring(0,20))),_react.default.createElement(Subtitle,{__source:{fileName:_jsxFileName,lineNumber:49}},Description.substring(0,76)),Price?_react.default.createElement(PriceCaption,{__source:{fileName:_jsxFileName,lineNumber:53}},Number(Discounted_Price)!==0?_react.default.createElement(RenderDiscount,{initialPrice:Price,newPrice:priceAfterDiscount(Price,Discounted_Price),__source:{fileName:_jsxFileName,lineNumber:54}}):_react.default.createElement(RenderDiscount,{newPrice:Price,__source:{fileName:_jsxFileName,lineNumber:55}})):'',Ratings?_react.default.createElement(Review,{__source:{fileName:_jsxFileName,lineNumber:60}},_react.default.createElement(_reactNativeRatings.Rating,{ratingCount:5,startingValue:Ratings,imageSize:18,onStartRating:userRating,__source:{fileName:_jsxFileName,lineNumber:61}})):null,_react.default.createElement(Extras,{__source:{fileName:_jsxFileName,lineNumber:66}},props.children))));};var _default=ProductCard;exports.default=_default;var Container=_styledComponents.default.View(_templateObject());var Cover=_styledComponents.default.View(_templateObject2());var Image=_styledComponents.default.Image(_templateObject3());var Content=_styledComponents.default.View(_templateObject4());var Title=_styledComponents.default.Text(_templateObject5());var Subtitle=_styledComponents.default.Text(_templateObject6());var Icon=_styledComponents.default.Image(_templateObject7());var Review=_styledComponents.default.View(_templateObject8());var PriceCaption=_styledComponents.default.View(_templateObject9());var PriceTextStrike=_styledComponents.default.Text(_templateObject10());var PriceText=_styledComponents.default.Text(_templateObject11());var Extras=_styledComponents.default.Text(_templateObject12());