@findify/react-components
Version:
Findify react UI components
69 lines • 2.52 kB
JavaScript
/**
* @module components/Cards/Product/Stickers
*/
import cx from 'classnames';
import Text from "../../../Text";
import Branch from "../../../common/Branch";
import withTheme from "../../../../helpers/withTheme";
var theme = {
"discount-sticker": "findify-components--cards--product--stickers__discount-sticker",
"out-of-stock-sticker": "findify-components--cards--product--stickers__out-of-stock-sticker",
"discountSticker": "findify-components--cards--product--stickers__discount-sticker",
"outOfStockSticker": "findify-components--cards--product--stickers__out-of-stock-sticker"
};
import { fromJS } from 'immutable';
import { jsx as _jsx } from "react/jsx-runtime";
var defaultDiscountConfig = fromJS({
position: 'top-right',
template: {
single: '%s% OFF',
multiple: 'Up to %s% off'
},
styles: {
background: '#c483b3',
color: '#ffffff',
fontFamily: "'Helvetica Neue', Helvetica, Arial, sans-serif;",
fontSize: '14',
fontWeight: '700'
}
});
var defaultOutOfStockConfig = fromJS({
template: {
single: 'Out of stock'
}
});
export var DiscountSticker = withTheme(theme)(function (_ref) {
var className = _ref.className,
discount = _ref.discount,
theme = _ref.theme,
config = _ref.config;
var realConfig = config.get('stickers');
if (!realConfig || !realConfig.get('discount')) realConfig = defaultDiscountConfig;else realConfig = realConfig.get('discount');
return /*#__PURE__*/_jsx("div", {
className: cx(theme.discountSticker, className),
children: /*#__PURE__*/_jsx(Text, {
bold: true,
children: /*#__PURE__*/_jsx(Branch, {
condition: discount.size > 1,
left: function left() {
return realConfig.getIn(['template', 'multiple']).replace('%s', Math.max.apply(Math, discount.toJS()));
},
right: function right() {
return (realConfig.getIn(['template', 'single']) || realConfig.get('template')).replace('%s', Math.max.apply(Math, discount.toJS()));
}
})
})
});
});
export var OutOfStockSticker = withTheme(theme)(function (_ref2) {
var className = _ref2.className,
theme = _ref2.theme,
config = _ref2.config;
var realConfig = config.getIn(['stickers', 'out-of-stock'], defaultOutOfStockConfig);
return /*#__PURE__*/_jsx("div", {
className: cx(theme.outOfStockSticker, className),
children: /*#__PURE__*/_jsx(Text, {
children: realConfig.getIn(['template', 'single']) || realConfig.get('template')
})
});
});